@koi-design/uxd-ui 14.0.4 → 14.0.5

package/es/components/Table/tableUnits/TableCell.mjs

@@ -1,13 +1,14 @@
-import { defineComponent, inject, ref, computed, watch, resolveComponent, openBlock, createElementBlock, mergeProps, createBlock, normalizeClass, withCtx, Fragment, renderList, normalizeStyle, createElementVNode, createVNode, createCommentVNode, toDisplayString, createTextVNode } from 'vue';
+import { defineComponent, inject, ref, computed, watch, nextTick, resolveComponent, openBlock, createBlock, withCtx, createElementBlock, mergeProps, normalizeClass, Fragment, renderList, normalizeStyle, createElementVNode, createVNode, createCommentVNode, toDisplayString, createTextVNode } from 'vue';
 import { get } from 'lodash-unified';
 import { UTooltip } from '../../Tooltip/index.mjs';
 import { USkeleton } from '../../Skeleton/index.mjs';
 import Render from '../../base/Render.mjs';
 import ExpandIcon from './ExpandIcon.mjs';
 import '../../../utils/index.mjs';
-import { getColumnKey } from '../utils.mjs';
+import ResizeObserver from '../../base/ResizeObserver.mjs';
 import _export_sfc from '../../../_virtual/plugin-vue_export-helper.mjs';
 import { getStyle } from '../../../utils/dom.mjs';
