lsp-grid 1.0.0

package/dist/collection/plugins/groupingRow/grouping.row.types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grouping.row.types.js","sourceRoot":"","sources":["../../../src/plugins/groupingRow/grouping.row.types.ts"],"names":[],"mappings":"","sourcesContent":["import type { VNode } from '@stencil/core';\r\nimport type {\r\n  HyperFunc,\r\n  ColumnProp,\r\n  DimensionRows,\r\n  DataType,\r\n  Providers,\r\n  VirtualPositionItem,\r\n  PositionItem,\r\n  DimensionCols,\r\n} from '@type';\r\nimport type { RowProps } from '../../components/data/row-renderer';\r\nimport { GROUP_EXPAND_EVENT } from './grouping.const';\r\n\r\n/**\r\n * Properties for the grouping row template\r\n */\r\ninterface GroupTemplateProp {\r\n  /**\r\n   * Name of the grouping row\r\n   */\r\n  name: string;\r\n  /**\r\n   * Index of the grouping row\r\n   */\r\n  itemIndex: number;\r\n  /**\r\n   * Expanded state of the grouping row\r\n   */\r\n  expanded: boolean;\r\n  /**\r\n   * Depth of the grouping row\r\n   */\r\n  depth: number;\r\n  /**\r\n   * Providers for the grid\r\n   */\r\n  providers: Providers;\r\n  /**\r\n   * Dimension type (e.g. rgCol, colPinStart, colPinEnd, rowHeaders)\r\n   */\r\n  colType: DimensionCols | 'rowHeaders';\r\n  /**\r\n   * Model of the grouping row\r\n   */\r\n  model?: DataType;\r\n}\r\n\r\nexport type RowGroupingProps = GroupRowPros & PositionItem & {\r\n  /**\r\n   * Visible columns in the grid, can be used to get the width of the column and position of the column\r\n   * to calculate the position of the cells in the grouping row\r\n   */\r\n  columnItems: VirtualPositionItem[];\r\n};\r\nexport interface GroupRowPros extends RowProps {\r\n  model: DataType;\r\n  hasExpand: boolean;\r\n  providers: Providers;\r\n  groupingCustomRenderer?: GroupLabelTemplateFunc | null;\r\n}\r\n\r\nexport type GroupLabelTemplateFunc = (\r\n  createElement: HyperFunc<VNode>,\r\n  props: GroupTemplateProp & RowGroupingProps,\r\n  ...args: any[]\r\n) => any;\r\n\r\nexport type GroupingOptions = {\r\n  /**\r\n   * Column props to which grouping will be applied\r\n   */\r\n  props?: ColumnProp[];\r\n\r\n  /**\r\n   * Should grouping be preserved on source update.\r\n   * default: true\r\n   */\r\n  preserveGroupingOnUpdate?: boolean;\r\n  /**\r\n   * Custom group label template\r\n   */\r\n  groupLabelTemplate?: GroupLabelTemplateFunc;\r\n} & ExpandedOptions;\r\n\r\nexport type BeforeSourceSetEvent = {\r\n  type: DimensionRows;\r\n  source: DataType[];\r\n};\r\n\r\nexport type OnExpandEvent = {\r\n  model: DataType;\r\n  virtualIndex: number;\r\n};\r\n\r\nexport type ExpandedOptions = {\r\n  /**\r\n   * Currently expanded items. to set expanded: '{ 'a': true, 'a,b': true, 'a,b,c': true }'\r\n   */\r\n  prevExpanded?: Record<string, boolean>;\r\n\r\n  /**\r\n   * Is expanded by default\r\n   */\r\n  expandedAll?: boolean;\r\n\r\n  /**\r\n   * Custom group label value parser\r\n   */\r\n  getGroupValue?(item: DataType, prop: string | number): any;\r\n  /**\r\n   * Custom group label template\r\n   */\r\n  groupLabelTemplate?: GroupLabelTemplateFunc;\r\n};\r\n\r\ndeclare global {\r\n  /**\r\n   * grid.addEventListener(GROUP_EXPAND_EVENT, (e: OnExpandEvent) => {\r\n   *  console.log(e)\r\n   * })\r\n   */\r\n  interface HTMLRevoGridElementEventMap {\r\n    [GROUP_EXPAND_EVENT]: OnExpandEvent;\r\n  }\r\n}"]}

package/dist/collection/plugins/groupingRow/grouping.service.js

@@ -0,0 +1,178 @@
+/*!
+ * Built by LevelSkill.Pro
+ */
+import { GROUP_DEPTH, GROUP_EXPANDED, PSEUDO_GROUP_COLUMN, PSEUDO_GROUP_ITEM, PSEUDO_GROUP_ITEM_ID, PSEUDO_GROUP_ITEM_VALUE, GROUP_ORIGINAL_INDEX, GROUP_COLUMN_PROP, } from "./grouping.const";
+function getGroupValueDefault(item, prop) {
+    return item[prop] || null;
+}
+// get source based on proxy item collection to preserve rgRow order
+export function getSource(source, items, withoutGrouping = false) {
+    let index = 0;
+    const result = {
+        source: [],
+        prevExpanded: {},
+        oldNewIndexes: {},
+    };
+    // order important here, expected parent is first, then others
+    items.forEach(i => {
+        const model = source[i];
+        if (!withoutGrouping) {
+            result.source.push(model);
+            return;
+        }
+        // grouping filter
+        if (isGrouping(model)) {
+            if (getExpanded(model)) {
+                result.prevExpanded[model[PSEUDO_GROUP_ITEM_VALUE]] = true;
+            }
+        }
+        else {
+            result.source.push(model);
+            result.oldNewIndexes[i] = index;
+            index++;
+        }
+    });
+    return result;
+}
+export function getExpanded(model = {}) {
+    return model[GROUP_EXPANDED];
+}
+function flattenGroupMaps({ groupedValues, parentIds, isExpanded, itemIndex, expandedAll, prevExpanded, columnProps, }) {
+    const depth = parentIds.length;
+    const sourceWithGroups = [];
+    // collapse all groups in the beginning
+    let trimmed = {};
+    // index mapping
+    let oldNewIndexMap = {};
+    groupedValues.forEach((innerGroupedValues, groupId) => {
+        const levelIds = [...parentIds, groupId];
+        const mergedIds = levelIds.join(',');
+        const isGroupExpanded = isExpanded && (!!expandedAll || !!prevExpanded[mergedIds]);
+        sourceWithGroups.push({
+            [PSEUDO_GROUP_ITEM]: groupId,
+            [GROUP_DEPTH]: depth,
+            [PSEUDO_GROUP_ITEM_ID]: JSON.stringify(levelIds),
+            [PSEUDO_GROUP_ITEM_VALUE]: mergedIds,
+            [GROUP_EXPANDED]: isGroupExpanded,
+            [GROUP_COLUMN_PROP]: columnProps[depth],
+            [columnProps[depth]]: groupId,
+        });
+        itemIndex += 1;
+        // If parent group is collapsed, mark all items as hidden
+        if (!isExpanded && depth) {
+            trimmed[itemIndex] = true;
+        }
+        if (Array.isArray(innerGroupedValues)) {
+            // This branch handles leaf nodes (actual data items)
+            innerGroupedValues.forEach(value => {
+                itemIndex += 1;
+                if (!isGroupExpanded) {
+                    trimmed[itemIndex] = true; // Mark items as hidden if group is collapsed
+                }
+                oldNewIndexMap[value[GROUP_ORIGINAL_INDEX]] = itemIndex; // Keep track of new positions
+            });
+            sourceWithGroups.push(...innerGroupedValues);
+        }
+        else {
+            // This branch handles nested groups (further subgroups)
+            const children = flattenGroupMaps({
+                groupedValues: innerGroupedValues,
+                parentIds: levelIds,
+                isExpanded: isGroupExpanded,
+                itemIndex,
+                expandedAll,
+                prevExpanded,
+                columnProps,
+            }); // Recursively process subgroups
+            sourceWithGroups.push(...children.source);
+            trimmed = Object.assign(Object.assign({}, children.trimmed), trimmed);
+            oldNewIndexMap = Object.assign(Object.assign({}, children.oldNewIndexMap), oldNewIndexMap);
+            itemIndex = children.itemIndex;
+        }
+    });
+    return {
+        source: sourceWithGroups,
+        oldNewIndexMap,
+        trimmed,
+        itemIndex,
+    };
+}
+/**
+ * Gather data for grouping
+ * @param array - flat data array
+ * @param columnProps - ids of groups
+ * @param expanded - potentially expanded items if present
+ */
+export function gatherGrouping(array, columnProps, { prevExpanded = {}, expandedAll = false, getGroupValue = getGroupValueDefault, }) {
+    const groupedItems = new Map();
+    array.forEach((item, originalIndex) => {
+        const groupLevelValues = columnProps.map(groupId => getGroupValue(item, groupId));
+        const lastLevelValue = groupLevelValues.pop();
+        let currentGroupLevel = groupedItems;
+        groupLevelValues.forEach(value => {
+            if (!currentGroupLevel.has(value)) {
+                currentGroupLevel.set(value, new Map());
+            }
+            currentGroupLevel = currentGroupLevel.get(value);
+        });
+        if (!currentGroupLevel.has(lastLevelValue)) {
+            const groupItems = [];
+            currentGroupLevel.set(lastLevelValue, groupItems);
+        }
+        const lastLevelItems = currentGroupLevel.get(lastLevelValue);
+        lastLevelItems.push(Object.assign(Object.assign({}, item), { [GROUP_ORIGINAL_INDEX]: originalIndex }));
+    });
+    const groupingDepth = columnProps.length;
+    const { source: sourceWithGroups, trimmed, oldNewIndexMap } = flattenGroupMaps({
+        groupedValues: groupedItems,
+        parentIds: [],
+        isExpanded: true,
+        itemIndex: -1,
+        expandedAll,
+        prevExpanded,
+        columnProps
+    });
+    return {
+        sourceWithGroups, // updates source mirror
+        depth: groupingDepth, // largest depth for grouping
+        trimmed, // used for expand/collapse grouping values
+        oldNewIndexMap, // used for mapping old values to new
+    };
+}
+export function getGroupingName(rgRow) {
+    return rgRow === null || rgRow === void 0 ? void 0 : rgRow[PSEUDO_GROUP_ITEM];
+}
+export function isGrouping(rgRow) {
+    return typeof (rgRow === null || rgRow === void 0 ? void 0 : rgRow[PSEUDO_GROUP_ITEM]) !== 'undefined';
+}
+export function isGroupingColumn(column) {
+    return typeof (column === null || column === void 0 ? void 0 : column[PSEUDO_GROUP_COLUMN]) !== 'undefined';
+}
+export function measureEqualDepth(groupA, groupB) {
+    const ln = groupA.length;
+    let i = 0;
+    for (; i < ln; i++) {
+        if (groupA[i] !== groupB[i]) {
+            return i;
+        }
+    }
+    return i;
+}
+export function getParsedGroup(id) {
+    const parseGroup = JSON.parse(id);
+    // extra precaution and type safeguard
+    if (!Array.isArray(parseGroup)) {
+        return null;
+    }
+    return parseGroup;
+}
+// check if items is child of current clicked group
+export function isSameGroup(currentGroup, currentModel, nextModel) {
+    const nextGroup = getParsedGroup(nextModel[PSEUDO_GROUP_ITEM_ID]);
+    if (!nextGroup) {
+        return false;
+    }
+    const depth = measureEqualDepth(currentGroup, nextGroup);
+    return currentModel[GROUP_DEPTH] < depth;
+}
+//# sourceMappingURL=grouping.service.js.map

