@hyalo/angular 0.0.0-stage → 0.3.1

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

@@ -0,0 +1,47 @@
+import * as i0 from "@angular/core";
+export declare class HyAlert {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly tone: import("@angular/core").InputSignal<"info" | "success" | "warning" | "danger">;
+  readonly announce: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly dismissible: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly dismissLabel: import("@angular/core").InputSignal<string>;
+  readonly visible: import("@angular/core").ModelSignal<boolean>;
+  readonly dismissed: import("@angular/core").OutputEmitterRef<void>;
+  dismiss(): void;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyAlert, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyAlert, "hy-alert", never, {
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "tone": {
+      "alias": "tone";
+      "required": false;
+      "isSignal": true;
+    };
+    "announce": {
+      "alias": "announce";
+      "required": false;
+      "isSignal": true;
+    };
+    "dismissible": {
+      "alias": "dismissible";
+      "required": false;
+      "isSignal": true;
+    };
+    "dismissLabel": {
+      "alias": "dismissLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "visible": {
+      "alias": "visible";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "visible": "visibleChange";
+    "dismissed": "dismissed";
+  }, never, ["*"], true, never>;
+}

package/types/hyalo-angular-aspect-ratio.d.ts

@@ -0,0 +1,13 @@
+import * as i0 from "@angular/core";
+export declare class HyAspectRatio {
+  readonly ratio: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  protected readonly safeRatio: import("@angular/core").Signal<number>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyAspectRatio, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyAspectRatio, "hy-aspect-ratio", never, {
+    "ratio": {
+      "alias": "ratio";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}

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

@@ -0,0 +1,39 @@
+import { HySize } from "@hyalo/angular/core";
+import * as i0 from "@angular/core";
+export declare class HyAvatar {
+  readonly name: import("@angular/core").InputSignal<string>;
+  readonly src: import("@angular/core").InputSignal<string>;
+  readonly size: import("@angular/core").InputSignal<HySize>;
+  protected readonly failedSrc: import("@angular/core").WritableSignal<string | null>;
+  protected readonly initials: import("@angular/core").Signal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyAvatar, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyAvatar, "hy-avatar", never, {
+    "name": {
+      "alias": "name";
+      "required": true;
+      "isSignal": true;
+    };
+    "src": {
+      "alias": "src";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export declare class HyAvatarGroup {
+  readonly label: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyAvatarGroup, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyAvatarGroup, "hy-avatar-group", never, {
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare const HY_AVATAR: readonly [typeof HyAvatar, typeof HyAvatarGroup];

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

@@ -0,0 +1,82 @@
+import * as i1 from "@hyalo/angular/core";
+import { HySize, HyTone } from "@hyalo/angular/core";
+import * as i0 from "@angular/core";
+export declare class HyBadge {
+  private readonly config;
+  readonly tone: import("@angular/core").InputSignal<HyTone>;
+  readonly size: import("@angular/core").InputSignal<HySize>;
+  readonly removable: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  readonly removeLabel: import("@angular/core").InputSignal<string>;
+  readonly removed: import("@angular/core").OutputEmitterRef<void>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyBadge, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyBadge, "hy-badge", never, {
+    "tone": {
+      "alias": "tone";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "removable": {
+      "alias": "removable";
+      "required": false;
+      "isSignal": true;
+    };
+    "removeLabel": {
+      "alias": "removeLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "removed": "removed";
+  }, never, ["*"], true, [{
+    directive: typeof i1.HyMaterialDirective;
+    inputs: {
+      "hyMaterial": "material";
+    };
+    outputs: {};
+  }]>;
+}
+/** A native toggle button for selectable filters. */
+export declare class HyChip {
+  private readonly config;
+  readonly tone: import("@angular/core").InputSignal<HyTone>;
+  readonly size: import("@angular/core").InputSignal<HySize>;
+  readonly selected: import("@angular/core").ModelSignal<boolean>;
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyChip, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyChip, "hy-chip", never, {
+    "tone": {
+      "alias": "tone";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "selected": {
+      "alias": "selected";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "selected": "selectedChange";
+  }, never, ["*"], true, [{
+    directive: typeof i1.HyMaterialDirective;
+    inputs: {
+      "hyMaterial": "material";
+    };
+    outputs: {};
+  }]>;
+}
+export declare const HY_BADGE: readonly [typeof HyBadge, typeof HyChip];

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

@@ -0,0 +1,25 @@
+import * as i0 from "@angular/core";
+export declare class HyBento {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyBento, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyBento, "hy-bento", never, {}, {}, never, ["*"], true, never>;
+}
+export declare class HyBentoTile {
+  readonly columns: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  readonly rows: import("@angular/core").InputSignalWithTransform<number, unknown>;
+  get safeColumns(): number;
+  get safeRows(): number;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyBentoTile, never>;
+  static ɵdir: i0.ɵɵDirectiveDeclaration<HyBentoTile, "[hyBentoTile]", never, {
+    "columns": {
+      "alias": "columns";
+      "required": false;
+      "isSignal": true;
+    };
+    "rows": {
+      "alias": "rows";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export declare const HY_BENTO: readonly [typeof HyBento, typeof HyBentoTile];

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

@@ -0,0 +1,272 @@
+import { HyFilterField, HyFilterToken } from "@hyalo/angular/filter";
+import * as i0 from "@angular/core";
+export declare class HyHeroBlock {
+  readonly eyebrow: import("@angular/core").InputSignal<string>;
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string>;
+  readonly actionHref: import("@angular/core").InputSignal<string>;
+  readonly actionLabel: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyHeroBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyHeroBlock, "hy-hero-block", never, {
+    "eyebrow": {
+      "alias": "eyebrow";
+      "required": false;
+      "isSignal": true;
+    };
+    "heading": {
+      "alias": "heading";
+      "required": true;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionHref": {
+      "alias": "actionHref";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionLabel": {
+      "alias": "actionLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["[hyBlockActions]", "[hyBlockMedia]"], true, never>;
+}
+export interface HyPricingPlan {
+  readonly id: string;
+  readonly name: string;
+  readonly description: string;
+  readonly monthly: number;
+  readonly annual: number;
+  readonly features: readonly string[];
+  readonly href: string;
+  readonly featured?: boolean;
+}
+export declare class HyPricingBlock {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly plans: import("@angular/core").InputSignal<readonly HyPricingPlan[]>;
+  readonly billing: import("@angular/core").ModelSignal<"monthly" | "annual">;
+  readonly locale: import("@angular/core").InputSignal<string | undefined>;
+  readonly currencyFormat: import("@angular/core").InputSignal<Intl.NumberFormatOptions>;
+  readonly monthlyLabel: import("@angular/core").InputSignal<string>;
+  readonly annualLabel: import("@angular/core").InputSignal<string>;
+  readonly billingLabel: import("@angular/core").InputSignal<string>;
+  readonly actionLabel: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyPricingBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyPricingBlock, "hy-pricing-block", never, {
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "plans": {
+      "alias": "plans";
+      "required": true;
+      "isSignal": true;
+    };
+    "billing": {
+      "alias": "billing";
+      "required": false;
+      "isSignal": true;
+    };
+    "locale": {
+      "alias": "locale";
+      "required": false;
+      "isSignal": true;
+    };
+    "currencyFormat": {
+      "alias": "currencyFormat";
+      "required": false;
+      "isSignal": true;
+    };
+    "monthlyLabel": {
+      "alias": "monthlyLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "annualLabel": {
+      "alias": "annualLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "billingLabel": {
+      "alias": "billingLabel";
+      "required": false;
+      "isSignal": true;
+    };
+    "actionLabel": {
+      "alias": "actionLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "billing": "billingChange";
+  }, never, never, true, never>;
+}
+export interface HyFeature {
+  readonly id: string;
+  readonly title: string;
+  readonly description: string;
+}
+export declare class HyFeatureBlock {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly features: import("@angular/core").InputSignal<readonly HyFeature[]>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyFeatureBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyFeatureBlock, "hy-feature-block", never, {
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "features": {
+      "alias": "features";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export interface HyTestimonial {
+  readonly id: string;
+  readonly quote: string;
+  readonly author: string;
+  readonly role: string;
+}
+export declare class HyTestimonialsBlock {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly items: import("@angular/core").InputSignal<readonly HyTestimonial[]>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyTestimonialsBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyTestimonialsBlock, "hy-testimonials-block", never, {
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "items": {
+      "alias": "items";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export declare class HyProductBlock {
+  readonly category: import("@angular/core").InputSignal<string>;
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly description: import("@angular/core").InputSignal<string>;
+  readonly price: import("@angular/core").InputSignal<string>;
+  readonly actionHref: import("@angular/core").InputSignal<string>;
+  readonly actionLabel: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyProductBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyProductBlock, "hy-product-block", never, {
+    "category": {
+      "alias": "category";
+      "required": false;
+      "isSignal": true;
+    };
+    "heading": {
+      "alias": "heading";
+      "required": true;
+      "isSignal": true;
+    };
+    "description": {
+      "alias": "description";
+      "required": false;
+      "isSignal": true;
+    };
+    "price": {
+      "alias": "price";
+      "required": true;
+      "isSignal": true;
+    };
+    "actionHref": {
+      "alias": "actionHref";
+      "required": true;
+      "isSignal": true;
+    };
+    "actionLabel": {
+      "alias": "actionLabel";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["[hyBlockMedia]", "[hyBlockOptions]", "*"], true, never>;
+}
+export declare class HyDashboardBlock {
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyDashboardBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyDashboardBlock, "hy-dashboard-block", never, {}, {}, never, ["[hyBlockSidebar]", "[hyBlockToolbar]", "*"], true, never>;
+}
+export interface HyKpi {
+  readonly id: string;
+  readonly label: string;
+  readonly value: number;
+  readonly trend?: string;
+  readonly prefix?: string;
+  readonly suffix?: string;
+}
+export declare class HyKpiStripBlock {
+  readonly items: import("@angular/core").InputSignal<readonly HyKpi[]>;
+  readonly locale: import("@angular/core").InputSignal<string | undefined>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyKpiStripBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyKpiStripBlock, "hy-kpi-strip-block", never, {
+    "items": {
+      "alias": "items";
+      "required": true;
+      "isSignal": true;
+    };
+    "locale": {
+      "alias": "locale";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}
+export interface HyActivity {
+  readonly id: string;
+  readonly heading: string;
+  readonly description: string;
+  readonly time: string;
+  readonly dateTime: string;
+}
+export declare class HyActivityBlock {
+  readonly heading: import("@angular/core").InputSignal<string>;
+  readonly items: import("@angular/core").InputSignal<readonly HyActivity[]>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyActivityBlock, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyActivityBlock, "hy-activity-block", never, {
+    "heading": {
+      "alias": "heading";
+      "required": false;
+      "isSignal": true;
+    };
+    "items": {
+      "alias": "items";
+      "required": true;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}
+export declare class HyFilterToolbarBlock<C extends HyFilterToken> {
+  readonly fields: import("@angular/core").InputSignal<readonly HyFilterField<C>[]>;
+  readonly clauses: import("@angular/core").ModelSignal<readonly C[]>;
+  readonly label: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyFilterToolbarBlock<any>, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyFilterToolbarBlock<any>, "hy-filter-toolbar-block", never, {
+    "fields": {
+      "alias": "fields";
+      "required": true;
+      "isSignal": true;
+    };
+    "clauses": {
+      "alias": "clauses";
+      "required": false;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {
+    "clauses": "clausesChange";
+  }, never, ["*"], true, never>;
+}

package/types/hyalo-angular-border-beam.d.ts

@@ -0,0 +1,15 @@
+import * as i0 from "@angular/core";
+export declare class HyBorderBeam {
+  readonly animated: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  private readonly motion;
+  private readonly visible;
+  protected readonly moving: import("@angular/core").Signal<boolean>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyBorderBeam, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyBorderBeam, "hy-border-beam", never, {
+    "animated": {
+      "alias": "animated";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}

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

@@ -0,0 +1,22 @@
+import * as i0 from "@angular/core";
+export interface HyBreadcrumbItem {
+  readonly label: string;
+  readonly href?: string;
+}
+export declare class HyBreadcrumb {
+  readonly items: import("@angular/core").InputSignal<readonly HyBreadcrumbItem[]>;
+  readonly label: import("@angular/core").InputSignal<string>;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyBreadcrumb, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyBreadcrumb, "hy-breadcrumb", never, {
+    "items": {
+      "alias": "items";
+      "required": true;
+      "isSignal": true;
+    };
+    "label": {
+      "alias": "label";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, never, true, never>;
+}

package/types/hyalo-angular-button-group.d.ts

@@ -0,0 +1,19 @@
+import * as i0 from "@angular/core";
+/** Groups native buttons. For mutually exclusive choices use HySegmented. */
+export declare class HyButtonGroup {
+  readonly label: import("@angular/core").InputSignal<string>;
+  readonly orientation: import("@angular/core").InputSignal<"horizontal" | "vertical">;
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyButtonGroup, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyButtonGroup, "hy-button-group", never, {
+    "label": {
+      "alias": "label";
+      "required": true;
+      "isSignal": true;
+    };
+    "orientation": {
+      "alias": "orientation";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, never>;
+}

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

@@ -0,0 +1,89 @@
+import * as i1 from "@hyalo/angular/core";
+import { HySize, HyTone } from "@hyalo/angular/core";
+import * as i0 from "@angular/core";
+/**
+ * - `solid`: filled with the tone colour. The main action on a view.
+ * - `glass`: a glass surface with tone-coloured text.
+ * - `soft`: a light wash of the tone colour.
+ * - `ghost`: text only, a surface appears on hover.
+ */
+export type HyButtonVariant = 'solid' | 'glass' | 'soft' | 'ghost';
+/**
+ * Button and link button.
+ *
+ * ```html
+ * <button hyButton (click)="save()">Save</button>
+ * <a hyButton variant="glass" routerLink="/pricing">Pricing</a>
+ * <button hyButton iconOnly aria-label="Close"><hy-icon name="x" /></button>
+ * ```
+ *
+ * It stays a native `<button>` or `<a>`, so forms, routing and keyboard
+ * behaviour work as usual. A press dims and shrinks it the moment the
+ * pointer goes down. Add `hyMagnetic` for the magnetic hover effect, or
+ * `hyRipple` for a press ripple.
+ *
+ * While `loading`, the button keeps its focus and width, sets `aria-busy`
+ * and ignores clicks. A disabled link gets `aria-disabled` and leaves the
+ * tab order, since links have no native disabled state.
+ */
+export declare class HyButton {
+  private readonly config;
+  private readonly appearance;
+  private readonly fidelity;
+  private readonly el;
+  protected readonly isButton: boolean;
+  /** Visual style. */
+  readonly variant: import("@angular/core").InputSignal<HyButtonVariant>;
+  /** Height and padding. Defaults to the configured size. */
+  readonly size: import("@angular/core").InputSignal<HySize>;
+  /** Colour role. Defaults to the configured tone. */
+  readonly tone: import("@angular/core").InputSignal<HyTone>;
+  /** Square button for a single icon. Give it an `aria-label`. */
+  readonly iconOnly: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Shows a spinner and blocks clicks without dropping focus. */
+  readonly loading: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Disables the button. On links this sets `aria-disabled`. */
+  readonly disabled: import("@angular/core").InputSignalWithTransform<boolean, unknown>;
+  /** Glass follows the configured material and goes solid on the low tier. */
+  protected readonly material: import("@angular/core").Signal<import("@hyalo/angular/core").HyMaterial | null>;
+  /** True when clicks should be ignored. */
+  protected readonly blocked: import("@angular/core").Signal<boolean>;
+  constructor();
+  static ɵfac: i0.ɵɵFactoryDeclaration<HyButton, never>;
+  static ɵcmp: i0.ɵɵComponentDeclaration<HyButton, "button[hyButton], a[hyButton]", never, {
+    "variant": {
+      "alias": "variant";
+      "required": false;
+      "isSignal": true;
+    };
+    "size": {
+      "alias": "size";
+      "required": false;
+      "isSignal": true;
+    };
+    "tone": {
+      "alias": "tone";
+      "required": false;
+      "isSignal": true;
+    };
+    "iconOnly": {
+      "alias": "iconOnly";
+      "required": false;
+      "isSignal": true;
+    };
+    "loading": {
+      "alias": "loading";
+      "required": false;
+      "isSignal": true;
+    };
+    "disabled": {
+      "alias": "disabled";
+      "required": false;
+      "isSignal": true;
+    };
+  }, {}, never, ["*"], true, [{
+    directive: typeof i1.HyInteractive;
+    inputs: {};
+    outputs: {};
+  }]>;
+}