+import { debounce } from '../../../utils/tools.mjs';
 
 const USkeletonItem = USkeleton.Item;
 const _sfc_main = defineComponent({
@@ -17,7 +18,8 @@ const _sfc_main = defineComponent({
     ExpandIcon,
     UTooltip,
     USkeleton,
-    USkeletonItem
+    USkeletonItem,
+    ResizeObserver
   },
   props: {
     prefixCls: {
@@ -58,12 +60,12 @@ const _sfc_main = defineComponent({
       props: { indentSize },
       expand: { handleExpandChange, isRowExpanded },
       filterAndSorter: { hasAction, hasSorters, hasFilters, isSortColumn },
-      size: { sizesMap },
       pagination
     } = inject("tableContext", {});
     const cellRef = ref();
     const ellipsisSpanRef = ref();
     const isOverflow = ref(false);
+    const isMinWidth = ref(false);
     const renderFn = computed(() => {
       const { render } = props.column;
       return render || null;
@@ -108,6 +110,9 @@ const _sfc_main = defineComponent({
       if (right !== void 0) {
         style.right = `${right}px`;
       }
+      if (isMinWidth.value) {
+        style.width = `${props.column.minWidth}px`;
+      }
       return style;
     });
     const handleExpand = (e) => {
@@ -125,26 +130,25 @@ const _sfc_main = defineComponent({
         e
       );
     };
-    watch(
-      () => sizesMap,
-      () => {
+    const checkWidth = ({ target, width }) => {
+      nextTick(() => {
         if (ellipsisSpanRef.value) {
-          const cell = cellRef.value;
+          const cell = target;
           const padding = (Number.parseInt(getStyle(cell, "paddingLeft")) || 0) + (Number.parseInt(getStyle(cell, "paddingRight")) || 0);
           const span = ellipsisSpanRef.value;
           const range = document.createRange();
           range.setStart(span, 0);
           range.setEnd(span, span.childNodes.length);
           const rangeWidth = range.getBoundingClientRect().width;
-          const colKey = getColumnKey(props.column);
-          const cellWidth = sizesMap[colKey];
-          if (rangeWidth + padding > cellWidth) {
+          if (rangeWidth + padding > width) {
             isOverflow.value = true;
+          } else {
+            isOverflow.value = false;
           }
         }
-      },
-      { deep: true }
-    );
+      });
+    };
+    const debouncedHandleResize = debounce((args) => checkWidth(args), 100);
     return {
       tablePrefixCls,
       isRender,
@@ -164,99 +168,108 @@ const _sfc_main = defineComponent({
       pagination,
       cellRef,
       ellipsisSpanRef,
-      isOverflow
+      isOverflow,
+      debouncedHandleResize
     };
   }
 });
 function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
-  var _a;
   const _component_USkeletonItem = resolveComponent("USkeletonItem");
   const _component_USkeleton = resolveComponent("USkeleton");
   const _component_ExpandIcon = resolveComponent("ExpandIcon");
   const _component_Render = resolveComponent("Render");
   const _component_UTooltip = resolveComponent("UTooltip");
-  return _ctx.showCell ? (openBlock(), createElementBlock("td", mergeProps({
-    key: 0,
-    ref: "cellRef"
-  }, _ctx.tdProps, {
-    class: {
-      [`${_ctx.prefixCls}-cell-custom`]: !!((_a = _ctx.tdProps) == null ? void 0 : _a.class),
-      [`${_ctx.column.className}`]: !!_ctx.column.className,
-      [`${_ctx.prefixCls}-cell-ellipsis`]: !!_ctx.column.ellipsis,
-      [`${_ctx.prefixCls}-cell-break-word`]: !!_ctx.column.width,
-      [`${_ctx.tablePrefixCls}-column-has-actions`]: _ctx.hasAction(_ctx.column),
-      [`${_ctx.tablePrefixCls}-column-has-sorters`]: _ctx.hasSorters(_ctx.column),
-      [`${_ctx.tablePrefixCls}-column-has-filters`]: _ctx.hasFilters(_ctx.column),
-      [`${_ctx.tablePrefixCls}-column-sort`]: _ctx.isSortColumn(_ctx.column)
-    },
-    style: _ctx.tdStyle
-  }), [
-    _ctx.skeleton ? (openBlock(), createBlock(_component_USkeleton, {
-      key: 0,
-      class: normalizeClass(`${_ctx.prefixCls}-skeleton-wrap`),
-      active: ""
-    }, {
-      default: withCtx(() => [
-        _ctx.column.skeleton ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(Array(_ctx.column.skeleton.length), (_, ski) => {
-          return openBlock(), createBlock(_component_USkeletonItem, {
-            key: ski,
-            type: _ctx.column.skeleton[ski].type,
-            style: normalizeStyle(_ctx.column.skeleton[ski].style)
-          }, null, 8, ["type", "style"]);
-        }), 128)) : (openBlock(), createBlock(_component_USkeletonItem, {
-          key: 1,
-          type: "text",
-          style: { "width": "50%" }
-        }))
-      ]),
-      _: 1
-    }, 8, ["class"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-      _ctx.expandIcon ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
-        createElementVNode("span", {
-          class: normalizeClass(`${_ctx.prefixCls}-indent indent-level-${_ctx.indent}`),
-          style: normalizeStyle({ paddingLeft: `${_ctx.indentSize * _ctx.indent}px` })
-        }, null, 6),
-        createVNode(_component_ExpandIcon, {
-          "need-indent-spaced": "",
-          expandable: !!_ctx.data.children,
-          "need-loading": _ctx.data.children === true,
-          "row-key": _ctx.rowKey,
-          expanded: _ctx.isRowExpanded(_ctx.rowKey, true),
-          onExpand: _ctx.handleExpand,
-          onAsyncExpand: _ctx.handleAsyncExpand
-        }, null, 8, ["expandable", "need-loading", "row-key", "expanded", "onExpand", "onAsyncExpand"])
-      ], 64)) : createCommentVNode("v-if", true),
-      _ctx.isRender ? (openBlock(), createBlock(_component_Render, {
-        key: 1,
-        render: () => {
-          var _a2;
-          return (_a2 = _ctx.renderFn) == null ? void 0 : _a2.call(_ctx, {
-            row: _ctx.data,
-            index: _ctx.index,
-            rowKey: _ctx.rowKey,
-            pagination: _ctx.pagination,
-            column: _ctx.column
-          });
-        }
-      }, null, 8, ["render"])) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
-        _ctx.column.ellipsis && _ctx.displayCell ? (openBlock(), createBlock(_component_UTooltip, {
+  const _component_ResizeObserver = resolveComponent("ResizeObserver");
+  return openBlock(), createBlock(_component_ResizeObserver, { onResize: _ctx.debouncedHandleResize }, {
+    default: withCtx(() => {
+      var _a;
+      return [
+        _ctx.showCell ? (openBlock(), createElementBlock("td", mergeProps({
           key: 0,
-          title: _ctx.displayCell.toString(),
-          disabled: !_ctx.isOverflow,
-          "mouse-enter-delay": 0.5
-        }, {
-          default: withCtx(() => [
-            createElementVNode("span", { ref: "ellipsisSpanRef" }, toDisplayString(_ctx.displayCell), 513)
-          ]),
-          _: 1
-        }, 8, ["title", "disabled"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-          createTextVNode(toDisplayString(_ctx.displayCell), 1)
-        ], 64))
-      ], 64))
-    ], 64))
-  ], 16)) : createCommentVNode("v-if", true);
+          ref: "cellRef"
+        }, _ctx.tdProps, {
+          class: {
+            [`${_ctx.prefixCls}-cell-custom`]: !!((_a = _ctx.tdProps) == null ? void 0 : _a.class),
+            [`${_ctx.column.className}`]: !!_ctx.column.className,
+            [`${_ctx.prefixCls}-cell-ellipsis`]: !!_ctx.column.ellipsis,
+            [`${_ctx.prefixCls}-cell-break-word`]: !!_ctx.column.width,
+            [`${_ctx.tablePrefixCls}-column-has-actions`]: _ctx.hasAction(_ctx.column),
+            [`${_ctx.tablePrefixCls}-column-has-sorters`]: _ctx.hasSorters(_ctx.column),
+            [`${_ctx.tablePrefixCls}-column-has-filters`]: _ctx.hasFilters(_ctx.column),
+            [`${_ctx.tablePrefixCls}-column-sort`]: _ctx.isSortColumn(_ctx.column)
+          },
+          style: _ctx.tdStyle
+        }), [
+          _ctx.skeleton ? (openBlock(), createBlock(_component_USkeleton, {
+            key: 0,
+            class: normalizeClass(`${_ctx.prefixCls}-skeleton-wrap`),
+            active: ""
+          }, {
+            default: withCtx(() => [
+              _ctx.column.skeleton ? (openBlock(true), createElementBlock(Fragment, { key: 0 }, renderList(Array(_ctx.column.skeleton.length), (_, ski) => {
+                return openBlock(), createBlock(_component_USkeletonItem, {
+                  key: ski,
+                  type: _ctx.column.skeleton[ski].type,
+                  style: normalizeStyle(_ctx.column.skeleton[ski].style)
+                }, null, 8, ["type", "style"]);
+              }), 128)) : (openBlock(), createBlock(_component_USkeletonItem, {
+                key: 1,
+                type: "text",
+                style: { "width": "50%" }
+              }))
+            ]),
+            _: 1
+          }, 8, ["class"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+            _ctx.expandIcon ? (openBlock(), createElementBlock(Fragment, { key: 0 }, [
+              createElementVNode("span", {
+                class: normalizeClass(`${_ctx.prefixCls}-indent indent-level-${_ctx.indent}`),
+                style: normalizeStyle({ paddingLeft: `${_ctx.indentSize * _ctx.indent}px` })
+              }, null, 6),
+              createVNode(_component_ExpandIcon, {
+                "need-indent-spaced": "",
+                expandable: !!_ctx.data.children,
+                "need-loading": _ctx.data.children === true,
+                "row-key": _ctx.rowKey,
+                expanded: _ctx.isRowExpanded(_ctx.rowKey, true),
+                onExpand: _ctx.handleExpand,
+                onAsyncExpand: _ctx.handleAsyncExpand
+              }, null, 8, ["expandable", "need-loading", "row-key", "expanded", "onExpand", "onAsyncExpand"])
+            ], 64)) : createCommentVNode("v-if", true),
+            _ctx.isRender ? (openBlock(), createBlock(_component_Render, {
+              key: 1,
+              render: () => {
+                var _a2;
+                return (_a2 = _ctx.renderFn) == null ? void 0 : _a2.call(_ctx, {
+                  row: _ctx.data,
+                  index: _ctx.index,
+                  rowKey: _ctx.rowKey,
+                  pagination: _ctx.pagination,
+                  column: _ctx.column
+                });
+              }
+            }, null, 8, ["render"])) : (openBlock(), createElementBlock(Fragment, { key: 2 }, [
+              _ctx.column.ellipsis && _ctx.displayCell ? (openBlock(), createBlock(_component_UTooltip, {
+                key: 0,
+                title: _ctx.displayCell.toString(),
+                disabled: !_ctx.isOverflow,
+                "mouse-enter-delay": 0.5
+              }, {
+                default: withCtx(() => [
+                  createElementVNode("span", { ref: "ellipsisSpanRef" }, toDisplayString(_ctx.displayCell), 513)
+                ]),
+                _: 1
+              }, 8, ["title", "disabled"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
+                createTextVNode(toDisplayString(_ctx.displayCell), 1)
+              ], 64))
+            ], 64))
+          ], 64))
+        ], 16)) : createCommentVNode("v-if", true)
+      ];
+    }),
+    _: 1
+  }, 8, ["onResize"]);
 }
