/**
* useAriaLive - aria-live 区域管理
*
* 用途:动态向 aria-live 区域推送消息,供屏幕阅读器播报。
* 迁移自 CICD 项目 A11y 工具集。
*
* @example
* const { message, announce } = useAriaLive();
* announce("表单提交成功", "polite");
* // 渲染:
{message}
*/
import { useCallback, useState } from "react";
export type AriaLivePoliteness = "polite" | "assertive" | "off";
export interface UseAriaLiveReturn {
/** 当前消息内容 */
message: string;
/** 当前 politeness 级别 */
politeness: AriaLivePoliteness;
/** 推送消息 */
announce: (message: string, politeness?: AriaLivePoliteness) => void;
/** 清除消息 */
clear: () => void;
}
export function useAriaLive(): UseAriaLiveReturn {
const [message, setMessage] = useState("");
const [politeness, setPoliteness] = useState("polite");
const announce = useCallback(
(msg: string, level: AriaLivePoliteness = "polite"): void => {
setPoliteness(level);
// 先清空再设置,确保相同消息也能触发播报
setMessage("");
requestAnimationFrame(() => setMessage(msg));
},
[],
);
const clear = useCallback((): void => {
setMessage("");
}, []);
return {
message,
politeness,
announce,
clear,
};
}