@salt-ds/core 1.59.1 → 1.61.0

package/dist-cjs/tooltip/useAriaAnnounce.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAriaAnnounce.js","sources":["../src/tooltip/useAriaAnnounce.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { type PointerEvent, useEffect, useRef } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nfunction getDocument(floating: HTMLElement | null) {\n  return floating?.ownerDocument ?? document;\n}\n\n// TODO: Check whether can be anything more restrictive than `any`\n// biome-ignore lint/suspicious/noExplicitAny: see comment above\nfunction getWindow(value: any) {\n  return getDocument(value).defaultView ?? window;\n}\n\nfunction isElement(value: unknown): value is HTMLElement {\n  return value ? value instanceof getWindow(value).Element : false;\n}\n\nfunction getDelay(\n  value: Props[\"delay\"],\n  prop: \"open\" | \"close\",\n  pointerType?: PointerEvent[\"pointerType\"],\n) {\n  if (pointerType && pointerType !== \"mouse\") {\n    return 0;\n  }\n\n  if (typeof value === \"number\") {\n    return value;\n  }\n\n  return value?.[prop];\n}\n\ntype Props = {\n  delay?: number | Partial<{ open: number; close: number }>;\n};\n\nexport const useAriaAnnounce = (\n  context: FloatingContext,\n  { delay = 0 }: Props,\n): ElementProps => {\n  const { open, dataRef, refs } = context;\n\n  const pointerTypeRef = useRef<PointerEvent[\"pointerType\"]>();\n  const timeoutRef = useRef<number>();\n  const blockMouseMoveRef = useRef(true);\n  const { announce } = useAriaAnnouncer();\n\n  useIsomorphicLayoutEffect(() => {\n    if (!open) {\n      pointerTypeRef.current = undefined;\n    }\n  });\n\n  useEffect(() => {\n    const reference = refs.reference.current;\n    function announceFloating() {\n      const tooltipContent = refs.floating.current?.innerText;\n\n      if (tooltipContent) {\n        announce(tooltipContent);\n      }\n    }\n\n    function onMouseEnter(event: MouseEvent) {\n      clearTimeout(timeoutRef.current);\n\n      if (open) {\n        return;\n      }\n\n      blockMouseMoveRef.current = false;\n      dataRef.current.openEvent = event;\n\n      if (delay) {\n        timeoutRef.current = window.setTimeout(\n          () => {\n            announceFloating();\n          },\n          getDelay(delay, \"open\", pointerTypeRef.current),\n        );\n      } else {\n        announceFloating();\n      }\n    }\n\n    if (isElement(reference)) {\n      reference.addEventListener(\"mouseenter\", onMouseEnter);\n      return () => {\n        reference.removeEventListener(\"mouseenter\", onMouseEnter);\n      };\n    }\n  }, [dataRef, delay, open, refs.reference, refs.floating, announce]);\n\n  function setPointerRef(event: PointerEvent) {\n    pointerTypeRef.current = event.pointerType;\n  }\n\n  return {\n    reference: {\n      onPointerDown: setPointerRef,\n      onPointerEnter: setPointerRef,\n    },\n    floating: {\n      onMouseEnter() {\n        clearTimeout(timeoutRef.current);\n      },\n    },\n  };\n};\n"],"names":["useRef","useAriaAnnouncer","useIsomorphicLayoutEffect","useEffect"],"mappings":"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"}
+{"version":3,"file":"useAriaAnnounce.js","sources":["../src/tooltip/useAriaAnnounce.ts"],"sourcesContent":["import type { ElementProps, FloatingContext } from \"@floating-ui/react\";\nimport { type PointerEvent, useEffect, useRef } from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { useIsomorphicLayoutEffect } from \"../utils\";\n\nfunction getDocument(floating: HTMLElement | null) {\n  return floating?.ownerDocument ?? document;\n}\n\n// TODO: Check whether can be anything more restrictive than `any`\n// biome-ignore lint/suspicious/noExplicitAny: see comment above\nfunction getWindow(value: any) {\n  return getDocument(value).defaultView ?? window;\n}\n\nfunction isElement(value: unknown): value is HTMLElement {\n  return value ? value instanceof getWindow(value).Element : false;\n}\n\nfunction getDelay(\n  value: Props[\"delay\"],\n  prop: \"open\" | \"close\",\n  pointerType?: PointerEvent[\"pointerType\"],\n) {\n  if (pointerType && pointerType !== \"mouse\") {\n    return 0;\n  }\n\n  if (typeof value === \"number\") {\n    return value;\n  }\n\n  return value?.[prop];\n}\n\ntype Props = {\n  delay?: number | Partial<{ open: number; close: number }>;\n};\n\nexport const useAriaAnnounce = (\n  context: FloatingContext,\n  { delay = 0 }: Props,\n): ElementProps => {\n  const { open, dataRef, refs } = context;\n\n  const pointerTypeRef = useRef<PointerEvent[\"pointerType\"]>();\n  const timeoutRef = useRef<number>();\n  const blockMouseMoveRef = useRef(true);\n  const { announce } = useAriaAnnouncer();\n\n  useIsomorphicLayoutEffect(() => {\n    if (!open) {\n      pointerTypeRef.current = undefined;\n    }\n  });\n\n  useEffect(() => {\n    const reference = refs.reference.current;\n    function announceFloating() {\n      const tooltipContent = refs.floating.current?.innerText;\n\n      if (tooltipContent) {\n        announce(tooltipContent);\n      }\n    }\n\n    function onMouseEnter(event: MouseEvent) {\n      clearTimeout(timeoutRef.current);\n\n      if (open) {\n        return;\n      }\n\n      blockMouseMoveRef.current = false;\n      dataRef.current.openEvent = event;\n\n      if (delay) {\n        timeoutRef.current = window.setTimeout(\n          () => {\n            announceFloating();\n          },\n          getDelay(delay, \"open\", pointerTypeRef.current),\n        );\n      } else {\n        announceFloating();\n      }\n    }\n\n    if (isElement(reference)) {\n      reference.addEventListener(\"mouseenter\", onMouseEnter);\n      return () => {\n        reference.removeEventListener(\"mouseenter\", onMouseEnter);\n      };\n    }\n  }, [dataRef, delay, open, refs.reference, refs.floating, announce]);\n\n  function setPointerRef(event: PointerEvent) {\n    pointerTypeRef.current = event.pointerType;\n  }\n\n  return {\n    reference: {\n      onPointerDown: setPointerRef,\n      onPointerEnter: setPointerRef,\n    },\n    floating: {\n      onMouseEnter() {\n        clearTimeout(timeoutRef.current);\n      },\n    },\n  };\n};\n"],"names":["useRef","useAriaAnnouncer","useIsomorphicLayoutEffect","useEffect"],"mappings":"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"}

package/dist-es/aria-announcer/AriaAnnounce.js

@@ -3,14 +3,26 @@ import { useEffect } from 'react';
 import { useAriaAnnouncer } from './useAriaAnnouncer.js';
 
 const AriaAnnounce = ({
-  announcement
+  announcement,
+  delay,
+  ariaLive,
+  duration,
+  target
 }) => {
   const { announce } = useAriaAnnouncer();
   useEffect(() => {
     if (announcement) {
-      announce(announcement);
+      if (delay !== void 0) {
+        announce(announcement, delay);
+      } else {
+        announce(announcement, {
+          ...ariaLive ? { ariaLive } : {},
+          ...duration !== void 0 ? { duration } : {},
+          ...target ? { target } : {}
+        });
+      }
     }
-  }, [announce, announcement]);
+  }, [announce, announcement, ariaLive, delay, duration, target]);
   return /* @__PURE__ */ jsx(Fragment, {});
 };
 

