@skyux/indicators 12.0.0-alpha.9 → 12.0.0-beta.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-indicators-testing.mjs +24 -1
- package/fesm2022/skyux-indicators-testing.mjs.map +1 -1
- package/fesm2022/skyux-indicators.mjs +52 -60
- package/fesm2022/skyux-indicators.mjs.map +1 -1
- package/lib/modules/alert/alert.component.d.ts +1 -3
- package/lib/modules/label/label.component.d.ts +1 -4
- package/lib/modules/label/label.module.d.ts +2 -1
- package/lib/modules/shared/indicator-icon-utility.d.ts +1 -2
- package/lib/modules/status-indicator/status-indicator.component.d.ts +1 -4
- package/lib/modules/status-indicator/status-indicator.module.d.ts +2 -1
- package/lib/modules/text-highlight/text-highlight.directive.d.ts +1 -0
- package/lib/modules/wait/wait-adapter.service.d.ts +0 -1
- package/package.json +20 -23
- package/testing/modules/text-highlight/text-highlight-harness-filters.d.ts +6 -0
- package/testing/modules/text-highlight/text-highlight-harness.d.ts +21 -0
- package/testing/public-api.d.ts +2 -0
- package/documentation.json +0 -16493
- package/lib/modules/shared/indicator-icon.d.ts +0 -9
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import * as i1 from '@angular/common';
|
|
2
2
|
import { CommonModule } from '@angular/common';
|
|
3
3
|
import * as i0 from '@angular/core';
|
|
4
|
-
import { NgModule, EventEmitter, inject, Output, Input, Component, Injectable, input, computed, ChangeDetectionStrategy, ChangeDetectorRef, ElementRef, Directive, ViewChild, ViewChildren, EnvironmentInjector } from '@angular/core';
|
|
4
|
+
import { NgModule, EventEmitter, inject, Output, Input, Component, Injectable, input, computed, ChangeDetectionStrategy, ChangeDetectorRef, ElementRef, HostBinding, Directive, ViewChild, ViewChildren, EnvironmentInjector } from '@angular/core';
|
|
5
5
|
import * as i3 from '@skyux/icon';
|
|
6
6
|
import { SkyIconModule } from '@skyux/icon';
|
|
7
7
|
import * as i1$1 from '@skyux/theme';
|
|
@@ -148,39 +148,21 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
148
148
|
* @internal
|
|
149
149
|
*/
|
|
150
150
|
class SkyIndicatorIconUtility {
|
|
151
|
-
static
|
|
151
|
+
static getIconNameForType(indicatorType) {
|
|
152
152
|
let icon;
|
|
153
|
-
let baseIcon;
|
|
154
|
-
let topIcon;
|
|
155
153
|
switch (indicatorType) {
|
|
156
154
|
case 'danger':
|
|
157
155
|
case 'warning':
|
|
158
156
|
icon = 'warning';
|
|
159
|
-
baseIcon = 'triangle-solid';
|
|
160
|
-
topIcon = 'exclamation';
|
|
161
157
|
break;
|
|
162
158
|
case 'info':
|
|
163
|
-
icon = '
|
|
164
|
-
baseIcon = 'circle-solid';
|
|
165
|
-
topIcon = 'help-i';
|
|
159
|
+
icon = 'info';
|
|
166
160
|
break;
|
|
167
161
|
case 'success':
|
|
168
|
-
icon = '
|
|
169
|
-
baseIcon = 'circle-solid';
|
|
170
|
-
topIcon = 'check';
|
|
162
|
+
icon = 'success';
|
|
171
163
|
break;
|
|
172
164
|
}
|
|
173
|
-
return
|
|
174
|
-
defaultThemeIcon: icon,
|
|
175
|
-
modernThemeBaseIcon: {
|
|
176
|
-
icon: baseIcon,
|
|
177
|
-
iconType: 'skyux',
|
|
178
|
-
},
|
|
179
|
-
modernThemeTopIcon: {
|
|
180
|
-
icon: topIcon,
|
|
181
|
-
iconType: 'skyux',
|
|
182
|
-
},
|
|
183
|
-
};
|
|
165
|
+
return icon;
|
|
184
166
|
}
|
|
185
167
|
}
|
|
186
168
|
|
|
@@ -254,9 +236,7 @@ class SkyAlertComponent {
|
|
|
254
236
|
this.closedChange.emit(true);
|
|
255
237
|
}
|
|
256
238
|
#updateAlertIcon() {
|
|
257
|
-
|
|
258
|
-
this.alertBaseIcon = indicatorIcon.modernThemeBaseIcon;
|
|
259
|
-
this.alertTopIcon = indicatorIcon.modernThemeTopIcon;
|
|
239
|
+
this.iconName = SkyIndicatorIconUtility.getIconNameForType(this.alertTypeOrDefault);
|
|
260
240
|
}
|
|
261
241
|
#updateDescriptionComputed() {
|
|
262
242
|
this.#unsubscribe();
|
|
@@ -288,11 +268,11 @@ class SkyAlertComponent {
|
|
|
288
268
|
}
|
|
289
269
|
}
|
|
290
270
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
291
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyAlertComponent, isStandalone: false, selector: "sky-alert", inputs: { alertType: "alertType", closeable: "closeable", closed: "closed", descriptionType: "descriptionType", customDescription: "customDescription" }, outputs: { closedChange: "closedChange" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<div\n class=\"sky-alert\"\n role=\"alert\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-box sky-elevation-1': 'modern'\n }\"\n [hidden]=\"closed\"\n [ngClass]=\"{\n 'sky-alert-info': alertTypeOrDefault === 'info',\n 'sky-alert-success': alertTypeOrDefault === 'success',\n 'sky-alert-warning': alertTypeOrDefault === 'warning',\n 'sky-alert-danger': alertTypeOrDefault === 'danger',\n 'sky-alert-closeable': closeable\n }\"\n>\n <div aria-hidden=\"true\" class=\"sky-alert-icon
|
|
271
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyAlertComponent, isStandalone: false, selector: "sky-alert", inputs: { alertType: "alertType", closeable: "closeable", closed: "closed", descriptionType: "descriptionType", customDescription: "customDescription" }, outputs: { closedChange: "closedChange" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<div\n class=\"sky-alert\"\n role=\"alert\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-box sky-elevation-1': 'modern'\n }\"\n [hidden]=\"closed\"\n [ngClass]=\"{\n 'sky-alert-info': alertTypeOrDefault === 'info',\n 'sky-alert-success': alertTypeOrDefault === 'success',\n 'sky-alert-warning': alertTypeOrDefault === 'warning',\n 'sky-alert-danger': alertTypeOrDefault === 'danger',\n 'sky-alert-closeable': closeable\n }\"\n>\n <div *skyThemeIf=\"'modern'\" aria-hidden=\"true\" class=\"sky-alert-icon\">\n <sky-icon iconSize=\"xxl\" variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n <div *skyThemeIf=\"'default'\" aria-hidden=\"true\" class=\"sky-alert-icon\">\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <div class=\"sky-alert-content\">\n <ng-content />\n </div>\n <button\n class=\"sky-alert-close\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_alert_close' | skyLibResources\"\n [hidden]=\"!closeable\"\n (click)=\"close()\"\n >\n <span aria-hidden=\"true\">\n <sky-icon iconName=\"close\" />\n </span>\n </button>\n</div>\n", styles: [":host.sky-cmp-theme-default{display:block}.sky-alert:not(.sky-theme-modern *){padding:0 10px;border-left:solid 30px;color:var(--sky-text-color-default);display:flex;flex-direction:row;align-items:center}.sky-alert:not(.sky-theme-modern *) .sky-alert-content{padding:10px 0;width:100%}.sky-alert:not(.sky-theme-modern *) .sky-alert-content ::ng-deep a{color:#212327cc;text-decoration:underline}.sky-alert:not(.sky-theme-modern *) .sky-alert-content ::ng-deep a:hover{color:var(--sky-text-color-default)}.sky-alert:not(.sky-theme-modern *) button{margin-left:auto;width:32px;height:32px}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-svg-path-2-color-input: #212327}.sky-alert:not(.sky-theme-modern *).sky-alert-info{background-color:var(--sky-background-color-info);border-color:var(--sky-highlight-color-info)}.sky-alert:not(.sky-theme-modern *).sky-alert-success{background-color:var(--sky-background-color-success);border-color:var(--sky-highlight-color-success)}.sky-alert:not(.sky-theme-modern *).sky-alert-warning{background-color:var(--sky-background-color-warning);border-color:var(--sky-highlight-color-warning)}.sky-alert:not(.sky-theme-modern *).sky-alert-danger{background-color:var(--sky-background-color-danger);border-color:var(--sky-highlight-color-danger)}.sky-alert:not(.sky-theme-modern *) .sky-alert-close{cursor:pointer;font-weight:700;line-height:1;margin:0;padding:0;color:var(--sky-text-color-default);opacity:.8;border:none;border-radius:3px;background-color:transparent;display:none;flex-shrink:0}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:hover{opacity:1;border:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:focus-visible{border:var(--sky-background-color-primary-dark) solid 2px;outline:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:active{border:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:focus-visible:not(:active){box-shadow:none}.sky-alert:not(.sky-theme-modern *).sky-alert-closeable .sky-alert-close{display:block}.sky-alert:not(.sky-theme-modern *) .sky-alert-icon{color:#fff;margin-left:-35px;margin-right:17px}.sky-alert:not(.sky-theme-modern *).sky-alert-info .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-info)}.sky-alert:not(.sky-theme-modern *).sky-alert-success .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-success)}.sky-alert:not(.sky-theme-modern *).sky-alert-warning .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-warning)}.sky-alert:not(.sky-theme-modern *).sky-alert-danger .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-danger)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-alert{--sky-override-alert-button-padding: 0;--sky-override-alert-button-size: 32px;--sky-override-alert-inner-icon-color: var(--sky-color-icon-default);--sky-override-alert-padding: 0 var(--modern-size-10);--sky-override-alert-text-link-color: #212327cc;--sky-override-alert-text-vertical-padding: var(--modern-size-15);--sky-override-sky-icon-svg-size-xxl: 32px}:host-context(.sky-theme-modern) .sky-alert{padding:var(--sky-override-alert-padding, var(--sky-space-inset-balanced-s));border-left:solid var(--sky-border-width-accent);color:var(--sky-color-text-default);display:flex;flex-direction:row;align-items:center}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content{padding:var(--sky-override-alert-text-vertical-padding, var(--sky-space-inset-balanced-none)) var(--sky-space-gap-text_action-m) var(--sky-override-alert-text-vertical-padding, var(--sky-space-inset-balanced-none)) var(--sky-space-gap-icon-l);width:100%}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content ::ng-deep a{color:var(--sky-override-alert-text-link-color, var(--sky-color-text-default));text-decoration:var(--sky-font-text_decoration-visible_link)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content ::ng-deep a:hover{color:var(--sky-color-text-default)}:host-context(.sky-theme-modern) .sky-alert button{margin-left:auto;height:var(--sky-override-alert-button-size, auto);width:var(--sky-override-alert-button-size, auto)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info{background-color:var(--sky-color-background-container-info);border-color:var(--sky-color-border-info);--sky-icon-svg-path-2-color-input: var( --sky-override-alert-inner-icon-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success{background-color:var(--sky-color-background-container-success);border-color:var(--sky-color-border-success);--sky-icon-svg-path-2-color-input: var( --sky-override-alert-inner-icon-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning{background-color:var(--sky-color-background-container-warning);border-color:var(--sky-color-border-warning);--sky-icon-svg-path-2-color-input: var(--sky-color-icon-default)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger{background-color:var(--sky-color-background-container-danger);border-color:var(--sky-color-border-danger)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close{cursor:pointer;line-height:1;padding:var(--sky-override-alert-button-padding, var(--sky-space-inset-balanced-xs));color:var(--sky-color-icon-default);border-style:solid;border-color:var(--sky-color-border-action-tertiary-base);border-radius:var(--sky-border-radius-s);border-width:var(--sky-border-width-action-base);background-color:var(--sky-color-background-action-tertiary-base);display:none;flex-shrink:0}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:hover{opacity:1;border-color:var(--sky-color-border-action-tertiary-hover);border-width:var(--sky-border-width-action-hover)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:focus-visible{outline:none;border-color:var(--sky-color-border-action-tertiary-focus);border-width:var(--sky-border-width-action-focus)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:active{border-color:var(--sky-color-border-action-tertiary-focus);border-width:var(--sky-border-width-action-focus)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:focus-visible:not(:active){box-shadow:var(--sky-elevation-raised-100)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-closeable .sky-alert-close{display:block}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info .sky-alert-icon{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success .sky-alert-icon{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning .sky-alert-icon{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger .sky-alert-icon{color:var(--sky-color-icon-danger)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "directive", type: i1$1.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
292
272
|
}
|
|
293
273
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyAlertComponent, decorators: [{
|
|
294
274
|
type: Component,
|
|
295
|
-
args: [{ selector: 'sky-alert', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<div\n class=\"sky-alert\"\n role=\"alert\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-box sky-elevation-1': 'modern'\n }\"\n [hidden]=\"closed\"\n [ngClass]=\"{\n 'sky-alert-info': alertTypeOrDefault === 'info',\n 'sky-alert-success': alertTypeOrDefault === 'success',\n 'sky-alert-warning': alertTypeOrDefault === 'warning',\n 'sky-alert-danger': alertTypeOrDefault === 'danger',\n 'sky-alert-closeable': closeable\n }\"\n>\n <div aria-hidden=\"true\" class=\"sky-alert-icon
|
|
275
|
+
args: [{ selector: 'sky-alert', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<div\n class=\"sky-alert\"\n role=\"alert\"\n [skyThemeClass]=\"{\n 'sky-rounded-corners': 'default',\n 'sky-box sky-elevation-1': 'modern'\n }\"\n [hidden]=\"closed\"\n [ngClass]=\"{\n 'sky-alert-info': alertTypeOrDefault === 'info',\n 'sky-alert-success': alertTypeOrDefault === 'success',\n 'sky-alert-warning': alertTypeOrDefault === 'warning',\n 'sky-alert-danger': alertTypeOrDefault === 'danger',\n 'sky-alert-closeable': closeable\n }\"\n>\n <div *skyThemeIf=\"'modern'\" aria-hidden=\"true\" class=\"sky-alert-icon\">\n <sky-icon iconSize=\"xxl\" variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n <div *skyThemeIf=\"'default'\" aria-hidden=\"true\" class=\"sky-alert-icon\">\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <div class=\"sky-alert-content\">\n <ng-content />\n </div>\n <button\n class=\"sky-alert-close\"\n type=\"button\"\n [attr.aria-label]=\"'skyux_alert_close' | skyLibResources\"\n [hidden]=\"!closeable\"\n (click)=\"close()\"\n >\n <span aria-hidden=\"true\">\n <sky-icon iconName=\"close\" />\n </span>\n </button>\n</div>\n", styles: [":host.sky-cmp-theme-default{display:block}.sky-alert:not(.sky-theme-modern *){padding:0 10px;border-left:solid 30px;color:var(--sky-text-color-default);display:flex;flex-direction:row;align-items:center}.sky-alert:not(.sky-theme-modern *) .sky-alert-content{padding:10px 0;width:100%}.sky-alert:not(.sky-theme-modern *) .sky-alert-content ::ng-deep a{color:#212327cc;text-decoration:underline}.sky-alert:not(.sky-theme-modern *) .sky-alert-content ::ng-deep a:hover{color:var(--sky-text-color-default)}.sky-alert:not(.sky-theme-modern *) button{margin-left:auto;width:32px;height:32px}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-svg-path-2-color-input: #212327}.sky-alert:not(.sky-theme-modern *).sky-alert-info{background-color:var(--sky-background-color-info);border-color:var(--sky-highlight-color-info)}.sky-alert:not(.sky-theme-modern *).sky-alert-success{background-color:var(--sky-background-color-success);border-color:var(--sky-highlight-color-success)}.sky-alert:not(.sky-theme-modern *).sky-alert-warning{background-color:var(--sky-background-color-warning);border-color:var(--sky-highlight-color-warning)}.sky-alert:not(.sky-theme-modern *).sky-alert-danger{background-color:var(--sky-background-color-danger);border-color:var(--sky-highlight-color-danger)}.sky-alert:not(.sky-theme-modern *) .sky-alert-close{cursor:pointer;font-weight:700;line-height:1;margin:0;padding:0;color:var(--sky-text-color-default);opacity:.8;border:none;border-radius:3px;background-color:transparent;display:none;flex-shrink:0}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:hover{opacity:1;border:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:focus-visible{border:var(--sky-background-color-primary-dark) solid 2px;outline:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:active{border:none}.sky-alert:not(.sky-theme-modern *) .sky-alert-close:focus-visible:not(:active){box-shadow:none}.sky-alert:not(.sky-theme-modern *).sky-alert-closeable .sky-alert-close{display:block}.sky-alert:not(.sky-theme-modern *) .sky-alert-icon{color:#fff;margin-left:-35px;margin-right:17px}.sky-alert:not(.sky-theme-modern *).sky-alert-info .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-info)}.sky-alert:not(.sky-theme-modern *).sky-alert-success .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-success)}.sky-alert:not(.sky-theme-modern *).sky-alert-warning .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-warning)}.sky-alert:not(.sky-theme-modern *).sky-alert-danger .sky-alert-icon{--sky-icon-svg-path-2-color-input: var(--sky-highlight-color-danger)}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-alert{--sky-override-alert-button-padding: 0;--sky-override-alert-button-size: 32px;--sky-override-alert-inner-icon-color: var(--sky-color-icon-default);--sky-override-alert-padding: 0 var(--modern-size-10);--sky-override-alert-text-link-color: #212327cc;--sky-override-alert-text-vertical-padding: var(--modern-size-15);--sky-override-sky-icon-svg-size-xxl: 32px}:host-context(.sky-theme-modern) .sky-alert{padding:var(--sky-override-alert-padding, var(--sky-space-inset-balanced-s));border-left:solid var(--sky-border-width-accent);color:var(--sky-color-text-default);display:flex;flex-direction:row;align-items:center}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content{padding:var(--sky-override-alert-text-vertical-padding, var(--sky-space-inset-balanced-none)) var(--sky-space-gap-text_action-m) var(--sky-override-alert-text-vertical-padding, var(--sky-space-inset-balanced-none)) var(--sky-space-gap-icon-l);width:100%}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content ::ng-deep a{color:var(--sky-override-alert-text-link-color, var(--sky-color-text-default));text-decoration:var(--sky-font-text_decoration-visible_link)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-content ::ng-deep a:hover{color:var(--sky-color-text-default)}:host-context(.sky-theme-modern) .sky-alert button{margin-left:auto;height:var(--sky-override-alert-button-size, auto);width:var(--sky-override-alert-button-size, auto)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info{background-color:var(--sky-color-background-container-info);border-color:var(--sky-color-border-info);--sky-icon-svg-path-2-color-input: var( --sky-override-alert-inner-icon-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success{background-color:var(--sky-color-background-container-success);border-color:var(--sky-color-border-success);--sky-icon-svg-path-2-color-input: var( --sky-override-alert-inner-icon-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning{background-color:var(--sky-color-background-container-warning);border-color:var(--sky-color-border-warning);--sky-icon-svg-path-2-color-input: var(--sky-color-icon-default)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger{background-color:var(--sky-color-background-container-danger);border-color:var(--sky-color-border-danger)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close{cursor:pointer;line-height:1;padding:var(--sky-override-alert-button-padding, var(--sky-space-inset-balanced-xs));color:var(--sky-color-icon-default);border-style:solid;border-color:var(--sky-color-border-action-tertiary-base);border-radius:var(--sky-border-radius-s);border-width:var(--sky-border-width-action-base);background-color:var(--sky-color-background-action-tertiary-base);display:none;flex-shrink:0}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:hover{opacity:1;border-color:var(--sky-color-border-action-tertiary-hover);border-width:var(--sky-border-width-action-hover)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:focus-visible{outline:none;border-color:var(--sky-color-border-action-tertiary-focus);border-width:var(--sky-border-width-action-focus)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:active{border-color:var(--sky-color-border-action-tertiary-focus);border-width:var(--sky-border-width-action-focus)}:host-context(.sky-theme-modern) .sky-alert .sky-alert-close:focus-visible:not(:active){box-shadow:var(--sky-elevation-raised-100)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-closeable .sky-alert-close{display:block}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info .sky-alert-icon{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success .sky-alert-icon{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning .sky-alert-icon{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger .sky-alert-icon{color:var(--sky-color-icon-danger)}\n"] }]
|
|
296
276
|
}], propDecorators: { alertType: [{
|
|
297
277
|
type: Input
|
|
298
278
|
}], closeable: [{
|
|
@@ -350,11 +330,11 @@ class SkyExpansionIndicatorComponent {
|
|
|
350
330
|
}
|
|
351
331
|
}
|
|
352
332
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyExpansionIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
353
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyExpansionIndicatorComponent, isStandalone: false, selector: "sky-expansion-indicator", inputs: { direction: "direction" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <
|
|
333
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyExpansionIndicatorComponent, isStandalone: false, selector: "sky-expansion-indicator", inputs: { direction: "direction" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <span class=\"sky-expansion-indicator-glyph-container\">\n <i class=\"sky-expansion-indicator-part sky-expansion-indicator-left\"> </i>\n <i class=\"sky-expansion-indicator-part sky-expansion-indicator-right\"> </i>\n </span>\n</div>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){--sky-override-expansion-indicator-container-left: 4px;--sky-override-expansion-indicator-container-top: 3.5px;--sky-override-expansion-indicator-leg-left-left: 4px;--sky-override-expansion-indicator-leg-right-left: 10.5px;--sky-override-expansion-indicator-line-height: normal;--sky-override-expansion-indicator-size: 26px;--sky-override-expansion-indicator-size-half: 13px;--sky-override-expansion-indicator-color: var( --sky-expansion-indicator-color, #cdcfd2 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-expansion-indicator{--sky-override-expansion-indicator-container-left: 4px;--sky-override-expansion-indicator-container-top: 3.5px;--sky-override-expansion-indicator-leg-left-left: 4px;--sky-override-expansion-indicator-leg-right-left: 10.5px;--sky-override-expansion-indicator-line-height: normal;--sky-override-expansion-indicator-size: 26px;--sky-override-expansion-indicator-size-half: 13px}:host{line-height:var(--sky-override-expansion-indicator-line-height, 1)}.sky-expansion-indicator{display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:var(--sky-override-expansion-indicator-size, var(--sky-size-icon-s));margin:0;overflow:hidden;position:relative;vertical-align:top;width:var(--sky-override-expansion-indicator-size, var(--sky-size-icon-s))}.sky-expansion-indicator-part{background:var(--sky-override-expansion-indicator-color, var(--sky-color-icon-deemphasized));border:none;border-radius:1px;display:inline-block;height:2px;position:absolute;top:var(--sky-override-expansion-indicator-size-half, calc(var(--sky-size-icon-s) / 2));transition:transform .25s,left .25s;vertical-align:top;width:11px}.sky-expansion-indicator-glyph-container{left:var(--sky-override-expansion-indicator-container-left, 0);display:inline-block;position:absolute;top:var(--sky-override-expansion-indicator-container-top, 1.5px);transform:scale(.68)}.sky-expansion-indicator-left{left:var(--sky-override-expansion-indicator-leg-left-left, 2.75px)}.sky-expansion-indicator-right{left:var(--sky-override-expansion-indicator-leg-right-left, 9.25px)}.sky-expansion-indicator-up .sky-expansion-indicator-left{transform:rotate(-45deg)}.sky-expansion-indicator-up .sky-expansion-indicator-right,.sky-expansion-indicator-down .sky-expansion-indicator-left{transform:rotate(45deg)}.sky-expansion-indicator-down .sky-expansion-indicator-right{transform:rotate(-45deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
354
334
|
}
|
|
355
335
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyExpansionIndicatorComponent, decorators: [{
|
|
356
336
|
type: Component,
|
|
357
|
-
args: [{ selector: 'sky-expansion-indicator', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <
|
|
337
|
+
args: [{ selector: 'sky-expansion-indicator', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <span class=\"sky-expansion-indicator-glyph-container\">\n <i class=\"sky-expansion-indicator-part sky-expansion-indicator-left\"> </i>\n <i class=\"sky-expansion-indicator-part sky-expansion-indicator-right\"> </i>\n </span>\n</div>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){--sky-override-expansion-indicator-container-left: 4px;--sky-override-expansion-indicator-container-top: 3.5px;--sky-override-expansion-indicator-leg-left-left: 4px;--sky-override-expansion-indicator-leg-right-left: 10.5px;--sky-override-expansion-indicator-line-height: normal;--sky-override-expansion-indicator-size: 26px;--sky-override-expansion-indicator-size-half: 13px;--sky-override-expansion-indicator-color: var( --sky-expansion-indicator-color, #cdcfd2 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-expansion-indicator{--sky-override-expansion-indicator-container-left: 4px;--sky-override-expansion-indicator-container-top: 3.5px;--sky-override-expansion-indicator-leg-left-left: 4px;--sky-override-expansion-indicator-leg-right-left: 10.5px;--sky-override-expansion-indicator-line-height: normal;--sky-override-expansion-indicator-size: 26px;--sky-override-expansion-indicator-size-half: 13px}:host{line-height:var(--sky-override-expansion-indicator-line-height, 1)}.sky-expansion-indicator{display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:var(--sky-override-expansion-indicator-size, var(--sky-size-icon-s));margin:0;overflow:hidden;position:relative;vertical-align:top;width:var(--sky-override-expansion-indicator-size, var(--sky-size-icon-s))}.sky-expansion-indicator-part{background:var(--sky-override-expansion-indicator-color, var(--sky-color-icon-deemphasized));border:none;border-radius:1px;display:inline-block;height:2px;position:absolute;top:var(--sky-override-expansion-indicator-size-half, calc(var(--sky-size-icon-s) / 2));transition:transform .25s,left .25s;vertical-align:top;width:11px}.sky-expansion-indicator-glyph-container{left:var(--sky-override-expansion-indicator-container-left, 0);display:inline-block;position:absolute;top:var(--sky-override-expansion-indicator-container-top, 1.5px);transform:scale(.68)}.sky-expansion-indicator-left{left:var(--sky-override-expansion-indicator-leg-left-left, 2.75px)}.sky-expansion-indicator-right{left:var(--sky-override-expansion-indicator-leg-right-left, 9.25px)}.sky-expansion-indicator-up .sky-expansion-indicator-left{transform:rotate(-45deg)}.sky-expansion-indicator-up .sky-expansion-indicator-right,.sky-expansion-indicator-down .sky-expansion-indicator-left{transform:rotate(45deg)}.sky-expansion-indicator-down .sky-expansion-indicator-right{transform:rotate(-45deg)}\n"] }]
|
|
358
338
|
}], propDecorators: { direction: [{
|
|
359
339
|
type: Input
|
|
360
340
|
}] } });
|
|
@@ -428,11 +408,11 @@ class SkyChevronComponent {
|
|
|
428
408
|
}
|
|
429
409
|
}
|
|
430
410
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyChevronComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
431
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyChevronComponent, isStandalone: false, selector: "sky-chevron", inputs: { ariaControls: "ariaControls", ariaLabel: "ariaLabel", direction: "direction", disabled: "disabled" }, outputs: { directionChange: "directionChange" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<button\n class=\"sky-chevron\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n [ngClass]=\"['sky-chevron-' + directionOrDefault]\"\n [skyThemeClass]=\"{\n 'sky-btn sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"chevronClick($event)\"\n (keydown)=\"chevronKeyDown($event)\"\n>\n <sky-expansion-indicator [direction]=\"directionOrDefault\" />\n</button>\n", styles: [".sky-chevron:not(.sky-theme-modern *){border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;padding:0;overflow:hidden;width:24px;cursor:pointer;position:relative;vertical-align:top}.sky-chevron:not(.sky-theme-modern *):hover .sky-chevron-part{border-color:#979ba2}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-
|
|
411
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.1", type: SkyChevronComponent, isStandalone: false, selector: "sky-chevron", inputs: { ariaControls: "ariaControls", ariaLabel: "ariaLabel", direction: "direction", disabled: "disabled" }, outputs: { directionChange: "directionChange" }, hostDirectives: [{ directive: i1$1.SkyThemeComponentClassDirective }], ngImport: i0, template: "<button\n class=\"sky-chevron\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n [ngClass]=\"['sky-chevron-' + directionOrDefault]\"\n [skyThemeClass]=\"{\n 'sky-btn sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"chevronClick($event)\"\n (keydown)=\"chevronKeyDown($event)\"\n>\n <sky-expansion-indicator [direction]=\"directionOrDefault\" />\n</button>\n", styles: [".sky-chevron:not(.sky-theme-modern *){border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;padding:0;overflow:hidden;width:24px;cursor:pointer;position:relative;vertical-align:top}.sky-chevron:not(.sky-theme-modern *):hover .sky-chevron-part{border-color:#979ba2}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-chevron{--sky-override-chevron-line-height: calc(20 / 14);--sky-override-chevron-size: 24px;padding:0}:host-context(.sky-theme-modern) .sky-chevron{border:none;background-color:transparent;flex-shrink:0;height:var(--sky-override-chevron-size, \"\");line-height:var(--sky-override-chevron-line-height, 1);margin:0;overflow:hidden;width:var(--sky-override-chevron-size, \"\");cursor:pointer;position:relative;vertical-align:top}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: SkyExpansionIndicatorComponent, selector: "sky-expansion-indicator", inputs: ["direction"] }] }); }
|
|
432
412
|
}
|
|
433
413
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyChevronComponent, decorators: [{
|
|
434
414
|
type: Component,
|
|
435
|
-
args: [{ selector: 'sky-chevron', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<button\n class=\"sky-chevron\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n [ngClass]=\"['sky-chevron-' + directionOrDefault]\"\n [skyThemeClass]=\"{\n 'sky-btn sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"chevronClick($event)\"\n (keydown)=\"chevronKeyDown($event)\"\n>\n <sky-expansion-indicator [direction]=\"directionOrDefault\" />\n</button>\n", styles: [".sky-chevron:not(.sky-theme-modern *){border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;padding:0;overflow:hidden;width:24px;cursor:pointer;position:relative;vertical-align:top}.sky-chevron:not(.sky-theme-modern *):hover .sky-chevron-part{border-color:#979ba2}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-
|
|
415
|
+
args: [{ selector: 'sky-chevron', hostDirectives: [SkyThemeComponentClassDirective], standalone: false, template: "<button\n class=\"sky-chevron\"\n type=\"button\"\n [attr.aria-controls]=\"ariaControls\"\n [attr.aria-expanded]=\"ariaExpanded\"\n [attr.aria-label]=\"ariaLabel\"\n [disabled]=\"disabled\"\n [ngClass]=\"['sky-chevron-' + directionOrDefault]\"\n [skyThemeClass]=\"{\n 'sky-btn sky-btn-icon-borderless': 'modern'\n }\"\n (click)=\"chevronClick($event)\"\n (keydown)=\"chevronKeyDown($event)\"\n>\n <sky-expansion-indicator [direction]=\"directionOrDefault\" />\n</button>\n", styles: [".sky-chevron:not(.sky-theme-modern *){border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;padding:0;overflow:hidden;width:24px;cursor:pointer;position:relative;vertical-align:top}.sky-chevron:not(.sky-theme-modern *):hover .sky-chevron-part{border-color:#979ba2}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-chevron{--sky-override-chevron-line-height: calc(20 / 14);--sky-override-chevron-size: 24px;padding:0}:host-context(.sky-theme-modern) .sky-chevron{border:none;background-color:transparent;flex-shrink:0;height:var(--sky-override-chevron-size, \"\");line-height:var(--sky-override-chevron-line-height, 1);margin:0;overflow:hidden;width:var(--sky-override-chevron-size, \"\");cursor:pointer;position:relative;vertical-align:top}\n"] }]
|
|
436
416
|
}], propDecorators: { ariaControls: [{
|
|
437
417
|
type: Input
|
|
438
418
|
}], ariaLabel: [{
|
|
@@ -681,10 +661,7 @@ class SkyLabelComponent {
|
|
|
681
661
|
this.#unsubscribe();
|
|
682
662
|
}
|
|
683
663
|
#updateIcon() {
|
|
684
|
-
|
|
685
|
-
this.icon = indicatorIcon.defaultThemeIcon;
|
|
686
|
-
this.baseIcon = indicatorIcon.modernThemeBaseIcon;
|
|
687
|
-
this.topIcon = indicatorIcon.modernThemeTopIcon;
|
|
664
|
+
this.iconName = SkyIndicatorIconUtility.getIconNameForType(this.labelTypeOrDefault);
|
|
688
665
|
}
|
|
689
666
|
#updateDescriptionComputed() {
|
|
690
667
|
this.#unsubscribe();
|
|
@@ -717,11 +694,11 @@ class SkyLabelComponent {
|
|
|
717
694
|
}
|
|
718
695
|
}
|
|
719
696
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
720
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyLabelComponent, isStandalone: false, selector: "sky-label", inputs: { labelType: "labelType", descriptionType: "descriptionType", customDescription: "customDescription" }, ngImport: i0, template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon
|
|
697
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyLabelComponent, isStandalone: false, selector: "sky-label", inputs: { labelType: "labelType", descriptionType: "descriptionType", customDescription: "customDescription" }, ngImport: i0, template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon\">\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </span>\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <span class=\"sky-label-text\">\n <ng-content />\n </span>\n</span>\n", styles: [".sky-label:not(.sky-theme-modern *){--sky-override-label-align-items: initial;--sky-override-label-border-radius-pill: 10rem;--sky-override-label-color-background-container-danger: var( --sky-background-color-danger );--sky-override-label-color-background-container-info: var( --sky-background-color-info );--sky-override-label-color-background-container-success: var( --sky-background-color-success );--sky-override-label-color-background-container-warning: var( --sky-background-color-warning );--sky-override-label-display: inline;--sky-override-label-icon-modern-display: none;--sky-override-label-inner-icon-path-color-danger: var( --sky-background-color-danger );--sky-override-label-inner-icon-path-color-info: var( --sky-background-color-info );--sky-override-label-inner-icon-path-color-success: var( --sky-background-color-success );--sky-override-label-inner-icon-path-color-warning: var( --sky-background-color-warning );--sky-override-label-line-height: 2.2;--sky-override-label-margin: 0 3px;--sky-override-label-padding: .3em .6em .3em .6em;--sky-override-label-text-padding-left: var(--sky-padding-half)}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label{--sky-override-sky-icon-svg-size-s: 21px;--sky-override-label-line-height: 1;--sky-override-label-margin: 0 3px;--sky-override-label-inner-icon-path-color-info: var(--modern-color-gray-105);--sky-override-label-inner-icon-path-color-success: var( --modern-color-gray-105 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-danger,:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-warning{--sky-override-label-padding-left: var(--modern-size-9)}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-info,:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-success{--sky-override-label-padding-left: var(--modern-size-6)}:host-context(.sky-theme-modern) .sky-label-info .sky-label-icon{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-label-success .sky-label-icon{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-label-warning .sky-label-icon{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-label-danger .sky-label-icon{color:var(--sky-color-icon-danger)}.sky-theme-modern .sky-label-info .sky-label-icon{color:var(--sky-color-icon-info)}.sky-theme-modern .sky-label-success .sky-label-icon{color:var(--sky-color-icon-success)}.sky-theme-modern .sky-label-warning .sky-label-icon{color:var(--sky-color-icon-warning)}.sky-theme-modern .sky-label-danger .sky-label-icon{color:var(--sky-color-icon-danger)}.sky-label{color:var(--sky-text-color-default);display:var(--sky-override-label-display, inline-block);align-items:var(--sky-override-label-align-items, center);border-radius:var(--sky-override-label-border-radius-pill, var(--sky-border-radius-pill));line-height:var(--sky-override-label-line-height, unset);margin:var(--sky-override-label-margin, unset);white-space:nowrap;padding:var(--sky-override-label-padding, var(--sky-space-inset-pillarbox-1_4-top-s) var(--sky-space-inset-pillarbox-1_4-right-s) var(--sky-space-inset-pillarbox-1_4-bottom-s) var(--sky-override-label-padding-left, var(--sky-space-inset-pillarbox-1_4-left-s)))}.sky-label-success{background-color:var(--sky-override-label-color-background-container-success, var(--sky-color-background-container-success));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-success, var(--sky-color-icon-inverse) )}.sky-label-info{background-color:var(--sky-override-label-color-background-container-info, var(--sky-color-background-container-info));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-info, var(--sky-color-icon-inverse) )}.sky-label-warning{background-color:var(--sky-override-label-color-background-container-warning, var(--sky-color-background-container-warning));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-warning, var(--sky-color-icon-default) )}.sky-label-danger{background-color:var(--sky-override-label-color-background-container-danger, var(--sky-color-background-container-danger));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-danger, var(--sky-color-icon-inverse) )}.sky-label-text{display:inline-block;padding-left:var(--sky-override-label-text-padding-left, var(--sky-space-gap-icon-s))}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }] }); }
|
|
721
698
|
}
|
|
722
699
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelComponent, decorators: [{
|
|
723
700
|
type: Component,
|
|
724
|
-
args: [{ selector: 'sky-label', standalone: false, template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon
|
|
701
|
+
args: [{ selector: 'sky-label', standalone: false, template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon\">\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </span>\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <span class=\"sky-label-text\">\n <ng-content />\n </span>\n</span>\n", styles: [".sky-label:not(.sky-theme-modern *){--sky-override-label-align-items: initial;--sky-override-label-border-radius-pill: 10rem;--sky-override-label-color-background-container-danger: var( --sky-background-color-danger );--sky-override-label-color-background-container-info: var( --sky-background-color-info );--sky-override-label-color-background-container-success: var( --sky-background-color-success );--sky-override-label-color-background-container-warning: var( --sky-background-color-warning );--sky-override-label-display: inline;--sky-override-label-icon-modern-display: none;--sky-override-label-inner-icon-path-color-danger: var( --sky-background-color-danger );--sky-override-label-inner-icon-path-color-info: var( --sky-background-color-info );--sky-override-label-inner-icon-path-color-success: var( --sky-background-color-success );--sky-override-label-inner-icon-path-color-warning: var( --sky-background-color-warning );--sky-override-label-line-height: 2.2;--sky-override-label-margin: 0 3px;--sky-override-label-padding: .3em .6em .3em .6em;--sky-override-label-text-padding-left: var(--sky-padding-half)}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label{--sky-override-sky-icon-svg-size-s: 21px;--sky-override-label-line-height: 1;--sky-override-label-margin: 0 3px;--sky-override-label-inner-icon-path-color-info: var(--modern-color-gray-105);--sky-override-label-inner-icon-path-color-success: var( --modern-color-gray-105 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-danger,:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-warning{--sky-override-label-padding-left: var(--modern-size-9)}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-info,:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-label.sky-label-success{--sky-override-label-padding-left: var(--modern-size-6)}:host-context(.sky-theme-modern) .sky-label-info .sky-label-icon{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-label-success .sky-label-icon{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-label-warning .sky-label-icon{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-label-danger .sky-label-icon{color:var(--sky-color-icon-danger)}.sky-theme-modern .sky-label-info .sky-label-icon{color:var(--sky-color-icon-info)}.sky-theme-modern .sky-label-success .sky-label-icon{color:var(--sky-color-icon-success)}.sky-theme-modern .sky-label-warning .sky-label-icon{color:var(--sky-color-icon-warning)}.sky-theme-modern .sky-label-danger .sky-label-icon{color:var(--sky-color-icon-danger)}.sky-label{color:var(--sky-text-color-default);display:var(--sky-override-label-display, inline-block);align-items:var(--sky-override-label-align-items, center);border-radius:var(--sky-override-label-border-radius-pill, var(--sky-border-radius-pill));line-height:var(--sky-override-label-line-height, unset);margin:var(--sky-override-label-margin, unset);white-space:nowrap;padding:var(--sky-override-label-padding, var(--sky-space-inset-pillarbox-1_4-top-s) var(--sky-space-inset-pillarbox-1_4-right-s) var(--sky-space-inset-pillarbox-1_4-bottom-s) var(--sky-override-label-padding-left, var(--sky-space-inset-pillarbox-1_4-left-s)))}.sky-label-success{background-color:var(--sky-override-label-color-background-container-success, var(--sky-color-background-container-success));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-success, var(--sky-color-icon-inverse) )}.sky-label-info{background-color:var(--sky-override-label-color-background-container-info, var(--sky-color-background-container-info));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-info, var(--sky-color-icon-inverse) )}.sky-label-warning{background-color:var(--sky-override-label-color-background-container-warning, var(--sky-color-background-container-warning));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-warning, var(--sky-color-icon-default) )}.sky-label-danger{background-color:var(--sky-override-label-color-background-container-danger, var(--sky-color-background-container-danger));--sky-icon-svg-path-2-color-input: var( --sky-override-label-inner-icon-path-color-danger, var(--sky-color-icon-inverse) )}.sky-label-text{display:inline-block;padding-left:var(--sky-override-label-text-padding-left, var(--sky-space-gap-icon-s))}\n"] }]
|
|
725
702
|
}], propDecorators: { labelType: [{
|
|
726
703
|
type: Input
|
|
727
704
|
}], descriptionType: [{
|
|
@@ -732,14 +709,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
732
709
|
|
|
733
710
|
class SkyLabelModule {
|
|
734
711
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
|
|
735
|
-
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelModule, declarations: [SkyLabelComponent], imports: [CommonModule,
|
|
736
|
-
|
|
712
|
+
static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelModule, declarations: [SkyLabelComponent], imports: [CommonModule,
|
|
713
|
+
SkyIconModule,
|
|
714
|
+
SkyIndicatorsResourcesModule,
|
|
715
|
+
SkyThemeModule], exports: [SkyLabelComponent] }); }
|
|
716
|
+
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelModule, imports: [CommonModule,
|
|
717
|
+
SkyIconModule,
|
|
718
|
+
SkyIndicatorsResourcesModule,
|
|
719
|
+
SkyThemeModule] }); }
|
|
737
720
|
}
|
|
738
721
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyLabelModule, decorators: [{
|
|
739
722
|
type: NgModule,
|
|
740
723
|
args: [{
|
|
741
724
|
declarations: [SkyLabelComponent],
|
|
742
|
-
imports: [
|
|
725
|
+
imports: [
|
|
726
|
+
CommonModule,
|
|
727
|
+
SkyIconModule,
|
|
728
|
+
SkyIndicatorsResourcesModule,
|
|
729
|
+
SkyThemeModule,
|
|
730
|
+
],
|
|
743
731
|
exports: [SkyLabelComponent],
|
|
744
732
|
}]
|
|
745
733
|
}] });
|
|
@@ -797,10 +785,7 @@ class SkyStatusIndicatorComponent {
|
|
|
797
785
|
this.#updateIcon();
|
|
798
786
|
}
|
|
799
787
|
#updateIcon() {
|
|
800
|
-
|
|
801
|
-
this.icon = indicatorIcon.defaultThemeIcon;
|
|
802
|
-
this.baseIcon = indicatorIcon.modernThemeBaseIcon;
|
|
803
|
-
this.topIcon = indicatorIcon.modernThemeTopIcon;
|
|
788
|
+
this.iconName = SkyIndicatorIconUtility.getIconNameForType(this.indicatorTypeOrDefault);
|
|
804
789
|
}
|
|
805
790
|
#updateDescriptionComputed() {
|
|
806
791
|
if (this.descriptionType) {
|
|
@@ -827,11 +812,11 @@ class SkyStatusIndicatorComponent {
|
|
|
827
812
|
}
|
|
828
813
|
}
|
|
829
814
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyStatusIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
830
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyStatusIndicatorComponent, isStandalone: false, selector: "sky-status-indicator", inputs: { indicatorType: "indicatorType", descriptionType: "descriptionType", customDescription: "customDescription", helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", helpKey: "helpKey" }, ngImport: i0, template: "@if (descriptionType) {\n <div class=\"sky-status-indicator\">\n <div\n aria-hidden=\"true\"\n class=\"sky-status-indicator-icon\"\n [ngClass]=\"'sky-status-indicator-icon-' + indicatorTypeOrDefault\"\n >\n <
|
|
815
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyStatusIndicatorComponent, isStandalone: false, selector: "sky-status-indicator", inputs: { indicatorType: "indicatorType", descriptionType: "descriptionType", customDescription: "customDescription", helpPopoverContent: "helpPopoverContent", helpPopoverTitle: "helpPopoverTitle", helpKey: "helpKey" }, ngImport: i0, template: "@if (descriptionType) {\n <div class=\"sky-status-indicator\">\n <div\n aria-hidden=\"true\"\n class=\"sky-status-indicator-icon\"\n [ngClass]=\"'sky-status-indicator-icon-' + indicatorTypeOrDefault\"\n >\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n <div class=\"sky-status-indicator-message-wrapper\">\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <span #message=\"skyId\" skyId class=\"sky-status-indicator-message\" skyTrim\n ><ng-content /></span\n ><span class=\"sky-control-help-container\">\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n [labelledBy]=\"message.id\"\n [helpKey]=\"helpKey\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n } @else {\n <ng-content select=\".sky-control-help\" />\n }\n </span>\n </div>\n </div>\n}\n", styles: [".sky-status-indicator:not(.sky-theme-modern *){--sky-override-status-indicator-icon-color-danger: #ef4044;--sky-override-status-indicator-icon-color-info: #00b4f1;--sky-override-status-indicator-icon-color-success: #72bf44;--sky-override-status-indicator-icon-color-warning: #fbb034;--sky-override-status-indicator-icon-padding-right: 5px;--sky-override-status-indicator-modern-default-display: none}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-status-indicator{--sky-override-status-indicator-info-success-exclamation-path-color: var( --modern-color-gray-105 )}.sky-status-indicator{align-items:baseline;display:flex}.sky-status-indicator-icon{flex-shrink:1;padding-right:var(--sky-override-status-indicator-icon-padding-right, var(--sky-space-gap-icon-s))}.sky-status-indicator-icon-info{color:var(--sky-override-status-indicator-icon-color-info, var(--sky-color-icon-info))}.sky-status-indicator-icon-success{color:var(--sky-override-status-indicator-icon-color-success, var(--sky-color-icon-success))}.sky-status-indicator-icon-warning{color:var(--sky-override-status-indicator-icon-color-warning, var(--sky-color-icon-warning))}.sky-status-indicator-icon-danger{color:var(--sky-override-status-indicator-icon-color-danger, var(--sky-color-icon-danger))}.sky-status-indicator-icon.sky-status-indicator-icon-warning,.sky-status-indicator-icon.sky-status-indicator-icon-success{--sky-icon-svg-path-2-color-input: var(--sky-color-icon-default)}.sky-status-indicator-icon.sky-status-indicator-icon-danger{--sky-icon-svg-path-2-color-input: var(--sky-color-icon-inverse)}.sky-status-indicator-icon.sky-status-indicator-icon-info,.sky-status-indicator-icon.sky-status-indicator-icon-success{--sky-icon-svg-path-2-color-input: var( --sky-override-status-indicator-info-success-exclamation-path-color, var(--sky-color-icon-inverse) )}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.λ1, selector: "sky-help-inline", inputs: ["ariaControls", "ariaExpanded", "ariaLabel", "helpKey", "labelledBy", "labelText", "popoverContent", "popoverTitle"], outputs: ["actionClick"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "directive", type: i3$1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i3$1.λ4, selector: "[skyTrim]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
831
816
|
}
|
|
832
817
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyStatusIndicatorComponent, decorators: [{
|
|
833
818
|
type: Component,
|
|
834
|
-
args: [{ selector: 'sky-status-indicator', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (descriptionType) {\n <div class=\"sky-status-indicator\">\n <div\n aria-hidden=\"true\"\n class=\"sky-status-indicator-icon\"\n [ngClass]=\"'sky-status-indicator-icon-' + indicatorTypeOrDefault\"\n >\n <
|
|
819
|
+
args: [{ selector: 'sky-status-indicator', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "@if (descriptionType) {\n <div class=\"sky-status-indicator\">\n <div\n aria-hidden=\"true\"\n class=\"sky-status-indicator-icon\"\n [ngClass]=\"'sky-status-indicator-icon-' + indicatorTypeOrDefault\"\n >\n <sky-icon variant=\"solid\" [iconName]=\"iconName\" />\n </div>\n <div class=\"sky-status-indicator-message-wrapper\">\n @if (descriptionComputed) {\n <span class=\"sky-screen-reader-only\">\n {{ descriptionComputed }}\n </span>\n }\n <span #message=\"skyId\" skyId class=\"sky-status-indicator-message\" skyTrim\n ><ng-content /></span\n ><span class=\"sky-control-help-container\">\n @if (helpPopoverContent || helpKey) {\n <sky-help-inline\n [labelledBy]=\"message.id\"\n [helpKey]=\"helpKey\"\n [popoverTitle]=\"helpPopoverTitle\"\n [popoverContent]=\"helpPopoverContent\"\n />\n } @else {\n <ng-content select=\".sky-control-help\" />\n }\n </span>\n </div>\n </div>\n}\n", styles: [".sky-status-indicator:not(.sky-theme-modern *){--sky-override-status-indicator-icon-color-danger: #ef4044;--sky-override-status-indicator-icon-color-info: #00b4f1;--sky-override-status-indicator-icon-color-success: #72bf44;--sky-override-status-indicator-icon-color-warning: #fbb034;--sky-override-status-indicator-icon-padding-right: 5px;--sky-override-status-indicator-modern-default-display: none}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-status-indicator{--sky-override-status-indicator-info-success-exclamation-path-color: var( --modern-color-gray-105 )}.sky-status-indicator{align-items:baseline;display:flex}.sky-status-indicator-icon{flex-shrink:1;padding-right:var(--sky-override-status-indicator-icon-padding-right, var(--sky-space-gap-icon-s))}.sky-status-indicator-icon-info{color:var(--sky-override-status-indicator-icon-color-info, var(--sky-color-icon-info))}.sky-status-indicator-icon-success{color:var(--sky-override-status-indicator-icon-color-success, var(--sky-color-icon-success))}.sky-status-indicator-icon-warning{color:var(--sky-override-status-indicator-icon-color-warning, var(--sky-color-icon-warning))}.sky-status-indicator-icon-danger{color:var(--sky-override-status-indicator-icon-color-danger, var(--sky-color-icon-danger))}.sky-status-indicator-icon.sky-status-indicator-icon-warning,.sky-status-indicator-icon.sky-status-indicator-icon-success{--sky-icon-svg-path-2-color-input: var(--sky-color-icon-default)}.sky-status-indicator-icon.sky-status-indicator-icon-danger{--sky-icon-svg-path-2-color-input: var(--sky-color-icon-inverse)}.sky-status-indicator-icon.sky-status-indicator-icon-info,.sky-status-indicator-icon.sky-status-indicator-icon-success{--sky-icon-svg-path-2-color-input: var( --sky-override-status-indicator-info-success-exclamation-path-color, var(--sky-color-icon-inverse) )}\n"] }]
|
|
835
820
|
}], propDecorators: { indicatorType: [{
|
|
836
821
|
type: Input
|
|
837
822
|
}], descriptionType: [{
|
|
@@ -853,12 +838,14 @@ class SkyStatusIndicatorModule {
|
|
|
853
838
|
SkyIconModule,
|
|
854
839
|
SkyIdModule,
|
|
855
840
|
SkyIndicatorsResourcesModule,
|
|
841
|
+
SkyThemeModule,
|
|
856
842
|
SkyTrimModule], exports: [SkyStatusIndicatorComponent] }); }
|
|
857
843
|
static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyStatusIndicatorModule, imports: [CommonModule,
|
|
858
844
|
SkyHelpInlineModule,
|
|
859
845
|
SkyIconModule,
|
|
860
846
|
SkyIdModule,
|
|
861
847
|
SkyIndicatorsResourcesModule,
|
|
848
|
+
SkyThemeModule,
|
|
862
849
|
SkyTrimModule] }); }
|
|
863
850
|
}
|
|
864
851
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyStatusIndicatorModule, decorators: [{
|
|
@@ -871,6 +858,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
871
858
|
SkyIconModule,
|
|
872
859
|
SkyIdModule,
|
|
873
860
|
SkyIndicatorsResourcesModule,
|
|
861
|
+
SkyThemeModule,
|
|
874
862
|
SkyTrimModule,
|
|
875
863
|
],
|
|
876
864
|
exports: [SkyStatusIndicatorComponent],
|
|
@@ -938,13 +926,17 @@ function createSearchRegex(searchTerms) {
|
|
|
938
926
|
}
|
|
939
927
|
return searchRegex;
|
|
940
928
|
}
|
|
941
|
-
// Need to add the following to classes which contain static methods.
|
|
942
|
-
// See: https://github.com/ng-packagr/ng-packagr/issues/641
|
|
943
|
-
// @dynamic
|
|
944
929
|
/**
|
|
945
930
|
* Highlights all matching text within the current DOM element.
|
|
946
931
|
*/
|
|
947
932
|
class SkyTextHighlightDirective {
|
|
933
|
+
constructor() {
|
|
934
|
+
this.highlight = true;
|
|
935
|
+
this.#existingHighlight = false;
|
|
936
|
+
this.#searchTerms = [];
|
|
937
|
+
this.#el = inject(ElementRef);
|
|
938
|
+
this.#observerSvc = inject(SkyMutationObserverService);
|
|
939
|
+
}
|
|
948
940
|
/**
|
|
949
941
|
* The text to highlight.
|
|
950
942
|
*/
|
|
@@ -962,11 +954,11 @@ class SkyTextHighlightDirective {
|
|
|
962
954
|
this.#searchTerms = [value];
|
|
963
955
|
}
|
|
964
956
|
}
|
|
965
|
-
#existingHighlight
|
|
957
|
+
#existingHighlight;
|
|
966
958
|
#observer;
|
|
967
|
-
#searchTerms
|
|
968
|
-
#el
|
|
969
|
-
#observerSvc
|
|
959
|
+
#searchTerms;
|
|
960
|
+
#el;
|
|
961
|
+
#observerSvc;
|
|
970
962
|
ngOnChanges(changes) {
|
|
971
963
|
if (changes['skyHighlight'] && !changes['skyHighlight'].firstChange) {
|
|
972
964
|
this.#highlight();
|
|
@@ -1014,7 +1006,7 @@ class SkyTextHighlightDirective {
|
|
|
1014
1006
|
}
|
|
1015
1007
|
}
|
|
1016
1008
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyTextHighlightDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive }); }
|
|
1017
|
-
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: SkyTextHighlightDirective, isStandalone: true, selector: "[skyHighlight]", inputs: { skyHighlight: "skyHighlight" }, usesOnChanges: true, ngImport: i0 }); }
|
|
1009
|
+
static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "19.2.1", type: SkyTextHighlightDirective, isStandalone: true, selector: "[skyHighlight]", inputs: { skyHighlight: "skyHighlight" }, host: { properties: { "attr.skyHighlight": "this.highlight" } }, usesOnChanges: true, ngImport: i0 }); }
|
|
1018
1010
|
}
|
|
1019
1011
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyTextHighlightDirective, decorators: [{
|
|
1020
1012
|
type: Directive,
|
|
@@ -1024,6 +1016,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
1024
1016
|
}]
|
|
1025
1017
|
}], propDecorators: { skyHighlight: [{
|
|
1026
1018
|
type: Input
|
|
1019
|
+
}], highlight: [{
|
|
1020
|
+
type: HostBinding,
|
|
1021
|
+
args: ['attr.skyHighlight']
|
|
1027
1022
|
}] } });
|
|
1028
1023
|
|
|
1029
1024
|
class SkyTextHighlightModule {
|
|
@@ -1127,11 +1122,11 @@ class SkyTokenComponent {
|
|
|
1127
1122
|
});
|
|
1128
1123
|
}
|
|
1129
1124
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyTokenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1130
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyTokenComponent, isStandalone: false, selector: "sky-token", inputs: { disabled: "disabled", ariaLabel: "ariaLabel", dismissible: "dismissible", focusable: "focusable", role: "role" }, outputs: { dismiss: "dismiss", tokenFocus: "tokenFocus" }, viewQueries: [{ propertyName: "actionButtonRef", first: true, predicate: ["actionButton"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div\n class=\"sky-token sky-btn sky-btn-default\"\n [attr.role]=\"role\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-disabled': disabled,\n 'sky-token-dismissible': dismissible,\n 'sky-token-active': tokenActive && !closeActive,\n 'sky-token-focused': isFocused\n }\"\n (document:mouseup)=\"setTokenActive(false)\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut($event)\"\n (mousedown)=\"setTokenActive(true)\"\n>\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n #actionButton=\"skyId\"\n class=\"sky-btn sky-btn-default sky-token-btn sky-token-btn-action\"\n type=\"button\"\n skyId\n [attr.tabindex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled\n }\"\n >\n <ng-content />\n </button>\n </span>\n @if (dismissible) {\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n class=\"sky-btn sky-token-btn sky-token-btn-close\"\n type=\"button\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"\n !ariaLabel\n ? screenReaderLabelDismiss.id + ' ' + actionButton.id\n : undefined\n \"\n [attr.tabindex]=\"tabIndex\"\n [attr.title]=\"\n ariaLabel || ('skyux_tokens_dismiss_button_title' | skyLibResources)\n \"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-btn-close-active': closeActive\n }\"\n (click)=\"dismissToken($event)\"\n (document:mouseup)=\"setCloseActive(false)\"\n (mousedown)=\"setCloseActive(true)\"\n >\n <sky-icon class=\"sky-token-btn-close-icon\" icon=\"close\" />\n </button>\n </span>\n }\n</div>\n<span\n #screenReaderLabelDismiss=\"skyId\"\n skyScreenReaderLabel\n skyId\n [createLabel]=\"dismissible && !ariaLabel\"\n>\n {{ 'skyux_tokens_dismiss_button_default_label' | skyLibResources }}\n</span>\n", styles: [".sky-token:not(.sky-theme-modern *){--sky-override-token-active-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-active-border: 1px solid #00b4f1;--sky-override-token-active-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-align-items: inherit;--sky-override-token-background-color: #c1e8fb;--sky-override-token-border: 1px solid #00b4f1;--sky-override-token-box-shadow: none;--sky-override-token-button-padding: 2px 8px;--sky-override-token-close-align-items: inherit;--sky-override-token-close-active-background-color: transparent;--sky-override-token-close-active-box-shadow: none;--sky-override-token-close-border-radius: 3px;--sky-override-token-close-button-opacity: .9;--sky-override-token-close-display: inline-block;--sky-override-token-close-focus-background-color: transparent --sky-override-token-close-focus-box-shadow: none;--sky-override-token-close-focus-outline: auto;--sky-override-token-close-hover-background-color: transparent;--sky-override-token-close-hover-box-shadow: none;--sky-override-token-close-icon-width: initial;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-margin-left: -2px;--sky-override-token-close-padding: 2px 8px;--sky-override-token-close-size: \"\";--sky-override-token-color-background-container-danger: var( --sky-background-color-danger );--sky-override-token-color-background-container-info: var( --sky-background-color-info );--sky-override-token-color-background-container-success: var( --sky-background-color-success );--sky-override-token-color-background-container-warning: var( --sky-background-color-warning );--sky-override-token-display: inline-block;--sky-override-token-disabled-background-color: #c1e8fb;--sky-override-token-dismissible-padding-right: 0;--sky-override-token-font-size: 15px;--sky-override-token-focused-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-focused-border: 1px solid #00b4f1;--sky-override-token-focused-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-hover-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-hover-border: 1px solid rgb(0, 141.9087136929, 190);--sky-override-token-hover-box-shadow: none;--sky-override-token-padding: 0}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-token{--sky-override-token-button-padding: var(--modern-size-1) var(--modern-size-5);--sky-override-token-close-button-opacity: .9;--sky-override-token-close-hover-box-shadow: inset 0 0 0 1px transparent;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-padding: 0;--sky-override-token-close-size: var(--modern-size-20);--sky-override-token-font-size: var(--modern-font-size-150);--sky-override-token-padding: 0}.sky-token{background-color:var(--sky-override-token-background-color, var(--sky-color-background-selected-soft));font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m));border:var(--sky-override-token-border, none);box-shadow:var(--sky-override-token-box-shadow, inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-selected_soft));padding:var(--sky-override-token-padding, var(--sky-space-inset-pillarbox-1_4-top-xs) var(--sky-space-inset-pillarbox-1_4-right-xs) var(--sky-space-inset-pillarbox-1_4-bottom-xs) var(--sky-space-inset-pillarbox-1_4-left-xs));align-items:var(--sky-override-token-align-items, center);display:var(--sky-override-token-display, inline-flex)}.sky-token.sky-token-focused:not(:active){background-color:var(--sky-override-token-focused-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-focused-border, none);box-shadow:var(--sky-override-token-focused-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus));cursor:pointer}.sky-token:hover{background-color:var(--sky-override-token-hover-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-hover-border, none);box-shadow:var(--sky-override-token-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover));cursor:pointer}.sky-token.sky-token-active{background-color:var(--sky-override-token-active-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-active-border, none);box-shadow:var(--sky-override-token-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active));cursor:pointer}.sky-token .sky-token-btn{background-color:transparent;border:0;box-shadow:none}.sky-token-btn{padding:var(--sky-override-token-button-padding, 0)}.sky-btn-disabled{background-color:var(--sky-override-token-disabled-background-color, var(--sky-color-background-action-tertiary-disabled));cursor:default;-webkit-user-select:none;user-select:none}.sky-btn-disabled .sky-btn-disabled{opacity:1}.sky-btn-disabled .sky-token-btn-action{color:var(--sky-color-text-deemphasized)}.sky-btn-disabled .sky-token-btn-close{color:var(--sky-color-icon-deemphasized)}.sky-token-btn-close{margin-left:var(--sky-override-token-close-margin-left, var(--sky-space-gap-text_action-xs));opacity:var(--sky-override-token-close-button-opacity, 1);padding:var(--sky-override-token-close-padding, var(--sky-space-inset-balanced-xxs));border-radius:var(--sky-override-token-close-border-radius, calc(var(--sky-border-radius-s) - var(--sky-border-width-selected-s)));align-items:var(--sky-override-token-close-align-items, center);display:var(--sky-override-token-close-display, flex);height:var(--sky-override-token-close-size, \"\");width:var(--sky-override-token-close-size, \"\");line-height:var(--sky-override-token-close-line-height, 1)}.sky-token-btn-close:hover,.sky-token-btn-close:focus-visible{opacity:1}.sky-token-btn-close:hover{background-color:var(--sky-override-token-close-hover-background-color, var(--sky-color-background-action-tertiary-hover));border:none;box-shadow:var(--sky-override-token-close-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover))}.sky-token-btn-close:focus-visible{outline:var(--sky-override-token-close-focus-outline, none)}.sky-token-btn-close:focus-visible:not(:active){background-color:var(--sky-override-token-close-focus-background-color, var(--sky-color-background-action-tertiary-focus));border:none;box-shadow:var(--sky-override-token-close-focus-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus))}.sky-token-btn-close.sky-token-btn-close-active{background-color:var(--sky-override-token-close-active-background-color, var(--sky-color-background-action-tertiary-active));border:none;box-shadow:var(--sky-override-token-close-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active))}.sky-token-dismissible{padding-right:var(--sky-override-token-dismissible-padding-right, var(--sky-border-width-selected-s))}.sky-token-dismissible .sky-token-btn-action{padding-right:0}.sky-token-btn-action{font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m))}.sky-token-btn-action:focus-visible{outline:none}.sky-token-btn-close-icon{width:var(--sky-override-token-close-icon-width, 100%)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i3$1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i3$1.SkyScreenReaderLabelDirective, selector: "[skyScreenReaderLabel]", inputs: ["createLabel"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1125
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.1", type: SkyTokenComponent, isStandalone: false, selector: "sky-token", inputs: { disabled: "disabled", ariaLabel: "ariaLabel", dismissible: "dismissible", focusable: "focusable", role: "role" }, outputs: { dismiss: "dismiss", tokenFocus: "tokenFocus" }, viewQueries: [{ propertyName: "actionButtonRef", first: true, predicate: ["actionButton"], descendants: true, read: ElementRef, static: true }], ngImport: i0, template: "<div\n class=\"sky-token sky-btn sky-btn-default\"\n [attr.role]=\"role\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-disabled': disabled,\n 'sky-token-dismissible': dismissible,\n 'sky-token-active': tokenActive && !closeActive,\n 'sky-token-focused': isFocused\n }\"\n (document:mouseup)=\"setTokenActive(false)\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut($event)\"\n (mousedown)=\"setTokenActive(true)\"\n>\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n #actionButton=\"skyId\"\n class=\"sky-btn sky-btn-default sky-token-btn sky-token-btn-action\"\n type=\"button\"\n skyId\n [attr.tabindex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled\n }\"\n >\n <ng-content />\n </button>\n </span>\n @if (dismissible) {\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n class=\"sky-btn sky-token-btn sky-token-btn-close\"\n type=\"button\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"\n !ariaLabel\n ? screenReaderLabelDismiss.id + ' ' + actionButton.id\n : undefined\n \"\n [attr.tabindex]=\"tabIndex\"\n [attr.title]=\"\n ariaLabel || ('skyux_tokens_dismiss_button_title' | skyLibResources)\n \"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-btn-close-active': closeActive\n }\"\n (click)=\"dismissToken($event)\"\n (document:mouseup)=\"setCloseActive(false)\"\n (mousedown)=\"setCloseActive(true)\"\n >\n <sky-icon\n class=\"sky-token-btn-close-icon\"\n iconName=\"close\"\n iconSize=\"s\"\n />\n </button>\n </span>\n }\n</div>\n<span\n #screenReaderLabelDismiss=\"skyId\"\n skyScreenReaderLabel\n skyId\n [createLabel]=\"dismissible && !ariaLabel\"\n>\n {{ 'skyux_tokens_dismiss_button_default_label' | skyLibResources }}\n</span>\n", styles: [".sky-token:not(.sky-theme-modern *){--sky-override-token-active-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-active-border: 1px solid #00b4f1;--sky-override-token-active-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-align-items: inherit;--sky-override-token-background-color: #c1e8fb;--sky-override-token-border: 1px solid #00b4f1;--sky-override-token-box-shadow: none;--sky-override-token-button-padding: 2px 8px;--sky-override-token-close-align-items: inherit;--sky-override-token-close-active-background-color: transparent;--sky-override-token-close-active-box-shadow: none;--sky-override-token-close-border-radius: 3px;--sky-override-token-close-button-opacity: .9;--sky-override-token-close-display: inline-block;--sky-override-token-close-focus-background-color: transparent --sky-override-token-close-focus-box-shadow: none;--sky-override-token-close-focus-outline: auto;--sky-override-token-close-hover-background-color: transparent;--sky-override-token-close-hover-box-shadow: none;--sky-override-token-close-icon-width: initial;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-margin-left: -2px;--sky-override-token-close-padding: 2px 8px;--sky-override-token-close-size: \"\";--sky-override-token-color-background-container-danger: var( --sky-background-color-danger );--sky-override-token-color-background-container-info: var( --sky-background-color-info );--sky-override-token-color-background-container-success: var( --sky-background-color-success );--sky-override-token-color-background-container-warning: var( --sky-background-color-warning );--sky-override-token-display: inline-block;--sky-override-token-disabled-background-color: #c1e8fb;--sky-override-token-dismissible-padding-right: 0;--sky-override-token-font-size: 15px;--sky-override-token-focused-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-focused-border: 1px solid #00b4f1;--sky-override-token-focused-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-hover-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-hover-border: 1px solid rgb(0, 141.9087136929, 190);--sky-override-token-hover-box-shadow: none;--sky-override-token-padding: 0}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-token{--sky-override-token-button-padding: var(--modern-size-1) var(--modern-size-5);--sky-override-token-close-button-opacity: .9;--sky-override-token-close-hover-box-shadow: inset 0 0 0 1px transparent;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-padding: 0;--sky-override-token-close-size: var(--modern-size-20);--sky-override-token-font-size: var(--modern-font-size-150);--sky-override-token-padding: 0}.sky-token{background-color:var(--sky-override-token-background-color, var(--sky-color-background-selected-soft));font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m));border:var(--sky-override-token-border, none);box-shadow:var(--sky-override-token-box-shadow, inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-selected_soft));padding:var(--sky-override-token-padding, var(--sky-space-inset-pillarbox-1_4-top-xs) var(--sky-space-inset-pillarbox-1_4-right-xs) var(--sky-space-inset-pillarbox-1_4-bottom-xs) var(--sky-space-inset-pillarbox-1_4-left-xs));align-items:var(--sky-override-token-align-items, center);display:var(--sky-override-token-display, inline-flex)}.sky-token.sky-token-focused:not(:active){background-color:var(--sky-override-token-focused-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-focused-border, none);box-shadow:var(--sky-override-token-focused-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus));cursor:pointer}.sky-token:hover{background-color:var(--sky-override-token-hover-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-hover-border, none);box-shadow:var(--sky-override-token-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover));cursor:pointer}.sky-token.sky-token-active{background-color:var(--sky-override-token-active-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-active-border, none);box-shadow:var(--sky-override-token-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active));cursor:pointer}.sky-token .sky-token-btn{background-color:transparent;border:0;box-shadow:none}.sky-token-btn{padding:var(--sky-override-token-button-padding, 0)}.sky-btn-disabled{background-color:var(--sky-override-token-disabled-background-color, var(--sky-color-background-action-tertiary-disabled));cursor:default;-webkit-user-select:none;user-select:none}.sky-btn-disabled .sky-btn-disabled{opacity:1}.sky-btn-disabled .sky-token-btn-action{color:var(--sky-color-text-deemphasized)}.sky-btn-disabled .sky-token-btn-close{color:var(--sky-color-icon-deemphasized)}.sky-token-btn-close{margin-left:var(--sky-override-token-close-margin-left, var(--sky-space-gap-text_action-xs));opacity:var(--sky-override-token-close-button-opacity, 1);padding:var(--sky-override-token-close-padding, var(--sky-space-inset-balanced-xxs));border-radius:var(--sky-override-token-close-border-radius, calc(var(--sky-border-radius-s) - var(--sky-border-width-selected-s)));align-items:var(--sky-override-token-close-align-items, center);display:var(--sky-override-token-close-display, flex);height:var(--sky-override-token-close-size, \"\");width:var(--sky-override-token-close-size, \"\");line-height:var(--sky-override-token-close-line-height, 1)}.sky-token-btn-close:hover,.sky-token-btn-close:focus-visible{opacity:1}.sky-token-btn-close:hover{background-color:var(--sky-override-token-close-hover-background-color, var(--sky-color-background-action-tertiary-hover));border:none;box-shadow:var(--sky-override-token-close-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover))}.sky-token-btn-close:focus-visible{outline:var(--sky-override-token-close-focus-outline, none)}.sky-token-btn-close:focus-visible:not(:active){background-color:var(--sky-override-token-close-focus-background-color, var(--sky-color-background-action-tertiary-focus));border:none;box-shadow:var(--sky-override-token-close-focus-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus))}.sky-token-btn-close.sky-token-btn-close-active{background-color:var(--sky-override-token-close-active-background-color, var(--sky-color-background-action-tertiary-active));border:none;box-shadow:var(--sky-override-token-close-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active))}.sky-token-dismissible{padding-right:var(--sky-override-token-dismissible-padding-right, var(--sky-border-width-selected-s))}.sky-token-dismissible .sky-token-btn-action{padding-right:0}.sky-token-btn-action{font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m))}.sky-token-btn-action:focus-visible{outline:none}.sky-token-btn-close-icon{width:var(--sky-override-token-close-icon-width, 100%)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant", "iconSize"] }, { kind: "directive", type: i3$1.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i3$1.SkyScreenReaderLabelDirective, selector: "[skyScreenReaderLabel]", inputs: ["createLabel"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
1131
1126
|
}
|
|
1132
1127
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImport: i0, type: SkyTokenComponent, decorators: [{
|
|
1133
1128
|
type: Component,
|
|
1134
|
-
args: [{ selector: 'sky-token', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\n class=\"sky-token sky-btn sky-btn-default\"\n [attr.role]=\"role\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-disabled': disabled,\n 'sky-token-dismissible': dismissible,\n 'sky-token-active': tokenActive && !closeActive,\n 'sky-token-focused': isFocused\n }\"\n (document:mouseup)=\"setTokenActive(false)\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut($event)\"\n (mousedown)=\"setTokenActive(true)\"\n>\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n #actionButton=\"skyId\"\n class=\"sky-btn sky-btn-default sky-token-btn sky-token-btn-action\"\n type=\"button\"\n skyId\n [attr.tabindex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled\n }\"\n >\n <ng-content />\n </button>\n </span>\n @if (dismissible) {\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n class=\"sky-btn sky-token-btn sky-token-btn-close\"\n type=\"button\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"\n !ariaLabel\n ? screenReaderLabelDismiss.id + ' ' + actionButton.id\n : undefined\n \"\n [attr.tabindex]=\"tabIndex\"\n [attr.title]=\"\n ariaLabel || ('skyux_tokens_dismiss_button_title' | skyLibResources)\n \"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-btn-close-active': closeActive\n }\"\n (click)=\"dismissToken($event)\"\n (document:mouseup)=\"setCloseActive(false)\"\n (mousedown)=\"setCloseActive(true)\"\n >\n <sky-icon
|
|
1129
|
+
args: [{ selector: 'sky-token', changeDetection: ChangeDetectionStrategy.OnPush, standalone: false, template: "<div\n class=\"sky-token sky-btn sky-btn-default\"\n [attr.role]=\"role\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-disabled': disabled,\n 'sky-token-dismissible': dismissible,\n 'sky-token-active': tokenActive && !closeActive,\n 'sky-token-focused': isFocused\n }\"\n (document:mouseup)=\"setTokenActive(false)\"\n (focusin)=\"onFocusIn()\"\n (focusout)=\"onFocusOut($event)\"\n (mousedown)=\"setTokenActive(true)\"\n>\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n #actionButton=\"skyId\"\n class=\"sky-btn sky-btn-default sky-token-btn sky-token-btn-action\"\n type=\"button\"\n skyId\n [attr.tabindex]=\"tabIndex\"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled\n }\"\n >\n <ng-content />\n </button>\n </span>\n @if (dismissible) {\n <span\n class=\"sky-token-cell\"\n [attr.role]=\"role === 'row' ? 'gridcell' : undefined\"\n >\n <button\n class=\"sky-btn sky-token-btn sky-token-btn-close\"\n type=\"button\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"\n !ariaLabel\n ? screenReaderLabelDismiss.id + ' ' + actionButton.id\n : undefined\n \"\n [attr.tabindex]=\"tabIndex\"\n [attr.title]=\"\n ariaLabel || ('skyux_tokens_dismiss_button_title' | skyLibResources)\n \"\n [disabled]=\"disabled\"\n [ngClass]=\"{\n 'sky-btn-disabled': disabled,\n 'sky-token-btn-close-active': closeActive\n }\"\n (click)=\"dismissToken($event)\"\n (document:mouseup)=\"setCloseActive(false)\"\n (mousedown)=\"setCloseActive(true)\"\n >\n <sky-icon\n class=\"sky-token-btn-close-icon\"\n iconName=\"close\"\n iconSize=\"s\"\n />\n </button>\n </span>\n }\n</div>\n<span\n #screenReaderLabelDismiss=\"skyId\"\n skyScreenReaderLabel\n skyId\n [createLabel]=\"dismissible && !ariaLabel\"\n>\n {{ 'skyux_tokens_dismiss_button_default_label' | skyLibResources }}\n</span>\n", styles: [".sky-token:not(.sky-theme-modern *){--sky-override-token-active-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-active-border: 1px solid #00b4f1;--sky-override-token-active-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-align-items: inherit;--sky-override-token-background-color: #c1e8fb;--sky-override-token-border: 1px solid #00b4f1;--sky-override-token-box-shadow: none;--sky-override-token-button-padding: 2px 8px;--sky-override-token-close-align-items: inherit;--sky-override-token-close-active-background-color: transparent;--sky-override-token-close-active-box-shadow: none;--sky-override-token-close-border-radius: 3px;--sky-override-token-close-button-opacity: .9;--sky-override-token-close-display: inline-block;--sky-override-token-close-focus-background-color: transparent --sky-override-token-close-focus-box-shadow: none;--sky-override-token-close-focus-outline: auto;--sky-override-token-close-hover-background-color: transparent;--sky-override-token-close-hover-box-shadow: none;--sky-override-token-close-icon-width: initial;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-margin-left: -2px;--sky-override-token-close-padding: 2px 8px;--sky-override-token-close-size: \"\";--sky-override-token-color-background-container-danger: var( --sky-background-color-danger );--sky-override-token-color-background-container-info: var( --sky-background-color-info );--sky-override-token-color-background-container-success: var( --sky-background-color-success );--sky-override-token-color-background-container-warning: var( --sky-background-color-warning );--sky-override-token-display: inline-block;--sky-override-token-disabled-background-color: #c1e8fb;--sky-override-token-dismissible-padding-right: 0;--sky-override-token-font-size: 15px;--sky-override-token-focused-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-focused-border: 1px solid #00b4f1;--sky-override-token-focused-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-hover-background-color: rgb(145.0909090909, 214.2272727273, 247.9090909091);--sky-override-token-hover-border: 1px solid rgb(0, 141.9087136929, 190);--sky-override-token-hover-box-shadow: none;--sky-override-token-padding: 0}:host-context(.sky-theme-modern:not(.sky-theme-brand-base)) .sky-token{--sky-override-token-button-padding: var(--modern-size-1) var(--modern-size-5);--sky-override-token-close-button-opacity: .9;--sky-override-token-close-hover-box-shadow: inset 0 0 0 1px transparent;--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-padding: 0;--sky-override-token-close-size: var(--modern-size-20);--sky-override-token-font-size: var(--modern-font-size-150);--sky-override-token-padding: 0}.sky-token{background-color:var(--sky-override-token-background-color, var(--sky-color-background-selected-soft));font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m));border:var(--sky-override-token-border, none);box-shadow:var(--sky-override-token-box-shadow, inset 0 0 0 var(--sky-border-width-action-base) var(--sky-color-border-selected_soft));padding:var(--sky-override-token-padding, var(--sky-space-inset-pillarbox-1_4-top-xs) var(--sky-space-inset-pillarbox-1_4-right-xs) var(--sky-space-inset-pillarbox-1_4-bottom-xs) var(--sky-space-inset-pillarbox-1_4-left-xs));align-items:var(--sky-override-token-align-items, center);display:var(--sky-override-token-display, inline-flex)}.sky-token.sky-token-focused:not(:active){background-color:var(--sky-override-token-focused-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-focused-border, none);box-shadow:var(--sky-override-token-focused-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus));cursor:pointer}.sky-token:hover{background-color:var(--sky-override-token-hover-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-hover-border, none);box-shadow:var(--sky-override-token-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover));cursor:pointer}.sky-token.sky-token-active{background-color:var(--sky-override-token-active-background-color, var(--sky-color-background-selected-soft));border:var(--sky-override-token-active-border, none);box-shadow:var(--sky-override-token-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active));cursor:pointer}.sky-token .sky-token-btn{background-color:transparent;border:0;box-shadow:none}.sky-token-btn{padding:var(--sky-override-token-button-padding, 0)}.sky-btn-disabled{background-color:var(--sky-override-token-disabled-background-color, var(--sky-color-background-action-tertiary-disabled));cursor:default;-webkit-user-select:none;user-select:none}.sky-btn-disabled .sky-btn-disabled{opacity:1}.sky-btn-disabled .sky-token-btn-action{color:var(--sky-color-text-deemphasized)}.sky-btn-disabled .sky-token-btn-close{color:var(--sky-color-icon-deemphasized)}.sky-token-btn-close{margin-left:var(--sky-override-token-close-margin-left, var(--sky-space-gap-text_action-xs));opacity:var(--sky-override-token-close-button-opacity, 1);padding:var(--sky-override-token-close-padding, var(--sky-space-inset-balanced-xxs));border-radius:var(--sky-override-token-close-border-radius, calc(var(--sky-border-radius-s) - var(--sky-border-width-selected-s)));align-items:var(--sky-override-token-close-align-items, center);display:var(--sky-override-token-close-display, flex);height:var(--sky-override-token-close-size, \"\");width:var(--sky-override-token-close-size, \"\");line-height:var(--sky-override-token-close-line-height, 1)}.sky-token-btn-close:hover,.sky-token-btn-close:focus-visible{opacity:1}.sky-token-btn-close:hover{background-color:var(--sky-override-token-close-hover-background-color, var(--sky-color-background-action-tertiary-hover));border:none;box-shadow:var(--sky-override-token-close-hover-box-shadow, inset 0 0 0 var(--sky-border-width-action-hover) var(--sky-color-border-action-tertiary-hover))}.sky-token-btn-close:focus-visible{outline:var(--sky-override-token-close-focus-outline, none)}.sky-token-btn-close:focus-visible:not(:active){background-color:var(--sky-override-token-close-focus-background-color, var(--sky-color-background-action-tertiary-focus));border:none;box-shadow:var(--sky-override-token-close-focus-box-shadow, inset 0 0 0 var(--sky-border-width-action-focus) var(--sky-color-border-action-tertiary-focus), var(--sky-elevation-focus))}.sky-token-btn-close.sky-token-btn-close-active{background-color:var(--sky-override-token-close-active-background-color, var(--sky-color-background-action-tertiary-active));border:none;box-shadow:var(--sky-override-token-close-active-box-shadow, inset 0 0 0 var(--sky-border-width-action-active) var(--sky-color-border-action-tertiary-active))}.sky-token-dismissible{padding-right:var(--sky-override-token-dismissible-padding-right, var(--sky-border-width-selected-s))}.sky-token-dismissible .sky-token-btn-action{padding-right:0}.sky-token-btn-action{font-size:var(--sky-override-token-font-size, var(--sky-font-size-body-m))}.sky-token-btn-action:focus-visible{outline:none}.sky-token-btn-close-icon{width:var(--sky-override-token-close-icon-width, 100%)}\n"] }]
|
|
1135
1130
|
}], propDecorators: { disabled: [{
|
|
1136
1131
|
type: Input
|
|
1137
1132
|
}], ariaLabel: [{
|
|
@@ -1527,11 +1522,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.1", ngImpor
|
|
|
1527
1522
|
|
|
1528
1523
|
var _a;
|
|
1529
1524
|
const busyElements = {};
|
|
1530
|
-
// Need to add the following to classes which contain static methods.
|
|
1531
|
-
// See: https://github.com/ng-packagr/ng-packagr/issues/641
|
|
1532
1525
|
/**
|
|
1533
1526
|
* @internal
|
|
1534
|
-
* @dynamic
|
|
1535
1527
|
*/
|
|
1536
1528
|
class SkyWaitAdapterService {
|
|
1537
1529
|
static { this.isPageWaitActive = false; }
|