@yo-yo.art/ui 0.0.0-stage → 0.1.1

package/dist/gallery/HomeButton/HomeButton.cjs

@@ -0,0 +1,20 @@
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+// src/gallery/HomeButton/HomeButton.tsx
+const HomeButton = ({ href, label = "Grupo Yo-Yo" }) => {
+	const stop = (event) => event.stopPropagation();
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("a", {
+		href,
+		onPointerDown: stop,
+		onTouchStart: stop,
+		"aria-label": `Volver a ${label}`,
+		className: "fixed left-4 top-4 z-[9999] flex items-center gap-2 border border-base-content/12 bg-base-100/85 px-3 py-2 font-mono text-[0.65rem] uppercase tracking-[0.18em] text-base-content/60 backdrop-blur-md transition-colors [touch-action:manipulation] hover:text-base-content",
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowLeft, { className: "size-3.5" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+			className: "hidden sm:inline",
+			children: label
+		})]
+	});
+};
+exports.HomeButton = HomeButton;
+
+//# sourceMappingURL=HomeButton.cjs.map

package/dist/gallery/HomeButton/HomeButton.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"HomeButton.cjs","names":["ArrowLeft"],"sources":["../../../src/gallery/HomeButton/HomeButton.tsx"],"sourcesContent":["import type { SyntheticEvent } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\n\nexport type HomeButtonProps = {\n  href: string;\n  /** Group name shown next to the arrow. */\n  label?: string;\n};\n\nexport const HomeButton = ({ href, label = \"Grupo Yo-Yo\" }: HomeButtonProps) => {\n  const stop = (event: SyntheticEvent) => event.stopPropagation();\n\n  return (\n    <a\n      href={href}\n      onPointerDown={stop}\n      onTouchStart={stop}\n      aria-label={`Volver a ${label}`}\n      className=\"fixed left-4 top-4 z-[9999] flex items-center gap-2 border border-base-content/12 bg-base-100/85 px-3 py-2 font-mono text-[0.65rem] uppercase tracking-[0.18em] text-base-content/60 backdrop-blur-md transition-colors [touch-action:manipulation] hover:text-base-content\"\n    >\n      <ArrowLeft className=\"size-3.5\" />\n      <span className=\"hidden sm:inline\">{label}</span>\n    </a>\n  );\n};\n"],"mappings":";;;AASA,MAAa,cAAc,EAAE,MAAM,QAAQ,oBAAqC;CAC9E,MAAM,QAAQ,UAA0B,MAAM,gBAAgB;CAE9D,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD;EACQ;EACN,eAAe;EACf,cAAc;EACd,cAAY,YAAY;EACxB,WAAU;EALZ,UAAA,CAOE,iBAAA,GAAA,kBAAA,IAAA,CAACA,aAAAA,WAAD,EAAW,WAAU,WAAY,CAAA,GACjC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GAAoB,UAAA;EAAY,CAAA,CAC/C;;AAEP"}

package/dist/gallery/HomeButton/HomeButton.d.cts

@@ -0,0 +1,8 @@
+type HomeButtonProps = {
+  href: string;
+  /** Group name shown next to the arrow. */
+  label?: string;
+};
+declare const HomeButton: ({ href, label }: HomeButtonProps) => import("react").JSX.Element;
+export { HomeButton, HomeButtonProps };
+//# sourceMappingURL=HomeButton.d.cts.map

package/dist/gallery/HomeButton/HomeButton.d.mts

@@ -0,0 +1,8 @@
+type HomeButtonProps = {
+  href: string;
+  /** Group name shown next to the arrow. */
+  label?: string;
+};
+declare const HomeButton: ({ href, label }: HomeButtonProps) => import("react").JSX.Element;
+export { HomeButton, HomeButtonProps };
+//# sourceMappingURL=HomeButton.d.mts.map

package/dist/gallery/HomeButton/HomeButton.mjs

@@ -0,0 +1,20 @@
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowLeft } from "lucide-react";
+// src/gallery/HomeButton/HomeButton.tsx
+const HomeButton = ({ href, label = "Grupo Yo-Yo" }) => {
+	const stop = (event) => event.stopPropagation();
+	return /* @__PURE__ */ jsxs("a", {
+		href,
+		onPointerDown: stop,
+		onTouchStart: stop,
+		"aria-label": `Volver a ${label}`,
+		className: "fixed left-4 top-4 z-[9999] flex items-center gap-2 border border-base-content/12 bg-base-100/85 px-3 py-2 font-mono text-[0.65rem] uppercase tracking-[0.18em] text-base-content/60 backdrop-blur-md transition-colors [touch-action:manipulation] hover:text-base-content",
+		children: [/* @__PURE__ */ jsx(ArrowLeft, { className: "size-3.5" }), /* @__PURE__ */ jsx("span", {
+			className: "hidden sm:inline",
+			children: label
+		})]
+	});
+};
+export { HomeButton };
+
+//# sourceMappingURL=HomeButton.mjs.map

package/dist/gallery/HomeButton/HomeButton.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"HomeButton.mjs","names":[],"sources":["../../../src/gallery/HomeButton/HomeButton.tsx"],"sourcesContent":["import type { SyntheticEvent } from \"react\";\nimport { ArrowLeft } from \"lucide-react\";\n\nexport type HomeButtonProps = {\n  href: string;\n  /** Group name shown next to the arrow. */\n  label?: string;\n};\n\nexport const HomeButton = ({ href, label = \"Grupo Yo-Yo\" }: HomeButtonProps) => {\n  const stop = (event: SyntheticEvent) => event.stopPropagation();\n\n  return (\n    <a\n      href={href}\n      onPointerDown={stop}\n      onTouchStart={stop}\n      aria-label={`Volver a ${label}`}\n      className=\"fixed left-4 top-4 z-[9999] flex items-center gap-2 border border-base-content/12 bg-base-100/85 px-3 py-2 font-mono text-[0.65rem] uppercase tracking-[0.18em] text-base-content/60 backdrop-blur-md transition-colors [touch-action:manipulation] hover:text-base-content\"\n    >\n      <ArrowLeft className=\"size-3.5\" />\n      <span className=\"hidden sm:inline\">{label}</span>\n    </a>\n  );\n};\n"],"mappings":";;;AASA,MAAa,cAAc,EAAE,MAAM,QAAQ,oBAAqC;CAC9E,MAAM,QAAQ,UAA0B,MAAM,gBAAgB;CAE9D,OACE,qBAAC,KAAD;EACQ;EACN,eAAe;EACf,cAAc;EACd,cAAY,YAAY;EACxB,WAAU;EALZ,UAAA,CAOE,oBAAC,WAAD,EAAW,WAAU,WAAY,CAAA,GACjC,oBAAC,QAAD;GAAM,WAAU;GAAoB,UAAA;EAAY,CAAA,CAC/C;;AAEP"}

package/dist/gallery/HomeButton/index.cjs

@@ -0,0 +1,2 @@
+const require_HomeButton = require("./HomeButton.cjs");
+exports.HomeButton = require_HomeButton.HomeButton;

package/dist/gallery/HomeButton/index.mjs

@@ -0,0 +1 @@
+export { HomeButton } from "./HomeButton.mjs";

