@element-plus/nightly 0.0.20241128 → 0.0.20241129

package/es/components/input-tag/src/composables/use-drag-tag.mjs

@@ -0,0 +1,92 @@
+import { shallowRef, ref } from 'vue';
+import { getStyle, setStyle } from '../../../../utils/dom/style.mjs';
+import { useNamespace } from '../../../../hooks/use-namespace/index.mjs';
+import { isUndefined } from '../../../../utils/types.mjs';
+
+function useDragTag({
+  wrapperRef,
+  handleDragged,
+  afterDragged
+}) {
+  const ns = useNamespace("input-tag");
+  const dropIndicatorRef = shallowRef();
+  const showDropIndicator = ref(false);
+  let draggingIndex;
+  let draggingTag;
+  let dropIndex;
+  let dropType;
+  function getTagClassName(index) {
+    return `.${ns.e("inner")} .${ns.namespace.value}-tag:nth-child(${index + 1})`;
+  }
+  function handleDragStart(event, index) {
+    draggingIndex = index;
+    draggingTag = wrapperRef.value.querySelector(getTagClassName(index));
+    if (draggingTag) {
+      draggingTag.style.opacity = "0.5";
+    }
+    event.dataTransfer.effectAllowed = "move";
+  }
+  function handleDragOver(event, index) {
+    dropIndex = index;
+    event.preventDefault();
+    event.dataTransfer.dropEffect = "move";
+    if (isUndefined(draggingIndex) || draggingIndex === index) {
+      showDropIndicator.value = false;
+      return;
+    }
+    const dropPosition = wrapperRef.value.querySelector(getTagClassName(index)).getBoundingClientRect();
+    const dropPrev = !(draggingIndex + 1 === index);
+    const dropNext = !(draggingIndex - 1 === index);
+    const distance = event.clientX - dropPosition.left;
+    const prevPercent = dropPrev ? dropNext ? 0.5 : 1 : -1;
+    const nextPercent = dropNext ? dropPrev ? 0.5 : 0 : 1;
+    if (distance <= dropPosition.width * prevPercent) {
+      dropType = "before";
+    } else if (distance > dropPosition.width * nextPercent) {
+      dropType = "after";
+    } else {
+      dropType = void 0;
+    }
+    const innerEl = wrapperRef.value.querySelector(`.${ns.e("inner")}`);
+    const innerPosition = innerEl.getBoundingClientRect();
+    const gap = Number.parseFloat(getStyle(innerEl, "gap")) / 2;
+    const indicatorTop = dropPosition.top - innerPosition.top;
+    let indicatorLeft = -9999;
+    if (dropType === "before") {
+      indicatorLeft = Math.max(dropPosition.left - innerPosition.left - gap, Math.floor(-gap / 2));
+    } else if (dropType === "after") {
+      const left = dropPosition.right - innerPosition.left;
+      indicatorLeft = left + (innerPosition.width === left ? Math.floor(gap / 2) : gap);
+    }
+    setStyle(dropIndicatorRef.value, {
+      top: `${indicatorTop}px`,
+      left: `${indicatorLeft}px`
+    });
+    showDropIndicator.value = !!dropType;
+  }
+  function handleDragEnd(event) {
+    event.preventDefault();
+    if (draggingTag) {
+      draggingTag.style.opacity = "";
+    }
+    if (dropType && !isUndefined(draggingIndex) && !isUndefined(dropIndex) && draggingIndex !== dropIndex) {
+      handleDragged(draggingIndex, dropIndex, dropType);
+    }
+    showDropIndicator.value = false;
+    draggingIndex = void 0;
+    draggingTag = null;
+    dropIndex = void 0;
+    dropType = void 0;
+    afterDragged == null ? void 0 : afterDragged();
+  }
+  return {
+    dropIndicatorRef,
+    showDropIndicator,
+    handleDragStart,
+    handleDragOver,
+    handleDragEnd
+  };
+}
+
+export { useDragTag };
+//# sourceMappingURL=use-drag-tag.mjs.map

