carbon-react
Version:
A library of reusable React components for easily building user interfaces.
33 lines (32 loc) • 2.04 kB
TypeScript
import React from "react";
import { PaddingProps, MarginProps } from "styled-system";
import { TagProps } from "../../__internal__/utils/helpers/tags";
import { SidebarProps } from "../sidebar";
export interface AdaptiveSidebarProps extends MarginProps, PaddingProps, Omit<TagProps, "data-component">, Pick<SidebarProps, "restoreFocusOnClose"> {
/** The breakpoint (in pixels) at which the sidebar will convert to a dialog-based sidebar */
adaptiveBreakpoint?: number;
/** The time in milliseconds for the sidebar to animate */
animationTimeout?: number;
/** The background color of the sidebar */
backgroundColor?: "white" | "black" | "app";
/** The color to use for the left-hand border of the sidebar. Should be a design token e.g. `--colorsUtilityYang100` */
borderColor?: string | "none";
/** The content of the sidebar */
children?: React.ReactNode;
/** The height of the sidebar, relative to the wrapping component */
height?: string;
/** Whether the sidebar is hidden from view. In this state, the adaptive sidebar will continue to receive updates, etc. but will not be visible to users */
hidden?: boolean;
/** Whether the sidebar is open or closed */
open: boolean;
/** Whether to render the sidebar as a modal component instead of as an inline sidebar */
renderAsModal?: boolean;
/** Prop to specify the aria-label of the component, applied when the component is rendered as a modal */
"aria-label"?: string;
/** Prop to specify the aria-labelledby property of the component, applied when the component is rendered as a modal */
"aria-labelledby"?: string;
/** The width of the sidebar */
width?: string;
}
export declare const AdaptiveSidebar: ({ adaptiveBreakpoint, backgroundColor, borderColor, children, height, hidden, open, renderAsModal, width, restoreFocusOnClose, "aria-label": ariaLabel, "aria-labelledby": ariaLabelledBy, ...props }: AdaptiveSidebarProps) => React.JSX.Element | null;
export default AdaptiveSidebar;