package/dist-es/aria-announcer/AriaAnnounce.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\n\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps {\n  /**\n   * String which will be announced by screen readers on change\n   */\n  announcement?: string;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n  announcement,\n}) => {\n  const { announce } = useAriaAnnouncer();\n\n  useEffect(() => {\n    if (announcement) {\n      announce(announcement);\n    }\n  }, [announce, announcement]);\n\n  // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n  return <></>;\n};\n"],"names":[],"mappings":";;;;AAWO,MAAM,eAAiD,CAAC;AAAA,EAC7D;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AAEtC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAA,EAAc;AAChB,MAAA,QAAA,CAAS,YAAY,CAAA;AAAA,IACvB;AAAA,EACF,CAAA,EAAG,CAAC,QAAA,EAAU,YAAY,CAAC,CAAA;AAG3B,EAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAE,CAAA;AACX;;;;"}
+{"version":3,"file":"AriaAnnounce.js","sources":["../src/aria-announcer/AriaAnnounce.tsx"],"sourcesContent":["import { type ComponentType, useEffect } from \"react\";\nimport type { AnnounceFnOptions } from \"./AriaAnnouncerContext\";\nimport { useAriaAnnouncer } from \"./useAriaAnnouncer\";\n\nexport interface AriaAnnounceProps extends AnnounceFnOptions {\n  /**\n   * String to be announced by screenreader.\n   */\n  announcement?: string;\n  /**\n   * Legacy option, precede the announcement with a delay.\n   * @deprecated\n   * useAriaAnnouncer `delay` arg is deprecated, use your own `setTimeout` or consider using `duration` through `AnnounceFnOptions` instead.\n   */\n  delay?: number;\n}\n\nexport const AriaAnnounce: ComponentType<AriaAnnounceProps> = ({\n  announcement,\n  delay,\n  ariaLive,\n  duration,\n  target,\n}) => {\n  const { announce } = useAriaAnnouncer();\n\n  useEffect(() => {\n    if (announcement) {\n      if (delay !== undefined) {\n        announce(announcement, delay);\n      } else {\n        announce(announcement, {\n          ...(ariaLive ? { ariaLive } : {}),\n          ...(duration !== undefined ? { duration } : {}),\n          ...(target ? { target } : {}),\n        });\n      }\n    }\n  }, [announce, announcement, ariaLive, delay, duration, target]);\n\n  // biome-ignore lint/complexity/noUselessFragments: If we return null here, react-docgen wouldn't be able to locate the component.\n  return <></>;\n};\n"],"names":[],"mappings":";;;;AAiBO,MAAM,eAAiD,CAAC;AAAA,EAC7D,YAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAA,KAAM;AACJ,EAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AAEtC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,IAAI,YAAA,EAAc;AAChB,MAAA,IAAI,UAAU,MAAA,EAAW;AACvB,QAAA,QAAA,CAAS,cAAc,KAAK,CAAA;AAAA,MAC9B,CAAA,MAAO;AACL,QAAA,QAAA,CAAS,YAAA,EAAc;AAAA,UACrB,GAAI,QAAA,GAAW,EAAE,QAAA,KAAa,EAAC;AAAA,UAC/B,GAAI,QAAA,KAAa,MAAA,GAAY,EAAE,QAAA,KAAa,EAAC;AAAA,UAC7C,GAAI,MAAA,GAAS,EAAE,MAAA,KAAW;AAAC,SAC5B,CAAA;AAAA,MACH;AAAA,IACF;AAAA,EACF,CAAA,EAAG,CAAC,QAAA,EAAU,YAAA,EAAc,UAAU,KAAA,EAAO,QAAA,EAAU,MAAM,CAAC,CAAA;AAG9D,EAAA,uBAAO,GAAA,CAAA,QAAA,EAAA,EAAE,CAAA;AACX;;;;"}

package/dist-es/aria-announcer/AriaAnnouncerContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { createContext } from \"react\";\n\nexport type AnnounceFn = (announcement: string, delay?: number) => void;\n\nexport type AriaAnnouncer = {\n  announce: AnnounceFn;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n  undefined,\n);\n"],"names":[],"mappings":";;AAQO,MAAM,oBAAA,GAAuB,aAAA;AAAA,EAClC;AACF;;;;"}
+{"version":3,"file":"AriaAnnouncerContext.js","sources":["../src/aria-announcer/AriaAnnouncerContext.ts"],"sourcesContent":["import { type AriaAttributes, createContext } from \"react\";\n\nexport type AnnounceFnOptions = {\n  /**\n   * Assertiveness\n   */\n  ariaLive?: Exclude<AriaAttributes[\"aria-live\"], \"off\">;\n  /**\n   * How long (ms) the announcement should remain in the DOM before being removed.\n   * Defaults to the provider's ANNOUNCEMENT_TIME_IN_DOM.\n   */\n  duration?: number;\n  /**\n   * Optional named target live region.\n   * When set, announcements can be routed to a provider registered with the same target.\n   */\n  target?: string;\n};\n\nexport type AriaAnnouncer = {\n  /**\n   * TODO remove legacy `delay` arg (number) in favour of `options` (AnnounceFnOptions) as a breaking change\n   */\n  /**\n   * Announcer function\n   * @param announcement - announcement to queue for screenreader.\n   * @param legacyDelayOrOptions, deprecated `delay` or `options` for announcement\n   */\n  announce: (\n    announcement: string,\n    legacyDelayOrOptions?: number | AnnounceFnOptions,\n  ) => void;\n};\n\nexport const AriaAnnouncerContext = createContext<AriaAnnouncer | undefined>(\n  undefined,\n);\n"],"names":[],"mappings":";;AAkCO,MAAM,oBAAA,GAAuB,aAAA;AAAA,EAClC;AACF;;;;"}

package/dist-es/aria-announcer/AriaAnnouncerProvider.js

@@ -1,56 +1,73 @@
-import { jsxs, jsx } from 'react/jsx-runtime';
-import { useState, useRef, useCallback, useEffect, useMemo } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { forwardRef, useState, useRef, useCallback, useMemo } from 'react';
+import { useIsomorphicLayoutEffect } from '../utils/useIsomorphicLayoutEffect.js';
 import { AriaAnnouncerContext } from './AriaAnnouncerContext.js';
+import { registerAnnouncementTarget } from './announcementRegistry.js';
 
