@sbb-esta/lyne-elements-dev 0.0.0 → 4.0.0-dev.1775550881

package/date-input/date-input.component.js

@@ -0,0 +1,2 @@
+import { t as e } from "../date-input.component-B3f_GThS.js";
+export { e as SbbDateInputElement };

package/date-input.component-B3f_GThS.js

@@ -0,0 +1,205 @@
+import { __esDecorate as e, __runInitializers as t } from "tslib";
+import { isServer as n, unsafeCSS as r } from "lit";
+import { property as i } from "lit/decorators.js";
+import { SbbElement as a } from "./core/base-elements.js";
+import { plainDate as o, plainDateConverter as s } from "./core/decorators.js";
+import { SbbFormAssociatedInputMixin as c } from "./core/mixins.js";
+import { i18nDateInvalid as l, i18nDateMax as u, i18nDateMin as d, i18nDatePickerPlaceholder as f } from "./core/i18n.js";
+import { readConfig as p } from "./core/config.js";
+import { defaultDateAdapter as m } from "./core/datetime.js";
+//#region src/elements/date-input/date-input.scss?inline
+var h = ":host{display:inline-flex;min-width:9.375rem;max-width:100%;cursor:text;align-items:center;font-weight:400}@media(forced-colors:active){:host{color:FieldText}}:host(:disabled){cursor:var(--sbb-cursor-default)}:host(:focus){text-overflow:initial!important}:host(:empty):after{content:attr(placeholder);color:var(--sbb-color-5);-webkit-text-fill-color:var(--sbb-color-5);opacity:1}@media(forced-colors:active){:host(:empty):after{color:GrayText}}";
+//#endregion
+//#region src/elements/date-input/date-input.component.ts
+Object.assign(ValidityState.prototype, { get sbbDateFilter() {
+	return !1;
+} });
+var g = (() => {
+	let g = c(a), _ = [], v, y, b = [], x = [], S, C = [], w = [], T, E, D = [], O = [];
+	return class extends g {
+		static {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(g[Symbol.metadata] ?? null) : void 0;
+			v = [i({ attribute: !1 })], y = [o(), i({
+				converter: s,
+				reflect: !0
+			})], S = [o(), i({
+				converter: s,
+				reflect: !0
+			})], T = [i({ attribute: !1 })], E = [i({ attribute: "weekday-style" })], e(this, null, v, {
+				kind: "setter",
+				name: "valueAsDate",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "valueAsDate" in e,
+					set: (e, t) => {
+						e.valueAsDate = t;
+					}
+				},
+				metadata: t
+			}, null, _), e(this, null, y, {
+				kind: "accessor",
+				name: "min",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "min" in e,
+					get: (e) => e.min,
+					set: (e, t) => {
+						e.min = t;
+					}
+				},
+				metadata: t
+			}, b, x), e(this, null, S, {
+				kind: "accessor",
+				name: "max",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "max" in e,
+					get: (e) => e.max,
+					set: (e, t) => {
+						e.max = t;
+					}
+				},
+				metadata: t
+			}, C, w), e(this, null, T, {
+				kind: "setter",
+				name: "dateFilter",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "dateFilter" in e,
+					set: (e, t) => {
+						e.dateFilter = t;
+					}
+				},
+				metadata: t
+			}, null, _), e(this, null, E, {
+				kind: "accessor",
+				name: "weekdayStyle",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "weekdayStyle" in e,
+					get: (e) => e.weekdayStyle,
+					set: (e, t) => {
+						e.weekdayStyle = t;
+					}
+				},
+				metadata: t
+			}, D, O), t && Object.defineProperty(this, Symbol.metadata, {
+				enumerable: !0,
+				configurable: !0,
+				writable: !0,
+				value: t
+			});
+		}
+		static {
+			this.elementName = "sbb-date-input";
+		}
+		static {
+			this.styles = r(h);
+		}
+		set value(e) {
+			this._tryParseValue(e), !n && !this.matches(":focus") && this.valueAsDate !== null && (e = this._formatDate()), super.value = e;
+		}
+		get value() {
+			return super.value ?? "";
+		}
+		set valueAsDate(e) {
+			if (e = this._dateAdapter.getValidDateOrNull(this._dateAdapter.deserialize(e)), !e) this._valueAsDate = null, this._valueCache = ["", null], this.value = "";
+			else if (!this._dateAdapter.isDateInstance(this._valueAsDate) || this._dateAdapter.compareDate(this._valueAsDate, e) !== 0) {
+				this._valueAsDate = this._dateAdapter.createDate(this._dateAdapter.getYear(e), this._dateAdapter.getMonth(e), this._dateAdapter.getDate(e));
+				let t = this._formatDate();
+				this._valueCache = [t, this._valueAsDate], this.value = t;
+			}
+		}
+		get valueAsDate() {
+			return this._valueAsDate ? this._dateAdapter.clone(this._valueAsDate) : null;
+		}
+		#e;
+		get min() {
+			return this.#e;
+		}
+		set min(e) {
+			this.#e = e;
+		}
+		#t;
+		get max() {
+			return this.#t;
+		}
+		set max(e) {
+			this.#t = e;
+		}
+		set dateFilter(e) {
+			this._dateFilter = e;
+		}
+		get dateFilter() {
+			return this._dateFilter;
+		}
+		#n;
+		get weekdayStyle() {
+			return this.#n;
+		}
+		set weekdayStyle(e) {
+			this.#n = e;
+		}
+		get datepicker() {
+			return this.parentElement.querySelector("sbb-datepicker");
+		}
+		constructor() {
+			super(), this._valueAsDate = t(this, _), this.#e = t(this, b, null), this.#t = (t(this, x), t(this, C, null)), this.#n = (t(this, w), t(this, D, "short")), this._valueCache = t(this, O), this._dateAdapter = p().datetime?.dateAdapter ?? m, this._placeholderMutable = !1, this._dateFilter = () => !0, this.addEventListener?.("change", () => this._updateValueDateFormat(), { capture: !0 });
+		}
+		static resolveAssociation(e) {
+			if (e.hasAttribute("input") || e.input) return;
+			let t = e.closest("sbb-form-field")?.querySelector("sbb-date-input");
+			t && (e.input = t);
+		}
+		connectedCallback() {
+			super.connectedCallback(), this.placeholder ||= (this._placeholderMutable = !0, f[this.language.current]);
+			for (let e of Array.from(this.closest("sbb-form-field")?.children ?? [])) customElements.upgrade?.(e), e.constructor.sbbDateInputAssociated && !e.hasAttribute("input") && !e.input && (e.input = this);
+		}
+		requestUpdate(e, t, n) {
+			super.requestUpdate(e, t, n), this.hasUpdated && !e ? (this._updateValueDateFormat(), this._placeholderMutable && (this.placeholder = f[this.language.current])) : e === "weekdayStyle" && this._updateValueDateFormat(), this.isConnected && this.dispatchEvent(new Event("ɵchange"));
+		}
+		updateFormValue() {
+			this._tryParseValue();
+			let e = this.valueAsDate === null ? null : this._dateAdapter.toIso8601(this.valueAsDate);
+			this.internals.setFormValue(e, this.value);
+		}
+		_tryParseValue(e = this.value) {
+			this._valueCache?.[0] !== e && (this._valueAsDate = this._dateAdapter.parse(e), this._valueCache = [e, this._valueAsDate]);
+		}
+		_updateValueDateFormat() {
+			if (this.valueAsDate) {
+				let e = this._formatDate();
+				this.value !== e && (super.value = e);
+			}
+		}
+		_formatDate() {
+			return this._dateAdapter.format(this.valueAsDate, { weekdayStyle: this.weekdayStyle });
+		}
+		shouldValidate(e) {
+			return super.shouldValidate(e) || [
+				"valueAsDate",
+				"min",
+				"max",
+				"dateFilter"
+			].includes(e);
+		}
+		validate() {
+			super.validate(), this.value ? this._dateAdapter.isValid(this.valueAsDate) ? this._dateAdapter.isValid(this.min) && this._dateAdapter.compareDate(this.min, this.valueAsDate) > 0 ? this.setValidityFlag("rangeUnderflow", d(this._dateAdapter.format(this.min, { weekdayStyle: "none" }))[this.language.current]) : this._dateAdapter.isValid(this.max) && this._dateAdapter.compareDate(this.valueAsDate, this.max) > 0 ? this.setValidityFlag("rangeOverflow", u(this._dateAdapter.format(this.max, { weekdayStyle: "none" }))[this.language.current]) : this.dateFilter && !this.dateFilter(this.valueAsDate) ? this.setValidityFlag("sbbDateFilter", l[this.language.current]) : this._removeValidityErrors() : this.setValidityFlag("badInput", l[this.language.current]) : this._removeValidityErrors();
+		}
+		_removeValidityErrors() {
+			[
+				"badInput",
+				"rangeUnderflow",
+				"rangeOverflow",
+				"sbbDateFilter"
+			].forEach((e) => this.removeValidityFlag(e));
+		}
+	};
+})();
+//#endregion
+export { g as t };

