@cascivo/react 0.3.4 → 0.3.8

package/dist/calendar/calendar.module.js

@@ -0,0 +1,17 @@
+"use client";
+
+import './calendar.css';
+var e = {
+	calendar: "_calendar_7pqxh_2",
+	header: "_header_7pqxh_33",
+	monthLabel: "_monthLabel_7pqxh_40",
+	navButton: "_navButton_7pqxh_46",
+	navSpacer: "_navSpacer_7pqxh_69",
+	grid: "_grid_7pqxh_74",
+	weekday: "_weekday_7pqxh_79",
+	cell: "_cell_7pqxh_88",
+	empty: "_empty_7pqxh_99",
+	day: "_day_7pqxh_104"
+};
+//#endregion
+export { e as default };

package/dist/card/card.css

@@ -0,0 +1 @@
+@layer cascivo.component{._card_hb4jd_2{background-color:var(--cascivo-color-surface);border-radius:var(--cascivo-radius-surface);padding:var(--_card-p,0);overflow:hidden}._card_hb4jd_2[data-padding=none]{--_card-p:0}._card_hb4jd_2[data-padding=sm]{--_card-p:var(--cascivo-space-4)}._card_hb4jd_2[data-padding=md]{--_card-p:var(--cascivo-space-6)}._card_hb4jd_2[data-padding=lg]{--_card-p:var(--cascivo-space-8)}._card_hb4jd_2[data-variant=default]{border:1px solid var(--cascivo-color-border)}._card_hb4jd_2[data-variant=outlined]{border:1.5px solid var(--cascivo-color-border-strong)}._card_hb4jd_2[data-variant=elevated]{box-shadow:var(--cascivo-shadow-md);border:none}._header_hb4jd_35{padding:var(--_card-p,var(--cascivo-space-6));gap:var(--cascivo-space-1);flex-direction:column;padding-block-end:0;display:flex}._title_hb4jd_43{font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-lg);font-weight:var(--cascivo-font-semibold);color:var(--cascivo-color-text);line-height:var(--cascivo-leading-tight);margin:0}._content_hb4jd_52{padding:var(--_card-p,var(--cascivo-space-6));color:var(--cascivo-color-text-subtle);font-family:var(--cascivo-font-sans);font-size:var(--cascivo-text-sm);line-height:var(--cascivo-leading-relaxed)}._footer_hb4jd_60{padding:var(--_card-p,var(--cascivo-space-6));align-items:center;gap:var(--cascivo-space-2);padding-block-start:0;display:flex}}

package/dist/card/card.js

@@ -0,0 +1,45 @@
+"use client";
+
+import e from "./card.module.js";
+import { cn as t } from "@cascivo/core";
+import { jsx as n } from "react/jsx-runtime";
+//#region ../components/src/card/card.tsx
+function r({ variant: r = "default", padding: i = "md", className: a, children: o, ...s }) {
+	return /* @__PURE__ */ n("div", {
+		"data-variant": r,
+		"data-padding": i,
+		className: t(e.card, a),
+		...s,
+		children: o
+	});
+}
+function i({ className: r, children: i, ...a }) {
+	return /* @__PURE__ */ n("div", {
+		className: t(e.header, r),
+		...a,
+		children: i
+	});
+}
+function a({ className: r, children: i, ...a }) {
+	return /* @__PURE__ */ n("h3", {
+		className: t(e.title, r),
+		...a,
+		children: i
+	});
+}
+function o({ className: r, children: i, ...a }) {
+	return /* @__PURE__ */ n("div", {
+		className: t(e.content, r),
+		...a,
+		children: i
+	});
+}
+function s({ className: r, children: i, ...a }) {
+	return /* @__PURE__ */ n("div", {
+		className: t(e.footer, r),
+		...a,
+		children: i
+	});
+}
+//#endregion
+export { r as Card, o as CardContent, s as CardFooter, i as CardHeader, a as CardTitle };

package/dist/card/card.module.js

@@ -0,0 +1,12 @@
+"use client";
+
+import './card.css';
+var e = {
+	card: "_card_hb4jd_2",
+	header: "_header_hb4jd_35",
+	title: "_title_hb4jd_43",
+	content: "_content_hb4jd_52",
+	footer: "_footer_hb4jd_60"
+};
+//#endregion
+export { e as default };

package/dist/carousel/carousel.css

