@adamjanicki/ui 1.7.7 → 1.7.8
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.
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { type BoxProps } from "../Box/Box";
|
|
3
|
+
import Button from "../Button";
|
|
4
|
+
type ButtonProps = Omit<React.ComponentProps<typeof Button>, "children" | "onClick">;
|
|
3
5
|
type Props = BoxProps & {
|
|
4
6
|
/**
|
|
5
7
|
* Callback that fires when the user clicks the Ok button in the modal
|
|
@@ -15,6 +17,14 @@ type Props = BoxProps & {
|
|
|
15
17
|
* @default "Cancel"
|
|
16
18
|
*/
|
|
17
19
|
cancelLabel?: React.ReactNode;
|
|
20
|
+
/**
|
|
21
|
+
* Props to pass to the confirm button
|
|
22
|
+
*/
|
|
23
|
+
confirmButtonProps?: ButtonProps;
|
|
24
|
+
/**
|
|
25
|
+
* Props to pass to the cancel button
|
|
26
|
+
*/
|
|
27
|
+
cancelButtonProps?: ButtonProps;
|
|
18
28
|
/**
|
|
19
29
|
* Whether the modal is open or not
|
|
20
30
|
*/
|
|
@@ -27,7 +27,7 @@ import Layer from "../Layer";
|
|
|
27
27
|
import Button, { IconButton } from "../Button";
|
|
28
28
|
import Animated from "../Animated";
|
|
29
29
|
var Modal = React.forwardRef(function (_a, ref) {
|
|
30
|
-
var open = _a.open, onClose = _a.onClose, onConfirm = _a.onConfirm, _b = _a.confirmLabel, confirmLabel = _b === void 0 ? "Ok" : _b, _c = _a.cancelLabel, cancelLabel = _c === void 0 ? "Cancel" : _c, returnFocusOnEscape = _a.returnFocusOnEscape, rest = __rest(_a, ["open", "onClose", "onConfirm", "confirmLabel", "cancelLabel", "returnFocusOnEscape"]);
|
|
30
|
+
var open = _a.open, onClose = _a.onClose, onConfirm = _a.onConfirm, confirmButtonProps = _a.confirmButtonProps, cancelButtonProps = _a.cancelButtonProps, _b = _a.confirmLabel, confirmLabel = _b === void 0 ? "Ok" : _b, _c = _a.cancelLabel, cancelLabel = _c === void 0 ? "Cancel" : _c, returnFocusOnEscape = _a.returnFocusOnEscape, rest = __rest(_a, ["open", "onClose", "onConfirm", "confirmButtonProps", "cancelButtonProps", "confirmLabel", "cancelLabel", "returnFocusOnEscape"]);
|
|
31
31
|
return (_jsx(Animated, { vfx: { z: "max" }, visible: open, animateTo: { vfx: { opacity: "full" } }, animateFrom: { vfx: { opacity: "none" } }, children: _jsx(Layer, { onClose: onClose, returnFocusOnEscape: returnFocusOnEscape, children: _jsxs(Box, { role: "dialog", "aria-modal": "true", vfx: {
|
|
32
32
|
axis: "y",
|
|
33
33
|
padding: "m",
|
|
@@ -49,9 +49,9 @@ var Modal = React.forwardRef(function (_a, ref) {
|
|
|
49
49
|
justify: "end",
|
|
50
50
|
width: "full",
|
|
51
51
|
gap: "m",
|
|
52
|
-
}, children: [_jsx(Button, { variant: "secondary", onClick: onClose, children: cancelLabel }), _jsx(Button, { onClick: function () {
|
|
52
|
+
}, children: [_jsx(Button, __assign({ variant: "secondary" }, cancelButtonProps, { onClick: onClose, children: cancelLabel })), _jsx(Button, __assign({}, confirmButtonProps, { onClick: function () {
|
|
53
53
|
onConfirm();
|
|
54
54
|
onClose();
|
|
55
|
-
}, children: confirmLabel })] })] }) }) }));
|
|
55
|
+
}, children: confirmLabel }))] })] }) }) }));
|
|
56
56
|
});
|
|
57
57
|
export default Modal;
|