@coveord/plasma-mantine 51.1.0 → 51.1.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/.turbo/turbo-build.log +3 -3
- package/.turbo/turbo-test.log +27 -27
- package/dist/.tsbuildinfo +1 -1
- package/dist/cjs/components/button/Button.js +1 -0
- package/dist/cjs/components/button/Button.js.map +1 -1
- package/dist/cjs/components/button/ButtonWithDisabledTooltip.js +5 -3
- package/dist/cjs/components/button/ButtonWithDisabledTooltip.js.map +1 -1
- package/dist/definitions/components/button/Button.d.ts.map +1 -1
- package/dist/definitions/components/button/ButtonWithDisabledTooltip.d.ts +4 -0
- package/dist/definitions/components/button/ButtonWithDisabledTooltip.d.ts.map +1 -1
- package/dist/esm/components/button/Button.js +1 -0
- package/dist/esm/components/button/Button.js.map +1 -1
- package/dist/esm/components/button/ButtonWithDisabledTooltip.js +5 -3
- package/dist/esm/components/button/ButtonWithDisabledTooltip.js.map +1 -1
- package/package.json +3 -3
- package/src/components/button/Button.tsx +2 -1
- package/src/components/button/ButtonWithDisabledTooltip.tsx +6 -2
|
@@ -91,6 +91,7 @@ var _Button = /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) {
|
|
|
91
91
|
disabled: disabled,
|
|
92
92
|
disabledTooltip: disabledTooltip,
|
|
93
93
|
disabledTooltipProps: disabledTooltipProps,
|
|
94
|
+
fullWidth: others.fullWidth,
|
|
94
95
|
children: /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Button, _objectSpread({
|
|
95
96
|
loaderProps: {
|
|
96
97
|
variant: "oval"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef, MouseEvent, MouseEventHandler, useState} 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 fullWidth={others.fullWidth}\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","fullWidth","MantineButton","loaderProps","variant","createPolymorphicComponent","Group"],"mappings":";;;;+BAsDaA;;;eAAAA;;;;;;;;;;oBAtD4D;qBACP;qBAEzB;yCAC+B;AAOxE,IAAMC,oBAAoB,SAACC,SAAmD;IAC1E,IAAkCC,2BAAAA,IAAAA,eAAQ,EAAC,KAAK,OAAzCC,YAA2BD,cAAhBE,eAAgBF;IAElC,IAAMG;mBAAc,kBAAA,SAAOC,OAAyC;gBAC1DC,iBAOGC;;;;wBAPHD,kBAA2BN,oBAAAA,qBAAAA,KAAAA,IAAAA,QAAUK;;;;;;;;;6BAEnCC,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;QACtBK,WAAWF,OAAOE,SAAS;kBAE3B,cAAA,qBAACC,YAAa;YACVC,aAAa;gBAACC,SAAS;YAAM;YAC7BX,KAAKA;YACLI,SAASf,aAAae;YACtBC,SAASd;YACTW,UAAUA;WACNI;;AAIpB;AAGG,IAAMrB,SAAS2B,IAAAA,iCAA0B,EAA6Dd;AAC7Gb,OAAO4B,KAAK,GAAGJ,YAAa,CAACI,KAAK"}
|
|
@@ -16,11 +16,12 @@ var _core = require("@mantine/core");
|
|
|
16
16
|
var _react = require("react");
|
|
17
17
|
var _utils = require("../../utils");
|
|
18
18
|
var _ButtonWithDisabledTooltip = /*#__PURE__*/ (0, _react.forwardRef)(function(_param, ref) {
|
|
19
|
-
var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, children = _param.children, disabledTooltipProps = _param.disabledTooltipProps, others = _objectWithoutProperties(_param, [
|
|
19
|
+
var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, children = _param.children, disabledTooltipProps = _param.disabledTooltipProps, fullWidth = _param.fullWidth, others = _objectWithoutProperties(_param, [
|
|
20
20
|
"disabledTooltip",
|
|
21
21
|
"disabled",
|
|
22
22
|
"children",
|
|
23
|
-
"disabledTooltipProps"
|
|
23
|
+
"disabledTooltipProps",
|
|
24
|
+
"fullWidth"
|
|
24
25
|
]);
|
|
25
26
|
return disabledTooltip ? /*#__PURE__*/ (0, _jsxRuntime.jsx)(_core.Tooltip, _objectSpreadProps(_objectSpread({
|
|
26
27
|
label: disabledTooltip,
|
|
@@ -31,7 +32,8 @@ var _ButtonWithDisabledTooltip = /*#__PURE__*/ (0, _react.forwardRef)(function(_
|
|
|
31
32
|
sx: {
|
|
32
33
|
"&:hover": {
|
|
33
34
|
cursor: "not-allowed"
|
|
34
|
-
}
|
|
35
|
+
},
|
|
36
|
+
width: fullWidth && "100%"
|
|
35
37
|
}
|
|
36
38
|
}, others), {
|
|
37
39
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"sourcesContent":["import {Box, Tooltip, TooltipProps} from '@mantine/core';\nimport {forwardRef, ReactNode} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\n\nexport interface ButtonWithDisabledTooltipProps {\n /**\n * The tooltip message to display when disabled\n */\n disabledTooltip?: string;\n /**\n * Whether the button underneath the tooltip is disabled\n */\n disabled?: boolean;\n children?: ReactNode;\n /**\n * Additional tooltip props to set on the disabled button tooltip\n */\n disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;\n}\n\nconst _ButtonWithDisabledTooltip = forwardRef<HTMLDivElement, ButtonWithDisabledTooltipProps>(\n ({disabledTooltip, disabled, children, disabledTooltipProps, ...others}, ref) =>\n disabledTooltip ? (\n <Tooltip label={disabledTooltip} disabled={!disabled} {...disabledTooltipProps}>\n <Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}}} {...others}>\n {children}\n </Box>\n </Tooltip>\n ) : (\n <>{children}</>\n )\n);\n\nexport const ButtonWithDisabledTooltip = createPolymorphicComponent<'div', ButtonWithDisabledTooltipProps>(\n _ButtonWithDisabledTooltip\n);\n"],"names":["ButtonWithDisabledTooltip","_ButtonWithDisabledTooltip","forwardRef","ref","disabledTooltip","disabled","children","disabledTooltipProps","others","Tooltip","label","Box","sx","cursor","createPolymorphicComponent"],"mappings":";;;;+
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"sourcesContent":["import {Box, Tooltip, TooltipProps} from '@mantine/core';\nimport {forwardRef, ReactNode} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\n\nexport interface ButtonWithDisabledTooltipProps {\n /**\n * The tooltip message to display when disabled\n */\n disabledTooltip?: string;\n /**\n * Whether the button underneath the tooltip is disabled\n */\n disabled?: boolean;\n children?: ReactNode;\n /**\n * Additional tooltip props to set on the disabled button tooltip\n */\n disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;\n /**\n * Sets button width to 100% of parent element\n */\n fullWidth?: boolean;\n}\n\nconst _ButtonWithDisabledTooltip = forwardRef<HTMLDivElement, ButtonWithDisabledTooltipProps>(\n ({disabledTooltip, disabled, children, disabledTooltipProps, fullWidth, ...others}, ref) =>\n disabledTooltip ? (\n <Tooltip label={disabledTooltip} disabled={!disabled} {...disabledTooltipProps}>\n <Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}, width: fullWidth && '100%'}} {...others}>\n {children}\n </Box>\n </Tooltip>\n ) : (\n <>{children}</>\n )\n);\n\nexport const ButtonWithDisabledTooltip = createPolymorphicComponent<'div', ButtonWithDisabledTooltipProps>(\n _ButtonWithDisabledTooltip\n);\n"],"names":["ButtonWithDisabledTooltip","_ButtonWithDisabledTooltip","forwardRef","ref","disabledTooltip","disabled","children","disabledTooltipProps","fullWidth","others","Tooltip","label","Box","sx","cursor","width","createPolymorphicComponent"],"mappings":";;;;+BAsCaA;;;eAAAA;;;;;;;oBAtC4B;qBACL;qBAEK;AAsBzC,IAAMC,2CAA6BC,IAAAA,iBAAU,EACzC,iBAAoFC,KAChFC;QADFA,yBAAAA,iBAAiBC,kBAAAA,UAAUC,kBAAAA,UAAUC,8BAAAA,sBAAsBC,mBAAAA,WAAcC;QAAzEL;QAAiBC;QAAUC;QAAUC;QAAsBC;;WACzDJ,gCACI,qBAACM,aAAO;QAACC,OAAOP;QAAiBC,UAAU,CAACA;OAAcE;kBACtD,cAAA,qBAACK,SAAG;YAACT,KAAKA;YAAKU,IAAI;gBAAC,WAAW;oBAACC,QAAQ;gBAAa;gBAAGC,OAAOP,aAAa;YAAM;WAAOC;sBACpFH;;wBAIT;kBAAGA;MACN;AAAD;AAGD,IAAMN,4BAA4BgB,IAAAA,iCAA0B,EAC/Df"}
|
|
@@ -1 +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;AACzF,OAAO,
|
|
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;AACzF,OAAO,EAAyB,iBAAiB,EAAW,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;AA6CD,eAAO,MAAM,MAAM;;;;;;;WAA6D,OAAO,cAAc,KAAK;CAAW,CAAC"}
|
|
@@ -14,6 +14,10 @@ export interface ButtonWithDisabledTooltipProps {
|
|
|
14
14
|
* Additional tooltip props to set on the disabled button tooltip
|
|
15
15
|
*/
|
|
16
16
|
disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;
|
|
17
|
+
/**
|
|
18
|
+
* Sets button width to 100% of parent element
|
|
19
|
+
*/
|
|
20
|
+
fullWidth?: boolean;
|
|
17
21
|
}
|
|
18
22
|
export declare const ButtonWithDisabledTooltip: (<C = "div">(props: import("@mantine/utils").PolymorphicComponentProps<C, ButtonWithDisabledTooltipProps>) => import("react").ReactElement<any, string | import("react").JSXElementConstructor<any>>) & Omit<import("react").FunctionComponent<(ButtonWithDisabledTooltipProps & {
|
|
19
23
|
component?: any;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"ButtonWithDisabledTooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,YAAY,EAAC,MAAM,eAAe,CAAC;AACzD,OAAO,EAAa,SAAS,EAAC,MAAM,OAAO,CAAC;AAI5C,MAAM,WAAW,8BAA8B;IAC3C;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,oBAAoB,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC;
|
|
1
|
+
{"version":3,"file":"ButtonWithDisabledTooltip.d.ts","sourceRoot":"","sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,YAAY,EAAC,MAAM,eAAe,CAAC;AACzD,OAAO,EAAa,SAAS,EAAC,MAAM,OAAO,CAAC;AAI5C,MAAM,WAAW,8BAA8B;IAC3C;;OAEG;IACH,eAAe,CAAC,EAAE,MAAM,CAAC;IACzB;;OAEG;IACH,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,oBAAoB,CAAC,EAAE,IAAI,CAAC,YAAY,EAAE,UAAU,GAAG,OAAO,GAAG,UAAU,CAAC,CAAC;IAC7E;;OAEG;IACH,SAAS,CAAC,EAAE,OAAO,CAAC;CACvB;AAeD,eAAO,MAAM,yBAAyB;;;;;;mCAErC,CAAC"}
|
|
@@ -81,6 +81,7 @@ var _Button = /*#__PURE__*/ forwardRef(function(_param, ref) {
|
|
|
81
81
|
disabled: disabled,
|
|
82
82
|
disabledTooltip: disabledTooltip,
|
|
83
83
|
disabledTooltipProps: disabledTooltipProps,
|
|
84
|
+
fullWidth: others.fullWidth,
|
|
84
85
|
children: /*#__PURE__*/ _jsx(MantineButton, _object_spread({
|
|
85
86
|
loaderProps: {
|
|
86
87
|
variant: "oval"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef,
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/button/Button.tsx"],"sourcesContent":["import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';\nimport {forwardRef, MouseEvent, MouseEventHandler, useState} 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 fullWidth={others.fullWidth}\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","fullWidth","loaderProps","variant","Group"],"mappings":";;;;;;;AAAA,SAAQA,UAAUC,aAAa,QAA0C,gBAAgB;AACzF,SAAQC,UAAU,EAAiCC,QAAQ,QAAO,QAAQ;AAE1E,SAAQC,0BAA0B,QAAO,cAAc;AACvD,SAAQC,yBAAyB,QAAuC,8BAA8B;AAOtG,IAAMC,oBAAoB,SAACC,SAAmD;IAC1E,IAAkCJ,6BAAAA,SAAS,KAAK,OAAzCK,YAA2BL,cAAhBM,eAAgBN;IAElC,IAAMO;mBAAc,oBAAA,SAAOC,OAAyC;gBAC1DC,iBAOGC;;;;wBAPHD,kBAA2BL,oBAAAA,qBAAAA,KAAAA,IAAAA,QAAUI;;;;;;;;;6BAEnCC,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;QACtBI,WAAWD,OAAOC,SAAS;kBAE3B,cAAA,KAACxB;YACGyB,aAAa;gBAACC,SAAS;YAAM;YAC7BT,KAAKA;YACLI,SAASd,aAAac;YACtBC,SAASb;YACTU,UAAUA;WACNI;;AAIpB;AAGJ,OAAO,IAAMxB,SAASI,2BAAuFa,SAAS;AACtHjB,OAAO4B,KAAK,GAAG3B,cAAc2B,KAAK"}
|
|
@@ -6,11 +6,12 @@ import { Box, Tooltip } from "@mantine/core";
|
|
|
6
6
|
import { forwardRef } from "react";
|
|
7
7
|
import { createPolymorphicComponent } from "../../utils";
|
|
8
8
|
var _ButtonWithDisabledTooltip = /*#__PURE__*/ forwardRef(function(_param, ref) {
|
|
9
|
-
var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, children = _param.children, disabledTooltipProps = _param.disabledTooltipProps, others = _object_without_properties(_param, [
|
|
9
|
+
var disabledTooltip = _param.disabledTooltip, disabled = _param.disabled, children = _param.children, disabledTooltipProps = _param.disabledTooltipProps, fullWidth = _param.fullWidth, others = _object_without_properties(_param, [
|
|
10
10
|
"disabledTooltip",
|
|
11
11
|
"disabled",
|
|
12
12
|
"children",
|
|
13
|
-
"disabledTooltipProps"
|
|
13
|
+
"disabledTooltipProps",
|
|
14
|
+
"fullWidth"
|
|
14
15
|
]);
|
|
15
16
|
return disabledTooltip ? /*#__PURE__*/ _jsx(Tooltip, _object_spread_props(_object_spread({
|
|
16
17
|
label: disabledTooltip,
|
|
@@ -21,7 +22,8 @@ var _ButtonWithDisabledTooltip = /*#__PURE__*/ forwardRef(function(_param, ref)
|
|
|
21
22
|
sx: {
|
|
22
23
|
"&:hover": {
|
|
23
24
|
cursor: "not-allowed"
|
|
24
|
-
}
|
|
25
|
+
},
|
|
26
|
+
width: fullWidth && "100%"
|
|
25
27
|
}
|
|
26
28
|
}, others), {
|
|
27
29
|
children: children
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"sourcesContent":["import {Box, Tooltip, TooltipProps} from '@mantine/core';\nimport {forwardRef, ReactNode} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\n\nexport interface ButtonWithDisabledTooltipProps {\n /**\n * The tooltip message to display when disabled\n */\n disabledTooltip?: string;\n /**\n * Whether the button underneath the tooltip is disabled\n */\n disabled?: boolean;\n children?: ReactNode;\n /**\n * Additional tooltip props to set on the disabled button tooltip\n */\n disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;\n}\n\nconst _ButtonWithDisabledTooltip = forwardRef<HTMLDivElement, ButtonWithDisabledTooltipProps>(\n ({disabledTooltip, disabled, children, disabledTooltipProps, ...others}, ref) =>\n disabledTooltip ? (\n <Tooltip label={disabledTooltip} disabled={!disabled} {...disabledTooltipProps}>\n <Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}}} {...others}>\n {children}\n </Box>\n </Tooltip>\n ) : (\n <>{children}</>\n )\n);\n\nexport const ButtonWithDisabledTooltip = createPolymorphicComponent<'div', ButtonWithDisabledTooltipProps>(\n _ButtonWithDisabledTooltip\n);\n"],"names":["Box","Tooltip","forwardRef","createPolymorphicComponent","_ButtonWithDisabledTooltip","ref","disabledTooltip","disabled","children","disabledTooltipProps","others","label","sx","cursor","ButtonWithDisabledTooltip"],"mappings":";;;;AAAA,SAAQA,GAAG,EAAEC,OAAO,QAAqB,gBAAgB;AACzD,SAAQC,UAAU,QAAkB,QAAQ;AAE5C,SAAQC,0BAA0B,QAAO,cAAc;
|
|
1
|
+
{"version":3,"sources":["../../../../src/components/button/ButtonWithDisabledTooltip.tsx"],"sourcesContent":["import {Box, Tooltip, TooltipProps} from '@mantine/core';\nimport {forwardRef, ReactNode} from 'react';\n\nimport {createPolymorphicComponent} from '../../utils';\n\nexport interface ButtonWithDisabledTooltipProps {\n /**\n * The tooltip message to display when disabled\n */\n disabledTooltip?: string;\n /**\n * Whether the button underneath the tooltip is disabled\n */\n disabled?: boolean;\n children?: ReactNode;\n /**\n * Additional tooltip props to set on the disabled button tooltip\n */\n disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;\n /**\n * Sets button width to 100% of parent element\n */\n fullWidth?: boolean;\n}\n\nconst _ButtonWithDisabledTooltip = forwardRef<HTMLDivElement, ButtonWithDisabledTooltipProps>(\n ({disabledTooltip, disabled, children, disabledTooltipProps, fullWidth, ...others}, ref) =>\n disabledTooltip ? (\n <Tooltip label={disabledTooltip} disabled={!disabled} {...disabledTooltipProps}>\n <Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}, width: fullWidth && '100%'}} {...others}>\n {children}\n </Box>\n </Tooltip>\n ) : (\n <>{children}</>\n )\n);\n\nexport const ButtonWithDisabledTooltip = createPolymorphicComponent<'div', ButtonWithDisabledTooltipProps>(\n _ButtonWithDisabledTooltip\n);\n"],"names":["Box","Tooltip","forwardRef","createPolymorphicComponent","_ButtonWithDisabledTooltip","ref","disabledTooltip","disabled","children","disabledTooltipProps","fullWidth","others","label","sx","cursor","width","ButtonWithDisabledTooltip"],"mappings":";;;;AAAA,SAAQA,GAAG,EAAEC,OAAO,QAAqB,gBAAgB;AACzD,SAAQC,UAAU,QAAkB,QAAQ;AAE5C,SAAQC,0BAA0B,QAAO,cAAc;AAsBvD,IAAMC,2CAA6BF,WAC/B,iBAAoFG,KAChFC;QADFA,yBAAAA,iBAAiBC,kBAAAA,UAAUC,kBAAAA,UAAUC,8BAAAA,sBAAsBC,mBAAAA,WAAcC;QAAzEL;QAAiBC;QAAUC;QAAUC;QAAsBC;;WACzDJ,gCACI,KAACL;QAAQW,OAAON;QAAiBC,UAAU,CAACA;OAAcE;kBACtD,cAAA,KAACT;YAAIK,KAAKA;YAAKQ,IAAI;gBAAC,WAAW;oBAACC,QAAQ;gBAAa;gBAAGC,OAAOL,aAAa;YAAM;WAAOC;sBACpFH;;wBAIT;kBAAGA;MACN;AAAD;AAGR,OAAO,IAAMQ,4BAA4Bb,2BACrCC,4BACF"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@coveord/plasma-mantine",
|
|
3
|
-
"version": "51.1.
|
|
3
|
+
"version": "51.1.2",
|
|
4
4
|
"description": "A Plasma flavoured Mantine theme",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"plasma",
|
|
@@ -25,7 +25,7 @@
|
|
|
25
25
|
"lodash.defaultsdeep": "4.6.1",
|
|
26
26
|
"monaco-editor": "0.34.0",
|
|
27
27
|
"react-beautiful-dnd": "13.1.1",
|
|
28
|
-
"@coveord/plasma-react-icons": "
|
|
28
|
+
"@coveord/plasma-react-icons": "51.1.2",
|
|
29
29
|
"@coveord/plasma-tokens": "50.0.2"
|
|
30
30
|
},
|
|
31
31
|
"devDependencies": {
|
|
@@ -38,7 +38,7 @@
|
|
|
38
38
|
"@mantine/modals": "6.0.1",
|
|
39
39
|
"@mantine/notifications": "6.0.1",
|
|
40
40
|
"@swc/cli": "0.1.62",
|
|
41
|
-
"@swc/core": "1.3.
|
|
41
|
+
"@swc/core": "1.3.37",
|
|
42
42
|
"@swc/jest": "0.2.24",
|
|
43
43
|
"@testing-library/dom": "8.18.1",
|
|
44
44
|
"@testing-library/jest-dom": "5.16.5",
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import {Button as MantineButton, ButtonProps as MantineButtonProps} from '@mantine/core';
|
|
2
|
-
import {forwardRef,
|
|
2
|
+
import {forwardRef, MouseEvent, MouseEventHandler, useState} from 'react';
|
|
3
3
|
|
|
4
4
|
import {createPolymorphicComponent} from '../../utils';
|
|
5
5
|
import {ButtonWithDisabledTooltip, ButtonWithDisabledTooltipProps} from './ButtonWithDisabledTooltip';
|
|
@@ -37,6 +37,7 @@ const _Button = forwardRef<HTMLButtonElement, ButtonProps>(
|
|
|
37
37
|
disabled={disabled}
|
|
38
38
|
disabledTooltip={disabledTooltip}
|
|
39
39
|
disabledTooltipProps={disabledTooltipProps}
|
|
40
|
+
fullWidth={others.fullWidth}
|
|
40
41
|
>
|
|
41
42
|
<MantineButton
|
|
42
43
|
loaderProps={{variant: 'oval'}}
|
|
@@ -17,13 +17,17 @@ export interface ButtonWithDisabledTooltipProps {
|
|
|
17
17
|
* Additional tooltip props to set on the disabled button tooltip
|
|
18
18
|
*/
|
|
19
19
|
disabledTooltipProps?: Omit<TooltipProps, 'disabled' | 'label' | 'children'>;
|
|
20
|
+
/**
|
|
21
|
+
* Sets button width to 100% of parent element
|
|
22
|
+
*/
|
|
23
|
+
fullWidth?: boolean;
|
|
20
24
|
}
|
|
21
25
|
|
|
22
26
|
const _ButtonWithDisabledTooltip = forwardRef<HTMLDivElement, ButtonWithDisabledTooltipProps>(
|
|
23
|
-
({disabledTooltip, disabled, children, disabledTooltipProps, ...others}, ref) =>
|
|
27
|
+
({disabledTooltip, disabled, children, disabledTooltipProps, fullWidth, ...others}, ref) =>
|
|
24
28
|
disabledTooltip ? (
|
|
25
29
|
<Tooltip label={disabledTooltip} disabled={!disabled} {...disabledTooltipProps}>
|
|
26
|
-
<Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}}} {...others}>
|
|
30
|
+
<Box ref={ref} sx={{'&:hover': {cursor: 'not-allowed'}, width: fullWidth && '100%'}} {...others}>
|
|
27
31
|
{children}
|
|
28
32
|
</Box>
|
|
29
33
|
</Tooltip>
|