rx-compo 1.0.79 → 1.0.80

package/es/packages/components/rxtabs/src/rxtabs2.mjs

@@ -1,44 +1,232 @@
-import '../../../utils/index.mjs';
-import { buildProps } from '../../../utils/vue/props/runtime.mjs';
+import { defineComponent, ref, createElementVNode, createTextVNode, resolveComponent, openBlock, createElementBlock, createVNode, mergeProps, createSlots, withCtx, Fragment, renderList, createBlock, resolveDynamicComponent, normalizeProps, createCommentVNode, guardReactiveProps, renderSlot, normalizeStyle, toDisplayString } from 'vue';
+import { useVModel } from '@vueuse/core';
+import { isEmpty } from 'lodash-es';
+import { ElRxbutton } from '../../rxbutton/index.mjs';
+import { ElDropdown, ElDropdownItem, ElDropdownMenu } from '../../dropdown/index.mjs';
+import { ElTabs, ElTabPane } from '../../tabs/index.mjs';
+import { rxtabsProps } from './rxtabs.mjs';
+import { useTabs } from './hooks/useTabs.mjs';
+import { useController } from './hooks/useController.mjs';
+import { LEVEL_1, LEVEL_2 } from './enums/base.mjs';
+import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
 
-const rxtabsProps = buildProps({
-  modelValue: {
-    type: [String, Number],
-    default: ""
+const _sfc_main = defineComponent({
+  name: "ElRxtabs",
+  components: {
+    ElTabs,
+    ElTabPane,
+    ElRxbutton,
+    ElDropdown,
+    ElDropdownItem,
+    ElDropdownMenu
   },
-  rxTabPaneOptions: {
-    type: Array,
-    default: []
-  },
-  level: {
-    type: Number,
-    default: 1
-  },
-  rxDropDownAttrs: {
-    type: Object,
-    default: void 0
-  },
-  isDropDown: {
-    type: Boolean,
-    default: false
-  },
-  isAddTabs: {
-    type: Boolean,
-    default: false
-  },
-  firstLevelFormatter: {
-    type: Function,
-    default: void 0
-  },
-  SecondLevelFormatter: {
-    type: Function,
-    default: void 0
-  },
-  customDropDownFormatter: {
-    type: Function,
-    default: void 0
+  emit: ["handleEmitTabsAdd"],
+  props: rxtabsProps,
+  setup(props, { emit }) {
+    const rxTabsRef = ref();
+    const rxTabsRenderStatus = ref(false);
+    const rxTabsModelValue = useVModel(props, "modelValue", emit);
+    const { rxTabPaneOptionsComputed } = useTabs(props);
+    const { rxDropDownItem, dropDownHeight, handleEmitTabsAdd, handleCommand } = useController(props, rxTabsRef, rxTabsModelValue, emit);
+    return {
+      rxTabsModelValue,
+      rxTabPaneOptionsComputed,
+      rxTabsRenderStatus,
+      rxDropDownItem,
+      rxTabsRef,
+      dropDownHeight,
+      LEVEL_1,
+      LEVEL_2,
+      isEmpty,
+      handleEmitTabsAdd,
+      handleCommand
+    };
   }
 });
+const _hoisted_1 = { class: "flex" };
+const _hoisted_2 = { key: 0 };
+const _hoisted_3 = /* @__PURE__ */ createElementVNode("span", { class: "el-dropdown-link" }, [
+  /* @__PURE__ */ createElementVNode("svg", {
+    width: "26",
+    height: "26",
+    viewBox: "0 0 26 26",
+    fill: "none",
+    xmlns: "http://www.w3.org/2000/svg",
+    class: "text-[#5C6781] hover:text-[#3370FF]"
+  }, [
+    /* @__PURE__ */ createElementVNode("path", {
+      "fill-rule": "evenodd",
+      "clip-rule": "evenodd",
+      d: "M23 9.596L18.404 5L16.99 6.414L20.172 9.596L16.99 12.778L18.404 14.192L23 9.596ZM22 21.0957V19.0957H4V21.0957H22ZM13 12.0957V14.0957H4V12.0957H13ZM13 7.0957V5.0957H4V7.0957H13Z",
+      fill: "currentColor"
+    })
+  ])
+], -1);
+const _hoisted_4 = {
+  key: 1,
+  class: "flex items-center"
+};
+const _hoisted_5 = {
+  key: 0,
+  class: "flex items-center"
+};
+const _hoisted_6 = /* @__PURE__ */ createTextVNode("\u6DFB\u52A0");
+const _hoisted_7 = {
+  key: 1,
+  class: "flex items-center"
+};
+const _hoisted_8 = /* @__PURE__ */ createElementVNode("svg", {
+  width: "18",
+  height: "18",
+  viewBox: "0 0 18 18",
+  fill: "none",
+  xmlns: "http://www.w3.org/2000/svg"
+}, [
+  /* @__PURE__ */ createElementVNode("rect", {
+    x: "5",
+    y: "8",
+    width: "8",
+    height: "2",
+    fill: "#3370FF"
+  }),
+  /* @__PURE__ */ createElementVNode("rect", {
+    x: "8",
+    y: "5",
+    width: "2",
+    height: "8",
+    fill: "#3370FF"
+  }),
+  /* @__PURE__ */ createElementVNode("rect", {
+    x: "1",
+    y: "1",
+    width: "16",
+    height: "16",
+    stroke: "#3370FF",
+    "stroke-width": "2"
+  })
+], -1);
+const _hoisted_9 = [
+  _hoisted_8
+];
+function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
+  const _component_el_tab_pane = resolveComponent("el-tab-pane");
+  const _component_el_tabs = resolveComponent("el-tabs");
+  const _component_el_dropdown_item = resolveComponent("el-dropdown-item");
+  const _component_el_dropdown_menu = resolveComponent("el-dropdown-menu");
+  const _component_el_dropdown = resolveComponent("el-dropdown");
+  const _component_el_rxbutton = resolveComponent("el-rxbutton");
+  return openBlock(), createElementBlock("div", _hoisted_1, [
+    createVNode(_component_el_tabs, mergeProps({ ref: "rxTabsRef" }, _ctx.$attrs, {
+      modelValue: _ctx.rxTabsModelValue,
+      "onUpdate:modelValue": _cache[0] || (_cache[0] = ($event) => _ctx.rxTabsModelValue = $event),
+      class: "rx-tabs"
+    }), createSlots({
+      default: withCtx(() => [
+        !_ctx.isEmpty(_ctx.rxTabPaneOptionsComputed) ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(_ctx.rxTabPaneOptionsComputed, (item, index) => {
+          return openBlock(), createBlock(_component_el_tab_pane, mergeProps({ key: index }, item), createSlots({
+            default: withCtx(() => [
+              item.defaultSlots ? (openBlock(), createBlock(resolveDynamicComponent(item.defaultSlots.call(null, item)), normalizeProps(mergeProps({ key: 0 }, item)), null, 16)) : createCommentVNode("v-if", true)
+            ]),
+            _: 2
+          }, [
+            item.labelSlots ? {
+              name: "label",
+              fn: withCtx(() => [
+                (openBlock(), createBlock(resolveDynamicComponent(item.labelSlots.call(null, item)), normalizeProps(guardReactiveProps(item)), null, 16))
+              ])
+            } : void 0
+          ]), 1040);
+        }), 128)) : createCommentVNode("v-if", true)
+      ]),
+      _: 2
+    }, [
+      _ctx.$slots.default ? {
+        name: "default",
+        fn: withCtx(() => [
+          renderSlot(_ctx.$slots, "default")
+        ])
+      } : void 0
+    ]), 1040, ["modelValue"]),
+    createElementVNode("div", {
+      style: normalizeStyle({ height: `${_ctx.dropDownHeight}px` }),
+      class: "flex items-center ml-[16px] space-x-4"
+    }, [
+      _ctx.isDropDown ? (openBlock(), createElementBlock("div", _hoisted_2, [
+        createCommentVNode(" \u81EA\u5B9A\u4E49\u51FD\u6570DropDown\u533A\u57DF "),
+        _ctx.customDropDownFormatter ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.customDropDownFormatter.call(null, { ..._ctx.$attrs, ..._ctx.$props })), normalizeProps(mergeProps({ key: 0 }, { ..._ctx.$attrs, ..._ctx.$props })), null, 16)) : _ctx.$slots.customDropDown ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+          createCommentVNode(" \u81EA\u5B9A\u4E49\u6A21\u677FDropDown\u533A\u57DF "),
+          renderSlot(_ctx.$slots, "customDropDown")
+        ], 2112)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+          createCommentVNode(" \u9ED8\u8BA4 "),
+          createVNode(_component_el_dropdown, mergeProps(_ctx.rxDropDownAttrs, { onCommand: _ctx.handleCommand }), {
+            dropdown: withCtx(() => [
+              renderSlot(_ctx.$slots, "custom"),
+              createVNode(_component_el_dropdown_menu, null, {
+                default: withCtx(() => [
+                  (openBlock(true), createElementBlock(Fragment, null, renderList(_ctx.rxDropDownItem, (item, index) => {
+                    return openBlock(), createBlock(_component_el_dropdown_item, mergeProps({ key: index }, item), {
+                      default: withCtx(() => [
+                        createCommentVNode(" \u51FD\u6570\u5F0F\u63D2\u69FD "),
+                        item.dropDownItemSlots ? (openBlock(), createBlock(resolveDynamicComponent(item.dropDownItemSlots.call(null, item)), normalizeProps(mergeProps({ key: 0 }, item)), null, 16)) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                          createCommentVNode(" \u6A21\u677F\u63D2\u69FD "),
+                          createElementVNode("span", null, toDisplayString(item.label), 1)
+                        ], 2112))
+                      ]),
+                      _: 2
+                    }, 1040);
+                  }), 128))
+                ]),
+                _: 1
+              })
+            ]),
+            default: withCtx(() => [
+              _hoisted_3
+            ]),
+            _: 3
+          }, 16, ["onCommand"])
+        ], 2112))
+      ])) : createCommentVNode("v-if", true),
+      createCommentVNode(" \u6309\u94AE\u7EC4 "),
+      _ctx.isAddTabs ? (openBlock(), createElementBlock("div", _hoisted_4, [
+        createCommentVNode(" \u4E00\u7EA7tabs "),
+        _ctx.level === _ctx.LEVEL_1 ? (openBlock(), createElementBlock("div", _hoisted_5, [
+          createCommentVNode(" \u51FD\u6570\u63D2\u69FD "),
+          _ctx.firstLevelFormatter ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.firstLevelFormatter.call(null, { ..._ctx.$attrs, ..._ctx.$props })), normalizeProps(mergeProps({ key: 0 }, { ..._ctx.$attrs, ..._ctx.$props })), null, 16)) : _ctx.$slots.level_1 ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            createCommentVNode(" \u6A21\u677F\u63D2\u69FD "),
+            renderSlot(_ctx.$slots, "level_1")
+          ], 2112)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+            createCommentVNode(" \u9ED8\u8BA4 "),
+            createVNode(_component_el_rxbutton, {
+              type: "primary",
+              plain: "",
+              onClick: _ctx.handleEmitTabsAdd
+            }, {
+              default: withCtx(() => [
+                _hoisted_6
+              ]),
+              _: 1
+            }, 8, ["onClick"])
+          ], 2112))
+        ])) : createCommentVNode("v-if", true),
+        createCommentVNode(" \u4E8C\u7EA7tabs "),
+        _ctx.level === _ctx.LEVEL_2 ? (openBlock(), createElementBlock("div", _hoisted_7, [
+          createCommentVNode(" \u51FD\u6570\u63D2\u69FD "),
+          _ctx.SecondLevelFormatter ? (openBlock(), createBlock(resolveDynamicComponent(_ctx.SecondLevelFormatter.call(null, { ..._ctx.$attrs, ..._ctx.$props })), normalizeProps(mergeProps({ key: 0 }, { ..._ctx.$attrs, ..._ctx.$props })), null, 16)) : _ctx.$slots.level_2 ? (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            createCommentVNode(" \u6A21\u677F\u63D2\u69FD "),
+            renderSlot(_ctx.$slots, "level_2")
+          ], 2112)) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+            createCommentVNode(" \u9ED8\u8BA4 "),
+            createElementVNode("span", {
+              class: "cursor-pointer el-dropdown-link-add",
+              onClick: _cache[1] || (_cache[1] = (...args) => _ctx.handleEmitTabsAdd && _ctx.handleEmitTabsAdd(...args))
+            }, _hoisted_9)
+          ], 2112))
+        ])) : createCommentVNode("v-if", true)
+      ])) : createCommentVNode("v-if", true)
+    ], 4)
+  ]);
+}
+var Rxtabs = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/kaiserdu/Desktop/XZE/Z2/rx-compo/packages/components/rxtabs/src/rxtabs.vue"]]);
 
