@coveord/plasma-mantine 49.6.6 → 50.0.0

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

@@ -14,61 +14,58 @@ var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_propert
 var _jsxRuntime = require("react/jsx-runtime");
 var _plasmaReactIcons = require("@coveord/plasma-react-icons");
 var _core = require("@mantine/core");
-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 = _objectWithoutProperties(_param, [
+var _react = require("react");
+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 = _objectWithoutProperties(_param, [
         "description",
-        "actions",
         "borderBottom",
-        "docLink",
-        "docLinkTooltipLabel",
-        "children"
+        "children",
+        "variant"
     ]);
-    return (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
+    var convertedChildren = _react.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__*/ (0, _jsxRuntime.jsxs)(_jsxRuntime.Fragment, {
         children: [
             /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_core.Group, _objectSpreadProps(_objectSpread({
                 position: "apart",
-                py: "md",
-                px: "xl"
+                p: variant === "page" ? "xl" : undefined,
+                pb: variant === "page" ? "lg" : undefined
             }, others), {
                 children: [
                     /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_core.Stack, {
-                        spacing: "xs",
+                        spacing: 0,
                         children: [
-                            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Title, {
-                                order: 4,
-                                children: /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_core.Group, {
-                                    spacing: 0,
-                                    children: [
-                                        /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Breadcrumbs, {
-                                            children: children
-                                        }),
-                                        docLink ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Tooltip, {
-                                            label: docLinkTooltipLabel,
-                                            disabled: !docLinkTooltipLabel,
-                                            position: "bottom",
-                                            children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Anchor, {
-                                                inline: true,
-                                                href: docLink,
-                                                target: "_blank",
-                                                ml: "xs",
-                                                children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_plasmaReactIcons.QuestionSize24Px, {
-                                                    height: 24
-                                                })
-                                            })
-                                        }) : null
-                                    ]
-                                })
+                            breadcrumbs,
+                            /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_core.Flex, {
+                                align: "center",
+                                children: [
+                                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Title, {
+                                        order: variant === "page" ? 1 : 3,
+                                        color: variant === "page" ? "gray.5" : undefined,
+                                        children: otherChildren
+                                    }),
+                                    docAnchor
+                                ]
                             }),
                             /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Text, {
-                                size: "sm",
+                                size: variant === "page" ? "md" : "sm",
+                                color: "gray.6",
                                 children: description
                             })
                         ]
                     }),
-                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Group, {
-                        spacing: "xs",
-                        children: actions
-                    })
+                    actions
                 ]
             })),
             borderBottom ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Divider, {
@@ -77,5 +74,49 @@ var Header = function(_param) /*#__PURE__*/ {
         ]
     });
 };
+var HeaderBreadcrumbs = function(param) {
+    var children = param.children;
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.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__*/ (0, _jsxRuntime.jsx)(_core.Group, {
+        spacing: "sm",
+        children: children
+    });
+};
+var HeaderDocAnchor = function(param) {
+    var docLink = param.href, docLinkTooltipLabel = param.label;
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Tooltip, {
+        label: docLinkTooltipLabel,
+        disabled: !docLinkTooltipLabel,
+        position: "right",
+        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Anchor, {
+            inline: true,
+            href: docLink,
+            target: "_blank",
+            ml: "xs",
+            children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_plasmaReactIcons.QuestionSize16Px, {
+                height: 16
+            })
+        })
+    });
+};
+Header.Breadcrumbs = HeaderBreadcrumbs;
+Header.Actions = HeaderActions;
+Header.DocAnchor = HeaderDocAnchor;
 
 //# sourceMappingURL=Header.js.map

