@koi-design/uxd-ui 14.0.44 → 14.0.46

package/uxd-ui.esm.mjs

@@ -1,4 +1,4 @@
-/*! @koi-design/uxd-ui@14.0.43 */
+/*! @koi-design/uxd-ui@14.0.46 */
 
 import { defineComponent, reactive, watch, provide, inject, computed, onMounted, ref, onBeforeUnmount, openBlock, createElementBlock, createElementVNode, normalizeClass, normalizeStyle, renderSlot, withDirectives, vShow, createBlock, resolveDynamicComponent, createCommentVNode, toRaw, resolveComponent, Transition, withCtx, createVNode, toDisplayString, isVNode, Comment as Comment$1, Fragment, Text as Text$1, h, shallowRef, toRef, nextTick, onUpdated, onUnmounted, cloneVNode, Teleport, toRefs, withModifiers, mergeProps, renderList, onBeforeUpdate, createTextVNode, createStaticVNode, normalizeProps, guardReactiveProps, watchEffect, onActivated, onDeactivated, withKeys, TransitionGroup, createApp, onBeforeMount, unref } from 'vue';
 import { X, Terminal, CircleAlert, Info, CircleCheck, LoaderCircle, CircleX, Search, Eye, EyeOff, Check, CornerDownLeft, ChevronUp, ChevronDown, ChevronRight, MenuIcon, Minus, ChevronLeft, CheckIcon, ChevronsLeft, ChevronsRight, Calendar as Calendar$1, ZoomIn, ZoomOut, RotateCcw, RotateCw, PanelLeft, PanelRight, Image as Image$2, CheckCircle, XCircle, Star as Star$1, XIcon, FilterIcon, GripVertical, Plus, Clock, FileIcon, HelpCircle, CircleHelp, AlertCircle, SearchIcon } from 'lucide-vue-next';
@@ -33217,7 +33217,7 @@ const _sfc_main$G = defineComponent({
   setup(props) {
     const {
       prefixCls: tablePrefixCls,
-      props: { indentSize },
+      props: { indentSize, cellEmptyText },
       expand: { handleExpandChange, isRowExpanded },
       filterAndSorter: { hasAction, hasSorters, hasFilters, isSortColumn },
       size: { syncColumnWidth },
@@ -33332,7 +33332,8 @@ const _sfc_main$G = defineComponent({
       cellRef,
       ellipsisSpanRef,
       isOverflow,
-      checkWidth
+      checkWidth,
+      cellEmptyText
     };
   }
 });
@@ -33422,7 +33423,7 @@ function _sfc_render$E(_ctx, _cache, $props, $setup, $data, $options) {
                 ]),
                 _: 1
               }, 8, ["title", "disabled"])) : (openBlock(), createElementBlock(Fragment, { key: 1 }, [
-                createTextVNode(toDisplayString(_ctx.displayCell), 1)
+                createTextVNode(toDisplayString(_ctx.displayCell || _ctx.cellEmptyText), 1)
               ], 64))
             ], 64))
           ], 64))
@@ -34961,9 +34962,22 @@ const _sfc_main$v = defineComponent({
     const handleDragStart = (e) => {
       emit("dragStart", e);
     };
+    const handleTouchStart = (e) => {
+      e.preventDefault();
+      const touch = e.touches[0];
+      const syntheticEvent = {
+        ...e,
+        clientY: touch.clientY,
+        clientX: touch.clientX,
+        preventDefault: () => e.preventDefault(),
+        stopPropagation: () => e.stopPropagation()
+      };
+      emit("dragStart", syntheticEvent);
+    };
     return {
       prefixCls,
-      handleDragStart
+      handleDragStart,
+      handleTouchStart
     };
   }
 });
@@ -34972,13 +34986,14 @@ function _sfc_render$t(_ctx, _cache, $props, $setup, $data, $options) {
   const _component_UIcon = resolveComponent("UIcon");
   return openBlock(), createBlock(_component_UIcon, {
     class: normalizeClass([`${_ctx.prefixCls}-draggable-icon`]),
-    onMousedown: _ctx.handleDragStart
+    onMousedown: _ctx.handleDragStart,
+    onTouchstart: _ctx.handleTouchStart
   }, {
     default: withCtx(() => [
       createVNode(_component_GripVertical)
     ]),
     _: 1
-  }, 8, ["class", "onMousedown"]);
+  }, 8, ["class", "onMousedown", "onTouchstart"]);
 }
 var DraggableIcon = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render$t], ["__file", "DraggableIcon.vue"]]);
 
@@ -35022,12 +35037,22 @@ function useDraggable(props, tableRefs) {
   }, {
     flush: "post"
   });