package/date-input.js

@@ -0,0 +1,6 @@
+import { t as e } from "./date-input.component-B3f_GThS.js";
+import "./date-input.pure.js";
+//#region src/elements/date-input.ts
+e.define();
+//#endregion
+export { e as SbbDateInputElement };

package/date-input.pure.js

@@ -0,0 +1,2 @@
+import { t as e } from "./date-input.component-B3f_GThS.js";
+export { e as SbbDateInputElement };

package/datepicker/common/datepicker-button.js

@@ -0,0 +1,2 @@
+import { n as e, r as t, t as n } from "../../datepicker-button-B91ISxhE.js";
+export { n as SbbDatepickerButton, e as SbbDatepickerButtonBase, t as datepickerButtonStyle };

package/datepicker/common.js

@@ -0,0 +1,5 @@
+import { n as e, r as t, t as n } from "../datepicker-button-B91ISxhE.js";
+//#region src/elements/datepicker/common.ts
+console.warn("The entrypoint '@sbb-esta/elements/datepicker/common.js' has been deprecated.\nUse either '@sbb-esta/elements/datepicker.js' or '@sbb-esta/elements/datepicker.pure.js' instead.");
+//#endregion
+export { n as SbbDatepickerButton, e as SbbDatepickerButtonBase, t as datepickerButtonStyle };

