jcicl 1.1.5 → 1.2.2

package/index.js

@@ -4,7 +4,7 @@ import { Button as m } from "./Button/Button.js";
 import { ChevronOval as x } from "./ChevronOval/ChevronOval.js";
 import { Divider as s } from "./Divider/Divider.js";
 import { Flex as d } from "./Flex/Flex.js";
-import { FormFieldCheckboxContainer as u, FormFieldGrid as C, FormSection as c, FormSectionTitle as h, FormSubsectionTitle as T, FormSubtitle as A, FormTextLine as F } from "./FormComponents/FormComponents.js";
+import { FormFieldCheckboxContainer as u, FormFieldGrid as C, FormSection as c, FormSectionTitle as T, FormSubsectionTitle as h, FormSubtitle as A, FormTextLine as F } from "./FormComponents/FormComponents.js";
 import { Grid as S } from "./Grid/Grid.js";
 import { default as g } from "./Icon/Icon.js";
 import { Input as D } from "./Input/Input.js";
@@ -23,59 +23,60 @@ import { default as Z } from "./List/List.js";
 import { default as $ } from "./LogoLoop/LogoLoop.js";
 import { default as ro } from "./Pagination/Pagination.js";
 import { SiteBanner as to } from "./SiteBanner/SiteBanner.js";
-import { Tooltip as fo } from "./Tooltip/Tooltip.js";
-import { default as po } from "./WithLabel/WithLabel.js";
-import { default as io } from "./WithLoading/WithLoading.js";
-import { Card as lo, CardBody as no, CardHeader as uo, CiwaCowsSummary as Co, SectionTitle as co, VitalsDisplay as ho } from "./RecordCard/RecordCard.js";
-import { ClientMatchCard as Ao } from "./ClientMatchCard/ClientMatchCard.js";
-import { ExpandableSection as Lo } from "./ExpandableSection/ExpandableSection.js";
-import { default as bo } from "./Toast/Toast.js";
-import { Toaster as vo } from "./Toast/Toaster.js";
-import { handleDismissToast as Io, saveToastForRedirect as Po, showSavedToast as yo, showToast as Bo } from "./Toast/ToastHelpers.js";
-import { useToast as Eo } from "./Toast/useToast.js";
-import { useRedirectToast as Wo } from "./Toast/useRedirectToast.js";
-import { formatDateDisplay as Mo, formatPhone as Ro, formatSsnLast4 as Vo, normalizePhone as ko } from "./format.js";
-import { A as No } from "./.chunks/AppHeader.js";
-import { EditableInfoCard as jo } from "./EditableInfoCard/EditableInfoCard.js";
-import { default as Jo } from "./FieldGroup/FieldGroup.js";
-import { Nav as Qo } from "./Nav/Nav.js";
-import { default as Xo } from "./LoginPage/LoginPage.js";
-import { default as Zo } from "./AppContainer/AppContainer.js";
-import { default as $o } from "./DataPage/DataPage.js";
+import { Tabs as fo } from "./Tabs/Tabs.js";
+import { Tooltip as po } from "./Tooltip/Tooltip.js";
+import { default as io } from "./WithLabel/WithLabel.js";
+import { default as lo } from "./WithLoading/WithLoading.js";
+import { Card as uo, CardBody as Co, CardHeader as co, CiwaCowsSummary as To, SectionTitle as ho, VitalsDisplay as Ao } from "./RecordCard/RecordCard.js";
+import { ClientMatchCard as Lo } from "./ClientMatchCard/ClientMatchCard.js";
+import { ExpandableSection as bo } from "./ExpandableSection/ExpandableSection.js";
+import { default as vo } from "./Toast/Toast.js";
+import { Toaster as Io } from "./Toast/Toaster.js";
+import { handleDismissToast as yo, saveToastForRedirect as Bo, showSavedToast as wo, showToast as Eo } from "./Toast/ToastHelpers.js";
+import { useToast as Wo } from "./Toast/useToast.js";
+import { useRedirectToast as Mo } from "./Toast/useRedirectToast.js";
+import { formatDateDisplay as Vo, formatPhone as ko, formatSsnLast4 as zo, normalizePhone as No } from "./format.js";
+import { A as jo } from "./.chunks/AppHeader.js";
+import { EditableInfoCard as Jo } from "./EditableInfoCard/EditableInfoCard.js";
+import { default as Qo } from "./FieldGroup/FieldGroup.js";
+import { Nav as Xo } from "./Nav/Nav.js";
+import { default as Zo } from "./LoginPage/LoginPage.js";
+import { default as $o } from "./AppContainer/AppContainer.js";
+import { default as rr } from "./DataPage/DataPage.js";
 import "react";
