@verbb/plugin-kit-react 1.0.0

package/dist/components/editable-table/TableRow.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"TableRow.js","names":[],"sources":["../../../src/components/editable-table/TableRow.jsx"],"sourcesContent":["import React from 'react';\nimport { useSortable } from '@dnd-kit/react/sortable';\nimport { RestrictToVerticalAxis } from '@dnd-kit/abstract/modifiers';\nimport { RestrictToElement } from '@dnd-kit/dom/modifiers';\nimport {\n    Button,\n    DropdownMenu,\n    DropdownMenuTrigger,\n    DropdownMenuContent,\n    DropdownMenuItem,\n    DropdownMenuSeparator,\n    TableRow as UITableRow,\n    TableCell,\n} from '@verbb/plugin-kit-react/components';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport {\n    faXmark, faArrowUp, faArrowDown, faEllipsis,\n} from '@fortawesome/pro-solid-svg-icons';\nimport { RowDataCells } from './RowDataCells';\n\nconst SortableRow = ({\n    row, rowIndex, allowReorder, className, children,\n}) => {\n    const sortable = useSortable({\n        id: row._id,\n        index: rowIndex,\n        disabled: !allowReorder,\n        modifiers: [\n            RestrictToVerticalAxis,\n            RestrictToElement.configure({\n                element: (operation) => {\n                    const sourceElement = operation?.source?.element;\n                    return sourceElement?.parentElement ?? null;\n                },\n            }),\n        ],\n    });\n\n    return (\n        <UITableRow\n            ref={sortable.ref}\n            className={cn(\n                sortable.isDragging && 'shadow-lg',\n                className,\n            )}\n        >\n            {children({ handleRef: sortable.handleRef })}\n        </UITableRow>\n    );\n};\n\nconst PlainRow = ({ className, children }) => {\n    return (\n        <UITableRow className={className}>\n            {typeof children === 'function' ? children({ handleRef: undefined }) : children}\n        </UITableRow>\n    );\n};\n\nexport const TableRow = React.memo(({\n    row,\n    rowIndex,\n    rowCount,\n    columns,\n    columnsSignature,\n    useDnd,\n    allowReorder,\n    showReorderControls,\n    allowDelete,\n    modifyColumn,\n    getCellErrors,\n    onUpdateCell,\n    moveRow,\n    removeRow,\n    t,\n    renderRowActions,\n    renderRowMenuItemsBeforeCore,\n    renderRowMenuItemsAfterCore,\n    renderRowMenuItems,\n}) => {\n    const RowComponent = useDnd ? SortableRow : PlainRow;\n\n    return (\n        <RowComponent\n            row={row}\n            rowIndex={rowIndex}\n            allowReorder={allowReorder}\n            className=\"bg-white\"\n        >\n            {({ handleRef }) => {\n                const dragHandleRef = useDnd ? handleRef : undefined;\n                const legacyBeforeRowMenuItems = renderRowMenuItems?.({\n                    row,\n                    rowIndex,\n                    rowCount,\n                });\n                const customRowMenuItemsBeforeCore = renderRowMenuItemsBeforeCore?.({\n                    row,\n                    rowIndex,\n                    rowCount,\n                }) ?? legacyBeforeRowMenuItems;\n                const customRowMenuItemsAfterCore = renderRowMenuItemsAfterCore?.({\n                    row,\n                    rowIndex,\n                    rowCount,\n                });\n                const hasCustomRowMenuItemsBeforeCore = Boolean(customRowMenuItemsBeforeCore);\n                const hasCustomRowMenuItemsAfterCore = Boolean(customRowMenuItemsAfterCore);\n                const hasMoveActions = showReorderControls && rowCount > 1;\n                const hasMenuActions = hasMoveActions || hasCustomRowMenuItemsBeforeCore || hasCustomRowMenuItemsAfterCore;\n\n                return (\n                    <>\n                        <RowDataCells\n                            row={row}\n                            rowIndex={rowIndex}\n                            columns={columns}\n                            columnsSignature={columnsSignature}\n                            modifyColumn={modifyColumn}\n                            getCellErrors={getCellErrors}\n                            onUpdateCell={onUpdateCell}\n                        />\n                        {(showReorderControls || allowDelete) && (\n                            <TableCell className={cn(\n                                'bg-[#fbfcfe]',\n                            )}>\n                                <div className=\"flex items-center px-1\">\n                                    {showReorderControls && (\n                                        <span ref={dragHandleRef}>\n                                            <Button\n                                                type=\"button\"\n                                                variant=\"none\"\n                                                size=\"xs\"\n                                                disabled={!useDnd}\n                                                className={cn(\n                                                    'cursor-move',\n                                                    'p-0 w-[24px] h-[24px]',\n                                                    'text-gray-500',\n                                                    'hover:bg-transparent',\n                                                    'active:bg-transparent',\n                                                    'hover:text-blue-500',\n                                                    !useDnd && 'opacity-40 cursor-default',\n                                                )}\n                                            >\n                                                <div className=\"size-3\">\n                                                    <svg xmlns=\"http://www.w3.org/2000/svg\" viewBox=\"0 0 448 512\" focusable=\"false\" aria-hidden=\"true\"><path fill=\"currentColor\" d=\"M71.3 295.6c-21.9-21.9-21.9-57.3 0-79.2s57.3-21.9 79.2 0 21.9 57.3 0 79.2s-57.4 21.9-79.2 0zM184.4 182.5c-21.9-21.9-21.9-57.3 0-79.2s57.3-21.9 79.2 0 21.9 57.3 0 79.2-57.3 21.8-79.2 0zm0 147c21.9-21.9 57.3-21.9 79.2 0s21.9 57.3 0 79.2s-57.3 21.9-79.2 0c-21.9-21.8-21.9-57.3 0-79.2zM297.5 216.4c21.9-21.9 57.3-21.9 79.2 0s21.9 57.3 0 79.2s-57.3 21.9-79.2 0c-21.8-21.9-21.8-57.3 0-79.2z\"></path></svg>\n                                                </div>\n                                            </Button>\n                                        </span>\n                                    )}\n                                    {showReorderControls && (\n                                        <DropdownMenu>\n                                            <DropdownMenuTrigger\n                                                render={(\n                                                    <Button\n                                                        type=\"button\"\n                                                        variant=\"none\"\n                                                        size=\"xs\"\n                                                        disabled={!hasMenuActions}\n                                                        className={cn(\n                                                            'p-0 w-[24px] h-[24px]',\n                                                            'text-gray-500',\n                                                            'hover:bg-transparent',\n                                                            'active:bg-transparent',\n                                                            'hover:text-blue-500',\n                                                            !hasMenuActions && 'opacity-40 cursor-not-allowed',\n                                                        )}\n                                                        aria-label={t('Row actions')}\n                                                    />\n                                                )}\n                                            >\n                                                <FontAwesomeIcon icon={faEllipsis} className=\"size-[12px]\" />\n                                            </DropdownMenuTrigger>\n                                            <DropdownMenuContent align=\"end\">\n                                                {customRowMenuItemsBeforeCore}\n                                                {hasCustomRowMenuItemsBeforeCore && hasMoveActions && <DropdownMenuSeparator />}\n                                                {showReorderControls && rowIndex > 0 && (\n                                                    <DropdownMenuItem onClick={() => { return moveRow(row, -1); }}>\n                                                        <FontAwesomeIcon icon={faArrowUp} />\n                                                        {t('Move up')}\n                                                    </DropdownMenuItem>\n                                                )}\n                                                {showReorderControls && rowIndex < rowCount - 1 && (\n                                                    <DropdownMenuItem onClick={() => { return moveRow(row, 1); }}>\n                                                        <FontAwesomeIcon icon={faArrowDown} />\n                                                        {t('Move down')}\n                                                    </DropdownMenuItem>\n                                                )}\n                                                {hasMoveActions && hasCustomRowMenuItemsAfterCore && <DropdownMenuSeparator />}\n                                                {customRowMenuItemsAfterCore}\n                                            </DropdownMenuContent>\n                                        </DropdownMenu>\n                                    )}\n                                    {renderRowActions?.({\n                                        row,\n                                        rowIndex,\n                                        rowCount,\n                                    })}\n                                    {allowDelete && (\n                                        <Button\n                                            type=\"button\"\n                                            variant=\"none\"\n                                            size=\"xs\"\n                                            onClick={() => { return removeRow(row); }}\n                                            className={cn(\n                                                'p-0 w-[24px] h-[24px]',\n                                                'text-gray-500',\n                                                'hover:bg-transparent',\n                                                'active:bg-transparent',\n                                                'hover:text-red-500',\n                                            )}\n                                        >\n                                            <FontAwesomeIcon icon={faXmark} className=\"size-[12px] mt-[2px]\" />\n                                        </Button>\n                                    )}\n                                </div>\n                            </TableCell>\n                        )}\n                    </>\n                );\n            }}\n        </RowComponent>\n    );\n}, (prevProps, nextProps) => {\n    return (\n        prevProps.row === nextProps.row\n        && prevProps.rowIndex === nextProps.rowIndex\n        && prevProps.rowCount === nextProps.rowCount\n        && prevProps.columnsSignature === nextProps.columnsSignature\n        && prevProps.getCellErrors === nextProps.getCellErrors\n        && prevProps.useDnd === nextProps.useDnd\n        && prevProps.allowReorder === nextProps.allowReorder\n        && prevProps.showReorderControls === nextProps.showReorderControls\n        && prevProps.allowDelete === nextProps.allowDelete\n        && prevProps.renderRowActions === nextProps.renderRowActions\n        && prevProps.renderRowMenuItemsBeforeCore === nextProps.renderRowMenuItemsBeforeCore\n        && prevProps.renderRowMenuItemsAfterCore === nextProps.renderRowMenuItemsAfterCore\n        && prevProps.renderRowMenuItems === nextProps.renderRowMenuItems\n    );\n});\n"],"mappings":"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"}

