@coveord/plasma-mantine 51.1.28 → 51.2.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {getSize, MantineThemeOverride, NotificationProps, rem} 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    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: (theme) => ({\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        },\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}, {size}) => ({\n                content: {\n                    flex: fullScreen\n                        ? '0 0 100%'\n                        : `0 0 ${getSize({\n                              size,\n                              sizes: {\n                                  xs: rem(440),\n                                  sm: rem(550),\n                                  md: rem(800),\n                                  lg: rem(1334),\n                                  xl: rem('85%'),\n                              },\n                          })}`,\n                    overflow: 'auto',\n                },\n                title: {width: '100%'},\n            }),\n            defaultProps: {\n                overlayProps: {\n                    color: color.primary.navy[9],\n                    opacity: 0.9,\n                },\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                },\n                invalid: {\n                    color: theme.colors.red[9],\n                    borderColor: theme.colors.red[6],\n                },\n                error: {\n                    color: theme.colors.red[9],\n                },\n            }),\n        },\n        TextInput: {\n            defaultProps: {\n                radius: 8,\n            },\n        },\n        Tooltip: {\n            defaultProps: {\n                color: 'navy',\n                withArrow: true,\n                withinPortal: true,\n                multiline: true,\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        },\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        Segmented: {\n            styles: {\n                control: {\n                    zIndex: 'unset',\n                },\n            },\n        },\n    },\n};\n"],"names":["InfoSize24Px","color","getSize","rem","PlasmaColors","plasmaTheme","colorScheme","fontFamily","black","primary","gray","defaultRadius","lineHeight","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","undefined","h2","h3","h4","h5","h6","shadows","colors","components","Alert","defaultProps","icon","height","styles","title","Title","theme","root","letterSpacing","Text","weight","Button","variants","outline","backgroundColor","Modal","fullScreen","size","content","flex","overflow","width","overlayProps","navy","opacity","InputWrapper","withAsterisk","label","marginBottom","description","fontSizes","invalid","red","borderColor","error","TextInput","radius","Tooltip","withArrow","withinPortal","multiline","Loader","variant","DateRangePicker","cell","textAlign","Anchor","fn","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems","Popover","shadow","Badge","textTransform","padding","ColorSwatch","withShadow","MenuItem","fw","Notification","notificationType","boxShadow","paddingLeft","marginRight","closeButton","margin","Skeleton","visible","zIndex","Segmented","control"],"mappings":"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"}
+{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {getSize, MantineThemeOverride, NotificationProps, rem} 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    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}, {size}) => ({\n                content: {\n                    flex: fullScreen\n                        ? '0 0 100%'\n                        : `0 0 ${getSize({\n                              size,\n                              sizes: {\n                                  xs: rem(440),\n                                  sm: rem(550),\n                                  md: rem(800),\n                                  lg: rem(1334),\n                                  xl: rem('85%'),\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            }),\n            defaultProps: {\n                overlayProps: {\n                    color: color.primary.navy[9],\n                    opacity: 0.9,\n                },\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                },\n                invalid: {\n                    color: theme.colors.red[9],\n                    borderColor: theme.colors.red[6],\n                },\n                error: {\n                    color: theme.colors.red[9],\n                },\n            }),\n        },\n        TextInput: {\n            defaultProps: {\n                radius: 8,\n            },\n        },\n        Tooltip: {\n            defaultProps: {\n                color: 'navy',\n                withArrow: true,\n                withinPortal: true,\n                multiline: true,\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        Segmented: {\n            styles: {\n                control: {\n                    zIndex: 'unset',\n                },\n            },\n        },\n    },\n};\n"],"names":["InfoSize24Px","color","getSize","rem","PlasmaColors","plasmaTheme","colorScheme","fontFamily","black","primary","gray","defaultRadius","lineHeight","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","undefined","h2","h3","h4","h5","h6","shadows","colors","components","Alert","defaultProps","icon","height","styles","title","Title","root","letterSpacing","Text","weight","theme","size","fontSizes","Button","variants","outline","backgroundColor","Modal","fullScreen","content","flex","overflow","width","overlayProps","navy","opacity","InputWrapper","withAsterisk","label","marginBottom","description","invalid","red","borderColor","error","TextInput","radius","Tooltip","withArrow","withinPortal","multiline","Loader","variant","DateRangePicker","cell","textAlign","Anchor","fn","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems","Popover","shadow","Badge","textTransform","padding","ColorSwatch","withShadow","MenuItem","fw","Notification","notificationType","boxShadow","paddingLeft","marginRight","closeButton","margin","Skeleton","visible","zIndex","Segmented","control"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveord/plasma-mantine",
-  "version": "51.1.28",
+  "version": "51.2.0",
   "description": "A Plasma flavoured Mantine theme",
   "keywords": [
     "plasma",
@@ -25,7 +25,7 @@
     "lodash.defaultsdeep": "4.6.1",
     "monaco-editor": "0.34.0",
     "react-beautiful-dnd": "13.1.1",
-    "@coveord/plasma-react-icons": "51.1.25",
+    "@coveord/plasma-react-icons": "51.1.30",
     "@coveord/plasma-tokens": "50.0.2"
   },
   "devDependencies": {
@@ -38,7 +38,7 @@
     "@mantine/modals": "6.0.1",
     "@mantine/notifications": "6.0.1",
     "@swc/cli": "0.1.62",
-    "@swc/core": "1.3.41",
+    "@swc/core": "1.3.42",
     "@swc/jest": "0.2.24",
     "@testing-library/dom": "8.18.1",
     "@testing-library/jest-dom": "5.16.5",

package/src/components/header/__tests__/Header.spec.tsx

@@ -10,7 +10,7 @@ describe('Header', () => {
         const header = screen.getByRole('heading');
         expect(header).toMatchInlineSnapshot(`
           <h1
-            class="mantine-Text-root mantine-Title-root mantine-14ccmdx"
+            class="mantine-Text-root mantine-Title-root mantine-d1yoif"
           >
             child
           </h1>

package/src/components/header/__tests__/__snapshots__/Header.spec.tsx.snap

@@ -12,27 +12,27 @@ exports[`Header > renders the specified breadcrumbs above the title 1`] = `
         class="mantine-Breadcrumbs-root mantine-1ujbd2v"
       >
         <a
-          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-r41kyw"
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1yycs9g"
         >
           One
         </a>
         <div
-          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-se7e6j"
+          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-c5usyo"
         >
           /
         </div>
         <a
-          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-r41kyw"
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1yycs9g"
         >
           Two
         </a>
         <div
-          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-se7e6j"
+          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-c5usyo"
         >
           /
         </div>
         <a
-          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-r41kyw"
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1yycs9g"
         >
           Three
         </a>
@@ -41,13 +41,13 @@ exports[`Header > renders the specified breadcrumbs above the title 1`] = `
         class="mantine-xg7kom"
       >
         <h1
-          class="mantine-Text-root mantine-Title-root mantine-14ccmdx"
+          class="mantine-Text-root mantine-Title-root mantine-d1yoif"
         >
           Title
         </h1>
       </div>
       <div
-        class="mantine-Text-root mantine-vti01c"
+        class="mantine-Text-root mantine-1w25z6f"
       />
     </div>
   </div>

package/src/components/prompt/Prompt.tsx

@@ -1,35 +1,36 @@
+import {color} from '@coveord/plasma-tokens';
 import {createStyles, Modal, ModalProps} from '@mantine/core';
 import {Children, ReactElement, ReactNode} from 'react';
 import {PromptFooter} from './PromptFooter';
 
-const useStyles = createStyles((theme) => {
-    const white = '#fff';
-    return {
-        body: {
-            padding: 0,
-        },
-        modalType: {overflow: 'hidden', width: 550},
-        innerBody: {
-            padding: `${theme.spacing.md}px ${theme.spacing.xl}px ${theme.spacing.lg}px`,
-        },
-        header: {
-            padding: `${theme.spacing.md}px ${theme.spacing.xl}px`,
-            width: '100%',
-            borderBottom: `1px solid ${theme.colors.gray[3]}`,
-            fontSize: theme.headings.sizes.h4.fontSize,
-            lineHeight: theme.headings.sizes.h4.fontSize,
-        },
-        default: {},
-        success: {backgroundColor: theme.colors.lime[6], color: white},
-        warning: {backgroundColor: theme.colors.yellow[5], color: white},
-        critical: {
-            backgroundColor: theme.colors.red[6],
-            color: white,
-        },
-        info: {backgroundColor: theme.colors.navy[5], color: white},
-        whiteClose: {color: white, '&:hover': {backgroundColor: 'transparent'}},
-    };
-});
+const useStyles = createStyles((theme) => ({
+    body: {
+        padding: 0,
+    },
+    modalType: {overflow: 'hidden', width: 550},
+    innerBody: {
+        padding: `${theme.spacing.md} ${theme.spacing.xl} ${theme.spacing.lg}`,
+    },
+    header: {
+        padding: `${theme.spacing.md} ${theme.spacing.xl}`,
+        width: '100%',
+        borderBottom: `1px solid ${theme.colors.gray[3]}`,
+        fontSize: theme.headings.sizes.h3.fontSize,
+        lineHeight: theme.headings.sizes.h3.lineHeight,
+    },
+    default: {},
+    success: {backgroundColor: theme.colors.lime[6], color: color.primary.pureWhite},
+    warning: {backgroundColor: theme.colors.yellow[5], color: color.primary.pureWhite},
+    critical: {
+        backgroundColor: theme.colors.red[6],
+        color: color.primary.pureWhite,
+    },
+    info: {backgroundColor: theme.colors.navy[5], color: color.primary.pureWhite},
+    whiteClose: {color: color.primary.pureWhite, '&:hover': {backgroundColor: 'transparent'}},
+    title: {
+        color: color.primary.pureWhite,
+    },
+}));
 
 export interface PromptProps extends ModalProps {
     variant: 'default' | 'success' | 'warning' | 'critical' | 'info';
@@ -53,6 +54,7 @@ export const Prompt: PromptType = ({children, variant, size, ...otherProps}) =>
         close: !defaultVariant && classes.whiteClose,
         body: classes.body,
         modal: !defaultVariant && classes.modalType,
+        title: classes.title,
     };
 
     return (

package/src/components/table/Table.styles.ts

@@ -26,6 +26,7 @@ const useStyles = createStyles<string, TableStylesParams>((theme, {hasHeader, mu
             top: hasHeader ? 69 : 0,
             backgroundColor: theme.colorScheme === 'dark' ? theme.black : theme.white,
             transition: 'box-shadow 150ms ease',
+            zIndex: 1,
 
             '&::after': {
                 content: '""',

package/src/theme/Theme.tsx

@@ -52,16 +52,21 @@ export const plasmaTheme: MantineThemeOverride = {
             },
         },
         Title: {
-            styles: (theme) => ({
+            styles: {
                 root: {
                     '&:is(h1,h2,h3,h4,h5,h6)': {letterSpacing: '0.011em'},
                 },
-            }),
+            },
         },
         Text: {
             defaultProps: {
                 weight: 300,
             },
+            styles: (theme, {}, {size}) => ({
+                root: {
+                    fontSize: getSize({size: size ?? 'sm', sizes: theme.fontSizes}),
+                },
+            }),
         },
         Button: {
             styles: () => ({
@@ -94,7 +99,12 @@ export const plasmaTheme: MantineThemeOverride = {
                           })}`,
                     overflow: 'auto',
                 },
-                title: {width: '100%'},
+                title: {
+                    width: '100%',
+                    fontSize: theme.headings.sizes.h3.fontSize,
+                    lineHeight: theme.headings.sizes.h3.lineHeight,
+                    fontWeight: 500,
+                },
             }),
             defaultProps: {
                 overlayProps: {
@@ -168,6 +178,12 @@ export const plasmaTheme: MantineThemeOverride = {
             defaultProps: {
                 radius: 'sm',
             },
+            styles: (theme) => ({
+                label: {
+                    fontSize: theme.fontSizes.sm,
+                    fontWeight: 300,
+                },
+            }),
         },
         List: {
             styles: () => ({