-export { rxtabsProps };
+export { Rxtabs as default };
 //# sourceMappingURL=rxtabs2.mjs.map

package/es/packages/components/rxtabs/src/rxtabs2.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"rxtabs2.mjs","sources":["../../../../../../../packages/components/rxtabs/src/rxtabs.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\n\nimport type { ExtractPropTypes, PropType, Ref } from 'vue'\nimport type Rxtabs from './rxtabs.vue'\n\nexport interface RxTabPaneType {\n  label: string\n  disabled: boolean\n  name: string | number\n  closable: boolean\n  lazy: boolean\n  defaultSlots?: Record<string | number, any>\n  labelSlots?: Record<string | number, any>\n  dropDownItemSlots?: Record<string | number, any>\n}\n\nexport const rxtabsProps = buildProps({\n  modelValue: {\n    type: [String, Number],\n    default: '',\n  },\n  rxTabPaneOptions: {\n    type: Array as PropType<RxTabPaneType[]>,\n    default: [],\n  },\n  level: {\n    type: Number,\n    default: 1,\n  },\n  rxDropDownAttrs: {\n    type: Object,\n    default: undefined,\n  },\n  isDropDown: {\n    type: Boolean,\n    default: false,\n  },\n  isAddTabs: {\n    type: Boolean,\n    default: false,\n  },\n  firstLevelFormatter: {\n    type: Function,\n    default: undefined,\n  },\n  SecondLevelFormatter: {\n    type: Function,\n    default: undefined,\n  },\n  customDropDownFormatter: {\n    type: Function,\n    default: undefined,\n  },\n})\nexport type RxtabsProps = ExtractPropTypes<typeof rxtabsProps>\nexport type RxtabsInstance = InstanceType<typeof Rxtabs>\nexport interface RxTabsAddEmitType {\n  props: RxtabsProps\n  rxTabsModelValue: string | number\n  rxTabsRef: Ref\n}\n"],"names":[],"mappings":";;;AACY,MAAC,WAAW,GAAG,UAAU,CAAC;AACtC,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,gBAAgB,EAAE;AACpB,IAAI,IAAI,EAAE,KAAK;AACf,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,CAAC;AACd,GAAG;AACH,EAAE,eAAe,EAAE;AACnB,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,mBAAmB,EAAE;AACvB,IAAI,IAAI,EAAE,QAAQ;AAClB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,oBAAoB,EAAE;AACxB,IAAI,IAAI,EAAE,QAAQ;AAClB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,EAAE,uBAAuB,EAAE;AAC3B,IAAI,IAAI,EAAE,QAAQ;AAClB,IAAI,OAAO,EAAE,KAAK,CAAC;AACnB,GAAG;AACH,CAAC;;;;"}
+{"version":3,"file":"rxtabs2.mjs","sources":["../../../../../../../packages/components/rxtabs/src/rxtabs.vue"],"sourcesContent":["<template>\n  <div class=\"flex\">\n    <el-tabs\n      ref=\"rxTabsRef\"\n      v-bind:=\"$attrs\"\n      v-model=\"rxTabsModelValue\"\n      class=\"rx-tabs\"\n    >\n      <!-- 函数插槽 -->\n      <template v-if=\"!isEmpty(rxTabPaneOptionsComputed)\">\n        <el-tab-pane\n          v-for=\"(item, index) in rxTabPaneOptionsComputed\"\n          :key=\"index\"\n          v-bind:=\"item\"\n        >\n          <!-- el-tabe-pane 默认函数插槽 -->\n          <component\n            :is=\"item.defaultSlots.call(null, item)\"\n            v-if=\"item.defaultSlots\"\n            v-bind:=\"item\"\n          />\n          <!-- el-tabe-pane label函数插槽 -->\n          <template v-if=\"item.labelSlots\" #label>\n            <component :is=\"item.labelSlots.call(null, item)\" v-bind:=\"item\" />\n          </template>\n        </el-tab-pane>\n      </template>\n      <!-- 默认插槽 -->\n      <template v-if=\"$slots.default\" #default>\n        <slot />\n      </template>\n    </el-tabs>\n    <div\n      :style=\"{ height: `${dropDownHeight}px` }\"\n      class=\"flex items-center ml-[16px] space-x-4\"\n    >\n      <div v-if=\"isDropDown\">\n        <!-- 自定义函数DropDown区域 -->\n        <component\n          :is=\"customDropDownFormatter.call(null, { ...$attrs, ...$props })\"\n          v-if=\"customDropDownFormatter\"\n          v-bind:=\"{ ...$attrs, ...$props }\"\n        />\n        <!-- 自定义模板DropDown区域 -->\n        <slot v-else-if=\"$slots.customDropDown\" name=\"customDropDown\" />\n        <!-- 默认 -->\n        <el-dropdown v-else v-bind:=\"rxDropDownAttrs\" @command=\"handleCommand\">\n          <span class=\"el-dropdown-link\">\n            <svg\n              width=\"26\"\n              height=\"26\"\n              viewBox=\"0 0 26 26\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n              class=\"text-[#5C6781] hover:text-[#3370FF]\"\n            >\n              <path\n                fill-rule=\"evenodd\"\n                clip-rule=\"evenodd\"\n                d=\"M23 9.596L18.404 5L16.99 6.414L20.172 9.596L16.99 12.778L18.404 14.192L23 9.596ZM22 21.0957V19.0957H4V21.0957H22ZM13 12.0957V14.0957H4V12.0957H13ZM13 7.0957V5.0957H4V7.0957H13Z\"\n                fill=\"currentColor\"\n              />\n            </svg>\n          </span>\n          <template #dropdown>\n            <slot name=\"custom\" />\n            <el-dropdown-menu>\n              <el-dropdown-item\n                v-for=\"(item, index) in rxDropDownItem\"\n                :key=\"index\"\n                v-bind:=\"item\"\n              >\n                <!-- 函数式插槽 -->\n                <component\n                  :is=\"item.dropDownItemSlots.call(null, item)\"\n                  v-if=\"item.dropDownItemSlots\"\n                  v-bind:=\"item\"\n                />\n                <!-- 模板插槽 -->\n                <span v-else>{{ item.label }}</span>\n              </el-dropdown-item>\n            </el-dropdown-menu>\n          </template>\n        </el-dropdown>\n      </div>\n      <!-- 按钮组 -->\n      <div v-if=\"isAddTabs\" class=\"flex items-center\">\n        <!-- 一级tabs -->\n        <div v-if=\"level === LEVEL_1\" class=\"flex items-center\">\n          <!-- 函数插槽 -->\n          <component\n            :is=\"firstLevelFormatter.call(null, { ...$attrs, ...$props })\"\n            v-if=\"firstLevelFormatter\"\n            v-bind:=\"{ ...$attrs, ...$props }\"\n          />\n          <!-- 模板插槽 -->\n          <slot v-else-if=\"$slots.level_1\" name=\"level_1\" />\n          <!-- 默认 -->\n          <el-rxbutton v-else type=\"primary\" plain @click=\"handleEmitTabsAdd\"\n            >添加</el-rxbutton\n          >\n        </div>\n        <!-- 二级tabs -->\n        <div v-if=\"level === LEVEL_2\" class=\"flex items-center\">\n          <!-- 函数插槽 -->\n          <component\n            :is=\"SecondLevelFormatter.call(null, { ...$attrs, ...$props })\"\n            v-if=\"SecondLevelFormatter\"\n            v-bind:=\"{ ...$attrs, ...$props }\"\n          />\n          <!-- 模板插槽 -->\n          <slot v-else-if=\"$slots.level_2\" name=\"level_2\" />\n          <!-- 默认 -->\n          <span\n            v-else\n            class=\"cursor-pointer el-dropdown-link-add\"\n            @click=\"handleEmitTabsAdd\"\n          >\n            <svg\n              width=\"18\"\n              height=\"18\"\n              viewBox=\"0 0 18 18\"\n              fill=\"none\"\n              xmlns=\"http://www.w3.org/2000/svg\"\n            >\n              <rect x=\"5\" y=\"8\" width=\"8\" height=\"2\" fill=\"#3370FF\" />\n              <rect x=\"8\" y=\"5\" width=\"2\" height=\"8\" fill=\"#3370FF\" />\n              <rect\n                x=\"1\"\n                y=\"1\"\n                width=\"16\"\n                height=\"16\"\n                stroke=\"#3370FF\"\n                stroke-width=\"2\"\n              />\n            </svg>\n          </span>\n        </div>\n      </div>\n    </div>\n  </div>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, ref } from 'vue'\nimport { useVModel } from '@vueuse/core'\nimport { isEmpty } from 'lodash-es'\nimport { ElRxbutton } from '@element-plus/components/rxbutton'\nimport {\n  ElDropdown,\n  ElDropdownItem,\n  ElDropdownMenu,\n} from '@element-plus/components/dropdown'\nimport { ElTabPane, ElTabs } from '@element-plus/components/tabs'\nimport { rxtabsProps } from './rxtabs'\nimport { useTabs } from './hooks/useTabs'\nimport { useController } from './hooks/useController'\nimport { LEVEL_1, LEVEL_2 } from './enums/base'\n\nexport default defineComponent({\n  name: 'ElRxtabs',\n  components: {\n    ElTabs,\n    ElTabPane,\n    ElRxbutton,\n    ElDropdown,\n    ElDropdownItem,\n    ElDropdownMenu,\n  },\n  emit: ['handleEmitTabsAdd'],\n  props: rxtabsProps,\n  setup(props, { emit }) {\n    const rxTabsRef = ref()\n    const rxTabsRenderStatus = ref<boolean>(false)\n    const rxTabsModelValue = useVModel(props, 'modelValue', emit)\n    const { rxTabPaneOptionsComputed } = useTabs(props)\n    const { rxDropDownItem, dropDownHeight, handleEmitTabsAdd, handleCommand } =\n      useController(props, rxTabsRef, rxTabsModelValue, emit)\n    return {\n      rxTabsModelValue,\n      rxTabPaneOptionsComputed,\n      rxTabsRenderStatus,\n      rxDropDownItem,\n      rxTabsRef,\n      dropDownHeight,\n      LEVEL_1,\n      LEVEL_2,\n      isEmpty,\n      handleEmitTabsAdd,\n      handleCommand,\n    }\n  },\n})\n</script>\n<style scoped lang=\"scss\"></style>\n"],"names":["_createElementVNode","_openBlock","_createElementBlock","_createVNode","_mergeProps","_createSlots","_Fragment","_createBlock","_withCtx","_resolveDynamicComponent","_normalizeProps","_createCommentVNode","_renderSlot","_normalizeStyle","_renderList","_toDisplayString"],"mappings":"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"}

