@ng-solid/design-system 22.2.1 → 22.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import { DateValue, DayOfWeek } from '@internationalized/date';
|
|
2
2
|
import * as _angular_core from '@angular/core';
|
|
3
|
-
import { ElementRef,
|
|
3
|
+
import { ElementRef, AfterViewInit, OnDestroy, TemplateRef, OnInit, Type, Signal, ComponentRef, OnChanges, SimpleChanges, InjectionToken, EnvironmentProviders } from '@angular/core';
|
|
4
4
|
import { FormGroup, ControlValueAccessor } from '@angular/forms';
|
|
5
5
|
import { NsFile } from '@ng-solid/core';
|
|
6
6
|
import { Subject } from 'rxjs';
|
|
@@ -74,6 +74,28 @@ declare class NsAvatarComponent {
|
|
|
74
74
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsAvatarComponent, "ns-avatar", never, { "src": { "alias": "src"; "required": false; "isSignal": true; }; "alt": { "alias": "alt"; "required": false; "isSignal": true; }; "initials": { "alias": "initials"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "shape": { "alias": "shape"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
75
75
|
}
|
|
76
76
|
|
|
77
|
+
/**
|
|
78
|
+
* Stacks projected `ns-avatar` instances with a configurable overlap and
|
|
79
|
+
* collapses the overflow into a "+N" counter. Overlap and visibility are
|
|
80
|
+
* applied imperatively to each projected avatar's native element (read via
|
|
81
|
+
* `contentChildren(..., { read: ElementRef })`) rather than through
|
|
82
|
+
* `::ng-deep`, since the overlap is a per-instance numeric input, not a
|
|
83
|
+
* design token.
|
|
84
|
+
*/
|
|
85
|
+
declare class NsAvatarGroupComponent {
|
|
86
|
+
readonly overlap: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
87
|
+
readonly max: _angular_core.InputSignal<number>;
|
|
88
|
+
readonly total: _angular_core.InputSignal<number>;
|
|
89
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
90
|
+
private readonly avatars;
|
|
91
|
+
readonly visibleCount: _angular_core.Signal<number>;
|
|
92
|
+
readonly overflowCount: _angular_core.Signal<number>;
|
|
93
|
+
constructor();
|
|
94
|
+
private syncAvatars;
|
|
95
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsAvatarGroupComponent, never>;
|
|
96
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsAvatarGroupComponent, "ns-avatar-group", never, { "overlap": { "alias": "overlap"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "total": { "alias": "total"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, ["avatars"], ["*"], true, never>;
|
|
97
|
+
}
|
|
98
|
+
|
|
77
99
|
type NsBadgeMode = 'count' | 'dot';
|
|
78
100
|
declare class NsBadgeComponent {
|
|
79
101
|
readonly count: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
@@ -112,15 +134,38 @@ declare class NsButtonComponent {
|
|
|
112
134
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
113
135
|
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
114
136
|
readonly selected: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
137
|
+
/**
|
|
138
|
+
* Roving-tabindex participation, managed by a hosting `ns-button-group`.
|
|
139
|
+
* `true` (the default) leaves the button's native tabbing behavior alone;
|
|
140
|
+
* a group sets it to `false` on every button except the current roving
|
|
141
|
+
* stop.
|
|
142
|
+
*/
|
|
143
|
+
readonly active: _angular_core.WritableSignal<boolean>;
|
|
144
|
+
/**
|
|
145
|
+
* Radio semantics, managed by a hosting `ns-button-group` in
|
|
146
|
+
* `selectionMode="single"`. Swaps `aria-pressed` for `role="radio"` +
|
|
147
|
+
* `aria-checked`.
|
|
148
|
+
*/
|
|
149
|
+
readonly checkable: _angular_core.WritableSignal<boolean>;
|
|
150
|
+
private readonly control;
|
|
151
|
+
focus(): void;
|
|
115
152
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsButtonComponent, never>;
|
|
116
153
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsButtonComponent, "ns-button", never, { "type": { "alias": "type"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "iconOnly": { "alias": "iconOnly"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "block": { "alias": "block"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
117
154
|
}
|
|
118
155
|
|
|
156
|
+
type NsButtonGroupSelectionMode = 'single' | 'multiple';
|
|
119
157
|
declare class NsButtonGroupComponent {
|
|
120
158
|
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
121
159
|
readonly orientation: _angular_core.InputSignal<NsOrientation>;
|
|
160
|
+
readonly selectionMode: _angular_core.InputSignal<NsButtonGroupSelectionMode>;
|
|
161
|
+
readonly buttons: _angular_core.Signal<readonly NsButtonComponent[]>;
|
|
162
|
+
private activeIndex;
|
|
163
|
+
constructor();
|
|
164
|
+
onKeydown(event: KeyboardEvent): void;
|
|
165
|
+
private focus;
|
|
166
|
+
private syncState;
|
|
122
167
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsButtonGroupComponent, never>;
|
|
123
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsButtonGroupComponent, "ns-button-group", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {},
|
|
168
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsButtonGroupComponent, "ns-button-group", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "selectionMode": { "alias": "selectionMode"; "required": false; "isSignal": true; }; }, {}, ["buttons"], ["*"], true, never>;
|
|
124
169
|
}
|
|
125
170
|
|
|
126
171
|
declare class NsCardComponent {
|
|
@@ -142,15 +187,29 @@ declare class NsCardFooterComponent {
|
|
|
142
187
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsCardFooterComponent, "ns-card-footer", never, {}, {}, never, ["*"], true, never>;
|
|
143
188
|
}
|
|
144
189
|
|
|
190
|
+
/**
|
|
191
|
+
* Chip-local color union. `info` and `selected` are compact filter/status
|
|
192
|
+
* treatments specific to `ns-chip` and are intentionally not added to the
|
|
193
|
+
* shared `NsColor` union, which many other components reuse.
|
|
194
|
+
*/
|
|
195
|
+
type NsChipColor = NsColor | 'info' | 'selected';
|
|
196
|
+
/**
|
|
197
|
+
* Chip-local variant union. `tint` is a filter/selection treatment (filled
|
|
198
|
+
* background, 1px border and text in the same status color) specific to
|
|
199
|
+
* `ns-chip` and intentionally not added to the shared `NsVariant` union.
|
|
200
|
+
*/
|
|
201
|
+
type NsChipVariant = Exclude<NsVariant, 'ghost'> | 'tint';
|
|
202
|
+
type NsChipSize = 'md' | 'pill';
|
|
145
203
|
declare class NsChipComponent {
|
|
146
|
-
readonly color: _angular_core.InputSignal<
|
|
147
|
-
readonly variant: _angular_core.InputSignal<
|
|
204
|
+
readonly color: _angular_core.InputSignal<NsChipColor>;
|
|
205
|
+
readonly variant: _angular_core.InputSignal<NsChipVariant>;
|
|
206
|
+
readonly size: _angular_core.InputSignal<NsChipSize>;
|
|
148
207
|
readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
149
208
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
150
209
|
readonly dismissLabel: _angular_core.InputSignal<string>;
|
|
151
210
|
readonly removed: _angular_core.OutputEmitterRef<void>;
|
|
152
211
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsChipComponent, never>;
|
|
153
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsChipComponent, "ns-chip", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dismissLabel": { "alias": "dismissLabel"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["*"], true, never>;
|
|
212
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsChipComponent, "ns-chip", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "dismissLabel": { "alias": "dismissLabel"; "required": false; "isSignal": true; }; }, { "removed": "removed"; }, never, ["*"], true, never>;
|
|
154
213
|
}
|
|
155
214
|
|
|
156
215
|
declare class NsCollectionController<T = unknown, TKey extends NsKey = NsKey> {
|
|
@@ -168,62 +227,6 @@ declare class NsCollectionController<T = unknown, TKey extends NsKey = NsKey> {
|
|
|
168
227
|
clear(): void;
|
|
169
228
|
}
|
|
170
229
|
|
|
171
|
-
interface NsComment {
|
|
172
|
-
id?: number;
|
|
173
|
-
cover: {
|
|
174
|
-
url: string;
|
|
175
|
-
alt?: string;
|
|
176
|
-
};
|
|
177
|
-
message: string;
|
|
178
|
-
created?: string;
|
|
179
|
-
author: {
|
|
180
|
-
name: string;
|
|
181
|
-
link?: string;
|
|
182
|
-
};
|
|
183
|
-
}
|
|
184
|
-
|
|
185
|
-
declare class NsCommentComponent implements OnInit {
|
|
186
|
-
readonly title: _angular_core.InputSignal<string>;
|
|
187
|
-
readonly description: _angular_core.InputSignal<string>;
|
|
188
|
-
readonly placeholder: _angular_core.InputSignal<string>;
|
|
189
|
-
readonly messages: _angular_core.InputSignal<NsComment[]>;
|
|
190
|
-
readonly cover: _angular_core.InputSignal<{
|
|
191
|
-
url: string;
|
|
192
|
-
alt?: string;
|
|
193
|
-
}>;
|
|
194
|
-
readonly submitText: _angular_core.InputSignal<string>;
|
|
195
|
-
readonly logged: _angular_core.InputSignal<boolean>;
|
|
196
|
-
readonly maxLength: _angular_core.InputSignal<number>;
|
|
197
|
-
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
198
|
-
readonly commit: _angular_core.OutputEmitterRef<string>;
|
|
199
|
-
invalid: boolean;
|
|
200
|
-
content: string;
|
|
201
|
-
private clearEmptyValues;
|
|
202
|
-
constructor();
|
|
203
|
-
ngOnInit(): void;
|
|
204
|
-
publish(): void;
|
|
205
|
-
get counter(): number;
|
|
206
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsCommentComponent, never>;
|
|
207
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsCommentComponent, "ns-comment", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "cover": { "alias": "cover"; "required": false; "isSignal": true; }; "submitText": { "alias": "submitText"; "required": false; "isSignal": true; }; "logged": { "alias": "logged"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "commit": "commit"; }, never, ["*"], true, never>;
|
|
208
|
-
}
|
|
209
|
-
|
|
210
|
-
declare class NsDescriptionComponent {
|
|
211
|
-
private readonly ariaIds;
|
|
212
|
-
private readonly field;
|
|
213
|
-
private readonly destroyRef;
|
|
214
|
-
readonly id: _angular_core.InputSignal<string>;
|
|
215
|
-
readonly live: _angular_core.InputSignal<"off" | "polite" | "assertive">;
|
|
216
|
-
constructor();
|
|
217
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsDescriptionComponent, never>;
|
|
218
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsDescriptionComponent, "ns-description", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
219
|
-
}
|
|
220
|
-
|
|
221
|
-
declare class NsDividerComponent {
|
|
222
|
-
readonly orientation: _angular_core.InputSignal<NsOrientation>;
|
|
223
|
-
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsDividerComponent, never>;
|
|
224
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsDividerComponent, "ns-divider", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
225
|
-
}
|
|
226
|
-
|
|
227
230
|
type NsOverlayCloseReason = 'dismiss' | 'escape' | 'programmatic';
|
|
228
231
|
interface NsOverlayConfig {
|
|
229
232
|
origin?: HTMLElement;
|
|
@@ -304,6 +307,145 @@ declare class NsOverlayService {
|
|
|
304
307
|
}
|
|
305
308
|
declare function getNsOverlayPosition(origin: DOMRect, overlay: DOMRect, placement: NsPlacement, offset: number, viewportWidth: number, viewportHeight: number): NsOverlayPosition;
|
|
306
309
|
|
|
310
|
+
interface NsCommandItem {
|
|
311
|
+
id: string;
|
|
312
|
+
label: string;
|
|
313
|
+
meta?: string;
|
|
314
|
+
/**
|
|
315
|
+
* Key the consumer's `itemIconTemplate` can switch on (e.g. an icon name) —
|
|
316
|
+
* `ns-command-palette` never renders this value as text.
|
|
317
|
+
*/
|
|
318
|
+
icon?: string;
|
|
319
|
+
avatarText?: string;
|
|
320
|
+
kind?: string;
|
|
321
|
+
disabled?: boolean;
|
|
322
|
+
}
|
|
323
|
+
interface NsCommandGroup {
|
|
324
|
+
id: string;
|
|
325
|
+
label: string;
|
|
326
|
+
items: readonly NsCommandItem[];
|
|
327
|
+
}
|
|
328
|
+
|
|
329
|
+
/**
|
|
330
|
+
* Centered command palette (⌘K-style) built on `NsOverlayService` for its
|
|
331
|
+
* focus trap, escape dismissal, scroll lock and inert background — the same
|
|
332
|
+
* mechanism `ns-menu` and `ns-popover` use, minus anchor-relative placement
|
|
333
|
+
* since this overlay is always centered in the viewport. It has no
|
|
334
|
+
* dedicated open/close service: like `ns-menu` and `ns-popover`, it exposes
|
|
335
|
+
* an `open` model that the host application binds to (for example from a
|
|
336
|
+
* global keyboard shortcut), so a single declared instance can be toggled
|
|
337
|
+
* from anywhere without an extra imperative API to keep in sync.
|
|
338
|
+
*
|
|
339
|
+
* `query` is a debounced model: the input reflects every keystroke
|
|
340
|
+
* immediately, but `query` (and therefore `queryChange`) only updates after
|
|
341
|
+
* `debounceMs` of inactivity, so consumers filtering `groups` server-side
|
|
342
|
+
* are not flooded on every keystroke.
|
|
343
|
+
*
|
|
344
|
+
* `NsCommandItem.icon` is a plain string key, not markup — pair it with
|
|
345
|
+
* `itemIconTemplate` (an `<ng-template let-item>`, rendered through
|
|
346
|
+
* `ngTemplateOutlet` with `$implicit` bound to the item) to project an icon
|
|
347
|
+
* component per item. Falls back to the `avatarText` initials badge, then to
|
|
348
|
+
* a reserved-width placeholder so labels stay aligned when neither is set.
|
|
349
|
+
*/
|
|
350
|
+
declare class NsCommandPaletteComponent implements AfterViewInit, OnDestroy {
|
|
351
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
352
|
+
readonly query: _angular_core.ModelSignal<string>;
|
|
353
|
+
readonly placeholder: _angular_core.InputSignal<string>;
|
|
354
|
+
readonly debounceMs: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
355
|
+
readonly groups: _angular_core.InputSignal<readonly NsCommandGroup[]>;
|
|
356
|
+
readonly itemIconTemplate: _angular_core.InputSignal<TemplateRef<{
|
|
357
|
+
$implicit: NsCommandItem;
|
|
358
|
+
}>>;
|
|
359
|
+
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
360
|
+
readonly emptyTitle: _angular_core.InputSignal<string>;
|
|
361
|
+
readonly emptyDescription: _angular_core.InputSignal<string>;
|
|
362
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
363
|
+
readonly activated: _angular_core.OutputEmitterRef<NsCommandItem>;
|
|
364
|
+
readonly closed: _angular_core.OutputEmitterRef<NsOverlayCloseReason>;
|
|
365
|
+
protected readonly draft: _angular_core.WritableSignal<string>;
|
|
366
|
+
protected readonly activeId: _angular_core.WritableSignal<string>;
|
|
367
|
+
protected readonly listboxId: string;
|
|
368
|
+
private readonly idPrefix;
|
|
369
|
+
private readonly element;
|
|
370
|
+
private readonly overlay;
|
|
371
|
+
private readonly destroyRef;
|
|
372
|
+
private overlayRef?;
|
|
373
|
+
private viewInitialized;
|
|
374
|
+
private debounceTimer?;
|
|
375
|
+
constructor();
|
|
376
|
+
ngAfterViewInit(): void;
|
|
377
|
+
ngOnDestroy(): void;
|
|
378
|
+
close(): void;
|
|
379
|
+
protected flatItems(): NsCommandItem[];
|
|
380
|
+
protected itemDomId(item: NsCommandItem): string;
|
|
381
|
+
protected activeDomId(): string | undefined;
|
|
382
|
+
protected setActive(item: NsCommandItem): void;
|
|
383
|
+
protected activateItem(item: NsCommandItem): void;
|
|
384
|
+
protected onQueryInput(event: Event): void;
|
|
385
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
386
|
+
private scrollActiveIntoView;
|
|
387
|
+
private syncActiveItem;
|
|
388
|
+
private openOverlay;
|
|
389
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsCommandPaletteComponent, never>;
|
|
390
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsCommandPaletteComponent, "ns-command-palette", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "query": { "alias": "query"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "debounceMs": { "alias": "debounceMs"; "required": false; "isSignal": true; }; "groups": { "alias": "groups"; "required": false; "isSignal": true; }; "itemIconTemplate": { "alias": "itemIconTemplate"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "emptyTitle": { "alias": "emptyTitle"; "required": false; "isSignal": true; }; "emptyDescription": { "alias": "emptyDescription"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "query": "queryChange"; "activated": "activated"; "closed": "closed"; }, never, ["[command-palette-icon]", "[command-palette-footer]"], true, never>;
|
|
391
|
+
}
|
|
392
|
+
|
|
393
|
+
interface NsComment {
|
|
394
|
+
id?: number;
|
|
395
|
+
cover: {
|
|
396
|
+
url: string;
|
|
397
|
+
alt?: string;
|
|
398
|
+
};
|
|
399
|
+
message: string;
|
|
400
|
+
created?: string;
|
|
401
|
+
author: {
|
|
402
|
+
name: string;
|
|
403
|
+
link?: string;
|
|
404
|
+
};
|
|
405
|
+
}
|
|
406
|
+
|
|
407
|
+
declare class NsCommentComponent implements OnInit {
|
|
408
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
409
|
+
readonly description: _angular_core.InputSignal<string>;
|
|
410
|
+
readonly placeholder: _angular_core.InputSignal<string>;
|
|
411
|
+
readonly messages: _angular_core.InputSignal<NsComment[]>;
|
|
412
|
+
readonly cover: _angular_core.InputSignal<{
|
|
413
|
+
url: string;
|
|
414
|
+
alt?: string;
|
|
415
|
+
}>;
|
|
416
|
+
readonly submitText: _angular_core.InputSignal<string>;
|
|
417
|
+
readonly logged: _angular_core.InputSignal<boolean>;
|
|
418
|
+
readonly maxLength: _angular_core.InputSignal<number>;
|
|
419
|
+
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
420
|
+
readonly commit: _angular_core.OutputEmitterRef<string>;
|
|
421
|
+
invalid: boolean;
|
|
422
|
+
content: string;
|
|
423
|
+
private clearEmptyValues;
|
|
424
|
+
constructor();
|
|
425
|
+
ngOnInit(): void;
|
|
426
|
+
publish(): void;
|
|
427
|
+
get counter(): number;
|
|
428
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsCommentComponent, never>;
|
|
429
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsCommentComponent, "ns-comment", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "messages": { "alias": "messages"; "required": false; "isSignal": true; }; "cover": { "alias": "cover"; "required": false; "isSignal": true; }; "submitText": { "alias": "submitText"; "required": false; "isSignal": true; }; "logged": { "alias": "logged"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "commit": "commit"; }, never, ["*"], true, never>;
|
|
430
|
+
}
|
|
431
|
+
|
|
432
|
+
declare class NsDescriptionComponent {
|
|
433
|
+
private readonly ariaIds;
|
|
434
|
+
private readonly field;
|
|
435
|
+
private readonly destroyRef;
|
|
436
|
+
readonly id: _angular_core.InputSignal<string>;
|
|
437
|
+
readonly live: _angular_core.InputSignal<"off" | "polite" | "assertive">;
|
|
438
|
+
constructor();
|
|
439
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsDescriptionComponent, never>;
|
|
440
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsDescriptionComponent, "ns-description", never, { "id": { "alias": "id"; "required": false; "isSignal": true; }; "live": { "alias": "live"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
441
|
+
}
|
|
442
|
+
|
|
443
|
+
declare class NsDividerComponent {
|
|
444
|
+
readonly orientation: _angular_core.InputSignal<NsOrientation>;
|
|
445
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsDividerComponent, never>;
|
|
446
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsDividerComponent, "ns-divider", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
447
|
+
}
|
|
448
|
+
|
|
307
449
|
type NsDrawerPosition = 'start' | 'end';
|
|
308
450
|
interface NsDrawerOptions {
|
|
309
451
|
title?: string;
|
|
@@ -656,8 +798,10 @@ declare class NsDropdownComponent extends NsValueAccessor<NsDropdownValue> {
|
|
|
656
798
|
}
|
|
657
799
|
|
|
658
800
|
declare class NsInputComponent extends NsValueAccessor<string> {
|
|
801
|
+
/** Leading icon name (`@ng-solid/icons`). Omit for the default, icon-less field. */
|
|
802
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
659
803
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsInputComponent, never>;
|
|
660
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsInputComponent, "ns-input", never, {}, {}, never, never, true, never>;
|
|
804
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsInputComponent, "ns-input", never, { "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
661
805
|
}
|
|
662
806
|
|
|
663
807
|
declare class NsInputCodeComponent extends NsValueAccessor<string> {
|
|
@@ -703,22 +847,44 @@ declare class NsInputSearchComponent extends NsValueAccessor<string> {
|
|
|
703
847
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsInputSearchComponent, "ns-input-search", never, {}, {}, never, never, true, never>;
|
|
704
848
|
}
|
|
705
849
|
|
|
850
|
+
declare class NsRadioGroupContext {
|
|
851
|
+
readonly value: _angular_core.WritableSignal<string>;
|
|
852
|
+
readonly disabled: _angular_core.WritableSignal<boolean>;
|
|
853
|
+
select: (value: string) => void;
|
|
854
|
+
onTouched: () => void;
|
|
855
|
+
}
|
|
856
|
+
|
|
857
|
+
/**
|
|
858
|
+
* Selectable card for rich radio options (icon, label and description)
|
|
859
|
+
* inside an `ns-radio-group`. It reuses `NsRadioGroupContext` and a native
|
|
860
|
+
* `<input type="radio">`, the same mechanism `ns-radio` relies on, so
|
|
861
|
+
* `role="radio"`, `aria-checked` and keyboard behavior (native radio-group
|
|
862
|
+
* navigation when a shared `name` is provided) come from the browser instead
|
|
863
|
+
* of a hand-rolled ARIA widget.
|
|
864
|
+
*/
|
|
865
|
+
declare class NsOptionCardComponent {
|
|
866
|
+
private readonly ids;
|
|
867
|
+
readonly group: NsRadioGroupContext;
|
|
868
|
+
readonly id: string;
|
|
869
|
+
readonly value: _angular_core.InputSignal<string>;
|
|
870
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
871
|
+
readonly description: _angular_core.InputSignal<string>;
|
|
872
|
+
readonly name: _angular_core.InputSignal<string>;
|
|
873
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
874
|
+
select(): void;
|
|
875
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsOptionCardComponent, never>;
|
|
876
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsOptionCardComponent, "ns-option-card", never, { "value": { "alias": "value"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["[option-card-icon]"], true, never>;
|
|
877
|
+
}
|
|
878
|
+
|
|
706
879
|
declare class NsPasswordComponent extends NsValueAccessor implements OnInit {
|
|
707
880
|
readonly forgotLink: _angular_core.InputSignal<string>;
|
|
708
|
-
readonly
|
|
881
|
+
readonly forgotLinkLabel: _angular_core.InputSignal<string>;
|
|
709
882
|
show: boolean;
|
|
710
883
|
constructor();
|
|
711
884
|
ngOnInit(): void;
|
|
712
885
|
toggle(): void;
|
|
713
886
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsPasswordComponent, never>;
|
|
714
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsPasswordComponent, "ns-password", never, { "forgotLink": { "alias": "forgotLink"; "required": false; "isSignal": true; }; "
|
|
715
|
-
}
|
|
716
|
-
|
|
717
|
-
declare class NsRadioGroupContext {
|
|
718
|
-
readonly value: _angular_core.WritableSignal<string>;
|
|
719
|
-
readonly disabled: _angular_core.WritableSignal<boolean>;
|
|
720
|
-
select: (value: string) => void;
|
|
721
|
-
onTouched: () => void;
|
|
887
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsPasswordComponent, "ns-password", never, { "forgotLink": { "alias": "forgotLink"; "required": false; "isSignal": true; }; "forgotLinkLabel": { "alias": "forgotLinkLabel"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
722
888
|
}
|
|
723
889
|
|
|
724
890
|
declare class NsRadioComponent {
|
|
@@ -769,9 +935,13 @@ declare class NsSliderComponent extends NsValueAccessor<NsSliderValue> {
|
|
|
769
935
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSliderComponent, "ns-slider", never, { "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "range": { "alias": "range"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
770
936
|
}
|
|
771
937
|
|
|
938
|
+
type NsSwitchLayout = 'inline' | 'row';
|
|
939
|
+
type NsSwitchSize = 'sm' | 'md';
|
|
772
940
|
declare class NsSwitchComponent extends NsValueAccessor<boolean> {
|
|
941
|
+
readonly layout: _angular_core.InputSignal<NsSwitchLayout>;
|
|
942
|
+
readonly size: _angular_core.InputSignal<NsSwitchSize>;
|
|
773
943
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsSwitchComponent, never>;
|
|
774
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSwitchComponent, "ns-switch", never, {}, {}, never, never, true, never>;
|
|
944
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSwitchComponent, "ns-switch", never, { "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
775
945
|
}
|
|
776
946
|
|
|
777
947
|
declare class NsTextAreaComponent extends NsValueAccessor<string> {
|
|
@@ -827,6 +997,15 @@ declare class NsEditorComponent extends NsValueAccessor<string> implements OnIni
|
|
|
827
997
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsEditorComponent, "ns-editor", never, { "rows": { "alias": "rows"; "required": false; "isSignal": true; }; "maxLength": { "alias": "maxLength"; "required": false; "isSignal": true; }; "colorPresets": { "alias": "colorPresets"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
828
998
|
}
|
|
829
999
|
|
|
1000
|
+
type NsEmptyStateSize = 'sm' | 'md';
|
|
1001
|
+
declare class NsEmptyStateComponent {
|
|
1002
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
1003
|
+
readonly description: _angular_core.InputSignal<string>;
|
|
1004
|
+
readonly size: _angular_core.InputSignal<NsEmptyStateSize>;
|
|
1005
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsEmptyStateComponent, never>;
|
|
1006
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsEmptyStateComponent, "ns-empty-state", never, { "title": { "alias": "title"; "required": true; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, ["[empty-state-icon]", "[empty-state-actions]"], true, never>;
|
|
1007
|
+
}
|
|
1008
|
+
|
|
830
1009
|
declare class NsImageUploadComponent extends NsValueAccessor<NsFile | NsFile[] | null> {
|
|
831
1010
|
private client;
|
|
832
1011
|
private renderer;
|
|
@@ -865,6 +1044,68 @@ declare class NsLinkComponent {
|
|
|
865
1044
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsLinkComponent, "ns-link", never, { "href": { "alias": "href"; "required": false; "isSignal": true; }; "target": { "alias": "target"; "required": false; "isSignal": true; }; "rel": { "alias": "rel"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
866
1045
|
}
|
|
867
1046
|
|
|
1047
|
+
declare class NsMenuItemComponent {
|
|
1048
|
+
private readonly element;
|
|
1049
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1050
|
+
readonly color: _angular_core.InputSignal<NsColor>;
|
|
1051
|
+
readonly activated: _angular_core.OutputEmitterRef<void>;
|
|
1052
|
+
/** Roving-tabindex state, driven by the parent `ns-menu`. */
|
|
1053
|
+
readonly active: _angular_core.WritableSignal<boolean>;
|
|
1054
|
+
activate(): void;
|
|
1055
|
+
onSpace(event: Event): void;
|
|
1056
|
+
focus(): void;
|
|
1057
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsMenuItemComponent, never>;
|
|
1058
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsMenuItemComponent, "ns-menu-item", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; }, { "activated": "activated"; }, never, ["[menu-item-icon]", "*"], true, never>;
|
|
1059
|
+
}
|
|
1060
|
+
|
|
1061
|
+
/**
|
|
1062
|
+
* Action menu anchored to an origin element, built on `NsOverlayService`
|
|
1063
|
+
* (the same placement/dismiss/focus-trap mechanism as `ns-popover`). Items
|
|
1064
|
+
* are plain projected content (`ns-menu-item`, optionally grouped inside
|
|
1065
|
+
* `ns-menu-section`), so the menu drives a roving tabindex across them and
|
|
1066
|
+
* closes itself once one is activated.
|
|
1067
|
+
*/
|
|
1068
|
+
declare class NsMenuComponent implements AfterViewInit, OnDestroy {
|
|
1069
|
+
readonly open: _angular_core.ModelSignal<boolean>;
|
|
1070
|
+
readonly origin: _angular_core.InputSignal<HTMLElement>;
|
|
1071
|
+
readonly placement: _angular_core.InputSignal<NsPlacement>;
|
|
1072
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
1073
|
+
readonly closed: _angular_core.OutputEmitterRef<NsOverlayCloseReason>;
|
|
1074
|
+
readonly items: _angular_core.Signal<readonly NsMenuItemComponent[]>;
|
|
1075
|
+
private readonly element;
|
|
1076
|
+
private readonly overlay;
|
|
1077
|
+
private overlayRef?;
|
|
1078
|
+
private viewInitialized;
|
|
1079
|
+
private activeIndex;
|
|
1080
|
+
constructor();
|
|
1081
|
+
ngAfterViewInit(): void;
|
|
1082
|
+
ngOnDestroy(): void;
|
|
1083
|
+
close(): void;
|
|
1084
|
+
onKeydown(event: KeyboardEvent): void;
|
|
1085
|
+
private handleItemSelect;
|
|
1086
|
+
private openOverlay;
|
|
1087
|
+
private syncActiveItem;
|
|
1088
|
+
private focusItem;
|
|
1089
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsMenuComponent, never>;
|
|
1090
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsMenuComponent, "ns-menu", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "origin": { "alias": "origin"; "required": true; "isSignal": true; }; "placement": { "alias": "placement"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, ["items"], ["[menu-header]", "*"], true, never>;
|
|
1091
|
+
}
|
|
1092
|
+
|
|
1093
|
+
/**
|
|
1094
|
+
* Visual separator between `ns-menu-item` groups. Consumers who prefer the
|
|
1095
|
+
* native element can also write `<hr ns-menu-divider>` directly; both forms
|
|
1096
|
+
* resolve to the same host styling.
|
|
1097
|
+
*/
|
|
1098
|
+
declare class NsMenuDividerComponent {
|
|
1099
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsMenuDividerComponent, never>;
|
|
1100
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsMenuDividerComponent, "ns-menu-divider, hr[ns-menu-divider]", never, {}, {}, never, never, true, never>;
|
|
1101
|
+
}
|
|
1102
|
+
|
|
1103
|
+
declare class NsMenuSectionComponent {
|
|
1104
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1105
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsMenuSectionComponent, never>;
|
|
1106
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsMenuSectionComponent, "ns-menu-section", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1107
|
+
}
|
|
1108
|
+
|
|
868
1109
|
declare class NsMeterComponent {
|
|
869
1110
|
readonly value: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
870
1111
|
readonly min: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
@@ -932,6 +1173,25 @@ declare class NsModalService {
|
|
|
932
1173
|
static ɵprov: _angular_core.ɵɵInjectableDeclaration<NsModalService>;
|
|
933
1174
|
}
|
|
934
1175
|
|
|
1176
|
+
/**
|
|
1177
|
+
* Companion to `ns-pagination` for feeds that grow with a "load more" action
|
|
1178
|
+
* instead of numbered pages. Kept as a separate component because its
|
|
1179
|
+
* template (a status line plus a single button) has nothing in common with
|
|
1180
|
+
* `ns-pagination`'s page-number navigation.
|
|
1181
|
+
*/
|
|
1182
|
+
declare class NsLoadMoreComponent {
|
|
1183
|
+
readonly shown: _angular_core.InputSignal<number>;
|
|
1184
|
+
readonly total: _angular_core.InputSignal<number>;
|
|
1185
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1186
|
+
readonly loadMoreLabel: _angular_core.InputSignal<string>;
|
|
1187
|
+
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1188
|
+
readonly loadMore: _angular_core.OutputEmitterRef<void>;
|
|
1189
|
+
readonly hasMore: _angular_core.Signal<boolean>;
|
|
1190
|
+
readonly statusText: _angular_core.Signal<string>;
|
|
1191
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsLoadMoreComponent, never>;
|
|
1192
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsLoadMoreComponent, "ns-load-more", never, { "shown": { "alias": "shown"; "required": true; "isSignal": true; }; "total": { "alias": "total"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "loadMoreLabel": { "alias": "loadMoreLabel"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; }, { "loadMore": "loadMore"; }, never, never, true, never>;
|
|
1193
|
+
}
|
|
1194
|
+
|
|
935
1195
|
declare class NsPaginationComponent {
|
|
936
1196
|
readonly total: _angular_core.InputSignal<number>;
|
|
937
1197
|
readonly pageSize: _angular_core.InputSignal<number>;
|
|
@@ -1109,6 +1369,45 @@ declare class NsSchemaMarkupComponent implements OnInit, OnChanges {
|
|
|
1109
1369
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSchemaMarkupComponent, "ns-schema", never, { "data": { "alias": "data"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1110
1370
|
}
|
|
1111
1371
|
|
|
1372
|
+
type NsSideNavColor = 'nav' | 'success';
|
|
1373
|
+
/**
|
|
1374
|
+
* Vertical navigation rail. `color="nav"` renders the branded blue rail
|
|
1375
|
+
* (`semantic.color.nav`/`navActive`); `color="success"` renders a neutral
|
|
1376
|
+
* surface where only the active item gets a green highlight. Descendant
|
|
1377
|
+
* `ns-side-nav-item`/`ns-side-nav-section` read the variant through
|
|
1378
|
+
* `:host-context`.
|
|
1379
|
+
*/
|
|
1380
|
+
declare class NsSideNavComponent {
|
|
1381
|
+
readonly color: _angular_core.InputSignal<NsSideNavColor>;
|
|
1382
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
1383
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsSideNavComponent, never>;
|
|
1384
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSideNavComponent, "ns-side-nav", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1385
|
+
}
|
|
1386
|
+
|
|
1387
|
+
/**
|
|
1388
|
+
* Renders an `<a>` when `link` (routed, via `RouterLink` composition) or
|
|
1389
|
+
* `href` (plain external navigation) is provided, and a `<button>`
|
|
1390
|
+
* otherwise — so a purely programmatic item (e.g. one that opens a panel)
|
|
1391
|
+
* still gets correct semantics and keyboard behavior for free.
|
|
1392
|
+
*/
|
|
1393
|
+
declare class NsSideNavItemComponent {
|
|
1394
|
+
readonly href: _angular_core.InputSignal<string>;
|
|
1395
|
+
readonly link: _angular_core.InputSignal<string | readonly unknown[]>;
|
|
1396
|
+
readonly active: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1397
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1398
|
+
readonly description: _angular_core.InputSignal<string>;
|
|
1399
|
+
readonly activated: _angular_core.OutputEmitterRef<void>;
|
|
1400
|
+
onActivate(event: Event): void;
|
|
1401
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsSideNavItemComponent, never>;
|
|
1402
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSideNavItemComponent, "ns-side-nav-item", never, { "href": { "alias": "href"; "required": false; "isSignal": true; }; "link": { "alias": "link"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "description": { "alias": "description"; "required": false; "isSignal": true; }; }, { "activated": "activated"; }, never, ["[side-nav-item-icon]", "*", "[side-nav-item-badge]"], true, never>;
|
|
1403
|
+
}
|
|
1404
|
+
|
|
1405
|
+
declare class NsSideNavSectionComponent {
|
|
1406
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1407
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsSideNavSectionComponent, never>;
|
|
1408
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSideNavSectionComponent, "ns-side-nav-section", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1409
|
+
}
|
|
1410
|
+
|
|
1112
1411
|
declare class NsSkeletonComponent {
|
|
1113
1412
|
readonly width: _angular_core.InputSignal<string>;
|
|
1114
1413
|
readonly height: _angular_core.InputSignal<string>;
|
|
@@ -1117,6 +1416,39 @@ declare class NsSkeletonComponent {
|
|
|
1117
1416
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsSkeletonComponent, "ns-skeleton", never, { "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "animated": { "alias": "animated"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1118
1417
|
}
|
|
1119
1418
|
|
|
1419
|
+
type NsStatCardVariant = 'default' | 'dark' | 'compact';
|
|
1420
|
+
type NsStatCardDeltaTone = 'up' | 'down' | 'neutral';
|
|
1421
|
+
type NsStatCardValueTone = 'default' | 'success' | 'warning' | 'danger' | 'info';
|
|
1422
|
+
/**
|
|
1423
|
+
* Dashboard metric card: label, formatted value (with an optional muted
|
|
1424
|
+
* suffix), and an optional delta pill (`up` / `down` / `neutral`) with a
|
|
1425
|
+
* caption and a secondary hint. `variant="dark"` renders the emphasis
|
|
1426
|
+
* surface used for headline metrics; `variant="compact"` renders a smaller
|
|
1427
|
+
* card with a smaller value size. Set `interactive` to render the card as a
|
|
1428
|
+
* `<button>` and receive `(activated)` instead of a static `<div>`.
|
|
1429
|
+
*
|
|
1430
|
+
* `valueTone` colors only the headline value with the matching semantic
|
|
1431
|
+
* status color (`success`/`warning`/`danger`/`info`); it is ignored on
|
|
1432
|
+
* `variant="dark"`, where the value stays white.
|
|
1433
|
+
*/
|
|
1434
|
+
declare class NsStatCardComponent {
|
|
1435
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1436
|
+
readonly value: _angular_core.InputSignal<string>;
|
|
1437
|
+
readonly suffix: _angular_core.InputSignal<string>;
|
|
1438
|
+
readonly delta: _angular_core.InputSignal<string>;
|
|
1439
|
+
readonly deltaTone: _angular_core.InputSignal<NsStatCardDeltaTone>;
|
|
1440
|
+
readonly deltaLabel: _angular_core.InputSignal<string>;
|
|
1441
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1442
|
+
readonly valueTone: _angular_core.InputSignal<NsStatCardValueTone>;
|
|
1443
|
+
readonly variant: _angular_core.InputSignal<NsStatCardVariant>;
|
|
1444
|
+
readonly interactive: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1445
|
+
readonly activated: _angular_core.OutputEmitterRef<void>;
|
|
1446
|
+
protected deltaGlyph(): string;
|
|
1447
|
+
protected onActivate(): void;
|
|
1448
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsStatCardComponent, never>;
|
|
1449
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsStatCardComponent, "ns-stat-card", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "value": { "alias": "value"; "required": true; "isSignal": true; }; "suffix": { "alias": "suffix"; "required": false; "isSignal": true; }; "delta": { "alias": "delta"; "required": false; "isSignal": true; }; "deltaTone": { "alias": "deltaTone"; "required": false; "isSignal": true; }; "deltaLabel": { "alias": "deltaLabel"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "valueTone": { "alias": "valueTone"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; }, { "activated": "activated"; }, never, ["[stat-card-icon]", "[stat-card-footer]"], true, never>;
|
|
1450
|
+
}
|
|
1451
|
+
|
|
1120
1452
|
declare class TemplateDirective {
|
|
1121
1453
|
readonly name: _angular_core.InputSignal<string>;
|
|
1122
1454
|
readonly styleClass: _angular_core.InputSignal<string>;
|
|
@@ -1224,6 +1556,32 @@ declare function tokenPathToCssVariable(tier: 'primitive' | 'semantic' | 'compon
|
|
|
1224
1556
|
declare function referenceToCssVariable(reference: NsPrimitiveReference | NsSemanticReference): string;
|
|
1225
1557
|
type NsFlattenedPrimitiveTokens = Map<string, NsPrimitiveTokenValue>;
|
|
1226
1558
|
|
|
1559
|
+
type NsTimelineSize = 'sm' | 'md';
|
|
1560
|
+
/**
|
|
1561
|
+
* Vertical list of dated events. Renders an actual `<ol>` so screen readers
|
|
1562
|
+
* announce it as a list; `ns-timeline-item` renders the individual `<li>`
|
|
1563
|
+
* rows and reads `size` from this host through `:host-context`.
|
|
1564
|
+
*/
|
|
1565
|
+
declare class NsTimelineComponent {
|
|
1566
|
+
readonly size: _angular_core.InputSignal<NsTimelineSize>;
|
|
1567
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsTimelineComponent, never>;
|
|
1568
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsTimelineComponent, "ns-timeline", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1569
|
+
}
|
|
1570
|
+
|
|
1571
|
+
/**
|
|
1572
|
+
* `accent` is a violet event marker specific to the timeline (not part of
|
|
1573
|
+
* the shared `NsColor` union), alongside the `info` tone already used by
|
|
1574
|
+
* other status-driven components such as `ns-chip`.
|
|
1575
|
+
*/
|
|
1576
|
+
type NsTimelineItemColor = NsColor | 'info' | 'accent';
|
|
1577
|
+
declare class NsTimelineItemComponent {
|
|
1578
|
+
readonly color: _angular_core.InputSignal<NsTimelineItemColor>;
|
|
1579
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
1580
|
+
readonly meta: _angular_core.InputSignal<string>;
|
|
1581
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsTimelineItemComponent, never>;
|
|
1582
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsTimelineItemComponent, "ns-timeline-item", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "meta": { "alias": "meta"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1583
|
+
}
|
|
1584
|
+
|
|
1227
1585
|
declare class NsToastHandle {
|
|
1228
1586
|
private readonly closeToast;
|
|
1229
1587
|
private readonly closeReason;
|
|
@@ -1301,8 +1659,10 @@ declare class NsTabComponent {
|
|
|
1301
1659
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsTabComponent, never>;
|
|
1302
1660
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsTabComponent, "ns-tab", never, { "key": { "alias": "key"; "required": true; "isSignal": true; }; "label": { "alias": "label"; "required": true; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1303
1661
|
}
|
|
1662
|
+
type NsTabsVariant = 'underline' | 'pill';
|
|
1304
1663
|
declare class NsTabsComponent {
|
|
1305
1664
|
readonly orientation: _angular_core.InputSignal<NsOrientation>;
|
|
1665
|
+
readonly variant: _angular_core.InputSignal<NsTabsVariant>;
|
|
1306
1666
|
readonly selectedKey: _angular_core.ModelSignal<NsKey>;
|
|
1307
1667
|
readonly tabs: _angular_core.Signal<readonly NsTabComponent[]>;
|
|
1308
1668
|
private readonly element;
|
|
@@ -1311,7 +1671,7 @@ declare class NsTabsComponent {
|
|
|
1311
1671
|
onKeydown(event: KeyboardEvent, index: number): void;
|
|
1312
1672
|
private syncSelection;
|
|
1313
1673
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<NsTabsComponent, never>;
|
|
1314
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsTabsComponent, "ns-tabs", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "selectedKey": { "alias": "selectedKey"; "required": false; "isSignal": true; }; }, { "selectedKey": "selectedKeyChange"; }, ["tabs"], ["*"], true, never>;
|
|
1674
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<NsTabsComponent, "ns-tabs", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "selectedKey": { "alias": "selectedKey"; "required": false; "isSignal": true; }; }, { "selectedKey": "selectedKeyChange"; }, ["tabs"], ["*"], true, never>;
|
|
1315
1675
|
}
|
|
1316
1676
|
|
|
1317
1677
|
declare class NsTagComponent {
|
|
@@ -1382,5 +1742,5 @@ declare class NsTooltipDirective implements OnDestroy {
|
|
|
1382
1742
|
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<NsTooltipDirective, "[nsTooltip]", never, { "message": { "alias": "nsTooltip"; "required": true; "isSignal": true; }; "placement": { "alias": "nsTooltipPlacement"; "required": false; "isSignal": true; }; "delay": { "alias": "nsTooltipDelay"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1383
1743
|
}
|
|
1384
1744
|
|
|
1385
|
-
export { Arvisfy, NS_THEME_OPTIONS, NS_TOAST_OPTIONS, NsAccordionComponent, NsAccordionItemComponent, NsAlertComponent, NsAvatarComponent, NsBadgeComponent, NsBreadcrumbItemComponent, NsBreadcrumbsComponent, NsButtonComponent, NsButtonGroupComponent, NsCardBodyComponent, NsCardComponent, NsCardFooterComponent, NsCardHeaderComponent, NsCheckboxComponent, NsChipComponent, NsCollectionController, NsCommentComponent, NsContentEditableComponent, NsDatePickerComponent, NsDateRangePickerComponent, NsDescriptionComponent, NsDividerComponent, NsDrawerComponent, NsDrawerRef, NsDrawerService, NsDropdownComponent, NsDropdownItemDirective, NsEditorColorPickerComponent, NsEditorComponent, NsEditorLinkComponent, NsEditorListComponent, NsEditorParagraphComponent, NsEditorToggleCommandComponent, NsFieldContext, NsFieldDirective, NsImageUploadComponent, NsInputCodeComponent, NsInputComponent, NsInputGroupAddonComponent, NsInputGroupComponent, NsInputNumberComponent, NsInputSearchComponent, NsLinkComponent, NsMeterComponent, NsModalComponent, NsModalRef, NsModalService, NsOverlayRef, NsOverlayService, NsPaginationComponent, NsPasswordComponent, NsPopoverComponent, NsProgressBarComponent, NsRadioComponent, NsRadioGroupComponent, NsSchedule, NsScheduleComponent, NsScheduleService, NsSchemaMarkupComponent, NsSkeletonComponent, NsSliderComponent, NsSurfaceComponent, NsSwitchComponent, NsTabComponent, NsTabsComponent, NsTagComponent, NsTagGroupComponent, NsTextAreaComponent, NsThemeService, NsToastComponent, NsToastHandle, NsToastService, NsTooltipComponent, NsTooltipDirective, NsValueAccessor, TemplateDirective, defineNsPreset, flattenTokens, getNsOverlayPosition, provideNsTheme, referenceToCssVariable, tokenPathToCssVariable, validateNsPreset };
|
|
1386
|
-
export type { NsAlertVariant, NsBadgeMode, NsButtonVariant, NsCollectionItem, NsColor, NsColorScheme, NsComment, NsComponentInputs, NsDateRangeValue, NsDateView, NsDeepPartial, NsDrawerComponentInputs, NsDrawerConfig, NsDrawerOptions, NsDrawerPosition, NsDropdownItem, NsDropdownValue, NsFlattenedPrimitiveTokens, NsKey, NsModalConfig, NsModalOptions, NsModalSize, NsOrientation, NsOverlayCloseReason, NsOverlayConfig, NsOverlayPosition, NsPlacement, NsPrimitiveReference, NsPrimitiveTokenValue, NsResolvedColorScheme, NsResolvedThemeOptions, NsResolvedToastThemeOptions, NsSchemaMarkup, NsSchemaType, NsSelectionMode, NsSemanticReference, NsSemanticTokens, NsSize, NsSliderValue, NsThemeOptions, NsThemePreset, NsThemePresetOverrides, NsToastAction, NsToastCloseReason, NsToastOptions, NsToastPlacement, NsToastThemeOptions, NsToastVariant, NsTokenTree, NsVariant };
|
|
1745
|
+
export { Arvisfy, NS_THEME_OPTIONS, NS_TOAST_OPTIONS, NsAccordionComponent, NsAccordionItemComponent, NsAlertComponent, NsAvatarComponent, NsAvatarGroupComponent, NsBadgeComponent, NsBreadcrumbItemComponent, NsBreadcrumbsComponent, NsButtonComponent, NsButtonGroupComponent, NsCardBodyComponent, NsCardComponent, NsCardFooterComponent, NsCardHeaderComponent, NsCheckboxComponent, NsChipComponent, NsCollectionController, NsCommandPaletteComponent, NsCommentComponent, NsContentEditableComponent, NsDatePickerComponent, NsDateRangePickerComponent, NsDescriptionComponent, NsDividerComponent, NsDrawerComponent, NsDrawerRef, NsDrawerService, NsDropdownComponent, NsDropdownItemDirective, NsEditorColorPickerComponent, NsEditorComponent, NsEditorLinkComponent, NsEditorListComponent, NsEditorParagraphComponent, NsEditorToggleCommandComponent, NsEmptyStateComponent, NsFieldContext, NsFieldDirective, NsImageUploadComponent, NsInputCodeComponent, NsInputComponent, NsInputGroupAddonComponent, NsInputGroupComponent, NsInputNumberComponent, NsInputSearchComponent, NsLinkComponent, NsLoadMoreComponent, NsMenuComponent, NsMenuDividerComponent, NsMenuItemComponent, NsMenuSectionComponent, NsMeterComponent, NsModalComponent, NsModalRef, NsModalService, NsOptionCardComponent, NsOverlayRef, NsOverlayService, NsPaginationComponent, NsPasswordComponent, NsPopoverComponent, NsProgressBarComponent, NsRadioComponent, NsRadioGroupComponent, NsSchedule, NsScheduleComponent, NsScheduleService, NsSchemaMarkupComponent, NsSideNavComponent, NsSideNavItemComponent, NsSideNavSectionComponent, NsSkeletonComponent, NsSliderComponent, NsStatCardComponent, NsSurfaceComponent, NsSwitchComponent, NsTabComponent, NsTabsComponent, NsTagComponent, NsTagGroupComponent, NsTextAreaComponent, NsThemeService, NsTimelineComponent, NsTimelineItemComponent, NsToastComponent, NsToastHandle, NsToastService, NsTooltipComponent, NsTooltipDirective, NsValueAccessor, TemplateDirective, defineNsPreset, flattenTokens, getNsOverlayPosition, provideNsTheme, referenceToCssVariable, tokenPathToCssVariable, validateNsPreset };
|
|
1746
|
+
export type { NsAlertVariant, NsBadgeMode, NsButtonGroupSelectionMode, NsButtonVariant, NsChipColor, NsChipSize, NsChipVariant, NsCollectionItem, NsColor, NsColorScheme, NsCommandGroup, NsCommandItem, NsComment, NsComponentInputs, NsDateRangeValue, NsDateView, NsDeepPartial, NsDrawerComponentInputs, NsDrawerConfig, NsDrawerOptions, NsDrawerPosition, NsDropdownItem, NsDropdownValue, NsEmptyStateSize, NsFlattenedPrimitiveTokens, NsKey, NsModalConfig, NsModalOptions, NsModalSize, NsOrientation, NsOverlayCloseReason, NsOverlayConfig, NsOverlayPosition, NsPlacement, NsPrimitiveReference, NsPrimitiveTokenValue, NsResolvedColorScheme, NsResolvedThemeOptions, NsResolvedToastThemeOptions, NsSchemaMarkup, NsSchemaType, NsSelectionMode, NsSemanticReference, NsSemanticTokens, NsSideNavColor, NsSize, NsSliderValue, NsStatCardDeltaTone, NsStatCardValueTone, NsStatCardVariant, NsTabsVariant, NsThemeOptions, NsThemePreset, NsThemePresetOverrides, NsTimelineItemColor, NsTimelineSize, NsToastAction, NsToastCloseReason, NsToastOptions, NsToastPlacement, NsToastThemeOptions, NsToastVariant, NsTokenTree, NsVariant };
|