@danske/sapphire-angular 3.4.0 → 3.6.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/esm2020/lib/button/src/button-group.component.mjs +1 -1
- package/esm2020/lib/checkbox/src/checkbox.component.mjs +11 -6
- package/esm2020/lib/icon/src/icon.component.mjs +1 -1
- package/esm2020/lib/label/src/label.component.mjs +3 -3
- package/esm2020/lib/list/public_api.mjs +2 -1
- package/esm2020/lib/list/src/list-item-text-label.component.mjs +22 -0
- package/esm2020/lib/list/src/list.component.mjs +2 -2
- package/esm2020/lib/list/src/list.module.mjs +7 -1
- package/esm2020/lib/listbox/i18n/da-DK.json +3 -0
- package/esm2020/lib/listbox/i18n/de-DE.json +3 -0
- package/esm2020/lib/listbox/i18n/en-US.json +3 -0
- package/esm2020/lib/listbox/i18n/fi-FI.json +3 -0
- package/esm2020/lib/listbox/i18n/index.mjs +19 -0
- package/esm2020/lib/listbox/i18n/nb-NO.json +3 -0
- package/esm2020/lib/listbox/i18n/pl-PL.json +3 -0
- package/esm2020/lib/listbox/i18n/sv-SE.json +3 -0
- package/esm2020/lib/listbox/src/listbox.component.mjs +34 -11
- package/esm2020/lib/menu/src/menu.component.mjs +2 -2
- package/esm2020/lib/modal/public_api.mjs +3 -1
- package/esm2020/lib/modal/src/layout/modal-header-extra.directive.mjs +24 -0
- package/esm2020/lib/modal/src/layout/modal-header-progress.directive.mjs +24 -0
- package/esm2020/lib/modal/src/layout/modal-header.component.mjs +3 -3
- package/esm2020/lib/modal/src/layout/modal-layout.component.mjs +2 -2
- package/esm2020/lib/modal/src/modal.module.mjs +11 -1
- package/esm2020/lib/modal/src/panel/panel.component.mjs +2 -2
- package/esm2020/lib/radio/src/radio.component.mjs +8 -4
- package/esm2020/lib/radio/src/shared/radio-base.mjs +4 -2
- package/esm2020/lib/select/src/common/select-component-base.mjs +4 -2
- package/esm2020/lib/select/src/select/select.component.mjs +3 -3
- package/esm2020/lib/select/src/select-button/select-button.component.mjs +1 -1
- package/esm2020/lib/switch/src/switch.component.mjs +10 -4
- package/esm2020/lib/table/src/table.component.mjs +2 -2
- package/esm2020/lib/text-field/src/text-field.component.mjs +2 -2
- package/fesm2015/danske-sapphire-angular.mjs +208 -58
- package/fesm2015/danske-sapphire-angular.mjs.map +1 -1
- package/fesm2020/danske-sapphire-angular.mjs +206 -58
- package/fesm2020/danske-sapphire-angular.mjs.map +1 -1
- package/lib/checkbox/src/checkbox.component.d.ts +4 -1
- package/lib/list/public_api.d.ts +1 -0
- package/lib/list/src/list-item-text-label.component.d.ts +6 -0
- package/lib/list/src/list.module.d.ts +4 -3
- package/lib/listbox/i18n/index.d.ts +3 -0
- package/lib/listbox/src/listbox.component.d.ts +15 -3
- package/lib/modal/public_api.d.ts +2 -0
- package/lib/modal/src/layout/modal-header-extra.directive.d.ts +10 -0
- package/lib/modal/src/layout/modal-header-progress.directive.d.ts +10 -0
- package/lib/modal/src/layout/modal-header.component.d.ts +1 -1
- package/lib/modal/src/modal.module.d.ts +4 -2
- package/lib/radio/src/radio.component.d.ts +2 -1
- package/lib/radio/src/shared/radio-base.d.ts +3 -1
- package/lib/select/src/common/select-component-base.d.ts +7 -1
- package/lib/switch/src/switch.component.d.ts +4 -1
- package/package.json +3 -3
|
@@ -19,7 +19,7 @@ import { iconCheckmarkOutline, iconWarning, iconError, iconCheckmark, iconChevro
|
|
|
19
19
|
import * as i1$1 from '@angular/cdk/menu';
|
|
20
20
|
import { CdkMenu, CdkMenuItem, CdkMenuTrigger, CdkMenuGroup, CdkMenuModule } from '@angular/cdk/menu';
|
|
21
21
|
import { hasModifierKey } from '@angular/cdk/keycodes';
|
|
22
|
-
import { Subject, merge, combineLatest, empty, fromEvent } from 'rxjs';
|
|
22
|
+
import { Subject, merge, combineLatest, empty as empty$7, fromEvent } from 'rxjs';
|
|
23
23
|
import { takeUntil, startWith, map } from 'rxjs/operators';
|
|
24
24
|
import * as i1$3 from '@angular/cdk/listbox';
|
|
25
25
|
import { CdkListbox, CdkOption, CdkListboxModule } from '@angular/cdk/listbox';
|
|
@@ -1127,48 +1127,48 @@ const AutoId = ({ prefix = 'generated' } = {}) => {
|
|
|
1127
1127
|
};
|
|
1128
1128
|
|
|
1129
1129
|
var optional$6 = "Valgfrit";
|
|
1130
|
-
var da$
|
|
1130
|
+
var da$3 = {
|
|
1131
1131
|
optional: optional$6
|
|
1132
1132
|
};
|
|
1133
1133
|
|
|
1134
1134
|
var optional$5 = "Optional";
|
|
1135
|
-
var en$
|
|
1135
|
+
var en$3 = {
|
|
1136
1136
|
optional: optional$5
|
|
1137
1137
|
};
|
|
1138
1138
|
|
|
1139
1139
|
var optional$4 = "Optional";
|
|
1140
|
-
var de$
|
|
1140
|
+
var de$3 = {
|
|
1141
1141
|
optional: optional$4
|
|
1142
1142
|
};
|
|
1143
1143
|
|
|
1144
1144
|
var optional$3 = "Valinnainen";
|
|
1145
|
-
var fi$
|
|
1145
|
+
var fi$3 = {
|
|
1146
1146
|
optional: optional$3
|
|
1147
1147
|
};
|
|
1148
1148
|
|
|
1149
1149
|
var optional$2 = "Valgfritt";
|
|
1150
|
-
var no$
|
|
1150
|
+
var no$3 = {
|
|
1151
1151
|
optional: optional$2
|
|
1152
1152
|
};
|
|
1153
1153
|
|
|
1154
1154
|
var optional$1 = "Opcjonalny";
|
|
1155
|
-
var pl$
|
|
1155
|
+
var pl$3 = {
|
|
1156
1156
|
optional: optional$1
|
|
1157
1157
|
};
|
|
1158
1158
|
|
|
1159
1159
|
var optional = "Valfritt";
|
|
1160
|
-
var se$
|
|
1160
|
+
var se$3 = {
|
|
1161
1161
|
optional: optional
|
|
1162
1162
|
};
|
|
1163
1163
|
|
|
1164
|
-
const translations$
|
|
1165
|
-
'da-DK': da$
|
|
1166
|
-
'en-US': en$
|
|
1167
|
-
'de-DE': de$
|
|
1168
|
-
'fi-FI': fi$
|
|
1169
|
-
'nb-NO': no$
|
|
1170
|
-
'pl-PL': pl$
|
|
1171
|
-
'sv-SE': se$
|
|
1164
|
+
const translations$3 = new MessageDictionary({
|
|
1165
|
+
'da-DK': da$3,
|
|
1166
|
+
'en-US': en$3,
|
|
1167
|
+
'de-DE': de$3,
|
|
1168
|
+
'fi-FI': fi$3,
|
|
1169
|
+
'nb-NO': no$3,
|
|
1170
|
+
'pl-PL': pl$3,
|
|
1171
|
+
'sv-SE': se$3,
|
|
1172
1172
|
}, 'en-US');
|
|
1173
1173
|
|
|
1174
1174
|
/**
|
|
@@ -1343,7 +1343,7 @@ class LabelComponent {
|
|
|
1343
1343
|
}
|
|
1344
1344
|
}
|
|
1345
1345
|
LabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: LabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1346
|
-
LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: LabelComponent, isStandalone: true, selector: "sp-label", inputs: { id: "id", for: "for", disabled: "disabled", necessityIndicator: "necessityIndicator", size: "size" }, outputs: { labelClick: "labelClick" }, providers: [{ provide: MessageDictionary, useValue: translations$
|
|
1346
|
+
LabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: LabelComponent, isStandalone: true, selector: "sp-label", inputs: { id: "id", for: "for", disabled: "disabled", necessityIndicator: "necessityIndicator", size: "size" }, outputs: { labelClick: "labelClick" }, providers: [{ provide: MessageDictionary, useValue: translations$3 }], viewQueries: [{ propertyName: "labelElementRef", first: true, predicate: ["label"], descendants: true, read: ElementRef }], ngImport: i0, template: "<div class=\"sapphire-label\" [class.sapphire-label--md]=\"size === 'md'\">\n <label\n class=\"sapphire-label__text\"\n (click)=\"!disabled && labelClick.emit($event)\"\n [attr.for]=\"for\"\n [attr.id]=\"id\"\n #label\n ><ng-content></ng-content\n ></label>\n\n <span\n *ngIf=\"necessityIndicator === 'required'\"\n class=\"sapphire-label__required-indicator\"\n ></span>\n <span\n *ngIf=\"necessityIndicator === 'optional'\"\n class=\"sapphire-label__optional-indicator\"\n >({{ 'optional' | t }})</span\n >\n\n <span class=\"sapphire-label__help-button\">\n <ng-content select=\"sp-help-button\"></ng-content>\n </span>\n</div>\n", styles: [".sapphire-label{min-height:var(--sapphire-semantic-size-height-control-xs);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-label-md)}.sapphire-label--md{font-size:var(--sapphire-semantic-size-font-label-sm);min-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-label__text{font-weight:var(--sapphire-semantic-font-weight-default-medium);color:var(--sapphire-semantic-color-foreground-primary);vertical-align:middle}.sapphire-label__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px;margin-left:var(--sapphire-semantic-size-spacing-3xs);display:inline-block}.sapphire-label__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-label__help-button{margin-left:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-label__help-button:empty{display:none}\n"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: TranslatePipe, name: "t" }] });
|
|
1347
1347
|
__decorate([
|
|
1348
1348
|
AutoId()
|
|
1349
1349
|
], LabelComponent.prototype, "id", void 0);
|
|
@@ -1352,7 +1352,7 @@ __decorate([
|
|
|
1352
1352
|
], LabelComponent.prototype, "disabled", void 0);
|
|
1353
1353
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: LabelComponent, decorators: [{
|
|
1354
1354
|
type: Component,
|
|
1355
|
-
args: [{ selector: 'sp-label', standalone: true, imports: [NgIf, TranslatePipe], providers: [{ provide: MessageDictionary, useValue: translations$
|
|
1355
|
+
args: [{ selector: 'sp-label', standalone: true, imports: [NgIf, TranslatePipe], providers: [{ provide: MessageDictionary, useValue: translations$3 }], template: "<div class=\"sapphire-label\" [class.sapphire-label--md]=\"size === 'md'\">\n <label\n class=\"sapphire-label__text\"\n (click)=\"!disabled && labelClick.emit($event)\"\n [attr.for]=\"for\"\n [attr.id]=\"id\"\n #label\n ><ng-content></ng-content\n ></label>\n\n <span\n *ngIf=\"necessityIndicator === 'required'\"\n class=\"sapphire-label__required-indicator\"\n ></span>\n <span\n *ngIf=\"necessityIndicator === 'optional'\"\n class=\"sapphire-label__optional-indicator\"\n >({{ 'optional' | t }})</span\n >\n\n <span class=\"sapphire-label__help-button\">\n <ng-content select=\"sp-help-button\"></ng-content>\n </span>\n</div>\n", styles: [".sapphire-label{min-height:var(--sapphire-semantic-size-height-control-xs);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-label-md)}.sapphire-label--md{font-size:var(--sapphire-semantic-size-font-label-sm);min-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-label__text{font-weight:var(--sapphire-semantic-font-weight-default-medium);color:var(--sapphire-semantic-color-foreground-primary);vertical-align:middle}.sapphire-label__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px;margin-left:var(--sapphire-semantic-size-spacing-3xs);display:inline-block}.sapphire-label__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-label__help-button{margin-left:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-label__help-button:empty{display:none}\n"] }]
|
|
1356
1356
|
}], propDecorators: { id: [{
|
|
1357
1357
|
type: Input
|
|
1358
1358
|
}], for: [{
|
|
@@ -1606,7 +1606,7 @@ class RadioBase extends _RadioMixinBase {
|
|
|
1606
1606
|
}
|
|
1607
1607
|
}
|
|
1608
1608
|
RadioBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: RadioBase, deps: [{ token: RadioGroupBase, optional: true }, { token: i0.ElementRef }, { token: 'tabindex', attribute: true }, { token: i3.FocusMonitor }, { token: i3$1.UniqueSelectionDispatcher }], target: i0.ɵɵFactoryTarget.Directive });
|
|
1609
|
-
RadioBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: RadioBase, inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], name: "name", autofocus: "autofocus", id: "id", value: "value", checked: "checked", disabled: "disabled", readonly: "readonly", required: "required" }, outputs: { change: "change" }, host: { properties: { "id": "this.id" } }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0 });
|
|
1609
|
+
RadioBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: RadioBase, inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], name: "name", autofocus: "autofocus", id: "id", note: "note", value: "value", checked: "checked", disabled: "disabled", readonly: "readonly", required: "required" }, outputs: { change: "change" }, host: { properties: { "id": "this.id" } }, viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, ngImport: i0 });
|
|
1610
1610
|
__decorate([
|
|
1611
1611
|
AutoId()
|
|
1612
1612
|
], RadioBase.prototype, "id", void 0);
|
|
@@ -1640,6 +1640,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
1640
1640
|
}], _inputElement: [{
|
|
1641
1641
|
type: ViewChild,
|
|
1642
1642
|
args: ['input']
|
|
1643
|
+
}], note: [{
|
|
1644
|
+
type: Input
|
|
1643
1645
|
}], value: [{
|
|
1644
1646
|
type: Input
|
|
1645
1647
|
}], checked: [{
|
|
@@ -1657,16 +1659,17 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
1657
1659
|
class RadioComponent extends RadioBase {
|
|
1658
1660
|
}
|
|
1659
1661
|
RadioComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: RadioComponent, deps: null, target: i0.ɵɵFactoryTarget.Component });
|
|
1660
|
-
RadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: RadioComponent, selector: "sp-radio", inputs: { tabIndex: "tabIndex" }, host: { properties: { "attr.id": "id", "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null" } }, usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }], ngImport: i0, template: "<label\n [for]=\"inputId\"\n class=\"sapphire-radio\"\n [class.sapphire-radio--checked]=\"checked\"\n [class.sapphire-radio--md]=\"radioGroup?._field?.size === 'md'\"\n>\n <input\n #input\n class=\"sapphire-radio__input\"\n type=\"radio\"\n [id]=\"inputId\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"checked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (change)=\"_onInputInteraction($event)\"\n [attr.autofocus]=\"autofocus ? true : null\"\n />\n <span class=\"sapphire-radio__box\"></span>\n <span class=\"sapphire-radio__label\">\n <ng-content></ng-content>\n </span>\n</label>\n", styles: [".sapphire-radio{display:inline-flex;font-family:var(--sapphire-semantic-font-name-default);max-width:100%;position:relative}.sapphire-radio__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-radio__label{margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);line-height:var(--sapphire-semantic-size-height-control-xs);color:var(--sapphire-semantic-color-foreground-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-radio--md .sapphire-radio__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-radio__box{box-sizing:border-box;background-color:var(--sapphire-semantic-color-background-field);width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);flex-shrink:0;border-radius:50%;border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);position:relative;margin-top:var(--sapphire-semantic-size-spacing-4xs);transition-property:background-color,border-color,border-width;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-radio--md .sapphire-radio__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-radio--checked .sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-default);border-width:calc((var(--sapphire-semantic-size-height-box-lg) - var(--sapphire-global-size-generic-20)) / 2);background-color:var(--sapphire-semantic-color-foreground-action-on-select-default)}.sapphire-radio--md.sapphire-radio--checked .sapphire-radio__box{border-width:calc((var(--sapphire-semantic-size-height-box-md) - var(--sapphire-global-size-generic-15)) / 2)}.sapphire-radio--checked .sapphire-radio__box:after{display:block}.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked).is-hover .sapphire-radio__box,.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-radio--checked:not(:active):not(.is-active).is-hover .sapphire-radio__box,.sapphire-radio--checked:not(:active):not(.is-active):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-hover)}.sapphire-radio:not(.sapphire-radio--checked).is-active .sapphire-radio__box,.sapphire-radio:not(.sapphire-radio--checked):active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-radio--checked.is-active .sapphire-radio__box,.sapphire-radio--checked:active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-active)}.sapphire-radio.is-focus .sapphire-radio__input~.sapphire-radio__box,.sapphire-radio:not(.js-focus) .sapphire-radio__input:focus-visible~.sapphire-radio__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-radio__input:disabled{cursor:not-allowed}.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__box,.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__label{opacity:var(--sapphire-semantic-opacity-disabled)}\n"], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
1662
|
+
RadioComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: RadioComponent, selector: "sp-radio", inputs: { tabIndex: "tabIndex" }, host: { properties: { "attr.id": "id", "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "attr.aria-describedby": "null" }, classAttribute: "sapphire-radio-container" }, usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<label\n [for]=\"inputId\"\n class=\"sapphire-radio\"\n [class.sapphire-radio--checked]=\"checked\"\n [class.sapphire-radio--md]=\"radioGroup?._field?.size === 'md'\"\n>\n <input\n #input\n class=\"sapphire-radio__input\"\n type=\"radio\"\n [id]=\"inputId\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"checked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (change)=\"_onInputInteraction($event)\"\n [attr.autofocus]=\"autofocus ? true : null\"\n />\n <span class=\"sapphire-radio__box\"></span>\n <span class=\"sapphire-radio__label\">\n <ng-content></ng-content>\n </span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-radio__note\"\n [class.sapphire-radio__note--md]=\"radioGroup?._field?.size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-radio{display:inline-flex;font-family:var(--sapphire-semantic-font-name-default);max-width:100%;position:relative}.sapphire-radio-container{display:inline-flex;flex-flow:column}.sapphire-radio__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-radio__label{margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);line-height:var(--sapphire-semantic-size-height-control-xs);color:var(--sapphire-semantic-color-foreground-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-radio--md .sapphire-radio__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-radio__box{box-sizing:border-box;background-color:var(--sapphire-semantic-color-background-field);width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);flex-shrink:0;border-radius:50%;border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);position:relative;margin-top:var(--sapphire-semantic-size-spacing-4xs);transition-property:background-color,border-color,border-width;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-radio--md .sapphire-radio__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-radio--checked .sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-default);border-width:calc((var(--sapphire-semantic-size-height-box-lg) - var(--sapphire-global-size-generic-20)) / 2);background-color:var(--sapphire-semantic-color-foreground-action-on-select-default)}.sapphire-radio--md.sapphire-radio--checked .sapphire-radio__box{border-width:calc((var(--sapphire-semantic-size-height-box-md) - var(--sapphire-global-size-generic-15)) / 2)}.sapphire-radio--checked .sapphire-radio__box:after{display:block}.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked).is-hover .sapphire-radio__box,.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-radio--checked:not(:active):not(.is-active).is-hover .sapphire-radio__box,.sapphire-radio--checked:not(:active):not(.is-active):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-hover)}.sapphire-radio:not(.sapphire-radio--checked).is-active .sapphire-radio__box,.sapphire-radio:not(.sapphire-radio--checked):active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-radio--checked.is-active .sapphire-radio__box,.sapphire-radio--checked:active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-active)}.sapphire-radio.is-focus .sapphire-radio__input~.sapphire-radio__box,.sapphire-radio:not(.js-focus) .sapphire-radio__input:focus-visible~.sapphire-radio__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-radio__input:disabled{cursor:not-allowed}.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__box,.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__label{opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-radio__note{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg));color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-radio__note--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-lg))}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.Default });
|
|
1661
1663
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: RadioComponent, decorators: [{
|
|
1662
1664
|
type: Component,
|
|
1663
|
-
args: [{ selector: 'sp-radio', changeDetection: ChangeDetectionStrategy.Default, hostDirectives: [ThemeCheckDirective], inputs: ['tabIndex'], host: {
|
|
1665
|
+
args: [{ selector: 'sp-radio', changeDetection: ChangeDetectionStrategy.Default, hostDirectives: [ThemeCheckDirective, UseComponentStylesOnHost], inputs: ['tabIndex'], host: {
|
|
1664
1666
|
'[attr.id]': 'id',
|
|
1665
1667
|
'[attr.tabindex]': 'null',
|
|
1666
1668
|
'[attr.aria-label]': 'null',
|
|
1667
1669
|
'[attr.aria-labelledby]': 'null',
|
|
1668
1670
|
'[attr.aria-describedby]': 'null',
|
|
1669
|
-
|
|
1671
|
+
class: 'sapphire-radio-container',
|
|
1672
|
+
}, standalone: false, template: "<label\n [for]=\"inputId\"\n class=\"sapphire-radio\"\n [class.sapphire-radio--checked]=\"checked\"\n [class.sapphire-radio--md]=\"radioGroup?._field?.size === 'md'\"\n>\n <input\n #input\n class=\"sapphire-radio__input\"\n type=\"radio\"\n [id]=\"inputId\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"checked\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [required]=\"required\"\n (change)=\"_onInputInteraction($event)\"\n [attr.autofocus]=\"autofocus ? true : null\"\n />\n <span class=\"sapphire-radio__box\"></span>\n <span class=\"sapphire-radio__label\">\n <ng-content></ng-content>\n </span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-radio__note\"\n [class.sapphire-radio__note--md]=\"radioGroup?._field?.size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-radio{display:inline-flex;font-family:var(--sapphire-semantic-font-name-default);max-width:100%;position:relative}.sapphire-radio-container{display:inline-flex;flex-flow:column}.sapphire-radio__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-radio__label{margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);line-height:var(--sapphire-semantic-size-height-control-xs);color:var(--sapphire-semantic-color-foreground-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-radio--md .sapphire-radio__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-radio__box{box-sizing:border-box;background-color:var(--sapphire-semantic-color-background-field);width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);flex-shrink:0;border-radius:50%;border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);position:relative;margin-top:var(--sapphire-semantic-size-spacing-4xs);transition-property:background-color,border-color,border-width;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-radio--md .sapphire-radio__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-radio--checked .sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-default);border-width:calc((var(--sapphire-semantic-size-height-box-lg) - var(--sapphire-global-size-generic-20)) / 2);background-color:var(--sapphire-semantic-color-foreground-action-on-select-default)}.sapphire-radio--md.sapphire-radio--checked .sapphire-radio__box{border-width:calc((var(--sapphire-semantic-size-height-box-md) - var(--sapphire-global-size-generic-15)) / 2)}.sapphire-radio--checked .sapphire-radio__box:after{display:block}.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked).is-hover .sapphire-radio__box,.sapphire-radio:not(:active):not(.is-active):not(.sapphire-radio--checked):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-radio--checked:not(:active):not(.is-active).is-hover .sapphire-radio__box,.sapphire-radio--checked:not(:active):not(.is-active):not(.js-hover):hover .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-hover)}.sapphire-radio:not(.sapphire-radio--checked).is-active .sapphire-radio__box,.sapphire-radio:not(.sapphire-radio--checked):active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-radio--checked.is-active .sapphire-radio__box,.sapphire-radio--checked:active .sapphire-radio__input:not(:disabled)~.sapphire-radio__box{border-color:var(--sapphire-semantic-color-background-action-primary-active)}.sapphire-radio.is-focus .sapphire-radio__input~.sapphire-radio__box,.sapphire-radio:not(.js-focus) .sapphire-radio__input:focus-visible~.sapphire-radio__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-radio__input:disabled{cursor:not-allowed}.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__box,.sapphire-radio .sapphire-radio__input:disabled~.sapphire-radio__label{opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-radio__note{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg));color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-radio__note--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-lg))}\n"] }]
|
|
1670
1673
|
}] });
|
|
1671
1674
|
|
|
1672
1675
|
class RadioGroupBase {
|
|
@@ -2373,14 +2376,14 @@ class CheckboxComponent extends _CheckboxMixinBase {
|
|
|
2373
2376
|
}
|
|
2374
2377
|
}
|
|
2375
2378
|
CheckboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: CheckboxComponent, deps: [{ token: CheckboxGroupComponent, optional: true }, { token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
2376
|
-
CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: CheckboxComponent, selector: "sp-checkbox", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], id: "id", required: "required", necessityIndicator: "necessityIndicator", readonly: "readonly", name: "name", size: "size", value: "value", selected: "selected", disabled: "disabled", indeterminate: "indeterminate" }, outputs: { change: "change" }, host: { properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "id": "this.id" } }, providers: [
|
|
2379
|
+
CheckboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: CheckboxComponent, selector: "sp-checkbox", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], id: "id", required: "required", necessityIndicator: "necessityIndicator", readonly: "readonly", name: "name", size: "size", value: "value", note: "note", selected: "selected", disabled: "disabled", indeterminate: "indeterminate" }, outputs: { change: "change" }, host: { properties: { "attr.tabindex": "null", "attr.aria-label": "null", "attr.aria-labelledby": "null", "id": "this.id" }, classAttribute: "sapphire-checkbox-container" }, providers: [
|
|
2377
2380
|
{
|
|
2378
2381
|
provide: NG_VALUE_ACCESSOR,
|
|
2379
2382
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
2380
2383
|
multi: true,
|
|
2381
2384
|
},
|
|
2382
|
-
{ provide: MessageDictionary, useValue: translations$
|
|
2383
|
-
], viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["spCheckbox"], usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }], ngImport: i0, template: "<label\n [for]=\"_inputId\"\n class=\"sapphire-checkbox\"\n [class.sapphire-checkbox--checked]=\"selected\"\n [class.sapphire-checkbox--indeterminate]=\"indeterminate\"\n [class.is-disabled]=\"disabled && !checkboxGroup?.disabled\"\n [class.sapphire-checkbox--md]=\"size === 'md'\"\n>\n <input\n #input\n type=\"checkbox\"\n class=\"sapphire-checkbox__input\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"_inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-checkbox__box\">\n <svg\n *ngIf=\"indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"square\"\n d=\"M7 12h10\"\n />\n <path fill=\"currentColor\" fill-rule=\"nonzero\" d=\"M18 11v2H6v-2z\" />\n </g>\n </svg>\n <svg\n *ngIf=\"selected && !indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M17.782 6.918l.753.659a.5.5 0 01.047.705L10.9 17.061a.5.5 0 01-.73.024l-4.232-4.231a.5.5 0 010-.708l.707-.707a.5.5 0 01.708 0l3.097 3.097 6.626-7.57a.5.5 0 01.705-.048z\"\n fill=\"currentColor\"\n fill-rule=\"nonzero\"\n />\n </svg>\n </span>\n <span class=\"sapphire-checkbox__label\">\n <ng-content></ng-content>\n <span\n *ngIf=\"labelNecessityIndicator === 'required'\"\n class=\"sapphire-checkbox__required-indicator\"\n ></span>\n <span\n *ngIf=\"labelNecessityIndicator === 'optional'\"\n class=\"sapphire-checkbox__optional-indicator\"\n >({{ 'optional' | t }})\n </span>\n </span>\n</label>\n", styles: [".sapphire-checkbox-container{display:flex;flex-flow:column}.sapphire-checkbox{font-family:var(--sapphire-semantic-font-name-default);display:inline-flex;position:relative;max-width:100%;cursor:pointer}.sapphire-checkbox__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-checkbox__label{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-height-control-xs);display:inline-flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-checkbox__label:empty{margin-left:0}.sapphire-checkbox__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px}.sapphire-checkbox__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox--md .sapphire-checkbox__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs);margin-left:var(--sapphire-semantic-size-spacing-xs)}.sapphire-checkbox__error-text{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);color:var(--sapphire-semantic-color-foreground-on-negative-subtle);margin-top:var(--sapphire-semantic-size-spacing-2xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg))}.sapphire-checkbox__error-text--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-md))}.sapphire-checkbox__box{box-sizing:border-box;position:relative;width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);border-radius:var(--sapphire-semantic-size-radius-sm);border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);background:var(--sapphire-semantic-color-background-field);transition:all var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);flex-shrink:0;display:inline-flex;justify-content:center;align-items:center}.sapphire-checkbox__box:has(~ .sapphire-checkbox__label:not(:empty)){margin-top:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-checkbox--md .sapphire-checkbox__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox__box-icon{display:inherit;line-height:0;color:var(--sapphire-semantic-color-foreground-action-on-select-default);margin:calc(var(--sapphire-semantic-size-border-md) * -1);height:var(--sapphire-semantic-size-height-box-lg);width:var(--sapphire-semantic-size-height-box-lg)}.sapphire-checkbox--md .sapphire-checkbox__box-icon{height:var(--sapphire-semantic-size-height-box-md);width:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox--error .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-default)}.sapphire-checkbox--checked .sapphire-checkbox__box,.sapphire-checkbox--indeterminate .sapphire-checkbox__box{border-width:var(--sapphire-global-size-generic-0);background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-checkbox--checked.sapphire-checkbox--error .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-default)}.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-hover)}.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background-color:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-hover)}.sapphire-checkbox:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-checkbox--error:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox--error:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-active)}.sapphire-checkbox--checked.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-checkbox--checked.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-active)}.sapphire-checkbox.is-focus .sapphire-checkbox__box,.sapphire-checkbox:not(.js-focus):has(input:focus-visible) .sapphire-checkbox__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-checkbox.is-disabled,.sapphire-checkbox__input:disabled{cursor:not-allowed}.sapphire-checkbox.is-disabled,.sapphire-checkbox:has(:disabled){opacity:var(--sapphire-semantic-opacity-disabled)}:host{display:inline-flex}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: TranslatePipe, name: "t" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2385
|
+
{ provide: MessageDictionary, useValue: translations$3 },
|
|
2386
|
+
], viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], exportAs: ["spCheckbox"], usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<label\n [for]=\"_inputId\"\n class=\"sapphire-checkbox\"\n [class.sapphire-checkbox--checked]=\"selected\"\n [class.sapphire-checkbox--indeterminate]=\"indeterminate\"\n [class.is-disabled]=\"disabled && !checkboxGroup?.disabled\"\n [class.sapphire-checkbox--md]=\"size === 'md'\"\n>\n <input\n #input\n type=\"checkbox\"\n class=\"sapphire-checkbox__input\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"_inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-checkbox__box\">\n <svg\n *ngIf=\"indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"square\"\n d=\"M7 12h10\"\n />\n <path fill=\"currentColor\" fill-rule=\"nonzero\" d=\"M18 11v2H6v-2z\" />\n </g>\n </svg>\n <svg\n *ngIf=\"selected && !indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M17.782 6.918l.753.659a.5.5 0 01.047.705L10.9 17.061a.5.5 0 01-.73.024l-4.232-4.231a.5.5 0 010-.708l.707-.707a.5.5 0 01.708 0l3.097 3.097 6.626-7.57a.5.5 0 01.705-.048z\"\n fill=\"currentColor\"\n fill-rule=\"nonzero\"\n />\n </svg>\n </span>\n <span class=\"sapphire-checkbox__label\">\n <ng-content></ng-content>\n <span\n *ngIf=\"labelNecessityIndicator === 'required'\"\n class=\"sapphire-checkbox__required-indicator\"\n ></span>\n <span\n *ngIf=\"labelNecessityIndicator === 'optional'\"\n class=\"sapphire-checkbox__optional-indicator\"\n >({{ 'optional' | t }})\n </span>\n </span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-checkbox__note\"\n [class.sapphire-checkbox__note--md]=\"size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-checkbox-container{display:flex;flex-flow:column}.sapphire-checkbox{font-family:var(--sapphire-semantic-font-name-default);display:inline-flex;position:relative;max-width:100%;cursor:pointer}.sapphire-checkbox__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-checkbox__label{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-height-control-xs);display:inline-flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-checkbox__label:empty{margin-left:0}.sapphire-checkbox__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px}.sapphire-checkbox__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox--md .sapphire-checkbox__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs);margin-left:var(--sapphire-semantic-size-spacing-xs)}.sapphire-checkbox__note,.sapphire-checkbox__error-text{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg))}.sapphire-checkbox__note{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox__error-text{color:var(--sapphire-semantic-color-foreground-on-negative-subtle)}.sapphire-checkbox__note--md,.sapphire-checkbox__error-text--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-md))}.sapphire-checkbox__box{box-sizing:border-box;position:relative;width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);border-radius:var(--sapphire-semantic-size-radius-sm);border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);background:var(--sapphire-semantic-color-background-field);transition:all var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);flex-shrink:0;display:inline-flex;justify-content:center;align-items:center}.sapphire-checkbox__box:has(~ .sapphire-checkbox__label:not(:empty)){margin-top:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-checkbox--md .sapphire-checkbox__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox__box-icon{display:inherit;line-height:0;color:var(--sapphire-semantic-color-foreground-action-on-select-default);margin:calc(var(--sapphire-semantic-size-border-md) * -1);height:var(--sapphire-semantic-size-height-box-lg);width:var(--sapphire-semantic-size-height-box-lg)}.sapphire-checkbox--md .sapphire-checkbox__box-icon{height:var(--sapphire-semantic-size-height-box-md);width:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox--error .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-default)}.sapphire-checkbox--checked .sapphire-checkbox__box,.sapphire-checkbox--indeterminate .sapphire-checkbox__box{border-width:var(--sapphire-global-size-generic-0);background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-checkbox--checked.sapphire-checkbox--error .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-default)}.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-hover)}.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background-color:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-hover)}.sapphire-checkbox:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-checkbox--error:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox--error:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-active)}.sapphire-checkbox--checked.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-checkbox--checked.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-active)}.sapphire-checkbox.is-focus .sapphire-checkbox__box,.sapphire-checkbox:not(.js-focus):has(input:focus-visible) .sapphire-checkbox__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-checkbox.is-disabled,.sapphire-checkbox__input:disabled{cursor:not-allowed}.sapphire-checkbox.is-disabled,.sapphire-checkbox:has(:disabled){opacity:var(--sapphire-semantic-opacity-disabled)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "pipe", type: TranslatePipe, name: "t" }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
2384
2387
|
__decorate([
|
|
2385
2388
|
AutoId()
|
|
2386
2389
|
], CheckboxComponent.prototype, "id", void 0);
|
|
@@ -2401,12 +2404,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
2401
2404
|
useExisting: forwardRef(() => CheckboxComponent),
|
|
2402
2405
|
multi: true,
|
|
2403
2406
|
},
|
|
2404
|
-
{ provide: MessageDictionary, useValue: translations$
|
|
2407
|
+
{ provide: MessageDictionary, useValue: translations$3 },
|
|
2405
2408
|
], host: {
|
|
2406
2409
|
'[attr.tabindex]': 'null',
|
|
2407
2410
|
'[attr.aria-label]': 'null',
|
|
2408
2411
|
'[attr.aria-labelledby]': 'null',
|
|
2409
|
-
}, hostDirectives: [ThemeCheckDirective], standalone: false, template: "<label\n [for]=\"_inputId\"\n class=\"sapphire-checkbox\"\n [class.sapphire-checkbox--checked]=\"selected\"\n [class.sapphire-checkbox--indeterminate]=\"indeterminate\"\n [class.is-disabled]=\"disabled && !checkboxGroup?.disabled\"\n [class.sapphire-checkbox--md]=\"size === 'md'\"\n>\n <input\n #input\n type=\"checkbox\"\n class=\"sapphire-checkbox__input\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"_inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-checkbox__box\">\n <svg\n *ngIf=\"indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"square\"\n d=\"M7 12h10\"\n />\n <path fill=\"currentColor\" fill-rule=\"nonzero\" d=\"M18 11v2H6v-2z\" />\n </g>\n </svg>\n <svg\n *ngIf=\"selected && !indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M17.782 6.918l.753.659a.5.5 0 01.047.705L10.9 17.061a.5.5 0 01-.73.024l-4.232-4.231a.5.5 0 010-.708l.707-.707a.5.5 0 01.708 0l3.097 3.097 6.626-7.57a.5.5 0 01.705-.048z\"\n fill=\"currentColor\"\n fill-rule=\"nonzero\"\n />\n </svg>\n </span>\n <span class=\"sapphire-checkbox__label\">\n <ng-content></ng-content>\n <span\n *ngIf=\"labelNecessityIndicator === 'required'\"\n class=\"sapphire-checkbox__required-indicator\"\n ></span>\n <span\n *ngIf=\"labelNecessityIndicator === 'optional'\"\n class=\"sapphire-checkbox__optional-indicator\"\n >({{ 'optional' | t }})\n </span>\n </span>\n</label>\n", styles: [".sapphire-checkbox-container{display:flex;flex-flow:column}.sapphire-checkbox{font-family:var(--sapphire-semantic-font-name-default);display:inline-flex;position:relative;max-width:100%;cursor:pointer}.sapphire-checkbox__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-checkbox__label{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-height-control-xs);display:inline-flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-checkbox__label:empty{margin-left:0}.sapphire-checkbox__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px}.sapphire-checkbox__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox--md .sapphire-checkbox__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs);margin-left:var(--sapphire-semantic-size-spacing-xs)}.sapphire-checkbox__error-text{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);color:var(--sapphire-semantic-color-foreground-on-negative-subtle);margin-top:var(--sapphire-semantic-size-spacing-2xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg))}.sapphire-checkbox__error-text--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-md))}.sapphire-checkbox__box{box-sizing:border-box;position:relative;width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);border-radius:var(--sapphire-semantic-size-radius-sm);border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);background:var(--sapphire-semantic-color-background-field);transition:all var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);flex-shrink:0;display:inline-flex;justify-content:center;align-items:center}.sapphire-checkbox__box:has(~ .sapphire-checkbox__label:not(:empty)){margin-top:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-checkbox--md .sapphire-checkbox__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox__box-icon{display:inherit;line-height:0;color:var(--sapphire-semantic-color-foreground-action-on-select-default);margin:calc(var(--sapphire-semantic-size-border-md) * -1);height:var(--sapphire-semantic-size-height-box-lg);width:var(--sapphire-semantic-size-height-box-lg)}.sapphire-checkbox--md .sapphire-checkbox__box-icon{height:var(--sapphire-semantic-size-height-box-md);width:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox--error .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-default)}.sapphire-checkbox--checked .sapphire-checkbox__box,.sapphire-checkbox--indeterminate .sapphire-checkbox__box{border-width:var(--sapphire-global-size-generic-0);background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-checkbox--checked.sapphire-checkbox--error .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-default)}.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-hover)}.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background-color:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-hover)}.sapphire-checkbox:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-checkbox--error:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox--error:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-active)}.sapphire-checkbox--checked.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-checkbox--checked.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-active)}.sapphire-checkbox.is-focus .sapphire-checkbox__box,.sapphire-checkbox:not(.js-focus):has(input:focus-visible) .sapphire-checkbox__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-checkbox.is-disabled,.sapphire-checkbox__input:disabled{cursor:not-allowed}.sapphire-checkbox.is-disabled,.sapphire-checkbox:has(:disabled){opacity:var(--sapphire-semantic-opacity-disabled)}:host{display:inline-flex}\n"] }]
|
|
2412
|
+
class: 'sapphire-checkbox-container',
|
|
2413
|
+
}, hostDirectives: [ThemeCheckDirective, UseComponentStylesOnHost], standalone: false, template: "<label\n [for]=\"_inputId\"\n class=\"sapphire-checkbox\"\n [class.sapphire-checkbox--checked]=\"selected\"\n [class.sapphire-checkbox--indeterminate]=\"indeterminate\"\n [class.is-disabled]=\"disabled && !checkboxGroup?.disabled\"\n [class.sapphire-checkbox--md]=\"size === 'md'\"\n>\n <input\n #input\n type=\"checkbox\"\n class=\"sapphire-checkbox__input\"\n [attr.aria-checked]=\"_getAriaChecked()\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [attr.aria-describedby]=\"ariaDescribedby\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"_inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-checkbox__box\">\n <svg\n *ngIf=\"indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <g fill=\"none\" fill-rule=\"evenodd\">\n <path\n stroke=\"currentColor\"\n stroke-width=\"2\"\n stroke-linecap=\"square\"\n d=\"M7 12h10\"\n />\n <path fill=\"currentColor\" fill-rule=\"nonzero\" d=\"M18 11v2H6v-2z\" />\n </g>\n </svg>\n <svg\n *ngIf=\"selected && !indeterminate\"\n class=\"sapphire-checkbox__box-icon\"\n xmlns=\"http://www.w3.org/2000/svg\"\n viewBox=\"0 0 24 24\"\n aria-hidden=\"true\"\n >\n <path\n d=\"M17.782 6.918l.753.659a.5.5 0 01.047.705L10.9 17.061a.5.5 0 01-.73.024l-4.232-4.231a.5.5 0 010-.708l.707-.707a.5.5 0 01.708 0l3.097 3.097 6.626-7.57a.5.5 0 01.705-.048z\"\n fill=\"currentColor\"\n fill-rule=\"nonzero\"\n />\n </svg>\n </span>\n <span class=\"sapphire-checkbox__label\">\n <ng-content></ng-content>\n <span\n *ngIf=\"labelNecessityIndicator === 'required'\"\n class=\"sapphire-checkbox__required-indicator\"\n ></span>\n <span\n *ngIf=\"labelNecessityIndicator === 'optional'\"\n class=\"sapphire-checkbox__optional-indicator\"\n >({{ 'optional' | t }})\n </span>\n </span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-checkbox__note\"\n [class.sapphire-checkbox__note--md]=\"size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-checkbox-container{display:flex;flex-flow:column}.sapphire-checkbox{font-family:var(--sapphire-semantic-font-name-default);display:inline-flex;position:relative;max-width:100%;cursor:pointer}.sapphire-checkbox__input{margin:0;overflow:visible;position:absolute;top:0;left:0;height:100%;width:100%;opacity:.0001;z-index:1;cursor:pointer}.sapphire-checkbox__label{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;margin-left:var(--sapphire-semantic-size-spacing-sm);font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-height-control-xs);display:inline-flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-3xs)}.sapphire-checkbox__label:empty{margin-left:0}.sapphire-checkbox__required-indicator{background-image:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M3.99999 0.583344C4.41421 0.583344 4.74999 0.91913 4.74999 1.33334V3.22127L6.6017 2.62001C6.99567 2.49208 7.41874 2.70775 7.54666 3.10172C7.67459 3.49568 7.45892 3.91876 7.06495 4.04668L5.21363 4.64782L6.3601 6.22585C6.60356 6.56096 6.52927 7.02998 6.19416 7.27345C5.85905 7.51691 5.39002 7.44262 5.14656 7.10751L3.99999 5.52935L2.85343 7.10751C2.60996 7.44262 2.14094 7.51691 1.80583 7.27345C1.47072 7.02998 1.39642 6.56096 1.63989 6.22585L2.78636 4.64782L0.935036 4.04668C0.541071 3.91876 0.325401 3.49568 0.453323 3.10172C0.581246 2.70775 1.00432 2.49208 1.39829 2.62001L3.24999 3.22127V1.33334C3.24999 0.91913 3.58578 0.583344 3.99999 0.583344Z' fill='%23DD3254'/%3E%3C/svg%3E%0A\");width:8px;height:8px}.sapphire-checkbox__optional-indicator{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox--md .sapphire-checkbox__label{font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs);margin-left:var(--sapphire-semantic-size-spacing-xs)}.sapphire-checkbox__note,.sapphire-checkbox__error-text{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-semantic-size-height-box-lg))}.sapphire-checkbox__note{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-checkbox__error-text{color:var(--sapphire-semantic-color-foreground-on-negative-subtle)}.sapphire-checkbox__note--md,.sapphire-checkbox__error-text--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-xs) + var(--sapphire-semantic-size-height-box-md))}.sapphire-checkbox__box{box-sizing:border-box;position:relative;width:var(--sapphire-semantic-size-height-box-lg);height:var(--sapphire-semantic-size-height-box-lg);border-radius:var(--sapphire-semantic-size-radius-sm);border:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-field-default);background:var(--sapphire-semantic-color-background-field);transition:all var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);flex-shrink:0;display:inline-flex;justify-content:center;align-items:center}.sapphire-checkbox__box:has(~ .sapphire-checkbox__label:not(:empty)){margin-top:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-checkbox--md .sapphire-checkbox__box{width:var(--sapphire-semantic-size-height-box-md);height:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox__box-icon{display:inherit;line-height:0;color:var(--sapphire-semantic-color-foreground-action-on-select-default);margin:calc(var(--sapphire-semantic-size-border-md) * -1);height:var(--sapphire-semantic-size-height-box-lg);width:var(--sapphire-semantic-size-height-box-lg)}.sapphire-checkbox--md .sapphire-checkbox__box-icon{height:var(--sapphire-semantic-size-height-box-md);width:var(--sapphire-semantic-size-height-box-md)}.sapphire-checkbox--error .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-default)}.sapphire-checkbox--checked .sapphire-checkbox__box,.sapphire-checkbox--indeterminate .sapphire-checkbox__box{border-width:var(--sapphire-global-size-generic-0);background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-checkbox--checked.sapphire-checkbox--error .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-default)}.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-hover)}.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked).is-hover .sapphire-checkbox__box,.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.sapphire-checkbox--checked):not(.js-hover):hover .sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-hover)}.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background-color:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active).is-hover .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:not(:active):not(.is-disabled):not(.is-active):not(.js-hover):hover .sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-hover)}.sapphire-checkbox:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-field-active)}.sapphire-checkbox--error:not(.sapphire-checkbox--checked).is-active .sapphire-checkbox__box,.sapphire-checkbox--error:not(.sapphire-checkbox--checked):active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{border-color:var(--sapphire-semantic-color-border-negative-active)}.sapphire-checkbox--checked.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-checkbox--checked.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--checked.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error.is-active .sapphire-checkbox__box,.sapphire-checkbox--indeterminate.sapphire-checkbox--error:active .sapphire-checkbox__input:not(:disabled)~.sapphire-checkbox__box{background:var(--sapphire-semantic-color-background-action-danger-active)}.sapphire-checkbox.is-focus .sapphire-checkbox__box,.sapphire-checkbox:not(.js-focus):has(input:focus-visible) .sapphire-checkbox__box{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-checkbox.is-disabled,.sapphire-checkbox__input:disabled{cursor:not-allowed}.sapphire-checkbox.is-disabled,.sapphire-checkbox:has(:disabled){opacity:var(--sapphire-semantic-opacity-disabled)}\n"] }]
|
|
2410
2414
|
}], ctorParameters: function () {
|
|
2411
2415
|
return [{ type: CheckboxGroupComponent, decorators: [{
|
|
2412
2416
|
type: Optional
|
|
@@ -2444,6 +2448,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
2444
2448
|
}], _inputElement: [{
|
|
2445
2449
|
type: ViewChild,
|
|
2446
2450
|
args: ['input']
|
|
2451
|
+
}], note: [{
|
|
2452
|
+
type: Input
|
|
2447
2453
|
}], selected: [{
|
|
2448
2454
|
type: Input
|
|
2449
2455
|
}], disabled: [{
|
|
@@ -2513,7 +2519,7 @@ MenuComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version:
|
|
|
2513
2519
|
provide: ICON_SIZE_PROVIDER,
|
|
2514
2520
|
useValue: { size: 'sm' },
|
|
2515
2521
|
},
|
|
2516
|
-
], hostDirectives: [{ directive: i1$1.CdkMenu, outputs: ["closed", "closed"] }, { directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<div class=\"sapphire-listbox\">\n <ng-content></ng-content>\n</div>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content{grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.sapphire-popover{box-sizing:border-box;background:var(--sapphire-semantic-color-background-popover);box-shadow:var(--sapphire-semantic-shadow-popover);animation:fade-in var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);border-radius:var(--sapphire-semantic-size-radius-popover);overflow:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex}.sapphire-popover__content{flex-basis:100%}.sapphire-popover--padded{padding:var(--sapphire-semantic-size-spacing-container-horizontal-sm)}.sapphire-popover--max-width{max-width:var(--sapphire-global-size-generic-1120)}.sapphire-menu-backdrop{background:none}\n"] });
|
|
2522
|
+
], hostDirectives: [{ directive: i1$1.CdkMenu, outputs: ["closed", "closed"] }, { directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<div class=\"sapphire-listbox\">\n <ng-content></ng-content>\n</div>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content:not(.sapphire-listbox__content--empty){grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__content--empty{grid-template-columns:1fr;justify-items:center;cursor:default}.sapphire-listbox__item:has(.sapphire-listbox__content--empty){cursor:default}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox>.sapphire-listbox__separator:first-child{display:none}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.sapphire-popover{box-sizing:border-box;background:var(--sapphire-semantic-color-background-popover);box-shadow:var(--sapphire-semantic-shadow-popover);animation:fade-in var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);border-radius:var(--sapphire-semantic-size-radius-popover);overflow:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex}.sapphire-popover__content{flex-basis:100%}.sapphire-popover--padded{padding:var(--sapphire-semantic-size-spacing-container-horizontal-sm)}.sapphire-popover--max-width{max-width:var(--sapphire-global-size-generic-1120)}.sapphire-menu-backdrop{background:none}\n"] });
|
|
2517
2523
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: MenuComponent, decorators: [{
|
|
2518
2524
|
type: Component,
|
|
2519
2525
|
args: [{ selector: 'sp-menu', hostDirectives: [
|
|
@@ -2531,7 +2537,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
2531
2537
|
provide: ICON_SIZE_PROVIDER,
|
|
2532
2538
|
useValue: { size: 'sm' },
|
|
2533
2539
|
},
|
|
2534
|
-
], standalone: false, template: "<div class=\"sapphire-listbox\">\n <ng-content></ng-content>\n</div>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content{grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.sapphire-popover{box-sizing:border-box;background:var(--sapphire-semantic-color-background-popover);box-shadow:var(--sapphire-semantic-shadow-popover);animation:fade-in var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);border-radius:var(--sapphire-semantic-size-radius-popover);overflow:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex}.sapphire-popover__content{flex-basis:100%}.sapphire-popover--padded{padding:var(--sapphire-semantic-size-spacing-container-horizontal-sm)}.sapphire-popover--max-width{max-width:var(--sapphire-global-size-generic-1120)}.sapphire-menu-backdrop{background:none}\n"] }]
|
|
2540
|
+
], standalone: false, template: "<div class=\"sapphire-listbox\">\n <ng-content></ng-content>\n</div>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content:not(.sapphire-listbox__content--empty){grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__content--empty{grid-template-columns:1fr;justify-items:center;cursor:default}.sapphire-listbox__item:has(.sapphire-listbox__content--empty){cursor:default}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox>.sapphire-listbox__separator:first-child{display:none}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.sapphire-popover{box-sizing:border-box;background:var(--sapphire-semantic-color-background-popover);box-shadow:var(--sapphire-semantic-shadow-popover);animation:fade-in var(--sapphire-semantic-time-fade-quick) var(--sapphire-semantic-transitions-fade);border-radius:var(--sapphire-semantic-size-radius-popover);overflow:auto;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex}.sapphire-popover__content{flex-basis:100%}.sapphire-popover--padded{padding:var(--sapphire-semantic-size-spacing-container-horizontal-sm)}.sapphire-popover--max-width{max-width:var(--sapphire-global-size-generic-1120)}.sapphire-menu-backdrop{background:none}\n"] }]
|
|
2535
2541
|
}] });
|
|
2536
2542
|
|
|
2537
2543
|
class MenuItemComponent {
|
|
@@ -3587,7 +3593,7 @@ TextFieldComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", ver
|
|
|
3587
3593
|
provide: FieldControl,
|
|
3588
3594
|
useExisting: forwardRef(() => TextFieldComponent),
|
|
3589
3595
|
},
|
|
3590
|
-
], queries: [{ propertyName: "inputElement", first: true, predicate: TextFieldInputDirective, descendants: true, read: ElementRef }, { propertyName: "_inputDirective", first: true, predicate: TextFieldInputDirective, descendants: true }], hostDirectives: [{ directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<ng-content\n select=\"sp-text-field-prefix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"input\"></ng-content>\n<ng-content\n select=\"sp-text-field-postfix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"textarea\"></ng-content>\n\n<span\n *ngIf=\"characterCounterMax !== undefined\"\n spFieldNoteSuffix\n class=\"sapphire-text-field__counter\"\n [class.sapphire-text-field__counter--error]=\"isCharacterCounterExceeded()\"\n >{{ _inputDirective?.valueLength }}/{{ characterCounterMax }}</span\n>\n", styles: [".sapphire-text-field{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);outline-offset:calc(0px - var(--sapphire-semantic-size-border-sm));box-sizing:border-box;overflow-x:hidden;display:flex;align-items:center;border-radius:var(--sapphire-semantic-size-radius-md);cursor:text;color:var(--sapphire-semantic-color-foreground-primary);background:var(--sapphire-semantic-color-background-field);height:var(--sapphire-semantic-size-height-control-lg);font-family:var(--sapphire-semantic-font-name-default);font-size:var(--sapphire-semantic-size-font-control-lg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-text-field--md{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-text-field__input{box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);line-height:var(--sapphire-semantic-size-line-height-md);font-family:inherit;font-size:inherit;font-weight:var(--sapphire-semantic-font-weight-default-regular);color:inherit;background:transparent;border:none;outline:none}.sapphire-text-field--md .sapphire-text-field__input{padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field__input::placeholder{opacity:1;color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-text-field__input--align-right{text-align:right}.sapphire-text-field:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-text-field--md:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-text-field:has(.sapphire-text-field__prefix) .sapphire-text-field__input{padding-left:0}.sapphire-text-field .sapphire-text-field__prefix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__prefix{margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field:has(.sapphire-text-field__postfix) .sapphire-text-field__input{padding-right:0}.sapphire-text-field .sapphire-text-field__postfix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__postfix{margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field .sapphire-text-field__prefix--icon,.sapphire-text-field .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-text-field--md .sapphire-text-field__prefix--icon,.sapphire-text-field--md .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-text-field--multiline{display:block;line-height:0;height:unset;padding:0}.sapphire-text-field--multiline .sapphire-text-field__input{resize:none;width:100%;padding:var(--sapphire-semantic-size-spacing-control-vertical-lg) var(--sapphire-semantic-size-spacing-control-horizontal-lg);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-lg)}.sapphire-text-field--md .sapphire-text-field--multiline .sapphire-text-field__input{padding:var(--sapphire-semantic-size-spacing-control-vertical-md) var(--sapphire-semantic-size-spacing-control-horizontal-md);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-md)}.sapphire-text-field--multiline.sapphire-text-field--resizable .sapphire-text-field__input{resize:vertical}.sapphire-text-field__counter{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:auto}.sapphire-text-field__counter--error{color:var(--sapphire-semantic-color-foreground-negative)}.sapphire-text-field--error{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-negative-default)}.sapphire-text-field:has([disabled]){cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within).is-hover,.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within):not(.js-hover):hover{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-text-field.is-focus,.sapphire-text-field:focus-within{outline:solid var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);outline-offset:calc(0px - var(--sapphire-semantic-size-focus-ring))}.sapphire-text-field.is-focus .sapphire-text-field__input
|
|
3596
|
+
], queries: [{ propertyName: "inputElement", first: true, predicate: TextFieldInputDirective, descendants: true, read: ElementRef }, { propertyName: "_inputDirective", first: true, predicate: TextFieldInputDirective, descendants: true }], hostDirectives: [{ directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<ng-content\n select=\"sp-text-field-prefix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"input\"></ng-content>\n<ng-content\n select=\"sp-text-field-postfix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"textarea\"></ng-content>\n\n<span\n *ngIf=\"characterCounterMax !== undefined\"\n spFieldNoteSuffix\n class=\"sapphire-text-field__counter\"\n [class.sapphire-text-field__counter--error]=\"isCharacterCounterExceeded()\"\n >{{ _inputDirective?.valueLength }}/{{ characterCounterMax }}</span\n>\n", styles: [".sapphire-text-field{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);outline-offset:calc(0px - var(--sapphire-semantic-size-border-sm));box-sizing:border-box;overflow-x:hidden;display:flex;align-items:center;border-radius:var(--sapphire-semantic-size-radius-md);cursor:text;color:var(--sapphire-semantic-color-foreground-primary);background:var(--sapphire-semantic-color-background-field);height:var(--sapphire-semantic-size-height-control-lg);font-family:var(--sapphire-semantic-font-name-default);font-size:var(--sapphire-semantic-size-font-control-lg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-text-field--md{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-text-field__input{box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);line-height:var(--sapphire-semantic-size-line-height-md);font-family:inherit;font-size:inherit;font-weight:var(--sapphire-semantic-font-weight-default-regular);color:inherit;background:transparent;border:none;outline:none}.sapphire-text-field--md .sapphire-text-field__input{padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field__input::placeholder{opacity:1;color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-text-field__input--align-right{text-align:right}.sapphire-text-field:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-text-field--md:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-text-field:has(.sapphire-text-field__prefix) .sapphire-text-field__input{padding-left:0}.sapphire-text-field .sapphire-text-field__prefix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__prefix{margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field:has(.sapphire-text-field__postfix) .sapphire-text-field__input{padding-right:0}.sapphire-text-field .sapphire-text-field__postfix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__postfix{margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field .sapphire-text-field__prefix--icon,.sapphire-text-field .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-text-field--md .sapphire-text-field__prefix--icon,.sapphire-text-field--md .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-text-field--multiline{display:block;line-height:0;height:unset;padding:0}.sapphire-text-field--multiline .sapphire-text-field__input{resize:none;width:100%;padding:var(--sapphire-semantic-size-spacing-control-vertical-lg) var(--sapphire-semantic-size-spacing-control-horizontal-lg);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-lg)}.sapphire-text-field--md .sapphire-text-field--multiline .sapphire-text-field__input{padding:var(--sapphire-semantic-size-spacing-control-vertical-md) var(--sapphire-semantic-size-spacing-control-horizontal-md);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-md)}.sapphire-text-field--multiline.sapphire-text-field--resizable .sapphire-text-field__input{resize:vertical}.sapphire-text-field__counter{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:auto}.sapphire-text-field__counter--error{color:var(--sapphire-semantic-color-foreground-negative)}.sapphire-text-field--error{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-negative-default)}.sapphire-text-field:has([disabled]){cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within).is-hover,.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within):not(.js-hover):hover{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-text-field.is-focus,.sapphire-text-field:focus-within{outline:solid var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);outline-offset:calc(0px - var(--sapphire-semantic-size-focus-ring))}.sapphire-text-field.is-focus .sapphire-text-field__input:autofill,.sapphire-text-field:focus-within .sapphire-text-field__input:autofill{box-shadow:0 0 0 var(--sapphire-semantic-size-height-control-lg) inset var(--sapphire-semantic-color-background-field)!important}.sapphire-text-field__stepper{display:flex;flex-direction:column;justify-items:stretch;padding:var(--sapphire-semantic-size-spacing-4xs) calc(var(--sapphire-semantic-size-spacing-4xs) + var(--sapphire-semantic-size-border-sm));gap:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-text-field:has(.sapphire-text-field__stepper) .sapphire-text-field__postfix{margin-right:0}.sapphire-text-field__stepper-button{display:flex;align-items:center;justify-content:center;width:var(--sapphire-semantic-size-icon-md);margin:0;padding:0;max-width:-moz-fit-content;max-width:fit-content;flex-shrink:0;border-radius:var(--sapphire-semantic-size-radius-sm);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade);cursor:pointer;background:var(--sapphire-semantic-color-background-action-secondary-default);color:var(--sapphire-semantic-color-foreground-action-on-secondary-default)}.sapphire-text-field__stepper-button:not(:active):not(.is-active):not(.js-hover):hover,.sapphire-text-field__stepper-button:not(:active):not(.is-active).is-hover{background:var(--sapphire-semantic-color-background-action-secondary-hover);color:var(--sapphire-semantic-color-foreground-action-on-secondary-hover)}.sapphire-text-field__stepper-button.is-active,.sapphire-text-field__stepper-button:active{background:var(--sapphire-semantic-color-background-action-secondary-active);color:var(--sapphire-semantic-color-foreground-action-on-secondary-active)}.sapphire-text-field--md.sapphire-text-field__stepper-button{width:var(--sapphire-semantic-size-icon-sm)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: FieldNoteSuffixDirective, selector: "[spFieldNoteSuffix]" }] });
|
|
3591
3597
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: TextFieldComponent, decorators: [{
|
|
3592
3598
|
type: Component,
|
|
3593
3599
|
args: [{ selector: 'sp-text-field', host: {
|
|
@@ -3600,7 +3606,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
3600
3606
|
provide: FieldControl,
|
|
3601
3607
|
useExisting: forwardRef(() => TextFieldComponent),
|
|
3602
3608
|
},
|
|
3603
|
-
], hostDirectives: [ThemeCheckDirective, UseComponentStylesOnHost], standalone: false, template: "<ng-content\n select=\"sp-text-field-prefix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"input\"></ng-content>\n<ng-content\n select=\"sp-text-field-postfix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"textarea\"></ng-content>\n\n<span\n *ngIf=\"characterCounterMax !== undefined\"\n spFieldNoteSuffix\n class=\"sapphire-text-field__counter\"\n [class.sapphire-text-field__counter--error]=\"isCharacterCounterExceeded()\"\n >{{ _inputDirective?.valueLength }}/{{ characterCounterMax }}</span\n>\n", styles: [".sapphire-text-field{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);outline-offset:calc(0px - var(--sapphire-semantic-size-border-sm));box-sizing:border-box;overflow-x:hidden;display:flex;align-items:center;border-radius:var(--sapphire-semantic-size-radius-md);cursor:text;color:var(--sapphire-semantic-color-foreground-primary);background:var(--sapphire-semantic-color-background-field);height:var(--sapphire-semantic-size-height-control-lg);font-family:var(--sapphire-semantic-font-name-default);font-size:var(--sapphire-semantic-size-font-control-lg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-text-field--md{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-text-field__input{box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);line-height:var(--sapphire-semantic-size-line-height-md);font-family:inherit;font-size:inherit;font-weight:var(--sapphire-semantic-font-weight-default-regular);color:inherit;background:transparent;border:none;outline:none}.sapphire-text-field--md .sapphire-text-field__input{padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field__input::placeholder{opacity:1;color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-text-field__input--align-right{text-align:right}.sapphire-text-field:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-text-field--md:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-text-field:has(.sapphire-text-field__prefix) .sapphire-text-field__input{padding-left:0}.sapphire-text-field .sapphire-text-field__prefix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__prefix{margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field:has(.sapphire-text-field__postfix) .sapphire-text-field__input{padding-right:0}.sapphire-text-field .sapphire-text-field__postfix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__postfix{margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field .sapphire-text-field__prefix--icon,.sapphire-text-field .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-text-field--md .sapphire-text-field__prefix--icon,.sapphire-text-field--md .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-text-field--multiline{display:block;line-height:0;height:unset;padding:0}.sapphire-text-field--multiline .sapphire-text-field__input{resize:none;width:100%;padding:var(--sapphire-semantic-size-spacing-control-vertical-lg) var(--sapphire-semantic-size-spacing-control-horizontal-lg);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-lg)}.sapphire-text-field--md .sapphire-text-field--multiline .sapphire-text-field__input{padding:var(--sapphire-semantic-size-spacing-control-vertical-md) var(--sapphire-semantic-size-spacing-control-horizontal-md);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-md)}.sapphire-text-field--multiline.sapphire-text-field--resizable .sapphire-text-field__input{resize:vertical}.sapphire-text-field__counter{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:auto}.sapphire-text-field__counter--error{color:var(--sapphire-semantic-color-foreground-negative)}.sapphire-text-field--error{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-negative-default)}.sapphire-text-field:has([disabled]){cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within).is-hover,.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within):not(.js-hover):hover{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-text-field.is-focus,.sapphire-text-field:focus-within{outline:solid var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);outline-offset:calc(0px - var(--sapphire-semantic-size-focus-ring))}.sapphire-text-field.is-focus .sapphire-text-field__input
|
|
3609
|
+
], hostDirectives: [ThemeCheckDirective, UseComponentStylesOnHost], standalone: false, template: "<ng-content\n select=\"sp-text-field-prefix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"input\"></ng-content>\n<ng-content\n select=\"sp-text-field-postfix\"\n *ngIf=\"!_inputDirective?.textarea\"\n></ng-content>\n<ng-content select=\"textarea\"></ng-content>\n\n<span\n *ngIf=\"characterCounterMax !== undefined\"\n spFieldNoteSuffix\n class=\"sapphire-text-field__counter\"\n [class.sapphire-text-field__counter--error]=\"isCharacterCounterExceeded()\"\n >{{ _inputDirective?.valueLength }}/{{ characterCounterMax }}</span\n>\n", styles: [".sapphire-text-field{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);outline-offset:calc(0px - var(--sapphire-semantic-size-border-sm));box-sizing:border-box;overflow-x:hidden;display:flex;align-items:center;border-radius:var(--sapphire-semantic-size-radius-md);cursor:text;color:var(--sapphire-semantic-color-foreground-primary);background:var(--sapphire-semantic-color-background-field);height:var(--sapphire-semantic-size-height-control-lg);font-family:var(--sapphire-semantic-font-name-default);font-size:var(--sapphire-semantic-size-font-control-lg);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-text-field--md{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-text-field__input{box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);line-height:var(--sapphire-semantic-size-line-height-md);font-family:inherit;font-size:inherit;font-weight:var(--sapphire-semantic-font-weight-default-regular);color:inherit;background:transparent;border:none;outline:none}.sapphire-text-field--md .sapphire-text-field__input{padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field__input::placeholder{opacity:1;color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-text-field__input--align-right{text-align:right}.sapphire-text-field:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-text-field--md:not(.sapphire-text-field--multiline){gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-text-field:has(.sapphire-text-field__prefix) .sapphire-text-field__input{padding-left:0}.sapphire-text-field .sapphire-text-field__prefix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__prefix{margin-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field:has(.sapphire-text-field__postfix) .sapphire-text-field__input{padding-right:0}.sapphire-text-field .sapphire-text-field__postfix{color:var(--sapphire-semantic-color-foreground-secondary);flex-shrink:0;z-index:1;margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field--md .sapphire-text-field__postfix{margin-right:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-text-field .sapphire-text-field__prefix--icon,.sapphire-text-field .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-text-field--md .sapphire-text-field__prefix--icon,.sapphire-text-field--md .sapphire-text-field__postfix--icon{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-text-field--multiline{display:block;line-height:0;height:unset;padding:0}.sapphire-text-field--multiline .sapphire-text-field__input{resize:none;width:100%;padding:var(--sapphire-semantic-size-spacing-control-vertical-lg) var(--sapphire-semantic-size-spacing-control-horizontal-lg);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-lg)}.sapphire-text-field--md .sapphire-text-field--multiline .sapphire-text-field__input{padding:var(--sapphire-semantic-size-spacing-control-vertical-md) var(--sapphire-semantic-size-spacing-control-horizontal-md);scroll-padding-bottom:var(--sapphire-semantic-size-spacing-control-vertical-md)}.sapphire-text-field--multiline.sapphire-text-field--resizable .sapphire-text-field__input{resize:vertical}.sapphire-text-field__counter{color:var(--sapphire-semantic-color-foreground-secondary);margin-left:auto}.sapphire-text-field__counter--error{color:var(--sapphire-semantic-color-foreground-negative)}.sapphire-text-field--error{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-negative-default)}.sapphire-text-field:has([disabled]){cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within).is-hover,.sapphire-text-field:not(:has([disabled])):not(.sapphire-text-field--error):not(.is-focus):not(:focus-within):not(.js-hover):hover{outline:solid var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-text-field.is-focus,.sapphire-text-field:focus-within{outline:solid var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);outline-offset:calc(0px - var(--sapphire-semantic-size-focus-ring))}.sapphire-text-field.is-focus .sapphire-text-field__input:autofill,.sapphire-text-field:focus-within .sapphire-text-field__input:autofill{box-shadow:0 0 0 var(--sapphire-semantic-size-height-control-lg) inset var(--sapphire-semantic-color-background-field)!important}.sapphire-text-field__stepper{display:flex;flex-direction:column;justify-items:stretch;padding:var(--sapphire-semantic-size-spacing-4xs) calc(var(--sapphire-semantic-size-spacing-4xs) + var(--sapphire-semantic-size-border-sm));gap:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-text-field:has(.sapphire-text-field__stepper) .sapphire-text-field__postfix{margin-right:0}.sapphire-text-field__stepper-button{display:flex;align-items:center;justify-content:center;width:var(--sapphire-semantic-size-icon-md);margin:0;padding:0;max-width:-moz-fit-content;max-width:fit-content;flex-shrink:0;border-radius:var(--sapphire-semantic-size-radius-sm);border-style:solid;border-width:0;border-color:transparent;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade);cursor:pointer;background:var(--sapphire-semantic-color-background-action-secondary-default);color:var(--sapphire-semantic-color-foreground-action-on-secondary-default)}.sapphire-text-field__stepper-button:not(:active):not(.is-active):not(.js-hover):hover,.sapphire-text-field__stepper-button:not(:active):not(.is-active).is-hover{background:var(--sapphire-semantic-color-background-action-secondary-hover);color:var(--sapphire-semantic-color-foreground-action-on-secondary-hover)}.sapphire-text-field__stepper-button.is-active,.sapphire-text-field__stepper-button:active{background:var(--sapphire-semantic-color-background-action-secondary-active);color:var(--sapphire-semantic-color-foreground-action-on-secondary-active)}.sapphire-text-field--md.sapphire-text-field__stepper-button{width:var(--sapphire-semantic-size-icon-sm)}\n"] }]
|
|
3604
3610
|
}], ctorParameters: function () {
|
|
3605
3611
|
return [{ type: FieldComponent, decorators: [{
|
|
3606
3612
|
type: Optional
|
|
@@ -3958,6 +3964,51 @@ function section(options, ariaLabel) {
|
|
|
3958
3964
|
return section;
|
|
3959
3965
|
}
|
|
3960
3966
|
|
|
3967
|
+
var empty$6 = "Ingen resultater";
|
|
3968
|
+
var da$2 = {
|
|
3969
|
+
empty: empty$6
|
|
3970
|
+
};
|
|
3971
|
+
|
|
3972
|
+
var empty$5 = "No results";
|
|
3973
|
+
var en$2 = {
|
|
3974
|
+
empty: empty$5
|
|
3975
|
+
};
|
|
3976
|
+
|
|
3977
|
+
var empty$4 = "Keine Ergebnisse";
|
|
3978
|
+
var de$2 = {
|
|
3979
|
+
empty: empty$4
|
|
3980
|
+
};
|
|
3981
|
+
|
|
3982
|
+
var empty$3 = "Ei tuloksia";
|
|
3983
|
+
var fi$2 = {
|
|
3984
|
+
empty: empty$3
|
|
3985
|
+
};
|
|
3986
|
+
|
|
3987
|
+
var empty$2 = "Ingen resultater";
|
|
3988
|
+
var no$2 = {
|
|
3989
|
+
empty: empty$2
|
|
3990
|
+
};
|
|
3991
|
+
|
|
3992
|
+
var empty$1 = "Brak wyników";
|
|
3993
|
+
var pl$2 = {
|
|
3994
|
+
empty: empty$1
|
|
3995
|
+
};
|
|
3996
|
+
|
|
3997
|
+
var empty = "Inga resultat";
|
|
3998
|
+
var se$2 = {
|
|
3999
|
+
empty: empty
|
|
4000
|
+
};
|
|
4001
|
+
|
|
4002
|
+
const translations$2 = new MessageDictionary({
|
|
4003
|
+
'da-DK': da$2,
|
|
4004
|
+
'en-US': en$2,
|
|
4005
|
+
'de-DE': de$2,
|
|
4006
|
+
'fi-FI': fi$2,
|
|
4007
|
+
'nb-NO': no$2,
|
|
4008
|
+
'pl-PL': pl$2,
|
|
4009
|
+
'sv-SE': se$2,
|
|
4010
|
+
}, 'en-US');
|
|
4011
|
+
|
|
3961
4012
|
/**
|
|
3962
4013
|
A workaround for an issue in cdkListbox, where the active item is not scrolled
|
|
3963
4014
|
into view when it's not physically focused (i.e. useActiveDescendant is true).
|
|
@@ -4149,8 +4200,14 @@ class ListboxComponent {
|
|
|
4149
4200
|
get options() {
|
|
4150
4201
|
return this._itemsInput || this.itemsInContent;
|
|
4151
4202
|
}
|
|
4152
|
-
|
|
4203
|
+
get isEmpty() {
|
|
4204
|
+
var _a;
|
|
4205
|
+
const options = Array.from((_a = this.options) !== null && _a !== void 0 ? _a : []);
|
|
4206
|
+
return options.length === 0;
|
|
4207
|
+
}
|
|
4208
|
+
constructor(changeDetectorRef, t) {
|
|
4153
4209
|
this.changeDetectorRef = changeDetectorRef;
|
|
4210
|
+
this.t = t;
|
|
4154
4211
|
/**
|
|
4155
4212
|
* The list of selected values (`value`s of selected sp-options).
|
|
4156
4213
|
* It's always an array, regardless of {@property multiple} being true or not.
|
|
@@ -4330,9 +4387,24 @@ class ListboxComponent {
|
|
|
4330
4387
|
_isConnectedToInput() {
|
|
4331
4388
|
return Boolean(this.connectedInput);
|
|
4332
4389
|
}
|
|
4390
|
+
_isString(input) {
|
|
4391
|
+
return typeof input === 'string';
|
|
4392
|
+
}
|
|
4393
|
+
_getEmptyState() {
|
|
4394
|
+
var _a;
|
|
4395
|
+
if (this.emptyState === null) {
|
|
4396
|
+
return null;
|
|
4397
|
+
}
|
|
4398
|
+
return (_a = this.emptyState) !== null && _a !== void 0 ? _a : this.t.translate('empty', translations$2);
|
|
4399
|
+
}
|
|
4400
|
+
_getEmptyStateTemplate() {
|
|
4401
|
+
return this.emptyState && !this._isString(this.emptyState)
|
|
4402
|
+
? this.emptyState
|
|
4403
|
+
: null;
|
|
4404
|
+
}
|
|
4333
4405
|
}
|
|
4334
|
-
ListboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListboxComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
4335
|
-
ListboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListboxComponent, selector: "sp-listbox", inputs: { selectedValues: "selectedValues", _itemsInput: ["spListboxItems", "_itemsInput"], disabled: "disabled", multiple: "multiple", navigationWrapDisabled: "navigationWrapDisabled", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledBy: ["aria-labelledby", "ariaLabelledBy"], id: "id" }, outputs: { selectedValuesChange: "selectedValuesChange", selected: "selected" }, host: { properties: { "attr.aria-label": "null", "attr.aria-labelledby": "null" } }, providers: [
|
|
4406
|
+
ListboxComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListboxComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: TranslateService }], target: i0.ɵɵFactoryTarget.Component });
|
|
4407
|
+
ListboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListboxComponent, selector: "sp-listbox", inputs: { selectedValues: "selectedValues", _itemsInput: ["spListboxItems", "_itemsInput"], disabled: "disabled", multiple: "multiple", navigationWrapDisabled: "navigationWrapDisabled", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledBy: ["aria-labelledby", "ariaLabelledBy"], id: "id", emptyState: "emptyState" }, outputs: { selectedValuesChange: "selectedValuesChange", selected: "selected" }, host: { properties: { "attr.aria-label": "null", "attr.aria-labelledby": "null" } }, providers: [
|
|
4336
4408
|
{
|
|
4337
4409
|
provide: NG_VALUE_ACCESSOR,
|
|
4338
4410
|
useExisting: forwardRef(() => ListboxComponent),
|
|
@@ -4343,7 +4415,7 @@ ListboxComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versi
|
|
|
4343
4415
|
useValue: { size: 'sm' },
|
|
4344
4416
|
},
|
|
4345
4417
|
ViewEncapsulationProvider,
|
|
4346
|
-
], queries: [{ propertyName: "itemsInContent", predicate: ListboxChild }], viewQueries: [{ propertyName: "cdkListbox", first: true, predicate: CdkListbox, descendants: true }, { propertyName: "cdkOptions", predicate: CdkOption, descendants: true }], exportAs: ["spListbox"], ngImport: i0, template: "<ul\n class=\"sapphire-listbox sapphire-listbox--selection\"\n cdkListbox\n [id]=\"id || ''\"\n [cdkListboxCompareWith]=\"\"\n [cdkListboxMultiple]=\"!!multiple\"\n [cdkListboxDisabled]=\"!!disabled\"\n [cdkListboxNavigationWrapDisabled]=\"\n navigationWrapDisabled && !_forceEnableNavigationWrap\n \"\n [cdkListboxValue]=\"_validSelectedValues\"\n [cdkListboxUseActiveDescendant]=\"_shouldUseVirtualFocus()\"\n (cdkListboxValueChange)=\"_handleSelectionChange($event)\"\n (keydown.enter)=\"selected.emit($event)\"\n (keydown.space)=\"selected.emit($event)\"\n (mousedown)=\"_isConnectedToInput() && $event.preventDefault()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n>\n <ng-container *ngFor=\"let item of options; let last = last\">\n <ng-container *ngIf=\"_isSection(item)\">\n <li role=\"presentation\">\n <ul\n role=\"group\"\n class=\"sapphire-listbox__section\"\n [attr.aria-label]=\"item.ariaLabel\"\n >\n <li\n *ngFor=\"let option of item.children\"\n [cdkOption]=\"option.value\"\n [cdkOptionDisabled]=\"!!option.disabled\"\n [cdkOptionTypeaheadLabel]=\"option.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"option\"\n [selected]=\"isSelected(option)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || option.disabled) && selected.emit($event)\"\n ></li>\n </ul>\n </li>\n <li\n *ngIf=\"!last\"\n role=\"separator\"\n class=\"sapphire-listbox__separator\"\n ></li>\n </ng-container>\n <li\n *ngIf=\"_isOption(item)\"\n [cdkOption]=\"item.value\"\n [cdkOptionDisabled]=\"!!item.disabled\"\n [cdkOptionTypeaheadLabel]=\"item.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"item\"\n [selected]=\"isSelected(item)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || item.disabled) && selected.emit($event)\"\n ></li>\n </ng-container>\n</ul>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content{grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}:host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i1$3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "directive", type: CdkOptionScrollIssuePatch, selector: "[cdkOption]" }, { kind: "component", type: ListboxItemComponent, selector: "li[sp-listbox-item]", inputs: ["selected", "focused", "option"] }] });
|
|
4418
|
+
], queries: [{ propertyName: "itemsInContent", predicate: ListboxChild }], viewQueries: [{ propertyName: "cdkListbox", first: true, predicate: CdkListbox, descendants: true }, { propertyName: "cdkOptions", predicate: CdkOption, descendants: true }], exportAs: ["spListbox"], ngImport: i0, template: "<ul\n class=\"sapphire-listbox sapphire-listbox--selection\"\n cdkListbox\n [id]=\"id || ''\"\n [cdkListboxCompareWith]=\"\"\n [cdkListboxMultiple]=\"!!multiple\"\n [cdkListboxDisabled]=\"!!disabled\"\n [cdkListboxNavigationWrapDisabled]=\"\n navigationWrapDisabled && !_forceEnableNavigationWrap\n \"\n [cdkListboxValue]=\"_validSelectedValues\"\n [cdkListboxUseActiveDescendant]=\"_shouldUseVirtualFocus()\"\n (cdkListboxValueChange)=\"_handleSelectionChange($event)\"\n (keydown.enter)=\"selected.emit($event)\"\n (keydown.space)=\"selected.emit($event)\"\n (mousedown)=\"_isConnectedToInput() && $event.preventDefault()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n>\n <ng-container *ngFor=\"let item of options; let last = last\">\n <ng-container *ngIf=\"_isSection(item)\">\n <li role=\"presentation\">\n <ul\n role=\"group\"\n class=\"sapphire-listbox__section\"\n [attr.aria-label]=\"item.ariaLabel\"\n >\n <li\n *ngFor=\"let option of item.children\"\n [cdkOption]=\"option.value\"\n [cdkOptionDisabled]=\"!!option.disabled\"\n [cdkOptionTypeaheadLabel]=\"option.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"option\"\n [selected]=\"isSelected(option)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || option.disabled) && selected.emit($event)\"\n ></li>\n </ul>\n </li>\n <li\n *ngIf=\"!last\"\n role=\"separator\"\n class=\"sapphire-listbox__separator\"\n ></li>\n </ng-container>\n <li\n *ngIf=\"_isOption(item)\"\n [cdkOption]=\"item.value\"\n [cdkOptionDisabled]=\"!!item.disabled\"\n [cdkOptionTypeaheadLabel]=\"item.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"item\"\n [selected]=\"isSelected(item)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || item.disabled) && selected.emit($event)\"\n ></li>\n </ng-container>\n\n <!-- Empty state when no options available -->\n <li\n *ngIf=\"isEmpty && _getEmptyState()\"\n class=\"sapphire-listbox__item js-hover js-focus\"\n >\n <div class=\"sapphire-listbox__content sapphire-listbox__content--empty\">\n <div class=\"sapphire-listbox__primary-text\">\n <ng-container *ngIf=\"_isString(_getEmptyState())\">\n {{ _getEmptyState() }}\n </ng-container>\n <ng-container *ngIf=\"_getEmptyStateTemplate()\">\n <ng-container\n *ngTemplateOutlet=\"_getEmptyStateTemplate()\"\n ></ng-container>\n </ng-container>\n </div>\n </div>\n </li>\n</ul>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content:not(.sapphire-listbox__content--empty){grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__content--empty{grid-template-columns:1fr;justify-items:center;cursor:default}.sapphire-listbox__item:has(.sapphire-listbox__content--empty){cursor:default}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox>.sapphire-listbox__separator:first-child{display:none}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}:host{display:block}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1$3.CdkListbox, selector: "[cdkListbox]", inputs: ["id", "tabindex", "cdkListboxValue", "cdkListboxMultiple", "cdkListboxDisabled", "cdkListboxUseActiveDescendant", "cdkListboxOrientation", "cdkListboxCompareWith", "cdkListboxNavigationWrapDisabled", "cdkListboxNavigatesDisabledOptions"], outputs: ["cdkListboxValueChange"], exportAs: ["cdkListbox"] }, { kind: "directive", type: i1$3.CdkOption, selector: "[cdkOption]", inputs: ["id", "cdkOption", "cdkOptionTypeaheadLabel", "cdkOptionDisabled", "tabindex"], exportAs: ["cdkOption"] }, { kind: "directive", type: CdkOptionScrollIssuePatch, selector: "[cdkOption]" }, { kind: "component", type: ListboxItemComponent, selector: "li[sp-listbox-item]", inputs: ["selected", "focused", "option"] }] });
|
|
4347
4419
|
__decorate([
|
|
4348
4420
|
CoerceBoolean
|
|
4349
4421
|
], ListboxComponent.prototype, "disabled", void 0);
|
|
@@ -4369,8 +4441,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
4369
4441
|
], host: {
|
|
4370
4442
|
'[attr.aria-label]': 'null',
|
|
4371
4443
|
'[attr.aria-labelledby]': 'null',
|
|
4372
|
-
}, exportAs: 'spListbox', standalone: false, template: "<ul\n class=\"sapphire-listbox sapphire-listbox--selection\"\n cdkListbox\n [id]=\"id || ''\"\n [cdkListboxCompareWith]=\"\"\n [cdkListboxMultiple]=\"!!multiple\"\n [cdkListboxDisabled]=\"!!disabled\"\n [cdkListboxNavigationWrapDisabled]=\"\n navigationWrapDisabled && !_forceEnableNavigationWrap\n \"\n [cdkListboxValue]=\"_validSelectedValues\"\n [cdkListboxUseActiveDescendant]=\"_shouldUseVirtualFocus()\"\n (cdkListboxValueChange)=\"_handleSelectionChange($event)\"\n (keydown.enter)=\"selected.emit($event)\"\n (keydown.space)=\"selected.emit($event)\"\n (mousedown)=\"_isConnectedToInput() && $event.preventDefault()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n>\n <ng-container *ngFor=\"let item of options; let last = last\">\n <ng-container *ngIf=\"_isSection(item)\">\n <li role=\"presentation\">\n <ul\n role=\"group\"\n class=\"sapphire-listbox__section\"\n [attr.aria-label]=\"item.ariaLabel\"\n >\n <li\n *ngFor=\"let option of item.children\"\n [cdkOption]=\"option.value\"\n [cdkOptionDisabled]=\"!!option.disabled\"\n [cdkOptionTypeaheadLabel]=\"option.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"option\"\n [selected]=\"isSelected(option)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || option.disabled) && selected.emit($event)\"\n ></li>\n </ul>\n </li>\n <li\n *ngIf=\"!last\"\n role=\"separator\"\n class=\"sapphire-listbox__separator\"\n ></li>\n </ng-container>\n <li\n *ngIf=\"_isOption(item)\"\n [cdkOption]=\"item.value\"\n [cdkOptionDisabled]=\"!!item.disabled\"\n [cdkOptionTypeaheadLabel]=\"item.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"item\"\n [selected]=\"isSelected(item)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || item.disabled) && selected.emit($event)\"\n ></li>\n </ng-container>\n</ul>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content{grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}:host{display:block}\n"] }]
|
|
4373
|
-
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { selectedValues: [{
|
|
4444
|
+
}, exportAs: 'spListbox', standalone: false, template: "<ul\n class=\"sapphire-listbox sapphire-listbox--selection\"\n cdkListbox\n [id]=\"id || ''\"\n [cdkListboxCompareWith]=\"\"\n [cdkListboxMultiple]=\"!!multiple\"\n [cdkListboxDisabled]=\"!!disabled\"\n [cdkListboxNavigationWrapDisabled]=\"\n navigationWrapDisabled && !_forceEnableNavigationWrap\n \"\n [cdkListboxValue]=\"_validSelectedValues\"\n [cdkListboxUseActiveDescendant]=\"_shouldUseVirtualFocus()\"\n (cdkListboxValueChange)=\"_handleSelectionChange($event)\"\n (keydown.enter)=\"selected.emit($event)\"\n (keydown.space)=\"selected.emit($event)\"\n (mousedown)=\"_isConnectedToInput() && $event.preventDefault()\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledBy\"\n>\n <ng-container *ngFor=\"let item of options; let last = last\">\n <ng-container *ngIf=\"_isSection(item)\">\n <li role=\"presentation\">\n <ul\n role=\"group\"\n class=\"sapphire-listbox__section\"\n [attr.aria-label]=\"item.ariaLabel\"\n >\n <li\n *ngFor=\"let option of item.children\"\n [cdkOption]=\"option.value\"\n [cdkOptionDisabled]=\"!!option.disabled\"\n [cdkOptionTypeaheadLabel]=\"option.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"option\"\n [selected]=\"isSelected(option)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || option.disabled) && selected.emit($event)\"\n ></li>\n </ul>\n </li>\n <li\n *ngIf=\"!last\"\n role=\"separator\"\n class=\"sapphire-listbox__separator\"\n ></li>\n </ng-container>\n <li\n *ngIf=\"_isOption(item)\"\n [cdkOption]=\"item.value\"\n [cdkOptionDisabled]=\"!!item.disabled\"\n [cdkOptionTypeaheadLabel]=\"item.label\"\n #cdkOption=\"cdkOption\"\n sp-listbox-item\n [option]=\"item\"\n [selected]=\"isSelected(item)\"\n [focused]=\"cdkOption.isActive()\"\n (click)=\"!(disabled || item.disabled) && selected.emit($event)\"\n ></li>\n </ng-container>\n\n <!-- Empty state when no options available -->\n <li\n *ngIf=\"isEmpty && _getEmptyState()\"\n class=\"sapphire-listbox__item js-hover js-focus\"\n >\n <div class=\"sapphire-listbox__content sapphire-listbox__content--empty\">\n <div class=\"sapphire-listbox__primary-text\">\n <ng-container *ngIf=\"_isString(_getEmptyState())\">\n {{ _getEmptyState() }}\n </ng-container>\n <ng-container *ngIf=\"_getEmptyStateTemplate()\">\n <ng-container\n *ngTemplateOutlet=\"_getEmptyStateTemplate()\"\n ></ng-container>\n </ng-container>\n </div>\n </div>\n </li>\n</ul>\n", styles: [".sapphire-listbox{box-sizing:border-box;margin:0;position:relative;list-style:none;outline:none;font-family:var(--sapphire-semantic-font-name-default);--sapphire-listbox-spacing-outer: var(--sapphire-semantic-size-spacing-3xs);--sapphire-listbox-items-gap: var(--sapphire-semantic-size-spacing-4xs);padding:calc(var(--sapphire-listbox-spacing-outer) - var(--sapphire-listbox-items-gap)) 0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-listbox__item{display:flex;justify-content:space-between;align-items:center;padding:var(--sapphire-listbox-items-gap) var(--sapphire-listbox-spacing-outer);color:var(--sapphire-semantic-color-foreground-action-on-tertiary-default);outline:none;cursor:pointer;text-decoration:none;min-width:max-content}.sapphire-listbox__item--danger,.sapphire-listbox__item--danger .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-default)}.sapphire-listbox__content{width:100%;max-width:calc(100vw - 2 * var(--sapphire-semantic-size-icon-sm));display:grid;grid-auto-flow:column;align-items:center;gap:var(--sapphire-semantic-size-spacing-xs);grid-template-columns:[left-icon] auto [text-content] 1fr [right-icon] auto;padding:calc(var(--sapphire-semantic-size-spacing-sm) - var(--sapphire-semantic-size-spacing-4xs)) var(--sapphire-semantic-size-spacing-sm);border-radius:var(--sapphire-semantic-size-radius-sm);transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:var(--sapphire-semantic-transitions-fade)}.sapphire-listbox--selection .sapphire-listbox__content:not(.sapphire-listbox__content--empty){grid-template-columns:[left-icon] var(--sapphire-semantic-size-icon-sm) [text-content] 1fr [right-icon] auto}.sapphire-listbox__content--empty{grid-template-columns:1fr;justify-items:center;cursor:default}.sapphire-listbox__item:has(.sapphire-listbox__content--empty){cursor:default}.sapphire-listbox__icon{line-height:0;align-self:start;padding-top:calc((var(--sapphire-semantic-size-font-body-sm) * var(--sapphire-semantic-size-line-height-md) - var(--sapphire-semantic-size-icon-sm)) / 2)}.sapphire-listbox__icon:last-child{grid-column:right-icon/span 1}.sapphire-listbox__icon:first-child{grid-column:left-icon/span 1}.sapphire-listbox__text-container{grid-column:text-content/span 1;line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-listbox:not(.sapphire-listbox--selection) .sapphire-listbox__text-container:first-child{grid-column:span 2}.sapphire-listbox__primary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-listbox__secondary-text{font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-listbox__item.is-disabled{opacity:var(--sapphire-semantic-opacity-disabled);cursor:not-allowed}.sapphire-listbox__section{padding:0;list-style:none}.sapphire-listbox__section-header{font-size:var(--sapphire-semantic-size-font-body-xs);color:var(--sapphire-semantic-color-foreground-primary);font-weight:var(--sapphire-semantic-font-weight-default-medium);padding:calc(var(--sapphire-semantic-size-spacing-md) - var(--sapphire-listbox-items-gap)) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer)) var(--sapphire-semantic-size-spacing-3xs) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox__separator{height:var(--sapphire-semantic-size-border-sm);background:var(--sapphire-semantic-color-border-secondary);margin:var(--sapphire-listbox-items-gap) calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-listbox-spacing-outer))}.sapphire-listbox>.sapphire-listbox__separator:first-child{display:none}.sapphire-listbox__item:not(.is-disabled).is-focus .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-focus):focus-visible .sapphire-listbox__content{box-shadow:0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-listbox__item:not(.is-disabled).is-hover:not(.is-active) .sapphire-listbox__content,.sapphire-listbox__item:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-hover)}.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.is-active).is-hover .sapphire-listbox__secondary-text,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled):not(.js-hover):not(.is-active):hover .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-hover)}.sapphire-listbox__item:not(.is-disabled).is-active .sapphire-listbox__content{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-active);background:var(--sapphire-semantic-color-background-action-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content{background:var(--sapphire-semantic-color-background-action-danger-tertiary-active)}.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__content,.sapphire-listbox__item--danger:not(.is-disabled).is-active .sapphire-listbox__secondary-text{color:var(--sapphire-semantic-color-foreground-action-on-danger-tertiary-active)}:host{display:block}\n"] }]
|
|
4445
|
+
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: TranslateService }]; }, propDecorators: { selectedValues: [{
|
|
4374
4446
|
type: Input
|
|
4375
4447
|
}], selectedValuesChange: [{
|
|
4376
4448
|
type: Output
|
|
@@ -4391,6 +4463,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
4391
4463
|
args: ['aria-labelledby']
|
|
4392
4464
|
}], id: [{
|
|
4393
4465
|
type: Input
|
|
4466
|
+
}], emptyState: [{
|
|
4467
|
+
type: Input
|
|
4394
4468
|
}], selected: [{
|
|
4395
4469
|
type: Output
|
|
4396
4470
|
}], itemsInContent: [{
|
|
@@ -4844,7 +4918,7 @@ class SelectComponentBase {
|
|
|
4844
4918
|
}
|
|
4845
4919
|
}
|
|
4846
4920
|
SelectComponentBase.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SelectComponentBase, deps: [{ token: SelectValueHolder }], target: i0.ɵɵFactoryTarget.Directive });
|
|
4847
|
-
SelectComponentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: SelectComponentBase, inputs: { disabled: "disabled", id: "id", name: "name", autocomplete: "autocomplete", placeholder: "placeholder", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"] }, outputs: { opened: "opened", closed: "closed", selected: "selected" }, queries: [{ propertyName: "selectionText", first: true, predicate: SelectionTextDirective, descendants: true }, { propertyName: "options", predicate: OptionComponent, descendants: true }, { propertyName: "listboxChildren", predicate: ListboxChild }], ngImport: i0 });
|
|
4921
|
+
SelectComponentBase.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: SelectComponentBase, inputs: { disabled: "disabled", id: "id", name: "name", autocomplete: "autocomplete", placeholder: "placeholder", ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], emptyState: "emptyState" }, outputs: { opened: "opened", closed: "closed", selected: "selected" }, queries: [{ propertyName: "selectionText", first: true, predicate: SelectionTextDirective, descendants: true }, { propertyName: "options", predicate: OptionComponent, descendants: true }, { propertyName: "listboxChildren", predicate: ListboxChild }], ngImport: i0 });
|
|
4848
4922
|
__decorate([
|
|
4849
4923
|
CoerceBoolean
|
|
4850
4924
|
], SelectComponentBase.prototype, "disabled", void 0);
|
|
@@ -4884,6 +4958,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
4884
4958
|
}], selectionText: [{
|
|
4885
4959
|
type: ContentChild,
|
|
4886
4960
|
args: [SelectionTextDirective]
|
|
4961
|
+
}], emptyState: [{
|
|
4962
|
+
type: Input
|
|
4887
4963
|
}] } });
|
|
4888
4964
|
|
|
4889
4965
|
/**
|
|
@@ -5181,7 +5257,7 @@ class SelectComponent extends SelectComponentBase {
|
|
|
5181
5257
|
}));
|
|
5182
5258
|
this.filteredChildren$ = this.multiple
|
|
5183
5259
|
? // Grouping selected options
|
|
5184
|
-
combineLatest(filterResult$, this.valueHolder.valueChange.pipe(startWith(empty()))).pipe(map(([{ filteredChildren }]) => {
|
|
5260
|
+
combineLatest(filterResult$, this.valueHolder.valueChange.pipe(startWith(empty$7()))).pipe(map(([{ filteredChildren }]) => {
|
|
5185
5261
|
if (this.listboxValue.length === 0) {
|
|
5186
5262
|
return filteredChildren;
|
|
5187
5263
|
}
|
|
@@ -5367,7 +5443,7 @@ SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
|
|
|
5367
5443
|
provide: FieldControl,
|
|
5368
5444
|
useExisting: forwardRef(() => SelectComponent),
|
|
5369
5445
|
},
|
|
5370
|
-
], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true }, { propertyName: "triggerElementRef", first: true, predicate: ["triggerElementRef"], descendants: true, read: ElementRef }, { propertyName: "listbox", first: true, predicate: ListboxComponent, descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }], exportAs: ["spSelect"], usesInheritance: true, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: "<sp-hidden-select></sp-hidden-select>\n<div\n role=\"button\"\n aria-haspopup=\"listbox\"\n class=\"sapphire-select__button\"\n [spPopoverTriggerFor]=\"popover\"\n [spPopoverTriggerDisabled]=\"disabled\"\n spPopoverTriggerOpenOnPressStart\n spPopoverTriggerCloseOnScroll\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (focus)=\"_onFocus()\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n [spPopoverNonModal]=\"searchable\"\n spPopoverDisablePushInsideViewport=\"true\"\n [id]=\"id\"\n [tabindex]=\"-1\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"_getAriaLabelledBy()\"\n [attr.aria-describedby]=\"_field?.error?.id || _field?.note?.id\"\n [attr.aria-invalid]=\"_field?.hasError(this) ? true : null\"\n>\n <div class=\"sapphire-select__value\" [id]=\"_valueContainerId\">\n <input\n *ngIf=\"searchable\"\n #searchInput\n tabindex=\"-1\"\n role=\"combobox\"\n class=\"sapphire-select__search-input\"\n [spListboxInput]=\"listbox\"\n [spVisuallyHidden]=\"!_isInputVisible()\"\n [attr.data-hidden]=\"!_isInputVisible()\"\n [placeholder]=\"placeholder || ''\"\n (keydown)=\"_onInputKeydown($event)\"\n (beforeinput)=\"open()\"\n [value]=\"_searchableSelectDirective?.searchValue\"\n (input)=\"_onSearchInput($event)\"\n />\n <ng-container *ngIf=\"!searchable || !_isInputVisible()\">\n <div\n *ngIf=\"selectedOptions.length === 0\"\n class=\"sapphire-select__placeholder\"\n >\n {{ placeholder }}\n </div>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"sapphire-select__icon-container\">\n <sp-icon name=\"chevronDown\"></sp-icon>\n </div>\n</div>\n<ng-template #popover>\n <sp-popover\n [style.display]=\"\n (filteredChildren$ | async)?.length === 0 ? 'none'
|
|
5446
|
+
], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true }, { propertyName: "triggerElementRef", first: true, predicate: ["triggerElementRef"], descendants: true, read: ElementRef }, { propertyName: "listbox", first: true, predicate: ListboxComponent, descendants: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, read: ElementRef }], exportAs: ["spSelect"], usesInheritance: true, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: "<sp-hidden-select></sp-hidden-select>\n<div\n role=\"button\"\n aria-haspopup=\"listbox\"\n class=\"sapphire-select__button\"\n [spPopoverTriggerFor]=\"popover\"\n [spPopoverTriggerDisabled]=\"disabled\"\n spPopoverTriggerOpenOnPressStart\n spPopoverTriggerCloseOnScroll\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (focus)=\"_onFocus()\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n [spPopoverNonModal]=\"searchable\"\n spPopoverDisablePushInsideViewport=\"true\"\n [id]=\"id\"\n [tabindex]=\"-1\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"_getAriaLabelledBy()\"\n [attr.aria-describedby]=\"_field?.error?.id || _field?.note?.id\"\n [attr.aria-invalid]=\"_field?.hasError(this) ? true : null\"\n>\n <div class=\"sapphire-select__value\" [id]=\"_valueContainerId\">\n <input\n *ngIf=\"searchable\"\n #searchInput\n tabindex=\"-1\"\n role=\"combobox\"\n class=\"sapphire-select__search-input\"\n [spListboxInput]=\"listbox\"\n [spVisuallyHidden]=\"!_isInputVisible()\"\n [attr.data-hidden]=\"!_isInputVisible()\"\n [placeholder]=\"placeholder || ''\"\n (keydown)=\"_onInputKeydown($event)\"\n (beforeinput)=\"open()\"\n [value]=\"_searchableSelectDirective?.searchValue\"\n (input)=\"_onSearchInput($event)\"\n />\n <ng-container *ngIf=\"!searchable || !_isInputVisible()\">\n <div\n *ngIf=\"selectedOptions.length === 0\"\n class=\"sapphire-select__placeholder\"\n >\n {{ placeholder }}\n </div>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"sapphire-select__icon-container\">\n <sp-icon name=\"chevronDown\"></sp-icon>\n </div>\n</div>\n<ng-template #popover>\n <sp-popover\n [style.display]=\"\n (filteredChildren$ | async)?.length === 0 && !listbox?._getEmptyState()\n ? 'none'\n : undefined\n \"\n noPadding\n [trapFocus]=\"!searchable\"\n noMaxWidth\n [style.min-width]=\"triggerElementRef.offsetWidth + 'px'\"\n >\n <sp-listbox\n [spListboxItems]=\"(filteredChildren$ | async) || undefined\"\n navigationWrapDisabled\n [multiple]=\"multiple\"\n [(selectedValues)]=\"listboxValue\"\n (selectedValuesChange)=\"_searchableSelectDirective?.setSearchValue('')\"\n (selected)=\"_handleSelected()\"\n [emptyState]=\"emptyState\"\n ></sp-listbox>\n </sp-popover>\n</ng-template>\n", styles: [".sapphire-select{position:relative;display:block;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-select__button{display:flex;align-items:center;height:var(--sapphire-semantic-size-height-control-lg);box-sizing:border-box;cursor:pointer;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md) 0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);border:none;background:var(--sapphire-semantic-color-background-field);width:100%;outline:0;text-align:left;color:inherit;font-family:inherit;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);border-radius:var(--sapphire-semantic-size-radius-md);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-select--md .sapphire-select__button{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md);gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-select__value{flex:1 0 0;min-width:0;font-size:var(--sapphire-semantic-size-font-control-lg);width:100%;font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sapphire-select--md .sapphire-select__value{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sapphire-semantic-color-foreground-secondary);pointer-events:none}.sapphire-select__icon-container{line-height:0;width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-select--md .sapphire-select__icon-container{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-select__prefix{display:inherit;font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select:not(.sapphire-select--md) .sapphire-select__button:has(.sapphire-select__prefix){padding-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-select--md .sapphire-select__prefix{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__search-input:not([data-hidden=true]){all:inherit}.sapphire-select__search-input::placeholder{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select__native-select{position:absolute;inset:0;opacity:.01;width:100%;z-index:1}.sapphire-select--error:not(.is-disabled) .sapphire-select__button{box-shadow:inset 0 0 0 1px var(--sapphire-semantic-color-border-negative-default)}.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled).is-hover .sapphire-select__button,.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled):not(.js-hover):hover .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-select:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-select--error:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-border-negative-default)}.sapphire-select.is-disabled .sapphire-select__button{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: ListboxComponent, selector: "sp-listbox", inputs: ["selectedValues", "spListboxItems", "disabled", "multiple", "navigationWrapDisabled", "aria-label", "aria-labelledby", "id", "emptyState"], outputs: ["selectedValuesChange", "selected"], exportAs: ["spListbox"] }, { kind: "directive", type: ListboxInputDirective, selector: "input[spListboxInput]", inputs: ["spListboxInput"] }, { kind: "component", type: PopoverComponent, selector: "sp-popover", inputs: ["noPadding", "noMaxWidth", "noAutoFocus", "trapFocus"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[spPopoverTriggerFor]", inputs: ["spPopoverPlacement", "spPopoverTriggerFor", "spPopoverNonModal", "spPopoverTriggerOpenOnPressStart", "spPopoverTriggerCloseOnScroll", "spPopoverTriggerDisabled", "spPopoverDisablePushInsideViewport"], outputs: ["spPopoverTriggerOpened", "spPopoverTriggerClosed"], exportAs: ["spPopoverTrigger"] }, { kind: "directive", type: i3.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "directive", type: VisuallyHiddenDirective, selector: "[spVisuallyHidden]", inputs: ["spVisuallyHidden"] }, { kind: "component", type: HiddenSelectComponent, selector: "sp-hidden-select" }, { kind: "pipe", type: i2.AsyncPipe, name: "async" }] });
|
|
5371
5447
|
__decorate([
|
|
5372
5448
|
AutoId()
|
|
5373
5449
|
], SelectComponent.prototype, "_valueContainerId", void 0);
|
|
@@ -5397,7 +5473,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
5397
5473
|
'[attr.aria-label]': 'null',
|
|
5398
5474
|
'[attr.aria-labelledby]': 'null',
|
|
5399
5475
|
'[attr.placeholder]': 'null',
|
|
5400
|
-
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, template: "<sp-hidden-select></sp-hidden-select>\n<div\n role=\"button\"\n aria-haspopup=\"listbox\"\n class=\"sapphire-select__button\"\n [spPopoverTriggerFor]=\"popover\"\n [spPopoverTriggerDisabled]=\"disabled\"\n spPopoverTriggerOpenOnPressStart\n spPopoverTriggerCloseOnScroll\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (focus)=\"_onFocus()\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n [spPopoverNonModal]=\"searchable\"\n spPopoverDisablePushInsideViewport=\"true\"\n [id]=\"id\"\n [tabindex]=\"-1\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"_getAriaLabelledBy()\"\n [attr.aria-describedby]=\"_field?.error?.id || _field?.note?.id\"\n [attr.aria-invalid]=\"_field?.hasError(this) ? true : null\"\n>\n <div class=\"sapphire-select__value\" [id]=\"_valueContainerId\">\n <input\n *ngIf=\"searchable\"\n #searchInput\n tabindex=\"-1\"\n role=\"combobox\"\n class=\"sapphire-select__search-input\"\n [spListboxInput]=\"listbox\"\n [spVisuallyHidden]=\"!_isInputVisible()\"\n [attr.data-hidden]=\"!_isInputVisible()\"\n [placeholder]=\"placeholder || ''\"\n (keydown)=\"_onInputKeydown($event)\"\n (beforeinput)=\"open()\"\n [value]=\"_searchableSelectDirective?.searchValue\"\n (input)=\"_onSearchInput($event)\"\n />\n <ng-container *ngIf=\"!searchable || !_isInputVisible()\">\n <div\n *ngIf=\"selectedOptions.length === 0\"\n class=\"sapphire-select__placeholder\"\n >\n {{ placeholder }}\n </div>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"sapphire-select__icon-container\">\n <sp-icon name=\"chevronDown\"></sp-icon>\n </div>\n</div>\n<ng-template #popover>\n <sp-popover\n [style.display]=\"\n (filteredChildren$ | async)?.length === 0 ? 'none'
|
|
5476
|
+
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, template: "<sp-hidden-select></sp-hidden-select>\n<div\n role=\"button\"\n aria-haspopup=\"listbox\"\n class=\"sapphire-select__button\"\n [spPopoverTriggerFor]=\"popover\"\n [spPopoverTriggerDisabled]=\"disabled\"\n spPopoverTriggerOpenOnPressStart\n spPopoverTriggerCloseOnScroll\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (focus)=\"_onFocus()\"\n cdkMonitorSubtreeFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n [spPopoverNonModal]=\"searchable\"\n spPopoverDisablePushInsideViewport=\"true\"\n [id]=\"id\"\n [tabindex]=\"-1\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"_getAriaLabelledBy()\"\n [attr.aria-describedby]=\"_field?.error?.id || _field?.note?.id\"\n [attr.aria-invalid]=\"_field?.hasError(this) ? true : null\"\n>\n <div class=\"sapphire-select__value\" [id]=\"_valueContainerId\">\n <input\n *ngIf=\"searchable\"\n #searchInput\n tabindex=\"-1\"\n role=\"combobox\"\n class=\"sapphire-select__search-input\"\n [spListboxInput]=\"listbox\"\n [spVisuallyHidden]=\"!_isInputVisible()\"\n [attr.data-hidden]=\"!_isInputVisible()\"\n [placeholder]=\"placeholder || ''\"\n (keydown)=\"_onInputKeydown($event)\"\n (beforeinput)=\"open()\"\n [value]=\"_searchableSelectDirective?.searchValue\"\n (input)=\"_onSearchInput($event)\"\n />\n <ng-container *ngIf=\"!searchable || !_isInputVisible()\">\n <div\n *ngIf=\"selectedOptions.length === 0\"\n class=\"sapphire-select__placeholder\"\n >\n {{ placeholder }}\n </div>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n </ng-container>\n </div>\n <div class=\"sapphire-select__icon-container\">\n <sp-icon name=\"chevronDown\"></sp-icon>\n </div>\n</div>\n<ng-template #popover>\n <sp-popover\n [style.display]=\"\n (filteredChildren$ | async)?.length === 0 && !listbox?._getEmptyState()\n ? 'none'\n : undefined\n \"\n noPadding\n [trapFocus]=\"!searchable\"\n noMaxWidth\n [style.min-width]=\"triggerElementRef.offsetWidth + 'px'\"\n >\n <sp-listbox\n [spListboxItems]=\"(filteredChildren$ | async) || undefined\"\n navigationWrapDisabled\n [multiple]=\"multiple\"\n [(selectedValues)]=\"listboxValue\"\n (selectedValuesChange)=\"_searchableSelectDirective?.setSearchValue('')\"\n (selected)=\"_handleSelected()\"\n [emptyState]=\"emptyState\"\n ></sp-listbox>\n </sp-popover>\n</ng-template>\n", styles: [".sapphire-select{position:relative;display:block;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-select__button{display:flex;align-items:center;height:var(--sapphire-semantic-size-height-control-lg);box-sizing:border-box;cursor:pointer;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md) 0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);border:none;background:var(--sapphire-semantic-color-background-field);width:100%;outline:0;text-align:left;color:inherit;font-family:inherit;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);border-radius:var(--sapphire-semantic-size-radius-md);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-select--md .sapphire-select__button{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md);gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-select__value{flex:1 0 0;min-width:0;font-size:var(--sapphire-semantic-size-font-control-lg);width:100%;font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sapphire-select--md .sapphire-select__value{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sapphire-semantic-color-foreground-secondary);pointer-events:none}.sapphire-select__icon-container{line-height:0;width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-select--md .sapphire-select__icon-container{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-select__prefix{display:inherit;font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select:not(.sapphire-select--md) .sapphire-select__button:has(.sapphire-select__prefix){padding-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-select--md .sapphire-select__prefix{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__search-input:not([data-hidden=true]){all:inherit}.sapphire-select__search-input::placeholder{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select__native-select{position:absolute;inset:0;opacity:.01;width:100%;z-index:1}.sapphire-select--error:not(.is-disabled) .sapphire-select__button{box-shadow:inset 0 0 0 1px var(--sapphire-semantic-color-border-negative-default)}.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled).is-hover .sapphire-select__button,.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled):not(.js-hover):hover .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-select:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-select--error:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-border-negative-default)}.sapphire-select.is-disabled .sapphire-select__button{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}\n"] }]
|
|
5401
5477
|
}], ctorParameters: function () {
|
|
5402
5478
|
return [{ type: SelectValueHolder }, { type: IconRegistry }, { type: i3.FocusMonitor }, { type: i3.InputModalityDetector }, { type: FieldComponent, decorators: [{
|
|
5403
5479
|
type: Optional
|
|
@@ -5502,7 +5578,7 @@ SelectButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
5502
5578
|
useExisting: forwardRef(() => SelectButtonComponent),
|
|
5503
5579
|
},
|
|
5504
5580
|
ViewEncapsulationProvider,
|
|
5505
|
-
], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true }, { propertyName: "triggerElementRef", first: true, predicate: ["triggerElementRef"], descendants: true, read: ElementRef }, { propertyName: "listbox", first: true, predicate: ListboxComponent, descendants: true }], exportAs: ["spSelectButton"], usesInheritance: true, ngImport: i0, template: "<div style=\"position: relative\">\n <sp-hidden-select></sp-hidden-select>\n <button\n sp-button\n [variant]=\"variant\"\n [size]=\"size\"\n iconAlign=\"right\"\n [spPopoverTriggerFor]=\"popover\"\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n cdkMonitorElementFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n aria-haspopup=\"listbox\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [disabled]=\"disabled\"\n >\n <span *ngIf=\"selectedOptions.length === 0\">\n {{ placeholder }}\n </span>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n <sp-icon spButtonIcon name=\"chevronDown\"></sp-icon>\n </button>\n <ng-template #popover>\n <sp-popover noPadding>\n <sp-listbox\n [spListboxItems]=\"listboxChildren\"\n navigationWrapDisabled\n [multiple]=\"multiple\"\n [(selectedValues)]=\"listboxValue\"\n (selected)=\"_handleSelected()\"\n >\n </sp-listbox>\n </sp-popover>\n </ng-template>\n</div>\n", styles: [".sapphire-select{position:relative;display:block;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-select__button{display:flex;align-items:center;height:var(--sapphire-semantic-size-height-control-lg);box-sizing:border-box;cursor:pointer;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md) 0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);border:none;background:var(--sapphire-semantic-color-background-field);width:100%;outline:0;text-align:left;color:inherit;font-family:inherit;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);border-radius:var(--sapphire-semantic-size-radius-md);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-select--md .sapphire-select__button{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md);gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-select__value{flex:1 0 0;min-width:0;font-size:var(--sapphire-semantic-size-font-control-lg);width:100%;font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sapphire-select--md .sapphire-select__value{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sapphire-semantic-color-foreground-secondary);pointer-events:none}.sapphire-select__icon-container{line-height:0;width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-select--md .sapphire-select__icon-container{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-select__prefix{display:inherit;font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select:not(.sapphire-select--md) .sapphire-select__button:has(.sapphire-select__prefix){padding-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-select--md .sapphire-select__prefix{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__search-input:not([data-hidden=true]){all:inherit}.sapphire-select__search-input::placeholder{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select__native-select{position:absolute;inset:0;opacity:.01;width:100%;z-index:1}.sapphire-select--error:not(.is-disabled) .sapphire-select__button{box-shadow:inset 0 0 0 1px var(--sapphire-semantic-color-border-negative-default)}.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled).is-hover .sapphire-select__button,.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled):not(.js-hover):hover .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-select:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-select--error:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-border-negative-default)}.sapphire-select.is-disabled .sapphire-select__button{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: ListboxComponent, selector: "sp-listbox", inputs: ["selectedValues", "spListboxItems", "disabled", "multiple", "navigationWrapDisabled", "aria-label", "aria-labelledby", "id"], outputs: ["selectedValuesChange", "selected"], exportAs: ["spListbox"] }, { kind: "component", type: PopoverComponent, selector: "sp-popover", inputs: ["noPadding", "noMaxWidth", "noAutoFocus", "trapFocus"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[spPopoverTriggerFor]", inputs: ["spPopoverPlacement", "spPopoverTriggerFor", "spPopoverNonModal", "spPopoverTriggerOpenOnPressStart", "spPopoverTriggerCloseOnScroll", "spPopoverTriggerDisabled", "spPopoverDisablePushInsideViewport"], outputs: ["spPopoverTriggerOpened", "spPopoverTriggerClosed"], exportAs: ["spPopoverTrigger"] }, { kind: "directive", type: i3.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: ButtonComponent, selector: "button[sp-button], a[sp-button]", inputs: ["variant", "size", "disabled", "iconAlign", "type", "tabindex"] }, { kind: "directive", type: ButtonIconDirective, selector: "[spButtonIcon]" }, { kind: "component", type: HiddenSelectComponent, selector: "sp-hidden-select" }] });
|
|
5581
|
+
], viewQueries: [{ propertyName: "triggerRef", first: true, predicate: ["triggerRef"], descendants: true }, { propertyName: "triggerElementRef", first: true, predicate: ["triggerElementRef"], descendants: true, read: ElementRef }, { propertyName: "listbox", first: true, predicate: ListboxComponent, descendants: true }], exportAs: ["spSelectButton"], usesInheritance: true, ngImport: i0, template: "<div style=\"position: relative\">\n <sp-hidden-select></sp-hidden-select>\n <button\n sp-button\n [variant]=\"variant\"\n [size]=\"size\"\n iconAlign=\"right\"\n [spPopoverTriggerFor]=\"popover\"\n spPopoverPlacement=\"bottom start\"\n #triggerElementRef\n #triggerRef=\"spPopoverTrigger\"\n (keydown)=\"handleKeyDown($event)\"\n (spPopoverTriggerOpened)=\"_onOpen()\"\n (spPopoverTriggerClosed)=\"_onClose()\"\n cdkMonitorElementFocus\n (cdkFocusChange)=\"_onFocusChange($event)\"\n aria-haspopup=\"listbox\"\n [attr.aria-label]=\"ariaLabel\"\n [attr.aria-labelledby]=\"ariaLabelledby\"\n [disabled]=\"disabled\"\n >\n <span *ngIf=\"selectedOptions.length === 0\">\n {{ placeholder }}\n </span>\n <ng-container *ngIf=\"selectedOptions.length > 0\">\n <ng-container *ngIf=\"!selectionText\">{{\n getSelectionText()\n }}</ng-container>\n <ng-content select=\"sp-selection-text\"></ng-content>\n </ng-container>\n <sp-icon spButtonIcon name=\"chevronDown\"></sp-icon>\n </button>\n <ng-template #popover>\n <sp-popover noPadding>\n <sp-listbox\n [spListboxItems]=\"listboxChildren\"\n navigationWrapDisabled\n [multiple]=\"multiple\"\n [(selectedValues)]=\"listboxValue\"\n (selected)=\"_handleSelected()\"\n >\n </sp-listbox>\n </sp-popover>\n </ng-template>\n</div>\n", styles: [".sapphire-select{position:relative;display:block;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-select__button{display:flex;align-items:center;height:var(--sapphire-semantic-size-height-control-lg);box-sizing:border-box;cursor:pointer;padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md) 0 var(--sapphire-semantic-size-spacing-control-horizontal-lg);border:none;background:var(--sapphire-semantic-color-background-field);width:100%;outline:0;text-align:left;color:inherit;font-family:inherit;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-default);border-radius:var(--sapphire-semantic-size-radius-md);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-select--md .sapphire-select__button{border-radius:var(--sapphire-semantic-size-radius-sm);height:var(--sapphire-semantic-size-height-control-md);padding:0 var(--sapphire-semantic-size-spacing-control-horizontal-md);gap:var(--sapphire-semantic-size-spacing-xs)}.sapphire-select__value{flex:1 0 0;min-width:0;font-size:var(--sapphire-semantic-size-font-control-lg);width:100%;font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sapphire-select--md .sapphire-select__value{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__placeholder{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--sapphire-semantic-color-foreground-secondary);pointer-events:none}.sapphire-select__icon-container{line-height:0;width:var(--sapphire-semantic-size-icon-md);height:var(--sapphire-semantic-size-icon-md)}.sapphire-select--md .sapphire-select__icon-container{width:var(--sapphire-semantic-size-icon-sm);height:var(--sapphire-semantic-size-icon-sm)}.sapphire-select__prefix{display:inherit;font-size:var(--sapphire-semantic-size-font-control-lg);color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select:not(.sapphire-select--md) .sapphire-select__button:has(.sapphire-select__prefix){padding-left:var(--sapphire-semantic-size-spacing-control-horizontal-md)}.sapphire-select--md .sapphire-select__prefix{font-size:var(--sapphire-semantic-size-font-control-md)}.sapphire-select__search-input:not([data-hidden=true]){all:inherit}.sapphire-select__search-input::placeholder{color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-select__native-select{position:absolute;inset:0;opacity:.01;width:100%;z-index:1}.sapphire-select--error:not(.is-disabled) .sapphire-select__button{box-shadow:inset 0 0 0 1px var(--sapphire-semantic-color-border-negative-default)}.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled).is-hover .sapphire-select__button,.sapphire-select:not(.sapphire-select--error):not(.is-focus):not(.is-disabled):not(.js-hover):hover .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-border-sm) var(--sapphire-semantic-color-border-field-hover)}.sapphire-select:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring)}.sapphire-select--error:not(.is-disabled).is-focus .sapphire-select__button{box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-border-negative-default)}.sapphire-select.is-disabled .sapphire-select__button{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: ListboxComponent, selector: "sp-listbox", inputs: ["selectedValues", "spListboxItems", "disabled", "multiple", "navigationWrapDisabled", "aria-label", "aria-labelledby", "id", "emptyState"], outputs: ["selectedValuesChange", "selected"], exportAs: ["spListbox"] }, { kind: "component", type: PopoverComponent, selector: "sp-popover", inputs: ["noPadding", "noMaxWidth", "noAutoFocus", "trapFocus"] }, { kind: "directive", type: PopoverTriggerDirective, selector: "[spPopoverTriggerFor]", inputs: ["spPopoverPlacement", "spPopoverTriggerFor", "spPopoverNonModal", "spPopoverTriggerOpenOnPressStart", "spPopoverTriggerCloseOnScroll", "spPopoverTriggerDisabled", "spPopoverDisablePushInsideViewport"], outputs: ["spPopoverTriggerOpened", "spPopoverTriggerClosed"], exportAs: ["spPopoverTrigger"] }, { kind: "directive", type: i3.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: ButtonComponent, selector: "button[sp-button], a[sp-button]", inputs: ["variant", "size", "disabled", "iconAlign", "type", "tabindex"] }, { kind: "directive", type: ButtonIconDirective, selector: "[spButtonIcon]" }, { kind: "component", type: HiddenSelectComponent, selector: "sp-hidden-select" }] });
|
|
5506
5582
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SelectButtonComponent, decorators: [{
|
|
5507
5583
|
type: Component,
|
|
5508
5584
|
args: [{ selector: 'sp-select-button', exportAs: 'spSelectButton', providers: [
|
|
@@ -7100,7 +7176,7 @@ TableComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version
|
|
|
7100
7176
|
<ng-container>
|
|
7101
7177
|
<ng-content select="table"></ng-content>
|
|
7102
7178
|
</ng-container>
|
|
7103
|
-
`, isInline: true, styles: [".sapphire-table{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;justify-content:space-between;background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table--overflow{overflow:auto}.sapphire-table__table{border-collapse:collapse;border-spacing:0;width:100%;table-layout:auto}.sapphire-table__table--fixed-layout{table-layout:fixed}.sapphire-table-sortedIcon,.sapphire-table-sortableIcon{display:inline-flex;visibility:hidden;vertical-align:top}.sapphire-table__head{top:0;z-index:2;line-height:var(--sapphire-semantic-size-line-height-md);--sapphire-table-row-bg: var(--sapphire-semantic-color-background-surface)}.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-md);line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-table__head--sticky{position:sticky}.sapphire-table__cell--alignLeft{text-align:left}.sapphire-table__cell--alignCenter{text-align:center}.sapphire-table__cell--alignRight{text-align:end}.sapphire-table__headCell{color:var(--sapphire-semantic-color-foreground-primary);box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-medium);line-height:var(--sapphire-semantic-size-line-height-md);vertical-align:top}.sapphire-table__headCell_container{padding:var(--sapphire-semantic-size-spacing-xs) var(--sapphire-table-cell-spacing-h);display:inline-flex;align-items:center;box-sizing:border-box;width:100%}.sapphire-table__cell--alignRight .sapphire-table__headCell_container{justify-content:flex-end}.sapphire-table__cell--alignLeft .sapphire-table__headCell_container{justify-content:flex-start}.sapphire-table__cell--alignCenter .sapphire-table__headCell_container{justify-content:center}.sapphire-table__row,.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{outline:none;position:relative;z-index:1}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container:after,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container:after,.sapphire-table__cell.is-focus:after,.sapphire-table__cell:not(.js-focus):focus-visible:after,.sapphire-table__selectionCell.is-focus:after,.sapphire-table__selectionCell:not(.js-focus):focus-visible:after,.sapphire-table__row.is-focus:after,.sapphire-table__row:not(.js-focus):focus-visible:after,.sapphire-table__row-expanded-view.is-focus:after,.sapphire-table__row-expanded-view:not(.js-focus):focus-visible:after{content:\"\";outline:none;border-radius:var(--sapphire-semantic-size-radius-sm);box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);position:absolute;inset:0;z-index:3}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container{border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable.is-hover .sapphire-table__headCell_container,.sapphire-table__headCell.sapphire-table__headCell--sortable:not(.js-hover):hover .sapphire-table__headCell_container{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable{cursor:pointer}.sapphire-table__headCell--sortable:not(sapphire-table__headCell--sorted):hover .sapphire-table-sortableIcon{visibility:visible}.sapphire-table__headCell--sorted .sapphire-table-sortedIcon{visibility:visible;padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell .sapphire-table-sortedIcon,.sapphire-table__headCell .sapphire-table-sortableIcon{padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__cell--alignRight .sapphire-table-sortedIcon,.sapphire-table__cell--alignRight .sapphire-table-sortableIcon{padding-right:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell__text,.sapphire-table__headCell__icon{vertical-align:top;display:inline-block}.sapphire-table__body{position:relative;overflow:auto}.sapphire-table__cell{box-sizing:border-box;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow-wrap:break-word;align-content:center;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h)}.sapphire-table__cell-contents{display:block;width:100%;overflow-wrap:break-word}.sapphire-table__cell--ellipsed,.sapphire-table__headCell_content--ellipsed,.sapphire-table__cell--ellipsed .sapphire-table__cell-contents{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sapphire-table__table{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-sm)}.sapphire-table__table--spacing-sm{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-xs)}.sapphire-table__table--spacing-lg{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-md);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-md)}.sapphire-table__table--spacing-xl{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-lg);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-lg)}.sapphire-table__selectionCell{line-height:0;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h);box-sizing:content-box}.sapphire-table__head .sapphire-table__selectionCell{padding:var(--sapphire-semantic-size-spacing-2xs) var(--sapphire-table-cell-spacing-h)}td.sapphire-table__selectionCell,th.sapphire-table__selectionCell{width:var(--sapphire-global-size-generic-50)}td.sapphire-table__selectionCell:first-child,th.sapphire-table__selectionCell:first-child{position:sticky;left:0;z-index:2}.sapphire-table__tfoot .sapphire-table__cell{font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-table__cell:before,.sapphire-table__headCell_container:before,.sapphire-table__selectionCell:before{content:\"\";position:absolute;inset:0;background-color:var(--sapphire-table-row-bg-active, var(--sapphire-table-row-bg));z-index:-1;pointer-events:none}.sapphire-table__cell,.sapphire-table__headCell_container,.sapphire-table__selectionCell{background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table__row{box-sizing:border-box;position:relative;border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary);--sapphire-table-row-bg: var( --sapphire-table-rowgroup-bg, var(--sapphire-semantic-color-background-surface) )}.sapphire-table--interactive .sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-tertiary-active )}.sapphire-table--interactive .sapphire-table__row--selected.sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--selected{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-default )}.sapphire-table__row.is-focus,.sapphire-table__row:not(.js-focus):focus-visible,.sapphire-table__row.sapphire-table__row--expanded{border-bottom-color:transparent}.sapphire-table__row-expanded-view{border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-table__row-expand-button{display:inline-flex;transition:transform var(--sapphire-semantic-transitions-dynamic) var(--sapphire-semantic-time-motion-quick)}.sapphire-table td:has(.sapphire-table__row-expand-button){width:0}.sapphire-table__row--expanded .sapphire-table__row-expand-button{transform:rotate(180deg)}.sapphire-table--without-last-divider :not([role=presentation])>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible):last-child,.sapphire-table--without-last-divider [role=presentation]:last-child>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible){border-bottom-color:transparent}.sapphire-table--interactive .sapphire-table__row,.sapphire-table__row--interactive{cursor:default}.sapphire-table--interactive .sapphire-table__row.is-hover,.sapphire-table__row--interactive.is-hover,.sapphire-table--interactive .sapphire-table__row:not(.js-hover):hover,.sapphire-table__row--interactive:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-tertiary-hover );color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);cursor:pointer}.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected.is-hover,.sapphire-table__row--interactive.sapphire-table__row--selected.is-hover,.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected:not(.js-hover):hover,.sapphire-table__row--interactive.sapphire-table__row--selected:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--highlighted{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-highlight )}.sapphire-table__row--highlighted:after{content:\"\";position:absolute;z-index:2;left:0;height:100%;width:var(--sapphire-semantic-size-border-md);background:var(--sapphire-semantic-color-border-accent);pointer-events:none}.sapphire-table__tfoot{position:relative;z-index:2;--sapphire-table-rowgroup-bg: var( --sapphire-semantic-color-background-neutral-subtle )}.sapphire-table__selection-action-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-lg);background:var(--sapphire-semantic-color-background-neutral-subtle);position:sticky;top:0;left:0;z-index:3}.sapphire-table__footer{position:relative;z-index:2}.sapphire-table__footer--sticky{position:sticky;bottom:0;left:0}.sapphire-table__footer--virtualized{position:absolute;z-index:2;bottom:0;right:0;left:0}sp-table{display:block}\n"] });
|
|
7179
|
+
`, isInline: true, styles: [".sapphire-table{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;justify-content:space-between;background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table--overflow{overflow:auto}.sapphire-table__table{border-collapse:collapse;border-spacing:0;width:100%;table-layout:auto}.sapphire-table__table--fixed-layout{table-layout:fixed}.sapphire-table-sortedIcon,.sapphire-table-sortableIcon{display:inline-flex;visibility:hidden;vertical-align:top}.sapphire-table__head{top:0;z-index:2;line-height:var(--sapphire-semantic-size-line-height-md);--sapphire-table-row-bg: var(--sapphire-semantic-color-background-surface)}.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-md);line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-table__head--sticky{position:sticky}.sapphire-table__cell--alignLeft{text-align:left}.sapphire-table__cell--alignCenter{text-align:center}.sapphire-table__cell--alignRight{text-align:end}.sapphire-table__headCell{color:var(--sapphire-semantic-color-foreground-primary);box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-medium);line-height:var(--sapphire-semantic-size-line-height-md);vertical-align:top}.sapphire-table__headCell_container{padding:var(--sapphire-semantic-size-spacing-xs) var(--sapphire-table-cell-spacing-h);display:inline-flex;align-items:center;box-sizing:border-box;width:100%}.sapphire-table__cell--alignRight .sapphire-table__headCell_container{justify-content:flex-end}.sapphire-table__cell--alignLeft .sapphire-table__headCell_container{justify-content:flex-start}.sapphire-table__cell--alignCenter .sapphire-table__headCell_container{justify-content:center}.sapphire-table__row,.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{outline:none;position:relative;z-index:1}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container:after,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container:after,.sapphire-table__cell.is-focus:after,.sapphire-table__cell:not(.js-focus):focus-visible:after,.sapphire-table__selectionCell.is-focus:after,.sapphire-table__selectionCell:not(.js-focus):focus-visible:after,.sapphire-table__row.is-focus:after,.sapphire-table__row:not(.js-focus):focus-visible:after,.sapphire-table__row-expanded-view.is-focus:after,.sapphire-table__row-expanded-view:not(.js-focus):focus-visible:after{content:\"\";outline:none;border-radius:var(--sapphire-semantic-size-radius-sm);box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);position:absolute;inset:0;z-index:3}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container{border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable.is-hover .sapphire-table__headCell_container,.sapphire-table__headCell.sapphire-table__headCell--sortable:not(.js-hover):hover .sapphire-table__headCell_container{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable{cursor:pointer}.sapphire-table__headCell--sortable:not(sapphire-table__headCell--sorted):hover .sapphire-table-sortableIcon{visibility:visible}.sapphire-table__headCell--sorted .sapphire-table-sortedIcon{visibility:visible;padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell .sapphire-table-sortedIcon,.sapphire-table__headCell .sapphire-table-sortableIcon{padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__cell--alignRight .sapphire-table-sortedIcon,.sapphire-table__cell--alignRight .sapphire-table-sortableIcon{padding-right:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell__text,.sapphire-table__headCell__icon{vertical-align:top;display:inline-block}.sapphire-table__body{position:relative;overflow:auto}.sapphire-table__cell{box-sizing:border-box;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow-wrap:break-word;align-content:center;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h)}.sapphire-table__cell-contents{display:block;width:100%;overflow-wrap:break-word}.sapphire-table__cell--ellipsed,.sapphire-table__headCell_content--ellipsed,.sapphire-table__cell--ellipsed .sapphire-table__cell-contents{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sapphire-table__table{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-sm)}.sapphire-table__table--spacing-sm{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-xs)}.sapphire-table__table--spacing-lg{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-md);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-md)}.sapphire-table__table--spacing-xl{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-lg);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-lg)}.sapphire-table__selectionCell{line-height:0;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h);box-sizing:content-box}.sapphire-table__head .sapphire-table__selectionCell{padding:var(--sapphire-semantic-size-spacing-2xs) var(--sapphire-table-cell-spacing-h)}td.sapphire-table__selectionCell,th.sapphire-table__selectionCell{width:var(--sapphire-global-size-generic-50)}td.sapphire-table__selectionCell:first-child,th.sapphire-table__selectionCell:first-child{position:sticky;left:0;z-index:2}.sapphire-table__tfoot .sapphire-table__cell{font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-table__cell:before,.sapphire-table__headCell_container:before,.sapphire-table__selectionCell:before{content:\"\";position:absolute;inset:0;background-color:var(--sapphire-table-row-bg-active, var(--sapphire-table-row-bg));z-index:-1;pointer-events:none}.sapphire-table__cell,.sapphire-table__headCell_container,.sapphire-table__selectionCell{background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table__row{box-sizing:border-box;position:relative;border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary);--sapphire-table-row-bg: var( --sapphire-table-rowgroup-bg, var(--sapphire-semantic-color-background-surface) )}.sapphire-table--interactive .sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-tertiary-active )}.sapphire-table--interactive .sapphire-table__row--selected.sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--selected{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-default )}.sapphire-table__row.is-focus,.sapphire-table__row:not(.js-focus):focus-visible,.sapphire-table__row.sapphire-table__row--expanded{border-bottom-color:transparent}.sapphire-table__row-expanded-view{border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-table__row-expand-button{display:inline-flex;transition:transform var(--sapphire-semantic-transitions-dynamic) var(--sapphire-semantic-time-motion-quick)}.sapphire-table td:has(.sapphire-table__row-expand-button){width:0}.sapphire-table__row--expanded .sapphire-table__row-expand-button{transform:rotate(180deg)}.sapphire-table--without-last-divider :not([role=presentation])>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible):last-child,.sapphire-table--without-last-divider [role=presentation]:last-child>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible){border-bottom-color:transparent}.sapphire-table--interactive .sapphire-table__row,.sapphire-table__row--interactive{cursor:default}.sapphire-table--interactive .sapphire-table__row.is-hover,.sapphire-table__row--interactive.is-hover,.sapphire-table--interactive .sapphire-table__row:not(.js-hover):hover,.sapphire-table__row--interactive:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-tertiary-hover );color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);cursor:pointer}.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected.is-hover,.sapphire-table__row--interactive.sapphire-table__row--selected.is-hover,.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected:not(.js-hover):hover,.sapphire-table__row--interactive.sapphire-table__row--selected:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--highlighted{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-highlight )}.sapphire-table :has(> .sapphire-table__row--highlighted):not(tbody):before{content:\"\";position:sticky;float:inline-start;height:100%;width:var(--sapphire-semantic-size-border-md);margin-left:calc(-1 * var(--sapphire-semantic-size-border-md));inset-inline-start:0;background:var(--sapphire-semantic-color-border-accent);pointer-events:none;z-index:2}tbody .sapphire-table__row--highlighted .sapphire-table__selectionCell,tbody .sapphire-table__row--highlighted>.sapphire-table__cell:first-child{box-shadow:inset var(--sapphire-semantic-size-border-md) 0 0 0 var(--sapphire-semantic-color-border-accent)}.sapphire-table__tfoot{position:relative;z-index:2;--sapphire-table-rowgroup-bg: var( --sapphire-semantic-color-background-neutral-subtle )}.sapphire-table__selection-action-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-lg);background:var(--sapphire-semantic-color-background-neutral-subtle);position:sticky;top:0;left:0;z-index:3}.sapphire-table__footer{position:relative;z-index:2}.sapphire-table__footer--sticky{position:sticky;bottom:0;left:0}.sapphire-table__footer--virtualized{position:absolute;z-index:2;bottom:0;right:0;left:0}sp-table{display:block}\n"] });
|
|
7104
7180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: TableComponent, decorators: [{
|
|
7105
7181
|
type: Component,
|
|
7106
7182
|
args: [{ selector: 'sp-table', template: `
|
|
@@ -7113,7 +7189,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
7113
7189
|
'[style.max-height]': 'maxHeight',
|
|
7114
7190
|
'[class.sapphire-table--overflow]': 'height || maxHeight',
|
|
7115
7191
|
'[class.sapphire-table--interactive]': 'isInteractive',
|
|
7116
|
-
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-table{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;justify-content:space-between;background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table--overflow{overflow:auto}.sapphire-table__table{border-collapse:collapse;border-spacing:0;width:100%;table-layout:auto}.sapphire-table__table--fixed-layout{table-layout:fixed}.sapphire-table-sortedIcon,.sapphire-table-sortableIcon{display:inline-flex;visibility:hidden;vertical-align:top}.sapphire-table__head{top:0;z-index:2;line-height:var(--sapphire-semantic-size-line-height-md);--sapphire-table-row-bg: var(--sapphire-semantic-color-background-surface)}.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-md);line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-table__head--sticky{position:sticky}.sapphire-table__cell--alignLeft{text-align:left}.sapphire-table__cell--alignCenter{text-align:center}.sapphire-table__cell--alignRight{text-align:end}.sapphire-table__headCell{color:var(--sapphire-semantic-color-foreground-primary);box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-medium);line-height:var(--sapphire-semantic-size-line-height-md);vertical-align:top}.sapphire-table__headCell_container{padding:var(--sapphire-semantic-size-spacing-xs) var(--sapphire-table-cell-spacing-h);display:inline-flex;align-items:center;box-sizing:border-box;width:100%}.sapphire-table__cell--alignRight .sapphire-table__headCell_container{justify-content:flex-end}.sapphire-table__cell--alignLeft .sapphire-table__headCell_container{justify-content:flex-start}.sapphire-table__cell--alignCenter .sapphire-table__headCell_container{justify-content:center}.sapphire-table__row,.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{outline:none;position:relative;z-index:1}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container:after,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container:after,.sapphire-table__cell.is-focus:after,.sapphire-table__cell:not(.js-focus):focus-visible:after,.sapphire-table__selectionCell.is-focus:after,.sapphire-table__selectionCell:not(.js-focus):focus-visible:after,.sapphire-table__row.is-focus:after,.sapphire-table__row:not(.js-focus):focus-visible:after,.sapphire-table__row-expanded-view.is-focus:after,.sapphire-table__row-expanded-view:not(.js-focus):focus-visible:after{content:\"\";outline:none;border-radius:var(--sapphire-semantic-size-radius-sm);box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);position:absolute;inset:0;z-index:3}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container{border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable.is-hover .sapphire-table__headCell_container,.sapphire-table__headCell.sapphire-table__headCell--sortable:not(.js-hover):hover .sapphire-table__headCell_container{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable{cursor:pointer}.sapphire-table__headCell--sortable:not(sapphire-table__headCell--sorted):hover .sapphire-table-sortableIcon{visibility:visible}.sapphire-table__headCell--sorted .sapphire-table-sortedIcon{visibility:visible;padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell .sapphire-table-sortedIcon,.sapphire-table__headCell .sapphire-table-sortableIcon{padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__cell--alignRight .sapphire-table-sortedIcon,.sapphire-table__cell--alignRight .sapphire-table-sortableIcon{padding-right:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell__text,.sapphire-table__headCell__icon{vertical-align:top;display:inline-block}.sapphire-table__body{position:relative;overflow:auto}.sapphire-table__cell{box-sizing:border-box;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow-wrap:break-word;align-content:center;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h)}.sapphire-table__cell-contents{display:block;width:100%;overflow-wrap:break-word}.sapphire-table__cell--ellipsed,.sapphire-table__headCell_content--ellipsed,.sapphire-table__cell--ellipsed .sapphire-table__cell-contents{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sapphire-table__table{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-sm)}.sapphire-table__table--spacing-sm{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-xs)}.sapphire-table__table--spacing-lg{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-md);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-md)}.sapphire-table__table--spacing-xl{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-lg);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-lg)}.sapphire-table__selectionCell{line-height:0;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h);box-sizing:content-box}.sapphire-table__head .sapphire-table__selectionCell{padding:var(--sapphire-semantic-size-spacing-2xs) var(--sapphire-table-cell-spacing-h)}td.sapphire-table__selectionCell,th.sapphire-table__selectionCell{width:var(--sapphire-global-size-generic-50)}td.sapphire-table__selectionCell:first-child,th.sapphire-table__selectionCell:first-child{position:sticky;left:0;z-index:2}.sapphire-table__tfoot .sapphire-table__cell{font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-table__cell:before,.sapphire-table__headCell_container:before,.sapphire-table__selectionCell:before{content:\"\";position:absolute;inset:0;background-color:var(--sapphire-table-row-bg-active, var(--sapphire-table-row-bg));z-index:-1;pointer-events:none}.sapphire-table__cell,.sapphire-table__headCell_container,.sapphire-table__selectionCell{background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table__row{box-sizing:border-box;position:relative;border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary);--sapphire-table-row-bg: var( --sapphire-table-rowgroup-bg, var(--sapphire-semantic-color-background-surface) )}.sapphire-table--interactive .sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-tertiary-active )}.sapphire-table--interactive .sapphire-table__row--selected.sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--selected{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-default )}.sapphire-table__row.is-focus,.sapphire-table__row:not(.js-focus):focus-visible,.sapphire-table__row.sapphire-table__row--expanded{border-bottom-color:transparent}.sapphire-table__row-expanded-view{border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-table__row-expand-button{display:inline-flex;transition:transform var(--sapphire-semantic-transitions-dynamic) var(--sapphire-semantic-time-motion-quick)}.sapphire-table td:has(.sapphire-table__row-expand-button){width:0}.sapphire-table__row--expanded .sapphire-table__row-expand-button{transform:rotate(180deg)}.sapphire-table--without-last-divider :not([role=presentation])>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible):last-child,.sapphire-table--without-last-divider [role=presentation]:last-child>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible){border-bottom-color:transparent}.sapphire-table--interactive .sapphire-table__row,.sapphire-table__row--interactive{cursor:default}.sapphire-table--interactive .sapphire-table__row.is-hover,.sapphire-table__row--interactive.is-hover,.sapphire-table--interactive .sapphire-table__row:not(.js-hover):hover,.sapphire-table__row--interactive:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-tertiary-hover );color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);cursor:pointer}.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected.is-hover,.sapphire-table__row--interactive.sapphire-table__row--selected.is-hover,.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected:not(.js-hover):hover,.sapphire-table__row--interactive.sapphire-table__row--selected:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--highlighted{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-highlight )}.sapphire-table__row--highlighted:after{content:\"\";position:absolute;z-index:2;left:0;height:100%;width:var(--sapphire-semantic-size-border-md);background:var(--sapphire-semantic-color-border-accent);pointer-events:none}.sapphire-table__tfoot{position:relative;z-index:2;--sapphire-table-rowgroup-bg: var( --sapphire-semantic-color-background-neutral-subtle )}.sapphire-table__selection-action-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-lg);background:var(--sapphire-semantic-color-background-neutral-subtle);position:sticky;top:0;left:0;z-index:3}.sapphire-table__footer{position:relative;z-index:2}.sapphire-table__footer--sticky{position:sticky;bottom:0;left:0}.sapphire-table__footer--virtualized{position:absolute;z-index:2;bottom:0;right:0;left:0}sp-table{display:block}\n"] }]
|
|
7192
|
+
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-table{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;display:flex;flex-direction:column;justify-content:space-between;background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table--overflow{overflow:auto}.sapphire-table__table{border-collapse:collapse;border-spacing:0;width:100%;table-layout:auto}.sapphire-table__table--fixed-layout{table-layout:fixed}.sapphire-table-sortedIcon,.sapphire-table-sortableIcon{display:inline-flex;visibility:hidden;vertical-align:top}.sapphire-table__head{top:0;z-index:2;line-height:var(--sapphire-semantic-size-line-height-md);--sapphire-table-row-bg: var(--sapphire-semantic-color-background-surface)}.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-md);line-height:var(--sapphire-semantic-size-line-height-md)}.sapphire-table__head--sticky{position:sticky}.sapphire-table__cell--alignLeft{text-align:left}.sapphire-table__cell--alignCenter{text-align:center}.sapphire-table__cell--alignRight{text-align:end}.sapphire-table__headCell{color:var(--sapphire-semantic-color-foreground-primary);box-sizing:border-box;font-size:var(--sapphire-semantic-size-font-body-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-medium);line-height:var(--sapphire-semantic-size-line-height-md);vertical-align:top}.sapphire-table__headCell_container{padding:var(--sapphire-semantic-size-spacing-xs) var(--sapphire-table-cell-spacing-h);display:inline-flex;align-items:center;box-sizing:border-box;width:100%}.sapphire-table__cell--alignRight .sapphire-table__headCell_container{justify-content:flex-end}.sapphire-table__cell--alignLeft .sapphire-table__headCell_container{justify-content:flex-start}.sapphire-table__cell--alignCenter .sapphire-table__headCell_container{justify-content:center}.sapphire-table__row,.sapphire-table__cell,.sapphire-table__headCell,.sapphire-table__selectionCell{outline:none;position:relative;z-index:1}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container:after,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container:after,.sapphire-table__cell.is-focus:after,.sapphire-table__cell:not(.js-focus):focus-visible:after,.sapphire-table__selectionCell.is-focus:after,.sapphire-table__selectionCell:not(.js-focus):focus-visible:after,.sapphire-table__row.is-focus:after,.sapphire-table__row:not(.js-focus):focus-visible:after,.sapphire-table__row-expanded-view.is-focus:after,.sapphire-table__row-expanded-view:not(.js-focus):focus-visible:after{content:\"\";outline:none;border-radius:var(--sapphire-semantic-size-radius-sm);box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);position:absolute;inset:0;z-index:3}.sapphire-table__headCell.is-focus .sapphire-table__headCell_container,.sapphire-table__headCell:not(.js-focus):focus-visible .sapphire-table__headCell_container{border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable.is-hover .sapphire-table__headCell_container,.sapphire-table__headCell.sapphire-table__headCell--sortable:not(.js-hover):hover .sapphire-table__headCell_container{color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-table__headCell.sapphire-table__headCell--sortable{cursor:pointer}.sapphire-table__headCell--sortable:not(sapphire-table__headCell--sorted):hover .sapphire-table-sortableIcon{visibility:visible}.sapphire-table__headCell--sorted .sapphire-table-sortedIcon{visibility:visible;padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell .sapphire-table-sortedIcon,.sapphire-table__headCell .sapphire-table-sortableIcon{padding-left:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__cell--alignRight .sapphire-table-sortedIcon,.sapphire-table__cell--alignRight .sapphire-table-sortableIcon{padding-right:var(--sapphire-semantic-size-spacing-2xs)}.sapphire-table__headCell__text,.sapphire-table__headCell__icon{vertical-align:top;display:inline-block}.sapphire-table__body{position:relative;overflow:auto}.sapphire-table__cell{box-sizing:border-box;color:var(--sapphire-semantic-color-foreground-primary);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);overflow-wrap:break-word;align-content:center;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h)}.sapphire-table__cell-contents{display:block;width:100%;overflow-wrap:break-word}.sapphire-table__cell--ellipsed,.sapphire-table__headCell_content--ellipsed,.sapphire-table__cell--ellipsed .sapphire-table__cell-contents{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.sapphire-table__table{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-sm)}.sapphire-table__table--spacing-sm{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-sm);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-xs)}.sapphire-table__table--spacing-lg{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-md);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-md)}.sapphire-table__table--spacing-xl{--sapphire-table-cell-spacing-h: var(--sapphire-semantic-size-spacing-lg);--sapphire-table-cell-spacing-v: var(--sapphire-semantic-size-spacing-lg)}.sapphire-table__selectionCell{line-height:0;padding:var(--sapphire-table-cell-spacing-v) var(--sapphire-table-cell-spacing-h);box-sizing:content-box}.sapphire-table__head .sapphire-table__selectionCell{padding:var(--sapphire-semantic-size-spacing-2xs) var(--sapphire-table-cell-spacing-h)}td.sapphire-table__selectionCell,th.sapphire-table__selectionCell{width:var(--sapphire-global-size-generic-50)}td.sapphire-table__selectionCell:first-child,th.sapphire-table__selectionCell:first-child{position:sticky;left:0;z-index:2}.sapphire-table__tfoot .sapphire-table__cell{font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-table__cell:before,.sapphire-table__headCell_container:before,.sapphire-table__selectionCell:before{content:\"\";position:absolute;inset:0;background-color:var(--sapphire-table-row-bg-active, var(--sapphire-table-row-bg));z-index:-1;pointer-events:none}.sapphire-table__cell,.sapphire-table__headCell_container,.sapphire-table__selectionCell{background-color:var(--sapphire-semantic-color-background-surface)}.sapphire-table__row{box-sizing:border-box;position:relative;border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary);--sapphire-table-row-bg: var( --sapphire-table-rowgroup-bg, var(--sapphire-semantic-color-background-surface) )}.sapphire-table--interactive .sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-tertiary-active )}.sapphire-table--interactive .sapphire-table__row--selected.sapphire-table__row--active{--sapphire-table-row-bg-active: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--selected{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-default )}.sapphire-table__row.is-focus,.sapphire-table__row:not(.js-focus):focus-visible,.sapphire-table__row.sapphire-table__row--expanded{border-bottom-color:transparent}.sapphire-table__row-expanded-view{border-bottom:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-table__row-expand-button{display:inline-flex;transition:transform var(--sapphire-semantic-transitions-dynamic) var(--sapphire-semantic-time-motion-quick)}.sapphire-table td:has(.sapphire-table__row-expand-button){width:0}.sapphire-table__row--expanded .sapphire-table__row-expand-button{transform:rotate(180deg)}.sapphire-table--without-last-divider :not([role=presentation])>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible):last-child,.sapphire-table--without-last-divider [role=presentation]:last-child>.sapphire-table__row:not(.is-focus,:not(.js-focus):focus-visible){border-bottom-color:transparent}.sapphire-table--interactive .sapphire-table__row,.sapphire-table__row--interactive{cursor:default}.sapphire-table--interactive .sapphire-table__row.is-hover,.sapphire-table__row--interactive.is-hover,.sapphire-table--interactive .sapphire-table__row:not(.js-hover):hover,.sapphire-table__row--interactive:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-tertiary-hover );color:var(--sapphire-semantic-color-foreground-action-on-tertiary-hover);cursor:pointer}.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected.is-hover,.sapphire-table__row--interactive.sapphire-table__row--selected.is-hover,.sapphire-table--interactive .sapphire-table__row.sapphire-table__row--selected:not(.js-hover):hover,.sapphire-table__row--interactive.sapphire-table__row--selected:not(.js-hover):hover{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-select-secondary-hover )}.sapphire-table__row--highlighted{--sapphire-table-row-bg: var( --sapphire-semantic-color-background-action-highlight )}.sapphire-table :has(> .sapphire-table__row--highlighted):not(tbody):before{content:\"\";position:sticky;float:inline-start;height:100%;width:var(--sapphire-semantic-size-border-md);margin-left:calc(-1 * var(--sapphire-semantic-size-border-md));inset-inline-start:0;background:var(--sapphire-semantic-color-border-accent);pointer-events:none;z-index:2}tbody .sapphire-table__row--highlighted .sapphire-table__selectionCell,tbody .sapphire-table__row--highlighted>.sapphire-table__cell:first-child{box-shadow:inset var(--sapphire-semantic-size-border-md) 0 0 0 var(--sapphire-semantic-color-border-accent)}.sapphire-table__tfoot{position:relative;z-index:2;--sapphire-table-rowgroup-bg: var( --sapphire-semantic-color-background-neutral-subtle )}.sapphire-table__selection-action-bar{display:flex;align-items:center;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-lg);background:var(--sapphire-semantic-color-background-neutral-subtle);position:sticky;top:0;left:0;z-index:3}.sapphire-table__footer{position:relative;z-index:2}.sapphire-table__footer--sticky{position:sticky;bottom:0;left:0}.sapphire-table__footer--virtualized{position:absolute;z-index:2;bottom:0;right:0;left:0}sp-table{display:block}\n"] }]
|
|
7117
7193
|
}], ctorParameters: function () { return []; }, propDecorators: { rowAction: [{
|
|
7118
7194
|
type: Output
|
|
7119
7195
|
}], stickyHeader: [{
|
|
@@ -7500,13 +7576,13 @@ class SwitchComponent extends _SwitchMixinBase {
|
|
|
7500
7576
|
}
|
|
7501
7577
|
}
|
|
7502
7578
|
SwitchComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SwitchComponent, deps: [{ token: i0.ElementRef }, { token: i0.ChangeDetectorRef }, { token: 'tabindex', attribute: true }], target: i0.ɵɵFactoryTarget.Component });
|
|
7503
|
-
SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: SwitchComponent, selector: "sp-switch", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], name: "name", size: "size", id: "id", value: "value", required: "required", selected: "selected", disabled: "disabled", readonly: "readonly" }, outputs: { change: "change" }, host: { properties: { "attr.aria-label": "null", "attr.aria-labelledby": "null", "id": "this.id" } }, providers: [
|
|
7579
|
+
SwitchComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: SwitchComponent, selector: "sp-switch", inputs: { ariaLabel: ["aria-label", "ariaLabel"], ariaLabelledby: ["aria-labelledby", "ariaLabelledby"], ariaDescribedby: ["aria-describedby", "ariaDescribedby"], name: "name", size: "size", id: "id", value: "value", required: "required", selected: "selected", disabled: "disabled", readonly: "readonly", note: "note" }, outputs: { change: "change" }, host: { properties: { "attr.aria-label": "null", "attr.aria-labelledby": "null", "id": "this.id" }, classAttribute: "sapphire-switch-container" }, providers: [
|
|
7504
7580
|
{
|
|
7505
7581
|
provide: NG_VALUE_ACCESSOR,
|
|
7506
7582
|
useExisting: forwardRef(() => SwitchComponent),
|
|
7507
7583
|
multi: true,
|
|
7508
7584
|
},
|
|
7509
|
-
], viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }], ngImport: i0, template: "<label\n class=\"sapphire-switch\"\n [class.sapphire-switch--md]=\"size === 'md'\"\n [attr.for]=\"inputId\"\n>\n <input\n #input\n class=\"sapphire-switch-input\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-switch-track\"></span>\n <span span class=\"sapphire-switch-label\"><ng-content></ng-content></span>\n</label>\n", styles: [".sapphire-switch{display:inline-flex;align-items:center;position:relative;max-width:100%;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-switch
|
|
7585
|
+
], viewQueries: [{ propertyName: "_inputElement", first: true, predicate: ["input"], descendants: true }], usesInheritance: true, hostDirectives: [{ directive: ThemeCheckDirective }, { directive: UseComponentStylesOnHost }], ngImport: i0, template: "<label\n class=\"sapphire-switch\"\n [class.sapphire-switch--md]=\"size === 'md'\"\n [attr.for]=\"inputId\"\n>\n <input\n #input\n class=\"sapphire-switch-input\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-switch-track\"></span>\n <span span class=\"sapphire-switch-label\"><ng-content></ng-content></span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-switch__note\"\n [class.sapphire-switch__note--md]=\"size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-switch{display:inline-flex;align-items:center;position:relative;max-width:100%;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-switch-container{display:inline-flex;flex-flow:column}.sapphire-switch-input{margin:0;box-sizing:border-box;padding:0;position:absolute;width:100%;height:100%;top:0;left:0;opacity:.0001;z-index:1;cursor:pointer}.sapphire-switch-label{display:flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-control-lg);line-height:var(--sapphire-semantic-size-height-control-xs);color:var(--sapphire-semantic-color-foreground-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-switch--md .sapphire-switch-label{gap:var(--sapphire-semantic-size-spacing-2xs);font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-switch:not(.js-focus) .sapphire-switch-input:focus-visible~.sapphire-switch-track,.sapphire-switch.is-focus .sapphire-switch-track{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-default);box-sizing:border-box;position:relative;width:var(--sapphire-global-size-generic-110);transition:background var(--sapphire-semantic-time-motion-quick) var(--sapphire-semantic-transitions-fade);height:var(--sapphire-semantic-size-height-control-xs);border-radius:calc(var(--sapphire-semantic-size-height-control-xs) / 2);flex-shrink:0}.sapphire-switch:not(:active):not(.is-active):not(.js-hover):hover .sapphire-switch-input:not(:disabled)~.sapphire-switch-track,.sapphire-switch:not(:active):not(.is-active).is-hover .sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-hover)}.sapphire-switch:active .sapphire-switch-input:not(:disabled)~.sapphire-switch-track,.sapphire-switch.is-active .sapphire-switch-input:not(:disabled)~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-active)}.sapphire-switch-input:checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-switch:not(:active):not(.is-active):not(.js-hover):hover .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track,.sapphire-switch:not(:active):not(.is-active).is-hover .sapphire-switch-input:checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-switch:active .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track,.sapphire-switch.is-active .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-switch-input:disabled{cursor:not-allowed}.sapphire-switch-input:disabled~.sapphire-switch-track,.sapphire-switch-input:disabled~.sapphire-switch-label{opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-switch-track:after{content:\"\";position:absolute;box-sizing:border-box;padding:var(--sapphire-global-size-static-5);height:100%;aspect-ratio:1/1;border-radius:50%;background:var(--sapphire-semantic-color-foreground-action-on-select-default);background-clip:content-box;left:0;transition:left var(--sapphire-semantic-time-motion-quick) var(--sapphire-semantic-transitions-dynamic)}.sapphire-switch-input:checked~.sapphire-switch-track:after{left:calc(100% - var(--sapphire-semantic-size-height-control-xs))}.sapphire-switch--md .sapphire-switch-track{width:var(--sapphire-global-size-generic-80);height:var(--sapphire-semantic-size-height-control-2xs);border-radius:calc(var(--sapphire-semantic-size-height-control-2xs) / 2)}.sapphire-switch--md .sapphire-switch-input:checked~.sapphire-switch-track:after{left:calc(100% - var(--sapphire-semantic-size-height-control-2xs))}.sapphire-switch__note{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-global-size-generic-110));color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-switch__note--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-global-size-generic-80))}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
7510
7586
|
__decorate([
|
|
7511
7587
|
AutoId()
|
|
7512
7588
|
], SwitchComponent.prototype, "id", void 0);
|
|
@@ -7521,13 +7597,14 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
7521
7597
|
args: [{ selector: 'sp-switch', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
7522
7598
|
'[attr.aria-label]': 'null',
|
|
7523
7599
|
'[attr.aria-labelledby]': 'null',
|
|
7600
|
+
class: 'sapphire-switch-container',
|
|
7524
7601
|
}, providers: [
|
|
7525
7602
|
{
|
|
7526
7603
|
provide: NG_VALUE_ACCESSOR,
|
|
7527
7604
|
useExisting: forwardRef(() => SwitchComponent),
|
|
7528
7605
|
multi: true,
|
|
7529
7606
|
},
|
|
7530
|
-
], hostDirectives: [ThemeCheckDirective], standalone: false, template: "<label\n class=\"sapphire-switch\"\n [class.sapphire-switch--md]=\"size === 'md'\"\n [attr.for]=\"inputId\"\n>\n <input\n #input\n class=\"sapphire-switch-input\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-switch-track\"></span>\n <span span class=\"sapphire-switch-label\"><ng-content></ng-content></span>\n</label>\n", styles: [".sapphire-switch{display:inline-flex;align-items:center;position:relative;max-width:100%;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-switch
|
|
7607
|
+
], hostDirectives: [ThemeCheckDirective, UseComponentStylesOnHost], standalone: false, template: "<label\n class=\"sapphire-switch\"\n [class.sapphire-switch--md]=\"size === 'md'\"\n [attr.for]=\"inputId\"\n>\n <input\n #input\n class=\"sapphire-switch-input\"\n role=\"switch\"\n type=\"checkbox\"\n [attr.aria-label]=\"ariaLabel || null\"\n [attr.aria-labelledby]=\"ariaLabelledby || null\"\n [attr.aria-describedby]=\"ariaDescribedby || null\"\n [attr.name]=\"name\"\n [attr.value]=\"value\"\n [checked]=\"selected\"\n [disabled]=\"disabled\"\n [readonly]=\"readonly\"\n [id]=\"inputId\"\n [required]=\"required\"\n [tabIndex]=\"tabIndex\"\n (blur)=\"_onBlur()\"\n (click)=\"_onInputClick($event)\"\n (change)=\"_onInteractionEvent($event)\"\n />\n <span class=\"sapphire-switch-track\"></span>\n <span span class=\"sapphire-switch-label\"><ng-content></ng-content></span>\n</label>\n<div\n *ngIf=\"note\"\n class=\"sapphire-switch__note\"\n [class.sapphire-switch__note--md]=\"size === 'md'\"\n>\n {{ note }}\n</div>\n", styles: [".sapphire-switch{display:inline-flex;align-items:center;position:relative;max-width:100%;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-switch-container{display:inline-flex;flex-flow:column}.sapphire-switch-input{margin:0;box-sizing:border-box;padding:0;position:absolute;width:100%;height:100%;top:0;left:0;opacity:.0001;z-index:1;cursor:pointer}.sapphire-switch-label{display:flex;align-items:center;gap:var(--sapphire-semantic-size-spacing-sm);font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-control-lg);line-height:var(--sapphire-semantic-size-height-control-xs);color:var(--sapphire-semantic-color-foreground-primary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.sapphire-switch--md .sapphire-switch-label{gap:var(--sapphire-semantic-size-spacing-2xs);font-size:var(--sapphire-semantic-size-font-control-md);line-height:var(--sapphire-semantic-size-height-control-2xs)}.sapphire-switch:not(.js-focus) .sapphire-switch-input:focus-visible~.sapphire-switch-track,.sapphire-switch.is-focus .sapphire-switch-track{outline:var(--sapphire-semantic-size-focus-ring) solid var(--sapphire-semantic-color-focus-ring);outline-offset:var(--sapphire-semantic-size-focus-ring)}.sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-default);box-sizing:border-box;position:relative;width:var(--sapphire-global-size-generic-110);transition:background var(--sapphire-semantic-time-motion-quick) var(--sapphire-semantic-transitions-fade);height:var(--sapphire-semantic-size-height-control-xs);border-radius:calc(var(--sapphire-semantic-size-height-control-xs) / 2);flex-shrink:0}.sapphire-switch:not(:active):not(.is-active):not(.js-hover):hover .sapphire-switch-input:not(:disabled)~.sapphire-switch-track,.sapphire-switch:not(:active):not(.is-active).is-hover .sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-hover)}.sapphire-switch:active .sapphire-switch-input:not(:disabled)~.sapphire-switch-track,.sapphire-switch.is-active .sapphire-switch-input:not(:disabled)~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-switch-active)}.sapphire-switch-input:checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-default)}.sapphire-switch:not(:active):not(.is-active):not(.js-hover):hover .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track,.sapphire-switch:not(:active):not(.is-active).is-hover .sapphire-switch-input:checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-hover)}.sapphire-switch:active .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track,.sapphire-switch.is-active .sapphire-switch-input:not(:disabled):checked~.sapphire-switch-track{background:var(--sapphire-semantic-color-background-action-select-active)}.sapphire-switch-input:disabled{cursor:not-allowed}.sapphire-switch-input:disabled~.sapphire-switch-track,.sapphire-switch-input:disabled~.sapphire-switch-label{opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-switch-track:after{content:\"\";position:absolute;box-sizing:border-box;padding:var(--sapphire-global-size-static-5);height:100%;aspect-ratio:1/1;border-radius:50%;background:var(--sapphire-semantic-color-foreground-action-on-select-default);background-clip:content-box;left:0;transition:left var(--sapphire-semantic-time-motion-quick) var(--sapphire-semantic-transitions-dynamic)}.sapphire-switch-input:checked~.sapphire-switch-track:after{left:calc(100% - var(--sapphire-semantic-size-height-control-xs))}.sapphire-switch--md .sapphire-switch-track{width:var(--sapphire-global-size-generic-80);height:var(--sapphire-semantic-size-height-control-2xs);border-radius:calc(var(--sapphire-semantic-size-height-control-2xs) / 2)}.sapphire-switch--md .sapphire-switch-input:checked~.sapphire-switch-track:after{left:calc(100% - var(--sapphire-semantic-size-height-control-2xs))}.sapphire-switch__note{display:block;font-family:var(--sapphire-semantic-font-name-default);font-weight:var(--sapphire-semantic-font-weight-default-regular);font-size:var(--sapphire-semantic-size-font-label-md);line-height:var(--sapphire-semantic-size-line-height-md);margin-top:var(--sapphire-semantic-size-spacing-3xs);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-global-size-generic-110));color:var(--sapphire-semantic-color-foreground-secondary)}.sapphire-switch__note--md{font-size:var(--sapphire-semantic-size-font-label-sm);line-height:var(--sapphire-semantic-size-line-height-sm);margin-left:calc(var(--sapphire-semantic-size-spacing-sm) + var(--sapphire-global-size-generic-80))}\n"] }]
|
|
7531
7608
|
}], ctorParameters: function () {
|
|
7532
7609
|
return [{ type: i0.ElementRef }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
7533
7610
|
type: Attribute,
|
|
@@ -7565,6 +7642,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
7565
7642
|
}], _inputElement: [{
|
|
7566
7643
|
type: ViewChild,
|
|
7567
7644
|
args: ['input']
|
|
7645
|
+
}], note: [{
|
|
7646
|
+
type: Input
|
|
7568
7647
|
}] } });
|
|
7569
7648
|
|
|
7570
7649
|
const SWITCH_REQUIRED_VALIDATOR = {
|
|
@@ -8040,7 +8119,7 @@ class ModalHeaderComponent {
|
|
|
8040
8119
|
}
|
|
8041
8120
|
}
|
|
8042
8121
|
ModalHeaderComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalHeaderComponent, deps: [{ token: IconRegistry }], target: i0.ɵɵFactoryTarget.Component });
|
|
8043
|
-
ModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ModalHeaderComponent, selector: "sp-modal-header", inputs: { subheading: "subheading", hideCloseButton: "hideCloseButton" }, outputs: { closeEventEmitter: "closeClicked" }, host: { classAttribute: "sapphire-modal-layout__header-container" }, hostDirectives: [{ directive: ModalHeaderDirective, inputs: ["id", "id"] }, { directive: UseComponentStyles }], ngImport: i0, template: "<div class=\"sapphire-modal-layout__header\" _spUseComponentStyles>\n <ng-content select=\"[spModalBackButton]\"></ng-content>\n\n
|
|
8122
|
+
ModalHeaderComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ModalHeaderComponent, selector: "sp-modal-header", inputs: { subheading: "subheading", hideCloseButton: "hideCloseButton" }, outputs: { closeEventEmitter: "closeClicked" }, host: { classAttribute: "sapphire-modal-layout__header-container" }, hostDirectives: [{ directive: ModalHeaderDirective, inputs: ["id", "id"] }, { directive: UseComponentStyles }], ngImport: i0, template: "<div class=\"sapphire-modal-layout__header\" _spUseComponentStyles>\n <div class=\"sapphire-modal-layout__header-content\" _spUseComponentStyles>\n <ng-content select=\"[spModalBackButton]\"></ng-content>\n\n <div class=\"sapphire-modal-layout__heading-container\" _spUseComponentStyles>\n <h5 sp-heading><ng-content></ng-content></h5>\n <div\n *ngIf=\"!!subheading\"\n class=\"sapphire-modal-layout__subheading\"\n _spUseComponentStyles\n >\n {{ subheading }}\n </div>\n\n <ng-content select=\"sp-modal-header-extra\"></ng-content>\n </div>\n\n <button\n *ngIf=\"!hideCloseButton\"\n sp-icon-button\n variant=\"tertiary\"\n size=\"md\"\n (click)=\"close($event)\"\n spModalCloseButton\n >\n <sp-icon name=\"close\"></sp-icon>\n </button>\n </div>\n <ng-content select=\"sp-modal-header-progress\"></ng-content>\n</div>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: HeadingComponent, selector: "h1[sp-heading],h2[sp-heading],h3[sp-heading],h4[sp-heading],h5[sp-heading],h6[sp-heading]", inputs: ["sp-heading", "color"] }, { kind: "component", type: IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: IconButtonComponent, selector: "button[sp-icon-button], a[sp-icon-button]", inputs: ["variant", "size", "disabled", "type"] }, { kind: "directive", type: UseComponentStyles, selector: "[_spUseComponentStyles]" }, { kind: "directive", type: ModalCloseButtonDirective, selector: "button[spModalCloseButton]" }] });
|
|
8044
8123
|
__decorate([
|
|
8045
8124
|
CoerceBoolean
|
|
8046
8125
|
], ModalHeaderComponent.prototype, "hideCloseButton", void 0);
|
|
@@ -8051,7 +8130,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
8051
8130
|
UseComponentStyles,
|
|
8052
8131
|
], host: {
|
|
8053
8132
|
class: 'sapphire-modal-layout__header-container',
|
|
8054
|
-
}, standalone: false, template: "<div class=\"sapphire-modal-layout__header\" _spUseComponentStyles>\n <ng-content select=\"[spModalBackButton]\"></ng-content>\n\n
|
|
8133
|
+
}, standalone: false, template: "<div class=\"sapphire-modal-layout__header\" _spUseComponentStyles>\n <div class=\"sapphire-modal-layout__header-content\" _spUseComponentStyles>\n <ng-content select=\"[spModalBackButton]\"></ng-content>\n\n <div class=\"sapphire-modal-layout__heading-container\" _spUseComponentStyles>\n <h5 sp-heading><ng-content></ng-content></h5>\n <div\n *ngIf=\"!!subheading\"\n class=\"sapphire-modal-layout__subheading\"\n _spUseComponentStyles\n >\n {{ subheading }}\n </div>\n\n <ng-content select=\"sp-modal-header-extra\"></ng-content>\n </div>\n\n <button\n *ngIf=\"!hideCloseButton\"\n sp-icon-button\n variant=\"tertiary\"\n size=\"md\"\n (click)=\"close($event)\"\n spModalCloseButton\n >\n <sp-icon name=\"close\"></sp-icon>\n </button>\n </div>\n <ng-content select=\"sp-modal-header-progress\"></ng-content>\n</div>\n" }]
|
|
8055
8134
|
}], ctorParameters: function () { return [{ type: IconRegistry }]; }, propDecorators: { subheading: [{
|
|
8056
8135
|
type: Input
|
|
8057
8136
|
}], hideCloseButton: [{
|
|
@@ -8277,6 +8356,48 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
8277
8356
|
}]
|
|
8278
8357
|
}] });
|
|
8279
8358
|
|
|
8359
|
+
// Exported just for the issue with vscode
|
|
8360
|
+
|
|
8361
|
+
/**
|
|
8362
|
+
* Slot for optional extra content (such as {@link BadgeComponent sp-badge}
|
|
8363
|
+
* rendered under the heading and subheading.
|
|
8364
|
+
*/
|
|
8365
|
+
class ModalHeaderExtraDirective {
|
|
8366
|
+
}
|
|
8367
|
+
ModalHeaderExtraDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalHeaderExtraDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
8368
|
+
ModalHeaderExtraDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: ModalHeaderExtraDirective, isStandalone: true, selector: "sp-modal-header-extra", host: { classAttribute: "sapphire-modal-layout__extra-container" }, hostDirectives: [{ directive: UseComponentStyles }], ngImport: i0 });
|
|
8369
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalHeaderExtraDirective, decorators: [{
|
|
8370
|
+
type: Directive,
|
|
8371
|
+
args: [{
|
|
8372
|
+
selector: 'sp-modal-header-extra',
|
|
8373
|
+
host: {
|
|
8374
|
+
class: 'sapphire-modal-layout__extra-container',
|
|
8375
|
+
},
|
|
8376
|
+
hostDirectives: [UseComponentStyles],
|
|
8377
|
+
standalone: true,
|
|
8378
|
+
}]
|
|
8379
|
+
}] });
|
|
8380
|
+
|
|
8381
|
+
/**
|
|
8382
|
+
* Slot for optional progress indicator, rendered along the bottom of the header.
|
|
8383
|
+
* Use {@link ProgressIndicatorComponent sp-progress-indicator} to render the content.
|
|
8384
|
+
*/
|
|
8385
|
+
class ModalHeaderProgressDirective {
|
|
8386
|
+
}
|
|
8387
|
+
ModalHeaderProgressDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalHeaderProgressDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
8388
|
+
ModalHeaderProgressDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: ModalHeaderProgressDirective, isStandalone: true, selector: "sp-modal-header-progress", host: { classAttribute: "sapphire-modal-layout__progress-container" }, hostDirectives: [{ directive: UseComponentStyles }], ngImport: i0 });
|
|
8389
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalHeaderProgressDirective, decorators: [{
|
|
8390
|
+
type: Directive,
|
|
8391
|
+
args: [{
|
|
8392
|
+
selector: 'sp-modal-header-progress',
|
|
8393
|
+
host: {
|
|
8394
|
+
class: 'sapphire-modal-layout__progress-container',
|
|
8395
|
+
},
|
|
8396
|
+
hostDirectives: [UseComponentStyles],
|
|
8397
|
+
standalone: true,
|
|
8398
|
+
}]
|
|
8399
|
+
}] });
|
|
8400
|
+
|
|
8280
8401
|
/**
|
|
8281
8402
|
* Makes a clickable element a trigger for a modal
|
|
8282
8403
|
*/
|
|
@@ -8349,12 +8470,12 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
8349
8470
|
class ModalLayoutComponent {
|
|
8350
8471
|
}
|
|
8351
8472
|
ModalLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8352
|
-
ModalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ModalLayoutComponent, selector: "sp-modal-layout", host: { classAttribute: "sapphire-modal-layout" }, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: "<ng-content select=\"sp-modal-header, [spModalHeader]\"></ng-content>\n<ng-content select=\"sp-modal-body\"></ng-content>\n<ng-content select=\"sp-modal-footer, [spModalFooter]\"></ng-content>\n", styles: [".sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;
|
|
8473
|
+
ModalLayoutComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ModalLayoutComponent, selector: "sp-modal-layout", host: { classAttribute: "sapphire-modal-layout" }, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: "<ng-content select=\"sp-modal-header, [spModalHeader]\"></ng-content>\n<ng-content select=\"sp-modal-body\"></ng-content>\n<ng-content select=\"sp-modal-footer, [spModalFooter]\"></ng-content>\n", styles: [".sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;flex-direction:column;padding:var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-2xl);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__header-content{display:flex;justify-content:space-between;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__body{overflow-y:auto;overflow-x:hidden;flex-grow:1;padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__body.sapphire-modal-layout__body--no-padding{padding:0}.sapphire-modal-layout__footer-container{flex-shrink:0}.sapphire-modal-layout__footer{padding:var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md) var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__heading-container{flex:1;display:flex;flex-direction:column;justify-content:center;word-break:break-word;padding:var(--sapphire-semantic-size-spacing-2xs) 0}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-3xs);line-height:var(--sapphire-semantic-size-line-height-sm)}.sapphire-modal-layout__extra-container{flex:1;flex-basis:100%;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sapphire-semantic-size-spacing-sm);margin-top:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__progress-container{display:flex}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body.sapphire-modal-layout__body--scrolled{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout:not(:has(.sapphire-modal-layout__footer)) .sapphire-modal-layout__body:not(.sapphire-modal-layout__body--no-padding){padding-bottom:var(--sapphire-semantic-size-spacing-lg)}.sapphire-modal-layout__body+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__body.sapphire-modal-layout__body--scrollable+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout__section{margin:0;padding:0;border:none}.sapphire-modal-layout__section-title{margin-left:calc(var(--sapphire-semantic-size-spacing-container-horizontal-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-container-horizontal-md) * 2);padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md);min-height:var(--sapphire-global-size-generic-100);background-color:var(--sapphire-semantic-color-background-surface);display:flex;align-items:center;position:sticky;top:0}.sapphire-modal-layout__section-title:before{content:\"\";background:var(--sapphire-semantic-color-background-neutral-subtle);position:absolute;inset:0;z-index:-1}\n"] });
|
|
8353
8474
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalLayoutComponent, decorators: [{
|
|
8354
8475
|
type: Component,
|
|
8355
8476
|
args: [{ selector: 'sp-modal-layout', template: "<ng-content select=\"sp-modal-header, [spModalHeader]\"></ng-content>\n<ng-content select=\"sp-modal-body\"></ng-content>\n<ng-content select=\"sp-modal-footer, [spModalFooter]\"></ng-content>\n", host: {
|
|
8356
8477
|
class: 'sapphire-modal-layout',
|
|
8357
|
-
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;
|
|
8478
|
+
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;flex-direction:column;padding:var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-2xl);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__header-content{display:flex;justify-content:space-between;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__body{overflow-y:auto;overflow-x:hidden;flex-grow:1;padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__body.sapphire-modal-layout__body--no-padding{padding:0}.sapphire-modal-layout__footer-container{flex-shrink:0}.sapphire-modal-layout__footer{padding:var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md) var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__heading-container{flex:1;display:flex;flex-direction:column;justify-content:center;word-break:break-word;padding:var(--sapphire-semantic-size-spacing-2xs) 0}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-3xs);line-height:var(--sapphire-semantic-size-line-height-sm)}.sapphire-modal-layout__extra-container{flex:1;flex-basis:100%;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sapphire-semantic-size-spacing-sm);margin-top:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__progress-container{display:flex}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body.sapphire-modal-layout__body--scrolled{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout:not(:has(.sapphire-modal-layout__footer)) .sapphire-modal-layout__body:not(.sapphire-modal-layout__body--no-padding){padding-bottom:var(--sapphire-semantic-size-spacing-lg)}.sapphire-modal-layout__body+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__body.sapphire-modal-layout__body--scrollable+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout__section{margin:0;padding:0;border:none}.sapphire-modal-layout__section-title{margin-left:calc(var(--sapphire-semantic-size-spacing-container-horizontal-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-container-horizontal-md) * 2);padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md);min-height:var(--sapphire-global-size-generic-100);background-color:var(--sapphire-semantic-color-background-surface);display:flex;align-items:center;position:sticky;top:0}.sapphire-modal-layout__section-title:before{content:\"\";background:var(--sapphire-semantic-color-background-neutral-subtle);position:absolute;inset:0;z-index:-1}\n"] }]
|
|
8358
8479
|
}] });
|
|
8359
8480
|
|
|
8360
8481
|
/**
|
|
@@ -8576,14 +8697,14 @@ class PanelComponent extends ModalBaseComponent {
|
|
|
8576
8697
|
}
|
|
8577
8698
|
}
|
|
8578
8699
|
PanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: PanelComponent, deps: [{ token: i1$5.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
8579
|
-
PanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: PanelComponent, selector: "sp-panel", inputs: { size: "size" }, host: { properties: { "class.sapphire-panel--sm": "size === \"sm\"", "class.sapphire-panel--visible": "!dialogRef.closing" }, classAttribute: "sapphire-panel" }, usesInheritance: true, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".sapphire-panel{box-sizing:border-box;overflow:hidden;max-width:100%;display:block;height:100%;outline:0;transition:transform var(--sapphire-semantic-time-motion-default) var(--sapphire-semantic-transitions-standard);transform:translate(100%);width:var(--sapphire-semantic-size-width-panel-lg);background:var(--sapphire-semantic-color-background-popover)}.sapphire-panel--visible{transform:translate(0)}.sapphire-panel--sm{width:var(--sapphire-semantic-size-width-panel-sm)}.sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;
|
|
8700
|
+
PanelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: PanelComponent, selector: "sp-panel", inputs: { size: "size" }, host: { properties: { "class.sapphire-panel--sm": "size === \"sm\"", "class.sapphire-panel--visible": "!dialogRef.closing" }, classAttribute: "sapphire-panel" }, usesInheritance: true, hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true, styles: [".sapphire-panel{box-sizing:border-box;overflow:hidden;max-width:100%;display:block;height:100%;outline:0;transition:transform var(--sapphire-semantic-time-motion-default) var(--sapphire-semantic-transitions-standard);transform:translate(100%);width:var(--sapphire-semantic-size-width-panel-lg);background:var(--sapphire-semantic-color-background-popover)}.sapphire-panel--visible{transform:translate(0)}.sapphire-panel--sm{width:var(--sapphire-semantic-size-width-panel-sm)}.sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;flex-direction:column;padding:var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-2xl);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__header-content{display:flex;justify-content:space-between;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__body{overflow-y:auto;overflow-x:hidden;flex-grow:1;padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__body.sapphire-modal-layout__body--no-padding{padding:0}.sapphire-modal-layout__footer-container{flex-shrink:0}.sapphire-modal-layout__footer{padding:var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md) var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__heading-container{flex:1;display:flex;flex-direction:column;justify-content:center;word-break:break-word;padding:var(--sapphire-semantic-size-spacing-2xs) 0}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-3xs);line-height:var(--sapphire-semantic-size-line-height-sm)}.sapphire-modal-layout__extra-container{flex:1;flex-basis:100%;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sapphire-semantic-size-spacing-sm);margin-top:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__progress-container{display:flex}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body.sapphire-modal-layout__body--scrolled{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout:not(:has(.sapphire-modal-layout__footer)) .sapphire-modal-layout__body:not(.sapphire-modal-layout__body--no-padding){padding-bottom:var(--sapphire-semantic-size-spacing-lg)}.sapphire-modal-layout__body+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__body.sapphire-modal-layout__body--scrollable+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout__section{margin:0;padding:0;border:none}.sapphire-modal-layout__section-title{margin-left:calc(var(--sapphire-semantic-size-spacing-container-horizontal-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-container-horizontal-md) * 2);padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md);min-height:var(--sapphire-global-size-generic-100);background-color:var(--sapphire-semantic-color-background-surface);display:flex;align-items:center;position:sticky;top:0}.sapphire-modal-layout__section-title:before{content:\"\";background:var(--sapphire-semantic-color-background-neutral-subtle);position:absolute;inset:0;z-index:-1}\n"] });
|
|
8580
8701
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: PanelComponent, decorators: [{
|
|
8581
8702
|
type: Component,
|
|
8582
8703
|
args: [{ selector: 'sp-panel', template: '<ng-content></ng-content>', host: {
|
|
8583
8704
|
class: 'sapphire-panel',
|
|
8584
8705
|
'[class.sapphire-panel--sm]': 'size === "sm"',
|
|
8585
8706
|
'[class.sapphire-panel--visible]': '!dialogRef.closing',
|
|
8586
|
-
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-panel{box-sizing:border-box;overflow:hidden;max-width:100%;display:block;height:100%;outline:0;transition:transform var(--sapphire-semantic-time-motion-default) var(--sapphire-semantic-transitions-standard);transform:translate(100%);width:var(--sapphire-semantic-size-width-panel-lg);background:var(--sapphire-semantic-color-background-popover)}.sapphire-panel--visible{transform:translate(0)}.sapphire-panel--sm{width:var(--sapphire-semantic-size-width-panel-sm)}.sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;
|
|
8707
|
+
}, hostDirectives: [UseComponentStylesOnHost], standalone: false, styles: [".sapphire-panel{box-sizing:border-box;overflow:hidden;max-width:100%;display:block;height:100%;outline:0;transition:transform var(--sapphire-semantic-time-motion-default) var(--sapphire-semantic-transitions-standard);transform:translate(100%);width:var(--sapphire-semantic-size-width-panel-lg);background:var(--sapphire-semantic-color-background-popover)}.sapphire-panel--visible{transform:translate(0)}.sapphire-panel--sm{width:var(--sapphire-semantic-size-width-panel-sm)}.sapphire-modal-layout{display:flex;flex-direction:column;height:100%;min-height:0;font-family:var(--sapphire-semantic-font-name-default);color:var(--sapphire-semantic-color-foreground-primary)}.sapphire-modal-layout__header-container{flex-shrink:0}.sapphire-modal-layout__header{display:flex;flex-direction:column;padding:var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-xl) var(--sapphire-semantic-size-spacing-2xl);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__header-content{display:flex;justify-content:space-between;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__body{overflow-y:auto;overflow-x:hidden;flex-grow:1;padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__body.sapphire-modal-layout__body--no-padding{padding:0}.sapphire-modal-layout__footer-container{flex-shrink:0}.sapphire-modal-layout__footer{padding:var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md) var(--sapphire-semantic-size-spacing-2xl) var(--sapphire-semantic-size-spacing-container-horizontal-md)}.sapphire-modal-layout__heading-container{flex:1;display:flex;flex-direction:column;justify-content:center;word-break:break-word;padding:var(--sapphire-semantic-size-spacing-2xs) 0}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-3xs);line-height:var(--sapphire-semantic-size-line-height-sm)}.sapphire-modal-layout__extra-container{flex:1;flex-basis:100%;display:flex;flex-direction:column;align-items:flex-start;gap:var(--sapphire-semantic-size-spacing-sm);margin-top:var(--sapphire-semantic-size-spacing-sm)}.sapphire-modal-layout__progress-container{display:flex}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__header-container+.sapphire-modal-layout__body.sapphire-modal-layout__body--scrolled{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout:not(:has(.sapphire-modal-layout__footer)) .sapphire-modal-layout__body:not(.sapphire-modal-layout__body--no-padding){padding-bottom:var(--sapphire-semantic-size-spacing-lg)}.sapphire-modal-layout__body+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid transparent}.sapphire-modal-layout__body.sapphire-modal-layout__body--scrollable+.sapphire-modal-layout__footer-container{border-top:var(--sapphire-semantic-size-border-sm) solid var(--sapphire-semantic-color-border-secondary)}.sapphire-modal-layout__section{margin:0;padding:0;border:none}.sapphire-modal-layout__section-title{margin-left:calc(var(--sapphire-semantic-size-spacing-container-horizontal-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-container-horizontal-md) * 2);padding:0 var(--sapphire-semantic-size-spacing-container-horizontal-md);min-height:var(--sapphire-global-size-generic-100);background-color:var(--sapphire-semantic-color-background-surface);display:flex;align-items:center;position:sticky;top:0}.sapphire-modal-layout__section-title:before{content:\"\";background:var(--sapphire-semantic-color-background-neutral-subtle);position:absolute;inset:0;z-index:-1}\n"] }]
|
|
8587
8708
|
}], ctorParameters: function () { return [{ type: i1$5.DialogRef }]; }, propDecorators: { size: [{
|
|
8588
8709
|
type: Input
|
|
8589
8710
|
}] } });
|
|
@@ -8662,6 +8783,8 @@ SapphireModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
|
|
|
8662
8783
|
ScrollMonitorDirective,
|
|
8663
8784
|
ModalHeaderDirective,
|
|
8664
8785
|
ModalFooterDirective,
|
|
8786
|
+
ModalHeaderExtraDirective,
|
|
8787
|
+
ModalHeaderProgressDirective,
|
|
8665
8788
|
UseComponentStyles], exports: [ModalLayoutComponent,
|
|
8666
8789
|
ModalHeaderComponent,
|
|
8667
8790
|
ModalBodyComponent,
|
|
@@ -8672,6 +8795,8 @@ SapphireModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
|
|
|
8672
8795
|
ModalCloseButtonDirective,
|
|
8673
8796
|
ModalSectionComponent,
|
|
8674
8797
|
ModalSectionTitleDirective,
|
|
8798
|
+
ModalHeaderExtraDirective,
|
|
8799
|
+
ModalHeaderProgressDirective,
|
|
8675
8800
|
DialogComponent,
|
|
8676
8801
|
DialogTriggerDirective,
|
|
8677
8802
|
ConfirmationDialogComponent,
|
|
@@ -8726,6 +8851,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
8726
8851
|
ScrollMonitorDirective,
|
|
8727
8852
|
ModalHeaderDirective,
|
|
8728
8853
|
ModalFooterDirective,
|
|
8854
|
+
ModalHeaderExtraDirective,
|
|
8855
|
+
ModalHeaderProgressDirective,
|
|
8729
8856
|
UseComponentStyles,
|
|
8730
8857
|
],
|
|
8731
8858
|
exports: [
|
|
@@ -8739,6 +8866,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
8739
8866
|
ModalCloseButtonDirective,
|
|
8740
8867
|
ModalSectionComponent,
|
|
8741
8868
|
ModalSectionTitleDirective,
|
|
8869
|
+
ModalHeaderExtraDirective,
|
|
8870
|
+
ModalHeaderProgressDirective,
|
|
8742
8871
|
DialogComponent,
|
|
8743
8872
|
DialogTriggerDirective,
|
|
8744
8873
|
ConfirmationDialogComponent,
|
|
@@ -9394,8 +9523,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9394
9523
|
|
|
9395
9524
|
// We have separate public_api.ts file for each angular module, to have them
|
|
9396
9525
|
|
|
9397
|
-
// Exported just for the issue with vscode
|
|
9398
|
-
|
|
9399
9526
|
class BadgeComponent {
|
|
9400
9527
|
get classNames() {
|
|
9401
9528
|
return [
|
|
@@ -9544,7 +9671,7 @@ class ListComponent {
|
|
|
9544
9671
|
}
|
|
9545
9672
|
}
|
|
9546
9673
|
ListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
9547
|
-
ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListComponent, isStandalone: true, selector: "[sp-list]", inputs: { hideLastDivider: "hideLastDivider", hasNegativeSideMargin: "hasNegativeSideMargin" }, host: { properties: { "class.sapphire-list--without-last-divider": "hideLastDivider", "class.sapphire-list--negative-margin-self": "hasNegativeSideMargin", "attr.role": "!isListElement ? \"list\" : undefined" }, classAttribute: "sapphire-list" }, providers: [ViewEncapsulationProvider], queries: [{ propertyName: "listItems", predicate: i0.forwardRef(function () { return ListItemComponent; }), descendants: true }], hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".sapphire-list{box-sizing:border-box;width:100%;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;list-style:none}.sapphire-list__item{position:relative;display:flex;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);background:var(--sapphire-semantic-color-background-action-tertiary-default);outline:none;font-family:var(--sapphire-semantic-font-name-default)}.sapphire-list__item--interactive{border:none;outline:none;text-decoration:none;box-sizing:border-box;width:100%;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:ease-in-out;cursor:pointer}.sapphire-list__item:has(.sapphire-list__item--interactive){padding:0}.sapphire-list__item:focus-within{z-index:1}.sapphire-list__item>.sapphire-list__item--interactive{display:flex;justify-content:space-between;width:100%;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);text-decoration:none;background:inherit;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;border:none;text-align:inherit;align-items:inherit}.sapphire-list--negative-margin-self{margin-left:calc(var(--sapphire-semantic-size-spacing-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-md) * 2)}.sapphire-list__item--interactive:disabled,.sapphire-list__item--interactive[aria-disabled=true],.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:not(:has(.sapphire-list__item--interactive)){box-shadow:inset 0 -1px 0 0 var(--sapphire-semantic-color-border-secondary)}.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:last-child .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:not(.sapphire-list__item--interactive):last-child,.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item,.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus)>.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus)>.sapphire-list__item-ineractive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus){box-shadow:none}.sapphire-list__item.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus).sapphire-list__item--without-divider{box-shadow:none}.sapphire-list__item--interactive.is-hover:not(.is-active):not(:has(.is-hover)),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):not(:has(:hover)):hover{background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-list__item-content-interactive:focus,.sapphire-list__item-content-interactive:focus-visible{outline:none}.sapphire-list__item--interactive.is-focus,.sapphire-list__item--interactive:not(.js-focus):focus{outline:none;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);border:0;border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-list__item--interactive:not(.is-disabled).is-active:not(:has(.is-active)),.sapphire-list__item--interactive:not([aria-disabled=true]):not(:disabled):not(:has(:active)):active{background-color:var(--sapphire-semantic-color-background-action-secondary-hover)}.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive:active,.sapphire-list__item--interactive:focus-visible{background:inherit}.sapphire-list__item-content-left{display:flex;align-items:center;margin-right:var(--sapphire-semantic-size-spacing-sm);min-width:0;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-content-right{display:flex;align-items:center;text-align:right;margin-left:var(--sapphire-semantic-size-spacing-sm);color:var(--sapphire-semantic-color-foreground-primary);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-text{display:flex;flex-direction:column;font-family:var(--sapphire-semantic-font-name-default);min-width:0;overflow-wrap:break-word}.sapphire-list__item-text--reversedOrder{flex-direction:column-reverse}.sapphire-list__item-text-primary{color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-md);font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-list__item-text-secondary{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}\n"] });
|
|
9674
|
+
ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListComponent, isStandalone: true, selector: "[sp-list]", inputs: { hideLastDivider: "hideLastDivider", hasNegativeSideMargin: "hasNegativeSideMargin" }, host: { properties: { "class.sapphire-list--without-last-divider": "hideLastDivider", "class.sapphire-list--negative-margin-self": "hasNegativeSideMargin", "attr.role": "!isListElement ? \"list\" : undefined" }, classAttribute: "sapphire-list" }, providers: [ViewEncapsulationProvider], queries: [{ propertyName: "listItems", predicate: i0.forwardRef(function () { return ListItemComponent; }), descendants: true }], hostDirectives: [{ directive: UseComponentStylesOnHost }], ngImport: i0, template: `<ng-content></ng-content>`, isInline: true, styles: [".sapphire-list{box-sizing:border-box;width:100%;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;list-style:none}.sapphire-list__item{position:relative;display:flex;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);background:var(--sapphire-semantic-color-background-action-tertiary-default);outline:none;font-family:var(--sapphire-semantic-font-name-default)}.sapphire-list__item--interactive{border:none;outline:none;text-decoration:none;box-sizing:border-box;width:100%;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:ease-in-out;cursor:pointer}.sapphire-list__item:has(.sapphire-list__item--interactive){padding:0}.sapphire-list__item:focus-within{z-index:1}.sapphire-list__item>.sapphire-list__item--interactive{display:flex;justify-content:space-between;width:100%;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);text-decoration:none;background:inherit;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;border:none;text-align:inherit;align-items:inherit}.sapphire-list--negative-margin-self{margin-left:calc(var(--sapphire-semantic-size-spacing-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-md) * 2)}.sapphire-list__item--interactive:disabled,.sapphire-list__item--interactive[aria-disabled=true],.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:not(:has(.sapphire-list__item--interactive)){box-shadow:inset 0 -1px 0 0 var(--sapphire-semantic-color-border-secondary)}.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:last-child .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:not(.sapphire-list__item--interactive):last-child,.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item,.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus)>.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus)>.sapphire-list__item-ineractive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus){box-shadow:none}.sapphire-list__item.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus).sapphire-list__item--without-divider{box-shadow:none}.sapphire-list__item--interactive.is-hover:not(.is-active):not(:has(.is-hover)),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):not(:has(:hover)):hover{background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-list__item-content-interactive:focus,.sapphire-list__item-content-interactive:focus-visible{outline:none}.sapphire-list__item--interactive.is-focus,.sapphire-list__item--interactive:not(.js-focus):focus{outline:none;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);border:0;border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-list__item--interactive:not(.is-disabled).is-active:not(:has(.is-active)),.sapphire-list__item--interactive:not([aria-disabled=true]):not(:disabled):not(:has(:active)):active{background-color:var(--sapphire-semantic-color-background-action-secondary-hover)}.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive:active,.sapphire-list__item--interactive:focus-visible{background:inherit}.sapphire-list__item-content-left{display:flex;align-items:center;margin-right:var(--sapphire-semantic-size-spacing-sm);min-width:0;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-content-right{display:flex;align-items:center;text-align:right;margin-left:var(--sapphire-semantic-size-spacing-sm);color:var(--sapphire-semantic-color-foreground-primary);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-text{display:flex;flex-direction:column;font-family:var(--sapphire-semantic-font-name-default);min-width:0;overflow-wrap:break-word;gap:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-list__item-text-label{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-list__item-text--reversedOrder{flex-direction:column-reverse}.sapphire-list__item-text-primary{color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-md);font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-list__item-text-secondary{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}\n"] });
|
|
9548
9675
|
__decorate([
|
|
9549
9676
|
CoerceBoolean
|
|
9550
9677
|
], ListComponent.prototype, "hideLastDivider", void 0);
|
|
@@ -9558,7 +9685,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9558
9685
|
'[class.sapphire-list--without-last-divider]': 'hideLastDivider',
|
|
9559
9686
|
'[class.sapphire-list--negative-margin-self]': 'hasNegativeSideMargin',
|
|
9560
9687
|
'[attr.role]': `!isListElement ? "list" : undefined`,
|
|
9561
|
-
}, hostDirectives: [UseComponentStylesOnHost], providers: [ViewEncapsulationProvider], imports: [UseComponentStylesOnHost], styles: [".sapphire-list{box-sizing:border-box;width:100%;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;list-style:none}.sapphire-list__item{position:relative;display:flex;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);background:var(--sapphire-semantic-color-background-action-tertiary-default);outline:none;font-family:var(--sapphire-semantic-font-name-default)}.sapphire-list__item--interactive{border:none;outline:none;text-decoration:none;box-sizing:border-box;width:100%;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:ease-in-out;cursor:pointer}.sapphire-list__item:has(.sapphire-list__item--interactive){padding:0}.sapphire-list__item:focus-within{z-index:1}.sapphire-list__item>.sapphire-list__item--interactive{display:flex;justify-content:space-between;width:100%;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);text-decoration:none;background:inherit;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;border:none;text-align:inherit;align-items:inherit}.sapphire-list--negative-margin-self{margin-left:calc(var(--sapphire-semantic-size-spacing-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-md) * 2)}.sapphire-list__item--interactive:disabled,.sapphire-list__item--interactive[aria-disabled=true],.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:not(:has(.sapphire-list__item--interactive)){box-shadow:inset 0 -1px 0 0 var(--sapphire-semantic-color-border-secondary)}.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:last-child .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:not(.sapphire-list__item--interactive):last-child,.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item,.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus)>.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus)>.sapphire-list__item-ineractive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus){box-shadow:none}.sapphire-list__item.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus).sapphire-list__item--without-divider{box-shadow:none}.sapphire-list__item--interactive.is-hover:not(.is-active):not(:has(.is-hover)),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):not(:has(:hover)):hover{background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-list__item-content-interactive:focus,.sapphire-list__item-content-interactive:focus-visible{outline:none}.sapphire-list__item--interactive.is-focus,.sapphire-list__item--interactive:not(.js-focus):focus{outline:none;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);border:0;border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-list__item--interactive:not(.is-disabled).is-active:not(:has(.is-active)),.sapphire-list__item--interactive:not([aria-disabled=true]):not(:disabled):not(:has(:active)):active{background-color:var(--sapphire-semantic-color-background-action-secondary-hover)}.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive:active,.sapphire-list__item--interactive:focus-visible{background:inherit}.sapphire-list__item-content-left{display:flex;align-items:center;margin-right:var(--sapphire-semantic-size-spacing-sm);min-width:0;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-content-right{display:flex;align-items:center;text-align:right;margin-left:var(--sapphire-semantic-size-spacing-sm);color:var(--sapphire-semantic-color-foreground-primary);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-text{display:flex;flex-direction:column;font-family:var(--sapphire-semantic-font-name-default);min-width:0;overflow-wrap:break-word}.sapphire-list__item-text--reversedOrder{flex-direction:column-reverse}.sapphire-list__item-text-primary{color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-md);font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-list__item-text-secondary{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}\n"] }]
|
|
9688
|
+
}, hostDirectives: [UseComponentStylesOnHost], providers: [ViewEncapsulationProvider], imports: [UseComponentStylesOnHost], styles: [".sapphire-list{box-sizing:border-box;width:100%;padding:0;margin:0;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;list-style:none}.sapphire-list__item{position:relative;display:flex;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);background:var(--sapphire-semantic-color-background-action-tertiary-default);outline:none;font-family:var(--sapphire-semantic-font-name-default)}.sapphire-list__item--interactive{border:none;outline:none;text-decoration:none;box-sizing:border-box;width:100%;transition-property:opacity,background-color,color;transition-duration:var(--sapphire-semantic-time-fade-quick);transition-timing-function:ease-in-out;cursor:pointer}.sapphire-list__item:has(.sapphire-list__item--interactive){padding:0}.sapphire-list__item:focus-within{z-index:1}.sapphire-list__item>.sapphire-list__item--interactive{display:flex;justify-content:space-between;width:100%;padding:var(--sapphire-semantic-size-spacing-sm) var(--sapphire-semantic-size-spacing-md);text-decoration:none;background:inherit;color:inherit;font-family:inherit;font-size:inherit;font-weight:inherit;border:none;text-align:inherit;align-items:inherit}.sapphire-list--negative-margin-self{margin-left:calc(var(--sapphire-semantic-size-spacing-md) * -1);width:calc(100% + var(--sapphire-semantic-size-spacing-md) * 2)}.sapphire-list__item--interactive:disabled,.sapphire-list__item--interactive[aria-disabled=true],.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive{cursor:not-allowed;opacity:var(--sapphire-semantic-opacity-disabled)}.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:not(:has(.sapphire-list__item--interactive)){box-shadow:inset 0 -1px 0 0 var(--sapphire-semantic-color-border-secondary)}.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:last-child .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider:not(:has([role=presentation] > [role=presentation])) .sapphire-list__item:not(.sapphire-list__item--interactive):last-child,.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item .sapphire-list__item--interactive:not(.is-focus):not(:focus),.sapphire-list--without-last-divider [role=presentation]:last-child>.sapphire-list__item,.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus)>.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus)>.sapphire-list__item-ineractive:not(.is-focus,:not(.js-focus):focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive.is-focus),.sapphire-list__item:has(+ .sapphire-list__item > .sapphire-list__item--interactive:not(.js-focus):focus){box-shadow:none}.sapphire-list__item.sapphire-list__item--interactive:not(.is-focus,:not(.js-focus):focus).sapphire-list__item--without-divider{box-shadow:none}.sapphire-list__item--interactive.is-hover:not(.is-active):not(:has(.is-hover)),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):not(:has(:hover)):hover{background:var(--sapphire-semantic-color-background-action-tertiary-hover)}.sapphire-list__item-content-interactive:focus,.sapphire-list__item-content-interactive:focus-visible{outline:none}.sapphire-list__item--interactive.is-focus,.sapphire-list__item--interactive:not(.js-focus):focus{outline:none;box-shadow:inset 0 0 0 var(--sapphire-semantic-size-focus-ring) var(--sapphire-semantic-color-focus-ring);border:0;border-radius:var(--sapphire-semantic-size-radius-sm)}.sapphire-list__item--interactive:not(.is-disabled).is-active:not(:has(.is-active)),.sapphire-list__item--interactive:not([aria-disabled=true]):not(:disabled):not(:has(:active)):active{background-color:var(--sapphire-semantic-color-background-action-secondary-hover)}.sapphire-list__item[aria-disabled=true] .sapphire-list__item--interactive:active,.sapphire-list__item--interactive:focus-visible{background:inherit}.sapphire-list__item-content-left{display:flex;align-items:center;margin-right:var(--sapphire-semantic-size-spacing-sm);min-width:0;gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-content-right{display:flex;align-items:center;text-align:right;margin-left:var(--sapphire-semantic-size-spacing-sm);color:var(--sapphire-semantic-color-foreground-primary);gap:var(--sapphire-semantic-size-spacing-sm)}.sapphire-list__item-text{display:flex;flex-direction:column;font-family:var(--sapphire-semantic-font-name-default);min-width:0;overflow-wrap:break-word;gap:var(--sapphire-semantic-size-spacing-4xs)}.sapphire-list__item-text-label{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}.sapphire-list__item-text--reversedOrder{flex-direction:column-reverse}.sapphire-list__item-text-primary{color:var(--sapphire-semantic-color-foreground-primary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-md);font-weight:var(--sapphire-semantic-font-weight-default-medium)}.sapphire-list__item-text-secondary{color:var(--sapphire-semantic-color-foreground-secondary);line-height:var(--sapphire-semantic-size-line-height-md);font-size:var(--sapphire-semantic-size-font-body-sm)}\n"] }]
|
|
9562
9689
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { hideLastDivider: [{
|
|
9563
9690
|
type: Input
|
|
9564
9691
|
}], hasNegativeSideMargin: [{
|
|
@@ -9612,6 +9739,24 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9612
9739
|
}]
|
|
9613
9740
|
}] });
|
|
9614
9741
|
|
|
9742
|
+
class ListItemTextLabelComponent {
|
|
9743
|
+
}
|
|
9744
|
+
ListItemTextLabelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListItemTextLabelComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
9745
|
+
ListItemTextLabelComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListItemTextLabelComponent, isStandalone: true, selector: "sp-list-item-text-label", host: { classAttribute: "sapphire-list__item-text-label" }, hostDirectives: [{ directive: UseComponentStyles }], ngImport: i0, template: '<ng-content></ng-content>', isInline: true });
|
|
9746
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListItemTextLabelComponent, decorators: [{
|
|
9747
|
+
type: Component,
|
|
9748
|
+
args: [{
|
|
9749
|
+
selector: 'sp-list-item-text-label',
|
|
9750
|
+
standalone: true,
|
|
9751
|
+
host: {
|
|
9752
|
+
class: 'sapphire-list__item-text-label',
|
|
9753
|
+
},
|
|
9754
|
+
template: '<ng-content></ng-content>',
|
|
9755
|
+
hostDirectives: [UseComponentStyles],
|
|
9756
|
+
imports: [UseComponentStyles],
|
|
9757
|
+
}]
|
|
9758
|
+
}] });
|
|
9759
|
+
|
|
9615
9760
|
class ListItemTextPrimaryComponent {
|
|
9616
9761
|
}
|
|
9617
9762
|
ListItemTextPrimaryComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListItemTextPrimaryComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
@@ -9655,17 +9800,20 @@ SapphireListModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", vers
|
|
|
9655
9800
|
ListItemComponent,
|
|
9656
9801
|
ListItemContentComponent,
|
|
9657
9802
|
ListItemTextComponent,
|
|
9803
|
+
ListItemTextLabelComponent,
|
|
9658
9804
|
ListItemTextPrimaryComponent,
|
|
9659
9805
|
ListItemTextSecondaryComponent], exports: [ListComponent,
|
|
9660
9806
|
ListItemComponent,
|
|
9661
9807
|
ListItemContentComponent,
|
|
9662
9808
|
ListItemTextComponent,
|
|
9809
|
+
ListItemTextLabelComponent,
|
|
9663
9810
|
ListItemTextPrimaryComponent,
|
|
9664
9811
|
ListItemTextSecondaryComponent] });
|
|
9665
9812
|
SapphireListModule.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SapphireListModule, imports: [ListComponent,
|
|
9666
9813
|
ListItemComponent,
|
|
9667
9814
|
ListItemContentComponent,
|
|
9668
9815
|
ListItemTextComponent,
|
|
9816
|
+
ListItemTextLabelComponent,
|
|
9669
9817
|
ListItemTextPrimaryComponent,
|
|
9670
9818
|
ListItemTextSecondaryComponent] });
|
|
9671
9819
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SapphireListModule, decorators: [{
|
|
@@ -9677,6 +9825,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9677
9825
|
ListItemComponent,
|
|
9678
9826
|
ListItemContentComponent,
|
|
9679
9827
|
ListItemTextComponent,
|
|
9828
|
+
ListItemTextLabelComponent,
|
|
9680
9829
|
ListItemTextPrimaryComponent,
|
|
9681
9830
|
ListItemTextSecondaryComponent,
|
|
9682
9831
|
],
|
|
@@ -9685,6 +9834,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9685
9834
|
ListItemComponent,
|
|
9686
9835
|
ListItemContentComponent,
|
|
9687
9836
|
ListItemTextComponent,
|
|
9837
|
+
ListItemTextLabelComponent,
|
|
9688
9838
|
ListItemTextPrimaryComponent,
|
|
9689
9839
|
ListItemTextSecondaryComponent,
|
|
9690
9840
|
],
|
|
@@ -9878,5 +10028,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
9878
10028
|
* Generated bundle index. Do not edit.
|
|
9879
10029
|
*/
|
|
9880
10030
|
|
|
9881
|
-
export { AlertDialogActions, AlertDialogBody, AlertDialogComponent, AlertDialogHeading, AlertDialogIcon, AvatarComponent, BadgeComponent, BodyComponent, ButtonComponent, ButtonGroupComponent, ButtonIconDirective, CaptionComponent, CdkVirtualScrollViewportFixDirective, CheckboxChange, CheckboxComponent, CheckboxGroupComponent, ConfirmationDialogComponent, DEFAULT_BREAKPOINTS, DangerDialogComponent, DialogComponent, DialogTriggerDirective, FeedbackMessageActions, FeedbackMessageBody, FeedbackMessageComponent, FeedbackMessageHeading, FeedbackMessageIcon, FieldComponent, FieldControl, FieldErrorDirective, FieldLabelDirective, FieldNoteDirective, FieldNoteSuffixDirective, FocusedDirective, HeadingComponent, HelpButtonComponent, HelpButtonContentDirective, HelpButtonFooterDirective, HelpButtonHeaderDirective, ICON_SIZE_PROVIDER, IconButtonComponent, IconComponent, IconRegistry, LabelComponent, LinkComponent, ListComponent, ListItemComponent, ListItemContentComponent, ListItemTextComponent, ListItemTextPrimaryComponent, ListItemTextSecondaryComponent, ListboxChild, ListboxComponent, ListboxInputDirective, MenuComponent, MenuIconComponent, MenuItemComponent, MenuPrimaryTextComponent, MenuSecondaryTextComponent, MenuSectionComponent, MenuTriggerDirective, ModalBackButtonDirective, ModalBodyComponent, ModalCloseButtonDirective, ModalFooterComponent, ModalFooterDirective, ModalHeaderComponent, ModalHeaderDirective, ModalLayoutComponent, ModalSectionComponent, ModalSectionTitleDirective, ModalService, MultiSelectDirective, NotificationBadgeComponent, OptionComponent, OptionIconDirective, OptionPrimaryTextDirective, OptionSecondaryTextDirective, POPOVER_TRIGGER, PaginationComponent, PanelComponent, PanelTriggerDirective, PopoverCloseButtonDirective, PopoverComponent, PopoverTitleDirective, PopoverTriggerDirective, PressedDirective, RadioComponent, RadioGroupComponent, SapphireAvatarModule, SapphireBadgeModule, SapphireButtonModule, SapphireCheckboxModule, SapphireCheckboxRequiredValidator, SapphireCoreModule, SapphireFeedbackMessageModule, SapphireFieldModule, SapphireHelpButtonModule, SapphireIconModule, SapphireLinkModule, SapphireListModule, SapphireListboxModule, SapphireMenuModule, SapphireModalModule, SapphireNotificationBadgeModule, SapphireOverlay, SapphirePaginationChange, SapphirePaginationModule, SapphirePopoverModule, SapphireRadioModule, SapphireSegmentedTabsModule, SapphireSelectModule, SapphireSkeletonModule, SapphireSpinnerModule, SapphireSurfaceModule, SapphireSwitchChange, SapphireSwitchModule, SapphireSwitchRequiredValidator, SapphireTableModule, SapphireTextFieldModule, SapphireThemeModule, SapphireToggleButtonRequiredValidator, SapphireTooltipModule, SapphireTypographyModule, ScrollMonitorDirective, SearchableSelectDirective, SectionDirective, SegmentedRadioComponent, SegmentedRadioGroupComponent, SegmentedTabComponent, SegmentedTabContentDirective, SegmentedTabLabelDirective, SegmentedTabsComponent, SelectButtonComponent, SelectButtonSingleSelectDirective, SelectComponent, SelectionTextDirective, SingleSelectDirective, SkeletonBlockDirective, SkeletonCircleDirective, SkeletonComponent, SkeletonTextDirective, SpinnerComponent, SubheadingComponent, SurfaceComponent, SwitchComponent, TableBodyDirective, TableCellDirective, TableComponent, TableDirective, TableFooterDirective, TableHeadCellComponent, TableHeadDirective, TableRowDirective, TableSortDirective, TableSortHeaderDirective, TextFieldComponent, TextFieldInputDirective, TextFieldPostfixDirective, TextFieldPrefixDirective, TextFieldTextareaAutosizeDirective, ThemeBaseDirective, ThemeCheckDirective, ThemeDefault, ThemeDefaultDark, ThemeRootDirective, ToggleButtonComponent, TooltipComponent, TooltipDirective, TranslatePipe, TranslateService, TruncatedWithTooltipDirective, UseComponentStyles, UseComponentStylesOnHost, ViewEncapsulationProvider };
|
|
10031
|
+
export { AlertDialogActions, AlertDialogBody, AlertDialogComponent, AlertDialogHeading, AlertDialogIcon, AvatarComponent, BadgeComponent, BodyComponent, ButtonComponent, ButtonGroupComponent, ButtonIconDirective, CaptionComponent, CdkVirtualScrollViewportFixDirective, CheckboxChange, CheckboxComponent, CheckboxGroupComponent, ConfirmationDialogComponent, DEFAULT_BREAKPOINTS, DangerDialogComponent, DialogComponent, DialogTriggerDirective, FeedbackMessageActions, FeedbackMessageBody, FeedbackMessageComponent, FeedbackMessageHeading, FeedbackMessageIcon, FieldComponent, FieldControl, FieldErrorDirective, FieldLabelDirective, FieldNoteDirective, FieldNoteSuffixDirective, FocusedDirective, HeadingComponent, HelpButtonComponent, HelpButtonContentDirective, HelpButtonFooterDirective, HelpButtonHeaderDirective, ICON_SIZE_PROVIDER, IconButtonComponent, IconComponent, IconRegistry, LabelComponent, LinkComponent, ListComponent, ListItemComponent, ListItemContentComponent, ListItemTextComponent, ListItemTextLabelComponent, ListItemTextPrimaryComponent, ListItemTextSecondaryComponent, ListboxChild, ListboxComponent, ListboxInputDirective, MenuComponent, MenuIconComponent, MenuItemComponent, MenuPrimaryTextComponent, MenuSecondaryTextComponent, MenuSectionComponent, MenuTriggerDirective, ModalBackButtonDirective, ModalBodyComponent, ModalCloseButtonDirective, ModalFooterComponent, ModalFooterDirective, ModalHeaderComponent, ModalHeaderDirective, ModalHeaderExtraDirective, ModalHeaderProgressDirective, ModalLayoutComponent, ModalSectionComponent, ModalSectionTitleDirective, ModalService, MultiSelectDirective, NotificationBadgeComponent, OptionComponent, OptionIconDirective, OptionPrimaryTextDirective, OptionSecondaryTextDirective, POPOVER_TRIGGER, PaginationComponent, PanelComponent, PanelTriggerDirective, PopoverCloseButtonDirective, PopoverComponent, PopoverTitleDirective, PopoverTriggerDirective, PressedDirective, RadioComponent, RadioGroupComponent, SapphireAvatarModule, SapphireBadgeModule, SapphireButtonModule, SapphireCheckboxModule, SapphireCheckboxRequiredValidator, SapphireCoreModule, SapphireFeedbackMessageModule, SapphireFieldModule, SapphireHelpButtonModule, SapphireIconModule, SapphireLinkModule, SapphireListModule, SapphireListboxModule, SapphireMenuModule, SapphireModalModule, SapphireNotificationBadgeModule, SapphireOverlay, SapphirePaginationChange, SapphirePaginationModule, SapphirePopoverModule, SapphireRadioModule, SapphireSegmentedTabsModule, SapphireSelectModule, SapphireSkeletonModule, SapphireSpinnerModule, SapphireSurfaceModule, SapphireSwitchChange, SapphireSwitchModule, SapphireSwitchRequiredValidator, SapphireTableModule, SapphireTextFieldModule, SapphireThemeModule, SapphireToggleButtonRequiredValidator, SapphireTooltipModule, SapphireTypographyModule, ScrollMonitorDirective, SearchableSelectDirective, SectionDirective, SegmentedRadioComponent, SegmentedRadioGroupComponent, SegmentedTabComponent, SegmentedTabContentDirective, SegmentedTabLabelDirective, SegmentedTabsComponent, SelectButtonComponent, SelectButtonSingleSelectDirective, SelectComponent, SelectionTextDirective, SingleSelectDirective, SkeletonBlockDirective, SkeletonCircleDirective, SkeletonComponent, SkeletonTextDirective, SpinnerComponent, SubheadingComponent, SurfaceComponent, SwitchComponent, TableBodyDirective, TableCellDirective, TableComponent, TableDirective, TableFooterDirective, TableHeadCellComponent, TableHeadDirective, TableRowDirective, TableSortDirective, TableSortHeaderDirective, TextFieldComponent, TextFieldInputDirective, TextFieldPostfixDirective, TextFieldPrefixDirective, TextFieldTextareaAutosizeDirective, ThemeBaseDirective, ThemeCheckDirective, ThemeDefault, ThemeDefaultDark, ThemeRootDirective, ToggleButtonComponent, TooltipComponent, TooltipDirective, TranslatePipe, TranslateService, TruncatedWithTooltipDirective, UseComponentStyles, UseComponentStylesOnHost, ViewEncapsulationProvider };
|
|
9882
10032
|
//# sourceMappingURL=danske-sapphire-angular.mjs.map
|