package/dist/collection/plugins/groupingRow/grouping.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grouping.service.js","sourceRoot":"","sources":["../../../src/plugins/groupingRow/grouping.service.ts"],"names":[],"mappings":"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","sourcesContent":["import type { DataType, ColumnProp, ColumnRegular } from '@type';\r\nimport {\r\n  GROUP_DEPTH,\r\n  GROUP_EXPANDED,\r\n  PSEUDO_GROUP_COLUMN,\r\n  PSEUDO_GROUP_ITEM,\r\n  PSEUDO_GROUP_ITEM_ID,\r\n  PSEUDO_GROUP_ITEM_VALUE,\r\n  GROUP_ORIGINAL_INDEX,\r\n  GROUP_COLUMN_PROP,\r\n} from './grouping.const';\r\nimport type { ExpandedOptions } from './grouping.row.types';\r\n\r\ntype GroupedData = Map<string, GroupedData | DataType[]>;\r\ntype SourceGather = {\r\n  source: DataType[];\r\n  prevExpanded: Record<string, boolean>;\r\n  oldNewIndexes?: Record<number, number>;\r\n};\r\n\r\nfunction getGroupValueDefault(item: DataType, prop: string | number) {\r\n  return item[prop] || null;\r\n}\r\n\r\n// get source based on proxy item collection to preserve rgRow order\r\nexport function getSource(\r\n  source: DataType[],\r\n  items: number[],\r\n  withoutGrouping = false,\r\n) {\r\n  let index = 0;\r\n  const result: Required<SourceGather> = {\r\n    source: [],\r\n    prevExpanded: {},\r\n    oldNewIndexes: {},\r\n  };\r\n  // order important here, expected parent is first, then others\r\n  items.forEach(i => {\r\n    const model = source[i];\r\n    if (!withoutGrouping) {\r\n      result.source.push(model);\r\n      return;\r\n    }\r\n\r\n    // grouping filter\r\n    if (isGrouping(model)) {\r\n      if (getExpanded(model)) {\r\n        result.prevExpanded[model[PSEUDO_GROUP_ITEM_VALUE]] = true;\r\n      }\r\n    } else {\r\n      result.source.push(model);\r\n      result.oldNewIndexes[i] = index;\r\n      index++;\r\n    }\r\n  });\r\n  return result;\r\n}\r\n\r\nexport function getExpanded(model: DataType = {}) {\r\n  return model[GROUP_EXPANDED];\r\n}\r\n\r\nfunction flattenGroupMaps({\r\n  groupedValues,\r\n  parentIds,\r\n  isExpanded,\r\n  itemIndex,\r\n  expandedAll,\r\n  prevExpanded,\r\n  columnProps,\r\n}: {\r\n  groupedValues: GroupedData;\r\n  parentIds: string[];\r\n  isExpanded: boolean;\r\n  itemIndex: number;\r\n  expandedAll: boolean;\r\n  prevExpanded: Record<string, boolean>;\r\n  columnProps: ColumnProp[];\r\n}) {\r\n  const depth = parentIds.length;\r\n  const sourceWithGroups: DataType[] = [];\r\n  // collapse all groups in the beginning\r\n  let trimmed: Record<number, boolean> = {};\r\n\r\n  // index mapping\r\n  let oldNewIndexMap: Record<number, number> = {};\r\n\r\n  groupedValues.forEach((innerGroupedValues, groupId) => {\r\n    const levelIds = [...parentIds, groupId];\r\n    const mergedIds = levelIds.join(',');\r\n    const isGroupExpanded =\r\n      isExpanded && (!!expandedAll || !!prevExpanded[mergedIds]);\r\n    sourceWithGroups.push({\r\n      [PSEUDO_GROUP_ITEM]: groupId,\r\n      [GROUP_DEPTH]: depth,\r\n      [PSEUDO_GROUP_ITEM_ID]: JSON.stringify(levelIds),\r\n      [PSEUDO_GROUP_ITEM_VALUE]: mergedIds,\r\n      [GROUP_EXPANDED]: isGroupExpanded,\r\n      [GROUP_COLUMN_PROP]: columnProps[depth],\r\n      [columnProps[depth]]: groupId,\r\n    });\r\n    itemIndex += 1;\r\n    // If parent group is collapsed, mark all items as hidden\r\n    if (!isExpanded && depth) {\r\n      trimmed[itemIndex] = true;\r\n    }\r\n    if (Array.isArray(innerGroupedValues)) {\r\n      // This branch handles leaf nodes (actual data items)\r\n      innerGroupedValues.forEach(value => {\r\n        itemIndex += 1;\r\n        if (!isGroupExpanded) {\r\n          trimmed[itemIndex] = true; // Mark items as hidden if group is collapsed\r\n        }\r\n        oldNewIndexMap[value[GROUP_ORIGINAL_INDEX]] = itemIndex; // Keep track of new positions\r\n      });\r\n      sourceWithGroups.push(...innerGroupedValues);\r\n    } else {\r\n      // This branch handles nested groups (further subgroups)\r\n      const children = flattenGroupMaps({\r\n        groupedValues: innerGroupedValues,\r\n        parentIds: levelIds,\r\n        isExpanded: isGroupExpanded,\r\n        itemIndex,\r\n        expandedAll,\r\n        prevExpanded,\r\n        columnProps,\r\n      }); // Recursively process subgroups\r\n      sourceWithGroups.push(...children.source);\r\n      trimmed = { ...children.trimmed, ...trimmed };\r\n      oldNewIndexMap = { ...children.oldNewIndexMap, ...oldNewIndexMap };\r\n      itemIndex = children.itemIndex;\r\n    }\r\n  });\r\n  return {\r\n    source: sourceWithGroups,\r\n    oldNewIndexMap,\r\n    trimmed,\r\n    itemIndex,\r\n  };\r\n}\r\n\r\n/**\r\n * Gather data for grouping\r\n * @param array - flat data array\r\n * @param columnProps - ids of groups\r\n * @param expanded - potentially expanded items if present\r\n */\r\nexport function gatherGrouping(\r\n  array: DataType[],\r\n  columnProps: ColumnProp[],\r\n  {\r\n    prevExpanded = {},\r\n    expandedAll = false,\r\n    getGroupValue = getGroupValueDefault,\r\n  }: ExpandedOptions,\r\n) {\r\n  const groupedItems: GroupedData = new Map();\r\n  \r\n  array.forEach((item, originalIndex) => {\r\n    const groupLevelValues = columnProps.map(groupId => getGroupValue(item, groupId));\r\n    const lastLevelValue = groupLevelValues.pop();\r\n    let currentGroupLevel = groupedItems;\r\n    groupLevelValues.forEach(value => {\r\n      if (!currentGroupLevel.has(value)) {\r\n        currentGroupLevel.set(value, new Map());\r\n      }\r\n      currentGroupLevel = currentGroupLevel.get(value) as GroupedData;\r\n    });\r\n    if (!currentGroupLevel.has(lastLevelValue)) {\r\n      const groupItems: DataType[] = [];\r\n      currentGroupLevel.set(lastLevelValue, groupItems);\r\n    }\r\n    const lastLevelItems = currentGroupLevel.get(lastLevelValue) as DataType[];\r\n    lastLevelItems.push({\r\n      ...item,\r\n      [GROUP_ORIGINAL_INDEX]: originalIndex,\r\n    });\r\n  });\r\n\r\n  const groupingDepth = columnProps.length;\r\n\r\n  const { source: sourceWithGroups, trimmed, oldNewIndexMap } = flattenGroupMaps({\r\n    groupedValues: groupedItems,\r\n    parentIds: [],\r\n    isExpanded: true,\r\n    itemIndex: -1,\r\n    expandedAll,\r\n    prevExpanded,\r\n    columnProps\r\n  });\r\n\r\n  return {\r\n    sourceWithGroups, // updates source mirror\r\n    depth: groupingDepth, // largest depth for grouping\r\n    trimmed, // used for expand/collapse grouping values\r\n    oldNewIndexMap, // used for mapping old values to new\r\n  };\r\n}\r\n\r\nexport function getGroupingName(rgRow?: DataType) {\r\n  return rgRow?.[PSEUDO_GROUP_ITEM];\r\n}\r\n\r\ntype GroupingItem = {\r\n  [PSEUDO_GROUP_ITEM]: string;\r\n  [GROUP_EXPANDED]: boolean;\r\n  [PSEUDO_GROUP_ITEM_VALUE]: string;\r\n  [GROUP_DEPTH]: number;\r\n  [GROUP_COLUMN_PROP]: ColumnProp;\r\n};\r\n\r\nexport function isGrouping(rgRow?: DataType): rgRow is GroupingItem {\r\n  return typeof rgRow?.[PSEUDO_GROUP_ITEM] !== 'undefined';\r\n}\r\n\r\nexport function isGroupingColumn(column?: ColumnRegular) {\r\n  return typeof column?.[PSEUDO_GROUP_COLUMN] !== 'undefined';\r\n}\r\n\r\nexport function measureEqualDepth<T>(groupA: T[], groupB: T[]) {\r\n  const ln = groupA.length;\r\n  let i = 0;\r\n  for (; i < ln; i++) {\r\n    if (groupA[i] !== groupB[i]) {\r\n      return i;\r\n    }\r\n  }\r\n  return i;\r\n}\r\n\r\nexport function getParsedGroup(id: string) {\r\n  const parseGroup = JSON.parse(id);\r\n  // extra precaution and type safeguard\r\n  if (!Array.isArray(parseGroup)) {\r\n    return null;\r\n  }\r\n  return parseGroup;\r\n}\r\n\r\n// check if items is child of current clicked group\r\nexport function isSameGroup(\r\n  currentGroup: any[],\r\n  currentModel: DataType,\r\n  nextModel: DataType,\r\n) {\r\n  const nextGroup = getParsedGroup(nextModel[PSEUDO_GROUP_ITEM_ID]);\r\n  if (!nextGroup) {\r\n    return false;\r\n  }\r\n\r\n  const depth = measureEqualDepth(currentGroup, nextGroup);\r\n  return currentModel[GROUP_DEPTH] < depth;\r\n}\r\n"]}