-var TableCell = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Table/tableUnits/TableCell.vue"]]);
+var TableCell = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Table\\tableUnits\\TableCell.vue"]]);
 
 export { TableCell as default };
 //# sourceMappingURL=TableCell.mjs.map

package/es/components/Table/tableUnits/TableCell.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"TableCell.mjs","sources":["../../../../../src/components/Table/tableUnits/TableCell.vue"],"sourcesContent":["<template>\n  <td\n    v-if=\"showCell\"\n    ref=\"cellRef\"\n    v-bind=\"tdProps\"\n    :class=\"{\n      [`${prefixCls}-cell-custom`]: !!(tdProps as any)?.class,\n      [`${column.className}`]: !!column.className,\n      [`${prefixCls}-cell-ellipsis`]: !!column.ellipsis,\n      [`${prefixCls}-cell-break-word`]: !!column.width,\n      [`${tablePrefixCls}-column-has-actions`]: hasAction(column),\n      [`${tablePrefixCls}-column-has-sorters`]: hasSorters(column),\n      [`${tablePrefixCls}-column-has-filters`]: hasFilters(column),\n      [`${tablePrefixCls}-column-sort`]: isSortColumn(column)\n    }\"\n    :style=\"tdStyle\"\n  >\n    <USkeleton v-if=\"skeleton\" :class=\"`${prefixCls}-skeleton-wrap`\" active>\n      <template v-if=\"column.skeleton\">\n        <USkeletonItem\n          v-for=\"(_, ski) in Array(column.skeleton.length)\"\n          :key=\"ski\"\n          :type=\"column.skeleton[ski].type\"\n          :style=\"column.skeleton[ski].style\"\n        />\n      </template>\n      <USkeletonItem v-else type=\"text\" style=\"width: 50%\" />\n    </USkeleton>\n    <template v-else>\n      <template v-if=\"expandIcon\">\n        <span :class=\"`${prefixCls}-indent indent-level-${indent}`\" :style=\"{ paddingLeft: `${indentSize * indent}px` }\" />\n        <ExpandIcon\n          need-indent-spaced\n          :expandable=\"!!(data as any).children\"\n          :need-loading=\"(data as any).children === true\"\n          :row-key=\"rowKey\"\n          :expanded=\"isRowExpanded(rowKey, true)\"\n          @expand=\"handleExpand\"\n          @async-expand=\"handleAsyncExpand\"\n        />\n      </template>\n      <Render\n        v-if=\"isRender\"\n        :render=\"\n          () => {\n            return renderFn?.({\n              row: data,\n              index,\n              rowKey,\n              pagination,\n              column\n            });\n          }\n        \"\n      />\n      <template v-else>\n        <template v-if=\"column.ellipsis && displayCell\">\n          <UTooltip :title=\"displayCell.toString()\" :disabled=\"!isOverflow\" :mouse-enter-delay=\"0.5\">\n            <span ref=\"ellipsisSpanRef\">\n              {{ displayCell }}\n            </span>\n          </UTooltip>\n        </template>\n        <template v-else>\n          {{ displayCell }}\n        </template>\n      </template>\n    </template>\n  </td>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, watch, ref } from 'vue';\nimport type { PropType, CSSProperties } from 'vue';\nimport { get } from 'lodash-unified';\nimport UTooltip from '@uxd-ui/components/Tooltip';\nimport USkeleton from '@uxd-ui/components/Skeleton';\nimport Render from '../../base/Render';\nimport ExpandIcon from './ExpandIcon.vue';\nimport type { InnerColumn, TableContext } from '../Table.type';\nimport { getStyle } from '../../../utils';\nimport { getColumnKey } from '../utils';\n\nconst USkeletonItem = USkeleton.Item;\n\nexport default defineComponent({\n  name: 'TableCell',\n  components: {\n    Render,\n    ExpandIcon,\n    UTooltip,\n    USkeleton,\n    USkeletonItem\n  },\n  props: {\n    prefixCls: {\n      type: String\n    },\n    column: {\n      type: Object as PropType<InnerColumn>,\n      required: true\n    },\n    data: {\n      type: Object as PropType<Record<string, any>>,\n      required: true\n    },\n    rowKey: {\n      type: [String, Number],\n      required: true\n    },\n    index: {\n      type: Number,\n      required: true\n    },\n    indent: {\n      type: Number,\n      default: 20\n    },\n    expandIcon: {\n      type: Boolean,\n      default: false\n    },\n    skeleton: {\n      type: Boolean,\n      default: false\n    }\n  },\n  setup(props) {\n    const {\n      prefixCls: tablePrefixCls,\n      props: { indentSize },\n      expand: { handleExpandChange, isRowExpanded },\n      filterAndSorter: { hasAction, hasSorters, hasFilters, isSortColumn },\n      size: { sizesMap },\n      pagination\n    } = inject<TableContext>('tableContext', {} as TableContext);\n\n    const cellRef = ref();\n    const ellipsisSpanRef = ref();\n    const isOverflow = ref(false);\n\n    const renderFn = computed(() => {\n      const { render } = props.column;\n      return render || null;\n    });\n\n    const isRender = computed(() => {\n      return renderFn.value !== null;\n    });\n\n    const displayCell = computed(() => {\n      const { key, dataIndex } = props.column;\n      const record = props.data;\n      return get(record, dataIndex || key);\n    });\n\n    const tdProps = ref({});\n    const showCell = ref(true);\n\n    watch(\n      () => [props.column, props.data, props.index],\n      () => {\n        const { customCell } = props.column;\n        const attrs = {} as Record<string, any>;\n        // if (ellipsis && !render) {\n        //   attrs.title = displayCell.value;\n        // }\n        if (customCell) {\n          const { data, index } = props;\n          const _props = customCell(data, index);\n          const { colSpan, rowSpan } = _props;\n          showCell.value = colSpan !== 0 && rowSpan !== 0;\n          Object.keys(_props).forEach((key) => {\n            attrs[key] = _props[key];\n          });\n        }\n        tdProps.value = attrs;\n      },\n      { immediate: true }\n    );\n\n    const tdStyle = computed(() => {\n      const style = {} as CSSProperties;\n      const { align, left, right } = props.column;\n      if (align) {\n        style.textAlign = align;\n      }\n      if (left !== undefined) {\n        style.left = `${left}px`;\n      }\n      if (right !== undefined) {\n        style.right = `${right}px`;\n      }\n      return style;\n    });\n\n    const handleExpand = (e: any) => {\n      handleExpandChange({ row: props.data, rowKey: props.rowKey, tree: true }, e);\n    };\n\n    const handleAsyncExpand = (e: any, done: () => void) => {\n      handleExpandChange(\n        {\n          row: props.data,\n          rowKey: props.rowKey,\n          async: true,\n          tree: true,\n          done\n        },\n        e\n      );\n    };\n\n    watch(\n      () => sizesMap,\n      () => {\n        if (ellipsisSpanRef.value) {\n          const cell = cellRef.value;\n          const padding = (Number.parseInt(getStyle(cell, 'paddingLeft')) || 0) + (Number.parseInt(getStyle(cell, 'paddingRight')) || 0);\n          const span = ellipsisSpanRef.value;\n          const range = document.createRange();\n          range.setStart(span, 0);\n          range.setEnd(span, span.childNodes.length);\n          const rangeWidth = range.getBoundingClientRect().width;\n\n          const colKey = getColumnKey(props.column);\n          const cellWidth = sizesMap[colKey];\n          if (rangeWidth + padding > cellWidth) {\n            isOverflow.value = true;\n          }\n        }\n      },\n      { deep: true }\n    );\n\n    return {\n      tablePrefixCls,\n      isRender,\n      renderFn,\n      displayCell,\n      tdProps,\n      tdStyle,\n      indentSize,\n      handleExpand,\n      handleAsyncExpand,\n      isRowExpanded,\n      showCell,\n      hasAction,\n      hasSorters,\n      hasFilters,\n      isSortColumn,\n      pagination,\n      cellRef,\n      ellipsisSpanRef,\n      isOverflow\n    };\n  }\n});\n</script>\n"],"names":["_createElementBlock","_mergeProps","_createBlock","_normalizeClass","_Fragment","_normalizeStyle","_createElementVNode","_createVNode","_a"],"mappings":"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"}
+{"version":3,"file":"TableCell.mjs","sources":["../../../../../src/components/Table/tableUnits/TableCell.vue"],"sourcesContent":["<template>\n  <ResizeObserver @resize=\"debouncedHandleResize\">\n    <td\n      v-if=\"showCell\"\n      ref=\"cellRef\"\n      v-bind=\"tdProps\"\n      :class=\"{\n      [`${prefixCls}-cell-custom`]: !!(tdProps as any)?.class,\n      [`${column.className}`]: !!column.className,\n      [`${prefixCls}-cell-ellipsis`]: !!column.ellipsis,\n      [`${prefixCls}-cell-break-word`]: !!column.width,\n      [`${tablePrefixCls}-column-has-actions`]: hasAction(column),\n      [`${tablePrefixCls}-column-has-sorters`]: hasSorters(column),\n      [`${tablePrefixCls}-column-has-filters`]: hasFilters(column),\n      [`${tablePrefixCls}-column-sort`]: isSortColumn(column)\n    }\"\n      :style=\"tdStyle\"\n    >\n      <USkeleton v-if=\"skeleton\" :class=\"`${prefixCls}-skeleton-wrap`\" active>\n        <template v-if=\"column.skeleton\">\n          <USkeletonItem\n            v-for=\"(_, ski) in Array(column.skeleton.length)\"\n            :key=\"ski\"\n            :type=\"column.skeleton[ski].type\"\n            :style=\"column.skeleton[ski].style\"\n          />\n        </template>\n        <USkeletonItem v-else type=\"text\" style=\"width: 50%\" />\n      </USkeleton>\n      <template v-else>\n        <template v-if=\"expandIcon\">\n          <span :class=\"`${prefixCls}-indent indent-level-${indent}`\" :style=\"{ paddingLeft: `${indentSize * indent}px` }\" />\n          <ExpandIcon\n            need-indent-spaced\n            :expandable=\"!!(data as any).children\"\n            :need-loading=\"(data as any).children === true\"\n            :row-key=\"rowKey\"\n            :expanded=\"isRowExpanded(rowKey, true)\"\n            @expand=\"handleExpand\"\n            @async-expand=\"handleAsyncExpand\"\n          />\n        </template>\n        <Render\n          v-if=\"isRender\"\n          :render=\"\n            () => {\n              return renderFn?.({\n                row: data,\n                index,\n                rowKey,\n                pagination,\n                column\n              });\n            }\n          \"\n        />\n        <template v-else>\n          <template v-if=\"column.ellipsis && displayCell\">\n            <UTooltip :title=\"displayCell.toString()\" :disabled=\"!isOverflow\" :mouse-enter-delay=\"0.5\">\n              <span ref=\"ellipsisSpanRef\">\n                {{ displayCell }}\n              </span>\n            </UTooltip>\n          </template>\n          <template v-else>\n            {{ displayCell }}\n          </template>\n        </template>\n      </template>\n    </td>\n  </ResizeObserver>\n</template>\n\n<script lang=\"ts\">\nimport { defineComponent, inject, computed, watch, ref, nextTick } from 'vue';\nimport type { PropType, CSSProperties } from 'vue';\nimport { get } from 'lodash-unified';\nimport UTooltip from '@uxd-ui/components/Tooltip';\nimport USkeleton from '@uxd-ui/components/Skeleton';\nimport Render from '../../base/Render';\nimport ExpandIcon from './ExpandIcon.vue';\nimport type { InnerColumn, TableContext } from '../Table.type';\nimport { debounce, getStyle } from '../../../utils';\nimport ResizeObserver from '../../base/ResizeObserver';\n\nconst USkeletonItem = USkeleton.Item;\n\nexport default defineComponent({\n  name: 'TableCell',\n  components: {\n    Render,\n    ExpandIcon,\n    UTooltip,\n    USkeleton,\n    USkeletonItem,\n    ResizeObserver\n  },\n  props: {\n    prefixCls: {\n      type: String\n    },\n    column: {\n      type: Object as PropType<InnerColumn>,\n      required: true\n    },\n    data: {\n      type: Object as PropType<Record<string, any>>,\n      required: true\n    },\n    rowKey: {\n      type: [String, Number],\n      required: true\n    },\n    index: {\n      type: Number,\n      required: true\n    },\n    indent: {\n      type: Number,\n      default: 20\n    },\n    expandIcon: {\n      type: Boolean,\n      default: false\n    },\n    skeleton: {\n      type: Boolean,\n      default: false\n    }\n  },\n  setup(props) {\n    const {\n      prefixCls: tablePrefixCls,\n      props: { indentSize },\n      expand: { handleExpandChange, isRowExpanded },\n      filterAndSorter: { hasAction, hasSorters, hasFilters, isSortColumn },\n      // size: { sizesMap },\n      pagination\n    } = inject<TableContext>('tableContext', {} as TableContext);\n\n    const cellRef = ref();\n    const ellipsisSpanRef = ref();\n    const isOverflow = ref(false);\n    const isMinWidth = ref(false);\n\n    const renderFn = computed(() => {\n      const { render } = props.column;\n      return render || null;\n    });\n\n    const isRender = computed(() => {\n      return renderFn.value !== null;\n    });\n\n    const displayCell = computed(() => {\n      const { key, dataIndex } = props.column;\n      const record = props.data;\n      return get(record, dataIndex || key);\n    });\n\n    const tdProps = ref({});\n    const showCell = ref(true);\n\n    watch(\n      () => [props.column, props.data, props.index],\n      () => {\n        const { customCell } = props.column;\n        const attrs = {} as Record<string, any>;\n        // if (ellipsis && !render) {\n        //   attrs.title = displayCell.value;\n        // }\n        if (customCell) {\n          const { data, index } = props;\n          const _props = customCell(data, index);\n          const { colSpan, rowSpan } = _props;\n          showCell.value = colSpan !== 0 && rowSpan !== 0;\n          Object.keys(_props).forEach((key) => {\n            attrs[key] = _props[key];\n          });\n        }\n        tdProps.value = attrs;\n      },\n      { immediate: true }\n    );\n\n    const tdStyle = computed(() => {\n      const style = {} as CSSProperties;\n      const { align, left, right } = props.column;\n      if (align) {\n        style.textAlign = align;\n      }\n      if (left !== undefined) {\n        style.left = `${left}px`;\n      }\n      if (right !== undefined) {\n        style.right = `${right}px`;\n      }\n      if (isMinWidth.value) {\n        style.width = `${props.column.minWidth}px`;\n      }\n      return style;\n    });\n\n    const handleExpand = (e: any) => {\n      handleExpandChange({ row: props.data, rowKey: props.rowKey, tree: true }, e);\n    };\n\n    const handleAsyncExpand = (e: any, done: () => void) => {\n      handleExpandChange(\n        {\n          row: props.data,\n          rowKey: props.rowKey,\n          async: true,\n          tree: true,\n          done\n        },\n        e\n      );\n    };\n\n    const checkWidth = ({ target, width }: { target: HTMLElement; width: number }) => {\n      nextTick(() => {\n        if (ellipsisSpanRef.value) {\n          const cell = target;\n          const padding = (Number.parseInt(getStyle(cell, 'paddingLeft')) || 0) + (Number.parseInt(getStyle(cell, 'paddingRight')) || 0);\n          const span = ellipsisSpanRef.value;\n          const range = document.createRange();\n          range.setStart(span, 0);\n          range.setEnd(span, span.childNodes.length);\n          const rangeWidth = range.getBoundingClientRect().width;\n\n          // const cellWidth = Number(getStyle(cell, 'width'));\n          if (rangeWidth + padding > width) {\n            isOverflow.value = true;\n          } else {\n            isOverflow.value = false;\n          }\n        }\n      });\n    };\n\n    // onMounted(() => {\n    //   checkOverflow(cellRef.value);\n    // });\n\n    const debouncedHandleResize = debounce((args: any) => checkWidth(args), 100);\n\n    return {\n      tablePrefixCls,\n      isRender,\n      renderFn,\n      displayCell,\n      tdProps,\n      tdStyle,\n      indentSize,\n      handleExpand,\n      handleAsyncExpand,\n      isRowExpanded,\n      showCell,\n      hasAction,\n      hasSorters,\n      hasFilters,\n      isSortColumn,\n      pagination,\n      cellRef,\n      ellipsisSpanRef,\n      isOverflow,\n      debouncedHandleResize\n    };\n  }\n});\n</script>\n"],"names":["_createBlock","_createElementBlock","_mergeProps","_normalizeClass","_Fragment","_normalizeStyle","_createElementVNode","_createVNode","_a"],"mappings":"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"}