package/es/components/input-tag/src/composables/use-drag-tag.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-drag-tag.mjs","sources":["../../../../../../../packages/components/input-tag/src/composables/use-drag-tag.ts"],"sourcesContent":["import { type ShallowRef, ref, shallowRef } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { getStyle, isUndefined, setStyle } from '@element-plus/utils'\n\ntype DropType = 'before' | 'after'\n\ninterface UseDragTagOptions {\n  wrapperRef: ShallowRef<HTMLElement | undefined>\n  handleDragged: (\n    draggingIndex: number,\n    dropIndex: number,\n    type: DropType\n  ) => void\n  afterDragged?: () => void\n}\n\nexport function useDragTag({\n  wrapperRef,\n  handleDragged,\n  afterDragged,\n}: UseDragTagOptions) {\n  const ns = useNamespace('input-tag')\n  const dropIndicatorRef = shallowRef<HTMLElement>()\n  const showDropIndicator = ref(false)\n\n  let draggingIndex: number | undefined\n  let draggingTag: HTMLElement | null\n  let dropIndex: number | undefined\n  let dropType: DropType | undefined\n\n  function getTagClassName(index: number) {\n    return `.${ns.e('inner')} .${ns.namespace.value}-tag:nth-child(${\n      index + 1\n    })`\n  }\n\n  function handleDragStart(event: DragEvent, index: number) {\n    draggingIndex = index\n    draggingTag = wrapperRef.value!.querySelector<HTMLElement>(\n      getTagClassName(index)\n    )\n\n    if (draggingTag) {\n      draggingTag.style.opacity = '0.5'\n    }\n    event.dataTransfer!.effectAllowed = 'move'\n  }\n\n  function handleDragOver(event: DragEvent, index: number) {\n    dropIndex = index\n    event.preventDefault()\n    event.dataTransfer!.dropEffect = 'move'\n\n    if (isUndefined(draggingIndex) || draggingIndex === index) {\n      showDropIndicator.value = false\n      return\n    }\n\n    const dropPosition = wrapperRef\n      .value!.querySelector<HTMLElement>(getTagClassName(index))!\n      .getBoundingClientRect()\n    const dropPrev = !(draggingIndex + 1 === index)\n    const dropNext = !(draggingIndex - 1 === index)\n    const distance = event.clientX - dropPosition.left\n    const prevPercent = dropPrev ? (dropNext ? 0.5 : 1) : -1\n    const nextPercent = dropNext ? (dropPrev ? 0.5 : 0) : 1\n\n    if (distance <= dropPosition.width * prevPercent) {\n      dropType = 'before'\n    } else if (distance > dropPosition.width * nextPercent) {\n      dropType = 'after'\n    } else {\n      dropType = undefined\n    }\n\n    const innerEl = wrapperRef.value!.querySelector<HTMLElement>(\n      `.${ns.e('inner')}`\n    )!\n    const innerPosition = innerEl.getBoundingClientRect()\n    const gap = Number.parseFloat(getStyle(innerEl, 'gap')) / 2\n\n    const indicatorTop = dropPosition.top - innerPosition.top\n    let indicatorLeft = -9999\n\n    if (dropType === 'before') {\n      indicatorLeft = Math.max(\n        dropPosition.left - innerPosition.left - gap,\n        Math.floor(-gap / 2)\n      )\n    } else if (dropType === 'after') {\n      const left = dropPosition.right - innerPosition.left\n      indicatorLeft =\n        left + (innerPosition.width === left ? Math.floor(gap / 2) : gap)\n    }\n\n    setStyle(dropIndicatorRef.value!, {\n      top: `${indicatorTop}px`,\n      left: `${indicatorLeft}px`,\n    })\n    showDropIndicator.value = !!dropType\n  }\n\n  function handleDragEnd(event: DragEvent) {\n    event.preventDefault()\n\n    if (draggingTag) {\n      draggingTag.style.opacity = ''\n    }\n\n    if (\n      dropType &&\n      !isUndefined(draggingIndex) &&\n      !isUndefined(dropIndex) &&\n      draggingIndex !== dropIndex\n    ) {\n      handleDragged(draggingIndex, dropIndex, dropType)\n    }\n\n    showDropIndicator.value = false\n    draggingIndex = undefined\n    draggingTag = null\n    dropIndex = undefined\n    dropType = undefined\n    afterDragged?.()\n  }\n\n  return {\n    dropIndicatorRef,\n    showDropIndicator,\n    handleDragStart,\n    handleDragOver,\n    handleDragEnd,\n  }\n}\n"],"names":[],"mappings":"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"}

package/es/components/input-tag/src/composables/use-hovering.d.ts

@@ -0,0 +1,5 @@
+export declare function useHovering(): {
+    hovering: import("vue").Ref<boolean>;
+    handleMouseEnter: () => void;
+    handleMouseLeave: () => void;
+};

package/es/components/input-tag/src/composables/use-hovering.mjs

@@ -0,0 +1,19 @@
+import { ref } from 'vue';
+
+function useHovering() {
+  const hovering = ref(false);
+  const handleMouseEnter = () => {
+    hovering.value = true;
+  };
+  const handleMouseLeave = () => {
+    hovering.value = false;
+  };
+  return {
+    hovering,
+    handleMouseEnter,
+    handleMouseLeave
+  };
+}
+
+export { useHovering };
+//# sourceMappingURL=use-hovering.mjs.map

package/es/components/input-tag/src/composables/use-hovering.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-hovering.mjs","sources":["../../../../../../../packages/components/input-tag/src/composables/use-hovering.ts"],"sourcesContent":["import { ref } from 'vue'\n\nexport function useHovering() {\n  const hovering = ref(false)\n\n  const handleMouseEnter = () => {\n    hovering.value = true\n  }\n\n  const handleMouseLeave = () => {\n    hovering.value = false\n  }\n\n  return {\n    hovering,\n    handleMouseEnter,\n    handleMouseLeave,\n  }\n}\n"],"names":[],"mappings":";;AACO,SAAS,WAAW,GAAG;AAC9B,EAAE,MAAM,QAAQ,GAAG,GAAG,CAAC,KAAK,CAAC,CAAC;AAC9B,EAAE,MAAM,gBAAgB,GAAG,MAAM;AACjC,IAAI,QAAQ,CAAC,KAAK,GAAG,IAAI,CAAC;AAC1B,GAAG,CAAC;AACJ,EAAE,MAAM,gBAAgB,GAAG,MAAM;AACjC,IAAI,QAAQ,CAAC,KAAK,GAAG,KAAK,CAAC;AAC3B,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,QAAQ;AACZ,IAAI,gBAAgB;AACpB,IAAI,gBAAgB;AACpB,GAAG,CAAC;AACJ;;;;"}

