stream-chat-react 14.11.1 → 14.12.0

package/dist/es/components/AIStateIndicator/AIStateIndicator.mjs

@@ -0,0 +1,26 @@
+import { AIStates, useAIState } from "./hooks/useAIState.mjs";
+import { useChannelStateContext } from "../../context/ChannelStateContext.mjs";
+import { useTranslationContext } from "../../context/TranslationContext.mjs";
+import "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/AIStateIndicator/AIStateIndicator.tsx
+var AIStateIndicator = ({ channel: channelFromProps }) => {
+	const { t } = useTranslationContext();
+	const { channel: channelFromContext } = useChannelStateContext("AIStateIndicator");
+	const { aiState } = useAIState(channelFromProps || channelFromContext);
+	const allowedStates = {
+		[AIStates.Thinking]: t("Thinking..."),
+		[AIStates.Generating]: t("Generating...")
+	};
+	return aiState in allowedStates ? /* @__PURE__ */ jsx("div", {
+		className: "str-chat__ai-state-indicator-container",
+		children: /* @__PURE__ */ jsx("p", {
+			className: "str-chat__ai-state-indicator-text",
+			children: allowedStates[aiState]
+		})
+	}) : null;
+};
+//#endregion
+export { AIStateIndicator };
+
+//# sourceMappingURL=AIStateIndicator.mjs.map

package/dist/es/components/AIStateIndicator/AIStateIndicator.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AIStateIndicator.mjs","names":[],"sources":["../../../../src/components/AIStateIndicator/AIStateIndicator.tsx"],"sourcesContent":["import React from 'react';\nimport type { Channel } from 'stream-chat';\n\nimport { AIStates, useAIState } from './hooks/useAIState';\n\nimport { useChannelStateContext, useTranslationContext } from '../../context';\n\nexport type AIStateIndicatorProps = {\n  channel?: Channel;\n};\n\nexport const AIStateIndicator = ({\n  channel: channelFromProps,\n}: AIStateIndicatorProps) => {\n  const { t } = useTranslationContext();\n  const { channel: channelFromContext } = useChannelStateContext('AIStateIndicator');\n  const channel = channelFromProps || channelFromContext;\n  const { aiState } = useAIState(channel);\n  const allowedStates = {\n    [AIStates.Thinking]: t('Thinking...'),\n    [AIStates.Generating]: t('Generating...'),\n  };\n\n  return aiState in allowedStates ? (\n    <div className='str-chat__ai-state-indicator-container'>\n      <p className='str-chat__ai-state-indicator-text'>{allowedStates[aiState]}</p>\n    </div>\n  ) : null;\n};\n"],"mappings":";;;;;;AAWA,IAAa,oBAAoB,EAC/B,SAAS,uBACkB;CAC3B,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,EAAE,SAAS,uBAAuB,uBAAuB,kBAAkB;CAEjF,MAAM,EAAE,YAAY,WADJ,oBAAoB,kBACE;CACtC,MAAM,gBAAgB;GACnB,SAAS,WAAW,EAAE,aAAa;GACnC,SAAS,aAAa,EAAE,eAAe;CAC1C;CAEA,OAAO,WAAW,gBAChB,oBAAC,OAAD;EAAK,WAAU;YACb,oBAAC,KAAD;GAAG,WAAU;aAAqC,cAAc;EAAY,CAAA;CACzE,CAAA,IACH;AACN"}

package/dist/es/components/AIStateIndicator/hooks/useAIState.mjs

@@ -0,0 +1,44 @@
+import { useEffect, useState } from "react";
+//#region src/components/AIStateIndicator/hooks/useAIState.ts
+var AIStates = {
+	Error: "AI_STATE_ERROR",
+	ExternalSources: "AI_STATE_EXTERNAL_SOURCES",
+	Generating: "AI_STATE_GENERATING",
+	Idle: "AI_STATE_IDLE",
+	Stop: "AI_STATE_STOP",
+	Thinking: "AI_STATE_THINKING"
+};
+/**
+* A hook that returns the current state of the AI.
+* @param {Channel} channel - The channel for which we want to know the AI state.
+* @returns {{ aiState: AIState }} The current AI state for the given channel.
+*/
+var useAIState = (channel) => {
+	const [aiState, setAiState] = useState(AIStates.Idle);
+	useEffect(() => {
+		if (!channel) return;
+		const indicatorChangedListener = channel.on("ai_indicator.update", (event) => {
+			const { cid } = event;
+			const state = event.ai_state;
+			if (channel.cid === cid) setAiState(state);
+		});
+		const indicatorClearedListener = channel.on("ai_indicator.clear", (event) => {
+			const { cid } = event;
+			if (channel.cid === cid) setAiState(AIStates.Idle);
+		});
+		const indicatorStoppedListener = channel.on("ai_indicator.stop", (event) => {
+			const { cid } = event;
+			if (channel.cid === cid) setAiState(AIStates.Stop);
+		});
+		return () => {
+			indicatorChangedListener.unsubscribe();
+			indicatorClearedListener.unsubscribe();
+			indicatorStoppedListener.unsubscribe();
+		};
+	}, [channel]);
+	return { aiState };
+};
+//#endregion
+export { AIStates, useAIState };
+
+//# sourceMappingURL=useAIState.mjs.map

package/dist/es/components/AIStateIndicator/hooks/useAIState.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAIState.mjs","names":[],"sources":["../../../../../src/components/AIStateIndicator/hooks/useAIState.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\nimport type { AIState, Channel, Event } from 'stream-chat';\n\nexport const AIStates = {\n  Error: 'AI_STATE_ERROR',\n  ExternalSources: 'AI_STATE_EXTERNAL_SOURCES',\n  Generating: 'AI_STATE_GENERATING',\n  Idle: 'AI_STATE_IDLE',\n  Stop: 'AI_STATE_STOP',\n  Thinking: 'AI_STATE_THINKING',\n};\n\n/**\n * A hook that returns the current state of the AI.\n * @param {Channel} channel - The channel for which we want to know the AI state.\n * @returns {{ aiState: AIState }} The current AI state for the given channel.\n */\nexport const useAIState = (channel?: Channel): { aiState: AIState } => {\n  const [aiState, setAiState] = useState<AIState>(AIStates.Idle);\n\n  useEffect(() => {\n    if (!channel) {\n      return;\n    }\n\n    const indicatorChangedListener = channel.on('ai_indicator.update', (event: Event) => {\n      const { cid } = event;\n      const state = event.ai_state as AIState;\n      if (channel.cid === cid) {\n        setAiState(state);\n      }\n    });\n\n    const indicatorClearedListener = channel.on('ai_indicator.clear', (event) => {\n      const { cid } = event;\n      if (channel.cid === cid) {\n        setAiState(AIStates.Idle);\n      }\n    });\n\n    const indicatorStoppedListener = channel.on('ai_indicator.stop', (event) => {\n      const { cid } = event;\n      if (channel.cid === cid) {\n        setAiState(AIStates.Stop);\n      }\n    });\n\n    return () => {\n      indicatorChangedListener.unsubscribe();\n      indicatorClearedListener.unsubscribe();\n      indicatorStoppedListener.unsubscribe();\n    };\n  }, [channel]);\n\n  return { aiState };\n};\n"],"mappings":";;AAGA,IAAa,WAAW;CACtB,OAAO;CACP,iBAAiB;CACjB,YAAY;CACZ,MAAM;CACN,MAAM;CACN,UAAU;AACZ;;;;;;AAOA,IAAa,cAAc,YAA4C;CACrE,MAAM,CAAC,SAAS,cAAc,SAAkB,SAAS,IAAI;CAE7D,gBAAgB;EACd,IAAI,CAAC,SACH;EAGF,MAAM,2BAA2B,QAAQ,GAAG,wBAAwB,UAAiB;GACnF,MAAM,EAAE,QAAQ;GAChB,MAAM,QAAQ,MAAM;GACpB,IAAI,QAAQ,QAAQ,KAClB,WAAW,KAAK;EAEpB,CAAC;EAED,MAAM,2BAA2B,QAAQ,GAAG,uBAAuB,UAAU;GAC3E,MAAM,EAAE,QAAQ;GAChB,IAAI,QAAQ,QAAQ,KAClB,WAAW,SAAS,IAAI;EAE5B,CAAC;EAED,MAAM,2BAA2B,QAAQ,GAAG,sBAAsB,UAAU;GAC1E,MAAM,EAAE,QAAQ;GAChB,IAAI,QAAQ,QAAQ,KAClB,WAAW,SAAS,IAAI;EAE5B,CAAC;EAED,aAAa;GACX,yBAAyB,YAAY;GACrC,yBAAyB,YAAY;GACrC,yBAAyB,YAAY;EACvC;CACF,GAAG,CAAC,OAAO,CAAC;CAEZ,OAAO,EAAE,QAAQ;AACnB"}

package/dist/es/components/Accessibility/AriaLiveAnnouncerProvider.mjs

