@mhmo91/schmancy 0.10.14 → 0.10.16

package/dist/{input-D95GjINh.js → input-B-fw6f_r.js}

@@ -1,48 +1,32 @@
-import { a as e } from "./mixins-BV0w2yIE.js";
-import { t } from "./decorate-23nYs4Le.js";
-import { distinctUntilChanged as n, filter as r, fromEvent as i, map as a, takeUntil as o } from "rxjs";
-import { customElement as s, property as c, query as l, state as u } from "lit/decorators.js";
-import { LitElement as d, html as f, nothing as p, unsafeCSS as m } from "lit";
-import { ifDefined as h } from "lit/directives/if-defined.js";
-import { createRef as g, ref as _ } from "lit/directives/ref.js";
-import { when as v } from "lit/directives/when.js";
-var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */\n:host{width:100%;min-width:calc(var(--spacing,.25rem) * 0);box-sizing:border-box;max-width:100%;display:block}.date-input-container{width:100%;min-width:0;width:100%!important;max-width:100%!important}input{appearance:none;border-radius:8px;width:-webkit-fill-available;font-size:16px;transition:box-shadow .3s cubic-bezier(.34,1.56,.64,1),border-color .2s}input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px var(--schmancy-sys-color-secondary-default)}@supports (color:color-mix(in lab, red, red)){input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-secondary-default) 20%, transparent)}}input[aria-invalid=true]{box-shadow:0 0 12px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]{box-shadow:0 0 12px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 15%, transparent)}}input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 25%, transparent)}}@media (prefers-reduced-motion:reduce){input{transition:none}}input[type=number]::-webkit-inner-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]::-webkit-outer-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]{appearance:textfield}input:-webkit-autofill{animation-name:onAutoFillStart;-webkit-box-shadow:0 0 0 30px var(--schmancy-sys-color-surface-highest) inset!important;-webkit-text-fill-color:var(--schmancy-sys-color-surface-on)!important}input:autofill{background-color:var(--schmancy-sys-color-surface-highest)!important;color:var(--schmancy-sys-color-surface-on)!important}input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;width:100%;line-height:inherit;border-radius:8px;min-width:100%;max-width:100%;margin:0;display:block;overflow:hidden;border-radius:8px!important;width:100%!important}input::-webkit-datetime-edit{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit-fields-wrapper{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit{flex:1;width:100%}input::-webkit-datetime-edit-fields-wrapper{flex:1;justify-content:space-between;width:100%}input::-webkit-datetime-edit-text{align-items:center;display:flex}input::-webkit-datetime-edit-day-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-month-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-year-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-hour-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-minute-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-second-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-millisecond-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-meridiem-field{flex-shrink:0;padding:0 2px}input[type=date]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=datetime-local]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=time]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=month]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=week]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}@-moz-document url-prefix(){input[type=date],input[type=datetime-local],input[type=time]{min-height:inherit}}@supports (-webkit-touch-callout:none){input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;border-radius:0;width:-webkit-fill-available!important;width:fill-available!important;padding-left:12px!important;padding-right:12px!important}input::-webkit-datetime-edit{width:100%!important;padding-left:0!important;padding-right:0!important}input::-webkit-datetime-edit-fields-wrapper{width:100%!important;margin:0!important;padding:0!important}}")) {
+import { o as e } from "./mixins-BWb9_e1s.js";
+import { a as t } from "./active-host-BP0zy_Y9.js";
+import { distinctUntilChanged as n, filter as r, fromEvent as i, map as a, takeUntil as o, timer as s } from "rxjs";
+import { customElement as c, property as l, query as u, state as d } from "lit/decorators.js";
+import { LitElement as f, html as p, nothing as m, unsafeCSS as h } from "lit";
+import { ifDefined as g } from "lit/directives/if-defined.js";
+import { createRef as _, ref as v } from "lit/directives/ref.js";
+import { when as y } from "lit/directives/when.js";
+var b, x = class extends e(h("/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */\n:host{width:100%;min-width:calc(var(--spacing,.25rem) * 0);box-sizing:border-box;max-width:100%;display:block}.date-input-container{width:100%;min-width:0;width:100%!important;max-width:100%!important}input{appearance:none;border-radius:8px;width:-webkit-fill-available;font-size:16px;transition:box-shadow .3s cubic-bezier(.34,1.56,.64,1),border-color .2s}input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px var(--schmancy-sys-color-secondary-default)}@supports (color:color-mix(in lab, red, red)){input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-secondary-default) 20%, transparent)}}input[aria-invalid=true]{box-shadow:0 0 12px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]{box-shadow:0 0 12px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 15%, transparent)}}input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 25%, transparent)}}@media (prefers-reduced-motion:reduce){input{transition:none}}input[type=number]::-webkit-inner-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]::-webkit-outer-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]{appearance:textfield}input:-webkit-autofill{animation-name:onAutoFillStart;-webkit-box-shadow:0 0 0 30px var(--schmancy-sys-color-surface-highest) inset!important;-webkit-text-fill-color:var(--schmancy-sys-color-surface-on)!important}input:autofill{background-color:var(--schmancy-sys-color-surface-highest)!important;color:var(--schmancy-sys-color-surface-on)!important}input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;width:100%;line-height:inherit;border-radius:8px;min-width:100%;max-width:100%;margin:0;display:block;overflow:hidden;border-radius:8px!important;width:100%!important}input::-webkit-datetime-edit{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit-fields-wrapper{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit{flex:1;width:100%}input::-webkit-datetime-edit-fields-wrapper{flex:1;justify-content:space-between;width:100%}input::-webkit-datetime-edit-text{align-items:center;display:flex}input::-webkit-datetime-edit-day-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-month-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-year-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-hour-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-minute-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-second-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-millisecond-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-meridiem-field{flex-shrink:0;padding:0 2px}input[type=date]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=datetime-local]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=time]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=month]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=week]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}@-moz-document url-prefix(){input[type=date],input[type=datetime-local],input[type=time]{min-height:inherit}}@supports (-webkit-touch-callout:none){input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;border-radius:0;width:-webkit-fill-available!important;width:fill-available!important;padding-left:12px!important;padding-right:12px!important}input::-webkit-datetime-edit{width:100%!important;padding-left:0!important;padding-right:0!important}input::-webkit-datetime-edit-fields-wrapper{width:100%!important;margin:0!important;padding:0!important}}")) {
 	static {
-		y = this;
+		b = this;
 	}
 	constructor(...e) {
-		super(...e), this.value = "", this.type = "text", this.placeholder = "", this.clickable = !1, this.spellcheck = !1, this.align = "left", this.step = "any", this.autofocus = !1, this.autocomplete = "on", this.tabIndex = 0, this.size = "md", this.validateOn = "touched", this.inputRef = g(), this.isAutofilled = !1, this.touched = !1, this.dirty = !1, this.submitted = !1, this.defaultValue = "";
+		super(...e), this.value = "", this.type = "text", this.placeholder = "", this.clickable = !1, this.spellcheck = !1, this.align = "left", this.step = "any", this.autofocus = !1, this.autocomplete = "on", this.tabIndex = 0, this.size = "md", this.inputRef = _(), this.isAutofilled = !1;
 	}
 	static {
 		this._idCounter = 0;
 	}
 	static {
 		this.shadowRootOptions = {
-			...d.shadowRootOptions,
+			...f.shadowRootOptions,
 			delegatesFocus: !0
 		};
 	}
 	willUpdate(e) {
-		this.id ||= "sch-input-" + y._idCounter++, super.willUpdate(e);
-	}
-	updated(e) {
-		super.updated(e), e.has("value") && (this.value !== this.defaultValue && (this.dirty = !0), this.validateInput()), !this.hasUpdated && e.has("value") && (this.defaultValue = this.value);
+		this.id ||= "sch-input-" + b._idCounter++, super.willUpdate(e);
 	}
 	connectedCallback() {
-		super.connectedCallback(), this.defaultValue = this.value, this.setupFormIntegration(), this.setupExternalLabelAssociation();
-	}
-	setupFormIntegration() {
-		this.form && (this.formResetObserver = new MutationObserver((e) => {
-			for (let t of e) t.type === "attributes" && t.attributeName === "reset" && this.resetToDefault();
-		}), this.formResetObserver.observe(this.form, {
-			attributes: !0,
-			childList: !1,
-			subtree: !1
-		}), i(this.form, "reset").pipe(o(this.disconnecting)).subscribe(() => {
-			this.resetToDefault();
-		}), i(this.form, "submit").pipe(o(this.disconnecting)).subscribe(() => {
-			this.submitted = !0, this.validateInput(!0);
-		}));
+		super.connectedCallback(), this.setupExternalLabelAssociation();
 	}
 	setupExternalLabelAssociation() {
 		if (this.id) {
@@ -56,57 +40,71 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 			document.readyState === "complete" ? e() : i(document, "DOMContentLoaded").pipe(o(this.disconnecting)).subscribe(e);
 		}
 	}
-	disconnectedCallback() {
-		super.disconnectedCallback(), this.formResetObserver && this.formResetObserver.disconnect();
-	}
-	resetToDefault() {
-		this.value = this.defaultValue, this.touched = !1, this.dirty = !1, this.submitted = !1, this.error = !1, this.validationMessage = "", this.dispatchEvent(new CustomEvent("reset", { bubbles: !0 }));
-	}
-	shouldShowValidation(e = !1) {
-		if (e) return !0;
-		switch (this.validateOn) {
-			case "always": return !0;
-			case "touched":
-			default: return this.touched;
-			case "dirty": return this.dirty;
-			case "submitted": return this.submitted;
-		}
+	updated(e) {
+		super.updated?.(e), (e.has("value") || e.has("required") || e.has("type") || e.has("pattern") || e.has("min") || e.has("max") || e.has("minlength") || e.has("maxlength")) && this.checkValidity();
 	}
-	validateInput(e = !1) {
-		if (this.disabled) return;
-		let t = this.shouldShowValidation(e), n = this.inputElement?.validity ?? {
-			badInput: !1,
-			customError: !1,
-			patternMismatch: !1,
-			rangeOverflow: !1,
-			rangeUnderflow: !1,
-			stepMismatch: !1,
-			tooLong: !1,
-			tooShort: !1,
-			typeMismatch: !1,
-			valid: !0,
-			valueMissing: !1
-		}, r = !n.valid && !n.customError;
-		t && r ? (this.error = !0, this.validationMessage = this.inputElement?.validationMessage || "") : n.valid ? (this.error = !1, n.customError || (this.validationMessage = "")) : t || (this.error = !1);
+	_firstMatchingErrorMessage(e) {
+		let t = this.errorMessages;
+		if (t) return e.valueMissing && t.valueMissing ? t.valueMissing : e.typeMismatch && t.typeMismatch ? t.typeMismatch : e.patternMismatch && t.patternMismatch ? t.patternMismatch : e.tooShort && t.tooShort ? t.tooShort : e.tooLong && t.tooLong ? t.tooLong : e.rangeUnderflow && t.rangeUnderflow ? t.rangeUnderflow : e.rangeOverflow && t.rangeOverflow ? t.rangeOverflow : e.stepMismatch && t.stepMismatch ? t.stepMismatch : e.badInput && t.badInput ? t.badInput : void 0;
 	}
 	checkValidity() {
-		let e = this.inputRef.value?.checkValidity() ?? !0, t = super.checkValidity();
-		return e && t;
+		let e = this.inputElement ?? this.inputRef.value, t = e?.validity;
+		if (t && !t.valid) {
+			let n = {
+				valueMissing: t.valueMissing || void 0,
+				typeMismatch: t.typeMismatch || void 0,
+				patternMismatch: t.patternMismatch || void 0,
+				tooShort: t.tooShort || void 0,
+				tooLong: t.tooLong || void 0,
+				rangeUnderflow: t.rangeUnderflow || void 0,
+				rangeOverflow: t.rangeOverflow || void 0,
+				stepMismatch: t.stepMismatch || void 0,
+				badInput: t.badInput || void 0,
+				customError: t.customError || void 0
+			}, r = this._firstMatchingErrorMessage(t);
+			if (this.internals?.setValidity(n, r || e.validationMessage || this.validationMessage || "Invalid value"), this._shouldShowError()) {
+				this.error = !0;
+				let n = r || e.validationMessage;
+				n && (this.validationMessage = n);
+				for (let e of [
+					"value-missing",
+					"type-mismatch",
+					"pattern-mismatch",
+					"too-short",
+					"too-long",
+					"range-underflow",
+					"range-overflow",
+					"step-mismatch",
+					"bad-input"
+				]) this.internals?.states.delete(e);
+				t.valueMissing && this.internals?.states.add("value-missing"), t.typeMismatch && this.internals?.states.add("type-mismatch"), t.patternMismatch && this.internals?.states.add("pattern-mismatch"), t.tooShort && this.internals?.states.add("too-short"), t.tooLong && this.internals?.states.add("too-long"), t.rangeUnderflow && this.internals?.states.add("range-underflow"), t.rangeOverflow && this.internals?.states.add("range-overflow"), t.stepMismatch && this.internals?.states.add("step-mismatch"), t.badInput && this.internals?.states.add("bad-input");
+			}
+			return !1;
+		}
+		let n = super.checkValidity();
+		if (n) for (let e of [
+			"value-missing",
+			"type-mismatch",
+			"pattern-mismatch",
+			"too-short",
+			"too-long",
+			"range-underflow",
+			"range-overflow",
+			"step-mismatch",
+			"bad-input"
+		]) this.internals?.states.delete(e);
+		return n;
 	}
 	reportValidity() {
-		this.touched = !0, this.submitted = !0;
-		let e = this.inputRef.value?.reportValidity() ?? !0;
-		this.validateInput(!0);
-		let t = super.reportValidity();
+		this.markSubmitted();
+		let e = this.inputRef.value?.reportValidity() ?? !0, t = super.reportValidity();
 		return e && t;
 	}
 	setCustomValidity(e) {
-		this.inputRef.value && this.inputRef.value.setCustomValidity(e), super.setCustomValidity(e), this.error = e !== "" && this.shouldShowValidation();
+		this.inputRef.value && this.inputRef.value.setCustomValidity(e), super.setCustomValidity(e);
 	}
 	firstUpdated() {
-		this.autofocus && setTimeout(() => {
-			this.focus();
-		}, 0), this.setupInputEvents(), this.setupFocusBlurEvents(), this.setupAutofillDetection(), this.setupEnterKeyEvents();
+		this.autofocus && s(0).pipe(o(this.disconnecting)).subscribe(() => this.focus()), this.setupInputEvents(), this.setupFocusBlurEvents(), this.setupAutofillDetection(), this.setupEnterKeyEvents();
 	}
 	setupInputEvents() {
 		i(this.inputElement, "input").pipe(a((e) => {
@@ -120,7 +118,7 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 				originalEvent: e
 			};
 		}), o(this.disconnecting)).subscribe((e) => {
-			this.value = e.value, this.dirty = this.value !== this.defaultValue;
+			this.value = e.value;
 			let t = new CustomEvent("input", {
 				detail: { value: e.value },
 				bubbles: !0,
@@ -130,9 +128,9 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 				inputType: { value: e.inputType },
 				data: { value: e.data },
 				isComposing: { value: e.isComposing }
-			}), this.dispatchEvent(t), this.validateInput();
+			}), this.dispatchEvent(t);
 		}), i(this.inputElement, "change").pipe(a((e) => (e.stopPropagation(), e.target.value)), n(), o(this.disconnecting)).subscribe((e) => {
-			this.value = e, this.dirty = this.value !== this.defaultValue, this.emitChange({ value: e }), this.validateInput();
+			this.value = e, this.emitChange({ value: e });
 		});
 	}
 	setupFocusBlurEvents() {
@@ -144,7 +142,7 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 			});
 			Object.defineProperties(t, { relatedTarget: { value: e.relatedTarget } }), this.dispatchEvent(t);
 		}), i(this.inputElement, "blur").pipe(o(this.disconnecting)).subscribe((e) => {
-			this.touched = !0, this.disabled || this.validateInput();
+			this.markTouched();
 			let t = new CustomEvent("blur", {
 				bubbles: e.bubbles,
 				cancelable: e.cancelable,
@@ -156,7 +154,7 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 	setupAutofillDetection() {
 		i(this.inputElement, "animationstart").pipe(r((e) => e.animationName === "onAutoFillStart"), o(this.disconnecting)).subscribe((e) => {
 			let { value: t } = e.target;
-			this.value = t, this.isAutofilled = !0, this.dirty = this.value !== this.defaultValue, this.dispatchEvent(new CustomEvent("autofill", {
+			this.value = t, this.isAutofilled = !0, this.dispatchEvent(new CustomEvent("autofill", {
 				detail: { value: t },
 				bubbles: !0,
 				composed: !0
@@ -168,7 +166,7 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 	setupEnterKeyEvents() {
 		i(this.inputElement, "keydown").pipe(r((e) => e.key === "Enter"), o(this.disconnecting)).subscribe((e) => {
 			let { value: t } = e.target;
-			this.value !== t && (this.value = t, this.dirty = this.value !== this.defaultValue), this.inputElement.blur();
+			this.value !== t && (this.value = t), this.inputElement.blur();
 			let n = new CustomEvent("enter", {
 				detail: { value: this.value },
 				bubbles: !0,
@@ -279,9 +277,9 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 			fontSize: n,
 			lineHeight: e
 		};
-		return f`
+		return p`
 			<div class="w-full min-w-0 ${r ? "date-input-container" : ""}">
-				${v(this.label, () => f`
+				${y(this.label, () => p`
 						<label
 							for=${this.id}
 							class=${this.classMap(a)}
@@ -291,7 +289,7 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 					`)}
 
 				<input
-					${_(this.inputRef)}
+					${v(this.inputRef)}
 					id=${this.id}
 					name=${this.name}
 					class=${this.classMap(i)}
@@ -301,28 +299,29 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 					.autocomplete=${this.autocomplete}
 					.spellcheck=${this.spellcheck}
 					placeholder=${this.placeholder}
-					inputmode=${h(this.inputmode)}
-					pattern=${h(this.pattern)}
+					inputmode=${g(this.inputmode)}
+					pattern=${g(this.pattern)}
 					.step=${this.step ?? ""}
-					minlength=${h(this.minlength)}
-					maxlength=${h(this.maxlength)}
-					min=${h(this.min)}
-					max=${h(this.max)}
-					list=${h(this.list)}
+					minlength=${g(this.minlength)}
+					maxlength=${g(this.maxlength)}
+					min=${g(this.min)}
+					max=${g(this.max)}
+					list=${g(this.list)}
 					?required=${this.required}
 					?disabled=${this.disabled}
 					?readonly=${this.readonly}
 					aria-invalid=${this.error ? "true" : "false"}
 					aria-required=${this.required ? "true" : "false"}
-					aria-labelledby=${this.label ? `label-${this.id}` : p}
-					aria-describedby=${this.hint || this.validationMessage ? `hint-${this.id}` : p}
-					aria-label=${h(this.label ? void 0 : this.placeholder || "Input")}
+					aria-labelledby=${this.label ? `label-${this.id}` : m}
+					aria-describedby=${this.hint || this.validationMessage ? `hint-${this.id}` : m}
+					aria-label=${g(this.label ? void 0 : this.placeholder || "Input")}
 				/>
 
-				${v(this.hint || this.error && this.validationMessage, () => f`
+				${y(this.hint || this.error && this.validationMessage, () => p`
 						<div
 							id="hint-${this.id}"
 							class="mt-1 text-sm ${this.error ? "text-error-default" : "text-surface-onVariant"}"
+							role=${g(this.error ? "alert" : void 0)}
 						>
 							${this.error && this.validationMessage ? this.validationMessage : this.hint}
 						</div>
@@ -331,34 +330,34 @@ var y, b = class extends e(m("/*! tailwindcss v4.2.4 | MIT License | https://tai
 		`;
 	}
 };
-t([c({
+t([l({
 	type: String,
 	reflect: !0
-})], b.prototype, "value", void 0), t([c({ reflect: !0 })], b.prototype, "type", void 0), t([c()], b.prototype, "placeholder", void 0), t([c({
+})], x.prototype, "value", void 0), t([l({ reflect: !0 })], x.prototype, "type", void 0), t([l()], x.prototype, "placeholder", void 0), t([l({
 	type: String,
 	reflect: !0
-})], b.prototype, "pattern", void 0), t([c({
+})], x.prototype, "pattern", void 0), t([l({
 	type: Boolean,
 	reflect: !0
-})], b.prototype, "clickable", void 0), t([c({
+})], x.prototype, "clickable", void 0), t([l({
 	type: Boolean,
 	reflect: !0
-})], b.prototype, "spellcheck", void 0), t([c({
+})], x.prototype, "spellcheck", void 0), t([l({
 	type: String,
 	reflect: !0
-})], b.prototype, "align", void 0), t([c()], b.prototype, "inputmode", void 0), t([c({
+})], x.prototype, "align", void 0), t([l()], x.prototype, "inputmode", void 0), t([l({
 	type: Number,
 	reflect: !0
-})], b.prototype, "minlength", void 0), t([c({ type: Number })], b.prototype, "maxlength", void 0), t([c()], b.prototype, "min", void 0), t([c()], b.prototype, "max", void 0), t([c({ reflect: !0 })], b.prototype, "step", void 0), t([c({ type: Boolean })], b.prototype, "autofocus", void 0), t([c({
+})], x.prototype, "minlength", void 0), t([l({ type: Number })], x.prototype, "maxlength", void 0), t([l()], x.prototype, "min", void 0), t([l()], x.prototype, "max", void 0), t([l({ reflect: !0 })], x.prototype, "step", void 0), t([l({ type: Boolean })], x.prototype, "autofocus", void 0), t([l({
 	type: String,
 	reflect: !0
-})], b.prototype, "autocomplete", void 0), t([c({
+})], x.prototype, "autocomplete", void 0), t([l({
 	type: Number,
 	reflect: !0
-})], b.prototype, "tabIndex", void 0), t([c({
+})], x.prototype, "tabIndex", void 0), t([l({
 	type: String,
 	reflect: !0
-})], b.prototype, "size", void 0), t([c({ type: String })], b.prototype, "validateOn", void 0), t([c({ type: String })], b.prototype, "list", void 0), t([l("input")], b.prototype, "inputElement", void 0), t([u()], b.prototype, "isAutofilled", void 0), t([u()], b.prototype, "touched", void 0), t([u()], b.prototype, "dirty", void 0), t([u()], b.prototype, "submitted", void 0), t([u()], b.prototype, "defaultValue", void 0);
-var x = b = y = t([s("schmancy-input")], b), S = class extends b {};
-S = t([s("sch-input")], S);
-export { x as n, S as t };
+})], x.prototype, "size", void 0), t([l({ type: String })], x.prototype, "list", void 0), t([u("input")], x.prototype, "inputElement", void 0), t([d()], x.prototype, "isAutofilled", void 0);
+var S = x = b = t([c("schmancy-input")], x), C = class extends x {};
+C = t([c("sch-input")], C);
+export { S as n, C as t };

package/dist/input-B-fw6f_r.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"input-B-fw6f_r.js","names":[],"sources":["../src/form/fields/input/input.scss?inline","../src/form/fields/input/input.ts"],"sourcesContent":["  @reference \"tailwindcss\";\n\n:host {\n\t@apply block w-full min-w-0;\n\t/* Ensure no constraints on mobile */\n\tmax-width: 100%;\n\tbox-sizing: border-box;\n}\n\n/* Date input container needs special handling on mobile */\n.date-input-container {\n\t@apply w-full;\n\t/* Explicit width for mobile Safari */\n\twidth: 100% !important;\n\tmax-width: 100% !important;\n\tmin-width: 0;\n}\n\n/* Reset native input styles for consistency */\ninput {\n\t/* Remove all native styling */\n\t@apply appearance-none rounded-[8px];\n\t/* Prevent Safari zoom on focus */\n\tfont-size: 16px;\n\twidth: -webkit-fill-available;\n\t/* Ensure border radius is applied */\n\tborder-radius: 8px;\n\t/* Smooth transitions for luminous focus */\n\ttransition:\n\t\tbox-shadow 300ms cubic-bezier(0.34, 1.56, 0.64, 1),\n\t\tborder-color 200ms ease;\n}\n\n/* Luminous focus glow — light-based depth on focus */\ninput:focus {\n\tbox-shadow:\n\t\t0 0 0 1px var(--schmancy-sys-color-secondary-default),\n\t\t0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-secondary-default) 20%, transparent);\n}\n\n/* Luminous error glow — red glow on error focus */\ninput[aria-invalid=\"true\"] {\n\tbox-shadow: 0 0 12px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 15%, transparent);\n}\ninput[aria-invalid=\"true\"]:focus {\n\tbox-shadow:\n\t\t0 0 0 1px var(--schmancy-sys-color-error-default),\n\t\t0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 25%, transparent);\n}\n\n@media (prefers-reduced-motion: reduce) {\n\tinput { transition: none; }\n}\n\n/* Remove number input spinners */\ninput[type='number']::-webkit-inner-spin-button,\ninput[type='number']::-webkit-outer-spin-button {\n\t-webkit-appearance: none;\n\tappearance: none;\n\t@apply m-0;\n}\n\ninput[type='number'] {\n\t-moz-appearance: textfield;\n\tappearance: textfield;\n}\n\n/* Autofill styling */\n@keyframes onAutoFillStart {\n\tfrom {}\n\tto {}\n}\n\ninput:-webkit-autofill {\n\tanimation-name: onAutoFillStart;\n\t/* Use box-shadow trick to override autofill background */\n\t-webkit-box-shadow: 0 0 0 30px var(--schmancy-sys-color-surface-highest) inset !important;\n\t-webkit-text-fill-color: var(--schmancy-sys-color-surface-on) !important;\n}\n\n/* Simplified autofill for all browsers */\ninput:autofill {\n\tbackground-color: var(--schmancy-sys-color-surface-highest) !important;\n\tcolor: var(--schmancy-sys-color-surface-on) !important;\n}\n\n/* Date and datetime inputs need special handling */\ninput[type=\"date\"],\ninput[type=\"datetime-local\"],\ninput[type=\"time\"],\ninput[type=\"month\"],\ninput[type=\"week\"] {\n\t/* Ensure consistent height and padding */\n\t@apply block w-full rounded-[8px];\n\t/* Reset WebKit styling */\n\t-webkit-appearance: none;\n\tappearance: none;\n\t/* Ensure text doesn't get cut off */\n\tline-height: inherit;\n\t/* Force full width on mobile */\n\twidth: 100% !important;\n\tmin-width: 100%;\n\tmax-width: 100%;\n\t/* Remove any default margins */\n\tmargin: 0;\n\t/* Force border radius */\n\tborder-radius: 8px !important;\n\toverflow: hidden;\n}\n\n/* WebKit date/time edit container - this is what needs centering */\ninput::-webkit-datetime-edit,\ninput::-webkit-datetime-edit-fields-wrapper {\n\t/* Center the date/time fields vertically */\n\tdisplay: flex;\n\talign-items: center;\n\theight: 100%;\n\t/* Ensure full width on mobile */\n\twidth: 100%;\n\tpadding: 0;\n\tmargin: 0;\n}\n\ninput::-webkit-datetime-edit {\n\t/* Ensure the edit container fills available space */\n\tflex: 1;\n\twidth: 100%;\n}\n\ninput::-webkit-datetime-edit-fields-wrapper {\n\t/* Make fields wrapper expand */\n\tflex: 1;\n\twidth: 100%;\n\tjustify-content: space-between;\n}\n\ninput::-webkit-datetime-edit-text {\n\t/* Ensure separators are also centered */\n\tdisplay: flex;\n\talign-items: center;\n}\n\n/* Individual date fields */\ninput::-webkit-datetime-edit-day-field,\ninput::-webkit-datetime-edit-month-field,\ninput::-webkit-datetime-edit-year-field,\ninput::-webkit-datetime-edit-hour-field,\ninput::-webkit-datetime-edit-minute-field,\ninput::-webkit-datetime-edit-second-field,\ninput::-webkit-datetime-edit-millisecond-field,\ninput::-webkit-datetime-edit-meridiem-field {\n\t/* Ensure fields don't shrink */\n\tflex-shrink: 0;\n\tpadding: 0 2px;\n}\n\n/* Safari date input calendar icon */\ninput[type=\"date\"]::-webkit-calendar-picker-indicator,\ninput[type=\"datetime-local\"]::-webkit-calendar-picker-indicator,\ninput[type=\"time\"]::-webkit-calendar-picker-indicator,\ninput[type=\"month\"]::-webkit-calendar-picker-indicator,\ninput[type=\"week\"]::-webkit-calendar-picker-indicator {\n\t/* Make the calendar icon more subtle */\n\topacity: 0.5;\n\tcursor: pointer;\n}\n\n/* Firefox date input styling */\n@-moz-document url-prefix() {\n\tinput[type=\"date\"],\n\tinput[type=\"datetime-local\"],\n\tinput[type=\"time\"] {\n\t\t/* Firefox needs explicit height */\n\t\tmin-height: inherit;\n\t}\n}\n\n/* iOS Safari specific fixes */\n@supports (-webkit-touch-callout: none) {\n\tinput[type=\"date\"],\n\tinput[type=\"datetime-local\"],\n\tinput[type=\"time\"],\n\tinput[type=\"month\"],\n\tinput[type=\"week\"] {\n\t\t/* iOS Safari needs explicit width */\n\t\twidth: -webkit-fill-available !important;\n\t\twidth: fill-available !important;\n\t\t/* Remove default iOS styling */\n\t\t-webkit-appearance: none;\n\t\tappearance: none;\n\t\tborder-radius: 0;\n\t\t/* Remove default padding that causes issues */\n\t\tpadding-left: 12px !important;\n\t\tpadding-right: 12px !important;\n\t}\n\t\n\t/* Target shadow DOM elements on iOS */\n\tinput::-webkit-datetime-edit {\n\t\t/* Force full width */\n\t\twidth: 100% !important;\n\t\tpadding-left: 0 !important;\n\t\tpadding-right: 0 !important;\n\t}\n\t\n\tinput::-webkit-datetime-edit-fields-wrapper {\n\t\t/* Ensure proper spacing on mobile */\n\t\twidth: 100% !important;\n\t\tpadding: 0 !important;\n\t\tmargin: 0 !important;\n\t}\n}\n","import { html, LitElement, nothing, unsafeCSS } from 'lit'\nimport { customElement, property, query, state } from 'lit/decorators.js'\nimport { ifDefined } from 'lit/directives/if-defined.js'\nimport { createRef, ref } from 'lit/directives/ref.js'\nimport { when } from 'lit/directives/when.js'\nimport { distinctUntilChanged, filter, fromEvent, map, takeUntil, timer } from 'rxjs'\n\nimport { SchmancyFormField } from '@mixins/index'\n\n// Import styles\nimport style from './input.scss?inline'\n\n// If you want to be form-associated, define the type on `ElementInternals`.\ndeclare global {\n\tinterface HTMLElementTagNameMap {\n\t\t'schmancy-input': SchmancyInput\n\t\t'sch-input': SchmancyInput\n\t}\n}\n\ntype EventDetails = {\n\tvalue: string\n}\n\n/**\n * Custom events the component may emit:\n * - 'input': on every keystroke\n * - 'change': on native blur/change\n * - 'enter': specifically when user presses Enter\n */\nexport type SchmancyInputInputEvent = CustomEvent<EventDetails>\nexport type SchmancyInputChangeEvent = CustomEvent<EventDetails>\nexport type SchmancyInputEnterEvent = CustomEvent<EventDetails>\n\n/**\n * Size variants for the input - M3 spec aligned.\n * - xxs: Ultra-compact (24dp) - for menu cards, compact UIs\n * - xs: Dense/compact (32dp) - M3 density -3\n * - sm: Default (40dp) - M3 density 0\n * - md: Standard (48dp) - M3 large\n * - lg: Extra large (56dp) - M3 extra large\n */\nexport type InputSize = 'xxs' | 'xs' | 'sm' | 'md' | 'lg'\n\n/**\n * Enhanced version of the SchmancyInput component with improved form integration\n * and compatibility with legacy API.\n *\n * This component uses the native form association API and maintains parity with\n * native input behaviors while providing a stylish, accessible interface.\n *\n * @prop {string} name - Name attribute for form submission (inherited from FormFieldMixin)\n * @prop {string} label - Label text for the form field (inherited from FormFieldMixin)\n * @prop {boolean} required - Whether the field is required (inherited from FormFieldMixin)\n * @prop {boolean} disabled - Whether the field is disabled (inherited from FormFieldMixin)\n * @prop {boolean} readonly - Whether the field is read-only (inherited from FormFieldMixin)\n * @prop {boolean} error - Whether the field is in an error state (inherited from FormFieldMixin)\n * @prop {string} validationMessage - The validation message to display (inherited from FormFieldMixin)\n * @prop {string} hint - Optional hint text to display below the field (inherited from FormFieldMixin)\n */\n@customElement('schmancy-input')\nexport default class SchmancyInput extends SchmancyFormField(unsafeCSS(style)) {\n\t// ----------------------------\n\t//  A) Public properties\n\t// ----------------------------\n\n\t/** Auto-incrementing counter for generating unique IDs */\n\tstatic _idCounter = 0\n\n\t/** Override value to be string only for input element */\n\t@property({ type: String, reflect: true })\n\tpublic override value = ''\n\n\n\t/**\n\t * The type of input. (e.g. 'text', 'password', 'email', etc.)\n\t */\n\t@property({ reflect: true })\n\tpublic type: HTMLInputElement['type'] = 'text'\n\n\n\t@property()\n\tpublic placeholder = ''\n\n\n\t/** Pattern validation attribute. */\n\t@property({ type: String, reflect: true })\n\tpublic pattern?: string\n\n\n\t/** If true, we visually show a pointer cursor even if readOnly. */\n\t@property({ type: Boolean, reflect: true }) public clickable = false\n\n\t/** Whether browser spellcheck is enabled. */\n\t@property({ type: Boolean, reflect: true })\n\tpublic spellcheck = false\n\n\t/**\n\t * Text alignment within the input.\n\t * - 'left' | 'center' | 'right'\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic align: 'left' | 'center' | 'right' = 'left'\n\n\t/** inputmode attribute (affects on-screen keyboards in mobile). */\n\t@property()\n\tpublic inputmode?: 'none' | 'text' | 'decimal' | 'numeric' | 'tel' | 'search' | 'email' | 'url'\n\n\t@property({ type: Number, reflect: true })\n\tpublic minlength?: number\n\n\t@property({ type: Number })\n\tpublic maxlength?: number\n\n\t@property()\n\tpublic min?: string\n\n\t@property()\n\tpublic max?: string\n\n\t@property({ reflect: true })\n\tpublic step?: string = 'any'\n\n\t/** If true, auto-focus this input on first render. */\n\t@property({ type: Boolean })\n\tpublic autofocus = false\n\n\t/** Autocomplete/autofill hints. */\n\t@property({ type: String, reflect: true })\n\tpublic autocomplete: AutoFill = 'on'\n\n\t/**\n\t * tabIndex for focusing by tab key. Typically 0 or -1.\n\t */\n\t@property({ type: Number, reflect: true })\n\tpublic override tabIndex = 0\n\n\n\t/**\n\t * The size of the input.\n\t * - 'xxs': Ultra-compact size (24px) - for menu cards\n\t * - 'xs': Extra small, very compact size (32px)\n\t * - 'sm': Small, compact size (40px)\n\t * - 'md': Medium size (default) (48px)\n\t * - 'lg': Large size (56px)\n\t */\n\t@property({ type: String, reflect: true })\n\tpublic size: InputSize = 'md'\n\n\t/**\n\t * For datalist support\n\t */\n\t@property({ type: String })\n\tpublic list?: string\n\n\n\t// ----------------------------\n\t//  B) Queries & Refs\n\t// ----------------------------\n\t@query('input') private inputElement!: HTMLInputElement\n\tprivate inputRef = createRef<HTMLInputElement>()\n\n\t// ----------------------------\n\t//  C) Internal States\n\t// ----------------------------\n\n\t/**\n\t * For integration with browser's autofill support\n\t */\n\t@state()\n\tprivate isAutofilled = false\n\n\t// `touched`, `dirty`, `submitted`, and `validateOn` come from FormFieldMixin.\n\t// `_defaultValue` (mixin) replaces the old `defaultValue` field.\n\n\t// ----------------------------\n\t//  D) Form-associated logic\n\t// ----------------------------\n\tprotected static shadowRootOptions = {\n\t\t...LitElement.shadowRootOptions,\n\t\tdelegatesFocus: true, // so focus() goes to <input>\n\t}\n\n\t/**\n\t * If user did not provide an ID, auto-generate one so <label for=\"...\">\n\t * and various aria-* attributes can reference it.\n\t */\n\tprotected override willUpdate(changedProps: Map<PropertyKey, unknown>) {\n\t\tif (!this.id) {\n\t\t\tthis.id = `sch-input-${SchmancyInput._idCounter++}`\n\t\t}\n\t\tsuper.willUpdate(changedProps as never)\n\t}\n\n\n\t// `updated()` removed — FormFieldMixin's `willUpdate` recomputes `dirty`,\n\t// triggers `checkValidity()` when `_shouldShowError()` is true, and updates\n\t// `:state(dirty)` automatically.\n\t//\n\t// Default value capture is also handled by the mixin (`firstUpdated` sets\n\t// `_defaultValue` from `value`).\n\n\tconnectedCallback() {\n\t\tsuper.connectedCallback()\n\n\t\t// Form reset and submit are now handled by the mixin via FACE callbacks\n\t\t// (`formResetCallback`) and by `<schmancy-form>`'s submit sweep\n\t\t// (`markSubmitted()`). No manual form listeners needed.\n\t\tthis.setupExternalLabelAssociation()\n\t}\n\n\t/**\n\t * Set up external label association for native HTML label support\n\t */\n\tprivate setupExternalLabelAssociation() {\n\t\tif (this.id) {\n\t\t\tconst setupLabelClickListener = () => {\n\t\t\t\tconst labels = document.querySelectorAll(`label[for=\"${this.id}\"]`)\n\t\t\t\tlabels.forEach(label => {\n\t\t\t\t\t// Use RxJS for label click events\n\t\t\t\t\tfromEvent(label, 'click')\n\t\t\t\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t\t\t\t.subscribe(() => {\n\t\t\t\t\t\t\tthis.focus()\n\t\t\t\t\t\t})\n\t\t\t\t})\n\t\t\t}\n\n\t\t\t// Initialize after DOM is ready\n\t\t\tif (document.readyState === 'complete') {\n\t\t\t\tsetupLabelClickListener()\n\t\t\t} else {\n\t\t\t\t// Use RxJS for DOMContentLoaded event\n\t\t\t\tfromEvent(document, 'DOMContentLoaded')\n\t\t\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t\t\t.subscribe(setupLabelClickListener)\n\t\t\t}\n\t\t}\n\t}\n\n\t// `disconnectedCallback`, `resetToDefault`, `shouldShowValidation`, and\n\t// `validateInput` are gone — the mixin's `willUpdate` runs `checkValidity()`\n\t// at the right moments (Phase 2/3/4 of the validation contract) and\n\t// `formResetCallback` → `resetForm()` handles reset.\n\n\t/**\n\t * Check validity. Folds in the inner native input's structured\n\t * `ValidityState` flags (`typeMismatch`, `patternMismatch`, `tooShort`,\n\t * `tooLong`, `rangeUnderflow`, `rangeOverflow`, `stepMismatch`, `badInput`)\n\t * via `internals.setValidity` so consumers can target specific flags via\n\t * `field.validity.<flag>` and `:state(value-missing|type-mismatch|…)`.\n\t *\n\t * The visual `error` flag is still gated by the mixin's `_shouldShowError()`.\n\t */\n\t/**\n\t * Re-run checkValidity AFTER render so the native inner input's `.value`\n\t * binding has propagated. The mixin's willUpdate fires checkValidity too\n\t * early — at that point native.validity still reflects the previous value.\n\t */\n\tprotected override updated(changedProps: Map<PropertyKey, unknown>) {\n\t\tsuper.updated?.(changedProps)\n\t\tif (\n\t\t\tchangedProps.has('value') ||\n\t\t\tchangedProps.has('required') ||\n\t\t\tchangedProps.has('type') ||\n\t\t\tchangedProps.has('pattern') ||\n\t\t\tchangedProps.has('min') ||\n\t\t\tchangedProps.has('max') ||\n\t\t\tchangedProps.has('minlength') ||\n\t\t\tchangedProps.has('maxlength')\n\t\t) {\n\t\t\tthis.checkValidity()\n\t\t}\n\t}\n\n\t/**\n\t * Pick the first matching `errorMessages` override for the failing flags.\n\t * Order matches the natural priority of validity flags (valueMissing\n\t * before more specific ones — empty trumps malformed).\n\t */\n\tprivate _firstMatchingErrorMessage(v: ValidityState): string | undefined {\n\t\tconst m = this.errorMessages\n\t\tif (!m) return undefined\n\t\tif (v.valueMissing && m.valueMissing) return m.valueMissing\n\t\tif (v.typeMismatch && m.typeMismatch) return m.typeMismatch\n\t\tif (v.patternMismatch && m.patternMismatch) return m.patternMismatch\n\t\tif (v.tooShort && m.tooShort) return m.tooShort\n\t\tif (v.tooLong && m.tooLong) return m.tooLong\n\t\tif (v.rangeUnderflow && m.rangeUnderflow) return m.rangeUnderflow\n\t\tif (v.rangeOverflow && m.rangeOverflow) return m.rangeOverflow\n\t\tif (v.stepMismatch && m.stepMismatch) return m.stepMismatch\n\t\tif (v.badInput && m.badInput) return m.badInput\n\t\treturn undefined\n\t}\n\n\tpublic override checkValidity() {\n\t\t// Prefer @query (always live) over @ref (may lag during initial paint).\n\t\tconst native = this.inputElement ?? this.inputRef.value\n\t\tconst v = native?.validity\n\t\tif (v && !v.valid) {\n\t\t\t// Surface the native flags. valueMissing also surfaces here when\n\t\t\t// `required` + empty — overrides the mixin's coarse check.\n\t\t\tconst flags: ValidityStateFlags = {\n\t\t\t\tvalueMissing: v.valueMissing || undefined,\n\t\t\t\ttypeMismatch: v.typeMismatch || undefined,\n\t\t\t\tpatternMismatch: v.patternMismatch || undefined,\n\t\t\t\ttooShort: v.tooShort || undefined,\n\t\t\t\ttooLong: v.tooLong || undefined,\n\t\t\t\trangeUnderflow: v.rangeUnderflow || undefined,\n\t\t\t\trangeOverflow: v.rangeOverflow || undefined,\n\t\t\t\tstepMismatch: v.stepMismatch || undefined,\n\t\t\t\tbadInput: v.badInput || undefined,\n\t\t\t\tcustomError: v.customError || undefined,\n\t\t\t}\n\t\t\t// errorMessages override: pick the first matching flag and use the\n\t\t\t// consumer-provided copy. Falls back to the native browser message.\n\t\t\tconst overrideMessage = this._firstMatchingErrorMessage(v)\n\t\t\tthis.internals?.setValidity(\n\t\t\t\tflags,\n\t\t\t\toverrideMessage || native.validationMessage || this.validationMessage || 'Invalid value',\n\t\t\t)\n\t\t\tif (this._shouldShowError()) {\n\t\t\t\tthis.error = true\n\t\t\t\t// Always reflect the current flag's message — previous\n\t\t\t\t// validationMessage may be stale (different flag).\n\t\t\t\tconst newMessage = overrideMessage || native.validationMessage\n\t\t\t\tif (newMessage) this.validationMessage = newMessage\n\t\t\t\t// Mirror flags into :state() so CSS can target specifics.\n\t\t\t\tfor (const flag of [\n\t\t\t\t\t'value-missing',\n\t\t\t\t\t'type-mismatch',\n\t\t\t\t\t'pattern-mismatch',\n\t\t\t\t\t'too-short',\n\t\t\t\t\t'too-long',\n\t\t\t\t\t'range-underflow',\n\t\t\t\t\t'range-overflow',\n\t\t\t\t\t'step-mismatch',\n\t\t\t\t\t'bad-input',\n\t\t\t\t]) {\n\t\t\t\t\tthis.internals?.states.delete(flag)\n\t\t\t\t}\n\t\t\t\tif (v.valueMissing) this.internals?.states.add('value-missing')\n\t\t\t\tif (v.typeMismatch) this.internals?.states.add('type-mismatch')\n\t\t\t\tif (v.patternMismatch) this.internals?.states.add('pattern-mismatch')\n\t\t\t\tif (v.tooShort) this.internals?.states.add('too-short')\n\t\t\t\tif (v.tooLong) this.internals?.states.add('too-long')\n\t\t\t\tif (v.rangeUnderflow) this.internals?.states.add('range-underflow')\n\t\t\t\tif (v.rangeOverflow) this.internals?.states.add('range-overflow')\n\t\t\t\tif (v.stepMismatch) this.internals?.states.add('step-mismatch')\n\t\t\t\tif (v.badInput) this.internals?.states.add('bad-input')\n\t\t\t}\n\t\t\treturn false\n\t\t}\n\n\t\t// Native says valid — but the mixin's `required` check might still\n\t\t// fire (mixin checks `value === ''` directly, native may treat empty\n\t\t// differently for type=email/url with no value).\n\t\tconst parentValid = super.checkValidity()\n\t\tif (parentValid) {\n\t\t\t// Clear specific-flag :state() entries.\n\t\t\tfor (const flag of [\n\t\t\t\t'value-missing',\n\t\t\t\t'type-mismatch',\n\t\t\t\t'pattern-mismatch',\n\t\t\t\t'too-short',\n\t\t\t\t'too-long',\n\t\t\t\t'range-underflow',\n\t\t\t\t'range-overflow',\n\t\t\t\t'step-mismatch',\n\t\t\t\t'bad-input',\n\t\t\t]) {\n\t\t\t\tthis.internals?.states.delete(flag)\n\t\t\t}\n\t\t}\n\t\treturn parentValid\n\t}\n\n\t/**\n\t * Show validation UI and check validity.\n\t * Marks the field as submitted so the mixin's gate flips to \"always show.\"\n\t */\n\tpublic override reportValidity() {\n\t\tthis.markSubmitted()\n\t\tconst inputValid = this.inputRef.value?.reportValidity() ?? true\n\t\tconst parentValid = super.reportValidity()\n\t\treturn inputValid && parentValid\n\t}\n\n\t/** Set a custom validation error on both the inner input and the mixin. */\n\tpublic override setCustomValidity(message: string) {\n\t\tif (this.inputRef.value) {\n\t\t\tthis.inputRef.value.setCustomValidity(message)\n\t\t}\n\t\tsuper.setCustomValidity(message)\n\t}\n\n\t// ----------------------------\n\t//  E) Lifecycle Hooks & Event Handlers\n\t// ----------------------------\n\tfirstUpdated() {\n\t\t// Autofocus if desired\n\t\tif (this.autofocus) {\n\t\t\t// Schedule focus after initial render — RxJS timer for cancel-on-disconnect.\n\t\t\ttimer(0)\n\t\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t\t.subscribe(() => this.focus())\n\t\t}\n\n\t\t// Subscribe to input events\n\t\tthis.setupInputEvents()\n\t\tthis.setupFocusBlurEvents()\n\t\tthis.setupAutofillDetection()\n\t\tthis.setupEnterKeyEvents()\n\t}\n\n\t/**\n\t * Set up input event handling for value changes\n\t */\n\tprivate setupInputEvents() {\n\t\tfromEvent<InputEvent>(this.inputElement, 'input')\n\t\t\t.pipe(\n\t\t\t\tmap(ev => {\n\t\t\t\t\t// Stop native event from bubbling - we'll dispatch our own custom event\n\t\t\t\t\tev.stopPropagation()\n\n\t\t\t\t\t// Capture all input event properties for complete event forwarding\n\t\t\t\t\tconst inputEvent = ev as InputEvent\n\t\t\t\t\tconst target = ev.target as HTMLInputElement\n\t\t\t\t\treturn {\n\t\t\t\t\t\tvalue: target.value,\n\t\t\t\t\t\tinputType: inputEvent.inputType,\n\t\t\t\t\t\tdata: inputEvent.data,\n\t\t\t\t\t\tisComposing: inputEvent.isComposing,\n\t\t\t\t\t\toriginalEvent: ev,\n\t\t\t\t\t}\n\t\t\t\t}),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(eventData => {\n\t\t\t\t// Update component value\n\t\t\t\tthis.value = eventData.value\n\n\t\t\t\t// `dirty` is a getter on the mixin (value vs _defaultValue) — no manual set.\n\n\t\t\t\t// Fire custom 'input' event with extended details\n\t\t\t\tconst customEvent = new CustomEvent<EventDetails>('input', {\n\t\t\t\t\tdetail: { value: eventData.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\n\t\t\t\t// Add additional properties to match native events more closely\n\t\t\t\tObject.defineProperties(customEvent, {\n\t\t\t\t\tinputType: { value: eventData.inputType },\n\t\t\t\t\tdata: { value: eventData.data },\n\t\t\t\t\tisComposing: { value: eventData.isComposing },\n\t\t\t\t})\n\n\t\t\t\tthis.dispatchEvent(customEvent)\n\n\t\t\t\t// Mixin's willUpdate runs checkValidity() on value-change when\n\t\t\t\t// _shouldShowError() is true — no manual validateInput() call.\n\t\t\t})\n\n\t\t// Subscribe to native change events (usually on blur)\n\t\tfromEvent<Event>(this.inputElement, 'change')\n\t\t\t.pipe(\n\t\t\t\tmap(ev => {\n\t\t\t\t\t// Stop native event from bubbling - we'll dispatch our own custom event\n\t\t\t\t\tev.stopPropagation()\n\t\t\t\t\treturn (ev.target as HTMLInputElement).value\n\t\t\t\t}),\n\t\t\t\tdistinctUntilChanged(),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(value => {\n\t\t\t\tthis.value = value\n\t\t\t\tthis.emitChange({ value })\n\t\t\t\t// Validation runs automatically via mixin's willUpdate.\n\t\t\t})\n\t}\n\n\t/**\n\t * Set up focus/blur event handling\n\t */\n\tprivate setupFocusBlurEvents() {\n\t\tfromEvent<FocusEvent>(this.inputElement, 'focus')\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe(ev => {\n\t\t\t\t// Create a custom focus event that includes standard props\n\t\t\t\tconst focusEvent = new CustomEvent('focus', {\n\t\t\t\t\tbubbles: ev.bubbles,\n\t\t\t\t\tcancelable: ev.cancelable,\n\t\t\t\t\tcomposed: ev.composed,\n\t\t\t\t})\n\n\t\t\t\t// Add focus-specific properties\n\t\t\t\tObject.defineProperties(focusEvent, {\n\t\t\t\t\trelatedTarget: { value: ev.relatedTarget },\n\t\t\t\t})\n\n\t\t\t\tthis.dispatchEvent(focusEvent)\n\t\t\t})\n\n\t\tfromEvent<FocusEvent>(this.inputElement, 'blur')\n\t\t\t.pipe(takeUntil(this.disconnecting))\n\t\t\t.subscribe(ev => {\n\t\t\t\t// Mark as touched on blur — mixin's willUpdate handles the rest\n\t\t\t\t// (validates if dirty, broadcasts :state(touched), etc.).\n\t\t\t\tthis.markTouched()\n\n\t\t\t\t// Create a custom blur event that includes standard props\n\t\t\t\tconst blurEvent = new CustomEvent('blur', {\n\t\t\t\t\tbubbles: ev.bubbles,\n\t\t\t\t\tcancelable: ev.cancelable,\n\t\t\t\t\tcomposed: ev.composed,\n\t\t\t\t})\n\n\t\t\t\t// Add blur-specific properties\n\t\t\t\tObject.defineProperties(blurEvent, {\n\t\t\t\t\trelatedTarget: { value: ev.relatedTarget },\n\t\t\t\t})\n\n\t\t\t\tthis.dispatchEvent(blurEvent)\n\t\t\t})\n\t}\n\n\t/**\n\t * Set up autofill detection\n\t */\n\tprivate setupAutofillDetection() {\n\t\t// Detect autofill animation (Chrome, etc.)\n\t\tfromEvent<AnimationEvent>(this.inputElement, 'animationstart')\n\t\t\t.pipe(\n\t\t\t\tfilter(ev => ev.animationName === 'onAutoFillStart'),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(ev => {\n\t\t\t\tconst { value } = ev.target as HTMLInputElement\n\t\t\t\tthis.value = value\n\t\t\t\tthis.isAutofilled = true\n\t\t\t\t// `dirty` is a getter on the mixin — recomputes from value vs _defaultValue.\n\n\t\t\t\t// Dispatch autofill event for integration with autofill systems\n\t\t\t\tthis.dispatchEvent(\n\t\t\t\t\tnew CustomEvent('autofill', {\n\t\t\t\t\t\tdetail: { value },\n\t\t\t\t\t\tbubbles: true,\n\t\t\t\t\t\tcomposed: true,\n\t\t\t\t\t}),\n\t\t\t\t)\n\n\t\t\t\t// Also propagate as a change event like browsers do\n\t\t\t\tthis.emitChange({ value })\n\t\t\t})\n\n\t\t// Detect end of autofill (Chrome)\n\t\tfromEvent<AnimationEvent>(this.inputElement, 'animationstart')\n\t\t\t.pipe(\n\t\t\t\tfilter(ev => ev.animationName === 'onAutoFillCancel'),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(() => {\n\t\t\t\tthis.isAutofilled = false\n\t\t\t})\n\t}\n\n\t/**\n\t * Set up enter key event handling\n\t */\n\tprivate setupEnterKeyEvents() {\n\t\t// Listen for Enter on keydown\n\t\tfromEvent<KeyboardEvent>(this.inputElement, 'keydown')\n\t\t\t.pipe(\n\t\t\t\tfilter(ev => ev.key === 'Enter'),\n\t\t\t\ttakeUntil(this.disconnecting),\n\t\t\t)\n\t\t\t.subscribe(ev => {\n\t\t\t\tconst { value } = ev.target as HTMLInputElement\n\t\t\t\t\n\t\t\t\t// Update value if changed (mixin recomputes dirty automatically)\n\t\t\t\tif (this.value !== value) {\n\t\t\t\t\tthis.value = value\n\t\t\t\t}\n\t\t\t\t\n\t\t\t\t// Blur the input to trigger change event naturally\n\t\t\t\t// This mimics what happens when you tab out of the field\n\t\t\t\tthis.inputElement.blur()\n\n\t\t\t\t// Dispatch enhanced enter event\n\t\t\t\tconst enterEvent = new CustomEvent<EventDetails>('enter', {\n\t\t\t\t\tdetail: { value: this.value },\n\t\t\t\t\tbubbles: true,\n\t\t\t\t\tcomposed: true,\n\t\t\t\t})\n\n\t\t\t\t// Add extra keyboard event props\n\t\t\t\tObject.defineProperties(enterEvent, {\n\t\t\t\t\tkey: { value: 'Enter' },\n\t\t\t\t\tcode: { value: 'Enter' },\n\t\t\t\t\tkeyCode: { value: 13 },\n\t\t\t\t\twhich: { value: 13 },\n\t\t\t\t})\n\n\t\t\t\tthis.dispatchEvent(enterEvent)\n\t\t\t})\n\t}\n\n\t// ----------------------------\n\t//  F) Utility Methods\n\t// ----------------------------\n\t/** Selects all text within the input. */\n\tpublic select() {\n\t\treturn this.inputRef.value?.select()\n\t}\n\n\t/** Returns the native validity state of the inner <input>. */\n\tpublic getValidity(): ValidityState | undefined {\n\t\treturn this.inputRef.value?.validity\n\t}\n\n\t/**\n\t * Sets the selection range. Mirrors native input.setSelectionRange\n\t */\n\tpublic setSelectionRange(start: number, end: number, direction?: 'forward' | 'backward' | 'none') {\n\t\tthis.inputRef.value?.setSelectionRange(start, end, direction)\n\t}\n\n\t/**\n\t * Returns the selected text within the input (start position)\n\t */\n\tpublic get selectionStart(): number | null {\n\t\treturn this.inputRef.value?.selectionStart ?? null\n\t}\n\n\t/**\n\t * Returns the selected text within the input (end position)\n\t */\n\tpublic get selectionEnd(): number | null {\n\t\treturn this.inputRef.value?.selectionEnd ?? null\n\t}\n\n\t/**\n\t * Returns the direction of selection\n\t */\n\tpublic get selectionDirection(): 'forward' | 'backward' | 'none' | null {\n\t\treturn this.inputRef.value?.selectionDirection ?? null\n\t}\n\n\t/**\n\t * Sets the range of text to be selected.\n\t */\n\tpublic setRangeText(\n\t\treplacement: string,\n\t\tstart?: number,\n\t\tend?: number,\n\t\tselectMode?: 'select' | 'start' | 'end' | 'preserve',\n\t) {\n\t\tif (start !== undefined && end !== undefined) {\n\t\t\tthis.inputRef.value?.setRangeText(replacement, start, end, selectMode)\n\t\t} else {\n\t\t\tthis.inputRef.value?.setRangeText(replacement)\n\t\t}\n\t}\n\n\t/**\n\t * Override to forward focus to the internal <input>.\n\t * Also dispatch a 'focus' event for external listeners.\n\t */\n\tpublic override focus(options?: FocusOptions) {\n\t\tthis.inputRef.value?.focus(options)\n\t\tthis.dispatchEvent(new Event('focus'))\n\t}\n\n\t/**\n\t * Override to forward clicks to the internal <input>.\n\t * Also dispatch a 'click' event for external listeners.\n\t */\n\tpublic override click() {\n\t\tthis.inputRef.value?.click()\n\t\tthis.dispatchEvent(new Event('click'))\n\t}\n\n\t/** Forward blur to the internal <input>. */\n\tpublic override blur() {\n\t\tthis.inputRef.value?.blur()\n\t\tthis.dispatchEvent(new Event('blur'))\n\t}\n\n\t// ----------------------------\n\t//  G) Rendering\n\t// ----------------------------\n\tprotected override render() {\n\t\t// Determine height and padding based on size - M3 spec aligned\n\t\tconst getHeightAndPadding = () => {\n\t\t\tswitch (this.size) {\n\t\t\t\tcase 'xxs':\n\t\t\t\t\t// Ultra-compact: 24dp height\n\t\t\t\t\treturn {\n\t\t\t\t\t\theight: '24px',\n\t\t\t\t\t\tpadding: '0 8px',\n\t\t\t\t\t\tfontSize: '0.625rem', // 10px\n\t\t\t\t\t}\n\t\t\t\tcase 'xs':\n\t\t\t\t\t// M3 dense: 32dp height\n\t\t\t\t\treturn {\n\t\t\t\t\t\theight: '32px',\n\t\t\t\t\t\tpadding: '0 12px',\n\t\t\t\t\t\tfontSize: '0.75rem', // 12px\n\t\t\t\t\t}\n\t\t\t\tcase 'sm':\n\t\t\t\t\t// M3 default: 40dp height\n\t\t\t\t\treturn {\n\t\t\t\t\t\theight: '40px',\n\t\t\t\t\t\tpadding: '0 16px',\n\t\t\t\t\t\tfontSize: '0.875rem', // 14px - M3 body-large\n\t\t\t\t\t}\n\t\t\t\tcase 'lg':\n\t\t\t\t\t// M3 extra large: 56dp height\n\t\t\t\t\treturn {\n\t\t\t\t\t\theight: '56px',\n\t\t\t\t\t\tpadding: '0 20px',\n\t\t\t\t\t\tfontSize: '1rem', // 16px\n\t\t\t\t\t}\n\t\t\t\tcase 'md':\n\t\t\t\tdefault:\n\t\t\t\t\t// M3 standard: 48dp height\n\t\t\t\t\treturn {\n\t\t\t\t\t\theight: '48px',\n\t\t\t\t\t\tpadding: '0 16px',\n\t\t\t\t\t\tfontSize: '0.875rem', // 14px - M3 body-large\n\t\t\t\t\t}\n\t\t\t}\n\t\t}\n\n\t\tconst { height, padding, fontSize } = getHeightAndPadding()\n\n\t\t// Check if it's a date-type input\n\t\tconst isDateType = ['date', 'datetime-local', 'time', 'month', 'week'].includes(this.type)\n\n\t\tconst inputClasses = {\n\t\t\t// Base styles - outlined rounded input\n\t\t\t'block w-full min-w-0 rounded-2xl border bg-surface-containerLowest text-surface-on': true,\n\t\t\t// Border color\n\t\t\t'border-outline': !this.error,\n\t\t\t'border-error-default': this.error,\n\t\t\t// Focus styles\n\t\t\t'outline-secondary-default focus:outline-1 focus:border-secondary-default': true,\n\t\t\t// Disabled styles\n\t\t\t'disabled:opacity-40 disabled:cursor-not-allowed': true,\n\t\t\t// Placeholder\n\t\t\t'placeholder:text-muted': true,\n\t\t\t// Ring styles (subtle focus ring)\n\t\t\t'ring-0 focus:ring-1 focus:ring-inset': true,\n\t\t\t// Ring colors based on error state\n\t\t\t'focus:ring-secondary-default': !this.error,\n\t\t\t'focus:ring-error-default': this.error,\n\t\t\t// Readonly styles\n\t\t\t'caret-transparent focus:outline-hidden cursor-pointer select-none': this.readonly,\n\t\t\t'cursor-pointer': this.clickable,\n\t\t\t// Text alignment (date inputs always left-aligned)\n\t\t\t'text-left': this.align === 'left' || isDateType,\n\t\t\t'text-center': this.align === 'center' && !isDateType,\n\t\t\t'text-right': this.align === 'right' && !isDateType,\n\t\t\t// Autofill\n\t\t\tautofilled: this.isAutofilled,\n\t\t}\n\n\t\tconst labelClasses = {\n\t\t\t'block mb-1 font-medium': true,\n\t\t\t'opacity-40': this.disabled,\n\t\t\t'text-[10px]': this.size === 'xxs',\n\t\t\t'text-xs': this.size === 'xs',\n\t\t\t'text-sm': this.size === 'sm',\n\t\t\t'text-base': this.size === 'md',\n\t\t\t'text-lg': this.size === 'lg',\n\t\t\t'text-primary-default': !this.error,\n\t\t\t'text-error-default': this.error,\n\t\t}\n\n\t\tconst styles = {\n\t\t\theight,\n\t\t\tpadding,\n\t\t\tfontSize,\n\t\t\t// Ensure vertical centering for all input types\n\t\t\tlineHeight: height,\n\t\t}\n\n\t\t/**\n\t\t * - If `this.label` is present, we render a proper `<label for=\"${this.id}\">`.\n\t\t * - If not, we add an aria-label to the <input> for better accessibility.\n\t\t * - If there's a `hint`, we reference it via aria-describedby.\n\t\t * - If there's an error, we set aria-invalid and could set aria-errormessage.\n\t\t */\n\t\treturn html`\n\t\t\t<div class=\"w-full min-w-0 ${isDateType ? 'date-input-container' : ''}\">\n\t\t\t\t${when(\n\t\t\t\t\tthis.label,\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<label\n\t\t\t\t\t\t\tfor=${this.id}\n\t\t\t\t\t\t\tclass=${this.classMap(labelClasses)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${this.label}\n\t\t\t\t\t\t</label>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\n\t\t\t\t<input\n\t\t\t\t\t${ref(this.inputRef)}\n\t\t\t\t\tid=${this.id}\n\t\t\t\t\tname=${this.name}\n\t\t\t\t\tclass=${this.classMap(inputClasses)}\n\t\t\t\t\tstyle=${this.styleMap(styles)}\n\t\t\t\t\t.value=${this.value}\n\t\t\t\t\t.type=${this.type}\n\t\t\t\t\t.autocomplete=${this.autocomplete}\n\t\t\t\t\t.spellcheck=${this.spellcheck}\n\t\t\t\t\tplaceholder=${this.placeholder}\n\t\t\t\t\tinputmode=${ifDefined(this.inputmode)}\n\t\t\t\t\tpattern=${ifDefined(this.pattern)}\n\t\t\t\t\t.step=${this.step ?? ''}\n\t\t\t\t\tminlength=${ifDefined(this.minlength)}\n\t\t\t\t\tmaxlength=${ifDefined(this.maxlength)}\n\t\t\t\t\tmin=${ifDefined(this.min)}\n\t\t\t\t\tmax=${ifDefined(this.max)}\n\t\t\t\t\tlist=${ifDefined(this.list)}\n\t\t\t\t\t?required=${this.required}\n\t\t\t\t\t?disabled=${this.disabled}\n\t\t\t\t\t?readonly=${this.readonly}\n\t\t\t\t\taria-invalid=${this.error ? 'true' : 'false'}\n\t\t\t\t\taria-required=${this.required ? 'true' : 'false'}\n\t\t\t\t\taria-labelledby=${this.label ? `label-${this.id}` : nothing}\n\t\t\t\t\taria-describedby=${this.hint || this.validationMessage ? `hint-${this.id}` : nothing}\n\t\t\t\t\taria-label=${ifDefined(!this.label ? this.placeholder || 'Input' : undefined)}\n\t\t\t\t/>\n\n\t\t\t\t${when(\n\t\t\t\t\tthis.hint || (this.error && this.validationMessage),\n\t\t\t\t\t() => html`\n\t\t\t\t\t\t<div\n\t\t\t\t\t\t\tid=\"hint-${this.id}\"\n\t\t\t\t\t\t\tclass=\"mt-1 text-sm ${this.error ? 'text-error-default' : 'text-surface-onVariant'}\"\n\t\t\t\t\t\t\trole=${ifDefined(this.error ? 'alert' : undefined)}\n\t\t\t\t\t\t>\n\t\t\t\t\t\t\t${this.error && this.validationMessage ? this.validationMessage : this.hint}\n\t\t\t\t\t\t</div>\n\t\t\t\t\t`,\n\t\t\t\t)}\n\t\t\t</div>\n\t\t`\n\t}\n}\n\n/**\n * Register the component with the legacy tag name for backward compatibility\n * @prop {string} label - Label text for the form field (inherited from FormFieldMixin)\n * @prop {boolean} required - Whether the field is required (inherited from FormFieldMixin)\n * @prop {boolean} disabled - Whether the field is disabled (inherited from FormFieldMixin)\n * @prop {boolean} readonly - Whether the field is read-only (inherited from FormFieldMixin)\n * @prop {boolean} error - Whether the field is in an error state (inherited from FormFieldMixin)\n * @prop {string} validationMessage - The validation message to display (inherited from FormFieldMixin)\n * @prop {string} hint - Optional hint text to display below the field (inherited from FormFieldMixin)\n */\n@customElement('sch-input')\nexport class SchmancyInputCompat extends SchmancyInput {}\n"],"mappings":"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"}

package/dist/input-BtcIhu0Q.cjs

@@ -0,0 +1,52 @@
+require(`./chunk-CncqDLb2.cjs`);const e=require(`./mixins-BOOu6q2n.cjs`),t=require(`./active-host-jH3iloCR.cjs`);let n=require(`rxjs`),r=require(`lit/decorators.js`),i=require(`lit`),a=require(`lit/directives/if-defined.js`),o=require(`lit/directives/ref.js`),s=require(`lit/directives/when.js`);var c,l=class extends e.o((0,i.unsafeCSS)(`/*! tailwindcss v4.2.4 | MIT License | https://tailwindcss.com */
+:host{width:100%;min-width:calc(var(--spacing,.25rem) * 0);box-sizing:border-box;max-width:100%;display:block}.date-input-container{width:100%;min-width:0;width:100%!important;max-width:100%!important}input{appearance:none;border-radius:8px;width:-webkit-fill-available;font-size:16px;transition:box-shadow .3s cubic-bezier(.34,1.56,.64,1),border-color .2s}input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px var(--schmancy-sys-color-secondary-default)}@supports (color:color-mix(in lab, red, red)){input:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-secondary-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-secondary-default) 20%, transparent)}}input[aria-invalid=true]{box-shadow:0 0 12px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]{box-shadow:0 0 12px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 15%, transparent)}}input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px var(--schmancy-sys-color-error-default)}@supports (color:color-mix(in lab, red, red)){input[aria-invalid=true]:focus{box-shadow:0 0 0 1px var(--schmancy-sys-color-error-default), 0 0 16px -4px color-mix(in srgb, var(--schmancy-sys-color-error-default) 25%, transparent)}}@media (prefers-reduced-motion:reduce){input{transition:none}}input[type=number]::-webkit-inner-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]::-webkit-outer-spin-button{appearance:none;margin:calc(var(--spacing,.25rem) * 0)}input[type=number]{appearance:textfield}input:-webkit-autofill{animation-name:onAutoFillStart;-webkit-box-shadow:0 0 0 30px var(--schmancy-sys-color-surface-highest) inset!important;-webkit-text-fill-color:var(--schmancy-sys-color-surface-on)!important}input:autofill{background-color:var(--schmancy-sys-color-surface-highest)!important;color:var(--schmancy-sys-color-surface-on)!important}input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;width:100%;line-height:inherit;border-radius:8px;min-width:100%;max-width:100%;margin:0;display:block;overflow:hidden;border-radius:8px!important;width:100%!important}input::-webkit-datetime-edit{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit-fields-wrapper{align-items:center;width:100%;height:100%;margin:0;padding:0;display:flex}input::-webkit-datetime-edit{flex:1;width:100%}input::-webkit-datetime-edit-fields-wrapper{flex:1;justify-content:space-between;width:100%}input::-webkit-datetime-edit-text{align-items:center;display:flex}input::-webkit-datetime-edit-day-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-month-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-year-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-hour-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-minute-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-second-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-millisecond-field{flex-shrink:0;padding:0 2px}input::-webkit-datetime-edit-meridiem-field{flex-shrink:0;padding:0 2px}input[type=date]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=datetime-local]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=time]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=month]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}input[type=week]::-webkit-calendar-picker-indicator{opacity:.5;cursor:pointer}@-moz-document url-prefix(){input[type=date],input[type=datetime-local],input[type=time]{min-height:inherit}}@supports (-webkit-touch-callout:none){input[type=date],input[type=datetime-local],input[type=time],input[type=month],input[type=week]{appearance:none;border-radius:0;width:-webkit-fill-available!important;width:fill-available!important;padding-left:12px!important;padding-right:12px!important}input::-webkit-datetime-edit{width:100%!important;padding-left:0!important;padding-right:0!important}input::-webkit-datetime-edit-fields-wrapper{width:100%!important;margin:0!important;padding:0!important}}`)){static{c=this}constructor(...e){super(...e),this.value=``,this.type=`text`,this.placeholder=``,this.clickable=!1,this.spellcheck=!1,this.align=`left`,this.step=`any`,this.autofocus=!1,this.autocomplete=`on`,this.tabIndex=0,this.size=`md`,this.inputRef=(0,o.createRef)(),this.isAutofilled=!1}static{this._idCounter=0}static{this.shadowRootOptions={...i.LitElement.shadowRootOptions,delegatesFocus:!0}}willUpdate(e){this.id||=`sch-input-`+ c._idCounter++,super.willUpdate(e)}connectedCallback(){super.connectedCallback(),this.setupExternalLabelAssociation()}setupExternalLabelAssociation(){if(this.id){let e=()=>{document.querySelectorAll(`label[for="${this.id}"]`).forEach(e=>{(0,n.fromEvent)(e,`click`).pipe((0,n.takeUntil)(this.disconnecting)).subscribe(()=>{this.focus()})})};document.readyState===`complete`?e():(0,n.fromEvent)(document,`DOMContentLoaded`).pipe((0,n.takeUntil)(this.disconnecting)).subscribe(e)}}updated(e){super.updated?.(e),(e.has(`value`)||e.has(`required`)||e.has(`type`)||e.has(`pattern`)||e.has(`min`)||e.has(`max`)||e.has(`minlength`)||e.has(`maxlength`))&&this.checkValidity()}_firstMatchingErrorMessage(e){let t=this.errorMessages;if(t)return e.valueMissing&&t.valueMissing?t.valueMissing:e.typeMismatch&&t.typeMismatch?t.typeMismatch:e.patternMismatch&&t.patternMismatch?t.patternMismatch:e.tooShort&&t.tooShort?t.tooShort:e.tooLong&&t.tooLong?t.tooLong:e.rangeUnderflow&&t.rangeUnderflow?t.rangeUnderflow:e.rangeOverflow&&t.rangeOverflow?t.rangeOverflow:e.stepMismatch&&t.stepMismatch?t.stepMismatch:e.badInput&&t.badInput?t.badInput:void 0}checkValidity(){let e=this.inputElement??this.inputRef.value,t=e?.validity;if(t&&!t.valid){let n={valueMissing:t.valueMissing||void 0,typeMismatch:t.typeMismatch||void 0,patternMismatch:t.patternMismatch||void 0,tooShort:t.tooShort||void 0,tooLong:t.tooLong||void 0,rangeUnderflow:t.rangeUnderflow||void 0,rangeOverflow:t.rangeOverflow||void 0,stepMismatch:t.stepMismatch||void 0,badInput:t.badInput||void 0,customError:t.customError||void 0},r=this._firstMatchingErrorMessage(t);if(this.internals?.setValidity(n,r||e.validationMessage||this.validationMessage||`Invalid value`),this._shouldShowError()){this.error=!0;let n=r||e.validationMessage;n&&(this.validationMessage=n);for(let e of[`value-missing`,`type-mismatch`,`pattern-mismatch`,`too-short`,`too-long`,`range-underflow`,`range-overflow`,`step-mismatch`,`bad-input`])this.internals?.states.delete(e);t.valueMissing&&this.internals?.states.add(`value-missing`),t.typeMismatch&&this.internals?.states.add(`type-mismatch`),t.patternMismatch&&this.internals?.states.add(`pattern-mismatch`),t.tooShort&&this.internals?.states.add(`too-short`),t.tooLong&&this.internals?.states.add(`too-long`),t.rangeUnderflow&&this.internals?.states.add(`range-underflow`),t.rangeOverflow&&this.internals?.states.add(`range-overflow`),t.stepMismatch&&this.internals?.states.add(`step-mismatch`),t.badInput&&this.internals?.states.add(`bad-input`)}return!1}let n=super.checkValidity();if(n)for(let e of[`value-missing`,`type-mismatch`,`pattern-mismatch`,`too-short`,`too-long`,`range-underflow`,`range-overflow`,`step-mismatch`,`bad-input`])this.internals?.states.delete(e);return n}reportValidity(){this.markSubmitted();let e=this.inputRef.value?.reportValidity()??!0,t=super.reportValidity();return e&&t}setCustomValidity(e){this.inputRef.value&&this.inputRef.value.setCustomValidity(e),super.setCustomValidity(e)}firstUpdated(){this.autofocus&&(0,n.timer)(0).pipe((0,n.takeUntil)(this.disconnecting)).subscribe(()=>this.focus()),this.setupInputEvents(),this.setupFocusBlurEvents(),this.setupAutofillDetection(),this.setupEnterKeyEvents()}setupInputEvents(){(0,n.fromEvent)(this.inputElement,`input`).pipe((0,n.map)(e=>{e.stopPropagation();let t=e;return{value:e.target.value,inputType:t.inputType,data:t.data,isComposing:t.isComposing,originalEvent:e}}),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{this.value=e.value;let t=new CustomEvent(`input`,{detail:{value:e.value},bubbles:!0,composed:!0});Object.defineProperties(t,{inputType:{value:e.inputType},data:{value:e.data},isComposing:{value:e.isComposing}}),this.dispatchEvent(t)}),(0,n.fromEvent)(this.inputElement,`change`).pipe((0,n.map)(e=>(e.stopPropagation(),e.target.value)),(0,n.distinctUntilChanged)(),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{this.value=e,this.emitChange({value:e})})}setupFocusBlurEvents(){(0,n.fromEvent)(this.inputElement,`focus`).pipe((0,n.takeUntil)(this.disconnecting)).subscribe(e=>{let t=new CustomEvent(`focus`,{bubbles:e.bubbles,cancelable:e.cancelable,composed:e.composed});Object.defineProperties(t,{relatedTarget:{value:e.relatedTarget}}),this.dispatchEvent(t)}),(0,n.fromEvent)(this.inputElement,`blur`).pipe((0,n.takeUntil)(this.disconnecting)).subscribe(e=>{this.markTouched();let t=new CustomEvent(`blur`,{bubbles:e.bubbles,cancelable:e.cancelable,composed:e.composed});Object.defineProperties(t,{relatedTarget:{value:e.relatedTarget}}),this.dispatchEvent(t)})}setupAutofillDetection(){(0,n.fromEvent)(this.inputElement,`animationstart`).pipe((0,n.filter)(e=>e.animationName===`onAutoFillStart`),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{let{value:t}=e.target;this.value=t,this.isAutofilled=!0,this.dispatchEvent(new CustomEvent(`autofill`,{detail:{value:t},bubbles:!0,composed:!0})),this.emitChange({value:t})}),(0,n.fromEvent)(this.inputElement,`animationstart`).pipe((0,n.filter)(e=>e.animationName===`onAutoFillCancel`),(0,n.takeUntil)(this.disconnecting)).subscribe(()=>{this.isAutofilled=!1})}setupEnterKeyEvents(){(0,n.fromEvent)(this.inputElement,`keydown`).pipe((0,n.filter)(e=>e.key===`Enter`),(0,n.takeUntil)(this.disconnecting)).subscribe(e=>{let{value:t}=e.target;this.value!==t&&(this.value=t),this.inputElement.blur();let n=new CustomEvent(`enter`,{detail:{value:this.value},bubbles:!0,composed:!0});Object.defineProperties(n,{key:{value:`Enter`},code:{value:`Enter`},keyCode:{value:13},which:{value:13}}),this.dispatchEvent(n)})}select(){return this.inputRef.value?.select()}getValidity(){return this.inputRef.value?.validity}setSelectionRange(e,t,n){this.inputRef.value?.setSelectionRange(e,t,n)}get selectionStart(){return this.inputRef.value?.selectionStart??null}get selectionEnd(){return this.inputRef.value?.selectionEnd??null}get selectionDirection(){return this.inputRef.value?.selectionDirection??null}setRangeText(e,t,n,r){t!==void 0&&n!==void 0?this.inputRef.value?.setRangeText(e,t,n,r):this.inputRef.value?.setRangeText(e)}focus(e){this.inputRef.value?.focus(e),this.dispatchEvent(new Event(`focus`))}click(){this.inputRef.value?.click(),this.dispatchEvent(new Event(`click`))}blur(){this.inputRef.value?.blur(),this.dispatchEvent(new Event(`blur`))}render(){let{height:e,padding:t,fontSize:n}=(()=>{switch(this.size){case`xxs`:return{height:`24px`,padding:`0 8px`,fontSize:`0.625rem`};case`xs`:return{height:`32px`,padding:`0 12px`,fontSize:`0.75rem`};case`sm`:return{height:`40px`,padding:`0 16px`,fontSize:`0.875rem`};case`lg`:return{height:`56px`,padding:`0 20px`,fontSize:`1rem`};default:return{height:`48px`,padding:`0 16px`,fontSize:`0.875rem`}}})(),r=[`date`,`datetime-local`,`time`,`month`,`week`].includes(this.type),c={"block w-full min-w-0 rounded-2xl border bg-surface-containerLowest text-surface-on":!0,"border-outline":!this.error,"border-error-default":this.error,"outline-secondary-default focus:outline-1 focus:border-secondary-default":!0,"disabled:opacity-40 disabled:cursor-not-allowed":!0,"placeholder:text-muted":!0,"ring-0 focus:ring-1 focus:ring-inset":!0,"focus:ring-secondary-default":!this.error,"focus:ring-error-default":this.error,"caret-transparent focus:outline-hidden cursor-pointer select-none":this.readonly,"cursor-pointer":this.clickable,"text-left":this.align===`left`||r,"text-center":this.align===`center`&&!r,"text-right":this.align===`right`&&!r,autofilled:this.isAutofilled},l={"block mb-1 font-medium":!0,"opacity-40":this.disabled,"text-[10px]":this.size===`xxs`,"text-xs":this.size===`xs`,"text-sm":this.size===`sm`,"text-base":this.size===`md`,"text-lg":this.size===`lg`,"text-primary-default":!this.error,"text-error-default":this.error},u={height:e,padding:t,fontSize:n,lineHeight:e};return i.html`
+			<div class="w-full min-w-0 ${r?`date-input-container`:``}">
+				${(0,s.when)(this.label,()=>i.html`
+						<label
+							for=${this.id}
+							class=${this.classMap(l)}
+						>
+							${this.label}
+						</label>
+					`)}
+
+				<input
+					${(0,o.ref)(this.inputRef)}
+					id=${this.id}
+					name=${this.name}
+					class=${this.classMap(c)}
+					style=${this.styleMap(u)}
+					.value=${this.value}
+					.type=${this.type}
+					.autocomplete=${this.autocomplete}
+					.spellcheck=${this.spellcheck}
+					placeholder=${this.placeholder}
+					inputmode=${(0,a.ifDefined)(this.inputmode)}
+					pattern=${(0,a.ifDefined)(this.pattern)}
+					.step=${this.step??``}
+					minlength=${(0,a.ifDefined)(this.minlength)}
+					maxlength=${(0,a.ifDefined)(this.maxlength)}
+					min=${(0,a.ifDefined)(this.min)}
+					max=${(0,a.ifDefined)(this.max)}
+					list=${(0,a.ifDefined)(this.list)}
+					?required=${this.required}
+					?disabled=${this.disabled}
+					?readonly=${this.readonly}
+					aria-invalid=${this.error?`true`:`false`}
+					aria-required=${this.required?`true`:`false`}
+					aria-labelledby=${this.label?`label-${this.id}`:i.nothing}
+					aria-describedby=${this.hint||this.validationMessage?`hint-${this.id}`:i.nothing}
+					aria-label=${(0,a.ifDefined)(this.label?void 0:this.placeholder||`Input`)}
+				/>
+
+				${(0,s.when)(this.hint||this.error&&this.validationMessage,()=>i.html`
+						<div
+							id="hint-${this.id}"
+							class="mt-1 text-sm ${this.error?`text-error-default`:`text-surface-onVariant`}"
+							role=${(0,a.ifDefined)(this.error?`alert`:void 0)}
+						>
+							${this.error&&this.validationMessage?this.validationMessage:this.hint}
+						</div>
+					`)}
+			</div>
+		`}};t.a([(0,r.property)({type:String,reflect:!0})],l.prototype,`value`,void 0),t.a([(0,r.property)({reflect:!0})],l.prototype,`type`,void 0),t.a([(0,r.property)()],l.prototype,`placeholder`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],l.prototype,`pattern`,void 0),t.a([(0,r.property)({type:Boolean,reflect:!0})],l.prototype,`clickable`,void 0),t.a([(0,r.property)({type:Boolean,reflect:!0})],l.prototype,`spellcheck`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],l.prototype,`align`,void 0),t.a([(0,r.property)()],l.prototype,`inputmode`,void 0),t.a([(0,r.property)({type:Number,reflect:!0})],l.prototype,`minlength`,void 0),t.a([(0,r.property)({type:Number})],l.prototype,`maxlength`,void 0),t.a([(0,r.property)()],l.prototype,`min`,void 0),t.a([(0,r.property)()],l.prototype,`max`,void 0),t.a([(0,r.property)({reflect:!0})],l.prototype,`step`,void 0),t.a([(0,r.property)({type:Boolean})],l.prototype,`autofocus`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],l.prototype,`autocomplete`,void 0),t.a([(0,r.property)({type:Number,reflect:!0})],l.prototype,`tabIndex`,void 0),t.a([(0,r.property)({type:String,reflect:!0})],l.prototype,`size`,void 0),t.a([(0,r.property)({type:String})],l.prototype,`list`,void 0),t.a([(0,r.query)(`input`)],l.prototype,`inputElement`,void 0),t.a([(0,r.state)()],l.prototype,`isAutofilled`,void 0);var u=l=c=t.a([(0,r.customElement)(`schmancy-input`)],l),d=class extends l{};d=t.a([(0,r.customElement)(`sch-input`)],d),Object.defineProperty(exports,`n`,{enumerable:!0,get:function(){return u}}),Object.defineProperty(exports,`t`,{enumerable:!0,get:function(){return d}});