@coveord/plasma-mantine 56.8.0 → 56.9.0

package/dist/esm/components/Table/table-columns-selector/TableColumnsSelector.js

@@ -1,99 +1,109 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Button, Checkbox, Divider, factory, Grid, Popover, ScrollArea, Stack, Tooltip, useProps } from '@mantine/core';
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { IconSettings } from '@coveord/plasma-react-icons';
+import { Checkbox, Combobox, Text, Tooltip, useCombobox } from '@mantine/core';
 import { flexRender } from '@tanstack/react-table';
-import { TableComponentsOrder } from '../Table.js';
-import { useTableContext } from '../TableContext.js';
-const defaultProps = {
-    label: 'Edit columns',
-    buttonVariant: 'outline',
+import { ActionIcon } from '../../ActionIcon/ActionIcon';
+const DEFAULT_OPTIONS = {
+    footer: (max)=>`You can display up to ${max} columns.`,
     limitReachedTooltip: 'You have reached the maximum display limit.',
-    alwaysVisibleTooltip: 'This column is always visible.',
-    showVisibleCountLabel: false
+    alwaysVisibleTooltip: 'This column is always visible.'
 };
-export const TableColumnsSelector = factory((props, ref)=>{
-    const { getStyles } = useTableContext();
-    const { label, buttonVariant, showVisibleCountLabel, maxSelectableColumns, footer, limitReachedTooltip, alwaysVisibleTooltip, classNames, className, styles, style, vars, ...others } = useProps('TableColumnsSelector', defaultProps, props);
-    const { table } = useTableContext();
+export const TableColumnsSelectorHeader = ({ table, options })=>{
+    const { maxSelectableColumns, footer, limitReachedTooltip, alwaysVisibleTooltip } = {
+        ...DEFAULT_OPTIONS,
+        ...options
+    };
+    const combobox = useCombobox({
+        onDropdownClose: ()=>{
+            combobox.resetSelectedOption();
+        },
+        onDropdownOpen: ()=>combobox.updateSelectedOptionIndex('active')
+    });
     const allColumns = table.getAllLeafColumns();
     const filteredColumns = allColumns.filter((column)=>!column.columnDef.meta?.controlColumn);
     const selectedColumnsCount = filteredColumns.filter((column)=>column.getIsVisible()).length;
+    // Validate maxSelectableColumns - must be a positive integer to be effective
+    const effectiveMaxColumns = maxSelectableColumns !== undefined && maxSelectableColumns > 0 ? maxSelectableColumns : undefined;
     if (filteredColumns.length <= 0) {
         return null;
     }
-    const stylesApiProps = {
-        classNames,
-        styles
+    const getColumnState = (column)=>{
+        const alwaysVisible = !column.getCanHide();
+        const isDisabled = effectiveMaxColumns !== undefined && selectedColumnsCount >= effectiveMaxColumns && !column.getIsVisible() || alwaysVisible;
+        const isVisible = column.getIsVisible() || alwaysVisible;
+        return {
+            alwaysVisible,
+            isDisabled,
+            isVisible
+        };
     };
-    return /*#__PURE__*/ _jsx(Grid.Col, {
-        span: "content",
-        order: TableComponentsOrder.ColumnsSelector,
-        ...getStyles('columnSelector', {
-            className,
-            style,
-            ...stylesApiProps
-        }),
-        ...others,
-        children: /*#__PURE__*/ _jsxs(Popover, {
-            withinPortal: true,
-            position: "bottom",
-            shadow: "md",
-            children: [
-                /*#__PURE__*/ _jsx(Popover.Target, {
-                    children: /*#__PURE__*/ _jsxs(Button, {
-                        variant: buttonVariant,
-                        children: [
-                            label,
-                            showVisibleCountLabel ? ` (${selectedColumnsCount})` : ''
-                        ]
-                    })
-                }),
-                /*#__PURE__*/ _jsxs(Popover.Dropdown, {
-                    miw: 240,
-                    children: [
-                        /*#__PURE__*/ _jsx(ScrollArea.Autosize, {
-                            mah: 154,
-                            children: /*#__PURE__*/ _jsx(Stack, {
-                                ...getStyles('columnSelectorWrapper', stylesApiProps),
-                                children: filteredColumns.map((column)=>{
-                                    const alwaysVisible = !column.getCanHide();
-                                    const isDisabled = selectedColumnsCount >= maxSelectableColumns && !column.getIsVisible() || alwaysVisible;
-                                    return /*#__PURE__*/ _jsx(Tooltip, {
-                                        label: alwaysVisible ? alwaysVisibleTooltip : limitReachedTooltip,
-                                        disabled: !isDisabled,
-                                        position: "left",
-                                        children: /*#__PURE__*/ _jsx("div", {
-                                            children: /*#__PURE__*/ _jsx(Checkbox, {
-                                                label: flexRender(column.columnDef.header, {
-                                                    table,
-                                                    column,
-                                                    header: {
-                                                        column
-                                                    }
-                                                }),
-                                                name: column.id,
-                                                checked: column.getIsVisible() || alwaysVisible,
-                                                disabled: isDisabled,
-                                                onChange: column.getToggleVisibilityHandler()
-                                            }, column.id)
-                                        })
-                                    }, column.id);
-                                })
-                            })
+    const handleOptionClick = (columnId)=>{
+        const column = filteredColumns.find((col)=>col.id === columnId);
+        if (column) {
+            const { isDisabled } = getColumnState(column);
+            if (!isDisabled) {
+                column.toggleVisibility();
+            }
+        }
+    };
+    const columnOptions = filteredColumns.map((column)=>{
+        const { alwaysVisible, isDisabled, isVisible } = getColumnState(column);
+        return /*#__PURE__*/ _jsx(Combobox.Option, {
+            value: column.id,
+            disabled: isDisabled,
+            active: isVisible,
+            children: /*#__PURE__*/ _jsx(Tooltip, {
+                label: alwaysVisible ? alwaysVisibleTooltip : limitReachedTooltip,
+                disabled: !isDisabled,
+                position: "left",
+                children: /*#__PURE__*/ _jsx("div", {
+                    children: /*#__PURE__*/ _jsx(Checkbox, {
+                        checked: isVisible,
+                        label: flexRender(column.columnDef.header, {
+                            table,
+                            column,
+                            header: {
+                                column
+                            }
                         }),
-                        maxSelectableColumns && /*#__PURE__*/ _jsxs(_Fragment, {
-                            children: [
-                                /*#__PURE__*/ _jsx(Divider, {
-                                    mb: "xs",
-                                    mt: "sm"
-                                }),
-                                footer
-                            ]
-                        })
-                    ]
+                        disabled: isDisabled
+                    })
                 })
-            ]
-        })
+            })
+        }, column.id);
     });
-});
+    return /*#__PURE__*/ _jsxs(Combobox, {
+        store: combobox,
+        position: "bottom-end",
+        shadow: "md",
+        onOptionSubmit: handleOptionClick,
+        children: [
+            /*#__PURE__*/ _jsx(Combobox.Target, {
+                children: /*#__PURE__*/ _jsx(ActionIcon.Tertiary, {
+                    onClick: ()=>combobox.toggleDropdown(),
+                    "aria-label": "settings",
+                    children: /*#__PURE__*/ _jsx(IconSettings, {
+                        height: 16
+                    })
+                })
+            }),
+            /*#__PURE__*/ _jsxs(Combobox.Dropdown, {
+                miw: 270,
+                children: [
+                    /*#__PURE__*/ _jsx(Combobox.Options, {
+                        children: columnOptions
+                    }),
+                    effectiveMaxColumns && /*#__PURE__*/ _jsx(Combobox.Footer, {
+                        children: /*#__PURE__*/ _jsx(Text, {
+                            size: "sm",
+                            c: "dimmed",
+                            children: typeof footer === 'function' ? footer(effectiveMaxColumns) : footer
+                        })
+                    })
+                ]
+            })
+        ]
+    });
+};
 
 //# sourceMappingURL=TableColumnsSelector.js.map

package/dist/esm/components/Table/table-columns-selector/TableColumnsSelector.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../../src/components/Table/table-columns-selector/TableColumnsSelector.tsx"],"sourcesContent":["import {\n    BoxProps,\n    Button,\n    Checkbox,\n    CompoundStylesApiProps,\n    Divider,\n    factory,\n    Factory,\n    Grid,\n    Popover,\n    ScrollArea,\n    Stack,\n    Tooltip,\n    useProps,\n} from '@mantine/core';\nimport {flexRender, Header} from '@tanstack/react-table';\nimport {ReactNode} from 'react';\nimport {TableComponentsOrder} from '../Table.js';\nimport {useTableContext} from '../TableContext.js';\n\nexport type TableColumnsSelectorStylesNames = 'columnSelector' | 'columnSelectorWrapper';\n\nexport interface TableColumnsSelectorProps extends BoxProps, CompoundStylesApiProps<TableColumnsSelectorFactory> {\n    /**\n     * The label of the button\n     * @default 'Edit columns'\n     */\n    label?: ReactNode;\n    /**\n     * The style variant of the button\n     * @default 'outline'\n     */\n    buttonVariant?: string;\n    /**\n     * Whether the count of visible columns is shown in the button label.\n     * @default false\n     */\n    showVisibleCountLabel?: boolean;\n    /**\n     * The maximum number of columns that can be selected at the same time.\n     * If defined a footer will render with the remaining number of columns that can be selected.\n     */\n    maxSelectableColumns?: number;\n    /**\n     * The content to display in the footer when maxSelectableColumns is defined.\n     */\n    footer?: ReactNode;\n    /**\n     * The tooltip to display when the user hovers over a disabled checkbox because of the limit.\n     * @default 'You have reached the maximum display limit.'\n     */\n    limitReachedTooltip?: string;\n    /**\n     * The tooltip to display when the user hovers over a disabled checkbox because a column cannot be hidden.\n     * @default 'This column is always visible.'\n     */\n    alwaysVisibleTooltip?: string;\n}\n\nexport type TableColumnsSelectorFactory = Factory<{\n    props: TableColumnsSelectorProps;\n    ref: HTMLDivElement;\n    stylesNames: TableColumnsSelectorStylesNames;\n    compound: true;\n}>;\n\nconst defaultProps: Partial<TableColumnsSelectorProps> = {\n    label: 'Edit columns',\n    buttonVariant: 'outline',\n    limitReachedTooltip: 'You have reached the maximum display limit.',\n    alwaysVisibleTooltip: 'This column is always visible.',\n    showVisibleCountLabel: false,\n};\n\nexport const TableColumnsSelector = factory<TableColumnsSelectorFactory>((props, ref) => {\n    const {getStyles} = useTableContext();\n    const {\n        label,\n        buttonVariant,\n        showVisibleCountLabel,\n        maxSelectableColumns,\n        footer,\n        limitReachedTooltip,\n        alwaysVisibleTooltip,\n        classNames,\n        className,\n        styles,\n        style,\n        vars,\n        ...others\n    } = useProps('TableColumnsSelector', defaultProps, props);\n    const {table} = useTableContext();\n\n    const allColumns = table.getAllLeafColumns();\n\n    const filteredColumns = allColumns.filter((column) => !column.columnDef.meta?.controlColumn);\n    const selectedColumnsCount = filteredColumns.filter((column) => column.getIsVisible()).length;\n\n    if (filteredColumns.length <= 0) {\n        return null;\n    }\n\n    const stylesApiProps = {classNames, styles};\n\n    return (\n        <Grid.Col\n            span=\"content\"\n            order={TableComponentsOrder.ColumnsSelector}\n            {...getStyles('columnSelector', {className, style, ...stylesApiProps})}\n            {...others}\n        >\n            <Popover withinPortal position=\"bottom\" shadow=\"md\">\n                <Popover.Target>\n                    <Button variant={buttonVariant}>\n                        {label}\n                        {showVisibleCountLabel ? ` (${selectedColumnsCount})` : ''}\n                    </Button>\n                </Popover.Target>\n                <Popover.Dropdown miw={240}>\n                    <ScrollArea.Autosize mah={154}>\n                        <Stack {...getStyles('columnSelectorWrapper', stylesApiProps)}>\n                            {filteredColumns.map((column) => {\n                                const alwaysVisible = !column.getCanHide();\n                                const isDisabled =\n                                    (selectedColumnsCount >= maxSelectableColumns && !column.getIsVisible()) ||\n                                    alwaysVisible;\n\n                                return (\n                                    <Tooltip\n                                        label={alwaysVisible ? alwaysVisibleTooltip : limitReachedTooltip}\n                                        disabled={!isDisabled}\n                                        position=\"left\"\n                                        key={column.id}\n                                    >\n                                        <div>\n                                            <Checkbox\n                                                key={column.id}\n                                                label={flexRender(column.columnDef.header, {\n                                                    table,\n                                                    column,\n                                                    header: {column} as Header<unknown, unknown>,\n                                                })}\n                                                name={column.id}\n                                                checked={column.getIsVisible() || alwaysVisible}\n                                                disabled={isDisabled}\n                                                onChange={column.getToggleVisibilityHandler()}\n                                            />\n                                        </div>\n                                    </Tooltip>\n                                );\n                            })}\n                        </Stack>\n                    </ScrollArea.Autosize>\n                    {maxSelectableColumns && (\n                        <>\n                            <Divider mb=\"xs\" mt=\"sm\" />\n                            {footer}\n                        </>\n                    )}\n                </Popover.Dropdown>\n            </Popover>\n        </Grid.Col>\n    );\n});\n"],"names":["Button","Checkbox","Divider","factory","Grid","Popover","ScrollArea","Stack","Tooltip","useProps","flexRender","TableComponentsOrder","useTableContext","defaultProps","label","buttonVariant","limitReachedTooltip","alwaysVisibleTooltip","showVisibleCountLabel","TableColumnsSelector","props","ref","getStyles","maxSelectableColumns","footer","classNames","className","styles","style","vars","others","table","allColumns","getAllLeafColumns","filteredColumns","filter","column","columnDef","meta","controlColumn","selectedColumnsCount","getIsVisible","length","stylesApiProps","Col","span","order","ColumnsSelector","withinPortal","position","shadow","Target","variant","Dropdown","miw","Autosize","mah","map","alwaysVisible","getCanHide","isDisabled","disabled","div","header","name","id","checked","onChange","getToggleVisibilityHandler","mb","mt"],"mappings":";AAAA,SAEIA,MAAM,EACNC,QAAQ,EAERC,OAAO,EACPC,OAAO,EAEPC,IAAI,EACJC,OAAO,EACPC,UAAU,EACVC,KAAK,EACLC,OAAO,EACPC,QAAQ,QACL,gBAAgB;AACvB,SAAQC,UAAU,QAAe,wBAAwB;AAEzD,SAAQC,oBAAoB,QAAO,cAAc;AACjD,SAAQC,eAAe,QAAO,qBAAqB;AAgDnD,MAAMC,eAAmD;IACrDC,OAAO;IACPC,eAAe;IACfC,qBAAqB;IACrBC,sBAAsB;IACtBC,uBAAuB;AAC3B;AAEA,OAAO,MAAMC,uBAAuBhB,QAAqC,CAACiB,OAAOC;IAC7E,MAAM,EAACC,SAAS,EAAC,GAAGV;IACpB,MAAM,EACFE,KAAK,EACLC,aAAa,EACbG,qBAAqB,EACrBK,oBAAoB,EACpBC,MAAM,EACNR,mBAAmB,EACnBC,oBAAoB,EACpBQ,UAAU,EACVC,SAAS,EACTC,MAAM,EACNC,KAAK,EACLC,IAAI,EACJ,GAAGC,QACN,GAAGrB,SAAS,wBAAwBI,cAAcO;IACnD,MAAM,EAACW,KAAK,EAAC,GAAGnB;IAEhB,MAAMoB,aAAaD,MAAME,iBAAiB;IAE1C,MAAMC,kBAAkBF,WAAWG,MAAM,CAAC,CAACC,SAAW,CAACA,OAAOC,SAAS,CAACC,IAAI,EAAEC;IAC9E,MAAMC,uBAAuBN,gBAAgBC,MAAM,CAAC,CAACC,SAAWA,OAAOK,YAAY,IAAIC,MAAM;IAE7F,IAAIR,gBAAgBQ,MAAM,IAAI,GAAG;QAC7B,OAAO;IACX;IAEA,MAAMC,iBAAiB;QAAClB;QAAYE;IAAM;IAE1C,qBACI,KAACvB,KAAKwC,GAAG;QACLC,MAAK;QACLC,OAAOnC,qBAAqBoC,eAAe;QAC1C,GAAGzB,UAAU,kBAAkB;YAACI;YAAWE;YAAO,GAAGe,cAAc;QAAA,EAAE;QACrE,GAAGb,MAAM;kBAEV,cAAA,MAACzB;YAAQ2C,YAAY;YAACC,UAAS;YAASC,QAAO;;8BAC3C,KAAC7C,QAAQ8C,MAAM;8BACX,cAAA,MAACnD;wBAAOoD,SAASrC;;4BACZD;4BACAI,wBAAwB,CAAC,EAAE,EAAEsB,qBAAqB,CAAC,CAAC,GAAG;;;;8BAGhE,MAACnC,QAAQgD,QAAQ;oBAACC,KAAK;;sCACnB,KAAChD,WAAWiD,QAAQ;4BAACC,KAAK;sCACtB,cAAA,KAACjD;gCAAO,GAAGe,UAAU,yBAAyBqB,eAAe;0CACxDT,gBAAgBuB,GAAG,CAAC,CAACrB;oCAClB,MAAMsB,gBAAgB,CAACtB,OAAOuB,UAAU;oCACxC,MAAMC,aACF,AAACpB,wBAAwBjB,wBAAwB,CAACa,OAAOK,YAAY,MACrEiB;oCAEJ,qBACI,KAAClD;wCACGM,OAAO4C,gBAAgBzC,uBAAuBD;wCAC9C6C,UAAU,CAACD;wCACXX,UAAS;kDAGT,cAAA,KAACa;sDACG,cAAA,KAAC7D;gDAEGa,OAAOJ,WAAW0B,OAAOC,SAAS,CAAC0B,MAAM,EAAE;oDACvChC;oDACAK;oDACA2B,QAAQ;wDAAC3B;oDAAM;gDACnB;gDACA4B,MAAM5B,OAAO6B,EAAE;gDACfC,SAAS9B,OAAOK,YAAY,MAAMiB;gDAClCG,UAAUD;gDACVO,UAAU/B,OAAOgC,0BAA0B;+CATtChC,OAAO6B,EAAE;;uCAJjB7B,OAAO6B,EAAE;gCAkB1B;;;wBAGP1C,sCACG;;8CACI,KAACrB;oCAAQmE,IAAG;oCAAKC,IAAG;;gCACnB9C;;;;;;;;AAO7B,GAAG"}
+{"version":3,"sources":["../../../../../src/components/Table/table-columns-selector/TableColumnsSelector.tsx"],"sourcesContent":["import {IconSettings} from '@coveord/plasma-react-icons';\nimport {Checkbox, Combobox, Text, Tooltip, useCombobox} from '@mantine/core';\nimport {flexRender, Header, Table} from '@tanstack/react-table';\nimport {ActionIcon} from '../../ActionIcon/ActionIcon';\n\nexport interface TableColumnsSelectorOptions {\n    /**\n     * The maximum number of columns that can be selected at the same time.\n     * If defined a footer will render with the remaining number of columns that can be selected.\n     * Must be a positive integer (greater than 0).\n     */\n    maxSelectableColumns?: number;\n    /**\n     * The content to display in the footer when maxSelectableColumns is defined.\n     * Can be a string or a function that receives the maxSelectableColumns value.\n     * @default (max) => `You can display up to ${max} columns.`\n     */\n    footer?: string | ((maxSelectableColumns: number) => string);\n    /**\n     * The tooltip to display when the user hovers over a disabled checkbox because of the limit.\n     * @default 'You have reached the maximum display limit.'\n     */\n    limitReachedTooltip?: string;\n    /**\n     * The tooltip to display when the user hovers over a disabled checkbox because a column cannot be hidden.\n     * @default 'This column is always visible.'\n     */\n    alwaysVisibleTooltip?: string;\n}\n\nexport interface TableColumnsSelectorHeaderProps {\n    table: Table<unknown>;\n    options?: TableColumnsSelectorOptions;\n}\n\nconst DEFAULT_OPTIONS: Omit<TableColumnsSelectorOptions, 'footer'> & {\n    footer: (maxSelectableColumns: number) => string;\n} = {\n    footer: (max) => `You can display up to ${max} columns.`,\n    limitReachedTooltip: 'You have reached the maximum display limit.',\n    alwaysVisibleTooltip: 'This column is always visible.',\n};\n\nexport const TableColumnsSelectorHeader = ({table, options}: TableColumnsSelectorHeaderProps) => {\n    const {maxSelectableColumns, footer, limitReachedTooltip, alwaysVisibleTooltip} = {\n        ...DEFAULT_OPTIONS,\n        ...options,\n    };\n\n    const combobox = useCombobox({\n        onDropdownClose: () => {\n            combobox.resetSelectedOption();\n        },\n        onDropdownOpen: () => combobox.updateSelectedOptionIndex('active'),\n    });\n\n    const allColumns = table.getAllLeafColumns();\n    const filteredColumns = allColumns.filter((column) => !column.columnDef.meta?.controlColumn);\n    const selectedColumnsCount = filteredColumns.filter((column) => column.getIsVisible()).length;\n\n    // Validate maxSelectableColumns - must be a positive integer to be effective\n    const effectiveMaxColumns =\n        maxSelectableColumns !== undefined && maxSelectableColumns > 0 ? maxSelectableColumns : undefined;\n\n    if (filteredColumns.length <= 0) {\n        return null;\n    }\n\n    const getColumnState = (column: (typeof filteredColumns)[number]) => {\n        const alwaysVisible = !column.getCanHide();\n        const isDisabled =\n            (effectiveMaxColumns !== undefined &&\n                selectedColumnsCount >= effectiveMaxColumns &&\n                !column.getIsVisible()) ||\n            alwaysVisible;\n        const isVisible = column.getIsVisible() || alwaysVisible;\n        return {alwaysVisible, isDisabled, isVisible};\n    };\n\n    const handleOptionClick = (columnId: string) => {\n        const column = filteredColumns.find((col) => col.id === columnId);\n        if (column) {\n            const {isDisabled} = getColumnState(column);\n            if (!isDisabled) {\n                column.toggleVisibility();\n            }\n        }\n    };\n\n    const columnOptions = filteredColumns.map((column) => {\n        const {alwaysVisible, isDisabled, isVisible} = getColumnState(column);\n\n        return (\n            <Combobox.Option value={column.id} key={column.id} disabled={isDisabled} active={isVisible}>\n                <Tooltip\n                    label={alwaysVisible ? alwaysVisibleTooltip : limitReachedTooltip}\n                    disabled={!isDisabled}\n                    position=\"left\"\n                >\n                    <div>\n                        <Checkbox\n                            checked={isVisible}\n                            label={flexRender(column.columnDef.header, {\n                                table,\n                                column,\n                                header: {column} as Header<unknown, unknown>,\n                            })}\n                            disabled={isDisabled}\n                        />\n                    </div>\n                </Tooltip>\n            </Combobox.Option>\n        );\n    });\n\n    return (\n        <Combobox store={combobox} position=\"bottom-end\" shadow=\"md\" onOptionSubmit={handleOptionClick}>\n            <Combobox.Target>\n                <ActionIcon.Tertiary onClick={() => combobox.toggleDropdown()} aria-label=\"settings\">\n                    <IconSettings height={16} />\n                </ActionIcon.Tertiary>\n            </Combobox.Target>\n            <Combobox.Dropdown miw={270}>\n                <Combobox.Options>{columnOptions}</Combobox.Options>\n                {effectiveMaxColumns && (\n                    <Combobox.Footer>\n                        <Text size=\"sm\" c=\"dimmed\">\n                            {typeof footer === 'function' ? footer(effectiveMaxColumns) : footer}\n                        </Text>\n                    </Combobox.Footer>\n                )}\n            </Combobox.Dropdown>\n        </Combobox>\n    );\n};\n"],"names":["IconSettings","Checkbox","Combobox","Text","Tooltip","useCombobox","flexRender","ActionIcon","DEFAULT_OPTIONS","footer","max","limitReachedTooltip","alwaysVisibleTooltip","TableColumnsSelectorHeader","table","options","maxSelectableColumns","combobox","onDropdownClose","resetSelectedOption","onDropdownOpen","updateSelectedOptionIndex","allColumns","getAllLeafColumns","filteredColumns","filter","column","columnDef","meta","controlColumn","selectedColumnsCount","getIsVisible","length","effectiveMaxColumns","undefined","getColumnState","alwaysVisible","getCanHide","isDisabled","isVisible","handleOptionClick","columnId","find","col","id","toggleVisibility","columnOptions","map","Option","value","disabled","active","label","position","div","checked","header","store","shadow","onOptionSubmit","Target","Tertiary","onClick","toggleDropdown","aria-label","height","Dropdown","miw","Options","Footer","size","c"],"mappings":"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"}

package/dist/esm/index.d.ts

@@ -41,10 +41,12 @@ export { Menu, type MenuItemProps } from './components/Menu/Menu.js';
 export { Modal, type ModalFactory, type ModalProps } from './components/Modal/Modal.js';
 export * from './components/Modal/ModalFooter.js';
 export * from './components/Prompt/Prompt.js';
+export { RadioCard, type RadioCardProps } from './components/RadioCard/RadioCard.js';
 export { PasswordInput } from './components/PasswordInput/PasswordInput.js';
 export { Select } from './components/Select/Select.js';
 export * from './components/StickyFooter/StickyFooter.js';
 export { flexRender as renderTableCell } from '@tanstack/react-table';
+export { TableActionsColumn } from './components/Table/table-column/TableActionsColumn.js';
 export { type TablePredicateProps } from './components/Table/table-predicate/TablePredicate.js';
 export { Table, TableComponentsOrder, type PlasmaTableFactory } from './components/Table/Table.js';
 export { type TableAction, type TableLayout, type TableLayoutProps, type TableProps, } from './components/Table/Table.types.js';

package/dist/esm/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"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"}

package/dist/esm/index.js

@@ -61,6 +61,8 @@ export { Modal } from './components/Modal/Modal.js';
 export * from './components/Modal/ModalFooter.js';
 // Prompt
 export * from './components/Prompt/Prompt.js';
+// RadioCard - override Mantine RadioCard
+export { RadioCard } from './components/RadioCard/RadioCard.js';
 // Read Only - override Mantine PasswordInput and Select
 export { PasswordInput } from './components/PasswordInput/PasswordInput.js';
 export { Select } from './components/Select/Select.js';
@@ -68,6 +70,7 @@ export { Select } from './components/Select/Select.js';
 export * from './components/StickyFooter/StickyFooter.js';
 // Table - override Mantine Table
 export { flexRender as renderTableCell } from '@tanstack/react-table';
+export { TableActionsColumn } from './components/Table/table-column/TableActionsColumn.js';
 export { Table, TableComponentsOrder } from './components/Table/Table.js';
 export { useTableContext } from './components/Table/TableContext.js';
 export { useTable } from './components/Table/use-table.js';

package/dist/esm/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import {MantineColorsTuple, noop} from '@mantine/core';\nimport {type RowData} from '@tanstack/table-core';\nimport {type PlasmaColors} from './theme/PlasmaColors.js';\n\nexport * from '@mantine/carousel';\nexport * from '@mantine/core';\nexport {Pagination} from '@mantine/core';\nexport {type DatesRangeValue} from '@mantine/dates';\nexport * from '@mantine/form';\nexport * from '@mantine/hooks';\nexport * from '@mantine/notifications';\nexport {type NotificationsProps} from '@mantine/notifications';\nexport * from '@tanstack/table-core';\n\n// Export all components\n// Accordion\nexport {Accordion} from './components/Accordion/Accordion.js';\n\n// Action Icon - override Mantine ActionIcon\nexport {ActionIcon, type ActionIconProps} from './components/ActionIcon/ActionIcon.js';\n\n// Alert - override Mantine Alert\nexport {Alert} from './components/Alert/Alert.js';\n\n// Badge - override Mantine Badge\nexport {\n    Badge,\n    type BadgeOverloadFactory,\n    type SemanticBadge,\n    type SemanticBadgeProps,\n} from './components/Badge/Badge.js';\n\n// Blank Slate\nexport * from './components/BlankSlate/BlankSlate.js';\n\n// Browser Preview\nexport * from './components/BrowserPreview/BrowserPreview.js';\n\n// Button - override Mantine Button\nexport {Button, type ButtonProps} from './components/Button/Button.js';\nexport {type ButtonWithDisabledTooltipProps} from './components/Button/ButtonWithDisabledTooltip.js';\n\n// Checkbox\nexport * from './components/CheckboxIcon/CheckboxIcon.js';\n\n// Child Form\nexport * from './components/ChildForm/ChildForm.js';\n\n// Chip - override Mantine Chip\nexport {Chip} from './components/Chip/Chip.js';\n\n// Code Editor\nexport * from './components/CodeEditor/CodeEditor.js';\n\n// Collection\nexport * from './components/Collection/Collection.js';\nexport {enhanceWithCollectionProps} from './components/Collection/enhanceWithCollectionProps.js';\n\n// Copy to Clipboard\nexport * from './components/CopyToClipboard/CopyToClipboard.js';\n\n// Date Range Picker\nexport * from './components/DateRangePicker/DateRangePicker.js';\nexport * from './components/DateRangePicker/DateRangePickerInlineCalendar.js';\nexport * from './components/DateRangePicker/DateRangePickerPopoverCalendar.js';\nexport * from './components/DateRangePicker/DateRangePickerPresetSelect.js';\n\n// Date Time Range Picker\nexport * from './components/DateTimeRangePicker/DateTimeRangePicker.js';\n\n// Ellipsis Text\nexport * from './components/EllipsisText/EllipsisText.js';\n\n// Header - override @tanstack/table-core Header\nexport {\n    Header,\n    type HeaderBreadcrumbsProps,\n    type HeaderDocAnchorProps,\n    type HeaderFactory,\n    type HeaderProps,\n    type HeaderRightProps,\n    type HeaderStyleNames,\n    type HeaderVariant,\n} from './components/Header/Header.js';\n\n// Info Token\nexport * from './components/InfoToken/InfoToken.js';\n\n// Inline Confirm\nexport * from './components/InlineConfirm/InlineConfirm.js';\nexport * from './components/InlineConfirm/InlineConfirmContext.js';\n\n// Last Updated\nexport * from './components/LastUpdated/LastUpdated.js';\n\n// Loader\nexport * from './components/CircleLoader/CircleLoader.js';\n\n// Menu - override Mantine Menu\nexport {Menu, type MenuItemProps} from './components/Menu/Menu.js';\n\n// Modal - override Mantine Modal\nexport {Modal, type ModalFactory, type ModalProps} from './components/Modal/Modal.js';\nexport * from './components/Modal/ModalFooter.js';\n\n// Prompt\nexport * from './components/Prompt/Prompt.js';\n\n// Read Only - override Mantine PasswordInput and Select\nexport {PasswordInput} from './components/PasswordInput/PasswordInput.js';\nexport {Select} from './components/Select/Select.js';\n\n// Sticky Footer\nexport * from './components/StickyFooter/StickyFooter.js';\n\n// Table - override Mantine Table\nexport {flexRender as renderTableCell} from '@tanstack/react-table';\nexport {type TablePredicateProps} from './components/Table/table-predicate/TablePredicate.js';\nexport {Table, TableComponentsOrder, type PlasmaTableFactory} from './components/Table/Table.js';\nexport {\n    type TableAction,\n    type TableLayout,\n    type TableLayoutProps,\n    type TableProps,\n} from './components/Table/Table.types.js';\nexport {useTableContext} from './components/Table/TableContext.js';\nexport {useTable, type TableState, type TableStore, type UseTableOptions} from './components/Table/use-table.js';\nexport {useUrlSyncedState, type SearchParamEntry, type UseUrlSyncedStateOptions} from './hooks/use-url-synced-state.js';\n\nexport {noop};\n\n// Theme\nexport * from './theme/plasmaCSSVariablesResolver.js';\nexport * from './theme/Plasmantine.js';\n\ndeclare module '@mantine/core' {\n    export interface MantineThemeColorsOverride {\n        colors: Record<keyof typeof PlasmaColors | (string & {}), MantineColorsTuple>;\n    }\n}\n\ndeclare module '@tanstack/react-table' {\n    interface ColumnMeta<TData extends RowData, TValue> {\n        /**\n         * Whether the column is a control column.\n         * Control columns are columns that are not part of the data but are used to control the table.\n         * For example, a column that contains checkboxes to select rows.\n         */\n        controlColumn: boolean;\n    }\n}\n"],"names":["noop","Pagination","Accordion","ActionIcon","Alert","Badge","Button","Chip","enhanceWithCollectionProps","Header","Menu","Modal","PasswordInput","Select","flexRender","renderTableCell","Table","TableComponentsOrder","useTableContext","useTable","useUrlSyncedState"],"mappings":"AAAA,SAA4BA,IAAI,QAAO,gBAAgB;AAIvD,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAC9B,SAAQC,UAAU,QAAO,gBAAgB;AAEzC,cAAc,gBAAgB;AAC9B,cAAc,iBAAiB;AAC/B,cAAc,yBAAyB;AAEvC,cAAc,uBAAuB;AAErC,wBAAwB;AACxB,YAAY;AACZ,SAAQC,SAAS,QAAO,sCAAsC;AAE9D,4CAA4C;AAC5C,SAAQC,UAAU,QAA6B,wCAAwC;AAEvF,iCAAiC;AACjC,SAAQC,KAAK,QAAO,8BAA8B;AAElD,iCAAiC;AACjC,SACIC,KAAK,QAIF,8BAA8B;AAErC,cAAc;AACd,cAAc,wCAAwC;AAEtD,kBAAkB;AAClB,cAAc,gDAAgD;AAE9D,mCAAmC;AACnC,SAAQC,MAAM,QAAyB,gCAAgC;AAGvE,WAAW;AACX,cAAc,4CAA4C;AAE1D,aAAa;AACb,cAAc,sCAAsC;AAEpD,+BAA+B;AAC/B,SAAQC,IAAI,QAAO,4BAA4B;AAE/C,cAAc;AACd,cAAc,wCAAwC;AAEtD,aAAa;AACb,cAAc,wCAAwC;AACtD,SAAQC,0BAA0B,QAAO,wDAAwD;AAEjG,oBAAoB;AACpB,cAAc,kDAAkD;AAEhE,oBAAoB;AACpB,cAAc,kDAAkD;AAChE,cAAc,gEAAgE;AAC9E,cAAc,iEAAiE;AAC/E,cAAc,8DAA8D;AAE5E,yBAAyB;AACzB,cAAc,0DAA0D;AAExE,gBAAgB;AAChB,cAAc,4CAA4C;AAE1D,gDAAgD;AAChD,SACIC,MAAM,QAQH,gCAAgC;AAEvC,aAAa;AACb,cAAc,sCAAsC;AAEpD,iBAAiB;AACjB,cAAc,8CAA8C;AAC5D,cAAc,qDAAqD;AAEnE,eAAe;AACf,cAAc,0CAA0C;AAExD,SAAS;AACT,cAAc,4CAA4C;AAE1D,+BAA+B;AAC/B,SAAQC,IAAI,QAA2B,4BAA4B;AAEnE,iCAAiC;AACjC,SAAQC,KAAK,QAA2C,8BAA8B;AACtF,cAAc,oCAAoC;AAElD,SAAS;AACT,cAAc,gCAAgC;AAE9C,wDAAwD;AACxD,SAAQC,aAAa,QAAO,8CAA8C;AAC1E,SAAQC,MAAM,QAAO,gCAAgC;AAErD,gBAAgB;AAChB,cAAc,4CAA4C;AAE1D,iCAAiC;AACjC,SAAQC,cAAcC,eAAe,QAAO,wBAAwB;AAEpE,SAAQC,KAAK,EAAEC,oBAAoB,QAAgC,8BAA8B;AAOjG,SAAQC,eAAe,QAAO,qCAAqC;AACnE,SAAQC,QAAQ,QAA+D,kCAAkC;AACjH,SAAQC,iBAAiB,QAA6D,kCAAkC;AAExH,SAAQpB,IAAI,GAAE;AAEd,QAAQ;AACR,cAAc,wCAAwC;AACtD,cAAc,yBAAyB"}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import {MantineColorsTuple, noop} from '@mantine/core';\nimport {type RowData} from '@tanstack/table-core';\nimport {type PlasmaColors} from './theme/PlasmaColors.js';\n\nexport * from '@mantine/carousel';\nexport * from '@mantine/core';\nexport {Pagination} from '@mantine/core';\nexport {type DatesRangeValue} from '@mantine/dates';\nexport * from '@mantine/form';\nexport * from '@mantine/hooks';\nexport * from '@mantine/notifications';\nexport {type NotificationsProps} from '@mantine/notifications';\nexport * from '@tanstack/table-core';\n\n// Export all components\n// Accordion\nexport {Accordion} from './components/Accordion/Accordion.js';\n\n// Action Icon - override Mantine ActionIcon\nexport {ActionIcon, type ActionIconProps} from './components/ActionIcon/ActionIcon.js';\n\n// Alert - override Mantine Alert\nexport {Alert} from './components/Alert/Alert.js';\n\n// Badge - override Mantine Badge\nexport {\n    Badge,\n    type BadgeOverloadFactory,\n    type SemanticBadge,\n    type SemanticBadgeProps,\n} from './components/Badge/Badge.js';\n\n// Blank Slate\nexport * from './components/BlankSlate/BlankSlate.js';\n\n// Browser Preview\nexport * from './components/BrowserPreview/BrowserPreview.js';\n\n// Button - override Mantine Button\nexport {Button, type ButtonProps} from './components/Button/Button.js';\nexport {type ButtonWithDisabledTooltipProps} from './components/Button/ButtonWithDisabledTooltip.js';\n\n// Checkbox\nexport * from './components/CheckboxIcon/CheckboxIcon.js';\n\n// Child Form\nexport * from './components/ChildForm/ChildForm.js';\n\n// Chip - override Mantine Chip\nexport {Chip} from './components/Chip/Chip.js';\n\n// Code Editor\nexport * from './components/CodeEditor/CodeEditor.js';\n\n// Collection\nexport * from './components/Collection/Collection.js';\nexport {enhanceWithCollectionProps} from './components/Collection/enhanceWithCollectionProps.js';\n\n// Copy to Clipboard\nexport * from './components/CopyToClipboard/CopyToClipboard.js';\n\n// Date Range Picker\nexport * from './components/DateRangePicker/DateRangePicker.js';\nexport * from './components/DateRangePicker/DateRangePickerInlineCalendar.js';\nexport * from './components/DateRangePicker/DateRangePickerPopoverCalendar.js';\nexport * from './components/DateRangePicker/DateRangePickerPresetSelect.js';\n\n// Date Time Range Picker\nexport * from './components/DateTimeRangePicker/DateTimeRangePicker.js';\n\n// Ellipsis Text\nexport * from './components/EllipsisText/EllipsisText.js';\n\n// Header - override @tanstack/table-core Header\nexport {\n    Header,\n    type HeaderBreadcrumbsProps,\n    type HeaderDocAnchorProps,\n    type HeaderFactory,\n    type HeaderProps,\n    type HeaderRightProps,\n    type HeaderStyleNames,\n    type HeaderVariant,\n} from './components/Header/Header.js';\n\n// Info Token\nexport * from './components/InfoToken/InfoToken.js';\n\n// Inline Confirm\nexport * from './components/InlineConfirm/InlineConfirm.js';\nexport * from './components/InlineConfirm/InlineConfirmContext.js';\n\n// Last Updated\nexport * from './components/LastUpdated/LastUpdated.js';\n\n// Loader\nexport * from './components/CircleLoader/CircleLoader.js';\n\n// Menu - override Mantine Menu\nexport {Menu, type MenuItemProps} from './components/Menu/Menu.js';\n\n// Modal - override Mantine Modal\nexport {Modal, type ModalFactory, type ModalProps} from './components/Modal/Modal.js';\nexport * from './components/Modal/ModalFooter.js';\n\n// Prompt\nexport * from './components/Prompt/Prompt.js';\n\n// RadioCard - override Mantine RadioCard\nexport {RadioCard, type RadioCardProps} from './components/RadioCard/RadioCard.js';\n\n// Read Only - override Mantine PasswordInput and Select\nexport {PasswordInput} from './components/PasswordInput/PasswordInput.js';\nexport {Select} from './components/Select/Select.js';\n\n// Sticky Footer\nexport * from './components/StickyFooter/StickyFooter.js';\n\n// Table - override Mantine Table\nexport {flexRender as renderTableCell} from '@tanstack/react-table';\nexport {TableActionsColumn} from './components/Table/table-column/TableActionsColumn.js';\nexport {type TablePredicateProps} from './components/Table/table-predicate/TablePredicate.js';\nexport {Table, TableComponentsOrder, type PlasmaTableFactory} from './components/Table/Table.js';\nexport {\n    type TableAction,\n    type TableLayout,\n    type TableLayoutProps,\n    type TableProps,\n} from './components/Table/Table.types.js';\nexport {useTableContext} from './components/Table/TableContext.js';\nexport {useTable, type TableState, type TableStore, type UseTableOptions} from './components/Table/use-table.js';\nexport {useUrlSyncedState, type SearchParamEntry, type UseUrlSyncedStateOptions} from './hooks/use-url-synced-state.js';\n\nexport {noop};\n\n// Theme\nexport * from './theme/plasmaCSSVariablesResolver.js';\nexport * from './theme/Plasmantine.js';\n\ndeclare module '@mantine/core' {\n    export interface MantineThemeColorsOverride {\n        colors: Record<keyof typeof PlasmaColors | (string & {}), MantineColorsTuple>;\n    }\n}\n\ndeclare module '@tanstack/react-table' {\n    interface ColumnMeta<TData extends RowData, TValue> {\n        /**\n         * Whether the column is a control column.\n         * Control columns are columns that are not part of the data but are used to control the table.\n         * For example, a column that contains checkboxes to select rows.\n         */\n        controlColumn: boolean;\n    }\n}\n"],"names":["noop","Pagination","Accordion","ActionIcon","Alert","Badge","Button","Chip","enhanceWithCollectionProps","Header","Menu","Modal","RadioCard","PasswordInput","Select","flexRender","renderTableCell","TableActionsColumn","Table","TableComponentsOrder","useTableContext","useTable","useUrlSyncedState"],"mappings":"AAAA,SAA4BA,IAAI,QAAO,gBAAgB;AAIvD,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAC9B,SAAQC,UAAU,QAAO,gBAAgB;AAEzC,cAAc,gBAAgB;AAC9B,cAAc,iBAAiB;AAC/B,cAAc,yBAAyB;AAEvC,cAAc,uBAAuB;AAErC,wBAAwB;AACxB,YAAY;AACZ,SAAQC,SAAS,QAAO,sCAAsC;AAE9D,4CAA4C;AAC5C,SAAQC,UAAU,QAA6B,wCAAwC;AAEvF,iCAAiC;AACjC,SAAQC,KAAK,QAAO,8BAA8B;AAElD,iCAAiC;AACjC,SACIC,KAAK,QAIF,8BAA8B;AAErC,cAAc;AACd,cAAc,wCAAwC;AAEtD,kBAAkB;AAClB,cAAc,gDAAgD;AAE9D,mCAAmC;AACnC,SAAQC,MAAM,QAAyB,gCAAgC;AAGvE,WAAW;AACX,cAAc,4CAA4C;AAE1D,aAAa;AACb,cAAc,sCAAsC;AAEpD,+BAA+B;AAC/B,SAAQC,IAAI,QAAO,4BAA4B;AAE/C,cAAc;AACd,cAAc,wCAAwC;AAEtD,aAAa;AACb,cAAc,wCAAwC;AACtD,SAAQC,0BAA0B,QAAO,wDAAwD;AAEjG,oBAAoB;AACpB,cAAc,kDAAkD;AAEhE,oBAAoB;AACpB,cAAc,kDAAkD;AAChE,cAAc,gEAAgE;AAC9E,cAAc,iEAAiE;AAC/E,cAAc,8DAA8D;AAE5E,yBAAyB;AACzB,cAAc,0DAA0D;AAExE,gBAAgB;AAChB,cAAc,4CAA4C;AAE1D,gDAAgD;AAChD,SACIC,MAAM,QAQH,gCAAgC;AAEvC,aAAa;AACb,cAAc,sCAAsC;AAEpD,iBAAiB;AACjB,cAAc,8CAA8C;AAC5D,cAAc,qDAAqD;AAEnE,eAAe;AACf,cAAc,0CAA0C;AAExD,SAAS;AACT,cAAc,4CAA4C;AAE1D,+BAA+B;AAC/B,SAAQC,IAAI,QAA2B,4BAA4B;AAEnE,iCAAiC;AACjC,SAAQC,KAAK,QAA2C,8BAA8B;AACtF,cAAc,oCAAoC;AAElD,SAAS;AACT,cAAc,gCAAgC;AAE9C,yCAAyC;AACzC,SAAQC,SAAS,QAA4B,sCAAsC;AAEnF,wDAAwD;AACxD,SAAQC,aAAa,QAAO,8CAA8C;AAC1E,SAAQC,MAAM,QAAO,gCAAgC;AAErD,gBAAgB;AAChB,cAAc,4CAA4C;AAE1D,iCAAiC;AACjC,SAAQC,cAAcC,eAAe,QAAO,wBAAwB;AACpE,SAAQC,kBAAkB,QAAO,wDAAwD;AAEzF,SAAQC,KAAK,EAAEC,oBAAoB,QAAgC,8BAA8B;AAOjG,SAAQC,eAAe,QAAO,qCAAqC;AACnE,SAAQC,QAAQ,QAA+D,kCAAkC;AACjH,SAAQC,iBAAiB,QAA6D,kCAAkC;AAExH,SAAQtB,IAAI,GAAE;AAEd,QAAQ;AACR,cAAc,wCAAwC;AACtD,cAAc,yBAAyB"}

package/dist/esm/styles/RadioCard.module.css

@@ -5,7 +5,51 @@
 }
 
 .card {
+    display: inline-flex;
+    flex-direction: column;
+    align-items: flex-start;
+    padding: var(--mantine-spacing-sm);
+    border-radius: var(--mantine-radius-lg);
+
+    &[data-checked] {
+        border-color: var(--mantine-primary-color-filled);
+    }
+
     &[disabled] {
         pointer-events: none;
+
+        .title {
+            color: var(--mantine-color-disabled-color);
+        }
+
+        .description {
+            color: var(--mantine-color-disabled-color);
+        }
     }
 }
+
+.container {
+    flex-wrap: nowrap;
+    gap: var(--mantine-spacing-sm);
+    align-items: baseline;
+    justify-content: flex-start;
+    width: 100%;
+    margin-bottom: var(--mantine-spacing-xs);
+}
+
+.title {
+    flex: 1;
+    color: var(--coveo-color-title);
+    word-break: break-word;
+}
+
+.description {
+    padding-left: var(--mantine-spacing-lg);
+    color: var(--mantine-color-dimmed);
+    font-weight: 400;
+    font-size: var(--mantine-font-size-xs);
+}
+
+.indicator {
+    cursor: pointer;
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveord/plasma-mantine",
-  "version": "56.8.0",
+  "version": "56.9.0",
   "description": "A Plasma flavoured Mantine theme",
   "keywords": [
     "plasma",
@@ -80,45 +80,45 @@
     "dayjs": "1.11.19",
     "fast-deep-equal": "3.1.3",
     "lodash.defaultsdeep": "4.6.1",
-    "monaco-editor": "0.54.0",
-    "@coveord/plasma-react-icons": "56.5.0",
-    "@coveord/plasma-tokens": "56.5.0"
+    "monaco-editor": "0.55.1",
+    "@coveord/plasma-react-icons": "56.8.1",
+    "@coveord/plasma-tokens": "56.8.1"
   },
   "devDependencies": {
-    "@mantine/carousel": "8.3.6",
-    "@mantine/code-highlight": "8.3.6",
-    "@mantine/core": "8.3.6",
-    "@mantine/dates": "8.3.6",
-    "@mantine/form": "8.3.6",
-    "@mantine/hooks": "8.3.6",
-    "@mantine/modals": "8.3.6",
-    "@mantine/notifications": "8.3.6",
+    "@mantine/carousel": "8.3.10",
+    "@mantine/code-highlight": "8.3.10",
+    "@mantine/core": "8.3.10",
+    "@mantine/dates": "8.3.10",
+    "@mantine/form": "8.3.10",
+    "@mantine/hooks": "8.3.10",
+    "@mantine/modals": "8.3.10",
+    "@mantine/notifications": "8.3.10",
     "@swc/cli": "0.7.9",
-    "@swc/core": "1.15.0",
+    "@swc/core": "1.15.3",
     "@testing-library/dom": "10.4.1",
     "@testing-library/jest-dom": "6.9.1",
     "@testing-library/react": "16.3.0",
     "@testing-library/user-event": "14.6.1",
     "@types/lodash.defaultsdeep": "4.6.9",
-    "@types/react": "18.3.26",
+    "@types/react": "18.3.27",
     "@types/react-dom": "18.3.7",
-    "@vitest/eslint-plugin": "1.4.1",
+    "@vitest/eslint-plugin": "1.5.2",
     "cross-env": "10.1.0",
     "embla-carousel": "8.6.0",
     "embla-carousel-react": "8.6.0",
-    "eslint-plugin-testing-library": "6.5.0",
+    "eslint-plugin-testing-library": "7.13.5",
     "eslint-plugin-vitest-globals": "1.5.0",
-    "jsdom": "27.1.0",
+    "jsdom": "27.3.0",
     "postcss": "8.5.6",
     "postcss-preset-mantine": "^1.11.0",
     "postcss-simple-vars": "^7.0.1",
     "publint": "0.3.15",
     "react": "18.3.1",
     "react-dom": "18.3.1",
-    "rimraf": "6.1.0",
+    "rimraf": "6.1.2",
     "tslib": "2.8.1",
     "typescript": "5.9.3",
-    "vitest": "4.0.8"
+    "vitest": "4.0.15"
   },
   "peerDependencies": {
     "@mantine/carousel": "^8.0.2",

package/src/components/CodeEditor/languages/xml.ts

@@ -1,4 +1,5 @@
 import {Monaco} from '@monaco-editor/react';
+import type {editor} from 'monaco-editor';
 
 const format = (xml: string): string => {
     // https://stackoverflow.com/questions/57039218/doesnt-monaco-editor-support-xml-language-by-default
@@ -31,7 +32,7 @@ const format = (xml: string): string => {
 
 const register = (monaco: Monaco): void => {
     monaco.languages.registerDocumentFormattingEditProvider('xml', {
-        provideDocumentFormattingEdits: async (model) => [
+        provideDocumentFormattingEdits: async (model: editor.ITextModel) => [
             {
                 range: model.getFullModelRange(),
                 text: format(model.getValue()),

package/src/components/Collection/enhanceWithCollectionProps.ts

@@ -1,4 +1,4 @@
-import {UseFormInput} from '@mantine/form';
+import {UseFormInput, type FormArrayElement} from '@mantine/form';
 import {CollectionProps} from './Collection.js';
 
 export const enhanceWithCollectionProps = <
@@ -20,7 +20,7 @@ export const enhanceWithCollectionProps = <
                 payload.form.removeListItem(field, index);
                 validateInputOnChange && payload.form.validate();
             },
-            onInsertItem: (valueToInsert: unknown, index: number) => {
+            onInsertItem: (valueToInsert: FormArrayElement<FormValues, (typeof payload)['field']>, index: number) => {
                 payload.form.insertListItem(field, valueToInsert, index);
                 validateInputOnChange && payload.form.validate();
             },

package/src/components/DateRangePicker/DateRange.module.css

@@ -5,3 +5,7 @@
 .save {
     border-top: 1px solid var(--mantine-color-default-border);
 }
+
+.input {
+    white-space: nowrap;
+}

package/src/components/DateRangePicker/DateRangePicker.tsx

@@ -14,6 +14,7 @@ import {DatesRangeValue, DateStringValue} from '@mantine/dates';
 import {useUncontrolled} from '@mantine/hooks';
 import dayjs from 'dayjs';
 import {useUrlSyncedState, UseUrlSyncedStateOptions} from '../../hooks/use-url-synced-state';
+import classes from './DateRange.module.css';
 import {DateRangePickerInlineCalendar, DateRangePickerInlineCalendarProps} from './DateRangePickerInlineCalendar';
 
 const serialization = (input: Pick<UseUrlSyncedStateOptions<DatesRangeValue<string>>, 'serializer' | 'deserializer'>) =>
@@ -123,7 +124,7 @@ export const DateRangePicker = factory<DateRangePickerFactory>((props: DateRange
 
     const getStyles = useStyles<DateRangePickerFactory>({
         name: 'DateRangePicker',
-        classes: {},
+        classes,
         props,
         className,
         classNames,

package/src/components/RadioCard/RadioCard.tsx

@@ -0,0 +1,73 @@
+import {
+    Box,
+    Factory,
+    Group,
+    RadioCardProps as MantineRadioCardProps,
+    RadioCardStylesNames as MantineRadioCardStylesNames,
+    Radio,
+    RadioCardCssVariables,
+    StylesApiProps,
+    Title,
+    factory,
+    useProps,
+    useStyles,
+} from '@mantine/core';
+import {ReactNode} from 'react';
+import classes from '../../styles/RadioCard.module.css';
+
+export type RadioCardStylesNames = MantineRadioCardStylesNames | 'container' | 'indicator' | 'title' | 'description';
+export type RadioCardFactory = Factory<{
+    props: RadioCardProps;
+    ref: HTMLButtonElement;
+    stylesNames: RadioCardStylesNames;
+    vars: RadioCardCssVariables;
+}>;
+
+export type RadioCardProps = MantineRadioCardProps &
+    StylesApiProps<RadioCardFactory> & {
+        /**
+         * The label of the card. Appears next to the radio indicator.
+         */
+        label: ReactNode;
+        /**
+         * The description of the card. Appears under the title.
+         */
+        description?: ReactNode;
+    };
+
+const defaultProps: Partial<RadioCardProps> = {};
+
+export const RadioCard = factory<RadioCardFactory>((_props, ref) => {
+    const {classNames, styles, style, className, vars, disabled, label, description, ...others} = useProps(
+        'RadioCard',
+        defaultProps,
+        _props,
+    );
+    const getStyles = useStyles<RadioCardFactory>({
+        name: 'RadioCard',
+        classes,
+        vars,
+        classNames,
+        className,
+        style,
+        props: _props,
+        styles,
+    });
+
+    return (
+        <Radio.Card
+            ref={ref}
+            disabled={disabled}
+            {...getStyles('card', {className, style, classNames, styles})}
+            {...others}
+        >
+            <Group {...getStyles('container', {classNames, styles})}>
+                <Radio.Indicator size="xs" disabled={disabled} {...getStyles('indicator', {classNames, styles})} />
+                <Title order={4} {...getStyles('title', {classNames, styles})}>
+                    {label}
+                </Title>
+            </Group>
+            {description && <Box {...getStyles('description', {classNames, styles})}>{description}</Box>}
+        </Radio.Card>
+    );
+});

package/src/components/RadioCard/__tests__/RadioCard.component.spec.tsx

@@ -0,0 +1,25 @@
+import {render, screen} from '@test-utils';
+import {RadioCard} from '../RadioCard.js';
+
+describe('RadioCard', () => {
+    it('renders the title and description correctly', () => {
+        const title = 'Test Title';
+        const description = 'Test Description';
+
+        render(<RadioCard label={title} description={description} />);
+
+        expect(screen.getByText(title)).toBeInTheDocument();
+        expect(screen.getByText(description)).toBeInTheDocument();
+    });
+    it('renders the radio indicator correctly', () => {
+        render(<RadioCard label="Test Title" />);
+
+        expect(screen.getByRole('radio')).not.toBeDisabled();
+    });
+
+    it('renders disabled state correctly', () => {
+        render(<RadioCard label="Test Title" disabled />);
+
+        expect(screen.getByRole('radio')).toBeDisabled();
+    });
+});