@@ -0,0 +1 @@
+@layer cascivo.component{._carousel_1dvrl_2{gap:var(--cascivo-space-3);flex-direction:column;inline-size:100%;display:flex}._viewport_1dvrl_9{align-items:center;display:flex;position:relative}._track_1dvrl_15{scroll-snap-type:x mandatory;scrollbar-width:none;border-radius:var(--cascivo-radius-md);inline-size:100%;display:flex;overflow-x:auto}._track_1dvrl_15::-webkit-scrollbar{display:none}._slide_1dvrl_28{scroll-snap-align:center;scroll-snap-stop:always;flex:0 0 100%;inline-size:100%}._nav_1dvrl_35{z-index:1;block-size:2.25rem;inline-size:2.25rem;color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-full);box-shadow:var(--cascivo-shadow-sm);cursor:pointer;justify-content:center;align-items:center;display:inline-flex;position:absolute}._nav_1dvrl_35:hover:not(:disabled){background-color:var(--cascivo-color-bg-subtle)}._nav_1dvrl_35:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._nav_1dvrl_35:disabled{opacity:.4;cursor:not-allowed}._prev_1dvrl_65{inset-inline-start:var(--cascivo-space-2)}._next_1dvrl_69{inset-inline-end:var(--cascivo-space-2)}._dots_1dvrl_73{justify-content:center;align-items:center;gap:var(--cascivo-space-2);display:flex}._dot_1dvrl_73{border-radius:var(--cascivo-radius-full);background-color:var(--cascivo-color-border-strong);cursor:pointer;block-size:.625rem;inline-size:.625rem;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out);border:none;padding:0}._dot_1dvrl_73[data-active]{background-color:var(--cascivo-color-accent)}._dot_1dvrl_73:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}}@media (prefers-reduced-motion:reduce){._track_1dvrl_15{scroll-behavior:auto}}@media (forced-colors:active){._nav_1dvrl_35:focus-visible,._dot_1dvrl_73:focus-visible{outline-offset:2px;outline:2px solid highlight}._dot_1dvrl_73[data-active]{background-color:highlight}}

package/dist/carousel/carousel.js