package/dist/gallery/LoadingScreen/LoadingScreen.cjs

@@ -0,0 +1,108 @@
+const require_Button = require("../../components/Button/Button.cjs");
+require("../../components/Button/index.cjs");
+const require_Eyebrow = require("../../components/Eyebrow/Eyebrow.cjs");
+require("../../components/Eyebrow/index.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let react = require("react");
+// src/gallery/LoadingScreen/LoadingScreen.tsx
+const EMPTY = {
+	loaded: 0,
+	total: 0,
+	done: false
+};
+const LoadingScreen = ({ gallery, eyebrow = "Sol Úbeda", title, label, enterLabel, hint, onEnter, fadeDuration = 600 }) => {
+	const [state, setState] = (0, react.useState)(EMPTY);
+	const [entered, setEntered] = (0, react.useState)(false);
+	const [gone, setGone] = (0, react.useState)(false);
+	const timer = (0, react.useRef)(null);
+	(0, react.useEffect)(() => {
+		if (!gallery) return;
+		return gallery.loading.subscribe(setState);
+	}, [gallery]);
+	(0, react.useEffect)(() => () => {
+		if (timer.current !== null) window.clearTimeout(timer.current);
+	}, []);
+	const enter = (0, react.useCallback)(() => {
+		if (entered) return;
+		if (window.matchMedia("(pointer: coarse)").matches) try {
+			const fullscreen = document.documentElement.requestFullscreen?.();
+			const orientation = screen.orientation;
+			if (fullscreen) fullscreen.then(() => orientation?.lock?.("landscape")).catch(() => void 0);
+		} catch {}
+		onEnter?.();
+		setEntered(true);
+		timer.current = window.setTimeout(() => setGone(true), fadeDuration);
+	}, [
+		entered,
+		fadeDuration,
+		onEnter
+	]);
+	if (gone) return null;
+	const ready = gallery !== null && state.done;
+	const progress = state.total > 0 ? state.loaded / state.total : 0;
+	const percent = Math.round(progress * 100);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": title,
+		className: "fixed inset-0 z-[10000] flex flex-col overflow-y-auto bg-base-100 text-base-content",
+		style: {
+			opacity: entered ? 0 : 1,
+			pointerEvents: entered ? "none" : "auto",
+			transition: `opacity ${fadeDuration}ms ease`
+		},
+		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("main", {
+			className: "flex flex-1 flex-col items-center justify-center px-6 py-16",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+				className: "w-full max-w-xl text-center",
+				children: [
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Eyebrow.Eyebrow, { children: eyebrow }),
+					/* @__PURE__ */ (0, react_jsx_runtime.jsx)("h1", {
+						className: "mt-6 text-5xl font-semibold leading-[0.94] tracking-[-0.045em] text-balance sm:text-6xl",
+						children: title
+					}),
+					ready ? /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(require_Button.Button, {
+						onClick: enter,
+						onPointerUp: enter,
+						className: "group mt-10",
+						children: [enterLabel, /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ArrowUpRight, { className: "size-4 transition-transform duration-300 group-hover:translate-x-0.5 group-hover:-translate-y-0.5" })]
+					}) : /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+						className: "mx-auto mt-10 w-full max-w-sm",
+						children: [
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
+								className: "text-sm text-base-content/60",
+								children: label
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+								role: "progressbar",
+								"aria-valuemin": 0,
+								"aria-valuemax": 100,
+								"aria-valuenow": percent,
+								"aria-label": label,
+								className: "mt-3 h-0.5 w-full bg-base-content/15",
+								children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+									className: "h-full bg-primary transition-[width] duration-200",
+									style: { width: `${percent}%` }
+								})
+							}),
+							/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+								className: "mt-2 font-mono text-xs tabular-nums text-base-content/60",
+								children: [percent, " %"]
+							})
+						]
+					})
+				]
+			})
+		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("footer", {
+			className: "border-t border-base-content/12 px-6 py-4",
+			children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("p", {
+				className: "mx-auto flex max-w-3xl items-center justify-center gap-2 text-center font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content/60",
+				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.Maximize, { className: "size-3.5 shrink-0" }), /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", { children: hint })]
+			})
+		})]
+	});
+};
+exports.LoadingScreen = LoadingScreen;
+
+//# sourceMappingURL=LoadingScreen.cjs.map

