@stanfordspezi/spezi-web-design-system
Version:
Stanford Biodesign Digital Health Spezi Web Design System
38 lines (37 loc) • 1.14 kB
JavaScript
import { jsx as l } from "react/jsx-runtime";
import { c } from "./index-2NvaPZWc.mjs";
import { S as h } from "./SeparatorText-JZL1YX52.mjs";
const n = ({
dashColor: r,
dashSize: e,
dashGap: s,
orientation: a,
className: t,
style: o,
...d
}) => /* @__PURE__ */ l(
h,
{
"data-slot": "dashed-separator",
orientation: a,
className: c(
// We need this CSS variable so the bg class is applied in projects without a 'border' color var in the Tailwind config
"[--default-border-color:theme(colors.border)]",
a === "vertical" ? "[--tilt:0deg]" : "[--tilt:90deg]",
"bg-[linear-gradient(var(--tilt),var(--dash-color,var(--default-border-color)),var(--dash-color,var(--default-border-color))_calc(100%_-_var(--dash-gap,theme(spacing.1))),transparent_calc(100%_-_var(--dash-gap,theme(spacing.1))),transparent_100%)]",
"bg-[length:var(--dash-size,theme(spacing.4))_var(--dash-size,theme(spacing.4))]",
t
),
style: {
"--dash-color": r,
"--dash-size": e,
"--dash-gap": s,
backgroundColor: "transparent",
...o
},
...d
}
);
export {
n as D
};