@element-plus/nightly 0.0.20241227 → 0.0.20241228

package/es/components/radio/index.mjs

@@ -1,9 +1,9 @@
 import Radio from './src/radio2.mjs';
-import RadioButton from './src/radio-button2.mjs';
+import RadioButton from './src/radio-button.mjs';
 import RadioGroup from './src/radio-group2.mjs';
 export { radioEmits, radioProps, radioPropsBase } from './src/radio.mjs';
 export { radioGroupEmits, radioGroupProps } from './src/radio-group.mjs';
-export { radioButtonProps } from './src/radio-button.mjs';
+export { radioButtonProps } from './src/radio-button2.mjs';
 export { radioGroupKey } from './src/constants.mjs';
 import { withInstall, withNoopInstall } from '../../utils/vue/install.mjs';
 

package/es/components/radio/src/radio-button.mjs

@@ -1,9 +1,69 @@
-import { radioPropsBase } from './radio.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createElementVNode, isRef, withModifiers, vModelRadio, normalizeStyle, renderSlot, createTextVNode, toDisplayString } from 'vue';
+import { useRadio } from './use-radio.mjs';
+import { radioButtonProps } from './radio-button2.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
 
-const radioButtonProps = buildProps({
-  ...radioPropsBase
+const __default__ = defineComponent({
+  name: "ElRadioButton"
 });
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: radioButtonProps,
+  setup(__props) {
+    const props = __props;
+    const ns = useNamespace("radio");
+    const { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } = useRadio(props);
+    const activeStyle = computed(() => {
+      return {
+        backgroundColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+        borderColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
+        boxShadow: (radioGroup == null ? void 0 : radioGroup.fill) ? `-1px 0 0 0 ${radioGroup.fill}` : "",
+        color: (radioGroup == null ? void 0 : radioGroup.textColor) || ""
+      };
+    });
+    return (_ctx, _cache) => {
+      var _a;
+      return openBlock(), createElementBlock("label", {
+        class: normalizeClass([
+          unref(ns).b("button"),
+          unref(ns).is("active", unref(modelValue) === unref(actualValue)),
+          unref(ns).is("disabled", unref(disabled)),
+          unref(ns).is("focus", unref(focus)),
+          unref(ns).bm("button", unref(size))
+        ])
+      }, [
+        withDirectives(createElementVNode("input", {
+          ref_key: "radioRef",
+          ref: radioRef,
+          "onUpdate:modelValue": ($event) => isRef(modelValue) ? modelValue.value = $event : null,
+          class: normalizeClass(unref(ns).be("button", "original-radio")),
+          value: unref(actualValue),
+          type: "radio",
+          name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
+          disabled: unref(disabled),
+          onFocus: ($event) => focus.value = true,
+          onBlur: ($event) => focus.value = false,
+          onClick: withModifiers(() => {
+          }, ["stop"])
+        }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "onFocus", "onBlur", "onClick"]), [
+          [vModelRadio, unref(modelValue)]
+        ]),
+        createElementVNode("span", {
+          class: normalizeClass(unref(ns).be("button", "inner")),
+          style: normalizeStyle(unref(modelValue) === unref(actualValue) ? unref(activeStyle) : {}),
+          onKeydown: withModifiers(() => {
+          }, ["stop"])
+        }, [
+          renderSlot(_ctx.$slots, "default", {}, () => [
+            createTextVNode(toDisplayString(_ctx.label), 1)
+          ])
+        ], 46, ["onKeydown"])
+      ], 2);
+    };
+  }
+});
+var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "radio-button.vue"]]);
 
-export { radioButtonProps };
+export { RadioButton as default };
 //# sourceMappingURL=radio-button.mjs.map