package/es/components/Table/tableUnits/TableCell.vue.d.ts

@@ -52,6 +52,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     cellRef: import("vue").Ref<any, any>;
     ellipsisSpanRef: import("vue").Ref<any, any>;
     isOverflow: import("vue").Ref<boolean, boolean>;
+    debouncedHandleResize: import("../../../utils").DebounceReturn;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     prefixCls: {
         type: StringConstructor;
@@ -86,8 +87,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
 }>> & Readonly<{}>, {
     expandIcon: boolean;
-    skeleton: boolean;
     indent: number;
+    skeleton: boolean;
 }, {}, {
     Render: {
         (props: import("../../base/Render").RenderProps): import("vue").VNodeChild | import("vue/jsx-runtime").JSX.Element;
@@ -108,7 +109,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         };
         expandIcon: {
             type: PropType<import("../../../utils").IconPropType>;
-            default: () => import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+            default: any;
         };
         needIndentSpaced: {
             type: BooleanConstructor;
@@ -134,7 +135,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         };
         expandIcon: {
             type: PropType<import("../../../utils").IconPropType>;
-            default: () => import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+            default: any;
         };
         needIndentSpaced: {
             type: BooleanConstructor;
@@ -149,7 +150,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         "onAsync-expand"?: (...args: any[]) => any;
     }>, {
         expanded: boolean;
-        expandIcon: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+        expandIcon: any;
         expandable: boolean;
         needIndentSpaced: boolean;
         needLoading: boolean;
@@ -1126,5 +1127,22 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     }, {}, {
         ImageIcon: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    ResizeObserver: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "resize"[], "resize", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        disabled: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+    }>> & Readonly<{
+        onResize?: (...args: any[]) => any;
+    }>, {
+        disabled: boolean;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/Table/tableUnits/TableHeader.mjs

@@ -65,7 +65,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 2);
 }
