@swell/swell-ui 0.0.0-stage → 0.1.1

package/dist/chunks/tabs-aWKq1Iaz.js

@@ -0,0 +1,122 @@
+import { n as e, r as t, t as n } from "./define-BlQTa1g4.js";
+import { n as r } from "./element-B4-_7TLZ.js";
+import { n as i, r as a, t as o } from "./tab-BpjFUbFO.js";
+// src/components/core/tabs/tabs.css?inline
+var s = ":host{--_swell-control-font-size:var(--swell-control-font-size);--_swell-tabs-font-weight:var(--swell-tabs-font-weight,var(--swell-font-strong-weight));--_swell-control-height:var(--swell-control-height);--_swell-tabs-indicator-width:var(--swell-tabs-indicator-width,2px);--_swell-tabs-border-radius:var(--swell-tabs-border-radius,var(--swell-border-radius));--_swell-tabs-color-background:var(--swell-tabs-color-background,var(--swell-color-background));--_swell-tabs-shadow:var(--swell-tabs-shadow,0px 1px 3px 0px);--_swell-tabs-color-shadow:var(--swell-tabs-color-shadow,#0000001a)}:host([size=xsmall]){--_swell-control-font-size:var(--swell-control-xsmall-font-size);--_swell-control-height:var(--swell-control-xsmall-height)}:host([size=small]){--_swell-control-font-size:var(--swell-control-small-font-size);--_swell-control-height:var(--swell-control-small-height)}:host([size=large]){--_swell-control-font-size:var(--swell-control-large-font-size);--_swell-control-height:var(--swell-control-large-height)}:host([size=xlarge]){--_swell-control-font-size:var(--swell-control-xlarge-font-size);--_swell-control-height:var(--swell-control-xlarge-height)}:host{gap:calc(var(--_swell-control-font-size) + 2px);flex-direction:column;display:flex}:host .list{display:flex;position:relative}:host :is(.marker,.line,.node){display:none}:host .tab{justify-content:center;align-items:center;gap:calc(var(--_swell-control-font-size) - 6px);min-width:0;font:var(--_swell-tabs-font-weight) var(--_swell-control-font-size) / 1 var(--swell-font-family);letter-spacing:var(--swell-font-tracking);white-space:nowrap;color:var(--swell-color-secondary-foreground);cursor:pointer;transition:color var(--swell-motion-duration-base) var(--swell-motion-easing);background:0 0;border:0;border-radius:2px;margin:0;padding:0;display:inline-flex}:host .tab:focus-visible{outline:var(--swell-focus-width) solid var(--swell-focus-color);outline-offset:var(--swell-focus-offset)}:host .label{text-overflow:ellipsis;overflow:hidden}:host(:state(underline)) .list{gap:calc(var(--_swell-control-font-size) + 10px);border-bottom:var(--swell-border-width) solid var(--swell-color-border)}:host(:state(underline)) .tab{height:var(--_swell-control-height);position:relative}:host(:state(underline)) .tab[aria-selected=true]:after{content:\"\";inset-inline:0;bottom:calc(-1 * var(--swell-border-width));height:var(--_swell-tabs-indicator-width);border-radius:calc(var(--_swell-tabs-indicator-width) / 2);background:var(--swell-color-accent);position:absolute}:host(:state(segmented)) .list{box-sizing:border-box;height:var(--_swell-control-height);border-radius:calc(var(--_swell-tabs-border-radius) + 4px);background:var(--swell-color-secondary-background);grid-auto-columns:minmax(0,1fr);grid-auto-flow:column;padding:4px;display:grid}:host(:state(segmented)) .tab{height:100%;padding-inline:calc(var(--_swell-control-font-size) - 2px);border-radius:var(--_swell-tabs-border-radius);position:relative}:host(:state(segmented)) .marker{box-sizing:border-box;width:calc((100% - 8px) / var(--marker-count));border-radius:var(--_swell-tabs-border-radius);background:var(--_swell-tabs-color-background);box-shadow:var(--_swell-tabs-shadow) var(--_swell-tabs-color-shadow), 0 0 0 var(--swell-border-width) var(--swell-field-color-border);transition:left var(--swell-motion-duration-slow) var(--swell-motion-easing), right var(--swell-motion-duration-slow) var(--swell-motion-easing);display:block;position:absolute;inset-block:4px;inset-inline-start:calc(4px + var(--marker-index) * (100% - 8px) / var(--marker-count))}:host(:state(steps)) .list{align-items:center;gap:calc(var(--_swell-control-font-size) - 4px)}:host(:state(steps)) .tab{gap:calc(var(--_swell-control-font-size) - 6px);min-height:24px;font-size:max(12px, calc(var(--_swell-control-font-size) - 1px))}:host(:state(steps)) .node{box-sizing:border-box;width:calc(var(--_swell-control-font-size) + 10px);height:calc(var(--_swell-control-font-size) + 10px);border:var(--swell-border-strong-width) solid var(--swell-field-color-border);font:var(--swell-font-bold-weight) max(11px, calc(var(--_swell-control-font-size) - 2px)) / 1 var(--swell-font-family);background:var(--swell-color-background);color:var(--swell-color-secondary-foreground);transition:background-color var(--swell-motion-duration-base) var(--swell-motion-easing), border-color var(--swell-motion-duration-base) var(--swell-motion-easing), color var(--swell-motion-duration-base) var(--swell-motion-easing);border-radius:999px;flex:none;place-items:center;display:grid}:host(:state(steps)) .tab[aria-selected=true] .node{border-color:var(--swell-color-accent);color:var(--swell-color-accent);box-shadow:0 0 0 var(--swell-field-ring-width) var(--swell-field-focus-color-ring)}:host(:state(steps)) .tab[data-done] .node{border-color:var(--swell-color-accent);background:var(--swell-color-accent);color:var(--swell-color-background)}:host .done-label{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}:host .node>*{grid-area:1/1}:host .check{width:calc(var(--_swell-control-font-size) - 2px);height:calc(var(--_swell-control-font-size) - 2px);display:none}:host(:state(steps)) .tab[data-done] .check{display:block}:host(:state(steps)) .line{min-width:12px;height:var(--_swell-tabs-indicator-width);border-radius:calc(var(--_swell-tabs-indicator-width) / 2);background:var(--swell-color-border);transition:background-color var(--swell-motion-duration-slow) var(--swell-motion-easing);flex:1;display:block}:host(:state(steps)) .line[data-done]{background:var(--swell-color-accent)}:host(:state(vertical)){gap:calc(var(--_swell-control-font-size) * 2)}:host(:state(vertical)) .list{display:none}:host .tab:is([aria-selected=true],[data-done]){color:var(--swell-color-foreground)}:host .tab[aria-disabled=true]{cursor:not-allowed;opacity:var(--swell-control-disabled-opacity)}:host .tab:not([aria-disabled]):hover{color:var(--swell-color-foreground)}:host(:state(segmented)) .tab:focus-visible{outline-offset:calc(var(--swell-focus-width) * -1)}@media (forced-colors:active){:host(:state(underline)) .tab[aria-selected=true]:after,:host(:state(segmented)) .marker{background:highlight}:host(:state(steps)) .node{border-color:canvastext}:host(:state(segmented)) .tab[aria-selected=true]{forced-color-adjust:none;color:highlighttext;outline-color:highlighttext}:host(:state(segmented)) :is(.marker,.tab){transition:none}}", c = /* @__PURE__ */ t({ SwellTabs: () => l }), l = class extends r {
+	static group = "tabs";
+	static appearance = "tabs";
+	static appearances = ["steps"];
+	static styles = s;
+	static template = "<div class=\"list\" role=\"tablist\"><span class=\"marker\" aria-hidden=\"true\"></span></div><slot></slot>";
+	static observedAttributes = [
+		...r.observedAttributes,
+		"value",
+		"aria-label",
+		"orientation",
+		"level",
+		"done-label"
+	];
+	#e;
+	#t;
+	#n;
+	constructor() {
+		super();
+		let e = this.shadowRoot;
+		this.#e = e.querySelector(".list"), this.#t = e.querySelector("slot"), this.#t.addEventListener("slotchange", () => this.#s()), a.link(this, {
+			refresh: () => this.#s(),
+			choose: (e) => this.#c(e)
+		}), this.#e.addEventListener("click", this.#l), this.#e.addEventListener("keydown", this.#u);
+	}
+	get value() {
+		return this.#a(this.#i())?.value ?? "";
+	}
+	set value(e) {
+		this.#n = String(e), this.#s();
+	}
+	connectedCallback() {
+		e(this, "value"), super.connectedCallback(), this.#s();
+	}
+	update(e) {
+		e === "value" && (this.#n = void 0), e === "orientation" ? this.updateStates() : this.#s();
+	}
+	updateStates() {
+		super.updateStates(), this.#s();
+	}
+	extraStates() {
+		return this.#r ? ["vertical"] : [];
+	}
+	get #r() {
+		return this.getAttribute("orientation") === "vertical" && this.getAttribute("appearance") === "steps";
+	}
+	#i() {
+		return this.#t.assignedElements().filter((e) => e instanceof i && !e.hidden);
+	}
+	#a(e) {
+		let t = this.#n ?? this.getAttribute("value");
+		return e.find((e) => t !== null && e.value === t) ?? e.find((e) => !e.disabled);
+	}
+	#o() {
+		return [...this.#e.querySelectorAll(".tab")];
+	}
+	#s() {
+		let e = this.#i(), t = this.#a(e), n = this.#o();
+		for (; n.length > e.length;) {
+			let e = n.pop(), t = e.previousElementSibling;
+			t?.classList.contains("line") && t.remove(), e.remove();
+		}
+		for (; n.length < e.length;) {
+			if (n.length) {
+				let e = document.createElement("span");
+				e.className = "line", e.setAttribute("aria-hidden", "true"), this.#e.append(e);
+			}
+			let e = document.createElement("button");
+			e.type = "button", e.className = "tab", e.setAttribute("role", "tab"), e.innerHTML = `<span class="node" aria-hidden="true"><span class="number"></span>${o}</span><span class="label"></span><span class="done-label"></span>`, this.#e.append(e), n.push(e);
+		}
+		let r = this.getAttribute("done-label") ?? "", i = t && !t.disabled ? t : e.find((e) => !e.disabled);
+		e.forEach((o, s) => {
+			let c = n[s];
+			c.querySelector(".label").textContent = o.label, c.querySelector(".number").textContent = o.done ? "" : String(s + 1), c.toggleAttribute("data-done", o.done), c.querySelector(".done-label").textContent = o.done ? ` ${r}` : "", c.setAttribute("aria-selected", String(o === t)), c.tabIndex = o === i ? 0 : -1, o.disabled ? c.setAttribute("aria-disabled", "true") : c.removeAttribute("aria-disabled");
+			let l = c.nextElementSibling;
+			l?.classList.contains("line") && l.toggleAttribute("data-done", o.done), "ariaControlsElements" in c && (c.ariaControlsElements = [o]), a.sync(o, {
+				selected: o === t,
+				vertical: this.#r,
+				position: s + 1,
+				last: s === e.length - 1,
+				level: Math.min(Math.max(Number(this.getAttribute("level")) || 2, 1), 6),
+				doneLabel: r
+			});
+		});
+		let s = this.getAttribute("aria-label");
+		s ? this.#e.setAttribute("aria-label", s) : this.#e.removeAttribute("aria-label");
+		let c = this.#e.querySelector(".marker");
+		c.style.setProperty("--marker-index", String(Math.max(t ? e.indexOf(t) : 0, 0))), c.style.setProperty("--marker-count", String(Math.max(e.length, 1)));
+	}
+	#c(e) {
+		if (!e || e === this.#a(this.#i())) return;
+		let t = new CustomEvent("request", {
+			bubbles: !0,
+			cancelable: !0,
+			detail: { value: e.value }
+		});
+		this.dispatchEvent(t) && !e.disabled && (this.#n = e.value, this.#s(), this.dispatchEvent(new Event("change", { bubbles: !0 })));
+	}
+	#l = (e) => {
+		let t = e.target.closest(".tab"), n = this.#i()[this.#o().indexOf(t)];
+		setTimeout(() => {
+			!e.defaultPrevented && this.isConnected && this.#c(n);
+		});
+	};
+	#u = (e) => {
+		if (e.altKey || e.ctrlKey || e.metaKey) return;
+		let t = this.#o(), n = this.#i(), r = t.filter((e, t) => !n[t]?.disabled), i = t.indexOf(e.target), a = getComputedStyle(this).direction === "rtl" ? -1 : 1, o = e.key === "ArrowRight" ? a : e.key === "ArrowLeft" ? -a : 0, s;
+		if (e.key === "Home") s = r[0];
+		else if (e.key === "End") s = r.at(-1);
+		else if (o && i >= 0) for (let e = 1; e <= t.length && !s; e++) {
+			let n = t[((i + o * e) % t.length + t.length) % t.length];
+			n && r.includes(n) && (s = n);
+		}
+		s && (e.preventDefault(), s.focus(), this.matches(":state(steps)") || this.#c(n[t.indexOf(s)]));
+	};
+};
+n("swell-tabs", l);
+export { c as n, l as t };