package/es/components/radio/src/radio-button.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { radioPropsBase } from './radio'\nimport type { ExtractPropTypes } from 'vue'\nimport type RadioButton from './radio-button.vue'\n\nexport const radioButtonProps = buildProps({\n  ...radioPropsBase,\n} as const)\n\nexport type RadioButtonProps = ExtractPropTypes<typeof radioButtonProps>\nexport type RadioButtonInstance = InstanceType<typeof RadioButton>\n"],"names":[],"mappings":";;;AAEY,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,GAAG,cAAc;AACnB,CAAC;;;;"}
+{"version":3,"file":"radio-button.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[\n      ns.b('button'),\n      ns.is('active', modelValue === actualValue),\n      ns.is('disabled', disabled),\n      ns.is('focus', focus),\n      ns.bm('button', size),\n    ]\"\n  >\n    <input\n      ref=\"radioRef\"\n      v-model=\"modelValue\"\n      :class=\"ns.be('button', 'original-radio')\"\n      :value=\"actualValue\"\n      type=\"radio\"\n      :name=\"name || radioGroup?.name\"\n      :disabled=\"disabled\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n      @click.stop\n    />\n    <span\n      :class=\"ns.be('button', 'inner')\"\n      :style=\"modelValue === actualValue ? activeStyle : {}\"\n      @keydown.stop\n    >\n      <slot>\n        {{ label }}\n      </slot>\n    </span>\n  </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useRadio } from './use-radio'\nimport { radioButtonProps } from './radio-button'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRadioButton',\n})\n\nconst props = defineProps(radioButtonProps)\n\nconst ns = useNamespace('radio')\nconst { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } =\n  useRadio(props)\n\nconst activeStyle = computed<CSSProperties>(() => {\n  return {\n    backgroundColor: radioGroup?.fill || '',\n    borderColor: radioGroup?.fill || '',\n    boxShadow: radioGroup?.fill ? `-1px 0 0 0 ${radioGroup.fill}` : '',\n    color: radioGroup?.textColor || '',\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;mCAyCc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAC/B,IAAM,MAAA,EAAE,QAAU,EAAA,KAAA,EAAO,IAAM,EAAA,QAAA,EAAU,YAAY,UAAY,EAAA,WAAA,EAC/D,GAAA,QAAA,CAAS,KAAK,CAAA,CAAA;AAEhB,IAAM,MAAA,WAAA,GAAc,SAAwB,MAAM;AAChD,MAAO,OAAA;AAAA,QACL,eAAA,EAAiB,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACrC,WAAA,EAAa,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACjC,WAAW,CAAY,UAAA,IAAA,IAAO,GAAc,KAAA,CAAA,GAAA,UAAA,CAAA,QAAoB,CAAA,WAAA,EAAA,UAAA,CAAA,IAAA,CAAA,CAAA,GAAA,EAAA;AAAA,QAChE,KAAA,EAAO,eAAyB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,SAAA,KAAA,EAAA;AAAA,OAClC,CAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}

package/es/components/radio/src/radio-button2.mjs

@@ -1,69 +1,9 @@
-import { defineComponent, computed, openBlock, createElementBlock, normalizeClass, unref, withDirectives, createElementVNode, isRef, withModifiers, vModelRadio, normalizeStyle, renderSlot, createTextVNode, toDisplayString } from 'vue';
-import { useRadio } from './use-radio.mjs';
-import { radioButtonProps } from './radio-button.mjs';
-import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { radioPropsBase } from './radio.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const __default__ = defineComponent({
-  name: "ElRadioButton"
+const radioButtonProps = buildProps({
+  ...radioPropsBase
 });
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  ...__default__,
-  props: radioButtonProps,
-  setup(__props) {
-    const props = __props;
-    const ns = useNamespace("radio");
-    const { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } = useRadio(props);
-    const activeStyle = computed(() => {
-      return {
-        backgroundColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
-        borderColor: (radioGroup == null ? void 0 : radioGroup.fill) || "",
-        boxShadow: (radioGroup == null ? void 0 : radioGroup.fill) ? `-1px 0 0 0 ${radioGroup.fill}` : "",
-        color: (radioGroup == null ? void 0 : radioGroup.textColor) || ""
-      };
-    });
-    return (_ctx, _cache) => {
-      var _a;
-      return openBlock(), createElementBlock("label", {
-        class: normalizeClass([
-          unref(ns).b("button"),
-          unref(ns).is("active", unref(modelValue) === unref(actualValue)),
-          unref(ns).is("disabled", unref(disabled)),
-          unref(ns).is("focus", unref(focus)),
-          unref(ns).bm("button", unref(size))
-        ])
-      }, [
-        withDirectives(createElementVNode("input", {
-          ref_key: "radioRef",
-          ref: radioRef,
-          "onUpdate:modelValue": ($event) => isRef(modelValue) ? modelValue.value = $event : null,
-          class: normalizeClass(unref(ns).be("button", "original-radio")),
-          value: unref(actualValue),
-          type: "radio",
-          name: _ctx.name || ((_a = unref(radioGroup)) == null ? void 0 : _a.name),
-          disabled: unref(disabled),
-          onFocus: ($event) => focus.value = true,
-          onBlur: ($event) => focus.value = false,
-          onClick: withModifiers(() => {
-          }, ["stop"])
-        }, null, 42, ["onUpdate:modelValue", "value", "name", "disabled", "onFocus", "onBlur", "onClick"]), [
-          [vModelRadio, unref(modelValue)]
-        ]),
-        createElementVNode("span", {
-          class: normalizeClass(unref(ns).be("button", "inner")),
-          style: normalizeStyle(unref(modelValue) === unref(actualValue) ? unref(activeStyle) : {}),
-          onKeydown: withModifiers(() => {
-          }, ["stop"])
-        }, [
-          renderSlot(_ctx.$slots, "default", {}, () => [
-            createTextVNode(toDisplayString(_ctx.label), 1)
-          ])
-        ], 46, ["onKeydown"])
-      ], 2);
-    };
-  }
-});
-var RadioButton = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "radio-button.vue"]]);
 
