@element-plus/nightly 0.0.20220304 → 0.0.20220307

package/lib/components/row/src/row.js

@@ -5,8 +5,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 var vue = require('vue');
 require('../../../utils/index.js');
 require('../../../hooks/index.js');
+require('../../../tokens/index.js');
 var props = require('../../../utils/vue/props.js');
 var index = require('../../../hooks/use-namespace/index.js');
+var row = require('../../../tokens/row.js');
 
 const rowProps = props.buildProps({
   tag: {
@@ -19,14 +21,7 @@ const rowProps = props.buildProps({
   },
   justify: {
     type: String,
-    values: [
-      "start",
-      "center",
-      "end",
-      "space-around",
-      "space-between",
-      "space-evenly"
-    ],
+    values: ["start", "center", "end", "space-around", "space-between", "space-evenly"],
     default: "start"
   },
   align: {
@@ -38,10 +33,12 @@ const rowProps = props.buildProps({
 const Row = vue.defineComponent({
   name: "ElRow",
   props: rowProps,
-  setup(props, { slots }) {
+  setup(props, {
+    slots
+  }) {
     const ns = index.useNamespace("row");
     const gutter = vue.computed(() => props.gutter);
-    vue.provide("ElRow", {
+    vue.provide(row.rowContextKey, {
       gutter
     });
     const style = vue.computed(() => {
@@ -55,17 +52,15 @@ const Row = vue.defineComponent({
       }
       return styles;
     });
-    return () => {
-      var _a;
-      return vue.h(props.tag, {
-        class: [
-          ns.b(),
-          ns.is(`justify-${props.justify}`, props.justify !== "start"),
-          ns.is(`align-${props.align}`, props.align !== "top")
-        ],
-        style: style.value
-      }, (_a = slots.default) == null ? void 0 : _a.call(slots));
-    };
+    return () => vue.createVNode(props.tag, {
+      "class": [ns.b(), ns.is(`justify-${props.justify}`, props.justify !== "start"), ns.is(`align-${props.align}`, props.align !== "top")],
+      "style": style.value
+    }, {
+      default: () => {
+        var _a;
+        return [(_a = slots.default) == null ? void 0 : _a.call(slots)];
+      }
+    });
   }
 });
 

package/lib/components/row/src/row.js.map

@@ -1 +1 @@
-{"version":3,"file":"row.js","sources":["../../../../../../packages/components/row/src/row.ts"],"sourcesContent":["import { defineComponent, computed, h, provide } from 'vue'\nimport { buildProps } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\n\nexport const rowProps = buildProps({\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  justify: {\n    type: String,\n    values: [\n      'start',\n      'center',\n      'end',\n      'space-around',\n      'space-between',\n      'space-evenly',\n    ],\n    default: 'start',\n  },\n  align: {\n    type: String,\n    values: ['top', 'middle', 'bottom'],\n    default: 'top',\n  },\n} as const)\nexport type RowProps = ExtractPropTypes<typeof rowProps>\n\nconst Row = defineComponent({\n  name: 'ElRow',\n  props: rowProps,\n\n  setup(props, { slots }) {\n    const ns = useNamespace('row')\n\n    const gutter = computed(() => props.gutter)\n    provide('ElRow', {\n      gutter,\n    })\n\n    const style = computed(() => {\n      const styles: CSSProperties = {\n        marginLeft: '',\n        marginRight: '',\n      }\n      if (props.gutter) {\n        styles.marginLeft = `-${props.gutter / 2}px`\n        styles.marginRight = styles.marginLeft\n      }\n      return styles\n    })\n\n    return () =>\n      h(\n        props.tag,\n        {\n          class: [\n            ns.b(),\n            ns.is(`justify-${props.justify}`, props.justify !== 'start'),\n            ns.is(`align-${props.align}`, props.align !== 'top'),\n          ],\n          style: style.value,\n        },\n        slots.default?.()\n      )\n  },\n})\n\nexport default Row\nexport type RowInstance = InstanceType<typeof Row>\n"],"names":["buildProps","defineComponent","useNamespace","computed","provide","h"],"mappings":";;;;;;;;;;AAGY,MAAC,QAAQ,GAAGA,gBAAU,CAAC;AACnC,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE;AACZ,MAAM,OAAO;AACb,MAAM,QAAQ;AACd,MAAM,KAAK;AACX,MAAM,cAAc;AACpB,MAAM,eAAe;AACrB,MAAM,cAAc;AACpB,KAAK;AACL,IAAI,OAAO,EAAE,OAAO;AACpB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,MAAM,EAAE,CAAC,KAAK,EAAE,QAAQ,EAAE,QAAQ,CAAC;AACvC,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC,EAAE;AACE,MAAC,GAAG,GAAGC,mBAAe,CAAC;AAC5B,EAAE,IAAI,EAAE,OAAO;AACf,EAAE,KAAK,EAAE,QAAQ;AACjB,EAAE,KAAK,CAAC,KAAK,EAAE,EAAE,KAAK,EAAE,EAAE;AAC1B,IAAI,MAAM,EAAE,GAAGC,kBAAY,CAAC,KAAK,CAAC,CAAC;AACnC,IAAI,MAAM,MAAM,GAAGC,YAAQ,CAAC,MAAM,KAAK,CAAC,MAAM,CAAC,CAAC;AAChD,IAAIC,WAAO,CAAC,OAAO,EAAE;AACrB,MAAM,MAAM;AACZ,KAAK,CAAC,CAAC;AACP,IAAI,MAAM,KAAK,GAAGD,YAAQ,CAAC,MAAM;AACjC,MAAM,MAAM,MAAM,GAAG;AACrB,QAAQ,UAAU,EAAE,EAAE;AACtB,QAAQ,WAAW,EAAE,EAAE;AACvB,OAAO,CAAC;AACR,MAAM,IAAI,KAAK,CAAC,MAAM,EAAE;AACxB,QAAQ,MAAM,CAAC,UAAU,GAAG,CAAC,CAAC,EAAE,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,EAAE,CAAC,CAAC;AACrD,QAAQ,MAAM,CAAC,WAAW,GAAG,MAAM,CAAC,UAAU,CAAC;AAC/C,OAAO;AACP,MAAM,OAAO,MAAM,CAAC;AACpB,KAAK,CAAC,CAAC;AACP,IAAI,OAAO,MAAM;AACjB,MAAM,IAAI,EAAE,CAAC;AACb,MAAM,OAAOE,KAAC,CAAC,KAAK,CAAC,GAAG,EAAE;AAC1B,QAAQ,KAAK,EAAE;AACf,UAAU,EAAE,CAAC,CAAC,EAAE;AAChB,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,QAAQ,EAAE,KAAK,CAAC,OAAO,CAAC,CAAC,EAAE,KAAK,CAAC,OAAO,KAAK,OAAO,CAAC;AACtE,UAAU,EAAE,CAAC,EAAE,CAAC,CAAC,MAAM,EAAE,KAAK,CAAC,KAAK,CAAC,CAAC,EAAE,KAAK,CAAC,KAAK,KAAK,KAAK,CAAC;AAC9D,SAAS;AACT,QAAQ,KAAK,EAAE,KAAK,CAAC,KAAK;AAC1B,OAAO,EAAE,CAAC,EAAE,GAAG,KAAK,CAAC,OAAO,KAAK,IAAI,GAAG,KAAK,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC;AACjE,KAAK,CAAC;AACN,GAAG;AACH,CAAC;;;;;"}
+{"version":3,"file":"row.js","sources":["../../../../../../packages/components/row/src/row.tsx"],"sourcesContent":["import { defineComponent, computed, provide } from 'vue'\nimport { buildProps } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { rowContextKey } from '@element-plus/tokens'\nimport type { ExtractPropTypes, CSSProperties } from 'vue'\n\nexport const rowProps = buildProps({\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  gutter: {\n    type: Number,\n    default: 0,\n  },\n  justify: {\n    type: String,\n    values: [\n      'start',\n      'center',\n      'end',\n      'space-around',\n      'space-between',\n      'space-evenly',\n    ],\n    default: 'start',\n  },\n  align: {\n    type: String,\n    values: ['top', 'middle', 'bottom'],\n    default: 'top',\n  },\n} as const)\nexport type RowProps = ExtractPropTypes<typeof rowProps>\n\nconst Row = defineComponent({\n  name: 'ElRow',\n  props: rowProps,\n\n  setup(props, { slots }) {\n    const ns = useNamespace('row')\n\n    const gutter = computed(() => props.gutter)\n    provide(rowContextKey, {\n      gutter,\n    })\n\n    const style = computed(() => {\n      const styles: CSSProperties = {\n        marginLeft: '',\n        marginRight: '',\n      }\n      if (props.gutter) {\n        styles.marginLeft = `-${props.gutter / 2}px`\n        styles.marginRight = styles.marginLeft\n      }\n      return styles\n    })\n\n    return () => (\n      <props.tag\n        class={[\n          ns.b(),\n          ns.is(`justify-${props.justify}`, props.justify !== 'start'),\n          ns.is(`align-${props.align}`, props.align !== 'top'),\n        ]}\n        style={style.value}\n      >\n        {slots.default?.()}\n      </props.tag>\n    )\n  },\n})\n\nexport default Row\nexport type RowInstance = InstanceType<typeof Row>\n"],"names":["rowProps","buildProps","tag","type","String","default","gutter","Number","justify","values","align","Row","defineComponent","name","props","setup","slots","useNamespace","ns","computed","provide","rowContextKey","marginLeft","marginRight","styles","style"],"mappings":";;;;;;;;;;;;AAMaA,MAAAA,QAAQ,GAAGC,gBAAU,CAAC;AACjCC,EAAAA,GAAG,EAAE;AACHC,IAAAA,IAAI,EAAEC,MADH;AAEHC,IAAAA,OAAO,EAAE,KAAA;AAFN,GAD4B;AAKjCC,EAAAA,MAAM,EAAE;AACNH,IAAAA,IAAI,EAAEI,MADA;AAENF,IAAAA,OAAO,EAAE,CAAA;AAFH,GALyB;AASjCG,EAAAA,OAAO,EAAE;AACPL,IAAAA,IAAI,EAAEC,MADC;AAEPK,IAAAA,MAAM,EAAE,CACN,OADM,EAEN,QAFM,EAGN,KAHM,EAIN,cAJM,EAKN,eALM,EAMN,cANM,CAFD;AAUPJ,IAAAA,OAAO,EAAE,OAAA;AAVF,GATwB;AAqBjCK,EAAAA,KAAK,EAAE;AACLP,IAAAA,IAAI,EAAEC,MADD;AAELK,IAAAA,MAAM,EAAE,CAAC,KAAD,EAAQ,QAAR,EAAkB,QAAlB,CAFH;AAGLJ,IAAAA,OAAO,EAAE,KAAA;AAHJ,GAAA;AArB0B,CAAD,EAA3B;AA6BDM,MAAAA,GAAG,GAAGC,mBAAe,CAAC;AAC1BC,EAAAA,IAAI,EAAE,OADoB;AAE1BC,EAAAA,KAAK,EAAEd,QAFmB;;AAI1Be,IAAAA,KAAMD;AAASE,GAAAA,EAAAA;AAAF,IAAW,MAAA,EAAA,GAAAC,kBAAA,CAAA,KAAA,CAAA,CAAA;AACtB,IAAA,MAAMC,MAAiB,GAAAC,YAAA,CAAC,MAAxB,KAAA,CAAA,MAAA,CAAA,CAAA;AAEA,IAAMb,WAAAA,CAAAA,iBAAiB,EAAA;AACvBc,MAAAA,MAAQC;AACNf,KAAAA,CAAAA,CAAAA;AADqB,IAAA,MAAvB,KAAA,GAAAa,YAAA,CAAA,MAAA;AAIA,MAAA,MAAW,MAAGA,GAAQ;AACpB,QAAA,UAA2B,EAAG,EAAA;AAC5BG,QAAAA,aAD4B,EAAA;AAE5BC,OAAAA,CAAAA;AAF4B,MAA9B,IAAA,KAAA,CAAA,MAAA,EAAA;;AAIA,QAAIT,MAAAA,CAAK,WAAS,GAAA,MAAA,CAAA,UAAA,CAAA;AAChBU,OAAAA;AACAA,MAAAA,aAAOD,CAAAA;AACR,KAAA,CAAA,CAAA;;AACD,MAAA,OAAOC,EAAP,CAAA,EAAA,CAAA,CAAA,EAAA,EAAA,EAAA,CAAA,EAAA,CAAA,CAAA,QAAA,EAAA,KAAA,CAAA,OAAA,CAAA,CAAA,EAAA,KAAA,CAAA,OAAA,KAAA,OAAA,CAAA,EAAA,EAAA,CAAA,EAAA,CAAA,CAAA,MAAA,EAAA,KAAA,CAAA,KAAA,CAAA,CAAA,EAAA,KAAA,CAAA,KAAA,KAAA,KAAA,CAAA,CAAA;AACD,MAVD,OAAA,EAAA,KAAA,CAAA,KAAA;AAYA,KAAO,EAAA;AAAA,MAAA,OAAA,EAEI,MACL;AAHC,QAAA,IAAA,EAAA,CAOIC;AAPJ,QAAA,OAAA,CAAA,CAAA,EAAA,GAAA,KAAA,CAAA,OAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,IAAA,CAAA,KAAA,CAAA,CAAA,CAAA;AAAA,OASFT;AATE,KAAP,CAAA,CAAA;AAYD,GAAA;;;;;;"}

package/lib/components/scrollbar/index.d.ts

@@ -5,7 +5,7 @@ export declare const ElScrollbar: import("element-plus/es/utils").SFCWithInstall
     readonly wrapStyle: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<import("vue").StyleValue>, "", unknown, unknown, unknown>;
     readonly wrapClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
     readonly viewClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
-    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
+    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], "", unknown, unknown, unknown>;
     readonly noresize: BooleanConstructor;
     readonly tag: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly always: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
@@ -52,7 +52,7 @@ export declare const ElScrollbar: import("element-plus/es/utils").SFCWithInstall
     readonly wrapStyle: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<import("vue").StyleValue>, "", unknown, unknown, unknown>;
     readonly wrapClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
     readonly viewClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
-    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
+    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], "", unknown, unknown, unknown>;
     readonly noresize: BooleanConstructor;
     readonly tag: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly always: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
@@ -70,7 +70,7 @@ export declare const ElScrollbar: import("element-plus/es/utils").SFCWithInstall
     wrapStyle: import("vue").StyleValue;
     wrapClass: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
     viewClass: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
-    viewStyle: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
+    viewStyle: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], unknown, unknown>;
     tag: string;
     minSize: number;
     noresize: boolean;

package/lib/components/scrollbar/src/bar2.js.map

@@ -1 +1 @@
-{"version":3,"file":"bar2.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue"],"sourcesContent":["<template>\n  <thumb :move=\"moveX\" :ratio=\"ratioX\" :size=\"width\" :always=\"always\" />\n  <thumb\n    :move=\"moveY\"\n    :ratio=\"ratioY\"\n    :size=\"height\"\n    vertical\n    :always=\"always\"\n  />\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport Thumb from './thumb.vue'\nimport { barProps } from './bar'\n\nexport default defineComponent({\n  components: {\n    Thumb,\n  },\n  props: barProps,\n  setup(props) {\n    const moveX = ref(0)\n    const moveY = ref(0)\n    const GAP = 4 // top 2 + bottom 2 of bar instance\n\n    const handleScroll = (wrap: HTMLDivElement) => {\n      if (wrap) {\n        const offsetHeight = wrap.offsetHeight - GAP\n        const offsetWidth = wrap.offsetWidth - GAP\n\n        moveY.value = ((wrap.scrollTop * 100) / offsetHeight) * props.ratioY\n        moveX.value = ((wrap.scrollLeft * 100) / offsetWidth) * props.ratioX\n      }\n    }\n\n    return {\n      handleScroll,\n      moveX,\n      moveY,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","Thumb","barProps","ref","_createVNode"],"mappings":";;;;;;;;;AAeA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,YAAY;AAAA,WACVC;AAAA;AAAA,EAEF,OAAOC;AAAA,EACP,MAAM,OAAO;AACX,UAAM,QAAQC,QAAI;AAClB,UAAM,QAAQA,QAAI;AAClB,UAAM,MAAM;AAEZ,UAAM,eAAe,CAAC,SAAyB;AAC7C,UAAI,MAAM;AACR,cAAM,eAAe,KAAK,eAAe;AACzC,cAAM,cAAc,KAAK,cAAc;AAEvC,cAAM,QAAU,KAAK,YAAY,MAAO,eAAgB,MAAM;AAC9D,cAAM,QAAU,KAAK,aAAa,MAAO,cAAe,MAAM;AAAA;AAAA;AAIlE,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;;IArCJC,gBAAsE;AAAA,MAA9D,MAAM;AAAA,MAAQ,OAAO;AAAA,MAAS,MAAM;AAAA,MAAQ,QAAQ;AAAA;IAC5DA,gBAME;AAAA,MALC,MAAM;AAAA,MACN,OAAO;AAAA,MACP,MAAM;AAAA,MACP;AAAA,MACC,QAAQ;AAAA;;;;;;;"}
+{"version":3,"file":"bar2.js","sources":["../../../../../../packages/components/scrollbar/src/bar.vue"],"sourcesContent":["<template>\n  <thumb :move=\"moveX\" :ratio=\"ratioX\" :size=\"width\" :always=\"always\" />\n  <thumb\n    :move=\"moveY\"\n    :ratio=\"ratioY\"\n    :size=\"height\"\n    vertical\n    :always=\"always\"\n  />\n</template>\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport Thumb from './thumb.vue'\nimport { barProps } from './bar'\n\nexport default defineComponent({\n  components: {\n    Thumb,\n  },\n  props: barProps,\n  setup(props) {\n    const moveX = ref(0)\n    const moveY = ref(0)\n    const GAP = 4 // top 2 + bottom 2 of bar instance\n\n    const handleScroll = (wrap: HTMLDivElement) => {\n      if (wrap) {\n        const offsetHeight = wrap.offsetHeight - GAP\n        const offsetWidth = wrap.offsetWidth - GAP\n\n        moveY.value = ((wrap.scrollTop * 100) / offsetHeight) * props.ratioY\n        moveX.value = ((wrap.scrollLeft * 100) / offsetWidth) * props.ratioX\n      }\n    }\n\n    return {\n      handleScroll,\n      moveX,\n      moveY,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","Thumb","barProps","ref","_createVNode"],"mappings":";;;;;;;;;AAeA,MAAK,YAAaA,mBAAa,CAAA;AAAA,EAC7B,UAAY,EAAA;AAAA,WACVC,gBAAA;AAAA,GAAA;AAAA,EAEF,KAAO,EAAAC,YAAA;AAAA,EACP,MAAM,KAAO,EAAA;AACX,IAAA,MAAM,QAAQC,OAAI,CAAA,CAAA,CAAA,CAAA;AAClB,IAAA,MAAM,QAAQA,OAAI,CAAA,CAAA,CAAA,CAAA;AAClB,IAAA,MAAM,GAAM,GAAA,CAAA,CAAA;AAEZ,IAAM,MAAA,YAAA,GAAe,CAAC,IAAyB,KAAA;AAC7C,MAAA,IAAI,IAAM,EAAA;AACR,QAAM,MAAA,YAAA,GAAe,KAAK,YAAe,GAAA,GAAA,CAAA;AACzC,QAAM,MAAA,WAAA,GAAc,KAAK,WAAc,GAAA,GAAA,CAAA;AAEvC,QAAA,KAAA,CAAM,KAAU,GAAA,IAAA,CAAK,SAAY,GAAA,GAAA,GAAO,eAAgB,KAAM,CAAA,MAAA,CAAA;AAC9D,QAAA,KAAA,CAAM,KAAU,GAAA,IAAA,CAAK,UAAa,GAAA,GAAA,GAAO,cAAe,KAAM,CAAA,MAAA,CAAA;AAAA,OAAA;AAAA,KAAA,CAAA;AAIlE,IAAO,OAAA;AAAA,MACL,YAAA;AAAA,MACA,KAAA;AAAA,MACA,KAAA;AAAA,KAAA,CAAA;AAAA,GAAA;AAAA,CAAA,CAAA,CAAA;;;;IArCJC,eAAsE,CAAA,gBAAA,EAAA;AAAA,MAA9D,IAAM,EAAA,IAAA,CAAA,KAAA;AAAA,MAAQ,KAAO,EAAA,IAAA,CAAA,MAAA;AAAA,MAAS,IAAM,EAAA,IAAA,CAAA,KAAA;AAAA,MAAQ,MAAQ,EAAA,IAAA,CAAA,MAAA;AAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,CAAA,CAAA;IAC5DA,eAME,CAAA,gBAAA,EAAA;AAAA,MALC,IAAM,EAAA,IAAA,CAAA,KAAA;AAAA,MACN,KAAO,EAAA,IAAA,CAAA,MAAA;AAAA,MACP,IAAM,EAAA,IAAA,CAAA,MAAA;AAAA,MACP,QAAA,EAAA,EAAA;AAAA,MACC,MAAQ,EAAA,IAAA,CAAA,MAAA;AAAA,KAAA,EAAA,IAAA,EAAA,CAAA,EAAA,CAAA,MAAA,EAAA,OAAA,EAAA,MAAA,EAAA,QAAA,CAAA,CAAA;;;;;;;"}

package/lib/components/scrollbar/src/scrollbar.d.ts

@@ -6,7 +6,7 @@ export declare const scrollbarProps: {
     readonly wrapStyle: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<StyleValue>, "", unknown, unknown, unknown>;
     readonly wrapClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
     readonly viewClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
-    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
+    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], "", unknown, unknown, unknown>;
     readonly noresize: BooleanConstructor;
     readonly tag: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly always: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;

package/lib/components/scrollbar/src/scrollbar.js

@@ -32,7 +32,7 @@ const scrollbarProps = props.buildProps({
     default: ""
   },
   viewStyle: {
-    type: [String, Array],
+    type: [String, Array, Object],
     default: ""
   },
   noresize: Boolean,

package/lib/components/scrollbar/src/scrollbar.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.js","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.ts"],"sourcesContent":["import { buildProps, definePropType, isNumber } from '@element-plus/utils'\nimport type { StyleValue, ExtractPropTypes } from 'vue'\n\nexport const scrollbarProps = buildProps({\n  height: {\n    type: [String, Number],\n    default: '',\n  },\n  maxHeight: {\n    type: [String, Number],\n    default: '',\n  },\n  native: {\n    type: Boolean,\n    default: false,\n  },\n  wrapStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n    default: '',\n  },\n  wrapClass: {\n    type: [String, Array],\n    default: '',\n  },\n  viewClass: {\n    type: [String, Array],\n    default: '',\n  },\n  viewStyle: {\n    type: [String, Array],\n    default: '',\n  },\n  noresize: Boolean, // 如果 container 尺寸不会发生变化，最好设置它可以优化性能\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  always: {\n    type: Boolean,\n    default: false,\n  },\n  minSize: {\n    type: Number,\n    default: 20,\n  },\n} as const)\n\nexport type ScrollbarProps = ExtractPropTypes<typeof scrollbarProps>\n\nexport const scrollbarEmits = {\n  scroll: ({\n    scrollTop,\n    scrollLeft,\n  }: {\n    scrollTop: number\n    scrollLeft: number\n  }) => isNumber(scrollTop) && isNumber(scrollLeft),\n}\nexport type ScrollbarEmits = typeof scrollbarEmits\n"],"names":["buildProps","definePropType","isNumber"],"mappings":";;;;;;;;AACY,MAAC,cAAc,GAAGA,gBAAU,CAAC;AACzC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,MAAM,EAAE,CAAC;AACX,IAAI,SAAS;AACb,IAAI,UAAU;AACd,GAAG,KAAKC,aAAQ,CAAC,SAAS,CAAC,IAAIA,aAAQ,CAAC,UAAU,CAAC;AACnD;;;;;"}
+{"version":3,"file":"scrollbar.js","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.ts"],"sourcesContent":["import { buildProps, definePropType, isNumber } from '@element-plus/utils'\nimport type { StyleValue, ExtractPropTypes } from 'vue'\n\nexport const scrollbarProps = buildProps({\n  height: {\n    type: [String, Number],\n    default: '',\n  },\n  maxHeight: {\n    type: [String, Number],\n    default: '',\n  },\n  native: {\n    type: Boolean,\n    default: false,\n  },\n  wrapStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n    default: '',\n  },\n  wrapClass: {\n    type: [String, Array],\n    default: '',\n  },\n  viewClass: {\n    type: [String, Array],\n    default: '',\n  },\n  viewStyle: {\n    type: [String, Array, Object],\n    default: '',\n  },\n  noresize: Boolean, // 如果 container 尺寸不会发生变化，最好设置它可以优化性能\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  always: {\n    type: Boolean,\n    default: false,\n  },\n  minSize: {\n    type: Number,\n    default: 20,\n  },\n} as const)\n\nexport type ScrollbarProps = ExtractPropTypes<typeof scrollbarProps>\n\nexport const scrollbarEmits = {\n  scroll: ({\n    scrollTop,\n    scrollLeft,\n  }: {\n    scrollTop: number\n    scrollLeft: number\n  }) => isNumber(scrollTop) && isNumber(scrollLeft),\n}\nexport type ScrollbarEmits = typeof scrollbarEmits\n"],"names":["buildProps","definePropType","isNumber"],"mappings":";;;;;;;;AACY,MAAC,cAAc,GAAGA,gBAAU,CAAC;AACzC,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAEC,oBAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,CAAC;AACzB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,KAAK,EAAE,MAAM,CAAC;AACjC,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,GAAG,EAAE;AACP,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,MAAM,EAAE,CAAC;AACX,IAAI,SAAS;AACb,IAAI,UAAU;AACd,GAAG,KAAKC,aAAQ,CAAC,SAAS,CAAC,IAAIA,aAAQ,CAAC,UAAU,CAAC;AACnD;;;;;"}

package/lib/components/scrollbar/src/scrollbar.vue.d.ts

@@ -6,7 +6,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly wrapStyle: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<StyleValue>, "", unknown, unknown, unknown>;
     readonly wrapClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
     readonly viewClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
-    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
+    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], "", unknown, unknown, unknown>;
     readonly noresize: BooleanConstructor;
     readonly tag: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly always: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
@@ -53,7 +53,7 @@ declare const _default: import("vue").DefineComponent<{
     readonly wrapStyle: import("element-plus/es/utils").BuildPropReturn<import("element-plus/es/utils").PropWrapper<StyleValue>, "", unknown, unknown, unknown>;
     readonly wrapClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
     readonly viewClass: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
-    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor], "", unknown, unknown, unknown>;
+    readonly viewStyle: import("element-plus/es/utils").BuildPropReturn<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], "", unknown, unknown, unknown>;
     readonly noresize: BooleanConstructor;
     readonly tag: import("element-plus/es/utils").BuildPropReturn<StringConstructor, "div", unknown, unknown, unknown>;
     readonly always: import("element-plus/es/utils").BuildPropReturn<BooleanConstructor, false, unknown, unknown, unknown>;
@@ -71,7 +71,7 @@ declare const _default: import("vue").DefineComponent<{
     wrapStyle: StyleValue;
     wrapClass: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
     viewClass: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
-    viewStyle: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor], unknown, unknown>;
+    viewStyle: import("element-plus/es/utils").BuildPropType<readonly [StringConstructor, ArrayConstructor, ObjectConstructor], unknown, unknown>;
     tag: string;
     minSize: number;
     noresize: boolean;

package/lib/components/scrollbar/src/scrollbar2.js.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar2.js","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.vue"],"sourcesContent":["<template>\n  <div ref=\"scrollbar$\" :class=\"ns.b()\">\n    <div\n      ref=\"wrap$\"\n      :class=\"[\n        wrapClass,\n        ns.e('wrap'),\n        { [ns.em('wrap', 'hidden-default')]: !native },\n      ]\"\n      :style=\"style\"\n      @scroll=\"handleScroll\"\n    >\n      <component\n        :is=\"tag\"\n        ref=\"resize$\"\n        :class=\"[ns.e('view'), viewClass]\"\n        :style=\"viewStyle\"\n      >\n        <slot />\n      </component>\n    </div>\n    <template v-if=\"!native\">\n      <bar\n        ref=\"barRef\"\n        :height=\"sizeHeight\"\n        :width=\"sizeWidth\"\n        :always=\"always\"\n        :ratio-x=\"ratioX\"\n        :ratio-y=\"ratioY\"\n      ></bar>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onMounted,\n  provide,\n  ref,\n  watch,\n  reactive,\n} from 'vue'\nimport { useResizeObserver, useEventListener } from '@vueuse/core'\nimport { isNumber, debugWarn, addUnit } from '@element-plus/utils'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { useNamespace } from '@element-plus/hooks'\nimport Bar from './bar.vue'\n\nimport { scrollbarProps, scrollbarEmits } from './scrollbar'\nimport type { StyleValue, CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElScrollbar',\n  components: {\n    Bar,\n  },\n  props: scrollbarProps,\n  emits: scrollbarEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('scrollbar')\n\n    let stopResizeObserver: (() => void) | undefined = undefined\n    let stopResizeListener: (() => void) | undefined = undefined\n\n    const scrollbar$ = ref<HTMLDivElement>()\n    const wrap$ = ref<HTMLDivElement>()\n    const resize$ = ref<HTMLElement>()\n\n    const sizeWidth = ref('0')\n    const sizeHeight = ref('0')\n    const barRef = ref()\n    const moveX = ref(0)\n    const moveY = ref(0)\n    const ratioY = ref(1)\n    const ratioX = ref(1)\n    const SCOPE = 'ElScrollbar'\n    const GAP = 4 // top 2 + bottom 2 of bar instance\n\n    const style = computed<StyleValue>(() => {\n      const style: CSSProperties = {}\n      if (props.height) style.height = addUnit(props.height)\n      if (props.maxHeight) style.maxHeight = addUnit(props.maxHeight)\n      return [props.wrapStyle, style]\n    })\n\n    const handleScroll = () => {\n      if (wrap$.value) {\n        barRef.value?.handleScroll(wrap$.value)\n\n        emit('scroll', {\n          scrollTop: wrap$.value.scrollTop,\n          scrollLeft: wrap$.value.scrollLeft,\n        })\n      }\n    }\n\n    const setScrollTop = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrap$.value!.scrollTop = value\n    }\n\n    const setScrollLeft = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrap$.value!.scrollLeft = value\n    }\n\n    const update = () => {\n      if (!wrap$.value) return\n      const offsetHeight = wrap$.value.offsetHeight - GAP\n      const offsetWidth = wrap$.value.offsetWidth - GAP\n\n      const originalHeight = offsetHeight ** 2 / wrap$.value.scrollHeight\n      const originalWidth = offsetWidth ** 2 / wrap$.value.scrollWidth\n      const height = Math.max(originalHeight, props.minSize)\n      const width = Math.max(originalWidth, props.minSize)\n\n      ratioY.value =\n        originalHeight /\n        (offsetHeight - originalHeight) /\n        (height / (offsetHeight - height))\n      ratioX.value =\n        originalWidth /\n        (offsetWidth - originalWidth) /\n        (width / (offsetWidth - width))\n\n      sizeHeight.value = height + GAP < offsetHeight ? `${height}px` : ''\n      sizeWidth.value = width + GAP < offsetWidth ? `${width}px` : ''\n    }\n\n    watch(\n      () => props.noresize,\n      (noresize) => {\n        if (noresize) {\n          stopResizeObserver?.()\n          stopResizeListener?.()\n        } else {\n          ;({ stop: stopResizeObserver } = useResizeObserver(resize$, update))\n          stopResizeListener = useEventListener('resize', update)\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => [props.maxHeight, props.height],\n      () => {\n        if (!props.native)\n          nextTick(() => {\n            update()\n            if (wrap$.value) {\n              barRef.value?.handleScroll(wrap$.value)\n            }\n          })\n      }\n    )\n\n    provide(\n      scrollbarContextKey,\n      reactive({\n        scrollbarElement: scrollbar$,\n        wrapElement: wrap$,\n      })\n    )\n\n    onMounted(() => {\n      if (!props.native) nextTick(() => update())\n    })\n\n    return {\n      ns,\n      scrollbar$,\n      wrap$,\n      resize$,\n      barRef,\n      moveX,\n      moveY,\n      ratioX,\n      ratioY,\n      sizeWidth,\n      sizeHeight,\n      style,\n      update,\n      handleScroll,\n      setScrollTop,\n      setScrollLeft,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","Bar","scrollbarProps","scrollbarEmits","useNamespace","ref","style","computed","addUnit"],"mappings":";;;;;;;;;;;;;;;;;AAqDA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,YAAY;AAAA,SACVC;AAAA;AAAA,EAEF,OAAOC;AAAA,EACP,OAAOC;AAAA,EAEP,MAAM,OAAO,EAAE,QAAQ;AACrB,UAAM,KAAKC,mBAAa;AAExB,QAAI,qBAA+C;AACnD,QAAI,qBAA+C;AAEnD,UAAM,aAAaC;AACnB,UAAM,QAAQA;AACd,UAAM,UAAUA;AAEhB,UAAM,YAAYA,QAAI;AACtB,UAAM,aAAaA,QAAI;AACvB,UAAM,SAASA;AACf,UAAM,QAAQA,QAAI;AAClB,UAAM,QAAQA,QAAI;AAClB,UAAM,SAASA,QAAI;AACnB,UAAM,SAASA,QAAI;AACnB,UAAM,QAAQ;AACd,UAAM,MAAM;AAEZ,UAAMC,UAAQC,aAAqB,MAAM;AACvC,YAAM,SAAuB;AAC7B,UAAI,MAAM;AAAQ,eAAM,SAASC,cAAQ,MAAM;AAC/C,UAAI,MAAM;AAAW,eAAM,YAAYA,cAAQ,MAAM;AACrD,aAAO,CAAC,MAAM,WAAW;AAAA;AAG3B,UAAM,eAAe,MAAM;AACzB,UAAI;AACF,eAAO;AAEP;AAAe,qBACF;AAAY,UACvB;AAAwB;AAAA;AAAA;AAK9B;AACE,UAAI;AACF,8BAAiB;AACjB;AAAA;AAEF;AAAyB;AAG3B;AACE,UAAI;AACF,8BAAiB;AACjB;AAAA;AAEF;AAA0B;AAG5B;AACE,UAAI;AAAc;AAClB;AACA,YAAM,oBAAoB,MAAM;AAEhC,YAAM,qCAAqC,MAAM;AACjD,YAAM;AACN,YAAM,wCAAwC;AAC9C,YAAM,aAAa,IAAI,eAAe;AAEtC;AAIA,aAAO,QACL,gDAEC;AAEH,kCAA4B;AAC5B,gBAAU,oCAAoC,GAAG,YAAY;AAAA;AAG/D;AAGI,cAAI;AACF;AACA;AAAA;AAEA;AAAC,QAAC;AACF;AAAgD;AAAA,OAGpD;AAGF;AAGI,cAAI,OAAO;AACT,iBAAS,MAAM;AACb;AACA,cAAI;AACF,mBAAO;AAA0B;AAAA;AAAA;AAM3C;AAEW,MACP;AAAkB;AACL;AAIjB;AACE;AAAmB;AAAe;AAGpC;AAAO,MACL;AAAA;AACA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,aACAF;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;2CAlKE;AAAA;AA9BG;AAAwB;IAC/B;AAkBM;AAjBA;AACE;AAAY;AAAuB,sBAA0B;AAA8B;AAAA;AAKzF;AACC;2DAGF;AAAG;AACJ;AACmB,QACtB;AAAO;;AAEA;AAAA;AAAA;;;;AAWH;;AAND,MACH;AAAQ,MACR;AAAO,MACP,QAAQ;AAAA,MACR,WAAS;AAAA,MACT;AAAS;;;;;;;;;"}
+{"version":3,"file":"scrollbar2.js","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.vue"],"sourcesContent":["<template>\n  <div ref=\"scrollbar$\" :class=\"ns.b()\">\n    <div\n      ref=\"wrap$\"\n      :class=\"[\n        wrapClass,\n        ns.e('wrap'),\n        { [ns.em('wrap', 'hidden-default')]: !native },\n      ]\"\n      :style=\"style\"\n      @scroll=\"handleScroll\"\n    >\n      <component\n        :is=\"tag\"\n        ref=\"resize$\"\n        :class=\"[ns.e('view'), viewClass]\"\n        :style=\"viewStyle\"\n      >\n        <slot />\n      </component>\n    </div>\n    <template v-if=\"!native\">\n      <bar\n        ref=\"barRef\"\n        :height=\"sizeHeight\"\n        :width=\"sizeWidth\"\n        :always=\"always\"\n        :ratio-x=\"ratioX\"\n        :ratio-y=\"ratioY\"\n      ></bar>\n    </template>\n  </div>\n</template>\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  nextTick,\n  onMounted,\n  provide,\n  ref,\n  watch,\n  reactive,\n} from 'vue'\nimport { useResizeObserver, useEventListener } from '@vueuse/core'\nimport { isNumber, debugWarn, addUnit } from '@element-plus/utils'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { useNamespace } from '@element-plus/hooks'\nimport Bar from './bar.vue'\n\nimport { scrollbarProps, scrollbarEmits } from './scrollbar'\nimport type { StyleValue, CSSProperties } from 'vue'\n\nexport default defineComponent({\n  name: 'ElScrollbar',\n  components: {\n    Bar,\n  },\n  props: scrollbarProps,\n  emits: scrollbarEmits,\n\n  setup(props, { emit }) {\n    const ns = useNamespace('scrollbar')\n\n    let stopResizeObserver: (() => void) | undefined = undefined\n    let stopResizeListener: (() => void) | undefined = undefined\n\n    const scrollbar$ = ref<HTMLDivElement>()\n    const wrap$ = ref<HTMLDivElement>()\n    const resize$ = ref<HTMLElement>()\n\n    const sizeWidth = ref('0')\n    const sizeHeight = ref('0')\n    const barRef = ref()\n    const moveX = ref(0)\n    const moveY = ref(0)\n    const ratioY = ref(1)\n    const ratioX = ref(1)\n    const SCOPE = 'ElScrollbar'\n    const GAP = 4 // top 2 + bottom 2 of bar instance\n\n    const style = computed<StyleValue>(() => {\n      const style: CSSProperties = {}\n      if (props.height) style.height = addUnit(props.height)\n      if (props.maxHeight) style.maxHeight = addUnit(props.maxHeight)\n      return [props.wrapStyle, style]\n    })\n\n    const handleScroll = () => {\n      if (wrap$.value) {\n        barRef.value?.handleScroll(wrap$.value)\n\n        emit('scroll', {\n          scrollTop: wrap$.value.scrollTop,\n          scrollLeft: wrap$.value.scrollLeft,\n        })\n      }\n    }\n\n    const setScrollTop = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrap$.value!.scrollTop = value\n    }\n\n    const setScrollLeft = (value: number) => {\n      if (!isNumber(value)) {\n        debugWarn(SCOPE, 'value must be a number')\n        return\n      }\n      wrap$.value!.scrollLeft = value\n    }\n\n    const update = () => {\n      if (!wrap$.value) return\n      const offsetHeight = wrap$.value.offsetHeight - GAP\n      const offsetWidth = wrap$.value.offsetWidth - GAP\n\n      const originalHeight = offsetHeight ** 2 / wrap$.value.scrollHeight\n      const originalWidth = offsetWidth ** 2 / wrap$.value.scrollWidth\n      const height = Math.max(originalHeight, props.minSize)\n      const width = Math.max(originalWidth, props.minSize)\n\n      ratioY.value =\n        originalHeight /\n        (offsetHeight - originalHeight) /\n        (height / (offsetHeight - height))\n      ratioX.value =\n        originalWidth /\n        (offsetWidth - originalWidth) /\n        (width / (offsetWidth - width))\n\n      sizeHeight.value = height + GAP < offsetHeight ? `${height}px` : ''\n      sizeWidth.value = width + GAP < offsetWidth ? `${width}px` : ''\n    }\n\n    watch(\n      () => props.noresize,\n      (noresize) => {\n        if (noresize) {\n          stopResizeObserver?.()\n          stopResizeListener?.()\n        } else {\n          ;({ stop: stopResizeObserver } = useResizeObserver(resize$, update))\n          stopResizeListener = useEventListener('resize', update)\n        }\n      },\n      { immediate: true }\n    )\n\n    watch(\n      () => [props.maxHeight, props.height],\n      () => {\n        if (!props.native)\n          nextTick(() => {\n            update()\n            if (wrap$.value) {\n              barRef.value?.handleScroll(wrap$.value)\n            }\n          })\n      }\n    )\n\n    provide(\n      scrollbarContextKey,\n      reactive({\n        scrollbarElement: scrollbar$,\n        wrapElement: wrap$,\n      })\n    )\n\n    onMounted(() => {\n      if (!props.native) nextTick(() => update())\n    })\n\n    return {\n      ns,\n      scrollbar$,\n      wrap$,\n      resize$,\n      barRef,\n      moveX,\n      moveY,\n      ratioX,\n      ratioY,\n      sizeWidth,\n      sizeHeight,\n      style,\n      update,\n      handleScroll,\n      setScrollTop,\n      setScrollLeft,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","Bar","scrollbarProps","scrollbarEmits","useNamespace","ref","style","computed","addUnit","isNumber","debugWarn","watch","useEventListener","nextTick","provide","scrollbarContextKey","reactive","onMounted","_resolveComponent","_openBlock","_normalizeClass","_createElementVNode","_normalizeStyle","_createBlock","_resolveDynamicComponent","_withCtx","_renderSlot"],"mappings":"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"}

package/lib/components/scrollbar/src/thumb2.js.map

@@ -1 +1 @@
-{"version":3,"file":"thumb2.js","sources":["../../../../../../packages/components/scrollbar/src/thumb.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('fade')\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"[ns.e('bar'), ns.is(bar.key)]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        :class=\"ns.e('thumb')\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener, isClient } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { thumbProps } from './thumb'\n\nconst COMPONENT_NAME = 'Thumb'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: thumbProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    const ns = useNamespace('scrollbar')\n\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const thumbState = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let originalOnSelectStart:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = isClient ? document.onselectstart : null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      thumbState.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      originalOnSelectStart = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = thumbState.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      thumbState.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      restoreOnselectstart()\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() => {\n      restoreOnselectstart()\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    })\n\n    const restoreOnselectstart = () => {\n      if (document.onselectstart !== originalOnSelectStart)\n        document.onselectstart = originalOnSelectStart\n    }\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      ns,\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","thumbProps","scrollbar","inject","scrollbarContextKey","useNamespace","ref","isClient","computed","BAR_MAP","renderThumbStyle","toRef","_normalizeClass"],"mappings":";;;;;;;;;;;;;;;;AAmCA,MAAM,iBAAiB;AACvB,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,OAAOC;AAAA,EAEP,MAAM,OAAO;AACX,UAAMC,cAAYC,WAAOC;AACzB,UAAM,KAAKC,mBAAa;AAExB,QAAI,CAACH;AACH,uBAAW,gBAAgB;AAE7B,UAAM,WAAWI;AACjB,UAAM,QAAQA;AAEd,UAAM,aAAaA,QAAI;AACvB,UAAM,UAAUA,QAAI;AAEpB,QAAI,aAAa;AACjB,QAAI,cAAc;AAClB,QAAI,wBAEOC,gBAAW,SAAS,gBAAgB;AAE/C,UAAM,MAAMC,aACV,MAAMC,aAAQ,MAAM,WAAW,aAAa;AAG9C,UAAM,aAAaD,aAAS,MAC1BE,sBAAiB;AAAA,MACf,MAAM,MAAM;AAAA,MACZ,MAAM,MAAM;AAAA,MACZ,KAAK,IAAI;AAAA;AAIb,UAAM,cAAcF,aAClB,MAIE,SAAS,MAAO,IAAI,MAAM,WAAW,IACrCN,YAAU,YAAa,IAAI,MAAM,cACjC,MAAM,QACN,MAAM,MAAO,IAAI,MAAM;AAG3B,UAAM,oBAAoB,CAAC,MAAkB;AAE3C;AACA,uBAAiB;AAA2B;AAE5C;AACA;AAEA,iBAAW,EAAE;AACb;AAAS;AACT;AAE8D;AAGhE;AACE,UAAI,iBAAiB;AAA0C;AAE/D;AAIA,YAAM,kBAAkB;AACxB,YAAM;AAIN,sCAAgC,UAC7B,oCACW,YAAY,UAAU,cAClC;AAAA;AAGJ;AACE;AACA;AACA;AACA,eAAS,iBAAiB,WAAW;AACrC;AACA;AAA+B;AAGjC;AACE,UAAI;AAAiC;AACrC;AAA0B;AAE1B;AACA;AAAe;AAEf;AAIA,YAAM,qDAAqD;AAC3D,YAAM,0BACF,UAAS;AAEb,sCAAgC,UAC7B,gDACuB,wBACxB;AAAA;AAGJ;AACE;AACA;AACA;AACA,eAAS,oBAAoB,WAAW;AACxC;AACA;AAAiB;AAAgB;AAGnC;AACE;AACA;AAAwB;AAG1B;AACE;AACA;AAAgB;AAGlB;AACE;AACA;AAAwC;AAG1C;AACE,UAAI;AACF;AAAyB;AAG7B;AAKA,0BACES,UAAMT,aAAW,qBACjB;AAIF;AAAO;AACL,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;;AAlLS;AAdU;;AAaf,yBAZN;AAYM;AAVA,QACH;AAA+B,QAC/B,uDAAW;AAAA;;AAOL;AAJD,UACH;AAAW,UACX,OAAKU,mBAAE;AAAA,UACP;AAAW;;;AATI;AAAA;AAAA;;;;;;;;"}
+{"version":3,"file":"thumb2.js","sources":["../../../../../../packages/components/scrollbar/src/thumb.vue"],"sourcesContent":["<template>\n  <transition :name=\"ns.b('fade')\">\n    <div\n      v-show=\"always || visible\"\n      ref=\"instance\"\n      :class=\"[ns.e('bar'), ns.is(bar.key)]\"\n      @mousedown=\"clickTrackHandler\"\n    >\n      <div\n        ref=\"thumb\"\n        :class=\"ns.e('thumb')\"\n        :style=\"thumbStyle\"\n        @mousedown=\"clickThumbHandler\"\n      ></div>\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\">\nimport {\n  computed,\n  defineComponent,\n  inject,\n  onBeforeUnmount,\n  ref,\n  toRef,\n} from 'vue'\nimport { useEventListener, isClient } from '@vueuse/core'\nimport { scrollbarContextKey } from '@element-plus/tokens'\nimport { throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { BAR_MAP, renderThumbStyle } from './util'\n\nimport { thumbProps } from './thumb'\n\nconst COMPONENT_NAME = 'Thumb'\nexport default defineComponent({\n  name: COMPONENT_NAME,\n  props: thumbProps,\n\n  setup(props) {\n    const scrollbar = inject(scrollbarContextKey)\n    const ns = useNamespace('scrollbar')\n\n    if (!scrollbar)\n      throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\n    const instance = ref<HTMLDivElement>()\n    const thumb = ref<HTMLDivElement>()\n\n    const thumbState = ref({})\n    const visible = ref(false)\n\n    let cursorDown = false\n    let cursorLeave = false\n    let originalOnSelectStart:\n      | ((this: GlobalEventHandlers, ev: Event) => any)\n      | null = isClient ? document.onselectstart : null\n\n    const bar = computed(\n      () => BAR_MAP[props.vertical ? 'vertical' : 'horizontal']\n    )\n\n    const thumbStyle = computed(() =>\n      renderThumbStyle({\n        size: props.size,\n        move: props.move,\n        bar: bar.value,\n      })\n    )\n\n    const offsetRatio = computed(\n      () =>\n        // offsetRatioX = original width of thumb / current width of thumb / ratioX\n        // offsetRatioY = original height of thumb / current height of thumb / ratioY\n        // instance height = wrap height - GAP\n        instance.value![bar.value.offset] ** 2 /\n        scrollbar.wrapElement![bar.value.scrollSize] /\n        props.ratio /\n        thumb.value![bar.value.offset]\n    )\n\n    const clickThumbHandler = (e: MouseEvent) => {\n      // prevent click event of middle and right button\n      e.stopPropagation()\n      if (e.ctrlKey || [1, 2].includes(e.button)) return\n\n      window.getSelection()?.removeAllRanges()\n      startDrag(e)\n\n      const el = e.currentTarget as HTMLDivElement\n      if (!el) return\n      thumbState.value[bar.value.axis] =\n        el[bar.value.offset] -\n        (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction])\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      if (!thumb.value || !instance.value || !scrollbar.wrapElement) return\n\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumb.value[bar.value.offset] / 2\n      const thumbPositionPercentage =\n        ((offset - thumbHalf) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const startDrag = (e: MouseEvent) => {\n      e.stopImmediatePropagation()\n      cursorDown = true\n      document.addEventListener('mousemove', mouseMoveDocumentHandler)\n      document.addEventListener('mouseup', mouseUpDocumentHandler)\n      originalOnSelectStart = document.onselectstart\n      document.onselectstart = () => false\n    }\n\n    const mouseMoveDocumentHandler = (e: MouseEvent) => {\n      if (!instance.value || !thumb.value) return\n      if (cursorDown === false) return\n\n      const prevPage = thumbState.value[bar.value.axis]\n      if (!prevPage) return\n\n      const offset =\n        (instance.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage\n      const thumbPositionPercentage =\n        ((offset - thumbClickPosition) * 100 * offsetRatio.value) /\n        instance.value[bar.value.offset]\n      scrollbar.wrapElement[bar.value.scroll] =\n        (thumbPositionPercentage *\n          scrollbar.wrapElement[bar.value.scrollSize]) /\n        100\n    }\n\n    const mouseUpDocumentHandler = () => {\n      cursorDown = false\n      thumbState.value[bar.value.axis] = 0\n      document.removeEventListener('mousemove', mouseMoveDocumentHandler)\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n      restoreOnselectstart()\n      if (cursorLeave) visible.value = false\n    }\n\n    const mouseMoveScrollbarHandler = () => {\n      cursorLeave = false\n      visible.value = !!props.size\n    }\n\n    const mouseLeaveScrollbarHandler = () => {\n      cursorLeave = true\n      visible.value = cursorDown\n    }\n\n    onBeforeUnmount(() => {\n      restoreOnselectstart()\n      document.removeEventListener('mouseup', mouseUpDocumentHandler)\n    })\n\n    const restoreOnselectstart = () => {\n      if (document.onselectstart !== originalOnSelectStart)\n        document.onselectstart = originalOnSelectStart\n    }\n\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mousemove',\n      mouseMoveScrollbarHandler\n    )\n    useEventListener(\n      toRef(scrollbar, 'scrollbarElement'),\n      'mouseleave',\n      mouseLeaveScrollbarHandler\n    )\n\n    return {\n      ns,\n      instance,\n      thumb,\n      bar,\n      thumbStyle,\n      visible,\n      clickTrackHandler,\n      clickThumbHandler,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","thumbProps","scrollbar","inject","scrollbarContextKey","useNamespace","throwError","ref","isClient","computed","BAR_MAP","renderThumbStyle","onBeforeUnmount","useEventListener","toRef","_openBlock","_createBlock","_Transition","_withCtx","_withDirectives","_createElementVNode","_normalizeClass","_vShow"],"mappings":"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"}

package/lib/components/select/src/option-group.js.map

@@ -1 +1 @@
-{"version":3,"file":"option-group.js","sources":["../../../../../../packages/components/select/src/option-group.vue"],"sourcesContent":["<template>\n  <ul v-show=\"visible\" :class=\"ns.be('group', 'wrap')\">\n    <li :class=\"ns.be('group', 'title')\">{{ label }}</li>\n    <li>\n      <ul :class=\"ns.b('group')\">\n        <slot></slot>\n      </ul>\n    </li>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  provide,\n  inject,\n  ref,\n  reactive,\n  toRefs,\n  getCurrentInstance,\n  onMounted,\n  watch,\n  toRaw,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { selectGroupKey, selectKey } from './token'\n\nexport default defineComponent({\n  name: 'ElOptionGroup',\n  componentName: 'ElOptionGroup',\n\n  props: {\n    label: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    const ns = useNamespace('select')\n    const visible = ref(true)\n    const instance = getCurrentInstance()\n    const children = ref([])\n\n    provide(\n      selectGroupKey,\n      reactive({\n        ...toRefs(props),\n      })\n    )\n\n    const select = inject(selectKey)\n\n    onMounted(() => {\n      children.value = flattedChildren(instance.subTree)\n    })\n\n    // get all instances of options\n    const flattedChildren = (node) => {\n      const children = []\n      if (Array.isArray(node.children)) {\n        node.children.forEach((child) => {\n          if (\n            child.type &&\n            child.type.name === 'ElOption' &&\n            child.component &&\n            child.component.proxy\n          ) {\n            children.push(child.component.proxy)\n          } else if (child.children?.length) {\n            children.push(...flattedChildren(child))\n          }\n        })\n      }\n      return children\n    }\n\n    const { groupQueryChange } = toRaw(select)\n    watch(groupQueryChange, () => {\n      visible.value = children.value.some((option) => option.visible === true)\n    })\n\n    return {\n      visible,\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","useNamespace","ref","getCurrentInstance","selectGroupKey","reactive","toRefs","inject","selectKey"],"mappings":";;;;;;;;;;AA2BA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,eAAe;AAAA,EAEf,OAAO;AAAA,IACL,OAAO;AAAA,IACP,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAGb,MAAM,OAAO;AACX,UAAM,KAAKC,mBAAa;AACxB,UAAM,UAAUC,QAAI;AACpB,UAAM,WAAWC;AACjB,UAAM,WAAWD,QAAI;AAErB,gBACEE,sBACAC,aAAS;AAAA,SACJC,WAAO;AAAA;AAId,UAAM,SAASC,WAAOC;AAEtB,kBAAU,MAAM;AACd,eAAS,QAAQ,gBAAgB,SAAS;AAAA;AAI5C,UAAM,kBAAkB,CAAC,SAAS;AAChC,YAAM,YAAW;AACjB,UAAI,MAAM,QAAQ,KAAK,WAAW;AAChC,aAAK,SAAS,QAAQ,CAAC,UAAU;AAC/B,cACE;AAKA,iCAAoB,UAAU;AAAA,qBACrB,MAAM;AACf,sBAAS,KAAK,mBAAmB;AAAA;AAAA;AAAA;AAIvC;AAAO;AAGT;AACA,UAAM,kBAAkB;AACtB;AAAmE;AAGrE;AAAO;AACL,MACA;AAAA;AAAA;AAAA;;;AA5EC,4CAP6B;AAAA;;AACqB;AAApC,wCAA4B;AAAA,2BAKxC;AAAA;AADE;AAFW;;AACD;;;;AAJP;AAAA;;;;;;"}
+{"version":3,"file":"option-group.js","sources":["../../../../../../packages/components/select/src/option-group.vue"],"sourcesContent":["<template>\n  <ul v-show=\"visible\" :class=\"ns.be('group', 'wrap')\">\n    <li :class=\"ns.be('group', 'title')\">{{ label }}</li>\n    <li>\n      <ul :class=\"ns.b('group')\">\n        <slot></slot>\n      </ul>\n    </li>\n  </ul>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  provide,\n  inject,\n  ref,\n  reactive,\n  toRefs,\n  getCurrentInstance,\n  onMounted,\n  watch,\n  toRaw,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { selectGroupKey, selectKey } from './token'\n\nexport default defineComponent({\n  name: 'ElOptionGroup',\n  componentName: 'ElOptionGroup',\n\n  props: {\n    label: String,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n  setup(props) {\n    const ns = useNamespace('select')\n    const visible = ref(true)\n    const instance = getCurrentInstance()\n    const children = ref([])\n\n    provide(\n      selectGroupKey,\n      reactive({\n        ...toRefs(props),\n      })\n    )\n\n    const select = inject(selectKey)\n\n    onMounted(() => {\n      children.value = flattedChildren(instance.subTree)\n    })\n\n    // get all instances of options\n    const flattedChildren = (node) => {\n      const children = []\n      if (Array.isArray(node.children)) {\n        node.children.forEach((child) => {\n          if (\n            child.type &&\n            child.type.name === 'ElOption' &&\n            child.component &&\n            child.component.proxy\n          ) {\n            children.push(child.component.proxy)\n          } else if (child.children?.length) {\n            children.push(...flattedChildren(child))\n          }\n        })\n      }\n      return children\n    }\n\n    const { groupQueryChange } = toRaw(select)\n    watch(groupQueryChange, () => {\n      visible.value = children.value.some((option) => option.visible === true)\n    })\n\n    return {\n      visible,\n      ns,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","useNamespace","ref","getCurrentInstance","provide","selectGroupKey","reactive","toRefs","inject","selectKey","onMounted","toRaw","watch","_withDirectives","_openBlock","_createElementBlock","_normalizeClass","_createElementVNode","_toDisplayString","_renderSlot","_vShow"],"mappings":"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"}

package/lib/components/select/src/option.js.map

@@ -1 +1 @@
-{"version":3,"file":"option.js","sources":["../../../../../../packages/components/select/src/option.vue"],"sourcesContent":["<template>\n  <li\n    v-show=\"visible\"\n    :class=\"[\n      ns.be('dropdown', 'item'),\n      ns.is('disabled', isDisabled),\n      {\n        selected: itemSelected,\n        hover,\n      },\n    ]\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot>\n      <span>{{ currentLabel }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  getCurrentInstance,\n  onBeforeUnmount,\n  reactive,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useOption } from './useOption'\nimport type { SelectOptionProxy } from './token'\n\nexport default defineComponent({\n  name: 'ElOption',\n  componentName: 'ElOption',\n\n  props: {\n    value: {\n      required: true,\n      type: [String, Number, Boolean, Object],\n    },\n    label: [String, Number],\n    created: Boolean,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  setup(props) {\n    const ns = useNamespace('select')\n    const states = reactive({\n      index: -1,\n      groupDisabled: false,\n      visible: true,\n      hitState: false,\n      hover: false,\n    })\n\n    const { currentLabel, itemSelected, isDisabled, select, hoverItem } =\n      useOption(props, states)\n\n    const { visible, hover } = toRefs(states)\n\n    const vm = getCurrentInstance().proxy\n    const key = (vm as unknown as SelectOptionProxy).value\n    select.onOptionCreate(vm as unknown as SelectOptionProxy)\n\n    onBeforeUnmount(() => {\n      const { selected } = select\n      const selectedOptions = select.props.multiple ? selected : [selected]\n      const doesExist = select.cachedOptions.has(key)\n      const doesSelected = selectedOptions.some((item) => {\n        return item.value === (vm as unknown as SelectOptionProxy).value\n      })\n      // if option is not selected, remove it from cache\n      if (doesExist && !doesSelected) {\n        select.cachedOptions.delete(key)\n      }\n      select.onOptionDestroy(key)\n    })\n\n    function selectOptionClick() {\n      if (props.disabled !== true && states.groupDisabled !== true) {\n        select.handleOptionSelect(vm, true)\n      }\n    }\n\n    return {\n      ns,\n      currentLabel,\n      itemSelected,\n      isDisabled,\n      select,\n      hoverItem,\n      visible,\n      hover,\n      selectOptionClick,\n      states,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","useNamespace","reactive","useOption","toRefs","getCurrentInstance","_createElementBlock","_normalizeClass","_renderSlot","_createElementVNode"],"mappings":";;;;;;;;;;AAgCA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EACN,eAAe;AAAA,EAEf,OAAO;AAAA,IACL,OAAO;AAAA,MACL,UAAU;AAAA,MACV,MAAM,CAAC,QAAQ,QAAQ,SAAS;AAAA;AAAA,IAElC,OAAO,CAAC,QAAQ;AAAA,IAChB,SAAS;AAAA,IACT,UAAU;AAAA,MACR,MAAM;AAAA,MACN,SAAS;AAAA;AAAA;AAAA,EAIb,MAAM,OAAO;AACX,UAAM,KAAKC,mBAAa;AACxB,UAAM,SAASC,aAAS;AAAA,MACtB,OAAO;AAAA,MACP,eAAe;AAAA,MACf,SAAS;AAAA,MACT,UAAU;AAAA,MACV,OAAO;AAAA;AAGT,UAAM,EAAE,cAAc,cAAc,YAAY,QAAQ,cACtDC,oBAAU,OAAO;AAEnB,UAAM,EAAE,SAAS,UAAUC,WAAO;AAElC,UAAM,KAAKC,yBAAqB;AAChC,UAAM,MAAO,GAAoC;AACjD,WAAO,eAAe;AAEtB,wBAAgB,MAAM;AACpB,YAAM,EAAE,aAAa;AACrB,YAAM,kBAAkB,OAAO,MAAM,WAAW,WAAW,CAAC;AAC5D,YAAM,YAAY,OAAO,cAAc,IAAI;AAC3C,YAAM,eAAe,gBAAgB,KAAK,CAAC,SAAS;AAClD,eAAO,KAAK,UAAW,GAAoC;AAAA;AAG7D,UAAI,aAAa,CAAC,cAAc;AAC9B,eAAO,cAAc,OAAO;AAAA;AAE9B,aAAO,gBAAgB;AAAA;AAGzB,iCAA6B;AAC3B,UAAI,MAAM,aAAa,QAAQ,OAAO,kBAAkB,MAAM;AAC5D,eAAO,mBAAmB,IAAI;AAAA;AAAA;AAIlC,WAAO;AAAA,MACL;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;8CAjGJC,uBAgBK;AAAA,IAdF,OAAKC;AAAA,MAAU,QAAG,GAAE;AAAA,MAA4B,QAAG,GAAE,YAAa;AAAA;kBAAuC;AAAA,eAAsB;AAAA;AAAA;AAAA,IAQ/H,cAAU,uCAAE;AAAA,IACZ,SAAK,yDAAO,2DAAiB;AAAA;IAE9BC,eAEO,4BAFP,MAEO;AAAA,MADLC,uBAA+B,kCAAtB,oBAAY;AAAA;AAAA;gBAbf;AAAA;AAAA;;;;;"}
+{"version":3,"file":"option.js","sources":["../../../../../../packages/components/select/src/option.vue"],"sourcesContent":["<template>\n  <li\n    v-show=\"visible\"\n    :class=\"[\n      ns.be('dropdown', 'item'),\n      ns.is('disabled', isDisabled),\n      {\n        selected: itemSelected,\n        hover,\n      },\n    ]\"\n    @mouseenter=\"hoverItem\"\n    @click.stop=\"selectOptionClick\"\n  >\n    <slot>\n      <span>{{ currentLabel }}</span>\n    </slot>\n  </li>\n</template>\n\n<script lang=\"ts\">\nimport {\n  toRefs,\n  defineComponent,\n  getCurrentInstance,\n  onBeforeUnmount,\n  reactive,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useOption } from './useOption'\nimport type { SelectOptionProxy } from './token'\n\nexport default defineComponent({\n  name: 'ElOption',\n  componentName: 'ElOption',\n\n  props: {\n    value: {\n      required: true,\n      type: [String, Number, Boolean, Object],\n    },\n    label: [String, Number],\n    created: Boolean,\n    disabled: {\n      type: Boolean,\n      default: false,\n    },\n  },\n\n  setup(props) {\n    const ns = useNamespace('select')\n    const states = reactive({\n      index: -1,\n      groupDisabled: false,\n      visible: true,\n      hitState: false,\n      hover: false,\n    })\n\n    const { currentLabel, itemSelected, isDisabled, select, hoverItem } =\n      useOption(props, states)\n\n    const { visible, hover } = toRefs(states)\n\n    const vm = getCurrentInstance().proxy\n    const key = (vm as unknown as SelectOptionProxy).value\n    select.onOptionCreate(vm as unknown as SelectOptionProxy)\n\n    onBeforeUnmount(() => {\n      const { selected } = select\n      const selectedOptions = select.props.multiple ? selected : [selected]\n      const doesExist = select.cachedOptions.has(key)\n      const doesSelected = selectedOptions.some((item) => {\n        return item.value === (vm as unknown as SelectOptionProxy).value\n      })\n      // if option is not selected, remove it from cache\n      if (doesExist && !doesSelected) {\n        select.cachedOptions.delete(key)\n      }\n      select.onOptionDestroy(key)\n    })\n\n    function selectOptionClick() {\n      if (props.disabled !== true && states.groupDisabled !== true) {\n        select.handleOptionSelect(vm, true)\n      }\n    }\n\n    return {\n      ns,\n      currentLabel,\n      itemSelected,\n      isDisabled,\n      select,\n      hoverItem,\n      visible,\n      hover,\n      selectOptionClick,\n      states,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","useNamespace","reactive","useOption","toRefs","getCurrentInstance","onBeforeUnmount","_createElementBlock","_normalizeClass","_renderSlot","_createElementVNode","_vShow"],"mappings":"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"}

package/lib/components/select/src/select-dropdown.js.map

@@ -1 +1 @@
-{"version":3,"file":"select-dropdown.js","sources":["../../../../../../packages/components/select/src/select-dropdown.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b('dropdown'), ns.is('multiple', isMultiple), popperClass]\"\n    :style=\"{ [isFitInputWidth ? 'width' : 'minWidth']: minWidth }\"\n  >\n    <slot></slot>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  ref,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addResizeListener, removeResizeListener } from '@element-plus/utils'\nimport { selectKey } from './token'\nimport type { ResizableElement } from '@element-plus/utils'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  componentName: 'ElSelectDropdown',\n\n  setup() {\n    const select = inject(selectKey)!\n    const ns = useNamespace('select')\n\n    // computed\n    const popperClass = computed(() => select.props.popperClass)\n    const isMultiple = computed(() => select.props.multiple)\n    const isFitInputWidth = computed(() => select.props.fitInputWidth)\n    const minWidth = ref('')\n\n    function updateMinWidth() {\n      minWidth.value = `${\n        select.selectWrapper?.getBoundingClientRect().width\n      }px`\n    }\n\n    onMounted(() => {\n      // TODO: updatePopper\n      // popper.value.update()\n      updateMinWidth()\n      addResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    return {\n      ns,\n      minWidth,\n      popperClass,\n      isMultiple,\n      isFitInputWidth,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","inject","selectKey","useNamespace","computed","ref","_normalizeClass"],"mappings":";;;;;;;;;;;;AAuBA,MAAK,YAAaA,oBAAa;AAAA,EAC7B,MAAM;AAAA,EAEN,eAAe;AAAA,EAEf,QAAQ;AACN,UAAM,SAASC,WAAOC;AACtB,UAAM,KAAKC,mBAAa;AAGxB,UAAM,cAAcC,aAAS,MAAM,OAAO,MAAM;AAChD,UAAM,aAAaA,aAAS,MAAM,OAAO,MAAM;AAC/C,UAAM,kBAAkBA,aAAS,MAAM,OAAO,MAAM;AACpD,UAAM,WAAWC,QAAI;AAErB,8BAA0B;AACxB;AACgD;AAIlD;AAGE;AACA;AAEE;AAIJ;AACE;AAEE;AAIJ;AAAO;AACL,MACA;AAAA,MACA;AAAA,MACA;AAAA,MACA;AAAA;AAAA;AAAA;;2CA5DE;AAAA;AAJsD,IACzD,OAAKC;AAA8C;;AAEvC;;;;;;;"}
+{"version":3,"file":"select-dropdown.js","sources":["../../../../../../packages/components/select/src/select-dropdown.vue"],"sourcesContent":["<template>\n  <div\n    :class=\"[ns.b('dropdown'), ns.is('multiple', isMultiple), popperClass]\"\n    :style=\"{ [isFitInputWidth ? 'width' : 'minWidth']: minWidth }\"\n  >\n    <slot></slot>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport {\n  defineComponent,\n  computed,\n  onMounted,\n  onBeforeUnmount,\n  inject,\n  ref,\n} from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { addResizeListener, removeResizeListener } from '@element-plus/utils'\nimport { selectKey } from './token'\nimport type { ResizableElement } from '@element-plus/utils'\n\nexport default defineComponent({\n  name: 'ElSelectDropdown',\n\n  componentName: 'ElSelectDropdown',\n\n  setup() {\n    const select = inject(selectKey)!\n    const ns = useNamespace('select')\n\n    // computed\n    const popperClass = computed(() => select.props.popperClass)\n    const isMultiple = computed(() => select.props.multiple)\n    const isFitInputWidth = computed(() => select.props.fitInputWidth)\n    const minWidth = ref('')\n\n    function updateMinWidth() {\n      minWidth.value = `${\n        select.selectWrapper?.getBoundingClientRect().width\n      }px`\n    }\n\n    onMounted(() => {\n      // TODO: updatePopper\n      // popper.value.update()\n      updateMinWidth()\n      addResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    onBeforeUnmount(() => {\n      removeResizeListener(\n        select.selectWrapper as ResizableElement,\n        updateMinWidth\n      )\n    })\n\n    return {\n      ns,\n      minWidth,\n      popperClass,\n      isMultiple,\n      isFitInputWidth,\n    }\n  },\n})\n</script>\n"],"names":["defineComponent","inject","selectKey","useNamespace","computed","ref","onMounted","addResizeListener","onBeforeUnmount","removeResizeListener","_openBlock","_normalizeClass","_normalizeStyle","_renderSlot"],"mappings":";;;;;;;;;;;;AAuBA,MAAK,YAAaA,mBAAa,CAAA;AAAA,EAC7B,IAAM,EAAA,kBAAA;AAAA,EAEN,aAAe,EAAA,kBAAA;AAAA,EAEf,KAAQ,GAAA;AACN,IAAA,MAAM,SAASC,UAAO,CAAAC,eAAA,CAAA,CAAA;AACtB,IAAA,MAAM,KAAKC,kBAAa,CAAA,QAAA,CAAA,CAAA;AAGxB,IAAA,MAAM,WAAc,GAAAC,YAAA,CAAS,MAAM,MAAA,CAAO,KAAM,CAAA,WAAA,CAAA,CAAA;AAChD,IAAA,MAAM,UAAa,GAAAA,YAAA,CAAS,MAAM,MAAA,CAAO,KAAM,CAAA,QAAA,CAAA,CAAA;AAC/C,IAAA,MAAM,eAAkB,GAAAA,YAAA,CAAS,MAAM,MAAA,CAAO,KAAM,CAAA,aAAA,CAAA,CAAA;AACpD,IAAA,MAAM,WAAWC,OAAI,CAAA,EAAA,CAAA,CAAA;AAErB,IAA0B,SAAA,cAAA,GAAA;AACxB,MAAA,IAAA,EAAA,CAAA;AACgD,MAAA,QAAA,CAAA,KAAA,GAAA,CAAA,EAAA,CAAA,EAAA,GAAA,MAAA,CAAA,aAAA,KAAA,IAAA,GAAA,KAAA,CAAA,GAAA,EAAA,CAAA,qBAAA,EAAA,CAAA,KAAA,CAAA,EAAA,CAAA,CAAA;AAIlD,KAAA;AAGE,IAAAC,aAAA,CAAA,MAAA;AACA,MAAA,cAAA,EAAA,CAAA;AAEE,MAAAC,6BAAA,CAAA,MAAA,CAAA,aAAA,EAAA,cAAA,CAAA,CAAA;AAIJ,KAAA,CAAA,CAAA;AACE,IAAAC,mBAAA,CAAA,MAAA;AAEE,MAAAC,gCAAA,CAAA,MAAA,CAAA,aAAA,EAAA,cAAA,CAAA,CAAA;AAIJ,KAAO,CAAA,CAAA;AAAA,IACL,OAAA;AAAA,MACA,EAAA;AAAA,MACA,QAAA;AAAA,MACA,WAAA;AAAA,MACA,UAAA;AAAA,MAAA,eAAA;AAAA,KAAA,CAAA;AAAA,GAAA;;yBA5DE,EAAA,MAAA,EAAA,MAAA,EAAA,MAAA,EAAA,KAAA,EAAA,QAAA,EAAA;AAAA,EAJH,OAAAC;AAAyD,IACzD,KAAA,EAAKC,kBAAK,CAAA,CAAA,IAAA,CAAA,EAAA,CAAA,CAAA,CAAA,UAAA,CAAA,EAAA,IAAyC,CAAA,EAAA,CAAA,EAAA,CAAA,UAAA,EAAA,IAAA,CAAA,UAAA,CAAA,EAAA,IAAA,CAAA,WAAA,CAAA,CAAA;AAAA,IAAA,KAAA,EAAAC,kBAAA,CAAA,EAAA,CAAA,IAAA,CAAA,eAAA,GAAA,OAAA,GAAA,UAAA,GAAA,IAAA,CAAA,QAAA,EAAA,CAAA;KAEvC;AAAA,IAAAC,cAAA,CAAA,IAAA,CAAA,MAAA,EAAA,SAAA,CAAA;;;;;;;"}

package/lib/components/select/src/select.js

@@ -395,9 +395,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
           }, [
             _ctx.collapseTags && _ctx.selected.length ? (vue.openBlock(), vue.createElementBlock("span", {
               key: 0,
-              style: vue.normalizeStyle({
-                marginLeft: _ctx.prefixWidth && _ctx.selected.length ? `${_ctx.prefixWidth}px` : ""
-              })
+              class: vue.normalizeClass([
+                _ctx.nsSelect.b("tags-wrapper"),
+                { "has-prefix": _ctx.prefixWidth && _ctx.selected.length }
+              ])
             }, [
               vue.createVNode(_component_el_tag, {
                 closable: !_ctx.selectDisabled && !_ctx.selected[0].isDisabled,
@@ -429,7 +430,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               }, 8, ["size", "type"])) : vue.createCommentVNode("v-if", true)
-            ], 4)) : vue.createCommentVNode("v-if", true),
+            ], 2)) : vue.createCommentVNode("v-if", true),
             vue.createCommentVNode(" <div> "),
             !_ctx.collapseTags ? (vue.openBlock(), vue.createBlock(vue.Transition, {
               key: 1,
@@ -437,9 +438,10 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
             }, {
               default: vue.withCtx(() => [
                 vue.createElementVNode("span", {
-                  style: vue.normalizeStyle({
-                    marginLeft: _ctx.prefixWidth && _ctx.selected.length ? `${_ctx.prefixWidth}px` : ""
-                  })
+                  class: vue.normalizeClass([
+                    _ctx.nsSelect.b("tags-wrapper"),
+                    { "has-prefix": _ctx.prefixWidth && _ctx.selected.length }
+                  ])
                 }, [
                   (vue.openBlock(true), vue.createElementBlock(vue.Fragment, null, vue.renderList(_ctx.selected, (item) => {
                     return vue.openBlock(), vue.createBlock(_component_el_tag, {
@@ -460,7 +462,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
                       _: 2
                     }, 1032, ["closable", "size", "hit", "type", "onClose"]);
                   }), 128))
-                ], 4)
+                ], 2)
               ]),
               _: 1
             }, 8, ["onAfterLeave"])) : vue.createCommentVNode("v-if", true),