@sdata/web-vue 3.18.0 → 3.20.0

package/es/_components/icon-hover.vue.d.ts

@@ -33,7 +33,7 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }>> & Readonly<{
     onClick?: ((_e: MouseEvent) => any) | undefined;
 }>, {
-    size: "small" | "mini" | "medium" | "large";
+    size: "small" | "medium" | "large" | "mini";
     disabled: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/_components/input-label/input-label.d.ts

@@ -18,6 +18,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     focused: BooleanConstructor;
     uninjectFormItemContext: BooleanConstructor;
     inputAttrs: PropType<Record<string, unknown>>;
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {
     inputRef: import("vue").Ref<HTMLInputElement | undefined, HTMLInputElement | undefined>;
     render: () => import("vue/jsx-runtime").JSX.Element;
@@ -41,14 +46,21 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     focused: BooleanConstructor;
     uninjectFormItemContext: BooleanConstructor;
     inputAttrs: PropType<Record<string, unknown>>;
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
     "onUpdate:inputValue"?: ((...args: any[]) => any) | undefined;
     onInputValueChange?: ((...args: any[]) => any) | undefined;
 }>, {
-    error: boolean;
     disabled: boolean;
+    error: boolean;
+    fitWidth: boolean;
+    maxWFull: boolean;
     inputValue: string;
     focused: boolean;
     uninjectFormItemContext: boolean;

package/es/_components/input-label/input-label.js

@@ -1,5 +1,7 @@
 import { useFormItem } from "../../_hooks/use-form-item.js";
+import _objectSpread2 from "../../_virtual/_@oxc-project_runtime@0.139.0/helpers/esm/objectSpread2.js";
 import { getPrefixCls } from "../../_utils/global-config.js";
+import { useFitWidth } from "../../_hooks/use-fit-width.js";
 import { useSize } from "../../_hooks/use-size.js";
 import { INPUT_EVENTS } from "../../_utils/constant.js";
 import { omit } from "../../_utils/omit.js";
@@ -30,7 +32,12 @@ var input_label_default = /* @__PURE__ */ defineComponent({
 		error: Boolean,
 		focused: Boolean,
 		uninjectFormItemContext: Boolean,
-		inputAttrs: Object
+		inputAttrs: Object,
+		fitWidth: Boolean,
+		maxWFull: {
+			type: Boolean,
+			default: true
+		}
 	},
 	emits: [
 		"update:inputValue",
@@ -72,6 +79,12 @@ var input_label_default = /* @__PURE__ */ defineComponent({
 			if (props.enabledInput && props.modelValue) return formatLabel();
 			return props.placeholder;
 		});
+		const { fitWidthStyle, fitWidthValue } = useFitWidth({
+			fitWidth: () => props.fitWidth,
+			text: computed(() => computedInputValue.value || formatLabel() || props.placeholder),
+			fallbackWidth: "4ch",
+			target: inputRef
+		});
 		const renderLabel = () => {
 			if (props.modelValue) {
 				var _slots$default, _slots$default2;
@@ -86,13 +99,18 @@ var input_label_default = /* @__PURE__ */ defineComponent({
 				[`${prefixCls}-search`]: props.enabledInput,
 				[`${prefixCls}-focus`]: mergedFocused.value,
 				[`${prefixCls}-disabled`]: mergedDisabled.value,
-				[`${prefixCls}-error`]: mergedError.value
+				[`${prefixCls}-error`]: mergedError.value,
+				[`${prefixCls}-fit-width`]: props.fitWidth,
+				[`${prefixCls}-max-w-full`]: props.maxWFull
 			}
 		]);
-		const wrapperAttrs = computed(() => omit(attrs, INPUT_EVENTS));
+		const wrapperAttrs = computed(() => {
+			const wrapperAttrs = omit(attrs, INPUT_EVENTS);
+			return _objectSpread2(_objectSpread2({}, wrapperAttrs), {}, { style: [fitWidthStyle.value, wrapperAttrs.style] });
+		});
 		const inputAttrs = computed(() => pick(attrs, INPUT_EVENTS));
 		const render = () => {
-			var _props$inputAttrs;
+			var _props$inputAttrs, _props$inputAttrs2;
 			let _slot;
 			return createVNode("span", mergeProps(wrapperAttrs.value, {
 				"class": cls.value,
@@ -106,6 +124,11 @@ var input_label_default = /* @__PURE__ */ defineComponent({
 					"readonly": !props.enabledInput,
 					"placeholder": mergedPlaceholder.value,
 					"disabled": mergedDisabled.value,
+					"style": [props.fitWidth ? {
+						flex: `0 1 ${fitWidthValue}`,
+						width: fitWidthValue,
+						minWidth: 0
+					} : void 0, (_props$inputAttrs2 = props.inputAttrs) === null || _props$inputAttrs2 === void 0 ? void 0 : _props$inputAttrs2.style],
 					"onInput": handleInput,
 					"onFocus": handleFocus,
 					"onBlur": handleBlur,
@@ -113,7 +136,14 @@ var input_label_default = /* @__PURE__ */ defineComponent({
 					"onCompositionupdate": handleComposition,
 					"onCompositionend": handleComposition
 				}), null),
-				createVNode("span", { "class": [`${prefixCls}-value`, { [`${prefixCls}-value-hidden`]: showInput.value }] }, [props.modelValue && createVNode(Ellipsis, { "style": { width: "100%" } }, _isSlot(_slot = renderLabel()) ? _slot : { default: () => [_slot] })]),
+				createVNode("span", {
+					"class": [`${prefixCls}-value`, { [`${prefixCls}-value-hidden`]: showInput.value }],
+					"style": props.fitWidth ? {
+						flex: `0 1 ${fitWidthValue}`,
+						width: fitWidthValue,
+						minWidth: 0
+					} : void 0
+				}, [props.modelValue && createVNode(Ellipsis, { "style": { width: "100%" } }, _isSlot(_slot = renderLabel()) ? _slot : { default: () => [_slot] })]),
 				slots.suffix && createVNode("span", { "class": `${prefixCls}-suffix` }, [slots.suffix()])
 			]);
 		};

package/es/_components/input-label/style/index.css

@@ -134,6 +134,12 @@
 .sd-input-label {
   cursor: pointer;
 }
+.sd-input-label.sd-input-label-fit-width {
+  width: fit-content;
+}
+.sd-input-label.sd-input-label-max-w-full {
+  max-width: 100%;
+}
 .sd-input-label .sd-input-label-input {
   width: 100%;
   padding-right: 0;

package/es/_components/input-label/style/input-label.scss

@@ -51,6 +51,14 @@
 
   cursor: pointer;
 
+  &.#{$cls}-fit-width {
+    width: fit-content;
+  }
+
+  &.#{$cls}-max-w-full {
+    max-width: 100%;
+  }
+
   .#{$cls}-input {
     @include input-style();
 

package/es/_components/picker/input-range.vue.d.ts

@@ -37,6 +37,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         type: PropType<string[]>;
         default: () => never[];
     };
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fitWidthFallback: {
+        type: StringConstructor;
+        default: string;
+    };
+    fitWidthFallbackText: StringConstructor;
     inputValue: {
         type: PropType<(string | undefined)[]>;
     };
@@ -84,6 +94,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
         type: PropType<string[]>;
         default: () => never[];
     };
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fitWidthFallback: {
+        type: StringConstructor;
+        default: string;
+    };
+    fitWidthFallbackText: StringConstructor;
     inputValue: {
         type: PropType<(string | undefined)[]>;
     };
@@ -102,11 +122,14 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     "onFocused-index-change"?: ((_index: number) => any) | undefined;
     "onUpdate:focusedIndex"?: ((_index: number) => any) | undefined;
 }>, {
-    error: boolean;
     value: (Dayjs | undefined)[];
     disabled: boolean | boolean[];
+    error: boolean;
     placeholder: string[];
     allowClear: boolean;
+    fitWidth: boolean;
+    maxWFull: boolean;
+    fitWidthFallback: string;
     focused: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/_components/picker/input-range.vue_vue_type_script_setup_true_lang.js

@@ -5,10 +5,11 @@ import { isArray, isDayjs, isFunction, isNumber, isUndefined } from "../../_util
 import icon_hover_default from "../icon-hover.js";
 import IconClose from "../../icon/icon-close/index.js";
 import feedback_icon_default from "../feedback-icon.js";
+import { useFitWidth } from "../../_hooks/use-fit-width.js";
 import { isReadonlyModificationKey, useReadonlyTip, useReadonlyTipText } from "../../_hooks/use-readonly-tip.js";
 import { useSize } from "../../_hooks/use-size.js";
 import Tooltip from "../../tooltip/index.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, renderSlot, toRef, toRefs, unref, useSlots, withCtx, withKeys } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createTextVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, toRef, toRefs, unref, useSlots, withCtx, withKeys } from "vue";
 //#region components/_components/picker/input-range.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"disabled",
@@ -37,6 +38,16 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 			type: Array,
 			default: () => []
 		},
+		fitWidth: Boolean,
+		maxWFull: {
+			type: Boolean,
+			default: true
+		},
+		fitWidthFallback: {
+			type: String,
+			default: "4ch"
+		},
+		fitWidthFallbackText: String,
 		inputValue: { type: Array },
 		value: {
 			type: Array,
@@ -83,7 +94,9 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 				[`${prefixCls}-focused`]: focused.value,
 				[`${prefixCls}-disabled`]: disabled0.value && disabled1.value,
 				[`${prefixCls}-error`]: mergedError.value,
-				[`${prefixCls}-has-prefix`]: slots.prefix
+				[`${prefixCls}-has-prefix`]: slots.prefix,
+				[`${prefixCls}-fit-width`]: props.fitWidth,
+				[`${prefixCls}-max-w-full`]: props.maxWFull
 			}
 		]);
 		function getInputWrapClassName(index) {
@@ -100,6 +113,23 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 		}
 		const displayValue0 = computed(() => getDisplayValue(0));
 		const displayValue1 = computed(() => getDisplayValue(1));
+		const { fitWidthStyle: fitWidthStyle0, fitWidthValue } = useFitWidth({
+			fitWidth: () => props.fitWidth,
+			text: computed(() => displayValue0.value || props.placeholder[0] || props.fitWidthFallbackText),
+			fallbackWidth: () => props.fitWidthFallback,
+			target: refInput0
+		});
+		const { fitWidthStyle: fitWidthStyle1 } = useFitWidth({
+			fitWidth: () => props.fitWidth,
+			text: computed(() => displayValue1.value || props.placeholder[1] || props.fitWidthFallbackText),
+			fallbackWidth: () => props.fitWidthFallback,
+			target: refInput1
+		});
+		const fitWidthContentStyle = computed(() => props.fitWidth ? {
+			flex: `0 1 ${fitWidthValue}`,
+			width: fitWidthValue,
+			minWidth: 0
+		} : void 0);
 		function changeFocusedInput(index) {
 			emit("focused-index-change", index);
 			emit("update:focusedIndex", index);
@@ -147,7 +177,10 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 						key: 0,
 						class: normalizeClass(`${unref(prefixCls)}-prefix`)
 					}, [renderSlot(_ctx.$slots, "prefix")], 2)) : createCommentVNode("", true),
