@homebound/beam 2.186.4 → 2.186.5
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.
|
@@ -33,7 +33,7 @@ function Modal(props) {
|
|
|
33
33
|
isDismissable: true,
|
|
34
34
|
shouldCloseOnInteractOutside: (el) => {
|
|
35
35
|
// Do not close the Modal if the user is interacting with the Tribute mentions dropdown (via RichTextField) or with another 3rd party dialog (such as a lightbox) on top of it.
|
|
36
|
-
return !(el.closest(".tribute-container") || el.closest("[role='dialog']"));
|
|
36
|
+
return !(el.closest(".tribute-container") || el.closest("[role='dialog']") || el.closest("[role='alert']"));
|
|
37
37
|
},
|
|
38
38
|
}, ref);
|
|
39
39
|
const { modalProps } = (0, react_aria_1.useModal)();
|
|
@@ -8,6 +8,7 @@ const Button_1 = require("../Button");
|
|
|
8
8
|
const Layout_1 = require("../Layout");
|
|
9
9
|
const Modal_1 = require("./Modal");
|
|
10
10
|
const useModal_1 = require("./useModal");
|
|
11
|
+
const Snackbar_1 = require("../Snackbar");
|
|
11
12
|
const Table_1 = require("../Table");
|
|
12
13
|
const Tag_1 = require("../Tag");
|
|
13
14
|
const Css_1 = require("../../Css");
|
|
@@ -22,7 +23,8 @@ function TestModalContent(props) {
|
|
|
22
23
|
const [leftActionDisabled, setLeftActionDisabled] = (0, react_1.useState)(false);
|
|
23
24
|
const [date, setDate] = (0, react_1.useState)(formStateDomain_1.jan1);
|
|
24
25
|
const [internalValue, setValue] = (0, react_1.useState)("");
|
|
25
|
-
|
|
26
|
+
const { triggerNotice } = (0, Snackbar_1.useSnackbar)();
|
|
27
|
+
return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(Modal_1.ModalHeader, { children: props.withTag ? ((0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.aic.$ }, { children: [(0, jsx_runtime_1.jsx)("span", { children: "Modal Title with Tag" }, void 0), (0, jsx_runtime_1.jsx)(Tag_1.Tag, { text: "In progress", type: "info", xss: Css_1.Css.ml1.$ }, void 0)] }), void 0)) : props.withTextArea ? ((0, jsx_runtime_1.jsx)(inputs_1.TextAreaField, { label: "Title", placeholder: "Test title", value: internalValue, onChange: (v) => setValue(v), preventNewLines: true, hideLabel: true, borderless: true, xss: Css_1.Css.xl.$ }, void 0)) : ("The title of the modal that might wrap") }, void 0), (0, jsx_runtime_1.jsxs)(Modal_1.ModalBody, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.gap1.fdc.aifs.$ }, { children: [(0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.gap1.$ }, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { label: "More", onClick: () => setNumSentences(numSentences + 2) }, void 0), (0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Clear", onClick: () => setNumSentences(0) }, void 0), (0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Primary", onClick: () => setPrimaryDisabled(!primaryDisabled) }, void 0), (0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Trigger Snackbar", onClick: () => triggerNotice({ message: "Snackbar message" }) }, void 0), showLeftAction && ((0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Left Action", onClick: () => setLeftActionDisabled(!leftActionDisabled) }, void 0))] }), void 0), (0, jsx_runtime_1.jsx)("p", { children: "The body content of the modal. This content can be anything!".repeat(numSentences) }, void 0)] }), void 0), withDateField && (0, jsx_runtime_1.jsx)(inputs_1.DateField, { value: date, label: "Date", onChange: setDate }, void 0)] }, void 0), (0, jsx_runtime_1.jsxs)(Modal_1.ModalFooter, Object.assign({ xss: showLeftAction ? Css_1.Css.jcsb.$ : undefined }, { children: [showLeftAction && ((0, jsx_runtime_1.jsx)("div", { children: (0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Clear", onClick: (0, addon_actions_1.action)("Clear Action"), variant: "tertiary", disabled: leftActionDisabled }, void 0) }, void 0)), (0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.df.gap1.$ }, { children: [(0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Cancel", onClick: closeModal, variant: "tertiary" }, void 0), (0, jsx_runtime_1.jsx)(Button_1.Button, { label: "Apply", onClick: (0, addon_actions_1.action)("Primary action"), disabled: primaryDisabled }, void 0)] }), void 0)] }), void 0)] }, void 0));
|
|
26
28
|
}
|
|
27
29
|
exports.TestModalContent = TestModalContent;
|
|
28
30
|
function TestModalFilterTable() {
|
|
@@ -12,7 +12,7 @@ function SnackbarNotice(props) {
|
|
|
12
12
|
const tid = (0, utils_1.useTestIds)(props, "snackbar");
|
|
13
13
|
// Only allow the "close" button to be hidden if not a `persistent` notice. Otherwise we could get in a state where the user cannot remove the notice from the screen.
|
|
14
14
|
const reallyHideClose = hideCloseButton && !persistent;
|
|
15
|
-
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.white.bgGray800.br4.base.df.aic.maxwPx(420).$ }, tid, { children: [icon && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.fs0.plPx(12).$ }, { children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, Object.assign({ icon: typeToIcon[icon] }, tid.icon), void 0) }), void 0)), (0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.lineClamp3.pr2.myPx(12).plPx(icon ? 8 : 16).$ }, (typeof message === "string" ? { title: message } : undefined), tid.message, { children: message }), void 0), (action || !reallyHideClose) && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ css: Css_1.Css.fs0.df.aic.$ }, { children: [action && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.ttu.sm.prPx(!reallyHideClose && action.variant !== "text" ? 4 : 8).$ }, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, Object.assign({ contrast: true }, action, tid.action), void 0) }), void 0)), !reallyHideClose && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.pr1.add("lineHeight", 0).$ }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, Object.assign({ icon: "x", contrast: true, onClick: onClose }, tid.close), void 0) }), void 0))] }), void 0))] }), void 0));
|
|
15
|
+
return ((0, jsx_runtime_1.jsxs)("div", Object.assign({ css: Css_1.Css.white.bgGray800.br4.base.df.aic.maxwPx(420).$ }, tid, { role: "alert" }, { children: [icon && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.fs0.plPx(12).$ }, { children: (0, jsx_runtime_1.jsx)(Icon_1.Icon, Object.assign({ icon: typeToIcon[icon] }, tid.icon), void 0) }), void 0)), (0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.lineClamp3.pr2.myPx(12).plPx(icon ? 8 : 16).$ }, (typeof message === "string" ? { title: message } : undefined), tid.message, { children: message }), void 0), (action || !reallyHideClose) && ((0, jsx_runtime_1.jsxs)("span", Object.assign({ css: Css_1.Css.fs0.df.aic.$ }, { children: [action && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.ttu.sm.prPx(!reallyHideClose && action.variant !== "text" ? 4 : 8).$ }, { children: (0, jsx_runtime_1.jsx)(Button_1.Button, Object.assign({ contrast: true }, action, tid.action), void 0) }), void 0)), !reallyHideClose && ((0, jsx_runtime_1.jsx)("span", Object.assign({ css: Css_1.Css.pr1.add("lineHeight", 0).$ }, { children: (0, jsx_runtime_1.jsx)(IconButton_1.IconButton, Object.assign({ icon: "x", contrast: true, onClick: onClose }, tid.close), void 0) }), void 0))] }), void 0))] }), void 0));
|
|
16
16
|
}
|
|
17
17
|
exports.SnackbarNotice = SnackbarNotice;
|
|
18
18
|
const typeToIcon = {
|
|
@@ -610,11 +610,6 @@ const MemoizedGridRow = react_1.default.memo((0, mobx_react_1.observer)(GridRow)
|
|
|
610
610
|
const { row: row2, ...others2 } = two;
|
|
611
611
|
return (0, shallowEqual_1.shallowEqual)(row1, row2) && (0, shallowEqual_1.shallowEqual)(others1, others2);
|
|
612
612
|
});
|
|
613
|
-
/** Wraps a mobx Observer around the row's rendering/evaluation, so that it will be reactive. */
|
|
614
|
-
const ObservedGridRow = react_1.default.memo((props) => ((0, jsx_runtime_1.jsx)(mobx_react_1.Observer, { children: () => {
|
|
615
|
-
// Invoke this just as a regular function so that Observer sees the proxy access's
|
|
616
|
-
return GridRow(props);
|
|
617
|
-
} }, void 0)));
|
|
618
613
|
/** A heuristic to detect the result of `React.createElement` / i.e. JSX. */
|
|
619
614
|
function isJSX(content) {
|
|
620
615
|
return typeof content === "object" && content && "type" in content && "props" in content;
|