@gravionlabs/helix-ui 22.2.13 → 22.2.15

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gravionlabs/helix-ui",
-  "version": "22.2.13",
+  "version": "22.2.15",
   "description": "Helix UI: vanilla Angular components on the Helix design tokens — plain CSS, no runtime styling engine.",
   "license": "MIT",
   "keywords": [

package/styles.css

@@ -1453,11 +1453,15 @@
     -webkit-mask: var(--hx-check) center/contain no-repeat;
     transform: scale(0);
     transition: transform var(--h-checkbox-transition-duration);
-    --hx-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7.5 2.8 2.8L11 4.5'/%3E%3C/svg%3E");
+    --hx-check: url(
+      "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m3 7.5 2.8 2.8L11 4.5'/%3E%3C/svg%3E"
+    );
   }
 
   .hx-checkbox:indeterminate::before {
-    --hx-check: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 7h8'/%3E%3C/svg%3E");
+    --hx-check: url(
+      "data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='black' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M3 7h8'/%3E%3C/svg%3E"
+    );
   }
 
   .hx-checkbox:checked,
@@ -3484,9 +3488,7 @@
   }
 
   /* invalid */
-  .hx-float-label:has(> [aria-invalid=true],
-  > .ng-invalid.ng-touched,
-  > .hx-select-invalid) > label {
+  .hx-float-label:has(> [aria-invalid=true], > .ng-invalid.ng-touched, > .hx-select-invalid) > label {
     color: var(--h-floatlabel-invalid-color);
   }
 

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

@@ -114,14 +114,6 @@ interface HxOption<V = unknown> {
   value: V;
   disabled: boolean;
 }
-/** How values are compared to find the chosen option: `Object.is` unless the app passes its own. */
-declare const compareValues$1: (a: unknown, b: unknown) => boolean;
-/**
- * Turns the `options` input of a component into `{ label, value, disabled }` entries. A primitive is its own
- * label and value; an object is read through the accessors (a property name or a function). A missing label is
- * an empty string, a missing value is the object itself, a missing `disabled` is `false`.
- */
-declare function resolveOptions<V = unknown>(options: readonly unknown[], label: Accessor<never, string>, value: Accessor<never, unknown>, disabled: Accessor<never, boolean>): HxOption<V>[];
 type HxAutoCompleteSize = 'small' | 'medium' | 'large';
 /** The event of `(complete)`: the text to find suggestions for. */
 interface HxAutoCompleteEvent {
@@ -1874,16 +1866,6 @@ interface HxDateTimeRangePreset {
 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';
 /**
@@ -1898,27 +1880,6 @@ 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;
-  max?: Date | null;
-  disabledDates?: readonly Date[];
-}
-/** `2026-9-5`, the `data-date` of a day button. */
-declare function dateKey(date: Date): string;
-/** Whether a day lies outside `min`..`max` (by day) or is one of `disabledDates`. */
-declare function isDateDisabled(date: Date, rules: DisabledRules): boolean;
-/** Whether a day lies strictly between the two dates of a complete range. */
-declare function isInRange(date: Date, selected: readonly Date[], mode: string): boolean;
-/** The focused day after the previous (`-1`) or next (`1`) button of the header: a month, a year or 12 years. */
-declare function stepFocus(view: CalendarView, current: Date, direction: 1 | -1): Date;
-/** The focused day after choosing a month (`0` to `11`) in the month view. */
-declare function focusMonth(current: Date, month: number): Date;
-/** The focused day after choosing a year in the year view. */
-declare function focusYear(current: Date, year: number): Date;
-/** The 12 years of the page that holds `year`. */
-declare function decadeOf(year: number): number[];
-/** The day a key of the day grid moves the focus to, or `null` for a key that does nothing. */
-declare function dayKeyTarget(key: string, date: Date, firstDayOfWeek: number, shift?: boolean): Date | null;
 type HxDatePickerSelectionMode = 'single' | 'range' | 'multiple';
 type HxDatePickerValue = Date | Date[] | null;
 /**
@@ -2262,13 +2223,10 @@ interface HxQuickSelectLabels {
   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';
@@ -2282,23 +2240,9 @@ interface QuickSelectSide {
   /** 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.
@@ -2319,25 +2263,6 @@ export declare function hxResolveRangeExpression(range: HxDateRangeExpression, o
   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;
@@ -2631,48 +2556,11 @@ export declare class HxDateRangeQuickSelect implements ControlValueAccessor, For
     "touch": "touch";
   }, never, never, true, never>;
 }
-type TimeUnit = 'hour' | 'minute' | 'second' | 'period';
-interface TimeColumn {
-  unit: TimeUnit;
-  label: string;
-  now: number;
-  min: number;
-  max: number;
-  text: string;
-  valueText: string;
-}
 interface TimeOfDay {
   hours: number;
   minutes: number;
   seconds: number;
 }
-interface TimeColumnOptions {
-  hour12: boolean;
-  showMinutes: boolean;
-  showSeconds: boolean;
-  locale?: string;
-  labels: {
-    hour: string;
-    minute: string;
-    second: string;
-    period: string;
-  };
-}
-interface TimeSteps {
-  hour: number;
-  minute: number;
-  second: number;
-}
-/** The spinbutton columns of a time row: hour, minute, second, AM/PM as the options ask. */
-declare function buildTimeColumns(time: TimeOfDay, options: TimeColumnOptions): TimeColumn[];
-/** The values a time unit can take: from its minimum in steps, up to its maximum. */
-declare function unitValues(column: TimeColumn, steps: TimeSteps): number[];
-/** The next (`1`) or previous (`-1`) value of a column's steps, wrapping around. */
-declare function nextUnitValue(column: TimeColumn, steps: TimeSteps, direction: 1 | -1): number;
-/** The time with one unit set (in the units shown: 1 to 12 with AM/PM). */
-declare function applyUnit(time: TimeOfDay, unit: TimeUnit, value: number, hour12: boolean): TimeOfDay;
-/** The value a key of a spinbutton jumps to (Page Up/Down, Home, End), or `null` for another key. */
-declare function jumpKeyTarget(key: string, column: TimeColumn, steps: TimeSteps): number | null;
 type HxDateTimePickerValue = Date | null;
 /**
  * A date and time field that opens a calendar with a time row under it (hour, minute, optionally second and AM/PM),
@@ -3487,43 +3375,6 @@ export declare class HxDateTimeRangePicker implements ControlValueAccessor, Form
   }, never, never, true, never>;
 }
 type HxDialogPosition = 'center' | 'top' | 'bottom' | 'left' | 'right' | 'top-left' | 'top-right' | 'bottom-left' | 'bottom-right';
-/**
- * The box of a dialog: a title (the `header`, plus content marked `hxDialogHeader`), the content, a footer (content
- * marked `hxDialogFooter`) and a close button. Used by `hx-dialog` and by the dialogs opened with `HxDialogService`.
- * The close button comes last in the DOM, so the first control of the content gets the focus when the dialog opens.
- */
-declare class HxDialogFrame {
-  readonly header: import("@angular/core").InputSignal<string | undefined>;
-  readonly titleId: import("@angular/core").InputSignal<string | undefined>;
-  readonly closable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
-  readonly closeLabel: import("@angular/core").InputSignal<string>;
-  readonly closeClick: import("@angular/core").OutputEmitterRef<void>;
-  static ɵfac: i0.ɵɵFactoryDeclaration<HxDialogFrame, never>;
-  static ɵcmp: i0.ɵɵComponentDeclaration<HxDialogFrame, "hx-dialog-frame", never, {
-    "header": {
-      "alias": "header";
-      "required": false;
-      "isSignal": true;
-    };
-    "titleId": {
-      "alias": "titleId";
-      "required": false;
-      "isSignal": true;
-    };
-    "closable": {
-      "alias": "closable";
-      "required": false;
-      "isSignal": true;
-    };
-    "closeLabel": {
-      "alias": "closeLabel";
-      "required": false;
-      "isSignal": true;
-    };
-  }, {
-    "closeClick": "closeClick";
-  }, never, ["[hxDialogHeader]", "*", "[hxDialogFooter]"], true, never>;
-}
 /**
  * A modal or non-modal dialog, on `@angular/cdk/dialog`.
  *
@@ -3668,21 +3519,6 @@ interface HxDialogConfig<D = unknown> {
   /** Accessible name when there is no `header`. */
   ariaLabel?: string;
 }
-interface HostData {
-  component: Type<unknown>;
-  config: HxDialogConfig;
-  ref: HxDialogRef;
-  titleId: string;
-}
-/** The inside of a service dialog: a frame around the component that was asked for. */
-declare class HxDialogHost {
-  protected readonly data: HostData;
-  protected readonly injector: import("@angular/core").DestroyableInjector;
-  private readonly outlet;
-  constructor();
-  static ɵfac: i0.ɵɵFactoryDeclaration<HxDialogHost, never>;
-  static ɵcmp: i0.ɵɵComponentDeclaration<HxDialogHost, "hx-dialog-host", never, {}, {}, never, never, true, never>;
-}
 /**
  * Opens a component in a dialog.
  *
@@ -5677,10 +5513,6 @@ 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>;
 /**
@@ -6725,11 +6557,6 @@ interface HxThemeOptions {
   viewTransition?: boolean;
 }
 export declare const HX_THEME_OPTIONS: InjectionToken<HxThemeOptions>;
-/** A class (`.app-dark`) or an attribute (`[data-theme="dark"]`) selector, split into what the DOM needs. */
-declare function parseDarkSelector(selector: string): {
-  css: string;
-  apply: (el: Element, on: boolean) => void;
-};
 /**
  * Switches dark mode, the primary colour and the surface scale while the app runs, with CSS custom properties
  * only: no styling engine, no rebuild of the tokens. `tokens.css` defines every `--h-*` token for the Helix look;
@@ -7054,13 +6881,6 @@ export declare class HxToolbar {
 }
 type HxTooltipPosition = 'top' | 'right' | 'bottom' | 'left';
 type HxTooltipEvent = 'hover' | 'focus' | 'both';
-/** The bubble. Created by the directive in a CDK overlay. */
-declare class HxTooltipBubble {
-  readonly text: import("@angular/core").WritableSignal<string>;
-  id: string;
-  static ɵfac: i0.ɵɵFactoryDeclaration<HxTooltipBubble, never>;
-  static ɵcmp: i0.ɵɵComponentDeclaration<HxTooltipBubble, "hx-tooltip-bubble", never, {}, {}, never, never, true, never>;
-}
 /**
  * A short text that explains an element, shown on hover and/or keyboard focus (CDK overlay, `role="tooltip"`,
  * `aria-describedby` on the host). Escape closes it. It is a hint, not a place for essential information.