@glideapps/glide-data-grid - npm Package Compare versions

Comparing version 3.0.0-rc3 to 3.0.0-rc4

dist/js/data-grid-overlay-editor/data-grid-overlay-editor.js

@@ -28,3 +28,3 @@ "use strict";
 
-var _markdownOverlayEditor = _interopRequireDefault(require("./private/markdown-overlay-editor"));
+var _markdownOverlayEditor = require("./private/markdown-overlay-editor");
 
@@ -192,4 +192,4 @@ var _numberOverlayEditor = _interopRequireDefault(require("./private/number-overlay-editor"));
     case _dataGridTypes.GridCellKind.Markdown:
-      editor = /*#__PURE__*/React.createElement(_markdownOverlayEditor.default, {
-        onFinishEditing: onFinishEditing,
+      editor = /*#__PURE__*/React.createElement(_markdownOverlayEditor.MarkdownOverlayEditor, {
+        onFinish: onClickOutside,
         targetRect: target,
@@ -196,0 +196,0 @@ readonly: targetValue.readonly === true,

dist/js/data-grid-overlay-editor/private/markdown-overlay-editor-style.js

@@ -8,6 +8,8 @@ "use strict";
 
+var _growingEntryStyle = require("../../growing-entry/growing-entry-style");
+
 var _styles = require("../../common/styles");
 
 function _templateObject() {
-  var data = _taggedTemplateLiteral(["\n    min-width: ", "px;\n    width: 100%;\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    position: relative;\n    color: ", ";\n\n    .edit-icon {\n        position: relative;\n        cursor: pointer;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n\n        color: ", ";\n\n        padding: 0;\n\n        height: 24px;\n        width: 24px;\n        flex-shrink: 0;\n\n        transition: all \"0.125s ease\";\n\n        border-radius: 6px;\n\n        > * {\n            width: 16px;\n            height: 16px;\n        }\n    }\n\n    .edit-hover {\n        :hover {\n            background-color: ", ";\n            transition: background-color 150ms;\n        }\n    }\n\n    .checkmark-hover {\n        :hover {\n            color: #ffffff;\n            background-color: ", ";\n        }\n    }\n\n    .md-edit-textarea {\n        position: relative;\n        top: 0px;\n        left: 0px;\n        width: 0px;\n        height: 0px;\n        margin-top: 25px;\n        opacity: 0;\n        padding: 0;\n    }\n\n    .ml-6 {\n        margin-left: 6px;\n    }\n"]);
+  var data = _taggedTemplateLiteral(["\n    min-width: ", "px;\n    width: 100%;\n    display: flex;\n    align-items: flex-start;\n    justify-content: space-between;\n    position: relative;\n    color: ", ";\n\n    ", " {\n        flex-shrink: 1;\n        min-width: 0;\n    }\n\n    .spacer {\n        flex: 1;\n    }\n\n    .edit-icon {\n        position: relative;\n        cursor: pointer;\n\n        display: flex;\n        justify-content: center;\n        align-items: center;\n\n        color: ", ";\n\n        padding: 0;\n\n        height: 24px;\n        width: 24px;\n        flex-shrink: 0;\n\n        transition: all \"0.125s ease\";\n\n        border-radius: 6px;\n\n        > * {\n            width: 16px;\n            height: 16px;\n        }\n    }\n\n    .edit-hover {\n        :hover {\n            background-color: ", ";\n            transition: background-color 150ms;\n        }\n    }\n\n    .checkmark-hover {\n        :hover {\n            color: #ffffff;\n            background-color: ", ";\n        }\n    }\n\n    .md-edit-textarea {\n        position: relative;\n        top: 0px;\n        left: 0px;\n        width: 0px;\n        height: 0px;\n        margin-top: 25px;\n        opacity: 0;\n        padding: 0;\n    }\n\n    .ml-6 {\n        margin-left: 6px;\n    }\n"]);
 
@@ -34,3 +36,3 @@ _templateObject = function _templateObject() {
   return p.theme.textDark;
-}, function (p) {
+}, _growingEntryStyle.GrowingEntryStyle, function (p) {
   return p.theme.accentColor;
@@ -37,0 +39,0 @@ }, function (p) {

dist/js/data-grid-overlay-editor/private/markdown-overlay-editor.js

@@ -8,3 +8,3 @@ "use strict";
 });
-exports.default = void 0;
+exports.MarkdownOverlayEditor = void 0;
 
@@ -47,3 +47,3 @@ var React = _interopRequireWildcard(require("react"));
       readonly = p.readonly,
-      onFinishEditing = p.onFinishEditing;
+      onFinish = p.onFinish;
 
@@ -73,6 +73,3 @@ var _React$useState = React.useState(markdown === "" || forceEditMode),
       className: "edit-icon checkmark-hover ".concat(addLeftPad),
-      onClick: function onClick() {
-        onEditClick();
-        onFinishEditing(undefined, [0, 1]);
-      }
+      onClick: onFinish
     }, /*#__PURE__*/React.createElement(_utils.Checkmark, null)));
@@ -86,6 +83,8 @@ }
     createNode: createNode