package/dist/chunks/text-ZWPy-iB3.js

@@ -0,0 +1,26 @@
+import { r as e, t } from "./define-BlQTa1g4.js";
+import { n } from "./element-B4-_7TLZ.js";
+// src/components/core/text/text.css?inline
+var r = ":host{--_swell-text-font-weight:var(--swell-text-font-weight,var(--swell-font-weight));--_swell-text-font-size:var(--swell-text-font-size,var(--swell-font-size));--_swell-text-font-leading:var(--swell-text-font-leading,var(--swell-font-leading));--_swell-text-font-family:var(--swell-text-font-family,var(--swell-font-family));--_swell-text-font-tracking:var(--swell-text-font-tracking,var(--swell-font-tracking));--_swell-text-color-accent:var(--swell-text-color-accent,var(--swell-color-foreground))}:host([type=title]){--_swell-text-font-weight:var(--swell-text-title-font-weight,var(--swell-font-heading-weight));--_swell-text-font-size:var(--swell-text-title-font-size,32px);--_swell-text-font-leading:var(--swell-text-title-font-leading,1.1);--_swell-text-font-family:var(--swell-text-title-font-family,var(--swell-font-heading-family));--_swell-text-font-tracking:var(--swell-text-title-font-tracking,-.025em)}:host([type=heading]){--_swell-text-font-weight:var(--swell-text-heading-font-weight,var(--swell-font-heading-weight));--_swell-text-font-size:var(--swell-text-heading-font-size,20px);--_swell-text-font-leading:var(--swell-text-heading-font-leading,1.4);--_swell-text-font-family:var(--swell-text-heading-font-family,var(--swell-font-heading-family));--_swell-text-font-tracking:var(--swell-text-heading-font-tracking,var(--swell-font-heading-tracking))}:host([type=subheading]){--_swell-text-font-weight:var(--swell-text-subheading-font-weight,var(--swell-font-heading-weight));--_swell-text-font-size:var(--swell-text-subheading-font-size,16px);--_swell-text-font-leading:var(--swell-text-subheading-font-leading,var(--swell-font-leading));--_swell-text-font-family:var(--swell-text-subheading-font-family,var(--swell-font-heading-family));--_swell-text-font-tracking:var(--swell-text-subheading-font-tracking,-.01em)}:host([type=strong]){--_swell-text-font-weight:var(--swell-text-strong-font-weight,var(--swell-font-strong-weight))}:host([type=eyebrow]){--_swell-text-font-weight:var(--swell-text-eyebrow-font-weight,var(--swell-font-bold-weight));--_swell-text-font-size:var(--swell-text-eyebrow-font-size,var(--swell-font-footnote-size));--_swell-text-font-tracking:var(--swell-text-eyebrow-font-tracking,.08em)}:host([type=caption]){--_swell-text-font-size:var(--swell-text-caption-font-size,var(--swell-font-caption-size))}:host([type=footnote]){--_swell-text-font-size:var(--swell-text-footnote-font-size,var(--swell-font-footnote-size))}:host{font:var(--_swell-text-font-weight) var(--_swell-text-font-size) / var(--_swell-text-font-leading) var(--_swell-text-font-family);letter-spacing:var(--_swell-text-font-tracking);text-transform:none;color:var(--_swell-text-color-accent);display:block}:host([type=eyebrow]){text-transform:uppercase}", i = /* @__PURE__ */ e({ SwellText: () => o }), a = {
+	title: 1,
+	heading: 2,
+	subheading: 3
+}, o = class extends n {
+	static group = "text";
+	static styles = r;
+	static observedAttributes = [...n.observedAttributes, "level"];
+	#e = !1;
+	connectedCallback() {
+		this.#t(), super.connectedCallback();
+	}
+	update(e) {
+		(e === "type" || e === "level") && this.#t();
+	}
+	#t() {
+		this.#e && this.getAttribute("role") !== "heading" && (this.#e = !1);
+		let e = this.getAttribute("type") ?? "", t = Number(this.getAttribute("level")), n = Number.isInteger(t) && t >= 1 && t <= 6 ? t : Object.hasOwn(a, e) ? a[e] : void 0;
+		n === void 0 ? this.#e &&= (this.removeAttribute("role"), this.removeAttribute("aria-level"), !1) : (!this.hasAttribute("role") || this.#e) && (this.setAttribute("role", "heading"), this.setAttribute("aria-level", String(n)), this.#e = !0);
+	}
+};
+t("swell-text", o);
+export { i as n, o as t };

