jcicl 0.0.23 → 0.0.24

package/base/Button/Button.js

@@ -20,16 +20,16 @@ const Y = (o) => {
     size: s,
     variant: p,
     classes: u
-  } = o, f = {
+  } = o, y = {
     root: ["root", p, `${p}${e(a)}`, `size${e(s)}`, `${p}Size${e(s)}`, `color${e(a)}`, n && "disableElevation", r && "fullWidth"],
     label: ["label"],
     startIcon: ["icon", "startIcon", `iconSize${e(s)}`],
     endIcon: ["icon", "endIcon", `iconSize${e(s)}`]
-  }, y = q(f, X, u);
+  }, f = q(y, X, u);
   return {
     ...u,
     // forward the focused, disabled, etc. classes to the ButtonBase
-    ...y
+    ...f
   };
 }, O = [{
   props: {
@@ -301,8 +301,8 @@ const Y = (o) => {
     props: p,
     name: "MuiButton"
   }), {
-    children: f,
-    color: y = "primary",
+    children: y,
+    color: f = "primary",
     component: S = "button",
     className: N,
     disabled: z = !1,
@@ -312,25 +312,25 @@ const Y = (o) => {
     focusVisibleClassName: T,
     fullWidth: P = !1,
     size: W = "medium",
-    startIcon: m,
-    type: $,
+    startIcon: $,
+    type: m,
     variant: M = "text",
     ...V
   } = u, x = {
     ...u,
-    color: y,
+    color: f,
     component: S,
     disabled: z,
     disableElevation: k,
     disableFocusRipple: B,
     fullWidth: P,
     size: W,
-    type: $,
+    type: m,
     variant: M
-  }, v = Y(x), L = m && /* @__PURE__ */ d(oo, {
+  }, v = Y(x), L = $ && /* @__PURE__ */ d(oo, {
     className: v.startIcon,
     ownerState: x,
-    children: m
+    children: $
   }), j = C && /* @__PURE__ */ d(to, {
     className: v.endIcon,
     ownerState: x,
@@ -344,10 +344,10 @@ const Y = (o) => {
     focusRipple: !B,
     focusVisibleClassName: w(v.focusVisible, T),
     ref: n,
-    type: $,
+    type: m,
     ...V,
     classes: v,
-    children: [L, f, j]
+    children: [L, y, j]
   });
 });
 process.env.NODE_ENV !== "production" && (R.propTypes = {
@@ -464,11 +464,11 @@ const E = c(R)`
   font-weight: 400;
   padding: 0.75rem 2rem;
   font-size: 1rem;
-  box-shadow: 0px 0px 2px 1px rgba(100, 100, 100, 0.63);
+  box-shadow: ${i.boxShadow.gray63};
   &:hover,
   :focus {
     background-color: ${i.colors.darkGreen};
-    box-shadow: 0px 0px 2px 1px rgba(0, 0, 0, 0.63);
+    box-shadow: ${i.boxShadow.black63};
   }
   &:disabled {
     background-color: ${i.colors.darkGreen};

package/base/Input/Input.js

@@ -127,12 +127,12 @@ const Ro = /* @__PURE__ */ i.forwardRef(function(t, n) {
     const w = x.current;
     w.style.width = p.width, w.value = g.value || t.placeholder || "x", w.value.slice(-1) === `
 ` && (w.value += " ");
-    const A = p.boxSizing, L = Ke(p.paddingBottom) + Ke(p.paddingTop), k = Ke(p.borderBottomWidth) + Ke(p.borderTopWidth), D = w.scrollHeight;
+    const A = p.boxSizing, L = Ke(p.paddingBottom) + Ke(p.paddingTop), $ = Ke(p.borderBottomWidth) + Ke(p.borderTopWidth), D = w.scrollHeight;
     w.value = "x";
     const B = w.scrollHeight;
     let E = D;
     a && (E = Math.max(Number(a) * B, E)), s && (E = Math.min(Number(s) * B, E)), E = Math.max(E, B);
-    const U = E + (A === "border-box" ? L + k : 0), j = Math.abs(E - D) <= 1;
+    const U = E + (A === "border-box" ? L + $ : 0), j = Math.abs(E - D) <= 1;
     return {
       outerHeightStyle: U,
       overflowing: j
@@ -155,9 +155,9 @@ const Ro = /* @__PURE__ */ i.forwardRef(function(t, n) {
       });
     }, w = Ho(g), A = b.current, L = co(A);
     L.addEventListener("resize", w);
-    let k;
-    return typeof ResizeObserver < "u" && (k = new ResizeObserver(process.env.NODE_ENV === "test" ? p : g), k.observe(A)), () => {
-      w.clear(), cancelAnimationFrame(v), L.removeEventListener("resize", w), k && k.disconnect();
+    let $;
+    return typeof ResizeObserver < "u" && ($ = new ResizeObserver(process.env.NODE_ENV === "test" ? p : g), $.observe(A)), () => {
+      w.clear(), cancelAnimationFrame(v), L.removeEventListener("resize", w), $ && $.disconnect();
     };
   }, [C, O]), ro(() => {
     O();
@@ -223,7 +223,7 @@ process.env.NODE_ENV !== "production" && (Ro.propTypes = {
    */
   value: e.oneOfType([e.arrayOf(e.string), e.number, e.string])
 });
-function ke({
+function $e({
   props: o,
   states: t,
   muiFormControl: n
@@ -247,7 +247,7 @@ function st(o) {
 function lt(o) {
   return ee("MuiInputBase", o);
 }
-const $e = Q("MuiInputBase", ["root", "formControl", "focused", "disabled", "adornedStart", "adornedEnd", "error", "sizeSmall", "multiline", "colorSecondary", "fullWidth", "hiddenLabel", "readOnly", "input", "inputSizeSmall", "inputMultiline", "inputTypeSearch", "inputAdornedStart", "inputAdornedEnd", "inputHiddenLabel"]);
+const ke = Q("MuiInputBase", ["root", "formControl", "focused", "disabled", "adornedStart", "adornedEnd", "error", "sizeSmall", "multiline", "colorSecondary", "fullWidth", "hiddenLabel", "readOnly", "input", "inputSizeSmall", "inputMultiline", "inputTypeSearch", "inputAdornedStart", "inputAdornedEnd", "inputHiddenLabel"]);
 var ho;
 const Ze = (o, t) => {
   const {
@@ -297,7 +297,7 @@ const Ze = (o, t) => {
   cursor: "text",
   display: "inline-flex",
   alignItems: "center",
-  [`&.${$e.disabled}`]: {
+  [`&.${ke.disabled}`]: {
     color: (o.vars || o).palette.text.disabled,
     cursor: "default"
   },
@@ -382,7 +382,7 @@ const Ze = (o, t) => {
       WebkitAppearance: "none"
     },
     // Show and hide the placeholder logic
-    [`label[data-shrink=false] + .${$e.formControl} &`]: {
+    [`label[data-shrink=false] + .${ke.formControl} &`]: {
       "&::-webkit-input-placeholder": r,
       "&::-moz-placeholder": r,
       // Firefox 19+
@@ -394,7 +394,7 @@ const Ze = (o, t) => {
       "&:focus::-ms-input-placeholder": s
       // Edge
     },
-    [`&.${$e.disabled}`]: {
+    [`&.${ke.disabled}`]: {
       opacity: 1,
       // Reset iOS opacity
       WebkitTextFillColor: (o.vars || o).palette.text.disabled
@@ -474,7 +474,7 @@ const Ze = (o, t) => {
     inputRef: w,
     margin: A,
     maxRows: L,
-    minRows: k,
+    minRows: $,
     multiline: D = !1,
     name: B,
     onBlur: E,
@@ -482,7 +482,7 @@ const Ze = (o, t) => {
     onClick: j,
     onFocus: W,
     onKeyDown: V,
-    onKeyUp: $,
+    onKeyUp: k,
     placeholder: Y,
     readOnly: G,
     renderSuffix: I,
@@ -504,7 +504,7 @@ const Ze = (o, t) => {
     if (N)
       return N.registerEffect();
   }, [N]);
-  const M = ke({
+  const M = $e({
     props: r,
     muiFormControl: N,
     states: ["color", "disabled", "error", "hiddenLabel", "size", "required", "filled"]
@@ -542,7 +542,7 @@ const Ze = (o, t) => {
     H.current && R.currentTarget === R.target && H.current.focus(), j && j(R);
   };
   let ge = v, q = p;
-  D && ge === "input" && (J ? (process.env.NODE_ENV !== "production" && (k || L) && console.warn("MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set."), q = {
+  D && ge === "input" && (J ? (process.env.NODE_ENV !== "production" && ($ || L) && console.warn("MUI: You can not use the `minRows` or `maxRows` props when the input `rows` prop is set."), q = {
     type: void 0,
     minRows: J,
     maxRows: J,
@@ -550,7 +550,7 @@ const Ze = (o, t) => {
   }) : q = {
     type: void 0,
     maxRows: L,
-    minRows: k,
+    minRows: $,
     ...q
   }, ge = Ro);
   const je = (R) => {
@@ -612,7 +612,7 @@ const Ze = (o, t) => {
           rows: J,
           value: de,
           onKeyDown: V,
-          onKeyUp: $,
+          onKeyUp: k,
           type: X,
           ...q,
           ...!fo(xe) && {
@@ -867,7 +867,7 @@ function at(o) {
   return ee("MuiInput", o);
 }
 const De = {
-  ...$e,
+  ...ke,
   ...Q("MuiInput", ["root", "underline", "input"])
 }, dt = (o) => {
   const {
@@ -1203,7 +1203,7 @@ function ct(o) {
   return ee("MuiFilledInput", o);
 }
 const Te = {
-  ...$e,
+  ...ke,
   ...Q("MuiFilledInput", ["root", "underline", "input", "adornedStart", "adornedEnd", "sizeSmall", "multiline", "hiddenLabel"])
 }, ft = (o) => {
   const {
@@ -1835,7 +1835,7 @@ function ht(o) {
   return ee("MuiOutlinedInput", o);
 }
 const se = {
-  ...$e,
+  ...ke,
   ...Q("MuiOutlinedInput", ["root", "notchedOutline", "input"])
 }, vt = (o) => {
   const {
@@ -2008,7 +2008,7 @@ const se = {
     slots: y = {},
     type: h = "text",
     ...x
-  } = s, C = vt(s), O = Me(), f = ke({
+  } = s, C = vt(s), O = Me(), f = $e({
     props: s,
     muiFormControl: O,
     states: ["color", "disabled", "error", "focused", "hiddenLabel", "size", "required"]
@@ -2296,7 +2296,7 @@ const Ve = Q("MuiFormLabel", ["root", "colorSecondary", "focused", "disabled", "
     focused: y,
     required: h,
     ...x
-  } = r, C = Me(), O = ke({
+  } = r, C = Me(), O = $e({
     props: r,
     muiFormControl: C,
     states: ["color", "required", "focused", "disabled", "error", "filled"]
@@ -2547,7 +2547,7 @@ const Ft = (o) => {
   } = r, b = Me();
   let y = l;
   typeof y > "u" && b && (y = b.filled || b.focused || b.adornedStart);
-  const h = ke({
+  const h = $e({
     props: r,
     muiFormControl: b,
     states: ["size", "variant", "required", "focused"]
@@ -2650,7 +2650,7 @@ const Pt = (o) => {
     root: ["root", n !== "none" && `margin${_(n)}`, r && "fullWidth"]
   };
   return oe(s, Et, t);
-}, $t = F("div", {
+}, kt = F("div", {
   name: "MuiFormControl",
   slot: "Root",
   overridesResolver: ({
@@ -2728,16 +2728,16 @@ const Pt = (o) => {
     variant: f
   }, p = Pt(v), [w, A] = i.useState(() => {
     let V = !1;
-    return s && i.Children.forEach(s, ($) => {
-      if (!no($, ["Input", "Select"]))
+    return s && i.Children.forEach(s, (k) => {
+      if (!no(k, ["Input", "Select"]))
         return;
-      const Y = no($, ["Select"]) ? $.props.input : $;
+      const Y = no(k, ["Select"]) ? k.props.input : k;
       Y && st(Y.props) && (V = !0);
     }), V;
-  }), [L, k] = i.useState(() => {
+  }), [L, $] = i.useState(() => {
     let V = !1;
-    return s && i.Children.forEach(s, ($) => {
-      no($, ["Input", "Select"]) && (Ge($.props, !0) || Ge($.props.inputProps, !0)) && (V = !0);
+    return s && i.Children.forEach(s, (k) => {
+      no(k, ["Input", "Select"]) && (Ge(k.props, !0) || Ge(k.props.inputProps, !0)) && (V = !0);
     }), V;
   }), [D, B] = i.useState(!1);
   c && D && B(!1);
@@ -2763,10 +2763,10 @@ const Pt = (o) => {
       B(!1);
     },
     onEmpty: () => {
-      k(!1);
+      $(!1);
     },
     onFilled: () => {
-      k(!0);
+      $(!0);
     },
     onFocus: () => {
       B(!0);
@@ -2777,7 +2777,7 @@ const Pt = (o) => {
   }), [w, l, c, m, L, E, y, h, U, C, O, f]);
   return /* @__PURE__ */ S(Je.Provider, {
     value: W,
-    children: /* @__PURE__ */ S($t, {
+    children: /* @__PURE__ */ S(kt, {
       as: d,
       ownerState: v,
       className: le(p.root, a),
@@ -2867,7 +2867,7 @@ process.env.NODE_ENV !== "production" && (Po.propTypes = {
    */
   variant: e.oneOf(["filled", "outlined", "standard"])
 });
-function kt(o) {
+function $t(o) {
   return ee("MuiFormHelperText", o);
 }
 const Co = Q("MuiFormHelperText", ["root", "error", "disabled", "sizeSmall", "sizeMedium", "contained", "focused", "filled", "required"]);
@@ -2885,7 +2885,7 @@ const Mt = (o) => {
   } = o, m = {
     root: ["root", s && "disabled", a && "error", r && `size${_(r)}`, n && "contained", d && "focused", l && "filled", c && "required"]
   };
-  return oe(m, kt, t);
+  return oe(m, $t, t);
 }, Lt = F("p", {
   name: "MuiFormHelperText",
   slot: "Root",
@@ -2927,7 +2927,7 @@ const Mt = (o) => {
       marginRight: 14
     }
   }]
-}))), $o = /* @__PURE__ */ i.forwardRef(function(t, n) {
+}))), ko = /* @__PURE__ */ i.forwardRef(function(t, n) {
   const r = fe({
     props: t,
     name: "MuiFormHelperText"
@@ -2943,7 +2943,7 @@ const Mt = (o) => {
     required: h,
     variant: x,
     ...C
-  } = r, O = Me(), f = ke({
+  } = r, O = Me(), f = $e({
     props: r,
     muiFormControl: O,
     states: ["variant", "size", "disabled", "error", "filled", "focused", "required"]
@@ -2976,7 +2976,7 @@ const Mt = (o) => {
     ) : s
   });
 });
-process.env.NODE_ENV !== "production" && ($o.propTypes = {
+process.env.NODE_ENV !== "production" && (ko.propTypes = {
   // ┌────────────────────────────── Warning ──────────────────────────────┐
   // │ These PropTypes are generated from the TypeScript type definitions. │
   // │    To update them, edit the d.ts file and run `pnpm proptypes`.     │
@@ -3050,7 +3050,7 @@ const lo = Q("MuiNativeSelect", ["root", "select", "multiple", "filled", "outlin
     icon: ["icon", `icon${_(n)}`, a && "iconOpen", r && "disabled"]
   };
   return oe(d, jt, t);
-}, ko = F("select")(({
+}, $o = F("select")(({
   theme: o
 }) => ({
   // Reset
@@ -3112,7 +3112,7 @@ const lo = Q("MuiNativeSelect", ["root", "select", "multiple", "filled", "outlin
       }
     }
   }]
-})), At = F(ko, {
+})), At = F($o, {
   name: "MuiNativeSelect",
   slot: "Select",
   shouldForwardProp: ye,
@@ -3259,7 +3259,7 @@ function Wt(o) {
 }
 const Ue = Q("MuiSelect", ["root", "select", "multiple", "filled", "outlined", "standard", "disabled", "focused", "icon", "iconOpen", "iconFilled", "iconOutlined", "iconStandard", "nativeInput", "error"]);
 var xo;
-const Dt = F(ko, {
+const Dt = F($o, {
   name: "MuiSelect",
   slot: "Select",
   overridesResolver: (o, t) => {
@@ -3359,7 +3359,7 @@ const qt = (o) => {
     onBlur: w,
     onChange: A,
     onClose: L,
-    onFocus: k,
+    onFocus: $,
     onOpen: D,
     open: B,
     readOnly: E,
@@ -3368,11 +3368,11 @@ const qt = (o) => {
     tabIndex: W,
     // catching `type` from Input which makes no sense for SelectInput
     type: V,
-    value: $,
+    value: k,
     variant: Y = "standard",
     ...G
   } = t, [I, J] = go({
-    controlled: $,
+    controlled: k,
     default: b,
     name: "Select"
   }), [Re, ie] = go({
@@ -3525,7 +3525,7 @@ const qt = (o) => {
       onKeyDown: pe,
       onMouseDown: y || E ? null : ve,
       onBlur: Le,
-      onFocus: k,
+      onFocus: $,
       ...j,
       ownerState: xe,
       className: le(j.className, R.select, c),
@@ -3770,10 +3770,10 @@ const _t = Xo(/* @__PURE__ */ S("path", {
     onOpen: w,
     open: A,
     renderValue: L,
-    SelectDisplayProps: k,
+    SelectDisplayProps: $,
     variant: D = "outlined",
     ...B
-  } = r, E = v ? Lo : jo, U = Me(), j = ke({
+  } = r, E = v ? Lo : jo, U = Me(), j = $e({
     props: r,
     muiFormControl: U,
     states: ["variant", "error"]
@@ -3781,10 +3781,10 @@ const _t = Xo(/* @__PURE__ */ S("path", {
     ...r,
     variant: W,
     classes: l
-  }, $ = Kt(V), {
+  }, k = Kt(V), {
     root: Y,
     ...G
-  } = $, I = h || {
+  } = k, I = h || {
     standard: /* @__PURE__ */ S(Gt, {
       ownerState: V
     }),
@@ -3823,7 +3823,7 @@ const _t = Xo(/* @__PURE__ */ S("path", {
           renderValue: L,
           SelectDisplayProps: {
             id: y,
-            ...k
+            ...$
           }
         },
         ...x,
@@ -3834,7 +3834,7 @@ const _t = Xo(/* @__PURE__ */ S("path", {
         notched: !0
       } : {},
       ref: J,
-      className: le(I.props.className, d, $.root),
+      className: le(I.props.className, d, k.root),
       // If a custom input is provided via 'input' prop, do not allow 'variant' to be propagated to it's root element. See https://github.com/mui/material-ui/issues/33894.
       ...!h && {
         variant: W
@@ -4034,7 +4034,7 @@ const Zt = {
     label: w,
     maxRows: A,
     minRows: L,
-    multiline: k = !1,
+    multiline: $ = !1,
     name: D,
     onBlur: B,
     onChange: E,
@@ -4042,7 +4042,7 @@ const Zt = {
     placeholder: j,
     required: W = !1,
     rows: V,
-    select: $ = !1,
+    select: k = !1,
     SelectProps: Y,
     slots: G = {},
     slotProps: I = {},
@@ -4057,12 +4057,12 @@ const Zt = {
     disabled: b,
     error: y,
     fullWidth: x,
-    multiline: k,
+    multiline: $,
     required: W,
-    select: $,
+    select: k,
     variant: ie
   }, X = Qt(P);
-  process.env.NODE_ENV !== "production" && $ && !l && console.error("MUI: `children` must be passed when using the `TextField` component with `select`.");
+  process.env.NODE_ENV !== "production" && k && !l && console.error("MUI: `children` must be passed when using the `TextField` component with `select`.");
   const Z = Io(O), ae = C && Z ? `${Z}-helper-text` : void 0, de = w && Z ? `${Z}-label` : void 0, me = Zt[ie], H = {
     slots: G,
     slotProps: {
@@ -4074,7 +4074,7 @@ const Zt = {
       ...I
     }
   }, ue = {}, te = H.slotProps.inputLabel;
-  ie === "outlined" && (te && typeof te.shrink < "u" && (ue.notched = te.shrink), ue.label = w), $ && ((!Y || !Y.native) && (ue.id = void 0), ue["aria-describedby"] = void 0);
+  ie === "outlined" && (te && typeof te.shrink < "u" && (ue.notched = te.shrink), ue.label = w), k && ((!Y || !Y.native) && (ue.id = void 0), ue["aria-describedby"] = void 0);
   const [ne, ve] = We("input", {
     elementType: me,
     externalForwardedProps: H,
@@ -4089,7 +4089,7 @@ const Zt = {
     externalForwardedProps: H,
     ownerState: P
   }), [pe, be] = We("formHelperText", {
-    elementType: $o,
+    elementType: ko,
     externalForwardedProps: H,
     ownerState: P
   }), [Le, re] = We("select", {
@@ -4102,7 +4102,7 @@ const Zt = {
     autoFocus: a,
     defaultValue: m,
     fullWidth: x,
-    multiline: k,
+    multiline: $,
     name: D,
     rows: V,
     maxRows: A,
@@ -4137,7 +4137,7 @@ const Zt = {
       id: de,
       ...M,
       children: w
-    }), $ ? /* @__PURE__ */ S(Le, {
+    }), k ? /* @__PURE__ */ S(Le, {
       "aria-describedby": ae,
       id: Z,
       labelId: de,
@@ -4365,13 +4365,13 @@ const on = Ao(zo)({
     boxShadow: "0 0 0 0",
     "&:focus, :focus-visible": {
       borderColor: we.colors.darkGreen,
-      boxShadow: `0 0 2px 1px ${we.colors.darkGreen}`
+      boxShadow: we.boxShadow.darkGreenThick
     }
   },
   "&:hover, :focus, :focus-visible": {
     input: {
       borderColor: we.colors.darkGreen,
-      boxShadow: `0 0 2px 1px ${we.colors.darkGreen}`
+      boxShadow: we.boxShadow.darkGreenThick
     }
   },
   "&:focus-visible": {

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.23",
+  "version": "0.0.24",
   "description": "Component library for the websites of Johnson County Iowa",
   "license": "MIT",
   "homepage": "https://devops.jc.net/JCIT/Business%20Solutions%20Delivery/_git/JCComponentLibrary?path=%2FREADME.md&version=GBmaster",

package/supercomposite/Nav/Nav.js

@@ -5,42 +5,39 @@ import e from "../../theme.js";
 import { B as x } from "../../.chunks/ButtonBase.js";
 const g = s(x, {
   shouldForwardProp: (o) => f(o)
-})(({ active: o }) => {
-  var t;
-  return {
+})(({ active: o }) => ({
+  display: "flex",
+  flexDirection: "column",
+  alignItems: "center",
+  justifyContent: "center",
+  padding: "0 8px 8px 8px",
+  transition: "313ms all ease-in-out",
+  backgroundColor: o ? e.colors.sunlight : "transparent",
+  boxShadow: o ? e.boxShadow.darkGreen : "none",
+  "&:hover, :focus-visible": {
+    svg: {
+      backgroundColor: e.colors.sunlight
+    }
+  },
+  svg: {
+    fontSize: "2.1rem",
+    fill: e.colors.darkGreen,
+    backgroundColor: o ? e.colors.sunlight : "transparent",
+    borderRadius: "50%",
+    padding: "8px",
     display: "flex",
-    flexDirection: "column",
     alignItems: "center",
     justifyContent: "center",
-    padding: "0 8px 8px 8px",
-    transition: "313ms all ease-in-out",
-    backgroundColor: o ? e.colors.sunlight : "transparent",
-    boxShadow: o ? (t = e.boxShadow) == null ? void 0 : t.darkGreen : "none",
-    "&:hover, :focus-visible": {
-      svg: {
-        backgroundColor: e.colors.sunlight
-      }
-    },
-    svg: {
-      fontSize: "2.1rem",
-      fill: e.colors.darkGreen,
-      backgroundColor: o ? e.colors.sunlight : "transparent",
-      borderRadius: "50%",
-      padding: "8px",
-      display: "flex",
-      alignItems: "center",
-      justifyContent: "center",
-      transition: "313ms all ease-in-out"
-    },
-    span: {
-      fontFamily: "Roboto, sans-serif",
-      fontSize: "12px",
-      fontWeight: "bold",
-      color: e.colors.darkGreen,
-      textAlign: "center"
-    }
-  };
-}), h = s("div")({
+    transition: "313ms all ease-in-out"
+  },
+  span: {
+    fontFamily: "Roboto, sans-serif",
+    fontSize: "12px",
+    fontWeight: "bold",
+    color: e.colors.darkGreen,
+    textAlign: "center"
+  }
+})), h = s("div")({
   display: "flex",
   flexDirection: "column",
   backgroundColor: "transparent",
@@ -72,13 +69,13 @@ const g = s(x, {
       backgroundColor: e.colors.darkGreenO99
     }
   }
-}), S = ({ navItems: o, activeRoute: t }) => {
-  const [a, l] = m(""), c = (n, r) => {
-    l(n), r();
+}), S = ({ navItems: o, activeRoute: n }) => {
+  const [a, l] = m(""), c = (t, r) => {
+    l(t), r();
   };
-  return /* @__PURE__ */ i(h, { children: o.map(({ icon: n, label: r = "", onClick: d = () => {
-  }, ...p }) => /* @__PURE__ */ u(g, { ...p, active: t ? t === r : a === r, onClick: () => c(r, d), children: [
-    n,
+  return /* @__PURE__ */ i(h, { children: o.map(({ icon: t, label: r = "", onClick: d = () => {
+  }, ...p }) => /* @__PURE__ */ u(g, { ...p, active: n ? n === r : a === r, onClick: () => c(r, d), children: [
+    t,
     /* @__PURE__ */ i("span", { children: r })
   ] }, r)) });
 };

package/theme.d.ts

@@ -1,28 +1,32 @@
+export interface ThemeColors {
+    black: string;
+    blue: string;
+    charcoal: string;
+    darkBlue: string;
+    darkGreen: string;
+    darkGreenO22: string;
+    darkGreenO99: string;
+    darkRed: string;
+    gold: string;
+    gray: string;
+    veryLightGray: string;
+    grayO44: string;
+    green: string;
+    midnight: string;
+    mint: string;
+    sunlight: string;
+    white: string;
+    whiteGreen: string;
+    whiteGreen2: string;
+}
+export interface ThemeBoxShadows extends Partial<ThemeColors> {
+    black63?: string;
+    darkGreenThick?: string;
+    gray63?: string;
+}
 export interface Theme {
-    boxShadow?: {
-        darkGreen: string;
-    };
-    colors: {
-        black: string;
-        blue: string;
-        charcoal: string;
-        darkBlue: string;
-        darkGreen: string;
-        darkGreenO22: string;
-        darkGreenO99: string;
-        darkRed: string;
-        gold: string;
-        gray: string;
-        veryLightGray: string;
-        grayO44: string;
-        green: string;
-        midnight: string;
-        mint: string;
-        sunlight: string;
-        white: string;
-        whiteGreen: string;
-        whiteGreen2: string;
-    };
+    boxShadow: ThemeBoxShadows;
+    colors: ThemeColors;
     constants: {
         actionsPaneWidth: number;
         appHeaderHeight: number;
@@ -31,5 +35,5 @@ export interface Theme {
         oldNavBarWidth: number;
     };
 }
-declare let theme: Theme;
+declare const theme: Theme;
 export default theme;

package/theme.js

@@ -1,4 +1,5 @@
-let e = {
+const e = {
+  boxShadow: {},
   colors: {
     black: "black",
     blue: "#1976d2",
@@ -29,7 +30,15 @@ let e = {
   }
 };
 e.boxShadow = {
-  darkGreen: `0 0 8px -2px ${e.colors.darkGreen}`
+  ...Object.fromEntries(
+    Object.keys(e.colors).map((a) => [
+      a,
+      `0 0 8px -2px ${e.colors[a]}`
+    ])
+  ),
+  darkGreenThick: `0 0 2px 1px ${e.colors.darkGreen}`,
+  gray63: "0px 0px 2px 1px rgba(100, 100, 100, 0.63)",
+  black63: "0px 0px 2px 1px rgba(0, 0, 0, 0.63)"
 };
 export {
   e as default