@economic/taco 2.9.1 → 2.10.0

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, HeaderContext, TableMeta } from '@tanstack/react-table';\nimport { Menu, isMenuAvailable, isGotoAvailable } from './Menu';\nimport { Resizer } from './Resizer';\nimport { Table3ColumnAlignment, Table3SortDirection, TableStrategy } from '../../../types';\nimport { getSortAttributes, SortIndicator } from './SortIndicator';\nimport { isFrozenColumn, isInternalColumn } from '../../../util/columns';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport type HeaderProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, scrollToIndex, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const canSort = column.getCanSort();\n\n    // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n    const handleResize = React.useMemo(() => header.getResizeHandler(), []);\n    const handleSort = React.useMemo(() => header.column.getToggleSortingHandler(), []);\n    const handleHide = React.useMemo(() => header.column.getToggleVisibilityHandler(), []);\n    const hasGoto = isGotoAvailable(table, header);\n\n    const sorting = table.getState().sorting;\n    const filters = table.getState().columnFilters;\n    const search = table.getState().globalFilter;\n\n    const handleGoto = React.useMemo(() => {\n        if (hasGoto) {\n            return ((query: string) => tableMeta.rowGoto.handleGoto(header.id, query, sorting, filters, search)) as (\n                query: string\n            ) => Promise<number>;\n        }\n\n        return undefined;\n    }, [hasGoto, JSON.stringify(sorting), JSON.stringify(filters), search]);\n\n    const memoedProps = {\n        align: columnMeta.align,\n        canFreeze: tableMeta.columnFreezing.isEnabled,\n        canHide: column.getCanHide(),\n        canResize: column.getCanResize(),\n        canSort,\n        children: children ?? columnMeta.header,\n        hasMenu: isMenuAvailable<TType>(table, header),\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        isResizing: column.getIsResizing(),\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort as (event: unknown) => void,\n        scrollToIndex,\n        sortDirection: column.getIsSorted(),\n        table,\n    };\n\n    return <MemoedHeader<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedHeaderProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header'> & {\n    align?: Table3ColumnAlignment;\n    canFreeze: boolean;\n    canHide: boolean;\n    canResize: boolean;\n    canSort: boolean;\n    hasMenu: boolean;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    isResizing: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    onResize: (event: unknown) => void;\n    onSort: (event: unknown) => void;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    sortDirection: false | Table3SortDirection;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader<TType = unknown>(props: MemoedHeaderProps<TType>) {\n    const {\n        align,\n        children,\n        canFreeze,\n        canHide,\n        canResize,\n        canSort,\n        hasMenu,\n        id,\n        index,\n        isFrozen,\n        isResizing,\n        length,\n        meta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort,\n        scrollToIndex,\n        sortDirection,\n        table,\n    } = props;\n\n    const className = cn(\n        'sticky top-0 border-b-2 font-bold h-10 box-content items-center group/column relative',\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        {\n            'cursor-pointer select-none': canSort,\n            'hover:bg-grey-100': canSort || canResize || hasMenu,\n            '!pointer-events-all !bg-grey-100': isResizing,\n            // z-indexes\n            'z-10 hover:z-20': !isFrozen && !isResizing,\n            'z-20': !isFrozen && isResizing,\n            '!z-30': isFrozen,\n            '!z-40': isFrozen && isResizing,\n        },\n        meta.headerClassName\n    );\n\n    const [internalRef, setInternalRef] = React.useState<HTMLDivElement | null>(null);\n\n    React.useLayoutEffect(() => {\n        if (internalRef && length) {\n            // the actions column size gets set by the column itself\n            if (isInternalColumn(id)) {\n                return;\n            }\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [id]: internalRef.getBoundingClientRect().width,\n            }));\n        }\n    }, [internalRef, length]);\n\n    if (table.options.debugAll) {\n        console.log('header render', id);\n    }\n\n    return (\n        <div\n            {...(canSort ? getSortAttributes(handleSort, sortDirection) : undefined)}\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            role=\"columnheader\"\n            ref={setInternalRef}>\n            {isInternalColumn(id) ? (\n                children\n            ) : (\n                <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                    <span className=\"truncate\">{children}</span>\n                </Tooltip>\n            )}\n            {canSort ? <SortIndicator direction={sortDirection} /> : null}\n            {hasMenu ? (\n                <Menu\n                    canFreeze={canFreeze}\n                    canHide={canHide}\n                    className={cn('hidden group-hover/column:flex aria-expanded:!flex', {\n                        'ml-auto': align !== 'right',\n                        'ml-2': align === 'right',\n                    })}\n                    index={index}\n                    menu={meta.menu}\n                    onGoto={handleGoto}\n                    onHide={handleHide}\n                    scrollToIndex={scrollToIndex}\n                    table={table}\n                />\n            ) : null}\n            {canResize ? <Resizer isResizing={isResizing} onResize={handleResize} /> : null}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedHeaderProps<TType>) => JSX.Element;\n"],"names":["Header","props","children","column","header","scrollToIndex","table","tableMeta","options","meta","columnMeta","React","useMemo","columnDef","canSort","getCanSort","handleResize","getResizeHandler","handleSort","getToggleSortingHandler","handleHide","getToggleVisibilityHandler","hasGoto","isGotoAvailable","sorting","getState","filters","columnFilters","search","globalFilter","handleGoto","query","rowGoto","id","undefined","JSON","stringify","memoedProps","align","canFreeze","columnFreezing","isEnabled","canHide","getCanHide","canResize","getCanResize","hasMenu","isMenuAvailable","index","isFrozen","isFrozenColumn","isResizing","getIsResizing","length","getRowModel","rows","onGoto","onHide","onResize","onSort","sortDirection","getIsSorted","MemoedHeader","memo","className","cn","headerClassName","internalRef","setInternalRef","useState","useLayoutEffect","isInternalColumn","setColumnSizing","sizes","getBoundingClientRect","width","debugAll","console","log","getSortAttributes","role","ref","Tooltip","title","String","_meta$tooltip","tooltip","placement","SortIndicator","direction","Menu","menu","Resizer"],"mappings":"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"}
+{"version":3,"file":"Header.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Header.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { ColumnMeta, HeaderContext, TableMeta } from '@tanstack/react-table';\nimport { Menu, isMenuAvailable, isGotoAvailable } from './Menu';\nimport { Resizer } from './Resizer';\nimport { Table3ColumnAlignment, Table3SortDirection, TableStrategy } from '../../../types';\nimport { getSortAttributes, SortIndicator } from './SortIndicator';\nimport { isFrozenColumn, isInternalColumn } from '../../../util/columns';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport const SORT_DIRECTION: Record<string, Table3SortDirection> = {\n    ASC: 'asc',\n    DESC: 'desc',\n};\n\nexport type HeaderSortDirection = Table3SortDirection | false;\nexport type SortToggleHandler = (sortDirection: HeaderSortDirection) => void;\n\nexport type HeaderProps<TType = unknown> = HeaderContext<TType, unknown> & {\n    children?: string | JSX.Element;\n};\n\nexport function Header<TType = unknown>(props: HeaderProps<TType>) {\n    const { children, column, header, scrollToIndex, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const columnMeta = React.useMemo(() => column.columnDef.meta, []) as ColumnMeta<TType, unknown>;\n    const canSort = column.getCanSort();\n    const hasGoto = isGotoAvailable(table, header);\n\n    // passing header or column results in re-renders on scroll, so anything from those objects as memoed props\n    const handleHide = React.useMemo(() => header.column.getToggleVisibilityHandler(), []);\n    const handleResize = React.useMemo(() => header.getResizeHandler(), []);\n    const handleSort = React.useMemo(() => header.column.getToggleSortingHandler(), []);\n    const handleSortToggle = React.useCallback((sortDirection: HeaderSortDirection) => {\n        // When sorting is not applied, sortDirection is false.\n        if (sortDirection === false) {\n            header.column.clearSorting();\n        } else {\n            header.column.toggleSorting(sortDirection === SORT_DIRECTION.DESC);\n        }\n    }, []);\n\n    const sorting = table.getState().sorting;\n    const filters = table.getState().columnFilters;\n    const search = table.getState().globalFilter;\n\n    const handleGoto = React.useMemo(() => {\n        if (hasGoto) {\n            return ((query: string) => tableMeta.rowGoto.handleGoto(header.id, query, sorting, filters, search)) as (\n                query: string\n            ) => Promise<number>;\n        }\n\n        return undefined;\n    }, [hasGoto, JSON.stringify(sorting), JSON.stringify(filters), search]);\n\n    const memoedProps = {\n        align: columnMeta.align,\n        canFreeze: tableMeta.columnFreezing.isEnabled,\n        canHide: column.getCanHide(),\n        canResize: column.getCanResize(),\n        canSort,\n        children: children ?? columnMeta.header,\n        hasMenu: isMenuAvailable<TType>(table, header),\n        id: header.id,\n        index: header.index,\n        isFrozen: isFrozenColumn(header, table),\n        isPrinting: tableMeta.isPrinting,\n        isResizing: column.getIsResizing(),\n        length: table.getRowModel().rows.length,\n        meta: columnMeta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort as (event: unknown) => void,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection: column.getIsSorted(),\n        table,\n    };\n\n    return <MemoedHeader<TType> {...memoedProps} />;\n}\n\n// Memoization\nexport type MemoedHeaderProps<TType = unknown> = Omit<HeaderProps<TType>, 'column' | 'header'> & {\n    align?: Table3ColumnAlignment;\n    canFreeze: boolean;\n    canHide: boolean;\n    canResize: boolean;\n    canSort: boolean;\n    hasMenu: boolean;\n    id: string;\n    index: number;\n    isFrozen: boolean;\n    isPrinting: boolean;\n    isResizing: boolean;\n    length: number;\n    meta: ColumnMeta<TType, unknown>;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    onResize: (event: unknown) => void;\n    onSort: (event: unknown) => void;\n    onSortToggle: SortToggleHandler;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    sortDirection: HeaderSortDirection;\n};\n\nconst MemoedHeader = React.memo(function MemoedHeader<TType = unknown>(props: MemoedHeaderProps<TType>) {\n    const {\n        align,\n        children,\n        canFreeze,\n        canHide,\n        canResize,\n        canSort,\n        hasMenu,\n        id,\n        index,\n        isFrozen,\n        isPrinting,\n        isResizing,\n        length,\n        meta,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onResize: handleResize,\n        onSort: handleSort,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection,\n        table,\n    } = props;\n\n    const className = cn(\n        'sticky top-0 border-b-2 font-bold box-content group/column relative',\n        '[[role=\"table\"][data-resizing=\"true\"]_&]:pointer-events-none',\n        'px-[var(--table3-cell-padding-x)]',\n        {\n            'h-10 items-center': !isPrinting,\n            'pb-2': isPrinting,\n            'cursor-pointer select-none': canSort,\n            'hover:bg-grey-100': canSort || canResize || hasMenu,\n            'focus-within:bg-grey-100': hasMenu,\n            '!pointer-events-all !bg-grey-100': isResizing,\n            // z-indexes\n            'z-10 hover:z-20': !isFrozen && !isResizing,\n            'z-20': !isFrozen && isResizing,\n            '!z-30': isFrozen,\n            '!z-40': isFrozen && isResizing,\n        },\n        meta.headerClassName\n    );\n\n    const [internalRef, setInternalRef] = React.useState<HTMLDivElement | null>(null);\n\n    React.useLayoutEffect(() => {\n        if (internalRef && length) {\n            // the actions column size gets set by the column itself\n            if (isInternalColumn(id)) {\n                return;\n            }\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [id]: internalRef.getBoundingClientRect().width,\n            }));\n        }\n    }, [internalRef, length]);\n\n    if (table.options.debugAll) {\n        console.log('header render', id);\n    }\n\n    return (\n        <div\n            {...(canSort ? getSortAttributes(handleSort, sortDirection) : undefined)}\n            className={className}\n            data-align={align}\n            data-column-index={index}\n            role=\"columnheader\"\n            ref={setInternalRef}>\n            {isInternalColumn(id) ? (\n                children\n            ) : (\n                <Tooltip title={String(meta?.tooltip ?? children)} placement=\"top\">\n                    <span className={cn({ truncate: !isPrinting })}>{children}</span>\n                </Tooltip>\n            )}\n            {canSort ? <SortIndicator direction={sortDirection} /> : null}\n            {hasMenu ? (\n                <Menu\n                    canFreeze={canFreeze}\n                    canHide={canHide}\n                    canSort={canSort}\n                    className={cn({\n                        'ml-auto': align !== 'right',\n                        'ml-2': align === 'right',\n                    })}\n                    index={index}\n                    menu={meta.menu}\n                    onGoto={handleGoto}\n                    onHide={handleHide}\n                    onSortToggle={handleSortToggle}\n                    scrollToIndex={scrollToIndex}\n                    sortDirection={sortDirection}\n                    table={table}\n                />\n            ) : null}\n            {canResize ? <Resizer isResizing={isResizing} onResize={handleResize} /> : null}\n        </div>\n    );\n}) as <TType = unknown>(props: MemoedHeaderProps<TType>) => JSX.Element;\n"],"names":["SORT_DIRECTION","ASC","DESC","Header","props","children","column","header","scrollToIndex","table","tableMeta","options","meta","columnMeta","React","useMemo","columnDef","canSort","getCanSort","hasGoto","isGotoAvailable","handleHide","getToggleVisibilityHandler","handleResize","getResizeHandler","handleSort","getToggleSortingHandler","handleSortToggle","useCallback","sortDirection","clearSorting","toggleSorting","sorting","getState","filters","columnFilters","search","globalFilter","handleGoto","query","rowGoto","id","undefined","JSON","stringify","memoedProps","align","canFreeze","columnFreezing","isEnabled","canHide","getCanHide","canResize","getCanResize","hasMenu","isMenuAvailable","index","isFrozen","isFrozenColumn","isPrinting","isResizing","getIsResizing","length","getRowModel","rows","onGoto","onHide","onResize","onSort","onSortToggle","getIsSorted","MemoedHeader","memo","className","cn","headerClassName","internalRef","setInternalRef","useState","useLayoutEffect","isInternalColumn","setColumnSizing","sizes","getBoundingClientRect","width","debugAll","console","log","getSortAttributes","role","ref","Tooltip","title","String","_meta$tooltip","tooltip","placement","truncate","SortIndicator","direction","Menu","menu","Resizer"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Menu.js

@@ -5,6 +5,7 @@ import { useLocalization } from '../../../../Provider/Localization.js';
 import { Menu as Menu$1 } from '../../../../Menu/Menu.js';
 import { _finallyRethrows, _catch } from '../../../../../../../../node_modules/babel-plugin-transform-async-to-promises/helpers.mjs.js';
 import { GotoPopover } from './Goto.js';
+import { SORT_DIRECTION } from './Header.js';
 import { isInternalColumn } from '../../../util/columns.js';
 
 function isGotoAvailable(table, header) {
@@ -26,11 +27,14 @@ function Menu(props) {
   const {
     canFreeze,
     canHide,
+    canSort,
     index,
     menu,
     onGoto: handleGoto,
     onHide: handleHide,
+    onSortToggle: handleSortToggle,
     scrollToIndex,
+    sortDirection,
     table
   } = props;
   const tableMeta = table.options.meta;
@@ -38,6 +42,11 @@ function Menu(props) {
     texts
   } = useLocalization();
   const [popover, setPopover] = React__default.useState(undefined);
+  const [sortDirectionState, setSortDirectionState] = React__default.useState(sortDirection);
+  const handleSortMenuRadioGroupChange = newSortDirection => {
+    setSortDirectionState(newSortDirection);
+    handleSortToggle(newSortDirection);
+  };
   let popoverElement;
   if (popover) {
     const handleClosePopover = () => setPopover(undefined);
@@ -75,18 +84,11 @@ function Menu(props) {
         }
     }
   }
-  const className = cn('-my-0.5 -mr-1 -ml-0.5 !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)] flex-shrink-0 justify-end', {
-    '!flex': !!popoverElement
+  const className = cn('-my-0.5 -mr-1 -ml-0.5 !h-6 !min-h-[theme(spacing.6)] flex-shrink-0 justify-end !w-0 !min-w-0 !overflow-hidden', 'aria-expanded:!min-w-[theme(spacing.6)] aria-expanded:!w-6 aria-expanded:!overflow-auto', 'focus:!min-w-[theme(spacing.6)] focus:!w-6 focus:!overflow-auto', 'group-hover/column:!min-w-[theme(spacing.6)] group-hover/column:!w-6 group-hover/column:!overflow-auto', {
+    '!w-6 !min-w-[theme(spacing.6)] !overflow-auto': !!popoverElement
   }, props.className);
   const memoedMenuItems = React__default.useMemo(() => {
     const menuItems = [];
-    if (handleGoto) {
-      menuItems.push( /*#__PURE__*/React__default.createElement(Menu$1.Item, {
-        icon: "move",
-        onClick: () => setPopover('goto'),
-        shortcut: "g"
-      }, texts.table3.columns.menu.gotoRow, "..."));
-    }
     if (canHide) {
       // we do this in the next tick, otherwise the menu closes and react throws a "state update on unmounted component" error
       const handleClick = event => setTimeout(() => handleHide(event), 1);
@@ -95,6 +97,30 @@ function Menu(props) {
         onClick: handleClick
       }, texts.table3.columns.menu.hideColumn));
     }
+    // We rely on canSort value instead of onSort function's value because some columns might have sorting disabled,
+    // so even though onSort is truthy, we don't want to show sorting menu.
+    if (canSort) {
+      menuItems.push( /*#__PURE__*/React__default.createElement(Menu$1.Item, {
+        icon: "sort-by",
+        subMenu: () => /*#__PURE__*/React__default.createElement(Menu$1.SubMenu, null, /*#__PURE__*/React__default.createElement(Menu$1.RadioGroup, {
+          onChange: handleSortMenuRadioGroupChange,
+          value: sortDirectionState
+        }, /*#__PURE__*/React__default.createElement(Menu$1.RadioGroup.Item, {
+          value: SORT_DIRECTION.ASC
+        }, texts.table3.columns.menu.sortingOrder.ascending), /*#__PURE__*/React__default.createElement(Menu$1.RadioGroup.Item, {
+          value: SORT_DIRECTION.DESC
+        }, texts.table3.columns.menu.sortingOrder.descending), /*#__PURE__*/React__default.createElement(Menu$1.RadioGroup.Item, {
+          value: false
+        }, texts.table3.columns.menu.sortingOrder.unsorted)))
+      }, texts.table3.columns.menu.sorting));
+    }
+    if (handleGoto) {
+      menuItems.push( /*#__PURE__*/React__default.createElement(Menu$1.Item, {
+        icon: "move",
+        onClick: () => setPopover('goto'),
+        shortcut: "g"
+      }, texts.table3.columns.menu.gotoRow, "..."));
+    }
     if (canFreeze) {
       const frozenIndex = index - tableMeta.columnFreezing.frozenInternalColumnCount;
       const handleClick = () => tableMeta.columnFreezing.setFrozenColumnIndex(frozenIndex);
@@ -127,7 +153,7 @@ function Menu(props) {
     return menuItems.map((item, key) => /*#__PURE__*/React__default.cloneElement(item, {
       key
     }));
-  }, [menu, index, canFreeze, canHide, handleGoto, tableMeta.columnFreezing.frozenColumnIndex]);
+  }, [menu, index, canFreeze, canHide, canSort, handleGoto, handleSortToggle, sortDirection, tableMeta.columnFreezing.frozenColumnIndex]);
   return /*#__PURE__*/React__default.createElement(IconButton, {
     className: className,
     icon: "more",

package/dist/esm/packages/taco/src/components/Table3/components/columns/header/Menu.js.map

@@ -1 +1 @@
-{"version":3,"file":"Menu.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Header as RTHeader, Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu as MenuPrimitive } from '../../../../Menu/Menu';\nimport { isInternalColumn } from '../../../util/columns';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Table3ColumnHeaderMenu, TableStrategy } from '../../../types';\nimport { GotoPopover } from './Goto';\n\nexport function isGotoAvailable<TType = unknown>(table: RTable<TType>, header: RTHeader<TType, unknown>) {\n    if (isInternalColumn(header.id)) {\n        return false;\n    }\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    return !!(tableMeta.rowGoto.isEnabled && header.column.getCanSort() && header.column.getIsSorted());\n}\n\nexport function isMenuAvailable<TType = unknown>(table: RTable<TType>, header: RTHeader<TType, unknown>): boolean {\n    if (isInternalColumn(header.id)) {\n        return false;\n    }\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    return (\n        !!header.column.columnDef.meta?.menu ||\n        !!tableMeta.columnFreezing.isEnabled ||\n        (!!table.options.enableHiding && !!header.column.getCanHide()) ||\n        isGotoAvailable(table, header)\n    );\n}\n\nexport type MenuProps<TType = unknown> = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    canFreeze: boolean;\n    canHide: boolean;\n    index: number;\n    menu?: Table3ColumnHeaderMenu;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    table: RTable<TType>;\n};\n\nexport function Menu<TType = unknown>(props: MenuProps<TType>) {\n    const { canFreeze, canHide, index, menu, onGoto: handleGoto, onHide: handleHide, scrollToIndex, table } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { texts } = useLocalization();\n    const [popover, setPopover] = React.useState<string | undefined>(undefined);\n\n    let popoverElement;\n\n    if (popover) {\n        const handleClosePopover = () => setPopover(undefined);\n\n        switch (popover) {\n            case 'goto': {\n                if (handleGoto) {\n                    const goto = async (query: string) => {\n                        try {\n                            const index = await handleGoto(query);\n                            tableMeta.currentRow.setCurrentRowIndex(index);\n                            scrollToIndex(index + 2, { align: 'center' });\n                        } catch {\n                            //\n                        } finally {\n                            handleClosePopover();\n                        }\n                    };\n                    popoverElement = props => <GotoPopover {...props} open onChange={handleClosePopover} onGoto={goto} />;\n                }\n            }\n        }\n    }\n\n    const className = cn(\n        '-my-0.5 -mr-1 -ml-0.5 !h-6 !min-h-[theme(spacing.6)] !w-6 !min-w-[theme(spacing.6)] flex-shrink-0 justify-end',\n        {\n            '!flex': !!popoverElement,\n        },\n        props.className\n    );\n\n    const memoedMenuItems = React.useMemo(() => {\n        const menuItems: JSX.Element[] = [];\n\n        if (handleGoto) {\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"move\" onClick={() => setPopover('goto')} shortcut=\"g\">\n                    {texts.table3.columns.menu.gotoRow}...\n                </MenuPrimitive.Item>\n            );\n        }\n\n        if (canHide) {\n            // we do this in the next tick, otherwise the menu closes and react throws a \"state update on unmounted component\" error\n            const handleClick = event => setTimeout(() => handleHide(event), 1);\n\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"unreconciled\" onClick={handleClick}>\n                    {texts.table3.columns.menu.hideColumn}\n                </MenuPrimitive.Item>\n            );\n        }\n\n        if (canFreeze) {\n            const frozenIndex = index - tableMeta.columnFreezing.frozenInternalColumnCount;\n            const handleClick = () => tableMeta.columnFreezing.setFrozenColumnIndex(frozenIndex);\n\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"column-freeze\" onClick={handleClick}>\n                    {frozenIndex === 0\n                        ? texts.table3.columns.menu.freezeFirstColumn\n                        : texts.table3.columns.menu.freezeUptoColumn.replace('[TOTAL]', String(frozenIndex + 1))}\n                </MenuPrimitive.Item>\n            );\n\n            if (tableMeta.columnFreezing.frozenColumnIndex !== undefined) {\n                const handleClick = () => {\n                    tableMeta.columnFreezing.setFrozenColumnIndex(undefined);\n                };\n\n                menuItems.push(\n                    <MenuPrimitive.Item icon=\"column-unfreeze\" onClick={handleClick}>\n                        {texts.table3.columns.menu.unfreezeColumns}\n                    </MenuPrimitive.Item>\n                );\n            }\n        }\n\n        if (menu) {\n            const customMenu = menu({ trigger: undefined });\n            const customItems = React.Children.toArray(customMenu.props.children.props.children) as JSX.Element[];\n\n            if (customItems.length) {\n                if (menuItems.length) {\n                    menuItems.push(<MenuPrimitive.Separator />);\n                }\n\n                menuItems.push(...customItems);\n            }\n        }\n\n        return menuItems.map((item, key) => React.cloneElement(item, { key }));\n    }, [menu, index, canFreeze, canHide, handleGoto, tableMeta.columnFreezing.frozenColumnIndex]);\n\n    return (\n        <IconButton\n            className={className}\n            icon=\"more\"\n            menu={\n                popoverElement\n                    ? undefined\n                    : menuProps => (\n                          <MenuPrimitive {...menuProps}>\n                              <MenuPrimitive.Content>{memoedMenuItems}</MenuPrimitive.Content>\n                          </MenuPrimitive>\n                      )\n            }\n            popover={popoverElement}\n            onClickCapture={event => event.preventDefault()}\n        />\n    );\n}\n"],"names":["isGotoAvailable","table","header","isInternalColumn","id","tableMeta","options","meta","rowGoto","isEnabled","column","getCanSort","getIsSorted","isMenuAvailable","_header$column$column","columnDef","menu","columnFreezing","enableHiding","getCanHide","Menu","props","canFreeze","canHide","index","onGoto","handleGoto","onHide","handleHide","scrollToIndex","texts","useLocalization","popover","setPopover","React","useState","undefined","popoverElement","handleClosePopover","goto","query","Promise","resolve","then","currentRow","setCurrentRowIndex","align","_wasThrown","_result","_temp","e","reject","GotoPopover","open","onChange","className","cn","memoedMenuItems","useMemo","menuItems","push","MenuPrimitive","Item","icon","onClick","shortcut","table3","columns","gotoRow","handleClick","event","setTimeout","hideColumn","frozenIndex","frozenInternalColumnCount","setFrozenColumnIndex","freezeFirstColumn","freezeUptoColumn","replace","String","frozenColumnIndex","unfreezeColumns","customMenu","trigger","customItems","Children","toArray","children","length","Separator","map","item","key","cloneElement","IconButton","menuProps","Content","onClickCapture","preventDefault"],"mappings":"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"}
+{"version":3,"file":"Menu.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/header/Menu.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { Header as RTHeader, Table as RTable, TableMeta } from '@tanstack/react-table';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu as MenuPrimitive } from '../../../../Menu/Menu';\nimport { isInternalColumn } from '../../../util/columns';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Table3ColumnHeaderMenu, TableStrategy } from '../../../types';\nimport { GotoPopover } from './Goto';\nimport { HeaderSortDirection, SORT_DIRECTION, SortToggleHandler } from './Header';\nimport { RadioGroupItemValue } from '../../../../RadioGroup/RadioGroup';\n\nexport function isGotoAvailable<TType = unknown>(table: RTable<TType>, header: RTHeader<TType, unknown>) {\n    if (isInternalColumn(header.id)) {\n        return false;\n    }\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    return !!(tableMeta.rowGoto.isEnabled && header.column.getCanSort() && header.column.getIsSorted());\n}\n\nexport function isMenuAvailable<TType = unknown>(table: RTable<TType>, header: RTHeader<TType, unknown>): boolean {\n    if (isInternalColumn(header.id)) {\n        return false;\n    }\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    return (\n        !!header.column.columnDef.meta?.menu ||\n        !!tableMeta.columnFreezing.isEnabled ||\n        (!!table.options.enableHiding && !!header.column.getCanHide()) ||\n        isGotoAvailable(table, header)\n    );\n}\n\nexport type MenuProps<TType = unknown> = React.ButtonHTMLAttributes<HTMLButtonElement> & {\n    canFreeze: boolean;\n    canHide: boolean;\n    canSort: boolean;\n    index: number;\n    menu?: Table3ColumnHeaderMenu;\n    onGoto?: (query: string) => Promise<number>;\n    onHide: (event: unknown) => void;\n    onSortToggle: SortToggleHandler;\n    scrollToIndex: TableStrategy['scrollToIndex'];\n    sortDirection: HeaderSortDirection;\n    table: RTable<TType>;\n};\n\nexport function Menu<TType = unknown>(props: MenuProps<TType>) {\n    const {\n        canFreeze,\n        canHide,\n        canSort,\n        index,\n        menu,\n        onGoto: handleGoto,\n        onHide: handleHide,\n        onSortToggle: handleSortToggle,\n        scrollToIndex,\n        sortDirection,\n        table,\n    } = props;\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const { texts } = useLocalization();\n    const [popover, setPopover] = React.useState<string | undefined>(undefined);\n    const [sortDirectionState, setSortDirectionState] = React.useState<HeaderSortDirection>(sortDirection);\n\n    const handleSortMenuRadioGroupChange = (newSortDirection: RadioGroupItemValue) => {\n        setSortDirectionState(newSortDirection as HeaderSortDirection);\n        handleSortToggle(newSortDirection as HeaderSortDirection);\n    };\n\n    let popoverElement;\n\n    if (popover) {\n        const handleClosePopover = () => setPopover(undefined);\n\n        switch (popover) {\n            case 'goto': {\n                if (handleGoto) {\n                    const goto = async (query: string) => {\n                        try {\n                            const index = await handleGoto(query);\n                            tableMeta.currentRow.setCurrentRowIndex(index);\n                            scrollToIndex(index + 2, { align: 'center' });\n                        } catch {\n                            //\n                        } finally {\n                            handleClosePopover();\n                        }\n                    };\n                    popoverElement = props => <GotoPopover {...props} open onChange={handleClosePopover} onGoto={goto} />;\n                }\n            }\n        }\n    }\n\n    const className = cn(\n        '-my-0.5 -mr-1 -ml-0.5 !h-6 !min-h-[theme(spacing.6)] flex-shrink-0 justify-end !w-0 !min-w-0 !overflow-hidden',\n        'aria-expanded:!min-w-[theme(spacing.6)] aria-expanded:!w-6 aria-expanded:!overflow-auto',\n        'focus:!min-w-[theme(spacing.6)] focus:!w-6 focus:!overflow-auto',\n        'group-hover/column:!min-w-[theme(spacing.6)] group-hover/column:!w-6 group-hover/column:!overflow-auto',\n        {\n            '!w-6 !min-w-[theme(spacing.6)] !overflow-auto': !!popoverElement,\n        },\n        props.className\n    );\n\n    const memoedMenuItems = React.useMemo(() => {\n        const menuItems: JSX.Element[] = [];\n\n        if (canHide) {\n            // we do this in the next tick, otherwise the menu closes and react throws a \"state update on unmounted component\" error\n            const handleClick = event => setTimeout(() => handleHide(event), 1);\n\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"unreconciled\" onClick={handleClick}>\n                    {texts.table3.columns.menu.hideColumn}\n                </MenuPrimitive.Item>\n            );\n        }\n\n        // We rely on canSort value instead of onSort function's value because some columns might have sorting disabled,\n        // so even though onSort is truthy, we don't want to show sorting menu.\n        if (canSort) {\n            menuItems.push(\n                <MenuPrimitive.Item\n                    icon=\"sort-by\"\n                    subMenu={() => (\n                        <MenuPrimitive.SubMenu>\n                            <MenuPrimitive.RadioGroup onChange={handleSortMenuRadioGroupChange} value={sortDirectionState}>\n                                <MenuPrimitive.RadioGroup.Item value={SORT_DIRECTION.ASC}>\n                                    {texts.table3.columns.menu.sortingOrder.ascending}\n                                </MenuPrimitive.RadioGroup.Item>\n                                <MenuPrimitive.RadioGroup.Item value={SORT_DIRECTION.DESC}>\n                                    {texts.table3.columns.menu.sortingOrder.descending}\n                                </MenuPrimitive.RadioGroup.Item>\n                                <MenuPrimitive.RadioGroup.Item value={false}>\n                                    {texts.table3.columns.menu.sortingOrder.unsorted}\n                                </MenuPrimitive.RadioGroup.Item>\n                            </MenuPrimitive.RadioGroup>\n                        </MenuPrimitive.SubMenu>\n                    )}>\n                    {texts.table3.columns.menu.sorting}\n                </MenuPrimitive.Item>\n            );\n        }\n\n        if (handleGoto) {\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"move\" onClick={() => setPopover('goto')} shortcut=\"g\">\n                    {texts.table3.columns.menu.gotoRow}...\n                </MenuPrimitive.Item>\n            );\n        }\n\n        if (canFreeze) {\n            const frozenIndex = index - tableMeta.columnFreezing.frozenInternalColumnCount;\n            const handleClick = () => tableMeta.columnFreezing.setFrozenColumnIndex(frozenIndex);\n\n            menuItems.push(\n                <MenuPrimitive.Item icon=\"column-freeze\" onClick={handleClick}>\n                    {frozenIndex === 0\n                        ? texts.table3.columns.menu.freezeFirstColumn\n                        : texts.table3.columns.menu.freezeUptoColumn.replace('[TOTAL]', String(frozenIndex + 1))}\n                </MenuPrimitive.Item>\n            );\n\n            if (tableMeta.columnFreezing.frozenColumnIndex !== undefined) {\n                const handleClick = () => {\n                    tableMeta.columnFreezing.setFrozenColumnIndex(undefined);\n                };\n\n                menuItems.push(\n                    <MenuPrimitive.Item icon=\"column-unfreeze\" onClick={handleClick}>\n                        {texts.table3.columns.menu.unfreezeColumns}\n                    </MenuPrimitive.Item>\n                );\n            }\n        }\n\n        if (menu) {\n            const customMenu = menu({ trigger: undefined });\n            const customItems = React.Children.toArray(customMenu.props.children.props.children) as JSX.Element[];\n\n            if (customItems.length) {\n                if (menuItems.length) {\n                    menuItems.push(<MenuPrimitive.Separator />);\n                }\n\n                menuItems.push(...customItems);\n            }\n        }\n\n        return menuItems.map((item, key) => React.cloneElement(item, { key }));\n    }, [\n        menu,\n        index,\n        canFreeze,\n        canHide,\n        canSort,\n        handleGoto,\n        handleSortToggle,\n        sortDirection,\n        tableMeta.columnFreezing.frozenColumnIndex,\n    ]);\n\n    return (\n        <IconButton\n            className={className}\n            icon=\"more\"\n            menu={\n                popoverElement\n                    ? undefined\n                    : menuProps => (\n                          <MenuPrimitive {...menuProps}>\n                              <MenuPrimitive.Content>{memoedMenuItems}</MenuPrimitive.Content>\n                          </MenuPrimitive>\n                      )\n            }\n            popover={popoverElement}\n            onClickCapture={event => event.preventDefault()}\n        />\n    );\n}\n"],"names":["isGotoAvailable","table","header","isInternalColumn","id","tableMeta","options","meta","rowGoto","isEnabled","column","getCanSort","getIsSorted","isMenuAvailable","_header$column$column","columnDef","menu","columnFreezing","enableHiding","getCanHide","Menu","props","canFreeze","canHide","canSort","index","onGoto","handleGoto","onHide","handleHide","onSortToggle","handleSortToggle","scrollToIndex","sortDirection","texts","useLocalization","popover","setPopover","React","useState","undefined","sortDirectionState","setSortDirectionState","handleSortMenuRadioGroupChange","newSortDirection","popoverElement","handleClosePopover","goto","query","Promise","resolve","then","currentRow","setCurrentRowIndex","align","_wasThrown","_result","_temp","e","reject","GotoPopover","open","onChange","className","cn","memoedMenuItems","useMemo","menuItems","handleClick","event","setTimeout","push","MenuPrimitive","Item","icon","onClick","table3","columns","hideColumn","subMenu","SubMenu","RadioGroup","value","SORT_DIRECTION","ASC","sortingOrder","ascending","DESC","descending","unsorted","sorting","shortcut","gotoRow","frozenIndex","frozenInternalColumnCount","setFrozenColumnIndex","freezeFirstColumn","freezeUptoColumn","replace","String","frozenColumnIndex","unfreezeColumns","customMenu","trigger","customItems","Children","toArray","children","length","Separator","map","item","key","cloneElement","IconButton","menuProps","Content","onClickCapture","preventDefault"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Actions.js

@@ -61,7 +61,7 @@ const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
       var _ref, _button$props$tooltip;
       const tooltip = String((_ref = (_button$props$tooltip = button.props.tooltip) !== null && _button$props$tooltip !== void 0 ? _button$props$tooltip : button.props['aria-label']) !== null && _ref !== void 0 ? _ref : '');
       return /*#__PURE__*/React__default.cloneElement(button, {
-        appearance: 'discrete',
+        appearance: 'transparent',
         key: index,
         tabIndex: isCurrentRow ? 0 : -1,
         tooltip: button.props.shortcut ? /*#__PURE__*/React__default.createElement(React__default.Fragment, null, tooltip, /*#__PURE__*/React__default.createElement(Shortcut, {
@@ -70,7 +70,7 @@ const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
         })) : tooltip
       });
     }), actionsInMenu.length ? /*#__PURE__*/React__default.createElement(IconButton, {
-      appearance: "discrete",
+      appearance: "transparent",
       "aria-label": texts.table3.columns.actions.tooltip,
       icon: "more",
       tabIndex: isCurrentRow ? 0 : -1,
@@ -106,7 +106,7 @@ function createRowActionsColumn() {
     footer: Footer,
     meta: {
       align: 'right',
-      className: cn('!pt-[var(--table3-row-padding)] print:opacity-0 [[role="table"][data-editing="false"]_&]:group-[[data-current="true"]]/row:sticky [[role="table"][data-pause-hover="false"][data-editing="false"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1', 'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]', 'group-[[data-current="true"][data-selected="false"]]/row:text-grey-200', 'group-[[data-selected="true"]]/row:text-blue-100', 'group-[[data-selected="false"]:hover]/row:text-grey-100'),
+      className: cn('!pt-[var(--table3-cell-padding-y)] print:opacity-0 [[role="table"][data-editing="false"]_&]:group-[[data-current="true"]]/row:sticky [[role="table"][data-pause-hover="false"][data-editing="false"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1', 'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]', 'group-[[data-current="true"][data-selected="false"]]/row:text-grey-200', 'group-[[data-selected="true"]]/row:text-blue-100', 'group-[[data-selected="false"]:hover]/row:text-grey-100'),
       enableOrdering: false,
       enableSearch: false,
       enableTruncate: false,

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Actions.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3FontSize, Table3RowActionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Menu } from '../../../../Menu/Menu';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    actions?: Table3RowActionRenderer<TType>[];\n    actionsLength: number;\n    fontSize: Table3FontSize;\n    isCurrentRow: boolean;\n    isEditing: boolean;\n    isResizingColumn: boolean;\n    isHoverStatePaused: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { actions, actionsLength, fontSize, isCurrentRow, isEditing, isResizingColumn, isHoverStatePaused, row } = props;\n    const { isHovered } = React.useContext(RowContext);\n    const { texts } = useLocalization();\n    const ref = React.useRef<HTMLSpanElement | null>(null);\n    /*\n    const size = table.getState().columnSizing[COLUMN_ID];\n\n    // the actions column needs to set its size based on its content, not the actual column\n    // so we do this here instead of in the header\n    React.useLayoutEffect(() => {\n        if (ref.current && !size) {\n            const width = ref.current.getBoundingClientRect().width;\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [COLUMN_ID]: width,\n            }));\n        }\n    }, [ref.current]);\n    */\n\n    let content;\n\n    // We don't want to show actions in edit mode, since we have editing actions,\n    // which is shown in edit mode instead.\n    if (actions?.length && !isEditing && (isCurrentRow || (isHovered && !isHoverStatePaused && !isResizingColumn))) {\n        const visibleActions = actions.map(action => action(row.original)).filter(action => !!action) as JSX.Element[];\n\n        const actionsOnRow =\n            visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n        const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n        const className = cn('-mb-2 flex justify-end pl-2 text-right', {\n            // Adjust negative margin on row actions cell to ensure that the cell aligns vertically.\n            '-mt-2': fontSize === 'small',\n            '-mt-1.5': fontSize !== 'small',\n        });\n\n        content = (\n            <span className={className} ref={ref}>\n                {actionsOnRow.map((button, index) => {\n                    const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n                    return React.cloneElement(button, {\n                        appearance: 'discrete',\n                        key: index,\n                        tabIndex: isCurrentRow ? 0 : -1,\n                        tooltip: button.props.shortcut ? (\n                            <>\n                                {tooltip}\n                                <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n                            </>\n                        ) : (\n                            tooltip\n                        ),\n                    });\n                })}\n                {actionsInMenu.length ? (\n                    <IconButton\n                        appearance=\"discrete\"\n                        aria-label={texts.table3.columns.actions.tooltip}\n                        icon=\"more\"\n                        tabIndex={isCurrentRow ? 0 : -1}\n                        menu={menuProps => (\n                            <Menu {...menuProps}>\n                                <Menu.Content>\n                                    {actionsInMenu.map((action, i) => (\n                                        <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n                                            {action.props['aria-label']}\n                                        </Menu.Item>\n                                    ))}\n                                </Menu.Content>\n                            </Menu>\n                        )}\n                    />\n                ) : null}\n            </span>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown>;\n\nfunction Cell<TType = unknown>(context: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...context}\n            actions={tableMeta.rowActions.actionsForRow}\n            actionsLength={tableMeta.rowActions.actionsForRowLength}\n            fontSize={tableMeta.fontSize.size}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n            isResizingColumn={!!context.table.getState().columnSizingInfo.isResizingColumn}\n            isHoverStatePaused={!!tableMeta.hoverState.isPaused}\n        />\n    );\n}\n\nexport function createRowActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                '!pt-[var(--table3-row-padding)] print:opacity-0 [[role=\"table\"][data-editing=\"false\"]_&]:group-[[data-current=\"true\"]]/row:sticky [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"false\"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1',\n                'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n    };\n}\n"],"names":["COLUMN_ID","MemoedCell","React","memo","props","actions","actionsLength","fontSize","isCurrentRow","isEditing","isResizingColumn","isHoverStatePaused","row","isHovered","useContext","RowContext","texts","useLocalization","ref","useRef","content","length","visibleActions","map","action","original","filter","actionsOnRow","slice","actionsInMenu","className","cn","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","table3","columns","icon","menu","menuProps","Menu","Content","i","Item","DisplayCell","Cell","context","rowIndex","tableMeta","table","options","meta","rowActions","actionsForRow","actionsForRowLength","size","currentRow","currentRowIndex","editing","getState","columnSizingInfo","hoverState","isPaused","createRowActionsColumn","id","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing"],"mappings":"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"}
+{"version":3,"file":"Actions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Actions.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport cn from 'classnames';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3FontSize, Table3RowActionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Menu } from '../../../../Menu/Menu';\nimport { Shortcut } from '../../../../Shortcut/Shortcut';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    actions?: Table3RowActionRenderer<TType>[];\n    actionsLength: number;\n    fontSize: Table3FontSize;\n    isCurrentRow: boolean;\n    isEditing: boolean;\n    isResizingColumn: boolean;\n    isHoverStatePaused: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { actions, actionsLength, fontSize, isCurrentRow, isEditing, isResizingColumn, isHoverStatePaused, row } = props;\n    const { isHovered } = React.useContext(RowContext);\n    const { texts } = useLocalization();\n    const ref = React.useRef<HTMLSpanElement | null>(null);\n    /*\n    const size = table.getState().columnSizing[COLUMN_ID];\n\n    // the actions column needs to set its size based on its content, not the actual column\n    // so we do this here instead of in the header\n    React.useLayoutEffect(() => {\n        if (ref.current && !size) {\n            const width = ref.current.getBoundingClientRect().width;\n\n            table.setColumnSizing(sizes => ({\n                ...sizes,\n                [COLUMN_ID]: width,\n            }));\n        }\n    }, [ref.current]);\n    */\n\n    let content;\n\n    // We don't want to show actions in edit mode, since we have editing actions,\n    // which is shown in edit mode instead.\n    if (actions?.length && !isEditing && (isCurrentRow || (isHovered && !isHoverStatePaused && !isResizingColumn))) {\n        const visibleActions = actions.map(action => action(row.original)).filter(action => !!action) as JSX.Element[];\n\n        const actionsOnRow =\n            visibleActions.length === actionsLength ? visibleActions : visibleActions.slice(0, actionsLength - 1);\n        const actionsInMenu = visibleActions.slice(visibleActions.length === actionsLength ? actionsLength : actionsLength - 1);\n\n        const className = cn('-mb-2 flex justify-end pl-2 text-right', {\n            // Adjust negative margin on row actions cell to ensure that the cell aligns vertically.\n            '-mt-2': fontSize === 'small',\n            '-mt-1.5': fontSize !== 'small',\n        });\n\n        content = (\n            <span className={className} ref={ref}>\n                {actionsOnRow.map((button, index) => {\n                    const tooltip = String(button.props.tooltip ?? button.props['aria-label'] ?? '');\n\n                    return React.cloneElement(button, {\n                        appearance: 'transparent',\n                        key: index,\n                        tabIndex: isCurrentRow ? 0 : -1,\n                        tooltip: button.props.shortcut ? (\n                            <>\n                                {tooltip}\n                                <Shortcut className=\"ml-2\" keys={button.props.shortcut} />\n                            </>\n                        ) : (\n                            tooltip\n                        ),\n                    });\n                })}\n                {actionsInMenu.length ? (\n                    <IconButton\n                        appearance=\"transparent\"\n                        aria-label={texts.table3.columns.actions.tooltip}\n                        icon=\"more\"\n                        tabIndex={isCurrentRow ? 0 : -1}\n                        menu={menuProps => (\n                            <Menu {...menuProps}>\n                                <Menu.Content>\n                                    {actionsInMenu.map((action, i) => (\n                                        <Menu.Item key={i} {...action.props} shortcut={action.props.shortcut}>\n                                            {action.props['aria-label']}\n                                        </Menu.Item>\n                                    ))}\n                                </Menu.Content>\n                            </Menu>\n                        )}\n                    />\n                ) : null}\n            </span>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown>;\n\nfunction Cell<TType = unknown>(context: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...context}\n            actions={tableMeta.rowActions.actionsForRow}\n            actionsLength={tableMeta.rowActions.actionsForRowLength}\n            fontSize={tableMeta.fontSize.size}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n            isResizingColumn={!!context.table.getState().columnSizingInfo.isResizingColumn}\n            isHoverStatePaused={!!tableMeta.hoverState.isPaused}\n        />\n    );\n}\n\nexport function createRowActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                '!pt-[var(--table3-cell-padding-y)] print:opacity-0 [[role=\"table\"][data-editing=\"false\"]_&]:group-[[data-current=\"true\"]]/row:sticky [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"false\"]_&]:group-hover/row:sticky right-0 !pl-1 !pr-1',\n                'shadow-[-6px_0px_6px_var(--table3-row-actions-shadow)]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n    };\n}\n"],"names":["COLUMN_ID","MemoedCell","React","memo","props","actions","actionsLength","fontSize","isCurrentRow","isEditing","isResizingColumn","isHoverStatePaused","row","isHovered","useContext","RowContext","texts","useLocalization","ref","useRef","content","length","visibleActions","map","action","original","filter","actionsOnRow","slice","actionsInMenu","className","cn","button","index","tooltip","String","_ref","_button$props$tooltip","cloneElement","appearance","key","tabIndex","shortcut","Shortcut","keys","IconButton","table3","columns","icon","menu","menuProps","Menu","Content","i","Item","DisplayCell","Cell","context","rowIndex","tableMeta","table","options","meta","rowActions","actionsForRow","actionsForRowLength","size","currentRow","currentRowIndex","editing","getState","columnSizingInfo","hoverState","isPaused","createRowActionsColumn","id","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Drag.js

@@ -68,7 +68,7 @@ function createRowDragColumn(onRowDrag) {
     footer: Footer,
     meta: {
       align: 'center',
-      className: '!p-0 !pt-[var(--table3-row-padding)]',
+      className: '!p-0 !pt-[var(--table3-cell-padding-y)]',
       enableOrdering: false,
       enableSearch: false,
       enableTruncate: false,

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Drag.js.map

@@ -1 +1 @@
-{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3RowDragHandler } from '../../../types';\nimport { Icon } from '../../../../Icon/Icon';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__drag';\nconst GHOST_ELEMENT_ID = 'taco_table_dragging';\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    isSelected: boolean;\n    onRowDrag: Table3RowDragHandler<TType>;\n};\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(props: CellProps<TType>) {\n    const { isSelected, onRowDrag: handleRowDrag, row, table } = props;\n    const { texts } = useLocalization();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const onDragStart = (event: React.DragEvent): void => {\n        let rows = [row];\n\n        if (table.options.enableRowSelection) {\n            rows = isSelected ? table.getSelectedRowModel().rows : [row, ...table.getSelectedRowModel().rows];\n        }\n\n        const data = rows.map(row => row.original);\n\n        tableMeta.rowDrag.setDragging(\n            rows.reduce((dragging, rowBeingDragged) => ({ ...dragging, [rowBeingDragged.id]: true }), {})\n        );\n\n        // set a default data value so that the consumer doesn't have to\n        event.dataTransfer.setData('text', JSON.stringify(data));\n\n        const showPlaceholder = (text: string) => {\n            const ghost = document.createElement('div');\n            ghost.id = GHOST_ELEMENT_ID;\n            ghost.className = 'wcag-blue rounded flex w-48 p-4 absolute -ml-[100vw]';\n            ghost.innerText = text;\n            document.body.appendChild(ghost);\n            event.dataTransfer.setDragImage(ghost, 0, 0);\n        };\n\n        const setDataTransfer = (text: string) => event.dataTransfer.setData('text', text);\n\n        handleRowDrag(data, showPlaceholder, setDataTransfer);\n    };\n\n    const handleDragEnd = (): void => {\n        document.getElementById(GHOST_ELEMENT_ID)?.remove();\n        tableMeta.rowDrag.setDragging({});\n    };\n\n    return (\n        <DisplayCell {...props}>\n            <div draggable onDragStart={onDragStart} onDragOver={event => event.preventDefault()} onDragEnd={handleDragEnd}>\n                <Icon\n                    aria-label={texts.table3.columns.drag.tooltip}\n                    name=\"drag\"\n                    className=\"text-grey-darkest invisible -mt-1 w-[20px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white\"\n                />\n            </div>\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: CellProps<TType>) => JSX.Element;\n\nexport function createRowDragColumn<TType = unknown>(onRowDrag: Table3RowDragHandler<TType>): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: (context: CellContext<TType, unknown>) => (\n            <Cell {...context} isSelected={context.row.getIsSelected()} onRowDrag={onRowDrag} />\n        ),\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: '!p-0 !pt-[var(--table3-row-padding)]',\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: 20,\n        minSize: 20,\n    };\n}\n"],"names":["COLUMN_ID","GHOST_ELEMENT_ID","Cell","React","memo","MemoedCell","props","isSelected","onRowDrag","handleRowDrag","row","table","texts","useLocalization","tableMeta","options","meta","onDragStart","event","rows","enableRowSelection","getSelectedRowModel","data","map","original","rowDrag","setDragging","reduce","dragging","rowBeingDragged","id","dataTransfer","setData","JSON","stringify","showPlaceholder","text","ghost","document","createElement","className","innerText","body","appendChild","setDragImage","setDataTransfer","handleDragEnd","_document$getElementB","getElementById","remove","DisplayCell","draggable","onDragOver","preventDefault","onDragEnd","Icon","table3","columns","drag","tooltip","name","createRowDragColumn","header","ColumnHeader","cell","context","getIsSelected","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size","minSize"],"mappings":"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"}
+{"version":3,"file":"Drag.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Drag.tsx"],"sourcesContent":["import React from 'react';\nimport { CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Table3RowDragHandler } from '../../../types';\nimport { Icon } from '../../../../Icon/Icon';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__drag';\nconst GHOST_ELEMENT_ID = 'taco_table_dragging';\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    isSelected: boolean;\n    onRowDrag: Table3RowDragHandler<TType>;\n};\n\nconst Cell = React.memo(function MemoedCell<TType = unknown>(props: CellProps<TType>) {\n    const { isSelected, onRowDrag: handleRowDrag, row, table } = props;\n    const { texts } = useLocalization();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const onDragStart = (event: React.DragEvent): void => {\n        let rows = [row];\n\n        if (table.options.enableRowSelection) {\n            rows = isSelected ? table.getSelectedRowModel().rows : [row, ...table.getSelectedRowModel().rows];\n        }\n\n        const data = rows.map(row => row.original);\n\n        tableMeta.rowDrag.setDragging(\n            rows.reduce((dragging, rowBeingDragged) => ({ ...dragging, [rowBeingDragged.id]: true }), {})\n        );\n\n        // set a default data value so that the consumer doesn't have to\n        event.dataTransfer.setData('text', JSON.stringify(data));\n\n        const showPlaceholder = (text: string) => {\n            const ghost = document.createElement('div');\n            ghost.id = GHOST_ELEMENT_ID;\n            ghost.className = 'wcag-blue rounded flex w-48 p-4 absolute -ml-[100vw]';\n            ghost.innerText = text;\n            document.body.appendChild(ghost);\n            event.dataTransfer.setDragImage(ghost, 0, 0);\n        };\n\n        const setDataTransfer = (text: string) => event.dataTransfer.setData('text', text);\n\n        handleRowDrag(data, showPlaceholder, setDataTransfer);\n    };\n\n    const handleDragEnd = (): void => {\n        document.getElementById(GHOST_ELEMENT_ID)?.remove();\n        tableMeta.rowDrag.setDragging({});\n    };\n\n    return (\n        <DisplayCell {...props}>\n            <div draggable onDragStart={onDragStart} onDragOver={event => event.preventDefault()} onDragEnd={handleDragEnd}>\n                <Icon\n                    aria-label={texts.table3.columns.drag.tooltip}\n                    name=\"drag\"\n                    className=\"text-grey-darkest invisible -mt-1 w-[20px] cursor-grab active:cursor-grabbing group-hover/row:visible group-[[aria-grabbed='true']]/row:text-white\"\n                />\n            </div>\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: CellProps<TType>) => JSX.Element;\n\nexport function createRowDragColumn<TType = unknown>(onRowDrag: Table3RowDragHandler<TType>): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: (context: CellContext<TType, unknown>) => (\n            <Cell {...context} isSelected={context.row.getIsSelected()} onRowDrag={onRowDrag} />\n        ),\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: '!p-0 !pt-[var(--table3-cell-padding-y)]',\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: 20,\n        minSize: 20,\n    };\n}\n"],"names":["COLUMN_ID","GHOST_ELEMENT_ID","Cell","React","memo","MemoedCell","props","isSelected","onRowDrag","handleRowDrag","row","table","texts","useLocalization","tableMeta","options","meta","onDragStart","event","rows","enableRowSelection","getSelectedRowModel","data","map","original","rowDrag","setDragging","reduce","dragging","rowBeingDragged","id","dataTransfer","setData","JSON","stringify","showPlaceholder","text","ghost","document","createElement","className","innerText","body","appendChild","setDragImage","setDataTransfer","handleDragEnd","_document$getElementB","getElementById","remove","DisplayCell","draggable","onDragOver","preventDefault","onDragEnd","Icon","table3","columns","drag","tooltip","name","createRowDragColumn","header","ColumnHeader","cell","context","getIsSelected","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size","minSize"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js

@@ -61,7 +61,7 @@ const MemoedCell = /*#__PURE__*/React__default.memo(function MemoedCell(props) {
   }
   if (isEditing && isCurrentRow) {
     content = /*#__PURE__*/React__default.createElement(React__default.Fragment, null, content, /*#__PURE__*/React__default.createElement(IconButton, {
-      appearance: "discrete",
+      appearance: "transparent",
       "aria-label": texts.table3.editing.actions.tooltip,
       icon: "more",
       menu: menuProps => /*#__PURE__*/React__default.createElement(Menu, Object.assign({}, menuProps), /*#__PURE__*/React__default.createElement(Menu.Content, null, /*#__PURE__*/React__default.createElement(Menu.Item, {

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/EditingActions.js.map

@@ -1 +1 @@
-{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStateValue } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    isCurrentRow: boolean;\n    isEditing: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { isCurrentRow, isEditing, row, table } = props;\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const savingState = tableMeta.editing.savingStates && tableMeta.editing.savingStates[row.id];\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n    const isRowInEditingState = changeset.indexOf(row.id) >= 0;\n    const { texts } = useLocalization();\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        tableMeta.editing.removeSavingState(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingState && savingState.state === SavingStateValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingState]);\n\n    let content;\n\n    if (savingState) {\n        if (savingState.state === SavingStateValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1.5 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (isEditing && isCurrentRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    appearance=\"discrete\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item\n                                    icon=\"tick\"\n                                    disabled={!isRowInEditingState}\n                                    onClick={() => tableMeta.editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item\n                                    icon=\"close\"\n                                    disabled={!isRowInEditingState}\n                                    onClick={() => tableMeta.editing.resetChange(row.id)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => tableMeta.editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isCurrentRow ? 0 : -1}\n                />\n            </>\n        );\n    }\n\n    return (\n        <DisplayCell {...props} className={cn({ '!sticky': !!content })}>\n            {content ? <span className=\"-mb-2 -mt-2 flex items-center justify-end text-right\">{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...props}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 45;\n\nexport function createRowEditingActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px] [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"true\"]_&]:group-hover/row:shadow-[-6px_0px_6px]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","isCurrentRow","isEditing","row","table","tableMeta","options","meta","savingState","editing","savingStates","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","changeset","changes","Object","keys","isRowInEditingState","indexOf","texts","useLocalization","handleSaved","removeSavingState","timer","useTimer","useEffect","state","SavingStateValue","Saved","start","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","className","complete","Icon","name","IconButton","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","resetChange","clear","toggleEditing","exit","tabIndex","DisplayCell","cn","undefined","Cell","rowIndex","useContext","RowContext","currentRow","currentRowIndex","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size","minSize"],"mappings":"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"}
+{"version":3,"file":"EditingActions.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/EditingActions.tsx"],"sourcesContent":["import React from 'react';\nimport cn from 'classnames';\nimport { CellContext, TableMeta, DisplayColumnDef } from '@tanstack/react-table';\nimport { Spinner } from '../../../../Spinner/Spinner';\nimport { SavingStateValue } from '../../../hooks/features/useEditing';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { Menu } from '../../../../Menu/Menu';\nimport { RowContext } from '../../rows/RowContext';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { Footer } from '../footer/Footer';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport useTimer from '../../../../../utils/hooks/useTimer';\nimport { Icon } from '../../../../Icon/Icon';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\n\nexport type EditingActionsProps<TType = unknown> = CellContext<TType, unknown> & {\n    className?: string;\n    isHovered: boolean;\n};\n\nconst savingIndicatorHideDelay = 3000;\n\nexport const COLUMN_ID = '__editing_actions';\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    isCurrentRow: boolean;\n    isEditing: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { isCurrentRow, isEditing, row, table } = props;\n\n    const tableMeta = table.options.meta as TableMeta<TType>;\n    const savingState = tableMeta.editing.savingStates && tableMeta.editing.savingStates[row.id];\n    const [isSavedIndicatorVisible, setIsSavingIndicatorVisible] = React.useState(false);\n    const changeset = tableMeta.editing.changes ? Object.keys(tableMeta.editing.changes) : [];\n    const isRowInEditingState = changeset.indexOf(row.id) >= 0;\n    const { texts } = useLocalization();\n\n    const handleSaved = () => {\n        setIsSavingIndicatorVisible(false);\n        tableMeta.editing.removeSavingState(row.id);\n    };\n    const timer = useTimer(savingIndicatorHideDelay, handleSaved);\n\n    React.useEffect(() => {\n        if (savingState && savingState.state === SavingStateValue.Saved && !isSavedIndicatorVisible) {\n            setIsSavingIndicatorVisible(true);\n            timer.start();\n        }\n    }, [savingState]);\n\n    let content;\n\n    if (savingState) {\n        if (savingState.state === SavingStateValue.Saving) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.progress}>\n                    <Spinner delay={0} className=\"!text-grey-700 mr-1.5 !h-5 !w-5\" />\n                </Tooltip>\n            );\n        } else if (isSavedIndicatorVisible) {\n            content = (\n                <Tooltip title={texts.table3.editing.saving.complete}>\n                    <Icon name=\"tick\" className=\"!text-grey-700 mr-1\" />\n                </Tooltip>\n            );\n        }\n    }\n\n    if (isEditing && isCurrentRow) {\n        content = (\n            <>\n                {content}\n                <IconButton\n                    appearance=\"transparent\"\n                    aria-label={texts.table3.editing.actions.tooltip}\n                    icon=\"more\"\n                    menu={menuProps => (\n                        <Menu {...menuProps}>\n                            <Menu.Content>\n                                <Menu.Item\n                                    icon=\"tick\"\n                                    disabled={!isRowInEditingState}\n                                    onClick={() => tableMeta.editing.saveChangesIfNeeded()}>\n                                    {texts.table3.editing.actions.save}\n                                </Menu.Item>\n                                <Menu.Item\n                                    icon=\"close\"\n                                    disabled={!isRowInEditingState}\n                                    onClick={() => tableMeta.editing.resetChange(row.id)}>\n                                    {texts.table3.editing.actions.clear}\n                                </Menu.Item>\n                                <Menu.Item icon=\"undo\" onClick={() => tableMeta.editing.toggleEditing(false)}>\n                                    {texts.table3.editing.actions.exit}\n                                </Menu.Item>\n                            </Menu.Content>\n                        </Menu>\n                    )}\n                    tabIndex={isCurrentRow ? 0 : -1}\n                />\n            </>\n        );\n    }\n\n    return (\n        <DisplayCell {...props} className={cn({ '!sticky': !!content })}>\n            {content ? <span className=\"-mb-2 -mt-2 flex items-center justify-end text-right\">{content}</span> : undefined}\n        </DisplayCell>\n    );\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = props.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...props}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isEditing={tableMeta.editing.isEditing}\n        />\n    );\n}\n\nexport const EDITING_ACTIONS_WIDTH = 45;\n\nexport function createRowEditingActionsColumn<TType = unknown>(): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: ColumnHeader,\n        cell: Cell,\n        footer: Footer,\n        meta: {\n            align: 'right',\n            className: cn(\n                'items-center print:opacity-0 [[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:sticky right-0 !pl-0 !pr-1',\n                '[[role=\"table\"][data-editing=\"true\"]_&]:group-[[data-current=\"true\"]]/row:shadow-[-6px_0px_6px] [[role=\"table\"][data-pause-hover=\"false\"][data-editing=\"true\"]_&]:group-hover/row:shadow-[-6px_0px_6px]',\n                'group-[[data-current=\"true\"][data-selected=\"false\"]]/row:text-grey-200',\n                'group-[[data-selected=\"true\"]]/row:text-blue-100',\n                'group-[[data-selected=\"false\"]:hover]/row:text-grey-100'\n            ),\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: EDITING_ACTIONS_WIDTH,\n        minSize: EDITING_ACTIONS_WIDTH,\n    };\n}\n"],"names":["savingIndicatorHideDelay","COLUMN_ID","MemoedCell","React","memo","props","isCurrentRow","isEditing","row","table","tableMeta","options","meta","savingState","editing","savingStates","id","isSavedIndicatorVisible","setIsSavingIndicatorVisible","useState","changeset","changes","Object","keys","isRowInEditingState","indexOf","texts","useLocalization","handleSaved","removeSavingState","timer","useTimer","useEffect","state","SavingStateValue","Saved","start","content","Saving","Tooltip","title","table3","saving","progress","Spinner","delay","className","complete","Icon","name","IconButton","appearance","actions","tooltip","icon","menu","menuProps","Menu","Content","Item","disabled","onClick","saveChangesIfNeeded","save","resetChange","clear","toggleEditing","exit","tabIndex","DisplayCell","cn","undefined","Cell","rowIndex","useContext","RowContext","currentRow","currentRowIndex","EDITING_ACTIONS_WIDTH","createRowEditingActionsColumn","header","ColumnHeader","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size","minSize"],"mappings":";;;;;;;;;;;;;;;AAqBA,MAAMA,wBAAwB,GAAG,IAAI;MAExBC,SAAS,GAAG;AAOzB,MAAMC,UAAU,gBAAGC,cAAK,CAACC,IAAI,CAAC,SAASF,UAAUA,CAAkBG,KAA6B;EAC5F,MAAM;IAAEC,YAAY;IAAEC,SAAS;IAAEC,GAAG;IAAEC;GAAO,GAAGJ,KAAK;EAErD,MAAMK,SAAS,GAAGD,KAAK,CAACE,OAAO,CAACC,IAAwB;EACxD,MAAMC,WAAW,GAAGH,SAAS,CAACI,OAAO,CAACC,YAAY,IAAIL,SAAS,CAACI,OAAO,CAACC,YAAY,CAACP,GAAG,CAACQ,EAAE,CAAC;EAC5F,MAAM,CAACC,uBAAuB,EAAEC,2BAA2B,CAAC,GAAGf,cAAK,CAACgB,QAAQ,CAAC,KAAK,CAAC;EACpF,MAAMC,SAAS,GAAGV,SAAS,CAACI,OAAO,CAACO,OAAO,GAAGC,MAAM,CAACC,IAAI,CAACb,SAAS,CAACI,OAAO,CAACO,OAAO,CAAC,GAAG,EAAE;EACzF,MAAMG,mBAAmB,GAAGJ,SAAS,CAACK,OAAO,CAACjB,GAAG,CAACQ,EAAE,CAAC,IAAI,CAAC;EAC1D,MAAM;IAAEU;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,WAAW,GAAGA;IAChBV,2BAA2B,CAAC,KAAK,CAAC;IAClCR,SAAS,CAACI,OAAO,CAACe,iBAAiB,CAACrB,GAAG,CAACQ,EAAE,CAAC;GAC9C;EACD,MAAMc,KAAK,GAAGC,QAAQ,CAAC/B,wBAAwB,EAAE4B,WAAW,CAAC;EAE7DzB,cAAK,CAAC6B,SAAS,CAAC;IACZ,IAAInB,WAAW,IAAIA,WAAW,CAACoB,KAAK,KAAKC,gBAAgB,CAACC,KAAK,IAAI,CAAClB,uBAAuB,EAAE;MACzFC,2BAA2B,CAAC,IAAI,CAAC;MACjCY,KAAK,CAACM,KAAK,EAAE;;GAEpB,EAAE,CAACvB,WAAW,CAAC,CAAC;EAEjB,IAAIwB,OAAO;EAEX,IAAIxB,WAAW,EAAE;IACb,IAAIA,WAAW,CAACoB,KAAK,KAAKC,gBAAgB,CAACI,MAAM,EAAE;MAC/CD,OAAO,gBACHlC,6BAACoC,OAAO;QAACC,KAAK,EAAEd,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAAC4B,MAAM,CAACC;sBACxCxC,6BAACyC,OAAO;QAACC,KAAK,EAAE,CAAC;QAAEC,SAAS,EAAC;QAAoC,CAExE;KACJ,MAAM,IAAI7B,uBAAuB,EAAE;MAChCoB,OAAO,gBACHlC,6BAACoC,OAAO;QAACC,KAAK,EAAEd,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAAC4B,MAAM,CAACK;sBACxC5C,6BAAC6C,IAAI;QAACC,IAAI,EAAC,MAAM;QAACH,SAAS,EAAC;QAAwB,CAE3D;;;EAIT,IAAIvC,SAAS,IAAID,YAAY,EAAE;IAC3B+B,OAAO,gBACHlC,4DACKkC,OAAO,eACRlC,6BAAC+C,UAAU;MACPC,UAAU,EAAC,aAAa;oBACZzB,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAACsC,OAAO,CAACC,OAAO;MAChDC,IAAI,EAAC,MAAM;MACXC,IAAI,EAAEC,SAAS,iBACXrD,6BAACsD,IAAI,oBAAKD,SAAS,gBACfrD,6BAACsD,IAAI,CAACC,OAAO,qBACTvD,6BAACsD,IAAI,CAACE,IAAI;QACNL,IAAI,EAAC,MAAM;QACXM,QAAQ,EAAE,CAACpC,mBAAmB;QAC9BqC,OAAO,EAAEA,MAAMnD,SAAS,CAACI,OAAO,CAACgD,mBAAmB;SACnDpC,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAACsC,OAAO,CAACW,IAAI,CAC1B,eACZ5D,6BAACsD,IAAI,CAACE,IAAI;QACNL,IAAI,EAAC,OAAO;QACZM,QAAQ,EAAE,CAACpC,mBAAmB;QAC9BqC,OAAO,EAAEA,MAAMnD,SAAS,CAACI,OAAO,CAACkD,WAAW,CAACxD,GAAG,CAACQ,EAAE;SAClDU,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAACsC,OAAO,CAACa,KAAK,CAC3B,eACZ9D,6BAACsD,IAAI,CAACE,IAAI;QAACL,IAAI,EAAC,MAAM;QAACO,OAAO,EAAEA,MAAMnD,SAAS,CAACI,OAAO,CAACoD,aAAa,CAAC,KAAK;SACtExC,KAAK,CAACe,MAAM,CAAC3B,OAAO,CAACsC,OAAO,CAACe,IAAI,CAC1B,CACD,CAEtB;MACDC,QAAQ,EAAE9D,YAAY,GAAG,CAAC,GAAG,CAAC;MAChC,CAET;;EAGL,oBACIH,6BAACkE,WAAW,oBAAKhE,KAAK;IAAEyC,SAAS,EAAEwB,EAAE,CAAC;MAAE,SAAS,EAAE,CAAC,CAACjC;KAAS;MACzDA,OAAO,gBAAGlC;IAAM2C,SAAS,EAAC;KAAwDT,OAAO,CAAQ,GAAGkC,SAAS,CACpG;AAEtB,CAAC,CAAoE;AAIrE,SAASC,IAAIA,CAAkBnE,KAAuB;EAClD,MAAM;IAAEoE;GAAU,GAAGtE,cAAK,CAACuE,UAAU,CAACC,UAAU,CAAC;EACjD,MAAMjE,SAAS,GAAGL,KAAK,CAACI,KAAK,CAACE,OAAO,CAACC,IAAwB;EAE9D,oBACIT,6BAACD,UAAU,oBACHG,KAAK;IACTC,YAAY,EAAEI,SAAS,CAACkE,UAAU,CAACC,eAAe,KAAKJ,QAAQ;IAC/DlE,SAAS,EAAEG,SAAS,CAACI,OAAO,CAACP;KAC/B;AAEV;MAEauE,qBAAqB,GAAG;SAErBC,6BAA6BA;EACzC,OAAO;IACH/D,EAAE,EAAEf,SAAS;IACb+E,MAAM,EAAEC,MAAY;IACpBC,IAAI,EAAEV,IAAI;IACVW,MAAM,EAAEC,MAAM;IACdxE,IAAI,EAAE;MACFyE,KAAK,EAAE,OAAO;MACdvC,SAAS,EAAEwB,EAAE,CACT,mIAAmI,EACnI,yMAAyM,EACzM,wEAAwE,EACxE,kDAAkD,EAClD,yDAAyD,CAC5D;MACDgB,cAAc,EAAE,KAAK;MACrBC,YAAY,EAAE,KAAK;MACnBC,cAAc,EAAE,KAAK;MACrBR,MAAM,EAAE,EAAE;MACVS,eAAe,EAAE;KACpB;;IAEDC,cAAc,EAAE,KAAK;IACrBC,IAAI,EAAEb,qBAAqB;IAC3Bc,OAAO,EAAEd;GACZ;AACL;;;;"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Expansion.js

@@ -21,7 +21,7 @@ function Header(context) {
   return /*#__PURE__*/React__default.createElement(Header$1, Object.assign({}, context), /*#__PURE__*/React__default.createElement(Tooltip, {
     title: title
   }, /*#__PURE__*/React__default.createElement(IconButton, {
-    appearance: "discrete",
+    appearance: "transparent",
     icon: isSomeRowsExpanded ? 'chevron-down-double' : 'chevron-right-double',
     onClick: handleClick,
     tabIndex: -1,
@@ -87,7 +87,7 @@ function createRowExpansionColumn(expandedRowRenderer) {
     footer: Footer,
     meta: {
       align: 'center',
-      className: '!p-0 !pt-[var(--table3-row-padding)]',
+      className: '!p-0 !pt-[var(--table3-cell-padding-y)]',
       enableOrdering: false,
       enableSearch: false,
       enableTruncate: false,

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Expansion.js.map

@@ -1 +1 @@
-{"version":3,"file":"Expansion.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Expansion.tsx"],"sourcesContent":["import React from 'react';\nimport { HeaderContext, CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Table3RowExpansionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__expansion';\n\nfunction Header<TType = unknown>(context: HeaderContext<TType, unknown>) {\n    const { texts } = useLocalization();\n\n    const isSomeRowsExpanded = context.table.getIsSomeRowsExpanded();\n    const handleClick = event => {\n        event.stopPropagation();\n        context.table.toggleAllRowsExpanded(!isSomeRowsExpanded);\n    };\n\n    const title = isSomeRowsExpanded ? texts.table3.columns.expansion.collapseAll : texts.table3.columns.expansion.expandAll;\n\n    return (\n        <ColumnHeader {...context}>\n            <Tooltip title={title}>\n                <IconButton\n                    appearance=\"discrete\"\n                    icon={isSomeRowsExpanded ? 'chevron-down-double' : 'chevron-right-double'}\n                    onClick={handleClick}\n                    tabIndex={-1}\n                    title={title}\n                />\n            </Tooltip>\n        </ColumnHeader>\n    );\n}\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>;\n    isCurrentRow: boolean;\n    isExpanded: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { expandedRowRenderer, isCurrentRow, isExpanded, row, table } = props;\n    const { texts } = useLocalization();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const hasExpandedRow = expandedRowRenderer(row.original);\n\n    let content;\n\n    if (hasExpandedRow) {\n        const handleClick = event => {\n            event.stopPropagation();\n            row.toggleExpanded();\n        };\n        const title = isExpanded ? texts.table3.columns.expansion.collapse : texts.table3.columns.expansion.expand;\n\n        const tabIndex = isCurrentRow && !tableMeta.editing.isEditing ? 0 : -1;\n\n        content = (\n            <Tooltip title={title}>\n                <IconButton\n                    appearance=\"discrete\"\n                    className=\"-mt-1.5\"\n                    icon={isExpanded ? 'chevron-down' : 'chevron-right'}\n                    onClick={handleClick}\n                    tabIndex={tabIndex}\n                    title={title}\n                />\n            </Tooltip>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>;\n};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { expandedRowRenderer, ...context } = props;\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...context}\n            expandedRowRenderer={expandedRowRenderer}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isExpanded={context.row.getIsExpanded()}\n        />\n    );\n}\n\nexport function createRowExpansionColumn<TType = unknown>(\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>\n): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: Header,\n        cell: (context: CellContext<TType, unknown>) => <Cell {...context} expandedRowRenderer={expandedRowRenderer} />,\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: '!p-0 !pt-[var(--table3-row-padding)]',\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: 40,\n    };\n}\n"],"names":["COLUMN_ID","Header","context","texts","useLocalization","isSomeRowsExpanded","table","getIsSomeRowsExpanded","handleClick","event","stopPropagation","toggleAllRowsExpanded","title","table3","columns","expansion","collapseAll","expandAll","React","ColumnHeader","Tooltip","IconButton","appearance","icon","onClick","tabIndex","MemoedCell","memo","props","expandedRowRenderer","isCurrentRow","isExpanded","row","tableMeta","options","meta","hasExpandedRow","original","content","toggleExpanded","collapse","expand","editing","isEditing","className","DisplayCell","Cell","rowIndex","useContext","RowContext","currentRow","currentRowIndex","getIsExpanded","createRowExpansionColumn","id","header","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size"],"mappings":";;;;;;;;;MAWaA,SAAS,GAAG;AAEzB,SAASC,MAAMA,CAAkBC,OAAsC;EACnE,MAAM;IAAEC;GAAO,GAAGC,eAAe,EAAE;EAEnC,MAAMC,kBAAkB,GAAGH,OAAO,CAACI,KAAK,CAACC,qBAAqB,EAAE;EAChE,MAAMC,WAAW,GAAGC,KAAK;IACrBA,KAAK,CAACC,eAAe,EAAE;IACvBR,OAAO,CAACI,KAAK,CAACK,qBAAqB,CAAC,CAACN,kBAAkB,CAAC;GAC3D;EAED,MAAMO,KAAK,GAAGP,kBAAkB,GAAGF,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,SAAS,CAACC,WAAW,GAAGb,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,SAAS,CAACE,SAAS;EAExH,oBACIC,6BAACC,QAAY,oBAAKjB,OAAO,gBACrBgB,6BAACE,OAAO;IAACR,KAAK,EAAEA;kBACZM,6BAACG,UAAU;IACPC,UAAU,EAAC,UAAU;IACrBC,IAAI,EAAElB,kBAAkB,GAAG,qBAAqB,GAAG,sBAAsB;IACzEmB,OAAO,EAAEhB,WAAW;IACpBiB,QAAQ,EAAE,CAAC,CAAC;IACZb,KAAK,EAAEA;IACT,CACI,CACC;AAEvB;AAQA,MAAMc,UAAU,gBAAGR,cAAK,CAACS,IAAI,CAAC,SAASD,UAAUA,CAAkBE,KAA6B;EAC5F,MAAM;IAAEC,mBAAmB;IAAEC,YAAY;IAAEC,UAAU;IAAEC,GAAG;IAAE1B;GAAO,GAAGsB,KAAK;EAC3E,MAAM;IAAEzB;GAAO,GAAGC,eAAe,EAAE;EACnC,MAAM6B,SAAS,GAAG3B,KAAK,CAAC4B,OAAO,CAACC,IAAwB;EAExD,MAAMC,cAAc,GAAGP,mBAAmB,CAACG,GAAG,CAACK,QAAQ,CAAC;EAExD,IAAIC,OAAO;EAEX,IAAIF,cAAc,EAAE;IAChB,MAAM5B,WAAW,GAAGC,KAAK;MACrBA,KAAK,CAACC,eAAe,EAAE;MACvBsB,GAAG,CAACO,cAAc,EAAE;KACvB;IACD,MAAM3B,KAAK,GAAGmB,UAAU,GAAG5B,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,SAAS,CAACyB,QAAQ,GAAGrC,KAAK,CAACU,MAAM,CAACC,OAAO,CAACC,SAAS,CAAC0B,MAAM;IAE1G,MAAMhB,QAAQ,GAAGK,YAAY,IAAI,CAACG,SAAS,CAACS,OAAO,CAACC,SAAS,GAAG,CAAC,GAAG,CAAC,CAAC;IAEtEL,OAAO,gBACHpB,6BAACE,OAAO;MAACR,KAAK,EAAEA;oBACZM,6BAACG,UAAU;MACPC,UAAU,EAAC,UAAU;MACrBsB,SAAS,EAAC,SAAS;MACnBrB,IAAI,EAAEQ,UAAU,GAAG,cAAc,GAAG,eAAe;MACnDP,OAAO,EAAEhB,WAAW;MACpBiB,QAAQ,EAAEA,QAAQ;MAClBb,KAAK,EAAEA;MACT,CAET;;EAGL,oBAAOM,6BAAC2B,WAAW,oBAAKjB,KAAK,GAAGU,OAAO,CAAe;AAC1D,CAAC,CAAoE;AAMrE,SAASQ,IAAIA,CAAkBlB,KAAuB;EAClD,MAAM;IAAEC,mBAAmB;IAAE,GAAG3B;GAAS,GAAG0B,KAAK;EACjD,MAAM;IAAEmB;GAAU,GAAG7B,cAAK,CAAC8B,UAAU,CAACC,UAAU,CAAC;EACjD,MAAMhB,SAAS,GAAG/B,OAAO,CAACI,KAAK,CAAC4B,OAAO,CAACC,IAAwB;EAEhE,oBACIjB,6BAACQ,UAAU,oBACHxB,OAAO;IACX2B,mBAAmB,EAAEA,mBAAmB;IACxCC,YAAY,EAAEG,SAAS,CAACiB,UAAU,CAACC,eAAe,KAAKJ,QAAQ;IAC/DhB,UAAU,EAAE7B,OAAO,CAAC8B,GAAG,CAACoB,aAAa;KACvC;AAEV;SAEgBC,wBAAwBA,CACpCxB,mBAAsD;EAEtD,OAAO;IACHyB,EAAE,EAAEtD,SAAS;IACbuD,MAAM,EAAEtD,MAAM;IACduD,IAAI,EAAGtD,OAAoC,iBAAKgB,6BAAC4B,IAAI,oBAAK5C,OAAO;MAAE2B,mBAAmB,EAAEA;OAAuB;IAC/G4B,MAAM,EAAEC,MAAM;IACdvB,IAAI,EAAE;MACFwB,KAAK,EAAE,QAAQ;MACff,SAAS,EAAE,sCAAsC;MACjDgB,cAAc,EAAE,KAAK;MACrBC,YAAY,EAAE,KAAK;MACnBC,cAAc,EAAE,KAAK;MACrBP,MAAM,EAAE,EAAE;MACVQ,eAAe,EAAE;KACpB;;IAEDC,cAAc,EAAE,KAAK;IACrBC,IAAI,EAAE;GACT;AACL;;;;"}
+{"version":3,"file":"Expansion.js","sources":["../../../../../../../../../../src/components/Table3/components/columns/internal/Expansion.tsx"],"sourcesContent":["import React from 'react';\nimport { HeaderContext, CellContext, DisplayColumnDef, TableMeta } from '@tanstack/react-table';\nimport { Header as ColumnHeader } from '../header/Header';\nimport { DisplayCell } from '../cell/DisplayCell';\nimport { Tooltip } from '../../../../Tooltip/Tooltip';\nimport { IconButton } from '../../../../IconButton/IconButton';\nimport { useLocalization } from '../../../../Provider/Localization';\nimport { Table3RowExpansionRenderer } from '../../../types';\nimport { RowContext } from '../../rows/RowContext';\nimport { Footer } from '../footer/Footer';\n\nexport const COLUMN_ID = '__expansion';\n\nfunction Header<TType = unknown>(context: HeaderContext<TType, unknown>) {\n    const { texts } = useLocalization();\n\n    const isSomeRowsExpanded = context.table.getIsSomeRowsExpanded();\n    const handleClick = event => {\n        event.stopPropagation();\n        context.table.toggleAllRowsExpanded(!isSomeRowsExpanded);\n    };\n\n    const title = isSomeRowsExpanded ? texts.table3.columns.expansion.collapseAll : texts.table3.columns.expansion.expandAll;\n\n    return (\n        <ColumnHeader {...context}>\n            <Tooltip title={title}>\n                <IconButton\n                    appearance=\"transparent\"\n                    icon={isSomeRowsExpanded ? 'chevron-down-double' : 'chevron-right-double'}\n                    onClick={handleClick}\n                    tabIndex={-1}\n                    title={title}\n                />\n            </Tooltip>\n        </ColumnHeader>\n    );\n}\n\ntype MemoedCellProps<TType = unknown> = CellContext<TType, unknown> & {\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>;\n    isCurrentRow: boolean;\n    isExpanded: boolean;\n};\n\nconst MemoedCell = React.memo(function MemoedCell<TType = unknown>(props: MemoedCellProps<TType>) {\n    const { expandedRowRenderer, isCurrentRow, isExpanded, row, table } = props;\n    const { texts } = useLocalization();\n    const tableMeta = table.options.meta as TableMeta<TType>;\n\n    const hasExpandedRow = expandedRowRenderer(row.original);\n\n    let content;\n\n    if (hasExpandedRow) {\n        const handleClick = event => {\n            event.stopPropagation();\n            row.toggleExpanded();\n        };\n        const title = isExpanded ? texts.table3.columns.expansion.collapse : texts.table3.columns.expansion.expand;\n\n        const tabIndex = isCurrentRow && !tableMeta.editing.isEditing ? 0 : -1;\n\n        content = (\n            <Tooltip title={title}>\n                <IconButton\n                    appearance=\"discrete\"\n                    className=\"-mt-1.5\"\n                    icon={isExpanded ? 'chevron-down' : 'chevron-right'}\n                    onClick={handleClick}\n                    tabIndex={tabIndex}\n                    title={title}\n                />\n            </Tooltip>\n        );\n    }\n\n    return <DisplayCell {...props}>{content}</DisplayCell>;\n}) as <TType = unknown>(props: MemoedCellProps<TType>) => JSX.Element;\n\ntype CellProps<TType = unknown> = CellContext<TType, unknown> & {\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>;\n};\n\nfunction Cell<TType = unknown>(props: CellProps<TType>) {\n    const { expandedRowRenderer, ...context } = props;\n    const { rowIndex } = React.useContext(RowContext);\n    const tableMeta = context.table.options.meta as TableMeta<TType>;\n\n    return (\n        <MemoedCell\n            {...context}\n            expandedRowRenderer={expandedRowRenderer}\n            isCurrentRow={tableMeta.currentRow.currentRowIndex === rowIndex}\n            isExpanded={context.row.getIsExpanded()}\n        />\n    );\n}\n\nexport function createRowExpansionColumn<TType = unknown>(\n    expandedRowRenderer: Table3RowExpansionRenderer<TType>\n): DisplayColumnDef<TType, unknown> {\n    return {\n        id: COLUMN_ID,\n        header: Header,\n        cell: (context: CellContext<TType, unknown>) => <Cell {...context} expandedRowRenderer={expandedRowRenderer} />,\n        footer: Footer,\n        meta: {\n            align: 'center',\n            className: '!p-0 !pt-[var(--table3-cell-padding-y)]',\n            enableOrdering: false,\n            enableSearch: false,\n            enableTruncate: false,\n            header: '',\n            headerClassName: 'items-center !p-0',\n        },\n        // options\n        enableResizing: false,\n        size: 40,\n    };\n}\n"],"names":["COLUMN_ID","Header","context","texts","useLocalization","isSomeRowsExpanded","table","getIsSomeRowsExpanded","handleClick","event","stopPropagation","toggleAllRowsExpanded","title","table3","columns","expansion","collapseAll","expandAll","React","ColumnHeader","Tooltip","IconButton","appearance","icon","onClick","tabIndex","MemoedCell","memo","props","expandedRowRenderer","isCurrentRow","isExpanded","row","tableMeta","options","meta","hasExpandedRow","original","content","toggleExpanded","collapse","expand","editing","isEditing","className","DisplayCell","Cell","rowIndex","useContext","RowContext","currentRow","currentRowIndex","getIsExpanded","createRowExpansionColumn","id","header","cell","footer","Footer","align","enableOrdering","enableSearch","enableTruncate","headerClassName","enableResizing","size"],"mappings":"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"}

package/dist/esm/packages/taco/src/components/Table3/components/columns/internal/Selection.js

@@ -111,7 +111,7 @@ function createRowSelectionColumn(hasDrag, hasExpansion) {
     footer: Footer,
     meta: {
       align: 'center',
-      className: cn('!pt-[var(--table3-row-padding)] !justify-end !p-0', {
+      className: cn('!pt-[var(--table3-cell-padding-y)] !justify-end !p-0', {
         '!pr-0.5': hasExpansion,
         '!pr-3': !hasExpansion
       }),