@leanix/components 0.4.92 → 0.4.94
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/esm2022/lib/forms-ui/components/breadcrumb/breadcrumb.component.mjs +1 -1
- package/esm2022/lib/forms-ui/components/option/option.component.mjs +19 -4
- package/esm2022/lib/forms-ui/components/options-dropdown/options-dropdown.component.mjs +83 -18
- package/esm2022/lib/forms-ui/components/sorting-dropdown/sorting-dropdown.component.mjs +2 -2
- package/esm2022/lib/forms-ui/directives/keyboard-action-source.directive.mjs +12 -3
- package/esm2022/lib/forms-ui/helpers/key-codes.constants.mjs +3 -1
- package/esm2022/lib/tab-ui/components/tab/tab.component.mjs +44 -9
- package/esm2022/lib/tab-ui/components/tab-group/tab-group.component.mjs +80 -15
- package/fesm2022/leanix-components.mjs +242 -53
- package/fesm2022/leanix-components.mjs.map +1 -1
- package/lib/forms-ui/components/option/option.component.d.ts +5 -1
- package/lib/forms-ui/components/options-dropdown/options-dropdown.component.d.ts +12 -2
- package/lib/forms-ui/directives/keyboard-action-source.directive.d.ts +2 -1
- package/lib/forms-ui/helpers/key-codes.constants.d.ts +2 -0
- package/lib/tab-ui/components/tab/tab.component.d.ts +16 -5
- package/lib/tab-ui/components/tab-group/tab-group.component.d.ts +14 -5
- package/package.json +1 -1
@@ -20,12 +20,16 @@ export declare class OptionComponent {
|
|
20
20
|
select: EventEmitter<any>;
|
21
21
|
highlight: EventEmitter<boolean>;
|
22
22
|
selectedClick: EventEmitter<any>;
|
23
|
+
keyDownAction: EventEmitter<KeyboardEvent>;
|
24
|
+
option?: ElementRef<HTMLElement>;
|
23
25
|
hasSubdropdown: boolean;
|
24
26
|
isSuboption: boolean;
|
27
|
+
readonly optionId: string;
|
25
28
|
selectOption(event?: MouseEvent): void;
|
26
29
|
constructor(group: OptionGroupComponent, elementRef: ElementRef<HTMLElement>);
|
27
30
|
setSelected(value: boolean): void;
|
28
31
|
setHighlighted(value: boolean): void;
|
32
|
+
handleKeyDown(event: KeyboardEvent): void;
|
29
33
|
static ɵfac: i0.ɵɵFactoryDeclaration<OptionComponent, [{ optional: true; }, null]>;
|
30
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<OptionComponent, "lx-option", never, { "selected": { "alias": "selected"; "required": false; }; "isHighlighted": { "alias": "isHighlighted"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "hasSelectedState": { "alias": "hasSelectedState"; "required": false; }; "selectIcon": { "alias": "selectIcon"; "required": false; }; }, { "select": "select"; "highlight": "highlight"; "selectedClick": "selectedClick"; }, never, ["*"], true, never>;
|
34
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<OptionComponent, "lx-option", never, { "selected": { "alias": "selected"; "required": false; }; "isHighlighted": { "alias": "isHighlighted"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "value": { "alias": "value"; "required": false; }; "hasSelectedState": { "alias": "hasSelectedState"; "required": false; }; "selectIcon": { "alias": "selectIcon"; "required": false; }; }, { "select": "select"; "highlight": "highlight"; "selectedClick": "selectedClick"; "keyDownAction": "keyDownAction"; }, never, ["*"], true, never>;
|
31
35
|
}
|
@@ -1,5 +1,5 @@
|
|
1
1
|
import { ConnectedPosition, ScrollStrategy, ScrollStrategyOptions } from '@angular/cdk/overlay';
|
2
|
-
import { AfterViewInit, ChangeDetectorRef, OnDestroy, QueryList } from '@angular/core';
|
2
|
+
import { AfterViewInit, ChangeDetectorRef, OnDestroy, QueryList, Renderer2 } from '@angular/core';
|
3
3
|
import { Subject } from 'rxjs';
|
4
4
|
import { KeyboardActionSourceDirective } from '../../directives/keyboard-action-source.directive';
|
5
5
|
import { OptionComponent } from '../option/option.component';
|
@@ -7,6 +7,7 @@ import * as i0 from "@angular/core";
|
|
7
7
|
export declare class OptionsDropdownComponent implements AfterViewInit, OnDestroy {
|
8
8
|
private changeDetection;
|
9
9
|
private readonly scrollStrategies;
|
10
|
+
private renderer;
|
10
11
|
readonly NAME = "OptionsDropdownComponent";
|
11
12
|
align: 'right' | 'left';
|
12
13
|
closeOnScroll: boolean;
|
@@ -21,11 +22,14 @@ export declare class OptionsDropdownComponent implements AfterViewInit, OnDestro
|
|
21
22
|
set open(value: boolean);
|
22
23
|
get open(): boolean;
|
23
24
|
get options(): OptionComponent[];
|
25
|
+
get optionIds(): string[];
|
26
|
+
get lxButton(): HTMLElement;
|
24
27
|
private readonly highlightedOptionIndex$;
|
25
28
|
private _open;
|
26
29
|
private isSubdropdownExpanded;
|
30
|
+
readonly listboxId: string;
|
27
31
|
readonly destroyed$: Subject<void>;
|
28
|
-
constructor(changeDetection: ChangeDetectorRef, scrollStrategies: ScrollStrategyOptions);
|
32
|
+
constructor(changeDetection: ChangeDetectorRef, scrollStrategies: ScrollStrategyOptions, renderer: Renderer2);
|
29
33
|
ngAfterViewInit(): void;
|
30
34
|
ngOnDestroy(): void;
|
31
35
|
closeDropdown(): void;
|
@@ -35,6 +39,12 @@ export declare class OptionsDropdownComponent implements AfterViewInit, OnDestro
|
|
35
39
|
private expand;
|
36
40
|
private collapse;
|
37
41
|
private optionIsHighlightable;
|
42
|
+
/**
|
43
|
+
* Programmatically sets initial accessibility attributes on the trigger button so that we
|
44
|
+
* don't have to do it manually every time we declare a new instance of this component
|
45
|
+
*/
|
46
|
+
private setInitialAccessibilityAttributes;
|
47
|
+
handleOptionKeyDown(event: KeyboardEvent): void;
|
38
48
|
static ɵfac: i0.ɵɵFactoryDeclaration<OptionsDropdownComponent, never>;
|
39
49
|
static ɵcmp: i0.ɵɵComponentDeclaration<OptionsDropdownComponent, "lx-options-dropdown", never, { "align": { "alias": "align"; "required": false; }; "closeOnScroll": { "alias": "closeOnScroll"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; "maxHeight": { "alias": "maxHeight"; "required": false; }; "closeOnSelect": { "alias": "closeOnSelect"; "required": false; }; "overlayPositioning": { "alias": "overlayPositioning"; "required": false; }; }, {}, ["trigger", "_options"], ["[lxKeyboardActionSource]", "*"], true, never>;
|
40
50
|
}
|
@@ -6,10 +6,11 @@ export declare class KeyboardActionSourceDirective implements OnDestroy {
|
|
6
6
|
private element;
|
7
7
|
dontEmit: boolean;
|
8
8
|
readonly destroyed$: Subject<void>;
|
9
|
-
keyboardActions$: import("rxjs").Observable<KeyboardSelectAction.PREV | KeyboardSelectAction.NEXT | KeyboardSelectAction.LEFT | KeyboardSelectAction.RIGHT | KeyboardSelectAction.EXECUTE | KeyboardSelectAction.CLOSE | null>;
|
9
|
+
keyboardActions$: import("rxjs").Observable<KeyboardSelectAction.PREV | KeyboardSelectAction.NEXT | KeyboardSelectAction.FIRST | KeyboardSelectAction.LAST | KeyboardSelectAction.LEFT | KeyboardSelectAction.RIGHT | KeyboardSelectAction.EXECUTE | KeyboardSelectAction.CLOSE | null>;
|
10
10
|
constructor(element: ElementRef<HTMLElement>);
|
11
11
|
blur(): void;
|
12
12
|
ngOnDestroy(): void;
|
13
|
+
nativeElement(): HTMLElement;
|
13
14
|
static ɵfac: i0.ɵɵFactoryDeclaration<KeyboardActionSourceDirective, never>;
|
14
15
|
static ɵdir: i0.ɵɵDirectiveDeclaration<KeyboardActionSourceDirective, "[lxKeyboardActionSource]", ["keyboardActionSource"], {}, {}, never, never, true, never>;
|
15
16
|
}
|
@@ -1,8 +1,10 @@
|
|
1
1
|
import { TemplatePortal } from '@angular/cdk/portal';
|
2
|
-
import { ChangeDetectorRef, EventEmitter } from '@angular/core';
|
3
|
-
import { RouterLinkActive } from '@angular/router';
|
2
|
+
import { ChangeDetectorRef, ElementRef, EventEmitter } from '@angular/core';
|
3
|
+
import { ActivatedRoute, Router, RouterLinkActive } from '@angular/router';
|
4
4
|
import * as i0 from "@angular/core";
|
5
5
|
export declare class TabComponent {
|
6
|
+
private router;
|
7
|
+
private activatedRoute;
|
6
8
|
private cd;
|
7
9
|
/**
|
8
10
|
* The icon input takes a font awesome selector
|
@@ -11,7 +13,12 @@ export declare class TabComponent {
|
|
11
13
|
icon?: string;
|
12
14
|
label: string;
|
13
15
|
title?: string;
|
14
|
-
|
16
|
+
/**
|
17
|
+
* In some parts of the application, we are passing a plain string to the tabLink input, whereas in
|
18
|
+
* most parts, the input is passed as an array. The RouterLink directive also accepts both types,
|
19
|
+
* therefore we are using type of the input as string | any[].
|
20
|
+
*/
|
21
|
+
tabLink?: string | any[];
|
15
22
|
counter?: number;
|
16
23
|
routerLinkActiveOptions: {
|
17
24
|
exact: boolean;
|
@@ -22,15 +29,19 @@ export declare class TabComponent {
|
|
22
29
|
background: 'white' | 'gray';
|
23
30
|
disabled: boolean;
|
24
31
|
switch: EventEmitter<any>;
|
32
|
+
keyDownAction: EventEmitter<KeyboardEvent>;
|
25
33
|
tabPanelId: string;
|
26
34
|
tabId: string;
|
27
35
|
content?: TemplatePortal<any>;
|
28
36
|
routerLinkActive?: RouterLinkActive;
|
37
|
+
tabElement?: ElementRef<HTMLElement>;
|
29
38
|
set isActive(value: boolean);
|
30
39
|
get isActive(): boolean;
|
31
40
|
private _isActive;
|
32
|
-
constructor(cd: ChangeDetectorRef);
|
41
|
+
constructor(router: Router, activatedRoute: ActivatedRoute, cd: ChangeDetectorRef);
|
33
42
|
select(): void;
|
43
|
+
setFocus(): void;
|
44
|
+
handleKeyDown(event: KeyboardEvent): void;
|
34
45
|
static ɵfac: i0.ɵɵFactoryDeclaration<TabComponent, never>;
|
35
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "lx-tab", never, { "icon": { "alias": "icon"; "required": false; }; "label": { "alias": "label"; "required": false; }; "title": { "alias": "title"; "required": false; }; "tabLink": { "alias": "tabLink"; "required": false; }; "counter": { "alias": "counter"; "required": false; }; "routerLinkActiveOptions": { "alias": "routerLinkActiveOptions"; "required": false; }; "counterBadgeSize": { "alias": "counterBadgeSize"; "required": false; }; "noMargin": { "alias": "noMargin"; "required": false; }; "noLeftMarginForFirstTab": { "alias": "noLeftMarginForFirstTab"; "required": false; }; "background": { "alias": "background"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "switch": "switch"; }, never, ["*"], true, never>;
|
46
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TabComponent, "lx-tab", never, { "icon": { "alias": "icon"; "required": false; }; "label": { "alias": "label"; "required": false; }; "title": { "alias": "title"; "required": false; }; "tabLink": { "alias": "tabLink"; "required": false; }; "counter": { "alias": "counter"; "required": false; }; "routerLinkActiveOptions": { "alias": "routerLinkActiveOptions"; "required": false; }; "counterBadgeSize": { "alias": "counterBadgeSize"; "required": false; }; "noMargin": { "alias": "noMargin"; "required": false; }; "noLeftMarginForFirstTab": { "alias": "noLeftMarginForFirstTab"; "required": false; }; "background": { "alias": "background"; "required": false; }; "disabled": { "alias": "disabled"; "required": false; }; }, { "switch": "switch"; "keyDownAction": "keyDownAction"; }, never, ["*"], true, never>;
|
36
47
|
}
|
@@ -1,22 +1,31 @@
|
|
1
|
-
import { AfterContentInit, ChangeDetectorRef, EventEmitter, OnChanges, OnDestroy, QueryList, SimpleChanges } from '@angular/core';
|
1
|
+
import { AfterContentInit, ChangeDetectorRef, ElementRef, EventEmitter, NgZone, OnChanges, OnDestroy, OnInit, QueryList, SimpleChanges } from '@angular/core';
|
2
2
|
import { Subject } from 'rxjs';
|
3
3
|
import { TabComponent } from '../tab/tab.component';
|
4
4
|
import * as i0 from "@angular/core";
|
5
|
-
export declare class TabGroupComponent implements OnChanges, AfterContentInit, OnDestroy {
|
5
|
+
export declare class TabGroupComponent implements OnInit, OnChanges, AfterContentInit, OnDestroy {
|
6
6
|
private cd;
|
7
|
+
private ngZone;
|
7
8
|
isCentered: boolean;
|
8
9
|
selectedIndex: number;
|
10
|
+
ariaTabPattern: 'manualActivation' | 'automaticActivation';
|
9
11
|
indexChange: EventEmitter<number>;
|
10
12
|
tabsQueryList?: QueryList<TabComponent>;
|
13
|
+
tabListElement?: ElementRef<HTMLElement>;
|
14
|
+
focusedIndex: number;
|
11
15
|
private get tabs();
|
12
16
|
get activeTabPortal(): import("@angular/cdk/portal").TemplatePortal<any> | undefined;
|
17
|
+
get tabIds(): string[];
|
13
18
|
readonly destroyed$: Subject<void>;
|
14
|
-
constructor(cd: ChangeDetectorRef);
|
19
|
+
constructor(cd: ChangeDetectorRef, ngZone: NgZone);
|
20
|
+
ngOnInit(): void;
|
15
21
|
ngOnChanges(changes: SimpleChanges): void;
|
16
22
|
ngAfterContentInit(): void;
|
17
23
|
ngOnDestroy(): void;
|
18
|
-
|
24
|
+
onFocusOut(event: any): void;
|
19
25
|
switchTo(tab: TabComponent): void;
|
26
|
+
handleKeyDown(_tab: TabComponent, event: KeyboardEvent): void;
|
27
|
+
private navigateToTab;
|
28
|
+
private navigateToInitialTab;
|
20
29
|
static ɵfac: i0.ɵɵFactoryDeclaration<TabGroupComponent, never>;
|
21
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<TabGroupComponent, "lx-tab-group", never, { "isCentered": { "alias": "isCentered"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; }, { "indexChange": "indexChange"; }, ["tabsQueryList"], ["*"], true, never>;
|
30
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<TabGroupComponent, "lx-tab-group", never, { "isCentered": { "alias": "isCentered"; "required": false; }; "selectedIndex": { "alias": "selectedIndex"; "required": false; }; "ariaTabPattern": { "alias": "ariaTabPattern"; "required": false; }; }, { "indexChange": "indexChange"; }, ["tabsQueryList"], ["*"], true, never>;
|
22
31
|
}
|