jcicl 1.0.79 → 1.1.1

package/.chunks/chevron-down.js

@@ -0,0 +1,11 @@
+import { c as o } from "./createLucideIcon.js";
+/**
+ * @license lucide-react v0.525.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const n = [["path", { d: "m6 9 6 6 6-6", key: "qrunsl" }]], e = o("chevron-down", n);
+export {
+  e as C
+};

package/.chunks/user.js

@@ -0,0 +1,41 @@
+import { c as a } from "./createLucideIcon.js";
+/**
+ * @license lucide-react v0.525.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const e = [
+  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
+  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
+], n = a("mail", e);
+/**
+ * @license lucide-react v0.525.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const o = [
+  [
+    "path",
+    {
+      d: "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384",
+      key: "9njp5v"
+    }
+  ]
+], s = a("phone", o);
+/**
+ * @license lucide-react v0.525.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const c = [
+  ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
+  ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
+], i = a("user", c);
+export {
+  n as M,
+  s as P,
+  i as U
+};

package/Button/Button.d.ts

@@ -1,6 +1,7 @@
+import { default as React } from 'react';
 import { ButtonProps as MuiButtonProps } from '@mui/material/Button/Button';
 export interface ButtonProps extends Omit<MuiButtonProps, 'variant' | 'size' | 'color'> {
-    variant?: 1 | 2 | 'unstyled' | 'copy' | 'icon' | 'bibi' | 'bibiOutlined' | 'bibiInverse' | 'filter' | 'custom' | 'pill' | 'form';
+    variant?: 1 | 2 | 'unstyled' | 'copy' | 'icon' | 'filter' | 'custom' | 'pill' | 'form';
     size?: number;
     color?: string;
     highlightColor?: string;
@@ -11,8 +12,6 @@ export interface ButtonProps extends Omit<MuiButtonProps, 'variant' | 'size' | '
     customShadow1?: string;
     customShadow2?: string;
     textToCopy?: string;
-    /** Width for bibi variants (e.g. "200px"). Defaults to "114px". */
-    width?: string;
 }
 export declare const Button: React.FC<ButtonProps & {
     children: React.ReactNode;

package/Button/Button.js

@@ -18,7 +18,7 @@ const C = [
   "customTextColor",
   "customShadow1",
   "customShadow2"
-], c = x(k, { shouldForwardProp: (t) => !C.includes(t) })`
+], l = x(k, { shouldForwardProp: (t) => !C.includes(t) })`
   text-transform: none;
   &:disabled {
     opacity: 0.5;
@@ -28,8 +28,10 @@ const C = [
     align-items: center;
   }
 
-  span {
+  &.MuiButton-root > span {
+    display: inline-flex;
     align-items: center !important;
+    gap: 0.5rem;
   }
 `, F = "!bg-[#009200] !h-10 !border-2 !border-transparent !text-white transition-all duration-[313ms] ease-in !rounded-[32px] !font-normal !py-3 !px-8 !text-base shadow-[0px_0px_2px_1px_rgba(100,100,100,0.63)] hover:!bg-[#005c00] hover:shadow-[0px_0px_2px_1px_rgba(0,0,0,0.63)] focus-visible:!bg-[#005c00] focus-visible:shadow-[0px_0px_2px_1px_rgba(0,0,0,0.63)] disabled:!bg-[#005c00]", h = "!bg-[#fab62d] !h-10 !border-2 !border-transparent !text-[#131313] transition-all duration-[313ms] ease-in !rounded-[32px] !font-normal !py-3 !px-8 !text-base shadow-[0px_0px_2px_1px_rgba(100,100,100,0.63)] hover:!bg-[#e0a022] focus-visible:!bg-[#e0a022] disabled:!bg-[#e0a022]", I = "!h-10 !border-2 !border-transparent transition-all duration-[313ms] ease-in !rounded-[32px] !font-normal !py-3 !px-8 !text-base !bg-[var(--btn-bg)] hover:!bg-[var(--btn-hover)] focus-visible:!bg-[var(--btn-hover)] disabled:!bg-[var(--btn-hover)] !text-[var(--btn-text)] !shadow-[var(--btn-shadow)] hover:!shadow-[var(--btn-shadow-hover)] focus-visible:!shadow-[var(--btn-shadow-hover)]", z = x(p, {
   shouldForwardProp: (t) => typeof t == "string" && _(t)
@@ -95,21 +97,19 @@ const C = [
       }
     `
   })
-), Y = ({
+), X = ({
   variant: t = 1,
   size: o = 50,
   color: s,
   highlightColor: i,
   hoverColor: d,
   backgroundColor: m,
-  textColor: l,
+  textColor: c,
   customShadow1: w,
-  customShadow2: v,
+  customShadow2: y,
   children: r,
-  textToCopy: y,
+  textToCopy: v,
   active: B,
-  // eslint-disable-next-line @typescript-eslint/no-unused-vars -- public API prop reserved for bibi variants; destructured to keep it out of muiProps spread
-  width: H,
   ...n
 }) => {
   const u = j();
@@ -119,15 +119,15 @@ const C = [
       style: {
         "--btn-bg": m || a.colors.green,
         "--btn-hover": d || a.colors.darkGreen,
-        "--btn-text": l || a.colors.white,
+        "--btn-text": c || a.colors.white,
         "--btn-shadow": w || a.boxShadows.gray63,
-        "--btn-shadow-hover": v || a.boxShadows.black63,
+        "--btn-shadow-hover": y || a.boxShadows.black63,
         display: "contents"
       },
-      children: /* @__PURE__ */ e(c, { className: b("jcCustomButton", I), ...n, children: r })
+      children: /* @__PURE__ */ e(l, { className: b("jcCustomButton", I), ...n, children: r })
     }
-  ) : t === "unstyled" ? /* @__PURE__ */ e(p, { className: "block", ...n, children: r }) : t === "copy" ? /* @__PURE__ */ e(G, { textToCopy: y, muiProps: n, children: r }) : t === 2 ? /* @__PURE__ */ e(c, { className: h, ...n, children: /* @__PURE__ */ e("span", { children: r }) }) : t === "icon" ? (s = s || a.colors.green, i = i || a.colors.dandelion, d = d || a.colors.green, /* @__PURE__ */ e(z, { className: "jcIconButton", ...{ size: o, color: s, highlightColor: i, hoverColor: d }, ...n, children: r })) : t === "filter" ? /* @__PURE__ */ e(
-    c,
+  ) : t === "unstyled" ? /* @__PURE__ */ e(p, { className: "block", ...n, children: r }) : t === "copy" ? /* @__PURE__ */ e(G, { textToCopy: v, muiProps: n, children: r }) : t === 2 ? /* @__PURE__ */ e(l, { className: h, ...n, children: /* @__PURE__ */ e("span", { children: r }) }) : t === "icon" ? (s = s || a.colors.green, i = i || a.colors.dandelion, d = d || a.colors.green, /* @__PURE__ */ e(z, { className: "jcIconButton", ...{ size: o, color: s, highlightColor: i, hoverColor: d }, ...n, children: r })) : t === "filter" ? /* @__PURE__ */ e(
+    l,
     {
       className: b(
         "jcFilterButton",
@@ -137,22 +137,22 @@ const C = [
       ...n,
       children: r
     }
-  ) : t === "form" ? /* @__PURE__ */ e(c, { className: b("jcFormButton", h, "!w-[447px] !self-center"), ...n, children: /* @__PURE__ */ e("span", { children: r }) }) : t === "pill" ? /* @__PURE__ */ e(
+  ) : t === "form" ? /* @__PURE__ */ e(l, { className: b("jcFormButton", h, "!w-[447px] !self-center"), ...n, children: /* @__PURE__ */ e("span", { children: r }) }) : t === "pill" ? /* @__PURE__ */ e(
     A,
     {
       backgroundColor: m || u.themeIconBackgroundB,
-      borderColor: l || u.themeIconBackgroundA,
+      borderColor: c || u.themeIconBackgroundA,
       ...n,
       children: /* @__PURE__ */ e("span", { children: r })
     }
-  ) : /* @__PURE__ */ e(c, { className: F, ...n, children: /* @__PURE__ */ e("span", { children: r }) });
+  ) : /* @__PURE__ */ e(l, { className: F, ...n, children: /* @__PURE__ */ e("span", { children: r }) });
 }, G = ({ textToCopy: t, muiProps: o, children: s }) => {
   const [i, d] = $(!1);
   return /* @__PURE__ */ f("div", { className: "flex", onClick: async () => {
     try {
       await navigator.clipboard.writeText(t || String(s)), d(!0), setTimeout(() => d(!1), 1100);
-    } catch (l) {
-      S.error("Failed to copy text: ", l);
+    } catch (c) {
+      S.error("Failed to copy text: ", c);
     }
   }, children: [
     /* @__PURE__ */ e(N, { title: "Copy to clipboard", children: /* @__PURE__ */ e(
@@ -170,6 +170,6 @@ const C = [
   ] });
 };
 export {
-  Y as Button,
-  Y as default
+  X as Button,
+  X as default
 };

package/ChevronOval/ChevronOval.d.ts

@@ -0,0 +1,8 @@
+import { ButtonHTMLAttributes } from 'react';
+export interface ChevronOvalProps extends Omit<ButtonHTMLAttributes<HTMLButtonElement>, 'color'> {
+    $bg: string;
+    $color: string;
+    $bgHover: string;
+}
+export declare const ChevronOval: React.FC<ChevronOvalProps>;
+export default ChevronOval;

package/ChevronOval/ChevronOval.js

@@ -0,0 +1,22 @@
+import { jsx as v } from "react/jsx-runtime";
+import { cn as i } from "../cn.js";
+const a = "inline-flex items-center justify-center h-[3.25rem] min-w-[4.75rem] px-5 border-0 rounded-full cursor-pointer outline-none transition-all duration-150 ease-out bg-[var(--chevron-bg)] text-[var(--chevron-color)] hover:bg-[var(--chevron-bg-hover)] hover:scale-[1.04] active:scale-[0.96] focus-visible:outline-2 focus-visible:outline-[var(--chevron-color)] focus-visible:outline-offset-2", b = ({
+  $bg: e,
+  $color: o,
+  $bgHover: r,
+  className: n,
+  style: t,
+  type: s = "button",
+  ...c
+}) => {
+  const l = {
+    "--chevron-bg": e,
+    "--chevron-color": o,
+    "--chevron-bg-hover": r
+  };
+  return /* @__PURE__ */ v("button", { type: s, className: i(a, n), style: { ...t, ...l }, ...c });
+};
+export {
+  b as ChevronOval,
+  b as default
+};

package/ChevronOval/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './ChevronOval';
+export { ChevronOval } from './ChevronOval';
+export type { ChevronOvalProps } from './ChevronOval';

package/ChevronOval/index.js

@@ -0,0 +1,5 @@
+import { ChevronOval as o, ChevronOval as r } from "./ChevronOval.js";
+export {
+  o as ChevronOval,
+  r as default
+};

package/ClientMatchCard/ClientMatchCard.d.ts

@@ -0,0 +1,21 @@
+import { default as React } from 'react';
+export type ClientMatchField = 'firstName' | 'lastName' | 'email' | 'phone' | 'ssn';
+export interface ClientMatchCardClient {
+    id: number;
+    firstName: string;
+    lastName: string;
+    email: string;
+    phone: string | null;
+    /** Accepts either string or number to match both legacy int SSN columns and the newer string-based shape in SocialServices. */
+    ssn?: string | number | null;
+}
+export interface ClientMatchCardProps {
+    client: ClientMatchCardClient;
+    matchedFields: ClientMatchField[];
+    onClick: () => void;
+    className?: string;
+    /** Optional content shown when the card is expanded. Pass JSX with extra client fields. */
+    expandedContent?: React.ReactNode;
+}
+export declare const ClientMatchCard: React.FC<ClientMatchCardProps>;
+export default ClientMatchCard;

package/ClientMatchCard/ClientMatchCard.js

@@ -0,0 +1,121 @@
+import { jsxs as t, jsx as a } from "react/jsx-runtime";
+import { useState as f } from "react";
+import { Pill as g } from "../Pill/Pill.js";
+import { ChevronOval as N } from "../ChevronOval/ChevronOval.js";
+import { DetailItemContainer as u } from "../DetailPageComponents/DetailPageComponents.js";
+import { ExpandableSection as k } from "../ExpandableSection/ExpandableSection.js";
+import { formatPhone as v, formatSsnLast4 as b } from "../format.js";
+import { useThemeColors as j } from "../ThemeContext.js";
+import { C as w } from "../.chunks/chevron-down.js";
+import { U as E, M as C, P as S } from "../.chunks/user.js";
+import { c as D } from "../.chunks/createLucideIcon.js";
+/**
+ * @license lucide-react v0.525.0 - ISC
+ *
+ * This source code is licensed under the ISC license.
+ * See the LICENSE file in the root directory of this source tree.
+ */
+const P = [
+  ["line", { x1: "4", x2: "20", y1: "9", y2: "9", key: "4lhtct" }],
+  ["line", { x1: "4", x2: "20", y1: "15", y2: "15", key: "vyu0kd" }],
+  ["line", { x1: "10", x2: "8", y1: "3", y2: "21", key: "1ggp8o" }],
+  ["line", { x1: "16", x2: "14", y1: "3", y2: "21", key: "weycgp" }]
+], I = D("hash", P), l = {
+  firstName: "First name",
+  lastName: "Last name",
+  email: "Email",
+  phone: "Phone",
+  ssn: "SSN"
+}, U = ({
+  client: s,
+  matchedFields: o,
+  onClick: c,
+  className: h = "",
+  expandedContent: i
+}) => {
+  const [r, d] = f(!1), n = j(), p = new Set(o), x = (e) => {
+    (e.key === "Enter" || e.key === " ") && (e.preventDefault(), c());
+  }, y = (e) => {
+    e.stopPropagation(), d((m) => !m);
+  };
+  return /* @__PURE__ */ t(
+    u,
+    {
+      role: "button",
+      tabIndex: 0,
+      onClick: c,
+      onKeyDown: x,
+      className: `cursor-pointer mb-0 ${h}`,
+      hoverShadow: `3px 3px 5px 3px ${n.themeColor}`,
+      children: [
+        /* @__PURE__ */ t("div", { className: "flex items-center justify-between gap-3", children: [
+          /* @__PURE__ */ t("h3", { className: "m-0 text-[2.6rem] font-semibold leading-[1.2] text-jc-midnight", children: [
+            s.firstName,
+            " ",
+            s.lastName
+          ] }),
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-3", children: [
+            /* @__PURE__ */ t("span", { className: "text-[1.05rem] font-medium text-jc-gray-3", children: [
+              o.length,
+              " ",
+              o.length === 1 ? "match" : "matches"
+            ] }),
+            i && /* @__PURE__ */ a(
+              N,
+              {
+                type: "button",
+                onClick: y,
+                onKeyDown: (e) => {
+                  (e.key === "Enter" || e.key === " ") && e.stopPropagation();
+                },
+                "aria-expanded": r,
+                "aria-label": r ? "Collapse client details" : "Expand client details",
+                $bg: n.themeIconBackgroundB,
+                $color: n.themeIconColorB,
+                $bgHover: n.themeMediumA,
+                children: /* @__PURE__ */ a(
+                  w,
+                  {
+                    size: 26,
+                    className: `transition-transform duration-200 ease-out ${r ? "rotate-180" : "rotate-0"}`
+                  }
+                )
+              }
+            )
+          ] })
+        ] }),
+        /* @__PURE__ */ a("div", { className: "flex flex-wrap gap-1.5", children: Object.keys(l).map((e) => {
+          const m = p.has(e);
+          return /* @__PURE__ */ a(g, { type: m ? "primary" : "secondary", children: l[e] }, e);
+        }) }),
+        /* @__PURE__ */ t("div", { className: "mt-1 grid grid-cols-1 gap-2 text-[1.2rem] text-jc-charcoal sm:grid-cols-2", children: [
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ a(E, { size: 22, className: "shrink-0 text-jc-gray-3" }),
+            /* @__PURE__ */ t("span", { className: "truncate", children: [
+              s.firstName,
+              " ",
+              s.lastName
+            ] })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ a(C, { size: 22, className: "shrink-0 text-jc-gray-3" }),
+            /* @__PURE__ */ a("span", { className: "truncate", children: s.email })
+          ] }),
+          /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ a(S, { size: 22, className: "shrink-0 text-jc-gray-3" }),
+            /* @__PURE__ */ a("span", { className: "truncate", children: v(s.phone) ?? "—" })
+          ] }),
+          s.ssn != null && /* @__PURE__ */ t("div", { className: "flex items-center gap-2", children: [
+            /* @__PURE__ */ a(I, { size: 22, className: "shrink-0 text-jc-gray-3" }),
+            /* @__PURE__ */ a("span", { className: "truncate", children: b(s.ssn) })
+          ] })
+        ] }),
+        i && /* @__PURE__ */ a(k, { expanded: r, children: i })
+      ]
+    }
+  );
+};
+export {
+  U as ClientMatchCard,
+  U as default
+};

