@aurorajs.dev/catalyst-cli 1.1.3 → 2.0.0

package/dist/templates/codegen/partials/i18n-recompute.eta

@@ -39,18 +39,27 @@
     .map((prop) => `${i18nSource}.${it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name).i18nName} !== undefined`)
     .join(' && ');
 _%>
+<%_
+  // Set() already accepts an iterable directly (unicorn/no-useless-spread): the inner
+  // array-literal-with-spreads is only needed to UNION two or more iterables into one before
+  // handing it to Set. With exactly one i18n field there is nothing to union, so that single
+  // property's own iterable is passed straight through.
+  const buildTranslatedLocalesSetArg = () => {
+    const calls = i18nRecomputeProperties.map((prop) => {
+      const cols = it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name);
+      return 'this.i18nService.computeTranslatedLocales(' + i18nSource + '.' + cols.i18nName + ')';
+    });
+    if (calls.length === 1) return calls[0];
+    return '[' + calls.map((c) => '...' + c).join(', ') + ']';
+  };
+_%>
 <% if (it.i18nRecomputeGuarded) { -%>
     const i18nRecompute = {
 <% for (const prop of i18nRecomputeProperties) { -%>
 <%_ const i18nRecomputeColumns = it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name); _%>
       ...(<%~ i18nSource %>.<%= i18nRecomputeColumns.i18nName %> !== undefined ? { <%= i18nRecomputeColumns.searchTextName %>: this.i18nService.computeSearchText(<%~ i18nSource %>.<%= i18nRecomputeColumns.i18nName %>) } : {}),
 <% } -%>
-      ...(<%~ i18nRecomputePresenceGuard %> ? { <%= it.fmt.toCamelCase(it.i18nEmbedded.TRANSLATED_LOCALES_COLUMN) %>: [...new Set([
-<% for (const prop of i18nRecomputeProperties) { -%>
-<%_ const i18nRecomputeColumns = it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name); _%>
-        ...this.i18nService.computeTranslatedLocales(<%~ i18nSource %>.<%= i18nRecomputeColumns.i18nName %>),
-<% } -%>
-      ])] } : {}),
+      ...(<%~ i18nRecomputePresenceGuard %> ? { <%= it.fmt.toCamelCase(it.i18nEmbedded.TRANSLATED_LOCALES_COLUMN) %>: [...new Set(<%~ buildTranslatedLocalesSetArg() %>)] } : {}),
     };
 <% } else { -%>
     const i18nRecompute = {
@@ -58,11 +67,6 @@ _%>
 <%_ const i18nRecomputeColumns = it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name); _%>
       <%= i18nRecomputeColumns.searchTextName %>: this.i18nService.computeSearchText(<%~ i18nSource %>.<%= i18nRecomputeColumns.i18nName %>),
 <% } -%>
-      <%= it.fmt.toCamelCase(it.i18nEmbedded.TRANSLATED_LOCALES_COLUMN) %>: [...new Set([
-<% for (const prop of i18nRecomputeProperties) { -%>
-<%_ const i18nRecomputeColumns = it.i18nEmbedded.buildI18nEmbeddedColumns(prop.name); _%>
-        ...this.i18nService.computeTranslatedLocales(<%~ i18nSource %>.<%= i18nRecomputeColumns.i18nName %>),
-<% } -%>
-      ])],
+      <%= it.fmt.toCamelCase(it.i18nEmbedded.TRANSLATED_LOCALES_COLUMN) %>: [...new Set(<%~ buildTranslatedLocalesSetArg() %>)],
     };
 <% } -%>

package/dist/templates/codegen/partials/relationships/multiple-select.eta

@@ -12,6 +12,17 @@
   const relSingular = it.fmt.toCamelCase(it.mappers.getRelationshipSingularName(it.property));
   const optionsName = relSingular + 'Options';
   const isRequired = it.property.nullable === false && it.property.type !== 'boolean';
+  // The option label derives from the target's front.displayField, resolved
+  // through the same cross-schema helper the search-select family uses — a
+  // relationship-less property (a scalar array widget) falls back to the
+  // default. Rendered as a static Angular interpolation (no per-option
+  // lookup): the [itemToString] trigger summary below (a single lookup for
+  // the FIRST selected value, not one per option) is built from the SAME
+  // template, so both stay in sync.
+  const displayFieldTemplate = it.property.relationship?.modulePath
+    ? it.crossSchema.getTargetDisplayFieldTemplate(it.property.relationship.modulePath)
+    : '{name}';
+  const optionLabel = it.filters.templateToAngularInterpolation(displayFieldTemplate, 'option');
 _%>
 <hlm-field class="<%= it.colSpan %>">
   <%~ include('/partials/form/field-label', it) %>