-import { default as rr } from "./DefaultTemplate/DefaultTemplate.js";
-import { AuthContext as tr, AuthProvider as ar, useAuthContext as fr } from "./AuthContext/AuthProvider.js";
-import { createMsalInstance as pr } from "./AuthContext/msalConfig.js";
-import { AuthenticatedApiClient as ir } from "./AuthenticatedApiClient.js";
+import { default as tr } from "./DefaultTemplate/DefaultTemplate.js";
+import { AuthContext as fr, AuthProvider as mr, useAuthContext as pr } from "./AuthContext/AuthProvider.js";
+import { createMsalInstance as ir } from "./AuthContext/msalConfig.js";
+import { AuthenticatedApiClient as lr } from "./AuthenticatedApiClient.js";
 export {
   j as Accordion,
-  Zo as AppContainer,
-  No as AppHeader,
-  tr as AuthContext,
-  ar as AuthProvider,
-  ir as AuthenticatedApiClient,
+  $o as AppContainer,
+  jo as AppHeader,
+  fr as AuthContext,
+  mr as AuthProvider,
+  lr as AuthenticatedApiClient,
   a as AvatarWithImage,
   m as Button,
-  lo as Card,
-  no as CardBody,
-  uo as CardHeader,
+  uo as Card,
+  Co as CardBody,
+  co as CardHeader,
   x as ChevronOval,
-  Co as CiwaCowsSummary,
-  Ao as ClientMatchCard,
+  To as CiwaCowsSummary,
+  Lo as ClientMatchCard,
   k as CustomAlert,
-  $o as DataPage,
-  rr as DefaultTemplate,
+  rr as DataPage,
+  tr as DefaultTemplate,
   s as Divider,
-  jo as EditableInfoCard,
+  Jo as EditableInfoCard,
   J as ErrorBoundary,
-  Lo as ExpandableSection,
-  Jo as FieldGroup,
+  bo as ExpandableSection,
+  Qo as FieldGroup,
   d as Flex,
   u as FormFieldCheckboxContainer,
   C as FormFieldGrid,
   c as FormSection,
-  h as FormSectionTitle,
-  T as FormSubsectionTitle,
+  T as FormSectionTitle,
+  h as FormSubsectionTitle,
   A as FormSubtitle,
   F as FormTextLine,
   S as Grid,
@@ -87,32 +88,33 @@ export {
   Z as List,
   B as ListButton,
   E as Loading,
-  Xo as LoginPage,
+  Zo as LoginPage,
   $ as LogoLoop,
-  Qo as Nav,
+  Xo as Nav,
   ro as Pagination,
   W as ScrollContainer,
-  co as SectionTitle,
+  ho as SectionTitle,
   to as SiteBanner,
-  bo as Toast,
-  vo as Toaster,
-  fo as Tooltip,
-  ho as VitalsDisplay,
-  po as WithLabel,
-  io as WithLoading,
+  fo as Tabs,
+  vo as Toast,
+  Io as Toaster,
+  po as Tooltip,
+  Ao as VitalsDisplay,
+  io as WithLabel,
+  lo as WithLoading,
   M as createDobToAgeExtension,
   R as createFormContext,
-  pr as createMsalInstance,
-  Mo as formatDateDisplay,
-  Ro as formatPhone,
-  Vo as formatSsnLast4,
-  Io as handleDismissToast,
-  ko as normalizePhone,
-  Po as saveToastForRedirect,
-  yo as showSavedToast,
-  Bo as showToast,
-  fr as useAuthContext,
+  ir as createMsalInstance,
+  Vo as formatDateDisplay,
+  ko as formatPhone,
+  zo as formatSsnLast4,
+  yo as handleDismissToast,
+  No as normalizePhone,
+  Bo as saveToastForRedirect,
+  wo as showSavedToast,
+  Eo as showToast,
+  pr as useAuthContext,
   N as useCustomAlert,
-  Wo as useRedirectToast,
-  Eo as useToast
+  Mo as useRedirectToast,
+  Wo as useToast
 };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "jcicl",
   "private": false,
-  "version": "1.1.5",
+  "version": "1.2.2",
   "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/problemDetails.d.ts

@@ -0,0 +1,20 @@
+/**
+ * Helpers for consuming an RFC 7807 / 9457 ProblemDetails error body — specifically the
+ * `errors` map produced by ASP.NET Core ValidationProblemDetails (field key → messages).
+ */
+/**
+ * The first non-empty message from a ProblemDetails `errors` map, or undefined if there is none.
+ * Useful as a human-readable fallback when the body has no `detail`/`title` (e.g. ValidationProblemDetails).
+ */
+export declare function firstProblemMessage(errors: Record<string, string[]> | undefined): string | undefined;
+/**
+ * Flatten a ProblemDetails `errors` map (field → messages) into a single message per field,
+ * keyed for direct use as a form's field errors (e.g. `setFieldErrors` on a jcicl form context).
+ *
+ * @param errors - The `errors` map from `ApiResponse.error.errors`.
+ * @param keyOverrides - Optional server-key → form-key remap, for when the backend emits keys that
+ *   don't match the form's field keys (e.g. nested `"address.city"` → `"city"`). When a server key
+ *   has no override it is used as-is.
+ * @returns A `Record<formKey, message>` with the first message for each field. Empty if no errors.
+ */
+export declare function mapProblemDetailsErrors(errors: Record<string, string[]> | undefined, keyOverrides?: Record<string, string>): Record<string, string>;

package/problemDetails.js

@@ -0,0 +1,19 @@
+function l(o) {
+  var t;
+  return o ? (t = Object.values(o).find((n) => n == null ? void 0 : n.length)) == null ? void 0 : t[0] : void 0;
+}
+function r(o, t) {
+  if (!o) return {};
+  const n = {};
+  for (const [f, c] of Object.entries(o)) {
+    const u = c == null ? void 0 : c[0];
+    if (!u) continue;
+    const i = (t == null ? void 0 : t[f]) ?? f;
+    n[i] = u;
+  }
+  return n;
+}
+export {
+  l as firstProblemMessage,
+  r as mapProblemDetailsErrors
+};

package/utils.d.ts

@@ -1,6 +1,6 @@
 export { states } from './constants';
-export { isValidEmail, isValidPhoneNumber, isValidZipCode, isValidCityName, isValidSSN } from './validators';
-export { formatDate, formatDateTime, formatPhoneNumber, formatZipCode, formatSSN, formatAddress, formatTimestamp, formattersByType, type FormatterFunction, } from './formatters';
+export { isValidEmail, isValidPhoneNumber, isValidZipCode, isValidCityName, isValidSSN, inputValidatorsByType, validateEmail, validatePhoneNumber, validateSSN, validateZipCode, type InputValidationFunction, } from './validators';
+export { formatDate, formatDateTime, formatPhoneNumber, formatZipCode, formatSSN, formatCurrency, formatAddress, formatTimestamp, formattersByType, type FormatterFunction, } from './formatters';
 export { maskSSN, defaultMasker, maskersByType, type MaskerFunction } from './maskers';
 /** A collection of input types that can be either formatted or masked, 'text' is also included so that custom maskers/formatters can be applied */
 export declare const formattedOrMaskedTypes: Set<string>;

package/utils.js

@@ -1,42 +1,48 @@
-import s from "./theme.js";
+import m from "./theme.js";
 import { formattersByType as i } from "./formatters.js";
-import { formatAddress as S, formatDate as T, formatDateTime as g, formatPhoneNumber as k, formatSSN as D, formatTimestamp as M, formatZipCode as N } from "./formatters.js";
-import { maskersByType as f } from "./maskers.js";
-import { defaultMasker as V, maskSSN as C } from "./maskers.js";
-import { states as j } from "./constants.js";
-import { isValidCityName as A, isValidEmail as B, isValidPhoneNumber as F, isValidSSN as I, isValidZipCode as P } from "./validators.js";
-import { u as m } from "./.chunks/useMediaQuery.js";
-const c = /* @__PURE__ */ new Set([
+import { formatAddress as x, formatCurrency as N, formatDate as T, formatDateTime as g, formatPhoneNumber as k, formatSSN as D, formatTimestamp as M, formatZipCode as V } from "./formatters.js";
+import { maskersByType as l } from "./maskers.js";
+import { defaultMasker as C, maskSSN as v } from "./maskers.js";
+import { states as O } from "./constants.js";
+import { inputValidatorsByType as Z, isValidCityName as j, isValidEmail as z, isValidPhoneNumber as A, isValidSSN as E, isValidZipCode as F, validateEmail as I, validatePhoneNumber as Y, validateSSN as $, validateZipCode as Q } from "./validators.js";
+import { u as s } from "./.chunks/useMediaQuery.js";
+const u = /* @__PURE__ */ new Set([
   ...Object.keys(i),
-  ...Object.keys(f),
+  ...Object.keys(l),
   "text"
-]), u = () => m(`(max-width: ${s.screenSizes.mobile})`), y = () => m(`(max-width: ${s.screenSizes.tablet})`), x = (e) => {
+]), c = () => s(`(max-width: ${m.screenSizes.mobile})`), y = () => s(`(max-width: ${m.screenSizes.tablet})`), S = (e) => {
   e = e.slice(0, 10) + "T00:00:00";
-  const t = /* @__PURE__ */ new Date(), o = new Date(e);
-  let r = t.getFullYear() - o.getFullYear();
-  const a = t.getMonth() - o.getMonth();
-  return (a < 0 || a === 0 && t.getDate() < o.getDate()) && r--, r;
+  const t = /* @__PURE__ */ new Date(), a = new Date(e);
+  let o = t.getFullYear() - a.getFullYear();
+  const r = t.getMonth() - a.getMonth();
+  return (r < 0 || r === 0 && t.getDate() < a.getDate()) && o--, o;
 };
 export {
-  x as calculateAge,
-  V as defaultMasker,
-  S as formatAddress,
+  S as calculateAge,
+  C as defaultMasker,
+  x as formatAddress,
+  N as formatCurrency,
   T as formatDate,
   g as formatDateTime,
   k as formatPhoneNumber,
   D as formatSSN,
   M as formatTimestamp,
-  N as formatZipCode,
-  c as formattedOrMaskedTypes,
+  V as formatZipCode,
+  u as formattedOrMaskedTypes,
   i as formattersByType,
-  A as isValidCityName,
-  B as isValidEmail,
-  F as isValidPhoneNumber,
-  I as isValidSSN,
-  P as isValidZipCode,
-  C as maskSSN,
-  f as maskersByType,
-  j as states,
-  u as useIsMobile,
-  y as useIsTablet
+  Z as inputValidatorsByType,
+  j as isValidCityName,
+  z as isValidEmail,
+  A as isValidPhoneNumber,
+  E as isValidSSN,
+  F as isValidZipCode,
+  v as maskSSN,
+  l as maskersByType,
+  O as states,
+  c as useIsMobile,
+  y as useIsTablet,
+  I as validateEmail,
+  Y as validatePhoneNumber,
+  $ as validateSSN,
+  Q as validateZipCode
 };

package/validators.d.ts

@@ -1,5 +1,13 @@
+import { FormInputType } from './inputTypes';
 export declare const isValidEmail: (email: string) => boolean;
 export declare const isValidPhoneNumber: (phone: string) => boolean;
 export declare const isValidZipCode: (zip: string) => boolean;
 export declare const isValidCityName: (city: string) => boolean;
 export declare const isValidSSN: (ssn: string) => boolean;
+export type InputValidationFunction = (value: string) => string | undefined;
+export declare const validateEmail: InputValidationFunction;
+export declare const validatePhoneNumber: InputValidationFunction;
+export declare const validateSSN: InputValidationFunction;
+export declare const validateZipCode: InputValidationFunction;
+/** Input validation functions that are automatically applied to FormInput based on the type */
+export declare const inputValidatorsByType: Partial<Record<FormInputType, InputValidationFunction>>;

package/validators.js

@@ -1,12 +1,22 @@
-const i = (e) => /^[^\s@]+@[^\s@]+\.[^\s@]+$/.test(e.trim()), n = (e) => {
+const s = (e) => /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/.test(e.trim()), i = (e) => {
   if (!e) return !1;
-  const s = e.replace(/\D/g, "");
-  return !!(e.trim() == s && s.length >= 10 && s.length <= 16 || /^\s*(?:\+?1\s*(?:[-\s]\s*)?)?(?:\(\s*\d{3}\s*\)|\d{3})(?:\s*[-\s]\s*)?\d{3}(?:\s*[-\s]\s*)?\d{4}(?:\s*(?:#|x\.?|ext\.?|extension)\s*\d{1,6})?\s*$/.test(e.trim()));
-}, r = (e) => /^\d{5}(?:\s*-?\s*\d{4})?$/.test(e), d = (e) => /^[a-zA-Z\s'.-]+$/.test(e), c = (e) => /^\d{3}-\d{2}-\d{4}$|^\d{9}$/.test(e);
+  const t = e.replace(/\D/g, "");
+  return !!(e.trim() == t && t.length >= 10 && t.length <= 16 || /^\s*(?:\+?1\s*(?:[-\s]\s*)?)?(?:\(\s*\d{3}\s*\)|\d{3})(?:\s*[-\s]\s*)?\d{3}(?:\s*[-\s]\s*)?\d{4}(?:\s*(?:#|x\.?|ext\.?|extension)\s*\d{1,6})?\s*$/.test(e.trim()));
+}, n = (e) => /^\d{5}(?:\s*-?\s*\d{4})?$/.test(e), m = (e) => /^[a-zA-Z\s'.-]+$/.test(e), a = (e) => /^\d{3}-\d{2}-\d{4}$|^\d{9}$/.test(e), d = (e) => s(e) ? void 0 : "Invalid email format (e.g., name@example.com).", o = (e) => i(e) ? void 0 : "Enter a valid phone number.", r = (e) => a(e) ? void 0 : "SSN must be 9 digits.", l = (e) => n(e) ? void 0 : "Zip code must be 5 or 9 digits.", g = {
+  email: d,
+  phone: o,
+  zip: l,
+  ssn: r
+};
 export {
-  d as isValidCityName,
-  i as isValidEmail,
-  n as isValidPhoneNumber,
-  c as isValidSSN,
-  r as isValidZipCode
+  g as inputValidatorsByType,
+  m as isValidCityName,
+  s as isValidEmail,
+  i as isValidPhoneNumber,
+  a as isValidSSN,
+  n as isValidZipCode,
+  d as validateEmail,
+  o as validatePhoneNumber,
+  r as validateSSN,
+  l as validateZipCode
 };