fix: slot context

modelscope · Nov 22, 2024 · f87e7c7 · f87e7c7
1 parent 4d4191c
commit f87e7c7
Show file tree

Hide file tree

Showing 6 changed files with 33 additions and 16 deletions.
diff --git a/docs/components/antd/config_provider/demos/basic.py b/docs/components/antd/config_provider/demos/basic.py
@@ -5,11 +5,14 @@
 
 default_locale = "en_US"
 default_direction = 'ltr'
+default_color = "#816DF8"
 with gr.Blocks() as demo:
     with ms.Application():
         with antd.ConfigProvider(
                 locale=default_locale,
-                direction=default_direction) as config_provider:
+                direction=default_direction,
+                theme=dict(token=dict(
+                    colorPrimary=default_color))) as config_provider:
             with antd.Card():
                 with ms.Div(elem_style=dict(marginBottom=16)):
                     ms.Span("change locale of components:",
@@ -47,7 +50,7 @@
                             antd.Checkbox.Group.Option("compact",
                                                        label="compact")
                         ms.Text("Primary Color: ")
-                        color = antd.ColorPicker()
+                        color = antd.ColorPicker(value=default_color)
 
                     antd.Button("Primary Button", type="primary", block=True)
 
@@ -57,15 +60,16 @@
         direction.change(fn=lambda _direction: gr.update(direction=_direction),
                          inputs=[direction],
                          outputs=[config_provider])
-        gr.on([theme.change, color.change],
-              fn=lambda _theme, _color: gr.update(theme=dict(
-                  token=dict(colorPrimary=_color),
-                  algorithm=dict(dark=True
-                                 if _theme and 'dark' in _theme else False,
-                                 compact=True
-                                 if _theme and 'compact' or [] else False))),
-              inputs=[theme, color],
-              outputs=[config_provider])
+        gr.on(
+            [theme.change, color.change],
+            fn=lambda _theme, _color: gr.update(theme=dict(
+                token=dict(colorPrimary=_color) if _color else None,
+                algorithm=dict(dark=True
+                               if _theme and 'dark' in _theme else False,
+                               compact=True
+                               if _theme and 'compact' in _theme else False))),
+            inputs=[theme, color],
+            outputs=[config_provider])
 
 if __name__ == "__main__":
     demo.queue().launch()
diff --git a/docs/requirements.txt b/docs/requirements.txt
@@ -1,2 +1,2 @@
 modelscope_studio
-modelscope_studio-1.0.0b3-py3-none-any.whl
+modelscope_studio-1.0.0b6-py3-none-any.whl
diff --git 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.3"
+version = "1.0.0-beta.6"
 description = "A third-party component library based on Gradio."
 readme = "README.md"
 license = "Apache-2.0"
@@ -93,6 +93,7 @@ artifacts = [
   "/backend/modelscope_studio/components/antd/space/templates",
   "/backend/modelscope_studio/components/antd/space/compact/templates",
   "/backend/modelscope_studio/components/base/div/templates",
+  "/backend/modelscope_studio/components/base/auto_loading/templates",
   "/backend/modelscope_studio/components/antd/pagination/templates",
   "/backend/modelscope_studio/components/base/span/templates",
   "/backend/modelscope_studio/components/base/text/templates",

diff --git a/frontend/antd/color-picker/Index.svelte b/frontend/antd/color-picker/Index.svelte
@@ -73,7 +73,7 @@
       {...$mergedProps.restProps}
       {...$mergedProps.props}
       {...bindEvents($mergedProps)}
-      value={$mergedProps.props.value ?? $mergedProps.value}
+      value={$mergedProps.props.value ?? $mergedProps.value ?? undefined}
       slots={$slots}
       presetItems={$presets}
       {value_format}

diff --git a/frontend/base/slot/Index.svelte b/frontend/base/slot/Index.svelte
@@ -56,7 +56,7 @@
   const slotKey = setSlotKey(currentValue);
   $: slotKey.set(currentValue);
 
-  const setSlotContext = getSetSlotContextFn();
+  const setSlotContext = getSetSlotContextFn({ inherit: true });
   $: {
     if ($slotParams && $slotParams[currentValue]) {
       if (paramsMappingFn) {

diff --git a/frontend/svelte-preprocess-react/slot.ts b/frontend/svelte-preprocess-react/slot.ts
@@ -65,10 +65,22 @@ export function getSlotParams() {
 }
 
 const slotContextKey = '$$ms-gr-context-key';
-export function getSetSlotContextFn() {
+export function getSetSlotContextFn({ inherit }: { inherit?: boolean } = {}) {
   const value = writable();
+  let unsubscribe: (() => void) | undefined;
+  if (inherit) {
+    const ctxValue = getContext(slotContextKey) as Writable<any>;
+    unsubscribe = ctxValue?.subscribe((v) => {
+      value?.set(v);
+    });
+  }
+  let hasSetValue = !inherit;
   setContext(slotContextKey, value);
   return (v: any) => {
+    if (!hasSetValue) {
+      hasSetValue = true;
+      unsubscribe?.();
+    }
     value.set(v);
   };
 }