fix: antdx docs

Author: Col0ring

.gitignore

@@ -61,3 +61,5 @@ yalc.lock
 .stylelintcache
 .DS_Store
 .pytest_cache
+
+.qoder

backend/modelscope_studio/components/antd/__init__.py

@@ -72,6 +72,8 @@
 from .list.item.meta import AntdListItemMeta as ListItemMeta
 from .mentions import AntdMentions as Mentions
 from .mentions.option import AntdMentionsOption as MentionsOption
+from .masonry import AntdMasonry as Masonry
+from .masonry.item import AntdMasonryItem as MasonryItem
 from .menu import AntdMenu as Menu
 from .menu.item import AntdMenuItem as MenuItem
 from .message import AntdMessage as Message

backend/modelscope_studio/components/antd/components.py

@@ -67,6 +67,8 @@
 from .list import AntdList
 from .list.item import AntdListItem
 from .list.item.meta import AntdListItemMeta
+from .masonry import AntdMasonry
+from .masonry.item import AntdMasonryItem
 from .mentions import AntdMentions
 from .mentions.option import AntdMentionsOption
 from .menu import AntdMenu

backend/modelscope_studio/components/antd/masonry/__init__.py

@@ -0,0 +1,82 @@
+from __future__ import annotations
+
+from typing import Any
+from gradio.events import EventListener
+
+from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir
+from .item import AntdMasonryItem
+
+
+class AntdMasonry(ModelScopeLayoutComponent):
+    """
+    Ant Design: https://ant.design/components/masonry
+
+    A masonry layout component for displaying content with different heights.
+
+    When to use:
+    - When displaying images or cards with irregular heights
+    - When content needs to be evenly distributed in columns
+    - When column count needs to be responsive
+    """
+    Item = AntdMasonryItem
+
+    EVENTS = [
+        EventListener("layout_change",
+                      callback=lambda block: block._internal.update(
+                          bind_layoutChange_event=True)),
+    ]
+    SLOTS = ['items', 'itemRender']
+
+    def __init__(
+            self,
+            additional_props: dict | None = None,
+            *,
+            columns: int | dict | None = None,
+            gutter: int | tuple[int | dict, int | dict] | dict | None = None,
+            fresh: bool | None = None,
+            items: list[dict] | None = None,
+            item_render: str | None = None,
+            class_names: dict | None = None,
+            styles: dict | None = None,
+            as_item: str | None = None,
+            _internal: None = None,
+            # gradio properties
+            visible: bool = True,
+            elem_id: str | None = None,
+            elem_classes: list[str] | str | None = None,
+            elem_style: dict | None = None,
+            render: bool = True,
+            **kwargs):
+        super().__init__(visible=visible,
+                         elem_id=elem_id,
+                         elem_classes=elem_classes,
+                         render=render,
+                         as_item=as_item,
+                         elem_style=elem_style,
+                         **kwargs)
+        self.additional_props = additional_props
+        self.columns = columns
+        self.gutter = gutter
+        self.fresh = fresh
+        self.items = items
+        self.item_render = item_render
+        self.class_names = class_names
+        self.styles = styles
+
+    FRONTEND_DIR = resolve_frontend_dir("masonry")
+
+    @property
+    def skip_api(self):
+        return True
+
+    def preprocess(self, payload: None) -> None:
+        return payload
+
+    def postprocess(self, value: None) -> None:
+        return value
+
+    def example_payload(self) -> Any:
+        return None
+
+    def example_value(self) -> Any:
+        return None

backend/modelscope_studio/components/antd/masonry/item/__init__.py

@@ -0,0 +1,64 @@
+from __future__ import annotations
+
+from typing import Any
+
+from .....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir
+
+
+class AntdMasonryItem(ModelScopeLayoutComponent):
+    """
+    Ant Design: https://ant.design/components/masonry
+    """
+
+    EVENTS = []
+
+    # supported slots
+    SLOTS = []
+
+    def __init__(
+            self,
+            key: str | float | int | None = None,
+            *,
+            column: int | None = None,
+            data: Any | None = None,
+            height: int | float | None = None,
+            additional_props: dict | None = None,
+            as_item: str | None = None,
+            _internal: None = None,
+            # gradio properties
+            visible: bool = True,
+            elem_id: str | None = None,
+            elem_classes: list[str] | str | None = None,
+            elem_style: dict | None = None,
+            render: bool = True,
+            **kwargs):
+        super().__init__(visible=visible,
+                         elem_id=elem_id,
+                         elem_classes=elem_classes,
+                         render=render,
+                         as_item=as_item,
+                         elem_style=elem_style,
+                         **kwargs)
+        self.additional_props = additional_props
+        self.key = key
+        self.column = column
+        self.data = data
+        self.height = height
+
+    FRONTEND_DIR = resolve_frontend_dir("masonry", "item")
+
+    @property
+    def skip_api(self):
+        return True
+
+    def preprocess(self, payload: None) -> None:
+        return payload
+
+    def postprocess(self, value: None) -> None:
+        return value
+
+    def example_payload(self) -> Any:
+        return None
+
+    def example_value(self) -> Any:
+        return None

