@clearstory/drywall-react 0.11.0 → 0.12.1

package/dist/{memoTheme-CAyAl_br.js → memoTheme-8-5VfoOA.js}

@@ -1,4 +1,4 @@
-import { p as s } from "./styled-Dc7N_6Ot.js";
+import { p as s } from "./styled-CQZHSS-5.js";
 const l = {
   theme: void 0
 };

package/dist/{refType-BThyJhbZ.js → refType-D0Xe0JaC.js}

@@ -1,4 +1,4 @@
-import { P as e } from "./createTheme-ClKgUYqI.js";
+import { P as e } from "./createTheme-BX9lNtXz.js";
 const p = e.oneOfType([e.func, e.object]);
 export {
   p as r

package/dist/{stackClasses-ar_uEgY1.js → stackClasses-CTQIXOMm.js}

@@ -1,19 +1,20 @@
-import { P as e, n as O, o as m, p as S, q as V, s as D, c as N, m as E, t as b } from "./createTheme-ClKgUYqI.js";
-import { s as F } from "./styled-Dc7N_6Ot.js";
+import { P as e, n as O, o as m, p as S, q as V, s as D, c as N, m as E, t as b } from "./createTheme-BX9lNtXz.js";
+import { s as F } from "./styled-CQZHSS-5.js";
 import * as f from "react";
 import { c as M } from "./clsx-OuTLNxxd.js";
 import { jsx as R } from "react/jsx-runtime";
-import { s as B, u as w } from "./useThemeProps-BgF3CPen.js";
-import { e as G } from "./extendSxProp-Dm0QGK7k.js";
+import { s as B } from "./styled--QvesojM.js";
+import { e as w } from "./extendSxProp-DXn0AsAr.js";
+import { u as G } from "./useThemeProps-BXxu8030.js";
 import { c as U } from "./composeClasses-2Ou-RZJr.js";
-import { u as $ } from "./DefaultPropsProvider-Bz3RqgcW.js";
-import { g as A } from "./generateUtilityClasses-rljrgfNm.js";
+import { u as $ } from "./DefaultPropsProvider-DF9yx5s6.js";
+import { g as A } from "./generateUtilityClasses-B6l3Ncbw.js";
 const _ = E(), q = B("div", {
   name: "MuiStack",
   slot: "Root"
 });
 function I(o) {
-  return w({
+  return G({
     props: o,
     name: "MuiStack",
     defaultTheme: _
@@ -85,7 +86,7 @@ function J(o = {}) {
   } = o, i = () => U({
     root: ["root"]
   }, (r) => N(a, r), {}), s = t(H), l = /* @__PURE__ */ f.forwardRef(function(r, n) {
-    const p = c(r), y = G(p), {
+    const p = c(r), y = w(p), {
       component: u = "div",
       direction: T = "column",
       spacing: k = 0,
@@ -170,8 +171,8 @@ process.env.NODE_ENV !== "production" && (K.propTypes = {
    */
   useFlexGap: e.bool
 });
-const ne = A("MuiStack", ["root"]);
+const te = A("MuiStack", ["root"]);
 export {
   K as S,
-  ne as s
+  te as s
 };

package/dist/styled--QvesojM.js

@@ -0,0 +1,5 @@
+import { c as t } from "./styled-CQZHSS-5.js";
+const s = t();
+export {
+  s
+};

package/dist/{styled-Dc7N_6Ot.js → styled-CQZHSS-5.js}

@@ -1,6 +1,6 @@
-import { d as N } from "./defaultTheme-BCpI3G0-.js";
-import { i as S, f as q, s as G, T as J } from "./index-BlCNRXSk.js";
-import { r as L, m as Q, u as b, i as U, j as X } from "./createTheme-ClKgUYqI.js";
+import { d as N } from "./defaultTheme-B0P968dJ.js";
+import { i as S, f as q, s as G, T as J } from "./index-DNMo5Nra.js";
+import { r as E, m as Q, u as L, i as U, j as X } from "./createTheme-BX9lNtXz.js";
 function k(e, n = "") {
   return e.displayName || e.name || n;
 }
@@ -16,9 +16,9 @@ function Y(e) {
       return k(e, "Component");
     if (typeof e == "object")
       switch (e.$$typeof) {
-        case L.ForwardRef:
+        case E.ForwardRef:
           return V(e, e.render, "ForwardRef");
-        case L.Memo:
+        case E.Memo:
           return V(e, e.type, "memo");
         default:
           return;
@@ -104,26 +104,26 @@ function ne(e = {}) {
     te(i, n, t);
   }
   return (i, I = {}) => {
-    q(i, (u) => u.filter((f) => f !== b));
+    q(i, (u) => u.filter((f) => f !== L));
     const {
       name: y,
-      slot: a,
+      slot: l,
       skipVariantsResolver: A,
       skipSx: M,
       // TODO v6: remove `lowercaseFirstLetter()` in the next major release
       // For more details: https://github.com/mui/material-ui/pull/37908
-      overridesResolver: O = ee(D(a)),
+      overridesResolver: O = ee(D(l)),
       ...H
-    } = I, T = y && y.startsWith("Mui") || a ? "components" : "custom", W = A !== void 0 ? A : (
+    } = I, T = y && y.startsWith("Mui") || l ? "components" : "custom", W = A !== void 0 ? A : (
       // TODO v6: remove `Root` in the next major release
       // For more details: https://github.com/mui/material-ui/pull/37908
-      a && a !== "Root" && a !== "root" || !1
+      l && l !== "Root" && l !== "root" || !1
     ), C = M || !1;
     let v = $;
-    a === "Root" || a === "root" ? v = r : a ? v = s : ie(i) && (v = void 0);
+    l === "Root" || l === "root" ? v = r : l ? v = s : ie(i) && (v = void 0);
     const x = G(i, {
       shouldForwardProp: v,
-      label: se(y, a),
+      label: se(y, l),
       ...H
     }), B = (u) => {
       if (u.__emotion_real === u)
@@ -141,24 +141,24 @@ function ne(e = {}) {
       return u;
     }, g = (...u) => {
       const f = [], h = u.map(B), d = [];
-      if (f.push(w), y && O && d.push(function(l) {
-        const c = l.theme.components?.[y]?.styleOverrides;
+      if (f.push(w), y && O && d.push(function(a) {
+        const c = a.theme.components?.[y]?.styleOverrides;
         if (!c)
           return null;
         const _ = {};
-        for (const E in c)
-          _[E] = P(l, c[E], l.theme.modularCssLayers ? "theme" : void 0);
-        return O(l, _);
-      }), y && !W && d.push(function(l) {
-        const c = l.theme?.components?.[y]?.variants;
-        return c ? j(l, c, [], l.theme.modularCssLayers ? "theme" : void 0) : null;
-      }), C || d.push(b), Array.isArray(h[0])) {
-        const p = h.shift(), l = new Array(f.length).fill(""), F = new Array(d.length).fill("");
+        for (const b in c)
+          _[b] = P(a, c[b], a.theme.modularCssLayers ? "theme" : void 0);
+        return O(a, _);
+      }), y && !W && d.push(function(a) {
+        const c = a.theme?.components?.[y]?.variants;
+        return c ? j(a, c, [], a.theme.modularCssLayers ? "theme" : void 0) : null;
+      }), C || d.push(L), Array.isArray(h[0])) {
+        const p = h.shift(), a = new Array(f.length).fill(""), F = new Array(d.length).fill("");
         let c;
-        c = [...l, ...p, ...F], c.raw = [...l, ...p.raw, ...F], f.unshift(c);
+        c = [...a, ...p, ...F], c.raw = [...a, ...p.raw, ...F], f.unshift(c);
       }
       const K = [...f, ...h, ...d], R = x(...K);
-      return i.muiName && (R.muiName = i.muiName), process.env.NODE_ENV !== "production" && (R.displayName = re(y, a, i)), R;
+      return i.muiName && (R.muiName = i.muiName), process.env.NODE_ENV !== "production" && (R.displayName = re(y, l, i)), R;
     };
     return x.withConfig && (g.withConfig = x.withConfig), g;
   };
@@ -194,6 +194,7 @@ const fe = (e) => ue(e) && e !== "classes", de = ne({
 });
 export {
   ue as a,
+  $ as b,
   ne as c,
   Z as p,
   fe as r,

package/dist/theme/index.js

@@ -1,17 +1,15 @@
-import { P as l, C as E } from "../createTheme-ClKgUYqI.js";
-import { a as F, d as G, e as H, g as K, b as W, l as B } from "../createTheme-ClKgUYqI.js";
-import { s as X } from "../styled-Dc7N_6Ot.js";
-import * as m from "react";
-import { C as S, e as b, S as M, T as C } from "../index-BlCNRXSk.js";
-import { jsx as w } from "react/jsx-runtime";
-import { u as q } from "../useTheme-CtzJwniR.js";
-import { a as x } from "../useTheme-B3mEBCfZ.js";
-import { g as P } from "../getThemeProps-CCAJ-g7Y.js";
-import { u as Q } from "../useEnhancedEffect-CJGo-L3B.js";
-import { u as te } from "../ThemeProviderWithVars-BAdUW-CW.js";
-const h = /* @__PURE__ */ new Map(), T = (n, r) => {
-  const e = b(n);
-  return e.sheet = new r({
+import { P as c, C as u } from "../createTheme-BX9lNtXz.js";
+import { a as v, d as M, e as E, g as j, b as $, l as w } from "../createTheme-BX9lNtXz.js";
+import { s as T } from "../styled-CQZHSS-5.js";
+import * as h from "react";
+import { C as m, c as d, S as l } from "../index-DNMo5Nra.js";
+import { jsx as y } from "react/jsx-runtime";
+import { u as A } from "../useTheme-CdIZVlS8.js";
+import { u as L } from "../index-DC9AZTxr.js";
+import { u as z } from "../ThemeProviderWithVars-Ci35_8LL.js";
+const p = /* @__PURE__ */ new Map(), f = (t, o) => {
+  const e = d(t);
+  return e.sheet = new o({
     key: e.key,
     nonce: e.sheet.nonce,
     container: e.sheet.container,
@@ -20,148 +18,77 @@ const h = /* @__PURE__ */ new Map(), T = (n, r) => {
     insertionPoint: e.sheet.insertionPoint
   }), e;
 };
-let c;
-if (typeof document == "object" && (c = document.querySelector('[name="emotion-insertion-point"]'), !c)) {
-  c = document.createElement("meta"), c.setAttribute("name", "emotion-insertion-point"), c.setAttribute("content", "");
-  const n = document.querySelector("head");
-  n && n.prepend(c);
+let r;
+if (typeof document == "object" && (r = document.querySelector('[name="emotion-insertion-point"]'), !r)) {
+  r = document.createElement("meta"), r.setAttribute("name", "emotion-insertion-point"), r.setAttribute("content", "");
+  const t = document.querySelector("head");
+  t && t.prepend(r);
 }
-function k(n, r) {
-  if (n || r) {
-    class e extends M {
-      insert(t, i) {
-        return this.key && this.key.endsWith("global") && (this.before = c), super.insert(t, i);
+function C(t, o) {
+  if (t || o) {
+    class e extends l {
+      insert(n, a) {
+        return this.key && this.key.endsWith("global") && (this.before = r), super.insert(n, a);
       }
     }
-    const o = T({
+    const s = f({
       key: "css",
-      insertionPoint: n ? c : void 0
+      insertionPoint: t ? r : void 0
     }, e);
-    if (r) {
-      const s = o.insert;
-      o.insert = (...t) => (t[1].styles.match(/^@layer\s+[^{]*$/) || (t[1].styles = `@layer mui {${t[1].styles}}`), s(...t));
+    if (o) {
+      const i = s.insert;
+      s.insert = (...n) => (n[1].styles.match(/^@layer\s+[^{]*$/) || (n[1].styles = `@layer mui {${n[1].styles}}`), i(...n));
     }
-    return o;
+    return s;
   }
 }
-function L(n) {
+function b(t) {
   const {
-    injectFirst: r,
+    injectFirst: o,
     enableCssLayer: e,
-    children: o
-  } = n, s = m.useMemo(() => {
-    const t = `${r}-${e}`;
-    if (typeof document == "object" && h.has(t))
-      return h.get(t);
-    const i = k(r, e);
-    return h.set(t, i), i;
-  }, [r, e]);
-  return s ? /* @__PURE__ */ w(S, {
-    value: s,
-    children: o
-  }) : o;
+    children: s
+  } = t, i = h.useMemo(() => {
+    const n = `${o}-${e}`;
+    if (typeof document == "object" && p.has(n))
+      return p.get(n);
+    const a = C(o, e);
+    return p.set(n, a), a;
+  }, [o, e]);
+  return i ? /* @__PURE__ */ y(m, {
+    value: i,
+    children: s
+  }) : s;
 }
-process.env.NODE_ENV !== "production" && (L.propTypes = {
+process.env.NODE_ENV !== "production" && (b.propTypes = {
   /**
    * Your component tree.
    */
-  children: l.node,
+  children: c.node,
   /**
    * If `true`, the styles are wrapped in `@layer mui`.
    * Learn more about [Cascade layers](https://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Styling_basics/Cascade_layers).
    */
-  enableCssLayer: l.bool,
+  enableCssLayer: c.bool,
   /**
    * By default, the styles are injected last in the <head> element of the page.
    * As a result, they gain more specificity than any other style sheet.
    * If you want to override MUI's styles, set this prop.
    */
-  injectFirst: l.bool
+  injectFirst: c.bool
 });
-function N(n, r, e, o, s) {
-  const [t, i] = m.useState(() => s && e ? e(n).matches : o ? o(n).matches : r);
-  return Q(() => {
-    if (!e)
-      return;
-    const u = e(n), d = () => {
-      i(u.matches);
-    };
-    return d(), u.addEventListener("change", d), () => {
-      u.removeEventListener("change", d);
-    };
-  }, [n, e]), t;
-}
-const D = {
-  ...m
-}, v = D.useSyncExternalStore;
-function j(n, r, e, o, s) {
-  const t = m.useCallback(() => r, [r]), i = m.useMemo(() => {
-    if (s && e)
-      return () => e(n).matches;
-    if (o !== null) {
-      const {
-        matches: p
-      } = o(n);
-      return () => p;
-    }
-    return t;
-  }, [t, n, o, s, e]), [u, d] = m.useMemo(() => {
-    if (e === null)
-      return [t, () => () => {
-      }];
-    const p = e(n);
-    return [() => p.matches, (a) => (p.addEventListener("change", a), () => {
-      p.removeEventListener("change", a);
-    })];
-  }, [t, e, n]);
-  return v(d, u, i);
-}
-function g(n = {}) {
-  const {
-    themeId: r
-  } = n;
-  return function(o, s = {}) {
-    let t = x();
-    t && r && (t = t[r] || t);
-    const i = typeof window < "u" && typeof window.matchMedia < "u", {
-      defaultMatches: u = !1,
-      matchMedia: d = i ? window.matchMedia : null,
-      ssrMatchMedia: f = null,
-      noSsr: p = !1
-    } = P({
-      name: "MuiUseMediaQuery",
-      props: s,
-      theme: t
-    });
-    process.env.NODE_ENV !== "production" && typeof o == "function" && t === null && console.error(["MUI: The `query` argument provided is invalid.", "You are providing a function without a theme in the context.", "One of the parent elements needs to use a ThemeProvider."].join(`
-`));
-    let a = typeof o == "function" ? o(t) : o;
-    a = a.replace(/^@media( ?)/m, ""), a.includes("print") && console.warn(["MUI: You have provided a `print` query to the `useMediaQuery` hook.", "Using the print media query to modify print styles can lead to unexpected results.", "Consider using the `displayPrint` field in the `sx` prop instead.", "More information about `displayPrint` on our docs: https://mui.com/system/display/#display-in-print."].join(`
-`));
-    const y = (v !== void 0 ? j : N)(a, u, d, f, p);
-    return process.env.NODE_ENV !== "production" && m.useDebugValue({
-      query: a,
-      match: y
-    }), y;
-  };
-}
-g();
-const A = g({
-  themeId: C
-});
-E.configure(
-  (n) => n.replace("Mui", "Drywall")
+u.configure(
+  (t) => t.replace("Mui", "Drywall")
 );
 export {
-  L as StyledEngineProvider,
-  F as alpha,
-  G as darken,
-  H as emphasize,
-  K as getContrastRatio,
-  W as getLuminance,
-  B as lighten,
-  X as styled,
-  te as useColorScheme,
-  A as useMediaQuery,
-  q as useTheme
+  b as StyledEngineProvider,
+  v as alpha,
+  M as darken,
+  E as emphasize,
+  j as getContrastRatio,
+  $ as getLuminance,
+  w as lighten,
+  T as styled,
+  z as useColorScheme,
+  L as useMediaQuery,
+  A as useTheme
 };

package/dist/theme/internal.js

@@ -1,7 +1,7 @@
 import { colorSchemes as o } from "./colorSchemes.js";
 import { components as r } from "./components.js";
 import { typography as e } from "./typography.js";
-import { f as m } from "../createTheme-ClKgUYqI.js";
+import { f as m } from "../createTheme-BX9lNtXz.js";
 const l = m({
   colorSchemes: o,
   components: r,

package/dist/{useTheme-CtzJwniR.js → useTheme-CdIZVlS8.js}

@@ -1,7 +1,7 @@
 import * as o from "react";
-import { d as r } from "./defaultTheme-BCpI3G0-.js";
-import { T as m } from "./index-BlCNRXSk.js";
-import { u as t } from "./useTheme-B3mEBCfZ.js";
+import { d as r } from "./defaultTheme-B0P968dJ.js";
+import { T as m } from "./index-DNMo5Nra.js";
+import { u as t } from "./useTheme-v44oTsqt.js";
 function f() {
   const e = t(r);
   return process.env.NODE_ENV !== "production" && o.useDebugValue(e), e[m] || e;

package/dist/{useTheme-B3mEBCfZ.js → useTheme-v44oTsqt.js}

@@ -1,6 +1,6 @@
-import { m as n } from "./createTheme-ClKgUYqI.js";
+import { m as n } from "./createTheme-BX9lNtXz.js";
 import * as m from "react";
-import { a as o } from "./index-BlCNRXSk.js";
+import { a as o } from "./index-DNMo5Nra.js";
 function r(e) {
   return Object.keys(e).length === 0;
 }

package/dist/useThemeProps-BXxu8030.js

@@ -0,0 +1,18 @@
+import { g as t } from "./getThemeProps-eyNYXfWA.js";
+import { u } from "./useTheme-v44oTsqt.js";
+function i({
+  props: o,
+  name: m,
+  defaultTheme: s,
+  themeId: r
+}) {
+  let e = u(s);
+  return r && (e = e[r] || e), t({
+    theme: e,
+    name: m,
+    props: o
+  });
+}
+export {
+  i as u
+};

package/dist/{utils-CSpgf_MW.js → utils-CYwnlZ9i.js}

@@ -1,5 +1,5 @@
 import { _ as D, a as C, T as S } from "./TransitionGroupContext-DbLioz_6.js";
-import { P as n } from "./createTheme-ClKgUYqI.js";
+import { P as n } from "./createTheme-BX9lNtXz.js";
 import v from "react";
 import b from "react-dom";
 const N = {
@@ -9,8 +9,7 @@ var R = process.env.NODE_ENV !== "production" ? n.oneOfType([n.number, n.shape({
   enter: n.number,
   exit: n.number,
   appear: n.number
-}).isRequired]) : null;
-process.env.NODE_ENV !== "production" && n.oneOfType([n.string, n.shape({
+}).isRequired]) : null, I = process.env.NODE_ENV !== "production" ? n.oneOfType([n.string, n.shape({
   enter: n.string,
   exit: n.string,
   active: n.string
@@ -21,8 +20,7 @@ process.env.NODE_ENV !== "production" && n.oneOfType([n.string, n.shape({
   exit: n.string,
   exitDone: n.string,
   exitActive: n.string
-})]);
-var y = function(a) {
+})]) : null, y = function(a) {
   return a.scrollTop;
 }, x = "unmounted", f = "exited", c = "entering", h = "entered", g = "exiting", l = /* @__PURE__ */ function(u) {
   D(a, u);
@@ -343,8 +341,8 @@ l.EXITED = f;
 l.ENTERING = c;
 l.ENTERED = h;
 l.EXITING = g;
-const I = (u) => u.scrollTop;
-function P(u, a) {
+const P = (u) => u.scrollTop;
+function U(u, a) {
   const {
     timeout: o,
     easing: r,
@@ -358,6 +356,8 @@ function P(u, a) {
 }
 export {
   l as T,
-  P as g,
-  I as r
+  I as c,
+  y as f,
+  U as g,
+  P as r
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clearstory/drywall-react",
-  "version": "0.11.0",
+  "version": "0.12.1",
   "license": "UNLICENSED",
   "description": "a Clearstory software design system",
   "type": "module",
@@ -16,6 +16,7 @@
     "node": ">=22"
   },
   "peerDependencies": {
+    "dayjs": "^1.0.0",
     "@emotion/react": "^11.0.0",
     "@emotion/styled": "^11.0.0",
     "@fontsource-variable/roboto": "^5.0.0",
@@ -24,10 +25,12 @@
     "react-dom": "^17.0.0 || ^18.0.0 || ^19.0.0"
   },
   "dependencies": {
-    "@mui/icons-material": "^7.3.1",
-    "@mui/material": "^7.3.1",
-    "@mui/system": "^7.3.1",
-    "react-hot-toast": "^2.6.0"
+    "@mui/icons-material": "7.3.1",
+    "@mui/material": "7.3.1",
+    "@mui/system": "7.3.1",
+    "@mui/utils": "7.3.1",
+    "@mui/x-date-pickers": "8.10.2",
+    "react-hot-toast": "2.6.0"
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^4.0.1",
@@ -43,6 +46,7 @@
     "@vitejs/plugin-react": "^4.5.2",
     "@vitest/browser": "^3.2.4",
     "@vitest/coverage-v8": "^3.2.4",
+    "dayjs": "^1.11.13",
     "eslint": "^9.29.0",
     "eslint-config-prettier": "^10.1.5",
     "eslint-plugin-react-hooks": "^5.2.0",