-const ARIA_ANNOUNCE_DELAY = 150;
-function AriaAnnouncerProvider({
-  children,
-  style
-}) {
-  const [currentAnnouncement, setCurrentAnnouncement] = useState("");
-  const announcementsRef = useRef([]);
-  const isAnnouncingRef = useRef(false);
-  const mountedRef = useRef(true);
-  const announceAll = useCallback(() => {
-    isAnnouncingRef.current = true;
-    if (mountedRef.current) {
-      setCurrentAnnouncement("");
-      requestAnimationFrame(() => {
-        if (mountedRef.current && announcementsRef.current.length) {
-          const announcement = announcementsRef.current.shift();
-          setCurrentAnnouncement(announcement);
-          setTimeout(() => {
-            announceAll();
-          }, ARIA_ANNOUNCE_DELAY);
-        } else {
-          isAnnouncingRef.current = false;
-        }
-      });
+const ANNOUNCEMENT_TIME_IN_DOM = 300;
+const AnnouncementRegion = forwardRef(function AnnouncementRegion2(props, ref) {
+  return /* @__PURE__ */ jsx(
+    "div",
+    {
+      "aria-atomic": false,
+      ref,
+      ...props
     }
-  }, []);
-  const announce = useCallback(
-    (announcement) => {
-      announcementsRef.current.push(announcement);
-      if (!isAnnouncingRef.current) {
-        announceAll();
+  );
+});
+const AriaAnnouncerProvider = forwardRef(function AriaAnnouncerProvider2({ children, style, target, ...rest }, ref) {
+  const [politeAnnouncements, setPoliteAnnouncements] = useState([]);
+  const [assertiveAnnouncements, setAssertiveAnnouncements] = useState([]);
+  const idCounterRef = useRef(0);
+  const makeAnnouncement = useCallback(
+    (message, assertiveness = "polite", duration = ANNOUNCEMENT_TIME_IN_DOM) => {
+      idCounterRef.current += 1;
+      const id = `announce-${assertiveness}-${Date.now()}-${idCounterRef.current}`;
+      if (assertiveness === "polite") {
+        setPoliteAnnouncements((previous) => {
+          return previous.concat({ id, message });
+        });
+        setTimeout(() => {
+          setPoliteAnnouncements(
+            (previous) => previous.filter((announcement) => announcement.id !== id)
+          );
+        }, duration);
+      } else {
+        setAssertiveAnnouncements((previous) => {
+          return previous.concat({ id, message });
+        });
+        setTimeout(() => {
+          setAssertiveAnnouncements(
+            (previous) => previous.filter((announcement) => announcement.id !== id)
+          );
+        }, duration);
       }
     },
-    [announceAll]
+    []
+  );
+  const announce = useCallback(
+    (announcement, legacyDelayOrOptions = {}) => {
+      const options = typeof legacyDelayOrOptions === "object" && legacyDelayOrOptions ? legacyDelayOrOptions : {};
+      makeAnnouncement(
+        announcement,
+        options.ariaLive,
+        options.duration ?? ANNOUNCEMENT_TIME_IN_DOM
+      );
+    },
+    [makeAnnouncement]
   );
-  useEffect(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
   const value = useMemo(() => ({ announce }), [announce]);
+  useIsomorphicLayoutEffect(() => {
+    if (!target) {
+      return;
+    }
+    return registerAnnouncementTarget(target, announce);
+  }, [announce, target]);
   return /* @__PURE__ */ jsxs(AriaAnnouncerContext.Provider, { value, children: [
     children,
-    /* @__PURE__ */ jsx(
+    /* @__PURE__ */ jsxs(
       "div",
       {
-        "aria-atomic": "true",
-        "aria-live": "assertive",
         style: {
           position: "absolute",
           height: 1,
@@ -63,11 +80,16 @@ function AriaAnnouncerProvider({
           borderWidth: 0,
           ...style
         },
-        children: currentAnnouncement
+        ...rest,
+        ref,
+        children: [
+          /* @__PURE__ */ jsx(AnnouncementRegion, { "aria-live": "polite", children: politeAnnouncements.map((announcement) => /* @__PURE__ */ jsx("div", { children: announcement.message }, `polite-${announcement.id}`)) }),
+          /* @__PURE__ */ jsx(AnnouncementRegion, { "aria-live": "assertive", children: assertiveAnnouncements.map((announcement) => /* @__PURE__ */ jsx("div", { children: announcement.message }, `assertive-${announcement.id}`)) })
+        ]
       }
     )
   ] });
-}
+});
 
-export { ARIA_ANNOUNCE_DELAY, AriaAnnouncerProvider };
+export { ANNOUNCEMENT_TIME_IN_DOM, AriaAnnouncerProvider };
 //# sourceMappingURL=AriaAnnouncerProvider.js.map

package/dist-es/aria-announcer/AriaAnnouncerProvider.js.map

@@ -1 +1 @@
-{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n  type CSSProperties,\n  type ReactNode,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\n\nimport { AriaAnnouncerContext } from \"./AriaAnnouncerContext\";\n\nexport const ARIA_ANNOUNCE_DELAY = 150;\n\nexport interface AriaAnnouncerProviderProps {\n  children?: ReactNode;\n  /**\n   * Style overrides for the aria-live element\n   */\n  style?: CSSProperties;\n}\n\nexport function AriaAnnouncerProvider({\n  children,\n  style,\n}: AriaAnnouncerProviderProps) {\n  // announcement that gets rendered inside aria-live and read out by screen readers\n  const [currentAnnouncement, setCurrentAnnouncement] = useState(\"\");\n  // queue that stores all the requested announcements\n  const announcementsRef = useRef<string[]>([]);\n  // we use this variable to decide whether to start the announcement queue if one is not already in progress\n  const isAnnouncingRef = useRef(false);\n  // we need to keep track of the state of the component mount since all the async function calls\n  // might trigger a setState after a component has been unmounted\n  const mountedRef = useRef(true);\n\n  // announceAll will get called recursively until all the announcements are rendered and cleared from the queue\n  const announceAll = useCallback(() => {\n    isAnnouncingRef.current = true;\n    if (mountedRef.current) {\n      setCurrentAnnouncement(\"\");\n      requestAnimationFrame(() => {\n        if (mountedRef.current && announcementsRef.current.length) {\n          const announcement = announcementsRef.current.shift() as string;\n          setCurrentAnnouncement(announcement);\n          setTimeout(() => {\n            announceAll();\n          }, ARIA_ANNOUNCE_DELAY);\n        } else {\n          isAnnouncingRef.current = false;\n        }\n      });\n    }\n  }, []);\n\n  const announce = useCallback(\n    (announcement: string) => {\n      announcementsRef.current.push(announcement);\n      if (!isAnnouncingRef.current) {\n        announceAll();\n      }\n    },\n    [announceAll],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  const value = useMemo(() => ({ announce }), [announce]);\n  return (\n    <AriaAnnouncerContext.Provider value={value}>\n      {children}\n      <div\n        aria-atomic=\"true\"\n        aria-live=\"assertive\"\n        // hidden styling based on https://tailwindcss.com/docs/screen-readers\n        style={{\n          position: \"absolute\",\n          height: 1,\n          width: 1,\n          padding: 0,\n          margin: -1,\n          overflow: \"hidden\",\n          clip: \"rect(0, 0, 0, 0)\",\n          whiteSpace: \"nowrap\",\n          borderWidth: 0,\n          ...style,\n        }}\n      >\n        {currentAnnouncement}\n      </div>\n    </AriaAnnouncerContext.Provider>\n  );\n}\n"],"names":[],"mappings":";;;;AAYO,MAAM,mBAAA,GAAsB;AAU5B,SAAS,qBAAA,CAAsB;AAAA,EACpC,QAAA;AAAA,EACA;AACF,CAAA,EAA+B;AAE7B,EAAA,MAAM,CAAC,mBAAA,EAAqB,sBAAsB,CAAA,GAAI,SAAS,EAAE,CAAA;AAEjE,EAAA,MAAM,gBAAA,GAAmB,MAAA,CAAiB,EAAE,CAAA;AAE5C,EAAA,MAAM,eAAA,GAAkB,OAAO,KAAK,CAAA;AAGpC,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAG9B,EAAA,MAAM,WAAA,GAAc,YAAY,MAAM;AACpC,IAAA,eAAA,CAAgB,OAAA,GAAU,IAAA;AAC1B,IAAA,IAAI,WAAW,OAAA,EAAS;AACtB,MAAA,sBAAA,CAAuB,EAAE,CAAA;AACzB,MAAA,qBAAA,CAAsB,MAAM;AAC1B,QAAA,IAAI,UAAA,CAAW,OAAA,IAAW,gBAAA,CAAiB,OAAA,CAAQ,MAAA,EAAQ;AACzD,UAAA,MAAM,YAAA,GAAe,gBAAA,CAAiB,OAAA,CAAQ,KAAA,EAAM;AACpD,UAAA,sBAAA,CAAuB,YAAY,CAAA;AACnC,UAAA,UAAA,CAAW,MAAM;AACf,YAAA,WAAA,EAAY;AAAA,UACd,GAAG,mBAAmB,CAAA;AAAA,QACxB,CAAA,MAAO;AACL,UAAA,eAAA,CAAgB,OAAA,GAAU,KAAA;AAAA,QAC5B;AAAA,MACF,CAAC,CAAA;AAAA,IACH;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,QAAA,GAAW,WAAA;AAAA,IACf,CAAC,YAAA,KAAyB;AACxB,MAAA,gBAAA,CAAiB,OAAA,CAAQ,KAAK,YAAY,CAAA;AAC1C,MAAA,IAAI,CAAC,gBAAgB,OAAA,EAAS;AAC5B,QAAA,WAAA,EAAY;AAAA,MACd;AAAA,IACF,CAAA;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,MAAM,KAAA,GAAQ,QAAQ,OAAO,EAAE,UAAS,CAAA,EAAI,CAAC,QAAQ,CAAC,CAAA;AACtD,EAAA,uBACE,IAAA,CAAC,oBAAA,CAAqB,QAAA,EAArB,EAA8B,KAAA,EAC5B,QAAA,EAAA;AAAA,IAAA,QAAA;AAAA,oBACD,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,MAAA;AAAA,QACZ,WAAA,EAAU,WAAA;AAAA,QAEV,KAAA,EAAO;AAAA,UACL,QAAA,EAAU,UAAA;AAAA,UACV,MAAA,EAAQ,CAAA;AAAA,UACR,KAAA,EAAO,CAAA;AAAA,UACP,OAAA,EAAS,CAAA;AAAA,UACT,MAAA,EAAQ,EAAA;AAAA,UACR,QAAA,EAAU,QAAA;AAAA,UACV,IAAA,EAAM,kBAAA;AAAA,UACN,UAAA,EAAY,QAAA;AAAA,UACZ,WAAA,EAAa,CAAA;AAAA,UACb,GAAG;AAAA,SACL;AAAA,QAEC,QAAA,EAAA;AAAA;AAAA;AACH,GAAA,EACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AriaAnnouncerProvider.js","sources":["../src/aria-announcer/AriaAnnouncerProvider.tsx"],"sourcesContent":["import {\n  type ComponentPropsWithRef,\n  forwardRef,\n  useCallback,\n  useMemo,\n  useRef,\n  useState,\n} from \"react\";\nimport { useIsomorphicLayoutEffect } from \"../utils/useIsomorphicLayoutEffect\";\nimport {\n  type AnnounceFnOptions,\n  AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\nimport { registerAnnouncementTarget } from \"./announcementRegistry\";\n\nexport const ANNOUNCEMENT_TIME_IN_DOM = 300; // time between DOM updates\n\nexport interface AriaAnnouncerProviderProps\n  extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Optional target key used to route announcements to this provider.\n   */\n  target?: string;\n}\n\nconst AnnouncementRegion = forwardRef<\n  HTMLDivElement,\n  ComponentPropsWithRef<\"div\">\n>(function AnnouncementRegion(props, ref) {\n  return (\n    <div\n      // Keep the region simple for maximum assistive-tech compatibility.\n      // aria-live is applied by the caller (polite/assertive).\n      aria-atomic={false}\n      ref={ref}\n      {...props}\n    />\n  );\n});\n\ntype AnnouncementMessage = {\n  id: string;\n  message: string;\n};\n\nexport const AriaAnnouncerProvider = forwardRef<\n  HTMLDivElement,\n  AriaAnnouncerProviderProps\n>(function AriaAnnouncerProvider({ children, style, target, ...rest }, ref) {\n  const [politeAnnouncements, setPoliteAnnouncements] = useState<\n    AnnouncementMessage[]\n  >([]);\n  const [assertiveAnnouncements, setAssertiveAnnouncements] = useState<\n    AnnouncementMessage[]\n  >([]);\n\n  const idCounterRef = useRef(0);\n\n  const makeAnnouncement = useCallback(\n    (\n      message: string,\n      assertiveness: \"polite\" | \"assertive\" = \"polite\",\n      duration: number = ANNOUNCEMENT_TIME_IN_DOM,\n    ) => {\n      idCounterRef.current += 1;\n      // Date.now() can collide when multiple announcements are created in the same millisecond\n      // (e.g. tests with cy.clock, batching, or multiple announces during one tick).\n      // Add a monotonic counter suffix to guarantee uniqueness.\n      const id = `announce-${assertiveness}-${Date.now()}-${idCounterRef.current}`;\n      if (assertiveness === \"polite\") {\n        setPoliteAnnouncements((previous) => {\n          return previous.concat({ id, message });\n        });\n\n        setTimeout(() => {\n          setPoliteAnnouncements((previous) =>\n            previous.filter((announcement) => announcement.id !== id),\n          );\n        }, duration);\n      } else {\n        setAssertiveAnnouncements((previous) => {\n          return previous.concat({ id, message });\n        });\n\n        setTimeout(() => {\n          setAssertiveAnnouncements((previous) =>\n            previous.filter((announcement) => announcement.id !== id),\n          );\n        }, duration);\n      }\n    },\n    [],\n  );\n\n  const announce = useCallback(\n    (\n      announcement: string,\n      legacyDelayOrOptions: number | AnnounceFnOptions | undefined = {},\n    ) => {\n      // Legacy delay (number arg) is handled by useAriaAnnouncer; if we also delayed\n      // here we'd apply it twice. Keep supporting the signature but ignore the delay.\n      const options: AnnounceFnOptions =\n        typeof legacyDelayOrOptions === \"object\" && legacyDelayOrOptions\n          ? legacyDelayOrOptions\n          : {};\n\n      makeAnnouncement(\n        announcement,\n        options.ariaLive,\n        options.duration ?? ANNOUNCEMENT_TIME_IN_DOM,\n      );\n    },\n    [makeAnnouncement],\n  );\n\n  const value = useMemo(() => ({ announce }), [announce]);\n\n  useIsomorphicLayoutEffect(() => {\n    if (!target) {\n      return;\n    }\n    return registerAnnouncementTarget(target, announce);\n  }, [announce, target]);\n\n  return (\n    <AriaAnnouncerContext.Provider value={value}>\n      {children}\n      <div\n        // hidden styling based on https://tailwindcss.com/docs/screen-readers\n        style={{\n          position: \"absolute\",\n          height: 1,\n          width: 1,\n          padding: 0,\n          margin: -1,\n          overflow: \"hidden\",\n          clip: \"rect(0, 0, 0, 0)\",\n          whiteSpace: \"nowrap\",\n          borderWidth: 0,\n          ...style,\n        }}\n        {...rest}\n        ref={ref}\n      >\n        <AnnouncementRegion aria-live=\"polite\">\n          {politeAnnouncements.map((announcement) => (\n            <div key={`polite-${announcement.id}`}>{announcement.message}</div>\n          ))}\n        </AnnouncementRegion>\n        <AnnouncementRegion aria-live=\"assertive\">\n          {assertiveAnnouncements.map((announcement) => (\n            <div key={`assertive-${announcement.id}`}>\n              {announcement.message}\n            </div>\n          ))}\n        </AnnouncementRegion>\n      </div>\n    </AriaAnnouncerContext.Provider>\n  );\n});\n"],"names":["AnnouncementRegion","AriaAnnouncerProvider"],"mappings":"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"}

package/dist-es/aria-announcer/announcementRegistry.js

@@ -0,0 +1,28 @@
+const registry = /* @__PURE__ */ new Map();
+function registerAnnouncementTarget(target, announce) {
+  const stack = registry.get(target) ?? [];
+  stack.push(announce);
+  registry.set(target, stack);
+  return () => {
+    const currentStack = registry.get(target);
+    if (!currentStack) {
+      return;
+    }
+    const index = currentStack.lastIndexOf(announce);
+    if (index !== -1) {
+      currentStack.splice(index, 1);
+    }
+    if (currentStack.length === 0) {
+      registry.delete(target);
+    } else {
+      registry.set(target, currentStack);
+    }
+  };
+}
+function getAnnouncementTarget(target) {
+  const stack = registry.get(target);
+  return stack == null ? void 0 : stack[stack.length - 1];
+}
+
+export { getAnnouncementTarget, registerAnnouncementTarget };
+//# sourceMappingURL=announcementRegistry.js.map

package/dist-es/aria-announcer/announcementRegistry.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"announcementRegistry.js","sources":["../src/aria-announcer/announcementRegistry.ts"],"sourcesContent":["import type { AnnounceFnOptions } from \"./AriaAnnouncerContext\";\n\ntype Announcer = (announcement: string, options?: AnnounceFnOptions) => void;\n\nconst registry = new Map<string, Announcer[]>();\n\nexport function registerAnnouncementTarget(\n  target: string,\n  announce: Announcer,\n): () => void {\n  const stack = registry.get(target) ?? [];\n  stack.push(announce);\n  registry.set(target, stack);\n\n  return () => {\n    const currentStack = registry.get(target);\n    if (!currentStack) {\n      return;\n    }\n\n    // Remove the most recent matching announcer first (LIFO nested providers).\n    const index = currentStack.lastIndexOf(announce);\n    if (index !== -1) {\n      currentStack.splice(index, 1);\n    }\n\n    if (currentStack.length === 0) {\n      registry.delete(target);\n    } else {\n      registry.set(target, currentStack);\n    }\n  };\n}\n\nexport function getAnnouncementTarget(target: string): Announcer | undefined {\n  const stack = registry.get(target);\n  return stack?.[stack.length - 1];\n}\n"],"names":[],"mappings":"AAIA,MAAM,QAAA,uBAAe,GAAA,EAAyB;AAEvC,SAAS,0BAAA,CACd,QACA,QAAA,EACY;AACZ,EAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,GAAA,CAAI,MAAM,KAAK,EAAC;AACvC,EAAA,KAAA,CAAM,KAAK,QAAQ,CAAA;AACnB,EAAA,QAAA,CAAS,GAAA,CAAI,QAAQ,KAAK,CAAA;AAE1B,EAAA,OAAO,MAAM;AACX,IAAA,MAAM,YAAA,GAAe,QAAA,CAAS,GAAA,CAAI,MAAM,CAAA;AACxC,IAAA,IAAI,CAAC,YAAA,EAAc;AACjB,MAAA;AAAA,IACF;AAGA,IAAA,MAAM,KAAA,GAAQ,YAAA,CAAa,WAAA,CAAY,QAAQ,CAAA;AAC/C,IAAA,IAAI,UAAU,EAAA,EAAI;AAChB,MAAA,YAAA,CAAa,MAAA,CAAO,OAAO,CAAC,CAAA;AAAA,IAC9B;AAEA,IAAA,IAAI,YAAA,CAAa,WAAW,CAAA,EAAG;AAC7B,MAAA,QAAA,CAAS,OAAO,MAAM,CAAA;AAAA,IACxB,CAAA,MAAO;AACL,MAAA,QAAA,CAAS,GAAA,CAAI,QAAQ,YAAY,CAAA;AAAA,IACnC;AAAA,EACF,CAAA;AACF;AAEO,SAAS,sBAAsB,MAAA,EAAuC;AAC3E,EAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,GAAA,CAAI,MAAM,CAAA;AACjC,EAAA,OAAO,KAAA,IAAA,IAAA,GAAA,MAAA,GAAA,KAAA,CAAQ,MAAM,MAAA,GAAS,CAAA,CAAA;AAChC;;;;"}

package/dist-es/aria-announcer/useAriaAnnouncer.js

@@ -1,25 +1,60 @@
-import { useContext, useRef, useCallback, useMemo, useEffect } from 'react';
+import { useContext, useCallback, useMemo } from 'react';
 import { debounce } from '../utils/debounce.js';
+import 'clsx';
+import 'react/jsx-runtime';
+import '../utils/useFloatingUI/useFloatingUI.js';
+import '../utils/useId.js';
+import '../salt-provider/SaltProvider.js';
+import '../viewport/ViewportProvider.js';
 import { AriaAnnouncerContext } from './AriaAnnouncerContext.js';
+import { getAnnouncementTarget } from './announcementRegistry.js';
 
+let warnedOnce = false;
+let warnedLegacyOnce = false;
 const useAriaAnnouncer = ({
   debounce: debounceInterval = 0
 } = {}) => {
   const context = useContext(AriaAnnouncerContext);
-  const mountedRef = useRef(true);
   const baseAnnounce = useCallback(
-    (announcement, delay) => {
+    (announcement, delayOrOptions = {}) => {
+      const isLegacy = typeof delayOrOptions === "number";
+      let legacyDelay;
+      let options = {};
+      if (isLegacy) {
+        legacyDelay = delayOrOptions;
+      } else {
+        options = delayOrOptions;
+      }
       const isReactAnnouncerInstalled = context == null ? void 0 : context.announce;
-      if (process.env.NODE_ENV !== "production") ;
+      if (process.env.NODE_ENV !== "production") {
+        if (legacyDelay !== void 0 && !warnedLegacyOnce) {
+          console.warn(
+            "useAriaAnnouncer `delay` prop is deprecated, use `duration` through `AnnounceFnOptions` instead."
+          );
+          warnedLegacyOnce = true;
+        }
+        if (!isReactAnnouncerInstalled && !warnedOnce) {
+          console.warn(
+            "useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider"
+          );
+          warnedOnce = true;
+        }
+      }
       function makeAnnouncement() {
-        if (mountedRef.current) {
-          if (isReactAnnouncerInstalled) {
-            context.announce(announcement);
+        if (options.target) {
+          const targetAnnouncer = getAnnouncementTarget(options.target);
+          if (targetAnnouncer) {
+            const { target: _target, ...targetOptions } = options;
+            targetAnnouncer(announcement, targetOptions);
+            return;
           }
         }
+        if (isReactAnnouncerInstalled) {
+          context.announce(announcement, isLegacy ? legacyDelay : options);
+        }
       }
-      if (delay) {
-        setTimeout(makeAnnouncement, delay);
+      if (legacyDelay) {
+        setTimeout(makeAnnouncement, legacyDelay);
       } else {
         makeAnnouncement();
       }
@@ -30,20 +65,13 @@ const useAriaAnnouncer = ({
     () => debounceInterval > 0 ? debounce(baseAnnounce, debounceInterval) : baseAnnounce,
     [baseAnnounce, debounceInterval]
   );
-  const ariaAnnouncer = useMemo(
+  return useMemo(
     () => ({
       ...context,
       announce
     }),
     [context, announce]
   );
-  useEffect(() => {
-    mountedRef.current = true;
-    return () => {
-      mountedRef.current = false;
-    };
-  }, []);
-  return ariaAnnouncer;
 };
 
 export { useAriaAnnouncer };

package/dist-es/aria-announcer/useAriaAnnouncer.js.map

@@ -1 +1 @@
-{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useEffect, useMemo, useRef } from \"react\";\nimport { debounce } from \"../utils/debounce\";\nimport {\n  type AriaAnnouncer,\n  AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\n\nexport type useAnnouncerOptions = {\n  debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n  options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n  debounce: debounceInterval = 0,\n} = {}) => {\n  const context = useContext(AriaAnnouncerContext);\n  const mountedRef = useRef(true);\n  const baseAnnounce = useCallback(\n    (announcement: string, delay?: number) => {\n      const isReactAnnouncerInstalled = context?.announce;\n\n      if (process.env.NODE_ENV !== \"production\") {\n        if (isReactAnnouncerInstalled && warnedOnce) {\n          console.warn(\n            \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n          );\n          warnedOnce = true;\n        }\n      }\n\n      function makeAnnouncement() {\n        if (mountedRef.current) {\n          if (isReactAnnouncerInstalled) {\n            context.announce(announcement);\n          }\n        }\n      }\n\n      if (delay) {\n        setTimeout(makeAnnouncement, delay);\n      } else {\n        makeAnnouncement();\n      }\n    },\n    [context],\n  );\n\n  const announce = useMemo(\n    () =>\n      debounceInterval > 0\n        ? debounce(baseAnnounce, debounceInterval)\n        : baseAnnounce,\n    [baseAnnounce, debounceInterval],\n  );\n\n  const ariaAnnouncer = useMemo(\n    () => ({\n      ...context,\n      announce,\n    }),\n    [context, announce],\n  );\n\n  useEffect(() => {\n    mountedRef.current = true;\n    return () => {\n      mountedRef.current = false;\n    };\n  }, []);\n\n  return ariaAnnouncer;\n};\n"],"names":[],"mappings":";;;;AAgBO,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAA,GAAmB;AAC/B,CAAA,GAAI,EAAC,KAAM;AACT,EAAA,MAAM,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAC/C,EAAA,MAAM,UAAA,GAAa,OAAO,IAAI,CAAA;AAC9B,EAAA,MAAM,YAAA,GAAe,WAAA;AAAA,IACnB,CAAC,cAAsB,KAAA,KAAmB;AACxC,MAAA,MAAM,4BAA4B,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAS,QAAA;AAE3C,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AAS3C,MAAA,SAAS,gBAAA,GAAmB;AAC1B,QAAA,IAAI,WAAW,OAAA,EAAS;AACtB,UAAA,IAAI,yBAAA,EAA2B;AAC7B,YAAA,OAAA,CAAQ,SAAS,YAAY,CAAA;AAAA,UAC/B;AAAA,QACF;AAAA,MACF;AAEA,MAAA,IAAI,KAAA,EAAO;AACT,QAAA,UAAA,CAAW,kBAAkB,KAAK,CAAA;AAAA,MACpC,CAAA,MAAO;AACL,QAAA,gBAAA,EAAiB;AAAA,MACnB;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,MACE,gBAAA,GAAmB,CAAA,GACf,QAAA,CAAS,YAAA,EAAc,gBAAgB,CAAA,GACvC,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB;AAAA,GACjC;AAEA,EAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,IACpB,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,GACpB;AAEA,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,UAAA,CAAW,OAAA,GAAU,IAAA;AACrB,IAAA,OAAO,MAAM;AACX,MAAA,UAAA,CAAW,OAAA,GAAU,KAAA;AAAA,IACvB,CAAA;AAAA,EACF,CAAA,EAAG,EAAE,CAAA;AAEL,EAAA,OAAO,aAAA;AACT;;;;"}
+{"version":3,"file":"useAriaAnnouncer.js","sources":["../src/aria-announcer/useAriaAnnouncer.ts"],"sourcesContent":["import { useCallback, useContext, useMemo } from \"react\";\nimport { debounce } from \"../utils\";\nimport {\n  type AnnounceFnOptions,\n  type AriaAnnouncer,\n  AriaAnnouncerContext,\n} from \"./AriaAnnouncerContext\";\nimport { getAnnouncementTarget } from \"./announcementRegistry\";\n\nexport type useAnnouncerOptions = {\n  debounce?: number;\n};\nexport type useAriaAnnouncerHook = (\n  options?: useAnnouncerOptions,\n) => AriaAnnouncer;\n\nlet warnedOnce = false;\nlet warnedLegacyOnce = false;\n\nexport const useAriaAnnouncer: useAriaAnnouncerHook = ({\n  debounce: debounceInterval = 0,\n} = {}) => {\n  const context = useContext(AriaAnnouncerContext);\n  const baseAnnounce = useCallback(\n    (announcement: string, delayOrOptions: number | AnnounceFnOptions = {}) => {\n      const isLegacy = typeof delayOrOptions === \"number\";\n      let legacyDelay: number | undefined;\n      let options: AnnounceFnOptions = {};\n      /** TODO remove legacy `delay` arg (number) in favour of `options` (AnnounceFnOptions) as a breaking change */\n      if (isLegacy) {\n        legacyDelay = delayOrOptions as number;\n      } else {\n        options = delayOrOptions;\n      }\n      const isReactAnnouncerInstalled = context?.announce;\n\n      if (process.env.NODE_ENV !== \"production\") {\n        if (legacyDelay !== undefined && !warnedLegacyOnce) {\n          console.warn(\n            \"useAriaAnnouncer `delay` prop is deprecated, use `duration` through `AnnounceFnOptions` instead.\",\n          );\n          warnedLegacyOnce = true;\n        }\n        if (!isReactAnnouncerInstalled && !warnedOnce) {\n          console.warn(\n            \"useAriaAnnouncer is being used without an AriaAnnouncerProvider. Your application should be wrapped in an AriaAnnouncerProvider\",\n          );\n          warnedOnce = true;\n        }\n      }\n\n      function makeAnnouncement() {\n        if (options.target) {\n          const targetAnnouncer = getAnnouncementTarget(options.target);\n          if (targetAnnouncer) {\n            const { target: _target, ...targetOptions } = options;\n            targetAnnouncer(announcement, targetOptions);\n            return;\n          }\n        }\n\n        // Allow announcements from component cleanup.\n        // React runs effect cleanups in parent->child ordering, so gating announcements on a\n        // hook-level mounted flag can incorrectly block announcements that occur during unmount\n        // (e.g. Spinner completionAnnouncement).\n        if (isReactAnnouncerInstalled) {\n          context.announce(announcement, isLegacy ? legacyDelay : options);\n        }\n      }\n\n      if (legacyDelay) {\n        setTimeout(makeAnnouncement, legacyDelay);\n      } else {\n        makeAnnouncement();\n      }\n    },\n    [context],\n  );\n\n  const announce = useMemo(\n    () =>\n      debounceInterval > 0\n        ? debounce(baseAnnounce, debounceInterval)\n        : baseAnnounce,\n    [baseAnnounce, debounceInterval],\n  );\n\n  return useMemo(\n    () => ({\n      ...context,\n      announce,\n    }),\n    [context, announce],\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;AAgBA,IAAI,UAAA,GAAa,KAAA;AACjB,IAAI,gBAAA,GAAmB,KAAA;AAEhB,MAAM,mBAAyC,CAAC;AAAA,EACrD,UAAU,gBAAA,GAAmB;AAC/B,CAAA,GAAI,EAAC,KAAM;AACT,EAAA,MAAM,OAAA,GAAU,WAAW,oBAAoB,CAAA;AAC/C,EAAA,MAAM,YAAA,GAAe,WAAA;AAAA,IACnB,CAAC,YAAA,EAAsB,cAAA,GAA6C,EAAC,KAAM;AACzE,MAAA,MAAM,QAAA,GAAW,OAAO,cAAA,KAAmB,QAAA;AAC3C,MAAA,IAAI,WAAA;AACJ,MAAA,IAAI,UAA6B,EAAC;AAElC,MAAA,IAAI,QAAA,EAAU;AACZ,QAAA,WAAA,GAAc,cAAA;AAAA,MAChB,CAAA,MAAO;AACL,QAAA,OAAA,GAAU,cAAA;AAAA,MACZ;AACA,MAAA,MAAM,4BAA4B,OAAA,IAAA,IAAA,GAAA,MAAA,GAAA,OAAA,CAAS,QAAA;AAE3C,MAAA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AACzC,QAAA,IAAI,WAAA,KAAgB,MAAA,IAAa,CAAC,gBAAA,EAAkB;AAClD,UAAA,OAAA,CAAQ,IAAA;AAAA,YACN;AAAA,WACF;AACA,UAAA,gBAAA,GAAmB,IAAA;AAAA,QACrB;AACA,QAAA,IAAI,CAAC,yBAAA,IAA6B,CAAC,UAAA,EAAY;AAC7C,UAAA,OAAA,CAAQ,IAAA;AAAA,YACN;AAAA,WACF;AACA,UAAA,UAAA,GAAa,IAAA;AAAA,QACf;AAAA,MACF;AAEA,MAAA,SAAS,gBAAA,GAAmB;AAC1B,QAAA,IAAI,QAAQ,MAAA,EAAQ;AAClB,UAAA,MAAM,eAAA,GAAkB,qBAAA,CAAsB,OAAA,CAAQ,MAAM,CAAA;AAC5D,UAAA,IAAI,eAAA,EAAiB;AACnB,YAAA,MAAM,EAAE,MAAA,EAAQ,OAAA,EAAS,GAAG,eAAc,GAAI,OAAA;AAC9C,YAAA,eAAA,CAAgB,cAAc,aAAa,CAAA;AAC3C,YAAA;AAAA,UACF;AAAA,QACF;AAMA,QAAA,IAAI,yBAAA,EAA2B;AAC7B,UAAA,OAAA,CAAQ,QAAA,CAAS,YAAA,EAAc,QAAA,GAAW,WAAA,GAAc,OAAO,CAAA;AAAA,QACjE;AAAA,MACF;AAEA,MAAA,IAAI,WAAA,EAAa;AACf,QAAA,UAAA,CAAW,kBAAkB,WAAW,CAAA;AAAA,MAC1C,CAAA,MAAO;AACL,QAAA,gBAAA,EAAiB;AAAA,MACnB;AAAA,IACF,CAAA;AAAA,IACA,CAAC,OAAO;AAAA,GACV;AAEA,EAAA,MAAM,QAAA,GAAW,OAAA;AAAA,IACf,MACE,gBAAA,GAAmB,CAAA,GACf,QAAA,CAAS,YAAA,EAAc,gBAAgB,CAAA,GACvC,YAAA;AAAA,IACN,CAAC,cAAc,gBAAgB;AAAA,GACjC;AAEA,EAAA,OAAO,OAAA;AAAA,IACL,OAAO;AAAA,MACL,GAAG,OAAA;AAAA,MACH;AAAA,KACF,CAAA;AAAA,IACA,CAAC,SAAS,QAAQ;AAAA,GACpB;AACF;;;;"}

package/dist-es/index.js

@@ -4,7 +4,7 @@ export { AccordionHeader } from './accordion/AccordionHeader.js';
 export { AccordionPanel } from './accordion/AccordionPanel.js';
 export { AriaAnnounce } from './aria-announcer/AriaAnnounce.js';
 export { AriaAnnouncerContext } from './aria-announcer/AriaAnnouncerContext.js';
-export { ARIA_ANNOUNCE_DELAY, AriaAnnouncerProvider } from './aria-announcer/AriaAnnouncerProvider.js';
+export { ANNOUNCEMENT_TIME_IN_DOM, AriaAnnouncerProvider } from './aria-announcer/AriaAnnouncerProvider.js';
 export { useAriaAnnouncer } from './aria-announcer/useAriaAnnouncer.js';
 export { Avatar } from './avatar/Avatar.js';
 export { useAvatarImage } from './avatar/useAvatarImage.js';
@@ -88,6 +88,7 @@ export { LinearProgress } from './progress/LinearProgress/LinearProgress.js';
 export { RadioButton } from './radio-button/RadioButton.js';
 export { RadioButtonGroup } from './radio-button/RadioButtonGroup.js';
 export { RadioButtonIcon } from './radio-button/RadioButtonIcon.js';
+export { Rating } from './rating/Rating.js';
 export { BreakpointContext, DEFAULT_DENSITY, DensityContext, SaltProvider, SaltProviderNext, ThemeContext, UNSTABLE_SaltProviderNext, useBreakpoints, useDensity, useTheme } from './salt-provider/SaltProvider.js';
 export { Scrim } from './scrim/Scrim.js';
 export { SegmentedButtonGroup } from './segmented-button-group/SegmentedButtonGroup.js';
@@ -112,6 +113,13 @@ export { TFoot } from './table/TFoot.js';
 export { TH } from './table/TH.js';
 export { THead } from './table/THead.js';
 export { TR } from './table/TR.js';
+export { Tab } from './tabs/Tab.js';
+export { TabAction } from './tabs/TabAction.js';
+export { TabBar } from './tabs/TabBar.js';
+export { TabList } from './tabs/TabList.js';
+export { TabPanel } from './tabs/TabPanel.js';
+export { Tabs } from './tabs/Tabs.js';
+export { TabTrigger } from './tabs/TabTrigger.js';
 export { Tag } from './tag/Tag.js';
 export { Code } from './text/Code.js';
 export { Display1, Display2, Display3, Display4 } from './text/Display.js';

package/dist-es/index.js.map

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

package/dist-es/navigation-item/NavigationItem.js

@@ -28,6 +28,7 @@ const NavigationItem = forwardRef(
       level = 0,
       onExpand,
       style: styleProp,
+      "aria-controls": ariaControls,
       ...rest
     } = props;
     const targetWindow = useWindow();
@@ -65,6 +66,7 @@ const NavigationItem = forwardRef(
             ),
             render: render ?? (isLink ? void 0 : /* @__PURE__ */ jsx("button", { type: "button" })),
             "aria-expanded": isLink ? void 0 : expanded,
+            "aria-controls": ariaControls,
             onClick: handleClick,
             "aria-current": isLink && active ? "page" : void 0,
             href,

package/dist-es/navigation-item/NavigationItem.js.map

@@ -1 +1 @@
-{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n  type MouseEventHandler,\n} from \"react\";\nimport type { RenderPropsType } from \"../utils\";\nimport { makePrefixer } from \"../utils\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\nimport navigationItemCss from \"./NavigationItem.css\";\nimport { NavigationItemAction } from \"./NavigationItemAction\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Whether the navigation item is active.\n   */\n  active?: boolean;\n  /**\n   * Whether the nested group is collapsed and there is an active nested item within it.\n   */\n  blurActive?: boolean;\n  /**\n   * Whether the navigation item is expanded.\n   */\n  expanded?: boolean;\n  /**\n   * Level of nesting.\n   */\n  level?: number;\n  /**\n   * The orientation of the navigation item.\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * Whether the navigation item is a parent with nested items.\n   */\n  parent?: boolean;\n  /**\n   * Render prop to enable customisation of navigation item element.\n   */\n  render?: RenderPropsType[\"render\"];\n  /**\n   * Action to be triggered when the navigation item is expanded.\n   */\n  onExpand?: MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Href to be passed to the Link element.\n   */\n  href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n  function NavigationItem(props, ref) {\n    const {\n      active,\n      blurActive,\n      render,\n      children,\n      className,\n      expanded = false,\n      href,\n      orientation = \"horizontal\",\n      parent,\n      level = 0,\n      onExpand,\n      style: styleProp,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-navigation-item\",\n      css: navigationItemCss,\n      window: targetWindow,\n    });\n\n    const style = {\n      ...styleProp,\n      \"--saltNavigationItem-level\": `${level}`,\n    };\n\n    const isLink = href !== undefined;\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n      onExpand?.(event);\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        style={style}\n        {...rest}\n      >\n        <NavigationItemAction\n          className={clsx(\n            withBaseName(\"wrapper\"),\n            {\n              [withBaseName(\"active\")]: active || blurActive,\n              [withBaseName(\"blurActive\")]: blurActive,\n              [withBaseName(\"rootItem\")]: level === 0,\n            },\n            withBaseName(orientation),\n          )}\n          render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n          aria-expanded={isLink ? undefined : expanded}\n          onClick={handleClick}\n          aria-current={isLink && active ? \"page\" : undefined}\n          href={href}\n        >\n          <span className={withBaseName(\"label\")}>{children}</span>\n          {parent ? (\n            <ExpansionIcon expanded={expanded} orientation={orientation} />\n          ) : null}\n        </NavigationItemAction>\n      </div>\n    );\n  },\n);\n"],"names":["NavigationItem","navigationItemCss"],"mappings":";;;;;;;;;;;;;;AAsDA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA,GAAW,KAAA;AAAA,MACX,IAAA;AAAA,MACA,WAAA,GAAc,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAA,GAAQ,CAAA;AAAA,MACR,QAAA;AAAA,MACA,KAAA,EAAO,SAAA;AAAA,MACP,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,KAAA,GAAQ;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,4BAAA,EAA8B,GAAG,KAAK,CAAA;AAAA,KACxC;AAEA,IAAA,MAAM,SAAS,IAAA,KAAS,MAAA;AAExB,IAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,MAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,CAAA;AAAA,IACb,CAAA;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,KAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,IAAA;AAAA,UAAC,oBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA;AAAA,cACT,aAAa,SAAS,CAAA;AAAA,cACtB;AAAA,gBACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA,IAAU,UAAA;AAAA,gBACpC,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG,UAAA;AAAA,gBAC9B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,KAAA,KAAU;AAAA,eACxC;AAAA,cACA,aAAa,WAAW;AAAA,aAC1B;AAAA,YACA,QAAQ,MAAA,KAAW,MAAA,GAAS,yBAAY,GAAA,CAAC,QAAA,EAAA,EAAO,MAAK,QAAA,EAAS,CAAA,CAAA;AAAA,YAC9D,eAAA,EAAe,SAAS,MAAA,GAAY,QAAA;AAAA,YACpC,OAAA,EAAS,WAAA;AAAA,YACT,cAAA,EAAc,MAAA,IAAU,MAAA,GAAS,MAAA,GAAS,MAAA;AAAA,YAC1C,IAAA;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,OAAO,GAAI,QAAA,EAAS,CAAA;AAAA,cACjD,MAAA,mBACC,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB,aAA0B,CAAA,GAC3D;AAAA;AAAA;AAAA;AACN;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"NavigationItem.js","sources":["../src/navigation-item/NavigationItem.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type MouseEvent,\n  type MouseEventHandler,\n} from \"react\";\nimport type { RenderPropsType } from \"../utils\";\nimport { makePrefixer } from \"../utils\";\nimport { ExpansionIcon } from \"./ExpansionIcon\";\nimport navigationItemCss from \"./NavigationItem.css\";\nimport { NavigationItemAction } from \"./NavigationItemAction\";\n\nexport interface NavigationItemProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Whether the navigation item is active.\n   */\n  active?: boolean;\n  /**\n   * Whether the nested group is collapsed and there is an active nested item within it.\n   */\n  blurActive?: boolean;\n  /**\n   * Whether the navigation item is expanded.\n   */\n  expanded?: boolean;\n  /**\n   * Level of nesting.\n   */\n  level?: number;\n  /**\n   * The orientation of the navigation item.\n   */\n  orientation?: \"horizontal\" | \"vertical\";\n  /**\n   * Whether the navigation item is a parent with nested items.\n   */\n  parent?: boolean;\n  /**\n   * Render prop to enable customisation of navigation item element.\n   */\n  render?: RenderPropsType[\"render\"];\n  /**\n   * Action to be triggered when the navigation item is expanded.\n   */\n  onExpand?: MouseEventHandler<HTMLButtonElement>;\n  /**\n   * Href to be passed to the Link element.\n   */\n  href?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltNavigationItem\");\n\nexport const NavigationItem = forwardRef<HTMLDivElement, NavigationItemProps>(\n  function NavigationItem(props, ref) {\n    const {\n      active,\n      blurActive,\n      render,\n      children,\n      className,\n      expanded = false,\n      href,\n      orientation = \"horizontal\",\n      parent,\n      level = 0,\n      onExpand,\n      style: styleProp,\n      \"aria-controls\": ariaControls,\n      ...rest\n    } = props;\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-navigation-item\",\n      css: navigationItemCss,\n      window: targetWindow,\n    });\n\n    const style = {\n      ...styleProp,\n      \"--saltNavigationItem-level\": `${level}`,\n    };\n\n    const isLink = href !== undefined;\n\n    const handleClick = (event: MouseEvent<HTMLButtonElement>) => {\n      onExpand?.(event);\n    };\n\n    return (\n      <div\n        ref={ref}\n        className={clsx(withBaseName(), className)}\n        style={style}\n        {...rest}\n      >\n        <NavigationItemAction\n          className={clsx(\n            withBaseName(\"wrapper\"),\n            {\n              [withBaseName(\"active\")]: active || blurActive,\n              [withBaseName(\"blurActive\")]: blurActive,\n              [withBaseName(\"rootItem\")]: level === 0,\n            },\n            withBaseName(orientation),\n          )}\n          render={render ?? (isLink ? undefined : <button type=\"button\" />)}\n          aria-expanded={isLink ? undefined : expanded}\n          aria-controls={ariaControls}\n          onClick={handleClick}\n          aria-current={isLink && active ? \"page\" : undefined}\n          href={href}\n        >\n          <span className={withBaseName(\"label\")}>{children}</span>\n          {parent ? (\n            <ExpansionIcon expanded={expanded} orientation={orientation} />\n          ) : null}\n        </NavigationItemAction>\n      </div>\n    );\n  },\n);\n"],"names":["NavigationItem","navigationItemCss"],"mappings":";;;;;;;;;;;;;;AAsDA,MAAM,YAAA,GAAe,aAAa,oBAAoB,CAAA;AAE/C,MAAM,cAAA,GAAiB,UAAA;AAAA,EAC5B,SAASA,eAAAA,CAAe,KAAA,EAAO,GAAA,EAAK;AAClC,IAAA,MAAM;AAAA,MACJ,MAAA;AAAA,MACA,UAAA;AAAA,MACA,MAAA;AAAA,MACA,QAAA;AAAA,MACA,SAAA;AAAA,MACA,QAAA,GAAW,KAAA;AAAA,MACX,IAAA;AAAA,MACA,WAAA,GAAc,YAAA;AAAA,MACd,MAAA;AAAA,MACA,KAAA,GAAQ,CAAA;AAAA,MACR,QAAA;AAAA,MACA,KAAA,EAAO,SAAA;AAAA,MACP,eAAA,EAAiB,YAAA;AAAA,MACjB,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,sBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,KAAA,GAAQ;AAAA,MACZ,GAAG,SAAA;AAAA,MACH,4BAAA,EAA8B,GAAG,KAAK,CAAA;AAAA,KACxC;AAEA,IAAA,MAAM,SAAS,IAAA,KAAS,MAAA;AAExB,IAAA,MAAM,WAAA,GAAc,CAAC,KAAA,KAAyC;AAC5D,MAAA,QAAA,IAAA,IAAA,GAAA,MAAA,GAAA,QAAA,CAAW,KAAA,CAAA;AAAA,IACb,CAAA;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,GAAA;AAAA,QACA,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,KAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,IAAA;AAAA,UAAC,oBAAA;AAAA,UAAA;AAAA,YACC,SAAA,EAAW,IAAA;AAAA,cACT,aAAa,SAAS,CAAA;AAAA,cACtB;AAAA,gBACE,CAAC,YAAA,CAAa,QAAQ,CAAC,GAAG,MAAA,IAAU,UAAA;AAAA,gBACpC,CAAC,YAAA,CAAa,YAAY,CAAC,GAAG,UAAA;AAAA,gBAC9B,CAAC,YAAA,CAAa,UAAU,CAAC,GAAG,KAAA,KAAU;AAAA,eACxC;AAAA,cACA,aAAa,WAAW;AAAA,aAC1B;AAAA,YACA,QAAQ,MAAA,KAAW,MAAA,GAAS,yBAAY,GAAA,CAAC,QAAA,EAAA,EAAO,MAAK,QAAA,EAAS,CAAA,CAAA;AAAA,YAC9D,eAAA,EAAe,SAAS,MAAA,GAAY,QAAA;AAAA,YACpC,eAAA,EAAe,YAAA;AAAA,YACf,OAAA,EAAS,WAAA;AAAA,YACT,cAAA,EAAc,MAAA,IAAU,MAAA,GAAS,MAAA,GAAS,MAAA;AAAA,YAC1C,IAAA;AAAA,YAEA,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,MAAA,EAAA,EAAK,SAAA,EAAW,YAAA,CAAa,OAAO,GAAI,QAAA,EAAS,CAAA;AAAA,cACjD,MAAA,mBACC,GAAA,CAAC,aAAA,EAAA,EAAc,QAAA,EAAoB,aAA0B,CAAA,GAC3D;AAAA;AAAA;AAAA;AACN;AAAA,KACF;AAAA,EAEJ;AACF;;;;"}

package/dist-es/pagination/Pagination.js

@@ -5,6 +5,7 @@ import { clsx } from 'clsx';
 import { forwardRef, useCallback, useMemo, useRef, useEffect } from 'react';
 import { useAriaAnnouncer } from '../aria-announcer/useAriaAnnouncer.js';
 import '../aria-announcer/AriaAnnouncerContext.js';
+import '../aria-announcer/AriaAnnouncerProvider.js';
 import { makePrefixer } from '../utils/makePrefixer.js';
 import { useControlled } from '../utils/useControlled.js';
 import '../utils/useFloatingUI/useFloatingUI.js';

package/dist-es/pagination/Pagination.js.map

@@ -1 +1 @@
-{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  forwardRef,\n  type HTMLAttributes,\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport paginationCss from \"./Pagination.css\";\nimport { type PaginationContext, paginationContext } from \"./PaginationContext\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * Number of pages.\n   */\n  count: number;\n  /**\n   * Current/active page.\n   */\n  page?: number;\n  /**\n   * Default current/active page.\n   */\n  defaultPage?: number;\n  /**\n   * Callback function triggered when current page changed.\n   */\n  onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n  function Pagination(\n    {\n      className,\n      count,\n      children,\n      defaultPage = 1,\n      page: pageProp,\n      onPageChange: onPageChangeProp,\n      ...restProps\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-pagination\",\n      css: paginationCss,\n      window: targetWindow,\n    });\n\n    const [pageState, setPageState] = useControlled({\n      controlled: pageProp,\n      default: defaultPage,\n      name: \"Pagination\",\n      state: \"page\",\n    });\n\n    const onPageChange = useCallback(\n      (event: SyntheticEvent, page: number) => {\n        setPageState(page);\n        onPageChangeProp?.(event, page);\n      },\n      [onPageChangeProp],\n    );\n\n    const contextValue: PaginationContext = useMemo(\n      () => ({\n        page: pageState,\n        count,\n        onPageChange,\n      }),\n      [pageState, count, onPageChange],\n    );\n\n    const { announce } = useAriaAnnouncer();\n    const mounted = useRef<boolean>(false);\n\n    useEffect(() => {\n      if (mounted.current) {\n        announce(`Page ${pageState}`);\n      } else {\n        mounted.current = true;\n      }\n    }, [announce, pageState]);\n\n    if (count < 2) {\n      return null;\n    }\n\n    return (\n      <Provider value={contextValue}>\n        <nav\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...restProps}\n        >\n          {children}\n        </nav>\n      </Provider>\n    );\n  },\n);\n"],"names":["Pagination","paginationCss"],"mappings":";;;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAElD,MAAM,EAAE,UAAS,GAAI,iBAAA;AAqBd,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP;AAAA,IACE,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA,GAAc,CAAA;AAAA,IACd,IAAA,EAAM,QAAA;AAAA,IACN,YAAA,EAAc,gBAAA;AAAA,IACd,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,iBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,aAAA,CAAc;AAAA,MAC9C,UAAA,EAAY,QAAA;AAAA,MACZ,OAAA,EAAS,WAAA;AAAA,MACT,IAAA,EAAM,YAAA;AAAA,MACN,KAAA,EAAO;AAAA,KACR,CAAA;AAED,IAAA,MAAM,YAAA,GAAe,WAAA;AAAA,MACnB,CAAC,OAAuB,IAAA,KAAiB;AACvC,QAAA,YAAA,CAAa,IAAI,CAAA;AACjB,QAAA,gBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,gBAAA,CAAmB,KAAA,EAAO,IAAA,CAAA;AAAA,MAC5B,CAAA;AAAA,MACA,CAAC,gBAAgB;AAAA,KACnB;AAEA,IAAA,MAAM,YAAA,GAAkC,OAAA;AAAA,MACtC,OAAO;AAAA,QACL,IAAA,EAAM,SAAA;AAAA,QACN,KAAA;AAAA,QACA;AAAA,OACF,CAAA;AAAA,MACA,CAAC,SAAA,EAAW,KAAA,EAAO,YAAY;AAAA,KACjC;AAEA,IAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AACtC,IAAA,MAAM,OAAA,GAAU,OAAgB,KAAK,CAAA;AAErC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,QAAA,QAAA,CAAS,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAE,CAAA;AAAA,MAC9B,CAAA,MAAO;AACL,QAAA,OAAA,CAAQ,OAAA,GAAU,IAAA;AAAA,MACpB;AAAA,IACF,CAAA,EAAG,CAAC,QAAA,EAAU,SAAS,CAAC,CAAA;AAExB,IAAA,IAAI,QAAQ,CAAA,EAAG;AACb,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAO,YAAA,EACf,QAAA,kBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH;AAAA;AAAA,KACH,EACF,CAAA;AAAA,EAEJ;AACF;;;;"}
+{"version":3,"file":"Pagination.js","sources":["../src/pagination/Pagination.tsx"],"sourcesContent":["import { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  forwardRef,\n  type HTMLAttributes,\n  type SyntheticEvent,\n  useCallback,\n  useEffect,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { useAriaAnnouncer } from \"../aria-announcer\";\nimport { makePrefixer, useControlled } from \"../utils\";\nimport paginationCss from \"./Pagination.css\";\nimport { type PaginationContext, paginationContext } from \"./PaginationContext\";\n\nconst withBaseName = makePrefixer(\"saltPagination\");\n\nconst { Provider } = paginationContext;\n\nexport interface PaginationProps extends HTMLAttributes<HTMLElement> {\n  /**\n   * Number of pages.\n   */\n  count: number;\n  /**\n   * Current/active page.\n   */\n  page?: number;\n  /**\n   * Default current/active page.\n   */\n  defaultPage?: number;\n  /**\n   * Callback function triggered when current page changed.\n   */\n  onPageChange?: (event: SyntheticEvent, page: number) => void;\n}\n\nexport const Pagination = forwardRef<HTMLElement, PaginationProps>(\n  function Pagination(\n    {\n      className,\n      count,\n      children,\n      defaultPage = 1,\n      page: pageProp,\n      onPageChange: onPageChangeProp,\n      ...restProps\n    },\n    ref,\n  ) {\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-pagination\",\n      css: paginationCss,\n      window: targetWindow,\n    });\n\n    const [pageState, setPageState] = useControlled({\n      controlled: pageProp,\n      default: defaultPage,\n      name: \"Pagination\",\n      state: \"page\",\n    });\n\n    const onPageChange = useCallback(\n      (event: SyntheticEvent, page: number) => {\n        setPageState(page);\n        onPageChangeProp?.(event, page);\n      },\n      [onPageChangeProp],\n    );\n\n    const contextValue: PaginationContext = useMemo(\n      () => ({\n        page: pageState,\n        count,\n        onPageChange,\n      }),\n      [pageState, count, onPageChange],\n    );\n\n    const { announce } = useAriaAnnouncer();\n    const mounted = useRef<boolean>(false);\n\n    useEffect(() => {\n      if (mounted.current) {\n        announce(`Page ${pageState}`);\n      } else {\n        mounted.current = true;\n      }\n    }, [announce, pageState]);\n\n    if (count < 2) {\n      return null;\n    }\n\n    return (\n      <Provider value={contextValue}>\n        <nav\n          className={clsx(withBaseName(), className)}\n          ref={ref}\n          {...restProps}\n        >\n          {children}\n        </nav>\n      </Provider>\n    );\n  },\n);\n"],"names":["Pagination","paginationCss"],"mappings":";;;;;;;;;;;;;;;;;AAiBA,MAAM,YAAA,GAAe,aAAa,gBAAgB,CAAA;AAElD,MAAM,EAAE,UAAS,GAAI,iBAAA;AAqBd,MAAM,UAAA,GAAa,UAAA;AAAA,EACxB,SAASA,WAAAA,CACP;AAAA,IACE,SAAA;AAAA,IACA,KAAA;AAAA,IACA,QAAA;AAAA,IACA,WAAA,GAAc,CAAA;AAAA,IACd,IAAA,EAAM,QAAA;AAAA,IACN,YAAA,EAAc,gBAAA;AAAA,IACd,GAAG;AAAA,KAEL,GAAA,EACA;AACA,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,iBAAA;AAAA,MACR,GAAA,EAAKC,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,aAAA,CAAc;AAAA,MAC9C,UAAA,EAAY,QAAA;AAAA,MACZ,OAAA,EAAS,WAAA;AAAA,MACT,IAAA,EAAM,YAAA;AAAA,MACN,KAAA,EAAO;AAAA,KACR,CAAA;AAED,IAAA,MAAM,YAAA,GAAe,WAAA;AAAA,MACnB,CAAC,OAAuB,IAAA,KAAiB;AACvC,QAAA,YAAA,CAAa,IAAI,CAAA;AACjB,QAAA,gBAAA,IAAA,IAAA,GAAA,MAAA,GAAA,gBAAA,CAAmB,KAAA,EAAO,IAAA,CAAA;AAAA,MAC5B,CAAA;AAAA,MACA,CAAC,gBAAgB;AAAA,KACnB;AAEA,IAAA,MAAM,YAAA,GAAkC,OAAA;AAAA,MACtC,OAAO;AAAA,QACL,IAAA,EAAM,SAAA;AAAA,QACN,KAAA;AAAA,QACA;AAAA,OACF,CAAA;AAAA,MACA,CAAC,SAAA,EAAW,KAAA,EAAO,YAAY;AAAA,KACjC;AAEA,IAAA,MAAM,EAAE,QAAA,EAAS,GAAI,gBAAA,EAAiB;AACtC,IAAA,MAAM,OAAA,GAAU,OAAgB,KAAK,CAAA;AAErC,IAAA,SAAA,CAAU,MAAM;AACd,MAAA,IAAI,QAAQ,OAAA,EAAS;AACnB,QAAA,QAAA,CAAS,CAAA,KAAA,EAAQ,SAAS,CAAA,CAAE,CAAA;AAAA,MAC9B,CAAA,MAAO;AACL,QAAA,OAAA,CAAQ,OAAA,GAAU,IAAA;AAAA,MACpB;AAAA,IACF,CAAA,EAAG,CAAC,QAAA,EAAU,SAAS,CAAC,CAAA;AAExB,IAAA,IAAI,QAAQ,CAAA,EAAG;AACb,MAAA,OAAO,IAAA;AAAA,IACT;AAEA,IAAA,uBACE,GAAA,CAAC,QAAA,EAAA,EAAS,KAAA,EAAO,YAAA,EACf,QAAA,kBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,SAAA;AAAA,QAEH;AAAA;AAAA,KACH,EACF,CAAA;AAAA,EAEJ;AACF;;;;"}

package/dist-es/rating/Rating.css.js

@@ -0,0 +1,4 @@
+var css_248z = ".saltRating {\n  display: inline-flex;\n  box-sizing: border-box;\n}\n\n.saltFormField .saltRating-container {\n  height: var(--salt-size-base);\n  padding-top: calc(var(--salt-spacing-100) + var(--salt-spacing-fixed-100));\n}\n\n.saltFormField .saltRating-label {\n  min-height: var(--salt-size-base);\n  padding-top: var(--salt-spacing-100);\n}\n\n.saltRating-labelBottom {\n  flex-direction: column;\n  align-items: flex-start;\n  gap: var(--salt-spacing-75);\n}\n\n.saltRating-labelRight {\n  flex-direction: row;\n  gap: var(--salt-spacing-150);\n}\n\n.saltRating-container {\n  display: flex;\n  flex-direction: row;\n  gap: var(--salt-spacing-150);\n  flex-wrap: nowrap;\n  justify-content: flex-start;\n  padding-top: var(--salt-spacing-fixed-100);\n  padding-bottom: var(--salt-spacing-fixed-100);\n  box-sizing: border-box;\n}\n\n.saltRating-label {\n  color: var(--salt-content-primary-foreground);\n  font-family: var(--salt-text-fontFamily);\n  font-size: var(--salt-text-fontSize);\n  font-weight: var(--salt-text-fontWeight);\n  line-height: var(--salt-text-lineHeight);\n  box-sizing: border-box;\n}\n";
+
+export { css_248z as default };
+//# sourceMappingURL=Rating.css.js.map

package/dist-es/rating/Rating.css.js.map

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