import {
  ClosePanelArrowIcon
} from "./chunk-UNTA4JJU.js";
import {
  Separator
} from "./chunk-HYITAA4J.js";
import {
  IconButton
} from "./chunk-O3DNDMV3.js";
import {
  Flex
} from "./chunk-25HMMI7R.js";
import {
  __objRest,
  __spreadProps,
  __spreadValues
} from "./chunk-N552FDTV.js";

// src/atoms/drawer.tsx
import { useEffect, useRef } from "react";
import * as Dialog from "@radix-ui/react-dialog";
import { Grid, Theme } from "@radix-ui/themes";
import { jsx, jsxs } from "react/jsx-runtime";
function Root2(props) {
  return /* @__PURE__ */ jsx(Dialog.Root, __spreadValues({}, props));
}
var preventDefault = (e) => {
  e.preventDefault();
};
function Content2(props) {
  const _a = props, { position = "right", className, children } = _a, rest = __objRest(_a, ["position", "className", "children"]);
  const containerRef = useRef(null);
  useEffect(() => {
    containerRef.current = document.getElementsByClassName("radix-themes")[0];
  }, []);
  const mobileHeaderSize = 48;
  const desktopHeaderSize = 64;
  const separatorSize = 1;
  return /* @__PURE__ */ jsx(Dialog.Portal, { container: containerRef.current, children: /* @__PURE__ */ jsxs(Theme, { children: [
    /* @__PURE__ */ jsx(Dialog.Overlay, { className: "DrawerOverlay" }),
    /* @__PURE__ */ jsx(
      Dialog.Content,
      __spreadProps(__spreadValues({
        className: `DrawerContent ${position} ${className || ""}`,
        onPointerDownOutside: preventDefault
      }, rest), {
        children: /* @__PURE__ */ jsxs(
          Grid,
          {
            height: "100%",
            overflow: "hidden",
            rows: {
              initial: `${mobileHeaderSize}px ${separatorSize}px calc(100% - ${mobileHeaderSize + separatorSize}px)`,
              sm: `${desktopHeaderSize}px ${separatorSize}px calc(100% - ${desktopHeaderSize + separatorSize}px)`
            },
            children: [
              /* @__PURE__ */ jsx(Flex, { align: "center", px: { initial: "4", md: "6" }, children: /* @__PURE__ */ jsx(Dialog.Close, { asChild: true, children: /* @__PURE__ */ jsx(IconButton, { color: "gray", variant: "outline", children: /* @__PURE__ */ jsx(ClosePanelArrowIcon, {}) }) }) }),
              /* @__PURE__ */ jsx(Separator, { orientation: "horizontal", size: "4" }),
              children
            ]
          }
        )
      })
    )
  ] }) });
}
function Trigger2(props) {
  return /* @__PURE__ */ jsx(Dialog.Trigger, __spreadValues({ asChild: true }, props));
}
var Drawer = {
  Root: Dialog.Root,
  Trigger: Trigger2,
  Content: Content2,
  Close: Dialog.Close,
  Title: Dialog.Title,
  Description: Dialog.Description
};

export {
  Root2 as Root,
  Content2 as Content,
  Trigger2 as Trigger,
  Drawer
};
//# sourceMappingURL=chunk-XDZDRPF3.js.map