package/dist/chunks/text-field-BB_MRt5h.js

@@ -0,0 +1,158 @@
+import { n as e } from "./define-BlQTa1g4.js";
+import { n as t, t as n } from "./description-BHfQ8meK.js";
+import { i as r, t as i } from "./element-B4-_7TLZ.js";
+// src/runtime/text-field.ts
+var a = [
+	"label",
+	"optional",
+	"hint",
+	"error",
+	"invalid",
+	"value",
+	"placeholder"
+], o = [
+	"disabled",
+	"readonly",
+	"required"
+], s = /* @__PURE__ */ new Map(), c = "a[href], button, input, select, textarea, label, [tabindex], [contenteditable]", l = class extends i {
+	static appearance = "field";
+	static template = "<slot name=\"label\"></slot><div part=\"frame\"><slot name=\"control\"></slot></div><slot name=\"hint\"></slot><slot name=\"description\"></slot>";
+	static control = "input";
+	static prefix = "";
+	static passed = [];
+	static own = [];
+	static attributesOf(e, t = []) {
+		return [
+			...i.observedAttributes,
+			...a,
+			...t,
+			...e,
+			...o
+		];
+	}
+	#e;
+	#t;
+	#n;
+	#r;
+	constructor() {
+		super();
+		let e = this.attachShadow({ mode: "open" });
+		e.append(r(this.#i)), e.querySelector("[part=\"frame\"]")?.addEventListener("mousedown", (e) => {
+			if (!this.disabled) {
+				for (let t of e.composedPath()) {
+					if (t === this) break;
+					if (t instanceof Element && t.matches(c)) return;
+				}
+				e.preventDefault(), this.#e?.focus();
+			}
+		}), e.querySelector("slot[name=\"hint\"]")?.addEventListener("slotchange", () => this.#s()), new MutationObserver((e) => {
+			e.some((e) => e.target.slot === "hint") && this.#s();
+		}).observe(this, {
+			attributeFilter: ["hidden"],
+			subtree: !0
+		});
+	}
+	get #i() {
+		return this.definition;
+	}
+	get value() {
+		return this.#e ? this.#e.value : this.#r ?? this.getAttribute("value") ?? "";
+	}
+	set value(e) {
+		this.#e ? this.#e.value = String(e) : this.#r = String(e);
+	}
+	get disabled() {
+		return this.hasAttribute("disabled");
+	}
+	set disabled(e) {
+		this.toggleAttribute("disabled", !!e);
+	}
+	get required() {
+		return this.hasAttribute("required");
+	}
+	set required(e) {
+		this.toggleAttribute("required", !!e);
+	}
+	get readOnly() {
+		return this.hasAttribute("readonly");
+	}
+	set readOnly(e) {
+		this.toggleAttribute("readonly", !!e);
+	}
+	get invalid() {
+		return this.hasAttribute("invalid");
+	}
+	set invalid(e) {
+		this.toggleAttribute("invalid", !!e);
+	}
+	get name() {
+		return this.getAttribute("name") ?? "";
+	}
+	set name(e) {
+		this.setAttribute("name", e);
+	}
+	focus(e) {
+		this.#e?.focus(e);
+	}
+	connectedCallback() {
+		for (let t of [
+			"value",
+			"disabled",
+			"required",
+			"readOnly",
+			"invalid",
+			"name"
+		]) e(this, t);
+		super.connectedCallback();
+	}
+	setUpControl(e) {}
+	syncControl(e, t) {}
+	render() {
+		let { control: e, prefix: t } = this.#i, r = this.querySelector(`.${t}-control`);
+		r && r.value !== r.defaultValue && (this.#r ??= r.value);
+		let i = (s.get(t) ?? 0) + 1;
+		s.set(t, i);
+		let a = `${t}-${i}`;
+		this.#t = document.createElement("label"), this.#t.className = `${t}-label`, this.#t.htmlFor = a, this.#e = document.createElement(e), this.#e.className = `${t}-control`, this.#e.id = a, this.#e.slot = "control", this.setUpControl(this.#e), this.#n = n(t, a), this.#n.hint.slot = "description", this.#n.error.slot = "description";
+		for (let e of [
+			"label",
+			"control",
+			"hint",
+			"error"
+		]) this.querySelector(`:scope > .${t}-${e}`)?.remove();
+		this.prepend(this.#t, this.#e), this.append(this.#n.hint, this.#n.error);
+		for (let e of this.#a()) this.#o(e);
+		this.#r !== void 0 && (this.#e.value = this.#r, this.#r = void 0);
+	}
+	updateStates() {
+		super.updateStates(), this.#t && (this.#t.slot = this.internals.states.has("floating") ? "control" : "label");
+	}
+	update(e) {
+		this.#e && this.#a().includes(e) && this.#o(e);
+	}
+	#a() {
+		return [
+			...a,
+			...this.#i.own,
+			...this.#i.passed,
+			...o
+		];
+	}
+	#o(e) {
+		let t = this.#e, n = this.getAttribute(e);
+		o.includes(e) ? t.toggleAttribute(e, n !== null) : this.#i.passed.includes(e) ? n === null ? t.removeAttribute(e) : t.setAttribute(e, n) : this.#i.own.includes(e) ? this.syncControl(e, t) : e === "value" ? t.defaultValue = n ?? "" : e === "placeholder" ? t.placeholder = n ?? " " : e === "label" || e === "optional" ? this.#c() : this.#s();
+	}
+	#s() {
+		let e = this.#e;
+		if (!e) return;
+		let n = this.querySelector(":scope > [slot=\"hint\"]:not([hidden])") ?? void 0;
+		n && !n.id && (n.id = `${e.id}-hint-content`), t(this, e, this.#n, n);
+	}
+	#c() {
+		let e = this.#t, t = this.getAttribute("label") ?? "", n = this.getAttribute("optional");
+		if (e.textContent = t, e.hidden = !t, !t || !n) return;
+		let r = document.createElement("span");
+		r.className = `${this.#i.prefix}-optional`, r.textContent = ` ${n}`, e.append(r);
+	}
+};
+export { l as t };