-export { RadioButton as default };
+export { radioButtonProps };
 //# sourceMappingURL=radio-button2.mjs.map

package/es/components/radio/src/radio-button2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"radio-button2.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.vue"],"sourcesContent":["<template>\n  <label\n    :class=\"[\n      ns.b('button'),\n      ns.is('active', modelValue === actualValue),\n      ns.is('disabled', disabled),\n      ns.is('focus', focus),\n      ns.bm('button', size),\n    ]\"\n  >\n    <input\n      ref=\"radioRef\"\n      v-model=\"modelValue\"\n      :class=\"ns.be('button', 'original-radio')\"\n      :value=\"actualValue\"\n      type=\"radio\"\n      :name=\"name || radioGroup?.name\"\n      :disabled=\"disabled\"\n      @focus=\"focus = true\"\n      @blur=\"focus = false\"\n      @click.stop\n    />\n    <span\n      :class=\"ns.be('button', 'inner')\"\n      :style=\"modelValue === actualValue ? activeStyle : {}\"\n      @keydown.stop\n    >\n      <slot>\n        {{ label }}\n      </slot>\n    </span>\n  </label>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed } from 'vue'\nimport { useNamespace } from '@element-plus/hooks'\nimport { useRadio } from './use-radio'\nimport { radioButtonProps } from './radio-button'\nimport type { CSSProperties } from 'vue'\n\ndefineOptions({\n  name: 'ElRadioButton',\n})\n\nconst props = defineProps(radioButtonProps)\n\nconst ns = useNamespace('radio')\nconst { radioRef, focus, size, disabled, modelValue, radioGroup, actualValue } =\n  useRadio(props)\n\nconst activeStyle = computed<CSSProperties>(() => {\n  return {\n    backgroundColor: radioGroup?.fill || '',\n    borderColor: radioGroup?.fill || '',\n    boxShadow: radioGroup?.fill ? `-1px 0 0 0 ${radioGroup.fill}` : '',\n    color: radioGroup?.textColor || '',\n  }\n})\n</script>\n"],"names":[],"mappings":";;;;;;mCAyCc,CAAA;AAAA,EACZ,IAAM,EAAA,eAAA;AACR,CAAA,CAAA,CAAA;;;;;;AAIA,IAAM,MAAA,EAAA,GAAK,aAAa,OAAO,CAAA,CAAA;AAC/B,IAAM,MAAA,EAAE,QAAU,EAAA,KAAA,EAAO,IAAM,EAAA,QAAA,EAAU,YAAY,UAAY,EAAA,WAAA,EAC/D,GAAA,QAAA,CAAS,KAAK,CAAA,CAAA;AAEhB,IAAM,MAAA,WAAA,GAAc,SAAwB,MAAM;AAChD,MAAO,OAAA;AAAA,QACL,eAAA,EAAiB,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACrC,WAAA,EAAa,eAAoB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,IAAA,KAAA,EAAA;AAAA,QACjC,WAAW,CAAY,UAAA,IAAA,IAAO,GAAc,KAAA,CAAA,GAAA,UAAA,CAAA,QAAoB,CAAA,WAAA,EAAA,UAAA,CAAA,IAAA,CAAA,CAAA,GAAA,EAAA;AAAA,QAChE,KAAA,EAAO,eAAyB,IAAA,GAAA,KAAA,CAAA,GAAA,UAAA,CAAA,SAAA,KAAA,EAAA;AAAA,OAClC,CAAA;AAAA,KACD,CAAA,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;"}
+{"version":3,"file":"radio-button2.mjs","sources":["../../../../../../packages/components/radio/src/radio-button.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport { radioPropsBase } from './radio'\nimport type { ExtractPropTypes } from 'vue'\nimport type RadioButton from './radio-button.vue'\n\nexport const radioButtonProps = buildProps({\n  ...radioPropsBase,\n} as const)\n\nexport type RadioButtonProps = ExtractPropTypes<typeof radioButtonProps>\nexport type RadioButtonInstance = InstanceType<typeof RadioButton>\n"],"names":[],"mappings":";;;AAEY,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,GAAG,cAAc;AACnB,CAAC;;;;"}

