@uzum-tech/ui 2.0.5 → 2.0.6

package/es/_internal/icons/DragHandleRound.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import("vue").DefineComponent<{}, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<{}> & Readonly<{}>, {}, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+export default _default;

package/es/_internal/icons/DragHandleRound.mjs

@@ -0,0 +1,16 @@
+import { defineComponent, h } from 'vue';
+export default defineComponent({
+  name: 'DragHandleRound',
+  render() {
+    return h("svg", {
+      width: "24",
+      height: "24",
+      viewBox: "0 0 24 24",
+      fill: "none",
+      xmlns: "http://www.w3.org/2000/svg"
+    }, h("path", {
+      d: "M9 20C8.45 20 7.97917 19.8042 7.5875 19.4125C7.19583 19.0208 7 18.55 7 18C7 17.45 7.19583 16.9792 7.5875 16.5875C7.97917 16.1958 8.45 16 9 16C9.55 16 10.0208 16.1958 10.4125 16.5875C10.8042 16.9792 11 17.45 11 18C11 18.55 10.8042 19.0208 10.4125 19.4125C10.0208 19.8042 9.55 20 9 20ZM15 20C14.45 20 13.9792 19.8042 13.5875 19.4125C13.1958 19.0208 13 18.55 13 18C13 17.45 13.1958 16.9792 13.5875 16.5875C13.9792 16.1958 14.45 16 15 16C15.55 16 16.0208 16.1958 16.4125 16.5875C16.8042 16.9792 17 17.45 17 18C17 18.55 16.8042 19.0208 16.4125 19.4125C16.0208 19.8042 15.55 20 15 20ZM9 14C8.45 14 7.97917 13.8042 7.5875 13.4125C7.19583 13.0208 7 12.55 7 12C7 11.45 7.19583 10.9792 7.5875 10.5875C7.97917 10.1958 8.45 10 9 10C9.55 10 10.0208 10.1958 10.4125 10.5875C10.8042 10.9792 11 11.45 11 12C11 12.55 10.8042 13.0208 10.4125 13.4125C10.0208 13.8042 9.55 14 9 14ZM15 14C14.45 14 13.9792 13.8042 13.5875 13.4125C13.1958 13.0208 13 12.55 13 12C13 11.45 13.1958 10.9792 13.5875 10.5875C13.9792 10.1958 14.45 10 15 10C15.55 10 16.0208 10.1958 16.4125 10.5875C16.8042 10.9792 17 11.45 17 12C17 12.55 16.8042 13.0208 16.4125 13.4125C16.0208 13.8042 15.55 14 15 14ZM9 8C8.45 8 7.97917 7.80417 7.5875 7.4125C7.19583 7.02083 7 6.55 7 6C7 5.45 7.19583 4.97917 7.5875 4.5875C7.97917 4.19583 8.45 4 9 4C9.55 4 10.0208 4.19583 10.4125 4.5875C10.8042 4.97917 11 5.45 11 6C11 6.55 10.8042 7.02083 10.4125 7.4125C10.0208 7.80417 9.55 8 9 8ZM15 8C14.45 8 13.9792 7.80417 13.5875 7.4125C13.1958 7.02083 13 6.55 13 6C13 5.45 13.1958 4.97917 13.5875 4.5875C13.9792 4.19583 14.45 4 15 4C15.55 4 16.0208 4.19583 16.4125 4.5875C16.8042 4.97917 17 5.45 17 6C17 6.55 16.8042 7.02083 16.4125 7.4125C16.0208 7.80417 15.55 8 15 8Z",
+      fill: "currentColor"
+    }));
+  }
+});

package/es/_internal/icons/index.d.ts

@@ -22,6 +22,7 @@ export { default as ContentCopy } from './ContentCopy';
 export { default as DateIcon } from './Date';
 export { default as DismissCircleIcon } from './DismissCircle';
 export { default as DownloadIcon } from './Download';
+export { default as DragHandleRound } from './DragHandleRound';
 export { default as EditIcon } from './Edit';
 export { default as EmptyIcon } from './Empty';
 export { default as ErrorIcon } from './Error';

package/es/_internal/icons/index.mjs

@@ -22,6 +22,7 @@ export { default as ContentCopy } from "./ContentCopy.mjs";
 export { default as DateIcon } from "./Date.mjs";
 export { default as DismissCircleIcon } from "./DismissCircle.mjs";
 export { default as DownloadIcon } from "./Download.mjs";
+export { default as DragHandleRound } from "./DragHandleRound.mjs";
 export { default as EditIcon } from "./Edit.mjs";
 export { default as EmptyIcon } from "./Empty.mjs";
 export { default as ErrorIcon } from "./Error.mjs";

