@sinequa/atomic-angular 2.8.0 → 2.9.0

package/fesm2022/sinequa-atomic-angular.mjs

@@ -16263,25 +16263,124 @@ function alertSummary(lang, alert) {
 	if (alert.frequency !== Alert.Frequency.Immediate && days !== Alert.Days.None && (days & Alert.Days.AllDays) !== Alert.Days.AllDays) parts.push({ text: formatDays(days, lang) });
 	return parts;
 }
-const ALREADY_NOTIFIED = [
-	400,
-	403,
-	500,
-	503
-];
+function querySummary(query) {
+	if (!query) return [];
+	const parts = [];
+	if (query.text) parts.push({ text: `“${query.text}”` });
+	if (query.tab) parts.push({
+		key: "alerts.queryTab",
+		params: { tab: query.tab }
+	});
+	const filters = Array.isArray(query.filters) ? query.filters.length : 0;
+	if (filters === 1) parts.push({ key: "alerts.queryFiltersOne" });
+	else if (filters > 1) parts.push({
+		key: "alerts.queryFiltersMany",
+		params: { count: filters }
+	});
+	return parts;
+}
 function saveErrorDetail(error) {
 	const { errorMessage, message } = error ?? {};
 	return errorMessage ?? message;
 }
-function notifySaveFailed(transloco, error) {
-	const { status } = error ?? {};
-	if (status !== void 0 && ALREADY_NOTIFIED.includes(status)) return;
-	notify.error(transloco.translate("alerts.saveFailed"), {
-		description: saveErrorDetail(error),
-		closeButton: true,
-		duration: 5e3
+var AlertSaveErrorComponent = class AlertSaveErrorComponent {
+	detail = input(void 0, ...ngDevMode ? [{ debugName: "detail" }] : /* istanbul ignore next */ []);
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: AlertSaveErrorComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
 	});
-}
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: AlertSaveErrorComponent,
+		isStandalone: true,
+		selector: "alert-save-error",
+		inputs: { detail: {
+			classPropertyName: "detail",
+			publicName: "detail",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		host: {
+			attributes: { "role": "alert" },
+			classAttribute: "save-error"
+		},
+		providers: [provideTranslocoScope("alerts")],
+		ngImport: i0,
+		template: `
+    <div class="min-h-0 overflow-hidden">
+      <div
+        class="flex w-full items-start gap-(--spacing-xs) rounded-(--radius-md) border border-(--stroke-error-base) bg-(--bg-error-lightest) px-(--spacing-sm) py-(--spacing-xs) text-(--font-error-base)">
+        <TriangleAlert class="mt-px size-3.5 shrink-0" width="14" height="14" aria-hidden="true" />
+        <div class="flex min-w-0 flex-col">
+          <p class="m-0 text-(length:--size-sm) font-medium">{{ "alerts.saveFailed" | transloco }}</p>
+          @if (detail()) {
+            <p class="m-0 text-(length:--size-xs) wrap-anywhere opacity-80">{{ detail() }}</p>
+          }
+        </div>
+      </div>
+    </div>
+  `,
+		isInline: true,
+		styles: [":host{display:grid;animation:save-error-in .22s ease-out}:host>div>div{animation:save-error-card-in .22s ease-out}@keyframes save-error-in{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes save-error-card-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){:host,:host>div>div{animation:none}}\n"],
+		dependencies: [{
+			kind: "component",
+			type: TriangleAlertIcon,
+			selector: "triangle-alert, triangle-alert-icon, TriangleAlert, TriangleAlertIcon",
+			inputs: ["class"]
+		}, {
+			kind: "pipe",
+			type: TranslocoPipe,
+			name: "transloco"
+		}]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: AlertSaveErrorComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "alert-save-error",
+			imports: [TranslocoPipe, TriangleAlertIcon],
+			providers: [provideTranslocoScope("alerts")],
+			host: {
+				class: "save-error",
+				role: "alert"
+			},
+			template: `
+    <div class="min-h-0 overflow-hidden">
+      <div
+        class="flex w-full items-start gap-(--spacing-xs) rounded-(--radius-md) border border-(--stroke-error-base) bg-(--bg-error-lightest) px-(--spacing-sm) py-(--spacing-xs) text-(--font-error-base)">
+        <TriangleAlert class="mt-px size-3.5 shrink-0" width="14" height="14" aria-hidden="true" />
+        <div class="flex min-w-0 flex-col">
+          <p class="m-0 text-(length:--size-sm) font-medium">{{ "alerts.saveFailed" | transloco }}</p>
+          @if (detail()) {
+            <p class="m-0 text-(length:--size-xs) wrap-anywhere opacity-80">{{ detail() }}</p>
+          }
+        </div>
+      </div>
+    </div>
+  `,
+			styles: [":host{display:grid;animation:save-error-in .22s ease-out}:host>div>div{animation:save-error-card-in .22s ease-out}@keyframes save-error-in{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes save-error-card-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){:host,:host>div>div{animation:none}}\n"]
+		}]
+	}],
+	propDecorators: { detail: [{
+		type: i0.Input,
+		args: [{
+			isSignal: true,
+			alias: "detail",
+			required: false
+		}]
+	}] }
+});
 const WEEKDAYS = [
 	{
 		key: "monday",
@@ -16327,6 +16426,15 @@ function emptyAlertModel() {
 		active: true
 	};
 }
+function modelOf(alert) {
+	return {
+		name: alert.name,
+		frequency: alert.frequency,
+		days: weekdaysFromFlags(alert.days),
+		time: alert.times,
+		active: alert.active
+	};
+}
 const alertSchema = schema((p) => {
 	required(p.name);
 	validate(p.name, ({ value }) => value().length > 0 && !value().trim() ? { kind: "required" } : void 0);
@@ -16334,13 +16442,17 @@ const alertSchema = schema((p) => {
 	required(p.time);
 	validate(p.days, ({ value, valueOf }) => valueOf(p.frequency) === Alert.Frequency.Immediate || Object.values(value()).some(Boolean) ? void 0 : { kind: "noDaySelected" });
 });
-var AlertDialog = class AlertDialog {
-	call = injectCallRef();
+let nextFormId = 0;
+var AlertFormComponent = class AlertFormComponent {
 	queryService = inject(QueryService);
 	queryParamsStore = inject(QueryParamsStore);
 	userSettingsStore = inject(UserSettingsStore);
 	transloco = inject(TranslocoService);
-	dialog = viewChild(DialogComponent, ...ngDevMode ? [{ debugName: "dialog" }] : /* istanbul ignore next */ []);
+	lang = toSignal(this.transloco.langChanges$);
+	index = input(void 0, ...ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []);
+	saved = output();
+	executed = output();
+	formId = `alert-form-${nextFormId++}`;
 	fieldClass = FORM_FIELD_CLASS;
 	labelClass = FORM_LABEL_CLASS;
 	errorClass = FORM_ERROR_CLASS;
@@ -16350,39 +16462,37 @@ var AlertDialog = class AlertDialog {
 		Alert.Frequency.Immediate
 	];
 	frequency = Alert.Frequency;
+	Days = Alert.Days;
+	querySummary = querySummary;
 	frequencyLabel = (value) => this.transloco.translate(`alerts.frequency.${Alert.Frequency[value]}`);
 	weekdays = WEEKDAYS;
-	index = signal(void 0, ...ngDevMode ? [{ debugName: "index" }] : /* istanbul ignore next */ []);
-	alert = signal(void 0, ...ngDevMode ? [{ debugName: "alert" }] : /* istanbul ignore next */ []);
-	canUpdateQuery = signal(false, ...ngDevMode ? [{ debugName: "canUpdateQuery" }] : /* istanbul ignore next */ []);
+	dayNames = computed(() => weekdayNames(this.lang() ?? this.transloco.getActiveLang()), ...ngDevMode ? [{ debugName: "dayNames" }] : /* istanbul ignore next */ []);
+	alert = computed(() => {
+		const index = this.index();
+		return index === void 0 ? void 0 : this.userSettingsStore.alerts()[index];
+	}, ...ngDevMode ? [{ debugName: "alert" }] : /* istanbul ignore next */ []);
+	currentSearch = rxResource({
+		params: () => this.alert() ? true : void 0,
+		stream: () => this.queryService.search(this.queryParamsStore.getQuery(), false).pipe(map((response) => response.records?.length > 0))
+	});
+	canUpdateQuery = computed(() => this.currentSearch.value() === true, ...ngDevMode ? [{ debugName: "canUpdateQuery" }] : /* istanbul ignore next */ []);
 	updateStatus = signal("idle", ...ngDevMode ? [{ debugName: "updateStatus" }] : /* istanbul ignore next */ []);
 	saveError = signal(void 0, ...ngDevMode ? [{ debugName: "saveError" }] : /* istanbul ignore next */ []);
-	alertModel = signal(emptyAlertModel(), ...ngDevMode ? [{ debugName: "alertModel" }] : /* istanbul ignore next */ []);
+	alertModel = linkedSignal(() => {
+		const alert = this.alert();
+		return alert ? modelOf(alert) : emptyAlertModel();
+	}, ...ngDevMode ? [{ debugName: "alertModel" }] : /* istanbul ignore next */ []);
 	alertForm = form(this.alertModel, alertSchema, {
 		name: "alert",
 		submission: { action: async () => this.persist() }
 	});
+	saving = computed(() => this.alertForm().submitting(), ...ngDevMode ? [{ debugName: "saving" }] : /* istanbul ignore next */ []);
 	showDaysError = computed(() => fieldShowsError(this.alertForm.days), ...ngDevMode ? [{ debugName: "showDaysError" }] : /* istanbul ignore next */ []);
-	constructor() {
-		afterNextRender(() => this.init(this.call.props()));
-	}
-	async init(index) {
-		this.index.set(index);
-		const alert = index !== void 0 ? this.userSettingsStore.alerts()[index] : void 0;
-		this.alert.set(alert);
-		if (alert) {
-			this.alertModel.set({
-				name: alert.name,
-				frequency: alert.frequency,
-				days: weekdaysFromFlags(alert.days),
-				time: alert.times,
-				active: alert.active
-			});
-			const q = this.queryParamsStore.getQuery();
-			const response = await firstValueFrom(this.queryService.search(q, false));
-			this.canUpdateQuery.set(response.records?.length > 0);
-		} else this.alertModel.set(emptyAlertModel());
-		this.dialog()?.open();
+	setDays(mask) {
+		this.alertModel.update((model) => ({
+			...model,
+			days: weekdaysFromFlags(mask)
+		}));
 	}
 	async persist() {
 		this.saveError.set(void 0);
@@ -16393,7 +16503,7 @@ var AlertDialog = class AlertDialog {
 			this.saveError.set({ detail: saveErrorDetail(error) });
 			return;
 		}
-		this.dialog()?.close("dialog-confirm");
+		this.saved.emit();
 	}
 	async create() {
 		const model = this.alertModel();
@@ -16468,209 +16578,197 @@ var AlertDialog = class AlertDialog {
 			filters,
 			name: q.name
 		});
-		this.dialog()?.close();
+		this.executed.emit();
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
 		minVersion: "12.0.0",
 		version: "22.2.1",
 		ngImport: i0,
-		type: AlertDialog,
+		type: AlertFormComponent,
 		deps: [],
 		target: i0.ɵɵFactoryTarget.Component
 	});
 	static ɵcmp = i0.ɵɵngDeclareComponent({
 		minVersion: "17.0.0",
 		version: "22.2.1",
-		type: AlertDialog,
+		type: AlertFormComponent,
 		isStandalone: true,
-		selector: "alert-dialog, alertdialog, AlertDialog",
+		selector: "alert-form, alertform, AlertFormComponent",
+		inputs: { index: {
+			classPropertyName: "index",
+			publicName: "index",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		outputs: {
+			saved: "saved",
+			executed: "executed"
+		},
+		host: { classAttribute: "block @container" },
 		providers: [provideTranslocoScope("alerts")],
-		viewQueries: [{
-			propertyName: "dialog",
-			first: true,
-			predicate: DialogComponent,
-			descendants: true,
-			isSignal: true
-		}],
 		ngImport: i0,
 		template: `
-    <dialog #dialog (closed)="call.end($event)">
-      <DialogContent size="md">
-        <DialogHeader [closeLabel]="'alerts.close' | transloco">
-          <DialogTitle>{{ 'alerts.createAlert' | transloco }}</DialogTitle>
-        </DialogHeader>
-
-        <!--
-          [formRoot] poses novalidate, intercepts submit, calls preventDefault() and triggers submit()
-          on the field tree: Enter submits natively, and the action only runs on a valid form.
-          class="contents" keeps the DialogContent flex column intact — the body/footer slots are
-          styled by descendant selectors, which a display: contents wrapper does not break.
-        -->
-        <form [formRoot]="alertForm" class="contents" [attr.aria-label]="'alerts.createAlert' | transloco">
-          <DialogBody class="gap-(--spacing-md)">
-            <div [class]="fieldClass">
-              <label for="alertName" [class]="labelClass">{{ 'alerts.alertName' | transloco }}</label>
-              <input-group [scheme]="showError(alertForm.name) ? 'error' : 'default'">
-                <input
-                  input-control
-                  id="alertName"
-                  type="text"
-                  autocomplete="off"
-                  spellcheck="false"
-                  [formField]="alertForm.name"
-                  [attr.placeholder]="'alerts.placeholder' | transloco"
-                  [attr.aria-invalid]="showError(alertForm.name) ? 'true' : null"
-                  [attr.aria-describedby]="showError(alertForm.name) ? 'alertName-error' : null" />
-              </input-group>
-              @if (showError(alertForm.name)) {
-                <p id="alertName-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.name) | transloco }}</p>
-              }
-            </div>
-
-            @let selectedFrequency = alertForm.frequency().value();
-            <div [class]="fieldClass">
-              <label [class]="labelClass" for="alertFrequency">{{ 'alerts.alertFrequency' | transloco }}</label>
-              <SelectMenu
-                class="contents"
-                [options]="frequencies"
-                [formField]="alertForm.frequency"
-                [label]="frequencyLabel"
-                size="md">
-                <button selectTrigger type="button" id="alertFrequency" class="select-trigger">
-                  <span class="select-trigger-label" [class.select-placeholder]="selectedFrequency === null">
-                    @if (selectedFrequency === null) {
-                      {{ 'alerts.selectFrequency' | transloco }}
-                    } @else {
-                      {{ 'alerts.frequency.' + frequency[selectedFrequency] | transloco }}
-                    }
-                  </span>
-                  <chevron-down-icon class="select-chevron" />
-                </button>
-
-                <ng-template #selectOption let-frequencyValue let-selected="selected">
-                  <span class="select-option-body">
-                    <span class="select-option-label">{{ 'alerts.frequency.' + frequency[frequencyValue] | transloco }}</span>
-                  </span>
-                  @if (selected) {
-                    <check-icon class="select-option-check" />
-                  }
-                </ng-template>
-              </SelectMenu>
-            </div>
+    <!--
+      [formRoot] poses novalidate, intercepts submit, calls preventDefault() and triggers submit()
+      on the field tree: Enter submits natively, and the action only runs on a valid form.
+    -->
+    <form
+      [formRoot]="alertForm"
+      [id]="formId"
+      class="flex flex-col gap-(--spacing-lg)"
+      [attr.aria-label]="(alert() ? 'alerts.editAlert' : 'alerts.createAlert') | transloco">
+      <div [class]="fieldClass">
+        <label for="alertName" [class]="labelClass">{{ 'alerts.alertName' | transloco }}</label>
+        <input-group [scheme]="showError(alertForm.name) ? 'error' : 'default'">
+          <input
+            input-control
+            id="alertName"
+            type="text"
+            autocomplete="off"
+            spellcheck="false"
+            [formField]="alertForm.name"
+            [attr.placeholder]="'alerts.placeholder' | transloco"
+            [attr.aria-invalid]="showError(alertForm.name) ? 'true' : null"
+            [attr.aria-describedby]="showError(alertForm.name) ? 'alertName-error' : null" />
+        </input-group>
+        @if (showError(alertForm.name)) {
+          <p id="alertName-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.name) | transloco }}</p>
+        }
+      </div>
 
-            <!-- A group of related checkboxes is a fieldset: its legend is what names the group for
-                 assistive technologies. It used to be a <p>, which names nothing. -->
-            <fieldset
-              class="m-0 border-0 p-0"
-              [attr.aria-invalid]="showDaysError() ? 'true' : null"
-              [attr.aria-describedby]="showDaysError() ? 'alertDays-error' : null">
-              <legend [class]="labelClass + ' mb-(--spacing-2xs)'">{{ 'alerts.repeatOn' | transloco }}</legend>
-              <div class="weekdays-grid gap-1.5 px-2.5 py-0">
-                @for (day of weekdays; track day.key) {
-                  <div>
-                    <checkbox [formField]="alertForm.days[day.key]">
-                      {{ 'alerts.weekdays.' + day.key | transloco }}
-                    </checkbox>
-                  </div>
+      <div class="grid gap-(--spacing-md) @sm:grid-cols-2">
+        @let selectedFrequency = alertForm.frequency().value();
+        <div [class]="fieldClass">
+          <label [class]="labelClass" for="alertFrequency">{{ 'alerts.alertFrequency' | transloco }}</label>
+          <SelectMenu class="contents" [options]="frequencies" [formField]="alertForm.frequency" [label]="frequencyLabel" size="md">
+            <button selectTrigger type="button" id="alertFrequency" class="select-trigger">
+              <span class="select-trigger-label" [class.select-placeholder]="selectedFrequency === null">
+                @if (selectedFrequency === null) {
+                  {{ 'alerts.selectFrequency' | transloco }}
+                } @else {
+                  {{ 'alerts.frequency.' + frequency[selectedFrequency] | transloco }}
                 }
-              </div>
-              @if (showDaysError()) {
-                <p id="alertDays-error" role="alert" [class]="errorClass + ' mt-(--spacing-2xs)'">
-                  {{ errorKey(alertForm.days) | transloco }}
-                </p>
-              }
-            </fieldset>
+              </span>
+              <chevron-down-icon class="select-chevron" />
+            </button>
 
-            <div [class]="fieldClass">
-              <label [class]="labelClass" for="alertTimes">{{ 'alerts.alertHours' | transloco }}</label>
-              <input-group [scheme]="showError(alertForm.time) ? 'error' : 'default'">
-                <input
-                  input-control
-                  type="time"
-                  id="alertTimes"
-                  autocomplete="off"
-                  spellcheck="false"
-                  [formField]="alertForm.time"
-                  [attr.aria-invalid]="showError(alertForm.time) ? 'true' : null"
-                  [attr.aria-describedby]="showError(alertForm.time) ? 'alertTimes-error' : null" />
-              </input-group>
-              @if (showError(alertForm.time)) {
-                <p id="alertTimes-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.time) | transloco }}</p>
+            <ng-template #selectOption let-frequencyValue let-selected="selected">
+              <span class="select-option-body">
+                <span class="select-option-label">{{ 'alerts.frequency.' + frequency[frequencyValue] | transloco }}</span>
+              </span>
+              @if (selected) {
+                <check-icon class="select-option-check" />
               }
-            </div>
+            </ng-template>
+          </SelectMenu>
+        </div>
 
-            <div>
-              <checkbox [formField]="alertForm.active">{{ 'alerts.alertActive' | transloco }}</checkbox>
-            </div>
-          </DialogBody>
+        <div [class]="fieldClass">
+          <label [class]="labelClass" for="alertTimes">{{ 'alerts.alertHours' | transloco }}</label>
+          <input-group [scheme]="showError(alertForm.time) ? 'error' : 'default'">
+            <input
+              input-control
+              type="time"
+              id="alertTimes"
+              autocomplete="off"
+              spellcheck="false"
+              [formField]="alertForm.time"
+              [attr.aria-invalid]="showError(alertForm.time) ? 'true' : null"
+              [attr.aria-describedby]="showError(alertForm.time) ? 'alertTimes-error' : null" />
+          </input-group>
+          @if (showError(alertForm.time)) {
+            <p id="alertTimes-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.time) | transloco }}</p>
+          }
+        </div>
+      </div>
 
-          <DialogFooter class="flex-col">
-            <!-- Shown here and not as a toast: the dialog is modal, so it is in the top layer, above any toast. -->
-            @if (saveError(); as failure) {
-              <div class="save-error w-full">
-                <div class="min-h-0 overflow-hidden">
-                  <div
-                    id="alertSaveError"
-                    role="alert"
-                    class="flex w-full items-start gap-(--spacing-sm) rounded-(--radius-md) border border-(--stroke-error-base) bg-(--bg-error-lightest) p-(--spacing-md) text-(--font-error-base)">
-                    <TriangleAlert class="mt-0.5 size-4 shrink-0" width="16" height="16" aria-hidden="true" />
-                    <div class="flex min-w-0 flex-col gap-(--spacing-2xs)">
-                      <p class="m-0 font-medium">{{ 'alerts.saveFailed' | transloco }}</p>
-                      @if (failure.detail) {
-                        <p class="m-0 text-(length:--size-sm) wrap-anywhere opacity-80">{{ failure.detail }}</p>
-                      }
-                    </div>
-                  </div>
-                </div>
-              </div>
+      <!--
+        An immediate alert does not repeat: the weekdays carry no meaning for it, so they are not offered
+        (the schema exempts it too).
+        A group of related checkboxes is a fieldset: its legend is what names the group for assistive
+        technologies. Each day is a native checkbox dressed as a toggle chip — the chip is its label, and
+        the name read out is the full weekday, the short one being decoration.
+      -->
+      @if (selectedFrequency !== frequency.Immediate) {
+        <fieldset
+          class="m-0 flex flex-col gap-(--spacing-xs) border-0 p-0"
+          [attr.aria-invalid]="showDaysError() ? 'true' : null"
+          [attr.aria-describedby]="showDaysError() ? 'alertDays-error' : null">
+          <div class="flex items-baseline justify-between gap-(--spacing-md)">
+            <legend [class]="labelClass + ' p-0'">{{ 'alerts.repeatOn' | transloco }}</legend>
+            <span class="flex gap-(--spacing-xs)">
+              <button type="button" variant="tertiary" size="sm" (click)="setDays(Days.WeekDays)">{{ 'alerts.weekdaysPreset' | transloco }}</button>
+              <button type="button" variant="tertiary" size="sm" (click)="setDays(Days.AllDays)">{{ 'alerts.everyDay' | transloco }}</button>
+            </span>
+          </div>
+          <div class="grid grid-cols-7 gap-1.5">
+            @for (day of weekdays; track day.key; let i = $index) {
+              <label
+                class="relative flex h-10 cursor-pointer items-center justify-center rounded-(--radius-md) border border-(--layer-page-edge) bg-(--bg-neutral-white) text-(length:--size-sm) font-medium text-(--font-neutral-muted) transition-colors select-none hover:bg-(--bg-primary-lighter) has-checked:border-(--stroke-primary-base) has-checked:bg-(--bg-primary-lighter) has-checked:text-(--font-primary-base) has-focus-visible:outline-2 has-focus-visible:outline-(--stroke-focus) motion-reduce:transition-none">
+                <input type="checkbox" class="absolute inset-0 m-0 size-full cursor-pointer opacity-0" [formField]="alertForm.days[day.key]" />
+                <span aria-hidden="true">{{ dayNames()[i] }}</span>
+                <span class="sr-only">{{ 'alerts.weekdays.' + day.key | transloco }}</span>
+              </label>
             }
-            @if (alert() || canUpdateQuery()) {
-              <div class="flex w-full flex-col gap-2">
-                @if (alert()) {
-                  <button type="button" variant="secondary" (click)="execute()" [disabled]="!canUpdateQuery()">
-                    {{ 'alerts.execute' | transloco }}
-                  </button>
-                }
-                @if (canUpdateQuery()) {
-                  <button type="button" [disabled]="updateStatus() !== 'idle'" variant="tertiary" (click)="updateQuery()">
-                    @switch (updateStatus()) {
-                      @case ('updating') {
-                        <LoadingCircle class="size-4 animate-spin" width="16" height="16" />
-                        {{ 'alerts.updateQuery' | transloco }}
-                      }
-                      @case ('updated') {
-                        <CircleCheck width="16" height="16" />
-                        {{ 'alerts.queryUpdated' | transloco }}
-                      }
-                      @default {
-                        {{ 'alerts.updateQuery' | transloco }}
-                      }
-                    }
-                  </button>
+          </div>
+          @if (showDaysError()) {
+            <p id="alertDays-error" role="alert" [class]="errorClass">
+              {{ errorKey(alertForm.days) | transloco }}
+            </p>
+          }
+        </fieldset>
+      }
+
+      <div class="flex items-center justify-between gap-(--spacing-md) rounded-(--radius-md) border border-(--layer-page-edge) px-(--spacing-md) py-(--spacing-sm)">
+        <div id="alertActiveLabel" class="flex min-w-0 flex-col">
+          <span class="text-(length:--size-base) font-medium">{{ 'alerts.alertActive' | transloco }}</span>
+          <span class="text-(length:--size-sm) text-(--font-neutral-muted)">{{ 'alerts.activeHint' | transloco }}</span>
+        </div>
+        <Switch [formField]="alertForm.active" aria-labelledby="alertActiveLabel" />
+      </div>
+
+      @if (alert(); as current) {
+        <section aria-labelledby="alertQueryTitle" class="flex flex-col gap-(--spacing-sm) rounded-(--radius-md) bg-(--layer-page-on-layer) p-(--spacing-md)">
+          <div class="flex min-w-0 flex-col gap-(--spacing-2xs)">
+            <h3 id="alertQueryTitle" class="m-0 text-(length:--size-sm) font-semibold">{{ 'alerts.queryWatched' | transloco }}</h3>
+            <p class="m-0 text-(length:--size-sm) wrap-anywhere text-(--font-neutral-muted)">
+              @for (part of querySummary(current); track $index; let first = $first) {
+                {{ first ? "" : " · " }}{{ part.key ? (part.key | transloco: part.params) : part.text }}
+              }
+            </p>
+          </div>
+          <div class="flex flex-wrap gap-(--spacing-xs)">
+            <button type="button" variant="secondary" size="sm" (click)="execute()" [disabled]="!canUpdateQuery()">
+              {{ 'alerts.execute' | transloco }}
+            </button>
+            @if (canUpdateQuery()) {
+              <button type="button" variant="tertiary" size="sm" [disabled]="updateStatus() !== 'idle'" (click)="updateQuery()">
+                @switch (updateStatus()) {
+                  @case ('updating') {
+                    <LoadingCircle class="size-4 animate-spin" width="16" height="16" />
+                    {{ 'alerts.updateQuery' | transloco }}
+                  }
+                  @case ('updated') {
+                    <CircleCheck width="16" height="16" />
+                    {{ 'alerts.queryUpdated' | transloco }}
+                  }
+                  @default {
+                    {{ 'alerts.updateQuery' | transloco }}
+                  }
                 }
-              </div>
-            }
-            <div class="ml-auto flex justify-end gap-2">
-              <button type="button" variant="secondary" (click)="dialog.cancel()">
-                {{ 'cancel' | transloco }}
               </button>
-              <!--
-                Deliberately not disabled on an invalid form: a disabled submit button never fires
-                submit(), which is what marks every field as touched and reveals the messages. The
-                weekday group has no other way to become touched — the galactik Checkbox emits no
-                touch output — so the "pick a day" error would be unreachable.
-              -->
-              <button type="submit">
-                {{ 'confirm' | transloco }}
-              </button>
-            </div>
-          </DialogFooter>
-        </form>
-      </DialogContent>
-    </dialog>
+            }
+          </div>
+        </section>
+      }
+
+      @if (saveError(); as failure) {
+        <alert-save-error [detail]="failure.detail" />
+      }
+    </form>
   `,
 		isInline: true,
-		styles: [".weekdays-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.save-error{display:grid;animation:save-error-in .22s ease-out}.save-error>div>div{animation:save-error-card-in .22s ease-out}@keyframes save-error-in{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes save-error-card-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.save-error,.save-error>div>div{animation:none}}\n"],
 		dependencies: [
 			{
 				kind: "directive",
@@ -16697,62 +16795,6 @@ var AlertDialog = class AlertDialog {
 					"size"
 				]
 			},
-			{
-				kind: "component",
-				type: CheckboxComponent,
-				selector: "checkbox, Checkbox",
-				inputs: [
-					"checked",
-					"disabled",
-					"indeterminate",
-					"hint",
-					"class",
-					"aria-label"
-				],
-				outputs: ["checkedChange"]
-			},
-			{
-				kind: "component",
-				type: DialogComponent,
-				selector: "dialog, [dialog]",
-				inputs: ["closeLabel"],
-				outputs: ["closed"],
-				exportAs: ["dialog"]
-			},
-			{
-				kind: "component",
-				type: DialogHeaderComponent,
-				selector: "DialogHeader",
-				inputs: ["closeLabel", "class"]
-			},
-			{
-				kind: "directive",
-				type: DialogTitleComponent,
-				selector: "DialogTitle",
-				inputs: ["id", "class"]
-			},
-			{
-				kind: "directive",
-				type: DialogContentComponent,
-				selector: "DialogContent",
-				inputs: [
-					"size",
-					"labelledby",
-					"class"
-				]
-			},
-			{
-				kind: "directive",
-				type: DialogBodyComponent,
-				selector: "DialogBody",
-				inputs: ["class"]
-			},
-			{
-				kind: "directive",
-				type: DialogFooterComponent,
-				selector: "DialogFooter",
-				inputs: ["class"]
-			},
 			{
 				kind: "directive",
 				type: InputComponent,
@@ -16808,33 +16850,387 @@ var AlertDialog = class AlertDialog {
 			},
 			{
 				kind: "component",
-				type: ChevronDownIcon,
-				selector: "chevron-down, chevron-down-icon, ChevronDown, ChevronDownIcon",
-				inputs: ["class"]
+				type: SwitchComponent,
+				selector: "switch, Switch",
+				inputs: [
+					"checked",
+					"disabled",
+					"size",
+					"class",
+					"aria-label",
+					"aria-labelledby",
+					"presentational",
+					"compact",
+					"tabIndex"
+				],
+				outputs: ["checkedChange"]
+			},
+			{
+				kind: "component",
+				type: ChevronDownIcon,
+				selector: "chevron-down, chevron-down-icon, ChevronDown, ChevronDownIcon",
+				inputs: ["class"]
+			},
+			{
+				kind: "component",
+				type: CheckIcon,
+				selector: "check, check-icon, Check, CheckIcon",
+				inputs: ["class"]
+			},
+			{
+				kind: "component",
+				type: LoadingCircleIcon,
+				selector: "loading-circle, loading-circle-icon, LoadingCircle, LoadingCircleIcon",
+				inputs: ["class"]
+			},
+			{
+				kind: "component",
+				type: CircleCheckIcon,
+				selector: "circle-check, circle-check-icon, CircleCheck, CircleCheckIcon",
+				inputs: ["class"]
+			},
+			{
+				kind: "component",
+				type: AlertSaveErrorComponent,
+				selector: "alert-save-error",
+				inputs: ["detail"]
+			},
+			{
+				kind: "pipe",
+				type: TranslocoPipe,
+				name: "transloco"
+			}
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: AlertFormComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "alert-form, alertform, AlertFormComponent",
+			imports: [
+				FormRoot,
+				FormField,
+				TranslocoPipe,
+				ButtonComponent,
+				InputComponent,
+				InputControlDirective,
+				SelectComponent,
+				SelectTriggerDirective,
+				SwitchComponent,
+				ChevronDownIcon,
+				CheckIcon,
+				LoadingCircleIcon,
+				CircleCheckIcon,
+				AlertSaveErrorComponent
+			],
+			providers: [provideTranslocoScope("alerts")],
+			host: { class: "block @container" },
+			template: `
+    <!--
+      [formRoot] poses novalidate, intercepts submit, calls preventDefault() and triggers submit()
+      on the field tree: Enter submits natively, and the action only runs on a valid form.
+    -->
+    <form
+      [formRoot]="alertForm"
+      [id]="formId"
+      class="flex flex-col gap-(--spacing-lg)"
+      [attr.aria-label]="(alert() ? 'alerts.editAlert' : 'alerts.createAlert') | transloco">
+      <div [class]="fieldClass">
+        <label for="alertName" [class]="labelClass">{{ 'alerts.alertName' | transloco }}</label>
+        <input-group [scheme]="showError(alertForm.name) ? 'error' : 'default'">
+          <input
+            input-control
+            id="alertName"
+            type="text"
+            autocomplete="off"
+            spellcheck="false"
+            [formField]="alertForm.name"
+            [attr.placeholder]="'alerts.placeholder' | transloco"
+            [attr.aria-invalid]="showError(alertForm.name) ? 'true' : null"
+            [attr.aria-describedby]="showError(alertForm.name) ? 'alertName-error' : null" />
+        </input-group>
+        @if (showError(alertForm.name)) {
+          <p id="alertName-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.name) | transloco }}</p>
+        }
+      </div>
+
+      <div class="grid gap-(--spacing-md) @sm:grid-cols-2">
+        @let selectedFrequency = alertForm.frequency().value();
+        <div [class]="fieldClass">
+          <label [class]="labelClass" for="alertFrequency">{{ 'alerts.alertFrequency' | transloco }}</label>
+          <SelectMenu class="contents" [options]="frequencies" [formField]="alertForm.frequency" [label]="frequencyLabel" size="md">
+            <button selectTrigger type="button" id="alertFrequency" class="select-trigger">
+              <span class="select-trigger-label" [class.select-placeholder]="selectedFrequency === null">
+                @if (selectedFrequency === null) {
+                  {{ 'alerts.selectFrequency' | transloco }}
+                } @else {
+                  {{ 'alerts.frequency.' + frequency[selectedFrequency] | transloco }}
+                }
+              </span>
+              <chevron-down-icon class="select-chevron" />
+            </button>
+
+            <ng-template #selectOption let-frequencyValue let-selected="selected">
+              <span class="select-option-body">
+                <span class="select-option-label">{{ 'alerts.frequency.' + frequency[frequencyValue] | transloco }}</span>
+              </span>
+              @if (selected) {
+                <check-icon class="select-option-check" />
+              }
+            </ng-template>
+          </SelectMenu>
+        </div>
+
+        <div [class]="fieldClass">
+          <label [class]="labelClass" for="alertTimes">{{ 'alerts.alertHours' | transloco }}</label>
+          <input-group [scheme]="showError(alertForm.time) ? 'error' : 'default'">
+            <input
+              input-control
+              type="time"
+              id="alertTimes"
+              autocomplete="off"
+              spellcheck="false"
+              [formField]="alertForm.time"
+              [attr.aria-invalid]="showError(alertForm.time) ? 'true' : null"
+              [attr.aria-describedby]="showError(alertForm.time) ? 'alertTimes-error' : null" />
+          </input-group>
+          @if (showError(alertForm.time)) {
+            <p id="alertTimes-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.time) | transloco }}</p>
+          }
+        </div>
+      </div>
+
+      <!--
+        An immediate alert does not repeat: the weekdays carry no meaning for it, so they are not offered
+        (the schema exempts it too).
+        A group of related checkboxes is a fieldset: its legend is what names the group for assistive
+        technologies. Each day is a native checkbox dressed as a toggle chip — the chip is its label, and
+        the name read out is the full weekday, the short one being decoration.
+      -->
+      @if (selectedFrequency !== frequency.Immediate) {
+        <fieldset
+          class="m-0 flex flex-col gap-(--spacing-xs) border-0 p-0"
+          [attr.aria-invalid]="showDaysError() ? 'true' : null"
+          [attr.aria-describedby]="showDaysError() ? 'alertDays-error' : null">
+          <div class="flex items-baseline justify-between gap-(--spacing-md)">
+            <legend [class]="labelClass + ' p-0'">{{ 'alerts.repeatOn' | transloco }}</legend>
+            <span class="flex gap-(--spacing-xs)">
+              <button type="button" variant="tertiary" size="sm" (click)="setDays(Days.WeekDays)">{{ 'alerts.weekdaysPreset' | transloco }}</button>
+              <button type="button" variant="tertiary" size="sm" (click)="setDays(Days.AllDays)">{{ 'alerts.everyDay' | transloco }}</button>
+            </span>
+          </div>
+          <div class="grid grid-cols-7 gap-1.5">
+            @for (day of weekdays; track day.key; let i = $index) {
+              <label
+                class="relative flex h-10 cursor-pointer items-center justify-center rounded-(--radius-md) border border-(--layer-page-edge) bg-(--bg-neutral-white) text-(length:--size-sm) font-medium text-(--font-neutral-muted) transition-colors select-none hover:bg-(--bg-primary-lighter) has-checked:border-(--stroke-primary-base) has-checked:bg-(--bg-primary-lighter) has-checked:text-(--font-primary-base) has-focus-visible:outline-2 has-focus-visible:outline-(--stroke-focus) motion-reduce:transition-none">
+                <input type="checkbox" class="absolute inset-0 m-0 size-full cursor-pointer opacity-0" [formField]="alertForm.days[day.key]" />
+                <span aria-hidden="true">{{ dayNames()[i] }}</span>
+                <span class="sr-only">{{ 'alerts.weekdays.' + day.key | transloco }}</span>
+              </label>
+            }
+          </div>
+          @if (showDaysError()) {
+            <p id="alertDays-error" role="alert" [class]="errorClass">
+              {{ errorKey(alertForm.days) | transloco }}
+            </p>
+          }
+        </fieldset>
+      }
+
+      <div class="flex items-center justify-between gap-(--spacing-md) rounded-(--radius-md) border border-(--layer-page-edge) px-(--spacing-md) py-(--spacing-sm)">
+        <div id="alertActiveLabel" class="flex min-w-0 flex-col">
+          <span class="text-(length:--size-base) font-medium">{{ 'alerts.alertActive' | transloco }}</span>
+          <span class="text-(length:--size-sm) text-(--font-neutral-muted)">{{ 'alerts.activeHint' | transloco }}</span>
+        </div>
+        <Switch [formField]="alertForm.active" aria-labelledby="alertActiveLabel" />
+      </div>
+
+      @if (alert(); as current) {
+        <section aria-labelledby="alertQueryTitle" class="flex flex-col gap-(--spacing-sm) rounded-(--radius-md) bg-(--layer-page-on-layer) p-(--spacing-md)">
+          <div class="flex min-w-0 flex-col gap-(--spacing-2xs)">
+            <h3 id="alertQueryTitle" class="m-0 text-(length:--size-sm) font-semibold">{{ 'alerts.queryWatched' | transloco }}</h3>
+            <p class="m-0 text-(length:--size-sm) wrap-anywhere text-(--font-neutral-muted)">
+              @for (part of querySummary(current); track $index; let first = $first) {
+                {{ first ? "" : " · " }}{{ part.key ? (part.key | transloco: part.params) : part.text }}
+              }
+            </p>
+          </div>
+          <div class="flex flex-wrap gap-(--spacing-xs)">
+            <button type="button" variant="secondary" size="sm" (click)="execute()" [disabled]="!canUpdateQuery()">
+              {{ 'alerts.execute' | transloco }}
+            </button>
+            @if (canUpdateQuery()) {
+              <button type="button" variant="tertiary" size="sm" [disabled]="updateStatus() !== 'idle'" (click)="updateQuery()">
+                @switch (updateStatus()) {
+                  @case ('updating') {
+                    <LoadingCircle class="size-4 animate-spin" width="16" height="16" />
+                    {{ 'alerts.updateQuery' | transloco }}
+                  }
+                  @case ('updated') {
+                    <CircleCheck width="16" height="16" />
+                    {{ 'alerts.queryUpdated' | transloco }}
+                  }
+                  @default {
+                    {{ 'alerts.updateQuery' | transloco }}
+                  }
+                }
+              </button>
+            }
+          </div>
+        </section>
+      }
+
+      @if (saveError(); as failure) {
+        <alert-save-error [detail]="failure.detail" />
+      }
+    </form>
+  `
+		}]
+	}],
+	propDecorators: {
+		index: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "index",
+				required: false
+			}]
+		}],
+		saved: [{
+			type: i0.Output,
+			args: ["saved"]
+		}],
+		executed: [{
+			type: i0.Output,
+			args: ["executed"]
+		}]
+	}
+});
+var AlertDialog = class AlertDialog {
+	call = injectCallRef();
+	dialog = viewChild(DialogComponent, ...ngDevMode ? [{ debugName: "dialog" }] : /* istanbul ignore next */ []);
+	index = this.call.props;
+	constructor() {
+		afterNextRender(() => this.dialog()?.open());
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: AlertDialog,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.2.0",
+		version: "22.2.1",
+		type: AlertDialog,
+		isStandalone: true,
+		selector: "alert-dialog, alertdialog, AlertDialog",
+		providers: [provideTranslocoScope("alerts")],
+		viewQueries: [{
+			propertyName: "dialog",
+			first: true,
+			predicate: DialogComponent,
+			descendants: true,
+			isSignal: true
+		}],
+		ngImport: i0,
+		template: `
+    <dialog #dialog (closed)="call.end($event)">
+      <DialogContent size="md">
+        <DialogHeader [closeLabel]="'alerts.close' | transloco">
+          <DialogTitle>{{ (index() === undefined ? 'alerts.createAlert' : 'alerts.editAlert') | transloco }}</DialogTitle>
+        </DialogHeader>
+
+        <DialogBody>
+          <alert-form #form [index]="index()" (saved)="dialog.close('dialog-confirm')" (executed)="dialog.close()" />
+        </DialogBody>
+
+        <DialogFooter>
+          <button type="button" variant="secondary" (click)="dialog.cancel()">
+            {{ 'cancel' | transloco }}
+          </button>
+          <!--
+            Deliberately not disabled on an invalid form: a disabled submit button never fires
+            submit(), which is what marks every field as touched and reveals the messages. The
+            weekday group has no other way to become touched — it emits no touch event — so the
+            "pick a day" error would be unreachable. It does wait for a save in progress.
+          -->
+          <button type="submit" [attr.form]="form.formId" [disabled]="form.saving()">
+            {{ 'confirm' | transloco }}
+          </button>
+        </DialogFooter>
+      </DialogContent>
+    </dialog>
+  `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: ButtonComponent,
+				selector: "button",
+				inputs: [
+					"class",
+					"variant",
+					"scheme",
+					"iconOnly",
+					"size"
+				]
+			},
+			{
+				kind: "component",
+				type: DialogComponent,
+				selector: "dialog, [dialog]",
+				inputs: ["closeLabel"],
+				outputs: ["closed"],
+				exportAs: ["dialog"]
+			},
+			{
+				kind: "component",
+				type: DialogHeaderComponent,
+				selector: "DialogHeader",
+				inputs: ["closeLabel", "class"]
 			},
 			{
-				kind: "component",
-				type: CheckIcon,
-				selector: "check, check-icon, Check, CheckIcon",
-				inputs: ["class"]
+				kind: "directive",
+				type: DialogTitleComponent,
+				selector: "DialogTitle",
+				inputs: ["id", "class"]
 			},
 			{
-				kind: "component",
-				type: LoadingCircleIcon,
-				selector: "loading-circle, loading-circle-icon, LoadingCircle, LoadingCircleIcon",
+				kind: "directive",
+				type: DialogContentComponent,
+				selector: "DialogContent",
+				inputs: [
+					"size",
+					"labelledby",
+					"class"
+				]
+			},
+			{
+				kind: "directive",
+				type: DialogBodyComponent,
+				selector: "DialogBody",
 				inputs: ["class"]
 			},
 			{
-				kind: "component",
-				type: CircleCheckIcon,
-				selector: "circle-check, circle-check-icon, CircleCheck, CircleCheckIcon",
+				kind: "directive",
+				type: DialogFooterComponent,
+				selector: "DialogFooter",
 				inputs: ["class"]
 			},
 			{
 				kind: "component",
-				type: TriangleAlertIcon,
-				selector: "triangle-alert, triangle-alert-icon, TriangleAlert, TriangleAlertIcon",
-				inputs: ["class"]
+				type: AlertFormComponent,
+				selector: "alert-form, alertform, AlertFormComponent",
+				inputs: ["index"],
+				outputs: ["saved", "executed"]
 			},
 			{
 				kind: "pipe",
@@ -16854,205 +17250,45 @@ i0.ɵɵngDeclareClassMetadata({
 		args: [{
 			selector: "alert-dialog, alertdialog, AlertDialog",
 			imports: [
-				FormRoot,
-				FormField,
 				TranslocoPipe,
 				ButtonComponent,
-				CheckboxComponent,
 				DialogComponent,
 				DialogHeaderComponent,
 				DialogTitleComponent,
 				DialogContentComponent,
 				DialogBodyComponent,
 				DialogFooterComponent,
-				InputComponent,
-				InputControlDirective,
-				SelectComponent,
-				SelectTriggerDirective,
-				ChevronDownIcon,
-				CheckIcon,
-				LoadingCircleIcon,
-				CircleCheckIcon,
-				TriangleAlertIcon
+				AlertFormComponent
 			],
 			providers: [provideTranslocoScope("alerts")],
 			template: `
     <dialog #dialog (closed)="call.end($event)">
       <DialogContent size="md">
         <DialogHeader [closeLabel]="'alerts.close' | transloco">
-          <DialogTitle>{{ 'alerts.createAlert' | transloco }}</DialogTitle>
+          <DialogTitle>{{ (index() === undefined ? 'alerts.createAlert' : 'alerts.editAlert') | transloco }}</DialogTitle>
         </DialogHeader>
 
-        <!--
-          [formRoot] poses novalidate, intercepts submit, calls preventDefault() and triggers submit()
-          on the field tree: Enter submits natively, and the action only runs on a valid form.
-          class="contents" keeps the DialogContent flex column intact — the body/footer slots are
-          styled by descendant selectors, which a display: contents wrapper does not break.
-        -->
-        <form [formRoot]="alertForm" class="contents" [attr.aria-label]="'alerts.createAlert' | transloco">
-          <DialogBody class="gap-(--spacing-md)">
-            <div [class]="fieldClass">
-              <label for="alertName" [class]="labelClass">{{ 'alerts.alertName' | transloco }}</label>
-              <input-group [scheme]="showError(alertForm.name) ? 'error' : 'default'">
-                <input
-                  input-control
-                  id="alertName"
-                  type="text"
-                  autocomplete="off"
-                  spellcheck="false"
-                  [formField]="alertForm.name"
-                  [attr.placeholder]="'alerts.placeholder' | transloco"
-                  [attr.aria-invalid]="showError(alertForm.name) ? 'true' : null"
-                  [attr.aria-describedby]="showError(alertForm.name) ? 'alertName-error' : null" />
-              </input-group>
-              @if (showError(alertForm.name)) {
-                <p id="alertName-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.name) | transloco }}</p>
-              }
-            </div>
-
-            @let selectedFrequency = alertForm.frequency().value();
-            <div [class]="fieldClass">
-              <label [class]="labelClass" for="alertFrequency">{{ 'alerts.alertFrequency' | transloco }}</label>
-              <SelectMenu
-                class="contents"
-                [options]="frequencies"
-                [formField]="alertForm.frequency"
-                [label]="frequencyLabel"
-                size="md">
-                <button selectTrigger type="button" id="alertFrequency" class="select-trigger">
-                  <span class="select-trigger-label" [class.select-placeholder]="selectedFrequency === null">
-                    @if (selectedFrequency === null) {
-                      {{ 'alerts.selectFrequency' | transloco }}
-                    } @else {
-                      {{ 'alerts.frequency.' + frequency[selectedFrequency] | transloco }}
-                    }
-                  </span>
-                  <chevron-down-icon class="select-chevron" />
-                </button>
-
-                <ng-template #selectOption let-frequencyValue let-selected="selected">
-                  <span class="select-option-body">
-                    <span class="select-option-label">{{ 'alerts.frequency.' + frequency[frequencyValue] | transloco }}</span>
-                  </span>
-                  @if (selected) {
-                    <check-icon class="select-option-check" />
-                  }
-                </ng-template>
-              </SelectMenu>
-            </div>
-
-            <!-- A group of related checkboxes is a fieldset: its legend is what names the group for
-                 assistive technologies. It used to be a <p>, which names nothing. -->
-            <fieldset
-              class="m-0 border-0 p-0"
-              [attr.aria-invalid]="showDaysError() ? 'true' : null"
-              [attr.aria-describedby]="showDaysError() ? 'alertDays-error' : null">
-              <legend [class]="labelClass + ' mb-(--spacing-2xs)'">{{ 'alerts.repeatOn' | transloco }}</legend>
-              <div class="weekdays-grid gap-1.5 px-2.5 py-0">
-                @for (day of weekdays; track day.key) {
-                  <div>
-                    <checkbox [formField]="alertForm.days[day.key]">
-                      {{ 'alerts.weekdays.' + day.key | transloco }}
-                    </checkbox>
-                  </div>
-                }
-              </div>
-              @if (showDaysError()) {
-                <p id="alertDays-error" role="alert" [class]="errorClass + ' mt-(--spacing-2xs)'">
-                  {{ errorKey(alertForm.days) | transloco }}
-                </p>
-              }
-            </fieldset>
-
-            <div [class]="fieldClass">
-              <label [class]="labelClass" for="alertTimes">{{ 'alerts.alertHours' | transloco }}</label>
-              <input-group [scheme]="showError(alertForm.time) ? 'error' : 'default'">
-                <input
-                  input-control
-                  type="time"
-                  id="alertTimes"
-                  autocomplete="off"
-                  spellcheck="false"
-                  [formField]="alertForm.time"
-                  [attr.aria-invalid]="showError(alertForm.time) ? 'true' : null"
-                  [attr.aria-describedby]="showError(alertForm.time) ? 'alertTimes-error' : null" />
-              </input-group>
-              @if (showError(alertForm.time)) {
-                <p id="alertTimes-error" role="alert" [class]="errorClass">{{ errorKey(alertForm.time) | transloco }}</p>
-              }
-            </div>
-
-            <div>
-              <checkbox [formField]="alertForm.active">{{ 'alerts.alertActive' | transloco }}</checkbox>
-            </div>
-          </DialogBody>
+        <DialogBody>
+          <alert-form #form [index]="index()" (saved)="dialog.close('dialog-confirm')" (executed)="dialog.close()" />
+        </DialogBody>
 
-          <DialogFooter class="flex-col">
-            <!-- Shown here and not as a toast: the dialog is modal, so it is in the top layer, above any toast. -->
-            @if (saveError(); as failure) {
-              <div class="save-error w-full">
-                <div class="min-h-0 overflow-hidden">
-                  <div
-                    id="alertSaveError"
-                    role="alert"
-                    class="flex w-full items-start gap-(--spacing-sm) rounded-(--radius-md) border border-(--stroke-error-base) bg-(--bg-error-lightest) p-(--spacing-md) text-(--font-error-base)">
-                    <TriangleAlert class="mt-0.5 size-4 shrink-0" width="16" height="16" aria-hidden="true" />
-                    <div class="flex min-w-0 flex-col gap-(--spacing-2xs)">
-                      <p class="m-0 font-medium">{{ 'alerts.saveFailed' | transloco }}</p>
-                      @if (failure.detail) {
-                        <p class="m-0 text-(length:--size-sm) wrap-anywhere opacity-80">{{ failure.detail }}</p>
-                      }
-                    </div>
-                  </div>
-                </div>
-              </div>
-            }
-            @if (alert() || canUpdateQuery()) {
-              <div class="flex w-full flex-col gap-2">
-                @if (alert()) {
-                  <button type="button" variant="secondary" (click)="execute()" [disabled]="!canUpdateQuery()">
-                    {{ 'alerts.execute' | transloco }}
-                  </button>
-                }
-                @if (canUpdateQuery()) {
-                  <button type="button" [disabled]="updateStatus() !== 'idle'" variant="tertiary" (click)="updateQuery()">
-                    @switch (updateStatus()) {
-                      @case ('updating') {
-                        <LoadingCircle class="size-4 animate-spin" width="16" height="16" />
-                        {{ 'alerts.updateQuery' | transloco }}
-                      }
-                      @case ('updated') {
-                        <CircleCheck width="16" height="16" />
-                        {{ 'alerts.queryUpdated' | transloco }}
-                      }
-                      @default {
-                        {{ 'alerts.updateQuery' | transloco }}
-                      }
-                    }
-                  </button>
-                }
-              </div>
-            }
-            <div class="ml-auto flex justify-end gap-2">
-              <button type="button" variant="secondary" (click)="dialog.cancel()">
-                {{ 'cancel' | transloco }}
-              </button>
-              <!--
-                Deliberately not disabled on an invalid form: a disabled submit button never fires
-                submit(), which is what marks every field as touched and reveals the messages. The
-                weekday group has no other way to become touched — the galactik Checkbox emits no
-                touch output — so the "pick a day" error would be unreachable.
-              -->
-              <button type="submit">
-                {{ 'confirm' | transloco }}
-              </button>
-            </div>
-          </DialogFooter>
-        </form>
+        <DialogFooter>
+          <button type="button" variant="secondary" (click)="dialog.cancel()">
+            {{ 'cancel' | transloco }}
+          </button>
+          <!--
+            Deliberately not disabled on an invalid form: a disabled submit button never fires
+            submit(), which is what marks every field as touched and reveals the messages. The
+            weekday group has no other way to become touched — it emits no touch event — so the
+            "pick a day" error would be unreachable. It does wait for a save in progress.
+          -->
+          <button type="submit" [attr.form]="form.formId" [disabled]="form.saving()">
+            {{ 'confirm' | transloco }}
+          </button>
+        </DialogFooter>
       </DialogContent>
     </dialog>
-  `,
-			styles: [".weekdays-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(100px,1fr))}.save-error{display:grid;animation:save-error-in .22s ease-out}.save-error>div>div{animation:save-error-card-in .22s ease-out}@keyframes save-error-in{0%{grid-template-rows:0fr}to{grid-template-rows:1fr}}@keyframes save-error-card-in{0%{opacity:0;transform:translateY(-6px)}to{opacity:1;transform:none}}@media(prefers-reduced-motion:reduce){.save-error,.save-error>div>div{animation:none}}\n"]
+  `
 		}]
 	}],
 	ctorParameters: () => [],
@@ -17073,6 +17309,13 @@ var AlertsComponent = class AlertsComponent {
 	transloco = inject(TranslocoService);
 	lang = toSignal(this.transloco.langChanges$);
 	query;
+	dialog = input(true, {
+		...ngDevMode ? { debugName: "dialog" } : /* istanbul ignore next */ {},
+		transform: booleanAttribute
+	});
+	editRequested = output();
+	createRequested = output();
+	saveError = signal(void 0, ...ngDevMode ? [{ debugName: "saveError" }] : /* istanbul ignore next */ []);
 	alerts = computed(() => this.userSettingsStore.alerts() ?? [], ...ngDevMode ? [{ debugName: "alerts" }] : /* istanbul ignore next */ []);
 	order = linkedSignal(() => [...this.alerts()], ...ngDevMode ? [{ debugName: "order" }] : /* istanbul ignore next */ []);
 	hidden = signal(/* @__PURE__ */ new Set(), ...ngDevMode ? [{ debugName: "hidden" }] : /* istanbul ignore next */ []);
@@ -17107,10 +17350,18 @@ var AlertsComponent = class AlertsComponent {
 		const index = this.alerts().indexOf(alert);
 		if (index < 0) return;
 		this.floating?.close();
+		if (!this.dialog()) {
+			this.editRequested.emit(index);
+			return;
+		}
 		AlertForm.call(index, { injector: this.injector });
 	}
 	createAlert() {
 		this.floating?.close();
+		if (!this.dialog()) {
+			this.createRequested.emit();
+			return;
+		}
 		AlertForm.call(void 0, { injector: this.injector });
 	}
 	pendingActive = signal(/* @__PURE__ */ new Map(), ...ngDevMode ? [{ debugName: "pendingActive" }] : /* istanbul ignore next */ []);
@@ -17120,6 +17371,7 @@ var AlertsComponent = class AlertsComponent {
 	async toggle(alert, active) {
 		const index = this.alerts().indexOf(alert);
 		if (index < 0) return;
+		this.saveError.set(void 0);
 		this.pendingActive.update((pending) => new Map(pending).set(alert, active));
 		try {
 			await this.userSettingsStore.updateAlert({
@@ -17127,7 +17379,7 @@ var AlertsComponent = class AlertsComponent {
 				active
 			}, index);
 		} catch (error) {
-			notifySaveFailed(this.transloco, error);
+			this.saveError.set({ detail: saveErrorDetail(error) });
 		} finally {
 			this.pendingActive.update((pending) => {
 				const next = new Map(pending);
@@ -17159,7 +17411,7 @@ var AlertsComponent = class AlertsComponent {
 			this.unhide(alert);
 			return;
 		}
-		this.userSettingsStore.deleteAlert(index).catch((error) => notifySaveFailed(this.transloco, error)).finally(() => this.unhide(alert));
+		this.userSettingsStore.deleteAlert(index).catch((error) => this.saveError.set({ detail: saveErrorDetail(error) })).finally(() => this.unhide(alert));
 	}
 	unhide(alert) {
 		this.hidden.update((hidden) => {
@@ -17173,12 +17425,13 @@ var AlertsComponent = class AlertsComponent {
 		const previous = this.order();
 		const next = [...shown, ...previous.filter((alert) => hidden.has(alert))];
 		if (next.every((alert, index) => alert === previous[index])) return;
+		this.saveError.set(void 0);
 		this.order.set(next);
 		try {
 			await this.userSettingsStore.updateAlerts(next);
 		} catch (error) {
 			this.order.set(previous);
-			notifySaveFailed(this.transloco, error);
+			this.saveError.set({ detail: saveErrorDetail(error) });
 		}
 	}
 	static ɵfac = i0.ɵɵngDeclareFactory({
@@ -17195,9 +17448,20 @@ var AlertsComponent = class AlertsComponent {
 		type: AlertsComponent,
 		isStandalone: true,
 		selector: "Alerts",
+		inputs: { dialog: {
+			classPropertyName: "dialog",
+			publicName: "dialog",
+			isSignal: true,
+			isRequired: false,
+			transformFunction: null
+		} },
+		outputs: {
+			editRequested: "editRequested",
+			createRequested: "createRequested"
+		},
 		providers: [provideTranslocoScope("alerts")],
 		ngImport: i0,
-		template: "<div class=\"flex min-w-80 flex-col gap-(--spacing-3xs) p-2\">\n  <div class=\"flex items-center gap-(--spacing-2xs) ps-(--spacing-2xs)\">\n    @if (floating) {\n      <!-- Not an <h2>: a page's prose styles put a rule and margins on every h2, even inside a popover. -->\n      <span\n        role=\"heading\"\n        aria-level=\"2\"\n        class=\"flex-1 text-xl leading-(--line-height-4) font-bold\">\n        {{ \"alerts.label\" | transloco }}\n        @if (visible().length) {\n          <span\n            class=\"text-(length:--size-sm) font-normal text-(--font-neutral-muted)\"\n            >· {{ visible().length }}</span\n          >\n        }\n      </span>\n    } @else {\n      <span class=\"flex-1\"></span>\n    }\n    <!-- With no alert, \"Create\" is the call to action of the empty state, below. -->\n    @if (visible().length) {\n      <button size=\"md\" (click)=\"createAlert()\">\n        <plus-icon />\n        {{ \"alerts.create\" | transloco }}\n      </button>\n    }\n  </div>\n\n  <ul\n    role=\"list\"\n    class=\"m-0 flex list-none flex-col p-0\"\n    [attr.aria-label]=\"'alerts.label' | transloco\"\n    [sortable]=\"visible()\"\n    #sortable=\"sortable\"\n    [sortableAnnounce]=\"announceMove\"\n    (reorder)=\"saveOrder($event)\">\n    @for (alert of sortable.items(); track alert.name) {\n      @let name = alert.name;\n      <li\n        [sortableItem]=\"alert\"\n        class=\"group relative flex min-h-12 w-full cursor-pointer items-center gap-(--spacing-3xs) rounded-(--radius-sm) py-(--spacing-3xs) ps-(--spacing-3xs) pe-(--spacing-2xs) text-(--font-neutral-base) select-none hover:bg-(--bg-primary-lighter) focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-(--stroke-focus) active:bg-(--bg-primary-light) data-dragging:bg-(--bg-primary-lighter) data-dragging:outline-2 data-dragging:-outline-offset-2 data-dragging:outline-(--stroke-primary-base) data-dragging:outline-dashed data-dragging:*:invisible\"\n        tabindex=\"0\"\n        [attr.data-inactive]=\"alert.active ? null : ''\"\n        (click)=\"onRowClick($event, alert)\"\n        (keydown.enter)=\"onRowEnter($event, alert)\">\n        <!-- Handle: shown when the row is hovered or focused, only if there is something to reorder. -->\n        <grip-vertical-icon\n          class=\"shrink-0 cursor-grab text-(--font-neutral-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 pointer-coarse:hidden\"\n          [class.invisible]=\"visible().length < 2\" />\n        @if (alert.active) {\n          <bell-icon class=\"shrink-0\" />\n        } @else {\n          <bell-slash-icon class=\"shrink-0 text-(--font-neutral-muted)\" />\n        }\n        <span class=\"flex min-w-0 flex-1 flex-col\">\n          <span\n            class=\"line-clamp-1 text-(length:--size-base) group-data-inactive:text-(--font-neutral-muted)\"\n            >{{ name }}</span\n          >\n          @if (summaryOf(alert).length) {\n            <span\n              class=\"line-clamp-1 text-(length:--size-sm) text-(--font-neutral-muted)\">\n              @for (\n                part of summaryOf(alert);\n                track $index;\n                let first = $first\n              ) {\n                {{ first ? \"\" : \" · \"\n                }}{{ part.key ? (part.key | transloco) : part.text }}\n              }\n            </span>\n          }\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <Switch\n            [checked]=\"isActive(alert)\"\n            [aria-label]=\"'alerts.alertActiveFor' | transloco: { name }\"\n            (checkedChange)=\"toggle(alert, $event)\" />\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <button\n            variant=\"tertiary\"\n            size=\"sm\"\n            [iconOnly]=\"true\"\n            class=\"text-(--font-error-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 hover:bg-(--bg-error-lightest) hover:text-(--font-error-base) focus-visible:opacity-100 pointer-coarse:opacity-100\"\n            [attr.title]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            [attr.aria-label]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            (click)=\"deleteAlert(alert)\">\n            <TrashIcon />\n          </button>\n        </span>\n      </li>\n    } @empty {\n      <li class=\"list-none\">\n        <ListPanelEmpty color=\"orange\">\n          <bell-icon listPanelEmptyIcon />\n          {{ \"alerts.noAlerts\" | transloco }}\n          <p listPanelEmptyHint>{{ \"alerts.noAlertsHint\" | transloco }}</p>\n          <button listPanelEmptyAction (click)=\"createAlert()\">\n            <plus-icon />\n            {{ \"alerts.createAlert\" | transloco }}\n          </button>\n        </ListPanelEmpty>\n      </li>\n    }\n  </ul>\n\n  @if (visible().length > 1) {\n    <p\n      class=\"m-0 ps-(--spacing-2xs) pt-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-muted)\">\n      {{ \"alerts.reorderHint\" | transloco }}\n    </p>\n  }\n\n  <!-- The regions exist before their text does, which is what makes a screen reader announce the text. -->\n  <div role=\"status\">\n    @if (pendingDeletion(); as pending) {\n      <div\n        class=\"mt-(--spacing-2xs) flex items-center gap-(--spacing-2xs) rounded-(--radius-sm) bg-(--bg-neutral-base) py-(--spacing-3xs) ps-(--spacing-xs) pe-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-base)\">\n        <span class=\"min-w-0 flex-1\">{{\n          \"alerts.deleted\" | transloco: { name: pending.name }\n        }}</span>\n        <button variant=\"tertiary\" size=\"sm\" (click)=\"undoDeletion()\">\n          {{ \"alerts.undo\" | transloco }}\n        </button>\n      </div>\n    }\n  </div>\n</div>\n",
+		template: "<div class=\"flex min-w-80 flex-col gap-(--spacing-3xs) p-2\">\n  <div class=\"flex items-center gap-(--spacing-2xs) ps-(--spacing-2xs)\">\n    @if (floating) {\n      <!-- Not an <h2>: a page's prose styles put a rule and margins on every h2, even inside a popover. -->\n      <span\n        role=\"heading\"\n        aria-level=\"2\"\n        class=\"flex-1 text-xl leading-(--line-height-4) font-bold\">\n        {{ \"alerts.label\" | transloco }}\n        @if (visible().length) {\n          <span\n            class=\"text-(length:--size-sm) font-normal text-(--font-neutral-muted)\"\n            >· {{ visible().length }}</span\n          >\n        }\n      </span>\n    } @else {\n      <span class=\"flex-1\"></span>\n    }\n    <!-- With no alert, \"Create\" is the call to action of the empty state, below. -->\n    @if (visible().length) {\n      <button size=\"md\" (click)=\"createAlert()\">\n        <plus-icon />\n        {{ \"alerts.create\" | transloco }}\n      </button>\n    }\n  </div>\n\n  @if (saveError(); as failure) {\n    <alert-save-error class=\"mb-(--spacing-2xs)\" [detail]=\"failure.detail\" />\n  }\n\n  <ul\n    role=\"list\"\n    class=\"m-0 flex list-none flex-col p-0\"\n    [attr.aria-label]=\"'alerts.label' | transloco\"\n    [sortable]=\"visible()\"\n    #sortable=\"sortable\"\n    [sortableAnnounce]=\"announceMove\"\n    (reorder)=\"saveOrder($event)\">\n    @for (alert of sortable.items(); track alert.name) {\n      @let name = alert.name;\n      <li\n        [sortableItem]=\"alert\"\n        class=\"group relative flex min-h-12 w-full cursor-pointer items-center gap-(--spacing-3xs) rounded-(--radius-sm) py-(--spacing-3xs) ps-(--spacing-3xs) pe-(--spacing-2xs) text-(--font-neutral-base) select-none hover:bg-(--bg-primary-lighter) focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-(--stroke-focus) active:bg-(--bg-primary-light) data-dragging:bg-(--bg-primary-lighter) data-dragging:outline-2 data-dragging:-outline-offset-2 data-dragging:outline-(--stroke-primary-base) data-dragging:outline-dashed data-dragging:*:invisible\"\n        tabindex=\"0\"\n        [attr.data-inactive]=\"alert.active ? null : ''\"\n        (click)=\"onRowClick($event, alert)\"\n        (keydown.enter)=\"onRowEnter($event, alert)\">\n        <!-- Handle: shown when the row is hovered or focused, only if there is something to reorder. -->\n        <grip-vertical-icon\n          class=\"shrink-0 cursor-grab text-(--font-neutral-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 pointer-coarse:hidden\"\n          [class.invisible]=\"visible().length < 2\" />\n        @if (alert.active) {\n          <bell-icon class=\"shrink-0\" />\n        } @else {\n          <bell-slash-icon class=\"shrink-0 text-(--font-neutral-muted)\" />\n        }\n        <span class=\"flex min-w-0 flex-1 flex-col\">\n          <span\n            class=\"line-clamp-1 text-(length:--size-base) group-data-inactive:text-(--font-neutral-muted)\"\n            >{{ name }}</span\n          >\n          @if (summaryOf(alert).length) {\n            <span\n              class=\"line-clamp-1 text-(length:--size-sm) text-(--font-neutral-muted)\">\n              @for (\n                part of summaryOf(alert);\n                track $index;\n                let first = $first\n              ) {\n                {{ first ? \"\" : \" · \"\n                }}{{ part.key ? (part.key | transloco) : part.text }}\n              }\n            </span>\n          }\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <Switch\n            [checked]=\"isActive(alert)\"\n            [aria-label]=\"'alerts.alertActiveFor' | transloco: { name }\"\n            (checkedChange)=\"toggle(alert, $event)\" />\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <button\n            variant=\"tertiary\"\n            size=\"sm\"\n            [iconOnly]=\"true\"\n            class=\"text-(--font-error-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 hover:bg-(--bg-error-lightest) hover:text-(--font-error-base) focus-visible:opacity-100 pointer-coarse:opacity-100\"\n            [attr.title]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            [attr.aria-label]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            (click)=\"deleteAlert(alert)\">\n            <TrashIcon />\n          </button>\n        </span>\n      </li>\n    } @empty {\n      <li class=\"list-none\">\n        <ListPanelEmpty color=\"orange\">\n          <bell-icon listPanelEmptyIcon />\n          {{ \"alerts.noAlerts\" | transloco }}\n          <p listPanelEmptyHint>{{ \"alerts.noAlertsHint\" | transloco }}</p>\n          <button listPanelEmptyAction (click)=\"createAlert()\">\n            <plus-icon />\n            {{ \"alerts.createAlert\" | transloco }}\n          </button>\n        </ListPanelEmpty>\n      </li>\n    }\n  </ul>\n\n  @if (visible().length > 1) {\n    <p\n      class=\"m-0 ps-(--spacing-2xs) pt-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-muted)\">\n      {{ \"alerts.reorderHint\" | transloco }}\n    </p>\n  }\n\n  <!-- The regions exist before their text does, which is what makes a screen reader announce the text. -->\n  <div role=\"status\">\n    @if (pendingDeletion(); as pending) {\n      <div\n        class=\"mt-(--spacing-2xs) flex items-center gap-(--spacing-2xs) rounded-(--radius-sm) bg-(--bg-neutral-base) py-(--spacing-3xs) ps-(--spacing-xs) pe-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-base)\">\n        <span class=\"min-w-0 flex-1\">{{\n          \"alerts.deleted\" | transloco: { name: pending.name }\n        }}</span>\n        <button variant=\"tertiary\" size=\"sm\" (click)=\"undoDeletion()\">\n          {{ \"alerts.undo\" | transloco }}\n        </button>\n      </div>\n    }\n  </div>\n</div>\n",
 		dependencies: [
 			{
 				kind: "directive",
@@ -17282,6 +17546,12 @@ var AlertsComponent = class AlertsComponent {
 				selector: "list-panel-empty, ListPanelEmpty",
 				inputs: ["color"]
 			},
+			{
+				kind: "component",
+				type: AlertSaveErrorComponent,
+				selector: "alert-save-error",
+				inputs: ["detail"]
+			},
 			{
 				kind: "pipe",
 				type: TranslocoPipe,
@@ -17310,13 +17580,32 @@ i0.ɵɵngDeclareClassMetadata({
 				GripVerticalIcon,
 				PlusIcon,
 				TrashIcon,
-				ListPanelEmptyComponent
+				ListPanelEmptyComponent,
+				AlertSaveErrorComponent
 			],
 			providers: [provideTranslocoScope("alerts")],
-			template: "<div class=\"flex min-w-80 flex-col gap-(--spacing-3xs) p-2\">\n  <div class=\"flex items-center gap-(--spacing-2xs) ps-(--spacing-2xs)\">\n    @if (floating) {\n      <!-- Not an <h2>: a page's prose styles put a rule and margins on every h2, even inside a popover. -->\n      <span\n        role=\"heading\"\n        aria-level=\"2\"\n        class=\"flex-1 text-xl leading-(--line-height-4) font-bold\">\n        {{ \"alerts.label\" | transloco }}\n        @if (visible().length) {\n          <span\n            class=\"text-(length:--size-sm) font-normal text-(--font-neutral-muted)\"\n            >· {{ visible().length }}</span\n          >\n        }\n      </span>\n    } @else {\n      <span class=\"flex-1\"></span>\n    }\n    <!-- With no alert, \"Create\" is the call to action of the empty state, below. -->\n    @if (visible().length) {\n      <button size=\"md\" (click)=\"createAlert()\">\n        <plus-icon />\n        {{ \"alerts.create\" | transloco }}\n      </button>\n    }\n  </div>\n\n  <ul\n    role=\"list\"\n    class=\"m-0 flex list-none flex-col p-0\"\n    [attr.aria-label]=\"'alerts.label' | transloco\"\n    [sortable]=\"visible()\"\n    #sortable=\"sortable\"\n    [sortableAnnounce]=\"announceMove\"\n    (reorder)=\"saveOrder($event)\">\n    @for (alert of sortable.items(); track alert.name) {\n      @let name = alert.name;\n      <li\n        [sortableItem]=\"alert\"\n        class=\"group relative flex min-h-12 w-full cursor-pointer items-center gap-(--spacing-3xs) rounded-(--radius-sm) py-(--spacing-3xs) ps-(--spacing-3xs) pe-(--spacing-2xs) text-(--font-neutral-base) select-none hover:bg-(--bg-primary-lighter) focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-(--stroke-focus) active:bg-(--bg-primary-light) data-dragging:bg-(--bg-primary-lighter) data-dragging:outline-2 data-dragging:-outline-offset-2 data-dragging:outline-(--stroke-primary-base) data-dragging:outline-dashed data-dragging:*:invisible\"\n        tabindex=\"0\"\n        [attr.data-inactive]=\"alert.active ? null : ''\"\n        (click)=\"onRowClick($event, alert)\"\n        (keydown.enter)=\"onRowEnter($event, alert)\">\n        <!-- Handle: shown when the row is hovered or focused, only if there is something to reorder. -->\n        <grip-vertical-icon\n          class=\"shrink-0 cursor-grab text-(--font-neutral-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 pointer-coarse:hidden\"\n          [class.invisible]=\"visible().length < 2\" />\n        @if (alert.active) {\n          <bell-icon class=\"shrink-0\" />\n        } @else {\n          <bell-slash-icon class=\"shrink-0 text-(--font-neutral-muted)\" />\n        }\n        <span class=\"flex min-w-0 flex-1 flex-col\">\n          <span\n            class=\"line-clamp-1 text-(length:--size-base) group-data-inactive:text-(--font-neutral-muted)\"\n            >{{ name }}</span\n          >\n          @if (summaryOf(alert).length) {\n            <span\n              class=\"line-clamp-1 text-(length:--size-sm) text-(--font-neutral-muted)\">\n              @for (\n                part of summaryOf(alert);\n                track $index;\n                let first = $first\n              ) {\n                {{ first ? \"\" : \" · \"\n                }}{{ part.key ? (part.key | transloco) : part.text }}\n              }\n            </span>\n          }\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <Switch\n            [checked]=\"isActive(alert)\"\n            [aria-label]=\"'alerts.alertActiveFor' | transloco: { name }\"\n            (checkedChange)=\"toggle(alert, $event)\" />\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <button\n            variant=\"tertiary\"\n            size=\"sm\"\n            [iconOnly]=\"true\"\n            class=\"text-(--font-error-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 hover:bg-(--bg-error-lightest) hover:text-(--font-error-base) focus-visible:opacity-100 pointer-coarse:opacity-100\"\n            [attr.title]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            [attr.aria-label]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            (click)=\"deleteAlert(alert)\">\n            <TrashIcon />\n          </button>\n        </span>\n      </li>\n    } @empty {\n      <li class=\"list-none\">\n        <ListPanelEmpty color=\"orange\">\n          <bell-icon listPanelEmptyIcon />\n          {{ \"alerts.noAlerts\" | transloco }}\n          <p listPanelEmptyHint>{{ \"alerts.noAlertsHint\" | transloco }}</p>\n          <button listPanelEmptyAction (click)=\"createAlert()\">\n            <plus-icon />\n            {{ \"alerts.createAlert\" | transloco }}\n          </button>\n        </ListPanelEmpty>\n      </li>\n    }\n  </ul>\n\n  @if (visible().length > 1) {\n    <p\n      class=\"m-0 ps-(--spacing-2xs) pt-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-muted)\">\n      {{ \"alerts.reorderHint\" | transloco }}\n    </p>\n  }\n\n  <!-- The regions exist before their text does, which is what makes a screen reader announce the text. -->\n  <div role=\"status\">\n    @if (pendingDeletion(); as pending) {\n      <div\n        class=\"mt-(--spacing-2xs) flex items-center gap-(--spacing-2xs) rounded-(--radius-sm) bg-(--bg-neutral-base) py-(--spacing-3xs) ps-(--spacing-xs) pe-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-base)\">\n        <span class=\"min-w-0 flex-1\">{{\n          \"alerts.deleted\" | transloco: { name: pending.name }\n        }}</span>\n        <button variant=\"tertiary\" size=\"sm\" (click)=\"undoDeletion()\">\n          {{ \"alerts.undo\" | transloco }}\n        </button>\n      </div>\n    }\n  </div>\n</div>\n"
+			template: "<div class=\"flex min-w-80 flex-col gap-(--spacing-3xs) p-2\">\n  <div class=\"flex items-center gap-(--spacing-2xs) ps-(--spacing-2xs)\">\n    @if (floating) {\n      <!-- Not an <h2>: a page's prose styles put a rule and margins on every h2, even inside a popover. -->\n      <span\n        role=\"heading\"\n        aria-level=\"2\"\n        class=\"flex-1 text-xl leading-(--line-height-4) font-bold\">\n        {{ \"alerts.label\" | transloco }}\n        @if (visible().length) {\n          <span\n            class=\"text-(length:--size-sm) font-normal text-(--font-neutral-muted)\"\n            >· {{ visible().length }}</span\n          >\n        }\n      </span>\n    } @else {\n      <span class=\"flex-1\"></span>\n    }\n    <!-- With no alert, \"Create\" is the call to action of the empty state, below. -->\n    @if (visible().length) {\n      <button size=\"md\" (click)=\"createAlert()\">\n        <plus-icon />\n        {{ \"alerts.create\" | transloco }}\n      </button>\n    }\n  </div>\n\n  @if (saveError(); as failure) {\n    <alert-save-error class=\"mb-(--spacing-2xs)\" [detail]=\"failure.detail\" />\n  }\n\n  <ul\n    role=\"list\"\n    class=\"m-0 flex list-none flex-col p-0\"\n    [attr.aria-label]=\"'alerts.label' | transloco\"\n    [sortable]=\"visible()\"\n    #sortable=\"sortable\"\n    [sortableAnnounce]=\"announceMove\"\n    (reorder)=\"saveOrder($event)\">\n    @for (alert of sortable.items(); track alert.name) {\n      @let name = alert.name;\n      <li\n        [sortableItem]=\"alert\"\n        class=\"group relative flex min-h-12 w-full cursor-pointer items-center gap-(--spacing-3xs) rounded-(--radius-sm) py-(--spacing-3xs) ps-(--spacing-3xs) pe-(--spacing-2xs) text-(--font-neutral-base) select-none hover:bg-(--bg-primary-lighter) focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-(--stroke-focus) active:bg-(--bg-primary-light) data-dragging:bg-(--bg-primary-lighter) data-dragging:outline-2 data-dragging:-outline-offset-2 data-dragging:outline-(--stroke-primary-base) data-dragging:outline-dashed data-dragging:*:invisible\"\n        tabindex=\"0\"\n        [attr.data-inactive]=\"alert.active ? null : ''\"\n        (click)=\"onRowClick($event, alert)\"\n        (keydown.enter)=\"onRowEnter($event, alert)\">\n        <!-- Handle: shown when the row is hovered or focused, only if there is something to reorder. -->\n        <grip-vertical-icon\n          class=\"shrink-0 cursor-grab text-(--font-neutral-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 pointer-coarse:hidden\"\n          [class.invisible]=\"visible().length < 2\" />\n        @if (alert.active) {\n          <bell-icon class=\"shrink-0\" />\n        } @else {\n          <bell-slash-icon class=\"shrink-0 text-(--font-neutral-muted)\" />\n        }\n        <span class=\"flex min-w-0 flex-1 flex-col\">\n          <span\n            class=\"line-clamp-1 text-(length:--size-base) group-data-inactive:text-(--font-neutral-muted)\"\n            >{{ name }}</span\n          >\n          @if (summaryOf(alert).length) {\n            <span\n              class=\"line-clamp-1 text-(length:--size-sm) text-(--font-neutral-muted)\">\n              @for (\n                part of summaryOf(alert);\n                track $index;\n                let first = $first\n              ) {\n                {{ first ? \"\" : \" · \"\n                }}{{ part.key ? (part.key | transloco) : part.text }}\n              }\n            </span>\n          }\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <Switch\n            [checked]=\"isActive(alert)\"\n            [aria-label]=\"'alerts.alertActiveFor' | transloco: { name }\"\n            (checkedChange)=\"toggle(alert, $event)\" />\n        </span>\n        <span data-row-action class=\"flex shrink-0 items-center\">\n          <button\n            variant=\"tertiary\"\n            size=\"sm\"\n            [iconOnly]=\"true\"\n            class=\"text-(--font-error-muted) opacity-0 group-focus-within:opacity-100 group-hover:opacity-100 hover:bg-(--bg-error-lightest) hover:text-(--font-error-base) focus-visible:opacity-100 pointer-coarse:opacity-100\"\n            [attr.title]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            [attr.aria-label]=\"'alerts.deleteAlertNamed' | transloco: { name }\"\n            (click)=\"deleteAlert(alert)\">\n            <TrashIcon />\n          </button>\n        </span>\n      </li>\n    } @empty {\n      <li class=\"list-none\">\n        <ListPanelEmpty color=\"orange\">\n          <bell-icon listPanelEmptyIcon />\n          {{ \"alerts.noAlerts\" | transloco }}\n          <p listPanelEmptyHint>{{ \"alerts.noAlertsHint\" | transloco }}</p>\n          <button listPanelEmptyAction (click)=\"createAlert()\">\n            <plus-icon />\n            {{ \"alerts.createAlert\" | transloco }}\n          </button>\n        </ListPanelEmpty>\n      </li>\n    }\n  </ul>\n\n  @if (visible().length > 1) {\n    <p\n      class=\"m-0 ps-(--spacing-2xs) pt-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-muted)\">\n      {{ \"alerts.reorderHint\" | transloco }}\n    </p>\n  }\n\n  <!-- The regions exist before their text does, which is what makes a screen reader announce the text. -->\n  <div role=\"status\">\n    @if (pendingDeletion(); as pending) {\n      <div\n        class=\"mt-(--spacing-2xs) flex items-center gap-(--spacing-2xs) rounded-(--radius-sm) bg-(--bg-neutral-base) py-(--spacing-3xs) ps-(--spacing-xs) pe-(--spacing-3xs) text-(length:--size-sm) text-(--font-neutral-base)\">\n        <span class=\"min-w-0 flex-1\">{{\n          \"alerts.deleted\" | transloco: { name: pending.name }\n        }}</span>\n        <button variant=\"tertiary\" size=\"sm\" (click)=\"undoDeletion()\">\n          {{ \"alerts.undo\" | transloco }}\n        </button>\n      </div>\n    }\n  </div>\n</div>\n"
 		}]
 	}],
-	ctorParameters: () => []
+	ctorParameters: () => [],
+	propDecorators: {
+		dialog: [{
+			type: i0.Input,
+			args: [{
+				isSignal: true,
+				alias: "dialog",
+				required: false
+			}]
+		}],
+		editRequested: [{
+			type: i0.Output,
+			args: ["editRequested"]
+		}],
+		createRequested: [{
+			type: i0.Output,
+			args: ["createRequested"]
+		}]
+	}
 });
 const passwordChangeSchema = schema((p) => {
 	required(p.currentPassword);
@@ -32837,6 +33126,147 @@ i0.ɵɵngDeclareClassMetadata({
 		}]
 	}] }
 });
+var SettingsAlertsPanelComponent = class SettingsAlertsPanelComponent {
+	closeRequested = output();
+	form = signal(void 0, ...ngDevMode ? [{ debugName: "form" }] : /* istanbul ignore next */ []);
+	edit(index) {
+		this.form.set({ index });
+	}
+	create() {
+		this.form.set({ index: void 0 });
+	}
+	back() {
+		this.form.set(void 0);
+	}
+	static ɵfac = i0.ɵɵngDeclareFactory({
+		minVersion: "12.0.0",
+		version: "22.2.1",
+		ngImport: i0,
+		type: SettingsAlertsPanelComponent,
+		deps: [],
+		target: i0.ɵɵFactoryTarget.Component
+	});
+	static ɵcmp = i0.ɵɵngDeclareComponent({
+		minVersion: "17.0.0",
+		version: "22.2.1",
+		type: SettingsAlertsPanelComponent,
+		isStandalone: true,
+		selector: "settings-alerts-panel",
+		outputs: { closeRequested: "closeRequested" },
+		providers: [provideTranslocoScope("settings"), provideTranslocoScope("alerts")],
+		ngImport: i0,
+		template: `
+    @if (form(); as current) {
+      <button type="button" variant="tertiary" size="sm" class="-ms-(--spacing-xs) mb-(--spacing-xs)" (click)="back()">
+        <chevron-left-icon aria-hidden="true" />
+        {{ "settings.alerts.back" | transloco }}
+      </button>
+      <h2 class="mb-(--spacing-md) text-(length:--size-2xl) font-semibold">
+        {{ (current.index === undefined ? "alerts.createAlert" : "alerts.editAlert") | transloco }}
+      </h2>
+
+      <alert-form #alertForm [index]="current.index" (saved)="back()" (executed)="closeRequested.emit()" />
+
+      <div class="mt-(--spacing-lg) flex justify-end gap-(--spacing-xs)">
+        <button type="button" variant="secondary" (click)="back()">{{ "cancel" | transloco }}</button>
+        <button type="submit" [attr.form]="alertForm.formId" [disabled]="alertForm.saving()">{{ "confirm" | transloco }}</button>
+      </div>
+    } @else {
+      <h2 class="text-(length:--size-2xl) font-semibold">{{ "settings.alerts.title" | transloco }}</h2>
+      <p class="text-(--font-primary-muted)">{{ "settings.alerts.description" | transloco }}</p>
+
+      <Alerts class="mt-(--spacing-md) block" [dialog]="false" (editRequested)="edit($event)" (createRequested)="create()" />
+    }
+  `,
+		isInline: true,
+		dependencies: [
+			{
+				kind: "directive",
+				type: ButtonComponent,
+				selector: "button",
+				inputs: [
+					"class",
+					"variant",
+					"scheme",
+					"iconOnly",
+					"size"
+				]
+			},
+			{
+				kind: "component",
+				type: ChevronLeftIcon,
+				selector: "chevron-left, chevron-left-icon, ChevronLeft, ChevronLeftIcon",
+				inputs: ["class"]
+			},
+			{
+				kind: "component",
+				type: AlertsComponent,
+				selector: "Alerts",
+				inputs: ["dialog"],
+				outputs: ["editRequested", "createRequested"]
+			},
+			{
+				kind: "component",
+				type: AlertFormComponent,
+				selector: "alert-form, alertform, AlertFormComponent",
+				inputs: ["index"],
+				outputs: ["saved", "executed"]
+			},
+			{
+				kind: "pipe",
+				type: TranslocoPipe,
+				name: "transloco"
+			}
+		]
+	});
+};
+i0.ɵɵngDeclareClassMetadata({
+	minVersion: "12.0.0",
+	version: "22.2.1",
+	ngImport: i0,
+	type: SettingsAlertsPanelComponent,
+	decorators: [{
+		type: Component,
+		args: [{
+			selector: "settings-alerts-panel",
+			imports: [
+				TranslocoPipe,
+				ButtonComponent,
+				ChevronLeftIcon,
+				AlertsComponent,
+				AlertFormComponent
+			],
+			providers: [provideTranslocoScope("settings"), provideTranslocoScope("alerts")],
+			template: `
+    @if (form(); as current) {
+      <button type="button" variant="tertiary" size="sm" class="-ms-(--spacing-xs) mb-(--spacing-xs)" (click)="back()">
+        <chevron-left-icon aria-hidden="true" />
+        {{ "settings.alerts.back" | transloco }}
+      </button>
+      <h2 class="mb-(--spacing-md) text-(length:--size-2xl) font-semibold">
+        {{ (current.index === undefined ? "alerts.createAlert" : "alerts.editAlert") | transloco }}
+      </h2>
+
+      <alert-form #alertForm [index]="current.index" (saved)="back()" (executed)="closeRequested.emit()" />
+
+      <div class="mt-(--spacing-lg) flex justify-end gap-(--spacing-xs)">
+        <button type="button" variant="secondary" (click)="back()">{{ "cancel" | transloco }}</button>
+        <button type="submit" [attr.form]="alertForm.formId" [disabled]="alertForm.saving()">{{ "confirm" | transloco }}</button>
+      </div>
+    } @else {
+      <h2 class="text-(length:--size-2xl) font-semibold">{{ "settings.alerts.title" | transloco }}</h2>
+      <p class="text-(--font-primary-muted)">{{ "settings.alerts.description" | transloco }}</p>
+
+      <Alerts class="mt-(--spacing-md) block" [dialog]="false" (editRequested)="edit($event)" (createRequested)="create()" />
+    }
+  `
+		}]
+	}],
+	propDecorators: { closeRequested: [{
+		type: i0.Output,
+		args: ["closeRequested"]
+	}] }
+});
 const THEMES$1 = [
 	"light",
 	"dark",
@@ -33173,6 +33603,10 @@ var SettingsDialogComponent = class SettingsDialogComponent {
 			id: "appearance",
 			labelKey: "settings.appearance.nav"
 		},
+		{
+			id: "alerts",
+			labelKey: "settings.alerts.nav"
+		},
 		{
 			id: "shortcuts",
 			labelKey: "settings.shortcuts.nav"
@@ -33253,6 +33687,9 @@ var SettingsDialogComponent = class SettingsDialogComponent {
                     @case ("appearance") {
                       <palette-icon aria-hidden="true" />
                     }
+                    @case ("alerts") {
+                      <bell-icon aria-hidden="true" />
+                    }
                     @case ("shortcuts") {
                       <keyboard-icon aria-hidden="true" />
                     }
@@ -33271,6 +33708,9 @@ var SettingsDialogComponent = class SettingsDialogComponent {
               @case ("appearance") {
                 <settings-appearance-panel />
               }
+              @case ("alerts") {
+                <settings-alerts-panel (closeRequested)="dialog.close()" />
+              }
               @case ("shortcuts") {
                 <settings-shortcuts-panel />
               }
@@ -33324,6 +33764,12 @@ var SettingsDialogComponent = class SettingsDialogComponent {
 				selector: "palette, palette-icon, Palette, PaletteIcon",
 				inputs: ["class"]
 			},
+			{
+				kind: "component",
+				type: BellIcon,
+				selector: "bell, bell-icon, Bell, BellIcon",
+				inputs: ["class"]
+			},
 			{
 				kind: "component",
 				type: KeyboardIcon,
@@ -33353,6 +33799,12 @@ var SettingsDialogComponent = class SettingsDialogComponent {
 				type: SettingsAppearancePanelComponent,
 				selector: "settings-appearance-panel"
 			},
+			{
+				kind: "component",
+				type: SettingsAlertsPanelComponent,
+				selector: "settings-alerts-panel",
+				outputs: ["closeRequested"]
+			},
 			{
 				kind: "component",
 				type: SettingsShortcutsPanelComponent,
@@ -33382,11 +33834,13 @@ i0.ɵɵngDeclareClassMetadata({
 				DialogContentComponent,
 				UserIcon,
 				PaletteIcon,
+				BellIcon,
 				KeyboardIcon,
 				XMarkIcon,
 				SidebarInsetDirective,
 				SettingsAccountPanelComponent,
 				SettingsAppearancePanelComponent,
+				SettingsAlertsPanelComponent,
 				SettingsShortcutsPanelComponent
 			],
 			providers: [provideTranslocoScope("settings")],
@@ -33423,6 +33877,9 @@ i0.ɵɵngDeclareClassMetadata({
                     @case ("appearance") {
                       <palette-icon aria-hidden="true" />
                     }
+                    @case ("alerts") {
+                      <bell-icon aria-hidden="true" />
+                    }
                     @case ("shortcuts") {
                       <keyboard-icon aria-hidden="true" />
                     }
@@ -33441,6 +33898,9 @@ i0.ɵɵngDeclareClassMetadata({
               @case ("appearance") {
                 <settings-appearance-panel />
               }
+              @case ("alerts") {
+                <settings-alerts-panel (closeRequested)="dialog.close()" />
+              }
               @case ("shortcuts") {
                 <settings-shortcuts-panel />
               }
@@ -33933,6 +34393,6 @@ function provideSessionExpiry(options = {}) {
 const queryNameResolver = () => {
 	return inject(AppStore).getDefaultQuery()?.name || "";
 };
-export { AGGREGATIONS_NAMES, AGGREGATIONS_NAMES_PRESET_DEFAULT, APP_FEATURES, ATOMIC_CLIENT, ATOMIC_SCOPED_PROVIDERS, AddToCollection, AdvancedFiltersBodyComponent, AdvancedFiltersComponent, AdvancedSearch, AdvancedSearchTabs, AggregationComponent, AggregationDateComponent, AggregationDateRange, AggregationItemDirective, AggregationListComponent, AggregationPanelComponent, AggregationTreeComponent, AggregationsService, AggregationsStore, Alert, AlertDialog, AlertForm, AlertsComponent, AppService, AppStore, ApplicationService, ApplicationStore, AppliedFiltersComponent, ArticleEntities, ArticleEntitiesTabPanel, ArticleExtracts, ArticleExtractsTabPanel, ArticleHighlights, ArticleLabels, ArticleLabelsTabPanel, ArticleMatchLocations, ArticleMatchLocationsTabPanel, ArticleSimilarDocuments, ArticleSimilarDocumentsTabPanel, AsideFiltersComponent, AuditFeedbackType, AuditService, AuthGuard, AuthPageComponent, AutocompleteService, BOOKMARKS_CONFIG, BOOKMARKS_OPTIONS, BackdropComponent, BackdropService, BookmarkButtonComponent, BookmarksComponent, COLLECTIONS_CONFIG, COLLECTIONS_OPTIONS, COMPONENTS_FOR_DOCUMENT_TYPE, ChangePasswordComponent, ChildMarkerDirective, CollectionsComponent, CollectionsDialog, ConverterSelectComponent, DeleteCollection, DeleteCollectionDialog, DidYouMeanComponent, DocumentLocatorComponent, EditLabels, ErrorComponent, Export, ExportDialog, ExportService, FILTERS_BREAKPOINT, FILTER_DATE_ALLOW_CUSTOM_RANGE, FORM_ALERT_CLASS, FORM_BARE_CLASS, FORM_ERROR_CLASS, FORM_FIELD_CLASS, FORM_FOOTER_CLASS, FORM_LABEL_CLASS, FORM_SURFACE_CLASS, FaIconComponent, FeatureFlags, FeatureFlagsDialogComponent, Feedback, FeedbackDialogComponent, FileSizePipe, FilterButtonComponent, FiltersBarComponent, FloatingToolbarComponent, ForgotPasswordComponent, HIGHLIGHTS, HeatmapComponent, HighlightWordPipe, InfinityScrollDirective, InlineWorker, JsonMethodPluginService, KeyboardShortcutsDialog, KeyboardShortcutsDialogComponent, KeyboardShortcutsListComponent, KeyboardShortcutsService, LabelService, LabelsEditDialog, ListPanelItemDirective, LoadingComponent, MarkdownPipe, MarkdownRendererService, MetadataComponent, MissingTermsComponent, MoreButtonComponent, MoreComponent, MultiSelectLabelsComponent, MultiSelectionToolbarComponent, NON_SEARCHABLE_COLUMNS, NON_SEARCHABLE_DEFAULTS, NavbarTabsComponent, NavigationService, NoResultComponent, OpenArticleOnCtrlEnterDirective, OperatorPipe, OverflowItemDirective, OverflowManagerDirective, OverflowStopDirective, OverrideUser, OverrideUserDialogComponent, PREVIEW_ASSISTANT_COMPONENT, PREVIEW_CONFIG, PagerComponent, PreviewActionsComponent, PreviewContentComponent, PreviewHeaderComponent, PreviewNavigator, PreviewService, PrincipalService, PrincipalStore, QueryParamsStore, QueryService, RECENT_SEARCHES_CONFIG, RECENT_SEARCHES_OPTIONS, ROUTE_COMPONENTS, RecentSearchesComponent, ResetUserSettings, ResetUserSettingsDialogComponent, SAVED_SEARCHES_CONFIG, SAVED_SEARCHES_OPTIONS, STARTUP_DATA_SOURCE, SavedSearch, SavedSearchDialog, SavedSearchPopover, SavedSearchesComponent, SavedSearchesService, SearchFeedbackComponent, SearchInputFooter, SearchService, SelectArticleDirective, SelectionService, SelectionStore, Settings, SettingsAccountPanelComponent, SettingsAppearancePanelComponent, SettingsDialogComponent, SettingsShortcutsPanelComponent, ShortcutDirective, ShowBookmarkDirective, SignInComponent, SignedOutComponent, SortSelectorComponent, SourceComponent, SourceIconPipe, SponsoredResultsComponent, SyslangPipe, THEMES, TagCloudComponent, TextChunkService, ThemeProviderDirective, ThemeSelectorComponent, ThemeStore, ThemeToggleComponent, TranslocoDateImpurePipe, UserOverrideService, UserProfileFormComponent, UserProfileService, UserSettingsPersistence, UserSettingsStore, WEIGHT_STEPS, WordCloudComponent, ZoomControlsComponent, __resetSignInMutexForTests, activateShortcutTarget, applyThemeToNativeElement, atomicClientProvider, auditInterceptorFn, authInterceptorFn, bodyInterceptorFn, bootstrapApp, buildHeatmap, buildQuery, buildTagCloud, candidatesFor, canonicalize, debouncedSignal, errorInterceptorFn, fieldErrorKey, fieldShowsError, filterKey, filterLeaves, filterValues, findAggregation, flagsFromWeekdays, focusWhenReady, galactikPrimitive, galactikSemantic, getCurrentPath, getCurrentQueryName, getQueryNameFromRoute, injectAdvancedFilters, injectAtomicClient, injectRouteNavigation, injectUserSettingsPatch, isAuthRoute, isSignInInFlight, itemLabel, layoutWordCloud, legacyFilterToFilter, makeWeightScale, multiSelectionToolbarVariants, paletteColor, processCssVars, provideAtomicClient, provideAtomicNotifications, provideAtomicScope, provideDocumentLang, provideKeyboardShortcuts, provideSessionExpiry, provideStartupAggregation, quantileScale, queryNameResolver, rebuildWithout, seriesPalette, signIn, themeColorNameToCssVariable, themeColorsToCssVariables, timelinePalette, toAriaKeyshortcuts, toDisplayParts, toPercentages, toSeries, toastInterceptorFn, weekdaysFromFlags, withAggregationsFeatures, withAlertsFeatures, withAlpha, withAppFeatures, withApplicationFeatures, withAssistantFeatures, withBasketsFeatures, withBookmarkFeatures, withBootstrapApp, withExtractsFeatures, withFetch, withMultiSelectionFeatures, withQueryParamsFeatures, withRecentSearchesFeatures, withSavedSearchesFeatures, withSelectionFeatures, withThemeBodyHook, withThemes, withThemesFeatures, withUserSettingsFeatures };
+export { AGGREGATIONS_NAMES, AGGREGATIONS_NAMES_PRESET_DEFAULT, APP_FEATURES, ATOMIC_CLIENT, ATOMIC_SCOPED_PROVIDERS, AddToCollection, AdvancedFiltersBodyComponent, AdvancedFiltersComponent, AdvancedSearch, AdvancedSearchTabs, AggregationComponent, AggregationDateComponent, AggregationDateRange, AggregationItemDirective, AggregationListComponent, AggregationPanelComponent, AggregationTreeComponent, AggregationsService, AggregationsStore, Alert, AlertDialog, AlertForm, AlertFormComponent, AlertsComponent, AppService, AppStore, ApplicationService, ApplicationStore, AppliedFiltersComponent, ArticleEntities, ArticleEntitiesTabPanel, ArticleExtracts, ArticleExtractsTabPanel, ArticleHighlights, ArticleLabels, ArticleLabelsTabPanel, ArticleMatchLocations, ArticleMatchLocationsTabPanel, ArticleSimilarDocuments, ArticleSimilarDocumentsTabPanel, AsideFiltersComponent, AuditFeedbackType, AuditService, AuthGuard, AuthPageComponent, AutocompleteService, BOOKMARKS_CONFIG, BOOKMARKS_OPTIONS, BackdropComponent, BackdropService, BookmarkButtonComponent, BookmarksComponent, COLLECTIONS_CONFIG, COLLECTIONS_OPTIONS, COMPONENTS_FOR_DOCUMENT_TYPE, ChangePasswordComponent, ChildMarkerDirective, CollectionsComponent, CollectionsDialog, ConverterSelectComponent, DeleteCollection, DeleteCollectionDialog, DidYouMeanComponent, DocumentLocatorComponent, EditLabels, ErrorComponent, Export, ExportDialog, ExportService, FILTERS_BREAKPOINT, FILTER_DATE_ALLOW_CUSTOM_RANGE, FORM_ALERT_CLASS, FORM_BARE_CLASS, FORM_ERROR_CLASS, FORM_FIELD_CLASS, FORM_FOOTER_CLASS, FORM_LABEL_CLASS, FORM_SURFACE_CLASS, FaIconComponent, FeatureFlags, FeatureFlagsDialogComponent, Feedback, FeedbackDialogComponent, FileSizePipe, FilterButtonComponent, FiltersBarComponent, FloatingToolbarComponent, ForgotPasswordComponent, HIGHLIGHTS, HeatmapComponent, HighlightWordPipe, InfinityScrollDirective, InlineWorker, JsonMethodPluginService, KeyboardShortcutsDialog, KeyboardShortcutsDialogComponent, KeyboardShortcutsListComponent, KeyboardShortcutsService, LabelService, LabelsEditDialog, ListPanelItemDirective, LoadingComponent, MarkdownPipe, MarkdownRendererService, MetadataComponent, MissingTermsComponent, MoreButtonComponent, MoreComponent, MultiSelectLabelsComponent, MultiSelectionToolbarComponent, NON_SEARCHABLE_COLUMNS, NON_SEARCHABLE_DEFAULTS, NavbarTabsComponent, NavigationService, NoResultComponent, OpenArticleOnCtrlEnterDirective, OperatorPipe, OverflowItemDirective, OverflowManagerDirective, OverflowStopDirective, OverrideUser, OverrideUserDialogComponent, PREVIEW_ASSISTANT_COMPONENT, PREVIEW_CONFIG, PagerComponent, PreviewActionsComponent, PreviewContentComponent, PreviewHeaderComponent, PreviewNavigator, PreviewService, PrincipalService, PrincipalStore, QueryParamsStore, QueryService, RECENT_SEARCHES_CONFIG, RECENT_SEARCHES_OPTIONS, ROUTE_COMPONENTS, RecentSearchesComponent, ResetUserSettings, ResetUserSettingsDialogComponent, SAVED_SEARCHES_CONFIG, SAVED_SEARCHES_OPTIONS, STARTUP_DATA_SOURCE, SavedSearch, SavedSearchDialog, SavedSearchPopover, SavedSearchesComponent, SavedSearchesService, SearchFeedbackComponent, SearchInputFooter, SearchService, SelectArticleDirective, SelectionService, SelectionStore, Settings, SettingsAccountPanelComponent, SettingsAlertsPanelComponent, SettingsAppearancePanelComponent, SettingsDialogComponent, SettingsShortcutsPanelComponent, ShortcutDirective, ShowBookmarkDirective, SignInComponent, SignedOutComponent, SortSelectorComponent, SourceComponent, SourceIconPipe, SponsoredResultsComponent, SyslangPipe, THEMES, TagCloudComponent, TextChunkService, ThemeProviderDirective, ThemeSelectorComponent, ThemeStore, ThemeToggleComponent, TranslocoDateImpurePipe, UserOverrideService, UserProfileFormComponent, UserProfileService, UserSettingsPersistence, UserSettingsStore, WEIGHT_STEPS, WordCloudComponent, ZoomControlsComponent, __resetSignInMutexForTests, activateShortcutTarget, applyThemeToNativeElement, atomicClientProvider, auditInterceptorFn, authInterceptorFn, bodyInterceptorFn, bootstrapApp, buildHeatmap, buildQuery, buildTagCloud, candidatesFor, canonicalize, debouncedSignal, errorInterceptorFn, fieldErrorKey, fieldShowsError, filterKey, filterLeaves, filterValues, findAggregation, flagsFromWeekdays, focusWhenReady, galactikPrimitive, galactikSemantic, getCurrentPath, getCurrentQueryName, getQueryNameFromRoute, injectAdvancedFilters, injectAtomicClient, injectRouteNavigation, injectUserSettingsPatch, isAuthRoute, isSignInInFlight, itemLabel, layoutWordCloud, legacyFilterToFilter, makeWeightScale, multiSelectionToolbarVariants, paletteColor, processCssVars, provideAtomicClient, provideAtomicNotifications, provideAtomicScope, provideDocumentLang, provideKeyboardShortcuts, provideSessionExpiry, provideStartupAggregation, quantileScale, queryNameResolver, rebuildWithout, seriesPalette, signIn, themeColorNameToCssVariable, themeColorsToCssVariables, timelinePalette, toAriaKeyshortcuts, toDisplayParts, toPercentages, toSeries, toastInterceptorFn, weekdaysFromFlags, withAggregationsFeatures, withAlertsFeatures, withAlpha, withAppFeatures, withApplicationFeatures, withAssistantFeatures, withBasketsFeatures, withBookmarkFeatures, withBootstrapApp, withExtractsFeatures, withFetch, withMultiSelectionFeatures, withQueryParamsFeatures, withRecentSearchesFeatures, withSavedSearchesFeatures, withSelectionFeatures, withThemeBodyHook, withThemes, withThemesFeatures, withUserSettingsFeatures };
 
 //# sourceMappingURL=sinequa-atomic-angular.mjs.map