+  const getClientY = (event) => {
+    if ("touches" in event && event.touches.length > 0) {
+      return event.touches[0].clientY;
+    }
+    if ("clientY" in event) {
+      return event.clientY;
+    }
+    return 0;
+  };
   const setRowRefsTranslate = (event) => {
     const currentRowData = rowDataMap.value[sourceRowKey];
     const {
       height: currentHeight
     } = currentRowData.rowRef[0].value.getBoundingClientRect();
-    const realClientY = event.clientY + tableRefs.bodyTable.wrapRef.scrollTop;
+    const clientY = getClientY(event);
+    const realClientY = clientY + tableRefs.bodyTable.wrapRef.scrollTop;
     const safeTranslateY = Math.max(relativeMinY, Math.min(realClientY - dragStartPosition, relativeMaxY));
     currentRowData.rowRef.forEach((currentItem) => {
       currentItem.value.style.transform = `translateY(${safeTranslateY}px)`;
@@ -35043,7 +35068,7 @@ function useDraggable(props, tableRefs) {
           height,
           top
         } = rowData.rowRef[0].value.getBoundingClientRect();
-        const position = top + Number((height / 2).toFixed(2)) < event.clientY ? 1 : -1;
+        const position = top + Number((height / 2).toFixed(2)) < clientY ? 1 : -1;
         if (!(sort + position)) {
           let translateY = currentHeight;
           let index = Math.min(targetIndex, rowData.index);
@@ -35076,10 +35101,11 @@ function useDraggable(props, tableRefs) {
     }
   };
   const handleBodyScrollY = (event) => {
-    if (bodyTop + bodyHeight > event.clientY && event.clientY > bodyTop) {
+    const clientY = getClientY(event);
+    if (bodyTop + bodyHeight > clientY && clientY > bodyTop) {
       clearBodyScrollY();
     } else if (!scrollTimer) {
-      const px = event.clientY < bodyTop ? -3 : 3;
+      const px = clientY < bodyTop ? -3 : 3;
       scrollTimer = setInterval(() => {
         tableRefs.bodyTable.setScrollTop(Math.max(0, Math.min(tableRefs.bodyTable.wrapRef.scrollTop + px, tableHeight - bodyHeight)));
         setRowRefsTranslate(event);
@@ -35092,6 +35118,13 @@ function useDraggable(props, tableRefs) {
       setRowRefsTranslate(event);
     }
   };
+  const handleTouchmove = (event) => {
+    event.preventDefault();
+    handleBodyScrollY(event);
+    if (!scrollTimer) {
+      setRowRefsTranslate(event);
+    }
+  };
   const disableWheel = (e) => {
     e.preventDefault();
   };
@@ -35118,11 +35151,15 @@ function useDraggable(props, tableRefs) {
     window.removeEventListener("mousemove", handleMousemove);
     window.removeEventListener("mouseup", clearDrag);
     window.removeEventListener("mousewheel", disableWheel);
+    window.removeEventListener("touchmove", handleTouchmove);
+    window.removeEventListener("touchend", clearDrag);
+    window.removeEventListener("touchcancel", clearDrag);
   };
   const handleDragStart = (event, param) => {
     const bodyTable = tableRefs.bodyTable.wrapRef;
     sourceRowKey = param.rowKey.toString();
-    dragStartPosition = event.clientY + bodyTable.scrollTop;
+    const clientY = getClientY(event);
+    dragStartPosition = clientY + bodyTable.scrollTop;
     const sortRowData = Object.values(rowDataMap.value).sort((a, b) => a.index - b.index);
     const {
       top
@@ -35139,12 +35176,21 @@ function useDraggable(props, tableRefs) {
     bodyTop = bodyTopInner;
     bodyHeight = bodyHeightInner;
     tableHeight = tableHeightInner;
-    handleMousemove(event);
+    if ("touches" in event) {
+      handleTouchmove(event);
+    } else {
+      handleMousemove(event);
+    }
     window.addEventListener("mousemove", handleMousemove);
     window.addEventListener("mouseup", clearDrag);
     window.addEventListener("mousewheel", disableWheel, {
       passive: false
     });
+    window.addEventListener("touchmove", handleTouchmove, {
+      passive: false
+    });
+    window.addEventListener("touchend", clearDrag);
+    window.addEventListener("touchcancel", clearDrag);
     event.preventDefault();
   };
   const draggableColumn = computed(() => {
@@ -35519,6 +35565,10 @@ const tableProps = {
   skeletonRows: {
     type: Number,
     default: 3
+  },
+  cellEmptyText: {
+    type: String,
+    default: ""
   }
 };
 const rowEmitFn = (data, index, e) => typeof data === "object" && typeof index === "number" && e instanceof Event;
@@ -35688,7 +35738,20 @@ const _sfc_main$u = defineComponent({
     const handleColumnResize = (columnWidth, changeWidth, column, event) => {
       emit("column-resize", columnWidth, changeWidth, column, event);
     };
-    const { showHeader, maxHeight, expandIcon, rowClassName, indentSize, showSummary, disabledHover, expandIndent, headerSticky, loading, width } = toRefs(props);
+    const {
+      showHeader,
+      maxHeight,
+      expandIcon,
+      rowClassName,
+      indentSize,
+      showSummary,
+      disabledHover,
+      expandIndent,
+      headerSticky,
+      loading,
+      width,
+      cellEmptyText
+    } = toRefs(props);
     provide("tableContext", {
       prefixCls,
       locale,
@@ -35703,6 +35766,7 @@ const _sfc_main$u = defineComponent({
         rowClassName,
         indentSize,
         emptyText,
+        cellEmptyText,
         showSummary,
         disabledHover,
         expandIndent,

package/uxd-ui.umd.js

@@ -1,4 +1,4 @@
-/*! @koi-design/uxd-ui@14.0.43 */
+/*! @koi-design/uxd-ui@14.0.46 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue'), require('lucide-vue-next')) :
@@ -33220,7 +33220,7 @@
     setup(props) {
       const {
         prefixCls: tablePrefixCls,
-        props: { indentSize },
+        props: { indentSize, cellEmptyText },
         expand: { handleExpandChange, isRowExpanded },
         filterAndSorter: { hasAction, hasSorters, hasFilters, isSortColumn },
         size: { syncColumnWidth },
@@ -33335,7 +33335,8 @@
         cellRef,
         ellipsisSpanRef,
         isOverflow,
-        checkWidth
+        checkWidth,
+        cellEmptyText
       };
     }
   });
@@ -33425,7 +33426,7 @@
                   ]),
                   _: 1
                 }, 8, ["title", "disabled"])) : (vue.openBlock(), vue.createElementBlock(vue.Fragment, { key: 1 }, [
-                  vue.createTextVNode(vue.toDisplayString(_ctx.displayCell), 1)
+                  vue.createTextVNode(vue.toDisplayString(_ctx.displayCell || _ctx.cellEmptyText), 1)
                 ], 64))
               ], 64))
             ], 64))
@@ -34964,9 +34965,22 @@
       const handleDragStart = (e) => {
         emit("dragStart", e);
       };
+      const handleTouchStart = (e) => {
+        e.preventDefault();
+        const touch = e.touches[0];
+        const syntheticEvent = {
+          ...e,
+          clientY: touch.clientY,
+          clientX: touch.clientX,
+          preventDefault: () => e.preventDefault(),
+          stopPropagation: () => e.stopPropagation()
+        };
+        emit("dragStart", syntheticEvent);
+      };
       return {
         prefixCls,
-        handleDragStart
+        handleDragStart,
+        handleTouchStart
       };
     }
   });
@@ -34975,13 +34989,14 @@
     const _component_UIcon = vue.resolveComponent("UIcon");
     return vue.openBlock(), vue.createBlock(_component_UIcon, {
       class: vue.normalizeClass([`${_ctx.prefixCls}-draggable-icon`]),
-      onMousedown: _ctx.handleDragStart
+      onMousedown: _ctx.handleDragStart,
+      onTouchstart: _ctx.handleTouchStart
     }, {
       default: vue.withCtx(() => [
         vue.createVNode(_component_GripVertical)
       ]),
       _: 1
-    }, 8, ["class", "onMousedown"]);
+    }, 8, ["class", "onMousedown", "onTouchstart"]);
   }
   var DraggableIcon = /* @__PURE__ */ _export_sfc(_sfc_main$v, [["render", _sfc_render$t], ["__file", "DraggableIcon.vue"]]);
 
@@ -35025,12 +35040,22 @@
     }, {
       flush: "post"
     });
+    const getClientY = (event) => {
+      if ("touches" in event && event.touches.length > 0) {
+        return event.touches[0].clientY;
+      }
+      if ("clientY" in event) {
+        return event.clientY;
+      }
+      return 0;
+    };
     const setRowRefsTranslate = (event) => {
       const currentRowData = rowDataMap.value[sourceRowKey];
       const {
         height: currentHeight
       } = currentRowData.rowRef[0].value.getBoundingClientRect();
-      const realClientY = event.clientY + tableRefs.bodyTable.wrapRef.scrollTop;
+      const clientY = getClientY(event);
+      const realClientY = clientY + tableRefs.bodyTable.wrapRef.scrollTop;
       const safeTranslateY = Math.max(relativeMinY, Math.min(realClientY - dragStartPosition, relativeMaxY));
       currentRowData.rowRef.forEach((currentItem) => {
         currentItem.value.style.transform = `translateY(${safeTranslateY}px)`;
@@ -35046,7 +35071,7 @@
             height,
             top
           } = rowData.rowRef[0].value.getBoundingClientRect();
-          const position = top + Number((height / 2).toFixed(2)) < event.clientY ? 1 : -1;
+          const position = top + Number((height / 2).toFixed(2)) < clientY ? 1 : -1;
           if (!(sort + position)) {
             let translateY = currentHeight;
             let index = Math.min(targetIndex, rowData.index);
@@ -35079,10 +35104,11 @@
       }
     };
     const handleBodyScrollY = (event) => {
-      if (bodyTop + bodyHeight > event.clientY && event.clientY > bodyTop) {
+      const clientY = getClientY(event);
+      if (bodyTop + bodyHeight > clientY && clientY > bodyTop) {
         clearBodyScrollY();
       } else if (!scrollTimer) {
-        const px = event.clientY < bodyTop ? -3 : 3;
+        const px = clientY < bodyTop ? -3 : 3;
         scrollTimer = setInterval(() => {
           tableRefs.bodyTable.setScrollTop(Math.max(0, Math.min(tableRefs.bodyTable.wrapRef.scrollTop + px, tableHeight - bodyHeight)));
           setRowRefsTranslate(event);
@@ -35095,6 +35121,13 @@
         setRowRefsTranslate(event);
       }
     };
+    const handleTouchmove = (event) => {
+      event.preventDefault();
+      handleBodyScrollY(event);
+      if (!scrollTimer) {
+        setRowRefsTranslate(event);
+      }
+    };
     const disableWheel = (e) => {
       e.preventDefault();
     };
@@ -35121,11 +35154,15 @@
       window.removeEventListener("mousemove", handleMousemove);
       window.removeEventListener("mouseup", clearDrag);
       window.removeEventListener("mousewheel", disableWheel);
+      window.removeEventListener("touchmove", handleTouchmove);
+      window.removeEventListener("touchend", clearDrag);
+      window.removeEventListener("touchcancel", clearDrag);
     };
     const handleDragStart = (event, param) => {
       const bodyTable = tableRefs.bodyTable.wrapRef;
       sourceRowKey = param.rowKey.toString();
-      dragStartPosition = event.clientY + bodyTable.scrollTop;
+      const clientY = getClientY(event);
+      dragStartPosition = clientY + bodyTable.scrollTop;
       const sortRowData = Object.values(rowDataMap.value).sort((a, b) => a.index - b.index);
       const {
         top
@@ -35142,12 +35179,21 @@
       bodyTop = bodyTopInner;
       bodyHeight = bodyHeightInner;
       tableHeight = tableHeightInner;
-      handleMousemove(event);
+      if ("touches" in event) {
+        handleTouchmove(event);
+      } else {
+        handleMousemove(event);
+      }
       window.addEventListener("mousemove", handleMousemove);
       window.addEventListener("mouseup", clearDrag);
       window.addEventListener("mousewheel", disableWheel, {
         passive: false
       });
+      window.addEventListener("touchmove", handleTouchmove, {
+        passive: false
+      });
+      window.addEventListener("touchend", clearDrag);
+      window.addEventListener("touchcancel", clearDrag);
       event.preventDefault();
     };
     const draggableColumn = vue.computed(() => {
@@ -35522,6 +35568,10 @@
     skeletonRows: {
       type: Number,
       default: 3
+    },
+    cellEmptyText: {
+      type: String,
+      default: ""
     }
   };
   const rowEmitFn = (data, index, e) => typeof data === "object" && typeof index === "number" && e instanceof Event;
@@ -35691,7 +35741,20 @@
       const handleColumnResize = (columnWidth, changeWidth, column, event) => {
         emit("column-resize", columnWidth, changeWidth, column, event);
       };
-      const { showHeader, maxHeight, expandIcon, rowClassName, indentSize, showSummary, disabledHover, expandIndent, headerSticky, loading, width } = vue.toRefs(props);
+      const {
+        showHeader,
+        maxHeight,
+        expandIcon,
+        rowClassName,
+        indentSize,
+        showSummary,
+        disabledHover,
+        expandIndent,
+        headerSticky,
+        loading,
+        width,
+        cellEmptyText
+      } = vue.toRefs(props);
       vue.provide("tableContext", {
         prefixCls,
         locale,
@@ -35706,6 +35769,7 @@
           rowClassName,
           indentSize,
           emptyText,
+          cellEmptyText,
           showSummary,
           disabledHover,
           expandIndent,