@mieweb/ui 0.7.3-dev.19 → 0.7.3-dev.20

package/dist/chunk-XMECP2MD.js

@@ -0,0 +1,208 @@
+import { useEscapeKey } from './chunk-T4ME7QCT.js';
+import { useAnchoredPosition } from './chunk-BOOJDRJO.js';
+import { cn } from './chunk-TQONQSJO.js';
+import * as React from 'react';
+import { createPortal } from 'react-dom';
+import { jsxs, jsx } from 'react/jsx-runtime';
+
+var HIDE_GRACE_MS = 180;
+function SourceTip({
+  heading,
+  note,
+  sources,
+  eyebrow = "Source",
+  children,
+  className,
+  underline = false
+}) {
+  const [open, setOpen] = React.useState(false);
+  const [pinned, setPinned] = React.useState(false);
+  const timer = React.useRef(null);
+  const suppressFocusShow = React.useRef(false);
+  const { anchorRef, floatingRef, style } = useAnchoredPosition({
+    open,
+    placement: "top",
+    offset: 10,
+    viewportPadding: 8,
+    allowFlip: true
+  });
+  const clearHideTimer = () => {
+    if (timer.current) {
+      clearTimeout(timer.current);
+      timer.current = null;
+    }
+  };
+  const show = React.useCallback(() => {
+    clearHideTimer();
+    setOpen(true);
+  }, []);
+  const scheduleHide = React.useCallback(() => {
+    if (pinned) return;
+    clearHideTimer();
+    timer.current = setTimeout(() => setOpen(false), HIDE_GRACE_MS);
+  }, [pinned]);
+  const close = React.useCallback(() => {
+    clearHideTimer();
+    setPinned(false);
+    setOpen(false);
+    if (floatingRef.current?.contains(document.activeElement)) {
+      suppressFocusShow.current = true;
+      anchorRef.current?.focus();
+    }
+  }, [anchorRef, floatingRef]);
+  React.useEffect(() => () => clearHideTimer(), []);
+  React.useEffect(() => {
+    if (pinned) floatingRef.current?.focus();
+  }, [pinned, floatingRef]);
+  useEscapeKey(close, open);
+  React.useEffect(() => {
+    if (!open || !pinned) return;
+    const onPointer = (e) => {
+      const t = e.target;
+      if (anchorRef.current?.contains(t) || floatingRef.current?.contains(t))
+        return;
+      close();
+    };
+    document.addEventListener("mousedown", onPointer);
+    document.addEventListener("touchstart", onPointer);
+    return () => {
+      document.removeEventListener("mousedown", onPointer);
+      document.removeEventListener("touchstart", onPointer);
+    };
+  }, [open, pinned, close, anchorRef, floatingRef]);
+  const onTriggerClick = () => {
+    const coarse = typeof window !== "undefined" && window.matchMedia("(hover: none)").matches;
+    if (!coarse) return;
+    togglePin();
+  };
+  const togglePin = () => {
+    if (pinned) close();
+    else {
+      setPinned(true);
+      show();
+    }
+  };
+  const onTriggerKeyDown = (e) => {
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      togglePin();
+    }
+  };
+  const onDialogKeyDown = (e) => {
+    if (e.target !== e.currentTarget) return;
+    if (e.key === "Enter" || e.key === " ") {
+      e.preventDefault();
+      close();
+    }
+  };
+  const onTriggerFocus = () => {
+    if (suppressFocusShow.current) {
+      suppressFocusShow.current = false;
+      return;
+    }
+    show();
+  };
+  const onBlurCapture = (e) => {
+    const next = e.relatedTarget;
+    if (next && (anchorRef.current?.contains(next) || floatingRef.current?.contains(next)))
+      return;
+    scheduleHide();
+  };
+  const hasSources = Boolean(sources && sources.length > 0);
+  return /* @__PURE__ */ jsxs(
+    "span",
+    {
+      ref: anchorRef,
+      className: cn(
+        "cursor-help",
+        underline && "decoration-primary-400/70 underline decoration-dashed underline-offset-4",
+        className
+      ),
+      onMouseEnter: show,
+      onMouseLeave: scheduleHide,
+      onFocus: onTriggerFocus,
+      onBlur: onBlurCapture,
+      onClick: onTriggerClick,
+      onKeyDown: onTriggerKeyDown,
+      tabIndex: 0,
+      role: "button",
+      "aria-haspopup": "dialog",
+      "aria-expanded": open,
+      "aria-label": `${heading} \u2014 show source`,
+      children: [
+        children,
+        open && createPortal(
+          /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- keyboard dismissal on a focused non-modal dialog container is the WAI-ARIA pattern; links inside keep their own semantics */
+          /* @__PURE__ */ jsx(
+            "span",
+            {
+              ref: floatingRef,
+              role: "dialog",
+              "aria-label": heading,
+              tabIndex: -1,
+              onMouseEnter: show,
+              onMouseLeave: scheduleHide,
+              onBlurCapture,
+              onKeyDown: onDialogKeyDown,
+              className: "focus-visible:ring-ring z-50 block w-80 rounded-lg outline-none focus-visible:ring-2",
+              style,
+              children: /* @__PURE__ */ jsxs("span", { className: "border-border bg-card block overflow-hidden rounded-lg border text-start font-normal tracking-normal normal-case shadow-xl ring-1 ring-black/5 dark:ring-white/10", children: [
+                /* @__PURE__ */ jsxs("span", { className: "from-primary-700 to-primary-600 block bg-gradient-to-br px-3.5 py-2.5", children: [
+                  /* @__PURE__ */ jsx("span", { className: "text-primary-100/90 block text-[10px] font-bold tracking-wide uppercase", children: eyebrow }),
+                  /* @__PURE__ */ jsx("span", { className: "mt-0.5 block text-sm leading-snug font-semibold text-white", children: heading })
+                ] }),
+                (note || hasSources) && /* @__PURE__ */ jsxs("span", { className: "block px-3.5 py-2.5", children: [
+                  note && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground block text-[13px] leading-relaxed", children: note }),
+                  hasSources && /* @__PURE__ */ jsxs(
+                    "span",
+                    {
+                      className: cn(
+                        "block",
+                        note && "border-border mt-2.5 border-t border-dashed pt-2.5"
+                      ),
+                      children: [
+                        /* @__PURE__ */ jsx("span", { className: "text-muted-foreground block text-[10px] font-bold tracking-wide uppercase", children: sources.length === 1 ? "Source" : `${sources.length} sources` }),
+                        /* @__PURE__ */ jsx("span", { className: "block max-h-52 overflow-y-auto", children: sources.map((s, i) => /* @__PURE__ */ jsxs(
+                          "span",
+                          {
+                            className: "mt-1.5 flex items-center gap-2",
+                            children: [
+                              /* @__PURE__ */ jsx(
+                                "span",
+                                {
+                                  "aria-hidden": "true",
+                                  className: "bg-primary-400 h-1.5 w-1.5 shrink-0 rounded-full"
+                                }
+                              ),
+                              s.url ? /* @__PURE__ */ jsx(
+                                "a",
+                                {
+                                  href: s.url,
+                                  target: "_blank",
+                                  rel: "noopener noreferrer",
+                                  className: "text-primary-600 hover:text-primary-500 dark:text-primary-400 dark:hover:text-primary-300 min-w-0 flex-1 truncate text-xs font-semibold",
+                                  children: s.label
+                                }
+                              ) : /* @__PURE__ */ jsx("span", { className: "text-muted-foreground min-w-0 flex-1 truncate text-xs", children: s.label }),
+                              s.sub && /* @__PURE__ */ jsx("span", { className: "text-muted-foreground/70 shrink-0 text-[11px]", children: s.sub })
+                            ]
+                          },
+                          `${s.label}-${i}`
+                        )) })
+                      ]
+                    }
+                  )
+                ] })
+              ] })
+            }
+          ),
+          document.body
+        )
+      ]
+    }
+  );
+}
+
+export { SourceTip };
+//# sourceMappingURL=chunk-XMECP2MD.js.map
+//# sourceMappingURL=chunk-XMECP2MD.js.map

