/* Dentist site — shared atoms */
const { useEffect: dUE, useRef: dUR, useState: dUS } = React;
function Reveal({ as = "div", delay = 0, className = "", style = {}, children, ...rest }) {
const ref = dUR(null);
dUE(() => {
const el = ref.current; if (!el) return;
const io = new IntersectionObserver(([e]) => {
if (e.isIntersecting) { el.classList.add("is-in"); io.unobserve(el); }
}, { threshold: 0.1, rootMargin: "0px 0px -6% 0px" });
io.observe(el);
const fallback = setTimeout(() => el && el.classList.add("is-in"), 1600);
return () => { io.disconnect(); clearTimeout(fallback); };
}, []);
const Tag = as;
return (
{children}
);
}
function Slot({ caption, ratio = "4 / 5", style = {}, className = "", children }) {
return (
{caption}{children}
);
}
function Wordmark({ size = 18, color = "currentColor" }) {
const h = Math.round(size * 1.15);
return (
);
}
const I = {
Arrow: (p) => ,
Plus: (p) => ,
Minus: (p) => ,
Close: (p) => ,
Check: (p) => ,
Download: (p) => ,
};
/* Brand pattern from the packaging — gold lines on black (dark mode)
or gold/dark on white (light mode). */
function ShatterLines({ mode, opacity, stroke, lines, seed, ...rest }) {
const isDark = mode === "dark" || (stroke && stroke.includes("239"));
const src = isDark ? "uploads/black-box-web.png" : "uploads/white-box-web.png";
const op = opacity ?? (isDark ? 0.28 : 0.16);
return (
);
}
/* Spec-row helper */
function SpecRow({ k, v }) {
return (
{k}
{v}
);
}
Object.assign(window, { Reveal, Slot, Wordmark, I, ShatterLines, SpecRow });