purity-world-ui 1.0.1

package/index.js

@@ -0,0 +1,1939 @@
+import { BaseDirective as e, BasePipe as t, BaseValidator as n, Component as r, Directive as i, Injectable as a, Pipe as o, Validator as s, ViewChild as c, effect as l, getElement as u, inject as d, signal as f, startLoadingCursor as p, stopLoadingCursor as m } from "purity-world/core";
+//#region src/app/shared/directives/dropdown/dropdown.directive.ts
+var h = class extends e {
+	isOpen = !1;
+	triggerEl = null;
+	labelEl = null;
+	bodyEl = null;
+	boundDocClick;
+	boundKeydown;
+	boundTriggerClick;
+	boundBodyClick;
+	boundResize;
+	boundScroll;
+	isCustomTrigger = !1;
+	openedAt = 0;
+	onInit() {
+		let e = this.element;
+		!e || e.hasAttribute("data-dropdown-ready") || (e.setAttribute("data-dropdown-ready", "true"), e.classList.add("p-dropdown"), this.setupDOM(), this.bindEvents());
+	}
+	onChanges(e) {
+		e != null && !this.isCustomTrigger && this.labelEl && (this.labelEl.textContent = String(e));
+	}
+	onDOMChange(e) {
+		if (this.element && e instanceof MutationRecord) {
+			if (e.attributeName === "label" || e.attributeName === "placeholder") {
+				let e = this.element.getAttribute("label") || this.element.getAttribute("placeholder");
+				e && this.labelEl && !this.isCustomTrigger && (this.labelEl.textContent = e);
+			} else if (e.attributeName === "disabled") {
+				let e = this.element.hasAttribute("disabled") && this.element.getAttribute("disabled") !== "false";
+				this.triggerEl && (e ? this.triggerEl.setAttribute("disabled", "") : this.triggerEl.removeAttribute("disabled"));
+			} else e.attributeName === "align" && this.isOpen && this.updatePosition();
+		}
+	}
+	open() {
+		this.isOpen || this.isDisabled() || this.bodyEl && (this.bodyEl.parentElement !== document.body && document.body.appendChild(this.bodyEl), this.openedAt = Date.now(), this.isOpen = !0, this.element.classList.add("dropdown-open", "p-dropdown--open"), this.triggerEl && this.triggerEl.setAttribute("aria-expanded", "true"), this.bodyEl.classList.add("is-open"), this.updatePosition());
+	}
+	close() {
+		this.isOpen && (this.isOpen = !1, this.element.classList.remove("dropdown-open", "p-dropdown--open"), this.triggerEl && this.triggerEl.setAttribute("aria-expanded", "false"), this.bodyEl && this.bodyEl.classList.remove("is-open"));
+	}
+	toggle() {
+		this.isOpen ? this.close() : this.open();
+	}
+	setLabel(e) {
+		this.labelEl && (this.labelEl.textContent = e);
+	}
+	updatePosition() {
+		if (!this.triggerEl || !this.bodyEl) return;
+		let e = this.triggerEl.getBoundingClientRect(), t = this.bodyEl.getBoundingClientRect(), n = window.innerHeight, r = window.innerWidth, i = t.height || 220, a = t.width || e.width || 180, o = n - e.bottom, s = e.top, c = this.element.getAttribute("placement"), l = !1;
+		c === "top" ? l = !0 : c === "bottom" ? l = !1 : o < 220 && s > o && (l = !0), this.bodyEl.classList.toggle("placement-top", l), this.bodyEl.classList.toggle("placement-bottom", !l);
+		let u = l ? e.top - i - 6 : e.bottom + 6, d = e.left;
+		(this.element.getAttribute("align") === "right" || d + a > r - 10) && (d = Math.max(10, e.right - a)), u < 10 && (u = 10), u + i > n - 10 && (u = Math.max(10, n - i - 10)), d < 10 && (d = 10);
+		let f = Math.max(e.width, 160);
+		this.bodyEl.style.minWidth = `${f}px`, this.bodyEl.style.top = `${Math.round(u)}px`, this.bodyEl.style.left = `${Math.round(d)}px`;
+	}
+	onDestroy() {
+		this.boundDocClick && document.removeEventListener("pointerdown", this.boundDocClick), this.boundKeydown && window.removeEventListener("keydown", this.boundKeydown), this.boundResize && window.removeEventListener("resize", this.boundResize), this.boundScroll && window.removeEventListener("scroll", this.boundScroll, !0), this.triggerEl && this.boundTriggerClick && this.triggerEl.removeEventListener("click", this.boundTriggerClick), this.bodyEl && this.boundBodyClick && this.bodyEl.removeEventListener("click", this.boundBodyClick), this.bodyEl && this.bodyEl.parentElement && (this.bodyEl.parentElement.removeChild(this.bodyEl), this.bodyEl = null);
+	}
+	setupDOM() {
+		let e = this.element, t = Array.from(e.childNodes), n = null;
+		for (let e of t) if (e instanceof HTMLElement && (e.getAttribute("slot") === "trigger" || e.classList.contains("dropdown-trigger"))) {
+			n = e;
+			break;
+		}
+		if (n) this.isCustomTrigger = !0, this.triggerEl = n;
+		else {
+			this.isCustomTrigger = !1;
+			let t = e.getAttribute("label") || e.getAttribute("placeholder") || "Select option", n = document.createElement("button");
+			n.type = "button", n.className = "dropdown-trigger", n.setAttribute("aria-haspopup", "true"), n.setAttribute("aria-expanded", "false"), this.isDisabled() && n.setAttribute("disabled", "");
+			let r = document.createElement("span");
+			r.className = "dropdown-label", r.textContent = t;
+			let i = document.createElement("span");
+			i.className = "dropdown-chevron", i.innerHTML = "<svg width=\"14\" height=\"14\" viewBox=\"0 0 24 24\" fill=\"none\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"><polyline points=\"6 9 12 15 18 9\"></polyline></svg>", n.appendChild(r), n.appendChild(i), this.triggerEl = n, this.labelEl = r;
+		}
+		let r = document.createElement("div");
+		r.className = "dropdown-body p-dropdown-body", r.setAttribute("role", "menu"), r.setAttribute("tabindex", "-1");
+		for (let e of t) e !== n && r.appendChild(e);
+		e.innerHTML = "", this.triggerEl && e.appendChild(this.triggerEl), document.body.appendChild(r), this.bodyEl = r;
+	}
+	bindEvents() {
+		let e = this.element;
+		this.boundTriggerClick = (e) => {
+			e.preventDefault(), e.stopPropagation(), this.toggle();
+		}, this.triggerEl?.addEventListener("click", this.boundTriggerClick), this.boundBodyClick = (t) => {
+			let n = t.target;
+			if (!n) return;
+			let r = n.closest("li, a, button, .dropdown-item");
+			if (!r || !this.bodyEl?.contains(r) || r.hasAttribute("disabled") || r.classList.contains("disabled") || r.getAttribute("aria-disabled") === "true") return;
+			let i = r.textContent?.trim() || "", a = r.getAttribute("data-value") ?? r.getAttribute("value") ?? i;
+			e.getAttribute("auto-label") !== "false" && !this.isCustomTrigger && this.labelEl && i && (this.labelEl.textContent = i), this.bodyEl.querySelectorAll("li, a, button, .dropdown-item").forEach((e) => {
+				e.classList.remove("is-selected", "active");
+			}), r.classList.add("is-selected");
+			let o = {
+				item: r,
+				value: a,
+				label: i
+			};
+			e.dispatchEvent(new CustomEvent("change", {
+				bubbles: !0,
+				composed: !0,
+				detail: o
+			})), e.dispatchEvent(new CustomEvent("select", {
+				bubbles: !0,
+				composed: !0,
+				detail: o
+			})), e.getAttribute("keep-open") === "true" || r.hasAttribute("data-keep-open") || this.close();
+		}, this.bodyEl?.addEventListener("click", this.boundBodyClick), this.boundDocClick = (t) => {
+			if (!this.isOpen || Date.now() - this.openedAt < 100) return;
+			let n = t.composedPath ? t.composedPath() : [], r = t.target;
+			e && (n.includes(e) || r && e.contains(r)) || this.bodyEl && (n.includes(this.bodyEl) || r && this.bodyEl.contains(r)) || this.close();
+		}, document.addEventListener("pointerdown", this.boundDocClick), this.boundResize = () => {
+			this.isOpen && this.updatePosition();
+		}, this.boundScroll = () => {
+			this.isOpen && this.updatePosition();
+		}, window.addEventListener("resize", this.boundResize), window.addEventListener("scroll", this.boundScroll, !0), this.boundKeydown = (e) => {
+			if (!this.isOpen) {
+				(e.key === "Enter" || e.key === " " || e.key === "ArrowDown") && document.activeElement === this.triggerEl && (e.preventDefault(), this.open());
+				return;
+			}
+			e.key === "Escape" ? (e.preventDefault(), this.close(), this.triggerEl?.focus()) : (e.key === "ArrowDown" || e.key === "ArrowUp") && (e.preventDefault(), this.navigateItems(e.key === "ArrowDown" ? 1 : -1));
+		}, e.addEventListener("keydown", this.boundKeydown);
+	}
+	navigateItems(e) {
+		if (!this.bodyEl) return;
+		let t = Array.from(this.bodyEl.querySelectorAll("li, a, button, .dropdown-item:not(.disabled):not([disabled])"));
+		if (t.length === 0) return;
+		let n = t.findIndex((e) => e === document.activeElement || e.contains(document.activeElement)) + e;
+		n < 0 && (n = t.length - 1), n >= t.length && (n = 0), t[n]?.focus();
+	}
+	isDisabled() {
+		return this.element.hasAttribute("disabled") && this.element.getAttribute("disabled") !== "false";
+	}
+};
+i("dropdown")(h);
+//#endregion
+//#region src/app/shared/directives/highlight/highlight.directive.ts
+var g = class extends e {
+	currentModifierClass = "";
+	onInit() {
+		this.element.classList.add("p-highlight"), this.applyHighlightClass(this.value || "blue");
+	}
+	onChanges(e) {
+		this.applyHighlightClass(e);
+	}
+	onDOMChange(e) {
+		if ("attributeName" in e || typeof MutationRecord < "u" && e instanceof MutationRecord) {
+			let t = e.attributeName;
+			if (t === "highlight" || t === "[highlight]") {
+				let e = this.element.getAttribute("highlight") || this.element.getAttribute("[highlight]");
+				e && e !== this.value && this.onChanges(e);
+			}
+		} else if (e instanceof Event && e.type === "input") {
+			let e = this.element;
+			e.value && e.value.length > 5 ? this.element.classList.add("p-highlight--valid") : this.element.classList.remove("p-highlight--valid");
+		}
+	}
+	onDestroy() {
+		this.element.classList.remove("p-highlight", "p-highlight--valid"), this.currentModifierClass && this.element.classList.remove(this.currentModifierClass);
+	}
+	applyHighlightClass(e) {
+		if (this.currentModifierClass &&= (this.element.classList.remove(this.currentModifierClass), ""), e) {
+			let t = e.replace(/^#|rgba?.*$/, "").trim().toLowerCase(), n = t.startsWith("p-highlight--") ? t : `p-highlight--${t || "blue"}`;
+			this.currentModifierClass = n, this.element.classList.add(n);
+		}
+	}
+};
+i("highlight")(g);
+//#endregion
+//#region src/app/shared/components/switch-button/switch-button.component.html?raw
+var _ = "<div class=\"switch-container {{isOn() ? 'is-on' : 'is-off'}} {{disabled() ? 'is-disabled' : ''}}\">\n    <div class=\"switch-track\" aria-hidden=\"true\">\n        <div class=\"switch-thumb\"></div>\n    </div>\n    <span class=\"switch-label\">\n        <slot></slot>\n    </span>\n</div>\n", v = class {
+	isOn = f(!1);
+	checked = this.isOn;
+	disabled = f(!1);
+	handleClick = (e) => {
+		this.disabled() || e.target?.closest("a, button, input, textarea, select") || this.toggle();
+	};
+	handleKeydown = (e) => {
+		this.disabled() || (e.key === " " || e.key === "Enter") && (e.preventDefault(), this.toggle());
+	};
+	onInit() {
+		let e = this;
+		if (e && typeof e.getAttribute == "function") {
+			let t = e.getAttribute("checked"), n = e.getAttribute("is-on");
+			(t !== null && t !== "false" && t !== "null" && t !== "0" || n !== null && n !== "false" && n !== "null" && n !== "0") && this.isOn.set(!0);
+			let r = e.getAttribute("disabled");
+			r !== null && r !== "false" && r !== "null" && r !== "0" && this.disabled.set(!0), e.hasAttribute("role") || e.setAttribute("role", "switch"), e.hasAttribute("tabindex") || e.setAttribute("tabindex", this.disabled() ? "-1" : "0"), e.addEventListener("click", this.handleClick), e.addEventListener("keydown", this.handleKeydown);
+		}
+		l(() => {
+			let e = this.isOn(), t = this;
+			t && t.classList && (t.classList.toggle("is-on", e), t.classList.toggle("is-checked", e), t.setAttribute("aria-checked", String(e)));
+		}), l(() => {
+			let e = this.disabled(), t = this;
+			t && t.classList && (t.classList.toggle("is-disabled", e), e ? (t.setAttribute("aria-disabled", "true"), t.setAttribute("tabindex", "-1")) : (t.removeAttribute("aria-disabled"), t.setAttribute("tabindex", "0")));
+		});
+	}
+	onDestroy() {
+		let e = this;
+		e && typeof e.removeEventListener == "function" && (e.removeEventListener("click", this.handleClick), e.removeEventListener("keydown", this.handleKeydown));
+	}
+	switchOn() {
+		this.disabled() || this.isOn() || (this.isOn.set(!0), this.dispatchChangeEvent());
+	}
+	switchOff() {
+		this.disabled() || this.isOn() && (this.isOn.set(!1), this.dispatchChangeEvent());
+	}
+	toggle() {
+		if (this.disabled()) return;
+		let e = !this.isOn();
+		this.isOn.set(e), this.dispatchChangeEvent();
+	}
+	dispatchChangeEvent() {
+		let e = this;
+		e && typeof e.dispatchEvent == "function" && e.dispatchEvent(new CustomEvent("change", {
+			detail: {
+				checked: this.isOn(),
+				isOn: this.isOn()
+			},
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+};
+r({
+	selector: "switch-button",
+	templateUrl: "./switch-button.component.html",
+	template: _
+})(v);
+//#endregion
+//#region src/app/shared/components/modal/modal-view.component.html?raw
+var y = "<div\n    class=\"modal-backdrop {{isOpen() ? 'is-open' : 'is-closed'}} {{isMaximized() ? 'is-maximized' : ''}}\"\n    onclick=\"onBackdropClick(event)\"\n>\n    <div class=\"modal-dialog window\" onclick=\"event.stopPropagation()\">\n        <div class=\"modal-header\">\n            <div class=\"modal-title-area\">\n                <span class=\"modal-icon\">🪟</span>\n                <h3 class=\"modal-title\">{{title()}}</h3>\n            </div>\n            <div class=\"modal-controls\">\n                <button\n                    type=\"button\"\n                    class=\"modal-control-btn maximize-btn\"\n                    title=\"{{isMaximized() ? 'Restore' : 'Maximize'}}\"\n                    onclick=\"maximize()\"\n                >\n                    {{isMaximized() ? '🗗' : '🗖'}}\n                </button>\n                <button\n                    type=\"button\"\n                    class=\"modal-control-btn close-btn\"\n                    title=\"Close\"\n                    onclick=\"close()\"\n                >\n                    ✕\n                </button>\n            </div>\n        </div>\n\n        <div class=\"modal-body\">\n            <div class=\"modal-content-area\">\n                <slot>\n                    <p>Welcome to the <strong>Purity Modal Dialog Component</strong>.</p>\n                    <p>\n                        This modal is managed reactively via Purity signals with fixed viewport overlay and <code>z-index: 1000</code>.\n                    </p>\n                    <div class=\"modal-info-card\">\n                        <div><strong>Status:</strong> <span class=\"status-pill is-active\">Active</span></div>\n                        <div><strong>Maximized:</strong> {{isMaximized() ? 'Yes' : 'No'}}</div>\n                    </div>\n                </slot>\n            </div>\n        </div>\n\n        <div class=\"modal-footer\">\n            <button type=\"button\" class=\"button-cancel\" onclick=\"close()\">\n                Cancel\n            </button>\n            <button type=\"button\" class=\"button-primary\" onclick=\"close()\">\n                Done\n            </button>\n        </div>\n    </div>\n</div>\n", b = class {
+	isOpen = f(!1);
+	isMaximized = f(!1);
+	title = f("Purity Modal Dialog");
+	_hostEl;
+	_backdropEl;
+	keydownHandler = (e) => {
+		e.key === "Escape" && this.isOpen() && this.close();
+	};
+	onInit() {
+		window.addEventListener("keydown", this.keydownHandler);
+		let e = this;
+		if (this._hostEl = e, e && typeof e.getAttribute == "function") {
+			let t = e.getAttribute("title");
+			t && this.title.set(t);
+			let n = e.getAttribute("is-open") || e.getAttribute("open");
+			n !== null && n !== "false" && n !== "null" && n !== "0" && this.isOpen.set(!0);
+		}
+		let t = e.querySelector(".modal-backdrop");
+		t && t.parentElement !== document.body && (this._backdropEl = t, document.body.appendChild(t));
+	}
+	onDestroy() {
+		window.removeEventListener("keydown", this.keydownHandler), this._backdropEl && this._backdropEl.parentElement === document.body && this._backdropEl.remove();
+	}
+	disconnectedCallback() {
+		this.onDestroy();
+	}
+	open(e) {
+		e?.title && this.title.set(e.title);
+		let t = this._hostEl || this, n = this._backdropEl || t?.querySelector?.(".modal-backdrop");
+		n && n.parentElement !== document.body && (this._backdropEl = n, document.body.appendChild(n)), this.isOpen.set(!0);
+	}
+	close() {
+		this.isOpen.set(!1);
+	}
+	maximize() {
+		this.isMaximized.update((e) => !e);
+	}
+	onBackdropClick(e) {
+		e.target === e.currentTarget && this.close();
+	}
+};
+r({
+	selector: "modal-view",
+	templateUrl: "./src/app/shared/components/modal/modal-view.component.html",
+	template: y
+})(b);
+//#endregion
+//#region src/app/shared/components/date-time-picker/date-time-picker.component.html?raw
+var x = "<div class=\"date-time-picker-container\">\n    <button\n        class=\"picker-toggle\"\n        type=\"button\"\n        aria-haspopup=\"dialog\"\n        aria-expanded=\"{{isOpen() ? 'true' : 'false'}}\"\n        onclick=\"togglePicker(event)\"\n    >\n        <span class=\"picker-toggle-icon\">📅</span>\n        <span class=\"picker-toggle-text\">{{displayLabel}}</span>\n    </button>\n\n    <div\n        class=\"picker-overlay {{isOpen() ? 'is-open' : 'is-closed'}} {{enableBlur() ? 'blur-enabled' : ''}} {{placement()}} {{alignPlacement()}}\"\n        role=\"dialog\"\n        aria-label=\"Date and time picker\"\n    >\n        <div class=\"calendar-header\">\n            <div class=\"label-group\">\n                <button\n                    class=\"year-toggle-btn\"\n                    type=\"button\"\n                    aria-label=\"Toggle year picker\"\n                    onclick=\"toggleYearPicker()\"\n                >\n                    <span class=\"month-label\">{{monthYearLabel}}</span>\n                    <svg class=\"chevron-icon {{viewMode() === 'year' ? 'is-rotated' : ''}}\" viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" stroke=\"currentColor\" stroke-width=\"2.5\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <polyline points=\"6 9 12 15 18 9\"></polyline>\n                    </svg>\n                </button>\n            </div>\n            <div class=\"header-nav\">\n                <button\n                    type=\"button\"\n                    class=\"nav-btn prev-btn\"\n                    aria-label=\"Previous month\"\n                    onclick=\"prevMonth()\"\n                >\n                    <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" stroke=\"currentColor\" stroke-width=\"2.5\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <polyline points=\"15 18 9 12 15 6\"></polyline>\n                    </svg>\n                </button>\n                <button\n                    type=\"button\"\n                    class=\"nav-btn next-btn\"\n                    aria-label=\"Next month\"\n                    onclick=\"nextMonth()\"\n                >\n                    <svg viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" stroke=\"currentColor\" stroke-width=\"2.5\" fill=\"none\" stroke-linecap=\"round\" stroke-linejoin=\"round\">\n                        <polyline points=\"9 18 15 12 9 6\"></polyline>\n                    </svg>\n                </button>\n            </div>\n        </div>\n\n        <div class=\"picker-content-wrapper\">\n            <div class=\"calendar-body {{viewMode() === 'year' ? 'blurred' : ''}}\">\n                <div class=\"calendar-grid\" onclick=\"onCalendarGridClick(event)\">\n                    <div class=\"weekday\">Sun</div>\n                    <div class=\"weekday\">Mon</div>\n                    <div class=\"weekday\">Tue</div>\n                    <div class=\"weekday\">Wed</div>\n                    <div class=\"weekday\">Thu</div>\n                    <div class=\"weekday\">Fri</div>\n                    <div class=\"weekday\">Sat</div>\n\n                    <button\n                        for=\"let day of calendarDays\"\n                        class=\"{{day.cellClass}}\"\n                        type=\"button\"\n                        data-time=\"{{day.time}}\"\n                    >\n                        {{day.dateNum}}\n                    </button>\n                </div>\n            </div>\n\n            <div class=\"year-selector-overlay {{viewMode() === 'year' ? 'is-visible' : 'is-hidden'}}\">\n                <div class=\"year-grid\" onclick=\"onYearGridClick(event)\">\n                    <button\n                        for=\"let yr of years\"\n                        class=\"year-cell {{yr === viewYear ? 'selected' : ''}}\"\n                        type=\"button\"\n                        data-year=\"{{yr}}\"\n                    >\n                        {{yr}}\n                    </button>\n                </div>\n            </div>\n        </div>\n\n        <div class=\"time-picker\">\n            <div class=\"time-label\">\n                <span class=\"time-icon\">🕒</span>\n                <span>Time:</span>\n            </div>\n            <div class=\"time-inner-container\">\n                <div class=\"time-input-group\">\n                    <input\n                        type=\"text\"\n                        inputmode=\"numeric\"\n                        pattern=\"\\d*\"\n                        maxlength=\"2\"\n                        value=\"{{workingHoursFormatted}}\"\n                        oninput=\"onHoursInput(this)\"\n                        onchange=\"onTimeChange()\"\n                        onkeydown=\"handleTimeKeydown(event, 'hours')\"\n                        onwheel=\"handleWheel(event, 'hours')\"\n                        aria-label=\"Hours\"\n                        title=\"Scroll middle mouse or use Up/Down arrows to change hours (00-23)\"\n                    />\n                    <span class=\"separator\">:</span>\n                    <input\n                        type=\"text\"\n                        inputmode=\"numeric\"\n                        pattern=\"\\d*\"\n                        maxlength=\"2\"\n                        value=\"{{workingMinutesFormatted}}\"\n                        oninput=\"onMinutesInput(this)\"\n                        onchange=\"onTimeChange()\"\n                        onkeydown=\"handleTimeKeydown(event, 'minutes')\"\n                        onwheel=\"handleWheel(event, 'minutes')\"\n                        aria-label=\"Minutes\"\n                        title=\"Scroll middle mouse or use Up/Down arrows to change minutes (00-59)\"\n                    />\n                </div>\n            </div>\n        </div>\n\n        <div class=\"picker-footer\">\n            <button\n                class=\"confirm-button\"\n                type=\"button\"\n                onclick=\"confirmSelection()\"\n            >\n                OK\n            </button>\n        </div>\n    </div>\n</div>\n", S = class {
+	isOpen = f(!1);
+	selectedDate = f(null);
+	viewDate = f(/* @__PURE__ */ new Date());
+	enableBlur = f(!1);
+	restrictions = f(null);
+	workingDate = f(null);
+	workingHours = f(12);
+	workingMinutes = f(0);
+	viewMode = f("calendar");
+	placement = f("placement-bottom");
+	alignPlacement = f("align-left");
+	onDateSelected;
+	_hostEl;
+	_overlayEl;
+	_openedAt = 0;
+	_boundDocClick;
+	_boundKeydown;
+	_boundResize;
+	_boundScroll;
+	getHost() {
+		if (this._hostEl) return this._hostEl;
+		let e = this;
+		return e && typeof e.querySelector == "function" ? e : null;
+	}
+	onInit() {
+		let e = this;
+		this._hostEl = e, this.initWorkingState();
+		let t = e.getAttribute?.("value") || e.getAttribute?.("selected-date");
+		if (t) {
+			let e = new Date(t);
+			isNaN(e.getTime()) || (this.selectedDate.set(e), this.viewDate.set(new Date(e)), this.workingDate.set(new Date(e)), this.workingHours.set(e.getHours()), this.workingMinutes.set(e.getMinutes()));
+		}
+		let n = e.querySelector(".picker-overlay");
+		n && (this._overlayEl = n, n.parentElement !== document.body && document.body.appendChild(n), n.classList.toggle("blur-enabled", this.enableBlur())), this._boundDocClick = (t) => {
+			if (!this.isOpen() || Date.now() - this._openedAt < 200) return;
+			let n = t.composedPath ? t.composedPath() : [], r = t.target;
+			e && (n.includes(e) || r && e.contains(r)) || this._overlayEl && (n.includes(this._overlayEl) || r && this._overlayEl.contains(r)) || this.close();
+		}, this._boundKeydown = (e) => {
+			this.isOpen() && e.key === "Escape" && this.close();
+		}, this._boundResize = () => {
+			this.isOpen() && this.updateOverlayPosition();
+		}, this._boundScroll = () => {
+			this.isOpen() && this.updateOverlayPosition();
+		}, document.addEventListener("click", this._boundDocClick), window.addEventListener("keydown", this._boundKeydown), window.addEventListener("resize", this._boundResize), window.addEventListener("scroll", this._boundScroll, !0);
+	}
+	onDestroy() {
+		this._boundDocClick && document.removeEventListener("click", this._boundDocClick), this._boundKeydown && window.removeEventListener("keydown", this._boundKeydown), this._boundResize && window.removeEventListener("resize", this._boundResize), this._boundScroll && window.removeEventListener("scroll", this._boundScroll, !0), this._overlayEl && this._overlayEl.parentNode && (this._overlayEl.parentNode.removeChild(this._overlayEl), this._overlayEl = void 0);
+	}
+	disconnectedCallback() {
+		this.onDestroy();
+	}
+	get effectiveMinDate() {
+		let e = this.restrictions();
+		if (!e) return null;
+		let t = /* @__PURE__ */ new Date(), n = new Date(t.getFullYear(), t.getMonth(), t.getDate()), r = [];
+		if (e.minDate && r.push(e.minDate.getTime()), e.daysBack !== void 0 && r.push(n.getTime() - e.daysBack * 864e5), e.weeksBack !== void 0 && r.push(n.getTime() - e.weeksBack * 7 * 864e5), e.monthsBack !== void 0) {
+			let t = new Date(n);
+			t.setMonth(t.getMonth() - e.monthsBack), r.push(t.getTime());
+		}
+		if (e.yearsBack !== void 0) {
+			let t = new Date(n);
+			t.setFullYear(t.getFullYear() - e.yearsBack), r.push(t.getTime());
+		}
+		e.futureOnly && r.push(t.getTime());
+		let i = r.filter((e) => e !== null);
+		return i.length > 0 ? new Date(Math.max(...i)) : null;
+	}
+	get effectiveMaxDate() {
+		let e = this.restrictions();
+		if (!e) return null;
+		let t = /* @__PURE__ */ new Date(), n = new Date(t.getFullYear(), t.getMonth(), t.getDate(), 23, 59, 59, 999), r = [];
+		if (e.maxDate && r.push(e.maxDate.getTime()), e.daysForward !== void 0 && r.push(n.getTime() + e.daysForward * 864e5), e.weeksForward !== void 0 && r.push(n.getTime() + e.weeksForward * 7 * 864e5), e.monthsForward !== void 0) {
+			let t = new Date(n);
+			t.setMonth(t.getMonth() + e.monthsForward), r.push(t.getTime());
+		}
+		if (e.yearsForward !== void 0) {
+			let t = new Date(n);
+			t.setFullYear(t.getFullYear() + e.yearsForward), r.push(t.getTime());
+		}
+		e.pastOnly && r.push(t.getTime());
+		let i = r.filter((e) => e !== null);
+		return i.length > 0 ? new Date(Math.min(...i)) : null;
+	}
+	get displayLabel() {
+		let e = this.selectedDate();
+		return e ? `${e.getFullYear()}-${String(e.getMonth() + 1).padStart(2, "0")}-${String(e.getDate()).padStart(2, "0")} ${String(e.getHours()).padStart(2, "0")}:${String(e.getMinutes()).padStart(2, "0")}` : "Select Date & Time";
+	}
+	get monthYearLabel() {
+		return this.viewDate().toLocaleDateString(void 0, {
+			month: "long",
+			year: "numeric"
+		});
+	}
+	get viewYear() {
+		return this.viewDate().getFullYear();
+	}
+	get workingHoursFormatted() {
+		return String(this.workingHours()).padStart(2, "0");
+	}
+	get workingMinutesFormatted() {
+		return String(this.workingMinutes()).padStart(2, "0");
+	}
+	get calendarDays() {
+		let e = this.viewDate(), t = e.getFullYear(), n = e.getMonth(), r = new Date(t, n, 1), i = new Date(t, n + 1, 0), a = r.getDay(), o = i.getDate(), s = [], c = /* @__PURE__ */ new Date(), l = this.workingDate(), u = new Date(t, n, 0).getDate();
+		for (let e = a - 1; e >= 0; e--) {
+			let r = new Date(t, n - 1, u - e);
+			s.push(this.createCalendarDay(r, !1, c, l));
+		}
+		for (let e = 1; e <= o; e++) {
+			let r = new Date(t, n, e);
+			s.push(this.createCalendarDay(r, !0, c, l));
+		}
+		let d = 42 - s.length;
+		for (let e = 1; e <= d; e++) {
+			let r = new Date(t, n + 1, e);
+			s.push(this.createCalendarDay(r, !1, c, l));
+		}
+		return s;
+	}
+	get years() {
+		let e = this.viewYear, t = [], n = e - 12, r = e + 15;
+		for (let e = n; e <= r; e++) t.push(e);
+		return t;
+	}
+	createCalendarDay(e, t, n, r) {
+		let i = e.getDate() === n.getDate() && e.getMonth() === n.getMonth() && e.getFullYear() === n.getFullYear(), a = r !== null && e.getDate() === r.getDate() && e.getMonth() === r.getMonth() && e.getFullYear() === r.getFullYear(), o = this.isDateDisabled(e), s = ["day-cell"];
+		return t || s.push("off-month"), i && s.push("today"), a && s.push("selected"), o && s.push("disabled"), {
+			date: e,
+			time: e.getTime(),
+			dateNum: e.getDate(),
+			isCurrentMonth: t,
+			isToday: i,
+			isSelected: a,
+			isDisabled: o,
+			cellClass: s.join(" ")
+		};
+	}
+	isDateDisabled(e) {
+		let t = this.effectiveMinDate, n = this.effectiveMaxDate, r = new Date(e.getFullYear(), e.getMonth(), e.getDate()).getTime();
+		if (t && r < new Date(t.getFullYear(), t.getMonth(), t.getDate()).getTime() || n && r > new Date(n.getFullYear(), n.getMonth(), n.getDate()).getTime()) return !0;
+		let i = this.restrictions();
+		if (i?.disabledDates && i.disabledDates.length > 0) {
+			for (let t of i.disabledDates) if (e.getDate() === t.getDate() && e.getMonth() === t.getMonth() && e.getFullYear() === t.getFullYear()) return !0;
+		}
+		return !1;
+	}
+	initWorkingState() {
+		let e = this.selectedDate();
+		if (e) this.workingDate.set(new Date(e)), this.workingHours.set(e.getHours()), this.workingMinutes.set(e.getMinutes()), this.viewDate.set(new Date(e.getFullYear(), e.getMonth(), 1));
+		else {
+			let e = /* @__PURE__ */ new Date();
+			this.workingDate.set(null), this.workingHours.set(12), this.workingMinutes.set(0), this.viewDate.set(new Date(e.getFullYear(), e.getMonth(), 1));
+		}
+		this.enforceTimeRestrictions();
+	}
+	updateOverlayPosition() {
+		let e = this.getHost(), t = this._overlayEl || e?.querySelector(".picker-overlay");
+		if (!e || !t) return;
+		let n = e.querySelector(".picker-toggle");
+		if (!n) return;
+		let r = n.getBoundingClientRect(), i = window.innerHeight, a = window.innerWidth, o = i - r.bottom, s = r.top, c = !1;
+		o < 380 && s >= 380 && (c = !0), this.placement.set(c ? "placement-top" : "placement-bottom");
+		let l = c ? r.top - 380 - 6 : r.bottom + 6, u = r.left;
+		u + 290 > a - 10 ? (u = Math.max(10, a - 290 - 10), this.alignPlacement.set("align-right")) : this.alignPlacement.set("align-left"), l < 10 && (l = 10), l + 380 > i - 10 && (l = Math.max(10, i - 380 - 10)), t.style.top = `${l}px`, t.style.left = `${u}px`;
+	}
+	togglePicker(e) {
+		e?.stopPropagation(), this.isOpen() ? this.close() : this.open();
+	}
+	open() {
+		let e = this.getHost();
+		if (!this._overlayEl && e) {
+			let t = e.querySelector(".picker-overlay");
+			t && (this._overlayEl = t, t.parentElement !== document.body && document.body.appendChild(t));
+		}
+		if (!this._overlayEl) return;
+		this._openedAt = Date.now(), this.initWorkingState(), this.viewMode.set("calendar"), this.updateOverlayPosition(), this.isOpen.set(!0), this._overlayEl.classList.add("is-open"), this._overlayEl.classList.remove("is-closed"), this._overlayEl.classList.toggle("blur-enabled", this.enableBlur());
+		let t = this._overlayEl.querySelector(".calendar-body"), n = this._overlayEl.querySelector(".year-selector-overlay");
+		t && t.classList.remove("blurred"), n && (n.classList.remove("is-visible"), n.classList.add("is-hidden"));
+	}
+	close() {
+		this.isOpen.set(!1), this._overlayEl && (this._overlayEl.classList.remove("is-open"), this._overlayEl.classList.add("is-closed"));
+	}
+	onCalendarGridClick(e) {
+		let t = e.target?.closest(".day-cell");
+		if (t && t.dataset.time) {
+			let e = Number(t.dataset.time);
+			isNaN(e) || this.selectDayByTime(e);
+		}
+	}
+	onYearGridClick(e) {
+		let t = e.target?.closest(".year-cell");
+		if (t && t.dataset.year) {
+			let e = Number(t.dataset.year);
+			isNaN(e) || this.selectYear(e);
+		}
+	}
+	selectDayByTime(e) {
+		let t = new Date(e);
+		this.createCalendarDay(t, !0, /* @__PURE__ */ new Date(), null).isDisabled || (this.workingDate.set(t), (t.getMonth() !== this.viewDate().getMonth() || t.getFullYear() !== this.viewDate().getFullYear()) && this.viewDate.set(new Date(t.getFullYear(), t.getMonth(), 1)), this.enforceTimeRestrictions());
+	}
+	toggleYearPicker() {
+		let e = this.viewMode() === "calendar" ? "year" : "calendar";
+		if (this.viewMode.set(e), this._overlayEl) {
+			let t = this._overlayEl.querySelector(".calendar-body"), n = this._overlayEl.querySelector(".year-selector-overlay");
+			t && t.classList.toggle("blurred", e === "year"), n && (n.classList.toggle("is-visible", e === "year"), n.classList.toggle("is-hidden", e !== "year"));
+		}
+	}
+	selectYear(e) {
+		let t = this.viewDate();
+		if (this.viewDate.set(new Date(e, t.getMonth(), 1)), this.viewMode.set("calendar"), this._overlayEl) {
+			let e = this._overlayEl.querySelector(".calendar-body"), t = this._overlayEl.querySelector(".year-selector-overlay");
+			e && e.classList.remove("blurred"), t && (t.classList.remove("is-visible"), t.classList.add("is-hidden"));
+		}
+	}
+	prevMonth() {
+		let e = this.viewDate();
+		this.viewDate.set(new Date(e.getFullYear(), e.getMonth() - 1, 1));
+	}
+	nextMonth() {
+		let e = this.viewDate();
+		this.viewDate.set(new Date(e.getFullYear(), e.getMonth() + 1, 1));
+	}
+	onHoursInput(e) {
+		let t = e.value.replace(/\D/g, ""), n = parseInt(t, 10);
+		isNaN(n) && (n = 0), n > 23 && (n = 23), n < 0 && (n = 0), this.workingHours.set(n);
+	}
+	onMinutesInput(e) {
+		let t = e.value.replace(/\D/g, ""), n = parseInt(t, 10);
+		isNaN(n) && (n = 0), n > 59 && (n = 59), n < 0 && (n = 0), this.workingMinutes.set(n);
+	}
+	onTimeChange() {
+		this.enforceTimeRestrictions();
+	}
+	handleTimeKeydown(e, t) {
+		let n = e.target, r = e.key;
+		if (r === "ArrowUp" || r === "ArrowDown") {
+			e.preventDefault(), e.stopPropagation();
+			let i = r === "ArrowUp" ? 1 : -1;
+			if (t === "hours" || n.getAttribute("aria-label") === "Hours") {
+				let e = this.workingHours() + i;
+				e > 23 && (e = 0), e < 0 && (e = 23), this.workingHours.set(e), n.value = this.workingHoursFormatted;
+			} else {
+				let e = this.workingMinutes() + i;
+				e > 59 && (e = 0), e < 0 && (e = 59), this.workingMinutes.set(e), n.value = this.workingMinutesFormatted;
+			}
+			this.onTimeChange(), n.select();
+			return;
+		}
+		if (!([
+			"Backspace",
+			"Tab",
+			"Enter",
+			"Escape",
+			"Delete",
+			"ArrowLeft",
+			"ArrowRight",
+			"Home",
+			"End"
+		].includes(r) || e.ctrlKey && [
+			"a",
+			"c",
+			"v",
+			"x"
+		].includes(r.toLowerCase()))) {
+			if (!/^\d$/.test(r)) {
+				e.preventDefault(), e.stopPropagation();
+				return;
+			}
+			n.selectionStart === n.selectionEnd && n.value.length >= 2 && (e.preventDefault(), e.stopPropagation());
+		}
+	}
+	handleWheel(e, t) {
+		e.preventDefault(), e.stopPropagation();
+		let n = e.deltaY < 0 ? 1 : -1;
+		if (t === "hours") {
+			let e = this.workingHours() + n;
+			e > 23 && (e = 0), e < 0 && (e = 23), this.workingHours.set(e);
+		} else {
+			let e = this.workingMinutes() + n;
+			e > 59 && (e = 0), e < 0 && (e = 59), this.workingMinutes.set(e);
+		}
+		this.onTimeChange();
+		let r = e.target;
+		r && (r.value = t === "hours" ? this.workingHoursFormatted : this.workingMinutesFormatted, r.select());
+	}
+	confirmSelection() {
+		let e = this.workingDate();
+		if (!e && (e = /* @__PURE__ */ new Date(), this.isDateDisabled(e))) return;
+		let t = new Date(e.getFullYear(), e.getMonth(), e.getDate(), this.workingHours(), this.workingMinutes(), 0, 0);
+		this.selectedDate.set(t), this.emitSelection(), this.close();
+	}
+	enforceTimeRestrictions() {
+		let e = this.workingDate(), t = this.restrictions();
+		if (t && (e && t.minDate && e.getDate() === t.minDate.getDate() && e.getMonth() === t.minDate.getMonth() && e.getFullYear() === t.minDate.getFullYear() || !e)) {
+			let e = this.workingHours() * 60 + this.workingMinutes();
+			if (t.minTime) {
+				let [n, r] = t.minTime.split(":").map(Number);
+				e < n * 60 + r && this.setWorkingTime(n, r);
+			}
+			if (t.maxTime) {
+				let [n, r] = t.maxTime.split(":").map(Number);
+				e > n * 60 + r && this.setWorkingTime(n, r);
+			}
+		}
+	}
+	setWorkingTime(e, t) {
+		this.workingHours.set(e), this.workingMinutes.set(t);
+	}
+	setDate(e) {
+		this.selectedDate.set(e), this.initWorkingState();
+	}
+	setRestrictions(e) {
+		this.restrictions.set(e), this.enforceTimeRestrictions();
+	}
+	setBlur(e) {
+		this.enableBlur.set(e), this._overlayEl && this._overlayEl.classList.toggle("blur-enabled", e);
+	}
+	emitSelection() {
+		let e = this.selectedDate();
+		if (e) {
+			this.onDateSelected?.(e);
+			let t = this.getHost();
+			t?.dispatchEvent?.(new CustomEvent("date-selected", {
+				detail: { date: e },
+				bubbles: !0,
+				composed: !0
+			})), t?.dispatchEvent?.(new CustomEvent("change", {
+				detail: {
+					date: e,
+					value: e
+				},
+				bubbles: !0,
+				composed: !0
+			}));
+		}
+	}
+	get value() {
+		return this.selectedDate();
+	}
+	set value(e) {
+		if (!e) {
+			this.selectedDate.set(null);
+			return;
+		}
+		let t = e instanceof Date ? e : new Date(e);
+		isNaN(t.getTime()) || (this.selectedDate.set(t), this.viewDate.set(new Date(t)), this.workingDate.set(new Date(t)), this.workingHours.set(t.getHours()), this.workingMinutes.set(t.getMinutes()));
+	}
+};
+r({
+	selector: "date-time-picker",
+	templateUrl: "./src/app/shared/components/date-time-picker/date-time-picker.component.html",
+	template: x
+})(S);
+//#endregion
+//#region src/app/shared/components/notification/notification.component.html?raw
+var C = "<div class=\"notification-container\" aria-live=\"polite\">\n    <div for=\"let group of positionGroups\" class=\"toast-stack pos-{{group.position}}\">\n        <div\n            for=\"let item of group.items\"\n            class=\"toast-card toast-{{item.type}} {{item.blink ? 'toast-blink' : ''}}\"\n            style=\"{{item.width ? 'width: ' + item.width + ';' : ''}} {{item.height ? 'height: ' + item.height + ';' : ''}}\"\n        >\n            <div class=\"toast-icon-wrapper\">\n                <span class=\"toast-icon icon-{{item.type}}\"></span>\n            </div>\n            <div class=\"toast-body\">\n                <div class=\"toast-title\">{{item.title}}</div>\n                <div class=\"toast-subtitle\">{{item.subtitle}}</div>\n            </div>\n            <button\n                type=\"button\"\n                class=\"toast-close-btn\"\n                title=\"Close notification\"\n                onclick=\"dismiss(item.id)\"\n            >\n                <span class=\"toast-countdown\">{{item.remainingSeconds ? item.remainingSeconds + 's' : ''}}</span>\n                <span class=\"toast-close-icon\">✕</span>\n            </button>\n        </div>\n    </div>\n</div>\n", w = class {
+	notifications = f([]);
+	timers = /* @__PURE__ */ new Map();
+	tickerInterval = null;
+	ensureTicker() {
+		this.tickerInterval || typeof window > "u" || (this.tickerInterval = setInterval(() => {
+			let e = this.notifications();
+			if (e.length === 0) {
+				clearInterval(this.tickerInterval), this.tickerInterval = null;
+				return;
+			}
+			let t = !1, n = e.map((e) => e.duration > 0 && e.remainingSeconds > 0 ? (t = !0, {
+				...e,
+				remainingSeconds: Math.max(0, e.remainingSeconds - 1)
+			}) : e);
+			t && this.notifications.set(n);
+		}, 1e3));
+	}
+	notify(e) {
+		let t = e.id || `notify_${Date.now()}_${Math.random().toString(36).slice(2, 7)}`, n = e.duration === void 0 ? 1e4 : e.duration, r = n > 0 ? Math.ceil(n / 1e3) : 0, i = {
+			id: t,
+			type: e.type || "info",
+			title: e.title,
+			subtitle: e.subtitle || "",
+			position: e.position || "top-right",
+			duration: n,
+			remainingSeconds: r,
+			blink: e.blink === !0,
+			width: e.width || "",
+			height: e.height || "",
+			dismissible: e.dismissible !== !1,
+			createdAt: Date.now(),
+			onClose: e.onClose
+		};
+		if (this.notifications.update((e) => [...e, i]), n > 0 && typeof window < "u") {
+			let e = setTimeout(() => {
+				this.dismiss(t);
+			}, n);
+			this.timers.set(t, e), this.ensureTicker();
+		}
+		return t;
+	}
+	success(e, t, n) {
+		return this.notify({
+			...n,
+			type: "success",
+			title: e,
+			subtitle: t
+		});
+	}
+	error(e, t, n) {
+		return this.notify({
+			...n,
+			type: "error",
+			title: e,
+			subtitle: t
+		});
+	}
+	warn(e, t, n) {
+		return this.notify({
+			...n,
+			type: "warn",
+			title: e,
+			subtitle: t
+		});
+	}
+	info(e, t, n) {
+		return this.notify({
+			...n,
+			type: "info",
+			title: e,
+			subtitle: t
+		});
+	}
+	dismiss(e) {
+		let t = this.timers.get(e);
+		t && (clearTimeout(t), this.timers.delete(e));
+		let n = this.notifications(), r = n.find((t) => t.id === e);
+		if (r && r.onClose) try {
+			r.onClose();
+		} catch (e) {
+			console.error("[NotifyService] Error in onClose handler:", e);
+		}
+		let i = n.filter((t) => t.id !== e);
+		i.length === 0 && this.tickerInterval && (clearInterval(this.tickerInterval), this.tickerInterval = null), this.notifications.set(i);
+	}
+	clear() {
+		for (let e of this.timers.values()) clearTimeout(e);
+		this.timers.clear(), this.tickerInterval &&= (clearInterval(this.tickerInterval), null), this.notifications.set([]);
+	}
+};
+a("NotifyService")(w);
+//#endregion
+//#region src/app/shared/components/notification/notification.component.ts
+var T = [
+	"top-right",
+	"top-left",
+	"top-center",
+	"bottom-right",
+	"bottom-left",
+	"bottom-center",
+	"center"
+], E = class {
+	notifyService = d(w);
+	positionGroups = f([]);
+	onInit() {
+		l(() => {
+			let e = this.notifyService.notifications(), t = [];
+			for (let n of T) {
+				let r = e.filter((e) => e.position === n);
+				r.length > 0 && t.push({
+					position: n,
+					items: r
+				});
+			}
+			this.positionGroups.set(t);
+		});
+	}
+	dismiss(e) {
+		this.notifyService.dismiss(e);
+	}
+};
+r({
+	selector: "notification-component",
+	templateUrl: "./src/app/shared/components/notification/notification.component.html",
+	template: C
+})(E);
+//#endregion
+//#region src/app/shared/components/loader/loader.component.html?raw
+var D = "<div class=\"loader-inline-root {{isLoading() ? 'visible' : ''}}\" aria-hidden=\"{{!isLoading()}}\">\n    <div class=\"loader-spinner-box\">\n        <svg class=\"loader-svg\" viewBox=\"0 0 50 50\" aria-label=\"Loading\">\n            <circle class=\"loader-track\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"4\"></circle>\n            <circle class=\"loader-head\" cx=\"25\" cy=\"25\" r=\"20\" fill=\"none\" stroke-width=\"4\"></circle>\n        </svg>\n    </div>\n    <span class=\"loader-text\">{{message()}}</span>\n</div>\n", O = class {
+	isLoading = f(!1);
+	message = f("Loading...");
+	isHoldingCursor = !1;
+	onInit() {
+		let e = this.element || this;
+		if (e && typeof e.getAttribute == "function") {
+			let t = e.getAttribute("message");
+			t && this.message.set(t);
+			let n = e.getAttribute("is-loading");
+			n !== null && n !== "false" && n !== "null" && n !== "0" && this.isLoading.set(!0);
+		}
+		l(() => {
+			let t = this.isLoading();
+			e && e.classList.toggle("is-loading", t), t && !this.isHoldingCursor ? (this.isHoldingCursor = !0, p()) : !t && this.isHoldingCursor && (this.isHoldingCursor = !1, m());
+		});
+	}
+	onDestroy() {
+		this.isHoldingCursor && (this.isHoldingCursor = !1, m());
+	}
+	show(e = "Loading...") {
+		this.message.set(e || "Loading..."), this.isLoading.set(!0);
+	}
+	hide() {
+		this.isLoading.set(!1);
+	}
+	toggle(e, t = "Loading...") {
+		this.message.set(t || "Loading..."), e === void 0 ? this.isLoading.update((e) => !e) : this.isLoading.set(e);
+	}
+};
+r({
+	selector: "loader-component",
+	templateUrl: "./src/app/shared/components/loader/loader.component.html",
+	template: D
+})(O);
+//#endregion
+//#region src/app/shared/components/popover/popover.component.html?raw
+var k = "<div class=\"purity-popover-portal {{isOpen() ? 'is-open' : 'is-closed'}} pos-{{effectivePosition()}}\">\n    <div class=\"popover-arrow\"></div>\n    <div class=\"popover-surface\">\n        <slot>Popover content</slot>\n    </div>\n</div>\n", A = class {
+	isOpen = f(!1);
+	targetFor = f("");
+	position = f("bottom");
+	effectivePosition = f("bottom");
+	offset = 8;
+	closeDelay = 120;
+	_portalEl = null;
+	_targetEl = null;
+	_closeTimer = null;
+	_boundOnTargetEnter = () => this.handleTargetEnter();
+	_boundOnTargetLeave = () => this.handleTargetLeave();
+	_boundOnPopoverEnter = () => this.handlePopoverEnter();
+	_boundOnPopoverLeave = () => this.handlePopoverLeave();
+	_boundOnWindowChange = () => {
+		this.isOpen() && this.updatePosition();
+	};
+	onInit() {
+		let e = this, t = e.getAttribute?.("target-for") || e.getAttribute?.("target");
+		if (t) {
+			let e = t.replace(/^['"]|['"]$/g, "").trim();
+			this.targetFor.set(e);
+		}
+		let n = e.getAttribute?.("position");
+		if (n) {
+			let e = n.replace(/^['"]|['"]$/g, "").trim();
+			[
+				"top",
+				"bottom",
+				"left",
+				"right"
+			].includes(e) && (this.position.set(e), this.effectivePosition.set(e));
+		}
+		let r = e.getAttribute?.("offset");
+		if (r) {
+			let e = parseInt(r, 10);
+			isNaN(e) || (this.offset = e);
+		}
+		this._portalEl = e.querySelector?.(".purity-popover-portal"), this._portalEl && this._portalEl.parentElement !== document.body && document.body.appendChild(this._portalEl), this._portalEl && (this._portalEl.addEventListener("mouseenter", this._boundOnPopoverEnter), this._portalEl.addEventListener("mouseleave", this._boundOnPopoverLeave)), this.bindTargetListeners(), l(() => {
+			this.targetFor() && this.bindTargetListeners();
+		}), l(() => {
+			let e = this.position();
+			e && (this.effectivePosition.set(e), this.isOpen() && this.updatePosition());
+		}), window.addEventListener("resize", this._boundOnWindowChange, { passive: !0 }), window.addEventListener("scroll", this._boundOnWindowChange, {
+			passive: !0,
+			capture: !0
+		});
+	}
+	onDestroy() {
+		this.clearCloseTimer(), this.unbindTargetListeners(), this._portalEl && (this._portalEl.removeEventListener("mouseenter", this._boundOnPopoverEnter), this._portalEl.removeEventListener("mouseleave", this._boundOnPopoverLeave), this._portalEl.parentElement === document.body && this._portalEl.remove()), this._portalEl = null, this._targetEl = null, window.removeEventListener("resize", this._boundOnWindowChange), window.removeEventListener("scroll", this._boundOnWindowChange, !0);
+	}
+	disconnectedCallback() {
+		this.onDestroy();
+	}
+	bindTargetListeners() {
+		let e = this.targetFor();
+		if (!e || typeof document > "u") return;
+		this.unbindTargetListeners();
+		let t = document.querySelector(e);
+		t && (this._targetEl = t, t.addEventListener("mouseenter", this._boundOnTargetEnter), t.addEventListener("mouseleave", this._boundOnTargetLeave));
+	}
+	unbindTargetListeners() {
+		this._targetEl &&= (this._targetEl.removeEventListener("mouseenter", this._boundOnTargetEnter), this._targetEl.removeEventListener("mouseleave", this._boundOnTargetLeave), null);
+	}
+	setTargetFor(e) {
+		this.targetFor.set(e.replace(/^['"]|['"]$/g, "").trim()), this.bindTargetListeners();
+	}
+	setPosition(e) {
+		[
+			"top",
+			"bottom",
+			"left",
+			"right"
+		].includes(e) && (this.position.set(e), this.effectivePosition.set(e), this.isOpen() && this.updatePosition());
+	}
+	open(e) {
+		if (this.clearCloseTimer(), e) {
+			if (typeof e == "string") {
+				let t = document.querySelector(e);
+				t && (this._targetEl = t);
+			} else e instanceof HTMLElement && (this._targetEl = e);
+		}
+		if (!this._targetEl && this.targetFor() && (this._targetEl = document.querySelector(this.targetFor())), !this._portalEl) {
+			let e = this;
+			this._portalEl = e?.querySelector?.(".purity-popover-portal") || document.querySelector(".purity-popover-portal"), this._portalEl && this._portalEl.parentElement !== document.body && document.body.appendChild(this._portalEl);
+		}
+		this.isOpen.set(!0), this._portalEl && (this._portalEl.classList.remove("is-closed"), this._portalEl.classList.add("is-open")), requestAnimationFrame(() => {
+			this.updatePosition();
+		});
+	}
+	close() {
+		this.clearCloseTimer(), this.isOpen.set(!1), this._portalEl && (this._portalEl.classList.remove("is-open"), this._portalEl.classList.add("is-closed"));
+	}
+	toggle(e) {
+		this.isOpen() ? this.close() : this.open(e);
+	}
+	updatePosition() {
+		let e = this._portalEl, t = this._targetEl || (this.targetFor() ? document.querySelector(this.targetFor()) : null);
+		if (!e || !t || typeof window > "u") return;
+		let n = t.getBoundingClientRect(), r = e.getBoundingClientRect(), i = r.width || 200, a = r.height || 80, o = window.innerWidth, s = window.innerHeight, c = this.offset, l = this.position(), u = 0, d = 0;
+		if (l === "bottom") {
+			let e = n.bottom + c + a > s - 8, t = n.top - c - a >= 8;
+			e && t && (l = "top");
+		} else if (l === "top") {
+			let e = n.top - c - a < 8, t = n.bottom + c + a <= s - 8;
+			e && t && (l = "bottom");
+		} else if (l === "left") {
+			let e = n.left - c - i < 8, t = n.right + c + i <= o - 8;
+			e && t && (l = "right");
+		} else if (l === "right") {
+			let e = n.right + c + i > o - 8, t = n.left - c - i >= 8;
+			e && t && (l = "left");
+		}
+		l === "bottom" ? (u = n.bottom + c, d = n.left + (n.width - i) / 2) : l === "top" ? (u = n.top - a - c, d = n.left + (n.width - i) / 2) : l === "left" ? (u = n.top + (n.height - a) / 2, d = n.left - i - c) : l === "right" && (u = n.top + (n.height - a) / 2, d = n.right + c), d = Math.max(8, Math.min(d, o - i - 8)), u = Math.max(8, Math.min(u, s - a - 8)), e.style.top = `${Math.round(u)}px`, e.style.left = `${Math.round(d)}px`, e.classList.remove("pos-top", "pos-bottom", "pos-left", "pos-right"), e.classList.add(`pos-${l}`), this.effectivePosition.set(l);
+	}
+	handleTargetEnter() {
+		this.open();
+	}
+	handleTargetLeave() {
+		this.scheduleClose();
+	}
+	handlePopoverEnter() {
+		this.clearCloseTimer();
+	}
+	handlePopoverLeave() {
+		this.scheduleClose();
+	}
+	scheduleClose() {
+		this.clearCloseTimer(), this._closeTimer = setTimeout(() => {
+			this.close();
+		}, this.closeDelay);
+	}
+	clearCloseTimer() {
+		this._closeTimer &&= (clearTimeout(this._closeTimer), null);
+	}
+}, j = class extends e {
+	instance;
+	onInit() {
+		let e = this.element;
+		if (!e || e.hasAttribute("data-popover-ready")) return;
+		e.setAttribute("data-popover-ready", "true"), e.style.display = "none";
+		let t = document.createElement("div");
+		t.className = "purity-popover-portal is-closed pos-bottom", t.innerHTML = "\n            <div class=\"popover-arrow\"></div>\n            <div class=\"popover-surface\"></div>\n        ";
+		let n = t.querySelector(".popover-surface");
+		for (; e.firstChild;) n.appendChild(e.firstChild);
+		document.body.appendChild(t);
+		let r = new A();
+		r._portalEl = t;
+		let i = e.getAttribute("target-for") || e.getAttribute("target");
+		i && r.setTargetFor(i);
+		let a = e.getAttribute("position");
+		a && r.setPosition(a.replace(/^['"]|['"]$/g, "")), t.addEventListener("mouseenter", () => r.handlePopoverEnter()), t.addEventListener("mouseleave", () => r.handlePopoverLeave()), e.open = (e) => r.open(e), e.close = () => r.close(), e.toggle = (e) => r.toggle(e), e.isOpen = () => r.isOpen(), e.setPosition = (e) => r.setPosition(e), e.setTargetFor = (e) => r.setTargetFor(e), e.targetFor = r.targetFor, e.position = r.position, e.effectivePosition = r.effectivePosition, this.instance = r;
+	}
+	onDestroy() {
+		this.instance?.onDestroy();
+	}
+};
+r({
+	selector: "popover-component",
+	templateUrl: "./src/app/shared/components/popover/popover.component.html",
+	template: k
+})(A), i("popover")(j);
+//#endregion
+//#region src/app/shared/components/radial-context-menu/radial-context-menu.component.html?raw
+var M = "<div\n    class=\"radial-menu-root is-closed\"\n    role=\"menu\"\n    aria-label=\"Radial Context Menu\"\n>\n    <button\n        class=\"center-button\"\n        type=\"button\"\n        aria-label=\"Menu Center Action\"\n    >\n        <span class=\"center-icon\">×</span>\n        <span class=\"menu-title-pop\"></span>\n    </button>\n</div>\n", N = class {
+	itemsSource = f([]);
+	navigationStack = f([]);
+	isOpen = f(!1);
+	coords = f({
+		x: 0,
+		y: 0
+	});
+	radius = f(150);
+	activeHoverItem = f(null);
+	selector = f(null);
+	enableBlur = f(!0);
+	onSelectItem;
+	onHover;
+	onOpen;
+	onClose;
+	onNavigate;
+	menuEl = null;
+	titlePopEl = null;
+	centerBtnEl = null;
+	itemsContainerEl = null;
+	_openedAt = 0;
+	_boundContextMenu;
+	_boundClick;
+	_boundKeydown;
+	onInit() {
+		this._boundContextMenu = (e) => this.onDocumentContextMenu(e), this._boundClick = (e) => this.onDocumentClick(e), this._boundKeydown = (e) => this.onDocumentKeydown(e), this.createMenuDOM(), document.addEventListener("contextmenu", this._boundContextMenu), document.addEventListener("click", this._boundClick), window.addEventListener("keydown", this._boundKeydown);
+	}
+	onDestroy() {
+		this._boundContextMenu && document.removeEventListener("contextmenu", this._boundContextMenu), this._boundClick && document.removeEventListener("click", this._boundClick), this._boundKeydown && window.removeEventListener("keydown", this._boundKeydown), this.menuEl && this.menuEl.parentNode && this.menuEl.parentNode.removeChild(this.menuEl), this.menuEl = null, this.titlePopEl = null, this.centerBtnEl = null, this.itemsContainerEl = null;
+	}
+	disconnectedCallback() {
+		this.onDestroy();
+	}
+	createMenuDOM() {
+		if (this.menuEl) return;
+		let e = this.radius();
+		this.menuEl = document.createElement("div"), this.menuEl.className = "radial-menu", this.enableBlur() && this.menuEl.classList.add("blur-enabled"), this.menuEl.style.width = `${e * 2}px`, this.menuEl.style.height = `${e * 2}px`, this.menuEl.style.display = "none", this.menuEl.setAttribute("role", "menu"), this.menuEl.setAttribute("aria-label", "Radial Context Menu"), this.titlePopEl = document.createElement("div"), this.titlePopEl.className = "menu-title-pop", this.menuEl.appendChild(this.titlePopEl), this.centerBtnEl = document.createElement("button"), this.centerBtnEl.className = "center-button", this.centerBtnEl.type = "button", this.centerBtnEl.setAttribute("aria-label", "Menu Center Action"), this.centerBtnEl.innerHTML = "<span class=\"center-icon\">×</span>", this.centerBtnEl.addEventListener("click", (e) => {
+			e.stopPropagation(), this.navigationStack().length > 0 ? this.goBack() : this.close();
+		}), this.menuEl.appendChild(this.centerBtnEl), document.body.appendChild(this.menuEl);
+	}
+	get currentItems() {
+		let e = this.navigationStack();
+		return e.length === 0 ? this.itemsSource() : e[e.length - 1].children || [];
+	}
+	get centerIcon() {
+		return this.navigationStack().length > 0 ? "←" : "×";
+	}
+	get centerTitle() {
+		let e = this.activeHoverItem();
+		if (e) return e.name;
+		let t = this.navigationStack();
+		return t.length > 0 ? t[t.length - 1].name : "";
+	}
+	getPoint(e, t) {
+		let n = e * Math.PI / 180;
+		return {
+			x: 50 + t * Math.cos(n),
+			y: 50 + t * Math.sin(n)
+		};
+	}
+	setItems(e) {
+		this.itemsSource.set(e), this.navigationStack.set([]), this.activeHoverItem.set(null), this.isOpen() && (this.renderSegments("in"), this.updateCenterButton());
+	}
+	setSelector(e) {
+		this.selector.set(e);
+	}
+	setBlur(e) {
+		this.enableBlur.set(e), this.menuEl && (e ? this.menuEl.classList.add("blur-enabled") : this.menuEl.classList.remove("blur-enabled"));
+	}
+	open(e, t) {
+		if (this.menuEl || this.createMenuDOM(), !this.menuEl) return;
+		let n = this.radius(), r = e === void 0 ? window.innerWidth / 2 : e, i = t === void 0 ? window.innerHeight / 2 : t, a = Math.max(n + 12, Math.min(window.innerWidth - n - 12, r)), o = Math.max(n + 12, Math.min(window.innerHeight - n - 12, i));
+		this.coords.set({
+			x: a,
+			y: o
+		}), this.navigationStack.set([]), this.activeHoverItem.set(null), this.isOpen.set(!0), this._openedAt = Date.now(), this.menuEl.style.left = `${a - n}px`, this.menuEl.style.top = `${o - n}px`, this.menuEl.style.width = `${n * 2}px`, this.menuEl.style.height = `${n * 2}px`, this.menuEl.style.display = "block", this.enableBlur() ? this.menuEl.classList.add("blur-enabled") : this.menuEl.classList.remove("blur-enabled"), this.menuEl.offsetHeight, this.menuEl.classList.add("active"), this.renderSegments("in"), this.updateCenterButton(), this.onOpen?.(), this.emitEvent("menu-open", {
+			x: a,
+			y: o
+		});
+	}
+	close() {
+		this.menuEl && (this.isOpen.set(!1), this.activeHoverItem.set(null), this.menuEl.classList.remove("active"), this.onClose?.(), this.emitEvent("menu-close", {}), setTimeout(() => {
+			!this.isOpen() && this.menuEl && !this.menuEl.classList.contains("active") && (this.menuEl.style.display = "none");
+		}, 300));
+	}
+	navigateTo(e) {
+		e.children && e.children.length > 0 && (this.navigationStack.update((t) => [...t, e]), this.activeHoverItem.set(null), this.renderSegments("in"), this.updateCenterButton(), this.onNavigate?.(e, this.navigationStack().length), this.emitEvent("menu-navigate", {
+			item: e,
+			depth: this.navigationStack().length
+		}));
+	}
+	goBack() {
+		if (this.navigationStack().length > 0) {
+			this.navigationStack.update((e) => e.slice(0, -1)), this.activeHoverItem.set(null), this.renderSegments("out"), this.updateCenterButton();
+			let e = this.navigationStack().length > 0 ? this.navigationStack()[this.navigationStack().length - 1] : null;
+			this.onNavigate?.(e, this.navigationStack().length), this.emitEvent("menu-back", {
+				current: e,
+				depth: this.navigationStack().length
+			});
+		} else this.close();
+	}
+	updateCenterButton() {
+		if (!this.centerBtnEl) return;
+		let e = this.centerBtnEl.querySelector(".center-icon");
+		if (e && (e.textContent = this.centerIcon, this.activeHoverItem() ? e.style.opacity = "0" : e.style.opacity = "1"), this.titlePopEl) {
+			let e = this.centerTitle;
+			this.titlePopEl.textContent = e, this.activeHoverItem() ? this.titlePopEl.classList.add("visible") : this.titlePopEl.classList.remove("visible");
+		}
+	}
+	renderSegments(e = "in") {
+		if (!this.menuEl) return;
+		let t = this.itemsContainerEl, n = document.createElement("div");
+		n.className = "items-container entering", e === "out" && (n.className = "items-container exiting");
+		let r = this.currentItems, i = r.length;
+		if (i > 0) {
+			let e = 360 / i;
+			r.forEach((t, r) => {
+				let i = this.createSegmentElement(t, r, e);
+				n.appendChild(i);
+			});
+		}
+		this.centerBtnEl ? this.menuEl.insertBefore(n, this.centerBtnEl) : this.menuEl.appendChild(n), this.itemsContainerEl = n, requestAnimationFrame(() => {
+			t && (t.classList.add(e === "in" ? "exiting" : "entering"), t.classList.remove("active"), setTimeout(() => {
+				t.parentNode && t.parentNode.removeChild(t);
+			}, 400)), n.classList.remove("entering", "exiting"), n.classList.add("active");
+		});
+	}
+	createSegmentElement(e, t, n) {
+		let r = t * n - 90, i = (t + 1) * n - 90, a = r + n / 2, o = document.createElement("div");
+		o.className = "menu-segment", e.children && e.children.length > 0 && o.classList.add("has-children"), o.style.zIndex = `${t + 1}`;
+		let s = 49.5, c = .5, l = [];
+		for (let e = r; e <= i; e += c) l.push(this.getPoint(e, s));
+		l.push(this.getPoint(i, s));
+		for (let e = i; e >= r; e -= c) l.push(this.getPoint(e, 26));
+		l.push(this.getPoint(r, 26));
+		let u = `polygon(${l.map((e) => `${e.x.toFixed(4)}% ${e.y.toFixed(4)}%`).join(", ")})`;
+		o.style.clipPath = u, o.style.webkitClipPath = u;
+		let d = document.createElement("div");
+		d.className = "segment-glass", o.appendChild(d);
+		let f = document.createElement("div");
+		f.className = "segment-shine", o.appendChild(f);
+		let p = document.createElement("span");
+		p.className = "segment-label";
+		let m = this.getPoint(a, 38.5);
+		if (p.style.left = `${m.x.toFixed(2)}%`, p.style.top = `${m.y.toFixed(2)}%`, e.image && typeof e.image == "string") {
+			let t = e.image.trim();
+			if (t.startsWith("<svg")) p.innerHTML = t;
+			else if (t.endsWith(".svg") || t.startsWith("data:image/svg") || t.startsWith("/") || t.startsWith("./") || t.startsWith("http")) {
+				let n = document.createElement("img");
+				n.src = t, n.className = "segment-icon", n.alt = e.name, p.appendChild(n);
+			} else p.textContent = t;
+		} else p.textContent = e.name;
+		if (o.appendChild(p), e.children && e.children.length > 0) {
+			let e = document.createElement("div");
+			e.className = "submenu-indicator";
+			let t = this.getPoint(a, 47.2);
+			e.style.left = `${t.x.toFixed(2)}%`, e.style.top = `${t.y.toFixed(2)}%`, o.appendChild(e);
+		}
+		return o.addEventListener("click", (t) => {
+			t.stopPropagation(), e.children && e.children.length > 0 ? this.navigateTo(e) : (this.onSelectItem?.(e), this.emitEvent("item-selected", { item: e }), this.close());
+		}), o.addEventListener("mouseenter", () => {
+			this.activeHoverItem.set(e), this.onHover?.(e), this.emitEvent("menu-hover", { item: e }), this.updateCenterButton();
+		}), o.addEventListener("mouseleave", () => {
+			this.activeHoverItem.set(null), this.onHover?.(null), this.emitEvent("menu-hover", { item: null }), this.updateCenterButton();
+		}), o;
+	}
+	onDocumentContextMenu(e) {
+		let t = this.selector();
+		t && e.target?.closest?.(t) && (e.preventDefault(), e.stopPropagation(), this.open(e.clientX, e.clientY));
+	}
+	onDocumentClick(e) {
+		if (this.isOpen() && !(Date.now() - this._openedAt < 150)) {
+			if (this.menuEl) {
+				if ((e.composedPath ? e.composedPath() : []).includes(this.menuEl)) return;
+				let t = e.target;
+				if (t && typeof this.menuEl.contains == "function" && this.menuEl.contains(t)) return;
+			}
+			this.close();
+		}
+	}
+	onDocumentKeydown(e) {
+		e.key === "Escape" && this.isOpen() && (this.navigationStack().length > 0 ? this.goBack() : this.close());
+	}
+	emitEvent(e, t) {
+		this?.dispatchEvent?.(new CustomEvent(e, {
+			detail: t,
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+};
+r({
+	selector: "radial-context-menu",
+	templateUrl: "./src/app/shared/components/radial-context-menu/radial-context-menu.component.html",
+	template: M
+})(N);
+//#endregion
+//#region src/app/shared/components/expander/expander.component.html?raw
+var P = "<slot></slot>\n", F = class {
+	isExpanded = f(!1);
+	hostEl = null;
+	titleEl = null;
+	cleanupEffect;
+	handleTitleClick = (e) => {
+		e.target?.closest("a, button, input, textarea, select") || this.toggle();
+	};
+	handleTitleKeydown = (e) => {
+		(e.key === " " || e.key === "Enter") && (e.preventDefault(), this.toggle());
+	};
+	initOnHost(e) {
+		this.hostEl = e;
+		let t = e.getAttribute("is-expanded"), n = e.getAttribute("expanded");
+		(t !== null && t !== "false" && t !== "null" && t !== "0" || n !== null && n !== "false" && n !== "null" && n !== "0") && this.isExpanded.set(!0);
+		let r = e.getAttribute("title");
+		this.titleEl = e.querySelector(".title"), !this.titleEl && r && (this.titleEl = document.createElement("div"), this.titleEl.className = "title", this.titleEl.textContent = r, e.insertBefore(this.titleEl, e.firstChild)), this.titleEl && (this.titleEl.hasAttribute("role") || this.titleEl.setAttribute("role", "button"), this.titleEl.hasAttribute("tabindex") || this.titleEl.setAttribute("tabindex", "0"), this.titleEl.addEventListener("click", this.handleTitleClick), this.titleEl.addEventListener("keydown", this.handleTitleKeydown));
+		let i = e.querySelector(".body");
+		i && !i.hasAttribute("role") && i.setAttribute("role", "region"), this.cleanupEffect = l(() => {
+			let t = this.isExpanded();
+			e.classList.toggle("is-expanded", t), e.classList.toggle("is-collapsed", !t), e.setAttribute("aria-expanded", String(t));
+			let n = e.querySelector(".body");
+			n && (n.style.display = t ? "block" : "none", n.setAttribute("aria-hidden", String(!t)), n.classList.toggle("is-expanded", t), n.classList.toggle("is-collapsed", !t));
+			let r = e.querySelector(".title");
+			r && r.setAttribute("aria-expanded", String(t));
+		}), e !== this && (e.toggle = () => this.toggle(), e.expand = () => this.expand(), e.collapse = () => this.collapse(), e.isExpanded = this.isExpanded, e.expandOrCollapseIcon = () => this.expandOrCollapseIcon());
+	}
+	onInit() {
+		let e = this;
+		e && typeof e.querySelector == "function" && this.initOnHost(e);
+	}
+	destroy() {
+		this.titleEl &&= (this.titleEl.removeEventListener("click", this.handleTitleClick), this.titleEl.removeEventListener("keydown", this.handleTitleKeydown), null), this.cleanupEffect &&= (this.cleanupEffect(), void 0), this.hostEl = null;
+	}
+	onDestroy() {
+		this.destroy();
+	}
+	toggle() {
+		this.isExpanded.update((e) => !e), this.dispatchToggleEvent();
+	}
+	expand() {
+		this.isExpanded() || (this.isExpanded.set(!0), this.dispatchToggleEvent());
+	}
+	collapse() {
+		this.isExpanded() && (this.isExpanded.set(!1), this.dispatchToggleEvent());
+	}
+	expandOrCollapseIcon() {
+		return this.isExpanded() ? "icon-collapse" : "icon-expand";
+	}
+	dispatchToggleEvent() {
+		let e = this.hostEl || this;
+		e && typeof e.dispatchEvent == "function" && e.dispatchEvent(new CustomEvent("change", {
+			detail: { isExpanded: this.isExpanded() },
+			bubbles: !0,
+			composed: !0
+		}));
+	}
+};
+r({
+	selector: "expander",
+	templateUrl: "./expander.component.html",
+	template: P
+})(F);
+//#endregion
+//#region src/app/shared/components/navigation-menu/navigation-menu.component.html?raw
+var I = "<div id=\"nav-ball\" class=\"nav-ball-container\" aria-label=\"Floating Navigation Menu\">\n    <!-- Hover Drag Handle -->\n    <div class=\"nav-drag-handle\" title=\"Drag to reposition navigation ball\">\n        <svg class=\"drag-grip-icon\" viewBox=\"0 0 24 24\" width=\"14\" height=\"14\" fill=\"currentColor\">\n            <circle cx=\"9\" cy=\"6\" r=\"1.5\"></circle>\n            <circle cx=\"15\" cy=\"6\" r=\"1.5\"></circle>\n            <circle cx=\"9\" cy=\"12\" r=\"1.5\"></circle>\n            <circle cx=\"15\" cy=\"12\" r=\"1.5\"></circle>\n            <circle cx=\"9\" cy=\"18\" r=\"1.5\"></circle>\n            <circle cx=\"15\" cy=\"18\" r=\"1.5\"></circle>\n        </svg>\n        <span class=\"handle-text\">DRAG</span>\n    </div>\n\n    <!-- Interactive Navigation Ball -->\n    <button\n        type=\"button\"\n        class=\"nav-ball-orb\"\n        id=\"nav-ball-trigger\"\n        title=\"Open Navigation Menu\"\n        onclick=\"onOrbClick(event)\"\n        aria-haspopup=\"menu\"\n        aria-expanded=\"{{isOpen()}}\"\n    >\n        <span class=\"orb-shine\"></span>\n        <span class=\"orb-glow\"></span>\n        <span class=\"orb-icon\">🧭</span>\n    </button>\n</div>\n\n<!-- Integrated Radial Context Menu -->\n<radial-context-menu id=\"nav-radial-menu\"></radial-context-menu>\n", L = class {
+	currentTheme = f("dark");
+	isDark = f(!0);
+	constructor() {
+		this.applyInitialTheme();
+	}
+	applyInitialTheme() {
+		if (typeof window > "u") return;
+		let e = null;
+		try {
+			e = window.localStorage?.getItem("purity-theme");
+		} catch {}
+		let t = e === "light" ? "light" : "dark";
+		this.applyTheme(t, !!e);
+	}
+	setTheme(e) {
+		this.applyTheme(e, !0);
+	}
+	toggleTheme() {
+		let e = this.currentTheme() === "dark" ? "light" : "dark";
+		this.setTheme(e);
+	}
+	applyTheme(e, t = !0) {
+		if (this.currentTheme.set(e), this.isDark.set(e === "dark"), t) try {
+			window.localStorage?.setItem("purity-theme", e);
+		} catch {}
+		typeof document < "u" && (document.documentElement.setAttribute("data-theme", e), document.body?.setAttribute("data-theme", e));
+	}
+};
+a("ThemeService")(L);
+//#endregion
+//#region src/app/shared/behaviors/droppable/droppable.ts
+var R = /* @__PURE__ */ new Set();
+function z(e) {
+	let t = u(e.selector);
+	if (!t) return console.warn(`Droppable behavior: Element "${e.selector}" not found.`), { destroy: () => {} };
+	let n = {
+		element: t,
+		options: e
+	};
+	return R.add(n), { destroy: () => {
+		R.delete(n);
+	} };
+}
+function B(e, t, n) {
+	for (let r of R) {
+		if (!r.element || !r.element.isConnected || r.element === n) continue;
+		let i = r.element.getBoundingClientRect();
+		if (e >= i.left && e <= i.right && t >= i.top && t <= i.bottom && V(r.options, n)) return r;
+	}
+	return null;
+}
+function V(e, t) {
+	return !e.accepts || t.matches(e.accepts);
+}
+//#endregion
+//#region src/app/shared/behaviors/draggable/draggable.ts
+function H(e) {
+	let t = u(e.selector);
+	if (!t) return console.warn(`Drag behavior: Element with selector "${e.selector}" not found.`), { destroy: () => {} };
+	let n = !1, r = 0, i = 0, a = 0, o = 0, s = 0, c = 0, l = 0, d = 0, f = 0, p = 0, m = 0, h = 0, g = null, _ = null, v = null, y = () => {
+		let e = window.getComputedStyle(t);
+		if (!e.transform || e.transform === "none") return {
+			x: 0,
+			y: 0
+		};
+		try {
+			let t = new DOMMatrix(e.transform);
+			return {
+				x: t.m41,
+				y: t.m42
+			};
+		} catch {
+			return {
+				x: 0,
+				y: 0
+			};
+		}
+	}, b = (n) => {
+		if (n.button !== 0) return;
+		let r = n.target;
+		if (r.closest("button, input, textarea, a, select")) return;
+		if (e.handle) {
+			if (_ = r.closest(e.handle), !_ || !t.contains(_) && _ !== t) {
+				_ = null;
+				return;
+			}
+		} else _ = t;
+		s = n.clientX, c = n.clientY;
+		let { x: i, y: l } = y();
+		a = i, o = l;
+	}, x = (y) => {
+		if (!_ && !n) return;
+		if (!n) {
+			let u = Math.abs(y.clientX - s), g = Math.abs(y.clientY - c);
+			if (u > 3 || g > 3) {
+				n = !0, r = s, i = c;
+				try {
+					t.setPointerCapture(y.pointerId);
+				} catch {}
+				t.classList.add("is-dragging");
+				let u = t.getBoundingClientRect();
+				l = u.left - a, d = u.top - o, f = u.width, p = u.height, m = window.scrollX, h = window.scrollY, e.onDragStart?.(t);
+			} else return;
+		}
+		let b = a + (y.clientX - r), x = o + (y.clientY - i), S = window.scrollX - m, C = window.scrollY - h, w = l - S, T = d - C, E = B(y.clientX, y.clientY, t);
+		if (E !== g) {
+			if (g) {
+				let e = g.options.hoverClass || "droppable-hover";
+				g.element.classList.remove(e), g.options.onLeave?.(t);
+			}
+			if (E) {
+				let e = E.options.hoverClass || "droppable-hover";
+				E.element.classList.add(e), E.options.onEnter?.(t);
+			}
+			g = E;
+		}
+		if (e.snapTo && g?.element.matches(e.snapTo)) {
+			let e = g.element.getBoundingClientRect(), n = e.left + e.width / 2, r = e.top + e.height / 2, i = w + f / 2, a = T + p / 2;
+			b = n - i, x = r - a, t.classList.add("snap-hit");
+		} else t.classList.remove("snap-hit");
+		let D = e.constrainTo ? e.constrainTo === "parent" ? t.parentElement : u(e.constrainTo) || t.closest(e.constrainTo) : null;
+		if (D && D !== document.body) {
+			let e = D.getBoundingClientRect(), t = e.left - w, n = e.right - (w + f), r = e.top - T, i = e.bottom - (T + p);
+			t <= n && (b = Math.max(t, Math.min(n, b))), r <= i && (x = Math.max(r, Math.min(i, x)));
+		}
+		e.onDragMove?.(t, b, x), v && cancelAnimationFrame(v), v = requestAnimationFrame(() => {
+			t.style.transform = `translate3d(${b}px, ${x}px, 0px)`, v = null;
+		});
+	}, S = (r) => {
+		if (!n) {
+			_ = null;
+			return;
+		}
+		if (v &&= (cancelAnimationFrame(v), null), e.onDragEnd?.(t), n = !1, t.hasPointerCapture(r.pointerId)) try {
+			t.releasePointerCapture(r.pointerId);
+		} catch {}
+		if (g) {
+			let e = g.options.hoverClass || "droppable-hover";
+			g.element.classList.remove(e), g.options.onDrop?.(t), g = null;
+		}
+		t.classList.remove("is-dragging", "snap-hit"), _ = null;
+	};
+	return t.addEventListener("pointerdown", b), t.addEventListener("pointermove", x), t.addEventListener("pointerup", S), t.addEventListener("pointercancel", S), t.classList.add("draggable-target"), { destroy: () => {
+		n = !1, v && cancelAnimationFrame(v), t.removeEventListener("pointerdown", b), t.removeEventListener("pointermove", x), t.removeEventListener("pointerup", S), t.removeEventListener("pointercancel", S), t.classList.remove("draggable-target", "is-dragging", "snap-hit");
+	} };
+}
+//#endregion
+//#region \0@oxc-project+runtime@0.146.0/helpers/esm/decorate.js
+function U(e, t, n, r) {
+	var i = arguments.length, a = i < 3 ? t : r === null ? r = Object.getOwnPropertyDescriptor(t, n) : r, o;
+	if (typeof Reflect == "object" && typeof Reflect.decorate == "function") a = Reflect.decorate(e, t, n, r);
+	else for (var s = e.length - 1; s >= 0; s--) (o = e[s]) && (a = (i < 3 ? o(a) : i > 3 ? o(t, n, a) : o(t, n)) || a);
+	return i > 3 && a && Object.defineProperty(t, n, a), a;
+}
+//#endregion
+//#region src/app/shared/components/navigation-menu/navigation-menu.component.ts
+var W = class {
+	themeService = d(L);
+	isOpen = f(!1);
+	radialMenu;
+	navBallEl;
+	dragInstance;
+	wasDragged = !1;
+	onInit() {
+		this.initMenu(), this.initDrag();
+	}
+	onDestroy() {
+		this.dragInstance?.destroy();
+	}
+	disconnectedCallback() {
+		this.onDestroy();
+	}
+	initDrag() {
+		this.dragInstance = H({
+			selector: "#nav-ball",
+			handle: "#nav-ball",
+			onDragStart: () => {
+				this.wasDragged = !0, this.radialMenu?.close();
+			},
+			onDragEnd: () => {
+				setTimeout(() => {
+					this.wasDragged = !1;
+				}, 100);
+			}
+		});
+	}
+	initMenu() {
+		let e = [
+			{
+				name: "Core",
+				image: "⚡",
+				children: [
+					{
+						name: "Signal Router",
+						image: "🗺️",
+						data: { hash: "#router-sample" }
+					},
+					{
+						name: "Conditionals (if)",
+						image: "🔀",
+						data: { hash: "#if-sample" }
+					},
+					{
+						name: "Array Repeater",
+						image: "🔁",
+						data: { hash: "#for-sample" }
+					},
+					{
+						name: "Virtual Scroll (100k)",
+						image: "⚡",
+						data: { hash: "#virtual-for-sample" }
+					},
+					{
+						name: "Transform Pipes",
+						image: "🏷️",
+						data: { hash: "#pipe-sample" }
+					},
+					{
+						name: "DOM Directives",
+						image: "🎯",
+						data: { hash: "#directive-sample" }
+					},
+					{
+						name: "Form Validation",
+						image: "📋",
+						data: { hash: "#forms-validation" }
+					},
+					{
+						name: "HTTP Client",
+						image: "🌐",
+						data: { hash: "#http-sample" }
+					}
+				]
+			},
+			{
+				name: "UI Components",
+				image: "🧩",
+				children: [
+					{
+						name: "Expander",
+						image: "↕️",
+						data: { hash: "#expander-sample" }
+					},
+					{
+						name: "Switch Button",
+						image: "🎛️",
+						data: { hash: "#switch-button-sample" }
+					},
+					{
+						name: "Date Time Picker",
+						image: "📅",
+						data: { hash: "#date-time-picker-sample" }
+					},
+					{
+						name: "Modal Dialog",
+						image: "🪟",
+						data: { hash: "#modal-sample" }
+					},
+					{
+						name: "Popover Anchoring",
+						image: "💬",
+						data: { hash: "#popover-sample" }
+					},
+					{
+						name: "Toast Notify",
+						image: "🔔",
+						data: { hash: "#notification-sample" }
+					},
+					{
+						name: "Radial Menu",
+						image: "🔘",
+						data: { hash: "#radial-context-menu-sample" }
+					},
+					{
+						name: "Async Loader",
+						image: "⏳",
+						data: { hash: "#app-loader" }
+					}
+				]
+			},
+			{
+				name: "Widgets",
+				image: "⏱️",
+				children: [{
+					name: "Analogue Clock",
+					image: "🕒",
+					data: { hash: "#analogue-clock-sample" }
+				}]
+			},
+			{
+				name: "Theme",
+				image: "🎨",
+				children: [
+					{
+						name: "Dark Theme",
+						image: "🌙",
+						data: { theme: "dark" }
+					},
+					{
+						name: "Light Theme",
+						image: "☀️",
+						data: { theme: "light" }
+					},
+					{
+						name: "Toggle Theme",
+						image: "🌓",
+						data: { theme: "toggle" }
+					}
+				]
+			},
+			{
+				name: "Playground",
+				image: "🎮",
+				data: { hash: "#playground-window" }
+			},
+			{
+				name: "Overview / Intro",
+				image: "🏠",
+				data: { hash: ".intro-component-root" }
+			}
+		];
+		this.radialMenu ? (this.radialMenu.setItems(e), this.radialMenu.radius.set(155), this.radialMenu.onSelectItem = (e) => this.handleNavigate(e), this.radialMenu.onOpen = () => this.isOpen.set(!0), this.radialMenu.onClose = () => this.isOpen.set(!1)) : setTimeout(() => {
+			this.radialMenu && (this.radialMenu.setItems(e), this.radialMenu.radius.set(155), this.radialMenu.onSelectItem = (e) => this.handleNavigate(e), this.radialMenu.onOpen = () => this.isOpen.set(!0), this.radialMenu.onClose = () => this.isOpen.set(!1));
+		}, 50);
+	}
+	onOrbClick(e) {
+		if (e.stopPropagation(), this.wasDragged || !this.radialMenu) return;
+		if (this.radialMenu.isOpen()) {
+			this.radialMenu.close();
+			return;
+		}
+		let t = this.navBallEl || document.querySelector("#nav-ball"), n = window.innerWidth - 60, r = window.innerHeight - 60;
+		if (t) {
+			let e = t.getBoundingClientRect();
+			n = e.left + e.width / 2, r = e.top + e.height / 2;
+		}
+		this.radialMenu.open(n, r);
+	}
+	handleNavigate(e) {
+		if (e.data?.theme) {
+			e.data.theme === "toggle" ? this.themeService.toggleTheme() : (e.data.theme === "dark" || e.data.theme === "light") && this.themeService.setTheme(e.data.theme);
+			return;
+		}
+		let t = e.data?.hash;
+		if (!t || typeof document > "u") return;
+		let n = document.querySelector("#demo-window");
+		if ((n && n.querySelector(t) || t.includes("sample") || t.includes("forms") || t.includes("app-loader") || t.includes("demo")) && n && (n.classList.remove("demo-hidden"), n.classList.add("demo-visible")), t.startsWith("#")) try {
+			history.pushState(null, "", t);
+		} catch {
+			window.location.hash = t;
+		}
+		setTimeout(() => {
+			let e = document.querySelector(t);
+			e && (e.scrollIntoView({
+				behavior: "smooth",
+				block: "start"
+			}), e.classList.remove("p-nav-highlight"), e.offsetHeight, e.classList.add("p-nav-highlight"), setTimeout(() => {
+				e.classList.remove("p-nav-highlight");
+			}, 1900));
+		}, 120);
+	}
+};
+U([c("#nav-radial-menu")], W.prototype, "radialMenu", void 0), U([c("#nav-ball")], W.prototype, "navBallEl", void 0), r({
+	selector: "navigation-menu",
+	templateUrl: "./src/app/shared/components/navigation-menu/navigation-menu.component.html",
+	template: I
+})(W);
+//#endregion
+//#region src/app/shared/widgets/analogue-clock/analogue-clock.component.html?raw
+var G = "<div class=\"analogue-clock-widget\">\n    <!-- Header Bar -->\n    <div class=\"clock-header\">\n        <div class=\"clock-title-group\">\n            <span class=\"clock-icon\">⏱️</span>\n            <span class=\"clock-title\">{{title()}}</span>\n            <span class=\"clock-badge\">{{smoothSeconds() ? 'Smooth' : 'Quartz'}}</span>\n        </div>\n        <div class=\"clock-tz-badge\" title=\"Active Timezone\">\n            <span class=\"tz-icon\">🌐</span>\n            <span class=\"tz-text\">{{timezoneLabel()}}</span>\n        </div>\n    </div>\n\n    <!-- Clock Canvas Stage -->\n    <div class=\"clock-stage\">\n        <canvas\n            id=\"clock-canvas-el\"\n            class=\"clock-canvas\"\n            title=\"Click to toggle Smooth / Quartz ticking\"\n            onclick=\"toggleSweep()\"\n        ></canvas>\n    </div>\n\n    <!-- Digital Readout Display -->\n    <div class=\"clock-digital-readout\">\n        <span class=\"digital-time\">{{digitalTime()}}</span>\n        <span class=\"digital-date\">{{dateString()}}</span>\n    </div>\n\n    <!-- Interactive Controls Bar -->\n    <div class=\"clock-controls\">\n        <button\n            type=\"button\"\n            class=\"button-secondary clock-control-btn {{smoothSeconds() ? 'is-active' : ''}}\"\n            onclick=\"toggleSweep()\"\n            title=\"Toggle between continuous smooth sweep and precision quartz step\"\n        >\n            <span>{{smoothSeconds() ? '⚡ Smooth Sweep' : '⏱ Precision Tick'}}</span>\n        </button>\n\n        <button\n            type=\"button\"\n            class=\"button-secondary clock-control-btn {{showSeconds() ? 'is-active' : ''}}\"\n            onclick=\"toggleSeconds()\"\n            title=\"Toggle second hand visibility\"\n        >\n            <span>{{showSeconds() ? '🔴 Seconds Hand' : '⚪ Hide Seconds'}}</span>\n        </button>\n\n        <button\n            type=\"button\"\n            class=\"button-secondary clock-control-btn {{showNumbers() ? 'is-active' : ''}}\"\n            onclick=\"toggleNumbers()\"\n            title=\"Toggle dial numerals\"\n        >\n            <span>{{showNumbers() ? '🔢 12/3/6/9 Numerals' : '➖ Minimal Indices'}}</span>\n        </button>\n\n        <button\n            type=\"button\"\n            class=\"button-secondary clock-control-btn {{showDateBadge() ? 'is-active' : ''}}\"\n            onclick=\"toggleDateBadge()\"\n            title=\"Toggle dial date aperture window\"\n        >\n            <span>{{showDateBadge() ? '📅 Date Aperture' : '🔲 Clean Dial'}}</span>\n        </button>\n\n        <dropdown label=\"{{timezoneLabel()}}\" class=\"tz-dropdown\">\n            <ul>\n                <li onclick=\"onTimezoneChange('local')\" class=\"{{timezone() === 'local' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">📍</span>\n                    <span class=\"item-text\">Local Time</span>\n                </li>\n                <li onclick=\"onTimezoneChange('UTC')\" class=\"{{timezone() === 'UTC' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🌐</span>\n                    <span class=\"item-text\">UTC / GMT</span>\n                </li>\n                <li onclick=\"onTimezoneChange('America/New_York')\" class=\"{{timezone() === 'America/New_York' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🗽</span>\n                    <span class=\"item-text\">New York (EST/EDT)</span>\n                </li>\n                <li onclick=\"onTimezoneChange('Europe/London')\" class=\"{{timezone() === 'Europe/London' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🇬🇧</span>\n                    <span class=\"item-text\">London (GMT/BST)</span>\n                </li>\n                <li onclick=\"onTimezoneChange('Europe/Paris')\" class=\"{{timezone() === 'Europe/Paris' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🇫🇷</span>\n                    <span class=\"item-text\">Paris (CET/CEST)</span>\n                </li>\n                <li onclick=\"onTimezoneChange('Asia/Tokyo')\" class=\"{{timezone() === 'Asia/Tokyo' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🇯🇵</span>\n                    <span class=\"item-text\">Tokyo (JST)</span>\n                </li>\n                <li onclick=\"onTimezoneChange('Australia/Sydney')\" class=\"{{timezone() === 'Australia/Sydney' ? 'is-selected' : ''}}\">\n                    <span class=\"item-icon\">🇦🇺</span>\n                    <span class=\"item-text\">Sydney (AEST/AEDT)</span>\n                </li>\n            </ul>\n        </dropdown>\n    </div>\n</div>\n", K = class {
+	themeService = d(L);
+	canvasEl;
+	size = f(280);
+	title = f("Purity Chrono");
+	timezone = f("local");
+	smoothSeconds = f(!0);
+	showSeconds = f(!0);
+	showNumbers = f(!0);
+	showDateBadge = f(!0);
+	digitalTime = f("00:00:00");
+	dateString = f("");
+	timezoneLabel = f("Local Time");
+	animationFrameId = null;
+	ctx = null;
+	onInit() {
+		let e = this;
+		if (e && typeof e.getAttribute == "function") {
+			let t = e.getAttribute("title");
+			t && this.title.set(t);
+			let n = e.getAttribute("timezone");
+			n && this.timezone.set(n);
+			let r = e.getAttribute("size");
+			if (r) {
+				let e = parseFloat(r);
+				isNaN(e) || this.size.set(e);
+			}
+			let i = e.getAttribute("smooth-seconds");
+			i !== null && this.smoothSeconds.set(i === "true" || i === "");
+			let a = e.getAttribute("show-seconds");
+			a !== null && this.showSeconds.set(a === "true" || a === "");
+			let o = e.getAttribute("show-numbers");
+			o !== null && this.showNumbers.set(o === "true" || o === "");
+			let s = e.getAttribute("show-date-badge");
+			s !== null && this.showDateBadge.set(s === "true" || s === "");
+		}
+		l(() => {
+			this.themeService.isDark(), this.smoothSeconds(), this.showSeconds(), this.showNumbers(), this.showDateBadge(), this.timezone(), this.size(), this.updateLabels(), this.initCanvas();
+		}), this.initCanvas(), this.startClockLoop();
+	}
+	onDestroy() {
+		this.stopClockLoop();
+	}
+	disconnectedCallback() {
+		this.stopClockLoop();
+	}
+	initCanvas() {
+		let e = this?.querySelector?.("canvas") || this.canvasEl || document.querySelector("#clock-canvas-el");
+		if (!e) return;
+		let t = this.size(), n = typeof window < "u" && window.devicePixelRatio || 1;
+		e.width = t * n, e.height = t * n, e.style.width = `${t}px`, e.style.height = `${t}px`, this.ctx = e.getContext("2d"), this.ctx && (this.ctx.setTransform(1, 0, 0, 1, 0, 0), this.ctx.scale(n, n));
+	}
+	startClockLoop() {
+		this.stopClockLoop();
+		let e = () => {
+			this.renderClock(), this.animationFrameId = requestAnimationFrame(e);
+		};
+		this.animationFrameId = requestAnimationFrame(e);
+	}
+	stopClockLoop() {
+		this.animationFrameId !== null && (cancelAnimationFrame(this.animationFrameId), this.animationFrameId = null);
+	}
+	getTimeData() {
+		let e = /* @__PURE__ */ new Date(), t = e, n = this.timezone();
+		if (n !== "local") try {
+			let r = e.toLocaleString("en-US", { timeZone: n });
+			t = new Date(r);
+		} catch {
+			t = e;
+		}
+		let r = t.getHours(), i = t.getMinutes(), a = t.getSeconds(), o = t.getMilliseconds(), s = `${String(r).padStart(2, "0")}:${String(i).padStart(2, "0")}:${String(a).padStart(2, "0")}`, c = t.toLocaleDateString("en-US", { weekday: "short" }).toUpperCase(), l = t.toLocaleDateString("en-US", { month: "short" }).toUpperCase(), u = t.getDate();
+		return {
+			hours: r,
+			minutes: i,
+			seconds: a,
+			millis: o,
+			digitalStr: s,
+			dateStr: `${c}, ${l} ${u}`,
+			dayName: c,
+			dayNum: u
+		};
+	}
+	updateLabels() {
+		let e = this.timezone();
+		if (e === "local") this.timezoneLabel.set("Local Time");
+		else if (e === "UTC") this.timezoneLabel.set("UTC / GMT");
+		else {
+			let t = e.split("/").pop()?.replace(/_/g, " ") || e;
+			this.timezoneLabel.set(t);
+		}
+	}
+	renderClock() {
+		if (!(this.canvasEl || document.querySelector("#clock-canvas-el")) || !this.ctx && (this.initCanvas(), !this.ctx)) return;
+		let e = this.ctx, t = this.size(), n = t / 2, r = t / 2, i = t * .44, a = this.themeService.isDark(), o = this.getTimeData();
+		this.digitalTime.set(o.digitalStr), this.dateString.set(o.dateStr), e.clearRect(0, 0, t, t), this.drawBezel(e, n, r, i, a), this.drawDialFace(e, n, r, i, a), this.showDateBadge() && this.drawDateAperture(e, n, r, i, o.dayName, o.dayNum, a), this.drawMarkersAndTicks(e, n, r, i, a), this.showNumbers() && this.drawNumerals(e, n, r, i, a), this.drawGlassReflection(e, n, r, i, a);
+		let s = this.smoothSeconds() ? o.seconds + o.millis / 1e3 : o.seconds, c = o.minutes + s / 60, l = (o.hours % 12 + c / 60) * (Math.PI / 6) - Math.PI / 2, u = Math.PI / 30 * c - Math.PI / 2, d = Math.PI / 30 * s - Math.PI / 2;
+		this.drawHourHand(e, n, r, i, l, a), this.drawMinuteHand(e, n, r, i, u, a), this.showSeconds() && this.drawSecondHand(e, n, r, i, d, a), this.drawCenterPivot(e, n, r, t, a);
+	}
+	drawBezel(e, t, n, r, i) {
+		let a = r + r * .14;
+		e.save(), e.beginPath(), e.arc(t, n, a, 0, Math.PI * 2), e.shadowColor = i ? "rgba(0, 0, 0, 0.65)" : "rgba(0, 0, 0, 0.18)", e.shadowBlur = i ? 28 : 18, e.shadowOffsetX = 0, e.shadowOffsetY = i ? 12 : 8, e.fillStyle = i ? "#1a1d26" : "#e6ebf2", e.fill(), e.shadowColor = "transparent";
+		let o = e.createLinearGradient(t - a, n - a, t + a, n + a);
+		i ? (o.addColorStop(0, "rgba(85, 95, 115, 0.9)"), o.addColorStop(.25, "rgba(40, 45, 58, 0.95)"), o.addColorStop(.5, "rgba(75, 85, 105, 0.85)"), o.addColorStop(.75, "rgba(30, 34, 44, 0.98)"), o.addColorStop(1, "rgba(95, 108, 130, 0.9)")) : (o.addColorStop(0, "rgba(255, 255, 255, 0.98)"), o.addColorStop(.25, "rgba(215, 222, 232, 0.95)"), o.addColorStop(.5, "rgba(245, 248, 252, 0.98)"), o.addColorStop(.75, "rgba(205, 214, 226, 0.95)"), o.addColorStop(1, "rgba(255, 255, 255, 0.98)")), e.beginPath(), e.arc(t, n, a, 0, Math.PI * 2), e.fillStyle = o, e.fill(), e.beginPath(), e.arc(t, n, a, 0, Math.PI * 2), e.strokeStyle = i ? "rgba(255, 255, 255, 0.22)" : "rgba(255, 255, 255, 0.9)", e.lineWidth = 1.5, e.stroke(), e.beginPath(), e.arc(t, n, r + 1, 0, Math.PI * 2), e.strokeStyle = i ? "rgba(0, 0, 0, 0.7)" : "rgba(0, 0, 0, 0.12)", e.lineWidth = 1.5, e.stroke(), e.restore();
+	}
+	drawDialFace(e, t, n, r, i) {
+		e.save();
+		let a = e.createRadialGradient(t, n * .9, r * .1, t, n, r);
+		i ? (a.addColorStop(0, "rgba(34, 38, 52, 0.96)"), a.addColorStop(.65, "rgba(22, 25, 36, 0.98)"), a.addColorStop(1, "rgba(14, 16, 24, 1.0)")) : (a.addColorStop(0, "rgba(255, 255, 255, 0.98)"), a.addColorStop(.65, "rgba(244, 247, 252, 0.96)"), a.addColorStop(1, "rgba(230, 236, 246, 0.98)")), e.beginPath(), e.arc(t, n, r, 0, Math.PI * 2), e.fillStyle = a, e.fill(), e.beginPath(), e.arc(t, n, r - .5, 0, Math.PI * 2), e.strokeStyle = i ? "rgba(0, 0, 0, 0.45)" : "rgba(0, 0, 0, 0.08)", e.lineWidth = 2, e.stroke(), e.beginPath(), e.arc(t, n, r * .83, 0, Math.PI * 2), e.strokeStyle = i ? "rgba(255, 255, 255, 0.06)" : "rgba(0, 0, 0, 0.05)", e.lineWidth = 1, e.stroke(), e.beginPath(), e.arc(t, n, r * .54, 0, Math.PI * 2), e.strokeStyle = i ? "rgba(255, 255, 255, 0.035)" : "rgba(0, 0, 0, 0.035)", e.lineWidth = 1, e.stroke(), e.textAlign = "center", e.textBaseline = "middle", e.font = "700 9px -apple-system, BlinkMacSystemFont, \"Segoe UI\", Roboto, sans-serif", e.fillStyle = i ? "rgba(255, 255, 255, 0.35)" : "rgba(0, 0, 0, 0.38)", e.letterSpacing = "2px", e.fillText("PURITY", t, n - r * .34), e.font = "500 7px \"Adwaita Mono\", monospace", e.fillStyle = i ? "rgba(53, 132, 228, 0.75)" : "rgba(28, 113, 216, 0.85)", e.fillText("AUTOMATIC", t, n - r * .24), e.restore();
+	}
+	drawDateAperture(e, t, n, r, i, a, o) {
+		e.save();
+		let s = r * .44, c = r * .16, l = t + r * .28, u = n - c / 2;
+		e.beginPath(), e.roundRect(l, u, s, c, 4), e.fillStyle = o ? "rgba(16, 18, 26, 0.95)" : "rgba(255, 255, 255, 0.98)", e.fill(), e.strokeStyle = o ? "rgba(255, 255, 255, 0.14)" : "rgba(0, 0, 0, 0.14)", e.lineWidth = 1, e.stroke();
+		let d = l + s * .48;
+		e.beginPath(), e.moveTo(d, u + 2), e.lineTo(d, u + c - 2), e.strokeStyle = o ? "rgba(255, 255, 255, 0.08)" : "rgba(0, 0, 0, 0.08)", e.stroke(), e.textAlign = "center", e.textBaseline = "middle", e.font = "700 8.5px \"Adwaita Mono\", monospace", e.fillStyle = o ? "#3584e4" : "#1c71d8", e.fillText(i, l + s * .24, n), e.font = "700 10px \"Adwaita Mono\", monospace", e.fillStyle = o ? "#ffffff" : "#1c1c1c", e.fillText(String(a).padStart(2, "0"), l + s * .74, n), e.restore();
+	}
+	drawMarkersAndTicks(e, t, n, r, i) {
+		e.save();
+		for (let a = 0; a < 60; a++) {
+			let o = Math.PI / 30 * a - Math.PI / 2, s = Math.cos(o), c = Math.sin(o);
+			if (a % 5 == 0) {
+				let o = a % 15 == 0, l = o ? r * .78 : r * .81, u = r * .93, d = o ? 3.5 : 2.5, f = t + l * s, p = n + l * c, m = t + u * s, h = n + u * c;
+				if (e.beginPath(), e.moveTo(f, p), e.lineTo(m, h), e.lineWidth = d, e.lineCap = "round", o ? (e.strokeStyle = i ? "#ffffff" : "#1c1c1c", e.shadowColor = i ? "rgba(53, 132, 228, 0.6)" : "rgba(28, 113, 216, 0.3)", e.shadowBlur = 4) : (e.strokeStyle = i ? "rgba(255, 255, 255, 0.85)" : "rgba(40, 45, 55, 0.85)", e.shadowBlur = 0), e.stroke(), o) {
+					let a = r * .74, o = t + a * s, l = n + a * c;
+					e.beginPath(), e.arc(o, l, 2, 0, Math.PI * 2), e.fillStyle = i ? "#3584e4" : "#1c71d8", e.fill();
+				}
+			} else {
+				let a = r * .88, o = r * .93, l = t + a * s, u = n + a * c, d = t + o * s, f = n + o * c;
+				e.beginPath(), e.moveTo(l, u), e.lineTo(d, f), e.lineWidth = 1, e.lineCap = "butt", e.strokeStyle = i ? "rgba(255, 255, 255, 0.28)" : "rgba(0, 0, 0, 0.24)", e.shadowBlur = 0, e.stroke();
+			}
+		}
+		e.restore();
+	}
+	drawNumerals(e, t, n, r, i) {
+		e.save(), e.textAlign = "center", e.textBaseline = "middle", e.font = "700 13px \"Adwaita Mono\", -apple-system, monospace", e.fillStyle = i ? "rgba(255, 255, 255, 0.9)" : "#1c1c1c";
+		let a = r * .67;
+		e.fillText("12", t, n - a), e.fillText("6", t, n + a), e.fillText("9", t - a, n), this.showDateBadge() || e.fillText("3", t + a, n), e.restore();
+	}
+	drawGlassReflection(e, t, n, r, i) {
+		e.save(), e.beginPath(), e.arc(t, n, r - 1, 0, Math.PI * 2), e.clip();
+		let a = e.createLinearGradient(t - r, n - r, t + r, n + r * .2);
+		i ? (a.addColorStop(0, "rgba(255, 255, 255, 0.16)"), a.addColorStop(.35, "rgba(255, 255, 255, 0.05)"), a.addColorStop(.7, "rgba(255, 255, 255, 0.0)")) : (a.addColorStop(0, "rgba(255, 255, 255, 0.55)"), a.addColorStop(.35, "rgba(255, 255, 255, 0.2)"), a.addColorStop(.7, "rgba(255, 255, 255, 0.0)")), e.beginPath(), e.ellipse(t, n - r * .22, r * .92, r * .65, -.2, 0, Math.PI * 2), e.fillStyle = a, e.fill();
+		let o = e.createRadialGradient(t, n + r * .9, r * .05, t, n + r * .9, r * .45);
+		o.addColorStop(0, i ? "rgba(53, 132, 228, 0.12)" : "rgba(255, 255, 255, 0.4)"), o.addColorStop(1, "rgba(255, 255, 255, 0.0)"), e.beginPath(), e.arc(t, n, r, 0, Math.PI * 2), e.fillStyle = o, e.fill(), e.restore();
+	}
+	drawHourHand(e, t, n, r, i, a) {
+		e.save(), e.translate(t, n), e.rotate(i);
+		let o = r * .52, s = r * .09, c = r * .12;
+		e.shadowColor = a ? "rgba(0, 0, 0, 0.65)" : "rgba(0, 0, 0, 0.25)", e.shadowBlur = 8, e.shadowOffsetX = 3, e.shadowOffsetY = 4, e.beginPath(), e.moveTo(-c, 0), e.lineTo(0, -s / 2), e.lineTo(o, 0), e.closePath(), e.fillStyle = a ? "#ffffff" : "#282e38", e.fill(), e.beginPath(), e.moveTo(-c, 0), e.lineTo(0, s / 2), e.lineTo(o, 0), e.closePath(), e.fillStyle = a ? "#98a2b5" : "#4b5563", e.fill(), e.restore();
+	}
+	drawMinuteHand(e, t, n, r, i, a) {
+		e.save(), e.translate(t, n), e.rotate(i);
+		let o = r * .76, s = r * .07, c = r * .14;
+		e.shadowColor = a ? "rgba(0, 0, 0, 0.65)" : "rgba(0, 0, 0, 0.25)", e.shadowBlur = 10, e.shadowOffsetX = 3, e.shadowOffsetY = 5, e.beginPath(), e.moveTo(-c, 0), e.lineTo(0, -s / 2), e.lineTo(o, 0), e.closePath(), e.fillStyle = a ? "#ffffff" : "#282e38", e.fill(), e.beginPath(), e.moveTo(-c, 0), e.lineTo(0, s / 2), e.lineTo(o, 0), e.closePath(), e.fillStyle = a ? "#8a94a6" : "#475366", e.fill(), e.restore();
+	}
+	drawSecondHand(e, t, n, r, i, a) {
+		e.save(), e.translate(t, n), e.rotate(i);
+		let o = r * .86, s = r * .22, c = a ? "#3584e4" : "#1c71d8";
+		e.shadowColor = a ? "rgba(0, 0, 0, 0.55)" : "rgba(0, 0, 0, 0.2)", e.shadowBlur = 6, e.shadowOffsetX = 2, e.shadowOffsetY = 3, e.beginPath(), e.moveTo(-s, 0), e.lineTo(o, 0), e.strokeStyle = c, e.lineWidth = 1.5, e.lineCap = "round", e.stroke(), e.beginPath(), e.arc(-s * .55, 0, 4.5, 0, Math.PI * 2), e.fillStyle = c, e.fill(), e.beginPath(), e.arc(-s * .55, 0, 2.2, 0, Math.PI * 2), e.fillStyle = a ? "#141620" : "#ffffff", e.fill(), e.beginPath(), e.arc(o - 4, 0, 2.5, 0, Math.PI * 2), e.fillStyle = a ? "#78aeed" : "#3584e4", e.shadowColor = c, e.shadowBlur = 8, e.fill(), e.restore();
+	}
+	drawCenterPivot(e, t, n, r, i) {
+		e.save();
+		let a = r * .038, o = r * .024, s = r * .012;
+		e.beginPath(), e.arc(t, n, a, 0, Math.PI * 2), e.shadowColor = "rgba(0, 0, 0, 0.5)", e.shadowBlur = 6, e.fillStyle = i ? "#2e3442" : "#cbd5e1", e.fill(), e.strokeStyle = i ? "rgba(255, 255, 255, 0.4)" : "rgba(0, 0, 0, 0.15)", e.lineWidth = 1, e.stroke(), e.shadowColor = "transparent";
+		let c = e.createLinearGradient(t - o, n - o, t + o, n + o);
+		i ? (c.addColorStop(0, "#ffffff"), c.addColorStop(.5, "#7b879c"), c.addColorStop(1, "#2b313d")) : (c.addColorStop(0, "#ffffff"), c.addColorStop(.5, "#e2e8f0"), c.addColorStop(1, "#94a3b8")), e.beginPath(), e.arc(t, n, o, 0, Math.PI * 2), e.fillStyle = c, e.fill(), e.beginPath(), e.arc(t, n, s, 0, Math.PI * 2), e.fillStyle = i ? "#3584e4" : "#1c71d8", e.shadowColor = i ? "#3584e4" : "#1c71d8", e.shadowBlur = 4, e.fill(), e.restore();
+	}
+	toggleSweep() {
+		this.smoothSeconds.update((e) => !e);
+	}
+	toggleSeconds() {
+		this.showSeconds.update((e) => !e);
+	}
+	toggleNumbers() {
+		this.showNumbers.update((e) => !e);
+	}
+	toggleDateBadge() {
+		this.showDateBadge.update((e) => !e);
+	}
+	onTimezoneChange(e) {
+		this.timezone.set(e || "local"), this.updateLabels();
+	}
+};
+U([c("#clock-canvas-el")], K.prototype, "canvasEl", void 0), r({
+	selector: "analogue-clock",
+	templateUrl: "./src/app/shared/widgets/analogue-clock/analogue-clock.component.html",
+	template: G
+})(K);
+//#endregion
+//#region src/app/shared/interceptors/auth.interceptor.ts
+var q = class {
+	token = "purity_jwt_sample_token";
+	setToken(e) {
+		this.token = e;
+	}
+	async intercept(e, t) {
+		return e.headers.has("Authorization") ? t(e) : t(e.clone({ headers: e.headers.set("Authorization", `Bearer ${this.token}`) }));
+	}
+}, J = class {
+	async intercept(e, t) {
+		let n = performance.now(), r = (/* @__PURE__ */ new Date()).toLocaleTimeString();
+		console.log(`%c[HTTP Request] ${r} %c${e.method} %c${e.url}`, "color: #9a9996;", "color: #3584e4; font-weight: bold;", "color: var(--text-main, #ffffff);");
+		try {
+			let i = await t(e), a = Math.round(performance.now() - n);
+			return console.log(`%c[HTTP Response] ${r} %c${e.method} ${e.url} %c-> ${i.status} ${i.statusText} (${a}ms)`, "color: #9a9996;", "color: #2ec27e; font-weight: bold;", "color: #2ec27e;"), i;
+		} catch (t) {
+			let i = Math.round(performance.now() - n);
+			throw console.error(`%c[HTTP Error] ${r} %c${e.method} ${e.url} %cfailed (${t.status || "Network"}) in ${i}ms:`, "color: #9a9996;", "color: #e01b24; font-weight: bold;", "color: #e01b24;", t), t;
+		}
+	}
+}, Y = [
+	"Jan",
+	"Feb",
+	"Mar",
+	"Apr",
+	"May",
+	"Jun",
+	"Jul",
+	"Aug",
+	"Sep",
+	"Oct",
+	"Nov",
+	"Dec"
+], ee = [
+	"January",
+	"February",
+	"March",
+	"April",
+	"May",
+	"June",
+	"July",
+	"August",
+	"September",
+	"October",
+	"November",
+	"December"
+], te = [
+	"Sun",
+	"Mon",
+	"Tue",
+	"Wed",
+	"Thu",
+	"Fri",
+	"Sat"
+], ne = [
+	"Sunday",
+	"Monday",
+	"Tuesday",
+	"Wednesday",
+	"Thursday",
+	"Friday",
+	"Saturday"
+], re = {
+	short: "M/d/yy, h:mm a",
+	medium: "MMM d, yyyy, h:mm:ss a",
+	long: "MMMM d, yyyy, h:mm:ss a",
+	full: "EEEE, MMMM d, yyyy, h:mm:ss a",
+	shortDate: "M/d/yy",
+	mediumDate: "MMM d, yyyy",
+	longDate: "MMMM d, yyyy",
+	fullDate: "EEEE, MMMM d, yyyy",
+	shortTime: "h:mm a",
+	mediumTime: "h:mm:ss a"
+}, X = class extends t {
+	transform(e, t = "mediumDate") {
+		if (e == null || e === "") return "";
+		let n;
+		if (e instanceof Date) n = e;
+		else if (typeof e == "number" || typeof e == "string") n = new Date(e);
+		else return "";
+		if (isNaN(n.getTime())) return "";
+		let r = re[t] || t;
+		return this.formatDate(n, r);
+	}
+	formatDate(e, t) {
+		let n = e.getFullYear(), r = e.getMonth(), i = e.getDate(), a = e.getDay(), o = e.getHours(), s = o % 12 || 12, c = e.getMinutes(), l = e.getSeconds(), u = o >= 12 ? "PM" : "AM", d = (e, t = 2) => String(e).padStart(t, "0");
+		return t.replace(/(EEEE|EEE|yyyy|yy|MMMM|MMM|MM|M|dd|d|HH|H|hh|h|mm|m|ss|s|a)/g, (e) => {
+			switch (e) {
+				case "EEEE": return ne[a];
+				case "EEE": return te[a];
+				case "yyyy": return String(n);
+				case "yy": return String(n).slice(-2);
+				case "MMMM": return ee[r];
+				case "MMM": return Y[r];
+				case "MM": return d(r + 1);
+				case "M": return String(r + 1);
+				case "dd": return d(i);
+				case "d": return String(i);
+				case "HH": return d(o);
+				case "H": return String(o);
+				case "hh": return d(s);
+				case "h": return String(s);
+				case "mm": return d(c);
+				case "m": return String(c);
+				case "ss": return d(l);
+				case "s": return String(l);
+				case "a": return u;
+				default: return e;
+			}
+		});
+	}
+};
+o("date")(X);
+//#endregion
+//#region src/app/shared/pipes/transform-sample.pipe.ts
+var Z = class extends t {
+	transform(e, t = !1, n) {
+		if (e == null) return "";
+		let r = String(e);
+		return t && (r = r.toUpperCase()), n ? `${n}: ${r}` : r;
+	}
+};
+o("myTransformPipe")(Z);
+//#endregion
+//#region src/app/shared/pipes/uppercase.pipe.ts
+var Q = class extends t {
+	transform(e) {
+		return e == null ? "" : String(e).toUpperCase();
+	}
+};
+o("uppercase")(Q);
+//#endregion
+//#region src/app/shared/validators/forms-validation.validator.ts
+var $ = class extends n {
+	validateInput1(e) {
+		return e.trim().length >= 3;
+	}
+	validateInput2(e) {
+		return e.trim().length >= 5;
+	}
+};
+s({
+	form: ".forms-validation-form",
+	fields: {
+		input1: "#input1",
+		input2: "#input2"
+	},
+	validClass: "is-valid",
+	invalidClass: "is-invalid"
+})($);
+//#endregion
+export { K as AnalogueClockComponent, q as AuthInterceptor, X as DatePipe, S as DateTimePickerComponent, h as DropDownDirective, h as DropdownComponent, h as DropdownDirective, F as ExpanderComponent, $ as FormsValidationValidator, g as HighlightDirective, O as LoaderComponent, J as LoggingInterceptor, b as ModalViewComponent, Z as MyTransformPipe, Z as TransformSamplePipe, W as NavigationMenuComponent, E as NotificationComponent, w as NotifyService, A as PopoverComponent, j as PopoverDirective, N as RadialContextMenuComponent, v as SwitchButtonComponent, L as ThemeService, Q as UppercasePipe, H as drag, H as draggable, z as droppable, B as findDropTarget };