package/ClientMatchCard/index.d.ts

@@ -0,0 +1,3 @@
+export { default } from './ClientMatchCard';
+export { ClientMatchCard } from './ClientMatchCard';
+export type { ClientMatchCardProps, ClientMatchCardClient, ClientMatchField } from './ClientMatchCard';

package/ClientMatchCard/index.js

@@ -0,0 +1,5 @@
+import { ClientMatchCard as e, ClientMatchCard as r } from "./ClientMatchCard.js";
+export {
+  e as ClientMatchCard,
+  r as default
+};

package/ContactCard/ContactCard.js

@@ -1,43 +1,9 @@
-import { jsxs as t, jsx as e } from "react/jsx-runtime";
-import { n as i } from "../.chunks/emotion-styled.browser.esm.js";
+import { jsxs as t, jsx as i } from "react/jsx-runtime";
+import { n as r } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as n } from "../.chunks/emotion-react.browser.esm.js";
 import { DetailItemContainer as l } from "../DetailPageComponents/DetailPageComponents.js";
-import { c as o } from "../.chunks/createLucideIcon.js";
-/**
- * @license lucide-react v0.525.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const d = [
-  ["path", { d: "m22 7-8.991 5.727a2 2 0 0 1-2.009 0L2 7", key: "132q7q" }],
-  ["rect", { x: "2", y: "4", width: "20", height: "16", rx: "2", key: "izxlao" }]
-], h = o("mail", d);
-/**
- * @license lucide-react v0.525.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const m = [
-  [
-    "path",
-    {
-      d: "M13.832 16.568a1 1 0 0 0 1.213-.303l.355-.465A2 2 0 0 1 17 15h3a2 2 0 0 1 2 2v3a2 2 0 0 1-2 2A18 18 0 0 1 2 4a2 2 0 0 1 2-2h3a2 2 0 0 1 2 2v3a2 2 0 0 1-.8 1.6l-.468.351a1 1 0 0 0-.292 1.233 14 14 0 0 0 6.392 6.384",
-      key: "9njp5v"
-    }
-  ]
-], x = o("phone", m);
-/**
- * @license lucide-react v0.525.0 - ISC
- *
- * This source code is licensed under the ISC license.
- * See the LICENSE file in the root directory of this source tree.
- */
-const g = [
-  ["path", { d: "M19 21v-2a4 4 0 0 0-4-4H9a4 4 0 0 0-4 4v2", key: "975kel" }],
-  ["circle", { cx: "12", cy: "7", r: "4", key: "17ys0d" }]
-], f = o("user", g), y = i("h3")(() => ({
+import { U as m, M as c, P as d } from "../.chunks/user.js";
+const x = r("h3")(() => ({
   ...n`
     font-size: 21px;
     font-weight: 600;
@@ -48,11 +14,11 @@ const g = [
       margin-right: 9px;
     }
   `
-})), k = i("p")(() => ({
+})), g = r("p")(() => ({
   ...n`
     margin: 0;
   `
-})), u = i("div")(() => ({
+})), h = r("div")(() => ({
   ...n`
     display: flex;
     gap: 13px;
@@ -70,28 +36,28 @@ const g = [
       font-size: 14px;
     }
   `
-})), z = ({ fullName: a, email: r, phoneNumber: c, title: s, description: p }) => /* @__PURE__ */ t(l, { children: [
-  /* @__PURE__ */ t(y, { children: [
-    /* @__PURE__ */ e(f, {}),
+})), j = ({ fullName: e, email: o, phoneNumber: a, title: p, description: s }) => /* @__PURE__ */ t(l, { children: [
+  /* @__PURE__ */ t(x, { children: [
+    /* @__PURE__ */ i(m, {}),
     " ",
-    a,
+    e,
     " • ",
-    s
+    p
   ] }),
-  /* @__PURE__ */ e(k, { children: p }),
-  /* @__PURE__ */ t(u, { children: [
+  /* @__PURE__ */ i(g, { children: s }),
+  /* @__PURE__ */ t(h, { children: [
     /* @__PURE__ */ t("p", { children: [
-      /* @__PURE__ */ e(h, {}),
+      /* @__PURE__ */ i(c, {}),
       " ",
-      r
+      o
     ] }),
     /* @__PURE__ */ t("p", { children: [
-      /* @__PURE__ */ e(x, {}),
+      /* @__PURE__ */ i(d, {}),
       " ",
-      c
+      a
     ] })
   ] })
 ] });
 export {
-  z as default
+  j as default
 };