package/dist/cjs/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":["Header","description","actions","borderBottom","docLink","docLinkTooltipLabel","children","others","Group","position","py","px","Stack","spacing","Title","order","Breadcrumbs","Tooltip","label","disabled","Anchor","inline","href","target","ml","QuestionSize24Px","height","Text","size","Divider"],"mappings":";;;;+BAiCaA;;;eAAAA;;;;;;;gCAjCkB;oBAC8D;AAgCtF,IAAMA,SAAyC,+BASlD;QARAC,qBAAAA,aACAC,iBAAAA,SACAC,sBAAAA,cACAC,iBAAAA,SACAC,6BAAAA,qBACAC,kBAAAA,UACGC;QANHN;QACAC;QACAC;QACAC;QACAC;QACAC;;WAGA;;0BACI,sBAACE,WAAK;gBAACC,UAAS;gBAAQC,IAAG;gBAAKC,IAAG;eAASJ;;kCACxC,sBAACK,WAAK;wBAACC,SAAQ;;0CACX,qBAACC,WAAK;gCAACC,OAAO;0CACV,cAAA,sBAACP,WAAK;oCAACK,SAAS;;sDACZ,qBAACG,iBAAW;sDAAEV;;wCACbF,wBACG,qBAACa,aAAO;4CAACC,OAAOb;4CAAqBc,UAAU,CAACd;4CAAqBI,UAAS;sDAC1E,cAAA,qBAACW,YAAM;gDAACC,MAAM;gDAACC,MAAMlB;gDAASmB,QAAO;gDAASC,IAAG;0DAC7C,cAAA,qBAACC,kCAAgB;oDAACC,QAAQ;;;6CAGlC,IAAI;;;;0CAGhB,qBAACC,UAAI;gCAACC,MAAK;0CAAM3B;;;;kCAErB,qBAACO,WAAK;wBAACK,SAAQ;kCAAMX;;;;YAExBC,6BAAe,qBAAC0B,aAAO;gBAACD,MAAK;iBAAU,IAAI;;;AAC9C"}
+{"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":["Header","description","borderBottom","children","variant","others","convertedChildren","Children","toArray","breadcrumbs","find","child","type","HeaderBreadcrumbs","actions","HeaderActions","docAnchor","HeaderDocAnchor","otherChildren","filter","Group","position","p","undefined","pb","Stack","spacing","Flex","align","Title","order","color","Text","size","Divider","Breadcrumbs","styles","theme","breadcrumb","fontSize","fontSizes","sm","fontWeight","separator","colors","gray","href","docLink","label","docLinkTooltipLabel","Tooltip","disabled","Anchor","inline","target","ml","QuestionSize16Px","height","Actions","DocAnchor"],"mappings":";;;;+BAgCaA;;;eAAAA;;;;;;;gCAhCkB;oBACoE;qBAChC;AA8B5D,IAAMA,SAAqB,iBAAwE;QAAtEC,qBAAAA,aAAaC,sBAAAA,cAAcC,kBAAAA,kCAAUC,SAAAA,sCAAU,yBAAWC;QAA1DJ;QAAaC;QAAcC;QAAUC;;IACrE,IAAME,oBAAoBC,eAAQ,CAACC,OAAO,CAACL;IAC3C,IAAMM,cAAcH,kBAAkBI,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKC;;IACrE,IAAMC,UAAUR,kBAAkBI,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKG;;IACjE,IAAMC,YAAYV,kBAAkBI,IAAI,CAAC,SAACC;eAAUA,MAAMC,IAAI,KAAKK;;IACnE,IAAMC,gBAAgBZ,kBAAkBa,MAAM,CAC1C,SAACR;eAAUA,MAAMC,IAAI,KAAKC,qBAAqBF,MAAMC,IAAI,KAAKG,iBAAiBJ,MAAMC,IAAI,KAAKK;;IAElG,qBACI;;0BACI,sBAACG,WAAK;gBACFC,UAAS;gBACTC,GAAGlB,YAAY,SAAS,OAAOmB,SAAS;gBACxCC,IAAIpB,YAAY,SAAS,OAAOmB,SAAS;eACrClB;;kCAEJ,sBAACoB,WAAK;wBAACC,SAAS;;4BACXjB;0CACD,sBAACkB,UAAI;gCAACC,OAAM;;kDACR,qBAACC,WAAK;wCAACC,OAAO1B,YAAY,SAAS,IAAI,CAAC;wCAAE2B,OAAO3B,YAAY,SAAS,WAAWmB,SAAS;kDACrFL;;oCAEJF;;;0CAEL,qBAACgB,UAAI;gCAACC,MAAM7B,YAAY,SAAS,OAAO,IAAI;gCAAE2B,OAAM;0CAC/C9B;;;;oBAGRa;;;YAEJZ,6BAAe,qBAACgC,aAAO;gBAACD,MAAK;iBAAU,IAAI;;;AAGxD;AAEA,IAAMpB,oBAA8D;QAAEV,iBAAAA;yBAClE,qBAACgC,iBAAW;QACRC,QAAQ,SAACC;mBAAW;gBAChBC,YAAY;oBAACC,UAAUF,MAAMG,SAAS,CAACC,EAAE;oBAAEC,YAAY;gBAAG;gBAC1DC,WAAW;oBAACZ,OAAOM,MAAMO,MAAM,CAACC,IAAI,CAAC,EAAE;gBAAA;YAC3C;;kBAEC1C;;;AAIT,IAAMY,gBAA0D;QAAEZ,iBAAAA;yBAAc,qBAACiB,WAAK;QAACM,SAAQ;kBAAMvB;;;AAcrG,IAAMc,kBAA2D;QAAE6B,AAAMC,gBAAND,MAAeE,AAAOC,4BAAPD;yBAC9E,qBAACE,aAAO;QAACF,OAAOC;QAAqBE,UAAU,CAACF;QAAqB5B,UAAS;kBAC1E,cAAA,qBAAC+B,YAAM;YAACC,MAAM;YAACP,MAAMC;YAASO,QAAO;YAASC,IAAG;sBAC7C,cAAA,qBAACC,kCAAgB;gBAACC,QAAQ;;;;;AAKtCzD,OAAOmC,WAAW,GAAGtB;AACrBb,OAAO0D,OAAO,GAAG3C;AACjBf,OAAO2D,SAAS,GAAG1C"}

package/dist/cjs/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/cjs/components/index.js

@@ -12,7 +12,6 @@ _exportStar(require("./header"), exports);
 _exportStar(require("./inline-confirm"), exports);
 _exportStar(require("./table"), exports);
 _exportStar(require("./prompt"), exports);
-_exportStar(require("./modal"), exports);
 _exportStar(require("./modal-wizard"), exports);
 _exportStar(require("./button"), exports);
 _exportStar(require("./menu"), exports);

package/dist/cjs/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":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA"}
+{"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":";;;;;oBAAc;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA;oBACA"}

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

@@ -75,13 +75,26 @@ 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();
+    (0, _react.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) {
@@ -89,6 +102,9 @@ 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 = (0, _react.useMemo)(function() {
         return getProgress(currentStepIndex);
     }, [
@@ -101,33 +117,49 @@ var ModalWizard = function(_param) {
             body: cx(body, classNames === null || classNames === void 0 ? void 0 : classNames.body)
         },
         centered: true,
-        title: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_header.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__*/ (0, _jsxRuntime.jsxs)(_header.Header, {
+                p: "lg",
+                pr: "md",
+                variant: "modal",
+                description: resolveStepDependentProp("description"),
+                children: [
+                    resolveStepDependentProp("title"),
+                    resolveStepDependentProp("docLink") ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_header.Header.DocAnchor, {
+                        href: resolveStepDependentProp("docLink"),
+                        label: resolveStepDependentProp("docLinkTooltipLabel")
+                    }) : null,
+                    /*#__PURE__*/ (0, _jsxRuntime.jsx)(_header.Header.Actions, {
+                        children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.CloseButton, {
+                            "aria-label": modalProps.closeButtonLabel,
+                            onClick: function() {
+                                return handleClose(true);
+                            }
+                        })
+                    })
+                ]
+            }),
             currentStep.props.showProgressBar && /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Progress, {
-                color: "teal",
-                size: "lg",
+                color: "navy.5",
+                size: "sm",
+                radius: 0,
                 value: getProgressMemo
             }),