@@ -0,0 +1,138 @@
+"use client";
+
+import e from "./carousel.module.js";
+import { cn as t, useControllableSignal as n, useRovingFocus as r, useSignalEffect as i, useSignals as a } from "@cascivo/core";
+import { builtin as o, t as s } from "@cascivo/i18n";
+import { jsx as c, jsxs as l } from "react/jsx-runtime";
+import { useId as u, useRef as d } from "react";
+//#region ../components/src/carousel/carousel.tsx
+function f(e, t) {
+	return t || (e == null ? [] : Array.isArray(e) ? e : [e]);
+}
+function p({ children: p, slides: m, index: h, defaultIndex: g, onIndexChange: _, loop: v = !1, className: y, labels: b }) {
+	a();
+	let x = u(), S = f(p, m), C = S.length, [w, T] = n({
+		value: h,
+		defaultValue: g ?? 0,
+		onChange: _
+	}), E = d(null), D = d([]), O = d(!1), { getItemProps: k, setActiveIndex: A } = r({
+		orientation: "horizontal",
+		loop: v
+	});
+	i(() => {
+		let e = E.current;
+		if (!e) return;
+		let t = () => {
+			if (O.current) return;
+			let t = Math.round(e.scrollLeft / e.clientWidth);
+			t !== w.value && T(t);
+		};
+		return e.addEventListener("scroll", t, { passive: !0 }), () => e.removeEventListener("scroll", t);
+	});
+	let j = (e) => {
+		if (C === 0) return;
+		let t = e;
+		t < 0 && (t = v ? C - 1 : 0), t >= C && (t = v ? 0 : C - 1);
+		let n = E.current;
+		n && typeof n.scrollTo == "function" && (O.current = !0, n.scrollTo({
+			left: t * n.clientWidth,
+			behavior: "smooth"
+		}), window.setTimeout(() => {
+			O.current = !1;
+		}, 400)), T(t), A(t);
+	}, M = b?.region ?? s(o.carousel.region), N = b?.previous ?? s(o.carousel.previous), P = b?.next ?? s(o.carousel.next);
+	return /* @__PURE__ */ l("section", {
+		className: t(e.carousel, y),
+		"aria-roledescription": "carousel",
+		"aria-label": M,
+		children: [/* @__PURE__ */ l("div", {
+			className: e.viewport,
+			children: [
+				/* @__PURE__ */ c("button", {
+					type: "button",
+					className: t(e.nav, e.prev),
+					"aria-label": N,
+					"aria-controls": `${x}-track`,
+					disabled: !v && w.value <= 0,
+					onClick: () => j(w.value - 1),
+					children: /* @__PURE__ */ c("svg", {
+						width: "20",
+						height: "20",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ c("path", {
+							d: "m15 18-6-6 6-6",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeLinecap: "round",
+							strokeLinejoin: "round"
+						})
+					})
+				}),
+				/* @__PURE__ */ c("div", {
+					ref: E,
+					id: `${x}-track`,
+					className: e.track,
+					children: S.map((t, n) => /* @__PURE__ */ c("div", {
+						ref: (e) => {
+							D.current[n] = e;
+						},
+						className: e.slide,
+						role: "group",
+						"aria-roledescription": "slide",
+						"aria-label": s(o.carousel.slide, {
+							n: n + 1,
+							total: C
+						}),
+						"aria-hidden": n !== w.value || void 0,
+						children: t
+					}, n))
+				}),
+				/* @__PURE__ */ c("button", {
+					type: "button",
+					className: t(e.nav, e.next),
+					"aria-label": P,
+					"aria-controls": `${x}-track`,
+					disabled: !v && w.value >= C - 1,
+					onClick: () => j(w.value + 1),
+					children: /* @__PURE__ */ c("svg", {
+						width: "20",
+						height: "20",
+						viewBox: "0 0 24 24",
+						fill: "none",
+						"aria-hidden": "true",
+						children: /* @__PURE__ */ c("path", {
+							d: "m9 18 6-6-6-6",
+							stroke: "currentColor",
+							strokeWidth: "2",
+							strokeLinecap: "round",
+							strokeLinejoin: "round"
+						})
+					})
+				})
+			]
+		}), /* @__PURE__ */ c("div", {
+			className: e.dots,
+			role: "group",
+			"aria-label": M,
+			children: S.map((t, n) => {
+				let r = k(n);
+				return /* @__PURE__ */ c("button", {
+					ref: r.ref,
+					type: "button",
+					className: e.dot,
+					"aria-label": s(o.carousel.goTo, { n: n + 1 }),
+					"aria-current": n === w.value || void 0,
+					"data-active": n === w.value || void 0,
+					tabIndex: r.tabIndex,
+					onKeyDown: r.onKeyDown,
+					onFocus: r.onFocus,
+					onClick: () => j(n)
+				}, n);
+			})
+		})]
+	});
+}
+//#endregion
+export { p as Carousel };

package/dist/carousel/carousel.module.js

@@ -0,0 +1,16 @@
+"use client";
+
+import './carousel.css';
+var e = {
+	carousel: "_carousel_1dvrl_2",
+	viewport: "_viewport_1dvrl_9",
+	track: "_track_1dvrl_15",
+	slide: "_slide_1dvrl_28",
+	nav: "_nav_1dvrl_35",
+	prev: "_prev_1dvrl_65",
+	next: "_next_1dvrl_69",
+	dots: "_dots_1dvrl_73",
+	dot: "_dot_1dvrl_73"
+};
+//#endregion
+export { e as default };

package/dist/chat-bubble/chat-bubble.css

@@ -0,0 +1 @@
+@layer cascivo.component{._bubble_ykkyv_2{align-items:flex-end;gap:.5rem;max-inline-size:75%;display:flex}._bubble_ykkyv_2[data-side=start]{flex-direction:row;align-self:flex-start}._bubble_ykkyv_2[data-side=end]{flex-direction:row-reverse;align-self:flex-end}._avatar_ykkyv_18{flex-shrink:0;align-self:flex-end}._content_ykkyv_23{flex-direction:column;gap:.25rem;display:flex}._bubble_ykkyv_2[data-side=end] ._content_ykkyv_23{align-items:flex-end}._meta_ykkyv_32{color:var(--cascivo-color-text-muted);align-items:baseline;gap:.5rem;font-size:.75rem;display:flex}._name_ykkyv_40{color:var(--cascivo-color-text-subtle);font-weight:600}._time_ykkyv_44{color:var(--cascivo-color-text-muted)}._body_ykkyv_48{border-radius:var(--cascivo-radius-overlay);padding-block:.5rem;padding-inline:.875rem;font-size:.9375rem;line-height:1.5}._bubble_ykkyv_2[data-side=start] ._body_ykkyv_48{background-color:var(--cascivo-color-surface);color:var(--cascivo-color-text);border-end-start-radius:var(--cascivo-radius-indicator)}._bubble_ykkyv_2[data-side=end] ._body_ykkyv_48{background-color:var(--cascivo-color-accent);color:var(--cascivo-color-accent-content);border-end-end-radius:var(--cascivo-radius-indicator)}}

