@economic/taco 2.20.2 → 2.21.0

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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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

@@ -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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"}
+{"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

@@ -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

@@ -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":";;;;;;AAYA;AACA;AACA,MAAMA,OAAO,GAAqC;EAC9CC,KAAK,EAAE;IACHC,GAAG,EAAE,EAAE;IACPC,GAAG,EAAE;GACR;EACDC,MAAM,EAAE;IACJF,GAAG,EAAE,EAAE;IACPC,GAAG,EAAE;GACR;EACDE,KAAK,EAAE;IACHH,GAAG,EAAE,EAAE;IACPC,GAAG,EAAE;;CAEZ;MASYG,eAAe,gBAAGC,cAAK,CAACC,UAAU,CAAmB,SAASF,eAAeA,CACtFG,KAAkC,EAClCC,WAAmC;EAEnC,MAAM;IACFC,SAAS,EAAEC,aAAa;IACxBC,QAAQ,EAAEC,YAAY;IACtBC,MAAM;IACNC,MAAM;IACNC,kBAAkB;IAClBC,KAAK;IACLC,WAAW;IACXC,KAAK;IACLC,QAAQ;IACR,GAAGC;GACN,GAAGb,KAAK;EAET,MAAMc,YAAY,GAAGvB,OAAO,CAACqB,QAAQ,CAAC;EAEtC,MAAMG,UAAU,GAAGR,MAAM,CAACS,SAAS,CAACC,IAAI;EAExC,MAAMC,GAAG,GAAGC,YAAY,CAAsBlB,WAAW,CAAC;EAE1DH,cAAK,CAACsB,SAAS,CAAC;IACZ,IAAIF,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEG,OAAO,EAAE;;MAEd,IAAIN,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEO,cAAc,EAAE;QAC5B,MAAMC,eAAe,GAAGL,GAAG,aAAHA,GAAG,uBAAHA,GAAG,CAAEG,OAA8B;QAC3DE,eAAe,CAACC,KAAK,CAACC,MAAM,MAAMX,YAAY,CAACrB,OAAO;;OAGzD,MAAM;QACH,MAAM8B,eAAe,GAAGL,GAAG,aAAHA,GAAG,uBAAHA,GAAG,CAAEG,OAA8B;QAC3DK,cAAc,CAACH,eAAe,CAAC;;;GAG1C,EAAE,CAACX,QAAQ,CAAC,CAAC;EAEdd,cAAK,CAACsB,SAAS,CAAC;;;IAGZ,IAAIF,GAAG,aAAHA,GAAG,eAAHA,GAAG,CAAEG,OAAO,IAAIN,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEO,cAAc,EAAE;MAC5C,MAAMC,eAAe,GAAGL,GAAG,aAAHA,GAAG,uBAAHA,GAAG,CAAEG,OAA8B;MAE3D,IAAIb,kBAAkB,EAAE;QACpBkB,cAAc,CAACH,eAAe,CAAC;OAClC,MAAM;QACHA,eAAe,CAACC,KAAK,CAACC,MAAM,MAAMX,YAAY,CAACrB,OAAO;;;GAGjE,EAAE,CAACe,kBAAkB,CAAC,CAAC;EAExB,MAAMkB,cAAc,GAAIH,eAAoC;;;IAGxD,MAAMI,YAAY,GAAGJ,eAAe,CAACK,qBAAqB,EAAE;IAC5D,MAAMC,UAAU,GAAGF,YAAY,CAACF,MAAM;IACtC,IAAIV,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEO,cAAc,EAAE;MAC5B,IAAIO,UAAU,GAAGf,YAAY,CAACpB,GAAG,EAAE;QAC/B6B,eAAe,CAACC,KAAK,CAACC,MAAM,GAAG,SAAS;QACxCF,eAAe,CAACC,KAAK,CAACC,MAAM,MAAMK,IAAI,CAACrC,GAAG,CAAC8B,eAAe,CAACQ,YAAY,EAAEjB,YAAY,CAACpB,GAAG,KAAK;;KAErG,MAAM;MACH6B,eAAe,CAACC,KAAK,CAACC,MAAM,GAAG,SAAS;MACxCF,eAAe,CAACC,KAAK,CAACC,MAAM,MAAMF,eAAe,CAACQ,gBAAgB;;GAEzE;EAED,MAAMC,oBAAoB,GAAGC,CAAC;IAC1BP,cAAc,CAACO,CAAC,CAACC,MAAM,CAAC;GAC3B;EAED,MAAMC,0BAA0B,GAAGC,EAAE,CAAC,QAAQ,EAAE;IAC5C,iFAAiF,EAAErB,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEO;GAClG,CAAC;EACF,MAAMe,qBAAqB,GAAIC,KAA+C;;IAE1E,IAAIA,KAAK,CAACC,QAAQ,IAAID,KAAK,CAACE,GAAG,KAAK,OAAO,EAAE;MACzC;KACH,MAAM;MACHrC,aAAa,CAACmC,KAAK,CAAC;;GAE3B;EAED,MAAMG,UAAU,GAAGH,KAAK;;IAEpB,IAAIvB,UAAU,aAAVA,UAAU,eAAVA,UAAU,CAAEO,cAAc,EAAE;MAC5B,MAAMC,eAAe,GAAGe,KAAK,CAACI,aAAa;MAC3CnB,eAAe,CAACC,KAAK,CAACC,MAAM,MAAMX,YAAY,CAACrB,OAAO;;IAE1Da,MAAM,CAACgC,KAAK,CAAC;GAChB;EAED,oBACIxC;iBAAe;kBAOXA;IAAK0B,KAAK,EAAE;MAAEmB,SAAS,KAAK7B,YAAY,CAACrB;KAAS;IAAEmD,SAAS,EAAC;kBAC1D9C;IAAK8C,SAAS,EAAET;kBACZrC,6BAAC+C,QAAQ,oBACDhC,UAAU;IACdT,QAAQ,EAAEkC,KAAK;MACXjC,YAAY,CAACiC,KAAK,CAACJ,MAAM,CAACvB,KAAK,CAAC;MAChCqB,oBAAoB,CAACM,KAAK,CAAC;KAC9B;IACDQ,IAAI,EAAE,CAAC;IACP5C,SAAS,EAAE+B,CAAC;MACRI,qBAAqB,CAACJ,CAAC,CAAC;KAC3B;IACD3B,MAAM,EAAEmC,UAAU;IAClBG,SAAS,EAAER,EAAE,CAACW,uBAAuB,CAACtC,KAAK,CAAC,uDAAuD,EAAE;MACjG,YAAYK,YAAY,CAACrB,QAAQ,GAAGsB,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEO,cAAc;MAC9D,gBAAgB,EAAEd,kBAAkB;MACpC,OAAOM,YAAY,CAACrB,QAAQ,GAAG,CAACe,kBAAkB,KAAIO,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEO,cAAc;;MAEhF,gBAAgB,EAAEZ,WAAW,KAAIK,UAAU,aAAVA,UAAU,uBAAVA,UAAU,CAAEO,cAAc;KAC9D,CAAC;IACFJ,GAAG,EAAEA,GAAG;IACRP,KAAK,EAAEqC,MAAM,CAACrC,KAAK,aAALA,KAAK,cAALA,KAAK,GAAI,EAAE;KAC3B,CACA,CACJ,CACJ;AAEd,CAAC;;;;"}
+{"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

@@ -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

@@ -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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"}
+{"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":"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"}

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

@@ -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