-  }), !readonly && /*#__PURE__*/React.createElement("div", {
+  }), !readonly && /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("div", {
+    className: "spacer"
+  }), /*#__PURE__*/React.createElement("div", {
     className: "edit-icon edit-hover ".concat(addLeftPad),
     onClick: onEditClick
-  }, /*#__PURE__*/React.createElement(_utils.EditPencil, null)), /*#__PURE__*/React.createElement("textarea", {
+  }, /*#__PURE__*/React.createElement(_utils.EditPencil, null))), /*#__PURE__*/React.createElement("textarea", {
     className: "md-edit-textarea",
@@ -97,3 +96,2 @@ autoFocus: true,
 
-var _default = MarkdownOverlayEditor;
-exports.default = _default;
+exports.MarkdownOverlayEditor = MarkdownOverlayEditor;

dist/js/data-grid/animation-manager.js

@@ -220,4 +220,6 @@ "use strict";
 
-      _this.callback(_this.getAnimatingItems());
+      var animating = _this.getAnimatingItems();
 
+      _this.callback(animating);
+
       _this.cleanUpLeavingElements();
@@ -224,0 +226,0 @@ }

dist/js/data-grid/data-grid-lib.js

@@ -229,3 +229,3 @@ "use strict";
     roundedRect(ctx, centerX - 9, centerY - 9, 18, 18, 4);
-    ctx.fillStyle = highlighted ? theme.accentColor : theme.textMedium;
+    ctx.fillStyle = highlighted ? theme.accentColor : theme.textLight;
     ctx.fill();
@@ -325,4 +325,4 @@ ctx.beginPath();
 function drawBoolean(ctx, theme, data, x, y, width, height, hoverAmount, highlighted, canEdit) {
-  var hoverEffect = 0.4;
-  ctx.globalAlpha = canEdit ? 1 - hoverEffect + hoverEffect * hoverAmount : 0.5;
+  var hoverEffect = 0.35;
+  ctx.globalAlpha = canEdit ? 1 - hoverEffect + hoverEffect * hoverAmount : 0.4;
   drawCheckbox(ctx, theme, data, x, y, width, height, highlighted);
@@ -465,3 +465,3 @@ ctx.globalAlpha = 1;
     ctx.beginPath();
-    ctx.fillStyle = theme.textDark;
+    ctx.fillStyle = theme.textBubble;
     ctx.fillText(d.text, drawX, y + height / 2 + 4);
@@ -468,0 +468,0 @@ });

dist/js/data-grid/data-grid-render.js

@@ -225,2 +225,9 @@ "use strict";
   var verticalOnly = arguments.length > 12 && arguments[12] !== undefined ? arguments[12] : false;
+  ctx.beginPath(); // we need to under-draw the header background on its line to improve its contrast.
+
+  ctx.moveTo(0, headerHeight + 0.5);
+  ctx.lineTo(width, headerHeight + 0.5);
+  ctx.strokeStyle = theme.bgHeader;
+  ctx.lineWidth = 1;
+  ctx.stroke();
   ctx.beginPath(); // vertical lines
@@ -599,2 +606,11 @@
 