package/dist/collection/plugins/groupingRow/grouping.trimmed.service.js

@@ -0,0 +1,61 @@
+/*!
+ * Built by LevelSkill.Pro
+ */
+import { gatherTrimmedItems } from "../../store/index";
+export const TRIMMED_GROUPING = 'grouping';
+/**
+ * Prepare trimming updated indexes for grouping
+ * @param initiallyTrimed
+ * @param firstLevelMap
+ * @param secondLevelMap
+ */
+export function processDoubleConversionTrimmed(initiallyTrimed, firstLevelMap, secondLevelMap) {
+    const trimemedOptionsToUpgrade = {};
+    /**
+     * go through all groups except grouping
+     */
+    for (let type in initiallyTrimed) {
+        if (type === TRIMMED_GROUPING) {
+            continue;
+        }
+        const items = initiallyTrimed[type];
+        const newItems = {};
+        for (let initialIndex in items) {
+            /**
+             * if item exists we find it in collection
+             * we support 2 level of conversions
+             */
+            let newConversionIndex = firstLevelMap[initialIndex];
+            if (secondLevelMap) {
+                newConversionIndex = secondLevelMap[newConversionIndex];
+            }
+            /**
+             * if item was trimmed previously
+             * trimming makes sense to apply
+             */
+            if (items[initialIndex]) {
+                newItems[newConversionIndex] = true;
+                /**
+                 * If changes present apply changes to new source
+                 */
+                if (newConversionIndex !== parseInt(initialIndex, 10)) {
+                    trimemedOptionsToUpgrade[type] = newItems;
+                }
+            }
+        }
+    }
+    return trimemedOptionsToUpgrade;
+}
+export function filterOutEmptyGroups(allTrimmedGroups, childrenByGroup = {}) {
+    const trimmedGroup = {};
+    const allTrimmed = gatherTrimmedItems(allTrimmedGroups);
+    // find is groups are filled
+    for (let groupIndex in childrenByGroup) {
+        const hasChidlren = childrenByGroup[groupIndex].filter(childIndex => !allTrimmed[childIndex]).length > 0;
+        if (!hasChidlren) {
+            trimmedGroup[groupIndex] = true;
+        }
+    }
+    return trimmedGroup;
+}
+//# sourceMappingURL=grouping.trimmed.service.js.map

