@bysages/svelte 0.2.2 → 0.2.3

package/dist/form-De-ZwM1P.mjs

@@ -0,0 +1,212 @@
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { Field } from "@ark-ui/svelte/field";
+import { getContext, setContext } from "svelte";
+import { createField, createForm } from "@tanstack/svelte-form";
+//#region src/components/form/context.ts
+const FORM_KEY = Symbol("bysages-form");
+function provideForm(engine) {
+	setContext(FORM_KEY, engine);
+	return engine;
+}
+function useForm() {
+	return getContext(FORM_KEY) ?? null;
+}
+//#endregion
+//#region src/components/form/Form.svelte
+var rest_excludes$1 = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"form",
+	"children"
+]);
+var root$1 = $.from_html(`<form><!></form>`);
+function Form$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("form");
+	let rest = $.rest_props($$props, rest_excludes$1);
+	provideForm($$props.form);
+	var form_1 = root$1();
+	var event_handler = (event) => {
+		event.preventDefault();
+		$$props.form.handleSubmit();
+	};
+	$.attribute_effect(form_1, () => ({
+		...rest,
+		"data-scope": "form",
+		"data-part": "root",
+		novalidate: true,
+		onsubmit: event_handler
+	}));
+	var node = $.child(form_1);
+	$.snippet(node, () => $$props.children ?? $.noop);
+	$.reset(form_1);
+	$.append($$anchor, form_1);
+	$.pop();
+}
+//#endregion
+//#region src/components/form/FormField.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"form",
+	"name",
+	"label",
+	"hint",
+	"required",
+	"invalid",
+	"disabled",
+	"children"
+]);
+var root = $.from_html(`<!> <!> <!> <!>`, 1);
+var root_1 = $.from_html(`<div><!></div>`);
+function FormField$1($$anchor, $$props) {
+	$.push($$props, true);
+	const assemble = ($$anchor, field = $.noop) => {
+		const meta = $.derived(() => field()?.state.meta);
+		const surfaced = $.derived(() => !$.get(meta) ? [] : $.get(meta).isTouched ? $.get(meta).errors ?? [] : [$.get(meta).errorMap?.onSubmit].flat().filter(Boolean));
+		const errors = $.derived(() => $.get(surfaced).map(errorText).filter(Boolean));
+		var div = root_1();
+		$.attribute_effect(div, () => ({
+			...rest,
+			"data-form-field": $$props.name
+		}));
+		var node = $.child(div);
+		{
+			let $0 = $.derived(() => invalid() || $.get(errors).length > 0);
+			$.component(node, () => Field.Root, ($$anchor, ArkField_Root) => {
+				ArkField_Root($$anchor, {
+					get invalid() {
+						return $.get($0);
+					},
+					get required() {
+						return required();
+					},
+					get disabled() {
+						return disabled();
+					},
+					children: ($$anchor, $$slotProps) => {
+						var fragment = root();
+						var node_1 = $.first_child(fragment);
+						var consequent = ($$anchor) => {
+							var fragment_1 = $.comment();
+							var node_2 = $.first_child(fragment_1);
+							$.component(node_2, () => Field.Label, ($$anchor, ArkField_Label) => {
+								ArkField_Label($$anchor, {
+									children: ($$anchor, $$slotProps) => {
+										$.next();
+										var text = $.text();
+										$.template_effect(() => $.set_text(text, $$props.label));
+										$.append($$anchor, text);
+									},
+									$$slots: { default: true }
+								});
+							});
+							$.append($$anchor, fragment_1);
+						};
+						$.if(node_1, ($$render) => {
+							if ($$props.label) $$render(consequent);
+						});
+						var node_3 = $.sibling(node_1, 2);
+						$.snippet(node_3, () => $$props.children ?? $.noop, field);
+						var node_4 = $.sibling(node_3, 2);
+						var consequent_1 = ($$anchor) => {
+							var fragment_3 = $.comment();
+							var node_5 = $.first_child(fragment_3);
+							$.component(node_5, () => Field.HelperText, ($$anchor, ArkField_HelperText) => {
+								ArkField_HelperText($$anchor, {
+									children: ($$anchor, $$slotProps) => {
+										$.next();
+										var text_1 = $.text();
+										$.template_effect(() => $.set_text(text_1, $$props.hint));
+										$.append($$anchor, text_1);
+									},
+									$$slots: { default: true }
+								});
+							});
+							$.append($$anchor, fragment_3);
+						};
+						$.if(node_4, ($$render) => {
+							if ($$props.hint && $.get(errors).length === 0) $$render(consequent_1);
+						});
+						var node_6 = $.sibling(node_4, 2);
+						var consequent_2 = ($$anchor) => {
+							var fragment_5 = $.comment();
+							var node_7 = $.first_child(fragment_5);
+							$.component(node_7, () => Field.ErrorText, ($$anchor, ArkField_ErrorText) => {
+								ArkField_ErrorText($$anchor, {
+									children: ($$anchor, $$slotProps) => {
+										$.next();
+										var text_2 = $.text();
+										$.template_effect(() => $.set_text(text_2, $.get(errors)[0]));
+										$.append($$anchor, text_2);
+									},
+									$$slots: { default: true }
+								});
+							});
+							$.append($$anchor, fragment_5);
+						};
+						$.if(node_6, ($$render) => {
+							if ($.get(errors).length > 0) $$render(consequent_2);
+						});
+						$.append($$anchor, fragment);
+					},
+					$$slots: { default: true }
+				});
+			});
+		}
+		$.reset(div);
+		$.append($$anchor, div);
+	};
+	injectComponentStyle("form");
+	let required = $.prop($$props, "required", 3, false), invalid = $.prop($$props, "invalid", 3, false), disabled = $.prop($$props, "disabled", 3, false), rest = $.rest_props($$props, rest_excludes);
+	const engine = $$props.form ?? useForm();
+	function errorText(error) {
+		if (error == null) return "";
+		if (typeof error === "string") return error;
+		if (typeof error === "object" && "message" in error) return String(error.message);
+		return String(error);
+	}
+	var fragment_7 = $.comment();
+	var node_8 = $.first_child(fragment_7);
+	var consequent_3 = ($$anchor) => {
+		var fragment_8 = $.comment();
+		var node_9 = $.first_child(fragment_8);
+		{
+			const children = ($$anchor, field = $.noop) => {
+				assemble($$anchor, field);
+			};
+			$.component(node_9, () => engine.Field, ($$anchor, engine_Field) => {
+				engine_Field($$anchor, $.spread_props(() => rest, {
+					get name() {
+						return $$props.name;
+					},
+					children,
+					$$slots: { default: true }
+				}));
+			});
+		}
+		$.append($$anchor, fragment_8);
+	};
+	var alternate = ($$anchor) => {
+		assemble($$anchor, () => void 0);
+	};
+	$.if(node_8, ($$render) => {
+		if (engine) $$render(consequent_3);
+		else $$render(alternate, -1);
+	});
+	$.append($$anchor, fragment_7);
+	$.pop();
+}
+//#endregion
+//#region src/components/form/index.ts
+/** The engine owns the values and the validation; these two are the
+* assembly — one grid, one error routing. */
+const Form = Form$1;
+const FormField = FormField$1;
+injectComponentStyle("field");
+//#endregion
+export { createForm as i, FormField as n, createField as r, Form as t };

