@revolist/revogrid 4.0.4-next → 4.0.4

package/dist/collection/plugins/sorting/sorting.plugin.js

@@ -1,178 +1,233 @@
-import size from 'lodash/size';
-import { setStore } from '../../utils/store.utils';
-import ColumnDataProvider from '../../services/column.data.provider';
-import BasePlugin from '../basePlugin';
+/*!
+ * Built by Revolist OU ❤️
+ */
+import size from "lodash/size";
+import debounce from "lodash/debounce";
+import range from "lodash/range";
+import { setStore } from "../../utils/store.utils";
+import ColumnDataProvider from "../../services/column.data.provider";
+import { BasePlugin } from "../base.plugin";
 /**
- * lifecycle
- * 1) @event beforesorting - sorting just started, nothing happened yet
- * 2) @metod updateColumnSorting - column sorting icon applied to grid and column get updated, data still untiuched
- * 3) @event beforesortingapply - before we applied sorting data to data source, you can prevent data apply from here
- * 4) @event afterSortingApply - sorting applied, just finished event
+ * Lifecycle
+ * 1. @event `beforesorting` - Triggered when sorting just starts. Nothing has happened yet. This can be triggered from a column or from the source. If the type is from rows, the column will be undefined.
+ * 2. @method `updateColumnSorting` - Updates the column sorting icon on the grid and the column itself, but the data remains untouched.
+ * 3. @event `beforesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted. This event is only called from a column sorting click.
+ * 4. @event `aftersortingapply` - Triggered after sorting has been applied and completed. This event occurs for both row and column sorting.
  *
- * If you prevent event it'll not reach farther steps
+ * Note: If you prevent an event, it will not proceed to the subsequent steps.
  */
 export default class SortingPlugin extends BasePlugin {
-  constructor(revogrid) {
-    super(revogrid);
-    this.revogrid = revogrid;
-    this.sorting = null;
-    this.sortingFunc = null;
-    const beforesourceset = ({ detail }) => {
-      if (this.hasSorting) {
-        // is sorting allowed
-        const event = this.emit('beforesourcesortingapply');
-        // sorting prevented
-        if (event.defaultPrevented) {
-          return;
-        }
-      }
-      const data = this.setData(detail.source, detail.type);
-      if (data) {
-        detail.source = data;
-      }
-    };
-    const aftercolumnsset = async ({ detail: { order } }) => {
-      const columns = await this.revogrid.getColumns();
-      const sortingFunc = {};
-      for (let prop in order) {
-        const column = ColumnDataProvider.getColumnByProp(columns, prop);
-        const cmp = (column === null || column === void 0 ? void 0 : column.cellCompare) || this.defaultCellCompare;
-        sortingFunc[prop] = order[prop] == 'desc' ? this.descCellCompare(cmp) : cmp;
-      }
-      this.sort(order, sortingFunc);
-    };
-    const headerclick = async (e) => {
-      var _a, _b;
-      if (e.defaultPrevented) {
-        return;
-      }
-      if (!e.detail.column.sortable) {
-        return;
-      }
-      this.headerclick(e.detail.column, e.detail.index, (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.originalEvent) === null || _b === void 0 ? void 0 : _b.shiftKey);
-    };
-    this.addEventListener('beforesourceset', beforesourceset);
-    this.addEventListener('aftercolumnsset', aftercolumnsset);
-    this.addEventListener('initialHeaderClick', headerclick);
-  }
-  get hasSorting() {
-    return !!this.sorting;
-  }
-  async headerclick(column, index, additive) {
-    let order = this.getNextOrder(column.order);
-    const beforeEvent = this.emit('beforesorting', { column, order, additive });
-    if (beforeEvent.defaultPrevented) {
-      return;
+    async runSorting(order, comparison) {
+        var _a;
+        await this.sort(order, comparison);
+        (_a = this.sortingPromise) === null || _a === void 0 ? void 0 : _a.call(this);
+        this.sortingPromise = null;
     }
-    order = beforeEvent.detail.order;
-    const newCol = await this.revogrid.updateColumnSorting(beforeEvent.detail.column, index, order, additive);
-    // apply sort data
-    const beforeApplyEvent = this.emit('beforesortingapply', { column: newCol, order, additive });
-    if (beforeApplyEvent.defaultPrevented) {
-      return;
+    constructor(revogrid, providers) {
+        super(revogrid, providers);
+        this.revogrid = revogrid;
+        // sorting order per column
+        this.sorting = null;
+        // sorting function per column, multiple columns sorting supported
+        this.sortingFunc = null;
+        this.sortingPromise = null;
+        this.postponeSort = debounce(async (order, comparison) => this.runSorting(order, comparison), 50);
+        const beforeanysource = async ({ detail: { type, }, }) => {
+            // if sorting was provided - sort data
+            if (!!this.sorting && this.sortingFunc) {
+                const beforeEvent = this.emit('beforesorting', { type });
+                if (beforeEvent.defaultPrevented) {
+                    return;
+                }
+                this.startSorting(this.sorting, this.sortingFunc);
+            }
+        };
+        const aftercolumnsset = async ({ detail: { order }, }) => {
+            const columns = await this.revogrid.getColumns();
+            const sortingFunc = {};
+            for (let prop in order) {
+                const cmp = this.getComparer(ColumnDataProvider.getColumnByProp(columns, prop), order[prop]);
+                sortingFunc[prop] = cmp;
+            }
+            this.runSorting(order, sortingFunc);
+        };
+        const headerclick = async (e) => {
+            var _a, _b;
+            if (e.defaultPrevented) {
+                return;
+            }
+            if (!e.detail.column.sortable) {
+                return;
+            }
+            this.headerclick(e.detail.column, e.detail.index, (_b = (_a = e.detail) === null || _a === void 0 ? void 0 : _a.originalEvent) === null || _b === void 0 ? void 0 : _b.shiftKey);
+        };
+        this.addEventListener('beforeanysource', beforeanysource);
+        this.addEventListener('aftercolumnsset', aftercolumnsset);
+        this.addEventListener('beforeheaderclick', headerclick);
     }
-    order = beforeApplyEvent.detail.order;
-    const cellCmp = (column === null || column === void 0 ? void 0 : column.cellCompare) || this.defaultCellCompare;
-    const cmp = order == 'asc' ? cellCmp : order == 'desc' ? this.descCellCompare(cellCmp) : undefined;
-    if (additive && this.sorting) {
-      const sorting = {};
-      const sortingFunc = {};
-      Object.assign(sorting, this.sorting);
-      Object.assign(sortingFunc, this.sortingFunc);
-      if (column.prop in sorting && size(sorting) > 1 && order === undefined) {
-        delete sorting[column.prop];
-        delete sortingFunc[column.prop];
-      }
-      else {
-        sorting[column.prop] = order;
-        sortingFunc[column.prop] = cmp;
-      }
-      this.sort(sorting, sortingFunc);
+    startSorting(order, sortingFunc) {
+        if (!this.sortingPromise) {
+            this.revogrid.jobsBeforeRender.push(new Promise((resolve) => {
+                this.sortingPromise = resolve;
+            }));
+        }
+        this.postponeSort(order, sortingFunc);
     }
-    else {
-      this.sort({ [column.prop]: order }, { [column.prop]: cmp });
+    getComparer(column, order) {
+        var _a;
+        const cellCmp = ((_a = column === null || column === void 0 ? void 0 : column.cellCompare) === null || _a === void 0 ? void 0 : _a.bind({ order })) || this.defaultCellCompare;
+        if (order == 'asc') {
+            return cellCmp;
+        }
+        if (order == 'desc') {
+            return this.descCellCompare(cellCmp);
+        }
+        return undefined;
     }
-  }
-  setData(data, type) {
-    // sorting available for rgRow type only
-    if (type === 'rgRow' && this.sortingFunc) {
-      return this.sortItems(data, this.sortingFunc);
+    /**
+     * Apply sorting to data on header click
+     * If additive - add to existing sorting, multiple columns can be sorted
+     */
+    async headerclick(column, index, additive) {
+        let order = this.getNextOrder(column.order);
+        const beforeEvent = this.emit('beforesorting', { column, order, additive });
+        if (beforeEvent.defaultPrevented) {
+            return;
+        }
+        order = beforeEvent.detail.order;
+        const newCol = await this.revogrid.updateColumnSorting(beforeEvent.detail.column, index, order, additive);
+        // apply sort data
+        const beforeApplyEvent = this.emit('beforesortingapply', {
+            column: newCol,
+            order,
+            additive,
+        });
+        if (beforeApplyEvent.defaultPrevented) {
+            return;
+        }
+        order = beforeApplyEvent.detail.order;
+        const cmp = this.getComparer(column, order);
+        if (additive && this.sorting) {
+            const sorting = {};
+            const sortingFunc = {};
+            this.sorting = Object.assign(Object.assign({}, this.sorting), sorting);
+            // extend sorting function with new sorting for multiple columns sorting
+            this.sortingFunc = Object.assign(Object.assign({}, this.sortingFunc), sortingFunc);
+            if (column.prop in sorting && size(sorting) > 1 && order === undefined) {
+                delete sorting[column.prop];
+                delete sortingFunc[column.prop];
+            }
+            else {
+                sorting[column.prop] = order;
+                sortingFunc[column.prop] = cmp;
+            }
+        }
+        else {
+            if (order) {
+                // reset sorting
+                this.sorting = { [column.prop]: order };
+                this.sortingFunc = { [column.prop]: cmp };
+            }
+            else {
+                delete this.sorting[column.prop];
+                delete this.sortingFunc[column.prop];
+            }
+        }
+        this.startSorting(this.sorting, this.sortingFunc);
     }
-  }
-  /**
-   * Sorting apply, available for rgRow type only
-   * @param sorting - per column sorting
-   * @param data - this.stores['rgRow'].store.get('source')
-   */
-  async sort(sorting, sortingFunc) {
-    if (!size(sorting)) {
-      this.sorting = null;
-      this.sortingFunc = null;
-      return;
+    /**
+     * Sort items by sorting function
+     * @requires proxyItems applied to row store
+     * @requires source applied to row store
+     *
+     * @param sorting - per column sorting
+     * @param data - this.stores['rgRow'].store.get('source')
+     */
+    async sort(sorting, sortingFunc, types = ['rgRow', 'rowPinStart', 'rowPinEnd']) {
+        // if no sorting - reset
+        if (!size(sorting)) {
+            this.sorting = null;
+            this.sortingFunc = null;
+            for (let type of types) {
+                const store = await this.revogrid.getSourceStore(type);
+                // row data
+                const source = store.get('source');
+                // row indexes
+                const proxyItems = range(0, source.length);
+                setStore(store, {
+                    proxyItems,
+                    source: [...source],
+                });
+            }
+        }
+        else {
+            // set sorting
+            this.sorting = sorting;
+            this.sortingFunc = sortingFunc;
+            // by default it'll sort by rgRow store
+            // todo: support multiple stores
+            for (let type of types) {
+                const store = await this.revogrid.getSourceStore(type);
+                // row data
+                const source = store.get('source');
+                // row indexes
+                const proxyItems = store.get('proxyItems');
+                const data = this.sortIndexByItems([...proxyItems], source, sortingFunc);
+                setStore(store, {
+                    proxyItems: data,
+                    source: [...source],
+                });
+            }
+        }
+        this.emit('aftersortingapply');
     }
-    this.sorting = sorting;
-    this.sortingFunc = sortingFunc;
-    const store = await this.revogrid.getSourceStore();
-    const source = store.get('source');
-    const proxyItems = this.sortIndexByItems([...store.get('proxyItems')], source, this.sortingFunc);
-    setStore(store, {
-      proxyItems,
-      source: [...source],
-    });
-    this.emit('afterSortingApply');
-  }
-  defaultCellCompare(prop, a, b) {
-    var _a, _b;
-    const av = (_a = a[prop]) === null || _a === void 0 ? void 0 : _a.toString().toLowerCase();
-    const bv = (_b = b[prop]) === null || _b === void 0 ? void 0 : _b.toString().toLowerCase();
-    return av == bv ? 0 : av > bv ? 1 : -1;
-  }
-  descCellCompare(cmp) {
-    return (prop, a, b) => { return -1 * cmp(prop, a, b); };
-  }
-  sortIndexByItems(indexes, source, sortingFunc) {
-    // TODO - is there a situation where multiple kvps in the `sorting` object would cause this to break?
-    for (let prop in sortingFunc) {
-      if (typeof sortingFunc[prop] === 'undefined') {
-        // Unsort indexes
-        return [...Array(indexes.length).keys()];
-      }
+    defaultCellCompare(prop, a, b) {
+        var _a, _b;
+        const av = (_a = a[prop]) === null || _a === void 0 ? void 0 : _a.toString().toLowerCase();
+        const bv = (_b = b[prop]) === null || _b === void 0 ? void 0 : _b.toString().toLowerCase();
+        return av == bv ? 0 : av > bv ? 1 : -1;
     }
-    return indexes.sort((a, b) => {
-      let sorted = 0;
-      for (let prop in sortingFunc) {
-        const cmp = sortingFunc[prop];
-        const itemA = source[a];
-        const itemB = source[b];
-        sorted = cmp(prop, itemA, itemB);
-        if (sorted) {
-          break;
+    descCellCompare(cmp) {
+        return (prop, a, b) => {
+            return -1 * cmp(prop, a, b);
+        };
+    }
+    sortIndexByItems(indexes, source, sortingFunc) {
+        // if no sorting - return unsorted indexes
+        if (Object.entries(sortingFunc).length === 0) {
+            // Unsort indexes
+            return [...Array(indexes.length).keys()];
         }
-      }
-      return sorted;
-    });
-  }
-  sortItems(source, sortingFunc) {
-    return source.sort((a, b) => {
-      let sorted = 0;
-      for (let prop in sortingFunc) {
-        const cmp = sortingFunc[prop];
-        sorted = cmp(prop, a, b);
-        if (sorted) {
-          break;
+        //
+        /**
+         * go through all indexes and align in new order
+         * performs a multi-level sorting by applying multiple comparison functions to determine the order of the items based on different properties.
+         */
+        return indexes.sort((a, b) => {
+            for (const [prop, cmp] of Object.entries(sortingFunc)) {
+                const itemA = source[a];
+                const itemB = source[b];
+                /**
+                 * If the comparison function returns a non-zero value (sorted), it means that the items should be sorted based on the given property. In such a case, the function immediately returns the sorted value, indicating the order in which the items should be arranged.
+                 * If none of the comparison functions result in a non-zero value, indicating that the items are equal or should remain in the same order, the function eventually returns 0.
+                 */
+                const sorted = cmp(prop, itemA, itemB);
+                if (sorted) {
+                    return sorted;
+                }
+            }
+            return 0;
+        });
+    }
+    getNextOrder(currentOrder) {
+        switch (currentOrder) {
+            case undefined:
+                return 'asc';
+            case 'asc':
+                return 'desc';
+            case 'desc':
+                return undefined;
         }
-      }
-      return sorted;
-    });
-  }
-  getNextOrder(currentOrder) {
-    switch (currentOrder) {
-      case undefined:
-        return 'asc';
-      case 'asc':
-        return 'desc';
-      case 'desc':
-        return undefined;
     }
-  }
 }
+//# sourceMappingURL=sorting.plugin.js.map

package/dist/collection/plugins/sorting/sorting.plugin.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sorting.plugin.js","sourceRoot":"","sources":["../../../src/plugins/sorting/sorting.plugin.ts"],"names":[],"mappings":"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","sourcesContent":["import size from 'lodash/size';\nimport debounce from 'lodash/debounce';\nimport range from 'lodash/range';\n\nimport { setStore } from '../../utils/store.utils';\nimport ColumnDataProvider from '../../services/column.data.provider';\nimport { BasePlugin } from '../base.plugin';\nimport {\n  ColumnProp,\n  Order,\n  CellCompareFunc,\n  ColumnRegular,\n  InitialHeaderClick,\n  DataType,\n} from '../..';\nimport { DimensionRows } from '../..';\nimport { PluginProviders } from '../../';\n\nexport type SortingOrder = Record<ColumnProp, Order>;\ntype SortingOrderFunction = Record<ColumnProp, CellCompareFunc | undefined>;\ntype ColumnSetEvent = {\n  order: SortingOrder;\n};\n\n/**\n * Lifecycle\n * 1. @event `beforesorting` - Triggered when sorting just starts. Nothing has happened yet. This can be triggered from a column or from the source. If the type is from rows, the column will be undefined.\n * 2. @method `updateColumnSorting` - Updates the column sorting icon on the grid and the column itself, but the data remains untouched.\n * 3. @event `beforesortingapply` - Triggered before the sorting data is applied to the data source. You can prevent this event, and the data will not be sorted. This event is only called from a column sorting click.\n * 4. @event `aftersortingapply` - Triggered after sorting has been applied and completed. This event occurs for both row and column sorting.\n *\n * Note: If you prevent an event, it will not proceed to the subsequent steps.\n */\n\nexport default class SortingPlugin extends BasePlugin {\n  // sorting order per column\n  private sorting: SortingOrder | null = null;\n\n  // sorting function per column, multiple columns sorting supported\n  private sortingFunc: SortingOrderFunction | null = null;\n  private sortingPromise: (() => void) | null = null;\n  private postponeSort = debounce(\n    async (order: SortingOrder, comparison: SortingOrderFunction) => this.runSorting(order, comparison),\n    50,\n  );\n\n  private async runSorting(order: SortingOrder, comparison: SortingOrderFunction) {\n    await this.sort(order, comparison);\n    this.sortingPromise?.();\n    this.sortingPromise = null;\n  }\n\n  constructor(\n    protected revogrid: HTMLRevoGridElement,\n    providers: PluginProviders,\n  ) {\n    super(revogrid, providers);\n\n    const beforeanysource = async ({\n      detail: { type, },\n    }: CustomEvent<{\n      type: DimensionRows;\n      source: any[];\n    }>) => {\n      // if sorting was provided - sort data\n      if (!!this.sorting && this.sortingFunc) {\n        const beforeEvent = this.emit('beforesorting', { type });\n        if (beforeEvent.defaultPrevented) {\n          return;\n        }\n        this.startSorting(this.sorting, this.sortingFunc);\n      }\n    };\n    const aftercolumnsset = async ({\n      detail: { order },\n    }: CustomEvent<ColumnSetEvent>) => {\n      const columns = await this.revogrid.getColumns();\n      const sortingFunc: SortingOrderFunction = {};\n\n      for (let prop in order) {\n        const cmp = this.getComparer(\n          ColumnDataProvider.getColumnByProp(columns, prop),\n          order[prop],\n        );\n        sortingFunc[prop] = cmp;\n      }\n      this.runSorting(order, sortingFunc);\n    };\n    const headerclick = async (e: CustomEvent<InitialHeaderClick>) => {\n      if (e.defaultPrevented) {\n        return;\n      }\n\n      if (!e.detail.column.sortable) {\n        return;\n      }\n\n      this.headerclick(\n        e.detail.column,\n        e.detail.index,\n        e.detail?.originalEvent?.shiftKey,\n      );\n    };\n\n    this.addEventListener('beforeanysource', beforeanysource);\n    this.addEventListener('aftercolumnsset', aftercolumnsset);\n    this.addEventListener('beforeheaderclick', headerclick);\n  }\n\n  private startSorting(order: SortingOrder, sortingFunc: SortingOrderFunction) {\n    if (!this.sortingPromise) {\n      this.revogrid.jobsBeforeRender.push(new Promise<void>((resolve) => {\n        this.sortingPromise = resolve;\n      }));\n    }\n    this.postponeSort(order, sortingFunc);\n  }\n\n  private getComparer(column: ColumnRegular, order: Order): CellCompareFunc {\n    const cellCmp: CellCompareFunc =\n      column?.cellCompare?.bind({ order }) || this.defaultCellCompare;\n    if (order == 'asc') {\n      return cellCmp;\n    }\n    if (order == 'desc') {\n      return this.descCellCompare(cellCmp);\n    }\n    return undefined;\n  }\n\n  /**\n   * Apply sorting to data on header click\n   * If additive - add to existing sorting, multiple columns can be sorted\n   */\n  async headerclick(column: ColumnRegular, index: number, additive: boolean) {\n    let order: Order = this.getNextOrder(column.order);\n    const beforeEvent = this.emit('beforesorting', { column, order, additive });\n    if (beforeEvent.defaultPrevented) {\n      return;\n    }\n    order = beforeEvent.detail.order;\n    const newCol = await this.revogrid.updateColumnSorting(\n      beforeEvent.detail.column,\n      index,\n      order,\n      additive,\n    );\n\n    // apply sort data\n    const beforeApplyEvent = this.emit('beforesortingapply', {\n      column: newCol,\n      order,\n      additive,\n    });\n    if (beforeApplyEvent.defaultPrevented) {\n      return;\n    }\n    order = beforeApplyEvent.detail.order;\n    const cmp = this.getComparer(column, order);\n\n    if (additive && this.sorting) {\n      const sorting: SortingOrder = {};\n      const sortingFunc: SortingOrderFunction = {};\n\n      this.sorting = {\n        ...this.sorting,\n        ...sorting,\n      };\n      // extend sorting function with new sorting for multiple columns sorting\n      this.sortingFunc = {\n        ...this.sortingFunc,\n        ...sortingFunc,\n      };\n\n      if (column.prop in sorting && size(sorting) > 1 && order === undefined) {\n        delete sorting[column.prop];\n        delete sortingFunc[column.prop];\n      } else {\n        sorting[column.prop] = order;\n        sortingFunc[column.prop] = cmp;\n      }\n    } else {\n      if (order) {\n        // reset sorting\n        this.sorting = { [column.prop]: order };\n        this.sortingFunc = { [column.prop]: cmp };\n      } else {\n        delete this.sorting[column.prop];\n        delete this.sortingFunc[column.prop];\n      }\n    }\n\n    this.startSorting(this.sorting, this.sortingFunc);\n  }\n\n  /**\n   * Sort items by sorting function\n   * @requires proxyItems applied to row store\n   * @requires source applied to row store\n   *\n   * @param sorting - per column sorting\n   * @param data - this.stores['rgRow'].store.get('source')\n   */\n  async sort(\n    sorting: SortingOrder,\n    sortingFunc: SortingOrderFunction,\n    types: DimensionRows[] = ['rgRow', 'rowPinStart', 'rowPinEnd'],\n  ) {\n    // if no sorting - reset\n    if (!size(sorting)) {\n      this.sorting = null;\n      this.sortingFunc = null;\n\n      for (let type of types) {\n        const store = await this.revogrid.getSourceStore(type);\n        // row data\n        const source = store.get('source');\n        // row indexes\n        const proxyItems = range(0, source.length);\n        setStore(store, {\n          proxyItems,\n          source: [...source],\n        });\n      }\n    } else {\n      // set sorting\n      this.sorting = sorting;\n      this.sortingFunc = sortingFunc;\n\n      // by default it'll sort by rgRow store\n      // todo: support multiple stores\n      for (let type of types) {\n        const store = await this.revogrid.getSourceStore(type);\n        // row data\n        const source = store.get('source');\n        // row indexes\n        const proxyItems = store.get('proxyItems');\n        const data = this.sortIndexByItems(\n          [...proxyItems],\n          source,\n          sortingFunc,\n        );\n        setStore(store, {\n          proxyItems: data,\n          source: [...source],\n        });\n      }\n    }\n    this.emit('aftersortingapply');\n  }\n\n  defaultCellCompare(prop: ColumnProp, a: DataType, b: DataType) {\n    const av = a[prop]?.toString().toLowerCase();\n    const bv = b[prop]?.toString().toLowerCase();\n\n    return av == bv ? 0 : av > bv ? 1 : -1;\n  }\n\n  descCellCompare(cmp: CellCompareFunc) {\n    return (prop: ColumnProp, a: DataType, b: DataType): number => {\n      return -1 * cmp(prop, a, b);\n    };\n  }\n\n  sortIndexByItems(\n    indexes: number[],\n    source: DataType[],\n    sortingFunc: SortingOrderFunction,\n  ): number[] {\n    // if no sorting - return unsorted indexes\n    if (Object.entries(sortingFunc).length === 0) {\n      // Unsort indexes\n      return [...Array(indexes.length).keys()];\n    }\n    //\n    /**\n     * go through all indexes and align in new order\n     * performs a multi-level sorting by applying multiple comparison functions to determine the order of the items based on different properties.\n     */\n    return indexes.sort((a, b) => {\n      for (const [prop, cmp] of Object.entries(sortingFunc)) {\n        const itemA = source[a];\n        const itemB = source[b];\n\n        /**\n         * If the comparison function returns a non-zero value (sorted), it means that the items should be sorted based on the given property. In such a case, the function immediately returns the sorted value, indicating the order in which the items should be arranged.\n         * If none of the comparison functions result in a non-zero value, indicating that the items are equal or should remain in the same order, the function eventually returns 0.\n         */\n        const sorted = cmp(prop, itemA, itemB);\n        if (sorted) {\n          return sorted;\n        }\n      }\n      return 0;\n    });\n  }\n\n  getNextOrder(currentOrder: Order): Order {\n    switch (currentOrder) {\n      case undefined:\n        return 'asc';\n      case 'asc':\n        return 'desc';\n      case 'desc':\n        return undefined;\n    }\n  }\n}\n"]}

package/dist/collection/plugins/sorting/sorting.sign.js

@@ -1,6 +1,10 @@
-import { h } from '@stencil/core';
+/*!
+ * Built by Revolist OU ❤️
+ */
+import { h } from "@stencil/core";
 export const FILTER_BUTTON_CLASS = 'rv-filter';
 export const FILTER_BUTTON_ACTIVE = 'active';
 export const SortingSign = ({ column }) => {
-  return h("i", { class: column.order });
+    return h("i", { class: column.order });
 };
+//# sourceMappingURL=sorting.sign.js.map

package/dist/collection/plugins/sorting/sorting.sign.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"sorting.sign.js","sourceRoot":"","sources":["../../../src/plugins/sorting/sorting.sign.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,CAAC,EAAE,MAAM,eAAe,CAAC;AAGlC,MAAM,CAAC,MAAM,mBAAmB,GAAG,WAAW,CAAC;AAC/C,MAAM,CAAC,MAAM,oBAAoB,GAAG,QAAQ,CAAC;AAK7C,MAAM,CAAC,MAAM,WAAW,GAAG,CAAC,EAAE,MAAM,EAAS,EAAE,EAAE;IAC/C,OAAO,SAAG,KAAK,EAAE,MAAM,CAAC,KAAK,GAAI,CAAC;AACpC,CAAC,CAAC","sourcesContent":["import { h } from '@stencil/core';\nimport { ColumnRegular } from '../../types/interfaces';\n\nexport const FILTER_BUTTON_CLASS = 'rv-filter';\nexport const FILTER_BUTTON_ACTIVE = 'active';\n\ntype Props = {\n  column: ColumnRegular;\n};\nexport const SortingSign = ({ column }: Props) => {\n  return <i class={column.order} />;\n};\n"]}