@clearstory/drywall-react 4.2.4 → 5.0.0

package/dist/components/NumberInputControl/NumberInputControl.js

@@ -1,19 +1,19 @@
 import { jsxs as l, jsx as r } from "react/jsx-runtime";
-import { forwardRef as x } from "react";
-import { FormSublabel as F } from "../FormSublabel/FormSublabel.js";
-import { NumberInput as y } from "../NumberInput/NumberInput.js";
-import { useId as g } from "../../hooks/useId.js";
+import { forwardRef as F } from "react";
+import { FormSublabel as y } from "../FormSublabel/FormSublabel.js";
+import { NumberInput as g } from "../NumberInput/NumberInput.js";
+import { useId as N } from "../../hooks/useId.js";
 import "../../icons/ClearstoryIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
-import { I as N } from "../../Info-Cykl51qM.js";
-import { F as w } from "../../FormControl-SJ7nmkLi.js";
-import { B } from "../../Box-CRpDZJO_.js";
-import { F as C } from "../../FormLabel-Cq6v8zn0.js";
-import { T as $ } from "../../Tooltip-D_k6EcdK.js";
-import { F as j } from "../../FormHelperText-Dh36nlW5.js";
-const T = x(
+import { I as w } from "../../Info-DYeQDm-h.js";
+import { F as B } from "../../FormControl-BDhAmhH5.js";
+import { B as C } from "../../Box-D994ipAZ.js";
+import { F as $ } from "../../FormLabel-IN8pc15T.js";
+import { T as j } from "../../Tooltip-CZJgBQSd.js";
+import { F as T } from "../../FormHelperText-DkPKXA6k.js";
+const k = F(
   ({
     disabled: n,
     fullWidth: a,
@@ -23,20 +23,22 @@ const T = x(
     required: s,
     slotProps: e,
     sublabel: d,
+    sx: u,
     tooltip: p,
     ...o
-  }, u) => {
-    const I = g("number-input"), t = b || I, m = i ? `${t}-helper` : void 0, c = o.error;
+  }, I) => {
+    const h = N("number-input"), t = b || h, m = i ? `${t}-helper` : void 0, c = o.error;
     return /* @__PURE__ */ l(
-      w,
+      B,
       {
         disabled: n,
         error: c,
         fullWidth: a,
+        sx: u,
         ...e?.root,
         children: [
           /* @__PURE__ */ l(
-            B,
+            C,
             {
               sx: {
                 alignItems: "center",
@@ -45,7 +47,7 @@ const T = x(
               },
               children: [
                 /* @__PURE__ */ r(
-                  C,
+                  $,
                   {
                     htmlFor: t,
                     required: s,
@@ -53,11 +55,11 @@ const T = x(
                     children: f
                   }
                 ),
-                p && /* @__PURE__ */ r($, { title: p, arrow: !0, children: /* @__PURE__ */ r(
-                  N,
+                p && /* @__PURE__ */ r(j, { title: p, arrow: !0, children: /* @__PURE__ */ r(
+                  w,
                   {
-                    sx: ({ vars: h }) => ({
-                      color: h?.palette.text.secondary,
+                    sx: ({ vars: x }) => ({
+                      color: x?.palette.text.secondary,
                       marginBlockEnd: "3px",
                       height: "1rem",
                       width: "1rem"
@@ -67,11 +69,11 @@ const T = x(
               ]
             }
           ),
-          d && /* @__PURE__ */ r(F, { ...e?.sublabel, children: d }),
+          d && /* @__PURE__ */ r(y, { ...e?.sublabel, children: d }),
           /* @__PURE__ */ r(
-            y,
+            g,
             {
-              ref: u,
+              ref: I,
               disabled: n,
               id: t,
               error: c,
@@ -80,13 +82,13 @@ const T = x(
               ...o
             }
           ),
-          i && /* @__PURE__ */ r(j, { id: m, ...e?.helperText, children: i })
+          i && /* @__PURE__ */ r(T, { id: m, ...e?.helperText, children: i })
         ]
       }
     );
   }
 );
-T.displayName = "NumberInputControl";
+k.displayName = "NumberInputControl";
 export {
-  T as NumberInputControl
+  k as NumberInputControl
 };

package/dist/components/Paper/index.js

@@ -1,4 +1,4 @@
-import { P as e, g as p, p as r } from "../../Paper-CillS6ZD.js";
+import { P as e, g as p, p as r } from "../../Paper-DWrmqOg9.js";
 export {
   e as Paper,
   p as getPaperUtilityClass,

package/dist/components/Popover/index.js

@@ -1,4 +1,4 @@
-import { P as s, c as a, b as p, a as t, g as r, d as f, p as P } from "../../Popover-CeKBDf1E.js";
+import { P as s, c as a, b as p, a as t, g as r, d as f, p as P } from "../../Popover-CJMphrzS.js";
 export {
   s as Popover,
   a as PopoverPaper,

package/dist/components/Popper/index.js

@@ -1,4 +1,4 @@
-import { P as o, g as r } from "../../Popper-C6wdLC8n.js";
+import { P as o, g as r } from "../../Popper-BG-Fmxvb.js";
 export {
   o as Popper,
   r as getPopperUtilityClass

package/dist/components/Radio/index.js

@@ -1,4 +1,4 @@
-import { R as i, g as o, r } from "../../Radio-BZYnjZGa.js";
+import { R as i, g as o, r } from "../../Radio-CyNfzA7F.js";
 export {
   i as Radio,
   o as getRadioUtilityClass,

package/dist/components/RadioGroup/index.js

@@ -1,4 +1,4 @@
-import { R as r, g as s, r as i } from "../../RadioGroup-B_oZGEe4.js";
+import { R as r, g as s, r as i } from "../../RadioGroup-BXRupvlk.js";
 import { u } from "../../useRadioGroup-M33YAtv7.js";
 export {
   r as RadioGroup,

package/dist/components/Select/Select.js

@@ -1,7 +1,7 @@
 import { jsx as r } from "react/jsx-runtime";
 import { forwardRef as p } from "react";
 import { Input as f } from "../Input/Input.js";
-import { S as s } from "../../Select-B6vD2SgN.js";
+import { S as s } from "../../Select-CsGlMf66.js";
 const a = p(
   (t, o) => {
     const { input: e = /* @__PURE__ */ r(f, {}), ...m } = t;

package/dist/components/Select/index.js

@@ -1,5 +1,5 @@
 import { Select as t, Select as l } from "./Select.js";
-import { g as c, s as o } from "../../Select-B6vD2SgN.js";
+import { g as c, s as o } from "../../Select-CsGlMf66.js";
 export {
   t as Select,
   l as default,

package/dist/components/SelectControl/SelectControl.d.ts

@@ -5,17 +5,18 @@ import { FormLabelProps } from '../FormLabel';
 import { FormSublabelProps } from '../FormSublabel';
 import { SelectProps } from '../Select';
 type DOMEventHandlers = keyof DOMAttributes<HTMLElement>;
-export interface SelectControlProps extends Omit<SelectProps, "ref"> {
+export interface SelectControlProps extends Omit<SelectProps, "ref" | "sx"> {
     helperText?: ReactNode;
     label: ReactNode;
     slotProps?: {
-        root?: Partial<Omit<FormControlProps, DOMEventHandlers>>;
-        label?: Partial<Omit<FormLabelProps, "children" | DOMEventHandlers>>;
-        sublabel?: Partial<Omit<FormSublabelProps, "children" | DOMEventHandlers>>;
         helperText?: Partial<Omit<FormHelperTextProps, "children" | DOMEventHandlers>>;
+        label?: Partial<Omit<FormLabelProps, "children" | DOMEventHandlers>>;
+        root?: Partial<Omit<FormControlProps, DOMEventHandlers>>;
         select?: SelectProps["slotProps"];
+        sublabel?: Partial<Omit<FormSublabelProps, "children" | DOMEventHandlers>>;
     };
     sublabel?: ReactNode;
+    sx?: FormControlProps["sx"];
     tooltip?: ReactNode;
 }
 export declare const SelectControl: ForwardRefExoticComponent<SelectControlProps & RefAttributes<HTMLSelectElement>>;

package/dist/components/SelectControl/SelectControl.js

@@ -1,19 +1,19 @@
 import { jsxs as p, jsx as r } from "react/jsx-runtime";
-import { forwardRef as F } from "react";
-import { FormSublabel as y } from "../FormSublabel/FormSublabel.js";
-import { Select as g } from "../Select/Select.js";
-import { useId as $ } from "../../hooks/useId.js";
+import { forwardRef as y } from "react";
+import { FormSublabel as g } from "../FormSublabel/FormSublabel.js";
+import { Select as $ } from "../Select/Select.js";
+import { useId as S } from "../../hooks/useId.js";
 import "../../icons/ClearstoryIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
-import { I as S } from "../../Info-Cykl51qM.js";
-import { F as u } from "../../FormControl-SJ7nmkLi.js";
-import { B as w } from "../../Box-CRpDZJO_.js";
-import { F as B } from "../../FormLabel-Cq6v8zn0.js";
-import { T as C } from "../../Tooltip-D_k6EcdK.js";
-import { F as j } from "../../FormHelperText-Dh36nlW5.js";
-const T = F(
+import { I as u } from "../../Info-DYeQDm-h.js";
+import { F as w } from "../../FormControl-BDhAmhH5.js";
+import { B } from "../../Box-D994ipAZ.js";
+import { F as C } from "../../FormLabel-IN8pc15T.js";
+import { T as j } from "../../Tooltip-CZJgBQSd.js";
+import { F as T } from "../../FormHelperText-DkPKXA6k.js";
+const k = y(
   ({
     disabled: a,
     error: l,
@@ -24,20 +24,22 @@ const T = F(
     required: b,
     slotProps: e,
     sublabel: c,
+    sx: h,
     tooltip: n,
     ...i
-  }, h) => {
-    const x = $("select"), o = s || x, m = t ? `${o}-helper` : void 0;
+  }, x) => {
+    const I = S("select"), o = s || I, m = t ? `${o}-helper` : void 0;
     return /* @__PURE__ */ p(
-      u,
+      w,
       {
         disabled: a,
         error: l,
         fullWidth: d,
+        sx: h,
         ...e?.root,
         children: [
           /* @__PURE__ */ p(
-            w,
+            B,
             {
               sx: {
                 alignItems: "center",
@@ -46,7 +48,7 @@ const T = F(
               },
               children: [
                 /* @__PURE__ */ r(
-                  B,
+                  C,
                   {
                     id: `${o}-label`,
                     htmlFor: o,
@@ -55,11 +57,11 @@ const T = F(
                     children: f
                   }
                 ),
-                n && /* @__PURE__ */ r(C, { title: n, arrow: !0, children: /* @__PURE__ */ r(
-                  S,
+                n && /* @__PURE__ */ r(j, { title: n, arrow: !0, children: /* @__PURE__ */ r(
+                  u,
                   {
-                    sx: ({ vars: I }) => ({
-                      color: I?.palette.text.secondary,
+                    sx: ({ vars: F }) => ({
+                      color: F?.palette.text.secondary,
                       marginBlockEnd: "3px",
                       height: "1rem",
                       width: "1rem"
@@ -69,11 +71,11 @@ const T = F(
               ]
             }
           ),
-          c && /* @__PURE__ */ r(y, { ...e?.sublabel, children: c }),
+          c && /* @__PURE__ */ r(g, { ...e?.sublabel, children: c }),
           /* @__PURE__ */ r(
-            g,
+            $,
             {
-              ref: h,
+              ref: x,
               disabled: a,
               error: l,
               fullWidth: d,
@@ -84,13 +86,13 @@ const T = F(
               ...i
             }
           ),
-          t && /* @__PURE__ */ r(j, { id: m, ...e?.helperText, children: t })
+          t && /* @__PURE__ */ r(T, { id: m, ...e?.helperText, children: t })
         ]
       }
     );
   }
 );
-T.displayName = "SelectControl";
+k.displayName = "SelectControl";
 export {
-  T as SelectControl
+  k as SelectControl
 };

package/dist/components/Skeleton/index.js

@@ -1,4 +1,4 @@
-import { S as t, g as l, s as a } from "../../Skeleton-dB0amZ86.js";
+import { S as t, g as l, s as a } from "../../Skeleton-Agk933wV.js";
 export {
   t as Skeleton,
   l as getSkeletonUtilityClass,

package/dist/components/Slide/index.js

@@ -1,4 +1,4 @@
-import { S as r } from "../../Slide-DH1MNrW5.js";
+import { S as r } from "../../Slide-BSx4P5wi.js";
 export {
   r as Slide
 };

package/dist/components/Snackbar/index.js

@@ -1,4 +1,4 @@
-import { S as r, g as t, s as b } from "../../Snackbar-CStc3hrX.js";
+import { S as r, g as t, s as b } from "../../Snackbar-DPLaR_J7.js";
 export {
   r as Snackbar,
   t as getSnackbarUtilityClass,

package/dist/components/Stack/index.js

@@ -1,4 +1,4 @@
-import { S as t, s as c } from "../../stackClasses-Byw0GYkA.js";
+import { S as t, s as c } from "../../stackClasses-Bd9a0jxO.js";
 export {
   t as Stack,
   c as stackClasses

package/dist/components/Step/index.js

@@ -1,4 +1,4 @@
-import { S as e, g as a, s as p } from "../../Step-CV3A4LpO.js";
+import { S as e, g as a, s as p } from "../../Step-9yR9vvnx.js";
 import { S, u as r } from "../../StepContext-DBP0UfQI.js";
 export {
   e as Step,

package/dist/components/StepButton/index.js

@@ -1,4 +1,4 @@
-import { S as e, g as a, s as o } from "../../StepButton-BBi5-y1-.js";
+import { S as e, g as a, s as o } from "../../StepButton-BoSDmtoO.js";
 export {
   e as StepButton,
   a as getStepButtonUtilityClass,

package/dist/components/StepConnector/index.js

@@ -1,4 +1,4 @@
-import { S as e, g as o, s as n } from "../../StepConnector-BuYXen1O.js";
+import { S as e, g as o, s as n } from "../../StepConnector-CWFluIpg.js";
 export {
   e as StepConnector,
   o as getStepConnectorUtilityClass,

package/dist/components/StepContent/index.js

@@ -1,4 +1,4 @@
-import { S as e, g as n, s as a } from "../../StepContent-DuLdAkaj.js";
+import { S as e, g as n, s as a } from "../../StepContent-DOxvgy_S.js";
 export {
   e as StepContent,
   n as getStepContentUtilityClass,

package/dist/components/StepIcon/index.js

@@ -1,4 +1,4 @@
-import { S as e, g as a, s as o } from "../../StepIcon-BGJV3ex5.js";
+import { S as e, g as a, s as o } from "../../StepIcon-DC4TprJy.js";
 export {
   e as StepIcon,
   a as getStepIconUtilityClass,

package/dist/components/StepLabel/index.js

@@ -1,4 +1,4 @@
-import { S as a, g as t, s as l } from "../../StepLabel-CzlfRONI.js";
+import { S as a, g as t, s as l } from "../../StepLabel-B-VRsD45.js";
 export {
   a as StepLabel,
   t as getStepLabelUtilityClass,

package/dist/components/Stepper/index.js

@@ -1,4 +1,4 @@
-import { S as s, g as p, s as r } from "../../Stepper-CidMCT4v.js";
+import { S as s, g as p, s as r } from "../../Stepper-CjJxTXt3.js";
 import { a as o, b as S } from "../../StepContext-DBP0UfQI.js";
 export {
   s as Stepper,

package/dist/components/SvgIcon/index.js

@@ -1,4 +1,4 @@
-import { S as g, g as o, s as t } from "../../SvgIcon-BH0vQ_GU.js";
+import { S as g, g as o, s as t } from "../../SvgIcon-BY0YatF5.js";
 export {
   g as SvgIcon,
   o as getSvgIconUtilityClass,

package/dist/components/Switch/index.js

@@ -1,4 +1,4 @@
-import { S as a, g as i, s as c } from "../../Switch-DEHarJQv.js";
+import { S as a, g as i, s as c } from "../../Switch-DBjsfSeC.js";
 export {
   a as Switch,
   i as getSwitchUtilityClass,

package/dist/components/Tab/index.js

@@ -1,4 +1,4 @@
-import { T as t, g as b, t as e } from "../../Tab-Bli-yyJs.js";
+import { T as t, g as b, t as e } from "../../Tab-jZ25NKxn.js";
 export {
   t as Tab,
   b as getTabUtilityClass,

package/dist/components/Table/index.js

@@ -1,4 +1,4 @@
-import { T as e, g as l, t } from "../../Table-BBCGDmoE.js";
+import { T as e, g as l, t } from "../../Table-EzIrcbFo.js";
 export {
   e as Table,
   l as getTableUtilityClass,

package/dist/components/TableBody/index.js

@@ -1,4 +1,4 @@
-import { T as e, g as l, t } from "../../TableBody-UFw650kZ.js";
+import { T as e, g as l, t } from "../../TableBody-CAryi1qZ.js";
 export {
   e as TableBody,
   l as getTableBodyUtilityClass,

package/dist/components/TableCell/index.js

@@ -1,4 +1,4 @@
-import { T as a, g as s, t } from "../../TableCell-BCcCX1o0.js";
+import { T as a, g as s, t } from "../../TableCell-COWq5POr.js";
 export {
   a as TableCell,
   s as getTableCellUtilityClass,

package/dist/components/TableContainer/index.js

@@ -1,4 +1,4 @@
-import { T as t, g as s, t as l } from "../../TableContainer-B8VlqYma.js";
+import { T as t, g as s, t as l } from "../../TableContainer-Bp7fIsJs.js";
 export {
   t as TableContainer,
   s as getTableContainerUtilityClass,

package/dist/components/TableFooter/index.js

@@ -1,4 +1,4 @@
-import { T as a, g as o, t as s } from "../../TableFooter-BaTiFVSU.js";
+import { T as a, g as o, t as s } from "../../TableFooter-zHqRu_3G.js";
 export {
   a as TableFooter,
   o as getTableFooterUtilityClass,

package/dist/components/TableHead/index.js

@@ -1,4 +1,4 @@
-import { T as s, g as l, t } from "../../TableHead-CIA-5L7E.js";
+import { T as s, g as l, t } from "../../TableHead-D-RsRaXy.js";
 export {
   s as TableHead,
   l as getTableHeadUtilityClass,

package/dist/components/TablePagination/index.js

@@ -1,4 +1,4 @@
-import { T as i, g as s, t as e } from "../../TablePagination-DyQMglQB.js";
+import { T as i, g as s, t as e } from "../../TablePagination-BsU2V4Tr.js";
 export {
   i as TablePagination,
   s as getTablePaginationUtilityClass,

package/dist/components/TableRow/index.js

@@ -1,4 +1,4 @@
-import { T as e, g as l, t } from "../../TableRow-kwIao0PS.js";
+import { T as e, g as l, t } from "../../TableRow-BxD13v9r.js";
 export {
   e as TableRow,
   l as getTableRowUtilityClass,

package/dist/components/Tabs/index.js

@@ -1,4 +1,4 @@
-import { T as t, g as b, t as e } from "../../Tabs-C0clNfdI.js";
+import { T as t, g as b, t as e } from "../../Tabs-BgwHyeLe.js";
 export {
   t as Tabs,
   b as getTabsUtilityClass,

package/dist/components/ThemeProvider/ThemeProvider.js

@@ -2,7 +2,7 @@ import { jsx as i } from "react/jsx-runtime";
 import { theme as t } from "../../theme/internal.js";
 import * as m from "react";
 import { T as o } from "../../emotion-element-f0de968e.browser.esm-CX7iy5u6.js";
-import { T as f, C as u } from "../../ThemeProviderWithVars-5x9PPela.js";
+import { T as f, C as u } from "../../ThemeProviderWithVars-BLXq3E3r.js";
 function c({
   theme: r,
   ...n

package/dist/components/ToastContainer/ToastContainer.js

@@ -1,6 +1,6 @@
 import { jsx as o } from "react/jsx-runtime";
 import { F as r, h as a } from "../../index-SzwnPTHF.js";
-import { s } from "../../styled-SBTDGe0C.js";
+import { s } from "../../styled-BGhco0UA.js";
 const i = s("div")({
   "@keyframes toastIn": {
     from: {

package/dist/components/ToastContainer/useToast.js

@@ -5,12 +5,12 @@ import "../../icons/ClearstoryIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
-import { I as w, E as I, W as v, C } from "../../WarningAmberOutlined-GOlm4GU9.js";
-import { C as R } from "../../Close-DeDd1tSW.js";
+import { I as w, E as I, W as v, C } from "../../WarningAmberOutlined-DA3_ce6m.js";
+import { C as R } from "../../Close-28GNVfyf.js";
 import { ToastLabelContext as y } from "./ToastLabelContext.js";
-import { B as k } from "../../Box-CRpDZJO_.js";
-import { A as m } from "../../Alert-CuHm3vf9.js";
-import { I as T } from "../../IconButton-RfVV5QBc.js";
+import { B as k } from "../../Box-D994ipAZ.js";
+import { A as m } from "../../Alert-DQykJi33.js";
+import { I as T } from "../../IconButton-BAxK7-IJ.js";
 const Y = () => {
   const t = h(y);
   if (!t)

package/dist/components/ToggleButton/index.js

@@ -1,4 +1,4 @@
-import { T as g } from "../../ToggleButton-Bxt1wAl-.js";
+import { T as g } from "../../ToggleButton-D_OHozvx.js";
 import { g as e, t as l } from "../../ToggleButtonGroupButtonContext-DhmFd9i-.js";
 export {
   g as ToggleButton,

package/dist/components/ToggleButtonGroup/ToggleButtonGroup.theme.js

@@ -1,5 +1,11 @@
-import { t } from "../../toggleButtonGroupClasses-BomKNKPA.js";
-const r = {
+import { g as o } from "../../generateUtilityClass-BhfUaMgk.js";
+const t = {
+  horizontal: o("MuiToggleButtonGroup", "horizontal"),
+  vertical: o("MuiToggleButtonGroup", "vertical"),
+  grouped: o("MuiToggleButtonGroup", "grouped"),
+  firstButton: o("MuiToggleButtonGroup", "firstButton"),
+  lastButton: o("MuiToggleButtonGroup", "lastButton")
+}, e = {
   defaultProps: {
     size: "small"
   },
@@ -59,5 +65,5 @@ const r = {
   }
 };
 export {
-  r as MuiToggleButtonGroup
+  e as MuiToggleButtonGroup
 };

package/dist/components/ToggleButtonGroup/index.js

@@ -1,7 +1,6 @@
-import { T as g } from "../../ToggleButtonGroup-BU7q7tWs.js";
-import { g as e, t as r } from "../../toggleButtonGroupClasses-BomKNKPA.js";
+import { T as g, g as s, t as e } from "../../ToggleButtonGroup-BEM6-tyO.js";
 export {
   g as ToggleButtonGroup,
-  e as getToggleButtonGroupUtilityClass,
-  r as toggleButtonGroupClasses
+  s as getToggleButtonGroupUtilityClass,
+  e as toggleButtonGroupClasses
 };

package/dist/components/Toolbar/index.js

@@ -1,4 +1,4 @@
-import { T as s, g as l, t } from "../../Toolbar-CdyTRFTH.js";
+import { T as s, g as l, t } from "../../Toolbar-RfOCT9pS.js";
 export {
   s as Toolbar,
   l as getToolbarUtilityClass,

package/dist/components/Tooltip/index.js

@@ -1,4 +1,4 @@
-import { T as s, g as l, t as a } from "../../Tooltip-D_k6EcdK.js";
+import { T as s, g as l, t as a } from "../../Tooltip-CZJgBQSd.js";
 export {
   s as Tooltip,
   l as getTooltipUtilityClass,

package/dist/components/Typography/index.js

@@ -1,4 +1,4 @@
-import { T as p, g as y, t } from "../../Typography-CmmKlAgs.js";
+import { T as p, g as y, t } from "../../Typography-7XxDpBjP.js";
 export {
   p as Typography,
   y as getTypographyUtilityClass,

package/dist/components/Zoom/index.js

@@ -1,4 +1,4 @@
-import { Z as r } from "../../Zoom-DjCniHY2.js";
+import { Z as r } from "../../Zoom-DaoDggO-.js";
 export {
   r as Zoom
 };