package/dist/grid-DNgTWYSL.mjs

@@ -0,0 +1,54 @@
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/components/grid/Grid.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"columns",
+	"gap",
+	"minChildWidth",
+	"children"
+]);
+var root = $.from_html(`<div><!></div>`);
+function Grid$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("grid");
+	/** The same named steps of the space ramp the stack uses — one
+	* vocabulary of distance across the layout primitives. */
+	const gapVars = {
+		none: "0",
+		xs: "var(--bs-gap-xs)",
+		sm: "var(--bs-gap-sm)",
+		md: "var(--bs-gap-md)",
+		lg: "var(--bs-gap-lg)",
+		xl: "var(--bs-gap-xl)"
+	};
+	let columns = $.prop($$props, "columns", 3, 12), gap = $.prop($$props, "gap", 3, "md"), rest = $.rest_props($$props, rest_excludes);
+	const gapValue = $.derived(() => gapVars[gap()] ?? gapVars.md);
+	var div = root();
+	$.attribute_effect(div, ($0) => ({
+		...rest,
+		"data-scope": "grid",
+		"data-part": "root",
+		"data-autofill": $$props.minChildWidth != null ? "" : void 0,
+		[$.STYLE]: {
+			"--bs-grid-columns": $0,
+			"--bs-grid-gap": $.get(gapValue),
+			"--bs-grid-min-child-width": $$props.minChildWidth
+		}
+	}), [() => String(columns())]);
+	var node = $.child(div);
+	$.snippet(node, () => $$props.children ?? $.noop);
+	$.reset(div);
+	$.append($$anchor, div);
+	$.pop();
+}
+//#endregion
+//#region src/components/grid/index.ts
+/** An alignment lattice: tracks of equal measure, sized by column count
+* — or, with `minChildWidth`, as many tracks as the container fits. */
+const Grid = Grid$1;
+//#endregion
+export { Grid as t };

