@skyux/split-view 12.23.0 → 13.0.0-alpha.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/fesm2022/skyux-split-view-testing.mjs +4 -4
- package/fesm2022/skyux-split-view-testing.mjs.map +1 -1
- package/fesm2022/skyux-split-view.mjs +44 -45
- package/fesm2022/skyux-split-view.mjs.map +1 -1
- package/index.d.ts +192 -10
- package/package.json +11 -11
- package/testing/index.d.ts +189 -3
- package/lib/modules/shared/sky-split-view-resources.module.d.ts +0 -10
- package/lib/modules/split-view/split-view-adapter.service.d.ts +0 -15
- package/lib/modules/split-view/split-view-drawer.component.d.ts +0 -38
- package/lib/modules/split-view/split-view-workspace-content.component.d.ts +0 -9
- package/lib/modules/split-view/split-view-workspace-footer.component.d.ts +0 -9
- package/lib/modules/split-view/split-view-workspace-header.component.d.ts +0 -17
- package/lib/modules/split-view/split-view-workspace.component.d.ts +0 -15
- package/lib/modules/split-view/split-view.component.d.ts +0 -58
- package/lib/modules/split-view/split-view.module.d.ts +0 -12
- package/lib/modules/split-view/split-view.service.d.ts +0 -22
- package/lib/modules/split-view/types/split-view-dock-type.d.ts +0 -1
- package/lib/modules/split-view/types/split-view-message-type.d.ts +0 -6
- package/lib/modules/split-view/types/split-view-message.d.ts +0 -7
- package/testing/legacy/split-view/split-view-fixture-drawer.d.ts +0 -8
- package/testing/legacy/split-view/split-view-fixture-workspace.d.ts +0 -9
- package/testing/legacy/split-view/split-view-fixture.d.ts +0 -26
- package/testing/legacy/split-view/split-view-testing.module.d.ts +0 -10
- package/testing/modules/split-view/split-view-drawer-harness.d.ts +0 -15
- package/testing/modules/split-view/split-view-harness-filters.d.ts +0 -6
- package/testing/modules/split-view/split-view-harness.d.ts +0 -49
- package/testing/modules/split-view/split-view-workspace-content-harness.d.ts +0 -10
- package/testing/modules/split-view/split-view-workspace-footer-harness.d.ts +0 -10
- package/testing/modules/split-view/split-view-workspace-harness.d.ts +0 -31
- package/testing/modules/split-view/split-view-workspace-header-harness.d.ts +0 -18
- package/testing/public-api.d.ts +0 -10
package/index.d.ts
CHANGED
|
@@ -1,10 +1,192 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
|
|
5
|
-
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
1
|
+
import * as i0 from '@angular/core';
|
|
2
|
+
import { RendererFactory2, ElementRef, OnInit, OnDestroy, ChangeDetectorRef } from '@angular/core';
|
|
3
|
+
import * as i1 from '@skyux/core';
|
|
4
|
+
import { SkyMutationObserverService, SkyAppWindowRef, SkyCoreAdapterService } from '@skyux/core';
|
|
5
|
+
import { Subject, Observable, BehaviorSubject } from 'rxjs';
|
|
6
|
+
import { SkyLibResourcesService } from '@skyux/i18n';
|
|
7
|
+
|
|
8
|
+
/**
|
|
9
|
+
* Adapter service for use when the split view component needs to manipulate the DOM
|
|
10
|
+
* @internal
|
|
11
|
+
*/
|
|
12
|
+
declare class SkySplitViewAdapterService {
|
|
13
|
+
#private;
|
|
14
|
+
constructor(observerSvc: SkyMutationObserverService, rendererFactory: RendererFactory2, windowRef: SkyAppWindowRef);
|
|
15
|
+
bindHeightToWindow(elementRef: ElementRef, unsubscribeSubject: Subject<void>): void;
|
|
16
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewAdapterService, never>;
|
|
17
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<SkySplitViewAdapterService>;
|
|
18
|
+
}
|
|
19
|
+
|
|
20
|
+
/**
|
|
21
|
+
* Specifies the content to display in the split view's list panel.
|
|
22
|
+
*/
|
|
23
|
+
declare class SkySplitViewDrawerComponent implements OnInit, OnDestroy {
|
|
24
|
+
#private;
|
|
25
|
+
/**
|
|
26
|
+
* The ARIA label for the list panel. This sets the panel's `aria-label` attribute to provide a text equivalent for screen readers
|
|
27
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
28
|
+
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
29
|
+
*/
|
|
30
|
+
ariaLabel: string | undefined;
|
|
31
|
+
/**
|
|
32
|
+
* Sets the list panel's width in pixels.
|
|
33
|
+
* @default 320
|
|
34
|
+
*/
|
|
35
|
+
set width(value: number | undefined);
|
|
36
|
+
get width(): number | undefined;
|
|
37
|
+
isMobile: boolean;
|
|
38
|
+
splitViewDrawerId: string;
|
|
39
|
+
widthDefault: number;
|
|
40
|
+
widthMax: number;
|
|
41
|
+
widthMin: number;
|
|
42
|
+
widthTolerance: number;
|
|
43
|
+
constructor();
|
|
44
|
+
ngOnInit(): void;
|
|
45
|
+
ngOnDestroy(): void;
|
|
46
|
+
onResizeHandleMouseDown(event: MouseEvent): void;
|
|
47
|
+
onMouseMove(event: MouseEvent): void;
|
|
48
|
+
onHandleRelease(): void;
|
|
49
|
+
onResizeHandleChange(event: Event): void;
|
|
50
|
+
onWindowResize(): void;
|
|
51
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewDrawerComponent, never>;
|
|
52
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewDrawerComponent, "sky-split-view-drawer", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "width": { "alias": "width"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
53
|
+
}
|
|
54
|
+
|
|
55
|
+
/**
|
|
56
|
+
* Internal service for operations between the split view drawer and workspace.
|
|
57
|
+
* @internal
|
|
58
|
+
*/
|
|
59
|
+
declare class SkySplitViewService {
|
|
60
|
+
#private;
|
|
61
|
+
get backButtonTextStream(): Observable<string>;
|
|
62
|
+
drawerVisible: BehaviorSubject<boolean>;
|
|
63
|
+
splitViewElementRef: ElementRef | undefined;
|
|
64
|
+
set isMobile(value: boolean);
|
|
65
|
+
get isMobile(): boolean;
|
|
66
|
+
get isMobileStream(): Observable<boolean>;
|
|
67
|
+
constructor(resources: SkyLibResourcesService);
|
|
68
|
+
backButtonClick(): void;
|
|
69
|
+
updateBackButtonText(text: string): void;
|
|
70
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewService, never>;
|
|
71
|
+
static ɵprov: i0.ɵɵInjectableDeclaration<SkySplitViewService>;
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
type SkySplitViewDockType = 'none' | 'fill';
|
|
75
|
+
|
|
76
|
+
declare enum SkySplitViewMessageType {
|
|
77
|
+
/**
|
|
78
|
+
* Places focus on the first focusable element in the workspace.
|
|
79
|
+
*/
|
|
80
|
+
FocusWorkspace = 0
|
|
81
|
+
}
|
|
82
|
+
|
|
83
|
+
interface SkySplitViewMessage {
|
|
84
|
+
/**
|
|
85
|
+
* Sets the `SkySplitViewMessageType`.
|
|
86
|
+
*/
|
|
87
|
+
type?: SkySplitViewMessageType;
|
|
88
|
+
}
|
|
89
|
+
|
|
90
|
+
/**
|
|
91
|
+
* Displays a list alongside a workspace where users can view details for selected items
|
|
92
|
+
* and take actions.
|
|
93
|
+
*/
|
|
94
|
+
declare class SkySplitViewComponent implements OnInit, OnDestroy {
|
|
95
|
+
#private;
|
|
96
|
+
/**
|
|
97
|
+
* The label for the button that appears in the workspace header in responsive mode.
|
|
98
|
+
* The button returns users to the list.
|
|
99
|
+
* @default "Back to list"
|
|
100
|
+
*/
|
|
101
|
+
set backButtonText(value: string);
|
|
102
|
+
/**
|
|
103
|
+
* Whether the split view's height is bound to the window height.
|
|
104
|
+
* @default false
|
|
105
|
+
* @deprecated We recommend using the `dock` input instead. An example of this can
|
|
106
|
+
* be found in the developer code examples.
|
|
107
|
+
*/
|
|
108
|
+
set bindHeightToWindow(bindToHeight: boolean);
|
|
109
|
+
get bindHeightToWindow(): boolean;
|
|
110
|
+
/**
|
|
111
|
+
* How the split view docks to its container. Use `fill` to dock
|
|
112
|
+
* the split view to the container's size where the container is a `sky-page` component
|
|
113
|
+
* with its `layout` input set to `fit`, or where the container is another element with
|
|
114
|
+
* a relative or absolute position and a fixed size.
|
|
115
|
+
* @default "none"
|
|
116
|
+
*/
|
|
117
|
+
set dock(value: SkySplitViewDockType | undefined);
|
|
118
|
+
get dock(): SkySplitViewDockType;
|
|
119
|
+
/**
|
|
120
|
+
* The observable that sends commands to the split view component.
|
|
121
|
+
* The commands should respect the `SkySplitViewMessage` type.
|
|
122
|
+
*/
|
|
123
|
+
messageStream: Subject<SkySplitViewMessage>;
|
|
124
|
+
drawerComponent: SkySplitViewDrawerComponent | undefined;
|
|
125
|
+
set drawerVisible(value: boolean);
|
|
126
|
+
get drawerVisible(): boolean;
|
|
127
|
+
isMobile: boolean;
|
|
128
|
+
nextButtonDisabled: boolean;
|
|
129
|
+
previousButtonDisabled: boolean;
|
|
130
|
+
get workspaceVisible(): boolean;
|
|
131
|
+
constructor(adapter: SkySplitViewAdapterService, changeDetectorRef: ChangeDetectorRef, coreAdapterService: SkyCoreAdapterService, elementRef: ElementRef, splitViewService: SkySplitViewService);
|
|
132
|
+
ngOnInit(): void;
|
|
133
|
+
ngOnDestroy(): void;
|
|
134
|
+
onWorkspaceEnterComplete(): void;
|
|
135
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewComponent, never>;
|
|
136
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewComponent, "sky-split-view", never, { "backButtonText": { "alias": "backButtonText"; "required": false; }; "bindHeightToWindow": { "alias": "bindHeightToWindow"; "required": false; }; "dock": { "alias": "dock"; "required": false; }; "messageStream": { "alias": "messageStream"; "required": false; }; }, {}, ["drawerComponent"], ["sky-split-view-drawer", "sky-split-view-workspace"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
137
|
+
}
|
|
138
|
+
|
|
139
|
+
/**
|
|
140
|
+
* Contains the content, footer, and header to display in the split view's workspace panel.
|
|
141
|
+
*/
|
|
142
|
+
declare class SkySplitViewWorkspaceComponent {
|
|
143
|
+
protected breakpoint: i0.Signal<"xs" | "sm" | "md" | "lg" | undefined>;
|
|
144
|
+
/**
|
|
145
|
+
* The ARIA label for the workspace panel. This sets the panel's `aria-label` attribute to provide a text equivalent for screen readers
|
|
146
|
+
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
147
|
+
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
148
|
+
*/
|
|
149
|
+
ariaLabel: string | undefined;
|
|
150
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceComponent, never>;
|
|
151
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceComponent, "sky-split-view-workspace", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, {}, never, ["sky-split-view-workspace-content", "sky-split-view-workspace-footer"], true, never>;
|
|
152
|
+
}
|
|
153
|
+
|
|
154
|
+
/**
|
|
155
|
+
* Specifies the content to display in the split view's workspace panel.
|
|
156
|
+
*/
|
|
157
|
+
declare class SkySplitViewWorkspaceContentComponent {
|
|
158
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceContentComponent, never>;
|
|
159
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceContentComponent, "sky-split-view-workspace-content", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
160
|
+
}
|
|
161
|
+
|
|
162
|
+
/**
|
|
163
|
+
* Specifies the footer to display in the split view's workspace panel. This component is often used with a summary action bar.
|
|
164
|
+
*/
|
|
165
|
+
declare class SkySplitViewWorkspaceFooterComponent {
|
|
166
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceFooterComponent, never>;
|
|
167
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceFooterComponent, "sky-split-view-workspace-footer", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
168
|
+
}
|
|
169
|
+
|
|
170
|
+
/**
|
|
171
|
+
* Specifies the header to display in the split view's workspace panel.
|
|
172
|
+
* @internal
|
|
173
|
+
*/
|
|
174
|
+
declare class SkySplitViewWorkspaceHeaderComponent implements OnDestroy, OnInit {
|
|
175
|
+
#private;
|
|
176
|
+
backButtonText: string | undefined;
|
|
177
|
+
constructor(splitViewSvc: SkySplitViewService);
|
|
178
|
+
ngOnInit(): void;
|
|
179
|
+
onShowDrawerButtonClick(): void;
|
|
180
|
+
ngOnDestroy(): void;
|
|
181
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceHeaderComponent, never>;
|
|
182
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceHeaderComponent, "sky-split-view-workspace-header", never, {}, {}, never, never, true, never>;
|
|
183
|
+
}
|
|
184
|
+
|
|
185
|
+
declare class SkySplitViewModule {
|
|
186
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewModule, never>;
|
|
187
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySplitViewModule, never, [typeof SkySplitViewComponent, typeof SkySplitViewDrawerComponent, typeof SkySplitViewWorkspaceComponent, typeof SkySplitViewWorkspaceContentComponent, typeof SkySplitViewWorkspaceFooterComponent, typeof SkySplitViewWorkspaceHeaderComponent], [typeof SkySplitViewComponent, typeof SkySplitViewDrawerComponent, typeof SkySplitViewWorkspaceComponent, typeof SkySplitViewWorkspaceContentComponent, typeof SkySplitViewWorkspaceFooterComponent, typeof SkySplitViewWorkspaceHeaderComponent]>;
|
|
188
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkySplitViewModule>;
|
|
189
|
+
}
|
|
190
|
+
|
|
191
|
+
export { SkySplitViewMessageType, SkySplitViewModule, SkySplitViewComponent as λ1, SkySplitViewDrawerComponent as λ2, SkySplitViewWorkspaceComponent as λ3, SkySplitViewWorkspaceContentComponent as λ4, SkySplitViewWorkspaceFooterComponent as λ5, SkySplitViewWorkspaceHeaderComponent as λ6 };
|
|
192
|
+
export type { SkySplitViewDockType, SkySplitViewMessage };
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@skyux/split-view",
|
|
3
|
-
"version": "
|
|
3
|
+
"version": "13.0.0-alpha.0",
|
|
4
4
|
"author": "Blackbaud, Inc.",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"blackbaud",
|
|
@@ -16,16 +16,16 @@
|
|
|
16
16
|
},
|
|
17
17
|
"homepage": "https://github.com/blackbaud/skyux#readme",
|
|
18
18
|
"peerDependencies": {
|
|
19
|
-
"@angular/animations": "^
|
|
20
|
-
"@angular/cdk": "^
|
|
21
|
-
"@angular/common": "^
|
|
22
|
-
"@angular/core": "^
|
|
23
|
-
"@angular/platform-browser": "^
|
|
24
|
-
"@skyux-sdk/testing": "
|
|
25
|
-
"@skyux/core": "
|
|
26
|
-
"@skyux/i18n": "
|
|
27
|
-
"@skyux/icon": "
|
|
28
|
-
"@skyux/theme": "
|
|
19
|
+
"@angular/animations": "^20.0.5",
|
|
20
|
+
"@angular/cdk": "^20.0.4",
|
|
21
|
+
"@angular/common": "^20.0.5",
|
|
22
|
+
"@angular/core": "^20.0.5",
|
|
23
|
+
"@angular/platform-browser": "^20.0.5",
|
|
24
|
+
"@skyux-sdk/testing": "13.0.0-alpha.0",
|
|
25
|
+
"@skyux/core": "13.0.0-alpha.0",
|
|
26
|
+
"@skyux/i18n": "13.0.0-alpha.0",
|
|
27
|
+
"@skyux/icon": "13.0.0-alpha.0",
|
|
28
|
+
"@skyux/theme": "13.0.0-alpha.0"
|
|
29
29
|
},
|
|
30
30
|
"dependencies": {
|
|
31
31
|
"tslib": "^2.8.1"
|
package/testing/index.d.ts
CHANGED
|
@@ -1,5 +1,191 @@
|
|
|
1
|
+
import { ComponentFixture } from '@angular/core/testing';
|
|
2
|
+
import * as i0 from '@angular/core';
|
|
3
|
+
import * as i1 from '@skyux/split-view';
|
|
4
|
+
import { SkySplitViewDockType } from '@skyux/split-view';
|
|
5
|
+
import { SkyQueryableComponentHarness, SkyHarnessFilters, SkyInputHarness, SkyComponentHarness } from '@skyux/core/testing';
|
|
6
|
+
import { TestElement, HarnessPredicate } from '@angular/cdk/testing';
|
|
7
|
+
|
|
1
8
|
/**
|
|
2
|
-
*
|
|
9
|
+
* @internal
|
|
3
10
|
*/
|
|
4
|
-
|
|
5
|
-
|
|
11
|
+
interface SkySplitViewFixtureDrawer {
|
|
12
|
+
ariaLabel: string | null | undefined;
|
|
13
|
+
isVisible: boolean;
|
|
14
|
+
width: string;
|
|
15
|
+
}
|
|
16
|
+
|
|
17
|
+
/**
|
|
18
|
+
* @internal
|
|
19
|
+
*/
|
|
20
|
+
interface SkySplitViewFixtureWorkspace {
|
|
21
|
+
ariaLabel: string | null | undefined;
|
|
22
|
+
backButtonIsVisible: boolean;
|
|
23
|
+
backButtonText: string | undefined;
|
|
24
|
+
isVisible: boolean;
|
|
25
|
+
}
|
|
26
|
+
|
|
27
|
+
/**
|
|
28
|
+
* Provides information for and interaction with a SKY UX split view component.
|
|
29
|
+
* By using the fixture API, a test insulates itself against updates to the internals
|
|
30
|
+
* of a component, such as changing its DOM structure.
|
|
31
|
+
* @internal
|
|
32
|
+
*/
|
|
33
|
+
declare class SkySplitViewFixture {
|
|
34
|
+
#private;
|
|
35
|
+
/**
|
|
36
|
+
* Returns information about the split view's drawer component.
|
|
37
|
+
*/
|
|
38
|
+
get drawer(): SkySplitViewFixtureDrawer;
|
|
39
|
+
/**
|
|
40
|
+
* Returns information about the split view's workspace component.
|
|
41
|
+
*/
|
|
42
|
+
get workspace(): SkySplitViewFixtureWorkspace;
|
|
43
|
+
constructor(fixture: ComponentFixture<unknown>, skyTestId: string);
|
|
44
|
+
/**
|
|
45
|
+
* Opens the drawer component when in responsive mode. This method clicks the back to list
|
|
46
|
+
* button, if it is visible.
|
|
47
|
+
*/
|
|
48
|
+
openDrawer(): Promise<void>;
|
|
49
|
+
}
|
|
50
|
+
|
|
51
|
+
/**
|
|
52
|
+
* @internal
|
|
53
|
+
*/
|
|
54
|
+
declare class SkySplitViewTestingModule {
|
|
55
|
+
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewTestingModule, never>;
|
|
56
|
+
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySplitViewTestingModule, never, never, [typeof i1.SkySplitViewModule]>;
|
|
57
|
+
static ɵinj: i0.ɵɵInjectorDeclaration<SkySplitViewTestingModule>;
|
|
58
|
+
}
|
|
59
|
+
|
|
60
|
+
/**
|
|
61
|
+
* Harness to interact with the split view drawer component in tests.
|
|
62
|
+
*/
|
|
63
|
+
declare class SkySplitViewDrawerHarness extends SkyQueryableComponentHarness {
|
|
64
|
+
#private;
|
|
65
|
+
/**
|
|
66
|
+
* @internal
|
|
67
|
+
*/
|
|
68
|
+
static hostSelector: string;
|
|
69
|
+
/**
|
|
70
|
+
* The aria-label property of the split view drawer
|
|
71
|
+
*/
|
|
72
|
+
getAriaLabel(): Promise<string | null>;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* A set of criteria that can be used to filter a list of SkySplitViewHarness instances.
|
|
77
|
+
*/
|
|
78
|
+
interface SkySplitViewHarnessFilters extends SkyHarnessFilters {
|
|
79
|
+
}
|
|
80
|
+
|
|
81
|
+
/**
|
|
82
|
+
* Harness to interact with the split view workspace content component in tests.
|
|
83
|
+
*/
|
|
84
|
+
declare class SkySplitViewWorkspaceContentHarness extends SkyQueryableComponentHarness {
|
|
85
|
+
/**
|
|
86
|
+
* @internal
|
|
87
|
+
*/
|
|
88
|
+
static hostSelector: string;
|
|
89
|
+
}
|
|
90
|
+
|
|
91
|
+
/**
|
|
92
|
+
* Harness to interact with the split view workspace footer component in tests.
|
|
93
|
+
*/
|
|
94
|
+
declare class SkySplitViewWorkspaceFooterHarness extends SkyQueryableComponentHarness {
|
|
95
|
+
/**
|
|
96
|
+
* @internal
|
|
97
|
+
*/
|
|
98
|
+
static hostSelector: string;
|
|
99
|
+
}
|
|
100
|
+
|
|
101
|
+
/**
|
|
102
|
+
* Harness to interact with the split view workspace header component in tests.
|
|
103
|
+
* @internal
|
|
104
|
+
*/
|
|
105
|
+
declare class SkySplitViewWorkspaceHeaderHarness extends SkyInputHarness {
|
|
106
|
+
#private;
|
|
107
|
+
/**
|
|
108
|
+
* @internal
|
|
109
|
+
*/
|
|
110
|
+
static hostSelector: string;
|
|
111
|
+
/**
|
|
112
|
+
* Gets the button element.
|
|
113
|
+
* @internal
|
|
114
|
+
*/
|
|
115
|
+
getBackButton(): Promise<TestElement>;
|
|
116
|
+
}
|
|
117
|
+
|
|
118
|
+
/**
|
|
119
|
+
* Harness to interact with the split view workspace component in tests.
|
|
120
|
+
*/
|
|
121
|
+
declare class SkySplitViewWorkspaceHarness extends SkyQueryableComponentHarness {
|
|
122
|
+
#private;
|
|
123
|
+
/**
|
|
124
|
+
* @internal
|
|
125
|
+
*/
|
|
126
|
+
static hostSelector: string;
|
|
127
|
+
/**
|
|
128
|
+
* The aria-label property of the split view workspace
|
|
129
|
+
*/
|
|
130
|
+
getAriaLabel(): Promise<string | null>;
|
|
131
|
+
/**
|
|
132
|
+
* Gets the workspace content component.
|
|
133
|
+
*/
|
|
134
|
+
getContent(): Promise<SkySplitViewWorkspaceContentHarness>;
|
|
135
|
+
/**
|
|
136
|
+
* Gets the workspace footer component.
|
|
137
|
+
*/
|
|
138
|
+
getFooter(): Promise<SkySplitViewWorkspaceFooterHarness>;
|
|
139
|
+
/**
|
|
140
|
+
* Gets the workspace header component.
|
|
141
|
+
* @internal
|
|
142
|
+
*/
|
|
143
|
+
getHeader(): Promise<SkySplitViewWorkspaceHeaderHarness>;
|
|
144
|
+
}
|
|
145
|
+
|
|
146
|
+
/**
|
|
147
|
+
* Harness for interacting with a split view component in tests.
|
|
148
|
+
*/
|
|
149
|
+
declare class SkySplitViewHarness extends SkyComponentHarness {
|
|
150
|
+
#private;
|
|
151
|
+
/**
|
|
152
|
+
* @internal
|
|
153
|
+
*/
|
|
154
|
+
static hostSelector: string;
|
|
155
|
+
/**
|
|
156
|
+
* Gets a `HarnessPredicate` that can be used to search for a
|
|
157
|
+
* `SkySplitViewHarness` that meets certain criteria.
|
|
158
|
+
*/
|
|
159
|
+
static with(filters: SkySplitViewHarnessFilters): HarnessPredicate<SkySplitViewHarness>;
|
|
160
|
+
/**
|
|
161
|
+
* Gets the text for the button that appears in the workspace header in responsive mode.
|
|
162
|
+
*/
|
|
163
|
+
getBackButtonText(): Promise<string>;
|
|
164
|
+
/**
|
|
165
|
+
* Gets the type of dock style on the split view.
|
|
166
|
+
*/
|
|
167
|
+
getDockType(): Promise<SkySplitViewDockType>;
|
|
168
|
+
/**
|
|
169
|
+
* Gets a 'SkySplitViewDrawerHarness`.
|
|
170
|
+
*/
|
|
171
|
+
getDrawer(): Promise<SkySplitViewDrawerHarness>;
|
|
172
|
+
/**
|
|
173
|
+
* Whether the drawer component is visible
|
|
174
|
+
*/
|
|
175
|
+
getDrawerIsVisible(): Promise<boolean>;
|
|
176
|
+
/**
|
|
177
|
+
* Gets a `SkySplitViewWorkspaceHarness`.
|
|
178
|
+
*/
|
|
179
|
+
getWorkspace(): Promise<SkySplitViewWorkspaceHarness>;
|
|
180
|
+
/**
|
|
181
|
+
* Whether the workspace component is visible.
|
|
182
|
+
*/
|
|
183
|
+
getWorkspaceIsVisible(): Promise<boolean>;
|
|
184
|
+
/**
|
|
185
|
+
* Opens the drawer component when in responsive mode.
|
|
186
|
+
*/
|
|
187
|
+
openDrawer(): Promise<void>;
|
|
188
|
+
}
|
|
189
|
+
|
|
190
|
+
export { SkySplitViewDrawerHarness, SkySplitViewFixture, SkySplitViewHarness, SkySplitViewTestingModule, SkySplitViewWorkspaceContentHarness, SkySplitViewWorkspaceFooterHarness, SkySplitViewWorkspaceHarness };
|
|
191
|
+
export type { SkySplitViewFixtureDrawer, SkySplitViewFixtureWorkspace, SkySplitViewHarnessFilters };
|
|
@@ -1,10 +0,0 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "@skyux/i18n";
|
|
3
|
-
/**
|
|
4
|
-
* Import into any component library module that needs to use resource strings.
|
|
5
|
-
*/
|
|
6
|
-
export declare class SkySplitViewResourcesModule {
|
|
7
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewResourcesModule, never>;
|
|
8
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySplitViewResourcesModule, never, never, [typeof i1.SkyI18nModule]>;
|
|
9
|
-
static ɵinj: i0.ɵɵInjectorDeclaration<SkySplitViewResourcesModule>;
|
|
10
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import { ElementRef, RendererFactory2 } from '@angular/core';
|
|
2
|
-
import { SkyAppWindowRef, SkyMutationObserverService } from '@skyux/core';
|
|
3
|
-
import { Subject } from 'rxjs';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
/**
|
|
6
|
-
* Adapter service for use when the split view component needs to manipulate the DOM
|
|
7
|
-
* @internal
|
|
8
|
-
*/
|
|
9
|
-
export declare class SkySplitViewAdapterService {
|
|
10
|
-
#private;
|
|
11
|
-
constructor(observerSvc: SkyMutationObserverService, rendererFactory: RendererFactory2, windowRef: SkyAppWindowRef);
|
|
12
|
-
bindHeightToWindow(elementRef: ElementRef, unsubscribeSubject: Subject<void>): void;
|
|
13
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewAdapterService, never>;
|
|
14
|
-
static ɵprov: i0.ɵɵInjectableDeclaration<SkySplitViewAdapterService>;
|
|
15
|
-
}
|
|
@@ -1,38 +0,0 @@
|
|
|
1
|
-
import { ChangeDetectorRef, OnDestroy, OnInit } from '@angular/core';
|
|
2
|
-
import { SkyAppWindowRef, SkyCoreAdapterService } from '@skyux/core';
|
|
3
|
-
import { SkySplitViewService } from './split-view.service';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
/**
|
|
6
|
-
* Specifies the content to display in the split view's list panel.
|
|
7
|
-
*/
|
|
8
|
-
export declare class SkySplitViewDrawerComponent implements OnInit, OnDestroy {
|
|
9
|
-
#private;
|
|
10
|
-
/**
|
|
11
|
-
* The ARIA label for the list panel. This sets the panel's `aria-label` attribute to provide a text equivalent for screen readers
|
|
12
|
-
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
13
|
-
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
14
|
-
*/
|
|
15
|
-
ariaLabel: string | undefined;
|
|
16
|
-
/**
|
|
17
|
-
* Sets the list panel's width in pixels.
|
|
18
|
-
* @default 320
|
|
19
|
-
*/
|
|
20
|
-
set width(value: number | undefined);
|
|
21
|
-
get width(): number | undefined;
|
|
22
|
-
isMobile: boolean;
|
|
23
|
-
splitViewDrawerId: string;
|
|
24
|
-
widthDefault: number;
|
|
25
|
-
widthMax: number;
|
|
26
|
-
widthMin: number;
|
|
27
|
-
widthTolerance: number;
|
|
28
|
-
constructor(changeDetectorRef: ChangeDetectorRef, coreAdapterService: SkyCoreAdapterService, splitViewSvc: SkySplitViewService, windowRef: SkyAppWindowRef);
|
|
29
|
-
ngOnInit(): void;
|
|
30
|
-
ngOnDestroy(): void;
|
|
31
|
-
onResizeHandleMouseDown(event: MouseEvent): void;
|
|
32
|
-
onMouseMove(event: MouseEvent): void;
|
|
33
|
-
onHandleRelease(): void;
|
|
34
|
-
onResizeHandleChange(event: Event): void;
|
|
35
|
-
onWindowResize(): void;
|
|
36
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewDrawerComponent, never>;
|
|
37
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewDrawerComponent, "sky-split-view-drawer", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; "width": { "alias": "width"; "required": false; }; }, {}, never, ["*"], true, never>;
|
|
38
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "@skyux/core";
|
|
3
|
-
/**
|
|
4
|
-
* Specifies the content to display in the split view's workspace panel.
|
|
5
|
-
*/
|
|
6
|
-
export declare class SkySplitViewWorkspaceContentComponent {
|
|
7
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceContentComponent, never>;
|
|
8
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceContentComponent, "sky-split-view-workspace-content", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
9
|
-
}
|
|
@@ -1,9 +0,0 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "@skyux/core";
|
|
3
|
-
/**
|
|
4
|
-
* Specifies the footer to display in the split view's workspace panel. This component is often used with a summary action bar.
|
|
5
|
-
*/
|
|
6
|
-
export declare class SkySplitViewWorkspaceFooterComponent {
|
|
7
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceFooterComponent, never>;
|
|
8
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceFooterComponent, "sky-split-view-workspace-footer", never, {}, {}, never, ["*"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
9
|
-
}
|
|
@@ -1,17 +0,0 @@
|
|
|
1
|
-
import { OnDestroy, OnInit } from '@angular/core';
|
|
2
|
-
import { SkySplitViewService } from './split-view.service';
|
|
3
|
-
import * as i0 from "@angular/core";
|
|
4
|
-
/**
|
|
5
|
-
* Specifies the header to display in the split view's workspace panel.
|
|
6
|
-
* @internal
|
|
7
|
-
*/
|
|
8
|
-
export declare class SkySplitViewWorkspaceHeaderComponent implements OnDestroy, OnInit {
|
|
9
|
-
#private;
|
|
10
|
-
backButtonText: string | undefined;
|
|
11
|
-
constructor(splitViewSvc: SkySplitViewService);
|
|
12
|
-
ngOnInit(): void;
|
|
13
|
-
onShowDrawerButtonClick(): void;
|
|
14
|
-
ngOnDestroy(): void;
|
|
15
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceHeaderComponent, never>;
|
|
16
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceHeaderComponent, "sky-split-view-workspace-header", never, {}, {}, never, never, true, never>;
|
|
17
|
-
}
|
|
@@ -1,15 +0,0 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
/**
|
|
3
|
-
* Contains the content, footer, and header to display in the split view's workspace panel.
|
|
4
|
-
*/
|
|
5
|
-
export declare class SkySplitViewWorkspaceComponent {
|
|
6
|
-
protected breakpoint: import("@angular/core").Signal<"xs" | "sm" | "md" | "lg" | undefined>;
|
|
7
|
-
/**
|
|
8
|
-
* The ARIA label for the workspace panel. This sets the panel's `aria-label` attribute to provide a text equivalent for screen readers
|
|
9
|
-
* [to support accessibility](https://developer.blackbaud.com/skyux/learn/accessibility).
|
|
10
|
-
* For more information about the `aria-label` attribute, see the [WAI-ARIA definition](https://www.w3.org/TR/wai-aria/#aria-label).
|
|
11
|
-
*/
|
|
12
|
-
ariaLabel: string | undefined;
|
|
13
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewWorkspaceComponent, never>;
|
|
14
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewWorkspaceComponent, "sky-split-view-workspace", never, { "ariaLabel": { "alias": "ariaLabel"; "required": false; }; }, {}, never, ["sky-split-view-workspace-content", "sky-split-view-workspace-footer"], true, never>;
|
|
15
|
-
}
|
|
@@ -1,58 +0,0 @@
|
|
|
1
|
-
import { ChangeDetectorRef, ElementRef, OnDestroy, OnInit } from '@angular/core';
|
|
2
|
-
import { SkyCoreAdapterService } from '@skyux/core';
|
|
3
|
-
import { Subject } from 'rxjs';
|
|
4
|
-
import { SkySplitViewAdapterService } from './split-view-adapter.service';
|
|
5
|
-
import { SkySplitViewDrawerComponent } from './split-view-drawer.component';
|
|
6
|
-
import { SkySplitViewService } from './split-view.service';
|
|
7
|
-
import { SkySplitViewDockType } from './types/split-view-dock-type';
|
|
8
|
-
import { SkySplitViewMessage } from './types/split-view-message';
|
|
9
|
-
import * as i0 from "@angular/core";
|
|
10
|
-
import * as i1 from "@skyux/core";
|
|
11
|
-
/**
|
|
12
|
-
* Displays a list alongside a workspace where users can view details for selected items
|
|
13
|
-
* and take actions.
|
|
14
|
-
*/
|
|
15
|
-
export declare class SkySplitViewComponent implements OnInit, OnDestroy {
|
|
16
|
-
#private;
|
|
17
|
-
/**
|
|
18
|
-
* The label for the button that appears in the workspace header in responsive mode.
|
|
19
|
-
* The button returns users to the list.
|
|
20
|
-
* @default "Back to list"
|
|
21
|
-
*/
|
|
22
|
-
set backButtonText(value: string);
|
|
23
|
-
/**
|
|
24
|
-
* Whether the split view's height is bound to the window height.
|
|
25
|
-
* @default false
|
|
26
|
-
* @deprecated We recommend using the `dock` input instead. An example of this can
|
|
27
|
-
* be found in the developer code examples.
|
|
28
|
-
*/
|
|
29
|
-
set bindHeightToWindow(bindToHeight: boolean);
|
|
30
|
-
get bindHeightToWindow(): boolean;
|
|
31
|
-
/**
|
|
32
|
-
* How the split view docks to its container. Use `fill` to dock
|
|
33
|
-
* the split view to the container's size where the container is a `sky-page` component
|
|
34
|
-
* with its `layout` input set to `fit`, or where the container is another element with
|
|
35
|
-
* a relative or absolute position and a fixed size.
|
|
36
|
-
* @default "none"
|
|
37
|
-
*/
|
|
38
|
-
set dock(value: SkySplitViewDockType | undefined);
|
|
39
|
-
get dock(): SkySplitViewDockType;
|
|
40
|
-
/**
|
|
41
|
-
* The observable that sends commands to the split view component.
|
|
42
|
-
* The commands should respect the `SkySplitViewMessage` type.
|
|
43
|
-
*/
|
|
44
|
-
messageStream: Subject<SkySplitViewMessage>;
|
|
45
|
-
drawerComponent: SkySplitViewDrawerComponent | undefined;
|
|
46
|
-
set drawerVisible(value: boolean);
|
|
47
|
-
get drawerVisible(): boolean;
|
|
48
|
-
isMobile: boolean;
|
|
49
|
-
nextButtonDisabled: boolean;
|
|
50
|
-
previousButtonDisabled: boolean;
|
|
51
|
-
get workspaceVisible(): boolean;
|
|
52
|
-
constructor(adapter: SkySplitViewAdapterService, changeDetectorRef: ChangeDetectorRef, coreAdapterService: SkyCoreAdapterService, elementRef: ElementRef, splitViewService: SkySplitViewService);
|
|
53
|
-
ngOnInit(): void;
|
|
54
|
-
ngOnDestroy(): void;
|
|
55
|
-
onWorkspaceEnterComplete(): void;
|
|
56
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewComponent, never>;
|
|
57
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<SkySplitViewComponent, "sky-split-view", never, { "backButtonText": { "alias": "backButtonText"; "required": false; }; "bindHeightToWindow": { "alias": "bindHeightToWindow"; "required": false; }; "dock": { "alias": "dock"; "required": false; }; "messageStream": { "alias": "messageStream"; "required": false; }; }, {}, ["drawerComponent"], ["sky-split-view-drawer", "sky-split-view-workspace"], true, [{ directive: typeof i1.SkyResponsiveHostDirective; inputs: {}; outputs: {}; }]>;
|
|
58
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import * as i0 from "@angular/core";
|
|
2
|
-
import * as i1 from "./split-view.component";
|
|
3
|
-
import * as i2 from "./split-view-drawer.component";
|
|
4
|
-
import * as i3 from "./split-view-workspace.component";
|
|
5
|
-
import * as i4 from "./split-view-workspace-content.component";
|
|
6
|
-
import * as i5 from "./split-view-workspace-footer.component";
|
|
7
|
-
import * as i6 from "./split-view-workspace-header.component";
|
|
8
|
-
export declare class SkySplitViewModule {
|
|
9
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewModule, never>;
|
|
10
|
-
static ɵmod: i0.ɵɵNgModuleDeclaration<SkySplitViewModule, never, [typeof i1.SkySplitViewComponent, typeof i2.SkySplitViewDrawerComponent, typeof i3.SkySplitViewWorkspaceComponent, typeof i4.SkySplitViewWorkspaceContentComponent, typeof i5.SkySplitViewWorkspaceFooterComponent, typeof i6.SkySplitViewWorkspaceHeaderComponent], [typeof i1.SkySplitViewComponent, typeof i2.SkySplitViewDrawerComponent, typeof i3.SkySplitViewWorkspaceComponent, typeof i4.SkySplitViewWorkspaceContentComponent, typeof i5.SkySplitViewWorkspaceFooterComponent, typeof i6.SkySplitViewWorkspaceHeaderComponent]>;
|
|
11
|
-
static ɵinj: i0.ɵɵInjectorDeclaration<SkySplitViewModule>;
|
|
12
|
-
}
|
|
@@ -1,22 +0,0 @@
|
|
|
1
|
-
import { ElementRef } from '@angular/core';
|
|
2
|
-
import { SkyLibResourcesService } from '@skyux/i18n';
|
|
3
|
-
import { BehaviorSubject, Observable } from 'rxjs';
|
|
4
|
-
import * as i0 from "@angular/core";
|
|
5
|
-
/**
|
|
6
|
-
* Internal service for operations between the split view drawer and workspace.
|
|
7
|
-
* @internal
|
|
8
|
-
*/
|
|
9
|
-
export declare class SkySplitViewService {
|
|
10
|
-
#private;
|
|
11
|
-
get backButtonTextStream(): Observable<string>;
|
|
12
|
-
drawerVisible: BehaviorSubject<boolean>;
|
|
13
|
-
splitViewElementRef: ElementRef | undefined;
|
|
14
|
-
set isMobile(value: boolean);
|
|
15
|
-
get isMobile(): boolean;
|
|
16
|
-
get isMobileStream(): Observable<boolean>;
|
|
17
|
-
constructor(resources: SkyLibResourcesService);
|
|
18
|
-
backButtonClick(): void;
|
|
19
|
-
updateBackButtonText(text: string): void;
|
|
20
|
-
static ɵfac: i0.ɵɵFactoryDeclaration<SkySplitViewService, never>;
|
|
21
|
-
static ɵprov: i0.ɵɵInjectableDeclaration<SkySplitViewService>;
|
|
22
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export type SkySplitViewDockType = 'none' | 'fill';
|