@gravionlabs/helix-ui 22.2.8 → 22.2.9

package/types/gravionlabs-helix-ui.d.ts

@@ -1864,6 +1864,39 @@ export declare class HxDataTable implements OnInit {
     "expandedRowKeys": "expandedRowKeysChange";
   }, ["cellTemplates", "columnHeaderTemplates", "headerTemplate", "bodyTemplate", "footerTemplate", "captionTemplate", "expansionTemplate", "emptyTemplate"], never, true, never>;
 }
+/** A relative range in the popup's preset list; `from` and `to` are read when it is chosen (`now` stays current). */
+interface HxDateTimeRangePreset {
+  label: string;
+  /** Called with the picker's settings, so a calendar range can follow its `firstDayOfWeek`. */
+  from: (context?: HxDateTimeRangePresetContext) => Date;
+  to: (context?: HxDateTimeRangePresetContext) => Date;
+}
+interface HxDateTimeRangePresetContext {
+  firstDayOfWeek: number;
+}
+/** The ends of a preset as a picker takes them: `null` for an empty end, `undefined` when the picker refuses one. */
+type HxPresetFit = (date: Date, side: 'from' | 'to') => Date | null | undefined;
+/**
+ * Reads a preset against the current time and fits each end with `fit` (the day only without a time, refused on a
+ * disabled day, ...); ends that come out reversed are ordered. `undefined` when `fit` refuses an end.
+ */
+declare function hxResolvePreset(preset: HxDateTimeRangePreset, context: HxDateTimeRangePresetContext, fit: HxPresetFit): {
+  from: Date | null;
+  to: Date | null;
+} | undefined;
+/** The ids of the built-in presets; `hxDateRangePresets` takes a label per id. */
+type HxDateRangePresetId = 'last15Minutes' | 'last1Hour' | 'last6Hours' | 'last24Hours' | 'last7Days' | 'last30Days' | 'today' | 'yesterday' | 'thisWeek' | 'thisMonth';
+/**
+ * The built-in presets with `labels` in place of the English ones (any id may be left out). `Today`, `Yesterday`,
+ * `This week`, `This month` and the day-based `Last 7 days` / `Last 30 days` (calendar days: they start at midnight
+ * of the first day, not 7 x 24 hours ago) start at midnight, so they also fit a picker without time pickers;
+ * `today` and `Last N days` end now, `yesterday` and the `this ...` ranges end at 23:59:59.999 of their last day.
+ */
+export declare function hxDateRangePresets(labels?: Partial<Record<HxDateRangePresetId, string>>): HxDateTimeRangePreset[];
+/** All built-in presets with English labels (a fresh list per call is `hxDateRangePresets()`). */
+export declare const HX_DATE_RANGE_PRESETS: readonly HxDateTimeRangePreset[];
+/** The day-based built-in presets (no time of day) for a picker without time pickers: Today, Last 7 days, This month. */
+export declare const HX_DATE_RANGE_DAY_PRESETS: readonly HxDateTimeRangePreset[];
 type CalendarView = 'day' | 'month' | 'year';
 interface DisabledRules {
   min?: Date | null;
@@ -1907,6 +1940,16 @@ type HxDatePickerValue = Date | Date[] | null;
  *
  * Keyboard in the day grid: arrows move by a day or a week, Home and End to the start and end of the week,
  * Page Up and Page Down by a month (with Shift by a year), Enter or Space selects.
+ *
+ * With `selectionMode="range"`, `presets` lists ready-made ranges above the calendar (as buttons, or with
+ * `presetDisplay="select"` in a select), for example `HX_DATE_RANGE_DAY_PRESETS` (Today, Last 7 days, This month).
+ * Choosing one sets the value at once to the days of its ends (midnight, in order; moved into `minDate`..`maxDate`)
+ * and closes the popup. A preset with an end on a disabled day, or one that lies wholly outside
+ * `minDate`..`maxDate`, is refused with an inline message (`presetRefusedLabel`, `role="alert"`).
+ *
+ * ```html
+ * <hx-date-picker selectionMode="range" [presets]="dayPresets" presetDisplay="select" [(ngModel)]="stay" />
+ * ```
  */
 export declare class HxDatePicker implements ControlValueAccessor, FormValueControl<HxDatePickerValue> {
   #private;
@@ -1939,6 +1982,14 @@ export declare class HxDatePicker implements ControlValueAccessor, FormValueCont
   readonly locale: import("@angular/core").InputSignal<string | undefined>;
   readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
   readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
+  /** Ready-made ranges above the calendar, only with `selectionMode="range"`; choosing one sets the value. */
+  readonly presets: import("@angular/core").InputSignal<readonly HxDateTimeRangePreset[]>;
+  /** The presets as a row of `buttons` (default) or in a compact `select`. */
+  readonly presetDisplay: import("@angular/core").InputSignal<"select" | "buttons">;
+  /** The name of the group of preset buttons, and of the preset select. */
+  readonly presetsLabel: import("@angular/core").InputSignal<string>;
+  /** The message shown when a preset cannot be chosen (a disabled day, outside `minDate`..`maxDate`). */
+  readonly presetRefusedLabel: import("@angular/core").InputSignal<string>;
   readonly value: import("@angular/core").ModelSignal<HxDatePickerValue>;
   readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
   readonly invalid: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
@@ -1949,6 +2000,16 @@ export declare class HxDatePicker implements ControlValueAccessor, FormValueCont
   protected readonly positions: ConnectedPosition[];
   private readonly field;
   private readonly calendar;
+  /** The presets shown: range mode only. */
+  protected readonly shownPresets: import("@angular/core").Signal<readonly HxDateTimeRangePreset[]>;
+  /**
+   * The preset the select shows: the chosen one while the value still holds its days, looked up by label in the
+   * current list (a new `presets` array with the same entries keeps it).
+   */
+  protected readonly selectedPreset: import("@angular/core").Signal<HxDateTimeRangePreset | null>;
+  /** A preset was refused: the message under the presets, until the next choice or edit. */
+  protected readonly presetError: import("@angular/core").WritableSignal<boolean>;
+  protected readonly presetErrorId: string;
   protected readonly view: import("@angular/core").WritableSignal<CalendarView>;
   protected readonly isDisabled: import("@angular/core").Signal<boolean>;
   /** The day with the focus in the grid, and the month the grid shows. */
@@ -1966,6 +2027,12 @@ export declare class HxDatePicker implements ControlValueAccessor, FormValueCont
   protected isDateDisabled(date: Date): boolean;
   protected isSelected(date: Date): boolean;
   protected pick(date: Date): void;
+  /**
+   * Sets the value to the days of a preset (midnight, in order, inside `minDate`..`maxDate`) and closes the popup.
+   * A preset with an end on a disabled day, or wholly outside `minDate`..`maxDate` (both ends before `minDate` or
+   * both after `maxDate`), changes nothing and shows the inline message; one that overlaps the limits is cut to them.
+   */
+  protected applyPreset(preset: HxDateTimeRangePreset): void;
   protected show(): void;
   protected toggle(): void;
   protected close(refocus?: boolean): void;
@@ -2067,6 +2134,26 @@ export declare class HxDatePicker implements ControlValueAccessor, FormValueCont
       "required": false;
       "isSignal": true;
     };
+    "presets": {
+      "alias": "presets";
+      "required": false;
+      "isSignal": true;
+    };
+    "presetDisplay": {
+      "alias": "presetDisplay";
+      "required": false;
+      "isSignal": true;
+    };
+    "presetsLabel": {
+      "alias": "presetsLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "presetRefusedLabel": {
+      "alias": "presetRefusedLabel";
+      "required": false;
+      "isSignal": true;
+    };
     "value": {
       "alias": "value";
       "required": false;
@@ -2087,6 +2174,463 @@ export declare class HxDatePicker implements ControlValueAccessor, FormValueCont
     "touch": "touch";
   }, never, never, true, never>;
 }