package/dist/components/editable-table/helpers.d.ts

@@ -0,0 +1,12 @@
+import { EditableTableColumn } from './types';
+export declare const GENERATED_CELL_MODE: {
+    readonly EMPTY: "empty";
+    readonly AUTO: "auto";
+    readonly MANUAL: "manual";
+    readonly SEEDED: "seeded";
+};
+export declare const isGeneratedColumn: (column: EditableTableColumn) => string | false | undefined;
+export declare const isThinColumn: (column: EditableTableColumn) => boolean;
+export declare const getGeneratedCellKey: (rowId: string, columnName: string) => string;
+export declare const isEmptyCellValue: (value: unknown) => value is "" | null | undefined;
+//# sourceMappingURL=helpers.d.ts.map

package/dist/components/editable-table/helpers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/helpers.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,SAAS,CAAC;AAEnD,eAAO,MAAM,mBAAmB;;;;;CAKtB,CAAC;AAEX,eAAO,MAAM,iBAAiB,GAAI,QAAQ,mBAAmB,+BAE5D,CAAC;AAEF,eAAO,MAAM,YAAY,GAAI,QAAQ,mBAAmB,YAEvD,CAAC;AAEF,eAAO,MAAM,mBAAmB,GAAI,OAAO,MAAM,EAAE,YAAY,MAAM,WAEpE,CAAC;AAEF,eAAO,MAAM,gBAAgB,GAAI,OAAO,OAAO,mCAE9C,CAAC"}

package/dist/components/editable-table/helpers.js

@@ -0,0 +1,23 @@
+//#region src/components/editable-table/helpers.ts
+var GENERATED_CELL_MODE = {
+	EMPTY: "empty",
+	AUTO: "auto",
+	MANUAL: "manual",
+	SEEDED: "seeded"
+};
+var isGeneratedColumn = (column) => {
+	return (column?.type === "handle" || column?.type === "value") && column?.name && column?.source;
+};
+var isThinColumn = (column) => {
+	return Boolean(column?.thin || column?.type === "checkbox" || column?.type === "lightswitch" || column?.type === "radio");
+};
+var getGeneratedCellKey = (rowId, columnName) => {
+	return `${rowId}:${columnName}`;
+};
+var isEmptyCellValue = (value) => {
+	return value === void 0 || value === null || value === "";
+};
+//#endregion
+export { GENERATED_CELL_MODE, getGeneratedCellKey, isEmptyCellValue, isGeneratedColumn, isThinColumn };
+
+//# sourceMappingURL=helpers.js.map

package/dist/components/editable-table/helpers.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"helpers.js","names":[],"sources":["../../../src/components/editable-table/helpers.ts"],"sourcesContent":["import type { EditableTableColumn } from './types';\n\nexport const GENERATED_CELL_MODE = {\n    EMPTY: 'empty',\n    AUTO: 'auto',\n    MANUAL: 'manual',\n    SEEDED: 'seeded',\n} as const;\n\nexport const isGeneratedColumn = (column: EditableTableColumn) => {\n    return (column?.type === 'handle' || column?.type === 'value') && column?.name && column?.source;\n};\n\nexport const isThinColumn = (column: EditableTableColumn) => {\n    return Boolean(column?.thin || column?.type === 'checkbox' || column?.type === 'lightswitch' || column?.type === 'radio');\n};\n\nexport const getGeneratedCellKey = (rowId: string, columnName: string) => {\n    return `${rowId}:${columnName}`;\n};\n\nexport const isEmptyCellValue = (value: unknown) => {\n    return value === undefined || value === null || value === '';\n};\n"],"mappings":";AAEA,IAAa,sBAAsB;CAC/B,OAAO;CACP,MAAM;CACN,QAAQ;CACR,QAAQ;CACX;AAED,IAAa,qBAAqB,WAAgC;AAC9D,SAAQ,QAAQ,SAAS,YAAY,QAAQ,SAAS,YAAY,QAAQ,QAAQ,QAAQ;;AAG9F,IAAa,gBAAgB,WAAgC;AACzD,QAAO,QAAQ,QAAQ,QAAQ,QAAQ,SAAS,cAAc,QAAQ,SAAS,iBAAiB,QAAQ,SAAS,QAAQ;;AAG7H,IAAa,uBAAuB,OAAe,eAAuB;AACtE,QAAO,GAAG,MAAM,GAAG;;AAGvB,IAAa,oBAAoB,UAAmB;AAChD,QAAO,UAAU,KAAA,KAAa,UAAU,QAAQ,UAAU"}

package/dist/components/editable-table/index.d.ts

@@ -0,0 +1,4 @@
+export * from './RowDataCells';
+export * from './TableCell';
+export * from './TableRow';
+//# sourceMappingURL=index.d.ts.map

package/dist/components/editable-table/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/index.ts"],"names":[],"mappings":"AAAA,cAAc,gBAAgB,CAAC;AAC/B,cAAc,aAAa,CAAC;AAC5B,cAAc,YAAY,CAAC"}

