@sdata/web-vue 3.12.0 → 3.14.0

package/es/card/card.d.ts

@@ -1,4 +1,5 @@
 import { PropType, CSSProperties } from 'vue';
+import { type ScrollbarProps } from '../scrollbar';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     bordered: {
         type: BooleanConstructor;
@@ -29,6 +30,14 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     extra: {
         type: StringConstructor;
     };
+    fullHeight: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    scrollbar: {
+        type: PropType<boolean | ScrollbarProps>;
+        default: boolean;
+    };
 }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     bordered: {
         type: BooleanConstructor;
@@ -59,12 +68,22 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     extra: {
         type: StringConstructor;
     };
+    fullHeight: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    scrollbar: {
+        type: PropType<boolean | ScrollbarProps>;
+        default: boolean;
+    };
 }>> & Readonly<{}>, {
+    scrollbar: boolean | ScrollbarProps;
     loading: boolean;
     bordered: boolean;
     hoverable: boolean;
     bodyStyle: CSSProperties;
     headerStyle: CSSProperties;
+    fullHeight: boolean;
 }, {}, {
     Spin: {
         new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
@@ -126,5 +145,298 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & {
         install: (app: import("vue").App, options?: import("../_utils/types").SDOptions) => void;
     };
+    Scrollbar: {
+        new (...args: any[]): import("vue").CreateComponentPublicInstanceWithMixins<Readonly<import("vue").ExtractPropTypes<{
+            type: {
+                type: PropType<"track" | "embed">;
+                default: string;
+            };
+            outerClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
+            outerStyle: {
+                type: PropType<import("vue").StyleValue>;
+            };
+            paddingAbsolute: {
+                type: PropType<ScrollbarProps["paddingAbsolute"]>;
+                default: undefined;
+            };
+            showNativeOverlaidScrollbars: {
+                type: PropType<ScrollbarProps["showNativeOverlaidScrollbars"]>;
+                default: undefined;
+            };
+            updateOptions: {
+                type: PropType<ScrollbarProps["updateOptions"]>;
+            };
+            overflow: {
+                type: PropType<ScrollbarProps["overflow"]>;
+            };
+            scrollbars: {
+                type: PropType<ScrollbarProps["scrollbars"]>;
+            };
+            overlayOptions: {
+                type: PropType<ScrollbarProps["overlayOptions"]>;
+            };
+            events: {
+                type: PropType<ScrollbarProps["events"]>;
+            };
+            hide: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disableHorizontal: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disableVertical: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onScroll?: ((_ev: Event) => any) | undefined;
+        }>, {
+            getOSInstance: () => {
+                options: {
+                    (): import("overlayscrollbars").Options;
+                    (newOptions: import("overlayscrollbars").PartialOptions, pure?: boolean): import("overlayscrollbars").Options;
+                };
+                on: {
+                    (eventListeners: import("overlayscrollbars").EventListeners, pure?: boolean): () => void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): () => void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): () => void;
+                };
+                off: {
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): void;
+                };
+                update: (force?: boolean) => boolean;
+                sleep: (sleeping: boolean) => void;
+                state: () => import("overlayscrollbars").State;
+                elements: () => import("overlayscrollbars").Elements;
+                destroy: () => void;
+                plugin: <P extends import("overlayscrollbars").InstancePlugin>(osPlugin: P) => import("overlayscrollbars").InferInstancePluginModuleInstance<P> | undefined;
+            } | null;
+            options: (newOptions?: ScrollbarProps["overlayOptions"], pure?: boolean) => import("overlayscrollbars").Options | undefined;
+            on: (nameOrListeners: keyof import("overlayscrollbars").EventListenerArgs | import("overlayscrollbars").EventListeners, listenerOrPure?: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[] | boolean) => (() => void) | undefined;
+            off: (name: keyof import("overlayscrollbars").EventListenerArgs, listener: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[]) => void;
+            update: (force?: boolean) => boolean;
+            sleep: (sleeping: boolean) => void;
+            state: () => import("overlayscrollbars").State | undefined;
+            elements: () => import("overlayscrollbars").Elements | undefined;
+            plugin: (osPlugin: import("..").ScrollbarPlugin) => void | import("overlayscrollbars").PluginModuleInstance | undefined;
+            destroy: () => void;
+            scrollTo: (options?: number | {
+                left?: number;
+                top?: number;
+            }, y?: number) => void;
+            scrollTop: (top: number) => void;
+            scrollLeft: (left: number) => void;
+        }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+            scroll: (_ev: Event) => any;
+        }, import("vue").PublicProps, {
+            paddingAbsolute: boolean | undefined;
+            showNativeOverlaidScrollbars: boolean | undefined;
+            type: "track" | "embed";
+            hide: boolean;
+            disableHorizontal: boolean;
+            disableVertical: boolean;
+        }, true, {}, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, {}, any, import("vue").ComponentProvideOptions, {
+            P: {};
+            B: {};
+            D: {};
+            C: {};
+            M: {};
+            Defaults: {};
+        }, Readonly<import("vue").ExtractPropTypes<{
+            type: {
+                type: PropType<"track" | "embed">;
+                default: string;
+            };
+            outerClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
+            outerStyle: {
+                type: PropType<import("vue").StyleValue>;
+            };
+            paddingAbsolute: {
+                type: PropType<ScrollbarProps["paddingAbsolute"]>;
+                default: undefined;
+            };
+            showNativeOverlaidScrollbars: {
+                type: PropType<ScrollbarProps["showNativeOverlaidScrollbars"]>;
+                default: undefined;
+            };
+            updateOptions: {
+                type: PropType<ScrollbarProps["updateOptions"]>;
+            };
+            overflow: {
+                type: PropType<ScrollbarProps["overflow"]>;
+            };
+            scrollbars: {
+                type: PropType<ScrollbarProps["scrollbars"]>;
+            };
+            overlayOptions: {
+                type: PropType<ScrollbarProps["overlayOptions"]>;
+            };
+            events: {
+                type: PropType<ScrollbarProps["events"]>;
+            };
+            hide: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disableHorizontal: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+            disableVertical: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onScroll?: ((_ev: Event) => any) | undefined;
+        }>, {
+            getOSInstance: () => {
+                options: {
+                    (): import("overlayscrollbars").Options;
+                    (newOptions: import("overlayscrollbars").PartialOptions, pure?: boolean): import("overlayscrollbars").Options;
+                };
+                on: {
+                    (eventListeners: import("overlayscrollbars").EventListeners, pure?: boolean): () => void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): () => void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): () => void;
+                };
+                off: {
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): void;
+                    <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): void;
+                };
+                update: (force?: boolean) => boolean;
+                sleep: (sleeping: boolean) => void;
+                state: () => import("overlayscrollbars").State;
+                elements: () => import("overlayscrollbars").Elements;
+                destroy: () => void;
+                plugin: <P extends import("overlayscrollbars").InstancePlugin>(osPlugin: P) => import("overlayscrollbars").InferInstancePluginModuleInstance<P> | undefined;
+            } | null;
+            options: (newOptions?: ScrollbarProps["overlayOptions"], pure?: boolean) => import("overlayscrollbars").Options | undefined;
+            on: (nameOrListeners: keyof import("overlayscrollbars").EventListenerArgs | import("overlayscrollbars").EventListeners, listenerOrPure?: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[] | boolean) => (() => void) | undefined;
+            off: (name: keyof import("overlayscrollbars").EventListenerArgs, listener: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[]) => void;
+            update: (force?: boolean) => boolean;
+            sleep: (sleeping: boolean) => void;
+            state: () => import("overlayscrollbars").State | undefined;
+            elements: () => import("overlayscrollbars").Elements | undefined;
+            plugin: (osPlugin: import("..").ScrollbarPlugin) => void | import("overlayscrollbars").PluginModuleInstance | undefined;
+            destroy: () => void;
+            scrollTo: (options?: number | {
+                left?: number;
+                top?: number;
+            }, y?: number) => void;
+            scrollTop: (top: number) => void;
+            scrollLeft: (left: number) => void;
+        }, {}, {}, {}, {
+            paddingAbsolute: boolean | undefined;
+            showNativeOverlaidScrollbars: boolean | undefined;
+            type: "track" | "embed";
+            hide: boolean;
+            disableHorizontal: boolean;
+            disableVertical: boolean;
+        }>;
+        __isFragment?: never;
+        __isTeleport?: never;
+        __isSuspense?: never;
+    } & import("vue").ComponentOptionsBase<Readonly<import("vue").ExtractPropTypes<{
+        type: {
+            type: PropType<"track" | "embed">;
+            default: string;
+        };
+        outerClass: (ObjectConstructor | StringConstructor | ArrayConstructor)[];
+        outerStyle: {
+            type: PropType<import("vue").StyleValue>;
+        };
+        paddingAbsolute: {
+            type: PropType<ScrollbarProps["paddingAbsolute"]>;
+            default: undefined;
+        };
+        showNativeOverlaidScrollbars: {
+            type: PropType<ScrollbarProps["showNativeOverlaidScrollbars"]>;
+            default: undefined;
+        };
+        updateOptions: {
+            type: PropType<ScrollbarProps["updateOptions"]>;
+        };
+        overflow: {
+            type: PropType<ScrollbarProps["overflow"]>;
+        };
+        scrollbars: {
+            type: PropType<ScrollbarProps["scrollbars"]>;
+        };
+        overlayOptions: {
+            type: PropType<ScrollbarProps["overlayOptions"]>;
+        };
+        events: {
+            type: PropType<ScrollbarProps["events"]>;
+        };
+        hide: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        disableHorizontal: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        disableVertical: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        onScroll?: ((_ev: Event) => any) | undefined;
+    }>, {
+        getOSInstance: () => {
+            options: {
+                (): import("overlayscrollbars").Options;
+                (newOptions: import("overlayscrollbars").PartialOptions, pure?: boolean): import("overlayscrollbars").Options;
+            };
+            on: {
+                (eventListeners: import("overlayscrollbars").EventListeners, pure?: boolean): () => void;
+                <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): () => void;
+                <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): () => void;
+            };
+            off: {
+                <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>): void;
+                <N extends keyof import("overlayscrollbars").EventListenerArgs>(name: N, listener: import("overlayscrollbars").EventListener<N>[]): void;
+            };
+            update: (force?: boolean) => boolean;
+            sleep: (sleeping: boolean) => void;
+            state: () => import("overlayscrollbars").State;
+            elements: () => import("overlayscrollbars").Elements;
+            destroy: () => void;
+            plugin: <P extends import("overlayscrollbars").InstancePlugin>(osPlugin: P) => import("overlayscrollbars").InferInstancePluginModuleInstance<P> | undefined;
+        } | null;
+        options: (newOptions?: ScrollbarProps["overlayOptions"], pure?: boolean) => import("overlayscrollbars").Options | undefined;
+        on: (nameOrListeners: keyof import("overlayscrollbars").EventListenerArgs | import("overlayscrollbars").EventListeners, listenerOrPure?: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[] | boolean) => (() => void) | undefined;
+        off: (name: keyof import("overlayscrollbars").EventListenerArgs, listener: import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs> | import("..").ScrollbarEventListener<keyof import("overlayscrollbars").EventListenerArgs>[]) => void;
+        update: (force?: boolean) => boolean;
+        sleep: (sleeping: boolean) => void;
+        state: () => import("overlayscrollbars").State | undefined;
+        elements: () => import("overlayscrollbars").Elements | undefined;
+        plugin: (osPlugin: import("..").ScrollbarPlugin) => void | import("overlayscrollbars").PluginModuleInstance | undefined;
+        destroy: () => void;
+        scrollTo: (options?: number | {
+            left?: number;
+            top?: number;
+        }, y?: number) => void;
+        scrollTop: (top: number) => void;
+        scrollLeft: (left: number) => void;
+    }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        scroll: (_ev: Event) => any;
+    }, string, {
+        paddingAbsolute: boolean | undefined;
+        showNativeOverlaidScrollbars: boolean | undefined;
+        type: "track" | "embed";
+        hide: boolean;
+        disableHorizontal: boolean;
+        disableVertical: boolean;
+    }, {}, string, {}, import("vue").GlobalComponents, import("vue").GlobalDirectives, string, import("vue").ComponentProvideOptions> & import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps & (new () => {
+        $slots: {
+            default?: (props: {}) => any;
+        };
+    }) & {
+        install: (app: import("vue").App, options?: import("../_utils/types").SDOptions) => void;
+    };
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/card/card.js