package/es/components/input-tag/src/composables/use-input-tag-dom.d.ts

@@ -0,0 +1,58 @@
+import type { ComputedRef, Ref, StyleValue } from 'vue';
+import type { ComponentSize } from '@element-plus/nightly/es/constants';
+import type { InputTagProps } from '../input-tag';
+interface UseInputTagDomOptions {
+    props: InputTagProps;
+    isFocused: Ref<boolean>;
+    hovering: Ref<boolean>;
+    disabled: ComputedRef<boolean>;
+    inputValue: Ref<string | undefined>;
+    size: ComputedRef<ComponentSize>;
+    validateState: ComputedRef<string>;
+    validateIcon: ComputedRef<boolean>;
+    needStatusIcon: ComputedRef<boolean>;
+}
+export declare function useInputTagDom({ props, isFocused, hovering, disabled, inputValue, size, validateState, validateIcon, needStatusIcon, }: UseInputTagDomOptions): {
+    ns: {
+        namespace: ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string) => string;
+        m: (modifier?: string) => string;
+        be: (blockSuffix?: string, element?: string) => string;
+        em: (element?: string, modifier?: string) => string;
+        bm: (blockSuffix?: string, modifier?: string) => string;
+        bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
+        is: {
+            (name: string, state: boolean | undefined): string;
+            (name: string): string;
+        };
+        cssVar: (object: Record<string, string>) => Record<string, string>;
+        cssVarName: (name: string) => string;
+        cssVarBlock: (object: Record<string, string>) => Record<string, string>;
+        cssVarBlockName: (name: string) => string;
+    };
+    nsInput: {
+        namespace: ComputedRef<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string) => string;
+        m: (modifier?: string) => string;
+        be: (blockSuffix?: string, element?: string) => string;
+        em: (element?: string, modifier?: string) => string;
+        bm: (blockSuffix?: string, modifier?: string) => string;
+        bem: (blockSuffix?: string, element?: string, modifier?: string) => string;
+        is: {
+            (name: string, state: boolean | undefined): string;
+            (name: string): string;
+        };
+        cssVar: (object: Record<string, string>) => Record<string, string>;
+        cssVarName: (name: string) => string;
+        cssVarBlock: (object: Record<string, string>) => Record<string, string>;
+        cssVarBlockName: (name: string) => string;
+    };
+    containerKls: ComputedRef<unknown[]>;
+    containerStyle: ComputedRef<StyleValue>;
+    innerKls: ComputedRef<string[]>;
+    showClear: ComputedRef<boolean | "" | 0 | undefined>;
+    showSuffix: ComputedRef<boolean | "" | import("vue").Slot>;
+};
+export {};

package/es/components/input-tag/src/composables/use-input-tag-dom.mjs

@@ -0,0 +1,57 @@
+import { useAttrs, useSlots, computed } from 'vue';
+import { useNamespace } from '../../../../hooks/use-namespace/index.mjs';
+
+function useInputTagDom({
+  props,
+  isFocused,
+  hovering,
+  disabled,
+  inputValue,
+  size,
+  validateState,
+  validateIcon,
+  needStatusIcon
+}) {
+  const attrs = useAttrs();
+  const slots = useSlots();
+  const ns = useNamespace("input-tag");
+  const nsInput = useNamespace("input");
+  const containerKls = computed(() => [
+    ns.b(),
+    ns.is("focused", isFocused.value),
+    ns.is("hovering", hovering.value),
+    ns.is("disabled", disabled.value),
+    ns.m(size.value),
+    ns.e("wrapper"),
+    attrs.class
+  ]);
+  const containerStyle = computed(() => [attrs.style]);
+  const innerKls = computed(() => {
+    var _a, _b;
+    return [
+      ns.e("inner"),
+      ns.is("draggable", props.draggable),
+      ns.is("left-space", !((_a = props.modelValue) == null ? void 0 : _a.length) && !slots.prefix),
+      ns.is("right-space", !((_b = props.modelValue) == null ? void 0 : _b.length) && !showSuffix.value)
+    ];
+  });
+  const showClear = computed(() => {
+    var _a;
+    return props.clearable && !disabled.value && !props.readonly && (((_a = props.modelValue) == null ? void 0 : _a.length) || inputValue.value) && (isFocused.value || hovering.value);
+  });
+  const showSuffix = computed(() => {
+    return slots.suffix || showClear.value || validateState.value && validateIcon.value && needStatusIcon.value;
+  });
+  return {
+    ns,
+    nsInput,
+    containerKls,
+    containerStyle,
+    innerKls,
+    showClear,
+    showSuffix
+  };
+}
+
+export { useInputTagDom };
+//# sourceMappingURL=use-input-tag-dom.mjs.map