package/dist/chunk-XMECP2MD.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../src/components/SourceTip/SourceTip.tsx"],"names":[],"mappings":";;;;;;;AA0CA,IAAM,aAAA,GAAgB,GAAA;AA8Bf,SAAS,SAAA,CAAU;AAAA,EACxB,OAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,OAAA,GAAU,QAAA;AAAA,EACV,QAAA;AAAA,EACA,SAAA;AAAA,EACA,SAAA,GAAY;AACd,CAAA,EAAmB;AACjB,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAU,eAAS,KAAK,CAAA;AAC5C,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAU,eAAS,KAAK,CAAA;AAChD,EAAA,MAAM,KAAA,GAAc,aAA6C,IAAI,CAAA;AAGrE,EAAA,MAAM,iBAAA,GAA0B,aAAO,KAAK,CAAA;AAE5C,EAAA,MAAM,EAAE,SAAA,EAAW,WAAA,EAAa,KAAA,KAAU,mBAAA,CAGxC;AAAA,IACA,IAAA;AAAA,IACA,SAAA,EAAW,KAAA;AAAA,IACX,MAAA,EAAQ,EAAA;AAAA,IACR,eAAA,EAAiB,CAAA;AAAA,IACjB,SAAA,EAAW;AAAA,GACZ,CAAA;AAED,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,IAAI,MAAM,OAAA,EAAS;AACjB,MAAA,YAAA,CAAa,MAAM,OAAO,CAAA;AAC1B,MAAA,KAAA,CAAM,OAAA,GAAU,IAAA;AAAA,IAClB;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,IAAA,GAAa,kBAAY,MAAM;AACnC,IAAA,cAAA,EAAe;AACf,IAAA,OAAA,CAAQ,IAAI,CAAA;AAAA,EACd,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,YAAA,GAAqB,kBAAY,MAAM;AAC3C,IAAA,IAAI,MAAA,EAAQ;AACZ,IAAA,cAAA,EAAe;AACf,IAAA,KAAA,CAAM,UAAU,UAAA,CAAW,MAAM,OAAA,CAAQ,KAAK,GAAG,aAAa,CAAA;AAAA,EAChE,CAAA,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,MAAM,KAAA,GAAc,kBAAY,MAAM;AACpC,IAAA,cAAA,EAAe;AACf,IAAA,SAAA,CAAU,KAAK,CAAA;AACf,IAAA,OAAA,CAAQ,KAAK,CAAA;AAEb,IAAA,IAAI,WAAA,CAAY,OAAA,EAAS,QAAA,CAAS,QAAA,CAAS,aAAa,CAAA,EAAG;AACzD,MAAA,iBAAA,CAAkB,OAAA,GAAU,IAAA;AAC5B,MAAA,SAAA,CAAU,SAAS,KAAA,EAAM;AAAA,IAC3B;AAAA,EACF,CAAA,EAAG,CAAC,SAAA,EAAW,WAAW,CAAC,CAAA;AAE3B,EAAM,gBAAU,MAAM,MAAM,cAAA,EAAe,EAAG,EAAE,CAAA;AAIhD,EAAM,gBAAU,MAAM;AACpB,IAAA,IAAI,MAAA,EAAQ,WAAA,CAAY,OAAA,EAAS,KAAA,EAAM;AAAA,EACzC,CAAA,EAAG,CAAC,MAAA,EAAQ,WAAW,CAAC,CAAA;AAExB,EAAA,YAAA,CAAa,OAAO,IAAI,CAAA;AAGxB,EAAM,gBAAU,MAAM;AACpB,IAAA,IAAI,CAAC,IAAA,IAAQ,CAAC,MAAA,EAAQ;AACtB,IAAA,MAAM,SAAA,GAAY,CAAC,CAAA,KAAa;AAC9B,MAAA,MAAM,IAAI,CAAA,CAAE,MAAA;AACZ,MAAA,IAAI,SAAA,CAAU,SAAS,QAAA,CAAS,CAAC,KAAK,WAAA,CAAY,OAAA,EAAS,SAAS,CAAC,CAAA;AACnE,QAAA;AACF,MAAA,KAAA,EAAM;AAAA,IACR,CAAA;AACA,IAAA,QAAA,CAAS,gBAAA,CAAiB,aAAa,SAAS,CAAA;AAChD,IAAA,QAAA,CAAS,gBAAA,CAAiB,cAAc,SAAS,CAAA;AACjD,IAAA,OAAO,MAAM;AACX,MAAA,QAAA,CAAS,mBAAA,CAAoB,aAAa,SAAS,CAAA;AACnD,MAAA,QAAA,CAAS,mBAAA,CAAoB,cAAc,SAAS,CAAA;AAAA,IACtD,CAAA;AAAA,EACF,GAAG,CAAC,IAAA,EAAM,QAAQ,KAAA,EAAO,SAAA,EAAW,WAAW,CAAC,CAAA;AAGhD,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,MAAM,SACJ,OAAO,MAAA,KAAW,eAClB,MAAA,CAAO,UAAA,CAAW,eAAe,CAAA,CAAE,OAAA;AACrC,IAAA,IAAI,CAAC,MAAA,EAAQ;AACb,IAAA,SAAA,EAAU;AAAA,EACZ,CAAA;AAEA,EAAA,MAAM,YAAY,MAAM;AACtB,IAAA,IAAI,QAAQ,KAAA,EAAM;AAAA,SACb;AACH,MAAA,SAAA,CAAU,IAAI,CAAA;AACd,MAAA,IAAA,EAAK;AAAA,IACP;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,gBAAA,GAAmB,CAAC,CAAA,KAA4C;AACpE,IAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,MAAA,CAAA,CAAE,cAAA,EAAe;AACjB,MAAA,SAAA,EAAU;AAAA,IACZ;AAAA,EACF,CAAA;AAIA,EAAA,MAAM,eAAA,GAAkB,CAAC,CAAA,KAA4C;AACnE,IAAA,IAAI,CAAA,CAAE,MAAA,KAAW,CAAA,CAAE,aAAA,EAAe;AAClC,IAAA,IAAI,CAAA,CAAE,GAAA,KAAQ,OAAA,IAAW,CAAA,CAAE,QAAQ,GAAA,EAAK;AACtC,MAAA,CAAA,CAAE,cAAA,EAAe;AACjB,MAAA,KAAA,EAAM;AAAA,IACR;AAAA,EACF,CAAA;AAEA,EAAA,MAAM,iBAAiB,MAAM;AAC3B,IAAA,IAAI,kBAAkB,OAAA,EAAS;AAC7B,MAAA,iBAAA,CAAkB,OAAA,GAAU,KAAA;AAC5B,MAAA;AAAA,IACF;AACA,IAAA,IAAA,EAAK;AAAA,EACP,CAAA;AAEA,EAAA,MAAM,aAAA,GAAgB,CAAC,CAAA,KAAyC;AAC9D,IAAA,MAAM,OAAO,CAAA,CAAE,aAAA;AACf,IAAA,IACE,IAAA,KACC,UAAU,OAAA,EAAS,QAAA,CAAS,IAAI,CAAA,IAAK,WAAA,CAAY,OAAA,EAAS,QAAA,CAAS,IAAI,CAAA,CAAA;AAExE,MAAA;AACF,IAAA,YAAA,EAAa;AAAA,EACf,CAAA;AAEA,EAAA,MAAM,UAAA,GAAa,OAAA,CAAQ,OAAA,IAAW,OAAA,CAAQ,SAAS,CAAC,CAAA;AAExD,EAAA,uBACE,IAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,GAAA,EAAK,SAAA;AAAA,MACL,SAAA,EAAW,EAAA;AAAA,QACT,aAAA;AAAA,QACA,SAAA,IACE,0EAAA;AAAA,QACF;AAAA,OACF;AAAA,MACA,YAAA,EAAc,IAAA;AAAA,MACd,YAAA,EAAc,YAAA;AAAA,MACd,OAAA,EAAS,cAAA;AAAA,MACT,MAAA,EAAQ,aAAA;AAAA,MACR,OAAA,EAAS,cAAA;AAAA,MACT,SAAA,EAAW,gBAAA;AAAA,MACX,QAAA,EAAU,CAAA;AAAA,MACV,IAAA,EAAK,QAAA;AAAA,MACL,eAAA,EAAc,QAAA;AAAA,MACd,eAAA,EAAe,IAAA;AAAA,MACf,YAAA,EAAY,GAAG,OAAO,CAAA,mBAAA,CAAA;AAAA,MAErB,QAAA,EAAA;AAAA,QAAA,QAAA;AAAA,QACA,IAAA,IACC,YAAA;AAAA;AAAA,0BAEE,GAAA;AAAA,YAAC,MAAA;AAAA,YAAA;AAAA,cACC,GAAA,EAAK,WAAA;AAAA,cACL,IAAA,EAAK,QAAA;AAAA,cACL,YAAA,EAAY,OAAA;AAAA,cACZ,QAAA,EAAU,EAAA;AAAA,cACV,YAAA,EAAc,IAAA;AAAA,cACd,YAAA,EAAc,YAAA;AAAA,cACd,aAAA;AAAA,cACA,SAAA,EAAW,eAAA;AAAA,cACX,SAAA,EAAU,sFAAA;AAAA,cACV,KAAA;AAAA,cAEA,QAAA,kBAAA,IAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,mKAAA,EACd,QAAA,EAAA;AAAA,gCAAA,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,uEAAA,EACd,QAAA,EAAA;AAAA,kCAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yEAAA,EACb,QAAA,EAAA,OAAA,EACH,CAAA;AAAA,kCACA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,4DAAA,EACb,QAAA,EAAA,OAAA,EACH;AAAA,iBAAA,EACF,CAAA;AAAA,gBAAA,CAEE,IAAA,IAAQ,UAAA,qBACR,IAAA,CAAC,MAAA,EAAA,EAAK,WAAU,qBAAA,EACb,QAAA,EAAA;AAAA,kBAAA,IAAA,oBACC,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,yDAAA,EACb,QAAA,EAAA,IAAA,EACH,CAAA;AAAA,kBAED,UAAA,oBACC,IAAA;AAAA,oBAAC,MAAA;AAAA,oBAAA;AAAA,sBACC,SAAA,EAAW,EAAA;AAAA,wBACT,OAAA;AAAA,wBACA,IAAA,IACE;AAAA,uBACJ;AAAA,sBAEA,QAAA,EAAA;AAAA,wCAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,2EAAA,EACb,QAAA,EAAA,OAAA,CAAS,MAAA,KAAW,IACjB,QAAA,GACA,CAAA,EAAG,OAAA,CAAS,MAAM,CAAA,QAAA,CAAA,EACxB,CAAA;AAAA,wCACA,GAAA,CAAC,UAAK,SAAA,EAAU,gCAAA,EACb,kBAAS,GAAA,CAAI,CAAC,GAAG,CAAA,qBAChB,IAAA;AAAA,0BAAC,MAAA;AAAA,0BAAA;AAAA,4BAEC,SAAA,EAAU,gCAAA;AAAA,4BAEV,QAAA,EAAA;AAAA,8CAAA,GAAA;AAAA,gCAAC,MAAA;AAAA,gCAAA;AAAA,kCACC,aAAA,EAAY,MAAA;AAAA,kCACZ,SAAA,EAAU;AAAA;AAAA,+BACZ;AAAA,8BACC,EAAE,GAAA,mBACD,GAAA;AAAA,gCAAC,GAAA;AAAA,gCAAA;AAAA,kCACC,MAAM,CAAA,CAAE,GAAA;AAAA,kCACR,MAAA,EAAO,QAAA;AAAA,kCACP,GAAA,EAAI,qBAAA;AAAA,kCACJ,SAAA,EAAU,yIAAA;AAAA,kCAET,QAAA,EAAA,CAAA,CAAE;AAAA;AAAA,kDAGL,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAU,uDAAA,EACb,YAAE,KAAA,EACL,CAAA;AAAA,8BAED,EAAE,GAAA,oBACD,GAAA,CAAC,UAAK,SAAA,EAAU,+CAAA,EACb,YAAE,GAAA,EACL;AAAA;AAAA,2BAAA;AAAA,0BAxBG,CAAA,EAAG,CAAA,CAAE,KAAK,CAAA,CAAA,EAAI,CAAC,CAAA;AAAA,yBA2BvB,CAAA,EACH;AAAA;AAAA;AAAA;AACF,iBAAA,EAEJ;AAAA,eAAA,EAEJ;AAAA;AAAA,WACF;AAAA,UACA,QAAA,CAAS;AAAA;AACX;AAAA;AAAA,GACJ;AAEJ","file":"chunk-XMECP2MD.js","sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { createPortal } from 'react-dom';\nimport { cn } from '../../utils/cn';\nimport { useAnchoredPosition } from '../../hooks/useAnchoredPosition';\nimport { useEscapeKey } from '../../hooks/useEscapeKey';\n\n// =============================================================================\n// Types\n// =============================================================================\n\n/** One line of provenance shown in the card. */\nexport interface TipSource {\n  /** One-line label — statute name or source title. Truncated on render. */\n  label: string;\n  /** Source URL. Omit for a provenance line that isn't linkable. */\n  url?: string;\n  /** Secondary label shown at the end (publisher / host / year). */\n  sub?: string;\n}\n\nexport interface SourceTipProps {\n  /** The claim this card explains — the card's heading. */\n  heading: string;\n  /** Free-text provenance, for facts no public URL can verify. */\n  note?: string;\n  /** Linked (or unlinked) one-line sources. */\n  sources?: TipSource[];\n  /** Eyebrow above the heading. Defaults to \"Source\". */\n  eyebrow?: string;\n  /** The visible trigger. */\n  children: React.ReactNode;\n  className?: string;\n  /**\n   * Underline the trigger with a dashed rule marking a hoverable claim.\n   * Leave off in table cells, which signal hoverability by their own\n   * treatment rather than by underlining every cell.\n   */\n  underline?: boolean;\n}\n\nconst HIDE_GRACE_MS = 180;\n\n// =============================================================================\n// SourceTip\n// =============================================================================\n\n/**\n * A hover card answering \"what backs this claim?\" — an eyebrow + heading,\n * optional free-text provenance, and a list of one-line source links.\n * Suits stat tiles, table cells, and inline facts where a numbered footnote\n * would be overkill.\n *\n * The trigger and card are phrasing content (`span`/`a` only), so it is\n * valid inside `<p>` prose and table cells. The card portals to `body` with\n * fixed positioning, flipping and clamping to stay in the viewport. On\n * touch, a tap pins the card; Escape or an outside tap closes it. A pinned\n * card behaves as a non-modal dialog — focus moves into it so its source\n * links are keyboard-reachable, and returns to the trigger on close.\n *\n * @example\n * ```tsx\n * <SourceTip\n *   heading=\"OSHA recordable rate\"\n *   sources={[{ label: 'BLS SOII 2023', url: 'https://www.bls.gov/iif/', sub: 'BLS' }]}\n *   underline\n * >\n *   2.4 per 100 FTE\n * </SourceTip>\n * ```\n */\nexport function SourceTip({\n  heading,\n  note,\n  sources,\n  eyebrow = 'Source',\n  children,\n  className,\n  underline = false,\n}: SourceTipProps) {\n  const [open, setOpen] = React.useState(false);\n  const [pinned, setPinned] = React.useState(false);\n  const timer = React.useRef<ReturnType<typeof setTimeout> | null>(null);\n  // True while close() restores focus to the trigger, so the trigger's\n  // focus-show doesn't immediately reopen a card the user just dismissed.\n  const suppressFocusShow = React.useRef(false);\n\n  const { anchorRef, floatingRef, style } = useAnchoredPosition<\n    HTMLSpanElement,\n    HTMLSpanElement\n  >({\n    open,\n    placement: 'top',\n    offset: 10,\n    viewportPadding: 8,\n    allowFlip: true,\n  });\n\n  const clearHideTimer = () => {\n    if (timer.current) {\n      clearTimeout(timer.current);\n      timer.current = null;\n    }\n  };\n\n  const show = React.useCallback(() => {\n    clearHideTimer();\n    setOpen(true);\n  }, []);\n\n  const scheduleHide = React.useCallback(() => {\n    if (pinned) return;\n    clearHideTimer();\n    timer.current = setTimeout(() => setOpen(false), HIDE_GRACE_MS);\n  }, [pinned]);\n\n  const close = React.useCallback(() => {\n    clearHideTimer();\n    setPinned(false);\n    setOpen(false);\n    // Return focus to the trigger if it was inside the card.\n    if (floatingRef.current?.contains(document.activeElement)) {\n      suppressFocusShow.current = true;\n      anchorRef.current?.focus();\n    }\n  }, [anchorRef, floatingRef]);\n\n  React.useEffect(() => () => clearHideTimer(), []);\n\n  // A pinned card is a non-modal dialog: move focus into it so its links\n  // are reachable by keyboard.\n  React.useEffect(() => {\n    if (pinned) floatingRef.current?.focus();\n  }, [pinned, floatingRef]);\n\n  useEscapeKey(close, open);\n\n  // Pinned cards close on an outside tap; hover cards close on their own.\n  React.useEffect(() => {\n    if (!open || !pinned) return;\n    const onPointer = (e: Event) => {\n      const t = e.target as Node;\n      if (anchorRef.current?.contains(t) || floatingRef.current?.contains(t))\n        return;\n      close();\n    };\n    document.addEventListener('mousedown', onPointer);\n    document.addEventListener('touchstart', onPointer);\n    return () => {\n      document.removeEventListener('mousedown', onPointer);\n      document.removeEventListener('touchstart', onPointer);\n    };\n  }, [open, pinned, close, anchorRef, floatingRef]);\n\n  // Touch has no hover: tap pins the card instead of falling through.\n  const onTriggerClick = () => {\n    const coarse =\n      typeof window !== 'undefined' &&\n      window.matchMedia('(hover: none)').matches;\n    if (!coarse) return;\n    togglePin();\n  };\n\n  const togglePin = () => {\n    if (pinned) close();\n    else {\n      setPinned(true);\n      show();\n    }\n  };\n\n  const onTriggerKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      togglePin();\n    }\n  };\n\n  // Focus lives on the dialog container once pinned, so Enter/Space there\n  // (not on a link inside) must also unpin — the trigger no longer has focus.\n  const onDialogKeyDown = (e: React.KeyboardEvent<HTMLSpanElement>) => {\n    if (e.target !== e.currentTarget) return;\n    if (e.key === 'Enter' || e.key === ' ') {\n      e.preventDefault();\n      close();\n    }\n  };\n\n  const onTriggerFocus = () => {\n    if (suppressFocusShow.current) {\n      suppressFocusShow.current = false;\n      return;\n    }\n    show();\n  };\n\n  const onBlurCapture = (e: React.FocusEvent<HTMLSpanElement>) => {\n    const next = e.relatedTarget as Node | null;\n    if (\n      next &&\n      (anchorRef.current?.contains(next) || floatingRef.current?.contains(next))\n    )\n      return;\n    scheduleHide();\n  };\n\n  const hasSources = Boolean(sources && sources.length > 0);\n\n  return (\n    <span\n      ref={anchorRef}\n      className={cn(\n        'cursor-help',\n        underline &&\n          'decoration-primary-400/70 underline decoration-dashed underline-offset-4',\n        className\n      )}\n      onMouseEnter={show}\n      onMouseLeave={scheduleHide}\n      onFocus={onTriggerFocus}\n      onBlur={onBlurCapture}\n      onClick={onTriggerClick}\n      onKeyDown={onTriggerKeyDown}\n      tabIndex={0}\n      role=\"button\"\n      aria-haspopup=\"dialog\"\n      aria-expanded={open}\n      aria-label={`${heading} — show source`}\n    >\n      {children}\n      {open &&\n        createPortal(\n          /* eslint-disable-next-line jsx-a11y/no-noninteractive-element-interactions -- keyboard dismissal on a focused non-modal dialog container is the WAI-ARIA pattern; links inside keep their own semantics */\n          <span\n            ref={floatingRef}\n            role=\"dialog\"\n            aria-label={heading}\n            tabIndex={-1}\n            onMouseEnter={show}\n            onMouseLeave={scheduleHide}\n            onBlurCapture={onBlurCapture}\n            onKeyDown={onDialogKeyDown}\n            className=\"focus-visible:ring-ring z-50 block w-80 rounded-lg outline-none focus-visible:ring-2\"\n            style={style}\n          >\n            <span className=\"border-border bg-card block overflow-hidden rounded-lg border text-start font-normal tracking-normal normal-case shadow-xl ring-1 ring-black/5 dark:ring-white/10\">\n              <span className=\"from-primary-700 to-primary-600 block bg-gradient-to-br px-3.5 py-2.5\">\n                <span className=\"text-primary-100/90 block text-[10px] font-bold tracking-wide uppercase\">\n                  {eyebrow}\n                </span>\n                <span className=\"mt-0.5 block text-sm leading-snug font-semibold text-white\">\n                  {heading}\n                </span>\n              </span>\n\n              {(note || hasSources) && (\n                <span className=\"block px-3.5 py-2.5\">\n                  {note && (\n                    <span className=\"text-muted-foreground block text-[13px] leading-relaxed\">\n                      {note}\n                    </span>\n                  )}\n                  {hasSources && (\n                    <span\n                      className={cn(\n                        'block',\n                        note &&\n                          'border-border mt-2.5 border-t border-dashed pt-2.5'\n                      )}\n                    >\n                      <span className=\"text-muted-foreground block text-[10px] font-bold tracking-wide uppercase\">\n                        {sources!.length === 1\n                          ? 'Source'\n                          : `${sources!.length} sources`}\n                      </span>\n                      <span className=\"block max-h-52 overflow-y-auto\">\n                        {sources!.map((s, i) => (\n                          <span\n                            key={`${s.label}-${i}`}\n                            className=\"mt-1.5 flex items-center gap-2\"\n                          >\n                            <span\n                              aria-hidden=\"true\"\n                              className=\"bg-primary-400 h-1.5 w-1.5 shrink-0 rounded-full\"\n                            />\n                            {s.url ? (\n                              <a\n                                href={s.url}\n                                target=\"_blank\"\n                                rel=\"noopener noreferrer\"\n                                className=\"text-primary-600 hover:text-primary-500 dark:text-primary-400 dark:hover:text-primary-300 min-w-0 flex-1 truncate text-xs font-semibold\"\n                              >\n                                {s.label}\n                              </a>\n                            ) : (\n                              <span className=\"text-muted-foreground min-w-0 flex-1 truncate text-xs\">\n                                {s.label}\n                              </span>\n                            )}\n                            {s.sub && (\n                              <span className=\"text-muted-foreground/70 shrink-0 text-[11px]\">\n                                {s.sub}\n                              </span>\n                            )}\n                          </span>\n                        ))}\n                      </span>\n                    </span>\n                  )}\n                </span>\n              )}\n            </span>\n          </span>,\n          document.body\n        )}\n    </span>\n  );\n}\n"]}