@@ -0,0 +1,144 @@
+import { AriaLiveOutletContext } from "./AriaLiveOutletContext.mjs";
+import { AriaLiveAnnouncerContext } from "./useAriaLiveAnnouncer.mjs";
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/Accessibility/AriaLiveAnnouncerProvider.tsx
+var LIVE_ANNOUNCEMENT_TTL_MS = 7e3;
+/**
+* Owns the aria-live announcement state and the announce() API for one logical announcer
+* (mount ONE per `Chat`). It renders no DOM region itself — the messages are painted by the
+* single active {@link AriaLiveOutlet} chosen from the registered outlet stack (innermost /
+* highest-layer wins). This is the L1 sink of the unified announcer model; see
+* `specs/a11y-react-web/decisions.md` → "Unify the aria-live announcer implementations".
+*
+* All state lives here (per provider instance), never in module scope, so multiple `Chat`
+* instances on one page never share announcements.
+*/
+var AriaLiveAnnouncerProvider = ({ children }) => {
+	const [announcementsByPriority, setAnnouncementsByPriority] = useState({
+		assertive: [],
+		polite: []
+	});
+	const nextAnnouncementIdRef = useRef(0);
+	const timeoutByAnnouncementIdRef = useRef(/* @__PURE__ */ new Map());
+	const delayTimersRef = useRef(/* @__PURE__ */ new Set());
+	const dedupeTimersByMessageRef = useRef(/* @__PURE__ */ new Map());
+	const lastRenderedMessageRef = useRef("");
+	const removeAnnouncement = useCallback((priority, id) => {
+		setAnnouncementsByPriority((currentAnnouncements) => ({
+			...currentAnnouncements,
+			[priority]: currentAnnouncements[priority].filter((announcement) => announcement.id !== id)
+		}));
+		const timeout = timeoutByAnnouncementIdRef.current.get(id);
+		if (!timeout) return;
+		clearTimeout(timeout);
+		timeoutByAnnouncementIdRef.current.delete(id);
+	}, []);
+	const emit = useCallback((message, priority) => {
+		const announcementId = nextAnnouncementIdRef.current++;
+		const renderedMessage = message === lastRenderedMessageRef.current ? `${message}​` : message;
+		lastRenderedMessageRef.current = renderedMessage;
+		setAnnouncementsByPriority((currentAnnouncements) => ({
+			...currentAnnouncements,
+			[priority]: [...currentAnnouncements[priority], {
+				id: announcementId,
+				message: renderedMessage
+			}]
+		}));
+		const timeout = setTimeout(() => {
+			removeAnnouncement(priority, announcementId);
+		}, LIVE_ANNOUNCEMENT_TTL_MS);
+		timeoutByAnnouncementIdRef.current.set(announcementId, timeout);
+	}, [removeAnnouncement]);
+	const announce = useCallback((message, options) => {
+		const { dedupeMs, delayMs, priority = "polite" } = options ?? {};
+		const emitMessage = () => {
+			if (dedupeMs) {
+				const recent = dedupeTimersByMessageRef.current;
+				if (recent.has(message)) return;
+				recent.set(message, setTimeout(() => recent.delete(message), dedupeMs));
+			}
+			emit(message, priority);
+		};
+		if (!delayMs) {
+			emitMessage();
+			return () => void 0;
+		}
+		const delayTimers = delayTimersRef.current;
+		const delayTimer = setTimeout(() => {
+			delayTimers.delete(delayTimer);
+			emitMessage();
+		}, delayMs);
+		delayTimers.add(delayTimer);
+		return () => {
+			clearTimeout(delayTimer);
+			delayTimers.delete(delayTimer);
+		};
+	}, [emit]);
+	useEffect(() => {
+		const timeoutById = timeoutByAnnouncementIdRef.current;
+		const delayTimers = delayTimersRef.current;
+		const dedupeTimers = dedupeTimersByMessageRef.current;
+		return () => {
+			for (const timeout of timeoutById.values()) clearTimeout(timeout);
+			timeoutById.clear();
+			for (const timeout of delayTimers) clearTimeout(timeout);
+			delayTimers.clear();
+			for (const timeout of dedupeTimers.values()) clearTimeout(timeout);
+			dedupeTimers.clear();
+		};
+	}, []);
+	const [outlets, setOutlets] = useState([]);
+	const registerOutlet = useCallback((id, layer) => {
+		setOutlets((currentOutlets) => [...currentOutlets, {
+			id,
+			layer
+		}]);
+	}, []);
+	const unregisterOutlet = useCallback((id) => {
+		setOutlets((currentOutlets) => currentOutlets.filter((outlet) => outlet.id !== id));
+	}, []);
+	const activeOutlet = useMemo(() => {
+		let active = null;
+		for (const outlet of outlets) if (!active || outlet.layer >= active.layer) active = outlet;
+		return active;
+	}, [outlets]);
+	const activeOutletId = activeOutlet?.id ?? null;
+	const previousActiveLayerRef = useRef(activeOutlet?.layer ?? -1);
+	useEffect(() => {
+		const currentLayer = activeOutlet?.layer ?? -1;
+		const previousLayer = previousActiveLayerRef.current;
+		previousActiveLayerRef.current = currentLayer;
+		if (currentLayer >= previousLayer) return;
+		for (const timeout of timeoutByAnnouncementIdRef.current.values()) clearTimeout(timeout);
+		timeoutByAnnouncementIdRef.current.clear();
+		lastRenderedMessageRef.current = "";
+		setAnnouncementsByPriority({
+			assertive: [],
+			polite: []
+		});
+	}, [activeOutlet]);
+	const announcerValue = useMemo(() => ({ announce }), [announce]);
+	const outletValue = useMemo(() => ({
+		activeOutletId,
+		announcementsByPriority,
+		registerOutlet,
+		unregisterOutlet
+	}), [
+		activeOutletId,
+		announcementsByPriority,
+		registerOutlet,
+		unregisterOutlet
+	]);
+	return /* @__PURE__ */ jsx(AriaLiveAnnouncerContext.Provider, {
+		value: announcerValue,
+		children: /* @__PURE__ */ jsx(AriaLiveOutletContext.Provider, {
+			value: outletValue,
+			children
+		})
+	});
+};
+//#endregion
+export { AriaLiveAnnouncerProvider };
+
+//# sourceMappingURL=AriaLiveAnnouncerProvider.mjs.map