package/dist/collection/plugins/groupingRow/grouping.trimmed.service.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"grouping.trimmed.service.js","sourceRoot":"","sources":["../../../src/plugins/groupingRow/grouping.trimmed.service.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,kBAAkB,EAA0B,MAAM,QAAQ,CAAC;AAEpE,MAAM,CAAC,MAAM,gBAAgB,GAAG,UAAU,CAAC;AAE3C;;;;;GAKG;AACH,MAAM,UAAU,8BAA8B,CAAC,eAAwB,EAAE,aAAqC,EAAE,cAAuC;IACrJ,MAAM,wBAAwB,GAAY,EAAE,CAAC;IAC7C;;OAEG;IACH,KAAK,IAAI,IAAI,IAAI,eAAe,EAAE,CAAC;QACjC,IAAI,IAAI,KAAK,gBAAgB,EAAE,CAAC;YAC9B,SAAS;QACX,CAAC;QACD,MAAM,KAAK,GAAG,eAAe,CAAC,IAAI,CAAC,CAAC;QACpC,MAAM,QAAQ,GAAkB,EAAE,CAAC;QAEnC,KAAK,IAAI,YAAY,IAAI,KAAK,EAAE,CAAC;YAC/B;;;eAGG;YACH,IAAI,kBAAkB,GAAG,aAAa,CAAC,YAAY,CAAC,CAAC;YACrD,IAAI,cAAc,EAAE,CAAC;gBACnB,kBAAkB,GAAG,cAAc,CAAC,kBAAkB,CAAC,CAAC;YAC1D,CAAC;YAED;;;eAGG;YACH,IAAI,KAAK,CAAC,YAAY,CAAC,EAAE,CAAC;gBACxB,QAAQ,CAAC,kBAAkB,CAAC,GAAG,IAAI,CAAC;gBACpC;;mBAEG;gBACH,IAAI,kBAAkB,KAAK,QAAQ,CAAC,YAAY,EAAE,EAAE,CAAC,EAAE,CAAC;oBACtD,wBAAwB,CAAC,IAAI,CAAC,GAAG,QAAQ,CAAC;gBAC5C,CAAC;YACH,CAAC;QACH,CAAC;IACH,CAAC;IACD,OAAO,wBAAwB,CAAC;AAClC,CAAC;AAED,MAAM,UAAU,oBAAoB,CAAC,gBAAyB,EAAE,kBAA4C,EAAE;IAC5G,MAAM,YAAY,GAAkB,EAAE,CAAC;IACvC,MAAM,UAAU,GAAG,kBAAkB,CAAC,gBAAgB,CAAC,CAAC;IACxD,4BAA4B;IAC5B,KAAK,IAAI,UAAU,IAAI,eAAe,EAAE,CAAC;QACvC,MAAM,WAAW,GAAG,eAAe,CAAC,UAAU,CAAC,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE,CAAC,CAAC,UAAU,CAAC,UAAU,CAAC,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;QACzG,IAAI,CAAC,WAAW,EAAE,CAAC;YACjB,YAAY,CAAC,UAAU,CAAC,GAAG,IAAI,CAAC;QAClC,CAAC;IACH,CAAC;IACD,OAAO,YAAY,CAAC;AACtB,CAAC","sourcesContent":["import { gatherTrimmedItems, Trimmed, TrimmedEntity } from '@store';\r\n\r\nexport const TRIMMED_GROUPING = 'grouping';\r\n\r\n/**\r\n * Prepare trimming updated indexes for grouping\r\n * @param initiallyTrimed\r\n * @param firstLevelMap\r\n * @param secondLevelMap\r\n */\r\nexport function processDoubleConversionTrimmed(initiallyTrimed: Trimmed, firstLevelMap: Record<number, number>, secondLevelMap?: Record<number, number>) {\r\n  const trimemedOptionsToUpgrade: Trimmed = {};\r\n  /**\r\n   * go through all groups except grouping\r\n   */\r\n  for (let type in initiallyTrimed) {\r\n    if (type === TRIMMED_GROUPING) {\r\n      continue;\r\n    }\r\n    const items = initiallyTrimed[type];\r\n    const newItems: TrimmedEntity = {};\r\n\r\n    for (let initialIndex in items) {\r\n      /**\r\n       * if item exists we find it in collection\r\n       * we support 2 level of conversions\r\n       */\r\n      let newConversionIndex = firstLevelMap[initialIndex];\r\n      if (secondLevelMap) {\r\n        newConversionIndex = secondLevelMap[newConversionIndex];\r\n      }\r\n\r\n      /**\r\n       * if item was trimmed previously\r\n       * trimming makes sense to apply\r\n       */\r\n      if (items[initialIndex]) {\r\n        newItems[newConversionIndex] = true;\r\n        /**\r\n         * If changes present apply changes to new source\r\n         */\r\n        if (newConversionIndex !== parseInt(initialIndex, 10)) {\r\n          trimemedOptionsToUpgrade[type] = newItems;\r\n        }\r\n      }\r\n    }\r\n  }\r\n  return trimemedOptionsToUpgrade;\r\n}\r\n\r\nexport function filterOutEmptyGroups(allTrimmedGroups: Trimmed, childrenByGroup: Record<number, number[]> = {}) {\r\n  const trimmedGroup: TrimmedEntity = {};\r\n  const allTrimmed = gatherTrimmedItems(allTrimmedGroups);\r\n  // find is groups are filled\r\n  for (let groupIndex in childrenByGroup) {\r\n    const hasChidlren = childrenByGroup[groupIndex].filter(childIndex => !allTrimmed[childIndex]).length > 0;\r\n    if (!hasChidlren) {\r\n      trimmedGroup[groupIndex] = true;\r\n    }\r\n  }\r\n  return trimmedGroup;\r\n}\r\n"]}

package/dist/collection/plugins/index.js

@@ -0,0 +1,15 @@
+/*!
+ * Built by LevelSkill.Pro
+ */
+export * from './base.plugin';
+export * from './column.auto-size.plugin';
+export * from './column.stretch.plugin';
+export * from './dispatcher';
+export * from './export/export.plugin';
+export * from './filter/filter.plugin';
+export * from './groupingRow/grouping.row.plugin';
+export * from './moveColumn/column.drag.plugin';
+export * from './sorting/sorting.plugin';
+export * from './sorting/sorting.sign';
+export * from './add-rows-on-paste.plugin';
+//# sourceMappingURL=index.js.map

package/dist/collection/plugins/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../src/plugins/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,2BAA2B,CAAC;AAC1C,cAAc,yBAAyB,CAAC;AACxC,cAAc,cAAc,CAAC;AAC7B,cAAc,wBAAwB,CAAC;AACvC,cAAc,wBAAwB,CAAC;AACvC,cAAc,mCAAmC,CAAC;AAClD,cAAc,iCAAiC,CAAC;AAChD,cAAc,0BAA0B,CAAC;AACzC,cAAc,wBAAwB,CAAC;AACvC,cAAc,4BAA4B,CAAC","sourcesContent":["export * from './base.plugin';\r\nexport * from './column.auto-size.plugin';\r\nexport * from './column.stretch.plugin';\r\nexport * from './dispatcher';\r\nexport * from './export/export.plugin';\r\nexport * from './filter/filter.plugin';\r\nexport * from './groupingRow/grouping.row.plugin';\r\nexport * from './moveColumn/column.drag.plugin';\r\nexport * from './sorting/sorting.plugin';\r\nexport * from './sorting/sorting.sign';\r\nexport * from './add-rows-on-paste.plugin';\r\n"]}

package/dist/collection/plugins/moveColumn/column.drag.plugin.js

