import { PropertyValueMap } from "lit"; import SgdsElement from "../../base/sgds-element"; import SgdsCloseButton from "../CloseButton/sgds-close-button"; /** * @summary Drawers slide in from a container to expose additional options and information. * * @slot default - The drawer's main content * @slot title - The title of the drawer * @slot description - The description of the drawer * @slot footer - The footer of the drawer * * @event sgds-show - Emitted when the drawer opens. * @event sgds-after-show - Emitted after the drawer opens and all animations are complete. * @event sgds-hide - Emitted when the drawer closes. * @event sgds-after-hide - Emitted after the drawer closes and all animations are complete. * @event sgds-initial-focus - Emitted when the drawer opens and is ready to receive focus. Calling * `event.preventDefault()` will prevent focusing and allow you to set it on a different element, such as an input. * @event {{ source: 'close-button' | 'keyboard' | 'overlay' }} sgds-request-close - Emitted when the user attempts to * close the drawer by clicking the close button, clicking the overlay, or pressing escape. Calling * `event.preventDefault()` will keep the drawer open. Avoid using this unless closing the drawer will result in * destructive behavior such as data loss. * */ export declare class SgdsDrawer extends SgdsElement { static styles: import("lit").CSSResult[]; /**@internal */ static dependencies: { "sgds-close-button": typeof SgdsCloseButton; }; /** @internal */ private originalTrigger; /** @internal */ drawer: HTMLElement; /** @internal */ panel: HTMLElement; /** @internal */ overlay: HTMLElement; /** * Indicates whether or not the drawer is open. You can toggle this attribute to show and hide the drawer, or you can * use the `show()` and `hide()` methods and this attribute will reflect the drawer's open state. */ open: boolean; /** * Defines the size of the drawer panel. * For drawers placed on the left or right (`start`/`end`), this controls the drawer's width. * For drawers placed on the top or bottom, this controls the drawer's height. * Accepts `small`, `medium`, or `large`. Defaults to `small`. */ size: "sm" | "md" | "lg"; /** The direction from which the drawer will open. */ placement: "top" | "end" | "bottom" | "start"; /** * The accessible label for the drawer dialog. This is required for assistive technology. */ ariaLabel: string; /** * By default, the drawer slides out of its containing block (usually the viewport). To make the drawer slide out of * its parent element, set this attribute and add `position: relative` to the parent. */ contained: boolean; firstUpdated(changedProperties: PropertyValueMap): void; disconnectedCallback(): void; private uppercaseFirstLetter; private requestClose; private addOpenListeners; private removeOpenListeners; private handleDocumentKeyDown; handleOpenChange(): Promise; handleNoModalChange(): void; /** Shows the drawer. */ show(): Promise; /** Hides the drawer */ hide(): Promise; render(): import("lit").TemplateResult<1>; } export default SgdsDrawer;