+  ctx.beginPath();
+  ctx.moveTo(0, headerHeight + 0.5);
+  ctx.lineTo(width, headerHeight + 0.5);
+  ctx.strokeStyle = theme.bgHeader;
+  ctx.stroke();
+  ctx.strokeStyle = theme.borderColor;
+  ctx.stroke();
+  ctx.beginPath();
+
   if (drawX !== 0) {
@@ -605,5 +621,2 @@ ctx.moveTo(drawX + 0.5, 0);
 
-  ctx.moveTo(0, headerHeight + 0.5);
-  ctx.lineTo(width, headerHeight + 0.5);
-
   if (lastRowSticky) {
@@ -641,2 +654,4 @@ var h = getRowHeight(rows - 1);
     walkRowsInCol(startRow, colDrawY, height, rows, getRowHeight, lastRowSticky, function (drawY, row, rh) {
+      var _col$themeOverride$ac, _col$themeOverride;
+
       if (row !== targetRow) return;
@@ -654,3 +669,3 @@ ctx.save();
       ctx.rect(drawX + 0.5, drawY + 0.5, col.width, rh);
-      ctx.strokeStyle = theme.accentColor;
+      ctx.strokeStyle = (_col$themeOverride$ac = (_col$themeOverride = col.themeOverride) === null || _col$themeOverride === void 0 ? void 0 : _col$themeOverride.accentColor) !== null && _col$themeOverride$ac !== void 0 ? _col$themeOverride$ac : theme.accentColor;
       ctx.lineWidth = 1;
@@ -657,0 +672,0 @@ ctx.stroke();

dist/js/data-grid/data-grid-sprites.js

@@ -12,10 +12,2 @@ "use strict";
 
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-
-function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
-
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-
 function _toConsumableArray(arr) { return _arrayWithoutHoles(arr) || _iterableToArray(arr) || _unsupportedIterableToArray(arr) || _nonIterableSpread(); }
@@ -31,2 +23,10 @@
 
+function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+
+function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+
 function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
@@ -36,5 +36,5 @@
 
-function asyncGeneratorStep(gen, resolve, reject, _next, _throw, key, arg) { try { var info = gen[key](arg); var value = info.value; } catch (error) { reject(error); return; } if (info.done) { resolve(value); } else { Promise.resolve(value).then(_next, _throw); } }
+function _iterableToArrayLimit(arr, i) { if (typeof Symbol === "undefined" || !(Symbol.iterator in Object(arr))) return; var _arr = []; var _n = true; var _d = false; var _e = undefined; try { for (var _i = arr[Symbol.iterator](), _s; !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i["return"] != null) _i["return"](); } finally { if (_d) throw _e; } } return _arr; }
 
-function _asyncToGenerator(fn) { return function () { var self = this, args = arguments; return new Promise(function (resolve, reject) { var gen = fn.apply(self, args); function _next(value) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "next", value); } function _throw(err) { asyncGeneratorStep(gen, resolve, reject, _next, _throw, "throw", err); } _next(undefined); }); }; }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
 
@@ -53,7 +53,7 @@ function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
 
-var variantList = ["normal", "selected", "special", "specialSelected"];
+var variantList = ["normal", "selected", "special"];
 var renderSize = 40;
 
-function makeExtraMapIndex(theme) {
-  return "".concat(theme.bgIconHeader, "|").concat(theme.fgIconHeader);
+function makeExtraMapIndex(bgColor, fgColor) {
+  return "".concat(bgColor, "|").concat(fgColor);
 }
@@ -67,2 +67,12 @@
 
+function getColors(variant, theme) {
+  if (variant === "normal") {
+    return [theme.bgIconHeader, theme.fgIconHeader];
+  } else if (variant === "selected") {
+    return ["white", theme.accentColor];
+  } else {
+    return [theme.accentColor, theme.bgHeader];
+  }
+}
+
 var SpriteManager = /*#__PURE__*/function () {
@@ -72,8 +82,6 @@ function SpriteManager(headerIcons) {
 
-    _defineProperty(this, "extraMap", []);
+    _defineProperty(this, "colorMap", []);
 
     _defineProperty(this, "spriteCanvas", void 0);
 
-    _defineProperty(this, "lastTheme", void 0);
-
     _defineProperty(this, "spriteList", void 0);
@@ -91,7 +99,13 @@
       if (this.spriteCanvas === undefined) throw new Error();
-      var index = this.spriteList.indexOf(sprite);
-      if (index === -1) throw new Error("Unknown header icon");
-      var extraIndex = this.extraMap.indexOf(makeExtraMapIndex(theme));
-      var xOffset = index * renderSize;
-      var yOffset = (extraIndex !== -1 ? variantList.length + extraIndex : variantList.indexOf(variant)) * renderSize;
+      var spriteIndex = this.spriteList.indexOf(sprite);
+      if (spriteIndex === -1) throw new Error("Unknown header icon");
+
+      var _getColors = getColors(variant, theme),
+          _getColors2 = _slicedToArray(_getColors, 2),
+          bgColor = _getColors2[0],
+          fgColor = _getColors2[1];
+
+      var variantIndex = this.colorMap.indexOf(makeExtraMapIndex(bgColor, fgColor));
+      var xOffset = spriteIndex * renderSize;
+      var yOffset = Math.max(0, variantIndex * renderSize);
       ctx.drawImage(this.spriteCanvas, xOffset, yOffset, renderSize, renderSize, x, y, size, size);
@@ -103,6 +117,4 @@ }
       var _buildSpriteMap = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee(theme, cols) {
-        var _this$lastTheme, _this$lastTheme2, _this$lastTheme3, _this$lastTheme4;
+        var map, _iterator, _step, v, _getColors3, _getColors4, bg, fg, _iterator2, _step2, _c$themeOverride, _c$themeOverride2, c, finalTheme, _iterator5, _step5, _v, _getColors5, _getColors6, _bg, _fg, newMap, hasDiff, _iterator3, _step3, _step3$value, index, key, ctx, x, _iterator4, _step4, _key, sprite, y, _iterator6, _step6, ex, _getColorsForIndex, _getColorsForIndex2, bgColor, fgColor, imgSource;
 
-        var extra, _iterator, _step, _c$themeOverride, _c$themeOverride2, c, finalTheme, themeExtract, ctx, x, _iterator2, _step2, key, sprite, y, _iterator3, _step3, variant, fgColor, bgColor, imgSource, _iterator4, _step4, ex, _getColorsForIndex, _getColorsForIndex2, _bgColor, _fgColor, _imgSource;
-
         return regeneratorRuntime.wrap(function _callee$(_context) {
@@ -112,89 +124,142 @@ while (1) {
               case 0:
-                extra = new Set();
-                _iterator = _createForOfIteratorHelper(cols);
+                map = new Set();
+                _iterator = _createForOfIteratorHelper(variantList);
 
                 try {
                   for (_iterator.s(); !(_step = _iterator.n()).done;) {
-                    c = _step.value;
+                    v = _step.value;
+                    _getColors3 = getColors(v, theme), _getColors4 = _slicedToArray(_getColors3, 2), bg = _getColors4[0], fg = _getColors4[1];
+                    map.add(makeExtraMapIndex(bg, fg));
+                  }
+                } catch (err) {
+                  _iterator.e(err);
+                } finally {
+                  _iterator.f();
+                }
 
+                _iterator2 = _createForOfIteratorHelper(cols);
+
+                try {
+                  for (_iterator2.s(); !(_step2 = _iterator2.n()).done;) {
+                    c = _step2.value;
+
                     if (((_c$themeOverride = c.themeOverride) === null || _c$themeOverride === void 0 ? void 0 : _c$themeOverride.bgIconHeader) !== undefined || ((_c$themeOverride2 = c.themeOverride) === null || _c$themeOverride2 === void 0 ? void 0 : _c$themeOverride2.fgIconHeader) !== undefined) {
                       finalTheme = _objectSpread(_objectSpread({}, theme), c.themeOverride);
-                      extra.add(makeExtraMapIndex(finalTheme));
+                      _iterator5 = _createForOfIteratorHelper(variantList);
+
+                      try {
+                        for (_iterator5.s(); !(_step5 = _iterator5.n()).done;) {
+                          _v = _step5.value;
+                          _getColors5 = getColors(_v, finalTheme), _getColors6 = _slicedToArray(_getColors5, 2), _bg = _getColors6[0], _fg = _getColors6[1];
+                          map.add(makeExtraMapIndex(_bg, _fg));
+                        }
+                      } catch (err) {
+                        _iterator5.e(err);
+                      } finally {
+                        _iterator5.f();
+                      }
                     }
                   }
                 } catch (err) {
-                  _iterator.e(err);
+                  _iterator2.e(err);
                 } finally {
-                  _iterator.f();
+                  _iterator2.f();
                 }
 
-                extra.delete(makeExtraMapIndex(theme));
-                this.extraMap = _toConsumableArray(extra);
-                themeExtract = {
-                  fgColor: theme.fgIconHeader,
-                  bgColor: theme.bgIconHeader,
-                  acceptColor: theme.accentColor,
-                  columnHeaderBg: theme.bgHeader
-                };
+                newMap = _toConsumableArray(map);
+                newMap.sort();
+                hasDiff = false;
+                _iterator3 = _createForOfIteratorHelper(newMap.entries());
+                _context.prev = 9;
 
-                if (!(((_this$lastTheme = this.lastTheme) === null || _this$lastTheme === void 0 ? void 0 : _this$lastTheme.acceptColor) === themeExtract.acceptColor && ((_this$lastTheme2 = this.lastTheme) === null || _this$lastTheme2 === void 0 ? void 0 : _this$lastTheme2.bgColor) === themeExtract.bgColor && ((_this$lastTheme3 = this.lastTheme) === null || _this$lastTheme3 === void 0 ? void 0 : _this$lastTheme3.columnHeaderBg) === themeExtract.columnHeaderBg && ((_this$lastTheme4 = this.lastTheme) === null || _this$lastTheme4 === void 0 ? void 0 : _this$lastTheme4.fgColor) === themeExtract.fgColor)) {
-                  _context.next = 8;
+                _iterator3.s();
+
+              case 11:
+                if ((_step3 = _iterator3.n()).done) {
+                  _context.next = 18;
                   break;
                 }
 
-                return _context.abrupt("return");
+                _step3$value = _slicedToArray(_step3.value, 2), index = _step3$value[0], key = _step3$value[1];
 
-              case 8:
-                this.lastTheme = themeExtract;
+                if (!(key !== this.colorMap[index])) {
+                  _context.next = 16;
+                  break;
+                }
+
+                hasDiff = true;
+                return _context.abrupt("break", 18);
+
+              case 16:
+                _context.next = 11;
+                break;
+
+              case 18:
+                _context.next = 23;
+                break;
+
+              case 20:
+                _context.prev = 20;
+                _context.t0 = _context["catch"](9);
+
+                _iterator3.e(_context.t0);
+
+              case 23:
+                _context.prev = 23;
+
+                _iterator3.f();
+
+                return _context.finish(23);
+
+              case 26:
+                if (hasDiff) {
+                  _context.next = 28;
+                  break;
+                }
+
+                return _context.abrupt("return", false);
+
+              case 28:
+                this.colorMap = newMap;
                 this.spriteCanvas = document.createElement("canvas");
                 this.spriteCanvas.width = this.spriteList.length * renderSize;
-                this.spriteCanvas.height = (variantList.length + this.extraMap.length) * renderSize;
+                this.spriteCanvas.height = this.colorMap.length * renderSize;
                 ctx = this.spriteCanvas.getContext("2d");
 
                 if (!(ctx === null)) {
-                  _context.next = 15;
+                  _context.next = 35;
                   break;
                 }
 
-                return _context.abrupt("return");
+                return _context.abrupt("return", false);
 
-              case 15:
+              case 35:
                 x = 0;
-                _iterator2 = _createForOfIteratorHelper(this.spriteList);
-                _context.prev = 17;
+                _iterator4 = _createForOfIteratorHelper(this.spriteList);
+                _context.prev = 37;
 
-                _iterator2.s();
+                _iterator4.s();
 
-              case 19:
-                if ((_step2 = _iterator2.n()).done) {
-                  _context.next = 72;
+              case 39:
+                if ((_step4 = _iterator4.n()).done) {
+                  _context.next = 68;
                   break;
                 }
 
-                key = _step2.value;
-                sprite = this.headerIcons[key];
+                _key = _step4.value;
+                sprite = this.headerIcons[_key];
                 y = 0;
-                _iterator3 = _createForOfIteratorHelper(variantList);
-                _context.prev = 24;
+                _iterator6 = _createForOfIteratorHelper(this.colorMap);
+                _context.prev = 44;
 
-                _iterator3.s();
+                _iterator6.s();
 
-              case 26:
-                if ((_step3 = _iterator3.n()).done) {
-                  _context.next = 39;
+              case 46:
+                if ((_step6 = _iterator6.n()).done) {
+                  _context.next = 57;
                   break;
                 }
 
-                variant = _step3.value;
-                fgColor = themeExtract.fgColor;
-                bgColor = themeExtract.bgColor;
-
-                if (variant === "selected") {
-                  bgColor = "white";
-                  fgColor = themeExtract.acceptColor;
-                } else if (variant === "special") {
-                  bgColor = themeExtract.acceptColor;
-                  fgColor = themeExtract.columnHeaderBg;
-                }
-
+                ex = _step6.value;
+                _getColorsForIndex = getColorsForIndex(ex), _getColorsForIndex2 = _slicedToArray(_getColorsForIndex, 2), bgColor = _getColorsForIndex2[0], fgColor = _getColorsForIndex2[1];
                 imgSource = new Image();
@@ -205,102 +270,58 @@ imgSource.src = "data:image/svg+xml;charset=utf-8,".concat(encodeURIComponent(sprite({
                 })));
-                _context.next = 35;
+                _context.next = 53;
                 return imgSource.decode();
 
-              case 35:
+              case 53:
                 ctx.drawImage(imgSource, x, y, renderSize, renderSize);
                 y += renderSize;
 
-              case 37:
-                _context.next = 26;
+              case 55:
+                _context.next = 46;
                 break;
 
-              case 39:
-                _context.next = 44;
+              case 57:
+                _context.next = 62;
                 break;
 
-              case 41:
-                _context.prev = 41;
-                _context.t0 = _context["catch"](24);
+              case 59:
+                _context.prev = 59;
+                _context.t1 = _context["catch"](44);
 
-                _iterator3.e(_context.t0);
+                _iterator6.e(_context.t1);
 
-              case 44:
-                _context.prev = 44;
+              case 62:
+                _context.prev = 62;
 
-                _iterator3.f();
+                _iterator6.f();
 
-                return _context.finish(44);
+                return _context.finish(62);
 
-              case 47:
-                _iterator4 = _createForOfIteratorHelper(this.extraMap);
-                _context.prev = 48;
+              case 65:
+                x += renderSize;
 
-                _iterator4.s();
-
-              case 50:
-                if ((_step4 = _iterator4.n()).done) {
-                  _context.next = 61;
-                  break;
-                }
-
-                ex = _step4.value;
-                _getColorsForIndex = getColorsForIndex(ex), _getColorsForIndex2 = _slicedToArray(_getColorsForIndex, 2), _bgColor = _getColorsForIndex2[0], _fgColor = _getColorsForIndex2[1];
-                _imgSource = new Image();
-                _imgSource.src = "data:image/svg+xml;charset=utf-8,".concat(encodeURIComponent(sprite({
-                  fgColor: _fgColor,
-                  bgColor: _bgColor
-                })));
-                _context.next = 57;
-                return _imgSource.decode();
-
-              case 57:
-                ctx.drawImage(_imgSource, x, y, renderSize, renderSize);
-                y += renderSize;
-
-              case 59:
-                _context.next = 50;
+              case 66:
+                _context.next = 39;
                 break;
 
-              case 61:
-                _context.next = 66;
+              case 68:
+                _context.next = 73;
                 break;
 
-              case 63:
-                _context.prev = 63;
-                _context.t1 = _context["catch"](48);
+              case 70:
+                _context.prev = 70;
+                _context.t2 = _context["catch"](37);
 
-                _iterator4.e(_context.t1);
+                _iterator4.e(_context.t2);
 
-              case 66:
-                _context.prev = 66;
+              case 73:
+                _context.prev = 73;
 
                 _iterator4.f();
 
-                return _context.finish(66);
+                return _context.finish(73);
 
-              case 69:
-                x += renderSize;
+              case 76:
+                return _context.abrupt("return", true);
 
-              case 70:
-                _context.next = 19;
-                break;
-
-              case 72:
-                _context.next = 77;
-                break;
-
-              case 74:
-                _context.prev = 74;
-                _context.t2 = _context["catch"](17);
-
-                _iterator2.e(_context.t2);
-
               case 77:
-                _context.prev = 77;
-
-                _iterator2.f();
-
-                return _context.finish(77);
-
-              case 80:
               case "end":
@@ -310,3 +331,3 @@ return _context.stop();
           }
-        }, _callee, this, [[17, 74, 77, 80], [24, 41, 44, 47], [48, 63, 66, 69]]);
+        }, _callee, this, [[9, 20, 23, 26], [37, 70, 73, 76], [44, 59, 62, 65]]);
       }));
@@ -313,0 +334,0 @@

dist/js/data-grid/data-grid.js

@@ -136,2 +136,3 @@ "use strict";
       var _ref = _asyncToGenerator( /*#__PURE__*/regeneratorRuntime.mark(function _callee() {
+        var changed;
         return regeneratorRuntime.wrap(function _callee$(_context) {
@@ -145,5 +146,9 @@ while (1) {
               case 2:
-                lastDrawRef.current();
+                changed = _context.sent;
 
-              case 3:
+                if (changed) {
+                  lastDrawRef.current();
+                }
+
+              case 4:
               case "end":
@@ -150,0 +155,0 @@ return _context.stop();

dist/js/growing-entry/growing-entry-style.js

@@ -13,3 +13,3 @@ "use strict";
 function _templateObject4() {
-  var data = _taggedTemplateLiteral(["\n    position: relative;\n    margin-top: 6px;\n    min-width: 100%;\n"]);
+  var data = _taggedTemplateLiteral(["\n    position: relative;\n    margin-top: 6px;\n"]);
 
@@ -16,0 +16,0 @@ _templateObject4 = function _templateObject4() {

dist/ts/data-grid-overlay-editor/private/markdown-overlay-editor.d.ts

 import * as React from "react";
-import { GridCell, Rectangle } from "data-grid/data-grid-types";
+import { Rectangle } from "data-grid/data-grid-types";
 interface Props {
@@ -9,7 +9,7 @@ readonly targetRect: Rectangle;
     readonly forceEditMode: boolean;
-    readonly onFinishEditing: (newCell: GridCell | undefined, movement: readonly [-1 | 0 | 1, -1 | 0 | 1]) => void;
+    readonly onFinish: () => void;
     readonly readonly: boolean;
     createNode?: (content: string) => DocumentFragment;
 }
-declare const MarkdownOverlayEditor: React.FunctionComponent<Props>;
-export default MarkdownOverlayEditor;
+export declare const MarkdownOverlayEditor: React.FunctionComponent<Props>;
+export {};

dist/ts/data-grid/data-grid-sprites.d.ts

@@ -6,7 +6,6 @@ import { GridColumn } from "index";
 export declare type SpriteMap = Record<string | HeaderIcon, HeaderIconMap["headerArray"]>;
-export declare type SpriteVariant = "normal" | "selected" | "special" | "specialSelected";
+export declare type SpriteVariant = "normal" | "selected" | "special";
 export declare class SpriteManager {
-    private extraMap;
+    private colorMap;
     private spriteCanvas;
-    private lastTheme;
     private spriteList;
@@ -16,3 +15,3 @@ private headerIcons;
     drawSprite(sprite: HeaderIcon | string, variant: SpriteVariant, ctx: CanvasRenderingContext2D, x: number, y: number, size: number, theme: Theme): void;
-    buildSpriteMap(theme: Theme, cols: readonly GridColumn[]): Promise<void>;
+    buildSpriteMap(theme: Theme, cols: readonly GridColumn[]): Promise<boolean>;
 }

package.json

 {
     "name": "@glideapps/glide-data-grid",
-    "version": "3.0.0-rc3",
+    "version": "3.0.0-rc4",
     "description": "Super fast, pure canvas Data Grid Editor",
@@ -5,0 +5,0 @@ "main": "dist/js/index.js",

No alert changes

Improved metrics

Total package byte prevSize

426670

increased by0.26%

Lines of code

7546

increased by0.43%

Worsened metrics

Published versions last year

12

decreased by-7.69%

No dependency changes