package/dist/icon-B6_cYYzO.mjs

@@ -0,0 +1,62 @@
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { getIcon } from "@bysages/icons";
+//#region src/components/icon/Icon.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"size",
+	"label",
+	"name",
+	"children"
+]);
+var root = $.from_svg(`<svg fill="currentColor" aria-hidden="true"></svg>`);
+var root_1 = $.from_html(`<span><!></span>`);
+function Icon$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("icon");
+	let size = $.prop($$props, "size", 3, "inherit"), rest = $.rest_props($$props, rest_excludes);
+	const glyph = $$props.name && $$props.children == null ? getIcon($$props.name) : void 0;
+	if ($$props.name && $$props.children == null && !glyph) console.error(`[icons] unknown icon name "${$$props.name}" — extend packages/icons/icons.config.json and rerun the generator`);
+	var span = root_1();
+	$.attribute_effect(span, () => ({
+		...rest,
+		role: $$props.label != null ? "img" : void 0,
+		"aria-label": $$props.label,
+		"aria-hidden": $$props.label != null ? void 0 : "true",
+		"data-scope": "icon",
+		"data-part": "root",
+		"data-size": size()
+	}));
+	var node = $.child(span);
+	var consequent = ($$anchor) => {
+		var fragment = $.comment();
+		var node_1 = $.first_child(fragment);
+		$.snippet(node_1, () => $$props.children);
+		$.append($$anchor, fragment);
+	};
+	var consequent_1 = ($$anchor) => {
+		var svg = root();
+		$.html(svg, () => glyph.body, true);
+		$.reset(svg);
+		$.template_effect(() => $.set_attribute(svg, "viewBox", `0 0 ${glyph.width ?? 24 ?? ""} ${glyph.height ?? 24 ?? ""}`));
+		$.append($$anchor, svg);
+	};
+	$.if(node, ($$render) => {
+		if ($$props.children) $$render(consequent);
+		else if (glyph) $$render(consequent_1, 1);
+	});
+	$.reset(span);
+	$.append($$anchor, span);
+	$.pop();
+}
+//#endregion
+//#region src/components/icon/index.ts
+/** The inkwell: a standard box that keeps any inline svg at its optical
+* measure and in the text's own ink — the icon carries no pigment and
+* no size of its own. Bring the glyph; it ships no set. */
+const Icon = Icon$1;
+//#endregion
+export { Icon as t };

package/dist/image-1Lgj8xhS.mjs

@@ -0,0 +1,81 @@
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+//#region src/components/image/Image.svelte
+var rest_excludes = /* @__PURE__ */ new Set([
+	"$$slots",
+	"$$events",
+	"$$legacy",
+	"src",
+	"alt",
+	"fit",
+	"loading",
+	"fallback"
+]);
+var root = $.from_svg(`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><rect x="3" y="4" width="18" height="16" rx="1.5"></rect><circle cx="9" cy="10" r="1.5"></circle><path d="m5.5 17.5 4.5-5 3 3.5 2.5-3 3 4.5"></path></svg>`);
+var root_1 = $.from_html(`<div data-scope="image" data-part="fallback"><!></div>`);
+var root_2 = $.from_html(`<figure><img data-scope="image" data-part="img" decoding="async"/> <!></figure>`);
+function Image$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("image");
+	let alt = $.prop($$props, "alt", 3, ""), fit = $.prop($$props, "fit", 3, "cover"), loading = $.prop($$props, "loading", 3, "lazy"), rest = $.rest_props($$props, rest_excludes);
+	let state = $.state("loading");
+	$.user_effect(() => {
+		$$props.src;
+		$.set(state, "loading");
+	});
+	var figure = root_2();
+	$.attribute_effect(figure, () => ({
+		...rest,
+		"data-scope": "image",
+		"data-part": "root",
+		"data-state": $.get(state),
+		"data-fit": fit()
+	}));
+	var img = $.child(figure);
+	var node = $.sibling(img, 2);
+	var consequent_1 = ($$anchor) => {
+		var div = root_1();
+		var node_1 = $.child(div);
+		var consequent = ($$anchor) => {
+			var fragment = $.comment();
+			var node_2 = $.first_child(fragment);
+			$.snippet(node_2, () => $$props.fallback);
+			$.append($$anchor, fragment);
+		};
+		var alternate = ($$anchor) => {
+			var svg = root();
+			$.append($$anchor, svg);
+		};
+		$.if(node_1, ($$render) => {
+			if ($$props.fallback) $$render(consequent);
+			else $$render(alternate, -1);
+		});
+		$.reset(div);
+		$.append($$anchor, div);
+	};
+	$.if(node, ($$render) => {
+		if ($.get(state) === "error") $$render(consequent_1);
+	});
+	$.reset(figure);
+	$.template_effect(() => {
+		$.set_attribute(img, "src", $$props.src);
+		$.set_attribute(img, "alt", alt());
+		$.set_attribute(img, "loading", loading());
+	});
+	$.event("load", img, () => $.set(state, "loaded"));
+	$.event("error", img, () => $.set(state, "error"));
+	$.replay_events(img);
+	$.append($$anchor, figure);
+	$.pop();
+}
+//#endregion
+//#region src/components/image/index.ts
+/** A framed picture: while the source loads, the frame keeps the
+* skeleton's breath; the picture dissolves in when it lands; a broken
+* source leaves the fallback snippet — or the placeholder glyph when
+* the caller has nothing local to say. The frame's size is the
+* consumer's to give. */
+const Image = Image$1;
+//#endregion
+export { Image as t };

