jcicl 1.0.61 → 1.0.63

package/AppContainer/AppContainer.js

@@ -819,6 +819,10 @@ const Pe = de(/* @__PURE__ */ i("path", {
       top: ${r.constants.appHeaderHeight}px;
       background-color: transparent;
     }
+
+    .MuiDrawer-root {
+      z-index: 13000;
+    }
   `
 })), rr = ({
   navProps: e,

package/DataPage/useDataPage.js

@@ -1,38 +1,46 @@
-import { useState as n, useRef as R, useEffect as b, useCallback as d } from "react";
+import { useState as r, useRef as R, useEffect as F, useCallback as d } from "react";
 const g = Symbol("DataPageResult");
-function S(e, a) {
-  return { [g]: !0, data: e, warnings: a };
+function P(t, u) {
+  return { [g]: !0, data: t, warnings: u };
 }
-const x = (e) => e == null ? !0 : Array.isArray(e) ? e.length === 0 : !1;
-function F({ fetchFn: e, deps: a = [] }) {
-  const [y, c] = n(null), [h, u] = n(!0), [w, o] = n(null), [A, l] = n([]), [E, m] = n(0), f = R(e);
-  f.current = e, b(() => {
-    let t = !1;
-    return u(!0), o(null), l([]), (async () => {
+const S = (t) => t == null ? !0 : Array.isArray(t) ? t.length === 0 : !1;
+function W({ fetchFn: t, deps: u = [] }) {
+  const [h, c] = r(null), [y, i] = r(!0), [w, a] = r(null), [m, f] = r([]), [A, E] = r(0), l = R(t);
+  l.current = t, F(() => {
+    let n = !1;
+    return i(!0), a(null), f([]), (async () => {
       try {
-        const r = await f.current();
-        if (t) return;
-        if (r && typeof r == "object" && g in r) {
-          const i = r;
-          c(i.data), l(i.warnings);
+        const e = await l.current();
+        if (n) return;
+        if (e === void 0) {
+          a("fetchFn returned undefined — did you forget a return statement?");
+          return;
+        }
+        if (e && typeof e == "object" && g in e) {
+          const o = e;
+          if (o.data === void 0) {
+            a("fetchFn returned undefined data inside withWarnings()");
+            return;
+          }
+          c(o.data), f(o.warnings);
         } else
-          c(r);
-      } catch (r) {
-        t || o(r instanceof Error ? r.message : "An unexpected error occurred");
+          c(e);
+      } catch (e) {
+        n || a(e instanceof Error ? e.message : "An unexpected error occurred");
       } finally {
-        t || u(!1);
+        n || i(!1);
       }
     })(), () => {
-      t = !0;
+      n = !0;
     };
-  }, [...a, E]);
-  const p = d((t) => {
-    c((s) => s !== null ? t(s) : s);
-  }, []), D = d(() => m((t) => t + 1), []);
-  return { data: y, loading: h, error: w, warnings: A, setData: p, refetch: D };
+  }, [...u, A]);
+  const p = d((n) => {
+    c((s) => s !== null ? n(s) : s);
+  }, []), D = d(() => E((n) => n + 1), []);
+  return { data: h, loading: y, error: w, warnings: m, setData: p, refetch: D };
 }
 export {
-  F as default,
-  x as defaultIsEmpty,
-  S as withWarnings
+  W as default,
+  S as defaultIsEmpty,
+  P as withWarnings
 };

package/DefaultTemplate/DefaultTemplate.d.ts

@@ -19,6 +19,8 @@ export type DefaultTemplateProps = AppContainerProps & {
     hasPagination?: boolean;
     fade?: boolean;
     siteBannerText?: string;
+    siteBannerBackgroundColor?: string;
+    siteBannerTextColor?: string;
 };
 declare const DefaultTemplate: React.FC<PropsWithChildren<DefaultTemplateProps>>;
 export default DefaultTemplate;

package/DefaultTemplate/DefaultTemplate.js

@@ -1,25 +1,25 @@
-import { jsx as r, jsxs as g, Fragment as $ } from "react/jsx-runtime";
-import { useState as S, useMemo as z } from "react";
+import { jsx as r, jsxs as g, Fragment as O } from "react/jsx-runtime";
+import { useState as b, useMemo as A } from "react";
 import { n as y } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as C } from "../.chunks/emotion-react.browser.esm.js";
-import t, { defaultTheme as T } from "../theme.js";
+import o, { defaultTheme as T } from "../theme.js";
 import { getHueFromHex as u, updateTheme as p } from "../themeUtils.js";
-import { ThemeContext as O } from "../ThemeContext.js";
-import A from "../AppContainer/AppContainer.js";
-import L from "../WithLoading/WithLoading.js";
-import { TopFade as j, BottomFade as D } from "../Overlays/Overlays.js";
-import { SiteBanner as W } from "../SiteBanner/SiteBanner.js";
-import { P as B } from "../.chunks/AppHeader.js";
-import { u as b } from "../.chunks/useMediaQuery.js";
-const H = ["loading", "hasPagination", "loadingColor", "hasFade", "isTablet"], G = y("div", { shouldForwardProp: (o) => !H.includes(o) })(({ loading: o, hasPagination: i, hasFade: m, loadingColor: l = t.colors.green }) => ({
+import { ThemeContext as L } from "../ThemeContext.js";
+import j from "../AppContainer/AppContainer.js";
+import D from "../WithLoading/WithLoading.js";
+import { TopFade as W, BottomFade as B } from "../Overlays/Overlays.js";
+import { SiteBanner as H } from "../SiteBanner/SiteBanner.js";
+import { P as G } from "../.chunks/AppHeader.js";
+import { u as S } from "../.chunks/useMediaQuery.js";
+const Q = ["loading", "hasPagination", "loadingColor", "hasFade", "isTablet"], N = y("div", { shouldForwardProp: (t) => !Q.includes(t) })(({ loading: t, hasPagination: i, hasFade: m, loadingColor: l = o.colors.green }) => ({
   ...C`
-    color: ${t.colors.midnight};
-    height: ${o ? "100%" : "auto"};
+    color: ${o.colors.midnight};
+    height: ${t ? "100%" : "auto"};
     padding: 19px;
     padding-top: 36px;
     display: flex;
     flex-direction: column;
-    justify-content: ${o ? "center" : "start"};
+    justify-content: ${t ? "center" : "start"};
     align-items: center;
     width: 100%;
     min-height: 100%;
@@ -33,7 +33,7 @@ const H = ["loading", "hasPagination", "loadingColor", "hasFade", "isTablet"], G
       color: ${l};
     }
   `
-})), Q = y("div")(() => ({
+})), q = y("div")(() => ({
   ...C`
     border-radius: 8px;
     padding: 0;
@@ -47,25 +47,27 @@ const H = ["loading", "hasPagination", "loadingColor", "hasFade", "isTablet"], G
     box-sizing: border-box;
   `
 }));
-function N(o, i) {
-  return o == "green" ? T : p(i);
+function E(t, i) {
+  return t == "green" ? T : p(i);
 }
-const oe = ({
-  children: o,
+const ie = ({
+  children: t,
   loading: i = !1,
   hasPagination: m = !1,
   fade: l = !0,
   siteBannerText: n,
-  userProfileMenuItems: w,
+  siteBannerBackgroundColor: w,
+  siteBannerTextColor: k,
+  userProfileMenuItems: I,
   ...s
 }) => {
-  const I = localStorage.getItem("theme") || "green", f = localStorage.getItem("hue") || u(t.themeOptions.green).toString(), x = b(`(max-width: ${t.screenSizes.mobile})`), M = b(`(max-width: ${t.screenSizes.tablet})`), [e, d] = S(
-    () => N(I, parseFloat(f))
-  ), [P, c] = S({ h: Math.max(parseFloat(f), 0) * 360, s: 0, v: 68, a: 1 }), k = [
+  const M = localStorage.getItem("theme") || "green", f = localStorage.getItem("hue") || u(o.themeOptions.green).toString(), x = S(`(max-width: ${o.screenSizes.mobile})`), P = S(`(max-width: ${o.screenSizes.tablet})`), [e, d] = b(
+    () => E(M, parseFloat(f))
+  ), [v, c] = b({ h: Math.max(parseFloat(f), 0) * 360, s: 0, v: 68, a: 1 }), F = [
     {
       label: "Default Theme",
       onClick: () => {
-        localStorage.setItem("theme", "green"), localStorage.setItem("hue", u(t.themeOptions.green).toString()), c((h) => ({ ...h, h: u(t.themeOptions.green) * 360 })), d(T);
+        localStorage.setItem("theme", "green"), localStorage.setItem("hue", u(o.themeOptions.green).toString()), c((h) => ({ ...h, h: u(o.themeOptions.green) * 360 })), d(T);
       }
     },
     {
@@ -78,15 +80,15 @@ const oe = ({
     },
     {
       label: "Hue",
-      hue: P.h,
+      hue: v.h,
       onChange: (a) => {
-        localStorage.setItem("theme", "custom"), localStorage.setItem("hue", (a.h / 360).toString()), c((F) => ({ ...F, h: a.h }));
+        localStorage.setItem("theme", "custom"), localStorage.setItem("hue", (a.h / 360).toString()), c((z) => ({ ...z, h: a.h }));
         const h = p(a.h / 360);
         d(h);
       }
     },
-    ...w || []
-  ], v = z(
+    ...I || []
+  ], $ = A(
     () => ({
       backgroundPrimary: e.themeLight,
       backgroundSecondary: e.themeLightA,
@@ -100,9 +102,9 @@ const oe = ({
       scrollColor: e.themeShadowA,
       loadingColor: e.themeColor,
       iconColors: {
-        icon: /* @__PURE__ */ r(B, {}),
-        iconColor: e.themeDark ?? t.colors.darkGreen,
-        backgroundColor: e.themeMediumA ?? t.colors.mint
+        icon: /* @__PURE__ */ r(G, {}),
+        iconColor: e.themeDark ?? o.colors.darkGreen,
+        backgroundColor: e.themeMediumA ?? o.colors.mint
       },
       highlightPrimary: e.highlightPrimary,
       highlightSecondary: e.highlightSecondary,
@@ -110,30 +112,37 @@ const oe = ({
     }),
     [e]
   );
-  return /* @__PURE__ */ g(O.Provider, { value: e, children: [
-    n && /* @__PURE__ */ r(W, { text: n }),
+  return /* @__PURE__ */ g(L.Provider, { value: e, children: [
+    n && /* @__PURE__ */ r(
+      H,
+      {
+        text: n,
+        backgroundColor: w,
+        textColor: k
+      }
+    ),
     /* @__PURE__ */ r(
-      A,
+      j,
       {
         ...s,
-        userProfileMenuItems: k,
-        themeColors: v ?? (s == null ? void 0 : s.themeColors),
+        userProfileMenuItems: F,
+        themeColors: $ ?? (s == null ? void 0 : s.themeColors),
         hasSiteBanner: !!n,
         children: /* @__PURE__ */ r(
-          G,
+          N,
           {
             className: "jcPageWrapper",
             loading: i,
             loadingColor: e.themeColor,
             hasPagination: m,
             hasFade: l,
-            isTablet: M,
-            children: /* @__PURE__ */ g(L, { loading: i, size: x ? 114 : 201, children: [
-              l && /* @__PURE__ */ g($, { children: [
-                /* @__PURE__ */ r(j, { color: e.themeLight, hasSiteBanner: !!n }),
-                /* @__PURE__ */ r(D, { hasPagination: m, isMobile: x, color: e.themeLight })
+            isTablet: P,
+            children: /* @__PURE__ */ g(D, { loading: i, size: x ? 114 : 201, children: [
+              l && /* @__PURE__ */ g(O, { children: [
+                /* @__PURE__ */ r(W, { color: e.themeLight, hasSiteBanner: !!n }),
+                /* @__PURE__ */ r(B, { hasPagination: m, isMobile: x, color: e.themeLight })
               ] }),
-              /* @__PURE__ */ r(Q, { children: o })
+              /* @__PURE__ */ r(q, { children: t })
             ] })
           }
         )
@@ -142,7 +151,7 @@ const oe = ({
   ] });
 };
 export {
-  Q as MainContentContainer,
-  G as PageWrapper,
-  oe as default
+  q as MainContentContainer,
+  N as PageWrapper,
+  ie as default
 };

package/SiteBanner/SiteBanner.d.ts

@@ -1,6 +1,8 @@
 import { default as React } from 'react';
 export interface SiteBannerProps {
     text: string;
+    backgroundColor?: string;
+    textColor?: string;
 }
 export declare const SiteBanner: React.FC<SiteBannerProps>;
 export default SiteBanner;

package/SiteBanner/SiteBanner.js

@@ -2,8 +2,8 @@ import { jsx as e } from "react/jsx-runtime";
 import { n as t } from "../.chunks/emotion-styled.browser.esm.js";
 import { c as r } from "../.chunks/emotion-react.browser.esm.js";
 import n from "../theme.js";
-import { useThemeColors as i } from "../ThemeContext.js";
-const a = t("div")(({ backgroundColor: o }) => ({
+import { useThemeColors as c } from "../ThemeContext.js";
+const m = t("div")(({ $backgroundColor: o }) => ({
   ...r`
     width: 100%;
     height: 54px;
@@ -14,20 +14,20 @@ const a = t("div")(({ backgroundColor: o }) => ({
     justify-content: center;
     box-sizing: border-box;
   `
-})), c = t("span")(() => ({
+})), l = t("span")(({ $textColor: o }) => ({
   ...r`
-    color: ${n.colors.white};
+    color: ${o};
     font-family: Roboto, sans-serif;
     font-size: 19px;
     font-weight: 500;
     text-align: center;
     text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.5);
   `
-})), f = ({ text: o }) => {
-  const s = i();
-  return /* @__PURE__ */ e(a, { backgroundColor: s.themeColor, children: /* @__PURE__ */ e(c, { children: o }) });
+})), b = ({ text: o, backgroundColor: s, textColor: i }) => {
+  const a = c();
+  return /* @__PURE__ */ e(m, { $backgroundColor: s ?? a.themeColor, children: /* @__PURE__ */ e(l, { $textColor: i ?? n.colors.white, children: o }) });
 };
 export {
-  f as SiteBanner,
-  f as default
+  b as SiteBanner,
+  b as default
 };

package/api.d.ts

@@ -0,0 +1,41 @@
+export interface ApiResponse<T> {
+    success: boolean;
+    data?: T | null;
+    error?: {
+        status: number;
+        statusText: string;
+        message: string;
+    };
+}
+/**
+ * Base API client for JCIT applications.
+ *
+ * Provides a generic `request<T>()` method with timeout, JSON parsing,
+ * and standardized error wrapping into `ApiResponse<T>`.
+ *
+ * Consumers extend this class, pass the base URL via `super()`, and
+ * add app-specific endpoint methods:
+ *
+ * ```typescript
+ * import { BaseApiClient } from 'jcicl/api';
+ *
+ * class MyAppApi extends BaseApiClient {
+ *   constructor() {
+ *     super(import.meta.env.VITE_API_BASE_URL);
+ *   }
+ *   async getItems() {
+ *     return this.request<Item[]>('/api/Items/GetItems');
+ *   }
+ * }
+ *
+ * export const api = new MyAppApi();
+ * ```
+ */
+export declare class BaseApiClient {
+    protected baseUrl: string;
+    constructor(baseUrl: string);
+    protected request<T>(endpoint: string, method?: 'GET' | 'POST' | 'PUT' | 'DELETE', body?: unknown, options?: {
+        timeoutMs?: number;
+        headers?: Record<string, string>;
+    }): Promise<ApiResponse<T>>;
+}

package/api.js

@@ -0,0 +1,79 @@
+var T = Object.defineProperty;
+var h = (s, e, r) => e in s ? T(s, e, { enumerable: !0, configurable: !0, writable: !0, value: r }) : s[e] = r;
+var m = (s, e, r) => h(s, typeof e != "symbol" ? e + "" : e, r);
+class x {
+  constructor(e) {
+    m(this, "baseUrl");
+    if (!e)
+      throw new Error(
+        "BaseApiClient: baseUrl is required. Pass import.meta.env.VITE_API_BASE_URL or equivalent."
+      );
+    this.baseUrl = e.endsWith("/") ? e.slice(0, -1) : e;
+  }
+  async request(e, r = "GET", n, a) {
+    const o = (a == null ? void 0 : a.timeoutMs) ?? 3e4, l = new AbortController(), d = setTimeout(() => l.abort(), o);
+    try {
+      const f = {
+        method: r,
+        headers: {
+          ...n !== void 0 ? { "Content-Type": "application/json" } : {},
+          ...a == null ? void 0 : a.headers
+        },
+        credentials: "include",
+        // Required for Windows Authentication with CORS
+        signal: l.signal
+      };
+      n !== void 0 && (f.body = JSON.stringify(n));
+      const t = await fetch(`${this.baseUrl}${e}`, f);
+      if (clearTimeout(d), !t.ok)
+        return {
+          success: !1,
+          error: {
+            status: t.status,
+            statusText: t.statusText,
+            message: `HTTP ${t.status}: ${t.statusText}`
+          }
+        };
+      if (t.status === 204)
+        return {
+          success: !0,
+          data: void 0
+        };
+      const c = await t.text();
+      if (!c || c === "null")
+        return {
+          success: !0,
+          data: null
+        };
+      let i;
+      try {
+        i = JSON.parse(c);
+      } catch {
+        i = c;
+      }
+      return {
+        success: !0,
+        data: i
+      };
+    } catch (u) {
+      return clearTimeout(d), u instanceof Error && u.name === "AbortError" ? {
+        success: !1,
+        error: {
+          status: 0,
+          statusText: "Timeout",
+          message: `Request timed out after ${o}ms`
+        }
+      } : {
+        success: !1,
+        error: {
+          status: 0,
+          statusText: "Network Error",
+          message: u instanceof Error ? u.message : "Unknown error occurred"
+        }
+      };
+    }
+  }
+}
+export {
+  x as BaseApiClient
+};

package/package.json

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