package/dist/chat-bubble/chat-bubble.js

@@ -0,0 +1,33 @@
+"use client";
+
+import e from "./chat-bubble.module.js";
+import { jsx as t, jsxs as n } from "react/jsx-runtime";
+//#region ../components/src/chat-bubble/chat-bubble.tsx
+function r({ children: r, side: i = "start", avatar: a, name: o, time: s, className: c }) {
+	return /* @__PURE__ */ n("div", {
+		className: [e.bubble, c].filter(Boolean).join(" "),
+		"data-side": i,
+		children: [a && /* @__PURE__ */ t("div", {
+			className: e.avatar,
+			"aria-hidden": "true",
+			children: a
+		}), /* @__PURE__ */ n("div", {
+			className: e.content,
+			children: [(o || s) && /* @__PURE__ */ n("div", {
+				className: e.meta,
+				children: [o && /* @__PURE__ */ t("span", {
+					className: e.name,
+					children: o
+				}), s && /* @__PURE__ */ t("time", {
+					className: e.time,
+					children: s
+				})]
+			}), /* @__PURE__ */ t("div", {
+				className: e.body,
+				children: r
+			})]
+		})]
+	});
+}
+//#endregion
+export { r as ChatBubble };

package/dist/chat-bubble/chat-bubble.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+import './chat-bubble.css';
+var e = {
+	bubble: "_bubble_ykkyv_2",
+	avatar: "_avatar_ykkyv_18",
+	content: "_content_ykkyv_23",
+	meta: "_meta_ykkyv_32",
+	name: "_name_ykkyv_40",
+	time: "_time_ykkyv_44",
+	body: "_body_ykkyv_48"
+};
+//#endregion
+export { e as default };

package/dist/checkbox/checkbox.css

