@skyux/pages 12.0.0-alpha.9 → 12.0.0-beta.1
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-pages.mjs +77 -80
- package/fesm2022/skyux-pages.mjs.map +1 -1
- package/lib/modules/link-as/link-as.pipe.d.ts +15 -1
- package/lib/modules/needs-attention/needs-attention.component.d.ts +4 -3
- package/lib/modules/needs-attention/needs-attention.module.d.ts +1 -10
- package/package.json +21 -24
- package/documentation.json +0 -9523
package/fesm2022/skyux-pages.mjs
CHANGED
|
@@ -1,26 +1,26 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
|
-
import { Optional, Pipe, NgModule, Component, input, contentChildren, computed, inject, isStandalone,
|
|
2
|
+
import { Optional, Pipe, NgModule, Component, input, contentChildren, computed, inject, isStandalone, effect, ViewEncapsulation, Input, ChangeDetectionStrategy, CSP_NONCE, Inject, Injectable } from '@angular/core';
|
|
3
3
|
import * as i4 from '@skyux/indicators';
|
|
4
4
|
import { SkyWaitModule } from '@skyux/indicators';
|
|
5
|
-
import * as
|
|
5
|
+
import * as i2 from '@skyux/layout';
|
|
6
6
|
import { SkyBoxModule, SkyFluidGridModule } from '@skyux/layout';
|
|
7
|
-
import * as i1 from '@skyux/theme';
|
|
7
|
+
import * as i1$1 from '@skyux/theme';
|
|
8
8
|
import { SkyThemeComponentClassDirective, SkyThemeModule } from '@skyux/theme';
|
|
9
|
-
import { Subject } from 'rxjs';
|
|
9
|
+
import { Subject, switchMap, of, forkJoin, from, map, startWith } from 'rxjs';
|
|
10
10
|
import { takeUntil } from 'rxjs/operators';
|
|
11
|
-
import * as
|
|
12
|
-
import { SkyAppLinkModule, SkyHrefModule } from '@skyux/router';
|
|
13
|
-
import * as i1$
|
|
14
|
-
import { NgTemplateOutlet, CommonModule, DOCUMENT } from '@angular/common';
|
|
15
|
-
import * as i1$
|
|
11
|
+
import * as i1 from '@skyux/router';
|
|
12
|
+
import { SkyAppLinkModule, SkyHrefModule, SkyHrefResolverService } from '@skyux/router';
|
|
13
|
+
import * as i1$3 from '@angular/common';
|
|
14
|
+
import { NgTemplateOutlet, CommonModule, NgClass, AsyncPipe, DOCUMENT } from '@angular/common';
|
|
15
|
+
import * as i1$2 from '@skyux/i18n';
|
|
16
16
|
import { SkyLibResourcesService, SkyI18nModule } from '@skyux/i18n';
|
|
17
|
-
import * as i1$
|
|
17
|
+
import * as i1$4 from '@skyux/core';
|
|
18
18
|
import { SkyLogService, SkyTrimModule, SkyDefaultInputProvider, SkyMediaQueryService, SkyResponsiveHostDirective, SkyHelpService, provideSkyBreakpointObserver, SkyContainerBreakpointObserver, SkyLayoutHostDirective } from '@skyux/core';
|
|
19
19
|
import { SkyModalService, SkyModalLegacyService } from '@skyux/modals';
|
|
20
|
-
import
|
|
20
|
+
import { toObservable, takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
21
|
+
import * as i3 from '@skyux/icon';
|
|
21
22
|
import { SkyIconModule } from '@skyux/icon';
|
|
22
23
|
import { RouterModule } from '@angular/router';
|
|
23
|
-
import { takeUntilDestroyed } from '@angular/core/rxjs-interop';
|
|
24
24
|
|
|
25
25
|
const RECENTLY_ACCESSED_LIMIT = 5;
|
|
26
26
|
function getRecentLinksSorted(recentLinks) {
|
|
@@ -104,7 +104,7 @@ class SkyActionHubRecentLinksResolvePipe {
|
|
|
104
104
|
getRecentLinksSorted(recentLinksResolved);
|
|
105
105
|
this.#changeDetector.markForCheck();
|
|
106
106
|
}
|
|
107
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubRecentLinksResolvePipe, deps: [{ token: i0.ChangeDetectorRef }, { token:
|
|
107
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubRecentLinksResolvePipe, deps: [{ token: i0.ChangeDetectorRef }, { token: i1.SkyRecentlyAccessedService, optional: true }], target: i0.ɵɵFactoryTarget.Pipe }); }
|
|
108
108
|
static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubRecentLinksResolvePipe, isStandalone: true, name: "skyActionHubRecentLinksResolve", pure: false }); }
|
|
109
109
|
}
|
|
110
110
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubRecentLinksResolvePipe, decorators: [{
|
|
@@ -114,7 +114,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
114
114
|
pure: false,
|
|
115
115
|
standalone: true,
|
|
116
116
|
}]
|
|
117
|
-
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type:
|
|
117
|
+
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.SkyRecentlyAccessedService, decorators: [{
|
|
118
118
|
type: Optional
|
|
119
119
|
}] }] });
|
|
120
120
|
|
|
@@ -164,11 +164,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
164
164
|
*/
|
|
165
165
|
class SkyLinkListItemComponent {
|
|
166
166
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLinkListItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
167
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyLinkListItemComponent, isStandalone: true, selector: "sky-link-list-item", host: { properties: { "attr.role": "\"listitem\"" } }, hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host.sky-cmp-theme-default{--sky-override-link-item-space-below: var(--sky-margin-stacked-sm)}:host{display:block;margin:0 0 var(--sky-override-link-item-space-below, var(--sky-space-stacked-s)) 0}\n"] }); }
|
|
167
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyLinkListItemComponent, isStandalone: true, selector: "sky-link-list-item", host: { properties: { "attr.role": "\"listitem\"" } }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host.sky-cmp-theme-default{--sky-override-link-item-space-below: var(--sky-margin-stacked-sm)}:host{display:block;margin:0 0 var(--sky-override-link-item-space-below, var(--sky-space-stacked-s)) 0}\n"] }); }
|
|
168
168
|
}
|
|
169
169
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLinkListItemComponent, decorators: [{
|
|
170
170
|
type: Component,
|
|
171
|
-
args: [{
|
|
171
|
+
args: [{ selector: 'sky-link-list-item', template: `<ng-content />`, host: {
|
|
172
172
|
'[attr.role]': '"listitem"',
|
|
173
173
|
}, hostDirectives: [SkyThemeComponentClassDirective], styles: [":host.sky-cmp-theme-default{--sky-override-link-item-space-below: var(--sky-margin-stacked-sm)}:host{display:block;margin:0 0 var(--sky-override-link-item-space-below, var(--sky-space-stacked-s)) 0}\n"] }]
|
|
174
174
|
}] });
|
|
@@ -204,7 +204,7 @@ class SkyLinkListComponent {
|
|
|
204
204
|
});
|
|
205
205
|
}
|
|
206
206
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLinkListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
207
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyLinkListComponent, isStandalone: true, selector: "sky-link-list", inputs: { headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: true, isRequired: false, transformFunction: null }, links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "linkItems", predicate: SkyLinkListItemComponent, isSignal: true }], hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<sky-wait [isWaiting]=\"links() === 'loading'\" />\n@if (links() === 'loading') {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n} @else {\n @if (hasLinks()) {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n <ul class=\"sky-link-list\">\n @for (link of linksArray(); track link) {\n <li>\n @if (link | linkAs: 'skyHref') {\n <a class=\"sky-link-list-item\" [skyHref]=\"link.permalink.url\">\n {{ link.label }}\n </a>\n } @else if (link | linkAs: 'href') {\n <a class=\"sky-link-list-item\" [href]=\"link.permalink.url\">\n {{ link.label }}\n </a>\n } @else if (link.permalink.route) {\n <a\n class=\"sky-link-list-item\"\n [skyAppLink]=\"link.permalink.route.commands\"\n [queryParams]=\"link.permalink.route.extras?.queryParams\"\n [queryParamsHandling]=\"\n link.permalink.route.extras?.queryParamsHandling\n \"\n [fragment]=\"link.permalink.route.extras?.fragment\"\n [preserveFragment]=\"link.permalink.route.extras?.preserveFragment\"\n [skipLocationChange]=\"\n link.permalink.route.extras?.skipLocationChange\n \"\n [replaceUrl]=\"link.permalink.route.extras?.replaceUrl\"\n [state]=\"link.permalink.route.extras?.state\"\n >\n {{ link.label }}\n </a>\n }\n </li>\n }\n <ng-content select=\"sky-link-list-item\" />\n </ul>\n }\n}\n\n<ng-template #headingTemplateRef>\n <h2 class=\"sky-font-heading-4\">{{ headingText() }}</h2>\n</ng-template>\n", styles: [".sky-link-list:not(.sky-theme-modern *){--sky-override-link-list-space-below: var(--sky-margin-stacked-xl)}:host.sky-cmp-theme-default{--sky-override-link-list-heading-space: var(--sky-margin-stacked-sm)}ul.sky-link-list{list-style:none;margin:0 0 var(--sky-override-link-list-space-below, var(--sky-space-stacked-xl)) 0;padding-left:0}h2,li{margin:0 0 var(--sky-override-link-list-heading-space, var(--sky-space-stacked-s)) 0}ul.sky-link-list>li:has(>a[hidden]){display:none}\n"], dependencies: [{ kind: "ngmodule", type: LinkAsModule }, { kind: "pipe", type: LinkAsPipe, name: "linkAs" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: SkyAppLinkModule }, { kind: "directive", type:
|
|
207
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyLinkListComponent, isStandalone: true, selector: "sky-link-list", inputs: { headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: true, isRequired: false, transformFunction: null }, links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null } }, queries: [{ propertyName: "linkItems", predicate: SkyLinkListItemComponent, isSignal: true }], hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<sky-wait [isWaiting]=\"links() === 'loading'\" />\n@if (links() === 'loading') {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n} @else {\n @if (hasLinks()) {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n <ul class=\"sky-link-list\">\n @for (link of linksArray(); track link) {\n <li>\n @if (link | linkAs: 'skyHref') {\n <a class=\"sky-link-list-item\" [skyHref]=\"link.permalink.url\">\n {{ link.label }}\n </a>\n } @else if (link | linkAs: 'href') {\n <a class=\"sky-link-list-item\" [href]=\"link.permalink.url\">\n {{ link.label }}\n </a>\n } @else if (link.permalink.route) {\n <a\n class=\"sky-link-list-item\"\n [skyAppLink]=\"link.permalink.route.commands\"\n [queryParams]=\"link.permalink.route.extras?.queryParams\"\n [queryParamsHandling]=\"\n link.permalink.route.extras?.queryParamsHandling\n \"\n [fragment]=\"link.permalink.route.extras?.fragment\"\n [preserveFragment]=\"link.permalink.route.extras?.preserveFragment\"\n [skipLocationChange]=\"\n link.permalink.route.extras?.skipLocationChange\n \"\n [replaceUrl]=\"link.permalink.route.extras?.replaceUrl\"\n [state]=\"link.permalink.route.extras?.state\"\n >\n {{ link.label }}\n </a>\n }\n </li>\n }\n <ng-content select=\"sky-link-list-item\" />\n </ul>\n }\n}\n\n<ng-template #headingTemplateRef>\n <h2 class=\"sky-font-heading-4\">{{ headingText() }}</h2>\n</ng-template>\n", styles: [".sky-link-list:not(.sky-theme-modern *){--sky-override-link-list-space-below: var(--sky-margin-stacked-xl)}:host.sky-cmp-theme-default{--sky-override-link-list-heading-space: var(--sky-margin-stacked-sm)}ul.sky-link-list{list-style:none;margin:0 0 var(--sky-override-link-list-space-below, var(--sky-space-stacked-xl)) 0;padding-left:0}h2,li{margin:0 0 var(--sky-override-link-list-heading-space, var(--sky-space-stacked-s)) 0}ul.sky-link-list>li:has(>a[hidden]){display:none}\n"], dependencies: [{ kind: "ngmodule", type: LinkAsModule }, { kind: "pipe", type: LinkAsPipe, name: "linkAs" }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "ngmodule", type: SkyAppLinkModule }, { kind: "directive", type: i1.λ3, selector: "[skyAppLink]", inputs: ["skyAppLink"] }, { kind: "ngmodule", type: SkyHrefModule }, { kind: "directive", type: i1.λ1, selector: "[skyHref]", inputs: ["skyHref", "queryParams", "skyHrefElse"], outputs: ["skyHrefChange"] }, { kind: "ngmodule", type: SkyWaitModule }, { kind: "component", type: i4.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }] }); }
|
|
208
208
|
}
|
|
209
209
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLinkListComponent, decorators: [{
|
|
210
210
|
type: Component,
|
|
@@ -280,7 +280,7 @@ class SkyLinkListRecentlyAccessedComponent {
|
|
|
280
280
|
[links]="recentLinks() | skyActionHubRecentLinksResolve"
|
|
281
281
|
[headingText]="'sky_action_hub_recent_links' | skyLibResources"
|
|
282
282
|
/>
|
|
283
|
-
`, isInline: true, dependencies: [{ kind: "pipe", type: SkyActionHubRecentLinksResolvePipe, name: "skyActionHubRecentLinksResolve" }, { kind: "component", type: SkyLinkListComponent, selector: "sky-link-list", inputs: ["headingText", "links"] }, { kind: "ngmodule", type: SkyPagesResourcesModule }, { kind: "pipe", type: i1$
|
|
283
|
+
`, isInline: true, dependencies: [{ kind: "pipe", type: SkyActionHubRecentLinksResolvePipe, name: "skyActionHubRecentLinksResolve" }, { kind: "component", type: SkyLinkListComponent, selector: "sky-link-list", inputs: ["headingText", "links"] }, { kind: "ngmodule", type: SkyPagesResourcesModule }, { kind: "pipe", type: i1$2.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
284
284
|
}
|
|
285
285
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLinkListRecentlyAccessedComponent, decorators: [{
|
|
286
286
|
type: Component,
|
|
@@ -367,7 +367,7 @@ class SkyModalLinkListComponent {
|
|
|
367
367
|
}
|
|
368
368
|
}
|
|
369
369
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyModalLinkListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
370
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyModalLinkListComponent, isStandalone: false, selector: "sky-modal-link-list", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<sky-wait [isWaiting]=\"links() === 'loading'\" />\n@if (links() === 'loading') {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n} @else {\n @if (linksArray().length > 0) {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n <ul class=\"sky-link-list\">\n @for (link of linksArray(); track link) {\n <li>\n @if (link | linkAs: 'skyHref') {\n <a class=\"sky-link-list-item\" [skyHref]=\"link.permalink?.url\">\n {{ link.label }}\n </a>\n } @else if (link | linkAs: 'href') {\n <a class=\"sky-link-list-item\" [href]=\"link.permalink?.url\">\n {{ link.label }}\n </a>\n } @else if (link.permalink && link.permalink.route) {\n <a\n class=\"sky-link-list-item\"\n [skyAppLink]=\"link.permalink.route.commands\"\n [queryParams]=\"link.permalink.route.extras?.queryParams\"\n [queryParamsHandling]=\"\n link.permalink.route.extras?.queryParamsHandling\n \"\n [fragment]=\"link.permalink.route.extras?.fragment\"\n [preserveFragment]=\"link.permalink.route.extras?.preserveFragment\"\n [skipLocationChange]=\"\n link.permalink.route.extras?.skipLocationChange\n \"\n [replaceUrl]=\"link.permalink.route.extras?.replaceUrl\"\n [state]=\"link.permalink.route.extras?.state\"\n >\n {{ link.label }}\n </a>\n } @else if (link.modal) {\n <button\n class=\"sky-btn sky-btn-link-inline sky-link-list-item\"\n type=\"button\"\n (click)=\"openModal(link)\"\n >\n {{ link.label }}\n </button>\n }\n </li>\n }\n </ul>\n }\n}\n\n<ng-template #headingTemplateRef>\n <h2 class=\"sky-font-heading-4\">\n {{ headingText() }}\n </h2>\n</ng-template>\n", styles: ["ul.sky-link-list{list-style:none;margin:0 0 var(--sky-margin-stacked-xl) 0;padding-left:0}h2,li{margin:0 0 var(--sky-margin-stacked-sm) 0}ul.sky-link-list>li:has(>a[hidden]){display:none}\n"], dependencies: [{ kind: "directive", type: i1$
|
|
370
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyModalLinkListComponent, isStandalone: false, selector: "sky-modal-link-list", inputs: { links: { classPropertyName: "links", publicName: "links", isSignal: true, isRequired: false, transformFunction: null }, headingText: { classPropertyName: "headingText", publicName: "headingText", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<sky-wait [isWaiting]=\"links() === 'loading'\" />\n@if (links() === 'loading') {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n} @else {\n @if (linksArray().length > 0) {\n <ng-container [ngTemplateOutlet]=\"headingTemplateRef\" />\n <ul class=\"sky-link-list\">\n @for (link of linksArray(); track link) {\n <li>\n @if (link | linkAs: 'skyHref') {\n <a class=\"sky-link-list-item\" [skyHref]=\"link.permalink?.url\">\n {{ link.label }}\n </a>\n } @else if (link | linkAs: 'href') {\n <a class=\"sky-link-list-item\" [href]=\"link.permalink?.url\">\n {{ link.label }}\n </a>\n } @else if (link.permalink && link.permalink.route) {\n <a\n class=\"sky-link-list-item\"\n [skyAppLink]=\"link.permalink.route.commands\"\n [queryParams]=\"link.permalink.route.extras?.queryParams\"\n [queryParamsHandling]=\"\n link.permalink.route.extras?.queryParamsHandling\n \"\n [fragment]=\"link.permalink.route.extras?.fragment\"\n [preserveFragment]=\"link.permalink.route.extras?.preserveFragment\"\n [skipLocationChange]=\"\n link.permalink.route.extras?.skipLocationChange\n \"\n [replaceUrl]=\"link.permalink.route.extras?.replaceUrl\"\n [state]=\"link.permalink.route.extras?.state\"\n >\n {{ link.label }}\n </a>\n } @else if (link.modal) {\n <button\n class=\"sky-btn sky-btn-link-inline sky-link-list-item\"\n type=\"button\"\n (click)=\"openModal(link)\"\n >\n {{ link.label }}\n </button>\n }\n </li>\n }\n </ul>\n }\n}\n\n<ng-template #headingTemplateRef>\n <h2 class=\"sky-font-heading-4\">\n {{ headingText() }}\n </h2>\n</ng-template>\n", styles: ["ul.sky-link-list{list-style:none;margin:0 0 var(--sky-margin-stacked-xl) 0;padding-left:0}h2,li{margin:0 0 var(--sky-margin-stacked-sm) 0}ul.sky-link-list>li:has(>a[hidden]){display:none}\n"], dependencies: [{ kind: "directive", type: i1$3.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.λ3, selector: "[skyAppLink]", inputs: ["skyAppLink"] }, { kind: "directive", type: i1.λ1, selector: "[skyHref]", inputs: ["skyHref", "queryParams", "skyHrefElse"], outputs: ["skyHrefChange"] }, { kind: "component", type: i4.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }, { kind: "pipe", type: LinkAsPipe, name: "linkAs" }] }); }
|
|
371
371
|
}
|
|
372
372
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyModalLinkListComponent, decorators: [{
|
|
373
373
|
type: Component,
|
|
@@ -406,74 +406,71 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
406
406
|
* @internal
|
|
407
407
|
*/
|
|
408
408
|
class SkyNeedsAttentionComponent {
|
|
409
|
-
|
|
410
|
-
|
|
411
|
-
|
|
412
|
-
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
}
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
409
|
+
#logService;
|
|
410
|
+
#resolver;
|
|
411
|
+
constructor() {
|
|
412
|
+
this.items = input([]);
|
|
413
|
+
this.displayItems = toObservable(this.items).pipe(switchMap((items) => {
|
|
414
|
+
if (!items?.length) {
|
|
415
|
+
return of([]);
|
|
416
|
+
}
|
|
417
|
+
return forkJoin(items.map((item) => {
|
|
418
|
+
if (item.permalink?.url?.includes('://')) {
|
|
419
|
+
if (!this.#resolver) {
|
|
420
|
+
this.#logService.error(`SkyHrefResolverService is required but was not provided. Unable to resolve ${item.permalink.url}`);
|
|
421
|
+
return of(undefined);
|
|
422
|
+
}
|
|
423
|
+
return from(this.#resolver.resolveHref({ url: item.permalink.url })).pipe(map((result) => (result.userHasAccess ? item : undefined)));
|
|
424
|
+
}
|
|
425
|
+
return of(item);
|
|
426
|
+
})).pipe(map((items) => items.filter(Boolean)));
|
|
427
|
+
}), startWith([]));
|
|
428
|
+
this.#logService = inject(SkyLogService);
|
|
429
|
+
this.#resolver = inject(SkyHrefResolverService, { optional: true });
|
|
430
|
+
effect(() => {
|
|
431
|
+
const value = this.items();
|
|
432
|
+
if (value?.some((c) => c.message)) {
|
|
433
|
+
this.#logService.deprecated(`SkyActionHubNeedsAttention.message`, {
|
|
434
|
+
deprecationMajorVersion: 7,
|
|
435
|
+
replacementRecommendation: 'Use `title` instead.',
|
|
436
|
+
moreInfoUrl: 'https://developer.blackbaud.com/skyux/components/action-hub?docs-active-tab=development#interface-skyactionhubneedsattention',
|
|
437
|
+
});
|
|
438
|
+
}
|
|
439
|
+
});
|
|
421
440
|
}
|
|
422
|
-
#items;
|
|
423
|
-
#logService = inject(SkyLogService);
|
|
424
441
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
425
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyNeedsAttentionComponent, isStandalone:
|
|
442
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyNeedsAttentionComponent, isStandalone: true, selector: "sky-needs-attention", inputs: { items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<sky-box>\n <sky-box-header>\n <h2 class=\"sky-font-heading-2\">\n {{ 'sky_action_hub_needs_attention' | skyLibResources }}\n </h2>\n </sky-box-header>\n <sky-box-content>\n @let itemsToDisplay = displayItems | async;\n @if (!itemsToDisplay?.length) {\n {{ 'sky_action_hub_needs_attention_empty' | skyLibResources }}\n } @else {\n <ul class=\"sky-needs-attention-list\">\n @for (item of itemsToDisplay; track item; let isLast = $last) {\n <li\n class=\"sky-needs-attention-item-wrapper sky-font-emphasized\"\n [ngClass]=\"{\n 'sky-border-bottom-row': !isLast\n }\"\n >\n @if (\n (item | linkAs: 'skyAppLink') && item.permalink?.route;\n as permalinkRoute\n ) {\n <a\n class=\"sky-needs-attention-item\"\n [skyAppLink]=\"permalinkRoute.commands\"\n [queryParams]=\"permalinkRoute.extras?.queryParams\"\n [queryParamsHandling]=\"\n permalinkRoute.extras?.queryParamsHandling\n \"\n [fragment]=\"permalinkRoute.extras?.fragment\"\n [preserveFragment]=\"permalinkRoute.extras?.preserveFragment\"\n [skipLocationChange]=\"permalinkRoute.extras?.skipLocationChange\"\n [replaceUrl]=\"permalinkRoute.extras?.replaceUrl\"\n [state]=\"permalinkRoute.extras?.state\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'skyHref') {\n <a class=\"sky-needs-attention-item\" [skyHref]=\"item.permalink.url\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'href') {\n <a class=\"sky-needs-attention-item\" [href]=\"item.permalink.url\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'button') {\n <button\n class=\"sky-needs-attention-item sky-btn sky-btn-link-inline\"\n type=\"button\"\n (click)=\"item.click({ item })\"\n >\n {{ item.title }} {{ item.message }}\n </button>\n }\n <sky-icon\n class=\"sky-needs-attention-item-icon\"\n iconName=\"chevron-right\"\n iconSize=\"s\"\n />\n </li>\n }\n </ul>\n }\n </sky-box-content>\n</sky-box>\n", styles: [".sky-needs-attention-list:not(.sky-theme-modern *){--sky-override-needs-attention-item-icon-color: #686c73;--sky-override-needs-attention-item-wrapper-padding: var( --sky-margin-stacked-lg )}:host{display:block}h2{margin:0}ul{list-style:none;padding:0;margin:0}ul li{margin:0}.sky-needs-attention-item-wrapper{position:relative;display:grid;grid-template-columns:5fr 1fr;grid-template-areas:\"action icon\"}.sky-needs-attention-item-wrapper:not(:first-child){padding-top:var(--sky-override-needs-attention-item-wrapper-padding, var(--sky-space-stacked-l))}.sky-needs-attention-item-wrapper:not(:last-child){padding-bottom:var(--sky-override-needs-attention-item-wrapper-padding, var(--sky-space-stacked-l))}.sky-needs-attention-item-wrapper:has(a[hidden]){display:none}.sky-needs-attention-item{grid-area:action;text-align:left;width:100%;white-space:normal}.sky-needs-attention-item-icon{grid-area:icon;margin-left:auto;color:#686c73}.sky-needs-attention-item-icon .sky-needs-attention-item-icon{color:var(--sky-override-needs-attention-item-icon-color, var(--sky-color-icon-deemphasized))}.sky-needs-attention-item:focus-visible{outline:none}.sky-needs-attention-item:focus-visible:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 8px #0000004d}.sky-needs-attention-item:before{content:\" \";position:absolute;inset:0;cursor:pointer}\n"], dependencies: [{ kind: "ngmodule", type: SkyAppLinkModule }, { kind: "directive", type: i1.λ3, selector: "[skyAppLink]", inputs: ["skyAppLink"] }, { kind: "ngmodule", type: SkyBoxModule }, { kind: "component", type: i2.λ41, selector: "sky-box", inputs: ["headingText", "headingHidden", "headingLevel", "headingStyle", "helpPopoverContent", "helpPopoverTitle", "helpKey", "ariaLabel", "ariaLabelledBy", "ariaRole"] }, { kind: "component", type: i2.λ42, selector: "sky-box-header" }, { kind: "component", type: i2.λ43, selector: "sky-box-content" }, { kind: "ngmodule", type: SkyHrefModule }, { kind: "directive", type: i1.λ1, selector: "[skyHref]", inputs: ["skyHref", "queryParams", "skyHrefElse"], outputs: ["skyHrefChange"] }, { kind: "ngmodule", type: SkyIconModule }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "ngmodule", type: SkyPagesResourcesModule }, { kind: "pipe", type: i1$2.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "ngmodule", type: SkyThemeModule }, { kind: "ngmodule", type: SkyTrimModule }, { kind: "ngmodule", type: SkyWaitModule }, { kind: "ngmodule", type: LinkAsModule }, { kind: "pipe", type: LinkAsPipe, name: "linkAs" }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: AsyncPipe, name: "async" }] }); }
|
|
426
443
|
}
|
|
427
444
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionComponent, decorators: [{
|
|
428
445
|
type: Component,
|
|
429
|
-
args: [{ selector: 'sky-needs-attention',
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
446
|
+
args: [{ selector: 'sky-needs-attention', imports: [
|
|
447
|
+
SkyAppLinkModule,
|
|
448
|
+
SkyBoxModule,
|
|
449
|
+
SkyHrefModule,
|
|
450
|
+
SkyIconModule,
|
|
451
|
+
SkyPagesResourcesModule,
|
|
452
|
+
SkyThemeModule,
|
|
453
|
+
SkyTrimModule,
|
|
454
|
+
SkyWaitModule,
|
|
455
|
+
LinkAsModule,
|
|
456
|
+
NgClass,
|
|
457
|
+
AsyncPipe,
|
|
458
|
+
], template: "<sky-box>\n <sky-box-header>\n <h2 class=\"sky-font-heading-2\">\n {{ 'sky_action_hub_needs_attention' | skyLibResources }}\n </h2>\n </sky-box-header>\n <sky-box-content>\n @let itemsToDisplay = displayItems | async;\n @if (!itemsToDisplay?.length) {\n {{ 'sky_action_hub_needs_attention_empty' | skyLibResources }}\n } @else {\n <ul class=\"sky-needs-attention-list\">\n @for (item of itemsToDisplay; track item; let isLast = $last) {\n <li\n class=\"sky-needs-attention-item-wrapper sky-font-emphasized\"\n [ngClass]=\"{\n 'sky-border-bottom-row': !isLast\n }\"\n >\n @if (\n (item | linkAs: 'skyAppLink') && item.permalink?.route;\n as permalinkRoute\n ) {\n <a\n class=\"sky-needs-attention-item\"\n [skyAppLink]=\"permalinkRoute.commands\"\n [queryParams]=\"permalinkRoute.extras?.queryParams\"\n [queryParamsHandling]=\"\n permalinkRoute.extras?.queryParamsHandling\n \"\n [fragment]=\"permalinkRoute.extras?.fragment\"\n [preserveFragment]=\"permalinkRoute.extras?.preserveFragment\"\n [skipLocationChange]=\"permalinkRoute.extras?.skipLocationChange\"\n [replaceUrl]=\"permalinkRoute.extras?.replaceUrl\"\n [state]=\"permalinkRoute.extras?.state\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'skyHref') {\n <a class=\"sky-needs-attention-item\" [skyHref]=\"item.permalink.url\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'href') {\n <a class=\"sky-needs-attention-item\" [href]=\"item.permalink.url\"\n >{{ item.title }} {{ item.message }}</a\n >\n } @else if (item | linkAs: 'button') {\n <button\n class=\"sky-needs-attention-item sky-btn sky-btn-link-inline\"\n type=\"button\"\n (click)=\"item.click({ item })\"\n >\n {{ item.title }} {{ item.message }}\n </button>\n }\n <sky-icon\n class=\"sky-needs-attention-item-icon\"\n iconName=\"chevron-right\"\n iconSize=\"s\"\n />\n </li>\n }\n </ul>\n }\n </sky-box-content>\n</sky-box>\n", styles: [".sky-needs-attention-list:not(.sky-theme-modern *){--sky-override-needs-attention-item-icon-color: #686c73;--sky-override-needs-attention-item-wrapper-padding: var( --sky-margin-stacked-lg )}:host{display:block}h2{margin:0}ul{list-style:none;padding:0;margin:0}ul li{margin:0}.sky-needs-attention-item-wrapper{position:relative;display:grid;grid-template-columns:5fr 1fr;grid-template-areas:\"action icon\"}.sky-needs-attention-item-wrapper:not(:first-child){padding-top:var(--sky-override-needs-attention-item-wrapper-padding, var(--sky-space-stacked-l))}.sky-needs-attention-item-wrapper:not(:last-child){padding-bottom:var(--sky-override-needs-attention-item-wrapper-padding, var(--sky-space-stacked-l))}.sky-needs-attention-item-wrapper:has(a[hidden]){display:none}.sky-needs-attention-item{grid-area:action;text-align:left;width:100%;white-space:normal}.sky-needs-attention-item-icon{grid-area:icon;margin-left:auto;color:#686c73}.sky-needs-attention-item-icon .sky-needs-attention-item-icon{color:var(--sky-override-needs-attention-item-icon-color, var(--sky-color-icon-deemphasized))}.sky-needs-attention-item:focus-visible{outline:none}.sky-needs-attention-item:focus-visible:not(:active){border:none;box-shadow:inset 0 0 0 2px #1870b8,0 1px 8px #0000004d}.sky-needs-attention-item:before{content:\" \";position:absolute;inset:0;cursor:pointer}\n"] }]
|
|
459
|
+
}], ctorParameters: () => [] });
|
|
433
460
|
|
|
434
461
|
/**
|
|
435
462
|
* @internal
|
|
436
463
|
*/
|
|
437
464
|
class SkyNeedsAttentionModule {
|
|
438
465
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
439
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule,
|
|
440
|
-
|
|
441
|
-
SkyBoxModule,
|
|
442
|
-
SkyHrefModule,
|
|
443
|
-
SkyIconModule,
|
|
444
|
-
SkyPagesResourcesModule,
|
|
445
|
-
SkyThemeModule,
|
|
446
|
-
SkyTrimModule,
|
|
447
|
-
SkyWaitModule,
|
|
448
|
-
LinkAsModule], exports: [SkyNeedsAttentionComponent] }); }
|
|
449
|
-
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule, imports: [CommonModule,
|
|
450
|
-
SkyAppLinkModule,
|
|
451
|
-
SkyBoxModule,
|
|
452
|
-
SkyHrefModule,
|
|
453
|
-
SkyIconModule,
|
|
454
|
-
SkyPagesResourcesModule,
|
|
455
|
-
SkyThemeModule,
|
|
456
|
-
SkyTrimModule,
|
|
457
|
-
SkyWaitModule,
|
|
458
|
-
LinkAsModule] }); }
|
|
466
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule, imports: [SkyNeedsAttentionComponent], exports: [SkyNeedsAttentionComponent] }); }
|
|
467
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule, imports: [SkyNeedsAttentionComponent] }); }
|
|
459
468
|
}
|
|
460
469
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyNeedsAttentionModule, decorators: [{
|
|
461
470
|
type: NgModule,
|
|
462
471
|
args: [{
|
|
463
|
-
|
|
472
|
+
imports: [SkyNeedsAttentionComponent],
|
|
464
473
|
exports: [SkyNeedsAttentionComponent],
|
|
465
|
-
imports: [
|
|
466
|
-
CommonModule,
|
|
467
|
-
SkyAppLinkModule,
|
|
468
|
-
SkyBoxModule,
|
|
469
|
-
SkyHrefModule,
|
|
470
|
-
SkyIconModule,
|
|
471
|
-
SkyPagesResourcesModule,
|
|
472
|
-
SkyThemeModule,
|
|
473
|
-
SkyTrimModule,
|
|
474
|
-
SkyWaitModule,
|
|
475
|
-
LinkAsModule,
|
|
476
|
-
],
|
|
477
474
|
}]
|
|
478
475
|
}] });
|
|
479
476
|
|
|
@@ -495,7 +492,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
495
492
|
*/
|
|
496
493
|
class SkyPageHeaderAlertsComponent {
|
|
497
494
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderAlertsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
498
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderAlertsComponent, isStandalone: false, selector: "sky-page-header-alerts", hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-alert-space-below: var(--sky-margin-stacked-lg);--sky-override-page-header-alert-space-between: var(--sky-margin-stacked-lg)}:host{display:flex;flex-direction:column;row-gap:var(--sky-override-page-header-alert-space-between, var(--sky-space-stacked-l))}:host:not(:empty){margin-bottom:var(--sky-override-page-header-alert-space-below, var(--sky-space-stacked-l))}\n"] }); }
|
|
495
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderAlertsComponent, isStandalone: false, selector: "sky-page-header-alerts", hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-alert-space-below: var(--sky-margin-stacked-lg);--sky-override-page-header-alert-space-between: var(--sky-margin-stacked-lg)}:host{display:flex;flex-direction:column;row-gap:var(--sky-override-page-header-alert-space-between, var(--sky-space-stacked-l))}:host:not(:empty){margin-bottom:var(--sky-override-page-header-alert-space-below, var(--sky-space-stacked-l))}\n"] }); }
|
|
499
496
|
}
|
|
500
497
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderAlertsComponent, decorators: [{
|
|
501
498
|
type: Component,
|
|
@@ -522,7 +519,7 @@ class SkyPageHeaderAvatarComponent {
|
|
|
522
519
|
});
|
|
523
520
|
}
|
|
524
521
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderAvatarComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
525
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderAvatarComponent, isStandalone: false, selector: "sky-page-header-avatar", providers: [SkyDefaultInputProvider], hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-avatar-space-above: 5px;--sky-override-page-header-avatar-space-right-sm: var(--sky-margin-inline-lg);--sky-override-page-header-avatar-space-right-xs: var(--sky-margin-inline-sm)}:host{display:block}:host:not(:empty){padding-top:var(--sky-override-page-header-avatar-space-above, var(--sky-space-stacked-xs));margin-right:var(--sky-override-page-header-avatar-space-right-xs, var(--sky-space-inline-s))}@media (min-width: 768px){:host:not(:empty){margin-right:var(--sky-override-page-header-avatar-space-right-sm, var(--sky-space-inline-l))}}:host-context(.sky-responsive-container-sm):not(:empty),:host-context(.sky-responsive-container-md):not(:empty),:host-context(.sky-responsive-container-lg):not(:empty){margin-right:var(--sky-override-page-header-avatar-space-right-sm, var(--sky-space-inline-l))}\n"] }); }
|
|
522
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderAvatarComponent, isStandalone: false, selector: "sky-page-header-avatar", providers: [SkyDefaultInputProvider], hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-avatar-space-above: 5px;--sky-override-page-header-avatar-space-right-sm: var(--sky-margin-inline-lg);--sky-override-page-header-avatar-space-right-xs: var(--sky-margin-inline-sm)}:host{display:block}:host:not(:empty){padding-top:var(--sky-override-page-header-avatar-space-above, var(--sky-space-stacked-xs));margin-right:var(--sky-override-page-header-avatar-space-right-xs, var(--sky-space-inline-s))}@media (min-width: 768px){:host:not(:empty){margin-right:var(--sky-override-page-header-avatar-space-right-sm, var(--sky-space-inline-l))}}:host-context(.sky-responsive-container-sm):not(:empty),:host-context(.sky-responsive-container-md):not(:empty),:host-context(.sky-responsive-container-lg):not(:empty){margin-right:var(--sky-override-page-header-avatar-space-right-sm, var(--sky-space-inline-l))}\n"] }); }
|
|
526
523
|
}
|
|
527
524
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderAvatarComponent, decorators: [{
|
|
528
525
|
type: Component,
|
|
@@ -535,7 +532,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
535
532
|
*/
|
|
536
533
|
class SkyPageHeaderDetailsComponent {
|
|
537
534
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderDetailsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
538
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderDetailsComponent, isStandalone: false, selector: "sky-page-header-details", hostDirectives: [{ directive: i1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-details-space-above: var(--sky-margin-stacked-sm)}:host{display:block}:host:not(:empty){margin-top:var(--sky-override-page-header-details-space-above, var(--sky-space-stacked-s))}\n"] }); }
|
|
535
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageHeaderDetailsComponent, isStandalone: false, selector: "sky-page-header-details", hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<ng-content />\n", styles: [":host.sky-cmp-theme-default{--sky-override-page-header-details-space-above: var(--sky-margin-stacked-sm)}:host{display:block}:host:not(:empty){margin-top:var(--sky-override-page-header-details-space-above, var(--sky-space-stacked-s))}\n"] }); }
|
|
539
536
|
}
|
|
540
537
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderDetailsComponent, decorators: [{
|
|
541
538
|
type: Component,
|
|
@@ -547,11 +544,11 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
547
544
|
*/
|
|
548
545
|
class SkyPageHeaderComponent {
|
|
549
546
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
550
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyPageHeaderComponent, isStandalone: false, selector: "sky-page-header", inputs: { parentLink: "parentLink", pageTitle: "pageTitle" }, hostDirectives: [{ directive: i1$
|
|
547
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyPageHeaderComponent, isStandalone: false, selector: "sky-page-header", inputs: { parentLink: "parentLink", pageTitle: "pageTitle" }, hostDirectives: [{ directive: i1$4.SkyResponsiveHostDirective }], ngImport: i0, template: "<div class=\"sky-page-header\">\n <ng-content select=\"sky-page-header-alerts\" />\n <div class=\"sky-page-header-info\">\n <ng-content select=\"sky-page-header-avatar\" />\n <div class=\"sky-page-header-text-and-content\">\n <h1 class=\"sky-page-header-text\">\n @if (parentLink) {\n <span class=\"sky-page-header-parent-link-wrapper\">\n @if (parentLink.permalink?.route; as permalinkRoute) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyAppLink]=\"permalinkRoute.commands\"\n [queryParams]=\"permalinkRoute.extras?.queryParams\"\n [queryParamsHandling]=\"\n permalinkRoute.extras?.queryParamsHandling\n \"\n [fragment]=\"permalinkRoute.extras?.fragment\"\n [preserveFragment]=\"permalinkRoute.extras?.preserveFragment\"\n [skipLocationChange]=\"permalinkRoute.extras?.skipLocationChange\"\n [replaceUrl]=\"permalinkRoute.extras?.replaceUrl\"\n [state]=\"permalinkRoute.extras?.state\"\n >{{ parentLink.label }}</a\n >\n } @else if (parentLink.permalink?.url) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyHref]=\"parentLink.permalink.url\"\n >{{ parentLink.label }}</a\n >\n }\n <span class=\"sky-page-header-chevron\">\n <sky-icon iconName=\"chevron-right\" />\n </span>\n </span>\n <wbr />\n }\n <span class=\"sky-page-header-page-title sky-font-heading-1\">\n {{ pageTitle }}\n </span>\n </h1>\n <div class=\"sky-page-header-content\">\n <ng-content select=\"sky-page-header-details\" />\n <ng-content select=\"sky-page-header-actions\" />\n </div>\n </div>\n </div>\n</div>\n", styles: [".sky-page-header:not(.sky-theme-modern *){--sky-override-page-header-chevron-color: var(--sky-text-color-default);--sky-override-page-header-hub-spoke-spacing: 10px;--sky-override-page-header-parent-color: #0974a1}:host{flex-grow:var(--sky-layout-host-header-flex-grow, 0);display:block}.sky-page-header{margin:var(--sky-layout-host-header-spacing, 0)}.sky-page-header-info{display:flex}.sky-page-header-text{margin:0}.sky-page-header-page-title,.sky-page-header-parent-link-wrapper{display:inline-block;block-size:fit-content}.sky-page-header-parent-link-wrapper:has(a[hidden]){display:none}.sky-page-header-parent-link{color:var(--sky-override-page-header-parent-color, var(--sky-color-text-action))}.sky-page-header-chevron{color:var(--sky-override-page-header-chevron-color, var(--sky-color-icon-default));margin:0 var(--sky-override-page-header-hub-spoke-spacing, var(--sky-space-gap-icon-m))}.sky-page-header-chevron,.sky-page-header-parent-link,.sky-page-header-page-title{vertical-align:middle}.sky-page-header-content:empty{display:none}\n"], dependencies: [{ kind: "directive", type: i1.λ3, selector: "[skyAppLink]", inputs: ["skyAppLink"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "directive", type: i1.λ1, selector: "[skyHref]", inputs: ["skyHref", "queryParams", "skyHrefElse"], outputs: ["skyHrefChange"] }] }); }
|
|
551
548
|
}
|
|
552
549
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageHeaderComponent, decorators: [{
|
|
553
550
|
type: Component,
|
|
554
|
-
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-page-header', standalone: false, template: "<div class=\"sky-page-header\">\n <ng-content select=\"sky-page-header-alerts\" />\n <div class=\"sky-page-header-info\">\n <ng-content select=\"sky-page-header-avatar\" />\n <div class=\"sky-page-header-text-and-content\">\n <h1 class=\"sky-page-header-text\">\n @if (parentLink) {\n <span class=\"sky-page-header-parent-link-wrapper\">\n @if (parentLink.permalink?.route; as permalinkRoute) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyAppLink]=\"permalinkRoute.commands\"\n [queryParams]=\"permalinkRoute.extras?.queryParams\"\n [queryParamsHandling]=\"\n permalinkRoute.extras?.queryParamsHandling\n \"\n [fragment]=\"permalinkRoute.extras?.fragment\"\n [preserveFragment]=\"permalinkRoute.extras?.preserveFragment\"\n [skipLocationChange]=\"permalinkRoute.extras?.skipLocationChange\"\n [replaceUrl]=\"permalinkRoute.extras?.replaceUrl\"\n [state]=\"permalinkRoute.extras?.state\"\n >{{ parentLink.label }}</a\n >\n } @else if (parentLink.permalink?.url) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyHref]=\"parentLink.permalink.url\"\n >{{ parentLink.label }}</a\n >\n }\n <span class=\"sky-page-header-chevron\">\n <sky-icon
|
|
551
|
+
args: [{ hostDirectives: [SkyResponsiveHostDirective], selector: 'sky-page-header', standalone: false, template: "<div class=\"sky-page-header\">\n <ng-content select=\"sky-page-header-alerts\" />\n <div class=\"sky-page-header-info\">\n <ng-content select=\"sky-page-header-avatar\" />\n <div class=\"sky-page-header-text-and-content\">\n <h1 class=\"sky-page-header-text\">\n @if (parentLink) {\n <span class=\"sky-page-header-parent-link-wrapper\">\n @if (parentLink.permalink?.route; as permalinkRoute) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyAppLink]=\"permalinkRoute.commands\"\n [queryParams]=\"permalinkRoute.extras?.queryParams\"\n [queryParamsHandling]=\"\n permalinkRoute.extras?.queryParamsHandling\n \"\n [fragment]=\"permalinkRoute.extras?.fragment\"\n [preserveFragment]=\"permalinkRoute.extras?.preserveFragment\"\n [skipLocationChange]=\"permalinkRoute.extras?.skipLocationChange\"\n [replaceUrl]=\"permalinkRoute.extras?.replaceUrl\"\n [state]=\"permalinkRoute.extras?.state\"\n >{{ parentLink.label }}</a\n >\n } @else if (parentLink.permalink?.url) {\n <a\n class=\"sky-font-heading-1 sky-page-header-parent-link\"\n [skyHref]=\"parentLink.permalink.url\"\n >{{ parentLink.label }}</a\n >\n }\n <span class=\"sky-page-header-chevron\">\n <sky-icon iconName=\"chevron-right\" />\n </span>\n </span>\n <wbr />\n }\n <span class=\"sky-page-header-page-title sky-font-heading-1\">\n {{ pageTitle }}\n </span>\n </h1>\n <div class=\"sky-page-header-content\">\n <ng-content select=\"sky-page-header-details\" />\n <ng-content select=\"sky-page-header-actions\" />\n </div>\n </div>\n </div>\n</div>\n", styles: [".sky-page-header:not(.sky-theme-modern *){--sky-override-page-header-chevron-color: var(--sky-text-color-default);--sky-override-page-header-hub-spoke-spacing: 10px;--sky-override-page-header-parent-color: #0974a1}:host{flex-grow:var(--sky-layout-host-header-flex-grow, 0);display:block}.sky-page-header{margin:var(--sky-layout-host-header-spacing, 0)}.sky-page-header-info{display:flex}.sky-page-header-text{margin:0}.sky-page-header-page-title,.sky-page-header-parent-link-wrapper{display:inline-block;block-size:fit-content}.sky-page-header-parent-link-wrapper:has(a[hidden]){display:none}.sky-page-header-parent-link{color:var(--sky-override-page-header-parent-color, var(--sky-color-text-action))}.sky-page-header-chevron{color:var(--sky-override-page-header-chevron-color, var(--sky-color-icon-default));margin:0 var(--sky-override-page-header-hub-spoke-spacing, var(--sky-space-gap-icon-m))}.sky-page-header-chevron,.sky-page-header-parent-link,.sky-page-header-page-title{vertical-align:middle}.sky-page-header-content:empty{display:none}\n"] }]
|
|
555
552
|
}], propDecorators: { parentLink: [{
|
|
556
553
|
type: Input
|
|
557
554
|
}], pageTitle: [{
|
|
@@ -612,7 +609,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
612
609
|
*/
|
|
613
610
|
class SkyPageContentComponent {
|
|
614
611
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageContentComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
615
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageContentComponent, isStandalone: false, selector: "sky-page-content", hostDirectives: [{ directive: i1$
|
|
612
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyPageContentComponent, isStandalone: false, selector: "sky-page-content", hostDirectives: [{ directive: i1$4.SkyResponsiveHostDirective }], ngImport: i0, template: `<ng-content />`, isInline: true, styles: [":host{display:block;padding:var(--sky-layout-host-content-spacing, 0);flex-grow:var(--sky-layout-host-content-flex-grow, 0);overflow:var(--sky-layout-host-content-overflow, visible);position:var(--sky-layout-host-content-position, static)}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
616
613
|
}
|
|
617
614
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageContentComponent, decorators: [{
|
|
618
615
|
type: Component,
|
|
@@ -629,7 +626,7 @@ class SkyPageLinksComponent {
|
|
|
629
626
|
}
|
|
630
627
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageLinksComponent, decorators: [{
|
|
631
628
|
type: Component,
|
|
632
|
-
args: [{
|
|
629
|
+
args: [{ selector: 'sky-page-links', template: '<ng-content />', styles: [":host{display:var(--sky-layout-host-links-display, block);margin:var(--sky-layout-host-links-spacing, 0)}\n"] }]
|
|
633
630
|
}] });
|
|
634
631
|
|
|
635
632
|
/**
|
|
@@ -710,7 +707,7 @@ class SkyPageComponent {
|
|
|
710
707
|
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.1", type: SkyPageComponent, isStandalone: false, selector: "sky-page", inputs: { layout: { classPropertyName: "layout", publicName: "layout", isSignal: true, isRequired: false, transformFunction: null }, helpKey: { classPropertyName: "helpKey", publicName: "helpKey", isSignal: false, isRequired: false, transformFunction: null } }, providers: [
|
|
711
708
|
SkyPageThemeAdapterService,
|
|
712
709
|
provideSkyBreakpointObserver(SkyContainerBreakpointObserver),
|
|
713
|
-
], hostDirectives: [{ directive: i1$
|
|
710
|
+
], hostDirectives: [{ directive: i1$4.SkyLayoutHostDirective, inputs: ["layout", "layout"] }], ngImport: i0, template: `<ng-content />`, isInline: true }); }
|
|
714
711
|
}
|
|
715
712
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyPageComponent, decorators: [{
|
|
716
713
|
type: Component,
|
|
@@ -875,7 +872,7 @@ class SkyActionHubComponent {
|
|
|
875
872
|
}
|
|
876
873
|
#_needsAttention;
|
|
877
874
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
878
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyActionHubComponent, isStandalone: false, selector: "sky-action-hub", inputs: { needsAttention: "needsAttention", parentLink: "parentLink", recentLinks: "recentLinks", relatedLinks: "relatedLinks", settingsLinks: "settingsLinks", title: "title" }, ngImport: i0, template: "<sky-page layout=\"blocks\">\n <sky-page-header [pageTitle]=\"title\" [parentLink]=\"parentLink\">\n <sky-page-header-actions>\n <div class=\"sky-margin-stacked-sm\">\n <ng-content select=\"sky-action-hub-buttons\" />\n </div>\n </sky-page-header-actions>\n </sky-page-header>\n <sky-page-content>\n <div class=\"sky-margin-stacked-xl\">\n <sky-wait [isWaiting]=\"needsAttention === 'loading'\" />\n @if (needsAttention !== 'loading') {\n <sky-needs-attention [items]=\"needsAttentionArray\" />\n }\n </div>\n\n <div class=\"sky-margin-stacked-xl\">\n <ng-content select=\"sky-action-hub-content\" />\n </div>\n </sky-page-content>\n <sky-page-links>\n <sky-link-list\n [links]=\"relatedLinks | skyActionHubRelatedLinksSort\"\n [headingText]=\"'sky_action_hub_related_links' | skyLibResources\"\n />\n <sky-link-list-recently-accessed [recentLinks]=\"recentLinks\" />\n <sky-modal-link-list\n [links]=\"settingsLinks\"\n [headingText]=\"'sky_action_hub_settings_links' | skyLibResources\"\n />\n </sky-page-links>\n</sky-page>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: SkyLinkListComponent, selector: "sky-link-list", inputs: ["headingText", "links"] }, { kind: "component", type: SkyLinkListRecentlyAccessedComponent, selector: "sky-link-list-recently-accessed", inputs: ["recentLinks"] }, { kind: "component", type: SkyModalLinkListComponent, selector: "sky-modal-link-list", inputs: ["links", "headingText"] }, { kind: "component", type: SkyNeedsAttentionComponent, selector: "sky-needs-attention", inputs: ["items"] }, { kind: "component", type: SkyPageHeaderActionsComponent, selector: "sky-page-header-actions" }, { kind: "component", type: SkyPageHeaderComponent, selector: "sky-page-header", inputs: ["parentLink", "pageTitle"] }, { kind: "component", type: i4.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }, { kind: "component", type: SkyPageComponent, selector: "sky-page", inputs: ["layout", "helpKey"] }, { kind: "component", type: SkyPageContentComponent, selector: "sky-page-content" }, { kind: "component", type: SkyPageLinksComponent, selector: "sky-page-links" }, { kind: "pipe", type: i1$
|
|
875
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyActionHubComponent, isStandalone: false, selector: "sky-action-hub", inputs: { needsAttention: "needsAttention", parentLink: "parentLink", recentLinks: "recentLinks", relatedLinks: "relatedLinks", settingsLinks: "settingsLinks", title: "title" }, ngImport: i0, template: "<sky-page layout=\"blocks\">\n <sky-page-header [pageTitle]=\"title\" [parentLink]=\"parentLink\">\n <sky-page-header-actions>\n <div class=\"sky-margin-stacked-sm\">\n <ng-content select=\"sky-action-hub-buttons\" />\n </div>\n </sky-page-header-actions>\n </sky-page-header>\n <sky-page-content>\n <div class=\"sky-margin-stacked-xl\">\n <sky-wait [isWaiting]=\"needsAttention === 'loading'\" />\n @if (needsAttention !== 'loading') {\n <sky-needs-attention [items]=\"needsAttentionArray\" />\n }\n </div>\n\n <div class=\"sky-margin-stacked-xl\">\n <ng-content select=\"sky-action-hub-content\" />\n </div>\n </sky-page-content>\n <sky-page-links>\n <sky-link-list\n [links]=\"relatedLinks | skyActionHubRelatedLinksSort\"\n [headingText]=\"'sky_action_hub_related_links' | skyLibResources\"\n />\n <sky-link-list-recently-accessed [recentLinks]=\"recentLinks\" />\n <sky-modal-link-list\n [links]=\"settingsLinks\"\n [headingText]=\"'sky_action_hub_settings_links' | skyLibResources\"\n />\n </sky-page-links>\n</sky-page>\n", styles: [":host{display:block}\n"], dependencies: [{ kind: "component", type: SkyLinkListComponent, selector: "sky-link-list", inputs: ["headingText", "links"] }, { kind: "component", type: SkyLinkListRecentlyAccessedComponent, selector: "sky-link-list-recently-accessed", inputs: ["recentLinks"] }, { kind: "component", type: SkyModalLinkListComponent, selector: "sky-modal-link-list", inputs: ["links", "headingText"] }, { kind: "component", type: SkyNeedsAttentionComponent, selector: "sky-needs-attention", inputs: ["items"] }, { kind: "component", type: SkyPageHeaderActionsComponent, selector: "sky-page-header-actions" }, { kind: "component", type: SkyPageHeaderComponent, selector: "sky-page-header", inputs: ["parentLink", "pageTitle"] }, { kind: "component", type: i4.λ14, selector: "sky-wait", inputs: ["ariaLabel", "isWaiting", "isFullPage", "isNonBlocking", "screenReaderCompletedText"] }, { kind: "component", type: SkyPageComponent, selector: "sky-page", inputs: ["layout", "helpKey"] }, { kind: "component", type: SkyPageContentComponent, selector: "sky-page-content" }, { kind: "component", type: SkyPageLinksComponent, selector: "sky-page-links" }, { kind: "pipe", type: i1$2.SkyLibResourcesPipe, name: "skyLibResources" }, { kind: "pipe", type: SkyActionHubRelatedLinksSortPipe, name: "skyActionHubRelatedLinksSort" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
879
876
|
}
|
|
880
877
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyActionHubComponent, decorators: [{
|
|
881
878
|
type: Component,
|