@@ -32,7 +43,7 @@ _%>
     </hlm-select-trigger>
     <hlm-select-content *hlmSelectPortal>
       @for (option of <%= optionsName %>(); track option.id) {
-        <hlm-select-item [value]="option.id">{{ option.name }}</hlm-select-item>
+        <hlm-select-item [value]="option.id"><%= optionLabel %></hlm-select-item>
       }
     </hlm-select-content>
   </hlm-select-multiple>

package/dist/templates/codegen/partials/relationships/select.eta

@@ -5,6 +5,16 @@
   const relSingular = it.fmt.toCamelCase(it.mappers.getRelationshipSingularName(it.property));
   const optionsName = relSingular + 'Options';
   const isRequired = it.property.nullable === false && it.property.type !== 'boolean';
+  // The option label derives from the target's front.displayField, resolved
+  // through the same cross-schema helper the search-select family uses — a
+  // relationship-less property (a scalar array widget) falls back to the
+  // default. Rendered as a static Angular interpolation (no per-option
+  // lookup): the trigger's itemToString (declared in the form component)
+  // is built from the SAME template, so both stay in sync.
+  const displayFieldTemplate = it.property.relationship?.modulePath
+    ? it.crossSchema.getTargetDisplayFieldTemplate(it.property.relationship.modulePath)
+    : '{name}';
+  const optionLabel = it.filters.templateToAngularInterpolation(displayFieldTemplate, 'option');
 _%>
 <hlm-field class="<%= it.colSpan %>">
   <%~ include('/partials/form/field-label', it) %>
@@ -17,7 +27,7 @@ _%>
     </hlm-select-trigger>
     <hlm-select-content *hlmSelectPortal>
       @for (option of <%= optionsName %>(); track option.id) {
-        <hlm-select-item [value]="option.id">{{ option.name }}</hlm-select-item>
+        <hlm-select-item [value]="option.id"><%= optionLabel %></hlm-select-item>
       }
     </hlm-select-content>
   </hlm-select>

package/dist/templates/frontend/application/public/i18n/en.json

@@ -22,7 +22,8 @@
   "Edit": "Edit",
   "Errors": {
     "UniqueConstraint": "A record with {{field}}: '{{value}}' already exists.",
-    "MaskedPropertyNotQueryable": "The \"{{property}}\" field of {{aggregate}} cannot be used to filter, sort, or aggregate."
+    "MaskedPropertyNotQueryable": "The \"{{property}}\" field of {{aggregate}} cannot be used to filter, sort, or aggregate.",
+    "HubAppAccountsNotQueryable": "The \"{{path}}\" relation of {{aggregate}} cannot be used to filter, sort, or aggregate."
   },
   "DownloadCSV": "Download CSV",
   "DownloadExcel": "Download Excel",

package/dist/templates/frontend/application/public/i18n/es.json

@@ -22,7 +22,8 @@
   "Edit": "Editar",
   "Errors": {
     "UniqueConstraint": "Ya existe un registro con {{field}}: '{{value}}'.",
-    "MaskedPropertyNotQueryable": "El campo \"{{property}}\" de {{aggregate}} no puede usarse para filtrar, ordenar ni agregar."
+    "MaskedPropertyNotQueryable": "El campo \"{{property}}\" de {{aggregate}} no puede usarse para filtrar, ordenar ni agregar.",
+    "HubAppAccountsNotQueryable": "La relación \"{{path}}\" de {{aggregate}} no puede usarse para filtrar, ordenar ni agregar."
   },
   "DownloadCSV": "Descargar CSV",
   "DownloadExcel": "Descargar Excel",

package/dist/templates/frontend/application/src/@aurora/components/data-table/index.ts

@@ -15,6 +15,7 @@ export * from './lib/column-helpers';
 export * from './lib/custom-field-column';
 export * from './lib/get-relations-node';
 export * from './lib/merge-custom-field-columns';
+export * from './lib/relation-cell';
 export * from './lib/resolve-custom-field-filter';
 export * from './services/column-config-storage';
 export * from './services/in-memory-column-config-storage';

