@coveord/plasma-mantine 49.5.3 → 49.6.0

package/dist/cjs/components/button/Button.js

@@ -8,25 +8,96 @@ Object.defineProperty(exports, "Button", {
         return Button;
     }
 });
+var _asyncToGenerator = require("@swc/helpers/lib/_async_to_generator.js").default;
+var _instanceof = require("@swc/helpers/lib/_instanceof.js").default;
 var _objectSpread = require("@swc/helpers/lib/_object_spread.js").default;
 var _objectWithoutProperties = require("@swc/helpers/lib/_object_without_properties.js").default;
+var _slicedToArray = require("@swc/helpers/lib/_sliced_to_array.js").default;
+var _tsGenerator = require("@swc/helpers/lib/_ts_generator.js").default;
 var _jsxRuntime = require("react/jsx-runtime");
 var _core = require("@mantine/core");
 var _react = require("react");
 var _utils = require("../../utils");
 var _buttonWithDisabledTooltip = require("./ButtonWithDisabledTooltip");
-var _Button = /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) /*#__PURE__*/ {
-    var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, disabledTooltipProps = _param.disabledTooltipProps, others = _objectWithoutProperties(_param, [
+var useLoadingHandler = function(handler) {
+    var _useState = _slicedToArray((0, _react.useState)(false), 2), isLoading = _useState[0], setIsLoading = _useState[1];
+    var handleClick = function() {
+        var _ref = _asyncToGenerator(function(event) {
+            var possiblePromise, err;
+            return _tsGenerator(this, function(_state) {
+                switch(_state.label){
+                    case 0:
+                        possiblePromise = handler(event);
+                        _state.label = 1;
+                    case 1:
+                        _state.trys.push([
+                            1,
+                            4,
+                            ,
+                            5
+                        ]);
+                        if (!_instanceof(possiblePromise, Promise)) return [
+                            3,
+                            3
+                        ];
+                        setIsLoading(true);
+                        return [
+                            4,
+                            possiblePromise
+                        ];
+                    case 2:
+                        _state.sent();
+                        setIsLoading(false);
+                        _state.label = 3;
+                    case 3:
+                        return [
+                            3,
+                            5
+                        ];
+                    case 4:
+                        err = _state.sent();
+                        setIsLoading(false);
+                        console.error(err);
+                        return [
+                            3,
+                            5
+                        ];
+                    case 5:
+                        return [
+                            2
+                        ];
+                }
+            });
+        });
+        return function handleClick(event) {
+            return _ref.apply(this, arguments);
+        };
+    }();
+    return {
+        isLoading: isLoading,
+        handleClick: handleClick
+    };
+};
+var _Button = /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) {
+    var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, disabledTooltipProps = _param.disabledTooltipProps, loading = _param.loading, onClick = _param.onClick, others = _objectWithoutProperties(_param, [
         "disabledTooltip",
         "disabled",
-        "disabledTooltipProps"
+        "disabledTooltipProps",
+        "loading",
+        "onClick"
     ]);
-    return (0, _jsxRuntime.jsx)(_buttonWithDisabledTooltip.ButtonWithDisabledTooltip, {
+    var _useLoadingHandler = useLoadingHandler(onClick), isLoading = _useLoadingHandler.isLoading, handleClick = _useLoadingHandler.handleClick;
+    return /*#__PURE__*/ (0, _jsxRuntime.jsx)(_buttonWithDisabledTooltip.ButtonWithDisabledTooltip, {
         disabled: disabled,
         disabledTooltip: disabledTooltip,
         disabledTooltipProps: disabledTooltipProps,
         children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Button, _objectSpread({
+            loaderProps: {
+                variant: "oval"
+            },
             ref: ref,
+            loading: isLoading || loading,
+            onClick: handleClick,
             disabled: disabled
         }, others))
     });

package/dist/cjs/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\nimport {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';\n\nexport interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {}\n\nconst _Button = forwardRef<HTMLButtonElement, ButtonProps>(\n    ({disabledTooltip, disabled, disabledTooltipProps, ...others}, ref) => (\n        <ButtonWithDisabledTooltip\n            disabled={disabled}\n            disabledTooltip={disabledTooltip}\n            disabledTooltipProps={disabledTooltipProps}\n        >\n            <MantineButton ref={ref} disabled={disabled} {...others} />\n        </ButtonWithDisabledTooltip>\n    )\n);\n\nexport const Button = createPolymorphicComponent<'button', ButtonProps, {Group: typeof MantineButton.Group}>(_Button);\nButton.Group = MantineButton.Group;\n"],"names":["Button","_Button","forwardRef","ref","disabledTooltip","disabled","disabledTooltipProps","others","ButtonWithDisabledTooltip","MantineButton","createPolymorphicComponent","Group"],"mappings":";;;;+BAoBaA;;;eAAAA;;;;;;oBApB4D;qBAChD;qBAEgB;yCAC+B;AAIxE,IAAMC,wBAAUC,IAAAA,iBAAU,EACtB,iBAA+DC,mBAC3D;QADFC,yBAAAA,iBAAiBC,kBAAAA,UAAUC,8BAAAA,sBAAyBC;QAApDH;QAAiBC;QAAUC;;WACzB,qBAACE,oDAAyB;QACtBH,UAAUA;QACVD,iBAAiBA;QACjBE,sBAAsBA;kBAEtB,cAAA,qBAACG,YAAa;YAACN,KAAKA;YAAKE,UAAUA;WAAcE;;AAC1B;AAI5B,IAAMP,SAASU,IAAAA,iCAA0B,EAA6DT;AAC7GD,OAAOW,KAAK,GAAGF,YAAa,CAACE,KAAK"}
+{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef, useState, MouseEventHandler, MouseEvent} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\nimport {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';\n\nexport interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {\n    /* Handler executed on click */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nconst useLoadingHandler = (handler: MouseEventHandler<HTMLButtonElement>) => {\n    const [isLoading, setIsLoading] = useState(false);\n\n    const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\n        const possiblePromise: unknown = handler(event);\n        try {\n            if (possiblePromise instanceof Promise) {\n                setIsLoading(true);\n                await possiblePromise;\n                setIsLoading(false);\n            }\n        } catch (err) {\n            setIsLoading(false);\n            console.error(err);\n        }\n    };\n\n    return {isLoading, handleClick};\n};\n\nconst _Button = forwardRef<HTMLButtonElement, ButtonProps>(\n    ({disabledTooltip, disabled, disabledTooltipProps, loading, onClick, ...others}, ref) => {\n        const {isLoading, handleClick} = useLoadingHandler(onClick);\n        return (\n            <ButtonWithDisabledTooltip\n                disabled={disabled}\n                disabledTooltip={disabledTooltip}\n                disabledTooltipProps={disabledTooltipProps}\n            >\n                <MantineButton\n                    loaderProps={{variant: 'oval'}}\n                    ref={ref}\n                    loading={isLoading || loading}\n                    onClick={handleClick}\n                    disabled={disabled}\n                    {...others}\n                />\n            </ButtonWithDisabledTooltip>\n        );\n    }\n);\n\nexport const Button = createPolymorphicComponent<'button', ButtonProps, {Group: typeof MantineButton.Group}>(_Button);\nButton.Group = MantineButton.Group;\n"],"names":["Button","useLoadingHandler","handler","useState","isLoading","setIsLoading","handleClick","event","possiblePromise","err","Promise","console","error","_Button","forwardRef","ref","disabledTooltip","disabled","disabledTooltipProps","loading","onClick","others","ButtonWithDisabledTooltip","MantineButton","loaderProps","variant","createPolymorphicComponent","Group"],"mappings":";;;;+BAqDaA;;;eAAAA;;;;;;;;;;oBArD4D;qBACP;qBAEzB;yCAC+B;AAOxE,IAAMC,oBAAoB,SAACC,SAAkD;IACzE,IAAkCC,2BAAAA,IAAAA,eAAQ,EAAC,KAAK,OAAzCC,YAA2BD,cAAhBE,eAAgBF;IAElC,IAAMG;mBAAc,kBAAA,SAAOC,OAAyC;gBAC1DC,iBAOGC;;;;wBAPHD,kBAA2BN,QAAQK;;;;;;;;;6BAEjCC,AAAe,YAAfA,iBAA2BE,UAA3BF;;;;wBACAH,aAAa,IAAI;wBACjB;;4BAAMG;;;wBAAN;wBACAH,aAAa,KAAK;;;;;;;;wBAEjBI;wBACLJ,aAAa,KAAK;wBAClBM,QAAQC,KAAK,CAACH;;;;;;;;;;;QAEtB;wBAZMH,YAAqBC;;;;IAc3B,OAAO;QAACH,WAAAA;QAAWE,aAAAA;IAAW;AAClC;AAEA,IAAMO,wBAAUC,IAAAA,iBAAU,EACtB,iBAAiFC,KAAQ;QAAvFC,yBAAAA,iBAAiBC,kBAAAA,UAAUC,8BAAAA,sBAAsBC,iBAAAA,SAASC,iBAAAA,SAAYC;QAAtEL;QAAiBC;QAAUC;QAAsBC;QAASC;;IACxD,IAAiCnB,qBAAAA,kBAAkBmB,UAA5ChB,YAA0BH,mBAA1BG,WAAWE,cAAeL,mBAAfK;IAClB,qBACI,qBAACgB,oDAAyB;QACtBL,UAAUA;QACVD,iBAAiBA;QACjBE,sBAAsBA;kBAEtB,cAAA,qBAACK,YAAa;YACVC,aAAa;gBAACC,SAAS;YAAM;YAC7BV,KAAKA;YACLI,SAASf,aAAae;YACtBC,SAASd;YACTW,UAAUA;WACNI;;AAIpB;AAGG,IAAMrB,SAAS0B,IAAAA,iCAA0B,EAA6Db;AAC7Gb,OAAO2B,KAAK,GAAGJ,YAAa,CAACI,KAAK"}

package/dist/cjs/index.js

@@ -9,6 +9,9 @@ function _export(target, all) {
     });
 }
 _export(exports, {
+    NotificationProps: function() {
+        return _notifications.NotificationProps;
+    },
     Pagination: function() {
         return _core.Pagination;
     },
@@ -35,6 +38,7 @@ _export(exports, {
     }
 });
 var _exportStar = require("@swc/helpers/lib/_export_star.js").default;
+var _notifications = _exportStar(require("@mantine/notifications"), exports);
 _exportStar(require("@mantine/carousel"), exports);
 var _core = _exportStar(require("@mantine/core"), exports);
 _exportStar(require("@mantine/hooks"), exports);

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/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 {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":";;;;;;;;;;;IAWQA,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;;;;oBAtBpB;gCACA;oBAEA;oBACA;sCACA;oBACA;oBAgB2B;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 {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":["NotificationProps","Pagination","Header","Table","Modal","Button","Menu","useForm","createFormContext"],"mappings":";;;;;;;;;;;IAYQA,iBAAiB;eAAjBA,gCAAiB;;IACjBC,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;;;;yCAxBpB;oBACA;gCACA;oBAEA;oBACA;sCACA;oBACA;oBAiB2B;oBAE3B"}

package/dist/definitions/components/button/Button.d.ts

@@ -1,7 +1,8 @@
-/// <reference types="react" />
 import { Button as MantineButton, ButtonProps as MantineButtonProps } from '@mantine/core';
+import { MouseEventHandler } from 'react';
 import { ButtonWithDisabledTooltipProps } from './ButtonWithDisabledTooltip';
 export interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {
+    onClick?: MouseEventHandler<HTMLButtonElement>;
 }
 export declare const Button: (<C = "button">(props: import("@mantine/utils").PolymorphicComponentProps<C, ButtonProps>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & Omit<import("react").FunctionComponent<(ButtonProps & {
     component?: any;

package/dist/definitions/components/button/Button.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":";AAAA,OAAO,EAAC,MAAM,IAAI,aAAa,EAAE,WAAW,IAAI,kBAAkB,EAAC,MAAM,eAAe,CAAC;AAIzF,OAAO,EAA4B,8BAA8B,EAAC,MAAM,6BAA6B,CAAC;AAEtG,MAAM,WAAW,WAAY,SAAQ,kBAAkB,EAAE,8BAA8B;CAAG;AAc1F,eAAO,MAAM,MAAM;;;;;;;WAA6D,OAAO,cAAc,KAAK;CAAW,CAAC"}
+{"version":3,"file":"Button.d.ts","sourceRoot":"","sources":["../../../../src/components/button/Button.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAC,MAAM,IAAI,aAAa,EAAE,WAAW,IAAI,kBAAkB,EAAC,MAAM,eAAe,CAAC;AACzF,OAAO,EAAuB,iBAAiB,EAAa,MAAM,OAAO,CAAC;AAG1E,OAAO,EAA4B,8BAA8B,EAAC,MAAM,6BAA6B,CAAC;AAEtG,MAAM,WAAW,WAAY,SAAQ,kBAAkB,EAAE,8BAA8B;IAEnF,OAAO,CAAC,EAAE,iBAAiB,CAAC,iBAAiB,CAAC,CAAC;CAClD;AA4CD,eAAO,MAAM,MAAM;;;;;;;WAA6D,OAAO,cAAc,KAAK;CAAW,CAAC"}

package/dist/definitions/index.d.ts

@@ -1,5 +1,6 @@
 import { Tuple } from '@mantine/core';
 import { PlasmaColors } from './theme/PlasmaColors';
+export * from '@mantine/notifications';
 export * from '@mantine/carousel';
 export * from '@mantine/core';
 export type { FormValidateInput } from '@mantine/form/lib/types';
@@ -7,6 +8,7 @@ export * from '@mantine/hooks';
 export * from '@tanstack/table-core';
 export * from './components';
 export * from '@mantine/form';
+export { 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 { useForm, createFormContext } from './form';

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,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,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,iBAAiB,EAAC,MAAM,wBAAwB,CAAC;AACzD,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"}

package/dist/esm/components/button/Button.js

@@ -1,22 +1,93 @@
+import _async_to_generator from "@swc/helpers/src/_async_to_generator.mjs";
+import _instanceof from "@swc/helpers/src/_instanceof.mjs";
 import _object_spread from "@swc/helpers/src/_object_spread.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 _ts_generator from "@swc/helpers/src/_ts_generator.mjs";
 import { jsx as _jsx } from "react/jsx-runtime";
 import { Button as MantineButton } from "@mantine/core";
-import { forwardRef } from "react";
+import { forwardRef, useState } from "react";
 import { createPolymorphicComponent } from "../../utils";
 import { ButtonWithDisabledTooltip } from "./ButtonWithDisabledTooltip";
-var _Button = /*#__PURE__*/ forwardRef(function(_param, ref) /*#__PURE__*/ {
-    var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, disabledTooltipProps = _param.disabledTooltipProps, others = _object_without_properties(_param, [
+var useLoadingHandler = function(handler) {
+    var _useState = _sliced_to_array(useState(false), 2), isLoading = _useState[0], setIsLoading = _useState[1];
+    var handleClick = function() {
+        var _ref = _async_to_generator(function(event) {
+            var possiblePromise, err;
+            return _ts_generator(this, function(_state) {
+                switch(_state.label){
+                    case 0:
+                        possiblePromise = handler(event);
+                        _state.label = 1;
+                    case 1:
+                        _state.trys.push([
+                            1,
+                            4,
+                            ,
+                            5
+                        ]);
+                        if (!_instanceof(possiblePromise, Promise)) return [
+                            3,
+                            3
+                        ];
+                        setIsLoading(true);
+                        return [
+                            4,
+                            possiblePromise
+                        ];
+                    case 2:
+                        _state.sent();
+                        setIsLoading(false);
+                        _state.label = 3;
+                    case 3:
+                        return [
+                            3,
+                            5
+                        ];
+                    case 4:
+                        err = _state.sent();
+                        setIsLoading(false);
+                        console.error(err);
+                        return [
+                            3,
+                            5
+                        ];
+                    case 5:
+                        return [
+                            2
+                        ];
+                }
+            });
+        });
+        return function handleClick(event) {
+            return _ref.apply(this, arguments);
+        };
+    }();
+    return {
+        isLoading: isLoading,
+        handleClick: handleClick
+    };
+};
+var _Button = /*#__PURE__*/ forwardRef(function(_param, ref) {
+    var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, disabledTooltipProps = _param.disabledTooltipProps, loading = _param.loading, onClick = _param.onClick, others = _object_without_properties(_param, [
         "disabledTooltip",
         "disabled",
-        "disabledTooltipProps"
+        "disabledTooltipProps",
+        "loading",
+        "onClick"
     ]);
-    return _jsx(ButtonWithDisabledTooltip, {
+    var _useLoadingHandler = useLoadingHandler(onClick), isLoading = _useLoadingHandler.isLoading, handleClick = _useLoadingHandler.handleClick;
+    return /*#__PURE__*/ _jsx(ButtonWithDisabledTooltip, {
         disabled: disabled,
         disabledTooltip: disabledTooltip,
         disabledTooltipProps: disabledTooltipProps,
         children: /*#__PURE__*/ _jsx(MantineButton, _object_spread({
+            loaderProps: {
+                variant: "oval"
+            },
             ref: ref,
+            loading: isLoading || loading,
+            onClick: handleClick,
             disabled: disabled
         }, others))
     });

package/dist/esm/components/button/Button.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\nimport {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';\n\nexport interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {}\n\nconst _Button = forwardRef<HTMLButtonElement, ButtonProps>(\n    ({disabledTooltip, disabled, disabledTooltipProps, ...others}, ref) => (\n        <ButtonWithDisabledTooltip\n            disabled={disabled}\n            disabledTooltip={disabledTooltip}\n            disabledTooltipProps={disabledTooltipProps}\n        >\n            <MantineButton ref={ref} disabled={disabled} {...others} />\n        </ButtonWithDisabledTooltip>\n    )\n);\n\nexport const Button = createPolymorphicComponent<'button', ButtonProps, {Group: typeof MantineButton.Group}>(_Button);\nButton.Group = MantineButton.Group;\n"],"names":["Button","MantineButton","forwardRef","createPolymorphicComponent","ButtonWithDisabledTooltip","_Button","ref","disabledTooltip","disabled","disabledTooltipProps","others","Group"],"mappings":";;;AAAA,SAAQA,UAAUC,aAAa,QAA0C,gBAAgB;AACzF,SAAQC,UAAU,QAAO,QAAQ;AAEjC,SAAQC,0BAA0B,QAAO,cAAc;AACvD,SAAQC,yBAAyB,QAAuC,8BAA8B;AAItG,IAAMC,wBAAUH,WACZ,iBAA+DI,mBAC3D;QADFC,yBAAAA,iBAAiBC,kBAAAA,UAAUC,8BAAAA,sBAAyBC;QAApDH;QAAiBC;QAAUC;;WACzB,KAACL;QACGI,UAAUA;QACVD,iBAAiBA;QACjBE,sBAAsBA;kBAEtB,cAAA,KAACR;YAAcK,KAAKA;YAAKE,UAAUA;WAAcE;;AAC1B;AAInC,OAAO,IAAMV,SAASG,2BAAuFE,SAAS;AACtHL,OAAOW,KAAK,GAAGV,cAAcU,KAAK"}
+{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef, useState, MouseEventHandler, MouseEvent} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\nimport {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';\n\nexport interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {\n    /* Handler executed on click */\n    onClick?: MouseEventHandler<HTMLButtonElement>;\n}\n\nconst useLoadingHandler = (handler: MouseEventHandler<HTMLButtonElement>) => {\n    const [isLoading, setIsLoading] = useState(false);\n\n    const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {\n        const possiblePromise: unknown = handler(event);\n        try {\n            if (possiblePromise instanceof Promise) {\n                setIsLoading(true);\n                await possiblePromise;\n                setIsLoading(false);\n            }\n        } catch (err) {\n            setIsLoading(false);\n            console.error(err);\n        }\n    };\n\n    return {isLoading, handleClick};\n};\n\nconst _Button = forwardRef<HTMLButtonElement, ButtonProps>(\n    ({disabledTooltip, disabled, disabledTooltipProps, loading, onClick, ...others}, ref) => {\n        const {isLoading, handleClick} = useLoadingHandler(onClick);\n        return (\n            <ButtonWithDisabledTooltip\n                disabled={disabled}\n                disabledTooltip={disabledTooltip}\n                disabledTooltipProps={disabledTooltipProps}\n            >\n                <MantineButton\n                    loaderProps={{variant: 'oval'}}\n                    ref={ref}\n                    loading={isLoading || loading}\n                    onClick={handleClick}\n                    disabled={disabled}\n                    {...others}\n                />\n            </ButtonWithDisabledTooltip>\n        );\n    }\n);\n\nexport const Button = createPolymorphicComponent<'button', ButtonProps, {Group: typeof MantineButton.Group}>(_Button);\nButton.Group = MantineButton.Group;\n"],"names":["Button","MantineButton","forwardRef","useState","createPolymorphicComponent","ButtonWithDisabledTooltip","useLoadingHandler","handler","isLoading","setIsLoading","handleClick","event","possiblePromise","err","Promise","console","error","_Button","ref","disabledTooltip","disabled","disabledTooltipProps","loading","onClick","others","loaderProps","variant","Group"],"mappings":";;;;;;;AAAA,SAAQA,UAAUC,aAAa,QAA0C,gBAAgB;AACzF,SAAQC,UAAU,EAAEC,QAAQ,QAAsC,QAAQ;AAE1E,SAAQC,0BAA0B,QAAO,cAAc;AACvD,SAAQC,yBAAyB,QAAuC,8BAA8B;AAOtG,IAAMC,oBAAoB,SAACC,SAAkD;IACzE,IAAkCJ,6BAAAA,SAAS,KAAK,OAAzCK,YAA2BL,cAAhBM,eAAgBN;IAElC,IAAMO;mBAAc,oBAAA,SAAOC,OAAyC;gBAC1DC,iBAOGC;;;;wBAPHD,kBAA2BL,QAAQI;;;;;;;;;6BAEjCC,AAAe,YAAfA,iBAA2BE,UAA3BF;;;;wBACAH,aAAa,IAAI;wBACjB;;4BAAMG;;;wBAAN;wBACAH,aAAa,KAAK;;;;;;;;wBAEjBI;wBACLJ,aAAa,KAAK;wBAClBM,QAAQC,KAAK,CAACH;;;;;;;;;;;QAEtB;wBAZMH,YAAqBC;;;;IAc3B,OAAO;QAACH,WAAAA;QAAWE,aAAAA;IAAW;AAClC;AAEA,IAAMO,wBAAUf,WACZ,iBAAiFgB,KAAQ;QAAvFC,yBAAAA,iBAAiBC,kBAAAA,UAAUC,8BAAAA,sBAAsBC,iBAAAA,SAASC,iBAAAA,SAAYC;QAAtEL;QAAiBC;QAAUC;QAAsBC;QAASC;;IACxD,IAAiCjB,qBAAAA,kBAAkBiB,UAA5Cf,YAA0BF,mBAA1BE,WAAWE,cAAeJ,mBAAfI;IAClB,qBACI,KAACL;QACGe,UAAUA;QACVD,iBAAiBA;QACjBE,sBAAsBA;kBAEtB,cAAA,KAACpB;YACGwB,aAAa;gBAACC,SAAS;YAAM;YAC7BR,KAAKA;YACLI,SAASd,aAAac;YACtBC,SAASb;YACTU,UAAUA;WACNI;;AAIpB;AAGJ,OAAO,IAAMxB,SAASI,2BAAuFa,SAAS;AACtHjB,OAAO2B,KAAK,GAAG1B,cAAc0B,KAAK"}

package/dist/esm/index.js

@@ -1,9 +1,11 @@
+export * from "@mantine/notifications";
 export * from "@mantine/carousel";
 export * from "@mantine/core";
 export * from "@mantine/hooks";
 export * from "@tanstack/table-core";
 export * from "./components";
 export * from "@mantine/form";
+export { NotificationProps } from "@mantine/notifications";
 export { Pagination } from "@mantine/core";
 // explicitly overriding mantine components
 export { Header, Table, Modal, Button, Menu } from "./components";

package/dist/esm/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/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 {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":"AAIA,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAE9B,cAAc,iBAAiB;AAC/B,cAAc,uBAAuB;AACrC,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,SAAQA,UAAU,QAAO,gBAAgB;AACzC,2CAA2C;AAC3C,SACIC,MAAM,EACNC,KAAK,EAKLC,KAAK,EACLC,MAAM,EAENC,IAAI,QAED,eAAe;AACtB,SAAQC,OAAO,EAAEC,iBAAiB,QAAO,SAAS;AAElD,cAAc,UAAU"}
+{"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 {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":["NotificationProps","Pagination","Header","Table","Modal","Button","Menu","useForm","createFormContext"],"mappings":"AAIA,cAAc,yBAAyB;AACvC,cAAc,oBAAoB;AAClC,cAAc,gBAAgB;AAE9B,cAAc,iBAAiB;AAC/B,cAAc,uBAAuB;AACrC,cAAc,eAAe;AAC7B,cAAc,gBAAgB;AAC9B,SAAQA,iBAAiB,QAAO,yBAAyB;AACzD,SAAQC,UAAU,QAAO,gBAAgB;AACzC,2CAA2C;AAC3C,SACIC,MAAM,EACNC,KAAK,EAKLC,KAAK,EACLC,MAAM,EAENC,IAAI,QAED,eAAe;AACtB,SAAQC,OAAO,EAAEC,iBAAiB,QAAO,SAAS;AAElD,cAAc,UAAU"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coveord/plasma-mantine",
-  "version": "49.5.3",
+  "version": "49.6.0",
   "description": "A Plasma flavoured Mantine theme",
   "keywords": [
     "plasma",
@@ -36,6 +36,7 @@
     "@mantine/form": "5.9.2",
     "@mantine/hooks": "5.9.2",
     "@mantine/modals": "5.9.2",
+    "@mantine/notifications": "5.9.2",
     "@swc/cli": "0.1.62",
     "@swc/core": "1.3.35",
     "@swc/jest": "0.2.23",

package/src/components/button/Button.tsx

@@ -1,21 +1,54 @@
 import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';
-import {forwardRef} from 'react';
+import {forwardRef, useState, MouseEventHandler, MouseEvent} from 'react';
 
 import {createPolymorphicComponent} from '../../utils';
 import {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';
 
-export interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {}
+export interface ButtonProps extends MantineButtonProps, ButtonWithDisabledTooltipProps {
+    /* Handler executed on click */
+    onClick?: MouseEventHandler<HTMLButtonElement>;
+}
+
+const useLoadingHandler = (handler: MouseEventHandler<HTMLButtonElement>) => {
+    const [isLoading, setIsLoading] = useState(false);
+
+    const handleClick = async (event: MouseEvent<HTMLButtonElement>) => {
+        const possiblePromise: unknown = handler(event);
+        try {
+            if (possiblePromise instanceof Promise) {
+                setIsLoading(true);
+                await possiblePromise;
+                setIsLoading(false);
+            }
+        } catch (err) {
+            setIsLoading(false);
+            console.error(err);
+        }
+    };
+
+    return {isLoading, handleClick};
+};
 
 const _Button = forwardRef<HTMLButtonElement, ButtonProps>(
-    ({disabledTooltip, disabled, disabledTooltipProps, ...others}, ref) => (
-        <ButtonWithDisabledTooltip
-            disabled={disabled}
-            disabledTooltip={disabledTooltip}
-            disabledTooltipProps={disabledTooltipProps}
-        >
-            <MantineButton ref={ref} disabled={disabled} {...others} />
-        </ButtonWithDisabledTooltip>
-    )
+    ({disabledTooltip, disabled, disabledTooltipProps, loading, onClick, ...others}, ref) => {
+        const {isLoading, handleClick} = useLoadingHandler(onClick);
+        return (
+            <ButtonWithDisabledTooltip
+                disabled={disabled}
+                disabledTooltip={disabledTooltip}
+                disabledTooltipProps={disabledTooltipProps}
+            >
+                <MantineButton
+                    loaderProps={{variant: 'oval'}}
+                    ref={ref}
+                    loading={isLoading || loading}
+                    onClick={handleClick}
+                    disabled={disabled}
+                    {...others}
+                />
+            </ButtonWithDisabledTooltip>
+        );
+    }
 );
 
 export const Button = createPolymorphicComponent<'button', ButtonProps, {Group: typeof MantineButton.Group}>(_Button);

package/src/components/button/__tests__/Button.spec.tsx

@@ -1,4 +1,4 @@
-import {render} from '@test-utils';
+import {render, screen, userEvent, waitFor, within} from '@test-utils';
 
 import {Button} from '../Button';
 
@@ -9,4 +9,79 @@ describe('Button', () => {
             render(<Button.Group></Button.Group>);
         }).not.toThrow();
     });
+
+    describe('onClick Promise handler', () => {
+        it('uses the native loading prop if passed', () => {
+            render(
+                <>
+                    <Button loading={true}>I am loading</Button>
+                    <Button loading={false}>I am not loading</Button>
+                </>
+            );
+            expect(within(screen.getByRole('button', {name: /I am loading/i})).getByRole('presentation')).toBeVisible();
+            expect(
+                within(screen.queryByRole('button', {name: /I am not loading/i})).queryByRole('presentation')
+            ).not.toBeInTheDocument();
+        });
+
+        it('shows a loader while the promise is waiting to be resolved', async () => {
+            let resolve: () => void;
+            let isResolved = false;
+
+            const promise = () =>
+                new Promise<void>((res) => {
+                    resolve = res;
+                }).then(() => {
+                    isResolved = true;
+                });
+
+            render(<Button onClick={promise}>promise handler</Button>);
+
+            userEvent.click(screen.getByRole('button', {name: /promise handler/i}));
+
+            expect(
+                await within(screen.getByRole('button', {name: /promise handler/i})).findByRole('presentation')
+            ).toBeVisible();
+
+            resolve();
+
+            await waitFor(() => {
+                expect(isResolved).toBeTruthy();
+            });
+
+            expect(
+                within(screen.queryByRole('button', {name: /promise handler/i})).queryByRole('presentation')
+            ).not.toBeInTheDocument();
+        });
+
+        it('removes the loading if a promise is rejected', async () => {
+            let reject: () => void;
+            let isRejected = false;
+
+            const promise = () =>
+                new Promise<void>((res, rej) => {
+                    reject = rej;
+                }).catch(() => {
+                    isRejected = true;
+                });
+
+            render(<Button onClick={promise}>promise handler</Button>);
+
+            userEvent.click(screen.getByRole('button', {name: /promise handler/i}));
+
+            expect(
+                await within(screen.getByRole('button', {name: /promise handler/i})).findByRole('presentation')
+            ).toBeVisible();
+
+            reject();
+
+            await waitFor(() => {
+                expect(isRejected).toBeTruthy();
+            });
+
+            expect(
+                within(screen.queryByRole('button', {name: /promise handler/i})).queryByRole('presentation')
+            ).not.toBeInTheDocument();
+        });
+    });
 });

package/src/index.ts

@@ -2,6 +2,7 @@ import {Tuple} from '@mantine/core';
 
 import {PlasmaColors} from './theme/PlasmaColors';
 
+export * from '@mantine/notifications';
 export * from '@mantine/carousel';
 export * from '@mantine/core';
 export type {FormValidateInput} from '@mantine/form/lib/types';
@@ -9,6 +10,7 @@ export * from '@mantine/hooks';
 export * from '@tanstack/table-core';
 export * from './components';
 export * from '@mantine/form';
+export {NotificationProps} from '@mantine/notifications';
 export {Pagination} from '@mantine/core';
 // explicitly overriding mantine components
 export {