@ringcentral/spring-base 1.11.2 → 1.12.0

package/chunks/index.js

@@ -0,0 +1,234 @@
+const LIVE_ANNOUNCER_ATTR = 'data-live-announcer';
+const visuallyHiddenStyleProperties = {
+    border: '0',
+    clip: 'rect(0 0 0 0)',
+    clipPath: 'inset(50%)',
+    height: '1px',
+    margin: '-1px',
+    overflow: 'hidden',
+    padding: '0',
+    position: 'absolute',
+    width: '1px',
+    whiteSpace: 'nowrap',
+};
+const applyVisuallyHiddenStyles = (el) => {
+    Object.assign(el.style, visuallyHiddenStyleProperties);
+};
+
+class RepeatStringText {
+    last = {};
+    usedZwsp = {
+        assertive: false,
+        polite: false,
+    };
+    next(politeness, message) {
+        const useZwsp = this.last[politeness] === message ? !this.usedZwsp[politeness] : false;
+        this.last[politeness] = message;
+        this.usedZwsp[politeness] = useZwsp;
+        return useZwsp ? `\u200B${message}` : message;
+    }
+    reset(politeness) {
+        const channels = politeness
+            ? [politeness]
+            : ['assertive', 'polite'];
+        for (const channel of channels) {
+            this.last[channel] = undefined;
+            this.usedZwsp[channel] = false;
+        }
+    }
+}
+class LiveAnnouncer {
+    node = null;
+    assertiveLog = null;
+    politeLog = null;
+    doc;
+    repeatText = new RepeatStringText();
+    ready = false;
+    pending = [];
+    firstDelayTimerId = null;
+    constructor(doc) {
+        this.doc = doc;
+        if (typeof doc === 'undefined' || !doc.body) {
+            return;
+        }
+        this.node = doc.createElement('div');
+        this.node.setAttribute(LIVE_ANNOUNCER_ATTR, 'true');
+        applyVisuallyHiddenStyles(this.node);
+        this.assertiveLog = this.createLog('assertive');
+        this.node.appendChild(this.assertiveLog);
+        this.politeLog = this.createLog('polite');
+        this.node.appendChild(this.politeLog);
+        doc.body.prepend(this.node);
+    }
+    isAttached() {
+        return Boolean(this.node?.isConnected);
+    }
+    createLog(ariaLive) {
+        const node = this.doc.createElement('div');
+        node.setAttribute('role', 'log');
+        node.setAttribute('aria-live', ariaLive);
+        node.setAttribute('aria-relevant', 'additions');
+        return node;
+    }
+    destroy() {
+        this.cancelFirstDelay();
+        if (!this.node) {
+            return;
+        }
+        const parent = this.node.parentNode;
+        if (parent) {
+            parent.removeChild(this.node);
+        }
+        this.node = null;
+        this.assertiveLog = null;
+        this.politeLog = null;
+        this.repeatText.reset();
+    }
+    schedule(message, politeness = 'assertive', timeout = LIVEREGION_TIMEOUT_DELAY) {
+        if (this.ready || isTestAnnounceEnvironment()) {
+            this.announce(message, politeness, timeout);
+            return;
+        }
+        this.pending.push({ message, politeness, timeout });
+        if (this.firstDelayTimerId != null) {
+            return;
+        }
+        const win = this.doc.defaultView ?? globalThis;
+        this.firstDelayTimerId = win.setTimeout(() => {
+            this.firstDelayTimerId = null;
+            this.ready = true;
+            const queued = this.pending;
+            this.pending = [];
+            for (const item of queued) {
+                this.announce(item.message, item.politeness, item.timeout);
+            }
+        }, FIRST_ANNOUNCE_DELAY_MS);
+    }
+    announce(message, politeness = 'assertive', timeout = LIVEREGION_TIMEOUT_DELAY) {
+        if (!this.node) {
+            return;
+        }
+        const node = this.doc.createElement('div');
+        if (typeof message === 'object') {
+            node.setAttribute('role', 'img');
+            node.setAttribute('aria-labelledby', message['aria-labelledby']);
+        }
+        else {
+            node.textContent = this.repeatText.next(politeness, message);
+        }
+        if (politeness === 'assertive') {
+            this.assertiveLog?.appendChild(node);
+        }
+        else {
+            this.politeLog?.appendChild(node);
+        }
+        if (message !== '') {
+            const win = this.doc.defaultView ?? globalThis;
+            win.setTimeout(() => {
+                node.remove();
+            }, timeout);
+        }
+    }
+    clear(politeness) {
+        this.pending = politeness
+            ? this.pending.filter((item) => item.politeness !== politeness)
+            : [];
+        if (!this.node) {
+            return;
+        }
+        if ((!politeness || politeness === 'assertive') && this.assertiveLog) {
+            this.assertiveLog.innerHTML = '';
+            this.repeatText.reset('assertive');
+        }
+        if ((!politeness || politeness === 'polite') && this.politeLog) {
+            this.politeLog.innerHTML = '';
+            this.repeatText.reset('polite');
+        }
+    }
+    cancelFirstDelay() {
+        if (this.firstDelayTimerId != null) {
+            const win = this.doc.defaultView ?? globalThis;
+            win.clearTimeout(this.firstDelayTimerId);
+            this.firstDelayTimerId = null;
+        }
+        this.pending = [];
+    }
+}
+const LIVEREGION_TIMEOUT_DELAY = 7000;
+const FIRST_ANNOUNCE_DELAY_MS = 100;
+const announcersByDocument = new WeakMap();
+const getLiveAnnouncer = (doc) => {
+    return announcersByDocument.get(doc) ?? null;
+};
+const ensureLiveAnnouncer = (doc) => {
+    const existing = announcersByDocument.get(doc);
+    if (existing?.isAttached()) {
+        return existing;
+    }
+    existing?.destroy();
+    const announcer = new LiveAnnouncer(doc);
+    announcersByDocument.set(doc, announcer);
+    return announcer;
+};
+const clearLiveAnnouncerRegistry = (doc) => {
+    if (doc) {
+        const announcer = announcersByDocument.get(doc);
+        announcer?.destroy();
+        announcersByDocument.delete(doc);
+        return;
+    }
+};
+const isTestAnnounceEnvironment = () => {
+    const globalObj = globalThis;
+    if (typeof globalObj.IS_REACT_ACT_ENVIRONMENT === 'boolean') {
+        return globalObj.IS_REACT_ACT_ENVIRONMENT;
+    }
+    return typeof jest !== 'undefined';
+};
+
+const resolveDocument = (doc) => {
+    if (doc) {
+        return doc;
+    }
+    if (typeof document !== 'undefined') {
+        return document;
+    }
+    return undefined;
+};
+const resolveTimeoutAndDocument = (timeoutOrOptions) => {
+    if (typeof timeoutOrOptions === 'number') {
+        return { timeout: timeoutOrOptions };
+    }
+    if (timeoutOrOptions && typeof timeoutOrOptions === 'object') {
+        return {
+            timeout: timeoutOrOptions.timeout ?? LIVEREGION_TIMEOUT_DELAY,
+            document: timeoutOrOptions.document,
+        };
+    }
+    return { timeout: LIVEREGION_TIMEOUT_DELAY };
+};
+function announce(message, politeness = 'assertive', timeoutOrOptions) {
+    const { timeout, document: optionDocument } = resolveTimeoutAndDocument(timeoutOrOptions);
+    const doc = resolveDocument(optionDocument);
+    if (!doc?.body) {
+        return;
+    }
+    const liveAnnouncer = ensureLiveAnnouncer(doc);
+    liveAnnouncer.schedule(message, politeness, timeout);
+}
+function clearAnnouncer(politeness, doc) {
+    const target = resolveDocument(doc);
+    if (!target) {
+        return;
+    }
+    getLiveAnnouncer(target)?.clear(politeness);
+}
+function destroyAnnouncer(doc) {
+    const target = resolveDocument(doc);
+    if (!target) {
+        return;
+    }
+    clearLiveAnnouncerRegistry(target);
+}
+
+export { LIVEREGION_TIMEOUT_DELAY as L, announce as a, LIVE_ANNOUNCER_ATTR as b, clearAnnouncer as c, destroyAnnouncer as d, applyVisuallyHiddenStyles as e };

