@coveord/plasma-mantine 52.27.4 → 53.0.0

package/dist/esm/theme/Theme.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {CheckSize16Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {\n    getSize,\n    getStylesRef,\n    rem,\n    type MantineThemeOverride,\n    type NotificationProps,\n    type StepperStylesParams,\n    type TabsStylesParams,\n} from '@mantine/core';\n\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = {\n    // These are overrides over https://github.com/mantinedev/mantine/blob/master/src/mantine-styles/src/theme/default-theme.ts\n    colorScheme: 'light',\n    fontFamily: 'canada-type-gibson, sans-serif',\n    black: color.primary.gray[9],\n    defaultRadius: 8,\n    lineHeight: 1.5,\n    spacing: {\n        xs: '8px',\n        sm: '16px',\n        md: '24px',\n        lg: '32px',\n        xl: '40px',\n    },\n    globalStyles: (theme) => ({\n        body: {\n            ...theme.fn.fontStyles(),\n            fontSize: theme.fontSizes.sm,\n            lineHeight: theme.lineHeight,\n            fontWeight: 300,\n        },\n    }),\n    primaryColor: 'action',\n    headings: {\n        fontFamily: 'canada-type-gibson, sans-serif',\n        fontWeight: 500,\n        sizes: {\n            h1: {fontSize: '48px', lineHeight: undefined, fontWeight: 300},\n            h2: {fontSize: '32px', lineHeight: undefined, fontWeight: 500},\n            h3: {fontSize: '24px', lineHeight: undefined, fontWeight: 500},\n            h4: {fontSize: '18px', lineHeight: undefined, fontWeight: 300},\n            h5: {fontSize: '14px', lineHeight: undefined, fontWeight: 500},\n            h6: {fontSize: '12px', lineHeight: undefined, fontWeight: 500},\n        },\n    },\n    shadows: {\n        xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n        sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n        md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n        lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n        xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n    },\n    colors: PlasmaColors,\n    components: {\n        Alert: {\n            defaultProps: {\n                icon: <InfoSize24Px height={24} />,\n                color: 'navy',\n            },\n            styles: {\n                title: {\n                    fontWeight: 500,\n                },\n            },\n        },\n        Title: {\n            styles: {\n                root: {\n                    '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em'},\n                },\n            },\n        },\n        Text: {\n            defaultProps: {\n                weight: 300,\n            },\n            styles: (theme, {}, {size}) => ({\n                root: {\n                    fontSize: getSize({size: size ?? 'sm', sizes: theme.fontSizes}),\n                },\n            }),\n        },\n        Button: {\n            styles: () => ({\n                root: {\n                    fontWeight: 400,\n                },\n            }),\n            variants: {\n                outline: () => ({\n                    root: {\n                        backgroundColor: 'white',\n                    },\n                }),\n            },\n        },\n        Modal: {\n            styles: (theme, {fullScreen, padding}, {size, variant}) => ({\n                content: {\n                    flex: fullScreen\n                        ? '0 0 100%'\n                        : `0 0 ${getSize({\n                              size,\n                              sizes: {\n                                  xs: rem(432),\n                                  sm: rem(664),\n                                  md: rem(896),\n                                  lg: rem(1120),\n                                  xl: rem('88%'),\n                              },\n                          })}`,\n                    overflow: 'auto',\n                },\n                title: {\n                    width: '100%',\n                    fontSize: theme.headings.sizes.h3.fontSize,\n                    lineHeight: theme.headings.sizes.h3.lineHeight,\n                    fontWeight: 500,\n                },\n                header: {\n                    borderBottom: variant !== 'prompt' ? `1px solid ${color.primary.gray[3]}` : null,\n                },\n                body: {\n                    '&:not(:only-child)': {\n                        paddingTop: variant === 'prompt' ? 0 : getSize({size: padding, sizes: plasmaTheme.spacing}),\n                    },\n                },\n            }),\n        },\n        ModalOverlay: {\n            defaultProps: {\n                color: color.primary.navy[9],\n                opacity: 0.9,\n            },\n        },\n        InputWrapper: {\n            defaultProps: {\n                withAsterisk: false,\n            },\n            styles: (theme) => ({\n                label: {\n                    marginBottom: theme.spacing.xs,\n                },\n                description: {\n                    fontSize: theme.fontSizes.sm,\n                    color: theme.colors.gray[7],\n                    marginBottom: theme.spacing.xs,\n                    lineHeight: theme.lineHeight,\n                },\n                invalid: {\n                    color: theme.colors.red[9],\n                    borderColor: theme.colors.red[6],\n                },\n                error: {\n                    color: theme.colors.red[9],\n                    lineHeight: theme.lineHeight,\n                },\n            }),\n        },\n        TextInput: {\n            defaultProps: {\n                radius: 8,\n            },\n        },\n        Tooltip: {\n            defaultProps: {\n                color: 'navy',\n                maw: 300,\n                multiline: true,\n                withArrow: true,\n                withinPortal: true,\n                zIndex: 10000,\n            },\n        },\n        Loader: {\n            defaultProps: {\n                variant: 'dots',\n                color: 'action',\n            },\n        },\n        DateRangePicker: {\n            styles: {\n                cell: {\n                    textAlign: 'center',\n                },\n            },\n        },\n        Anchor: {\n            defaultProps: {\n                color: 'action.6',\n            },\n            styles: (theme) => ({\n                root: {\n                    ...theme.fn.hover({\n                        textDecoration: 'underline',\n                        color: theme.colors.action[8],\n                    }),\n                },\n            }),\n        },\n        Checkbox: {\n            defaultProps: {\n                radius: 'sm',\n            },\n            styles: (theme) => ({\n                label: {\n                    fontSize: theme.fontSizes.sm,\n                    fontWeight: 300,\n                },\n            }),\n        },\n        List: {\n            styles: () => ({\n                root: {\n                    listStyleType: 'disc',\n                },\n            }),\n        },\n        Radio: {\n            styles: {\n                labelWrapper: {\n                    display: 'flex',\n                    alignItems: 'flex-start',\n                },\n            },\n        },\n        Popover: {\n            defaultProps: {\n                shadow: 'md',\n                withArrow: true,\n            },\n        },\n        Badge: {\n            styles: {\n                root: {\n                    textTransform: 'none',\n                    padding: '4px 8px',\n                    fontWeight: 500,\n                },\n            },\n        },\n        ColorSwatch: {\n            defaultProps: {\n                size: 8,\n                withShadow: false,\n            },\n        },\n        MenuItem: {\n            defaultProps: {\n                fw: 300,\n            },\n        },\n        Notification: {\n            styles: (theme, {color: notificationType}: NotificationProps) => ({\n                root: {\n                    borderColor: theme.colors.gray[3],\n                    backgroundColor: theme.colors.gray[0],\n                    boxShadow: theme.shadows.lg,\n                    padding: theme.spacing.sm,\n                    '&[data-with-icon]': {\n                        paddingLeft: theme.spacing.sm,\n                    },\n                },\n                icon: {\n                    backgroundColor: 'transparent',\n                    marginRight: theme.spacing.sm,\n                    color: theme.colors?.[notificationType][6],\n                },\n                closeButton: {\n                    margin: theme.spacing.xs,\n                    color: theme.colors.gray[5],\n                },\n            }),\n            defaultProps: {\n                icon: <InfoSize24Px height={24} />,\n                color: 'info',\n            },\n        },\n        Skeleton: {\n            styles: {\n                visible: {\n                    '&::before': {zIndex: 'unset'},\n                    '&::after': {zIndex: 'unset'},\n                },\n            },\n        },\n        SegmentedControl: {\n            styles: (theme) => ({\n                root: {\n                    backgroundColor: theme.colors.gray[2],\n                },\n            }),\n        },\n        Stepper: {\n            defaultProps: {\n                size: 'xs',\n                completedIcon: <CheckSize16Px />,\n            },\n            styles: (theme, {}: StepperStylesParams, {size}) => ({\n                step: {\n                    '&[disabled]': {\n                        color: theme.colors.gray[5],\n                        '& .mantine-Stepper-stepDescription': {\n                            color: theme.colors.gray[5],\n                        },\n                        '& .mantine-Stepper-stepIcon': {\n                            borderColor: theme.colors.gray[1],\n                        },\n                    },\n                },\n                stepIcon: {\n                    fontWeight: 500,\n                    backgroundColor: theme.colors.gray[1],\n                    color: 'inherit',\n                    border: `${rem(1)} solid ${theme.colors.gray[3]}`,\n                    '&[data-progress]': {\n                        backgroundColor: theme.white,\n                    },\n\n                    '&[data-completed]': {\n                        backgroundColor: theme.white,\n                        borderColor: theme.colors.lime[6],\n                        color: theme.colors.lime[6],\n                    },\n                },\n                stepCompletedIcon: {\n                    color: theme.colors.lime[6],\n                    fontSize: rem(16),\n                },\n                stepDescription: {\n                    color: theme.colors.gray[7],\n                    fontSize: getSize({size, sizes: theme.fontSizes}),\n                },\n                separator: {\n                    height: rem(1),\n                    backgroundColor: theme.colors.gray[3],\n                },\n                separatorActive: {\n                    backgroundColor: theme.colors.gray[3],\n                },\n                verticalSeparator: {\n                    borderLeft: `${rem(1)} solid ${theme.colors.gray[3]}`,\n                },\n                verticalSeparatorActive: {\n                    borderColor: theme.colors.gray[3],\n                },\n            }),\n        },\n        Tabs: {\n            styles: (theme, {orientation}: TabsStylesParams) => ({\n                tabsList: {\n                    [orientation === 'horizontal' ? 'borderBottom' : 'borderRight']: `${rem(1)} solid ${\n                        theme.colors.gray[3]\n                    }`,\n                },\n                tab: {\n                    [orientation === 'horizontal' ? 'borderBottom' : 'borderRight']: `${rem(1)} solid transparent`,\n                    [orientation === 'horizontal' ? 'marginBottom' : 'marginRight']: rem(-1),\n                },\n            }),\n        },\n        Select: {\n            styles: (theme) => ({\n                input: {\n                    color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n                },\n                item: {\n                    color: theme.colorScheme === 'dark' ? theme.colors.dark[0] : theme.colors.gray[7],\n\n                    '&[data-hovered]': {\n                        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[1],\n                    },\n\n                    '&[data-selected]': {\n                        backgroundColor: theme.fn.variant({variant: 'light'}).background,\n                        color: theme.fn.variant({variant: 'light'}).color,\n                        ...theme.fn.hover({backgroundColor: theme.fn.variant({variant: 'light'}).hover}),\n                    },\n                },\n            }),\n        },\n        NavLink: {\n            styles: (theme) => ({\n                root: {\n                    color: theme.colors.gray[6],\n                    borderRadius: `${theme.defaultRadius}px 0px 0px ${theme.defaultRadius}px`,\n                    ...theme.fn.hover({\n                        backgroundColor: theme.colorScheme === 'dark' ? theme.colors.dark[6] : theme.colors.gray[1],\n                    }),\n                },\n                label: {\n                    ref: getStylesRef('label'),\n                    fontWeight: 500,\n                },\n                children: {\n                    [`.${getStylesRef('label')}`]: {\n                        fontWeight: 300,\n                    },\n                },\n            }),\n        },\n        Navbar: {\n            styles: (theme) => ({\n                root: {\n                    borderColor: theme.colors.gray[3],\n                },\n            }),\n        },\n        ScrollArea: {\n            styles: {\n                viewport: {\n                    // https://github.com/radix-ui/primitives/issues/926\n                    '&[data-radix-scroll-area-viewport]': {\n                        '& > :first-of-type': {\n                            display: 'block !important',\n                        },\n                    },\n                },\n            },\n        },\n        Divider: {\n            defaultProps: {\n                color: 'gray.3',\n            },\n        },\n    },\n};\n"],"names":["CheckSize16Px","InfoSize24Px","color","getSize","getStylesRef","rem","PlasmaColors","plasmaTheme","colorScheme","fontFamily","black","primary","gray","defaultRadius","lineHeight","spacing","xs","sm","md","lg","xl","globalStyles","theme","body","fn","fontStyles","fontSize","fontSizes","fontWeight","primaryColor","headings","sizes","h1","undefined","h2","h3","h4","h5","h6","shadows","colors","components","Alert","defaultProps","icon","height","styles","title","Title","root","letterSpacing","Text","weight","size","Button","variants","outline","backgroundColor","Modal","fullScreen","padding","variant","content","flex","overflow","width","header","borderBottom","paddingTop","ModalOverlay","navy","opacity","InputWrapper","withAsterisk","label","marginBottom","description","invalid","red","borderColor","error","TextInput","radius","Tooltip","maw","multiline","withArrow","withinPortal","zIndex","Loader","DateRangePicker","cell","textAlign","Anchor","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems","Popover","shadow","Badge","textTransform","ColorSwatch","withShadow","MenuItem","fw","Notification","notificationType","boxShadow","paddingLeft","marginRight","closeButton","margin","Skeleton","visible","SegmentedControl","Stepper","completedIcon","step","stepIcon","border","white","lime","stepCompletedIcon","stepDescription","separator","separatorActive","verticalSeparator","borderLeft","verticalSeparatorActive","Tabs","orientation","tabsList","tab","Select","input","dark","item","background","NavLink","borderRadius","ref","children","Navbar","ScrollArea","viewport","Divider"],"mappings":";AAAA,SAAQA,aAAa,EAAEC,YAAY,QAAO,8BAA8B;AACxE,SAAQC,KAAK,QAAO,yBAAyB;AAC7C,SACIC,OAAO,EACPC,YAAY,EACZC,GAAG,QAKA,gBAAgB;AAEvB,SAAQC,YAAY,QAAO,iBAAiB;AAE5C,OAAO,MAAMC,cAAoC;IAC7C,2HAA2H;IAC3HC,aAAa;IACbC,YAAY;IACZC,OAAOR,MAAMS,OAAO,CAACC,IAAI,CAAC,EAAE;IAC5BC,eAAe;IACfC,YAAY;IACZC,SAAS;QACLC,IAAI;QACJC,IAAI;QACJC,IAAI;QACJC,IAAI;QACJC,IAAI;IACR;IACAC,cAAc,CAACC,QAAW,CAAA;YACtBC,MAAM;gBACF,GAAGD,MAAME,EAAE,CAACC,UAAU,EAAE;gBACxBC,UAAUJ,MAAMK,SAAS,CAACV,EAAE;gBAC5BH,YAAYQ,MAAMR,UAAU;gBAC5Bc,YAAY;YAChB;QACJ,CAAA;IACAC,cAAc;IACdC,UAAU;QACNrB,YAAY;QACZmB,YAAY;QACZG,OAAO;YACHC,IAAI;gBAACN,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;YAC7DM,IAAI;gBAACR,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;YAC7DO,IAAI;gBAACT,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;YAC7DQ,IAAI;gBAACV,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;YAC7DS,IAAI;gBAACX,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;YAC7DU,IAAI;gBAACZ,UAAU;gBAAQZ,YAAYmB;gBAAWL,YAAY;YAAG;QACjE;IACJ;IACAW,SAAS;QACLvB,IAAI;QACJC,IAAI;QACJC,IAAI;QACJC,IAAI;QACJC,IAAI;IACR;IACAoB,QAAQlC;IACRmC,YAAY;QACRC,OAAO;YACHC,cAAc;gBACVC,oBAAM,KAAC3C;oBAAa4C,QAAQ;;gBAC5B3C,OAAO;YACX;YACA4C,QAAQ;gBACJC,OAAO;oBACHnB,YAAY;gBAChB;YACJ;QACJ;QACAoB,OAAO;YACHF,QAAQ;gBACJG,MAAM;oBACF,2BAA2B;wBAACC,eAAe;oBAAS;gBACxD;YACJ;QACJ;QACAC,MAAM;YACFR,cAAc;gBACVS,QAAQ;YACZ;YACAN,QAAQ,CAACxB,OAAO,EAAE,EAAE,EAAC+B,IAAI,EAAC,GAAM,CAAA;oBAC5BJ,MAAM;wBACFvB,UAAUvB,QAAQ;4BAACkD,MAAMA,QAAQ;4BAAMtB,OAAOT,MAAMK,SAAS;wBAAA;oBACjE;gBACJ,CAAA;QACJ;QACA2B,QAAQ;YACJR,QAAQ,IAAO,CAAA;oBACXG,MAAM;wBACFrB,YAAY;oBAChB;gBACJ,CAAA;YACA2B,UAAU;gBACNC,SAAS,IAAO,CAAA;wBACZP,MAAM;4BACFQ,iBAAiB;wBACrB;oBACJ,CAAA;YACJ;QACJ;QACAC,OAAO;YACHZ,QAAQ,CAACxB,OAAO,EAACqC,UAAU,EAAEC,OAAO,EAAC,EAAE,EAACP,IAAI,EAAEQ,OAAO,EAAC,GAAM,CAAA;oBACxDC,SAAS;wBACLC,MAAMJ,aACA,aACA,CAAC,IAAI,EAAExD,QAAQ;4BACXkD;4BACAtB,OAAO;gCACHf,IAAIX,IAAI;gCACRY,IAAIZ,IAAI;gCACRa,IAAIb,IAAI;gCACRc,IAAId,IAAI;gCACRe,IAAIf,IAAI;4BACZ;wBACJ,GAAG,CAAC;wBACV2D,UAAU;oBACd;oBACAjB,OAAO;wBACHkB,OAAO;wBACPvC,UAAUJ,MAAMQ,QAAQ,CAACC,KAAK,CAACI,EAAE,CAACT,QAAQ;wBAC1CZ,YAAYQ,MAAMQ,QAAQ,CAACC,KAAK,CAACI,EAAE,CAACrB,UAAU;wBAC9Cc,YAAY;oBAChB;oBACAsC,QAAQ;wBACJC,cAAcN,YAAY,WAAW,CAAC,UAAU,EAAE3D,MAAMS,OAAO,CAACC,IAAI,CAAC,EAAE,CAAC,CAAC,GAAG;oBAChF;oBACAW,MAAM;wBACF,sBAAsB;4BAClB6C,YAAYP,YAAY,WAAW,IAAI1D,QAAQ;gCAACkD,MAAMO;gCAAS7B,OAAOxB,YAAYQ,OAAO;4BAAA;wBAC7F;oBACJ;gBACJ,CAAA;QACJ;QACAsD,cAAc;YACV1B,cAAc;gBACVzC,OAAOA,MAAMS,OAAO,CAAC2D,IAAI,CAAC,EAAE;gBAC5BC,SAAS;YACb;QACJ;QACAC,cAAc;YACV7B,cAAc;gBACV8B,cAAc;YAClB;YACA3B,QAAQ,CAACxB,QAAW,CAAA;oBAChBoD,OAAO;wBACHC,cAAcrD,MAAMP,OAAO,CAACC,EAAE;oBAClC;oBACA4D,aAAa;wBACTlD,UAAUJ,MAAMK,SAAS,CAACV,EAAE;wBAC5Bf,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAC3B+D,cAAcrD,MAAMP,OAAO,CAACC,EAAE;wBAC9BF,YAAYQ,MAAMR,UAAU;oBAChC;oBACA+D,SAAS;wBACL3E,OAAOoB,MAAMkB,MAAM,CAACsC,GAAG,CAAC,EAAE;wBAC1BC,aAAazD,MAAMkB,MAAM,CAACsC,GAAG,CAAC,EAAE;oBACpC;oBACAE,OAAO;wBACH9E,OAAOoB,MAAMkB,MAAM,CAACsC,GAAG,CAAC,EAAE;wBAC1BhE,YAAYQ,MAAMR,UAAU;oBAChC;gBACJ,CAAA;QACJ;QACAmE,WAAW;YACPtC,cAAc;gBACVuC,QAAQ;YACZ;QACJ;QACAC,SAAS;YACLxC,cAAc;gBACVzC,OAAO;gBACPkF,KAAK;gBACLC,WAAW;gBACXC,WAAW;gBACXC,cAAc;gBACdC,QAAQ;YACZ;QACJ;QACAC,QAAQ;YACJ9C,cAAc;gBACVkB,SAAS;gBACT3D,OAAO;YACX;QACJ;QACAwF,iBAAiB;YACb5C,QAAQ;gBACJ6C,MAAM;oBACFC,WAAW;gBACf;YACJ;QACJ;QACAC,QAAQ;YACJlD,cAAc;gBACVzC,OAAO;YACX;YACA4C,QAAQ,CAACxB,QAAW,CAAA;oBAChB2B,MAAM;wBACF,GAAG3B,MAAME,EAAE,CAACsE,KAAK,CAAC;4BACdC,gBAAgB;4BAChB7F,OAAOoB,MAAMkB,MAAM,CAACwD,MAAM,CAAC,EAAE;wBACjC,EAAE;oBACN;gBACJ,CAAA;QACJ;QACAC,UAAU;YACNtD,cAAc;gBACVuC,QAAQ;YACZ;YACApC,QAAQ,CAACxB,QAAW,CAAA;oBAChBoD,OAAO;wBACHhD,UAAUJ,MAAMK,SAAS,CAACV,EAAE;wBAC5BW,YAAY;oBAChB;gBACJ,CAAA;QACJ;QACAsE,MAAM;YACFpD,QAAQ,IAAO,CAAA;oBACXG,MAAM;wBACFkD,eAAe;oBACnB;gBACJ,CAAA;QACJ;QACAC,OAAO;YACHtD,QAAQ;gBACJuD,cAAc;oBACVC,SAAS;oBACTC,YAAY;gBAChB;YACJ;QACJ;QACAC,SAAS;YACL7D,cAAc;gBACV8D,QAAQ;gBACRnB,WAAW;YACf;QACJ;QACAoB,OAAO;YACH5D,QAAQ;gBACJG,MAAM;oBACF0D,eAAe;oBACf/C,SAAS;oBACThC,YAAY;gBAChB;YACJ;QACJ;QACAgF,aAAa;YACTjE,cAAc;gBACVU,MAAM;gBACNwD,YAAY;YAChB;QACJ;QACAC,UAAU;YACNnE,cAAc;gBACVoE,IAAI;YACR;QACJ;QACAC,cAAc;YACVlE,QAAQ,CAACxB,OAAO,EAACpB,OAAO+G,gBAAgB,EAAoB,GAAM,CAAA;oBAC9DhE,MAAM;wBACF8B,aAAazD,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBACjC6C,iBAAiBnC,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBACrCsG,WAAW5F,MAAMiB,OAAO,CAACpB,EAAE;wBAC3ByC,SAAStC,MAAMP,OAAO,CAACE,EAAE;wBACzB,qBAAqB;4BACjBkG,aAAa7F,MAAMP,OAAO,CAACE,EAAE;wBACjC;oBACJ;oBACA2B,MAAM;wBACFa,iBAAiB;wBACjB2D,aAAa9F,MAAMP,OAAO,CAACE,EAAE;wBAC7Bf,OAAOoB,MAAMkB,MAAM,EAAE,CAACyE,iBAAiB,CAAC,EAAE;oBAC9C;oBACAI,aAAa;wBACTC,QAAQhG,MAAMP,OAAO,CAACC,EAAE;wBACxBd,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBAC/B;gBACJ,CAAA;YACA+B,cAAc;gBACVC,oBAAM,KAAC3C;oBAAa4C,QAAQ;;gBAC5B3C,OAAO;YACX;QACJ;QACAqH,UAAU;YACNzE,QAAQ;gBACJ0E,SAAS;oBACL,aAAa;wBAAChC,QAAQ;oBAAO;oBAC7B,YAAY;wBAACA,QAAQ;oBAAO;gBAChC;YACJ;QACJ;QACAiC,kBAAkB;YACd3E,QAAQ,CAACxB,QAAW,CAAA;oBAChB2B,MAAM;wBACFQ,iBAAiBnC,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACzC;gBACJ,CAAA;QACJ;QACA8G,SAAS;YACL/E,cAAc;gBACVU,MAAM;gBACNsE,6BAAe,KAAC3H;YACpB;YACA8C,QAAQ,CAACxB,OAAO,EAAuB,EAAE,EAAC+B,IAAI,EAAC,GAAM,CAAA;oBACjDuE,MAAM;wBACF,eAAe;4BACX1H,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;4BAC3B,sCAAsC;gCAClCV,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;4BAC/B;4BACA,+BAA+B;gCAC3BmE,aAAazD,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;4BACrC;wBACJ;oBACJ;oBACAiH,UAAU;wBACNjG,YAAY;wBACZ6B,iBAAiBnC,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBACrCV,OAAO;wBACP4H,QAAQ,CAAC,EAAEzH,IAAI,GAAG,OAAO,EAAEiB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE,CAAC,CAAC;wBACjD,oBAAoB;4BAChB6C,iBAAiBnC,MAAMyG,KAAK;wBAChC;wBAEA,qBAAqB;4BACjBtE,iBAAiBnC,MAAMyG,KAAK;4BAC5BhD,aAAazD,MAAMkB,MAAM,CAACwF,IAAI,CAAC,EAAE;4BACjC9H,OAAOoB,MAAMkB,MAAM,CAACwF,IAAI,CAAC,EAAE;wBAC/B;oBACJ;oBACAC,mBAAmB;wBACf/H,OAAOoB,MAAMkB,MAAM,CAACwF,IAAI,CAAC,EAAE;wBAC3BtG,UAAUrB,IAAI;oBAClB;oBACA6H,iBAAiB;wBACbhI,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAC3Bc,UAAUvB,QAAQ;4BAACkD;4BAAMtB,OAAOT,MAAMK,SAAS;wBAAA;oBACnD;oBACAwG,WAAW;wBACPtF,QAAQxC,IAAI;wBACZoD,iBAAiBnC,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACzC;oBACAwH,iBAAiB;wBACb3E,iBAAiBnC,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACzC;oBACAyH,mBAAmB;wBACfC,YAAY,CAAC,EAAEjI,IAAI,GAAG,OAAO,EAAEiB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE,CAAC,CAAC;oBACzD;oBACA2H,yBAAyB;wBACrBxD,aAAazD,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACrC;gBACJ,CAAA;QACJ;QACA4H,MAAM;YACF1F,QAAQ,CAACxB,OAAO,EAACmH,WAAW,EAAmB,GAAM,CAAA;oBACjDC,UAAU;wBACN,CAACD,gBAAgB,eAAe,iBAAiB,cAAc,EAAE,CAAC,EAAEpI,IAAI,GAAG,OAAO,EAC9EiB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE,CACvB,CAAC;oBACN;oBACA+H,KAAK;wBACD,CAACF,gBAAgB,eAAe,iBAAiB,cAAc,EAAE,CAAC,EAAEpI,IAAI,GAAG,kBAAkB,CAAC;wBAC9F,CAACoI,gBAAgB,eAAe,iBAAiB,cAAc,EAAEpI,IAAI,CAAC;oBAC1E;gBACJ,CAAA;QACJ;QACAuI,QAAQ;YACJ9F,QAAQ,CAACxB,QAAW,CAAA;oBAChBuH,OAAO;wBACH3I,OAAOoB,MAAMd,WAAW,KAAK,SAASc,MAAMkB,MAAM,CAACsG,IAAI,CAAC,EAAE,GAAGxH,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACrF;oBACAmI,MAAM;wBACF7I,OAAOoB,MAAMd,WAAW,KAAK,SAASc,MAAMkB,MAAM,CAACsG,IAAI,CAAC,EAAE,GAAGxH,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAEjF,mBAAmB;4BACf6C,iBAAiBnC,MAAMd,WAAW,KAAK,SAASc,MAAMkB,MAAM,CAACsG,IAAI,CAAC,EAAE,GAAGxH,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAC/F;wBAEA,oBAAoB;4BAChB6C,iBAAiBnC,MAAME,EAAE,CAACqC,OAAO,CAAC;gCAACA,SAAS;4BAAO,GAAGmF,UAAU;4BAChE9I,OAAOoB,MAAME,EAAE,CAACqC,OAAO,CAAC;gCAACA,SAAS;4BAAO,GAAG3D,KAAK;4BACjD,GAAGoB,MAAME,EAAE,CAACsE,KAAK,CAAC;gCAACrC,iBAAiBnC,MAAME,EAAE,CAACqC,OAAO,CAAC;oCAACA,SAAS;gCAAO,GAAGiC,KAAK;4BAAA,EAAE;wBACpF;oBACJ;gBACJ,CAAA;QACJ;QACAmD,SAAS;YACLnG,QAAQ,CAACxB,QAAW,CAAA;oBAChB2B,MAAM;wBACF/C,OAAOoB,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAC3BsI,cAAc,CAAC,EAAE5H,MAAMT,aAAa,CAAC,WAAW,EAAES,MAAMT,aAAa,CAAC,EAAE,CAAC;wBACzE,GAAGS,MAAME,EAAE,CAACsE,KAAK,CAAC;4BACdrC,iBAAiBnC,MAAMd,WAAW,KAAK,SAASc,MAAMkB,MAAM,CAACsG,IAAI,CAAC,EAAE,GAAGxH,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;wBAC/F,EAAE;oBACN;oBACA8D,OAAO;wBACHyE,KAAK/I,aAAa;wBAClBwB,YAAY;oBAChB;oBACAwH,UAAU;wBACN,CAAC,CAAC,CAAC,EAAEhJ,aAAa,SAAS,CAAC,CAAC,EAAE;4BAC3BwB,YAAY;wBAChB;oBACJ;gBACJ,CAAA;QACJ;QACAyH,QAAQ;YACJvG,QAAQ,CAACxB,QAAW,CAAA;oBAChB2B,MAAM;wBACF8B,aAAazD,MAAMkB,MAAM,CAAC5B,IAAI,CAAC,EAAE;oBACrC;gBACJ,CAAA;QACJ;QACA0I,YAAY;YACRxG,QAAQ;gBACJyG,UAAU;oBACN,oDAAoD;oBACpD,sCAAsC;wBAClC,sBAAsB;4BAClBjD,SAAS;wBACb;oBACJ;gBACJ;YACJ;QACJ;QACAkD,SAAS;YACL7G,cAAc;gBACVzC,OAAO;YACX;QACJ;IACJ;AACJ,EAAE"}
+{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {CheckSize16Px, CrossSize16Px, FilterSize16Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {\n    ActionIcon,\n    Alert,\n    Anchor,\n    AppShellNavbar,\n    Badge,\n    Button,\n    Checkbox,\n    CloseButton,\n    ColorSwatch,\n    Combobox,\n    ComboboxSearch,\n    Divider,\n    Input,\n    InputWrapper,\n    List,\n    Loader,\n    MantineThemeOverride,\n    MenuItem,\n    Modal,\n    MultiSelect,\n    NavLink,\n    Notification,\n    Popover,\n    Radio,\n    ScrollArea,\n    SegmentedControl,\n    Select,\n    Skeleton,\n    Stepper,\n    Tabs,\n    Text,\n    TextInput,\n    Title,\n    Tooltip,\n    createTheme,\n} from '@mantine/core';\nimport {DatePicker} from '@mantine/dates';\nimport ActionIconClasses from '../styles/ActionIcon.module.css';\nimport AlertClasses from '../styles/Alert.module.css';\nimport AnchorClasses from '../styles/Anchor.module.css';\nimport AppShellNavBarClasses from '../styles/AppShellNavBar.module.css';\nimport BadgeClasses from '../styles/Badge.module.css';\nimport ButtonClasses from '../styles/Button.module.css';\nimport CheckboxClasses from '../styles/Checkbox.module.css';\nimport ComboboxClasses from '../styles/Combobox.module.css';\nimport DatePickerClasses from '../styles/DatePicker.module.css';\nimport InputClasses from '../styles/Input.module.css';\nimport InputWrapperClasses from '../styles/InputWrapper.module.css';\nimport ListClasses from '../styles/List.module.css';\nimport ModalClasses from '../styles/Modal.module.css';\nimport NavLinkClasses from '../styles/NavLink.module.css';\nimport NotificationClasses from '../styles/Notification.module.css';\nimport RadioClasses from '../styles/Radio.module.css';\nimport ScrollAreaClasses from '../styles/ScrollArea.module.css';\nimport SegmentedControlClasses from '../styles/SegmentedControl.module.css';\nimport SelectClasses from '../styles/Select.module.css';\nimport SkeletonClasses from '../styles/Skeleton.module.css';\nimport StepperClasses from '../styles/Stepper.module.css';\nimport TabsClasses from '../styles/Tabs.module.css';\nimport TextClasses from '../styles/Text.module.css';\nimport TitleClasses from '../styles/Title.module.css';\nimport {NotificationVars} from '../vars/Notification.vars';\nimport {TextVars} from '../vars/Text.vars';\nimport {PlasmaColors} from './PlasmaColors';\n\nexport const plasmaTheme: MantineThemeOverride = createTheme({\n    // These are overrides over https://github.com/mantinedev/mantine/blob/master/packages/%40mantine/core/src/core/MantineProvider/default-theme.ts\n    fontFamily: 'canada-type-gibson, sans-serif',\n    black: color.primary.gray[9],\n    defaultRadius: 8,\n    lineHeights: {md: '1.5'},\n    fontSmoothing: false,\n    spacing: {\n        xs: '8px',\n        sm: '16px',\n        md: '24px',\n        lg: '32px',\n        xl: '40px',\n    },\n    primaryColor: 'action',\n    headings: {\n        fontFamily: 'canada-type-gibson, sans-serif',\n        fontWeight: '500',\n        sizes: {\n            h1: {fontSize: '48px', lineHeight: '1.5', fontWeight: '300'},\n            h2: {fontSize: '32px', lineHeight: '1.5', fontWeight: '500'},\n            h3: {fontSize: '24px', lineHeight: '1.5', fontWeight: '500'},\n            h4: {fontSize: '18px', lineHeight: '1.5', fontWeight: '300'},\n            h5: {fontSize: '14px', lineHeight: '1.5', fontWeight: '500'},\n            h6: {fontSize: '12px', lineHeight: '1.5', fontWeight: '500'},\n        },\n    },\n    shadows: {\n        xs: '0px 1px 0px rgba(4, 8, 31, 0.08)',\n        sm: '0px 2px 4px rgba(4, 8, 31, 0.12)',\n        md: '0px 4px 8px rgba(4, 8, 31, 0.08)',\n        lg: '0px 8px 16px rgba(7, 12, 41, 0.06)',\n        xl: '0px 16px 24px rgba(4, 8, 31, 0.06)',\n    },\n    colors: PlasmaColors,\n    components: {\n        ActionIcon: ActionIcon.extend({\n            classNames: {root: ActionIconClasses.root},\n        }),\n        Alert: Alert.extend({\n            defaultProps: {\n                icon: <InfoSize24Px height={24} />,\n                color: 'navy',\n            },\n            classNames: {title: AlertClasses.title},\n        }),\n        Anchor: Anchor.extend({\n            defaultProps: {\n                color: 'action.6',\n            },\n            classNames: {root: AnchorClasses.root},\n        }),\n        AppShellNavbar: AppShellNavbar.extend({\n            classNames: {navbar: AppShellNavBarClasses.navbar},\n        }),\n        Badge: Badge.extend({\n            classNames: {root: BadgeClasses.root},\n            defaultProps: {\n                variant: 'light',\n            },\n        }),\n        Button: Button.extend({\n            classNames: ButtonClasses,\n        }),\n        Checkbox: Checkbox.extend({\n            defaultProps: {\n                radius: 'sm',\n            },\n            classNames: {label: CheckboxClasses.label, input: CheckboxClasses.input},\n        }),\n        CloseButton: CloseButton.extend({\n            defaultProps: {\n                icon: <CrossSize16Px height={16} aria-label=\"close\" />,\n            },\n        }),\n        ColorSwatch: ColorSwatch.extend({\n            defaultProps: {\n                size: 8,\n                withShadow: false,\n            },\n        }),\n        Combobox: Combobox.extend({\n            classNames: {option: SelectClasses.option, search: ComboboxClasses.search},\n        }),\n        ComboboxSearch: ComboboxSearch.extend({\n            defaultProps: {\n                placeholder: 'Search',\n                rightSection: <FilterSize16Px height={16} color=\"gray.5\" />,\n            },\n        }),\n        DatePicker: DatePicker.extend({\n            classNames: {monthCell: DatePickerClasses.monthCell},\n        }),\n        Divider: Divider.extend({\n            defaultProps: {\n                color: 'gray.3',\n            },\n        }),\n        Input: Input.extend({\n            classNames: InputClasses,\n        }),\n        InputWrapper: InputWrapper.extend({\n            classNames: InputWrapperClasses,\n        }),\n        Loader: Loader.extend({\n            defaultProps: {\n                type: 'dots',\n                color: 'action',\n                role: 'presentation',\n            },\n        }),\n        List: List.extend({\n            classNames: {root: ListClasses.root},\n        }),\n        MenuItem: MenuItem.extend({\n            defaultProps: {\n                fw: 300,\n            },\n        }),\n        Modal: Modal.extend({\n            classNames: ModalClasses,\n        }),\n        ModalOverlay: Modal.Overlay.extend({\n            defaultProps: {\n                color: color.primary.navy[9],\n                backgroundOpacity: 0.9,\n            },\n        }),\n        ModalRoot: Modal.Root.extend({\n            defaultProps: {\n                padding: 'lg',\n            },\n        }),\n        MultiSelect: MultiSelect.extend({defaultProps: {hidePickedOptions: true}}),\n        NavLink: NavLink.extend({classNames: NavLinkClasses}),\n        Notification: Notification.extend({\n            defaultProps: {\n                icon: <InfoSize24Px height={24} />,\n                color: 'info',\n            },\n            classNames: {\n                root: NotificationClasses.root,\n                icon: NotificationClasses.icon,\n                closeButton: NotificationClasses.closeButton,\n            },\n            vars: NotificationVars,\n        }),\n        Popover: Popover.extend({\n            defaultProps: {\n                shadow: 'md',\n                withArrow: true,\n            },\n        }),\n        Radio: Radio.extend({\n            classNames: {labelWrapper: RadioClasses.labelWrapper},\n        }),\n        ScrollArea: ScrollArea.extend({\n            classNames: {viewport: ScrollAreaClasses.viewport},\n        }),\n        SegmentedControl: SegmentedControl.extend({\n            classNames: {root: SegmentedControlClasses.root},\n        }),\n        Select: Select.extend({\n            defaultProps: {withCheckIcon: false, allowDeselect: false},\n            classNames: {input: SelectClasses.input, option: SelectClasses.option},\n        }),\n        Skeleton: Skeleton.extend({\n            classNames: {root: SkeletonClasses.root},\n        }),\n        Stepper: Stepper.extend({\n            defaultProps: {\n                size: 'xs',\n                completedIcon: <CheckSize16Px />,\n            },\n            classNames: {\n                step: StepperClasses.step,\n                stepIcon: StepperClasses.stepIcon,\n                stepCompletedIcon: StepperClasses.stepCompletedIcon,\n                stepDescription: StepperClasses.stepDescription,\n                separator: StepperClasses.separator,\n                verticalSeparator: StepperClasses.verticalSeparator,\n            },\n        }),\n        Tabs: Tabs.extend({\n            classNames: {list: TabsClasses.list, tab: TabsClasses.tab},\n        }),\n        Text: Text.extend({\n            classNames: TextClasses,\n            vars: TextVars,\n        }),\n        TextInput: TextInput.extend({\n            defaultProps: {\n                radius: 8,\n            },\n        }),\n        Title: Title.extend({\n            classNames: {root: TitleClasses.root},\n        }),\n        Tooltip: Tooltip.extend({\n            defaultProps: {\n                color: 'navy',\n                maw: 300,\n                multiline: true,\n                withArrow: true,\n                zIndex: 10000,\n            },\n        }),\n    },\n});\n"],"names":["CheckSize16Px","CrossSize16Px","FilterSize16Px","InfoSize24Px","color","ActionIcon","Alert","Anchor","AppShellNavbar","Badge","Button","Checkbox","CloseButton","ColorSwatch","Combobox","ComboboxSearch","Divider","Input","InputWrapper","List","Loader","MenuItem","Modal","MultiSelect","NavLink","Notification","Popover","Radio","ScrollArea","SegmentedControl","Select","Skeleton","Stepper","Tabs","Text","TextInput","Title","Tooltip","createTheme","DatePicker","ActionIconClasses","AlertClasses","AnchorClasses","AppShellNavBarClasses","BadgeClasses","ButtonClasses","CheckboxClasses","ComboboxClasses","DatePickerClasses","InputClasses","InputWrapperClasses","ListClasses","ModalClasses","NavLinkClasses","NotificationClasses","RadioClasses","ScrollAreaClasses","SegmentedControlClasses","SelectClasses","SkeletonClasses","StepperClasses","TabsClasses","TextClasses","TitleClasses","NotificationVars","TextVars","PlasmaColors","plasmaTheme","fontFamily","black","primary","gray","defaultRadius","lineHeights","md","fontSmoothing","spacing","xs","sm","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","lineHeight","h2","h3","h4","h5","h6","shadows","colors","components","extend","classNames","root","defaultProps","icon","height","title","navbar","variant","radius","label","input","aria-label","size","withShadow","option","search","placeholder","rightSection","monthCell","type","role","fw","ModalOverlay","Overlay","navy","backgroundOpacity","ModalRoot","Root","padding","hidePickedOptions","closeButton","vars","shadow","withArrow","labelWrapper","viewport","withCheckIcon","allowDeselect","completedIcon","step","stepIcon","stepCompletedIcon","stepDescription","separator","verticalSeparator","list","tab","maw","multiline","zIndex"],"mappings":"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"}

package/dist/esm/theme/mergeCSSVariablesResolvers.d.ts

@@ -0,0 +1,3 @@
+import { CSSVariablesResolver } from '@mantine/core';
+export declare const mergeCSSVariablesResolvers: (...resolvers: CSSVariablesResolver[]) => CSSVariablesResolver;
+//# sourceMappingURL=mergeCSSVariablesResolvers.d.ts.map

package/dist/esm/theme/mergeCSSVariablesResolvers.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"mergeCSSVariablesResolvers.d.ts","sourceRoot":"","sources":["../../../src/theme/mergeCSSVariablesResolvers.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,oBAAoB,EAAY,MAAM,eAAe,CAAC;AAE9D,eAAO,MAAM,0BAA0B,iBACpB,oBAAoB,EAAE,KAAG,oBAMlC,CAAC"}

package/dist/esm/theme/mergeCSSVariablesResolvers.js

@@ -0,0 +1,8 @@
+import { deepMerge } from '@mantine/core';
+export const mergeCSSVariablesResolvers = (...resolvers)=>(theme)=>resolvers.filter(Boolean).reduce((acc, resolver)=>deepMerge(acc, resolver(theme)), {
+            variables: {},
+            dark: {},
+            light: {}
+        });
+
+//# sourceMappingURL=mergeCSSVariablesResolvers.js.map

package/dist/esm/theme/mergeCSSVariablesResolvers.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/theme/mergeCSSVariablesResolvers.ts"],"sourcesContent":["import {CSSVariablesResolver, deepMerge} from '@mantine/core';\n\nexport const mergeCSSVariablesResolvers =\n    (...resolvers: CSSVariablesResolver[]): CSSVariablesResolver =>\n    (theme) =>\n        resolvers.filter(Boolean).reduce((acc, resolver) => deepMerge(acc, resolver(theme)), {\n            variables: {},\n            dark: {},\n            light: {},\n        });\n"],"names":["deepMerge","mergeCSSVariablesResolvers","resolvers","theme","filter","Boolean","reduce","acc","resolver","variables","dark","light"],"mappings":"AAAA,SAA8BA,SAAS,QAAO,gBAAgB;AAE9D,OAAO,MAAMC,6BACT,CAAC,GAAGC,YACJ,CAACC,QACGD,UAAUE,MAAM,CAACC,SAASC,MAAM,CAAC,CAACC,KAAKC,WAAaR,UAAUO,KAAKC,SAASL,SAAS;YACjFM,WAAW,CAAC;YACZC,MAAM,CAAC;YACPC,OAAO,CAAC;QACZ,GAAG"}

package/dist/esm/theme/plasmaCSSVariablesResolver.d.ts

@@ -0,0 +1,3 @@
+import { CSSVariablesResolver } from '@mantine/core';
+export declare const plasmaCSSVariablesResolver: CSSVariablesResolver;
+//# sourceMappingURL=plasmaCSSVariablesResolver.d.ts.map

package/dist/esm/theme/plasmaCSSVariablesResolver.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"plasmaCSSVariablesResolver.d.ts","sourceRoot":"","sources":["../../../src/theme/plasmaCSSVariablesResolver.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,oBAAoB,EAAiC,MAAM,eAAe,CAAC;AAEnF,eAAO,MAAM,0BAA0B,EAAE,oBAWxC,CAAC"}

package/dist/esm/theme/plasmaCSSVariablesResolver.js

@@ -0,0 +1,15 @@
+import { keys } from '@mantine/core';
+export const plasmaCSSVariablesResolver = (theme)=>{
+    const result = {
+        variables: {},
+        dark: {},
+        light: {}
+    };
+    keys(theme.colors).forEach((color)=>{
+        result.light[`--mantine-color-${color}-light`] = theme.colors[color][color === 'gray' ? 1 : 0];
+        result.light[`--mantine-color-${color}-light-hover`] = theme.colors[color][color === 'gray' ? 2 : 1];
+    });
+    return result;
+};
+
+//# sourceMappingURL=plasmaCSSVariablesResolver.js.map

package/dist/esm/theme/plasmaCSSVariablesResolver.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/theme/plasmaCSSVariablesResolver.ts"],"sourcesContent":["import {CSSVariablesResolver, ConvertCSSVariablesInput, keys} from '@mantine/core';\n\nexport const plasmaCSSVariablesResolver: CSSVariablesResolver = (theme) => {\n    const result: ConvertCSSVariablesInput = {\n        variables: {},\n        dark: {},\n        light: {},\n    };\n    keys(theme.colors).forEach((color) => {\n        result.light[`--mantine-color-${color}-light`] = theme.colors[color][color === 'gray' ? 1 : 0];\n        result.light[`--mantine-color-${color}-light-hover`] = theme.colors[color][color === 'gray' ? 2 : 1];\n    });\n    return result;\n};\n"],"names":["keys","plasmaCSSVariablesResolver","theme","result","variables","dark","light","colors","forEach","color"],"mappings":"AAAA,SAAwDA,IAAI,QAAO,gBAAgB;AAEnF,OAAO,MAAMC,6BAAmD,CAACC;IAC7D,MAAMC,SAAmC;QACrCC,WAAW,CAAC;QACZC,MAAM,CAAC;QACPC,OAAO,CAAC;IACZ;IACAN,KAAKE,MAAMK,MAAM,EAAEC,OAAO,CAAC,CAACC;QACxBN,OAAOG,KAAK,CAAC,CAAC,gBAAgB,EAAEG,MAAM,MAAM,CAAC,CAAC,GAAGP,MAAMK,MAAM,CAACE,MAAM,CAACA,UAAU,SAAS,IAAI,EAAE;QAC9FN,OAAOG,KAAK,CAAC,CAAC,gBAAgB,EAAEG,MAAM,YAAY,CAAC,CAAC,GAAGP,MAAMK,MAAM,CAACE,MAAM,CAACA,UAAU,SAAS,IAAI,EAAE;IACxG;IACA,OAAON;AACX,EAAE"}

package/dist/esm/types/css/index.d.js

@@ -0,0 +1,2 @@
+
+//# sourceMappingURL=index.d.js.map

package/dist/esm/types/css/index.d.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../../src/types/css/index.d.ts"],"names":[],"mappings":""}

package/dist/esm/utils/createFactoryComponent.d.ts

@@ -0,0 +1,4 @@
+import { ExtendComponent, FactoryPayload, MantineThemeComponent } from '@mantine/core';
+export declare const identity: <T>(value: T) => T;
+export type CustomComponentThemeExtend<T extends FactoryPayload> = (props: ExtendComponent<T>) => MantineThemeComponent;
+//# sourceMappingURL=createFactoryComponent.d.ts.map

package/dist/esm/utils/createFactoryComponent.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"createFactoryComponent.d.ts","sourceRoot":"","sources":["../../../src/utils/createFactoryComponent.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,eAAe,EAAE,cAAc,EAAE,qBAAqB,EAAC,MAAM,eAAe,CAAC;AAErF,eAAO,MAAM,QAAQ,oBAA4B,CAAC;AAElD,MAAM,MAAM,0BAA0B,CAAC,CAAC,SAAS,cAAc,IAAI,CAAC,KAAK,EAAE,eAAe,CAAC,CAAC,CAAC,KAAK,qBAAqB,CAAC"}

package/dist/esm/utils/createFactoryComponent.js

@@ -0,0 +1,3 @@
+export const identity = (value)=>value;
+
+//# sourceMappingURL=createFactoryComponent.js.map

package/dist/esm/utils/createFactoryComponent.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/utils/createFactoryComponent.ts"],"sourcesContent":["import {ExtendComponent, FactoryPayload, MantineThemeComponent} from '@mantine/core';\n\nexport const identity = <T>(value: T): T => value;\n\nexport type CustomComponentThemeExtend<T extends FactoryPayload> = (props: ExtendComponent<T>) => MantineThemeComponent;\n"],"names":["identity","value"],"mappings":"AAEA,OAAO,MAAMA,WAAW,CAAIC,QAAgBA,MAAM"}

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

@@ -1,3 +1,4 @@
+export * from './createFactoryComponent';
 export * from './createPolymorphicComponent';
 export * from './overrideComponent';
 //# sourceMappingURL=index.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/utils/index.ts"],"names":[],"mappings":"AAAA,cAAc,0BAA0B,CAAC;AACzC,cAAc,8BAA8B,CAAC;AAC7C,cAAc,qBAAqB,CAAC"}

package/dist/esm/utils/index.js

@@ -1,3 +1,4 @@
+export * from './createFactoryComponent';
 export * from './createPolymorphicComponent';
 export * from './overrideComponent';
 

package/dist/esm/utils/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from './createPolymorphicComponent';\nexport * from './overrideComponent';\n"],"names":[],"mappings":"AAAA,cAAc,+BAA+B;AAC7C,cAAc,sBAAsB"}
+{"version":3,"sources":["../../../src/utils/index.ts"],"sourcesContent":["export * from './createFactoryComponent';\nexport * from './createPolymorphicComponent';\nexport * from './overrideComponent';\n"],"names":[],"mappings":"AAAA,cAAc,2BAA2B;AACzC,cAAc,+BAA+B;AAC7C,cAAc,sBAAsB"}

package/dist/esm/vars/Notification.vars.d.ts

@@ -0,0 +1,3 @@
+import { NotificationFactory, PartialVarsResolver } from '@mantine/core';
+export declare const NotificationVars: PartialVarsResolver<NotificationFactory>;
+//# sourceMappingURL=Notification.vars.d.ts.map

package/dist/esm/vars/Notification.vars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Notification.vars.d.ts","sourceRoot":"","sources":["../../../src/vars/Notification.vars.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,mBAAmB,EAAE,mBAAmB,EAAC,MAAM,eAAe,CAAC;AAEvE,eAAO,MAAM,gBAAgB,EAAE,mBAAmB,CAAC,mBAAmB,CAWrE,CAAC"}

package/dist/esm/vars/Notification.vars.js

@@ -0,0 +1,34 @@
+export const NotificationVars = (theme, props)=>{
+    if (props.color === 'success') {
+        return {
+            root: {},
+            icon: {
+                color: theme.colors.success[6]
+            }
+        };
+    }
+    if (props.color === 'warning') {
+        return {
+            root: {},
+            icon: {
+                color: theme.colors.warning[6]
+            }
+        };
+    }
+    if (props.color === 'critical') {
+        return {
+            root: {},
+            icon: {
+                color: theme.colors.critical[6]
+            }
+        };
+    }
+    return {
+        root: {},
+        icon: {
+            color: theme.colors.info[6]
+        }
+    };
+};
+
+//# sourceMappingURL=Notification.vars.js.map

package/dist/esm/vars/Notification.vars.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/vars/Notification.vars.ts"],"sourcesContent":["import {NotificationFactory, PartialVarsResolver} from '@mantine/core';\n\nexport const NotificationVars: PartialVarsResolver<NotificationFactory> = (theme, props) => {\n    if (props.color === 'success') {\n        return {root: {}, icon: {color: theme.colors.success[6]}};\n    }\n    if (props.color === 'warning') {\n        return {root: {}, icon: {color: theme.colors.warning[6]}};\n    }\n    if (props.color === 'critical') {\n        return {root: {}, icon: {color: theme.colors.critical[6]}};\n    }\n    return {root: {}, icon: {color: theme.colors.info[6]}};\n};\n"],"names":["NotificationVars","theme","props","color","root","icon","colors","success","warning","critical","info"],"mappings":"AAEA,OAAO,MAAMA,mBAA6D,CAACC,OAAOC;IAC9E,IAAIA,MAAMC,KAAK,KAAK,WAAW;QAC3B,OAAO;YAACC,MAAM,CAAC;YAAGC,MAAM;gBAACF,OAAOF,MAAMK,MAAM,CAACC,OAAO,CAAC,EAAE;YAAA;QAAC;IAC5D;IACA,IAAIL,MAAMC,KAAK,KAAK,WAAW;QAC3B,OAAO;YAACC,MAAM,CAAC;YAAGC,MAAM;gBAACF,OAAOF,MAAMK,MAAM,CAACE,OAAO,CAAC,EAAE;YAAA;QAAC;IAC5D;IACA,IAAIN,MAAMC,KAAK,KAAK,YAAY;QAC5B,OAAO;YAACC,MAAM,CAAC;YAAGC,MAAM;gBAACF,OAAOF,MAAMK,MAAM,CAACG,QAAQ,CAAC,EAAE;YAAA;QAAC;IAC7D;IACA,OAAO;QAACL,MAAM,CAAC;QAAGC,MAAM;YAACF,OAAOF,MAAMK,MAAM,CAACI,IAAI,CAAC,EAAE;QAAA;IAAC;AACzD,EAAE"}

package/dist/esm/vars/Text.vars.d.ts

@@ -0,0 +1,3 @@
+import { PartialVarsResolver, TextFactory } from '@mantine/core';
+export declare const TextVars: PartialVarsResolver<TextFactory>;
+//# sourceMappingURL=Text.vars.d.ts.map

package/dist/esm/vars/Text.vars.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Text.vars.d.ts","sourceRoot":"","sources":["../../../src/vars/Text.vars.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,mBAAmB,EAAE,WAAW,EAAc,MAAM,eAAe,CAAC;AAE5E,eAAO,MAAM,QAAQ,EAAE,mBAAmB,CAAC,WAAW,CAKrD,CAAC"}

package/dist/esm/vars/Text.vars.js

@@ -0,0 +1,15 @@
+import { getFontSize } from '@mantine/core';
+export const TextVars = (theme, props)=>{
+    if (!props.size) {
+        return {
+            root: {
+                '--text-fz': getFontSize('sm')
+            }
+        };
+    }
+    return {
+        root: {}
+    };
+};
+
+//# sourceMappingURL=Text.vars.js.map

package/dist/esm/vars/Text.vars.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../../src/vars/Text.vars.ts"],"sourcesContent":["import {PartialVarsResolver, TextFactory, getFontSize} from '@mantine/core';\n\nexport const TextVars: PartialVarsResolver<TextFactory> = (theme, props) => {\n    if (!props.size) {\n        return {root: {'--text-fz': getFontSize('sm')}};\n    }\n    return {root: {}};\n};\n"],"names":["getFontSize","TextVars","theme","props","size","root"],"mappings":"AAAA,SAA0CA,WAAW,QAAO,gBAAgB;AAE5E,OAAO,MAAMC,WAA6C,CAACC,OAAOC;IAC9D,IAAI,CAACA,MAAMC,IAAI,EAAE;QACb,OAAO;YAACC,MAAM;gBAAC,aAAaL,YAAY;YAAK;QAAC;IAClD;IACA,OAAO;QAACK,MAAM,CAAC;IAAC;AACpB,EAAE"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveord/plasma-mantine",
-  "version": "52.27.4",
+  "version": "53.0.0",
   "description": "A Plasma flavoured Mantine theme",
   "keywords": [
     "plasma",
@@ -31,28 +31,30 @@
     "@dnd-kit/modifiers": "7.0.0",
     "@dnd-kit/sortable": "8.0.0",
     "@dnd-kit/utilities": "3.2.1",
-    "@mantine/utils": "6.0.19",
+    "@mantine/utils": "6.0.21",
     "@monaco-editor/react": "4.5.1",
     "@swc/helpers": "0.5.1",
-    "@tanstack/react-table": "8.14.0",
+    "@tanstack/react-table": "8.15.0",
     "@tanstack/table-core": "8.14.0",
+    "clsx": "2.0.0",
     "dayjs": "1.11.9",
     "fast-deep-equal": "3.1.3",
     "lodash.debounce": "4.0.8",
     "lodash.defaultsdeep": "4.6.1",
     "monaco-editor": "0.41.0",
-    "@coveord/plasma-react-icons": "52.27.4",
-    "@coveord/plasma-tokens": "52.27.4"
+    "@coveord/plasma-react-icons": "53.0.0",
+    "@coveord/plasma-tokens": "53.0.0"
   },
   "devDependencies": {
     "@emotion/react": "11.11.1",
-    "@mantine/carousel": "6.0.19",
-    "@mantine/core": "6.0.19",
-    "@mantine/dates": "6.0.19",
-    "@mantine/form": "6.0.19",
-    "@mantine/hooks": "6.0.19",
-    "@mantine/modals": "6.0.19",
-    "@mantine/notifications": "6.0.19",
+    "@mantine/carousel": "7.6.1",
+    "@mantine/code-highlight": "7.6.1",
+    "@mantine/core": "7.6.1",
+    "@mantine/dates": "7.6.1",
+    "@mantine/form": "7.6.1",
+    "@mantine/hooks": "7.6.1",
+    "@mantine/modals": "7.6.1",
+    "@mantine/notifications": "7.6.1",
     "@swc/cli": "0.1.62",
     "@swc/core": "1.3.78",
     "@swc/jest": "0.2.29",
@@ -75,10 +77,14 @@
     "jest-environment-jsdom": "29.6.3",
     "jest-junit": "16.0.0",
     "npm-run-all2": "5.0.0",
+    "postcss": "8.4.32",
+    "postcss-preset-mantine": "^1.11.0",
+    "postcss-simple-vars": "^7.0.1",
     "publint": "0.2.2",
     "react": "18.2.0",
     "react-dom": "18.2.0",
     "rimraf": "5.0.1",
+    "sass": "1.66.1",
     "tslib": "2.6.2",
     "typescript": "5.2.2",
     "vitest": "1.0.1",
@@ -86,13 +92,14 @@
   },
   "peerDependencies": {
     "@emotion/react": "^11.10.0",
-    "@mantine/carousel": "^6.0.1",
-    "@mantine/core": "^6.0.1",
-    "@mantine/dates": "^6.0.1",
-    "@mantine/form": "^6.0.1",
-    "@mantine/hooks": "^6.0.1",
-    "@mantine/modals": "^6.0.1",
-    "@mantine/notifications": "^6.0.1",
+    "@mantine/carousel": "^7.6.1",
+    "@mantine/code-highlight": "^7.6.1",
+    "@mantine/core": "^7.6.1",
+    "@mantine/dates": "^7.6.1",
+    "@mantine/form": "^7.6.1",
+    "@mantine/hooks": "^7.6.1",
+    "@mantine/modals": "^7.6.1",
+    "@mantine/notifications": "^7.6.1",
     "embla-carousel-react": "^7.0.4",
     "react": ">= 18.0.0",
     "react-dom": ">= 18.0.0"

package/postcss.config.cjs

@@ -0,0 +1,5 @@
+module.exports = {
+    plugins: {
+        'postcss-preset-mantine': {},
+    },
+};

package/src/components/action-icon/ActionIcon.tsx

@@ -1,7 +1,15 @@
-import {ActionIcon as MantineActionIcon, type ActionIconProps as MantineActionIconProps} from '@mantine/core';
-import {forwardRef, MouseEvent, MouseEventHandler, useState} from 'react';
-
-import {createPolymorphicComponent} from '../../utils';
+import {
+    ActionIcon as MantineActionIcon,
+    ActionIconCssVariables,
+    ActionIconGroup,
+    type ActionIconProps as MantineActionIconProps,
+    ActionIconStylesNames,
+    ActionIconVariant,
+    Factory,
+    polymorphicFactory,
+} from '@mantine/core';
+import {MouseEventHandler} from 'react';
+import {useClickWithLoading} from '../../hooks/useClickWithLoading';
 import {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from '../button/ButtonWithDisabledTooltip';
 
 export interface ActionIconProps extends MantineActionIconProps, ButtonWithDisabledTooltipProps {
@@ -9,29 +17,21 @@ export interface ActionIconProps extends MantineActionIconProps, ButtonWithDisab
     onClick?: MouseEventHandler<HTMLButtonElement>;
 }
 
-const useLoadingHandler = (handler?: MouseEventHandler<HTMLButtonElement>) => {
-    const [isLoading, setIsLoading] = useState(false);
-
-    const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {
-        const possiblePromise: unknown = handler?.(event);
-        try {
-            if (possiblePromise instanceof Promise) {
-                setIsLoading(true);
-                await possiblePromise;
-                setIsLoading(false);
-            }
-        } catch (err) {
-            setIsLoading(false);
-            console.error(err);
-        }
+type ActionIconOverloadFactory = Factory<{
+    props: ActionIconProps;
+    defaultRef: HTMLButtonElement;
+    defaultComponent: 'button';
+    stylesNames: ActionIconStylesNames;
+    vars: ActionIconCssVariables;
+    variant: ActionIconVariant;
+    staticComponents: {
+        Group: typeof ActionIconGroup;
     };
+}>;
 
-    return {isLoading, handleClick};
-};
-
-const _ActionIcon = forwardRef<HTMLButtonElement, ActionIconProps>(
+export const ActionIcon = polymorphicFactory<ActionIconOverloadFactory>(
     ({disabledTooltip, disabled, disabledTooltipProps, loading, onClick, ...others}, ref) => {
-        const {isLoading, handleClick} = useLoadingHandler(onClick);
+        const {isLoading, handleClick} = useClickWithLoading(onClick);
         return (
             <ButtonWithDisabledTooltip
                 disabled={disabled}
@@ -40,7 +40,7 @@ const _ActionIcon = forwardRef<HTMLButtonElement, ActionIconProps>(
                 fullWidth={others.fullWidth}
             >
                 <MantineActionIcon
-                    loaderProps={{variant: 'oval'}}
+                    loaderProps={{type: 'oval'}}
                     ref={ref}
                     loading={isLoading || loading}
                     onClick={handleClick}
@@ -51,10 +51,4 @@ const _ActionIcon = forwardRef<HTMLButtonElement, ActionIconProps>(
         );
     },
 );
-
-export const ActionIcon = createPolymorphicComponent<
-    'button',
-    ActionIconProps,
-    {Group: typeof MantineActionIcon.Group}
->(_ActionIcon);
 ActionIcon.Group = MantineActionIcon.Group;

package/src/components/browser-preview/BrowserPreview.module.css

@@ -0,0 +1,21 @@
+.root {
+    box-shadow: var(--mantine-shadow-md);
+    border-radius: var(--mantine-radius-default);
+    border: 1px solid;
+    border-color: var(--mantine-color-gray-3);
+    flex: 1;
+}
+
+.header {
+    box-shadow: var(--mantine-shadow-xs);
+    border-radius: var(--mantine-radius-default) var(--mantine-radius-default) 0 0;
+}
+
+.content {
+    overflow: auto;
+    flex-grow: 1;
+}
+
+.infoIcon {
+    color: var(--mantine-color-gray-5);
+}

package/src/components/browser-preview/BrowserPreview.tsx

@@ -1,21 +1,10 @@
 import {InfoSize16Px} from '@coveord/plasma-react-icons';
-import {
-    Box,
-    ColorSwatch,
-    DefaultProps,
-    Flex,
-    Group,
-    Selectors,
-    Stack,
-    Text,
-    Title,
-    Tooltip,
-    useMantineTheme,
-} from '@mantine/core';
+import {Box, ColorSwatch, Flex, Group, Stack, StackProps, Text, Title, Tooltip, useMantineTheme} from '@mantine/core';
+import cx from 'clsx';
 import {PropsWithChildren} from 'react';
-import useStyles from './BrowserPreview.styles';
+import BrowserPreviewClasses from './BrowserPreview.module.css';
 
-export interface BrowserPreviewProps extends DefaultProps<Selectors<typeof useStyles>> {
+export interface BrowserPreviewProps extends StackProps {
     /**
      * Text to display in a tooltip in the header.
      *
@@ -31,40 +20,35 @@ export const BrowserPreview = ({
     children,
     headerTooltip,
     title,
-    // Style props
-    classNames,
     className,
-    styles,
-    unstyled,
     ...others
 }: PropsWithChildren<BrowserPreviewProps>) => {
     const theme = useMantineTheme();
-    const {classes, cx} = useStyles(null, {classNames, name: 'BrowserPreview', styles, unstyled});
     return (
-        <Stack className={cx(classes.root, className)} spacing={0} maw={544} mih={0} {...others}>
+        <Stack className={cx(BrowserPreviewClasses.root, className)} gap={0} maw={544} mih={0} {...others}>
             <Box>
-                <Group className={classes.header} position="apart" px="sm" py="xs" bg="gray.1" noWrap>
-                    <Group spacing="xs" noWrap>
-                        <Title color="gray.6" order={4}>
+                <Group className={BrowserPreviewClasses.header} justify="space-between" px="sm" py="xs" bg="gray.1">
+                    <Group gap="xs">
+                        <Title c="gray.6" order={4}>
                             Preview
                         </Title>
                         {!!headerTooltip && (
                             <Tooltip label={headerTooltip} position="right" maw={400}>
-                                <InfoSize16Px height={16} className={classes.infoIcon} />
+                                <InfoSize16Px height={16} className={BrowserPreviewClasses.infoIcon} />
                             </Tooltip>
                         )}
                     </Group>
                     <Text lineClamp={1} color="gray.6">
                         {title}
                     </Text>
-                    <Group spacing="xs" noWrap>
+                    <Group gap="xs">
                         <ColorSwatch color={theme.colors.gray[3]} />
                         <ColorSwatch color={theme.colors.gray[3]} />
                         <ColorSwatch color={theme.colors.gray[3]} />
                     </Group>
                 </Group>
             </Box>
-            <Flex className={classes.content} p="xl" direction="column">
+            <Flex className={BrowserPreviewClasses.content} p="xl" direction="column">
                 {children}
             </Flex>
         </Stack>

package/src/components/browser-preview/__tests__/BrowserPreview.spec.tsx

@@ -1,5 +1,5 @@
 import userEvent from '@testing-library/user-event';
-import {render, screen, waitFor} from '@testing-library/react';
+import {render, screen, waitFor} from '../../../__tests__/Utils';
 import {BrowserPreview} from '../BrowserPreview';
 
 describe('BrowserPreview', () => {
@@ -17,7 +17,7 @@ describe('BrowserPreview', () => {
         await waitFor(() => screen.findByRole('img', {name: /info/i}));
         await user.hover(screen.getByRole('img', {name: /info/i}));
 
-        expect(await screen.findByText(headerTooltip)).toBeVisible();
+        await waitFor(() => expect(screen.getByText(headerTooltip)).toBeVisible());
     });
 
     it('renders the specific title when provided', () => {