@@ -0,0 +1,175 @@
+/*!
+ * Built by LevelSkill.Pro
+ */
+/**
+ * Plugin for column manual move
+ */
+import debounce from "lodash/debounce";
+import each from "lodash/each";
+import { getItemByPosition } from "../../store/index";
+import { BasePlugin } from "../base.plugin";
+import { ColumnOrderHandler } from "./order-column.handler";
+import { dispatch } from "../dispatcher";
+import { ON_COLUMN_CLICK } from "../../components/header/header-cell-renderer";
+import { isColGrouping } from "../../utils/column.utils";
+const COLUMN_CLICK = ON_COLUMN_CLICK;
+const MOVE = 'columndragmousemove';
+const DRAG_END = 'columndragend';
+const BEFORE_DRAG_END = 'beforecolumndragend';
+// use this event subscription to drop D&D for particular columns
+const DRAG_START = 'columndragstart';
+export class ColumnMovePlugin extends BasePlugin {
+    constructor(revogrid, providers) {
+        super(revogrid, providers);
+        this.revogrid = revogrid;
+        this.providers = providers;
+        this.moveFunc = debounce((e) => this.doMove(e), 5);
+        this.staticDragData = null;
+        this.dragData = null;
+        this.localSubscriptions = {};
+        this.orderUi = new ColumnOrderHandler();
+        revogrid.appendChild(this.orderUi.render());
+        revogrid.classList.add('column-draggable');
+        // Register events
+        this.localSubscriptions['mouseleave'] = {
+            target: document,
+            callback: (e) => this.onMouseOut(e),
+        };
+        this.localSubscriptions['mouseup'] = {
+            target: document,
+            callback: (e) => this.onMouseUp(e),
+        };
+        this.localSubscriptions['mousemove'] = {
+            target: document,
+            callback: (e) => this.move(e),
+        };
+        this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));
+    }
+    dragStart({ event, data }) {
+        if (event.defaultPrevented) {
+            return;
+        }
+        const { defaultPrevented } = dispatch(this.revogrid, DRAG_START, data);
+        // check if allowed to drag particulat column
+        if (defaultPrevented) {
+            return;
+        }
+        this.clearOrder();
+        const { mouseleave, mouseup, mousemove } = this.localSubscriptions;
+        mouseleave.target.addEventListener('mouseleave', mouseleave.callback);
+        mouseup.target.addEventListener('mouseup', mouseup.callback);
+        const dataEl = event.target.closest('revogr-header');
+        const scrollEl = event.target.closest('revogr-viewport-scroll');
+        if (!dataEl || !scrollEl) {
+            return;
+        }
+        // no grouping drag and no row header column drag
+        if (isColGrouping(data) || data.providers.type === 'rowHeaders') {
+            return;
+        }
+        const cols = this.getDimension(data.pin || 'rgCol');
+        const gridRect = this.revogrid.getBoundingClientRect();
+        const elRect = dataEl.getBoundingClientRect();
+        const startItem = getItemByPosition(cols, getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left));
+        this.staticDragData = {
+            startPos: event.x,
+            startItem,
+            data,
+            dataEl,
+            scrollEl,
+            gridEl: this.revogrid,
+            cols,
+        };
+        this.dragData = this.getData(this.staticDragData);
+        mousemove.target.addEventListener('mousemove', mousemove.callback);
+        this.orderUi.start(event, Object.assign(Object.assign({}, this.dragData), this.staticDragData));
+    }
+    doMove(e) {
+        if (!this.staticDragData) {
+            return;
+        }
+        const dragData = (this.dragData = this.getData(this.staticDragData));
+        if (!dragData) {
+            return;
+        }
+        const start = this.staticDragData.startPos;
+        if (Math.abs(start - e.x) > 10) {
+            const x = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
+            const rgCol = getItemByPosition(this.staticDragData.cols, x);
+            this.orderUi.autoscroll(x, dragData.elRect.width);
+            // prevent position change if out of bounds
+            if (rgCol.itemIndex >= this.staticDragData.cols.count) {
+                return;
+            }
+            this.orderUi.showHandler(rgCol.start + dragData.scrollOffset, dragData.gridRect.width, Math.abs(rgCol.end - rgCol.start));
+        }
+    }
+    move(e) {
+        dispatch(this.revogrid, MOVE, e);
+        // then do move
+        this.moveFunc(e);
+    }
+    onMouseOut(_) {
+        this.clearOrder();
+    }
+    onMouseUp(e) {
+        // apply new positions
+        if (this.dragData && this.staticDragData) {
+            let relativePos = getLeftRelative(e.x, this.dragData.gridRect.left, this.dragData.scrollOffset);
+            if (relativePos < 0) {
+                relativePos = 0;
+            }
+            const newPosition = getItemByPosition(this.staticDragData.cols, relativePos);
+            const store = this.providers.column.stores[this.dragData.type].store;
+            const newItems = [...store.get('items')];
+            const allColumns = store.get('source');
+            const onDropColumn = allColumns[newPosition.itemIndex];
+            // prevent position change if needed
+            const { defaultPrevented: stopDrag } = dispatch(this.revogrid, BEFORE_DRAG_END, Object.assign(Object.assign({}, this.staticDragData), { startPosition: this.staticDragData.startItem, newPosition, newItem: store.get('source')[newItems[this.staticDragData.startItem.itemIndex]] }));
+            if (!stopDrag && onDropColumn && onDropColumn.draggable !== false) {
+                const prevItems = [...newItems];
+                // todo: if move item out of group remove item from group
+                const toMove = newItems.splice(this.staticDragData.startItem.itemIndex, 1);
+                newItems.splice(newPosition.itemIndex, 0, ...toMove);
+                store.set('items', newItems);
+                this.providers.dimension.updateSizesPositionByNewDataIndexes(this.dragData.type, newItems, prevItems);
+            }
+            dispatch(this.revogrid, DRAG_END, this.dragData);
+        }
+        this.clearOrder();
+    }
+    clearLocalSubscriptions() {
+        each(this.localSubscriptions, ({ target, callback }, key) => target.removeEventListener(key, callback));
+    }
+    clearOrder() {
+        this.staticDragData = null;
+        this.dragData = null;
+        this.clearLocalSubscriptions();
+        this.orderUi.stop(this.revogrid);
+    }
+    /**
+     * Clearing subscription
+     */
+    clearSubscriptions() {
+        super.clearSubscriptions();
+        this.clearLocalSubscriptions();
+    }
+    getData({ gridEl, dataEl, data }) {
+        const gridRect = gridEl.getBoundingClientRect();
+        const elRect = dataEl.getBoundingClientRect();
+        const scrollOffset = elRect.left - gridRect.left;
+        return {
+            elRect,
+            gridRect,
+            type: data.pin || 'rgCol',
+            scrollOffset,
+        };
+    }
+    getDimension(type) {
+        return this.providers.dimension.stores[type].getCurrentState();
+    }
+}
+export function getLeftRelative(absoluteX, gridPos, offset) {
+    return absoluteX - gridPos - offset;
+}
+//# sourceMappingURL=column.drag.plugin.js.map