package/datepicker/datepicker/datepicker.component.js

@@ -0,0 +1,2 @@
+import { t as e } from "../../datepicker.component-DJ_9VBnC.js";
+export { e as SbbDatepickerElement };

package/datepicker/datepicker-next-day/datepicker-next-day.component.js

@@ -0,0 +1,29 @@
+import { boxSizingStyles as e } from "../../core/styles.js";
+import { miniButtonStyle as t } from "../../button.pure.js";
+import { i18nNextDay as n, i18nSelectNextDay as r } from "../../core/i18n.js";
+import { SbbDatepickerButton as i, datepickerButtonStyle as a } from "../common/datepicker-button.js";
+//#region src/elements/datepicker/datepicker-next-day/datepicker-next-day.component.ts
+var o = class extends i {
+	constructor() {
+		super(...arguments), this.iconName = "chevron-small-right-small", this.i18nOffBoundaryDay = n, this.i18nSelectOffBoundaryDay = r;
+	}
+	static {
+		this.elementName = "sbb-datepicker-next-day";
+	}
+	static {
+		this.styles = [
+			e,
+			t,
+			a
+		];
+	}
+	getFollowingDate(e) {
+		let t = this.dateAdapter.addCalendarDays(e, 1);
+		return this._isAfterMaxDate(t) ? null : t;
+	}
+	_isAfterMaxDate(e) {
+		return !!this.input.max && this.dateAdapter.compareDate(e, this.input.max) > 0;
+	}
+};
+//#endregion
+export { o as SbbDatepickerNextDayElement };

