30 lines
1.3 KiB
TypeScript
30 lines
1.3 KiB
TypeScript
import { type A11yState } from './state.js';
|
|
type A11yContextValue = {
|
|
reset: () => void;
|
|
set: <K extends keyof A11yState>(key: K, value: A11yState[K]) => void;
|
|
state: A11yState;
|
|
};
|
|
/**
|
|
* Provides accessibility preferences, persists them in a cookie, and applies them
|
|
* as data-attributes on <html> so the project's CSS can react. Like
|
|
* ConsentProvider for cookies — wrap the app once; the widget/button consume it.
|
|
*
|
|
* The plugin ships NO styles: it only sets attributes (data-a11y-*). The project
|
|
* writes CSS for those it supports (see docs/accessibility.md). This keeps the
|
|
* design in the project's hands.
|
|
*
|
|
* // layout.tsx
|
|
* import { AccessibilityProvider } from '@intecion/ipal-kit/client'
|
|
* <AccessibilityProvider>{children}</AccessibilityProvider>
|
|
*
|
|
* To avoid a flash, the project can read the a11y-prefs cookie server-side and
|
|
* set the attributes on <html> during SSR (see docs). This provider re-applies
|
|
* on the client and keeps them in sync.
|
|
*/
|
|
export declare function AccessibilityProvider({ children }: {
|
|
children: React.ReactNode;
|
|
}): import("react/jsx-runtime").JSX.Element;
|
|
/** Access accessibility preferences + setters. Use inside AccessibilityProvider. */
|
|
export declare function useAccessibility(): A11yContextValue;
|
|
export {};
|