package/dist/components/editable-table/index.js

@@ -0,0 +1,4 @@
+import { TableCell } from "./TableCell.js";
+import { RowDataCells } from "./RowDataCells.js";
+import { TableRow } from "./TableRow.js";
+export { RowDataCells, TableCell, TableRow };

package/dist/components/editable-table/types.d.ts

@@ -0,0 +1,43 @@
+import { default as React } from 'react';
+import { VariableCategories } from '../tiptap/VariableDropdown';
+export type EditableTableRow = Record<string, unknown> & {
+    _id: string;
+};
+export type EditableTableColumn = {
+    name: string;
+    type?: string;
+    label?: string;
+    required?: boolean;
+    placeholder?: string;
+    options?: unknown[];
+    className?: string;
+    contentClassName?: string;
+    thin?: boolean;
+    source?: string;
+    allowUnselect?: boolean;
+    noneOptionLabel?: string;
+    showActionsMenu?: boolean;
+    variableCategories?: VariableCategories;
+    variableCategoryLabels?: Record<string, string>;
+    variableCategoryOrder?: string[];
+    onChange?: (newValue: unknown, row: EditableTableRow, columnName: string) => void;
+    renderCell?: (args: EditableTableRenderCellArgs) => React.ReactNode;
+    [key: string]: unknown;
+};
+export type EditableTableModifyColumn = (row: EditableTableRow, columnName: string) => Partial<EditableTableColumn> | null | undefined;
+export type EditableTableRowActionArgs = {
+    row: EditableTableRow;
+    rowIndex: number;
+    rowCount: number;
+};
+export type EditableTableOnCellChange = (rowIndex: number, columnName: string, value: unknown, row: EditableTableRow) => void;
+export type EditableTableRenderCellArgs = {
+    column: EditableTableColumn;
+    value: unknown;
+    row: EditableTableRow;
+    rowIndex: number;
+    isInvalid: boolean;
+    updateValue: (newValue: unknown) => void;
+    cellErrors: unknown[];
+};
+//# sourceMappingURL=types.d.ts.map

package/dist/components/editable-table/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAC/B,OAAO,KAAK,EAAE,kBAAkB,EAAE,MAAM,4DAA4D,CAAC;AAErG,MAAM,MAAM,gBAAgB,GAAG,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,GAAG;IACrD,GAAG,EAAE,MAAM,CAAC;CACf,CAAC;AAEF,MAAM,MAAM,mBAAmB,GAAG;IAC9B,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,OAAO,EAAE,CAAC;IACpB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,IAAI,CAAC,EAAE,OAAO,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,aAAa,CAAC,EAAE,OAAO,CAAC;IACxB,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,kBAAkB,CAAC,EAAE,kBAAkB,CAAC;IACxC,sBAAsB,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IAChD,qBAAqB,CAAC,EAAE,MAAM,EAAE,CAAC;IACjC,QAAQ,CAAC,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,gBAAgB,EAAE,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IAClF,UAAU,CAAC,EAAE,CAAC,IAAI,EAAE,2BAA2B,KAAK,KAAK,CAAC,SAAS,CAAC;IACpE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CAC1B,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,CACpC,GAAG,EAAE,gBAAgB,EACrB,UAAU,EAAE,MAAM,KACjB,OAAO,CAAC,mBAAmB,CAAC,GAAG,IAAI,GAAG,SAAS,CAAC;AAErD,MAAM,MAAM,0BAA0B,GAAG;IACrC,GAAG,EAAE,gBAAgB,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;CACpB,CAAC;AAEF,MAAM,MAAM,yBAAyB,GAAG,CACpC,QAAQ,EAAE,MAAM,EAChB,UAAU,EAAE,MAAM,EAClB,KAAK,EAAE,OAAO,EACd,GAAG,EAAE,gBAAgB,KACpB,IAAI,CAAC;AAEV,MAAM,MAAM,2BAA2B,GAAG;IACtC,MAAM,EAAE,mBAAmB,CAAC;IAC5B,KAAK,EAAE,OAAO,CAAC;IACf,GAAG,EAAE,gBAAgB,CAAC;IACtB,QAAQ,EAAE,MAAM,CAAC;IACjB,SAAS,EAAE,OAAO,CAAC;IACnB,WAAW,EAAE,CAAC,QAAQ,EAAE,OAAO,KAAK,IAAI,CAAC;IACzC,UAAU,EAAE,OAAO,EAAE,CAAC;CACzB,CAAC"}

package/dist/components/editable-table/useEditableTableCellChange.d.ts

@@ -0,0 +1,17 @@
+import { MutableRefObject, Dispatch, SetStateAction } from 'react';
+import { EditableTableColumn, EditableTableOnCellChange, EditableTableRow } from './types';
+type UseEditableTableCellChangeArgs = {
+    internalData: EditableTableRow[];
+    internalDataRef: MutableRefObject<EditableTableRow[]>;
+    setInternalData: Dispatch<SetStateAction<EditableTableRow[]>>;
+    skipNextRowsSyncRef: MutableRefObject<number>;
+    generatedColumns: EditableTableColumn[];
+    onCellChange?: EditableTableOnCellChange | null;
+    updateRow: (row: EditableTableRow, updates: Record<string, unknown>) => void;
+    handleChange: (rows: EditableTableRow[]) => void;
+};
+export declare const useEditableTableCellChange: ({ internalData, internalDataRef, setInternalData, skipNextRowsSyncRef, generatedColumns, onCellChange, updateRow, handleChange, }: UseEditableTableCellChangeArgs) => {
+    handleCellValueChange: (rowIndex: number, row: EditableTableRow, column: EditableTableColumn, newValue: unknown) => void;
+};
+export {};
+//# sourceMappingURL=useEditableTableCellChange.d.ts.map

package/dist/components/editable-table/useEditableTableCellChange.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableCellChange.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/useEditableTableCellChange.ts"],"names":[],"mappings":"AAAA,OAAO,EAIH,KAAK,gBAAgB,EACrB,KAAK,QAAQ,EACb,KAAK,cAAc,EACtB,MAAM,OAAO,CAAC;AAWf,OAAO,KAAK,EACR,mBAAmB,EACnB,yBAAyB,EACzB,gBAAgB,EACnB,MAAM,SAAS,CAAC;AAEjB,KAAK,8BAA8B,GAAG;IAClC,YAAY,EAAE,gBAAgB,EAAE,CAAA;IAChC,eAAe,EAAE,gBAAgB,CAAC,gBAAgB,EAAE,CAAC,CAAA;IACrD,eAAe,EAAE,QAAQ,CAAC,cAAc,CAAC,gBAAgB,EAAE,CAAC,CAAC,CAAA;IAC7D,mBAAmB,EAAE,gBAAgB,CAAC,MAAM,CAAC,CAAA;IAC7C,gBAAgB,EAAE,mBAAmB,EAAE,CAAA;IACvC,YAAY,CAAC,EAAE,yBAAyB,GAAG,IAAI,CAAA;IAC/C,SAAS,EAAE,CAAC,GAAG,EAAE,gBAAgB,EAAE,OAAO,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,KAAK,IAAI,CAAA;IAC5E,YAAY,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAA;CACnD,CAAC;AASF,eAAO,MAAM,0BAA0B,GAAI,mIASxC,8BAA8B;sCA4DwB,MAAM,OAAO,gBAAgB,UAAU,mBAAmB,YAAY,OAAO;CA8IrI,CAAC"}