package/datepicker/datepicker-next-day.js

@@ -0,0 +1,4 @@
+import { SbbDatepickerNextDayElement as e } from "./datepicker-next-day/datepicker-next-day.component.js";
+e.define(), console.warn("The entrypoint '@sbb-esta/elements/datepicker/datepicker-next-day.js' has been deprecated.\nUse either '@sbb-esta/elements/datepicker.js' or '@sbb-esta/elements/datepicker.pure.js' instead.");
+//#endregion
+export { e as SbbDatepickerNextDayElement };

package/datepicker/datepicker-previous-day/datepicker-previous-day.component.js

@@ -0,0 +1,29 @@
+import { boxSizingStyles as e } from "../../core/styles.js";
+import { miniButtonStyle as t } from "../../button.pure.js";
+import { i18nPreviousDay as n, i18nSelectPreviousDay as r } from "../../core/i18n.js";
+import { SbbDatepickerButton as i, datepickerButtonStyle as a } from "../common/datepicker-button.js";
+//#region src/elements/datepicker/datepicker-previous-day/datepicker-previous-day.component.ts
+var o = class extends i {
+	constructor() {
+		super(...arguments), this.iconName = "chevron-small-left-small", this.i18nOffBoundaryDay = n, this.i18nSelectOffBoundaryDay = r;
+	}
+	static {
+		this.elementName = "sbb-datepicker-previous-day";
+	}
+	static {
+		this.styles = [
+			e,
+			t,
+			a
+		];
+	}
+	getFollowingDate(e) {
+		let t = this.dateAdapter.addCalendarDays(e, -1);
+		return this._isBeforeMinDate(t) ? null : t;
+	}
+	_isBeforeMinDate(e) {
+		return !!this.input.min && this.dateAdapter.compareDate(e, this.input.min) < 0;
+	}
+};
+//#endregion
+export { o as SbbDatepickerPreviousDayElement };

package/datepicker/datepicker-previous-day.js

@@ -0,0 +1,4 @@
+import { SbbDatepickerPreviousDayElement as e } from "./datepicker-previous-day/datepicker-previous-day.component.js";
+e.define(), console.warn("The entrypoint '@sbb-esta/elements/datepicker/datepicker-previous-day.js' has been deprecated.\nUse either '@sbb-esta/elements/datepicker.js' or '@sbb-esta/elements/datepicker.pure.js' instead.");
+//#endregion
+export { e as SbbDatepickerPreviousDayElement };

package/datepicker/datepicker-toggle/datepicker-toggle.component.js