docs/app.py

@@ -224,6 +224,9 @@ def render(self):
     }, {
         "label": get_text("Layout", "Layout 布局"),
         "key": "layout"
+    }, {
+        "label": get_text("Masonry", "Masonry 瀑布流"),
+        "key": "masonry"
     }, {
         "label": get_text("Space", "Space 间距"),
         "key": "space"
@@ -451,6 +454,9 @@ def render(self):
     }, {
         "label": get_text("Conversations", "Conversations 管理对话"),
         "key": "conversations"
+    }, {
+        "label": get_text("Notification", "Notification 系统通知"),
+        "key": "notification"
     }]
 }, {
     "label":
@@ -485,6 +491,9 @@ def render(self):
     "type":
     "group",
     "children": [{
+        "label": get_text("Think", "Think 思考过程"),
+        "key": "think"
+    }, {
         "label": get_text("ThoughtChain", "ThoughtChain 思考链"),
         "key": "thought_chain"
     }]
@@ -496,6 +505,21 @@ def render(self):
     "children": [{
         "label": get_text("Actions", "Actions 操作列表"),
         "key": "actions"
+    }, {
+        "label": get_text("CodeHighlighter", "CodeHighlighter 代码高亮"),
+        "key": "code_highlighter"
+    }, {
+        "label": get_text("FileCard", "FileCard 文件卡片"),
+        "key": "file_card"
+    }, {
+        "label": get_text("Folder", "Folder 文件夹"),
+        "key": "folder"
+    }, {
+        "label": get_text("Mermaid", "Mermaid 图表工具"),
+        "key": "mermaid"
+    }, {
+        "label": get_text("Sources", "Sources 来源引用"),
+        "key": "sources"
     }]
 }, {
     "label":
@@ -587,8 +611,8 @@ def more_components():
     default_active_tab=default_active_tab,
     logo=logo)
 
-demo = site.render()
+demo, css = site.render()
 
 if __name__ == "__main__":
     demo.queue(default_concurrency_limit=100,
-               max_size=100).launch(ssr_mode=False, max_threads=100)
+               max_size=100).launch(css=css, ssr_mode=False, max_threads=100)

docs/components/antd/config_provider/demos/basic.py

@@ -10,7 +10,7 @@
         with antd.ConfigProvider(
                 locale=default_locale,
                 direction=default_direction,
-                theme=dict(token=dict(
+                theme_config=dict(token=dict(
                     colorPrimary=default_color))) as config_provider:
             with antd.Card():
                 with ms.Div(elem_style=dict(marginBottom=16)):
@@ -61,7 +61,7 @@
                          outputs=[config_provider])
         gr.on(
             [theme.change, color.change],
-            fn=lambda _theme, _color: gr.update(theme=dict(
+            fn=lambda _theme, _color: gr.update(theme_config=dict(
                 token=dict(colorPrimary=_color) if _color else None,
                 algorithm=dict(dark=True
                                if _theme and 'dark' in _theme else False,

docs/components/antd/masonry/README-zh_CN.md

@@ -0,0 +1,9 @@
+# Masonry
+
+A masonry/waterfall layout component for displaying content with different heights. See [Ant Design](https://ant.design/components/masonry/) for more information.
+
+## Examples
+
+<demo name="basic"></demo>
+<demo name="columns" title="Custom Columns"></demo>
+<demo name="responsive" title="Responsive Layout"></demo>

docs/components/antd/masonry/README.md

@@ -0,0 +1,9 @@
+# Masonry
+
+A masonry/waterfall layout component for displaying content with different heights. See [Ant Design](https://ant.design/components/masonry/) for more information.
+
+## Examples
+
+<demo name="basic"></demo>
+<demo name="columns" title="Custom Columns"></demo>
+<demo name="responsive" title="Responsive Layout"></demo>

docs/components/antd/masonry/app.py

@@ -0,0 +1,6 @@
+from helper.Docs import Docs
+
+docs = Docs(__file__)
+
+if __name__ == "__main__":
+    docs.render().queue().launch()