@neuravision/ng-construct 0.1.0 → 0.3.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@neuravision/ng-construct",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.3.0",
|
|
4
4
|
"description": "Angular components for the Construct Design System",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"angular",
|
|
@@ -11,7 +11,8 @@
|
|
|
11
11
|
"peerDependencies": {
|
|
12
12
|
"@angular/common": "^21.1.0",
|
|
13
13
|
"@angular/core": "^21.1.0",
|
|
14
|
-
"@
|
|
14
|
+
"@angular/router": "^21.1.0",
|
|
15
|
+
"@neuravision/construct": "^1.0.0"
|
|
15
16
|
},
|
|
16
17
|
"dependencies": {
|
|
17
18
|
"tslib": "^2.3.0"
|
|
@@ -377,29 +377,36 @@ declare class AfCheckboxComponent implements ControlValueAccessor {
|
|
|
377
377
|
}
|
|
378
378
|
|
|
379
379
|
/**
|
|
380
|
-
*
|
|
380
|
+
* Individual radio button. Use inside `af-radio-group` for full
|
|
381
|
+
* accessibility, or standalone with its own `ControlValueAccessor`.
|
|
381
382
|
*
|
|
382
383
|
* @example
|
|
383
|
-
* <af-radio
|
|
384
|
-
* Standard
|
|
385
|
-
* </af-radio>
|
|
386
|
-
*
|
|
387
|
-
* Premium
|
|
388
|
-
* </af-radio>
|
|
384
|
+
* <af-radio-group ariaLabel="Plan" name="plan" [(ngModel)]="plan">
|
|
385
|
+
* <af-radio value="standard">Standard</af-radio>
|
|
386
|
+
* <af-radio value="premium">Premium</af-radio>
|
|
387
|
+
* </af-radio-group>
|
|
389
388
|
*/
|
|
390
389
|
declare class AfRadioComponent implements ControlValueAccessor {
|
|
391
|
-
|
|
390
|
+
private group;
|
|
391
|
+
/** Radio group name (only used without `af-radio-group`). */
|
|
392
392
|
name: _angular_core.InputSignal<string>;
|
|
393
|
-
/** Radio value */
|
|
393
|
+
/** Radio value. */
|
|
394
394
|
value: _angular_core.InputSignal<unknown>;
|
|
395
|
-
/** Whether radio is disabled */
|
|
395
|
+
/** Whether this radio is disabled. */
|
|
396
396
|
disabled: _angular_core.ModelSignal<boolean>;
|
|
397
|
+
inputRef: _angular_core.Signal<ElementRef<HTMLInputElement>>;
|
|
397
398
|
modelValue: _angular_core.WritableSignal<unknown>;
|
|
398
399
|
onChangeCallback: (value: unknown) => void;
|
|
399
400
|
onTouched: () => void;
|
|
401
|
+
resolvedName: _angular_core.Signal<any>;
|
|
400
402
|
isChecked: _angular_core.Signal<boolean>;
|
|
401
|
-
|
|
402
|
-
|
|
403
|
+
isDisabled: _angular_core.Signal<boolean>;
|
|
404
|
+
resolvedTabindex: _angular_core.Signal<any>;
|
|
405
|
+
/** Focuses the native input element. */
|
|
406
|
+
focus(): void;
|
|
407
|
+
onChangeEvent(): void;
|
|
408
|
+
onFocus(): void;
|
|
409
|
+
onKeydown(event: KeyboardEvent): void;
|
|
403
410
|
writeValue(value: unknown): void;
|
|
404
411
|
registerOnChange(fn: (value: unknown) => void): void;
|
|
405
412
|
registerOnTouched(fn: () => void): void;
|
|
@@ -407,6 +414,50 @@ declare class AfRadioComponent implements ControlValueAccessor {
|
|
|
407
414
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfRadioComponent, never>;
|
|
408
415
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfRadioComponent, "af-radio", never, { "name": { "alias": "name"; "required": false; "isSignal": true; }; "value": { "alias": "value"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; }, never, ["*"], true, never>;
|
|
409
416
|
}
|
|
417
|
+
/**
|
|
418
|
+
* Groups `af-radio` components with `role="radiogroup"`, ARIA labeling,
|
|
419
|
+
* roving tabindex, and arrow-key navigation per WAI-ARIA Radio Group Pattern.
|
|
420
|
+
*
|
|
421
|
+
* Implements `ControlValueAccessor` so the group value can be bound via
|
|
422
|
+
* `[(ngModel)]` or reactive forms.
|
|
423
|
+
*
|
|
424
|
+
* @example
|
|
425
|
+
* <af-radio-group ariaLabel="Select plan" name="plan" [(ngModel)]="plan">
|
|
426
|
+
* <af-radio value="standard">Standard</af-radio>
|
|
427
|
+
* <af-radio value="premium">Premium</af-radio>
|
|
428
|
+
* </af-radio-group>
|
|
429
|
+
*/
|
|
430
|
+
declare class AfRadioGroupComponent implements ControlValueAccessor {
|
|
431
|
+
/** Shared `name` attribute for all child radios. */
|
|
432
|
+
name: _angular_core.InputSignal<string>;
|
|
433
|
+
/** Accessible label for the radio group. */
|
|
434
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
435
|
+
/** ID of an external element labeling this group. */
|
|
436
|
+
ariaLabelledBy: _angular_core.InputSignal<string>;
|
|
437
|
+
/** Disables all radios in the group. */
|
|
438
|
+
disabled: _angular_core.ModelSignal<boolean>;
|
|
439
|
+
radios: _angular_core.Signal<readonly AfRadioComponent[]>;
|
|
440
|
+
selectedValue: _angular_core.WritableSignal<unknown>;
|
|
441
|
+
private focusedIndex;
|
|
442
|
+
private onChangeCallback;
|
|
443
|
+
private onTouchedCallback;
|
|
444
|
+
private syncEffect;
|
|
445
|
+
/** Returns the tabindex a child radio should use for roving tabindex. */
|
|
446
|
+
tabindexFor(radio: AfRadioComponent): number;
|
|
447
|
+
/** Selects a radio and propagates the value. */
|
|
448
|
+
selectRadio(radio: AfRadioComponent): void;
|
|
449
|
+
/** Called when a child radio receives focus. */
|
|
450
|
+
onRadioFocus(radio: AfRadioComponent): void;
|
|
451
|
+
/** Handles keyboard navigation within the group. */
|
|
452
|
+
onRadioKeydown(event: KeyboardEvent, _current: AfRadioComponent): void;
|
|
453
|
+
writeValue(value: unknown): void;
|
|
454
|
+
registerOnChange(fn: (value: unknown) => void): void;
|
|
455
|
+
registerOnTouched(fn: () => void): void;
|
|
456
|
+
setDisabledState(isDisabled: boolean): void;
|
|
457
|
+
private enabledRadios;
|
|
458
|
+
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfRadioGroupComponent, never>;
|
|
459
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfRadioGroupComponent, "af-radio-group", never, { "name": { "alias": "name"; "required": true; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "ariaLabelledBy": { "alias": "ariaLabelledBy"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; }, ["radios"], ["*"], true, never>;
|
|
460
|
+
}
|
|
410
461
|
|
|
411
462
|
/**
|
|
412
463
|
* Switch/Toggle component with form control support
|
|
@@ -417,7 +468,9 @@ declare class AfRadioComponent implements ControlValueAccessor {
|
|
|
417
468
|
* </af-switch>
|
|
418
469
|
*/
|
|
419
470
|
declare class AfSwitchComponent implements ControlValueAccessor {
|
|
420
|
-
/**
|
|
471
|
+
/** Accessible label for icon-only or unlabeled switches. */
|
|
472
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
473
|
+
/** Whether switch is disabled. */
|
|
421
474
|
disabled: _angular_core.ModelSignal<boolean>;
|
|
422
475
|
/** Checked state - supports two-way binding via [(checked)] */
|
|
423
476
|
checked: _angular_core.ModelSignal<boolean>;
|
|
@@ -430,44 +483,50 @@ declare class AfSwitchComponent implements ControlValueAccessor {
|
|
|
430
483
|
registerOnTouched(fn: () => void): void;
|
|
431
484
|
setDisabledState(isDisabled: boolean): void;
|
|
432
485
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfSwitchComponent, never>;
|
|
433
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfSwitchComponent, "af-switch", never, { "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "checked": "checkedChange"; }, never, ["*"], true, never>;
|
|
486
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfSwitchComponent, "af-switch", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; "checked": { "alias": "checked"; "required": false; "isSignal": true; }; }, { "disabled": "disabledChange"; "checked": "checkedChange"; }, never, ["*"], true, never>;
|
|
434
487
|
}
|
|
435
488
|
|
|
436
489
|
type AfCardElevation = 'none' | 'sm' | 'md' | 'lg';
|
|
437
490
|
type AfCardPadding = 'none' | 'sm' | 'md' | 'lg';
|
|
438
491
|
/**
|
|
439
|
-
* Card component for containing content
|
|
492
|
+
* Card component for containing content.
|
|
493
|
+
*
|
|
494
|
+
* When `interactive` is set the card becomes keyboard-accessible with
|
|
495
|
+
* `role="button"`, roving `tabindex`, and Enter/Space activation.
|
|
440
496
|
*
|
|
441
497
|
* @example
|
|
442
498
|
* <af-card elevation="md" padding="lg">
|
|
443
|
-
* <div header>
|
|
444
|
-
*
|
|
445
|
-
*
|
|
446
|
-
*
|
|
447
|
-
*
|
|
448
|
-
* </
|
|
499
|
+
* <div header><h3>Title</h3></div>
|
|
500
|
+
* <div body><p>Card content</p></div>
|
|
501
|
+
* </af-card>
|
|
502
|
+
*
|
|
503
|
+
* <af-card interactive ariaLabel="Open project" (cardClick)="open()">
|
|
504
|
+
* <p body>Click me</p>
|
|
449
505
|
* </af-card>
|
|
450
506
|
*/
|
|
451
507
|
declare class AfCardComponent {
|
|
452
|
-
/**
|
|
508
|
+
/** Makes the card interactive (clickable, keyboard-accessible). */
|
|
453
509
|
interactive: _angular_core.InputSignal<boolean>;
|
|
454
|
-
/** Shadow elevation level */
|
|
510
|
+
/** Shadow elevation level. */
|
|
455
511
|
elevation: _angular_core.InputSignal<AfCardElevation | null>;
|
|
456
|
-
/** Content padding level */
|
|
512
|
+
/** Content padding level. */
|
|
457
513
|
padding: _angular_core.InputSignal<AfCardPadding | null>;
|
|
458
|
-
/**
|
|
514
|
+
/** Accessible label for interactive cards. */
|
|
515
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
516
|
+
/** Emitted when an interactive card is activated (click, Enter, or Space). */
|
|
459
517
|
cardClick: _angular_core.OutputEmitterRef<void>;
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
518
|
+
private headerRef;
|
|
519
|
+
private footerRef;
|
|
520
|
+
hasHeader: _angular_core.Signal<boolean>;
|
|
521
|
+
hasFooter: _angular_core.Signal<boolean>;
|
|
464
522
|
private static readonly ELEVATION_MAP;
|
|
465
523
|
private static readonly PADDING_MAP;
|
|
466
524
|
cardClasses: _angular_core.Signal<string>;
|
|
467
525
|
cardStyles: _angular_core.Signal<string>;
|
|
468
526
|
onCardClick(): void;
|
|
527
|
+
onCardKeydown(event: KeyboardEvent): void;
|
|
469
528
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfCardComponent, never>;
|
|
470
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfCardComponent, "af-card", never, { "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "elevation": { "alias": "elevation"; "required": false; "isSignal": true; }; "padding": { "alias": "padding"; "required": false; "isSignal": true; }; }, { "cardClick": "cardClick"; }, ["
|
|
529
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfCardComponent, "af-card", never, { "interactive": { "alias": "interactive"; "required": false; "isSignal": true; }; "elevation": { "alias": "elevation"; "required": false; "isSignal": true; }; "padding": { "alias": "padding"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; }, { "cardClick": "cardClick"; }, ["headerRef", "footerRef"], ["[header]", "[body]", "*", "[footer]"], true, never>;
|
|
471
530
|
}
|
|
472
531
|
|
|
473
532
|
/**
|
|
@@ -597,6 +656,7 @@ declare class AfDataTableComponent {
|
|
|
597
656
|
*/
|
|
598
657
|
declare class AfModalComponent implements OnDestroy, AfterViewInit {
|
|
599
658
|
private static nextId;
|
|
659
|
+
private focusTrap;
|
|
600
660
|
/** Whether modal is open */
|
|
601
661
|
open: _angular_core.InputSignal<boolean>;
|
|
602
662
|
/** Modal title */
|
|
@@ -609,10 +669,8 @@ declare class AfModalComponent implements OnDestroy, AfterViewInit {
|
|
|
609
669
|
closed: _angular_core.OutputEmitterRef<void>;
|
|
610
670
|
/** Unique title ID for aria-labelledby */
|
|
611
671
|
titleId: string;
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
private previousActiveElement;
|
|
615
|
-
private focusableElements;
|
|
672
|
+
private footerRef;
|
|
673
|
+
hasFooter: _angular_core.Signal<boolean>;
|
|
616
674
|
private viewInitialized;
|
|
617
675
|
dialogRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
|
|
618
676
|
private openEffect;
|
|
@@ -623,10 +681,8 @@ declare class AfModalComponent implements OnDestroy, AfterViewInit {
|
|
|
623
681
|
onBackdropClick(event: MouseEvent): void;
|
|
624
682
|
close(): void;
|
|
625
683
|
private onOpen;
|
|
626
|
-
private restoreFocus;
|
|
627
|
-
private refreshFocusableElements;
|
|
628
684
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfModalComponent, never>;
|
|
629
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfModalComponent, "af-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, ["
|
|
685
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfModalComponent, "af-modal", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; }, { "closed": "closed"; }, ["footerRef"], ["[body]", "*", "[footer]"], true, never>;
|
|
630
686
|
}
|
|
631
687
|
|
|
632
688
|
type AfToastVariant = 'info' | 'success' | 'warning' | 'error';
|
|
@@ -758,7 +814,10 @@ interface AfDropdownItem {
|
|
|
758
814
|
separator?: boolean;
|
|
759
815
|
}
|
|
760
816
|
/**
|
|
761
|
-
* Dropdown menu component
|
|
817
|
+
* Dropdown menu component implementing the WAI-ARIA Menu Pattern.
|
|
818
|
+
*
|
|
819
|
+
* Provides full keyboard navigation (Arrow keys, Home/End, type-ahead),
|
|
820
|
+
* proper ARIA roles (`menu` / `menuitem`), and roving tabindex focus management.
|
|
762
821
|
*
|
|
763
822
|
* @example
|
|
764
823
|
* <af-dropdown
|
|
@@ -769,23 +828,41 @@ interface AfDropdownItem {
|
|
|
769
828
|
*/
|
|
770
829
|
declare class AfDropdownComponent {
|
|
771
830
|
private static nextId;
|
|
772
|
-
/** Dropdown button label */
|
|
831
|
+
/** Dropdown button label. */
|
|
773
832
|
label: _angular_core.InputSignal<string>;
|
|
774
|
-
/** Menu items */
|
|
833
|
+
/** Menu items. */
|
|
775
834
|
items: _angular_core.InputSignal<AfDropdownItem[]>;
|
|
776
|
-
/**
|
|
835
|
+
/** Emits the selected item's value. */
|
|
777
836
|
itemSelected: _angular_core.OutputEmitterRef<unknown>;
|
|
778
837
|
triggerRef: _angular_core.Signal<ElementRef<HTMLButtonElement> | undefined>;
|
|
838
|
+
menuRef: _angular_core.Signal<ElementRef<HTMLElement> | undefined>;
|
|
779
839
|
itemButtons: _angular_core.Signal<readonly ElementRef<HTMLButtonElement>[]>;
|
|
780
840
|
isOpen: _angular_core.WritableSignal<boolean>;
|
|
841
|
+
focusedItemIndex: _angular_core.WritableSignal<number>;
|
|
842
|
+
private instanceId;
|
|
781
843
|
menuId: string;
|
|
844
|
+
triggerId: string;
|
|
845
|
+
private typeAheadBuffer;
|
|
846
|
+
private typeAheadTimer;
|
|
782
847
|
toggle(): void;
|
|
783
848
|
selectItem(item: AfDropdownItem): void;
|
|
849
|
+
/** Handles keyboard events on the trigger button. */
|
|
850
|
+
onTriggerKeydown(event: KeyboardEvent): void;
|
|
851
|
+
/** Handles keyboard events within the open menu. */
|
|
852
|
+
onMenuKeydown(event: KeyboardEvent): void;
|
|
853
|
+
onDocumentClick(event: MouseEvent): void;
|
|
854
|
+
/**
|
|
855
|
+
* Returns the index of a non-separator item within the list of
|
|
856
|
+
* actionable (non-separator) items.
|
|
857
|
+
*/
|
|
858
|
+
getActionableIndex(item: AfDropdownItem): number;
|
|
784
859
|
private open;
|
|
785
860
|
private close;
|
|
786
|
-
private
|
|
787
|
-
|
|
788
|
-
|
|
861
|
+
private focusItem;
|
|
862
|
+
private focusCurrent;
|
|
863
|
+
private nextEnabledIndex;
|
|
864
|
+
private getActionableItems;
|
|
865
|
+
private handleTypeAhead;
|
|
789
866
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfDropdownComponent, never>;
|
|
790
867
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfDropdownComponent, "af-dropdown", never, { "label": { "alias": "label"; "required": false; "isSignal": true; }; "items": { "alias": "items"; "required": false; "isSignal": true; }; }, { "itemSelected": "itemSelected"; }, never, never, true, never>;
|
|
791
868
|
}
|
|
@@ -1037,7 +1114,9 @@ type AfBadgeVariant = 'default' | 'info' | 'success' | 'warning' | 'danger';
|
|
|
1037
1114
|
* <af-badge variant="danger">Blocked</af-badge>
|
|
1038
1115
|
*/
|
|
1039
1116
|
declare class AfBadgeComponent {
|
|
1040
|
-
/**
|
|
1117
|
+
/** Accessible label, useful when the badge has no visible text. */
|
|
1118
|
+
ariaLabel: _angular_core.InputSignal<string>;
|
|
1119
|
+
/** Color variant. */
|
|
1041
1120
|
variant: _angular_core.InputSignal<AfBadgeVariant>;
|
|
1042
1121
|
/** Icon character to display */
|
|
1043
1122
|
icon: _angular_core.InputSignal<string>;
|
|
@@ -1045,7 +1124,7 @@ declare class AfBadgeComponent {
|
|
|
1045
1124
|
dot: _angular_core.InputSignal<boolean>;
|
|
1046
1125
|
badgeClasses: _angular_core.Signal<string>;
|
|
1047
1126
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfBadgeComponent, never>;
|
|
1048
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfBadgeComponent, "af-badge", never, { "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1127
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfBadgeComponent, "af-badge", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "variant": { "alias": "variant"; "required": false; "isSignal": true; }; "icon": { "alias": "icon"; "required": false; "isSignal": true; }; "dot": { "alias": "dot"; "required": false; "isSignal": true; }; }, {}, never, ["*"], true, never>;
|
|
1049
1128
|
}
|
|
1050
1129
|
|
|
1051
1130
|
type AfProgressBarVariant = 'default' | 'info' | 'success' | 'warning' | 'danger';
|
|
@@ -1296,6 +1375,7 @@ type AfDrawerSize = 'sm' | 'md' | 'lg' | 'full';
|
|
|
1296
1375
|
*/
|
|
1297
1376
|
declare class AfDrawerComponent implements OnDestroy {
|
|
1298
1377
|
private static nextId;
|
|
1378
|
+
private focusTrap;
|
|
1299
1379
|
/** Two-way bindable open state */
|
|
1300
1380
|
open: _angular_core.ModelSignal<boolean>;
|
|
1301
1381
|
/** Slide-in position */
|
|
@@ -1315,8 +1395,6 @@ declare class AfDrawerComponent implements OnDestroy {
|
|
|
1315
1395
|
/** Unique ID for aria-labelledby fallback */
|
|
1316
1396
|
readonly titleId: string;
|
|
1317
1397
|
private panelRef;
|
|
1318
|
-
private previousActiveElement;
|
|
1319
|
-
private focusableElements;
|
|
1320
1398
|
containerClasses: _angular_core.Signal<string>;
|
|
1321
1399
|
private openEffect;
|
|
1322
1400
|
ngOnDestroy(): void;
|
|
@@ -1326,11 +1404,8 @@ declare class AfDrawerComponent implements OnDestroy {
|
|
|
1326
1404
|
onKeydown(event: KeyboardEvent): void;
|
|
1327
1405
|
private onOpen;
|
|
1328
1406
|
private onClose;
|
|
1329
|
-
private trapFocus;
|
|
1330
|
-
private restoreFocus;
|
|
1331
1407
|
private lockBodyScroll;
|
|
1332
1408
|
private unlockBodyScroll;
|
|
1333
|
-
private refreshFocusableElements;
|
|
1334
1409
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfDrawerComponent, never>;
|
|
1335
1410
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfDrawerComponent, "af-drawer", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; "isSignal": true; }; "closeOnBackdropClick": { "alias": "closeOnBackdropClick"; "required": false; "isSignal": true; }; "closeButtonAriaLabel": { "alias": "closeButtonAriaLabel"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, never, ["[header]", "[body]", "*", "[footer]"], true, never>;
|
|
1336
1411
|
}
|
|
@@ -1614,17 +1689,25 @@ declare class AfSelectMenuComponent implements ControlValueAccessor {
|
|
|
1614
1689
|
type AfNavbarSize = 'sm' | 'md' | 'lg';
|
|
1615
1690
|
type AfNavbarVariant = 'default' | 'sticky' | 'fixed' | 'elevated' | 'transparent' | 'dark' | 'bordered';
|
|
1616
1691
|
/**
|
|
1617
|
-
* Individual navigation item used within af-navbar.
|
|
1692
|
+
* Individual navigation item used within af-navbar or af-toolbar.
|
|
1693
|
+
*
|
|
1694
|
+
* Supports Angular Router via `routerLink`, standard links via `href`,
|
|
1695
|
+
* and button mode when neither is provided. Content projection allows
|
|
1696
|
+
* icons and custom markup inside the link.
|
|
1618
1697
|
*
|
|
1619
1698
|
* @example
|
|
1620
|
-
* <af-nav-item label="Dashboard"
|
|
1699
|
+
* <af-nav-item label="Dashboard" routerLink="/dashboard">
|
|
1700
|
+
* <af-icon name="dashboard" /> Dashboard
|
|
1701
|
+
* </af-nav-item>
|
|
1621
1702
|
*/
|
|
1622
1703
|
declare class AfNavItemComponent {
|
|
1623
|
-
/** Text label
|
|
1704
|
+
/** Text label shown as fallback when no content is projected. Also used by the mobile menu. */
|
|
1624
1705
|
label: _angular_core.InputSignal<string>;
|
|
1625
1706
|
/** URL for the navigation link. Renders as `<a>` when provided, `<button>` otherwise. */
|
|
1626
1707
|
href: _angular_core.InputSignal<string>;
|
|
1627
|
-
/**
|
|
1708
|
+
/** Angular Router link. Renders as `<a>` with routerLink and auto-active detection. */
|
|
1709
|
+
routerLink: _angular_core.InputSignal<string | string[] | null>;
|
|
1710
|
+
/** Marks this item as the currently active page (used for href/button mode, routerLink auto-detects). */
|
|
1628
1711
|
active: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
1629
1712
|
/** Disables interaction with this item. */
|
|
1630
1713
|
disabled: _angular_core.InputSignalWithTransform<boolean, unknown>;
|
|
@@ -1637,7 +1720,7 @@ declare class AfNavItemComponent {
|
|
|
1637
1720
|
focusLink(): void;
|
|
1638
1721
|
onClick(event: MouseEvent): void;
|
|
1639
1722
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfNavItemComponent, never>;
|
|
1640
|
-
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfNavItemComponent, "af-nav-item", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never,
|
|
1723
|
+
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfNavItemComponent, "af-nav-item", never, { "label": { "alias": "label"; "required": true; "isSignal": true; }; "href": { "alias": "href"; "required": false; "isSignal": true; }; "routerLink": { "alias": "routerLink"; "required": false; "isSignal": true; }; "active": { "alias": "active"; "required": false; "isSignal": true; }; "disabled": { "alias": "disabled"; "required": false; "isSignal": true; }; }, { "clicked": "clicked"; }, never, ["*", "*", "*"], true, never>;
|
|
1641
1724
|
}
|
|
1642
1725
|
/**
|
|
1643
1726
|
* Responsive navbar with mobile menu, keyboard navigation, and ARIA landmarks.
|
|
@@ -1645,8 +1728,10 @@ declare class AfNavItemComponent {
|
|
|
1645
1728
|
* @example
|
|
1646
1729
|
* <af-navbar ariaLabel="Main navigation">
|
|
1647
1730
|
* <a brand class="ct-navbar__brand" href="/">My App</a>
|
|
1648
|
-
* <af-nav-item label="Dashboard"
|
|
1649
|
-
*
|
|
1731
|
+
* <af-nav-item label="Dashboard" routerLink="/dashboard">
|
|
1732
|
+
* <af-icon name="dashboard" /> Dashboard
|
|
1733
|
+
* </af-nav-item>
|
|
1734
|
+
* <af-nav-item label="Settings" routerLink="/settings" />
|
|
1650
1735
|
* <button actions class="ct-button">Profile</button>
|
|
1651
1736
|
* </af-navbar>
|
|
1652
1737
|
*/
|
|
@@ -1727,6 +1812,7 @@ declare class AfPopoverTriggerDirective {
|
|
|
1727
1812
|
*/
|
|
1728
1813
|
declare class AfPopoverComponent implements AfPopoverApi, OnDestroy {
|
|
1729
1814
|
private static nextId;
|
|
1815
|
+
private focusTrap;
|
|
1730
1816
|
/** Two-way bindable open state. */
|
|
1731
1817
|
open: _angular_core.ModelSignal<boolean>;
|
|
1732
1818
|
/** Preferred position relative to the trigger. Flips automatically when space is insufficient. */
|
|
@@ -1750,8 +1836,6 @@ declare class AfPopoverComponent implements AfPopoverApi, OnDestroy {
|
|
|
1750
1836
|
private wrapperRef;
|
|
1751
1837
|
private contentRef;
|
|
1752
1838
|
private triggerDirective;
|
|
1753
|
-
private previousActiveElement;
|
|
1754
|
-
private focusableElements;
|
|
1755
1839
|
private flippedSide;
|
|
1756
1840
|
/** Effective side after auto-flip evaluation. */
|
|
1757
1841
|
activeSide: Signal<AfPopoverPosition>;
|
|
@@ -1767,10 +1851,7 @@ declare class AfPopoverComponent implements AfPopoverApi, OnDestroy {
|
|
|
1767
1851
|
onKeydown(event: KeyboardEvent): void;
|
|
1768
1852
|
private onOpen;
|
|
1769
1853
|
private onClose;
|
|
1770
|
-
private restoreFocus;
|
|
1771
|
-
private trapFocus;
|
|
1772
1854
|
private computeFlippedSide;
|
|
1773
|
-
private refreshFocusableElements;
|
|
1774
1855
|
static ɵfac: _angular_core.ɵɵFactoryDeclaration<AfPopoverComponent, never>;
|
|
1775
1856
|
static ɵcmp: _angular_core.ɵɵComponentDeclaration<AfPopoverComponent, "af-popover", never, { "open": { "alias": "open"; "required": false; "isSignal": true; }; "position": { "alias": "position"; "required": false; "isSignal": true; }; "align": { "alias": "align"; "required": false; "isSignal": true; }; "size": { "alias": "size"; "required": false; "isSignal": true; }; "title": { "alias": "title"; "required": false; "isSignal": true; }; "ariaLabel": { "alias": "ariaLabel"; "required": false; "isSignal": true; }; "showArrow": { "alias": "showArrow"; "required": false; "isSignal": true; }; "closeOnClickOutside": { "alias": "closeOnClickOutside"; "required": false; "isSignal": true; }; }, { "open": "openChange"; "closed": "closed"; }, ["triggerDirective"], ["[afPopoverTrigger]", "[body]", "*"], true, never>;
|
|
1776
1857
|
}
|
|
@@ -2117,5 +2198,5 @@ declare class AfFormatLabelPipe implements PipeTransform {
|
|
|
2117
2198
|
static ɵpipe: _angular_core.ɵɵPipeDeclaration<AfFormatLabelPipe, "afFormatLabel", true>;
|
|
2118
2199
|
}
|
|
2119
2200
|
|
|
2120
|
-
export { AfAccordionComponent, AfAccordionItemComponent, AfAlertComponent, AfAvatarComponent, AfBadgeComponent, AfBannerComponent, AfBreadcrumbsComponent, AfButtonComponent, AfCardComponent, AfCellDefDirective, AfCheckboxComponent, AfChipInputComponent, AfComboboxComponent, AfDataTableComponent, AfDatepickerComponent, AfDividerComponent, AfDrawerComponent, AfDropdownComponent, AfEmptyStateComponent, AfFieldComponent, AfFileUploadComponent, AfFormatLabelPipe, AfIconComponent, AfInputComponent, AfModalComponent, AfNavItemComponent, AfNavbarComponent, AfPaginationComponent, AfPopoverComponent, AfPopoverTriggerDirective, AfProgressBarComponent, AfRadioComponent, AfSelectComponent, AfSelectMenuComponent, AfSidebarComponent, AfSkeletonComponent, AfSkipLinkComponent, AfSliderComponent, AfSpinnerComponent, AfSwitchComponent, AfTabPanelComponent, AfTableBodyComponent, AfTableCellComponent, AfTableComponent, AfTableHeaderCellComponent, AfTableHeaderComponent, AfTableRowComponent, AfTabsComponent, AfTextareaComponent, AfToastContainerComponent, AfToastService, AfToggleGroupComponent, AfToolbarComponent, AfTooltipDirective };
|
|
2201
|
+
export { AfAccordionComponent, AfAccordionItemComponent, AfAlertComponent, AfAvatarComponent, AfBadgeComponent, AfBannerComponent, AfBreadcrumbsComponent, AfButtonComponent, AfCardComponent, AfCellDefDirective, AfCheckboxComponent, AfChipInputComponent, AfComboboxComponent, AfDataTableComponent, AfDatepickerComponent, AfDividerComponent, AfDrawerComponent, AfDropdownComponent, AfEmptyStateComponent, AfFieldComponent, AfFileUploadComponent, AfFormatLabelPipe, AfIconComponent, AfInputComponent, AfModalComponent, AfNavItemComponent, AfNavbarComponent, AfPaginationComponent, AfPopoverComponent, AfPopoverTriggerDirective, AfProgressBarComponent, AfRadioComponent, AfRadioGroupComponent, AfSelectComponent, AfSelectMenuComponent, AfSidebarComponent, AfSkeletonComponent, AfSkipLinkComponent, AfSliderComponent, AfSpinnerComponent, AfSwitchComponent, AfTabPanelComponent, AfTableBodyComponent, AfTableCellComponent, AfTableComponent, AfTableHeaderCellComponent, AfTableHeaderComponent, AfTableRowComponent, AfTabsComponent, AfTextareaComponent, AfToastContainerComponent, AfToastService, AfToggleGroupComponent, AfToolbarComponent, AfTooltipDirective };
|
|
2121
2202
|
export type { AfAlertVariant, AfAvatarSize, AfAvatarStatus, AfBadgeVariant, AfBannerAppearance, AfBannerPosition, AfBannerVariant, AfBreadcrumb, AfButtonSize, AfButtonType, AfButtonVariant, AfCardElevation, AfCardPadding, AfColumn, AfComboboxOption, AfDataRow, AfDataTableConfig, AfDividerColor, AfDividerOrientation, AfDividerSpacing, AfDrawerPosition, AfDrawerSize, AfDropdownItem, AfEmptyStateSize, AfEmptyStateVariant, AfFileEntry, AfFileValidationError, AfIconSize, AfInputType, AfNavbarSize, AfNavbarVariant, AfPopoverAlign, AfPopoverPosition, AfPopoverSize, AfProgressBarSize, AfProgressBarVariant, AfSelectMenuOption, AfSelectOption, AfSidebarMode, AfSkeletonVariant, AfSliderSize, AfSortDirection, AfSortState, AfSpinnerSize, AfTab, AfTableCellType, AfTableVariant, AfToast, AfToastVariant, AfToggleGroupSize, AfToggleItem, AfTooltipPosition };
|