npm - @economic/taco - Versions diffs - 2.20.2 → 2.21.0 - Mend

@economic/taco 2.20.2 → 2.21.0

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 (24) hide show

package/dist/components/Report/components/Body/Body.d.ts CHANGED Viewed

@@ -1,6 +1,7 @@
 import React from 'react';
 import { Table as ReactTable } from '@tanstack/react-table';
 declare type BodyProps<TType = unknown> = React.HTMLAttributes<HTMLTableSectionElement> & {
+    enableArrowKeyFocusing?: boolean;
     length: number;
     table: ReactTable<TType>;
 };

package/dist/components/Report/components/Body/util.d.ts ADDED Viewed

@@ -0,0 +1,6 @@
+export declare function useAugmentedFocusManager(): {
+    focusPrevious: () => import("@react-types/shared").FocusableElement;
+    focusNext: () => import("@react-types/shared").FocusableElement;
+    focusFirst: () => import("@react-types/shared").FocusableElement;
+    focusLast: () => import("@react-types/shared").FocusableElement;
+};

package/dist/components/Report/components/Cell/Cell.d.ts CHANGED Viewed

@@ -1,3 +1,9 @@
 /// <reference types="react" />
 import { Cell as ReactTableCell } from '@tanstack/react-table';
-export declare function Cell<TType = unknown>(cell: ReactTableCell<TType, unknown>, index: number): JSX.Element | null;
+declare type CellProps<TType = unknown> = {
+    cell: ReactTableCell<TType, unknown>;
+    index: number;
+    rowIndex: number;
+};
+export declare function Cell<TType = unknown>(props: CellProps<TType>): JSX.Element | null;
+export {};

package/dist/components/Report/components/Cell/DisplayCell.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
-/// <reference types="react" />
+import React from 'react';
 import { Cell as ReactTableCell } from '@tanstack/react-table';
 export declare type DisplayCellProps<TType = unknown> = {
-    index: number;
     cell: ReactTableCell<TType, unknown>;
+    cellRef: React.RefObject<HTMLTableCellElement>;
+    isHighlighted?: true | 'current';
 };
 export declare function DisplayCell<TType = unknown>(props: DisplayCellProps<TType>): JSX.Element;

package/dist/components/Report/components/Cell/GroupedCell.d.ts CHANGED Viewed

@@ -1,7 +1,8 @@
-/// <reference types="react" />
+import React from 'react';
 import { Cell as ReactTableCell } from '@tanstack/react-table';
 export declare type GroupedCellProps<TType = unknown> = {
-    index: number;
     cell: ReactTableCell<TType, unknown>;
+    cellRef: React.RefObject<HTMLTableCellElement>;
+    isHighlighted?: true | 'current';
 };
 export declare function GroupedCell<TType = unknown>(props: GroupedCellProps<TType>): JSX.Element;

package/dist/components/Report/components/Row/Row.d.ts CHANGED Viewed

@@ -2,7 +2,8 @@ import React from 'react';
 import { Table as ReactTable, Row as ReactTableRow } from '@tanstack/react-table';
 export declare type RowProps<TType = unknown> = React.HTMLAttributes<HTMLTableRowElement> & {
     index: number;
+    measureRow: (size: number, expansionHeight?: number) => void;
     row: ReactTableRow<TType>;
     table: ReactTable<TType>;
 };
-export declare function Row<TType = unknown>(row: ReactTableRow<TType>, index: number, table: ReactTable<TType>, measureRow: (size: number, expansionHeight?: number) => void): JSX.Element;
+export declare function Row<TType = unknown>(props: RowProps<TType>): JSX.Element;

package/dist/components/Report/components/Row/RowContext.d.ts CHANGED Viewed

@@ -5,5 +5,4 @@ declare type RowContextValue = {
     rowIndex: number;
 };
 export declare const RowContext: React.Context<RowContextValue>;
-export declare const useRowContext: () => RowContextValue;
 export {};

package/dist/components/Table3/hooks/features/useEditing.d.ts CHANGED Viewed

@@ -1,6 +1,6 @@
 import React from 'react';
 import { Cell as RTCell } from '@tanstack/react-table';