@@ -0,0 +1,67 @@
+import { __esDecorate as e, __runInitializers as t } from "tslib";
+import { property as n } from "lit/decorators.js";
+import { idReference as r } from "../../core/decorators.js";
+import { boxSizingStyles as i } from "../../core/styles.js";
+import { miniButtonStyle as a } from "../../button.pure.js";
+import { i18nShowCalendar as o } from "../../core/i18n.js";
+import { SbbDatepickerButtonBase as s, datepickerButtonStyle as c } from "../common/datepicker-button.js";
+//#region src/elements/datepicker/datepicker-toggle/datepicker-toggle.component.ts
+var l = (() => {
+	let l = s, u, d = [], f = [];
+	return class extends l {
+		static {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(l[Symbol.metadata] ?? null) : void 0;
+			u = [r(), n()], e(this, null, u, {
+				kind: "accessor",
+				name: "datepicker",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "datepicker" in e,
+					get: (e) => e.datepicker,
+					set: (e, t) => {
+						e.datepicker = t;
+					}
+				},
+				metadata: t
+			}, d, f), t && Object.defineProperty(this, Symbol.metadata, {
+				enumerable: !0,
+				configurable: !0,
+				writable: !0,
+				value: t
+			});
+		}
+		static {
+			this.elementName = "sbb-datepicker-toggle";
+		}
+		static {
+			this.styles = [
+				i,
+				a,
+				c
+			];
+		}
+		#e;
+		get datepicker() {
+			return this.#e;
+		}
+		set datepicker(e) {
+			this.#e = e;
+		}
+		constructor() {
+			super(), this.iconName = "calendar-small", this.#e = t(this, d, null), t(this, f), this.addEventListener?.("click", () => {
+				this.datepicker?.isOpen || this.datepicker?.open();
+			});
+		}
+		connectedCallback() {
+			super.connectedCallback(), this.internals.ariaLabel = o[this.language.current];
+			let e = this.closest?.("sbb-form-field");
+			e && !this.hasAttribute("datepicker") && (this.datepicker ??= e.querySelector("sbb-datepicker"));
+		}
+		requestUpdate(e, t, n) {
+			super.requestUpdate(e, t, n), e === "datepicker" && this.datepicker && this.datepicker.trigger !== this ? this.datepicker.trigger = this : !e && this.hasUpdated && (this.internals.ariaLabel = o[this.language.current]);
+		}
+	};
+})();
+//#endregion
+export { l as SbbDatepickerToggleElement };

package/datepicker/datepicker-toggle.js

@@ -0,0 +1,4 @@
+import { SbbDatepickerToggleElement as e } from "./datepicker-toggle/datepicker-toggle.component.js";
+e.define(), console.warn("The entrypoint '@sbb-esta/elements/datepicker/datepicker-toggle.js' has been deprecated.\nUse either '@sbb-esta/elements/datepicker.js' or '@sbb-esta/elements/datepicker.pure.js' instead.");
+//#endregion
+export { e as SbbDatepickerToggleElement };

package/datepicker/datepicker.js

@@ -0,0 +1,4 @@
+import { t as e } from "../datepicker.component-DJ_9VBnC.js";
+e.define(), console.warn("The entrypoint '@sbb-esta/elements/datepicker/datepicker.js' has been deprecated.\nUse either '@sbb-esta/elements/datepicker.js' or '@sbb-esta/elements/datepicker.pure.js' instead.");
+//#endregion
+export { e as SbbDatepickerElement };

package/datepicker-button-B91ISxhE.js

