npm - @phillips/seldon - Versions diffs - 1.176.0 → 1.177.0 - Mend

@phillips/seldon 1.176.0 → 1.177.0

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.

Files changed (8) hide show

package/dist/components/ComboBox/ComboBox.d.ts +5 -0
package/dist/components/ComboBox/ComboBox.js +132 -130
package/dist/components/ComboBox/ComboBox.stories.d.ts +7 -0
package/dist/components/Drawer/Drawer.js +36 -36
package/dist/components/Modal/Modal.js +30 -30
package/dist/components/Toast/useToast.js +11 -7
package/dist/scss/components/ComboBox/_combobox.scss +4 -0
package/package.json +1 -1

package/dist/components/ComboBox/ComboBox.d.ts CHANGED Viewed

@@ -80,6 +80,11 @@ export interface ComboBoxProps {
      * Handler called when the combobox loses focus
      */
     onBlur?: React.FocusEventHandler<HTMLDivElement>;
+    /**
+     * Number of characters required in the input before the dropdown options are shown.
+     * @default 0
+     */
+    countOfCharsBeforeDropdown?: number;
 }
 /**
  * ## Overview

package/dist/components/ComboBox/ComboBox.js CHANGED Viewed

@@ -1,9 +1,9 @@
-import { jsxs as T, jsx as o } from "react/jsx-runtime";
-import { Root as dt, Trigger as ht, Portal as _t, Content as vt } from "../../node_modules/@radix-ui/react-popover/dist/index.js";
+import { jsxs as x, jsx as i } from "react/jsx-runtime";
+import { Root as ht, Trigger as _t, Portal as vt, Content as $t } from "../../node_modules/@radix-ui/react-popover/dist/index.js";
 import d from "../../node_modules/classnames/index.js";
-import { Command as $t, CommandInput as yt, CommandList as wt, CommandGroup as Ct, CommandItem as bt } from "../../node_modules/cmdk/dist/index.js";
-import gt, { useState as S, useCallback as b, useRef as k, useMemo as x } from "react";
-import { useOnClickOutside as Nt } from "../../node_modules/usehooks-ts/dist/index.js";
+import { Command as yt, CommandInput as Ct, CommandList as bt, CommandGroup as wt, CommandItem as gt } from "../../node_modules/cmdk/dist/index.js";
+import Nt, { useState as S, useCallback as g, useRef as O, useMemo as V } from "react";
+import { useOnClickOutside as It } from "../../node_modules/usehooks-ts/dist/index.js";
 import "../../assets/formatted/AccountActive.js";
 import "../../assets/formatted/Account.js";
 import "../../assets/formatted/Add.js";
@@ -29,11 +29,11 @@ import "../../assets/formatted/ArrowRight.js";
 import "../../assets/formatted/ArrowUp.js";
 import "../../assets/formatted/Bag.js";
 import "../../assets/formatted/Calendar.js";
-import It from "../../assets/formatted/ChevronDown.js";
+import Tt from "../../assets/formatted/ChevronDown.js";
 import "../../assets/formatted/ChevronLeft.js";
 import "../../assets/formatted/ChevronRight.js";
 import "../../assets/formatted/ChevronUp.js";
-import Ot from "../../assets/formatted/CloseX.js";
+import kt from "../../assets/formatted/CloseX.js";
 import "../../assets/formatted/ConditionReport.js";
 import "../../assets/formatted/Delete.js";
 import "../../assets/formatted/Download.js";
@@ -83,133 +83,135 @@ import "../../assets/formatted/VolumeMaximum.js";
 import "../../assets/formatted/VolumeMid.js";
 import "../../assets/formatted/VolumeMinimum.js";
 import "../../assets/formatted/WeChat.js";
-import { getCommonProps as Tt, useNormalizedInputProps as kt } from "../../utils/index.js";
-import X from "../IconButton/IconButton.js";
-import { ButtonVariants as H } from "../Button/types.js";
-import { usePrevious as xt } from "../../utils/usePrevious.js";
-const Vt = gt.forwardRef(function({
+import { getCommonProps as xt, useNormalizedInputProps as Ot } from "../../utils/index.js";
+import H from "../IconButton/IconButton.js";
+import { ButtonVariants as J } from "../Button/types.js";
+import { usePrevious as Vt } from "../../utils/usePrevious.js";
+const Dt = Nt.forwardRef(function({
   options: a = [],
-  className: J,
-  id: i,
-  labelText: Q,
-  placeholder: Y,
-  name: V,
+  className: Q,
+  id: l,
+  labelText: Y,
+  placeholder: Z,
+  name: D,
   value: p,
   onChange: u,
-  onBlur: Z,
+  onBlur: tt,
   renderOption: j,
-  ariaLabelDropdown: g,
+  ariaLabelDropdown: N,
   ariaLabelInput: q,
-  ariaLabelClear: N,
+  ariaLabelClear: I,
   ariaLabelContent: z,
-  hideLabel: tt = !1,
-  popoverContainerRef: et,
-  noOptionsMessage: rt = "No Options.",
-  invalid: I = !1,
-  invalidText: ot,
-  ...it
-}, D) {
-  const { className: e, ...st } = Tt({ id: i }, "ComboBox"), lt = It, nt = Ot, G = kt({
-    id: i,
-    invalid: I,
-    invalidText: ot,
+  hideLabel: et = !1,
+  popoverContainerRef: rt,
+  noOptionsMessage: ot = "No Options.",
+  invalid: T = !1,
+  invalidText: it,
+  countOfCharsBeforeDropdown: G = 0,
+  ...lt
+}, M) {
+  const { className: e, ...st } = xt({ id: l }, "ComboBox"), nt = Tt, at = kt, K = Ot({
+    id: l,
+    invalid: T,
+    invalidText: it,
     type: "text"
-  }), [f, K] = S(!1), [at, mt] = S(""), U = xt(p), R = b((t) => t.label || t.value, []), [s, $] = S(() => {
+  }), [f, U] = S(!1), [mt, ct] = S(""), W = Vt(p), R = g((t) => t.label || t.value, []), [o, $] = S(() => {
     if (p !== void 0) {
       const t = a.find((r) => r.value === p);
       return t ? t.displayValue || R(t) : "";
     }
     return "";
-  }), y = k(null), w = k(null), C = k(!1), E = k(null), m = b((t) => R(t), [R]), h = p !== void 0, F = h ? p : at, l = x(() => a.find((t) => t.value === F) || null, [a, F]), _ = x(() => l ? l.displayValue || m(l) : "", [l, m]), c = x(() => {
-    if (!s || l && s === _)
+  }), y = O(null), C = O(null), b = O(!1), E = O(null), m = g((t) => R(t), [R]), h = p !== void 0, F = h ? p : mt, s = V(() => a.find((t) => t.value === F) || null, [a, F]), _ = V(() => s ? s.displayValue || m(s) : "", [s, m]), c = V(() => {
+    if (!o || s && o === _)
       return a;
-    const t = s.toLowerCase().trim();
+    const t = o.toLowerCase().trim();
     return a.filter((r) => {
-      const B = m(r).toLowerCase().includes(t), L = r.value.toLowerCase().includes(t), A = r.displayValue?.toLowerCase().includes(t) || !1;
+      const w = m(r).toLowerCase().includes(t), A = r.value.toLowerCase().includes(t), B = r.displayValue?.toLowerCase().includes(t) || !1;
       let v = !1;
-      return r.filterTerms && r.filterTerms.length > 0 && (v = r.filterTerms.some((ft) => ft.toLowerCase().includes(t))), B || L || A || v;
+      return r.filterTerms && r.filterTerms.length > 0 && (v = r.filterTerms.some((dt) => dt.toLowerCase().includes(t))), w || A || B || v;
     });
-  }, [s, _, l, m, a]), n = b(
-    (t) => {
-      K(t), t && l && c.length > 5 && requestAnimationFrame(() => {
+  }, [o, _, s, m, a]), n = g(
+    (t, r) => {
+      const w = (r?.length || o.length) >= G;
+      (!t || t && w) && U(t), t && s && c.length > 5 && requestAnimationFrame(() => {
         E.current && E.current.scrollIntoView({
           block: "nearest",
           behavior: "auto"
         });
       });
     },
-    [l, c.length]
-  ), O = b(
+    [G, o.length, s, c.length]
+  ), k = g(
     (t) => {
-      h || mt(t.value);
+      h || ct(t.value);
       const r = t.displayValue || m(t);
-      $(r), u && u(t.value, t), n(!1), C.current = !0, requestAnimationFrame(() => {
-        C.current = !1;
+      $(r), u && u(t.value, t), n(!1), b.current = !0, requestAnimationFrame(() => {
+        b.current = !1;
       });
     },
     [h, u, n, m]
-  ), ct = (t) => {
-    n(!1), C.current = !0, t.preventDefault(), t.stopPropagation(), u && h && u("", null), $(""), w.current?.focus(), requestAnimationFrame(() => {
-      C.current = !1;
+  ), pt = (t) => {
+    n(!1), b.current = !0, t.preventDefault(), t.stopPropagation(), u && h && u("", null), $(""), C.current?.focus(), requestAnimationFrame(() => {
+      b.current = !1;
     });
-  }, pt = () => {
-    K(!f), w.current?.focus();
-  }, ut = (t) => {
-    $(t), t !== "" && c.length > 0 && n(!0);
-  }, W = x(() => {
+  }, ut = () => {
+    U(!f), C.current?.focus();
+  }, ft = (t) => {
+    $(t), t !== "" && c.length > 0 && n(!0, t);
+  }, X = V(() => {
     if (h) {
-      if (p !== U)
-        return l ? _ : s;
-      if (l) {
+      if (p !== W)
+        return s ? _ : o;
+      if (s) {
         const t = _;
-        return t !== s ? s : t;
+        return t !== o ? o : t;
       } else
-        return s;
+        return o;
     }
-    return s;
-  }, [h, s, p, U, l, _]), M = (t) => {
-    if (l) {
+    return o;
+  }, [h, o, p, W, s, _]), P = (t) => {
+    if (s) {
       const r = _;
-      r !== W && !t && $(r);
+      r !== X && !t && $(r);
     } else
       $("");
-  }, P = b(() => {
+  }, L = g(() => {
     const t = a.filter((r) => {
-      const B = m(r).toLowerCase(), L = r.value.toLowerCase(), A = r.displayValue?.toLowerCase(), v = s.toLowerCase();
-      return B === v || L === v || A === v;
+      const w = m(r).toLowerCase(), A = r.value.toLowerCase(), B = r.displayValue?.toLowerCase(), v = o.toLowerCase();
+      return w === v || A === v || B === v;
     });
-    t.length === 1 && O(t[0]);
-  }, [s, a, O, m]);
-  return Nt(y, (t) => {
-    t.target.closest(`.${e}__item`) || t.target.closest(`.${e}__content`) || y.current?.contains(t.target) || t.target === y.current || (P(), M(), n(!1));
-  }), /* @__PURE__ */ T("div", { ref: D, className: d(e, J), id: i, ...st, ...it, children: [
-    V && /* @__PURE__ */ o(
+    t.length === 1 && k(t[0]);
+  }, [o, a, k, m]);
+  return It(y, (t) => {
+    t.target.closest(`.${e}__item`) || t.target.closest(`.${e}__content`) || y.current?.contains(t.target) || t.target === y.current || (L(), P(), n(!1));
+  }), /* @__PURE__ */ x("div", { ref: M, className: d(e, Q), id: l, ...st, ...lt, children: [
+    D && /* @__PURE__ */ i(
       "input",
       {
         type: "hidden",
-        name: V,
-        id: V,
+        name: D,
+        id: D,
         value: F || "",
         ref: (t) => {
-          typeof D == "function" && t && D(t);
+          typeof M == "function" && t && M(t);
         }
       }
     ),
-    /* @__PURE__ */ T("div", { ref: y, className: `${e}__wrapper`, children: [
-      /* @__PURE__ */ o(
+    /* @__PURE__ */ x("div", { ref: y, className: `${e}__wrapper`, children: [
+      /* @__PURE__ */ i(
         "label",
         {
-          htmlFor: `${i}-input`,
+          htmlFor: `${l}-input`,
           className: d(`${e}__label`, {
-            [`${e}__label--hidden`]: tt,
-            [`${e}__label--invalid`]: I
+            [`${e}__label--hidden`]: et,
+            [`${e}__label--invalid`]: T
           }),
-          "data-testid": `${i}-label`,
-          children: Q
+          "data-testid": `${l}-label`,
+          children: Y
         }
       ),
-      /* @__PURE__ */ o(
-        $t,
+      /* @__PURE__ */ i(
+        yt,
         {
           loop: !0,
           onKeyDown: (t) => {
@@ -219,80 +221,80 @@ const Vt = gt.forwardRef(function({
           },
           shouldFilter: !1,
           className: `${e}__command-wrapper`,
-          children: /* @__PURE__ */ T(dt, { open: f, modal: !1, children: [
-            /* @__PURE__ */ o(ht, { asChild: !0, children: /* @__PURE__ */ T(
+          children: /* @__PURE__ */ x(ht, { open: f, modal: !1, children: [
+            /* @__PURE__ */ i(_t, { asChild: !0, children: /* @__PURE__ */ x(
               "div",
               {
                 className: d(`${e}__input-wrapper`, {
-                  [`${e}__input-wrapper--invalid`]: I
+                  [`${e}__input-wrapper--invalid`]: T
                 }),
                 children: [
-                  /* @__PURE__ */ o(
-                    yt,
+                  /* @__PURE__ */ i(
+                    Ct,
                     {
-                      id: `${i}-input`,
-                      placeholder: Y,
-                      value: W,
-                      onValueChange: ut,
+                      id: `${l}-input`,
+                      placeholder: Z,
+                      value: X,
+                      onValueChange: ft,
                       tabIndex: 0,
                       onFocus: () => {
-                        c.length > 0 && !C.current && !f && n(!0);
+                        c.length > 0 && !b.current && !f && n(!0);
                       },
                       onClick: (t) => {
                         n(!0), t.preventDefault(), t.currentTarget.focus();
                       },
                       onKeyDown: (t) => {
-                        t.key === "Tab" ? (n(!1), P(), M()) : t.key === "Enter" && !f ? (u && u(s, null), c.length === 1 && O(c[0])) : t.key === "Escape" ? (n(!1), t.preventDefault(), P(), M()) : (t.key === "ArrowDown" || t.key === "ArrowUp") && !f && c.length > 0 && (n(!0), t.preventDefault());
+                        t.key === "Tab" ? (n(!1), L(), P()) : t.key === "Enter" && !f ? (u && u(o, null), c.length === 1 && k(c[0])) : t.key === "Escape" ? (n(!1), t.preventDefault(), L(), P()) : (t.key === "ArrowDown" || t.key === "ArrowUp") && !f && c.length > 0 && (n(!0), t.preventDefault());
                       },
-                      onBlur: Z,
+                      onBlur: tt,
                       className: d(`${e}__input`, {
-                        [`${e}__input--invalid`]: I
+                        [`${e}__input--invalid`]: T
                       }),
-                      "aria-label": q || `${i}-input`,
-                      "data-testid": `${i}-input`,
-                      ref: w
+                      "aria-label": q || `${l}-input`,
+                      "data-testid": `${l}-input`,
+                      ref: C
                     }
                   ),
-                  s && /* @__PURE__ */ o(
-                    X,
+                  o && /* @__PURE__ */ i(
+                    H,
                     {
                       className: `${e}__close-button`,
-                      "data-testid": `${i}-clear-button`,
-                      onClick: ct,
-                      "aria-label": N || `${i}-clear`,
+                      "data-testid": `${l}-clear-button`,
+                      onClick: pt,
+                      "aria-label": I || `${l}-clear`,
                       tabIndex: -1,
-                      variant: H.tertiary,
-                      children: /* @__PURE__ */ o(
-                        nt,
+                      variant: J.tertiary,
+                      children: /* @__PURE__ */ i(
+                        at,
                         {
                           color: "currentColor",
                           height: 18,
                           width: 18,
                           className: `${e}__icon-button`,
-                          title: N || `${i}-clear`
+                          title: I || `${l}-clear`
                         }
                       )
                     }
                   ),
-                  /* @__PURE__ */ o(
-                    X,
+                  /* @__PURE__ */ i(
+                    H,
                     {
-                      "aria-label": g || `${i}-dropdown`,
+                      "aria-label": N || `${l}-dropdown`,
                       className: d(`${e}__dropdown-button`, {
                         [`${e}__dropdown-button--open`]: f
                       }),
-                      onClick: pt,
-                      "data-testid": `${i}-dropdown`,
+                      onClick: ut,
+                      "data-testid": `${l}-dropdown`,
                       tabIndex: -1,
-                      variant: H.tertiary,
-                      children: /* @__PURE__ */ o(
-                        lt,
+                      variant: J.tertiary,
+                      children: /* @__PURE__ */ i(
+                        nt,
                         {
                           color: "currentColor",
                           height: 18,
                           width: 18,
                           className: `${e}__icon-button`,
-                          title: g || `${i}-dropdown`
+                          title: N || `${l}-dropdown`
                         }
                       )
                     }
@@ -300,44 +302,44 @@ const Vt = gt.forwardRef(function({
                 ]
               }
             ) }),
-            f && /* @__PURE__ */ o(_t, { container: et?.current || document.body, children: /* @__PURE__ */ o(
-              vt,
+            f && /* @__PURE__ */ i(vt, { container: rt?.current || document.body, children: /* @__PURE__ */ i(
+              $t,
               {
                 className: `${e}__content`,
-                "aria-label": z || `${i}-content`,
+                "aria-label": z || `${l}-content`,
                 side: "bottom",
                 sideOffset: -5,
                 align: "start",
                 alignOffset: 0,
                 onFocus: () => {
-                  document.activeElement !== w.current && w.current?.focus();
+                  document.activeElement !== C.current && C.current?.focus();
                 },
                 style: {
                   width: y.current?.offsetWidth || "100%"
                 },
-                children: /* @__PURE__ */ o(wt, { className: `${e}__list`, children: c.length > 0 ? /* @__PURE__ */ o(Ct, { className: `${e}__group`, children: c.map((t) => /* @__PURE__ */ o(
-                  bt,
+                children: /* @__PURE__ */ i(bt, { className: `${e}__list`, children: c.length > 0 ? /* @__PURE__ */ i(wt, { className: `${e}__group`, children: c.map((t) => /* @__PURE__ */ i(
+                  gt,
                   {
                     className: d(`${e}__item`, {
-                      [`${e}__item--selected`]: l?.value === t.value
+                      [`${e}__item--selected`]: s?.value === t.value
                     }),
                     value: t.value,
-                    onSelect: () => O(t),
-                    ...l?.value === t.value ? { ref: E } : {},
+                    onSelect: () => k(t),
+                    ...s?.value === t.value ? { ref: E } : {},
                     children: j ? j(t) : m(t)
                   },
                   t.value
-                )) }) : /* @__PURE__ */ o("div", { className: `${e}__no-options`, children: rt }) })
+                )) }) : /* @__PURE__ */ i("div", { className: `${e}__no-options`, children: ot }) })
               }
             ) })
           ] })
         }
       ),
-      G.validation ? G.validation : /* @__PURE__ */ o("p", { className: d(`${e}__validation`), children: " " })
+      K.validation ? K.validation : /* @__PURE__ */ i("p", { className: d(`${e}__validation`), children: " " })
     ] })
   ] });
 });
-Vt.displayName = "ComboBox";
+Dt.displayName = "ComboBox";
 export {
-  Vt as default
+  Dt as default
 };

package/dist/components/ComboBox/ComboBox.stories.d.ts CHANGED Viewed

@@ -12,6 +12,7 @@ export declare const Playground: {
         options: ComboBoxOption[];
         id: string;
         labelText: string;
+        noOptionsMessage: string;
     };
     argTypes: {
         options: {
@@ -53,6 +54,12 @@ export declare const Playground: {
         value: {
             control: boolean;
         };
+        countOfCharsBeforeDropdown: {
+            control: string;
+        };
+        noOptionsMessage: {
+            control: string;
+        };
     };
 };
 export declare const ComboBoxInDrawer: () => import("react/jsx-runtime").JSX.Element;

package/dist/components/Drawer/Drawer.js CHANGED Viewed

@@ -1,62 +1,62 @@
-import { jsx as r, jsxs as c } from "react/jsx-runtime";
-import { forwardRef as y } from "react";
-import s from "../../node_modules/classnames/index.js";
-import { Root as $, Portal as w, Overlay as D, Content as b, Title as v, Description as B, Close as P } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
-import { VisuallyHidden as n } from "../../node_modules/@radix-ui/react-visually-hidden/dist/index.js";
+import { jsx as r, jsxs as n } from "react/jsx-runtime";
+import { forwardRef as _ } from "react";
+import i from "../../node_modules/classnames/index.js";
+import { Root as $, Portal as b, Overlay as v, Content as w, Title as D, Description as P, Close as B } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
+import { VisuallyHidden as c } from "../../node_modules/@radix-ui/react-visually-hidden/dist/index.js";
 import { getCommonProps as j, noOp as k } from "../../utils/index.js";
 import H from "./DrawerHeader.js";
 import I from "../IconButton/IconButton.js";
 import { ButtonVariants as R } from "../Button/types.js";
 import V from "../Icon/Icon.js";
-const g = y(
+const g = _(
   ({
     isOpen: d,
     onClose: t = k,
-    headerText: a,
+    headerText: e,
     title: m,
-    description: f = m,
-    drawerOpenSide: e = "right",
-    paddingLevel: i,
-    className: h,
-    children: p,
+    description: p = m,
+    drawerOpenSide: a = "right",
+    paddingLevel: s,
+    className: f,
+    children: h,
     ...l
-  }, C) => {
-    const { className: o, ...u } = j(l, "Drawer"), N = e === "bottom";
-    return i ?? (i = a ? 1 : 2), /* @__PURE__ */ r(
+  }, u) => {
+    const { className: o, ...C } = j(l, "Drawer"), y = a === "bottom";
+    return s ?? (s = e ? 1 : 2), /* @__PURE__ */ r(
       $,
       {
         open: d,
-        onOpenChange: (_) => {
-          _ || t();
+        onOpenChange: (N) => {
+          N || (document.body.style.removeProperty("pointer-events"), t());
         },
-        children: /* @__PURE__ */ c(w, { children: [
-          /* @__PURE__ */ r(D, { onClick: t, className: `${o}__overlay`, "data-testid": "drawer-overlay" }),
-          /* @__PURE__ */ c(
-            b,
+        children: /* @__PURE__ */ n(b, { children: [
+          /* @__PURE__ */ r(v, { onClick: t, className: `${o}__overlay`, "data-testid": "drawer-overlay" }),
+          /* @__PURE__ */ n(
+            w,
             {
-              className: s(o, h, {
-                [`${o}--bottom`]: N
+              className: i(o, f, {
+                [`${o}--bottom`]: y
               }),
-              "data-side": e,
+              "data-side": a,
               id: l.id,
-              ref: C,
-              ...u,
+              ref: u,
+              ...C,
               children: [
-                /* @__PURE__ */ r(n, { asChild: !0, children: /* @__PURE__ */ r(v, { children: m }) }),
-                /* @__PURE__ */ r(n, { asChild: !0, children: /* @__PURE__ */ r(B, { children: f }) }),
-                a ? /* @__PURE__ */ r(
+                /* @__PURE__ */ r(c, { asChild: !0, children: /* @__PURE__ */ r(D, { children: m }) }),
+                /* @__PURE__ */ r(c, { asChild: !0, children: /* @__PURE__ */ r(P, { children: p }) }),
+                e ? /* @__PURE__ */ r(
                   H,
                   {
                     baseClassName: o,
-                    headerText: a,
+                    headerText: e,
                     onClose: t,
-                    drawerOpenSide: e
+                    drawerOpenSide: a
                   }
-                ) : /* @__PURE__ */ r(P, { asChild: !0, children: /* @__PURE__ */ r(
+                ) : /* @__PURE__ */ r(B, { asChild: !0, children: /* @__PURE__ */ r(
                   I,
                   {
                     onClick: t,
-                    className: s(`${o}__close`),
+                    className: i(`${o}__close`),
                     "aria-label": "Close",
                     "data-testid": "drawer-close",
                     variant: R.tertiary,
@@ -66,11 +66,11 @@ const g = y(
                 /* @__PURE__ */ r(
                   "div",
                   {
-                    className: s(
+                    className: i(
                       `${o}__content`,
-                      i < 3 && `${o}__content--ep${i}`
+                      s < 3 && `${o}__content--ep${s}`
                     ),
-                    children: p
+                    children: h
                   }
                 )
               ]

package/dist/components/Modal/Modal.js CHANGED Viewed

@@ -1,64 +1,64 @@
-import { jsx as o, jsxs as r } from "react/jsx-runtime";
+import { jsx as o, jsxs as a } from "react/jsx-runtime";
 import t from "../../node_modules/classnames/index.js";
-import { getCommonProps as N, noOp as _ } from "../../utils/index.js";
-import M from "../Icon/Icon.js";
-import g from "../IconButton/IconButton.js";
-import { ButtonVariants as v } from "../Button/types.js";
-import { Root as b, Portal as x, Overlay as I, Content as O, Title as P, Description as $, Close as j } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
+import { getCommonProps as v, noOp as N } from "../../utils/index.js";
+import _ from "../Icon/Icon.js";
+import M from "../IconButton/IconButton.js";
+import { ButtonVariants as b } from "../Button/types.js";
+import { Root as g, Portal as P, Overlay as x, Content as I, Title as O, Description as $, Close as j } from "../../node_modules/@radix-ui/react-dialog/dist/index.js";
 import { VisuallyHidden as w } from "../../node_modules/@radix-ui/react-visually-hidden/dist/index.js";
 import { forwardRef as B } from "react";
 const R = B(
   ({
     children: l,
-    className: i,
-    overlayClassName: s,
+    className: s,
+    overlayClassName: i,
     isOpen: m = !1,
-    onClose: d = _,
-    style: n,
+    onClose: n = N,
+    style: d,
     contentLabel: c,
-    closeIcon: f = /* @__PURE__ */ o(M, { icon: "CloseX", height: 32, width: 32, color: "currentColor" }),
-    closeIconPosition: p = "right",
-    ...e
+    closeIcon: p = /* @__PURE__ */ o(_, { icon: "CloseX", height: 32, width: 32, color: "currentColor" }),
+    closeIconPosition: f = "right",
+    ...r
   }, h) => {
-    const { className: a, "data-testid": u, ...C } = N(e, "Modal");
+    const { className: e, "data-testid": u, ...C } = v(r, "Modal");
     return /* @__PURE__ */ o(
-      b,
+      g,
       {
         open: m,
         onOpenChange: (y) => {
-          y || d();
+          y || (document.body.style.removeProperty("pointer-events"), n());
         },
-        children: /* @__PURE__ */ r(x, { children: [
+        children: /* @__PURE__ */ a(P, { children: [
           /* @__PURE__ */ o(
-            I,
+            x,
             {
-              className: t(`${a}__overlay`, s),
+              className: t(`${e}__overlay`, i),
               "data-testid": "modal-overlay"
             }
           ),
-          /* @__PURE__ */ r(
-            O,
+          /* @__PURE__ */ a(
+            I,
             {
               ref: h,
-              className: t(a, i),
+              className: t(e, s),
               "data-testid": u,
               "aria-modal": "true",
-              style: n,
+              style: d,
               ...C,
-              ...e,
+              ...r,
               children: [
-                /* @__PURE__ */ o(w, { asChild: !0, children: /* @__PURE__ */ o(P, { children: c ?? "Modal" }) }),
+                /* @__PURE__ */ o(w, { asChild: !0, children: /* @__PURE__ */ o(O, { children: c ?? "Modal" }) }),
                 /* @__PURE__ */ o($, {}),
                 /* @__PURE__ */ o(j, { asChild: !0, children: /* @__PURE__ */ o(
-                  g,
+                  M,
                   {
                     id: "modal-close-button",
                     "aria-label": "Close Modal",
-                    className: t(`${a}__close`, {
-                      [`${a}__close--left`]: p === "left"
+                    className: t(`${e}__close`, {
+                      [`${e}__close--left`]: f === "left"
                     }),
-                    variant: v.tertiary,
-                    children: f
+                    variant: b.tertiary,
+                    children: p
                   }
                 ) }),
                 l

package/dist/components/Toast/useToast.js CHANGED Viewed

@@ -1,10 +1,14 @@
-import { useToastContext as s } from "./useToastContext.js";
-const l = () => {
-  const { addToast: e } = s();
-  return (t) => {
-    typeof t == "object" && t !== null && "title" in t ? e(t) : e({ title: t });
-  };
+import { useToastContext as a } from "./useToastContext.js";
+import { useCallback as o } from "react";
+const c = () => {
+  const { addToast: e } = a();
+  return o(
+    (t) => {
+      typeof t == "object" && t !== null && "title" in t ? e(t) : e({ title: t });
+    },
+    [e]
+  );
 };
 export {
-  l as useToast
+  c as useToast
 };

package/dist/scss/components/ComboBox/_combobox.scss CHANGED Viewed

@@ -176,6 +176,10 @@
     margin-top: $spacing-xsm;
   }
+  &__no-options {
+    padding-left: $padding-xsm;
+  }
   @keyframes fade-in {
     from {
       opacity: 0;

package/package.json CHANGED Viewed

@@ -1,6 +1,6 @@
 {
   "name": "@phillips/seldon",
-  "version": "1.176.0",
+  "version": "1.177.0",
   "repository": {
     "type": "git",
     "url": "https://github.com/PhillipsAuctionHouse/seldon"