diff --git a/.changeset/cuddly-eels-occur.md b/.changeset/cuddly-eels-occur.md new file mode 100644 index 00000000..da317321 --- /dev/null +++ b/.changeset/cuddly-eels-occur.md @@ -0,0 +1,17 @@ +--- +'@modelscope-studio/legacy-waterfall-gallery': patch +'@modelscope-studio/legacy-multimodal-input': patch +'@modelscope-studio/legacy-lifecycle': patch +'@modelscope-studio/legacy-markdown': patch +'@modelscope-studio/legacy-compiled': patch +'@modelscope-studio/legacy-chatbot': patch +'@modelscope-studio/legacy-flow': patch +'@modelscope-studio/lint-config': patch +'@modelscope-studio/changelog': patch +'@modelscope-studio/antd': patch +'@modelscope-studio/base': patch +'@modelscope-studio/frontend': patch +'modelscope_studio': patch +--- + +fix: bugfix of remaining components diff --git a/.changeset/pink-chefs-impress.md b/.changeset/pink-chefs-impress.md new file mode 100644 index 00000000..2a7e0acd --- /dev/null +++ b/.changeset/pink-chefs-impress.md @@ -0,0 +1,13 @@ +--- +'@modelscope-studio/legacy-multimodal-input': patch +'@modelscope-studio/legacy-compiled': patch +'@modelscope-studio/legacy-chatbot': patch +'@modelscope-studio/legacy-flow': patch +'@modelscope-studio/lint-config': patch +'@modelscope-studio/changelog': patch +'@modelscope-studio/antd': patch +'@modelscope-studio/frontend': patch +'modelscope_studio': patch +--- + +fix: gbk error diff --git a/.changeset/pre.json b/.changeset/pre.json index 68ee4bd3..344383f4 100644 --- a/.changeset/pre.json +++ b/.changeset/pre.json @@ -18,10 +18,12 @@ }, "changesets": [ "chilly-lemons-pretend", + "cuddly-eels-occur", "five-actors-compete", "fuzzy-goats-retire", "late-cameras-speak", "lemon-laws-cross", + "pink-chefs-impress", "slimy-feet-nail", "spotty-seals-poke", "tough-walls-grab" diff --git a/.github/workflows/publish.yaml b/.github/workflows/publish.yaml index 778c71b9..a1f10c73 100644 --- a/.github/workflows/publish.yaml +++ b/.github/workflows/publish.yaml @@ -21,10 +21,10 @@ jobs: uses: actions/checkout@v4 with: fetch-depth: 0 - - name: Set up Python 3.9 + - name: Set up Python 3.12 uses: actions/setup-python@v5 with: - python-version: '3.9' + python-version: '3.12' - name: Install Python Dependencies run: pip install gradio twine build - name: Setup Node.js diff --git a/CHANGELOG.md b/CHANGELOG.md index 3f7771f5..f91facde 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,10 +1,22 @@ # modelscope_studio +## 1.0.0-beta.9 + +### Fixes + +- [`e7fa278`](https://github.com/modelscope/modelscope-studio/commit/e7fa2782af83a7e78cddb700cd8d5e63ad62342f) - bugfix of remaining components. Thanks [@Col0ring](https://github.com/Col0ring)! + +## 1.0.0-beta.8 + +### Fixes + +- [`a692793`](https://github.com/modelscope/modelscope-studio/commit/a6927930fa0cbb62b8e91d98fbfda7434586e758) - gbk error. Thanks [@Col0ring](https://github.com/Col0ring)! + ## 1.0.0-beta.7 ### Fixes -- [#35](https://github.com/modelscope/modelscope-studio/pull/35) [`5875180`](https://github.com/modelscope/modelscope-studio/commit/5875180feb7c07720108e30d01ec606209d36e59) - component paramters in Python. Thanks [@Col0ring](https://github.com/Col0ring)! +- [#35](https://github.com/modelscope/modelscope-studio/pull/35) [`5875180`](https://github.com/modelscope/modelscope-studio/commit/5875180feb7c07720108e30d01ec606209d36e59) - component parameters in Python. Thanks [@Col0ring](https://github.com/Col0ring)! ## 1.0.0-beta.6 @@ -109,4 +121,4 @@ ### Features - [#16](https://github.com/modelscope/modelscope-studio/pull/16) [`d1829d3`](https://github.com/modelscope/modelscope-studio/commit/d1829d34dd0bce8834d2e257b612d79705e57d6d) - update the timing of onMount call and new onUpdate lifecycle of custom component. Thanks [@Col0ring](https://github.com/Col0ring)! -- [#16](https://github.com/modelscope/modelscope-studio/pull/16) [`96e1682`](https://github.com/modelscope/modelscope-studio/commit/96e1682b7cb63907aafba06afb820f55d7df8ff0) - add Flow component. Thanks [@Col0ring](https://github.com/Col0ring)! +- [#16](https://github.com/modelscope/modelscope-studio/pull/16) [`96e1682`](https://github.com/modelscope/modelscope-studio/commit/96e1682b7cb63907aafba06afb820f55d7df8ff0) - add Flow component. Thanks [@Col0ring](https://github.com/Col0ring)! \ No newline at end of file diff --git a/backend/modelscope_studio/components/antd/__init__.py b/backend/modelscope_studio/components/antd/__init__.py index 81e65aa5..79cb6428 100644 --- a/backend/modelscope_studio/components/antd/__init__.py +++ b/backend/modelscope_studio/components/antd/__init__.py @@ -76,6 +76,7 @@ from .menu.item import AntdMenuItem as MenuItem from .message import AntdMessage as Message from .modal import AntdModal as Modal +from .modal.static import AntdModalStatic as ModalStatic from .notification import AntdNotification as Notification from .pagination import AntdPagination as Pagination from .popconfirm import AntdPopconfirm as Popconfirm @@ -89,7 +90,7 @@ from .rate import AntdRate as Rate from .result import AntdResult as Result from .segmented import AntdSegmented as Segmented -from .segmented.option import AntdSegmentedOption as SegmentedOptions +from .segmented.option import AntdSegmentedOption as SegmentedOption from .select import AntdSelect as Select from .select.option import AntdSelectOption as SelectOption from .skeleton import AntdSkeleton as Skeleton diff --git a/backend/modelscope_studio/components/antd/affix/__init__.py b/backend/modelscope_studio/components/antd/affix/__init__.py index 714ac0c0..08cfa89a 100644 --- a/backend/modelscope_studio/components/antd/affix/__init__.py +++ b/backend/modelscope_studio/components/antd/affix/__init__.py @@ -30,7 +30,7 @@ def __init__( props: dict | None = None, *, offset_bottom: int | float | None = None, - offset_top: int | float | None = 0, + offset_top: int | float | None = None, get_target: str | None = None, as_item: str | None = None, _internal: None = None, diff --git a/backend/modelscope_studio/components/antd/avatar/__init__.py b/backend/modelscope_studio/components/antd/avatar/__init__.py index 6eb6f8bf..a6d60579 100644 --- a/backend/modelscope_studio/components/antd/avatar/__init__.py +++ b/backend/modelscope_studio/components/antd/avatar/__init__.py @@ -36,11 +36,11 @@ def __init__( props: dict | None = None, *, alt: str | None = None, - gap: int = 4, + gap: int | None = None, icon: str | None = None, - shape: Literal['circle', 'square'] = 'circle', + shape: Literal['circle', 'square'] | None = None, size: int | Literal['large', 'small', 'default'] | dict - | None = 'default', + | None = None, src_set: str | None = None, draggable: bool | Literal['true', 'false'] | None = None, cross_origin: Literal['anonymous', 'use-credentials', ''] diff --git a/backend/modelscope_studio/components/antd/avatar/group/__init__.py b/backend/modelscope_studio/components/antd/avatar/group/__init__.py index 5bca907c..87ebe0bc 100644 --- a/backend/modelscope_studio/components/antd/avatar/group/__init__.py +++ b/backend/modelscope_studio/components/antd/avatar/group/__init__.py @@ -19,8 +19,8 @@ def __init__( *, max: dict | None = None, size: int | Literal['large', 'small', 'default'] - | dict = 'default', - shape: Literal['circle', 'square'] = 'circle', + | dict | None = None, + shape: Literal['circle', 'square'] | None = None, root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, diff --git a/backend/modelscope_studio/components/antd/calendar/__init__.py b/backend/modelscope_studio/components/antd/calendar/__init__.py index 2aef5a80..7cf81907 100644 --- a/backend/modelscope_studio/components/antd/calendar/__init__.py +++ b/backend/modelscope_studio/components/antd/calendar/__init__.py @@ -40,7 +40,7 @@ def __init__( fullscreen: bool = True, header_render: str | None = None, locale: dict | None = None, - mode: Literal['month', 'year'] = 'month', + mode: Literal['month', 'year'] | None = None, valid_range: tuple[int | str | float, int | str | float] | None = None, root_class_name: str | None = None, diff --git a/backend/modelscope_studio/components/antd/card/__init__.py b/backend/modelscope_studio/components/antd/card/__init__.py index 309f4620..d302f3d4 100644 --- a/backend/modelscope_studio/components/antd/card/__init__.py +++ b/backend/modelscope_studio/components/antd/card/__init__.py @@ -36,6 +36,7 @@ class AntdCard(ModelScopeLayoutComponent): 'extra', 'tabBarExtraContent', 'title', + 'tabList', ] def __exit__(self, *args, **kwargs): @@ -49,7 +50,7 @@ def __init__( *, actions: str | None = None, active_tab_key: str | None = None, - bordered: bool = True, + bordered: bool | None = None, cover: str | None = None, default_active_tab_key: str | None = None, extra: str | None = None, @@ -58,7 +59,7 @@ def __init__( size: Literal["default", "small"] | None = None, tab_bar_extra_content: str | None = None, tab_list: list[str] | str | None = None, - tab_props: str | None = None, + tab_props: dict | None = None, title: str | None = None, type: str | None = None, class_names: dict | None = None, diff --git a/backend/modelscope_studio/components/antd/card/grid/__init__.py b/backend/modelscope_studio/components/antd/card/grid/__init__.py index bb966aca..035406af 100644 --- a/backend/modelscope_studio/components/antd/card/grid/__init__.py +++ b/backend/modelscope_studio/components/antd/card/grid/__init__.py @@ -26,7 +26,7 @@ def __init__( self, props: dict | None = None, *, - hoverable: bool = True, + hoverable: bool | None = None, as_item: str | None = None, _internal: None = None, # gradio properties diff --git a/backend/modelscope_studio/components/antd/carousel/__init__.py b/backend/modelscope_studio/components/antd/carousel/__init__.py index 088d6986..abe4f678 100644 --- a/backend/modelscope_studio/components/antd/carousel/__init__.py +++ b/backend/modelscope_studio/components/antd/carousel/__init__.py @@ -18,16 +18,17 @@ def __init__( *, arrows: bool | None = None, autoplay: bool | None = None, - autoplay_speed: int | float = 3000, + autoplay_speed: int | float | None = 3000, adaptive_height: bool | None = None, - dot_position: Literal['top', 'bottom', 'left', 'right'] = 'bottom', - dots: bool | dict = True, + dot_position: Literal['top', 'bottom', 'left', 'right'] + | None = 'bottom', + dots: bool | dict | None = True, draggable: bool | None = None, fade: bool | None = None, - infinite: bool = True, - speed: int = 500, - easing: str = 'linear', - effect: Literal['scrollx', 'fade'] = 'scrollx', + infinite: bool | None = True, + speed: int | None = 500, + easing: str | None = 'linear', + effect: Literal['scrollx', 'fade'] | None = 'scrollx', after_change: str | None = None, before_change: str | None = None, wait_for_animate: bool | None = None, diff --git a/backend/modelscope_studio/components/antd/cascader/__init__.py b/backend/modelscope_studio/components/antd/cascader/__init__.py index 7f799532..51d4cef4 100644 --- a/backend/modelscope_studio/components/antd/cascader/__init__.py +++ b/backend/modelscope_studio/components/antd/cascader/__init__.py @@ -40,6 +40,7 @@ class AntdCascader(ModelScopeDataLayoutComponent): 'notFoundContent', 'expandIcon', 'removeIcon', + 'prefix', 'displayRender', 'tagRender', 'dropdownRender', @@ -62,6 +63,7 @@ def __init__( popup_class_name: str | None = None, dropdown_render: str | None = None, expand_icon: str | None = None, + prefix: str | None = None, expand_trigger: Literal['click', 'hover'] = 'click', filed_names: dict | None = None, get_popup_container: str | None = None, @@ -114,6 +116,7 @@ def __init__( self.disabled = disabled self.display_render = display_render self.tag_render = tag_render + self.prefix = prefix self.popup_class_name = popup_class_name self.dropdown_render = dropdown_render self.expand_icon = expand_icon diff --git a/backend/modelscope_studio/components/antd/collapse/__init__.py b/backend/modelscope_studio/components/antd/collapse/__init__.py index 79543e66..afe48f78 100644 --- a/backend/modelscope_studio/components/antd/collapse/__init__.py +++ b/backend/modelscope_studio/components/antd/collapse/__init__.py @@ -30,7 +30,7 @@ def __init__( accordion: bool | None = None, active_key: str | float | list[int | float] | list[str] | None = None, - bordered: bool = True, + bordered: bool | None = None, collapsible: Literal['header', 'icon', 'disabled'] | None = None, default_active_key: str | float | list[int | float] | list[str] | None = None, diff --git a/backend/modelscope_studio/components/antd/color_picker/__init__.py b/backend/modelscope_studio/components/antd/color_picker/__init__.py index 2f486217..153f2c98 100644 --- a/backend/modelscope_studio/components/antd/color_picker/__init__.py +++ b/backend/modelscope_studio/components/antd/color_picker/__init__.py @@ -47,6 +47,7 @@ def __init__( presets: list[dict] | None = None, disabled: bool | None = None, disabled_alpha: bool | None = None, + disabled_format: bool | None = None, destroy_tooltip_on_hide: bool | None = None, format: Literal['hex', 'rgb', 'hsb'] | None = 'hex', mode: Literal['single', 'gradient'] @@ -85,6 +86,7 @@ def __init__( self.presets = presets self.disabled = disabled self.disabled_alpha = disabled_alpha + self.disabled_format = disabled_format self.destroy_tooltip_on_hide = destroy_tooltip_on_hide self.format = format self.mode = mode diff --git a/backend/modelscope_studio/components/antd/components.py b/backend/modelscope_studio/components/antd/components.py index 921a0855..c46db396 100644 --- a/backend/modelscope_studio/components/antd/components.py +++ b/backend/modelscope_studio/components/antd/components.py @@ -73,6 +73,7 @@ from .menu.item import AntdMenuItem from .message import AntdMessage from .modal import AntdModal +from .modal.static import AntdModalStatic from .notification import AntdNotification from .pagination import AntdPagination from .popconfirm import AntdPopconfirm diff --git a/backend/modelscope_studio/components/antd/date_picker/__init__.py b/backend/modelscope_studio/components/antd/date_picker/__init__.py index 5161e5d6..c030a168 100644 --- a/backend/modelscope_studio/components/antd/date_picker/__init__.py +++ b/backend/modelscope_studio/components/antd/date_picker/__init__.py @@ -35,6 +35,7 @@ class AntdDatePicker(ModelScopeDataLayoutComponent): # supported slots SLOTS = [ 'allowClear.clearIcon', + 'prefix', 'prevIcon', 'nextIcon', 'suffixIcon', @@ -77,6 +78,7 @@ def __init__( get_popup_container: str | None = None, min_date: str | int | float | None = None, max_date: str | int | float | None = None, + prefix: str | None = None, prev_icon: str | None = None, size: Literal['large', 'middle', 'small'] | None = None, presets: list[dict] | None = None, @@ -137,6 +139,7 @@ def __init__( self.get_popup_container = get_popup_container self.min_date = min_date self.max_date = max_date + self.prefix = prefix self.prev_icon = prev_icon self.size = size self.presets = presets diff --git a/backend/modelscope_studio/components/antd/descriptions/__init__.py b/backend/modelscope_studio/components/antd/descriptions/__init__.py index 52db52d7..ed510667 100644 --- a/backend/modelscope_studio/components/antd/descriptions/__init__.py +++ b/backend/modelscope_studio/components/antd/descriptions/__init__.py @@ -22,8 +22,8 @@ def __init__( props: dict | None = None, *, bordered: bool | None = None, - colon: bool = True, - column: int | dict | None = 3, + colon: bool | None = None, + column: int | dict | None = None, content_style: dict | None = None, extra: str | None = None, layout: Literal['horizontal', 'vertical'] = 'horizontal', diff --git a/backend/modelscope_studio/components/antd/descriptions/item/__init__.py b/backend/modelscope_studio/components/antd/descriptions/item/__init__.py index a4b3643f..87316d6d 100644 --- a/backend/modelscope_studio/components/antd/descriptions/item/__init__.py +++ b/backend/modelscope_studio/components/antd/descriptions/item/__init__.py @@ -1,6 +1,6 @@ from __future__ import annotations -from typing import Any +from typing import Any, Literal from .....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir @@ -17,12 +17,12 @@ class AntdDescriptionsItem(ModelScopeLayoutComponent): def __init__( self, - label: str | None = "", + label: str | None = None, props: dict | None = None, *, content_style: dict | None = None, label_style: dict | None = None, - span: int | dict | None = 1, + span: int | dict | Literal['filled'] | None = None, as_item: str | None = None, _internal: None = None, # gradio properties diff --git a/backend/modelscope_studio/components/antd/empty/__init__.py b/backend/modelscope_studio/components/antd/empty/__init__.py index c4065120..a0a571dd 100644 --- a/backend/modelscope_studio/components/antd/empty/__init__.py +++ b/backend/modelscope_studio/components/antd/empty/__init__.py @@ -1,6 +1,6 @@ from __future__ import annotations -from typing import Any +from typing import Any, Literal from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir @@ -19,8 +19,10 @@ def __init__( self, props: dict | None = None, *, - description: str | None = None, - image: str | None = None, + description: str | bool | None = None, + image: str + | Literal['PRESENTED_IMAGE_DEFAULT', 'PRESENTED_IMAGE_SIMPLE'] + | None = None, image_style: dict | None = None, root_class_name: str | None = None, as_item: str | None = None, diff --git a/backend/modelscope_studio/components/antd/float_button/back_top/__init__.py b/backend/modelscope_studio/components/antd/float_button/back_top/__init__.py index 427fb7c1..3a876869 100644 --- a/backend/modelscope_studio/components/antd/float_button/back_top/__init__.py +++ b/backend/modelscope_studio/components/antd/float_button/back_top/__init__.py @@ -66,7 +66,7 @@ def __init__( target: Specifies where to display the linked URL string. htmlType: Set the original html type of button. badge: Attach Badge to FloatButton. status and other props related are not supported. - duration: Time to return to top（ms）. + duration: Time to return to top(ms). get_target: Specifies the scrollable area dom node. visibility_height: The BackTop button will not show until the scroll height reaches this value. """ diff --git a/backend/modelscope_studio/components/antd/form/__init__.py b/backend/modelscope_studio/components/antd/form/__init__.py index 4f297378..985e5606 100644 --- a/backend/modelscope_studio/components/antd/form/__init__.py +++ b/backend/modelscope_studio/components/antd/form/__init__.py @@ -20,7 +20,6 @@ class AntdForm(ModelScopeDataLayoutComponent): """ Item = AntdFormItem Provider = AntdFormProvider - EVENTS = [ EventListener("fields_change", callback=lambda block: block._internal.update( diff --git a/backend/modelscope_studio/components/antd/grid/col/__init__.py b/backend/modelscope_studio/components/antd/grid/col/__init__.py index 824f1141..f39a28bf 100644 --- a/backend/modelscope_studio/components/antd/grid/col/__init__.py +++ b/backend/modelscope_studio/components/antd/grid/col/__init__.py @@ -62,11 +62,11 @@ def __init__( push: The number of cells that raster is moved to the right. span: Raster number of cells to occupy, 0 corresponds to display: none. xs: screen < 576px and also default setting, could be a span value or an object containing above props. - sm: screen ≥ 576px, could be a span value or an object containing above props. - md: screen ≥ 768px, could be a span value or an object containing above props. - lg: screen ≥ 992px, could be a span value or an object containing above props. - xl: screen ≥ 1200px, could be a span value or an object containing above props. - xxl: screen ≥ 1600px, could be a span value or an object containing above props. + sm: screen >= 576px, could be a span value or an object containing above props. + md: screen >= 768px, could be a span value or an object containing above props. + lg: screen >= 992px, could be a span value or an object containing above props. + xl: screen >= 1200px, could be a span value or an object containing above props. + xxl: screen >= 1600px, could be a span value or an object containing above props. """ super().__init__(visible=visible, elem_id=elem_id, diff --git a/backend/modelscope_studio/components/antd/image/__init__.py b/backend/modelscope_studio/components/antd/image/__init__.py index 81f84466..d9e4b90b 100644 --- a/backend/modelscope_studio/components/antd/image/__init__.py +++ b/backend/modelscope_studio/components/antd/image/__init__.py @@ -51,7 +51,7 @@ def __init__( fallback: str | None = None, height: str | int | float | None = None, placeholder: bool | str | int | float | None = None, - preview: bool | dict | None = True, + preview: bool | dict | None = None, width: str | int | float | None = None, root_class_name: str | None = None, as_item: str | None = None, diff --git a/backend/modelscope_studio/components/antd/image/preview_group/__init__.py b/backend/modelscope_studio/components/antd/image/preview_group/__init__.py index be1d218e..58ba693a 100644 --- a/backend/modelscope_studio/components/antd/image/preview_group/__init__.py +++ b/backend/modelscope_studio/components/antd/image/preview_group/__init__.py @@ -28,7 +28,7 @@ def __init__( items: list[dict | str] | None = None, props: dict | None = None, *, - preview: bool | dict | None = True, + preview: bool | dict | None = None, fallback: str | None = None, as_item: str | None = None, _internal: None = None, diff --git a/backend/modelscope_studio/components/antd/input/otp/__init__.py b/backend/modelscope_studio/components/antd/input/otp/__init__.py index 80d9a56f..0872abdf 100644 --- a/backend/modelscope_studio/components/antd/input/otp/__init__.py +++ b/backend/modelscope_studio/components/antd/input/otp/__init__.py @@ -16,6 +16,9 @@ class AntdInputOTP(ModelScopeDataLayoutComponent): EventListener("change", callback=lambda block: block._internal.update( bind_change_event=True)), + EventListener("input", + callback=lambda block: block._internal.update( + bind_input_event=True)), ] # supported slots @@ -31,10 +34,10 @@ def __init__( formatter: str | None = None, mask: str | bool | None = None, length: int = 6, - placeholder: str = '口', + placeholder: str | None = None, size: Literal['large', 'middle', 'small'] | None = None, status: Literal['error', 'warning'] | None = None, - variant: Literal['outline', 'borderless', 'filled'] | None = None, + variant: Literal['outlined', 'borderless', 'filled'] | None = None, root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, diff --git a/backend/modelscope_studio/components/antd/list/__init__.py b/backend/modelscope_studio/components/antd/list/__init__.py index e2be4626..c3d4c9a2 100644 --- a/backend/modelscope_studio/components/antd/list/__init__.py +++ b/backend/modelscope_studio/components/antd/list/__init__.py @@ -34,7 +34,7 @@ def __init__( footer: str | None = None, grid: dict | None = None, header: str | None = None, - item_layout: str | None = None, + item_layout: Literal['horizontal', 'vertical'] | None = None, loading: bool | dict | None = False, load_more: str | None = None, locale: dict | None = None, diff --git a/backend/modelscope_studio/components/antd/message/__init__.py b/backend/modelscope_studio/components/antd/message/__init__.py index e80b16e1..155cb8e0 100644 --- a/backend/modelscope_studio/components/antd/message/__init__.py +++ b/backend/modelscope_studio/components/antd/message/__init__.py @@ -1,5 +1,7 @@ from __future__ import annotations +from typing import Literal + from gradio.events import EventListener from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir @@ -23,15 +25,17 @@ class AntdMessage(ModelScopeLayoutComponent): def __init__( self, - content: str | None = "", + content: str | None = None, props: dict | None = None, *, - duration: float | int | None = 3, + type: Literal['success', 'info', 'warning', 'error', 'loading'] + | None = None, + duration: float | int | None = None, icon: str | None = None, key: str | int | float | None = None, get_container: str | None = None, rtl: bool | None = None, - top: int | float | None = 8, + top: int | float | None = None, root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, @@ -52,6 +56,7 @@ def __init__( self.content = content self.duration = duration self.icon = icon + self.type = type self.key = key self.get_container = get_container self.rtl = rtl diff --git a/backend/modelscope_studio/components/antd/modal/__init__.py b/backend/modelscope_studio/components/antd/modal/__init__.py index b223bb41..05c4e2ef 100644 --- a/backend/modelscope_studio/components/antd/modal/__init__.py +++ b/backend/modelscope_studio/components/antd/modal/__init__.py @@ -5,12 +5,16 @@ from gradio.events import EventListener from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir +from .static import AntdModalStatic class AntdModal(ModelScopeLayoutComponent): """ Ant Design: https://ant.design/components/modal """ + + Static = AntdModalStatic + EVENTS = [ EventListener( "ok", diff --git a/backend/modelscope_studio/components/antd/modal/static/__init__.py b/backend/modelscope_studio/components/antd/modal/static/__init__.py new file mode 100644 index 00000000..9d9d37e1 --- /dev/null +++ b/backend/modelscope_studio/components/antd/modal/static/__init__.py @@ -0,0 +1,132 @@ +from __future__ import annotations + +from typing import Any, Literal + +from gradio.events import EventListener + +from .....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir + + +class AntdModalStatic(ModelScopeLayoutComponent): + """ + Ant Design: https://ant.design/components/modal + """ + EVENTS = [ + EventListener( + "ok", + callback=lambda block: block._internal.update(bind_ok_event=True)), + EventListener("cancel", + callback=lambda block: block._internal.update( + bind_cancel_event=True)) + ] + + # supported slots + SLOTS = [ + 'closeIcon', 'cancelButtonProps.icon', 'cancelText', + 'closable.closeIcon', 'closeIcon', 'footer', 'title', 'content', + 'okButtonProps.icon', 'okText', 'modalRender' + ] + + def __init__( + self, + props: dict | None = None, + *, + after_close: str | None = None, + auto_focus_button: Literal['ok', 'cancel'] | None = 'ok', + type: Literal['info', 'success', 'error', 'warning', 'confirm'] + | None = None, + class_names: dict | None = None, + styles: dict | None = None, + cancel_button_props: dict | None = None, + cancel_text: str | None = None, + centered: bool | None = None, + closable: bool | dict | None = None, + close_icon: str | None = None, + confirm_loading: bool | None = None, + destroy_on_close: bool | None = None, + focus_trigger_after_close: bool | None = None, + content: str | None = None, + footer: str | None = None, + force_render: bool | None = None, + get_container: str | None = None, + keyboard: bool | None = None, + mask: bool | None = None, + mask_closable: bool | None = None, + modal_render: str | None = None, + ok_text: str | None = None, + ok_type: str | None = None, + ok_button_props: dict | None = None, + loading: bool | None = None, + title: str | None = None, + width: int | float | str | None = None, + wrap_class_name: str | None = None, + z_index: int | None = None, + after_open_change: str | None = None, + root_class_name: str | 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.props = props + self.after_close = after_close + self.auto_focus_button = auto_focus_button + self.class_names = class_names + self.styles = styles + self.type = type + self.cancel_button_props = cancel_button_props + self.cancel_text = cancel_text + self.centered = centered + self.closable = closable + self.close_icon = close_icon + self.confirm_loading = confirm_loading + self.destroy_on_close = destroy_on_close + self.focus_trigger_after_close = focus_trigger_after_close + self.content = content + self.footer = footer + self.force_render = force_render + self.get_container = get_container + self.keyboard = keyboard + self.mask = mask + self.mask_closable = mask_closable + self.modal_render = modal_render + self.ok_text = ok_text + self.ok_type = ok_type + self.ok_button_props = ok_button_props + self.loading = loading + self.title = title + self.width = width + self.wrap_class_name = wrap_class_name + self.z_index = z_index + self.after_open_change = after_open_change + self.root_class_name = root_class_name + + FRONTEND_DIR = resolve_frontend_dir("modal", "static") + + @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 diff --git a/backend/modelscope_studio/components/antd/notification/__init__.py b/backend/modelscope_studio/components/antd/notification/__init__.py index 61e0cbfc..adfeeebb 100644 --- a/backend/modelscope_studio/components/antd/notification/__init__.py +++ b/backend/modelscope_studio/components/antd/notification/__init__.py @@ -29,6 +29,7 @@ def __init__( description: str | None = "", props: dict | None = None, *, + type: Literal['success', 'info', 'warning', 'error'] | None = None, btn: str | None = None, close_icon: str | bool | None = None, duration: int | float | None = 4.5, @@ -63,6 +64,7 @@ def __init__( **kwargs) self.props = props self.message = message + self.type = type self.description = description self.btn = btn self.close_icon = close_icon diff --git a/backend/modelscope_studio/components/antd/popconfirm/__init__.py b/backend/modelscope_studio/components/antd/popconfirm/__init__.py index dd36672c..bacbecdd 100644 --- a/backend/modelscope_studio/components/antd/popconfirm/__init__.py +++ b/backend/modelscope_studio/components/antd/popconfirm/__init__.py @@ -38,7 +38,7 @@ class AntdPopconfirm(ModelScopeLayoutComponent): def __init__( self, - title: str | None = "", + title: str | None = None, description: str | None = None, props: dict | None = None, *, @@ -51,15 +51,15 @@ def __init__( ok_type: str | None = None, show_cancel: bool | None = None, align: dict | None = None, - arrow: bool | dict | None = True, - auto_adjust_overflow: bool = True, + arrow: bool | dict | None = None, + auto_adjust_overflow: bool | None = None, color: str | None = None, default_open: bool | None = None, destroy_tooltip_on_hide: bool | None = None, fresh: bool | None = None, get_popup_container: str | None = None, - mouse_enter_delay: float | int = 0.1, - mouse_leave_delay: float | int = 0.1, + mouse_enter_delay: float | int | None = None, + mouse_leave_delay: float | int | None = None, overlay_class_name: str | None = None, overlay_style: dict | None = None, overlay_inner_style: dict | None = None, @@ -76,9 +76,10 @@ def __init__( 'leftBottom', 'rightTop', 'rightBottom', - ] = 'top', + ] | None = None, trigger: Literal['hover', 'focus', 'click', 'contextMenu'] - | list[Literal['hover', 'focus', 'click', 'contextMenu']] = 'hover', + | list[Literal['hover', 'focus', 'click', 'contextMenu']] + | None = None, open: bool | None = None, z_index: int | None = None, root_class_name: str | None = None, diff --git a/backend/modelscope_studio/components/antd/popover/__init__.py b/backend/modelscope_studio/components/antd/popover/__init__.py index c47abdd0..6ecf855f 100644 --- a/backend/modelscope_studio/components/antd/popover/__init__.py +++ b/backend/modelscope_studio/components/antd/popover/__init__.py @@ -22,20 +22,20 @@ class AntdPopover(ModelScopeLayoutComponent): def __init__( self, - content: str | None = "", - title: str | None = "", + content: str | None = None, + title: str | None = None, props: dict | None = None, *, align: dict | None = None, - arrow: bool | dict | None = True, - auto_adjust_overflow: bool = True, + arrow: bool | dict | None = None, + auto_adjust_overflow: bool | None = None, color: str | None = None, default_open: bool | None = None, destroy_tooltip_on_hide: bool | None = None, fresh: bool | None = None, get_popup_container: str | None = None, - mouse_enter_delay: float | int = 0.1, - mouse_leave_delay: float | int = 0.1, + mouse_enter_delay: float | int | None = None, + mouse_leave_delay: float | int | None = None, overlay_class_name: str | None = None, overlay_style: dict | None = None, overlay_inner_style: dict | None = None, @@ -54,7 +54,8 @@ def __init__( 'rightBottom', ] = 'top', trigger: Literal['hover', 'focus', 'click', 'contextMenu'] - | list[Literal['hover', 'focus', 'click', 'contextMenu']] = 'hover', + | list[Literal['hover', 'focus', 'click', 'contextMenu']] + | None = None, open: bool | None = None, z_index: int | None = None, root_class_name: str | None = None, diff --git a/backend/modelscope_studio/components/antd/segmented/__init__.py b/backend/modelscope_studio/components/antd/segmented/__init__.py index 84157073..a2230b66 100644 --- a/backend/modelscope_studio/components/antd/segmented/__init__.py +++ b/backend/modelscope_studio/components/antd/segmented/__init__.py @@ -21,6 +21,9 @@ class AntdSegmented(ModelScopeDataLayoutComponent): bind_change_event=True)), ] + # supported slots + SLOTS = ["options"] + def __init__( self, value: str | int | float | None = None, diff --git a/backend/modelscope_studio/components/antd/select/__init__.py b/backend/modelscope_studio/components/antd/select/__init__.py index a9f53cbf..ae6428b4 100644 --- a/backend/modelscope_studio/components/antd/select/__init__.py +++ b/backend/modelscope_studio/components/antd/select/__init__.py @@ -46,7 +46,7 @@ class AntdSelect(ModelScopeDataLayoutComponent): SLOTS = [ 'allowClear.clearIcon', 'maxTagPlaceholder', 'menuItemSelectedIcon', 'dropdownRender', 'optionRender', 'tagRender', 'labelRender', - 'notFoundContent', 'removeIcon', 'suffixIcon', 'options' + 'notFoundContent', 'removeIcon', 'suffixIcon', 'prefix', 'options' ] def __init__( @@ -94,6 +94,7 @@ def __init__( size: Literal['large', 'middle', 'small'] | None = None, status: Literal['error', 'warning'] | None = None, suffix_icon: str | None = None, + prefix: str | None = None, tag_render: str | None = None, label_render: str | None = None, token_separators: list[str] | None = None, @@ -128,6 +129,7 @@ def __init__( self.default_open = default_open self.default_value = default_value self.disabled = disabled + self.prefix = prefix self.popup_class_name = popup_class_name self.popup_match_select_width = popup_match_select_width self.get_popup_container = get_popup_container diff --git a/backend/modelscope_studio/components/antd/skeleton/input/__init__.py b/backend/modelscope_studio/components/antd/skeleton/input/__init__.py index 1b390072..cc9e6c6a 100644 --- a/backend/modelscope_studio/components/antd/skeleton/input/__init__.py +++ b/backend/modelscope_studio/components/antd/skeleton/input/__init__.py @@ -17,6 +17,7 @@ def __init__( *, active: bool | None = None, size: Literal['large', 'small', 'default'] | None = None, + block: bool | None = None, root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, @@ -37,6 +38,7 @@ def __init__( self.props = props self.active = active self.size = size + self.block = block self.root_class_name = root_class_name FRONTEND_DIR = resolve_frontend_dir("skeleton", "input") diff --git a/backend/modelscope_studio/components/antd/slider/mark/__init__.py b/backend/modelscope_studio/components/antd/slider/mark/__init__.py index 4b503b71..55d5051c 100644 --- a/backend/modelscope_studio/components/antd/slider/mark/__init__.py +++ b/backend/modelscope_studio/components/antd/slider/mark/__init__.py @@ -23,8 +23,6 @@ def __init__( label: str | None = None, props: dict | None = None, *, - title: str | None = None, - disabled: bool | None = None, as_item: str | None = None, _internal: None = None, # gradio properties @@ -44,8 +42,6 @@ def __init__( self.props = props self.number = number self.label = label - self.disabled = disabled - self.title = title FRONTEND_DIR = resolve_frontend_dir("slider", "mark") diff --git a/backend/modelscope_studio/components/antd/splitter/panel/__init__.py b/backend/modelscope_studio/components/antd/splitter/panel/__init__.py index 46e9e354..eca79d7f 100644 --- a/backend/modelscope_studio/components/antd/splitter/panel/__init__.py +++ b/backend/modelscope_studio/components/antd/splitter/panel/__init__.py @@ -25,8 +25,8 @@ def __init__( min: int | str | None = None, max: int | str | None = None, size: int | str | None = None, - collapsible: bool | dict = False, - resizable: bool = True, + collapsible: bool | dict | None = None, + resizable: bool | None = None, root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, diff --git a/backend/modelscope_studio/components/antd/statistic/__init__.py b/backend/modelscope_studio/components/antd/statistic/__init__.py index b1e73d45..fd0053d4 100644 --- a/backend/modelscope_studio/components/antd/statistic/__init__.py +++ b/backend/modelscope_studio/components/antd/statistic/__init__.py @@ -1,10 +1,12 @@ from __future__ import annotations -from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir +from typing import Callable + +from ....utils.dev import ModelScopeDataLayoutComponent, resolve_frontend_dir from .countdown import AntdStatisticCountdown -class AntdStatistic(ModelScopeLayoutComponent): +class AntdStatistic(ModelScopeDataLayoutComponent): """ Ant Design: https://ant.design/components/statistic """ @@ -17,7 +19,7 @@ class AntdStatistic(ModelScopeLayoutComponent): def __init__( self, - value: int | float | str | None = None, + value: Callable | int | float | str | None = None, props: dict | None = None, *, decimal_separator: str | None = None, @@ -39,14 +41,14 @@ def __init__( elem_style: dict | None = None, render: bool = True, **kwargs): - super().__init__(visible=visible, + super().__init__(value=value, + visible=visible, elem_id=elem_id, elem_classes=elem_classes, render=render, as_item=as_item, elem_style=elem_style, **kwargs) - self.value = value self.props = props self.decimal_separator = decimal_separator self.formatter = formatter @@ -65,10 +67,10 @@ def __init__( def skip_api(self): return True - def preprocess(self, payload: None) -> None: + def preprocess(self, payload: int | float | str | None) -> None: return payload - def postprocess(self, value: None) -> None: + def postprocess(self, value: int | float | str | None) -> None: return value diff --git a/backend/modelscope_studio/components/antd/statistic/countdown/__init__.py b/backend/modelscope_studio/components/antd/statistic/countdown/__init__.py index 560b708f..d0f6e284 100644 --- a/backend/modelscope_studio/components/antd/statistic/countdown/__init__.py +++ b/backend/modelscope_studio/components/antd/statistic/countdown/__init__.py @@ -1,13 +1,13 @@ from __future__ import annotations -from typing import Any +from typing import Any, Callable from gradio.events import EventListener -from .....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir +from .....utils.dev import ModelScopeDataLayoutComponent, resolve_frontend_dir -class AntdStatisticCountdown(ModelScopeLayoutComponent): +class AntdStatisticCountdown(ModelScopeDataLayoutComponent): """ Ant Design: https://ant.design/components/statistic """ @@ -26,7 +26,7 @@ class AntdStatisticCountdown(ModelScopeLayoutComponent): def __init__( self, - value: int | float | None = None, + value: Callable | int | float | None = None, props: dict | None = None, *, format: str | None = None, @@ -44,7 +44,8 @@ def __init__( elem_style: dict | None = None, render: bool = True, **kwargs): - super().__init__(visible=visible, + super().__init__(value=value, + visible=visible, elem_id=elem_id, elem_classes=elem_classes, render=render, @@ -52,7 +53,6 @@ def __init__( elem_style=elem_style, **kwargs) self.props = props - self.value = value self.format = format self.prefix = prefix self.suffix = suffix @@ -66,10 +66,10 @@ def __init__( def skip_api(self): return True - def preprocess(self, payload: str) -> str: + def preprocess(self, payload: int | float | None) -> int | float | None: return payload - def postprocess(self, value: str) -> str: + def postprocess(self, value: int | float | None) -> int | float | None: return value def example_payload(self) -> Any: diff --git a/backend/modelscope_studio/components/antd/table/column/__init__.py b/backend/modelscope_studio/components/antd/table/column/__init__.py index 10bd8913..db21c38b 100644 --- a/backend/modelscope_studio/components/antd/table/column/__init__.py +++ b/backend/modelscope_studio/components/antd/table/column/__init__.py @@ -19,8 +19,11 @@ class AntdTableColumn(ModelScopeLayoutComponent): # supported slots SLOTS = [ - 'filterDropdown', 'filterIcon', 'render', 'title', 'sortIcon', - 'showSorterTooltip.title' + 'filterDropdown', "filterDropdownProps.dropdownRender", + "filterDropdownProps.menu.expandIcon", + 'filterDropdownProps.menu.overflowedIndicator', + "filterDropdownProps.menu.items", 'filterIcon', 'render', 'title', + 'sortIcon', 'showSorterTooltip.title' ] def __init__( @@ -46,6 +49,7 @@ def __init__( filter_mode: Literal['menu', 'tree'] | None = None, filter_search: bool | str | None = None, filters: list[dict] | None = None, + filter_dropdown_props: dict | None = None, fixed: str | bool | None = None, key: str | None = None, column_render: str | None = None, @@ -96,6 +100,7 @@ def __init__( self.filter_mode = filter_mode self.filter_search = filter_search self.filters = filters + self.filter_dropdown_props = filter_dropdown_props self.fixed = fixed self.key = key self.column_render = column_render diff --git a/backend/modelscope_studio/components/antd/tag/__init__.py b/backend/modelscope_studio/components/antd/tag/__init__.py index abc7cfaf..d2298c8d 100644 --- a/backend/modelscope_studio/components/antd/tag/__init__.py +++ b/backend/modelscope_studio/components/antd/tag/__init__.py @@ -25,7 +25,7 @@ class AntdTag(ModelScopeLayoutComponent): def __init__( self, - value: str | None = "", + value: str | None = None, props: dict | None = None, *, bordered: bool | None = None, diff --git a/backend/modelscope_studio/components/antd/tag/checkable_tag/__init__.py b/backend/modelscope_studio/components/antd/tag/checkable_tag/__init__.py index 028c2db8..497f1cee 100644 --- a/backend/modelscope_studio/components/antd/tag/checkable_tag/__init__.py +++ b/backend/modelscope_studio/components/antd/tag/checkable_tag/__init__.py @@ -16,7 +16,10 @@ class AntdTagCheckableTag(ModelScopeDataLayoutComponent): EVENTS = [ EventListener("change", callback=lambda block: block._internal.update( - bind_change_event=True)) + bind_change_event=True)), + EventListener("click", + callback=lambda block: block._internal.update( + bind_click_event=True)) ] def __init__( diff --git a/backend/modelscope_studio/components/antd/tooltip/__init__.py b/backend/modelscope_studio/components/antd/tooltip/__init__.py index 26efdb9a..7d1ea634 100644 --- a/backend/modelscope_studio/components/antd/tooltip/__init__.py +++ b/backend/modelscope_studio/components/antd/tooltip/__init__.py @@ -22,19 +22,19 @@ class AntdTooltip(ModelScopeLayoutComponent): def __init__( self, - title: str | None = "", + title: str | None = None, props: dict | None = None, *, align: dict | None = None, - arrow: bool | dict | None = True, - auto_adjust_overflow: bool = True, + arrow: bool | dict | None = None, + auto_adjust_overflow: bool | None = None, color: str | None = None, default_open: bool | None = None, destroy_tooltip_on_hide: bool | None = None, fresh: bool | None = None, get_popup_container: str | None = None, - mouse_enter_delay: float | int = 0.1, - mouse_leave_delay: float | int = 0.1, + mouse_enter_delay: float | int | None = None, + mouse_leave_delay: float | int | None = None, overlay_class_name: str | None = None, overlay_style: dict | None = None, overlay_inner_style: dict | None = None, @@ -51,9 +51,10 @@ def __init__( 'leftBottom', 'rightTop', 'rightBottom', - ] = 'top', + ] | None = None, trigger: Literal['hover', 'focus', 'click', 'contextMenu'] - | list[Literal['hover', 'focus', 'click', 'contextMenu']] = 'hover', + | list[Literal['hover', 'focus', 'click', 'contextMenu']] + | None = None, open: bool | None = None, z_index: int | None = None, root_class_name: str | None = None, diff --git a/backend/modelscope_studio/components/antd/tree/__init__.py b/backend/modelscope_studio/components/antd/tree/__init__.py index 4825f7e5..c54d9212 100644 --- a/backend/modelscope_studio/components/antd/tree/__init__.py +++ b/backend/modelscope_studio/components/antd/tree/__init__.py @@ -19,7 +19,7 @@ class AntdTree(ModelScopeLayoutComponent): EVENTS = [ EventListener("check", callback=lambda block: block._internal.update( - bind_click_event=True)), + bind_check_event=True)), EventListener("drag_end", callback=lambda block: block._internal.update( bind_dragEnd_event=True)), diff --git a/backend/modelscope_studio/components/antd/tree/directory_tree/__init__.py b/backend/modelscope_studio/components/antd/tree/directory_tree/__init__.py index 0d987747..43a2a72a 100644 --- a/backend/modelscope_studio/components/antd/tree/directory_tree/__init__.py +++ b/backend/modelscope_studio/components/antd/tree/directory_tree/__init__.py @@ -150,7 +150,7 @@ def __init__( @property def skip_api(self): - return False + return True def preprocess(self, payload: None) -> None: return payload diff --git a/backend/modelscope_studio/components/antd/tree_select/__init__.py b/backend/modelscope_studio/components/antd/tree_select/__init__.py index 8658d5e3..d8a458bf 100644 --- a/backend/modelscope_studio/components/antd/tree_select/__init__.py +++ b/backend/modelscope_studio/components/antd/tree_select/__init__.py @@ -41,14 +41,9 @@ class AntdTreeSelect(ModelScopeDataLayoutComponent): # supported slots SLOTS = [ - 'allowClear.clearIcon', - 'maxTagPlaceholder', - 'notFoundContent', - 'suffixIcon', - 'switcherIcon', - 'dropdownRender', - 'tagRender', - 'treeTitleRender', + 'allowClear.clearIcon', 'maxTagPlaceholder', 'notFoundContent', + 'prefix', 'suffixIcon', 'switcherIcon', 'dropdownRender', 'tagRender', + 'treeTitleRender', 'treeData' ] def __init__( @@ -76,9 +71,10 @@ def __init__( max_tag_text_length: int | None = None, multiple: bool | None = None, not_found_content: str | None = None, + prefix: str | None = None, placeholder: str | None = None, placement: Literal['bottomLeft', 'bottomRight', 'topLeft', - 'topRight'] | None = 'bottomLeft', + 'topRight'] | None = None, search_value: str | None = None, show_checked_strategy: Literal['SHOW_ALL', 'SHOW_PARENT', 'SHOW_CHILD'] | None = None, @@ -102,8 +98,8 @@ def __init__( tree_loaded_keys: list[str] | None = None, tree_node_filter_prop: str | None = None, tree_node_label_prop: str | None = None, - variant: Literal['outline', 'borderless', 'solid'] - | None = 'outline', + variant: Literal['outlined', 'borderless', 'solid'] + | None = None, virtual: bool | None = True, root_class_name: str | None = None, as_item: str | None = None, @@ -133,6 +129,7 @@ def __init__( self.popup_match_select_width = popup_match_select_width self.dropdown_render = dropdown_render self.dropdown_style = dropdown_style + self.prefix = prefix self.field_names = field_names self.filter_tree_node = filter_tree_node self.get_popup_container = get_popup_container diff --git a/backend/modelscope_studio/components/antd/tree_select/tree_node/__init__.py b/backend/modelscope_studio/components/antd/tree_select/tree_node/__init__.py index 1ad4d426..e7f49413 100644 --- a/backend/modelscope_studio/components/antd/tree_select/tree_node/__init__.py +++ b/backend/modelscope_studio/components/antd/tree_select/tree_node/__init__.py @@ -13,7 +13,7 @@ class AntdTreeSelectTreeNode(ModelScopeLayoutComponent): EVENTS = [] # supported slots - SLOTS = ["title"] + SLOTS = ["title", "icon"] def __init__( self, diff --git a/backend/modelscope_studio/components/antd/typography/text/__init__.py b/backend/modelscope_studio/components/antd/typography/text/__init__.py index 9a7fa45c..5dbc1f88 100644 --- a/backend/modelscope_studio/components/antd/typography/text/__init__.py +++ b/backend/modelscope_studio/components/antd/typography/text/__init__.py @@ -103,7 +103,7 @@ def __init__( delete: Deleted line style. disabled: Disabled content. editable: If editable. Can control edit state when is object. - ellipsis: Display ellipsis when text overflows, can't configure expandable、rows and onExpand by using object. Diff with Typography.Paragraph, Text do not have 100% width style which means it will fix width on the first ellipsis. If you want to have responsive ellipsis, please set width manually. + ellipsis: Display ellipsis when text overflows, can't configure expandable, rows and onExpand by using object. Diff with Typography.Paragraph, Text do not have 100% width style which means it will fix width on the first ellipsis. If you want to have responsive ellipsis, please set width manually. keyboard: Keyboard style. mark: Marked style. strong: Bold style. diff --git a/backend/modelscope_studio/components/antd/upload/__init__.py b/backend/modelscope_studio/components/antd/upload/__init__.py index 3d599f58..3da05c31 100644 --- a/backend/modelscope_studio/components/antd/upload/__init__.py +++ b/backend/modelscope_studio/components/antd/upload/__init__.py @@ -29,7 +29,7 @@ class AntdUpload(ModelScopeDataLayoutComponent): EVENTS = [ EventListener("change", callback=lambda block: block._internal.update( - bind_click_event=True)), + bind_change_event=True)), EventListener("drop", callback=lambda block: block._internal.update( bind_drop_event=True)), diff --git a/backend/modelscope_studio/components/antd/upload/dragger/__init__.py b/backend/modelscope_studio/components/antd/upload/dragger/__init__.py index d291d675..a905e081 100644 --- a/backend/modelscope_studio/components/antd/upload/dragger/__init__.py +++ b/backend/modelscope_studio/components/antd/upload/dragger/__init__.py @@ -2,7 +2,7 @@ import tempfile from pathlib import Path -from typing import TYPE_CHECKING, Any, Callable +from typing import TYPE_CHECKING, Any, Callable, Literal import gradio_client.utils as client_utils from gradio import processing_utils @@ -25,7 +25,7 @@ class AntdUploadDragger(ModelScopeDataLayoutComponent): EVENTS = [ EventListener("change", callback=lambda block: block._internal.update( - bind_click_event=True)), + bind_change_event=True)), EventListener("drop", callback=lambda block: block._internal.update( bind_drop_event=True)), @@ -57,6 +57,31 @@ def __init__( value: list[str] | Callable | None = None, props: dict | None = None, *, + accept: str | None = None, + action: str | None = None, + before_upload: str | None = None, + custom_request: str | None = None, + data: dict | str | None = None, + default_file_list: list[dict] | None = None, + directory: bool | None = None, + disabled: bool | None = None, + file_list: list[dict] | None = None, + headers: dict | None = None, + icon_render: str | None = None, + is_image_url: str | None = None, + item_render: str | None = None, + list_type: Literal['text', 'picture', 'picture-card', + 'picture-circle'] | None = None, + max_count: int | None = None, + method: str | None = None, + multiple: bool | None = None, + form_name: str | None = None, + open_file_dialog_on_click: bool | None = True, + preview_file: str | None = None, + progress: dict | None = None, + show_upload_list: bool | dict | None = True, + with_credentials: bool | None = None, + root_class_name: str | None = None, as_item: str | None = None, _internal: None = None, # gradio properties @@ -83,6 +108,30 @@ def __init__( **kwargs) self.props = props + self.accept = accept + self.action = action + self.before_upload = before_upload + self.custom_request = custom_request + self.data = data + self.default_file_list = default_file_list + self.directory = directory + self.disabled = disabled + self.file_list = file_list + self.headers = headers + self.icon_render = icon_render + self.is_image_url = is_image_url + self.item_render = item_render + self.list_type = list_type + self.max_count = max_count + self.method = method + self.multiple = multiple + self.form_name = form_name + self.open_file_dialog_on_click = open_file_dialog_on_click + self.preview_file = preview_file + self.progress = progress + self.show_upload_list = show_upload_list + self.with_credentials = with_credentials + self.root_class_name = root_class_name FRONTEND_DIR = resolve_frontend_dir("upload", "dragger") diff --git a/backend/modelscope_studio/components/base/div/__init__.py b/backend/modelscope_studio/components/base/div/__init__.py index 7fdd1b62..cf4d290d 100644 --- a/backend/modelscope_studio/components/base/div/__init__.py +++ b/backend/modelscope_studio/components/base/div/__init__.py @@ -7,6 +7,7 @@ from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir from ...antd.carousel import AntdCarousel from ...antd.space import AntdSpace +from ...antd.tooltip import AntdTooltip from ..slot import ModelScopeSlot @@ -65,10 +66,13 @@ def __init__( as_item=as_item, elem_style=elem_style, **kwargs) - if self.parent and self._internal and (any( - isinstance(self.parent, component) - for component in [AntdCarousel, AntdSpace, ModelScopeSlot])): + isinstance(self.parent, component) for component in [ + AntdCarousel, + AntdSpace, + AntdTooltip, + ModelScopeSlot, + ])): self._internal.update(fragment=True) self.value = value self.props = props diff --git a/backend/modelscope_studio/components/base/span/__init__.py b/backend/modelscope_studio/components/base/span/__init__.py index eda853d1..7793f5de 100644 --- a/backend/modelscope_studio/components/base/span/__init__.py +++ b/backend/modelscope_studio/components/base/span/__init__.py @@ -7,6 +7,7 @@ from ....utils.dev import ModelScopeLayoutComponent, resolve_frontend_dir from ...antd.carousel import AntdCarousel from ...antd.space import AntdSpace +from ...antd.tooltip import AntdTooltip from ..slot import ModelScopeSlot @@ -66,8 +67,12 @@ def __init__( elem_style=elem_style, **kwargs) if self.parent and self._internal and (any( - isinstance(self.parent, component) - for component in [AntdCarousel, AntdSpace, ModelScopeSlot])): + isinstance(self.parent, component) for component in [ + AntdCarousel, + AntdSpace, + AntdTooltip, + ModelScopeSlot, + ])): self._internal.update(fragment=True) self.value = value self.props = props diff --git a/backend/modelscope_studio/components/base/text/__init__.py b/backend/modelscope_studio/components/base/text/__init__.py index a13ac3d7..42c50a41 100644 --- a/backend/modelscope_studio/components/base/text/__init__.py +++ b/backend/modelscope_studio/components/base/text/__init__.py @@ -5,6 +5,7 @@ from ....utils.dev import ModelScopeComponent, resolve_frontend_dir from ...antd.carousel import AntdCarousel from ...antd.space import AntdSpace +from ...antd.tooltip import AntdTooltip class ModelScopeText(ModelScopeComponent): @@ -38,7 +39,7 @@ def __init__( **kwargs) if self.parent and self._internal and (any( isinstance(self.parent, component) - for component in [AntdCarousel, AntdSpace])): + for component in [AntdCarousel, AntdTooltip, AntdSpace])): self._internal.update(fragment=True) self.value = value diff --git a/backend/modelscope_studio/utils/dev/component.py b/backend/modelscope_studio/utils/dev/component.py index ed9d90a7..087ee443 100644 --- a/backend/modelscope_studio/utils/dev/component.py +++ b/backend/modelscope_studio/utils/dev/component.py @@ -92,7 +92,7 @@ class ModelScopeDataLayoutComponent(Component, # supported slots SLOTS = [] - # fix gradio’s bug + # fix gradio's bug @property def component_class_id(self): return self.get_component_class_id() diff --git a/backend/modelscope_studio/version.py b/backend/modelscope_studio/version.py index 021fd2fa..0ca8409e 100644 --- a/backend/modelscope_studio/version.py +++ b/backend/modelscope_studio/version.py @@ -1 +1 @@ -__version__ = "1.0.0-beta.7" +__version__ = "1.0.0-beta.9" diff --git a/config/changelog/CHANGELOG.md b/config/changelog/CHANGELOG.md index 937f5ec9..358c78d7 100644 --- a/config/changelog/CHANGELOG.md +++ b/config/changelog/CHANGELOG.md @@ -1,5 +1,17 @@ # @modelscope-studio/changelog +## 1.0.0-beta.9 + +### Fixes + +- [`e7fa278`](https://github.com/modelscope/modelscope-studio/commit/e7fa2782af83a7e78cddb700cd8d5e63ad62342f) - bugfix of remaining components. Thanks [@Col0ring](https://github.com/Col0ring)! + +## 1.0.0-beta.8 + +### Fixes + +- [`a692793`](https://github.com/modelscope/modelscope-studio/commit/a6927930fa0cbb62b8e91d98fbfda7434586e758) - gbk error. Thanks [@Col0ring](https://github.com/Col0ring)! + ## 1.0.0-beta.7 ### Fixes @@ -88,4 +100,4 @@ No significant changes to this package were made in this release. ## 0.2.0 -No significant changes to this package were made in this release. +No significant changes to this package were made in this release. \ No newline at end of file diff --git a/config/changelog/package.json b/config/changelog/package.json index b42c252e..cc10258a 100644 --- a/config/changelog/package.json +++ b/config/changelog/package.json @@ -1,6 +1,6 @@ { "name": "@modelscope-studio/changelog", - "version": "1.0.0-beta.7", + "version": "1.0.0-beta.9", "private": false, "description": "ModelScope Studio Changelog", "repository": "git@github.com:modelscope/modelscope-studio.git", @@ -25,7 +25,7 @@ }, "devDependencies": { "@changesets/types": "^6.0.0", - "@types/node": "^22.7.5", - "tsup": "^8.3.0" + "@types/node": "^22.10.1", + "tsup": "^8.3.5" } } diff --git a/config/lint-config/CHANGELOG.md b/config/lint-config/CHANGELOG.md index 48c7f6a8..7da669ea 100644 --- a/config/lint-config/CHANGELOG.md +++ b/config/lint-config/CHANGELOG.md @@ -1,5 +1,17 @@ # @modelscope-studio/lint-config +## 1.0.0-beta.9 + +### Fixes + +- [`e7fa278`](https://github.com/modelscope/modelscope-studio/commit/e7fa2782af83a7e78cddb700cd8d5e63ad62342f) - bugfix of remaining components. Thanks [@Col0ring](https://github.com/Col0ring)! + +## 1.0.0-beta.8 + +### Fixes + +- [`a692793`](https://github.com/modelscope/modelscope-studio/commit/a6927930fa0cbb62b8e91d98fbfda7434586e758) - gbk error. Thanks [@Col0ring](https://github.com/Col0ring)! + ## 1.0.0-beta.7 ### Fixes @@ -88,4 +100,4 @@ No significant changes to this package were made in this release. ## 0.2.0 -No significant changes to this package were made in this release. +No significant changes to this package were made in this release. \ No newline at end of file diff --git a/config/lint-config/package.json b/config/lint-config/package.json index 947e9533..5c648e14 100644 --- a/config/lint-config/package.json +++ b/config/lint-config/package.json @@ -1,6 +1,6 @@ { "name": "@modelscope-studio/lint-config", - "version": "1.0.0-beta.7", + "version": "1.0.0-beta.9", "private": false, "description": "ModelScope Studio Lint Config", "repository": "git@github.com:modelscope/modelscope-studio.git", @@ -16,21 +16,21 @@ } }, "dependencies": { - "@eslint/compat": "^1.2.0", - "@eslint/js": "^9.12.0", - "@typescript-eslint/parser": "^8.8.1", + "@eslint/compat": "^1.2.3", + "@eslint/js": "^9.16.0", + "@typescript-eslint/parser": "^8.16.0", "eslint-config-prettier": "^9.0.0", "eslint-import-resolver-typescript": "^3.6.0", "eslint-plugin-import": "^2.31.0", - "eslint-plugin-jsx-a11y": "^6.9.0", + "eslint-plugin-jsx-a11y": "^6.10.2", "eslint-plugin-prettier": "5.2.1", - "eslint-plugin-react": "^7.37.1", - "eslint-plugin-react-hooks": "^4.6.2", - "eslint-plugin-react-refresh": "^0.4.12", + "eslint-plugin-react": "^7.37.2", + "eslint-plugin-react-hooks": "^5.0.0", + "eslint-plugin-react-refresh": "^0.4.14", "eslint-plugin-simple-import-sort": "^12.1.0", - "eslint-plugin-svelte": "^2.44.1", - "globals": "^15.11.0", - "postcss": "^8.4.47", + "eslint-plugin-svelte": "^2.46.1", + "globals": "^15.13.0", + "postcss": "^8.4.49", "postcss-less": "^6.0.0", "stylelint-config-ali": "^2.1.1", "stylelint-config-rational-order": "^0.1.2", @@ -38,8 +38,8 @@ "stylelint-declaration-block-no-ignored-properties": "^2.8.0", "stylelint-order": "^6.0.4", "stylelint-prettier": "^5.0.2", - "svelte-eslint-parser": "^0.41.1", - "typescript-eslint": "^8.8.1" + "svelte-eslint-parser": "^0.43.0", + "typescript-eslint": "^8.16.0" }, "devDependencies": { "@types/eslint": "^9.6.1", diff --git a/docs/app.py b/docs/app.py index 49d97d53..818360e5 100644 --- a/docs/app.py +++ b/docs/app.py @@ -56,7 +56,7 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): "type": "group", "children": [{ - "label": "Application", + "label": get_text("Application", "Application 应用"), "key": "application" }, { "label": get_text("AutoLoading", "AutoLoading 自动加载"), @@ -89,10 +89,10 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): "type": "group", "children": [{ - "label": "Each", + "label": get_text("Each", "Each 循环"), "key": "each" }, { - "label": "Filter", + "label": get_text("Filter", "Filter 过滤"), "key": "filter" }] }] @@ -207,6 +207,24 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): }, { "label": get_text("Select", "Select 选择器"), "key": "select" + }, { + "label": get_text("Slider", "Slider 滑动输入条"), + "key": "slider" + }, { + "label": get_text("Switch", "Switch 开关"), + "key": "switch" + }, { + "label": get_text("TimePicker", "TimePicker 时间选择器"), + "key": "time_picker" + }, { + "label": get_text("Transfer", "Transfer 穿梭框"), + "key": "transfer" + }, { + "label": get_text("TreeSelect", "TreeSelect 树选择"), + "key": "tree_select" + }, { + "label": get_text("Upload", "Upload 上传"), + "key": "upload" }] }, { "label": @@ -214,8 +232,107 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): "type": "group", "children": [{ + "label": get_text("Avatar", "Avatar 头像"), + "key": "avatar" + }, { + "label": get_text("Badge", "Badge 徽标数"), + "key": "badge" + }, { + "label": get_text("Calendar", "Calendar 日历"), + "key": "calendar" + }, { + "label": get_text("Card", "Card 卡片"), + "key": "card" + }, { + "label": get_text("Carousel", "Carousel 走马灯"), + "key": "carousel" + }, { + "label": get_text("Collapse", "Collapse 折叠面板"), + "key": "collapse" + }, { + "label": get_text("Descriptions", "Descriptions 描述列表"), + "key": "descriptions" + }, { + "label": get_text("Empty", "Empty 空状态"), + "key": "empty" + }, { + "label": get_text("Image", "Image 图片"), + "key": "image" + }, { + "label": get_text("List", "List 列表"), + "key": "list" + }, { + "label": get_text("Popover", "Popover 气泡卡片"), + "key": "popover" + }, { + "label": get_text("QRCode", "QRCode 二维码"), + "key": "qr_code" + }, { + "label": get_text("Segmented", "Segmented 分段控制器"), + "key": "segmented" + }, { + "label": get_text("Statistic", "Statistic 统计数值"), + "key": "statistic" + }, { + "label": get_text("Table", "Table 表格"), + "key": "table" + }, { + "label": get_text("Tabs", "Tabs 标签页"), + "key": "tabs" + }, { + "label": get_text("Tag", "Tag 标签"), + "key": "tag" + }, { + "label": get_text("Timeline", "Timeline 时间轴"), + "key": "timeline" + }, { + "label": get_text("Tooltip", "Tooltip 文字提示"), + "key": "tooltip" + }, { "label": get_text("Tour", "Tour 漫游式引导"), "key": "tour" + }, { + "label": get_text("Tree", "Tree 树形控件"), + "key": "tree" + }] +}, { + "label": + get_text("Feedback", "反馈"), + "type": + "group", + "children": [{ + "label": get_text("Alert", "Alert 警告提示"), + "key": "alert" + }, { + "label": get_text("Drawer", "Drawer 抽屉"), + "key": "drawer" + }, { + "label": get_text("Message", "Message 全局提示"), + "key": "message" + }, { + "label": get_text("Modal", "Modal 对话框"), + "key": "modal" + }, { + "label": get_text("Notification", "Notification 通知提醒框"), + "key": "notification" + }, { + "label": get_text("Popconfirm", "Popconfirm 气泡确认框"), + "key": "popconfirm" + }, { + "label": get_text("Progress", "Progress 进度条"), + "key": "progress" + }, { + "label": get_text("Result", "Result 结果"), + "key": "result" + }, { + "label": get_text("Skeleton", "Skeleton 骨架屏"), + "key": "skeleton" + }, { + "label": get_text("Spin", "Spin 加载中"), + "key": "spin" + }, { + "label": get_text("Watermark", "Watermark 水印"), + "key": "watermark" }] }, { "label": @@ -223,6 +340,9 @@ def get_docs(file_path: str, type: Literal["antd", "base"]): "type": "group", "children": [{ + "label": get_text("Affix", "Affix 固钉"), + "key": "affix" + }, { "label": get_text("ConfigProvider", "ConfigProvider 全局化配置"), "key": "config_provider" }] diff --git a/docs/components/antd/affix/README-zh_CN.md b/docs/components/antd/affix/README-zh_CN.md new file mode 100644 index 00000000..e9742b47 --- /dev/null +++ b/docs/components/antd/affix/README-zh_CN.md @@ -0,0 +1,8 @@ +# Affix + +Stick an element to the viewport. See [Ant Design](https://ant.design/components/affix/) for more information. + +## Examples + + + diff --git a/docs/components/antd/affix/README.md b/docs/components/antd/affix/README.md new file mode 100644 index 00000000..e9742b47 --- /dev/null +++ b/docs/components/antd/affix/README.md @@ -0,0 +1,8 @@ +# Affix + +Stick an element to the viewport. See [Ant Design](https://ant.design/components/affix/) for more information. + +## Examples + + + diff --git a/docs/components/antd/affix/app.py b/docs/components/antd/affix/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/affix/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/affix/demos/basic.py b/docs/components/antd/affix/demos/basic.py new file mode 100644 index 00000000..e6cfdf61 --- /dev/null +++ b/docs/components/antd/affix/demos/basic.py @@ -0,0 +1,16 @@ +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.Affix(offset_top=100): + antd.Button("Affix to top", type="primary") + antd.Divider() + with antd.Affix(offset_bottom=100): + antd.Button("Affix to bottom", type="primary") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/affix/demos/container_to_scroll.py b/docs/components/antd/affix/demos/container_to_scroll.py new file mode 100644 index 00000000..f957d57a --- /dev/null +++ b/docs/components/antd/affix/demos/container_to_scroll.py @@ -0,0 +1,27 @@ +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 ms.Div(elem_id="affix_container", + elem_style={ + "width": '100%', + "height": 100, + "overflow": 'auto', + "boxShadow": '0 0 0 1px #1677ff', + "scrollbarWidth": 'thin', + "scrollbarGutter": 'stable', + }): + with ms.Div(elem_style=dict(width="100%", height=1000)): + with antd.Affix( + get_target= + "() => document.querySelector('#affix_container')" + ): + antd.Button("Fixed at the top of container", + type="primary") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/alert/README-zh_CN.md b/docs/components/antd/alert/README-zh_CN.md new file mode 100644 index 00000000..45047d8f --- /dev/null +++ b/docs/components/antd/alert/README-zh_CN.md @@ -0,0 +1,7 @@ +# Alert + +Display warning messages that require attention. See [Ant Design](https://ant.design/components/alert/) for more information. + +## Examples + + diff --git a/docs/components/antd/alert/README.md b/docs/components/antd/alert/README.md new file mode 100644 index 00000000..45047d8f --- /dev/null +++ b/docs/components/antd/alert/README.md @@ -0,0 +1,7 @@ +# Alert + +Display warning messages that require attention. See [Ant Design](https://ant.design/components/alert/) for more information. + +## Examples + + diff --git a/docs/components/antd/alert/app.py b/docs/components/antd/alert/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/alert/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/alert/demos/basic.py b/docs/components/antd/alert/demos/basic.py new file mode 100644 index 00000000..45013540 --- /dev/null +++ b/docs/components/antd/alert/demos/basic.py @@ -0,0 +1,40 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "message": "Success Text", + "description": + "Success Description Success Description Success Description Success Description", + "type": "success" +}, { + "message": "Info Text", + "description": + "Info Description Info Description Info Description Info Description", + "type": "info" +}, { + "message": "Warning Text", + "description": + "Warning Description Warning Description Warning Description Warning Description", + "type": "warning" +}, { + "message": "Error Text", + "description": + "Error Description Error Description Error Description Error Description", + "type": "error" +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(direction="vertical"): + for item in data: + antd.Alert(message=item["message"], + description=item["description"], + type=item["type"], + closable=True, + show_icon=True) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/avatar/README-zh_CN.md b/docs/components/antd/avatar/README-zh_CN.md new file mode 100644 index 00000000..880d78e9 --- /dev/null +++ b/docs/components/antd/avatar/README-zh_CN.md @@ -0,0 +1,8 @@ +# Avatar + +Used to represent users or things, supporting the display of images, icons, or characters. See [Ant Design](https://ant.design/components/avatar/) for more information. + +## Examples + + + diff --git a/docs/components/antd/avatar/README.md b/docs/components/antd/avatar/README.md new file mode 100644 index 00000000..880d78e9 --- /dev/null +++ b/docs/components/antd/avatar/README.md @@ -0,0 +1,8 @@ +# Avatar + +Used to represent users or things, supporting the display of images, icons, or characters. See [Ant Design](https://ant.design/components/avatar/) for more information. + +## Examples + + + diff --git a/docs/components/antd/avatar/app.py b/docs/components/antd/avatar/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/avatar/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/avatar/demos/basic.py b/docs/components/antd/avatar/demos/basic.py new file mode 100644 index 00000000..8fd8b7bd --- /dev/null +++ b/docs/components/antd/avatar/demos/basic.py @@ -0,0 +1,43 @@ +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(size=16, wrap=True): + with antd.Avatar(): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(): + ms.Text('U') + with antd.Avatar(shape="square"): + ms.Text("USER") + antd.Avatar( + "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" + ) + with antd.Avatar(): + with ms.Slot("src"): + antd.Image( + "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg", + alt="avatar") + with antd.Avatar(elem_style=dict(backgroundColor='#fde3cf', + color='#f56a00')): + ms.Text("U") + with antd.Avatar(elem_style=dict(backgroundColor='#87d068')): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + + antd.Divider("With Badge") + with antd.Space(size=24): + with antd.Badge(count=1): + with antd.Avatar(shape="square"): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Badge(dot=True): + with antd.Avatar(shape="square"): + with ms.Slot("icon"): + antd.Icon("UserOutlined") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/avatar/demos/group.py b/docs/components/antd/avatar/demos/group.py new file mode 100644 index 00000000..b1912d3c --- /dev/null +++ b/docs/components/antd/avatar/demos/group.py @@ -0,0 +1,99 @@ +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.Avatar.Group(): + antd.Avatar( + value="https://api.dicebear.com/7.x/miniavs/svg?seed=1") + with antd.Avatar(elem_style=dict(backgroundColor="#f56a00")): + ms.Text("K") + with antd.Tooltip(title="Ant User", placement="top"): + with antd.Avatar(elem_style=dict( + backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(elem_style=dict(backgroundColor="#1677ff")): + with ms.Slot("icon"): + antd.Icon("AntDesignOutlined") + + antd.Divider() + + with antd.Avatar.Group(max=dict( + count=2, + style=dict(color="#f56a00", backgroundColor="#fde3cf"))): + antd.Avatar( + value="https://api.dicebear.com/7.x/miniavs/svg?seed=2") + with antd.Avatar(elem_style=dict(backgroundColor="#f56a00")): + ms.Text("K") + with antd.Tooltip(title="Ant User", placement="top"): + with antd.Avatar(elem_style=dict( + backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(elem_style=dict(backgroundColor="#1677ff")): + with ms.Slot("icon"): + antd.Icon("AntDesignOutlined") + + antd.Divider() + + with antd.Avatar.Group(size="large", + max=dict(count=2, + style=dict( + color="#f56a00", + backgroundColor="#fde3cf"))): + antd.Avatar( + value="https://api.dicebear.com/7.x/miniavs/svg?seed=3") + with antd.Avatar(elem_style=dict(backgroundColor="#f56a00")): + ms.Text("K") + with antd.Tooltip(title="Ant User", placement="top"): + with antd.Avatar(elem_style=dict( + backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(elem_style=dict(backgroundColor="#1677ff")): + with ms.Slot("icon"): + antd.Icon("AntDesignOutlined") + + antd.Divider() + + with antd.Avatar.Group(size="large", + max=dict(count=2, + style=dict( + color="#f56a00", + backgroundColor="#fde3cf", + cursor="pointer"), + popover=dict(trigger="click"))): + antd.Avatar( + value= + "https://zos.alipayobjects.com/rmsportal/ODTLcjxAfvqbxHnVXCYX.png" + ) + with antd.Avatar(elem_style=dict(backgroundColor="#f56a00")): + ms.Text("K") + with antd.Tooltip(title="Ant User", placement="top"): + with antd.Avatar(elem_style=dict( + backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(elem_style=dict(backgroundColor="#1677ff")): + with ms.Slot("icon"): + antd.Icon("AntDesignOutlined") + + antd.Divider() + + with antd.Avatar.Group(shape="square"): + with antd.Avatar(elem_style=dict(backgroundColor="#fde3cf")): + ms.Text("A") + with antd.Avatar(elem_style=dict(backgroundColor="#f56a00")): + ms.Text("K") + with antd.Avatar(elem_style=dict(backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + with antd.Avatar(elem_style=dict(backgroundColor="#1677ff")): + with ms.Slot("icon"): + antd.Icon("AntDesignOutlined") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/badge/README-zh_CN.md b/docs/components/antd/badge/README-zh_CN.md new file mode 100644 index 00000000..df072fbf --- /dev/null +++ b/docs/components/antd/badge/README-zh_CN.md @@ -0,0 +1,8 @@ +# Badge + +Small numerical value or status descriptor for UI elements. See [Ant Design](https://ant.design/components/badge/) for more information. + +## Examples + + + diff --git a/docs/components/antd/badge/README.md b/docs/components/antd/badge/README.md new file mode 100644 index 00000000..df072fbf --- /dev/null +++ b/docs/components/antd/badge/README.md @@ -0,0 +1,8 @@ +# Badge + +Small numerical value or status descriptor for UI elements. See [Ant Design](https://ant.design/components/badge/) for more information. + +## Examples + + + diff --git a/docs/components/antd/badge/app.py b/docs/components/antd/badge/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/badge/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/badge/demos/basic.py b/docs/components/antd/badge/demos/basic.py new file mode 100644 index 00000000..91f615c0 --- /dev/null +++ b/docs/components/antd/badge/demos/basic.py @@ -0,0 +1,36 @@ +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(size="middle"): + with antd.Badge(count=5): + antd.Avatar(shape="square", size="large") + + with antd.Badge(count=0, show_zero=True): + antd.Avatar(shape="square", size="large") + + with antd.Badge(elem_style=dict(color="#f5222d")): + with ms.Slot("count"): + antd.Icon("ClockCircleOutlined") + antd.Avatar(shape="square", size="large") + with antd.Badge(count=99, overflow_count=10): + antd.Avatar(shape="square", size="large") + with antd.Badge(count=1000, overflow_count=999): + antd.Avatar(shape="square", size="large") + + with antd.Badge(dot=True): + antd.Icon("NotificationOutlined", + elem_style=dict(fontSize="16")) + antd.Divider("Status") + with antd.Space(direction="vertical"): + antd.Badge(status="success", text="Success") + antd.Badge(status="error", text="Error") + antd.Badge(status="default", text="Default") + antd.Badge(status="processing", text="Processing") + antd.Badge(status="warning", text="Warning") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/badge/demos/ribbon.py b/docs/components/antd/badge/demos/ribbon.py new file mode 100644 index 00000000..1aac3c99 --- /dev/null +++ b/docs/components/antd/badge/demos/ribbon.py @@ -0,0 +1,52 @@ +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(direction="vertical", + size="middle", + elem_style=dict(width="100%")): + with antd.Badge.Ribbon(text="Hippies"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="pink"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="red"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="cyan"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="green"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="purple"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="volcano"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") + + with antd.Badge.Ribbon(text="Hippies", color="magenta"): + with antd.Card(title="Pushes open the window", + size="small"): + ms.Text("and raises the spyglass.") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/calendar/README-zh_CN.md b/docs/components/antd/calendar/README-zh_CN.md new file mode 100644 index 00000000..f0d43399 --- /dev/null +++ b/docs/components/antd/calendar/README-zh_CN.md @@ -0,0 +1,8 @@ +# Calendar + +A container that displays data in calendar form. See [Ant Design](https://ant.design/components/calendar/) for more information. + +## Examples + + + diff --git a/docs/components/antd/calendar/README.md b/docs/components/antd/calendar/README.md new file mode 100644 index 00000000..f0d43399 --- /dev/null +++ b/docs/components/antd/calendar/README.md @@ -0,0 +1,8 @@ +# Calendar + +A container that displays data in calendar form. See [Ant Design](https://ant.design/components/calendar/) for more information. + +## Examples + + + diff --git a/docs/components/antd/calendar/app.py b/docs/components/antd/calendar/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/calendar/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/calendar/demos/basic.py b/docs/components/antd/calendar/demos/basic.py new file mode 100644 index 00000000..7dfaafed --- /dev/null +++ b/docs/components/antd/calendar/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(): + antd.Calendar() + antd.Divider("Card") + with antd.Card(): + antd.Calendar(fullscreen=False) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/calendar/demos/notice_calendar.py b/docs/components/antd/calendar/demos/notice_calendar.py new file mode 100644 index 00000000..baf2165c --- /dev/null +++ b/docs/components/antd/calendar/demos/notice_calendar.py @@ -0,0 +1,56 @@ +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(): + antd.Calendar(cell_render="""(current, info) => { + if (info.type === 'date') { + if (current.date() === 8) { + const React = window.ms_globals.React; + const antd = window.ms_globals.antd; + const events = [ + { + type: 'warning', + content: 'This is warning event.', + }, + { + type: 'success', + content: 'This is usual event.', + }, + ]; + return React.createElement( + 'ul', + { + style: { + margin: 0, + padding: 0, + listStyle: 'none' + } + }, + events.map((event) => { + return React.createElement( + 'li', + { + style: { + marginBottom: 8, + }, + }, + [ + React.createElement(antd.Badge, { + status: event.type, + text: event.content, + }), + ] + ); + }) + ); + } + } + return info.originNode; +}""") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/card/README-zh_CN.md b/docs/components/antd/card/README-zh_CN.md new file mode 100644 index 00000000..7ec12ede --- /dev/null +++ b/docs/components/antd/card/README-zh_CN.md @@ -0,0 +1,9 @@ +# Card + +A container for displaying information. See [Ant Design](https://ant.design/components/card/) for more information. + +## Examples + + + + diff --git a/docs/components/antd/card/README.md b/docs/components/antd/card/README.md new file mode 100644 index 00000000..7ec12ede --- /dev/null +++ b/docs/components/antd/card/README.md @@ -0,0 +1,9 @@ +# Card + +A container for displaying information. See [Ant Design](https://ant.design/components/card/) for more information. + +## Examples + + + + diff --git a/docs/components/antd/card/app.py b/docs/components/antd/card/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/card/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/card/demos/basic.py b/docs/components/antd/card/demos/basic.py new file mode 100644 index 00000000..1e407e9f --- /dev/null +++ b/docs/components/antd/card/demos/basic.py @@ -0,0 +1,28 @@ +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(direction="vertical", size=16): + with antd.Card(title="Default size card", + elem_style=dict(width=300)): + with ms.Slot("extra"): + antd.Button("More", type="link", href="#") + ms.Div("Card content") + ms.Div("Card content") + ms.Div("Card content") + with antd.Card(title="Small size card", + elem_style=dict(width=300), + size="small", + bordered=False): + with ms.Slot("extra"): + antd.Button("More", type="link", href="#") + ms.Div("Card content") + ms.Div("Card content") + ms.Div("Card content") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/card/demos/customized_content.py b/docs/components/antd/card/demos/customized_content.py new file mode 100644 index 00000000..a72fefe9 --- /dev/null +++ b/docs/components/antd/card/demos/customized_content.py @@ -0,0 +1,40 @@ +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(direction="vertical", size=16): + with antd.Card(hoverable=True, elem_style=dict(width=240)): + with ms.Slot("cover"): + antd.Image( + value= + "https://os.alipayobjects.com/rmsportal/QBnOOoLaAfKPirc.png", + width="100%", + preview=False, + alt="example") + antd.Card.Meta(title="Europe Street beat", + description="www.instagram.com") + with antd.Card(elem_style=dict(width=300)): + with ms.Slot("cover"): + antd.Image( + value= + "https://gw.alipayobjects.com/zos/rmsportal/JiqGstEfoWAOHiTxclqi.png", + preview=False, + width="100%", + alt="example") + with ms.Slot("actions"): + antd.Icon("SettingOutlined") + antd.Icon("EditOutlined") + antd.Icon("EllipsisOutlined") + with antd.Card.Meta(title="Card title", + description="This is the description"): + with ms.Slot("avatar"): + antd.Avatar( + "https://api.dicebear.com/7.x/miniavs/svg?seed=8" + ) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/card/demos/grid_card.py b/docs/components/antd/card/demos/grid_card.py new file mode 100644 index 00000000..357eb155 --- /dev/null +++ b/docs/components/antd/card/demos/grid_card.py @@ -0,0 +1,31 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +gridStyle = { + "width": '25%', + "textAlign": 'center', +} + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Card(title="Card Title"): + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(hoverable=False, elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + with antd.Card.Grid(elem_style=gridStyle): + ms.Text("Content") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/carousel/README-zh_CN.md b/docs/components/antd/carousel/README-zh_CN.md new file mode 100644 index 00000000..37e7e469 --- /dev/null +++ b/docs/components/antd/carousel/README-zh_CN.md @@ -0,0 +1,7 @@ +# Carousel + +A set of carousel areas. See [Ant Design](https://ant.design/components/carousel/) for more information. + +## Examples + + diff --git a/docs/components/antd/carousel/README.md b/docs/components/antd/carousel/README.md new file mode 100644 index 00000000..37e7e469 --- /dev/null +++ b/docs/components/antd/carousel/README.md @@ -0,0 +1,7 @@ +# Carousel + +A set of carousel areas. See [Ant Design](https://ant.design/components/carousel/) for more information. + +## Examples + + diff --git a/docs/components/antd/carousel/app.py b/docs/components/antd/carousel/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/carousel/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/carousel/demos/basic.py b/docs/components/antd/carousel/demos/basic.py new file mode 100644 index 00000000..a4648116 --- /dev/null +++ b/docs/components/antd/carousel/demos/basic.py @@ -0,0 +1,74 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_dot_position = 'bottom' +default_auto_play = True +default_show_arrows = True + +content_style = { + "margin": 0, + "height": '160px', + "color": '#fff', + "lineHeight": '160px', + "textAlign": 'center', + "background": '#364d79', +} + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + dot_position = antd.RadioGroup(value=default_dot_position, + option_type="button", + options=[{ + "label": "Top", + "value": "top" + }, { + "label": "Bottom", + "value": "bottom" + }, { + "label": "Left", + "value": "left" + }, { + "label": "Right", + "value": "right" + }]) + auto_play = antd.Switch(value=default_auto_play, + checked_children="AutoPlay", + un_checked_children="No AutoPlay") + show_arrows = antd.Switch(value=default_show_arrows, + checked_children="Show Arrows", + un_checked_children="Hide Arrows") + with antd.Carousel(dot_position=default_dot_position, + autoplay=default_auto_play, + arrows=default_show_arrows) as carousel: + with ms.Div(): + antd.Typography.Title("1", + level=3, + elem_style=content_style) + with ms.Div(): + antd.Typography.Title("2", + level=3, + elem_style=content_style) + with ms.Div(): + antd.Typography.Title("3", + level=3, + elem_style=content_style) + with ms.Div(): + antd.Typography.Title("4", + level=3, + elem_style=content_style) + + auto_play.change(fn=lambda x: gr.update(autoplay=x), + inputs=[auto_play], + outputs=[carousel]) + show_arrows.change(fn=lambda x: gr.update(arrows=x), + inputs=[show_arrows], + outputs=[carousel]) + dot_position.change(fn=lambda x: gr.update(dot_position=x), + inputs=[dot_position], + outputs=[carousel]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/collapse/README-zh_CN.md b/docs/components/antd/collapse/README-zh_CN.md new file mode 100644 index 00000000..6ece7804 --- /dev/null +++ b/docs/components/antd/collapse/README-zh_CN.md @@ -0,0 +1,8 @@ +# Collapse + +A content area which can be collapsed and expanded. +See [Ant Design](https://ant.design/components/collapse/) for more information. + +## Examples + + diff --git a/docs/components/antd/collapse/README.md b/docs/components/antd/collapse/README.md new file mode 100644 index 00000000..6ece7804 --- /dev/null +++ b/docs/components/antd/collapse/README.md @@ -0,0 +1,8 @@ +# Collapse + +A content area which can be collapsed and expanded. +See [Ant Design](https://ant.design/components/collapse/) for more information. + +## Examples + + diff --git a/docs/components/antd/collapse/app.py b/docs/components/antd/collapse/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/collapse/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/collapse/demos/basic.py b/docs/components/antd/collapse/demos/basic.py new file mode 100644 index 00000000..4e77694e --- /dev/null +++ b/docs/components/antd/collapse/demos/basic.py @@ -0,0 +1,42 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_accordion = False + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + accordion = antd.Switch(value=default_accordion, + checked_children="Accordion", + un_checked_children="Collapse") + with antd.Collapse(default_active_key=['2'], + accordion=default_accordion) as collapse: + with antd.Collapse.Item(collapsible='disabled', + key="1", + label="This is panel header 1"): + antd.Typography.Paragraph(""" + A dog is a type of domesticated animal. + Known for its loyalty and faithfulness, + it can be found as a welcome guest in many households across the world. +""") + with antd.Collapse.Item(label="This is panel header 2", + key="2"): + antd.Typography.Paragraph(""" + A dog is a type of domesticated animal. + Known for its loyalty and faithfulness, + it can be found as a welcome guest in many households across the world. +""") + with antd.Collapse.Item(label="This is panel header 3", + key="3"): + antd.Typography.Paragraph(""" + A dog is a type of domesticated animal. + Known for its loyalty and faithfulness, + it can be found as a welcome guest in many households across the world. +""") + accordion.change(fn=lambda x: gr.update(accordion=x), + inputs=[accordion], + outputs=[collapse]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/descriptions/README-zh_CN.md b/docs/components/antd/descriptions/README-zh_CN.md new file mode 100644 index 00000000..c69b1d66 --- /dev/null +++ b/docs/components/antd/descriptions/README-zh_CN.md @@ -0,0 +1,8 @@ +# Descriptions + +Display multiple read-only fields in a group. +See [Ant Design](https://ant.design/components/descriptions/) for more information. + +## Examples + + diff --git a/docs/components/antd/descriptions/README.md b/docs/components/antd/descriptions/README.md new file mode 100644 index 00000000..c69b1d66 --- /dev/null +++ b/docs/components/antd/descriptions/README.md @@ -0,0 +1,8 @@ +# Descriptions + +Display multiple read-only fields in a group. +See [Ant Design](https://ant.design/components/descriptions/) for more information. + +## Examples + + diff --git a/docs/components/antd/descriptions/app.py b/docs/components/antd/descriptions/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/descriptions/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/descriptions/demos/basic.py b/docs/components/antd/descriptions/demos/basic.py new file mode 100644 index 00000000..285942df --- /dev/null +++ b/docs/components/antd/descriptions/demos/basic.py @@ -0,0 +1,59 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_bordered = False + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + bordered = antd.Switch(value=default_bordered, + checked_children="Border", + un_checked_children="No Border") + with antd.Descriptions(title="User Info", + bordered=default_bordered) as descriptions: + with antd.Descriptions.Item(label="Product"): + ms.Text("Cloud Database") + with antd.Descriptions.Item(label="Billing Mode"): + ms.Text("Prepaid") + + with antd.Descriptions.Item(label="Automatic Renewal"): + ms.Text("YES") + + with antd.Descriptions.Item(label="Order time"): + ms.Text("2018-04-24 18:00:00") + + with antd.Descriptions.Item(label="Usage Time", span=2): + ms.Text("2019-04-24 18:00:00") + + with antd.Descriptions.Item(label="Status", span=3): + antd.Badge(status="processing", text="Running") + + with antd.Descriptions.Item(label="Negotiated Amount"): + ms.Text("$80.00") + + with antd.Descriptions.Item(label="Discount"): + ms.Text("$20.00") + + with antd.Descriptions.Item(label="Official Receipts"): + ms.Text("$60.00") + + with antd.Descriptions.Item(label="Config Info"): + gr.HTML("""Data disk type: MongoDB +
+Database version: 3.4 +
+Package: dds.mongo.mid +
+Storage space: 10 GB +
+Replication factor: 3 +
+Region: East China 1 +
""") + bordered.change(fn=lambda x: gr.update(bordered=x), + inputs=[bordered], + outputs=[descriptions]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/drawer/README-zh_CN.md b/docs/components/antd/drawer/README-zh_CN.md new file mode 100644 index 00000000..9db674ce --- /dev/null +++ b/docs/components/antd/drawer/README-zh_CN.md @@ -0,0 +1,8 @@ +# Drawer + +A panel that slides out from the edge of the screen. See [Ant Design](https://ant.design/components/drawer/) for more information. + +## Examples + + + diff --git a/docs/components/antd/drawer/README.md b/docs/components/antd/drawer/README.md new file mode 100644 index 00000000..9db674ce --- /dev/null +++ b/docs/components/antd/drawer/README.md @@ -0,0 +1,8 @@ +# Drawer + +A panel that slides out from the edge of the screen. See [Ant Design](https://ant.design/components/drawer/) for more information. + +## Examples + + + diff --git a/docs/components/antd/drawer/app.py b/docs/components/antd/drawer/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/drawer/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/drawer/demos/basic.py b/docs/components/antd/drawer/demos/basic.py new file mode 100644 index 00000000..e75ed307 --- /dev/null +++ b/docs/components/antd/drawer/demos/basic.py @@ -0,0 +1,19 @@ +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(): + btn = antd.Button("Open Drawer", type="primary") + with antd.Drawer(open=False, title="Basic Drawer") as drawer: + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + btn.click(fn=lambda: gr.update(open=True), outputs=[drawer]) + + drawer.close(fn=lambda: gr.update(open=False), outputs=[drawer]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/drawer/demos/extra_actions.py b/docs/components/antd/drawer/demos/extra_actions.py new file mode 100644 index 00000000..21661caf --- /dev/null +++ b/docs/components/antd/drawer/demos/extra_actions.py @@ -0,0 +1,36 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_placement = 'right' + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + placement = antd.RadioGroup( + options=["top", "bottom", "left", "right"], + value=default_placement) + btn = antd.Button("Open Drawer", type="primary") + with antd.Drawer(open=False, + title="Drawer with extra actions", + width=500) as drawer: + with ms.Slot("extra"): + with antd.Space(): + cancel_btn = antd.Button("Cancel") + ok_btn = antd.Button("OK", type="primary") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + placement.change(fn=lambda p: gr.update(placement=p), + inputs=[placement], + outputs=[drawer]) + btn.click(fn=lambda: gr.update(open=True), outputs=[drawer]) + + gr.on([drawer.close, ok_btn.click, cancel_btn.click], + fn=lambda: gr.update(open=False), + outputs=[drawer]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/empty/README-zh_CN.md b/docs/components/antd/empty/README-zh_CN.md new file mode 100644 index 00000000..a15150d7 --- /dev/null +++ b/docs/components/antd/empty/README-zh_CN.md @@ -0,0 +1,7 @@ +# Empty + +Empty state placeholder. See [Ant Design](https://ant.design/components/empty/) for more information. + +## Examples + + diff --git a/docs/components/antd/empty/README.md b/docs/components/antd/empty/README.md new file mode 100644 index 00000000..a15150d7 --- /dev/null +++ b/docs/components/antd/empty/README.md @@ -0,0 +1,7 @@ +# Empty + +Empty state placeholder. See [Ant Design](https://ant.design/components/empty/) for more information. + +## Examples + + diff --git a/docs/components/antd/empty/app.py b/docs/components/antd/empty/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/empty/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/empty/demos/basic.py b/docs/components/antd/empty/demos/basic.py new file mode 100644 index 00000000..feafe351 --- /dev/null +++ b/docs/components/antd/empty/demos/basic.py @@ -0,0 +1,25 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_bordered = False + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(direction="vertical"): + antd.Empty() + antd.Empty(description=False) + antd.Empty(image="PRESENTED_IMAGE_SIMPLE") + with antd.Empty( + image= + "https://gw.alipayobjects.com/zos/antfincdn/ZHrcdLPrvN/empty.svg", + image_style=dict(height=60)): + with ms.Slot("description"): + with antd.Typography.Text(): + ms.Text("Customize") + antd.Button('Description', type="link", href="#") + antd.Button("Create Now", type="primary") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/form/demos/basic.py b/docs/components/antd/form/demos/basic.py index a9481ba5..23dc7a80 100644 --- a/docs/components/antd/form/demos/basic.py +++ b/docs/components/antd/form/demos/basic.py @@ -67,12 +67,14 @@ def on_change(_form): antd.Input.Password() with antd.Form.Item(form_name="files", label="Upload"): with antd.Upload.Dragger(): - with ms.Div(elem_classes="ant-upload-drag-icon"): + with ms.Div( + elem_style=dict(fontSize=40, color="#1677ff")): antd.Icon("InboxOutlined") - ms.Div("Click or drag file to this area to upload", - elem_classes="ant-upload-text") - ms.Div("Support for a single or bulk upload.", - elem_classes="ant-upload-hint") + antd.Typography.Paragraph( + "Click or drag file to this area to upload") + antd.Typography.Paragraph( + "Support for a single or bulk upload.", + type="secondary") with antd.Form.Item( wrapper_col=dict(offset=8, span=16), diff --git a/docs/components/antd/image/README-zh_CN.md b/docs/components/antd/image/README-zh_CN.md new file mode 100644 index 00000000..cd6eed9e --- /dev/null +++ b/docs/components/antd/image/README-zh_CN.md @@ -0,0 +1,7 @@ +# Image + +Preview-able image. See [Ant Design](https://ant.design/components/image/) for more information. + +## Examples + + diff --git a/docs/components/antd/image/README.md b/docs/components/antd/image/README.md new file mode 100644 index 00000000..cd6eed9e --- /dev/null +++ b/docs/components/antd/image/README.md @@ -0,0 +1,7 @@ +# Image + +Preview-able image. See [Ant Design](https://ant.design/components/image/) for more information. + +## Examples + + diff --git a/docs/components/antd/image/app.py b/docs/components/antd/image/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/image/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/image/demos/basic.py b/docs/components/antd/image/demos/basic.py new file mode 100644 index 00000000..c09a323f --- /dev/null +++ b/docs/components/antd/image/demos/basic.py @@ -0,0 +1,40 @@ +import os + +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(): + antd.Image( + "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png", + width=200) + antd.Image( + "https://zos.alipayobjects.com/rmsportal/jkjgkEfvpUPVyRjUImniVslZfWPnJuuZ.png", + preview=False, + width=200) + antd.Image( + os.path.join(os.path.dirname(__file__), + "../resources/modelscope.png")) + antd.Divider("Multiple image preview") + with antd.Image.PreviewGroup(): + antd.Image( + "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg", + width=200) + antd.Image( + "https://gw.alipayobjects.com/zos/antfincdn/aPkFc8Sj7n/method-draw-image.svg", + width=200) + antd.Divider("Preview from one image") + with antd.Image.PreviewGroup(items=[ + 'https://gw.alipayobjects.com/zos/antfincdn/LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp', + 'https://gw.alipayobjects.com/zos/antfincdn/cV16ZqzMjW/photo-1473091540282-9b846e7965e3.webp', + 'https://gw.alipayobjects.com/zos/antfincdn/x43I27A55%26/photo-1438109491414-7198515b166b.webp', + ]): + antd.Image( + "https://gw.alipayobjects.com/zos/antfincdn/LlvErxo8H9/photo-1503185912284-5271ff81b9a8.webp", + width=200) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/image/resources/modelscope.png b/docs/components/antd/image/resources/modelscope.png new file mode 100644 index 00000000..1fb167d3 Binary files /dev/null and b/docs/components/antd/image/resources/modelscope.png differ diff --git a/docs/components/antd/list/README-zh_CN.md b/docs/components/antd/list/README-zh_CN.md new file mode 100644 index 00000000..14165ff0 --- /dev/null +++ b/docs/components/antd/list/README-zh_CN.md @@ -0,0 +1,8 @@ +# List + +Basic list display, which can carry text, lists, pictures, paragraphs. See [Ant Design](https://ant.design/components/list/) for more information. + +## Examples + + + diff --git a/docs/components/antd/list/README.md b/docs/components/antd/list/README.md new file mode 100644 index 00000000..14165ff0 --- /dev/null +++ b/docs/components/antd/list/README.md @@ -0,0 +1,8 @@ +# List + +Basic list display, which can carry text, lists, pictures, paragraphs. See [Ant Design](https://ant.design/components/list/) for more information. + +## Examples + + + diff --git a/docs/components/antd/list/app.py b/docs/components/antd/list/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/list/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/list/demos/basic.py b/docs/components/antd/list/demos/basic.py new file mode 100644 index 00000000..d42de7fb --- /dev/null +++ b/docs/components/antd/list/demos/basic.py @@ -0,0 +1,52 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "text": 'Racing car sprays burning fuel into crowd.', +}, { + "text": 'Japanese princess to wed commoner.', +}, { + "text": 'Australian walks 100km after outback crash.', +}, { + "text": 'Man charged over missing wedding girl.', +}, { + "text": 'Los Angeles battles huge wildfires.', +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + antd.Divider("Static Render") + with antd.List(header="Header", footer="Footer", bordered=True): + for item in data: + with antd.List.Item(): + antd.Typography.Text("[ITEM]", mark=True) + ms.Text(item["text"]) + + antd.Divider("Dynamic Render") + with antd.List(header="Header", footer="Footer", bordered=True): + with ms.Each(value=data): + with antd.List.Item(): + antd.Typography.Text("[ITEM]", mark=True) + ms.Text(as_item="text") + antd.Divider("Dynamic Render with JavaScript") + antd.List(header="Header", + footer="Footer", + bordered=True, + data_source=data, + render_item="""(item) => { + const React = window.ms_globals.React; + const antd = window.ms_globals.antd; + return React.createElement( + antd.List.Item, + null, + React.createElement(antd.Typography.Text, { mark: true }, '[ITEM]'), + React.createElement(antd.Typography.Text, null, item.text) + ); +}; +""") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/list/demos/vertical_item.py b/docs/components/antd/list/demos/vertical_item.py new file mode 100644 index 00000000..e2e92859 --- /dev/null +++ b/docs/components/antd/list/demos/vertical_item.py @@ -0,0 +1,67 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + 'avatar': + f'https://api.dicebear.com/7.x/miniavs/svg?seed={i}', + "link": { + "href": "https://ant.design", + "value": f"ant design part {i}" + }, + "meta": { + 'description': + 'Ant Design, a design language for background applications, is refined by Ant UED Team.', + }, + 'content': + 'We supply a series of design principles, practical patterns and high quality design resources (Sketch and Axure), to help people create their product prototypes beautifully and efficiently.' +} for i in range(10)] + +page_size = 3 + + +def IconText(icon: str, text: str): + with antd.Space(): + antd.Icon(icon) + ms.Text(text) + + +def on_pagination_change(e: gr.EventData): + current = e._data["payload"][0] + return gr.update(value=data[(current - 1) * 3:current * 3]) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.List(item_layout="vertical", + size="large", + pagination=dict(total=len(data), + pageSize=page_size)) as list: + with ms.Slot("footer"): + with ms.Div(): + antd.Typography.Text('ant design', strong=True) + ms.Text("footer part") + with ms.Each(value=data[0:3]) as list_items: + with antd.List.Item(): + with ms.Slot("actions"): + IconText('StarOutlined', 156) + IconText('LikeOutlined', 156) + IconText('MessageOutlined', 2) + with ms.Slot("extra"): + antd.Image( + "https://gw.alipayobjects.com/zos/rmsportal/mqaQswcyDLcXyDKnZfES.png", + preview=False, + alt="logo", + width=272) + with antd.List.Item.Meta(as_item="meta"): + with ms.Slot("avatar"): + antd.Avatar(as_item="avatar") + with ms.Slot("title"): + antd.Typography.Link(as_item="link") + ms.Text(as_item="content") + list.pagination_change(fn=on_pagination_change, + outputs=[list_items]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/message/README-zh_CN.md b/docs/components/antd/message/README-zh_CN.md new file mode 100644 index 00000000..6a29b623 --- /dev/null +++ b/docs/components/antd/message/README-zh_CN.md @@ -0,0 +1,7 @@ +# Message + +Display global messages as feedback in response to user operations. See [Ant Design](https://ant.design/components/message/) for more information. + +## Examples + + diff --git a/docs/components/antd/message/README.md b/docs/components/antd/message/README.md new file mode 100644 index 00000000..6a29b623 --- /dev/null +++ b/docs/components/antd/message/README.md @@ -0,0 +1,7 @@ +# Message + +Display global messages as feedback in response to user operations. See [Ant Design](https://ant.design/components/message/) for more information. + +## Examples + + diff --git a/docs/components/antd/message/app.py b/docs/components/antd/message/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/message/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/message/demos/basic.py b/docs/components/antd/message/demos/basic.py new file mode 100644 index 00000000..36d34b55 --- /dev/null +++ b/docs/components/antd/message/demos/basic.py @@ -0,0 +1,51 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + + +def info(): + return gr.update(visible=True, + type="info", + content="This is a info message.", + key="info") + + +def success(): + return gr.update(visible=True, + type="success", + content="This is a success message.", + key="success") + + +def error(): + return gr.update(visible=True, + type="error", + content="This is an error message.", + key="error") + + +def warning(): + return gr.update(visible=True, + type="warning", + content="This is a warning message.", + key="warning") + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + info_btn = antd.Button("Info") + success_btn = antd.Button("Success") + error_btn = antd.Button("Error") + warning_btn = antd.Button("Warning") + + message = antd.Message(visible=False) + info_btn.click(info, outputs=[message]) + success_btn.click(success, outputs=[message]) + error_btn.click(error, outputs=[message]) + warning_btn.click(warning, outputs=[message]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/modal/README-zh_CN.md b/docs/components/antd/modal/README-zh_CN.md new file mode 100644 index 00000000..3e0f5e09 --- /dev/null +++ b/docs/components/antd/modal/README-zh_CN.md @@ -0,0 +1,12 @@ +# Modal + +Display a modal dialog box, providing a title, content area, and action buttons. See [Ant Design](https://ant.design/components/modal/) for more information. + +## Examples + + + + +Like `Message` and `Notification`, `Modal` can be used as a static method. + + diff --git a/docs/components/antd/modal/README.md b/docs/components/antd/modal/README.md new file mode 100644 index 00000000..3e0f5e09 --- /dev/null +++ b/docs/components/antd/modal/README.md @@ -0,0 +1,12 @@ +# Modal + +Display a modal dialog box, providing a title, content area, and action buttons. See [Ant Design](https://ant.design/components/modal/) for more information. + +## Examples + + + + +Like `Message` and `Notification`, `Modal` can be used as a static method. + + diff --git a/docs/components/antd/modal/app.py b/docs/components/antd/modal/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/modal/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/modal/demos/basic.py b/docs/components/antd/modal/demos/basic.py new file mode 100644 index 00000000..b0aa1bfe --- /dev/null +++ b/docs/components/antd/modal/demos/basic.py @@ -0,0 +1,19 @@ +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(): + btn = antd.Button("Open Modal", type="primary") + with antd.Modal(open=False, title="Basic Modal") as modal: + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + btn.click(lambda: gr.update(open=True), outputs=[modal]) + + modal.ok(lambda: gr.update(open=False), outputs=[modal]) + modal.cancel(lambda: gr.update(open=False), outputs=[modal]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/modal/demos/custom_footer.py b/docs/components/antd/modal/demos/custom_footer.py new file mode 100644 index 00000000..c69e9115 --- /dev/null +++ b/docs/components/antd/modal/demos/custom_footer.py @@ -0,0 +1,31 @@ +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(): + btn = antd.Button("Open Modal", type="primary") + with antd.Modal(open=False, title="Basic Modal") as modal: + with ms.Slot("footer"): + cancel_btn = antd.Button("Return") + submit_btn = antd.Button("Submit", type="primary") + link_btn = antd.Button("Search on Google", + type="primary", + href_target="_blank", + href="https://google.com") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + btn.click(lambda: gr.update(open=True), outputs=[modal]) + + modal.ok(lambda: gr.update(open=False), outputs=[modal]) + + cancel_btn.click(lambda: gr.update(open=False), outputs=[modal]) + modal.cancel(lambda: gr.update(open=False), outputs=[modal]) + gr.on([submit_btn.click, link_btn.click], + fn=lambda: gr.update(open=False), + outputs=[modal]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/modal/demos/static.py b/docs/components/antd/modal/demos/static.py new file mode 100644 index 00000000..5b1ad89b --- /dev/null +++ b/docs/components/antd/modal/demos/static.py @@ -0,0 +1,74 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + + +def info(): + return gr.update( + visible=True, + mask_closable=False, + title="Info", + type="info", + content="This is a info message.", + ) + + +def success(): + return gr.update( + visible=True, + mask_closable=False, + title="Success", + type="success", + content="This is a success message.", + ) + + +def error(): + return gr.update( + visible=True, + mask_closable=False, + title="Error", + type="error", + content="This is an error message.", + ) + + +def warning(): + return gr.update( + visible=True, + mask_closable=False, + title="Warning", + type="warning", + content="This is a warning message.", + ) + + +def confirm(): + return gr.update( + visible=True, + mask_closable=True, + title="Confirm", + type="confirm", + content="This is a confirm message.", + ) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + info_btn = antd.Button("Info") + success_btn = antd.Button("Success") + error_btn = antd.Button("Error") + warning_btn = antd.Button("Warning") + confirm_btn = antd.Button("Confirm") + + modal = antd.Modal.Static(visible=False) + info_btn.click(info, outputs=[modal]) + success_btn.click(success, outputs=[modal]) + error_btn.click(error, outputs=[modal]) + warning_btn.click(warning, outputs=[modal]) + confirm_btn.click(confirm, outputs=[modal]) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/notification/README-zh_CN.md b/docs/components/antd/notification/README-zh_CN.md new file mode 100644 index 00000000..0070d377 --- /dev/null +++ b/docs/components/antd/notification/README-zh_CN.md @@ -0,0 +1,7 @@ +# Notification + +Prompt notification message globally. See [Ant Design](https://ant.design/components/notification/) for more information. + +## Examples + + diff --git a/docs/components/antd/notification/README.md b/docs/components/antd/notification/README.md new file mode 100644 index 00000000..0070d377 --- /dev/null +++ b/docs/components/antd/notification/README.md @@ -0,0 +1,7 @@ +# Notification + +Prompt notification message globally. See [Ant Design](https://ant.design/components/notification/) for more information. + +## Examples + + diff --git a/docs/components/antd/notification/app.py b/docs/components/antd/notification/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/notification/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/notification/demos/basic.py b/docs/components/antd/notification/demos/basic.py new file mode 100644 index 00000000..c3cae097 --- /dev/null +++ b/docs/components/antd/notification/demos/basic.py @@ -0,0 +1,59 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + + +def info(): + return gr.update(visible=True, + type="info", + message="Info Notification Message", + description="This is a info description.", + placement="topLeft", + key="info") + + +def success(): + return gr.update(visible=True, + type="success", + message="Success Notification Message", + description="This is a success description.", + placement="topRight", + key="success") + + +def error(): + return gr.update(visible=True, + type="error", + message="Error Notification Message", + description="This is an error description.", + placement="bottomLeft", + key="error") + + +def warning(): + return gr.update(visible=True, + type="warning", + message="Warning Notification Message", + description="This is a warning description.", + placement="bottomRight", + key="warning") + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + info_btn = antd.Button("Info") + success_btn = antd.Button("Success") + error_btn = antd.Button("Error") + warning_btn = antd.Button("Warning") + + notification = antd.Notification(visible=False) + info_btn.click(info, outputs=[notification]) + success_btn.click(success, outputs=[notification]) + error_btn.click(error, outputs=[notification]) + warning_btn.click(warning, outputs=[notification]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/pagination/demos/basic.py b/docs/components/antd/pagination/demos/basic.py index 50317b58..7ef86e93 100644 --- a/docs/components/antd/pagination/demos/basic.py +++ b/docs/components/antd/pagination/demos/basic.py @@ -9,7 +9,7 @@ antd.Pagination(total=85, show_quick_jumper=True, show_size_changer=True, - show_total="(total) => `Total ${total} items``") + show_total="(total) => `Total ${total} items`") if __name__ == "__main__": demo.queue().launch() diff --git a/docs/components/antd/popconfirm/README-zh_CN.md b/docs/components/antd/popconfirm/README-zh_CN.md new file mode 100644 index 00000000..972483ca --- /dev/null +++ b/docs/components/antd/popconfirm/README-zh_CN.md @@ -0,0 +1,7 @@ +# Popconfirm + +Pop up a bubble confirmation box for an action. See [Ant Design](https://ant.design/components/popconfirm/) for more information. + +## Examples + + diff --git a/docs/components/antd/popconfirm/README.md b/docs/components/antd/popconfirm/README.md new file mode 100644 index 00000000..972483ca --- /dev/null +++ b/docs/components/antd/popconfirm/README.md @@ -0,0 +1,7 @@ +# Popconfirm + +Pop up a bubble confirmation box for an action. See [Ant Design](https://ant.design/components/popconfirm/) for more information. + +## Examples + + diff --git a/docs/components/antd/popconfirm/app.py b/docs/components/antd/popconfirm/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/popconfirm/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/popconfirm/demos/basic.py b/docs/components/antd/popconfirm/demos/basic.py new file mode 100644 index 00000000..01eef8cc --- /dev/null +++ b/docs/components/antd/popconfirm/demos/basic.py @@ -0,0 +1,19 @@ +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.Popconfirm( + title="Delete the task", + description="Are you sure to delete this task?", + ok_text="Yes", + cancel_text="No") as popconfirm: + antd.Button("Delete", danger=True) + popconfirm.confirm(lambda: print("confirm")) + popconfirm.cancel(lambda: print("cancel")) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/popover/README-zh_CN.md b/docs/components/antd/popover/README-zh_CN.md new file mode 100644 index 00000000..61fee781 --- /dev/null +++ b/docs/components/antd/popover/README-zh_CN.md @@ -0,0 +1,7 @@ +# Popover + +The floating card pops up when clicking/mouse hovering over an element. See [Ant Design](https://ant.design/components/popover/) for more information. + +## Examples + + diff --git a/docs/components/antd/popover/README.md b/docs/components/antd/popover/README.md new file mode 100644 index 00000000..61fee781 --- /dev/null +++ b/docs/components/antd/popover/README.md @@ -0,0 +1,7 @@ +# Popover + +The floating card pops up when clicking/mouse hovering over an element. See [Ant Design](https://ant.design/components/popover/) for more information. + +## Examples + + diff --git a/docs/components/antd/popover/app.py b/docs/components/antd/popover/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/popover/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/popover/demos/basic.py b/docs/components/antd/popover/demos/basic.py new file mode 100644 index 00000000..ce9f7ab2 --- /dev/null +++ b/docs/components/antd/popover/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 Content(): + antd.Typography.Paragraph("Content") + antd.Typography.Paragraph("Content") + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + with antd.Popover(title="Title", trigger="hover"): + with ms.Slot("content"): + Content() + antd.Button("Hover me", type="primary") + with antd.Popover(title="Title", trigger="focus"): + with ms.Slot("content"): + Content() + antd.Button("Focus me", type="primary") + with antd.Popover(title="Title", trigger="click"): + with ms.Slot("content"): + Content() + antd.Button("Click me", type="primary") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/progress/README-zh_CN.md b/docs/components/antd/progress/README-zh_CN.md new file mode 100644 index 00000000..32530509 --- /dev/null +++ b/docs/components/antd/progress/README-zh_CN.md @@ -0,0 +1,7 @@ +# Progress + +Display the current progress of the operation. See [Ant Design](https://ant.design/components/progress/) for more information. + +## Examples + + diff --git a/docs/components/antd/progress/README.md b/docs/components/antd/progress/README.md new file mode 100644 index 00000000..32530509 --- /dev/null +++ b/docs/components/antd/progress/README.md @@ -0,0 +1,7 @@ +# Progress + +Display the current progress of the operation. See [Ant Design](https://ant.design/components/progress/) for more information. + +## Examples + + diff --git a/docs/components/antd/progress/app.py b/docs/components/antd/progress/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/progress/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/progress/demos/basic.py b/docs/components/antd/progress/demos/basic.py new file mode 100644 index 00000000..27ade316 --- /dev/null +++ b/docs/components/antd/progress/demos/basic.py @@ -0,0 +1,39 @@ +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.Flex(gap="small", vertical=True): + antd.Progress(percent=30) + antd.Progress(percent=50, status='active') + antd.Progress(percent=70, status="exception") + antd.Progress(percent=100) + antd.Progress(percent=50, show_info=False) + antd.Divider("Circular progress bar") + with antd.Flex(gap="small", wrap=True): + antd.Progress(type="circle", percent=75) + antd.Progress(type="circle", percent=70, status="exception") + antd.Progress(type="circle", percent=100) + antd.Progress( + type="circle", + percent=100, + format= + """( percent ) => percent === 100 ? 'Done' : percent + '%' """ + ) + antd.Divider("Progress bar with steps") + with antd.Flex(gap="small", vertical=True): + antd.Progress(percent=50, steps=3) + antd.Progress(percent=30, steps=5) + antd.Progress(percent=100, + steps=5, + size="small", + stroke_color='#f56a00') + antd.Progress(percent=60, + steps=5, + stroke_color=['#f56a00', '#1890ff', '#13c2c2']) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/qr_code/README-zh_CN.md b/docs/components/antd/qr_code/README-zh_CN.md new file mode 100644 index 00000000..aee01c17 --- /dev/null +++ b/docs/components/antd/qr_code/README-zh_CN.md @@ -0,0 +1,7 @@ +# QRCode + +Components that can convert text into QR codes, and support custom color and logo. See [Ant Design](https://ant.design/components/qr-code/) for more information. + +## Examples + + diff --git a/docs/components/antd/qr_code/README.md b/docs/components/antd/qr_code/README.md new file mode 100644 index 00000000..aee01c17 --- /dev/null +++ b/docs/components/antd/qr_code/README.md @@ -0,0 +1,7 @@ +# QRCode + +Components that can convert text into QR codes, and support custom color and logo. See [Ant Design](https://ant.design/components/qr-code/) for more information. + +## Examples + + diff --git a/docs/components/antd/qr_code/app.py b/docs/components/antd/qr_code/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/qr_code/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/qr_code/demos/basic.py b/docs/components/antd/qr_code/demos/basic.py new file mode 100644 index 00000000..93b7b6b7 --- /dev/null +++ b/docs/components/antd/qr_code/demos/basic.py @@ -0,0 +1,19 @@ +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(): + antd.QRCode("https://ant.design") + antd.Divider("With Icon") + antd.QRCode( + value="https://ant.design/", + error_level='H', + icon= + "https://gw.alipayobjects.com/zos/rmsportal/KDpgvguMpGfqaHPjicRK.svg" + ) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/result/README-zh_CN.md b/docs/components/antd/result/README-zh_CN.md new file mode 100644 index 00000000..450ad8f4 --- /dev/null +++ b/docs/components/antd/result/README-zh_CN.md @@ -0,0 +1,7 @@ +# Result + +Used to feedback the processing results of a series of operations. See [Ant Design](https://ant.design/components/result/) for more information. + +## Examples + + diff --git a/docs/components/antd/result/README.md b/docs/components/antd/result/README.md new file mode 100644 index 00000000..450ad8f4 --- /dev/null +++ b/docs/components/antd/result/README.md @@ -0,0 +1,7 @@ +# Result + +Used to feedback the processing results of a series of operations. See [Ant Design](https://ant.design/components/result/) for more information. + +## Examples + + diff --git a/docs/components/antd/result/app.py b/docs/components/antd/result/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/result/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/result/demos/basic.py b/docs/components/antd/result/demos/basic.py new file mode 100644 index 00000000..9db8e2bc --- /dev/null +++ b/docs/components/antd/result/demos/basic.py @@ -0,0 +1,57 @@ +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(): + antd.Divider("Success") + with antd.Result( + status="success", + title="Successfully Purchased Cloud Server ECS!", + sub_title= + "Order number: 2017182818828182881 Cloud server configuration takes 1-5 minutes, please wait.", + ): + with ms.Slot("extra"): + antd.Button("Go Console", type="primary") + antd.Button("Buy Again") + antd.Divider("Info") + with antd.Result(title="Your operation has been executed", ): + with ms.Slot("extra"): + antd.Button("Go Console", type="primary") + antd.Divider("Warning") + with antd.Result( + status="warning", + title="There are some problems with your operation.", + ): + with ms.Slot("extra"): + antd.Button("Go Console", type="primary") + antd.Divider("Error") + with antd.Result( + status="error", + title="Submission Failed.", + sub_title= + "Please check and modify the following information before resubmitting." + ): + with ms.Slot("extra"): + antd.Button("Go Console", type="primary") + antd.Button("Buy Again") + with ms.Div(): + with antd.Typography.Paragraph(): + antd.Typography.Text( + "The content you submitted has the following error:", + strong=True, + elem_style=dict(fontSize=16)) + with antd.Typography.Paragraph(): + antd.Icon("CloseCircleOutlined", + elem_style=dict(color="red")) + ms.Text("Your account has been frozen.") + antd.Typography.Link("Thaw immediately >") + with antd.Typography.Paragraph(): + antd.Icon("CloseCircleOutlined", + elem_style=dict(color="red")) + ms.Text("our account is not yet eligible to apply.") + antd.Typography.Link("TApply Unlock >") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/segmented/README-zh_CN.md b/docs/components/antd/segmented/README-zh_CN.md new file mode 100644 index 00000000..4d70176b --- /dev/null +++ b/docs/components/antd/segmented/README-zh_CN.md @@ -0,0 +1,7 @@ +# Segmented + +Display multiple options and allow users to select a single option. See [Ant Design](https://ant.design/components/segmented/) for more information. + +## Examples + + diff --git a/docs/components/antd/segmented/README.md b/docs/components/antd/segmented/README.md new file mode 100644 index 00000000..4d70176b --- /dev/null +++ b/docs/components/antd/segmented/README.md @@ -0,0 +1,7 @@ +# Segmented + +Display multiple options and allow users to select a single option. See [Ant Design](https://ant.design/components/segmented/) for more information. + +## Examples + + diff --git a/docs/components/antd/segmented/app.py b/docs/components/antd/segmented/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/segmented/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/segmented/demos/basic.py b/docs/components/antd/segmented/demos/basic.py new file mode 100644 index 00000000..cb670263 --- /dev/null +++ b/docs/components/antd/segmented/demos/basic.py @@ -0,0 +1,53 @@ +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(direction="vertical"): + antd.Segmented(options=[ + 'Daily', 'Weekly', 'Monthly', 'Quarterly', 'Yearly' + ]) + antd.Segmented(options=[ + 'Daily', + { + "label": 'Weekly', + "value": 'Weekly', + "disabled": True + }, + 'Monthly', + { + "label": 'Quarterly', + "value": 'Quarterly', + "disabled": True + }, + 'Yearly', + ]) + with antd.Segmented(): + with antd.Segmented.Option(value="user1"): + with ms.Slot("label"): + with ms.Div(): + antd.Avatar( + "https://api.dicebear.com/7.x/miniavs/svg?seed=8" + ) + ms.Div("User 1") + with antd.Segmented.Option(value="user2"): + with ms.Slot("label"): + with ms.Div(elem_style=dict(padding=4)): + with antd.Avatar(elem_style=dict( + backgroundColor="#f56a00")): + ms.Text("K") + ms.Div("User 2") + with antd.Segmented.Option(value="user3"): + with ms.Slot("label"): + with ms.Div(elem_style=dict(padding=4)): + with antd.Avatar(elem_style=dict( + backgroundColor="#87d068")): + with ms.Slot("icon"): + antd.Icon("UserOutlined") + ms.Div("User 3") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/skeleton/README-zh_CN.md b/docs/components/antd/skeleton/README-zh_CN.md new file mode 100644 index 00000000..40b6d3ce --- /dev/null +++ b/docs/components/antd/skeleton/README-zh_CN.md @@ -0,0 +1,7 @@ +# Skeleton + +Provide a placeholder while you wait for content to load, or to visualize content that doesn't exist yet. See [Ant Design](https://ant.design/components/skeleton/) for more information. + +## Examples + + diff --git a/docs/components/antd/skeleton/README.md b/docs/components/antd/skeleton/README.md new file mode 100644 index 00000000..40b6d3ce --- /dev/null +++ b/docs/components/antd/skeleton/README.md @@ -0,0 +1,7 @@ +# Skeleton + +Provide a placeholder while you wait for content to load, or to visualize content that doesn't exist yet. See [Ant Design](https://ant.design/components/skeleton/) for more information. + +## Examples + + diff --git a/docs/components/antd/skeleton/app.py b/docs/components/antd/skeleton/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/skeleton/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/skeleton/demos/basic.py b/docs/components/antd/skeleton/demos/basic.py new file mode 100644 index 00000000..aa3c2930 --- /dev/null +++ b/docs/components/antd/skeleton/demos/basic.py @@ -0,0 +1,29 @@ +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.Flex(gap="middle", vertical=True): + antd.Skeleton() + antd.Skeleton(avatar=True, paragraph=dict(rows=4)) + antd.Skeleton(active=True) + antd.Divider("Button/Avatar/Input/Image/Node") + with antd.Flex(vertical=True, gap="small"): + with antd.Space(): + antd.Skeleton.Button() + antd.Skeleton.Avatar() + antd.Skeleton.Input() + antd.Skeleton.Button(block=True) + antd.Skeleton.Input(block=True) + with antd.Space(): + antd.Skeleton.Image() + antd.Skeleton.Node(elem_style=dict(width=160)) + with antd.Skeleton.Node(): + antd.Icon("DotChartOutlined", + elem_style=dict(font_size=40, + color="#bfbfbf")) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/slider/README-zh_CN.md b/docs/components/antd/slider/README-zh_CN.md new file mode 100644 index 00000000..c270882b --- /dev/null +++ b/docs/components/antd/slider/README-zh_CN.md @@ -0,0 +1,8 @@ +# Slider + +A Slider component for displaying current value and intervals in range. See [Ant Design](https://ant.design/components/slider/) for more information. + +## Examples + + + diff --git a/docs/components/antd/slider/README.md b/docs/components/antd/slider/README.md new file mode 100644 index 00000000..c270882b --- /dev/null +++ b/docs/components/antd/slider/README.md @@ -0,0 +1,8 @@ +# Slider + +A Slider component for displaying current value and intervals in range. See [Ant Design](https://ant.design/components/slider/) for more information. + +## Examples + + + diff --git a/docs/components/antd/slider/app.py b/docs/components/antd/slider/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/slider/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/slider/demos/basic.py b/docs/components/antd/slider/demos/basic.py new file mode 100644 index 00000000..36a5fc9e --- /dev/null +++ b/docs/components/antd/slider/demos/basic.py @@ -0,0 +1,21 @@ +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(): + antd.Slider(value=50) + antd.Slider(range=True, value=[20, 50]) + antd.Divider("Vertical") + antd.Slider(range=True, + value=[20, 50], + step=5, + vertical=True, + elem_style=dict(height=200)) + antd.Divider("Customize tooltip") + antd.Slider(tooltip=dict(formatter="(value) => `${value}%`")) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/slider/demos/marks.py b/docs/components/antd/slider/demos/marks.py new file mode 100644 index 00000000..d9adad01 --- /dev/null +++ b/docs/components/antd/slider/demos/marks.py @@ -0,0 +1,43 @@ +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(): + antd.Slider( + marks={ + "0": '0°C', + "26": '26°C', + "37": '37°C', + "100": { + "style": { + "color": '#f50' + }, + "label": "100°C", + }, + }) + with antd.Slider(): + with ms.Slot("marks"): + antd.Slider.Mark( + number=0, + label="0°C", + ) + antd.Slider.Mark( + number=26, + label="26°C", + ) + antd.Slider.Mark( + number=37, + label="37°C", + ) + with antd.Slider.Mark( + number=100, + elem_style=dict(width=40), + ): + with ms.Slot("label"): + antd.Typography.Text("100°C", type="success") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/spin/README-zh_CN.md b/docs/components/antd/spin/README-zh_CN.md new file mode 100644 index 00000000..d5c1538e --- /dev/null +++ b/docs/components/antd/spin/README-zh_CN.md @@ -0,0 +1,7 @@ +# Spin + +Used for the loading status of a page or a block. See [Ant Design](https://ant.design/components/spin/) for more information. + +## Examples + + diff --git a/docs/components/antd/spin/README.md b/docs/components/antd/spin/README.md new file mode 100644 index 00000000..d5c1538e --- /dev/null +++ b/docs/components/antd/spin/README.md @@ -0,0 +1,7 @@ +# Spin + +Used for the loading status of a page or a block. See [Ant Design](https://ant.design/components/spin/) for more information. + +## Examples + + diff --git a/docs/components/antd/spin/app.py b/docs/components/antd/spin/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/spin/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/spin/demos/basic.py b/docs/components/antd/spin/demos/basic.py new file mode 100644 index 00000000..fbfadbf7 --- /dev/null +++ b/docs/components/antd/spin/demos/basic.py @@ -0,0 +1,54 @@ +import time + +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + + +def show_loading(): + yield gr.update(spinning=True) + time.sleep(2) + yield gr.update(spinning=False) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Flex(align="center", gap="middle"): + antd.Spin(size="small") + antd.Spin() + antd.Spin(size="large") + antd.Divider("Custom spinning indicator") + with antd.Flex(align="center", gap="middle"): + with antd.Spin(size="small"): + with ms.Slot("indicator"): + antd.Icon("LoadingOutlined", spin=True) + with antd.Spin(): + with ms.Slot("indicator"): + antd.Icon("LoadingOutlined", spin=True) + with antd.Spin(size="large"): + with ms.Slot("indicator"): + antd.Icon("LoadingOutlined", spin=True) + antd.Divider("Progress") + with antd.Flex(align="center", gap="middle"): + antd.Spin(percent=50, size="small") + antd.Spin(percent=90) + antd.Spin(percent="auto", size="large") + antd.Divider("Embedded mode") + with antd.Space(direction='vertical'): + with antd.Spin(tip="Loading...", spinning=False) as spin1: + antd.Alert( + message="Alert message title", + description= + "Further details about the context of this alert.", + type="info") + antd.Button("Show loading").click(fn=show_loading, + outputs=[spin1]) + antd.Divider("Fullscreen") + spin2 = antd.Spin(spinning=False, fullscreen=True) + antd.Button("Show fullscreen").click(fn=show_loading, + outputs=[spin2]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/statistic/README-zh_CN.md b/docs/components/antd/statistic/README-zh_CN.md new file mode 100644 index 00000000..479752c7 --- /dev/null +++ b/docs/components/antd/statistic/README-zh_CN.md @@ -0,0 +1,8 @@ +# Statistic + +Display statistic number. See [Ant Design](https://ant.design/components/statistic/) for more information. + +## Examples + + + diff --git a/docs/components/antd/statistic/README.md b/docs/components/antd/statistic/README.md new file mode 100644 index 00000000..479752c7 --- /dev/null +++ b/docs/components/antd/statistic/README.md @@ -0,0 +1,8 @@ +# Statistic + +Display statistic number. See [Ant Design](https://ant.design/components/statistic/) for more information. + +## Examples + + + diff --git a/docs/components/antd/statistic/app.py b/docs/components/antd/statistic/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/statistic/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/statistic/demos/basic.py b/docs/components/antd/statistic/demos/basic.py new file mode 100644 index 00000000..a68c3273 --- /dev/null +++ b/docs/components/antd/statistic/demos/basic.py @@ -0,0 +1,25 @@ +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.Row(gutter=20): + with antd.Col(span=12): + antd.Statistic(value=112893, title="Active Users") + with antd.Col(span=12): + antd.Statistic(value=112893, + precision=2, + title="Account Balance (CNY)") + with antd.Col(span=12): + with antd.Statistic(value=1128, + precision=2, + title="Feedback"): + with ms.Slot("prefix"): + antd.Icon("LikeOutlined") + with antd.Col(span=12): + antd.Statistic(value=93, suffix="/ 100", title="Unmerged") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/statistic/demos/countdown.py b/docs/components/antd/statistic/demos/countdown.py new file mode 100644 index 00000000..2f4a169f --- /dev/null +++ b/docs/components/antd/statistic/demos/countdown.py @@ -0,0 +1,27 @@ +import time + +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.Row(gutter=20): + with antd.Col(span=12): + antd.Statistic.Countdown( + value=lambda: time.time() + 60 * 60 * 24 * 2, + title="Countdown") + with antd.Col(span=12): + antd.Statistic.Countdown( + value=lambda: time.time() + 60 * 60 * 24 * 2, + title="Million Seconds", + format="HH:mm:ss:SSS") + with antd.Col(span=12): + antd.Statistic.Countdown( + value=lambda: time.time() + 60 * 60 * 24 * 2, + title="Day Level", + format="D-H-m-s") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/switch/README-zh_CN.md b/docs/components/antd/switch/README-zh_CN.md new file mode 100644 index 00000000..9e067cff --- /dev/null +++ b/docs/components/antd/switch/README-zh_CN.md @@ -0,0 +1,7 @@ +# Switch + +Used to toggle between two states. See [Ant Design](https://ant.design/components/switch/) for more information. + +## Examples + + diff --git a/docs/components/antd/switch/README.md b/docs/components/antd/switch/README.md new file mode 100644 index 00000000..9e067cff --- /dev/null +++ b/docs/components/antd/switch/README.md @@ -0,0 +1,7 @@ +# Switch + +Used to toggle between two states. See [Ant Design](https://ant.design/components/switch/) for more information. + +## Examples + + diff --git a/docs/components/antd/switch/app.py b/docs/components/antd/switch/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/switch/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/switch/demos/basic.py b/docs/components/antd/switch/demos/basic.py new file mode 100644 index 00000000..c3c96f8d --- /dev/null +++ b/docs/components/antd/switch/demos/basic.py @@ -0,0 +1,20 @@ +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.Switch(value=True) + antd.Switch(checked_children="Open", + un_checked_children="Close") + with antd.Switch(value=True): + with ms.Slot("checkedChildren"): + antd.Icon("CheckOutlined") + with ms.Slot("unCheckedChildren"): + antd.Icon("CloseOutlined") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/README-zh_CN.md b/docs/components/antd/table/README-zh_CN.md new file mode 100644 index 00000000..e234950b --- /dev/null +++ b/docs/components/antd/table/README-zh_CN.md @@ -0,0 +1,14 @@ +# Table + +A table displays rows of data. See [Ant Design](https://ant.design/components/table/) for more information. + +## Examples + + + + +Currently, due to the rendering limitations in Python, if you need to customize the columns of the rendered table, you can only do this by writing a JavaScript function. + + + + diff --git a/docs/components/antd/table/README.md b/docs/components/antd/table/README.md new file mode 100644 index 00000000..e234950b --- /dev/null +++ b/docs/components/antd/table/README.md @@ -0,0 +1,14 @@ +# Table + +A table displays rows of data. See [Ant Design](https://ant.design/components/table/) for more information. + +## Examples + + + + +Currently, due to the rendering limitations in Python, if you need to customize the columns of the rendered table, you can only do this by writing a JavaScript function. + + + + diff --git a/docs/components/antd/table/app.py b/docs/components/antd/table/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/table/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/table/demos/basic.py b/docs/components/antd/table/demos/basic.py new file mode 100644 index 00000000..f66dda7c --- /dev/null +++ b/docs/components/antd/table/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 + +data = [ + { + "key": '1', + "name": 'Mike', + "age": 32, + "address": '10 Downing Street', + }, + { + "key": '2', + "name": 'John', + "age": 42, + "address": '10 Downing Street', + }, +] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.Table(data_source=data): + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/demos/custom_columns.py b/docs/components/antd/table/demos/custom_columns.py new file mode 100644 index 00000000..690e9754 --- /dev/null +++ b/docs/components/antd/table/demos/custom_columns.py @@ -0,0 +1,104 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "key": "1", + "name": "John Brown", + "age": 32, + "address": "New York No. 1 Lake Park", + "tags": ["nice", "developer"] +}, { + "key": "2", + "name": "Jim Green", + "age": 42, + "address": "London No. 1 Lake Park", + "tags": ["loser"] +}, { + "key": "3", + "name": "Joe Black", + "age": 32, + "address": "Sydney No. 1 Lake Park", + "tags": ["cool", "teacher"] +}] + + +def on_custom(e: gr.EventData): + print(e._data) + + +with gr.Blocks() as demo: + with ms.Application() as app: + with antd.Table(data_source=data): + antd.Table.Column(title="Name", + data_index="name", + key="name", + column_render="""(text) => { + const React = window.ms_globals.React; + return React.createElement('a', null, text); +}""") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") + antd.Table.Column(title="Tags", + data_index="tags", + key="tags", + column_render="""(_, { tags }) => { + const React = window.ms_globals.React; + const antd = window.ms_globals.antd; + return tags.map((tag) => { + let color = tag.length > 5 ? 'geekblue' : 'green'; + if (tag === 'loser') { + color = 'volcano'; + } + return React.createElement(antd.Tag, { color, key: tag }, tag.toUpperCase()); + }); +}""") + antd.Table.Column(title="Action", + key="action", + column_render="""(_, record) => { + const React = window.ms_globals.React; + const antd = window.ms_globals.antd; + const dispatch = window.ms_globals.dispatch; + return React.createElement( + antd.Space, + { size: 'middle' }, + React.createElement( + antd.Button, + { + type: 'primary', + onClick: () => { + dispatch({ + type: 'custom_table', + action: 'invite', + payload: record, + }); + }, + }, + 'Invite ', + record.name + ), + React.createElement( + antd.Button, + { + type: 'primary', + danger: true, + onClick: () => { + dispatch({ + type: 'custom_table', + action: 'delete', + payload: record, + }); + }, + }, + 'Delete' + ) + ); +}""") + + app.custom(fn=on_custom) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/demos/expandable_row.py b/docs/components/antd/table/demos/expandable_row.py new file mode 100644 index 00000000..6cff1412 --- /dev/null +++ b/docs/components/antd/table/demos/expandable_row.py @@ -0,0 +1,61 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "key": + 1, + "name": + "John Brown", + "age": + 32, + "address": + "New York No. 1 Lake Park", + "description": + "My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park." +}, { + "key": + 2, + "name": + "Jim Green", + "age": + 42, + "address": + "London No. 1 Lake Park", + "description": + "My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park." +}, { + "key": 3, + "name": "Not Expandable", + "age": 29, + "address": "Jiangsu No. 1 Lake Park", + "description": "This not expandable" +}, { + "key": + 4, + "name": + "Joe Black", + "age": + 32, + "address": + "Sydney No. 1 Lake Park", + "description": + "My name is Joe Black, I am 32 years old, living in Sydney No. 1 Lake Park." +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.Table(data_source=data): + with ms.Slot("expandable"): + antd.Table.Expandable( + expanded_row_render="""(record) => record.description""", + row_expandable= + """(record) => record.name !== 'Not Expandable'""") + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/demos/order_specific_column.py b/docs/components/antd/table/demos/order_specific_column.py new file mode 100644 index 00000000..fcf893d5 --- /dev/null +++ b/docs/components/antd/table/demos/order_specific_column.py @@ -0,0 +1,65 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "key": + 1, + "name": + "John Brown", + "age": + 32, + "address": + "New York No. 1 Lake Park", + "description": + "My name is John Brown, I am 32 years old, living in New York No. 1 Lake Park." +}, { + "key": + 2, + "name": + "Jim Green", + "age": + 42, + "address": + "London No. 1 Lake Park", + "description": + "My name is Jim Green, I am 42 years old, living in London No. 1 Lake Park." +}, { + "key": 3, + "name": "Not Expandable", + "age": 29, + "address": "Jiangsu No. 1 Lake Park", + "description": "This not expandable" +}, { + "key": + 4, + "name": + "Joe Black", + "age": + 32, + "address": + "Sydney No. 1 Lake Park", + "description": + "My name is Joe Black, I am 32 years old, living in Sydney No. 1 Lake Park." +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.Table(data_source=data): + with ms.Slot("rowSelection"): + selection = antd.Table.RowSelection() + with ms.Slot("expandable"): + antd.Table.Expandable( + expanded_row_render="""(record) => record.description""", + row_expandable= + """(record) => record.name !== 'Not Expandable'""") + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(built_in_column="EXPAND_COLUMN") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(built_in_column="SELECTION_COLUMN") + antd.Table.Column(title="Address", + data_index="address", + key="address") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/demos/pagination.py b/docs/components/antd/table/demos/pagination.py new file mode 100644 index 00000000..e3963534 --- /dev/null +++ b/docs/components/antd/table/demos/pagination.py @@ -0,0 +1,29 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [{ + "key": f"{i}", + "name": f'Item {i}', + "age": 32, + "address": '10 Downing Street', +} for i in range(20)] + + +def on_change(e: gr.EventData): + print(e._data) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.Table(data_source=data, + pagination=dict(pageSize=4)) as table: + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") + table.change(fn=on_change) +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/table/demos/selection.py b/docs/components/antd/table/demos/selection.py new file mode 100644 index 00000000..984dc2f1 --- /dev/null +++ b/docs/components/antd/table/demos/selection.py @@ -0,0 +1,56 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +data = [ + { + "key": '1', + "name": 'Mike', + "age": 32, + "address": '10 Downing Street', + }, + { + "key": '2', + "name": 'John', + "age": 42, + "address": '10 Downing Street', + }, +] + + +def on_selection_change(e: gr.EventData): + print(e._data) + + +with gr.Blocks() as demo: + with ms.Application(): + with antd.Table(data_source=data): + # add selection config + with ms.Slot("rowSelection"): + selection = antd.Table.RowSelection() + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") + selection.change(on_selection_change) + antd.Divider("Custom selection") + with antd.Table(data_source=data): + # add selection config + with ms.Slot("rowSelection"): + with antd.Table.RowSelection(): + with ms.Slot("selections"): + antd.Table.RowSelection.Selection( + built_in_selection='SELECT_ALL') + antd.Table.RowSelection.Selection( + built_in_selection='SELECT_INVERT') + antd.Table.RowSelection.Selection( + built_in_selection='SELECT_NONE') + antd.Table.Column(title="Name", data_index="name", key="name") + antd.Table.Column(title="Age", data_index="age", key="age") + antd.Table.Column(title="Address", + data_index="address", + key="address") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tabs/README-zh_CN.md b/docs/components/antd/tabs/README-zh_CN.md new file mode 100644 index 00000000..82342642 --- /dev/null +++ b/docs/components/antd/tabs/README-zh_CN.md @@ -0,0 +1,8 @@ +# Tabs + +Tabs make it easy to explore and switch between different views. See [Ant Design](https://ant.design/components/tabs/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tabs/README.md b/docs/components/antd/tabs/README.md new file mode 100644 index 00000000..82342642 --- /dev/null +++ b/docs/components/antd/tabs/README.md @@ -0,0 +1,8 @@ +# Tabs + +Tabs make it easy to explore and switch between different views. See [Ant Design](https://ant.design/components/tabs/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tabs/app.py b/docs/components/antd/tabs/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/tabs/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/tabs/demos/basic.py b/docs/components/antd/tabs/demos/basic.py new file mode 100644 index 00000000..002b36bf --- /dev/null +++ b/docs/components/antd/tabs/demos/basic.py @@ -0,0 +1,32 @@ +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.Tabs(default_active_key='1'): + with antd.Tabs.Item(key="1", label="Tab1"): + ms.Text("Tab 1") + with antd.Tabs.Item(key="2", label="Tab2", disabled=True): + ms.Text("Tab 2") + with antd.Tabs.Item(key="3", label="Tab3"): + ms.Text("Tab 3") + with ms.Slot("icon"): + antd.Icon("AndroidOutlined") + antd.Divider("Extra content") + with antd.Tabs(default_active_key='1'): + with ms.Slot("tabBarExtraContent.left"): + antd.Button("Left Extra Action") + with ms.Slot("tabBarExtraContent.right"): + antd.Button("Right Extra Action") + with antd.Tabs.Item(key="1", label="Tab1"): + ms.Text("Tab 1") + with antd.Tabs.Item(key="2", label="Tab2"): + ms.Text("Tab 2") + with antd.Tabs.Item(key="3", label="Tab3"): + ms.Text("Tab 3") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tabs/demos/position.py b/docs/components/antd/tabs/demos/position.py new file mode 100644 index 00000000..715ba59c --- /dev/null +++ b/docs/components/antd/tabs/demos/position.py @@ -0,0 +1,29 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_position = "top" + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Space(): + ms.Text("Tab position") + position = antd.Radio.Group( + value=default_position, + option_type="button", + options=["top", "left", "right", "bottom"]) + with antd.Tabs(default_active_key='1') as tabs: + with antd.Tabs.Item(key="1", label="Tab1"): + ms.Text("Tab 1") + with antd.Tabs.Item(key="2", label="Tab2"): + ms.Text("Tab 2") + with antd.Tabs.Item(key="3", label="Tab3"): + ms.Text("Tab 3") + position.change(fn=lambda x: gr.update(tab_position=x), + inputs=[position], + outputs=[tabs]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tag/README-zh_CN.md b/docs/components/antd/tag/README-zh_CN.md new file mode 100644 index 00000000..ff43eb83 --- /dev/null +++ b/docs/components/antd/tag/README-zh_CN.md @@ -0,0 +1,8 @@ +# Tag + +Used for marking and categorization. See [Ant Design](https://ant.design/components/tag/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tag/README.md b/docs/components/antd/tag/README.md new file mode 100644 index 00000000..ff43eb83 --- /dev/null +++ b/docs/components/antd/tag/README.md @@ -0,0 +1,8 @@ +# Tag + +Used for marking and categorization. See [Ant Design](https://ant.design/components/tag/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tag/app.py b/docs/components/antd/tag/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/tag/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/tag/demos/basic.py b/docs/components/antd/tag/demos/basic.py new file mode 100644 index 00000000..5be53309 --- /dev/null +++ b/docs/components/antd/tag/demos/basic.py @@ -0,0 +1,60 @@ +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(size="small"): + antd.Tag("Tag1") + with antd.Tag(): + antd.Typography.Link( + "Link", + href= + "https://github.com/ant-design/ant-design/issues/1862") + antd.Tag('Closeable', close_icon=True) + with antd.Tag(): + with ms.Slot("closeIcon"): + antd.Icon("CloseCircleOutlined", + elem_style=dict(fontSize=14, + marginLeft="4px")) + ms.Text("Custom Close Icon") + with antd.Divider(orientation="left"): + ms.Text("Icon Tag") + with antd.Flex(gap=("4px", "0"), wrap=True): + with antd.Tag(color="#55acee"): + ms.Text("Twitter") + with antd.Tag(color="#cd201f"): + ms.Text("Youtube") + with antd.Tag(color="#3b5999"): + ms.Text("Facebook") + with antd.Tag(color="#55acee"): + ms.Text("LinkedIn") + + with antd.Divider(orientation="left"): + ms.Text("Presets Colorful Tag") + + with antd.Flex(gap=("4px", "0"), wrap=True): + antd.Tag("magenta", color="magenta") + antd.Tag("red", color="red") + antd.Tag("volcano", color="volcano") + antd.Tag("orange", color="orange") + antd.Tag("gold", color="gold") + antd.Tag("lime", color="lime") + antd.Tag("green", color="green") + antd.Tag("cyan", color="cyan") + antd.Tag("blue", color="blue") + antd.Tag("geekblue", color="geekblue") + antd.Tag("purple", color="purple") + + with antd.Divider(orientation="left"): + ms.Text("Custom Colorful Tag") + + with antd.Flex(gap="4px 0", wrap=True): + antd.Tag("#f50", color="#f50") + antd.Tag("#2db7f5", color="#2db7f5") + antd.Tag("#87d068", color="#87d068") + antd.Tag("#108ee9", color="#108ee9") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tag/demos/checkable_tag.py b/docs/components/antd/tag/demos/checkable_tag.py new file mode 100644 index 00000000..53f1d8a0 --- /dev/null +++ b/docs/components/antd/tag/demos/checkable_tag.py @@ -0,0 +1,19 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +default_position = "top" + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + with antd.Flex(gap=4, wrap=True, align="center"): + ms.Span("Categories:") + antd.Tag.CheckableTag("Movies", value=True) + antd.Tag.CheckableTag("Books") + antd.Tag.CheckableTag("Music") + antd.Tag.CheckableTag("Sports") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/time_picker/README-zh_CN.md b/docs/components/antd/time_picker/README-zh_CN.md new file mode 100644 index 00000000..27d81f68 --- /dev/null +++ b/docs/components/antd/time_picker/README-zh_CN.md @@ -0,0 +1,8 @@ +# TimePicker + +To select/input a time. See [Ant Design](https://ant.design/components/time-picker/) for more information. + +## Examples + + + diff --git a/docs/components/antd/time_picker/README.md b/docs/components/antd/time_picker/README.md new file mode 100644 index 00000000..27d81f68 --- /dev/null +++ b/docs/components/antd/time_picker/README.md @@ -0,0 +1,8 @@ +# TimePicker + +To select/input a time. See [Ant Design](https://ant.design/components/time-picker/) for more information. + +## Examples + + + diff --git a/docs/components/antd/time_picker/app.py b/docs/components/antd/time_picker/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/time_picker/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/time_picker/demos/basic.py b/docs/components/antd/time_picker/demos/basic.py new file mode 100644 index 00000000..01ab45dc --- /dev/null +++ b/docs/components/antd/time_picker/demos/basic.py @@ -0,0 +1,32 @@ +import time + +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(direction='vertical'): + antd.TimePicker() + antd.TimePicker(format="HH:mm") + antd.TimePicker(minute_step=15, + second_step=10, + hour_step=1, + need_confirm=True) + antd.Divider("12 hours") + with antd.Space(direction='vertical'): + antd.TimePicker(use_12_hours=True) + antd.TimePicker(use_12_hours=True, format="h:mm:ss A") + antd.TimePicker(use_12_hours=True, format="h:mm a") + antd.Divider("Prefix and Suffix") + with antd.Space(direction='vertical'): + with antd.TimePicker(): + with ms.Slot("suffixIcon"): + antd.Icon("SmileOutlined") + with antd.TimePicker(): + with ms.Slot("prefix"): + antd.Icon("SmileOutlined") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/time_picker/demos/ranger_picker.py b/docs/components/antd/time_picker/demos/ranger_picker.py new file mode 100644 index 00000000..a22049bf --- /dev/null +++ b/docs/components/antd/time_picker/demos/ranger_picker.py @@ -0,0 +1,14 @@ +import time + +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(): + antd.TimePicker.RangePicker( + value=lambda: [time.time(), time.time()], format="HH:mm:ss") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/timeline/README-zh_CN.md b/docs/components/antd/timeline/README-zh_CN.md new file mode 100644 index 00000000..2c091035 --- /dev/null +++ b/docs/components/antd/timeline/README-zh_CN.md @@ -0,0 +1,7 @@ +# Timeline + +Vertical display timeline. See [Ant Design](https://ant.design/components/timeline/) for more information. + +## Examples + + diff --git a/docs/components/antd/timeline/README.md b/docs/components/antd/timeline/README.md new file mode 100644 index 00000000..2c091035 --- /dev/null +++ b/docs/components/antd/timeline/README.md @@ -0,0 +1,7 @@ +# Timeline + +Vertical display timeline. See [Ant Design](https://ant.design/components/timeline/) for more information. + +## Examples + + diff --git a/docs/components/antd/timeline/app.py b/docs/components/antd/timeline/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/timeline/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/timeline/demos/basic.py b/docs/components/antd/timeline/demos/basic.py new file mode 100644 index 00000000..e10e3d47 --- /dev/null +++ b/docs/components/antd/timeline/demos/basic.py @@ -0,0 +1,41 @@ +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.Timeline(): + with antd.Timeline.Item(): + ms.Text("Create a services site 2015-09-01") + with antd.Timeline.Item(): + ms.Text("Solve initial network problems 2015-09-01") + with antd.Timeline.Item(): + ms.Text("Technical testing 2015-09-01") + with antd.Timeline.Item(): + ms.Text("Network problems being solved 2015-09-01") + antd.Divider("Alternate") + with antd.Timeline(mode="alternate"): + with antd.Timeline.Item(): + ms.Text("Create a services site 2015-09-01") + with antd.Timeline.Item(color="green"): + ms.Text("Solve initial network problems 2015-09-01") + with antd.Timeline.Item(): + ms.Text( + "Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo." + ) + with ms.Slot("dot"): + antd.Icon("ClockCircleOutlined", + elem_style=dict(fontSize=16)) + with antd.Timeline.Item(color="red"): + ms.Text("Network problems being solved 2015-09-01") + with antd.Timeline.Item(): + ms.Text("Create a services site 2015-09-01") + with antd.Timeline.Item(): + with ms.Slot("dot"): + antd.Icon("ClockCircleOutlined", + elem_style=dict(fontSize=16)) + ms.Text("Technical testing 2015-09-01") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tooltip/README-zh_CN.md b/docs/components/antd/tooltip/README-zh_CN.md new file mode 100644 index 00000000..3b1fd261 --- /dev/null +++ b/docs/components/antd/tooltip/README-zh_CN.md @@ -0,0 +1,7 @@ +# Tooltip + +Simple text popup box. See [Ant Design](https://ant.design/components/tooltip/) for more information. + +## Examples + + diff --git a/docs/components/antd/tooltip/README.md b/docs/components/antd/tooltip/README.md new file mode 100644 index 00000000..3b1fd261 --- /dev/null +++ b/docs/components/antd/tooltip/README.md @@ -0,0 +1,7 @@ +# Tooltip + +Simple text popup box. See [Ant Design](https://ant.design/components/tooltip/) for more information. + +## Examples + + diff --git a/docs/components/antd/tooltip/app.py b/docs/components/antd/tooltip/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/tooltip/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/tooltip/demos/basic.py b/docs/components/antd/tooltip/demos/basic.py new file mode 100644 index 00000000..588e8c64 --- /dev/null +++ b/docs/components/antd/tooltip/demos/basic.py @@ -0,0 +1,17 @@ +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(direction="vertical"): + with antd.Tooltip(title="prompt text"): + ms.Span("Tooltip will show on mouse enter.") + with antd.Tooltip(): + with ms.Slot("title"): + antd.Typography.Text("prompt text", type="success") + ms.Span("Custom Title") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/transfer/README-zh_CN.md b/docs/components/antd/transfer/README-zh_CN.md new file mode 100644 index 00000000..56b8440c --- /dev/null +++ b/docs/components/antd/transfer/README-zh_CN.md @@ -0,0 +1,7 @@ +# Transfer + +Double column transfer choice box. See [Ant Design](https://ant.design/components/transfer/) for more information. + +## Examples + + diff --git a/docs/components/antd/transfer/README.md b/docs/components/antd/transfer/README.md new file mode 100644 index 00000000..56b8440c --- /dev/null +++ b/docs/components/antd/transfer/README.md @@ -0,0 +1,7 @@ +# Transfer + +Double column transfer choice box. See [Ant Design](https://ant.design/components/transfer/) for more information. + +## Examples + + diff --git a/docs/components/antd/transfer/app.py b/docs/components/antd/transfer/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/transfer/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/transfer/demos/basic.py b/docs/components/antd/transfer/demos/basic.py new file mode 100644 index 00000000..6bb87430 --- /dev/null +++ b/docs/components/antd/transfer/demos/basic.py @@ -0,0 +1,37 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +mock_data = [{ + "key": str(i), + "title": f"content{i + 1}", + "description": f"description of content{i + 1}" +} for i in range(20)] + +initial_target_keys = [ + item['key'] for item in mock_data if int(item['key']) > 10 +] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + antd.Transfer(value=initial_target_keys, + data_source=mock_data, + titles=['Source', 'Target']) + antd.Divider("One Way") + antd.Transfer(one_way=True, + data_source=mock_data, + titles=['Source', 'Target']) + antd.Divider("Search") + antd.Transfer( + value=initial_target_keys, + show_search=True, + # use javascript function to filter options + filter_option= + "(inputValue, option) => option.description.indexOf(inputValue) > -1", + data_source=mock_data, + titles=['Source', 'Target']) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tree/README-zh_CN.md b/docs/components/antd/tree/README-zh_CN.md new file mode 100644 index 00000000..9ead8c07 --- /dev/null +++ b/docs/components/antd/tree/README-zh_CN.md @@ -0,0 +1,8 @@ +# Tree + +Multiple-level structure list. See [Ant Design](https://ant.design/components/tree/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tree/README.md b/docs/components/antd/tree/README.md new file mode 100644 index 00000000..9ead8c07 --- /dev/null +++ b/docs/components/antd/tree/README.md @@ -0,0 +1,8 @@ +# Tree + +Multiple-level structure list. See [Ant Design](https://ant.design/components/tree/) for more information. + +## Examples + + + diff --git a/docs/components/antd/tree/app.py b/docs/components/antd/tree/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/tree/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/tree/demos/basic.py b/docs/components/antd/tree/demos/basic.py new file mode 100644 index 00000000..02753e00 --- /dev/null +++ b/docs/components/antd/tree/demos/basic.py @@ -0,0 +1,83 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +tree_data = [{ + "title": + "parent 1", + "key": + "0-0", + "children": [{ + "title": + "parent 1-0", + "key": + "0-0-0", + "disabled": + True, + "children": [{ + "title": "leaf", + "key": "0-0-0-0", + "disableCheckbox": True + }, { + "title": "leaf", + "key": "0-0-0-1" + }] + }, { + "title": "parent 1-1", + "key": "0-0-1", + "children": [{ + "title": "sss", + "key": "0-0-1-0" + }] + }] +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + antd.Tree(elem_style=dict(width="100%"), + checkable=True, + default_checked_keys=['0-0-0', '0-0-1'], + default_selected_keys=['0-0-0', '0-0-1'], + default_expanded_keys=['0-0-0', '0-0-1'], + tree_data=tree_data) + antd.Divider("Custom TreeNode") + with antd.Tree(show_line=True, + show_icon=True, + default_expanded_keys=['parent-1', 'parent-1-0'], + elem_style=dict(width=300)): + with ms.Slot("treeData"): + with antd.Tree.TreeNode(key="parent-1", title="parent 1"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode(key="parent-1-0", + title="parent 1-0"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode(key="leaf1", + title="leaf1"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode(key="leaf2", + title="leaf2"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode(key="leaf3", + title="leaf3"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode( + key="parent-1-1", + title="parent 1-1", + ): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.Tree.TreeNode(key="leaf11"): + with ms.Slot("title"): + antd.Typography.Text("leaf11", + type="success") + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tree/demos/directory_tree.py b/docs/components/antd/tree/demos/directory_tree.py new file mode 100644 index 00000000..515e2587 --- /dev/null +++ b/docs/components/antd/tree/demos/directory_tree.py @@ -0,0 +1,45 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +tree_data = [{ + "title": + "parent 0", + "key": + "0-0", + "children": [{ + "title": "leaf 0-0", + "key": "0-0-0", + "isLeaf": True + }, { + "title": "leaf 0-1", + "key": "0-0-1", + "isLeaf": True + }] +}, { + "title": + "parent 1", + "key": + "0-1", + "children": [{ + "title": "leaf 1-0", + "key": "0-1-0", + "isLeaf": True + }, { + "title": "leaf 1-1", + "key": "0-1-1", + "isLeaf": True + }] +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + antd.Tree.DirectoryTree(draggable=True, + multiple=True, + default_expand_all=True, + tree_data=tree_data) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/tree_select/README-zh_CN.md b/docs/components/antd/tree_select/README-zh_CN.md new file mode 100644 index 00000000..d9024101 --- /dev/null +++ b/docs/components/antd/tree_select/README-zh_CN.md @@ -0,0 +1,7 @@ +# TreeSelect + +Tree selection control. See [Ant Design](https://ant.design/components/tree-select/) for more information. + +## Examples + + diff --git a/docs/components/antd/tree_select/README.md b/docs/components/antd/tree_select/README.md new file mode 100644 index 00000000..d9024101 --- /dev/null +++ b/docs/components/antd/tree_select/README.md @@ -0,0 +1,7 @@ +# TreeSelect + +Tree selection control. See [Ant Design](https://ant.design/components/tree-select/) for more information. + +## Examples + + diff --git a/docs/components/antd/tree_select/app.py b/docs/components/antd/tree_select/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/tree_select/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/tree_select/demos/basic.py b/docs/components/antd/tree_select/demos/basic.py new file mode 100644 index 00000000..c13dc35a --- /dev/null +++ b/docs/components/antd/tree_select/demos/basic.py @@ -0,0 +1,96 @@ +import gradio as gr + +import modelscope_studio.components.antd as antd +import modelscope_studio.components.base as ms + +tree_data = [{ + "value": + "parent 1", + "title": + "parent 1", + "children": [{ + "value": + "parent 1-0", + "title": + "parent 1-0", + "children": [{ + "value": "leaf1", + "title": "leaf1" + }, { + "value": "leaf2", + "title": "leaf2" + }, { + "value": "leaf3", + "title": "leaf3" + }, { + "value": "leaf4", + "title": "leaf4" + }, { + "value": "leaf5", + "title": "leaf5" + }, { + "value": "leaf6", + "title": "leaf6" + }] + }, { + "value": "parent 1-1", + "title": "parent 1-1", + "children": [{ + "value": "leaf11", + "title": "leaf11" + }] + }] +}] + +with gr.Blocks() as demo: + with ms.Application(): + with antd.ConfigProvider(): + antd.TreeSelect(show_search=True, + elem_style=dict(width="100%"), + dropdown_style=dict(maxHeight=400, + overflow="auto"), + multiple=True, + placeholder="Please Select", + tree_checkable=True, + show_checked_strategy="SHOW_PARENT", + tree_default_expand_all=True, + tree_data=tree_data) + antd.Divider("Custom TreeNode") + with antd.TreeSelect(tree_line=True, + tree_icon=True, + elem_style=dict(width=300)): + with ms.Slot("treeData"): + with antd.TreeSelect.TreeNode(value="parent 1", + title="parent 1"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode(value="parent 1-0", + title="parent 1-0"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode(value="leaf1", + title="leaf1"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode(value="leaf2", + title="leaf2"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode(value="leaf3", + title="leaf3"): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode( + value="parent 1-1", + title="parent 1-1", + ): + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") + with antd.TreeSelect.TreeNode(value="leaf11"): + with ms.Slot("title"): + antd.Typography.Text("leaf11", + type="success") + with ms.Slot("icon"): + antd.Icon("CarryOutOutlined") +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/upload/README-zh_CN.md b/docs/components/antd/upload/README-zh_CN.md new file mode 100644 index 00000000..d2559b73 --- /dev/null +++ b/docs/components/antd/upload/README-zh_CN.md @@ -0,0 +1,8 @@ +# Upload + +Used to select and upload files or drag and drop files. See [Ant Design](https://ant.design/components/upload/) for more information. + +## Examples + + + diff --git a/docs/components/antd/upload/README.md b/docs/components/antd/upload/README.md new file mode 100644 index 00000000..d2559b73 --- /dev/null +++ b/docs/components/antd/upload/README.md @@ -0,0 +1,8 @@ +# Upload + +Used to select and upload files or drag and drop files. See [Ant Design](https://ant.design/components/upload/) for more information. + +## Examples + + + diff --git a/docs/components/antd/upload/app.py b/docs/components/antd/upload/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/upload/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/upload/demos/avatar.py b/docs/components/antd/upload/demos/avatar.py new file mode 100644 index 00000000..4d4afcf1 --- /dev/null +++ b/docs/components/antd/upload/demos/avatar.py @@ -0,0 +1,31 @@ +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.Upload(list_type="picture-card", + max_count=1, + show_upload_list=False, + accept="image/*") as upload: + image = antd.Image(elem_style=dict(width="100%"), + preview=False, + visible=False) + with ms.Div(visible=True) as btn: + antd.Icon("PlusOutlined") + ms.Div("Upload", elem_style=dict(marginTop=8)) + + def on_change(_upload): + return gr.update(value=[]), gr.update( + visible=True, + value=None if not _upload else _upload[0]), gr.update( + visible=False) + + upload.change(fn=on_change, + inputs=[upload], + outputs=[upload, image, btn]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/upload/demos/basic.py b/docs/components/antd/upload/demos/basic.py new file mode 100644 index 00000000..6fc65497 --- /dev/null +++ b/docs/components/antd/upload/demos/basic.py @@ -0,0 +1,35 @@ +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.Upload(multiple=True) as upload: + with antd.Button(): + ms.Text("Click to Upload") + with ms.Slot("icon"): + antd.Icon("UploadOutlined") + upload.change(fn=lambda _upload: print(_upload), inputs=[upload]) + antd.Divider("Pictures with list style") + with antd.Upload(multiple=True, + max_count=3, + list_type="picture", + accept="image/*"): + with antd.Button(type="primary"): + ms.Text("Upload (Max: 3)") + with ms.Slot("icon"): + antd.Icon("UploadOutlined") + antd.Divider("Drag and Drop") + with antd.Upload.Dragger(multiple=True): + with ms.Div(elem_style=dict(fontSize=40, color="#1677ff")): + antd.Icon("InboxOutlined") + antd.Typography.Paragraph( + "Click or drag file to this area to upload") + antd.Typography.Paragraph( + "Support for a single or bulk upload. Strictly prohibited from uploading company data or other banned files.", + type="secondary") + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/watermark/README-zh_CN.md b/docs/components/antd/watermark/README-zh_CN.md new file mode 100644 index 00000000..d5967682 --- /dev/null +++ b/docs/components/antd/watermark/README-zh_CN.md @@ -0,0 +1,8 @@ +# Watermark + +Add specific text or patterns to the page. See [Ant Design](https://ant.design/components/watermark/) for more information. + +## Examples + + + diff --git a/docs/components/antd/watermark/README.md b/docs/components/antd/watermark/README.md new file mode 100644 index 00000000..d5967682 --- /dev/null +++ b/docs/components/antd/watermark/README.md @@ -0,0 +1,8 @@ +# Watermark + +Add specific text or patterns to the page. See [Ant Design](https://ant.design/components/watermark/) for more information. + +## Examples + + + diff --git a/docs/components/antd/watermark/app.py b/docs/components/antd/watermark/app.py new file mode 100644 index 00000000..0018b7c1 --- /dev/null +++ b/docs/components/antd/watermark/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/watermark/demos/basic.py b/docs/components/antd/watermark/demos/basic.py new file mode 100644 index 00000000..f0521b97 --- /dev/null +++ b/docs/components/antd/watermark/demos/basic.py @@ -0,0 +1,23 @@ +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.Flex(vertical=True, gap="small"): + with antd.Watermark(content="Ant Design"): + antd.Card(elem_style=dict(height=200)) + with antd.Watermark(content=['Ant Design', 'Happy Working']): + antd.Card(elem_style=dict(height=200)) + with antd.Watermark( + height=30, + width=130, + image= + "https://mdn.alipayobjects.com/huamei_7uahnr/afts/img/A*lkAoRbywo0oAAAAAAAAAAAAADrJ8AQ/original" + ): + antd.Card(elem_style=dict(height=200)) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/antd/watermark/demos/modal_or_drawer.py b/docs/components/antd/watermark/demos/modal_or_drawer.py new file mode 100644 index 00000000..c54bc31a --- /dev/null +++ b/docs/components/antd/watermark/demos/modal_or_drawer.py @@ -0,0 +1,30 @@ +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.Flex(gap="middle"): + btn = antd.Button("Open Modal", type="primary") + btn2 = antd.Button("Open Drawer", type="primary") + with antd.Watermark(content="Ant Design"): + with antd.Modal(open=False, title="Basic Modal") as modal: + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + + modal.ok(lambda: gr.update(open=False), outputs=[modal]) + modal.cancel(lambda: gr.update(open=False), outputs=[modal]) + with antd.Watermark(content="Ant Design"): + with antd.Drawer(open=False, title="Basic Drawer") as drawer: + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + antd.Typography.Paragraph("Some contents...") + drawer.close(lambda: gr.update(open=False), outputs=[drawer]) + btn.click(lambda: gr.update(open=True), outputs=[modal]) + btn2.click(lambda: gr.update(open=True), outputs=[drawer]) + +if __name__ == "__main__": + demo.queue().launch() diff --git a/docs/components/legacy/Markdown/demos/custom-tag.py b/docs/components/legacy/Markdown/demos/custom-tag.py index 530e7027..3a8dadd0 100644 --- a/docs/components/legacy/Markdown/demos/custom-tag.py +++ b/docs/components/legacy/Markdown/demos/custom-tag.py @@ -12,7 +12,7 @@ "custom-tag": { # The tag props. "props": ["value"], - # The tag template, use `{prop}` as placeholder。 + # The tag template, use `{prop}` as placeholder. "template": "
{value}
" } }) diff --git a/docs/helper/Site.py b/docs/helper/Site.py index 82abd115..c90ddeda 100644 --- a/docs/helper/Site.py +++ b/docs/helper/Site.py @@ -58,6 +58,10 @@ def on_tab_menu_select(e: gr.EventData): max-width: 100% !important; padding: 0 !important; } +.docs-layout-sider { + width: 100% !important; + max-width: 100% !important; +} """) as demo: with ms.Application() as app: with antd.ConfigProvider(): @@ -109,62 +113,81 @@ def on_tab_menu_select(e: gr.EventData): overflow="auto")): tab["content"].render() elif "menus" in tab: - # menus render with antd.Layout(elem_style=dict( height='100%')): - with antd.Layout.Sider( - collapsed=False, - collapsible=True, - trigger=None, - elem_style=dict( - height= - "calc(100vh - 64px)", - overflow="auto", - position="relative", - backgroundColor= - "var(--ms-gr-ant-color-bg-container)" - )) as layout_sider: - sider_menu = antd.Menu( - selected_keys=[ - tab.get( - "default_active_key", - None) - ], - mode="inline", - items=tab.get( - "menus", [])) - if "extra_menu_footer" in tab: - if callable(tab[ - "extra_menu_footer"] - ): - tab["extra_menu_footer"]( - ) - else: - tab["extra_menu_footer"].render( - ) - - with antd.Layout( - elem_style=dict( - width=0)): - with antd.Layout.Content( + with antd.Splitter(): + with antd.Splitter.Panel( + default_size=213, + max="50%", + min=82, elem_style=dict( - padding= - '12px 28px', - overflow="auto" - )): - with antd.Tabs( - active_key=tab. - get( - "default_active_key", - None), - render_tab_bar= - "() => null" - ) as layout_content_tabs: - docs_tabs = self._render_docs( - tab.get( + backgroundColor= + "var(--ms-gr-ant-color-bg-container)" + )) as sider_panel: + with antd.Layout.Sider( + breakpoint="sm", + trigger=None, + elem_classes= + "docs-layout-sider", + elem_style=dict( + # height= + # "calc(100vh - 64px)", + # overflow= + # "auto", + position= + "relative", + backgroundColor + ="var(--ms-gr-ant-color-bg-container)" + )): + sider_menu = antd.Menu( + selected_keys=[ + tab.get( + "default_active_key", + None) + ], + mode="inline", + items=tab.get( "menus", - []), tab) + [])) + if "extra_menu_footer" in tab: + if callable(tab[ + "extra_menu_footer"] + ): + tab["extra_menu_footer"]( + ) + else: + tab["extra_menu_footer"].render( + ) + with antd.Splitter.Panel(): + with antd.Layout( + elem_style=dict( + width="100%" + )): + with antd.Layout.Content( + elem_style= + dict( + padding= + '12px 28px', + overflow + ="auto" + )): + with antd.Tabs( + active_key + =tab. + get( + "default_active_key", + None + ), + render_tab_bar + ="() => null" + ) as layout_content_tabs: + docs_tabs = self._render_docs( + tab. + get( + "menus", + [] + ), tab) def on_layout_menu_select_wrapper( tabs, sider_menu, @@ -208,10 +231,11 @@ def on_app_mount(e: gr.EventData): screen_width = e._data["screen"][ "width"] return gr.update( - collapsed=screen_width < 576) + default_size=82 if screen_width < + 576 else 213) app.mount(on_app_mount, - outputs=[layout_sider]) + outputs=[sider_panel]) tab_menu.select( fn=on_tab_menu_select, diff --git a/docs/requirements.txt b/docs/requirements.txt index aea6dec3..0357a34b 100644 --- a/docs/requirements.txt +++ b/docs/requirements.txt @@ -1,2 +1,2 @@ modelscope_studio -modelscope_studio-1.0.0b6-py3-none-any.whl +modelscope_studio-1.0.0b9-py3-none-any.whl diff --git a/docs/src/pyproject.toml b/docs/src/pyproject.toml index 0bac2640..0be10124 100644 --- a/docs/src/pyproject.toml +++ b/docs/src/pyproject.toml @@ -8,7 +8,7 @@ build-backend = "hatchling.build" [project] name = "modelscope_studio" -version = "1.0.0-beta.6" +version = "1.0.0-beta.9" description = "A third-party component library based on Gradio." readme = "README.md" license = "Apache-2.0" @@ -201,6 +201,8 @@ artifacts = [ "/backend/modelscope_studio/components/legacy/Markdown/templates", "/backend/modelscope_studio/components/legacy/MultimodalInput/templates", "/backend/modelscope_studio/components/legacy/WaterfallGallery/templates", + "/backend/modelscope_studio/components/antd/form/provider/templates", + "/backend/modelscope_studio/components/antd/modal/static/templates", ] [tool.hatch.build.targets.sdist] diff --git a/frontend/CHANGELOG.md b/frontend/CHANGELOG.md index c1857439..f04dc1b8 100644 --- a/frontend/CHANGELOG.md +++ b/frontend/CHANGELOG.md @@ -1,5 +1,17 @@ # @modelscope-studio/frontend +## 1.0.0-beta.9 + +### Fixes + +- [`e7fa278`](https://github.com/modelscope/modelscope-studio/commit/e7fa2782af83a7e78cddb700cd8d5e63ad62342f) - bugfix of remaining components. Thanks [@Col0ring](https://github.com/Col0ring)! + +## 1.0.0-beta.8 + +### Fixes + +- [`a692793`](https://github.com/modelscope/modelscope-studio/commit/a6927930fa0cbb62b8e91d98fbfda7434586e758) - gbk error. Thanks [@Col0ring](https://github.com/Col0ring)! + ## 1.0.0-beta.7 ### Fixes @@ -64,4 +76,4 @@ No significant changes to this package were made in this release. ### Features -- [`4a46970`](https://github.com/modelscope/modelscope-studio/commit/4a46970007452af606abe02cdfa54a4959b2f3db) - integrate ant design. Thanks [@Col0ring](https://github.com/Col0ring)! +- [`4a46970`](https://github.com/modelscope/modelscope-studio/commit/4a46970007452af606abe02cdfa54a4959b2f3db) - integrate ant design. Thanks [@Col0ring](https://github.com/Col0ring)! \ No newline at end of file diff --git a/frontend/antd/CHANGELOG.md b/frontend/antd/CHANGELOG.md index 09466f57..8ccddc9a 100644 --- a/frontend/antd/CHANGELOG.md +++ b/frontend/antd/CHANGELOG.md @@ -1,5 +1,17 @@ # @modelscope-studio/antd +## 1.0.0-beta.9 + +### Fixes + +- [`e7fa278`](https://github.com/modelscope/modelscope-studio/commit/e7fa2782af83a7e78cddb700cd8d5e63ad62342f) - bugfix of remaining components. Thanks [@Col0ring](https://github.com/Col0ring)! + +## 1.0.0-beta.8 + +### Fixes + +- [`a692793`](https://github.com/modelscope/modelscope-studio/commit/a6927930fa0cbb62b8e91d98fbfda7434586e758) - gbk error. Thanks [@Col0ring](https://github.com/Col0ring)! + ## 1.0.0-beta.7 ### Fixes @@ -46,4 +58,4 @@ ### Features -- [`4a46970`](https://github.com/modelscope/modelscope-studio/commit/4a46970007452af606abe02cdfa54a4959b2f3db) - integrate ant design. Thanks [@Col0ring](https://github.com/Col0ring)! +- [`4a46970`](https://github.com/modelscope/modelscope-studio/commit/4a46970007452af606abe02cdfa54a4959b2f3db) - integrate ant design. Thanks [@Col0ring](https://github.com/Col0ring)! \ No newline at end of file diff --git a/frontend/antd/avatar/avatar.tsx b/frontend/antd/avatar/avatar.tsx index e4171fce..04466282 100644 --- a/frontend/antd/avatar/avatar.tsx +++ b/frontend/antd/avatar/avatar.tsx @@ -7,13 +7,17 @@ export const Avatar = sveltify, ['icon', 'src']>( ({ slots, children, ...props }) => { return ( <> - {slots.icon ? children : null} +
+ {slots.icon || slots.src ? children : null} +
: props.icon} - src={slots.src ? : props.src} + src={ + slots.src ? : props.src || undefined + } > - {slots.icon ? null : children} + {slots.icon || slots.src ? null : children} ); diff --git a/frontend/antd/avatar/group/avatar.group.less b/frontend/antd/avatar/group/avatar.group.less new file mode 100644 index 00000000..46b57881 --- /dev/null +++ b/frontend/antd/avatar/group/avatar.group.less @@ -0,0 +1,11 @@ +.ms-gr-container { + .ms-gr-antd-avatar-group { + > *:not(:first-child) { + react-portal-target { + .ms-gr-ant-avatar { + margin-inline-start: var(--ms-gr-ant-avatar-group-overlapping); + } + } + } + } +} diff --git a/frontend/antd/avatar/group/avatar.group.tsx b/frontend/antd/avatar/group/avatar.group.tsx index ecc93959..8cd24a22 100644 --- a/frontend/antd/avatar/group/avatar.group.tsx +++ b/frontend/antd/avatar/group/avatar.group.tsx @@ -4,6 +4,8 @@ import React from 'react'; import { useTargets } from '@utils/hooks/useTargets'; import { Avatar as AAvatar, type GetProps } from 'antd'; +import './avatar.group.less'; + export const AvatarGroup = sveltify< GetProps, ['max.popover.title', 'max.popover.content'] @@ -11,11 +13,15 @@ export const AvatarGroup = sveltify< const targets = useTargets(children); return ( <> -
{children}
+
{children}
{targets.map((target, index) => { return ; })} diff --git a/frontend/antd/card/Index.svelte b/frontend/antd/card/Index.svelte index ee0d524d..a45a4ec9 100644 --- a/frontend/antd/card/Index.svelte +++ b/frontend/antd/card/Index.svelte @@ -5,12 +5,18 @@ bindEvents, importComponent, } from '@svelte-preprocess-react/component'; - import { getSlotContext, getSlots } from '@svelte-preprocess-react/slot'; + import { + getSetSlotParamsFn, + getSlotContext, + getSlots, + } from '@svelte-preprocess-react/slot'; import type React from 'react'; import type { Gradio } from '@gradio/utils'; import cls from 'classnames'; import { type Writable, writable } from 'svelte/store'; + import { getItems } from '../tabs/context'; + const AwaitedCard = importComponent(() => import('./card')); export let gradio: Gradio; export let _internal: Record = {}; @@ -22,6 +28,8 @@ export let elem_classes: string[] = []; export let elem_style: React.CSSProperties = {}; export let visible = true; + const setSlotParams = getSetSlotParamsFn(); + const slots = getSlots(); const [mergedProps, update] = getSlotContext({ gradio, @@ -45,6 +53,8 @@ elem_style, restProps: $$restProps, }); + + const { tabList } = getItems(['tabList']); {#if $mergedProps.visible} @@ -58,6 +68,8 @@ {...bindEvents($mergedProps)} containsGrid={$mergedProps._internal.contains_grid} slots={$slots} + tabListItems={$tabList} + {setSlotParams} > diff --git a/frontend/antd/card/card.tsx b/frontend/antd/card/card.tsx index af34731b..91ca3a86 100644 --- a/frontend/antd/card/card.tsx +++ b/frontend/antd/card/card.tsx @@ -1,41 +1,80 @@ import { sveltify } from '@svelte-preprocess-react'; import { ReactSlot } from '@svelte-preprocess-react/react-slot'; -import React from 'react'; +import type { SetSlotParams } from '@svelte-preprocess-react/slot'; +import React, { useMemo } from 'react'; import { useTargets } from '@utils/hooks/useTargets'; +import { renderItems } from '@utils/renderItems'; import { Card as ACard, type GetProps } from 'antd'; +import { type Item } from '../tabs/context'; + export const Card = sveltify< GetProps & { containsGrid?: boolean; + tabListItems: Item[]; + setSlotParams: SetSlotParams; }, - ['actions', 'cover', 'extra', 'tabBarExtraContent', 'title'] ->(({ children, containsGrid, slots, ...props }) => { - const targets = useTargets(children, 'actions'); - return ( - : props.title} - extra={slots.extra ? : props.extra} - cover={slots.cover ? : props.cover} - tabBarExtraContent={ - slots.tabBarExtraContent ? ( - - ) : ( - props.tabBarExtraContent - ) - } - actions={ - targets.length > 0 - ? targets.map((target, index) => { - return ; - }) - : props.actions - } - > - {containsGrid ? : null} - {children} - - ); -}); + [ + 'actions', + 'cover', + 'extra', + 'tabBarExtraContent', + 'title', + 'tabProps.addIcon', + 'tabProps.removeIcon', + 'tabProps.renderTabBar', + 'tabProps.tabBarExtraContent', + 'tabProps.tabBarExtraContent.left', + 'tabProps.tabBarExtraContent.right', + 'tabProps.more.icon', + ] +>( + ({ + children, + containsGrid, + slots, + tabListItems, + tabList, + tabProps, + ...props + }) => { + const targets = useTargets(children, 'actions'); + + return ( + { + return ( + tabList || + renderItems['tabList']>[number]>( + tabListItems + ) + ); + }, [tabList, tabListItems])} + title={slots.title ? : props.title} + extra={slots.extra ? : props.extra} + cover={slots.cover ? : props.cover} + tabBarExtraContent={ + slots.tabBarExtraContent ? ( + + ) : ( + props.tabBarExtraContent + ) + } + actions={ + targets.length > 0 + ? targets.map((target, index) => { + return ; + }) + : props.actions + } + > + {containsGrid ? : null} + {children} + + ); + } +); export default Card; diff --git a/frontend/antd/carousel/carousel.tsx b/frontend/antd/carousel/carousel.tsx index c4936611..a899cb1c 100644 --- a/frontend/antd/carousel/carousel.tsx +++ b/frontend/antd/carousel/carousel.tsx @@ -10,6 +10,7 @@ export const Carousel = sveltify>( const afterChangeFunction = useFunction(afterChange); const beforeChangeFunction = useFunction(beforeChange); const targets = useTargets(children); + return ( <>
{children}
diff --git a/frontend/antd/cascader/cascader.tsx b/frontend/antd/cascader/cascader.tsx index 017163d8..49168b02 100644 --- a/frontend/antd/cascader/cascader.tsx +++ b/frontend/antd/cascader/cascader.tsx @@ -30,6 +30,7 @@ export const Cascader = sveltify< 'maxTagPlaceholder', 'notFoundContent', 'expandIcon', + 'prefix', 'removeIcon', 'displayRender', 'tagRender', @@ -107,6 +108,9 @@ export const Cascader = sveltify< loadData={onLoadData} optionRender={optionRenderFunction} getPopupContainer={getPopupContainerFunction} + prefix={ + slots.prefix ? : props.prefix + } dropdownRender={ slots.dropdownRender ? renderParamsSlot({ diff --git a/frontend/antd/collapse/item/Index.svelte b/frontend/antd/collapse/item/Index.svelte index efcee324..f1fbc5d3 100644 --- a/frontend/antd/collapse/item/Index.svelte +++ b/frontend/antd/collapse/item/Index.svelte @@ -24,7 +24,6 @@ } = {}; export let as_item: string | undefined; - export let label: string; // gradio properties export let visible = true; @@ -43,7 +42,6 @@ elem_classes, elem_style, as_item, - label, restProps: $$restProps, }); const slots = getSlots(); @@ -56,7 +54,6 @@ elem_classes, elem_style, as_item, - label, restProps: $$restProps, }); const setItem = getSetItemFn(); @@ -65,7 +62,6 @@ style: $mergedProps.elem_style, className: cls($mergedProps.elem_classes, 'ms-gr-antd-collapse-item'), id: $mergedProps.elem_id, - label: $mergedProps.label, ...$mergedProps.restProps, ...$mergedProps.props, ...bindEvents($mergedProps), diff --git a/frontend/antd/config-provider/config-provider.tsx b/frontend/antd/config-provider/config-provider.tsx index 5f01c7a4..fdcefb06 100644 --- a/frontend/antd/config-provider/config-provider.tsx +++ b/frontend/antd/config-provider/config-provider.tsx @@ -60,7 +60,7 @@ export const ConfigProvider = sveltify< id, className, style, - locale: localeProp, + locale: localeProp = 'en_US', getTargetContainer, getPopupContainer, renderEmpty, diff --git a/frontend/antd/date-picker/date-picker.tsx b/frontend/antd/date-picker/date-picker.tsx index 7d4bbc3d..75a2e496 100644 --- a/frontend/antd/date-picker/date-picker.tsx +++ b/frontend/antd/date-picker/date-picker.tsx @@ -49,6 +49,7 @@ export const DatePicker = sveltify< }, [ 'allowClear.clearIcon', + 'prefix', 'prevIcon', 'nextIcon', 'suffixIcon', @@ -149,7 +150,7 @@ export const DatePicker = sveltify< renderItems[number]>( presetItems ) - ).map((preset) => { + )?.map((preset) => { return { ...preset, value: formatDayjs(preset.value), @@ -181,6 +182,9 @@ export const DatePicker = sveltify< props.prevIcon ) } + prefix={ + slots.prefix ? : props.prefix + } nextIcon={ slots.nextIcon ? ( diff --git a/frontend/antd/date-picker/range-picker/date-picker.range-picker.tsx b/frontend/antd/date-picker/range-picker/date-picker.range-picker.tsx index 3847f372..91d665d7 100644 --- a/frontend/antd/date-picker/range-picker/date-picker.range-picker.tsx +++ b/frontend/antd/date-picker/range-picker/date-picker.range-picker.tsx @@ -44,6 +44,7 @@ export const DateRangePicker = sveltify< }, [ 'allowClear.clearIcon', + 'prefix', 'prevIcon', 'nextIcon', 'suffixIcon', @@ -154,7 +155,7 @@ export const DateRangePicker = sveltify< renderItems[number]>( presetItems ) - ).map((preset) => { + )?.map((preset) => { return { ...preset, value: formatDates(preset.value as any), @@ -183,6 +184,9 @@ export const DateRangePicker = sveltify< }) : props.renderExtraFooter } + prefix={ + slots.prefix ? : props.prefix + } prevIcon={ slots.prevIcon ? ( diff --git a/frontend/antd/empty/empty.tsx b/frontend/antd/empty/empty.tsx index a7a7bdf4..ed763f95 100644 --- a/frontend/antd/empty/empty.tsx +++ b/frontend/antd/empty/empty.tsx @@ -6,6 +6,19 @@ export const Empty = sveltify< GetProps, ['description', 'image'] >(({ slots, imageStyle, ...props }) => { + const getImage = () => { + if (slots.image) { + return ; + } + switch (props.image) { + case 'PRESENTED_IMAGE_DEFAULT': + return AEmpty.PRESENTED_IMAGE_DEFAULT; + case 'PRESENTED_IMAGE_SIMPLE': + return AEmpty.PRESENTED_IMAGE_SIMPLE; + default: + return props.image; + } + }; return ( : props.image} + image={getImage()} /> ); }); diff --git a/frontend/antd/float-button/back-top/Index.svelte b/frontend/antd/float-button/back-top/Index.svelte index 8251b193..bb49bb8f 100644 --- a/frontend/antd/float-button/back-top/Index.svelte +++ b/frontend/antd/float-button/back-top/Index.svelte @@ -76,6 +76,3 @@ /> {/await} {/if} - - diff --git a/frontend/antd/input/otp/Index.svelte b/frontend/antd/input/otp/Index.svelte index e5e27321..2c3dbb2b 100644 --- a/frontend/antd/input/otp/Index.svelte +++ b/frontend/antd/input/otp/Index.svelte @@ -72,6 +72,3 @@ /> {/await} {/if} - - diff --git a/frontend/antd/message/Index.svelte b/frontend/antd/message/Index.svelte index 00777e64..ea2c175a 100644 --- a/frontend/antd/message/Index.svelte +++ b/frontend/antd/message/Index.svelte @@ -67,6 +67,7 @@ {...bindEvents($mergedProps)} content={$mergedProps.props.content || $mergedProps.content} slots={$slots} + messageKey={$mergedProps.props.key || $mergedProps.restProps.key} visible={$mergedProps.visible} onVisible={(v) => { visible = v; diff --git a/frontend/antd/message/message.tsx b/frontend/antd/message/message.tsx index 0c2b7ee0..bdd49c83 100644 --- a/frontend/antd/message/message.tsx +++ b/frontend/antd/message/message.tsx @@ -11,6 +11,7 @@ export const Message = sveltify< ConfigOptions & { children?: React.ReactNode; visible?: boolean; + messageKey?: string | number; onVisible?: (visible: boolean) => void; }, ['content', 'icon'] @@ -22,6 +23,7 @@ export const Message = sveltify< onVisible, onClose, getContainer, + messageKey, ...props }) => { const getContainerFunction = useFunction(getContainer); @@ -34,6 +36,7 @@ export const Message = sveltify< if (visible) { messageApi.open({ ...props, + key: messageKey, icon: slots.icon ? : props.icon, content: slots.content ? ( @@ -46,14 +49,23 @@ export const Message = sveltify< }, }); } else { - messageApi.destroy(props.key); + messageApi.destroy(messageKey); } return () => { - messageApi.destroy(props.key); + messageApi.destroy(messageKey); }; // eslint-disable-next-line react-hooks/exhaustive-deps - }, [visible]); + }, [ + visible, + messageKey, + props.content, + props.className, + props.duration, + props.icon, + props.style, + props.type, + ]); return ( <>
{children}
diff --git a/frontend/antd/modal/modal.tsx b/frontend/antd/modal/modal.tsx index a1c3be45..beb3e1b0 100644 --- a/frontend/antd/modal/modal.tsx +++ b/frontend/antd/modal/modal.tsx @@ -36,6 +36,7 @@ export const Modal = sveltify< const afterCloseFunction = useFunction(afterClose); const getContainerFunction = useFunction(getContainer); const modalRenderFunction = useFunction(modalRender); + return ( + + + +{#await AwaitedModalStatic then ModalStatic} + { + visible = v; + }} + > + + +{/await} + + diff --git a/frontend/antd/modal/static/gradio.config.js b/frontend/antd/modal/static/gradio.config.js new file mode 100644 index 00000000..1992403d --- /dev/null +++ b/frontend/antd/modal/static/gradio.config.js @@ -0,0 +1,3 @@ +import config from '../../../defineConfig.js'; + +export default config(); diff --git a/frontend/antd/modal/static/modal.static.tsx b/frontend/antd/modal/static/modal.static.tsx new file mode 100644 index 00000000..48004912 --- /dev/null +++ b/frontend/antd/modal/static/modal.static.tsx @@ -0,0 +1,134 @@ +import { sveltify } from '@svelte-preprocess-react'; +import { ReactSlot } from '@svelte-preprocess-react/react-slot'; +import type { SetSlotParams } from '@svelte-preprocess-react/slot'; +import React, { useEffect, useRef } from 'react'; +import { useFunction } from '@utils/hooks/useFunction'; +import { renderParamsSlot } from '@utils/renderParamsSlot'; +import { Modal as AModal, type ModalFuncProps } from 'antd'; +import type { ModalFuncWithPromise } from 'antd/es/modal/useModal'; + +export const ModalStatic = sveltify< + ModalFuncProps & { + setSlotParams: SetSlotParams; + visible?: boolean; + type?: 'info' | 'success' | 'error' | 'warning' | 'confirm'; + onVisible?: (visible: boolean) => void; + }, + [ + 'cancelButtonProps.icon', + 'cancelText', + 'closable.closeIcon', + 'closeIcon', + 'footer', + 'content', + 'title', + 'okButtonProps.icon', + 'okText', + 'modalRender', + ] +>( + ({ + slots, + afterClose, + afterOpenChange, + getContainer, + children, + modalRender, + setSlotParams, + onVisible, + onCancel, + onOk, + visible, + type, + ...props + }) => { + const afterOpenChangeFunction = useFunction(afterOpenChange); + const afterCloseFunction = useFunction(afterClose); + const getContainerFunction = useFunction(getContainer); + const modalRenderFunction = useFunction(modalRender); + const [modalApi, contextHolder] = AModal.useModal(); + const currentModalRef = useRef | null>( + null + ); + + useEffect(() => { + if (visible) { + currentModalRef.current = modalApi[type || 'info']({ + ...props, + autoFocusButton: + props.autoFocusButton === undefined ? null : props.autoFocusButton, + afterOpenChange: afterOpenChangeFunction, + afterClose: afterCloseFunction, + getContainer: + typeof getContainer === 'string' + ? getContainerFunction + : getContainer, + okText: slots.okText ? ( + + ) : ( + props.okText + ), + okButtonProps: { + ...(props.okButtonProps || {}), + icon: slots['okButtonProps.icon'] ? ( + + ) : ( + props.okButtonProps?.icon + ), + }, + cancelText: slots.cancelText ? ( + + ) : ( + props.cancelText + ), + cancelButtonProps: { + ...(props.cancelButtonProps || {}), + icon: slots['cancelButtonProps.icon'] ? ( + + ) : ( + props.cancelButtonProps?.icon + ), + }, + closable: slots['closable.closeIcon'] + ? { + ...(typeof props.closable === 'object' ? props.closable : {}), + closeIcon: , + } + : props.closable, + closeIcon: slots.closeIcon ? ( + + ) : ( + props.closeIcon + ), + footer: slots.footer + ? renderParamsSlot({ slots, setSlotParams, key: 'footer' }) + : props.footer, + title: slots.title ? : props.title, + modalRender: slots.modalRender + ? renderParamsSlot({ slots, setSlotParams, key: 'modalRender' }) + : modalRenderFunction, + onCancel(...args) { + onCancel?.(...args); + onVisible?.(false); + }, + onOk(...args) { + onOk?.(...args); + onVisible?.(false); + }, + }); + } else { + currentModalRef.current?.destroy(); + currentModalRef.current = null; + } + // eslint-disable-next-line react-hooks/exhaustive-deps + }, [visible]); + return ( + <> +
{children}
+ {contextHolder} + + ); + } +); + +export default ModalStatic; diff --git a/frontend/antd/modal/static/package.json b/frontend/antd/modal/static/package.json new file mode 100644 index 00000000..80b28455 --- /dev/null +++ b/frontend/antd/modal/static/package.json @@ -0,0 +1,14 @@ +{ + "name": "@modelscope-studio/antd-modal.static", + "type": "module", + "exports": { + ".": { + "default": "./Index.svelte", + "gradio": "./Index.svelte" + }, + "./package.json": { + "default": "./package.json", + "gradio": "./package.json" + } + } +} diff --git a/frontend/antd/notification/Index.svelte b/frontend/antd/notification/Index.svelte index c453d175..b2fb750f 100644 --- a/frontend/antd/notification/Index.svelte +++ b/frontend/antd/notification/Index.svelte @@ -66,6 +66,7 @@ {...$mergedProps.props} {...bindEvents($mergedProps)} message={$mergedProps.props.message || $mergedProps.message} + notificationKey={$mergedProps.props.key || $mergedProps.restProps.key} slots={$slots} visible={$mergedProps.visible} onVisible={(v) => { diff --git a/frontend/antd/notification/notification.tsx b/frontend/antd/notification/notification.tsx index ff06262a..5910b9f5 100644 --- a/frontend/antd/notification/notification.tsx +++ b/frontend/antd/notification/notification.tsx @@ -9,6 +9,7 @@ export const Notification = sveltify< ArgsProps & NotificationConfig & { children?: React.ReactNode; + notificationKey?: string | number; visible?: boolean; onVisible?: (visible: boolean) => void; }, @@ -22,6 +23,7 @@ export const Notification = sveltify< top, children, visible, + notificationKey, onClose, onVisible, ...props @@ -37,6 +39,7 @@ export const Notification = sveltify< if (visible) { notificationApi.open({ ...props, + key: notificationKey, btn: slots.btn ? : props.btn, closeIcon: slots['closeIcon'] ? ( @@ -60,14 +63,30 @@ export const Notification = sveltify< }, }); } else { - notificationApi.destroy(props.key); + notificationApi.destroy(notificationKey); } return () => { - notificationApi.destroy(props.key); + notificationApi.destroy(notificationKey); }; // eslint-disable-next-line react-hooks/exhaustive-deps - }, [visible]); + }, [ + visible, + notificationKey, + props.btn, + props.closeIcon, + props.className, + props.description, + props.duration, + props.showProgress, + props.pauseOnHover, + props.icon, + props.message, + props.placement, + props.style, + props.role, + props.props, + ]); return ( <> {children} diff --git a/frontend/antd/package.json b/frontend/antd/package.json index 7b3ed757..ae2854d6 100644 --- a/frontend/antd/package.json +++ b/frontend/antd/package.json @@ -1,5 +1,5 @@ { "name": "@modelscope-studio/antd", - "version": "1.0.0-beta.7", + "version": "1.0.0-beta.9", "type": "module" } diff --git a/frontend/antd/segmented/option/Index.svelte b/frontend/antd/segmented/option/Index.svelte index c37794b4..d129c9f2 100644 --- a/frontend/antd/segmented/option/Index.svelte +++ b/frontend/antd/segmented/option/Index.svelte @@ -69,7 +69,9 @@ ...$mergedProps.props, ...bindEvents($mergedProps), }, - slots: $slots, + slots: { + ...$slots, + }, }); diff --git a/frontend/antd/segmented/segmented.tsx b/frontend/antd/segmented/segmented.tsx index ad6b1e43..0d5255b7 100644 --- a/frontend/antd/segmented/segmented.tsx +++ b/frontend/antd/segmented/segmented.tsx @@ -26,7 +26,7 @@ export const Segmented = sveltify< return ( options || renderItems(slotItems, { - clone: true, + clone: false, }) ); }, [options, slotItems])} diff --git a/frontend/antd/select/select.tsx b/frontend/antd/select/select.tsx index 48c4d0f4..d1f98d43 100644 --- a/frontend/antd/select/select.tsx +++ b/frontend/antd/select/select.tsx @@ -26,6 +26,7 @@ export const Select = sveltify< 'optionRender', 'tagRender', 'labelRender', + 'prefix', ] >( ({ @@ -83,6 +84,9 @@ export const Select = sveltify< } : props.allowClear } + prefix={ + slots.prefix ? : props.prefix + } removeIcon={ slots.removeIcon ? ( diff --git a/frontend/antd/spin/Index.svelte b/frontend/antd/spin/Index.svelte index 48309203..2a7fda1b 100644 --- a/frontend/antd/spin/Index.svelte +++ b/frontend/antd/spin/Index.svelte @@ -17,7 +17,9 @@ export let props: Record = {}; const updatedProps = writable(props); $: updatedProps.update((prev) => ({ ...prev, ...props })); - export let _internal: Record = {}; + export let _internal: { + layout?: boolean; + } = {}; export let as_item: string | undefined; // gradio properties diff --git a/frontend/antd/spin/spin.tsx b/frontend/antd/spin/spin.tsx index 73d82845..6f8548cb 100644 --- a/frontend/antd/spin/spin.tsx +++ b/frontend/antd/spin/spin.tsx @@ -1,6 +1,7 @@ import { sveltify } from '@svelte-preprocess-react'; import { ReactSlot } from '@svelte-preprocess-react/react-slot'; import React from 'react'; +import { useTargets } from '@utils/hooks/useTargets'; import { type GetProps, Spin as ASpin } from 'antd'; export const Spin = sveltify< @@ -8,15 +9,28 @@ export const Spin = sveltify< id?: string; }, ['tip', 'indicator'] ->(({ slots, ...props }) => { +>(({ slots, children, ...props }) => { + const targets = useTargets(children); + return ( - : props.tip} - indicator={ - slots.indicator ? : props.indicator - } - /> + <> +
+ {targets.length === 0 ? children : null} +
+ : props.tip} + indicator={ + slots.indicator ? ( + + ) : ( + props.indicator + ) + } + > + {targets.length === 0 ? undefined : children} + + ); }); diff --git a/frontend/antd/splitter/splitter.tsx b/frontend/antd/splitter/splitter.tsx index 2a0daf70..34f9dee0 100644 --- a/frontend/antd/splitter/splitter.tsx +++ b/frontend/antd/splitter/splitter.tsx @@ -18,6 +18,7 @@ export const Splitter = sveltify< return; } const { el, props: panelProps } = item; + return ( {el && } diff --git a/frontend/antd/table/Index.svelte b/frontend/antd/table/Index.svelte index f3007e0f..dd819636 100644 --- a/frontend/antd/table/Index.svelte +++ b/frontend/antd/table/Index.svelte @@ -26,7 +26,6 @@ export let _internal: Record = {}; export let as_item: string | undefined; export let props: Record = {}; - export let data_source: Record[]; const updatedProps: Writable = writable(props); $: updatedProps.update((prev) => ({ ...prev, ...props })); export let elem_id = ''; @@ -43,7 +42,6 @@ elem_id, elem_classes, elem_style, - data_source, restProps: $$restProps, }); $: update({ @@ -55,7 +53,6 @@ elem_id, elem_classes, elem_style, - data_source, restProps: $$restProps, }); const setSlotParams = getSetSlotParamsFn(); @@ -77,7 +74,6 @@ {...$mergedProps.props} {...bindEvents($mergedProps)} slots={$slots} - dataSource={$mergedProps.props.dataSource ?? $mergedProps.data_source} rowSelectionItems={$rowSelectionItems} expandableItems={$expandableItems} columnItems={$columnItems} diff --git a/frontend/antd/table/column/Column.svelte b/frontend/antd/table/column/Column.svelte new file mode 100644 index 00000000..148a773f --- /dev/null +++ b/frontend/antd/table/column/Column.svelte @@ -0,0 +1,246 @@ + + + + +{#if $mergedProps.visible} + +{/if} + + diff --git a/frontend/antd/table/column/Index.svelte b/frontend/antd/table/column/Index.svelte index 9e848fbc..19f556c8 100644 --- a/frontend/antd/table/column/Index.svelte +++ b/frontend/antd/table/column/Index.svelte @@ -1,180 +1,38 @@ -{#if $mergedProps.visible} - -{/if} +{#await AwaitedColumn then Column} + + + +{/await}