@@ -0,0 +1,110 @@
+import { __esDecorate as e, __runInitializers as t } from "tslib";
+import { html as n, unsafeCSS as r } from "lit";
+import { property as i } from "lit/decorators.js";
+import { SbbButtonBaseElement as a } from "./core/base-elements.js";
+import { idReference as o } from "./core/decorators.js";
+import { SbbNegativeMixin as s } from "./core/mixins.js";
+import { SbbLanguageController as c } from "./core/controllers.js";
+import { i18nToday as l } from "./core/i18n.js";
+import "./icon.js";
+import { readConfig as u } from "./core/config.js";
+import { defaultDateAdapter as d } from "./core/datetime.js";
+import { SbbDateInputElement as f } from "./date-input.js";
+//#endregion
+//#region src/elements/datepicker/common/datepicker-button.ts
+var p = r(".sbb-action-base{margin:auto;-webkit-tap-highlight-color:transparent}"), m = (() => {
+	let r = s(a), l, p = [], m = [];
+	return class extends r {
+		constructor() {
+			super(...arguments), this.#e = t(this, p, null), this._inputDisabled = (t(this, m), !0), this.dateAdapter = u().datetime?.dateAdapter ?? d, this.language = new c(this);
+		}
+		static {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(r[Symbol.metadata] ?? null) : void 0;
+			l = [o(), i()], e(this, null, l, {
+				kind: "accessor",
+				name: "input",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "input" in e,
+					get: (e) => e.input,
+					set: (e, t) => {
+						e.input = t;
+					}
+				},
+				metadata: t
+			}, p, m), t && Object.defineProperty(this, Symbol.metadata, {
+				enumerable: !0,
+				configurable: !0,
+				writable: !0,
+				value: t
+			});
+		}
+		static {
+			this.sbbDateInputAssociated = !0;
+		}
+		#e;
+		get input() {
+			return this.#e;
+		}
+		set input(e) {
+			this.#e = e;
+		}
+		get disabled() {
+			return !!this._inputDisabled;
+		}
+		connectedCallback() {
+			super.connectedCallback(), this.toggleAttribute("disabled", this.disabled);
+			let e = this.closest?.("sbb-form-field");
+			e && (customElements.upgrade?.(e), this.negative = e.negative, f.resolveAssociation(this), this.slot ||= this._findSlotPosition());
+		}
+		requestUpdate(e, t, n) {
+			super.requestUpdate(e, t, n), e === "input" && this.input !== t ? (this._inputAbortController?.abort(), this._inputDisabled = !0, this.input && (this._inputAbortController = new AbortController(), this.slot = this._findSlotPosition(), customElements.upgrade?.(this.input), this._sync(), this.input.addEventListener("ɵchange", () => this._sync())), this.hasUpdated && this.toggleAttribute("disabled", this.disabled)) : !e && this.hasUpdated && this.input && this._sync();
+		}
+		_findSlotPosition() {
+			return !this.input || this.compareDocumentPosition(this.input) & Node.DOCUMENT_POSITION_FOLLOWING ? "prefix" : "suffix";
+		}
+		_sync() {
+			this.syncDateInputState(), this.toggleAttribute("disabled", this.disabled), this.disabled ? this.removeAttribute("tabindex") : this.setAttribute("tabindex", "0");
+		}
+		syncDateInputState() {
+			this._inputDisabled = this.input.disabled || this.input.readOnly;
+		}
+		renderTemplate() {
+			return n`<sbb-icon name=${this.iconName}></sbb-icon>`;
+		}
+	};
+})(), h = class extends m {
+	get disabled() {
+		return this._disabled || super.disabled;
+	}
+	constructor() {
+		super(), this._disabled = !0, this.addEventListener?.("click", () => this._handleClick());
+	}
+	findAvailableDate(e) {
+		return this.getFollowingDate(e);
+	}
+	_handleClick() {
+		if (!this.input || this.disabled) return;
+		let e = this.input.valueAsDate ?? this.dateAdapter.today(), t = this.getFollowingDate(e);
+		this.dateAdapter.isValid(t) && this.dateAdapter.compareDate(t, e) !== 0 && (this.input.valueAsDate = t, this.input.dispatchEvent(new InputEvent("input", {
+			bubbles: !0,
+			composed: !0
+		})), this.input.dispatchEvent(new Event("change", {
+			bubbles: !0,
+			composed: !0
+		})), this.input.dispatchEvent(new Event("blur", { composed: !0 })));
+	}
+	syncDateInputState() {
+		if (super.syncDateInputState(), !this.dateAdapter.isValid(this.input.valueAsDate)) {
+			this._disabled = !0, this.internals.ariaLabel = this.i18nOffBoundaryDay[this.language.current];
+			return;
+		}
+		let e = this.getFollowingDate(this.input.valueAsDate);
+		this._disabled = !this.dateAdapter.isValid(e) || this.dateAdapter.compareDate(e, this.input.valueAsDate) === 0;
+		let t = this.dateAdapter.compareDate(this.dateAdapter.today(), this.input.valueAsDate) === 0 ? l[this.language.current].toLowerCase() : this.dateAdapter.getAccessibilityFormatDate(this.input.valueAsDate);
+		this.internals.ariaLabel = this.i18nSelectOffBoundaryDay(t)[this.language.current];
+	}
+};
+//#endregion
+export { m as n, p as r, h as t };

package/datepicker.component-DJ_9VBnC.js

