@yamada-ui/react/dist/types/components/drawer/drawer.d.ts

React UI components of the Yamada, by the Yamada, for the Yamada built with React and Emotion

import { ThemeProps } from "../../core/system/index.types.js";
import { Component, HTMLStyledProps } from "../../core/components/index.types.js";
import "../../core/index.js";
import { HTMLMotionProps, MotionTransitionProps } from "../motion/index.types.js";
import { PortalProps } from "../portal/portal.js";
import { ButtonProps } from "../button/button.js";
import { CloseButtonProps } from "../close-button/close-button.js";
import { DrawerStyle } from "./drawer.style.js";
import { FocusLockProps } from "../focus-lock/focus-lock.js";
import { UseDrawerProps } from "./use-drawer.js";
import "../../index.js";
import * as react892 from "react";
import { FC, PropsWithChildren, ReactNode } from "react";

//#region src/components/drawer/drawer.d.ts
interface DrawerRootProps extends ThemeProps<DrawerStyle>, Omit<UseDrawerProps, "placement" | "title">, Pick<FocusLockProps, "autoFocus" | "finalFocusRef" | "initialFocusRef" | "lockFocusAcrossFrames" | "restoreFocus">, ShorthandDrawerContentProps {
  /**
   * Handle zoom or pinch gestures on iOS devices when scroll locking is enabled.
   *
   * @default false.
   */
  allowPinchZoom?: boolean;
  /**
   * If `true`, scrolling will be disabled on the `body` when the drawer opens.
   *
   * @default true
   */
  blockScrollOnMount?: boolean;
  /**
   * The animation duration.
   */
  duration?: MotionTransitionProps["duration"];
  /**
   * The modal trigger to use.
   */
  trigger?: ReactNode;
  /**
   * If `true`, display the drawer close button.
   *
   * @default true
   */
  withCloseButton?: boolean;
  /**
   * If `true`, display the drag bar when `closeOnDrag` is `true`.
   *
   * @default true
   */
  withDragBar?: boolean;
  /**
   * If `true`, display the drawer overlay.
   *
   * @default true
   */
  withOverlay?: boolean;
  /**
   * Props to be forwarded to the portal component.
   */
  portalProps?: Omit<PortalProps, "children">;
  /**
   * Callback function to run side effects after the drawer has closed.
   */
  onCloseComplete?: () => void;
}
declare const DrawerPropsContext: react892.Context<Partial<DrawerRootProps> | undefined>, useDrawerPropsContext: () => Partial<DrawerRootProps> | undefined;
/**
 * `Drawer` is a component for a panel that appears from the edge of the screen.
 *
 * @see https://yamada-ui.com/docs/components/drawer
 */
declare const DrawerRoot: Component<"div", DrawerRootProps>;
interface DrawerOpenTriggerProps extends HTMLStyledProps<"button"> {}
declare const DrawerOpenTrigger: Component<"button", DrawerOpenTriggerProps>;
interface DrawerCloseTriggerProps extends HTMLStyledProps<"button"> {}
declare const DrawerCloseTrigger: Component<"button", DrawerCloseTriggerProps>;
interface DrawerCloseButtonProps extends CloseButtonProps {}
declare const DrawerCloseButton: Component<"button", DrawerCloseButtonProps>;
interface DrawerOverlayProps extends HTMLMotionProps {}
declare const DrawerOverlay: Component<"div", DrawerOverlayProps>;
interface DrawerContentProps extends Omit<HTMLMotionProps<"section">, "children">, PropsWithChildren {}
declare const DrawerContent: Component<"div", DrawerContentProps>;
interface ShorthandDrawerContentProps {
  /**
   * The drawer body to use.
   */
  body?: DrawerBodyProps | ReactNode;
  /**
   * The drawer cancel button to use.
   */
  cancel?: ButtonProps | ReactNode;
  /**
   * The drawer footer to use.
   */
  footer?: DrawerFooterProps | ReactNode;
  /**
   * The drawer header to use.
   */
  header?: DrawerHeaderProps | ReactNode;
  /**
   * The drawer middle button to use.
   */
  middle?: ButtonProps | ReactNode;
  /**
   * The drawer success button to use.
   */
  success?: ButtonProps | ReactNode;
  /**
   * The drawer title to use.
   */
  title?: DrawerTitleProps | ReactNode;
  /**
   * The callback invoked when cancel button clicked.
   */
  onCancel?: (onClose: () => void) => void;
  /**
   * The callback invoked when middle button clicked.
   */
  onMiddle?: (onClose: () => void) => void;
  /**
   * The callback invoked when success button clicked.
   */
  onSuccess?: (onClose: () => void) => void;
}
interface DrawerDragBarProps extends HTMLStyledProps {}
declare const DrawerDragBar: Component<"div", DrawerDragBarProps>;
interface DrawerHeaderProps extends HTMLStyledProps<"header"> {}
declare const DrawerHeader: Component<"header", DrawerHeaderProps>;
interface DrawerTitleProps extends HTMLStyledProps<"h2"> {}
declare const DrawerTitle: Component<"h2", DrawerTitleProps>;
interface DrawerBodyProps extends HTMLStyledProps {}
declare const DrawerBody: Component<"div", DrawerBodyProps>;
interface DrawerFooterProps extends HTMLStyledProps<"footer"> {}
declare const DrawerFooter: Component<"footer", DrawerFooterProps>;
//#endregion
export { DrawerBody, DrawerBodyProps, DrawerCloseButton, DrawerCloseButtonProps, DrawerCloseTrigger, DrawerCloseTriggerProps, DrawerContent, DrawerContentProps, DrawerDragBar, DrawerDragBarProps, DrawerFooter, DrawerFooterProps, DrawerHeader, DrawerHeaderProps, DrawerOpenTrigger, DrawerOpenTriggerProps, DrawerOverlay, DrawerOverlayProps, DrawerPropsContext, DrawerRoot, DrawerRootProps, DrawerTitle, DrawerTitleProps, useDrawerPropsContext };
//# sourceMappingURL=drawer.d.ts.map