package/es/components/input-tag/src/composables/use-input-tag-dom.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-input-tag-dom.mjs","sources":["../../../../../../../packages/components/input-tag/src/composables/use-input-tag-dom.ts"],"sourcesContent":["import { computed, useAttrs, useSlots } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport type { ComputedRef, Ref, StyleValue } from 'vue'\nimport type { ComponentSize } from '@element-plus/constants'\nimport type { InputTagProps } from '../input-tag'\n\ninterface UseInputTagDomOptions {\n  props: InputTagProps\n  isFocused: Ref<boolean>\n  hovering: Ref<boolean>\n  disabled: ComputedRef<boolean>\n  inputValue: Ref<string | undefined>\n  size: ComputedRef<ComponentSize>\n  validateState: ComputedRef<string>\n  validateIcon: ComputedRef<boolean>\n  needStatusIcon: ComputedRef<boolean>\n}\n\nexport function useInputTagDom({\n  props,\n  isFocused,\n  hovering,\n  disabled,\n  inputValue,\n  size,\n  validateState,\n  validateIcon,\n  needStatusIcon,\n}: UseInputTagDomOptions) {\n  const attrs = useAttrs()\n  const slots = useSlots()\n  const ns = useNamespace('input-tag')\n  const nsInput = useNamespace('input')\n\n  const containerKls = computed(() => [\n    ns.b(),\n    ns.is('focused', isFocused.value),\n    ns.is('hovering', hovering.value),\n    ns.is('disabled', disabled.value),\n    ns.m(size.value),\n    ns.e('wrapper'),\n    attrs.class,\n  ])\n  const containerStyle = computed<StyleValue>(() => [attrs.style as StyleValue])\n  const innerKls = computed(() => [\n    ns.e('inner'),\n    ns.is('draggable', props.draggable),\n    ns.is('left-space', !props.modelValue?.length && !slots.prefix),\n    ns.is('right-space', !props.modelValue?.length && !showSuffix.value),\n  ])\n  const showClear = computed(() => {\n    return (\n      props.clearable &&\n      !disabled.value &&\n      !props.readonly &&\n      (props.modelValue?.length || inputValue.value) &&\n      (isFocused.value || hovering.value)\n    )\n  })\n  const showSuffix = computed(() => {\n    return (\n      slots.suffix ||\n      showClear.value ||\n      (validateState.value && validateIcon.value && needStatusIcon.value)\n    )\n  })\n\n  return {\n    ns,\n    nsInput,\n    containerKls,\n    containerStyle,\n    innerKls,\n    showClear,\n    showSuffix,\n  }\n}\n"],"names":[],"mappings":"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"}

package/es/components/input-tag/src/composables/use-input-tag.d.ts

@@ -0,0 +1,33 @@
+import { type EmitFn } from '@element-plus/nightly/es/utils';
+import { type FormItemContext } from '@element-plus/nightly/es/components/form';
+import type { InputTagEmits, InputTagProps } from '../input-tag';
+interface UseInputTagOptions {
+    props: InputTagProps;
+    emit: EmitFn<InputTagEmits>;
+    formItem?: FormItemContext;
+}
+export declare function useInputTag({ props, emit, formItem }: UseInputTagOptions): {
+    inputRef: import("vue").ShallowRef<HTMLInputElement | undefined>;
+    wrapperRef: import("vue").ShallowRef<HTMLElement | undefined>;
+    isFocused: import("vue").Ref<boolean>;
+    isComposing: import("vue").Ref<boolean>;
+    inputValue: import("vue").Ref<string | undefined>;
+    size: import("vue").ComputedRef<"" | "small" | "default" | "large">;
+    tagSize: import("vue").ComputedRef<"default" | "small">;
+    placeholder: import("vue").ComputedRef<string | undefined>;
+    closable: import("vue").ComputedRef<boolean>;
+    disabled: import("vue").ComputedRef<boolean>;
+    inputLimit: import("vue").ComputedRef<boolean>;
+    handleDragged: (draggingIndex: number, dropIndex: number, type: "before" | "after") => void;
+    handleInput: (event: Event) => void;
+    handleKeydown: (event: KeyboardEvent) => void;
+    handleAddTag: () => void;
+    handleRemoveTag: (index: number) => void;
+    handleClear: () => void;
+    handleCompositionStart: (event: CompositionEvent) => void;
+    handleCompositionUpdate: (event: CompositionEvent) => void;
+    handleCompositionEnd: (event: CompositionEvent) => void;
+    focus: () => void;
+    blur: () => void;
+};
+export {};

package/es/components/input-tag/src/composables/use-input-tag.mjs