package/chunks/twMerge.js

@@ -109,6 +109,9 @@ const createAriaHideOutsideController = (targets, options = {}) => {
         }
     };
     const hide = (node) => {
+        if (hiddenNodes.has(node)) {
+            return;
+        }
         const mechanism = getHideMechanism(node);
         const refCountMap = getRefCountMap(currentWindow, mechanism);
         const refCount = refCountMap.get(node) ?? 0;
@@ -214,10 +217,23 @@ const createAriaHideOutsideController = (targets, options = {}) => {
         targetNodes.add(target);
         visibleNodes.add(target);
         const path = getTargetPath(target);
-        for (const node of path) {
-            restoreHiddenNode(node);
+        const restoredAncestorIndexes = [];
+        for (let index = 0; index < path.length; index++) {
+            if (index > 0 && hiddenNodes.has(path[index])) {
+                restoredAncestorIndexes.push(index);
+            }
+            restoreHiddenNode(path[index]);
         }
         targetPaths.set(target, path);
+        for (const index of restoredAncestorIndexes) {
+            const ancestor = path[index];
+            const pathChild = path[index - 1];
+            for (const child of ancestor.children) {
+                if (child !== pathChild) {
+                    walk(child, true);
+                }
+            }
+        }
     };
     const removeTarget = (target) => {
         if (!targetNodes.delete(target)) {

package/hooks.js

@@ -1,8 +1,9 @@
 import { unstable_useEventCallback, unstable_ownerDocument, unstable_Timeout, unstable_useForkRef } from '@mui/utils';
 export { unstable_useControlled as useControlled } from '@mui/utils';
 import * as React from 'react';
-import { useState, useRef, useEffect, useCallback, useLayoutEffect, useMemo } from 'react';
+import React__default, { useState, useRef, useEffect, useCallback, useLayoutEffect, useMemo } from 'react';
 import { useWindowContext, useResponsiveContext, getMatchDetail } from './contexts.js';
+import { b as LIVE_ANNOUNCER_ATTR, e as applyVisuallyHiddenStyles, a as announce } from './chunks/index.js';
 import uniqueId from 'lodash/uniqueId';
 import { useButton as useButton$1 } from '@mui/base/useButton';
 import { c as combineProps, d as createAriaHideOutsideController, g as getRefElement, l as logInDev, o as ownerWindow } from './chunks/twMerge.js';
@@ -128,7 +129,7 @@ function useResultRef(cb) {
 }
 
 const DEFAULT_PREFIX = 'spring-id-';
-function useId(id, prefixMode) {
+function useLegacyId(id, prefixMode) {
     const { current: resultId } = useResultRef(() => {
         if (id) {
             if (prefixMode) {
@@ -140,27 +141,40 @@ function useId(id, prefixMode) {
     });
     return resultId;
 }
+const reactUseId = React__default.useId;
+function useReactId(id, prefixMode) {
+    const reactId = reactUseId();
+    if (id) {
+        return prefixMode ? `${id}-${reactId}` : id;
+    }
+    return `${DEFAULT_PREFIX}${reactId}`;
+}
+const useId = reactUseId ? useReactId : useLegacyId;
 
-const visuallyHiddenStyles = `
-  clip-path: inset(100%);
-  clip: rect(1px, 1px, 1px, 1px);
-  height: 1px;
-  overflow: hidden;
-  position: absolute;
-  white-space: nowrap;
-  width: 1px;
-`;
-const useAnnouncer = (id) => {
+const isUseAnnouncerOptions = (value) => {
+    return typeof value === 'object' && value !== null && !Array.isArray(value);
+};
+function useAnnouncer(idOrOptions, maybeOptions) {
+    const id = typeof idOrOptions === 'string' ? idOrOptions : undefined;
+    const options = isUseAnnouncerOptions(idOrOptions)
+        ? idOrOptions
+        : maybeOptions;
+    const politeness = options?.politeness ?? 'assertive';
     const _id = useId(id ? `rc-announcer-${id}` : 'rc-announcer', !id);
     const { document: targetDocument, externalWindow, globalThis: contextGlobal, } = useWindowContext();
     const win = externalWindow ?? contextGlobal;
     const ref = useRef(null);
     const lastMessageRef = useRef();
     const pendingTimerRef = useRef(null);
+    const pendingRemovalRef = useRef(null);
     const clearPendingTimer = useCallback(() => {
         pendingTimerRef.current?.();
         pendingTimerRef.current = null;
     }, []);
+    const clearPendingRemoval = useCallback(() => {
+        pendingRemovalRef.current?.();
+        pendingRemovalRef.current = null;
+    }, []);
     useEffect(() => {
         const currentDocument = targetDocument ??
             (typeof contextGlobal.document !== 'undefined'
@@ -169,18 +183,30 @@ const useAnnouncer = (id) => {
         if (!currentDocument?.body) {
             return undefined;
         }
-        const el = currentDocument.createElement('div');
-        ref.current = el;
-        el.id = _id;
-        el.setAttribute('aria-live', 'assertive');
-        el.setAttribute('aria-atomic', 'true');
-        el.setAttribute('aria-hidden', 'false');
-        el.setAttribute('data-live-announcer', 'true');
-        el.setAttribute('style', visuallyHiddenStyles);
-        currentDocument.body.appendChild(el);
+        const currentEl = ref.current;
+        const canReuseCurrentEl = currentEl?.ownerDocument === currentDocument &&
+            currentEl.id === _id &&
+            currentDocument.body.contains(currentEl);
+        const el = canReuseCurrentEl
+            ? currentEl
+            : currentDocument.createElement('div');
+        if (canReuseCurrentEl) {
+            clearPendingRemoval();
+            el.setAttribute('aria-live', politeness);
+        }
+        else {
+            ref.current = el;
+            el.id = _id;
+            el.setAttribute('aria-live', politeness);
+            el.setAttribute('aria-atomic', 'true');
+            el.setAttribute('aria-hidden', 'false');
+            el.setAttribute(LIVE_ANNOUNCER_ATTR, 'true');
+            applyVisuallyHiddenStyles(el);
+            currentDocument.body.appendChild(el);
+        }
         return () => {
             clearPendingTimer();
-            win.setTimeout(() => {
+            const timerId = win.setTimeout(() => {
                 const body = currentDocument.body;
                 if (body.contains(el)) {
                     body.removeChild(el);
@@ -188,9 +214,24 @@ const useAnnouncer = (id) => {
                 if (el === ref.current) {
                     ref.current = null;
                 }
+                if (pendingRemovalRef.current === cancelRemoval) {
+                    pendingRemovalRef.current = null;
+                }
             });
+            const cancelRemoval = () => {
+                win.clearTimeout(timerId);
+            };
+            pendingRemovalRef.current = cancelRemoval;
         };
-    }, [_id, targetDocument, contextGlobal, win, clearPendingTimer]);
+    }, [
+        _id,
+        politeness,
+        targetDocument,
+        contextGlobal,
+        win,
+        clearPendingTimer,
+        clearPendingRemoval,
+    ]);
     return useCallback((message) => {
         const el = ref.current;
         if (!el)
@@ -221,7 +262,20 @@ const useAnnouncer = (id) => {
         };
         pendingTimerRef.current = cancelTimer;
     }, [clearPendingTimer, win]);
-};
+}
+
+function useGlobalAnnouncer() {
+    const { document: targetDocument } = useWindowContext();
+    return useCallback((message, politeness = 'assertive', timeoutOrOptions) => {
+        const timeout = typeof timeoutOrOptions === 'number'
+            ? timeoutOrOptions
+            : timeoutOrOptions?.timeout;
+        announce(message, politeness, {
+            timeout,
+            document: targetDocument,
+        });
+    }, [targetDocument]);
+}
 
 function useButton(parameters) {
     const muiButtonResult = useButton$1(parameters);
@@ -287,9 +341,9 @@ const useAudio = (init) => {
         return audio;
     });
     useEffect(() => {
+        const audio = audioRef.current;
         return () => {
-            audioRef.current.srcObject = null;
-            audioRef.current = null;
+            audio.srcObject = null;
         };
     }, []);
     return audioRef.current;
@@ -1123,13 +1177,14 @@ const useKeyboardMoveFocus = ({ infinite, options = [], focusedIndexRef, onFocus
 };
 
 const MOVE_ATTR_KEY = 'data-move-focused';
+const MOVE_INDEX_ATTR_KEY = 'data-move-index';
 const useOnlyOneFocusable = ({ focusedIndexRef, containerRef, }) => {
-    const moveFocusedId = useId(MOVE_ATTR_KEY, true);
-    const getIndexElm = (toIndex) => containerRef.current?.querySelector(`[${moveFocusedId}="${toIndex}"]`);
+    const moveFocusedId = useId();
+    const getIndexElm = (toIndex) => containerRef.current?.querySelector(`[${MOVE_ATTR_KEY}="${moveFocusedId}"][${MOVE_INDEX_ATTR_KEY}="${toIndex}"]`);
     const setIndexTabIndex = (toIndex) => {
         const toElm = getIndexElm(toIndex);
         if (toElm) {
-            const prevElm = containerRef.current?.querySelector(`[${moveFocusedId}][tabindex="0"]`);
+            const prevElm = containerRef.current?.querySelector(`[${MOVE_ATTR_KEY}="${moveFocusedId}"][tabindex="0"]`);
             prevElm?.setAttribute('tabindex', '-1');
             toElm.setAttribute('tabindex', '0');
         }
@@ -1144,13 +1199,14 @@ const useOnlyOneFocusable = ({ focusedIndexRef, containerRef, }) => {
         setIndexTabIndex,
         getItemProps: (index, options) => {
             return combineProps({
-                [moveFocusedId]: index,
+                [MOVE_ATTR_KEY]: moveFocusedId,
+                [MOVE_INDEX_ATTR_KEY]: String(index),
                 tabIndex: index === focusedIndexRef.current ? 0 : -1,
                 onFocus: () => {
                     focusedIndexRef.current = index;
                     setIndexTabIndex(index);
                 },
-            }, options);
+            }, options ?? {});
         },
     };
 };
@@ -1966,4 +2022,4 @@ const useVirtuosoExternalWindow = () => {
     return undefined;
 };
 
-export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useButton, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, useVirtuosoExternalWindow, visuallyHiddenStyles };
+export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useButton, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalAnnouncer, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, useVirtuosoExternalWindow };

package/index.js

@@ -1,7 +1,8 @@
 export { configure, rcConfiguration } from './config.js';
 export { RcResponsiveContext, WindowContext, breakpointList, getMatchDetail, useResponsiveContext, useWindowContext } from './contexts.js';
-export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useButton, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, useVirtuosoExternalWindow, visuallyHiddenStyles } from './hooks.js';
+export { createGlobalListener, globalListenerEventMap, isElmEqualOrContain, isTouchEvent, moveIndexInTwoDimension, teardown, useA11yKeyEvent, useActive, useAnnouncer, useAriaHideOutside, useAudio, useBodyScrollLock, useButton, useChange, useClickAway, useDebounce, useDepsChange, useEventCallback, useEventListener, useEver, useFocusVisible, useFontLoaded, useForceUpdate, useForkRef, useGlobalAnnouncer, useGlobalListener, useHiddenTabindex, useHover, useHoverDirty, useId, useImgLoaded, useInterval, useIsFocusVisible, useKeyDownOnce, useKeyboardMoveFocus, useLongPress, useMountState, useOnLayoutReRender, useOnReRender, useOnlyOneFocusable, useOverflow, usePrevious, useRefState, useResizeObserver, useResponsiveMatch, useResultRef, useRetry, useSleep, useTabOut, useTestRunnerDetection, useThrottle, useTimeout, useTouchMouseEvent, useVirtuosoExternalWindow } from './hooks.js';
 export { unstable_ownerDocument as ownerDocument, unstable_useControlled as useControlled } from '@mui/utils';
+export { L as LIVEREGION_TIMEOUT_DELAY, a as announce, c as clearAnnouncer, d as destroyAnnouncer } from './chunks/index.js';
 export { a11yKeyboard, capitalize, checkDefaultPrevented, checkElementName, clearWindowSelection, getSelectionPosition, getTitle, globalStateClasses, isDeleteKeyboardEvent, isSuiElement, isUrl, isWebKit154, omit, outerSize, pick, preloadImg, removeClassName, runKeyHandler, setSelectionPosition, useClasses } from './utils.js';
 export { a as ariaHideOutside, b as combineClasses, c as combineProps, g as getRefElement, i as isRef, l as logInDev, o as ownerWindow, t as twMerge } from './chunks/twMerge.js';
 import 'react';

package/liveAnnouncer.js

@@ -0,0 +1 @@
+export { L as LIVEREGION_TIMEOUT_DELAY, a as announce, c as clearAnnouncer, d as destroyAnnouncer } from './chunks/index.js';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@ringcentral/spring-base",
-  "version": "1.11.2",
+  "version": "1.12.0",
   "author": "RingCentral",
   "description": "Core utilities, hooks, and foundational functionality for Spring UI components, providing essential building blocks for React applications",
   "main": "./index.js",
@@ -16,9 +16,9 @@
     "type-fest": "^2.12.2"
   },
   "peerDependencies": {
-    "@types/react": ">=17.0.3",
-    "react": ">=17.0.2",
-    "react-dom": ">=17.0.2"
+    "@types/react": "^17.0.3 || ^18.0.0 || ^19.0.0",
+    "react": "^17.0.2 || ^18.0.0 || ^19.0.0",
+    "react-dom": "^17.0.2 || ^18.0.0 || ^19.0.0"
   },
   "sideEffects": false,
   "license": "MIT",

package/src/hooks/index.d.ts

@@ -1,6 +1,7 @@
 export * from './useA11yKeyEvent';
 export * from './useActive';
 export * from './useAnnouncer';
+export * from './useGlobalAnnouncer';
 export * from './useButton';
 export * from './useAriaHideOutside';
 export * from './useAudio';

package/src/hooks/useAnnouncer/useAnnouncer.d.ts

@@ -1,2 +1,5 @@
-export declare const visuallyHiddenStyles = "\n  clip-path: inset(100%);\n  clip: rect(1px, 1px, 1px, 1px);\n  height: 1px;\n  overflow: hidden;\n  position: absolute;\n  white-space: nowrap;\n  width: 1px;\n";
-export declare const useAnnouncer: (id?: string) => (message?: string) => void;
+import type { AnnouncerPoliteness } from '../../liveAnnouncer';
+export type UseAnnouncerOptions = {
+    politeness?: AnnouncerPoliteness;
+};
+export declare function useAnnouncer(idOrOptions?: string | UseAnnouncerOptions, maybeOptions?: UseAnnouncerOptions): (message?: string) => void;

package/src/hooks/useGlobalAnnouncer/index.d.ts

@@ -0,0 +1 @@
+export * from './useGlobalAnnouncer';

package/src/hooks/useGlobalAnnouncer/useGlobalAnnouncer.d.ts

@@ -0,0 +1,5 @@
+import type { AnnounceMessage, AnnouncerPoliteness } from '../../liveAnnouncer/types';
+export type GlobalAnnounceOptions = {
+    timeout?: number;
+};
+export declare function useGlobalAnnouncer(): (message: AnnounceMessage, politeness?: AnnouncerPoliteness, timeoutOrOptions?: number | GlobalAnnounceOptions) => void;

package/src/hooks/useId/useId.d.ts

@@ -1 +1,3 @@
-export declare function useId(id?: string, prefixMode?: boolean): string;
+declare function useReactId(id?: string, prefixMode?: boolean): string;
+export declare const useId: typeof useReactId;
+export {};

package/src/hooks/useKeyboardMoveFocus/useOnlyOneFocusable.d.ts

@@ -1,11 +1,14 @@
 /// <reference types="react" />
+import type { HTMLDataAttribute } from '../../typings';
 export type UseOnlyOneFocusableParams = {
     focusedIndexRef: React.MutableRefObject<number>;
     containerRef: React.RefObject<HTMLElement>;
 };
+type MoveFocusedItemProps = Omit<React.HTMLAttributes<HTMLElement>, 'children'> & HTMLDataAttribute;
 export declare const useOnlyOneFocusable: ({ focusedIndexRef, containerRef, }: UseOnlyOneFocusableParams) => {
     moveFocusedId: string;
     focusIndex: (toIndex: number) => void;
     setIndexTabIndex: (toIndex: number) => void;
-    getItemProps: (index: number, options?: Omit<React.HTMLAttributes<HTMLElement>, 'children'>) => Omit<import("react").HTMLAttributes<HTMLElement>, "children">;
+    getItemProps: (index: number, options?: Omit<React.HTMLAttributes<HTMLElement>, 'children'>) => NonNullable<MoveFocusedItemProps>;
 };
+export {};

package/src/index.d.ts

@@ -1,5 +1,6 @@
 export * from './config';
 export * from './contexts';
 export * from './hooks';
+export * from './liveAnnouncer';
 export * from './typings';
 export * from './utils';

package/src/liveAnnouncer/LiveAnnouncer.d.ts

@@ -0,0 +1,25 @@
+import type { AnnounceMessage, AnnouncerPoliteness } from './types';
+export declare class LiveAnnouncer {
+    node: HTMLElement | null;
+    assertiveLog: HTMLElement | null;
+    politeLog: HTMLElement | null;
+    private readonly doc;
+    private readonly repeatText;
+    private ready;
+    private pending;
+    private firstDelayTimerId;
+    constructor(doc: Document);
+    isAttached(): boolean;
+    createLog(ariaLive: AnnouncerPoliteness): HTMLElement;
+    destroy(): void;
+    schedule(message: AnnounceMessage, politeness?: AnnouncerPoliteness, timeout?: number): void;
+    announce(message: AnnounceMessage, politeness?: AnnouncerPoliteness, timeout?: number): void;
+    clear(politeness?: AnnouncerPoliteness): void;
+    private cancelFirstDelay;
+}
+export declare const LIVEREGION_TIMEOUT_DELAY = 7000;
+export declare const FIRST_ANNOUNCE_DELAY_MS = 100;
+export declare const getLiveAnnouncer: (doc: Document) => LiveAnnouncer | null;
+export declare const ensureLiveAnnouncer: (doc: Document) => LiveAnnouncer;
+export declare const clearLiveAnnouncerRegistry: (doc?: Document) => void;
+export declare const isTestAnnounceEnvironment: () => boolean;

package/src/liveAnnouncer/announce.d.ts

@@ -0,0 +1,4 @@
+import type { AnnounceMessage, AnnounceOptions, AnnouncerPoliteness } from './types';
+export declare function announce(message: AnnounceMessage, politeness?: AnnouncerPoliteness, timeoutOrOptions?: number | AnnounceOptions): void;
+export declare function clearAnnouncer(politeness?: AnnouncerPoliteness, doc?: Document): void;
+export declare function destroyAnnouncer(doc?: Document): void;

package/src/liveAnnouncer/index.d.ts

@@ -0,0 +1,3 @@
+export type { AnnounceMessage, AnnounceOptions, AnnouncerPoliteness, } from './types';
+export { announce, clearAnnouncer, destroyAnnouncer } from './announce';
+export { LIVEREGION_TIMEOUT_DELAY } from './LiveAnnouncer';

package/src/liveAnnouncer/types.d.ts

@@ -0,0 +1,8 @@
+export type AnnouncerPoliteness = 'assertive' | 'polite';
+export type AnnounceMessage = string | {
+    'aria-labelledby': string;
+};
+export type AnnounceOptions = {
+    timeout?: number;
+    document?: Document;
+};

package/src/liveAnnouncer/visuallyHidden.d.ts

@@ -0,0 +1,3 @@
+export declare const LIVE_ANNOUNCER_ATTR = "data-live-announcer";
+export declare const visuallyHiddenStyleProperties: Partial<CSSStyleDeclaration>;
+export declare const applyVisuallyHiddenStyles: (el: HTMLElement) => void;