@@ -1,13 +1,18 @@
 import { getPrefixCls } from "../_utils/global-config.js";
 import { getAllElements } from "../_utils/vue-utils.js";
 import { useSize } from "../_hooks/use-size.js";
+import { useScrollbar } from "../_hooks/use-scrollbar.js";
+import Scrollbar from "../scrollbar/index.js";
 import Spin from "../spin/index.js";
 import { cardInjectionKey } from "./context.js";
-import { computed, createVNode, defineComponent, provide, reactive, toRefs } from "vue";
+import { computed, createVNode, defineComponent, mergeProps, provide, reactive, toRef, toRefs } from "vue";
 //#region components/card/card.tsx
 var card_default = /* @__PURE__ */ defineComponent({
 	name: "Card",
-	components: { Spin },
+	components: {
+		Spin,
+		Scrollbar
+	},
 	props: {
 		/**
 		* @zh 是否有边框
@@ -65,7 +70,24 @@ var card_default = /* @__PURE__ */ defineComponent({
 		* @zh 卡片右上角的操作区域
 		* @en Content to render in the top-right corner of the card
 		*/
-		extra: { type: String }
+		extra: { type: String },
+		/**
+		* @zh 是否高度撑满父容器（内容区域自动滚动，仅在父容器有确定高度时生效）
+		* @en Whether to fill the height of the parent container (the content area scrolls automatically, only effective when the parent container has a determinate height)
+		*/
+		fullHeight: {
+			type: Boolean,
+			default: false
+		},
+		/**
+		* @zh 内容区域是否使用 Scrollbar 组件滚动，可传入对象自定义滚动条配置。为 false 时使用原生 overflow 滚动。仅 `full-height` 为 true 时生效
+		* @en Whether the content area uses the Scrollbar component for scrolling, an object can be passed to customize the scrollbar. When false, native overflow scrolling is used. Only effective when `full-height` is true
+		* @defaultValue true
+		*/
+		scrollbar: {
+			type: [Boolean, Object],
+			default: true
+		}
 	},
 	/**
 	* @zh 卡片标题
@@ -95,6 +117,8 @@ var card_default = /* @__PURE__ */ defineComponent({
 			if (_mergedSize.value === "small" || _mergedSize.value === "mini") return "small";
 			return "medium";
 		});
+		const { scrollbarProps } = useScrollbar(toRef(props, "scrollbar"));
+		const scrollEnabled = computed(() => props.fullHeight && props.scrollbar !== false);
 		const renderActions = (vns) => {
 			const actions = getAllElements(vns);
 			return createVNode("div", { "class": `${prefixCls}-actions` }, [createVNode("div", { "class": `${prefixCls}-actions-right` }, [actions.map((action, index) => createVNode("span", {
@@ -116,11 +140,16 @@ var card_default = /* @__PURE__ */ defineComponent({
 				[`${prefixCls}-loading`]: props.loading,
 				[`${prefixCls}-bordered`]: props.bordered,
 				[`${prefixCls}-hoverable`]: props.hoverable,
-				[`${prefixCls}-contain-grid`]: cardContext.hasGrid
+				[`${prefixCls}-contain-grid`]: cardContext.hasGrid,
+				[`${prefixCls}-full-height`]: props.fullHeight
 			}
 		]);
+		const bodyCls = computed(() => [`${prefixCls}-body`, {
+			[`${prefixCls}-body-scroll`]: scrollEnabled.value,
+			[`${prefixCls}-body-native`]: props.fullHeight && props.scrollbar === false
+		}]);
 		return () => {
-			var _slots$title, _slots$extra, _slots$title2, _slots$title3, _slots$extra2, _slots$extra3, _slots$default;
+			var _slots$title, _slots$extra, _slots$title2, _slots$title3, _slots$extra2, _slots$extra3, _slots$default2;
 			const hasTitle = Boolean((_slots$title = slots.title) !== null && _slots$title !== void 0 ? _slots$title : props.title);
 			const hasExtra = Boolean((_slots$extra = slots.extra) !== null && _slots$extra !== void 0 ? _slots$extra : props.extra);
 			return createVNode("div", { "class": cls.value }, [
@@ -130,9 +159,12 @@ var card_default = /* @__PURE__ */ defineComponent({
 				}, [hasTitle && createVNode("div", { "class": `${prefixCls}-header-title` }, [(_slots$title2 = (_slots$title3 = slots.title) === null || _slots$title3 === void 0 ? void 0 : _slots$title3.call(slots)) !== null && _slots$title2 !== void 0 ? _slots$title2 : props.title]), hasExtra && createVNode("div", { "class": `${prefixCls}-header-extra` }, [(_slots$extra2 = (_slots$extra3 = slots.extra) === null || _slots$extra3 === void 0 ? void 0 : _slots$extra3.call(slots)) !== null && _slots$extra2 !== void 0 ? _slots$extra2 : props.extra])]),
 				slots.cover && createVNode("div", { "class": `${prefixCls}-cover` }, [slots.cover()]),
 				createVNode("div", {
-					"class": `${prefixCls}-body`,
+					"class": bodyCls.value,
 					"style": props.bodyStyle
-				}, [props.loading ? createVNode(Spin, null, null) : (_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots), slots.actions && !cardContext.hasMeta && renderActions(slots.actions())])
+				}, [props.loading ? createVNode(Spin, null, null) : scrollEnabled.value ? createVNode(Scrollbar, mergeProps(scrollbarProps.value, { "outerClass": `${prefixCls}-body-scrollbar` }), { default: () => {
+					var _slots$default;
+					return [(_slots$default = slots.default) === null || _slots$default === void 0 ? void 0 : _slots$default.call(slots)];
+				} }) : (_slots$default2 = slots.default) === null || _slots$default2 === void 0 ? void 0 : _slots$default2.call(slots), slots.actions && !cardContext.hasMeta && renderActions(slots.actions())])
 			]);
 		};
 	}