@webiny/admin-ui 6.1.0-beta.3 → 6.2.0-beta.0

package/DataTable/DataTable.d.ts

@@ -4,6 +4,7 @@ interface DataTableColumn<T> {
     header?: string | number | React.JSX.Element;
     cell?: (row: T) => string | number | React.JSX.Element | null;
     size?: number;
+    truncate?: boolean;
     className?: string;
     enableSorting?: boolean;
     enableResizing?: boolean;

package/DataTable/DataTable.js

@@ -26,6 +26,7 @@ const defineColumns = (columns, options) => {
         enableResizing = true,
         enableSorting = false,
         header,
+        truncate = true,
         id,
         size = 100
       } = column;
@@ -46,7 +47,8 @@ const defineColumns = (columns, options) => {
         },
         enableSorting,
         meta: {
-          className
+          className,
+          truncate
         },
         enableResizing,
         size,
@@ -275,11 +277,14 @@ const DecoratableDataTable = ({
       onClick: header.column.getToggleSortingHandler(),
       sortable: header.column.getCanSort()
     }, /*#__PURE__*/React.createElement("div", {
-      className: "w-full overflow-hidden whitespace-nowrap truncate"
+      className: cn({
+        "w-full overflow-hidden whitespace-nowrap": true,
+        truncate: !isLastCell
+      })
     }, flexRender(header.column.columnDef.header, header.getContext())), /*#__PURE__*/React.createElement(Table.Direction, {
       direction: header.column.getIsSorted() || null
     }), isLastCell && /*#__PURE__*/React.createElement("div", {
-      className: "mr-xs h-md"
+      className: "h-md"
     }, /*#__PURE__*/React.createElement(ColumnsVisibility, {
       columns: table.getAllColumns()
     }))), header.column.getCanResize() && /*#__PURE__*/React.createElement(Table.Resizer, {

package/DataTable/DataTable.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","memo","useCallback","useEffect","useMemo","useRef","useState","flexRender","getCoreRowModel","getSortedRowModel","useReactTable","CheckboxPrimitive","Skeleton","Table","ColumnSorter","ColumnsVisibility","cn","makeDecoratable","defineColumns","columns","options","canSelectAllRows","onSelectRow","onToggleRow","loading","columnsList","Object","keys","map","key","id","defaults","column","accessorKey","cell","className","enableHiding","enableResizing","enableSorting","header","size","props","row","original","getValue","String","meta","columnsDefs","firstColumn","isSelectable","createElement","indeterminate","table","getIsSomeRowsSelected","checked","getIsAllRowsSelected","onChange","toggleAllPageRowsSelected","disabled","onClick","e","stopPropagation","getIsSelected","value","toggleSelected","getCanSelect","slice","type","typedMemo","TableCell","getColumnWidth","width","Cell","assign","columnDef","style","maxWidth","getContext","MemoTableCell","TableRow","selected","cells","Row","MemoTableRow","emptyArray","Array","fill","DecoratableDataTable","bordered","columnVisibility","initialColumns","data","initialData","initialSorting","isRowSelectable","onColumnVisibilityChange","onSortingChange","selectedRows","sorting","stickyHeader","tableRef","tableWidth","setTableWidth","updateElementWidth","current","clientWidth","window","addEventListener","removeEventListener","rowSelection","reduce","acc","item","recordIndex","findIndex","rec","onRowSelectionChange","updater","newSelection","toggledRows","filter","x","length","parseInt","selection","tableSorting","isArray","columnResizeMode","enableColumnResizing","enableRowSelection","enableSortingRemoval","manualSorting","state","getCanResize","getSize","tableSize","getTotalSize","columnSize","Math","ceil","tableRows","getRowModel","rows","ref","sticky","Header","getHeaderGroups","headerGroup","headers","index","isLastCell","Head","colSpan","isPlaceholder","getToggleSortingHandler","sortable","getCanSort","Direction","direction","getIsSorted","getAllColumns","Resizer","onMouseDown","getResizeHandler","onTouchStart","isResizing","getIsResizing","Body","getVisibleCells","DataTable"],"sources":["DataTable.tsx"],"sourcesContent":["import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type {\n    Cell,\n    Column,\n    ColumnDef,\n    ColumnSort,\n    OnChangeFn,\n    Row,\n    RowSelectionState,\n    SortingState,\n    VisibilityState\n} from \"@tanstack/react-table\";\nimport {\n    flexRender,\n    getCoreRowModel,\n    getSortedRowModel,\n    useReactTable\n} from \"@tanstack/react-table\";\nimport { CheckboxPrimitive } from \"~/Checkbox/index.js\";\nimport { Skeleton } from \"~/Skeleton/index.js\";\nimport { Table } from \"~/Table/index.js\";\nimport { ColumnSorter, ColumnsVisibility } from \"./components/index.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ninterface DataTableColumn<T> {\n    /*\n     * Column header component.\n     */\n    header?: string | number | React.JSX.Element;\n    /*\n     * Cell renderer, receives the full row and returns the value to render inside the cell.\n     */\n    cell?: (row: T) => string | number | React.JSX.Element | null;\n    /*\n     * Column size.\n     */\n    size?: number;\n    /*\n     * Column class names.\n     */\n    className?: string;\n    /*\n     * Enable column sorting.\n     */\n    enableSorting?: boolean;\n    /*\n     * Enable column resizing.\n     */\n    enableResizing?: boolean;\n    /*\n     * Enable column visibility toggling.\n     */\n    enableHiding?: boolean;\n    /*\n     * Accessor key for the column data path.\n     */\n    accessorKey?: string;\n}\n\ntype DataTableColumns<T> = {\n    [P in keyof T]?: DataTableColumn<T>;\n};\n\ntype DataTableDefaultData = {\n    id: string;\n    /*\n     * Define if a specific row can be selected.\n     */\n    $selectable?: boolean;\n};\n\ntype DataTableRow<T> = Row<DataTableDefaultData & T>;\n\ntype DataTableSorting = SortingState;\n\ntype DataTableColumnSort = ColumnSort;\n\ntype OnDataTableSortingChange = OnChangeFn<DataTableSorting>;\n\ntype DataTableColumnVisibility = VisibilityState;\n\ntype OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;\n\ninterface DataTableProps<TEntry> {\n    /**\n     * Show or hide borders.\n     */\n    bordered?: boolean;\n    /**\n     * Controls whether \"select all\" action is allowed.\n     */\n    canSelectAllRows?: boolean;\n    /**\n     * Columns definition.\n     */\n    columns: DataTableColumns<TEntry>;\n    /**\n     * The column visibility state.\n     */\n    columnVisibility?: DataTableColumnVisibility;\n    /**\n     * Callback that receives current column visibility state.\n     */\n    onColumnVisibilityChange?: OnDataTableColumnVisibilityChange;\n    /**\n     * Data to display into DataTable body.\n     */\n    data: TEntry[];\n    /**\n     * Callback that is called to determine if the row is selectable.\n     */\n    isRowSelectable?: (row: Row<TEntry>) => boolean;\n    /**\n     * Render the skeleton state while data are loading.\n     */\n    loading?: boolean;\n    /**\n     * Callback that receives the selected rows.\n     */\n    onSelectRow?: (rows: TEntry[]) => void;\n    /**\n     * Callback that receives the toggled row.\n     */\n    onToggleRow?: (row: TEntry) => void;\n    /**\n     * Callback that receives current sorting state.\n     */\n    onSortingChange?: OnDataTableSortingChange;\n    /**\n     * Selected rows.\n     */\n    selectedRows?: TEntry[];\n    /**\n     * Sorting state.\n     */\n    sorting?: DataTableSorting;\n    /**\n     * Initial sorting state.\n     */\n    initialSorting?: DataTableSorting;\n    /**\n     * Enable sticky header.\n     */\n    stickyHeader?: boolean;\n}\n\ninterface DefineColumnsOptions<TEntry> {\n    canSelectAllRows: boolean;\n    onSelectRow?: DataTableProps<TEntry>[\"onSelectRow\"];\n    onToggleRow: DataTableProps<TEntry>[\"onToggleRow\"];\n    loading: DataTableProps<TEntry>[\"loading\"];\n}\n\nconst defineColumns = <T,>(\n    columns: DataTableProps<T>[\"columns\"],\n    options: DefineColumnsOptions<T>\n): ColumnDef<T>[] => {\n    const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;\n\n    return useMemo(() => {\n        const columnsList = Object.keys(columns).map(key => ({\n            id: key,\n            ...columns[key as keyof typeof columns]\n        }));\n\n        const defaults: ColumnDef<T>[] = columnsList.map(column => {\n            const {\n                accessorKey,\n                cell,\n                className,\n                enableHiding = true,\n                enableResizing = true,\n                enableSorting = false,\n                header,\n                id,\n                size = 100\n            } = column;\n\n            return {\n                id,\n                accessorKey: accessorKey || id,\n                header: () => header,\n                cell: props => {\n                    if (cell && typeof cell === \"function\") {\n                        return cell(props.row.original);\n                    } else {\n                        // Automatically convert any cell value to a string for rendering,\n                        // ensuring the table displays values correctly. This aligns with React's\n                        // rendering, which expects JSX, strings or null.\n                        // https://github.com/TanStack/table/issues/1042\n                        return props.getValue() ? String(props.getValue()) : null;\n                    }\n                },\n                enableSorting,\n                meta: {\n                    className\n                },\n                enableResizing,\n                size,\n                enableHiding\n            };\n        });\n\n        let columnsDefs = defaults;\n        const firstColumn = defaults[0];\n        const isSelectable = onToggleRow || onSelectRow;\n\n        if (isSelectable && firstColumn) {\n            columnsDefs = [\n                {\n                    ...firstColumn,\n                    accessorKey: firstColumn.id as string,\n                    header: props => {\n                        if (!props) {\n                            return null;\n                        }\n\n                        return (\n                            <div className={\"flex items-center gap-xl\"}>\n                                <CheckboxPrimitive\n                                    indeterminate={props.table.getIsSomeRowsSelected()}\n                                    checked={props.table.getIsAllRowsSelected()}\n                                    onChange={props.table.toggleAllPageRowsSelected}\n                                    aria-label=\"Select all\"\n                                    disabled={!canSelectAllRows}\n                                    onClick={e => e.stopPropagation()}\n                                />\n                                {firstColumn.header\n                                    ? React.createElement(firstColumn.header, props)\n                                    : null}\n                            </div>\n                        );\n                    },\n                    cell: props => {\n                        if (!props) {\n                            return null;\n                        }\n                        return (\n                            <div className={\"flex items-center gap-xl\"}>\n                                <CheckboxPrimitive\n                                    checked={props.row.getIsSelected()}\n                                    onChange={value => props.row.toggleSelected(!!value)}\n                                    disabled={!props.row.getCanSelect()}\n                                    aria-label=\"Select row\"\n                                    className={cn(!props.row.getCanSelect() ? \"invisible\" : \"\")}\n                                />\n                                {firstColumn.cell\n                                    ? React.createElement(firstColumn.cell, props)\n                                    : null}\n                            </div>\n                        );\n                    }\n                },\n                ...defaults.slice(1)\n            ];\n        }\n\n        return columnsDefs.map(column => {\n            if (loading) {\n                return {\n                    ...column,\n                    cell: () => <Skeleton type={\"text\"} size={\"md\"} />\n                };\n            }\n\n            return column;\n        });\n    }, [columns, onSelectRow, onToggleRow, loading]);\n};\n\nconst typedMemo: <T>(component: T) => T = memo;\n\ninterface TableCellProps<T> {\n    cell: Cell<T, unknown>;\n    getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableCell = <T,>({ cell, getColumnWidth }: TableCellProps<T>) => {\n    const width = getColumnWidth(cell.column);\n\n    return (\n        <Table.Cell {...cell.column.columnDef.meta} style={{ width, maxWidth: width }}>\n            {flexRender(cell.column.columnDef.cell, cell.getContext())}\n        </Table.Cell>\n    );\n};\n\nconst MemoTableCell = typedMemo(TableCell);\n\ninterface TableRowProps<T> {\n    selected: boolean;\n    cells: Cell<T, unknown>[];\n    getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableRow = <T,>({ selected, cells, getColumnWidth }: TableRowProps<T>) => {\n    return (\n        <Table.Row selected={selected}>\n            {cells.map(cell => (\n                <MemoTableCell<T> key={cell.id} cell={cell} getColumnWidth={getColumnWidth} />\n            ))}\n        </Table.Row>\n    );\n};\n\nconst MemoTableRow = typedMemo(TableRow);\n\n/**\n * Empty array must be defined outside the React component so it does not force rerendering of the DataTable\n */\nconst emptyArray = Array(10).fill({});\n\nconst DecoratableDataTable = <T extends Record<string, any> & DataTableDefaultData>({\n    bordered,\n    canSelectAllRows = true,\n    columnVisibility,\n    columns: initialColumns,\n    data: initialData,\n    initialSorting,\n    isRowSelectable,\n    loading,\n    onColumnVisibilityChange,\n    onSelectRow,\n    onSortingChange,\n    onToggleRow,\n    selectedRows = [],\n    sorting,\n    stickyHeader\n}: DataTableProps<T>) => {\n    const tableRef = useRef<HTMLDivElement>(null);\n    const [tableWidth, setTableWidth] = useState(1);\n\n    const data = loading ? emptyArray : initialData;\n\n    useEffect(() => {\n        const updateElementWidth = () => {\n            if (tableRef.current) {\n                const width = tableRef.current.clientWidth;\n                setTableWidth(width);\n            }\n        };\n\n        updateElementWidth();\n\n        window.addEventListener(\"resize\", updateElementWidth);\n\n        return () => {\n            window.removeEventListener(\"resize\", updateElementWidth);\n        };\n    }, [tableRef.current]);\n\n    const rowSelection = useMemo(() => {\n        return selectedRows.reduce<RowSelectionState>((acc, item) => {\n            const recordIndex = data.findIndex(rec => rec.id === item.id);\n            return { ...acc, [recordIndex]: true };\n        }, {});\n    }, [selectedRows, data]);\n\n    const onRowSelectionChange: OnChangeFn<RowSelectionState> = updater => {\n        const newSelection = typeof updater === \"function\" ? updater(rowSelection) : updater;\n\n        /**\n         * `@tanstack/react-table` isn't telling us what row was selected or deselected. It simply gives us\n         * the new selection state (an object with row indexes that are currently selected).\n         *\n         * To figure out what row was toggled, we need to calculate the difference between the old selection\n         * and the new selection. What we're doing here is:\n         * - find all items that were present in the previous selection, but are no longer present in the new selection\n         * - find all items that are present in the new selection, but were not present in the previous selection\n         */\n        const toggledRows = [\n            ...Object.keys(rowSelection).filter(x => !(x in newSelection)),\n            ...Object.keys(newSelection).filter(x => !(x in rowSelection))\n        ];\n\n        // If the difference is only 1 item, and `onToggleRow` is available, execute that.\n        if (toggledRows.length === 1 && typeof onToggleRow === \"function\") {\n            onToggleRow(data[parseInt(toggledRows[0])]);\n            return;\n        } else if (typeof onSelectRow === \"function\") {\n            const selection = Object.keys(newSelection).map(key => data[parseInt(key)]);\n            onSelectRow(selection);\n        }\n    };\n\n    const tableSorting = useMemo(() => {\n        if (!Array.isArray(sorting) || !sorting.length) {\n            return initialSorting;\n        }\n        return sorting;\n    }, [sorting]);\n\n    const columns = defineColumns(initialColumns, {\n        canSelectAllRows,\n        onSelectRow,\n        onToggleRow,\n        loading\n    });\n\n    const table = useReactTable<T>({\n        columnResizeMode: \"onChange\",\n        columns,\n        data,\n        enableColumnResizing: true,\n        enableHiding: !!onColumnVisibilityChange,\n        enableRowSelection: isRowSelectable,\n        enableSorting: !!onSortingChange,\n        enableSortingRemoval: false,\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n        manualSorting: true,\n        onColumnVisibilityChange,\n        onRowSelectionChange,\n        onSortingChange,\n        state: {\n            columnVisibility,\n            rowSelection,\n            sorting: tableSorting\n        }\n    });\n\n    const getColumnWidth = useCallback(\n        (column: Column<T>): number => {\n            if (!column.getCanResize()) {\n                return column.getSize();\n            }\n\n            const tableSize = table.getTotalSize();\n            const columnSize = column.getSize();\n\n            return Math.ceil((columnSize * tableWidth) / tableSize);\n        },\n        [table, tableWidth]\n    );\n\n    /**\n     * Had to memoize the rows to avoid browser freeze.\n     */\n    const tableRows = useMemo(() => {\n        return table.getRowModel().rows;\n    }, [table, data, columns]);\n\n    return (\n        <div ref={tableRef}>\n            <Table bordered={bordered} sticky={stickyHeader}>\n                <Table.Header sticky={stickyHeader}>\n                    {table.getHeaderGroups().map(headerGroup => (\n                        <Table.Row key={headerGroup.id}>\n                            {headerGroup.headers.map((header, index) => {\n                                const isLastCell = index === headerGroup.headers.length - 1;\n                                const width = getColumnWidth(header.column);\n\n                                return (\n                                    <Table.Head\n                                        key={header.id}\n                                        {...header.column.columnDef.meta}\n                                        colSpan={header.colSpan}\n                                        style={{ width, maxWidth: width }}\n                                    >\n                                        {header.isPlaceholder ? null : (\n                                            <ColumnSorter\n                                                onClick={header.column.getToggleSortingHandler()}\n                                                sortable={header.column.getCanSort()}\n                                            >\n                                                <div className=\"w-full overflow-hidden whitespace-nowrap truncate\">\n                                                    {flexRender(\n                                                        header.column.columnDef.header,\n                                                        header.getContext()\n                                                    )}\n                                                </div>\n                                                <Table.Direction\n                                                    direction={header.column.getIsSorted() || null}\n                                                />\n                                                {isLastCell && (\n                                                    <div className={\"mr-xs h-md\"}>\n                                                        <ColumnsVisibility\n                                                            columns={table.getAllColumns()}\n                                                        />\n                                                    </div>\n                                                )}\n                                            </ColumnSorter>\n                                        )}\n                                        {header.column.getCanResize() && (\n                                            <Table.Resizer\n                                                onMouseDown={header.getResizeHandler()}\n                                                onTouchStart={header.getResizeHandler()}\n                                                isResizing={header.column.getIsResizing()}\n                                            />\n                                        )}\n                                    </Table.Head>\n                                );\n                            })}\n                        </Table.Row>\n                    ))}\n                </Table.Header>\n                <Table.Body>\n                    {tableRows.map(row => {\n                        const id = row.original.id || row.id;\n                        return (\n                            <MemoTableRow<T>\n                                key={id}\n                                cells={row.getVisibleCells()}\n                                selected={row.getIsSelected()}\n                                getColumnWidth={getColumnWidth}\n                            />\n                        );\n                    })}\n                </Table.Body>\n            </Table>\n        </div>\n    );\n};\n\nconst DataTable = makeDecoratable(\"DataTable\", DecoratableDataTable);\n\nexport {\n    DataTable,\n    type DataTableProps,\n    type DataTableColumn,\n    type DataTableColumns,\n    type DataTableDefaultData,\n    type DataTableRow,\n    type DataTableSorting,\n    type DataTableColumnSort,\n    type OnDataTableSortingChange,\n    type DataTableColumnVisibility,\n    type OnDataTableColumnVisibilityChange\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","memo","useCallback","useEffect","useMemo","useRef","useState","flexRender","getCoreRowModel","getSortedRowModel","useReactTable","CheckboxPrimitive","Skeleton","Table","ColumnSorter","ColumnsVisibility","cn","makeDecoratable","defineColumns","columns","options","canSelectAllRows","onSelectRow","onToggleRow","loading","columnsList","Object","keys","map","key","id","defaults","column","accessorKey","cell","className","enableHiding","enableResizing","enableSorting","header","truncate","size","props","row","original","getValue","String","meta","columnsDefs","firstColumn","isSelectable","createElement","indeterminate","table","getIsSomeRowsSelected","checked","getIsAllRowsSelected","onChange","toggleAllPageRowsSelected","disabled","onClick","e","stopPropagation","getIsSelected","value","toggleSelected","getCanSelect","slice","type","typedMemo","TableCell","getColumnWidth","width","Cell","assign","columnDef","style","maxWidth","getContext","MemoTableCell","TableRow","selected","cells","Row","MemoTableRow","emptyArray","Array","fill","DecoratableDataTable","bordered","columnVisibility","initialColumns","data","initialData","initialSorting","isRowSelectable","onColumnVisibilityChange","onSortingChange","selectedRows","sorting","stickyHeader","tableRef","tableWidth","setTableWidth","updateElementWidth","current","clientWidth","window","addEventListener","removeEventListener","rowSelection","reduce","acc","item","recordIndex","findIndex","rec","onRowSelectionChange","updater","newSelection","toggledRows","filter","x","length","parseInt","selection","tableSorting","isArray","columnResizeMode","enableColumnResizing","enableRowSelection","enableSortingRemoval","manualSorting","state","getCanResize","getSize","tableSize","getTotalSize","columnSize","Math","ceil","tableRows","getRowModel","rows","ref","sticky","Header","getHeaderGroups","headerGroup","headers","index","isLastCell","Head","colSpan","isPlaceholder","getToggleSortingHandler","sortable","getCanSort","Direction","direction","getIsSorted","getAllColumns","Resizer","onMouseDown","getResizeHandler","onTouchStart","isResizing","getIsResizing","Body","getVisibleCells","DataTable"],"sources":["DataTable.tsx"],"sourcesContent":["import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from \"react\";\nimport type {\n    Cell,\n    Column,\n    ColumnDef,\n    ColumnSort,\n    OnChangeFn,\n    Row,\n    RowSelectionState,\n    SortingState,\n    VisibilityState\n} from \"@tanstack/react-table\";\nimport {\n    flexRender,\n    getCoreRowModel,\n    getSortedRowModel,\n    useReactTable\n} from \"@tanstack/react-table\";\nimport { CheckboxPrimitive } from \"~/Checkbox/index.js\";\nimport { Skeleton } from \"~/Skeleton/index.js\";\nimport { Table } from \"~/Table/index.js\";\nimport { ColumnSorter, ColumnsVisibility } from \"./components/index.js\";\nimport { cn, makeDecoratable } from \"~/utils.js\";\n\ninterface DataTableColumn<T> {\n    /*\n     * Column header component.\n     */\n    header?: string | number | React.JSX.Element;\n    /*\n     * Cell renderer, receives the full row and returns the value to render inside the cell.\n     */\n    cell?: (row: T) => string | number | React.JSX.Element | null;\n    /*\n     * Column size.\n     */\n    size?: number;\n    /*\n     * Should truncate?\n     */\n    truncate?: boolean;\n    /*\n     * Column class names.\n     */\n    className?: string;\n    /*\n     * Enable column sorting.\n     */\n    enableSorting?: boolean;\n    /*\n     * Enable column resizing.\n     */\n    enableResizing?: boolean;\n    /*\n     * Enable column visibility toggling.\n     */\n    enableHiding?: boolean;\n    /*\n     * Accessor key for the column data path.\n     */\n    accessorKey?: string;\n}\n\ntype DataTableColumns<T> = {\n    [P in keyof T]?: DataTableColumn<T>;\n};\n\ntype DataTableDefaultData = {\n    id: string;\n    /*\n     * Define if a specific row can be selected.\n     */\n    $selectable?: boolean;\n};\n\ntype DataTableRow<T> = Row<DataTableDefaultData & T>;\n\ntype DataTableSorting = SortingState;\n\ntype DataTableColumnSort = ColumnSort;\n\ntype OnDataTableSortingChange = OnChangeFn<DataTableSorting>;\n\ntype DataTableColumnVisibility = VisibilityState;\n\ntype OnDataTableColumnVisibilityChange = OnChangeFn<DataTableColumnVisibility>;\n\ninterface DataTableProps<TEntry> {\n    /**\n     * Show or hide borders.\n     */\n    bordered?: boolean;\n    /**\n     * Controls whether \"select all\" action is allowed.\n     */\n    canSelectAllRows?: boolean;\n    /**\n     * Columns definition.\n     */\n    columns: DataTableColumns<TEntry>;\n    /**\n     * The column visibility state.\n     */\n    columnVisibility?: DataTableColumnVisibility;\n    /**\n     * Callback that receives current column visibility state.\n     */\n    onColumnVisibilityChange?: OnDataTableColumnVisibilityChange;\n    /**\n     * Data to display into DataTable body.\n     */\n    data: TEntry[];\n    /**\n     * Callback that is called to determine if the row is selectable.\n     */\n    isRowSelectable?: (row: Row<TEntry>) => boolean;\n    /**\n     * Render the skeleton state while data are loading.\n     */\n    loading?: boolean;\n    /**\n     * Callback that receives the selected rows.\n     */\n    onSelectRow?: (rows: TEntry[]) => void;\n    /**\n     * Callback that receives the toggled row.\n     */\n    onToggleRow?: (row: TEntry) => void;\n    /**\n     * Callback that receives current sorting state.\n     */\n    onSortingChange?: OnDataTableSortingChange;\n    /**\n     * Selected rows.\n     */\n    selectedRows?: TEntry[];\n    /**\n     * Sorting state.\n     */\n    sorting?: DataTableSorting;\n    /**\n     * Initial sorting state.\n     */\n    initialSorting?: DataTableSorting;\n    /**\n     * Enable sticky header.\n     */\n    stickyHeader?: boolean;\n}\n\ninterface DefineColumnsOptions<TEntry> {\n    canSelectAllRows: boolean;\n    onSelectRow?: DataTableProps<TEntry>[\"onSelectRow\"];\n    onToggleRow: DataTableProps<TEntry>[\"onToggleRow\"];\n    loading: DataTableProps<TEntry>[\"loading\"];\n}\n\nconst defineColumns = <T,>(\n    columns: DataTableProps<T>[\"columns\"],\n    options: DefineColumnsOptions<T>\n): ColumnDef<T>[] => {\n    const { canSelectAllRows, onSelectRow, onToggleRow, loading } = options;\n\n    return useMemo(() => {\n        const columnsList = Object.keys(columns).map(key => ({\n            id: key,\n            ...columns[key as keyof typeof columns]\n        }));\n\n        const defaults: ColumnDef<T>[] = columnsList.map(column => {\n            const {\n                accessorKey,\n                cell,\n                className,\n                enableHiding = true,\n                enableResizing = true,\n                enableSorting = false,\n                header,\n                truncate = true,\n                id,\n                size = 100\n            } = column;\n\n            return {\n                id,\n                accessorKey: accessorKey || id,\n                header: () => header,\n                cell: props => {\n                    if (cell && typeof cell === \"function\") {\n                        return cell(props.row.original);\n                    } else {\n                        // Automatically convert any cell value to a string for rendering,\n                        // ensuring the table displays values correctly. This aligns with React's\n                        // rendering, which expects JSX, strings or null.\n                        // https://github.com/TanStack/table/issues/1042\n                        return props.getValue() ? String(props.getValue()) : null;\n                    }\n                },\n                enableSorting,\n                meta: {\n                    className,\n                    truncate\n                },\n                enableResizing,\n                size,\n                enableHiding\n            };\n        });\n\n        let columnsDefs = defaults;\n        const firstColumn = defaults[0];\n        const isSelectable = onToggleRow || onSelectRow;\n\n        if (isSelectable && firstColumn) {\n            columnsDefs = [\n                {\n                    ...firstColumn,\n                    accessorKey: firstColumn.id as string,\n                    header: props => {\n                        if (!props) {\n                            return null;\n                        }\n\n                        return (\n                            <div className={\"flex items-center gap-xl\"}>\n                                <CheckboxPrimitive\n                                    indeterminate={props.table.getIsSomeRowsSelected()}\n                                    checked={props.table.getIsAllRowsSelected()}\n                                    onChange={props.table.toggleAllPageRowsSelected}\n                                    aria-label=\"Select all\"\n                                    disabled={!canSelectAllRows}\n                                    onClick={e => e.stopPropagation()}\n                                />\n                                {firstColumn.header\n                                    ? React.createElement(firstColumn.header, props)\n                                    : null}\n                            </div>\n                        );\n                    },\n                    cell: props => {\n                        if (!props) {\n                            return null;\n                        }\n                        return (\n                            <div className={\"flex items-center gap-xl\"}>\n                                <CheckboxPrimitive\n                                    checked={props.row.getIsSelected()}\n                                    onChange={value => props.row.toggleSelected(!!value)}\n                                    disabled={!props.row.getCanSelect()}\n                                    aria-label=\"Select row\"\n                                    className={cn(!props.row.getCanSelect() ? \"invisible\" : \"\")}\n                                />\n                                {firstColumn.cell\n                                    ? React.createElement(firstColumn.cell, props)\n                                    : null}\n                            </div>\n                        );\n                    }\n                },\n                ...defaults.slice(1)\n            ];\n        }\n\n        return columnsDefs.map(column => {\n            if (loading) {\n                return {\n                    ...column,\n                    cell: () => <Skeleton type={\"text\"} size={\"md\"} />\n                };\n            }\n\n            return column;\n        });\n    }, [columns, onSelectRow, onToggleRow, loading]);\n};\n\nconst typedMemo: <T>(component: T) => T = memo;\n\ninterface TableCellProps<T> {\n    cell: Cell<T, unknown>;\n    getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableCell = <T,>({ cell, getColumnWidth }: TableCellProps<T>) => {\n    const width = getColumnWidth(cell.column);\n\n    return (\n        <Table.Cell {...cell.column.columnDef.meta} style={{ width, maxWidth: width }}>\n            {flexRender(cell.column.columnDef.cell, cell.getContext())}\n        </Table.Cell>\n    );\n};\n\nconst MemoTableCell = typedMemo(TableCell);\n\ninterface TableRowProps<T> {\n    selected: boolean;\n    cells: Cell<T, unknown>[];\n    getColumnWidth: (column: Column<T>) => number;\n}\n\nconst TableRow = <T,>({ selected, cells, getColumnWidth }: TableRowProps<T>) => {\n    return (\n        <Table.Row selected={selected}>\n            {cells.map(cell => (\n                <MemoTableCell<T> key={cell.id} cell={cell} getColumnWidth={getColumnWidth} />\n            ))}\n        </Table.Row>\n    );\n};\n\nconst MemoTableRow = typedMemo(TableRow);\n\n/**\n * Empty array must be defined outside the React component so it does not force rerendering of the DataTable\n */\nconst emptyArray = Array(10).fill({});\n\nconst DecoratableDataTable = <T extends Record<string, any> & DataTableDefaultData>({\n    bordered,\n    canSelectAllRows = true,\n    columnVisibility,\n    columns: initialColumns,\n    data: initialData,\n    initialSorting,\n    isRowSelectable,\n    loading,\n    onColumnVisibilityChange,\n    onSelectRow,\n    onSortingChange,\n    onToggleRow,\n    selectedRows = [],\n    sorting,\n    stickyHeader\n}: DataTableProps<T>) => {\n    const tableRef = useRef<HTMLDivElement>(null);\n    const [tableWidth, setTableWidth] = useState(1);\n\n    const data = loading ? emptyArray : initialData;\n\n    useEffect(() => {\n        const updateElementWidth = () => {\n            if (tableRef.current) {\n                const width = tableRef.current.clientWidth;\n                setTableWidth(width);\n            }\n        };\n\n        updateElementWidth();\n\n        window.addEventListener(\"resize\", updateElementWidth);\n\n        return () => {\n            window.removeEventListener(\"resize\", updateElementWidth);\n        };\n    }, [tableRef.current]);\n\n    const rowSelection = useMemo(() => {\n        return selectedRows.reduce<RowSelectionState>((acc, item) => {\n            const recordIndex = data.findIndex(rec => rec.id === item.id);\n            return { ...acc, [recordIndex]: true };\n        }, {});\n    }, [selectedRows, data]);\n\n    const onRowSelectionChange: OnChangeFn<RowSelectionState> = updater => {\n        const newSelection = typeof updater === \"function\" ? updater(rowSelection) : updater;\n\n        /**\n         * `@tanstack/react-table` isn't telling us what row was selected or deselected. It simply gives us\n         * the new selection state (an object with row indexes that are currently selected).\n         *\n         * To figure out what row was toggled, we need to calculate the difference between the old selection\n         * and the new selection. What we're doing here is:\n         * - find all items that were present in the previous selection, but are no longer present in the new selection\n         * - find all items that are present in the new selection, but were not present in the previous selection\n         */\n        const toggledRows = [\n            ...Object.keys(rowSelection).filter(x => !(x in newSelection)),\n            ...Object.keys(newSelection).filter(x => !(x in rowSelection))\n        ];\n\n        // If the difference is only 1 item, and `onToggleRow` is available, execute that.\n        if (toggledRows.length === 1 && typeof onToggleRow === \"function\") {\n            onToggleRow(data[parseInt(toggledRows[0])]);\n            return;\n        } else if (typeof onSelectRow === \"function\") {\n            const selection = Object.keys(newSelection).map(key => data[parseInt(key)]);\n            onSelectRow(selection);\n        }\n    };\n\n    const tableSorting = useMemo(() => {\n        if (!Array.isArray(sorting) || !sorting.length) {\n            return initialSorting;\n        }\n        return sorting;\n    }, [sorting]);\n\n    const columns = defineColumns(initialColumns, {\n        canSelectAllRows,\n        onSelectRow,\n        onToggleRow,\n        loading\n    });\n\n    const table = useReactTable<T>({\n        columnResizeMode: \"onChange\",\n        columns,\n        data,\n        enableColumnResizing: true,\n        enableHiding: !!onColumnVisibilityChange,\n        enableRowSelection: isRowSelectable,\n        enableSorting: !!onSortingChange,\n        enableSortingRemoval: false,\n        getCoreRowModel: getCoreRowModel(),\n        getSortedRowModel: getSortedRowModel(),\n        manualSorting: true,\n        onColumnVisibilityChange,\n        onRowSelectionChange,\n        onSortingChange,\n        state: {\n            columnVisibility,\n            rowSelection,\n            sorting: tableSorting\n        }\n    });\n\n    const getColumnWidth = useCallback(\n        (column: Column<T>): number => {\n            if (!column.getCanResize()) {\n                return column.getSize();\n            }\n\n            const tableSize = table.getTotalSize();\n            const columnSize = column.getSize();\n\n            return Math.ceil((columnSize * tableWidth) / tableSize);\n        },\n        [table, tableWidth]\n    );\n\n    /**\n     * Had to memoize the rows to avoid browser freeze.\n     */\n    const tableRows = useMemo(() => {\n        return table.getRowModel().rows;\n    }, [table, data, columns]);\n\n    return (\n        <div ref={tableRef}>\n            <Table bordered={bordered} sticky={stickyHeader}>\n                <Table.Header sticky={stickyHeader}>\n                    {table.getHeaderGroups().map(headerGroup => (\n                        <Table.Row key={headerGroup.id}>\n                            {headerGroup.headers.map((header, index) => {\n                                const isLastCell = index === headerGroup.headers.length - 1;\n                                const width = getColumnWidth(header.column);\n\n                                return (\n                                    <Table.Head\n                                        key={header.id}\n                                        {...header.column.columnDef.meta}\n                                        colSpan={header.colSpan}\n                                        style={{ width, maxWidth: width }}\n                                    >\n                                        {header.isPlaceholder ? null : (\n                                            <ColumnSorter\n                                                onClick={header.column.getToggleSortingHandler()}\n                                                sortable={header.column.getCanSort()}\n                                            >\n                                                <div\n                                                    className={cn({\n                                                        \"w-full overflow-hidden whitespace-nowrap\": true,\n                                                        truncate: !isLastCell\n                                                    })}\n                                                >\n                                                    {flexRender(\n                                                        header.column.columnDef.header,\n                                                        header.getContext()\n                                                    )}\n                                                </div>\n                                                <Table.Direction\n                                                    direction={header.column.getIsSorted() || null}\n                                                />\n                                                {isLastCell && (\n                                                    <div className={\"h-md\"}>\n                                                        <ColumnsVisibility\n                                                            columns={table.getAllColumns()}\n                                                        />\n                                                    </div>\n                                                )}\n                                            </ColumnSorter>\n                                        )}\n                                        {header.column.getCanResize() && (\n                                            <Table.Resizer\n                                                onMouseDown={header.getResizeHandler()}\n                                                onTouchStart={header.getResizeHandler()}\n                                                isResizing={header.column.getIsResizing()}\n                                            />\n                                        )}\n                                    </Table.Head>\n                                );\n                            })}\n                        </Table.Row>\n                    ))}\n                </Table.Header>\n                <Table.Body>\n                    {tableRows.map(row => {\n                        const id = row.original.id || row.id;\n                        return (\n                            <MemoTableRow<T>\n                                key={id}\n                                cells={row.getVisibleCells()}\n                                selected={row.getIsSelected()}\n                                getColumnWidth={getColumnWidth}\n                            />\n                        );\n                    })}\n                </Table.Body>\n            </Table>\n        </div>\n    );\n};\n\nconst DataTable = makeDecoratable(\"DataTable\", DecoratableDataTable);\n\nexport {\n    DataTable,\n    type DataTableProps,\n    type DataTableColumn,\n    type DataTableColumns,\n    type DataTableDefaultData,\n    type DataTableRow,\n    type DataTableSorting,\n    type DataTableColumnSort,\n    type OnDataTableSortingChange,\n    type DataTableColumnVisibility,\n    type OnDataTableColumnVisibilityChange\n};\n"],"mappings":"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","ignoreList":[]}

package/Sidebar/components/items/SidebarMenuItem.d.ts

@@ -5,6 +5,7 @@ import { LinkProps } from "../../../index.js";
 export interface SidebarMenuItemBaseProps {
     text: React.ReactNode;
     className?: string;
+    collapsible?: boolean;
     children?: React.ReactNode;
     onClick?: React.MouseEventHandler;
     icon?: React.ReactNode;

package/Sidebar/components/items/SidebarMenuItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","makeDecoratable","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuSubItem","useSidebarMenu","SidebarMenuRootItem","SidebarMenuItemBase","props","currentLevel","createElement","DecoratableSidebarMenuItem","SidebarMenuItem","Icon","Action"],"sources":["SidebarMenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuItemIcon, type SidebarMenuItemIconProps } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction, type SidebarMenuItemActionProps } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuSubItem } from \"./SidebarMenuSubItem.js\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { SidebarMenuRootItem } from \"~/Sidebar/components/items/SidebarMenuRootItem.js\";\nimport { LinkProps } from \"~/index.js\";\n\nexport interface SidebarMenuItemBaseProps {\n    text: React.ReactNode;\n    className?: string;\n    children?: React.ReactNode;\n    onClick?: React.MouseEventHandler;\n    icon?: React.ReactNode;\n    action?: React.ReactNode;\n    variant?: \"group-label\";\n    active?: boolean;\n    disabled?: boolean;\n    pinnable?: boolean;\n    pinnedIcon?: React.ReactNode;\n}\n\ntype SidebarMenuItemButtonProps = SidebarMenuItemBaseProps & {\n    to?: never;\n    route?: never;\n    params?: never;\n};\n\ntype SidebarMenuItemGroupProps = SidebarMenuItemButtonProps;\ntype SidebarMenuItemLinkProps = SidebarMenuItemBaseProps & LinkProps;\n\ntype SidebarMenuItemProps = SidebarMenuItemButtonProps | SidebarMenuItemLinkProps;\n\nconst SidebarMenuItemBase = (props: SidebarMenuItemProps) => {\n    const { currentLevel } = useSidebarMenu();\n\n    if (currentLevel === 0) {\n        return <SidebarMenuRootItem {...props} />;\n    }\n\n    return <SidebarMenuSubItem {...props} />;\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport {\n    SidebarMenuItem,\n    type SidebarMenuItemProps,\n    type SidebarMenuItemButtonProps,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemGroupProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,EAAEC,eAAe;AACzC,SAASC,mBAAmB;AAC5B,SAASC,qBAAqB;AAC9B,SAASC,kBAAkB;AAC3B,SAASC,cAAc;AACvB,SAASC,mBAAmB;AA4B5B,MAAMC,mBAAmB,GAAIC,KAA2B,IAAK;EACzD,MAAM;IAAEC;EAAa,CAAC,GAAGJ,cAAc,CAAC,CAAC;EAEzC,IAAII,YAAY,KAAK,CAAC,EAAE;IACpB,oBAAOV,KAAA,CAAAW,aAAA,CAACJ,mBAAmB,EAAKE,KAAQ,CAAC;EAC7C;EAEA,oBAAOT,KAAA,CAAAW,aAAA,CAACN,kBAAkB,EAAKI,KAAQ,CAAC;AAC5C,CAAC;AAED,MAAMG,0BAA0B,GAAGX,eAAe,CAAC,iBAAiB,EAAEO,mBAAmB,CAAC;AAE1F,MAAMK,eAAe,GAAGX,eAAe,CAACU,0BAA0B,EAAE;EAChEE,IAAI,EAAEX,mBAAmB;EACzBY,MAAM,EAAEX;AACZ,CAAC,CAAC;AAEF,SACIS,eAAe","ignoreList":[]}
+{"version":3,"names":["React","makeDecoratable","withStaticProps","SidebarMenuItemIcon","SidebarMenuItemAction","SidebarMenuSubItem","useSidebarMenu","SidebarMenuRootItem","SidebarMenuItemBase","props","currentLevel","createElement","DecoratableSidebarMenuItem","SidebarMenuItem","Icon","Action"],"sources":["SidebarMenuItem.tsx"],"sourcesContent":["import React from \"react\";\nimport { makeDecoratable, withStaticProps } from \"~/utils.js\";\nimport { SidebarMenuItemIcon, type SidebarMenuItemIconProps } from \"./SidebarMenuItemIcon.js\";\nimport { SidebarMenuItemAction, type SidebarMenuItemActionProps } from \"./SidebarMenuItemAction.js\";\nimport { SidebarMenuSubItem } from \"./SidebarMenuSubItem.js\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { SidebarMenuRootItem } from \"~/Sidebar/components/items/SidebarMenuRootItem.js\";\nimport { LinkProps } from \"~/index.js\";\n\nexport interface SidebarMenuItemBaseProps {\n    text: React.ReactNode;\n    className?: string;\n    collapsible?: boolean;\n    children?: React.ReactNode;\n    onClick?: React.MouseEventHandler;\n    icon?: React.ReactNode;\n    action?: React.ReactNode;\n    variant?: \"group-label\";\n    active?: boolean;\n    disabled?: boolean;\n    pinnable?: boolean;\n    pinnedIcon?: React.ReactNode;\n}\n\ntype SidebarMenuItemButtonProps = SidebarMenuItemBaseProps & {\n    to?: never;\n    route?: never;\n    params?: never;\n};\n\ntype SidebarMenuItemGroupProps = SidebarMenuItemButtonProps;\ntype SidebarMenuItemLinkProps = SidebarMenuItemBaseProps & LinkProps;\n\ntype SidebarMenuItemProps = SidebarMenuItemButtonProps | SidebarMenuItemLinkProps;\n\nconst SidebarMenuItemBase = (props: SidebarMenuItemProps) => {\n    const { currentLevel } = useSidebarMenu();\n\n    if (currentLevel === 0) {\n        return <SidebarMenuRootItem {...props} />;\n    }\n\n    return <SidebarMenuSubItem {...props} />;\n};\n\nconst DecoratableSidebarMenuItem = makeDecoratable(\"SidebarMenuItem\", SidebarMenuItemBase);\n\nconst SidebarMenuItem = withStaticProps(DecoratableSidebarMenuItem, {\n    Icon: SidebarMenuItemIcon,\n    Action: SidebarMenuItemAction\n});\n\nexport {\n    SidebarMenuItem,\n    type SidebarMenuItemProps,\n    type SidebarMenuItemButtonProps,\n    type SidebarMenuItemLinkProps,\n    type SidebarMenuItemGroupProps,\n    type SidebarMenuItemIconProps,\n    type SidebarMenuItemActionProps\n};\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AACzB,SAASC,eAAe,EAAEC,eAAe;AACzC,SAASC,mBAAmB;AAC5B,SAASC,qBAAqB;AAC9B,SAASC,kBAAkB;AAC3B,SAASC,cAAc;AACvB,SAASC,mBAAmB;AA6B5B,MAAMC,mBAAmB,GAAIC,KAA2B,IAAK;EACzD,MAAM;IAAEC;EAAa,CAAC,GAAGJ,cAAc,CAAC,CAAC;EAEzC,IAAII,YAAY,KAAK,CAAC,EAAE;IACpB,oBAAOV,KAAA,CAAAW,aAAA,CAACJ,mBAAmB,EAAKE,KAAQ,CAAC;EAC7C;EAEA,oBAAOT,KAAA,CAAAW,aAAA,CAACN,kBAAkB,EAAKI,KAAQ,CAAC;AAC5C,CAAC;AAED,MAAMG,0BAA0B,GAAGX,eAAe,CAAC,iBAAiB,EAAEO,mBAAmB,CAAC;AAE1F,MAAMK,eAAe,GAAGX,eAAe,CAACU,0BAA0B,EAAE;EAChEE,IAAI,EAAEX,mBAAmB;EACzBY,MAAM,EAAEX;AACZ,CAAC,CAAC;AAEF,SACIS,eAAe","ignoreList":[]}

package/Sidebar/components/items/SidebarMenuSubItem.d.ts

@@ -1,4 +1,4 @@
 import React from "react";
 import { type SidebarMenuItemProps } from "./SidebarMenuItem.js";
-declare const SidebarMenuSubItem: ({ children, className, pinnable, action, ...buttonProps }: SidebarMenuItemProps) => React.JSX.Element;
+declare const SidebarMenuSubItem: ({ children, className, pinnable, action, collapsible, ...buttonProps }: SidebarMenuItemProps) => React.JSX.Element;
 export { SidebarMenuSubItem };

package/Sidebar/components/items/SidebarMenuSubItem.js

@@ -16,6 +16,7 @@ const SidebarMenuSubItem = ({
   className,
   pinnable,
   action,
+  collapsible = true,
   ...buttonProps
 }) => {
   const {
@@ -126,6 +127,14 @@ const SidebarMenuSubItem = ({
     const collapsibleAction = pinnable ? /*#__PURE__*/React.createElement("div", {
       className: "flex items-center gap-xs"
     }, pinAction, chevron) : chevron;
+    if (!collapsible) {
+      return /*#__PURE__*/React.createElement("div", {
+        className: "flex items-center"
+      }, /*#__PURE__*/React.createElement(SidebarMenuSubItemIndentation, {
+        lvl: currentLevel,
+        variant: buttonProps.variant
+      }), /*#__PURE__*/React.createElement(SidebarMenuSubButton, buttonProps));
+    }
     return /*#__PURE__*/React.createElement(Collapsible.Root, {
       className: "w-full group/menu-sub-item-collapsible",
       open: isSectionExpanded,
@@ -144,10 +153,10 @@ const SidebarMenuSubItem = ({
       parentIcon: buttonProps.icon
     }, children)));
   }, [children, buttonProps, currentLevel, menuItemId, isSectionExpanded, toggleSectionExpanded, showChevron, pinnable, pinAction]);
-  return /*#__PURE__*/React.createElement("li", {
+  return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement("li", {
     "data-sidebar": "menu-sub-item",
     className: cn("group/menu-sub-item relative flex", className)
-  }, sidebarMenuSubButton);
+  }, sidebarMenuSubButton), children && !collapsible ? children : null);
 };
 export { SidebarMenuSubItem };
 

package/Sidebar/components/items/SidebarMenuSubItem.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","cn","Collapsible","SidebarMenuSubButton","SidebarMenuSubItemIndentation","SidebarMenuSub","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemAction","SidebarMenuSubItem","children","className","pinnable","action","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","expanded","timer","setTimeout","clearTimeout","undefined","sidebarMenuSubButton","Fragment","lvl","variant","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content"],"sources":["SidebarMenuSubItem.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { SidebarMenuSubButton } from \"./SidebarMenuSubButton.js\";\nimport { SidebarMenuSubItemIndentation } from \"./SidebarMenuSubItemIndentation.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\n\nconst SidebarMenuSubItem = ({\n    children,\n    className,\n    pinnable,\n    action,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register when pinned, unregister when unpinned\n    // Re-register when active state changes to keep pinned items in sync\n    React.useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        } else if (pinnable && !isPinned) {\n            // Only unregister if this item is explicitly unpinned\n            sidebar.unregisterPinnedItem(menuItemId);\n        }\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const sidebarMenuSubButton = useMemo(() => {\n        if (!children) {\n            return (\n                <>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <SidebarMenuSubButton {...buttonProps} action={pinAction} />\n                </>\n            );\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-sub-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        return (\n            <Collapsible.Root\n                className=\"w-full group/menu-sub-item-collapsible\"\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <div className={\"flex items-center\"}>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <Collapsible.Trigger asChild>\n                        <SidebarMenuSubButton\n                            {...buttonProps}\n                            action={collapsibleAction}\n                            className={\n                                \"group-data-[state=open]/menu-sub-item-collapsible:font-semibold!\"\n                            }\n                        />\n                    </Collapsible.Trigger>\n                </div>\n                <Collapsible.Content>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        currentLevel,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <li\n            data-sidebar=\"menu-sub-item\"\n            className={cn(\"group/menu-sub-item relative flex\", className)}\n        >\n            {sidebarMenuSubButton}\n        </li>\n    );\n};\n\nexport { SidebarMenuSubItem };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","useCallback","useEffect","useMemo","useState","cn","Collapsible","SidebarMenuSubButton","SidebarMenuSubItemIndentation","SidebarMenuSub","Icon","ReactComponent","KeyboardArrowRightIcon","PinIcon","UnPinIcon","useSidebarMenu","useSidebar","SidebarMenuItemAction","SidebarMenuSubItem","children","className","pinnable","action","collapsible","buttonProps","currentLevel","parentIcon","sidebar","showChevron","setShowChevron","menuItemId","btoa","text","isSectionExpanded","expandedSections","toggleSectionExpanded","isPinned","isItemPinned","pinnedItemIcon","pinnedIcon","icon","registerPinnedItem","id","to","onClick","active","unregisterPinnedItem","pinAction","handlePinClick","e","stopPropagation","preventDefault","toggleItemPinned","pinButton","createElement","element","showOnHover","expanded","timer","setTimeout","clearTimeout","undefined","sidebarMenuSubButton","Fragment","lvl","variant","Object","assign","chevron","label","size","color","collapsibleAction","Root","open","onOpenChange","Trigger","asChild","Content"],"sources":["SidebarMenuSubItem.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useMemo, useState } from \"react\";\nimport { cn } from \"~/utils.js\";\nimport { Collapsible } from \"radix-ui\";\nimport { SidebarMenuSubButton } from \"./SidebarMenuSubButton.js\";\nimport { SidebarMenuSubItemIndentation } from \"./SidebarMenuSubItemIndentation.js\";\nimport { SidebarMenuSub } from \"./SidebarMenuSub.js\";\nimport { Icon } from \"~/Icon/index.js\";\nimport { ReactComponent as KeyboardArrowRightIcon } from \"@webiny/icons/keyboard_arrow_down.svg\";\nimport { ReactComponent as PinIcon } from \"@webiny/icons/push_pin.svg\";\nimport { ReactComponent as UnPinIcon } from \"@webiny/icons/push_pin_off.svg\";\nimport { useSidebarMenu } from \"./SidebarMenuProvider.js\";\nimport { type SidebarMenuItemProps } from \"./SidebarMenuItem.js\";\nimport { useSidebar } from \"~/Sidebar/index.js\";\nimport { SidebarMenuItemAction } from \"./SidebarMenuItemAction.js\";\n\nconst SidebarMenuSubItem = ({\n    children,\n    className,\n    pinnable,\n    action,\n    collapsible = true,\n    ...buttonProps\n}: SidebarMenuItemProps) => {\n    const { currentLevel, parentIcon } = useSidebarMenu();\n    const sidebar = useSidebar();\n    const [showChevron, setShowChevron] = useState(false);\n\n    const menuItemId = useMemo(() => {\n        return btoa(`sidebar-item-${currentLevel}-${buttonProps.text}`);\n    }, [buttonProps.text, currentLevel]);\n\n    const isSectionExpanded = useMemo(() => {\n        return sidebar.isSectionExpanded(menuItemId);\n    }, [sidebar.expandedSections]);\n\n    const toggleSectionExpanded = useCallback(() => {\n        sidebar.toggleSectionExpanded(menuItemId);\n    }, [isSectionExpanded]);\n\n    const isPinned = sidebar.isItemPinned(menuItemId);\n\n    // Icon to use when this item is pinned\n    const pinnedItemIcon = useMemo(() => {\n        if (buttonProps.pinnedIcon) {\n            return buttonProps.pinnedIcon;\n        }\n\n        return buttonProps.icon || parentIcon;\n    }, [buttonProps.pinnedIcon, buttonProps.icon, parentIcon]);\n\n    // Register when pinned, unregister when unpinned\n    // Re-register when active state changes to keep pinned items in sync\n    React.useEffect(() => {\n        if (pinnable && isPinned) {\n            sidebar.registerPinnedItem({\n                id: menuItemId,\n                text: buttonProps.text,\n                icon: pinnedItemIcon,\n                to: buttonProps.to,\n                onClick: buttonProps.onClick,\n                active: buttonProps.active\n            });\n        } else if (pinnable && !isPinned) {\n            // Only unregister if this item is explicitly unpinned\n            sidebar.unregisterPinnedItem(menuItemId);\n        }\n    }, [pinnable, isPinned, pinnedItemIcon, menuItemId, buttonProps.active]);\n\n    const pinAction = useMemo(() => {\n        if (!pinnable) {\n            return action;\n        }\n\n        const handlePinClick = (e: React.MouseEvent) => {\n            e.stopPropagation();\n            e.preventDefault();\n\n            if (isPinned) {\n                sidebar.unregisterPinnedItem(menuItemId);\n            } else {\n                sidebar.registerPinnedItem({\n                    id: menuItemId,\n                    text: buttonProps.text,\n                    icon: pinnedItemIcon,\n                    to: buttonProps.to,\n                    onClick: buttonProps.onClick,\n                    active: buttonProps.active\n                });\n            }\n\n            sidebar.toggleItemPinned(menuItemId);\n        };\n\n        const pinButton = (\n            <SidebarMenuItemAction\n                element={isPinned ? <UnPinIcon /> : <PinIcon />}\n                onClick={handlePinClick}\n                showOnHover={true}\n            />\n        );\n\n        // If there's a custom action, combine them\n        // Don't modify the custom action - it should keep its original behavior\n        if (action) {\n            return (\n                <div className=\"flex items-center gap-xs\">\n                    {pinButton}\n                    {action}\n                </div>\n            );\n        }\n\n        return pinButton;\n    }, [pinnable, isPinned, pinnedItemIcon, action, sidebar, menuItemId]);\n\n    useEffect(() => {\n        if (sidebar.expanded) {\n            const timer = setTimeout(() => {\n                setShowChevron(true);\n            }, 100);\n            return () => clearTimeout(timer);\n        }\n        setShowChevron(false);\n        return undefined;\n    }, [sidebar.expanded]);\n\n    const sidebarMenuSubButton = useMemo(() => {\n        if (!children) {\n            return (\n                <>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <SidebarMenuSubButton {...buttonProps} action={pinAction} />\n                </>\n            );\n        }\n\n        const chevron = showChevron ? (\n            <Icon\n                label={\"Expand / Collapse\"}\n                size={\"sm\"}\n                className={\n                    \"ml-auto transition-transform duration-100 group-data-[state=open]/menu-sub-item-collapsible:rotate-180 group-data-[state=collapsed]:hidden\"\n                }\n                color={\"neutral-strong\"}\n                data-sidebar={\"menu-item-expanded-indicator\"}\n                icon={<KeyboardArrowRightIcon />}\n            />\n        ) : null;\n\n        const collapsibleAction = pinnable ? (\n            <div className=\"flex items-center gap-xs\">\n                {pinAction}\n                {chevron}\n            </div>\n        ) : (\n            chevron\n        );\n\n        if (!collapsible) {\n            return (\n                <div className={\"flex items-center\"}>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <SidebarMenuSubButton {...buttonProps} />\n                </div>\n            );\n        }\n\n        return (\n            <Collapsible.Root\n                className=\"w-full group/menu-sub-item-collapsible\"\n                open={isSectionExpanded}\n                onOpenChange={toggleSectionExpanded}\n            >\n                <div className={\"flex items-center\"}>\n                    <SidebarMenuSubItemIndentation\n                        lvl={currentLevel}\n                        variant={buttonProps.variant}\n                    />\n                    <Collapsible.Trigger asChild>\n                        <SidebarMenuSubButton\n                            {...buttonProps}\n                            action={collapsibleAction}\n                            className={\n                                \"group-data-[state=open]/menu-sub-item-collapsible:font-semibold!\"\n                            }\n                        />\n                    </Collapsible.Trigger>\n                </div>\n                <Collapsible.Content>\n                    <SidebarMenuSub parentIcon={buttonProps.icon}>{children}</SidebarMenuSub>\n                </Collapsible.Content>\n            </Collapsible.Root>\n        );\n    }, [\n        children,\n        buttonProps,\n        currentLevel,\n        menuItemId,\n        isSectionExpanded,\n        toggleSectionExpanded,\n        showChevron,\n        pinnable,\n        pinAction\n    ]);\n\n    return (\n        <>\n            <li\n                data-sidebar=\"menu-sub-item\"\n                className={cn(\"group/menu-sub-item relative flex\", className)}\n            >\n                {sidebarMenuSubButton}\n            </li>\n            {children && !collapsible ? children : null}\n        </>\n    );\n};\n\nexport { SidebarMenuSubItem };\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,WAAW,EAAEC,SAAS,EAAEC,OAAO,EAAEC,QAAQ,QAAQ,OAAO;AACxE,SAASC,EAAE;AACX,SAASC,WAAW,QAAQ,UAAU;AACtC,SAASC,oBAAoB;AAC7B,SAASC,6BAA6B;AACtC,SAASC,cAAc;AACvB,SAASC,IAAI;AACb,SAASC,cAAc,IAAIC,sBAAsB,QAAQ,uCAAuC;AAChG,SAASD,cAAc,IAAIE,OAAO,QAAQ,4BAA4B;AACtE,SAASF,cAAc,IAAIG,SAAS,QAAQ,gCAAgC;AAC5E,SAASC,cAAc;AAEvB,SAASC,UAAU;AACnB,SAASC,qBAAqB;AAE9B,MAAMC,kBAAkB,GAAGA,CAAC;EACxBC,QAAQ;EACRC,SAAS;EACTC,QAAQ;EACRC,MAAM;EACNC,WAAW,GAAG,IAAI;EAClB,GAAGC;AACe,CAAC,KAAK;EACxB,MAAM;IAAEC,YAAY;IAAEC;EAAW,CAAC,GAAGX,cAAc,CAAC,CAAC;EACrD,MAAMY,OAAO,GAAGX,UAAU,CAAC,CAAC;EAC5B,MAAM,CAACY,WAAW,EAAEC,cAAc,CAAC,GAAGzB,QAAQ,CAAC,KAAK,CAAC;EAErD,MAAM0B,UAAU,GAAG3B,OAAO,CAAC,MAAM;IAC7B,OAAO4B,IAAI,CAAC,gBAAgBN,YAAY,IAAID,WAAW,CAACQ,IAAI,EAAE,CAAC;EACnE,CAAC,EAAE,CAACR,WAAW,CAACQ,IAAI,EAAEP,YAAY,CAAC,CAAC;EAEpC,MAAMQ,iBAAiB,GAAG9B,OAAO,CAAC,MAAM;IACpC,OAAOwB,OAAO,CAACM,iBAAiB,CAACH,UAAU,CAAC;EAChD,CAAC,EAAE,CAACH,OAAO,CAACO,gBAAgB,CAAC,CAAC;EAE9B,MAAMC,qBAAqB,GAAGlC,WAAW,CAAC,MAAM;IAC5C0B,OAAO,CAACQ,qBAAqB,CAACL,UAAU,CAAC;EAC7C,CAAC,EAAE,CAACG,iBAAiB,CAAC,CAAC;EAEvB,MAAMG,QAAQ,GAAGT,OAAO,CAACU,YAAY,CAACP,UAAU,CAAC;;EAEjD;EACA,MAAMQ,cAAc,GAAGnC,OAAO,CAAC,MAAM;IACjC,IAAIqB,WAAW,CAACe,UAAU,EAAE;MACxB,OAAOf,WAAW,CAACe,UAAU;IACjC;IAEA,OAAOf,WAAW,CAACgB,IAAI,IAAId,UAAU;EACzC,CAAC,EAAE,CAACF,WAAW,CAACe,UAAU,EAAEf,WAAW,CAACgB,IAAI,EAAEd,UAAU,CAAC,CAAC;;EAE1D;EACA;EACA1B,KAAK,CAACE,SAAS,CAAC,MAAM;IAClB,IAAImB,QAAQ,IAAIe,QAAQ,EAAE;MACtBT,OAAO,CAACc,kBAAkB,CAAC;QACvBC,EAAE,EAAEZ,UAAU;QACdE,IAAI,EAAER,WAAW,CAACQ,IAAI;QACtBQ,IAAI,EAAEF,cAAc;QACpBK,EAAE,EAAEnB,WAAW,CAACmB,EAAE;QAClBC,OAAO,EAAEpB,WAAW,CAACoB,OAAO;QAC5BC,MAAM,EAAErB,WAAW,CAACqB;MACxB,CAAC,CAAC;IACN,CAAC,MAAM,IAAIxB,QAAQ,IAAI,CAACe,QAAQ,EAAE;MAC9B;MACAT,OAAO,CAACmB,oBAAoB,CAAChB,UAAU,CAAC;IAC5C;EACJ,CAAC,EAAE,CAACT,QAAQ,EAAEe,QAAQ,EAAEE,cAAc,EAAER,UAAU,EAAEN,WAAW,CAACqB,MAAM,CAAC,CAAC;EAExE,MAAME,SAAS,GAAG5C,OAAO,CAAC,MAAM;IAC5B,IAAI,CAACkB,QAAQ,EAAE;MACX,OAAOC,MAAM;IACjB;IAEA,MAAM0B,cAAc,GAAIC,CAAmB,IAAK;MAC5CA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnBD,CAAC,CAACE,cAAc,CAAC,CAAC;MAElB,IAAIf,QAAQ,EAAE;QACVT,OAAO,CAACmB,oBAAoB,CAAChB,UAAU,CAAC;MAC5C,CAAC,MAAM;QACHH,OAAO,CAACc,kBAAkB,CAAC;UACvBC,EAAE,EAAEZ,UAAU;UACdE,IAAI,EAAER,WAAW,CAACQ,IAAI;UACtBQ,IAAI,EAAEF,cAAc;UACpBK,EAAE,EAAEnB,WAAW,CAACmB,EAAE;UAClBC,OAAO,EAAEpB,WAAW,CAACoB,OAAO;UAC5BC,MAAM,EAAErB,WAAW,CAACqB;QACxB,CAAC,CAAC;MACN;MAEAlB,OAAO,CAACyB,gBAAgB,CAACtB,UAAU,CAAC;IACxC,CAAC;IAED,MAAMuB,SAAS,gBACXrD,KAAA,CAAAsD,aAAA,CAACrC,qBAAqB;MAClBsC,OAAO,EAAEnB,QAAQ,gBAAGpC,KAAA,CAAAsD,aAAA,CAACxC,SAAS,MAAE,CAAC,gBAAGd,KAAA,CAAAsD,aAAA,CAACzC,OAAO,MAAE,CAAE;MAChD+B,OAAO,EAAEI,cAAe;MACxBQ,WAAW,EAAE;IAAK,CACrB,CACJ;;IAED;IACA;IACA,IAAIlC,MAAM,EAAE;MACR,oBACItB,KAAA,CAAAsD,aAAA;QAAKlC,SAAS,EAAC;MAA0B,GACpCiC,SAAS,EACT/B,MACA,CAAC;IAEd;IAEA,OAAO+B,SAAS;EACpB,CAAC,EAAE,CAAChC,QAAQ,EAAEe,QAAQ,EAAEE,cAAc,EAAEhB,MAAM,EAAEK,OAAO,EAAEG,UAAU,CAAC,CAAC;EAErE5B,SAAS,CAAC,MAAM;IACZ,IAAIyB,OAAO,CAAC8B,QAAQ,EAAE;MAClB,MAAMC,KAAK,GAAGC,UAAU,CAAC,MAAM;QAC3B9B,cAAc,CAAC,IAAI,CAAC;MACxB,CAAC,EAAE,GAAG,CAAC;MACP,OAAO,MAAM+B,YAAY,CAACF,KAAK,CAAC;IACpC;IACA7B,cAAc,CAAC,KAAK,CAAC;IACrB,OAAOgC,SAAS;EACpB,CAAC,EAAE,CAAClC,OAAO,CAAC8B,QAAQ,CAAC,CAAC;EAEtB,MAAMK,oBAAoB,GAAG3D,OAAO,CAAC,MAAM;IACvC,IAAI,CAACgB,QAAQ,EAAE;MACX,oBACInB,KAAA,CAAAsD,aAAA,CAAAtD,KAAA,CAAA+D,QAAA,qBACI/D,KAAA,CAAAsD,aAAA,CAAC9C,6BAA6B;QAC1BwD,GAAG,EAAEvC,YAAa;QAClBwC,OAAO,EAAEzC,WAAW,CAACyC;MAAQ,CAChC,CAAC,eACFjE,KAAA,CAAAsD,aAAA,CAAC/C,oBAAoB,EAAA2D,MAAA,CAAAC,MAAA,KAAK3C,WAAW;QAAEF,MAAM,EAAEyB;MAAU,EAAE,CAC7D,CAAC;IAEX;IAEA,MAAMqB,OAAO,GAAGxC,WAAW,gBACvB5B,KAAA,CAAAsD,aAAA,CAAC5C,IAAI;MACD2D,KAAK,EAAE,mBAAoB;MAC3BC,IAAI,EAAE,IAAK;MACXlD,SAAS,EACL,4IACH;MACDmD,KAAK,EAAE,gBAAiB;MACxB,gBAAc,8BAA+B;MAC7C/B,IAAI,eAAExC,KAAA,CAAAsD,aAAA,CAAC1C,sBAAsB,MAAE;IAAE,CACpC,CAAC,GACF,IAAI;IAER,MAAM4D,iBAAiB,GAAGnD,QAAQ,gBAC9BrB,KAAA,CAAAsD,aAAA;MAAKlC,SAAS,EAAC;IAA0B,GACpC2B,SAAS,EACTqB,OACA,CAAC,GAENA,OACH;IAED,IAAI,CAAC7C,WAAW,EAAE;MACd,oBACIvB,KAAA,CAAAsD,aAAA;QAAKlC,SAAS,EAAE;MAAoB,gBAChCpB,KAAA,CAAAsD,aAAA,CAAC9C,6BAA6B;QAC1BwD,GAAG,EAAEvC,YAAa;QAClBwC,OAAO,EAAEzC,WAAW,CAACyC;MAAQ,CAChC,CAAC,eACFjE,KAAA,CAAAsD,aAAA,CAAC/C,oBAAoB,EAAKiB,WAAc,CACvC,CAAC;IAEd;IAEA,oBACIxB,KAAA,CAAAsD,aAAA,CAAChD,WAAW,CAACmE,IAAI;MACbrD,SAAS,EAAC,wCAAwC;MAClDsD,IAAI,EAAEzC,iBAAkB;MACxB0C,YAAY,EAAExC;IAAsB,gBAEpCnC,KAAA,CAAAsD,aAAA;MAAKlC,SAAS,EAAE;IAAoB,gBAChCpB,KAAA,CAAAsD,aAAA,CAAC9C,6BAA6B;MAC1BwD,GAAG,EAAEvC,YAAa;MAClBwC,OAAO,EAAEzC,WAAW,CAACyC;IAAQ,CAChC,CAAC,eACFjE,KAAA,CAAAsD,aAAA,CAAChD,WAAW,CAACsE,OAAO;MAACC,OAAO;IAAA,gBACxB7E,KAAA,CAAAsD,aAAA,CAAC/C,oBAAoB,EAAA2D,MAAA,CAAAC,MAAA,KACb3C,WAAW;MACfF,MAAM,EAAEkD,iBAAkB;MAC1BpD,SAAS,EACL;IACH,EACJ,CACgB,CACpB,CAAC,eACNpB,KAAA,CAAAsD,aAAA,CAAChD,WAAW,CAACwE,OAAO,qBAChB9E,KAAA,CAAAsD,aAAA,CAAC7C,cAAc;MAACiB,UAAU,EAAEF,WAAW,CAACgB;IAAK,GAAErB,QAAyB,CACvD,CACP,CAAC;EAE3B,CAAC,EAAE,CACCA,QAAQ,EACRK,WAAW,EACXC,YAAY,EACZK,UAAU,EACVG,iBAAiB,EACjBE,qBAAqB,EACrBP,WAAW,EACXP,QAAQ,EACR0B,SAAS,CACZ,CAAC;EAEF,oBACI/C,KAAA,CAAAsD,aAAA,CAAAtD,KAAA,CAAA+D,QAAA,qBACI/D,KAAA,CAAAsD,aAAA;IACI,gBAAa,eAAe;IAC5BlC,SAAS,EAAEf,EAAE,CAAC,mCAAmC,EAAEe,SAAS;EAAE,GAE7D0C,oBACD,CAAC,EACJ3C,QAAQ,IAAI,CAACI,WAAW,GAAGJ,QAAQ,GAAG,IACzC,CAAC;AAEX,CAAC;AAED,SAASD,kBAAkB","ignoreList":[]}