package/es/packages/components/scrollbar/index.mjs

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

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

@@ -1,6 +1,6 @@
 import { defineComponent, ref, openBlock, createElementBlock, Fragment, createVNode } from 'vue';
 import { GAP } from './util.mjs';
-import Thumb from './thumb.mjs';
+import Thumb from './thumb2.mjs';
 import { barProps } from './bar.mjs';
 import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
 

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

@@ -1,135 +1,16 @@
-import { defineComponent, inject, ref, computed, onBeforeUnmount, toRef, openBlock, createBlock, Transition, unref, withCtx, withDirectives, createElementVNode, normalizeClass, normalizeStyle, vShow } from 'vue';
-import { isClient, useEventListener } from '@vueuse/core';
 import '../../../utils/index.mjs';
-import '../../../hooks/index.mjs';
-import { scrollbarContextKey } from './constants.mjs';
-import { BAR_MAP, renderThumbStyle } from './util.mjs';
-import { thumbProps } from './thumb2.mjs';
-import _export_sfc from '../../../../_virtual/plugin-vue_export-helper.mjs';
-import { useNamespace } from '../../../hooks/use-namespace/index.mjs';
-import { throwError } from '../../../utils/error.mjs';
+import { buildProps } from '../../../utils/vue/props/runtime.mjs';
 
