diff --git a/docs/app.py b/docs/app.py index 460ffb1..eaf979d 100644 --- a/docs/app.py +++ b/docs/app.py @@ -128,8 +128,17 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): "label": get_text("Flex", "Flex 弹性布局"), "key": "flex" }, { - "label": get_text("Grid", "Grid 栅格布局"), + "label": get_text("Grid", "Grid 栅格"), "key": "grid" + }, { + "label": get_text("Layout", "Layout 布局"), + "key": "layout" + }, { + "label": get_text("Space", "Space 间距"), + "key": "space" + }, { + "label": get_text("Splitter", "Splitter 分割面板"), + "key": "splitter" }] }] diff --git a/docs/components/antd/layout/README-zh_CN.md b/docs/components/antd/layout/README-zh_CN.md new file mode 100644 index 0000000..dd78e41 --- /dev/null +++ b/docs/components/antd/layout/README-zh_CN.md @@ -0,0 +1,7 @@ +# Layout + +Handling the overall layout of a page. See [Ant Design](https://ant.design/components/layout/) for more information. + +## Examples + + diff --git a/docs/components/antd/layout/README.md b/docs/components/antd/layout/README.md new file mode 100644 index 0000000..dd78e41 --- /dev/null +++ b/docs/components/antd/layout/README.md @@ -0,0 +1,7 @@ +# Layout + +Handling the overall layout of a page. See [Ant Design](https://ant.design/components/layout/) for more information. + +## Examples + + diff --git a/docs/components/antd/layout/app.py b/docs/components/antd/layout/app.py new file mode 100644 index 0000000..0018b7c --- /dev/null +++ b/docs/components/antd/layout/app.py @@ -0,0 +1,6 @@ +from helper.Docs import Docs + +docs = Docs(__file__) + +if __name__ == "__main__": + docs.render().queue().launch() diff --git a/docs/components/antd/layout/demos/basic.py b/docs/components/antd/layout/demos/basic.py new file mode 100644 index 0000000..e566ac6 --- /dev/null +++ b/docs/components/antd/layout/demos/basic.py @@ -0,0 +1,88 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +header_style = { + "textAlign": 'center', + "color": '#fff', + "height": 64, + "paddingInline": 48, + "lineHeight": '64px', + "backgroundColor": '#4096ff', +} + +content_style = { + "textAlign": 'center', + "minHeight": 120, + "lineHeight": '120px', + "color": '#fff', + "backgroundColor": '#0958d9', +} + +sider_style = { + "textAlign": 'center', + "lineHeight": '120px', + "color": '#fff', + "backgroundColor": '#1677ff', +} + +footer_style = { + "textAlign": 'center', + "color": '#fff', + "backgroundColor": '#4096ff', +} + +layout_style = { + "borderRadius": 8, + "overflow": 'hidden', + "width": 'calc(50% - 8px)', + "maxWidth": 'calc(50% - 8px)', +} + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Flex(gap="middle", wrap="wrap"): + with antd.Layout(elem_style=layout_style): + with antd.Layout.Header(elem_style=header_style): + ms.Text("Header") + with antd.Layout.Content(elem_style=content_style): + ms.Text("Content") + with antd.Layout.Footer(elem_style=footer_style): + ms.Text("Footer") + with antd.Layout(elem_style=layout_style): + with antd.Layout.Header(elem_style=header_style): + ms.Text("Header") + with antd.Layout(): + with antd.Layout.Sider(width="25%", + elem_style=sider_style): + ms.Text("Sider") + with antd.Layout.Content(elem_style=content_style): + ms.Text("Content") + with antd.Layout.Footer(elem_style=footer_style): + ms.Text("Footer") + with antd.Layout(elem_style=layout_style): + with antd.Layout.Header(elem_style=header_style): + ms.Text("Header") + with antd.Layout(): + with antd.Layout.Content(elem_style=content_style): + ms.Text("Content") + with antd.Layout.Sider(width="25%", + elem_style=sider_style): + ms.Text("Sider") + with antd.Layout.Footer(elem_style=footer_style): + ms.Text("Footer") + with antd.Layout(elem_style=layout_style): + with antd.Layout.Sider(width="25%", + elem_style=sider_style): + ms.Text("Sider") + with antd.Layout(): + with antd.Layout.Header(elem_style=header_style): + ms.Text("Header") + with antd.Layout.Content(elem_style=content_style): + ms.Text("Content") + with antd.Layout.Footer(elem_style=footer_style): + ms.Text("Footer") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/space/README-zh_CN.md b/docs/components/antd/space/README-zh_CN.md new file mode 100644 index 0000000..8eb5de8 --- /dev/null +++ b/docs/components/antd/space/README-zh_CN.md @@ -0,0 +1,7 @@ +# Space + +Set components spacing. See [Ant Design](https://ant.design/components/space/) for more information. + +## Examples + + diff --git a/docs/components/antd/space/README.md b/docs/components/antd/space/README.md new file mode 100644 index 0000000..8eb5de8 --- /dev/null +++ b/docs/components/antd/space/README.md @@ -0,0 +1,7 @@ +# Space + +Set components spacing. See [Ant Design](https://ant.design/components/space/) for more information. + +## Examples + + diff --git a/docs/components/antd/space/app.py b/docs/components/antd/space/app.py new file mode 100644 index 0000000..0018b7c --- /dev/null +++ b/docs/components/antd/space/app.py @@ -0,0 +1,6 @@ +from helper.Docs import Docs + +docs = Docs(__file__) + +if __name__ == "__main__": + docs.render().queue().launch() diff --git a/docs/components/antd/space/demos/basic.py b/docs/components/antd/space/demos/basic.py new file mode 100644 index 0000000..b9ae021 --- /dev/null +++ b/docs/components/antd/space/demos/basic.py @@ -0,0 +1,15 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + antd.Button("Primary", type="primary") + antd.Button("Default") + antd.Button("Dashed", type="dashed") + ms.Text("Space") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/splitter/README-zh_CN.md b/docs/components/antd/splitter/README-zh_CN.md new file mode 100644 index 0000000..68d7064 --- /dev/null +++ b/docs/components/antd/splitter/README-zh_CN.md @@ -0,0 +1,7 @@ +# Splitter + +Split panels to isolate. See [Ant Design](https://ant.design/components/space/) for more information. + +## Examples + + diff --git a/docs/components/antd/splitter/README.md b/docs/components/antd/splitter/README.md new file mode 100644 index 0000000..68d7064 --- /dev/null +++ b/docs/components/antd/splitter/README.md @@ -0,0 +1,7 @@ +# Splitter + +Split panels to isolate. See [Ant Design](https://ant.design/components/space/) for more information. + +## Examples + + diff --git a/docs/components/antd/splitter/app.py b/docs/components/antd/splitter/app.py new file mode 100644 index 0000000..0018b7c --- /dev/null +++ b/docs/components/antd/splitter/app.py @@ -0,0 +1,6 @@ +from helper.Docs import Docs + +docs = Docs(__file__) + +if __name__ == "__main__": + docs.render().queue().launch() diff --git a/docs/components/antd/splitter/demos/basic.py b/docs/components/antd/splitter/demos/basic.py new file mode 100644 index 0000000..5d03acb --- /dev/null +++ b/docs/components/antd/splitter/demos/basic.py @@ -0,0 +1,30 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + + +def Desc(text: str): + with antd.Flex(justify="center"): + with antd.Typography.Title(type="secondary", + level=5, + elem_style=dict(whiteSpace="nowrap")): + ms.Text(text) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Splitter(elem_style=dict( + height=500, boxShadow='0 0 10px rgba(0, 0, 0, 0.1)')): + with antd.Splitter.Panel(collapsible=True): + Desc("Left") + with antd.Splitter.Panel(collapsible=True): + with antd.Splitter(layout="vertical"): + with antd.Splitter.Panel(): + Desc("Top") + with antd.Splitter.Panel(): + Desc("Bottom") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/frontend/antd/input/textarea/input.textarea.tsx b/frontend/antd/input/textarea/input.textarea.tsx index 9f489b2..1b72842 100644 --- a/frontend/antd/input/textarea/input.textarea.tsx +++ b/frontend/antd/input/textarea/input.textarea.tsx @@ -36,7 +36,6 @@ export const InputTextarea = sveltify< onValueChange, value: props.value, }); - return ( <>
{children}