@@ -0,0 +1,156 @@
+import { __esDecorate as e, __runInitializers as t } from "tslib";
+import { html as n, isServer as r, nothing as i, unsafeCSS as a } from "lit";
+import { property as o } from "lit/decorators.js";
+import { forceType as s, idReference as c } from "./core/decorators.js";
+import { SbbUpdateSchedulerMixin as l } from "./core/mixins.js";
+import { SbbLanguageController as u } from "./core/controllers.js";
+import { i18nDateChangedTo as d } from "./core/i18n.js";
+import { readConfig as f } from "./core/config.js";
+import { defaultDateAdapter as p } from "./core/datetime.js";
+import { SbbDateInputElement as m } from "./date-input.js";
+import { SbbPopoverBaseElement as h } from "./popover.js";
+import "./calendar.js";
+//#region src/elements/datepicker/datepicker/datepicker.scss?inline
+var g = "#status-container{border:0;clip-path:rect(0 0 0 0);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;white-space:nowrap;width:1px}", _ = 0, v = (() => {
+	let v = l(h), y, b = [], x = [], S, C = [], w = [], T, E = [], D = [];
+	return class extends v {
+		static {
+			let t = typeof Symbol == "function" && Symbol.metadata ? Object.create(v[Symbol.metadata] ?? null) : void 0;
+			y = [s(), o({ type: Boolean })], S = [c(), o()], T = [o()], e(this, null, y, {
+				kind: "accessor",
+				name: "wide",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "wide" in e,
+					get: (e) => e.wide,
+					set: (e, t) => {
+						e.wide = t;
+					}
+				},
+				metadata: t
+			}, b, x), e(this, null, S, {
+				kind: "accessor",
+				name: "input",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "input" in e,
+					get: (e) => e.input,
+					set: (e, t) => {
+						e.input = t;
+					}
+				},
+				metadata: t
+			}, C, w), e(this, null, T, {
+				kind: "accessor",
+				name: "view",
+				static: !1,
+				private: !1,
+				access: {
+					has: (e) => "view" in e,
+					get: (e) => e.view,
+					set: (e, t) => {
+						e.view = t;
+					}
+				},
+				metadata: t
+			}, E, D), t && Object.defineProperty(this, Symbol.metadata, {
+				enumerable: !0,
+				configurable: !0,
+				writable: !0,
+				value: t
+			});
+		}
+		static {
+			this.elementName = "sbb-datepicker";
+		}
+		static {
+			this.styles = [h.styles, a(g)];
+		}
+		static {
+			this.sbbDateInputAssociated = !0;
+		}
+		#e;
+		get wide() {
+			return this.#e;
+		}
+		set wide(e) {
+			this.#e = e;
+		}
+		#t;
+		get input() {
+			return this.#t;
+		}
+		set input(e) {
+			this.#t = e;
+		}
+		#n;
+		get view() {
+			return this.#n;
+		}
+		set view(e) {
+			this.#n = e;
+		}
+		constructor() {
+			super(), this.#e = t(this, b, !1), this.#t = (t(this, x), t(this, C, null)), this.#n = (t(this, w), t(this, E, "day")), this._inputAbortController = t(this, D), this._dateAdapter = f().datetime?.dateAdapter ?? p, this._language = new u(this), this._ready = !1, this.startUpdate(), this.addEventListener(h.events.beforeopen, () => {
+				this.shadowRoot?.querySelector("sbb-calendar")?.resetPosition?.();
+			}), !r && this.hydrationRequired && this.hydrationComplete.then(() => this.requestUpdate());
+		}
+		connectedCallback() {
+			this.id ||= `sbb-datepicker-${++_}`, super.connectedCallback();
+			let e = this.closest?.("sbb-form-field");
+			if (e) {
+				m.resolveAssociation(this);
+				let t = e.querySelector("sbb-datepicker-toggle");
+				t && !t.hasAttribute("datepicker") && (t.datepicker ??= this);
+			}
+		}
+		requestUpdate(e, t, n) {
+			if (super.requestUpdate(e, t, n), e === "input" && this.input !== t && (this._inputAbortController?.abort(), this.input)) {
+				let { signal: e } = this._inputAbortController = new AbortController();
+				this.input?.addEventListener("ɵchange", () => {
+					super.requestUpdate(), this._updateStatus();
+				}, { signal: e });
+			}
+		}
+		firstUpdated(e) {
+			super.firstUpdated(e), setTimeout(() => {
+				this._ready = !0, this.requestUpdate(), this.completeUpdate();
+			});
+		}
+		_updateStatus() {
+			let e = this.shadowRoot?.getElementById("status-container");
+			if (!e) return;
+			let t = this._dateAdapter.isValid(this.input?.valueAsDate) ? `${d[this._language.current]} ${this._dateAdapter.format(this.input.valueAsDate, { weekdayStyle: "long" })}` : "";
+			e.textContent !== t && (e.textContent = t);
+		}
+		renderContent() {
+			return n`
+      <p id="status-container" role="status"></p>
+      <sbb-calendar
+        .view=${this.view}
+        .min=${this.input?.min ?? null}
+        .max=${this.input?.max ?? null}
+        .dateFilter=${this.input?.dateFilter ?? null}
+        .selected=${this.input?.valueAsDate ?? null}
+        ?wide=${this.wide}
+        @dateselected=${(e) => {
+				this.input && (this.input.valueAsDate = e.detail, this.input.dispatchEvent(new InputEvent("input", {
+					bubbles: !0,
+					composed: !0
+				})), this.input.dispatchEvent(new Event("change", {
+					bubbles: !0,
+					composed: !0
+				})), this.input.dispatchEvent(new Event("blur", { composed: !0 })), this.close());
+			}}
+      ></sbb-calendar>
+    `;
+		}
+		render() {
+			return r || this.hydrationRequired || !this._ready ? n`${i}` : super.render();
+		}
+	};
+})();
+//#endregion
+export { v as t };

