@hyalo/angular 0.0.0-stage → 0.3.1

package/types/hyalo-angular-command.d.ts

@@ -0,0 +1,41 @@
+import { DialogRef } from "@angular/cdk/dialog";
+import * as i0 from "@angular/core";
+export interface HyCommandItem<T = unknown> {
+  readonly id: string;
+  readonly label: string;
+  readonly value: T;
+  readonly description?: string;
+  readonly keywords?: readonly string[];
+  readonly group?: string;
+  readonly shortcut?: string;
+  readonly disabled?: boolean;
+}
+export interface HyCommandConfig<T = unknown> {
+  readonly items: readonly HyCommandItem<T>[];
+  readonly label?: string;
+  readonly placeholder?: string;
+  readonly emptyLabel?: string;
+}
+export declare class HyCommandPanel {
+  protected readonly data: HyCommandConfig;
+  private readonly ref;
+  protected readonly id: string;
+  protected readonly query: import("@angular/core").WritableSignal<string>;
+  private readonly indexed;
+  protected readonly matches: import("@angular/core").Signal<HyCommandItem<unknown>[]>;
+  protected readonly results: import("@angular/core").Signal<HyCommandItem<unknown>[]>;
+  protected readonly selected: import("@angular/core").WritableSignal<HyCommandItem<unknown>[]>;
+  protected pick(values: readonly HyCommandItem[]): void;
+  protected search(event: Event): void;
+  protected choose(item: HyCommandItem): void;
+  protected dismiss(event: Event): void;
+  protected close(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyCommandPanel, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyCommandPanel, "hy-command-panel", never, {}, {}, never, never, true, never>;
+}
+export declare class HyCommand {
+  private readonly dialog;
+  open<T>(config: HyCommandConfig<T>): DialogRef<HyCommandItem<T>>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyCommand, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}

package/types/hyalo-angular-copy.d.ts

@@ -0,0 +1,39 @@
+import * as i0 from "@angular/core";
+export declare class HyCopy {
+  readonly text: import("@angular/core").InputSignal<string>;
+  readonly label: import("@angular/core").InputSignal<string>;
+  readonly copiedLabel: import("@angular/core").InputSignal<string>;
+  readonly failedLabel: import("@angular/core").InputSignal<string>;
+  readonly completed: import("@angular/core").OutputEmitterRef<boolean>;
+  protected readonly status: import("@angular/core").WritableSignal<string>;
+  private readonly clipboard;
+  private timer?;
+  protected readonly copied: import("@angular/core").Signal<boolean>;
+  constructor();
+  copy(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyCopy, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyCopy, "hy-copy", never, {
+    "text": {
+      "alias": "text";
+      "required": true;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "copiedLabel": {
+      "alias": "copiedLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "failedLabel": {
+      "alias": "failedLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "completed": "completed";
+  }, never, ["*"], true, never>;
+}

package/types/hyalo-angular-core.d.ts

@@ -0,0 +1,210 @@
+import * as i0 from "@angular/core";
+import { ElementRef, InjectionToken, Provider, Signal } from "@angular/core";
+/**
+ * How see-through a surface is.
+ *
+ * - `clear`: a light veil, most of the background shows through.
+ * - `frosted`: the default glass, blurred and saturated.
+ * - `tinted`: primary-coloured surface without live backdrop blur.
+ * - `solid`: opaque. Used automatically when the browser cannot blur, when
+ *   the user asks for reduced transparency, and on the low fidelity tier.
+ */
+export type HyMaterial = 'clear' | 'frosted' | 'tinted' | 'solid';
+/**
+ * How heavy a glass surface reads. Bigger surfaces should be thicker: more
+ * blur and a deeper shadow.
+ *
+ * - `thin`: chips and buttons.
+ * - `regular`: the default, for cards, bars, popovers and toasts.
+ * - `thick`: dialogs, drawers and sheets.
+ */
+export type HyThickness = 'thin' | 'regular' | 'thick';
+/** Control size. All sizes keep a touch target of at least 32px. */
+export type HySize = 'sm' | 'md' | 'lg';
+/**
+ * Colour role of a control. `secondary` uses --hy-secondary when the theme sets
+ * it and falls back to the primary colour when it does not.
+ */
+export type HyTone = 'primary' | 'secondary' | 'neutral' | 'success' | 'warning' | 'danger';
+/**
+ * How much visual effort the device can afford.
+ *
+ * - `high`: everything, including cursor physics and (from v0.2) WebGL.
+ * - `medium`: GSAP tilt and reveals, no WebGL.
+ * - `low`: CSS only. Glass turns solid and nothing waits on JavaScript to
+ *   become visible.
+ */
+export type HyFidelityTier = 'high' | 'medium' | 'low';
+/**
+ * The small part of GSAP that Hyalo uses. Declared here so the kit compiles
+ * without GSAP installed. The real `gsap` object satisfies it.
+ */
+export interface HyGsap {
+  to(target: Element | Element[], vars: Record<string, unknown>): unknown;
+  set(target: Element | Element[], vars: Record<string, unknown>): unknown;
+  quickTo(target: Element, property: string, vars?: Record<string, unknown>): (value: number) => unknown;
+  killTweensOf(target: Element | Element[]): void;
+}
+/** Returns GSAP, usually through a dynamic import so it lands in its own chunk. */
+export type HyGsapLoader = () => Promise<HyGsap>;
+/** Global defaults read by every Hyalo component. */
+export interface HyConfig {
+  readonly locale?: string;
+  /** Default material for glass surfaces. */
+  readonly material: HyMaterial;
+  /** Default control size. */
+  readonly size: HySize;
+  /** Default tone for buttons and other coloured controls. */
+  readonly tone: HyTone;
+  /**
+   * Forces a fidelity tier instead of detecting it. Handy for tests,
+   * screenshots and low-end kiosks.
+   */
+  readonly fidelity?: HyFidelityTier;
+  /**
+   * Loads GSAP on demand. Without it, Hyalo falls back to CSS transitions,
+   * so GSAP stays an optional dependency.
+   *
+   * ```ts
+   * provideHyalo({ gsap: () => import('gsap').then((m) => m.gsap) })
+   * ```
+   */
+  readonly gsap?: HyGsapLoader;
+  /**
+   * Maps a palette name to its stylesheet URL for HyPalette. Defaults to
+   * `palette-<name>.css`, which is what a non-injected `bundleName` entry
+   * in angular.json produces.
+   */
+  readonly paletteHref?: (name: string) => string;
+}
+/** Resolved Hyalo configuration. Use {@link provideHyalo} to change it. */
+export declare const HY_CONFIG: InjectionToken<HyConfig>;
+/**
+ * Sets Hyalo defaults. Works in `app.config.ts` and in a component's
+ * `providers`, where it merges with whatever the parent injector provides.
+ * That makes it easy to switch one section of a page to `solid`, for example.
+ */
+export declare function provideHyalo(config?: Partial<HyConfig>): Provider;
+/**
+ * Returns a unique id with the given prefix. The counter is per application,
+ * so the server and the client produce the same ids during hydration.
+ */
+export declare function injectId(prefix: string): string;
+interface NavigatorHints {
+  readonly deviceMemory?: number;
+  readonly hardwareConcurrency?: number;
+  readonly connection?: {
+    readonly saveData?: boolean;
+  };
+}
+export declare function detectFidelity(nav: NavigatorHints): HyFidelityTier;
+export declare class HyFidelity {
+  private readonly config;
+  private readonly document;
+  private readonly detectedTier;
+  private readonly selectedTier;
+  readonly detected: import("@angular/core").Signal<HyFidelityTier>;
+  readonly override: import("@angular/core").Signal<HyFidelityTier | null>;
+  readonly tier: import("@angular/core").Signal<HyFidelityTier>;
+  constructor();
+  setTier(tier: HyFidelityTier | null): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyFidelity, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}
+/**
+ * Turns any element into a glass surface.
+ *
+ * ```html
+ * <aside hyMaterial="clear">...</aside>
+ * <section hyMaterial thickness="thick">...</section>
+ * ```
+ *
+ * The look lives in CSS (`.hy-glass[data-material]`), so effects stay cheap
+ * and themeable. On the low fidelity tier every material renders as `solid`,
+ * because backdrop blur is the most expensive thing on the page.
+ */
+export declare class HyMaterialDirective {
+  private readonly config;
+  private readonly appearance;
+  private readonly fidelity;
+  /** The material. An empty attribute uses the configured default. */
+  readonly material: import("@angular/core").InputSignal<"" | HyMaterial | undefined>;
+  /** How heavy the glass reads. Use `thick` for large surfaces. */
+  readonly thickness: import("@angular/core").InputSignal<HyThickness>;
+  /** The material that is actually rendered after fidelity is applied. */
+  readonly resolved: import("@angular/core").Signal<HyMaterial>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyMaterialDirective, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyMaterialDirective, "[hyMaterial]", never, {
+    "material": {
+      "alias": "hyMaterial";
+      "required": false;
+      "isSignal": true;
+    };
+    "thickness": {
+      "alias": "thickness";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/**
+ * Mirrors interaction state to data attributes so glass effects can stay in
+ * CSS: `data-hover`, `data-press` and `data-focus-visible`.
+ *
+ * Hover is only reported for mouse and pen, so touch screens never get a
+ * stuck hover state.
+ */
+export declare class HyInteractive {
+  private readonly host;
+  private readonly focusMonitor;
+  protected readonly hovered: import("@angular/core").WritableSignal<boolean>;
+  protected readonly pressed: import("@angular/core").WritableSignal<boolean>;
+  protected readonly focusVisible: import("@angular/core").WritableSignal<boolean>;
+  constructor();
+  protected onEnter(event: PointerEvent): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyInteractive, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyInteractive, "[hyInteractive]", never, {}, {}, never, never, true, never>;
+}
+/** True in the browser, false during server rendering. Call in an injection context. */
+declare function injectIsBrowser(): boolean;
+/** Reads a media query once. Always false on the server. */
+declare function matchesMedia(query: string): boolean;
+/**
+ * Keeps a sliding indicator under the selected item of a row by writing
+ * `--hy-ind-x` and `--hy-ind-size` on the row. The offset is physical (from
+ * the left edge) and the indicator is placed physically too, so the same
+ * numbers work in both directions.
+ *
+ * Returns a signal that turns true after the first placement, so CSS can
+ * enable the transition only from then on.
+ */
+declare function trackIndicator(container: Signal<ElementRef<HTMLElement> | undefined>, selected: () => HTMLElement | null): Signal<boolean>;
+/** Scoped preview override; null preserves each component's own material choice. */
+export declare class HyAppearance {
+  readonly material: import("@angular/core").WritableSignal<HyMaterial | null>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyAppearance, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}
+export declare class HyLocale {
+  readonly locale: import("@angular/core").WritableSignal<string>;
+  setLocale(value: string): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyLocale, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}
+export declare function normalizeDigits(value: string): string;
+/** Keeps identifier strings intact, including leading zeros; it does not parse numbers. */
+export declare class HyDigits {
+  readonly hyDigits: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  private readonly el;
+  protected normalize(event: Event): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDigits, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyDigits, "input[hyDigits],textarea[hyDigits]", never, {
+    "hyDigits": {
+      "alias": "hyDigits";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export declare function normalizeSearch(value: string, locale?: string): string;
+export { injectIsBrowser as ɵinjectIsBrowser, matchesMedia as ɵmatchesMedia, trackIndicator as ɵtrackIndicator };

package/types/hyalo-angular-description-list.d.ts

@@ -0,0 +1,16 @@
+import * as i0 from "@angular/core";
+export interface HyDescription {
+  readonly term: string;
+  readonly detail: string;
+}
+export declare class HyDescriptionList {
+  readonly items: import("@angular/core").InputSignal<readonly HyDescription[]>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDescriptionList, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyDescriptionList, "hy-description-list", never, {
+    "items": {
+      "alias": "items";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}

package/types/hyalo-angular-dialog.d.ts

@@ -0,0 +1,171 @@
+import { DialogConfig, DialogRef } from "@angular/cdk/dialog";
+import * as i0 from "@angular/core";
+import { InjectionToken, TemplateRef } from "@angular/core";
+import { ComponentType } from "@angular/cdk/portal";
+import { HyMaterial, HyTone } from "@hyalo/angular/core";
+import "@angular/cdk/overlay";
+import "@hyalo/angular/motion";
+/** Data passed to a dialog or drawer through `open(..., { data })`. */
+export declare const HY_DIALOG_DATA: InjectionToken<unknown>;
+/**
+ * Handle to an open dialog or drawer. Inject it in the content component to
+ * close it, or keep the one `open()` returns.
+ */
+export declare class HyDialogRef<R = unknown> {
+  private readonly cdkRef;
+  private closing;
+  /** Resolves with the result once the surface has closed. */
+  readonly closed: Promise<R | undefined>;
+  /**
+   * @internal Set by surfaces that drive their own exit, like a sheet on a
+   * spring. Calls `finish` once the surface is out of view.
+   */
+  exit: ((finish: () => void) => void) | null;
+  /** @internal */
+  constructor(cdkRef: DialogRef<R>);
+  /** Id of the dialog container element. */
+  get id(): string;
+  /** The element with `role="dialog"`. */
+  get containerElement(): HTMLElement | null;
+  /**
+   * Plays the exit animation, then closes. With reduced motion the exit is
+   * a short fade. Calling it again while the animation runs does nothing.
+   */
+  close(result?: R): void;
+  /**
+   * @internal A sheet grabbed while it was closing stays open, and a later
+   * `close()` works again.
+   */
+  cancelClose(): void;
+}
+/**
+ * The dialog or drawer heading. Its id becomes the container's
+ * `aria-labelledby`, so screen readers announce it on open.
+ */
+export declare class HyDialogTitle {
+  protected readonly id: string;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDialogTitle, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyDialogTitle, "[hyDialogTitle]", never, {}, {}, never, never, true, never>;
+}
+/** The scrollable body. */
+export declare class HyDialogContent {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDialogContent, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyDialogContent, "[hyDialogContent]", never, {}, {}, never, never, true, never>;
+}
+/** The button row at the bottom. Primary action goes last. */
+export declare class HyDialogActions {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDialogActions, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyDialogActions, "[hyDialogActions]", never, {}, {}, never, never, true, never>;
+}
+/** Closes the surrounding dialog or drawer with an optional result. */
+export declare class HyDialogClose {
+  protected readonly ref: HyDialogRef<any> | null;
+  /** The result to close with. A bare attribute closes with `undefined`. */
+  readonly hyDialogClose: import("@angular/core").InputSignalWithTransform<unknown, unknown>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDialogClose, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyDialogClose, "button[hyDialogClose]", never, {
+    "hyDialogClose": {
+      "alias": "hyDialogClose";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+/** Everything needed to lay out dialog or drawer content. */
+export declare const HY_DIALOG_PARTS: readonly [typeof HyDialogTitle, typeof HyDialogContent, typeof HyDialogActions, typeof HyDialogClose];
+/**
+ * Which edge the drawer slides from. `start` and `end` follow the text
+ * direction, so `end` is the right edge in LTR and the left edge in RTL.
+ * `bottom` gives a sheet, handy on phones.
+ */
+export type HyDrawerSide = 'start' | 'end' | 'bottom';
+/** Options for {@link HyDrawer.open}. */
+export interface HyDrawerConfig<D = unknown> extends HySurfaceConfig<D> {
+  readonly side?: HyDrawerSide;
+  /** Any CSS length. Width for side drawers, height for the bottom sheet. */
+  readonly size?: string;
+}
+/**
+ * Opens a modal drawer: navigation on phones, a cart, filters. It behaves
+ * like a dialog (focus trap, Escape, backdrop, focus restore) and uses the
+ * same content parts and `HyDialogRef`.
+ *
+ * It runs on a spring and follows the pointer: drag it toward its edge, or
+ * flick it, to close it, and grab it again while it moves. A bottom sheet
+ * shows a grabber. With reduced motion it cross-fades instead.
+ *
+ * ```ts
+ * this.drawer.open(CartPanel, { side: 'end', label: 'Cart' });
+ * ```
+ */
+export declare class HyDrawer {
+  private readonly cdk;
+  private readonly motion;
+  private readonly fidelity;
+  private readonly injector;
+  /** Opens a component or template in a drawer. */
+  open<R = unknown, D = unknown>(content: ComponentType<unknown> | TemplateRef<unknown>, config?: HyDrawerConfig<D>): HyDialogRef<R>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDrawer, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}
+/** Options shared by dialogs and drawers. */
+interface HySurfaceConfig<D> {
+  /** Passed to the content as `HY_DIALOG_DATA`. */
+  readonly data?: D;
+  /** Accessible name, when the content has no `hyDialogTitle`. */
+  readonly label?: string;
+  /** Close on Escape and backdrop click. Defaults to true. */
+  readonly dismissible?: boolean;
+  /** Glass material of the panel. */
+  readonly material?: HyMaterial;
+  /** Where focus goes on open. Defaults to the first tabbable element. */
+  readonly autoFocus?: DialogConfig['autoFocus'];
+  /** `alertdialog` for messages that need an answer. */
+  readonly role?: 'dialog' | 'alertdialog';
+}
+/** Dialog width. `full` fills the screen on small viewports. */
+export type HyDialogSize = 'sm' | 'md' | 'lg' | 'full';
+/** Options for {@link HyDialog.open}. */
+export interface HyDialogConfig<D = unknown> extends HySurfaceConfig<D> {
+  readonly size?: HyDialogSize;
+}
+/** Options for {@link HyDialog.confirm}. */
+export interface HyConfirmOptions {
+  readonly title: string;
+  readonly message?: string;
+  readonly confirmLabel?: string;
+  readonly cancelLabel?: string;
+  /** Use `danger` for destructive actions. */
+  readonly tone?: HyTone;
+}
+/**
+ * Opens modal dialogs. Focus is trapped inside while open and returns to
+ * the element that opened it. Escape and a backdrop click close it unless
+ * `dismissible` is false.
+ *
+ * ```ts
+ * const ref = this.dialog.open(EditAddress, { data: address, size: 'md' });
+ * const saved = await ref.closed;
+ *
+ * if (await this.dialog.confirm({ title: 'Delete this draft?', tone: 'danger', confirmLabel: 'Delete' })) {
+ *   ...
+ * }
+ * ```
+ *
+ * In the content component, inject `HyDialogRef` to close and
+ * `HY_DIALOG_DATA` to read the data. Lay it out with `hyDialogTitle`,
+ * `hyDialogContent` and `hyDialogActions`.
+ */
+export declare class HyDialog {
+  private readonly cdk;
+  private readonly motion;
+  private readonly fidelity;
+  /** Opens a component or template as a dialog. */
+  open<R = unknown, D = unknown>(content: ComponentType<unknown> | TemplateRef<unknown>, config?: HyDialogConfig<D>): HyDialogRef<R>;
+  /** Asks a yes or no question. Resolves to true only when confirmed. */
+  confirm(options: HyConfirmOptions): Promise<boolean>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDialog, never>;
+  static ɵprov: i0.ɵɵInjectableDeclaration<any>;
+}
+export type { HySurfaceConfig };

package/types/hyalo-angular-divider.d.ts

@@ -0,0 +1,12 @@
+import * as i0 from "@angular/core";
+export declare class HyDivider {
+  readonly orientation: import("@angular/core").InputSignal<"horizontal" | "vertical">;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDivider, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyDivider, "hy-divider", never, {
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}

package/types/hyalo-angular-empty-state.d.ts

@@ -0,0 +1,30 @@
+import * as i0 from "@angular/core";
+export declare class HyEmptyState {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly headingLevel: import("@angular/core").InputSignal<2 | 3 | 4 | 5 | 6>;
+  readonly description: import("@angular/core").InputSignal<string>;
+  readonly icon: import("@angular/core").InputSignal<string | undefined>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyEmptyState, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyEmptyState, "hy-empty-state", never, {
+    "heading": {
+      "alias": "heading";
+      "required": true;
+      "isSignal": true;
+    };
+    "headingLevel": {
+      "alias": "headingLevel";
+      "required": false;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "icon": {
+      "alias": "icon";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}

package/types/hyalo-angular-field.d.ts

@@ -0,0 +1,141 @@
+import * as i0 from "@angular/core";
+import { DoCheck, InjectionToken, Signal } from "@angular/core";
+import { HySize } from "@hyalo/angular/core";
+/**
+ * What a control tells the field around it. Implemented by `hyInput` and
+ * `hy-select`. Custom controls can implement it too, so `hy-field` can
+ * label them and show their errors.
+ */
+export interface HyFieldControl {
+  /** Id of the focusable element. */
+  readonly id: Signal<string>;
+  /** True when the field should show as invalid. */
+  readonly invalid: Signal<boolean>;
+  /** First error message to show, if any. */
+  readonly errorMessage: Signal<string | undefined>;
+  readonly required: Signal<boolean>;
+  readonly disabled: Signal<boolean>;
+  /**
+   * True when the control is a native labelable element (input, textarea,
+   * select, button). Those get `<label for>`. Others rely on
+   * `aria-labelledby`.
+   */
+  readonly labelable: boolean;
+}
+/** The field a control sits in. */
+export interface HyFieldContext {
+  readonly labelId: string;
+  readonly hintId: string;
+  readonly errorId: string;
+  /** True while the field displays an error. */
+  readonly errorShown: Signal<boolean>;
+  /** Space-separated ids for `aria-describedby`. */
+  readonly describedBy: Signal<string | null>;
+  register(control: HyFieldControl): void;
+}
+/** Provided by `hy-field` to the control inside it. */
+export declare const HY_FIELD: InjectionToken<HyFieldContext>;
+/**
+ * Marks a native `<input>` or `<textarea>` as the control of a `hy-field`.
+ * It wires the label, hint and error ids, and reads validity from Signal
+ * Forms when `[formField]` is on the same element.
+ *
+ * The element stays native, so Signal Forms, `ngModel`, autofill and
+ * mobile keyboards all work as usual.
+ */
+export declare class HyInput implements HyFieldControl, DoCheck {
+  protected readonly field: import("@hyalo/angular/field").HyFieldContext | null;
+  private readonly formField;
+  private readonly ngControl;
+  private readonly destroy;
+  private readonly revision;
+  private control;
+  private subscription?;
+  constructor();
+  ngDoCheck(): void;
+  readonly labelable = true;
+  /** The element's own static `id` attribute, or a generated one. */
+  readonly id: import("@angular/core").Signal<string>;
+  readonly invalid: import("@angular/core").Signal<boolean>;
+  readonly errorMessage: import("@angular/core").Signal<string | undefined>;
+  protected readonly showsError: import("@angular/core").Signal<boolean>;
+  readonly required: import("@angular/core").Signal<boolean>;
+  readonly disabled: import("@angular/core").Signal<boolean>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyInput, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyInput, "input[hyInput], textarea[hyInput]", never, {}, {}, never, never, true, never>;
+}
+/** Content before the control inside the field box, such as an icon. */
+export declare class HyPrefix {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyPrefix, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyPrefix, "[hyPrefix]", never, {}, {}, never, never, true, never>;
+}
+/** Content after the control inside the field box, such as a unit or a button. */
+export declare class HySuffix {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HySuffix, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HySuffix, "[hySuffix]", never, {}, {}, never, never, true, never>;
+}
+/**
+ * Label, hint and error around one form control.
+ *
+ * ```html
+ * <hy-field label="Email" hint="Only used for the receipt">
+ *   <hy-icon hyPrefix name="mail" />
+ *   <input hyInput type="email" [formField]="form.email" />
+ * </hy-field>
+ * ```
+ *
+ * With Signal Forms the error comes from the field state and shows once the
+ * field is touched. An explicit `error` input always wins, which is how
+ * server-side errors are shown.
+ */
+export declare class HyField implements HyFieldContext {
+  readonly labelId: string;
+  readonly hintId: string;
+  readonly errorId: string;
+  /** Visible label. Always set one, placeholders are not labels. */
+  readonly label: import("@angular/core").InputSignal<string | undefined>;
+  /** Help text under the control. Hidden while an error shows. */
+  readonly hint: import("@angular/core").InputSignal<string | undefined>;
+  /** Error text. Overrides errors from the form. */
+  readonly error: import("@angular/core").InputSignal<string | undefined>;
+  /** Show errors before the field is touched, for example after submit. */
+  readonly forceError: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Height of the field box. */
+  readonly size: import("@angular/core").InputSignal<HySize>;
+  protected readonly control: import("@angular/core").WritableSignal<HyFieldControl | undefined>;
+  protected readonly labelFor: import("@angular/core").Signal<string | null>;
+  protected readonly errorText: import("@angular/core").Signal<string | undefined>;
+  readonly errorShown: import("@angular/core").Signal<boolean>;
+  readonly describedBy: import("@angular/core").Signal<string | null>;
+  register(control: HyFieldControl): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyField, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyField, "hy-field", never, {
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+    "hint": {
+      "alias": "hint";
+      "required": false;
+      "isSignal": true;
+    };
+    "error": {
+      "alias": "error";
+      "required": false;
+      "isSignal": true;
+    };
+    "forceError": {
+      "alias": "forceError";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["[hyPrefix]", "*", "[hySuffix]"], true, never>;
+}
+/** Everything needed to build a text field. */
+export declare const HY_TEXT_FIELD: readonly [typeof HyField, typeof HyInput, typeof HyPrefix, typeof HySuffix];