npm - @verbb/plugin-kit-react - Versions diffs - 1.0.2 → 1.0.3 - Mend

@verbb/plugin-kit-react 1.0.2 → 1.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (14) hide show

package/CHANGELOG.md CHANGED Viewed

@@ -1,5 +1,11 @@
 # Changelog
+## 1.0.2 - 2026-06-07
+### Added
+- Added `modifyRow` to `EditableTable`, a row-level companion to `modifyColumn`. Host apps can return optional `cellClassName` and `title` values based on row data; these are applied to all data cells in the row and the actions cell when present.
+- Added support for `cellClassName` and `title` return values from `modifyColumn`, applied to individual table cell wrappers alongside existing column overrides.
 ## 1.0.1 - 2026-06-07
 ### Added

package/dist/components/EditableTable.d.ts CHANGED Viewed

@@ -1,5 +1,6 @@
 import { default as React } from 'react';
-import { EditableTableColumn, EditableTableModifyColumn, EditableTableOnCellChange, EditableTableRow, EditableTableRowActionArgs } from './editable-table/types';
+import { EditableTableColumn, EditableTableModifyColumn, EditableTableModifyRow, EditableTableOnCellChange, EditableTableRow, EditableTableRowActionArgs } from './editable-table/types';
+export type { EditableTableColumn, EditableTableModifyColumn, EditableTableModifyColumnResult, EditableTableModifyRow, EditableTableOnCellChange, EditableTableRow, EditableTableRowActionArgs, } from './editable-table/types';
 export type EditableTableProps = {
     columns: EditableTableColumn[];
     rows: EditableTableRow[];
@@ -11,6 +12,7 @@ export type EditableTableProps = {
     allowDelete?: boolean;
     className?: string;
     modifyColumn?: EditableTableModifyColumn;
+    modifyRow?: EditableTableModifyRow;
     fieldName?: string;
     cellErrors?: Record<string, unknown>;
     newRowDefaults?: Record<string, unknown>;
@@ -24,5 +26,5 @@ export type EditableTableProps = {
     renderRowMenuItemsAfterCore?: (args: EditableTableRowActionArgs) => React.ReactNode;
     renderRowMenuItems?: (args: EditableTableRowActionArgs) => React.ReactNode;
 };
-export declare function EditableTable({ columns, rows, onChange, onCellChange, addRowLabel, allowReorder, allowAdd, allowDelete, className, modifyColumn, fieldName, cellErrors, newRowDefaults, renderActions, renderRowActions, renderRowMenuItemsBeforeCore, renderRowMenuItemsAfterCore, renderRowMenuItems, }: EditableTableProps): import("react/jsx-runtime").JSX.Element;
+export declare function EditableTable({ columns, rows, onChange, onCellChange, addRowLabel, allowReorder, allowAdd, allowDelete, className, modifyColumn, modifyRow, fieldName, cellErrors, newRowDefaults, renderActions, renderRowActions, renderRowMenuItemsBeforeCore, renderRowMenuItemsAfterCore, renderRowMenuItems, }: EditableTableProps): import("react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=EditableTable.d.ts.map

package/dist/components/EditableTable.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditableTable.d.ts","sourceRoot":"","sources":["../../src/components/EditableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAoBpD,OAAO,KAAK,EACR,mBAAmB,EACnB,yBAAyB,EACzB,yBAAyB,EACzB,gBAAgB,EAChB,0BAA0B,EAC7B,MAAM,wBAAwB,CAAC;AAEhC,MAAM,MAAM,kBAAkB,GAAG;IAC7B,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,EAAE,gBAAgB,EAAE,CAAC;IACzB,QAAQ,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,gBAAgB,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,IAAI,CAAC;QAAC,UAAU,EAAE,OAAO,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACjH,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,4BAA4B,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACrF,2BAA2B,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACpF,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9E,CAAC;~~AAwBF~~,wBAAgB,aAAa,CAAC,EAC1B,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,YAAwB,EACxB,WAAW,EACX,YAAmB,EACnB,QAAe,EACf,WAAkB,EAClB,SAAc,EACd,YAAwB,EACxB,SAAqB,EACrB,UAAe,EACf,cAAmB,EACnB,aAAyB,EACzB,gBAA4B,EAC5B,4BAAwC,EACxC,2BAAuC,EACvC,kBAA8B,GACjC,EAAE,kBAAkB,~~2CA8KpB~~"}
1	+ {"version":3,"file":"EditableTable.d.ts","sourceRoot":"","sources":["../../src/components/EditableTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAA+B,MAAM,OAAO,CAAC;AAoBpD,OAAO,KAAK,EACR,mBAAmB,EACnB,yBAAyB,EACzB,sBAAsB,EACtB,yBAAyB,EACzB,gBAAgB,EAChB,0BAA0B,EAC7B,MAAM,wBAAwB,CAAC;AAEhC,YAAY,EACR,mBAAmB,EACnB,yBAAyB,EACzB,+BAA+B,EAC/B,sBAAsB,EACtB,yBAAyB,EACzB,gBAAgB,EAChB,0BAA0B,GAC7B,MAAM,wBAAwB,CAAC;AAEhC,MAAM,MAAM,kBAAkB,GAAG;IAC7B,OAAO,EAAE,mBAAmB,EAAE,CAAC;IAC/B,IAAI,EAAE,gBAAgB,EAAE,CAAC;IACzB,QAAQ,EAAE,CAAC,IAAI,EAAE,gBAAgB,EAAE,KAAK,IAAI,CAAC;IAC7C,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,WAAW,CAAC,EAAE,OAAO,CAAC;IACtB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,yBAAyB,CAAC;IACzC,SAAS,CAAC,EAAE,sBAAsB,CAAC;IACnC,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,UAAU,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACrC,cAAc,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,CAAC;IACzC,aAAa,CAAC,EAAE,CAAC,IAAI,EAAE;QAAE,IAAI,EAAE,gBAAgB,EAAE,CAAC;QAAC,MAAM,EAAE,MAAM,IAAI,CAAC;QAAC,UAAU,EAAE,OAAO,CAAA;KAAE,KAAK,KAAK,CAAC,SAAS,CAAC;IACjH,gBAAgB,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACzE,4BAA4B,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACrF,2BAA2B,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;IACpF,kBAAkB,CAAC,EAAE,CAAC,IAAI,EAAE,0BAA0B,KAAK,KAAK,CAAC,SAAS,CAAC;CAC9E,CAAC;AAyBF,wBAAgB,aAAa,CAAC,EAC1B,OAAO,EACP,IAAI,EACJ,QAAQ,EACR,YAAwB,EACxB,WAAW,EACX,YAAmB,EACnB,QAAe,EACf,WAAkB,EAClB,SAAc,EACd,YAAwB,EACxB,SAAqB,EACrB,SAAqB,EACrB,UAAe,EACf,cAAmB,EACnB,aAAyB,EACzB,gBAA4B,EAC5B,4BAAwC,EACxC,2BAAuC,EACvC,kBAA8B,GACjC,EAAE,kBAAkB,2CA+KpB"}

package/dist/components/EditableTable.js CHANGED Viewed

@@ -17,7 +17,7 @@ import { faPlus } from "@fortawesome/pro-solid-svg-icons";
 import { DragDropProvider } from "@dnd-kit/react";
 import { AutoScroller } from "@dnd-kit/dom";
 //#region src/components/EditableTable.tsx
-function EditableTable({ columns, rows, onChange, onCellChange = void 0, addRowLabel, allowReorder = true, allowAdd = true, allowDelete = true, className = "", modifyColumn = void 0, fieldName = void 0, cellErrors = {}, newRowDefaults = {}, renderActions = void 0, renderRowActions = void 0, renderRowMenuItemsBeforeCore = void 0, renderRowMenuItemsAfterCore = void 0, renderRowMenuItems = void 0 }) {
+function EditableTable({ columns, rows, onChange, onCellChange = void 0, addRowLabel, allowReorder = true, allowAdd = true, allowDelete = true, className = "", modifyColumn = void 0, modifyRow = void 0, fieldName = void 0, cellErrors = {}, newRowDefaults = {}, renderActions = void 0, renderRowActions = void 0, renderRowMenuItemsBeforeCore = void 0, renderRowMenuItemsAfterCore = void 0, renderRowMenuItems = void 0 }) {
 	const TableRowComponent = TableRow;
 	const t = useTranslation();
 	const normalizedColumns = useMemo(() => {
@@ -114,6 +114,7 @@ function EditableTable({ columns, rows, onChange, onCellChange = void 0, addRowL
 						showReorderControls: allowReorder,
 						allowDelete,
 						modifyColumn,
+						modifyRow,
 						getCellErrors,
 						onUpdateCell: handleCellValueChange,
 						moveRow,

package/dist/components/EditableTable.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"EditableTable.js","names":[],"sources":["../../src/components/EditableTable.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { DragDropProvider } from '@dnd-kit/react';\nimport { AutoScroller } from '@dnd-kit/dom';\nimport {\n Button,\n Table,\n TableHeader,\n TableBody,\n TableRow as UITableRow,\n TableHead,\n} from '@verbb/plugin-kit-react/components';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faPlus } from '@fortawesome/pro-solid-svg-icons';\nimport { useTranslation } from '@verbb/plugin-kit-react/hooks';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { TableRow } from './editable-table/TableRow';\nimport { isGeneratedColumn, isThinColumn } from './editable-table/helpers';\nimport { useEditableTableRows } from './editable-table/useEditableTableRows';\nimport { useEditableTableDnd } from './editable-table/useEditableTableDnd';\nimport { useEditableTableCellChange } from './editable-table/useEditableTableCellChange';\nimport type {\n EditableTableColumn,\n EditableTableModifyColumn,\n EditableTableOnCellChange,\n EditableTableRow,\n EditableTableRowActionArgs,\n} from './editable-table/types';\n\nexport type EditableTableProps = {\n columns: EditableTableColumn[];\n rows: EditableTableRow[];\n onChange: (rows: EditableTableRow[]) => void;\n onCellChange?: EditableTableOnCellChange;\n addRowLabel?: string;\n allowReorder?: boolean;\n allowAdd?: boolean;\n allowDelete?: boolean;\n className?: string;\n modifyColumn?: EditableTableModifyColumn;\n fieldName?: string;\n cellErrors?: Record<string, unknown>;\n newRowDefaults?: Record<string, unknown>;\n renderActions?: (args: { rows: EditableTableRow[]; addRow: () => void; isDragging: boolean }) => React.ReactNode;\n renderRowActions?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsBeforeCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsAfterCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItems?: (args: EditableTableRowActionArgs) => React.ReactNode;\n};\n\ntype TableRowComponentProps = {\n row: EditableTableRow;\n rowIndex: number;\n rowCount: number;\n columns: EditableTableColumn[];\n columnsSignature: string;\n useDnd: boolean;\n allowReorder: boolean;\n showReorderControls: boolean;\n allowDelete: boolean;\n modifyColumn?: EditableTableModifyColumn;\n getCellErrors: (rowIndex: number, columnName: string) => unknown[];\n onUpdateCell: (rowIndex: number, row: EditableTableRow, column: EditableTableColumn, newValue: unknown) => void;\n moveRow: (row: EditableTableRow, direction: number) => void;\n removeRow: (row: EditableTableRow) => void;\n t: (key: string) => string;\n renderRowActions?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsBeforeCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsAfterCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItems?: (args: EditableTableRowActionArgs) => React.ReactNode;\n};\n\nexport function EditableTable({\n columns,\n rows,\n onChange,\n onCellChange = undefined,\n addRowLabel,\n allowReorder = true,\n allowAdd = true,\n allowDelete = true,\n className = '',\n modifyColumn = undefined,\n fieldName = undefined,\n cellErrors = {},\n newRowDefaults = {},\n renderActions = undefined,\n renderRowActions = undefined,\n renderRowMenuItemsBeforeCore = undefined,\n renderRowMenuItemsAfterCore = undefined,\n renderRowMenuItems = undefined,\n}: EditableTableProps) {\n const TableRowComponent = TableRow as React.ComponentType<TableRowComponentProps>;\n const t = useTranslation();\n const normalizedColumns = useMemo(() => {\n const sourceColumns = Array.isArray(columns) ? columns : [];\n const validColumns = sourceColumns.filter((column) => {\n return typeof column?.name === 'string' && column.name.trim() !== '';\n });\n\n if (validColumns.length !== sourceColumns.length) {\n const invalidColumns = sourceColumns.filter((column) => {\n return !(typeof column?.name === 'string' && column.name.trim() !== '');\n });\n\n console.error(\n 'EditableTable: column definitions must include a non-empty `name`.',\n { invalidColumns, columns: sourceColumns },\n );\n }\n\n return validColumns;\n }, [columns]);\n\n const generatedColumns = useMemo(() => {\n return normalizedColumns.filter(isGeneratedColumn);\n }, [normalizedColumns]);\n\n const columnsSignature = useMemo(() => {\n return JSON.stringify(normalizedColumns.map((column) => {\n return {\n name: column.name,\n type: column.type,\n label: column.label,\n required: column.required,\n placeholder: column.placeholder,\n options: column.options,\n };\n }));\n }, [normalizedColumns]);\n\n const {\n internalData,\n setInternalData,\n internalDataRef,\n skipNextRowsSyncRef,\n handleChange,\n addRow,\n removeRow,\n updateRow,\n moveRow,\n } = useEditableTableRows({\n rows,\n onChange,\n newRowDefaults,\n });\n\n const {\n isDragging,\n isDndHydrated,\n effectiveAllowReorder,\n handleDragStart,\n handleDragEnd,\n } = useEditableTableDnd({\n allowReorder,\n internalData,\n handleChange,\n });\n\n const {\n handleCellValueChange,\n } = useEditableTableCellChange({\n internalData,\n internalDataRef,\n setInternalData,\n skipNextRowsSyncRef,\n generatedColumns,\n onCellChange,\n updateRow,\n handleChange,\n });\n\n const getCellErrors = useCallback((rowIndex: number, columnName: string) => {\n if (!fieldName) {\n return [];\n }\n\n const key = `${fieldName}.${rowIndex}.${columnName}`;\n const errors = cellErrors?.[key];\n if (!errors) {\n return [];\n }\n\n return Array.isArray(errors) ? errors : [errors];\n }, [cellErrors, fieldName]);\n\n const actions = typeof renderActions === 'function'\n ? renderActions({\n rows: internalData,\n addRow,\n isDragging,\n })\n : null;\n\n const dragDropPlugins = useCallback((defaults) => {\n return defaults.filter((plugin) => { return plugin !== AutoScroller; });\n }, []);\n\n return (\n <div className={className}>\n {actions}\n\n <DragDropProvider\n plugins={dragDropPlugins}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <Table>\n <TableHeader>\n <UITableRow>\n {normalizedColumns.map((column) => {\n return (\n <TableHead key={column.name} className={cn(column.className, isThinColumn(column) && 'w-[1%] whitespace-nowrap')}>\n {column.label}\n {column.required && <span className=\"text-error ml-1\">*</span>}\n </TableHead>\n );\n })}\n {(allowReorder \|\| allowDelete) && <TableHead className=\"p-0 w-0\"></TableHead>}\n </UITableRow>\n </TableHeader>\n <TableBody>\n {internalData.map((row, rowIndex) => {\n return (\n <TableRowComponent\n key={row._id}\n row={row}\n rowIndex={rowIndex}\n rowCount={internalData.length}\n columns={normalizedColumns}\n columnsSignature={columnsSignature}\n useDnd={allowReorder && isDndHydrated}\n allowReorder={effectiveAllowReorder && isDndHydrated}\n showReorderControls={allowReorder}\n allowDelete={allowDelete}\n modifyColumn={modifyColumn}\n getCellErrors={getCellErrors}\n onUpdateCell={handleCellValueChange}\n moveRow={moveRow}\n removeRow={removeRow}\n t={t}\n renderRowActions={renderRowActions}\n renderRowMenuItemsBeforeCore={renderRowMenuItemsBeforeCore}\n renderRowMenuItemsAfterCore={renderRowMenuItemsAfterCore}\n renderRowMenuItems={renderRowMenuItems}\n />\n );\n })}\n </TableBody>\n </Table>\n </DragDropProvider>\n\n {allowAdd && (\n <Button\n type=\"button\"\n variant=\"dashed\"\n onClick={addRow}\n className={cn('w-full rounded-t-none! border-t-0!', isDragging && 'pointer-events-none')}\n >\n <FontAwesomeIcon icon={faPlus} className=\"size-3 mr-1\" />\n {addRowLabel \|\| t('Add row')}\n </Button>\n )}\n </div>\n );\n}\n"],"mappings":"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"}
1	+ {"version":3,"file":"EditableTable.js","names":[],"sources":["../../src/components/EditableTable.tsx"],"sourcesContent":["import React, { useCallback, useMemo } from 'react';\nimport { DragDropProvider } from '@dnd-kit/react';\nimport { AutoScroller } from '@dnd-kit/dom';\nimport {\n Button,\n Table,\n TableHeader,\n TableBody,\n TableRow as UITableRow,\n TableHead,\n} from '@verbb/plugin-kit-react/components';\nimport { FontAwesomeIcon } from '@fortawesome/react-fontawesome';\nimport { faPlus } from '@fortawesome/pro-solid-svg-icons';\nimport { useTranslation } from '@verbb/plugin-kit-react/hooks';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { TableRow } from './editable-table/TableRow';\nimport { isGeneratedColumn, isThinColumn } from './editable-table/helpers';\nimport { useEditableTableRows } from './editable-table/useEditableTableRows';\nimport { useEditableTableDnd } from './editable-table/useEditableTableDnd';\nimport { useEditableTableCellChange } from './editable-table/useEditableTableCellChange';\nimport type {\n EditableTableColumn,\n EditableTableModifyColumn,\n EditableTableModifyRow,\n EditableTableOnCellChange,\n EditableTableRow,\n EditableTableRowActionArgs,\n} from './editable-table/types';\n\nexport type {\n EditableTableColumn,\n EditableTableModifyColumn,\n EditableTableModifyColumnResult,\n EditableTableModifyRow,\n EditableTableOnCellChange,\n EditableTableRow,\n EditableTableRowActionArgs,\n} from './editable-table/types';\n\nexport type EditableTableProps = {\n columns: EditableTableColumn[];\n rows: EditableTableRow[];\n onChange: (rows: EditableTableRow[]) => void;\n onCellChange?: EditableTableOnCellChange;\n addRowLabel?: string;\n allowReorder?: boolean;\n allowAdd?: boolean;\n allowDelete?: boolean;\n className?: string;\n modifyColumn?: EditableTableModifyColumn;\n modifyRow?: EditableTableModifyRow;\n fieldName?: string;\n cellErrors?: Record<string, unknown>;\n newRowDefaults?: Record<string, unknown>;\n renderActions?: (args: { rows: EditableTableRow[]; addRow: () => void; isDragging: boolean }) => React.ReactNode;\n renderRowActions?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsBeforeCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsAfterCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItems?: (args: EditableTableRowActionArgs) => React.ReactNode;\n};\n\ntype TableRowComponentProps = {\n row: EditableTableRow;\n rowIndex: number;\n rowCount: number;\n columns: EditableTableColumn[];\n columnsSignature: string;\n useDnd: boolean;\n allowReorder: boolean;\n showReorderControls: boolean;\n allowDelete: boolean;\n modifyColumn?: EditableTableModifyColumn;\n modifyRow?: EditableTableModifyRow;\n getCellErrors: (rowIndex: number, columnName: string) => unknown[];\n onUpdateCell: (rowIndex: number, row: EditableTableRow, column: EditableTableColumn, newValue: unknown) => void;\n moveRow: (row: EditableTableRow, direction: number) => void;\n removeRow: (row: EditableTableRow) => void;\n t: (key: string) => string;\n renderRowActions?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsBeforeCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItemsAfterCore?: (args: EditableTableRowActionArgs) => React.ReactNode;\n renderRowMenuItems?: (args: EditableTableRowActionArgs) => React.ReactNode;\n};\n\nexport function EditableTable({\n columns,\n rows,\n onChange,\n onCellChange = undefined,\n addRowLabel,\n allowReorder = true,\n allowAdd = true,\n allowDelete = true,\n className = '',\n modifyColumn = undefined,\n modifyRow = undefined,\n fieldName = undefined,\n cellErrors = {},\n newRowDefaults = {},\n renderActions = undefined,\n renderRowActions = undefined,\n renderRowMenuItemsBeforeCore = undefined,\n renderRowMenuItemsAfterCore = undefined,\n renderRowMenuItems = undefined,\n}: EditableTableProps) {\n const TableRowComponent = TableRow as React.ComponentType<TableRowComponentProps>;\n const t = useTranslation();\n const normalizedColumns = useMemo(() => {\n const sourceColumns = Array.isArray(columns) ? columns : [];\n const validColumns = sourceColumns.filter((column) => {\n return typeof column?.name === 'string' && column.name.trim() !== '';\n });\n\n if (validColumns.length !== sourceColumns.length) {\n const invalidColumns = sourceColumns.filter((column) => {\n return !(typeof column?.name === 'string' && column.name.trim() !== '');\n });\n\n console.error(\n 'EditableTable: column definitions must include a non-empty `name`.',\n { invalidColumns, columns: sourceColumns },\n );\n }\n\n return validColumns;\n }, [columns]);\n\n const generatedColumns = useMemo(() => {\n return normalizedColumns.filter(isGeneratedColumn);\n }, [normalizedColumns]);\n\n const columnsSignature = useMemo(() => {\n return JSON.stringify(normalizedColumns.map((column) => {\n return {\n name: column.name,\n type: column.type,\n label: column.label,\n required: column.required,\n placeholder: column.placeholder,\n options: column.options,\n };\n }));\n }, [normalizedColumns]);\n\n const {\n internalData,\n setInternalData,\n internalDataRef,\n skipNextRowsSyncRef,\n handleChange,\n addRow,\n removeRow,\n updateRow,\n moveRow,\n } = useEditableTableRows({\n rows,\n onChange,\n newRowDefaults,\n });\n\n const {\n isDragging,\n isDndHydrated,\n effectiveAllowReorder,\n handleDragStart,\n handleDragEnd,\n } = useEditableTableDnd({\n allowReorder,\n internalData,\n handleChange,\n });\n\n const {\n handleCellValueChange,\n } = useEditableTableCellChange({\n internalData,\n internalDataRef,\n setInternalData,\n skipNextRowsSyncRef,\n generatedColumns,\n onCellChange,\n updateRow,\n handleChange,\n });\n\n const getCellErrors = useCallback((rowIndex: number, columnName: string) => {\n if (!fieldName) {\n return [];\n }\n\n const key = `${fieldName}.${rowIndex}.${columnName}`;\n const errors = cellErrors?.[key];\n if (!errors) {\n return [];\n }\n\n return Array.isArray(errors) ? errors : [errors];\n }, [cellErrors, fieldName]);\n\n const actions = typeof renderActions === 'function'\n ? renderActions({\n rows: internalData,\n addRow,\n isDragging,\n })\n : null;\n\n const dragDropPlugins = useCallback((defaults) => {\n return defaults.filter((plugin) => { return plugin !== AutoScroller; });\n }, []);\n\n return (\n <div className={className}>\n {actions}\n\n <DragDropProvider\n plugins={dragDropPlugins}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <Table>\n <TableHeader>\n <UITableRow>\n {normalizedColumns.map((column) => {\n return (\n <TableHead key={column.name} className={cn(column.className, isThinColumn(column) && 'w-[1%] whitespace-nowrap')}>\n {column.label}\n {column.required && <span className=\"text-error ml-1\">*</span>}\n </TableHead>\n );\n })}\n {(allowReorder \|\| allowDelete) && <TableHead className=\"p-0 w-0\"></TableHead>}\n </UITableRow>\n </TableHeader>\n <TableBody>\n {internalData.map((row, rowIndex) => {\n return (\n <TableRowComponent\n key={row._id}\n row={row}\n rowIndex={rowIndex}\n rowCount={internalData.length}\n columns={normalizedColumns}\n columnsSignature={columnsSignature}\n useDnd={allowReorder && isDndHydrated}\n allowReorder={effectiveAllowReorder && isDndHydrated}\n showReorderControls={allowReorder}\n allowDelete={allowDelete}\n modifyColumn={modifyColumn}\n modifyRow={modifyRow}\n getCellErrors={getCellErrors}\n onUpdateCell={handleCellValueChange}\n moveRow={moveRow}\n removeRow={removeRow}\n t={t}\n renderRowActions={renderRowActions}\n renderRowMenuItemsBeforeCore={renderRowMenuItemsBeforeCore}\n renderRowMenuItemsAfterCore={renderRowMenuItemsAfterCore}\n renderRowMenuItems={renderRowMenuItems}\n />\n );\n })}\n </TableBody>\n </Table>\n </DragDropProvider>\n\n {allowAdd && (\n <Button\n type=\"button\"\n variant=\"dashed\"\n onClick={addRow}\n className={cn('w-full rounded-t-none! border-t-0!', isDragging && 'pointer-events-none')}\n >\n <FontAwesomeIcon icon={faPlus} className=\"size-3 mr-1\" />\n {addRowLabel \|\| t('Add row')}\n </Button>\n )}\n </div>\n );\n}\n"],"mappings":";;;;;;;;;;;;;;;;;;;AAoFA,SAAgB,cAAc,EAC1B,SACA,MACA,UACA,eAAe,KAAA,GACf,aACA,eAAe,MACf,WAAW,MACX,cAAc,MACd,YAAY,IACZ,eAAe,KAAA,GACf,YAAY,KAAA,GACZ,YAAY,KAAA,GACZ,aAAa,EAAE,EACf,iBAAiB,EAAE,EACnB,gBAAgB,KAAA,GAChB,mBAAmB,KAAA,GACnB,+BAA+B,KAAA,GAC/B,8BAA8B,KAAA,GAC9B,qBAAqB,KAAA,KACF;CACnB,MAAM,oBAAoB;CAC1B,MAAM,IAAI,gBAAgB;CAC1B,MAAM,oBAAoB,cAAc;EACpC,MAAM,gBAAgB,MAAM,QAAQ,QAAQ,GAAG,UAAU,EAAE;EAC3D,MAAM,eAAe,cAAc,QAAQ,WAAW;AAClD,UAAO,OAAO,QAAQ,SAAS,YAAY,OAAO,KAAK,MAAM,KAAK;IACpE;AAEF,MAAI,aAAa,WAAW,cAAc,QAAQ;GAC9C,MAAM,iBAAiB,cAAc,QAAQ,WAAW;AACpD,WAAO,EAAE,OAAO,QAAQ,SAAS,YAAY,OAAO,KAAK,MAAM,KAAK;KACtE;AAEF,WAAQ,MACJ,sEACA;IAAE;IAAgB,SAAS;IAAe,CAC7C;;AAGL,SAAO;IACR,CAAC,QAAQ,CAAC;CAEb,MAAM,mBAAmB,cAAc;AACnC,SAAO,kBAAkB,OAAO,kBAAkB;IACnD,CAAC,kBAAkB,CAAC;CAEvB,MAAM,mBAAmB,cAAc;AACnC,SAAO,KAAK,UAAU,kBAAkB,KAAK,WAAW;AACpD,UAAO;IACH,MAAM,OAAO;IACb,MAAM,OAAO;IACb,OAAO,OAAO;IACd,UAAU,OAAO;IACjB,aAAa,OAAO;IACpB,SAAS,OAAO;IACnB;IACH,CAAC;IACJ,CAAC,kBAAkB,CAAC;CAEvB,MAAM,EACF,cACA,iBACA,iBACA,qBACA,cACA,QACA,WACA,WACA,YACA,qBAAqB;EACrB;EACA;EACA;EACH,CAAC;CAEF,MAAM,EACF,YACA,eACA,uBACA,iBACA,kBACA,oBAAoB;EACpB;EACA;EACA;EACH,CAAC;CAEF,MAAM,EACF,0BACA,2BAA2B;EAC3B;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACH,CAAC;CAEF,MAAM,gBAAgB,aAAa,UAAkB,eAAuB;AACxE,MAAI,CAAC,UACD,QAAO,EAAE;EAGb,MAAM,MAAM,GAAG,UAAU,GAAG,SAAS,GAAG;EACxC,MAAM,SAAS,aAAa;AAC5B,MAAI,CAAC,OACD,QAAO,EAAE;AAGb,SAAO,MAAM,QAAQ,OAAO,GAAG,SAAS,CAAC,OAAO;IACjD,CAAC,YAAY,UAAU,CAAC;AAc3B,QACI,qBAAC,OAAD;EAAgB;YAAhB;GAbY,OAAO,kBAAkB,aACnC,cAAc;IACZ,MAAM;IACN;IACA;IACH,CAAC,GACA;GAUE,oBAAC,kBAAD;IACI,SATY,aAAa,aAAa;AAC9C,YAAO,SAAS,QAAQ,WAAW;AAAE,aAAO,WAAW;OAAgB;OACxE,EAAE,CAOgB;IACT,aAAa;IACb,WAAW;cAEX,qBAAC,OAAD,EAAA,UAAA,CACI,oBAAC,aAAD,EAAA,UACI,qBAAC,YAAD,EAAA,UAAA,CACK,kBAAkB,KAAK,WAAW;AAC/B,YACI,qBAAC,WAAD;MAA6B,WAAW,GAAG,OAAO,WAAW,aAAa,OAAO,IAAI,2BAA2B;gBAAhH,CACK,OAAO,OACP,OAAO,YAAY,oBAAC,QAAD;OAAM,WAAU;iBAAkB;OAAQ,CAAA,CACtD;QAHI,OAAO,KAGX;MAElB,GACA,gBAAgB,gBAAgB,oBAAC,WAAD,EAAW,WAAU,WAAsB,CAAA,CACpE,EAAA,CAAA,EACH,CAAA,EACd,oBAAC,WAAD,EAAA,UACK,aAAa,KAAK,KAAK,aAAa;AACjC,YACI,oBAAC,mBAAD;MAES;MACK;MACV,UAAU,aAAa;MACvB,SAAS;MACS;MAClB,QAAQ,gBAAgB;MACxB,cAAc,yBAAyB;MACvC,qBAAqB;MACR;MACC;MACH;MACI;MACf,cAAc;MACL;MACE;MACR;MACe;MACY;MACD;MACT;MACtB,EArBO,IAAI,IAqBX;MAER,EACM,CAAA,CACR,EAAA,CAAA;IACO,CAAA;GAElB,YACG,qBAAC,QAAD;IACI,MAAK;IACL,SAAQ;IACR,SAAS;IACT,WAAW,GAAG,sCAAsC,cAAc,sBAAsB;cAJ5F,CAMI,oBAAC,iBAAD;KAAiB,MAAM;KAAQ,WAAU;KAAgB,CAAA,EACxD,eAAe,EAAE,UAAU,CACvB;;GAEX"}

package/dist/components/editable-table/RowDataCells.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RowDataCells.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/RowDataCells.jsx"],"names":[],"mappings":"AASA,~~8DAqCG~~;~~kBA9Ce~~,OAAO"}
1	+ {"version":3,"file":"RowDataCells.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/RowDataCells.jsx"],"names":[],"mappings":"AASA,8DA6CG;kBAtDe,OAAO"}

package/dist/components/editable-table/RowDataCells.js CHANGED Viewed

@@ -6,13 +6,13 @@ import "../index.js";
 import React from "react";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/editable-table/RowDataCells.jsx
-var isThinColumn = (column) => {
-	return Boolean(column?.thin || column?.type === "checkbox" || column?.type === "lightswitch" || column?.type === "radio");
-};
-var RowDataCells = React.memo(({ row, rowIndex, columns, columnsSignature, modifyColumn, getCellErrors, onUpdateCell }) => {
+var RowDataCells = React.memo(({ row, rowIndex, columns, columnsSignature, modifyColumn, modifyRow, getCellErrors, onUpdateCell }) => {
+	const rowModifications = modifyRow ? modifyRow(row, rowIndex) : null;
 	return columns.map((column) => {
+		const columnModifications = modifyColumn ? modifyColumn(row, column.name) : null;
 		return /* @__PURE__ */ jsx(TableCell$1, {
-			className: cn(column.className, isThinColumn(column) && "w-[1%] whitespace-nowrap"),
+			className: cn(column.className, rowModifications?.cellClassName, columnModifications?.cellClassName),
+			title: rowModifications?.title ?? columnModifications?.title,
 			children: /* @__PURE__ */ jsx(TableCell, {
 				row,
 				rowIndex,
@@ -25,7 +25,7 @@ var RowDataCells = React.memo(({ row, rowIndex, columns, columnsSignature, modif
 		}, column.name);
 	});
 }, (prevProps, nextProps) => {
-	return prevProps.row === nextProps.row && prevProps.rowIndex === nextProps.rowIndex && prevProps.columnsSignature === nextProps.columnsSignature && prevProps.getCellErrors === nextProps.getCellErrors;
+	return prevProps.row === nextProps.row && prevProps.rowIndex === nextProps.rowIndex && prevProps.columnsSignature === nextProps.columnsSignature && prevProps.getCellErrors === nextProps.getCellErrors && prevProps.modifyRow === nextProps.modifyRow;
 });
 //#endregion
 export { RowDataCells };

package/dist/components/editable-table/RowDataCells.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"RowDataCells.js","names":[],"sources":["../../../src/components/editable-table/RowDataCells.jsx"],"sourcesContent":["import React from 'react';\nimport { TableCell as UITableCell } from '@verbb/plugin-kit-react/components';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { TableCell } from './TableCell';\n\nconst isThinColumn = (column) => {\n return Boolean(column?.thin \|\| column?.type === 'checkbox' \|\| column?.type === 'lightswitch' \|\| column?.type === 'radio');\n};\n\nexport const RowDataCells = React.memo(({\n row,\n rowIndex,\n columns,\n columnsSignature,\n modifyColumn,\n getCellErrors,\n onUpdateCell,\n}) => {\n return columns.map((column) => {\n return (\n <UITableCell\n key={column.name}\n className={cn(\n column.className,\n ~~isThinColumn(column) && 'w-[1%] whitespace-nowrap'~~,\n )}\n >\n <TableCell\n row={row}\n rowIndex={rowIndex}\n column={column}\n value={row[column.name]}\n modifyColumn={modifyColumn}\n getCellErrors={getCellErrors}\n onUpdateCell={onUpdateCell}\n />\n </UITableCell>\n );\n });\n}, (prevProps, nextProps) => {\n return (\n prevProps.row === nextProps.row\n && prevProps.rowIndex === nextProps.rowIndex\n && prevProps.columnsSignature === nextProps.columnsSignature\n && prevProps.getCellErrors === nextProps.getCellErrors\n );\n});\n"],"mappings":";;;;;;;;~~AAKA~~,~~IAAM,gBAAgB,WAAW;AAC7B,QAAO,QAAQ,QAAQ,QAAQ,QAAQ,SAAS,cAAc,QAAQ,SAAS,iBAAiB,QAAQ,SAAS,QAAQ;;AAG7H,~~IAAa,eAAe,MAAM,MAAM,EACpC,KACA,UACA,SACA,kBACA,cACA,eACA,mBACE;~~AACF~~,QAAO,QAAQ,KAAK,WAAW;~~AAC3B~~,SACI,oBAAC,aAAD;GAEI,WAAW,GACP,OAAO,WACP,~~aAAa~~,OAAO,~~IAAI~~,~~2BAC3B~~;~~aAED~~,oBAAC,WAAD;IACS;IACK;IACF;IACR,OAAO,IAAI,OAAO;IACJ;IACC;IACD;IAChB,CAAA;GACQ,~~EAfL~~,OAAO,~~KAeF~~;GAEpB;IACF,WAAW,cAAc;AACzB,QACI,UAAU,QAAQ,UAAU,OACzB,UAAU,aAAa,UAAU,YACjC,UAAU,qBAAqB,UAAU,oBACzC,UAAU,kBAAkB,UAAU;~~EAE/C~~"}
1	+ {"version":3,"file":"RowDataCells.js","names":[],"sources":["../../../src/components/editable-table/RowDataCells.jsx"],"sourcesContent":["import React from 'react';\nimport { TableCell as UITableCell } from '@verbb/plugin-kit-react/components';\nimport { cn } from '@verbb/plugin-kit-react/utils';\nimport { TableCell } from './TableCell';\n\nconst isThinColumn = (column) => {\n return Boolean(column?.thin \|\| column?.type === 'checkbox' \|\| column?.type === 'lightswitch' \|\| column?.type === 'radio');\n};\n\nexport const RowDataCells = React.memo(({\n row,\n rowIndex,\n columns,\n columnsSignature,\n modifyColumn,\n modifyRow,\n getCellErrors,\n onUpdateCell,\n}) => {\n const rowModifications = modifyRow ? modifyRow(row, rowIndex) : null;\n\n return columns.map((column) => {\n const columnModifications = modifyColumn ? modifyColumn(row, column.name) : null;\n\n return (\n <UITableCell\n key={column.name}\n className={cn(\n column.className,\n rowModifications?.cellClassName,\n columnModifications?.cellClassName,\n )}\n title={rowModifications?.title ?? columnModifications?.title}\n >\n <TableCell\n row={row}\n rowIndex={rowIndex}\n column={column}\n value={row[column.name]}\n modifyColumn={modifyColumn}\n getCellErrors={getCellErrors}\n onUpdateCell={onUpdateCell}\n />\n </UITableCell>\n );\n });\n}, (prevProps, nextProps) => {\n return (\n prevProps.row === nextProps.row\n && prevProps.rowIndex === nextProps.rowIndex\n && prevProps.columnsSignature === nextProps.columnsSignature\n && prevProps.getCellErrors === nextProps.getCellErrors\n && prevProps.modifyRow === nextProps.modifyRow\n );\n});\n"],"mappings":";;;;;;;;AASA,IAAa,eAAe,MAAM,MAAM,EACpC,KACA,UACA,SACA,kBACA,cACA,WACA,eACA,mBACE;CACF,MAAM,mBAAmB,YAAY,UAAU,KAAK,SAAS,GAAG;AAEhE,QAAO,QAAQ,KAAK,WAAW;EAC3B,MAAM,sBAAsB,eAAe,aAAa,KAAK,OAAO,KAAK,GAAG;AAE5E,SACI,oBAAC,aAAD;GAEI,WAAW,GACP,OAAO,WACP,kBAAkB,eAClB,qBAAqB,cACxB;GACD,OAAO,kBAAkB,SAAS,qBAAqB;aAEvD,oBAAC,WAAD;IACS;IACK;IACF;IACR,OAAO,IAAI,OAAO;IACJ;IACC;IACD;IAChB,CAAA;GACQ,EAjBL,OAAO,KAiBF;GAEpB;IACF,WAAW,cAAc;AACzB,QACI,UAAU,QAAQ,UAAU,OACzB,UAAU,aAAa,UAAU,YACjC,UAAU,qBAAqB,UAAU,oBACzC,UAAU,kBAAkB,UAAU,iBACtC,UAAU,cAAc,UAAU;EAE3C"}

package/dist/components/editable-table/TableRow.d.ts.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/TableRow.jsx"],"names":[],"mappings":"AA4DA,~~0DAoLG~~;~~kBAhPe~~,OAAO"}
1	+ {"version":3,"file":"TableRow.d.ts","sourceRoot":"","sources":["../../../src/components/editable-table/TableRow.jsx"],"names":[],"mappings":"AA4DA,0DA2LG;kBAvPe,OAAO"}

package/dist/components/editable-table/TableRow.js CHANGED Viewed

@@ -34,7 +34,7 @@ var PlainRow = ({ className, children }) => {
 		children: typeof children === "function" ? children({ handleRef: void 0 }) : children
 	});
 };
-var TableRow = React.memo(({ row, rowIndex, rowCount, columns, columnsSignature, useDnd, allowReorder, showReorderControls, allowDelete, modifyColumn, getCellErrors, onUpdateCell, moveRow, removeRow, t, renderRowActions, renderRowMenuItemsBeforeCore, renderRowMenuItemsAfterCore, renderRowMenuItems }) => {
+var TableRow = React.memo(({ row, rowIndex, rowCount, columns, columnsSignature, useDnd, allowReorder, showReorderControls, allowDelete, modifyColumn, modifyRow, getCellErrors, onUpdateCell, moveRow, removeRow, t, renderRowActions, renderRowMenuItemsBeforeCore, renderRowMenuItemsAfterCore, renderRowMenuItems }) => {
 	return /* @__PURE__ */ jsx(useDnd ? SortableRow : PlainRow, {
 		row,
 		rowIndex,
@@ -42,6 +42,7 @@ var TableRow = React.memo(({ row, rowIndex, rowCount, columns, columnsSignature,
 		className: "bg-white",
 		children: ({ handleRef }) => {
 			const dragHandleRef = useDnd ? handleRef : void 0;
+			const rowModifications = modifyRow ? modifyRow(row, rowIndex) : null;
 			const legacyBeforeRowMenuItems = renderRowMenuItems?.({
 				row,
 				rowIndex,
@@ -67,10 +68,12 @@ var TableRow = React.memo(({ row, rowIndex, rowCount, columns, columnsSignature,
 				columns,
 				columnsSignature,
 				modifyColumn,
+				modifyRow,
 				getCellErrors,
 				onUpdateCell
 			}), (showReorderControls || allowDelete) && /* @__PURE__ */ jsx(TableCell, {
-				className: cn("bg-[#fbfcfe]"),
+				className: cn(rowModifications?.cellClassName ?? "bg-[#fbfcfe]"),
+				title: rowModifications?.title,
 				children: /* @__PURE__ */ jsxs("div", {
 					className: "flex items-center px-1",
 					children: [
@@ -155,7 +158,7 @@ var TableRow = React.memo(({ row, rowIndex, rowCount, columns, columnsSignature,
 		}
 	});
 }, (prevProps, nextProps) => {
-	return prevProps.row === nextProps.row && prevProps.rowIndex === nextProps.rowIndex && prevProps.rowCount === nextProps.rowCount && prevProps.columnsSignature === nextProps.columnsSignature && prevProps.getCellErrors === nextProps.getCellErrors && prevProps.useDnd === nextProps.useDnd && prevProps.allowReorder === nextProps.allowReorder && prevProps.showReorderControls === nextProps.showReorderControls && prevProps.allowDelete === nextProps.allowDelete && prevProps.renderRowActions === nextProps.renderRowActions && prevProps.renderRowMenuItemsBeforeCore === nextProps.renderRowMenuItemsBeforeCore && prevProps.renderRowMenuItemsAfterCore === nextProps.renderRowMenuItemsAfterCore && prevProps.renderRowMenuItems === nextProps.renderRowMenuItems;
+	return prevProps.row === nextProps.row && prevProps.rowIndex === nextProps.rowIndex && prevProps.rowCount === nextProps.rowCount && prevProps.columnsSignature === nextProps.columnsSignature && prevProps.getCellErrors === nextProps.getCellErrors && prevProps.useDnd === nextProps.useDnd && prevProps.allowReorder === nextProps.allowReorder && prevProps.showReorderControls === nextProps.showReorderControls && prevProps.allowDelete === nextProps.allowDelete && prevProps.modifyRow === nextProps.modifyRow && prevProps.renderRowActions === nextProps.renderRowActions && prevProps.renderRowMenuItemsBeforeCore === nextProps.renderRowMenuItemsBeforeCore && prevProps.renderRowMenuItemsAfterCore === nextProps.renderRowMenuItemsAfterCore && prevProps.renderRowMenuItems === nextProps.renderRowMenuItems;
 });
 //#endregion
 export { TableRow };

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

	@@ -1 +1 @@
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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"}
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 modifyRow,\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 rowModifications = modifyRow ? modifyRow(row, rowIndex) : null;\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 modifyRow={modifyRow}\n getCellErrors={getCellErrors}\n onUpdateCell={onUpdateCell}\n />\n {(showReorderControls \|\| allowDelete) && (\n <TableCell\n className={cn(\n rowModifications?.cellClassName ?? 'bg-[#fbfcfe]',\n )}\n title={rowModifications?.title}\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.modifyRow === nextProps.modifyRow\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/types.d.ts CHANGED Viewed

@@ -24,7 +24,19 @@ export type EditableTableColumn = {
     renderCell?: (args: EditableTableRenderCellArgs) => React.ReactNode;
     [key: string]: unknown;
 };
-export type EditableTableModifyColumn = (row: EditableTableRow, columnName: string) => Partial<EditableTableColumn> | null | undefined;
+export type EditableTableModifyColumn = (row: EditableTableRow, columnName: string) => EditableTableModifyColumnResult | null | undefined;
+export type EditableTableModifyColumnResult = Partial<EditableTableColumn> & {
+    /** Applied to the table cell wrapper for this column. */
+    cellClassName?: string;
+    /** Native title attribute for the table cell wrapper. */
+    title?: string;
+};
+export type EditableTableModifyRow = (row: EditableTableRow, rowIndex: number) => {
+    /** Applied to every data cell in the row, and the actions cell when present. */
+    cellClassName?: string;
+    /** Native title attribute for affected cells. */
+    title?: string;
+} | null | undefined;
 export type EditableTableRowActionArgs = {
     row: EditableTableRow;
     rowIndex: number;

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

	@@ -1 +1 @@
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"}
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,+BAA+B,GAAG,IAAI,GAAG,SAAS,CAAC;AAExD,MAAM,MAAM,+BAA+B,GAAG,OAAO,CAAC,mBAAmB,CAAC,GAAG;IACzE,yDAAyD;IACzD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,yDAAyD;IACzD,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,CAAC;AAEF,MAAM,MAAM,sBAAsB,GAAG,CACjC,GAAG,EAAE,gBAAgB,EACrB,QAAQ,EAAE,MAAM,KACf;IACD,gFAAgF;IAChF,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,iDAAiD;IACjD,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB,GAAG,IAAI,GAAG,SAAS,CAAC;AAErB,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/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
     "name": "@verbb/plugin-kit-react",
-    "version": "1.0.2",
+    "version": "1.0.3",
     "type": "module",
     "main": "dist/index.js",
     "module": "dist/index.js",