package/dist/components/Markdown/index.cjs

@@ -1,10 +1,10 @@
 'use strict';
 
-var chunkLJBWCUKP_cjs = require('../../chunk-LJBWCUKP.cjs');
+var chunkLGYGKLJL_cjs = require('../../chunk-LGYGKLJL.cjs');
+var chunk4CUFXCC5_cjs = require('../../chunk-4CUFXCC5.cjs');
 var chunkK4S4FAYX_cjs = require('../../chunk-K4S4FAYX.cjs');
 var chunkFN6VHMLM_cjs = require('../../chunk-FN6VHMLM.cjs');
 var chunkP3JEMF6E_cjs = require('../../chunk-P3JEMF6E.cjs');
-var chunk4CUFXCC5_cjs = require('../../chunk-4CUFXCC5.cjs');
 var chunkYIXTGWT4_cjs = require('../../chunk-YIXTGWT4.cjs');
 require('../../chunk-RDGRKYQ5.cjs');
 require('../../chunk-S5RVSXDV.cjs');
@@ -13,19 +13,23 @@ require('../../chunk-S5RVSXDV.cjs');
 
 Object.defineProperty(exports, "CodeBlock", {
   enumerable: true,
-  get: function () { return chunkLJBWCUKP_cjs.CodeBlock; }
+  get: function () { return chunkLGYGKLJL_cjs.CodeBlock; }
 });
 Object.defineProperty(exports, "MarkdownRenderer", {
   enumerable: true,
-  get: function () { return chunkLJBWCUKP_cjs.MarkdownRenderer; }
+  get: function () { return chunkLGYGKLJL_cjs.MarkdownRenderer; }
 });
 Object.defineProperty(exports, "highlightCode", {
   enumerable: true,
-  get: function () { return chunkLJBWCUKP_cjs.highlightCode; }
+  get: function () { return chunkLGYGKLJL_cjs.highlightCode; }
 });
 Object.defineProperty(exports, "useMarkdown", {
   enumerable: true,
-  get: function () { return chunkLJBWCUKP_cjs.useMarkdown; }
+  get: function () { return chunkLGYGKLJL_cjs.useMarkdown; }
+});
+Object.defineProperty(exports, "SurveyBlock", {
+  enumerable: true,
+  get: function () { return chunk4CUFXCC5_cjs.SurveyBlock; }
 });
 Object.defineProperty(exports, "CsvBlock", {
   enumerable: true,
@@ -39,10 +43,6 @@ Object.defineProperty(exports, "MermaidBlock", {
   enumerable: true,
   get: function () { return chunkP3JEMF6E_cjs.MermaidBlock; }
 });
-Object.defineProperty(exports, "SurveyBlock", {
-  enumerable: true,
-  get: function () { return chunk4CUFXCC5_cjs.SurveyBlock; }
-});
 Object.defineProperty(exports, "FenceBlock", {
   enumerable: true,
   get: function () { return chunkYIXTGWT4_cjs.FenceBlock; }

package/dist/components/Markdown/index.js

@@ -1,8 +1,8 @@
-export { CodeBlock, MarkdownRenderer, highlightCode, useMarkdown } from '../../chunk-Z4PECE5S.js';
+export { CodeBlock, MarkdownRenderer, highlightCode, useMarkdown } from '../../chunk-4PJ24GQ4.js';
+export { SurveyBlock } from '../../chunk-DWCYEPTT.js';
 export { CsvBlock } from '../../chunk-5J5PEUUA.js';
 export { HtmlPreviewBlock } from '../../chunk-UZ5NGGMI.js';
 export { MermaidBlock } from '../../chunk-EHQ77LL5.js';
-export { SurveyBlock } from '../../chunk-DWCYEPTT.js';
 export { FenceBlock } from '../../chunk-NLBT5O2X.js';
 import '../../chunk-D2GID3YK.js';
 import '../../chunk-TQONQSJO.js';

package/dist/components/SourceTip/index.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+var chunkELYGV32O_cjs = require('../../chunk-ELYGV32O.cjs');
+require('../../chunk-FHY3K6PL.cjs');
+require('../../chunk-MYFZYUPR.cjs');
+require('../../chunk-S5RVSXDV.cjs');
+
+
+
+Object.defineProperty(exports, "SourceTip", {
+  enumerable: true,
+  get: function () { return chunkELYGV32O_cjs.SourceTip; }
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/components/SourceTip/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}

package/dist/components/SourceTip/index.d.cts

@@ -0,0 +1,58 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+/** One line of provenance shown in the card. */
+interface TipSource {
+    /** One-line label — statute name or source title. Truncated on render. */
+    label: string;
+    /** Source URL. Omit for a provenance line that isn't linkable. */
+    url?: string;
+    /** Secondary label shown at the end (publisher / host / year). */
+    sub?: string;
+}
+interface SourceTipProps {
+    /** The claim this card explains — the card's heading. */
+    heading: string;
+    /** Free-text provenance, for facts no public URL can verify. */
+    note?: string;
+    /** Linked (or unlinked) one-line sources. */
+    sources?: TipSource[];
+    /** Eyebrow above the heading. Defaults to "Source". */
+    eyebrow?: string;
+    /** The visible trigger. */
+    children: React.ReactNode;
+    className?: string;
+    /**
+     * Underline the trigger with a dashed rule marking a hoverable claim.
+     * Leave off in table cells, which signal hoverability by their own
+     * treatment rather than by underlining every cell.
+     */
+    underline?: boolean;
+}
+/**
+ * A hover card answering "what backs this claim?" — an eyebrow + heading,
+ * optional free-text provenance, and a list of one-line source links.
+ * Suits stat tiles, table cells, and inline facts where a numbered footnote
+ * would be overkill.
+ *
+ * The trigger and card are phrasing content (`span`/`a` only), so it is
+ * valid inside `<p>` prose and table cells. The card portals to `body` with
+ * fixed positioning, flipping and clamping to stay in the viewport. On
+ * touch, a tap pins the card; Escape or an outside tap closes it. A pinned
+ * card behaves as a non-modal dialog — focus moves into it so its source
+ * links are keyboard-reachable, and returns to the trigger on close.
+ *
+ * @example
+ * ```tsx
+ * <SourceTip
+ *   heading="OSHA recordable rate"
+ *   sources={[{ label: 'BLS SOII 2023', url: 'https://www.bls.gov/iif/', sub: 'BLS' }]}
+ *   underline
+ * >
+ *   2.4 per 100 FTE
+ * </SourceTip>
+ * ```
+ */
+declare function SourceTip({ heading, note, sources, eyebrow, children, className, underline, }: SourceTipProps): react_jsx_runtime.JSX.Element;
+
+export { SourceTip, type SourceTipProps, type TipSource };

package/dist/components/SourceTip/index.d.ts

@@ -0,0 +1,58 @@
+import * as react_jsx_runtime from 'react/jsx-runtime';
+import * as React from 'react';
+
+/** One line of provenance shown in the card. */
+interface TipSource {
+    /** One-line label — statute name or source title. Truncated on render. */
+    label: string;
+    /** Source URL. Omit for a provenance line that isn't linkable. */
+    url?: string;
+    /** Secondary label shown at the end (publisher / host / year). */
+    sub?: string;
+}
+interface SourceTipProps {
+    /** The claim this card explains — the card's heading. */
+    heading: string;
+    /** Free-text provenance, for facts no public URL can verify. */
+    note?: string;
+    /** Linked (or unlinked) one-line sources. */
+    sources?: TipSource[];
+    /** Eyebrow above the heading. Defaults to "Source". */
+    eyebrow?: string;
+    /** The visible trigger. */
+    children: React.ReactNode;
+    className?: string;
+    /**
+     * Underline the trigger with a dashed rule marking a hoverable claim.
+     * Leave off in table cells, which signal hoverability by their own
+     * treatment rather than by underlining every cell.
+     */
+    underline?: boolean;
+}
+/**
+ * A hover card answering "what backs this claim?" — an eyebrow + heading,
+ * optional free-text provenance, and a list of one-line source links.
+ * Suits stat tiles, table cells, and inline facts where a numbered footnote
+ * would be overkill.
+ *
+ * The trigger and card are phrasing content (`span`/`a` only), so it is
+ * valid inside `<p>` prose and table cells. The card portals to `body` with
+ * fixed positioning, flipping and clamping to stay in the viewport. On
+ * touch, a tap pins the card; Escape or an outside tap closes it. A pinned
+ * card behaves as a non-modal dialog — focus moves into it so its source
+ * links are keyboard-reachable, and returns to the trigger on close.
+ *
+ * @example
+ * ```tsx
+ * <SourceTip
+ *   heading="OSHA recordable rate"
+ *   sources={[{ label: 'BLS SOII 2023', url: 'https://www.bls.gov/iif/', sub: 'BLS' }]}
+ *   underline
+ * >
+ *   2.4 per 100 FTE
+ * </SourceTip>
+ * ```
+ */
+declare function SourceTip({ heading, note, sources, eyebrow, children, className, underline, }: SourceTipProps): react_jsx_runtime.JSX.Element;
+
+export { SourceTip, type SourceTipProps, type TipSource };

package/dist/components/SourceTip/index.js

@@ -0,0 +1,6 @@
+export { SourceTip } from '../../chunk-XMECP2MD.js';
+import '../../chunk-T4ME7QCT.js';
+import '../../chunk-BOOJDRJO.js';
+import '../../chunk-TQONQSJO.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/components/SourceTip/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/esheet.cjs

@@ -1,8 +1,8 @@
 'use strict';
 
-var chunkSETNPK4P_cjs = require('./chunk-SETNPK4P.cjs');
-require('./chunk-WWJIW2IH.cjs');
+var chunkX5OS45WZ_cjs = require('./chunk-X5OS45WZ.cjs');
 require('./chunk-BSDBI6H7.cjs');
+require('./chunk-WWJIW2IH.cjs');
 require('./chunk-G7EQ3JPX.cjs');
 require('./chunk-U5TTXN45.cjs');
 require('./chunk-AIJAFPGJ.cjs');
@@ -78,7 +78,7 @@ function MedicationListField({
     return definition.medications ?? [];
   }, [response?.answer, definition.medications]);
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkSETNPK4P_cjs.MedicationReconciliation,
+    chunkX5OS45WZ_cjs.MedicationReconciliation,
     {
       medications,
       onChange: (next) => onResponse({ answer: JSON.stringify({ medications: next }) }),
@@ -135,7 +135,7 @@ function AllergyListField({
   codeLookup
 }) {
   const definition = field.definition;
-  const ambientCodeLookup = chunkSETNPK4P_cjs.useCodeLookupConfig();
+  const ambientCodeLookup = chunkX5OS45WZ_cjs.useCodeLookupConfig();
   const effectiveCodeLookup = codeLookup === false ? void 0 : codeLookup ?? ambientCodeLookup ?? void 0;
   const value = React__namespace.useMemo(() => {
     if (response?.answer) return parseValue2(response.answer);
@@ -145,7 +145,7 @@ function AllergyListField({
     onResponse({ answer: JSON.stringify(next) });
   };
   return /* @__PURE__ */ jsxRuntime.jsx(
-    chunkSETNPK4P_cjs.AllergyManager,
+    chunkX5OS45WZ_cjs.AllergyManager,
     {
       allergies: value.allergies,
       onChange: (allergies) => commit({

package/dist/esheet.js

@@ -1,6 +1,6 @@
-import { MedicationReconciliation, useCodeLookupConfig, AllergyManager } from './chunk-2WLP2ERQ.js';
-import './chunk-FJ7YPVKV.js';
+import { MedicationReconciliation, useCodeLookupConfig, AllergyManager } from './chunk-5D253OQS.js';
 import './chunk-H3YO5GBM.js';
+import './chunk-FJ7YPVKV.js';
 import './chunk-EPSB4WTL.js';
 import './chunk-IILJGFI5.js';
 import './chunk-I3WGZPI6.js';