@yamada-ui/modal 1.0.19 → 1.1.0-dev-20240318070341

package/dist/drawer.d.ts

@@ -1,4 +1,4 @@
-import * as _yamada_ui_close_button from '@yamada-ui/close-button';
+import * as _yamada_ui_react from '@yamada-ui/react';
 import * as _yamada_ui_core from '@yamada-ui/core';
 import { ThemeProps } from '@yamada-ui/core';
 import { SlideProps } from '@yamada-ui/transitions';
@@ -11,6 +11,7 @@ import { ModalFooterProps } from './modal-footer.js';
 import '@yamada-ui/focus-lock';
 import '@yamada-ui/motion';
 import '@yamada-ui/portal';
+import '@yamada-ui/close-button';
 
 type DrawerOptions = {
     /**
@@ -23,6 +24,12 @@ type DrawerOptions = {
      * If `true` and drawer's placement is `top` or `bottom`, the drawer will occupy the viewport height (100dvh).
      */
     isFullHeight?: boolean;
+    /**
+     * If `true` then the drawer will close on drag.
+     *
+     * @default false
+     */
+    closeOnDrag?: boolean;
 };
 type DrawerProps = Omit<ModalProps, "scrollBehavior" | "animation" | "outside" | "placement" | keyof ThemeProps> & ThemeProps<"Drawer"> & DrawerOptions;
 /**
@@ -36,7 +43,7 @@ declare const DrawerContent: _yamada_ui_core.Component<"div", DrawerContentProps
 type DrawerOverlayProps = ModalOverlayProps;
 declare const DrawerOverlay: _yamada_ui_core.Component<"div", ModalOverlayProps>;
 type DrawerCloseButtonProps = ModalCloseButtonProps;
-declare const DrawerCloseButton: _yamada_ui_core.Component<"button", _yamada_ui_close_button.CloseButtonProps>;
+declare const DrawerCloseButton: _yamada_ui_core.Component<"button", _yamada_ui_react.CloseButtonProps>;
 type DrawerHeaderProps = ModalHeaderProps;
 declare const DrawerHeader: _yamada_ui_core.Component<"header", ModalHeaderProps>;
 type DrawerBodyProps = ModalBodyProps;

package/dist/drawer.js

@@ -33,6 +33,7 @@ module.exports = __toCommonJS(drawer_exports);
 var import_core8 = require("@yamada-ui/core");
 var import_transitions3 = require("@yamada-ui/transitions");
 var import_utils8 = require("@yamada-ui/utils");
+var import_react2 = require("react");
 
 // src/modal.tsx
 var import_core7 = require("@yamada-ui/core");
@@ -577,7 +578,7 @@ var [DrawerProvider, useDrawer] = (0, import_utils8.createContext)({
   errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in "<Drawer />" `
 });
 var Drawer = (0, import_core8.forwardRef)(
-  ({ size, placement = "right", ...props }, ref) => {
+  ({ size, placement = "right", closeOnDrag, ...props }, ref) => {
     const [styles, mergedProps] = (0, import_core8.useMultiComponentStyle)("Drawer", {
       size,
       placement,
@@ -639,6 +640,7 @@ var Drawer = (0, import_core8.forwardRef)(
           /* @__PURE__ */ (0, import_jsx_runtime8.jsx)(
             DrawerContent,
             {
+              closeOnDrag,
               ...{
                 withCloseButton,
                 ...(0, import_utils8.omitObject)(rest, ["isFullHeight"]),
@@ -653,7 +655,7 @@ var Drawer = (0, import_core8.forwardRef)(
   }
 );
 var DrawerContent = (0, import_core8.forwardRef)(
-  ({ className, children, placement, withCloseButton, ...rest }, ref) => {
+  ({ className, children, placement, withCloseButton, closeOnDrag, ...rest }, ref) => {
     const { isOpen, onClose, duration } = useModal();
     const styles = useDrawer();
     const validChildren = (0, import_utils8.getValidChildren)(children);
@@ -668,10 +670,57 @@ var DrawerContent = (0, import_core8.forwardRef)(
       outline: 0,
       ...styles.container
     };
+    const getDragDirectionRestriction = (0, import_react2.useCallback)(() => {
+      switch (placement) {
+        case "top":
+          return { bottom: 0 };
+        case "bottom":
+          return { top: 0 };
+        case "left":
+          return { right: 0 };
+        case "right":
+          return { left: 0 };
+      }
+    }, [placement]);
+    const getDragDirection = (0, import_react2.useCallback)(() => {
+      switch (placement) {
+        case "top":
+        case "bottom":
+          return "y";
+        case "left":
+        case "right":
+          return "x";
+      }
+    }, [placement]);
+    const isCloseByDragInfo = (0, import_react2.useCallback)(
+      (info) => {
+        switch (placement) {
+          case "top":
+            return info.velocity.y <= -100 || info.offset.y <= -80;
+          case "bottom":
+            return info.velocity.y >= 100 || info.offset.y >= 80;
+          case "left":
+            return info.velocity.x <= -100 || info.offset.x <= -80;
+          case "right":
+            return info.velocity.x >= 100 || info.offset.x >= 80;
+        }
+      },
+      [placement]
+    );
     return /* @__PURE__ */ (0, import_jsx_runtime8.jsxs)(
       import_transitions3.Slide,
       {
         ref,
+        drag: closeOnDrag ? getDragDirection() : false,
+        dragConstraints: getDragDirectionRestriction(),
+        dragElastic: getDragDirectionRestriction(),
+        dragSnapToOrigin: true,
+        dragMomentum: false,
+        onDragEnd: (_, info) => {
+          if (isCloseByDragInfo(info)) {
+            onClose == null ? void 0 : onClose();
+          }
+        },
         className: (0, import_utils8.cx)("ui-drawer", className),
         tabIndex: -1,
         isOpen,

package/dist/drawer.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/drawer.tsx","../src/modal.tsx","../src/modal-overlay.tsx","../src/modal-close-button.tsx","../src/modal-header.tsx","../src/modal-body.tsx","../src/modal-footer.tsx","../src/dialog.tsx"],"sourcesContent":["import type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  useMultiComponentStyle,\n  omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { SlideProps } from \"@yamada-ui/transitions\"\nimport { Slide } from \"@yamada-ui/transitions\"\nimport {\n  createContext,\n  getValidChildren,\n  findChildren,\n  cx,\n  omitObject,\n} from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\nimport type {\n  ModalProps,\n  ModalOverlayProps,\n  ModalCloseButtonProps,\n  ModalHeaderProps,\n  ModalBodyProps,\n  ModalFooterProps,\n} from \"./\"\nimport {\n  Modal,\n  ModalOverlay,\n  ModalCloseButton,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n} from \"./\"\n\ntype DrawerOptions = {\n  /**\n   * The placement of the drawer.\n   *\n   * @default 'right'\n   */\n  placement?: SlideProps[\"placement\"]\n  /**\n   * If `true` and drawer's placement is `top` or `bottom`, the drawer will occupy the viewport height (100dvh).\n   */\n  isFullHeight?: boolean\n}\n\nexport type DrawerProps = Omit<\n  ModalProps,\n  \"scrollBehavior\" | \"animation\" | \"outside\" | \"placement\" | keyof ThemeProps\n> &\n  ThemeProps<\"Drawer\"> &\n  DrawerOptions\n\ntype DrawerContext = Record<string, CSSUIObject>\n\nconst [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n\n/**\n * `Drawer` is a component for a panel that appears from the edge of the screen.\n *\n * @see Docs https://yamada-ui.com/components/overlay/drawer\n */\nexport const Drawer = forwardRef<DrawerProps, \"div\">(\n  ({ size, placement = \"right\", ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Drawer\", {\n      size,\n      placement,\n      ...props,\n    })\n    const {\n      children,\n      isOpen,\n      onClose,\n      onOverlayClick,\n      onEsc,\n      onCloseComplete,\n      withCloseButton = true,\n      withOverlay = true,\n      allowPinchZoom,\n      autoFocus,\n      restoreFocus,\n      initialFocusRef,\n      finalFocusRef,\n      blockScrollOnMount,\n      closeOnOverlay,\n      closeOnEsc,\n      lockFocusAcrossFrames,\n      duration = { enter: 0.4, exit: 0.3 },\n      portalProps,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const validChildren = getValidChildren(children)\n\n    const [customDrawerOverlay, ...cloneChildren] = findChildren(\n      validChildren,\n      DrawerOverlay,\n    )\n\n    return (\n      <DrawerProvider value={styles}>\n        <Modal\n          ref={ref}\n          {...{\n            isOpen,\n            onClose,\n            onOverlayClick,\n            onEsc,\n            onCloseComplete,\n            withCloseButton: false,\n            withOverlay: false,\n            allowPinchZoom,\n            autoFocus,\n            restoreFocus,\n            initialFocusRef,\n            finalFocusRef,\n            blockScrollOnMount,\n            closeOnOverlay,\n            closeOnEsc,\n            lockFocusAcrossFrames,\n            duration,\n            portalProps,\n          }}\n        >\n          {customDrawerOverlay ?? (withOverlay ? <DrawerOverlay /> : null)}\n\n          <DrawerContent\n            {...{\n              withCloseButton,\n              ...omitObject(rest, [\"isFullHeight\"]),\n              placement,\n            }}\n          >\n            {cloneChildren}\n          </DrawerContent>\n        </Modal>\n      </DrawerProvider>\n    )\n  },\n)\n\ntype DrawerContentProps = Omit<\n  DrawerProps,\n  \"color\" | \"transition\" | \"isOpen\" | keyof ThemeProps\n>\n\nexport const DrawerContent = forwardRef<DrawerContentProps, \"div\", false>(\n  ({ className, children, placement, withCloseButton, ...rest }, ref) => {\n    const { isOpen, onClose, duration } = useModal()\n    const styles = useDrawer()\n\n    const validChildren = getValidChildren(children)\n\n    const [customDrawerCloseButton, ...cloneChildren] = findChildren(\n      validChildren,\n      DrawerCloseButton,\n    )\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      flexDirection: \"column\",\n      width: \"100%\",\n      outline: 0,\n      ...styles.container,\n    }\n\n    return (\n      <Slide\n        ref={ref}\n        className={cx(\"ui-drawer\", className)}\n        tabIndex={-1}\n        isOpen={isOpen}\n        placement={placement}\n        duration={duration}\n        __css={css}\n        {...rest}\n      >\n        {customDrawerCloseButton ??\n          (withCloseButton && onClose ? <DrawerCloseButton /> : null)}\n\n        {cloneChildren}\n      </Slide>\n    )\n  },\n)\n\nexport type DrawerOverlayProps = ModalOverlayProps\n\nexport const DrawerOverlay = forwardRef<DrawerOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-drawer__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerCloseButtonProps = ModalCloseButtonProps\n\nexport const DrawerCloseButton = forwardRef<DrawerCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-drawer__close-button\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerHeaderProps = ModalHeaderProps\n\nexport const DrawerHeader = forwardRef<DrawerHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-drawer__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerBodyProps = ModalBodyProps\n\nexport const DrawerBody = forwardRef<DrawerBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-drawer__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerFooterProps = ModalFooterProps\n\nexport const DrawerFooter = forwardRef<DrawerFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-drawer__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type {\n  ThemeProps,\n  CSSUIObject,\n  CSSUIProps,\n  Token,\n} from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  omitThemeProps,\n  useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FocusLockProps } from \"@yamada-ui/focus-lock\"\nimport { FocusLock } from \"@yamada-ui/focus-lock\"\nimport type { MotionProps, MotionTransitionProperties } from \"@yamada-ui/motion\"\nimport { AnimatePresence, Motion } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { scaleFadeProps, slideFadeProps } from \"@yamada-ui/transitions\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n  cx,\n  createContext,\n  getValidChildren,\n  findChildren,\n} from \"@yamada-ui/utils\"\nimport type { KeyboardEvent } from \"react\"\nimport { cloneElement, useCallback } from \"react\"\nimport { RemoveScroll } from \"react-remove-scroll\"\nimport { DrawerContent } from \"./drawer\"\nimport {\n  DrawerOverlay,\n  DialogOverlay,\n  DialogCloseButton,\n  ModalOverlay,\n  ModalCloseButton,\n} from \"./\"\n\ntype ModalContext = ModalOptions & {\n  styles: Record<string, CSSUIObject>\n}\n\nconst [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\nexport { useModal }\n\ntype ModalOptions = Pick<\n  FocusLockProps,\n  | \"autoFocus\"\n  | \"initialFocusRef\"\n  | \"finalFocusRef\"\n  | \"restoreFocus\"\n  | \"lockFocusAcrossFrames\"\n> & {\n  /**\n   * If `true`, the open will be opened.\n   */\n  isOpen: boolean\n  /**\n   * Callback invoked to close the modal.\n   */\n  onClose?: () => void\n  /**\n   * Callback fired when the overlay is clicked.\n   */\n  onOverlayClick?: () => void\n  /**\n   * Callback fired when the escape key is pressed and focus is within modal.\n   */\n  onEsc?(): void\n  /**\n   * Callback function to run side effects after the modal has closed.\n   */\n  onCloseComplete?: () => void\n  /**\n   * The placement of the modal.\n   *\n   * @default 'center'\n   */\n  placement?: Token<\n    | \"center\"\n    | \"top\"\n    | \"right\"\n    | \"bottom\"\n    | \"left\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n  >\n  /**\n   * The CSS `padding` property.\n   */\n  outside?: CSSUIProps[\"p\"]\n  /**\n   * If `true`, display the modal close button.\n   *\n   * @default true\n   */\n  withCloseButton?: boolean\n  /**\n   * If `true`, display the modal overlay.\n   *\n   * @default true\n   */\n  withOverlay?: boolean\n  /**\n   * Handle zoom or pinch gestures on iOS devices when scroll locking is enabled.\n   *\n   * @default false.\n   */\n  allowPinchZoom?: boolean\n  /**\n   * Where scroll behavior should originate.\n   *\n   * - `inside`: scroll only occurs within the `ModalBody`.\n   * - `outside`: the entire `ModalContent` will scroll within the viewport.\n   *\n   * @default 'inside'\n   */\n  scrollBehavior?: \"inside\" | \"outside\"\n  /**\n   * If `true`, scrolling will be disabled on the `body` when the modal opens.\n   *\n   * @default true\n   */\n  blockScrollOnMount?: boolean\n  /**\n   * If `true`, the modal will close when the overlay is clicked.\n   *\n   * @default true\n   */\n  closeOnOverlay?: boolean\n  /**\n   * If `true`, the modal will close when the `Esc` key is pressed.\n   *\n   * @default true\n   */\n  closeOnEsc?: boolean\n  /**\n   * The animation of the tooltip.\n   *\n   * @default 'scale'\n   */\n  animation?: \"scale\" | \"top\" | \"right\" | \"left\" | \"bottom\" | \"none\"\n  /**\n   * The animation duration.\n   */\n  duration?: MotionTransitionProperties[\"duration\"]\n  /**\n   * Props to be forwarded to the portal component.\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport type ModalProps = Omit<\n  MotionProps<\"section\">,\n  \"scrollBehavior\" | \"animation\" | \"color\" | \"transition\"\n> &\n  ThemeProps<\"Modal\"> &\n  ModalOptions\n\n/**\n * `Modal` is a component that is displayed over the main content to focus the user's attention solely on the information.\n *\n * @see Docs https://yamada-ui.com/components/overlay/modal\n */\nexport const Modal = forwardRef<ModalProps, \"section\">(\n  ({ size, ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Modal\", {\n      size,\n      ...props,\n    })\n    const {\n      className,\n      children,\n      isOpen,\n      onClose,\n      onOverlayClick,\n      onEsc,\n      onCloseComplete,\n      placement: _placement = \"center\",\n      outside = \"1rem\",\n      withCloseButton = true,\n      withOverlay = true,\n      allowPinchZoom = false,\n      scrollBehavior = \"inside\",\n      autoFocus,\n      restoreFocus,\n      initialFocusRef,\n      finalFocusRef,\n      blockScrollOnMount = true,\n      closeOnOverlay = true,\n      closeOnEsc = true,\n      lockFocusAcrossFrames = true,\n      animation = \"scale\",\n      duration,\n      portalProps,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const onKeyDown = useCallback(\n      (ev: KeyboardEvent) => {\n        if (ev.key !== \"Escape\") return\n\n        ev.stopPropagation()\n\n        if (closeOnEsc) onClose?.()\n\n        onEsc?.()\n      },\n      [closeOnEsc, onClose, onEsc],\n    )\n\n    const validChildren = getValidChildren(children)\n\n    const [customModalOverlay, ...cloneChildren] = findChildren(\n      validChildren,\n      ModalOverlay,\n      DialogOverlay,\n      DrawerOverlay,\n    )\n\n    let [drawerContent] = findChildren(validChildren, DrawerContent)\n\n    if (drawerContent)\n      drawerContent = cloneElement(drawerContent, { onKeyDown })\n\n    const placement = useValue(_placement)\n\n    const css: CSSUIObject = {\n      position: \"fixed\",\n      top: 0,\n      left: 0,\n      zIndex: 110,\n      w: \"100vw\",\n      h: \"100dvh\",\n      p: size !== \"full\" ? outside : undefined,\n      display: \"flex\",\n      justifyContent: placement.includes(\"left\")\n        ? \"flex-start\"\n        : placement.includes(\"right\")\n          ? \"flex-end\"\n          : \"center\",\n      alignItems: placement.includes(\"top\")\n        ? \"flex-start\"\n        : placement.includes(\"bottom\")\n          ? \"flex-end\"\n          : \"center\",\n    }\n\n    return (\n      <ModalProvider\n        value={{\n          isOpen,\n          onClose,\n          onOverlayClick,\n          withCloseButton,\n          scrollBehavior,\n          closeOnOverlay,\n          animation,\n          duration,\n          styles,\n        }}\n      >\n        <AnimatePresence onExitComplete={onCloseComplete}>\n          {isOpen ? (\n            <Portal {...portalProps}>\n              <FocusLock\n                autoFocus={autoFocus}\n                initialFocusRef={initialFocusRef}\n                finalFocusRef={finalFocusRef}\n                restoreFocus={restoreFocus}\n                lockFocusAcrossFrames={lockFocusAcrossFrames}\n              >\n                <RemoveScroll\n                  allowPinchZoom={allowPinchZoom}\n                  enabled={blockScrollOnMount}\n                  forwardProps\n                >\n                  <ui.div __css={css}>\n                    {customModalOverlay ??\n                      (withOverlay && size !== \"full\" ? (\n                        <ModalOverlay />\n                      ) : null)}\n\n                    {drawerContent ?? (\n                      <ModalContent\n                        ref={ref}\n                        className={className}\n                        onKeyDown={onKeyDown}\n                        {...rest}\n                      >\n                        {cloneChildren}\n                      </ModalContent>\n                    )}\n                  </ui.div>\n                </RemoveScroll>\n              </FocusLock>\n            </Portal>\n          ) : null}\n        </AnimatePresence>\n      </ModalProvider>\n    )\n  },\n)\n\ntype ModalContentProps = Omit<\n  MotionProps<\"section\">,\n  \"scrollBehavior\" | \"animation\" | \"color\" | \"transition\"\n>\n\nconst getModalContentProps = (\n  animation: ModalProps[\"animation\"] = \"scale\",\n  duration?: MotionTransitionProperties[\"duration\"],\n) => {\n  switch (animation) {\n    case \"scale\":\n      return {\n        ...scaleFadeProps,\n        custom: { scale: 0.95, reverse: true, duration },\n      }\n    case \"top\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetY: -16, reverse: true, duration },\n      }\n    case \"right\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetX: 16, reverse: true, duration },\n      }\n    case \"left\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetX: -16, reverse: true, duration },\n      }\n    case \"bottom\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetY: 16, reverse: true, duration },\n      }\n  }\n}\n\nconst ModalContent = forwardRef<ModalContentProps, \"section\", false>(\n  ({ className, children, __css, ...rest }, ref) => {\n    const {\n      styles,\n      scrollBehavior,\n      withCloseButton,\n      onClose,\n      animation,\n      duration,\n    } = useModal()\n\n    const validChildren = getValidChildren(children)\n\n    const [customModalCloseButton, ...cloneChildren] = findChildren(\n      validChildren,\n      ModalCloseButton,\n      DialogCloseButton,\n    )\n\n    const props =\n      animation !== \"none\" ? getModalContentProps(animation, duration) : {}\n\n    const css: CSSUIObject = {\n      position: \"relative\",\n      maxH: \"100%\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      overflow: scrollBehavior === \"inside\" ? \"hidden\" : \"auto\",\n      outline: 0,\n      ...(__css ? __css : styles.container),\n    }\n\n    return (\n      <Motion\n        as=\"section\"\n        ref={ref}\n        className={cx(\"ui-modal\", className)}\n        tabIndex={-1}\n        __css={css}\n        {...props}\n        {...rest}\n      >\n        {customModalCloseButton ??\n          (withCloseButton && onClose ? <ModalCloseButton /> : null)}\n\n        {cloneChildren}\n      </Motion>\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport { motion } from \"@yamada-ui/motion\"\nimport { fadeProps } from \"@yamada-ui/transitions\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalOverlayProps = HTMLUIProps<\"div\"> &\n  Omit<HTMLMotionProps<\"div\">, \"color\" | \"transition\">\n\nexport const ModalOverlay = forwardRef<ModalOverlayProps, \"div\">(\n  ({ className, __css, onClick, ...rest }, ref) => {\n    const {\n      styles,\n      closeOnOverlay,\n      onOverlayClick,\n      onClose,\n      animation,\n      duration,\n    } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"fixed\",\n      top: 0,\n      left: 0,\n      w: \"100vw\",\n      h: \"100vh\",\n      ...(__css ? __css : styles.overlay),\n    }\n\n    const props = animation !== \"none\" ? fadeProps : {}\n\n    return (\n      <ui.div\n        as={motion.div}\n        ref={ref}\n        className={cx(\"ui-modal__overlay\", className)}\n        custom={{ duration }}\n        __css={css}\n        onClick={handlerAll(onClick, onOverlayClick, (ev) => {\n          ev.stopPropagation()\n          if (closeOnOverlay) onClose?.()\n        })}\n        {...props}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport { CloseButton } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalCloseButtonProps = CloseButtonProps\n\nexport const ModalCloseButton = forwardRef<ModalCloseButtonProps, \"button\">(\n  ({ onClick, __css, ...rest }, ref) => {\n    const { styles, onClose } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"absolute\",\n      ...(__css ? __css : styles.closeButton),\n    }\n\n    return (\n      <CloseButton\n        ref={ref}\n        className={cx(\"ui-modal__close-button\")}\n        __css={css}\n        onClick={handlerAll(onClick, (ev) => {\n          ev.stopPropagation()\n          onClose?.()\n        })}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalHeaderProps = HTMLUIProps<\"header\">\n\nexport const ModalHeader = forwardRef<ModalHeaderProps, \"header\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"flex-start\",\n      ...(__css ? __css : styles.header),\n    }\n\n    return (\n      <ui.header\n        ref={ref}\n        className={cx(\"ui-modal__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalBodyProps = HTMLUIProps<\"main\">\n\nexport const ModalBody = forwardRef<ModalBodyProps, \"main\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles, scrollBehavior } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      flexDirection: \"column\",\n      alignItems: \"flex-start\",\n      overflow: scrollBehavior === \"inside\" ? \"auto\" : undefined,\n      ...(__css ? __css : styles.body),\n    }\n\n    return (\n      <ui.main\n        ref={ref}\n        className={cx(\"ui-modal__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalFooterProps = HTMLUIProps<\"footer\">\n\nexport const ModalFooter = forwardRef<ModalFooterProps, \"footer\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"flex-end\",\n      ...(__css ? __css : styles.footer),\n    }\n\n    return (\n      <ui.footer\n        ref={ref}\n        className={cx(\"ui-modal__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { ButtonProps } from \"@yamada-ui/button\"\nimport { Button } from \"@yamada-ui/button\"\nimport type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  useMultiComponentStyle,\n  omitThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n  createContext,\n  getValidChildren,\n  findChildren,\n  omitChildren,\n  isValidElement,\n  isEmpty,\n  cx,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport type {\n  ModalProps,\n  ModalOverlayProps,\n  ModalHeaderProps,\n  ModalBodyProps,\n  ModalFooterProps,\n} from \"./\"\nimport {\n  Modal,\n  ModalOverlay,\n  ModalCloseButton,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n} from \"./\"\n\ntype DialogOptions = {\n  /**\n   * The dialog header to use.\n   */\n  header?: ReactNode\n  /**\n   * The dialog footer to use.\n   */\n  footer?: ReactNode\n  /**\n   * The dialog cancel to use.\n   */\n  cancel?: ReactNode | ButtonProps\n  /**\n   * The dialog other to use.\n   */\n  other?: ReactNode | ButtonProps\n  /**\n   * The dialog success to use.\n   */\n  success?: ReactNode | ButtonProps\n  /**\n   * The callback invoked when cancel button clicked.\n   */\n  onCancel?: (onClose: (() => void) | undefined) => void\n  /**\n   * The callback invoked when other button clicked.\n   */\n  onOther?: (onClose: (() => void) | undefined) => void\n  /**\n   * The callback invoked when success button clicked.\n   */\n  onSuccess?: (onClose: (() => void) | undefined) => void\n}\n\nexport type DialogProps = Omit<ModalProps, keyof ThemeProps> &\n  ThemeProps<\"Dialog\"> &\n  DialogOptions\n\ntype DialogContext = Record<string, CSSUIObject>\n\nconst [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\n/**\n * `Dialog` is a component used to confirm or interrupt user actions.\n *\n * @see Docs https://yamada-ui.com/components/overlay/dialog\n */\nexport const Dialog = forwardRef<DialogProps, \"section\", false>(\n  ({ size, ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Dialog\", {\n      size,\n      ...props,\n    })\n    const {\n      className,\n      children,\n      withOverlay = true,\n      withCloseButton = true,\n      header,\n      footer,\n      cancel,\n      other,\n      success,\n      onClose,\n      onCancel,\n      onOther,\n      onSuccess,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const validChildren = getValidChildren(children)\n\n    const [customDialogOverlay] = findChildren(validChildren, DialogOverlay)\n    const [customDialogCloseButton] = findChildren(\n      validChildren,\n      DialogCloseButton,\n    )\n    const [customDialogHeader] = findChildren(validChildren, DialogHeader)\n    const [customDialogBody] = findChildren(validChildren, DialogBody)\n    const [customDialogFooter] = findChildren(validChildren, DialogFooter)\n\n    const cloneChildren = !isEmpty(validChildren)\n      ? omitChildren(\n          validChildren,\n          DialogOverlay,\n          DialogCloseButton,\n          DialogHeader,\n          DialogBody,\n          DialogFooter,\n        )\n      : children\n\n    const css: CSSUIObject = { ...styles.container }\n\n    const cancelButtonProps: ButtonProps = isValidElement(cancel)\n      ? { children: cancel }\n      : cancel\n    const otherButtonProps: ButtonProps = isValidElement(other)\n      ? { children: other }\n      : other\n    const successButtonProps: ButtonProps = isValidElement(success)\n      ? { children: success }\n      : success\n\n    if (cancelButtonProps && !cancelButtonProps.variant)\n      cancelButtonProps.variant = \"ghost\"\n    if (otherButtonProps && !otherButtonProps.colorScheme)\n      otherButtonProps.colorScheme = \"secondary\"\n    if (successButtonProps && !successButtonProps.colorScheme)\n      successButtonProps.colorScheme = \"primary\"\n\n    return (\n      <DialogProvider value={styles}>\n        <Modal\n          ref={ref}\n          className={cx(\"ui-dialog\", className)}\n          __css={css}\n          {...{\n            size,\n            onClose,\n            withOverlay: false,\n            withCloseButton: false,\n            ...rest,\n          }}\n        >\n          {customDialogOverlay ??\n            (withOverlay && size !== \"full\" ? <DialogOverlay /> : null)}\n          {customDialogCloseButton ??\n            (withCloseButton && onClose ? <DialogCloseButton /> : null)}\n          {customDialogHeader ??\n            (header ? <DialogHeader>{header}</DialogHeader> : null)}\n          {customDialogBody ??\n            (cloneChildren ? <DialogBody>{cloneChildren}</DialogBody> : null)}\n          {customDialogFooter ??\n            (footer ||\n            cancelButtonProps ||\n            otherButtonProps ||\n            successButtonProps ? (\n              <DialogFooter>\n                {footer ?? (\n                  <>\n                    {cancelButtonProps ? (\n                      <Button\n                        onClick={() => onCancel?.(onClose)}\n                        {...cancelButtonProps}\n                      />\n                    ) : null}\n                    {otherButtonProps ? (\n                      <Button\n                        onClick={() => onOther?.(onClose)}\n                        {...otherButtonProps}\n                      />\n                    ) : null}\n                    {successButtonProps ? (\n                      <Button\n                        onClick={() => onSuccess?.(onClose)}\n                        {...successButtonProps}\n                      />\n                    ) : null}\n                  </>\n                )}\n              </DialogFooter>\n            ) : null)}\n        </Modal>\n      </DialogProvider>\n    )\n  },\n)\n\nexport type DialogOverlayProps = ModalOverlayProps\n\nexport const DialogOverlay = forwardRef<DialogOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-dialog__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogCloseButtonProps = CloseButtonProps\n\nexport const DialogCloseButton = forwardRef<DialogCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-dialog__close-button\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogHeaderProps = ModalHeaderProps\n\nexport const DialogHeader = forwardRef<DialogHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-dialog__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogBodyProps = ModalBodyProps\n\nexport const DialogBody = forwardRef<DialogBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-dialog__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogFooterProps = ModalFooterProps\n\nexport const DialogFooter = forwardRef<DialogFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-dialog__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n"],"mappings":"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","names":["import_core","import_transitions","import_utils","import_core","import_motion","import_transitions","import_utils","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}
+{"version":3,"sources":["../src/drawer.tsx","../src/modal.tsx","../src/modal-overlay.tsx","../src/modal-close-button.tsx","../src/modal-header.tsx","../src/modal-body.tsx","../src/modal-footer.tsx","../src/dialog.tsx"],"sourcesContent":["import type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  useMultiComponentStyle,\n  omitThemeProps,\n} from \"@yamada-ui/core\"\nimport type { PanEventInfo } from \"@yamada-ui/react\"\nimport type { SlideProps } from \"@yamada-ui/transitions\"\nimport { Slide } from \"@yamada-ui/transitions\"\nimport {\n  createContext,\n  getValidChildren,\n  findChildren,\n  cx,\n  omitObject,\n} from \"@yamada-ui/utils\"\nimport { useCallback } from \"react\"\nimport { useModal } from \"./modal\"\nimport type {\n  ModalProps,\n  ModalOverlayProps,\n  ModalCloseButtonProps,\n  ModalHeaderProps,\n  ModalBodyProps,\n  ModalFooterProps,\n} from \"./\"\nimport {\n  Modal,\n  ModalOverlay,\n  ModalCloseButton,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n} from \"./\"\n\ntype DrawerOptions = {\n  /**\n   * The placement of the drawer.\n   *\n   * @default 'right'\n   */\n  placement?: SlideProps[\"placement\"]\n  /**\n   * If `true` and drawer's placement is `top` or `bottom`, the drawer will occupy the viewport height (100dvh).\n   */\n  isFullHeight?: boolean\n  /**\n   * If `true` then the drawer will close on drag.\n   *\n   * @default false\n   */\n  closeOnDrag?: boolean\n}\n\nexport type DrawerProps = Omit<\n  ModalProps,\n  \"scrollBehavior\" | \"animation\" | \"outside\" | \"placement\" | keyof ThemeProps\n> &\n  ThemeProps<\"Drawer\"> &\n  DrawerOptions\n\ntype DrawerContext = Record<string, CSSUIObject>\n\nconst [DrawerProvider, useDrawer] = createContext<DrawerContext>({\n  name: `DrawerContext`,\n  errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in \"<Drawer />\" `,\n})\n\n/**\n * `Drawer` is a component for a panel that appears from the edge of the screen.\n *\n * @see Docs https://yamada-ui.com/components/overlay/drawer\n */\nexport const Drawer = forwardRef<DrawerProps, \"div\">(\n  ({ size, placement = \"right\", closeOnDrag, ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Drawer\", {\n      size,\n      placement,\n      ...props,\n    })\n    const {\n      children,\n      isOpen,\n      onClose,\n      onOverlayClick,\n      onEsc,\n      onCloseComplete,\n      withCloseButton = true,\n      withOverlay = true,\n      allowPinchZoom,\n      autoFocus,\n      restoreFocus,\n      initialFocusRef,\n      finalFocusRef,\n      blockScrollOnMount,\n      closeOnOverlay,\n      closeOnEsc,\n      lockFocusAcrossFrames,\n      duration = { enter: 0.4, exit: 0.3 },\n      portalProps,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const validChildren = getValidChildren(children)\n\n    const [customDrawerOverlay, ...cloneChildren] = findChildren(\n      validChildren,\n      DrawerOverlay,\n    )\n\n    return (\n      <DrawerProvider value={styles}>\n        <Modal\n          ref={ref}\n          {...{\n            isOpen,\n            onClose,\n            onOverlayClick,\n            onEsc,\n            onCloseComplete,\n            withCloseButton: false,\n            withOverlay: false,\n            allowPinchZoom,\n            autoFocus,\n            restoreFocus,\n            initialFocusRef,\n            finalFocusRef,\n            blockScrollOnMount,\n            closeOnOverlay,\n            closeOnEsc,\n            lockFocusAcrossFrames,\n            duration,\n            portalProps,\n          }}\n        >\n          {customDrawerOverlay ?? (withOverlay ? <DrawerOverlay /> : null)}\n\n          <DrawerContent\n            closeOnDrag={closeOnDrag}\n            {...{\n              withCloseButton,\n              ...omitObject(rest, [\"isFullHeight\"]),\n              placement,\n            }}\n          >\n            {cloneChildren}\n          </DrawerContent>\n        </Modal>\n      </DrawerProvider>\n    )\n  },\n)\n\ntype DrawerContentProps = Omit<\n  DrawerProps,\n  \"color\" | \"transition\" | \"isOpen\" | keyof ThemeProps\n>\n\nexport const DrawerContent = forwardRef<DrawerContentProps, \"div\", false>(\n  (\n    { className, children, placement, withCloseButton, closeOnDrag, ...rest },\n    ref,\n  ) => {\n    const { isOpen, onClose, duration } = useModal()\n    const styles = useDrawer()\n\n    const validChildren = getValidChildren(children)\n\n    const [customDrawerCloseButton, ...cloneChildren] = findChildren(\n      validChildren,\n      DrawerCloseButton,\n    )\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      flexDirection: \"column\",\n      width: \"100%\",\n      outline: 0,\n      ...styles.container,\n    }\n\n    const getDragDirectionRestriction = useCallback(() => {\n      switch (placement) {\n        case \"top\":\n          return { bottom: 0 }\n        case \"bottom\":\n          return { top: 0 }\n        case \"left\":\n          return { right: 0 }\n        case \"right\":\n          return { left: 0 }\n      }\n    }, [placement])\n\n    const getDragDirection = useCallback(() => {\n      switch (placement) {\n        case \"top\":\n        case \"bottom\":\n          return \"y\"\n        case \"left\":\n        case \"right\":\n          return \"x\"\n      }\n    }, [placement])\n\n    const isCloseByDragInfo = useCallback(\n      (info: PanEventInfo) => {\n        switch (placement) {\n          case \"top\":\n            return info.velocity.y <= -100 || info.offset.y <= -80\n          case \"bottom\":\n            return info.velocity.y >= 100 || info.offset.y >= 80\n          case \"left\":\n            return info.velocity.x <= -100 || info.offset.x <= -80\n          case \"right\":\n            return info.velocity.x >= 100 || info.offset.x >= 80\n        }\n      },\n      [placement],\n    )\n\n    return (\n      <Slide\n        ref={ref}\n        drag={closeOnDrag ? getDragDirection() : false}\n        dragConstraints={getDragDirectionRestriction()}\n        dragElastic={getDragDirectionRestriction()}\n        dragSnapToOrigin={true}\n        dragMomentum={false}\n        onDragEnd={(_, info) => {\n          if (isCloseByDragInfo(info)) {\n            onClose?.()\n          }\n        }}\n        className={cx(\"ui-drawer\", className)}\n        tabIndex={-1}\n        isOpen={isOpen}\n        placement={placement}\n        duration={duration}\n        __css={css}\n        {...rest}\n      >\n        {customDrawerCloseButton ??\n          (withCloseButton && onClose ? <DrawerCloseButton /> : null)}\n\n        {cloneChildren}\n      </Slide>\n    )\n  },\n)\n\nexport type DrawerOverlayProps = ModalOverlayProps\n\nexport const DrawerOverlay = forwardRef<DrawerOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-drawer__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerCloseButtonProps = ModalCloseButtonProps\n\nexport const DrawerCloseButton = forwardRef<DrawerCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-drawer__close-button\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerHeaderProps = ModalHeaderProps\n\nexport const DrawerHeader = forwardRef<DrawerHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-drawer__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerBodyProps = ModalBodyProps\n\nexport const DrawerBody = forwardRef<DrawerBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-drawer__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DrawerFooterProps = ModalFooterProps\n\nexport const DrawerFooter = forwardRef<DrawerFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDrawer()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-drawer__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type {\n  ThemeProps,\n  CSSUIObject,\n  CSSUIProps,\n  Token,\n} from \"@yamada-ui/core\"\nimport {\n  ui,\n  forwardRef,\n  omitThemeProps,\n  useMultiComponentStyle,\n} from \"@yamada-ui/core\"\nimport type { FocusLockProps } from \"@yamada-ui/focus-lock\"\nimport { FocusLock } from \"@yamada-ui/focus-lock\"\nimport type { MotionProps, MotionTransitionProperties } from \"@yamada-ui/motion\"\nimport { AnimatePresence, Motion } from \"@yamada-ui/motion\"\nimport type { PortalProps } from \"@yamada-ui/portal\"\nimport { Portal } from \"@yamada-ui/portal\"\nimport { scaleFadeProps, slideFadeProps } from \"@yamada-ui/transitions\"\nimport { useValue } from \"@yamada-ui/use-value\"\nimport {\n  cx,\n  createContext,\n  getValidChildren,\n  findChildren,\n} from \"@yamada-ui/utils\"\nimport type { KeyboardEvent } from \"react\"\nimport { cloneElement, useCallback } from \"react\"\nimport { RemoveScroll } from \"react-remove-scroll\"\nimport { DrawerContent } from \"./drawer\"\nimport {\n  DrawerOverlay,\n  DialogOverlay,\n  DialogCloseButton,\n  ModalOverlay,\n  ModalCloseButton,\n} from \"./\"\n\ntype ModalContext = ModalOptions & {\n  styles: Record<string, CSSUIObject>\n}\n\nconst [ModalProvider, useModal] = createContext<ModalContext>({\n  name: `ModalContext`,\n  errorMessage: `useModal returned is 'undefined'. Seems you forgot to wrap the components in \"<Modal />\" `,\n})\n\nexport { useModal }\n\ntype ModalOptions = Pick<\n  FocusLockProps,\n  | \"autoFocus\"\n  | \"initialFocusRef\"\n  | \"finalFocusRef\"\n  | \"restoreFocus\"\n  | \"lockFocusAcrossFrames\"\n> & {\n  /**\n   * If `true`, the open will be opened.\n   */\n  isOpen: boolean\n  /**\n   * Callback invoked to close the modal.\n   */\n  onClose?: () => void\n  /**\n   * Callback fired when the overlay is clicked.\n   */\n  onOverlayClick?: () => void\n  /**\n   * Callback fired when the escape key is pressed and focus is within modal.\n   */\n  onEsc?(): void\n  /**\n   * Callback function to run side effects after the modal has closed.\n   */\n  onCloseComplete?: () => void\n  /**\n   * The placement of the modal.\n   *\n   * @default 'center'\n   */\n  placement?: Token<\n    | \"center\"\n    | \"top\"\n    | \"right\"\n    | \"bottom\"\n    | \"left\"\n    | \"top-left\"\n    | \"top-right\"\n    | \"bottom-left\"\n    | \"bottom-right\"\n  >\n  /**\n   * The CSS `padding` property.\n   */\n  outside?: CSSUIProps[\"p\"]\n  /**\n   * If `true`, display the modal close button.\n   *\n   * @default true\n   */\n  withCloseButton?: boolean\n  /**\n   * If `true`, display the modal overlay.\n   *\n   * @default true\n   */\n  withOverlay?: boolean\n  /**\n   * Handle zoom or pinch gestures on iOS devices when scroll locking is enabled.\n   *\n   * @default false.\n   */\n  allowPinchZoom?: boolean\n  /**\n   * Where scroll behavior should originate.\n   *\n   * - `inside`: scroll only occurs within the `ModalBody`.\n   * - `outside`: the entire `ModalContent` will scroll within the viewport.\n   *\n   * @default 'inside'\n   */\n  scrollBehavior?: \"inside\" | \"outside\"\n  /**\n   * If `true`, scrolling will be disabled on the `body` when the modal opens.\n   *\n   * @default true\n   */\n  blockScrollOnMount?: boolean\n  /**\n   * If `true`, the modal will close when the overlay is clicked.\n   *\n   * @default true\n   */\n  closeOnOverlay?: boolean\n  /**\n   * If `true`, the modal will close when the `Esc` key is pressed.\n   *\n   * @default true\n   */\n  closeOnEsc?: boolean\n  /**\n   * The animation of the tooltip.\n   *\n   * @default 'scale'\n   */\n  animation?: \"scale\" | \"top\" | \"right\" | \"left\" | \"bottom\" | \"none\"\n  /**\n   * The animation duration.\n   */\n  duration?: MotionTransitionProperties[\"duration\"]\n  /**\n   * Props to be forwarded to the portal component.\n   */\n  portalProps?: Omit<PortalProps, \"children\">\n}\n\nexport type ModalProps = Omit<\n  MotionProps<\"section\">,\n  \"scrollBehavior\" | \"animation\" | \"color\" | \"transition\"\n> &\n  ThemeProps<\"Modal\"> &\n  ModalOptions\n\n/**\n * `Modal` is a component that is displayed over the main content to focus the user's attention solely on the information.\n *\n * @see Docs https://yamada-ui.com/components/overlay/modal\n */\nexport const Modal = forwardRef<ModalProps, \"section\">(\n  ({ size, ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Modal\", {\n      size,\n      ...props,\n    })\n    const {\n      className,\n      children,\n      isOpen,\n      onClose,\n      onOverlayClick,\n      onEsc,\n      onCloseComplete,\n      placement: _placement = \"center\",\n      outside = \"1rem\",\n      withCloseButton = true,\n      withOverlay = true,\n      allowPinchZoom = false,\n      scrollBehavior = \"inside\",\n      autoFocus,\n      restoreFocus,\n      initialFocusRef,\n      finalFocusRef,\n      blockScrollOnMount = true,\n      closeOnOverlay = true,\n      closeOnEsc = true,\n      lockFocusAcrossFrames = true,\n      animation = \"scale\",\n      duration,\n      portalProps,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const onKeyDown = useCallback(\n      (ev: KeyboardEvent) => {\n        if (ev.key !== \"Escape\") return\n\n        ev.stopPropagation()\n\n        if (closeOnEsc) onClose?.()\n\n        onEsc?.()\n      },\n      [closeOnEsc, onClose, onEsc],\n    )\n\n    const validChildren = getValidChildren(children)\n\n    const [customModalOverlay, ...cloneChildren] = findChildren(\n      validChildren,\n      ModalOverlay,\n      DialogOverlay,\n      DrawerOverlay,\n    )\n\n    let [drawerContent] = findChildren(validChildren, DrawerContent)\n\n    if (drawerContent)\n      drawerContent = cloneElement(drawerContent, { onKeyDown })\n\n    const placement = useValue(_placement)\n\n    const css: CSSUIObject = {\n      position: \"fixed\",\n      top: 0,\n      left: 0,\n      zIndex: 110,\n      w: \"100vw\",\n      h: \"100dvh\",\n      p: size !== \"full\" ? outside : undefined,\n      display: \"flex\",\n      justifyContent: placement.includes(\"left\")\n        ? \"flex-start\"\n        : placement.includes(\"right\")\n          ? \"flex-end\"\n          : \"center\",\n      alignItems: placement.includes(\"top\")\n        ? \"flex-start\"\n        : placement.includes(\"bottom\")\n          ? \"flex-end\"\n          : \"center\",\n    }\n\n    return (\n      <ModalProvider\n        value={{\n          isOpen,\n          onClose,\n          onOverlayClick,\n          withCloseButton,\n          scrollBehavior,\n          closeOnOverlay,\n          animation,\n          duration,\n          styles,\n        }}\n      >\n        <AnimatePresence onExitComplete={onCloseComplete}>\n          {isOpen ? (\n            <Portal {...portalProps}>\n              <FocusLock\n                autoFocus={autoFocus}\n                initialFocusRef={initialFocusRef}\n                finalFocusRef={finalFocusRef}\n                restoreFocus={restoreFocus}\n                lockFocusAcrossFrames={lockFocusAcrossFrames}\n              >\n                <RemoveScroll\n                  allowPinchZoom={allowPinchZoom}\n                  enabled={blockScrollOnMount}\n                  forwardProps\n                >\n                  <ui.div __css={css}>\n                    {customModalOverlay ??\n                      (withOverlay && size !== \"full\" ? (\n                        <ModalOverlay />\n                      ) : null)}\n\n                    {drawerContent ?? (\n                      <ModalContent\n                        ref={ref}\n                        className={className}\n                        onKeyDown={onKeyDown}\n                        {...rest}\n                      >\n                        {cloneChildren}\n                      </ModalContent>\n                    )}\n                  </ui.div>\n                </RemoveScroll>\n              </FocusLock>\n            </Portal>\n          ) : null}\n        </AnimatePresence>\n      </ModalProvider>\n    )\n  },\n)\n\ntype ModalContentProps = Omit<\n  MotionProps<\"section\">,\n  \"scrollBehavior\" | \"animation\" | \"color\" | \"transition\"\n>\n\nconst getModalContentProps = (\n  animation: ModalProps[\"animation\"] = \"scale\",\n  duration?: MotionTransitionProperties[\"duration\"],\n) => {\n  switch (animation) {\n    case \"scale\":\n      return {\n        ...scaleFadeProps,\n        custom: { scale: 0.95, reverse: true, duration },\n      }\n    case \"top\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetY: -16, reverse: true, duration },\n      }\n    case \"right\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetX: 16, reverse: true, duration },\n      }\n    case \"left\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetX: -16, reverse: true, duration },\n      }\n    case \"bottom\":\n      return {\n        ...slideFadeProps,\n        custom: { offsetY: 16, reverse: true, duration },\n      }\n  }\n}\n\nconst ModalContent = forwardRef<ModalContentProps, \"section\", false>(\n  ({ className, children, __css, ...rest }, ref) => {\n    const {\n      styles,\n      scrollBehavior,\n      withCloseButton,\n      onClose,\n      animation,\n      duration,\n    } = useModal()\n\n    const validChildren = getValidChildren(children)\n\n    const [customModalCloseButton, ...cloneChildren] = findChildren(\n      validChildren,\n      ModalCloseButton,\n      DialogCloseButton,\n    )\n\n    const props =\n      animation !== \"none\" ? getModalContentProps(animation, duration) : {}\n\n    const css: CSSUIObject = {\n      position: \"relative\",\n      maxH: \"100%\",\n      display: \"flex\",\n      flexDirection: \"column\",\n      overflow: scrollBehavior === \"inside\" ? \"hidden\" : \"auto\",\n      outline: 0,\n      ...(__css ? __css : styles.container),\n    }\n\n    return (\n      <Motion\n        as=\"section\"\n        ref={ref}\n        className={cx(\"ui-modal\", className)}\n        tabIndex={-1}\n        __css={css}\n        {...props}\n        {...rest}\n      >\n        {customModalCloseButton ??\n          (withCloseButton && onClose ? <ModalCloseButton /> : null)}\n\n        {cloneChildren}\n      </Motion>\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport type { HTMLMotionProps } from \"@yamada-ui/motion\"\nimport { motion } from \"@yamada-ui/motion\"\nimport { fadeProps } from \"@yamada-ui/transitions\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalOverlayProps = HTMLUIProps<\"div\"> &\n  Omit<HTMLMotionProps<\"div\">, \"color\" | \"transition\">\n\nexport const ModalOverlay = forwardRef<ModalOverlayProps, \"div\">(\n  ({ className, __css, onClick, ...rest }, ref) => {\n    const {\n      styles,\n      closeOnOverlay,\n      onOverlayClick,\n      onClose,\n      animation,\n      duration,\n    } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"fixed\",\n      top: 0,\n      left: 0,\n      w: \"100vw\",\n      h: \"100vh\",\n      ...(__css ? __css : styles.overlay),\n    }\n\n    const props = animation !== \"none\" ? fadeProps : {}\n\n    return (\n      <ui.div\n        as={motion.div}\n        ref={ref}\n        className={cx(\"ui-modal__overlay\", className)}\n        custom={{ duration }}\n        __css={css}\n        onClick={handlerAll(onClick, onOverlayClick, (ev) => {\n          ev.stopPropagation()\n          if (closeOnOverlay) onClose?.()\n        })}\n        {...props}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport { CloseButton } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject } from \"@yamada-ui/core\"\nimport { forwardRef } from \"@yamada-ui/core\"\nimport { cx, handlerAll } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalCloseButtonProps = CloseButtonProps\n\nexport const ModalCloseButton = forwardRef<ModalCloseButtonProps, \"button\">(\n  ({ onClick, __css, ...rest }, ref) => {\n    const { styles, onClose } = useModal()\n\n    const css: CSSUIObject = {\n      position: \"absolute\",\n      ...(__css ? __css : styles.closeButton),\n    }\n\n    return (\n      <CloseButton\n        ref={ref}\n        className={cx(\"ui-modal__close-button\")}\n        __css={css}\n        onClick={handlerAll(onClick, (ev) => {\n          ev.stopPropagation()\n          onClose?.()\n        })}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalHeaderProps = HTMLUIProps<\"header\">\n\nexport const ModalHeader = forwardRef<ModalHeaderProps, \"header\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"flex-start\",\n      ...(__css ? __css : styles.header),\n    }\n\n    return (\n      <ui.header\n        ref={ref}\n        className={cx(\"ui-modal__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalBodyProps = HTMLUIProps<\"main\">\n\nexport const ModalBody = forwardRef<ModalBodyProps, \"main\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles, scrollBehavior } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      flexDirection: \"column\",\n      alignItems: \"flex-start\",\n      overflow: scrollBehavior === \"inside\" ? \"auto\" : undefined,\n      ...(__css ? __css : styles.body),\n    }\n\n    return (\n      <ui.main\n        ref={ref}\n        className={cx(\"ui-modal__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { HTMLUIProps, CSSUIObject } from \"@yamada-ui/core\"\nimport { ui, forwardRef } from \"@yamada-ui/core\"\nimport { cx } from \"@yamada-ui/utils\"\nimport { useModal } from \"./modal\"\n\nexport type ModalFooterProps = HTMLUIProps<\"footer\">\n\nexport const ModalFooter = forwardRef<ModalFooterProps, \"footer\">(\n  ({ className, __css, ...rest }, ref) => {\n    const { styles } = useModal()\n\n    const css: CSSUIObject = {\n      display: \"flex\",\n      alignItems: \"center\",\n      justifyContent: \"flex-end\",\n      ...(__css ? __css : styles.footer),\n    }\n\n    return (\n      <ui.footer\n        ref={ref}\n        className={cx(\"ui-modal__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n","import type { ButtonProps } from \"@yamada-ui/button\"\nimport { Button } from \"@yamada-ui/button\"\nimport type { CloseButtonProps } from \"@yamada-ui/close-button\"\nimport type { CSSUIObject, ThemeProps } from \"@yamada-ui/core\"\nimport {\n  forwardRef,\n  useMultiComponentStyle,\n  omitThemeProps,\n} from \"@yamada-ui/core\"\nimport {\n  createContext,\n  getValidChildren,\n  findChildren,\n  omitChildren,\n  isValidElement,\n  isEmpty,\n  cx,\n} from \"@yamada-ui/utils\"\nimport type { ReactNode } from \"react\"\nimport type {\n  ModalProps,\n  ModalOverlayProps,\n  ModalHeaderProps,\n  ModalBodyProps,\n  ModalFooterProps,\n} from \"./\"\nimport {\n  Modal,\n  ModalOverlay,\n  ModalCloseButton,\n  ModalHeader,\n  ModalBody,\n  ModalFooter,\n} from \"./\"\n\ntype DialogOptions = {\n  /**\n   * The dialog header to use.\n   */\n  header?: ReactNode\n  /**\n   * The dialog footer to use.\n   */\n  footer?: ReactNode\n  /**\n   * The dialog cancel to use.\n   */\n  cancel?: ReactNode | ButtonProps\n  /**\n   * The dialog other to use.\n   */\n  other?: ReactNode | ButtonProps\n  /**\n   * The dialog success to use.\n   */\n  success?: ReactNode | ButtonProps\n  /**\n   * The callback invoked when cancel button clicked.\n   */\n  onCancel?: (onClose: (() => void) | undefined) => void\n  /**\n   * The callback invoked when other button clicked.\n   */\n  onOther?: (onClose: (() => void) | undefined) => void\n  /**\n   * The callback invoked when success button clicked.\n   */\n  onSuccess?: (onClose: (() => void) | undefined) => void\n}\n\nexport type DialogProps = Omit<ModalProps, keyof ThemeProps> &\n  ThemeProps<\"Dialog\"> &\n  DialogOptions\n\ntype DialogContext = Record<string, CSSUIObject>\n\nconst [DialogProvider, useDialog] = createContext<DialogContext>({\n  name: `DialogContext`,\n  errorMessage: `useDialog returned is 'undefined'. Seems you forgot to wrap the components in \"<Dialog />\" `,\n})\n\n/**\n * `Dialog` is a component used to confirm or interrupt user actions.\n *\n * @see Docs https://yamada-ui.com/components/overlay/dialog\n */\nexport const Dialog = forwardRef<DialogProps, \"section\", false>(\n  ({ size, ...props }, ref) => {\n    const [styles, mergedProps] = useMultiComponentStyle(\"Dialog\", {\n      size,\n      ...props,\n    })\n    const {\n      className,\n      children,\n      withOverlay = true,\n      withCloseButton = true,\n      header,\n      footer,\n      cancel,\n      other,\n      success,\n      onClose,\n      onCancel,\n      onOther,\n      onSuccess,\n      ...rest\n    } = omitThemeProps(mergedProps)\n\n    const validChildren = getValidChildren(children)\n\n    const [customDialogOverlay] = findChildren(validChildren, DialogOverlay)\n    const [customDialogCloseButton] = findChildren(\n      validChildren,\n      DialogCloseButton,\n    )\n    const [customDialogHeader] = findChildren(validChildren, DialogHeader)\n    const [customDialogBody] = findChildren(validChildren, DialogBody)\n    const [customDialogFooter] = findChildren(validChildren, DialogFooter)\n\n    const cloneChildren = !isEmpty(validChildren)\n      ? omitChildren(\n          validChildren,\n          DialogOverlay,\n          DialogCloseButton,\n          DialogHeader,\n          DialogBody,\n          DialogFooter,\n        )\n      : children\n\n    const css: CSSUIObject = { ...styles.container }\n\n    const cancelButtonProps: ButtonProps = isValidElement(cancel)\n      ? { children: cancel }\n      : cancel\n    const otherButtonProps: ButtonProps = isValidElement(other)\n      ? { children: other }\n      : other\n    const successButtonProps: ButtonProps = isValidElement(success)\n      ? { children: success }\n      : success\n\n    if (cancelButtonProps && !cancelButtonProps.variant)\n      cancelButtonProps.variant = \"ghost\"\n    if (otherButtonProps && !otherButtonProps.colorScheme)\n      otherButtonProps.colorScheme = \"secondary\"\n    if (successButtonProps && !successButtonProps.colorScheme)\n      successButtonProps.colorScheme = \"primary\"\n\n    return (\n      <DialogProvider value={styles}>\n        <Modal\n          ref={ref}\n          className={cx(\"ui-dialog\", className)}\n          __css={css}\n          {...{\n            size,\n            onClose,\n            withOverlay: false,\n            withCloseButton: false,\n            ...rest,\n          }}\n        >\n          {customDialogOverlay ??\n            (withOverlay && size !== \"full\" ? <DialogOverlay /> : null)}\n          {customDialogCloseButton ??\n            (withCloseButton && onClose ? <DialogCloseButton /> : null)}\n          {customDialogHeader ??\n            (header ? <DialogHeader>{header}</DialogHeader> : null)}\n          {customDialogBody ??\n            (cloneChildren ? <DialogBody>{cloneChildren}</DialogBody> : null)}\n          {customDialogFooter ??\n            (footer ||\n            cancelButtonProps ||\n            otherButtonProps ||\n            successButtonProps ? (\n              <DialogFooter>\n                {footer ?? (\n                  <>\n                    {cancelButtonProps ? (\n                      <Button\n                        onClick={() => onCancel?.(onClose)}\n                        {...cancelButtonProps}\n                      />\n                    ) : null}\n                    {otherButtonProps ? (\n                      <Button\n                        onClick={() => onOther?.(onClose)}\n                        {...otherButtonProps}\n                      />\n                    ) : null}\n                    {successButtonProps ? (\n                      <Button\n                        onClick={() => onSuccess?.(onClose)}\n                        {...successButtonProps}\n                      />\n                    ) : null}\n                  </>\n                )}\n              </DialogFooter>\n            ) : null)}\n        </Modal>\n      </DialogProvider>\n    )\n  },\n)\n\nexport type DialogOverlayProps = ModalOverlayProps\n\nexport const DialogOverlay = forwardRef<DialogOverlayProps, \"div\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.overlay }\n\n    return (\n      <ModalOverlay\n        ref={ref}\n        className={cx(\"ui-dialog__overlay\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogCloseButtonProps = CloseButtonProps\n\nexport const DialogCloseButton = forwardRef<DialogCloseButtonProps, \"button\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.closeButton }\n\n    return (\n      <ModalCloseButton\n        ref={ref}\n        className={cx(\"ui-dialog__close-button\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogHeaderProps = ModalHeaderProps\n\nexport const DialogHeader = forwardRef<DialogHeaderProps, \"header\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.header }\n\n    return (\n      <ModalHeader\n        ref={ref}\n        className={cx(\"ui-dialog__header\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogBodyProps = ModalBodyProps\n\nexport const DialogBody = forwardRef<DialogBodyProps, \"main\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.body }\n\n    return (\n      <ModalBody\n        ref={ref}\n        className={cx(\"ui-dialog__body\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n\nexport type DialogFooterProps = ModalFooterProps\n\nexport const DialogFooter = forwardRef<DialogFooterProps, \"footer\">(\n  ({ className, ...rest }, ref) => {\n    const styles = useDialog()\n\n    const css: CSSUIObject = { ...styles.footer }\n\n    return (\n      <ModalFooter\n        ref={ref}\n        className={cx(\"ui-dialog__footer\", className)}\n        __css={css}\n        {...rest}\n      />\n    )\n  },\n)\n"],"mappings":"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","names":["import_core","import_transitions","import_utils","import_react","import_core","import_motion","import_transitions","import_utils","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_core","import_utils","import_jsx_runtime","import_jsx_runtime","import_jsx_runtime"]}

package/dist/drawer.mjs

@@ -7,7 +7,7 @@ import {
   DrawerFooter,
   DrawerHeader,
   DrawerOverlay
-} from "./chunk-FLCRRWIZ.mjs";
+} from "./chunk-YBDET4VL.mjs";
 export {
   Drawer,
   DrawerBody,

package/dist/index.d.mts

@@ -13,4 +13,5 @@ import '@yamada-ui/portal';
 import '@yamada-ui/close-button';
 import '@yamada-ui/button';
 import 'react';
+import '@yamada-ui/react';
 import '@yamada-ui/transitions';

package/dist/index.d.ts

@@ -13,4 +13,5 @@ import '@yamada-ui/portal';
 import '@yamada-ui/close-button';
 import '@yamada-ui/button';
 import 'react';
+import '@yamada-ui/react';
 import '@yamada-ui/transitions';

package/dist/index.js

@@ -50,20 +50,21 @@ var import_portal = require("@yamada-ui/portal");
 var import_transitions2 = require("@yamada-ui/transitions");
 var import_use_value = require("@yamada-ui/use-value");
 var import_utils2 = require("@yamada-ui/utils");
-var import_react = require("react");
+var import_react2 = require("react");
 var import_react_remove_scroll = require("react-remove-scroll");
 
 // src/drawer.tsx
 var import_core = require("@yamada-ui/core");
 var import_transitions = require("@yamada-ui/transitions");
 var import_utils = require("@yamada-ui/utils");
+var import_react = require("react");
 var import_jsx_runtime = require("react/jsx-runtime");
 var [DrawerProvider, useDrawer] = (0, import_utils.createContext)({
   name: `DrawerContext`,
   errorMessage: `useDrawer returned is 'undefined'. Seems you forgot to wrap the components in "<Drawer />" `
 });
 var Drawer = (0, import_core.forwardRef)(
-  ({ size, placement = "right", ...props }, ref) => {
+  ({ size, placement = "right", closeOnDrag, ...props }, ref) => {
     const [styles, mergedProps] = (0, import_core.useMultiComponentStyle)("Drawer", {
       size,
       placement,
@@ -125,6 +126,7 @@ var Drawer = (0, import_core.forwardRef)(
           /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
             DrawerContent,
             {
+              closeOnDrag,
               ...{
                 withCloseButton,
                 ...(0, import_utils.omitObject)(rest, ["isFullHeight"]),
@@ -139,7 +141,7 @@ var Drawer = (0, import_core.forwardRef)(
   }
 );
 var DrawerContent = (0, import_core.forwardRef)(
-  ({ className, children, placement, withCloseButton, ...rest }, ref) => {
+  ({ className, children, placement, withCloseButton, closeOnDrag, ...rest }, ref) => {
     const { isOpen, onClose, duration } = useModal();
     const styles = useDrawer();
     const validChildren = (0, import_utils.getValidChildren)(children);
@@ -154,10 +156,57 @@ var DrawerContent = (0, import_core.forwardRef)(
       outline: 0,
       ...styles.container
     };
+    const getDragDirectionRestriction = (0, import_react.useCallback)(() => {
+      switch (placement) {
+        case "top":
+          return { bottom: 0 };
+        case "bottom":
+          return { top: 0 };
+        case "left":
+          return { right: 0 };
+        case "right":
+          return { left: 0 };
+      }
+    }, [placement]);
+    const getDragDirection = (0, import_react.useCallback)(() => {
+      switch (placement) {
+        case "top":
+        case "bottom":
+          return "y";
+        case "left":
+        case "right":
+          return "x";
+      }
+    }, [placement]);
+    const isCloseByDragInfo = (0, import_react.useCallback)(
+      (info) => {
+        switch (placement) {
+          case "top":
+            return info.velocity.y <= -100 || info.offset.y <= -80;
+          case "bottom":
+            return info.velocity.y >= 100 || info.offset.y >= 80;
+          case "left":
+            return info.velocity.x <= -100 || info.offset.x <= -80;
+          case "right":
+            return info.velocity.x >= 100 || info.offset.x >= 80;
+        }
+      },
+      [placement]
+    );
     return /* @__PURE__ */ (0, import_jsx_runtime.jsxs)(
       import_transitions.Slide,
       {
         ref,
+        drag: closeOnDrag ? getDragDirection() : false,
+        dragConstraints: getDragDirectionRestriction(),
+        dragElastic: getDragDirectionRestriction(),
+        dragSnapToOrigin: true,
+        dragMomentum: false,
+        onDragEnd: (_, info) => {
+          if (isCloseByDragInfo(info)) {
+            onClose == null ? void 0 : onClose();
+          }
+        },
         className: (0, import_utils.cx)("ui-drawer", className),
         tabIndex: -1,
         isOpen,
@@ -288,7 +337,7 @@ var Modal = (0, import_core2.forwardRef)(
       portalProps,
       ...rest
     } = (0, import_core2.omitThemeProps)(mergedProps);
-    const onKeyDown = (0, import_react.useCallback)(
+    const onKeyDown = (0, import_react2.useCallback)(
       (ev) => {
         if (ev.key !== "Escape")
           return;
@@ -308,7 +357,7 @@ var Modal = (0, import_core2.forwardRef)(
     );
     let [drawerContent] = (0, import_utils2.findChildren)(validChildren, DrawerContent);
     if (drawerContent)
-      drawerContent = (0, import_react.cloneElement)(drawerContent, { onKeyDown });
+      drawerContent = (0, import_react2.cloneElement)(drawerContent, { onKeyDown });
     const placement = (0, import_use_value.useValue)(_placement);
     const css = {
       position: "fixed",