import { EventEmitter } from '../../stencil-public-runtime'; import { SkipLinkPosition } from './exports'; /** * An accessibility utility that renders a visible-on-focus link allowing keyboard users to skip navigation and jump directly to main content. * * Example * ``` * * Skip to main content * * *
* *
* ``` * * Visibility is the union of two independent sources: the link is visible while it contains * focus (default accessibility behaviour, resolved by CSS) or while `revealed` is set * (programmatic control). Because of that, `revealed` means "forced visible", not "is visible". * * While visible, the link is anchored to the viewport (`position: fixed`), so revealing it on a * scrolled page keeps it in view without scrolling the page. An ancestor with `transform`, * `filter`, `perspective`, `backdrop-filter`, or `contain: paint` becomes the containing block * and the link is anchored to that element instead of the viewport. * * @slot - Skip link label text */ export declare class SkipLink { host: HTMLRSkipLinkElement; /** Defines skip link position */ position: SkipLinkPosition; /** * Forces the skip link to be visible, independently of focus. * The link is also visible while it contains focus, so `revealed="false"` does not * hide a link that is currently focused. */ revealed: boolean; /** Tracks focus inside the skip link. Used for event emission only, visibility is resolved by CSS. */ focused: boolean; /** * Emitted when the skip link becomes visible, either through `reveal()`/`revealed` * or because it received focus. */ rReveal: EventEmitter; /** * Emitted when the skip link becomes hidden, either through `hide()`/`revealed` * or because it lost focus. */ rHide: EventEmitter; /** Last emitted visibility, used to emit on transitions only. */ private visible; /** * Reveals the skip link without waiting for focus. * Does not move focus. Calling it on an already visible link emits nothing. */ reveal(): Promise; /** * Hides the skip link and restores the default focus-driven behaviour. * While the link still contains focus it stays visible, and `rHide` is emitted once focus leaves. */ hide(): Promise; onRevealedChange(): void; onFocusIn(): void; onFocusOut(event: FocusEvent): void; componentDidLoad(): void; private syncVisibility; render(): any; }