package/dist/gallery/LoadingScreen/LoadingScreen.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingScreen.cjs","names":["useState","useRef","useCallback","Eyebrow","Button","ArrowUpRight","Maximize"],"sources":["../../../src/gallery/LoadingScreen/LoadingScreen.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { ArrowUpRight, Maximize } from \"lucide-react\";\nimport { Button } from \"../../components/Button\";\nimport { Eyebrow } from \"../../components/Eyebrow\";\n\nexport type LoadingState = {\n  loaded: number;\n  total: number;\n  done: boolean;\n};\n\nexport type LoadingGallery = {\n  loading: {\n    subscribe: (listener: (state: LoadingState) => void) => () => void;\n  };\n};\n\nexport type LoadingScreenProps = {\n  /** The live gallery, or null until the gallery is ready. */\n  gallery: LoadingGallery | null;\n  /** Artist name shown above the title. */\n  eyebrow?: string;\n  /** Room title. */\n  title: string;\n  /** Text while the assets load. */\n  label: string;\n  /** Button label once everything is ready. */\n  enterLabel: string;\n  /** Hint shown while loading and once ready. */\n  hint: string;\n  /** Called when the visitor enters, before the fade starts. */\n  onEnter?: () => void;\n  /** Fade duration in ms. */\n  fadeDuration?: number;\n};\n\nconst EMPTY: LoadingState = { loaded: 0, total: 0, done: false };\n\nexport const LoadingScreen = ({\n  gallery,\n  eyebrow = \"Sol Úbeda\",\n  title,\n  label,\n  enterLabel,\n  hint,\n  onEnter,\n  fadeDuration = 600,\n}: LoadingScreenProps) => {\n  const [state, setState] = useState(EMPTY);\n  const [entered, setEntered] = useState(false);\n  const [gone, setGone] = useState(false);\n  const timer = useRef<number | null>(null);\n\n  useEffect(() => {\n    if (!gallery) return;\n    return gallery.loading.subscribe(setState);\n  }, [gallery]);\n\n  useEffect(\n    () => () => {\n      if (timer.current !== null) window.clearTimeout(timer.current);\n    },\n    [],\n  );\n\n  const enter = useCallback(() => {\n    if (entered) return;\n    if (window.matchMedia(\"(pointer: coarse)\").matches) {\n      try {\n        const fullscreen = document.documentElement.requestFullscreen?.();\n        const orientation = screen.orientation as unknown as {\n          lock?: (orientation: string) => Promise<void>;\n        };\n        if (fullscreen) {\n          fullscreen.then(() => orientation?.lock?.(\"landscape\")).catch(() => undefined);\n        }\n      } catch {\n        // Without fullscreen or lock the room still works.\n      }\n    }\n    onEnter?.();\n    setEntered(true);\n    timer.current = window.setTimeout(() => setGone(true), fadeDuration);\n  }, [entered, fadeDuration, onEnter]);\n\n  if (gone) return null;\n\n  const ready = gallery !== null && state.done;\n  const progress = state.total > 0 ? state.loaded / state.total : 0;\n  const percent = Math.round(progress * 100);\n\n  return (\n    <div\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label={title}\n      className=\"fixed inset-0 z-[10000] flex flex-col overflow-y-auto bg-base-100 text-base-content\"\n      style={{\n        opacity: entered ? 0 : 1,\n        pointerEvents: entered ? \"none\" : \"auto\",\n        transition: `opacity ${fadeDuration}ms ease`,\n      }}\n    >\n      <main className=\"flex flex-1 flex-col items-center justify-center px-6 py-16\">\n        <div className=\"w-full max-w-xl text-center\">\n          <Eyebrow>{eyebrow}</Eyebrow>\n          <h1 className=\"mt-6 text-5xl font-semibold leading-[0.94] tracking-[-0.045em] text-balance sm:text-6xl\">\n            {title}\n          </h1>\n\n          {ready ? (\n            <Button onClick={enter} onPointerUp={enter} className=\"group mt-10\">\n              {enterLabel}\n              <ArrowUpRight className=\"size-4 transition-transform duration-300 group-hover:translate-x-0.5 group-hover:-translate-y-0.5\" />\n            </Button>\n          ) : (\n            <div className=\"mx-auto mt-10 w-full max-w-sm\">\n              <p className=\"text-sm text-base-content/60\">{label}</p>\n              <div\n                role=\"progressbar\"\n                aria-valuemin={0}\n                aria-valuemax={100}\n                aria-valuenow={percent}\n                aria-label={label}\n                className=\"mt-3 h-0.5 w-full bg-base-content/15\"\n              >\n                <div\n                  className=\"h-full bg-primary transition-[width] duration-200\"\n                  style={{ width: `${percent}%` }}\n                />\n              </div>\n              <p className=\"mt-2 font-mono text-xs tabular-nums text-base-content/60\">\n                {percent} %\n              </p>\n            </div>\n          )}\n        </div>\n      </main>\n\n      <footer className=\"border-t border-base-content/12 px-6 py-4\">\n        <p className=\"mx-auto flex max-w-3xl items-center justify-center gap-2 text-center font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content/60\">\n          <Maximize className=\"size-3.5 shrink-0\" />\n          <span>{hint}</span>\n        </p>\n      </footer>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAoCA,MAAM,QAAsB;CAAE,QAAQ;CAAG,OAAO;CAAG,MAAM;AAAM;AAE/D,MAAa,iBAAiB,EAC5B,SACA,UAAU,aACV,OACA,OACA,YACA,MACA,SACA,eAAe,UACS;CACxB,MAAM,CAAC,OAAO,aAAA,GAAYA,MAAAA,SAAAA,CAAS,KAAK;CACxC,MAAM,CAAC,SAAS,eAAA,GAAcA,MAAAA,SAAAA,CAAS,KAAK;CAC5C,MAAM,CAAC,MAAM,YAAA,GAAWA,MAAAA,SAAAA,CAAS,KAAK;CACtC,MAAM,SAAA,GAAQC,MAAAA,OAAAA,CAAsB,IAAI;CAExC,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,IAAI,CAAC,SAAS;EACd,OAAO,QAAQ,QAAQ,UAAU,QAAQ;CAC3C,GAAG,CAAC,OAAO,CAAC;CAEZ,CAAA,GAAA,MAAA,UAAA,aACc;EACV,IAAI,MAAM,YAAY,MAAM,OAAO,aAAa,MAAM,OAAO;CAC/D,GACA,CAAC,CACH;CAEA,MAAM,SAAA,GAAQC,MAAAA,YAAAA,OAAkB;EAC9B,IAAI,SAAS;EACb,IAAI,OAAO,WAAW,mBAAmB,CAAC,CAAC,SACzC,IAAI;GACF,MAAM,aAAa,SAAS,gBAAgB,oBAAoB;GAChE,MAAM,cAAc,OAAO;GAG3B,IAAI,YACF,WAAW,WAAW,aAAa,OAAO,WAAW,CAAC,CAAC,CAAC,YAAY,KAAA,CAAS;EAEjF,QAAQ,CAER;EAEF,UAAU;EACV,WAAW,IAAI;EACf,MAAM,UAAU,OAAO,iBAAiB,QAAQ,IAAI,GAAG,YAAY;CACrE,GAAG;EAAC;EAAS;EAAc;CAAO,CAAC;CAEnC,IAAI,MAAM,OAAO;CAEjB,MAAM,QAAQ,YAAY,QAAQ,MAAM;CACxC,MAAM,WAAW,MAAM,QAAQ,IAAI,MAAM,SAAS,MAAM,QAAQ;CAChE,MAAM,UAAU,KAAK,MAAM,WAAW,GAAG;CAEzC,OACE,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,cAAY;EACZ,WAAU;EACV,OAAO;GACL,SAAS,UAAU,IAAI;GACvB,eAAe,UAAU,SAAS;GAClC,YAAY,WAAW,aAAa;EACtC;EATF,UAAA,CAWE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;GAAM,WAAU;GACd,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,gBAAAA,SAAD,EAAA,UAAU,QAAiB,CAAA;KAC3B,iBAAA,GAAA,kBAAA,IAAA,CAAC,MAAD;MAAI,WAAU;MACX,UAAA;KACC,CAAA;KAEH,QACC,iBAAA,GAAA,kBAAA,KAAA,CAACC,eAAAA,QAAD;MAAQ,SAAS;MAAO,aAAa;MAAO,WAAU;MAAtD,UAAA,CACG,YACD,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,cAAD,EAAc,WAAU,oGAAqG,CAAA,CACvH;KAER,CAAA,IAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,KAAD;QAAG,WAAU;QAAgC,UAAA;OAAS,CAAA;OACtD,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;QACE,MAAK;QACL,iBAAe;QACf,iBAAe;QACf,iBAAe;QACf,cAAY;QACZ,WAAU;QAEV,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;SACE,WAAU;SACV,OAAO,EAAE,OAAO,GAAG,QAAQ,GAAG;QAC/B,CAAA;OACE,CAAA;OACL,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD;QAAG,WAAU;QAAb,UAAA,CACG,SAAQ,IACR;;MACA;;IAEJ;;EACD,CAAA,GAEN,iBAAA,GAAA,kBAAA,IAAA,CAAC,UAAD;GAAQ,WAAU;GAChB,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,KAAD;IAAG,WAAU;IAAb,UAAA,CACE,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,UAAD,EAAU,WAAU,oBAAqB,CAAA,GACzC,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD,EAAA,UAAO,KAAW,CAAA,CACjB;;EACG,CAAA,CACL;;AAET"}

package/dist/gallery/LoadingScreen/LoadingScreen.d.cts