package/dist/chunks/textarea-L6_OJ2IN.js

@@ -0,0 +1,18 @@
+import { r as e, t } from "./define-BlQTa1g4.js";
+import { t as n } from "./text-field-BB_MRt5h.js";
+// src/components/core/textarea/textarea.css?inline
+var r = "swell-textarea{--_swell-control-font-size:var(--swell-control-font-size);--_swell-control-height:var(--swell-control-height)}swell-textarea[size=xsmall]{--_swell-control-font-size:var(--swell-control-xsmall-font-size);--_swell-control-height:var(--swell-control-xsmall-height)}swell-textarea[size=small]{--_swell-control-font-size:var(--swell-control-small-font-size);--_swell-control-height:var(--swell-control-small-height)}swell-textarea[size=large]{--_swell-control-font-size:var(--swell-control-large-font-size);--_swell-control-height:var(--swell-control-large-height)}swell-textarea[size=xlarge]{--_swell-control-font-size:var(--swell-control-xlarge-font-size);--_swell-control-height:var(--swell-control-xlarge-height)}swell-textarea{--_swell-textarea-small-text:max(12px, calc(var(--_swell-control-font-size) - 1px));--_swell-textarea-raised:clamp(11px, calc(var(--_swell-control-font-size) - 2px), 13px);--_swell-textarea-raised-line:round(up, calc(var(--_swell-textarea-raised) * 4 / 3), 2px);--_swell-textarea-rise:min(calc(.6 * var(--_swell-control-font-size) + 1.6px), calc(var(--_swell-control-height) / 2 - var(--_swell-textarea-raised-line) / 2 - 2px));--_swell-textarea-top:calc(var(--_swell-control-height) / 2 - var(--_swell-textarea-rise) + var(--_swell-textarea-raised-line) / 2 + 2px);gap:var(--swell-field-gap);display:grid}swell-textarea[hidden]{display:none!important}swell-textarea [hidden]{display:none}swell-textarea .swell-textarea-label{font:var(--swell-field-label-font-weight) var(--_swell-textarea-small-text) / var(--swell-font-leading) var(--swell-field-label-font-family);letter-spacing:var(--swell-field-label-font-tracking);color:var(--swell-field-label-color-foreground)}swell-textarea::part(frame){box-sizing:border-box;border:var(--swell-border-width) solid var(--swell-field-color-border);border-radius:var(--swell-border-radius);transition:border-color var(--swell-motion-duration-fast) var(--swell-motion-easing), box-shadow var(--swell-motion-duration-base) var(--swell-motion-easing);background:0 0;grid-template-columns:minmax(0,1fr);display:grid;overflow:clip}swell-textarea .swell-textarea-control{box-sizing:border-box;width:100%;padding:calc(var(--_swell-control-font-size) - 2px) var(--_swell-control-font-size);font:var(--swell-font-weight) var(--_swell-control-font-size) / var(--swell-font-leading) var(--swell-font-family);letter-spacing:var(--swell-font-tracking);color:var(--swell-field-color-foreground);resize:vertical;background:0 0;border:0;border-radius:0;outline:none;grid-area:1/1;margin:0;display:block}swell-textarea .swell-textarea-control:disabled{cursor:not-allowed}swell-textarea::part(frame):hover{border-color:var(--swell-field-hover-color-border)}swell-textarea .swell-textarea-control::placeholder{color:var(--swell-color-secondary-foreground);opacity:1}swell-textarea:state(outline)::part(frame){background:var(--swell-field-outline-color-background)}swell-textarea:state(filled)::part(frame){border-width:0 0 var(--swell-border-width);border-radius:var(--swell-border-radius) var(--swell-border-radius) 0 0;background:var(--swell-field-color-background)}swell-textarea:state(underline)::part(frame){border-width:0 0 var(--swell-border-width);border-radius:0}swell-textarea:has(.swell-textarea-control:disabled)::part(frame){opacity:var(--swell-control-disabled-opacity)}swell-textarea:state(underline) .swell-textarea-control{padding-inline:0}swell-textarea[invalid]::part(frame){border-color:var(--swell-color-danger);animation:swell-textarea-shake var(--swell-motion-duration-slow) var(--swell-motion-easing)}swell-textarea:has(.swell-textarea-control:focus)::part(frame){border-color:var(--swell-focus-color)}swell-textarea:state(outline)[invalid]::part(frame){box-shadow:0 0 0 var(--swell-field-ring-width) var(--swell-field-invalid-color-ring)}swell-textarea:state(outline):has(.swell-textarea-control:focus)::part(frame){box-shadow:0 0 0 var(--swell-field-ring-width) var(--swell-field-focus-color-ring)}swell-textarea:is(:state(filled),:state(underline)):has(.swell-textarea-control:focus)::part(frame){box-shadow:inset 0 calc(-1 * var(--swell-border-width)) 0 var(--swell-focus-color)}swell-textarea[invalid]:has(.swell-textarea-control:focus)::part(frame){border-color:var(--swell-color-danger)}swell-textarea:state(outline)[invalid]:has(.swell-textarea-control:focus)::part(frame){box-shadow:0 0 0 var(--swell-field-ring-width) var(--swell-field-invalid-color-ring), inset 0 0 0 var(--swell-border-width) var(--swell-color-danger)}swell-textarea:is(:state(filled),:state(underline))[invalid]:has(.swell-textarea-control:focus)::part(frame){box-shadow:inset 0 calc(-1 * var(--swell-border-width)) 0 var(--swell-color-danger)}@keyframes swell-textarea-shake{10%,90%{transform:translate(-1px)}20%,80%{transform:translate(2px)}30%,50%,70%{transform:translate(-5px)}40%,60%{transform:translate(5px)}}swell-textarea .swell-textarea-hint,swell-textarea>[slot=hint],swell-textarea .swell-textarea-error{font:var(--swell-font-weight) var(--_swell-textarea-small-text) / var(--swell-font-leading) var(--swell-font-family);letter-spacing:var(--swell-font-tracking);color:var(--swell-color-secondary-foreground)}swell-textarea .swell-textarea-error:not([hidden]){font-weight:var(--swell-font-strong-weight);color:var(--swell-color-danger);animation:swell-textarea-enter var(--swell-motion-duration-base) var(--swell-motion-easing)}@keyframes swell-textarea-enter{0%{opacity:0;transform:translateY(-6px)}}swell-textarea .swell-textarea-optional{font-weight:var(--swell-font-weight);color:var(--swell-color-secondary-foreground)}swell-textarea:state(floating) .swell-textarea-optional{font-weight:inherit}swell-textarea:state(floating) .swell-textarea-label{z-index:1;contain:inline-size;box-sizing:border-box;max-width:100%;padding-inline:var(--_swell-control-font-size);white-space:nowrap;text-overflow:ellipsis;font-size:var(--_swell-control-font-size);font-weight:var(--swell-font-weight);line-height:round(up, calc(var(--_swell-control-font-size) * 4 / 3), 2px);color:var(--swell-color-secondary-foreground);pointer-events:none;transition:transform var(--swell-motion-duration-base) var(--swell-motion-easing), font-size var(--swell-motion-duration-base) var(--swell-motion-easing), line-height var(--swell-motion-duration-base) var(--swell-motion-easing);grid-area:1/1;align-self:start;margin-block-start:calc(var(--_swell-control-height) / 2 - var(--_swell-textarea-top) - var(--swell-border-width));overflow:hidden;transform:translateY(-50%)}swell-textarea:state(underline):state(floating) .swell-textarea-label{padding-inline:0}swell-textarea:state(floating):has(.swell-textarea-label:not([hidden]))::part(frame){padding-top:var(--_swell-textarea-top)}swell-textarea:is(:state(filled),:state(underline)):state(floating):has(.swell-textarea-label:not([hidden]))::part(frame){padding-top:calc(var(--_swell-textarea-top) + var(--swell-border-width))}swell-textarea:state(floating):has(.swell-textarea-label:not([hidden])) .swell-textarea-control{padding-top:0}swell-textarea:state(floating):has(.swell-textarea-label:not([hidden])) .swell-textarea-control:not(:focus)::placeholder{opacity:0}swell-textarea:state(floating):has(.swell-textarea-control:focus,.swell-textarea-control:not(:placeholder-shown)) .swell-textarea-label{font-size:var(--_swell-textarea-raised);font-weight:var(--swell-font-medium-weight);line-height:var(--_swell-textarea-raised-line);transform:translateY(calc(-50% - var(--_swell-textarea-rise)))}@media (pointer:coarse){swell-textarea .swell-textarea-control{font-size:max(16px, var(--_swell-control-font-size))}}@media (forced-colors:active){swell-textarea::part(frame){box-shadow:none;border-color:fieldtext}swell-textarea:has(.swell-textarea-control:focus)::part(frame){outline:2px solid highlight}}", i = /* @__PURE__ */ e({ SwellTextarea: () => o }), a = [
+	"name",
+	"autocomplete",
+	"minlength",
+	"maxlength",
+	"rows"
+], o = class extends n {
+	static styles = r;
+	static control = "textarea";
+	static prefix = "swell-textarea";
+	static passed = a;
+	static observedAttributes = n.attributesOf(a);
+};
+t("swell-textarea", o);
+export { i as n, o as t };