package/dist/image-viewer-Dv3_Iyu8.mjs

@@ -0,0 +1,186 @@
+import { t as Button } from "./button-BCcX7lHq.mjs";
+import { t as ButtonGroup } from "./button-group-CVLqPMlR.mjs";
+import { injectComponentStyle } from "@bysages/core";
+import "svelte/internal/disclose-version";
+import * as $ from "svelte/internal/client";
+import { Portal } from "@ark-ui/svelte/portal";
+import { Dialog } from "@ark-ui/svelte/dialog";
+//#region src/components/image-viewer/ImageViewer.svelte
+const tool = ($$anchor, label = $.noop, onclick = $.noop, glyph = $.noop) => {
+	Button($$anchor, {
+		variant: "ghost",
+		square: true,
+		size: "lg",
+		get "aria-label"() {
+			return label();
+		},
+		get onclick() {
+			return onclick();
+		},
+		children: ($$anchor, $$slotProps) => {
+			var svg = root();
+			var node = $.child(svg);
+			$.snippet(node, glyph);
+			$.reset(svg);
+			$.append($$anchor, svg);
+		},
+		$$slots: { default: true }
+	});
+};
+const zoomIn = ($$anchor) => {
+	var fragment_1 = root_1();
+	$.next(3);
+	$.append($$anchor, fragment_1);
+};
+const zoomOut = ($$anchor) => {
+	var fragment_2 = root_2();
+	$.next(2);
+	$.append($$anchor, fragment_2);
+};
+const turnGlyph = ($$anchor) => {
+	var fragment_3 = root_3();
+	$.next();
+	$.append($$anchor, fragment_3);
+};
+const closeGlyph = ($$anchor) => {
+	var fragment_4 = root_4();
+	$.next();
+	$.append($$anchor, fragment_4);
+};
+var root = $.from_svg(`<svg viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true"><!></svg>`);
+var root_1 = $.from_svg(`<circle cx="11" cy="11" r="7"></circle><path d="m16.2 16.2 4.8 4.8"></path><path d="M8 11h6"></path><path d="M11 8v6"></path>`, 1);
+var root_2 = $.from_svg(`<circle cx="11" cy="11" r="7"></circle><path d="m16.2 16.2 4.8 4.8"></path><path d="M8 11h6"></path>`, 1);
+var root_3 = $.from_svg(`<path d="M20.49 12A8.5 8.5 0 1 1 18 6.06"></path><path d="M20.5 3.5v4h-4"></path>`, 1);
+var root_4 = $.from_svg(`<path d="m6 6 12 12"></path><path d="M18 6 6 18"></path>`, 1);
+var root_5 = $.from_html(`<!> <!>`, 1);
+var root_6 = $.from_html(`<!> <!> <!>`, 1);
+var root_7 = $.from_html(`<img data-scope="image-viewer" data-part="viewport"/> <div data-scope="image-viewer" data-part="toolbar"><!></div>`, 1);
+function ImageViewer$1($$anchor, $$props) {
+	$.push($$props, true);
+	injectComponentStyle("image-viewer");
+	const MIN_SCALE = .5;
+	const MAX_SCALE = 3;
+	const SCALE_STEP = .25;
+	let alt = $.prop($$props, "alt", 3, ""), open = $.prop($$props, "open", 15, false), zoomable = $.prop($$props, "zoomable", 3, true);
+	let scale = $.state(1);
+	let rotation = $.state(0);
+	function setOpen(value) {
+		open(value);
+		$$props.onOpenChange?.(value);
+	}
+	$.user_effect(() => {
+		if (open()) {
+			$.set(scale, 1);
+			$.set(rotation, 0);
+		}
+	});
+	function zoom(step) {
+		$.set(scale, Math.min(MAX_SCALE, Math.max(MIN_SCALE, $.get(scale) + step)), true);
+	}
+	function turn() {
+		$.set(rotation, ($.get(rotation) + 90) % 360);
+	}
+	var fragment_5 = $.comment();
+	var node_1 = $.first_child(fragment_5);
+	$.component(node_1, () => Dialog.Root, ($$anchor, ArkDialog_Root) => {
+		ArkDialog_Root($$anchor, {
+			get open() {
+				return open();
+			},
+			onOpenChange: (details) => setOpen(details.open),
+			lazyMount: true,
+			unmountOnExit: true,
+			children: ($$anchor, $$slotProps) => {
+				Portal($$anchor, {
+					children: ($$anchor, $$slotProps) => {
+						var fragment_7 = root_5();
+						var node_2 = $.first_child(fragment_7);
+						$.component(node_2, () => Dialog.Backdrop, ($$anchor, ArkDialog_Backdrop) => {
+							ArkDialog_Backdrop($$anchor, { class: "bs-image-viewer-backdrop" });
+						});
+						var node_3 = $.sibling(node_2, 2);
+						$.component(node_3, () => Dialog.Positioner, ($$anchor, ArkDialog_Positioner) => {
+							ArkDialog_Positioner($$anchor, {
+								class: "bs-image-viewer-positioner",
+								children: ($$anchor, $$slotProps) => {
+									var fragment_8 = $.comment();
+									var node_4 = $.first_child(fragment_8);
+									{
+										let $0 = $.derived(() => alt() || "Image preview");
+										$.component(node_4, () => Dialog.Content, ($$anchor, ArkDialog_Content) => {
+											ArkDialog_Content($$anchor, {
+												class: "bs-image-viewer-content",
+												get "aria-label"() {
+													return $.get($0);
+												},
+												onclick: (event) => {
+													if (event.target === event.currentTarget) setOpen(false);
+												},
+												children: ($$anchor, $$slotProps) => {
+													var fragment_9 = root_7();
+													var img = $.first_child(fragment_9);
+													let styles;
+													var div = $.sibling(img, 2);
+													var node_5 = $.child(div);
+													ButtonGroup(node_5, {
+														children: ($$anchor, $$slotProps) => {
+															var fragment_10 = root_6();
+															var node_6 = $.first_child(fragment_10);
+															var consequent = ($$anchor) => {
+																var fragment_11 = root_5();
+																var node_7 = $.first_child(fragment_11);
+																tool(node_7, () => "Zoom in", () => () => zoom(SCALE_STEP), () => zoomIn);
+																var node_8 = $.sibling(node_7, 2);
+																tool(node_8, () => "Zoom out", () => () => zoom(-.25), () => zoomOut);
+																$.append($$anchor, fragment_11);
+															};
+															$.if(node_6, ($$render) => {
+																if (zoomable()) $$render(consequent);
+															});
+															var node_9 = $.sibling(node_6, 2);
+															tool(node_9, () => "Rotate 90 degrees", () => turn, () => turnGlyph);
+															var node_10 = $.sibling(node_9, 2);
+															tool(node_10, () => "Close", () => () => setOpen(false), () => closeGlyph);
+															$.append($$anchor, fragment_10);
+														},
+														$$slots: { default: true }
+													});
+													$.reset(div);
+													$.template_effect(() => {
+														$.set_attribute(img, "src", $$props.src);
+														$.set_attribute(img, "alt", alt());
+														styles = $.set_style(img, "", styles, { transform: `scale(${$.get(scale)}) rotate(${$.get(rotation)}deg)` });
+													});
+													$.append($$anchor, fragment_9);
+												},
+												$$slots: { default: true }
+											});
+										});
+									}
+									$.append($$anchor, fragment_8);
+								},
+								$$slots: { default: true }
+							});
+						});
+						$.append($$anchor, fragment_7);
+					},
+					$$slots: { default: true }
+				});
+			},
+			$$slots: { default: true }
+		});
+	});
+	$.append($$anchor, fragment_5);
+	$.pop();
+}
+//#endregion
+//#region src/components/image-viewer/index.ts
+/** A lightbox: the picture over a dimmed page, with a small toolbar
+* beneath it. Zoom is the reader's hand (half to three times,
+* clamped), a quarter turn at a time rotates, Escape and the scrim
+* close — the dialog machine carries the modal part. `open` may stay
+* with the caller (`bind:open`); left alone the viewer keeps it to
+* itself. */
+const ImageViewer = ImageViewer$1;
+//#endregion
+export { ImageViewer as t };

