import { type FocusEvent as ReactFocusEvent } from 'react'; /** @internal */ export interface UseFocusRingProps { /** * A minimal focus outline is available for smaller content elements like links. This variant is applied when set to true. * @defaultValue false */ isMinimal?: boolean; /** * Whether or not the modality should be ignored, so that the focus ring is also present if users clicks the element (not just by tabbing to it). * @defaultValue false */ ignoreModality?: boolean; /** * The styling color of the element. * @defaultValue neutral */ color?: 'neutral' | 'primary' | 'success' | 'warning' | 'critical'; /** * Apply the focus ring styling if an embedded element gains the focus */ focusWithin?: boolean; /** * Whether the element is disabled. If disabled changes to true, the focus will be removed. */ disabled?: boolean; } /** @internal */ export type FocusRingProps = { /** The focus styles that depend on modality. */ focusClassName: string; /** Focus handlers used to manage the focus state. Must be applied to the element that receives the focus.*/ focusProps: { onFocus: (e: ReactFocusEvent | FocusEvent) => void; onBlur: (e: ReactFocusEvent | FocusEvent) => void; }; /** Whether or not the element got focus via keyboard. */ isFocusVisible: boolean; }; /** * Custom hook used to determine focus styling depending on modality. * Returns the css classes (vanilla) that can be applied to the component in order to show the correct focus outline. * @internal */ export declare function useFocusRing(props?: UseFocusRingProps): FocusRingProps;