@@ -0,0 +1,31 @@
+type LoadingState = {
+  loaded: number;
+  total: number;
+  done: boolean;
+};
+type LoadingGallery = {
+  loading: {
+    subscribe: (listener: (state: LoadingState) => void) => () => void;
+  };
+};
+type LoadingScreenProps = {
+  /** The live gallery, or null until the gallery is ready. */
+  gallery: LoadingGallery | null;
+  /** Artist name shown above the title. */
+  eyebrow?: string;
+  /** Room title. */
+  title: string;
+  /** Text while the assets load. */
+  label: string;
+  /** Button label once everything is ready. */
+  enterLabel: string;
+  /** Hint shown while loading and once ready. */
+  hint: string;
+  /** Called when the visitor enters, before the fade starts. */
+  onEnter?: () => void;
+  /** Fade duration in ms. */
+  fadeDuration?: number;
+};
+declare const LoadingScreen: ({ gallery, eyebrow, title, label, enterLabel, hint, onEnter, fadeDuration }: LoadingScreenProps) => import("react").JSX.Element | null;
+export { LoadingGallery, LoadingScreen, LoadingScreenProps, LoadingState };
+//# sourceMappingURL=LoadingScreen.d.cts.map

package/dist/gallery/LoadingScreen/LoadingScreen.d.mts

@@ -0,0 +1,31 @@
+type LoadingState = {
+  loaded: number;
+  total: number;
+  done: boolean;
+};
+type LoadingGallery = {
+  loading: {
+    subscribe: (listener: (state: LoadingState) => void) => () => void;
+  };
+};
+type LoadingScreenProps = {
+  /** The live gallery, or null until the gallery is ready. */
+  gallery: LoadingGallery | null;
+  /** Artist name shown above the title. */
+  eyebrow?: string;
+  /** Room title. */
+  title: string;
+  /** Text while the assets load. */
+  label: string;
+  /** Button label once everything is ready. */
+  enterLabel: string;
+  /** Hint shown while loading and once ready. */
+  hint: string;
+  /** Called when the visitor enters, before the fade starts. */
+  onEnter?: () => void;
+  /** Fade duration in ms. */
+  fadeDuration?: number;
+};
+declare const LoadingScreen: ({ gallery, eyebrow, title, label, enterLabel, hint, onEnter, fadeDuration }: LoadingScreenProps) => import("react").JSX.Element | null;
+export { LoadingGallery, LoadingScreen, LoadingScreenProps, LoadingState };
+//# sourceMappingURL=LoadingScreen.d.mts.map

package/dist/gallery/LoadingScreen/LoadingScreen.mjs

@@ -0,0 +1,108 @@
+import { Button } from "../../components/Button/Button.mjs";
+import "../../components/Button/index.mjs";
+import { Eyebrow } from "../../components/Eyebrow/Eyebrow.mjs";
+import "../../components/Eyebrow/index.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { ArrowUpRight, Maximize } from "lucide-react";
+import { useCallback, useEffect, useRef, useState } from "react";
+// src/gallery/LoadingScreen/LoadingScreen.tsx
+const EMPTY = {
+	loaded: 0,
+	total: 0,
+	done: false
+};
+const LoadingScreen = ({ gallery, eyebrow = "Sol Úbeda", title, label, enterLabel, hint, onEnter, fadeDuration = 600 }) => {
+	const [state, setState] = useState(EMPTY);
+	const [entered, setEntered] = useState(false);
+	const [gone, setGone] = useState(false);
+	const timer = useRef(null);
+	useEffect(() => {
+		if (!gallery) return;
+		return gallery.loading.subscribe(setState);
+	}, [gallery]);
+	useEffect(() => () => {
+		if (timer.current !== null) window.clearTimeout(timer.current);
+	}, []);
+	const enter = useCallback(() => {
+		if (entered) return;
+		if (window.matchMedia("(pointer: coarse)").matches) try {
+			const fullscreen = document.documentElement.requestFullscreen?.();
+			const orientation = screen.orientation;
+			if (fullscreen) fullscreen.then(() => orientation?.lock?.("landscape")).catch(() => void 0);
+		} catch {}
+		onEnter?.();
+		setEntered(true);
+		timer.current = window.setTimeout(() => setGone(true), fadeDuration);
+	}, [
+		entered,
+		fadeDuration,
+		onEnter
+	]);
+	if (gone) return null;
+	const ready = gallery !== null && state.done;
+	const progress = state.total > 0 ? state.loaded / state.total : 0;
+	const percent = Math.round(progress * 100);
+	return /* @__PURE__ */ jsxs("div", {
+		role: "dialog",
+		"aria-modal": "true",
+		"aria-label": title,
+		className: "fixed inset-0 z-[10000] flex flex-col overflow-y-auto bg-base-100 text-base-content",
+		style: {
+			opacity: entered ? 0 : 1,
+			pointerEvents: entered ? "none" : "auto",
+			transition: `opacity ${fadeDuration}ms ease`
+		},
+		children: [/* @__PURE__ */ jsx("main", {
+			className: "flex flex-1 flex-col items-center justify-center px-6 py-16",
+			children: /* @__PURE__ */ jsxs("div", {
+				className: "w-full max-w-xl text-center",
+				children: [
+					/* @__PURE__ */ jsx(Eyebrow, { children: eyebrow }),
+					/* @__PURE__ */ jsx("h1", {
+						className: "mt-6 text-5xl font-semibold leading-[0.94] tracking-[-0.045em] text-balance sm:text-6xl",
+						children: title
+					}),
+					ready ? /* @__PURE__ */ jsxs(Button, {
+						onClick: enter,
+						onPointerUp: enter,
+						className: "group mt-10",
+						children: [enterLabel, /* @__PURE__ */ jsx(ArrowUpRight, { className: "size-4 transition-transform duration-300 group-hover:translate-x-0.5 group-hover:-translate-y-0.5" })]
+					}) : /* @__PURE__ */ jsxs("div", {
+						className: "mx-auto mt-10 w-full max-w-sm",
+						children: [
+							/* @__PURE__ */ jsx("p", {
+								className: "text-sm text-base-content/60",
+								children: label
+							}),
+							/* @__PURE__ */ jsx("div", {
+								role: "progressbar",
+								"aria-valuemin": 0,
+								"aria-valuemax": 100,
+								"aria-valuenow": percent,
+								"aria-label": label,
+								className: "mt-3 h-0.5 w-full bg-base-content/15",
+								children: /* @__PURE__ */ jsx("div", {
+									className: "h-full bg-primary transition-[width] duration-200",
+									style: { width: `${percent}%` }
+								})
+							}),
+							/* @__PURE__ */ jsxs("p", {
+								className: "mt-2 font-mono text-xs tabular-nums text-base-content/60",
+								children: [percent, " %"]
+							})
+						]
+					})
+				]
+			})
+		}), /* @__PURE__ */ jsx("footer", {
+			className: "border-t border-base-content/12 px-6 py-4",
+			children: /* @__PURE__ */ jsxs("p", {
+				className: "mx-auto flex max-w-3xl items-center justify-center gap-2 text-center font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content/60",
+				children: [/* @__PURE__ */ jsx(Maximize, { className: "size-3.5 shrink-0" }), /* @__PURE__ */ jsx("span", { children: hint })]
+			})
+		})]
+	});
+};
+export { LoadingScreen };
+
+//# sourceMappingURL=LoadingScreen.mjs.map