package/dist/collection/plugins/moveColumn/column.drag.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"column.drag.plugin.js","sourceRoot":"","sources":["../../../src/plugins/moveColumn/column.drag.plugin.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,OAAO,QAAQ,MAAM,iBAAiB,CAAC;AACvC,OAAO,IAAI,MAAM,aAAa,CAAC;AAC/B,OAAO,EAAE,iBAAiB,EAAE,MAAM,QAAQ,CAAC;AAC3C,OAAO,EAAE,UAAU,EAAE,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAE,kBAAkB,EAAE,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAUzC,OAAO,EAAE,eAAe,EAAE,MAAM,8CAA8C,CAAC;AAC/E,OAAO,EAAE,aAAa,EAAE,MAAM,0BAA0B,CAAC;AAEzD,MAAM,YAAY,GAAG,eAAe,CAAC;AACrC,MAAM,IAAI,GAAG,qBAAqB,CAAC;AACnC,MAAM,QAAQ,GAAG,eAAe,CAAC;AACjC,MAAM,eAAe,GAAG,qBAAqB,CAAC;AAE9C,iEAAiE;AACjE,MAAM,UAAU,GAAG,iBAAiB,CAAC;AA4BrC,MAAM,OAAO,gBAAiB,SAAQ,UAAU;IAM9C,YACS,QAA6B,EAC7B,SAA0B;QAEjC,KAAK,CAAC,QAAQ,EAAE,SAAS,CAAC,CAAC;QAHpB,aAAQ,GAAR,QAAQ,CAAqB;QAC7B,cAAS,GAAT,SAAS,CAAiB;QAP3B,aAAQ,GAAG,QAAQ,CAAC,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;QAC1D,mBAAc,GAAsB,IAAI,CAAC;QACzC,aAAQ,GAA+B,IAAI,CAAC;QAEjC,uBAAkB,GAAuB,EAAE,CAAC;QAM7D,IAAI,CAAC,OAAO,GAAG,IAAI,kBAAkB,EAAE,CAAC;QACxC,QAAQ,CAAC,WAAW,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE,CAAC,CAAC;QAC5C,QAAQ,CAAC,SAAS,CAAC,GAAG,CAAC,kBAAkB,CAAC,CAAC;QAE3C,kBAAkB;QAClB,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,GAAG;YACtC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,UAAU,CAAC,CAAC,CAAC;SAChD,CAAC;QACF,IAAI,CAAC,kBAAkB,CAAC,SAAS,CAAC,GAAG;YACnC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,CAAC,CAAC;SAC/C,CAAC;QAEF,IAAI,CAAC,kBAAkB,CAAC,WAAW,CAAC,GAAG;YACrC,MAAM,EAAE,QAAQ;YAChB,QAAQ,EAAE,CAAC,CAAa,EAAE,EAAE,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,CAAC;SAC1C,CAAC;QAEF,IAAI,CAAC,gBAAgB,CAAC,YAAY,EAAE,CAAC,EAAE,MAAM,EAAE,EAAE,EAAE,CAAC,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,CAAC,CAAC;IAC9E,CAAC;IAED,SAAS,CAAC,EAAE,KAAK,EAAE,IAAI,EAAyB;QAC9C,IAAI,KAAK,CAAC,gBAAgB,EAAE,CAAC;YAC3B,OAAO;QACT,CAAC;QACD,MAAM,EAAE,gBAAgB,EAAE,GAAG,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,UAAU,EAAE,IAAI,CAAC,CAAC;QACvE,6CAA6C;QAC7C,IAAI,gBAAgB,EAAE,CAAC;YACrB,OAAO;QACT,CAAC;QACD,IAAI,CAAC,UAAU,EAAE,CAAC;QAClB,MAAM,EAAE,UAAU,EAAE,OAAO,EAAE,SAAS,EAAE,GAAG,IAAI,CAAC,kBAAkB,CAAC;QACnE,UAAU,CAAC,MAAM,CAAC,gBAAgB,CAAC,YAAY,EAAE,UAAU,CAAC,QAAQ,CAAC,CAAC;QACtE,OAAO,CAAC,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,OAAO,CAAC,QAAQ,CAAC,CAAC;QAE7D,MAAM,MAAM,GAAI,KAAK,CAAC,MAAsB,CAAC,OAAO,CAAC,eAAe,CAAC,CAAC;QACtE,MAAM,QAAQ,GAAI,KAAK,CAAC,MAAsB,CAAC,OAAO,CACpD,wBAAwB,CACzB,CAAC;QACF,IAAI,CAAC,MAAM,IAAI,CAAC,QAAQ,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,iDAAiD;QACjD,IAAI,aAAa,CAAC,IAAI,CAAC,IAAI,IAAI,CAAC,SAAS,CAAC,IAAI,KAAK,YAAY,EAAE,CAAC;YAChE,OAAO;QACT,CAAC;QAED,MAAM,IAAI,GAAG,IAAI,CAAC,YAAY,CAAC,IAAI,CAAC,GAAG,IAAI,OAAO,CAAC,CAAC;QACpD,MAAM,QAAQ,GAAG,IAAI,CAAC,QAAQ,CAAC,qBAAqB,EAAE,CAAC;QACvD,MAAM,MAAM,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC9C,MAAM,SAAS,GAAG,iBAAiB,CACjC,IAAI,EACJ,eAAe,CAAC,KAAK,CAAC,CAAC,EAAE,QAAQ,CAAC,IAAI,EAAE,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC,CACrE,CAAC;QAEF,IAAI,CAAC,cAAc,GAAG;YACpB,QAAQ,EAAE,KAAK,CAAC,CAAC;YACjB,SAAS;YACT,IAAI;YACJ,MAAM;YACN,QAAQ;YACR,MAAM,EAAE,IAAI,CAAC,QAAQ;YACrB,IAAI;SACL,CAAC;QACF,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC;QAClD,SAAS,CAAC,MAAM,CAAC,gBAAgB,CAAC,WAAW,EAAE,SAAS,CAAC,QAAQ,CAAC,CAAC;QACnE,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC,KAAK,kCACnB,IAAI,CAAC,QAAQ,GACb,IAAI,CAAC,cAAc,EACtB,CAAC;IACL,CAAC;IAED,MAAM,CAAC,CAAa;QAClB,IAAI,CAAC,IAAI,CAAC,cAAc,EAAE,CAAC;YACzB,OAAO;QACT,CAAC;QAED,MAAM,QAAQ,GAAG,CAAC,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,cAAc,CAAC,CAAC,CAAC;QACrE,IAAI,CAAC,QAAQ,EAAE,CAAC;YACd,OAAO;QACT,CAAC;QACD,MAAM,KAAK,GAAG,IAAI,CAAC,cAAc,CAAC,QAAQ,CAAC;QAC3C,IAAI,IAAI,CAAC,GAAG,CAAC,KAAK,GAAG,CAAC,CAAC,CAAC,CAAC,GAAG,EAAE,EAAE,CAAC;YAC/B,MAAM,CAAC,GAAG,eAAe,CACvB,CAAC,CAAC,CAAC,EACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAC3B,IAAI,CAAC,QAAQ,CAAC,YAAY,CAC3B,CAAC;YACF,MAAM,KAAK,GAAG,iBAAiB,CAAC,IAAI,CAAC,cAAc,CAAC,IAAI,EAAE,CAAC,CAAC,CAAC;YAC7D,IAAI,CAAC,OAAO,CAAC,UAAU,CAAC,CAAC,EAAE,QAAQ,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC;YAElD,2CAA2C;YAC3C,IAAI,KAAK,CAAC,SAAS,IAAI,IAAI,CAAC,cAAc,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;gBACtD,OAAO;YACT,CAAC;YACD,IAAI,CAAC,OAAO,CAAC,WAAW,CACtB,KAAK,CAAC,KAAK,GAAG,QAAQ,CAAC,YAAY,EACnC,QAAQ,CAAC,QAAQ,CAAC,KAAK,EACvB,IAAI,CAAC,GAAG,CAAC,KAAK,CAAC,GAAG,GAAG,KAAK,CAAC,KAAK,CAAC,CAClC,CAAC;QACJ,CAAC;IACH,CAAC;IAED,IAAI,CAAC,CAAa;QAChB,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAC;QACjC,eAAe;QACf,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC;IACnB,CAAC;IACD,UAAU,CAAC,CAAa;QACtB,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IACD,SAAS,CAAC,CAAa;QACrB,sBAAsB;QACtB,IAAI,IAAI,CAAC,QAAQ,IAAI,IAAI,CAAC,cAAc,EAAE,CAAC;YACzC,IAAI,WAAW,GAAG,eAAe,CAC/B,CAAC,CAAC,CAAC,EACH,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,IAAI,EAC3B,IAAI,CAAC,QAAQ,CAAC,YAAY,CAC3B,CAAC;YACF,IAAI,WAAW,GAAG,CAAC,EAAE,CAAC;gBACpB,WAAW,GAAG,CAAC,CAAC;YAClB,CAAC;YACD,MAAM,WAAW,GAAG,iBAAiB,CACnC,IAAI,CAAC,cAAc,CAAC,IAAI,EACxB,WAAW,CACZ,CAAC;YAEF,MAAM,KAAK,GAAG,IAAI,CAAC,SAAS,CAAC,MAAM,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,CAAC,KAAK,CAAC;YACrE,MAAM,QAAQ,GAAG,CAAC,GAAG,KAAK,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC;YACzC,MAAM,UAAU,GAAG,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CAAC;YACvC,MAAM,YAAY,GAAG,UAAU,CAAC,WAAW,CAAC,SAAS,CAAC,CAAC;YAEvD,oCAAoC;YACpC,MAAM,EAAE,gBAAgB,EAAE,QAAQ,EAAE,GAAG,QAAQ,CAC7C,IAAI,CAAC,QAAQ,EACb,eAAe,kCAEV,IAAI,CAAC,cAAc,KACtB,aAAa,EAAE,IAAI,CAAC,cAAc,CAAC,SAAS,EAC5C,WAAW,EACX,OAAO,EACL,KAAK,CAAC,GAAG,CAAC,QAAQ,CAAC,CACjB,QAAQ,CAAC,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,SAAS,CAAC,CAClD,IAEN,CAAC;YACF,IAAI,CAAC,QAAQ,IAAI,YAAY,IAAI,YAAY,CAAC,SAAS,KAAK,KAAK,EAAE,CAAC;gBAClE,MAAM,SAAS,GAAG,CAAC,GAAG,QAAQ,CAAC,CAAC;gBAChC,yDAAyD;gBACzD,MAAM,MAAM,GAAG,QAAQ,CAAC,MAAM,CAC5B,IAAI,CAAC,cAAc,CAAC,SAAS,CAAC,SAAS,EACvC,CAAC,CACF,CAAC;gBACF,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,SAAS,EAAE,CAAC,EAAE,GAAG,MAAM,CAAC,CAAC;gBACrD,KAAK,CAAC,GAAG,CAAC,OAAO,EAAE,QAAQ,CAAC,CAAC;gBAC7B,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,mCAAmC,CAC1D,IAAI,CAAC,QAAQ,CAAC,IAAI,EAClB,QAAQ,EACR,SAAS,CACV,CAAC;YACJ,CAAC;YACD,QAAQ,CAAC,IAAI,CAAC,QAAQ,EAAE,QAAQ,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;QACnD,CAAC;QACD,IAAI,CAAC,UAAU,EAAE,CAAC;IACpB,CAAC;IAEO,uBAAuB;QAC7B,IAAI,CAAC,IAAI,CAAC,kBAAkB,EAAE,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,EAAE,GAAG,EAAE,EAAE,CAC1D,MAAM,CAAC,mBAAmB,CAAC,GAAG,EAAE,QAAQ,CAAC,CAC1C,CAAC;IACJ,CAAC;IAED,UAAU;QACR,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC;QAC3B,IAAI,CAAC,QAAQ,GAAG,IAAI,CAAC;QACrB,IAAI,CAAC,uBAAuB,EAAE,CAAC;QAC/B,IAAI,CAAC,OAAO,CAAC,IAAI,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC;IACnC,CAAC;IACD;;OAEG;IACH,kBAAkB;QAChB,KAAK,CAAC,kBAAkB,EAAE,CAAC;QAC3B,IAAI,CAAC,uBAAuB,EAAE,CAAC;IACjC,CAAC;IAEO,OAAO,CAAC,EAAE,MAAM,EAAE,MAAM,EAAE,IAAI,EAAc;QAClD,MAAM,QAAQ,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAChD,MAAM,MAAM,GAAG,MAAM,CAAC,qBAAqB,EAAE,CAAC;QAC9C,MAAM,YAAY,GAAG,MAAM,CAAC,IAAI,GAAG,QAAQ,CAAC,IAAI,CAAC;QACjD,OAAO;YACL,MAAM;YACN,QAAQ;YACR,IAAI,EAAE,IAAI,CAAC,GAAG,IAAI,OAAO;YACzB,YAAY;SACb,CAAC;IACJ,CAAC;IACO,YAAY,CAAC,IAAwB;QAC3C,OAAO,IAAI,CAAC,SAAS,CAAC,SAAS,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC,eAAe,EAAE,CAAC;IACjE,CAAC;CACF;AAED,MAAM,UAAU,eAAe,CAC7B,SAAiB,EACjB,OAAe,EACf,MAAc;IAEd,OAAO,SAAS,GAAG,OAAO,GAAG,MAAM,CAAC;AACtC,CAAC","sourcesContent":["/**\r\n * Plugin for column manual move\r\n */\r\nimport debounce from 'lodash/debounce';\r\nimport each from 'lodash/each';\r\nimport { getItemByPosition } from '@store';\r\nimport { BasePlugin } from '../base.plugin';\r\nimport { ColumnOrderHandler } from './order-column.handler';\r\nimport { dispatch } from '../dispatcher';\r\nimport type {\r\n  ColumnPropProp,\r\n  ColumnTemplateProp,\r\n  DimensionSettingsState,\r\n  PositionItem,\r\n  DimensionCols,\r\n  MultiDimensionType,\r\n  PluginProviders,\r\n} from '@type';\r\nimport { ON_COLUMN_CLICK } from '../../components/header/header-cell-renderer';\r\nimport { isColGrouping } from '../../utils/column.utils';\r\n\r\nconst COLUMN_CLICK = ON_COLUMN_CLICK;\r\nconst MOVE = 'columndragmousemove';\r\nconst DRAG_END = 'columndragend';\r\nconst BEFORE_DRAG_END = 'beforecolumndragend';\r\n\r\n// use this event subscription to drop D&D for particular columns\r\nconst DRAG_START = 'columndragstart';\r\n\r\nexport type DragStartEventDetails = {\r\n  event: MouseEvent;\r\n  data: ColumnPropProp;\r\n};\r\n\r\ntype StaticData = {\r\n  startPos: number;\r\n  startItem: PositionItem;\r\n  data: ColumnTemplateProp;\r\n  dataEl: HTMLElement;\r\n  scrollEl: Element;\r\n  gridEl: HTMLElement;\r\n  cols: DimensionSettingsState;\r\n};\r\n\r\ntype LocalSubscriptions = Record<string, LocalSubscription>;\r\ntype LocalSubscription = {\r\n  target: Element | Document;\r\n  callback(...params: any[]): void;\r\n};\r\nexport type ColumnDragEventData = {\r\n  elRect: DOMRect;\r\n  gridRect: DOMRect;\r\n  scrollOffset: number;\r\n  type: DimensionCols;\r\n};\r\nexport class ColumnMovePlugin extends BasePlugin {\r\n  private moveFunc = debounce((e: MouseEvent) => this.doMove(e), 5);\r\n  private staticDragData: StaticData | null = null;\r\n  private dragData: ColumnDragEventData | null = null;\r\n  private readonly orderUi: ColumnOrderHandler;\r\n  protected readonly localSubscriptions: LocalSubscriptions = {};\r\n  constructor(\r\n    public revogrid: HTMLRevoGridElement,\r\n    public providers: PluginProviders,\r\n  ) {\r\n    super(revogrid, providers);\r\n    this.orderUi = new ColumnOrderHandler();\r\n    revogrid.appendChild(this.orderUi.render());\r\n    revogrid.classList.add('column-draggable');\r\n\r\n    // Register events\r\n    this.localSubscriptions['mouseleave'] = {\r\n      target: document,\r\n      callback: (e: MouseEvent) => this.onMouseOut(e),\r\n    };\r\n    this.localSubscriptions['mouseup'] = {\r\n      target: document,\r\n      callback: (e: MouseEvent) => this.onMouseUp(e),\r\n    };\r\n\r\n    this.localSubscriptions['mousemove'] = {\r\n      target: document,\r\n      callback: (e: MouseEvent) => this.move(e),\r\n    };\r\n\r\n    this.addEventListener(COLUMN_CLICK, ({ detail }) => this.dragStart(detail));\r\n  }\r\n\r\n  dragStart({ event, data }: DragStartEventDetails) {\r\n    if (event.defaultPrevented) {\r\n      return;\r\n    }\r\n    const { defaultPrevented } = dispatch(this.revogrid, DRAG_START, data);\r\n    // check if allowed to drag particulat column\r\n    if (defaultPrevented) {\r\n      return;\r\n    }\r\n    this.clearOrder();\r\n    const { mouseleave, mouseup, mousemove } = this.localSubscriptions;\r\n    mouseleave.target.addEventListener('mouseleave', mouseleave.callback);\r\n    mouseup.target.addEventListener('mouseup', mouseup.callback);\r\n\r\n    const dataEl = (event.target as HTMLElement).closest('revogr-header');\r\n    const scrollEl = (event.target as HTMLElement).closest(\r\n      'revogr-viewport-scroll',\r\n    );\r\n    if (!dataEl || !scrollEl) {\r\n      return;\r\n    }\r\n\r\n    // no grouping drag and no row header column drag\r\n    if (isColGrouping(data) || data.providers.type === 'rowHeaders') {\r\n      return;\r\n    }\r\n\r\n    const cols = this.getDimension(data.pin || 'rgCol');\r\n    const gridRect = this.revogrid.getBoundingClientRect();\r\n    const elRect = dataEl.getBoundingClientRect();\r\n    const startItem = getItemByPosition(\r\n      cols,\r\n      getLeftRelative(event.x, gridRect.left, elRect.left - gridRect.left),\r\n    );\r\n\r\n    this.staticDragData = {\r\n      startPos: event.x,\r\n      startItem,\r\n      data,\r\n      dataEl,\r\n      scrollEl,\r\n      gridEl: this.revogrid,\r\n      cols,\r\n    };\r\n    this.dragData = this.getData(this.staticDragData);\r\n    mousemove.target.addEventListener('mousemove', mousemove.callback);\r\n    this.orderUi.start(event, {\r\n      ...this.dragData,\r\n      ...this.staticDragData,\r\n    });\r\n  }\r\n\r\n  doMove(e: MouseEvent) {\r\n    if (!this.staticDragData) {\r\n      return;\r\n    }\r\n\r\n    const dragData = (this.dragData = this.getData(this.staticDragData));\r\n    if (!dragData) {\r\n      return;\r\n    }\r\n    const start = this.staticDragData.startPos;\r\n    if (Math.abs(start - e.x) > 10) {\r\n      const x = getLeftRelative(\r\n        e.x,\r\n        this.dragData.gridRect.left,\r\n        this.dragData.scrollOffset,\r\n      );\r\n      const rgCol = getItemByPosition(this.staticDragData.cols, x);\r\n      this.orderUi.autoscroll(x, dragData.elRect.width);\r\n\r\n      // prevent position change if out of bounds\r\n      if (rgCol.itemIndex >= this.staticDragData.cols.count) {\r\n        return;\r\n      }\r\n      this.orderUi.showHandler(\r\n        rgCol.start + dragData.scrollOffset,\r\n        dragData.gridRect.width,\r\n        Math.abs(rgCol.end - rgCol.start),\r\n      );\r\n    }\r\n  }\r\n\r\n  move(e: MouseEvent) {\r\n    dispatch(this.revogrid, MOVE, e);\r\n    // then do move\r\n    this.moveFunc(e);\r\n  }\r\n  onMouseOut(_: MouseEvent) {\r\n    this.clearOrder();\r\n  }\r\n  onMouseUp(e: MouseEvent) {\r\n    // apply new positions\r\n    if (this.dragData && this.staticDragData) {\r\n      let relativePos = getLeftRelative(\r\n        e.x,\r\n        this.dragData.gridRect.left,\r\n        this.dragData.scrollOffset,\r\n      );\r\n      if (relativePos < 0) {\r\n        relativePos = 0;\r\n      }\r\n      const newPosition = getItemByPosition(\r\n        this.staticDragData.cols,\r\n        relativePos,\r\n      );\r\n\r\n      const store = this.providers.column.stores[this.dragData.type].store;\r\n      const newItems = [...store.get('items')];\r\n      const allColumns = store.get('source');\r\n      const onDropColumn = allColumns[newPosition.itemIndex];\r\n\r\n      // prevent position change if needed\r\n      const { defaultPrevented: stopDrag } = dispatch(\r\n        this.revogrid,\r\n        BEFORE_DRAG_END,\r\n        {\r\n          ...this.staticDragData,\r\n          startPosition: this.staticDragData.startItem,\r\n          newPosition,\r\n          newItem:\r\n            store.get('source')[\r\n              newItems[this.staticDragData.startItem.itemIndex]\r\n            ],\r\n        },\r\n      );\r\n      if (!stopDrag && onDropColumn && onDropColumn.draggable !== false) {\r\n        const prevItems = [...newItems];\r\n        // todo: if move item out of group remove item from group\r\n        const toMove = newItems.splice(\r\n          this.staticDragData.startItem.itemIndex,\r\n          1,\r\n        );\r\n        newItems.splice(newPosition.itemIndex, 0, ...toMove);\r\n        store.set('items', newItems);\r\n        this.providers.dimension.updateSizesPositionByNewDataIndexes(\r\n          this.dragData.type,\r\n          newItems,\r\n          prevItems,\r\n        );\r\n      }\r\n      dispatch(this.revogrid, DRAG_END, this.dragData);\r\n    }\r\n    this.clearOrder();\r\n  }\r\n\r\n  private clearLocalSubscriptions() {\r\n    each(this.localSubscriptions, ({ target, callback }, key) =>\r\n      target.removeEventListener(key, callback),\r\n    );\r\n  }\r\n\r\n  clearOrder() {\r\n    this.staticDragData = null;\r\n    this.dragData = null;\r\n    this.clearLocalSubscriptions();\r\n    this.orderUi.stop(this.revogrid);\r\n  }\r\n  /**\r\n   * Clearing subscription\r\n   */\r\n  clearSubscriptions() {\r\n    super.clearSubscriptions();\r\n    this.clearLocalSubscriptions();\r\n  }\r\n\r\n  private getData({ gridEl, dataEl, data }: StaticData): ColumnDragEventData {\r\n    const gridRect = gridEl.getBoundingClientRect();\r\n    const elRect = dataEl.getBoundingClientRect();\r\n    const scrollOffset = elRect.left - gridRect.left;\r\n    return {\r\n      elRect,\r\n      gridRect,\r\n      type: data.pin || 'rgCol',\r\n      scrollOffset,\r\n    };\r\n  }\r\n  private getDimension(type: MultiDimensionType) {\r\n    return this.providers.dimension.stores[type].getCurrentState();\r\n  }\r\n}\r\n\r\nexport function getLeftRelative(\r\n  absoluteX: number,\r\n  gridPos: number,\r\n  offset: number,\r\n): number {\r\n  return absoluteX - gridPos - offset;\r\n}\r\n"]}

