js-spread-grid 0.0.50 → 0.0.53

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "js-spread-grid",
-    "version": "0.0.50",
+    "version": "0.0.53",
     "description": "Fast grid for js applications",
     "author": "Tomasz Rewak <tomasz.rewak@gmail.com>",
     "license": "MIT",

package/src/core/state.js

@@ -120,7 +120,7 @@ function updateStateInternal(context) {
     const selection = cache('selection', getSelection, [selectedCells]);
     const highlight = cache('highlight', getSelection, [highlightedCells]);
     // TODO: addDataFormattingRules and addRenderFormattingRules should remove unnecessary rules
-    const renderFormatting = cache('renderFormatting', getRenderFormatting, [dataFormatting, hoveredCell, focusedCell, selection, highlight, edition, resizableColumn, resizableRow, options.borderWidth]);
+    const renderFormatting = cache('renderFormatting', getRenderFormatting, [dataFormatting, hoveredCell, focusedCell, selection, highlight, edition, sortBy, resizableColumn, resizableRow, options.borderWidth]);
     const renderFormattingRules = cache('renderFormattingRules', getFormattingRules, [renderFormatting]);
     const renderFormatResolver = cache('renderFormatResolver', getFormatResolver, [renderFormattingRules, data, rows, columns, edition]);
     const inputFormatting = cache('inputFormatting', getInputFormatting, [dataFormatting]);

package/src/state-utils/getNewSortBy.js

@@ -10,13 +10,23 @@ export default function getNewSortBy(sortBy, column, row, ctrlKey) {
         return column.key === stringifyId(columnId) && row.key === stringifyId(rowId);
     }
 
+    function isConflictingWithCurrentRule(rule) {
+        const columnId = 'columnId' in rule ? rule.columnId : 'HEADER';
+        const rowId = 'rowId' in rule ? rule.rowId : 'HEADER';
+
+        return column.type === 'HEADER' && column.key === stringifyId(columnId)
+            || row.type === 'HEADER' && row.key === stringifyId(rowId);
+    }
+
     const directionLoop = ['ASC', 'DESC', undefined];
     const currentRule = sortBy.find(isCurrentRule);
     const directionIndex = directionLoop.indexOf(currentRule?.direction);
     const newDirection = directionLoop[(directionIndex + 1) % directionLoop.length];
     const isLastRule = sortBy.indexOf(currentRule) === sortBy.length - 1;
     const shouldKeepOld = ctrlKey && (isLastRule || !currentRule);
-    const rulesToKeep = shouldKeepOld ? sortBy.filter(rule => !isCurrentRule(rule)) : [];
+    const rulesToKeep = shouldKeepOld
+        ? sortBy.filter(rule => !isCurrentRule(rule))
+        : sortBy.filter(rule => !isConflictingWithCurrentRule(rule));
     const newRules = newDirection ? [{ columnId: column.id, rowId: row.id, direction: newDirection }] : [];
 
     return [...rulesToKeep, ...newRules];

package/src/state-utils/getRenderFormatting.js

@@ -7,7 +7,7 @@ function getHighlightColor(baseColor, isStrong) {
         return baseColor + '33';
 }
 
-export default function getRenderFormatting(formatting, hoveredCell, focusedCell, selection, highlight, edition, resizableColumn, resizableRow, borderWidth) {
+export default function getRenderFormatting(formatting, hoveredCell, focusedCell, selection, highlight, edition, sortBy, resizableColumn, resizableRow, borderWidth) {
     const focusedColumnKey = focusedCell ? stringifyId(focusedCell.columnId) : null;
     const focusedRowKey = focusedCell ? stringifyId(focusedCell.rowId) : null;
     const isResizingColumn = resizableColumn !== null;
@@ -103,6 +103,11 @@ export default function getRenderFormatting(formatting, hoveredCell, focusedCell
             row: { id: focusedCell?.rowId },
             style: { highlight: '#ffffffaa' }
         }),
+        ...sortBy.map(({ columnId, rowId, direction }, index) => ({
+            column: { id: columnId },
+            row: { id: rowId },
+            style: { highlight: '#0377fc44' }
+        })),
         {
             column: { type: 'ANY' },
             row: { type: 'ANY' },

package/src/types/FormattingRules.js

@@ -32,6 +32,16 @@ function getText(context) {
     return '';
 }
 
+function getEdit(rule, context) {
+    if (rule.edit === false)
+        return undefined;
+    if (rule.edit === true)
+        return 'edit' in context ? context.edit : defaultEdit;
+    if ('edit' in context)
+        return { ...context.edit, ...rule.edit };
+    return { ...defaultEdit, ...rule.edit };
+}
+
 // TODO: Rename to FormatResolver
 // TODO: Optimize by not searching using keys that don't have correlated type rules
 // TODO: Accept both a function and an object as a style (where the object is a resolved style)
@@ -96,7 +106,7 @@ export default class FormattingRules {
             if ('padding' in rule)
                 padding = { ...padding, ...rule.padding(context) };
             if ('edit' in rule)
-                context = { ...context, edit: rule.edit && 'edit' in context ? { ...context.edit, ...rule.edit } : { ...defaultEdit, ...rule.edit } };
+                context = { ...context, edit: getEdit(rule, context) };
             if ('draw' in rule) {
                 const currentContext = context;
                 draw = (ctx) => rule.draw({ ...currentContext, ctx });
@@ -116,7 +126,7 @@ export default class FormattingRules {
 
         if ('value' in context)
             result.value = context.value;
-        if ('edit' in context)
+        if ('edit' in context && context.edit !== undefined)
             result.edit = context.edit;
         if (draw !== undefined)
             result.draw = draw;

package/src/types/SortingRules.js

@@ -1,7 +1,5 @@
 import RulesLookup from "./RulesLookup.js";
-
-// const defaultComparatorAsc = (lhs, rhs) => lhs.value < rhs.value;
-// const defaultComparatorDesc = (lhs, rhs) => lhs.value > rhs.value;
+import stringifyId from "../core-utils/stringifyId.js";
 
 function defaultComparatorAsc(lhs, rhs) {
     if (lhs.value == undefined)
@@ -24,10 +22,17 @@ export default class SortingRules {
         this.rulesLookup = new RulesLookup();
 
         for (const rule of rules) {
+            const comparatorAsc = rule.comparator
+                ? (lhs, rhs) => rule.comparator(lhs, rhs)
+                : (lhs, rhs) => defaultComparatorAsc(lhs, rhs);
+            const comparatorDesc = rule.comparator
+                ? (lhs, rhs) => !rule.comparator(lhs, rhs)
+                : (lhs, rhs) => defaultComparatorDesc(lhs, rhs);
+
             const entry = {
                 by: stringifyId('by' in rule ? rule.by : 'HEADER'),
-                comparatorAsc: rule.comparator || defaultComparatorAsc,
-                comparatorDesc: (lhs, rhs) => -rule.comparator(lhs, rhs) || defaultComparatorDesc
+                comparatorAsc: comparatorAsc,
+                comparatorDesc: comparatorDesc
             };
 
             this.rulesLookup.addRule(rule.column, rule.row, entry);
@@ -55,6 +60,9 @@ export default class SortingRules {
 
         const rule = rules[0];
 
+        if (!sortByLookup.has(rule.by))
+            return null;
+
         return sortByLookup.get(rule.by) === 'ASC'
             ? rule.comparatorAsc
             : rule.comparatorDesc;