@clearstory/drywall-react 0.12.1 → 1.0.0

package/dist/{SelectControl-BRTxQ0py.js → SelectControl-Bpf6gSv7.js}

@@ -7,7 +7,7 @@ import "./icons/MoreCircleOutlineIcon.js";
 import { I as $ } from "./Info-0laCo4Av.js";
 import "./theme/index.js";
 import { A as M } from "./Autocomplete-C5Xb0wsA.js";
-import { D as O } from "./Datepicker-hYnbz9fI.js";
+import { D as O } from "./Datepicker-B7hXC6Oa.js";
 import { Input as Q } from "./components/Input/Input.js";
 import { Select as U } from "./components/Select/Select.js";
 import "./theme/internal.js";

package/dist/components/AccordionSummary/AccordionSummary.theme.js

@@ -1,10 +1,10 @@
-const a = {
+const t = {
   styleOverrides: {
     root: ({ theme: o }) => ({
       "&:focus-visible": {
-        outline: "2px solid",
         outlineColor: o.vars?.palette.primary.light,
-        outlineOffset: "2px"
+        outlineStyle: "solid",
+        outlineWidth: "2px"
       },
       "&:active": {
         backgroundColor: `oklch(from ${o.vars?.palette.primary.main} calc(l + 0.1) c h / calc(${o.vars?.palette.action.activatedOpacity} * 0.8))`
@@ -13,5 +13,5 @@ const a = {
   }
 };
 export {
-  a as MuiAccordionSummary
+  t as MuiAccordionSummary
 };

package/dist/components/AutocompleteControl/AutocompleteControl.js

@@ -7,8 +7,8 @@ import "../../icons/MoreCircleOutlineIcon.js";
 import "../../Info-0laCo4Av.js";
 import "../../theme/index.js";
 import "../../Autocomplete-C5Xb0wsA.js";
-import { A as q } from "../../SelectControl-BRTxQ0py.js";
-import "../../Datepicker-hYnbz9fI.js";
+import { A as q } from "../../SelectControl-Bpf6gSv7.js";
+import "../../Datepicker-B7hXC6Oa.js";
 import "../Input/Input.js";
 import "../Select/Select.js";
 import "../../theme/internal.js";

package/dist/components/AutocompleteControl/index.js

@@ -1,4 +1,4 @@
-import { A as e } from "../../SelectControl-BRTxQ0py.js";
+import { A as e } from "../../SelectControl-Bpf6gSv7.js";
 export {
   e as AutocompleteControl
 };

package/dist/components/Button/Button.theme.js

@@ -14,9 +14,9 @@ const n = {
         ].join(" "),
         "&:focus-visible": {
           boxShadow: "none !important",
-          outline: "2px solid",
           outlineColor: a,
-          outlineOffset: "2px"
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         },
         "&:active": {
           backgroundColor: `oklch(from ${o.vars?.palette[t]?.main} calc(l + 0.1) c h / calc(${o.vars?.palette.action.activatedOpacity} * 0.8))`

package/dist/components/Checkbox/Checkbox.theme.js

@@ -1,22 +1,22 @@
-const r = {
+const s = {
   defaultProps: {
     disableRipple: !0,
     size: "small"
   },
   styleOverrides: {
-    root: ({ ownerState: o, theme: e }) => {
-      const l = o.color !== "default" && o.color || "secondary", s = e.vars?.palette[l]?.light;
+    root: ({ ownerState: o, theme: l }) => {
+      const e = o.color !== "default" && o.color || "secondary", r = l.vars?.palette[e]?.light;
       return {
         "&:focus-within svg": {
-          borderRadius: e.shape.borderRadius,
-          outline: "2px solid",
-          outlineColor: s,
-          outlineOffset: "2px"
+          borderRadius: l.shape.borderRadius,
+          outlineColor: r,
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         }
       };
     }
   }
 };
 export {
-  r as MuiCheckbox
+  s as MuiCheckbox
 };

package/dist/components/Chip/Chip.theme.js

@@ -7,9 +7,9 @@ const r = {
       const t = l.color !== "default" && l.color || "secondary";
       return {
         "&:focus-visible": {
-          outline: "2px solid",
           outlineColor: o.vars?.palette[t]?.light,
-          outlineOffset: "2px"
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         },
         "&:active": {
           backgroundColor: `oklch(from ${o.vars?.palette[t]?.main} calc(l + 0.1) c h / calc(${o.vars?.palette.action.activatedOpacity} * 0.8))`

package/dist/components/Datepicker/Datepicker.d.ts

@@ -3,6 +3,7 @@ import { ForwardRefExoticComponent, RefAttributes } from 'react';
 export interface DatepickerProps extends DatePickerProps {
     clearable?: boolean;
     error?: boolean;
+    color?: "primary" | "secondary" | "error" | "info" | "success" | "warning";
 }
 export declare const Datepicker: ForwardRefExoticComponent<DatepickerProps & RefAttributes<HTMLDivElement>>;
 export default Datepicker;

package/dist/components/Datepicker/Datepicker.js

@@ -1,6 +1,6 @@
 import "react/jsx-runtime";
 import "react";
-import { D as e, D } from "../../Datepicker-hYnbz9fI.js";
+import { D as e, D } from "../../Datepicker-B7hXC6Oa.js";
 import "../../styled-CQZHSS-5.js";
 import "../../useForkRef-9kN4DArm.js";
 import "../../IconButton-CI-kr5x1.js";

package/dist/components/Datepicker/index.js

@@ -1,5 +1,5 @@
-import { a as r, b as s, D as o, L as t, M as i, d as c, D as d } from "../../Datepicker-hYnbz9fI.js";
-import { A as k } from "../../AdapterDayjs-CnU1cne-.js";
+import { a as r, b as s, D as o, L as t, M as i, d as c, D as d } from "../../Datepicker-B7hXC6Oa.js";
+import { A as k } from "../../AdapterDayjs-CZ0W-UZH.js";
 export {
   k as AdapterDayjs,
   r as DatePicker,

package/dist/components/DatepickerControl/DatepickerControl.js

@@ -7,8 +7,8 @@ import "../../icons/MoreCircleOutlineIcon.js";
 import "../../Info-0laCo4Av.js";
 import "../../theme/index.js";
 import "../../Autocomplete-C5Xb0wsA.js";
-import { D as u } from "../../SelectControl-BRTxQ0py.js";
-import "../../Datepicker-hYnbz9fI.js";
+import { D as u } from "../../SelectControl-Bpf6gSv7.js";
+import "../../Datepicker-B7hXC6Oa.js";
 import "../Input/Input.js";
 import "../Select/Select.js";
 import "../../theme/internal.js";

package/dist/components/DatepickerControl/index.js

@@ -1,4 +1,4 @@
-import { D as e } from "../../SelectControl-BRTxQ0py.js";
+import { D as e } from "../../SelectControl-Bpf6gSv7.js";
 export {
   e as DatepickerControl
 };

package/dist/components/FormSublabel/FormSublabel.js

@@ -4,8 +4,8 @@ import "../../icons/MoneyBucketIcon.js";
 import "../../icons/MoreCircleOutlineIcon.js";
 import "../../theme/index.js";
 import "../../Autocomplete-C5Xb0wsA.js";
-import { F as g } from "../../SelectControl-BRTxQ0py.js";
-import "../../Datepicker-hYnbz9fI.js";
+import { F as g } from "../../SelectControl-Bpf6gSv7.js";
+import "../../Datepicker-B7hXC6Oa.js";
 import "../Input/Input.js";
 import "../Select/Select.js";
 import "react/jsx-runtime";

package/dist/components/FormSublabel/index.js

@@ -1,4 +1,4 @@
-import { F as a } from "../../SelectControl-BRTxQ0py.js";
+import { F as a } from "../../SelectControl-Bpf6gSv7.js";
 export {
   a as FormSublabel
 };

package/dist/components/IconButton/IconButton.theme.js

@@ -8,9 +8,9 @@ const l = {
       return {
         borderRadius: i.shape.borderRadius,
         "&:focus-visible": {
-          outline: "2px solid",
           outlineColor: e,
-          outlineOffset: "2px"
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         }
       };
     },

package/dist/components/Input/Input.theme.js

@@ -1,10 +1,10 @@
-const l = {
+const d = {
   defaultProps: {
     size: "small"
   },
   styleOverrides: {
     root: ({ theme: r, ownerState: o }) => {
-      const e = o.color, i = o.error ? r.vars?.palette.error.light : e && r.vars?.palette[e]?.light;
+      const e = o.color, i = o.error ? r.vars?.palette.error.main : e && r.vars?.palette[e]?.main, l = o.error ? r.vars?.palette.error.light : e && r.vars?.palette[e]?.light;
       return {
         backgroundColor: r.vars?.palette.background.surface,
         borderColor: r.vars?.palette.divider,
@@ -13,16 +13,16 @@ const l = {
         borderWidth: "1px",
         justifyContent: "space-between",
         "&:hover": {
-          borderColor: r.vars?.palette.action.hover
+          borderColor: o.error ? r.vars?.palette.error.dark : r.vars?.palette.text.secondary
         },
         "&:focus-within": {
           borderColor: i,
-          outlineColor: i,
+          outlineColor: l,
           outlineStyle: "solid",
-          outlineWidth: "1px"
+          outlineWidth: "2px"
         },
         ...o.error && {
-          borderColor: r.vars?.palette.error.light,
+          borderColor: r.vars?.palette.error.main,
           outlineColor: r.vars?.palette.error.light
         }
       };
@@ -43,5 +43,5 @@ const l = {
   }
 };
 export {
-  l as MuiInputBase
+  d as MuiInputBase
 };

package/dist/components/InputControl/InputControl.js

@@ -7,8 +7,8 @@ import "../../icons/MoreCircleOutlineIcon.js";
 import "../../Info-0laCo4Av.js";
 import "../../theme/index.js";
 import "../../Autocomplete-C5Xb0wsA.js";
-import { I as q } from "../../SelectControl-BRTxQ0py.js";
-import "../../Datepicker-hYnbz9fI.js";
+import { I as q } from "../../SelectControl-Bpf6gSv7.js";
+import "../../Datepicker-B7hXC6Oa.js";
 import "../Input/Input.js";
 import "../Select/Select.js";
 import "../../theme/internal.js";

package/dist/components/InputControl/index.js

@@ -1,4 +1,4 @@
-import { I as t } from "../../SelectControl-BRTxQ0py.js";
+import { I as t } from "../../SelectControl-Bpf6gSv7.js";
 export {
   t as InputControl
 };

package/dist/components/Link/Link.theme.js

@@ -1,14 +1,14 @@
 const t = {
   styleOverrides: {
     root: ({ ownerState: r, theme: o }) => {
-      const i = [
+      const s = [
         "primary",
         "secondary",
         "error",
         "warning",
         "info",
         "success"
-      ], s = r.color !== "inherit" && i.includes(r.color) ? r.color : "primary", n = o.vars?.palette[s]?.light;
+      ], i = r.color !== "inherit" && s.includes(r.color) ? r.color : "primary", n = o.vars?.palette[i]?.light;
       return {
         transition: [
           "color",
@@ -17,13 +17,13 @@ const t = {
         ].join(" "),
         cursor: "pointer",
         "&:focus-visible": {
-          outline: "2px solid",
+          borderRadius: o.shape.borderRadius + "px",
           outlineColor: n,
-          outlineOffset: "2px",
-          borderRadius: o.shape.borderRadius + "px"
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         },
         "&:active": {
-          color: o.vars?.palette[s]?.dark
+          color: o.vars?.palette[i]?.dark
         }
       };
     }

package/dist/components/ListItemButton/ListItemButton.theme.js

@@ -1,4 +1,4 @@
-const s = {
+const i = {
   styleOverrides: {
     root: ({ theme: o }) => {
       const t = o.vars?.palette.primary?.light;
@@ -10,14 +10,14 @@ const s = {
           o.transitions.easing.easeInOut
         ].join(" "),
         "&:focus-visible": {
-          outline: "2px solid",
           outlineColor: t,
-          outlineOffset: "2px"
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         }
       };
     }
   }
 };
 export {
-  s as MuiListItemButton
+  i as MuiListItemButton
 };

package/dist/components/Radio/Radio.theme.js

@@ -1,22 +1,22 @@
-const r = {
+const e = {
   defaultProps: {
     disableRipple: !0,
     size: "small"
   },
   styleOverrides: {
     root: ({ ownerState: o, theme: l }) => {
-      const s = o.color !== "default" && o.color || "secondary", e = l.vars?.palette[s]?.light;
+      const r = o.color !== "default" && o.color || "secondary", s = l.vars?.palette[r]?.light;
       return {
         "&:focus-within svg": {
           borderRadius: l.shape.borderRadius,
-          outline: "2px solid",
-          outlineColor: e,
-          outlineOffset: "2px"
+          outlineColor: s,
+          outlineStyle: "solid",
+          outlineWidth: "2px"
         }
       };
     }
   }
 };
 export {
-  r as MuiRadio
+  e as MuiRadio
 };

package/dist/components/SelectControl/SelectControl.js

@@ -7,8 +7,8 @@ import "../../icons/MoreCircleOutlineIcon.js";
 import "../../Info-0laCo4Av.js";
 import "../../theme/index.js";
 import "../../Autocomplete-C5Xb0wsA.js";
-import { S as u } from "../../SelectControl-BRTxQ0py.js";
-import "../../Datepicker-hYnbz9fI.js";
+import { S as u } from "../../SelectControl-Bpf6gSv7.js";
+import "../../Datepicker-B7hXC6Oa.js";
 import "../Input/Input.js";
 import "../Select/Select.js";
 import "../../theme/internal.js";

package/dist/components/SelectControl/index.js

@@ -1,4 +1,4 @@
-import { S as r } from "../../SelectControl-BRTxQ0py.js";
+import { S as r } from "../../SelectControl-Bpf6gSv7.js";
 export {
   r as SelectControl
 };

package/dist/main.js

@@ -8,8 +8,8 @@ import { C as fa, a as xa, E as ua, I as ya, W as Aa } from "./WarningAmberOutli
 import { I as ba } from "./Info-0laCo4Av.js";
 import { StyledEngineProvider as Ta } from "./theme/index.js";
 import { A as ha, a as Ba, c as ka, g as Sa } from "./Autocomplete-C5Xb0wsA.js";
-import { A as va, D as Fa, F as Ma, I as wa, S as Oa } from "./SelectControl-BRTxQ0py.js";
-import { a as Ga, b as Ha, D as Ea, L as Na, M as Ka, d as Va } from "./Datepicker-hYnbz9fI.js";
+import { A as va, D as Fa, F as Ma, I as wa, S as Oa } from "./SelectControl-Bpf6gSv7.js";
+import { a as Ga, b as Ha, D as Ea, L as Na, M as Ka, d as Va } from "./Datepicker-B7hXC6Oa.js";
 import { Input as Wa } from "./components/Input/Input.js";
 import { Select as Qa } from "./components/Select/Select.js";
 import { ThemeProvider as qa } from "./components/ThemeProvider/ThemeProvider.js";
@@ -94,7 +94,7 @@ import { T as Yl, g as _l, t as $l } from "./Tooltip-CwonMYRh.js";
 import { T as ai, g as oi, t as ti } from "./Typography-BINECQ8C.js";
 import { a as ri, d as li, e as ii, g as ni, b as ci, l as Ci } from "./createTheme-BX9lNtXz.js";
 import { u as mi } from "./ThemeProviderWithVars-Ci35_8LL.js";
-import { A as Ii } from "./AdapterDayjs-CnU1cne-.js";
+import { A as Ii } from "./AdapterDayjs-CZ0W-UZH.js";
 export {
   C as AccessTimeIcon,
   no as Accordion,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@clearstory/drywall-react",
-  "version": "0.12.1",
+  "version": "1.0.0",
   "license": "UNLICENSED",
   "description": "a Clearstory software design system",
   "type": "module",