-const COMPONENT_NAME = "Thumb";
-const _sfc_main = /* @__PURE__ */ defineComponent({
-  __name: "thumb",
-  props: thumbProps,
-  setup(__props) {
-    const props = __props;
-    const scrollbar = inject(scrollbarContextKey);
-    const ns = useNamespace("scrollbar");
-    if (!scrollbar)
-      throwError(COMPONENT_NAME, "can not inject scrollbar context");
-    const instance = ref();
-    const thumb = ref();
-    const thumbState = ref({});
-    const visible = ref(false);
-    let cursorDown = false;
-    let cursorLeave = false;
-    let originalOnSelectStart = isClient ? document.onselectstart : null;
-    const bar = computed(() => BAR_MAP[props.vertical ? "vertical" : "horizontal"]);
-    const thumbStyle = computed(() => renderThumbStyle({
-      size: props.size,
-      move: props.move,
-      bar: bar.value
-    }));
-    const offsetRatio = computed(() => instance.value[bar.value.offset] ** 2 / scrollbar.wrapElement[bar.value.scrollSize] / props.ratio / thumb.value[bar.value.offset]);
-    const clickThumbHandler = (e) => {
-      var _a;
-      e.stopPropagation();
-      if (e.ctrlKey || [1, 2].includes(e.button))
-        return;
-      (_a = window.getSelection()) == null ? void 0 : _a.removeAllRanges();
-      startDrag(e);
-      const el = e.currentTarget;
-      if (!el)
-        return;
-      thumbState.value[bar.value.axis] = el[bar.value.offset] - (e[bar.value.client] - el.getBoundingClientRect()[bar.value.direction]);
-    };
-    const clickTrackHandler = (e) => {
-      if (!thumb.value || !instance.value || !scrollbar.wrapElement)
-        return;
-      const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]);
-      const thumbHalf = thumb.value[bar.value.offset] / 2;
-      const thumbPositionPercentage = (offset - thumbHalf) * 100 * offsetRatio.value / instance.value[bar.value.offset];
-      scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * scrollbar.wrapElement[bar.value.scrollSize] / 100;
-    };
-    const startDrag = (e) => {
-      e.stopImmediatePropagation();
-      cursorDown = true;
-      document.addEventListener("mousemove", mouseMoveDocumentHandler);
-      document.addEventListener("mouseup", mouseUpDocumentHandler);
-      originalOnSelectStart = document.onselectstart;
-      document.onselectstart = () => false;
-    };
-    const mouseMoveDocumentHandler = (e) => {
-      if (!instance.value || !thumb.value)
-        return;
-      if (cursorDown === false)
-        return;
-      const prevPage = thumbState.value[bar.value.axis];
-      if (!prevPage)
-        return;
-      const offset = (instance.value.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
-      const thumbClickPosition = thumb.value[bar.value.offset] - prevPage;
-      const thumbPositionPercentage = (offset - thumbClickPosition) * 100 * offsetRatio.value / instance.value[bar.value.offset];
-      scrollbar.wrapElement[bar.value.scroll] = thumbPositionPercentage * scrollbar.wrapElement[bar.value.scrollSize] / 100;
-    };
-    const mouseUpDocumentHandler = () => {
-      cursorDown = false;
-      thumbState.value[bar.value.axis] = 0;
-      document.removeEventListener("mousemove", mouseMoveDocumentHandler);
-      document.removeEventListener("mouseup", mouseUpDocumentHandler);
-      restoreOnselectstart();
-      if (cursorLeave)
-        visible.value = false;
-    };
-    const mouseMoveScrollbarHandler = () => {
-      cursorLeave = false;
-      visible.value = !!props.size;
-    };
-    const mouseLeaveScrollbarHandler = () => {
-      cursorLeave = true;
-      visible.value = cursorDown;
-    };
-    onBeforeUnmount(() => {
-      restoreOnselectstart();
-      document.removeEventListener("mouseup", mouseUpDocumentHandler);
-    });
-    const restoreOnselectstart = () => {
-      if (document.onselectstart !== originalOnSelectStart)
-        document.onselectstart = originalOnSelectStart;
-    };
-    useEventListener(toRef(scrollbar, "scrollbarElement"), "mousemove", mouseMoveScrollbarHandler);
-    useEventListener(toRef(scrollbar, "scrollbarElement"), "mouseleave", mouseLeaveScrollbarHandler);
-    return (_ctx, _cache) => {
-      return openBlock(), createBlock(Transition, {
-        name: unref(ns).b("fade"),
-        persisted: ""
-      }, {
-        default: withCtx(() => [
-          withDirectives(createElementVNode("div", {
-            ref_key: "instance",
-            ref: instance,
-            class: normalizeClass([unref(ns).e("bar"), unref(ns).is(unref(bar).key)]),
-            onMousedown: clickTrackHandler
-          }, [
-            createElementVNode("div", {
-              ref_key: "thumb",
-              ref: thumb,
-              class: normalizeClass(unref(ns).e("thumb")),
-              style: normalizeStyle(unref(thumbStyle)),
-              onMousedown: clickThumbHandler
-            }, null, 38)
-          ], 34), [
-            [vShow, _ctx.always || visible.value]
-          ])
-        ]),
-        _: 1
-      }, 8, ["name"]);
-    };
-  }
+const thumbProps = buildProps({
+  vertical: Boolean,
+  size: String,
+  move: Number,
+  ratio: {
+    type: Number,
+    required: true
+  },
+  always: Boolean
 });
-var Thumb = /* @__PURE__ */ _export_sfc(_sfc_main, [["__file", "/Users/kaiserdu/Desktop/XZE/Z2/rx-compo/packages/components/scrollbar/src/thumb.vue"]]);
 
-export { Thumb as default };
+export { thumbProps };
 //# sourceMappingURL=thumb.mjs.map

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

@@ -1 +1 @@
-{"version":3,"file":"thumb.mjs","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      />\n    </div>\n  </transition>\n</template>\n\n<script lang=\"ts\" setup>\nimport { computed, inject, onBeforeUnmount, ref, toRef } from 'vue'\nimport { useEventListener } from '@vueuse/core'\nimport { isClient, throwError } from '@element-plus/utils'\nimport { useNamespace } from '@element-plus/hooks'\nimport { scrollbarContextKey } from './constants'\nimport { BAR_MAP, renderThumbStyle } from './util'\nimport { thumbProps } from './thumb'\n\nconst COMPONENT_NAME = 'Thumb'\nconst props = defineProps(thumbProps)\n\nconst scrollbar = inject(scrollbarContextKey)\nconst ns = useNamespace('scrollbar')\n\nif (!scrollbar) throwError(COMPONENT_NAME, 'can not inject scrollbar context')\n\nconst instance = ref<HTMLDivElement>()\nconst thumb = ref<HTMLDivElement>()\n\nconst thumbState = ref<Partial<Record<'X' | 'Y', number>>>({})\nconst visible = ref(false)\n\nlet cursorDown = false\nlet cursorLeave = false\nlet originalOnSelectStart:\n  | ((this: GlobalEventHandlers, ev: Event) => any)\n  | null = isClient ? document.onselectstart : null\n\nconst bar = computed(() => BAR_MAP[props.vertical ? 'vertical' : 'horizontal'])\n\nconst thumbStyle = computed(() =>\n  renderThumbStyle({\n    size: props.size,\n    move: props.move,\n    bar: bar.value,\n  })\n)\n\nconst 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\nconst 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\nconst 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 * scrollbar.wrapElement[bar.value.scrollSize]) /\n    100\n}\n\nconst 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\nconst 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 * scrollbar.wrapElement[bar.value.scrollSize]) /\n    100\n}\n\nconst 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\nconst mouseMoveScrollbarHandler = () => {\n  cursorLeave = false\n  visible.value = !!props.size\n}\n\nconst mouseLeaveScrollbarHandler = () => {\n  cursorLeave = true\n  visible.value = cursorDown\n}\n\nonBeforeUnmount(() => {\n  restoreOnselectstart()\n  document.removeEventListener('mouseup', mouseUpDocumentHandler)\n})\n\nconst restoreOnselectstart = () => {\n  if (document.onselectstart !== originalOnSelectStart)\n    document.onselectstart = originalOnSelectStart\n}\n\nuseEventListener(\n  toRef(scrollbar, 'scrollbarElement'),\n  'mousemove',\n  mouseMoveScrollbarHandler\n)\nuseEventListener(\n  toRef(scrollbar, 'scrollbarElement'),\n  'mouseleave',\n  mouseLeaveScrollbarHandler\n)\n</script>\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"thumb.mjs","sources":["../../../../../../../packages/components/scrollbar/src/thumb.ts"],"sourcesContent":["import { buildProps } from '@element-plus/utils'\nimport type { ExtractPropTypes } from 'vue'\nimport type Thumb from './thumb.vue'\n\nexport const thumbProps = buildProps({\n  vertical: Boolean,\n  size: String,\n  move: Number,\n  ratio: {\n    type: Number,\n    required: true,\n  },\n  always: Boolean,\n} as const)\nexport type ThumbProps = ExtractPropTypes<typeof thumbProps>\n\nexport type ThumbInstance = InstanceType<typeof Thumb>\n"],"names":[],"mappings":";;;AACY,MAAC,UAAU,GAAG,UAAU,CAAC;AACrC,EAAE,QAAQ,EAAE,OAAO;AACnB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,MAAM,EAAE,OAAO;AACjB,CAAC;;;;"}