@forgeroute/ui 0.4.48 → 0.4.50

package/fesm2022/forgeroute-ui.mjs

@@ -11764,6 +11764,8 @@ var DataTableComponent = class DataTableComponent {
 			}))];
 		}, ...ngDevMode ? [{ debugName: "_effectiveTabs" }] : /* istanbul ignore next */ []);
 		this._error = signal(null, ...ngDevMode ? [{ debugName: "_error" }] : /* istanbul ignore next */ []);
+		this._loadFailed = signal(false, ...ngDevMode ? [{ debugName: "_loadFailed" }] : /* istanbul ignore next */ []);
+		this.loadFailed = this._loadFailed.asReadonly();
 		this._search = signal("", ...ngDevMode ? [{ debugName: "_search" }] : /* istanbul ignore next */ []);
 		this._searchParam = computed(() => this._search().toLowerCase(), ...ngDevMode ? [{ debugName: "_searchParam" }] : /* istanbul ignore next */ []);
 		this._page = signal(1, ...ngDevMode ? [{ debugName: "_page" }] : /* istanbul ignore next */ []);
@@ -12039,10 +12041,12 @@ var DataTableComponent = class DataTableComponent {
 			for (const [key, vals] of Object.entries(cf)) if (vals.length > 0) params = params.set(key, encodeFilterValues(vals));
 			return this.http.get(`${this.config.baseUrl}${this.endpoint()}`, { params }).pipe(catchError(() => {
 				this._error.set("Something went wrong. Please try again.");
+				this._loadFailed.set(true);
 				return of(null);
 			}));
 		}), takeUntilDestroyed(this.destroyRef)).subscribe((response) => {
 			if (response !== null) {
+				this._loadFailed.set(false);
 				const items = Array.isArray(response) ? response : response?.content ?? [];
 				this._items.set(items);
 				if (this._failedImages().size > 0) this._failedImages.set(/* @__PURE__ */ new Set());
@@ -33225,7 +33229,7 @@ var DateRangePickerComponent = class DateRangePickerComponent {
 		this.popoverDismissed = linkedSignal({
 			...ngDevMode ? { debugName: "popoverDismissed" } : /* istanbul ignore next */ {},
 			source: this.selectedPreset,
-			computation: () => false
+			computation: (_, previous) => previous === void 0
 		});
 		this.popoverVisible = computed(() => this.showPresets() && this.selectedPreset() === "custom" && !this.popoverDismissed(), ...ngDevMode ? [{ debugName: "popoverVisible" }] : /* istanbul ignore next */ []);
 		this.popTop = signal(0, ...ngDevMode ? [{ debugName: "popTop" }] : /* istanbul ignore next */ []);
@@ -33269,13 +33273,20 @@ var DateRangePickerComponent = class DateRangePickerComponent {
 		this.popRight.set(Math.max(16, Math.round(document.documentElement.clientWidth - r.right)));
 	}
 	onDocumentClick(e) {
-		if (this.popoverVisible() && !this.host.nativeElement.contains(e.target)) this.popoverDismissed.set(true);
+		if (this.popoverVisible() && !this.host.nativeElement.contains(e.target)) this.dismissWithoutApply();
 	}
 	onEscape(e) {
 		if (!this.popoverVisible()) return;
 		e.stopPropagation();
+		this.dismissWithoutApply();
+	}
+	dismissWithoutApply() {
+		this.selectedPreset.set(this.activePreset());
 		this.popoverDismissed.set(true);
 	}
+	onPillsClick(e) {
+		if ((e.target?.closest?.("[role=\"tab\"]"))?.getAttribute("aria-selected") === "true" && this.selectedPreset() === "custom" && this.popoverDismissed()) this.popoverDismissed.set(false);
+	}
 	selectPreset(key) {
 		this.selectedPreset.set(key);
 		this.popoverDismissed.set(false);
@@ -33347,7 +33358,7 @@ var DateRangePickerComponent = class DateRangePickerComponent {
 			template: `
     <div class="date-range-picker">
       @if (showPresets()) {
-        <div class="pills" #pills>
+        <div class="pills" #pills (click)="onPillsClick($event)">
           <ui-pill-tabs [tabs]="presetTabs()" [activeKey]="selectedPreset()" [ariaLabel]="ariaLabel()" [noWrap]="true" (tabChange)="selectPreset($any($event))" />
         </div>
         @if (popoverVisible()) {
@@ -33493,7 +33504,7 @@ i0.ɵɵngDeclareClassMetadata({
 			template: `
     <div class="date-range-picker">
       @if (showPresets()) {
-        <div class="pills" #pills>
+        <div class="pills" #pills (click)="onPillsClick($event)">
           <ui-pill-tabs [tabs]="presetTabs()" [activeKey]="selectedPreset()" [ariaLabel]="ariaLabel()" [noWrap]="true" (tabChange)="selectPreset($any($event))" />
         </div>
         @if (popoverVisible()) {
@@ -39791,6 +39802,24 @@ var CalendarComponent = class CalendarComponent {
 			if (f && cells.some((c) => c.dateStr === f)) return f;
 			return (cells.find((c) => c.isToday) ?? cells.find((c) => c.isCurrentMonth) ?? cells[0]).dateStr;
 		}, ...ngDevMode ? [{ debugName: "focusDate" }] : /* istanbul ignore next */ []);
+		this.pendingFocus = null;
+		this.pendingSawLoading = false;
+		this.host.nativeElement.addEventListener("pointerdown", () => {
+			this.pendingFocus = null;
+		});
+		effect(() => {
+			const loading = this.loading();
+			if (!this.pendingFocus) return;
+			if (loading) {
+				this.pendingSawLoading = true;
+				return;
+			}
+			if (!this.pendingSawLoading) return;
+			const target = this.pendingFocus;
+			this.pendingFocus = null;
+			this.pendingSawLoading = false;
+			afterNextRender(() => this.host.nativeElement.querySelector(`.month-cell[data-date="${target}"]`)?.focus(), { injector: this.injector });
+		});
 		effect(() => {
 			const view = this.view();
 			const views = this.views();
@@ -39891,6 +39920,7 @@ var CalendarComponent = class CalendarComponent {
 		if (this.clickable(dateStr)) this.dateClick.emit(dateStr);
 	}
 	onCellKey(event, dateStr) {
+		if (event.key !== "PageUp" && event.key !== "PageDown") this.pendingFocus = null;
 		if (event.target !== event.currentTarget || event.altKey || event.ctrlKey || event.metaKey) return;
 		if (event.key === "Enter" || event.key === " ") {
 			event.preventDefault();
@@ -39924,8 +39954,13 @@ var CalendarComponent = class CalendarComponent {
 		const target = new Date(y, m, Math.min(from.getDate(), new Date(y, m + 1, 0).getDate()));
 		const targetStr = toDateStr(target);
 		this.focusedDate.set(targetStr);
+		this.pendingFocus = targetStr;
+		this.pendingSawLoading = this.loading();
 		this.anchorDate.set(target);
-		afterNextRender(() => this.host.nativeElement.querySelector(`.month-cell[data-date="${targetStr}"]`)?.focus(), { injector: this.injector });
+		afterNextRender(() => {
+			this.host.nativeElement.querySelector(`.month-cell[data-date="${targetStr}"]`)?.focus();
+			if (!this.loading() && this.pendingFocus === targetStr) this.pendingFocus = null;
+		}, { injector: this.injector });
 	}
 	onAddAllDay(dateStr, event) {
 		event.stopPropagation();