+/** A date math unit: second, minute, hour, day, week, Month (capital M, as in Kibana), year. */
+type HxDateMathUnit = 's' | 'm' | 'h' | 'd' | 'w' | 'M' | 'y';
+/** Options for {@link hxParseDateMath}. */
+interface HxDateMathOptions {
+  /** The instant `now` resolves to. Defaults to the current time. */
+  now?: Date;
+  /** The weekday a week starts on for `/w` (0 = Sunday, the default; 1 = Monday). */
+  firstDayOfWeek?: number;
+  /** Round `/unit` up to the last millisecond of the unit instead of down to its start (use for a range's end). */
+  roundUp?: boolean;
+}
+/**
+ * Resolves a Kibana-style date math expression to a Date, or returns `null` when it is invalid (never throws).
+ *
+ * The expression is `now` followed by any number of adjustments: `+N<unit>` / `-N<unit>` shift by N units and
+ * `/<unit>` rounds down to the start of the unit (or up to its last millisecond with `roundUp`). Units are
+ * `s m h d w M y`, case-sensitive (`m` is minutes, `M` is months). Examples: `now`, `now-15m`, `now+2d`, `now/d`,
+ * `now/w`, `now-1d/d`. Surrounding whitespace is ignored; the anchor must be `now`, amounts are non-negative
+ * integers. Day, week, month and year shifts are calendar based (DST-safe); a month shift that overshoots clamps to
+ * the last day of the target month (31 Mar - 1M = 28/29 Feb). `/w` honors `firstDayOfWeek`.
+ */
+export declare function hxParseDateMath(expression: string, options?: HxDateMathOptions): Date | null;
+/**
+ * The from/to expressions of a "Last N" or "Next N" range: `{ from: 'now-15m', to: 'now' }` for
+ * `('last', 15, 'm')`, `{ from: 'now', to: 'now+2d' }` for `('next', 2, 'd')`. The amount must be a positive
+ * safe integer, otherwise `null` is returned.
+ */
+export declare function hxRelativeRangeExpressions(direction: 'last' | 'next', amount: number, unit: HxDateMathUnit): {
+  from: string;
+  to: string;
+} | null;
+/** A range as two expressions: date math (`now-15m`, `now/d`) or an ISO date-time for an absolute side. */
+interface HxDateRangeExpression {
+  from: string;
+  to: string;
+}
+/** An entry of the quick select's "Commonly used" list. */
+interface HxQuickSelectRange extends HxDateRangeExpression {
+  label: string;
+}
+/** The texts of the quick select; `{n}` and `{unit}` are replaced where a text names them. */
+interface HxQuickSelectLabels {
+  quickSelect: string;
+  last: string;
+  next: string;
+  amount: string;
+  unit: string;
+  direction: string;
+  apply: string;
+  commonlyUsed: string;
+  recentlyUsed: string;
+  start: string;
+  end: string;
+  absolute: string;
+  relative: string;
+  now: string;
+  /** The text of the Now tab. */
+  nowHint: string;
+  /**
+   * Shown when a range cannot be applied (a relative side next to an empty absolute side, a Relative tab with an
+   * empty or invalid amount, a refused day, a typed date that cannot be read).
+   */
+  incompleteRange: string;
+  /** The label of the typed date on the Absolute tab. */
+  date: string;
+  /** `Round to the {unit}` (with the singular unit name). */
+  roundTo: string;
+  /** `Last {n} {unit}` / `Next {n} {unit}` in the Recently used list. */
+  lastRange: string;
+  nextRange: string;
+  /** The name of the start/end summary lines (`hx-date-range-quick-select`). */
+  range: string;
+  /** The summary of a side: `now`, `~ {n} {unit} ago`, `~ {n} {unit} from now`, with `rounded to the {unit}`. */
+  nowSummary: string;
+  agoSummary: string;
+  fromNowSummary: string;
+  roundedSummary: string;
+  /** The summary of an empty side. */
+  emptySide: string;
+  /** `Resolves to {date}`: the date a relative or now side stands for at this moment (the side editor). */
+  resolvesTo: string;
+  /** The plural unit names (`minutes`) and the singular ones (`minute`, for `{n}` = 1 and `roundTo`). */
+  units: Record<HxDateMathUnit, string>;
+  unitsOne: Record<HxDateMathUnit, string>;
+  /** The unit options of the Relative tab: `Minutes ago`, `Minutes from now`. */
+  unitsAgo: Record<HxDateMathUnit, string>;
+  unitsFromNow: Record<HxDateMathUnit, string>;
+}
+declare const QUICK_SELECT_UNITS: readonly HxDateMathUnit[];
+/** The English texts of the quick select (the default of `quickSelectLabels`). */
+export declare const HX_QUICK_SELECT_LABELS: HxQuickSelectLabels;
+/** The default "Commonly used" list (as in Kibana). */
+export declare const HX_QUICK_SELECT_COMMONLY_USED: readonly HxQuickSelectRange[];
+/** How many ranges the "Recently used" list keeps. */
+declare const RECENT_MAX = 5;
+/** The state of one side (start or end) in the quick select: its tab and the fields of the Relative tab. */
+interface QuickSelectSide {
+  mode: 'absolute' | 'relative' | 'now';
+  /** The amount of the Relative tab; `null` while its field is empty. */
+  amount: number | null;
+  unit: HxDateMathUnit;
+  /** `ago` subtracts the amount (`now-15m`), `fromNow` adds it (`now+15m`). */
+  direction: 'ago' | 'fromNow';
+  /** Rounds to the unit (`now-15m/m`). */
+  round: boolean;
+  /** An expression from outside that the fields cannot show (`now-1d/d+2h`); used as is until a field changes. */
+  raw: string | null;
+}
+declare const DEFAULT_SIDE: QuickSelectSide;
+/** A side of the range: `from` (Start) or `to` (End). */
+type Side = 'from' | 'to';
+type SideMode = QuickSelectSide['mode'];
+/** The tabs of a side, in their order. */
+declare const SIDE_MODES: readonly SideMode[];
+declare const ABSOLUTE_SIDES: Readonly<Record<Side, QuickSelectSide>>;
+/**
+ * The side state for an expression: `now` is the Now tab, `now-15m`, `now+2d/d` or `now/w` the Relative tab,
+ * another valid date math expression the Relative tab with `raw`; anything else (an ISO date) is absolute.
+ */
+declare function sideFromExpression(expression: string): QuickSelectSide;
+/**
+ * The date math expression of a relative or now side (`now-15m`, `now+2d/d`); `null` for an absolute side and for
+ * a relative side whose amount is empty, not a number or negative (it is not taken as `now`).
+ */
+declare function sideExpression(side: QuickSelectSide): string | null;
+/**
+ * Resolves one side: date math against `now` (rounding up for the end), else an ISO date-time; a date-only ISO
+ * text (`2026-10-14`) is local midnight, as `new Date(2026, 9, 14)`, not UTC. `null` when unreadable.
+ */
+export declare function hxResolveRangeSide(expression: string, options?: {
+  now?: Date;
+  firstDayOfWeek?: number;
+  roundUp?: boolean;
+}): Date | null;
+/**
+ * Resolves a range expression (as the picker's `expression` model holds it) against the current time: `from`
+ * rounds down, `to` rounds up (`now/d` to `now/d` is today from 00:00 to 23:59:59.999).
+ */
+export declare function hxResolveRangeExpression(range: HxDateRangeExpression, options?: {
+  now?: Date;
+  firstDayOfWeek?: number;
+}): {
+  from: Date | null;
+  to: Date | null;
+};
+/**
+ * The one-line summary of a relative or now side (`~ 15 minutes ago`, `now`, `~ 2 days from now, rounded to the
+ * day`); a raw expression as is, `emptySide` for an amount that gives no expression. `null` for an absolute side.
+ */
+declare function describeSide(side: QuickSelectSide, labels: HxQuickSelectLabels): string | null;
+/**
+ * A label for a range: the label of a commonly used range with the same expressions, `Last 15 minutes` /
+ * `Next 2 days`, else both sides (`now-1d/d - now`, absolute sides through `formatDate`).
+ */
+declare function describeRange(range: HxDateRangeExpression, labels: HxQuickSelectLabels, common: readonly HxQuickSelectRange[], formatDate: (date: Date) => string, separator?: string): string;
+/**
+ * The recently used ranges stored under `key`: empty when nothing (valid) is stored, `null` when there is no key
+ * or the storage cannot be read (blocked), so the caller can keep its in-memory list.
+ */
+declare function readRecentRanges(key: string | null): HxDateRangeExpression[] | null;
+/** Stores the recently used ranges; does nothing when storage is blocked or full. */
+declare function writeRecentRanges(key: string | null, ranges: readonly HxDateRangeExpression[]): void;
+/** Puts `range` first, drops an equal older entry and keeps at most `max` entries. */
+declare function addRecentRange(ranges: readonly HxDateRangeExpression[], range: HxDateRangeExpression, max?: number): HxDateRangeExpression[];
+/** The value of `hx-date-range-quick-select`: the resolved start and end (`null` while a side is empty). */
+interface HxDateRangeQuickSelectValue {
+  from: Date | null;
+  to: Date | null;
+}
+/**
+ * A Kibana-style quick select for a date range: one read-only field with a button that opens a compact popup with
+ * *Quick select* (Last/Next N unit, Apply), *Commonly used*, *Recently used* (the last five applied ranges, kept in
+ * `localStorage` under `recentStorageKey`) and one summary line each for the start and the end.
+ *
+ * ```html
+ * <hx-date-range-quick-select [(ngModel)]="range" [(expression)]="expression" />
+ * ```
+ *
+ * A click on the start or the end opens the editor of that side alone: the tabs *Absolute* (a typed date and the
+ * calendar), *Relative* (amount, unit, round to the unit, the resolved date) and *Now*. Escape closes the innermost
+ * open layer: the side editor first, then the popup.
+ *
+ * Apply and a click on a commonly or recently used range commit the range at once and close the popup; an edit in
+ * the side editor commits that side at once and keeps the popup open (the range is added to *Recently used* when
+ * the popup closes). An edit that puts the start after the end swaps the ends (the editor follows the edited side),
+ * as Apply and the lists do. An edit that cannot be applied (an empty amount, an unreadable date) keeps the last
+ * applied range and shows the inline message until the side changes or its editor closes. Date math
+ * (`now-15m`, `now/d`) is resolved against the current time when the range is applied; the value is
+ * `{ from, to }` (moved into `minDate`..`maxDate`) and the expressions are in the `expression` model (`null` for an
+ * absolute range). A range that cannot be applied (an amount out of range, an unreadable side) keeps the popup open
+ * with an inline message. It works with `ngModel`, reactive forms and signal forms (`[formField]`). To restore a
+ * persisted `expression`, bind the value resolved from it (`hxResolveRangeExpression`) with it: a value written from
+ * outside keeps the expression only when it has the same times (see `expression`).
+ */
+export declare class HxDateRangeQuickSelect implements ControlValueAccessor, FormValueControl<HxDateRangeQuickSelectValue> {
+  #private;
+  /** The texts of the quick select; any text left out stays English. */
+  readonly labels: import("@angular/core").InputSignal<Partial<HxQuickSelectLabels>>;
+  /** The "Commonly used" ranges. */
+  readonly commonlyUsed: import("@angular/core").InputSignal<readonly HxQuickSelectRange[]>;
+  /** The `localStorage` key of the "Recently used" list; `null` keeps the list only while the control lives. */
+  readonly recentStorageKey: import("@angular/core").InputSignal<string | null>;
+  /**
+   * The applied range as expressions (`{ from: 'now-15m', to: 'now' }`, an absolute side as an ISO date-time);
+   * `null` for an absolute range, and when `value` is set from outside (`writeValue`, a form's `setValue`/`reset`, a
+   * new `[value]`) to a different range without a new expression with it. A value written with the same times as the
+   * last one, or with the times the expression resolves to now (within a second, as `hxResolveRangeExpression` gives
+   * them), keeps the expression: a persisted expression with `[(ngModel)]` survives ngModel's later `writeValue` when
+   * the model holds the range resolved from it. Setting it from outside does not change `value` (resolve it yourself
+   * with `hxResolveRangeExpression`); it changes the field's text and the summary. When the resolved ends come out
+   * reversed (`now+1d` to `now`), the value is ordered and the expression is swapped with it.
+   */
+  readonly expression: import("@angular/core").ModelSignal<HxDateRangeExpression | null>;
+  readonly minDate: import("@angular/core").InputSignal<Date | null>;
+  readonly maxDate: import("@angular/core").InputSignal<Date | null>;
+  readonly firstDayOfWeek: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly locale: import("@angular/core").InputSignal<string | undefined>;
+  /** The format of absolute dates in the field, the summary and the Recently used list. */
+  readonly dateFormat: import("@angular/core").InputSignal<Intl.DateTimeFormatOptions | undefined>;
+  /** The text between the two dates. */
+  readonly separator: import("@angular/core").InputSignal<string>;
+  readonly placeholder: import("@angular/core").InputSignal<string>;
+  readonly chooseLabel: import("@angular/core").InputSignal<string>;
+  /** The `id` of the text field, for a `<label for>`. */
+  readonly inputId: import("@angular/core").InputSignal<string | undefined>;
+  readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
+  readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
+  readonly value: import("@angular/core").ModelSignal<HxDateRangeQuickSelectValue>;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly invalid: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly touch: import("@angular/core").OutputEmitterRef<void>;
+  readonly open: import("@angular/core").WritableSignal<boolean>;
+  protected readonly popupId: string;
+  protected readonly positions: ConnectedPosition[];
+  /** Last/Next N unit. */
+  protected readonly quickDirection: import("@angular/core").WritableSignal<"next" | "last">;
+  /** The amount as typed: an emptied field stays empty (it does not turn into `0`). */
+  protected readonly quickAmount: import("@angular/core").WritableSignal<string>;
+  protected readonly quickUnit: import("@angular/core").WritableSignal<HxDateMathUnit>;
+  protected readonly recent: import("@angular/core").WritableSignal<HxDateRangeExpression[]>;
+  /** A range could not be applied; shown under the lists and named by the Apply button. */
+  protected readonly quickError: import("@angular/core").WritableSignal<boolean>;
+  protected readonly quickErrorId: string;
+  /** The two sides of the summary, Start then End. */
+  protected readonly sideKeys: readonly Side[];
+  protected readonly sideModes: readonly ("now" | "absolute" | "relative")[];
+  /** The side whose editor (tabs Absolute / Relative / Now) is open under the summary; one at a time. */
+  protected readonly openSide: import("@angular/core").WritableSignal<Side | null>;
+  /** The tab and the Relative fields of each side as edited; may hold an edit that was refused. */
+  protected readonly sides: import("@angular/core").WritableSignal<Record<Side, QuickSelectSide>>;
+  /** An edit in the side editor was refused; the same message as `quickError`, named by the edited side. */
+  protected readonly sideError: import("@angular/core").WritableSignal<boolean>;
+  /** The calendar of the Absolute tab: the focused day, the view and today. */
+  protected readonly calendarFocus: import("@angular/core").WritableSignal<Date>;
+  protected readonly calendarView: import("@angular/core").WritableSignal<CalendarView>;
+  protected readonly today: import("@angular/core").WritableSignal<Date>;
+  protected readonly calendarTitleId: string;
+  protected readonly texts: import("@angular/core").Signal<HxQuickSelectLabels>;
+  protected readonly directionOptions: import("@angular/core").Signal<{
+    label: string;
+    value: string;
+  }[]>;
+  protected readonly unitOptions: import("@angular/core").Signal<{
+    label: string;
+    value: HxDateMathUnit;
+  }[]>;
+  /** The unit and direction of a relative side in one select (`Minutes ago`, `Minutes from now`). */
+  protected readonly relativeOptions: import("@angular/core").Signal<{
+    label: string;
+    value: string;
+  }[]>;
+  protected readonly recentItems: import("@angular/core").Signal<{
+    range: HxDateRangeExpression;
+    label: string;
+  }[]>;
+  protected readonly isDisabled: import("@angular/core").Signal<boolean>;
+  /** The field: the label of the expression (`Last 15 minutes`), else the two dates. */
+  protected readonly text: import("@angular/core").Signal<string>;
+  private readonly field;
+  private readonly quickFirst;
+  /** The summary buttons and the tabs live in the overlay, outside the host: found through the view, not the document. */
+  private readonly sideButtons;
+  private readonly sideTabs;
+  constructor();
+  writeValue(value: HxDateRangeQuickSelectValue | null): void;
+  registerOnChange(fn: (value: HxDateRangeQuickSelectValue) => void): void;
+  registerOnTouched(fn: () => void): void;
+  setDisabledState(disabled: boolean): void;
+  /** Focuses the field (signal forms call this to focus the control). */
+  focus(): void;
+  /** Opening the popup: the recently used list from storage, no message, no side editor, no refused edit. */
+  protected show(): void;
+  protected toggle(): void;
+  /**
+   * Closes the popup, also when the overlay detaches itself (`detach`): a refused edit goes back, the side editor
+   * closes and the range of the side editor is added to Recently used.
+   */
+  protected close(refocus?: boolean): void;
+  protected onAttach(): void;
+  /** The read-only field opens with Enter, Space, Arrow Down or Alt+Arrow Up. */
+  protected onFieldKeydown(event: KeyboardEvent): void;
+  /** Escape closes the innermost open layer: the side editor first, then the popup. */
+  protected onOverlayKeydown(event: KeyboardEvent): void;
+  protected onOutsideClick(event: MouseEvent): void;
+  protected setQuickDirection(direction: unknown): void;
+  protected setQuickAmount(event: Event): void;
+  protected setQuickUnit(unit: unknown): void;
+  /**
+   * Applies *Last/Next N unit* at once; an amount that is not a positive safe integer, or one whose date is out of
+   * the range of `Date`, shows the inline message instead.
+   */
+  protected applyQuick(): void;
+  /** A commonly or recently used range is applied at once; a refused one shows the inline message. */
+  protected applyRange(range: HxDateRangeExpression): void;
+  /**
+   * The summary line of a side as applied: a relative or now side (`~ 15 minutes ago`, `now`), else the date of the
+   * value, else `Not set`.
+   */
+  protected sideSummary(side: Side): string;
+  protected sideButtonId(side: Side): string;
+  protected editorId(side: Side): string;
+  protected tabId(side: Side, mode: SideMode): string;
+  protected panelId(side: Side): string;
+  /** A click on the start or the end opens the editor of that side and focuses its tab; a second click closes it. */
+  protected toggleSide(side: Side): void;
+  /** Closes the side editor (a refused edit goes back to the applied side) and focuses its summary button. */
+  protected closeSide(): void;
+  /** A tab chosen: the side becomes absolute (its current date), relative or now, and is applied at once. */
+  protected setSideMode(side: Side, mode: SideMode): void;
+  /** Arrow Left/Right move between the tabs of a side (wrapping), Home and End go to the first and last. */
+  protected onTabKeydown(side: Side, event: KeyboardEvent): void;
+  /** The amount of a Relative tab; an emptied field is `null` (refused, and shown empty), not `0` (`now`). */
+  protected setSideAmount(side: Side, event: Event): void;
+  protected setSideUnit(side: Side, value: unknown): void;
+  protected setSideRound(side: Side, event: Event): void;
+  protected sideUnitValue(side: Side): string;
+  protected sideRoundLabel(side: Side): string;
+  protected sideExpressionText(side: Side): string;
+  /** `Resolves to <date>`: a relative or now side as it would be applied at this moment (inside the limits). */
+  protected sideResolvedText(side: Side): string;
+  /** The date of an absolute side in its text field. */
+  protected sideText(side: Side): string;
+  /** The days of the calendar that are selected: the date of the side. */
+  protected sideDays(side: Side): Date[];
+  /**
+   * The date typed on an Absolute tab (a date with a time, or a date at midnight; empty clears the side); an
+   * unreadable date or one outside `minDate`..`maxDate` is refused with the inline message. Enter and the `change`
+   * that follows it commit once: a text that shows the applied date is no edit.
+   */
+  protected setAbsoluteSide(side: Side, event: Event): void;
+  /**
+   * A day picked in the calendar of an Absolute tab keeps the side's time (an empty start takes 00:00, an empty end
+   * 23:59:59.999), inside `minDate`..`maxDate`; a disabled day is ignored.
+   */
+  protected pickDay(side: Side, day: Date): void;
+  /** The focus left the control (field, button and popup): the popup closes and the control is touched. */
+  protected onHostFocusOut(event: FocusEvent): void;
+  protected onPopupFocusOut(event: FocusEvent): void;
+  protected markTouched(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HxDateRangeQuickSelect, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HxDateRangeQuickSelect, "hx-date-range-quick-select", never, {
+    "labels": {
+      "alias": "labels";
+      "required": false;
+      "isSignal": true;
+    };
+    "commonlyUsed": {
+      "alias": "commonlyUsed";
+      "required": false;
+      "isSignal": true;
+    };
+    "recentStorageKey": {
+      "alias": "recentStorageKey";
+      "required": false;
+      "isSignal": true;
+    };
+    "expression": {
+      "alias": "expression";
+      "required": false;
+      "isSignal": true;
+    };
+    "minDate": {
+      "alias": "minDate";
+      "required": false;
+      "isSignal": true;
+    };
+    "maxDate": {
+      "alias": "maxDate";
+      "required": false;
+      "isSignal": true;
+    };
+    "firstDayOfWeek": {
+      "alias": "firstDayOfWeek";
+      "required": false;
+      "isSignal": true;
+    };
+    "locale": {
+      "alias": "locale";
+      "required": false;
+      "isSignal": true;
+    };
+    "dateFormat": {
+      "alias": "dateFormat";
+      "required": false;
+      "isSignal": true;
+    };
+    "separator": {
+      "alias": "separator";
+      "required": false;
+      "isSignal": true;
+    };
+    "placeholder": {
+      "alias": "placeholder";
+      "required": false;
+      "isSignal": true;
+    };
+    "chooseLabel": {
+      "alias": "chooseLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "inputId": {
+      "alias": "inputId";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabel": {
+      "alias": "ariaLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "ariaLabelledby": {
+      "alias": "ariaLabelledby";
+      "required": false;
+      "isSignal": true;
+    };
+    "value": {
+      "alias": "value";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+    "invalid": {
+      "alias": "invalid";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "expression": "expressionChange";
+    "value": "valueChange";
+    "touch": "touch";
+  }, never, never, true, never>;
+}
 type TimeUnit = 'hour' | 'minute' | 'second' | 'period';
 interface TimeColumn {
   unit: TimeUnit;
@@ -2650,12 +3194,6 @@ interface HxDateTimeRangeValue {
   from: Date | null;
   to: Date | null;
 }
-/** A relative range in the popup's preset list; `from` and `to` are read when it is chosen (`now` stays current). */
-interface HxDateTimeRangePreset {
-  label: string;
-  from: () => Date;
-  to: () => Date;
-}
 /**
  * A from and a to date-time range in one field with one button. The field shows the range as one text
  * (`1/1/2026 00:00 - 1/2/2026 00:15`); the popup holds one calendar (an inline range `hx-date-picker`) and a time picker for each end,
@@ -2686,6 +3224,8 @@ export declare class HxDateTimeRangePicker implements ControlValueAccessor, Form
   readonly presetsLabel: import("@angular/core").InputSignal<string>;
   /** Ready-made ranges listed in the popup; choosing one fills the draft, Submit applies it. */
   readonly presets: import("@angular/core").InputSignal<readonly HxDateTimeRangePreset[]>;
+  /** The presets as a row of `buttons` (default) or in a compact `select`. */
+  readonly presetDisplay: import("@angular/core").InputSignal<"select" | "buttons">;
   readonly clearLabel: import("@angular/core").InputSignal<string>;
   readonly cancelLabel: import("@angular/core").InputSignal<string>;
   readonly submitLabel: import("@angular/core").InputSignal<string>;
@@ -2720,6 +3260,8 @@ export declare class HxDateTimeRangePicker implements ControlValueAccessor, Form
   readonly open: import("@angular/core").WritableSignal<boolean>;
   /** The range being edited in the popup; Submit makes it the value, Cancel drops it. */
   protected readonly draft: import("@angular/core").WritableSignal<HxDateTimeRangeValue>;
+  /** The preset chosen in the select (shown until the draft changes otherwise or the popup opens again). */
+  protected readonly selectedPreset: import("@angular/core").WritableSignal<HxDateTimeRangePreset | null>;
   protected readonly popupId: string;
   protected readonly positions: ConnectedPosition[];
   private readonly field;
@@ -2753,9 +3295,12 @@ export declare class HxDateTimeRangePicker implements ControlValueAccessor, Form
   protected commitTyping(): void;
   protected onOverlayKeydown(event: KeyboardEvent): void;
   protected onOutsideClick(event: MouseEvent): void;
+  /** Empties the draft; Submit applies the empty range. */
   protected clear(): void;
+  /** A preset chosen (a button or the select): fills the draft; the select shows it (staging resets it, so set after). */
+  protected selectPreset(preset: HxDateTimeRangePreset): void;
   /** Puts a preset into the draft (the calendar and the time pickers show it); Submit commits it. */
-  protected applyPreset(preset: HxDateTimeRangePreset): void;
+  protected applyPreset(preset: HxDateTimeRangePreset): boolean;
   protected submit(): void;
   /** The focus left the control (field, button and popup): the popup closes and the control is touched. */
   protected onHostFocusOut(event: FocusEvent): void;
@@ -2801,6 +3346,11 @@ export declare class HxDateTimeRangePicker implements ControlValueAccessor, Form
       "required": false;
       "isSignal": true;
     };
+    "presetDisplay": {
+      "alias": "presetDisplay";
+      "required": false;
+      "isSignal": true;
+    };
     "clearLabel": {
       "alias": "clearLabel";
       "required": false;
@@ -5127,6 +5677,10 @@ export declare class HxRating implements ControlValueAccessor, FormValueControl<
 }
 type HxSelectSize = 'small' | 'medium' | 'large';
 type HxSelectVariant = 'outlined' | 'filled';
+/** The class of the select's list overlay (the CDK pane): a popup holding a select treats it as its own. */
+declare const HX_SELECT_OVERLAY_CLASS = "hx-select-overlay";
+/** Whether `target` lies in the list overlay of an `hx-select` (a click or a focus move into an open list). */
+declare function isInSelectOverlay(target: EventTarget | null | undefined): boolean;
 /** An option as the select works with it, after `optionLabel`/`optionValue`/`optionDisabled` are applied. */
 type HxSelectItem<V = unknown> = HxOption<V>;
 /**
@@ -5147,6 +5701,7 @@ type HxSelectItem<V = unknown> = HxOption<V>;
  */
 export declare class HxSelect<V = unknown> implements ControlValueAccessor, FormValueControl<V | null> {
   #private;
+  protected readonly overlayClass = "hx-select-overlay";
   /** The options: primitives or objects. */
   readonly options: import("@angular/core").InputSignal<readonly unknown[]>;
   readonly optionLabel: import("@angular/core").InputSignal<Accessor<never, string>>;
@@ -5170,6 +5725,8 @@ export declare class HxSelect<V = unknown> implements ControlValueAccessor, Form
   readonly inputId: import("@angular/core").InputSignal<string | undefined>;
   readonly ariaLabel: import("@angular/core").InputSignal<string | undefined>;
   readonly ariaLabelledby: import("@angular/core").InputSignal<string | undefined>;
+  /** The `id` of a text that describes the select (a message about the last choice). */
+  readonly ariaDescribedby: import("@angular/core").InputSignal<string | null | undefined>;
   /** How values are compared to find the selected option (default: `Object.is`). */
   readonly compareWith: import("@angular/core").InputSignal<(a: unknown, b: unknown) => boolean>;
   readonly value: import("@angular/core").ModelSignal<V | null>;
@@ -5295,6 +5852,11 @@ export declare class HxSelect<V = unknown> implements ControlValueAccessor, Form
       "required": false;
       "isSignal": true;
     };
+    "ariaDescribedby": {
+      "alias": "ariaDescribedby";
+      "required": false;
+      "isSignal": true;
+    };
     "compareWith": {
       "alias": "compareWith";
       "required": false;
@@ -6715,4 +7277,4 @@ export declare class HxTree {
     "nodeCollapse": "nodeCollapse";
   }, ["template"], never, true, never>;
 }
-export type { HxAccordionValue, HxAutoCompleteEvent, HxAutoCompleteSize, HxAvatarShape, HxAvatarSize, HxBadgeSeverity, HxBadgeSize, HxBreadcrumbItem, HxButtonSeverity, HxButtonSize, HxButtonVariant, HxCarouselItemContext, HxCarouselOrientation, HxCarouselResponsiveOption, HxCellContext, HxCheckboxSize, HxColumn, HxColumnAlign, HxColumnHeaderContext, HxConfirmation, HxDatePickerSelectionMode, HxDatePickerValue, HxDateTimePickerValue, HxDateTimeRangePreset, HxDateTimeRangeValue, HxDialogConfig, HxDialogPosition, HxDividerAlign, HxDividerLayout, HxDividerType, HxDrawerPosition, HxFileUploadMode, HxFloatLabelVariant, HxGalleriaItem, HxGalleriaItemContext, HxGalleriaThumbnailsPosition, HxIconPosition, HxInputNumberButtonLayout, HxInputNumberMode, HxInputNumberSize, HxInputNumberVariant, HxInputSize, HxInputVariant, HxLazyLoadEvent, HxMenuItem, HxMenuItemCommandEvent, HxMessageSeverity, HxMessageSize, HxMessageVariant, HxMultiSelectDisplay, HxMultiSelectSize, HxMultiSelectVariant, HxPageEvent, HxPrimaryColor, HxProgressMode, HxRadioSize, HxRowClass, HxSelectButtonSize, HxSelectItem, HxSelectSize, HxSelectVariant, HxSelectionMode, HxSkeletonAnimation, HxSkeletonShape, HxSliderOrientation, HxSliderValue, HxSortFirstOrder, HxSortFunction, HxSortMeta, HxSortMode, HxStepContentContext, HxStepValue, HxSurface, HxTableColumnsContext, HxTableRowContext, HxTableSize, HxTagSeverity, HxThemeOptions, HxTimePickerValue, HxTimelineAlign, HxTimelineContext, HxTimelineLayout, HxToastMessage, HxToastMessageInput, HxToastPosition, HxToastSeverity, HxToggleButtonSize, HxTooltipEvent, HxTooltipPosition, HxTreeFilterMode, HxTreeNode, HxTreeNodeContext, HxTreeNodeEvent, HxTreeSelection, HxTreeSelectionMode };
+export type { HxAccordionValue, HxAutoCompleteEvent, HxAutoCompleteSize, HxAvatarShape, HxAvatarSize, HxBadgeSeverity, HxBadgeSize, HxBreadcrumbItem, HxButtonSeverity, HxButtonSize, HxButtonVariant, HxCarouselItemContext, HxCarouselOrientation, HxCarouselResponsiveOption, HxCellContext, HxCheckboxSize, HxColumn, HxColumnAlign, HxColumnHeaderContext, HxConfirmation, HxDateMathOptions, HxDateMathUnit, HxDatePickerSelectionMode, HxDatePickerValue, HxDateRangeExpression, HxDateRangePresetId, HxDateRangeQuickSelectValue, HxDateTimePickerValue, HxDateTimeRangePreset, HxDateTimeRangePresetContext, HxDateTimeRangeValue, HxDialogConfig, HxDialogPosition, HxDividerAlign, HxDividerLayout, HxDividerType, HxDrawerPosition, HxFileUploadMode, HxFloatLabelVariant, HxGalleriaItem, HxGalleriaItemContext, HxGalleriaThumbnailsPosition, HxIconPosition, HxInputNumberButtonLayout, HxInputNumberMode, HxInputNumberSize, HxInputNumberVariant, HxInputSize, HxInputVariant, HxLazyLoadEvent, HxMenuItem, HxMenuItemCommandEvent, HxMessageSeverity, HxMessageSize, HxMessageVariant, HxMultiSelectDisplay, HxMultiSelectSize, HxMultiSelectVariant, HxPageEvent, HxPrimaryColor, HxProgressMode, HxQuickSelectLabels, HxQuickSelectRange, HxRadioSize, HxRowClass, HxSelectButtonSize, HxSelectItem, HxSelectSize, HxSelectVariant, HxSelectionMode, HxSkeletonAnimation, HxSkeletonShape, HxSliderOrientation, HxSliderValue, HxSortFirstOrder, HxSortFunction, HxSortMeta, HxSortMode, HxStepContentContext, HxStepValue, HxSurface, HxTableColumnsContext, HxTableRowContext, HxTableSize, HxTagSeverity, HxThemeOptions, HxTimePickerValue, HxTimelineAlign, HxTimelineContext, HxTimelineLayout, HxToastMessage, HxToastMessageInput, HxToastPosition, HxToastSeverity, HxToggleButtonSize, HxTooltipEvent, HxTooltipPosition, HxTreeFilterMode, HxTreeNode, HxTreeNodeContext, HxTreeNodeEvent, HxTreeSelection, HxTreeSelectionMode };