@clearstory/drywall-react 8.1.1 → 8.1.2

package/dist/{Autocomplete-CYF3HxdY.js → Autocomplete-D8dP8rgo.js}

@@ -2,10 +2,20 @@ import { jsx as $, jsxs as Be } from "react/jsx-runtime";
 import * as y from "react";
 import { forwardRef as Vt } from "react";
 import { Input as Ft } from "./components/Input/Input.js";
+import "./icons/CalloutAnnotationIcon.js";
 import "./icons/ClearstoryIcon.js";
+import "./icons/CloudAnnotationIcon.js";
+import "./icons/EllipseAnnotationIcon.js";
+import "./icons/FitToPageIcon.js";
+import "./icons/FitToWidthIcon.js";
+import "./icons/FreeTextAnnotationIcon.js";
+import "./icons/HighlightAnnotationIcon.js";
 import "./icons/InternalOnlyIcon.js";
 import "./icons/MoneyBucketIcon.js";
 import "./icons/MoreCircleOutlineIcon.js";
+import "./icons/NoteAnnotationIcon.js";
+import "./icons/PenAnnotationIcon.js";
+import "./icons/RectangleAnnotationIcon.js";
 import "./icons/SparkleIcon.js";
 import { A as Ht, C as zt } from "./Clear-C07DnM0Z.js";
 import { g as kt } from "./generateUtilityClass-BhfUaMgk.js";

package/dist/components/Autocomplete/Autocomplete.js

@@ -1,15 +1,25 @@
 import "react/jsx-runtime";
 import "react";
 import "../Input/Input.js";
+import "../../icons/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import "../../Clear-C07DnM0Z.js";
 import "../../generateUtilityClass-BhfUaMgk.js";
-import { A as u, A as c } from "../../Autocomplete-CYF3HxdY.js";
+import { A as q, A as v } from "../../Autocomplete-D8dP8rgo.js";
 export {
-  u as Autocomplete,
-  c as default
+  q as Autocomplete,
+  v as default
 };

package/dist/components/Autocomplete/index.js