package/es/components/roving-focus-group/src/roving-focus-group.mjs

@@ -1,4 +1,4 @@
-import { createCollectionWithScope } from '../../collection/src/collection2.mjs';
+import { createCollectionWithScope } from '../../collection/src/collection.mjs';
 import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
 
 const rovingFocusGroupProps = buildProps({

package/es/components/scrollbar/index.mjs

@@ -1,6 +1,6 @@
-import Scrollbar from './src/scrollbar2.mjs';
+import Scrollbar from './src/scrollbar.mjs';
 export { BAR_MAP, GAP, renderThumbStyle } from './src/util.mjs';
-export { scrollbarEmits, scrollbarProps } from './src/scrollbar.mjs';
+export { scrollbarEmits, scrollbarProps } from './src/scrollbar2.mjs';
 export { thumbProps } from './src/thumb.mjs';
 export { scrollbarContextKey } from './src/constants.mjs';
 import { withInstall } from '../../utils/vue/install.mjs';

package/es/components/scrollbar/src/scrollbar.mjs

@@ -1,60 +1,175 @@
-import { buildProps, definePropType } from '../../../utils/vue/props/runtime.mjs';
-import { useAriaProps } from '../../../hooks/use-aria/index.mjs';
+import { defineComponent, ref, computed, watch, nextTick, provide, reactive, onActivated, onMounted, onUpdated, openBlock, createElementBlock, normalizeClass, unref, createElementVNode, normalizeStyle, createBlock, resolveDynamicComponent, withCtx, renderSlot, createCommentVNode } from 'vue';
+import { useResizeObserver, useEventListener } from '@vueuse/core';
+import Bar from './bar2.mjs';
+import { scrollbarContextKey } from './constants.mjs';
+import { scrollbarProps, scrollbarEmits } from './scrollbar2.mjs';
+import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
+import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
+import { addUnit } from '../../../utils/dom/style.mjs';
+import { isObject } from '@vue/shared';
 import { isNumber } from '../../../utils/types.mjs';
+import { debugWarn } from '../../../utils/error.mjs';
 
-const scrollbarProps = buildProps({
-  height: {
-    type: [String, Number],
-    default: ""
-  },
-  maxHeight: {
-    type: [String, Number],
-    default: ""
-  },
-  native: {
-    type: Boolean,
-    default: false
-  },
-  wrapStyle: {
-    type: definePropType([String, Object, Array]),
-    default: ""
-  },
-  wrapClass: {
-    type: [String, Array],
-    default: ""
-  },
-  viewClass: {
-    type: [String, Array],
-    default: ""
-  },
-  viewStyle: {
-    type: [String, Array, Object],
-    default: ""
-  },
-  noresize: Boolean,
-  tag: {
-    type: String,
-    default: "div"
-  },
-  always: Boolean,
-  minSize: {
-    type: Number,
-    default: 20
-  },
-  tabindex: {
-    type: [String, Number],
-    default: void 0
-  },
-  id: String,
-  role: String,
-  ...useAriaProps(["ariaLabel", "ariaOrientation"])
+const COMPONENT_NAME = "ElScrollbar";
+const __default__ = defineComponent({
+  name: COMPONENT_NAME
 });
-const scrollbarEmits = {
-  scroll: ({
-    scrollTop,
-    scrollLeft
-  }) => [scrollTop, scrollLeft].every(isNumber)
-};
+const _sfc_main = /* @__PURE__ */ defineComponent({
+  ...__default__,
+  props: scrollbarProps,
+  emits: scrollbarEmits,
+  setup(__props, { expose, emit }) {
+    const props = __props;
+    const ns = useNamespace("scrollbar");
+    let stopResizeObserver = void 0;
+    let stopResizeListener = void 0;
+    let wrapScrollTop = 0;
+    let wrapScrollLeft = 0;
+    const scrollbarRef = ref();
+    const wrapRef = ref();
+    const resizeRef = ref();
+    const barRef = ref();
+    const wrapStyle = computed(() => {
+      const style = {};
+      if (props.height)
+        style.height = addUnit(props.height);
+      if (props.maxHeight)
+        style.maxHeight = addUnit(props.maxHeight);
+      return [props.wrapStyle, style];
+    });
+    const wrapKls = computed(() => {
+      return [
+        props.wrapClass,
+        ns.e("wrap"),
+        { [ns.em("wrap", "hidden-default")]: !props.native }
+      ];
+    });
+    const resizeKls = computed(() => {
+      return [ns.e("view"), props.viewClass];
+    });
+    const handleScroll = () => {
+      var _a;
+      if (wrapRef.value) {
+        (_a = barRef.value) == null ? void 0 : _a.handleScroll(wrapRef.value);
+        wrapScrollTop = wrapRef.value.scrollTop;
+        wrapScrollLeft = wrapRef.value.scrollLeft;
+        emit("scroll", {
+          scrollTop: wrapRef.value.scrollTop,
+          scrollLeft: wrapRef.value.scrollLeft
+        });
+      }
+    };
+    function scrollTo(arg1, arg2) {
+      if (isObject(arg1)) {
+        wrapRef.value.scrollTo(arg1);
+      } else if (isNumber(arg1) && isNumber(arg2)) {
+        wrapRef.value.scrollTo(arg1, arg2);
+      }
+    }
+    const setScrollTop = (value) => {
+      if (!isNumber(value)) {
+        debugWarn(COMPONENT_NAME, "value must be a number");
+        return;
+      }
+      wrapRef.value.scrollTop = value;
+    };
+    const setScrollLeft = (value) => {
+      if (!isNumber(value)) {
+        debugWarn(COMPONENT_NAME, "value must be a number");
+        return;
+      }
+      wrapRef.value.scrollLeft = value;
+    };
+    const update = () => {
+      var _a;
+      (_a = barRef.value) == null ? void 0 : _a.update();
+    };
+    watch(() => props.noresize, (noresize) => {
+      if (noresize) {
+        stopResizeObserver == null ? void 0 : stopResizeObserver();
+        stopResizeListener == null ? void 0 : stopResizeListener();
+      } else {
+        ({ stop: stopResizeObserver } = useResizeObserver(resizeRef, update));
+        stopResizeListener = useEventListener("resize", update);
+      }
+    }, { immediate: true });
+    watch(() => [props.maxHeight, props.height], () => {
+      if (!props.native)
+        nextTick(() => {
+          var _a;
+          update();
+          if (wrapRef.value) {
+            (_a = barRef.value) == null ? void 0 : _a.handleScroll(wrapRef.value);
+          }
+        });
+    });
+    provide(scrollbarContextKey, reactive({
+      scrollbarElement: scrollbarRef,
+      wrapElement: wrapRef
+    }));
+    onActivated(() => {
+      if (wrapRef.value) {
+        wrapRef.value.scrollTop = wrapScrollTop;
+        wrapRef.value.scrollLeft = wrapScrollLeft;
+      }
+    });
+    onMounted(() => {
+      if (!props.native)
+        nextTick(() => {
+          update();
+        });
+    });
+    onUpdated(() => update());
+    expose({
+      wrapRef,
+      update,
+      scrollTo,
+      setScrollTop,
+      setScrollLeft,
+      handleScroll
+    });
+    return (_ctx, _cache) => {
+      return openBlock(), createElementBlock("div", {
+        ref_key: "scrollbarRef",
+        ref: scrollbarRef,
+        class: normalizeClass(unref(ns).b())
+      }, [
+        createElementVNode("div", {
+          ref_key: "wrapRef",
+          ref: wrapRef,
+          class: normalizeClass(unref(wrapKls)),
+          style: normalizeStyle(unref(wrapStyle)),
+          tabindex: _ctx.tabindex,
+          onScroll: handleScroll
+        }, [
+          (openBlock(), createBlock(resolveDynamicComponent(_ctx.tag), {
+            id: _ctx.id,
+            ref_key: "resizeRef",
+            ref: resizeRef,
+            class: normalizeClass(unref(resizeKls)),
+            style: normalizeStyle(_ctx.viewStyle),
+            role: _ctx.role,
+            "aria-label": _ctx.ariaLabel,
+            "aria-orientation": _ctx.ariaOrientation
+          }, {
+            default: withCtx(() => [
+              renderSlot(_ctx.$slots, "default")
+            ]),
+            _: 3
+          }, 8, ["id", "class", "style", "role", "aria-label", "aria-orientation"]))
+        ], 46, ["tabindex"]),
+        !_ctx.native ? (openBlock(), createBlock(Bar, {
+          key: 0,
+          ref_key: "barRef",
+          ref: barRef,
+          always: _ctx.always,
+          "min-size": _ctx.minSize
+        }, null, 8, ["always", "min-size"])) : createCommentVNode("v-if", true)
+      ], 2);
+    };
+  }
+});
+var Scrollbar = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "scrollbar.vue"]]);
 
-export { scrollbarEmits, scrollbarProps };
+export { Scrollbar as default };
 //# sourceMappingURL=scrollbar.mjs.map

package/es/components/scrollbar/src/scrollbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.mjs","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.ts"],"sourcesContent":["import { buildProps, definePropType, isNumber } from '@element-plus/utils'\nimport { useAriaProps } from '@element-plus/hooks'\nimport type { ExtractPropTypes, StyleValue } from 'vue'\nimport type Scrollbar from './scrollbar.vue'\n\nexport const scrollbarProps = buildProps({\n  /**\n   * @description height of scrollbar\n   */\n  height: {\n    type: [String, Number],\n    default: '',\n  },\n  /**\n   * @description max height of scrollbar\n   */\n  maxHeight: {\n    type: [String, Number],\n    default: '',\n  },\n  /**\n   * @description whether to use the native scrollbar\n   */\n  native: {\n    type: Boolean,\n    default: false,\n  },\n  /**\n   * @description style of wrap\n   */\n  wrapStyle: {\n    type: definePropType<StyleValue>([String, Object, Array]),\n    default: '',\n  },\n  /**\n   * @description class of wrap\n   */\n  wrapClass: {\n    type: [String, Array],\n    default: '',\n  },\n  /**\n   * @description class of view\n   */\n  viewClass: {\n    type: [String, Array],\n    default: '',\n  },\n  /**\n   * @description style of view\n   */\n  viewStyle: {\n    type: [String, Array, Object],\n    default: '',\n  },\n  /**\n   * @description do not respond to container size changes, if the container size does not change, it is better to set it to optimize performance\n   */\n  noresize: Boolean, // 如果 container 尺寸不会发生变化，最好设置它可以优化性能\n  /**\n   * @description element tag of the view\n   */\n  tag: {\n    type: String,\n    default: 'div',\n  },\n  /**\n   * @description always show\n   */\n  always: Boolean,\n  /**\n   * @description minimum size of scrollbar\n   */\n  minSize: {\n    type: Number,\n    default: 20,\n  },\n  /**\n   * @description Wrap tabindex\n   */\n  tabindex: {\n    type: [String, Number],\n    default: undefined,\n  },\n  /**\n   * @description id of view\n   */\n  id: String,\n  /**\n   * @description role of view\n   */\n  role: String,\n  ...useAriaProps(['ariaLabel', 'ariaOrientation']),\n} as const)\nexport type ScrollbarProps = ExtractPropTypes<typeof scrollbarProps>\n\nexport const scrollbarEmits = {\n  scroll: ({\n    scrollTop,\n    scrollLeft,\n  }: {\n    scrollTop: number\n    scrollLeft: number\n  }) => [scrollTop, scrollLeft].every(isNumber),\n}\nexport type ScrollbarEmits = typeof scrollbarEmits\n\nexport type ScrollbarInstance = InstanceType<typeof Scrollbar>\n"],"names":[],"mappings":";;;;AAEY,MAAC,cAAc,GAAG,UAAU,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,EAAE,cAAc,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,OAAO;AACjB,EAAE,OAAO,EAAE;AACX,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,EAAE,EAAE,MAAM;AACZ,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,GAAG,YAAY,CAAC,CAAC,WAAW,EAAE,iBAAiB,CAAC,CAAC;AACnD,CAAC,EAAE;AACS,MAAC,cAAc,GAAG;AAC9B,EAAE,MAAM,EAAE,CAAC;AACX,IAAI,SAAS;AACb,IAAI,UAAU;AACd,GAAG,KAAK,CAAC,SAAS,EAAE,UAAU,CAAC,CAAC,KAAK,CAAC,QAAQ,CAAC;AAC/C;;;;"}
+{"version":3,"file":"scrollbar.mjs","sources":["../../../../../../packages/components/scrollbar/src/scrollbar.vue"],"sourcesContent":["<template>\n  <div ref=\"scrollbarRef\" :class=\"ns.b()\">\n    <div\n      ref=\"wrapRef\"\n      :class=\"wrapKls\"\n      :style=\"wrapStyle\"\n      :tabindex=\"tabindex\"\n      @scroll=\"handleScroll\"\n    >\n      <component\n        :is=\"tag\"\n        :id=\"id\"\n        ref=\"resizeRef\"\n        :class=\"resizeKls\"\n        :style=\"viewStyle\"\n        :role=\"role\"\n        :aria-label=\"ariaLabel\"\n        :aria-orientation=\"ariaOrientation\"\n      >\n        <slot />\n      </component>\n    </div>\n    <template v-if=\"!native\">\n      <bar ref=\"barRef\" :always=\"always\" :min-size=\"minSize\" />\n    </template>\n  </div>\n</template>\n<script lang=\"ts\" setup>\nimport {\n  computed,\n  nextTick,\n  onActivated,\n  onMounted,\n  onUpdated,\n  provide,\n  reactive,\n  ref,\n  watch,\n} from 'vue'\nimport { useEventListener, useResizeObserver } from '@vueuse/core'\nimport { addUnit, debugWarn, isNumber, isObject } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport Bar from './bar.vue'\nimport { scrollbarContextKey } from './constants'\nimport { scrollbarEmits, scrollbarProps } from './scrollbar'\nimport type { BarInstance } from './bar'\nimport type { CSSProperties, StyleValue } from 'vue'\n\nconst COMPONENT_NAME = 'ElScrollbar'\n\ndefineOptions({\n  name: COMPONENT_NAME,\n})\n\nconst props = defineProps(scrollbarProps)\nconst emit = defineEmits(scrollbarEmits)\n\nconst ns = useNamespace('scrollbar')\n\nlet stopResizeObserver: (() => void) | undefined = undefined\nlet stopResizeListener: (() => void) | undefined = undefined\nlet wrapScrollTop = 0\nlet wrapScrollLeft = 0\n\nconst scrollbarRef = ref<HTMLDivElement>()\nconst wrapRef = ref<HTMLDivElement>()\nconst resizeRef = ref<HTMLElement>()\nconst barRef = ref<BarInstance>()\n\nconst wrapStyle = 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\nconst wrapKls = computed(() => {\n  return [\n    props.wrapClass,\n    ns.e('wrap'),\n    { [ns.em('wrap', 'hidden-default')]: !props.native },\n  ]\n})\n\nconst resizeKls = computed(() => {\n  return [ns.e('view'), props.viewClass]\n})\n\nconst handleScroll = () => {\n  if (wrapRef.value) {\n    barRef.value?.handleScroll(wrapRef.value)\n    wrapScrollTop = wrapRef.value.scrollTop\n    wrapScrollLeft = wrapRef.value.scrollLeft\n\n    emit('scroll', {\n      scrollTop: wrapRef.value.scrollTop,\n      scrollLeft: wrapRef.value.scrollLeft,\n    })\n  }\n}\n\n// TODO: refactor method overrides, due to script setup dts\n// @ts-nocheck\nfunction scrollTo(xCord: number, yCord?: number): void\nfunction scrollTo(options: ScrollToOptions): void\nfunction scrollTo(arg1: unknown, arg2?: number) {\n  if (isObject(arg1)) {\n    wrapRef.value!.scrollTo(arg1)\n  } else if (isNumber(arg1) && isNumber(arg2)) {\n    wrapRef.value!.scrollTo(arg1, arg2)\n  }\n}\n\nconst setScrollTop = (value: number) => {\n  if (!isNumber(value)) {\n    debugWarn(COMPONENT_NAME, 'value must be a number')\n    return\n  }\n  wrapRef.value!.scrollTop = value\n}\n\nconst setScrollLeft = (value: number) => {\n  if (!isNumber(value)) {\n    debugWarn(COMPONENT_NAME, 'value must be a number')\n    return\n  }\n  wrapRef.value!.scrollLeft = value\n}\n\nconst update = () => {\n  barRef.value?.update()\n}\n\nwatch(\n  () => props.noresize,\n  (noresize) => {\n    if (noresize) {\n      stopResizeObserver?.()\n      stopResizeListener?.()\n    } else {\n      ;({ stop: stopResizeObserver } = useResizeObserver(resizeRef, update))\n      stopResizeListener = useEventListener('resize', update)\n    }\n  },\n  { immediate: true }\n)\n\nwatch(\n  () => [props.maxHeight, props.height],\n  () => {\n    if (!props.native)\n      nextTick(() => {\n        update()\n        if (wrapRef.value) {\n          barRef.value?.handleScroll(wrapRef.value)\n        }\n      })\n  }\n)\n\nprovide(\n  scrollbarContextKey,\n  reactive({\n    scrollbarElement: scrollbarRef,\n    wrapElement: wrapRef,\n  })\n)\n\nonActivated(() => {\n  if (wrapRef.value) {\n    wrapRef.value.scrollTop = wrapScrollTop\n    wrapRef.value.scrollLeft = wrapScrollLeft\n  }\n})\n\nonMounted(() => {\n  if (!props.native)\n    nextTick(() => {\n      update()\n    })\n})\nonUpdated(() => update())\n\ndefineExpose({\n  /** @description scrollbar wrap ref */\n  wrapRef,\n  /** @description update scrollbar state manually */\n  update,\n  /** @description scrolls to a particular set of coordinates */\n  scrollTo,\n  /** @description set distance to scroll top */\n  setScrollTop,\n  /** @description set distance to scroll left */\n  setScrollLeft,\n  /** @description handle scroll event */\n  handleScroll,\n})\n</script>\n"],"names":["_openBlock","_createElementBlock","_normalizeClass","_unref","_createElementVNode","_normalizeStyle"],"mappings":"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"}