package/dist/es/components/Accessibility/AriaLiveAnnouncerProvider.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AriaLiveAnnouncerProvider.mjs","names":[],"sources":["../../../../src/components/Accessibility/AriaLiveAnnouncerProvider.tsx"],"sourcesContent":["import type { PropsWithChildren } from 'react';\nimport React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';\n\nimport {\n  type AnnouncementsByPriority,\n  AriaLiveOutletContext,\n} from './AriaLiveOutletContext';\nimport {\n  type AriaLiveAnnounce,\n  AriaLiveAnnouncerContext,\n  type AriaLivePriority,\n} from './useAriaLiveAnnouncer';\n\n// How long an announcement node stays in the DOM before cleanup. This is NOT how long the\n// message is \"valid\" — with `aria-relevant=\"additions\"` a lingering node is never re-announced;\n// the only cost of a longer value is a few extra (visually hidden) nodes transiently. It must be\n// long enough that a polite message queued BEHIND verbose screen-reader speech (e.g. the typing\n// echo + a focused-field re-announcement) is still present when the reader reaches it — a short\n// window (~1.5s) drops those. 7s comfortably covers that.\nconst LIVE_ANNOUNCEMENT_TTL_MS = 7000;\n\ntype RegisteredOutlet = {\n  id: symbol;\n  layer: number;\n};\n\n/**\n * Owns the aria-live announcement state and the announce() API for one logical announcer\n * (mount ONE per `Chat`). It renders no DOM region itself — the messages are painted by the\n * single active {@link AriaLiveOutlet} chosen from the registered outlet stack (innermost /\n * highest-layer wins). This is the L1 sink of the unified announcer model; see\n * `specs/a11y-react-web/decisions.md` → \"Unify the aria-live announcer implementations\".\n *\n * All state lives here (per provider instance), never in module scope, so multiple `Chat`\n * instances on one page never share announcements.\n */\nexport const AriaLiveAnnouncerProvider = ({ children }: PropsWithChildren) => {\n  const [announcementsByPriority, setAnnouncementsByPriority] =\n    useState<AnnouncementsByPriority>({\n      assertive: [],\n      polite: [],\n    });\n  const nextAnnouncementIdRef = useRef(0);\n  const timeoutByAnnouncementIdRef = useRef<Map<number, ReturnType<typeof setTimeout>>>(\n    new Map(),\n  );\n  // Pending `delayMs` timers (announcements scheduled but not yet emitted). Tracked so they can\n  // be cleared on provider unmount; each call also returns a `cancel` that clears its own timer.\n  const delayTimersRef = useRef<Set<ReturnType<typeof setTimeout>>>(new Set());\n  // Messages emitted within their `dedupeMs` window (message -> expiry timer). Used to suppress\n  // an identical repeat (e.g. a StrictMode-double-invoked effect) within the window.\n  const dedupeTimersByMessageRef = useRef<Map<string, ReturnType<typeof setTimeout>>>(\n    new Map(),\n  );\n  // The exact text last rendered into a live region. Screen readers (notably VoiceOver)\n  // suppress a live-region update whose text is identical to the previous one, so repeated\n  // identical announcements (e.g. shuffling a Giphy, whose description is the constant search\n  // term) would be voiced only once. We alternate a trailing zero-width space to force a\n  // detectable change — see `announce`.\n  const lastRenderedMessageRef = useRef('');\n\n  const removeAnnouncement = useCallback((priority: AriaLivePriority, id: number) => {\n    setAnnouncementsByPriority((currentAnnouncements) => ({\n      ...currentAnnouncements,\n      [priority]: currentAnnouncements[priority].filter(\n        (announcement) => announcement.id !== id,\n      ),\n    }));\n\n    const timeout = timeoutByAnnouncementIdRef.current.get(id);\n    if (!timeout) return;\n\n    clearTimeout(timeout);\n    timeoutByAnnouncementIdRef.current.delete(id);\n  }, []);\n\n  const emit = useCallback(\n    (message: string, priority: AriaLivePriority) => {\n      const announcementId = nextAnnouncementIdRef.current++;\n\n      // Append a (silent) zero-width space (U+200B) when the text would repeat the previous\n      // render, so consecutive identical announcements still differ and are re-voiced. Because\n      // it only appends when equal to the last render, the rendered text alternates between\n      // `X` and `X` + U+200B, guaranteeing every update is a change the screen reader speaks.\n      const ZERO_WIDTH_SPACE = '\\u200B';\n      const renderedMessage =\n        message === lastRenderedMessageRef.current\n          ? `${message}${ZERO_WIDTH_SPACE}`\n          : message;\n      lastRenderedMessageRef.current = renderedMessage;\n\n      setAnnouncementsByPriority((currentAnnouncements) => ({\n        ...currentAnnouncements,\n        [priority]: [\n          ...currentAnnouncements[priority],\n          { id: announcementId, message: renderedMessage },\n        ],\n      }));\n\n      const timeout = setTimeout(() => {\n        removeAnnouncement(priority, announcementId);\n      }, LIVE_ANNOUNCEMENT_TTL_MS);\n\n      timeoutByAnnouncementIdRef.current.set(announcementId, timeout);\n    },\n    [removeAnnouncement],\n  );\n\n  const announce = useCallback<AriaLiveAnnounce>(\n    (message, options) => {\n      const { dedupeMs, delayMs, priority = 'polite' } = options ?? {};\n\n      // Emit, applying the dedupe window if requested. The check runs at EMIT time (not call\n      // time) so a delayed announcement that is cancelled before it fires never marks the message\n      // as seen — only an actually-emitted message opens the window.\n      const emitMessage = () => {\n        if (dedupeMs) {\n          const recent = dedupeTimersByMessageRef.current;\n          if (recent.has(message)) return; // identical message within the window — suppress\n          recent.set(\n            message,\n            setTimeout(() => recent.delete(message), dedupeMs),\n          );\n        }\n        emit(message, priority);\n      };\n\n      if (!delayMs) {\n        emitMessage();\n        return () => undefined;\n      }\n\n      const delayTimers = delayTimersRef.current;\n      const delayTimer = setTimeout(() => {\n        delayTimers.delete(delayTimer);\n        emitMessage();\n      }, delayMs);\n      delayTimers.add(delayTimer);\n\n      return () => {\n        clearTimeout(delayTimer);\n        delayTimers.delete(delayTimer);\n      };\n    },\n    [emit],\n  );\n\n  useEffect(() => {\n    const timeoutById = timeoutByAnnouncementIdRef.current;\n    const delayTimers = delayTimersRef.current;\n    const dedupeTimers = dedupeTimersByMessageRef.current;\n    return () => {\n      for (const timeout of timeoutById.values()) {\n        clearTimeout(timeout);\n      }\n      timeoutById.clear();\n      for (const timeout of delayTimers) {\n        clearTimeout(timeout);\n      }\n      delayTimers.clear();\n      for (const timeout of dedupeTimers.values()) {\n        clearTimeout(timeout);\n      }\n      dedupeTimers.clear();\n    };\n  }, []);\n\n  const [outlets, setOutlets] = useState<RegisteredOutlet[]>([]);\n\n  const registerOutlet = useCallback((id: symbol, layer: number) => {\n    setOutlets((currentOutlets) => [...currentOutlets, { id, layer }]);\n  }, []);\n\n  const unregisterOutlet = useCallback((id: symbol) => {\n    setOutlets((currentOutlets) => currentOutlets.filter((outlet) => outlet.id !== id));\n  }, []);\n\n  // Innermost wins: the highest layer, and among equal layers the most recently registered.\n  const activeOutlet = useMemo(() => {\n    let active: RegisteredOutlet | null = null;\n    for (const outlet of outlets) {\n      if (!active || outlet.layer >= active.layer) {\n        active = outlet;\n      }\n    }\n    return active;\n  }, [outlets]);\n  const activeOutletId = activeOutlet?.id ?? null;\n\n  // Drop pending announcements when the active outlet falls back to a LOWER layer because a higher\n  // one unmounted (e.g. a modal dialog closed). The shared announcement state otherwise re-renders\n  // into the newly active (main) outlet and the screen reader re-announces it — so messages emitted\n  // inside a dialog (e.g. option-reorder pickup/move/drop) would be voiced again after the dialog\n  // is gone. We only clear on fall-back: when a HIGHER outlet MOUNTS (a dialog opening), the state\n  // must survive so an open-time announcement still renders in the now-active dialog outlet.\n  const previousActiveLayerRef = useRef(activeOutlet?.layer ?? -1);\n  useEffect(() => {\n    const currentLayer = activeOutlet?.layer ?? -1;\n    const previousLayer = previousActiveLayerRef.current;\n    previousActiveLayerRef.current = currentLayer;\n    if (currentLayer >= previousLayer) return;\n\n    for (const timeout of timeoutByAnnouncementIdRef.current.values()) {\n      clearTimeout(timeout);\n    }\n    timeoutByAnnouncementIdRef.current.clear();\n    lastRenderedMessageRef.current = '';\n    setAnnouncementsByPriority({ assertive: [], polite: [] });\n  }, [activeOutlet]);\n\n  const announcerValue = useMemo(() => ({ announce }), [announce]);\n  const outletValue = useMemo(\n    () => ({\n      activeOutletId,\n      announcementsByPriority,\n      registerOutlet,\n      unregisterOutlet,\n    }),\n    [activeOutletId, announcementsByPriority, registerOutlet, unregisterOutlet],\n  );\n\n  return (\n    <AriaLiveAnnouncerContext.Provider value={announcerValue}>\n      <AriaLiveOutletContext.Provider value={outletValue}>\n        {children}\n      </AriaLiveOutletContext.Provider>\n    </AriaLiveAnnouncerContext.Provider>\n  );\n};\n"],"mappings":"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"}

package/dist/es/components/Accessibility/AriaLiveOutlet.mjs

@@ -0,0 +1,58 @@
+import { Portal } from "../Portal/Portal.mjs";
+import { useAriaLiveOutletContext } from "./AriaLiveOutletContext.mjs";
+import { VisuallyHidden } from "../VisuallyHidden/VisuallyHidden.mjs";
+import { useCallback, useEffect, useRef } from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/Accessibility/AriaLiveOutlet.tsx
+/**
+* Dumb render target for the unified announcer. Registers itself with the nearest
+* {@link AriaLiveAnnouncerProvider} and renders the polite/assertive live regions ONLY when
+* it is the active (innermost) outlet, so exactly one region is live at a time — always in
+* the active accessibility-tree scope. Mount one at the `Chat` root and one inside each
+* `aria-modal` dialog (with a higher `layer`).
+*/
+var AriaLiveOutlet = ({ layer = 0, portal = false }) => {
+	const context = useAriaLiveOutletContext();
+	const idRef = useRef(null);
+	if (idRef.current === null) idRef.current = Symbol("aria-live-outlet");
+	const registerOutlet = context?.registerOutlet;
+	const unregisterOutlet = context?.unregisterOutlet;
+	useEffect(() => {
+		const id = idRef.current;
+		if (!id || !registerOutlet || !unregisterOutlet) return;
+		registerOutlet(id, layer);
+		return () => unregisterOutlet(id);
+	}, [
+		layer,
+		registerOutlet,
+		unregisterOutlet
+	]);
+	const getPortalDestination = useCallback(() => document.body, []);
+	if (!context || context.activeOutletId !== idRef.current) return null;
+	const { announcementsByPriority } = context;
+	const liveRegions = /* @__PURE__ */ jsxs(VisuallyHidden, { children: [/* @__PURE__ */ jsx("div", {
+		"aria-atomic": "false",
+		"aria-live": "polite",
+		"aria-relevant": "additions",
+		"data-testid": "str-chat__aria-live-region--polite",
+		role: "status",
+		children: announcementsByPriority.polite.map((announcement) => /* @__PURE__ */ jsx("div", { children: announcement.message }, announcement.id))
+	}), /* @__PURE__ */ jsx("div", {
+		"aria-atomic": "false",
+		"aria-live": "assertive",
+		"aria-relevant": "additions",
+		"data-testid": "str-chat__aria-live-region--assertive",
+		role: "alert",
+		children: announcementsByPriority.assertive.map((announcement) => /* @__PURE__ */ jsx("div", { children: announcement.message }, announcement.id))
+	})] });
+	if (!portal) return liveRegions;
+	return /* @__PURE__ */ jsx(Portal, {
+		getPortalDestination,
+		isOpen: true,
+		children: liveRegions
+	});
+};
+//#endregion
+export { AriaLiveOutlet };
+
+//# sourceMappingURL=AriaLiveOutlet.mjs.map