package/dist/components/editable-table/useEditableTableCellChange.js

@@ -0,0 +1,152 @@
+import { utils_exports } from "../../utils/index.js";
+import { GENERATED_CELL_MODE, getGeneratedCellKey, isEmptyCellValue, isGeneratedColumn } from "./helpers.js";
+import { useCallback, useEffect, useRef } from "react";
+//#region src/components/editable-table/useEditableTableCellChange.ts
+var useEditableTableCellChange = ({ internalData, internalDataRef, setInternalData, skipNextRowsSyncRef, generatedColumns, onCellChange, updateRow, handleChange }) => {
+	const pendingCellChangesRef = useRef(/* @__PURE__ */ new Map());
+	const cellChangesRafRef = useRef(null);
+	const generatedCellModesRef = useRef(/* @__PURE__ */ new Map());
+	useEffect(() => {
+		if (internalData.length === 0 || generatedColumns.length === 0) {
+			generatedCellModesRef.current.clear();
+			return;
+		}
+		const validKeys = /* @__PURE__ */ new Set();
+		internalData.forEach((row) => {
+			generatedColumns.forEach((column) => {
+				const key = getGeneratedCellKey(row._id, column.name);
+				validKeys.add(key);
+				if (generatedCellModesRef.current.has(key)) return;
+				const value = row[column.name];
+				generatedCellModesRef.current.set(key, isEmptyCellValue(value) ? GENERATED_CELL_MODE.EMPTY : GENERATED_CELL_MODE.SEEDED);
+			});
+		});
+		Array.from(generatedCellModesRef.current.keys()).forEach((key) => {
+			if (!validKeys.has(key)) generatedCellModesRef.current.delete(key);
+		});
+	}, [generatedColumns, internalData]);
+	const flushPendingCellChanges = useCallback(() => {
+		cellChangesRafRef.current = null;
+		if (!onCellChange || pendingCellChangesRef.current.size === 0) return;
+		const entries = Array.from(pendingCellChangesRef.current.values());
+		pendingCellChangesRef.current.clear();
+		entries.forEach(({ rowIndex, columnName, value, row }) => {
+			onCellChange(rowIndex, columnName, value, row);
+		});
+	}, [onCellChange]);
+	useEffect(() => {
+		return () => {
+			if (cellChangesRafRef.current !== null && typeof cancelAnimationFrame === "function") cancelAnimationFrame(cellChangesRafRef.current);
+			flushPendingCellChanges();
+		};
+	}, [flushPendingCellChanges]);
+	return { handleCellValueChange: useCallback((rowIndex, row, column, newValue) => {
+		if (column.type === "radio") {
+			const nextChecked = Boolean(newValue);
+			const updatesByRowId = /* @__PURE__ */ new Map();
+			const allowUnselect = Boolean(column.allowUnselect);
+			if (nextChecked) internalDataRef.current.forEach((item) => {
+				const currentValue = Boolean(item[column.name]);
+				const targetValue = item._id === row._id;
+				if (currentValue !== targetValue) updatesByRowId.set(item._id, { [column.name]: targetValue });
+			});
+			else if (allowUnselect && Boolean(row[column.name])) updatesByRowId.set(row._id, { [column.name]: false });
+			else return;
+			if (updatesByRowId.size === 0) return;
+			const nextData = internalDataRef.current.map((item) => {
+				const rowUpdates = updatesByRowId.get(item._id);
+				return rowUpdates ? {
+					...item,
+					...rowUpdates
+				} : item;
+			});
+			skipNextRowsSyncRef.current += 1;
+			setInternalData(nextData);
+			if (onCellChange) {
+				updatesByRowId.forEach((updates, rowId) => {
+					const targetRow = internalDataRef.current.find((item) => {
+						return item._id === rowId;
+					});
+					const targetRowIndex = internalDataRef.current.findIndex((item) => {
+						return item._id === rowId;
+					});
+					if (!targetRow || targetRowIndex === -1) return;
+					Object.entries(updates).forEach(([columnName, value]) => {
+						const key = `${rowId || targetRowIndex}:${columnName}`;
+						pendingCellChangesRef.current.set(key, {
+							rowIndex: targetRowIndex,
+							columnName,
+							value,
+							row: targetRow
+						});
+					});
+				});
+				if (cellChangesRafRef.current === null) if (typeof requestAnimationFrame === "function") cellChangesRafRef.current = requestAnimationFrame(flushPendingCellChanges);
+				else flushPendingCellChanges();
+				return;
+			}
+			handleChange(nextData);
+			return;
+		}
+		if (isGeneratedColumn(column)) {
+			const targetKey = getGeneratedCellKey(row._id, column.name);
+			generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.MANUAL);
+		}
+		const sourceUpdate = { [column.name]: newValue };
+		const derivedUpdates = {};
+		generatedColumns.forEach((targetColumn) => {
+			if (targetColumn.source !== column.name) return;
+			const targetKey = getGeneratedCellKey(row._id, targetColumn.name);
+			const currentTargetValue = row[targetColumn.name];
+			const existingMode = generatedCellModesRef.current.get(targetKey) ?? (isEmptyCellValue(currentTargetValue) ? GENERATED_CELL_MODE.EMPTY : GENERATED_CELL_MODE.SEEDED);
+			if (existingMode === GENERATED_CELL_MODE.MANUAL || existingMode === GENERATED_CELL_MODE.SEEDED) return;
+			if (targetColumn.type === "handle") {
+				derivedUpdates[targetColumn.name] = (0, utils_exports.generateHandle)(String(newValue ?? ""));
+				generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.AUTO);
+			} else if (targetColumn.type === "value") {
+				derivedUpdates[targetColumn.name] = newValue;
+				generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.AUTO);
+			}
+		});
+		const allUpdates = {
+			...sourceUpdate,
+			...derivedUpdates
+		};
+		if (!Object.entries(allUpdates).some(([key, value]) => {
+			return row[key] !== value;
+		})) return;
+		if (column.onChange) column.onChange(newValue, row, column.name);
+		if (onCellChange) {
+			skipNextRowsSyncRef.current += 1;
+			setInternalData((prevData) => {
+				return (0, utils_exports.updateItem)(prevData, row, allUpdates);
+			});
+			Object.entries(allUpdates).forEach(([columnName, value]) => {
+				const key = `${row._id || rowIndex}:${columnName}`;
+				pendingCellChangesRef.current.set(key, {
+					rowIndex,
+					columnName,
+					value,
+					row
+				});
+			});
+			if (cellChangesRafRef.current === null) if (typeof requestAnimationFrame === "function") cellChangesRafRef.current = requestAnimationFrame(flushPendingCellChanges);
+			else flushPendingCellChanges();
+			return;
+		}
+		updateRow(row, allUpdates);
+	}, [
+		flushPendingCellChanges,
+		generatedColumns,
+		handleChange,
+		internalDataRef,
+		onCellChange,
+		setInternalData,
+		skipNextRowsSyncRef,
+		updateRow
+	]) };
+};
+//#endregion
+export { useEditableTableCellChange };
+
+//# sourceMappingURL=useEditableTableCellChange.js.map

