@layers.digital/layers-design-system-vue3 1.22.0 → 1.22.2

package/dist/chunks/chunk-2401.js

@@ -0,0 +1,357 @@
+import { CHANGE_EVENT as i, UPDATE_MODEL_EVENT as n } from "./chunk-1699.js";
+import { isBoolean as u, isNumber as l } from "./chunk-1703.js";
+import { buildProps as p, definePropType as t } from "./chunk-1704.js";
+import { iconPropType as r } from "./chunk-1752.js";
+import { useSizeProp as s } from "./chunk-1739.js";
+import { useEmptyValuesProps as d } from "./chunk-1743.js";
+import { useAriaProps as f } from "./chunk-1745.js";
+import { useTooltipContentProps as o } from "./chunk-1779.js";
+import { scrollbarEmits as m } from "./chunk-1790.js";
+import { tagProps as a } from "./chunk-1842.js";
+import { defaultProps as c } from "./chunk-1847.js";
+import { ArrowDown as y, CircleClose as b } from "./chunk-1786.js";
+import { placements as g } from "./chunk-1725.js";
+const _ = p({
+  /**
+  * @description whether creating new items is allowed. To use this, `filterable` must be true
+  */
+  allowCreate: Boolean,
+  /**
+  * @description autocomplete of select input
+  */
+  autocomplete: {
+    type: t(String),
+    default: "none"
+  },
+  /**
+  * @description for non-filterable Select, this prop decides if the option menu pops up when the input is focused
+  */
+  automaticDropdown: Boolean,
+  /**
+  * @description whether select can be cleared
+  */
+  clearable: Boolean,
+  /**
+  * @description custom clear icon
+  */
+  clearIcon: {
+    type: r,
+    default: b
+  },
+  /**
+  * @description tooltip theme, built-in theme: `dark` / `light`
+  */
+  effect: {
+    type: t(String),
+    default: "light"
+  },
+  /**
+  * @description whether to collapse tags to a text when multiple selecting
+  */
+  collapseTags: Boolean,
+  /**
+  * @description whether show all selected tags when mouse hover text of collapse-tags. To use this, `collapse-tags` must be true
+  */
+  collapseTagsTooltip: Boolean,
+  /**
+  * @description configuration object for the collapse-tags tooltip. To use this, `collapse-tags` and `collapse-tags-tooltip` must be true
+  */
+  tagTooltip: {
+    type: t(Object),
+    default: () => ({})
+  },
+  /**
+  * @description The max tags number to be shown. To use this, `collapse-tags` must be true
+  */
+  maxCollapseTags: {
+    type: Number,
+    default: 1
+  },
+  /**
+  * @description
+  */
+  defaultFirstOption: Boolean,
+  /**
+  * @description is disabled
+  */
+  disabled: {
+    type: Boolean,
+    default: void 0
+  },
+  /**
+  * @description Estimated item height for variable option sizes. Defaults to fixed `itemHeight` when omitted.
+  */
+  estimatedOptionHeight: {
+    type: Number,
+    default: void 0
+  },
+  /**
+  * @description whether Select is filterable
+  */
+  filterable: Boolean,
+  /**
+  * @description custom filter method, the first parameter is the current input value. To use this, `filterable` must be true
+  */
+  filterMethod: { type: t(Function) },
+  /**
+  * @description The height of the dropdown panel, 34px for each item
+  */
+  height: {
+    type: Number,
+    default: 274
+  },
+  /**
+  * @description The height of the dropdown item
+  */
+  itemHeight: {
+    type: Number,
+    default: 34
+  },
+  /**
+  * @description native input id
+  */
+  id: String,
+  /**
+  * @description whether Select is loading data from server
+  */
+  loading: Boolean,
+  /**
+  * @description displayed text while loading data from server, default is 'Loading'
+  */
+  loadingText: String,
+  /**
+  * @description biding value
+  */
+  modelValue: {
+    type: t([
+      Array,
+      String,
+      Number,
+      Boolean,
+      Object
+    ]),
+    default: void 0
+  },
+  /**
+  * @description is multiple
+  */
+  multiple: Boolean,
+  /**
+  * @description maximum number of options user can select when multiple is true. No limit when set to 0
+  */
+  multipleLimit: {
+    type: Number,
+    default: 0
+  },
+  /**
+  * @description the name attribute of select input
+  */
+  name: String,
+  /**
+  * @description displayed text when there is no options, you can also use slot empty, the default is 'No Data'
+  */
+  noDataText: String,
+  /**
+  * @description displayed text when no data matches the filtering query, you can also use slot `empty`, default is 'No matching data'
+  */
+  noMatchText: String,
+  /**
+  * @description function that gets called when the input value changes. Its parameter is the current input value. To use this, `filterable` must be true
+  */
+  remoteMethod: { type: t(Function) },
+  /**
+  * @description whether reserve the keyword after select filtered option.
+  */
+  reserveKeyword: {
+    type: Boolean,
+    default: !0
+  },
+  /**
+  * @description data of the options, the key of `value` and `label` can be customize by `props`
+  */
+  options: {
+    type: t(Array),
+    required: !0
+  },
+  /**
+  * @description placeholder, the default is 'Please select'
+  */
+  placeholder: { type: String },
+  /**
+  * @description whether select dropdown is teleported, if `true` it will be teleported to where `append-to` sets
+  */
+  teleported: o.teleported,
+  /**
+  * @description when select dropdown is inactive and `persistent` is `false`, select dropdown will be destroyed
+  */
+  persistent: {
+    type: Boolean,
+    default: !0
+  },
+  /**
+  * @description custom class name for Select's dropdown
+  */
+  popperClass: o.popperClass,
+  /**
+  * @description custom style for Select's dropdown
+  */
+  popperStyle: o.popperStyle,
+  /**
+  * @description [popper.js](https://popper.js.org/docs/v2/) parameters
+  */
+  popperOptions: {
+    type: t(Object),
+    default: () => ({})
+  },
+  /**
+  * @description whether search data from server
+  */
+  remote: Boolean,
+  /**
+  * @description debounce delay during remote search, in milliseconds
+  */
+  debounce: {
+    type: Number,
+    default: 300
+  },
+  /**
+  * @description size of component
+  */
+  size: s,
+  /**
+  * @description configuration options, see the following table
+  */
+  props: {
+    type: t(Object),
+    default: () => c
+  },
+  /**
+  * @description unique identity key name for value, required when value is an object
+  */
+  valueKey: {
+    type: String,
+    default: "value"
+  },
+  /**
+  * @description Controls whether the scrollbar is always displayed
+  */
+  scrollbarAlwaysOn: Boolean,
+  /**
+  * @description whether to trigger form validation
+  */
+  validateEvent: {
+    type: Boolean,
+    default: !0
+  },
+  /**
+  * @description offset of the dropdown
+  */
+  offset: {
+    type: Number,
+    default: 12
+  },
+  /**
+  * @description in remote search method show suffix icon
+  */
+  remoteShowSuffix: Boolean,
+  /**
+  * @description Determines whether the arrow is displayed
+  */
+  showArrow: {
+    type: Boolean,
+    default: !0
+  },
+  /**
+  * @description position of dropdown
+  */
+  placement: {
+    type: t(String),
+    values: g,
+    default: "bottom-start"
+  },
+  /**
+  * @description list of possible positions for dropdown
+  */
+  fallbackPlacements: {
+    type: t(Array),
+    default: [
+      "bottom-start",
+      "top-start",
+      "right",
+      "left"
+    ]
+  },
+  /**
+  * @description tag type
+  */
+  tagType: {
+    ...a.type,
+    default: "info"
+  },
+  /**
+  * @description tag effect
+  */
+  tagEffect: {
+    ...a.effect,
+    default: "light"
+  },
+  /**
+  * @description tabindex for input
+  */
+  tabindex: {
+    type: [String, Number],
+    default: 0
+  },
+  /**
+  * @description which element the select dropdown appends to
+  */
+  appendTo: o.appendTo,
+  /**
+  * @description if it is `true`, the width of the dropdown panel is the same as the input box.
+  * if it is `false`, the width is automatically calculated based on the value of `label`,
+  * or it can be set to a number to make it a fixed width
+  */
+  fitInputWidth: {
+    type: [Boolean, Number],
+    default: !0,
+    validator(e) {
+      return u(e) || l(e);
+    }
+  },
+  suffixIcon: {
+    type: r,
+    default: y
+  },
+  ...d,
+  ...f(["ariaLabel"])
+}), j = p({
+  data: Array,
+  disabled: Boolean,
+  hovering: Boolean,
+  item: {
+    type: t(Object),
+    required: !0
+  },
+  index: Number,
+  style: Object,
+  selected: Boolean,
+  created: Boolean
+}), D = {
+  [n]: (e) => !0,
+  [i]: (e) => !0,
+  "end-reached": m["end-reached"],
+  "remove-tag": (e) => !0,
+  "visible-change": (e) => !0,
+  focus: (e) => e instanceof FocusEvent,
+  blur: (e) => e instanceof FocusEvent,
+  clear: () => !0
+}, F = {
+  hover: (e) => l(e),
+  select: (e, B) => !0
+};
+export {
+  F as optionV2Emits,
+  j as optionV2Props,
+  D as selectV2Emits,
+  _ as selectV2Props
+};

