@infinite-table/infinite-react 3.3.1 → 3.3.3

package/index.dev.mjs

@@ -73,6 +73,15 @@ var __async = (__this, __arguments, generator) => {
     step((generator = generator.apply(__this, __arguments)).next());
   });
 };
+var __forAwait = (obj, it, method) => {
+  it = obj[Symbol.asyncIterator];
+  method = (key, fn) => (fn = obj[key]) && (it[key] = (arg) => new Promise((resolve, reject, done) => {
+    arg = fn.call(obj, arg);
+    done = arg.done;
+    return Promise.resolve(arg.value).then((value) => resolve({ value, done }), reject);
+  }));
+  return it ? it.call(obj) : (obj = obj[Symbol.iterator](), it = {}, method("next"), method("return"), it);
+};
 
 // ../node_modules/binary-search/index.js
 var require_binary_search = __commonJS({
@@ -15609,6 +15618,10 @@ var InfiniteTableApiImpl = class {
     this.rejectEdit = (reason) => {
       return this.stopEdit({ reject: reason });
     };
+    this.getColumnAtIndex = (index) => {
+      var _a;
+      return (_a = this.getComputed().computedVisibleColumns[index]) != null ? _a : null;
+    };
     this.isCellEditable = (params) => {
       const { rowIndex: index, primaryKey, columnId } = params;
       const rowIndex = index != null ? index : this.context.dataSourceApi.getIndexByPrimaryKey(primaryKey);
@@ -15867,7 +15880,12 @@ var InfiniteTableApiImpl = class {
   }
   startEdit(params) {
     return __async(this, null, function* () {
-      const { columnId, rowIndex: index, primaryKey } = params;
+      const {
+        columnId,
+        rowIndex: index,
+        primaryKey,
+        value: valueToSetInitially
+      } = params;
       const rowIndex = index != null ? index : this.context.dataSourceApi.getIndexByPrimaryKey(primaryKey);
       return this.isCellEditable({
         rowIndex,
@@ -15879,7 +15897,7 @@ var InfiniteTableApiImpl = class {
           const columnsMap = this.getComputed().computedColumnsMap;
           const column = columnsMap.get(columnId);
           const rowInfo = dataArray[rowIndex];
-          let value = getColumnValueToEdit({
+          let value = valueToSetInitially != null ? valueToSetInitially : getColumnValueToEdit({
             column,
             rowInfo
             // columnsMap,
@@ -17394,6 +17412,7 @@ var forwardProps4 = (setupState) => {
     columnDefaultEditable: 1,
     columnDefaultFilterable: 1,
     columnDefaultSortable: 1,
+    keyboardShortcuts: 1,
     rowStyle: 1,
     cellStyle: 1,
     rowProps: 1,
@@ -18754,7 +18773,7 @@ var useLicense = (licenseKey = "") => {
     }
     let valid2 = isValidLicense(licenseKey, {
       publishedAt: 1624970570587,
-      version: "3.3.1"
+      version: "3.3.3"
     });
     if (!licenseKey && !valid2 && isInsidePlayground) {
       return true;
@@ -19526,46 +19545,171 @@ function handleBrowserFocusChangeOnKeyboardNavigation(context, event) {
   return true;
 }
 
+// src/components/utils/hotkey.ts
+var KeyModifierAliases = {
+  control: "ctrl"
+};
+var CmdOrCtrlAliases = {
+  "control|cmd": "ctrl",
+  "cmd|control": "ctrl",
+  "ctrl|cmd": "ctrl",
+  "cmd|ctrl": "ctrl"
+};
+var KeyAliases = {
+  esc: "escape"
+};
+var keyModifierChecker = {
+  cmd: (event) => event.metaKey,
+  alt: (event) => event.altKey,
+  ctrl: (event) => event.ctrlKey,
+  shift: (event) => event.shiftKey
+};
+var keyModifierNames = Object.keys(keyModifierChecker);
+var keyModifierSet = new Set(keyModifierNames);
+var allowedStarModifiers = /* @__PURE__ */ new Set(["shift", "alt"]);
+function eventMatchesKeyboardShortcut(event, keyDescriptors) {
+  if (!Array.isArray(keyDescriptors)) {
+    return eventMatchesSingleShortcut(event, keyDescriptors);
+  }
+  return keyDescriptors.some(
+    (keyDescriptor) => eventMatchesSingleShortcut(event, keyDescriptor)
+  );
+}
+function eventMatchesSingleShortcut(event, keyDescriptor) {
+  const keyLowercase = event.key.toLowerCase();
+  const splitPartsLowercase = keyDescriptor.split("+").map((part) => part.toLowerCase().trim());
+  const hasCmdOrCtrlAlias = splitPartsLowercase.find(
+    (part) => CmdOrCtrlAliases[part]
+  );
+  const parts = splitPartsLowercase.map(
+    (part) => KeyModifierAliases[part] || CmdOrCtrlAliases[part] || KeyAliases[part] || part
+  );
+  const expectedModifiers = parts.filter(
+    (part) => keyModifierSet.has(part)
+  );
+  const nonModifierParts = parts.filter(
+    (part) => !keyModifierSet.has(part)
+  );
+  const currentModifierMatches = keyModifierNames.reduce((acc, modifier) => {
+    acc[modifier] = keyModifierChecker[modifier](event);
+    return acc;
+  }, {});
+  if (hasCmdOrCtrlAlias && currentModifierMatches.cmd) {
+    currentModifierMatches.cmd = false;
+    currentModifierMatches.ctrl = true;
+  }
+  const currentModifierMatchesList = Object.keys(currentModifierMatches).filter(
+    (key) => currentModifierMatches[key]
+  );
+  const hasAllModifiers = expectedModifiers.every(
+    (modifier) => currentModifierMatches[modifier] === true
+  );
+  if (!hasAllModifiers) {
+    return false;
+  }
+  const hasStar = nonModifierParts.includes("*");
+  if (!hasStar) {
+    if (expectedModifiers.length != currentModifierMatchesList.length) {
+      return false;
+    }
+  } else {
+    if (currentModifierMatchesList.length < expectedModifiers.length) {
+      return false;
+    }
+    const nonAllowedModifiers = currentModifierMatchesList.filter(
+      (modifier) => !allowedStarModifiers.has(modifier)
+    );
+    if (nonAllowedModifiers.length) {
+      return false;
+    }
+  }
+  if (!nonModifierParts.length) {
+    return false;
+  }
+  if (keyModifierSet.has(keyLowercase) || keyLowercase === "meta" || KeyModifierAliases[keyLowercase]) {
+    return false;
+  }
+  return nonModifierParts.reduce((acc, part) => {
+    if (!acc) {
+      return false;
+    }
+    const res = part === "*" || keyLowercase === part;
+    return res;
+  }, true);
+}
+
 // src/components/InfiniteTable/eventHandlers/onKeyDown.ts
 function onKeyDown(context, event) {
-  var _a, _b;
-  const keyboardHandlerContext = __spreadProps(__spreadValues({}, context), {
-    cloneRowSelection: (rowSelection) => {
-      return cloneRowSelection(rowSelection, context.getDataSourceState);
+  return __async(this, null, function* () {
+    var _a, _b;
+    const keyboardHandlerContext = __spreadProps(__spreadValues({}, context), {
+      cloneRowSelection: (rowSelection) => {
+        return cloneRowSelection(rowSelection, context.getDataSourceState);
+      }
+    });
+    if (handleKeyboardSelection(keyboardHandlerContext, event)) {
+      event.preventDefault();
     }
-  });
-  if (handleKeyboardSelection(keyboardHandlerContext, event)) {
-    event.preventDefault();
-  }
-  if (handleBrowserFocusChangeOnKeyboardNavigation(keyboardHandlerContext, event)) {
-    event.preventDefault();
-  } else {
-    if (!context.getState().focusedWithin && handleKeyboardNavigation(keyboardHandlerContext, event)) {
+    if (handleBrowserFocusChangeOnKeyboardNavigation(keyboardHandlerContext, event)) {
       event.preventDefault();
+    } else {
+      if (!context.getState().focusedWithin && handleKeyboardNavigation(keyboardHandlerContext, event)) {
+        event.preventDefault();
+      }
     }
-  }
-  if (event.key === "Enter") {
-    const { activeCellIndex } = context.getState();
-    if (activeCellIndex) {
-      const [rowIndex, colIndex] = activeCellIndex;
-      const column = context.getComputed().computedVisibleColumns[colIndex];
-      if (column.computedEditable) {
-        context.api.startEdit({
-          rowIndex,
-          columnId: column.id
-        });
+    if (event.key === "Enter" && !context.api.isEditInProgress()) {
+      const { activeCellIndex } = context.getState();
+      if (activeCellIndex) {
+        const [rowIndex, colIndex] = activeCellIndex;
+        const column = context.getComputed().computedVisibleColumns[colIndex];
+        if (column.computedEditable) {
+          context.api.startEdit({
+            rowIndex,
+            columnId: column.id
+          });
+        }
       }
     }
-  }
-  if (context.api.isEditInProgress()) {
-    if (event.key === "Escape") {
-      context.api.stopEdit({ cancel: true });
+    if (context.api.isEditInProgress()) {
+      if (event.key === "Escape") {
+        context.api.stopEdit({ cancel: true });
+      }
+      if (event.key === "Tab") {
+        event.preventDefault();
+      }
     }
-    if (event.key === "Tab") {
-      event.preventDefault();
+    (_b = (_a = context.getState()).onKeyDown) == null ? void 0 : _b.call(_a, context, event);
+    const { keyboardShortcuts: keyboardShortcuts2 } = context.getState();
+    if (keyboardShortcuts2) {
+      try {
+        for (var iter = __forAwait(keyboardShortcuts2), more, temp, error2; more = !(temp = yield iter.next()).done; more = false) {
+          const shortcut = temp.value;
+          if (!eventMatchesKeyboardShortcut(event, shortcut.key)) {
+            continue;
+          }
+          if (shortcut.when) {
+            const result = yield shortcut.when(context);
+            if (!result) {
+              continue;
+            }
+          }
+          const maybeStopNext = yield shortcut.handler(context, event);
+          if (maybeStopNext && maybeStopNext.stopNext) {
+            break;
+          }
+        }
+      } catch (temp) {
+        error2 = [temp];
+      } finally {
+        try {
+          more && (temp = iter.return) && (yield temp.call(iter));
+        } finally {
+          if (error2)
+            throw error2[0];
+        }
+      }
     }
-  }
-  (_b = (_a = context.getState()).onKeyDown) == null ? void 0 : _b.call(_a, context, event);
+  });
 }
 
 // src/components/InfiniteTable/eventHandlers/index.ts
@@ -22508,6 +22652,50 @@ var InfiniteTable = function(props) {
   return table;
 };
 
+// src/components/InfiniteTable/eventHandlers/keyboardShortcuts.ts
+var instantEdit = {
+  key: "*",
+  when: (context) => {
+    const { activeCellIndex } = context.getState();
+    if (activeCellIndex) {
+      const [rowIndex, colIndex] = activeCellIndex;
+      const column = context.api.getColumnAtIndex(colIndex);
+      if (!column) {
+        return false;
+      }
+      return context.api.isCellEditable({
+        rowIndex,
+        columnId: column.id
+      });
+    }
+    return false;
+  },
+  handler: (context, event) => {
+    const { key } = event;
+    if (key != "Escape" && key.length === 1) {
+      const { activeCellIndex } = context.getState();
+      if (activeCellIndex) {
+        const [rowIndex, colIndex] = activeCellIndex;
+        const column = context.api.getColumnAtIndex(colIndex);
+        if (!column) {
+          return;
+        }
+        requestAnimationFrame(() => {
+          context.api.startEdit({
+            rowIndex,
+            // value: '',
+            value: key,
+            columnId: column.id
+          });
+        });
+      }
+    }
+  }
+};
+var keyboardShortcuts = {
+  instantEdit
+};
+
 // src/utils/FixedSizeSet.ts
 var _FixedSizeSet = class {
   constructor(clone, size) {
@@ -22654,11 +22842,13 @@ export {
   debounce,
   debug,
   defaultFilterTypes2 as defaultFilterTypes,
+  eventMatchesKeyboardShortcut,
   defaultFilterTypes2 as filterTypes,
   flatten,
   getComponentStateRoot,
   group,
   interceptMap,
+  keyboardShortcuts,
   multisort,
   useComponentState,
   useDataSource,