package/dist/index--K4P_QKU.d.mts

@@ -0,0 +1,14 @@
+import { HTMLAttributes } from "svelte/elements";
+//#region src/components/separator/props.d.ts
+interface SeparatorProps extends HTMLAttributes<HTMLDivElement> {
+  orientation?: "horizontal" | "vertical";
+  decorative?: boolean;
+}
+//#endregion
+//#region src/components/separator/index.d.ts
+/** The paper-ink hairline as a component: a named rule between sections.
+ * Decorative separators drop the separator role, since the page reads
+ * fine without them. */
+declare const Separator: import("svelte").Component<SeparatorProps, {}, "">;
+//#endregion
+export { SeparatorProps as n, Separator as t };

package/dist/index-8JoOZcM6.d.mts

@@ -0,0 +1,18 @@
+import { Snippet } from "svelte";
+import { HTMLAttributes } from "svelte/elements";
+//#region src/components/container/props.d.ts
+interface ContainerProps extends HTMLAttributes<HTMLDivElement> {
+  size?: "narrow" | "readable" | "wide" | "full";
+  /** Keep the ink off the page edges when the viewport runs narrower
+   * than the measure. */
+  padding?: boolean;
+  children?: Snippet;
+}
+//#endregion
+//#region src/components/container/index.d.ts
+/** The reading frame: content held to a measure and centered on the
+ * page. The sizes name typographic measures, not breakpoints — the page
+ * owns its edges, the container only owns how long a line of ink runs. */
+declare const Container: import("svelte").Component<ContainerProps, {}, "">;
+//#endregion
+export { ContainerProps as n, Container as t };

