import { jsx, jsxs, Fragment } from "react/jsx-runtime";
import * as React from "react";
import React__default, { useRef, useState, useCallback, useEffect } from "react";
import { c as composeEventHandlers } from "./index-B-mNdDrH.js";
import { c as createSlot, u as useComposedRefs } from "./index-DcJYRxi-.js";
import { c as createContextScope, a as createContext2 } from "./index-voAj_M6Q.js";
import { u as useId } from "./index-Da1okT-Q.js";
import { u as useControllableState } from "./index-vuqbEv5O.js";
import { P as Portal$1, D as DismissableLayer } from "./index-FUzpbEgX.js";
import { R as ReactRemoveScroll, h as hideOthers, u as useFocusGuards, F as FocusScope } from "./index-DvT-641r.js";
import { P as Presence } from "./index-BYmdwF6l.js";
import { P as Primitive } from "./index-BEpjRf6p.js";
import { S as StClose } from "./StClose-BQuYK7Le.js";
import { cn } from "./components/utils/cn.js";
var DIALOG_NAME = "Dialog";
var [createDialogContext, createDialogScope] = createContextScope(DIALOG_NAME);
var [DialogProvider, useDialogContext] = createDialogContext(DIALOG_NAME);
var Dialog$1 = (props) => {
  const {
    __scopeDialog,
    children,
    open: openProp,
    defaultOpen,
    onOpenChange,
    modal = true
  } = props;
  const triggerRef = React.useRef(null);
  const contentRef = React.useRef(null);
  const [open, setOpen] = useControllableState({
    prop: openProp,
    defaultProp: defaultOpen ?? false,
    onChange: onOpenChange,
    caller: DIALOG_NAME
  });
  return /* @__PURE__ */ jsx(
    DialogProvider,
    {
      scope: __scopeDialog,
      triggerRef,
      contentRef,
      contentId: useId(),
      titleId: useId(),
      descriptionId: useId(),
      open,
      onOpenChange: setOpen,
      onOpenToggle: React.useCallback(() => setOpen((prevOpen) => !prevOpen), [setOpen]),
      modal,
      children
    }
  );
};
Dialog$1.displayName = DIALOG_NAME;
var TRIGGER_NAME = "DialogTrigger";
var DialogTrigger$1 = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, ...triggerProps } = props;
    const context = useDialogContext(TRIGGER_NAME, __scopeDialog);
    const composedTriggerRef = useComposedRefs(forwardedRef, context.triggerRef);
    return /* @__PURE__ */ jsx(
      Primitive.button,
      {
        type: "button",
        "aria-haspopup": "dialog",
        "aria-expanded": context.open,
        "aria-controls": context.contentId,
        "data-state": getState(context.open),
        ...triggerProps,
        ref: composedTriggerRef,
        onClick: composeEventHandlers(props.onClick, context.onOpenToggle)
      }
    );
  }
);
DialogTrigger$1.displayName = TRIGGER_NAME;
var PORTAL_NAME = "DialogPortal";
var [PortalProvider, usePortalContext] = createDialogContext(PORTAL_NAME, {
  forceMount: void 0
});
var DialogPortal$1 = (props) => {
  const { __scopeDialog, forceMount, children, container } = props;
  const context = useDialogContext(PORTAL_NAME, __scopeDialog);
  return /* @__PURE__ */ jsx(PortalProvider, { scope: __scopeDialog, forceMount, children: React.Children.map(children, (child) => /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(Portal$1, { asChild: true, container, children: child }) })) });
};
DialogPortal$1.displayName = PORTAL_NAME;
var OVERLAY_NAME = "DialogOverlay";
var DialogOverlay$1 = React.forwardRef(
  (props, forwardedRef) => {
    const portalContext = usePortalContext(OVERLAY_NAME, props.__scopeDialog);
    const { forceMount = portalContext.forceMount, ...overlayProps } = props;
    const context = useDialogContext(OVERLAY_NAME, props.__scopeDialog);
    return context.modal ? /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: /* @__PURE__ */ jsx(DialogOverlayImpl, { ...overlayProps, ref: forwardedRef }) }) : null;
  }
);
DialogOverlay$1.displayName = OVERLAY_NAME;
var Slot = createSlot("DialogOverlay.RemoveScroll");
var DialogOverlayImpl = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, ...overlayProps } = props;
    const context = useDialogContext(OVERLAY_NAME, __scopeDialog);
    return (
      // Make sure `Content` is scrollable even when it doesn't live inside `RemoveScroll`
      // ie. when `Overlay` and `Content` are siblings
      /* @__PURE__ */ jsx(ReactRemoveScroll, { as: Slot, allowPinchZoom: true, shards: [context.contentRef], children: /* @__PURE__ */ jsx(
        Primitive.div,
        {
          "data-state": getState(context.open),
          ...overlayProps,
          ref: forwardedRef,
          style: { pointerEvents: "auto", ...overlayProps.style }
        }
      ) })
    );
  }
);
var CONTENT_NAME = "DialogContent";
var DialogContent$1 = React.forwardRef(
  (props, forwardedRef) => {
    const portalContext = usePortalContext(CONTENT_NAME, props.__scopeDialog);
    const { forceMount = portalContext.forceMount, ...contentProps } = props;
    const context = useDialogContext(CONTENT_NAME, props.__scopeDialog);
    return /* @__PURE__ */ jsx(Presence, { present: forceMount || context.open, children: context.modal ? /* @__PURE__ */ jsx(DialogContentModal, { ...contentProps, ref: forwardedRef }) : /* @__PURE__ */ jsx(DialogContentNonModal, { ...contentProps, ref: forwardedRef }) });
  }
);
DialogContent$1.displayName = CONTENT_NAME;
var DialogContentModal = React.forwardRef(
  (props, forwardedRef) => {
    const context = useDialogContext(CONTENT_NAME, props.__scopeDialog);
    const contentRef = React.useRef(null);
    const composedRefs = useComposedRefs(forwardedRef, context.contentRef, contentRef);
    React.useEffect(() => {
      const content = contentRef.current;
      if (content) return hideOthers(content);
    }, []);
    return /* @__PURE__ */ jsx(
      DialogContentImpl,
      {
        ...props,
        ref: composedRefs,
        trapFocus: context.open,
        disableOutsidePointerEvents: true,
        onCloseAutoFocus: composeEventHandlers(props.onCloseAutoFocus, (event) => {
          event.preventDefault();
          context.triggerRef.current?.focus();
        }),
        onPointerDownOutside: composeEventHandlers(props.onPointerDownOutside, (event) => {
          const originalEvent = event.detail.originalEvent;
          const ctrlLeftClick = originalEvent.button === 0 && originalEvent.ctrlKey === true;
          const isRightClick = originalEvent.button === 2 || ctrlLeftClick;
          if (isRightClick) event.preventDefault();
        }),
        onFocusOutside: composeEventHandlers(
          props.onFocusOutside,
          (event) => event.preventDefault()
        )
      }
    );
  }
);
var DialogContentNonModal = React.forwardRef(
  (props, forwardedRef) => {
    const context = useDialogContext(CONTENT_NAME, props.__scopeDialog);
    const hasInteractedOutsideRef = React.useRef(false);
    const hasPointerDownOutsideRef = React.useRef(false);
    return /* @__PURE__ */ jsx(
      DialogContentImpl,
      {
        ...props,
        ref: forwardedRef,
        trapFocus: false,
        disableOutsidePointerEvents: false,
        onCloseAutoFocus: (event) => {
          props.onCloseAutoFocus?.(event);
          if (!event.defaultPrevented) {
            if (!hasInteractedOutsideRef.current) context.triggerRef.current?.focus();
            event.preventDefault();
          }
          hasInteractedOutsideRef.current = false;
          hasPointerDownOutsideRef.current = false;
        },
        onInteractOutside: (event) => {
          props.onInteractOutside?.(event);
          if (!event.defaultPrevented) {
            hasInteractedOutsideRef.current = true;
            if (event.detail.originalEvent.type === "pointerdown") {
              hasPointerDownOutsideRef.current = true;
            }
          }
          const target = event.target;
          const targetIsTrigger = context.triggerRef.current?.contains(target);
          if (targetIsTrigger) event.preventDefault();
          if (event.detail.originalEvent.type === "focusin" && hasPointerDownOutsideRef.current) {
            event.preventDefault();
          }
        }
      }
    );
  }
);
var DialogContentImpl = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, trapFocus, onOpenAutoFocus, onCloseAutoFocus, ...contentProps } = props;
    const context = useDialogContext(CONTENT_NAME, __scopeDialog);
    const contentRef = React.useRef(null);
    const composedRefs = useComposedRefs(forwardedRef, contentRef);
    useFocusGuards();
    return /* @__PURE__ */ jsxs(Fragment, { children: [
      /* @__PURE__ */ jsx(
        FocusScope,
        {
          asChild: true,
          loop: true,
          trapped: trapFocus,
          onMountAutoFocus: onOpenAutoFocus,
          onUnmountAutoFocus: onCloseAutoFocus,
          children: /* @__PURE__ */ jsx(
            DismissableLayer,
            {
              role: "dialog",
              id: context.contentId,
              "aria-describedby": context.descriptionId,
              "aria-labelledby": context.titleId,
              "data-state": getState(context.open),
              ...contentProps,
              ref: composedRefs,
              onDismiss: () => context.onOpenChange(false)
            }
          )
        }
      ),
      /* @__PURE__ */ jsxs(Fragment, { children: [
        /* @__PURE__ */ jsx(TitleWarning, { titleId: context.titleId }),
        /* @__PURE__ */ jsx(DescriptionWarning, { contentRef, descriptionId: context.descriptionId })
      ] })
    ] });
  }
);
var TITLE_NAME = "DialogTitle";
var DialogTitle$1 = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, ...titleProps } = props;
    const context = useDialogContext(TITLE_NAME, __scopeDialog);
    return /* @__PURE__ */ jsx(Primitive.h2, { id: context.titleId, ...titleProps, ref: forwardedRef });
  }
);
DialogTitle$1.displayName = TITLE_NAME;
var DESCRIPTION_NAME = "DialogDescription";
var DialogDescription$1 = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, ...descriptionProps } = props;
    const context = useDialogContext(DESCRIPTION_NAME, __scopeDialog);
    return /* @__PURE__ */ jsx(Primitive.p, { id: context.descriptionId, ...descriptionProps, ref: forwardedRef });
  }
);
DialogDescription$1.displayName = DESCRIPTION_NAME;
var CLOSE_NAME = "DialogClose";
var DialogClose$1 = React.forwardRef(
  (props, forwardedRef) => {
    const { __scopeDialog, ...closeProps } = props;
    const context = useDialogContext(CLOSE_NAME, __scopeDialog);
    return /* @__PURE__ */ jsx(
      Primitive.button,
      {
        type: "button",
        ...closeProps,
        ref: forwardedRef,
        onClick: composeEventHandlers(props.onClick, () => context.onOpenChange(false))
      }
    );
  }
);
DialogClose$1.displayName = CLOSE_NAME;
function getState(open) {
  return open ? "open" : "closed";
}
var TITLE_WARNING_NAME = "DialogTitleWarning";
var [WarningProvider, useWarningContext] = createContext2(TITLE_WARNING_NAME, {
  contentName: CONTENT_NAME,
  titleName: TITLE_NAME,
  docsSlug: "dialog"
});
var TitleWarning = ({ titleId }) => {
  const titleWarningContext = useWarningContext(TITLE_WARNING_NAME);
  const MESSAGE = `\`${titleWarningContext.contentName}\` requires a \`${titleWarningContext.titleName}\` for the component to be accessible for screen reader users.

If you want to hide the \`${titleWarningContext.titleName}\`, you can wrap it with our VisuallyHidden component.

For more information, see https://radix-ui.com/primitives/docs/components/${titleWarningContext.docsSlug}`;
  React.useEffect(() => {
    if (titleId) {
      const hasTitle = document.getElementById(titleId);
      if (!hasTitle) console.error(MESSAGE);
    }
  }, [MESSAGE, titleId]);
  return null;
};
var DESCRIPTION_WARNING_NAME = "DialogDescriptionWarning";
var DescriptionWarning = ({ contentRef, descriptionId }) => {
  const descriptionWarningContext = useWarningContext(DESCRIPTION_WARNING_NAME);
  const MESSAGE = `Warning: Missing \`Description\` or \`aria-describedby={undefined}\` for {${descriptionWarningContext.contentName}}.`;
  React.useEffect(() => {
    const describedById = contentRef.current?.getAttribute("aria-describedby");
    if (descriptionId && describedById) {
      const hasDescription = document.getElementById(descriptionId);
      if (!hasDescription) console.warn(MESSAGE);
    }
  }, [MESSAGE, contentRef, descriptionId]);
  return null;
};
var Root = Dialog$1;
var Trigger = DialogTrigger$1;
var Portal = DialogPortal$1;
var Overlay = DialogOverlay$1;
var Content = DialogContent$1;
var Title = DialogTitle$1;
var Description = DialogDescription$1;
var Close = DialogClose$1;
const Dialog = Root;
const DialogClose = Close;
const DialogTrigger = Trigger;
const DialogPortal = Portal;
const DialogOverlay = React__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  Overlay,
  {
    ref,
    className: cn(
      "fixed inset-0 z-50 bg-black/50 dark:bg-black/70 backdrop-blur-sm",
      // Smooth fade animations for overlay
      "data-[state=open]:animate-fade-in data-[state=closed]:animate-fade-out",
      className
    ),
    ...props
  }
));
DialogOverlay.displayName = Overlay.displayName;
const DialogContent = React__default.forwardRef(
  ({ className, children, variant = "modal", position = "right", ...props }, ref) => {
    const contentRef = useRef(null);
    const hiddenCloseRef = useRef(null);
    const [isDragging, setIsDragging] = useState(false);
    const [dragOffset, setDragOffset] = useState(0);
    const [isClosingFromDrag, setIsClosingFromDrag] = useState(false);
    const startYRef = useRef(0);
    const startXRef = useRef(0);
    const currentTransformRef = useRef(0);
    const closeDialog = useCallback(() => {
      if (hiddenCloseRef.current) {
        hiddenCloseRef.current.click();
      }
    }, []);
    const isDragEnabled = variant === "sheet";
    const getDragDirection = React__default.useCallback(() => {
      if (variant !== "sheet") return null;
      if (window.innerWidth < 640) return "down";
      switch (position) {
        case "right":
          return "right";
        case "left":
          return "left";
        case "top":
          return "up";
        case "bottom":
          return "down";
        default:
          return "right";
      }
    }, [variant, position]);
    const handleDragStart = useCallback(
      (clientX, clientY) => {
        if (!isDragEnabled) return;
        setIsDragging(true);
        startYRef.current = clientY;
        startXRef.current = clientX;
        currentTransformRef.current = 0;
      },
      [isDragEnabled]
    );
    const handleDragMove = useCallback(
      (clientX, clientY) => {
        if (!isDragging || !contentRef.current) return;
        const direction = getDragDirection();
        let offset = 0;
        switch (direction) {
          case "down":
            offset = Math.max(0, clientY - startYRef.current);
            contentRef.current.style.setProperty(
              "transform",
              `translateY(${offset}px)`,
              "important"
            );
            break;
          case "up":
            offset = Math.min(0, clientY - startYRef.current);
            contentRef.current.style.setProperty(
              "transform",
              `translateY(${offset}px)`,
              "important"
            );
            break;
          case "right":
            offset = Math.max(0, clientX - startXRef.current);
            contentRef.current.style.setProperty(
              "transform",
              `translateX(${offset}px)`,
              "important"
            );
            break;
          case "left":
            offset = Math.min(0, clientX - startXRef.current);
            contentRef.current.style.setProperty(
              "transform",
              `translateX(${offset}px)`,
              "important"
            );
            break;
        }
        currentTransformRef.current = Math.abs(offset);
        setDragOffset(Math.abs(offset));
      },
      [isDragging, getDragDirection]
    );
    const handleDragEnd = useCallback(() => {
      if (!isDragging || !contentRef.current) return;
      const threshold = 100;
      const shouldClose = currentTransformRef.current > threshold;
      if (shouldClose) {
        setIsClosingFromDrag(true);
        const direction = getDragDirection();
        let finalTransform = "";
        const viewportHeight = window.innerHeight;
        const viewportWidth = window.innerWidth;
        switch (direction) {
          case "down":
            finalTransform = `translateY(${viewportHeight}px)`;
            break;
          case "up":
            finalTransform = `translateY(-${viewportHeight}px)`;
            break;
          case "right":
            finalTransform = `translateX(${viewportWidth}px)`;
            break;
          case "left":
            finalTransform = `translateX(-${viewportWidth}px)`;
            break;
        }
        contentRef.current.style.transition = "transform 0.25s cubic-bezier(0.32, 0.72, 0, 1), opacity 0.25s ease-out";
        contentRef.current.style.setProperty(
          "transform",
          finalTransform,
          "important"
        );
        contentRef.current.style.opacity = "0";
        setTimeout(() => {
          closeDialog();
          setTimeout(() => {
            setIsClosingFromDrag(false);
            if (contentRef.current) {
              contentRef.current.style.removeProperty("transform");
              contentRef.current.style.transition = "";
              contentRef.current.style.opacity = "";
            }
          }, 50);
        }, 250);
      } else {
        contentRef.current.style.transition = "transform 0.2s ease-out";
        contentRef.current.style.removeProperty("transform");
        setTimeout(() => {
          if (contentRef.current) {
            contentRef.current.style.transition = "";
          }
        }, 200);
      }
      setIsDragging(false);
      setDragOffset(0);
      if (!shouldClose) {
        currentTransformRef.current = 0;
      }
    }, [isDragging, closeDialog, getDragDirection]);
    const handleTouchStart = useCallback(
      (e) => {
        const touch = e.touches[0];
        handleDragStart(touch.clientX, touch.clientY);
      },
      [handleDragStart]
    );
    const handleTouchMove = useCallback(
      (e) => {
        const touch = e.touches[0];
        handleDragMove(touch.clientX, touch.clientY);
      },
      [handleDragMove]
    );
    const handleTouchEnd = useCallback(() => {
      handleDragEnd();
    }, [handleDragEnd]);
    const handleMouseDown = useCallback(
      (e) => {
        const target = e.target;
        const isHeader = target.closest("[data-drag-handle]");
        if (isHeader) {
          handleDragStart(e.clientX, e.clientY);
        }
      },
      [handleDragStart]
    );
    useEffect(() => {
      if (!isDragging) return;
      const handleMouseMove = (e) => {
        handleDragMove(e.clientX, e.clientY);
      };
      const handleMouseUp = () => {
        handleDragEnd();
      };
      document.addEventListener("mousemove", handleMouseMove);
      document.addEventListener("mouseup", handleMouseUp);
      return () => {
        document.removeEventListener("mousemove", handleMouseMove);
        document.removeEventListener("mouseup", handleMouseUp);
      };
    }, [isDragging, handleDragMove, handleDragEnd]);
    const getAnimationClasses = () => {
      if (isClosingFromDrag) {
        return "";
      }
      if (variant === "sheet") {
        const mobileClasses = "data-[state=open]:animate-slide-up-mobile data-[state=closed]:animate-slide-down-mobile";
        const desktopAnimationMap = {
          right: "sm:data-[state=open]:animate-slide-in-right sm:data-[state=closed]:animate-slide-out-right",
          left: "sm:data-[state=open]:animate-slide-in-left sm:data-[state=closed]:animate-slide-out-left",
          top: "sm:data-[state=open]:animate-slide-in-top sm:data-[state=closed]:animate-slide-out-top",
          bottom: "sm:data-[state=open]:animate-slide-in-bottom sm:data-[state=closed]:animate-slide-out-bottom"
        };
        return `${mobileClasses} ${desktopAnimationMap[position]}`;
      }
      return "data-[state=open]:animate-slide-up-mobile data-[state=closed]:animate-slide-down-mobile sm:data-[state=open]:animate-scale-in sm:data-[state=closed]:animate-scale-out";
    };
    const getPositionClasses = () => {
      if (variant === "sheet") {
        const mobileClasses = "fixed left-0 right-0 bottom-0 z-50 bg-popover flex flex-col focus:outline-none text-base rounded-t-2xl max-h-[calc(100vh-3rem)] pb-[env(safe-area-inset-bottom,0px)]";
        const desktopPositionMap = {
          right: "sm:fixed sm:right-0 sm:top-0 sm:bottom-0 sm:left-auto sm:w-[400px] sm:max-w-[80vw] sm:rounded-none sm:rounded-l-2xl sm:max-h-full sm:pb-0",
          left: "sm:fixed sm:left-0 sm:top-0 sm:bottom-0 sm:right-auto sm:w-[400px] sm:max-w-[80vw] sm:rounded-none sm:rounded-r-2xl sm:max-h-full sm:pb-0",
          top: "sm:fixed sm:top-0 sm:left-0 sm:right-0 sm:bottom-auto sm:h-[400px] sm:max-h-[80vh] sm:rounded-none sm:rounded-b-2xl sm:pb-0",
          bottom: "sm:fixed sm:bottom-0 sm:left-0 sm:right-0 sm:top-auto sm:h-[400px] sm:max-h-[80vh] sm:rounded-none sm:rounded-t-2xl sm:pb-0"
        };
        return `${mobileClasses} ${desktopPositionMap[position]} sm:p-6`;
      }
      return "fixed inset-0 z-50 bg-popover flex flex-col focus:outline-none text-base sm:inset-auto sm:left-[50%] sm:top-[50%] sm:max-h-[85vh] sm:w-[90vw] sm:max-w-xl sm:translate-x-[-50%] sm:translate-y-[-50%] sm:rounded-2xl sm:shadow-lg sm:p-6";
    };
    useEffect(() => {
      const handleAnimationEnd = () => {
        if (contentRef.current && !isDragging) {
          contentRef.current.style.transform = "";
          currentTransformRef.current = 0;
        }
      };
      const element = contentRef.current;
      if (element) {
        element.addEventListener("animationend", handleAnimationEnd);
        return () => {
          element.removeEventListener("animationend", handleAnimationEnd);
        };
      }
    }, [isDragging]);
    const combinedRef = useCallback(
      (node) => {
        contentRef.current = node;
        if (ref) {
          if (typeof ref === "function") {
            ref(node);
          } else {
            ref.current = node;
          }
        }
      },
      [ref]
    );
    return /* @__PURE__ */ jsxs(DialogPortal, { children: [
      /* @__PURE__ */ jsx(DialogOverlay, {}),
      /* @__PURE__ */ jsxs(
        Content,
        {
          ref: combinedRef,
          className: cn(
            getPositionClasses(),
            getAnimationClasses(),
            "will-change-transform overflow-scroll",
            isDragging && "transition-none",
            className
          ),
          onTouchStart: isDragEnabled ? handleTouchStart : void 0,
          onTouchMove: isDragEnabled ? handleTouchMove : void 0,
          onTouchEnd: isDragEnabled ? handleTouchEnd : void 0,
          onMouseDown: isDragEnabled ? handleMouseDown : void 0,
          style: {
            opacity: dragOffset > 0 ? 1 - Math.min(dragOffset / 300, 0.3) : 1,
            ...props.style
          },
          ...props,
          children: [
            variant === "sheet" && /* @__PURE__ */ jsx("div", { className: "sm:hidden absolute top-3 left-1/2 -translate-x-1/2 w-12 h-1 bg-border rounded-full" }),
            children,
            /* @__PURE__ */ jsx(
              Close,
              {
                ref: hiddenCloseRef,
                className: "sr-only",
                "aria-hidden": "true",
                children: "Close"
              }
            ),
            /* @__PURE__ */ jsxs(
              Close,
              {
                className: "absolute right-3 top-3 z-10 rounded-lg p-2 opacity-70 ring-offset-white transition-all hover:cursor-pointer hover:bg-subtle hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-accent focus:ring-offset-2 disabled:pointer-events-none",
                "aria-label": "Close",
                children: [
                  /* @__PURE__ */ jsx(StClose, { className: "h-5 w-5" }),
                  /* @__PURE__ */ jsx("span", { className: "sr-only", children: "Close" })
                ]
              }
            )
          ]
        }
      )
    ] });
  }
);
DialogContent.displayName = Content.displayName;
const DialogHeader = ({
  className,
  ...props
}) => /* @__PURE__ */ jsx(
  "div",
  {
    className: cn(
      "flex flex-col space-y-1.5 text-center sm:text-left",
      // Mobile: Add padding
      "p-6 pb-0",
      // Desktop: No padding (handled by DialogContent)
      "sm:p-0",
      className
    ),
    "data-drag-handle": true,
    ...props
  }
);
DialogHeader.displayName = "DialogHeader";
const DialogBody = ({
  className,
  ...props
}) => /* @__PURE__ */ jsx(
  "div",
  {
    className: cn(
      // Mobile: Scrollable content area with padding
      // Use flex-1 to ensure it takes available space but doesn't push footer out
      "flex-1 p-6",
      // Add bottom padding to prevent content cutoff
      "pb-6",
      // Ensure minimum height for scrolling
      "min-h-0",
      // Desktop: Normal flow without extra padding, add top margin for spacing from header
      "sm:flex-initial sm:p-0 sm:pb-0 sm:mt-4",
      className
    ),
    ...props
  }
);
DialogBody.displayName = "DialogBody";
const DialogFooter = ({
  className,
  children,
  ...props
}) => /* @__PURE__ */ jsx(
  "div",
  {
    className: cn(
      // Mobile: Static positioning for sheets, with border and padding
      "border-t border-default p-4",
      // Mobile: Use flexbox with proper button styling
      "flex gap-3",
      // Mobile: Ensure buttons take equal width
      "[&>*]:flex-1",
      // Desktop: No border, flex layout for right-aligned buttons
      "sm:flex-row sm:justify-end sm:gap-2 sm:border-0 sm:p-0 sm:pb-0 sm:mt-6",
      // Desktop: Reset button width
      "sm:[&>*]:flex-initial",
      className
    ),
    ...props,
    children
  }
);
DialogFooter.displayName = "DialogFooter";
const DialogTitle = React__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  Title,
  {
    ref,
    className: cn(
      "text-lg font-semibold leading-none tracking-tight mb-3",
      className
    ),
    ...props
  }
));
DialogTitle.displayName = Title.displayName;
const DialogDescription = React__default.forwardRef(({ className, ...props }, ref) => /* @__PURE__ */ jsx(
  Description,
  {
    ref,
    className: cn("text-subtle", className),
    ...props
  }
));
DialogDescription.displayName = Description.displayName;
export {
  Content as C,
  Dialog as D,
  Overlay as O,
  Portal as P,
  Root as R,
  DialogTrigger as a,
  DialogContent as b,
  DialogHeader as c,
  DialogTitle as d,
  DialogDescription as e,
  DialogBody as f,
  DialogFooter as g,
  DialogClose as h
};
