@pcoi/components 0.1.0 → 0.1.2

package/dist/index.mjs

@@ -1,58 +1,59 @@
-import { jsxs as n, jsx as e, Fragment as E } from "react/jsx-runtime";
-import _, { useState as $, useEffect as y, useRef as w, useCallback as R } from "react";
+import { jsxs as n, jsx as e, Fragment as j } from "react/jsx-runtime";
+import _, { useState as x, useEffect as y, useRef as w, useCallback as $ } from "react";
+import { ChevronDownIcon as z, CloseIcon as E, ArrowRightIcon as Y } from "@pcoi/icons";
 import { createPortal as F } from "react-dom";
 const I = _.forwardRef(
-  ({ href: i = "#", className: a = "", ...c }, l) => /* @__PURE__ */ n("a", { ref: l, href: i, className: `pcoi-logo ${a}`, ...c, children: [
-    /* @__PURE__ */ e("span", { className: "pcoi-logo__mark", children: "P" }),
+  ({ href: i = "#", className: l = "", ...a }, o) => /* @__PURE__ */ n("a", { ref: o, href: i, className: `pcoi-logo ${l}`, "aria-label": "PCOI home", ...a, children: [
+    /* @__PURE__ */ e("span", { className: "pcoi-logo__mark", "aria-hidden": "true", children: "P" }),
     "COI"
   ] })
 );
 I.displayName = "LogoMark";
 const k = _.forwardRef(
-  ({ variant: i = "primary", size: a = "default", children: c, className: l = "", ...o }, s) => {
+  ({ variant: i = "primary", size: l = "default", children: a, className: o = "", ...c }, s) => {
     const r = [
       "pcoi-btn",
       `pcoi-btn--${i}`,
-      a !== "default" ? `pcoi-btn--${a}` : "",
-      l
+      l !== "default" ? `pcoi-btn--${l}` : "",
+      o
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ e("button", { ref: s, className: r, ...o, children: c });
+    return /* @__PURE__ */ e("button", { ref: s, className: r, ...c, children: a });
   }
 );
 k.displayName = "Button";
 const g = _.forwardRef(
   ({
     label: i,
-    name: a,
-    multiline: c = !1,
-    rows: l = 3,
-    error: o,
+    name: l,
+    multiline: a = !1,
+    rows: o = 3,
+    error: c,
     required: s = !1,
     disabled: r = !1,
-    className: t = "",
+    className: d = "",
     ...p
-  }, d) => {
-    const h = `pcoi-field-${a}`, m = o ? `${h}-error` : void 0, u = [
+  }, t) => {
+    const h = `pcoi-field-${l}`, m = c ? `${h}-error` : void 0, N = [
       "pcoi-field",
-      o ? "pcoi-field--error" : "",
+      c ? "pcoi-field--error" : "",
       r ? "pcoi-field--disabled" : "",
-      t
+      d
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { className: u, children: [
+    return /* @__PURE__ */ n("div", { className: N, children: [
       /* @__PURE__ */ n("label", { htmlFor: h, className: "pcoi-field__label", children: [
         i,
         s && /* @__PURE__ */ e("span", { className: "pcoi-field__required", "aria-hidden": "true", children: "*" })
       ] }),
-      c ? /* @__PURE__ */ e(
+      a ? /* @__PURE__ */ e(
         "textarea",
         {
-          ref: d,
+          ref: t,
           id: h,
-          name: a,
-          rows: l,
+          name: l,
+          rows: o,
           required: s,
           disabled: r,
-          "aria-invalid": !!o,
+          "aria-invalid": !!c,
           "aria-describedby": m,
           className: "pcoi-field__textarea",
           ...p
@@ -60,39 +61,39 @@ const g = _.forwardRef(
       ) : /* @__PURE__ */ e(
         "input",
         {
-          ref: d,
+          ref: t,
           id: h,
-          name: a,
+          name: l,
           required: s,
           disabled: r,
-          "aria-invalid": !!o,
+          "aria-invalid": !!c,
           "aria-describedby": m,
           className: "pcoi-field__input",
           ...p
         }
       ),
-      o && /* @__PURE__ */ e("span", { id: m, className: "pcoi-field__error", role: "alert", children: o })
+      c && /* @__PURE__ */ e("span", { id: m, className: "pcoi-field__error", role: "alert", children: c })
     ] });
   }
 );
 g.displayName = "FormField";
-const Y = _.forwardRef(
-  ({ variant: i = "problem", title: a, description: c, icon: l, number: o, headingLevel: s = "h3", className: r = "", ...t }, p) => {
-    const d = s, h = [
+const V = _.forwardRef(
+  ({ variant: i = "problem", title: l, description: a, icon: o, number: c, headingLevel: s = "h3", className: r = "", ...d }, p) => {
+    const t = s, h = [
       "pcoi-card",
       `pcoi-card--${i}`,
       r
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { ref: p, className: h, ...t, children: [
-      i === "problem" && l && /* @__PURE__ */ e("div", { className: "pcoi-card__icon", children: l }),
-      i === "principle" && o && /* @__PURE__ */ e("div", { className: "pcoi-card__number", children: o }),
-      /* @__PURE__ */ e(d, { className: "pcoi-card__title", children: a }),
-      /* @__PURE__ */ e("p", { className: "pcoi-card__description", children: c })
+    return /* @__PURE__ */ n("div", { ref: p, className: h, ...d, children: [
+      i === "problem" && o && /* @__PURE__ */ e("div", { className: "pcoi-card__icon", children: o }),
+      i === "principle" && c && /* @__PURE__ */ e("div", { className: "pcoi-card__number", children: c }),
+      /* @__PURE__ */ e(t, { className: "pcoi-card__title", children: l }),
+      /* @__PURE__ */ e("p", { className: "pcoi-card__description", children: a })
     ] });
   }
 );
-Y.displayName = "Card";
-const K = _.forwardRef(
+V.displayName = "Card";
+const W = _.forwardRef(
   ({
     links: i = [
       { label: "Problem", href: "#problem" },
@@ -100,27 +101,27 @@ const K = _.forwardRef(
       { label: "Difference", href: "#difference" },
       { label: "Who It's For", href: "#who" }
     ],
-    ctaLabel: a = "Start a Conversation",
-    ctaHref: c = "#contact",
-    onCtaClick: l,
-    className: o = "",
+    ctaLabel: l = "Start a Conversation",
+    ctaHref: a = "#contact",
+    onCtaClick: o,
+    className: c = "",
     ...s
   }, r) => {
-    const [t, p] = $(!1), [d, h] = $(!1);
+    const [d, p] = x(!1), [t, h] = x(!1);
     return y(() => {
       const m = () => p(window.scrollY > 40);
       return window.addEventListener("scroll", m, { passive: !0 }), m(), () => window.removeEventListener("scroll", m);
     }, []), y(() => {
-      if (!d) return;
-      const m = (u) => {
-        u.key === "Escape" && h(!1);
+      if (!t) return;
+      const m = (N) => {
+        N.key === "Escape" && h(!1);
       };
       return document.addEventListener("keydown", m), () => document.removeEventListener("keydown", m);
-    }, [d]), /* @__PURE__ */ n(
+    }, [t]), /* @__PURE__ */ n(
       "nav",
       {
         ref: r,
-        className: `pcoi-nav ${t ? "pcoi-nav--scrolled" : ""} ${d ? "pcoi-nav--menu-open" : ""} ${o}`,
+        className: `pcoi-nav ${d ? "pcoi-nav--scrolled" : ""} ${t ? "pcoi-nav--menu-open" : ""} ${c}`,
         "aria-label": "Main",
         ...s,
         children: [
@@ -128,15 +129,15 @@ const K = _.forwardRef(
             /* @__PURE__ */ e(I, {}),
             /* @__PURE__ */ n("div", { className: "pcoi-nav__links", children: [
               i.map((m) => /* @__PURE__ */ e("a", { href: m.href, "data-track-id": m.trackingId, children: m.label }, m.href)),
-              /* @__PURE__ */ e("a", { href: c, children: /* @__PURE__ */ e(k, { variant: "nav-cta", onClick: l, children: a }) })
+              /* @__PURE__ */ e("a", { href: a, children: /* @__PURE__ */ e(k, { variant: "nav-cta", onClick: o, children: l }) })
             ] }),
             /* @__PURE__ */ n(
               "button",
               {
-                className: `pcoi-nav__hamburger ${d ? "pcoi-nav__hamburger--active" : ""}`,
-                onClick: () => h(!d),
+                className: `pcoi-nav__hamburger ${t ? "pcoi-nav__hamburger--active" : ""}`,
+                onClick: () => h(!t),
                 "aria-label": "Toggle menu",
-                "aria-expanded": d,
+                "aria-expanded": t,
                 "aria-controls": "pcoi-mobile-menu",
                 children: [
                   /* @__PURE__ */ e("span", {}),
@@ -146,68 +147,68 @@ const K = _.forwardRef(
               }
             )
           ] }),
-          /* @__PURE__ */ n("div", { className: "pcoi-nav__mobile-menu", id: "pcoi-mobile-menu", children: [
-            i.map((m) => /* @__PURE__ */ e("a", { href: m.href, "data-track-id": m.trackingId, onClick: () => h(!1), children: m.label }, m.href)),
-            /* @__PURE__ */ e("a", { href: c, children: /* @__PURE__ */ e(k, { variant: "nav-cta", onClick: () => {
-              l == null || l(), h(!1);
-            }, children: a }) })
+          /* @__PURE__ */ n("div", { className: "pcoi-nav__mobile-menu", id: "pcoi-mobile-menu", role: "menu", "aria-hidden": !t, children: [
+            i.map((m) => /* @__PURE__ */ e("a", { href: m.href, "data-track-id": m.trackingId, role: "menuitem", tabIndex: t ? 0 : -1, onClick: () => h(!1), children: m.label }, m.href)),
+            /* @__PURE__ */ e("a", { href: a, children: /* @__PURE__ */ e(k, { variant: "nav-cta", onClick: () => {
+              o == null || o(), h(!1);
+            }, children: l }) })
           ] })
         ]
       }
     );
   }
 );
-K.displayName = "Nav";
-const z = _.forwardRef(
-  ({ label: i, title: a, titleEmphasis: c, description: l, headingLevel: o = "h2", className: s = "", ...r }, t) => {
-    const p = o;
-    return /* @__PURE__ */ n("div", { ref: t, className: `pcoi-section-header ${s}`, ...r, children: [
+W.displayName = "Nav";
+const K = _.forwardRef(
+  ({ label: i, title: l, titleEmphasis: a, description: o, headingLevel: c = "h2", className: s = "", ...r }, d) => {
+    const p = c;
+    return /* @__PURE__ */ n("div", { ref: d, className: `pcoi-section-header ${s}`, ...r, children: [
       /* @__PURE__ */ e("span", { className: "pcoi-section-header__label", children: i }),
-      /* @__PURE__ */ e(p, { className: "pcoi-section-header__title", children: c ? /* @__PURE__ */ n(E, { children: [
-        a.replace(c, ""),
-        /* @__PURE__ */ e("em", { children: c })
-      ] }) : a }),
-      l && /* @__PURE__ */ e("p", { className: "pcoi-section-header__desc", children: l })
+      /* @__PURE__ */ e(p, { className: "pcoi-section-header__title", children: a ? /* @__PURE__ */ n(j, { children: [
+        l.replace(a, ""),
+        /* @__PURE__ */ e("em", { children: a })
+      ] }) : l }),
+      o && /* @__PURE__ */ e("p", { className: "pcoi-section-header__desc", children: o })
     ] });
   }
 );
-z.displayName = "SectionHeader";
-const V = _.forwardRef(
-  ({ number: i, title: a, description: c, isLast: l = !1, headingLevel: o = "h3", className: s = "", ...r }, t) => {
-    const p = o;
-    return /* @__PURE__ */ n("div", { ref: t, className: `pcoi-how-step ${l ? "pcoi-how-step--last" : ""} ${s}`, ...r, children: [
+K.displayName = "SectionHeader";
+const G = _.forwardRef(
+  ({ number: i, title: l, description: a, isLast: o = !1, headingLevel: c = "h3", className: s = "", ...r }, d) => {
+    const p = c;
+    return /* @__PURE__ */ n("div", { ref: d, className: `pcoi-how-step ${o ? "pcoi-how-step--last" : ""} ${s}`, ...r, children: [
       /* @__PURE__ */ e("div", { className: "pcoi-how-step__number", children: i }),
       /* @__PURE__ */ n("div", { className: "pcoi-how-step__content", children: [
-        /* @__PURE__ */ e(p, { className: "pcoi-how-step__title", children: a }),
-        /* @__PURE__ */ e("p", { className: "pcoi-how-step__desc", children: c })
+        /* @__PURE__ */ e(p, { className: "pcoi-how-step__title", children: l }),
+        /* @__PURE__ */ e("p", { className: "pcoi-how-step__desc", children: a })
       ] })
     ] });
   }
 );
-V.displayName = "HowStep";
-const G = _.forwardRef(
-  ({ competitorName: i = "Typical SaaS AI", pcoiName: a = "PCOI", rows: c, className: l = "", ...o }, s) => /* @__PURE__ */ e("div", { ref: s, className: `pcoi-comparison ${l}`, ...o, children: /* @__PURE__ */ n("table", { className: "pcoi-comparison__table", children: [
+G.displayName = "HowStep";
+const J = _.forwardRef(
+  ({ competitorName: i = "Typical SaaS AI", pcoiName: l = "PCOI", rows: a, className: o = "", ...c }, s) => /* @__PURE__ */ e("div", { ref: s, className: `pcoi-comparison ${o}`, ...c, children: /* @__PURE__ */ n("table", { className: "pcoi-comparison__table", children: [
     /* @__PURE__ */ e("thead", { children: /* @__PURE__ */ n("tr", { className: "pcoi-comparison__header", children: [
       /* @__PURE__ */ e("th", { className: "pcoi-comparison__col", scope: "col", children: /* @__PURE__ */ e("span", { className: "pcoi-sr-only", children: "Feature" }) }),
       /* @__PURE__ */ e("th", { className: "pcoi-comparison__col", scope: "col", children: i }),
-      /* @__PURE__ */ e("th", { className: "pcoi-comparison__col pcoi-comparison__col--highlight", scope: "col", children: a })
+      /* @__PURE__ */ e("th", { className: "pcoi-comparison__col pcoi-comparison__col--highlight", scope: "col", children: l })
     ] }) }),
-    /* @__PURE__ */ e("tbody", { children: c.map((r, t) => /* @__PURE__ */ n("tr", { className: "pcoi-comparison__row", children: [
+    /* @__PURE__ */ e("tbody", { children: a.map((r, d) => /* @__PURE__ */ n("tr", { className: "pcoi-comparison__row", children: [
       /* @__PURE__ */ e("th", { className: "pcoi-comparison__col pcoi-comparison__col--label", scope: "row", children: r.label }),
       /* @__PURE__ */ e("td", { className: "pcoi-comparison__col", children: r.competitor }),
       /* @__PURE__ */ e("td", { className: "pcoi-comparison__col pcoi-comparison__col--highlight", children: r.pcoi })
-    ] }, t)) })
+    ] }, d)) })
   ] }) })
 );
-G.displayName = "ComparisonTable";
-const J = _.forwardRef(
-  ({ onSubmit: i, className: a = "", ...c }, l) => {
-    const [o, s] = $(!1), r = (t) => {
-      t.preventDefault();
-      const p = t.currentTarget, d = new FormData(p), h = Object.fromEntries(d.entries());
+J.displayName = "ComparisonTable";
+const Q = _.forwardRef(
+  ({ onSubmit: i, className: l = "", ...a }, o) => {
+    const [c, s] = x(!1), r = (d) => {
+      d.preventDefault();
+      const p = d.currentTarget, t = new FormData(p), h = Object.fromEntries(t.entries());
       i == null || i(h), s(!0), p.reset(), setTimeout(() => s(!1), 3e3);
     };
-    return /* @__PURE__ */ n("form", { ref: l, className: `pcoi-form ${a}`, onSubmit: r, "aria-label": "Contact form", ...c, children: [
+    return /* @__PURE__ */ n("form", { ref: o, className: `pcoi-form ${l}`, onSubmit: r, "aria-label": "Contact form", ...a, children: [
       /* @__PURE__ */ n("div", { className: "pcoi-form__row", children: [
         /* @__PURE__ */ e(g, { label: "Name", name: "name", placeholder: "Your name", required: !0 }),
         /* @__PURE__ */ e(g, { label: "Company", name: "company", placeholder: "Company name", required: !0 })
@@ -227,41 +228,41 @@ const J = _.forwardRef(
           className: "pcoi-form__full"
         }
       ),
-      /* @__PURE__ */ e(k, { type: "submit", variant: "primary", size: "large", disabled: o, children: o ? "Message Received" : "Start the Conversation" }),
+      /* @__PURE__ */ e(k, { type: "submit", variant: "primary", size: "large", disabled: c, children: c ? "Message Received" : "Start the Conversation" }),
       /* @__PURE__ */ e("p", { className: "pcoi-form__note", children: "No sales automation. A real person reads this and responds personally." })
     ] });
   }
 );
-J.displayName = "ContactForm";
-const Q = _.forwardRef(
-  ({ quote: i, attribution: a, attributionTitle: c, sourceUrl: l, sourceLabel: o, className: s = "", ...r }, t) => /* @__PURE__ */ n("div", { ref: t, className: `pcoi-callout ${s}`, ...r, children: [
-    /* @__PURE__ */ e("div", { className: "pcoi-callout__line" }),
-    /* @__PURE__ */ e("p", { className: "pcoi-callout__quote", children: i }),
-    (a || l) && /* @__PURE__ */ n("p", { className: "pcoi-callout__attribution", children: [
-      c && /* @__PURE__ */ n("span", { children: [
-        c,
+Q.displayName = "ContactForm";
+const X = _.forwardRef(
+  ({ quote: i, attribution: l, attributionTitle: a, sourceUrl: o, sourceLabel: c, className: s = "", ...r }, d) => /* @__PURE__ */ n("figure", { ref: d, className: `pcoi-callout ${s}`, ...r, children: [
+    /* @__PURE__ */ e("div", { className: "pcoi-callout__line", "aria-hidden": "true" }),
+    /* @__PURE__ */ e("blockquote", { className: "pcoi-callout__quote", children: /* @__PURE__ */ e("p", { children: i }) }),
+    (l || o) && /* @__PURE__ */ n("figcaption", { className: "pcoi-callout__attribution", children: [
+      a && /* @__PURE__ */ n("span", { children: [
+        a,
         "  ~  "
       ] }),
-      a,
-      l && /* @__PURE__ */ n(E, { children: [
+      l,
+      o && /* @__PURE__ */ n(j, { children: [
         "  |  ",
-        /* @__PURE__ */ e("a", { href: l, target: "_blank", rel: "noopener noreferrer", children: o || "Source" })
+        /* @__PURE__ */ e("a", { href: o, target: "_blank", rel: "noopener noreferrer", children: c || "Source" })
       ] })
     ] })
   ] })
 );
-Q.displayName = "Callout";
-const X = _.forwardRef(
-  ({ title: i = "You'll know this is for you if:", signals: a, headingLevel: c = "h3", className: l = "", ...o }, s) => {
-    const r = c;
-    return /* @__PURE__ */ n("div", { ref: s, className: `pcoi-signals ${l}`, ...o, children: [
+X.displayName = "Callout";
+const Z = _.forwardRef(
+  ({ title: i = "You'll know this is for you if:", signals: l, headingLevel: a = "h3", className: o = "", ...c }, s) => {
+    const r = a;
+    return /* @__PURE__ */ n("div", { ref: s, className: `pcoi-signals ${o}`, ...c, children: [
       /* @__PURE__ */ e(r, { className: "pcoi-signals__title", children: i }),
-      /* @__PURE__ */ e("ul", { className: "pcoi-signals__list", children: a.map((t, p) => /* @__PURE__ */ e("li", { className: "pcoi-signals__item", children: t }, p)) })
+      /* @__PURE__ */ e("ul", { className: "pcoi-signals__list", children: l.map((d, p) => /* @__PURE__ */ e("li", { className: "pcoi-signals__item", children: d }, p)) })
     ] });
   }
 );
-X.displayName = "SignalsPanel";
-const Z = _.forwardRef(
+Z.displayName = "SignalsPanel";
+const U = _.forwardRef(
   ({
     links: i = [
       { label: "Problem", href: "#problem" },
@@ -271,68 +272,42 @@ const Z = _.forwardRef(
       { label: "Who It's For", href: "#who" },
       { label: "Contact", href: "#contact" }
     ],
-    tagline: a = `Portable, Company-Owned
+    tagline: l = `Portable, Company-Owned
 Operational Intelligence`,
-    copyright: c = `© ${(/* @__PURE__ */ new Date()).getFullYear()} PCOI. Operational intelligence you own.`,
-    className: l = "",
-    ...o
-  }, s) => /* @__PURE__ */ n("footer", { ref: s, className: `pcoi-footer ${l}`, ...o, children: [
+    copyright: a = `© ${(/* @__PURE__ */ new Date()).getFullYear()} PCOI. Operational intelligence you own.`,
+    className: o = "",
+    ...c
+  }, s) => /* @__PURE__ */ n("footer", { ref: s, className: `pcoi-footer ${o}`, ...c, children: [
     /* @__PURE__ */ n("div", { className: "pcoi-footer__inner", children: [
       /* @__PURE__ */ n("div", { className: "pcoi-footer__brand", children: [
         /* @__PURE__ */ e(I, { className: "pcoi-footer__logo" }),
-        /* @__PURE__ */ e("p", { className: "pcoi-footer__tagline", children: a })
+        /* @__PURE__ */ e("p", { className: "pcoi-footer__tagline", children: l })
       ] }),
-      /* @__PURE__ */ e("div", { className: "pcoi-footer__links", children: i.map((r) => /* @__PURE__ */ e("a", { href: r.href, "data-track-id": r.trackingId, children: r.label }, r.href)) })
+      /* @__PURE__ */ e("nav", { className: "pcoi-footer__links", "aria-label": "Footer", children: i.map((r) => /* @__PURE__ */ e("a", { href: r.href, "data-track-id": r.trackingId, children: r.label }, r.href)) })
     ] }),
-    /* @__PURE__ */ e("div", { className: "pcoi-footer__bottom", children: /* @__PURE__ */ e("p", { children: c }) })
+    /* @__PURE__ */ e("div", { className: "pcoi-footer__bottom", children: /* @__PURE__ */ e("p", { children: a }) })
   ] })
 );
-Z.displayName = "Footer";
-const T = ({
-  size: i = 24,
-  title: a,
-  ...c
-}) => /* @__PURE__ */ n(
-  "svg",
-  {
-    width: i,
-    height: i,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: 1.5,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    role: a ? "img" : "presentation",
-    "aria-hidden": !a,
-    xmlns: "http://www.w3.org/2000/svg",
-    ...c,
-    children: [
-      a && /* @__PURE__ */ e("title", { children: a }),
-      /* @__PURE__ */ e("polyline", { points: "6 9 12 15 18 9" })
-    ]
-  }
-);
-T.displayName = "ChevronDownIcon";
-const U = _.forwardRef(
+U.displayName = "Footer";
+const ee = _.forwardRef(
   ({
     label: i,
-    name: a,
-    options: c,
-    placeholder: l,
-    error: o,
+    name: l,
+    options: a,
+    placeholder: o,
+    error: c,
     required: s = !1,
     disabled: r = !1,
-    className: t = "",
+    className: d = "",
     ...p
-  }, d) => {
-    const h = `pcoi-field-${a}`, m = o ? `${h}-error` : void 0, u = [
+  }, t) => {
+    const h = `pcoi-field-${l}`, m = c ? `${h}-error` : void 0, N = [
       "pcoi-select",
-      o ? "pcoi-select--error" : "",
+      c ? "pcoi-select--error" : "",
       r ? "pcoi-select--disabled" : "",
-      t
+      d
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { className: u, children: [
+    return /* @__PURE__ */ n("div", { className: N, children: [
       /* @__PURE__ */ n("label", { htmlFor: h, className: "pcoi-select__label", children: [
         i,
         s && /* @__PURE__ */ e("span", { className: "pcoi-select__required", "aria-hidden": "true", children: "*" })
@@ -341,55 +316,55 @@ const U = _.forwardRef(
         /* @__PURE__ */ n(
           "select",
           {
-            ref: d,
+            ref: t,
             id: h,
-            name: a,
+            name: l,
             required: s,
             disabled: r,
-            "aria-invalid": !!o,
+            "aria-invalid": !!c,
             "aria-describedby": m,
             className: "pcoi-select__native",
-            defaultValue: l ? "" : void 0,
+            defaultValue: o ? "" : void 0,
             ...p,
             children: [
-              l && /* @__PURE__ */ e("option", { value: "", disabled: !0, hidden: !0, children: l }),
-              c.map((f) => /* @__PURE__ */ e("option", { value: f.value, disabled: f.disabled, children: f.label }, f.value))
+              o && /* @__PURE__ */ e("option", { value: "", disabled: !0, hidden: !0, children: o }),
+              a.map((f) => /* @__PURE__ */ e("option", { value: f.value, disabled: f.disabled, children: f.label }, f.value))
             ]
           }
         ),
-        /* @__PURE__ */ e("span", { className: "pcoi-select__chevron", "aria-hidden": "true", children: /* @__PURE__ */ e(T, { size: 16 }) })
+        /* @__PURE__ */ e("span", { className: "pcoi-select__chevron", "aria-hidden": "true", children: /* @__PURE__ */ e(z, { size: 16 }) })
       ] }),
-      o && /* @__PURE__ */ e("span", { id: m, className: "pcoi-select__error", role: "alert", children: o })
+      c && /* @__PURE__ */ e("span", { id: m, className: "pcoi-select__error", role: "alert", children: c })
     ] });
   }
 );
-U.displayName = "Select";
-const ee = _.forwardRef(
+ee.displayName = "Select";
+const ae = _.forwardRef(
   ({
     label: i,
-    name: a,
-    error: c,
-    disabled: l = !1,
-    className: o = "",
+    name: l,
+    error: a,
+    disabled: o = !1,
+    className: c = "",
     ...s
   }, r) => {
-    const t = `pcoi-field-${a}`, p = c ? `${t}-error` : void 0, d = [
+    const d = `pcoi-field-${l}`, p = a ? `${d}-error` : void 0, t = [
       "pcoi-checkbox",
-      c ? "pcoi-checkbox--error" : "",
-      l ? "pcoi-checkbox--disabled" : "",
-      o
+      a ? "pcoi-checkbox--error" : "",
+      o ? "pcoi-checkbox--disabled" : "",
+      c
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { className: d, children: [
-      /* @__PURE__ */ n("label", { htmlFor: t, className: "pcoi-checkbox__control", children: [
+    return /* @__PURE__ */ n("div", { className: t, children: [
+      /* @__PURE__ */ n("label", { htmlFor: d, className: "pcoi-checkbox__control", children: [
         /* @__PURE__ */ e(
           "input",
           {
             ref: r,
             type: "checkbox",
-            id: t,
-            name: a,
-            disabled: l,
-            "aria-invalid": !!c,
+            id: d,
+            name: l,
+            disabled: o,
+            "aria-invalid": !!a,
             "aria-describedby": p,
             className: "pcoi-checkbox__input",
             ...s
@@ -398,37 +373,37 @@ const ee = _.forwardRef(
         /* @__PURE__ */ e("span", { className: "pcoi-checkbox__box", "aria-hidden": "true" }),
         /* @__PURE__ */ e("span", { className: "pcoi-checkbox__label", children: i })
       ] }),
-      c && /* @__PURE__ */ e("span", { id: p, className: "pcoi-checkbox__error", role: "alert", children: c })
+      a && /* @__PURE__ */ e("span", { id: p, className: "pcoi-checkbox__error", role: "alert", children: a })
     ] });
   }
 );
-ee.displayName = "Checkbox";
-const ae = _.forwardRef(
+ae.displayName = "Checkbox";
+const ie = _.forwardRef(
   ({
     label: i,
-    name: a,
-    error: c,
-    disabled: l = !1,
-    className: o = "",
+    name: l,
+    error: a,
+    disabled: o = !1,
+    className: c = "",
     ...s
   }, r) => {
-    const t = `pcoi-field-${a}`, p = c ? `${t}-error` : void 0, d = [
+    const d = `pcoi-field-${l}`, p = a ? `${d}-error` : void 0, t = [
       "pcoi-toggle",
-      c ? "pcoi-toggle--error" : "",
-      l ? "pcoi-toggle--disabled" : "",
-      o
+      a ? "pcoi-toggle--error" : "",
+      o ? "pcoi-toggle--disabled" : "",
+      c
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { className: d, children: [
-      /* @__PURE__ */ n("label", { htmlFor: t, className: "pcoi-toggle__control", children: [
+    return /* @__PURE__ */ n("div", { className: t, children: [
+      /* @__PURE__ */ n("label", { htmlFor: d, className: "pcoi-toggle__control", children: [
         /* @__PURE__ */ e(
           "input",
           {
             ref: r,
             type: "checkbox",
-            id: t,
-            name: a,
-            disabled: l,
-            "aria-invalid": !!c,
+            id: d,
+            name: l,
+            disabled: o,
+            "aria-invalid": !!a,
             "aria-describedby": p,
             className: "pcoi-toggle__input",
             role: "switch",
@@ -438,328 +413,322 @@ const ae = _.forwardRef(
         /* @__PURE__ */ e("span", { className: "pcoi-toggle__track", "aria-hidden": "true", children: /* @__PURE__ */ e("span", { className: "pcoi-toggle__thumb" }) }),
         /* @__PURE__ */ e("span", { className: "pcoi-toggle__label", children: i })
       ] }),
-      c && /* @__PURE__ */ e("span", { id: p, className: "pcoi-toggle__error", role: "alert", children: c })
+      a && /* @__PURE__ */ e("span", { id: p, className: "pcoi-toggle__error", role: "alert", children: a })
     ] });
   }
 );
-ae.displayName = "Toggle";
-const ie = _.forwardRef(
+ie.displayName = "Toggle";
+const ce = _.forwardRef(
   ({
     label: i,
-    name: a,
-    options: c,
-    defaultValue: l,
-    error: o,
+    name: l,
+    options: a,
+    defaultValue: o,
+    error: c,
     required: s = !1,
     disabled: r = !1,
-    onChange: t,
+    onChange: d,
     className: p = "",
-    ...d
+    ...t
   }, h) => {
-    const m = o ? `pcoi-field-${a}-error` : void 0, u = [
+    const m = c ? `pcoi-field-${l}-error` : void 0, N = [
       "pcoi-radio-group",
-      o ? "pcoi-radio-group--error" : "",
+      c ? "pcoi-radio-group--error" : "",
       r ? "pcoi-radio-group--disabled" : "",
       p
-    ].filter(Boolean).join(" "), f = (N) => {
-      t == null || t(N.target.value);
+    ].filter(Boolean).join(" "), f = (u) => {
+      d == null || d(u.target.value);
     };
     return /* @__PURE__ */ n(
       "fieldset",
       {
         ref: h,
-        className: u,
-        "aria-invalid": !!o,
+        className: N,
+        "aria-invalid": !!c,
         "aria-describedby": m,
-        ...d,
+        ...t,
         children: [
           /* @__PURE__ */ n("legend", { className: "pcoi-radio-group__legend", children: [
             i,
             s && /* @__PURE__ */ e("span", { className: "pcoi-radio-group__required", "aria-hidden": "true", children: "*" })
           ] }),
-          /* @__PURE__ */ e("div", { className: "pcoi-radio-group__options", children: c.map((N) => {
-            const x = `pcoi-field-${a}-${N.value}`;
+          /* @__PURE__ */ e("div", { className: "pcoi-radio-group__options", children: a.map((u) => {
+            const C = `pcoi-field-${l}-${u.value}`;
             return /* @__PURE__ */ n(
               "label",
               {
-                htmlFor: x,
+                htmlFor: C,
                 className: "pcoi-radio-group__option",
                 children: [
                   /* @__PURE__ */ e(
                     "input",
                     {
                       type: "radio",
-                      id: x,
-                      name: a,
-                      value: N.value,
-                      defaultChecked: l === N.value,
+                      id: C,
+                      name: l,
+                      value: u.value,
+                      defaultChecked: o === u.value,
                       required: s,
-                      disabled: r || N.disabled,
+                      disabled: r || u.disabled,
                       onChange: f,
                       className: "pcoi-radio-group__input"
                     }
                   ),
                   /* @__PURE__ */ e("span", { className: "pcoi-radio-group__circle", "aria-hidden": "true" }),
-                  /* @__PURE__ */ e("span", { className: "pcoi-radio-group__label", children: N.label })
+                  /* @__PURE__ */ e("span", { className: "pcoi-radio-group__label", children: u.label })
                 ]
               },
-              N.value
+              u.value
             );
           }) }),
-          o && /* @__PURE__ */ e("span", { id: m, className: "pcoi-radio-group__error", role: "alert", children: o })
+          c && /* @__PURE__ */ e("span", { id: m, className: "pcoi-radio-group__error", role: "alert", children: c })
         ]
       }
     );
   }
 );
-ie.displayName = "RadioGroup";
-const ce = _.forwardRef(
+ce.displayName = "RadioGroup";
+const le = _.forwardRef(
   ({
     title: i,
-    headingLevel: a = "h3",
-    action: c,
-    children: l,
-    flush: o = !1,
+    headingLevel: l = "h3",
+    action: a,
+    children: o,
+    flush: c = !1,
     className: s = "",
     ...r
-  }, t) => {
-    const p = a, d = [
+  }, d) => {
+    const p = l, t = [
       "pcoi-panel",
-      o ? "pcoi-panel--flush" : "",
+      c ? "pcoi-panel--flush" : "",
       s
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { ref: t, className: d, ...r, children: [
-      (i || c) && /* @__PURE__ */ n("div", { className: "pcoi-panel__header", children: [
+    return /* @__PURE__ */ n("div", { ref: d, className: t, ...r, children: [
+      (i || a) && /* @__PURE__ */ n("div", { className: "pcoi-panel__header", children: [
         i && /* @__PURE__ */ e(p, { className: "pcoi-panel__title", children: i }),
-        c && /* @__PURE__ */ e("div", { className: "pcoi-panel__action", children: c })
+        a && /* @__PURE__ */ e("div", { className: "pcoi-panel__action", children: a })
       ] }),
-      /* @__PURE__ */ e("div", { className: "pcoi-panel__body", children: l })
+      /* @__PURE__ */ e("div", { className: "pcoi-panel__body", children: o })
     ] });
   }
 );
-ce.displayName = "Panel";
+le.displayName = "Panel";
 const oe = _.forwardRef(
   ({
     columns: i,
-    rows: a,
-    rowKey: c,
-    emptyText: l = "No data available",
-    ariaLabel: o,
+    rows: l,
+    rowKey: a,
+    emptyText: o = "No data available",
+    ariaLabel: c,
     className: s = "",
     ...r
-  }, t) => {
-    const p = (d, h) => c ? typeof c == "function" ? c(d, h) : String(d[c]) : String(h);
-    return /* @__PURE__ */ e("div", { ref: t, className: `pcoi-data-table ${s}`, ...r, children: /* @__PURE__ */ n("table", { className: "pcoi-data-table__table", "aria-label": o, children: [
-      /* @__PURE__ */ e("thead", { className: "pcoi-data-table__head", children: /* @__PURE__ */ e("tr", { className: "pcoi-data-table__head-row", children: i.map((d) => /* @__PURE__ */ e(
+  }, d) => {
+    const p = (t, h) => a ? typeof a == "function" ? a(t, h) : String(t[a]) : String(h);
+    return /* @__PURE__ */ e("div", { ref: d, className: `pcoi-data-table ${s}`, ...r, children: /* @__PURE__ */ n("table", { className: "pcoi-data-table__table", "aria-label": c, children: [
+      /* @__PURE__ */ e("thead", { className: "pcoi-data-table__head", children: /* @__PURE__ */ e("tr", { className: "pcoi-data-table__head-row", children: i.map((t) => /* @__PURE__ */ e(
         "th",
         {
-          className: `pcoi-data-table__th${d.align ? ` pcoi-data-table__th--${d.align}` : ""}`,
-          children: d.header
+          className: `pcoi-data-table__th${t.align ? ` pcoi-data-table__th--${t.align}` : ""}`,
+          children: t.header
         },
-        d.key
+        t.key
       )) }) }),
-      /* @__PURE__ */ e("tbody", { className: "pcoi-data-table__body", children: a.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
+      /* @__PURE__ */ e("tbody", { className: "pcoi-data-table__body", children: l.length === 0 ? /* @__PURE__ */ e("tr", { children: /* @__PURE__ */ e(
         "td",
         {
           colSpan: i.length,
           className: "pcoi-data-table__empty",
-          children: l
+          children: o
         }
-      ) }) : a.map((d, h) => /* @__PURE__ */ e(
+      ) }) : l.map((t, h) => /* @__PURE__ */ e(
         "tr",
         {
           className: "pcoi-data-table__row",
           children: i.map((m) => {
-            const u = d[m.key];
+            const N = t[m.key];
             return /* @__PURE__ */ e(
               "td",
               {
                 className: `pcoi-data-table__td${m.align ? ` pcoi-data-table__td--${m.align}` : ""}`,
-                children: m.render ? m.render(u, d) : String(u ?? "")
+                children: m.render ? m.render(N, t) : String(N ?? "")
               },
               m.key
             );
           })
         },
-        p(d, h)
+        p(t, h)
       )) })
     ] }) });
   }
 );
 oe.displayName = "DataTable";
-const C = _.forwardRef(
-  ({ children: i, variant: a = "default", className: c = "", ...l }, o) => {
+const R = _.forwardRef(
+  ({ children: i, variant: l = "default", className: a = "", ...o }, c) => {
     const s = [
       "pcoi-badge",
-      `pcoi-badge--${a}`,
-      c
+      `pcoi-badge--${l}`,
+      a
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ e("span", { ref: o, className: s, ...l, children: i });
-  }
-);
-C.displayName = "Badge";
-const B = ({
-  size: i = 24,
-  title: a,
-  ...c
-}) => /* @__PURE__ */ n(
-  "svg",
-  {
-    width: i,
-    height: i,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: 1.5,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    role: a ? "img" : "presentation",
-    "aria-hidden": !a,
-    xmlns: "http://www.w3.org/2000/svg",
-    ...c,
-    children: [
-      a && /* @__PURE__ */ e("title", { children: a }),
-      /* @__PURE__ */ e("line", { x1: "18", y1: "6", x2: "6", y2: "18" }),
-      /* @__PURE__ */ e("line", { x1: "6", y1: "6", x2: "18", y2: "18" })
-    ]
+    return /* @__PURE__ */ e("span", { ref: c, className: s, ...o, children: i });
   }
 );
-B.displayName = "CloseIcon";
-const D = ({
-  open: i,
-  onClose: a,
-  title: c,
-  headingLevel: l = "h2",
-  size: o = "default",
-  children: s,
-  footer: r,
-  className: t = "",
-  ...p
-}) => {
-  const d = w(null), h = w(null), m = l, u = c ? "pcoi-modal-title" : void 0, f = R(
-    (b) => {
-      if (b.key === "Escape") {
-        a();
-        return;
-      }
-      if (b.key === "Tab" && d.current) {
-        const v = d.current.querySelectorAll(
-          'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
-        );
-        if (v.length === 0) return;
-        const S = v[0], j = v[v.length - 1];
-        b.shiftKey && document.activeElement === S ? (b.preventDefault(), j.focus()) : !b.shiftKey && document.activeElement === j && (b.preventDefault(), S.focus());
-      }
-    },
-    [a]
-  );
-  y(() => (i && (h.current = document.activeElement, document.addEventListener("keydown", f), document.body.style.overflow = "hidden", requestAnimationFrame(() => {
-    var v;
-    const b = (v = d.current) == null ? void 0 : v.querySelector(
-      'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+R.displayName = "Badge";
+const T = _.forwardRef(
+  ({
+    open: i,
+    onClose: l,
+    title: a,
+    headingLevel: o = "h2",
+    size: c = "default",
+    children: s,
+    footer: r,
+    className: d = "",
+    ...p
+  }, t) => {
+    const h = w(null), m = w(null), N = o, f = a ? "pcoi-modal-title" : void 0, u = $(
+      (b) => {
+        if (b.key === "Escape") {
+          l();
+          return;
+        }
+        if (b.key === "Tab" && h.current) {
+          const v = h.current.querySelectorAll(
+            'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+          );
+          if (v.length === 0) return;
+          const B = v[0], S = v[v.length - 1];
+          b.shiftKey && document.activeElement === B ? (b.preventDefault(), S.focus()) : !b.shiftKey && document.activeElement === S && (b.preventDefault(), B.focus());
+        }
+      },
+      [l]
     );
-    b == null || b.focus();
-  })), () => {
-    var b;
-    document.removeEventListener("keydown", f), document.body.style.overflow = "", (b = h.current) == null || b.focus();
-  }), [i, f]);
-  const N = (b) => {
-    b.target === b.currentTarget && a();
-  };
-  if (!i) return null;
-  const x = ["pcoi-modal", t].filter(Boolean).join(" ");
-  return F(
-    /* @__PURE__ */ e("div", { className: x, onClick: N, children: /* @__PURE__ */ n(
-      "div",
-      {
-        ref: d,
-        className: `pcoi-modal__dialog${o === "wide" ? " pcoi-modal__dialog--wide" : ""}`,
-        role: "dialog",
-        "aria-modal": "true",
-        "aria-labelledby": u,
-        ...p,
-        children: [
-          /* @__PURE__ */ n("div", { className: "pcoi-modal__header", children: [
-            c && /* @__PURE__ */ e(m, { id: u, className: "pcoi-modal__title", children: c }),
-            /* @__PURE__ */ e(
-              "button",
-              {
-                type: "button",
-                className: "pcoi-modal__close",
-                onClick: a,
-                "aria-label": "Close modal",
-                children: /* @__PURE__ */ e(B, { size: 20 })
-              }
-            )
-          ] }),
-          /* @__PURE__ */ e("div", { className: "pcoi-modal__body", children: s }),
-          r && /* @__PURE__ */ e("div", { className: "pcoi-modal__footer", children: r })
-        ]
-      }
-    ) }),
-    document.body
-  );
-};
-D.displayName = "Modal";
-const le = ({
-  message: i,
-  variant: a = "info",
-  open: c,
-  onClose: l,
-  duration: o = 5e3,
-  className: s = "",
-  ...r
-}) => {
-  const t = R(() => {
-    l == null || l();
-  }, [l]);
-  if (y(() => {
-    if (!c || o === 0) return;
-    const d = setTimeout(t, o);
-    return () => clearTimeout(d);
-  }, [c, o, t]), !c) return null;
-  const p = [
-    "pcoi-toast",
-    `pcoi-toast--${a}`,
-    s
-  ].filter(Boolean).join(" ");
-  return F(
-    /* @__PURE__ */ e("div", { className: p, role: "alert", ...r, children: /* @__PURE__ */ n("div", { className: "pcoi-toast__content", children: [
-      /* @__PURE__ */ e("span", { className: "pcoi-toast__message", children: i }),
-      l && /* @__PURE__ */ e(
-        "button",
+    y(() => (i && (m.current = document.activeElement, document.addEventListener("keydown", u), document.body.style.overflow = "hidden", requestAnimationFrame(() => {
+      var v;
+      const b = (v = h.current) == null ? void 0 : v.querySelector(
+        'button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])'
+      );
+      b == null || b.focus();
+    })), () => {
+      var b;
+      document.removeEventListener("keydown", u), document.body.style.overflow = "", (b = m.current) == null || b.focus();
+    }), [i, u]);
+    const C = (b) => {
+      b.target === b.currentTarget && l();
+    };
+    if (!i) return null;
+    const L = ["pcoi-modal", d].filter(Boolean).join(" ");
+    return F(
+      /* @__PURE__ */ e("div", { className: L, onClick: C, children: /* @__PURE__ */ n(
+        "div",
         {
-          type: "button",
-          className: "pcoi-toast__close",
-          onClick: t,
-          "aria-label": "Dismiss notification",
-          children: /* @__PURE__ */ e(B, { size: 16 })
+          ref: h,
+          className: `pcoi-modal__dialog${c === "wide" ? " pcoi-modal__dialog--wide" : ""}`,
+          role: "dialog",
+          "aria-modal": "true",
+          "aria-labelledby": f,
+          ...p,
+          children: [
+            /* @__PURE__ */ n("div", { className: "pcoi-modal__header", children: [
+              a && /* @__PURE__ */ e(N, { id: f, className: "pcoi-modal__title", children: a }),
+              /* @__PURE__ */ e(
+                "button",
+                {
+                  type: "button",
+                  className: "pcoi-modal__close",
+                  onClick: l,
+                  "aria-label": "Close modal",
+                  children: /* @__PURE__ */ e(E, { size: 20 })
+                }
+              )
+            ] }),
+            /* @__PURE__ */ e("div", { className: "pcoi-modal__body", children: s }),
+            r && /* @__PURE__ */ e("div", { className: "pcoi-modal__footer", children: r })
+          ]
         }
-      )
-    ] }) }),
-    document.body
+      ) }),
+      document.body
+    );
+  }
+);
+T.displayName = "Modal";
+const re = _.forwardRef(
+  ({
+    message: i,
+    variant: l = "info",
+    open: a,
+    onClose: o,
+    duration: c = 5e3,
+    className: s = "",
+    ...r
+  }, d) => {
+    const p = $(() => {
+      o == null || o();
+    }, [o]);
+    if (y(() => {
+      if (!a || c === 0) return;
+      const h = setTimeout(p, c);
+      return () => clearTimeout(h);
+    }, [a, c, p]), !a) return null;
+    const t = [
+      "pcoi-toast",
+      `pcoi-toast--${l}`,
+      s
+    ].filter(Boolean).join(" ");
+    return F(
+      /* @__PURE__ */ e("div", { ref: d, className: t, role: "alert", ...r, children: /* @__PURE__ */ n("div", { className: "pcoi-toast__content", children: [
+        /* @__PURE__ */ e("span", { className: "pcoi-toast__message", children: i }),
+        o && /* @__PURE__ */ e(
+          "button",
+          {
+            type: "button",
+            className: "pcoi-toast__close",
+            onClick: p,
+            "aria-label": "Dismiss notification",
+            children: /* @__PURE__ */ e(E, { size: 16 })
+          }
+        )
+      ] }) }),
+      document.body
+    );
+  }
+);
+re.displayName = "Toast";
+const se = _.forwardRef(({ index: i, sourceLabel: l, className: a = "", ...o }, c) => {
+  const s = ["pcoi-citation-mark", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e(
+    "button",
+    {
+      ref: c,
+      type: "button",
+      className: s,
+      title: l ?? `Citation ${i}`,
+      "aria-label": l ?? `Citation ${i}`,
+      ...o,
+      children: i
+    }
   );
-};
-le.displayName = "Toast";
-const O = _.forwardRef(({ label: i, icon: a, className: c = "", ...l }, o) => {
-  const s = ["pcoi-suggestion-card", c].filter(Boolean).join(" ");
-  return /* @__PURE__ */ n("button", { ref: o, type: "button", className: s, ...l, children: [
-    a && /* @__PURE__ */ e("span", { className: "pcoi-suggestion-card__icon", children: a }),
+});
+se.displayName = "CitationMark";
+const O = _.forwardRef(({ label: i, icon: l, className: a = "", ...o }, c) => {
+  const s = ["pcoi-suggestion-card", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ n("button", { ref: c, type: "button", className: s, ...o, children: [
+    l && /* @__PURE__ */ e("span", { className: "pcoi-suggestion-card__icon", children: l }),
     /* @__PURE__ */ e("span", { className: "pcoi-suggestion-card__label", children: i })
   ] });
 });
 O.displayName = "SuggestionCard";
-const P = _.forwardRef(
-  ({ index: i, excerpt: a, sourceTitle: c, onSourceClick: l, className: o = "", ...s }, r) => {
-    const t = ["pcoi-cited-excerpt", o].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { ref: r, className: t, ...s, children: [
+const D = _.forwardRef(
+  ({ index: i, excerpt: l, sourceTitle: a, onSourceClick: o, className: c = "", ...s }, r) => {
+    const d = ["pcoi-cited-excerpt", c].filter(Boolean).join(" ");
+    return /* @__PURE__ */ n("div", { ref: r, className: d, ...s, children: [
       /* @__PURE__ */ e(
         "button",
         {
           type: "button",
           className: "pcoi-cited-excerpt__source",
-          onClick: l,
-          children: c
+          onClick: o,
+          "aria-label": `View source: ${a}`,
+          children: a
         }
       ),
       /* @__PURE__ */ n("div", { className: "pcoi-cited-excerpt__body", children: [
@@ -768,7 +737,8 @@ const P = _.forwardRef(
           {
             type: "button",
             className: "pcoi-cited-excerpt__index",
-            onClick: l,
+            onClick: o,
+            "aria-label": `Citation ${i}, view source: ${a}`,
             children: [
               "[",
               i,
@@ -776,71 +746,44 @@ const P = _.forwardRef(
             ]
           }
         ),
-        /* @__PURE__ */ e("p", { className: "pcoi-cited-excerpt__text", children: a })
+        /* @__PURE__ */ e("p", { className: "pcoi-cited-excerpt__text", children: l })
       ] })
     ] });
   }
 );
-P.displayName = "CitedExcerpt";
-const L = ({
-  size: i = 24,
-  title: a,
-  ...c
-}) => /* @__PURE__ */ n(
-  "svg",
-  {
-    width: i,
-    height: i,
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: "currentColor",
-    strokeWidth: 1.5,
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    role: a ? "img" : "presentation",
-    "aria-hidden": !a,
-    xmlns: "http://www.w3.org/2000/svg",
-    ...c,
-    children: [
-      a && /* @__PURE__ */ e("title", { children: a }),
-      /* @__PURE__ */ e("line", { x1: "5", y1: "12", x2: "19", y2: "12" }),
-      /* @__PURE__ */ e("polyline", { points: "12 5 19 12 12 19" })
-    ]
-  }
-);
-L.displayName = "ArrowRightIcon";
-const H = _.forwardRef(
+D.displayName = "CitedExcerpt";
+const P = _.forwardRef(
   ({
     value: i,
-    onChange: a,
-    onSubmit: c,
-    placeholder: l = "Ask a question…",
-    disabled: o = !1,
+    onChange: l,
+    onSubmit: a,
+    placeholder: o = "Ask a question…",
+    disabled: c = !1,
     loading: s = !1,
     className: r = "",
-    ...t
+    ...d
   }, p) => {
-    const d = w(null), h = R(
+    const t = w(null), h = $(
       (f) => {
-        f.key === "Enter" && !f.shiftKey && (f.preventDefault(), i.trim() && !o && !s && c(i.trim()));
+        f.key === "Enter" && !f.shiftKey && (f.preventDefault(), i.trim() && !c && !s && a(i.trim()));
       },
-      [i, o, s, c]
-    ), m = R(() => {
-      i.trim() && !o && !s && c(i.trim());
-    }, [i, o, s, c]), u = ["pcoi-prompt-bar", r].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { ref: p, className: u, ...t, children: [
+      [i, c, s, a]
+    ), m = $(() => {
+      i.trim() && !c && !s && a(i.trim());
+    }, [i, c, s, a]), N = ["pcoi-prompt-bar", r].filter(Boolean).join(" ");
+    return /* @__PURE__ */ n("div", { ref: p, className: N, ...d, children: [
       /* @__PURE__ */ e(
         "textarea",
         {
-          ref: d,
+          ref: t,
           className: "pcoi-prompt-bar__input",
           value: i,
-          onChange: (f) => a(f.target.value),
+          onChange: (f) => l(f.target.value),
           onKeyDown: h,
-          placeholder: l,
-          disabled: o,
+          placeholder: o,
+          disabled: c,
           rows: 1,
-          "aria-label": l
+          "aria-label": o
         }
       ),
       /* @__PURE__ */ e("div", { className: "pcoi-prompt-bar__actions", children: /* @__PURE__ */ e(
@@ -849,163 +792,165 @@ const H = _.forwardRef(
           variant: "primary",
           className: "pcoi-prompt-bar__send",
           onClick: m,
-          disabled: o || s || !i.trim(),
+          disabled: c || s || !i.trim(),
           "aria-label": "Send message",
-          children: /* @__PURE__ */ e("span", { className: "pcoi-prompt-bar__send-icon", children: /* @__PURE__ */ e(L, { size: 16 }) })
+          children: /* @__PURE__ */ e("span", { className: "pcoi-prompt-bar__send-icon", children: /* @__PURE__ */ e(Y, { size: 16 }) })
         }
       ) })
     ] });
   }
 );
-H.displayName = "PromptBar";
+P.displayName = "PromptBar";
 const M = _.forwardRef(
-  ({ role: i, children: a, citations: c, timestamp: l, onCitationClick: o, className: s = "", ...r }, t) => {
+  ({ role: i, children: l, citations: a, timestamp: o, onCitationClick: c, className: s = "", ...r }, d) => {
     const p = [
       "pcoi-chat-message",
       `pcoi-chat-message--${i}`,
       s
     ].filter(Boolean).join(" ");
-    return /* @__PURE__ */ n("div", { ref: t, className: p, ...r, children: [
-      /* @__PURE__ */ e("div", { className: "pcoi-chat-message__header", children: /* @__PURE__ */ e(C, { variant: i === "assistant" ? "default" : "info", children: i === "assistant" ? "PCOI" : "You" }) }),
-      /* @__PURE__ */ e("div", { className: "pcoi-chat-message__body", children: a }),
-      c && c.length > 0 && /* @__PURE__ */ e("div", { className: "pcoi-chat-message__citations", children: c.map((d) => /* @__PURE__ */ e(
-        P,
+    return /* @__PURE__ */ n("div", { ref: d, className: p, ...r, children: [
+      /* @__PURE__ */ e("div", { className: "pcoi-chat-message__header", children: /* @__PURE__ */ e(R, { variant: i === "assistant" ? "default" : "info", children: i === "assistant" ? "PCOI" : "You" }) }),
+      /* @__PURE__ */ e("div", { className: "pcoi-chat-message__body", children: l }),
+      a && a.length > 0 && /* @__PURE__ */ e("div", { className: "pcoi-chat-message__citations", children: a.map((t) => /* @__PURE__ */ e(
+        D,
         {
-          index: d.index,
-          excerpt: d.excerpt,
-          sourceTitle: d.sourceTitle,
-          onSourceClick: () => o == null ? void 0 : o(d)
+          index: t.index,
+          excerpt: t.excerpt,
+          sourceTitle: t.sourceTitle,
+          onSourceClick: () => c == null ? void 0 : c(t)
         },
-        d.index
+        t.index
       )) }),
-      l && /* @__PURE__ */ e("time", { className: "pcoi-chat-message__timestamp", children: l })
+      o && /* @__PURE__ */ e("time", { className: "pcoi-chat-message__timestamp", children: o })
     ] });
   }
 );
 M.displayName = "ChatMessage";
-const q = _.forwardRef(({ suggestions: i, onSelect: a, className: c = "", ...l }, o) => {
-  const s = ["pcoi-suggestion-cards", c].filter(Boolean).join(" ");
-  return /* @__PURE__ */ e("div", { ref: o, className: s, ...l, children: i.map((r) => /* @__PURE__ */ e(
+const H = _.forwardRef(({ suggestions: i, onSelect: l, className: a = "", ...o }, c) => {
+  const s = ["pcoi-suggestion-cards", a].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { ref: c, className: s, ...o, children: i.map((r) => /* @__PURE__ */ e(
     O,
     {
       label: r.label,
       icon: r.icon,
-      onClick: () => a(r)
+      onClick: () => l(r)
     },
     r.id
   )) });
 });
-q.displayName = "SuggestionCards";
-const A = _.forwardRef(({ children: i, className: a = "", ...c }, l) => {
-  const o = w(null);
+H.displayName = "SuggestionCards";
+const q = _.forwardRef(({ children: i, className: l = "", ...a }, o) => {
+  const c = w(null);
   y(() => {
-    const r = o.current;
+    const r = c.current;
     if (!r) return;
-    const t = () => {
+    const d = () => {
       requestAnimationFrame(() => {
-        r.scrollTop = r.scrollHeight;
+        const t = r.lastElementChild;
+        t ? t.scrollIntoView({ block: "nearest" }) : r.scrollTop = r.scrollHeight;
       });
-    }, p = new MutationObserver(t);
-    return p.observe(r, { childList: !0, subtree: !0 }), t(), () => p.disconnect();
+    }, p = new MutationObserver(d);
+    return p.observe(r, { childList: !0, subtree: !0 }), d(), () => p.disconnect();
   }, []);
-  const s = ["pcoi-chat-message-list", a].filter(Boolean).join(" ");
-  return /* @__PURE__ */ e("div", { ref: l, className: s, ...c, children: /* @__PURE__ */ e("div", { ref: o, className: "pcoi-chat-message-list__inner", children: i }) });
+  const s = ["pcoi-chat-message-list", l].filter(Boolean).join(" ");
+  return /* @__PURE__ */ e("div", { ref: o, className: s, role: "log", "aria-label": "Conversation", ...a, children: /* @__PURE__ */ e("div", { ref: c, className: "pcoi-chat-message-list__inner", children: i }) });
 });
-A.displayName = "ChatMessageList";
-const re = _.forwardRef(
-  ({ open: i, onClose: a, title: c, sourceLabel: l, children: o, highlightId: s, highlightIndex: r, className: t = "", ...p }, d) => {
+q.displayName = "ChatMessageList";
+const te = _.forwardRef(
+  ({ open: i, onClose: l, title: a, sourceLabel: o, children: c, highlightId: s, highlightIndex: r, className: d = "", ...p }, t) => {
     const h = w(null);
     y(() => {
       i && s && h.current && requestAnimationFrame(() => {
-        var N;
-        const f = (N = h.current) == null ? void 0 : N.querySelector(`#${CSS.escape(s)}`);
+        var u;
+        const f = (u = h.current) == null ? void 0 : u.querySelector(`#${CSS.escape(s)}`);
         f && (f.scrollIntoView({ behavior: "smooth", block: "center" }), f.classList.add("pcoi-doc-overlay__highlight"), r !== void 0 && f.setAttribute("data-highlight-index", `[${r}]`));
       });
     }, [i, s, r]);
-    const m = ["pcoi-doc-overlay", t].filter(Boolean).join(" "), u = l ? _.createElement(
+    const m = ["pcoi-doc-overlay", d].filter(Boolean).join(" "), N = o ? _.createElement(
       "div",
       { className: "pcoi-doc-overlay__source" },
-      _.createElement(C, null, l)
+      _.createElement(R, null, o)
     ) : void 0;
     return _.createElement(
-      D,
+      T,
       {
+        ref: t,
         open: i,
-        onClose: a,
-        title: c,
+        onClose: l,
+        title: a,
         size: "wide",
-        footer: u,
+        footer: N,
         className: m,
         ...p
       },
       _.createElement(
         "div",
         { ref: h, className: "pcoi-doc-overlay__content" },
-        o
+        c
       )
     );
   }
 );
-re.displayName = "DocumentOverlay";
-const W = _.forwardRef(({ label: i = "PCOI", className: a = "", ...c }, l) => {
-  const o = ["pcoi-typing-indicator", a].filter(Boolean).join(" ");
-  return /* @__PURE__ */ n("div", { ref: l, className: o, ...c, children: [
-    /* @__PURE__ */ e("div", { className: "pcoi-typing-indicator__header", children: /* @__PURE__ */ e(C, { children: i }) }),
-    /* @__PURE__ */ n("div", { className: "pcoi-typing-indicator__dots", "aria-label": "Typing", children: [
+te.displayName = "DocumentOverlay";
+const A = _.forwardRef(({ label: i = "PCOI", className: l = "", ...a }, o) => {
+  const c = ["pcoi-typing-indicator", l].filter(Boolean).join(" ");
+  return /* @__PURE__ */ n("div", { ref: o, className: c, role: "status", "aria-live": "polite", "aria-label": `${i} is typing`, ...a, children: [
+    /* @__PURE__ */ e("div", { className: "pcoi-typing-indicator__header", children: /* @__PURE__ */ e(R, { children: i }) }),
+    /* @__PURE__ */ n("div", { className: "pcoi-typing-indicator__dots", "aria-hidden": "true", children: [
       /* @__PURE__ */ e("span", { className: "pcoi-typing-indicator__dot" }),
       /* @__PURE__ */ e("span", { className: "pcoi-typing-indicator__dot" }),
       /* @__PURE__ */ e("span", { className: "pcoi-typing-indicator__dot" })
     ] })
   ] });
 });
-W.displayName = "TypingIndicator";
-const se = _.forwardRef(
+A.displayName = "TypingIndicator";
+const ne = _.forwardRef(
   ({
     messages: i,
-    suggestions: a,
-    promptValue: c,
-    onPromptChange: l,
-    onPromptSubmit: o,
+    suggestions: l,
+    promptValue: a,
+    onPromptChange: o,
+    onPromptSubmit: c,
     onSuggestionSelect: s,
     onCitationClick: r,
-    placeholder: t,
+    placeholder: d,
     loading: p = !1,
-    className: d = "",
+    className: t = "",
     ...h
   }, m) => {
-    const u = i.length === 0, f = [
+    const N = i.length === 0, f = [
       "pcoi-chat",
-      u ? "pcoi-chat--empty" : "",
-      d
+      N ? "pcoi-chat--empty" : "",
+      t
     ].filter(Boolean).join(" ");
     return /* @__PURE__ */ n("div", { ref: m, className: f, ...h, children: [
-      u ? /* @__PURE__ */ e("div", { className: "pcoi-chat__empty-state", children: a && a.length > 0 && s && /* @__PURE__ */ e("div", { className: "pcoi-chat__suggestions", children: /* @__PURE__ */ e(
-        q,
+      N ? /* @__PURE__ */ e("div", { className: "pcoi-chat__empty-state", children: l && l.length > 0 && s && /* @__PURE__ */ e("div", { className: "pcoi-chat__suggestions", children: /* @__PURE__ */ e(
+        H,
         {
-          suggestions: a,
+          suggestions: l,
           onSelect: s
         }
-      ) }) }) : /* @__PURE__ */ n(A, { className: "pcoi-chat__messages", children: [
-        i.map((N) => /* @__PURE__ */ e(
+      ) }) }) : /* @__PURE__ */ n(q, { className: "pcoi-chat__messages", "aria-live": "polite", "aria-relevant": "additions", children: [
+        i.map((u) => /* @__PURE__ */ e(
           M,
           {
-            role: N.role,
-            citations: N.citations,
-            timestamp: N.timestamp,
+            role: u.role,
+            citations: u.citations,
+            timestamp: u.timestamp,
             onCitationClick: r,
-            children: N.content
+            children: u.content
           },
-          N.id
+          u.id
         )),
-        p && /* @__PURE__ */ e(W, {})
+        p && /* @__PURE__ */ e(A, {})
       ] }),
       /* @__PURE__ */ e("div", { className: "pcoi-chat__prompt", children: /* @__PURE__ */ e(
-        H,
+        P,
         {
-          value: c,
-          onChange: l,
-          onSubmit: o,
-          placeholder: t,
+          value: a,
+          onChange: o,
+          onSubmit: c,
+          placeholder: d,
           loading: p,
           disabled: p
         }
@@ -1013,36 +958,37 @@ const se = _.forwardRef(
     ] });
   }
 );
-se.displayName = "ChatInterface";
+ne.displayName = "ChatInterface";
 export {
-  C as Badge,
+  R as Badge,
   k as Button,
-  Q as Callout,
-  Y as Card,
-  se as ChatInterface,
+  X as Callout,
+  V as Card,
+  ne as ChatInterface,
   M as ChatMessage,
-  A as ChatMessageList,
-  ee as Checkbox,
-  P as CitedExcerpt,
-  G as ComparisonTable,
-  J as ContactForm,
+  q as ChatMessageList,
+  ae as Checkbox,
+  se as CitationMark,
+  D as CitedExcerpt,
+  J as ComparisonTable,
+  Q as ContactForm,
   oe as DataTable,
-  re as DocumentOverlay,
-  Z as Footer,
+  te as DocumentOverlay,
+  U as Footer,
   g as FormField,
-  V as HowStep,
+  G as HowStep,
   I as LogoMark,
-  D as Modal,
-  K as Nav,
-  ce as Panel,
-  H as PromptBar,
-  ie as RadioGroup,
-  z as SectionHeader,
-  U as Select,
-  X as SignalsPanel,
+  T as Modal,
+  W as Nav,
+  le as Panel,
+  P as PromptBar,
+  ce as RadioGroup,
+  K as SectionHeader,
+  ee as Select,
+  Z as SignalsPanel,
   O as SuggestionCard,
-  q as SuggestionCards,
-  le as Toast,
-  ae as Toggle,
-  W as TypingIndicator
+  H as SuggestionCards,
+  re as Toast,
+  ie as Toggle,
+  A as TypingIndicator
 };