@inceptionbg/iui 2.0.23 → 2.0.25

package/src/components/Table/hooks/localHooks/useLocalTableKeyboard.ts

@@ -1,177 +1,176 @@
-import { useEffect, useState } from 'react';
-import { ITableDataItem } from '../../../../types/ITable';
-import { IKeyboardAction } from '../../../../types/IKeyboard';
-import { scrollToRow } from '../../../../utils/tableUtils';
-import { useTableContext } from '../../contexts/TableContext';
-
-export const useLocalTableKeyboard = () => {
-  const [focusedRow, setFocusedRow] = useState<ITableDataItem | null>(null);
-
-  const { keyboard, data, editable, itemDeleteData, dataActions, rowSelect, footer } =
-    useTableContext();
-
-  useEffect(() => {
-    if (keyboard?.enabled) {
-      const isEditing = !!editable?.selectedItem;
-      const isAdding = !!editable?.isAdding;
-      const isEditDisabled = !editable || keyboard?.actions?.editDisabled;
-      const isAddDisabled = !!editable?.addDisabled;
-      const isMoveDisabled = !!keyboard?.actions?.moveDisabled;
-      const isBulkAction =
-        dataActions?.hasItemActions &&
-        rowSelect?.selectedRows &&
-        rowSelect.selectedRows.size > 0;
-
-      const handleKeyDown = (event: KeyboardEvent) => {
-        const rowIndex = focusedRow
-          ? data.findIndex(row => row.uuid === focusedRow.uuid)
-          : -1;
-
-        const allActions: IKeyboardAction[] = [
-          {
-            code: 'ArrowDown',
-            disabled: isEditing || isAdding || isMoveDisabled,
-            onAction: () => {
-              const nextRow = rowIndex + 1;
-              if (nextRow < data.length) {
-                // rowIndex will be -1 if no row is selected so the next row will be 0
-                setFocusedRow(data[nextRow]);
-                scrollToRow(data[nextRow].uuid);
-              }
-            },
-          },
-          {
-            code: 'ArrowUp',
-            disabled: isEditing || isAdding || isMoveDisabled,
-            onAction: () => {
-              if (rowIndex !== 0) {
-                const prevRow = rowIndex > 0 ? rowIndex - 1 : data.length - 1;
-                setFocusedRow(data[prevRow]);
-                scrollToRow(data[prevRow].uuid);
-              }
-            },
-          },
-          {
-            code: 'KeyE',
-            ctrl: true,
-            disabled: isEditing || isEditDisabled || !focusedRow,
-            onAction: () => {
-              editable?.setSelectedItem(focusedRow);
-            },
-          },
-          {
-            code: 'Enter',
-            disabled: isEditing || isAdding || !focusedRow?.onRowClick,
-            onAction: focusedRow?.onRowClick!,
-          },
-          {
-            code: 'Escape',
-            disabled: !focusedRow && !isAdding && !isEditing,
-            onAction: () =>
-              isAdding
-                ? editable?.setIsAdding(false)
-                : editable?.selectedItem
-                  ? editable?.setSelectedItem?.(null)
-                  : setFocusedRow(null),
-          },
-          {
-            code: 'Insert',
-            disabled: isAddDisabled || isAdding || isEditing,
-            onAction: () => {
-              editable?.setIsAdding(true);
-              setFocusedRow(null);
-            },
-          },
-          {
-            code: 'Delete',
-            disabled: !dataActions?.isDeletable || isEditing || !focusedRow,
-            onAction: () =>
-              itemDeleteData?.setItemToDeleteUuids(
-                isBulkAction ? Array.from(rowSelect.selectedRows) : [focusedRow!.uuid]
-              ),
-          },
-          {
-            code: 'ArrowLeft',
-            ctrl: true,
-            disabled: isEditing || isAdding,
-            onAction: () =>
-              footer!.paginationControl!.offset > 0 &&
-              footer!.paginationControl!.setOffset(footer!.paginationControl!.offset - 1),
-          },
-          {
-            code: 'ArrowRight',
-            ctrl: true,
-            disabled: isEditing || isAdding,
-            onAction: () => {
-              if (
-                footer?.noTotalRows
-                  ? footer!.paginationControl!.limit <= footer!.totalRows!
-                  : footer!.paginationControl!.offset + 1 <
-                    Math.ceil(footer!.totalRows! / footer!.paginationControl!.limit)
-              ) {
-                footer!.paginationControl!.setOffset(
-                  footer!.paginationControl!.offset + 1
-                );
-              }
-            },
-          },
-          {
-            code: 'Space',
-            disabled:
-              !dataActions?.hasItemActions || !focusedRow?.uuid || isEditing || isAdding,
-            onAction: () => {
-              const rowUuid = focusedRow?.uuid!;
-              const isRowSelected = rowSelect?.selectedRows.has(rowUuid);
-              rowSelect?.setSelectedRows(oldSet => {
-                const newSet = new Set(oldSet);
-                newSet[isRowSelected ? 'delete' : 'add'](rowUuid);
-                return newSet;
-              });
-            },
-          },
-        ];
-
-        allActions.forEach(action => {
-          if (
-            !action.disabled &&
-            action.code === event.code &&
-            !!action.ctrl === (event.ctrlKey || event.metaKey)
-          ) {
-            event.preventDefault();
-            event.stopPropagation();
-            console.log(action);
-            if (
-              action.onBulkAction &&
-              dataActions?.hasItemActions &&
-              rowSelect?.selectedRows &&
-              rowSelect.selectedRows.size > 0
-            ) {
-              action.onBulkAction(Array.from(rowSelect.selectedRows));
-            } else {
-              action.onAction();
-            }
-          }
-        });
-      };
-
-      document.addEventListener('keydown', handleKeyDown);
-      return () => {
-        document.removeEventListener('keydown', handleKeyDown);
-      };
-    }
-  }, [
-    data,
-    editable,
-    keyboard,
-    dataActions?.hasItemActions,
-    dataActions?.isDeletable,
-    itemDeleteData,
-    focusedRow,
-    footer,
-    rowSelect,
-  ]);
-  return {
-    focusedRow,
-    // handleKeyDown,
-  };
-};
+import type { IKeyboardAction } from '../../../../types/IKeyboard';
+import type { ITableDataItem } from '../../../../types/ITable';
+import { useEffect, useState } from 'react';
+import { scrollToRow } from '../../../../utils/tableUtils';
+import { useTableContext } from '../../contexts/TableContext';
+
+export const useLocalTableKeyboard = () => {
+  const [focusedRow, setFocusedRow] = useState<ITableDataItem | null>(null);
+
+  const { keyboard, data, editable, itemDeleteData, dataActions, rowSelect, footer } =
+    useTableContext();
+
+  useEffect(() => {
+    if (keyboard?.enabled) {
+      const isEditing = !!editable?.selectedItem;
+      const isAdding = !!editable?.isAdding;
+      const isEditDisabled = !editable || keyboard?.actions?.editDisabled;
+      const isAddDisabled = !!editable?.addDisabled;
+      const isMoveDisabled = !!keyboard?.actions?.moveDisabled;
+      const isBulkAction =
+        dataActions?.hasItemActions &&
+        rowSelect?.selectedRows &&
+        rowSelect.selectedRows.size > 0;
+
+      const handleKeyDown = (event: KeyboardEvent) => {
+        const rowIndex = focusedRow
+          ? data.findIndex(row => row.uuid === focusedRow.uuid)
+          : -1;
+
+        const allActions: IKeyboardAction[] = [
+          {
+            code: 'ArrowDown',
+            disabled: isEditing || isAdding || isMoveDisabled,
+            onAction: () => {
+              const nextRow = rowIndex + 1;
+              if (nextRow < data.length) {
+                // rowIndex will be -1 if no row is selected so the next row will be 0
+                setFocusedRow(data[nextRow]);
+                scrollToRow(data[nextRow].uuid);
+              }
+            },
+          },
+          {
+            code: 'ArrowUp',
+            disabled: isEditing || isAdding || isMoveDisabled,
+            onAction: () => {
+              if (rowIndex !== 0) {
+                const prevRow = rowIndex > 0 ? rowIndex - 1 : data.length - 1;
+                setFocusedRow(data[prevRow]);
+                scrollToRow(data[prevRow].uuid);
+              }
+            },
+          },
+          {
+            code: 'KeyE',
+            ctrl: true,
+            disabled: isEditing || isEditDisabled || !focusedRow,
+            onAction: () => {
+              editable?.setSelectedItem(focusedRow);
+            },
+          },
+          {
+            code: 'Enter',
+            disabled: isEditing || isAdding || !focusedRow?.onRowClick,
+            onAction: focusedRow?.onRowClick!,
+          },
+          {
+            code: 'Escape',
+            disabled: !focusedRow && !isAdding && !isEditing,
+            onAction: () =>
+              isAdding
+                ? editable?.setIsAdding(false)
+                : editable?.selectedItem
+                  ? editable?.setSelectedItem?.(null)
+                  : setFocusedRow(null),
+          },
+          {
+            code: 'Insert',
+            disabled: isAddDisabled || isAdding || isEditing,
+            onAction: () => {
+              editable?.setIsAdding(true);
+              setFocusedRow(null);
+            },
+          },
+          {
+            code: 'Delete',
+            disabled: !dataActions?.isDeletable || isEditing || !focusedRow,
+            onAction: () =>
+              itemDeleteData?.setItemToDeleteUuids(
+                isBulkAction ? Array.from(rowSelect.selectedRows) : [focusedRow!.uuid]
+              ),
+          },
+          {
+            code: 'ArrowLeft',
+            ctrl: true,
+            disabled: isEditing || isAdding,
+            onAction: () =>
+              footer!.paginationControl!.offset > 0 &&
+              footer!.paginationControl!.setOffset(footer!.paginationControl!.offset - 1),
+          },
+          {
+            code: 'ArrowRight',
+            ctrl: true,
+            disabled: isEditing || isAdding,
+            onAction: () => {
+              if (
+                footer?.noTotalRows
+                  ? footer!.paginationControl!.limit <= footer!.totalRows!
+                  : footer!.paginationControl!.offset + 1 <
+                    Math.ceil(footer!.totalRows! / footer!.paginationControl!.limit)
+              ) {
+                footer!.paginationControl!.setOffset(
+                  footer!.paginationControl!.offset + 1
+                );
+              }
+            },
+          },
+          {
+            code: 'Space',
+            disabled:
+              !dataActions?.hasItemActions || !focusedRow?.uuid || isEditing || isAdding,
+            onAction: () => {
+              const rowUuid = focusedRow?.uuid!;
+              const isRowSelected = rowSelect?.selectedRows.has(rowUuid);
+              rowSelect?.setSelectedRows(oldSet => {
+                const newSet = new Set(oldSet);
+                newSet[isRowSelected ? 'delete' : 'add'](rowUuid);
+                return newSet;
+              });
+            },
+          },
+        ];
+
+        allActions.forEach(action => {
+          if (
+            !action.disabled &&
+            action.code === event.code &&
+            !!action.ctrl === (event.ctrlKey || event.metaKey)
+          ) {
+            event.preventDefault();
+            event.stopPropagation();
+            if (
+              action.onBulkAction &&
+              dataActions?.hasItemActions &&
+              rowSelect?.selectedRows &&
+              rowSelect.selectedRows.size > 0
+            ) {
+              action.onBulkAction(Array.from(rowSelect.selectedRows));
+            } else {
+              action.onAction();
+            }
+          }
+        });
+      };
+
+      document.addEventListener('keydown', handleKeyDown);
+      return () => {
+        document.removeEventListener('keydown', handleKeyDown);
+      };
+    }
+  }, [
+    data,
+    editable,
+    keyboard,
+    dataActions?.hasItemActions,
+    dataActions?.isDeletable,
+    itemDeleteData,
+    focusedRow,
+    footer,
+    rowSelect,
+  ]);
+  return {
+    focusedRow,
+    // handleKeyDown,
+  };
+};