package/dist/chunks/chunk-2402.cjs

@@ -0,0 +1 @@
+"use strict";const G=require("./chunk-1697.cjs"),U=require("./chunk-1731.cjs"),$=require("./chunk-1703.cjs"),J=require("./chunk-1717.cjs"),M=require("./chunk-1790.cjs"),Q=require("./chunk-1847.cjs"),W=require("./chunk-1866.cjs"),X=require("./chunk-1869.cjs"),Y=require("./chunk-2586.cjs"),Z=require("./chunk-2016.cjs"),ee=require("./chunk-2587.cjs"),o=require("vue"),I=require("./chunk-1721.cjs"),b=require("./chunk-1716.cjs");var te=o.defineComponent({name:"ElSelectDropdown",props:{loading:Boolean,data:{type:Array,required:!0},hoveringIndex:Number,width:Number,id:String,ariaLabel:String},emits:{"end-reached":M.scrollbarEmits["end-reached"]},setup(u,{slots:p,expose:E,emit:z}){const n=o.inject(Z.selectV2InjectionKey),f=J.useNamespace("select"),{getLabel:V,getValue:g,getDisabled:x}=Q.useProps(n.props),H=o.ref([]),m=o.ref(),O=o.computed(()=>u.data.length);o.watch(()=>O.value,()=>{n.tooltipRef.value?.updatePopper?.()});const h=o.computed(()=>$.isUndefined(n.props.estimatedOptionHeight)),v=o.computed(()=>h.value?{itemSize:n.props.itemHeight}:{estimatedSize:n.props.estimatedOptionHeight,itemSize:e=>H.value[e]}),k=(e=[],t)=>{const{props:{valueKey:r}}=n;return I.isObject(t)?e&&e.some(s=>o.toRaw(b(s,r))===b(t,r)):e.includes(t)},K=(e,t)=>{if(I.isObject(t)){const{valueKey:r}=n.props;return b(e,r)===b(t,r)}else return e===t},w=(e,t)=>n.props.multiple?k(e,g(t)):K(e,g(t)),S=(e,t)=>{const{disabled:r,multiple:s,multipleLimit:i}=n.props;return r||!t&&(s?i>0&&e.length>=i:!1)},y=e=>u.hoveringIndex===e;E({listRef:m,isSized:h,isItemDisabled:S,isItemHovering:y,isItemSelected:w,scrollToItem:e=>{const t=m.value;t&&t.scrollToItem(e)},resetScrollTop:()=>{const e=m.value;e&&e.resetScrollTop()}});const L=e=>{const{index:t,data:r,style:s}=e,i=o.unref(h),{itemSize:l,estimatedSize:d}=o.unref(v),{modelValue:c}=n.props,{onSelect:A,onHover:_}=n,a=r[t];if(a.type==="Group")return o.createVNode(Y,{item:a,style:s,height:i?l:d},null);const N=w(c,a),B=S(c,N),C=y(t);return o.createVNode(ee,o.mergeProps(e,{selected:N,disabled:x(a)||B,created:!!a.created,hovering:C,item:a,onSelect:A,onHover:_}),{default:F=>p.default?.(F)||o.createVNode("span",null,[V(a)])})},{onKeyboardNavigate:q,onKeyboardSelect:P}=n,T=()=>{q("forward")},D=()=>{q("backward")},R=e=>{const t=U.getEventCode(e),{tab:r,esc:s,down:i,up:l,enter:d,numpadEnter:c}=G.EVENT_CODE;switch([s,i,l,d,c].includes(t)&&(e.preventDefault(),e.stopPropagation()),t){case r:case s:break;case i:T();break;case l:D();break;case d:case c:P();break}},j=e=>{z("end-reached",e)};return()=>{const{data:e,width:t}=u,{height:r,multiple:s,scrollbarAlwaysOn:i}=n.props,l=i,d=o.unref(h)?W:X;return o.createVNode("div",{class:[f.b("dropdown"),f.is("multiple",s)],style:{width:`${t}px`}},[p.header?.(),p.loading?.()||p.empty?.()||o.createVNode(d,o.mergeProps({ref:m},o.unref(v),{className:f.be("dropdown","list"),scrollbarAlwaysOn:l,data:e,height:r,width:t,total:e.length,innerElement:"ul",innerProps:{id:u.id,role:"listbox","aria-label":u.ariaLabel,"aria-orientation":"vertical"},onEndReached:j,onKeydown:R}),{default:c=>o.createVNode(L,c,null)}),p.footer?.()])}}});module.exports=te;

