@payfit/unity-components
Version:
32 lines (31 loc) • 1.3 kB
TypeScript
export interface NavigationCardContextValue {
id: string;
labelId: string;
descriptionId: string;
}
export declare const NavigationCardContext: import('react').Context<NavigationCardContextValue>;
/**
* Accesses the NavigationCard context to retrieve accessibility IDs for proper ARIA relationships.
* Use this hook when building custom subcomponents that need to connect to the parent NavigationCard's accessibility structure.
* @returns {NavigationCardContextValue} An object containing id, labelId, and descriptionId for ARIA attributes
* @example
* ```tsx
* import { useNavigationCardContext } from '@payfit/unity-components'
*
* function CustomNavigationCardContent() {
* const { labelId, descriptionId } = useNavigationCardContext()
* return (
* <div>
* <span id={labelId}>Custom Label</span>
* <span id={descriptionId}>Custom Description</span>
* </div>
* )
* }
* ```
* @remarks
* - This hook must be called within a NavigationCard component
* - The context provides unique IDs for accessibility attributes
* - Use the provided IDs to maintain proper ARIA labeling relationships
* @see {@link NavigationCardContextValue} for the returned value structure
*/
export declare function useNavigationCardContext(): NavigationCardContextValue;