package/dist/chunks/thumbnail-CLe9AsFg.js

@@ -0,0 +1,21 @@
+import { r as e, t } from "./define-BlQTa1g4.js";
+import { n } from "./element-B4-_7TLZ.js";
+// src/components/core/thumbnail/thumbnail.css?inline
+var r = ":host{--_swell-control-height:var(--swell-control-height);--_swell-thumbnail-font-weight:var(--swell-thumbnail-font-weight,650);--_swell-thumbnail-color-foreground:var(--swell-thumbnail-color-foreground,var(--swell-color-background));--_swell-thumbnail-border-radius:var(--swell-thumbnail-border-radius,var(--swell-border-radius));--_swell-thumbnail-color-background:var(--swell-thumbnail-color-background,var(--swell-color-accent));--_swell-thumbnail-color-border:var(--swell-thumbnail-color-border,#0000)}:host([size=xsmall]){--_swell-control-height:var(--swell-control-xsmall-height)}:host([size=small]){--_swell-control-height:var(--swell-control-small-height)}:host([size=large]){--_swell-control-height:var(--swell-control-large-height)}:host([size=xlarge]){--_swell-control-height:var(--swell-control-xlarge-height)}:host{width:var(--_swell-control-height);height:var(--_swell-control-height);font:var(--_swell-thumbnail-font-weight) calc(var(--_swell-control-height) * .36) / 1 var(--swell-font-family);letter-spacing:var(--swell-font-tracking);text-transform:uppercase;vertical-align:middle;color:var(--_swell-thumbnail-color-foreground);flex:none;display:inline-block;position:relative}:host .box{border-radius:var(--_swell-thumbnail-border-radius);background:var(--_swell-thumbnail-color-background);place-items:center;width:100%;height:100%;display:grid;position:relative;overflow:clip}:host .box:after{content:\"\";border:var(--swell-border-width) solid var(--_swell-thumbnail-color-border);border-radius:inherit;pointer-events:none;position:absolute;inset:0}:host([shape=circle]) .box{border-radius:999px}:host slot:not([name])::slotted(img){object-fit:cover;width:100%;height:100%;display:block}:host slot:not([name])::slotted(svg){width:calc(var(--_swell-control-height) / 2 - 4px);height:calc(var(--_swell-control-height) / 2 - 4px)}:host slot[name=badge]::slotted(*){position:absolute;inset-block-start:calc(var(--_swell-control-height) / -8);inset-inline-end:calc(var(--_swell-control-height) / -8)}@media (forced-colors:active){:host .box:after{border-color:canvastext}}", i = /* @__PURE__ */ e({ SwellThumbnail: () => a }), a = class extends n {
+	static group = "thumbnail";
+	static styles = r;
+	static template = "<div class=\"box\"><slot></slot></div><slot name=\"badge\"></slot>";
+	static observedAttributes = [...n.observedAttributes, "aria-label"];
+	connectedCallback() {
+		this.#e(), super.connectedCallback();
+	}
+	update(e) {
+		e === "aria-label" && this.#e();
+	}
+	#e() {
+		let e = this.hasAttribute("aria-label");
+		e && !this.hasAttribute("role") ? this.setAttribute("role", "img") : !e && this.getAttribute("role") === "img" && this.removeAttribute("role"), !e && !this.hasAttribute("aria-hidden") ? this.setAttribute("aria-hidden", "true") : e && this.getAttribute("aria-hidden") === "true" && this.removeAttribute("aria-hidden");
+	}
+};
+t("swell-thumbnail", a);
+export { i as n, a as t };