package/dist/chunks/chunk-2402.js

@@ -0,0 +1,143 @@
+import { EVENT_CODE as M } from "./chunk-1697.js";
+import { getEventCode as Q } from "./chunk-1731.js";
+import { isUndefined as W } from "./chunk-1703.js";
+import { useNamespace as X } from "./chunk-1717.js";
+import { scrollbarEmits as Y } from "./chunk-1790.js";
+import { useProps as Z } from "./chunk-1847.js";
+import ee from "./chunk-1866.js";
+import te from "./chunk-1869.js";
+import oe from "./chunk-2586.js";
+import { selectV2InjectionKey as re } from "./chunk-2016.js";
+import ne from "./chunk-2587.js";
+import { defineComponent as ie, inject as se, ref as x, computed as v, watch as ae, unref as h, createVNode as d, mergeProps as D, toRaw as le } from "vue";
+import { isObject as K } from "./chunk-1721.js";
+import b from "./chunk-1716.js";
+var He = /* @__PURE__ */ ie({
+  name: "ElSelectDropdown",
+  props: {
+    loading: Boolean,
+    data: {
+      type: Array,
+      required: !0
+    },
+    hoveringIndex: Number,
+    width: Number,
+    id: String,
+    ariaLabel: String
+  },
+  emits: { "end-reached": Y["end-reached"] },
+  setup(m, { slots: p, expose: L, emit: N }) {
+    const o = se(re), g = X("select"), { getLabel: O, getValue: w, getDisabled: T } = Z(o.props), _ = x([]), u = x(), k = v(() => m.data.length);
+    ae(() => k.value, () => {
+      o.tooltipRef.value?.updatePopper?.();
+    });
+    const f = v(() => W(o.props.estimatedOptionHeight)), S = v(() => f.value ? { itemSize: o.props.itemHeight } : {
+      estimatedSize: o.props.estimatedOptionHeight,
+      itemSize: (e) => _.value[e]
+    }), P = (e = [], t) => {
+      const { props: { valueKey: r } } = o;
+      return K(t) ? e && e.some((n) => le(b(n, r)) === b(t, r)) : e.includes(t);
+    }, R = (e, t) => {
+      if (K(t)) {
+        const { valueKey: r } = o.props;
+        return b(e, r) === b(t, r);
+      } else
+        return e === t;
+    }, y = (e, t) => o.props.multiple ? P(e, w(t)) : R(e, w(t)), E = (e, t) => {
+      const { disabled: r, multiple: n, multipleLimit: i } = o.props;
+      return r || !t && (n ? i > 0 && e.length >= i : !1);
+    }, z = (e) => m.hoveringIndex === e;
+    L({
+      listRef: u,
+      isSized: f,
+      isItemDisabled: E,
+      isItemHovering: z,
+      isItemSelected: y,
+      scrollToItem: (e) => {
+        const t = u.value;
+        t && t.scrollToItem(e);
+      },
+      resetScrollTop: () => {
+        const e = u.value;
+        e && e.resetScrollTop();
+      }
+    });
+    const A = (e) => {
+      const { index: t, data: r, style: n } = e, i = h(f), { itemSize: l, estimatedSize: c } = h(S), { modelValue: s } = o.props, { onSelect: F, onHover: G } = o, a = r[t];
+      if (a.type === "Group") return d(oe, {
+        item: a,
+        style: n,
+        height: i ? l : c
+      }, null);
+      const H = y(s, a), U = E(s, H), $ = z(t);
+      return d(ne, D(e, {
+        selected: H,
+        disabled: T(a) || U,
+        created: !!a.created,
+        hovering: $,
+        item: a,
+        onSelect: F,
+        onHover: G
+      }), { default: (J) => p.default?.(J) || d("span", null, [O(a)]) });
+    }, { onKeyboardNavigate: I, onKeyboardSelect: V } = o, j = () => {
+      I("forward");
+    }, C = () => {
+      I("backward");
+    }, q = (e) => {
+      const t = Q(e), { tab: r, esc: n, down: i, up: l, enter: c, numpadEnter: s } = M;
+      switch ([
+        n,
+        i,
+        l,
+        c,
+        s
+      ].includes(t) && (e.preventDefault(), e.stopPropagation()), t) {
+        case r:
+        case n:
+          break;
+        case i:
+          j();
+          break;
+        case l:
+          C();
+          break;
+        case c:
+        case s:
+          V();
+          break;
+      }
+    }, B = (e) => {
+      N("end-reached", e);
+    };
+    return () => {
+      const { data: e, width: t } = m, { height: r, multiple: n, scrollbarAlwaysOn: i } = o.props, l = i, c = h(f) ? ee : te;
+      return d("div", {
+        class: [g.b("dropdown"), g.is("multiple", n)],
+        style: { width: `${t}px` }
+      }, [
+        p.header?.(),
+        p.loading?.() || p.empty?.() || d(c, D({ ref: u }, h(S), {
+          className: g.be("dropdown", "list"),
+          scrollbarAlwaysOn: l,
+          data: e,
+          height: r,
+          width: t,
+          total: e.length,
+          innerElement: "ul",
+          innerProps: {
+            id: m.id,
+            role: "listbox",
+            "aria-label": m.ariaLabel,
+            "aria-orientation": "vertical"
+          },
+          onEndReached: B,
+          onKeydown: q
+        }), { default: (s) => d(A, s, null) }),
+        p.footer?.()
+      ]);
+    };
+  }
+});
+export {
+  He as default
+};