package/dist/components/editable-table/useEditableTableCellChange.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableCellChange.js","names":[],"sources":["../../../src/components/editable-table/useEditableTableCellChange.ts"],"sourcesContent":["import {\n    useCallback,\n    useEffect,\n    useRef,\n    type MutableRefObject,\n    type Dispatch,\n    type SetStateAction,\n} from 'react';\nimport {\n    updateItem,\n    generateHandle,\n} from '@verbb/plugin-kit-react/utils';\nimport {\n    GENERATED_CELL_MODE,\n    isGeneratedColumn,\n    getGeneratedCellKey,\n    isEmptyCellValue,\n} from './helpers';\nimport type {\n    EditableTableColumn,\n    EditableTableOnCellChange,\n    EditableTableRow,\n} from './types';\n\ntype UseEditableTableCellChangeArgs = {\n    internalData: EditableTableRow[]\n    internalDataRef: MutableRefObject<EditableTableRow[]>\n    setInternalData: Dispatch<SetStateAction<EditableTableRow[]>>\n    skipNextRowsSyncRef: MutableRefObject<number>\n    generatedColumns: EditableTableColumn[]\n    onCellChange?: EditableTableOnCellChange | null\n    updateRow: (row: EditableTableRow, updates: Record<string, unknown>) => void\n    handleChange: (rows: EditableTableRow[]) => void\n};\n\ntype PendingCellChange = {\n    rowIndex: number;\n    columnName: string;\n    value: unknown;\n    row: EditableTableRow;\n};\n\nexport const useEditableTableCellChange = ({\n    internalData,\n    internalDataRef,\n    setInternalData,\n    skipNextRowsSyncRef,\n    generatedColumns,\n    onCellChange,\n    updateRow,\n    handleChange,\n}: UseEditableTableCellChangeArgs) => {\n    const pendingCellChangesRef = useRef<Map<string, PendingCellChange>>(new Map());\n    const cellChangesRafRef = useRef<number | null>(null);\n    const generatedCellModesRef = useRef<Map<string, string>>(new Map());\n\n    useEffect(() => {\n        if (internalData.length === 0 || generatedColumns.length === 0) {\n            generatedCellModesRef.current.clear();\n            return;\n        }\n\n        const validKeys = new Set<string>();\n\n        internalData.forEach((row) => {\n            generatedColumns.forEach((column) => {\n                const key = getGeneratedCellKey(row._id, column.name);\n                validKeys.add(key);\n\n                if (generatedCellModesRef.current.has(key)) {\n                    return;\n                }\n\n                const value = row[column.name];\n                generatedCellModesRef.current.set(key, isEmptyCellValue(value) ? GENERATED_CELL_MODE.EMPTY : GENERATED_CELL_MODE.SEEDED);\n            });\n        });\n\n        Array.from(generatedCellModesRef.current.keys()).forEach((key) => {\n            if (!validKeys.has(key)) {\n                generatedCellModesRef.current.delete(key);\n            }\n        });\n    }, [generatedColumns, internalData]);\n\n    const flushPendingCellChanges = useCallback(() => {\n        cellChangesRafRef.current = null;\n\n        if (!onCellChange || pendingCellChangesRef.current.size === 0) {\n            return;\n        }\n\n        const entries = Array.from(pendingCellChangesRef.current.values());\n        pendingCellChangesRef.current.clear();\n        entries.forEach(({\n            rowIndex, columnName, value, row,\n        }) => {\n            onCellChange(rowIndex, columnName, value, row);\n        });\n    }, [onCellChange]);\n\n    useEffect(() => {\n        return () => {\n            if (cellChangesRafRef.current !== null && typeof cancelAnimationFrame === 'function') {\n                cancelAnimationFrame(cellChangesRafRef.current);\n            }\n\n            flushPendingCellChanges();\n        };\n    }, [flushPendingCellChanges]);\n\n    const handleCellValueChange = useCallback((rowIndex: number, row: EditableTableRow, column: EditableTableColumn, newValue: unknown) => {\n        if (column.type === 'radio') {\n            const nextChecked = Boolean(newValue);\n            const updatesByRowId = new Map<string, Record<string, unknown>>();\n            const allowUnselect = Boolean(column.allowUnselect);\n\n            if (nextChecked) {\n                internalDataRef.current.forEach((item) => {\n                    const currentValue = Boolean(item[column.name]);\n                    const targetValue = item._id === row._id;\n                    if (currentValue !== targetValue) {\n                        updatesByRowId.set(item._id, { [column.name]: targetValue });\n                    }\n                });\n            } else if (allowUnselect && Boolean(row[column.name])) {\n                updatesByRowId.set(row._id, { [column.name]: false });\n            } else {\n                return;\n            }\n\n            if (updatesByRowId.size === 0) {\n                return;\n            }\n\n            const nextData = internalDataRef.current.map((item) => {\n                const rowUpdates = updatesByRowId.get(item._id);\n                return rowUpdates ? { ...item, ...rowUpdates } : item;\n            });\n\n            skipNextRowsSyncRef.current += 1;\n            setInternalData(nextData);\n\n            if (onCellChange) {\n                updatesByRowId.forEach((updates, rowId) => {\n                    const targetRow = internalDataRef.current.find((item) => { return item._id === rowId; });\n                    const targetRowIndex = internalDataRef.current.findIndex((item) => { return item._id === rowId; });\n                    if (!targetRow || targetRowIndex === -1) {\n                        return;\n                    }\n\n                    Object.entries(updates).forEach(([columnName, value]) => {\n                        const key = `${rowId || targetRowIndex}:${columnName}`;\n                        pendingCellChangesRef.current.set(key, {\n                            rowIndex: targetRowIndex,\n                            columnName,\n                            value,\n                            row: targetRow,\n                        });\n                    });\n                });\n\n                if (cellChangesRafRef.current === null) {\n                    if (typeof requestAnimationFrame === 'function') {\n                        cellChangesRafRef.current = requestAnimationFrame(flushPendingCellChanges);\n                    } else {\n                        flushPendingCellChanges();\n                    }\n                }\n\n                return;\n            }\n\n            handleChange(nextData);\n            return;\n        }\n\n        if (isGeneratedColumn(column)) {\n            const targetKey = getGeneratedCellKey(row._id, column.name);\n            generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.MANUAL);\n        }\n\n        const sourceUpdate = { [column.name]: newValue };\n        const derivedUpdates: Record<string, unknown> = {};\n\n        generatedColumns.forEach((targetColumn) => {\n            if (targetColumn.source !== column.name) {\n                return;\n            }\n\n            const targetKey = getGeneratedCellKey(row._id, targetColumn.name);\n            const currentTargetValue = row[targetColumn.name];\n            const existingMode = generatedCellModesRef.current.get(targetKey)\n                ?? (isEmptyCellValue(currentTargetValue) ? GENERATED_CELL_MODE.EMPTY : GENERATED_CELL_MODE.SEEDED);\n\n            if (existingMode === GENERATED_CELL_MODE.MANUAL || existingMode === GENERATED_CELL_MODE.SEEDED) {\n                return;\n            }\n\n            if (targetColumn.type === 'handle') {\n                derivedUpdates[targetColumn.name] = generateHandle(String(newValue ?? ''));\n                generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.AUTO);\n            } else if (targetColumn.type === 'value') {\n                derivedUpdates[targetColumn.name] = newValue;\n                generatedCellModesRef.current.set(targetKey, GENERATED_CELL_MODE.AUTO);\n            }\n        });\n\n        const allUpdates = { ...sourceUpdate, ...derivedUpdates };\n        const hasRealChange = Object.entries(allUpdates).some(([key, value]) => {\n            return row[key] !== value;\n        });\n        if (!hasRealChange) {\n            return;\n        }\n\n        if (column.onChange) {\n            column.onChange(newValue, row, column.name);\n        }\n\n        if (onCellChange) {\n            skipNextRowsSyncRef.current += 1;\n            setInternalData((prevData) => {\n                return updateItem(prevData, row, allUpdates);\n            });\n\n            Object.entries(allUpdates).forEach(([columnName, value]) => {\n                const key = `${row._id || rowIndex}:${columnName}`;\n                pendingCellChangesRef.current.set(key, {\n                    rowIndex,\n                    columnName,\n                    value,\n                    row,\n                });\n            });\n\n            if (cellChangesRafRef.current === null) {\n                if (typeof requestAnimationFrame === 'function') {\n                    cellChangesRafRef.current = requestAnimationFrame(flushPendingCellChanges);\n                } else {\n                    flushPendingCellChanges();\n                }\n            }\n\n            return;\n        }\n\n        updateRow(row, allUpdates);\n    }, [flushPendingCellChanges, generatedColumns, handleChange, internalDataRef, onCellChange, setInternalData, skipNextRowsSyncRef, updateRow]);\n\n    return {\n        handleCellValueChange,\n    };\n};\n"],"mappings":"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"}