package/es/components.d.ts

@@ -34658,6 +34658,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -35613,6 +35616,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -36568,6 +36574,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -37550,6 +37559,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -38939,6 +38951,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         '--u-th-button-color-hover': string;
         '--u-th-icon-color': string;
         '--u-th-icon-color-active': string;
+        '--u-drop-mark-color': string;
+        '--u-drag-ghost-opacity': string;
+        '--u-drag-ghost-filter': string;
         '--u-filter-size': string;
         '--u-pagination-margin': string;
         '--u-empty-padding': string;
@@ -39123,6 +39138,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -40078,6 +40096,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -41033,6 +41054,9 @@ export declare const UDataTable: import("vue").DefineComponent<import("vue").Ext
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -77057,6 +77081,10 @@ export { mappingCardDark, mappingCardLight, renderConfig } from './mapping-card'
 export declare const UMappingCard: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     title: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["title"]>;
     description: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["description"]>;
+    subTitle: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["subTitle"]>;
+    subDescription: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["subDescription"]>;
+    headerInfo: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["headerInfo"]>;
+    headerSubInfo: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["headerSubInfo"]>;
     rows: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["rows"]>;
     cols: {
         readonly type: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["cols"]>;
@@ -78111,6 +78139,10 @@ export declare const UMappingCard: import("vue").DefineComponent<import("vue").E
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     title: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["title"]>;
     description: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["description"]>;
+    subTitle: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["subTitle"]>;
+    subDescription: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["subDescription"]>;
+    headerInfo: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["headerInfo"]>;
+    headerSubInfo: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["headerSubInfo"]>;
     rows: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["rows"]>;
     cols: {
         readonly type: import("vue").PropType<import("./mapping-card/src/interface").MappingCardInterface["cols"]>;

package/es/data-table/src/DataTable.d.ts

@@ -166,6 +166,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -1121,6 +1124,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -2076,6 +2082,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -3058,6 +3067,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -4447,6 +4459,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         '--u-th-button-color-hover': string;
         '--u-th-icon-color': string;
         '--u-th-icon-color-active': string;
+        '--u-drop-mark-color': string;
+        '--u-drag-ghost-opacity': string;
+        '--u-drag-ghost-filter': string;
         '--u-filter-size': string;
         '--u-pagination-margin': string;
         '--u-empty-padding': string;
@@ -4631,6 +4646,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -5586,6 +5604,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;
@@ -6541,6 +6562,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         thButtonColorHover: string;
         thIconColor: string;
         thIconColorActive: string;
+        dropMarkColor: string;
+        dragGhostOpacity: string;
+        dragGhostFilter: string;
         borderColorModal: string;
         tdColorHoverModal: string;
         tdColorStripedModal: string;

package/es/data-table/src/DataTable.mjs

@@ -11,6 +11,7 @@ import { useCheck } from "./use-check.mjs";
 import { useExpand } from "./use-expand.mjs";
 import { useGroupHeader } from "./use-group-header.mjs";
 import { useResizable } from "./use-resizable.mjs";
+import { useRowDrag } from "./use-row-drag.mjs";
 import { useScroll } from "./use-scroll.mjs";
 import { useTableData } from "./use-table-data.mjs";
 import { loadTableState, restoreSortStateFromStored, saveTableState } from "./use-table-storage.mjs";
@@ -140,6 +141,21 @@ export default defineComponent({
       expandableRef,
       doUpdateExpandedRowKeys
     } = useExpand(props, treeMateRef);
+    const {
+      draggableColumnRef,
+      draggingRowKeySetRef,
+      droppingRowKeyRef,
+      droppingPositionRef,
+      handleRowDragStart,
+      handleRowDragOver,
+      handleRowDragLeave,
+      handleRowDragEnd,
+      handleRowDrop
+    } = useRowDrag(props, {
+      paginatedDataRef,
+      mergedCheckedRowKeySetRef,
+      mergedClsPrefixRef
+    });
     const {
       handleTableBodyScroll,
       handleTableHeaderScroll,
@@ -556,6 +572,15 @@ export default defineComponent({
           '--u-action-divider-color': actionDividerColor
         };
       }),
+      draggableColumnRef,
+      draggingRowKeySetRef,
+      droppingRowKeyRef,
+      droppingPositionRef,
+      handleRowDragStart,
+      handleRowDragOver,
+      handleRowDragLeave,
+      handleRowDragEnd,
+      handleRowDrop,
       onLoadRef: toRef(props, 'onLoad'),
       mergedTableLayoutRef,
       resizableEnabledRef,
@@ -636,6 +661,9 @@ export default defineComponent({
           thButtonColorHover,
           thIconColor,
           thIconColorActive,
+          dropMarkColor,
+          dragGhostOpacity,
+          dragGhostFilter,
           filterSize,
           borderRadius,
           lineHeight,
@@ -704,6 +732,9 @@ export default defineComponent({
         '--u-th-button-color-hover': thButtonColorHover,
         '--u-th-icon-color': thIconColor,
         '--u-th-icon-color-active': thIconColorActive,
+        '--u-drop-mark-color': dropMarkColor,
+        '--u-drag-ghost-opacity': dragGhostOpacity,
+        '--u-drag-ghost-filter': dragGhostFilter,
         '--u-filter-size': filterSize,
         '--u-pagination-margin': paginationMargin,
         '--u-empty-padding': emptyPadding,

package/es/data-table/src/HeaderButton/FilterButton.d.ts

@@ -54,6 +54,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -1448,6 +1451,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;

package/es/data-table/src/HeaderButton/FilterMenu.d.ts

@@ -79,6 +79,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -1473,6 +1476,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;

package/es/data-table/src/TableParts/Body.d.ts

@@ -1,14 +1,7 @@
 import type { CSSProperties, PropType } from 'vue';
 import type { VirtualListInst } from 'vueuc';
 import type { ScrollbarInst } from '../../../_internal';
-import type { ColumnKey, RowKey, TmNode } from '../interface';
-import type { ColItem } from '../use-group-header';
-interface NormalRowRenderInfo {
-    striped: boolean;
-    tmNode: TmNode;
-    key: RowKey;
-    index: number;
-}
+import type { ColumnKey, NormalRowRenderInfo, RowKey, TmNode } from '../interface';
 declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     onEdit: PropType<(value: string, row: string, key: string) => void>;
     onResize: PropType<(e: ResizeObserverEntry) => void>;
@@ -103,6 +96,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -1497,6 +1493,9 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
             thButtonColorHover: string;
             thIconColor: string;
             thIconColorActive: string;
+            dropMarkColor: string;
+            dragGhostOpacity: string;
+            dragGhostFilter: string;
             borderColorModal: string;
             tdColorHoverModal: string;
             tdColorStripedModal: string;
@@ -2849,7 +2848,7 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
         };
     }>;
     scrollX: import("vue").Ref<string | number | undefined, string | number | undefined>;
-    cols: import("vue").Ref<ColItem[], ColItem[]>;
+    cols: import("vue").Ref<import("../use-group-header").ColItem[], import("../use-group-header").ColItem[]>;
     loading: import("vue").Ref<boolean, boolean>;
     loadingSkeleton: import("vue").Ref<boolean, boolean>;
     bodyShowHeaderOnly: import("vue").ComputedRef<boolean>;
@@ -2910,6 +2909,15 @@ declare const _default: import("vue").DefineComponent<import("vue").ExtractPropT
     renderCell: import("vue").Ref<((value: any, rowData: object, column: import("../interface").TableBaseColumn) => import("vue").VNodeChild) | undefined, ((value: any, rowData: object, column: import("../interface").TableBaseColumn) => import("vue").VNodeChild) | undefined>;
     defaultEmptyValueRef: import("vue").Ref<string | (() => import("vue").VNodeChild) | undefined, string | (() => import("vue").VNodeChild) | undefined>;
     emptyPropsRef: import("vue").Ref<Partial<import("../../..").EmptyProps> | undefined, Partial<import("../../..").EmptyProps> | undefined>;
+    draggableColumn: import("vue").Ref<import("../interface").TableDraggableColumn<import("../interface").InternalRowData> | null, import("../interface").TableDraggableColumn<import("../interface").InternalRowData> | null>;
+    draggingRowKeySet: import("vue").Ref<Set<RowKey>, Set<RowKey>>;
+    droppingRowKey: import("vue").Ref<RowKey | null, RowKey | null>;
+    droppingPosition: import("vue").Ref<import("../interface").RowDropPosition | null, import("../interface").RowDropPosition | null>;
+    handleRowDragStart: (event: DragEvent, rowKey: RowKey) => void;
+    handleRowDragOver: (event: DragEvent, rowKey: RowKey) => void;
+    handleRowDragLeave: (event: DragEvent, rowKey: RowKey) => void;
+    handleRowDragEnd: () => void;
+    handleRowDrop: (event: DragEvent, rowKey: RowKey) => void;
 }, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "edit"[], "edit", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     onEdit: PropType<(value: string, row: string, key: string) => void>;
     onResize: PropType<(e: ResizeObserverEntry) => void>;