package/dist/chunks/toggle-C7-oPgWR.js

@@ -0,0 +1,22 @@
+// src/runtime/focus.ts
+var e = "input:not([type=\"hidden\"]), select, textarea, button, a[href], [tabindex]:not([tabindex=\"-1\"]), swell-select, swell-link, swell-chip, swell-radio";
+function t(t, n) {
+	let r = t.querySelectorAll(`:scope > :not([slot="trigger"]):is(${e}), :scope > :not([slot="trigger"]) :is(${e})`);
+	for (let e of r) if (e.focus(), e.matches(":focus-within")) return;
+	n.hasAttribute("tabindex") || (n.tabIndex = -1, n.addEventListener("blur", () => n.removeAttribute("tabindex"), { once: !0 })), n.focus();
+}
+// src/runtime/toggle.ts
+function n(e) {
+	let t = !1, n = !1;
+	return () => {
+		n || (n = !0, queueMicrotask(() => {
+			n = !1;
+			let r = e.open;
+			r !== t && (t = r, e.dispatchEvent(new ToggleEvent("toggle", {
+				oldState: r ? "closed" : "open",
+				newState: r ? "open" : "closed"
+			})));
+		}));
+	};
+}
+export { t as n, n as t };

package/dist/chunks/ui-HcyMKwzs.js

@@ -0,0 +1,11 @@
+import { t as e } from "./config-C-FYxOaJ.js";
+import { r as t, t as n } from "./define-BlQTa1g4.js";
+// src/components/core/ui/ui.ts
+var r = /* @__PURE__ */ t({ SwellUi: () => i }), i = class extends HTMLElement {
+	connectedCallback() {
+		let t = this.getRootNode();
+		t instanceof ShadowRoot && !t.adoptedStyleSheets.includes(e) && (t.adoptedStyleSheets = [...t.adoptedStyleSheets, e]);
+	}
+};
+n("swell-ui", i);
+export { r as n, i as t };