package/dist/components/editable-table/useEditableTableDnd.d.ts

@@ -0,0 +1,18 @@
+import { EditableTableRow } from './types';
+export declare const useEditableTableDnd: ({ allowReorder, internalData, handleChange, }: {
+    allowReorder: boolean;
+    internalData: EditableTableRow[];
+    handleChange: (rows: EditableTableRow[]) => void;
+}) => {
+    isDragging: boolean;
+    isDndHydrated: boolean;
+    effectiveAllowReorder: boolean;
+    handleDragStart: () => void;
+    handleDragEnd: (event: {
+        canceled?: boolean;
+        operation?: {
+            source?: unknown;
+        };
+    }) => void;
+};
+//# sourceMappingURL=useEditableTableDnd.d.ts.map

package/dist/components/editable-table/useEditableTableDnd.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableDnd.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/useEditableTableDnd.ts"],"names":[],"mappings":"AAIA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAEhD,eAAO,MAAM,mBAAmB,GAAI,+CAIjC;IACC,YAAY,EAAE,OAAO,CAAA;IACrB,YAAY,EAAE,gBAAgB,EAAE,CAAA;IAChC,YAAY,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAA;CACnD;;;;;2BAmC6C;QAAE,QAAQ,CAAC,EAAE,OAAO,CAAC;QAAC,SAAS,CAAC,EAAE;YAAE,MAAM,CAAC,EAAE,OAAO,CAAA;SAAE,CAAA;KAAE;CA6CrG,CAAC"}

package/dist/components/editable-table/useEditableTableDnd.js

@@ -0,0 +1,55 @@
+import { useCallback, useEffect, useState } from "react";
+import { isSortable } from "@dnd-kit/react/sortable";
+//#region src/components/editable-table/useEditableTableDnd.ts
+var useEditableTableDnd = ({ allowReorder, internalData, handleChange }) => {
+	const [isDragging, setIsDragging] = useState(false);
+	const [isDndHydrated, setIsDndHydrated] = useState(false);
+	useEffect(() => {
+		if (!allowReorder) {
+			setIsDndHydrated(false);
+			return;
+		}
+		let idleId = null;
+		let timeoutId = null;
+		const enableDnd = () => {
+			setIsDndHydrated(true);
+		};
+		if (typeof window !== "undefined" && typeof window.requestIdleCallback === "function") idleId = window.requestIdleCallback(enableDnd, { timeout: 1200 });
+		else timeoutId = setTimeout(enableDnd, 250);
+		return () => {
+			if (idleId !== null && typeof window !== "undefined" && typeof window.cancelIdleCallback === "function") window.cancelIdleCallback(idleId);
+			if (timeoutId !== null) clearTimeout(timeoutId);
+		};
+	}, [allowReorder]);
+	return {
+		isDragging,
+		isDndHydrated,
+		effectiveAllowReorder: allowReorder,
+		handleDragStart: useCallback(() => {
+			setIsDragging(true);
+		}, []),
+		handleDragEnd: useCallback((event) => {
+			setIsDragging(false);
+			if (!allowReorder) return;
+			if (event.canceled) return;
+			const { source } = event.operation ?? {};
+			if (!isSortable(source)) return;
+			if (!("initialIndex" in source) || typeof source.initialIndex !== "number") return;
+			const { initialIndex, index } = source;
+			if (initialIndex === index) return;
+			if (initialIndex < 0 || index < 0 || initialIndex >= internalData.length || index >= internalData.length) return;
+			const nextRows = [...internalData];
+			const [movedRow] = nextRows.splice(initialIndex, 1);
+			nextRows.splice(index, 0, movedRow);
+			handleChange(nextRows);
+		}, [
+			allowReorder,
+			handleChange,
+			internalData
+		])
+	};
+};
+//#endregion
+export { useEditableTableDnd };
+
+//# sourceMappingURL=useEditableTableDnd.js.map

