@ids-group-ltd/ids-design-system 0.2.2 → 0.4.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.
- package/README.md +2 -2
- package/fesm2022/ids-group-ltd-ids-design-system.mjs +3208 -531
- package/fesm2022/ids-group-ltd-ids-design-system.mjs.map +1 -1
- package/package.json +4 -3
- package/schematics/collection.json +10 -0
- package/schematics/ng-add/index.js +47 -0
- package/schematics/ng-add/schema.json +13 -0
- package/styles/_breakpoints.scss +50 -0
- package/styles/_dropdown-overlay.scss +4 -3
- package/styles/_ds-color.scss +36 -0
- package/styles/_fonts.scss +11 -5
- package/styles/_layout-utils.scss +2 -2
- package/styles/_link.scss +3 -2
- package/styles/_overlay-motion.scss +18 -0
- package/styles/_page-grid.scss +6 -3
- package/styles/_reset.scss +6 -1
- package/styles/_scrollbar.scss +2 -1
- package/styles/_theme-activation.scss +49 -0
- package/styles/_tokens-charts.scss +18 -18
- package/styles/_tokens.scss +74 -25
- package/styles/_typography.scss +21 -21
- package/styles/ds.scss +15 -9
- package/themes/README.md +72 -58
- package/themes/{default/_palette.scss → _base-palette.scss} +67 -50
- package/themes/{default/_theme.scss → _semantic.scss} +103 -87
- package/themes/dark/_palette.scss +39 -0
- package/themes/dark/_theme.scss +122 -0
- package/themes/light/_palette.scss +34 -0
- package/themes/light/_theme.scss +15 -0
- package/types/ids-group-ltd-ids-design-system.d.ts +738 -36
|
@@ -1,6 +1,8 @@
|
|
|
1
1
|
import * as _angular_core from '@angular/core';
|
|
2
|
-
import { InjectionToken, Provider,
|
|
2
|
+
import { InjectionToken, Provider, EnvironmentProviders, ElementRef, TemplateRef, ModelSignal, OnDestroy } from '@angular/core';
|
|
3
3
|
import { SafeHtml } from '@angular/platform-browser';
|
|
4
|
+
import { ControlValueAccessor } from '@angular/forms';
|
|
5
|
+
import * as _ids_group_ltd_ids_design_system from '@ids-group-ltd/ids-design-system';
|
|
4
6
|
|
|
5
7
|
declare const ICONS: {
|
|
6
8
|
readonly search: "<circle cx=\"11\" cy=\"11\" r=\"7\" /><path d=\"m20 20-3.5-3.5\" />";
|
|
@@ -108,6 +110,31 @@ declare const DS_CONFIG: InjectionToken<DsConfig>;
|
|
|
108
110
|
*/
|
|
109
111
|
declare function provideDsConfig(config: DsConfig): Provider;
|
|
110
112
|
|
|
113
|
+
interface DsThemeOptions {
|
|
114
|
+
/**
|
|
115
|
+
* Follow the operating-system colour scheme: on startup set `data-theme` on
|
|
116
|
+
* `<html>` from `prefers-color-scheme` and keep it in sync as the OS changes.
|
|
117
|
+
* Default `false` — the design system stays on its explicit light default
|
|
118
|
+
* and dark is opt-in via `<html data-theme="dark">`.
|
|
119
|
+
*/
|
|
120
|
+
followSystem?: boolean;
|
|
121
|
+
}
|
|
122
|
+
/**
|
|
123
|
+
* App-root theme configuration for the design system.
|
|
124
|
+
*
|
|
125
|
+
* ```ts
|
|
126
|
+
* // app.config.ts
|
|
127
|
+
* export const appConfig: ApplicationConfig = {
|
|
128
|
+
* providers: [provideDsTheme({ followSystem: true })],
|
|
129
|
+
* };
|
|
130
|
+
* ```
|
|
131
|
+
*
|
|
132
|
+
* Light is the default with no provider; `followSystem` opts into OS-driven
|
|
133
|
+
* switching. A manual `<html data-theme="dark">` always wins over the initial
|
|
134
|
+
* value this sets.
|
|
135
|
+
*/
|
|
136
|
+
declare function provideDsTheme(options?: DsThemeOptions): EnvironmentProviders;
|
|
137
|
+
|
|
111
138
|
/** A reference to the overlay/container the projected content lives in, used to
|
|
112
139
|
* close it from the inside — e.g. a popover (and, later, a dropdown/select)
|
|
113
140
|
* closing when a menu item is selected. The container provides it via DI;
|
|
@@ -162,11 +189,19 @@ declare const DS_ICON_REGISTRY: InjectionToken<Readonly<Record<string, string>>>
|
|
|
162
189
|
*/
|
|
163
190
|
declare function provideDsIcons(icons: DsIconRegistry): Provider;
|
|
164
191
|
|
|
165
|
-
type
|
|
166
|
-
type
|
|
192
|
+
type ButtonColor = 'primary' | 'secondary' | 'tertiary' | 'neutral' | 'error' | 'success' | 'warning';
|
|
193
|
+
type ButtonVariant = 'solid' | 'tonal' | 'ghost' | 'outline' | 'text';
|
|
194
|
+
type ButtonSize = 'sm' | 'md' | 'lg';
|
|
167
195
|
type ButtonType = 'button' | 'submit' | 'reset';
|
|
168
196
|
|
|
169
197
|
declare class ButtonComponent {
|
|
198
|
+
/** Brand/status hue family. */
|
|
199
|
+
readonly color: _angular_core.InputSignal<ButtonColor>;
|
|
200
|
+
/** Fill pattern: solid | tonal | ghost | outline | text. All color×variant
|
|
201
|
+
pairs render; some are UX-discouraged (see DISCOURAGED_COMBOS / the docs)
|
|
202
|
+
and emit a dev-mode warning — they work, but read poorly. `text` is
|
|
203
|
+
discouraged for ALL colours — prefer the global `.link` class; it stays for
|
|
204
|
+
cases needing the ds-button API (loading/fullWidth/typed pressed). */
|
|
170
205
|
readonly variant: _angular_core.InputSignal<ButtonVariant>;
|
|
171
206
|
readonly size: _angular_core.InputSignal<ButtonSize>;
|
|
172
207
|
readonly type: _angular_core.InputSignal<ButtonType>;
|
|
@@ -181,11 +216,34 @@ declare class ButtonComponent {
|
|
|
181
216
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
182
217
|
readonly icon: _angular_core.InputSignal<IconName | null>;
|
|
183
218
|
readonly trailingIcon: _angular_core.InputSignal<IconName | null>;
|
|
219
|
+
/** ARIA `aria-haspopup`, forwarded to the inner <button> — set when this
|
|
220
|
+
* button triggers a menu/dialog/listbox overlay. */
|
|
221
|
+
readonly ariaHasPopup: _angular_core.InputSignal<"grid" | "true" | "menu" | "listbox" | "tree" | "dialog" | null>;
|
|
222
|
+
/** ARIA `aria-expanded`, forwarded to the inner <button> — bind to the
|
|
223
|
+
* overlay's open state on a trigger button. */
|
|
224
|
+
readonly ariaExpanded: _angular_core.InputSignal<boolean | null>;
|
|
184
225
|
readonly pressed: _angular_core.OutputEmitterRef<MouseEvent>;
|
|
226
|
+
/** The inner native <button>, exposed so overlay triggers can position
|
|
227
|
+
* against and restore focus to the real focusable element — e.g.
|
|
228
|
+
* `(pressed)="pop.toggle(trigger.buttonRef().nativeElement)"`. */
|
|
229
|
+
readonly buttonRef: _angular_core.Signal<ElementRef<HTMLButtonElement>>;
|
|
185
230
|
protected readonly classes: _angular_core.Signal<string>;
|
|
231
|
+
constructor();
|
|
186
232
|
protected onClick(event: MouseEvent): void;
|
|
187
233
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonComponent, never>;
|
|
188
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "ds-button", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "trailingIcon": { "alias": "trailingIcon"; "required": false; "isSignal": true; }; }, { "pressed": "pressed"; }, never, ["*", "[dsButtonSubtext]"], true, never>;
|
|
234
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonComponent, "ds-button", never, { "color": { "alias": "color"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "fullWidth": { "alias": "fullWidth"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "trailingIcon": { "alias": "trailingIcon"; "required": false; "isSignal": true; }; "ariaHasPopup": { "alias": "ariaHasPopup"; "required": false; "isSignal": true; }; "ariaExpanded": { "alias": "ariaExpanded"; "required": false; "isSignal": true; }; }, { "pressed": "pressed"; }, never, ["*", "[dsButtonSubtext]"], true, never>;
|
|
235
|
+
}
|
|
236
|
+
|
|
237
|
+
/** A single binary toggle button (pressed / not pressed) with an optional
|
|
238
|
+
* leading icon and a projected label. Distinct from `ds-segmented` (a
|
|
239
|
+
* one-of-many value toggle) — this is a standalone on/off control. */
|
|
240
|
+
declare class ToggleButtonComponent {
|
|
241
|
+
readonly pressed: _angular_core.ModelSignal<boolean>;
|
|
242
|
+
readonly icon: _angular_core.InputSignal<string>;
|
|
243
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
244
|
+
protected toggle(): void;
|
|
245
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToggleButtonComponent, never>;
|
|
246
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ToggleButtonComponent, "ds-toggle-button", never, { "pressed": { "alias": "pressed"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "pressed": "pressedChange"; }, never, ["*"], true, never>;
|
|
189
247
|
}
|
|
190
248
|
|
|
191
249
|
type IconButtonVariant = 'standard' | 'filled' | 'tonal' | 'outlined';
|
|
@@ -202,6 +260,9 @@ declare class IconButtonComponent {
|
|
|
202
260
|
readonly icon: _angular_core.InputSignal<IconName>;
|
|
203
261
|
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
204
262
|
readonly variant: _angular_core.InputSignal<IconButtonVariant>;
|
|
263
|
+
/** Brand/status hue family (shared with ds-button). `variant` is the fill
|
|
264
|
+
axis; `color` recolours the accent the fill consumes. Default primary. */
|
|
265
|
+
readonly color: _angular_core.InputSignal<ButtonColor>;
|
|
205
266
|
readonly size: _angular_core.InputSignal<IconButtonSize>;
|
|
206
267
|
readonly type: _angular_core.InputSignal<IconButtonType>;
|
|
207
268
|
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
@@ -212,7 +273,7 @@ declare class IconButtonComponent {
|
|
|
212
273
|
protected readonly iconSize: _angular_core.Signal<16 | 24 | 20>;
|
|
213
274
|
protected onClick(event: MouseEvent): void;
|
|
214
275
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<IconButtonComponent, never>;
|
|
215
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IconButtonComponent, "ds-icon-button", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": true; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, { "pressed": "pressed"; }, never, never, true, never>;
|
|
276
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<IconButtonComponent, "ds-icon-button", never, { "icon": { "alias": "icon"; "required": true; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": true; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "color": { "alias": "color"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; }, { "pressed": "pressed"; }, never, never, true, never>;
|
|
216
277
|
}
|
|
217
278
|
|
|
218
279
|
type BadgeLifecycle = 'planning' | 'confirmed' | 'active' | 'completed';
|
|
@@ -335,10 +396,68 @@ declare class TabsComponent {
|
|
|
335
396
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TabsComponent, "ds-tabs", never, { "selectedIndex": { "alias": "selectedIndex"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, { "selectedIndex": "selectedIndexChange"; }, ["tabs"], never, true, never>;
|
|
336
397
|
}
|
|
337
398
|
|
|
399
|
+
/**
|
|
400
|
+
* Shared `ControlValueAccessor` for DS form controls whose value is a signal
|
|
401
|
+
* `model()`. Bridges that model with Angular forms (reactive `formControl` /
|
|
402
|
+
* `formControlName` and template `ngModel`) in both directions, WITHOUT
|
|
403
|
+
* touching the existing `[(value)]` signal API — both keep working.
|
|
404
|
+
*
|
|
405
|
+
* A subclass must expose the `value` model and OR `formDisabled()` into its
|
|
406
|
+
* effective disabled state so `FormControl.disable()` actually reaches the
|
|
407
|
+
* control; it should also call `markTouched()` from a blur handler.
|
|
408
|
+
*/
|
|
409
|
+
declare abstract class DsControlValueAccessor<T> implements ControlValueAccessor {
|
|
410
|
+
/** The component's two-way value model. */
|
|
411
|
+
abstract readonly value: ModelSignal<T>;
|
|
412
|
+
/** Driven by the forms API via `setDisabledState`. */
|
|
413
|
+
protected readonly formDisabled: _angular_core.WritableSignal<boolean>;
|
|
414
|
+
private onChange;
|
|
415
|
+
private onTouched;
|
|
416
|
+
private synced;
|
|
417
|
+
private hasSynced;
|
|
418
|
+
constructor();
|
|
419
|
+
/** Call from a blur handler so the control reports `ng-touched`. */
|
|
420
|
+
protected markTouched(): void;
|
|
421
|
+
writeValue(value: T): void;
|
|
422
|
+
registerOnChange(fn: (value: T) => void): void;
|
|
423
|
+
registerOnTouched(fn: () => void): void;
|
|
424
|
+
setDisabledState(isDisabled: boolean): void;
|
|
425
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsControlValueAccessor<any>, never>;
|
|
426
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DsControlValueAccessor<any>, never, never, {}, {}, never, never, true, never>;
|
|
427
|
+
}
|
|
428
|
+
/**
|
|
429
|
+
* Shared `ControlValueAccessor` for DS boolean controls (checkbox, switch)
|
|
430
|
+
* whose state lives in a `checked` model signal rather than `value`. Bridges
|
|
431
|
+
* with Angular forms in both directions without affecting the `[(checked)]`
|
|
432
|
+
* signal API. Subclasses must OR `formDisabled()` into their effective disabled
|
|
433
|
+
* state and call `markTouched()` from a blur handler.
|
|
434
|
+
*/
|
|
435
|
+
declare abstract class DsBooleanControlValueAccessor implements ControlValueAccessor {
|
|
436
|
+
/** The component's two-way checked model. */
|
|
437
|
+
abstract readonly checked: ModelSignal<boolean>;
|
|
438
|
+
/** Driven by the forms API via `setDisabledState`. */
|
|
439
|
+
protected readonly formDisabled: _angular_core.WritableSignal<boolean>;
|
|
440
|
+
private onChange;
|
|
441
|
+
private onTouched;
|
|
442
|
+
private synced;
|
|
443
|
+
private hasSynced;
|
|
444
|
+
constructor();
|
|
445
|
+
/** Call from a blur handler so the control reports `ng-touched`. */
|
|
446
|
+
protected markTouched(): void;
|
|
447
|
+
writeValue(value: boolean): void;
|
|
448
|
+
registerOnChange(fn: (value: boolean) => void): void;
|
|
449
|
+
registerOnTouched(fn: () => void): void;
|
|
450
|
+
setDisabledState(isDisabled: boolean): void;
|
|
451
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DsBooleanControlValueAccessor, never>;
|
|
452
|
+
static ɵdir: _angular_core.ɵɵDirectiveDeclaration<DsBooleanControlValueAccessor, never, never, {}, {}, never, never, true, never>;
|
|
453
|
+
}
|
|
454
|
+
|
|
455
|
+
type FieldMessageState = 'default' | 'error' | 'success';
|
|
456
|
+
|
|
338
457
|
type InputSize = 'sm' | 'md' | 'lg';
|
|
339
458
|
type InputType = 'text' | 'email' | 'password' | 'number' | 'tel' | 'url' | 'search';
|
|
340
459
|
|
|
341
|
-
declare class InputComponent {
|
|
460
|
+
declare class InputComponent extends DsControlValueAccessor<string> {
|
|
342
461
|
readonly value: _angular_core.ModelSignal<string>;
|
|
343
462
|
readonly type: _angular_core.InputSignal<InputType>;
|
|
344
463
|
readonly size: _angular_core.InputSignal<InputSize>;
|
|
@@ -349,6 +468,12 @@ declare class InputComponent {
|
|
|
349
468
|
readonly readOnly: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
350
469
|
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
351
470
|
readonly success: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
471
|
+
/** Shows a trailing spinner — e.g. async validation in flight. The input
|
|
472
|
+
* stays editable; pair with a `hint` like "Checking availability…". */
|
|
473
|
+
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
474
|
+
/** Floating-label variant — the label sits inside a taller control instead
|
|
475
|
+
* of stacked above it. */
|
|
476
|
+
readonly floating: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
352
477
|
readonly withAddon: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
353
478
|
readonly withAddonRight: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
354
479
|
readonly required: _angular_core.InputSignal<boolean>;
|
|
@@ -381,15 +506,18 @@ declare class InputComponent {
|
|
|
381
506
|
protected readonly canClear: _angular_core.Signal<boolean>;
|
|
382
507
|
protected readonly uid: string;
|
|
383
508
|
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
509
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
384
510
|
/** Only name via aria-label when there's no visible `<label for>`. */
|
|
385
511
|
protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
|
|
512
|
+
/** Effective disabled — own `disabled` input OR the reactive-forms state. */
|
|
513
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
386
514
|
protected readonly showPasswordToggle: _angular_core.Signal<boolean>;
|
|
387
515
|
protected readonly effectiveType: _angular_core.Signal<InputType>;
|
|
388
516
|
protected togglePassword(): void;
|
|
389
517
|
protected readonly wrapperClasses: _angular_core.Signal<string>;
|
|
390
518
|
protected clear(): void;
|
|
391
519
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<InputComponent, never>;
|
|
392
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputComponent, "ds-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "withAddon": { "alias": "withAddon"; "required": false; "isSignal": true; }; "withAddonRight": { "alias": "withAddonRight"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "autofocus": { "alias": "autofocus"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "enterKeyHint": { "alias": "enterKeyHint"; "required": false; "isSignal": true; }; "inputMode": { "alias": "inputMode"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "passwordToggle": { "alias": "passwordToggle"; "required": false; "isSignal": true; }; "passwordVisible": { "alias": "passwordVisible"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "blurred": "blurred"; "passwordVisible": "passwordVisibleChange"; }, never, ["[dsInputPrefix]", "[dsInputSuffix]"], true, never>;
|
|
520
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<InputComponent, "ds-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "type": { "alias": "type"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "readOnly": { "alias": "readOnly"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "success": { "alias": "success"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "floating": { "alias": "floating"; "required": false; "isSignal": true; }; "withAddon": { "alias": "withAddon"; "required": false; "isSignal": true; }; "withAddonRight": { "alias": "withAddonRight"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "min": { "alias": "min"; "required": false; "isSignal": true; }; "max": { "alias": "max"; "required": false; "isSignal": true; }; "step": { "alias": "step"; "required": false; "isSignal": true; }; "autocomplete": { "alias": "autocomplete"; "required": false; "isSignal": true; }; "autofocus": { "alias": "autofocus"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "enterKeyHint": { "alias": "enterKeyHint"; "required": false; "isSignal": true; }; "inputMode": { "alias": "inputMode"; "required": false; "isSignal": true; }; "clearable": { "alias": "clearable"; "required": false; "isSignal": true; }; "passwordToggle": { "alias": "passwordToggle"; "required": false; "isSignal": true; }; "passwordVisible": { "alias": "passwordVisible"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "blurred": "blurred"; "passwordVisible": "passwordVisibleChange"; }, never, ["[dsInputPrefix]", "[dsInputSuffix]"], true, never>;
|
|
393
521
|
}
|
|
394
522
|
|
|
395
523
|
type NumberStepperSize = 'sm' | 'md' | 'lg';
|
|
@@ -414,7 +542,7 @@ declare class NumberStepperComponent {
|
|
|
414
542
|
type TextareaSize = 'sm' | 'md' | 'lg';
|
|
415
543
|
type TextareaResize = 'none' | 'vertical' | 'horizontal' | 'both';
|
|
416
544
|
|
|
417
|
-
declare class TextareaComponent {
|
|
545
|
+
declare class TextareaComponent extends DsControlValueAccessor<string> {
|
|
418
546
|
readonly value: _angular_core.ModelSignal<string>;
|
|
419
547
|
readonly size: _angular_core.InputSignal<TextareaSize>;
|
|
420
548
|
readonly label: _angular_core.InputSignal<string>;
|
|
@@ -434,7 +562,10 @@ declare class TextareaComponent {
|
|
|
434
562
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
435
563
|
protected readonly uid: string;
|
|
436
564
|
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
565
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
437
566
|
protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
|
|
567
|
+
/** Effective disabled — own `disabled` input OR the reactive-forms state. */
|
|
568
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
438
569
|
protected readonly wrapperClasses: _angular_core.Signal<string>;
|
|
439
570
|
protected readonly autosizeMinHeight: _angular_core.Signal<string | null>;
|
|
440
571
|
protected readonly autosizeMaxHeight: _angular_core.Signal<string | null>;
|
|
@@ -483,7 +614,7 @@ interface SelectOptionGroup {
|
|
|
483
614
|
type SelectItem = SelectOption | SelectOptionGroup;
|
|
484
615
|
declare function isSelectOptionGroup(item: SelectItem): item is SelectOptionGroup;
|
|
485
616
|
|
|
486
|
-
declare class SelectComponent {
|
|
617
|
+
declare class SelectComponent extends DsControlValueAccessor<string> {
|
|
487
618
|
private readonly overlay;
|
|
488
619
|
private readonly vcr;
|
|
489
620
|
protected readonly preview: DsStaticPreview;
|
|
@@ -494,6 +625,7 @@ declare class SelectComponent {
|
|
|
494
625
|
readonly label: _angular_core.InputSignal<string>;
|
|
495
626
|
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
496
627
|
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
628
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
497
629
|
readonly required: _angular_core.InputSignal<boolean>;
|
|
498
630
|
readonly optional: _angular_core.InputSignal<boolean>;
|
|
499
631
|
readonly name: _angular_core.InputSignal<string | null>;
|
|
@@ -502,10 +634,14 @@ declare class SelectComponent {
|
|
|
502
634
|
protected readonly uid: string;
|
|
503
635
|
protected readonly labelId: string;
|
|
504
636
|
protected readonly listboxId: string;
|
|
505
|
-
protected
|
|
637
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
638
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
639
|
+
protected optionId(flatIndex: number): string;
|
|
506
640
|
/** Active option for `aria-activedescendant` (combobox keeps DOM focus). */
|
|
507
641
|
protected readonly activeDescendant: _angular_core.Signal<string | null>;
|
|
508
642
|
protected readonly resolvedAriaLabel: _angular_core.Signal<string | null>;
|
|
643
|
+
/** Effective disabled — own `disabled` input OR the reactive-forms state. */
|
|
644
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
509
645
|
protected readonly trigger: _angular_core.Signal<ElementRef<HTMLButtonElement>>;
|
|
510
646
|
protected readonly panelTpl: _angular_core.Signal<TemplateRef<unknown>>;
|
|
511
647
|
protected readonly panelContentTpl: _angular_core.Signal<TemplateRef<unknown>>;
|
|
@@ -535,7 +671,7 @@ declare class SelectComponent {
|
|
|
535
671
|
private firstEnabledIndex;
|
|
536
672
|
private lastEnabledIndex;
|
|
537
673
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SelectComponent, never>;
|
|
538
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent, "ds-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, [{ directive: typeof DsStaticPreview; inputs: { "staticPreview": "staticPreview"; }; outputs: {}; }]>;
|
|
674
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SelectComponent, "ds-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, [{ directive: typeof DsStaticPreview; inputs: { "staticPreview": "staticPreview"; }; outputs: {}; }]>;
|
|
539
675
|
}
|
|
540
676
|
|
|
541
677
|
type DropdownSize = 'sm' | 'md' | 'lg';
|
|
@@ -665,6 +801,16 @@ declare class TableComponent<T extends {
|
|
|
665
801
|
* column. Off by default so non-navigating tables don't advertise a false
|
|
666
802
|
* click affordance. */
|
|
667
803
|
readonly rowInteractive: _angular_core.InputSignal<boolean>;
|
|
804
|
+
/** Rows per page. `null` (default) disables pagination — all rows render. */
|
|
805
|
+
readonly pageSize: _angular_core.ModelSignal<number | null>;
|
|
806
|
+
/** Current 1-based page. Only meaningful when `pageSize()` is set. */
|
|
807
|
+
readonly page: _angular_core.ModelSignal<number>;
|
|
808
|
+
readonly pageSizeOptions: _angular_core.InputSignal<number[]>;
|
|
809
|
+
/** When true, the table sorts `data()` itself; otherwise it only emits
|
|
810
|
+
* `sortChange` and leaves ordering to the consumer (default). */
|
|
811
|
+
readonly clientSort: _angular_core.InputSignal<boolean>;
|
|
812
|
+
/** Pin the first data column (and the select column) on horizontal scroll. */
|
|
813
|
+
readonly stickyFirstColumn: _angular_core.InputSignal<boolean>;
|
|
668
814
|
readonly rowClick: _angular_core.OutputEmitterRef<T>;
|
|
669
815
|
readonly sortChange: _angular_core.OutputEmitterRef<SortChangeEvent>;
|
|
670
816
|
/** Cell templates supplied as an explicit map instead of (or in addition to)
|
|
@@ -691,8 +837,16 @@ declare class TableComponent<T extends {
|
|
|
691
837
|
protected readonly tableClasses: _angular_core.Signal<string>;
|
|
692
838
|
protected readonly isSkeletonLoading: _angular_core.Signal<boolean>;
|
|
693
839
|
protected readonly isOverlayLoading: _angular_core.Signal<boolean>;
|
|
840
|
+
/** Client-side sort over the full data set — only when `clientSort()`. */
|
|
841
|
+
protected readonly sortedData: _angular_core.Signal<readonly T[]>;
|
|
842
|
+
/** Current page's slice of the sorted rows, when paginating. */
|
|
843
|
+
protected readonly pagedData: _angular_core.Signal<readonly T[]>;
|
|
844
|
+
/** Rows actually rendered: paged when paginating, else sorted/raw data. */
|
|
845
|
+
protected readonly displayData: _angular_core.Signal<readonly T[]>;
|
|
694
846
|
protected readonly allSelected: _angular_core.Signal<boolean>;
|
|
695
847
|
protected readonly someSelected: _angular_core.Signal<boolean>;
|
|
848
|
+
/** Select-all is page-scoped only when paginating. */
|
|
849
|
+
protected readonly selectAllLabel: _angular_core.Signal<"Select all rows on this page" | "Select all rows">;
|
|
696
850
|
protected readonly skeletonArray: _angular_core.Signal<any[]>;
|
|
697
851
|
protected isSelected(row: T): boolean;
|
|
698
852
|
protected onToggleAll(event: Event): void;
|
|
@@ -711,7 +865,7 @@ declare class TableComponent<T extends {
|
|
|
711
865
|
* across re-renders. Mixes column key + row index into one of five widths. */
|
|
712
866
|
protected skeletonWidth(col: TableColumn<T>, rowIndex: number): string;
|
|
713
867
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TableComponent<any>, never>;
|
|
714
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent<any>, "ds-table", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "bordered": { "alias": "bordered"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "sortKey": { "alias": "sortKey"; "required": false; "isSignal": true; }; "sortDir": { "alias": "sortDir"; "required": false; "isSignal": true; }; "skeletonRows": { "alias": "skeletonRows"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "rowInteractive": { "alias": "rowInteractive"; "required": false; "isSignal": true; }; "cellTemplateMap": { "alias": "cellTemplateMap"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; }, { "selectedIds": "selectedIdsChange"; "sortKey": "sortKeyChange"; "sortDir": "sortDirChange"; "rowClick": "rowClick"; "sortChange": "sortChange"; }, ["cellTemplateDirectives"], ["[empty]", "[bulk-actions]"], true, never>;
|
|
868
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TableComponent<any>, "ds-table", never, { "data": { "alias": "data"; "required": true; "isSignal": true; }; "columns": { "alias": "columns"; "required": true; "isSignal": true; }; "selectable": { "alias": "selectable"; "required": false; "isSignal": true; }; "bordered": { "alias": "bordered"; "required": false; "isSignal": true; }; "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "stickyHeader": { "alias": "stickyHeader"; "required": false; "isSignal": true; }; "selectedIds": { "alias": "selectedIds"; "required": false; "isSignal": true; }; "sortKey": { "alias": "sortKey"; "required": false; "isSignal": true; }; "sortDir": { "alias": "sortDir"; "required": false; "isSignal": true; }; "skeletonRows": { "alias": "skeletonRows"; "required": false; "isSignal": true; }; "caption": { "alias": "caption"; "required": false; "isSignal": true; }; "rowInteractive": { "alias": "rowInteractive"; "required": false; "isSignal": true; }; "pageSize": { "alias": "pageSize"; "required": false; "isSignal": true; }; "page": { "alias": "page"; "required": false; "isSignal": true; }; "pageSizeOptions": { "alias": "pageSizeOptions"; "required": false; "isSignal": true; }; "clientSort": { "alias": "clientSort"; "required": false; "isSignal": true; }; "stickyFirstColumn": { "alias": "stickyFirstColumn"; "required": false; "isSignal": true; }; "cellTemplateMap": { "alias": "cellTemplateMap"; "required": false; "isSignal": true; }; "emptyTemplate": { "alias": "emptyTemplate"; "required": false; "isSignal": true; }; }, { "selectedIds": "selectedIdsChange"; "sortKey": "sortKeyChange"; "sortDir": "sortDirChange"; "pageSize": "pageSizeChange"; "page": "pageChange"; "rowClick": "rowClick"; "sortChange": "sortChange"; }, ["cellTemplateDirectives"], ["[empty]", "[bulk-actions]"], true, never>;
|
|
715
869
|
}
|
|
716
870
|
|
|
717
871
|
declare class PaginationComponent {
|
|
@@ -752,9 +906,11 @@ interface DayCell {
|
|
|
752
906
|
isRangeEnd: boolean;
|
|
753
907
|
isSelected: boolean;
|
|
754
908
|
}
|
|
755
|
-
declare class DatePickerComponent {
|
|
909
|
+
declare class DatePickerComponent extends DsControlValueAccessor<Date | RangeValue | null> {
|
|
910
|
+
constructor();
|
|
756
911
|
private readonly overlay;
|
|
757
912
|
private readonly vcr;
|
|
913
|
+
private readonly injector;
|
|
758
914
|
readonly mode: _angular_core.InputSignal<DatePickerMode>;
|
|
759
915
|
readonly size: _angular_core.InputSignal<DatePickerSize>;
|
|
760
916
|
readonly value: _angular_core.ModelSignal<Date | RangeValue | null>;
|
|
@@ -763,8 +919,16 @@ declare class DatePickerComponent {
|
|
|
763
919
|
readonly hint: _angular_core.InputSignal<string>;
|
|
764
920
|
readonly required: _angular_core.InputSignal<boolean>;
|
|
765
921
|
readonly optional: _angular_core.InputSignal<boolean>;
|
|
922
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
923
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
766
924
|
/** Accessible name when no visible `label` is provided. */
|
|
767
925
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
926
|
+
/** Bounds for the year dropdown in the calendar header. */
|
|
927
|
+
readonly minYear: _angular_core.InputSignal<number>;
|
|
928
|
+
readonly maxYear: _angular_core.InputSignal<number>;
|
|
929
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
930
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
931
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
768
932
|
protected readonly uid: string;
|
|
769
933
|
protected readonly labelId: string;
|
|
770
934
|
protected readonly isOpen: _angular_core.WritableSignal<boolean>;
|
|
@@ -786,7 +950,26 @@ declare class DatePickerComponent {
|
|
|
786
950
|
protected readonly panelTpl: _angular_core.Signal<TemplateRef<unknown>>;
|
|
787
951
|
private overlayRef;
|
|
788
952
|
protected readonly displayLabel: _angular_core.Signal<string>;
|
|
789
|
-
protected readonly
|
|
953
|
+
protected readonly monthMenuOpen: _angular_core.WritableSignal<boolean>;
|
|
954
|
+
protected readonly yearMenuOpen: _angular_core.WritableSignal<boolean>;
|
|
955
|
+
protected readonly monthNames: string[];
|
|
956
|
+
protected readonly viewMonthIndex: _angular_core.Signal<number>;
|
|
957
|
+
protected readonly viewYear: _angular_core.Signal<number>;
|
|
958
|
+
/** First year shown in the year grid; paged by YEAR_PAGE_SIZE within [minYear, maxYear]. */
|
|
959
|
+
protected readonly yearPageStart: _angular_core.WritableSignal<number>;
|
|
960
|
+
protected readonly yearsOnPage: _angular_core.Signal<number[]>;
|
|
961
|
+
protected readonly yearRangeLabel: _angular_core.Signal<string>;
|
|
962
|
+
protected readonly canPrevYearPage: _angular_core.Signal<boolean>;
|
|
963
|
+
protected readonly canNextYearPage: _angular_core.Signal<boolean>;
|
|
964
|
+
/** Aligns the page so `year` lands on a stable grid boundary measured from minYear. */
|
|
965
|
+
private yearPageStartFor;
|
|
966
|
+
protected toggleMonthMenu(event: Event): void;
|
|
967
|
+
protected toggleYearMenu(event: Event): void;
|
|
968
|
+
protected prevYearPage(event: Event): void;
|
|
969
|
+
protected nextYearPage(event: Event): void;
|
|
970
|
+
protected closeMenus(): void;
|
|
971
|
+
protected selectMonth(index: number, event: Event): void;
|
|
972
|
+
protected selectYear(year: number, event: Event): void;
|
|
790
973
|
protected readonly daysGrid: _angular_core.Signal<DayCell[]>;
|
|
791
974
|
private getRangeContext;
|
|
792
975
|
protected open(): void;
|
|
@@ -794,9 +977,8 @@ declare class DatePickerComponent {
|
|
|
794
977
|
protected prevMonth(): void;
|
|
795
978
|
protected nextMonth(): void;
|
|
796
979
|
protected selectDay(cell: DayCell): void;
|
|
797
|
-
protected cellClasses(cell: DayCell): string;
|
|
798
980
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DatePickerComponent, never>;
|
|
799
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatePickerComponent, "ds-date-picker", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
981
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DatePickerComponent, "ds-date-picker", never, { "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "required": { "alias": "required"; "required": false; "isSignal": true; }; "optional": { "alias": "optional"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "minYear": { "alias": "minYear"; "required": false; "isSignal": true; }; "maxYear": { "alias": "maxYear"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
800
982
|
}
|
|
801
983
|
|
|
802
984
|
interface BreadcrumbItem {
|
|
@@ -909,8 +1091,14 @@ declare class ModalComponent {
|
|
|
909
1091
|
readonly title: _angular_core.InputSignal<string>;
|
|
910
1092
|
readonly closed: _angular_core.OutputEmitterRef<void>;
|
|
911
1093
|
readonly confirmed: _angular_core.OutputEmitterRef<void>;
|
|
1094
|
+
/** Dialog is in the DOM (kept true through the leave animation). */
|
|
1095
|
+
protected readonly rendered: _angular_core.WritableSignal<boolean>;
|
|
1096
|
+
/** Playing the scrim fade-out leave animation. */
|
|
1097
|
+
protected readonly closing: _angular_core.WritableSignal<boolean>;
|
|
1098
|
+
private wasOpen;
|
|
912
1099
|
constructor();
|
|
913
1100
|
protected onClose(): void;
|
|
1101
|
+
protected onLeaveEnd(event: AnimationEvent): void;
|
|
914
1102
|
protected onBackdrop(event: MouseEvent): void;
|
|
915
1103
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalComponent, never>;
|
|
916
1104
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalComponent, "ds-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "danger": { "alias": "danger"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; "confirmed": "confirmed"; }, never, ["[body]", "[impact]", "[actions]"], true, [{ directive: typeof DsStaticPreview; inputs: { "staticPreview": "staticPreview"; }; outputs: {}; }]>;
|
|
@@ -921,12 +1109,37 @@ declare class ModalCardComponent {
|
|
|
921
1109
|
readonly danger: _angular_core.InputSignal<boolean>;
|
|
922
1110
|
readonly title: _angular_core.InputSignal<string>;
|
|
923
1111
|
readonly showClose: _angular_core.InputSignal<boolean>;
|
|
1112
|
+
readonly icon: _angular_core.InputSignal<IconName | null>;
|
|
1113
|
+
readonly dialogRole: _angular_core.InputSignal<"dialog" | "alertdialog">;
|
|
924
1114
|
readonly closed: _angular_core.OutputEmitterRef<void>;
|
|
925
1115
|
protected readonly titleId: string;
|
|
926
1116
|
protected readonly classes: _angular_core.Signal<string>;
|
|
927
1117
|
protected onClose(): void;
|
|
928
1118
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalCardComponent, never>;
|
|
929
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalCardComponent, "ds-modal-card", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "danger": { "alias": "danger"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "showClose": { "alias": "showClose"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["[body]", "[impact]", "[actions]"], true, never>;
|
|
1119
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ModalCardComponent, "ds-modal-card", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; "danger": { "alias": "danger"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": true; "isSignal": true; }; "showClose": { "alias": "showClose"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dialogRole": { "alias": "dialogRole"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, never, ["[body]", "[impact]", "[actions]"], true, never>;
|
|
1120
|
+
}
|
|
1121
|
+
|
|
1122
|
+
type ModalConfirmTone = 'default' | 'danger';
|
|
1123
|
+
interface ModalConfirmOptions {
|
|
1124
|
+
title: string;
|
|
1125
|
+
message?: string;
|
|
1126
|
+
confirmLabel?: string;
|
|
1127
|
+
cancelLabel?: string;
|
|
1128
|
+
tone?: ModalConfirmTone;
|
|
1129
|
+
icon?: IconName;
|
|
1130
|
+
/** When set, the confirm button stays disabled until the user types this
|
|
1131
|
+
* exact phrase — a guard for high-stakes destructive actions. */
|
|
1132
|
+
typeToConfirm?: string;
|
|
1133
|
+
}
|
|
1134
|
+
|
|
1135
|
+
declare class ModalService {
|
|
1136
|
+
private readonly overlay;
|
|
1137
|
+
private readonly injector;
|
|
1138
|
+
/** Open a confirmation dialog. Resolves true on confirm, false on cancel,
|
|
1139
|
+
* backdrop click or Escape. */
|
|
1140
|
+
confirm(options: ModalConfirmOptions): Promise<boolean>;
|
|
1141
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ModalService, never>;
|
|
1142
|
+
static ɵprov: _angular_core.ɵɵInjectableDeclaration<ModalService>;
|
|
930
1143
|
}
|
|
931
1144
|
|
|
932
1145
|
type BannerVariant = 'info' | 'success' | 'warning' | 'severe' | 'error' | 'neutral';
|
|
@@ -950,13 +1163,34 @@ declare class BannerComponent {
|
|
|
950
1163
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<BannerComponent, "ds-banner", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "compact": { "alias": "compact"; "required": false; "isSignal": true; }; "layout": { "alias": "layout"; "required": false; "isSignal": true; }; "accentRail": { "alias": "accentRail"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, never, ["*", "[actions]"], true, never>;
|
|
951
1164
|
}
|
|
952
1165
|
|
|
953
|
-
type
|
|
1166
|
+
type AlertVariant = 'info' | 'success' | 'warning' | 'error' | 'neutral';
|
|
1167
|
+
|
|
1168
|
+
declare class AlertComponent {
|
|
1169
|
+
readonly variant: _angular_core.InputSignal<AlertVariant>;
|
|
1170
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
1171
|
+
readonly dismissible: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1172
|
+
readonly icon: _angular_core.InputSignal<IconName | null>;
|
|
1173
|
+
readonly dismissed: _angular_core.OutputEmitterRef<void>;
|
|
1174
|
+
protected get ariaRole(): 'alert' | 'status';
|
|
1175
|
+
protected get ariaLive(): 'assertive' | 'polite';
|
|
1176
|
+
protected readonly classes: _angular_core.Signal<string>;
|
|
1177
|
+
protected readonly defaultIcon: _angular_core.Signal<IconName>;
|
|
1178
|
+
protected readonly resolvedIcon: _angular_core.Signal<IconName>;
|
|
1179
|
+
protected onDismiss(): void;
|
|
1180
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AlertComponent, never>;
|
|
1181
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AlertComponent, "ds-alert", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "dismissible": { "alias": "dismissible"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; }, { "dismissed": "dismissed"; }, never, ["*", "[actions]"], true, never>;
|
|
1182
|
+
}
|
|
1183
|
+
|
|
1184
|
+
type DropzoneFileState = 'queued' | 'uploading' | 'success' | 'error';
|
|
954
1185
|
interface DropzoneFile {
|
|
955
1186
|
id: string;
|
|
956
1187
|
name: string;
|
|
957
1188
|
size: number;
|
|
958
1189
|
state: DropzoneFileState;
|
|
959
1190
|
progress: number;
|
|
1191
|
+
/** Human-readable status shown in place of the bare state name
|
|
1192
|
+
* (e.g. "uploaded", "exceeds 10 MB limit"). */
|
|
1193
|
+
message?: string;
|
|
960
1194
|
}
|
|
961
1195
|
|
|
962
1196
|
declare class DropzoneComponent {
|
|
@@ -976,6 +1210,7 @@ declare class DropzoneComponent {
|
|
|
976
1210
|
protected onDrop(event: DragEvent): void;
|
|
977
1211
|
protected onPickerChange(event: Event): void;
|
|
978
1212
|
protected onRemove(file: DropzoneFile): void;
|
|
1213
|
+
protected fileMeta(file: DropzoneFile): string;
|
|
979
1214
|
protected formatSize(bytes: number): string;
|
|
980
1215
|
protected fileIcon(state: DropzoneFile['state']): 'file' | 'check' | 'error';
|
|
981
1216
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DropzoneComponent, never>;
|
|
@@ -1059,14 +1294,18 @@ declare class AccordionItemComponent {
|
|
|
1059
1294
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AccordionItemComponent, "ds-accordion-item", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "expanded": { "alias": "expanded"; "required": false; "isSignal": true; }; }, { "expanded": "expandedChange"; }, never, ["[badge]", "*"], true, never>;
|
|
1060
1295
|
}
|
|
1061
1296
|
|
|
1297
|
+
/** Where the step caption sits relative to its node: stacked beneath it
|
|
1298
|
+
* (`bottom`, full-width wizard) or beside it (`inline`, compact header row). */
|
|
1299
|
+
type StepperLabelPosition = 'bottom' | 'inline';
|
|
1062
1300
|
declare class StepperComponent {
|
|
1063
1301
|
readonly steps: _angular_core.InputSignal<readonly string[]>;
|
|
1064
1302
|
readonly current: _angular_core.InputSignal<number>;
|
|
1303
|
+
readonly labelPosition: _angular_core.InputSignal<StepperLabelPosition>;
|
|
1065
1304
|
protected stepState(i: number): 'completed' | 'current' | 'upcoming';
|
|
1066
1305
|
protected nodeClass(i: number): string;
|
|
1067
|
-
protected
|
|
1306
|
+
protected connectorClass(i: number): string;
|
|
1068
1307
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StepperComponent, never>;
|
|
1069
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StepperComponent, "ds-stepper", never, { "steps": { "alias": "steps"; "required": false; "isSignal": true; }; "current": { "alias": "current"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1308
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StepperComponent, "ds-stepper", never, { "steps": { "alias": "steps"; "required": false; "isSignal": true; }; "current": { "alias": "current"; "required": false; "isSignal": true; }; "labelPosition": { "alias": "labelPosition"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1070
1309
|
}
|
|
1071
1310
|
|
|
1072
1311
|
type TooltipPlacement = 'top' | 'bottom' | 'left' | 'right';
|
|
@@ -1195,7 +1434,7 @@ declare class ToastComponent {
|
|
|
1195
1434
|
protected onAction(action: ToastAction): void;
|
|
1196
1435
|
protected readonly classes: _angular_core.Signal<string>;
|
|
1197
1436
|
/** Errors/warnings interrupt (assertive); info/success wait their turn. */
|
|
1198
|
-
protected readonly role: _angular_core.Signal<"
|
|
1437
|
+
protected readonly role: _angular_core.Signal<"status" | "alert">;
|
|
1199
1438
|
protected readonly defaultIcon: _angular_core.Signal<IconName>;
|
|
1200
1439
|
protected onDismiss(): void;
|
|
1201
1440
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ToastComponent, never>;
|
|
@@ -1214,9 +1453,16 @@ declare class DrawerComponent {
|
|
|
1214
1453
|
readonly title: _angular_core.InputSignal<string>;
|
|
1215
1454
|
readonly closed: _angular_core.OutputEmitterRef<void>;
|
|
1216
1455
|
protected readonly titleId: string;
|
|
1456
|
+
/** Panel is in the DOM (kept true through the slide-out). */
|
|
1457
|
+
protected readonly rendered: _angular_core.WritableSignal<boolean>;
|
|
1458
|
+
/** Playing the slide-out + scrim-fade leave animation. */
|
|
1459
|
+
protected readonly closing: _angular_core.WritableSignal<boolean>;
|
|
1460
|
+
private wasOpen;
|
|
1217
1461
|
protected readonly classes: _angular_core.Signal<"drawer lg" | "drawer">;
|
|
1218
1462
|
constructor();
|
|
1219
1463
|
protected onClose(): void;
|
|
1464
|
+
protected onLeaveEnd(event: AnimationEvent): void;
|
|
1465
|
+
protected onEscape(): void;
|
|
1220
1466
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DrawerComponent, never>;
|
|
1221
1467
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DrawerComponent, "ds-drawer", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, never, ["[drawer-body]", "[drawer-footer]"], true, never>;
|
|
1222
1468
|
}
|
|
@@ -1234,13 +1480,19 @@ declare class BottomSheetComponent {
|
|
|
1234
1480
|
private readonly doc;
|
|
1235
1481
|
private readonly sheetRef;
|
|
1236
1482
|
protected readonly dragOffset: _angular_core.WritableSignal<number | null>;
|
|
1483
|
+
/** Sheet is in the DOM (kept true through the leave animation). */
|
|
1484
|
+
protected readonly rendered: _angular_core.WritableSignal<boolean>;
|
|
1485
|
+
/** Playing the slide-down + scrim-fade leave animation. */
|
|
1486
|
+
protected readonly closing: _angular_core.WritableSignal<boolean>;
|
|
1237
1487
|
private dragStartY;
|
|
1238
1488
|
private lastMoveY;
|
|
1239
1489
|
private lastMoveTime;
|
|
1240
1490
|
private velocity;
|
|
1241
1491
|
private previousBodyOverflow;
|
|
1492
|
+
private wasOpen;
|
|
1242
1493
|
constructor();
|
|
1243
1494
|
protected close(): void;
|
|
1495
|
+
protected onLeaveEnd(event: AnimationEvent): void;
|
|
1244
1496
|
protected onEscape(): void;
|
|
1245
1497
|
protected stop(event: Event): void;
|
|
1246
1498
|
protected onGrabStart(event: PointerEvent): void;
|
|
@@ -1285,20 +1537,28 @@ declare class PageFooterComponent {
|
|
|
1285
1537
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<PageFooterComponent, "ds-page-footer", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; }, {}, never, ["[brand]", "[nav]", "[actions]", "*"], true, never>;
|
|
1286
1538
|
}
|
|
1287
1539
|
|
|
1540
|
+
type ComboboxSize = 'sm' | 'md' | 'lg';
|
|
1288
1541
|
interface ComboboxOption<T = unknown> {
|
|
1289
1542
|
readonly value: T;
|
|
1290
1543
|
readonly label: string;
|
|
1291
1544
|
}
|
|
1292
1545
|
|
|
1293
|
-
declare class ComboboxComponent<T = unknown> {
|
|
1546
|
+
declare class ComboboxComponent<T = unknown> extends DsControlValueAccessor<T | readonly T[] | null> {
|
|
1294
1547
|
private readonly overlay;
|
|
1295
1548
|
private readonly vcr;
|
|
1296
1549
|
readonly options: _angular_core.InputSignal<readonly ComboboxOption<T>[]>;
|
|
1297
1550
|
readonly value: _angular_core.ModelSignal<T | readonly T[] | null>;
|
|
1298
1551
|
readonly multiple: _angular_core.InputSignal<boolean>;
|
|
1552
|
+
readonly size: _angular_core.InputSignal<ComboboxSize>;
|
|
1299
1553
|
readonly placeholder: _angular_core.InputSignal<string>;
|
|
1554
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1555
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1556
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1300
1557
|
/** Accessible name for the combobox input. */
|
|
1301
1558
|
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1559
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
1560
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
1561
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1302
1562
|
protected readonly query: _angular_core.WritableSignal<string>;
|
|
1303
1563
|
protected readonly isOpen: _angular_core.WritableSignal<boolean>;
|
|
1304
1564
|
protected readonly activeIndex: _angular_core.WritableSignal<number>;
|
|
@@ -1325,7 +1585,7 @@ declare class ComboboxComponent<T = unknown> {
|
|
|
1325
1585
|
protected onPick(option: ComboboxOption<T>): void;
|
|
1326
1586
|
protected remove(target: T): void;
|
|
1327
1587
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ComboboxComponent<any>, never>;
|
|
1328
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ComboboxComponent<any>, "ds-combobox", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1588
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ComboboxComponent<any>, "ds-combobox", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "multiple": { "alias": "multiple"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1329
1589
|
}
|
|
1330
1590
|
|
|
1331
1591
|
type DividerVariant = 'default' | 'strong' | 'vertical' | 'label';
|
|
@@ -1343,6 +1603,373 @@ declare class DividerComponent {
|
|
|
1343
1603
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DividerComponent, "ds-divider", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "spacing": { "alias": "spacing"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1344
1604
|
}
|
|
1345
1605
|
|
|
1606
|
+
type DescriptionListOrientation = 'horizontal' | 'stacked';
|
|
1607
|
+
declare class DescriptionListComponent {
|
|
1608
|
+
readonly orientation: _angular_core.InputSignal<DescriptionListOrientation>;
|
|
1609
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DescriptionListComponent, never>;
|
|
1610
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DescriptionListComponent, "ds-description-list", never, { "orientation": { "alias": "orientation"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1611
|
+
}
|
|
1612
|
+
|
|
1613
|
+
declare class DescriptionItemComponent {
|
|
1614
|
+
private readonly list;
|
|
1615
|
+
readonly term: _angular_core.InputSignal<string>;
|
|
1616
|
+
readonly copyValue: _angular_core.InputSignal<string | null>;
|
|
1617
|
+
protected readonly stacked: _angular_core.Signal<boolean>;
|
|
1618
|
+
protected readonly copied: _angular_core.WritableSignal<boolean>;
|
|
1619
|
+
protected copy(): Promise<void>;
|
|
1620
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<DescriptionItemComponent, never>;
|
|
1621
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<DescriptionItemComponent, "ds-description-item", never, { "term": { "alias": "term"; "required": false; "isSignal": true; }; "copyValue": { "alias": "copyValue"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1622
|
+
}
|
|
1623
|
+
|
|
1624
|
+
type LayoutGap = 'none' | 'xs' | 'sm' | 'md' | 'lg' | 'xl';
|
|
1625
|
+
type LayoutAlign = 'start' | 'center' | 'end' | 'stretch';
|
|
1626
|
+
type LayoutJustify = 'start' | 'center' | 'end' | 'between';
|
|
1627
|
+
type ContainerSize = 'sm' | 'md' | 'lg' | 'xl' | 'full';
|
|
1628
|
+
|
|
1629
|
+
declare class StackComponent {
|
|
1630
|
+
readonly gap: _angular_core.InputSignal<LayoutGap | null>;
|
|
1631
|
+
readonly align: _angular_core.InputSignal<LayoutAlign | null>;
|
|
1632
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<StackComponent, never>;
|
|
1633
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<StackComponent, "ds-stack", never, { "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1634
|
+
}
|
|
1635
|
+
|
|
1636
|
+
declare class InlineComponent {
|
|
1637
|
+
readonly gap: _angular_core.InputSignal<LayoutGap | null>;
|
|
1638
|
+
readonly align: _angular_core.InputSignal<LayoutAlign | null>;
|
|
1639
|
+
readonly justify: _angular_core.InputSignal<LayoutJustify | null>;
|
|
1640
|
+
readonly wrap: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1641
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<InlineComponent, never>;
|
|
1642
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<InlineComponent, "ds-inline", never, { "gap": { "alias": "gap"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "justify": { "alias": "justify"; "required": false; "isSignal": true; }; "wrap": { "alias": "wrap"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1643
|
+
}
|
|
1644
|
+
|
|
1645
|
+
declare class ContainerComponent {
|
|
1646
|
+
readonly size: _angular_core.InputSignal<ContainerSize>;
|
|
1647
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ContainerComponent, never>;
|
|
1648
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ContainerComponent, "ds-container", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1649
|
+
}
|
|
1650
|
+
|
|
1651
|
+
interface SegmentedOption {
|
|
1652
|
+
label: string;
|
|
1653
|
+
value: string;
|
|
1654
|
+
icon?: IconName;
|
|
1655
|
+
disabled?: boolean;
|
|
1656
|
+
}
|
|
1657
|
+
|
|
1658
|
+
declare class SegmentedComponent {
|
|
1659
|
+
readonly options: _angular_core.InputSignal<readonly SegmentedOption[]>;
|
|
1660
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
1661
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1662
|
+
private readonly buttons;
|
|
1663
|
+
protected readonly focusableValue: _angular_core.Signal<string | null>;
|
|
1664
|
+
protected select(option: SegmentedOption): void;
|
|
1665
|
+
protected onKeydown(event: KeyboardEvent, index: number): void;
|
|
1666
|
+
private nextEnabled;
|
|
1667
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SegmentedComponent, never>;
|
|
1668
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SegmentedComponent, "ds-segmented", never, { "options": { "alias": "options"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1669
|
+
}
|
|
1670
|
+
|
|
1671
|
+
declare class ButtonGroupComponent {
|
|
1672
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1673
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ButtonGroupComponent, never>;
|
|
1674
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ButtonGroupComponent, "ds-button-group", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1675
|
+
}
|
|
1676
|
+
|
|
1677
|
+
declare class ListComponent {
|
|
1678
|
+
readonly dividers: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1679
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ListComponent, never>;
|
|
1680
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ListComponent, "ds-list", never, { "dividers": { "alias": "dividers"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1681
|
+
}
|
|
1682
|
+
|
|
1683
|
+
declare class ListItemComponent {
|
|
1684
|
+
readonly title: _angular_core.InputSignal<string>;
|
|
1685
|
+
readonly subtitle: _angular_core.InputSignal<string>;
|
|
1686
|
+
readonly clickable: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1687
|
+
readonly selected: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1688
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1689
|
+
readonly activated: _angular_core.OutputEmitterRef<void>;
|
|
1690
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ListItemComponent, never>;
|
|
1691
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ListItemComponent, "ds-list-item", never, { "title": { "alias": "title"; "required": false; "isSignal": true; }; "subtitle": { "alias": "subtitle"; "required": false; "isSignal": true; }; "clickable": { "alias": "clickable"; "required": false; "isSignal": true; }; "selected": { "alias": "selected"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "activated": "activated"; }, never, ["[leading]", "*", "[trailing]"], true, never>;
|
|
1692
|
+
}
|
|
1693
|
+
|
|
1694
|
+
type SplitButtonVariant = 'primary' | 'outline';
|
|
1695
|
+
interface SplitButtonItem {
|
|
1696
|
+
label: string;
|
|
1697
|
+
value?: string;
|
|
1698
|
+
icon?: IconName;
|
|
1699
|
+
disabled?: boolean;
|
|
1700
|
+
danger?: boolean;
|
|
1701
|
+
}
|
|
1702
|
+
|
|
1703
|
+
declare class SplitButtonComponent {
|
|
1704
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1705
|
+
readonly variant: _angular_core.InputSignal<SplitButtonVariant>;
|
|
1706
|
+
readonly icon: _angular_core.InputSignal<IconName | null>;
|
|
1707
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1708
|
+
readonly menuItems: _angular_core.InputSignal<readonly SplitButtonItem[]>;
|
|
1709
|
+
/** Accessible name for the dropdown trigger. */
|
|
1710
|
+
readonly menuLabel: _angular_core.InputSignal<string>;
|
|
1711
|
+
readonly pressed: _angular_core.OutputEmitterRef<MouseEvent>;
|
|
1712
|
+
readonly itemSelect: _angular_core.OutputEmitterRef<SplitButtonItem>;
|
|
1713
|
+
protected onItemSelect(item: SplitButtonItem): void;
|
|
1714
|
+
protected onTriggerKeydown(event: KeyboardEvent, popover: PopoverComponent, trigger: HTMLElement): void;
|
|
1715
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SplitButtonComponent, never>;
|
|
1716
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SplitButtonComponent, "ds-split-button", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "menuItems": { "alias": "menuItems"; "required": false; "isSignal": true; }; "menuLabel": { "alias": "menuLabel"; "required": false; "isSignal": true; }; }, { "pressed": "pressed"; "itemSelect": "itemSelect"; }, never, ["*"], true, never>;
|
|
1717
|
+
}
|
|
1718
|
+
|
|
1719
|
+
declare class TimelineComponent {
|
|
1720
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TimelineComponent, never>;
|
|
1721
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TimelineComponent, "ds-timeline", never, {}, {}, never, ["*"], true, never>;
|
|
1722
|
+
}
|
|
1723
|
+
|
|
1724
|
+
type TimelineTone = 'default' | 'primary' | 'success' | 'warning' | 'error' | 'muted';
|
|
1725
|
+
declare class TimelineItemComponent {
|
|
1726
|
+
readonly heading: _angular_core.InputSignal<string>;
|
|
1727
|
+
readonly time: _angular_core.InputSignal<string>;
|
|
1728
|
+
readonly icon: _angular_core.InputSignal<IconName | null>;
|
|
1729
|
+
readonly tone: _angular_core.InputSignal<TimelineTone>;
|
|
1730
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TimelineItemComponent, never>;
|
|
1731
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TimelineItemComponent, "ds-timeline-item", never, { "heading": { "alias": "heading"; "required": false; "isSignal": true; }; "time": { "alias": "time"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "tone": { "alias": "tone"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1732
|
+
}
|
|
1733
|
+
|
|
1734
|
+
type OtpMode = 'numeric' | 'alphanumeric';
|
|
1735
|
+
declare class OtpInputComponent extends DsControlValueAccessor<string> {
|
|
1736
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
1737
|
+
readonly length: _angular_core.InputSignal<number>;
|
|
1738
|
+
readonly mode: _angular_core.InputSignal<OtpMode>;
|
|
1739
|
+
readonly mask: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1740
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1741
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1742
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1743
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
1744
|
+
readonly completed: _angular_core.OutputEmitterRef<string>;
|
|
1745
|
+
private readonly boxes;
|
|
1746
|
+
private wasComplete;
|
|
1747
|
+
protected readonly uid: string;
|
|
1748
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
1749
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1750
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
1751
|
+
protected readonly cells: _angular_core.Signal<string[]>;
|
|
1752
|
+
protected onInput(event: Event, index: number): void;
|
|
1753
|
+
protected onKeydown(event: KeyboardEvent, index: number): void;
|
|
1754
|
+
protected onPaste(event: ClipboardEvent, index: number): void;
|
|
1755
|
+
protected onFocus(event: FocusEvent, index: number): void;
|
|
1756
|
+
protected cellLabel(index: number): string;
|
|
1757
|
+
protected onBlur(): void;
|
|
1758
|
+
private writeCell;
|
|
1759
|
+
private distribute;
|
|
1760
|
+
private commit;
|
|
1761
|
+
private firstEmptyIndex;
|
|
1762
|
+
private focusBox;
|
|
1763
|
+
private sanitize;
|
|
1764
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<OtpInputComponent, never>;
|
|
1765
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<OtpInputComponent, "ds-otp-input", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "length": { "alias": "length"; "required": false; "isSignal": true; }; "mode": { "alias": "mode"; "required": false; "isSignal": true; }; "mask": { "alias": "mask"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; "completed": "completed"; }, never, never, true, never>;
|
|
1766
|
+
}
|
|
1767
|
+
|
|
1768
|
+
type SliderValue = number | readonly [number, number];
|
|
1769
|
+
declare class SliderComponent extends DsControlValueAccessor<SliderValue> {
|
|
1770
|
+
readonly value: _angular_core.ModelSignal<SliderValue>;
|
|
1771
|
+
readonly min: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1772
|
+
readonly max: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1773
|
+
readonly step: _angular_core.InputSignalWithTransform<number, unknown>;
|
|
1774
|
+
readonly range: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1775
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1776
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1777
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
1778
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1779
|
+
private readonly track;
|
|
1780
|
+
private dragging;
|
|
1781
|
+
protected readonly uid: string;
|
|
1782
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
1783
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1784
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
1785
|
+
protected readonly thumbValues: _angular_core.Signal<number[]>;
|
|
1786
|
+
protected readonly fill: _angular_core.Signal<{
|
|
1787
|
+
left: number;
|
|
1788
|
+
width: number;
|
|
1789
|
+
}>;
|
|
1790
|
+
protected percent(value: number): number;
|
|
1791
|
+
protected thumbMin(index: number): number;
|
|
1792
|
+
protected thumbMax(index: number): number;
|
|
1793
|
+
protected onTrackPointerDown(event: PointerEvent): void;
|
|
1794
|
+
protected onTrackPointerMove(event: PointerEvent): void;
|
|
1795
|
+
protected onTrackPointerUp(event: PointerEvent): void;
|
|
1796
|
+
protected thumbAriaLabel(index: number): string | null;
|
|
1797
|
+
protected onThumbKeydown(event: KeyboardEvent, index: number): void;
|
|
1798
|
+
private nearestThumb;
|
|
1799
|
+
private updateFromClientX;
|
|
1800
|
+
private valueFromClientX;
|
|
1801
|
+
private setThumb;
|
|
1802
|
+
private snap;
|
|
1803
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SliderComponent, never>;
|
|
1804
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SliderComponent, "ds-slider", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "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; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1805
|
+
}
|
|
1806
|
+
|
|
1807
|
+
type SpinnerSize = 'sm' | 'md' | 'lg';
|
|
1808
|
+
|
|
1809
|
+
declare class LoadingOverlayComponent {
|
|
1810
|
+
readonly loading: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1811
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1812
|
+
readonly blur: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1813
|
+
readonly spinnerSize: _angular_core.InputSignal<SpinnerSize>;
|
|
1814
|
+
readonly insetTop: _angular_core.InputSignal<string>;
|
|
1815
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<LoadingOverlayComponent, never>;
|
|
1816
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<LoadingOverlayComponent, "ds-loading-overlay", never, { "loading": { "alias": "loading"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; "blur": { "alias": "blur"; "required": false; "isSignal": true; }; "spinnerSize": { "alias": "spinnerSize"; "required": false; "isSignal": true; }; "insetTop": { "alias": "insetTop"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1817
|
+
}
|
|
1818
|
+
|
|
1819
|
+
interface TreeNode {
|
|
1820
|
+
id: string;
|
|
1821
|
+
label: string;
|
|
1822
|
+
icon?: IconName;
|
|
1823
|
+
children?: TreeNode[];
|
|
1824
|
+
disabled?: boolean;
|
|
1825
|
+
}
|
|
1826
|
+
|
|
1827
|
+
interface VisibleNode {
|
|
1828
|
+
node: TreeNode;
|
|
1829
|
+
level: number;
|
|
1830
|
+
hasChildren: boolean;
|
|
1831
|
+
expanded: boolean;
|
|
1832
|
+
}
|
|
1833
|
+
declare class TreeComponent {
|
|
1834
|
+
private readonly host;
|
|
1835
|
+
readonly nodes: _angular_core.InputSignal<readonly TreeNode[]>;
|
|
1836
|
+
readonly expandedIds: _angular_core.ModelSignal<Set<string>>;
|
|
1837
|
+
readonly selectedId: _angular_core.ModelSignal<string | null>;
|
|
1838
|
+
readonly nodeSelect: _angular_core.OutputEmitterRef<TreeNode>;
|
|
1839
|
+
private readonly activeId;
|
|
1840
|
+
protected readonly visibleNodes: _angular_core.Signal<VisibleNode[]>;
|
|
1841
|
+
protected readonly effectiveActiveId: _angular_core.Signal<string>;
|
|
1842
|
+
protected isExpanded(id: string): boolean;
|
|
1843
|
+
protected isSelected(id: string): boolean;
|
|
1844
|
+
protected isActive(id: string): boolean;
|
|
1845
|
+
protected onRowClick(entry: VisibleNode): void;
|
|
1846
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
1847
|
+
private toggle;
|
|
1848
|
+
private select;
|
|
1849
|
+
private moveActive;
|
|
1850
|
+
private moveToParent;
|
|
1851
|
+
private focusNode;
|
|
1852
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<TreeComponent, never>;
|
|
1853
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<TreeComponent, "ds-tree", never, { "nodes": { "alias": "nodes"; "required": false; "isSignal": true; }; "expandedIds": { "alias": "expandedIds"; "required": false; "isSignal": true; }; "selectedId": { "alias": "selectedId"; "required": false; "isSignal": true; }; }, { "expandedIds": "expandedIdsChange"; "selectedId": "selectedIdChange"; "nodeSelect": "nodeSelect"; }, never, never, true, never>;
|
|
1854
|
+
}
|
|
1855
|
+
|
|
1856
|
+
/** Hue 0–360, saturation/value 0–100 — the model the Photoshop-style picker
|
|
1857
|
+
* manipulates. Hex is the public value; these convert between the two. */
|
|
1858
|
+
interface Hsv {
|
|
1859
|
+
h: number;
|
|
1860
|
+
s: number;
|
|
1861
|
+
v: number;
|
|
1862
|
+
}
|
|
1863
|
+
|
|
1864
|
+
declare class ColorPickerComponent extends DsControlValueAccessor<string> implements DsOverlayCloseRef {
|
|
1865
|
+
private readonly overlay;
|
|
1866
|
+
private readonly vcr;
|
|
1867
|
+
private readonly host;
|
|
1868
|
+
readonly value: _angular_core.ModelSignal<string>;
|
|
1869
|
+
readonly presets: _angular_core.InputSignal<readonly string[]>;
|
|
1870
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1871
|
+
readonly ariaLabel: _angular_core.InputSignal<string>;
|
|
1872
|
+
readonly invalid: _angular_core.InputSignal<boolean>;
|
|
1873
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1874
|
+
protected readonly trigger: _angular_core.Signal<ElementRef<HTMLButtonElement>>;
|
|
1875
|
+
protected readonly panelTpl: _angular_core.Signal<TemplateRef<unknown>>;
|
|
1876
|
+
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
1877
|
+
protected readonly hsv: _angular_core.WritableSignal<Hsv>;
|
|
1878
|
+
private overlayRef;
|
|
1879
|
+
private svDragging;
|
|
1880
|
+
private hueDragging;
|
|
1881
|
+
constructor();
|
|
1882
|
+
protected readonly uid: string;
|
|
1883
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
1884
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1885
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
1886
|
+
protected readonly displayHex: _angular_core.Signal<string>;
|
|
1887
|
+
protected readonly hueColor: _angular_core.Signal<string>;
|
|
1888
|
+
protected readonly svThumb: _angular_core.Signal<{
|
|
1889
|
+
left: number;
|
|
1890
|
+
top: number;
|
|
1891
|
+
}>;
|
|
1892
|
+
protected readonly huePercent: _angular_core.Signal<number>;
|
|
1893
|
+
protected toggle(): void;
|
|
1894
|
+
protected selectPreset(hex: string): void;
|
|
1895
|
+
protected isSelected(hex: string): boolean;
|
|
1896
|
+
protected onHexInput(event: Event): void;
|
|
1897
|
+
protected onSvPointerDown(event: PointerEvent): void;
|
|
1898
|
+
protected onSvPointerMove(event: PointerEvent): void;
|
|
1899
|
+
protected onSvPointerUp(event: PointerEvent): void;
|
|
1900
|
+
protected onSvKeydown(event: KeyboardEvent): void;
|
|
1901
|
+
protected onHuePointerDown(event: PointerEvent): void;
|
|
1902
|
+
protected onHuePointerMove(event: PointerEvent): void;
|
|
1903
|
+
protected onHuePointerUp(event: PointerEvent): void;
|
|
1904
|
+
protected onHueKeydown(event: KeyboardEvent): void;
|
|
1905
|
+
private openPanel;
|
|
1906
|
+
close(): void;
|
|
1907
|
+
private setHsv;
|
|
1908
|
+
private commitHex;
|
|
1909
|
+
private updateSv;
|
|
1910
|
+
private updateHue;
|
|
1911
|
+
private clampPct;
|
|
1912
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<ColorPickerComponent, never>;
|
|
1913
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<ColorPickerComponent, "ds-color-picker", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "presets": { "alias": "presets"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1914
|
+
}
|
|
1915
|
+
|
|
1916
|
+
interface MultiSelectOption {
|
|
1917
|
+
label: string;
|
|
1918
|
+
value: string;
|
|
1919
|
+
disabled?: boolean;
|
|
1920
|
+
}
|
|
1921
|
+
|
|
1922
|
+
declare class MultiSelectComponent extends DsControlValueAccessor<string[]> {
|
|
1923
|
+
private readonly overlay;
|
|
1924
|
+
private readonly vcr;
|
|
1925
|
+
readonly value: _angular_core.ModelSignal<string[]>;
|
|
1926
|
+
readonly options: _angular_core.InputSignal<readonly MultiSelectOption[]>;
|
|
1927
|
+
readonly placeholder: _angular_core.InputSignal<string>;
|
|
1928
|
+
readonly searchPlaceholder: _angular_core.InputSignal<string>;
|
|
1929
|
+
readonly maxVisibleChips: _angular_core.InputSignalWithTransform<number | null, number | null>;
|
|
1930
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1931
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1932
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1933
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
1934
|
+
readonly selectAll: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1935
|
+
protected readonly uid: string;
|
|
1936
|
+
protected readonly listboxId: string;
|
|
1937
|
+
protected optionId(index: number): string;
|
|
1938
|
+
protected readonly trigger: _angular_core.Signal<ElementRef<HTMLElement>>;
|
|
1939
|
+
protected readonly searchInput: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
|
|
1940
|
+
protected readonly panelTpl: _angular_core.Signal<TemplateRef<unknown>>;
|
|
1941
|
+
protected readonly open: _angular_core.WritableSignal<boolean>;
|
|
1942
|
+
protected readonly filter: _angular_core.WritableSignal<string>;
|
|
1943
|
+
protected readonly activeIndex: _angular_core.WritableSignal<number>;
|
|
1944
|
+
private overlayRef;
|
|
1945
|
+
private focusTimer;
|
|
1946
|
+
constructor();
|
|
1947
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
1948
|
+
protected readonly selectedOptions: _angular_core.Signal<MultiSelectOption[]>;
|
|
1949
|
+
protected readonly visibleChips: _angular_core.Signal<MultiSelectOption[]>;
|
|
1950
|
+
protected readonly overflowCount: _angular_core.Signal<number>;
|
|
1951
|
+
protected readonly filteredOptions: _angular_core.Signal<MultiSelectOption[]>;
|
|
1952
|
+
protected readonly activeDescendant: _angular_core.Signal<string | null>;
|
|
1953
|
+
protected readonly resolvedAriaLabel: _angular_core.Signal<string>;
|
|
1954
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
1955
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1956
|
+
private enabledFiltered;
|
|
1957
|
+
protected readonly allFilteredSelected: _angular_core.Signal<boolean>;
|
|
1958
|
+
protected readonly someFilteredSelected: _angular_core.Signal<boolean>;
|
|
1959
|
+
protected toggleSelectAll(): void;
|
|
1960
|
+
protected isSelected(value: string): boolean;
|
|
1961
|
+
protected toggleValue(option: MultiSelectOption): void;
|
|
1962
|
+
protected removeValue(value: string): void;
|
|
1963
|
+
protected onFilter(event: Event): void;
|
|
1964
|
+
protected onTriggerKeydown(event: KeyboardEvent): void;
|
|
1965
|
+
protected onSearchKeydown(event: KeyboardEvent): void;
|
|
1966
|
+
protected openPanel(): void;
|
|
1967
|
+
protected close(): void;
|
|
1968
|
+
private moveActive;
|
|
1969
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<MultiSelectComponent, never>;
|
|
1970
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<MultiSelectComponent, "ds-multi-select", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "options": { "alias": "options"; "required": false; "isSignal": true; }; "placeholder": { "alias": "placeholder"; "required": false; "isSignal": true; }; "searchPlaceholder": { "alias": "searchPlaceholder"; "required": false; "isSignal": true; }; "maxVisibleChips": { "alias": "maxVisibleChips"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "selectAll": { "alias": "selectAll"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, never, never, true, never>;
|
|
1971
|
+
}
|
|
1972
|
+
|
|
1346
1973
|
declare class SkeletonComponent {
|
|
1347
1974
|
readonly width: _angular_core.InputSignal<string | undefined>;
|
|
1348
1975
|
readonly height: _angular_core.InputSignal<string | undefined>;
|
|
@@ -1352,47 +1979,122 @@ declare class SkeletonComponent {
|
|
|
1352
1979
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SkeletonComponent, "ds-skeleton", never, { "width": { "alias": "width"; "required": false; "isSignal": true; }; "height": { "alias": "height"; "required": false; "isSignal": true; }; "circle": { "alias": "circle"; "required": false; "isSignal": true; }; "inline": { "alias": "inline"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1353
1980
|
}
|
|
1354
1981
|
|
|
1355
|
-
type SpinnerSize = 'sm' | 'md' | 'lg';
|
|
1356
|
-
|
|
1357
1982
|
declare class SpinnerComponent {
|
|
1358
1983
|
readonly size: _angular_core.InputSignal<SpinnerSize>;
|
|
1359
1984
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SpinnerComponent, never>;
|
|
1360
1985
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SpinnerComponent, "ds-spinner", never, { "size": { "alias": "size"; "required": false; "isSignal": true; }; }, {}, never, never, true, never>;
|
|
1361
1986
|
}
|
|
1362
1987
|
|
|
1363
|
-
declare class CheckboxComponent {
|
|
1988
|
+
declare class CheckboxComponent extends DsBooleanControlValueAccessor {
|
|
1364
1989
|
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
1365
1990
|
readonly indeterminate: _angular_core.InputSignal<boolean>;
|
|
1366
1991
|
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
1367
1992
|
readonly name: _angular_core.InputSignal<string | null>;
|
|
1368
1993
|
readonly inputId: _angular_core.InputSignal<string | null>;
|
|
1369
|
-
|
|
1994
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1995
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
1996
|
+
/** Inline label rendered beside the box and wired via for/id. Omit to
|
|
1997
|
+
* bring your own <label>. */
|
|
1998
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
1999
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
2000
|
+
protected readonly uid: string;
|
|
2001
|
+
protected readonly controlId: _angular_core.Signal<string>;
|
|
2002
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
2003
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
2004
|
+
protected onCheckedChange(event: Event): void;
|
|
1370
2005
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<CheckboxComponent, never>;
|
|
1371
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxComponent, "ds-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
2006
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<CheckboxComponent, "ds-checkbox", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "indeterminate": { "alias": "indeterminate"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
1372
2007
|
}
|
|
1373
2008
|
|
|
1374
2009
|
declare class RadioComponent {
|
|
2010
|
+
/** Standalone two-way binding. When inside ds-radio-group, isChecked() is
|
|
2011
|
+
* derived from the group value instead. */
|
|
1375
2012
|
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
1376
2013
|
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
1377
2014
|
readonly name: _angular_core.InputSignal<string>;
|
|
1378
|
-
readonly value: _angular_core.InputSignal<
|
|
2015
|
+
readonly value: _angular_core.InputSignal<unknown>;
|
|
1379
2016
|
readonly inputId: _angular_core.InputSignal<string | null>;
|
|
1380
|
-
|
|
2017
|
+
/** Inline label rendered beside the dot and wired via for/id. Omit to bring
|
|
2018
|
+
* your own <label>. */
|
|
2019
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2020
|
+
protected readonly uid: string;
|
|
2021
|
+
protected readonly controlId: _angular_core.Signal<string>;
|
|
2022
|
+
/** Injected via token to avoid circular import with RadioGroupComponent. */
|
|
2023
|
+
protected readonly group: _ids_group_ltd_ids_design_system.RadioGroupContract | null;
|
|
2024
|
+
readonly effectiveDisabled: _angular_core.Signal<boolean>;
|
|
2025
|
+
protected readonly effectiveName: _angular_core.Signal<string>;
|
|
2026
|
+
protected readonly isChecked: _angular_core.Signal<boolean>;
|
|
2027
|
+
/** Exposed so the group can implement roving tabindex. */
|
|
2028
|
+
readonly inputElement: _angular_core.Signal<ElementRef<HTMLInputElement> | undefined>;
|
|
2029
|
+
protected get tabIndexAttr(): 0 | -1;
|
|
2030
|
+
/** Called by the group's keyboard handler to focus this radio's input. */
|
|
2031
|
+
focus(): void;
|
|
2032
|
+
protected onSelect(): void;
|
|
1381
2033
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioComponent, never>;
|
|
1382
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioComponent, "ds-radio", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
2034
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioComponent, "ds-radio", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
2035
|
+
}
|
|
2036
|
+
|
|
2037
|
+
/** Contract that ds-radio reads from its parent ds-radio-group, injected via
|
|
2038
|
+
* token to avoid a circular import (radio-group → RadioComponent for
|
|
2039
|
+
* contentChildren; radio → RadioGroupComponent for group injection). */
|
|
2040
|
+
interface RadioGroupContract {
|
|
2041
|
+
readonly value: () => unknown;
|
|
2042
|
+
readonly groupName: () => string;
|
|
2043
|
+
readonly isDisabled: () => boolean;
|
|
2044
|
+
isTabbable(radio: RadioGroupChild): boolean;
|
|
2045
|
+
select(value: unknown): void;
|
|
2046
|
+
}
|
|
2047
|
+
/** Contract the radio-group reads back from each projected radio. */
|
|
2048
|
+
interface RadioGroupChild {
|
|
2049
|
+
readonly value: () => unknown;
|
|
2050
|
+
readonly effectiveDisabled: () => boolean;
|
|
2051
|
+
focus(): void;
|
|
2052
|
+
}
|
|
2053
|
+
declare const RADIO_GROUP: InjectionToken<RadioGroupContract>;
|
|
2054
|
+
|
|
2055
|
+
declare class RadioGroupComponent extends DsControlValueAccessor<unknown> implements RadioGroupContract {
|
|
2056
|
+
readonly value: _angular_core.ModelSignal<unknown>;
|
|
2057
|
+
readonly name: _angular_core.InputSignal<string | null>;
|
|
2058
|
+
readonly disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2059
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2060
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
2061
|
+
readonly ariaLabel: _angular_core.InputSignal<string | null>;
|
|
2062
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2063
|
+
readonly isDisabled: _angular_core.Signal<boolean>;
|
|
2064
|
+
protected readonly uid: string;
|
|
2065
|
+
readonly groupName: _angular_core.Signal<string>;
|
|
2066
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
2067
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
2068
|
+
private readonly radios;
|
|
2069
|
+
private get enabledRadios();
|
|
2070
|
+
isTabbable(radio: RadioGroupChild): boolean;
|
|
2071
|
+
select(value: unknown): void;
|
|
2072
|
+
protected onKeydown(event: KeyboardEvent): void;
|
|
2073
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<RadioGroupComponent, never>;
|
|
2074
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<RadioGroupComponent, "ds-radio-group", never, { "value": { "alias": "value"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "value": "valueChange"; }, ["radios"], ["*"], true, never>;
|
|
1383
2075
|
}
|
|
1384
2076
|
|
|
1385
|
-
declare class SwitchComponent {
|
|
2077
|
+
declare class SwitchComponent extends DsBooleanControlValueAccessor {
|
|
1386
2078
|
readonly checked: _angular_core.ModelSignal<boolean>;
|
|
1387
2079
|
readonly disabled: _angular_core.InputSignal<boolean>;
|
|
1388
2080
|
readonly name: _angular_core.InputSignal<string | null>;
|
|
1389
2081
|
readonly variant: _angular_core.InputSignal<"error" | "success" | "default">;
|
|
1390
2082
|
readonly inputId: _angular_core.InputSignal<string | null>;
|
|
2083
|
+
readonly invalid: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
2084
|
+
readonly hint: _angular_core.InputSignal<string>;
|
|
2085
|
+
/** Inline label rendered beside the track and wired via for/id. Omit to
|
|
2086
|
+
* bring your own <label>. */
|
|
2087
|
+
readonly label: _angular_core.InputSignal<string>;
|
|
2088
|
+
protected readonly isDisabled: _angular_core.Signal<boolean>;
|
|
2089
|
+
protected readonly uid: string;
|
|
2090
|
+
protected readonly controlId: _angular_core.Signal<string>;
|
|
2091
|
+
protected readonly hintId: _angular_core.Signal<string | null>;
|
|
2092
|
+
protected readonly messageState: _angular_core.Signal<FieldMessageState>;
|
|
1391
2093
|
protected readonly classes: _angular_core.Signal<string>;
|
|
1392
|
-
protected
|
|
2094
|
+
protected onCheckedChange(event: Event): void;
|
|
1393
2095
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<SwitchComponent, never>;
|
|
1394
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SwitchComponent, "ds-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
2096
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<SwitchComponent, "ds-switch", never, { "checked": { "alias": "checked"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "name": { "alias": "name"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "inputId": { "alias": "inputId"; "required": false; "isSignal": true; }; "invalid": { "alias": "invalid"; "required": false; "isSignal": true; }; "hint": { "alias": "hint"; "required": false; "isSignal": true; }; "label": { "alias": "label"; "required": false; "isSignal": true; }; }, { "checked": "checkedChange"; }, never, never, true, never>;
|
|
1395
2097
|
}
|
|
1396
2098
|
|
|
1397
|
-
export { AccordionComponent, AccordionItemComponent, AvatarComponent, AvatarGroupComponent, BadgeComponent, BannerComponent, BottomSheetComponent, BreadcrumbsComponent, BreadcrumbsService, ButtonComponent, CardComponent, CellTemplateDirective, CheckboxComponent, ComboboxComponent, DS_CONFIG, DS_ICON_REGISTRY, DS_TOAST_POSITION, DS_TOAST_POSITION_DEFAULT, DatePickerComponent, DividerComponent, DrawerComponent, DropdownComponent, DropzoneComponent, DsOverlayCloseRef, DsStaticPreview, EmptyStateComponent, ICONS, IconButtonComponent, IconComponent, InputComponent, MenuComponent, MenuItemComponent, ModalCardComponent, ModalComponent, NumberStepperComponent, PageFooterComponent, PageHeaderComponent, PaginationComponent, PopoverComponent, ProgressComponent, RadioComponent, SearchComponent, SelectComponent, SidenavComponent, SidenavGroupComponent, SidenavItemComponent, SkeletonComponent, SpinnerComponent, StatComponent, StatusDotComponent, StepperComponent, SwitchComponent, TabComponent, TableComponent, TabsComponent, TagComponent, TextareaComponent, ToastComponent, ToastRegionComponent, ToastService, TooltipDirective, TooltipPanelComponent, TopBarComponent, W3wComponent, isSelectOptionGroup, provideDsConfig, provideDsIcons };
|
|
1398
|
-
export type { AvatarSize, BadgeLifecycle, BadgeSemantic, BadgeVariant, BannerVariant, BreadcrumbItem, ButtonSize, ButtonType, ButtonVariant, CardElevation, CardPadding, ComboboxOption, DatePickerMode, DatePickerValue, DateValue, DividerVariant, DrawerSize, DropdownOption, DropdownSize, DropzoneFile, DropzoneFileState, DsConfig, DsIconRegistry, DsToastHorizontalPosition, DsToastPosition, DsToastVerticalPosition, EmptyStateVariant, IconButtonSize, IconButtonType, IconButtonVariant, IconName, InputSize, InputType, ModalSize, NumberStepperSize, PageFooterVariant, ProgressVariant, RangeValue, SelectItem, SelectOption, SelectOptionGroup, SelectSize, SidenavItemModel, SortChangeEvent, SortDir, SpinnerSize, StatusValue, TableColumn, TabsVariant, TagVariant, TextareaResize, TextareaSize, ToastAction, ToastEntry, ToastOptions, ToastRef, ToastVariant, TooltipPlacement };
|
|
2099
|
+
export { AccordionComponent, AccordionItemComponent, AlertComponent, AvatarComponent, AvatarGroupComponent, BadgeComponent, BannerComponent, BottomSheetComponent, BreadcrumbsComponent, BreadcrumbsService, ButtonComponent, ButtonGroupComponent, CardComponent, CellTemplateDirective, CheckboxComponent, ColorPickerComponent, ComboboxComponent, ContainerComponent, DS_CONFIG, DS_ICON_REGISTRY, DS_TOAST_POSITION, DS_TOAST_POSITION_DEFAULT, DatePickerComponent, DescriptionItemComponent, DescriptionListComponent, DividerComponent, DrawerComponent, DropdownComponent, DropzoneComponent, DsOverlayCloseRef, DsStaticPreview, EmptyStateComponent, ICONS, IconButtonComponent, IconComponent, InlineComponent, InputComponent, ListComponent, ListItemComponent, LoadingOverlayComponent, MenuComponent, MenuItemComponent, ModalCardComponent, ModalComponent, ModalService, MultiSelectComponent, NumberStepperComponent, OtpInputComponent, PageFooterComponent, PageHeaderComponent, PaginationComponent, PopoverComponent, ProgressComponent, RADIO_GROUP, RadioComponent, RadioGroupComponent, SearchComponent, SegmentedComponent, SelectComponent, SidenavComponent, SidenavGroupComponent, SidenavItemComponent, SkeletonComponent, SliderComponent, SpinnerComponent, SplitButtonComponent, StackComponent, StatComponent, StatusDotComponent, StepperComponent, SwitchComponent, TabComponent, TableComponent, TabsComponent, TagComponent, TextareaComponent, TimelineComponent, TimelineItemComponent, ToastComponent, ToastRegionComponent, ToastService, ToggleButtonComponent, TooltipDirective, TooltipPanelComponent, TopBarComponent, TreeComponent, W3wComponent, isSelectOptionGroup, provideDsConfig, provideDsIcons, provideDsTheme };
|
|
2100
|
+
export type { AlertVariant, AvatarSize, BadgeLifecycle, BadgeSemantic, BadgeVariant, BannerVariant, BreadcrumbItem, ButtonColor, ButtonSize, ButtonType, ButtonVariant, CardElevation, CardPadding, ComboboxOption, ComboboxSize, ContainerSize, DatePickerMode, DatePickerValue, DateValue, DescriptionListOrientation, DividerVariant, DrawerSize, DropdownOption, DropdownSize, DropzoneFile, DropzoneFileState, DsConfig, DsIconRegistry, DsThemeOptions, DsToastHorizontalPosition, DsToastPosition, DsToastVerticalPosition, EmptyStateVariant, IconButtonSize, IconButtonType, IconButtonVariant, IconName, InputSize, InputType, LayoutAlign, LayoutGap, LayoutJustify, ModalConfirmOptions, ModalConfirmTone, ModalSize, MultiSelectOption, NumberStepperSize, OtpMode, PageFooterVariant, ProgressVariant, RadioGroupChild, RadioGroupContract, RangeValue, SegmentedOption, SelectItem, SelectOption, SelectOptionGroup, SelectSize, SidenavItemModel, SortChangeEvent, SortDir, SpinnerSize, SplitButtonItem, SplitButtonVariant, StatusValue, StepperLabelPosition, TableColumn, TabsVariant, TagVariant, TextareaResize, TextareaSize, TimelineTone, ToastAction, ToastEntry, ToastOptions, ToastRef, ToastVariant, TooltipPlacement, TreeNode };
|