package/dist/es/components/Accessibility/AriaLiveOutlet.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AriaLiveOutlet.mjs","names":[],"sources":["../../../../src/components/Accessibility/AriaLiveOutlet.tsx"],"sourcesContent":["import React, { useCallback, useEffect, useRef } from 'react';\n\nimport { useAriaLiveOutletContext } from './AriaLiveOutletContext';\nimport { Portal } from '../Portal/Portal';\nimport { VisuallyHidden } from '../VisuallyHidden';\n\nexport type AriaLiveOutletProps = {\n  /**\n   * Stacking layer. The {@link AriaLiveAnnouncerProvider} renders into the highest-layer\n   * outlet (ties resolve to the most recently registered). Outlets inside an `aria-modal`\n   * subtree must use a layer above the root outlet so announcements land inside the modal\n   * (assistive technologies suppress live regions outside the active modal). Defaults to `0`.\n   */\n  layer?: number;\n  /**\n   * When true, render the live region into a `document.body` portal instead of in place.\n   * Use for the root outlet; modal outlets must render in place (omit) so they stay inside\n   * the `aria-modal` subtree.\n   */\n  portal?: boolean;\n};\n\n/**\n * Dumb render target for the unified announcer. Registers itself with the nearest\n * {@link AriaLiveAnnouncerProvider} and renders the polite/assertive live regions ONLY when\n * it is the active (innermost) outlet, so exactly one region is live at a time — always in\n * the active accessibility-tree scope. Mount one at the `Chat` root and one inside each\n * `aria-modal` dialog (with a higher `layer`).\n */\nexport const AriaLiveOutlet = ({ layer = 0, portal = false }: AriaLiveOutletProps) => {\n  const context = useAriaLiveOutletContext();\n\n  const idRef = useRef<symbol | null>(null);\n  if (idRef.current === null) {\n    idRef.current = Symbol('aria-live-outlet');\n  }\n\n  const registerOutlet = context?.registerOutlet;\n  const unregisterOutlet = context?.unregisterOutlet;\n\n  useEffect(() => {\n    const id = idRef.current;\n    if (!id || !registerOutlet || !unregisterOutlet) return;\n\n    registerOutlet(id, layer);\n    return () => unregisterOutlet(id);\n  }, [layer, registerOutlet, unregisterOutlet]);\n\n  const getPortalDestination = useCallback(() => document.body, []);\n\n  if (!context || context.activeOutletId !== idRef.current) return null;\n\n  const { announcementsByPriority } = context;\n\n  const liveRegions = (\n    <VisuallyHidden>\n      <div\n        aria-atomic='false'\n        aria-live='polite'\n        aria-relevant='additions'\n        data-testid='str-chat__aria-live-region--polite'\n        role='status'\n      >\n        {announcementsByPriority.polite.map((announcement) => (\n          <div key={announcement.id}>{announcement.message}</div>\n        ))}\n      </div>\n      <div\n        aria-atomic='false'\n        aria-live='assertive'\n        aria-relevant='additions'\n        data-testid='str-chat__aria-live-region--assertive'\n        role='alert'\n      >\n        {announcementsByPriority.assertive.map((announcement) => (\n          <div key={announcement.id}>{announcement.message}</div>\n        ))}\n      </div>\n    </VisuallyHidden>\n  );\n\n  if (!portal) return liveRegions;\n\n  return (\n    <Portal getPortalDestination={getPortalDestination} isOpen>\n      {liveRegions}\n    </Portal>\n  );\n};\n"],"mappings":";;;;;;;;;;;;;AA6BA,IAAa,kBAAkB,EAAE,QAAQ,GAAG,SAAS,YAAiC;CACpF,MAAM,UAAU,yBAAyB;CAEzC,MAAM,QAAQ,OAAsB,IAAI;CACxC,IAAI,MAAM,YAAY,MACpB,MAAM,UAAU,OAAO,kBAAkB;CAG3C,MAAM,iBAAiB,SAAS;CAChC,MAAM,mBAAmB,SAAS;CAElC,gBAAgB;EACd,MAAM,KAAK,MAAM;EACjB,IAAI,CAAC,MAAM,CAAC,kBAAkB,CAAC,kBAAkB;EAEjD,eAAe,IAAI,KAAK;EACxB,aAAa,iBAAiB,EAAE;CAClC,GAAG;EAAC;EAAO;EAAgB;CAAgB,CAAC;CAE5C,MAAM,uBAAuB,kBAAkB,SAAS,MAAM,CAAC,CAAC;CAEhE,IAAI,CAAC,WAAW,QAAQ,mBAAmB,MAAM,SAAS,OAAO;CAEjE,MAAM,EAAE,4BAA4B;CAEpC,MAAM,cACJ,qBAAC,gBAAD,EAAA,UAAA,CACE,oBAAC,OAAD;EACE,eAAY;EACZ,aAAU;EACV,iBAAc;EACd,eAAY;EACZ,MAAK;YAEJ,wBAAwB,OAAO,KAAK,iBACnC,oBAAC,OAAD,EAAA,UAA4B,aAAa,QAAa,GAA5C,aAAa,EAA+B,CACvD;CACE,CAAA,GACL,oBAAC,OAAD;EACE,eAAY;EACZ,aAAU;EACV,iBAAc;EACd,eAAY;EACZ,MAAK;YAEJ,wBAAwB,UAAU,KAAK,iBACtC,oBAAC,OAAD,EAAA,UAA4B,aAAa,QAAa,GAA5C,aAAa,EAA+B,CACvD;CACE,CAAA,CACS,EAAA,CAAA;CAGlB,IAAI,CAAC,QAAQ,OAAO;CAEpB,OACE,oBAAC,QAAD;EAA8B;EAAsB,QAAA;YACjD;CACK,CAAA;AAEZ"}

package/dist/es/components/Accessibility/AriaLiveOutletContext.mjs

@@ -0,0 +1,8 @@
+import { createContext, useContext } from "react";
+//#region src/components/Accessibility/AriaLiveOutletContext.ts
+var AriaLiveOutletContext = createContext(void 0);
+var useAriaLiveOutletContext = () => useContext(AriaLiveOutletContext);
+//#endregion
+export { AriaLiveOutletContext, useAriaLiveOutletContext };
+
+//# sourceMappingURL=AriaLiveOutletContext.mjs.map

package/dist/es/components/Accessibility/AriaLiveOutletContext.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"AriaLiveOutletContext.mjs","names":[],"sources":["../../../../src/components/Accessibility/AriaLiveOutletContext.ts"],"sourcesContent":["import { createContext, useContext } from 'react';\n\nimport type { AriaLivePriority } from './useAriaLiveAnnouncer';\n\nexport type LiveAnnouncement = {\n  id: number;\n  message: string;\n};\n\nexport type AnnouncementsByPriority = {\n  [key in AriaLivePriority]: LiveAnnouncement[];\n};\n\n/**\n * Internal coordination context between {@link AriaLiveAnnouncerProvider} (which owns the\n * announcement state and the outlet stack) and the {@link AriaLiveOutlet}s that render the\n * live regions. Not part of the public API — consumers announce via `useAriaLiveAnnouncer`.\n */\nexport type AriaLiveOutletContextValue = {\n  /** The id of the single outlet that should currently render the live regions. */\n  activeOutletId: symbol | null;\n  /** Current announcements grouped by aria-live priority. */\n  announcementsByPriority: AnnouncementsByPriority;\n  /** Register an outlet. Higher `layer` wins; ties resolve to the most recently registered. */\n  registerOutlet: (id: symbol, layer: number) => void;\n  unregisterOutlet: (id: symbol) => void;\n};\n\nexport const AriaLiveOutletContext = createContext<\n  AriaLiveOutletContextValue | undefined\n>(undefined);\n\nexport const useAriaLiveOutletContext = () => useContext(AriaLiveOutletContext);\n"],"mappings":";;AA4BA,IAAa,wBAAwB,cAEnC,KAAA,CAAS;AAEX,IAAa,iCAAiC,WAAW,qBAAqB"}

package/dist/es/components/Accessibility/NotificationAnnouncer.mjs

