@renderlesskit/react
Version:
Collection of headless components/hooks that are accessible, composable, customizable from low level to build your own UI & Design System powered by Reakit
123 lines (122 loc) • 5.32 kB
TypeScript
/// <reference types="react" />
import { DialogHTMLProps, DialogOptions } from "../dialog";
export declare type DrawerOptions = DialogOptions & {
/**
* Direction to place the drawer.
*
* @default left
*/
placement: Placement;
};
export declare type DrawerHTMLProps = DialogHTMLProps;
export declare type DrawerProps = DrawerOptions & DrawerHTMLProps;
export declare const useDrawer: {
(options?: DrawerOptions | undefined, htmlProps?: import("reakit/ts").BoxHTMLProps | undefined, unstable_ignoreUseOptions?: boolean | undefined): import("reakit/ts").BoxHTMLProps;
unstable_propsAreEqual: (prev: import("reakit/ts").BoxOptions & Pick<import("..").DisclosureStateReturn, "baseId" | "visible"> & {
animationPresent?: boolean | undefined;
state: import("../disclosure/helpers").TransitionState;
animating: boolean;
onEnd: (event: import("react").SyntheticEvent<Element, Event>) => void;
isVisible: boolean;
isHidden: boolean;
} & Pick<Partial<import("../dialog").DialogStateReturn>, "hide" | "modal" | "disclosureRef"> & Pick<import("../dialog").DialogStateReturn, "baseId"> & {
hideOnEsc?: boolean | undefined;
hideOnClickOutside?: boolean | undefined;
preventBodyScroll?: boolean | undefined;
unstable_initialFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_finalFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_orphan?: boolean | undefined;
unstable_autoFocusOnShow?: boolean | undefined;
unstable_autoFocusOnHide?: boolean | undefined;
} & {
/**
* Direction to place the drawer.
*
* @default left
*/
placement: Placement;
} & import("react").HTMLAttributes<any> & import("react").RefAttributes<any> & {
wrapElement?: ((element: import("react").ReactNode) => import("react").ReactNode) | undefined;
}, next: import("reakit/ts").BoxOptions & Pick<import("..").DisclosureStateReturn, "baseId" | "visible"> & {
animationPresent?: boolean | undefined;
state: import("../disclosure/helpers").TransitionState;
animating: boolean;
onEnd: (event: import("react").SyntheticEvent<Element, Event>) => void;
isVisible: boolean;
isHidden: boolean;
} & Pick<Partial<import("../dialog").DialogStateReturn>, "hide" | "modal" | "disclosureRef"> & Pick<import("../dialog").DialogStateReturn, "baseId"> & {
hideOnEsc?: boolean | undefined;
hideOnClickOutside?: boolean | undefined;
preventBodyScroll?: boolean | undefined;
unstable_initialFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_finalFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_orphan?: boolean | undefined;
unstable_autoFocusOnShow?: boolean | undefined;
unstable_autoFocusOnHide?: boolean | undefined;
} & {
/**
* Direction to place the drawer.
*
* @default left
*/
placement: Placement;
} & import("react").HTMLAttributes<any> & import("react").RefAttributes<any> & {
wrapElement?: ((element: import("react").ReactNode) => import("react").ReactNode) | undefined;
}) => boolean;
__keys: readonly any[];
__useOptions: (options: DrawerOptions, htmlProps: import("reakit/ts").BoxHTMLProps) => DrawerOptions;
};
export declare const Drawer: import("../system").Component<"div", import("reakit/ts").BoxOptions & Pick<import("..").DisclosureStateReturn, "baseId" | "visible"> & {
animationPresent?: boolean | undefined;
state: import("../disclosure/helpers").TransitionState;
animating: boolean;
onEnd: (event: import("react").SyntheticEvent<Element, Event>) => void;
isVisible: boolean;
isHidden: boolean;
} & Pick<Partial<import("../dialog").DialogStateReturn>, "hide" | "modal" | "disclosureRef"> & Pick<import("../dialog").DialogStateReturn, "baseId"> & {
hideOnEsc?: boolean | undefined;
hideOnClickOutside?: boolean | undefined;
preventBodyScroll?: boolean | undefined;
unstable_initialFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_finalFocusRef?: import("react").RefObject<HTMLElement> | undefined;
unstable_orphan?: boolean | undefined;
unstable_autoFocusOnShow?: boolean | undefined;
unstable_autoFocusOnHide?: boolean | undefined;
} & {
/**
* Direction to place the drawer.
*
* @default left
*/
placement: Placement;
} & import("react").HTMLAttributes<any> & import("react").RefAttributes<any> & {
wrapElement?: ((element: import("react").ReactNode) => import("react").ReactNode) | undefined;
}>;
export declare type Placement = keyof typeof PLACEMENTS;
declare const PLACEMENTS: {
left: {
left: number;
top: number;
bottom: number;
height: string;
};
right: {
right: number;
top: number;
bottom: number;
height: string;
};
top: {
right: number;
left: number;
top: number;
width: string;
};
bottom: {
right: number;
left: number;
bottom: number;
width: string;
};
};
export {};