@coveord/plasma-mantine 49.6.6 → 50.0.0

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/theme/Theme.tsx"],"sourcesContent":["import {ArrowHeadRightSize24Px, InfoSize24Px} from '@coveord/plasma-react-icons';\nimport {color} from '@coveord/plasma-tokens';\nimport {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} 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    spacing: {\n        xs: 8,\n        sm: 16,\n        md: 24,\n        lg: 32,\n        xl: 40,\n    },\n    primaryColor: 'action',\n    headings: {\n        fontFamily: 'canada-type-gibson, sans-serif',\n        fontWeight: 500,\n        sizes: {\n            h1: {fontSize: 48, lineHeight: '56px', fontWeight: 300},\n            h2: {fontSize: 32, lineHeight: '40px', fontWeight: 500},\n            h3: {fontSize: 24, lineHeight: '32px', fontWeight: 500},\n            h4: {fontSize: 18, lineHeight: '28px', fontWeight: 300},\n            h5: {fontSize: 14, lineHeight: '20px', fontWeight: 500},\n            h6: {fontSize: 12, lineHeight: '16px', 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', color: theme.colors.gray[9]},\n                },\n            }),\n        },\n        Button: {\n            styles: (theme, params: ButtonStylesParams) => ({\n                root: {\n                    fontWeight: 400,\n                    backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n                },\n            }),\n        },\n        Modal: {\n            styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n                modal: {\n                    width: fullScreen\n                        ? undefined\n                        : theme.fn.size({size, sizes: {xs: 440, sm: 550, md: 800, lg: 1334, xl: '85%'}}),\n                },\n            }),\n            defaultProps: {\n                overlayColor: color.primary.navy[9],\n                overlayOpacity: 0.9,\n            },\n        },\n        InputWrapper: {\n            defaultProps: {\n                withAsterisk: false,\n            },\n            styles: (theme) => ({\n                label: {\n                    marginBottom: theme.spacing.xs,\n                    lineHeight: '20px',\n                },\n                description: {\n                    lineHeight: '20px',\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        Breadcrumbs: {\n            defaultProps: {\n                separator: <ArrowHeadRightSize24Px height={24} />,\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',\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    },\n};\n"],"names":["plasmaTheme","colorScheme","fontFamily","black","color","primary","gray","defaultRadius","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","lineHeight","h2","h3","h4","h5","h6","shadows","colors","PlasmaColors","components","Alert","defaultProps","icon","InfoSize24Px","height","styles","title","Title","theme","root","letterSpacing","Button","params","backgroundColor","variant","undefined","Modal","size","fullScreen","modal","width","fn","overlayColor","navy","overlayOpacity","InputWrapper","withAsterisk","label","marginBottom","description","fontSizes","invalid","red","borderColor","error","TextInput","radius","Tooltip","withArrow","withinPortal","multiline","Breadcrumbs","separator","ArrowHeadRightSize24Px","Loader","DateRangePicker","cell","textAlign","Anchor","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems","Popover","shadow","Badge","textTransform","padding","ColorSwatch","withShadow","MenuItem","fw"],"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 {ButtonStylesParams, MantineThemeOverride, ModalStylesParams} 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: 8,\n        sm: 16,\n        md: 24,\n        lg: 32,\n        xl: 40,\n    },\n    primaryColor: 'action',\n    headings: {\n        fontFamily: 'canada-type-gibson, sans-serif',\n        fontWeight: 500,\n        sizes: {\n            h1: {fontSize: 48, lineHeight: undefined, fontWeight: 300},\n            h2: {fontSize: 32, lineHeight: undefined, fontWeight: 500},\n            h3: {fontSize: 24, lineHeight: undefined, fontWeight: 500},\n            h4: {fontSize: 18, lineHeight: undefined, fontWeight: 300},\n            h5: {fontSize: 14, lineHeight: undefined, fontWeight: 500},\n            h6: {fontSize: 12, 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: (theme, params: ButtonStylesParams) => ({\n                root: {\n                    fontWeight: 400,\n                    backgroundColor: params.variant === 'outline' ? 'white' : undefined,\n                },\n            }),\n        },\n        Modal: {\n            styles: (theme, {size, fullScreen}: ModalStylesParams) => ({\n                modal: {\n                    width: fullScreen\n                        ? undefined\n                        : theme.fn.size({size, sizes: {xs: 440, sm: 550, md: 800, lg: 1334, xl: '85%'}}),\n                    overflow: 'auto',\n                },\n                title: {width: '100%'},\n            }),\n            defaultProps: {\n                overlayColor: color.primary.navy[9],\n                overlayOpacity: 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                },\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',\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    },\n};\n"],"names":["plasmaTheme","colorScheme","fontFamily","black","color","primary","gray","defaultRadius","lineHeight","spacing","xs","sm","md","lg","xl","primaryColor","headings","fontWeight","sizes","h1","fontSize","undefined","h2","h3","h4","h5","h6","shadows","colors","PlasmaColors","components","Alert","defaultProps","icon","InfoSize24Px","height","styles","title","Title","theme","root","letterSpacing","Text","weight","Button","params","backgroundColor","variant","Modal","size","fullScreen","modal","width","fn","overflow","overlayColor","navy","overlayOpacity","InputWrapper","withAsterisk","label","marginBottom","description","fontSizes","invalid","red","borderColor","error","TextInput","radius","Tooltip","withArrow","withinPortal","multiline","Loader","DateRangePicker","cell","textAlign","Anchor","hover","textDecoration","action","Checkbox","List","listStyleType","Radio","labelWrapper","display","alignItems","Popover","shadow","Badge","textTransform","padding","ColorSwatch","withShadow","MenuItem","fw"],"mappings":"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"}

package/dist/definitions/components/header/Header.d.ts

@@ -1,32 +1,49 @@
 import { DefaultProps } from '@mantine/core';
-import { FunctionComponent, ReactNode } from 'react';
+import { FunctionComponent, ReactElement, ReactNode } from 'react';
 export interface HeaderProps extends DefaultProps {
     /**
      * The description text displayed inside the header underneath the title
      */
     description?: ReactNode;
-    /**
-     * Action buttons that can be displayed on the right of the header
-     */
-    actions?: ReactNode;
     /**
      * Whether the header should have a border on the bottom
      */
     borderBottom?: boolean;
+    /**
+     * Use the modal variant when displaying the header inside a modal
+     *
+     * @default 'page'
+     */
+    variant?: 'page' | 'modal';
+    /**
+     * The title of the header.
+     */
+    children: ReactNode;
+}
+interface HeaderType {
+    (props: HeaderProps): ReactElement;
+    Breadcrumbs: typeof HeaderBreadcrumbs;
+    Actions: typeof HeaderActions;
+    DocAnchor: typeof HeaderDocAnchor;
+}
+export declare const Header: HeaderType;
+declare const HeaderBreadcrumbs: FunctionComponent<{
+    children: ReactNode;
+}>;
+declare const HeaderActions: FunctionComponent<{
+    children: ReactNode;
+}>;
+export interface HeaderDocAnchorProps {
     /**
      * A href pointing to documentation related to the current panel.
      * When provided, an info icon is rendered next to the title as link to this documentation
      */
-    docLink?: string;
+    href: string;
     /**
      * The tooltip text shown when hovering over the doc link icon
      */
-    docLinkTooltipLabel?: string;
-    /**
-     * The title of the header.
-     * If more than one children are provided, each of them act as parts of a breadcrumb
-     */
-    children: ReactNode;
+    label?: string;
 }
-export declare const Header: FunctionComponent<HeaderProps>;
+declare const HeaderDocAnchor: FunctionComponent<HeaderDocAnchorProps>;
+export {};
 //# sourceMappingURL=Header.d.ts.map

package/dist/definitions/components/header/Header.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/header/Header.tsx"],"names":[],"mappings":"AACA,OAAO,EAAsB,YAAY,EAA8C,MAAM,eAAe,CAAC;AAC7G,OAAO,EAAC,iBAAiB,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAEnD,MAAM,WAAW,WAAY,SAAQ,YAAY;IAC7C;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,OAAO,CAAC,EAAE,SAAS,CAAC;IACpB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;OAGG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B;;;OAGG;IACH,QAAQ,EAAE,SAAS,CAAC;CACvB;AAED,eAAO,MAAM,MAAM,EAAE,iBAAiB,CAAC,WAAW,CA8BjD,CAAC"}
+{"version":3,"file":"Header.d.ts","sourceRoot":"","sources":["../../../../src/components/header/Header.tsx"],"names":[],"mappings":"AACA,OAAO,EAAsB,YAAY,EAAoD,MAAM,eAAe,CAAC;AACnH,OAAO,EAAW,iBAAiB,EAAE,YAAY,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAE3E,MAAM,WAAW,WAAY,SAAQ,YAAY;IAC7C;;OAEG;IACH,WAAW,CAAC,EAAE,SAAS,CAAC;IACxB;;OAEG;IACH,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB;;;;OAIG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,OAAO,CAAC;IAC3B;;OAEG;IACH,QAAQ,EAAE,SAAS,CAAC;CACvB;AAED,UAAU,UAAU;IAChB,CAAC,KAAK,EAAE,WAAW,GAAG,YAAY,CAAC;IACnC,WAAW,EAAE,OAAO,iBAAiB,CAAC;IACtC,OAAO,EAAE,OAAO,aAAa,CAAC;IAC9B,SAAS,EAAE,OAAO,eAAe,CAAC;CACrC;AAED,eAAO,MAAM,MAAM,EAAE,UAiCpB,CAAC;AAEF,QAAA,MAAM,iBAAiB,EAAE,iBAAiB,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAC,CAS/D,CAAC;AAEF,QAAA,MAAM,aAAa,EAAE,iBAAiB,CAAC;IAAC,QAAQ,EAAE,SAAS,CAAA;CAAC,CAA0D,CAAC;AAEvH,MAAM,WAAW,oBAAoB;IACjC;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CAM5D,CAAC"}

package/dist/definitions/components/index.d.ts

@@ -7,7 +7,6 @@ export * from './header';
 export * from './inline-confirm';
 export * from './table';
 export * from './prompt';
-export * from './modal';
 export * from './modal-wizard';
 export * from './button';
 export * from './menu';

package/dist/definitions/components/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,SAAS,CAAC;AACxB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/index.ts"],"names":[],"mappings":"AAAA,cAAc,eAAe,CAAC;AAC9B,cAAc,eAAe,CAAC;AAC9B,cAAc,cAAc,CAAC;AAC7B,cAAc,qBAAqB,CAAC;AACpC,cAAc,iBAAiB,CAAC;AAChC,cAAc,UAAU,CAAC;AACzB,cAAc,kBAAkB,CAAC;AACjC,cAAc,SAAS,CAAC;AACxB,cAAc,UAAU,CAAC;AACzB,cAAc,gBAAgB,CAAC;AAC/B,cAAc,UAAU,CAAC;AACzB,cAAc,QAAQ,CAAC"}

package/dist/definitions/components/modal-wizard/ModalWizard.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalWizard.d.ts","sourceRoot":"","sources":["../../../../src/components/modal-wizard/ModalWizard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAoB,YAAY,EAAS,UAAU,EAAY,SAAS,EAAC,MAAM,eAAe,CAAC;AACtG,OAAO,EAAW,YAAY,EAAoB,MAAM,OAAO,CAAC;AAKhE,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAElD,QAAA,MAAM,SAAS;;;;CAUZ,CAAC;AAEJ,KAAK,sBAAsB,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAE1D,MAAM,WAAW,gBACb,SAAQ,IAAI,CAAC,YAAY,CAAC,sBAAsB,CAAC,EAAE,YAAY,GAAG,QAAQ,CAAC,EACvE,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,CAAC;IAC1C;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,CAAC;IAEvB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAE3B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC;IAEzB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC;IAExB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,OAAO,CAAC;IAEjC;;SAEK;IACL,QAAQ,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC;CACxD;AAED,UAAU,eAAe;IACrB,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAAC;IAExC,IAAI,EAAE,OAAO,eAAe,CAAC;CAChC;AAED,eAAO,MAAM,WAAW,EAAE,eA0HzB,CAAC"}
+{"version":3,"file":"ModalWizard.d.ts","sourceRoot":"","sources":["../../../../src/components/modal-wizard/ModalWizard.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAiC,YAAY,EAAS,UAAU,EAAY,SAAS,EAAC,MAAM,eAAe,CAAC;AACnH,OAAO,EAAW,YAAY,EAA+B,MAAM,OAAO,CAAC;AAK3E,OAAO,EAAC,eAAe,EAAoC,MAAM,mBAAmB,CAAC;AAErF,QAAA,MAAM,SAAS;;;;CAUZ,CAAC;AAEJ,KAAK,sBAAsB,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAE1D,MAAM,WAAW,gBACb,SAAQ,IAAI,CAAC,YAAY,CAAC,sBAAsB,CAAC,EAAE,YAAY,GAAG,QAAQ,CAAC,EACvE,IAAI,CAAC,UAAU,EAAE,UAAU,GAAG,OAAO,CAAC;IAC1C;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;;;OAIG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IAEzB;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAE7B;;;;OAIG;IACH,iBAAiB,CAAC,EAAE,MAAM,CAAC;IAE3B;;OAEG;IACH,MAAM,CAAC,EAAE,MAAM,OAAO,CAAC;IAEvB;;OAEG;IACH,UAAU,CAAC,EAAE,MAAM,OAAO,CAAC;IAE3B;;;;OAIG;IACH,QAAQ,CAAC,EAAE,MAAM,OAAO,CAAC;IAEzB;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,OAAO,CAAC;IAExB;;OAEG;IACH,gBAAgB,CAAC,EAAE,MAAM,OAAO,CAAC;IAEjC;;SAEK;IACL,QAAQ,CAAC,EAAE,KAAK,CAAC,UAAU,CAAC,OAAO,eAAe,CAAC,CAAC,CAAC;CACxD;AAED,UAAU,eAAe;IACrB,CAAC,KAAK,EAAE,gBAAgB,GAAG,YAAY,CAAC;IAExC,IAAI,EAAE,OAAO,eAAe,CAAC;CAChC;AAED,eAAO,MAAM,WAAW,EAAE,eA0IzB,CAAC"}

package/dist/definitions/components/modal-wizard/ModalWizardStep.d.ts

@@ -1,22 +1,23 @@
-import { FunctionComponent, PropsWithChildren, ReactElement } from 'react';
+import { FunctionComponent, PropsWithChildren, ReactNode } from 'react';
 type DependsOnStep<T> = (currentStep: number, numberOfSteps: number) => T;
+export type ResolveStep<P> = P extends infer T | DependsOnStep<infer T> ? T : never;
 export interface ModalWizardStepProps {
     /**
      * The title of the current step. The title can be dependent on the current step if needed
      */
-    title?: string | ReactElement | DependsOnStep<string | ReactElement>;
+    title?: ReactNode | DependsOnStep<ReactNode>;
     /**
      * The description of the current step. The description can be dependent on the current step if needed
      */
-    description?: string | ReactElement | DependsOnStep<string | ReactElement>;
+    description?: string | DependsOnStep<string>;
     /**
      * A link to the documentation for the current step
      */
-    docLink?: string;
+    docLink?: string | DependsOnStep<string>;
     /**
      * A tooltip label for the docLink
      */
-    docLinkTooltipLabel?: string | ReactElement | DependsOnStep<string | ReactElement>;
+    docLinkTooltipLabel?: string | DependsOnStep<string>;
     /**
      * A function to validate the current step, it determines if the next step should be enabled or not.
      */
@@ -36,7 +37,6 @@ export interface ModalWizardStepProps {
      * @default true
      */
     countsAsProgress?: boolean;
-    children: ReactElement<any, any>;
 }
 declare const ModalWizardStep: FunctionComponent<PropsWithChildren<ModalWizardStepProps>>;
 export { ModalWizardStep };

package/dist/definitions/components/modal-wizard/ModalWizardStep.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ModalWizardStep.d.ts","sourceRoot":"","sources":["../../../../src/components/modal-wizard/ModalWizardStep.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAE,iBAAiB,EAAE,YAAY,EAAC,MAAM,OAAO,CAAC;AAEzE,KAAK,aAAa,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC,CAAC;AAE1E,MAAM,WAAW,oBAAoB;IACjC;;OAEG;IACH,KAAK,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,YAAY,CAAC,CAAC;IAErE;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,YAAY,CAAC,CAAC;IAE3E;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC;IAEjB;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,YAAY,GAAG,aAAa,CAAC,MAAM,GAAG,YAAY,CAAC,CAAC;IAEnF;;OAEG;IACH,YAAY,EAAE,CAAC,WAAW,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,KAAK;QAAC,OAAO,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAC,CAAC;IAE/F;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,QAAQ,EAAE,YAAY,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC;CACpC;AAED,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAA4B,CAAC;AAO7G,OAAO,EAAC,eAAe,EAAC,CAAC"}
+{"version":3,"file":"ModalWizardStep.d.ts","sourceRoot":"","sources":["../../../../src/components/modal-wizard/ModalWizardStep.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,iBAAiB,EAAE,iBAAiB,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAEtE,KAAK,aAAa,CAAC,CAAC,IAAI,CAAC,WAAW,EAAE,MAAM,EAAE,aAAa,EAAE,MAAM,KAAK,CAAC,CAAC;AAC1E,MAAM,MAAM,WAAW,CAAC,CAAC,IAAI,CAAC,SAAS,MAAM,CAAC,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAEpF,MAAM,WAAW,oBAAoB;IACjC;;OAEG;IACH,KAAK,CAAC,EAAE,SAAS,GAAG,aAAa,CAAC,SAAS,CAAC,CAAC;IAE7C;;OAEG;IACH,WAAW,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAE7C;;OAEG;IACH,OAAO,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAEzC;;OAEG;IACH,mBAAmB,CAAC,EAAE,MAAM,GAAG,aAAa,CAAC,MAAM,CAAC,CAAC;IAErD;;OAEG;IACH,YAAY,EAAE,CAAC,WAAW,EAAE,GAAG,EAAE,aAAa,EAAE,GAAG,KAAK;QAAC,OAAO,EAAE,OAAO,CAAC;QAAC,QAAQ,CAAC,EAAE,OAAO,CAAA;KAAC,CAAC;IAE/F;;;;OAIG;IACH,eAAe,CAAC,EAAE,OAAO,CAAC;IAE1B;;;;OAIG;IACH,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC9B;AAED,QAAA,MAAM,eAAe,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,oBAAoB,CAAC,CAAmC,CAAC;AAOpH,OAAO,EAAC,eAAe,EAAC,CAAC"}

package/dist/definitions/index.d.ts

@@ -10,7 +10,7 @@ export * from './components';
 export * from '@mantine/form';
 export { type NotificationProps } from '@mantine/notifications';
 export { Pagination } from '@mantine/core';
-export { Header, Table, type TableProps, type TableState, type InitialTableState, type HeaderProps, Modal, Button, type ButtonProps, Menu, type MenuItemProps, } from './components';
+export { Header, type HeaderProps, Table, type TableProps, type TableState, type InitialTableState, Button, type ButtonProps, Menu, type MenuItemProps, } from './components';
 export { useForm, createFormContext } from './form';
 export * from './theme';
 declare module '@mantine/core' {

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

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAC;AAElD,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,YAAY,EAAC,iBAAiB,EAAC,MAAM,yBAAyB,CAAC;AAC/D,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAC,UAAU,EAAC,MAAM,eAAe,CAAC;AAEzC,OAAO,EACH,MAAM,EACN,KAAK,EACL,KAAK,UAAU,EACf,KAAK,UAAU,EACf,KAAK,iBAAiB,EACtB,KAAK,WAAW,EAChB,KAAK,EACL,MAAM,EACN,KAAK,WAAW,EAChB,IAAI,EACJ,KAAK,aAAa,GACrB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAC,OAAO,EAAE,iBAAiB,EAAC,MAAM,QAAQ,CAAC;AAElD,cAAc,SAAS,CAAC;AAExB,OAAO,QAAQ,eAAe,CAAC;IAC3B,UAAiB,0BAA0B;QAEvC,MAAM,EAAE,MAAM,CAAC,MAAM,OAAO,YAAY,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC;KAChF;CACJ"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,KAAK,EAAC,MAAM,eAAe,CAAC;AAEpC,OAAO,EAAC,YAAY,EAAC,MAAM,sBAAsB,CAAC;AAElD,cAAc,wBAAwB,CAAC;AACvC,cAAc,mBAAmB,CAAC;AAClC,cAAc,eAAe,CAAC;AAC9B,YAAY,EAAC,iBAAiB,EAAC,MAAM,yBAAyB,CAAC;AAC/D,cAAc,gBAAgB,CAAC;AAC/B,cAAc,sBAAsB,CAAC;AACrC,cAAc,cAAc,CAAC;AAC7B,cAAc,eAAe,CAAC;AAC9B,OAAO,EAAC,KAAK,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AAC9D,OAAO,EAAC,UAAU,EAAC,MAAM,eAAe,CAAC;AAEzC,OAAO,EACH,MAAM,EACN,KAAK,WAAW,EAChB,KAAK,EACL,KAAK,UAAU,EACf,KAAK,UAAU,EACf,KAAK,iBAAiB,EACtB,MAAM,EACN,KAAK,WAAW,EAChB,IAAI,EACJ,KAAK,aAAa,GACrB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAC,OAAO,EAAE,iBAAiB,EAAC,MAAM,QAAQ,CAAC;AAElD,cAAc,SAAS,CAAC;AAExB,OAAO,QAAQ,eAAe,CAAC;IAC3B,UAAiB,0BAA0B;QAEvC,MAAM,EAAE,MAAM,CAAC,MAAM,OAAO,YAAY,GAAG,CAAC,MAAM,GAAG,EAAE,CAAC,EAAE,KAAK,CAAC,MAAM,EAAE,EAAE,CAAC,CAAC,CAAC;KAChF;CACJ"}

package/dist/definitions/theme/Theme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,oBAAoB,EAAoB,MAAM,eAAe,CAAC;AAI1F,eAAO,MAAM,WAAW,EAAE,oBA6LzB,CAAC"}
+{"version":3,"file":"Theme.d.ts","sourceRoot":"","sources":["../../../src/theme/Theme.tsx"],"names":[],"mappings":"AAEA,OAAO,EAAqB,oBAAoB,EAAoB,MAAM,eAAe,CAAC;AAI1F,eAAO,MAAM,WAAW,EAAE,oBA8LzB,CAAC"}

package/dist/esm/components/header/Header.js

@@ -2,63 +2,60 @@ import _object_spread from "@swc/helpers/src/_object_spread.mjs";
 import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
 import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { QuestionSize24Px } from "@coveord/plasma-react-icons";
-import { Anchor, Breadcrumbs, Divider, Group, Stack, Text, Title, Tooltip } from "@mantine/core";
-export var Header = function(_param) /*#__PURE__*/ {
-    var description = _param.description, actions = _param.actions, borderBottom = _param.borderBottom, docLink = _param.docLink, docLinkTooltipLabel = _param.docLinkTooltipLabel, children = _param.children, others = _object_without_properties(_param, [
+import { QuestionSize16Px } from "@coveord/plasma-react-icons";
+import { Anchor, Breadcrumbs, Divider, Flex, Group, Stack, Text, Title, Tooltip } from "@mantine/core";
+import { Children } from "react";
+export var Header = function(_param) {
+    var description = _param.description, borderBottom = _param.borderBottom, children = _param.children, _param_variant = _param.variant, variant = _param_variant === void 0 ? "page" : _param_variant, others = _object_without_properties(_param, [
         "description",
-        "actions",
         "borderBottom",
-        "docLink",
-        "docLinkTooltipLabel",
-        "children"
+        "children",
+        "variant"
     ]);
-    return _jsxs(_Fragment, {
+    var convertedChildren = Children.toArray(children);
+    var breadcrumbs = convertedChildren.find(function(child) {
+        return child.type === HeaderBreadcrumbs;
+    });
+    var actions = convertedChildren.find(function(child) {
+        return child.type === HeaderActions;
+    });
+    var docAnchor = convertedChildren.find(function(child) {
+        return child.type === HeaderDocAnchor;
+    });
+    var otherChildren = convertedChildren.filter(function(child) {
+        return child.type !== HeaderBreadcrumbs && child.type !== HeaderActions && child.type !== HeaderDocAnchor;
+    });
+    return /*#__PURE__*/ _jsxs(_Fragment, {
         children: [
             /*#__PURE__*/ _jsxs(Group, _object_spread_props(_object_spread({
                 position: "apart",
-                py: "md",
-                px: "xl"
+                p: variant === "page" ? "xl" : undefined,
+                pb: variant === "page" ? "lg" : undefined
             }, others), {
                 children: [
                     /*#__PURE__*/ _jsxs(Stack, {
-                        spacing: "xs",
+                        spacing: 0,
                         children: [
-                            /*#__PURE__*/ _jsx(Title, {
-                                order: 4,
-                                children: /*#__PURE__*/ _jsxs(Group, {
-                                    spacing: 0,
-                                    children: [
-                                        /*#__PURE__*/ _jsx(Breadcrumbs, {
-                                            children: children
-                                        }),
-                                        docLink ? /*#__PURE__*/ _jsx(Tooltip, {
-                                            label: docLinkTooltipLabel,
-                                            disabled: !docLinkTooltipLabel,
-                                            position: "bottom",
-                                            children: /*#__PURE__*/ _jsx(Anchor, {
-                                                inline: true,
-                                                href: docLink,
-                                                target: "_blank",
-                                                ml: "xs",
-                                                children: /*#__PURE__*/ _jsx(QuestionSize24Px, {
-                                                    height: 24
-                                                })
-                                            })
-                                        }) : null
-                                    ]
-                                })
+                            breadcrumbs,
+                            /*#__PURE__*/ _jsxs(Flex, {
+                                align: "center",
+                                children: [
+                                    /*#__PURE__*/ _jsx(Title, {
+                                        order: variant === "page" ? 1 : 3,
+                                        color: variant === "page" ? "gray.5" : undefined,
+                                        children: otherChildren
+                                    }),
+                                    docAnchor
+                                ]
                             }),
                             /*#__PURE__*/ _jsx(Text, {
-                                size: "sm",
+                                size: variant === "page" ? "md" : "sm",
+                                color: "gray.6",
                                 children: description
                             })
                         ]
                     }),
-                    /*#__PURE__*/ _jsx(Group, {
-                        spacing: "xs",
-                        children: actions
-                    })
+                    actions
                 ]
             })),
             borderBottom ? /*#__PURE__*/ _jsx(Divider, {
@@ -67,5 +64,49 @@ export var Header = function(_param) /*#__PURE__*/ {
         ]
     });
 };
+var HeaderBreadcrumbs = function(param) {
+    var children = param.children;
+    return /*#__PURE__*/ _jsx(Breadcrumbs, {
+        styles: function(theme) {
+            return {
+                breadcrumb: {
+                    fontSize: theme.fontSizes.sm,
+                    fontWeight: 300
+                },
+                separator: {
+                    color: theme.colors.gray[5]
+                }
+            };
+        },
+        children: children
+    });
+};
+var HeaderActions = function(param) {
+    var children = param.children;
+    return /*#__PURE__*/ _jsx(Group, {
+        spacing: "sm",
+        children: children
+    });
+};
+var HeaderDocAnchor = function(param) {
+    var docLink = param.href, docLinkTooltipLabel = param.label;
+    return /*#__PURE__*/ _jsx(Tooltip, {
+        label: docLinkTooltipLabel,
+        disabled: !docLinkTooltipLabel,
+        position: "right",
+        children: /*#__PURE__*/ _jsx(Anchor, {
+            inline: true,
+            href: docLink,
+            target: "_blank",
+            ml: "xs",
+            children: /*#__PURE__*/ _jsx(QuestionSize16Px, {
+                height: 16
+            })
+        })
+    });
+};
+Header.Breadcrumbs = HeaderBreadcrumbs;
+Header.Actions = HeaderActions;
+Header.DocAnchor = HeaderDocAnchor;
 
 //# sourceMappingURL=Header.js.map

package/dist/esm/components/header/Header.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize24Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n    /**\n     * The description text displayed inside the header underneath the title\n     */\n    description?: ReactNode;\n    /**\n     * Action buttons that can be displayed on the right of the header\n     */\n    actions?: ReactNode;\n    /**\n     * Whether the header should have a border on the bottom\n     */\n    borderBottom?: boolean;\n    /**\n     * A href pointing to documentation related to the current panel.\n     * When provided, an info icon is rendered next to the title as link to this documentation\n     */\n    docLink?: string;\n    /**\n     * The tooltip text shown when hovering over the doc link icon\n     */\n    docLinkTooltipLabel?: string;\n    /**\n     * The title of the header.\n     * If more than one children are provided, each of them act as parts of a breadcrumb\n     */\n    children: ReactNode;\n}\n\nexport const Header: FunctionComponent<HeaderProps> = ({\n    description,\n    actions,\n    borderBottom,\n    docLink,\n    docLinkTooltipLabel,\n    children,\n    ...others\n}) => (\n    <>\n        <Group position=\"apart\" py=\"md\" px=\"xl\" {...others}>\n            <Stack spacing=\"xs\">\n                <Title order={4}>\n                    <Group spacing={0}>\n                        <Breadcrumbs>{children}</Breadcrumbs>\n                        {docLink ? (\n                            <Tooltip label={docLinkTooltipLabel} disabled={!docLinkTooltipLabel} position=\"bottom\">\n                                <Anchor inline href={docLink} target=\"_blank\" ml=\"xs\">\n                                    <QuestionSize24Px height={24} />\n                                </Anchor>\n                            </Tooltip>\n                        ) : null}\n                    </Group>\n                </Title>\n                <Text size=\"sm\">{description}</Text>\n            </Stack>\n            <Group spacing=\"xs\">{actions}</Group>\n        </Group>\n        {borderBottom ? <Divider size=\"xs\" /> : null}\n    </>\n);\n"],"names":["QuestionSize24Px","Anchor","Breadcrumbs","Divider","Group","Stack","Text","Title","Tooltip","Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","position","py","px","spacing","order","label","disabled","inline","href","target","ml","height","size"],"mappings":";;;;AAAA,SAAQA,gBAAgB,QAAO,8BAA8B;AAC7D,SAAQC,MAAM,EAAEC,WAAW,EAAgBC,OAAO,EAAEC,KAAK,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,QAAO,gBAAgB;AAgC7G,OAAO,IAAMC,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,MAACX;gBAAMa,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASH;;kCACxC,MAACX;wBAAMe,SAAQ;;0CACX,KAACb;gCAAMc,OAAO;0CACV,cAAA,MAACjB;oCAAMgB,SAAS;;sDACZ,KAAClB;sDAAaa;;wCACbF,wBACG,KAACL;4CAAQc,OAAOR;4CAAqBS,UAAU,CAACT;4CAAqBG,UAAS;sDAC1E,cAAA,KAAChB;gDAAOuB,MAAM;gDAACC,MAAMZ;gDAASa,QAAO;gDAASC,IAAG;0DAC7C,cAAA,KAAC3B;oDAAiB4B,QAAQ;;;6CAGlC,IAAI;;;;0CAGhB,KAACtB;gCAAKuB,MAAK;0CAAMnB;;;;kCAErB,KAACN;wBAAMgB,SAAQ;kCAAMT;;;;YAExBC,6BAAe,KAACT;gBAAQ0B,MAAK;iBAAU,IAAI;;;AAC9C,EACJ"}
+{"version":3,"sources":["../../../../src/components/header/Header.tsx"],"sourcesContent":["import {QuestionSize16Px} from '@coveord/plasma-react-icons';\nimport {Anchor, Breadcrumbs, DefaultProps, Divider, Flex, Group, Stack, Text, Title, Tooltip} from '@mantine/core';\nimport {Children, FunctionComponent, ReactElement, ReactNode} from 'react';\n\nexport interface HeaderProps extends DefaultProps {\n    /**\n     * The description text displayed inside the header underneath the title\n     */\n    description?: ReactNode;\n    /**\n     * Whether the header should have a border on the bottom\n     */\n    borderBottom?: boolean;\n    /**\n     * Use the modal variant when displaying the header inside a modal\n     *\n     * @default 'page'\n     */\n    variant?: 'page' | 'modal';\n    /**\n     * The title of the header.\n     */\n    children: ReactNode;\n}\n\ninterface HeaderType {\n    (props: HeaderProps): ReactElement;\n    Breadcrumbs: typeof HeaderBreadcrumbs;\n    Actions: typeof HeaderActions;\n    DocAnchor: typeof HeaderDocAnchor;\n}\n\nexport const Header: HeaderType = ({description, borderBottom, children, variant = 'page', ...others}) => {\n    const convertedChildren = Children.toArray(children) as ReactElement[];\n    const breadcrumbs = convertedChildren.find((child) => child.type === HeaderBreadcrumbs);\n    const actions = convertedChildren.find((child) => child.type === HeaderActions);\n    const docAnchor = convertedChildren.find((child) => child.type === HeaderDocAnchor);\n    const otherChildren = convertedChildren.filter(\n        (child) => child.type !== HeaderBreadcrumbs && child.type !== HeaderActions && child.type !== HeaderDocAnchor\n    );\n    return (\n        <>\n            <Group\n                position=\"apart\"\n                p={variant === 'page' ? 'xl' : undefined}\n                pb={variant === 'page' ? 'lg' : undefined}\n                {...others}\n            >\n                <Stack spacing={0}>\n                    {breadcrumbs}\n                    <Flex align=\"center\">\n                        <Title order={variant === 'page' ? 1 : 3} color={variant === 'page' ? 'gray.5' : undefined}>\n                            {otherChildren}\n                        </Title>\n                        {docAnchor}\n                    </Flex>\n                    <Text size={variant === 'page' ? 'md' : 'sm'} color=\"gray.6\">\n                        {description}\n                    </Text>\n                </Stack>\n                {actions}\n            </Group>\n            {borderBottom ? <Divider size=\"xs\" /> : null}\n        </>\n    );\n};\n\nconst HeaderBreadcrumbs: FunctionComponent<{children: ReactNode}> = ({children}) => (\n    <Breadcrumbs\n        styles={(theme) => ({\n            breadcrumb: {fontSize: theme.fontSizes.sm, fontWeight: 300},\n            separator: {color: theme.colors.gray[5]},\n        })}\n    >\n        {children}\n    </Breadcrumbs>\n);\n\nconst HeaderActions: FunctionComponent<{children: ReactNode}> = ({children}) => <Group spacing=\"sm\">{children}</Group>;\n\nexport interface HeaderDocAnchorProps {\n    /**\n     * A href pointing to documentation related to the current panel.\n     * When provided, an info icon is rendered next to the title as link to this documentation\n     */\n    href: string;\n    /**\n     * The tooltip text shown when hovering over the doc link icon\n     */\n    label?: string;\n}\n\nconst HeaderDocAnchor: FunctionComponent<HeaderDocAnchorProps> = ({href: docLink, label: docLinkTooltipLabel}) => (\n    <Tooltip label={docLinkTooltipLabel} disabled={!docLinkTooltipLabel} position=\"right\">\n        <Anchor inline href={docLink} target=\"_blank\" ml=\"xs\">\n            <QuestionSize16Px height={16} />\n        </Anchor>\n    </Tooltip>\n);\n\nHeader.Breadcrumbs = HeaderBreadcrumbs;\nHeader.Actions = HeaderActions;\nHeader.DocAnchor = HeaderDocAnchor;\n"],"names":["QuestionSize16Px","Anchor","Breadcrumbs","Divider","Flex","Group","Stack","Text","Title","Tooltip","Children","Header","description","borderBottom","children","variant","others","convertedChildren","toArray","breadcrumbs","find","child","type","HeaderBreadcrumbs","actions","HeaderActions","docAnchor","HeaderDocAnchor","otherChildren","filter","position","p","undefined","pb","spacing","align","order","color","size","styles","theme","breadcrumb","fontSize","fontSizes","sm","fontWeight","separator","colors","gray","href","docLink","label","docLinkTooltipLabel","disabled","inline","target","ml","height","Actions","DocAnchor"],"mappings":";;;;AAAA,SAAQA,gBAAgB,QAAO,8BAA8B;AAC7D,SAAQC,MAAM,EAAEC,WAAW,EAAgBC,OAAO,EAAEC,IAAI,EAAEC,KAAK,EAAEC,KAAK,EAAEC,IAAI,EAAEC,KAAK,EAAEC,OAAO,QAAO,gBAAgB;AACnH,SAAQC,QAAQ,QAAmD,QAAQ;AA8B3E,OAAO,IAAMC,SAAqB,iBAAwE;QAAtEC,qBAAAA,aAAaC,sBAAAA,cAAcC,kBAAAA,kCAAUC,SAAAA,sCAAU,yBAAWC;QAA1DJ;QAAaC;QAAcC;QAAUC;;IACrE,IAAME,oBAAoBP,SAASQ,OAAO,CAACJ;IAC3C,IAAMK,cAAcF,kBAAkBG,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKC;;IACrE,IAAMC,UAAUP,kBAAkBG,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKG;;IACjE,IAAMC,YAAYT,kBAAkBG,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKK;;IACnE,IAAMC,gBAAgBX,kBAAkBY,MAAM,CAC1C,SAACR;eAAUA,MAAMC,IAAI,KAAKC,qBAAqBF,MAAMC,IAAI,KAAKG,iBAAiBJ,MAAMC,IAAI,KAAKK;;IAElG,qBACI;;0BACI,MAACtB;gBACGyB,UAAS;gBACTC,GAAGhB,YAAY,SAAS,OAAOiB,SAAS;gBACxCC,IAAIlB,YAAY,SAAS,OAAOiB,SAAS;eACrChB;;kCAEJ,MAACV;wBAAM4B,SAAS;;4BACXf;0CACD,MAACf;gCAAK+B,OAAM;;kDACR,KAAC3B;wCAAM4B,OAAOrB,YAAY,SAAS,IAAI,CAAC;wCAAEsB,OAAOtB,YAAY,SAAS,WAAWiB,SAAS;kDACrFJ;;oCAEJF;;;0CAEL,KAACnB;gCAAK+B,MAAMvB,YAAY,SAAS,OAAO,IAAI;gCAAEsB,OAAM;0CAC/CzB;;;;oBAGRY;;;YAEJX,6BAAe,KAACV;gBAAQmC,MAAK;iBAAU,IAAI;;;AAGxD,EAAE;AAEF,IAAMf,oBAA8D;QAAET,iBAAAA;yBAClE,KAACZ;QACGqC,QAAQ,SAACC;mBAAW;gBAChBC,YAAY;oBAACC,UAAUF,MAAMG,SAAS,CAACC,EAAE;oBAAEC,YAAY;gBAAG;gBAC1DC,WAAW;oBAACT,OAAOG,MAAMO,MAAM,CAACC,IAAI,CAAC,EAAE;gBAAA;YAC3C;;kBAEClC;;;AAIT,IAAMW,gBAA0D;QAAEX,iBAAAA;yBAAc,KAACT;QAAM6B,SAAQ;kBAAMpB;;;AAcrG,IAAMa,kBAA2D;QAAEsB,AAAMC,gBAAND,MAAeE,AAAOC,4BAAPD;yBAC9E,KAAC1C;QAAQ0C,OAAOC;QAAqBC,UAAU,CAACD;QAAqBtB,UAAS;kBAC1E,cAAA,KAAC7B;YAAOqD,MAAM;YAACL,MAAMC;YAASK,QAAO;YAASC,IAAG;sBAC7C,cAAA,KAACxD;gBAAiByD,QAAQ;;;;;AAKtC9C,OAAOT,WAAW,GAAGqB;AACrBZ,OAAO+C,OAAO,GAAGjC;AACjBd,OAAOgD,SAAS,GAAGhC"}

package/dist/esm/components/header/__tests__/__snapshots__/Header.spec.tsx.snap

@@ -0,0 +1,55 @@
+// Vitest Snapshot v1
+
+exports[`Header > renders the specified breadcrumbs above the title 1`] = `
+<div>
+  <div
+    class="mantine-Group-root mantine-1g2mfqe"
+  >
+    <div
+      class="mantine-Stack-root mantine-1fod3h5"
+    >
+      <div
+        class="mantine-Breadcrumbs-root mantine-16ttirm"
+      >
+        <a
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1cehd6q"
+        >
+          One
+        </a>
+        <div
+          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-1mpiak2"
+        >
+          /
+        </div>
+        <a
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1cehd6q"
+        >
+          Two
+        </a>
+        <div
+          class="mantine-Text-root mantine-Breadcrumbs-separator mantine-1mpiak2"
+        >
+          /
+        </div>
+        <a
+          class="mantine-Text-root mantine-Anchor-root mantine-Breadcrumbs-breadcrumb mantine-1cehd6q"
+        >
+          Three
+        </a>
+      </div>
+      <div
+        class="mantine-xg7kom"
+      >
+        <h1
+          class="mantine-Text-root mantine-Title-root mantine-jqzr1h"
+        >
+          Title
+        </h1>
+      </div>
+      <div
+        class="mantine-Text-root mantine-1qppuo4"
+      />
+    </div>
+  </div>
+</div>
+`;

package/dist/esm/components/index.js

@@ -7,7 +7,6 @@ export * from "./header";
 export * from "./inline-confirm";
 export * from "./table";
 export * from "./prompt";
-export * from "./modal";
 export * from "./modal-wizard";
 export * from "./button";
 export * from "./menu";

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

@@ -1 +1 @@
-{"version":3,"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from './blank-slate';\nexport * from './code-editor';\nexport * from './collection';\nexport * from './date-range-picker';\nexport * from './sticky-footer';\nexport * from './header';\nexport * from './inline-confirm';\nexport * from './table';\nexport * from './prompt';\nexport * from './modal';\nexport * from './modal-wizard';\nexport * from './button';\nexport * from './menu';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,eAAe;AAC7B,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,WAAW;AACzB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,UAAU;AACxB,cAAc,iBAAiB;AAC/B,cAAc,WAAW;AACzB,cAAc,SAAS"}
+{"version":3,"sources":["../../../src/components/index.ts"],"sourcesContent":["export * from './blank-slate';\nexport * from './code-editor';\nexport * from './collection';\nexport * from './date-range-picker';\nexport * from './sticky-footer';\nexport * from './header';\nexport * from './inline-confirm';\nexport * from './table';\nexport * from './prompt';\nexport * from './modal-wizard';\nexport * from './button';\nexport * from './menu';\n"],"names":[],"mappings":"AAAA,cAAc,gBAAgB;AAC9B,cAAc,gBAAgB;AAC9B,cAAc,eAAe;AAC7B,cAAc,sBAAsB;AACpC,cAAc,kBAAkB;AAChC,cAAc,WAAW;AACzB,cAAc,mBAAmB;AACjC,cAAc,UAAU;AACxB,cAAc,WAAW;AACzB,cAAc,iBAAiB;AAC/B,cAAc,WAAW;AACzB,cAAc,SAAS"}

package/dist/esm/components/modal-wizard/ModalWizard.js

@@ -3,8 +3,8 @@ import _object_spread_props from "@swc/helpers/src/_object_spread_props.mjs";
 import _object_without_properties from "@swc/helpers/src/_object_without_properties.mjs";
 import _sliced_to_array from "@swc/helpers/src/_sliced_to_array.mjs";
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Box, createStyles, Modal, Progress } from "@mantine/core";
-import { Children, useMemo, useState } from "react";
+import { Box, CloseButton, createStyles, Modal, Progress } from "@mantine/core";
+import { Children, useEffect, useMemo, useState } from "react";
 import { Button } from "../button";
 import { Header } from "../header";
 import { StickyFooter } from "../sticky-footer";
@@ -65,13 +65,26 @@ export var ModalWizard = function(_param) {
     var isValid = ((_currentStep_props_validateStep1 = currentStep === null || currentStep === void 0 ? void 0 : (_currentStep_props = currentStep.props) === null || _currentStep_props === void 0 ? void 0 : (_currentStep_props_validateStep = _currentStep_props.validateStep) === null || _currentStep_props_validateStep === void 0 ? void 0 : _currentStep_props_validateStep.call(_currentStep_props, currentStepIndex, numberOfSteps)) !== null && _currentStep_props_validateStep1 !== void 0 ? _currentStep_props_validateStep1 : {
         isValid: true
     }).isValid;
-    var isModalDirty = isDirty && isDirty();
-    var closeModalWizard = function() {
-        if (isModalDirty && handleDirtyState) {
-            handleDirtyState() && (onClose === null || onClose === void 0 ? void 0 : onClose());
-        } else {
-            onClose === null || onClose === void 0 ? void 0 : onClose();
+    useEffect(function() {
+        if (opened) {
+            setCurrentStepIndex(0);
         }
+    }, [
+        opened
+    ]);
+    var handleClose = function(confirmDirty) {
+        if (confirmDirty) {
+            var _isDirty;
+            var isModalDirty = (_isDirty = isDirty === null || isDirty === void 0 ? void 0 : isDirty()) !== null && _isDirty !== void 0 ? _isDirty : false;
+            if (isModalDirty) {
+                var _handleDirtyState;
+                var discardChanges = (_handleDirtyState = handleDirtyState === null || handleDirtyState === void 0 ? void 0 : handleDirtyState()) !== null && _handleDirtyState !== void 0 ? _handleDirtyState : true;
+                if (!discardChanges) {
+                    return;
+                }
+            }
+        }
+        onClose === null || onClose === void 0 ? void 0 : onClose();
     };
     var getProgress = function(currStepIndex) {
         var validSteps = modalSteps.filter(function(step, index) {
@@ -79,6 +92,9 @@ export var ModalWizard = function(_param) {
         }).length;
         return validSteps / numberOfStepsCountAsProgress * 100;
     };
+    var resolveStepDependentProp = function(prop) {
+        return typeof currentStep.props[prop] === "function" ? currentStep.props[prop](currentStepIndex + 1, numberOfSteps) : currentStep.props[prop];
+    };
     var getProgressMemo = useMemo(function() {
         return getProgress(currentStepIndex);
     }, [
@@ -91,33 +107,49 @@ export var ModalWizard = function(_param) {
             body: cx(body, classNames === null || classNames === void 0 ? void 0 : classNames.body)
         },
         centered: true,
-        title: /*#__PURE__*/ _jsx(Header, {
-            docLink: currentStep.props.docLink,
-            docLinkTooltipLabel: currentStep.props.docLinkTooltipLabel,
-            description: typeof currentStep.props.description === "function" ? currentStep.props.description(currentStepIndex + 1, numberOfSteps) : currentStep.props.description,
-            py: 0,
-            px: 0,
-            children: typeof currentStep.props.title === "function" ? currentStep.props.title(currentStepIndex + 1, numberOfSteps) : currentStep.props.title
-        }),
-        onClose: closeModalWizard
+        onClose: function() {
+            return handleClose(true);
+        },
+        withCloseButton: false,
+        padding: 0
     }, modalProps), {
         children: [
+            /*#__PURE__*/ _jsxs(Header, {
+                p: "lg",
+                pr: "md",
+                variant: "modal",
+                description: resolveStepDependentProp("description"),
+                children: [
+                    resolveStepDependentProp("title"),
+                    resolveStepDependentProp("docLink") ? /*#__PURE__*/ _jsx(Header.DocAnchor, {
+                        href: resolveStepDependentProp("docLink"),
+                        label: resolveStepDependentProp("docLinkTooltipLabel")
+                    }) : null,
+                    /*#__PURE__*/ _jsx(Header.Actions, {
+                        children: /*#__PURE__*/ _jsx(CloseButton, {
+                            "aria-label": modalProps.closeButtonLabel,
+                            onClick: function() {
+                                return handleClose(true);
+                            }
+                        })
+                    })
+                ]
+            }),
             currentStep.props.showProgressBar && /*#__PURE__*/ _jsx(Progress, {
-                color: "teal",
-                size: "lg",
+                color: "navy.5",
+                size: "sm",
+                radius: 0,
                 value: getProgressMemo
             }),
-            currentStep,
             /*#__PURE__*/ _jsx(Box, {
-                sx: function(theme) {
-                    return {
-                        marginTop: "auto"
-                    };
+                p: "lg",
+                children: currentStep
+            }),
+            /*#__PURE__*/ _jsx(Box, {
+                sx: {
+                    marginTop: "auto"
                 },
                 children: /*#__PURE__*/ _jsxs(StickyFooter, {
-                    px: 0,
-                    pt: "sm",
-                    pb: 0,
                     borderTop: true,
                     children: [
                         /*#__PURE__*/ _jsx(Button, {
@@ -125,7 +157,7 @@ export var ModalWizard = function(_param) {
                             variant: "outline",
                             onClick: function() {
                                 if (isFirstStep) {
-                                    closeModalWizard();
+                                    handleClose(true);
                                 } else {
                                     onPrevious === null || onPrevious === void 0 ? void 0 : onPrevious();
                                     setCurrentStepIndex(currentStepIndex - 1);
@@ -137,7 +169,8 @@ export var ModalWizard = function(_param) {
                             disabled: !isValid,
                             onClick: function() {
                                 if (isLastStep) {
-                                    onFinish ? onFinish() : onClose();
+                                    var _onFinish;
+                                    (_onFinish = onFinish === null || onFinish === void 0 ? void 0 : onFinish()) !== null && _onFinish !== void 0 ? _onFinish : handleClose(false);
                                 } else {
                                     onNext === null || onNext === void 0 ? void 0 : onNext();
                                     setCurrentStepIndex(currentStepIndex + 1);