@stanfordspezi/spezi-web-design-system/dist/Dialog-Df-tvqUy.mjs

Stanford Biodesign Digital Health Spezi Web Design System

import { jsxs as i, jsx as s } from "react/jsx-runtime";
import { c as e } from "./index-2NvaPZWc.mjs";
import { sizeToMaxWidthRecord as n } from "./utils/tailwind.js";
import c from "./x-0Nj1BYxw.mjs";
import { R as d, C as r, P as g, T as m, a as f, D as p, O as x, b as D } from "./index-DO0S-IqU.mjs";
const z = d, O = m, h = g, w = r, y = ({
  className: a,
  ...o
}) => /* @__PURE__ */ i(
  r,
  {
    "data-slot": "dialog-close",
    className: e(
      "focus-ring absolute top-4 right-4 opacity-70 transition hover:opacity-100 disabled:pointer-events-none",
      a
    ),
    ...o,
    children: [
      /* @__PURE__ */ s(c, { className: "size-4" }),
      /* @__PURE__ */ s("span", { className: "sr-only", children: "Close" })
    ]
  }
), b = ({
  className: a,
  ...o
}) => /* @__PURE__ */ s(
  x,
  {
    "data-slot": "dialog-overlay",
    className: e(
      "animate-entrance-fade fixed inset-0 z-50 bg-black/20",
      a
    ),
    "data-testid": "dialogOverlay",
    ...o
  }
), v = ({
  size: a = "lg",
  className: o,
  children: t,
  ...l
}) => /* @__PURE__ */ s(
  f,
  {
    "data-slot": "dialog-content",
    className: e(
      "animate-entrance-fade-zoom bg-surface fixed top-[50%] left-[50%] z-50 grid w-full translate-x-[-50%] translate-y-[-50%] gap-4 border p-6 shadow-lg sm:rounded-lg",
      a && n[a],
      o
    ),
    ...l,
    children: t
  }
), P = ({
  className: a,
  children: o,
  size: t,
  ...l
}) => /* @__PURE__ */ i(h, { children: [
  /* @__PURE__ */ s(b, {}),
  /* @__PURE__ */ i(v, { className: a, size: t, ...l, children: [
    o,
    /* @__PURE__ */ s(y, {})
  ] })
] }), R = ({
  className: a,
  ...o
}) => /* @__PURE__ */ s(
  "div",
  {
    "data-slot": "dialog-header",
    className: e(
      "flex flex-col space-y-1.5 text-center sm:text-left",
      a
    ),
    ...o
  }
), k = ({
  className: a,
  ...o
}) => /* @__PURE__ */ s(
  "div",
  {
    "data-slot": "dialog-footer",
    className: e(
      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
      a
    ),
    ...o
  }
), X = ({
  className: a,
  ...o
}) => /* @__PURE__ */ s(
  D,
  {
    "data-slot": "dialog-title",
    className: e("text-lg font-semibold", a),
    ...o
  }
), E = ({
  className: a,
  ...o
}) => /* @__PURE__ */ s(
  p,
  {
    "data-slot": "dialog-description",
    className: e("text-muted-foreground text-sm", a),
    ...o
  }
);
export {
  z as D,
  w as a,
  y as b,
  P as c,
  v as d,
  E as e,
  k as f,
  R as g,
  b as h,
  h as i,
  X as j,
  O as k
};