package/dist/gallery/LoadingScreen/LoadingScreen.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"LoadingScreen.mjs","names":[],"sources":["../../../src/gallery/LoadingScreen/LoadingScreen.tsx"],"sourcesContent":["import { useCallback, useEffect, useRef, useState } from \"react\";\nimport { ArrowUpRight, Maximize } from \"lucide-react\";\nimport { Button } from \"../../components/Button\";\nimport { Eyebrow } from \"../../components/Eyebrow\";\n\nexport type LoadingState = {\n  loaded: number;\n  total: number;\n  done: boolean;\n};\n\nexport type LoadingGallery = {\n  loading: {\n    subscribe: (listener: (state: LoadingState) => void) => () => void;\n  };\n};\n\nexport type LoadingScreenProps = {\n  /** The live gallery, or null until the gallery is ready. */\n  gallery: LoadingGallery | null;\n  /** Artist name shown above the title. */\n  eyebrow?: string;\n  /** Room title. */\n  title: string;\n  /** Text while the assets load. */\n  label: string;\n  /** Button label once everything is ready. */\n  enterLabel: string;\n  /** Hint shown while loading and once ready. */\n  hint: string;\n  /** Called when the visitor enters, before the fade starts. */\n  onEnter?: () => void;\n  /** Fade duration in ms. */\n  fadeDuration?: number;\n};\n\nconst EMPTY: LoadingState = { loaded: 0, total: 0, done: false };\n\nexport const LoadingScreen = ({\n  gallery,\n  eyebrow = \"Sol Úbeda\",\n  title,\n  label,\n  enterLabel,\n  hint,\n  onEnter,\n  fadeDuration = 600,\n}: LoadingScreenProps) => {\n  const [state, setState] = useState(EMPTY);\n  const [entered, setEntered] = useState(false);\n  const [gone, setGone] = useState(false);\n  const timer = useRef<number | null>(null);\n\n  useEffect(() => {\n    if (!gallery) return;\n    return gallery.loading.subscribe(setState);\n  }, [gallery]);\n\n  useEffect(\n    () => () => {\n      if (timer.current !== null) window.clearTimeout(timer.current);\n    },\n    [],\n  );\n\n  const enter = useCallback(() => {\n    if (entered) return;\n    if (window.matchMedia(\"(pointer: coarse)\").matches) {\n      try {\n        const fullscreen = document.documentElement.requestFullscreen?.();\n        const orientation = screen.orientation as unknown as {\n          lock?: (orientation: string) => Promise<void>;\n        };\n        if (fullscreen) {\n          fullscreen.then(() => orientation?.lock?.(\"landscape\")).catch(() => undefined);\n        }\n      } catch {\n        // Without fullscreen or lock the room still works.\n      }\n    }\n    onEnter?.();\n    setEntered(true);\n    timer.current = window.setTimeout(() => setGone(true), fadeDuration);\n  }, [entered, fadeDuration, onEnter]);\n\n  if (gone) return null;\n\n  const ready = gallery !== null && state.done;\n  const progress = state.total > 0 ? state.loaded / state.total : 0;\n  const percent = Math.round(progress * 100);\n\n  return (\n    <div\n      role=\"dialog\"\n      aria-modal=\"true\"\n      aria-label={title}\n      className=\"fixed inset-0 z-[10000] flex flex-col overflow-y-auto bg-base-100 text-base-content\"\n      style={{\n        opacity: entered ? 0 : 1,\n        pointerEvents: entered ? \"none\" : \"auto\",\n        transition: `opacity ${fadeDuration}ms ease`,\n      }}\n    >\n      <main className=\"flex flex-1 flex-col items-center justify-center px-6 py-16\">\n        <div className=\"w-full max-w-xl text-center\">\n          <Eyebrow>{eyebrow}</Eyebrow>\n          <h1 className=\"mt-6 text-5xl font-semibold leading-[0.94] tracking-[-0.045em] text-balance sm:text-6xl\">\n            {title}\n          </h1>\n\n          {ready ? (\n            <Button onClick={enter} onPointerUp={enter} className=\"group mt-10\">\n              {enterLabel}\n              <ArrowUpRight className=\"size-4 transition-transform duration-300 group-hover:translate-x-0.5 group-hover:-translate-y-0.5\" />\n            </Button>\n          ) : (\n            <div className=\"mx-auto mt-10 w-full max-w-sm\">\n              <p className=\"text-sm text-base-content/60\">{label}</p>\n              <div\n                role=\"progressbar\"\n                aria-valuemin={0}\n                aria-valuemax={100}\n                aria-valuenow={percent}\n                aria-label={label}\n                className=\"mt-3 h-0.5 w-full bg-base-content/15\"\n              >\n                <div\n                  className=\"h-full bg-primary transition-[width] duration-200\"\n                  style={{ width: `${percent}%` }}\n                />\n              </div>\n              <p className=\"mt-2 font-mono text-xs tabular-nums text-base-content/60\">\n                {percent} %\n              </p>\n            </div>\n          )}\n        </div>\n      </main>\n\n      <footer className=\"border-t border-base-content/12 px-6 py-4\">\n        <p className=\"mx-auto flex max-w-3xl items-center justify-center gap-2 text-center font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content/60\">\n          <Maximize className=\"size-3.5 shrink-0\" />\n          <span>{hint}</span>\n        </p>\n      </footer>\n    </div>\n  );\n};\n"],"mappings":";;;;;;;;AAoCA,MAAM,QAAsB;CAAE,QAAQ;CAAG,OAAO;CAAG,MAAM;AAAM;AAE/D,MAAa,iBAAiB,EAC5B,SACA,UAAU,aACV,OACA,OACA,YACA,MACA,SACA,eAAe,UACS;CACxB,MAAM,CAAC,OAAO,YAAY,SAAS,KAAK;CACxC,MAAM,CAAC,SAAS,cAAc,SAAS,KAAK;CAC5C,MAAM,CAAC,MAAM,WAAW,SAAS,KAAK;CACtC,MAAM,QAAQ,OAAsB,IAAI;CAExC,gBAAgB;EACd,IAAI,CAAC,SAAS;EACd,OAAO,QAAQ,QAAQ,UAAU,QAAQ;CAC3C,GAAG,CAAC,OAAO,CAAC;CAEZ,sBACc;EACV,IAAI,MAAM,YAAY,MAAM,OAAO,aAAa,MAAM,OAAO;CAC/D,GACA,CAAC,CACH;CAEA,MAAM,QAAQ,kBAAkB;EAC9B,IAAI,SAAS;EACb,IAAI,OAAO,WAAW,mBAAmB,CAAC,CAAC,SACzC,IAAI;GACF,MAAM,aAAa,SAAS,gBAAgB,oBAAoB;GAChE,MAAM,cAAc,OAAO;GAG3B,IAAI,YACF,WAAW,WAAW,aAAa,OAAO,WAAW,CAAC,CAAC,CAAC,YAAY,KAAA,CAAS;EAEjF,QAAQ,CAER;EAEF,UAAU;EACV,WAAW,IAAI;EACf,MAAM,UAAU,OAAO,iBAAiB,QAAQ,IAAI,GAAG,YAAY;CACrE,GAAG;EAAC;EAAS;EAAc;CAAO,CAAC;CAEnC,IAAI,MAAM,OAAO;CAEjB,MAAM,QAAQ,YAAY,QAAQ,MAAM;CACxC,MAAM,WAAW,MAAM,QAAQ,IAAI,MAAM,SAAS,MAAM,QAAQ;CAChE,MAAM,UAAU,KAAK,MAAM,WAAW,GAAG;CAEzC,OACE,qBAAC,OAAD;EACE,MAAK;EACL,cAAW;EACX,cAAY;EACZ,WAAU;EACV,OAAO;GACL,SAAS,UAAU,IAAI;GACvB,eAAe,UAAU,SAAS;GAClC,YAAY,WAAW,aAAa;EACtC;EATF,UAAA,CAWE,oBAAC,QAAD;GAAM,WAAU;GACd,UAAA,qBAAC,OAAD;IAAK,WAAU;IAAf,UAAA;KACE,oBAAC,SAAD,EAAA,UAAU,QAAiB,CAAA;KAC3B,oBAAC,MAAD;MAAI,WAAU;MACX,UAAA;KACC,CAAA;KAEH,QACC,qBAAC,QAAD;MAAQ,SAAS;MAAO,aAAa;MAAO,WAAU;MAAtD,UAAA,CACG,YACD,oBAAC,cAAD,EAAc,WAAU,oGAAqG,CAAA,CACvH;KAER,CAAA,IAAA,qBAAC,OAAD;MAAK,WAAU;MAAf,UAAA;OACE,oBAAC,KAAD;QAAG,WAAU;QAAgC,UAAA;OAAS,CAAA;OACtD,oBAAC,OAAD;QACE,MAAK;QACL,iBAAe;QACf,iBAAe;QACf,iBAAe;QACf,cAAY;QACZ,WAAU;QAEV,UAAA,oBAAC,OAAD;SACE,WAAU;SACV,OAAO,EAAE,OAAO,GAAG,QAAQ,GAAG;QAC/B,CAAA;OACE,CAAA;OACL,qBAAC,KAAD;QAAG,WAAU;QAAb,UAAA,CACG,SAAQ,IACR;;MACA;;IAEJ;;EACD,CAAA,GAEN,oBAAC,UAAD;GAAQ,WAAU;GAChB,UAAA,qBAAC,KAAD;IAAG,WAAU;IAAb,UAAA,CACE,oBAAC,UAAD,EAAU,WAAU,oBAAqB,CAAA,GACzC,oBAAC,QAAD,EAAA,UAAO,KAAW,CAAA,CACjB;;EACG,CAAA,CACL;;AAET"}