-            currentStep,
             /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Box, {
-                sx: function(theme) {
-                    return {
-                        marginTop: "auto"
-                    };
+                p: "lg",
+                children: currentStep
+            }),
+            /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Box, {
+                sx: {
+                    marginTop: "auto"
                 },
                 children: /*#__PURE__*/ (0, _jsxRuntime.jsxs)(_stickyFooter.StickyFooter, {
-                    px: 0,
-                    pt: "sm",
-                    pb: 0,
                     borderTop: true,
                     children: [
                         /*#__PURE__*/ (0, _jsxRuntime.jsx)(_button.Button, {
@@ -135,7 +167,7 @@ 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);
@@ -147,7 +179,8 @@ 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);

package/dist/cjs/components/modal-wizard/ModalWizard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/modal-wizard/ModalWizard.tsx"],"sourcesContent":["import {Box, createStyles, DefaultProps, Modal, ModalProps, Progress, Selectors} from '@mantine/core';\nimport {Children, ReactElement, useMemo, useState} from 'react';\n\nimport {Button} from '../button';\nimport {Header} from '../header';\nimport {StickyFooter} from '../sticky-footer';\nimport {ModalWizardStep} from './ModalWizardStep';\n\nconst useStyles = createStyles(() => ({\n    modal: {\n        display: 'flex',\n        flexDirection: 'column',\n    },\n    body: {\n        flex: 1,\n        display: 'flex',\n        flexDirection: 'column',\n    },\n}));\n\ntype ModalWizardStylesNames = Selectors<typeof useStyles>;\n\nexport interface ModalWizardProps\n    extends Omit<DefaultProps<ModalWizardStylesNames>, 'classNames' | 'styles'>,\n        Omit<ModalProps, 'centered' | 'title'> {\n    /**\n     * The label of the cancel button\n     *\n     * @default \"Cancel\"\n     */\n    cancelButtonLabel?: string;\n\n    /**\n     * The label of the next button\n     *\n     * @default \"Next\"\n     */\n    nextButtonLabel?: string;\n\n    /**\n     * The label of the previous button\n     *\n     * @default \"Previous\"\n     */\n    previousButtonLabel?: string;\n\n    /**\n     * The label of the finish button\n     *\n     * @default \"Finish\"\n     */\n    finishButtonLabel?: string;\n\n    /**\n     * A callback function that is executed when the user clicks on the next button\n     */\n    onNext?: () => unknown;\n\n    /**\n     * A callback function that is executed when the user clicks on the previous button\n     */\n    onPrevious?: () => unknown;\n\n    /**\n     * A function that is executed when user completes all the steps.\n     *\n     * @param close A function that closes the modal when called.\n     */\n    onFinish?: () => unknown;\n\n    /**\n     * Determine if user interacted with any steps in the modal wizard\n     */\n    isDirty?: () => boolean;\n\n    /**\n     * A function to confirm close if the state is dirty before closing\n     */\n    handleDirtyState?: () => boolean;\n\n    /**\n     * Children to display in modal wizard\n     * */\n    children?: Array<ReturnType<typeof ModalWizardStep>>;\n}\n\ninterface ModalWizardType {\n    (props: ModalWizardProps): ReactElement;\n\n    Step: typeof ModalWizardStep;\n}\n\nexport const ModalWizard: ModalWizardType = ({\n    cancelButtonLabel = 'Cancel',\n    nextButtonLabel = 'Next',\n    previousButtonLabel = 'Previous',\n    finishButtonLabel = 'Finish',\n    opened,\n    onNext,\n    onPrevious,\n    onClose,\n    onFinish,\n    isDirty,\n    handleDirtyState,\n    classNames,\n    className,\n    styles,\n    unstyled,\n    children,\n    ...modalProps\n}) => {\n    const {\n        classes: {modal, body},\n        cx,\n    } = useStyles(null, {\n        name: 'ModalWizard',\n        classNames,\n        styles,\n        unstyled,\n    });\n\n    const [currentStepIndex, setCurrentStepIndex] = useState(0);\n    const modalSteps = (Children.toArray(children) as ReactElement[]).filter((child) => child.type === ModalWizardStep);\n\n    const numberOfSteps = modalSteps.length;\n    const numberOfStepsCountAsProgress = modalSteps.filter((step) => step.props.countsAsProgress).length;\n    const isFirstStep = currentStepIndex === 0;\n    const isLastStep = currentStepIndex === numberOfSteps - 1;\n    const currentStep = modalSteps.filter((step: ReactElement, index: number) => index === currentStepIndex)[0];\n\n    const {isValid} = currentStep?.props?.validateStep?.(currentStepIndex, numberOfSteps) ?? {isValid: true};\n    const isModalDirty = isDirty && isDirty();\n\n    const closeModalWizard = () => {\n        if (isModalDirty && handleDirtyState) {\n            handleDirtyState() && onClose?.();\n        } else {\n            onClose?.();\n        }\n    };\n\n    const getProgress = (currStepIndex: number) => {\n        const validSteps = modalSteps.filter(\n            (step, index) => step.props.countsAsProgress && index <= currStepIndex\n        ).length;\n        return (validSteps / numberOfStepsCountAsProgress) * 100;\n    };\n\n    const getProgressMemo = useMemo(() => getProgress(currentStepIndex), [currentStepIndex]);\n    return (\n        <Modal\n            opened={opened}\n            classNames={{modal: cx(modal, classNames?.modal), body: cx(body, classNames?.body)}}\n            centered\n            title={\n                <Header\n                    docLink={currentStep.props.docLink}\n                    docLinkTooltipLabel={currentStep.props.docLinkTooltipLabel}\n                    description={\n                        typeof currentStep.props.description === 'function'\n                            ? currentStep.props.description(currentStepIndex + 1, numberOfSteps)\n                            : currentStep.props.description\n                    }\n                    py={0}\n                    px={0}\n                >\n                    {typeof currentStep.props.title === 'function'\n                        ? currentStep.props.title(currentStepIndex + 1, numberOfSteps)\n                        : currentStep.props.title}\n                </Header>\n            }\n            onClose={closeModalWizard}\n            {...modalProps}\n        >\n            {currentStep.props.showProgressBar && <Progress color=\"teal\" size=\"lg\" value={getProgressMemo} />}\n            {currentStep}\n            <Box\n                sx={(theme) => ({\n                    marginTop: 'auto',\n                })}\n            >\n                <StickyFooter px={0} pt=\"sm\" pb={0} borderTop>\n                    <Button\n                        name={isFirstStep ? cancelButtonLabel : previousButtonLabel}\n                        variant=\"outline\"\n                        onClick={() => {\n                            if (isFirstStep) {\n                                closeModalWizard();\n                            } else {\n                                onPrevious?.();\n                                setCurrentStepIndex(currentStepIndex - 1);\n                            }\n                        }}\n                    >\n                        {isFirstStep ? cancelButtonLabel : previousButtonLabel}\n                    </Button>\n\n                    <Button\n                        disabled={!isValid}\n                        onClick={() => {\n                            if (isLastStep) {\n                                onFinish ? onFinish() : onClose();\n                            } else {\n                                onNext?.();\n                                setCurrentStepIndex(currentStepIndex + 1);\n                            }\n                        }}\n                    >\n                        {isLastStep ? finishButtonLabel : nextButtonLabel}\n                    </Button>\n                </StickyFooter>\n            </Box>\n        </Modal>\n    );\n};\n\nModalWizard.Step = ModalWizardStep;\n"],"names":["ModalWizard","useStyles","createStyles","modal","display","flexDirection","body","flex","cancelButtonLabel","nextButtonLabel","previousButtonLabel","finishButtonLabel","opened","onNext","onPrevious","onClose","onFinish","isDirty","handleDirtyState","classNames","className","styles","unstyled","children","modalProps","currentStep","name","classes","cx","useState","currentStepIndex","setCurrentStepIndex","modalSteps","Children","toArray","filter","child","type","ModalWizardStep","numberOfSteps","length","numberOfStepsCountAsProgress","step","props","countsAsProgress","isFirstStep","isLastStep","index","isValid","validateStep","isModalDirty","closeModalWizard","getProgress","currStepIndex","validSteps","getProgressMemo","useMemo","Modal","centered","title","Header","docLink","docLinkTooltipLabel","description","py","px","showProgressBar","Progress","color","size","value","Box","sx","theme","marginTop","StickyFooter","pt","pb","borderTop","Button","variant","onClick","disabled","Step"],"mappings":"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"}
+{"version":3,"sources":["../../../../src/components/modal-wizard/ModalWizard.tsx"],"sourcesContent":["import {Box, CloseButton, createStyles, DefaultProps, Modal, ModalProps, Progress, Selectors} from '@mantine/core';\nimport {Children, ReactElement, useEffect, useMemo, useState} from 'react';\n\nimport {Button} from '../button';\nimport {Header} from '../header';\nimport {StickyFooter} from '../sticky-footer';\nimport {ModalWizardStep, ModalWizardStepProps, ResolveStep} from './ModalWizardStep';\n\nconst useStyles = createStyles(() => ({\n    modal: {\n        display: 'flex',\n        flexDirection: 'column',\n    },\n    body: {\n        flex: 1,\n        display: 'flex',\n        flexDirection: 'column',\n    },\n}));\n\ntype ModalWizardStylesNames = Selectors<typeof useStyles>;\n\nexport interface ModalWizardProps\n    extends Omit<DefaultProps<ModalWizardStylesNames>, 'classNames' | 'styles'>,\n        Omit<ModalProps, 'centered' | 'title'> {\n    /**\n     * The label of the cancel button\n     *\n     * @default \"Cancel\"\n     */\n    cancelButtonLabel?: string;\n\n    /**\n     * The label of the next button\n     *\n     * @default \"Next\"\n     */\n    nextButtonLabel?: string;\n\n    /**\n     * The label of the previous button\n     *\n     * @default \"Previous\"\n     */\n    previousButtonLabel?: string;\n\n    /**\n     * The label of the finish button\n     *\n     * @default \"Finish\"\n     */\n    finishButtonLabel?: string;\n\n    /**\n     * A callback function that is executed when the user clicks on the next button\n     */\n    onNext?: () => unknown;\n\n    /**\n     * A callback function that is executed when the user clicks on the previous button\n     */\n    onPrevious?: () => unknown;\n\n    /**\n     * A function that is executed when user completes all the steps.\n     *\n     * @param close A function that closes the modal when called.\n     */\n    onFinish?: () => unknown;\n\n    /**\n     * Determine if user interacted with any steps in the modal wizard\n     */\n    isDirty?: () => boolean;\n\n    /**\n     * A function to confirm close if the state is dirty before closing\n     */\n    handleDirtyState?: () => boolean;\n\n    /**\n     * Children to display in modal wizard\n     * */\n    children?: Array<ReturnType<typeof ModalWizardStep>>;\n}\n\ninterface ModalWizardType {\n    (props: ModalWizardProps): ReactElement;\n\n    Step: typeof ModalWizardStep;\n}\n\nexport const ModalWizard: ModalWizardType = ({\n    cancelButtonLabel = 'Cancel',\n    nextButtonLabel = 'Next',\n    previousButtonLabel = 'Previous',\n    finishButtonLabel = 'Finish',\n    opened,\n    onNext,\n    onPrevious,\n    onClose,\n    onFinish,\n    isDirty,\n    handleDirtyState,\n    classNames,\n    className,\n    styles,\n    unstyled,\n    children,\n    ...modalProps\n}) => {\n    const {\n        classes: {modal, body},\n        cx,\n    } = useStyles(null, {\n        name: 'ModalWizard',\n        classNames,\n        styles,\n        unstyled,\n    });\n\n    const [currentStepIndex, setCurrentStepIndex] = useState(0);\n    const modalSteps = (Children.toArray(children) as ReactElement[]).filter((child) => child.type === ModalWizardStep);\n\n    const numberOfSteps = modalSteps.length;\n    const numberOfStepsCountAsProgress = modalSteps.filter((step) => step.props.countsAsProgress).length;\n    const isFirstStep = currentStepIndex === 0;\n    const isLastStep = currentStepIndex === numberOfSteps - 1;\n    const currentStep = modalSteps.filter((step: ReactElement, index: number) => index === currentStepIndex)[0];\n\n    const {isValid} = currentStep?.props?.validateStep?.(currentStepIndex, numberOfSteps) ?? {isValid: true};\n\n    useEffect(() => {\n        if (opened) {\n            setCurrentStepIndex(0);\n        }\n    }, [opened]);\n\n    const handleClose = (confirmDirty: boolean) => {\n        if (confirmDirty) {\n            const isModalDirty = isDirty?.() ?? false;\n            if (isModalDirty) {\n                const discardChanges = handleDirtyState?.() ?? true;\n                if (!discardChanges) {\n                    return;\n                }\n            }\n        }\n        onClose?.();\n    };\n\n    const getProgress = (currStepIndex: number) => {\n        const validSteps = modalSteps.filter(\n            (step, index) => step.props.countsAsProgress && index <= currStepIndex\n        ).length;\n        return (validSteps / numberOfStepsCountAsProgress) * 100;\n    };\n\n    const resolveStepDependentProp = <P extends keyof ModalWizardStepProps>(\n        prop: P\n    ): ResolveStep<ModalWizardStepProps[P]> =>\n        typeof currentStep.props[prop] === 'function'\n            ? currentStep.props[prop](currentStepIndex + 1, numberOfSteps)\n            : currentStep.props[prop];\n\n    const getProgressMemo = useMemo(() => getProgress(currentStepIndex), [currentStepIndex]);\n    return (\n        <Modal\n            opened={opened}\n            classNames={{modal: cx(modal, classNames?.modal), body: cx(body, classNames?.body)}}\n            centered\n            onClose={() => handleClose(true)}\n            withCloseButton={false}\n            padding={0}\n            {...modalProps}\n        >\n            <Header p=\"lg\" pr=\"md\" variant=\"modal\" description={resolveStepDependentProp('description')}>\n                {resolveStepDependentProp('title')}\n                {resolveStepDependentProp('docLink') ? (\n                    <Header.DocAnchor\n                        href={resolveStepDependentProp('docLink')}\n                        label={resolveStepDependentProp('docLinkTooltipLabel')}\n                    />\n                ) : null}\n                <Header.Actions>\n                    <CloseButton aria-label={modalProps.closeButtonLabel} onClick={() => handleClose(true)} />\n                </Header.Actions>\n            </Header>\n            {currentStep.props.showProgressBar && (\n                <Progress color=\"navy.5\" size=\"sm\" radius={0} value={getProgressMemo} />\n            )}\n            <Box p=\"lg\">{currentStep}</Box>\n            <Box\n                sx={{\n                    marginTop: 'auto',\n                }}\n            >\n                <StickyFooter borderTop>\n                    <Button\n                        name={isFirstStep ? cancelButtonLabel : previousButtonLabel}\n                        variant=\"outline\"\n                        onClick={() => {\n                            if (isFirstStep) {\n                                handleClose(true);\n                            } else {\n                                onPrevious?.();\n                                setCurrentStepIndex(currentStepIndex - 1);\n                            }\n                        }}\n                    >\n                        {isFirstStep ? cancelButtonLabel : previousButtonLabel}\n                    </Button>\n\n                    <Button\n                        disabled={!isValid}\n                        onClick={() => {\n                            if (isLastStep) {\n                                onFinish?.() ?? handleClose(false);\n                            } else {\n                                onNext?.();\n                                setCurrentStepIndex(currentStepIndex + 1);\n                            }\n                        }}\n                    >\n                        {isLastStep ? finishButtonLabel : nextButtonLabel}\n                    </Button>\n                </StickyFooter>\n            </Box>\n        </Modal>\n    );\n};\n\nModalWizard.Step = ModalWizardStep;\n"],"names":["ModalWizard","useStyles","createStyles","modal","display","flexDirection","body","flex","cancelButtonLabel","nextButtonLabel","previousButtonLabel","finishButtonLabel","opened","onNext","onPrevious","onClose","onFinish","isDirty","handleDirtyState","classNames","className","styles","unstyled","children","modalProps","currentStep","name","classes","cx","useState","currentStepIndex","setCurrentStepIndex","modalSteps","Children","toArray","filter","child","type","ModalWizardStep","numberOfSteps","length","numberOfStepsCountAsProgress","step","props","countsAsProgress","isFirstStep","isLastStep","index","isValid","validateStep","useEffect","handleClose","confirmDirty","isModalDirty","discardChanges","getProgress","currStepIndex","validSteps","resolveStepDependentProp","prop","getProgressMemo","useMemo","Modal","centered","withCloseButton","padding","Header","p","pr","variant","description","DocAnchor","href","label","Actions","CloseButton","aria-label","closeButtonLabel","onClick","showProgressBar","Progress","color","size","radius","value","Box","sx","marginTop","StickyFooter","borderTop","Button","disabled","Step"],"mappings":"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"}

package/dist/cjs/components/modal-wizard/ModalWizardStep.js

@@ -8,9 +8,12 @@ Object.defineProperty(exports, "ModalWizardStep", {
         return ModalWizardStep;
     }
 });
+var _jsxRuntime = require("react/jsx-runtime");
 var ModalWizardStep = function(param) {
     var children = param.children;
-    return children;
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_jsxRuntime.Fragment, {
+        children: children
+    });
 };
 ModalWizardStep.defaultProps = {
     showProgressBar: true,

package/dist/cjs/components/modal-wizard/ModalWizardStep.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/modal-wizard/ModalWizardStep.tsx"],"sourcesContent":["import {FunctionComponent, PropsWithChildren, ReactElement} from 'react';\n\ntype DependsOnStep<T> = (currentStep: number, numberOfSteps: number) => T;\n\nexport interface ModalWizardStepProps {\n    /**\n     * The title of the current step. The title can be dependent on the current step if needed\n     */\n    title?: string | ReactElement | DependsOnStep<string | ReactElement>;\n\n    /**\n     * The description of the current step. The description can be dependent on the current step if needed\n     */\n    description?: string | ReactElement | DependsOnStep<string | ReactElement>;\n\n    /**\n     * A link to the documentation for the current step\n     */\n    docLink?: string;\n\n    /**\n     * A tooltip label for the docLink\n     */\n    docLinkTooltipLabel?: string | ReactElement | DependsOnStep<string | ReactElement>;\n\n    /**\n     * A function to validate the current step, it determines if the next step should be enabled or not.\n     */\n    validateStep: (currentStep: any, numberOfSteps: any) => {isValid: boolean; messsage?: unknown};\n\n    /**\n     * Show progress bar at this step\n     *\n     * @default true\n     */\n    showProgressBar?: boolean;\n\n    /**\n     * Does completion of current step count moves the progress bar\n     *\n     * @default true\n     */\n    countsAsProgress?: boolean;\n    children: ReactElement<any, any>;\n}\n\nconst ModalWizardStep: FunctionComponent<PropsWithChildren<ModalWizardStepProps>> = ({children}) => children;\n\nModalWizardStep.defaultProps = {\n    showProgressBar: true,\n    countsAsProgress: true,\n};\n\nexport {ModalWizardStep};\n"],"names":["ModalWizardStep","children","defaultProps","showProgressBar","countsAsProgress"],"mappings":";;;;+BAqDQA;;;eAAAA;;;AAPR,IAAMA,kBAA8E;QAAEC,iBAAAA;WAAcA;;AAEpGD,gBAAgBE,YAAY,GAAG;IAC3BC,iBAAiB,IAAI;IACrBC,kBAAkB,IAAI;AAC1B"}
+{"version":3,"sources":["../../../../src/components/modal-wizard/ModalWizardStep.tsx"],"sourcesContent":["import {FunctionComponent, PropsWithChildren, ReactNode} from 'react';\n\ntype DependsOnStep<T> = (currentStep: number, numberOfSteps: number) => T;\nexport type ResolveStep<P> = P extends infer T | DependsOnStep<infer T> ? T : never;\n\nexport interface ModalWizardStepProps {\n    /**\n     * The title of the current step. The title can be dependent on the current step if needed\n     */\n    title?: ReactNode | DependsOnStep<ReactNode>;\n\n    /**\n     * The description of the current step. The description can be dependent on the current step if needed\n     */\n    description?: string | DependsOnStep<string>;\n\n    /**\n     * A link to the documentation for the current step\n     */\n    docLink?: string | DependsOnStep<string>;\n\n    /**\n     * A tooltip label for the docLink\n     */\n    docLinkTooltipLabel?: string | DependsOnStep<string>;\n\n    /**\n     * A function to validate the current step, it determines if the next step should be enabled or not.\n     */\n    validateStep: (currentStep: any, numberOfSteps: any) => {isValid: boolean; messsage?: unknown};\n\n    /**\n     * Show progress bar at this step\n     *\n     * @default true\n     */\n    showProgressBar?: boolean;\n\n    /**\n     * Does completion of current step count moves the progress bar\n     *\n     * @default true\n     */\n    countsAsProgress?: boolean;\n}\n\nconst ModalWizardStep: FunctionComponent<PropsWithChildren<ModalWizardStepProps>> = ({children}) => <>{children}</>;\n\nModalWizardStep.defaultProps = {\n    showProgressBar: true,\n    countsAsProgress: true,\n};\n\nexport {ModalWizardStep};\n"],"names":["ModalWizardStep","children","defaultProps","showProgressBar","countsAsProgress"],"mappings":";;;;+BAqDQA;;;eAAAA;;;;AAPR,IAAMA,kBAA8E;QAAEC,iBAAAA;yBAAc;kBAAGA;;;AAEvGD,gBAAgBE,YAAY,GAAG;IAC3BC,iBAAiB,IAAI;IACrBC,kBAAkB,IAAI;AAC1B"}

package/dist/cjs/components/sticky-footer/StickyFooter.js

@@ -38,10 +38,8 @@ var StickyFooter = function(_param) {
                 className: classes.footer,
                 children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Group, _objectSpreadProps(_objectSpread({
                     position: "right",
-                    spacing: "xs",
-                    pt: "md",
-                    pb: "md",
-                    px: "xl"
+                    spacing: "sm",
+                    p: "lg"
                 }, others), {
                     children: children
                 }))

package/dist/cjs/components/sticky-footer/StickyFooter.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {Box, createStyles, DefaultProps, Divider, Group} from '@mantine/core';\nimport {FunctionComponent, PropsWithChildren} from 'react';\n\nexport interface StickyFooterProps extends DefaultProps {\n    /**\n     * Whether a border is render on top of the footer\n     */\n    borderTop?: boolean;\n}\n\nconst useStyles = createStyles(() => ({\n    footer: {\n        position: 'sticky',\n        bottom: 0,\n        zIndex: 1,\n        backgroundColor: 'white',\n    },\n}));\n\nexport const StickyFooter: FunctionComponent<PropsWithChildren<StickyFooterProps>> = ({\n    borderTop,\n    children,\n    ...others\n}) => {\n    const {classes} = useStyles();\n\n    return (\n        <>\n            {borderTop ? <Divider size=\"xs\" /> : null}\n            <Box className={classes.footer}>\n                <Group position=\"right\" spacing=\"xs\" pt=\"md\" pb=\"md\" px=\"xl\" {...others}>\n                    {children}\n                </Group>\n            </Box>\n        </>\n    );\n};\n"],"names":["StickyFooter","useStyles","createStyles","footer","position","bottom","zIndex","backgroundColor","borderTop","children","others","classes","Divider","size","Box","className","Group","spacing","pt","pb","px"],"mappings":";;;;+BAmBaA;;;eAAAA;;;;;;;oBAnBiD;AAU9D,IAAMC,YAAYC,IAAAA,kBAAY,EAAC;WAAO;QAClCC,QAAQ;YACJC,UAAU;YACVC,QAAQ;YACRC,QAAQ;YACRC,iBAAiB;QACrB;IACJ;;AAEO,IAAMP,eAAwE,iBAI/E;QAHFQ,mBAAAA,WACAC,kBAAAA,UACGC;QAFHF;QACAC;;IAGA,IAAM,AAACE,UAAWV,YAAXU;IAEP,qBACI;;YACKH,0BAAY,qBAACI,aAAO;gBAACC,MAAK;iBAAU,IAAI;0BACzC,qBAACC,SAAG;gBAACC,WAAWJ,QAAQR,MAAM;0BAC1B,cAAA,qBAACa,WAAK;oBAACZ,UAAS;oBAAQa,SAAQ;oBAAKC,IAAG;oBAAKC,IAAG;oBAAKC,IAAG;mBAASV;8BAC5DD;;;;;AAKrB"}
+{"version":3,"sources":["../../../../src/components/sticky-footer/StickyFooter.tsx"],"sourcesContent":["import {Box, createStyles, DefaultProps, Divider, Group} from '@mantine/core';\nimport {FunctionComponent, PropsWithChildren} from 'react';\n\nexport interface StickyFooterProps extends DefaultProps {\n    /**\n     * Whether a border is render on top of the footer\n     */\n    borderTop?: boolean;\n}\n\nconst useStyles = createStyles(() => ({\n    footer: {\n        position: 'sticky',\n        bottom: 0,\n        zIndex: 1,\n        backgroundColor: 'white',\n    },\n}));\n\nexport const StickyFooter: FunctionComponent<PropsWithChildren<StickyFooterProps>> = ({\n    borderTop,\n    children,\n    ...others\n}) => {\n    const {classes} = useStyles();\n\n    return (\n        <>\n            {borderTop ? <Divider size=\"xs\" /> : null}\n            <Box className={classes.footer}>\n                <Group position=\"right\" spacing=\"sm\" p=\"lg\" {...others}>\n                    {children}\n                </Group>\n            </Box>\n        </>\n    );\n};\n"],"names":["StickyFooter","useStyles","createStyles","footer","position","bottom","zIndex","backgroundColor","borderTop","children","others","classes","Divider","size","Box","className","Group","spacing","p"],"mappings":";;;;+BAmBaA;;;eAAAA;;;;;;;oBAnBiD;AAU9D,IAAMC,YAAYC,IAAAA,kBAAY,EAAC;WAAO;QAClCC,QAAQ;YACJC,UAAU;YACVC,QAAQ;YACRC,QAAQ;YACRC,iBAAiB;QACrB;IACJ;;AAEO,IAAMP,eAAwE,iBAI/E;QAHFQ,mBAAAA,WACAC,kBAAAA,UACGC;QAFHF;QACAC;;IAGA,IAAM,AAACE,UAAWV,YAAXU;IAEP,qBACI;;YACKH,0BAAY,qBAACI,aAAO;gBAACC,MAAK;iBAAU,IAAI;0BACzC,qBAACC,SAAG;gBAACC,WAAWJ,QAAQR,MAAM;0BAC1B,cAAA,qBAACa,WAAK;oBAACZ,UAAS;oBAAQa,SAAQ;oBAAKC,GAAE;mBAASR;8BAC3CD;;;;;AAKrB"}

package/dist/cjs/index.js

@@ -18,9 +18,6 @@ _export(exports, {
     Table: function() {
         return _components.Table;
     },
-    Modal: function() {
-        return _components.Modal;
-    },
     Button: function() {
         return _components.Button;
     },

package/dist/cjs/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import {Tuple} from '@mantine/core';\n\nimport {PlasmaColors} from './theme/PlasmaColors';\n\nexport * from '@mantine/notifications';\nexport * from '@mantine/carousel';\nexport * from '@mantine/core';\nexport type {FormValidateInput} from '@mantine/form/lib/types';\nexport * from '@mantine/hooks';\nexport * from '@tanstack/table-core';\nexport * from './components';\nexport * from '@mantine/form';\nexport {type NotificationProps} from '@mantine/notifications';\nexport {Pagination} from '@mantine/core';\n// explicitly overriding mantine components\nexport {\n    Header,\n    Table,\n    type TableProps,\n    type TableState,\n    type InitialTableState,\n    type HeaderProps,\n    Modal,\n    Button,\n    type ButtonProps,\n    Menu,\n    type MenuItemProps,\n} from './components';\nexport {useForm, createFormContext} from './form';\n\nexport * from './theme';\n\ndeclare module '@mantine/core' {\n    export interface MantineThemeColorsOverride {\n        // eslint-disable-next-line @typescript-eslint/ban-types\n        colors: Record<keyof typeof PlasmaColors | (string & {}), Tuple<string, 10>>;\n    }\n}\n"],"names":["Pagination","Header","Table","Modal","Button","Menu","useForm","createFormContext"],"mappings":";;;;;;;;;;;IAaQA,UAAU;eAAVA,gBAAU;;IAGdC,MAAM;eAANA,kBAAM;;IACNC,KAAK;eAALA,iBAAK;;IAKLC,KAAK;eAALA,iBAAK;;IACLC,MAAM;eAANA,kBAAM;;IAENC,IAAI;eAAJA,gBAAI;;IAGAC,OAAO;eAAPA,aAAO;;IAAEC,iBAAiB;eAAjBA,uBAAiB;;;;oBAxBpB;oBACA;gCACA;oBAEA;oBACA;sCACA;oBACA;oBAiB2B;oBAE3B"}
+{"version":3,"sources":["../../src/index.ts"],"sourcesContent":["import {Tuple} from '@mantine/core';\n\nimport {PlasmaColors} from './theme/PlasmaColors';\n\nexport * from '@mantine/notifications';\nexport * from '@mantine/carousel';\nexport * from '@mantine/core';\nexport type {FormValidateInput} from '@mantine/form/lib/types';\nexport * from '@mantine/hooks';\nexport * from '@tanstack/table-core';\nexport * from './components';\nexport * from '@mantine/form';\nexport {type NotificationProps} from '@mantine/notifications';\nexport {Pagination} from '@mantine/core';\n// explicitly overriding mantine components\nexport {\n    Header,\n    type HeaderProps,\n    Table,\n    type TableProps,\n    type TableState,\n    type InitialTableState,\n    Button,\n    type ButtonProps,\n    Menu,\n    type MenuItemProps,\n} from './components';\nexport {useForm, createFormContext} from './form';\n\nexport * from './theme';\n\ndeclare module '@mantine/core' {\n    export interface MantineThemeColorsOverride {\n        // eslint-disable-next-line @typescript-eslint/ban-types\n        colors: Record<keyof typeof PlasmaColors | (string & {}), Tuple<string, 10>>;\n    }\n}\n"],"names":["Pagination","Header","Table","Button","Menu","useForm","createFormContext"],"mappings":";;;;;;;;;;;IAaQA,UAAU;eAAVA,gBAAU;;IAGdC,MAAM;eAANA,kBAAM;;IAENC,KAAK;eAALA,iBAAK;;IAILC,MAAM;eAANA,kBAAM;;IAENC,IAAI;eAAJA,gBAAI;;IAGAC,OAAO;eAAPA,aAAO;;IAAEC,iBAAiB;eAAjBA,uBAAiB;;;;oBAvBpB;oBACA;gCACA;oBAEA;oBACA;sCACA;oBACA;oBAgB2B;oBAE3B"}

package/dist/cjs/theme/Theme.js

@@ -19,6 +19,7 @@ var plasmaTheme = {
     fontFamily: "canada-type-gibson, sans-serif",
     black: _plasmaTokens.color.primary.gray[9],
     defaultRadius: 8,
+    lineHeight: 1.5,
     spacing: {
         xs: 8,
         sm: 16,
@@ -33,32 +34,32 @@ var plasmaTheme = {
         sizes: {
             h1: {
                 fontSize: 48,
-                lineHeight: "56px",
+                lineHeight: undefined,
                 fontWeight: 300
             },
             h2: {
                 fontSize: 32,
-                lineHeight: "40px",
+                lineHeight: undefined,
                 fontWeight: 500
             },
             h3: {
                 fontSize: 24,
-                lineHeight: "32px",
+                lineHeight: undefined,
                 fontWeight: 500
             },
             h4: {
                 fontSize: 18,
-                lineHeight: "28px",
+                lineHeight: undefined,
                 fontWeight: 300
             },
             h5: {
                 fontSize: 14,
-                lineHeight: "20px",
+                lineHeight: undefined,
                 fontWeight: 500
             },
             h6: {
                 fontSize: 12,
-                lineHeight: "16px",
+                lineHeight: undefined,
                 fontWeight: 500
             }
         }
@@ -90,13 +91,17 @@ var plasmaTheme = {
                 return {
                     root: {
                         "&:is(h1,h2,h3,h4,h5,h6)": {
-                            letterSpacing: "0.011em",
-                            color: theme.colors.gray[9]
+                            letterSpacing: "0.011em"
                         }
                     }
                 };
             }
         },
+        Text: {
+            defaultProps: {
+                weight: 300
+            }
+        },
         Button: {
             styles: function(theme, params) {
                 return {
@@ -121,7 +126,11 @@ var plasmaTheme = {
                                 lg: 1334,
                                 xl: "85%"
                             }
-                        })
+                        }),
+                        overflow: "auto"
+                    },
+                    title: {
+                        width: "100%"
                     }
                 };
             },
@@ -137,11 +146,9 @@ var plasmaTheme = {
             styles: function(theme) {
                 return {
                     label: {
-                        marginBottom: theme.spacing.xs,
-                        lineHeight: "20px"
+                        marginBottom: theme.spacing.xs
                     },
                     description: {
-                        lineHeight: "20px",
                         fontSize: theme.fontSizes.sm,
                         color: theme.colors.gray[7],
                         marginBottom: theme.spacing.xs
@@ -169,13 +176,6 @@ var plasmaTheme = {
                 multiline: true
             }
         },
-        Breadcrumbs: {
-            defaultProps: {
-                separator: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_plasmaReactIcons.ArrowHeadRightSize24Px, {
-                    height: 24
-                })
-            }
-        },
         Loader: {
             defaultProps: {
                 variant: "dots",