@@ -0,0 +1,87 @@
+import { useTranslationContext } from "../../context/TranslationContext.mjs";
+import { useAriaLiveAnnouncer } from "./useAriaLiveAnnouncer.mjs";
+import { useAnnouncementQueue } from "./scheduling/useAnnouncementQueue.mjs";
+import { useNotifications } from "../Notifications/hooks/useNotifications.mjs";
+import { useEffect, useRef } from "react";
+//#region src/components/Accessibility/NotificationAnnouncer.tsx
+var getAnnouncementPriority = (notification) => notification.severity === "error" ? "assertive" : "polite";
+var getSeverityLabel = (notification) => {
+	if (!notification.severity) return null;
+	return `${notification.severity[0].toUpperCase()}${notification.severity.slice(1)}`;
+};
+var getDefaultAnnouncementMessage = (notification, message) => {
+	const severityLabel = getSeverityLabel(notification);
+	if (severityLabel) return `${severityLabel} notification: ${message}`;
+	return `Notification: ${message}`;
+};
+var defaultBuildNotificationAnnouncement = ({ defaultMessage }) => defaultMessage;
+var defaultNotificationFilter = () => true;
+/**
+* Announces app notifications to assistive technology.
+*
+* As of the announcer unification this renders **no live region of its own** — it routes new
+* notifications through the shared {@link useAriaLiveAnnouncer} sink (so they land in the active
+* {@link AriaLiveOutlet}, including inside an open modal) and paces them with
+* {@link useAnnouncementQueue}.
+*
+* ## Required context (contract)
+* `NotificationAnnouncer` **must** be rendered inside an `AriaLiveAnnouncerProvider`. `Chat` mounts
+* that provider (with a root, portalled `AriaLiveOutlet`), so the default component tree already
+* satisfies this and no extra setup is needed.
+*
+* Rendered **without** a provider ancestor it mounts successfully but **announces nothing** —
+* `useAriaLiveAnnouncer()` returns a no-op and logs a `console.warn` ("… called outside of an
+* AriaLiveAnnouncerProvider"). This is intentional post-F4: the component no longer carries a
+* fallback live region, so a single announcer owns all output and there are no duplicate/competing
+* regions. If you render it outside `Chat`, wrap it in `AriaLiveAnnouncerProvider` + `AriaLiveOutlet`
+* yourself.
+*/
+var NotificationAnnouncer = ({ buildNotificationAnnouncement = defaultBuildNotificationAnnouncement, notificationFilter = defaultNotificationFilter }) => {
+	const { t } = useTranslationContext();
+	const notifications = useNotifications();
+	const { enqueue } = useAnnouncementQueue(useAriaLiveAnnouncer());
+	const initializedRef = useRef(false);
+	const seenNotificationIdsRef = useRef(/* @__PURE__ */ new Set());
+	useEffect(() => {
+		const visibleNotificationIds = new Set(notifications.map(({ id }) => id));
+		seenNotificationIdsRef.current.forEach((id) => {
+			if (!visibleNotificationIds.has(id)) seenNotificationIdsRef.current.delete(id);
+		});
+		if (!initializedRef.current) {
+			notifications.forEach(({ id }) => seenNotificationIdsRef.current.add(id));
+			initializedRef.current = true;
+			return;
+		}
+		notifications.forEach((notification) => {
+			if (seenNotificationIdsRef.current.has(notification.id)) return;
+			seenNotificationIdsRef.current.add(notification.id);
+			if (!notificationFilter(notification)) return;
+			const message = t("translationBuilderTopic/notification", {
+				notification,
+				value: notification.message
+			});
+			if (!message) return;
+			const announcementMessage = buildNotificationAnnouncement({
+				defaultMessage: getDefaultAnnouncementMessage(notification, message),
+				notification,
+				translatedMessage: message
+			});
+			if (!announcementMessage) return;
+			enqueue({
+				message: announcementMessage,
+				priority: getAnnouncementPriority(notification)
+			});
+		});
+	}, [
+		buildNotificationAnnouncement,
+		enqueue,
+		notificationFilter,
+		notifications,
+		t
+	]);
+	return null;
+};
+//#endregion
+export { NotificationAnnouncer };
+
+//# sourceMappingURL=NotificationAnnouncer.mjs.map

package/dist/es/components/Accessibility/NotificationAnnouncer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"NotificationAnnouncer.mjs","names":[],"sources":["../../../../src/components/Accessibility/NotificationAnnouncer.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react';\nimport type { Notification } from 'stream-chat';\n\nimport { useAnnouncementQueue } from './scheduling';\nimport { useAriaLiveAnnouncer } from './useAriaLiveAnnouncer';\nimport type { AriaLivePriority } from './useAriaLiveAnnouncer';\nimport { useNotifications } from '../Notifications';\nimport { useTranslationContext } from '../../context';\n\nexport type NotificationAnnouncementBuilderParams = {\n  defaultMessage: string;\n  notification: Notification;\n  translatedMessage: string;\n};\n\nexport type NotificationAnnouncementBuilder = (\n  params: NotificationAnnouncementBuilderParams,\n) => string;\nexport type NotificationAnnouncementFilter = (notification: Notification) => boolean;\n\nconst getAnnouncementPriority = (notification: Notification): AriaLivePriority =>\n  notification.severity === 'error' ? 'assertive' : 'polite';\n\nconst getSeverityLabel = (notification: Notification) => {\n  if (!notification.severity) return null;\n  return `${notification.severity[0].toUpperCase()}${notification.severity.slice(1)}`;\n};\n\nconst getDefaultAnnouncementMessage = (notification: Notification, message: string) => {\n  const severityLabel = getSeverityLabel(notification);\n\n  if (severityLabel) {\n    return `${severityLabel} notification: ${message}`;\n  }\n\n  return `Notification: ${message}`;\n};\n\nexport type NotificationAnnouncerProps = {\n  buildNotificationAnnouncement?: NotificationAnnouncementBuilder;\n  notificationFilter?: NotificationAnnouncementFilter;\n};\n\nconst defaultBuildNotificationAnnouncement: NotificationAnnouncementBuilder = ({\n  defaultMessage,\n}) => defaultMessage;\nconst defaultNotificationFilter: NotificationAnnouncementFilter = () => true;\n\n/**\n * Announces app notifications to assistive technology.\n *\n * As of the announcer unification this renders **no live region of its own** — it routes new\n * notifications through the shared {@link useAriaLiveAnnouncer} sink (so they land in the active\n * {@link AriaLiveOutlet}, including inside an open modal) and paces them with\n * {@link useAnnouncementQueue}.\n *\n * ## Required context (contract)\n * `NotificationAnnouncer` **must** be rendered inside an `AriaLiveAnnouncerProvider`. `Chat` mounts\n * that provider (with a root, portalled `AriaLiveOutlet`), so the default component tree already\n * satisfies this and no extra setup is needed.\n *\n * Rendered **without** a provider ancestor it mounts successfully but **announces nothing** —\n * `useAriaLiveAnnouncer()` returns a no-op and logs a `console.warn` (\"… called outside of an\n * AriaLiveAnnouncerProvider\"). This is intentional post-F4: the component no longer carries a\n * fallback live region, so a single announcer owns all output and there are no duplicate/competing\n * regions. If you render it outside `Chat`, wrap it in `AriaLiveAnnouncerProvider` + `AriaLiveOutlet`\n * yourself.\n */\nexport const NotificationAnnouncer = ({\n  buildNotificationAnnouncement = defaultBuildNotificationAnnouncement,\n  notificationFilter = defaultNotificationFilter,\n}: NotificationAnnouncerProps) => {\n  const { t } = useTranslationContext();\n  const notifications = useNotifications();\n  const announce = useAriaLiveAnnouncer();\n  const { enqueue } = useAnnouncementQueue(announce);\n\n  const initializedRef = useRef(false);\n  const seenNotificationIdsRef = useRef(new Set<string>());\n\n  useEffect(() => {\n    const visibleNotificationIds = new Set(notifications.map(({ id }) => id));\n\n    seenNotificationIdsRef.current.forEach((id) => {\n      if (!visibleNotificationIds.has(id)) {\n        seenNotificationIdsRef.current.delete(id);\n      }\n    });\n\n    // Do not announce notifications already present on first render.\n    if (!initializedRef.current) {\n      notifications.forEach(({ id }) => seenNotificationIdsRef.current.add(id));\n      initializedRef.current = true;\n      return;\n    }\n\n    notifications.forEach((notification) => {\n      if (seenNotificationIdsRef.current.has(notification.id)) return;\n\n      seenNotificationIdsRef.current.add(notification.id);\n      if (!notificationFilter(notification)) return;\n\n      const message = t('translationBuilderTopic/notification', {\n        notification,\n        value: notification.message,\n      });\n\n      if (!message) return;\n\n      const defaultMessage = getDefaultAnnouncementMessage(notification, message);\n      const announcementMessage = buildNotificationAnnouncement({\n        defaultMessage,\n        notification,\n        translatedMessage: message,\n      });\n\n      if (!announcementMessage) return;\n\n      enqueue({\n        message: announcementMessage,\n        priority: getAnnouncementPriority(notification),\n      });\n    });\n  }, [buildNotificationAnnouncement, enqueue, notificationFilter, notifications, t]);\n\n  return null;\n};\n"],"mappings":";;;;;;AAoBA,IAAM,2BAA2B,iBAC/B,aAAa,aAAa,UAAU,cAAc;AAEpD,IAAM,oBAAoB,iBAA+B;CACvD,IAAI,CAAC,aAAa,UAAU,OAAO;CACnC,OAAO,GAAG,aAAa,SAAS,EAAE,CAAC,YAAY,IAAI,aAAa,SAAS,MAAM,CAAC;AAClF;AAEA,IAAM,iCAAiC,cAA4B,YAAoB;CACrF,MAAM,gBAAgB,iBAAiB,YAAY;CAEnD,IAAI,eACF,OAAO,GAAG,cAAc,iBAAiB;CAG3C,OAAO,iBAAiB;AAC1B;AAOA,IAAM,wCAAyE,EAC7E,qBACI;AACN,IAAM,kCAAkE;;;;;;;;;;;;;;;;;;;;;AAsBxE,IAAa,yBAAyB,EACpC,gCAAgC,sCAChC,qBAAqB,gCACW;CAChC,MAAM,EAAE,MAAM,sBAAsB;CACpC,MAAM,gBAAgB,iBAAiB;CAEvC,MAAM,EAAE,YAAY,qBADH,qBACwB,CAAQ;CAEjD,MAAM,iBAAiB,OAAO,KAAK;CACnC,MAAM,yBAAyB,uBAAO,IAAI,IAAY,CAAC;CAEvD,gBAAgB;EACd,MAAM,yBAAyB,IAAI,IAAI,cAAc,KAAK,EAAE,SAAS,EAAE,CAAC;EAExE,uBAAuB,QAAQ,SAAS,OAAO;GAC7C,IAAI,CAAC,uBAAuB,IAAI,EAAE,GAChC,uBAAuB,QAAQ,OAAO,EAAE;EAE5C,CAAC;EAGD,IAAI,CAAC,eAAe,SAAS;GAC3B,cAAc,SAAS,EAAE,SAAS,uBAAuB,QAAQ,IAAI,EAAE,CAAC;GACxE,eAAe,UAAU;GACzB;EACF;EAEA,cAAc,SAAS,iBAAiB;GACtC,IAAI,uBAAuB,QAAQ,IAAI,aAAa,EAAE,GAAG;GAEzD,uBAAuB,QAAQ,IAAI,aAAa,EAAE;GAClD,IAAI,CAAC,mBAAmB,YAAY,GAAG;GAEvC,MAAM,UAAU,EAAE,wCAAwC;IACxD;IACA,OAAO,aAAa;GACtB,CAAC;GAED,IAAI,CAAC,SAAS;GAGd,MAAM,sBAAsB,8BAA8B;IACxD,gBAFqB,8BAA8B,cAAc,OAEjE;IACA;IACA,mBAAmB;GACrB,CAAC;GAED,IAAI,CAAC,qBAAqB;GAE1B,QAAQ;IACN,SAAS;IACT,UAAU,wBAAwB,YAAY;GAChD,CAAC;EACH,CAAC;CACH,GAAG;EAAC;EAA+B;EAAS;EAAoB;EAAe;CAAC,CAAC;CAEjF,OAAO;AACT"}