package/dist/gallery/LoadingScreen/index.cjs

@@ -0,0 +1,2 @@
+const require_LoadingScreen = require("./LoadingScreen.cjs");
+exports.LoadingScreen = require_LoadingScreen.LoadingScreen;

package/dist/gallery/LoadingScreen/index.mjs

@@ -0,0 +1 @@
+export { LoadingScreen } from "./LoadingScreen.mjs";

package/dist/gallery/SetupNotice/SetupNotice.cjs

@@ -0,0 +1,41 @@
+const require_IconButton = require("../../components/IconButton/IconButton.cjs");
+require("../../components/IconButton/index.cjs");
+let react_jsx_runtime = require("react/jsx-runtime");
+let lucide_react = require("lucide-react");
+let react = require("react");
+// src/gallery/SetupNotice/SetupNotice.tsx
+const SetupNotice = ({ message = "Puedes recorrerla mientras la terminamos.", duration = 8e3 }) => {
+	const [open, setOpen] = (0, react.useState)(true);
+	(0, react.useEffect)(() => {
+		const timer = setTimeout(() => setOpen(false), duration);
+		return () => clearTimeout(timer);
+	}, [duration]);
+	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
+		className: `pointer-events-none fixed inset-x-0 top-4 z-[9998] flex justify-center px-4 transition-all duration-500 ${open ? "translate-y-0 opacity-100" : "-translate-y-3 opacity-0"}`,
+		"aria-hidden": !open,
+		children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
+			className: "pointer-events-auto flex max-w-[92vw] items-center gap-3 border border-base-content/12 bg-base-100/85 py-2 pl-3 pr-2 text-sm backdrop-blur-md",
+			children: [
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content",
+					children: "Sala en montaje"
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
+					className: "text-base-content/60",
+					children: message
+				}),
+				/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_IconButton.IconButton, {
+					label: "Cerrar aviso",
+					variant: "ghost",
+					size: "xs",
+					onClick: () => setOpen(false),
+					className: "ml-1",
+					children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.X, { className: "size-3.5" })
+				})
+			]
+		})
+	});
+};
+exports.SetupNotice = SetupNotice;
+
+//# sourceMappingURL=SetupNotice.cjs.map

package/dist/gallery/SetupNotice/SetupNotice.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SetupNotice.cjs","names":["useState","IconButton","X"],"sources":["../../../src/gallery/SetupNotice/SetupNotice.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { X } from \"lucide-react\";\nimport { IconButton } from \"../../components/IconButton\";\n\nexport type SetupNoticeProps = {\n  /** Message shown next to the status label. */\n  message?: string;\n  /** Time in ms before the notice fades on its own. */\n  duration?: number;\n};\n\nexport const SetupNotice = ({\n  message = \"Puedes recorrerla mientras la terminamos.\",\n  duration = 8000,\n}: SetupNoticeProps) => {\n  const [open, setOpen] = useState(true);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setOpen(false), duration);\n    return () => clearTimeout(timer);\n  }, [duration]);\n\n  return (\n    <div\n      className={`pointer-events-none fixed inset-x-0 top-4 z-[9998] flex justify-center px-4 transition-all duration-500 ${\n        open ? \"translate-y-0 opacity-100\" : \"-translate-y-3 opacity-0\"\n      }`}\n      aria-hidden={!open}\n    >\n      <div className=\"pointer-events-auto flex max-w-[92vw] items-center gap-3 border border-base-content/12 bg-base-100/85 py-2 pl-3 pr-2 text-sm backdrop-blur-md\">\n        <span className=\"font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content\">\n          Sala en montaje\n        </span>\n        <span className=\"text-base-content/60\">{message}</span>\n        <IconButton\n          label=\"Cerrar aviso\"\n          variant=\"ghost\"\n          size=\"xs\"\n          onClick={() => setOpen(false)}\n          className=\"ml-1\"\n        >\n          <X className=\"size-3.5\" />\n        </IconButton>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAWA,MAAa,eAAe,EAC1B,UAAU,6CACV,WAAW,UACW;CACtB,MAAM,CAAC,MAAM,YAAA,GAAWA,MAAAA,SAAAA,CAAS,IAAI;CAErC,CAAA,GAAA,MAAA,UAAA,OAAgB;EACd,MAAM,QAAQ,iBAAiB,QAAQ,KAAK,GAAG,QAAQ;EACvD,aAAa,aAAa,KAAK;CACjC,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,OAAD;EACE,WAAW,2GACT,OAAO,8BAA8B;EAEvC,eAAa,CAAC;EAEd,UAAA,iBAAA,GAAA,kBAAA,KAAA,CAAC,OAAD;GAAK,WAAU;GAAf,UAAA;IACE,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KAAM,WAAU;KAAyE,UAAA;IAEnF,CAAA;IACN,iBAAA,GAAA,kBAAA,IAAA,CAAC,QAAD;KAAM,WAAU;KAAwB,UAAA;IAAc,CAAA;IACtD,iBAAA,GAAA,kBAAA,IAAA,CAACC,mBAAAA,YAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAK;KACL,eAAe,QAAQ,KAAK;KAC5B,WAAU;KAEV,UAAA,iBAAA,GAAA,kBAAA,IAAA,CAACC,aAAAA,GAAD,EAAG,WAAU,WAAY,CAAA;IACf,CAAA;GACT;;CACF,CAAA;AAET"}

