@sdata/web-vue 1.7.0 → 1.8.0

package/es/_hooks/use-allow-clear.d.ts

@@ -0,0 +1,4 @@
+import { Ref } from 'vue';
+export declare const useAllowClear: (allowClear?: Ref<boolean | undefined>) => {
+    mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
+};

package/es/_hooks/use-allow-clear.js

@@ -0,0 +1,20 @@
+import { configProviderInjectionKey } from "../config-provider/context.js";
+import { computed, getCurrentInstance, inject } from "vue";
+//#region components/_hooks/use-allow-clear.ts
+var ALLOW_CLEAR_PROP_NAMES = ["allowClear", "allow-clear"];
+var useAllowClear = (allowClear) => {
+	const instance = getCurrentInstance();
+	const configProviderCtx = inject(configProviderInjectionKey, void 0);
+	const hasAllowClearProp = computed(() => {
+		const rawProps = instance === null || instance === void 0 ? void 0 : instance.vnode.props;
+		if (!rawProps) return false;
+		return ALLOW_CLEAR_PROP_NAMES.some((propName) => Object.prototype.hasOwnProperty.call(rawProps, propName));
+	});
+	return { mergedAllowClear: computed(() => {
+		if (hasAllowClearProp.value) return allowClear === null || allowClear === void 0 ? void 0 : allowClear.value;
+		if ((configProviderCtx === null || configProviderCtx === void 0 ? void 0 : configProviderCtx.allowClear) === true) return true;
+		return allowClear === null || allowClear === void 0 ? void 0 : allowClear.value;
+	}) };
+};
+//#endregion
+export { useAllowClear };

package/es/_hooks/use-component-ref.d.ts

@@ -1,5 +1,5 @@
 import { ComponentPublicInstance } from 'vue';
 export declare const useComponentRef: (name: string) => {
-    componentRef: import("vue").Ref<ComponentPublicInstance | HTMLElement | undefined, ComponentPublicInstance | HTMLElement | undefined>;
+    componentRef: import("vue").Ref<HTMLElement | ComponentPublicInstance | undefined, HTMLElement | ComponentPublicInstance | undefined>;
     elementRef: import("vue").Ref<any, any>;
 };

package/es/_hooks/use-teleport-container.d.ts

@@ -1,10 +1,10 @@
 import { Ref } from 'vue';
 export declare const useTeleportContainer: ({ popupContainer, visible, defaultContainer, documentContainer, }: {
-    popupContainer: Ref<string | HTMLElement | undefined>;
+    popupContainer: Ref<string | HTMLElement | null | undefined>;
     visible: Ref<boolean>;
     defaultContainer?: string;
     documentContainer?: boolean;
 }) => {
-    teleportContainer: Ref<string | HTMLElement | undefined, string | HTMLElement | undefined>;
+    teleportContainer: Ref<string | HTMLElement | null | undefined, string | HTMLElement | null | undefined>;
     containerRef: Ref<HTMLElement | undefined, HTMLElement | undefined>;
 };

package/es/_hooks/use-teleport-container.js