package/dist/templates/frontend/application/src/@aurora/components/data-table/lib/relation-cell.spec.ts

@@ -0,0 +1,33 @@
+import { relationCell } from './relation-cell';
+
+interface Row {
+  tenant: { id: string } | null | undefined;
+}
+
+/** Minimal CellContext mock — only `getValue` and `row.original` are read by `relationCell`. */
+const makeInfo = (value: string | undefined, original: Partial<Row>) => ({
+  getValue: () => value,
+  row: { original },
+});
+
+function cellFn(relation: keyof Row): (info: ReturnType<typeof makeInfo>) => string {
+  return relationCell<Row, keyof Row>(relation) as (info: ReturnType<typeof makeInfo>) => string;
+}
+
+describe('relationCell', () => {
+  it('renders the placeholder when the relation object is null', () => {
+    expect(cellFn('tenant')(makeInfo('irrelevant', { tenant: null }))).toBe('—');
+  });
+
+  it('renders the placeholder when the relation object is undefined', () => {
+    expect(cellFn('tenant')(makeInfo(undefined, {}))).toBe('—');
+  });
+
+  it('renders the real value when the relation resolved with a value', () => {
+    expect(cellFn('tenant')(makeInfo('Acme Corp', { tenant: { id: 't-1' } }))).toBe('Acme Corp');
+  });
+
+  it('renders empty (NOT the placeholder) when the relation resolved but the field is empty', () => {
+    expect(cellFn('tenant')(makeInfo('', { tenant: { id: 't-1' } }))).toBe('');
+  });
+});

package/dist/templates/frontend/application/src/@aurora/components/data-table/lib/relation-cell.ts

@@ -0,0 +1,13 @@
+import type { CellContext } from '@tanstack/angular-table';
+
+/**
+ * Cell renderer for a to-ONE relation column: '—' only when the relation object itself is missing
+ * (a dangling FK, or a relation the query never asked for); a resolved relation with a legitimately
+ * empty displayed field still renders empty. Shared across every module declaring a `relation:
+ * { association }` column (T-4.3) — first established ad hoc in supplier-document.columns.ts (T-17).
+ */
+export function relationCell<T, K extends keyof T>(
+  relation: K,
+): (info: CellContext<T, unknown>) => string {
+  return (info) => (info.row.original[relation] == null ? '—' : (info.getValue<string>() ?? ''));
+}

package/dist/templates/frontend/application/src/@aurora/components/date-picker/date-picker.component.ts

@@ -40,6 +40,10 @@ import { utcDatePrefix } from '../../lib/utc-date-prefix';
  * `formatUtcDate`, replacing Spartan's default `toDateString()` output
  * (`Tue Aug 04 2026`).
  *
+ * **Calendar texts.** The popup calendar takes its weekday names, month names
+ * and first day of the week from the app-wide `provideCalendarI18n` (see
+ * `app.config.ts`); this component configures none of it.
+ *
  * @example
  * <au-date-picker inputId="expiresAt" [formField]="form.expiresAt" />
  */

package/dist/templates/frontend/application/src/@aurora/components/datetime-picker/datetime-picker.component.spec.ts

@@ -271,4 +271,26 @@ describe('DateTimePicker', () => {
     fixture.detectChanges();
     expect(priv(component).timeInputDisabled()).toBe(false);
   });
+
+  // ─── hideTime ─────────────────────────────────────────────────────────────
+
+  it('renders the time input by default', () => {
+    expect(fixture.nativeElement.querySelector('input[type="time"]')).not.toBeNull();
+  });
+
+  it('hideTime removes the time input from the DOM', () => {
+    componentRef.setInput('hideTime', true);
+    fixture.detectChanges();
+    expect(fixture.nativeElement.querySelector('input[type="time"]')).toBeNull();
+  });
+
+  it('hideTime keeps the hidden time of the stored instant when the day changes', () => {
+    componentRef.setInput('hideTime', true);
+    componentRef.setInput('value', isoOfLocal(2026, 6, 13, 14, 30, 45));
+    fixture.detectChanges();
+
+    priv(component).onDateChange(localDay(2026, 6, 20));
+
+    expect(component.value()).toBe(isoOfLocal(2026, 6, 20, 14, 30, 45));
+  });
 });

package/dist/templates/frontend/application/src/@aurora/components/datetime-picker/datetime-picker.component.ts

