@sdata/web-vue 3.11.0 → 3.13.0

package/es/date-picker/index.d.ts

@@ -348,7 +348,7 @@ declare const DatePicker: {
                 default: boolean;
             };
             readonly: {
-                type: BooleanConstructor;
+                type: (StringConstructor | BooleanConstructor)[];
             };
             error: {
                 type: BooleanConstructor;
@@ -429,7 +429,6 @@ declare const DatePicker: {
             "update:pickerValue": (value: CalendarValue[]) => any;
         }, import("vue").PublicProps, {
             error: boolean;
-            readonly: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br";
@@ -537,7 +536,7 @@ declare const DatePicker: {
                 default: boolean;
             };
             readonly: {
-                type: BooleanConstructor;
+                type: (StringConstructor | BooleanConstructor)[];
             };
             error: {
                 type: BooleanConstructor;
@@ -607,7 +606,6 @@ declare const DatePicker: {
             "onUpdate:pickerValue"?: ((value: CalendarValue[]) => any) | undefined;
         }>, {}, {}, {}, {}, {
             error: boolean;
-            readonly: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
             position: "top" | "tl" | "tr" | "bottom" | "bl" | "br";
@@ -712,7 +710,7 @@ declare const DatePicker: {
             default: boolean;
         };
         readonly: {
-            type: BooleanConstructor;
+            type: (StringConstructor | BooleanConstructor)[];
         };
         error: {
             type: BooleanConstructor;
@@ -793,7 +791,6 @@ declare const DatePicker: {
         "update:pickerValue": (value: CalendarValue[]) => any;
     }, string, {
         error: boolean;
-        readonly: boolean;
         popupVisible: boolean;
         defaultPopupVisible: boolean;
         position: "top" | "tl" | "tr" | "bottom" | "bl" | "br";

package/es/date-picker/picker.vue.d.ts

@@ -946,7 +946,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     readonly: {
-        type: BooleanConstructor;
+        type: (StringConstructor | BooleanConstructor)[];
     };
     error: {
         type: BooleanConstructor;
@@ -1081,7 +1081,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     readonly: {
-        type: BooleanConstructor;
+        type: (StringConstructor | BooleanConstructor)[];
     };
     error: {
         type: BooleanConstructor;
@@ -1206,7 +1206,6 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     "onUpdate:pickerValue"?: ((_value: CalendarValue) => any) | undefined;
 }>, {
     error: boolean;
-    readonly: boolean;
     popupVisible: boolean;
     defaultPopupVisible: boolean;
     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br";

package/es/date-picker/picker.vue_vue_type_script_setup_true_lang.js

@@ -3,12 +3,12 @@ import { _objectSpread2 } from "../_virtual/_@oxc-project_runtime@0.133.0/helper
 import { getPrefixCls } from "../_utils/global-config.js";
 import { isBoolean, isFunction } from "../_utils/is.js";
 import { useAllowClear } from "../_hooks/use-allow-clear.js";
+import { useI18n } from "../locale/index.js";
 import { omit } from "../_utils/omit.js";
 import pick from "../_utils/pick.js";
+import Trigger from "../trigger/index.js";
 import useState from "../_hooks/use-state.js";
 import useMergeState from "../_hooks/use-merge-state.js";
-import Trigger from "../trigger/index.js";
-import { useI18n } from "../locale/index.js";
 import { getDateValue, getDayjsValue, getNow, initializeDateLocale, isValueChange, toLocal } from "../_utils/date.js";
 import input_default from "../_components/picker/input.js";
 import { useConfigProviderProp } from "../_hooks/use-config-provider-prop.js";
@@ -57,7 +57,7 @@ var picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
 		* @zh 是否为只读
 		* @en Whether it is read-only
 		* */
-		readonly: { type: Boolean },
+		readonly: { type: [Boolean, String] },
 		/**
 		* @zh 是否为错误状态
 		* @en Whether it is an error state
@@ -451,7 +451,7 @@ var picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
 			timePickerProps,
 			selectedValue: panelValue
 		}));
-		const inputEditable = computed(() => !readonly.value && !isFunction(inputFormat.value));
+		const inputEditable = computed(() => !(readonly === null || readonly === void 0 ? void 0 : readonly.value) && !isFunction(inputFormat.value));
 		const headerMode = ref();
 		watch(panelVisible, (newVisible) => {
 			setProcessValue(void 0);
@@ -632,7 +632,7 @@ var picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineCom
 				"popup-offset": 4
 			}, __props.triggerProps, {
 				position: __props.position,
-				disabled: unref(mergedDisabled) || unref(readonly),
+				disabled: unref(mergedDisabled) || !!unref(readonly),
 				"prevent-focus": true,
 				"popup-visible": unref(panelVisible),
 				"unmount-on-close": __props.unmountOnClose,

package/es/date-picker/range-picker.vue.d.ts

@@ -1390,7 +1390,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     readonly: {
-        type: BooleanConstructor;
+        type: (StringConstructor | BooleanConstructor)[];
     };
     error: {
         type: BooleanConstructor;
@@ -1537,7 +1537,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         default: boolean;
     };
     readonly: {
-        type: BooleanConstructor;
+        type: (StringConstructor | BooleanConstructor)[];
     };
     error: {
         type: BooleanConstructor;
@@ -1607,7 +1607,6 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     "onUpdate:pickerValue"?: ((value: CalendarValue[]) => any) | undefined;
 }>, {
     error: boolean;
-    readonly: boolean;
     popupVisible: boolean;
     defaultPopupVisible: boolean;
     position: "top" | "tl" | "tr" | "bottom" | "bl" | "br";

package/es/date-picker/range-picker.vue_vue_type_script_setup_true_lang.js

@@ -4,12 +4,12 @@ import { _objectSpread2 } from "../_virtual/_@oxc-project_runtime@0.133.0/helper
 import { getPrefixCls } from "../_utils/global-config.js";
 import { isArray, isBoolean } from "../_utils/is.js";
 import { useAllowClear } from "../_hooks/use-allow-clear.js";
+import { useI18n } from "../locale/index.js";
 import { omit } from "../_utils/omit.js";
 import pick from "../_utils/pick.js";
+import Trigger from "../trigger/index.js";
 import useState from "../_hooks/use-state.js";
 import useMergeState from "../_hooks/use-merge-state.js";
-import Trigger from "../trigger/index.js";
-import { useI18n } from "../locale/index.js";
 import { getDateValue, getDayjsValue, getNow, getSortedDayjsArray, initializeDateLocale, isValueChange, toLocal } from "../_utils/date.js";
 import { useConfigProviderProp } from "../_hooks/use-config-provider-prop.js";
 import IconCalendar from "../icon/icon-calendar/index.js";
@@ -159,7 +159,7 @@ var range_picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 			type: Boolean,
 			default: true
 		},
-		readonly: { type: Boolean },
+		readonly: { type: [Boolean, String] },
 		error: { type: Boolean },
 		size: { type: String },
 		shortcuts: {
@@ -666,7 +666,7 @@ var range_picker_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ def
 			}, __props.triggerProps, {
 				"unmount-on-close": __props.unmountOnClose,
 				position: __props.position,
-				disabled: triggerDisabled.value || __props.readonly,
+				disabled: triggerDisabled.value || !!__props.readonly,
 				"popup-visible": unref(panelVisible),
 				"popup-container": __props.popupContainer,
 				onPopupVisibleChange: onPanelVisibleChange

package/es/drawer/drawer.vue_vue_type_script_setup_true_lang.js

@@ -5,12 +5,12 @@ import { off, on } from "../_utils/dom.js";
 import icon_hover_default from "../_components/icon-hover.js";
 import IconClose from "../icon/icon-close/index.js";
 import { _asyncToGenerator } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/asyncToGenerator.js";
-import Button from "../button/index.js";
-import { KEYBOARD_KEY } from "../_utils/keyboard.js";
+import { useI18n } from "../locale/index.js";
 import client_only_default from "../_components/client-only.js";
 import usePopupManager from "../_hooks/use-popup-manager.js";
 import { useTeleportContainer } from "../_hooks/use-teleport-container.js";
-import { useI18n } from "../locale/index.js";
+import Button from "../button/index.js";
+import { KEYBOARD_KEY } from "../_utils/keyboard.js";
 import Ellipsis from "../ellipsis/index.js";
 import { useConfigProviderProp } from "../_hooks/use-config-provider-prop.js";
 import { useOverflow } from "../_hooks/use-overflow.js";

package/es/empty/empty.js

@@ -1,7 +1,7 @@
 import { configProviderInjectionKey } from "../config-provider/context.js";
 import { getPrefixCls } from "../_utils/global-config.js";
-import IconEmpty from "../icon/icon-empty/index.js";
 import { useI18n } from "../locale/index.js";
+import IconEmpty from "../icon/icon-empty/index.js";
 import { createVNode, defineComponent, inject, mergeProps } from "vue";
 //#region components/empty/empty.tsx
 var empty_default = /* @__PURE__ */ defineComponent({

package/es/file-previewer/file-previewer.vue_vue_type_script_setup_true_lang.js

@@ -4,8 +4,8 @@ import { isServerRendering } from "../_utils/dom.js";
 import IconClose from "../icon/icon-close/index.js";
 import { _asyncToGenerator } from "../_virtual/_@oxc-project_runtime@0.133.0/helpers/esm/asyncToGenerator.js";
 import IconLoading from "../icon/icon-loading/index.js";
-import { KEYBOARD_KEY } from "../_utils/keyboard.js";
 import usePopupManager from "../_hooks/use-popup-manager.js";
+import { KEYBOARD_KEY } from "../_utils/keyboard.js";
 import usePopupContainer from "../_hooks/use-popup-container.js";
 import usePopupOverflowHidden from "../_hooks/use-popup-overflow-hidden.js";
 import Image from "../image/index.js";

package/es/image/image.vue_vue_type_script_setup_true_lang.js

@@ -3,10 +3,10 @@ import { getPrefixCls } from "../_utils/global-config.js";
 import { isBoolean } from "../_utils/is.js";
 import { isServerRendering } from "../_utils/dom.js";
 import IconLoading from "../icon/icon-loading/index.js";
+import { useI18n } from "../locale/index.js";
 import { omit } from "../_utils/omit.js";
 import useMergeState from "../_hooks/use-merge-state.js";
 import IconImageClose from "../icon/icon-image-close/index.js";
-import { useI18n } from "../locale/index.js";
 import { PreviewGroupInjectionKey } from "./context.js";
 import useImageLoadStatus from "./hooks/use-image-load-status.js";
 import image_footer_default from "./image-footer.js";

package/es/image/preview-action.d.ts

@@ -16,47 +16,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     disabled: boolean;
 }, {}, {
     Tooltip: {
-        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
-            popupVisible: {
-                type: BooleanConstructor;
-                default: undefined;
-            };
-            defaultPopupVisible: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            disabled: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            content: StringConstructor;
-            position: {
-                type: import("vue").PropType<import("..").TriggerPosition>;
-                default: string;
-            };
-            mini: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            backgroundColor: {
-                type: StringConstructor;
-            };
-            contentClass: {
-                type: import("vue").PropType<import("../_utils/types").ClassName>;
-            };
-            contentStyle: {
-                type: import("vue").PropType<import("vue").CSSProperties>;
-            };
-            arrowClass: {
-                type: import("vue").PropType<import("../_utils/types").ClassName>;
-            };
-            arrowStyle: {
-                type: import("vue").PropType<import("vue").CSSProperties>;
-            };
-            popupContainer: {
-                type: import("vue").PropType<string | HTMLElement>;
-            };
-        }>> & Readonly<{
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("../tooltip").TooltipProps> & Readonly<{
             "onUpdate:popupVisible"?: ((_visible: boolean) => any) | undefined;
             onPopupVisibleChange?: ((_visible: boolean) => any) | undefined;
         }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -66,109 +26,29 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             mini: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
-            position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
+            position: import("..").TriggerPosition;
             disabled: boolean;
-        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+        }, false, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
             P: {};
             B: {};
             D: {};
             C: {};
             M: {};
             Defaults: {};
-        }, Readonly<import("vue").ExtractPropTypes<{
-            popupVisible: {
-                type: BooleanConstructor;
-                default: undefined;
-            };
-            defaultPopupVisible: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            disabled: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            content: StringConstructor;
-            position: {
-                type: import("vue").PropType<import("..").TriggerPosition>;
-                default: string;
-            };
-            mini: {
-                type: BooleanConstructor;
-                default: boolean;
-            };
-            backgroundColor: {
-                type: StringConstructor;
-            };
-            contentClass: {
-                type: import("vue").PropType<import("../_utils/types").ClassName>;
-            };
-            contentStyle: {
-                type: import("vue").PropType<import("vue").CSSProperties>;
-            };
-            arrowClass: {
-                type: import("vue").PropType<import("../_utils/types").ClassName>;
-            };
-            arrowStyle: {
-                type: import("vue").PropType<import("vue").CSSProperties>;
-            };
-            popupContainer: {
-                type: import("vue").PropType<string | HTMLElement>;
-            };
-        }>> & Readonly<{
+        }, Readonly<import("../tooltip").TooltipProps> & Readonly<{
             "onUpdate:popupVisible"?: ((_visible: boolean) => any) | undefined;
             onPopupVisibleChange?: ((_visible: boolean) => any) | undefined;
         }>, {}, {}, {}, {}, {
             mini: boolean;
             popupVisible: boolean;
             defaultPopupVisible: boolean;
-            position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
+            position: import("..").TriggerPosition;
             disabled: boolean;
         }>;
         __isFragment?: never;
         __isTeleport?: never;
         __isSuspense?: never;
-    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
-        popupVisible: {
-            type: BooleanConstructor;
-            default: undefined;
-        };
-        defaultPopupVisible: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        disabled: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        content: StringConstructor;
-        position: {
-            type: import("vue").PropType<import("..").TriggerPosition>;
-            default: string;
-        };
-        mini: {
-            type: BooleanConstructor;
-            default: boolean;
-        };
-        backgroundColor: {
-            type: StringConstructor;
-        };
-        contentClass: {
-            type: import("vue").PropType<import("../_utils/types").ClassName>;
-        };
-        contentStyle: {
-            type: import("vue").PropType<import("vue").CSSProperties>;
-        };
-        arrowClass: {
-            type: import("vue").PropType<import("../_utils/types").ClassName>;
-        };
-        arrowStyle: {
-            type: import("vue").PropType<import("vue").CSSProperties>;
-        };
-        popupContainer: {
-            type: import("vue").PropType<string | HTMLElement>;
-        };
-    }>> & Readonly<{
+    } & import("vue").ComponentOptionsBase<Readonly<import("../tooltip").TooltipProps> & Readonly<{
         "onUpdate:popupVisible"?: ((_visible: boolean) => any) | undefined;
         onPopupVisibleChange?: ((_visible: boolean) => any) | undefined;
     }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -178,7 +58,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         mini: boolean;
         popupVisible: boolean;
         defaultPopupVisible: boolean;
-        position: "top" | "tl" | "tr" | "bottom" | "bl" | "br" | "left" | "lt" | "lb" | "right" | "rt" | "rb";
+        position: import("..").TriggerPosition;
         disabled: boolean;
     }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
         $slots: {

package/es/image/preview.vue_vue_type_script_setup_true_lang.js

@@ -4,10 +4,10 @@ import { off, on } from "../_utils/dom.js";
 import { throttleByRaf } from "../_utils/throttle-by-raf.js";
 import IconClose from "../icon/icon-close/index.js";
 import IconLoading from "../icon/icon-loading/index.js";
+import { useI18n } from "../locale/index.js";
+import usePopupManager from "../_hooks/use-popup-manager.js";
 import useMergeState from "../_hooks/use-merge-state.js";
 import { KEYBOARD_KEY } from "../_utils/keyboard.js";
-import usePopupManager from "../_hooks/use-popup-manager.js";
-import { useI18n } from "../locale/index.js";
 import usePopupContainer from "../_hooks/use-popup-container.js";
 import usePopupOverflowHidden from "../_hooks/use-popup-overflow-hidden.js";
 import useImageLoadStatus from "./hooks/use-image-load-status.js";

package/es/index.css

@@ -687,6 +687,9 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
 /******** link *******/
 /******** radius *******/
 /********* icon hover *********/
+/*! Tailwind CSS v4 preflight baseline scoped to SD Design layer */
+/*! Tailwind CSS v4 preflight baseline scoped to SD Design layer */
+/*! Tailwind CSS v4 preflight baseline scoped to SD Design layer */
 /* stylelint-disable-next-line layer-name-pattern */
 @layer sd-design {
   *,
@@ -871,6 +874,41 @@ html[data-overlayscrollbars-viewport~=scrollbarHidden] > body::-webkit-scrollbar
   [hidden]:where(:not([hidden=until-found])) {
     display: none !important;
   }
+  /* Native scrollbar baseline — mirrors the <Scrollbar> embed theme
+     (transparent track, neutral thumb; shares --sd-scrollbar-* with the <Scrollbar> component).
+     Opt-in: only applies within an element carrying the design-system
+     class (`.sd-design` by default; follows $prefix), e.g.
+     <html class="sd-design-system-scrollbar">. Standard scrollbar-* properties are
+     primary; ::-webkit-scrollbar*
+     is the fallback for browsers without standard support. Where the
+     standard properties apply they override the webkit rules, so the
+     rounded corners and hover/active states only render in webkit-only
+     browsers. */
+  @supports (scrollbar-color: auto) {
+    .sd-design-system-scrollbar, .sd-design-system-scrollbar * {
+      scrollbar-width: thin;
+      scrollbar-color: var(--sd-scrollbar-thumb-color, var(--sd-color-neutral-4)) transparent;
+    }
+  }
+  @supports selector(::-webkit-scrollbar) {
+    .sd-design-system-scrollbar::-webkit-scrollbar, .sd-design-system-scrollbar *::-webkit-scrollbar {
+      width: var(--sd-scrollbar-size, 6px);
+      height: var(--sd-scrollbar-size, 6px);
+    }
+    .sd-design-system-scrollbar::-webkit-scrollbar-track, .sd-design-system-scrollbar *::-webkit-scrollbar-track {
+      background: transparent;
+    }
+    .sd-design-system-scrollbar::-webkit-scrollbar-thumb, .sd-design-system-scrollbar *::-webkit-scrollbar-thumb {
+      background: var(--sd-scrollbar-thumb-color, var(--sd-color-neutral-4));
+      border-radius: var(--sd-scrollbar-thumb-radius, 6px);
+    }
+    .sd-design-system-scrollbar::-webkit-scrollbar-thumb:hover, .sd-design-system-scrollbar *::-webkit-scrollbar-thumb:hover {
+      background: var(--sd-scrollbar-thumb-color-hover, var(--sd-color-neutral-5));
+    }
+    .sd-design-system-scrollbar::-webkit-scrollbar-thumb:active, .sd-design-system-scrollbar *::-webkit-scrollbar-thumb:active {
+      background: var(--sd-scrollbar-thumb-color-active, var(--sd-color-neutral-6));
+    }
+  }
 }
 .sd-icon {
   display: inline-block;
@@ -5814,6 +5852,35 @@ body.sd-tour-active .sd-tour-popover * {
   height: 100%;
 }
 
+.sd-tabs-horizontal.sd-tabs-full-height {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+}
+.sd-tabs-horizontal.sd-tabs-full-height > .sd-tabs-nav {
+  flex-shrink: 0;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-content {
+  flex: 1;
+  min-height: 0;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-content-list {
+  height: 100%;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-content-item-active {
+  height: 100%;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-pane {
+  height: 100%;
+  overflow: auto;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-pane-scroll {
+  overflow: hidden;
+}
+.sd-tabs-horizontal.sd-tabs-full-height .sd-tabs-pane-scrollbar {
+  height: 100%;
+}
+
 .sd-tabs-nav-size-mini.sd-tabs-nav-type-line .sd-tabs-nav-extra {
   font-size: 12px;
   line-height: 32px;
@@ -8509,24 +8576,45 @@ body.sd-tour-active .sd-tour-popover * {
   height: 100%;
 }
 .sd-scrollbar .os-scrollbar {
-  --os-size: 6px;
-  --os-handle-bg: var(--sd-color-neutral-4);
-  --os-handle-bg-hover: var(--sd-color-neutral-5);
-  --os-handle-bg-active: var(--sd-color-neutral-6);
+  --os-size: var(--sd-scrollbar-size, 6px);
+  --os-handle-bg: var(
+    --sd-scrollbar-thumb-color,
+    var(--sd-color-neutral-4)
+  );
+  --os-handle-bg-hover: var(
+    --sd-scrollbar-thumb-color-hover,
+    var(--sd-color-neutral-5)
+  );
+  --os-handle-bg-active: var(
+    --sd-scrollbar-thumb-color-active,
+    var(--sd-color-neutral-6)
+  );
   --os-track-bg: transparent;
   --os-track-bg-hover: transparent;
   --os-track-bg-active: transparent;
   --os-padding-axis: 0;
   --os-padding-perpendicular: 0;
-  --os-handle-border-radius: 6px;
+  --os-handle-border-radius: var(
+    --sd-scrollbar-thumb-radius,
+    6px
+  );
 }
 .sd-scrollbar .os-scrollbar-handle {
   transition: background-color 0.16s ease, opacity 0.16s ease;
 }
 .sd-scrollbar .sd-scrollbar-theme-embed {
-  --os-handle-perpendicular-size: 6px;
-  --os-handle-perpendicular-size-hover: 6px;
-  --os-handle-perpendicular-size-active: 6px;
+  --os-handle-perpendicular-size: var(
+    --sd-scrollbar-size,
+    6px
+  );
+  --os-handle-perpendicular-size-hover: var(
+    --sd-scrollbar-size,
+    6px
+  );
+  --os-handle-perpendicular-size-active: var(
+    --sd-scrollbar-size,
+    6px
+  );
   --os-handle-interactive-area-offset: 0;
 }
 .sd-scrollbar .sd-scrollbar-theme-track {
@@ -8535,18 +8623,39 @@ body.sd-tour-active .sd-tour-popover * {
   --os-track-bg-hover: var(--sd-color-neutral-1);
   --os-track-bg-active: var(--sd-color-neutral-1);
   --os-track-border: 1px solid var(--sd-color-neutral-3);
-  --os-handle-perpendicular-size: 6px;
+  --os-handle-perpendicular-size: var(
+    --sd-scrollbar-size,
+    6px
+  );
   --os-padding-axis: -1px;
 }
 .sd-scrollbar.sd-scrollbar-type-embed .sd-scrollbar-theme-embed {
-  --os-handle-bg: var(--sd-color-neutral-4);
-  --os-handle-bg-hover: var(--sd-color-neutral-5);
-  --os-handle-bg-active: var(--sd-color-neutral-6);
+  --os-handle-bg: var(
+    --sd-scrollbar-thumb-color,
+    var(--sd-color-neutral-4)
+  );
+  --os-handle-bg-hover: var(
+    --sd-scrollbar-thumb-color-hover,
+    var(--sd-color-neutral-5)
+  );
+  --os-handle-bg-active: var(
+    --sd-scrollbar-thumb-color-active,
+    var(--sd-color-neutral-6)
+  );
 }
 .sd-scrollbar.sd-scrollbar-type-track .sd-scrollbar-theme-track {
-  --os-handle-bg: var(--sd-color-neutral-4);
-  --os-handle-bg-hover: var(--sd-color-neutral-5);
-  --os-handle-bg-active: var(--sd-color-neutral-6);
+  --os-handle-bg: var(
+    --sd-scrollbar-thumb-color,
+    var(--sd-color-neutral-4)
+  );
+  --os-handle-bg-hover: var(
+    --sd-scrollbar-thumb-color-hover,
+    var(--sd-color-neutral-5)
+  );
+  --os-handle-bg-active: var(
+    --sd-scrollbar-thumb-color-active,
+    var(--sd-color-neutral-6)
+  );
 }
 
 .sd-result {
@@ -17796,6 +17905,29 @@ body.sd-tour-active .sd-tour-popover * {
   padding: 12px 16px;
 }
 
+.sd-card-full-height {
+  display: flex;
+  flex-direction: column;
+  height: 100%;
+  overflow: hidden;
+}
+.sd-card-full-height .sd-card-header {
+  flex-shrink: 0;
+}
+.sd-card-full-height .sd-card-body {
+  flex: 1;
+  min-height: 0;
+}
+.sd-card-full-height .sd-card-body-native {
+  overflow: auto;
+}
+.sd-card-full-height .sd-card-body-scroll {
+  overflow: hidden;
+}
+.sd-card-full-height .sd-card-body-scroll .sd-card-body-scrollbar {
+  height: 100%;
+}
+
 :where(body, [sd-theme])[sd-theme=dark] .sd-card-grid-hoverable:hover::before,
 :where(body, [sd-theme])[sd-theme=dark] .sd-card-hoverable:hover {
   box-shadow: 0 4px 10px rgb(var(--sd-gray-1), 40%);

package/es/index.js

@@ -4,6 +4,9 @@ import Affix from "./affix/index.js";
 import Alert from "./alert/index.js";
 import anchor_link_default from "./anchor/anchor-link.js";
 import Anchor from "./anchor/index.js";
+import { addI18nMessages, getLocale, useLocale } from "./locale/index.js";
+import Trigger from "./trigger/index.js";
+import Tooltip from "./tooltip/index.js";
 import input_group_default from "./input/input-group.js";
 import input_password_default from "./input/input-password.js";
 import button_group_default from "./button/button-group.js";
@@ -12,7 +15,6 @@ import input_search_default from "./input/input-search.js";
 import Input from "./input/index.js";
 import Scrollbar from "./scrollbar/index.js";
 import Spin from "./spin/index.js";
-import Trigger from "./trigger/index.js";
 import AutoComplete from "./auto-complete/index.js";
 import Popover from "./popover/index.js";
 import AvatarGroup from "./avatar/avatar-group.js";
@@ -20,7 +22,6 @@ import Avatar from "./avatar/index.js";
 import BackTop from "./back-top/index.js";
 import Badge from "./badge/index.js";
 import BorderBeam from "./border-beam/index.js";
-import { addI18nMessages, getLocale, useLocale } from "./locale/index.js";
 import Empty from "./empty/index.js";
 import dropdown_button_default from "./dropdown/dropdown-button.js";
 import dropdown_group_default from "./dropdown/dropdown-group.js";
@@ -29,7 +30,6 @@ import dropdown_submenu_default from "./dropdown/dropdown-submenu.js";
 import Dropdown from "./dropdown/index.js";
 import breadcrumb_item_default from "./breadcrumb/breadcrumb-item.js";
 import Breadcrumb from "./breadcrumb/index.js";
-import Tooltip from "./tooltip/index.js";
 import Ellipsis, { PerformantEllipsis } from "./ellipsis/index.js";
 import Calendar from "./calendar/index.js";
 import card_grid_default from "./card/card-grid.js";