package/dist/gallery/SetupNotice/SetupNotice.d.cts

@@ -0,0 +1,9 @@
+type SetupNoticeProps = {
+  /** Message shown next to the status label. */
+  message?: string;
+  /** Time in ms before the notice fades on its own. */
+  duration?: number;
+};
+declare const SetupNotice: ({ message, duration }: SetupNoticeProps) => import("react").JSX.Element;
+export { SetupNotice, SetupNoticeProps };
+//# sourceMappingURL=SetupNotice.d.cts.map

package/dist/gallery/SetupNotice/SetupNotice.d.mts

@@ -0,0 +1,9 @@
+type SetupNoticeProps = {
+  /** Message shown next to the status label. */
+  message?: string;
+  /** Time in ms before the notice fades on its own. */
+  duration?: number;
+};
+declare const SetupNotice: ({ message, duration }: SetupNoticeProps) => import("react").JSX.Element;
+export { SetupNotice, SetupNoticeProps };
+//# sourceMappingURL=SetupNotice.d.mts.map

package/dist/gallery/SetupNotice/SetupNotice.mjs

@@ -0,0 +1,41 @@
+import { IconButton } from "../../components/IconButton/IconButton.mjs";
+import "../../components/IconButton/index.mjs";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { X } from "lucide-react";
+import { useEffect, useState } from "react";
+// src/gallery/SetupNotice/SetupNotice.tsx
+const SetupNotice = ({ message = "Puedes recorrerla mientras la terminamos.", duration = 8e3 }) => {
+	const [open, setOpen] = useState(true);
+	useEffect(() => {
+		const timer = setTimeout(() => setOpen(false), duration);
+		return () => clearTimeout(timer);
+	}, [duration]);
+	return /* @__PURE__ */ jsx("div", {
+		className: `pointer-events-none fixed inset-x-0 top-4 z-[9998] flex justify-center px-4 transition-all duration-500 ${open ? "translate-y-0 opacity-100" : "-translate-y-3 opacity-0"}`,
+		"aria-hidden": !open,
+		children: /* @__PURE__ */ jsxs("div", {
+			className: "pointer-events-auto flex max-w-[92vw] items-center gap-3 border border-base-content/12 bg-base-100/85 py-2 pl-3 pr-2 text-sm backdrop-blur-md",
+			children: [
+				/* @__PURE__ */ jsx("span", {
+					className: "font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content",
+					children: "Sala en montaje"
+				}),
+				/* @__PURE__ */ jsx("span", {
+					className: "text-base-content/60",
+					children: message
+				}),
+				/* @__PURE__ */ jsx(IconButton, {
+					label: "Cerrar aviso",
+					variant: "ghost",
+					size: "xs",
+					onClick: () => setOpen(false),
+					className: "ml-1",
+					children: /* @__PURE__ */ jsx(X, { className: "size-3.5" })
+				})
+			]
+		})
+	});
+};
+export { SetupNotice };
+
+//# sourceMappingURL=SetupNotice.mjs.map

package/dist/gallery/SetupNotice/SetupNotice.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"SetupNotice.mjs","names":[],"sources":["../../../src/gallery/SetupNotice/SetupNotice.tsx"],"sourcesContent":["import { useEffect, useState } from \"react\";\nimport { X } from \"lucide-react\";\nimport { IconButton } from \"../../components/IconButton\";\n\nexport type SetupNoticeProps = {\n  /** Message shown next to the status label. */\n  message?: string;\n  /** Time in ms before the notice fades on its own. */\n  duration?: number;\n};\n\nexport const SetupNotice = ({\n  message = \"Puedes recorrerla mientras la terminamos.\",\n  duration = 8000,\n}: SetupNoticeProps) => {\n  const [open, setOpen] = useState(true);\n\n  useEffect(() => {\n    const timer = setTimeout(() => setOpen(false), duration);\n    return () => clearTimeout(timer);\n  }, [duration]);\n\n  return (\n    <div\n      className={`pointer-events-none fixed inset-x-0 top-4 z-[9998] flex justify-center px-4 transition-all duration-500 ${\n        open ? \"translate-y-0 opacity-100\" : \"-translate-y-3 opacity-0\"\n      }`}\n      aria-hidden={!open}\n    >\n      <div className=\"pointer-events-auto flex max-w-[92vw] items-center gap-3 border border-base-content/12 bg-base-100/85 py-2 pl-3 pr-2 text-sm backdrop-blur-md\">\n        <span className=\"font-mono text-[0.65rem] uppercase tracking-[0.16em] text-base-content\">\n          Sala en montaje\n        </span>\n        <span className=\"text-base-content/60\">{message}</span>\n        <IconButton\n          label=\"Cerrar aviso\"\n          variant=\"ghost\"\n          size=\"xs\"\n          onClick={() => setOpen(false)}\n          className=\"ml-1\"\n        >\n          <X className=\"size-3.5\" />\n        </IconButton>\n      </div>\n    </div>\n  );\n};\n"],"mappings":";;;;;;AAWA,MAAa,eAAe,EAC1B,UAAU,6CACV,WAAW,UACW;CACtB,MAAM,CAAC,MAAM,WAAW,SAAS,IAAI;CAErC,gBAAgB;EACd,MAAM,QAAQ,iBAAiB,QAAQ,KAAK,GAAG,QAAQ;EACvD,aAAa,aAAa,KAAK;CACjC,GAAG,CAAC,QAAQ,CAAC;CAEb,OACE,oBAAC,OAAD;EACE,WAAW,2GACT,OAAO,8BAA8B;EAEvC,eAAa,CAAC;EAEd,UAAA,qBAAC,OAAD;GAAK,WAAU;GAAf,UAAA;IACE,oBAAC,QAAD;KAAM,WAAU;KAAyE,UAAA;IAEnF,CAAA;IACN,oBAAC,QAAD;KAAM,WAAU;KAAwB,UAAA;IAAc,CAAA;IACtD,oBAAC,YAAD;KACE,OAAM;KACN,SAAQ;KACR,MAAK;KACL,eAAe,QAAQ,KAAK;KAC5B,WAAU;KAEV,UAAA,oBAAC,GAAD,EAAG,WAAU,WAAY,CAAA;IACf,CAAA;GACT;;CACF,CAAA;AAET"}

package/dist/gallery/SetupNotice/index.cjs

@@ -0,0 +1,2 @@
+const require_SetupNotice = require("./SetupNotice.cjs");
+exports.SetupNotice = require_SetupNotice.SetupNotice;

package/dist/gallery/SetupNotice/index.mjs

