UNPKG

@stanfordspezi/spezi-web-design-system

Version:

Stanford Biodesign Digital Health Spezi Web Design System

114 lines (113 loc) 3.03 kB
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 d from "./x-0Nj1BYxw.mjs"; import { R as h, C as l, P as m, T as f, a as p, D as g, O as b, b as u } from "./index-DO0S-IqU.mjs"; const G = h, z = f, x = m, D = l, S = ({ className: t, ...e }) => /* @__PURE__ */ o( l, { "data-slot": "sheet-close", 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( b, { 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( p, { 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( u, { className: s("text-foreground font-semibold", t), "data-slot": "sheet-title", ...e } ), E = ({ className: t, ...e }) => /* @__PURE__ */ a( g, { className: s("text-muted-foreground text-sm", t), "data-slot": "sheet-description", ...e } ); export { G as S, D as a, S as b, P as c, y as d, E as e, k as f, R as g, v as h, x as i, X as j, z as k, O as s };