package/Table/Table.d.ts

@@ -9,10 +9,10 @@ interface TableProps extends React.HTMLAttributes<HTMLTableElement>, VariantProp
 declare const Table: (({ className, bordered, sticky, ...props }: TableProps) => React.JSX.Element) & {
     Body: ({ className, ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => React.JSX.Element;
     Caption: ({ className, ...props }: React.HTMLAttributes<HTMLTableCaptionElement>) => React.JSX.Element;
-    Cell: ({ className, ...props }: React.TdHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
+    Cell: ({ className, truncate, ...props }: import("~/Table/components/index.js").CellProps) => React.JSX.Element;
     Direction: ({ className, direction }: import("~/Table/components/index.js").DirectionProps) => React.JSX.Element | null;
     Footer: ({ className, ...props }: React.HTMLAttributes<HTMLTableSectionElement>) => React.JSX.Element;
-    Head: ({ className, children, ...props }: React.ThHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
+    Head: ({ className, children, truncate, ...props }: import("~/Table/components/index.js").HeadProps) => React.JSX.Element;
     Header: ({ className, sticky, ...props }: import("~/Table/components/index.js").HeaderProps) => React.JSX.Element;
     Resizer: ({ className, isResizing, ...props }: import("~/Table/components/index.js").ResizerProps) => React.JSX.Element;
     Row: ({ className, selected, ...props }: import("~/Table/components/index.js").RowProps) => React.JSX.Element;

package/Table/components/Cell.d.ts

@@ -1,3 +1,6 @@
 import * as React from "react";
-declare const Cell: ({ className, ...props }: React.TdHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
+export interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {
+    truncate?: boolean;
+}
+declare const Cell: ({ className, truncate, ...props }: CellProps) => React.JSX.Element;
 export { Cell };

package/Table/components/Cell.js

@@ -2,9 +2,12 @@ import * as React from "react";
 import { cn } from "../../utils.js";
 const Cell = ({
   className,
+  truncate = true,
   ...props
 }) => /*#__PURE__*/React.createElement("td", Object.assign({
-  className: cn(["box-border px-md py-sm-extra text-md text-left align-middle text-neutral-primary", "overflow-hidden whitespace-nowrap truncate", "[&:has([role=checkbox])]:pl-lg", "leading-none"], className)
+  className: cn(["box-border px-md py-sm-extra text-md text-left align-middle text-neutral-primary", "overflow-hidden whitespace-nowrap", "[&:has([role=checkbox])]:pl-lg", "leading-none"], {
+    truncate
+  }, className)
 }, props));
 export { Cell };
 

package/Table/components/Cell.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","Cell","className","props","createElement","Object","assign"],"sources":["Cell.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\n\nconst Cell = ({ className, ...props }: React.TdHTMLAttributes<HTMLTableCellElement>) => (\n    <td\n        className={cn(\n            [\n                \"box-border px-md py-sm-extra text-md text-left align-middle text-neutral-primary\",\n                \"overflow-hidden whitespace-nowrap truncate\",\n                \"[&:has([role=checkbox])]:pl-lg\",\n                \"leading-none\"\n            ],\n            className\n        )}\n        {...props}\n    />\n);\n\nexport { Cell };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AAEX,MAAMC,IAAI,GAAGA,CAAC;EAAEC,SAAS;EAAE,GAAGC;AAAoD,CAAC,kBAC/EJ,KAAA,CAAAK,aAAA,OAAAC,MAAA,CAAAC,MAAA;EACIJ,SAAS,EAAEF,EAAE,CACT,CACI,kFAAkF,EAClF,4CAA4C,EAC5C,gCAAgC,EAChC,cAAc,CACjB,EACDE,SACJ;AAAE,GACEC,KAAK,CACZ,CACJ;AAED,SAASF,IAAI","ignoreList":[]}
+{"version":3,"names":["React","cn","Cell","className","truncate","props","createElement","Object","assign"],"sources":["Cell.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\n\nexport interface CellProps extends React.TdHTMLAttributes<HTMLTableCellElement> {\n    truncate?: boolean;\n}\n\nconst Cell = ({ className, truncate = true, ...props }: CellProps) => (\n    <td\n        className={cn(\n            [\n                \"box-border px-md py-sm-extra text-md text-left align-middle text-neutral-primary\",\n                \"overflow-hidden whitespace-nowrap\",\n                \"[&:has([role=checkbox])]:pl-lg\",\n                \"leading-none\"\n            ],\n            { truncate },\n            className\n        )}\n        {...props}\n    />\n);\n\nexport { Cell };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AAMX,MAAMC,IAAI,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ,GAAG,IAAI;EAAE,GAAGC;AAAiB,CAAC,kBAC7DL,KAAA,CAAAM,aAAA,OAAAC,MAAA,CAAAC,MAAA;EACIL,SAAS,EAAEF,EAAE,CACT,CACI,kFAAkF,EAClF,mCAAmC,EACnC,gCAAgC,EAChC,cAAc,CACjB,EACD;IAAEG;EAAS,CAAC,EACZD,SACJ;AAAE,GACEE,KAAK,CACZ,CACJ;AAED,SAASH,IAAI","ignoreList":[]}

package/Table/components/Head.d.ts

@@ -1,3 +1,6 @@
 import * as React from "react";
-declare const Head: ({ className, children, ...props }: React.ThHTMLAttributes<HTMLTableCellElement>) => React.JSX.Element;
+export interface HeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {
+    truncate?: boolean;
+}
+declare const Head: ({ className, children, truncate, ...props }: HeadProps) => React.JSX.Element;
 export { Head };

package/Table/components/Head.js

@@ -3,9 +3,12 @@ import { cn } from "../../utils.js";
 const Head = ({
   className,
   children,
+  truncate = true,
   ...props
 }) => /*#__PURE__*/React.createElement("th", Object.assign({
-  className: cn(["box-border relative px-md py-sm text-sm text-left align-middle font-normal text-neutral-strong fill-neutral-xstrong", "hover:bg-neutral-subtle", "overflow-hidden whitespace-nowrap truncate", "[&:has([role=checkbox])]:pl-lg", "leading-none"], className)
+  className: cn(["box-border relative px-md py-sm text-sm text-left align-middle font-normal text-neutral-strong fill-neutral-xstrong", "hover:bg-neutral-subtle", "overflow-hidden whitespace-nowrap", "[&:has([role=checkbox])]:pl-lg", "leading-none"], {
+    truncate
+  }, className)
 }, props), children);
 export { Head };
 

package/Table/components/Head.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","cn","Head","className","children","props","createElement","Object","assign"],"sources":["Head.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\n\nconst Head = ({ className, children, ...props }: React.ThHTMLAttributes<HTMLTableCellElement>) => (\n    <th\n        className={cn(\n            [\n                \"box-border relative px-md py-sm text-sm text-left align-middle font-normal text-neutral-strong fill-neutral-xstrong\",\n                \"hover:bg-neutral-subtle\",\n                \"overflow-hidden whitespace-nowrap truncate\",\n                \"[&:has([role=checkbox])]:pl-lg\",\n                \"leading-none\"\n            ],\n            className\n        )}\n        {...props}\n    >\n        {children}\n    </th>\n);\n\nexport { Head };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AAEX,MAAMC,IAAI,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAE,GAAGC;AAAoD,CAAC,kBACzFL,KAAA,CAAAM,aAAA,OAAAC,MAAA,CAAAC,MAAA;EACIL,SAAS,EAAEF,EAAE,CACT,CACI,qHAAqH,EACrH,yBAAyB,EACzB,4CAA4C,EAC5C,gCAAgC,EAChC,cAAc,CACjB,EACDE,SACJ;AAAE,GACEE,KAAK,GAERD,QACD,CACP;AAED,SAASF,IAAI","ignoreList":[]}
+{"version":3,"names":["React","cn","Head","className","children","truncate","props","createElement","Object","assign"],"sources":["Head.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { cn } from \"~/utils.js\";\n\nexport interface HeadProps extends React.ThHTMLAttributes<HTMLTableCellElement> {\n    truncate?: boolean;\n}\n\nconst Head = ({ className, children, truncate = true, ...props }: HeadProps) => (\n    <th\n        className={cn(\n            [\n                \"box-border relative px-md py-sm text-sm text-left align-middle font-normal text-neutral-strong fill-neutral-xstrong\",\n                \"hover:bg-neutral-subtle\",\n                \"overflow-hidden whitespace-nowrap\",\n                \"[&:has([role=checkbox])]:pl-lg\",\n                \"leading-none\"\n            ],\n            { truncate },\n            className\n        )}\n        {...props}\n    >\n        {children}\n    </th>\n);\n\nexport { Head };\n"],"mappings":"AAAA,OAAO,KAAKA,KAAK,MAAM,OAAO;AAC9B,SAASC,EAAE;AAMX,MAAMC,IAAI,GAAGA,CAAC;EAAEC,SAAS;EAAEC,QAAQ;EAAEC,QAAQ,GAAG,IAAI;EAAE,GAAGC;AAAiB,CAAC,kBACvEN,KAAA,CAAAO,aAAA,OAAAC,MAAA,CAAAC,MAAA;EACIN,SAAS,EAAEF,EAAE,CACT,CACI,qHAAqH,EACrH,yBAAyB,EACzB,mCAAmC,EACnC,gCAAgC,EAChC,cAAc,CACjB,EACD;IAAEI;EAAS,CAAC,EACZF,SACJ;AAAE,GACEG,KAAK,GAERF,QACD,CACP;AAED,SAASF,IAAI","ignoreList":[]}

package/Tag/Tag.js

@@ -6,7 +6,7 @@ import { IconButton } from "../Button/index.js";
 import { TagPropsProvider } from "./TagPropsProvider.js";
 import { TagSwatchBox } from "./TagSwatchBox.js";
 import { TagIcon } from "./TagIcon.js";
-const tagVariants = cva(["inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden", "focus:outline-none"], {
+const tagVariants = cva(["inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden", "focus:outline-none", "h-[20px]"], {
   variants: {
     isInteractive: {
       true: "cursor-pointer"

package/Tag/Tag.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","ReactComponent","Close","cn","cva","makeDecoratable","omit","Icon","IconButton","TagPropsProvider","TagSwatchBox","TagIcon","tagVariants","variants","isInteractive","true","isDismissible","false","isDisabled","variant","accent","success","warning","destructive","defaultVariants","DecoratableTag","props","className","content","onClick","onDismiss","dismissIconElement","createElement","dismissIconLabel","disabled","rootProps","dismissButtonVariant","useMemo","includes","dismissIconColor","Object","assign","Boolean","icon","label","color","size","event","stopPropagation","Tag"],"sources":["Tag.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as Close } from \"@webiny/icons/close.svg\";\nimport { cn, cva, makeDecoratable, omit, type VariantProps } from \"~/utils.js\";\nimport { Icon, type IconProps } from \"~/Icon/index.js\";\nimport type { iconButtonVariants } from \"~/Button/index.js\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { TagPropsProvider } from \"~/Tag/TagPropsProvider.js\";\nimport { TagSwatchBox } from \"./TagSwatchBox.js\";\nimport { TagIcon } from \"./TagIcon.js\";\n\nconst tagVariants = cva(\n    [\n        \"inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden\",\n        \"focus:outline-none\"\n    ],\n    {\n        variants: {\n            isInteractive: {\n                true: \"cursor-pointer\"\n            },\n            isDismissible: {\n                true: \"pl-xs-plus pt-xxs pb-xxs pr-xs\",\n                false: \"px-xs-plus py-xxs\"\n            },\n            isDisabled: {\n                true: \"cursor-not-allowed pointer-events-none\"\n            },\n            variant: {\n                \"neutral-base\": [\n                    \"bg-transparent text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-base-outline\": [\n                    \"border-sm border-solid px-[calc(var(--padding-xs-plus)-(var(--border-width-sm)))] py-[calc(var(--padding-xxs)-(var(--border-width-sm)))]\",\n                    \"bg-neutral-base border-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:border-neutral-dimmed aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-light\": [\n                    \"bg-neutral-light text-neutral-primary\",\n                    \"hover:bg-neutral-muted\",\n                    \"aria-disabled:bg-neutral-light aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-muted\": [\n                    \"bg-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-strong\",\n                    \"aria-disabled:bg-neutral-muted aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-strong\": [\n                    \"bg-neutral-strong text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-muted\"\n                ],\n                \"neutral-xstrong\": [\n                    \"bg-neutral-xstrong text-neutral-light\",\n                    \"hover:bg-neutral-dark\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                \"neutral-dark\": [\n                    \"bg-neutral-dark text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                accent: [\n                    \"bg-primary text-neutral-light\",\n                    \"hover:bg-primary-strong\",\n                    \"aria-disabled:bg-primary-disabled\"\n                ],\n                \"accent-light\": [\n                    \"bg-primary-subtle text-neutral-primary\",\n                    \"hover:bg-primary-muted\",\n                    \"aria-disabled:bg-primary-subtle aria-disabled:text-neutral-muted\"\n                ],\n                success: [\n                    \"bg-success text-neutral-light\",\n                    \"hover:bg-success-strong\",\n                    \"aria-disabled:bg-success-disabled\"\n                ],\n                \"success-light\": [\n                    \"bg-success-subtle text-neutral-primary\",\n                    \"hover:bg-success-muted\",\n                    \"aria-disabled:bg-success-subtle aria-disabled:text-neutral-muted\"\n                ],\n                warning: [\n                    \"bg-warning-muted text-neutral-primary\",\n                    \"hover:bg-warning\",\n                    \"aria-disabled:bg-warning-disabled aria-disabled:text-neutral-disabled\"\n                ],\n                destructive: [\n                    \"bg-destructive text-neutral-light\",\n                    \"hover:bg-destructive-strong\",\n                    \"aria-disabled:bg-destructive-disabled\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"neutral-base\"\n        }\n    }\n);\n\nexport interface TagProps\n    extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\" | \"content\">,\n        VariantProps<typeof tagVariants> {\n    content: React.ReactNode;\n    onDismiss?: (event: React.SyntheticEvent<HTMLSpanElement>) => void;\n    dismissIconElement?: React.ReactElement;\n    dismissIconLabel?: string;\n    swatchColor?: string;\n    swatchColorIcon?: boolean;\n    icon?: React.ReactElement | null;\n    disabled?: boolean;\n}\n\nconst DecoratableTag = (props: TagProps) => {\n    const {\n        className,\n        variant,\n        content,\n        onClick,\n        onDismiss,\n        dismissIconElement = <Close />,\n        dismissIconLabel = \"Close\",\n        disabled,\n        ...rootProps\n    } = omit(props, [\"icon\", \"swatchColor\", \"swatchColorIcon\"]);\n\n    const dismissButtonVariant = React.useMemo((): VariantProps<\n        typeof iconButtonVariants\n    >[\"variant\"] => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"accent\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"ghost-negative\";\n        }\n\n        return \"ghost\";\n    }, [variant]);\n\n    const dismissIconColor: IconProps[\"color\"] = React.useMemo(() => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"accent\",\n                \"success\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"neutral-negative\";\n        }\n\n        if (variant && [\"warning\"].includes(variant)) {\n            return \"neutral-strong\";\n        }\n\n        return \"neutral-strong-transparent\";\n    }, [variant]);\n\n    return (\n        <TagPropsProvider props={props}>\n            <span\n                {...rootProps}\n                onClick={onClick}\n                className={cn(\n                    tagVariants({\n                        variant,\n                        isDismissible: Boolean(onDismiss),\n                        isInteractive: Boolean(onClick),\n                        isDisabled: Boolean(disabled)\n                    }),\n                    className\n                )}\n                aria-disabled={disabled}\n            >\n                <TagSwatchBox />\n                <TagIcon />\n                <span className={\"overflow-hidden truncate whitespace-nowrap\"}>{content}</span>\n                {onDismiss && (\n                    <IconButton\n                        icon={\n                            <Icon\n                                icon={dismissIconElement}\n                                label={dismissIconLabel}\n                                color={dismissIconColor}\n                                size={\"sm\"}\n                            />\n                        }\n                        size={\"xxs\"}\n                        variant={dismissButtonVariant}\n                        disabled={disabled}\n                        onClick={event => {\n                            event.stopPropagation();\n                            onDismiss(event);\n                        }}\n                    />\n                )}\n            </span>\n        </TagPropsProvider>\n    );\n};\nconst Tag = makeDecoratable(\"Tag\", DecoratableTag);\n\nexport { Tag };\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["React","ReactComponent","Close","cn","cva","makeDecoratable","omit","Icon","IconButton","TagPropsProvider","TagSwatchBox","TagIcon","tagVariants","variants","isInteractive","true","isDismissible","false","isDisabled","variant","accent","success","warning","destructive","defaultVariants","DecoratableTag","props","className","content","onClick","onDismiss","dismissIconElement","createElement","dismissIconLabel","disabled","rootProps","dismissButtonVariant","useMemo","includes","dismissIconColor","Object","assign","Boolean","icon","label","color","size","event","stopPropagation","Tag"],"sources":["Tag.tsx"],"sourcesContent":["import * as React from \"react\";\nimport { ReactComponent as Close } from \"@webiny/icons/close.svg\";\nimport { cn, cva, makeDecoratable, omit, type VariantProps } from \"~/utils.js\";\nimport { Icon, type IconProps } from \"~/Icon/index.js\";\nimport type { iconButtonVariants } from \"~/Button/index.js\";\nimport { IconButton } from \"~/Button/index.js\";\nimport { TagPropsProvider } from \"~/Tag/TagPropsProvider.js\";\nimport { TagSwatchBox } from \"./TagSwatchBox.js\";\nimport { TagIcon } from \"./TagIcon.js\";\n\nconst tagVariants = cva(\n    [\n        \"inline-flex items-center gap-xxs rounded-sm text-sm text-regular transition-colors overflow-hidden\",\n        \"focus:outline-none\",\n        \"h-[20px]\"\n    ],\n    {\n        variants: {\n            isInteractive: {\n                true: \"cursor-pointer\"\n            },\n            isDismissible: {\n                true: \"pl-xs-plus pt-xxs pb-xxs pr-xs\",\n                false: \"px-xs-plus py-xxs\"\n            },\n            isDisabled: {\n                true: \"cursor-not-allowed pointer-events-none\"\n            },\n            variant: {\n                \"neutral-base\": [\n                    \"bg-transparent text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-base-outline\": [\n                    \"border-sm border-solid px-[calc(var(--padding-xs-plus)-(var(--border-width-sm)))] py-[calc(var(--padding-xxs)-(var(--border-width-sm)))]\",\n                    \"bg-neutral-base border-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-light\",\n                    \"aria-disabled:bg-transparent aria-disabled:border-neutral-dimmed aria-disabled:text-neutral-disabled\"\n                ],\n                \"neutral-light\": [\n                    \"bg-neutral-light text-neutral-primary\",\n                    \"hover:bg-neutral-muted\",\n                    \"aria-disabled:bg-neutral-light aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-muted\": [\n                    \"bg-neutral-muted text-neutral-primary\",\n                    \"hover:bg-neutral-strong\",\n                    \"aria-disabled:bg-neutral-muted aria-disabled:text-neutral-muted\"\n                ],\n                \"neutral-strong\": [\n                    \"bg-neutral-strong text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-muted\"\n                ],\n                \"neutral-xstrong\": [\n                    \"bg-neutral-xstrong text-neutral-light\",\n                    \"hover:bg-neutral-dark\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                \"neutral-dark\": [\n                    \"bg-neutral-dark text-neutral-light\",\n                    \"hover:bg-neutral-xstrong\",\n                    \"aria-disabled:bg-neutral-strong\"\n                ],\n                accent: [\n                    \"bg-primary text-neutral-light\",\n                    \"hover:bg-primary-strong\",\n                    \"aria-disabled:bg-primary-disabled\"\n                ],\n                \"accent-light\": [\n                    \"bg-primary-subtle text-neutral-primary\",\n                    \"hover:bg-primary-muted\",\n                    \"aria-disabled:bg-primary-subtle aria-disabled:text-neutral-muted\"\n                ],\n                success: [\n                    \"bg-success text-neutral-light\",\n                    \"hover:bg-success-strong\",\n                    \"aria-disabled:bg-success-disabled\"\n                ],\n                \"success-light\": [\n                    \"bg-success-subtle text-neutral-primary\",\n                    \"hover:bg-success-muted\",\n                    \"aria-disabled:bg-success-subtle aria-disabled:text-neutral-muted\"\n                ],\n                warning: [\n                    \"bg-warning-muted text-neutral-primary\",\n                    \"hover:bg-warning\",\n                    \"aria-disabled:bg-warning-disabled aria-disabled:text-neutral-disabled\"\n                ],\n                destructive: [\n                    \"bg-destructive text-neutral-light\",\n                    \"hover:bg-destructive-strong\",\n                    \"aria-disabled:bg-destructive-disabled\"\n                ]\n            }\n        },\n        defaultVariants: {\n            variant: \"neutral-base\"\n        }\n    }\n);\n\nexport interface TagProps\n    extends Omit<React.HTMLAttributes<HTMLSpanElement>, \"children\" | \"content\">,\n        VariantProps<typeof tagVariants> {\n    content: React.ReactNode;\n    onDismiss?: (event: React.SyntheticEvent<HTMLSpanElement>) => void;\n    dismissIconElement?: React.ReactElement;\n    dismissIconLabel?: string;\n    swatchColor?: string;\n    swatchColorIcon?: boolean;\n    icon?: React.ReactElement | null;\n    disabled?: boolean;\n}\n\nconst DecoratableTag = (props: TagProps) => {\n    const {\n        className,\n        variant,\n        content,\n        onClick,\n        onDismiss,\n        dismissIconElement = <Close />,\n        dismissIconLabel = \"Close\",\n        disabled,\n        ...rootProps\n    } = omit(props, [\"icon\", \"swatchColor\", \"swatchColorIcon\"]);\n\n    const dismissButtonVariant = React.useMemo((): VariantProps<\n        typeof iconButtonVariants\n    >[\"variant\"] => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"success\",\n                \"accent\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"ghost-negative\";\n        }\n\n        return \"ghost\";\n    }, [variant]);\n\n    const dismissIconColor: IconProps[\"color\"] = React.useMemo(() => {\n        if (\n            variant &&\n            [\n                \"neutral-strong\",\n                \"neutral-xstrong\",\n                \"neutral-dark\",\n                \"accent\",\n                \"success\",\n                \"destructive\"\n            ].includes(variant)\n        ) {\n            return \"neutral-negative\";\n        }\n\n        if (variant && [\"warning\"].includes(variant)) {\n            return \"neutral-strong\";\n        }\n\n        return \"neutral-strong-transparent\";\n    }, [variant]);\n\n    return (\n        <TagPropsProvider props={props}>\n            <span\n                {...rootProps}\n                onClick={onClick}\n                className={cn(\n                    tagVariants({\n                        variant,\n                        isDismissible: Boolean(onDismiss),\n                        isInteractive: Boolean(onClick),\n                        isDisabled: Boolean(disabled)\n                    }),\n                    className\n                )}\n                aria-disabled={disabled}\n            >\n                <TagSwatchBox />\n                <TagIcon />\n                <span className={\"overflow-hidden truncate whitespace-nowrap\"}>{content}</span>\n                {onDismiss && (\n                    <IconButton\n                        icon={\n                            <Icon\n                                icon={dismissIconElement}\n                                label={dismissIconLabel}\n                                color={dismissIconColor}\n                                size={\"sm\"}\n                            />\n                        }\n                        size={\"xxs\"}\n                        variant={dismissButtonVariant}\n                        disabled={disabled}\n                        onClick={event => {\n                            event.stopPropagation();\n                            onDismiss(event);\n                        }}\n                    />\n                )}\n            </span>\n        </TagPropsProvider>\n    );\n};\nconst Tag = makeDecoratable(\"Tag\", DecoratableTag);\n\nexport { Tag };\n"],"mappings":"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","ignoreList":[]}

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@webiny/admin-ui",
-	"version": "6.1.0-beta.3",
+	"version": "6.2.0-beta.0",
 	"type": "module",
 	"main": "index.js",
 	"repository": {
@@ -16,19 +16,19 @@
 		"@monaco-editor/react": "4.7.0",
 		"@radix-ui/react-scroll-area": "1.2.10",
 		"@tanstack/react-table": "8.21.3",
-		"@webiny/icons": "6.1.0-beta.3",
-		"@webiny/react-composition": "6.1.0-beta.3",
-		"@webiny/utils": "6.1.0-beta.3",
+		"@webiny/icons": "6.2.0-beta.0",
+		"@webiny/react-composition": "6.2.0-beta.0",
+		"@webiny/utils": "6.2.0-beta.0",
 		"bytes": "3.1.2",
 		"class-variance-authority": "0.7.1",
 		"clsx": "2.1.1",
 		"cmdk": "1.1.1",
-		"lodash": "4.17.23",
-		"minimatch": "10.2.4",
+		"lodash": "4.18.1",
+		"minimatch": "10.2.5",
 		"mobx": "6.15.0",
 		"monaco-editor": "0.53.0",
 		"radix-ui": "1.4.3",
-		"react": "18.2.0",
+		"react": "18.3.1",
 		"react-color": "2.19.3",
 		"react-custom-scrollbars": "4.2.1",
 		"react-dnd": "16.0.1",
@@ -48,23 +48,23 @@
 		"@storybook/react-webpack5": "9.1.20",
 		"@svgr/webpack": "8.1.0",
 		"@tailwindcss/postcss": "4.2.2",
-		"@types/react": "18.2.79",
+		"@types/react": "18.3.28",
 		"@types/react-color": "3.0.13",
 		"@types/react-custom-scrollbars": "4.0.13",
 		"@types/react-virtualized": "9.22.3",
-		"@webiny/build-tools": "6.1.0-beta.3",
-		"@webiny/project": "6.1.0-beta.3",
+		"@webiny/build-tools": "6.2.0-beta.0",
+		"@webiny/project": "6.2.0-beta.0",
 		"chalk": "5.6.2",
 		"css-loader": "7.1.4",
-		"eslint-plugin-storybook": "10.3.3",
+		"eslint-plugin-storybook": "10.3.5",
 		"file-loader": "6.2.0",
 		"postcss-loader": "8.2.1",
 		"prettier": "3.6.2",
 		"rimraf": "6.1.3",
-		"sass": "1.98.0",
+		"sass": "1.99.0",
 		"storybook": "9.1.20",
 		"typescript": "5.9.3",
-		"vitest": "4.1.2"
+		"vitest": "4.1.4"
 	},
 	"publishConfig": {
 		"access": "public",
@@ -84,5 +84,5 @@
 			]
 		}
 	},
-	"gitHead": "65e0ac1889b3392c99b8cac6cde508e1e831c715"
+	"gitHead": "3d3148358b6febbc857371930871743bec3b3939"
 }