@@ -0,0 +1,153 @@
+import { shallowRef, ref, computed, watch } from 'vue';
+import { useFormDisabled, useFormSize } from '../../../form/src/hooks/use-form-common-props.mjs';
+import { isUndefined } from '../../../../utils/types.mjs';
+import { INPUT_EVENT, UPDATE_MODEL_EVENT, CHANGE_EVENT } from '../../../../constants/event.mjs';
+import { EVENT_CODE } from '../../../../constants/aria.mjs';
+import { useFocusController } from '../../../../hooks/use-focus-controller/index.mjs';
+import { debugWarn } from '../../../../utils/error.mjs';
+import { useComposition } from '../../../../hooks/use-composition/index.mjs';
+
+function useInputTag({ props, emit, formItem }) {
+  const disabled = useFormDisabled();
+  const size = useFormSize();
+  const inputRef = shallowRef();
+  const inputValue = ref();
+  const tagSize = computed(() => {
+    return ["small"].includes(size.value) ? "small" : "default";
+  });
+  const placeholder = computed(() => {
+    var _a;
+    return ((_a = props.modelValue) == null ? void 0 : _a.length) ? void 0 : props.placeholder;
+  });
+  const closable = computed(() => !(props.readonly || disabled.value));
+  const inputLimit = computed(() => {
+    var _a, _b;
+    return isUndefined(props.max) ? false : ((_b = (_a = props.modelValue) == null ? void 0 : _a.length) != null ? _b : 0) >= props.max;
+  });
+  const handleInput = (event) => {
+    if (inputLimit.value) {
+      inputValue.value = void 0;
+      return;
+    }
+    if (isComposing.value)
+      return;
+    emit(INPUT_EVENT, event.target.value);
+  };
+  const handleKeydown = (event) => {
+    var _a;
+    switch (event.code) {
+      case props.trigger:
+        event.preventDefault();
+        event.stopPropagation();
+        handleAddTag();
+        break;
+      case EVENT_CODE.numpadEnter:
+        if (props.trigger === EVENT_CODE.enter) {
+          event.preventDefault();
+          event.stopPropagation();
+          handleAddTag();
+        }
+        break;
+      case EVENT_CODE.backspace:
+        if (!inputValue.value && ((_a = props.modelValue) == null ? void 0 : _a.length)) {
+          event.preventDefault();
+          event.stopPropagation();
+          handleRemoveTag(props.modelValue.length - 1);
+        }
+        break;
+    }
+  };
+  const handleAddTag = () => {
+    var _a, _b;
+    const value = (_a = inputValue.value) == null ? void 0 : _a.trim();
+    if (!value || inputLimit.value)
+      return;
+    const list = [...(_b = props.modelValue) != null ? _b : [], value];
+    emit(UPDATE_MODEL_EVENT, list);
+    emit(CHANGE_EVENT, list);
+    emit("add-tag", value);
+    inputValue.value = void 0;
+  };
+  const handleRemoveTag = (index) => {
+    var _a;
+    const value = ((_a = props.modelValue) != null ? _a : []).slice();
+    const [item] = value.splice(index, 1);
+    emit(UPDATE_MODEL_EVENT, value);
+    emit(CHANGE_EVENT, value);
+    emit("remove-tag", item);
+  };
+  const handleClear = () => {
+    inputValue.value = void 0;
+    emit(UPDATE_MODEL_EVENT, void 0);
+    emit(CHANGE_EVENT, void 0);
+    emit("clear");
+  };
+  const handleDragged = (draggingIndex, dropIndex, type) => {
+    var _a;
+    const value = ((_a = props.modelValue) != null ? _a : []).slice();
+    const [draggedItem] = value.splice(draggingIndex, 1);
+    const step = dropIndex > draggingIndex && type === "before" ? -1 : dropIndex < draggingIndex && type === "after" ? 1 : 0;
+    value.splice(dropIndex + step, 0, draggedItem);
+    emit(UPDATE_MODEL_EVENT, value);
+    emit(CHANGE_EVENT, value);
+  };
+  const focus = () => {
+    var _a;
+    (_a = inputRef.value) == null ? void 0 : _a.focus();
+  };
+  const blur = () => {
+    var _a;
+    (_a = inputRef.value) == null ? void 0 : _a.blur();
+  };
+  const { wrapperRef, isFocused } = useFocusController(inputRef, {
+    beforeFocus() {
+      return disabled.value;
+    },
+    afterBlur() {
+      var _a;
+      handleAddTag();
+      if (props.validateEvent) {
+        (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, "blur").catch((err) => debugWarn(err));
+      }
+    }
+  });
+  const {
+    isComposing,
+    handleCompositionStart,
+    handleCompositionUpdate,
+    handleCompositionEnd
+  } = useComposition({ afterComposition: handleInput });
+  watch(() => props.modelValue, () => {
+    var _a;
+    if (props.validateEvent) {
+      (_a = formItem == null ? void 0 : formItem.validate) == null ? void 0 : _a.call(formItem, CHANGE_EVENT).catch((err) => debugWarn(err));
+    }
+  });
+  return {
+    inputRef,
+    wrapperRef,
+    isFocused,
+    isComposing,
+    inputValue,
+    size,
+    tagSize,
+    placeholder,
+    closable,
+    disabled,
+    inputLimit,
+    handleDragged,
+    handleInput,
+    handleKeydown,
+    handleAddTag,
+    handleRemoveTag,
+    handleClear,
+    handleCompositionStart,
+    handleCompositionUpdate,
+    handleCompositionEnd,
+    focus,
+    blur
+  };
+}
+
+export { useInputTag };
+//# sourceMappingURL=use-input-tag.mjs.map