package/dist/components/editable-table/useEditableTableDnd.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableDnd.js","names":[],"sources":["../../../src/components/editable-table/useEditableTableDnd.ts"],"sourcesContent":["import {\n    useCallback, useEffect, useState,\n} from 'react';\nimport { isSortable } from '@dnd-kit/react/sortable';\nimport type { EditableTableRow } from './types';\n\nexport const useEditableTableDnd = ({\n    allowReorder,\n    internalData,\n    handleChange,\n}: {\n    allowReorder: boolean\n    internalData: EditableTableRow[]\n    handleChange: (rows: EditableTableRow[]) => void\n}) => {\n    const [isDragging, setIsDragging] = useState(false);\n    const [isDndHydrated, setIsDndHydrated] = useState(false);\n\n    useEffect(() => {\n        if (!allowReorder) {\n            setIsDndHydrated(false);\n            return;\n        }\n\n        let idleId: number | null = null;\n        let timeoutId: ReturnType<typeof setTimeout> | null = null;\n        const enableDnd = () => { setIsDndHydrated(true); };\n\n        if (typeof window !== 'undefined' && typeof window.requestIdleCallback === 'function') {\n            idleId = window.requestIdleCallback(enableDnd, { timeout: 1200 });\n        } else {\n            timeoutId = setTimeout(enableDnd, 250);\n        }\n\n        return () => {\n            if (idleId !== null && typeof window !== 'undefined' && typeof window.cancelIdleCallback === 'function') {\n                window.cancelIdleCallback(idleId);\n            }\n\n            if (timeoutId !== null) {\n                clearTimeout(timeoutId);\n            }\n        };\n    }, [allowReorder]);\n\n    const handleDragStart = useCallback(() => {\n        setIsDragging(true);\n    }, []);\n\n    const handleDragEnd = useCallback((event: { canceled?: boolean; operation?: { source?: unknown } }) => {\n        setIsDragging(false);\n\n        if (!allowReorder) {\n            return;\n        }\n\n        if (event.canceled) {\n            return;\n        }\n\n        const { source } = event.operation ?? {};\n        if (!isSortable(source)) {\n            return;\n        }\n\n        if (!('initialIndex' in source) || typeof source.initialIndex !== 'number') {\n            return;\n        }\n\n        const { initialIndex, index } = source;\n        if (initialIndex === index) {\n            return;\n        }\n\n        if (initialIndex < 0 || index < 0 || initialIndex >= internalData.length || index >= internalData.length) {\n            return;\n        }\n\n        const nextRows = [...internalData];\n        const [movedRow] = nextRows.splice(initialIndex, 1);\n        nextRows.splice(index, 0, movedRow);\n\n        handleChange(nextRows);\n    }, [allowReorder, handleChange, internalData]);\n\n    const effectiveAllowReorder = allowReorder;\n\n    return {\n        isDragging,\n        isDndHydrated,\n        effectiveAllowReorder,\n        handleDragStart,\n        handleDragEnd,\n    };\n};\n"],"mappings":";;;AAMA,IAAa,uBAAuB,EAChC,cACA,cACA,mBAKE;CACF,MAAM,CAAC,YAAY,iBAAiB,SAAS,MAAM;CACnD,MAAM,CAAC,eAAe,oBAAoB,SAAS,MAAM;AAEzD,iBAAgB;AACZ,MAAI,CAAC,cAAc;AACf,oBAAiB,MAAM;AACvB;;EAGJ,IAAI,SAAwB;EAC5B,IAAI,YAAkD;EACtD,MAAM,kBAAkB;AAAE,oBAAiB,KAAK;;AAEhD,MAAI,OAAO,WAAW,eAAe,OAAO,OAAO,wBAAwB,WACvE,UAAS,OAAO,oBAAoB,WAAW,EAAE,SAAS,MAAM,CAAC;MAEjE,aAAY,WAAW,WAAW,IAAI;AAG1C,eAAa;AACT,OAAI,WAAW,QAAQ,OAAO,WAAW,eAAe,OAAO,OAAO,uBAAuB,WACzF,QAAO,mBAAmB,OAAO;AAGrC,OAAI,cAAc,KACd,cAAa,UAAU;;IAGhC,CAAC,aAAa,CAAC;AA4ClB,QAAO;EACH;EACA;EACA,uBAAA;EACA,iBA9CoB,kBAAkB;AACtC,iBAAc,KAAK;KACpB,EAAE,CA4CD;EACA,eA3CkB,aAAa,UAAoE;AACnG,iBAAc,MAAM;AAEpB,OAAI,CAAC,aACD;AAGJ,OAAI,MAAM,SACN;GAGJ,MAAM,EAAE,WAAW,MAAM,aAAa,EAAE;AACxC,OAAI,CAAC,WAAW,OAAO,CACnB;AAGJ,OAAI,EAAE,kBAAkB,WAAW,OAAO,OAAO,iBAAiB,SAC9D;GAGJ,MAAM,EAAE,cAAc,UAAU;AAChC,OAAI,iBAAiB,MACjB;AAGJ,OAAI,eAAe,KAAK,QAAQ,KAAK,gBAAgB,aAAa,UAAU,SAAS,aAAa,OAC9F;GAGJ,MAAM,WAAW,CAAC,GAAG,aAAa;GAClC,MAAM,CAAC,YAAY,SAAS,OAAO,cAAc,EAAE;AACnD,YAAS,OAAO,OAAO,GAAG,SAAS;AAEnC,gBAAa,SAAS;KACvB;GAAC;GAAc;GAAc;GAAa,CASzC;EACH"}

package/dist/components/editable-table/useEditableTableRows.d.ts

@@ -0,0 +1,17 @@
+import { EditableTableRow } from './types';
+export declare const useEditableTableRows: ({ rows, onChange, newRowDefaults, }: {
+    rows: EditableTableRow[];
+    onChange: (rows: EditableTableRow[]) => void;
+    newRowDefaults?: Record<string, unknown>;
+}) => {
+    internalData: EditableTableRow[];
+    setInternalData: import('react').Dispatch<import('react').SetStateAction<EditableTableRow[]>>;
+    internalDataRef: import('react').RefObject<EditableTableRow[]>;
+    skipNextRowsSyncRef: import('react').RefObject<number>;
+    handleChange: (nextRows: EditableTableRow[]) => void;
+    addRow: () => void;
+    removeRow: (row: EditableTableRow) => void;
+    updateRow: (row: EditableTableRow, updates: Record<string, unknown>) => void;
+    moveRow: (row: EditableTableRow, direction: number) => void;
+};
+//# sourceMappingURL=useEditableTableRows.d.ts.map

package/dist/components/editable-table/useEditableTableRows.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableRows.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/useEditableTableRows.ts"],"names":[],"mappings":"AASA,OAAO,KAAK,EAAE,gBAAgB,EAAE,MAAM,SAAS,CAAC;AAchD,eAAO,MAAM,oBAAoB,GAAI,qCAIlC;IACC,IAAI,EAAE,gBAAgB,EAAE,CAAA;IACxB,QAAQ,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAA;IAC5C,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAA;CAC3C;;;;;6BA0E+C,gBAAgB,EAAE;;qBAW1B,gBAAgB;qBAOhB,gBAAgB,WAAW,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;mBAepD,gBAAgB,aAAa,MAAM;CA0BxE,CAAC"}

package/dist/components/editable-table/useEditableTableRows.js

@@ -0,0 +1,108 @@
+import { utils_exports } from "../../utils/index.js";
+import { useCallback, useEffect, useRef, useState } from "react";
+//#region src/components/editable-table/useEditableTableRows.ts
+var reorderByIndex = (items, from, to) => {
+	if (from === to || from < 0 || to < 0 || from >= items.length || to >= items.length) return items;
+	const nextItems = [...items];
+	const [moved] = nextItems.splice(from, 1);
+	nextItems.splice(to, 0, moved);
+	return nextItems;
+};
+var useEditableTableRows = ({ rows, onChange, newRowDefaults = {} }) => {
+	const [internalData, setInternalData] = useState([]);
+	const stableRowIdsRef = useRef([]);
+	const internalDataRef = useRef([]);
+	const skipNextRowsSyncRef = useRef(0);
+	const rowsMatch = (prevRows = [], nextRows = []) => {
+		if (prevRows.length !== nextRows.length) return false;
+		for (let i = 0; i < prevRows.length; i++) {
+			const prevRow = prevRows[i] || {};
+			const nextRow = nextRows[i] || {};
+			if (prevRow._id !== nextRow._id) return false;
+			const keys = new Set([...Object.keys(prevRow), ...Object.keys(nextRow)]);
+			for (const key of keys) {
+				if (key === "_id") continue;
+				if (prevRow[key] !== nextRow[key]) return false;
+			}
+		}
+		return true;
+	};
+	useEffect(() => {
+		if (!rows || rows.length === 0) {
+			stableRowIdsRef.current = [];
+			setInternalData([]);
+			return;
+		}
+		if (skipNextRowsSyncRef.current > 0) {
+			skipNextRowsSyncRef.current -= 1;
+			return;
+		}
+		setInternalData((prevData) => {
+			const nextData = (0, utils_exports.normalizeCollection)(rows).map((normalizedRow, index) => {
+				if (rows[index]?._id) {
+					stableRowIdsRef.current[index] = rows[index]._id;
+					return normalizedRow;
+				}
+				const stableId = prevData[index]?._id || stableRowIdsRef.current[index] || normalizedRow._id;
+				stableRowIdsRef.current[index] = stableId;
+				return {
+					...normalizedRow,
+					_id: stableId
+				};
+			});
+			stableRowIdsRef.current = stableRowIdsRef.current.slice(0, nextData.length);
+			if (rowsMatch(prevData, nextData)) return prevData;
+			return nextData;
+		});
+	}, [rows]);
+	useEffect(() => {
+		internalDataRef.current = internalData;
+	}, [internalData]);
+	const handleChange = useCallback((nextRows) => {
+		onChange(nextRows);
+	}, [onChange]);
+	return {
+		internalData,
+		setInternalData,
+		internalDataRef,
+		skipNextRowsSyncRef,
+		handleChange,
+		addRow: useCallback(() => {
+			const nextData = [...internalDataRef.current, (0, utils_exports.createItem)(newRowDefaults)];
+			skipNextRowsSyncRef.current += 1;
+			setInternalData(nextData);
+			handleChange(nextData);
+		}, [handleChange, newRowDefaults]),
+		removeRow: useCallback((row) => {
+			const nextData = (0, utils_exports.deleteItem)(internalDataRef.current, row);
+			skipNextRowsSyncRef.current += 1;
+			setInternalData(nextData);
+			handleChange(nextData);
+		}, [handleChange]),
+		updateRow: useCallback((row, updates) => {
+			if (!Object.entries(updates).some(([key, val]) => {
+				return row[key] !== val;
+			})) return;
+			const nextData = (0, utils_exports.updateItem)(internalDataRef.current, row, updates);
+			skipNextRowsSyncRef.current += 1;
+			setInternalData(nextData);
+			handleChange(nextData);
+		}, [handleChange]),
+		moveRow: useCallback((row, direction) => {
+			const prevData = internalDataRef.current;
+			const index = prevData.findIndex((item) => {
+				return item._id === row._id;
+			});
+			const nextIndex = index + direction;
+			if (index === -1 || nextIndex < 0 || nextIndex >= prevData.length) return;
+			const nextData = reorderByIndex(prevData, index, nextIndex);
+			skipNextRowsSyncRef.current += 1;
+			setInternalData(nextData);
+			handleChange(nextData);
+		}, [handleChange])
+	};
+};
+//#endregion
+export { useEditableTableRows };
+
+//# sourceMappingURL=useEditableTableRows.js.map