package/datepicker.js

@@ -0,0 +1,9 @@
+import { n as e, r as t, t as n } from "./datepicker-button-B91ISxhE.js";
+import { SbbDatepickerNextDayElement as r } from "./datepicker/datepicker-next-day/datepicker-next-day.component.js";
+import { SbbDatepickerPreviousDayElement as i } from "./datepicker/datepicker-previous-day/datepicker-previous-day.component.js";
+import { SbbDatepickerToggleElement as a } from "./datepicker/datepicker-toggle/datepicker-toggle.component.js";
+import { t as o } from "./datepicker.component-DJ_9VBnC.js";
+import "./datepicker.pure.js";
+o.define(), r.define(), i.define(), a.define();
+//#endregion
+export { n as SbbDatepickerButton, e as SbbDatepickerButtonBase, o as SbbDatepickerElement, r as SbbDatepickerNextDayElement, i as SbbDatepickerPreviousDayElement, a as SbbDatepickerToggleElement, t as datepickerButtonStyle };

package/datepicker.pure.js

@@ -0,0 +1,6 @@
+import { n as e, r as t, t as n } from "./datepicker-button-B91ISxhE.js";
+import { SbbDatepickerNextDayElement as r } from "./datepicker/datepicker-next-day/datepicker-next-day.component.js";
+import { SbbDatepickerPreviousDayElement as i } from "./datepicker/datepicker-previous-day/datepicker-previous-day.component.js";
+import { SbbDatepickerToggleElement as a } from "./datepicker/datepicker-toggle/datepicker-toggle.component.js";
+import { t as o } from "./datepicker.component-DJ_9VBnC.js";
+export { n as SbbDatepickerButton, e as SbbDatepickerButtonBase, o as SbbDatepickerElement, r as SbbDatepickerNextDayElement, i as SbbDatepickerPreviousDayElement, a as SbbDatepickerToggleElement, t as datepickerButtonStyle };