carbon-react
Version:
A library of reusable React components for easily building user interfaces.
50 lines (49 loc) • 2.37 kB
TypeScript
import React from "react";
import { TagProps } from "../../__internal__/utils/helpers/tags";
import DrawerSidebarContext from "./__internal__/drawer-sidebar.context";
export interface DrawerProps extends TagProps {
/**
* Duration of a animation
* @deprecated This prop will soon be removed.
*/
animationDuration?: string;
/** Specify an aria-label for the Drawer component */
"aria-label"?: string;
/** Specify an aria-label for the Drawer sidebar */
sidebarAriaLabel?: string;
/** Sets color of sidebar's background */
backgroundColor?: string;
/** Main content to display */
children: React.ReactNode;
/**
* Set the default state of expansion of the Drawer if component is meant to be used as uncontrolled
* @deprecated This prop will soon be removed, please use the `expanded` prop instead.
*/
defaultExpanded?: boolean;
/** Sets the expansion state of the Drawer if component is meant to be used as controlled */
expanded?: boolean;
/** The width of the expanded sidebar */
expandedWidth?: string;
/** Sets the height of the component */
height?: string;
/** Callback fired when expansion state changes, onChange(event: object, isExpanded: boolean) */
onChange?: (e: React.MouseEvent<HTMLElement> | React.KeyboardEvent<HTMLElement>, isExpanded: boolean) => void;
/** Drawer sidebar content */
sidebar?: React.ReactNode;
/**
* Enables expand/collapse button that controls drawer
* @deprecated This prop will soon be removed, this component is now intended to be non-dismissible.
*/
showControls?: boolean;
/** Sets the heading of the drawer */
title?: React.ReactNode;
/** Content to display inside of a footer */
footer?: React.ReactNode;
/** Makes the header of the drawer sticky. Title prop must also be set. */
stickyHeader?: boolean;
/** Makes the footer of the drawer sticky. Footer prop must also be set. */
stickyFooter?: boolean;
}
export declare const Drawer: ({ "aria-label": ariaLabel, sidebarAriaLabel, defaultExpanded, expanded, onChange, children, expandedWidth, sidebar, animationDuration, backgroundColor, title, footer, showControls, height, stickyHeader, stickyFooter, ...rest }: DrawerProps) => React.JSX.Element;
export { DrawerSidebarContext };
export default Drawer;