-var TableHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Table/tableUnits/TableHeader.vue"]]);
+var TableHeader = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Table\\tableUnits\\TableHeader.vue"]]);
 
 export { TableHeader as default };
 //# sourceMappingURL=TableHeader.mjs.map

package/es/components/Table/tableUnits/TableHeaderRow.mjs

@@ -316,7 +316,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 4);
 }
-var TableHeaderRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Table/tableUnits/TableHeaderRow.vue"]]);
+var TableHeaderRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Table\\tableUnits\\TableHeaderRow.vue"]]);
 
 export { TableHeaderRow as default };
 //# sourceMappingURL=TableHeaderRow.mjs.map

package/es/components/Table/tableUnits/TableRow.mjs

@@ -159,7 +159,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 46, _hoisted_1);
 }
-var TableRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Table/tableUnits/TableRow.vue"]]);
+var TableRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Table\\tableUnits\\TableRow.vue"]]);
 
 export { TableRow as default };
 //# sourceMappingURL=TableRow.mjs.map

package/es/components/Table/tableUnits/TableRow.vue.d.ts

@@ -94,8 +94,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     };
 }>> & Readonly<{}>, {
     columns: TableColumn[];
-    skeleton: boolean;
     indent: number;
+    skeleton: boolean;
     expendedRow: boolean;
     childRow: boolean;
 }, {}, {
@@ -151,6 +151,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         cellRef: import("vue").Ref<any, any>;
         ellipsisSpanRef: import("vue").Ref<any, any>;
         isOverflow: import("vue").Ref<boolean, boolean>;
+        debouncedHandleResize: import("../../../utils").DebounceReturn;
     }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
         prefixCls: {
             type: StringConstructor;
@@ -185,8 +186,8 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         };
     }>> & Readonly<{}>, {
         expandIcon: boolean;
-        skeleton: boolean;
         indent: number;
+        skeleton: boolean;
     }, {}, {
         Render: {
             (props: import("../../base/Render").RenderProps): import("vue").VNodeChild | import("vue/jsx-runtime").JSX.Element;
@@ -207,7 +208,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             };
             expandIcon: {
                 type: PropType<import("../../..").IconPropType>;
-                default: () => import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+                default: any;
             };
             needIndentSpaced: {
                 type: BooleanConstructor;
@@ -233,7 +234,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             };
             expandIcon: {
                 type: PropType<import("../../..").IconPropType>;
-                default: () => import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+                default: any;
             };
             needIndentSpaced: {
                 type: BooleanConstructor;
@@ -248,7 +249,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             "onAsync-expand"?: (...args: any[]) => any;
         }>, {
             expanded: boolean;
-            expandIcon: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
+            expandIcon: any;
             expandable: boolean;
             needIndentSpaced: boolean;
             needLoading: boolean;
@@ -1225,6 +1226,23 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         }, {}, {
             ImageIcon: import("vue").FunctionalComponent<import("lucide-vue-next").LucideProps, {}, any, {}>;
         }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+        ResizeObserver: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+            [key: string]: any;
+        }>, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "resize"[], "resize", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+            disabled: {
+                type: BooleanConstructor;
+                default: boolean;
+            };
+        }>> & Readonly<{
+            onResize?: (...args: any[]) => any;
+        }>, {
+            disabled: boolean;
+        }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
     }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 }, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;