@@ -5,15 +5,18 @@ var useTeleportContainer = ({ popupContainer, visible, defaultContainer = "body"
 	const teleportContainer = ref(popupContainer.value);
 	const containerRef = ref();
 	const getContainer = () => {
-		const element = getElement(popupContainer.value);
-		const _teleportContainer = element ? popupContainer.value : defaultContainer;
+		var _popupContainer$value;
+		const resolvedPopupContainer = (_popupContainer$value = popupContainer.value) !== null && _popupContainer$value !== void 0 ? _popupContainer$value : void 0;
+		const element = getElement(resolvedPopupContainer);
+		const _teleportContainer = element ? resolvedPopupContainer : defaultContainer;
 		const _containerElement = element !== null && element !== void 0 ? element : documentContainer ? document.documentElement : getElement(defaultContainer);
 		if (_teleportContainer !== teleportContainer.value) teleportContainer.value = _teleportContainer;
 		if (_containerElement !== containerRef.value) containerRef.value = _containerElement;
 	};
 	onMounted(() => getContainer());
-	watch(visible, (visible) => {
-		if (teleportContainer.value !== popupContainer.value && visible) getContainer();
+	watch([popupContainer, visible], ([nextPopupContainer, nextVisible]) => {
+		if (!nextVisible) return;
+		if (teleportContainer.value !== nextPopupContainer) getContainer();
 	});
 	return {
 		teleportContainer,

package/es/_utils/color.js

@@ -141,23 +141,6 @@ var formatInputToHSVA = (color) => {
 		a: 1
 	};
 };
-var hexToRgb = (color) => {
-	color = color.trim().toLowerCase();
-	if (color.length === 0) return false;
-	let match = matchers.hex6.exec(color);
-	if (match) return {
-		r: parseIntFromHex(match[1]),
-		g: parseIntFromHex(match[2]),
-		b: parseIntFromHex(match[3])
-	};
-	match = matchers.hex3.exec(color);
-	if (match) return {
-		r: parseIntFromHex(match[1] + match[1]),
-		g: parseIntFromHex(match[2] + match[2]),
-		b: parseIntFromHex(match[3] + match[3])
-	};
-	return false;
-};
 var rgbToHex = (r, g, b) => {
 	return [
 		Math.round(r).toString(16).padStart(2, "0"),
@@ -174,4 +157,4 @@ var rgbaToHex = (r, g, b, a) => {
 	].join("").toUpperCase();
 };
 //#endregion
-export { formatInputToHSVA, hexToRgb, hsvToRgb, rgbToHex, rgbToHsv, rgbaToHex };
+export { formatInputToHSVA, hsvToRgb, rgbToHex, rgbToHsv, rgbaToHex };

package/es/auto-complete/auto-complete.js

@@ -2,6 +2,7 @@ import { useFormItem } from "../_hooks/use-form-item.js";
 import { getPrefixCls } from "../_utils/global-config.js";
 import { isFunction, isNull, isUndefined } from "../_utils/is.js";
 import virtual_list_v2_default from "../_components/virtual-list-v2/index.js";
+import { useAllowClear } from "../_hooks/use-allow-clear.js";
 import Input from "../input/index.js";
 import { getKeyFromValue } from "../select/utils.js";
 import { useSelect } from "../select/hooks/use-select.js";
@@ -56,9 +57,10 @@ var auto_complete_default = /* @__PURE__ */ defineComponent({
 		"dropdownReachBottom": (_ev) => true
 	},
 	setup(props, { emit, attrs, slots }) {
-		const { modelValue } = toRefs(props);
+		const { modelValue, allowClear } = toRefs(props);
 		const prefixCls = getPrefixCls("auto-complete");
 		const { mergedDisabled, eventHandlers } = useFormItem({ disabled: toRef(props, "disabled") });
+		const { mergedAllowClear } = useAllowClear(allowClear);
 		const _value = ref(props.defaultValue);
 		const inputRef = ref();
 		const computedValue = computed(() => {
@@ -180,7 +182,7 @@ var auto_complete_default = /* @__PURE__ */ defineComponent({
 			"autoFitPopupWidth": true
 		}, props.triggerProps, { "onPopupVisibleChange": handlePopupVisibleChange }), {
 			default: () => [createVNode(Input, mergeProps({ "ref": inputRef }, attrs, {
-				"allowClear": props.allowClear,
+				"allowClear": mergedAllowClear.value,
 				"modelValue": computedValue.value,
 				"disabled": mergedDisabled.value,
 				"onInput": handleInputValueChange,

package/es/cascader/cascader.js

@@ -71,7 +71,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
 			disabled: _ctx.mergedDisabled,
 			error: _ctx.error,
 			multiple: _ctx.multiple,
-			"allow-clear": _ctx.allowClear,
+			"allow-clear": _ctx.mergedAllowClear,
 			"allow-search": _ctx.allowSearch,
 			size: _ctx.size,
 			opened: _ctx.computedPopupVisible,

package/es/cascader/cascader.vue.d.ts

@@ -227,6 +227,7 @@ declare const __VLS_export: import("vue").DefineComponent<import("vue").ExtractP
     handleBlur: (e: FocusEvent) => void;
     handleRemove: (key: string) => void;
     mergedDisabled: import("vue").ComputedRef<boolean>;
+    mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
     handleKeyDown: (event: KeyboardEvent) => void;
     totalLevel: import("vue").Ref<number, number>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {

package/es/cascader/cascader.vue_vue_type_script_lang.js

@@ -1,6 +1,7 @@
 import { useFormItem } from "../_hooks/use-form-item.js";
 import { _objectSpread2 } from "../_virtual/_@oxc-project_runtime@0.124.0/helpers/objectSpread2.js";
 import { isArray, isFunction, isNull, isUndefined } from "../_utils/is.js";
+import { useAllowClear } from "../_hooks/use-allow-clear.js";
 import { KEYBOARD_KEY, getKeyDownHandler } from "../_utils/keyboard.js";
 import Trigger from "../trigger/index.js";
 import select_view_default from "../_components/select-view/select-view.js";
@@ -143,11 +144,12 @@ var cascader_vue_vue_type_script_lang_default = defineComponent({
 		"blur": (_ev) => true
 	},
 	setup(props, { emit, slots }) {
-		const { options, checkStrictly, loadMore, formatLabel, modelValue, disabled, valueKey, expandTrigger, expandChild, pathMode, multiple } = toRefs(props);
+		const { options, checkStrictly, loadMore, formatLabel, modelValue, disabled, valueKey, expandTrigger, expandChild, pathMode, multiple, allowClear } = toRefs(props);
 		const _value = ref(props.defaultValue);
 		const _inputValue = ref(props.defaultInputValue);
 		const _popupVisible = ref(props.defaultPopupVisible);
 		const { mergedDisabled, eventHandlers } = useFormItem({ disabled });
+		const { mergedAllowClear } = useAllowClear(allowClear);
 		watch(modelValue, (value) => {
 			if (isUndefined(value) || isNull(value)) _value.value = props.multiple ? [] : void 0;
 		});
@@ -445,6 +447,7 @@ var cascader_vue_vue_type_script_lang_default = defineComponent({
 			handleBlur,
 			handleRemove,
 			mergedDisabled,
+			mergedAllowClear,
 			handleKeyDown,
 			totalLevel
 		};

package/es/cascader/index.d.ts

@@ -234,6 +234,7 @@ declare const Cascader: {
         handleBlur: (e: FocusEvent) => void;
         handleRemove: (key: string) => void;
         mergedDisabled: import("vue").ComputedRef<boolean>;
+        mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
         handleKeyDown: (event: KeyboardEvent) => void;
         totalLevel: import("vue").Ref<number, number>;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
@@ -1286,6 +1287,7 @@ declare const Cascader: {
         handleBlur: (e: FocusEvent) => void;
         handleRemove: (key: string) => void;
         mergedDisabled: import("vue").ComputedRef<boolean>;
+        mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
         handleKeyDown: (event: KeyboardEvent) => void;
         totalLevel: import("vue").Ref<number, number>;
     }, {}, {}, {}, {
@@ -1546,6 +1548,7 @@ declare const Cascader: {
     handleBlur: (e: FocusEvent) => void;
     handleRemove: (key: string) => void;
     mergedDisabled: import("vue").ComputedRef<boolean>;
+    mergedAllowClear: import("vue").ComputedRef<boolean | undefined>;
     handleKeyDown: (event: KeyboardEvent) => void;
     totalLevel: import("vue").Ref<number, number>;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {

package/es/color-picker/color-picker.d.ts

@@ -1,41 +1,57 @@
 import { PropType } from 'vue';
 import { Size } from '../_utils/constant';
 import { TriggerProps } from '../trigger';
+import { ColorFormat, ColorModes, ColorObject, ColorPickerChangeTrigger, LegacyFormat, RecentColorsValue } from './interface';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+    borderless: BooleanConstructor;
+    clearable: BooleanConstructor;
+    colorModes: {
+        type: PropType<ColorModes>;
+        default: () => string[];
+    };
+    enableMultipleGradient: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    value: StringConstructor;
     modelValue: StringConstructor;
     defaultValue: {
         type: StringConstructor;
+        default: string;
     };
     format: {
-        type: PropType<"hex" | "rgb">;
+        type: PropType<ColorFormat | LegacyFormat>;
+        default: string;
     };
     size: {
-        type: PropType<Size>;
+        type: PropType<Size | "small" | "medium" | "large">;
         default: string;
     };
-    showText: {
+    enableAlpha: BooleanConstructor;
+    showPrimaryColorPreview: {
         type: BooleanConstructor;
         default: boolean;
     };
-    showHistory: {
-        type: BooleanConstructor;
-        default: boolean;
+    inputProps: {
+        type: PropType<Record<string, unknown>>;
     };
-    showPreset: {
-        type: BooleanConstructor;
-        default: boolean;
+    recentColors: {
+        type: PropType<RecentColorsValue>;
+        default: undefined;
     };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
+    defaultRecentColors: {
+        type: PropType<RecentColorsValue>;
+        default: () => never[];
     };
-    disabledAlpha: {
-        type: BooleanConstructor;
-        default: boolean;
+    swatchColors: {
+        type: PropType<string[] | null>;
+        default: undefined;
     };
-    hideTrigger: {
+    disabled: {
         type: BooleanConstructor;
+        default: boolean;
     };
+    hideTrigger: BooleanConstructor;
     triggerProps: {
         type: PropType<Partial<TriggerProps>>;
     };
@@ -44,47 +60,79 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
     presetColors: {
         type: PropType<string[]>;
-        default: () => string[];
+    };
+    showText: BooleanConstructor;
+    showHistory: BooleanConstructor;
+    showPreset: BooleanConstructor;
+    disabledAlpha: BooleanConstructor;
+    selectInputProps: {
+        type: PropType<Record<string, unknown>>;
     };
 }>, () => import("vue/jsx-runtime").JSX.Element, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
     'update:modelValue': (_value: string) => true;
-    change: (_value: string) => true;
+    'update:value': (_value: string) => true;
+    change: (_value: string, _context: {
+        color: ColorObject;
+        trigger: ColorPickerChangeTrigger;
+    }) => true;
     'popup-visible-change': (_visible: boolean, _value: string) => true;
+    clear: (_context: {
+        e: MouseEvent;
+    }) => true;
+    'palette-bar-change': (_context: {
+        color: ColorObject;
+    }) => true;
+    'recent-colors-change': (_value: string[]) => true;
 }, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+    borderless: BooleanConstructor;
+    clearable: BooleanConstructor;
+    colorModes: {
+        type: PropType<ColorModes>;
+        default: () => string[];
+    };
+    enableMultipleGradient: {
+        type: BooleanConstructor;
+        default: boolean;
+    };
+    value: StringConstructor;
     modelValue: StringConstructor;
     defaultValue: {
         type: StringConstructor;
+        default: string;
     };
     format: {
-        type: PropType<"hex" | "rgb">;
+        type: PropType<ColorFormat | LegacyFormat>;
+        default: string;
     };
     size: {
-        type: PropType<Size>;
+        type: PropType<Size | "small" | "medium" | "large">;
         default: string;
     };
-    showText: {
+    enableAlpha: BooleanConstructor;
+    showPrimaryColorPreview: {
         type: BooleanConstructor;
         default: boolean;
     };
-    showHistory: {
-        type: BooleanConstructor;
-        default: boolean;
+    inputProps: {
+        type: PropType<Record<string, unknown>>;
     };
-    showPreset: {
-        type: BooleanConstructor;
-        default: boolean;
+    recentColors: {
+        type: PropType<RecentColorsValue>;
+        default: undefined;
     };
-    disabled: {
-        type: BooleanConstructor;
-        default: boolean;
+    defaultRecentColors: {
+        type: PropType<RecentColorsValue>;
+        default: () => never[];
     };
-    disabledAlpha: {
-        type: BooleanConstructor;
-        default: boolean;
+    swatchColors: {
+        type: PropType<string[] | null>;
+        default: undefined;
     };
-    hideTrigger: {
+    disabled: {
         type: BooleanConstructor;
+        default: boolean;
     };
+    hideTrigger: BooleanConstructor;
     triggerProps: {
         type: PropType<Partial<TriggerProps>>;
     };
@@ -93,20 +141,47 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
     presetColors: {
         type: PropType<string[]>;
-        default: () => string[];
+    };
+    showText: BooleanConstructor;
+    showHistory: BooleanConstructor;
+    showPreset: BooleanConstructor;
+    disabledAlpha: BooleanConstructor;
+    selectInputProps: {
+        type: PropType<Record<string, unknown>>;
     };
 }>> & Readonly<{
-    onChange?: ((_value: string) => any) | undefined;
+    onChange?: ((_value: string, _context: {
+        color: ColorObject;
+        trigger: ColorPickerChangeTrigger;
+    }) => any) | undefined;
+    onClear?: ((_context: {
+        e: MouseEvent;
+    }) => any) | undefined;
     "onUpdate:modelValue"?: ((_value: string) => any) | undefined;
+    "onUpdate:value"?: ((_value: string) => any) | undefined;
     "onPopup-visible-change"?: ((_visible: boolean, _value: string) => any) | undefined;
+    "onPalette-bar-change"?: ((_context: {
+        color: ColorObject;
+    }) => any) | undefined;
+    "onRecent-colors-change"?: ((_value: string[]) => any) | undefined;
 }>, {
     size: "mini" | "small" | "medium" | "large";
     disabled: boolean;
-    disabledAlpha: boolean;
+    defaultValue: string;
+    enableAlpha: boolean;
+    colorModes: ColorModes;
+    enableMultipleGradient: boolean;
+    showPrimaryColorPreview: boolean;
+    format: ColorFormat | LegacyFormat;
+    recentColors: RecentColorsValue;
+    swatchColors: string[] | null;
+    borderless: boolean;
+    clearable: boolean;
+    hideTrigger: boolean;
+    showText: boolean;
     showHistory: boolean;
     showPreset: boolean;
-    presetColors: string[];
-    showText: boolean;
-    hideTrigger: boolean;
+    disabledAlpha: boolean;
+    defaultRecentColors: RecentColorsValue;
 }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;