-					createElementVNode("div", { class: normalizeClass(getInputWrapClassName(0)) }, [createElementVNode("input", mergeProps({
+					createElementVNode("div", {
+						class: normalizeClass(getInputWrapClassName(0)),
+						style: normalizeStyle([unref(fitWidthStyle0), fitWidthContentStyle.value])
+					}, [createElementVNode("input", mergeProps({
 						ref_key: "refInput0",
 						ref: refInput0,
 						disabled: disabled0.value,
@@ -157,9 +190,12 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 						onInput: onChange,
 						onKeydown: [withKeys(onPressEnter, ["enter"]), withKeys(onPressTab, ["tab"])],
 						onClick: _cache[0] || (_cache[0] = () => changeFocusedInput(0))
-					}), null, 16, _hoisted_1)], 2),
+					}), null, 16, _hoisted_1)], 6),
 					createElementVNode("span", { class: normalizeClass(`${unref(prefixCls)}-separator`) }, [renderSlot(_ctx.$slots, "separator", {}, () => [_cache[2] || (_cache[2] = createTextVNode(" - ", -1))])], 2),
-					createElementVNode("div", { class: normalizeClass(getInputWrapClassName(1)) }, [createElementVNode("input", mergeProps({
+					createElementVNode("div", {
+						class: normalizeClass(getInputWrapClassName(1)),
+						style: normalizeStyle([unref(fitWidthStyle1), fitWidthContentStyle.value])
+					}, [createElementVNode("input", mergeProps({
 						ref_key: "refInput1",
 						ref: refInput1,
 						disabled: disabled1.value,
@@ -169,7 +205,7 @@ var input_range_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defi
 						onInput: onChange,
 						onKeydown: [withKeys(onPressEnter, ["enter"]), withKeys(onPressTab, ["tab"])],
 						onClick: _cache[1] || (_cache[1] = () => changeFocusedInput(1))
-					}), null, 16, _hoisted_2)], 2),
+					}), null, 16, _hoisted_2)], 6),
 					createElementVNode("div", { class: normalizeClass(`${unref(prefixCls)}-suffix`) }, [
 						__props.allowClear && !unref(mergedDisabled) && unref(value).length === 2 ? (openBlock(), createBlock(icon_hover_default, {
 							key: 0,

package/es/_components/picker/input.vue.d.ts

@@ -30,6 +30,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     placeholder: {
         type: StringConstructor;
     };
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fitWidthFallback: {
+        type: StringConstructor;
+        default: string;
+    };
+    fitWidthFallbackText: StringConstructor;
     inputValue: {
         type: StringConstructor;
     };
@@ -70,6 +80,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     placeholder: {
         type: StringConstructor;
     };
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    fitWidthFallback: {
+        type: StringConstructor;
+        default: string;
+    };
+    fitWidthFallbackText: StringConstructor;
     inputValue: {
         type: StringConstructor;
     };
@@ -86,9 +106,12 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     onChange?: ((_e: Event) => any) | undefined;
     "onPress-enter"?: (() => any) | undefined;
 }>, {
-    error: boolean;
     disabled: boolean;
+    error: boolean;
     allowClear: boolean;
+    fitWidth: boolean;
+    maxWFull: boolean;
+    fitWidthFallback: string;
     focused: boolean;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;

package/es/_components/picker/input.vue_vue_type_script_setup_true_lang.js

@@ -5,10 +5,11 @@ import { isDayjs, isFunction } from "../../_utils/is.js";
 import icon_hover_default from "../icon-hover.js";
 import IconClose from "../../icon/icon-close/index.js";
 import feedback_icon_default from "../feedback-icon.js";
+import { useFitWidth } from "../../_hooks/use-fit-width.js";
 import { isReadonlyModificationKey, useReadonlyTip, useReadonlyTipText } from "../../_hooks/use-readonly-tip.js";
 import { useSize } from "../../_hooks/use-size.js";
 import Tooltip from "../../tooltip/index.js";
-import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, openBlock, ref, renderSlot, toRef, toRefs, unref, useSlots, withCtx, withKeys } from "vue";
+import { computed, createBlock, createCommentVNode, createElementBlock, createElementVNode, createVNode, defineComponent, mergeProps, normalizeClass, normalizeStyle, openBlock, ref, renderSlot, toRef, toRefs, unref, useSlots, withCtx, withKeys } from "vue";
 //#region components/_components/picker/input.vue?vue&type=script&setup=true&lang.ts
 var _hoisted_1 = [
 	"disabled",
@@ -25,6 +26,16 @@ var input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 		error: { type: Boolean },
 		allowClear: { type: Boolean },
 		placeholder: { type: String },
+		fitWidth: Boolean,
+		maxWFull: {
+			type: Boolean,
+			default: true
+		},
+		fitWidthFallback: {
+			type: String,
+			default: "4ch"
+		},
+		fitWidthFallbackText: String,
 		inputValue: { type: String },
 		value: { type: Object },
 		format: {
@@ -59,7 +70,9 @@ var input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 				[`${prefixCls}-focused`]: focused.value,
 				[`${prefixCls}-disabled`]: mergedDisabled.value,
 				[`${prefixCls}-error`]: mergedError.value,
-				[`${prefixCls}-has-prefix`]: slots.prefix
+				[`${prefixCls}-has-prefix`]: slots.prefix,
+				[`${prefixCls}-fit-width`]: props.fitWidth,
+				[`${prefixCls}-max-w-full`]: props.maxWFull
 			}
 		]);
 		const displayValue = computed(() => {
@@ -67,6 +80,17 @@ var input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 			if ((value === null || value === void 0 ? void 0 : value.value) && isDayjs(value.value)) return isFunction(format.value) ? format.value(value.value) : value.value.format(format.value);
 		});
 		const refInput = ref();
+		const { fitWidthStyle, fitWidthValue } = useFitWidth({
+			fitWidth: () => props.fitWidth,
+			text: computed(() => displayValue.value || props.placeholder || props.fitWidthFallbackText),
+			fallbackWidth: () => props.fitWidthFallback,
+			target: refInput
+		});
+		const fitWidthContentStyle = computed(() => props.fitWidth ? {
+			flex: `0 1 ${fitWidthValue}`,
+			width: fitWidthValue,
+			minWidth: 0
+		} : void 0);
 		function onPressEnter() {
 			emit("press-enter");
 		}
@@ -106,7 +130,10 @@ var input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 						key: 0,
 						class: normalizeClass(`${unref(prefixCls)}-prefix`)
 					}, [renderSlot(_ctx.$slots, "prefix")], 2)) : createCommentVNode("", true),