package/dist/collection/plugins/moveColumn/order-column.handler.js

@@ -0,0 +1,71 @@
+/*!
+ * Built by LevelSkill.Pro
+ */
+const COLUMN_DRAG_CLASS = 'column-drag-start';
+export class ColumnOrderHandler {
+    constructor() {
+        this.offset = 0;
+    }
+    renderAutoscroll(_, parent) {
+        if (!parent) {
+            return;
+        }
+        this.autoscrollEl = document.createElement('div');
+        this.autoscrollEl.classList.add('drag-auto-scroll-y');
+        parent.appendChild(this.autoscrollEl);
+    }
+    autoscroll(pos, dataContainerSize, direction = 'translateX') {
+        if (!this.autoscrollEl) {
+            return;
+        }
+        const helperOffset = 10;
+        // calculate current y position inside of the grid active holder
+        // 3 - size of element + border
+        const maxScroll = Math.min(pos + helperOffset, dataContainerSize - 3);
+        this.autoscrollEl.style.transform = `${direction}(${maxScroll}px)`;
+        this.autoscrollEl.scrollIntoView({
+            block: 'nearest',
+            inline: 'nearest',
+        });
+    }
+    start(e, { dataEl, gridRect, scrollEl, gridEl, }, dir = 'left') {
+        gridEl.classList.add(COLUMN_DRAG_CLASS);
+        const scrollContainerRect = scrollEl.getBoundingClientRect();
+        if (scrollContainerRect) {
+            this.offset = scrollContainerRect[dir] - gridRect[dir];
+        }
+        this.renderAutoscroll(e, dataEl);
+    }
+    stop(gridEl) {
+        var _a;
+        gridEl.classList.remove(COLUMN_DRAG_CLASS);
+        if (this.element) {
+            this.element.hidden = true;
+        }
+        this.offset = 0;
+        (_a = this.autoscrollEl) === null || _a === void 0 ? void 0 : _a.remove();
+        this.autoscrollEl = undefined;
+    }
+    showHandler(pos, size, columnWidth, direction = 'translateX') {
+        if (!this.element) {
+            return;
+        }
+        // do not allow overcross top of the scrollable area, header excluded
+        if (this.offset) {
+            pos = Math.max(pos, this.offset);
+        }
+        // can not be bigger then grid end
+        pos = Math.min(pos, size);
+        this.element.style.transform = `${direction}(${pos}px)`;
+        this.element.style.width = `${columnWidth}px`;
+        this.element.style.opacity = `10%`;
+        this.element.hidden = false;
+    }
+    render() {
+        const el = (this.element = document.createElement('div'));
+        el.classList.add('drag-position-y');
+        el.hidden = true;
+        return el;
+    }
+}
+//# sourceMappingURL=order-column.handler.js.map