@@ -1,4 +1,4 @@
-import { A as a, a as s, c as o, A as l, g as c } from "../../Autocomplete-CYF3HxdY.js";
+import { A as a, a as s, c as o, A as l, g as c } from "../../Autocomplete-D8dP8rgo.js";
 export {
   a as Autocomplete,
   s as autocompleteClasses,

package/dist/components/AutocompleteControl/AutocompleteControl.js

@@ -1,12 +1,22 @@
 import { jsxs as d, jsx as o } from "react/jsx-runtime";
 import { forwardRef as I } from "react";
 import { FormSublabel as y } from "../FormSublabel/FormSublabel.js";
-import { A as g } from "../../Autocomplete-CYF3HxdY.js";
+import { A as g } from "../../Autocomplete-D8dP8rgo.js";
 import { useId as A } from "../../hooks/useId.js";
+import "../../icons/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { I as C } from "../../Info-BMNIqxBf.js";
 import { F as T } from "../../FormControl-kcKovRdJ.js";
@@ -16,8 +26,8 @@ import { T as $ } from "../../Tooltip-CYXo_y5R.js";
 import { F as j } from "../../FormHelperText-BO-3JFoa.js";
 function P(n, c) {
   const {
-    disabled: m,
-    error: p,
+    disabled: p,
+    error: l,
     helperText: i,
     id: b,
     label: f,
@@ -26,9 +36,9 @@ function P(n, c) {
     sublabel: a,
     sx: u,
     tooltip: s,
-    ...e
-  } = n, x = A("autocomplete"), l = b || x, t = i ? `${l}-helper` : void 0;
-  return /* @__PURE__ */ d(T, { disabled: m, error: p, sx: u, ...r?.root, children: [
+    ...t
+  } = n, x = A("autocomplete"), m = b || x, e = i ? `${m}-helper` : void 0;
+  return /* @__PURE__ */ d(T, { disabled: p, error: l, sx: u, ...r?.root, children: [
     /* @__PURE__ */ d(
       w,
       {
@@ -38,7 +48,7 @@ function P(n, c) {
           gap: "0.25rem"
         },
         children: [
-          /* @__PURE__ */ o(B, { htmlFor: l, required: h, ...r?.label, children: f }),
+          /* @__PURE__ */ o(B, { htmlFor: m, required: h, ...r?.label, children: f }),
           s && /* @__PURE__ */ o($, { title: s, arrow: !0, children: /* @__PURE__ */ o(
             C,
             {
@@ -57,16 +67,16 @@ function P(n, c) {
     /* @__PURE__ */ o(
       g,
       {
-        disabled: m,
+        disabled: p,
         ref: c,
-        error: p,
-        id: l,
-        "aria-describedby": t ? e["aria-describedby"] ? `${e["aria-describedby"]} ${t}` : t : e["aria-describedby"],
+        error: l,
+        id: m,
+        "aria-describedby": e ? t["aria-describedby"] ? `${t["aria-describedby"]} ${e}` : e : t["aria-describedby"],
         slotProps: r?.autocomplete,
-        ...e
+        ...t
       }
     ),
-    i && /* @__PURE__ */ o(j, { id: t, ...r?.helperText, children: i })
+    i && /* @__PURE__ */ o(j, { id: e, ...r?.helperText, children: i })
   ] });
 }
 const k = I(

package/dist/components/DatepickerControl/DatepickerControl.js

@@ -1,12 +1,22 @@
-import { jsxs as f, jsx as e } from "react/jsx-runtime";
+import { jsxs as f, jsx as o } from "react/jsx-runtime";
 import { forwardRef as y } from "react";
 import { D } from "../../Datepicker-CNITLOtu.js";
 import { FormSublabel as u } from "../FormSublabel/FormSublabel.js";
 import { useId as w } from "../../hooks/useId.js";
+import "../../icons/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { I as $ } from "../../Info-BMNIqxBf.js";
 import { F as B } from "../../FormControl-kcKovRdJ.js";
@@ -16,28 +26,28 @@ import { T } from "../../Tooltip-CYXo_y5R.js";
 import { F as v } from "../../FormHelperText-BO-3JFoa.js";
 const E = y(
   ({
-    disabled: a = !1,
-    error: m = !1,
-    fullWidth: l,
+    disabled: m = !1,
+    error: a = !1,
+    fullWidth: p,
     helperText: i,
     label: t,
     name: s,
     required: h = !1,
     size: x = "small",
     slotProps: r = {},
-    sublabel: p,
+    sublabel: l,
     sx: b,
     tooltip: d,
     ...I
   }, g) => {
-    const k = w("datepicker"), o = s || k, n = r.label?.id ?? `${o}-label`, c = i ? `${o}-helper` : void 0;
+    const k = w("datepicker"), e = s || k, n = r.label?.id ?? `${e}-label`, c = i ? `${e}-helper` : void 0;
     return /* @__PURE__ */ f(
       B,
       {
         "aria-labelledby": n,
-        disabled: a,
-        error: m,
-        fullWidth: l,
+        disabled: m,
+        error: a,
+        fullWidth: p,
         role: "group",
         sx: b,
         ...r.root,
@@ -51,8 +61,8 @@ const E = y(
                 gap: "0.25rem"
               },
               children: [
-                /* @__PURE__ */ e(j, { id: n, required: h, ...r.label, children: t }),
-                d && /* @__PURE__ */ e(T, { title: d, arrow: !0, children: /* @__PURE__ */ e(
+                /* @__PURE__ */ o(j, { id: n, required: h, ...r.label, children: t }),
+                d && /* @__PURE__ */ o(T, { title: d, arrow: !0, children: /* @__PURE__ */ o(
                   $,
                   {
                     sx: ({ vars: F }) => ({
@@ -66,20 +76,20 @@ const E = y(
               ]
             }
           ),
-          p && /* @__PURE__ */ e(u, { ...r.sublabel, children: p }),
-          /* @__PURE__ */ e(
+          l && /* @__PURE__ */ o(u, { ...r.sublabel, children: l }),
+          /* @__PURE__ */ o(
             D,
             {
               ref: g,
-              disabled: a,
-              name: o,
-              error: m,
+              disabled: m,
+              name: e,
+              error: a,
               size: x,
               slotProps: {
                 field: {
-                  id: o,
+                  id: e,
                   "aria-describedby": c,
-                  ...l && { sx: { width: "100%" } }
+                  ...p && { sx: { width: "100%" } }
                 },
                 popper: {
                   "aria-label": `Date picker${typeof t == "string" && ` for ${t}`}`
@@ -89,7 +99,7 @@ const E = y(
               ...I
             }
           ),
-          i && /* @__PURE__ */ e(v, { id: c, ...r.helperText, children: i })
+          i && /* @__PURE__ */ o(v, { id: c, ...r.helperText, children: i })
         ]
       }
     );

package/dist/components/DialogClose/DialogClose.js

@@ -1,12 +1,22 @@
 import { jsx as r } from "react/jsx-runtime";
+import "../../icons/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { C as i } from "../../Close-BLiw2OtB.js";
 import { I as m } from "../../IconButton-Bxv4sRVK.js";
-const u = ({ sx: o, ...t }) => /* @__PURE__ */ r(
+const x = ({ sx: o, ...t }) => /* @__PURE__ */ r(
   m,
   {
     sx: [
@@ -22,5 +32,5 @@ const u = ({ sx: o, ...t }) => /* @__PURE__ */ r(
   }
 );
 export {
-  u as DialogClose
+  x as DialogClose
 };

package/dist/components/InputControl/InputControl.js

@@ -3,10 +3,20 @@ import { forwardRef as F } from "react";
 import { FormSublabel as y } from "../FormSublabel/FormSublabel.js";
 import { Input as g } from "../Input/Input.js";
 import { useId as w } from "../../hooks/useId.js";
+import "../../icons/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { I as B } from "../../Info-BMNIqxBf.js";
 import { F as C } from "../../FormControl-kcKovRdJ.js";
@@ -16,10 +26,10 @@ import { T } from "../../Tooltip-CYXo_y5R.js";
 import { F as k } from "../../FormHelperText-BO-3JFoa.js";
 const v = F(
   ({
-    disabled: a,
-    error: n,
-    fullWidth: p,
-    helperText: m,
+    disabled: p,
+    error: a,
+    fullWidth: n,
+    helperText: t,
     id: f,
     label: s,
     required: b,
@@ -29,13 +39,13 @@ const v = F(
     tooltip: l,
     ...i
   }, h) => {
-    const x = w("input"), t = f || x, e = m ? `${t}-helper` : void 0;
+    const x = w("input"), e = f || x, m = t ? `${e}-helper` : void 0;
     return /* @__PURE__ */ c(
       C,
       {
-        disabled: a,
-        error: n,
-        fullWidth: p,
+        disabled: p,
+        error: a,
+        fullWidth: n,
         sx: I,
         ...o?.root,
         children: [
@@ -51,7 +61,7 @@ const v = F(
                 /* @__PURE__ */ r(
                   j,
                   {
-                    htmlFor: t,
+                    htmlFor: e,
                     required: b,
                     ...o?.label,
                     children: s
@@ -76,16 +86,16 @@ const v = F(
             g,
             {
               ref: h,
-              disabled: a,
-              error: n,
-              fullWidth: p,
-              id: t,
-              "aria-describedby": e ? i["aria-describedby"] ? `${i["aria-describedby"]} ${e}` : e : i["aria-describedby"],
+              disabled: p,
+              error: a,
+              fullWidth: n,
+              id: e,
+              "aria-describedby": m ? i["aria-describedby"] ? `${i["aria-describedby"]} ${m}` : m : i["aria-describedby"],
               slotProps: o?.input,
               ...i
             }
           ),
-          m && /* @__PURE__ */ r(k, { id: e, ...o?.helperText, children: m })
+          t && /* @__PURE__ */ r(k, { id: m, ...o?.helperText, children: t })
         ]
       }
     );

package/dist/components/NumberInputControl/NumberInputControl.js

@@ -3,10 +3,20 @@ 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/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { I as w } from "../../Info-BMNIqxBf.js";
 import { F as B } from "../../FormControl-kcKovRdJ.js";
@@ -16,27 +26,27 @@ import { T as j } from "../../Tooltip-CYXo_y5R.js";
 import { F as T } from "../../FormHelperText-BO-3JFoa.js";
 const k = F(
   ({
-    disabled: n,
-    fullWidth: a,
-    helperText: i,
+    disabled: p,
+    fullWidth: n,
+    helperText: t,
     id: b,
     label: f,
     required: s,
-    slotProps: e,
-    sublabel: d,
+    slotProps: m,
+    sublabel: a,
     sx: u,
-    tooltip: p,
+    tooltip: d,
     ...o
   }, I) => {
-    const h = N("number-input"), t = b || h, m = i ? `${t}-helper` : void 0, c = o.error;
+    const h = N("number-input"), e = b || h, i = t ? `${e}-helper` : void 0, c = o.error;
     return /* @__PURE__ */ l(
       B,
       {
-        disabled: n,
+        disabled: p,
         error: c,
-        fullWidth: a,
+        fullWidth: n,
         sx: u,
-        ...e?.root,
+        ...m?.root,
         children: [
           /* @__PURE__ */ l(
             C,
@@ -50,13 +60,13 @@ const k = F(
                 /* @__PURE__ */ r(
                   $,
                   {
-                    htmlFor: t,
+                    htmlFor: e,
                     required: s,
-                    ...e?.label,
+                    ...m?.label,
                     children: f
                   }
                 ),
-                p && /* @__PURE__ */ r(j, { title: p, arrow: !0, children: /* @__PURE__ */ r(
+                d && /* @__PURE__ */ r(j, { title: d, arrow: !0, children: /* @__PURE__ */ r(
                   w,
                   {
                     sx: ({ vars: x }) => ({
@@ -70,20 +80,20 @@ const k = F(
               ]
             }
           ),
-          d && /* @__PURE__ */ r(y, { ...e?.sublabel, children: d }),
+          a && /* @__PURE__ */ r(y, { ...m?.sublabel, children: a }),
           /* @__PURE__ */ r(
             g,
             {
               ref: I,
-              disabled: n,
-              id: t,
+              disabled: p,
+              id: e,
               error: c,
-              fullWidth: a,
-              "aria-describedby": m ? o["aria-describedby"] ? `${o["aria-describedby"]} ${m}` : m : o["aria-describedby"],
+              fullWidth: n,
+              "aria-describedby": i ? o["aria-describedby"] ? `${o["aria-describedby"]} ${i}` : i : o["aria-describedby"],
               ...o
             }
           ),
-          i && /* @__PURE__ */ r(T, { id: m, ...e?.helperText, children: i })
+          t && /* @__PURE__ */ r(T, { id: i, ...m?.helperText, children: t })
         ]
       }
     );

package/dist/components/SelectControl/SelectControl.js

@@ -1,12 +1,22 @@
-import { jsxs as p, jsx as r } from "react/jsx-runtime";
+import { jsxs as n, jsx as r } from "react/jsx-runtime";
 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/CalloutAnnotationIcon.js";
 import "../../icons/ClearstoryIcon.js";
+import "../../icons/CloudAnnotationIcon.js";
+import "../../icons/EllipseAnnotationIcon.js";
+import "../../icons/FitToPageIcon.js";
+import "../../icons/FitToWidthIcon.js";
+import "../../icons/FreeTextAnnotationIcon.js";
+import "../../icons/HighlightAnnotationIcon.js";
 import "../../icons/InternalOnlyIcon.js";
 import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
+import "../../icons/NoteAnnotationIcon.js";
+import "../../icons/PenAnnotationIcon.js";
+import "../../icons/RectangleAnnotationIcon.js";
 import "../../icons/SparkleIcon.js";
 import { I as u } from "../../Info-BMNIqxBf.js";
 import { F as w } from "../../FormControl-kcKovRdJ.js";
@@ -18,28 +28,28 @@ const k = y(
   ({
     disabled: a,
     error: l,
-    fullWidth: d,
+    fullWidth: p,
     helperText: t,
     id: s,
     label: f,
     required: b,
-    slotProps: e,
-    sublabel: c,
+    slotProps: o,
+    sublabel: d,
     sx: h,
-    tooltip: n,
+    tooltip: c,
     ...i
   }, x) => {
-    const I = S("select"), o = s || I, m = t ? `${o}-helper` : void 0;
-    return /* @__PURE__ */ p(
+    const I = S("select"), e = s || I, m = t ? `${e}-helper` : void 0;
+    return /* @__PURE__ */ n(
       w,
       {
         disabled: a,
         error: l,
-        fullWidth: d,
+        fullWidth: p,
         sx: h,
-        ...e?.root,
+        ...o?.root,
         children: [
-          /* @__PURE__ */ p(
+          /* @__PURE__ */ n(
             B,
             {
               sx: {
@@ -51,14 +61,14 @@ const k = y(
                 /* @__PURE__ */ r(
                   C,
                   {
-                    id: `${o}-label`,
-                    htmlFor: o,
+                    id: `${e}-label`,
+                    htmlFor: e,
                     required: b,
-                    ...e?.label,
+                    ...o?.label,
                     children: f
                   }
                 ),
-                n && /* @__PURE__ */ r(j, { title: n, arrow: !0, children: /* @__PURE__ */ r(
+                c && /* @__PURE__ */ r(j, { title: c, arrow: !0, children: /* @__PURE__ */ r(
                   u,
                   {
                     sx: ({ vars: F }) => ({
@@ -72,22 +82,22 @@ const k = y(
               ]
             }
           ),
-          c && /* @__PURE__ */ r(g, { ...e?.sublabel, children: c }),
+          d && /* @__PURE__ */ r(g, { ...o?.sublabel, children: d }),
           /* @__PURE__ */ r(
             $,
             {
               ref: x,
               disabled: a,
               error: l,
-              fullWidth: d,
-              labelId: `${o}-label`,
-              id: o,
+              fullWidth: p,
+              labelId: `${e}-label`,
+              id: e,
               "aria-describedby": m ? i["aria-describedby"] ? `${i["aria-describedby"]} ${m}` : m : i["aria-describedby"],
-              slotProps: e?.select,
+              slotProps: o?.select,
               ...i
             }
           ),
-          t && /* @__PURE__ */ r(T, { id: m, ...e?.helperText, children: t })
+          t && /* @__PURE__ */ r(T, { id: m, ...o?.helperText, children: t })
         ]
       }
     );