package/dist/chunks/chunk-2403.cjs

@@ -0,0 +1 @@
+"use strict";const pt=require("./chunk-1697.cjs"),ye=require("./chunk-1699.cjs"),wt=require("./chunk-1731.cjs"),Y=require("./chunk-1703.cjs"),yt=require("./chunk-2306.cjs"),Tt=require("./chunk-1706.cjs"),Ct=require("./chunk-1752.cjs"),r=require("./chunk-1721.cjs"),Et=require("./chunk-1714.cjs"),Te=require("./chunk-1717.cjs"),Rt=require("./chunk-1740.cjs"),St=require("./chunk-1742.cjs"),Ft=require("./chunk-1743.cjs"),Ce=require("./chunk-1769.cjs"),Ee=require("./chunk-1770.cjs"),Mt=require("./chunk-1847.cjs"),qt=require("./chunk-2588.cjs"),x=require("./chunk-1709.cjs"),n=require("vue"),k=require("./chunk-1716.cjs"),y=require("./chunk-1744.cjs"),Wt=require("./chunk-1722.cjs"),Nt=require("./chunk-2485.cjs"),Lt=(t,v)=>{const{t:T}=Et.useLocale(),Re=n.useSlots(),H=Te.useNamespace("select"),Se=Te.useNamespace("input"),{form:Fe,formItem:C}=Ee.useFormItem(),{inputId:Me}=Ee.useFormItemInputId(t,{formItemContext:C}),{aliasProps:Z,getLabel:h,getValue:f,getDisabled:E,getOptions:qe}=Mt.useProps(t),{valueOnClear:We,isEmptyValue:ee}=Ft.useEmptyValues(t),l=n.reactive({inputValue:"",cachedOptions:[],createdOptions:[],hoveringIndex:-1,inputHovering:!1,selectionWidth:0,collapseItemWidth:0,previousQuery:null,previousValue:void 0,selectedLabel:"",menuVisibleOnFocus:!1,isBeforeHide:!1}),R=n.ref(-1),P=n.ref(!1),z=n.ref(),O=n.ref(),S=n.ref(),A=n.ref(),g=n.ref(),Ne=n.ref(),te=n.ref(),V=n.ref(),le=n.ref(),F=n.ref(),{isComposing:ne,handleCompositionStart:Le,handleCompositionEnd:De,handleCompositionUpdate:ke}=St.useComposition({afterComposition:e=>pe(e)}),b=Ce.useFormDisabled(),{wrapperRef:ue,isFocused:$,handleBlur:He}=Rt.useFocusController(g,{disabled:b,afterFocus(){t.automaticDropdown&&!o.value&&(o.value=!0,l.menuVisibleOnFocus=!0)},beforeBlur(e){return S.value?.isFocusInsideContent(e)||A.value?.isFocusInsideContent(e)},afterBlur(){o.value=!1,l.menuVisibleOnFocus=!1,t.validateEvent&&C?.validate?.("blur").catch(r.NOOP)}}),ie=n.computed(()=>se("")),I=n.computed(()=>t.loading?!1:t.options.length>0||l.createdOptions.length>0),c=n.ref([]),o=n.ref(!1),Pe=n.computed(()=>Fe?.statusIcon??!1),ze=n.computed(()=>{const e=c.value.length*t.itemHeight;return e>t.height?t.height:e}),M=n.computed(()=>t.multiple?r.isArray(t.modelValue)&&t.modelValue.length>0:!ee(t.modelValue)),Ae=n.computed(()=>t.clearable&&!b.value&&M.value&&($.value||l.inputHovering)),ae=n.computed(()=>t.remote&&t.filterable&&!t.remoteShowSuffix?"":t.suffixIcon),$e=n.computed(()=>ae.value&&H.is("reverse",o.value)),B=n.computed(()=>C?.validateState||""),Be=n.computed(()=>{if(B.value)return Ct.ValidateComponentsMap[B.value]}),oe=n.computed(()=>t.remote?t.debounce:0),Ke=n.computed(()=>t.remote&&!l.inputValue&&!I.value),Qe=n.computed(()=>t.loading?t.loadingText||T("el.select.loading"):t.filterable&&l.inputValue&&I.value&&c.value.length===0?t.noMatchText||T("el.select.noMatch"):I.value?null:t.noDataText||T("el.select.noData")),_e=n.computed(()=>t.filterable&&r.isFunction(t.filterMethod)),Ge=n.computed(()=>t.filterable&&t.remote&&r.isFunction(t.remoteMethod)),se=e=>{const a=new RegExp(yt.escapeStringRegexp(e),"i"),i=u=>_e.value||Ge.value?!0:e?a.test(h(u)||""):!0;return t.loading?[]:[...l.createdOptions,...t.options].reduce((u,s)=>{const m=qe(s);if(r.isArray(m)){const D=m.filter(i);D.length>0&&u.push({label:h(s),type:"Group"},...D)}else(t.remote||i(s))&&u.push(s);return u},[])},ce=()=>{c.value=se(l.inputValue)},q=n.computed(()=>{const e=new Map;return ie.value.forEach((a,i)=>{e.set(d(f(a)),{option:a,index:i})}),e}),W=n.computed(()=>{const e=new Map;return c.value.forEach((a,i)=>{e.set(d(f(a)),{option:a,index:i})}),e}),je=n.computed(()=>c.value.every(e=>E(e))),re=Ce.useFormSize(),Ue=n.computed(()=>re.value==="small"?"small":"default"),p=()=>{if(Y.isNumber(t.fitInputWidth)){R.value=t.fitInputWidth;return}const e=z.value?.offsetWidth||200;!t.fitInputWidth&&I.value?n.nextTick(()=>{R.value=Math.max(e,Je())}):R.value=e},Je=()=>{const e=document.createElement("canvas").getContext("2d"),a=H.be("dropdown","item"),i=(V.value?.listRef?.innerRef||document).querySelector(`.${a}`);if(i===null||e===null)return 0;const u=getComputedStyle(i),s=Number.parseFloat(u.paddingLeft)+Number.parseFloat(u.paddingRight);return e.font=`bold ${u.font.replace(new RegExp(`\\b${u.fontWeight}\\b`),"")}`,c.value.reduce((m,D)=>{const It=e.measureText(h(D));return Math.max(It.width,m)},0)+s},Xe=()=>{if(!O.value)return 0;const e=window.getComputedStyle(O.value);return Number.parseFloat(e.gap||"6px")},Ye=n.computed(()=>{const e=Xe(),a=t.filterable?e+11:0;return{maxWidth:`${F.value&&t.maxCollapseTags===1?l.selectionWidth-l.collapseItemWidth-e-a:l.selectionWidth-a}px`}}),Ze=n.computed(()=>({maxWidth:`${l.selectionWidth}px`})),et=n.computed(()=>r.isArray(t.modelValue)?t.modelValue.length===0&&!l.inputValue:t.filterable?!l.inputValue:!0),tt=n.computed(()=>{const e=t.placeholder??T("el.select.placeholder");return t.multiple||!M.value?e:l.selectedLabel}),lt=n.computed(()=>S.value?.popperRef?.contentRef),de=n.computed(()=>{if(t.multiple){const e=t.modelValue.length;if(e>0&&W.value.has(t.modelValue[e-1])){const{index:a}=W.value.get(t.modelValue[e-1]);return a}}else if(!ee(t.modelValue)&&W.value.has(t.modelValue)){const{index:e}=W.value.get(t.modelValue);return e}return-1}),fe=n.computed({get(){return o.value&&(t.loading||!Ke.value||t.remote&&!!Re.empty)&&(!P.value||!Y.isEmpty(l.previousQuery)||I.value)},set(e){o.value=e}}),nt=n.computed(()=>t.multiple?t.collapseTags?l.cachedOptions.slice(0,t.maxCollapseTags):l.cachedOptions:[]),ut=n.computed(()=>t.multiple?t.collapseTags?l.cachedOptions.slice(t.maxCollapseTags):[]:[]),{createNewOption:me,removeNewOption:K,selectNewOption:ve,clearAllNewOption:Q}=qt.useAllowCreate(t,l),_=e=>{b.value||t.filterable&&o.value&&e&&!te.value?.contains(e.target)||(l.menuVisibleOnFocus?l.menuVisibleOnFocus=!1:o.value=!o.value)},he=()=>{l.inputValue.length>0&&!o.value&&(o.value=!0),me(l.inputValue),n.nextTick(()=>{G(l.inputValue)})},ge=Wt.useDebounceFn(()=>{he(),P.value=!1},oe),G=e=>{l.previousQuery===e||ne.value||(l.previousQuery=e,t.filterable&&r.isFunction(t.filterMethod)?t.filterMethod(e):t.filterable&&t.remote&&r.isFunction(t.remoteMethod)&&t.remoteMethod(e),t.defaultFirstOption&&(t.filterable||t.remote)&&c.value.length?n.nextTick(it):n.nextTick(Vt))},it=()=>{const e=c.value.filter(u=>!u.disabled&&u.type!=="Group"),a=e.find(u=>u.created),i=e[0];l.hoveringIndex=j(c.value,a||i)},at=e=>{y(t.modelValue,e)||v(ye.CHANGE_EVENT,e)},w=e=>{v(ye.UPDATE_MODEL_EVENT,e),at(e),l.previousValue=t.multiple?String(e):e,n.nextTick(()=>{if(t.multiple&&r.isArray(t.modelValue)){const a=l.cachedOptions.slice(),i=t.modelValue.map(u=>we(u,a));y(l.cachedOptions,i)||(l.cachedOptions=i)}else L(!0)})},j=(e=[],a)=>{if(!r.isObject(a))return e.indexOf(a);const i=t.valueKey;let u=-1;return e.some((s,m)=>k(s,i)===k(a,i)?(u=m,!0):!1),u},d=e=>r.isObject(e)?k(e,t.valueKey):e,Ve=()=>{p()},ot=e=>{v("end-reached",e)},be=()=>{l.selectionWidth=Number.parseFloat(window.getComputedStyle(O.value).width)},st=()=>{l.collapseItemWidth=F.value.getBoundingClientRect().width},U=()=>{S.value?.updatePopper?.()},xe=()=>{A.value?.updatePopper?.()},Oe=e=>{const a=f(e);if(t.multiple){let i=t.modelValue.slice();const u=j(i,a);u>-1?(i=[...i.slice(0,u),...i.slice(u+1)],l.cachedOptions.splice(u,1),K(e)):(t.multipleLimit<=0||i.length<t.multipleLimit)&&(i=[...i,a],l.cachedOptions.push(e),ve(e)),w(i),e.created&&G(""),t.filterable&&(e.created||!t.reserveKeyword)&&(l.inputValue="")}else l.selectedLabel=h(e),!y(t.modelValue,a)&&w(a),o.value=!1,ve(e),e.created||Q();N()},ct=(e,a)=>{let i=t.modelValue.slice();const u=j(i,f(a));u>-1&&!b.value&&(i=[...t.modelValue.slice(0,u),...t.modelValue.slice(u+1)],l.cachedOptions.splice(u,1),w(i),v("remove-tag",f(a)),K(a)),e.stopPropagation(),N()},N=()=>{g.value?.focus()},rt=()=>{if(o.value){o.value=!1,n.nextTick(()=>g.value?.blur());return}g.value?.blur()},dt=()=>{l.inputValue.length>0?l.inputValue="":o.value=!1},ft=e=>Nt(e,a=>!l.cachedOptions.some(i=>f(i)===a&&E(i))),mt=e=>{const a=wt.getEventCode(e);if(t.multiple&&a!==pt.EVENT_CODE.delete&&l.inputValue.length===0){e.preventDefault();const i=t.modelValue.slice(),u=ft(i);if(u<0)return;const s=i[u];i.splice(u,1);const m=l.cachedOptions[u];l.cachedOptions.splice(u,1),K(m),w(i),v("remove-tag",s)}},vt=()=>{let e;r.isArray(t.modelValue)?e=[]:e=We.value,l.selectedLabel="",o.value=!1,w(e),v("clear"),Q(),N()},Ie=(e,a=void 0)=>{const i=c.value;if(!["forward","backward"].includes(e)||b.value||i.length<=0||je.value||ne.value)return;if(!o.value)return _();Y.isUndefined(a)&&(a=l.hoveringIndex);let u=-1;e==="forward"?(u=a+1,u>=i.length&&(u=0)):e==="backward"&&(u=a-1,(u<0||u>=i.length)&&(u=i.length-1));const s=i[u];if(E(s)||s.type==="Group")return Ie(e,u);l.hoveringIndex=u,J(u)},ht=()=>{if(o.value)~l.hoveringIndex&&c.value[l.hoveringIndex]&&Oe(c.value[l.hoveringIndex]);else return _()},gt=e=>{l.hoveringIndex=e??-1},Vt=()=>{if(!t.multiple)l.hoveringIndex=c.value.findIndex(e=>d(f(e))===d(t.modelValue));else{const e=t.modelValue.length;if(e>0){const a=t.modelValue[e-1];l.hoveringIndex=c.value.findIndex(i=>d(a)===d(f(i)))}else l.hoveringIndex=-1}},pe=e=>{if(l.inputValue=e.target.value,t.remote)P.value=!0,ge();else return he()},bt=e=>{o.value=!1,$.value&&He(new FocusEvent("blur",e))},xt=()=>(l.isBeforeHide=!1,n.nextTick(()=>{~de.value&&J(de.value)})),J=e=>{V.value.scrollToItem(e)},we=(e,a)=>{const i=d(e);if(q.value.has(i)){const{option:u}=q.value.get(i);return u}if(a&&a.length){const u=a.find(s=>d(f(s))===i);if(u)return u}return{[Z.value.value]:e,[Z.value.label]:e}},Ot=e=>q.value.get(f(e))?.index??-1,L=(e=!1)=>{if(t.multiple)if(t.modelValue.length>0){const a=l.cachedOptions.slice();l.cachedOptions.length=0,l.previousValue=t.modelValue.toString();for(const i of t.modelValue){const u=we(i,a);l.cachedOptions.push(u)}}else l.cachedOptions=[],l.previousValue=void 0;else if(M.value){l.previousValue=t.modelValue;const a=c.value,i=a.findIndex(u=>d(f(u))===d(t.modelValue));~i?l.selectedLabel=h(a[i]):(!l.selectedLabel||e)&&(l.selectedLabel=d(t.modelValue))}else l.selectedLabel="",l.previousValue=void 0;Q(),p()};n.watch(()=>t.fitInputWidth,()=>{p()}),n.watch(o,e=>{e?(t.persistent||p(),G("")):(l.inputValue="",l.previousQuery=null,l.isBeforeHide=!0,l.menuVisibleOnFocus=!1,me(""))}),n.watch(()=>t.modelValue,(e,a)=>{(!e||r.isArray(e)&&e.length===0||t.multiple&&!y(e.toString(),l.previousValue)||!t.multiple&&d(e)!==d(l.previousValue))&&L(!0),!y(e,a)&&t.validateEvent&&C?.validate?.("change").catch(r.NOOP)},{deep:!0}),n.watch(()=>t.options,()=>{const e=g.value;(!e||e&&document.activeElement!==e)&&L()},{deep:!0,flush:"post"}),n.watch(()=>c.value,()=>(p(),V.value&&n.nextTick(V.value.resetScrollTop))),n.watchEffect(()=>{l.isBeforeHide||ce()}),n.watchEffect(()=>{const{valueKey:e,options:a}=t,i=new Map;for(const u of a){const s=f(u);let m=s;if(r.isObject(m)&&(m=k(s,e)),i.get(m)){Tt.debugWarn("ElSelectV2","The option values you provided seem to be duplicated, which may cause some problems, please check.");break}else i.set(m,!0)}}),n.onMounted(()=>{L()}),x.useResizeObserver(z,Ve),x.useResizeObserver(O,be),x.useResizeObserver(ue,U),x.useResizeObserver(le,xe),x.useResizeObserver(F,st);let X;return n.watch(()=>fe.value,e=>{e?X=x.useResizeObserver(V,U).stop:(X?.(),X=void 0),v("visible-change",e)}),{inputId:Me,collapseTagSize:Ue,currentPlaceholder:tt,expanded:o,emptyText:Qe,popupHeight:ze,debounce:oe,allOptions:ie,allOptionsValueMap:q,filteredOptions:c,iconComponent:ae,iconReverse:$e,tagStyle:Ye,collapseTagStyle:Ze,popperSize:R,dropdownMenuVisible:fe,hasModelValue:M,shouldShowPlaceholder:et,selectDisabled:b,selectSize:re,needStatusIcon:Pe,showClearBtn:Ae,states:l,isFocused:$,nsSelect:H,nsInput:Se,inputRef:g,menuRef:V,tagMenuRef:le,tooltipRef:S,tagTooltipRef:A,selectRef:z,wrapperRef:ue,selectionRef:O,prefixRef:Ne,suffixRef:te,collapseItemRef:F,popperRef:lt,validateState:B,validateIcon:Be,showTagList:nt,collapseTagList:ut,debouncedOnInputChange:ge,deleteTag:ct,getLabel:h,getValue:f,getDisabled:E,getValueKey:d,getIndex:Ot,handleClear:vt,handleClickOutside:bt,handleDel:mt,handleEsc:dt,focus:N,blur:rt,handleMenuEnter:xt,handleResize:Ve,resetSelectionWidth:be,updateTooltip:U,updateTagTooltip:xe,updateOptions:ce,toggleMenu:_,scrollTo:J,onInput:pe,onKeyboardNavigate:Ie,onKeyboardSelect:ht,onEndReached:ot,onSelect:Oe,onHover:gt,handleCompositionStart:Le,handleCompositionEnd:De,handleCompositionUpdate:ke}};module.exports=Lt;