package/dist/collection/plugins/moveColumn/order-column.handler.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"order-column.handler.js","sourceRoot":"","sources":["../../../src/plugins/moveColumn/order-column.handler.tsx"],"names":[],"mappings":"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","sourcesContent":["const COLUMN_DRAG_CLASS = 'column-drag-start';\r\n\r\nexport class ColumnOrderHandler {\r\n  private element?: HTMLDivElement;\r\n  private autoscrollEl?: HTMLElement;\r\n  private offset = 0;\r\n\r\n  renderAutoscroll(_: MouseEvent, parent: HTMLElement | null) {\r\n    if (!parent) {\r\n      return;\r\n    }\r\n    this.autoscrollEl = document.createElement('div');\r\n    this.autoscrollEl.classList.add('drag-auto-scroll-y');\r\n    parent.appendChild(this.autoscrollEl);\r\n  }\r\n\r\n  autoscroll(pos: number, dataContainerSize: number, direction = 'translateX') {\r\n    if (!this.autoscrollEl) {\r\n      return;\r\n    }\r\n    const helperOffset = 10;\r\n    // calculate current y position inside of the grid active holder\r\n    // 3 - size of element + border\r\n    const maxScroll = Math.min(pos + helperOffset, dataContainerSize - 3);\r\n\r\n    this.autoscrollEl.style.transform = `${direction}(${maxScroll}px)`;\r\n    this.autoscrollEl.scrollIntoView({\r\n      block: 'nearest',\r\n      inline: 'nearest',\r\n    });\r\n  }\r\n\r\n  start(\r\n    e: MouseEvent,\r\n    {\r\n      dataEl,\r\n      gridRect,\r\n      scrollEl,\r\n      gridEl,\r\n    }: {\r\n      dataEl: HTMLElement;\r\n      gridRect: DOMRect;\r\n      scrollEl: Element;\r\n      gridEl: Element;\r\n    },\r\n    dir: 'top' | 'left' = 'left',\r\n  ) {\r\n    gridEl.classList.add(COLUMN_DRAG_CLASS);\r\n    const scrollContainerRect = scrollEl.getBoundingClientRect();\r\n    if (scrollContainerRect) {\r\n      this.offset = scrollContainerRect[dir] - gridRect[dir];\r\n    }\r\n    this.renderAutoscroll(e, dataEl);\r\n  }\r\n\r\n  stop(gridEl: Element) {\r\n    gridEl.classList.remove(COLUMN_DRAG_CLASS);\r\n    if (this.element) {\r\n      this.element.hidden = true;\r\n    }\r\n    this.offset = 0;\r\n    this.autoscrollEl?.remove();\r\n    this.autoscrollEl = undefined;\r\n  }\r\n\r\n  showHandler(\r\n    pos: number,\r\n    size: number,\r\n    columnWidth: number,\r\n    direction = 'translateX',\r\n  ) {\r\n    if (!this.element) {\r\n      return;\r\n    }\r\n    // do not allow overcross top of the scrollable area, header excluded\r\n    if (this.offset) {\r\n      pos = Math.max(pos, this.offset);\r\n    }\r\n    // can not be bigger then grid end\r\n    pos = Math.min(pos, size);\r\n    this.element.style.transform = `${direction}(${pos}px)`;\r\n    this.element.style.width = `${columnWidth}px`;\r\n    this.element.style.opacity = `10%`;\r\n    this.element.hidden = false;\r\n  }\r\n\r\n  render() {\r\n    const el = (this.element = document.createElement('div'));\r\n    el.classList.add('drag-position-y');\r\n    el.hidden = true;\r\n    return el;\r\n  }\r\n}\r\n"]}