package/dist/es/components/Accessibility/hooks/useAudioPlaybackChangeAnnouncements.mjs

@@ -0,0 +1,20 @@
+import { useStateStore } from "../../../store/hooks/useStateStore.mjs";
+import { useInteractionAnnouncements } from "./useInteractionAnnouncements.mjs";
+import { useEffect, useRef } from "react";
+//#region src/components/Accessibility/hooks/useAudioPlaybackChangeAnnouncements.ts
+var playbackRateSelector = (state) => ({ currentPlaybackRate: state.currentPlaybackRate });
+var useAudioPlaybackChangeAnnouncements = (audioPlayer) => {
+	const { announceInteraction } = useInteractionAnnouncements();
+	const { currentPlaybackRate } = useStateStore(audioPlayer?.state, playbackRateSelector) ?? {};
+	const previousPlaybackRateRef = useRef(currentPlaybackRate);
+	useEffect(() => {
+		const previous = previousPlaybackRateRef.current;
+		previousPlaybackRateRef.current = currentPlaybackRate;
+		if (currentPlaybackRate === void 0 || previous === void 0 || previous === currentPlaybackRate) return;
+		announceInteraction("audioPlayer.playbackRateChanged", { rate: currentPlaybackRate });
+	}, [announceInteraction, currentPlaybackRate]);
+};
+//#endregion
+export { useAudioPlaybackChangeAnnouncements };
+
+//# sourceMappingURL=useAudioPlaybackChangeAnnouncements.mjs.map