package/es/components/input-tag/src/composables/use-input-tag.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-input-tag.mjs","sources":["../../../../../../../packages/components/input-tag/src/composables/use-input-tag.ts"],"sourcesContent":["import { computed, ref, shallowRef, watch } from 'vue'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  INPUT_EVENT,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { type EmitFn, debugWarn, isUndefined } from '@element-plus/utils'\nimport { useComposition, useFocusController } from '@element-plus/hooks'\nimport {\n  type FormItemContext,\n  useFormDisabled,\n  useFormSize,\n} from '@element-plus/components/form'\nimport type { InputTagEmits, InputTagProps } from '../input-tag'\n\ninterface UseInputTagOptions {\n  props: InputTagProps\n  emit: EmitFn<InputTagEmits>\n  formItem?: FormItemContext\n}\n\nexport function useInputTag({ props, emit, formItem }: UseInputTagOptions) {\n  const disabled = useFormDisabled()\n  const size = useFormSize()\n\n  const inputRef = shallowRef<HTMLInputElement>()\n  const inputValue = ref<string>()\n\n  const tagSize = computed(() => {\n    return ['small'].includes(size.value) ? 'small' : 'default'\n  })\n  const placeholder = computed(() => {\n    return props.modelValue?.length ? undefined : props.placeholder\n  })\n  const closable = computed(() => !(props.readonly || disabled.value))\n  const inputLimit = computed(() => {\n    return isUndefined(props.max)\n      ? false\n      : (props.modelValue?.length ?? 0) >= props.max\n  })\n\n  const handleInput = (event: Event) => {\n    if (inputLimit.value) {\n      inputValue.value = undefined\n      return\n    }\n\n    if (isComposing.value) return\n    emit(INPUT_EVENT, (event.target as HTMLInputElement).value)\n  }\n\n  const handleKeydown = (event: KeyboardEvent) => {\n    switch (event.code) {\n      case props.trigger:\n        event.preventDefault()\n        event.stopPropagation()\n        handleAddTag()\n        break\n      case EVENT_CODE.numpadEnter:\n        if (props.trigger === EVENT_CODE.enter) {\n          event.preventDefault()\n          event.stopPropagation()\n          handleAddTag()\n        }\n        break\n      case EVENT_CODE.backspace:\n        if (!inputValue.value && props.modelValue?.length) {\n          event.preventDefault()\n          event.stopPropagation()\n          handleRemoveTag(props.modelValue.length - 1)\n        }\n        break\n    }\n  }\n\n  const handleAddTag = () => {\n    const value = inputValue.value?.trim()\n    if (!value || inputLimit.value) return\n    const list = [...(props.modelValue ?? []), value]\n\n    emit(UPDATE_MODEL_EVENT, list)\n    emit(CHANGE_EVENT, list)\n    emit('add-tag', value)\n    inputValue.value = undefined\n  }\n\n  const handleRemoveTag = (index: number) => {\n    const value = (props.modelValue ?? []).slice()\n    const [item] = value.splice(index, 1)\n\n    emit(UPDATE_MODEL_EVENT, value)\n    emit(CHANGE_EVENT, value)\n    emit('remove-tag', item)\n  }\n\n  const handleClear = () => {\n    inputValue.value = undefined\n    emit(UPDATE_MODEL_EVENT, undefined)\n    emit(CHANGE_EVENT, undefined)\n    emit('clear')\n  }\n\n  const handleDragged = (\n    draggingIndex: number,\n    dropIndex: number,\n    type: 'before' | 'after'\n  ) => {\n    const value = (props.modelValue ?? []).slice()\n    const [draggedItem] = value.splice(draggingIndex, 1)\n    const step =\n      dropIndex > draggingIndex && type === 'before'\n        ? -1\n        : dropIndex < draggingIndex && type === 'after'\n        ? 1\n        : 0\n\n    value.splice(dropIndex + step, 0, draggedItem)\n    emit(UPDATE_MODEL_EVENT, value)\n    emit(CHANGE_EVENT, value)\n  }\n\n  const focus = () => {\n    inputRef.value?.focus()\n  }\n\n  const blur = () => {\n    inputRef.value?.blur()\n  }\n\n  const { wrapperRef, isFocused } = useFocusController(inputRef, {\n    beforeFocus() {\n      return disabled.value\n    },\n    afterBlur() {\n      handleAddTag()\n      if (props.validateEvent) {\n        formItem?.validate?.('blur').catch((err) => debugWarn(err))\n      }\n    },\n  })\n\n  const {\n    isComposing,\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n  } = useComposition({ afterComposition: handleInput })\n\n  watch(\n    () => props.modelValue,\n    () => {\n      if (props.validateEvent) {\n        formItem?.validate?.(CHANGE_EVENT).catch((err) => debugWarn(err))\n      }\n    }\n  )\n\n  return {\n    inputRef,\n    wrapperRef,\n    isFocused,\n    isComposing,\n    inputValue,\n    size,\n    tagSize,\n    placeholder,\n    closable,\n    disabled,\n    inputLimit,\n    handleDragged,\n    handleInput,\n    handleKeydown,\n    handleAddTag,\n    handleRemoveTag,\n    handleClear,\n    handleCompositionStart,\n    handleCompositionUpdate,\n    handleCompositionEnd,\n    focus,\n    blur,\n  }\n}\n"],"names":[],"mappings":"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"}