package/dist/components/editable-table/useEditableTableRows.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useEditableTableRows.js","names":[],"sources":["../../../src/components/editable-table/useEditableTableRows.ts"],"sourcesContent":["import {\n    useCallback, useEffect, useRef, useState,\n} from 'react';\nimport {\n    normalizeCollection,\n    createItem,\n    deleteItem,\n    updateItem,\n} from '@verbb/plugin-kit-react/utils';\nimport type { EditableTableRow } from './types';\n\nconst reorderByIndex = (items: EditableTableRow[], from: number, to: number) => {\n    if (from === to || from < 0 || to < 0 || from >= items.length || to >= items.length) {\n        return items;\n    }\n\n    const nextItems = [...items];\n    const [moved] = nextItems.splice(from, 1);\n    nextItems.splice(to, 0, moved);\n\n    return nextItems;\n};\n\nexport const useEditableTableRows = ({\n    rows,\n    onChange,\n    newRowDefaults = {},\n}: {\n    rows: EditableTableRow[]\n    onChange: (rows: EditableTableRow[]) => void\n    newRowDefaults?: Record<string, unknown>\n}) => {\n    const [internalData, setInternalData] = useState<EditableTableRow[]>([]);\n    const stableRowIdsRef = useRef<string[]>([]);\n    const internalDataRef = useRef<EditableTableRow[]>([]);\n    const skipNextRowsSyncRef = useRef(0);\n\n    const rowsMatch = (prevRows: EditableTableRow[] = [], nextRows: EditableTableRow[] = []) => {\n        if (prevRows.length !== nextRows.length) {\n            return false;\n        }\n\n        for (let i = 0; i < prevRows.length; i++) {\n            const prevRow = prevRows[i] || {};\n            const nextRow = nextRows[i] || {};\n\n            if (prevRow._id !== nextRow._id) {\n                return false;\n            }\n\n            const keys = new Set([...Object.keys(prevRow), ...Object.keys(nextRow)]);\n            for (const key of keys) {\n                if (key === '_id') {\n                    continue;\n                }\n\n                if (prevRow[key] !== nextRow[key]) {\n                    return false;\n                }\n            }\n        }\n\n        return true;\n    };\n\n    useEffect(() => {\n        if (!rows || rows.length === 0) {\n            stableRowIdsRef.current = [];\n            setInternalData([]);\n            return;\n        }\n\n        if (skipNextRowsSyncRef.current > 0) {\n            skipNextRowsSyncRef.current -= 1;\n            return;\n        }\n\n        setInternalData((prevData) => {\n            const normalizedRows = normalizeCollection(rows) as EditableTableRow[];\n            const nextData = normalizedRows.map((normalizedRow, index) => {\n                if (rows[index]?._id) {\n                    stableRowIdsRef.current[index] = rows[index]._id;\n                    return normalizedRow;\n                }\n\n                const stableId = prevData[index]?._id || stableRowIdsRef.current[index] || normalizedRow._id;\n                stableRowIdsRef.current[index] = stableId;\n\n                return { ...normalizedRow, _id: stableId };\n            });\n\n            stableRowIdsRef.current = stableRowIdsRef.current.slice(0, nextData.length);\n\n            if (rowsMatch(prevData, nextData)) {\n                return prevData;\n            }\n\n            return nextData;\n        });\n    }, [rows]);\n\n    useEffect(() => {\n        internalDataRef.current = internalData;\n    }, [internalData]);\n\n    const handleChange = useCallback((nextRows: EditableTableRow[]) => {\n        onChange(nextRows);\n    }, [onChange]);\n\n    const addRow = useCallback(() => {\n        const nextData = [...internalDataRef.current, createItem(newRowDefaults) as EditableTableRow];\n        skipNextRowsSyncRef.current += 1;\n        setInternalData(nextData);\n        handleChange(nextData);\n    }, [handleChange, newRowDefaults]);\n\n    const removeRow = useCallback((row: EditableTableRow) => {\n        const nextData = deleteItem(internalDataRef.current, row) as EditableTableRow[];\n        skipNextRowsSyncRef.current += 1;\n        setInternalData(nextData);\n        handleChange(nextData);\n    }, [handleChange]);\n\n    const updateRow = useCallback((row: EditableTableRow, updates: Record<string, unknown>) => {\n        const hasRealChange = Object.entries(updates).some(([key, val]) => {\n            return row[key] !== val;\n        });\n\n        if (!hasRealChange) {\n            return;\n        }\n\n        const nextData = updateItem(internalDataRef.current, row, updates) as EditableTableRow[];\n        skipNextRowsSyncRef.current += 1;\n        setInternalData(nextData);\n        handleChange(nextData);\n    }, [handleChange]);\n\n    const moveRow = useCallback((row: EditableTableRow, direction: number) => {\n        const prevData = internalDataRef.current;\n        const index = prevData.findIndex((item) => { return item._id === row._id; });\n        const nextIndex = index + direction;\n\n        if (index === -1 || nextIndex < 0 || nextIndex >= prevData.length) {\n            return;\n        }\n\n        const nextData = reorderByIndex(prevData, index, nextIndex);\n        skipNextRowsSyncRef.current += 1;\n        setInternalData(nextData);\n        handleChange(nextData);\n    }, [handleChange]);\n\n    return {\n        internalData,\n        setInternalData,\n        internalDataRef,\n        skipNextRowsSyncRef,\n        handleChange,\n        addRow,\n        removeRow,\n        updateRow,\n        moveRow,\n    };\n};\n"],"mappings":"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"}