@stanfordspezi/spezi-web-design-system/dist/Sheet-DSm8fm9n.mjs

Stanford Biodesign Digital Health Spezi Web Design System

import { jsxs as o, jsx as a } from "react/jsx-runtime";
import { c as s } from "./index-2NvaPZWc.mjs";
import { sizeToMaxWidthRecord as c } from "./utils/tailwind.js";
import { X as d } from "./x-DwXuuFO_.mjs";
import { R as h, T as m, P as f, C as l, O as p, a as g, b, D as u } from "./index-DASnCPs3.mjs";
const G = h, z = m, x = f, D = l, S = ({
  className: t,
  ...e
}) => /* @__PURE__ */ o(
  l,
  {
    className: s(
      "focus-ring absolute top-4 right-4 opacity-70 transition hover:opacity-100 disabled:pointer-events-none",
      t
    ),
    ...e,
    children: [
      /* @__PURE__ */ a(d, { className: "size-4" }),
      /* @__PURE__ */ a("span", { className: "sr-only", children: "Close" })
    ]
  }
), v = ({
  className: t,
  ...e
}) => /* @__PURE__ */ a(
  p,
  {
    className: s(
      "animate-entrance-fade fixed inset-0 z-50 bg-black/20",
      t
    ),
    "data-slot": "sheet-overlay",
    ...e
  }
), O = ["top", "right", "bottom", "left"], y = ({
  side: t = "right",
  className: e,
  size: r = "sm",
  children: n,
  ...i
}) => /* @__PURE__ */ a(
  g,
  {
    className: s(
      "bg-surface data-[state=open]:animate-in data-[state=closed]:animate-out fixed z-50 flex flex-col gap-4 overflow-y-auto p-4 shadow-lg transition duration-300 [--screenGap:2rem] lg:[--screenGap:3rem]",
      t === "right" || t === "left" ? [
        "inset-y-0 h-full w-[calc(100vw-var(--screenGap))]",
        r && c[r]
      ] : "inset-x-0 h-auto max-h-[calc(100vh-var(--screenGap))]",
      t === "right" ? "data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right right-0 border-l" : t === "left" ? "data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left left-0 border-r" : t === "top" ? "data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top top-0 border-b" : "data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom bottom-0 border-t",
      e
    ),
    "data-slot": "sheet-content",
    ...i,
    children: n
  }
), P = ({ children: t, ...e }) => /* @__PURE__ */ o(x, { children: [
  /* @__PURE__ */ a(v, {}),
  /* @__PURE__ */ o(y, { ...e, children: [
    t,
    /* @__PURE__ */ a(S, {})
  ] })
] }), R = ({ className: t, ...e }) => /* @__PURE__ */ a(
  "div",
  {
    className: s("flex flex-col gap-1.5", t),
    "data-slot": "sheet-header",
    ...e
  }
), k = ({ className: t, ...e }) => /* @__PURE__ */ a(
  "div",
  {
    className: s("flex justify-end gap-2", t),
    "data-slot": "sheet-footer",
    ...e
  }
), X = ({
  className: t,
  ...e
}) => /* @__PURE__ */ a(
  b,
  {
    className: s("text-foreground font-semibold", t),
    "data-slot": "sheet-title",
    ...e
  }
), E = ({
  className: t,
  ...e
}) => /* @__PURE__ */ a(
  u,
  {
    className: s("text-muted-foreground text-sm", t),
    "data-slot": "sheet-description",
    ...e
  }
);
export {
  G as S,
  z as a,
  x as b,
  D as c,
  S as d,
  v as e,
  y as f,
  P as g,
  R as h,
  k as i,
  X as j,
  E as k,
  O as s
};