package/es/components/Table/tableUnits/TableSummaryRow.mjs

@@ -116,7 +116,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }), 128))
   ], 46, _hoisted_1);
 }
-var TableSummaryRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Table/tableUnits/TableSummaryRow.vue"]]);
+var TableSummaryRow = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Table\\tableUnits\\TableSummaryRow.vue"]]);
 
 export { TableSummaryRow as default };
 //# sourceMappingURL=TableSummaryRow.mjs.map

package/es/components/Tabs/TabBar.mjs

@@ -103,7 +103,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     style: normalizeStyle(_ctx.barStyle)
   }, null, 6);
 }
-var TabBar = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Tabs/TabBar.vue"]]);
+var TabBar = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Tabs\\TabBar.vue"]]);
 
 export { TabBar as default };
 //# sourceMappingURL=TabBar.mjs.map

package/es/components/Tabs/TabNav.mjs

@@ -498,7 +498,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 34)
   ], 34);
 }
-var TabNav = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Tabs/TabNav.vue"]]);
+var TabNav = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Tabs\\TabNav.vue"]]);
 
 export { TabNav as default };
 //# sourceMappingURL=TabNav.mjs.map

package/es/components/Tabs/TabPane.mjs

@@ -69,7 +69,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     [vShow, _ctx.active]
   ]);
 }