package/dist/index-B1iBag3L.d.mts

@@ -0,0 +1,15 @@
+import { Snippet } from "svelte";
+import { HTMLAttributes } from "svelte/elements";
+//#region src/components/aspect-ratio/props.d.ts
+interface AspectRatioProps extends HTMLAttributes<HTMLDivElement> {
+  /** A CSS `aspect-ratio` value — "16 / 9", "4 / 3", "1 / 1". */
+  ratio?: string;
+  children?: Snippet;
+}
+//#endregion
+//#region src/components/aspect-ratio/index.d.ts
+/** A frame that keeps its shape: the box holds the given ratio whatever
+ * the width it is dealt, and the child fills the frame it is given. */
+declare const AspectRatio: import("svelte").Component<AspectRatioProps, {}, "">;
+//#endregion
+export { AspectRatioProps as n, AspectRatio as t };

package/dist/index-B2JKtCzc.d.mts

@@ -0,0 +1,25 @@
+import { Snippet } from "svelte";
+import { HTMLAttributes } from "svelte/elements";
+//#region src/components/checkbox-group/props.d.ts
+interface CheckboxOption {
+  label: string;
+  value: string;
+  disabled?: boolean;
+}
+interface CheckboxGroupProps extends HTMLAttributes<HTMLDivElement> {
+  /** Two-way bindable — `bind:value` keeps the bound array mirroring
+   * the group. */
+  value?: string[];
+  options: CheckboxOption[];
+  layout?: "vertical" | "horizontal";
+  invalid?: boolean;
+  disabled?: boolean;
+  children?: Snippet;
+}
+//#endregion
+//#region src/components/checkbox-group/index.d.ts
+/** One question, many answers: a labelled stack (or row) of the
+ * seal-cut checkboxes bound to a single array. */
+declare const CheckboxGroup: import("svelte").Component<CheckboxGroupProps, {}, "value">;
+//#endregion
+export { CheckboxGroupProps as n, CheckboxOption as r, CheckboxGroup as t };