@skyux/indicators 11.22.0 → 11.23.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/documentation.json +1219 -966
- package/esm2022/lib/modules/alert/alert.component.mjs +2 -2
- package/esm2022/lib/modules/chevron/chevron.component.mjs +2 -2
- package/esm2022/lib/modules/expansion-indicator/expansion-indicator.component.mjs +2 -2
- package/esm2022/lib/modules/label/label.component.mjs +2 -2
- package/esm2022/lib/modules/status-indicator/status-indicator.component.mjs +2 -2
- package/esm2022/lib/modules/tokens/token.component.mjs +2 -2
- package/esm2022/testing/legacy/alert-fixture.mjs +70 -0
- package/esm2022/testing/legacy/label-fixture.mjs +42 -0
- package/esm2022/testing/legacy/wait-fixture.mjs +28 -0
- package/esm2022/testing/modules/alert/alert-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/alert/alert-harness.mjs +112 -0
- package/esm2022/testing/modules/chevron/chevron-harness.mjs +38 -0
- package/esm2022/testing/modules/help-inline/help-inline-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/help-inline/help-inline-harness.mjs +25 -0
- package/esm2022/testing/modules/illustration/illustration-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/illustration/illustration-harness.mjs +54 -0
- package/esm2022/testing/modules/key-info/key-info-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/key-info/key-info-harness.mjs +43 -0
- package/esm2022/testing/modules/key-info/key-info-label-harness.mjs +18 -0
- package/esm2022/testing/modules/key-info/key-info-value-harness.mjs +18 -0
- package/esm2022/testing/modules/label/label-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/label/label-harness.mjs +88 -0
- package/esm2022/testing/modules/status-indicator/status-indicator-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/status-indicator/status-indicator-harness.mjs +119 -0
- package/esm2022/testing/modules/tokens/token-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/tokens/token-harness.mjs +63 -0
- package/esm2022/testing/modules/tokens/tokens-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/tokens/tokens-harness.mjs +45 -0
- package/esm2022/testing/modules/wait/wait-harness-filters.mjs +2 -0
- package/esm2022/testing/modules/wait/wait-harness.mjs +60 -0
- package/esm2022/testing/public-api.mjs +14 -14
- package/fesm2022/skyux-indicators-testing.mjs +37 -10
- package/fesm2022/skyux-indicators-testing.mjs.map +1 -1
- package/fesm2022/skyux-indicators.mjs +12 -12
- package/fesm2022/skyux-indicators.mjs.map +1 -1
- package/package.json +7 -7
- package/testing/{status-indicator → modules/status-indicator}/status-indicator-harness.d.ts +12 -0
- package/testing/public-api.d.ts +22 -22
- package/esm2022/testing/alert/alert-harness-filters.mjs +0 -2
- package/esm2022/testing/alert/alert-harness.mjs +0 -112
- package/esm2022/testing/alert-fixture.mjs +0 -70
- package/esm2022/testing/chevron/chevron-harness.mjs +0 -38
- package/esm2022/testing/help-inline/help-inline-harness-filters.mjs +0 -2
- package/esm2022/testing/help-inline/help-inline-harness.mjs +0 -25
- package/esm2022/testing/illustration/illustration-harness-filters.mjs +0 -2
- package/esm2022/testing/illustration/illustration-harness.mjs +0 -54
- package/esm2022/testing/key-info/key-info-harness-filters.mjs +0 -2
- package/esm2022/testing/key-info/key-info-harness.mjs +0 -43
- package/esm2022/testing/key-info/key-info-label-harness.mjs +0 -18
- package/esm2022/testing/key-info/key-info-value-harness.mjs +0 -18
- package/esm2022/testing/label/label-harness-filters.mjs +0 -2
- package/esm2022/testing/label/label-harness.mjs +0 -88
- package/esm2022/testing/label-fixture.mjs +0 -42
- package/esm2022/testing/status-indicator/status-indicator-harness-filters.mjs +0 -2
- package/esm2022/testing/status-indicator/status-indicator-harness.mjs +0 -92
- package/esm2022/testing/tokens/token-harness-filters.mjs +0 -2
- package/esm2022/testing/tokens/token-harness.mjs +0 -63
- package/esm2022/testing/tokens/tokens-harness-filters.mjs +0 -2
- package/esm2022/testing/tokens/tokens-harness.mjs +0 -45
- package/esm2022/testing/wait/wait-harness-filters.mjs +0 -2
- package/esm2022/testing/wait/wait-harness.mjs +0 -60
- package/esm2022/testing/wait-fixture.mjs +0 -28
- /package/testing/{alert-fixture.d.ts → legacy/alert-fixture.d.ts} +0 -0
- /package/testing/{label-fixture.d.ts → legacy/label-fixture.d.ts} +0 -0
- /package/testing/{wait-fixture.d.ts → legacy/wait-fixture.d.ts} +0 -0
- /package/testing/{alert → modules/alert}/alert-harness-filters.d.ts +0 -0
- /package/testing/{alert → modules/alert}/alert-harness.d.ts +0 -0
- /package/testing/{chevron → modules/chevron}/chevron-harness.d.ts +0 -0
- /package/testing/{help-inline → modules/help-inline}/help-inline-harness-filters.d.ts +0 -0
- /package/testing/{help-inline → modules/help-inline}/help-inline-harness.d.ts +0 -0
- /package/testing/{illustration → modules/illustration}/illustration-harness-filters.d.ts +0 -0
- /package/testing/{illustration → modules/illustration}/illustration-harness.d.ts +0 -0
- /package/testing/{key-info → modules/key-info}/key-info-harness-filters.d.ts +0 -0
- /package/testing/{key-info → modules/key-info}/key-info-harness.d.ts +0 -0
- /package/testing/{key-info → modules/key-info}/key-info-label-harness.d.ts +0 -0
- /package/testing/{key-info → modules/key-info}/key-info-value-harness.d.ts +0 -0
- /package/testing/{label → modules/label}/label-harness-filters.d.ts +0 -0
- /package/testing/{label → modules/label}/label-harness.d.ts +0 -0
- /package/testing/{status-indicator → modules/status-indicator}/status-indicator-harness-filters.d.ts +0 -0
- /package/testing/{tokens → modules/tokens}/token-harness-filters.d.ts +0 -0
- /package/testing/{tokens → modules/tokens}/token-harness.d.ts +0 -0
- /package/testing/{tokens → modules/tokens}/tokens-harness-filters.d.ts +0 -0
- /package/testing/{tokens → modules/tokens}/tokens-harness.d.ts +0 -0
- /package/testing/{wait → modules/wait}/wait-harness-filters.d.ts +0 -0
- /package/testing/{wait → modules/wait}/wait-harness.d.ts +0 -0
|
@@ -112,11 +112,11 @@ export class SkyAlertComponent {
|
|
|
112
112
|
}
|
|
113
113
|
}
|
|
114
114
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
115
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyAlertComponent, selector: "sky-alert", inputs: { alertType: "alertType", closeable: "closeable", closed: "closed", descriptionType: "descriptionType", customDescription: "customDescription" }, outputs: { closedChange: "closedChange" }, hostDirectives: [{ directive: i1.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-theme-modern\">\n <sky-icon-stack [baseIcon]=\"alertBaseIcon\" [topIcon]=\"alertTopIcon\" />\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 icon=\"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 *).sky-alert-info:before,.sky-alert:not(.sky-theme-modern *).sky-alert-success:before,.sky-alert:not(.sky-theme-modern *).sky-alert-warning:before,.sky-alert:not(.sky-theme-modern *).sky-alert-danger:before{font-family:FontAwesome;margin-left:-32px;margin-right:19px;color:#fff}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #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-info:before{content:\"\\f06a\";margin-left:-31px;margin-right:20px}.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-success:before{content:\"\\f00c\"}.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-warning:before{content:\"\\f071\"}.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-danger:before{content:\"\\f071\"}.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-theme-modern{display:none}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-alert{--sky-override-alert-padding: 0
|
|
115
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyAlertComponent, selector: "sky-alert", inputs: { alertType: "alertType", closeable: "closeable", closed: "closed", descriptionType: "descriptionType", customDescription: "customDescription" }, outputs: { closedChange: "closedChange" }, hostDirectives: [{ directive: i1.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-theme-modern\">\n <sky-icon-stack [baseIcon]=\"alertBaseIcon\" [topIcon]=\"alertTopIcon\" />\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 icon=\"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 *).sky-alert-info:before,.sky-alert:not(.sky-theme-modern *).sky-alert-success:before,.sky-alert:not(.sky-theme-modern *).sky-alert-warning:before,.sky-alert:not(.sky-theme-modern *).sky-alert-danger:before{font-family:FontAwesome;margin-left:-32px;margin-right:19px;color:#fff}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #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-info:before{content:\"\\f06a\";margin-left:-31px;margin-right:20px}.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-success:before{content:\"\\f00c\"}.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-warning:before{content:\"\\f071\"}.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-danger:before{content:\"\\f071\"}.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-theme-modern{display:none}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .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)}: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:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-success:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger:before{display:none}:host-context(.sky-theme-modern) .sky-alert:not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #212327}: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)}: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)}: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)}: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-icon-theme-modern{display:block}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info .sky-alert-icon-theme-modern{color:var(--sky-color-icon-info);--sky-icon-stack-top-icon-color-override: var( --sky-override-alert-inner-icon-color, var(--sky-color-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success .sky-alert-icon-theme-modern{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning .sky-alert-icon-theme-modern{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger .sky-alert-icon-theme-modern{color:var(--sky-color-icon-danger)}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i3.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i3.λ2, selector: "sky-icon-stack", inputs: ["size", "baseIcon", "topIcon"] }, { kind: "directive", type: i1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }] }); }
|
|
116
116
|
}
|
|
117
117
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyAlertComponent, decorators: [{
|
|
118
118
|
type: Component,
|
|
119
|
-
args: [{ selector: 'sky-alert', hostDirectives: [SkyThemeComponentClassDirective], 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-theme-modern\">\n <sky-icon-stack [baseIcon]=\"alertBaseIcon\" [topIcon]=\"alertTopIcon\" />\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 icon=\"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 *).sky-alert-info:before,.sky-alert:not(.sky-theme-modern *).sky-alert-success:before,.sky-alert:not(.sky-theme-modern *).sky-alert-warning:before,.sky-alert:not(.sky-theme-modern *).sky-alert-danger:before{font-family:FontAwesome;margin-left:-32px;margin-right:19px;color:#fff}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #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-info:before{content:\"\\f06a\";margin-left:-31px;margin-right:20px}.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-success:before{content:\"\\f00c\"}.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-warning:before{content:\"\\f071\"}.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-danger:before{content:\"\\f071\"}.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-theme-modern{display:none}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-alert{--sky-override-alert-padding: 0
|
|
119
|
+
args: [{ selector: 'sky-alert', hostDirectives: [SkyThemeComponentClassDirective], 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-theme-modern\">\n <sky-icon-stack [baseIcon]=\"alertBaseIcon\" [topIcon]=\"alertTopIcon\" />\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 icon=\"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 *).sky-alert-info:before,.sky-alert:not(.sky-theme-modern *).sky-alert-success:before,.sky-alert:not(.sky-theme-modern *).sky-alert-warning:before,.sky-alert:not(.sky-theme-modern *).sky-alert-danger:before{font-family:FontAwesome;margin-left:-32px;margin-right:19px;color:#fff}.sky-alert:not(.sky-theme-modern *):not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #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-info:before{content:\"\\f06a\";margin-left:-31px;margin-right:20px}.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-success:before{content:\"\\f00c\"}.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-warning:before{content:\"\\f071\"}.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-danger:before{content:\"\\f071\"}.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-theme-modern{display:none}\n", ":host-context(.sky-theme-modern) :host.sky-cmp-theme-modern{display:block}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .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)}: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:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-success:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning:before,:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger:before{display:none}:host-context(.sky-theme-modern) .sky-alert:not(.sky-alert-danger){--sky-icon-stack-top-icon-color-override: #212327}: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)}: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)}: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)}: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-icon-theme-modern{display:block}:host-context(.sky-theme-modern) .sky-alert.sky-alert-info .sky-alert-icon-theme-modern{color:var(--sky-color-icon-info);--sky-icon-stack-top-icon-color-override: var( --sky-override-alert-inner-icon-color, var(--sky-color-inverse) )}:host-context(.sky-theme-modern) .sky-alert.sky-alert-success .sky-alert-icon-theme-modern{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-warning .sky-alert-icon-theme-modern{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-alert.sky-alert-danger .sky-alert-icon-theme-modern{color:var(--sky-color-icon-danger)}\n"] }]
|
|
120
120
|
}], propDecorators: { alertType: [{
|
|
121
121
|
type: Input
|
|
122
122
|
}], closeable: [{
|
|
@@ -59,11 +59,11 @@ export class SkyChevronComponent {
|
|
|
59
59
|
}
|
|
60
60
|
}
|
|
61
61
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyChevronComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
62
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyChevronComponent, selector: "sky-chevron", inputs: { ariaControls: "ariaControls", ariaLabel: "ariaLabel", direction: "direction", disabled: "disabled" }, outputs: { directionChange: "directionChange" }, hostDirectives: [{ directive: i1.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-blackbaud)) .sky-chevron{--sky-override-chevron-
|
|
62
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyChevronComponent, selector: "sky-chevron", inputs: { ariaControls: "ariaControls", ariaLabel: "ariaLabel", direction: "direction", disabled: "disabled" }, outputs: { directionChange: "directionChange" }, hostDirectives: [{ directive: i1.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-blackbaud)) .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: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.λ2, selector: "[skyThemeClass]", inputs: ["class", "skyThemeClass"] }, { kind: "component", type: i3.SkyExpansionIndicatorComponent, selector: "sky-expansion-indicator", inputs: ["direction"] }] }); }
|
|
63
63
|
}
|
|
64
64
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyChevronComponent, decorators: [{
|
|
65
65
|
type: Component,
|
|
66
|
-
args: [{ selector: 'sky-chevron', hostDirectives: [SkyThemeComponentClassDirective], 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-blackbaud)) .sky-chevron{--sky-override-chevron-
|
|
66
|
+
args: [{ selector: 'sky-chevron', hostDirectives: [SkyThemeComponentClassDirective], 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-blackbaud)) .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"] }]
|
|
67
67
|
}], propDecorators: { ariaControls: [{
|
|
68
68
|
type: Input
|
|
69
69
|
}], ariaLabel: [{
|
|
@@ -20,11 +20,11 @@ export class SkyExpansionIndicatorComponent {
|
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyExpansionIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyExpansionIndicatorComponent, selector: "sky-expansion-indicator", inputs: { direction: "direction" }, ngImport: i0, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <ng-container *skyThemeIf=\"'default'\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </ng-container>\n <ng-container *skyThemeIf=\"'modern'\">\n <span class=\"sky-expansion-indicator-glyph-container\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </span>\n </ng-container>\n</div>\n\n<ng-template #icon>\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</ng-template>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;overflow:hidden;width:24px;position:relative;vertical-align:top}.sky-expansion-indicator-part:not(.sky-theme-modern *){border-color:#cdcfd2;border-style:solid;border-width:3px 0 0 0;display:inline-block;height:10px;position:absolute;top:10px;transition:transform .25s,left .25s;vertical-align:top;width:10px}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:7px;transform:rotate(-45deg)}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:7px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:2px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:12px;transform:rotate(-45deg)}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-expansion-indicator{--sky-override-expansion-indicator-
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SkyExpansionIndicatorComponent, selector: "sky-expansion-indicator", inputs: { direction: "direction" }, ngImport: i0, template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <ng-container *skyThemeIf=\"'default'\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </ng-container>\n <ng-container *skyThemeIf=\"'modern'\">\n <span class=\"sky-expansion-indicator-glyph-container\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </span>\n </ng-container>\n</div>\n\n<ng-template #icon>\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</ng-template>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;overflow:hidden;width:24px;position:relative;vertical-align:top}.sky-expansion-indicator-part:not(.sky-theme-modern *){border-color:#cdcfd2;border-style:solid;border-width:3px 0 0 0;display:inline-block;height:10px;position:absolute;top:10px;transition:transform .25s,left .25s;vertical-align:top;width:10px}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:7px;transform:rotate(-45deg)}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:7px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:2px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:12px;transform:rotate(-45deg)}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .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-size: 26px;--sky-override-expansion-indicator-size-half: 13px}:host-context(.sky-theme-modern) .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))}:host-context(.sky-theme-modern) .sky-expansion-indicator-part{background:var(--sky-color-icon-deemphasized);border:none;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}:host-context(.sky-theme-modern) .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)}:host-context(.sky-theme-modern) .sky-expansion-indicator-left{border-radius:1px 0 0 1px;left:var(--sky-override-expansion-indicator-leg-left-left, 2.75px)}:host-context(.sky-theme-modern) .sky-expansion-indicator-right{border-radius:0 1px 1px 0;left:var(--sky-override-expansion-indicator-leg-right-left, 9.25px)}:host-context(.sky-theme-modern) .sky-expansion-indicator-up .sky-expansion-indicator-left{transform:rotate(-45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-up .sky-expansion-indicator-right{transform:rotate(45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-down .sky-expansion-indicator-left{transform:rotate(45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-down .sky-expansion-indicator-right{transform:rotate(-45deg)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i2.λ3, selector: "[skyThemeIf]", inputs: ["skyThemeIf"] }] }); }
|
|
24
24
|
}
|
|
25
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyExpansionIndicatorComponent, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
|
-
args: [{ selector: 'sky-expansion-indicator', template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <ng-container *skyThemeIf=\"'default'\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </ng-container>\n <ng-container *skyThemeIf=\"'modern'\">\n <span class=\"sky-expansion-indicator-glyph-container\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </span>\n </ng-container>\n</div>\n\n<ng-template #icon>\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</ng-template>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;overflow:hidden;width:24px;position:relative;vertical-align:top}.sky-expansion-indicator-part:not(.sky-theme-modern *){border-color:#cdcfd2;border-style:solid;border-width:3px 0 0 0;display:inline-block;height:10px;position:absolute;top:10px;transition:transform .25s,left .25s;vertical-align:top;width:10px}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:7px;transform:rotate(-45deg)}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:7px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:2px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:12px;transform:rotate(-45deg)}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-expansion-indicator{--sky-override-expansion-indicator-
|
|
27
|
+
args: [{ selector: 'sky-expansion-indicator', template: "<div\n aria-hidden=\"true\"\n class=\"sky-expansion-indicator\"\n [ngClass]=\"['sky-expansion-indicator-' + directionOrDefault]\"\n>\n <ng-container *skyThemeIf=\"'default'\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </ng-container>\n <ng-container *skyThemeIf=\"'modern'\">\n <span class=\"sky-expansion-indicator-glyph-container\">\n <ng-container *ngTemplateOutlet=\"icon\" />\n </span>\n </ng-container>\n</div>\n\n<ng-template #icon>\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</ng-template>\n", styles: [".sky-expansion-indicator:not(.sky-theme-modern *){display:inline-block;border:none;background-color:transparent;flex-shrink:0;height:24px;margin:0;overflow:hidden;width:24px;position:relative;vertical-align:top}.sky-expansion-indicator-part:not(.sky-theme-modern *){border-color:#cdcfd2;border-style:solid;border-width:3px 0 0 0;display:inline-block;height:10px;position:absolute;top:10px;transition:transform .25s,left .25s;vertical-align:top;width:10px}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:7px;transform:rotate(-45deg)}.sky-expansion-indicator-up:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:7px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-left{left:2px;transform:rotate(45deg)}.sky-expansion-indicator-down:not(.sky-theme-modern *) .sky-expansion-indicator-right{left:12px;transform:rotate(-45deg)}\n", ":host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .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-size: 26px;--sky-override-expansion-indicator-size-half: 13px}:host-context(.sky-theme-modern) .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))}:host-context(.sky-theme-modern) .sky-expansion-indicator-part{background:var(--sky-color-icon-deemphasized);border:none;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}:host-context(.sky-theme-modern) .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)}:host-context(.sky-theme-modern) .sky-expansion-indicator-left{border-radius:1px 0 0 1px;left:var(--sky-override-expansion-indicator-leg-left-left, 2.75px)}:host-context(.sky-theme-modern) .sky-expansion-indicator-right{border-radius:0 1px 1px 0;left:var(--sky-override-expansion-indicator-leg-right-left, 9.25px)}:host-context(.sky-theme-modern) .sky-expansion-indicator-up .sky-expansion-indicator-left{transform:rotate(-45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-up .sky-expansion-indicator-right{transform:rotate(45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-down .sky-expansion-indicator-left{transform:rotate(45deg)}:host-context(.sky-theme-modern) .sky-expansion-indicator-down .sky-expansion-indicator-right{transform:rotate(-45deg)}\n"] }]
|
|
28
28
|
}], propDecorators: { direction: [{
|
|
29
29
|
type: Input
|
|
30
30
|
}] } });
|
|
@@ -102,11 +102,11 @@ export class SkyLabelComponent {
|
|
|
102
102
|
}
|
|
103
103
|
}
|
|
104
104
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
105
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyLabelComponent, 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-theme-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-label-icon-theme-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\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-
|
|
105
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyLabelComponent, 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-theme-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-label-icon-theme-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\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-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-blackbaud)) .sky-label{--sky-override-label-line-height: 1;--sky-override-label-margin: 0 3px}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-danger,:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-warning{--sky-override-label-padding-left: var(--modern-size-9)}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-info{--sky-override-label-info-exclamation-path-color: var( --modern-color-gray-105 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-info,:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-success{--sky-override-label-padding-left: var(--modern-size-6)}:host-context(.sky-theme-modern) .sky-label{--sky-override-label-icon-default-display: none}:host-context(.sky-theme-modern) .sky-label.sky-label-warning,:host-context(.sky-theme-modern) .sky-label.sky-label-success{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-default)}:host-context(.sky-theme-modern) .sky-label.sky-label-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}:host-context(.sky-theme-modern) .sky-label.sky-label-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-label-info-exclamation-path-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-label-info .sky-label-icon-theme-modern{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-label-success .sky-label-icon-theme-modern{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-label-warning .sky-label-icon-theme-modern{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-label-danger .sky-label-icon-theme-modern{color:var(--sky-color-icon-danger)}.sky-theme-modern .sky-label.sky-label-warning,.sky-theme-modern .sky-label.sky-label-success{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-default)}.sky-theme-modern .sky-label.sky-label-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}.sky-theme-modern .sky-label.sky-label-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-label-info-exclamation-path-color, var(--sky-color-icon-inverse) )}.sky-theme-modern .sky-label-info .sky-label-icon-theme-modern{color:var(--sky-color-icon-info)}.sky-theme-modern .sky-label-success .sky-label-icon-theme-modern{color:var(--sky-color-icon-success)}.sky-theme-modern .sky-label-warning .sky-label-icon-theme-modern{color:var(--sky-color-icon-warning)}.sky-theme-modern .sky-label-danger .sky-label-icon-theme-modern{color:var(--sky-color-icon-danger)}.sky-label{color:var(--sky-text-color-default);display:var(--sky-override-label-display, inline-flex);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-label-info{background-color:var(--sky-override-label-color-background-container-info, var(--sky-color-background-container-info))}.sky-label-warning{background-color:var(--sky-override-label-color-background-container-warning, var(--sky-color-background-container-warning))}.sky-label-danger{background-color:var(--sky-override-label-color-background-container-danger, var(--sky-color-background-container-danger))}.sky-label-text{display:inline-block;padding-left:var(--sky-override-label-text-padding-left, var(--sky-space-gap-icon-s))}.sky-label-icon-theme-modern{display:var(--sky-override-label-icon-modern-display, block)}.sky-label-icon-theme-default{display:var(--sky-override-label-icon-default-display, inline)}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: i2.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "component", type: i2.λ2, selector: "sky-icon-stack", inputs: ["size", "baseIcon", "topIcon"] }] }); }
|
|
106
106
|
}
|
|
107
107
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyLabelComponent, decorators: [{
|
|
108
108
|
type: Component,
|
|
109
|
-
args: [{ selector: 'sky-label', template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon-theme-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-label-icon-theme-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\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-
|
|
109
|
+
args: [{ selector: 'sky-label', template: "<span class=\"sky-label\" [ngClass]=\"'sky-label-' + labelTypeOrDefault\">\n <span class=\"sky-label-icon-theme-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-label-icon-theme-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\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-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-blackbaud)) .sky-label{--sky-override-label-line-height: 1;--sky-override-label-margin: 0 3px}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-danger,:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-warning{--sky-override-label-padding-left: var(--modern-size-9)}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-info{--sky-override-label-info-exclamation-path-color: var( --modern-color-gray-105 )}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-info,:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-label.sky-label-success{--sky-override-label-padding-left: var(--modern-size-6)}:host-context(.sky-theme-modern) .sky-label{--sky-override-label-icon-default-display: none}:host-context(.sky-theme-modern) .sky-label.sky-label-warning,:host-context(.sky-theme-modern) .sky-label.sky-label-success{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-default)}:host-context(.sky-theme-modern) .sky-label.sky-label-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}:host-context(.sky-theme-modern) .sky-label.sky-label-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-label-info-exclamation-path-color, var(--sky-color-icon-inverse) )}:host-context(.sky-theme-modern) .sky-label-info .sky-label-icon-theme-modern{color:var(--sky-color-icon-info)}:host-context(.sky-theme-modern) .sky-label-success .sky-label-icon-theme-modern{color:var(--sky-color-icon-success)}:host-context(.sky-theme-modern) .sky-label-warning .sky-label-icon-theme-modern{color:var(--sky-color-icon-warning)}:host-context(.sky-theme-modern) .sky-label-danger .sky-label-icon-theme-modern{color:var(--sky-color-icon-danger)}.sky-theme-modern .sky-label.sky-label-warning,.sky-theme-modern .sky-label.sky-label-success{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-default)}.sky-theme-modern .sky-label.sky-label-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}.sky-theme-modern .sky-label.sky-label-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-label-info-exclamation-path-color, var(--sky-color-icon-inverse) )}.sky-theme-modern .sky-label-info .sky-label-icon-theme-modern{color:var(--sky-color-icon-info)}.sky-theme-modern .sky-label-success .sky-label-icon-theme-modern{color:var(--sky-color-icon-success)}.sky-theme-modern .sky-label-warning .sky-label-icon-theme-modern{color:var(--sky-color-icon-warning)}.sky-theme-modern .sky-label-danger .sky-label-icon-theme-modern{color:var(--sky-color-icon-danger)}.sky-label{color:var(--sky-text-color-default);display:var(--sky-override-label-display, inline-flex);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-label-info{background-color:var(--sky-override-label-color-background-container-info, var(--sky-color-background-container-info))}.sky-label-warning{background-color:var(--sky-override-label-color-background-container-warning, var(--sky-color-background-container-warning))}.sky-label-danger{background-color:var(--sky-override-label-color-background-container-danger, var(--sky-color-background-container-danger))}.sky-label-text{display:inline-block;padding-left:var(--sky-override-label-text-padding-left, var(--sky-space-gap-icon-s))}.sky-label-icon-theme-modern{display:var(--sky-override-label-icon-modern-display, block)}.sky-label-icon-theme-default{display:var(--sky-override-label-icon-default-display, inline)}\n"] }]
|
|
110
110
|
}], propDecorators: { labelType: [{
|
|
111
111
|
type: Input
|
|
112
112
|
}], descriptionType: [{
|
|
@@ -89,11 +89,11 @@ export class SkyStatusIndicatorComponent {
|
|
|
89
89
|
}
|
|
90
90
|
}
|
|
91
91
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyStatusIndicatorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
92
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyStatusIndicatorComponent, 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 <span class=\"sky-status-indicator-icon-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-status-indicator-icon-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\n </span>\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-
|
|
92
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyStatusIndicatorComponent, 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 <span class=\"sky-status-indicator-icon-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-status-indicator-icon-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\n </span>\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) .sky-status-indicator{--sky-override-status-indicator-icon-default-display: none}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-status-indicator{--sky-override-status-indicator-info-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-default{display:var(--sky-override-status-indicator-icon-default-display)}.sky-status-indicator-icon-modern{display:var(--sky-override-status-indicator-modern-default-display, inline)}.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-stack-top-icon-color-override: var(--sky-color-icon-default)}.sky-status-indicator-icon.sky-status-indicator-icon-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}.sky-status-indicator-icon.sky-status-indicator-icon-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-status-indicator-info-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"] }, { kind: "component", type: i3.λ2, selector: "sky-icon-stack", inputs: ["size", "baseIcon", "topIcon"] }, { kind: "directive", type: i4.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i4.λ4, selector: "[skyTrim]" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
93
93
|
}
|
|
94
94
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyStatusIndicatorComponent, decorators: [{
|
|
95
95
|
type: Component,
|
|
96
|
-
args: [{ selector: 'sky-status-indicator', changeDetection: ChangeDetectionStrategy.OnPush, 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 <span class=\"sky-status-indicator-icon-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-status-indicator-icon-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\n </span>\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-
|
|
96
|
+
args: [{ selector: 'sky-status-indicator', changeDetection: ChangeDetectionStrategy.OnPush, 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 <span class=\"sky-status-indicator-icon-default\">\n <sky-icon [icon]=\"icon\" />\n </span>\n <span class=\"sky-status-indicator-icon-modern\">\n <sky-icon-stack size=\"xs\" [baseIcon]=\"baseIcon\" [topIcon]=\"topIcon\" />\n </span>\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) .sky-status-indicator{--sky-override-status-indicator-icon-default-display: none}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-status-indicator{--sky-override-status-indicator-info-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-default{display:var(--sky-override-status-indicator-icon-default-display)}.sky-status-indicator-icon-modern{display:var(--sky-override-status-indicator-modern-default-display, inline)}.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-stack-top-icon-color-override: var(--sky-color-icon-default)}.sky-status-indicator-icon.sky-status-indicator-icon-danger{--sky-icon-stack-top-icon-color-override: var(--sky-color-icon-inverse)}.sky-status-indicator-icon.sky-status-indicator-icon-info{--sky-icon-stack-top-icon-color-override: var( --sky-override-status-indicator-info-exclamation-path-color, var(--sky-color-icon-inverse) )}\n"] }]
|
|
97
97
|
}], propDecorators: { indicatorType: [{
|
|
98
98
|
type: Input
|
|
99
99
|
}], descriptionType: [{
|
|
@@ -94,11 +94,11 @@ export class SkyTokenComponent {
|
|
|
94
94
|
});
|
|
95
95
|
}
|
|
96
96
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyTokenComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
97
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyTokenComponent, 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-background-color: #c1e8fb;--sky-override-token-active-background-color: #91d6f8;--sky-override-token-focused-background-color: #91d6f8;--sky-override-token-hover-background-color: #91d6f8;--sky-override-token-font-size: 15px;--sky-override-token-padding: 0;--sky-override-token-close-margin-left: -2px;--sky-override-token-dismissible-padding-right: 0;--sky-override-token-align-items: inherit;--sky-override-token-display: inline-block;--sky-override-token-button-padding: 2px 8px;--sky-override-token-border: 1px solid #00b4f1;--sky-override-token-active-border: 1px solid #00b4f1;--sky-override-token-focused-border: 1px solid #00b4f1;--sky-override-token-hover-border: 1px solid #008ebe;--sky-override-token-box-shadow: none;--sky-override-token-active-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-hover-box-shadow: none;--sky-override-token-focused-box-shadow: 0 0 8px rgba(0, 180, 241, .6);--sky-override-token-close-icon-width: initial;--sky-override-token-disabled-background-color: #c1e8fb;--sky-override-token-close-padding: 2px 8px;--sky-override-token-close-border-radius: 3px;--sky-override-token-close-display: inline-block;--sky-override-token-close-align-items: inherit;--sky-override-token-close-size: \"\";--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-button-opacity: .9;--sky-override-token-close-active-background-color: transparent;--sky-override-token-close-active-box-shadow: none;--sky-override-token-close-hover-box-shadow: none;--sky-override-token-close-hover-background-color: transparent;--sky-override-token-close-focus-outline: auto;--sky-override-token-close-focus-background-color: transparent --sky-override-token-close-focus-box-shadow: none}:host-context(.sky-theme-modern:not(.sky-theme-brand-blackbaud)) .sky-token{--sky-override-token-font-size: var(--modern-font-size-150);--sky-override-token-padding: 0;--sky-override-token-button-padding: var(--modern-size-1) var(--modern-size-5);--sky-override-token-close-padding: 0;--sky-override-token-close-size: var(--modern-size-20);--sky-override-token-close-line-height: calc(20 / 14);--sky-override-token-close-button-opacity: .9;--sky-override-token-close-hover-box-shadow: inset 0 0 0 1px transparent}.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-action-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-action-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: i2.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i3.SkyScreenReaderLabelDirective, selector: "[skyScreenReaderLabel]", inputs: ["createLabel"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
97
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: SkyTokenComponent, 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: #91d6f8;--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: #91d6f8;--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: #91d6f8;--sky-override-token-hover-border: 1px solid #008ebe;--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: i2.λ1, selector: "sky-icon", inputs: ["icon", "iconName", "iconType", "size", "fixedWidth", "variant"] }, { kind: "directive", type: i3.λ2, selector: "[skyId]", exportAs: ["skyId"] }, { kind: "directive", type: i3.SkyScreenReaderLabelDirective, selector: "[skyScreenReaderLabel]", inputs: ["createLabel"] }, { kind: "pipe", type: i4.SkyLibResourcesPipe, name: "skyLibResources" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
98
98
|
}
|
|
99
99
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SkyTokenComponent, decorators: [{
|
|
100
100
|
type: Component,
|
|
101
|
-
args: [{ selector: 'sky-token', changeDetection: ChangeDetectionStrategy.OnPush, 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-background-color: #
|
|
101
|
+
args: [{ selector: 'sky-token', changeDetection: ChangeDetectionStrategy.OnPush, 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: #91d6f8;--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: #91d6f8;--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: #91d6f8;--sky-override-token-hover-border: 1px solid #008ebe;--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"] }]
|
|
102
102
|
}], propDecorators: { disabled: [{
|
|
103
103
|
type: Input
|
|
104
104
|
}], ariaLabel: [{
|
|
@@ -0,0 +1,70 @@
|
|
|
1
|
+
import { By } from '@angular/platform-browser';
|
|
2
|
+
import { SkyAppTestUtility } from '@skyux-sdk/testing';
|
|
3
|
+
/**
|
|
4
|
+
* Allows interaction with a SKY UX alert component.
|
|
5
|
+
* @deprecated Use `SkyAlertHarness` instead.
|
|
6
|
+
* @internal
|
|
7
|
+
*/
|
|
8
|
+
export class SkyAlertFixture {
|
|
9
|
+
/**
|
|
10
|
+
* The alert's current text.
|
|
11
|
+
*/
|
|
12
|
+
get text() {
|
|
13
|
+
return SkyAppTestUtility.getText(this.#debugEl);
|
|
14
|
+
}
|
|
15
|
+
/**
|
|
16
|
+
* A flag indicating whether the alert can be closed.
|
|
17
|
+
*/
|
|
18
|
+
get closeable() {
|
|
19
|
+
const closeBtnEl = this.#getCloseBtnEl();
|
|
20
|
+
return SkyAppTestUtility.isVisible(closeBtnEl);
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* Returns a flag indicating whether the alert is closed.
|
|
24
|
+
*/
|
|
25
|
+
get closed() {
|
|
26
|
+
return !SkyAppTestUtility.isVisible(this.#getAlertEl());
|
|
27
|
+
}
|
|
28
|
+
/**
|
|
29
|
+
* The alert's current type.
|
|
30
|
+
*/
|
|
31
|
+
get alertType() {
|
|
32
|
+
const clsList = this.#getAlertEl().nativeElement.classList;
|
|
33
|
+
if (clsList.contains('sky-alert-danger')) {
|
|
34
|
+
return 'danger';
|
|
35
|
+
}
|
|
36
|
+
if (clsList.contains('sky-alert-info')) {
|
|
37
|
+
return 'info';
|
|
38
|
+
}
|
|
39
|
+
if (clsList.contains('sky-alert-success')) {
|
|
40
|
+
return 'success';
|
|
41
|
+
}
|
|
42
|
+
if (clsList.contains('sky-alert-warning')) {
|
|
43
|
+
return 'warning';
|
|
44
|
+
}
|
|
45
|
+
return undefined;
|
|
46
|
+
}
|
|
47
|
+
#debugEl;
|
|
48
|
+
constructor(fixture, skyTestId) {
|
|
49
|
+
this.#debugEl = SkyAppTestUtility.getDebugElementByTestId(fixture, skyTestId, 'sky-alert');
|
|
50
|
+
}
|
|
51
|
+
/**
|
|
52
|
+
* Closes the alert. If the alert is not closeable, an error is thrown.
|
|
53
|
+
*/
|
|
54
|
+
close() {
|
|
55
|
+
if (this.closeable) {
|
|
56
|
+
const closeBtnEl = this.#getCloseBtnEl();
|
|
57
|
+
closeBtnEl.triggerEventHandler('click', {});
|
|
58
|
+
}
|
|
59
|
+
else {
|
|
60
|
+
throw new Error('The alert is not closeable.');
|
|
61
|
+
}
|
|
62
|
+
}
|
|
63
|
+
#getAlertEl() {
|
|
64
|
+
return this.#debugEl.query(By.css('.sky-alert'));
|
|
65
|
+
}
|
|
66
|
+
#getCloseBtnEl() {
|
|
67
|
+
return this.#debugEl.query(By.css('.sky-alert-close'));
|
|
68
|
+
}
|
|
69
|
+
}
|
|
70
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYWxlcnQtZml4dHVyZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9pbmRpY2F0b3JzL3Rlc3Rpbmcvc3JjL2xlZ2FjeS9hbGVydC1maXh0dXJlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUV2RDs7OztHQUlHO0FBQ0gsTUFBTSxPQUFPLGVBQWU7SUFDMUI7O09BRUc7SUFDSCxJQUFXLElBQUk7UUFDYixPQUFPLGlCQUFpQixDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxDQUFDLENBQUM7SUFDbEQsQ0FBQztJQUVEOztPQUVHO0lBQ0gsSUFBVyxTQUFTO1FBQ2xCLE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUV6QyxPQUFPLGlCQUFpQixDQUFDLFNBQVMsQ0FBQyxVQUFVLENBQUMsQ0FBQztJQUNqRCxDQUFDO0lBRUQ7O09BRUc7SUFDSCxJQUFXLE1BQU07UUFDZixPQUFPLENBQUMsaUJBQWlCLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxXQUFXLEVBQUUsQ0FBQyxDQUFDO0lBQzFELENBQUM7SUFFRDs7T0FFRztJQUNILElBQVcsU0FBUztRQUNsQixNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUMsYUFBYSxDQUFDLFNBQVMsQ0FBQztRQUUzRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsa0JBQWtCLENBQUMsRUFBRSxDQUFDO1lBQ3pDLE9BQU8sUUFBUSxDQUFDO1FBQ2xCLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsZ0JBQWdCLENBQUMsRUFBRSxDQUFDO1lBQ3ZDLE9BQU8sTUFBTSxDQUFDO1FBQ2hCLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsbUJBQW1CLENBQUMsRUFBRSxDQUFDO1lBQzFDLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsbUJBQW1CLENBQUMsRUFBRSxDQUFDO1lBQzFDLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxPQUFPLFNBQVMsQ0FBQztJQUNuQixDQUFDO0lBRUQsUUFBUSxDQUFlO0lBRXZCLFlBQVksT0FBa0MsRUFBRSxTQUFpQjtRQUMvRCxJQUFJLENBQUMsUUFBUSxHQUFHLGlCQUFpQixDQUFDLHVCQUF1QixDQUN2RCxPQUFPLEVBQ1AsU0FBUyxFQUNULFdBQVcsQ0FDWixDQUFDO0lBQ0osQ0FBQztJQUVEOztPQUVHO0lBQ0ksS0FBSztRQUNWLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRSxDQUFDO1lBQ25CLE1BQU0sVUFBVSxHQUFHLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztZQUV6QyxVQUFVLENBQUMsbUJBQW1CLENBQUMsT0FBTyxFQUFFLEVBQUUsQ0FBQyxDQUFDO1FBQzlDLENBQUM7YUFBTSxDQUFDO1lBQ04sTUFBTSxJQUFJLEtBQUssQ0FBQyw2QkFBNkIsQ0FBQyxDQUFDO1FBQ2pELENBQUM7SUFDSCxDQUFDO0lBRUQsV0FBVztRQUNULE9BQU8sSUFBSSxDQUFDLFFBQVEsQ0FBQyxLQUFLLENBQUMsRUFBRSxDQUFDLEdBQUcsQ0FBQyxZQUFZLENBQUMsQ0FBQyxDQUFDO0lBQ25ELENBQUM7SUFFRCxjQUFjO1FBQ1osT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxFQUFFLENBQUMsR0FBRyxDQUFDLGtCQUFrQixDQUFDLENBQUMsQ0FBQztJQUN6RCxDQUFDO0NBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBEZWJ1Z0VsZW1lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IENvbXBvbmVudEZpeHR1cmUgfSBmcm9tICdAYW5ndWxhci9jb3JlL3Rlc3RpbmcnO1xuaW1wb3J0IHsgQnkgfSBmcm9tICdAYW5ndWxhci9wbGF0Zm9ybS1icm93c2VyJztcbmltcG9ydCB7IFNreUFwcFRlc3RVdGlsaXR5IH0gZnJvbSAnQHNreXV4LXNkay90ZXN0aW5nJztcblxuLyoqXG4gKiBBbGxvd3MgaW50ZXJhY3Rpb24gd2l0aCBhIFNLWSBVWCBhbGVydCBjb21wb25lbnQuXG4gKiBAZGVwcmVjYXRlZCBVc2UgYFNreUFsZXJ0SGFybmVzc2AgaW5zdGVhZC5cbiAqIEBpbnRlcm5hbFxuICovXG5leHBvcnQgY2xhc3MgU2t5QWxlcnRGaXh0dXJlIHtcbiAgLyoqXG4gICAqIFRoZSBhbGVydCdzIGN1cnJlbnQgdGV4dC5cbiAgICovXG4gIHB1YmxpYyBnZXQgdGV4dCgpOiBzdHJpbmcgfCB1bmRlZmluZWQge1xuICAgIHJldHVybiBTa3lBcHBUZXN0VXRpbGl0eS5nZXRUZXh0KHRoaXMuI2RlYnVnRWwpO1xuICB9XG5cbiAgLyoqXG4gICAqIEEgZmxhZyBpbmRpY2F0aW5nIHdoZXRoZXIgdGhlIGFsZXJ0IGNhbiBiZSBjbG9zZWQuXG4gICAqL1xuICBwdWJsaWMgZ2V0IGNsb3NlYWJsZSgpOiBib29sZWFuIHwgdW5kZWZpbmVkIHtcbiAgICBjb25zdCBjbG9zZUJ0bkVsID0gdGhpcy4jZ2V0Q2xvc2VCdG5FbCgpO1xuXG4gICAgcmV0dXJuIFNreUFwcFRlc3RVdGlsaXR5LmlzVmlzaWJsZShjbG9zZUJ0bkVsKTtcbiAgfVxuXG4gIC8qKlxuICAgKiBSZXR1cm5zIGEgZmxhZyBpbmRpY2F0aW5nIHdoZXRoZXIgdGhlIGFsZXJ0IGlzIGNsb3NlZC5cbiAgICovXG4gIHB1YmxpYyBnZXQgY2xvc2VkKCk6IGJvb2xlYW4ge1xuICAgIHJldHVybiAhU2t5QXBwVGVzdFV0aWxpdHkuaXNWaXNpYmxlKHRoaXMuI2dldEFsZXJ0RWwoKSk7XG4gIH1cblxuICAvKipcbiAgICogVGhlIGFsZXJ0J3MgY3VycmVudCB0eXBlLlxuICAgKi9cbiAgcHVibGljIGdldCBhbGVydFR5cGUoKTogc3RyaW5nIHwgdW5kZWZpbmVkIHtcbiAgICBjb25zdCBjbHNMaXN0ID0gdGhpcy4jZ2V0QWxlcnRFbCgpLm5hdGl2ZUVsZW1lbnQuY2xhc3NMaXN0O1xuXG4gICAgaWYgKGNsc0xpc3QuY29udGFpbnMoJ3NreS1hbGVydC1kYW5nZXInKSkge1xuICAgICAgcmV0dXJuICdkYW5nZXInO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktYWxlcnQtaW5mbycpKSB7XG4gICAgICByZXR1cm4gJ2luZm8nO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktYWxlcnQtc3VjY2VzcycpKSB7XG4gICAgICByZXR1cm4gJ3N1Y2Nlc3MnO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktYWxlcnQtd2FybmluZycpKSB7XG4gICAgICByZXR1cm4gJ3dhcm5pbmcnO1xuICAgIH1cblxuICAgIHJldHVybiB1bmRlZmluZWQ7XG4gIH1cblxuICAjZGVidWdFbDogRGVidWdFbGVtZW50O1xuXG4gIGNvbnN0cnVjdG9yKGZpeHR1cmU6IENvbXBvbmVudEZpeHR1cmU8dW5rbm93bj4sIHNreVRlc3RJZDogc3RyaW5nKSB7XG4gICAgdGhpcy4jZGVidWdFbCA9IFNreUFwcFRlc3RVdGlsaXR5LmdldERlYnVnRWxlbWVudEJ5VGVzdElkKFxuICAgICAgZml4dHVyZSxcbiAgICAgIHNreVRlc3RJZCxcbiAgICAgICdza3ktYWxlcnQnLFxuICAgICk7XG4gIH1cblxuICAvKipcbiAgICogQ2xvc2VzIHRoZSBhbGVydC4gIElmIHRoZSBhbGVydCBpcyBub3QgY2xvc2VhYmxlLCBhbiBlcnJvciBpcyB0aHJvd24uXG4gICAqL1xuICBwdWJsaWMgY2xvc2UoKTogdm9pZCB7XG4gICAgaWYgKHRoaXMuY2xvc2VhYmxlKSB7XG4gICAgICBjb25zdCBjbG9zZUJ0bkVsID0gdGhpcy4jZ2V0Q2xvc2VCdG5FbCgpO1xuXG4gICAgICBjbG9zZUJ0bkVsLnRyaWdnZXJFdmVudEhhbmRsZXIoJ2NsaWNrJywge30pO1xuICAgIH0gZWxzZSB7XG4gICAgICB0aHJvdyBuZXcgRXJyb3IoJ1RoZSBhbGVydCBpcyBub3QgY2xvc2VhYmxlLicpO1xuICAgIH1cbiAgfVxuXG4gICNnZXRBbGVydEVsKCk6IERlYnVnRWxlbWVudCB7XG4gICAgcmV0dXJuIHRoaXMuI2RlYnVnRWwucXVlcnkoQnkuY3NzKCcuc2t5LWFsZXJ0JykpO1xuICB9XG5cbiAgI2dldENsb3NlQnRuRWwoKTogRGVidWdFbGVtZW50IHtcbiAgICByZXR1cm4gdGhpcy4jZGVidWdFbC5xdWVyeShCeS5jc3MoJy5za3ktYWxlcnQtY2xvc2UnKSk7XG4gIH1cbn1cbiJdfQ==
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
import { By } from '@angular/platform-browser';
|
|
2
|
+
import { SkyAppTestUtility } from '@skyux-sdk/testing';
|
|
3
|
+
/**
|
|
4
|
+
* Allows interaction with a SKY UX label component.
|
|
5
|
+
* @internal
|
|
6
|
+
*/
|
|
7
|
+
export class SkyLabelFixture {
|
|
8
|
+
/**
|
|
9
|
+
* The label's current type.
|
|
10
|
+
*/
|
|
11
|
+
get labelType() {
|
|
12
|
+
const clsList = this.#getLabelEl().nativeElement.classList;
|
|
13
|
+
if (clsList.contains('sky-label-danger')) {
|
|
14
|
+
return 'danger';
|
|
15
|
+
}
|
|
16
|
+
if (clsList.contains('sky-label-info')) {
|
|
17
|
+
return 'info';
|
|
18
|
+
}
|
|
19
|
+
if (clsList.contains('sky-label-success')) {
|
|
20
|
+
return 'success';
|
|
21
|
+
}
|
|
22
|
+
if (clsList.contains('sky-label-warning')) {
|
|
23
|
+
return 'warning';
|
|
24
|
+
}
|
|
25
|
+
return undefined;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* The label's current text.
|
|
29
|
+
*/
|
|
30
|
+
get text() {
|
|
31
|
+
const labelEl = this.#getLabelEl();
|
|
32
|
+
return SkyAppTestUtility.getText(labelEl);
|
|
33
|
+
}
|
|
34
|
+
#debugEl;
|
|
35
|
+
constructor(fixture, skyTestId) {
|
|
36
|
+
this.#debugEl = SkyAppTestUtility.getDebugElementByTestId(fixture, skyTestId, 'sky-label');
|
|
37
|
+
}
|
|
38
|
+
#getLabelEl() {
|
|
39
|
+
return this.#debugEl.query(By.css('.sky-label'));
|
|
40
|
+
}
|
|
41
|
+
}
|
|
42
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGFiZWwtZml4dHVyZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9pbmRpY2F0b3JzL3Rlc3Rpbmcvc3JjL2xlZ2FjeS9sYWJlbC1maXh0dXJlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUVBLE9BQU8sRUFBRSxFQUFFLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUV2RDs7O0dBR0c7QUFDSCxNQUFNLE9BQU8sZUFBZTtJQUMxQjs7T0FFRztJQUNILElBQVcsU0FBUztRQUNsQixNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUMsYUFBYSxDQUFDLFNBQVMsQ0FBQztRQUUzRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsa0JBQWtCLENBQUMsRUFBRSxDQUFDO1lBQ3pDLE9BQU8sUUFBUSxDQUFDO1FBQ2xCLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsZ0JBQWdCLENBQUMsRUFBRSxDQUFDO1lBQ3ZDLE9BQU8sTUFBTSxDQUFDO1FBQ2hCLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsbUJBQW1CLENBQUMsRUFBRSxDQUFDO1lBQzFDLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxJQUFJLE9BQU8sQ0FBQyxRQUFRLENBQUMsbUJBQW1CLENBQUMsRUFBRSxDQUFDO1lBQzFDLE9BQU8sU0FBUyxDQUFDO1FBQ25CLENBQUM7UUFFRCxPQUFPLFNBQVMsQ0FBQztJQUNuQixDQUFDO0lBRUQ7O09BRUc7SUFDSCxJQUFXLElBQUk7UUFDYixNQUFNLE9BQU8sR0FBRyxJQUFJLENBQUMsV0FBVyxFQUFFLENBQUM7UUFFbkMsT0FBTyxpQkFBaUIsQ0FBQyxPQUFPLENBQUMsT0FBTyxDQUFDLENBQUM7SUFDNUMsQ0FBQztJQUVELFFBQVEsQ0FBZTtJQUV2QixZQUFZLE9BQThCLEVBQUUsU0FBaUI7UUFDM0QsSUFBSSxDQUFDLFFBQVEsR0FBRyxpQkFBaUIsQ0FBQyx1QkFBdUIsQ0FDdkQsT0FBTyxFQUNQLFNBQVMsRUFDVCxXQUFXLENBQ1osQ0FBQztJQUNKLENBQUM7SUFFRCxXQUFXO1FBQ1QsT0FBTyxJQUFJLENBQUMsUUFBUSxDQUFDLEtBQUssQ0FBQyxFQUFFLENBQUMsR0FBRyxDQUFDLFlBQVksQ0FBQyxDQUFDLENBQUM7SUFDbkQsQ0FBQztDQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGVidWdFbGVtZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21wb25lbnRGaXh0dXJlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZS90ZXN0aW5nJztcbmltcG9ydCB7IEJ5IH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5pbXBvcnQgeyBTa3lBcHBUZXN0VXRpbGl0eSB9IGZyb20gJ0Bza3l1eC1zZGsvdGVzdGluZyc7XG5cbi8qKlxuICogQWxsb3dzIGludGVyYWN0aW9uIHdpdGggYSBTS1kgVVggbGFiZWwgY29tcG9uZW50LlxuICogQGludGVybmFsXG4gKi9cbmV4cG9ydCBjbGFzcyBTa3lMYWJlbEZpeHR1cmUge1xuICAvKipcbiAgICogVGhlIGxhYmVsJ3MgY3VycmVudCB0eXBlLlxuICAgKi9cbiAgcHVibGljIGdldCBsYWJlbFR5cGUoKTogc3RyaW5nIHwgdW5kZWZpbmVkIHtcbiAgICBjb25zdCBjbHNMaXN0ID0gdGhpcy4jZ2V0TGFiZWxFbCgpLm5hdGl2ZUVsZW1lbnQuY2xhc3NMaXN0O1xuXG4gICAgaWYgKGNsc0xpc3QuY29udGFpbnMoJ3NreS1sYWJlbC1kYW5nZXInKSkge1xuICAgICAgcmV0dXJuICdkYW5nZXInO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktbGFiZWwtaW5mbycpKSB7XG4gICAgICByZXR1cm4gJ2luZm8nO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktbGFiZWwtc3VjY2VzcycpKSB7XG4gICAgICByZXR1cm4gJ3N1Y2Nlc3MnO1xuICAgIH1cblxuICAgIGlmIChjbHNMaXN0LmNvbnRhaW5zKCdza3ktbGFiZWwtd2FybmluZycpKSB7XG4gICAgICByZXR1cm4gJ3dhcm5pbmcnO1xuICAgIH1cblxuICAgIHJldHVybiB1bmRlZmluZWQ7XG4gIH1cblxuICAvKipcbiAgICogVGhlIGxhYmVsJ3MgY3VycmVudCB0ZXh0LlxuICAgKi9cbiAgcHVibGljIGdldCB0ZXh0KCk6IHN0cmluZyB8IHVuZGVmaW5lZCB7XG4gICAgY29uc3QgbGFiZWxFbCA9IHRoaXMuI2dldExhYmVsRWwoKTtcblxuICAgIHJldHVybiBTa3lBcHBUZXN0VXRpbGl0eS5nZXRUZXh0KGxhYmVsRWwpO1xuICB9XG5cbiAgI2RlYnVnRWw6IERlYnVnRWxlbWVudDtcblxuICBjb25zdHJ1Y3RvcihmaXh0dXJlOiBDb21wb25lbnRGaXh0dXJlPGFueT4sIHNreVRlc3RJZDogc3RyaW5nKSB7XG4gICAgdGhpcy4jZGVidWdFbCA9IFNreUFwcFRlc3RVdGlsaXR5LmdldERlYnVnRWxlbWVudEJ5VGVzdElkKFxuICAgICAgZml4dHVyZSxcbiAgICAgIHNreVRlc3RJZCxcbiAgICAgICdza3ktbGFiZWwnLFxuICAgICk7XG4gIH1cblxuICAjZ2V0TGFiZWxFbCgpOiBEZWJ1Z0VsZW1lbnQge1xuICAgIHJldHVybiB0aGlzLiNkZWJ1Z0VsLnF1ZXJ5KEJ5LmNzcygnLnNreS1sYWJlbCcpKTtcbiAgfVxufVxuIl19
|
|
@@ -0,0 +1,28 @@
|
|
|
1
|
+
import { SkyAppTestUtility } from '@skyux-sdk/testing';
|
|
2
|
+
/**
|
|
3
|
+
* @internal
|
|
4
|
+
*/
|
|
5
|
+
export class SkyWaitFixture {
|
|
6
|
+
get isWaiting() {
|
|
7
|
+
return this.#innerWaitComponentContainsClass('.sky-wait-mask');
|
|
8
|
+
}
|
|
9
|
+
get isFullPage() {
|
|
10
|
+
return this.#innerWaitComponentContainsClass('.sky-wait-mask-loading-fixed');
|
|
11
|
+
}
|
|
12
|
+
get ariaLabel() {
|
|
13
|
+
const div = this.#debugEl.nativeElement.querySelector('.sky-wait-mask');
|
|
14
|
+
return div.getAttribute('aria-label');
|
|
15
|
+
}
|
|
16
|
+
get isNonBlocking() {
|
|
17
|
+
return this.#innerWaitComponentContainsClass('.sky-wait-mask-loading-non-blocking');
|
|
18
|
+
}
|
|
19
|
+
#debugEl;
|
|
20
|
+
constructor(fixture, skyTestId) {
|
|
21
|
+
this.#debugEl = SkyAppTestUtility.getDebugElementByTestId(fixture, skyTestId, 'sky-wait');
|
|
22
|
+
}
|
|
23
|
+
#innerWaitComponentContainsClass(className) {
|
|
24
|
+
const element = this.#debugEl.nativeElement.querySelector(className);
|
|
25
|
+
return element !== null;
|
|
26
|
+
}
|
|
27
|
+
}
|
|
28
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoid2FpdC1maXh0dXJlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL2luZGljYXRvcnMvdGVzdGluZy9zcmMvbGVnYWN5L3dhaXQtZml4dHVyZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFFQSxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSxvQkFBb0IsQ0FBQztBQUV2RDs7R0FFRztBQUNILE1BQU0sT0FBTyxjQUFjO0lBQ3pCLElBQVcsU0FBUztRQUNsQixPQUFPLElBQUksQ0FBQyxnQ0FBZ0MsQ0FBQyxnQkFBZ0IsQ0FBQyxDQUFDO0lBQ2pFLENBQUM7SUFFRCxJQUFXLFVBQVU7UUFDbkIsT0FBTyxJQUFJLENBQUMsZ0NBQWdDLENBQzFDLDhCQUE4QixDQUMvQixDQUFDO0lBQ0osQ0FBQztJQUVELElBQVcsU0FBUztRQUNsQixNQUFNLEdBQUcsR0FBRyxJQUFJLENBQUMsUUFBUSxDQUFDLGFBQWEsQ0FBQyxhQUFhLENBQUMsZ0JBQWdCLENBQUMsQ0FBQztRQUN4RSxPQUFPLEdBQUcsQ0FBQyxZQUFZLENBQUMsWUFBWSxDQUFDLENBQUM7SUFDeEMsQ0FBQztJQUVELElBQVcsYUFBYTtRQUN0QixPQUFPLElBQUksQ0FBQyxnQ0FBZ0MsQ0FDMUMscUNBQXFDLENBQ3RDLENBQUM7SUFDSixDQUFDO0lBRUQsUUFBUSxDQUFlO0lBRXZCLFlBQVksT0FBa0MsRUFBRSxTQUFpQjtRQUMvRCxJQUFJLENBQUMsUUFBUSxHQUFHLGlCQUFpQixDQUFDLHVCQUF1QixDQUN2RCxPQUFPLEVBQ1AsU0FBUyxFQUNULFVBQVUsQ0FDWCxDQUFDO0lBQ0osQ0FBQztJQUVELGdDQUFnQyxDQUFDLFNBQWlCO1FBQ2hELE1BQU0sT0FBTyxHQUNYLElBQUksQ0FBQyxRQUFRLENBQUMsYUFBYSxDQUFDLGFBQWEsQ0FBQyxTQUFTLENBQUMsQ0FBQztRQUN2RCxPQUFPLE9BQU8sS0FBSyxJQUFJLENBQUM7SUFDMUIsQ0FBQztDQUNGIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGVidWdFbGVtZW50IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBDb21wb25lbnRGaXh0dXJlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZS90ZXN0aW5nJztcbmltcG9ydCB7IFNreUFwcFRlc3RVdGlsaXR5IH0gZnJvbSAnQHNreXV4LXNkay90ZXN0aW5nJztcblxuLyoqXG4gKiBAaW50ZXJuYWxcbiAqL1xuZXhwb3J0IGNsYXNzIFNreVdhaXRGaXh0dXJlIHtcbiAgcHVibGljIGdldCBpc1dhaXRpbmcoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuI2lubmVyV2FpdENvbXBvbmVudENvbnRhaW5zQ2xhc3MoJy5za3ktd2FpdC1tYXNrJyk7XG4gIH1cblxuICBwdWJsaWMgZ2V0IGlzRnVsbFBhZ2UoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIHRoaXMuI2lubmVyV2FpdENvbXBvbmVudENvbnRhaW5zQ2xhc3MoXG4gICAgICAnLnNreS13YWl0LW1hc2stbG9hZGluZy1maXhlZCcsXG4gICAgKTtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgYXJpYUxhYmVsKCk6IHN0cmluZyB7XG4gICAgY29uc3QgZGl2ID0gdGhpcy4jZGVidWdFbC5uYXRpdmVFbGVtZW50LnF1ZXJ5U2VsZWN0b3IoJy5za3ktd2FpdC1tYXNrJyk7XG4gICAgcmV0dXJuIGRpdi5nZXRBdHRyaWJ1dGUoJ2FyaWEtbGFiZWwnKTtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgaXNOb25CbG9ja2luZygpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy4jaW5uZXJXYWl0Q29tcG9uZW50Q29udGFpbnNDbGFzcyhcbiAgICAgICcuc2t5LXdhaXQtbWFzay1sb2FkaW5nLW5vbi1ibG9ja2luZycsXG4gICAgKTtcbiAgfVxuXG4gICNkZWJ1Z0VsOiBEZWJ1Z0VsZW1lbnQ7XG5cbiAgY29uc3RydWN0b3IoZml4dHVyZTogQ29tcG9uZW50Rml4dHVyZTx1bmtub3duPiwgc2t5VGVzdElkOiBzdHJpbmcpIHtcbiAgICB0aGlzLiNkZWJ1Z0VsID0gU2t5QXBwVGVzdFV0aWxpdHkuZ2V0RGVidWdFbGVtZW50QnlUZXN0SWQoXG4gICAgICBmaXh0dXJlLFxuICAgICAgc2t5VGVzdElkLFxuICAgICAgJ3NreS13YWl0JyxcbiAgICApO1xuICB9XG5cbiAgI2lubmVyV2FpdENvbXBvbmVudENvbnRhaW5zQ2xhc3MoY2xhc3NOYW1lOiBzdHJpbmcpOiBib29sZWFuIHtcbiAgICBjb25zdCBlbGVtZW50OiBIVE1MRGl2RWxlbWVudCA9XG4gICAgICB0aGlzLiNkZWJ1Z0VsLm5hdGl2ZUVsZW1lbnQucXVlcnlTZWxlY3RvcihjbGFzc05hbWUpO1xuICAgIHJldHVybiBlbGVtZW50ICE9PSBudWxsO1xuICB9XG59XG4iXX0=
|