package/dist/es/components/Accessibility/hooks/useAudioPlaybackChangeAnnouncements.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useAudioPlaybackChangeAnnouncements.mjs","names":[],"sources":["../../../../../src/components/Accessibility/hooks/useAudioPlaybackChangeAnnouncements.ts"],"sourcesContent":["import type { AudioPlayer, AudioPlayerState } from '../../AudioPlayback';\nimport { useInteractionAnnouncements } from './useInteractionAnnouncements';\nimport { useStateStore } from '../../../store';\nimport { useEffect, useRef } from 'react';\n\nconst playbackRateSelector = (state: AudioPlayerState) => ({\n  currentPlaybackRate: state.currentPlaybackRate,\n});\n\nexport const useAudioPlaybackChangeAnnouncements = (\n  audioPlayer: AudioPlayer | undefined,\n) => {\n  const { announceInteraction } = useInteractionAnnouncements();\n\n  // Announce a playback-speed change to assistive tech. The rate button only changes an icon/label\n  // in place, so a screen reader gets no confirmation; announce off the state so it reflects the new\n  // rate regardless of which widget's button was pressed (voice recording or audio attachment).\n  const { currentPlaybackRate } =\n    useStateStore(audioPlayer?.state, playbackRateSelector) ?? {};\n  const previousPlaybackRateRef = useRef(currentPlaybackRate);\n  useEffect(() => {\n    const previous = previousPlaybackRateRef.current;\n    previousPlaybackRateRef.current = currentPlaybackRate;\n    // Skip the initial value and no-op re-renders; announce only a real change to a defined rate.\n    if (\n      currentPlaybackRate === undefined ||\n      previous === undefined ||\n      previous === currentPlaybackRate\n    )\n      return;\n    announceInteraction('audioPlayer.playbackRateChanged', { rate: currentPlaybackRate });\n  }, [announceInteraction, currentPlaybackRate]);\n};\n"],"mappings":";;;;AAKA,IAAM,wBAAwB,WAA6B,EACzD,qBAAqB,MAAM,oBAC7B;AAEA,IAAa,uCACX,gBACG;CACH,MAAM,EAAE,wBAAwB,4BAA4B;CAK5D,MAAM,EAAE,wBACN,cAAc,aAAa,OAAO,oBAAoB,KAAK,CAAC;CAC9D,MAAM,0BAA0B,OAAO,mBAAmB;CAC1D,gBAAgB;EACd,MAAM,WAAW,wBAAwB;EACzC,wBAAwB,UAAU;EAElC,IACE,wBAAwB,KAAA,KACxB,aAAa,KAAA,KACb,aAAa,qBAEb;EACF,oBAAoB,mCAAmC,EAAE,MAAM,oBAAoB,CAAC;CACtF,GAAG,CAAC,qBAAqB,mBAAmB,CAAC;AAC/C"}

package/dist/es/components/Accessibility/hooks/useFocusReturn.mjs

@@ -0,0 +1,37 @@
+import { useCallback, useRef } from "react";
+//#region src/components/Accessibility/hooks/useFocusReturn.ts
+var isFocusableElement = (value) => value instanceof HTMLElement && typeof value.focus === "function";
+/**
+* Generic focus-restoration primitive: capture-before-steal, restore-on-finish —
+* the pattern dialogs/popovers use. A transient surface (e.g. the Giphy preview)
+* `reserve()`s before it moves focus into itself, then `restore()`s when it
+* completes, returning focus to wherever it was — WITHOUT the surface knowing or
+* naming that element (no coupling to "the composer").
+*
+* Single-candidate by design: each consumer holds its own reservation in a ref,
+* so concurrent/nested transient surfaces never clobber each other (each restores
+* its own origin). There is one `document.activeElement` at a time, and these
+* flows are mutually exclusive, so no shared slot/stack/key registry is needed.
+* If a cross-component rendezvous or deep nesting ever appears, a stack (nesting)
+* or coarse typed keys (rendezvous) can be added without changing this API.
+*
+* React 17/18/19 compatible — `useRef`/`useCallback` only.
+*/
+var useFocusReturn = () => {
+	const reservedTargetRef = useRef(null);
+	return {
+		reserve: useCallback((options) => {
+			const candidate = options?.target ?? document.activeElement;
+			reservedTargetRef.current = isFocusableElement(candidate) && candidate !== document.body ? candidate : null;
+		}, []),
+		restore: useCallback(() => {
+			const target = reservedTargetRef.current;
+			reservedTargetRef.current = null;
+			if (target?.isConnected) target.focus();
+		}, [])
+	};
+};
+//#endregion
+export { useFocusReturn };
+
+//# sourceMappingURL=useFocusReturn.mjs.map

package/dist/es/components/Accessibility/hooks/useFocusReturn.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useFocusReturn.mjs","names":[],"sources":["../../../../../src/components/Accessibility/hooks/useFocusReturn.ts"],"sourcesContent":["import { useCallback, useRef } from 'react';\n\nexport type ReserveFocusReturnOptions = {\n  /**\n   * Explicit element focus should return to. Defaults to the current\n   * `document.activeElement` (the natural \"origin\" — e.g. the composer when a\n   * transient surface steals focus). Provide this when the desired return target\n   * is NOT where focus currently is. A non-focusable value (or `document.body`)\n   * reserves nothing.\n   */\n  target?: HTMLElement | null;\n};\n\nexport type UseFocusReturnResult = {\n  /**\n   * Capture the element focus should return to. Called with no argument it\n   * captures the current `document.activeElement`; pass `{ target }` to override.\n   * Options is an object for forward-compatibility (future flags add fields here\n   * without changing the call signature).\n   */\n  reserve: (options?: ReserveFocusReturnOptions) => void;\n  /**\n   * Move focus back to the reserved element (if it is still connected) and clear\n   * the reservation. No-op when nothing was reserved or the element is gone.\n   * Focuses synchronously — defer announcements yourself if you need the focus\n   * announcement to be spoken first.\n   */\n  restore: () => void;\n};\n\nconst isFocusableElement = (value: Element | null): value is HTMLElement =>\n  value instanceof HTMLElement && typeof value.focus === 'function';\n\n/**\n * Generic focus-restoration primitive: capture-before-steal, restore-on-finish —\n * the pattern dialogs/popovers use. A transient surface (e.g. the Giphy preview)\n * `reserve()`s before it moves focus into itself, then `restore()`s when it\n * completes, returning focus to wherever it was — WITHOUT the surface knowing or\n * naming that element (no coupling to \"the composer\").\n *\n * Single-candidate by design: each consumer holds its own reservation in a ref,\n * so concurrent/nested transient surfaces never clobber each other (each restores\n * its own origin). There is one `document.activeElement` at a time, and these\n * flows are mutually exclusive, so no shared slot/stack/key registry is needed.\n * If a cross-component rendezvous or deep nesting ever appears, a stack (nesting)\n * or coarse typed keys (rendezvous) can be added without changing this API.\n *\n * React 17/18/19 compatible — `useRef`/`useCallback` only.\n */\nexport const useFocusReturn = (): UseFocusReturnResult => {\n  const reservedTargetRef = useRef<HTMLElement | null>(null);\n\n  const reserve = useCallback((options?: ReserveFocusReturnOptions) => {\n    const candidate = options?.target ?? (document.activeElement as Element | null);\n    reservedTargetRef.current =\n      isFocusableElement(candidate) && candidate !== document.body ? candidate : null;\n  }, []);\n\n  const restore = useCallback(() => {\n    const target = reservedTargetRef.current;\n    reservedTargetRef.current = null;\n    if (target?.isConnected) target.focus();\n  }, []);\n\n  return { reserve, restore };\n};\n"],"mappings":";;AA8BA,IAAM,sBAAsB,UAC1B,iBAAiB,eAAe,OAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;AAkBzD,IAAa,uBAA6C;CACxD,MAAM,oBAAoB,OAA2B,IAAI;CAczD,OAAO;EAAE,SAZO,aAAa,YAAwC;GACnE,MAAM,YAAY,SAAS,UAAW,SAAS;GAC/C,kBAAkB,UAChB,mBAAmB,SAAS,KAAK,cAAc,SAAS,OAAO,YAAY;EAC/E,GAAG,CAAC,CAQK;EAAS,SANF,kBAAkB;GAChC,MAAM,SAAS,kBAAkB;GACjC,kBAAkB,UAAU;GAC5B,IAAI,QAAQ,aAAa,OAAO,MAAM;EACxC,GAAG,CAAC,CAEc;CAAQ;AAC5B"}

package/dist/es/components/Accessibility/hooks/useIncomingMessageAnnouncements.mjs

@@ -0,0 +1,84 @@
+import { useTranslationContext } from "../../../context/TranslationContext.mjs";
+import { useAriaLiveAnnouncer } from "../useAriaLiveAnnouncer.mjs";
+import { useCallback, useEffect, useRef } from "react";
+//#region src/components/Accessibility/hooks/useIncomingMessageAnnouncements.ts
+var MESSAGE_ANNOUNCEMENT_THROTTLE_MS = 1e3;
+var isAnnounceableIncomingMessage = (message, ownUserId) => {
+	const messageUserId = message.user?.id;
+	if (!message.id || !messageUserId || messageUserId === ownUserId) return false;
+	return message.type !== "deleted" && message.type !== "ephemeral" && message.type !== "error" && message.type !== "system" && message.status !== "failed" && message.status !== "sending";
+};
+var getSenderName = (message, t) => message.user?.name?.trim() || message.user?.id || t("Anonymous");
+var useIncomingMessageAnnouncements = ({ activeThreadId, channel, ownUserId, threadList = false }) => {
+	const announce = useAriaLiveAnnouncer();
+	const { t } = useTranslationContext("useIncomingMessageAnnouncements");
+	const lastAnnouncementTimestampRef = useRef(0);
+	const flushTimeoutRef = useRef(void 0);
+	const announcedMessageIdsRef = useRef(/* @__PURE__ */ new Set());
+	const pendingAnnouncementBatchRef = useRef({
+		count: 0,
+		firstSender: null
+	});
+	const flushPendingAnnouncements = useCallback(() => {
+		const pendingAnnouncementBatch = pendingAnnouncementBatchRef.current;
+		if (pendingAnnouncementBatch.count <= 0) return;
+		if (pendingAnnouncementBatch.count === 1) announce(t("New message from {{user}}", { user: pendingAnnouncementBatch.firstSender || t("Anonymous") }));
+		else announce(t("{{count}} new messages", { count: pendingAnnouncementBatch.count }));
+		pendingAnnouncementBatch.count = 0;
+		pendingAnnouncementBatch.firstSender = null;
+		lastAnnouncementTimestampRef.current = Date.now();
+	}, [announce, t]);
+	const scheduleFlush = useCallback(() => {
+		if (flushTimeoutRef.current) return;
+		const elapsedSinceLastAnnouncement = Date.now() - lastAnnouncementTimestampRef.current;
+		if (elapsedSinceLastAnnouncement >= MESSAGE_ANNOUNCEMENT_THROTTLE_MS) {
+			flushPendingAnnouncements();
+			return;
+		}
+		flushTimeoutRef.current = setTimeout(() => {
+			flushTimeoutRef.current = void 0;
+			flushPendingAnnouncements();
+		}, MESSAGE_ANNOUNCEMENT_THROTTLE_MS - elapsedSinceLastAnnouncement);
+	}, [flushPendingAnnouncements]);
+	useEffect(() => () => {
+		if (flushTimeoutRef.current) clearTimeout(flushTimeoutRef.current);
+	}, []);
+	useEffect(() => {
+		if (!channel) return;
+		const handleMessageNew = (event) => {
+			const message = event.message;
+			if (!message) return;
+			if (event.cid && event.cid !== channel.cid || !isAnnounceableIncomingMessage(message, ownUserId)) return;
+			const isReply = !!message.parent_id;
+			const belongsToActiveThread = !!activeThreadId && message.parent_id === activeThreadId;
+			if (!(threadList && belongsToActiveThread) && !(!threadList && !isReply)) return;
+			if (announcedMessageIdsRef.current.has(message.id || "")) return;
+			if (message.id) {
+				if (announcedMessageIdsRef.current.size > 500) announcedMessageIdsRef.current.clear();
+				announcedMessageIdsRef.current.add(message.id);
+			}
+			pendingAnnouncementBatchRef.current.count += 1;
+			if (!pendingAnnouncementBatchRef.current.firstSender) pendingAnnouncementBatchRef.current.firstSender = getSenderName(message, t);
+			scheduleFlush();
+		};
+		const subscription = channel.on("message.new", handleMessageNew);
+		return () => {
+			subscription.unsubscribe();
+			if (flushTimeoutRef.current) {
+				clearTimeout(flushTimeoutRef.current);
+				flushTimeoutRef.current = void 0;
+			}
+		};
+	}, [
+		activeThreadId,
+		channel,
+		ownUserId,
+		scheduleFlush,
+		t,
+		threadList
+	]);
+};
+//#endregion
+export { useIncomingMessageAnnouncements };
+
+//# sourceMappingURL=useIncomingMessageAnnouncements.mjs.map

package/dist/es/components/Accessibility/hooks/useIncomingMessageAnnouncements.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"useIncomingMessageAnnouncements.mjs","names":[],"sources":["../../../../../src/components/Accessibility/hooks/useIncomingMessageAnnouncements.ts"],"sourcesContent":["import { useCallback, useEffect, useRef } from 'react';\nimport type { Channel, Event, MessageResponse } from 'stream-chat';\n\nimport { useAriaLiveAnnouncer } from '../useAriaLiveAnnouncer';\nimport { useTranslationContext } from '../../../context/TranslationContext';\n\nconst MESSAGE_ANNOUNCEMENT_THROTTLE_MS = 1000;\n\nconst isAnnounceableIncomingMessage = (\n  message: MessageResponse,\n  ownUserId?: string,\n): boolean => {\n  const messageUserId = message.user?.id;\n\n  if (!message.id || !messageUserId || messageUserId === ownUserId) {\n    return false;\n  }\n\n  return (\n    message.type !== 'deleted' &&\n    message.type !== 'ephemeral' &&\n    message.type !== 'error' &&\n    message.type !== 'system' &&\n    message.status !== 'failed' &&\n    message.status !== 'sending'\n  );\n};\n\nconst getSenderName = (\n  message: MessageResponse,\n  t: ReturnType<typeof useTranslationContext>['t'],\n) => message.user?.name?.trim() || message.user?.id || t('Anonymous');\n\nexport type UseIncomingMessageAnnouncementsParams = {\n  activeThreadId?: string;\n  channel?: Channel;\n  ownUserId?: string;\n  threadList?: boolean;\n};\n\nexport const useIncomingMessageAnnouncements = ({\n  activeThreadId,\n  channel,\n  ownUserId,\n  threadList = false,\n}: UseIncomingMessageAnnouncementsParams) => {\n  const announce = useAriaLiveAnnouncer();\n  const { t } = useTranslationContext('useIncomingMessageAnnouncements');\n  const lastAnnouncementTimestampRef = useRef(0);\n  const flushTimeoutRef = useRef<ReturnType<typeof setTimeout> | undefined>(undefined);\n  const announcedMessageIdsRef = useRef(new Set<string>());\n  const pendingAnnouncementBatchRef = useRef<{\n    count: number;\n    firstSender: string | null;\n  }>({\n    count: 0,\n    firstSender: null,\n  });\n\n  const flushPendingAnnouncements = useCallback(() => {\n    const pendingAnnouncementBatch = pendingAnnouncementBatchRef.current;\n\n    if (pendingAnnouncementBatch.count <= 0) return;\n\n    if (pendingAnnouncementBatch.count === 1) {\n      announce(\n        t('New message from {{user}}', {\n          user: pendingAnnouncementBatch.firstSender || t('Anonymous'),\n        }),\n      );\n    } else {\n      announce(t('{{count}} new messages', { count: pendingAnnouncementBatch.count }));\n    }\n\n    pendingAnnouncementBatch.count = 0;\n    pendingAnnouncementBatch.firstSender = null;\n    lastAnnouncementTimestampRef.current = Date.now();\n  }, [announce, t]);\n\n  const scheduleFlush = useCallback(() => {\n    if (flushTimeoutRef.current) return;\n\n    const now = Date.now();\n    const elapsedSinceLastAnnouncement = now - lastAnnouncementTimestampRef.current;\n\n    if (elapsedSinceLastAnnouncement >= MESSAGE_ANNOUNCEMENT_THROTTLE_MS) {\n      flushPendingAnnouncements();\n      return;\n    }\n\n    flushTimeoutRef.current = setTimeout(() => {\n      flushTimeoutRef.current = undefined;\n      flushPendingAnnouncements();\n    }, MESSAGE_ANNOUNCEMENT_THROTTLE_MS - elapsedSinceLastAnnouncement);\n  }, [flushPendingAnnouncements]);\n\n  useEffect(\n    () => () => {\n      if (flushTimeoutRef.current) {\n        clearTimeout(flushTimeoutRef.current);\n      }\n    },\n    [],\n  );\n\n  useEffect(() => {\n    if (!channel) {\n      return;\n    }\n\n    const handleMessageNew = (event: Event) => {\n      const message = event.message;\n      if (!message) return;\n\n      if (\n        (event.cid && event.cid !== channel.cid) ||\n        !isAnnounceableIncomingMessage(message, ownUserId)\n      ) {\n        return;\n      }\n\n      const isReply = !!message.parent_id;\n      const belongsToActiveThread =\n        !!activeThreadId && message.parent_id === activeThreadId;\n      const shouldAnnounceInThreadList = threadList && belongsToActiveThread;\n      const shouldAnnounceInMainList = !threadList && !isReply;\n\n      if (!shouldAnnounceInThreadList && !shouldAnnounceInMainList) {\n        return;\n      }\n\n      if (announcedMessageIdsRef.current.has(message.id || '')) {\n        return;\n      }\n\n      if (message.id) {\n        if (announcedMessageIdsRef.current.size > 500) {\n          announcedMessageIdsRef.current.clear();\n        }\n        announcedMessageIdsRef.current.add(message.id);\n      }\n\n      pendingAnnouncementBatchRef.current.count += 1;\n      if (!pendingAnnouncementBatchRef.current.firstSender) {\n        pendingAnnouncementBatchRef.current.firstSender = getSenderName(message, t);\n      }\n\n      scheduleFlush();\n    };\n\n    const subscription = channel.on('message.new', handleMessageNew);\n\n    return () => {\n      subscription.unsubscribe();\n      if (flushTimeoutRef.current) {\n        clearTimeout(flushTimeoutRef.current);\n        flushTimeoutRef.current = undefined;\n      }\n    };\n  }, [activeThreadId, channel, ownUserId, scheduleFlush, t, threadList]);\n};\n"],"mappings":";;;;AAMA,IAAM,mCAAmC;AAEzC,IAAM,iCACJ,SACA,cACY;CACZ,MAAM,gBAAgB,QAAQ,MAAM;CAEpC,IAAI,CAAC,QAAQ,MAAM,CAAC,iBAAiB,kBAAkB,WACrD,OAAO;CAGT,OACE,QAAQ,SAAS,aACjB,QAAQ,SAAS,eACjB,QAAQ,SAAS,WACjB,QAAQ,SAAS,YACjB,QAAQ,WAAW,YACnB,QAAQ,WAAW;AAEvB;AAEA,IAAM,iBACJ,SACA,MACG,QAAQ,MAAM,MAAM,KAAK,KAAK,QAAQ,MAAM,MAAM,EAAE,WAAW;AASpE,IAAa,mCAAmC,EAC9C,gBACA,SACA,WACA,aAAa,YAC8B;CAC3C,MAAM,WAAW,qBAAqB;CACtC,MAAM,EAAE,MAAM,sBAAsB,iCAAiC;CACrE,MAAM,+BAA+B,OAAO,CAAC;CAC7C,MAAM,kBAAkB,OAAkD,KAAA,CAAS;CACnF,MAAM,yBAAyB,uBAAO,IAAI,IAAY,CAAC;CACvD,MAAM,8BAA8B,OAGjC;EACD,OAAO;EACP,aAAa;CACf,CAAC;CAED,MAAM,4BAA4B,kBAAkB;EAClD,MAAM,2BAA2B,4BAA4B;EAE7D,IAAI,yBAAyB,SAAS,GAAG;EAEzC,IAAI,yBAAyB,UAAU,GACrC,SACE,EAAE,6BAA6B,EAC7B,MAAM,yBAAyB,eAAe,EAAE,WAAW,EAC7D,CAAC,CACH;OAEA,SAAS,EAAE,0BAA0B,EAAE,OAAO,yBAAyB,MAAM,CAAC,CAAC;EAGjF,yBAAyB,QAAQ;EACjC,yBAAyB,cAAc;EACvC,6BAA6B,UAAU,KAAK,IAAI;CAClD,GAAG,CAAC,UAAU,CAAC,CAAC;CAEhB,MAAM,gBAAgB,kBAAkB;EACtC,IAAI,gBAAgB,SAAS;EAG7B,MAAM,+BADM,KAAK,IACoB,IAAM,6BAA6B;EAExE,IAAI,gCAAgC,kCAAkC;GACpE,0BAA0B;GAC1B;EACF;EAEA,gBAAgB,UAAU,iBAAiB;GACzC,gBAAgB,UAAU,KAAA;GAC1B,0BAA0B;EAC5B,GAAG,mCAAmC,4BAA4B;CACpE,GAAG,CAAC,yBAAyB,CAAC;CAE9B,sBACc;EACV,IAAI,gBAAgB,SAClB,aAAa,gBAAgB,OAAO;CAExC,GACA,CAAC,CACH;CAEA,gBAAgB;EACd,IAAI,CAAC,SACH;EAGF,MAAM,oBAAoB,UAAiB;GACzC,MAAM,UAAU,MAAM;GACtB,IAAI,CAAC,SAAS;GAEd,IACG,MAAM,OAAO,MAAM,QAAQ,QAAQ,OACpC,CAAC,8BAA8B,SAAS,SAAS,GAEjD;GAGF,MAAM,UAAU,CAAC,CAAC,QAAQ;GAC1B,MAAM,wBACJ,CAAC,CAAC,kBAAkB,QAAQ,cAAc;GAI5C,IAAI,EAH+B,cAAc,0BAGd,EAFF,CAAC,cAAc,CAAC,UAG/C;GAGF,IAAI,uBAAuB,QAAQ,IAAI,QAAQ,MAAM,EAAE,GACrD;GAGF,IAAI,QAAQ,IAAI;IACd,IAAI,uBAAuB,QAAQ,OAAO,KACxC,uBAAuB,QAAQ,MAAM;IAEvC,uBAAuB,QAAQ,IAAI,QAAQ,EAAE;GAC/C;GAEA,4BAA4B,QAAQ,SAAS;GAC7C,IAAI,CAAC,4BAA4B,QAAQ,aACvC,4BAA4B,QAAQ,cAAc,cAAc,SAAS,CAAC;GAG5E,cAAc;EAChB;EAEA,MAAM,eAAe,QAAQ,GAAG,eAAe,gBAAgB;EAE/D,aAAa;GACX,aAAa,YAAY;GACzB,IAAI,gBAAgB,SAAS;IAC3B,aAAa,gBAAgB,OAAO;IACpC,gBAAgB,UAAU,KAAA;GAC5B;EACF;CACF,GAAG;EAAC;EAAgB;EAAS;EAAW;EAAe;EAAG;CAAU,CAAC;AACvE"}