package/src/components/Table/hooks/localHooks/useLocalTablePagination.ts

@@ -1,12 +1,12 @@
-import { useState } from 'react';
-
-interface Props {
-  defaultLimit?: number;
-}
-
-export const useLocalTablePagination = ({ defaultLimit }: Props) => {
-  const [limit, setLimit] = useState(defaultLimit ?? 5);
-  const [offset, setOffset] = useState(0);
-
-  return { limit, offset, setLimit, setOffset };
-};
+import { useState } from 'react';
+
+interface Props {
+  defaultLimit?: number;
+}
+
+export const useLocalTablePagination = ({ defaultLimit }: Props) => {
+  const [limit, setLimit] = useState(defaultLimit ?? 5);
+  const [offset, setOffset] = useState(0);
+
+  return { limit, offset, setLimit, setOffset };
+};

package/src/components/Table/hooks/useTableColumns.ts

@@ -1,34 +1,34 @@
-import { useLayoutEffect, useMemo, useState } from 'react';
-import { ITableColumn, ITableColumnsData } from '../../../types/ITable';
-
-export interface ITableColumnsProps {
-  defaultColumns: ITableColumn[];
-  enableEdit?: boolean;
-}
-
-export const useTableColumns = ({
-  defaultColumns,
-  enableEdit,
-}: ITableColumnsProps): ITableColumnsData => {
-  const [columns, setColumns] = useState<ITableColumn[]>([]);
-
-  const availableColumns = useMemo(
-    () => defaultColumns.filter(e => !e.unavailable),
-    [defaultColumns]
-  );
-
-  useLayoutEffect(() => {
-    setColumns(availableColumns);
-  }, [availableColumns]);
-
-  const columnData = useMemo(
-    () => ({
-      defaultColumns: availableColumns,
-      columns,
-      setColumns: enableEdit ? setColumns : undefined,
-    }),
-    [availableColumns, columns, enableEdit]
-  );
-
-  return columnData;
-};
+import type { ITableColumn, ITableColumnsData } from '../../../types/ITable';
+import { useLayoutEffect, useMemo, useState } from 'react';
+
+export interface ITableColumnsProps {
+  defaultColumns: ITableColumn[];
+  enableEdit?: boolean;
+}
+
+export const useTableColumns = ({
+  defaultColumns,
+  enableEdit,
+}: ITableColumnsProps): ITableColumnsData => {
+  const [columns, setColumns] = useState<ITableColumn[]>([]);
+
+  const availableColumns = useMemo(
+    () => defaultColumns.filter(e => !e.unavailable),
+    [defaultColumns]
+  );
+
+  useLayoutEffect(() => {
+    setColumns(availableColumns);
+  }, [availableColumns]);
+
+  const columnData = useMemo(
+    () => ({
+      defaultColumns: availableColumns,
+      columns,
+      setColumns: enableEdit ? setColumns : undefined,
+    }),
+    [availableColumns, columns, enableEdit]
+  );
+
+  return columnData;
+};