-import { Table3SaveHandler } from '../../types';
+import { Table3Ref, Table3SaveHandler } from '../../types';
 import { IndicatorReason } from '../../components/columns/cell/Indicator';
 import { Table3Validation } from './useValidation';
 export declare enum SavingStatusValue {
@@ -8,7 +8,7 @@ export declare enum SavingStatusValue {
     Saved = "saved",
     Error = "error"
 }
-export declare function useEditing<TType = unknown>(isEnabled: boolean, validation: Table3Validation<TType>, onSave?: Table3SaveHandler<TType>): {
+export declare function useEditing<TType = unknown>(isEnabled: boolean, tableRef: React.RefObject<Table3Ref>, validation: Table3Validation<TType>, onSave?: Table3SaveHandler<TType>): {
     isEnabled: boolean;
     isEditing: boolean;
     toggleEditing: React.Dispatch<React.SetStateAction<boolean>>;

package/dist/esm/packages/taco/src/components/Table3/Table3.js CHANGED Viewed

@@ -192,7 +192,9 @@ const Table = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
     role: "rowgroup",
     ref: bodyRef
   }, renderBody())), /*#__PURE__*/React__default.createElement("div", {
-    className: "border-grey-300 col-span-full translate-y-px border-t"
+    className: cn('border-grey-300 col-span-full border-t', {
+      'translate-y-px': tableMeta.enableFooter
+    })
   }), tableMeta.enableFooter ? ( /*#__PURE__*/React__default.createElement("div", {
     className: "group/footer contents",
     "data-taco": "table2-footer",
@@ -210,7 +212,7 @@ const Table = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {
     length: length,
     table: table
   })) : null)) : null)) : ( /*#__PURE__*/React__default.createElement("div", {
-    className: "col-span-full min-h-[theme(spacing.8)]"
+    className: "col-span-full box-border min-h-[theme(spacing.8)]"
   }, EmptyState ? /*#__PURE__*/React__default.createElement(EmptyState, null) : null))));
 });
 const Table3 = /*#__PURE__*/fixedForwardRef(function Table3(props, ref) {

package/dist/esm/packages/taco/src/components/Table3/Table3.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3GroupProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\nimport { useHeaderOffsetStyle } from './hooks/features/useHeaderOffsetStyle';\nimport { ErrorAlert } from './components/alert/ErrorAlert';\nimport { fixedForwardRef, FontSizes } from '../../types';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const {\n emptyState: EmptyState,\n customSettings,\n toolbarLeft,\n toolbarRight,\n defaultCurrentRowIndex: defaultRowActiveIndex,\n } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props, internalRef);\n useTableRefInstanceSetup(table, internalRef);\n\n React.useEffect(() => {\n if (props.autoFocus) {\n internalRef.current?.focus();\n }\n }, []);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const bodyRef = React.useRef<HTMLDivElement \| null>(null);\n\n React.useEffect(() => {\n // On a very first render, the tanstack table rendered without any rows,\n // so we delaying default row scrolling logic with using of requestAnimation frame\n const animationFrameId = requestAnimationFrame(() => {\n if (defaultRowActiveIndex) {\n scrollToIndex(defaultRowActiveIndex, { align: 'center' });\n }\n });\n\n return () => {\n cancelAnimationFrame(animationFrameId);\n };\n }, []);\n\n React.useEffect(\n () => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const dialog = target.closest('[role=\"dialog\"]');\n // Select2 also have combobox role to align with W3C guidelines\n const eventOriginatedFromCombobox = !!target.closest('[role=\"combobox\"]:not([data-taco=\"Select2\"])');\n\n // Don't trigger global shortcuts on the table if event originated from a combobox or if table is\n // outside the dialog\n if (\n eventOriginatedFromCombobox \|\|\n (dialog && !dialog?.contains(internalRef.current)) \|\|\n tableMeta.shortcutsState.isPaused\n ) {\n return;\n }\n\n const rows = table.getRowModel().rows;\n\n tableMeta.rowActive.handleKeyDown(\n event,\n rows.length,\n scrollToIndex,\n tableMeta.editing.isEditing ? undefined : internalRef\n );\n if (tableMeta.rowActive.rowActiveIndex !== undefined) {\n tableMeta.rowClick.handleKeyDown(event, rows[tableMeta.rowActive.rowActiveIndex]?.original);\n }\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n },\n // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n // scrollToIndex function.\n [scrollToIndex, tableMeta.editing.isEditing, internalRef.current, tableMeta.rowActive.rowActiveIndex]\n );\n\n const handleBlur = tableMeta.editing.isEnabled\n ? (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n }\n : undefined;\n\n const handleFocus =\n tableMeta.rowActive.rowActiveIndex === undefined\n ? (event: React.FocusEvent) => {\n tableMeta.rowActive.handleFocus(event, table.getRowModel().rows.length, scrollToIndex);\n }\n : undefined;\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px] focus-visible:outline-none',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === FontSizes.small,\n 'text-sm': tableMeta.fontSize.size === FontSizes.medium,\n 'text-base': tableMeta.fontSize.size === FontSizes.large,\n }\n );\n\n // Print tables have \"_print\" as the postfix for the table id, so we can use the it to determine\n // if the table is a print table or not.\n const { style: cssGridStyle } = useCssGrid<TType>(\n table,\n tableMeta.printing.isPrinting,\n tableMeta.rowActions.actionsForRowLength,\n tableMeta.fontSize.size\n );\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const headerOffsetStyle = useHeaderOffsetStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n {headerOffsetStyle && !tableMeta.printing.isPrinting ? (\n <style data-taco=\"table3-column-header-offset-styles\">{headerOffsetStyle}</style>\n ) : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n customSettings={customSettings}\n scrollToIndex={scrollToIndex}\n />\n <ErrorAlert table={table} tableRef={internalRef} scrollToIndex={scrollToIndex} rowIdentifier={props.rowIdentifier} />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.rowActive.isHoverStatePaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onFocus={handleFocus}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}\n tabIndex={-1}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map((header, index) => {\n // We need to render separator if column is not the last in array, if index is not equal to freeze column index,\n // if next element is not placeholder and if column itself is not placeholder.\n const hasSeparator =\n index !== tableMeta.columnFreezing.frozenColumnIndex &&\n index !== headerGroup.headers.length - 1 &&\n (!headerGroup.headers[index + 1]?.isPlaceholder \|\| !header.isPlaceholder);\n return (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, {\n ...header.getContext(),\n scrollToIndex,\n hasSeparator,\n })}\n </React.Fragment>\n );\n })}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope autoFocus={tableMeta.editing.isEditing}>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n {renderBody()}\n </div>\n </FocusScope>\n {/* This div makes sure that there is always a free space between the rows and footer when\n table height exceeds the cumulative height of all rows. See useCSSGrid.ts /}\n {/ By vertically translating the div a pixel down, we hide the div border below footer so that\n the footer border doesn't appear an extra pixel thick */}\n <div className=\"border-grey-300 col-span-full translate-y-px border-t\" />\n {tableMeta.enableFooter ? (\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {\n // Render the footer cell only for individual columns, excluding column groups.\n table\n .getFooterGroups()\n .slice(0, 1)\n .map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))\n }\n {length ? (\n <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n ) : null}\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"col-span-full min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\nTable3.Group = Group;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsHandler,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","displayName","Group","Table","fixedForwardRef","Table3","props","ref","emptyState","EmptyState","customSettings","toolbarLeft","toolbarRight","defaultCurrentRowIndex","defaultRowActiveIndex","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","React","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","animationFrameId","requestAnimationFrame","align","cancelAnimationFrame","handleKeyDown","event","target","dialog","closest","eventOriginatedFromCombobox","contains","shortcutsState","isPaused","rows","getRowModel","rowActive","editing","isEditing","undefined","rowActiveIndex","_rows$tableMeta$rowAc","rowClick","original","rowSelection","document","addEventListener","removeEventListener","handleBlur","isEnabled","handleFocus","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","FontSizes","small","medium","large","style","cssGridStyle","useCssGrid","printing","isPrinting","rowActions","actionsForRowLength","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","headerOffsetStyle","useHeaderOffsetStyle","isServerLoadingAndNotReady","isUsingServer","Toolbar","tableProps","total","left","right","ErrorAlert","tableRef","rowIdentifier","horizontallyScrolled","isHoverStatePaused","columnSizingInfo","isResizingColumn","onBlur","onFocus","onScroll","role","tabIndex","getHeaderGroups","map","headerGroup","key","headers","header","index","hasSeparator","frozenColumnIndex","_headerGroup$headers","isPlaceholder","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","slice","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}
1	+ {"version":3,"file":"Table3.js","sources":["../../../../../../../src/components/Table3/Table3.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { flexRender, TableMeta } from '@tanstack/react-table';\nimport { FocusScope } from '@react-aria/focus';\nimport { useMergedRef } from '../../hooks/useMergedRef';\nimport { useCssGrid } from './hooks/useCssGrid';\nimport { useTable } from './hooks/useTable';\nimport { useTableRenderStrategy } from './strategies';\nimport { Table3ColumnProps, Table3GroupProps, Table3Props, Table3Ref } from './types';\nimport { Toolbar } from './components/toolbar/Toolbar';\nimport { useColumnFreezingStyle } from './hooks/features/useColumnFreezing';\nimport { useTableRefInstanceSetup } from './hooks/useTableRefInstanceSetup';\nimport { Summary } from './components/columns/footer/Summary';\nimport { useCssVars } from './hooks/useCssVars';\nimport './style.css';\nimport { useHeaderOffsetStyle } from './hooks/features/useHeaderOffsetStyle';\nimport { ErrorAlert } from './components/alert/ErrorAlert';\nimport { fixedForwardRef, FontSizes } from '../../types';\n\nfunction Column<TType = unknown>(_: Table3ColumnProps<TType>) {\n return null;\n}\nColumn.displayName = 'Table3Column';\n\nfunction Group(_: Table3GroupProps) {\n return null;\n}\nGroup.displayName = 'Table3Group';\n\nconst Table = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const {\n emptyState: EmptyState,\n customSettings,\n toolbarLeft,\n toolbarRight,\n defaultCurrentRowIndex: defaultRowActiveIndex,\n } = props;\n const internalRef = useMergedRef<Table3Ref>(ref);\n\n const { table, length } = useTable<TType>(props, internalRef);\n useTableRefInstanceSetup(table, internalRef);\n\n React.useEffect(() => {\n if (props.autoFocus) {\n internalRef.current?.focus();\n }\n }, []);\n\n const { renderBody, scrollToIndex } = useTableRenderStrategy<TType>(props, table, internalRef);\n const tableMeta = table.options.meta as TableMeta<TType>;\n const state = table.getState();\n\n const bodyRef = React.useRef<HTMLDivElement \| null>(null);\n\n React.useEffect(() => {\n // On a very first render, the tanstack table rendered without any rows,\n // so we delaying default row scrolling logic with using of requestAnimation frame\n const animationFrameId = requestAnimationFrame(() => {\n if (defaultRowActiveIndex) {\n scrollToIndex(defaultRowActiveIndex, { align: 'center' });\n }\n });\n\n return () => {\n cancelAnimationFrame(animationFrameId);\n };\n }, []);\n\n React.useEffect(\n () => {\n const handleKeyDown = (event: KeyboardEvent) => {\n const target = event.target as HTMLElement;\n const dialog = target.closest('[role=\"dialog\"]');\n // Select2 also have combobox role to align with W3C guidelines\n const eventOriginatedFromCombobox = !!target.closest('[role=\"combobox\"]:not([data-taco=\"Select2\"])');\n\n // Don't trigger global shortcuts on the table if event originated from a combobox or if table is\n // outside the dialog\n if (\n eventOriginatedFromCombobox \|\|\n (dialog && !dialog?.contains(internalRef.current)) \|\|\n tableMeta.shortcutsState.isPaused\n ) {\n return;\n }\n\n const rows = table.getRowModel().rows;\n\n tableMeta.rowActive.handleKeyDown(\n event,\n rows.length,\n scrollToIndex,\n tableMeta.editing.isEditing ? undefined : internalRef\n );\n if (tableMeta.rowActive.rowActiveIndex !== undefined) {\n tableMeta.rowClick.handleKeyDown(event, rows[tableMeta.rowActive.rowActiveIndex]?.original);\n }\n tableMeta.rowSelection.handleKeyDown(event, table);\n tableMeta.editing.handleKeyDown(event);\n };\n\n document.addEventListener('keydown', handleKeyDown);\n\n return () => {\n document.removeEventListener('keydown', handleKeyDown);\n };\n },\n // See https://github.com/e-conomic/taco/blob/dev/packages/taco/src/components/Table3/strategies/virtualised.tsx#L143\n // scrollToIndex function changes when row count changes, so it is important to update handlers with new\n // scrollToIndex function.\n [scrollToIndex, tableMeta.editing.isEditing, internalRef.current, tableMeta.rowActive.rowActiveIndex]\n );\n\n const handleBlur = tableMeta.editing.isEnabled\n ? (event: React.FocusEvent) => {\n tableMeta.editing.handleBlur(event);\n }\n : undefined;\n\n const handleFocus =\n tableMeta.rowActive.rowActiveIndex === undefined\n ? (event: React.FocusEvent) => {\n tableMeta.rowActive.handleFocus(event, table.getRowModel().rows.length, scrollToIndex);\n }\n : undefined;\n\n const handleScroll = async (event: React.MouseEvent<HTMLDivElement>) => {\n tableMeta.columnFreezing.handleScroll(event);\n };\n\n const className = cn(\n 'border-grey-300 relative grid h-full w-full flex-grow overflow-auto rounded border bg-white scroll-mt-[41px] focus-visible:outline-none',\n '[&[data-resizing=\"true\"]]:select-none',\n {\n 'text-xs': tableMeta.fontSize.size === FontSizes.small,\n 'text-sm': tableMeta.fontSize.size === FontSizes.medium,\n 'text-base': tableMeta.fontSize.size === FontSizes.large,\n }\n );\n\n // Print tables have \"_print\" as the postfix for the table id, so we can use the it to determine\n // if the table is a print table or not.\n const { style: cssGridStyle } = useCssGrid<TType>(\n table,\n tableMeta.printing.isPrinting,\n tableMeta.rowActions.actionsForRowLength,\n tableMeta.fontSize.size\n );\n const { style: cssVars } = useCssVars(tableMeta.rowHeight.height, tableMeta.fontSize.size);\n\n const style = {\n ...cssVars,\n ...cssGridStyle,\n // create a new stacking context so our internal z-indexes don't effect external components\n // https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Positioning/Understanding_z_index/The_stacking_context\n opacity: 0.999,\n };\n\n const columnFreezingStyle = useColumnFreezingStyle(props.id, table);\n const headerOffsetStyle = useHeaderOffsetStyle(props.id, table);\n const isServerLoadingAndNotReady = tableMeta.isUsingServer && props.length === undefined;\n\n return (\n <>\n {columnFreezingStyle ? <style data-taco=\"table3-column-freezing-styles\">{columnFreezingStyle}</style> : null}\n {headerOffsetStyle && !tableMeta.printing.isPrinting ? (\n <style data-taco=\"table3-column-header-offset-styles\">{headerOffsetStyle}</style>\n ) : null}\n <Toolbar\n table={table}\n tableProps={props}\n total={length}\n left={toolbarLeft}\n right={toolbarRight}\n customSettings={customSettings}\n scrollToIndex={scrollToIndex}\n />\n <ErrorAlert table={table} tableRef={internalRef} scrollToIndex={scrollToIndex} rowIdentifier={props.rowIdentifier} />\n <div\n className={className}\n id={props.id}\n data-font-size={tableMeta.fontSize.size}\n data-editing={tableMeta.editing.isEditing}\n data-horizontally-scrolled={tableMeta.columnFreezing.horizontallyScrolled}\n data-pause-hover={tableMeta?.rowActive.isHoverStatePaused}\n data-resizing={!!state.columnSizingInfo.isResizingColumn}\n data-taco=\"table2\"\n onBlur={handleBlur}\n onFocus={handleFocus}\n onScroll={handleScroll}\n ref={internalRef}\n role=\"table\"\n style={style}\n tabIndex={-1}>\n {isServerLoadingAndNotReady ? null : (\n <div className=\"group/header contents\" data-taco=\"table2-header\" role=\"rowgroup\">\n {table.getHeaderGroups().map(headerGroup => (\n <div className=\"contents\" key={headerGroup.id} role=\"row\">\n {headerGroup.headers.map((header, index) => {\n // We need to render separator if column is not the last in array, if index is not equal to freeze column index,\n // if next element is not placeholder and if column itself is not placeholder.\n const hasSeparator =\n index !== tableMeta.columnFreezing.frozenColumnIndex &&\n index !== headerGroup.headers.length - 1 &&\n (!headerGroup.headers[index + 1]?.isPlaceholder \|\| !header.isPlaceholder);\n return (\n <React.Fragment key={header.id}>\n {flexRender(header.column.columnDef.header, {\n ...header.getContext(),\n scrollToIndex,\n hasSeparator,\n })}\n </React.Fragment>\n );\n })}\n </div>\n ))}\n </div>\n )}\n {table.getRowModel().rows.length ? (\n <>\n <FocusScope autoFocus={tableMeta.editing.isEditing}>\n <div className=\"group/body contents\" data-taco=\"table2-body\" role=\"rowgroup\" ref={bodyRef}>\n {renderBody()}\n </div>\n </FocusScope>\n {/* This div makes sure that there is always a free space between the rows and footer when\n table height exceeds the cumulative height of all rows. See useCSSGrid.ts /}\n {/ By vertically translating the div a pixel down, we hide the div border below footer so that\n the footer border doesn't appear an extra pixel thick */}\n <div\n className={cn('border-grey-300 col-span-full border-t', { 'translate-y-px': tableMeta.enableFooter })}\n />\n {tableMeta.enableFooter ? (\n <div className=\"group/footer contents\" data-taco=\"table2-footer\" role=\"rowgroup\">\n {\n // Render the footer cell only for individual columns, excluding column groups.\n table\n .getFooterGroups()\n .slice(0, 1)\n .map(footerGroup => (\n <div className=\"contents\" key={footerGroup.id} role=\"row\">\n {footerGroup.headers.map(footer => (\n <React.Fragment key={footer.id}>\n {flexRender(footer.column.columnDef.footer, footer.getContext())}\n </React.Fragment>\n ))}\n </div>\n ))\n }\n {length ? (\n <Summary currentLength={table.getRowModel().rows.length} length={length} table={table} />\n ) : null}\n </div>\n ) : null}\n </>\n ) : (\n <div className=\"col-span-full box-border min-h-[theme(spacing.8)]\">{EmptyState ? <EmptyState /> : null}</div>\n )}\n </div>\n </>\n );\n});\n\ntype Table3WithStatics = (<TType = unknown>(props: Table3Props<TType> & React.RefAttributes<Table3Ref>) => JSX.Element) & {\n Column: typeof Column;\n Group: typeof Group;\n};\n\nexport const Table3 = fixedForwardRef(function Table3<TType = unknown>(props: Table3Props<TType>, ref: React.Ref<Table3Ref>) {\n const stringifiedChildren = String(props.children);\n // we force a remount (using key) when the child columns change because there are too many places to add children as an effect\n // this is cheaper from a complexity perspective, and probably performance wise as well\n const key = React.useMemo(() => String('tableKey_' + stringifiedChildren), [stringifiedChildren]);\n return <Table<TType> {...props} key={key} ref={ref} />;\n}) as Table3WithStatics;\nTable3.Column = Column;\nTable3.Group = Group;\n\n// hooks\nexport { useTable3DataLoader } from './hooks/useTableDataLoader';\n\n// types\nexport type {\n useTable3DataFetcher,\n useTable3DataOptions,\n useTable3DataFetcherValues as useTableDataValues,\n} from './hooks/useTableDataLoader';\n\nexport type {\n Table3Ref,\n Table3Props,\n Table3Preset,\n Table3Settings,\n Table3SettingsHandler,\n Table3RowHeight,\n Table3FilterComparator,\n Table3FilterHandler,\n Table3LoadPageHandler,\n Table3LoadAllHandler,\n Table3RowGotoHandler,\n Table3SortHandler,\n Table3Shortcuts,\n Table3ShortcutHandlerFn,\n Table3ShortcutHandlerObject,\n Table3SortDirection,\n Table3SortFn,\n Table3RowActionRenderer,\n Table3RowSelectionHandler,\n Table3RowExpansionRenderer,\n Table3RowDropHandler,\n Table3RowDragHandler,\n Table3RowClickHandler,\n Table3ColumnProps,\n Table3ColumnAlignment,\n Table3ColumnDataType,\n Table3ColumnHeaderMenu,\n Table3ColumnClassNameHandler,\n Table3ColumnFooterRenderer,\n Table3ColumnRenderer,\n Table3ColumnControlRenderer,\n Table3ColumnControlProps,\n} from './types';\n"],"names":["Column","_","displayName","Group","Table","fixedForwardRef","Table3","props","ref","emptyState","EmptyState","customSettings","toolbarLeft","toolbarRight","defaultCurrentRowIndex","defaultRowActiveIndex","internalRef","useMergedRef","table","length","useTable","useTableRefInstanceSetup","React","useEffect","autoFocus","_internalRef$current","current","focus","renderBody","scrollToIndex","useTableRenderStrategy","tableMeta","options","meta","state","getState","bodyRef","useRef","animationFrameId","requestAnimationFrame","align","cancelAnimationFrame","handleKeyDown","event","target","dialog","closest","eventOriginatedFromCombobox","contains","shortcutsState","isPaused","rows","getRowModel","rowActive","editing","isEditing","undefined","rowActiveIndex","_rows$tableMeta$rowAc","rowClick","original","rowSelection","document","addEventListener","removeEventListener","handleBlur","isEnabled","handleFocus","handleScroll","columnFreezing","Promise","resolve","e","reject","className","cn","fontSize","size","FontSizes","small","medium","large","style","cssGridStyle","useCssGrid","printing","isPrinting","rowActions","actionsForRowLength","cssVars","useCssVars","rowHeight","height","opacity","columnFreezingStyle","useColumnFreezingStyle","id","headerOffsetStyle","useHeaderOffsetStyle","isServerLoadingAndNotReady","isUsingServer","Toolbar","tableProps","total","left","right","ErrorAlert","tableRef","rowIdentifier","horizontallyScrolled","isHoverStatePaused","columnSizingInfo","isResizingColumn","onBlur","onFocus","onScroll","role","tabIndex","getHeaderGroups","map","headerGroup","key","headers","header","index","hasSeparator","frozenColumnIndex","_headerGroup$headers","isPlaceholder","Fragment","flexRender","column","columnDef","getContext","FocusScope","enableFooter","getFooterGroups","slice","footerGroup","footer","Summary","currentLength","stringifiedChildren","String","children","useMemo"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/controls/TextareaControl.js CHANGED Viewed

@@ -25,6 +25,7 @@ const TextareaControl = /*#__PURE__*/React__default.forwardRef(function Textarea
     onKeyDown: handleKeyDown,
     onChange: handleChange,
     onBlur,
+    onFocus,
     column,
     isCellInDetailMode,
     align,
@@ -98,6 +99,13 @@ const TextareaControl = /*#__PURE__*/React__default.forwardRef(function Textarea
     }
     onBlur(event);
   };
+  const handleFocus = event => {
+    const textareaElement = ref === null || ref === void 0 ? void 0 : ref.current;
+    if (textareaElement) {
+      resizeTextArea(textareaElement);
+    }
+    onFocus(event);
+  };
   return /*#__PURE__*/React__default.createElement("div", {
     "data-taco": "input-container"
   }, /*#__PURE__*/React__default.createElement("div", {
@@ -117,7 +125,8 @@ const TextareaControl = /*#__PURE__*/React__default.forwardRef(function Textarea
       handleTextareaKeyDown(e);
     },
     onBlur: handleBlur,
-    className: cn(getCellAlignmentClasses(align), `h-fit resize-none [&:not(:focus)]:whitespace-nowrap`, {
+    onFocus: handleFocus,
+    className: cn(getCellAlignmentClasses(align), `h-fit resize-none overflow-y-hidden focus:overflow-y-auto [&:not(:focus)]:whitespace-nowrap`, {
       [`!min-h-[${minMaxHeight.min}px]`]: columnMeta === null || columnMeta === void 0 ? void 0 : columnMeta.enableTruncate,
       '!yt-focus-dark': isCellInDetailMode,
       [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && (columnMeta === null || columnMeta === void 0 ? void 0 : columnMeta.enableTruncate),

package/dist/esm/packages/taco/src/components/Table3/components/columns/cell/controls/TextareaControl.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"TextareaControl.js","sources":["../../../../../../../../../../../src/components/Table3/components/columns/cell/controls/TextareaControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Textarea } from '../../../../../Textarea/Textarea';\nimport { EditingControlProps } from '../EditingControl';\nimport { getCellAlignmentClasses } from '../../styles';\nimport { useMergedRef } from '../../../../../../hooks/useMergedRef';\nimport { FontSize } from '../../../../../../types';\n\ntype TextareaHeight = {\n min: number;\n max: number;\n};\n// By UX design, textarea should fold to min size when blured and extend to max 5 lines height when edited in enableTruncate mode,\n// for this reason we need to set min/max height limits for each font size value.\nconst heights: Record<FontSize, TextareaHeight> = {\n small: {\n min: 24,\n max: 86,\n },\n medium: {\n min: 32,\n max: 100,\n },\n large: {\n min: 40,\n max: 140,\n },\n};\n\ntype TextareaControlProps<TType = unknown> = EditingControlProps<TType> & {\n onKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n fontSize: FontSize;\n invalid: boolean;\n isCellInDetailMode?: boolean;\n};\n\nexport const TextareaControl = React.forwardRef<HTMLElement, any>(function TextareaControl<TType = unknown>(\n props: TextareaControlProps<TType>,\n externalRef: React.Ref<HTMLElement>\n) {\n const {\n onKeyDown: handleKeyDown,\n onChange: handleChange,\n onBlur,\n column,\n isCellInDetailMode,\n align,\n isActiveRow,\n value,\n fontSize,\n ...attributes\n } = props;\n\n const minMaxHeight = heights[fontSize];\n\n const columnMeta = column.columnDef.meta;\n\n const ref = useMergedRef<HTMLTextAreaElement>(externalRef);\n\n React.useEffect(() => {\n if (ref?.current) {\n // Need to reset textarea to min height when font size got changed and if column in enable truncate mode.\n if (columnMeta?.enableTruncate) {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n textareaElement.style.height = `${minMaxHeight.min}px`;\n\n // If truncation is not enabled, then textarea should re-calculate it's height to fit with it's own content, when initialized or fonsSize got changed.\n } else {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n resizeTextArea(textareaElement);\n }\n }\n }, [fontSize]);\n\n React.useEffect(() => {\n // If truncation is enabled, then textarea should only adjust to it's own content, when in detail mode.\n // Otherwise it should collapse to minimal height.\n if (ref?.current && columnMeta?.enableTruncate) {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n\n if (isCellInDetailMode) {\n resizeTextArea(textareaElement);\n } else {\n textareaElement.style.height = `${minMaxHeight.min}px`;\n }\n }\n }, [isCellInDetailMode]);\n\n const resizeTextArea = (textareaElement: HTMLTextAreaElement) => {\n // Need to set inherit before calculating height, so that browser sets the scrollHeight properly,\n // depending on text inside.\n const textareaRect = textareaElement.getBoundingClientRect();\n const prevHeight = textareaRect.height;\n if (columnMeta?.enableTruncate) {\n if (prevHeight < minMaxHeight.max) {\n textareaElement.style.height = 'inherit';\n textareaElement.style.height = `${Math.min(textareaElement.scrollHeight, minMaxHeight.max)}px`;\n }\n } else {\n textareaElement.style.height = 'inherit';\n textareaElement.style.height = `${textareaElement.scrollHeight}px`;\n }\n };\n\n const handleTextareaChange = e => {\n resizeTextArea(e.target);\n };\n\n const textareaContainerClassName = cn('w-full', {\n 'focus-within:absolute focus-within:left-0 focus-within:top-0 focus-within:z-[9]': columnMeta?.enableTruncate,\n });\n const handleTextareaKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // By default Shift + Enter in textarea makes a new line, we want to keep this behaviour\n if (event.shiftKey && event.key === 'Enter') {\n return;\n } else {\n handleKeyDown(event);\n }\n };\n\n const handleBlur = event => {\n // If truncation is enabled, then textarea should shring back to min height, when loosing focus.\n if (columnMeta?.enableTruncate) {\n const textareaElement = event.currentTarget;\n textareaElement.style.height = `${minMaxHeight.min}px`;\n }\n onBlur(event);\n };\n\n return (\n <div data-taco=\"input-container\">\n {/*\n Textarea should have min height placeholder, because it becomes absolute positioned when focused,\n * which leads to overlapping of validation message rendered bellow.\n * Somehow tailwind cannot dynamically assign min height when arbitary value has been used(in this particular case),\n * so assigning it through style prop here\n **/}\n <div style={{ minHeight: `${minMaxHeight.min}px` }} className=\"relative\">\n <div className={textareaContainerClassName}>\n <Textarea\n {...attributes}\n onChange={event => {\n handleChange(event.target.value);\n handleTextareaChange(event);\n }}\n rows={1}\n onKeyDown={e => {\n handleTextareaKeyDown(e);\n }}\n onBlur={handleBlur}\n className={cn(getCellAlignmentClasses(align), `h-fit resize-none [&:not(:focus)]:whitespace-nowrap`, {\n [`!min-h-[${minMaxHeight.min}px]`]: columnMeta?.enableTruncate,\n '!yt-focus-dark': isCellInDetailMode,\n [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && columnMeta?.enableTruncate,\n // Only allow resizing when focused and truncation enabled\n 'focus:resize-y': isActiveRow && columnMeta?.enableTruncate,\n })}\n ref={ref}\n value={String(value ?? '')}\n />\n </div>\n </div>\n </div>\n );\n});\n"],"names":["heights","small","min","max","medium","large","TextareaControl","React","forwardRef","props","externalRef","onKeyDown","handleKeyDown","onChange","handleChange","onBlur","column","isCellInDetailMode","align","isActiveRow","value","fontSize","attributes","minMaxHeight","columnMeta","columnDef","meta","ref","useMergedRef","useEffect","current","enableTruncate","textareaElement","style","height","resizeTextArea","textareaRect","getBoundingClientRect","prevHeight","Math","scrollHeight","handleTextareaChange","e","target","textareaContainerClassName","cn","handleTextareaKeyDown","event","shiftKey","key","handleBlur","currentTarget","minHeight","className","Textarea","rows","getCellAlignmentClasses","String"],"mappings":"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"}
1	+ {"version":3,"file":"TextareaControl.js","sources":["../../../../../../../../../../../src/components/Table3/components/columns/cell/controls/TextareaControl.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'clsx';\nimport { Textarea } from '../../../../../Textarea/Textarea';\nimport { EditingControlProps } from '../EditingControl';\nimport { getCellAlignmentClasses } from '../../styles';\nimport { useMergedRef } from '../../../../../../hooks/useMergedRef';\nimport { FontSize } from '../../../../../../types';\n\ntype TextareaHeight = {\n min: number;\n max: number;\n};\n// By UX design, textarea should fold to min size when blured and extend to max 5 lines height when edited in enableTruncate mode,\n// for this reason we need to set min/max height limits for each font size value.\nconst heights: Record<FontSize, TextareaHeight> = {\n small: {\n min: 24,\n max: 86,\n },\n medium: {\n min: 32,\n max: 100,\n },\n large: {\n min: 40,\n max: 140,\n },\n};\n\ntype TextareaControlProps<TType = unknown> = EditingControlProps<TType> & {\n onKeyDown: (event: React.KeyboardEvent<HTMLTextAreaElement>) => void;\n fontSize: FontSize;\n invalid: boolean;\n isCellInDetailMode?: boolean;\n};\n\nexport const TextareaControl = React.forwardRef<HTMLElement, any>(function TextareaControl<TType = unknown>(\n props: TextareaControlProps<TType>,\n externalRef: React.Ref<HTMLElement>\n) {\n const {\n onKeyDown: handleKeyDown,\n onChange: handleChange,\n onBlur,\n onFocus,\n column,\n isCellInDetailMode,\n align,\n isActiveRow,\n value,\n fontSize,\n ...attributes\n } = props;\n\n const minMaxHeight = heights[fontSize];\n\n const columnMeta = column.columnDef.meta;\n\n const ref = useMergedRef<HTMLTextAreaElement>(externalRef);\n\n React.useEffect(() => {\n if (ref?.current) {\n // Need to reset textarea to min height when font size got changed and if column in enable truncate mode.\n if (columnMeta?.enableTruncate) {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n textareaElement.style.height = `${minMaxHeight.min}px`;\n\n // If truncation is not enabled, then textarea should re-calculate it's height to fit with it's own content, when initialized or fonsSize got changed.\n } else {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n resizeTextArea(textareaElement);\n }\n }\n }, [fontSize]);\n\n React.useEffect(() => {\n // If truncation is enabled, then textarea should only adjust to it's own content, when in detail mode.\n // Otherwise it should collapse to minimal height.\n if (ref?.current && columnMeta?.enableTruncate) {\n const textareaElement = ref?.current as HTMLTextAreaElement;\n\n if (isCellInDetailMode) {\n resizeTextArea(textareaElement);\n } else {\n textareaElement.style.height = `${minMaxHeight.min}px`;\n }\n }\n }, [isCellInDetailMode]);\n\n const resizeTextArea = (textareaElement: HTMLTextAreaElement) => {\n // Need to set inherit before calculating height, so that browser sets the scrollHeight properly,\n // depending on text inside.\n const textareaRect = textareaElement.getBoundingClientRect();\n const prevHeight = textareaRect.height;\n if (columnMeta?.enableTruncate) {\n if (prevHeight < minMaxHeight.max) {\n textareaElement.style.height = 'inherit';\n textareaElement.style.height = `${Math.min(textareaElement.scrollHeight, minMaxHeight.max)}px`;\n }\n } else {\n textareaElement.style.height = 'inherit';\n textareaElement.style.height = `${textareaElement.scrollHeight}px`;\n }\n };\n\n const handleTextareaChange = e => {\n resizeTextArea(e.target);\n };\n\n const textareaContainerClassName = cn('w-full', {\n 'focus-within:absolute focus-within:left-0 focus-within:top-0 focus-within:z-[9]': columnMeta?.enableTruncate,\n });\n const handleTextareaKeyDown = (event: React.KeyboardEvent<HTMLTextAreaElement>) => {\n // By default Shift + Enter in textarea makes a new line, we want to keep this behaviour\n if (event.shiftKey && event.key === 'Enter') {\n return;\n } else {\n handleKeyDown(event);\n }\n };\n\n const handleBlur = event => {\n // If truncation is enabled, then textarea should shring back to min height, when loosing focus.\n if (columnMeta?.enableTruncate) {\n const textareaElement = event.currentTarget;\n textareaElement.style.height = `${minMaxHeight.min}px`;\n }\n onBlur(event);\n };\n\n const handleFocus = (event: React.FocusEvent) => {\n const textareaElement = ref?.current;\n\n if (textareaElement) {\n resizeTextArea(textareaElement);\n }\n\n onFocus(event);\n };\n\n return (\n <div data-taco=\"input-container\">\n {/*\n Textarea should have min height placeholder, because it becomes absolute positioned when focused,\n * which leads to overlapping of validation message rendered bellow.\n * Somehow tailwind cannot dynamically assign min height when arbitary value has been used(in this particular case),\n * so assigning it through style prop here\n **/}\n <div style={{ minHeight: `${minMaxHeight.min}px` }} className=\"relative\">\n <div className={textareaContainerClassName}>\n <Textarea\n {...attributes}\n onChange={event => {\n handleChange(event.target.value);\n handleTextareaChange(event);\n }}\n rows={1}\n onKeyDown={e => {\n handleTextareaKeyDown(e);\n }}\n onBlur={handleBlur}\n onFocus={handleFocus}\n className={cn(\n getCellAlignmentClasses(align),\n `h-fit resize-none overflow-y-hidden focus:overflow-y-auto [&:not(:focus)]:whitespace-nowrap`,\n {\n [`!min-h-[${minMaxHeight.min}px]`]: columnMeta?.enableTruncate,\n '!yt-focus-dark': isCellInDetailMode,\n [`h-[${minMaxHeight.min}px]`]: !isCellInDetailMode && columnMeta?.enableTruncate,\n // Only allow resizing when focused and truncation enabled\n 'focus:resize-y': isActiveRow && columnMeta?.enableTruncate,\n }\n )}\n ref={ref}\n value={String(value ?? '')}\n />\n </div>\n </div>\n </div>\n );\n});\n"],"names":["heights","small","min","max","medium","large","TextareaControl","React","forwardRef","props","externalRef","onKeyDown","handleKeyDown","onChange","handleChange","onBlur","onFocus","column","isCellInDetailMode","align","isActiveRow","value","fontSize","attributes","minMaxHeight","columnMeta","columnDef","meta","ref","useMergedRef","useEffect","current","enableTruncate","textareaElement","style","height","resizeTextArea","textareaRect","getBoundingClientRect","prevHeight","Math","scrollHeight","handleTextareaChange","e","target","textareaContainerClassName","cn","handleTextareaKeyDown","event","shiftKey","key","handleBlur","currentTarget","handleFocus","minHeight","className","Textarea","rows","getCellAlignmentClasses","String"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/hooks/features/useEditing.js CHANGED Viewed

@@ -1,5 +1,6 @@
 import React__default from 'react';
 import { shouldTriggerShortcut } from '../../../../utils/keyboard.js';
+import { isElementInsideOrTriggeredFromContainer } from '../../../../utils/dom.js';
 import _ from 'lodash-es';
 import { lastCellIndex } from '../../components/rows/Row.js';
@@ -9,7 +10,7 @@ var SavingStatusValue;
   SavingStatusValue["Saved"] = "saved";
   SavingStatusValue["Error"] = "error";
 })(SavingStatusValue || (SavingStatusValue = {}));
-function useEditing(isEnabled, validation, onSave) {
+function useEditing(isEnabled, tableRef, validation, onSave) {
   // used to switch the table into editing mode
   const [isEditing, setIsEditing] = React__default.useState(false);
   // Saving indicator need to show saving status per row, saving status can have at least two states 'saving', 'saved',
@@ -176,6 +177,20 @@ function useEditing(isEnabled, validation, onSave) {
     }
     return false;
   }, [isEditing, editingState]);
+  React__default.useEffect(() => {
+    const handleClickOutside = event => {
+      const target = event.target;
+      const closestPopup = target.closest('[role="dialog"], [role="menu"]');
+      // Need to check that neither target itself nor closest popup is inside or triggetred from the table.
+      if (!isElementInsideOrTriggeredFromContainer(target, tableRef.current) && !isElementInsideOrTriggeredFromContainer(closestPopup, tableRef.current)) {
+        saveChangesIfNeeded();
+      }
+    };
+    document.addEventListener('click', handleClickOutside);
+    return () => {
+      document.removeEventListener('click', handleClickOutside);
+    };
+  }, [saveChangesIfNeeded]);
   function getSavingStatus(rowId) {
     return savingStatuses && savingStatuses[rowId];
   }

package/dist/esm/packages/taco/src/components/Table3/hooks/features/useEditing.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"useEditing.js","sources":["../../../../../../../../../src/components/Table3/hooks/features/useEditing.tsx"],"sourcesContent":["import React from 'react';\nimport _ from 'lodash';\nimport { Cell as RTCell } from '@tanstack/react-table';\n\nimport { Table3SaveHandler } from '../../types';\nimport { IndicatorReason } from '../../components/columns/cell/Indicator';\nimport { shouldTriggerShortcut } from '../../../../utils/keyboard';\nimport { Table3Validation } from './useValidation';\nimport { lastCellIndex } from '../../components/rows/Row';\n\nexport enum SavingStatusValue {\n Saving = 'saving',\n Saved = 'saved',\n Error = 'error',\n}\n\nexport function useEditing<TType = unknown>(\n isEnabled: boolean,\n validation: Table3Validation<TType>,\n onSave?: Table3SaveHandler<TType>\n) {\n // used to switch the table into editing mode\n const [isEditing, setIsEditing] = React.useState(false);\n // Saving indicator need to show saving status per row, saving status can have at least two states 'saving', 'saved',\n // 'saved' should remain for a few seconds to show tick icon after row has been saved.\n const [savingStatuses, dispatchSavingStatusAction] = React.useReducer(savingStatusesReducer, null);\n\n // sets of row changes pending save, either they have not saved yet or they have errors\n const [editingState, dispatchEditingAction] = React.useReducer((state: EditingState<TType>, action) => editingReducer<TType>(state, action), null);\n\n const [detailModeEditing, setDetailModeEditing] = React.useState(false);\n\n function getCellValue<T extends TType>(cell: RTCell<T, unknown>) {\n return editingState ? editingState[cell.row.id]?.[cell.column.id] : undefined;\n }\n\n // Saves editing cell value into editing state.\n function setCellValue<T extends TType>(cell: RTCell<T, unknown>, value: unknown) {\n dispatchEditingAction({\n type: EditingActionType.SET_CELL_VALUE,\n payload: { rowId: cell.row.id, cellId: cell.column.id, value, originalValues: cell.row.original },\n });\n }\n\n // Removes changes from editing state by row id\n function resetChange(rowId: string) {\n dispatchEditingAction({\n type: EditingActionType.RESET_CHANGE,\n payload: { rowId },\n });\n validation.resetErrors(rowId);\n }\n\n const handleKeyDown = React.useCallback(\n (event: KeyboardEvent) => {\n if (event.defaultPrevented) {\n return;\n }\n\n if (shouldTriggerShortcut(event, { key: 'e', meta: true, shift: false })) {\n setIsEditing(editing => !editing);\n } else if (shouldTriggerShortcut(event, { key: 's', meta: true, shift: false })) {\n // Prevent default browser save\n event.preventDefault();\n saveChangesIfNeeded();\n }\n },\n [isEditing]\n );\n\n const handleBlur = React.useCallback((event: React.FocusEvent) => {\n if (event.target === event.currentTarget) {\n saveChangesIfNeeded();\n }\n }, []);\n\n // Creates initial saving statuses from changes object\n const addSavingStatuses = () => {\n const changeset = Object.keys(editingState \|\| {});\n const additionalSavingStatuses = _.reduce(\n changeset,\n (result, rowId) => {\n return { ...result, [rowId]: SavingStatusValue.Saving };\n },\n {}\n );\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUSES,\n payload: { states: additionalSavingStatuses },\n });\n };\n\n // Resets/removes saving status by row id. Used in delayed saving indicator.\n const resetSavingStatus = (rowId: string) => {\n dispatchSavingStatusAction({\n type: SavingStatusActionType.RESET_SAVING_STATUS,\n payload: { rowId },\n });\n };\n\n // Checks if we have changes, then saves them\n const saveChangesIfNeeded = async () => {\n if (!editingState) {\n return;\n }\n\n const changeset = Object.keys(editingState);\n if (onSave && changeset.length) {\n addSavingStatuses();\n\n const responses = await Promise.allSettled(\n changeset.map(rowId => {\n const validationSavePromise = new Promise<void>((resolve, reject) => {\n const changedRow = editingState?.[rowId];\n if (changedRow) {\n validation\n .validate(rowId, changedRow)\n ?.then(() => {\n const savePromise = onSave(changedRow);\n savePromise\n .then(() => {\n resolve();\n })\n .catch(reason => {\n if (reason.errors) {\n validation.setRowErrors(rowId, reason.errors);\n }\n\n reject(reason);\n });\n })\n .catch(() => {\n validation.confirmErrors(rowId);\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Error },\n });\n reject();\n });\n } else {\n reject();\n }\n });\n return validationSavePromise;\n })\n );\n\n responses.forEach((response, index) => {\n const rowId = changeset[index];\n\n if (response.status === 'fulfilled') {\n resetChange(rowId);\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Saved },\n });\n } else {\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Error },\n });\n }\n });\n }\n };\n\n const [rowMoveReason, setRowMoveReason] = React.useState<Record<string, IndicatorReason \| null> \| null>(null);\n\n const removeRowMoveReason = () => {\n setRowMoveReason(null);\n };\n\n const showWarning = React.useCallback(\n event => {\n if (isEditing && editingState && Object.keys(editingState).length > 0) {\n event.returnValue = true;\n return true;\n }\n\n return false;\n },\n [isEditing, editingState]\n );\n\n function getSavingStatus(rowId: string) {\n return savingStatuses && savingStatuses[rowId];\n }\n\n React.useEffect(() => {\n window.addEventListener('beforeunload', showWarning);\n\n return () => {\n window.removeEventListener('beforeunload', showWarning);\n };\n }, [showWarning]);\n\n React.useEffect(() => {\n if (!isEditing) {\n setDetailModeEditing(false);\n lastCellIndex.value = null;\n }\n }, [isEditing]);\n\n return {\n isEnabled,\n isEditing,\n toggleEditing: setIsEditing,\n changes: editingState,\n getCellValue,\n setCellValue,\n saveChangesIfNeeded,\n detailModeEditing,\n setDetailModeEditing,\n rowMoveReason,\n setRowMoveReason,\n removeRowMoveReason,\n handleKeyDown,\n handleBlur,\n resetChange,\n getSavingStatus,\n resetSavingStatus,\n };\n}\n\nenum EditingActionType {\n SET_CELL_VALUE,\n RESET_CHANGE,\n}\n\ntype EditingState<TType = unknown> = Record<string, TType> \| null;\n\ntype EditingAction =\n \| { type: EditingActionType.SET_CELL_VALUE; payload: { rowId: string; cellId: string; value: unknown; originalValues } }\n \| {\n type: EditingActionType.RESET_CHANGE;\n payload: { rowId: string };\n };\n\nfunction editingReducer<TType = unknown>(state: EditingState<TType>, action: EditingAction): EditingState<TType> {\n switch (action.type) {\n // Set cell value of the row\n case EditingActionType.SET_CELL_VALUE:\n return {\n ...state,\n [action.payload.rowId]: {\n ...(state?.[action.payload.rowId] \|\| action.payload.originalValues),\n [action.payload.cellId]: action.payload.value,\n },\n };\n\n // Reset changes for the row\n case EditingActionType.RESET_CHANGE: {\n let currentChanges: Record<string, TType> \| null = { ...state };\n if (currentChanges) {\n delete currentChanges[action.payload.rowId];\n }\n const changeset = Object.keys(currentChanges);\n if (changeset.length === 0) {\n currentChanges = null;\n }\n return currentChanges;\n }\n\n default:\n return state;\n }\n}\n\nenum SavingStatusActionType {\n SET_SAVING_STATUS,\n SET_SAVING_STATUSES,\n RESET_SAVING_STATUS,\n}\n\ntype SavingStatus = Record<string, SavingStatusValue> \| null;\n\ntype SavingStatusAction =\n \| { type: SavingStatusActionType.SET_SAVING_STATUS; payload: { rowId: string; state: SavingStatusValue } }\n \| { type: SavingStatusActionType.SET_SAVING_STATUSES; payload: { states: Record<string, SavingStatusValue> } }\n \| { type: SavingStatusActionType.RESET_SAVING_STATUS; payload: { rowId: string } };\n\nfunction savingStatusesReducer(state: SavingStatus, action: SavingStatusAction): SavingStatus {\n switch (action.type) {\n // Set single saving status for the row\n case SavingStatusActionType.SET_SAVING_STATUS:\n return {\n ...state,\n [action.payload.rowId]: action.payload.state,\n };\n // Set multiple saving statuses for multiple rows at the same time\n case SavingStatusActionType.SET_SAVING_STATUSES:\n return {\n ...state,\n ...action.payload.states,\n };\n // Reset/remove saving status for particular row\n case SavingStatusActionType.RESET_SAVING_STATUS: {\n const newSavingStatus = { ...state };\n delete newSavingStatus?.[action.payload.rowId];\n return newSavingStatus;\n }\n\n default:\n return state;\n }\n}\n"],"names":["SavingStatusValue","useEditing","isEnabled","validation","onSave","isEditing","setIsEditing","React","useState","savingStatuses","dispatchSavingStatusAction","useReducer","savingStatusesReducer","editingState","dispatchEditingAction","state","action","editingReducer","detailModeEditing","setDetailModeEditing","getCellValue","cell","_editingState$cell$ro","row","id","column","undefined","setCellValue","value","type","EditingActionType","SET_CELL_VALUE","payload","rowId","cellId","originalValues","original","resetChange","RESET_CHANGE","resetErrors","handleKeyDown","useCallback","event","defaultPrevented","shouldTriggerShortcut","key","meta","shift","editing","preventDefault","saveChangesIfNeeded","handleBlur","target","currentTarget","addSavingStatuses","changeset","Object","keys","additionalSavingStatuses","_","reduce","result","Saving","SavingStatusActionType","SET_SAVING_STATUSES","states","resetSavingStatus","RESET_SAVING_STATUS","Promise","resolve","_temp","length","allSettled","map","validationSavePromise","reject","changedRow","_validation$validate","validate","then","savePromise","catch","reason","errors","setRowErrors","confirmErrors","SET_SAVING_STATUS","Error","responses","forEach","response","index","status","Saved","e","rowMoveReason","setRowMoveReason","removeRowMoveReason","showWarning","returnValue","getSavingStatus","useEffect","window","addEventListener","removeEventListener","lastCellIndex","toggleEditing","changes","currentChanges","newSavingStatus"],"mappings":"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"}
1	+ {"version":3,"file":"useEditing.js","sources":["../../../../../../../../../src/components/Table3/hooks/features/useEditing.tsx"],"sourcesContent":["import React from 'react';\nimport _ from 'lodash';\nimport { Cell as RTCell } from '@tanstack/react-table';\n\nimport { Table3Ref, Table3SaveHandler } from '../../types';\nimport { IndicatorReason } from '../../components/columns/cell/Indicator';\nimport { shouldTriggerShortcut } from '../../../../utils/keyboard';\nimport { Table3Validation } from './useValidation';\nimport { lastCellIndex } from '../../components/rows/Row';\nimport { isElementInsideOrTriggeredFromContainer } from '../../../../utils/dom';\n\nexport enum SavingStatusValue {\n Saving = 'saving',\n Saved = 'saved',\n Error = 'error',\n}\n\nexport function useEditing<TType = unknown>(\n isEnabled: boolean,\n tableRef: React.RefObject<Table3Ref>,\n validation: Table3Validation<TType>,\n onSave?: Table3SaveHandler<TType>\n) {\n // used to switch the table into editing mode\n const [isEditing, setIsEditing] = React.useState(false);\n // Saving indicator need to show saving status per row, saving status can have at least two states 'saving', 'saved',\n // 'saved' should remain for a few seconds to show tick icon after row has been saved.\n const [savingStatuses, dispatchSavingStatusAction] = React.useReducer(savingStatusesReducer, null);\n\n // sets of row changes pending save, either they have not saved yet or they have errors\n const [editingState, dispatchEditingAction] = React.useReducer(\n (state: EditingState<TType>, action) => editingReducer<TType>(state, action),\n null\n );\n\n const [detailModeEditing, setDetailModeEditing] = React.useState(false);\n\n function getCellValue<T extends TType>(cell: RTCell<T, unknown>) {\n return editingState ? editingState[cell.row.id]?.[cell.column.id] : undefined;\n }\n\n // Saves editing cell value into editing state.\n function setCellValue<T extends TType>(cell: RTCell<T, unknown>, value: unknown) {\n dispatchEditingAction({\n type: EditingActionType.SET_CELL_VALUE,\n payload: { rowId: cell.row.id, cellId: cell.column.id, value, originalValues: cell.row.original },\n });\n }\n\n // Removes changes from editing state by row id\n function resetChange(rowId: string) {\n dispatchEditingAction({\n type: EditingActionType.RESET_CHANGE,\n payload: { rowId },\n });\n validation.resetErrors(rowId);\n }\n\n const handleKeyDown = React.useCallback(\n (event: KeyboardEvent) => {\n if (event.defaultPrevented) {\n return;\n }\n\n if (shouldTriggerShortcut(event, { key: 'e', meta: true, shift: false })) {\n setIsEditing(editing => !editing);\n } else if (shouldTriggerShortcut(event, { key: 's', meta: true, shift: false })) {\n // Prevent default browser save\n event.preventDefault();\n saveChangesIfNeeded();\n }\n },\n [isEditing]\n );\n\n const handleBlur = React.useCallback((event: React.FocusEvent) => {\n if (event.target === event.currentTarget) {\n saveChangesIfNeeded();\n }\n }, []);\n\n // Creates initial saving statuses from changes object\n const addSavingStatuses = () => {\n const changeset = Object.keys(editingState \|\| {});\n const additionalSavingStatuses = _.reduce(\n changeset,\n (result, rowId) => {\n return { ...result, [rowId]: SavingStatusValue.Saving };\n },\n {}\n );\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUSES,\n payload: { states: additionalSavingStatuses },\n });\n };\n\n // Resets/removes saving status by row id. Used in delayed saving indicator.\n const resetSavingStatus = (rowId: string) => {\n dispatchSavingStatusAction({\n type: SavingStatusActionType.RESET_SAVING_STATUS,\n payload: { rowId },\n });\n };\n\n // Checks if we have changes, then saves them\n const saveChangesIfNeeded = async () => {\n if (!editingState) {\n return;\n }\n\n const changeset = Object.keys(editingState);\n if (onSave && changeset.length) {\n addSavingStatuses();\n\n const responses = await Promise.allSettled(\n changeset.map(rowId => {\n const validationSavePromise = new Promise<void>((resolve, reject) => {\n const changedRow = editingState?.[rowId];\n if (changedRow) {\n validation\n .validate(rowId, changedRow)\n ?.then(() => {\n const savePromise = onSave(changedRow);\n savePromise\n .then(() => {\n resolve();\n })\n .catch(reason => {\n if (reason.errors) {\n validation.setRowErrors(rowId, reason.errors);\n }\n\n reject(reason);\n });\n })\n .catch(() => {\n validation.confirmErrors(rowId);\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Error },\n });\n reject();\n });\n } else {\n reject();\n }\n });\n return validationSavePromise;\n })\n );\n\n responses.forEach((response, index) => {\n const rowId = changeset[index];\n\n if (response.status === 'fulfilled') {\n resetChange(rowId);\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Saved },\n });\n } else {\n dispatchSavingStatusAction({\n type: SavingStatusActionType.SET_SAVING_STATUS,\n payload: { rowId, state: SavingStatusValue.Error },\n });\n }\n });\n }\n };\n\n const [rowMoveReason, setRowMoveReason] = React.useState<Record<string, IndicatorReason \| null> \| null>(null);\n\n const removeRowMoveReason = () => {\n setRowMoveReason(null);\n };\n\n const showWarning = React.useCallback(\n event => {\n if (isEditing && editingState && Object.keys(editingState).length > 0) {\n event.returnValue = true;\n return true;\n }\n\n return false;\n },\n [isEditing, editingState]\n );\n\n React.useEffect(() => {\n const handleClickOutside = (event: MouseEvent) => {\n const target = event.target as HTMLElement;\n const closestPopup = target.closest('[role=\"dialog\"], [role=\"menu\"]');\n\n // Need to check that neither target itself nor closest popup is inside or triggetred from the table.\n if (\n !isElementInsideOrTriggeredFromContainer(target, tableRef.current) &&\n !isElementInsideOrTriggeredFromContainer(closestPopup, tableRef.current)\n ) {\n saveChangesIfNeeded();\n }\n };\n\n document.addEventListener('click', handleClickOutside);\n\n return () => {\n document.removeEventListener('click', handleClickOutside);\n };\n }, [saveChangesIfNeeded]);\n\n function getSavingStatus(rowId: string) {\n return savingStatuses && savingStatuses[rowId];\n }\n\n React.useEffect(() => {\n window.addEventListener('beforeunload', showWarning);\n\n return () => {\n window.removeEventListener('beforeunload', showWarning);\n };\n }, [showWarning]);\n\n React.useEffect(() => {\n if (!isEditing) {\n setDetailModeEditing(false);\n lastCellIndex.value = null;\n }\n }, [isEditing]);\n\n return {\n isEnabled,\n isEditing,\n toggleEditing: setIsEditing,\n changes: editingState,\n getCellValue,\n setCellValue,\n saveChangesIfNeeded,\n detailModeEditing,\n setDetailModeEditing,\n rowMoveReason,\n setRowMoveReason,\n removeRowMoveReason,\n handleKeyDown,\n handleBlur,\n resetChange,\n getSavingStatus,\n resetSavingStatus,\n };\n}\n\nenum EditingActionType {\n SET_CELL_VALUE,\n RESET_CHANGE,\n}\n\ntype EditingState<TType = unknown> = Record<string, TType> \| null;\n\ntype EditingAction =\n \| { type: EditingActionType.SET_CELL_VALUE; payload: { rowId: string; cellId: string; value: unknown; originalValues } }\n \| {\n type: EditingActionType.RESET_CHANGE;\n payload: { rowId: string };\n };\n\nfunction editingReducer<TType = unknown>(state: EditingState<TType>, action: EditingAction): EditingState<TType> {\n switch (action.type) {\n // Set cell value of the row\n case EditingActionType.SET_CELL_VALUE:\n return {\n ...state,\n [action.payload.rowId]: {\n ...(state?.[action.payload.rowId] \|\| action.payload.originalValues),\n [action.payload.cellId]: action.payload.value,\n },\n };\n\n // Reset changes for the row\n case EditingActionType.RESET_CHANGE: {\n let currentChanges: Record<string, TType> \| null = { ...state };\n if (currentChanges) {\n delete currentChanges[action.payload.rowId];\n }\n const changeset = Object.keys(currentChanges);\n if (changeset.length === 0) {\n currentChanges = null;\n }\n return currentChanges;\n }\n\n default:\n return state;\n }\n}\n\nenum SavingStatusActionType {\n SET_SAVING_STATUS,\n SET_SAVING_STATUSES,\n RESET_SAVING_STATUS,\n}\n\ntype SavingStatus = Record<string, SavingStatusValue> \| null;\n\ntype SavingStatusAction =\n \| { type: SavingStatusActionType.SET_SAVING_STATUS; payload: { rowId: string; state: SavingStatusValue } }\n \| { type: SavingStatusActionType.SET_SAVING_STATUSES; payload: { states: Record<string, SavingStatusValue> } }\n \| { type: SavingStatusActionType.RESET_SAVING_STATUS; payload: { rowId: string } };\n\nfunction savingStatusesReducer(state: SavingStatus, action: SavingStatusAction): SavingStatus {\n switch (action.type) {\n // Set single saving status for the row\n case SavingStatusActionType.SET_SAVING_STATUS:\n return {\n ...state,\n [action.payload.rowId]: action.payload.state,\n };\n // Set multiple saving statuses for multiple rows at the same time\n case SavingStatusActionType.SET_SAVING_STATUSES:\n return {\n ...state,\n ...action.payload.states,\n };\n // Reset/remove saving status for particular row\n case SavingStatusActionType.RESET_SAVING_STATUS: {\n const newSavingStatus = { ...state };\n delete newSavingStatus?.[action.payload.rowId];\n return newSavingStatus;\n }\n\n default:\n return state;\n }\n}\n"],"names":["SavingStatusValue","useEditing","isEnabled","tableRef","validation","onSave","isEditing","setIsEditing","React","useState","savingStatuses","dispatchSavingStatusAction","useReducer","savingStatusesReducer","editingState","dispatchEditingAction","state","action","editingReducer","detailModeEditing","setDetailModeEditing","getCellValue","cell","_editingState$cell$ro","row","id","column","undefined","setCellValue","value","type","EditingActionType","SET_CELL_VALUE","payload","rowId","cellId","originalValues","original","resetChange","RESET_CHANGE","resetErrors","handleKeyDown","useCallback","event","defaultPrevented","shouldTriggerShortcut","key","meta","shift","editing","preventDefault","saveChangesIfNeeded","handleBlur","target","currentTarget","addSavingStatuses","changeset","Object","keys","additionalSavingStatuses","_","reduce","result","Saving","SavingStatusActionType","SET_SAVING_STATUSES","states","resetSavingStatus","RESET_SAVING_STATUS","Promise","resolve","_temp","length","allSettled","map","validationSavePromise","reject","changedRow","_validation$validate","validate","then","savePromise","catch","reason","errors","setRowErrors","confirmErrors","SET_SAVING_STATUS","Error","responses","forEach","response","index","status","Saved","e","rowMoveReason","setRowMoveReason","removeRowMoveReason","showWarning","returnValue","useEffect","handleClickOutside","closestPopup","closest","isElementInsideOrTriggeredFromContainer","current","document","addEventListener","removeEventListener","getSavingStatus","window","lastCellIndex","toggleEditing","changes","currentChanges","newSavingStatus"],"mappings":";;;;;;IAWYA;AAAZ,WAAYA,iBAAiB;EACzBA,sCAAiB;EACjBA,oCAAe;EACfA,oCAAe;AACnB,CAAC,EAJWA,iBAAiB,KAAjBA,iBAAiB;SAMbC,UAAUA,CACtBC,SAAkB,EAClBC,QAAoC,EACpCC,UAAmC,EACnCC,MAAiC;;EAGjC,MAAM,CAACC,SAAS,EAAEC,YAAY,CAAC,GAAGC,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;;;EAGvD,MAAM,CAACC,cAAc,EAAEC,0BAA0B,CAAC,GAAGH,cAAK,CAACI,UAAU,CAACC,qBAAqB,EAAE,IAAI,CAAC;;EAGlG,MAAM,CAACC,YAAY,EAAEC,qBAAqB,CAAC,GAAGP,cAAK,CAACI,UAAU,CAC1D,CAACI,KAA0B,EAAEC,MAAM,KAAKC,cAAc,CAAQF,KAAK,EAAEC,MAAM,CAAC,EAC5E,IAAI,CACP;EAED,MAAM,CAACE,iBAAiB,EAAEC,oBAAoB,CAAC,GAAGZ,cAAK,CAACC,QAAQ,CAAC,KAAK,CAAC;EAEvE,SAASY,YAAYA,CAAkBC,IAAwB;;IAC3D,OAAOR,YAAY,IAAAS,qBAAA,GAAGT,YAAY,CAACQ,IAAI,CAACE,GAAG,CAACC,EAAE,CAAC,cAAAF,qBAAA,uBAAzBA,qBAAA,CAA4BD,IAAI,CAACI,MAAM,CAACD,EAAE,CAAC,GAAGE,SAAS;;;EAIjF,SAASC,YAAYA,CAAkBN,IAAwB,EAAEO,KAAc;IAC3Ed,qBAAqB,CAAC;MAClBe,IAAI,EAAEC,iBAAiB,CAACC,cAAc;MACtCC,OAAO,EAAE;QAAEC,KAAK,EAAEZ,IAAI,CAACE,GAAG,CAACC,EAAE;QAAEU,MAAM,EAAEb,IAAI,CAACI,MAAM,CAACD,EAAE;QAAEI,KAAK;QAAEO,cAAc,EAAEd,IAAI,CAACE,GAAG,CAACa;;KAC1F,CAAC;;;EAIN,SAASC,WAAWA,CAACJ,KAAa;IAC9BnB,qBAAqB,CAAC;MAClBe,IAAI,EAAEC,iBAAiB,CAACQ,YAAY;MACpCN,OAAO,EAAE;QAAEC;;KACd,CAAC;IACF9B,UAAU,CAACoC,WAAW,CAACN,KAAK,CAAC;;EAGjC,MAAMO,aAAa,GAAGjC,cAAK,CAACkC,WAAW,CAClCC,KAAoB;IACjB,IAAIA,KAAK,CAACC,gBAAgB,EAAE;MACxB;;IAGJ,IAAIC,qBAAqB,CAACF,KAAK,EAAE;MAAEG,GAAG,EAAE,GAAG;MAAEC,IAAI,EAAE,IAAI;MAAEC,KAAK,EAAE;KAAO,CAAC,EAAE;MACtEzC,YAAY,CAAC0C,OAAO,IAAI,CAACA,OAAO,CAAC;KACpC,MAAM,IAAIJ,qBAAqB,CAACF,KAAK,EAAE;MAAEG,GAAG,EAAE,GAAG;MAAEC,IAAI,EAAE,IAAI;MAAEC,KAAK,EAAE;KAAO,CAAC,EAAE;;MAE7EL,KAAK,CAACO,cAAc,EAAE;MACtBC,mBAAmB,EAAE;;GAE5B,EACD,CAAC7C,SAAS,CAAC,CACd;EAED,MAAM8C,UAAU,GAAG5C,cAAK,CAACkC,WAAW,CAAEC,KAAuB;IACzD,IAAIA,KAAK,CAACU,MAAM,KAAKV,KAAK,CAACW,aAAa,EAAE;MACtCH,mBAAmB,EAAE;;GAE5B,EAAE,EAAE,CAAC;;EAGN,MAAMI,iBAAiB,GAAGA;IACtB,MAAMC,SAAS,GAAGC,MAAM,CAACC,IAAI,CAAC5C,YAAY,IAAI,EAAE,CAAC;IACjD,MAAM6C,wBAAwB,GAAGC,CAAC,CAACC,MAAM,CACrCL,SAAS,EACT,CAACM,MAAM,EAAE5B,KAAK;MACV,OAAO;QAAE,GAAG4B,MAAM;QAAE,CAAC5B,KAAK,GAAGlC,iBAAiB,CAAC+D;OAAQ;KAC1D,EACD,EAAE,CACL;IACDpD,0BAA0B,CAAC;MACvBmB,IAAI,EAAEkC,sBAAsB,CAACC,mBAAmB;MAChDhC,OAAO,EAAE;QAAEiC,MAAM,EAAEP;;KACtB,CAAC;GACL;;EAGD,MAAMQ,iBAAiB,GAAIjC,KAAa;IACpCvB,0BAA0B,CAAC;MACvBmB,IAAI,EAAEkC,sBAAsB,CAACI,mBAAmB;MAChDnC,OAAO,EAAE;QAAEC;;KACd,CAAC;GACL;;EAGD,MAAMiB,mBAAmB;IAAA;MACrB,IAAI,CAACrC,YAAY,EAAE;QACf,OAAAuD,OAAA,CAAAC,OAAA;;MAGJ,MAAMd,SAAS,GAAGC,MAAM,CAACC,IAAI,CAAC5C,YAAY,CAAC;MAAC,MAAAyD,KAAA;QAAA,IACxClE,MAAM,IAAImD,SAAS,CAACgB,MAAM;UAC1BjB,iBAAiB,EAAE;UAAC,OAAAc,OAAA,CAAAC,OAAA,CAEID,OAAO,CAACI,UAAU,CACtCjB,SAAS,CAACkB,GAAG,CAACxC,KAAK;YACf,MAAMyC,qBAAqB,GAAG,IAAIN,OAAO,CAAO,CAACC,OAAO,EAAEM,MAAM;cAC5D,MAAMC,UAAU,GAAG/D,YAAY,aAAZA,YAAY,uBAAZA,YAAY,CAAGoB,KAAK,CAAC;cACxC,IAAI2C,UAAU,EAAE;gBAAA,IAAAC,oBAAA;gBACZ,CAAAA,oBAAA,GAAA1E,UAAU,CACL2E,QAAQ,CAAC7C,KAAK,EAAE2C,UAAU,CAAC,cAAAC,oBAAA,uBADhCA,oBAAA,CAEME,IAAI,CAAC;kBACH,MAAMC,WAAW,GAAG5E,MAAM,CAACwE,UAAU,CAAC;kBACtCI,WAAW,CACND,IAAI,CAAC;oBACFV,OAAO,EAAE;mBACZ,CAAC,CACDY,KAAK,CAACC,MAAM;oBACT,IAAIA,MAAM,CAACC,MAAM,EAAE;sBACfhF,UAAU,CAACiF,YAAY,CAACnD,KAAK,EAAEiD,MAAM,CAACC,MAAM,CAAC;;oBAGjDR,MAAM,CAACO,MAAM,CAAC;mBACjB,CAAC;iBACT,CAAC,CACDD,KAAK,CAAC;kBACH9E,UAAU,CAACkF,aAAa,CAACpD,KAAK,CAAC;kBAC/BvB,0BAA0B,CAAC;oBACvBmB,IAAI,EAAEkC,sBAAsB,CAACuB,iBAAiB;oBAC9CtD,OAAO,EAAE;sBAAEC,KAAK;sBAAElB,KAAK,EAAEhB,iBAAiB,CAACwF;;mBAC9C,CAAC;kBACFZ,MAAM,EAAE;iBACX,CAAC;eACT,MAAM;gBACHA,MAAM,EAAE;;aAEf,CAAC;YACF,OAAOD,qBAAqB;WAC/B,CAAC,CACL,EAAAK,IAAA,WAnCKS,SAAS;YAqCfA,SAAS,CAACC,OAAO,CAAC,CAACC,QAAQ,EAAEC,KAAK;cAC9B,MAAM1D,KAAK,GAAGsB,SAAS,CAACoC,KAAK,CAAC;cAE9B,IAAID,QAAQ,CAACE,MAAM,KAAK,WAAW,EAAE;gBACjCvD,WAAW,CAACJ,KAAK,CAAC;gBAClBvB,0BAA0B,CAAC;kBACvBmB,IAAI,EAAEkC,sBAAsB,CAACuB,iBAAiB;kBAC9CtD,OAAO,EAAE;oBAAEC,KAAK;oBAAElB,KAAK,EAAEhB,iBAAiB,CAAC8F;;iBAC9C,CAAC;eACL,MAAM;gBACHnF,0BAA0B,CAAC;kBACvBmB,IAAI,EAAEkC,sBAAsB,CAACuB,iBAAiB;kBAC9CtD,OAAO,EAAE;oBAAEC,KAAK;oBAAElB,KAAK,EAAEhB,iBAAiB,CAACwF;;iBAC9C,CAAC;;aAET,CAAC;;;;MAAC,OAAAnB,OAAA,CAAAC,OAAA,CAAAC,KAAA,IAAAA,KAAA,CAAAS,IAAA,GAAAT,KAAA,CAAAS,IAAA;KAEV,QAAAe,CAAA;MAAA,OAAA1B,OAAA,CAAAO,MAAA,CAAAmB,CAAA;;;EAED,MAAM,CAACC,aAAa,EAAEC,gBAAgB,CAAC,GAAGzF,cAAK,CAACC,QAAQ,CAAgD,IAAI,CAAC;EAE7G,MAAMyF,mBAAmB,GAAGA;IACxBD,gBAAgB,CAAC,IAAI,CAAC;GACzB;EAED,MAAME,WAAW,GAAG3F,cAAK,CAACkC,WAAW,CACjCC,KAAK;IACD,IAAIrC,SAAS,IAAIQ,YAAY,IAAI2C,MAAM,CAACC,IAAI,CAAC5C,YAAY,CAAC,CAAC0D,MAAM,GAAG,CAAC,EAAE;MACnE7B,KAAK,CAACyD,WAAW,GAAG,IAAI;MACxB,OAAO,IAAI;;IAGf,OAAO,KAAK;GACf,EACD,CAAC9F,SAAS,EAAEQ,YAAY,CAAC,CAC5B;EAEDN,cAAK,CAAC6F,SAAS,CAAC;IACZ,MAAMC,kBAAkB,GAAI3D,KAAiB;MACzC,MAAMU,MAAM,GAAGV,KAAK,CAACU,MAAqB;MAC1C,MAAMkD,YAAY,GAAGlD,MAAM,CAACmD,OAAO,CAAC,gCAAgC,CAAC;;MAGrE,IACI,CAACC,uCAAuC,CAACpD,MAAM,EAAElD,QAAQ,CAACuG,OAAO,CAAC,IAClE,CAACD,uCAAuC,CAACF,YAAY,EAAEpG,QAAQ,CAACuG,OAAO,CAAC,EAC1E;QACEvD,mBAAmB,EAAE;;KAE5B;IAEDwD,QAAQ,CAACC,gBAAgB,CAAC,OAAO,EAAEN,kBAAkB,CAAC;IAEtD,OAAO;MACHK,QAAQ,CAACE,mBAAmB,CAAC,OAAO,EAAEP,kBAAkB,CAAC;KAC5D;GACJ,EAAE,CAACnD,mBAAmB,CAAC,CAAC;EAEzB,SAAS2D,eAAeA,CAAC5E,KAAa;IAClC,OAAOxB,cAAc,IAAIA,cAAc,CAACwB,KAAK,CAAC;;EAGlD1B,cAAK,CAAC6F,SAAS,CAAC;IACZU,MAAM,CAACH,gBAAgB,CAAC,cAAc,EAAET,WAAW,CAAC;IAEpD,OAAO;MACHY,MAAM,CAACF,mBAAmB,CAAC,cAAc,EAAEV,WAAW,CAAC;KAC1D;GACJ,EAAE,CAACA,WAAW,CAAC,CAAC;EAEjB3F,cAAK,CAAC6F,SAAS,CAAC;IACZ,IAAI,CAAC/F,SAAS,EAAE;MACZc,oBAAoB,CAAC,KAAK,CAAC;MAC3B4F,aAAa,CAACnF,KAAK,GAAG,IAAI;;GAEjC,EAAE,CAACvB,SAAS,CAAC,CAAC;EAEf,OAAO;IACHJ,SAAS;IACTI,SAAS;IACT2G,aAAa,EAAE1G,YAAY;IAC3B2G,OAAO,EAAEpG,YAAY;IACrBO,YAAY;IACZO,YAAY;IACZuB,mBAAmB;IACnBhC,iBAAiB;IACjBC,oBAAoB;IACpB4E,aAAa;IACbC,gBAAgB;IAChBC,mBAAmB;IACnBzD,aAAa;IACbW,UAAU;IACVd,WAAW;IACXwE,eAAe;IACf3C;GACH;AACL;AAEA,IAAKpC,iBAGJ;AAHD,WAAKA,iBAAiB;EAClBA,6EAAc;EACdA,yEAAY;AAChB,CAAC,EAHIA,iBAAiB,KAAjBA,iBAAiB;AActB,SAASb,cAAcA,CAAkBF,KAA0B,EAAEC,MAAqB;EACtF,QAAQA,MAAM,CAACa,IAAI;;IAEf,KAAKC,iBAAiB,CAACC,cAAc;MACjC,OAAO;QACH,GAAGhB,KAAK;QACR,CAACC,MAAM,CAACgB,OAAO,CAACC,KAAK,GAAG;UACpB,IAAI,CAAAlB,KAAK,aAALA,KAAK,uBAALA,KAAK,CAAGC,MAAM,CAACgB,OAAO,CAACC,KAAK,CAAC,KAAIjB,MAAM,CAACgB,OAAO,CAACG,cAAc,CAAC;UACnE,CAACnB,MAAM,CAACgB,OAAO,CAACE,MAAM,GAAGlB,MAAM,CAACgB,OAAO,CAACJ;;OAE/C;;IAGL,KAAKE,iBAAiB,CAACQ,YAAY;MAAE;QACjC,IAAI4E,cAAc,GAAiC;UAAE,GAAGnG;SAAO;QAC/D,IAAImG,cAAc,EAAE;UAChB,OAAOA,cAAc,CAAClG,MAAM,CAACgB,OAAO,CAACC,KAAK,CAAC;;QAE/C,MAAMsB,SAAS,GAAGC,MAAM,CAACC,IAAI,CAACyD,cAAc,CAAC;QAC7C,IAAI3D,SAAS,CAACgB,MAAM,KAAK,CAAC,EAAE;UACxB2C,cAAc,GAAG,IAAI;;QAEzB,OAAOA,cAAc;;IAGzB;MACI,OAAOnG,KAAK;;AAExB;AAEA,IAAKgD,sBAIJ;AAJD,WAAKA,sBAAsB;EACvBA,6FAAiB;EACjBA,iGAAmB;EACnBA,iGAAmB;AACvB,CAAC,EAJIA,sBAAsB,KAAtBA,sBAAsB;AAa3B,SAASnD,qBAAqBA,CAACG,KAAmB,EAAEC,MAA0B;EAC1E,QAAQA,MAAM,CAACa,IAAI;;IAEf,KAAKkC,sBAAsB,CAACuB,iBAAiB;MACzC,OAAO;QACH,GAAGvE,KAAK;QACR,CAACC,MAAM,CAACgB,OAAO,CAACC,KAAK,GAAGjB,MAAM,CAACgB,OAAO,CAACjB;OAC1C;;IAEL,KAAKgD,sBAAsB,CAACC,mBAAmB;MAC3C,OAAO;QACH,GAAGjD,KAAK;QACR,GAAGC,MAAM,CAACgB,OAAO,CAACiC;OACrB;;IAEL,KAAKF,sBAAsB,CAACI,mBAAmB;MAAE;QAC7C,MAAMgD,eAAe,GAAG;UAAE,GAAGpG;SAAO;QAC7BoG,eAAe,aAAfA,eAAe,qBAAtB,OAAOA,eAAe,CAAGnG,MAAM,CAACgB,OAAO,CAACC,KAAK,CAAC;QAC9C,OAAOkF,eAAe;;IAG1B;MACI,OAAOpG,KAAK;;AAExB;;;;"}

package/dist/esm/packages/taco/src/components/Table3/hooks/useTable.js CHANGED Viewed

@@ -48,7 +48,7 @@ function useTable(props, ref) {
   // can't change due to rename to "active row"
   const validation = useValidation(props.onCellValidate, props.onRowValidate);
   // not relevant to common table
-  const editing = useEditing(options.enableEditing, validation, props.onSave);
+  const editing = useEditing(options.enableEditing, ref, validation, props.onSave);
   // we changed how printing works, so this shouldn't be migrated
   const printing = usePrinting(options.enablePrinting, settings.showWarningWhenPrintingLargeDataset, props.id);
   // needs to be moved