jcicl 0.0.273 → 0.0.277

package/Button/Button.d.ts

@@ -4,6 +4,7 @@ export interface ButtonProps extends Omit<MuiButtonProps, 'variant' | 'size' | '
     size?: number;
     color?: string;
     highlightColor?: string;
+    hoverColor?: string;
     active?: boolean;
 }
 export declare const Button: React.FC<ButtonProps & {

package/Button/Button.js

@@ -1,37 +1,37 @@
 import { jsxs as H, jsx as l } from "react/jsx-runtime";
-import * as g from "react";
-import { g as _, a as A, s as c, r as q, c as d, m as J, u as K, b as O, P as t, d as Q, e as v } from "../.chunks/DefaultPropsProvider.js";
+import * as x from "react";
+import { g as _, a as A, s as c, r as q, c as d, m as J, u as K, b as O, P as t, d as Q, e as g } from "../.chunks/DefaultPropsProvider.js";
 import { m as X } from "../.chunks/memoTheme.js";
 import { c as Y } from "../.chunks/createSimplePaletteValueFilter.js";
 import { B as S } from "../.chunks/ButtonBase.js";
 import { i as Z } from "../.chunks/emotion-styled.browser.esm.js";
-import { c as x } from "../.chunks/emotion-react.browser.esm.js";
+import { c as f } from "../.chunks/emotion-react.browser.esm.js";
 import r from "../theme.js";
 function oo(o) {
   return _("MuiButton", o);
 }
-const u = A("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorSuccess", "colorError", "colorInfo", "colorWarning", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "icon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), R = /* @__PURE__ */ g.createContext({});
+const b = A("MuiButton", ["root", "text", "textInherit", "textPrimary", "textSecondary", "textSuccess", "textError", "textInfo", "textWarning", "outlined", "outlinedInherit", "outlinedPrimary", "outlinedSecondary", "outlinedSuccess", "outlinedError", "outlinedInfo", "outlinedWarning", "contained", "containedInherit", "containedPrimary", "containedSecondary", "containedSuccess", "containedError", "containedInfo", "containedWarning", "disableElevation", "focusVisible", "disabled", "colorInherit", "colorPrimary", "colorSecondary", "colorSuccess", "colorError", "colorInfo", "colorWarning", "textSizeSmall", "textSizeMedium", "textSizeLarge", "outlinedSizeSmall", "outlinedSizeMedium", "outlinedSizeLarge", "containedSizeSmall", "containedSizeMedium", "containedSizeLarge", "sizeMedium", "sizeSmall", "sizeLarge", "fullWidth", "startIcon", "endIcon", "icon", "iconSizeSmall", "iconSizeMedium", "iconSizeLarge"]), R = /* @__PURE__ */ x.createContext({});
 process.env.NODE_ENV !== "production" && (R.displayName = "ButtonGroupContext");
-const N = /* @__PURE__ */ g.createContext(void 0);
+const N = /* @__PURE__ */ x.createContext(void 0);
 process.env.NODE_ENV !== "production" && (N.displayName = "ButtonGroupButtonContext");
 const to = (o) => {
   const {
-    color: n,
-    disableElevation: a,
+    color: a,
+    disableElevation: n,
     fullWidth: e,
-    size: i,
-    variant: p,
-    classes: s
-  } = o, f = {
-    root: ["root", p, `${p}${d(n)}`, `size${d(i)}`, `${p}Size${d(i)}`, `color${d(n)}`, a && "disableElevation", e && "fullWidth"],
+    size: p,
+    variant: i,
+    classes: u
+  } = o, s = {
+    root: ["root", i, `${i}${d(a)}`, `size${d(p)}`, `${i}Size${d(p)}`, `color${d(a)}`, n && "disableElevation", e && "fullWidth"],
     label: ["label"],
-    startIcon: ["icon", "startIcon", `iconSize${d(i)}`],
-    endIcon: ["icon", "endIcon", `iconSize${d(i)}`]
-  }, $ = Q(f, oo, s);
+    startIcon: ["icon", "startIcon", `iconSize${d(p)}`],
+    endIcon: ["icon", "endIcon", `iconSize${d(p)}`]
+  }, y = Q(s, oo, u);
   return {
-    ...s,
+    ...u,
     // forward the focused, disabled, etc. classes to the ButtonBase
-    ...$
+    ...y
   };
 }, E = [{
   props: {
@@ -64,16 +64,16 @@ const to = (o) => {
   shouldForwardProp: (o) => q(o) || o === "classes",
   name: "MuiButton",
   slot: "Root",
-  overridesResolver: (o, n) => {
+  overridesResolver: (o, a) => {
     const {
-      ownerState: a
+      ownerState: n
     } = o;
-    return [n.root, n[a.variant], n[`${a.variant}${d(a.color)}`], n[`size${d(a.size)}`], n[`${a.variant}Size${d(a.size)}`], a.color === "inherit" && n.colorInherit, a.disableElevation && n.disableElevation, a.fullWidth && n.fullWidth];
+    return [a.root, a[n.variant], a[`${n.variant}${d(n.color)}`], a[`size${d(n.size)}`], a[`${n.variant}Size${d(n.size)}`], n.color === "inherit" && a.colorInherit, n.disableElevation && a.disableElevation, n.fullWidth && a.fullWidth];
   }
 })(X(({
   theme: o
 }) => {
-  const n = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], a = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
+  const a = o.palette.mode === "light" ? o.palette.grey[300] : o.palette.grey[800], n = o.palette.mode === "light" ? o.palette.grey.A100 : o.palette.grey[700];
   return {
     ...o.typography.button,
     minWidth: 64,
@@ -86,7 +86,7 @@ const to = (o) => {
     "&:hover": {
       textDecoration: "none"
     },
-    [`&.${u.disabled}`]: {
+    [`&.${b.disabled}`]: {
       color: (o.vars || o).palette.action.disabled
     },
     variants: [{
@@ -107,10 +107,10 @@ const to = (o) => {
         "&:active": {
           boxShadow: (o.vars || o).shadows[8]
         },
-        [`&.${u.focusVisible}`]: {
+        [`&.${b.focusVisible}`]: {
           boxShadow: (o.vars || o).shadows[6]
         },
-        [`&.${u.disabled}`]: {
+        [`&.${b.disabled}`]: {
           color: (o.vars || o).palette.action.disabled,
           boxShadow: (o.vars || o).shadows[0],
           backgroundColor: (o.vars || o).palette.action.disabledBackground
@@ -126,7 +126,7 @@ const to = (o) => {
         borderColor: "var(--variant-outlinedBorder, currentColor)",
         backgroundColor: "var(--variant-outlinedBg)",
         color: "var(--variant-outlinedColor)",
-        [`&.${u.disabled}`]: {
+        [`&.${b.disabled}`]: {
           border: `1px solid ${(o.vars || o).palette.action.disabledBackground}`
         }
       }
@@ -146,15 +146,15 @@ const to = (o) => {
       style: {
         "--variant-textColor": (o.vars || o).palette[e].main,
         "--variant-outlinedColor": (o.vars || o).palette[e].main,
-        "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / 0.5)` : v(o.palette[e].main, 0.5),
+        "--variant-outlinedBorder": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / 0.5)` : g(o.palette[e].main, 0.5),
         "--variant-containedColor": (o.vars || o).palette[e].contrastText,
         "--variant-containedBg": (o.vars || o).palette[e].main,
         "@media (hover: hover)": {
           "&:hover": {
             "--variant-containedBg": (o.vars || o).palette[e].dark,
-            "--variant-textBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette[e].main, o.palette.action.hoverOpacity),
+            "--variant-textBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : g(o.palette[e].main, o.palette.action.hoverOpacity),
             "--variant-outlinedBorder": (o.vars || o).palette[e].main,
-            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette[e].main, o.palette.action.hoverOpacity)
+            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette[e].mainChannel} / ${o.vars.palette.action.hoverOpacity})` : g(o.palette[e].main, o.palette.action.hoverOpacity)
           }
         }
       }
@@ -165,12 +165,12 @@ const to = (o) => {
       style: {
         color: "inherit",
         borderColor: "currentColor",
-        "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedBg : n,
+        "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedBg : a,
         "@media (hover: hover)": {
           "&:hover": {
-            "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : a,
-            "--variant-textBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette.text.primary, o.palette.action.hoverOpacity),
-            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : v(o.palette.text.primary, o.palette.action.hoverOpacity)
+            "--variant-containedBg": o.vars ? o.vars.palette.Button.inheritContainedHoverBg : n,
+            "--variant-textBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : g(o.palette.text.primary, o.palette.action.hoverOpacity),
+            "--variant-outlinedBg": o.vars ? `rgba(${o.vars.palette.text.primaryChannel} / ${o.vars.palette.action.hoverOpacity})` : g(o.palette.text.primary, o.palette.action.hoverOpacity)
           }
         }
       }
@@ -237,13 +237,13 @@ const to = (o) => {
         "&:hover": {
           boxShadow: "none"
         },
-        [`&.${u.focusVisible}`]: {
+        [`&.${b.focusVisible}`]: {
           boxShadow: "none"
         },
         "&:active": {
           boxShadow: "none"
         },
-        [`&.${u.disabled}`]: {
+        [`&.${b.disabled}`]: {
           boxShadow: "none"
         }
       }
@@ -259,11 +259,11 @@ const to = (o) => {
 })), ao = c("span", {
   name: "MuiButton",
   slot: "StartIcon",
-  overridesResolver: (o, n) => {
+  overridesResolver: (o, a) => {
     const {
-      ownerState: a
+      ownerState: n
     } = o;
-    return [n.startIcon, n[`iconSize${d(a.size)}`]];
+    return [a.startIcon, a[`iconSize${d(n.size)}`]];
   }
 })({
   display: "inherit",
@@ -280,11 +280,11 @@ const to = (o) => {
 }), no = c("span", {
   name: "MuiButton",
   slot: "EndIcon",
-  overridesResolver: (o, n) => {
+  overridesResolver: (o, a) => {
     const {
-      ownerState: a
+      ownerState: n
     } = o;
-    return [n.endIcon, n[`iconSize${d(a.size)}`]];
+    return [a.endIcon, a[`iconSize${d(n.size)}`]];
   }
 })({
   display: "inherit",
@@ -298,13 +298,13 @@ const to = (o) => {
       marginRight: -2
     }
   }, ...E]
-}), T = /* @__PURE__ */ g.forwardRef(function(n, a) {
-  const e = g.useContext(R), i = g.useContext(N), p = J(e, n), s = K({
-    props: p,
+}), T = /* @__PURE__ */ x.forwardRef(function(a, n) {
+  const e = x.useContext(R), p = x.useContext(N), i = J(e, a), u = K({
+    props: i,
     name: "MuiButton"
   }), {
-    children: f,
-    color: $ = "primary",
+    children: s,
+    color: y = "primary",
     component: w = "button",
     className: P,
     disabled: m = !1,
@@ -318,9 +318,9 @@ const to = (o) => {
     type: k,
     variant: F = "text",
     ...G
-  } = s, y = {
-    ...s,
-    color: $,
+  } = u, B = {
+    ...u,
+    color: y,
     component: w,
     disabled: m,
     disableElevation: W,
@@ -329,27 +329,27 @@ const to = (o) => {
     size: M,
     type: k,
     variant: F
-  }, b = to(y), L = I && /* @__PURE__ */ l(ao, {
-    className: b.startIcon,
-    ownerState: y,
+  }, v = to(B), L = I && /* @__PURE__ */ l(ao, {
+    className: v.startIcon,
+    ownerState: B,
     children: I
   }), D = h && /* @__PURE__ */ l(no, {
-    className: b.endIcon,
-    ownerState: y,
+    className: v.endIcon,
+    ownerState: B,
     children: h
-  }), U = i || "";
+  }), U = p || "";
   return /* @__PURE__ */ H(ro, {
-    ownerState: y,
-    className: O(e.className, b.root, P, U),
+    ownerState: B,
+    className: O(e.className, v.root, P, U),
     component: w,
     disabled: m,
     focusRipple: !C,
-    focusVisibleClassName: O(b.focusVisible, V),
-    ref: a,
+    focusVisibleClassName: O(v.focusVisible, V),
+    ref: n,
     type: k,
     ...G,
-    classes: b,
-    children: [L, f, D]
+    classes: v,
+    children: [L, s, D]
   });
 });
 process.env.NODE_ENV !== "production" && (T.propTypes = {
@@ -446,7 +446,7 @@ process.env.NODE_ENV !== "production" && (T.propTypes = {
    */
   variant: t.oneOfType([t.oneOf(["contained", "outlined", "text"]), t.string])
 });
-const B = c(T)`
+const $ = c(T)`
   text-transform: none;
   &:disabled {
     opacity: 0.5;
@@ -455,7 +455,7 @@ const B = c(T)`
     justify-content: center;
     align-items: center;
   }
-`, eo = c(B)`
+`, eo = c($)`
   background-color: ${r.colors.green};
   border-radius: 0;
   height: 2.5rem;
@@ -475,12 +475,12 @@ const B = c(T)`
   &:disabled {
     background-color: ${r.colors.darkGreen};
   }
-`, io = c(B)`
+`, io = c($)`
   color: ${r.colors.black};
   border: 3px solid ${r.colors.blue};
   padding: 0.5rem 2rem;
-`, z = c(B)(({ width: o = "114px" }) => ({
-  ...x`
+`, z = c($)(({ width: o = "114px" }) => ({
+  ...f`
     box-sizing: border-box;
     background-color: ${r.colors.bibiBlue};
     border-radius: 0;
@@ -498,7 +498,7 @@ const B = c(T)`
     }
   `
 })), so = c(z)(({ active: o }) => ({
-  ...x`
+  ...f`
     background-color: ${o && r.colors.white};
     color: ${o && r.colors.bibiBlue};
     &:hover,
@@ -508,7 +508,7 @@ const B = c(T)`
     }
   `
 })), lo = c(z)(() => ({
-  ...x`
+  ...f`
     background-color: ${r.colors.white};
     color: ${r.colors.bibiBlue};
     &:hover,
@@ -522,31 +522,34 @@ const B = c(T)`
   border-radius: 8px;
 `, po = c(S, {
   shouldForwardProp: (o) => typeof o == "string" && Z(o)
-})(({ size: o, color: n, highlightColor: a }) => ({
-  ...x`
-    display: flex;
-    align-items: center;
-    justify-content: center;
-    background-color: transparent;
-    transition: 313ms all ease-in-out;
+})(
+  ({ size: o, color: a, highlightColor: n, hoverColor: e }) => ({
+    ...f`
+      display: flex;
+      align-items: center;
+      justify-content: center;
+      background-color: transparent;
+      transition: 313ms all ease-in-out;
 
-    &:hover,
-    :focus-visible {
-      svg {
-        filter: drop-shadow(0 0 6px ${a}) drop-shadow(0 0 6px ${a})
-          drop-shadow(0 0 6px ${a}) drop-shadow(0 0 6px ${a});
+      &:hover,
+      :focus-visible {
+        svg {
+          filter: drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n})
+            drop-shadow(0 0 6px ${n}) drop-shadow(0 0 6px ${n});
+          fill: ${e || a};
+        }
       }
-    }
 
-    svg {
-      transition: 313ms all ease-in-out;
-      fill: ${n};
-      width: ${o}px;
-      height: ${o}px;
-    }
-  `
-})), uo = c(B)(({ active: o }) => ({
-  ...x`
+      svg {
+        transition: 313ms all ease-in-out;
+        fill: ${a};
+        width: ${o}px;
+        height: ${o}px;
+      }
+    `
+  })
+), uo = c($)(({ active: o }) => ({
+  ...f`
     box-sizing: border-box;
     background-color: ${o ? r.colors.black : r.colors.white};
     height: 28px;
@@ -566,13 +569,14 @@ const B = c(T)`
   `
 })), So = ({
   variant: o = 1,
-  size: n = 50,
-  color: a = r.colors.darkGreen,
+  size: a = 50,
+  color: n = r.colors.darkGreen,
   highlightColor: e = r.colors.dandelion,
+  hoverColor: p = r.colors.green,
   children: i,
-  active: p,
+  active: u,
   ...s
-}) => o === "bibi" ? /* @__PURE__ */ l(z, { ...s, children: i }) : o === "bibiOutlined" ? /* @__PURE__ */ l(so, { ...s, children: i }) : o === "bibiInverse" ? /* @__PURE__ */ l(lo, { ...s, children: i }) : o === "unstyled" ? /* @__PURE__ */ l(co, { ...s, children: i }) : o === 2 ? /* @__PURE__ */ l(io, { ...s, children: /* @__PURE__ */ l("span", { children: i }) }) : o === "icon" ? /* @__PURE__ */ l(po, { className: "jcIconButton", ...{ size: n, color: a, highlightColor: e }, ...s, children: i }) : o === "filter" ? /* @__PURE__ */ l(uo, { className: "jcFilterButton", active: p, ...s, children: i }) : /* @__PURE__ */ l(eo, { ...s, children: /* @__PURE__ */ l("span", { children: i }) });
+}) => o === "bibi" ? /* @__PURE__ */ l(z, { ...s, children: i }) : o === "bibiOutlined" ? /* @__PURE__ */ l(so, { ...s, children: i }) : o === "bibiInverse" ? /* @__PURE__ */ l(lo, { ...s, children: i }) : o === "unstyled" ? /* @__PURE__ */ l(co, { ...s, children: i }) : o === 2 ? /* @__PURE__ */ l(io, { ...s, children: /* @__PURE__ */ l("span", { children: i }) }) : o === "icon" ? /* @__PURE__ */ l(po, { className: "jcIconButton", ...{ size: a, color: n, highlightColor: e }, ...s, children: i }) : o === "filter" ? /* @__PURE__ */ l(uo, { className: "jcFilterButton", active: u, ...s, children: i }) : /* @__PURE__ */ l(eo, { ...s, children: /* @__PURE__ */ l("span", { children: i }) });
 export {
   So as Button,
   So as default

package/FormFields/FormFields.d.ts

@@ -15,6 +15,7 @@ export type FormFieldsProps = {
     columnsOverride?: string;
     gap?: number;
     noLabel?: boolean;
+    checkboxContainer?: boolean;
     formDefaults: Record<string, any>;
     onChange: (key: string, e: React.ChangeEvent<HTMLInputElement>, type?: string) => void;
 };

package/FormFields/FormFields.js

@@ -1,37 +1,42 @@
-import { jsxs as x, Fragment as w, jsx as m } from "react/jsx-runtime";
-import { FormInput as g } from "../FormInput/FormInput.js";
-import { FormSectionTitle as j, FormFieldGrid as D } from "../FormComponents/FormComponents.js";
-import S from "../theme.js";
-import { u as b } from "../.chunks/useMediaQuery.js";
-const Q = ({
+import { jsxs as g, Fragment as j, jsx as r } from "react/jsx-runtime";
+import { FormInput as C } from "../FormInput/FormInput.js";
+import { FormSectionTitle as D, FormFieldGrid as S, FormFieldCheckboxContainer as b } from "../FormComponents/FormComponents.js";
+import z from "../theme.js";
+import { u as G } from "../.chunks/useMediaQuery.js";
+const $ = ({
   title: i,
-  fields: n,
-  columns: l = b(`(max-width: ${S.screenSizes.tablet})`) ? 2 : 3,
+  fields: d,
+  columns: s = G(`(max-width: ${z.screenSizes.tablet})`) ? 2 : 3,
   columnsOverride: u,
   gap: a = 21,
-  noLabel: d = !1,
-  formDefaults: e,
-  onChange: s
-}) => /* @__PURE__ */ x(w, { children: [
-  i && /* @__PURE__ */ m(j, { children: i }),
-  /* @__PURE__ */ m(D, { columns: l, columnsOverride: u, gap: a, children: n.map(({ key: r, label: p, type: o, limit: c, options: F, defaultValue: t }) => {
-    const f = e[r] ? e[r] : t || (o === "multiDropdown" ? [] : "");
-    return /* @__PURE__ */ m(
-      g,
+  noLabel: F = !1,
+  checkboxContainer: m = !1,
+  formDefaults: t,
+  onChange: p
+}) => {
+  const n = () => d.map(({ key: o, label: c, type: e, limit: f, options: h, defaultValue: l }) => {
+    const x = t[o] ? t[o] : l || (e === "multiDropdown" ? [] : "");
+    return /* @__PURE__ */ r(
+      C,
       {
-        onChange: (h) => s(r, h, o),
-        label: p,
-        type: o,
-        limit: c,
-        defaultValue: f,
-        noLabel: d,
-        options: F,
-        multiple: o === "multiDropdown"
+        onChange: (w) => p(o, w, e),
+        label: c,
+        type: e,
+        limit: f,
+        defaultValue: x,
+        noLabel: F,
+        options: h,
+        multiple: e === "multiDropdown"
       },
-      r
+      o
     );
-  }) })
-] });
+  });
+  return /* @__PURE__ */ g(j, { children: [
+    i && /* @__PURE__ */ r(D, { children: i }),
+    !m && /* @__PURE__ */ r(S, { columns: s, columnsOverride: u, gap: a, children: /* @__PURE__ */ r(n, {}) }),
+    m && /* @__PURE__ */ r(b, { children: /* @__PURE__ */ r(n, {}) })
+  ] });
+};
 export {
-  Q as default
+  $ as default
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "0.0.273",
+  "version": "0.0.277",
   "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",