-var TabPane = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Tabs/TabPane.vue"]]);
+var TabPane = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Tabs\\TabPane.vue"]]);
 
 export { TabPane as default };
 //# sourceMappingURL=TabPane.mjs.map

package/es/components/Tag/Tag.mjs

@@ -162,7 +162,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     [vShow, _ctx.visible && _ctx.hasSlot]
   ]);
 }
-var Tag = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/Tag/Tag.vue"]]);
+var Tag = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\Tag\\Tag.vue"]]);
 
 export { Tag as default };
 //# sourceMappingURL=Tag.mjs.map

package/es/components/ThemePanel/ThemePanel.mjs

@@ -243,7 +243,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 3
   }, 8, ["theme-color", "appearance", "radius", "direction"]);
 }
-var ThemePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/ThemePanel/ThemePanel.vue"]]);
+var ThemePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\ThemePanel\\ThemePanel.vue"]]);
 
 export { ThemePanel as default };
 //# sourceMappingURL=ThemePanel.mjs.map

package/es/components/TimePicker/Panel/SelectList.mjs

@@ -102,7 +102,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["class", "onMouseenter"]);
 }
-var SelectList = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/TimePicker/Panel/SelectList.vue"]]);
+var SelectList = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\TimePicker\\Panel\\SelectList.vue"]]);
 
 export { SelectList as default };
 //# sourceMappingURL=SelectList.mjs.map