@@ -0,0 +1 @@
+export { SetupNotice } from "./SetupNotice.mjs";

package/dist/gallery.cjs

@@ -0,0 +1,10 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_LoadingScreen = require("./gallery/LoadingScreen/LoadingScreen.cjs");
+require("./gallery/LoadingScreen/index.cjs");
+const require_HomeButton = require("./gallery/HomeButton/HomeButton.cjs");
+require("./gallery/HomeButton/index.cjs");
+const require_SetupNotice = require("./gallery/SetupNotice/SetupNotice.cjs");
+require("./gallery/SetupNotice/index.cjs");
+exports.HomeButton = require_HomeButton.HomeButton;
+exports.LoadingScreen = require_LoadingScreen.LoadingScreen;
+exports.SetupNotice = require_SetupNotice.SetupNotice;

package/dist/gallery.d.cts

@@ -0,0 +1,4 @@
+import { LoadingGallery, LoadingScreen, LoadingScreenProps, LoadingState } from "./gallery/LoadingScreen/LoadingScreen.cjs";
+import { HomeButton, HomeButtonProps } from "./gallery/HomeButton/HomeButton.cjs";
+import { SetupNotice, SetupNoticeProps } from "./gallery/SetupNotice/SetupNotice.cjs";
+export { HomeButton, type HomeButtonProps, type LoadingGallery, LoadingScreen, type LoadingScreenProps, type LoadingState, SetupNotice, type SetupNoticeProps };

package/dist/gallery.d.mts

@@ -0,0 +1,4 @@
+import { LoadingGallery, LoadingScreen, LoadingScreenProps, LoadingState } from "./gallery/LoadingScreen/LoadingScreen.mjs";
+import { HomeButton, HomeButtonProps } from "./gallery/HomeButton/HomeButton.mjs";
+import { SetupNotice, SetupNoticeProps } from "./gallery/SetupNotice/SetupNotice.mjs";
+export { HomeButton, type HomeButtonProps, type LoadingGallery, LoadingScreen, type LoadingScreenProps, type LoadingState, SetupNotice, type SetupNoticeProps };

package/dist/gallery.mjs

@@ -0,0 +1,7 @@
+import { LoadingScreen } from "./gallery/LoadingScreen/LoadingScreen.mjs";
+import "./gallery/LoadingScreen/index.mjs";
+import { HomeButton } from "./gallery/HomeButton/HomeButton.mjs";
+import "./gallery/HomeButton/index.mjs";
+import { SetupNotice } from "./gallery/SetupNotice/SetupNotice.mjs";
+import "./gallery/SetupNotice/index.mjs";
+export { HomeButton, LoadingScreen, SetupNotice };

package/dist/index.cjs

@@ -0,0 +1,37 @@
+Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
+const require_badge_classes = require("./components/Badge/badge-classes.cjs");
+const require_Badge = require("./components/Badge/Badge.cjs");
+require("./components/Badge/index.cjs");
+const require_button_classes = require("./components/Button/button-classes.cjs");
+const require_Button = require("./components/Button/Button.cjs");
+const require_ButtonLink = require("./components/Button/ButtonLink.cjs");
+require("./components/Button/index.cjs");
+const require_Eyebrow = require("./components/Eyebrow/Eyebrow.cjs");
+require("./components/Eyebrow/index.cjs");
+const require_icon_button_classes = require("./components/IconButton/icon-button-classes.cjs");
+const require_IconButton = require("./components/IconButton/IconButton.cjs");
+require("./components/IconButton/index.cjs");
+const require_link_classes = require("./components/Link/link-classes.cjs");
+const require_Link = require("./components/Link/Link.cjs");
+require("./components/Link/index.cjs");
+const require_Logo = require("./components/Logo/Logo.cjs");
+require("./components/Logo/index.cjs");
+const require_panel_classes = require("./components/Panel/panel-classes.cjs");
+const require_Panel = require("./components/Panel/Panel.cjs");
+require("./components/Panel/index.cjs");
+const require_ThemeToggle = require("./components/ThemeToggle/ThemeToggle.cjs");
+require("./components/ThemeToggle/index.cjs");
+exports.Badge = require_Badge.Badge;
+exports.Button = require_Button.Button;
+exports.ButtonLink = require_ButtonLink.ButtonLink;
+exports.Eyebrow = require_Eyebrow.Eyebrow;
+exports.IconButton = require_IconButton.IconButton;
+exports.Link = require_Link.Link;
+exports.Logo = require_Logo.Logo;
+exports.Panel = require_Panel.Panel;
+exports.ThemeToggle = require_ThemeToggle.ThemeToggle;
+exports.badgeClasses = require_badge_classes.badgeClasses;
+exports.buttonClasses = require_button_classes.buttonClasses;
+exports.iconButtonClasses = require_icon_button_classes.iconButtonClasses;
+exports.linkClasses = require_link_classes.linkClasses;
+exports.panelClasses = require_panel_classes.panelClasses;

package/dist/index.d.cts

@@ -0,0 +1,21 @@
+import { BadgeTone, badgeClasses } from "./components/Badge/badge-classes.cjs";
+import { Badge, BadgeProps } from "./components/Badge/Badge.cjs";
+import "./components/Badge/index.cjs";
+import { ButtonSize, ButtonVariant, buttonClasses } from "./components/Button/button-classes.cjs";
+import { Button, ButtonProps } from "./components/Button/Button.cjs";
+import { ButtonLink, ButtonLinkProps } from "./components/Button/ButtonLink.cjs";
+import "./components/Button/index.cjs";
+import { Eyebrow, EyebrowProps } from "./components/Eyebrow/Eyebrow.cjs";
+import "./components/Eyebrow/index.cjs";
+import { IconButtonSize, IconButtonVariant, iconButtonClasses } from "./components/IconButton/icon-button-classes.cjs";
+import { IconButton, IconButtonProps } from "./components/IconButton/IconButton.cjs";
+import "./components/IconButton/index.cjs";
+import { LinkTone, linkClasses } from "./components/Link/link-classes.cjs";
+import { Link, LinkComponentProps, LinkProps } from "./components/Link/Link.cjs";
+import "./components/Link/index.cjs";
+import { Logo, LogoProps } from "./components/Logo/Logo.cjs";
+import { PanelPadding, PanelTone, panelClasses } from "./components/Panel/panel-classes.cjs";
+import { Panel, PanelProps } from "./components/Panel/Panel.cjs";
+import "./components/Panel/index.cjs";
+import { ThemeToggle, ThemeToggleProps } from "./components/ThemeToggle/ThemeToggle.cjs";
+export { Badge, type BadgeProps, type BadgeTone, Button, ButtonLink, type ButtonLinkProps, type ButtonProps, type ButtonSize, type ButtonVariant, Eyebrow, type EyebrowProps, IconButton, type IconButtonProps, type IconButtonSize, type IconButtonVariant, Link, type LinkComponentProps, type LinkProps, type LinkTone, Logo, type LogoProps, Panel, type PanelPadding, type PanelProps, type PanelTone, ThemeToggle, type ThemeToggleProps, badgeClasses, buttonClasses, iconButtonClasses, linkClasses, panelClasses };