@contractspec/lib.accessibility 1.57.0 → 1.59.0

package/dist/browser/AccessibilityProvider.js

@@ -0,0 +1,173 @@
+// src/preferences.tsx
+import React from "react";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+var DEFAULT_PREFERENCES = {
+  textSize: "m",
+  textSpacing: "normal",
+  lineHeight: "normal",
+  underlineLinks: false,
+  focusRing: "normal",
+  reduceMotion: "system",
+  highContrast: false,
+  dyslexiaFont: false
+};
+var STORAGE_KEY = "a11y:preferences:v1";
+function getStoredPreferences() {
+  try {
+    const raw = typeof window !== "undefined" ? window.localStorage.getItem(STORAGE_KEY) : null;
+    if (!raw)
+      return null;
+    const parsed = JSON.parse(raw);
+    return { ...DEFAULT_PREFERENCES, ...parsed };
+  } catch {
+    return null;
+  }
+}
+function savePreferences(prefs) {
+  try {
+    if (typeof window !== "undefined") {
+      window.localStorage.setItem(STORAGE_KEY, JSON.stringify(prefs));
+    }
+  } catch {}
+}
+function applyCssVariables(prefs) {
+  if (typeof document === "undefined")
+    return;
+  const root = document.documentElement;
+  const body = document.body;
+  const sizeMap = {
+    s: "0.95",
+    m: "1",
+    l: "1.1",
+    xl: "1.25"
+  };
+  root.style.setProperty("--a11y-text-scale", sizeMap[prefs.textSize]);
+  const targetMin = prefs.textSize === "l" || prefs.textSize === "xl" ? "44px" : "0px";
+  root.style.setProperty("--a11y-target-min", targetMin);
+  root.style.setProperty("--a11y-letter-spacing", prefs.textSpacing === "increased" ? "0.12em" : "normal");
+  root.style.setProperty("--a11y-word-spacing", prefs.textSpacing === "increased" ? "0.16em" : "normal");
+  root.style.setProperty("--a11y-line-height", prefs.lineHeight === "increased" ? "1.6" : "1.5");
+  root.style.setProperty("--a11y-underline-links", prefs.underlineLinks ? "underline" : "revert");
+  root.style.setProperty("--a11y-focus-ring-width", prefs.focusRing === "thick" ? "4px" : "2px");
+  root.style.setProperty("--a11y-reduce-motion", prefs.reduceMotion);
+  root.style.setProperty("--a11y-contrast-mode", prefs.highContrast ? "high" : "normal");
+  if (prefs.highContrast) {
+    root.setAttribute("data-contrast", "high");
+  } else {
+    root.removeAttribute("data-contrast");
+  }
+  root.style.setProperty("--a11y-font-family-alt-enabled", prefs.dyslexiaFont ? "1" : "0");
+  if (body) {
+    if (prefs.textSpacing === "increased") {
+      body.style.letterSpacing = "0.12em";
+      body.style.wordSpacing = "0.16em";
+    } else {
+      body.style.letterSpacing = "";
+      body.style.wordSpacing = "";
+    }
+    body.style.lineHeight = prefs.lineHeight === "increased" ? "1.6" : "";
+  }
+}
+var PreferencesContext = React.createContext(null);
+function useA11YPreferences() {
+  const ctx = React.useContext(PreferencesContext);
+  if (!ctx)
+    throw new Error("useA11YPreferences must be used within A11YPreferencesProvider");
+  return ctx;
+}
+function A11YPreferencesProvider({
+  children
+}) {
+  const [preferences, setPreferencesState] = React.useState(DEFAULT_PREFERENCES);
+  const [hydrated, setHydrated] = React.useState(false);
+  React.useEffect(() => {
+    const stored = getStoredPreferences();
+    const next = stored ?? DEFAULT_PREFERENCES;
+    setPreferencesState(next);
+    setHydrated(true);
+    applyCssVariables(next);
+  }, []);
+  const setPreferences = React.useCallback((updater) => {
+    setPreferencesState((prev) => {
+      const next = typeof updater === "function" ? updater(prev) : { ...prev, ...updater };
+      savePreferences(next);
+      applyCssVariables(next);
+      try {
+        if (typeof window !== "undefined") {
+          const changed = {};
+          for (const key of Object.keys(next)) {
+            if (next[key] !== prev[key]) {
+              changed[key] = next[key];
+            }
+          }
+          window.dispatchEvent(new CustomEvent("a11y:pref_changed", {
+            detail: {
+              previous: prev,
+              current: next,
+              changed
+            }
+          }));
+        }
+      } catch {}
+      return next;
+    });
+  }, []);
+  const value = React.useMemo(() => ({ preferences, setPreferences }), [preferences, setPreferences]);
+  return /* @__PURE__ */ jsxDEV(PreferencesContext, {
+    value,
+    children: [
+      children,
+      !hydrated ? null : null
+    ]
+  }, undefined, true, undefined, this);
+}
+function a11yRootClassName() {
+  return "a11y-root";
+}
+
+// src/next-route-announcer.tsx
+import * as React2 from "react";
+import { usePathname } from "next/navigation";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+"use client";
+function NextRouteAnnouncer() {
+  const pathname = usePathname();
+  const [message, setMessage] = React2.useState("");
+  React2.useEffect(() => {
+    if (typeof document !== "undefined") {
+      setMessage(document.title || pathname || "");
+    }
+  }, [pathname]);
+  return /* @__PURE__ */ jsxDEV2("div", {
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    className: "sr-only",
+    children: message
+  }, undefined, false, undefined, this);
+}
+
+// src/AccessibilityProvider.tsx
+import { SRLiveRegionProvider } from "@contractspec/lib.ui-kit-web/ui/live-region";
+import { SkipLink } from "@contractspec/lib.ui-kit-web/ui/skip-link";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+"use client";
+function AccessibilityProvider({
+  children,
+  skipTargetId = "main"
+}) {
+  return /* @__PURE__ */ jsxDEV3(A11YPreferencesProvider, {
+    children: /* @__PURE__ */ jsxDEV3(SRLiveRegionProvider, {
+      children: [
+        /* @__PURE__ */ jsxDEV3(SkipLink, {
+          targetId: skipTargetId
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV3(NextRouteAnnouncer, {}, undefined, false, undefined, this),
+        children
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+}
+export {
+  AccessibilityProvider
+};

package/dist/{styles-C5GUMPoX.css → browser/index.css}

@@ -1,3 +1,4 @@
+/* src/styles.css */
 :root {
   --a11y-text-scale: 1;
   --a11y-letter-spacing: normal;
@@ -10,14 +11,11 @@
   --a11y-font-family-alt-enabled: 0;
 }
 
-html,
-body {
+html, body {
   font-size: calc(16px * var(--a11y-text-scale));
 }
 
-body,
-p,
-li {
+body, p, li {
   letter-spacing: var(--a11y-letter-spacing);
   word-spacing: var(--a11y-word-spacing);
   line-height: var(--a11y-line-height);
@@ -27,7 +25,7 @@ a {
   text-decoration: var(--a11y-underline-links);
 }
 
-:where(button, [role='button'], a, input, select, textarea) {
+:where(button, [role="button"], a, input, select, textarea) {
   outline-offset: 2px;
   min-height: var(--a11y-target-min, 0);
   min-width: var(--a11y-target-min, 0);
@@ -37,38 +35,26 @@ a {
   outline: var(--a11y-focus-ring-width) solid currentColor;
 }
 
-/* High contrast mode surface example tokens (apps should map their colors) */
-:root[data-contrast='high'],
-:root[style*='--a11y-contrast-mode: high'] {
-  /* Apps can read this signal to swap theme */
-}
-
-/* Dyslexia-friendly font: consumers should apply a font-family when enabled */
-:root[style*='--a11y-font-family-alt-enabled: 1'] body {
+:root[style*="--a11y-font-family-alt-enabled: 1"] body {
   font-family: var(--font-dyslexia, system-ui, sans-serif);
 }
 
-/* Respect reduced motion preference and explicit override */
 @media (prefers-reduced-motion: reduce) {
-  :root[style*='--a11y-reduce-motion: system'] * {
+  :root[style*="--a11y-reduce-motion: system"] * {
     animation: none !important;
-    transition: none !important;
     scroll-behavior: auto !important;
+    transition: none !important;
   }
 }
-:root[style*='--a11y-reduce-motion: reduce'] * {
+
+:root[style*="--a11y-reduce-motion: reduce"] * {
   animation: none !important;
-  transition: none !important;
   scroll-behavior: auto !important;
+  transition: none !important;
 }
 
-/* Explicit fallbacks for environments not honoring custom properties thoroughly */
 body {
-  /* If variables are missing, ensure readable defaults */
   letter-spacing: var(--a11y-letter-spacing, normal);
   word-spacing: var(--a11y-word-spacing, normal);
   line-height: var(--a11y-line-height, 1.5);
 }
-
-
-/*# sourceMappingURL=styles-C5GUMPoX.css.map*/

package/dist/browser/index.js

@@ -0,0 +1,427 @@
+// src/preferences.tsx
+import React from "react";
+import { jsxDEV } from "react/jsx-dev-runtime";
+"use client";
+var DEFAULT_PREFERENCES = {
+  textSize: "m",
+  textSpacing: "normal",
+  lineHeight: "normal",
+  underlineLinks: false,
+  focusRing: "normal",
+  reduceMotion: "system",
+  highContrast: false,
+  dyslexiaFont: false
+};
+var STORAGE_KEY = "a11y:preferences:v1";
+function getStoredPreferences() {
+  try {
+    const raw = typeof window !== "undefined" ? window.localStorage.getItem(STORAGE_KEY) : null;
+    if (!raw)
+      return null;
+    const parsed = JSON.parse(raw);
+    return { ...DEFAULT_PREFERENCES, ...parsed };
+  } catch {
+    return null;
+  }
+}
+function savePreferences(prefs) {
+  try {
+    if (typeof window !== "undefined") {
+      window.localStorage.setItem(STORAGE_KEY, JSON.stringify(prefs));
+    }
+  } catch {}
+}
+function applyCssVariables(prefs) {
+  if (typeof document === "undefined")
+    return;
+  const root = document.documentElement;
+  const body = document.body;
+  const sizeMap = {
+    s: "0.95",
+    m: "1",
+    l: "1.1",
+    xl: "1.25"
+  };
+  root.style.setProperty("--a11y-text-scale", sizeMap[prefs.textSize]);
+  const targetMin = prefs.textSize === "l" || prefs.textSize === "xl" ? "44px" : "0px";
+  root.style.setProperty("--a11y-target-min", targetMin);
+  root.style.setProperty("--a11y-letter-spacing", prefs.textSpacing === "increased" ? "0.12em" : "normal");
+  root.style.setProperty("--a11y-word-spacing", prefs.textSpacing === "increased" ? "0.16em" : "normal");
+  root.style.setProperty("--a11y-line-height", prefs.lineHeight === "increased" ? "1.6" : "1.5");
+  root.style.setProperty("--a11y-underline-links", prefs.underlineLinks ? "underline" : "revert");
+  root.style.setProperty("--a11y-focus-ring-width", prefs.focusRing === "thick" ? "4px" : "2px");
+  root.style.setProperty("--a11y-reduce-motion", prefs.reduceMotion);
+  root.style.setProperty("--a11y-contrast-mode", prefs.highContrast ? "high" : "normal");
+  if (prefs.highContrast) {
+    root.setAttribute("data-contrast", "high");
+  } else {
+    root.removeAttribute("data-contrast");
+  }
+  root.style.setProperty("--a11y-font-family-alt-enabled", prefs.dyslexiaFont ? "1" : "0");
+  if (body) {
+    if (prefs.textSpacing === "increased") {
+      body.style.letterSpacing = "0.12em";
+      body.style.wordSpacing = "0.16em";
+    } else {
+      body.style.letterSpacing = "";
+      body.style.wordSpacing = "";
+    }
+    body.style.lineHeight = prefs.lineHeight === "increased" ? "1.6" : "";
+  }
+}
+var PreferencesContext = React.createContext(null);
+function useA11YPreferences() {
+  const ctx = React.useContext(PreferencesContext);
+  if (!ctx)
+    throw new Error("useA11YPreferences must be used within A11YPreferencesProvider");
+  return ctx;
+}
+function A11YPreferencesProvider({
+  children
+}) {
+  const [preferences, setPreferencesState] = React.useState(DEFAULT_PREFERENCES);
+  const [hydrated, setHydrated] = React.useState(false);
+  React.useEffect(() => {
+    const stored = getStoredPreferences();
+    const next = stored ?? DEFAULT_PREFERENCES;
+    setPreferencesState(next);
+    setHydrated(true);
+    applyCssVariables(next);
+  }, []);
+  const setPreferences = React.useCallback((updater) => {
+    setPreferencesState((prev) => {
+      const next = typeof updater === "function" ? updater(prev) : { ...prev, ...updater };
+      savePreferences(next);
+      applyCssVariables(next);
+      try {
+        if (typeof window !== "undefined") {
+          const changed = {};
+          for (const key of Object.keys(next)) {
+            if (next[key] !== prev[key]) {
+              changed[key] = next[key];
+            }
+          }
+          window.dispatchEvent(new CustomEvent("a11y:pref_changed", {
+            detail: {
+              previous: prev,
+              current: next,
+              changed
+            }
+          }));
+        }
+      } catch {}
+      return next;
+    });
+  }, []);
+  const value = React.useMemo(() => ({ preferences, setPreferences }), [preferences, setPreferences]);
+  return /* @__PURE__ */ jsxDEV(PreferencesContext, {
+    value,
+    children: [
+      children,
+      !hydrated ? null : null
+    ]
+  }, undefined, true, undefined, this);
+}
+function a11yRootClassName() {
+  return "a11y-root";
+}
+
+// src/AccessibilityPanel.tsx
+import {
+  Dialog,
+  DialogClose,
+  DialogContent,
+  DialogOverlay,
+  DialogPortal,
+  DialogTitle,
+  DialogTrigger
+} from "@contractspec/lib.ui-kit-web/ui/dialog";
+import { Button } from "@contractspec/lib.design-system";
+import { Switch } from "@contractspec/lib.ui-kit-web/ui/switch";
+import { Label } from "@contractspec/lib.ui-kit-web/ui/label";
+import {
+  Select,
+  SelectContent,
+  SelectItem,
+  SelectTrigger,
+  SelectValue
+} from "@contractspec/lib.ui-kit-web/ui/select";
+import { cn } from "@contractspec/lib.ui-kit-web/ui/utils";
+import { jsxDEV as jsxDEV2 } from "react/jsx-dev-runtime";
+"use client";
+function AccessibilityPanel({ className }) {
+  const { preferences, setPreferences } = useA11YPreferences();
+  return /* @__PURE__ */ jsxDEV2(Dialog, {
+    children: [
+      /* @__PURE__ */ jsxDEV2(DialogTrigger, {
+        asChild: true,
+        children: /* @__PURE__ */ jsxDEV2(Button, {
+          variant: "outline",
+          "aria-haspopup": "dialog",
+          children: "Accessibility"
+        }, undefined, false, undefined, this)
+      }, undefined, false, undefined, this),
+      /* @__PURE__ */ jsxDEV2(DialogPortal, {
+        children: [
+          /* @__PURE__ */ jsxDEV2(DialogOverlay, {
+            className: "fixed inset-0 z-50 bg-black/40"
+          }, undefined, false, undefined, this),
+          /* @__PURE__ */ jsxDEV2(DialogContent, {
+            className: cn("bg-background focus-visible:ring-ring max-w-md p-6 shadow-lg outline-hidden focus-visible:ring-2", className),
+            "aria-describedby": "a11y-panel-desc",
+            children: [
+              /* @__PURE__ */ jsxDEV2(DialogTitle, {
+                className: "text-lg font-semibold",
+                children: "Accessibility settings"
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("p", {
+                id: "a11y-panel-desc",
+                className: "text-muted-foreground text-sm",
+                children: "Adjust text size, spacing, focus and motion to suit your needs."
+              }, undefined, false, undefined, this),
+              /* @__PURE__ */ jsxDEV2("div", {
+                className: "mt-6 space-y-6",
+                children: [
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "space-y-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        children: "Text size"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Select, {
+                        value: preferences.textSize,
+                        onValueChange: (v) => setPreferences({ textSize: v }),
+                        children: [
+                          /* @__PURE__ */ jsxDEV2(SelectTrigger, {
+                            "aria-label": "Text size",
+                            children: /* @__PURE__ */ jsxDEV2(SelectValue, {}, undefined, false, undefined, this)
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV2(SelectContent, {
+                            children: [
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "s",
+                                children: "Small"
+                              }, undefined, false, undefined, this),
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "m",
+                                children: "Medium"
+                              }, undefined, false, undefined, this),
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "l",
+                                children: "Large"
+                              }, undefined, false, undefined, this),
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "xl",
+                                children: "Extra Large"
+                              }, undefined, false, undefined, this)
+                            ]
+                          }, undefined, true, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "text-spacing",
+                        children: "Increase text spacing (WCAG 1.4.12)"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "text-spacing",
+                        checked: preferences.textSpacing === "increased",
+                        onCheckedChange: (c) => setPreferences({ textSpacing: c ? "increased" : "normal" })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "line-height",
+                        children: "Increase line height"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "line-height",
+                        checked: preferences.lineHeight === "increased",
+                        onCheckedChange: (c) => setPreferences({ lineHeight: c ? "increased" : "normal" })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "underline-links",
+                        children: "Always underline links"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "underline-links",
+                        checked: preferences.underlineLinks,
+                        onCheckedChange: (c) => setPreferences({ underlineLinks: c })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "focus-ring",
+                        children: "Thick focus ring"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "focus-ring",
+                        checked: preferences.focusRing === "thick",
+                        onCheckedChange: (c) => setPreferences({ focusRing: c ? "thick" : "normal" })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "space-y-2",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        children: "Motion"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Select, {
+                        value: preferences.reduceMotion,
+                        onValueChange: (v) => setPreferences({ reduceMotion: v }),
+                        children: [
+                          /* @__PURE__ */ jsxDEV2(SelectTrigger, {
+                            "aria-label": "Motion preferences",
+                            children: /* @__PURE__ */ jsxDEV2(SelectValue, {}, undefined, false, undefined, this)
+                          }, undefined, false, undefined, this),
+                          /* @__PURE__ */ jsxDEV2(SelectContent, {
+                            children: [
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "system",
+                                children: "Follow system"
+                              }, undefined, false, undefined, this),
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "reduce",
+                                children: "Reduce motion"
+                              }, undefined, false, undefined, this),
+                              /* @__PURE__ */ jsxDEV2(SelectItem, {
+                                value: "no-preference",
+                                children: "Allow motion"
+                              }, undefined, false, undefined, this)
+                            ]
+                          }, undefined, true, undefined, this)
+                        ]
+                      }, undefined, true, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "contrast",
+                        children: "High contrast"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "contrast",
+                        checked: preferences.highContrast,
+                        onCheckedChange: (c) => setPreferences({ highContrast: c })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this),
+                  /* @__PURE__ */ jsxDEV2("div", {
+                    className: "flex items-center justify-between",
+                    children: [
+                      /* @__PURE__ */ jsxDEV2(Label, {
+                        htmlFor: "dyslexia-font",
+                        children: "Dyslexia-friendly font"
+                      }, undefined, false, undefined, this),
+                      /* @__PURE__ */ jsxDEV2(Switch, {
+                        id: "dyslexia-font",
+                        checked: preferences.dyslexiaFont,
+                        onCheckedChange: (c) => setPreferences({ dyslexiaFont: c })
+                      }, undefined, false, undefined, this)
+                    ]
+                  }, undefined, true, undefined, this)
+                ]
+              }, undefined, true, undefined, this),
+              /* @__PURE__ */ jsxDEV2("div", {
+                className: "mt-8 flex justify-end gap-2",
+                children: /* @__PURE__ */ jsxDEV2(DialogClose, {
+                  asChild: true,
+                  children: /* @__PURE__ */ jsxDEV2(Button, {
+                    variant: "secondary",
+                    children: "Close"
+                  }, undefined, false, undefined, this)
+                }, undefined, false, undefined, this)
+              }, undefined, false, undefined, this)
+            ]
+          }, undefined, true, undefined, this)
+        ]
+      }, undefined, true, undefined, this)
+    ]
+  }, undefined, true, undefined, this);
+}
+
+// src/next-route-announcer.tsx
+import * as React2 from "react";
+import { usePathname } from "next/navigation";
+import { jsxDEV as jsxDEV3 } from "react/jsx-dev-runtime";
+"use client";
+function NextRouteAnnouncer() {
+  const pathname = usePathname();
+  const [message, setMessage] = React2.useState("");
+  React2.useEffect(() => {
+    if (typeof document !== "undefined") {
+      setMessage(document.title || pathname || "");
+    }
+  }, [pathname]);
+  return /* @__PURE__ */ jsxDEV3("div", {
+    "aria-live": "polite",
+    "aria-atomic": "true",
+    className: "sr-only",
+    children: message
+  }, undefined, false, undefined, this);
+}
+
+// src/AccessibilityProvider.tsx
+import { SRLiveRegionProvider } from "@contractspec/lib.ui-kit-web/ui/live-region";
+import { SkipLink } from "@contractspec/lib.ui-kit-web/ui/skip-link";
+import { jsxDEV as jsxDEV4 } from "react/jsx-dev-runtime";
+"use client";
+function AccessibilityProvider({
+  children,
+  skipTargetId = "main"
+}) {
+  return /* @__PURE__ */ jsxDEV4(A11YPreferencesProvider, {
+    children: /* @__PURE__ */ jsxDEV4(SRLiveRegionProvider, {
+      children: [
+        /* @__PURE__ */ jsxDEV4(SkipLink, {
+          targetId: skipTargetId
+        }, undefined, false, undefined, this),
+        /* @__PURE__ */ jsxDEV4(NextRouteAnnouncer, {}, undefined, false, undefined, this),
+        children
+      ]
+    }, undefined, true, undefined, this)
+  }, undefined, false, undefined, this);
+}
+
+// src/index.ts
+import { SkipLink as SkipLink2 } from "@contractspec/lib.ui-kit-web/ui/skip-link";
+import { VisuallyHidden } from "@contractspec/lib.ui-kit-web/ui/visually-hidden";
+import {
+  SRLiveRegionProvider as SRLiveRegionProvider2,
+  useSRLiveRegion
+} from "@contractspec/lib.ui-kit-web/ui/live-region";
+import { RouteAnnouncer } from "@contractspec/lib.ui-kit-web/ui/route-announcer";
+import { FocusOnRouteChange } from "@contractspec/lib.ui-kit-web/ui/focus-on-route-change";
+import { useReducedMotion } from "@contractspec/lib.ui-kit-web/ui/use-reduced-motion";
+export {
+  useSRLiveRegion,
+  useReducedMotion,
+  useA11YPreferences,
+  VisuallyHidden,
+  SkipLink2 as SkipLink,
+  SRLiveRegionProvider2 as SRLiveRegionProvider,
+  RouteAnnouncer,
+  NextRouteAnnouncer,
+  FocusOnRouteChange,
+  AccessibilityProvider,
+  AccessibilityPanel,
+  A11YPreferencesProvider
+};