package/es/components/TimePicker/Panel/TimePanel.mjs

@@ -260,7 +260,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     }, null, 8, ["prefix-cls", "options", "selected", "onSelect"])) : createCommentVNode("v-if", true)
   ], 2);
 }
-var TimePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/TimePicker/Panel/TimePanel.vue"]]);
+var TimePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\TimePicker\\Panel\\TimePanel.vue"]]);
 
 export { TimePanel as default };
 //# sourceMappingURL=TimePanel.mjs.map

package/es/components/TimePicker/Panel/TimeRangePane.mjs

@@ -200,7 +200,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     ], 2)
   ], 64);
 }
-var TimeRangePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/TimePicker/Panel/TimeRangePane.vue"]]);
+var TimeRangePanel = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\TimePicker\\Panel\\TimeRangePane.vue"]]);
 
 export { TimeRangePanel as default };
 //# sourceMappingURL=TimeRangePane.mjs.map

package/es/components/TimePicker/TimePicker.mjs

@@ -336,7 +336,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     _: 1
   }, 8, ["visible", "prefix-cls", "placement", "get-popup-container", "destroy-on-close", "modifiers", "click-outside"]);
 }
-var TimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/TimePicker/TimePicker.vue"]]);
+var TimePicker = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\TimePicker\\TimePicker.vue"]]);
 
 export { TimePicker as default };
 //# sourceMappingURL=TimePicker.mjs.map

package/es/components/TimePicker/Trigger/TimePickerInput.mjs

@@ -163,7 +163,7 @@ function _sfc_render(_ctx, _cache, $props, $setup, $data, $options) {
     onBlur: _cache[3] || (_cache[3] = (...args) => _ctx.onInputBlur && _ctx.onInputBlur(...args))
   }, null, 42, _hoisted_1);
 }
-var TimePickerInput = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "/Users/admin/Documents/uxd/uxd-ui/src/components/TimePicker/Trigger/TimePickerInput.vue"]]);
+var TimePickerInput = /* @__PURE__ */ _export_sfc(_sfc_main, [["render", _sfc_render], ["__file", "D:\\project\\UXD-FE\\uxd-ui\\src\\components\\TimePicker\\Trigger\\TimePickerInput.vue"]]);
 
 export { TimePickerInput as default };
 //# sourceMappingURL=TimePickerInput.mjs.map