@@ -0,0 +1 @@
+@layer cascivo.component{._wrapper_tw120_2{align-items:center;gap:var(--cascivo-space-2);font-family:var(--cascivo-font-sans);cursor:pointer;display:inline-flex}._wrapper_tw120_2[data-disabled]{opacity:.5;cursor:not-allowed}._input_tw120_15{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;border:0;block-size:1px;inline-size:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}._control_tw120_28{--_check-color:transparent;background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border-strong);border-radius:var(--cascivo-radius-indicator);block-size:1.125rem;inline-size:1.125rem;transition:background-color var(--cascivo-duration-150) var(--cascivo-ease-out), border-color var(--cascivo-duration-150) var(--cascivo-ease-out), box-shadow var(--cascivo-duration-150) var(--cascivo-ease-out);flex-shrink:0;display:inline-flex}._control_tw120_28:after{content:"";background-color:var(--_check-color);block-size:100%;inline-size:100%;-webkit-mask:var(--_check-icon,none) no-repeat center / .75rem;mask:var(--_check-icon,none) no-repeat center / .75rem}._input_tw120_15:checked+._control_tw120_28,._input_tw120_15:indeterminate+._control_tw120_28{--_check-color:var(--cascivo-color-text-on-accent);background-color:var(--cascivo-color-accent);border-color:var(--cascivo-color-accent)}._input_tw120_15:checked+._control_tw120_28{--_check-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' d='M3.5 8.5l3 3 6-6'/%3E%3C/svg%3E")}._input_tw120_15:indeterminate+._control_tw120_28{--_check-icon:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='black' stroke-width='2' stroke-linecap='round' d='M4 8h8'/%3E%3C/svg%3E")}._input_tw120_15:focus-visible+._control_tw120_28{box-shadow:var(--cascivo-focus-ring);outline:none}._label_tw120_72{font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text);line-height:var(--cascivo-leading-snug)}}@media (forced-colors:active){._control_tw120_28{background-color:field;border:1px solid buttontext}._input_tw120_15:checked+._control_tw120_28,._input_tw120_15:indeterminate+._control_tw120_28{background-color:highlight;border-color:highlight}._input_tw120_15:focus-visible+._control_tw120_28{outline-offset:2px;outline:2px solid highlight}}

package/dist/checkbox/checkbox.js

@@ -0,0 +1,38 @@
+"use client";
+
+import e from "./checkbox.module.js";
+import { cn as t, useSignal as n, useSignalEffect as r } from "@cascivo/core";
+import { jsx as i, jsxs as a } from "react/jsx-runtime";
+import { useRef as o } from "react";
+//#region ../components/src/checkbox/checkbox.tsx
+function s({ label: s, indeterminate: c = !1, className: l, id: u, disabled: d, ...f }) {
+	let p = o(null), m = n(c);
+	m.value = c, r(() => {
+		p.current && (p.current.indeterminate = m.value);
+	});
+	let h = u ?? (s ? `cascade-checkbox-${s.toLowerCase().replace(/\s+/g, "-")}` : void 0);
+	return /* @__PURE__ */ a("label", {
+		className: t(e.wrapper, l),
+		"data-disabled": d || void 0,
+		children: [
+			/* @__PURE__ */ i("input", {
+				ref: p,
+				id: h,
+				type: "checkbox",
+				className: e.input,
+				disabled: d,
+				...f
+			}),
+			/* @__PURE__ */ i("span", {
+				className: e.control,
+				"aria-hidden": "true"
+			}),
+			s && /* @__PURE__ */ i("span", {
+				className: e.label,
+				children: s
+			})
+		]
+	});
+}
+//#endregion
+export { s as Checkbox };

package/dist/checkbox/checkbox.module.js

@@ -0,0 +1,11 @@
+"use client";
+
+import './checkbox.css';
+var e = {
+	wrapper: "_wrapper_tw120_2",
+	input: "_input_tw120_15",
+	control: "_control_tw120_28",
+	label: "_label_tw120_72"
+};
+//#endregion
+export { e as default };

package/dist/checkbox-card/checkbox-card.css

@@ -0,0 +1 @@
+@layer cascivo.component{._card_102u6_2{gap:var(--cascivo-space-3);padding:var(--cascivo-space-4);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-surface);background:var(--cascivo-color-bg);cursor:pointer;align-items:flex-start;transition:border-color .12s,background-color .12s;display:flex}._card_102u6_2:hover:not([data-disabled]){border-color:var(--cascivo-color-border-strong)}._card_102u6_2:has(input:checked){border-color:var(--cascivo-color-accent);background:color-mix(in oklch, var(--cascivo-color-accent) 4%, var(--cascivo-color-bg))}._card_102u6_2:has(input:focus-visible){box-shadow:var(--cascivo-focus-ring)}._card_102u6_2[data-disabled]{opacity:.5;cursor:not-allowed}._input_102u6_34{clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}._glyph_102u6_43{border:1px solid var(--cascivo-color-border-strong);border-radius:var(--cascivo-radius-indicator);color:#0000;flex:none;place-items:center;block-size:1rem;inline-size:1rem;margin-block-start:2px;transition:all .12s;display:grid}._card_102u6_2:has(input:checked) ._glyph_102u6_43{border-color:var(--cascivo-color-accent);background:var(--cascivo-color-accent);color:var(--cascivo-color-accent-foreground,oklch(100% 0 0))}._check_102u6_62{block-size:.75rem;inline-size:.75rem}._body_102u6_67{gap:var(--cascivo-space-1);flex-direction:column;display:flex}._title_102u6_73{font-size:var(--cascivo-text-sm);font-weight:var(--cascivo-font-medium);color:var(--cascivo-color-text)}._description_102u6_79{font-size:var(--cascivo-text-sm);color:var(--cascivo-color-text-subtle)}}

package/dist/checkbox-card/checkbox-card.js

@@ -0,0 +1,48 @@
+"use client";
+
+import e from "./checkbox-card.module.js";
+import { cn as t } from "@cascivo/core";
+import { jsx as n, jsxs as r } from "react/jsx-runtime";
+//#region ../components/src/checkbox-card/checkbox-card.tsx
+function i({ title: i, description: a, checked: o, defaultChecked: s, disabled: c, onCheckedChange: l, className: u, ...d }) {
+	return /* @__PURE__ */ r("label", {
+		className: t(e.card, u),
+		"data-disabled": c || void 0,
+		children: [
+			/* @__PURE__ */ n("input", {
+				type: "checkbox",
+				className: e.input,
+				disabled: c,
+				...o === void 0 ? { defaultChecked: s } : { checked: o },
+				onChange: (e) => l?.(e.currentTarget.checked),
+				...d
+			}),
+			/* @__PURE__ */ n("span", {
+				className: e.glyph,
+				"aria-hidden": "true",
+				children: /* @__PURE__ */ n("svg", {
+					viewBox: "0 0 12 12",
+					className: e.check,
+					children: /* @__PURE__ */ n("path", {
+						d: "M2.5 6.5 5 9l4.5-5.5",
+						fill: "none",
+						stroke: "currentColor",
+						strokeWidth: "1.5"
+					})
+				})
+			}),
+			/* @__PURE__ */ r("span", {
+				className: e.body,
+				children: [/* @__PURE__ */ n("span", {
+					className: e.title,
+					children: i
+				}), a && /* @__PURE__ */ n("span", {
+					className: e.description,
+					children: a
+				})]
+			})
+		]
+	});
+}
+//#endregion
+export { i as CheckboxCard };

package/dist/checkbox-card/checkbox-card.module.js

@@ -0,0 +1,14 @@
+"use client";
+
+import './checkbox-card.css';
+var e = {
+	card: "_card_102u6_2",
+	input: "_input_102u6_34",
+	glyph: "_glyph_102u6_43",
+	check: "_check_102u6_62",
+	body: "_body_102u6_67",
+	title: "_title_102u6_73",
+	description: "_description_102u6_79"
+};
+//#endregion
+export { e as default };

package/dist/code/code.css

@@ -0,0 +1 @@
+@layer cascivo.component{._code_hxmy6_2{font-family:var(--cascivo-font-mono);color:var(--cascivo-color-text);background-color:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-indicator);padding-block:.0625rem;padding-inline:var(--cascivo-space-1);white-space:nowrap}._code_hxmy6_2[data-size=sm]{font-size:var(--cascivo-text-xs)}._code_hxmy6_2[data-size=md]{font-size:var(--cascivo-text-sm)}}

package/dist/code/code.js

@@ -0,0 +1,16 @@
+"use client";
+
+import e from "./code.module.js";
+import { cn as t } from "@cascivo/core";
+import { jsx as n } from "react/jsx-runtime";
+//#region ../components/src/code/code.tsx
+function r({ size: r = "md", className: i, children: a, ...o }) {
+	return /* @__PURE__ */ n("code", {
+		"data-size": r,
+		className: t(e.code, i),
+		...o,
+		children: a
+	});
+}
+//#endregion
+export { r as Code };

package/dist/code/code.module.js

@@ -0,0 +1,6 @@
+"use client";
+
+import './code.css';
+var e = { code: "_code_hxmy6_2" };
+//#endregion
+export { e as default };

package/dist/code-snippet/code-snippet.css

@@ -0,0 +1 @@
+@layer cascivo.component{._root_4lyzf_2{position:relative}._root_4lyzf_2[data-variant=inline]{align-items:center;gap:var(--cascivo-space-1);display:inline-flex}._inlineCode_4lyzf_12{font-family:var(--cascivo-font-mono);color:var(--cascivo-color-text);background:var(--cascivo-color-bg-subtle);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-control);padding-inline:var(--cascivo-space-1);padding-block:.125em;font-size:.875em}._pre_4lyzf_23{padding:var(--cascivo-space-4);font-family:var(--cascivo-font-mono);font-size:var(--cascivo-text-sm);line-height:var(--cascivo-leading-relaxed);color:var(--cascivo-color-text);background:var(--cascivo-color-bg-subtle);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-surface);margin:0;padding-inline-end:var(--cascivo-space-10);overflow-x:auto}._root_4lyzf_2[data-variant=single] ._pre_4lyzf_23,._root_4lyzf_2[data-variant=multi] ._pre_4lyzf_23{white-space:pre}._code_4lyzf_44{font:inherit;color:inherit}._line_4lyzf_49{gap:var(--cascivo-space-4);display:flex}._lineNumber_4lyzf_54{text-align:end;inline-size:2ch;color:var(--cascivo-color-text-subtle);-webkit-user-select:none;user-select:none;flex:none}._lineText_4lyzf_62{white-space:pre}._copy_4lyzf_66{block-size:1.75rem;inline-size:1.75rem;color:var(--cascivo-color-text-muted);background:var(--cascivo-color-surface);border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-control);cursor:pointer;transition:color var(--cascivo-duration-150) var(--cascivo-ease-out), background-color var(--cascivo-duration-150) var(--cascivo-ease-out);justify-content:center;align-items:center;padding:0;display:flex;position:absolute;inset-block-start:var(--cascivo-space-2);inset-inline-end:var(--cascivo-space-2)}._copy_4lyzf_66:hover{color:var(--cascivo-color-text);background-color:var(--cascivo-color-bg-subtle)}._copy_4lyzf_66:focus-visible{box-shadow:var(--cascivo-focus-ring);outline:none}._copy_4lyzf_66[data-state=copied]{color:var(--cascivo-color-success,var(--cascivo-color-accent))}._root_4lyzf_2[data-variant=inline] ._copy_4lyzf_66{block-size:1.25rem;inline-size:1.25rem;position:static}._icon_4lyzf_106{block-size:1rem;inline-size:1rem}._code_4lyzf_44 [data-tok=comment]{color:var(--cs-comment,var(--cascivo-color-text-muted));font-style:italic}._code_4lyzf_44 [data-tok=string]{color:var(--cs-string,var(--cascivo-color-success))}._code_4lyzf_44 [data-tok=keyword]{color:var(--cs-keyword,var(--cascivo-color-accent))}._code_4lyzf_44 [data-tok=fn]{color:var(--cs-fn,var(--cascivo-color-info))}._code_4lyzf_44 [data-tok=number]{color:var(--cs-number,var(--cascivo-color-warning))}._code_4lyzf_44 [data-tok=variable]{color:var(--cs-variable,var(--cascivo-color-accent-hover))}._code_4lyzf_44 [data-tok=punct]{color:var(--cs-punct,var(--cascivo-color-text-subtle))}._code_4lyzf_44 [data-tok=prompt]{color:var(--cs-prompt,var(--cascivo-color-text-subtle));-webkit-user-select:none;user-select:none}._root_4lyzf_2[data-terminal]{border:1px solid var(--cascivo-color-border);border-radius:var(--cascivo-radius-surface);overflow:hidden}._bar_4lyzf_153{align-items:center;gap:var(--cascivo-space-3);padding-inline:var(--cascivo-space-3);padding-block:var(--cascivo-space-2);background:var(--cascivo-color-surface);border-block-end:1px solid var(--cascivo-color-border);display:flex}._dots_4lyzf_163{gap:.375rem;display:inline-flex}._dot_4lyzf_163{border-radius:var(--cascivo-radius-full);background:var(--cascivo-color-border);block-size:.7rem;inline-size:.7rem}._dot_4lyzf_163:first-child{background:#ff5f57}._dot_4lyzf_163:nth-child(2){background:#febc2e}._dot_4lyzf_163:nth-child(3){background:#28c840}._title_4lyzf_187{font-family:var(--cascivo-font-mono);font-size:var(--cascivo-text-xs);color:var(--cascivo-color-text-muted)}._root_4lyzf_2[data-terminal] ._pre_4lyzf_23{border:none;border-radius:0}._root_4lyzf_2[data-terminal] ._copy_4lyzf_66{background:0 0;border-color:#0000;inset-block-start:.4rem}}

package/dist/code-snippet/code-snippet.js

@@ -0,0 +1,116 @@
+"use client";
+
+import { tokenize as e } from "./highlight.js";
+import t from "./code-snippet.module.js";
+import { cn as n, useClipboard as r, useSignals as i } from "@cascivo/core";
+import { builtin as a, t as o } from "@cascivo/i18n";
+import { jsx as s, jsxs as c } from "react/jsx-runtime";
+//#region ../components/src/code-snippet/code-snippet.tsx
+function l({ code: n, language: r }) {
+	return /* @__PURE__ */ s("code", {
+		className: t.code,
+		children: e(n, r).map((e, t) => e.type === "text" ? /* @__PURE__ */ s("span", { children: e.value }, t) : /* @__PURE__ */ s("span", {
+			"data-tok": e.type,
+			children: e.value
+		}, t))
+	});
+}
+function u({ code: e, variant: u = "single", language: d, terminal: f = !1, title: p, showLineNumbers: m, showCopyButton: h, labels: g, className: _ }) {
+	i();
+	let { copied: v, copy: y } = r(), b = g?.copy ?? o(a.codeSnippet.copy), x = g?.copied ?? o(a.codeSnippet.copied), S = h ?? u !== "inline" ? /* @__PURE__ */ s("button", {
+		type: "button",
+		"aria-label": v.value ? x : b,
+		"data-state": v.value ? "copied" : "idle",
+		className: t.copy,
+		onClick: () => void y(e),
+		children: v.value ? /* @__PURE__ */ s("svg", {
+			"aria-hidden": "true",
+			viewBox: "0 0 16 16",
+			className: t.icon,
+			children: /* @__PURE__ */ s("path", {
+				d: "M13.5 4.5 6 12 2.5 8.5",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.5",
+				strokeLinecap: "round",
+				strokeLinejoin: "round"
+			})
+		}) : /* @__PURE__ */ c("svg", {
+			"aria-hidden": "true",
+			viewBox: "0 0 16 16",
+			className: t.icon,
+			children: [/* @__PURE__ */ s("rect", {
+				x: "5.5",
+				y: "5.5",
+				width: "8",
+				height: "8",
+				rx: "1.5",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.5"
+			}), /* @__PURE__ */ s("path", {
+				d: "M3.5 10.5h-1a1 1 0 0 1-1-1v-7a1 1 0 0 1 1-1h7a1 1 0 0 1 1 1v1",
+				fill: "none",
+				stroke: "currentColor",
+				strokeWidth: "1.5"
+			})]
+		})
+	}) : null;
+	if (u === "inline") return /* @__PURE__ */ c("span", {
+		className: n(t.root, _),
+		"data-variant": "inline",
+		children: [/* @__PURE__ */ s("code", {
+			className: t.inlineCode,
+			children: e
+		}), S]
+	});
+	let C = e.split("\n"), w = u === "multi" && m && !d;
+	return /* @__PURE__ */ c("div", {
+		className: n(t.root, _),
+		"data-variant": u,
+		"data-terminal": f ? "" : void 0,
+		children: [
+			f && /* @__PURE__ */ c("div", {
+				className: t.bar,
+				"aria-hidden": "true",
+				children: [/* @__PURE__ */ c("span", {
+					className: t.dots,
+					children: [
+						/* @__PURE__ */ s("span", { className: t.dot }),
+						/* @__PURE__ */ s("span", { className: t.dot }),
+						/* @__PURE__ */ s("span", { className: t.dot })
+					]
+				}), p && /* @__PURE__ */ s("span", {
+					className: t.title,
+					children: p
+				})]
+			}),
+			/* @__PURE__ */ s("pre", {
+				className: t.pre,
+				children: w ? /* @__PURE__ */ s("code", {
+					className: t.code,
+					children: C.map((e, n) => /* @__PURE__ */ c("span", {
+						className: t.line,
+						children: [/* @__PURE__ */ s("span", {
+							"aria-hidden": "true",
+							className: t.lineNumber,
+							children: n + 1
+						}), /* @__PURE__ */ s("span", {
+							className: t.lineText,
+							children: e
+						})]
+					}, n))
+				}) : d ? /* @__PURE__ */ s(l, {
+					code: e,
+					language: d
+				}) : /* @__PURE__ */ s("code", {
+					className: t.code,
+					children: e
+				})
+			}),
+			S
+		]
+	});
+}
+//#endregion
+export { u as CodeSnippet };

package/dist/code-snippet/code-snippet.module.js

@@ -0,0 +1,20 @@
+"use client";
+
+import './code-snippet.css';
+var e = {
+	root: "_root_4lyzf_2",
+	inlineCode: "_inlineCode_4lyzf_12",
+	pre: "_pre_4lyzf_23",
+	code: "_code_4lyzf_44",
+	line: "_line_4lyzf_49",
+	lineNumber: "_lineNumber_4lyzf_54",
+	lineText: "_lineText_4lyzf_62",
+	copy: "_copy_4lyzf_66",
+	icon: "_icon_4lyzf_106",
+	bar: "_bar_4lyzf_153",
+	dots: "_dots_4lyzf_163",
+	dot: "_dot_4lyzf_163",
+	title: "_title_4lyzf_187"
+};
+//#endregion
+export { e as default };