@@ -21,6 +21,8 @@ function inRange(value: number, max: number): boolean {
  *   `ControlValueAccessor` wrapper.
  * - The time input stays disabled until a day is picked.
  * - Picking a day with no prior time uses local midnight.
+ * - `hideTime` removes the time input for fields where only the day matters;
+ *   the value is still a full instant.
  *
  * **The model is UTC, the editing surface is local.** A `dateTime` is an
  * INSTANT, so the user reads and edits it on their own clock while the wire
@@ -56,6 +58,10 @@ function inRange(value: number, max: number): boolean {
  * local frame via `formatLocalDate`, replacing Spartan's default
  * `toDateString()` output (`Tue Aug 04 2026`).
  *
+ * **Calendar texts.** The popup calendar takes its weekday names, month names
+ * and first day of the week from the app-wide `provideCalendarI18n` (see
+ * `app.config.ts`); this component configures none of it.
+ *
  * @example
  * <au-datetime-picker inputId="expiresAt" [formField]="form.expiresAt" />
  */
@@ -78,15 +84,17 @@ function inRange(value: number, max: number): boolean {
         />
       </hlm-date-picker>
 
-      <input
-        type="time"
-        [attr.aria-label]="inputId() ? inputId() + '-time' : 'time'"
-        [value]="timeString()"
-        [disabled]="timeInputDisabled()"
-        hlmInput
-        step="1"
-        (input)="onTimeChange($any($event.target).value)"
-      />
+      @if (!hideTime()) {
+        <input
+          type="time"
+          [attr.aria-label]="inputId() ? inputId() + '-time' : 'time'"
+          [value]="timeString()"
+          [disabled]="timeInputDisabled()"
+          hlmInput
+          step="1"
+          (input)="onTimeChange($any($event.target).value)"
+        />
+      }
     </div>
   `,
 })
@@ -97,6 +105,13 @@ export class DateTimePicker {
   readonly inputId = input<string>('');
   readonly disabled = input<boolean>(false);
 
+  /**
+   * Hides the time input; the model stays an instant. A fresh day is stored as
+   * local midnight, and a day change keeps the time the stored instant already
+   * carries (e.g. one stamped by the server), even though it is not shown.
+   */
+  readonly hideTime = input<boolean>(false);
+
   /** Aliased as a class member because a template cannot reference a module-scope function. */
   protected readonly formatDate = formatLocalDate;
 

package/dist/templates/frontend/application/src/@aurora/components/datetime-picker/datetime-picker.stories.ts

@@ -23,11 +23,17 @@ const meta: Meta<DateTimePicker> = {
       description:
         'When true, both the calendar trigger and the time input are disabled. The time input is also disabled independently until a date is picked.',
     },
+    hideTime: {
+      control: 'boolean',
+      description:
+        'When true, the time input is not rendered. The model is still a full UTC instant: a fresh day is stored as LOCAL midnight, and changing the day keeps the time the stored instant already carries, even though it is not shown.',
+    },
   },
   args: {
     value: null,
     inputId: 'expiresAt',
     disabled: false,
+    hideTime: false,
   },
   parameters: {
     aurora: {
@@ -104,6 +110,22 @@ export const Disabled: Story = {
   },
 };
 
+export const DayOnly: Story = {
+  name: 'Day only (hideTime) — instant field edited by day',
+  args: {
+    hideTime: true,
+    value: '2026-06-13T14:30:45Z',
+  },
+  parameters: {
+    docs: {
+      description: {
+        story:
+          'For a `type: dateTime` field where the user only cares about the day, e.g. a start moment the server stamps with the real time and an operator may correct by day. Only the calendar trigger renders. The stored time (14:30:45Z here) survives a day change. Do NOT reach for this to edit a `type: date` field: that is `<au-date-picker>`, which has no instant at all.',
+      },
+    },
+  },
+};
+
 export const NoDatePickedYet: Story = {
   name: 'No date picked — time input disabled',
   args: {

package/dist/templates/frontend/application/src/@aurora/lib/calendar-i18n.spec.ts

@@ -0,0 +1,138 @@
+import '@angular/compiler';
+import { signal } from '@angular/core';
+import { TestBed } from '@angular/core/testing';
+import { TranslocoService } from '@jsverse/transloco';
+import { injectBrnCalendarI18n } from '@spartan-ng/brain/calendar';
+import { provideNativeDateAdapter } from '@spartan-ng/brain/date-time';
+import { HlmCalendar } from '@spartan-ng/helm/calendar';
+import { BehaviorSubject } from 'rxjs';
+import { buildCalendarI18n, provideCalendarI18n } from './calendar-i18n';
+
+/** Minimal TranslocoService: only what `provideCalendarI18n` reads. */
+function translocoStub(initialLang: string) {
+  const langChanges$ = new BehaviorSubject<string>(initialLang);
+  return {
+    langChanges$,
+    getActiveLang: () => langChanges$.value,
+    switchTo: (lang: string) => langChanges$.next(lang),
+  };
+}
+
+describe('buildCalendarI18n', () => {
+  it('derives the weekday abbreviations from the active language, not from English', () => {
+    const i18n = buildCalendarI18n({ lang: signal('es'), weekStartsOn: 1 });
+
+    const abbreviations = [0, 1, 2, 3, 4, 5, 6].map((index) => i18n.formatWeekdayName(index));
+
+    expect(abbreviations).toEqual(['dom', 'lun', 'mar', 'mié', 'jue', 'vie', 'sáb']);
+  });
+
+  it('derives the long weekday, month and header texts from the active language', () => {
+    const i18n = buildCalendarI18n({ lang: signal('es'), weekStartsOn: 1 });
+
+    expect(i18n.labelWeekday(1)).toBe('lunes');
+    expect(i18n.months()[8]).toBe('septiembre');
+    expect(i18n.months()).toHaveLength(12);
+    expect(new Set(i18n.months()).size).toBe(12);
+    expect(i18n.formatMonth(8)).toBe('sept');
+    expect(i18n.formatHeader(8, 2026)).toBe('septiembre de 2026');
+    expect(i18n.formatYear(2026)).toBe('2026');
+  });
+
+  it('derives the previous and next month labels from the active language', () => {
+    const i18n = buildCalendarI18n({ lang: signal('es'), weekStartsOn: 1 });
+
+    expect(i18n.labelPrevious()).toBe('el mes pasado');
+    expect(i18n.labelNext()).toBe('el próximo mes');
+  });
+
+  it('follows a change of the active language without rebuilding the config', () => {
+    const lang = signal('es');
+    const i18n = buildCalendarI18n({ lang, weekStartsOn: 1 });
+    expect(i18n.formatWeekdayName(1)).toBe('lun');
+
+    lang.set('en');
+
+    expect(i18n.formatWeekdayName(1)).toBe('Mon');
+    expect(i18n.labelWeekday(1)).toBe('Monday');
+  });
+
+  it('takes the first day of the week from weekStartsOn, whatever the language', () => {
+    const lang = signal('en');
+
+    expect(buildCalendarI18n({ lang, weekStartsOn: 1 }).firstDayOfWeek()).toBe(1);
+    expect(buildCalendarI18n({ lang, weekStartsOn: 0 }).firstDayOfWeek()).toBe(0);
+    expect(buildCalendarI18n({ lang, weekStartsOn: 6 }).firstDayOfWeek()).toBe(6);
+  });
+});
+
+describe('provideCalendarI18n', () => {
+  function setup(weekStartsOn: 0 | 1 | 2 | 3 | 4 | 5 | 6, lang: string) {
+    const transloco = translocoStub(lang);
+    TestBed.configureTestingModule({
+      providers: [
+        { provide: TranslocoService, useValue: transloco },
+        provideCalendarI18n(weekStartsOn),
+        provideNativeDateAdapter(),
+      ],
+    });
+    return transloco;
+  }
+
+  function weekdayHeaders(): string[] {
+    const fixture = TestBed.createComponent(HlmCalendar);
+    fixture.detectChanges();
+    const headers = fixture.nativeElement.querySelectorAll('thead th') as NodeListOf<HTMLElement>;
+    return Array.from(headers).map((th) => th.textContent?.trim() ?? '');
+  }
+
+  it('renders the weekday header in the active language', () => {
+    setup(1, 'es');
+
+    expect(weekdayHeaders()).not.toContain('Mo');
+    expect(weekdayHeaders()).toEqual(['lun', 'mar', 'mié', 'jue', 'vie', 'sáb', 'dom']);
+  });
+
+  it('starts the week on the day declared by weekStartsOn', () => {
+    setup(1, 'es');
+    expect(weekdayHeaders()[0]).toBe('lun');
+
+    TestBed.resetTestingModule();
+    setup(0, 'es');
+    expect(weekdayHeaders()[0]).toBe('dom');
+
+    TestBed.resetTestingModule();
+    setup(3, 'es');
+    expect(weekdayHeaders()).toEqual(['mié', 'jue', 'vie', 'sáb', 'dom', 'lun', 'mar']);
+  });
+
+  it('does not let the language decide the first day of the week', () => {
+    setup(1, 'en');
+
+    expect(weekdayHeaders()[0]).toBe('Mon');
+  });
+
+  it('updates an already rendered calendar when the panel language changes', () => {
+    const transloco = setup(1, 'es');
+    const fixture = TestBed.createComponent(HlmCalendar);
+    fixture.detectChanges();
+    const first = () =>
+      (fixture.nativeElement.querySelector('thead th') as HTMLElement).textContent?.trim();
+    expect(first()).toBe('lun');
+
+    transloco.switchTo('en');
+    fixture.detectChanges();
+
+    expect(first()).toBe('Mon');
+  });
+
+  it('registers a single Spartan i18n service that every calendar injects', () => {
+    setup(1, 'es');
+
+    const first = TestBed.runInInjectionContext(() => injectBrnCalendarI18n());
+    const second = TestBed.runInInjectionContext(() => injectBrnCalendarI18n());
+
+    expect(first).toBe(second);
+    expect(first.config().firstDayOfWeek()).toBe(1);
+  });
+});

package/dist/templates/frontend/application/src/@aurora/lib/calendar-i18n.ts

@@ -0,0 +1,93 @@
+import {
+  DestroyRef,
+  type EnvironmentProviders,
+  inject,
+  makeEnvironmentProviders,
+  provideAppInitializer,
+  signal,
+  type Signal,
+} from '@angular/core';
+import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { TranslocoService } from '@jsverse/transloco';
+import {
+  type BrnCalendarI18n,
+  type MonthLabels,
+  provideBrnCalendarI18n,
+  type Weekday,
+} from '@spartan-ng/brain/calendar';
+
+/**
+ * Everything Spartan's calendar reads from its i18n service except `years`,
+ * which is a plain number range with no language in it.
+ */
+export type CalendarI18n = Omit<BrnCalendarI18n, 'years'>;
+
+export interface CalendarI18nOptions {
+  /**
+   * Active panel language. Read inside every text function, so a calendar that
+   * is already open re-renders when it changes. `undefined` lets `Intl` use the
+   * browser locale.
+   */
+  lang: Signal<string | undefined>;
+  /** First day of the week, 0 (Sunday) to 6 (Saturday). Declared per project, never derived from the language. */
+  weekStartsOn: Weekday;
+}
+
+/**
+ * Builds the texts of Spartan's calendar from `Intl`, in the active panel
+ * language. Weekday 0 is Sunday, month 0 is January — the same indices
+ * Spartan passes in.
+ *
+ * Dates are built and formatted in UTC so the machine time zone never moves a
+ * weekday or a month to its neighbour.
+ */
+export function buildCalendarI18n({ lang, weekStartsOn }: CalendarI18nOptions): CalendarI18n {
+  const formatUtc = (date: Date, options: Intl.DateTimeFormatOptions): string =>
+    new Intl.DateTimeFormat(lang(), { ...options, timeZone: 'UTC' }).format(date);
+  // 2024-01-07 is a Sunday.
+  const weekday = (index: number): Date => new Date(Date.UTC(2024, 0, 7 + index));
+  const month = (index: number, year = 2000): Date => new Date(Date.UTC(year, index, 1));
+  const relativeMonth = (offset: -1 | 1): string =>
+    new Intl.RelativeTimeFormat(lang(), { numeric: 'auto' }).format(offset, 'month');
+
+  return {
+    formatWeekdayName: (index) => formatUtc(weekday(index), { weekday: 'short' }),
+    labelWeekday: (index) => formatUtc(weekday(index), { weekday: 'long' }),
+    months: () =>
+      Array.from({ length: 12 }, (_, index) =>
+        formatUtc(month(index), { month: 'long' }),
+      ) as MonthLabels,
+    formatMonth: (index) => formatUtc(month(index), { month: 'short' }),
+    formatYear: (year) => formatUtc(month(0, year), { year: 'numeric' }),
+    formatHeader: (index, year) =>
+      formatUtc(month(index, year), { month: 'long', year: 'numeric' }),
+    labelPrevious: () => relativeMonth(-1),
+    labelNext: () => relativeMonth(1),
+    firstDayOfWeek: () => weekStartsOn,
+  };
+}
+
+/**
+ * The single Spartan calendar i18n registration of the application, register
+ * it once in `app.config.ts`. Every `hlm-calendar` — so `au-date-picker` and
+ * `au-datetime-picker` — injects it; no component configures the calendar.
+ *
+ * Follows the Transloco active language, which changes without a reload.
+ * `Intl` needs no translation file, so it does not wait for one to load —
+ * this is why `langChanges$` is safe here even though the `transloco-i18n`
+ * skill rules it out for texts that come from JSON.
+ */
+export function provideCalendarI18n(weekStartsOn: Weekday): EnvironmentProviders {
+  const lang = signal<string | undefined>(undefined);
+
+  return makeEnvironmentProviders([
+    provideBrnCalendarI18n(buildCalendarI18n({ lang, weekStartsOn })),
+    provideAppInitializer(() => {
+      const transloco = inject(TranslocoService);
+      lang.set(transloco.getActiveLang());
+      transloco.langChanges$
+        .pipe(takeUntilDestroyed(inject(DestroyRef)))
+        .subscribe((active) => lang.set(active));
+    }),
+  ]);
+}

package/dist/templates/frontend/application/src/@aurora/lib/expand-display-field-template.ts

@@ -0,0 +1,30 @@
+/**
+ * Expands a `front.displayField` template — a bare field identifier
+ * (`'name'`) or a `'{code} - {name}'` interpolation pattern — against a
+ * record, substituting each `{<field>}` placeholder with the record's value
+ * at that key. A bare identifier is treated equivalently to its
+ * curly-wrapped form. A `null`/`undefined` field value expands to an empty
+ * string; anything outside a placeholder (including a separator like `' - '`)
+ * is emitted verbatim.
+ *
+ * Single source of truth for the `{field}` interpolation shared by
+ * `ToOptionsPipe` (search-select family) and `itemLabelOf` (select /
+ * multiple-select family) — both widget families render the identical label
+ * for the identical `displayField`.
+ *
+ * @example
+ * ```ts
+ * expandDisplayFieldTemplate('name', { name: 'Foo' }); // 'Foo'
+ * expandDisplayFieldTemplate('{code} - {name}', { code: 'AB', name: 'Foo' }); // 'AB - Foo'
+ * ```
+ */
+export function expandDisplayFieldTemplate(
+  template: string,
+  item: Record<string, unknown>,
+): string {
+  const expr = /\{/.test(template) ? template : `{${template}}`;
+  return expr.replace(/\{(\w+)\}/g, (_, key: string) => {
+    const value = item[key];
+    return value == null ? '' : String(value);
+  });
+}

package/dist/templates/frontend/application/src/@aurora/lib/format-iso-date.ts

@@ -13,10 +13,11 @@ const DATE_ONLY = /^\d{4}-\d{2}-\d{2}$/;
  * The local-frame counterpart, for values that ARE instants, is
  * `formatIsoDateTime`.
  *
- * The server applies no timezone and no formatting to a date field, and a
- * `type: date` lives in a Postgres `timestamptz` column that Drizzle reads back
- * as raw text, so the value can arrive as `2026-08-01 00:00:00+00` rather than a
- * bare day. Both shapes render identically here.
+ * A `type: date` lives in a Postgres `date` column, and Drizzle's
+ * node-postgres driver already returns it as a raw `YYYY-MM-DD` string. A
+ * value that arrives instead as a timestamp with a time component or offset —
+ * from a third-party source or an integration outside this contract — still
+ * renders correctly here.
  *
  * A value the calendar rejects is echoed rather than rendered as the day
  * `new Date()` rolled it over to: `new Date('2026-02-30')` silently becomes

package/dist/templates/frontend/application/src/@aurora/lib/index.ts

@@ -1,4 +1,6 @@
+export * from './calendar-i18n';
 export * from './create-password';
+export * from './expand-display-field-template';
 export * from './format-iso-date';
 export * from './format-iso-datetime';
 export * from './format-local-date';
@@ -11,7 +13,6 @@ export * from './resolve-enum-label';
 export * from './resolve-i18n-value';
 export * from './resolve-storage-file-url';
 export * from './scroll-fade';
-export * from './to-wire-date';
 export * from './use-async-search-list';
 export * from './utc-date-prefix';
 // `useAggregateShell` se movió a `@aurora/composables/presets/use-aggregate-shell.ts`.