ngwr 6.0.0 → 7.0.0

package/types/ngwr-table.d.ts

@@ -0,0 +1,237 @@
+import * as _angular_core from '@angular/core';
+import { TemplateRef } from '@angular/core';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Sort direction for a sortable column.
+ *
+ * - `'asc'` — ascending
+ * - `'desc'` — descending
+ * - `null` — unsorted
+ */
+type WrTableSortDirection = 'asc' | 'desc' | null;
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/**
+ * Per-column sort state. The full sort emitted by `<wr-table>` is an
+ * array of these — the order in the array is the application order.
+ */
+interface WrTableSortState {
+    readonly key: string;
+    readonly direction: WrTableSortDirection;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Single picker entry inside a column's filter dropdown.
+ */
+interface WrTableFilterItem<T = unknown> {
+    readonly title: string;
+    readonly value: T;
+    selected?: boolean;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/** Payload emitted by `<wr-table>` when a column's filter selection changes. */
+interface WrTableFilterChange {
+    readonly key: string;
+    readonly items: readonly WrTableFilterItem[];
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/** A single column definition. */
+interface WrTableColumn {
+    /** Heading shown in the column's header. */
+    readonly title: string;
+    /** Show a clickable sort indicator in the header. */
+    readonly sortable?: boolean;
+    /** When non-empty, shows a filter dropdown in the header. */
+    readonly filterItems?: readonly WrTableFilterItem[];
+}
+/**
+ * Column map — keys are the row's property names; values are column defs.
+ *
+ * @example
+ * ```ts
+ * const columns: WrTableColumns = {
+ *   name:  { title: 'Name', sortable: true },
+ *   email: { title: 'Email' },
+ *   role:  { title: 'Role', filterItems: [{ title: 'Admin', value: 'admin' }] },
+ * };
+ * ```
+ */
+type WrTableColumns = Record<string, WrTableColumn>;
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/**
+ * Implicit context passed to a `[wrTableCell]` template.
+ */
+interface WrTableCellContext {
+    /** Cell value (alias for `item[columnKey]`). Use as `let-value`. */
+    readonly $implicit: unknown;
+    /** The full row item. */
+    readonly item: Record<string, unknown>;
+    /** The column definition. */
+    readonly column: WrTableColumn;
+}
+
+/**
+ * Data table with sortable / filterable headers and custom cell templates.
+ *
+ * Columns are defined via the `columns` input (a `Record<key, column>`).
+ * Rows are objects whose property names match the column keys. Cells can
+ * be customised by projecting an `[wrTableCell]="key"` template.
+ *
+ * @example
+ * ```html
+ * <wr-table
+ *   [columns]="columns"
+ *   [items]="rows"
+ *   [(sort)]="sort"
+ *   (filterChange)="onFilter($event)"
+ * >
+ *   <ng-template wrTableCell="role" let-value>
+ *     <wr-tag [color]="value === 'admin' ? 'danger' : 'medium'">{{ value }}</wr-tag>
+ *   </ng-template>
+ * </wr-table>
+ * ```
+ *
+ * @see https://ngwr.dev/components/table
+ */
+declare class WrTable {
+    /** Column definitions, keyed by row property name. */
+    readonly columns: _angular_core.InputSignal<WrTableColumns>;
+    /** Row items. `null`/`undefined` → loading skeleton. */
+    readonly items: _angular_core.InputSignal<readonly Record<string, unknown>[] | null | undefined>;
+    /** Show the loading spinner overlay. @default false */
+    readonly loading: _angular_core.InputSignalWithTransform<boolean, any>;
+    /** Two-way bindable sort array. Order in array = application order. */
+    readonly sort: _angular_core.ModelSignal<readonly WrTableSortState[]>;
+    /** Fires whenever a column's filter selection changes. */
+    readonly filterChange: _angular_core.OutputEmitterRef<WrTableFilterChange>;
+    /**
+     * Rows per page. Set to `0` (default) to disable client-side pagination
+     * and render every row at once.
+     */
+    readonly pageSize: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Two-way bindable 1-based current page. */
+    readonly page: _angular_core.ModelSignal<number>;
+    /**
+     * Total row count for server-side pagination — when set, the table
+     * shows the pager but does NOT slice `items` (you provide the current
+     * page's slice yourself and react to `(page)` changes).
+     */
+    readonly totalItems: _angular_core.InputSignal<number | null>;
+    /** Total row count derived for the pager (server-mode wins). */
+    protected readonly resolvedTotal: _angular_core.Signal<number>;
+    /** Items visible on the current page (client mode slices; server mode passes through). */
+    protected readonly visibleItems: _angular_core.Signal<readonly Record<string, unknown>[] | null | undefined>;
+    /** Show the pager footer only when paging is enabled and rows overflow. */
+    protected readonly showPager: _angular_core.Signal<boolean>;
+    private readonly cellTemplates;
+    /** Map of column key → custom template (if provided via `[wrTableCell]`). */
+    protected readonly cellMap: _angular_core.Signal<Map<string, TemplateRef<WrTableCellContext>>>;
+    /** Keep KeyValuePipe in declaration order (comparator that treats all keys as equal). */
+    protected readonly keepOrder: () => number;
+    protected directionFor(key: string): WrTableSortDirection;
+    protected cycleSort(key: string): void;
+    protected onFilter(key: string, items: readonly WrTableFilterItem[]): void;
+    protected cellContext(item: Record<string, unknown>, key: string, column: unknown): WrTableCellContext;
+    protected getValue(item: Record<string, unknown>, key: unknown): unknown;
+    protected templateFor(key: unknown): TemplateRef<WrTableCellContext> | undefined;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTable, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTable, "wr-table", never, { "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "sort": { "alias": "sort"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; "totalItems": { "alias": "totalItems"; "required": false; "isSignal": true; }; }, { "sort": "sortChange"; "filterChange": "filterChange"; "page": "pageChange"; }, ["cellTemplates"], never, true, never>;
+}
+
+/**
+ * Provide a custom template for a specific column's cells.
+ *
+ * @example
+ * ```html
+ * <wr-table [columns]="columns" [items]="items">
+ *   <ng-template wrTableCell="role" let-value let-row="item">
+ *     <wr-tag [color]="value === 'admin' ? 'danger' : 'medium'">{{ value }}</wr-tag>
+ *   </ng-template>
+ * </wr-table>
+ * ```
+ */
+declare class WrTableCell {
+    /** Column key the template applies to. */
+    readonly columnKey: _angular_core.InputSignal<string>;
+    readonly template: TemplateRef<WrTableCellContext>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTableCell, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrTableCell, "[wrTableCell]", never, { "columnKey": { "alias": "wrTableCell"; "required": true; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Sort indicator rendered in a sortable column's header.
+ *
+ * @internal — used internally by `<wr-table>`. Parent listens for clicks
+ * on the indicator to cycle direction.
+ */
+declare class WrTableSort {
+    readonly direction: _angular_core.InputSignal<WrTableSortDirection>;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTableSort, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTableSort, "wr-table-sort", never, { "direction": { "alias": "direction"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Filter dropdown rendered in a filterable column's header.
+ *
+ * @internal — used internally by `<wr-table>`.
+ */
+declare class WrTableFilter {
+    /** Available filter options. */
+    readonly items: _angular_core.InputSignal<readonly WrTableFilterItem<unknown>[]>;
+    /** Fires whenever the selection changes. */
+    readonly selectionChange: _angular_core.OutputEmitterRef<readonly WrTableFilterItem<unknown>[]>;
+    protected readonly query: _angular_core.WritableSignal<string>;
+    /** Filtered + selection-tracked view of items. */
+    protected readonly visible: _angular_core.Signal<WrTableFilterItem<unknown>[]>;
+    protected readonly selectedCount: _angular_core.Signal<number>;
+    protected readonly classes: _angular_core.Signal<string>;
+    protected onSearchInput(event: Event): void;
+    protected onToggle(item: WrTableFilterItem): void;
+    protected onReset(): void;
+    private emitSelected;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTableFilter, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTableFilter, "wr-table-filter", never, { "items": { "alias": "items"; "required": true; "isSignal": true; }; }, { "selectionChange": "selectionChange"; }, never, never, true, never>;
+}
+
+export { WrTable, WrTableCell, WrTableFilter, WrTableSort };
+export type { WrTableCellContext, WrTableColumn, WrTableColumns, WrTableFilterChange, WrTableFilterItem, WrTableSortDirection, WrTableSortState };

package/types/ngwr-tabs.d.ts

@@ -0,0 +1,125 @@
+import * as _angular_core from '@angular/core';
+import { TemplateRef, InjectionToken, Signal, ElementRef } from '@angular/core';
+
+/**
+ * Single tab. Two modes, decided by inputs:
+ *
+ * - **Content tab** — projected children render in the parent's content
+ *   panel when this tab is active.
+ * - **Router tab** — set `routerLink` and the tab becomes a link; the
+ *   parent skips its content panel and the consumer drops a
+ *   `<router-outlet>` below the tab strip.
+ */
+declare class WrTab {
+    /** Visible label on the tab strip. */
+    readonly title: _angular_core.InputSignal<string>;
+    /**
+     * Stable identifier used by the parent to track the active tab.
+     * Auto-generated if omitted.
+     */
+    readonly key: _angular_core.InputSignal<string>;
+    /** Router target — when set, the tab becomes a `[routerLink]` link. */
+    readonly routerLink: _angular_core.InputSignal<string | readonly string[] | null>;
+    /** Disable the tab. */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, any>;
+    /** Tab content template; portaled into the parent's panel area. @internal */
+    readonly contentTpl: _angular_core.Signal<TemplateRef<any>>;
+    private readonly parent;
+    private readonly destroyRef;
+    protected readonly isRouter: _angular_core.Signal<boolean>;
+    constructor();
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTab, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTab, "wr-tab", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "key": { "alias": "key"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/**
+ * Contract a `<wr-tab>` uses to talk to its parent `<wr-tabs>`.
+ *
+ * @internal
+ */
+interface WrTabsContext {
+    /** Currently active tab key (component-managed only). */
+    readonly active: Signal<string | null>;
+    /** Activate a tab by key (component-managed only). */
+    activate(key: string): void;
+    /** Register a child tab so the parent can pick a default. */
+    register(tab: {
+        key: string;
+        routerLink: unknown;
+    }): void;
+    /** Unregister on destroy. */
+    unregister(key: string): void;
+}
+/**
+ * Token a `<wr-tab>` injects to register itself with — and read the active
+ * key from — its parent `<wr-tabs>` host.
+ *
+ * @internal
+ */
+declare const WR_TABS: InjectionToken<WrTabsContext>;
+
+/**
+ * Tabbed container. Two modes depending on the child `<wr-tab>`
+ * definitions:
+ *
+ * - **Content** — children project body content; the parent renders an
+ *   active-tab panel automatically.
+ * - **Router** — any child with `routerLink` switches the whole strip
+ *   into router mode; the parent skips its panel so the consumer can
+ *   drop a `<router-outlet>` after it.
+ *
+ * @example
+ * ```html
+ * <!-- content tabs -->
+ * <wr-tabs [(active)]="key">
+ *   <wr-tab key="one" title="One">First panel</wr-tab>
+ *   <wr-tab key="two" title="Two">Second panel</wr-tab>
+ * </wr-tabs>
+ *
+ * <!-- router tabs -->
+ * <wr-tabs>
+ *   <wr-tab title="Overview" routerLink="overview" />
+ *   <wr-tab title="Details" routerLink="details" />
+ * </wr-tabs>
+ * <router-outlet />
+ * ```
+ *
+ * @see https://ngwr.dev/components/tabs
+ */
+declare class WrTabs implements WrTabsContext {
+    /** Two-way bindable active tab key (content mode). */
+    readonly active: _angular_core.ModelSignal<string | null>;
+    /** Visual size variant. */
+    readonly size: _angular_core.InputSignal<"sm" | "md" | "lg">;
+    protected readonly tabs: _angular_core.Signal<readonly WrTab[]>;
+    /** When any child has a routerLink, the whole strip switches to router mode. */
+    protected readonly isRouter: _angular_core.Signal<boolean>;
+    /** Content-mode: the tab whose key matches `active()` (or the first tab if none yet). */
+    protected readonly activeTab: _angular_core.Signal<WrTab | null>;
+    activate(key: string): void;
+    register({ key }: {
+        key: string;
+        routerLink: unknown;
+    }): void;
+    unregister(): void;
+    protected readonly stripRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
+    protected onTabClick(tab: WrTab): void;
+    /** Header id for `aria-labelledby` on the panel. @internal */
+    headerId(key: string): string;
+    /** Panel id for `aria-controls` on the tab header. @internal */
+    panelId(key: string): string;
+    /** ArrowLeft/Right/Home/End keyboard navigation on the tab strip. */
+    protected onStripKeydown(event: KeyboardEvent): void;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTabs, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTabs, "wr-tabs", never, { "active": { "alias": "active"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, { "active": "activeChange"; }, ["tabs"], never, true, never>;
+}
+
+export { WR_TABS, WrTab, WrTabs };
+export type { WrTabsContext };

package/types/ngwr-textarea.d.ts

@@ -0,0 +1,60 @@
+import * as _angular_core from '@angular/core';
+import { ElementRef } from '@angular/core';
+import { ControlValueAccessor } from '@angular/forms';
+
+/**
+ * Multi-line text input.
+ *
+ * Implements `ControlValueAccessor`. Optional `autosize` grows the
+ * textarea with its content, capped at `maxRows` if provided.
+ *
+ * @example
+ * ```html
+ * <wr-textarea placeholder="Notes" [(ngModel)]="text" />
+ * <wr-textarea autosize [maxRows]="6" [(ngModel)]="text" />
+ * ```
+ *
+ * @see https://ngwr.dev/components/textarea
+ */
+declare class WrTextarea implements ControlValueAccessor {
+    /** Native placeholder text. @default '' */
+    readonly placeholder: _angular_core.InputSignal<string>;
+    /** Visible row count. @default 3 */
+    readonly rows: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Allow user resize via the native handle. @default true */
+    readonly resizable: _angular_core.InputSignalWithTransform<boolean, any>;
+    /** Read-only state. @default false */
+    readonly readonly: _angular_core.InputSignalWithTransform<boolean, any>;
+    /** Grow the textarea to fit its content. @default false */
+    readonly autosize: _angular_core.InputSignalWithTransform<boolean, any>;
+    /** Cap autosize at this many rows. Ignored when `autosize` is false. */
+    readonly maxRows: _angular_core.InputSignal<number | null>;
+    /**
+     * Disable the textarea. Also set by Angular forms via `setDisabledState`.
+     *
+     * @default false
+     */
+    readonly disabled: _angular_core.InputSignalWithTransform<boolean, any>;
+    protected readonly value: _angular_core.WritableSignal<string>;
+    protected readonly disabledFromCva: _angular_core.WritableSignal<boolean>;
+    protected readonly focused: _angular_core.WritableSignal<boolean>;
+    protected readonly effectiveDisabled: _angular_core.Signal<boolean>;
+    protected readonly native: _angular_core.Signal<ElementRef<HTMLTextAreaElement>>;
+    protected readonly classes: _angular_core.Signal<string>;
+    private readonly platformId;
+    private readonly isBrowser;
+    private onChange;
+    private onTouched;
+    constructor();
+    writeValue(value: string | null): void;
+    registerOnChange(fn: (value: string) => void): void;
+    registerOnTouched(fn: () => void): void;
+    setDisabledState(isDisabled: boolean): void;
+    protected onInput(event: Event): void;
+    protected onBlur(): void;
+    private resize;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTextarea, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTextarea, "wr-textarea", never, { "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "resizable": { "alias": "resizable"; "required": false; "isSignal": true; }; "readonly": { "alias": "readonly"; "required": false; "isSignal": true; }; "autosize": { "alias": "autosize"; "required": false; "isSignal": true; }; "maxRows": { "alias": "maxRows"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+export { WrTextarea };

package/types/ngwr-theme.d.ts

@@ -0,0 +1,124 @@
+import * as i0 from '@angular/core';
+import { InjectionToken, Signal, EnvironmentProviders } from '@angular/core';
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+/**
+ * Built-in color variants available to NGWR components.
+ *
+ * Kept in sync manually with the SCSS `$base-colors` map in
+ * `theme/styles/_colors.scss`. Both sources must stay aligned —
+ * adding a color requires updating both this array and the SCSS map.
+ *
+ * @example
+ * ```ts
+ * import { WR_COLORS } from 'ngwr/theme';
+ *
+ * // Iterate all colors for demos or documentation
+ * WR_COLORS.forEach(color => console.log(color));
+ * ```
+ */
+declare const WR_COLORS: readonly ["primary", "secondary", "success", "warning", "danger", "light", "medium", "dark"];
+/**
+ * A color variant name.
+ *
+ * Use as an input type on components that accept a color:
+ *
+ * @example
+ * ```ts
+ * import type { WrColor } from 'ngwr/theme';
+ *
+ * @Component({...})
+ * export class MyComponent {
+ *   readonly color = input<WrColor>('primary');
+ * }
+ * ```
+ */
+type WrColor = (typeof WR_COLORS)[number];
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/** Mode the user explicitly selected. `auto` follows `prefers-color-scheme`. */
+type WrThemeMode = 'light' | 'dark' | 'auto';
+/** Resolved theme — what's actually applied to the DOM. */
+type WrResolvedTheme = 'light' | 'dark';
+/** Configuration for {@link WrTheme}. */
+interface WrThemeConfig {
+    /** Initial mode used when no persisted value is present. @default 'auto' */
+    readonly defaultMode: WrThemeMode;
+    /** localStorage key for persistence. Set to `null` to disable persistence. @default 'wr-theme' */
+    readonly storageKey: string | null;
+    /** Attribute applied to `<html>` to expose the resolved theme. @default 'data-theme' */
+    readonly attribute: string;
+}
+declare const DEFAULT_WR_THEME_CONFIG: WrThemeConfig;
+declare const WR_THEME_CONFIG: InjectionToken<WrThemeConfig>;
+
+/**
+ * Light / dark theme manager.
+ *
+ * - `mode` is what the user picked (`light` | `dark` | `auto`).
+ * - `resolved` is what's actually applied — `auto` resolves through
+ *   {@link WrPlatform.prefersDark}.
+ * - Writes `[data-theme]` (or your configured attribute) on `<html>`.
+ * - Persists the selected mode via {@link WrStorage} (defaults to
+ *   `localStorage`; swap the storage engine globally to change where).
+ *
+ * @example
+ * ```ts
+ * const theme = inject(WrTheme);
+ * theme.set('dark');
+ * theme.toggle();
+ * theme.resolved();  // 'dark'
+ * ```
+ *
+ * @see https://ngwr.dev/services/theme
+ */
+declare class WrTheme {
+    private readonly doc;
+    private readonly platform;
+    private readonly storage;
+    private readonly config;
+    /** User-selected mode. */
+    readonly mode: i0.WritableSignal<WrThemeMode>;
+    /** Resolved theme actually applied to the DOM. */
+    readonly resolved: Signal<WrResolvedTheme>;
+    constructor();
+    /** Switch to a specific mode. */
+    set(mode: WrThemeMode): void;
+    /** Cycle: light → dark → light (skips auto). */
+    toggle(): void;
+    private readPersisted;
+    private persist;
+    static ɵfac: i0.ɵɵFactoryDeclaration<WrTheme, never>;
+    static ɵprov: i0.ɵɵInjectableDeclaration<WrTheme>;
+}
+
+/**
+ * @license
+ *
+ * Use of this source code is governed by an MIT-style license that can be
+ * found in the LICENSE file at https://github.com/thekhegay/ngwr/blob/main/LICENSE
+ */
+
+/**
+ * Configure {@link WrTheme}. Partial — merged with defaults.
+ *
+ * @example
+ * ```ts
+ * provideWrTheme({ defaultMode: 'dark', storageKey: 'my-app-theme' })
+ * ```
+ */
+declare function provideWrTheme(config?: Partial<WrThemeConfig>): EnvironmentProviders;
+
+export { DEFAULT_WR_THEME_CONFIG, WR_COLORS, WR_THEME_CONFIG, WrTheme, provideWrTheme };
+export type { WrColor, WrResolvedTheme, WrThemeConfig, WrThemeMode };

package/types/ngwr-tilt-card.d.ts

@@ -0,0 +1,63 @@
+import * as _angular_core from '@angular/core';
+
+/**
+ * 3D mouse-tilt on hover. Adds `perspective(…) rotateX(…) rotateY(…)` to
+ * the host's transform tracking the cursor's position over it.
+ *
+ * @example
+ * ```html
+ * <div class="card" wrTilt>…</div>
+ * <div class="card" wrTilt maxTilt="20" [glare]="true">…</div>
+ * ```
+ */
+declare class WrTilt {
+    /** Maximum tilt in degrees. @default 12 */
+    readonly maxTilt: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** CSS perspective in pixels. @default 800 */
+    readonly perspective: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Scale applied while hovered. @default 1.03 */
+    readonly scale: _angular_core.InputSignalWithTransform<number, unknown>;
+    /** Add a moving glare highlight overlay. @default false */
+    readonly glare: _angular_core.InputSignalWithTransform<boolean, any>;
+    private readonly el;
+    private readonly zone;
+    private readonly destroyRef;
+    private readonly platform;
+    constructor();
+    /** @internal */
+    protected onMove(event: PointerEvent): void;
+    /** @internal */
+    protected onLeave(): void;
+    private installGlare;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTilt, never>;
+    static ɵdir: _angular_core.ɵɵDirectiveDeclaration<WrTilt, "[wrTilt]", never, { "maxTilt": { "alias": "maxTilt"; "required": false; "isSignal": true; }; "perspective": { "alias": "perspective"; "required": false; "isSignal": true; }; "scale": { "alias": "scale"; "required": false; "isSignal": true; }; "glare": { "alias": "glare"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
+}
+
+/**
+ * Card wrapper that applies the `[wrTilt]` directive out-of-the-box,
+ * plus a small set of card-style defaults (radius, padding, surface).
+ * Pass any inputs through — they're forwarded to the hosted directive.
+ *
+ * For arbitrary elements that just need the tilt behaviour, use the
+ * `[wrTilt]` directive directly:
+ *
+ * ```html
+ * <img wrTilt [maxTilt]="10" src="…" />
+ * ```
+ *
+ * @example
+ * ```html
+ * <wr-tilt-card>
+ *   <h3>Hello</h3>
+ *   <p>Move the cursor across me.</p>
+ * </wr-tilt-card>
+ *
+ * <wr-tilt-card [maxTilt]="20" [glare]="true">…</wr-tilt-card>
+ * ```
+ */
+declare class WrTiltCard {
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTiltCard, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTiltCard, "wr-tilt-card", never, {}, {}, never, ["*"], true, [{ directive: typeof WrTilt; inputs: { "maxTilt": "maxTilt"; "perspective": "perspective"; "scale": "scale"; "glare": "glare"; }; outputs: {}; }]>;
+}
+
+export { WrTilt, WrTiltCard };

package/types/ngwr-timeline.d.ts

@@ -0,0 +1,40 @@
+import * as _angular_core from '@angular/core';
+
+/**
+ * Event-list ladder. Project `<wr-timeline-item>` children.
+ *
+ * @example
+ * ```html
+ * <wr-timeline>
+ *   <wr-timeline-item title="Created" time="2026-05-01">Initial commit.</wr-timeline-item>
+ *   <wr-timeline-item title="Deployed" time="2026-05-02" color="success">Live.</wr-timeline-item>
+ * </wr-timeline>
+ * ```
+ *
+ * @see https://ngwr.dev/components/timeline
+ */
+declare class WrTimeline {
+    readonly orientation: _angular_core.InputSignal<"vertical" | "horizontal">;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTimeline, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTimeline, "wr-timeline", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+/** Built-in dot colours. */
+type WrTimelineColor = 'primary' | 'success' | 'warning' | 'danger' | 'medium';
+
+/**
+ * One event in a {@link WrTimeline}. Project content for the
+ * description; `title` and `time` are header inputs.
+ */
+declare class WrTimelineItem {
+    readonly title: _angular_core.InputSignal<string>;
+    readonly time: _angular_core.InputSignal<string>;
+    readonly color: _angular_core.InputSignal<WrTimelineColor>;
+    protected readonly classes: _angular_core.Signal<string>;
+    static ɵfac: _angular_core.ɵɵFactoryDeclaration<WrTimelineItem, never>;
+    static ɵcmp: _angular_core.ɵɵComponentDeclaration<WrTimelineItem, "wr-timeline-item", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "time": { "alias": "time"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
+}
+
+export { WrTimeline, WrTimelineItem };
+export type { WrTimelineColor };