-					createElementVNode("div", { class: normalizeClass(`${unref(prefixCls)}-input`) }, [createElementVNode("input", mergeProps({
+					createElementVNode("div", {
+						class: normalizeClass(`${unref(prefixCls)}-input`),
+						style: normalizeStyle([unref(fitWidthStyle), fitWidthContentStyle.value])
+					}, [createElementVNode("input", mergeProps({
 						ref_key: "refInput",
 						ref: refInput,
 						disabled: unref(mergedDisabled),
@@ -117,7 +144,7 @@ var input_vue_vue_type_script_setup_true_lang_default = /*@__PURE__*/ defineComp
 						onKeydown: withKeys(onPressEnter, ["enter"]),
 						onInput: onChange,
 						onBlur
-					}), null, 16, _hoisted_1)], 2),
+					}), null, 16, _hoisted_1)], 6),
 					createElementVNode("div", { class: normalizeClass(`${unref(prefixCls)}-suffix`) }, [
 						__props.allowClear && !unref(mergedDisabled) && displayValue.value ? (openBlock(), createBlock(icon_hover_default, {
 							key: 0,

package/es/_components/picker/style/index.scss

@@ -21,6 +21,14 @@
     border-color theme.$transition-duration-1 theme.$transition-timing-function-standard,
     box-shadow theme.$transition-duration-1 theme.$transition-timing-function-standard;
 
+  &.#{theme.$prefix}-picker-fit-width {
+    width: fit-content;
+  }
+
+  &.#{theme.$prefix}-picker-max-w-full {
+    max-width: 100%;
+  }
+
   &-input {
     display: inline-flex;
     flex: 1;

package/es/_components/select-view/select-view.d.ts

@@ -65,6 +65,11 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     inputAttrs: PropType<Record<string, unknown>>;
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>, {
     inputRef: import("vue").ComputedRef<HTMLInputElement>;
     handleFocus: (ev: FocusEvent) => void;
@@ -73,7 +78,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
 }, {}, {}, {
     focus(): void;
     blur(): void;
-}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("focus" | "clear" | "blur" | "remove")[], "focus" | "clear" | "blur" | "remove", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("clear" | "focus" | "blur" | "remove")[], "clear" | "focus" | "blur" | "remove", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
         type: PropType<SelectViewValue[]>;
         required: true;
@@ -136,18 +141,25 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         default: boolean;
     };
     inputAttrs: PropType<Record<string, unknown>>;
+    fitWidth: BooleanConstructor;
+    maxWFull: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
 }>> & Readonly<{
     onFocus?: ((...args: any[]) => any) | undefined;
     onBlur?: ((...args: any[]) => any) | undefined;
     onClear?: ((...args: any[]) => any) | undefined;
     onRemove?: ((...args: any[]) => any) | undefined;
 }>, {
-    error: boolean;
+    multiple: boolean;
     disabled: boolean;
+    error: boolean;
     showArrow: boolean;
     allowClear: boolean;
+    fitWidth: boolean;
+    maxWFull: boolean;
     loading: boolean;
-    multiple: boolean;
     bordered: boolean;
     maxTagCount: number | "responsive";
     retainInputValue: boolean;

package/es/_components/select-view/select-view.js

@@ -75,7 +75,12 @@ var select_view_default = /* @__PURE__ */ defineComponent({
 			type: Boolean,
 			default: false
 		},
-		inputAttrs: Object
+		inputAttrs: Object,
+		fitWidth: Boolean,
+		maxWFull: {
+			type: Boolean,
+			default: true
+		}
 	},
 	emits: [
 		"remove",
@@ -170,6 +175,8 @@ var select_view_default = /* @__PURE__ */ defineComponent({
 					"retainInputValue": true,
 					"uninjectFormItemContext": true,
 					"inputAttrs": props.inputAttrs,
+					"fitWidth": props.fitWidth,
+					"maxWFull": props.maxWFull,
 					"onRemove": handleRemove,
 					"onFocus": handleFocus,
 					"onBlur": handleBlur
@@ -193,6 +200,8 @@ var select_view_default = /* @__PURE__ */ defineComponent({
 				"enabledInput": enabledInput.value,
 				"uninjectFormItemContext": true,
 				"inputAttrs": props.inputAttrs,
+				"fitWidth": props.fitWidth,
+				"maxWFull": props.maxWFull,
 				"onFocus": handleFocus,
 				"onBlur": handleBlur
 			}, {

package/es/_components/select-view/style/index.css

@@ -591,6 +591,12 @@
 .sd-select-view-single {
   cursor: pointer;
 }
+.sd-select-view-single.sd-select-view-fit-width {
+  width: fit-content;
+}
+.sd-select-view-single.sd-select-view-max-w-full {
+  max-width: 100%;
+}
 .sd-select-view-single .sd-select-view-input {
   width: 100%;
   padding-right: 0;
@@ -791,6 +797,12 @@
   max-width: 100%;
   overflow: hidden;
 }
+.sd-select-view-multiple.sd-select-view-fit-width {
+  width: fit-content;
+}
+.sd-select-view-multiple.sd-select-view-max-w-full {
+  max-width: 100%;
+}
 .sd-select-view-multiple.sd-select-view-has-tag {
   padding-right: 4px;
   padding-left: 4px;

package/es/_components/virtual-list/virtual-list.vue.d.ts

@@ -137,10 +137,10 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     update: (_startIndex: number, _endIndex: number, _visibleStartIndex: number, _visibleEndIndex: number) => any;
     scroll: (_ev: Event) => any;
-    resize: () => any;
+    hidden: () => any;
     visible: () => any;
+    resize: () => any;
     reachBottom: (_ev: Event) => any;
-    hidden: () => any;
     scrollStart: () => any;
     scrollEnd: () => any;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
@@ -243,14 +243,16 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
 }>> & Readonly<{
     onUpdate?: ((_startIndex: number, _endIndex: number, _visibleStartIndex: number, _visibleEndIndex: number) => any) | undefined;
     onScroll?: ((_ev: Event) => any) | undefined;
-    onResize?: (() => any) | undefined;
+    onHidden?: (() => any) | undefined;
     onVisible?: (() => any) | undefined;
+    onResize?: (() => any) | undefined;
     onReachBottom?: ((_ev: Event) => any) | undefined;
-    onHidden?: (() => any) | undefined;
     onScrollStart?: (() => any) | undefined;
     onScrollEnd?: (() => any) | undefined;
 }>, {
     shift: boolean;
+    scrollbar: boolean | ScrollbarProps;
+    enabled: boolean;
     emitUpdate: boolean;
     disableTransform: boolean;
     flowMode: boolean;
@@ -263,7 +265,6 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     itemTag: string;
     itemSize: ItemSizeValue;
     minItemSize: string | number | null;
-    enabled: boolean;
     threshold: number;
     fixedSize: boolean;
     estimatedSize: number;
@@ -273,7 +274,6 @@ declare const __VLS_base: import("vue").DefineComponent<import("vue").ExtractPro
     contentAttrs: Record<string, unknown> | undefined;
     listStyle: CSSProperties | undefined;
     paddingPosition: "content" | "list";
-    scrollbar: boolean | ScrollbarProps;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 declare const __VLS_export: __VLS_WithSlots<typeof __VLS_base, __VLS_Slots>;
 declare const _default: typeof __VLS_export;

package/es/_hooks/use-fit-width.d.ts

@@ -0,0 +1,22 @@
+import type { CSSProperties, MaybeRefOrGetter, Ref } from 'vue';
+type FitWidthElement = HTMLInputElement | HTMLTextAreaElement;
+export interface FitWidthProps {
+    fitWidth?: boolean;
+    maxWFull?: boolean;
+}
+interface UseFitWidthOptions {
+    fitWidth: MaybeRefOrGetter<boolean | undefined>;
+    text: MaybeRefOrGetter<string | undefined>;
+    fallbackWidth: MaybeRefOrGetter<string>;
+    target: Ref<FitWidthElement | undefined>;
+    whiteSpace?: 'normal' | 'pre-wrap';
+    additionalWidth?: number;
+}
+export declare const getFitWidthCssVar: (prefix: string) => string;
+export declare function useFitWidth(options: UseFitWidthOptions): {
+    fitWidthCssVar: string;
+    fitWidthStyle: import("vue").ComputedRef<CSSProperties>;
+    fitWidthValue: string;
+    measure: () => void;
+};
+export {};