package/es/components/input-tag/src/input-tag.d.ts

@@ -0,0 +1,60 @@
+import type { ExtractPropTypes } from 'vue';
+export declare const inputTagProps: {
+    readonly modelValue: {
+        readonly type: import("vue").PropType<string[]>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly max: NumberConstructor;
+    readonly tagType: {
+        readonly default: "info";
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<StringConstructor, "success" | "warning" | "info" | "primary" | "danger", unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        readonly __epPropKey: true;
+    };
+    readonly tagEffect: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, "dark" | "light" | "plain", unknown, "light", boolean>;
+    readonly trigger: import("@element-plus/nightly/es/utils").EpPropFinalized<(new (...args: any[]) => "Enter" | "Space") | (() => "Enter" | "Space") | ((new (...args: any[]) => "Enter" | "Space") | (() => "Enter" | "Space"))[], unknown, unknown, string, boolean>;
+    readonly draggable: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly size: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<StringConstructor, "" | "small" | "default" | "large", never>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly clearable: BooleanConstructor;
+    readonly disabled: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, undefined, boolean>;
+    readonly validateEvent: import("@element-plus/nightly/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly readonly: BooleanConstructor;
+    readonly autofocus: BooleanConstructor;
+    readonly id: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, undefined, boolean>;
+    readonly tabindex: import("@element-plus/nightly/es/utils").EpPropFinalized<readonly [StringConstructor, NumberConstructor], unknown, unknown, 0, boolean>;
+    readonly maxlength: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly minlength: {
+        readonly type: import("vue").PropType<import("@element-plus/nightly/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly placeholder: StringConstructor;
+    readonly autocomplete: import("@element-plus/nightly/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "off", boolean>;
+    readonly ariaLabel: StringConstructor;
+};
+export type InputTagProps = ExtractPropTypes<typeof inputTagProps>;
+export declare const inputTagEmits: {
+    "update:modelValue": (value?: string[]) => boolean;
+    change: (value?: string[]) => boolean;
+    input: (value: string) => boolean;
+    'add-tag': (value: string) => boolean;
+    'remove-tag': (value: string) => boolean;
+    focus: (evt: FocusEvent) => boolean;
+    blur: (evt: FocusEvent) => boolean;
+    clear: () => boolean;
+};
+export type InputTagEmits = typeof inputTagEmits;

package/es/components/input-tag/src/input-tag.mjs

@@ -0,0 +1,69 @@
+import { tagProps } from '../../tag/src/tag.mjs';
+import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
+import { EVENT_CODE } from '../../../constants/aria.mjs';
+import { useSizeProp } from '../../../hooks/use-size/index.mjs';
+import { UPDATE_MODEL_EVENT, CHANGE_EVENT, INPUT_EVENT } from '../../../constants/event.mjs';
+import { isArray, isString } from '@vue/shared';
+import { isUndefined } from '../../../utils/types.mjs';
+
+const inputTagProps = buildProps({
+  modelValue: {
+    type: definePropType(Array)
+  },
+  max: Number,
+  tagType: { ...tagProps.type, default: "info" },
+  tagEffect: tagProps.effect,
+  trigger: {
+    type: definePropType(String),
+    default: EVENT_CODE.enter
+  },
+  draggable: {
+    type: Boolean,
+    default: false
+  },
+  size: useSizeProp,
+  clearable: Boolean,
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  validateEvent: {
+    type: Boolean,
+    default: true
+  },
+  readonly: Boolean,
+  autofocus: Boolean,
+  id: {
+    type: String,
+    default: void 0
+  },
+  tabindex: {
+    type: [String, Number],
+    default: 0
+  },
+  maxlength: {
+    type: [String, Number]
+  },
+  minlength: {
+    type: [String, Number]
+  },
+  placeholder: String,
+  autocomplete: {
+    type: String,
+    default: "off"
+  },
+  ariaLabel: String
+});
+const inputTagEmits = {
+  [UPDATE_MODEL_EVENT]: (value) => isArray(value) || isUndefined(value),
+  [CHANGE_EVENT]: (value) => isArray(value) || isUndefined(value),
+  [INPUT_EVENT]: (value) => isString(value),
+  "add-tag": (value) => isString(value),
+  "remove-tag": (value) => isString(value),
+  focus: (evt) => evt instanceof FocusEvent,
+  blur: (evt) => evt instanceof FocusEvent,
+  clear: () => true
+};
+
+export { inputTagEmits, inputTagProps };
+//# sourceMappingURL=input-tag.mjs.map

package/es/components/input-tag/src/input-tag.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-tag.mjs","sources":["../../../../../../packages/components/input-tag/src/input-tag.ts"],"sourcesContent":["import {\n  buildProps,\n  definePropType,\n  isArray,\n  isString,\n  isUndefined,\n} from '@element-plus/utils'\nimport { useSizeProp } from '@element-plus/hooks'\nimport {\n  CHANGE_EVENT,\n  EVENT_CODE,\n  INPUT_EVENT,\n  UPDATE_MODEL_EVENT,\n} from '@element-plus/constants'\nimport { tagProps } from '@element-plus/components/tag/src/tag'\n\nimport type { ExtractPropTypes } from 'vue'\n\nexport const inputTagProps = buildProps({\n  /**\n   * @description binding value\n   */\n  modelValue: {\n    type: definePropType<string[]>(Array),\n  },\n  /**\n   * @description max number tags that can be enter\n   */\n  max: Number,\n  /**\n   * @description tag type\n   */\n  tagType: { ...tagProps.type, default: 'info' },\n  /**\n   * @description tag effect\n   */\n  tagEffect: tagProps.effect,\n  /**\n   * @description the key to trigger input tag\n   */\n  trigger: {\n    type: definePropType<'Enter' | 'Space'>(String),\n    default: EVENT_CODE.enter,\n  },\n  /**\n   * @description whether tags can be dragged\n   */\n  draggable: {\n    type: Boolean,\n    default: false,\n  },\n  /**\n   * @description input box size\n   */\n  size: useSizeProp,\n  /**\n   * @description whether to show clear button\n   */\n  clearable: Boolean,\n  /**\n   * @description whether to disable input-tag\n   */\n  disabled: {\n    type: Boolean,\n    default: undefined,\n  },\n  /**\n   * @description whether to trigger form validation\n   */\n  validateEvent: {\n    type: Boolean,\n    default: true,\n  },\n  /**\n   * @description native input readonly\n   */\n  readonly: Boolean,\n  /**\n   * @description native input autofocus\n   */\n  autofocus: Boolean,\n  /**\n   * @description same as `id` in native input\n   */\n  id: {\n    type: String,\n    default: undefined,\n  },\n  /**\n   * @description same as `tabindex` in native input\n   */\n  tabindex: {\n    type: [String, Number],\n    default: 0,\n  },\n  /**\n   * @description same as `maxlength` in native input\n   */\n  maxlength: {\n    type: [String, Number],\n  },\n  /**\n   * @description same as `minlength` in native input\n   */\n  minlength: {\n    type: [String, Number],\n  },\n  /**\n   * @description placeholder of input\n   */\n  placeholder: String,\n  /**\n   * @description native input autocomplete\n   */\n  autocomplete: {\n    type: String,\n    default: 'off',\n  },\n  /**\n   * @description native `aria-label` attribute\n   */\n  ariaLabel: String,\n} as const)\nexport type InputTagProps = ExtractPropTypes<typeof inputTagProps>\n\nexport const inputTagEmits = {\n  [UPDATE_MODEL_EVENT]: (value?: string[]) =>\n    isArray(value) || isUndefined(value),\n  [CHANGE_EVENT]: (value?: string[]) => isArray(value) || isUndefined(value),\n  [INPUT_EVENT]: (value: string) => isString(value),\n  'add-tag': (value: string) => isString(value),\n  'remove-tag': (value: string) => isString(value),\n  focus: (evt: FocusEvent) => evt instanceof FocusEvent,\n  blur: (evt: FocusEvent) => evt instanceof FocusEvent,\n  clear: () => true,\n}\nexport type InputTagEmits = typeof inputTagEmits\n"],"names":[],"mappings":";;;;;;;;AAeY,MAAC,aAAa,GAAG,UAAU,CAAC;AACxC,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,GAAG;AACH,EAAE,GAAG,EAAE,MAAM;AACb,EAAE,OAAO,EAAE,EAAE,GAAG,QAAQ,CAAC,IAAI,EAAE,OAAO,EAAE,MAAM,EAAE;AAChD,EAAE,SAAS,EAAE,QAAQ,CAAC,MAAM;AAC5B,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,cAAc,CAAC,MAAM,CAAC;AAChC,IAAI,OAAO,EAAE,UAAU,CAAC,KAAK;AAC7B,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,IAAI,EAAE,WAAW;AACnB,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,aAAa,EAAE;AACjB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,SAAS,EAAE,OAAO;AACpB,EAAE,EAAE,EAAE;AACN,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,GAAG;AACH,EAAE,WAAW,EAAE,MAAM;AACrB,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE,MAAM;AACnB,CAAC,EAAE;AACS,MAAC,aAAa,GAAG;AAC7B,EAAE,CAAC,kBAAkB,GAAG,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC;AACvE,EAAE,CAAC,YAAY,GAAG,CAAC,KAAK,KAAK,OAAO,CAAC,KAAK,CAAC,IAAI,WAAW,CAAC,KAAK,CAAC;AACjE,EAAE,CAAC,WAAW,GAAG,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAC3C,EAAE,SAAS,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AACvC,EAAE,YAAY,EAAE,CAAC,KAAK,KAAK,QAAQ,CAAC,KAAK,CAAC;AAC1C,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC3C,EAAE,IAAI,EAAE,CAAC,GAAG,KAAK,GAAG,YAAY,UAAU;AAC1C,EAAE,KAAK,EAAE,MAAM,IAAI;AACnB;;;;"}