@danske/sapphire-angular 3.2.0 → 3.3.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.component.mjs +2 -2
- package/esm2020/lib/button/src/toggle-button.component.mjs +2 -2
- package/esm2020/lib/field/src/field.component.mjs +2 -2
- package/esm2020/lib/icon/src/icon.component.mjs +3 -3
- package/esm2020/lib/label/src/label.component.mjs +3 -3
- package/esm2020/lib/link/src/link.component.mjs +2 -2
- package/esm2020/lib/list/src/list.component.mjs +15 -3
- package/esm2020/lib/modal/public_api.mjs +3 -1
- package/esm2020/lib/modal/src/layout/modal-layout.component.mjs +2 -2
- package/esm2020/lib/modal/src/layout/modal-section-title.directive.mjs +14 -0
- package/esm2020/lib/modal/src/layout/modal-section.component.mjs +25 -0
- package/esm2020/lib/modal/src/modal.module.mjs +14 -2
- package/esm2020/lib/modal/src/panel/panel.component.mjs +2 -2
- package/esm2020/lib/select/src/select/select.component.mjs +2 -2
- package/esm2020/lib/select/src/select-button/select-button.component.mjs +2 -2
- package/esm2020/lib/text-field/src/text-field.component.mjs +2 -2
- package/esm2020/lib/theme/src/themes.mjs +4 -4
- package/esm2020/lib/typography/src/body.component.mjs +2 -2
- package/esm2020/lib/typography/src/caption.component.mjs +2 -2
- package/esm2020/lib/typography/src/heading.component.mjs +2 -2
- package/esm2020/lib/typography/src/subheading.component.mjs +2 -2
- package/fesm2015/danske-sapphire-angular.mjs +88 -726
- package/fesm2015/danske-sapphire-angular.mjs.map +1 -1
- package/fesm2020/danske-sapphire-angular.mjs +88 -726
- package/fesm2020/danske-sapphire-angular.mjs.map +1 -1
- package/lib/list/src/list.component.d.ts +7 -1
- package/lib/modal/public_api.d.ts +2 -0
- package/lib/modal/src/layout/modal-section-title.directive.d.ts +5 -0
- package/lib/modal/src/layout/modal-section.component.d.ts +8 -0
- package/lib/modal/src/modal.module.d.ts +19 -17
- package/package.json +4 -4
- package/esm2020/lib/icon/src/svgSanitizer.mjs +0 -690
- package/lib/icon/src/svgSanitizer.d.ts +0 -1
|
@@ -9,6 +9,12 @@ export class ListComponent {
|
|
|
9
9
|
constructor(elementRef) {
|
|
10
10
|
this.elementRef = elementRef;
|
|
11
11
|
this.hideLastDivider = false;
|
|
12
|
+
/**
|
|
13
|
+
* Counter acts the side padding of the parent element, so that List is shifted to the left with same amount
|
|
14
|
+
* and having side padding * 2 added to width – resulting in full width List.
|
|
15
|
+
* Useful in scenarions where List is inside a padded container and desired layout has List going from edge to edge horizontally.
|
|
16
|
+
*/
|
|
17
|
+
this.hasNegativeSideMargin = false;
|
|
12
18
|
this.listItems = new QueryList();
|
|
13
19
|
}
|
|
14
20
|
get isListElement() {
|
|
@@ -17,21 +23,27 @@ export class ListComponent {
|
|
|
17
23
|
}
|
|
18
24
|
}
|
|
19
25
|
ListComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
20
|
-
ListComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ListComponent, isStandalone: true, selector: "[sp-list]", inputs: { hideLastDivider: "hideLastDivider" }, host: { properties: { "class.sapphire-list--without-last-divider": "hideLastDivider", "attr.role": "!isListElement ? \"list\" : undefined" }, classAttribute: "sapphire-list" }, providers: [ViewEncapsulationProvider], queries: [{ propertyName: "listItems", predicate: i0.forwardRef(function () { return ListItemComponent; }), descendants: true }], hostDirectives: [{ directive: i1.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),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):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
|
|
26
|
+
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: i1.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"] });
|
|
21
27
|
__decorate([
|
|
22
28
|
CoerceBoolean
|
|
23
29
|
], ListComponent.prototype, "hideLastDivider", void 0);
|
|
30
|
+
__decorate([
|
|
31
|
+
CoerceBoolean
|
|
32
|
+
], ListComponent.prototype, "hasNegativeSideMargin", void 0);
|
|
24
33
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ListComponent, decorators: [{
|
|
25
34
|
type: Component,
|
|
26
35
|
args: [{ selector: '[sp-list]', standalone: true, template: `<ng-content></ng-content>`, host: {
|
|
27
36
|
class: 'sapphire-list',
|
|
28
37
|
'[class.sapphire-list--without-last-divider]': 'hideLastDivider',
|
|
38
|
+
'[class.sapphire-list--negative-margin-self]': 'hasNegativeSideMargin',
|
|
29
39
|
'[attr.role]': `!isListElement ? "list" : undefined`,
|
|
30
|
-
}, 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),.sapphire-list__item--interactive:not(.js-hover):not([aria-disabled=true]):not(:disabled):not(:active):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
|
|
40
|
+
}, 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"] }]
|
|
31
41
|
}], ctorParameters: function () { return [{ type: i0.ElementRef }]; }, propDecorators: { hideLastDivider: [{
|
|
32
42
|
type: Input
|
|
43
|
+
}], hasNegativeSideMargin: [{
|
|
44
|
+
type: Input
|
|
33
45
|
}], listItems: [{
|
|
34
46
|
type: ContentChildren,
|
|
35
47
|
args: [forwardRef(() => ListItemComponent), { descendants: true }]
|
|
36
48
|
}] } });
|
|
37
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
49
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibGlzdC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9zcmMvbGliL2xpc3Qvc3JjL2xpc3QuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7QUFDQSxPQUFPLEVBQ0wsU0FBUyxFQUNULGVBQWUsRUFFZixVQUFVLEVBQ1YsS0FBSyxFQUNMLFNBQVMsR0FDVixNQUFNLGVBQWUsQ0FBQztBQUN2QixPQUFPLEVBQUUsYUFBYSxFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDdEUsT0FBTyxFQUNMLHdCQUF3QixFQUN4Qix5QkFBeUIsR0FDMUIsTUFBTSwwQ0FBMEMsQ0FBQztBQUNsRCxPQUFPLEVBQUUsaUJBQWlCLEVBQUUsTUFBTSx1QkFBdUIsQ0FBQzs7O0FBaUIxRCxNQUFNLE9BQU8sYUFBYTtJQUN4QixZQUFvQixVQUFtQztRQUFuQyxlQUFVLEdBQVYsVUFBVSxDQUF5QjtRQVN2RCxvQkFBZSxHQUFpQixLQUFLLENBQUM7UUFFdEM7Ozs7V0FJRztRQUdILDBCQUFxQixHQUFrQixLQUFLLENBQUM7UUFHcEMsY0FBUyxHQUFpQyxJQUFJLFNBQVMsRUFBRSxDQUFDO0lBckJULENBQUM7SUFFM0QsSUFBSSxhQUFhO1FBQ2YsTUFBTSxXQUFXLEdBQUcsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUM7UUFDbEQsT0FBTyxXQUFXLENBQUMsT0FBTyxLQUFLLElBQUksSUFBSSxXQUFXLENBQUMsT0FBTyxLQUFLLElBQUksQ0FBQztJQUN0RSxDQUFDOzswR0FOVSxhQUFhOzhGQUFiLGFBQWEsK1lBSGIsQ0FBQyx5QkFBeUIsQ0FBQyx1RkF3QkosaUJBQWlCLGtIQWpDekMsMkJBQTJCO0FBc0JyQztJQURDLGFBQWE7c0RBQ3dCO0FBU3RDO0lBREMsYUFBYTs0REFDK0I7MkZBbkJsQyxhQUFhO2tCQWZ6QixTQUFTOytCQUNFLFdBQVcsY0FDVCxJQUFJLFlBQ04sMkJBQTJCLFFBRS9CO3dCQUNKLEtBQUssRUFBRSxlQUFlO3dCQUN0Qiw2Q0FBNkMsRUFBRSxpQkFBaUI7d0JBQ2hFLDZDQUE2QyxFQUFFLHVCQUF1Qjt3QkFDdEUsYUFBYSxFQUFFLHFDQUFxQztxQkFDckQsa0JBQ2UsQ0FBQyx3QkFBd0IsQ0FBQyxhQUMvQixDQUFDLHlCQUF5QixDQUFDLFdBQzdCLENBQUMsd0JBQXdCLENBQUM7aUdBWW5DLGVBQWU7c0JBRmQsS0FBSztnQkFXTixxQkFBcUI7c0JBRnBCLEtBQUs7Z0JBS0csU0FBUztzQkFEakIsZUFBZTt1QkFBQyxVQUFVLENBQUMsR0FBRyxFQUFFLENBQUMsaUJBQWlCLENBQUMsRUFBRSxFQUFFLFdBQVcsRUFBRSxJQUFJLEVBQUUiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBCb29sZWFuSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jZGsvY29lcmNpb24nO1xuaW1wb3J0IHtcbiAgQ29tcG9uZW50LFxuICBDb250ZW50Q2hpbGRyZW4sXG4gIEVsZW1lbnRSZWYsXG4gIGZvcndhcmRSZWYsXG4gIElucHV0LFxuICBRdWVyeUxpc3QsXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29lcmNlQm9vbGVhbiB9IGZyb20gJy4uLy4uL2NvbW1vbi9jb2VyY2UtYm9vbGVhbi5kZWNvcmF0b3InO1xuaW1wb3J0IHtcbiAgVXNlQ29tcG9uZW50U3R5bGVzT25Ib3N0LFxuICBWaWV3RW5jYXBzdWxhdGlvblByb3ZpZGVyLFxufSBmcm9tICcuLi8uLi9jb21tb24vc2FwcGhpcmUtdmlldy1lbmNhcHN1bGF0aW9uJztcbmltcG9ydCB7IExpc3RJdGVtQ29tcG9uZW50IH0gZnJvbSAnLi9saXN0LWl0ZW0uY29tcG9uZW50JztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnW3NwLWxpc3RdJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgdGVtcGxhdGU6IGA8bmctY29udGVudD48L25nLWNvbnRlbnQ+YCxcbiAgc3R5bGVVcmxzOiBbJy4vbGlzdC5jb21wb25lbnQuc2NzcyddLFxuICBob3N0OiB7XG4gICAgY2xhc3M6ICdzYXBwaGlyZS1saXN0JyxcbiAgICAnW2NsYXNzLnNhcHBoaXJlLWxpc3QtLXdpdGhvdXQtbGFzdC1kaXZpZGVyXSc6ICdoaWRlTGFzdERpdmlkZXInLFxuICAgICdbY2xhc3Muc2FwcGhpcmUtbGlzdC0tbmVnYXRpdmUtbWFyZ2luLXNlbGZdJzogJ2hhc05lZ2F0aXZlU2lkZU1hcmdpbicsXG4gICAgJ1thdHRyLnJvbGVdJzogYCFpc0xpc3RFbGVtZW50ID8gXCJsaXN0XCIgOiB1bmRlZmluZWRgLFxuICB9LFxuICBob3N0RGlyZWN0aXZlczogW1VzZUNvbXBvbmVudFN0eWxlc09uSG9zdF0sXG4gIHByb3ZpZGVyczogW1ZpZXdFbmNhcHN1bGF0aW9uUHJvdmlkZXJdLFxuICBpbXBvcnRzOiBbVXNlQ29tcG9uZW50U3R5bGVzT25Ib3N0XSxcbn0pXG5leHBvcnQgY2xhc3MgTGlzdENvbXBvbmVudCB7XG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZjxIVE1MRWxlbWVudD4pIHt9XG5cbiAgZ2V0IGlzTGlzdEVsZW1lbnQoKTogYm9vbGVhbiB7XG4gICAgY29uc3QgaG9zdEVsZW1lbnQgPSB0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudDtcbiAgICByZXR1cm4gaG9zdEVsZW1lbnQudGFnTmFtZSA9PT0gJ1VMJyB8fCBob3N0RWxlbWVudC50YWdOYW1lID09PSAnT0wnO1xuICB9XG5cbiAgQElucHV0KClcbiAgQENvZXJjZUJvb2xlYW5cbiAgaGlkZUxhc3REaXZpZGVyOiBCb29sZWFuSW5wdXQgPSBmYWxzZTtcblxuICAvKipcbiAgICogQ291bnRlciBhY3RzIHRoZSBzaWRlIHBhZGRpbmcgb2YgdGhlIHBhcmVudCBlbGVtZW50LCBzbyB0aGF0IExpc3QgaXMgc2hpZnRlZCB0byB0aGUgbGVmdCB3aXRoIHNhbWUgYW1vdW50XG4gICAqIGFuZCBoYXZpbmcgc2lkZSBwYWRkaW5nICogMiBhZGRlZCB0byB3aWR0aCDigJMgcmVzdWx0aW5nIGluIGZ1bGwgd2lkdGggTGlzdC5cbiAgICogVXNlZnVsIGluIHNjZW5hcmlvbnMgd2hlcmUgTGlzdCBpcyBpbnNpZGUgYSBwYWRkZWQgY29udGFpbmVyIGFuZCBkZXNpcmVkIGxheW91dCBoYXMgTGlzdCBnb2luZyBmcm9tIGVkZ2UgdG8gZWRnZSBob3Jpem9udGFsbHkuXG4gICAqL1xuICBASW5wdXQoKVxuICBAQ29lcmNlQm9vbGVhblxuICBoYXNOZWdhdGl2ZVNpZGVNYXJnaW4/OiBCb29sZWFuSW5wdXQgPSBmYWxzZTtcblxuICBAQ29udGVudENoaWxkcmVuKGZvcndhcmRSZWYoKCkgPT4gTGlzdEl0ZW1Db21wb25lbnQpLCB7IGRlc2NlbmRhbnRzOiB0cnVlIH0pXG4gIHJlYWRvbmx5IGxpc3RJdGVtczogUXVlcnlMaXN0PExpc3RJdGVtQ29tcG9uZW50PiA9IG5ldyBRdWVyeUxpc3QoKTtcbn1cbiJdfQ==
|
|
@@ -4,6 +4,8 @@ export * from './src/layout/modal-layout.component';
|
|
|
4
4
|
export * from './src/layout/modal-header.component';
|
|
5
5
|
export * from './src/layout/modal-footer.component';
|
|
6
6
|
export * from './src/layout/modal-body.component';
|
|
7
|
+
export * from './src/layout/modal-section.component';
|
|
8
|
+
export * from './src/layout/modal-section-title.directive';
|
|
7
9
|
export * from './src/layout/modal-header.component';
|
|
8
10
|
export * from './src/layout/modal-close-button.directive';
|
|
9
11
|
export * from './src/layout/modal-back-button.directive';
|
|
@@ -14,4 +16,4 @@ export * from './src/dialog/confirmation-dialog.component';
|
|
|
14
16
|
export * from './src/dialog/danger-dialog.component';
|
|
15
17
|
export * from './src/dialog/alert-dialog.component';
|
|
16
18
|
export * from './src/dialog/dialog-trigger.directive';
|
|
17
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljX2FwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uL3NyYy9saWIvbW9kYWwvcHVibGljX2FwaS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxjQUFjLHFCQUFxQixDQUFDO0FBQ3BDLGNBQWMsb0JBQW9CLENBQUM7QUFFbkMsY0FBYyxxQ0FBcUMsQ0FBQztBQUNwRCxjQUFjLHFDQUFxQyxDQUFDO0FBQ3BELGNBQWMscUNBQXFDLENBQUM7QUFDcEQsY0FBYyxtQ0FBbUMsQ0FBQztBQUNsRCxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMsNENBQTRDLENBQUM7QUFDM0QsY0FBYyxxQ0FBcUMsQ0FBQztBQUNwRCxjQUFjLDJDQUEyQyxDQUFDO0FBQzFELGNBQWMsMENBQTBDLENBQUM7QUFFekQsY0FBYyw2QkFBNkIsQ0FBQztBQUM1QyxjQUFjLHFDQUFxQyxDQUFDO0FBRXBELGNBQWMsK0JBQStCLENBQUM7QUFDOUMsY0FBYyw0Q0FBNEMsQ0FBQztBQUMzRCxjQUFjLHNDQUFzQyxDQUFDO0FBQ3JELGNBQWMscUNBQXFDLENBQUM7QUFDcEQsY0FBYyx1Q0FBdUMsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCAqIGZyb20gJy4vc3JjL21vZGFsLnNlcnZpY2UnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbW9kYWwubW9kdWxlJztcblxuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWxheW91dC5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWhlYWRlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWZvb3Rlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWJvZHkuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vc3JjL2xheW91dC9tb2RhbC1zZWN0aW9uLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL3NyYy9sYXlvdXQvbW9kYWwtc2VjdGlvbi10aXRsZS5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWhlYWRlci5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWNsb3NlLWJ1dHRvbi5kaXJlY3RpdmUnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvbGF5b3V0L21vZGFsLWJhY2stYnV0dG9uLmRpcmVjdGl2ZSc7XG5cbmV4cG9ydCAqIGZyb20gJy4vc3JjL3BhbmVsL3BhbmVsLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL3NyYy9wYW5lbC9wYW5lbC10cmlnZ2VyLmRpcmVjdGl2ZSc7XG5cbmV4cG9ydCAqIGZyb20gJy4vc3JjL2RpYWxvZy9kaWFsb2cuY29tcG9uZW50JztcbmV4cG9ydCAqIGZyb20gJy4vc3JjL2RpYWxvZy9jb25maXJtYXRpb24tZGlhbG9nLmNvbXBvbmVudCc7XG5leHBvcnQgKiBmcm9tICcuL3NyYy9kaWFsb2cvZGFuZ2VyLWRpYWxvZy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvZGlhbG9nL2FsZXJ0LWRpYWxvZy5jb21wb25lbnQnO1xuZXhwb3J0ICogZnJvbSAnLi9zcmMvZGlhbG9nL2RpYWxvZy10cmlnZ2VyLmRpcmVjdGl2ZSc7XG4iXX0=
|
|
@@ -5,11 +5,11 @@ import * as i1 from "../../../common/sapphire-view-encapsulation";
|
|
|
5
5
|
export class ModalLayoutComponent {
|
|
6
6
|
}
|
|
7
7
|
ModalLayoutComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalLayoutComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
8
|
-
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: i1.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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)}\n"] });
|
|
8
|
+
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: i1.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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"] });
|
|
9
9
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalLayoutComponent, decorators: [{
|
|
10
10
|
type: Component,
|
|
11
11
|
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: {
|
|
12
12
|
class: 'sapphire-modal-layout',
|
|
13
|
-
}, 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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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)}\n"] }]
|
|
13
|
+
}, 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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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"] }]
|
|
14
14
|
}] });
|
|
15
15
|
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwtbGF5b3V0LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3NyYy9saWIvbW9kYWwvc3JjL2xheW91dC9tb2RhbC1sYXlvdXQuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9tb2RhbC9zcmMvbGF5b3V0L21vZGFsLWxheW91dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQzFDLE9BQU8sRUFBRSx3QkFBd0IsRUFBRSxNQUFNLDZDQUE2QyxDQUFDOzs7QUFhdkYsTUFBTSxPQUFPLG9CQUFvQjs7aUhBQXBCLG9CQUFvQjtxR0FBcEIsb0JBQW9CLHdLQ2RqQyxvTUFHQTsyRkRXYSxvQkFBb0I7a0JBWGhDLFNBQVM7K0JBQ0UsaUJBQWlCLHdOQUdyQjt3QkFDSixLQUFLLEVBQUUsdUJBQXVCO3FCQUMvQixrQkFDZSxDQUFDLHdCQUF3QixDQUFDLGNBRTlCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFVzZUNvbXBvbmVudFN0eWxlc09uSG9zdCB9IGZyb20gJy4uLy4uLy4uL2NvbW1vbi9zYXBwaGlyZS12aWV3LWVuY2Fwc3VsYXRpb24nO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdzcC1tb2RhbC1sYXlvdXQnLFxuICB0ZW1wbGF0ZTogJzxuZy1jb250ZW50PjwvbmctY29udGVudD4nLFxuICB0ZW1wbGF0ZVVybDogJy4vbW9kYWwtbGF5b3V0LmNvbXBvbmVudC5odG1sJyxcbiAgaG9zdDoge1xuICAgIGNsYXNzOiAnc2FwcGhpcmUtbW9kYWwtbGF5b3V0JyxcbiAgfSxcbiAgaG9zdERpcmVjdGl2ZXM6IFtVc2VDb21wb25lbnRTdHlsZXNPbkhvc3RdLFxuICBzdHlsZVVybHM6IFsnLi9tb2RhbC1sYXlvdXQuY29tcG9uZW50LnNjc3MnXSxcbiAgc3RhbmRhbG9uZTogZmFsc2UsXG59KVxuZXhwb3J0IGNsYXNzIE1vZGFsTGF5b3V0Q29tcG9uZW50IHt9XG4iLCI8bmctY29udGVudCBzZWxlY3Q9XCJzcC1tb2RhbC1oZWFkZXIsIFtzcE1vZGFsSGVhZGVyXVwiPjwvbmctY29udGVudD5cbjxuZy1jb250ZW50IHNlbGVjdD1cInNwLW1vZGFsLWJvZHlcIj48L25nLWNvbnRlbnQ+XG48bmctY29udGVudCBzZWxlY3Q9XCJzcC1tb2RhbC1mb290ZXIsIFtzcE1vZGFsRm9vdGVyXVwiPjwvbmctY29udGVudD5cbiJdfQ==
|
|
@@ -0,0 +1,14 @@
|
|
|
1
|
+
import { Directive } from '@angular/core';
|
|
2
|
+
import * as i0 from "@angular/core";
|
|
3
|
+
export class ModalSectionTitleDirective {
|
|
4
|
+
}
|
|
5
|
+
ModalSectionTitleDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalSectionTitleDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
|
|
6
|
+
ModalSectionTitleDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "15.2.0", type: ModalSectionTitleDirective, selector: "sp-modal-section-title", ngImport: i0 });
|
|
7
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalSectionTitleDirective, decorators: [{
|
|
8
|
+
type: Directive,
|
|
9
|
+
args: [{
|
|
10
|
+
selector: 'sp-modal-section-title',
|
|
11
|
+
standalone: false,
|
|
12
|
+
}]
|
|
13
|
+
}] });
|
|
14
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwtc2VjdGlvbi10aXRsZS5kaXJlY3RpdmUuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL21vZGFsL3NyYy9sYXlvdXQvbW9kYWwtc2VjdGlvbi10aXRsZS5kaXJlY3RpdmUudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxNQUFNLGVBQWUsQ0FBQzs7QUFNMUMsTUFBTSxPQUFPLDBCQUEwQjs7dUhBQTFCLDBCQUEwQjsyR0FBMUIsMEJBQTBCOzJGQUExQiwwQkFBMEI7a0JBSnRDLFNBQVM7bUJBQUM7b0JBQ1QsUUFBUSxFQUFFLHdCQUF3QjtvQkFDbEMsVUFBVSxFQUFFLEtBQUs7aUJBQ2xCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBEaXJlY3RpdmUoe1xuICBzZWxlY3RvcjogJ3NwLW1vZGFsLXNlY3Rpb24tdGl0bGUnLFxuICBzdGFuZGFsb25lOiBmYWxzZSxcbn0pXG5leHBvcnQgY2xhc3MgTW9kYWxTZWN0aW9uVGl0bGVEaXJlY3RpdmUge31cbiJdfQ==
|
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
import { __decorate } from "tslib";
|
|
2
|
+
import { Component, Input } from '@angular/core';
|
|
3
|
+
import { UseComponentStyles } from '../../../common/sapphire-view-encapsulation';
|
|
4
|
+
import { CoerceBoolean } from '../../../common/coerce-boolean.decorator';
|
|
5
|
+
import * as i0 from "@angular/core";
|
|
6
|
+
import * as i1 from "../../../common/sapphire-view-encapsulation";
|
|
7
|
+
import * as i2 from "@angular/common";
|
|
8
|
+
import * as i3 from "../../../typography/src/body.component";
|
|
9
|
+
export class ModalSectionComponent {
|
|
10
|
+
constructor() {
|
|
11
|
+
this.isFormSection = false;
|
|
12
|
+
}
|
|
13
|
+
}
|
|
14
|
+
ModalSectionComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalSectionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
15
|
+
ModalSectionComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.2.0", type: ModalSectionComponent, selector: "sp-modal-section", inputs: { isFormSection: "isFormSection" }, hostDirectives: [{ directive: i1.UseComponentStyles }], ngImport: i0, template: "<ng-container *ngIf=\"isFormSection; else sectionBlock\">\n <fieldset _spUseComponentStyles class=\"sapphire-modal-layout__section\">\n <legend _spUseComponentStyles class=\"sapphire-modal-layout__section-title\">\n <ng-container [ngTemplateOutlet]=\"titleTpl\"></ng-container>\n </legend>\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\n </fieldset>\n</ng-container>\n\n<ng-template #sectionBlock>\n <section _spUseComponentStyles class=\"sapphire-modal-layout__section\">\n <header _spUseComponentStyles class=\"sapphire-modal-layout__section-title\">\n <ng-container [ngTemplateOutlet]=\"titleTpl\"></ng-container>\n </header>\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\n </section>\n</ng-template>\n\n<ng-template #contentTpl>\n <ng-content></ng-content>\n</ng-template>\n\n<ng-template #titleTpl>\n <h5 semibold=\"true\" sp-body size=\"sm\">\n <ng-content select=\"sp-modal-section-title\"></ng-content>\n </h5>\n</ng-template>\n", dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.BodyComponent, selector: "[sp-body]", inputs: ["size", "color", "bold", "semibold"] }, { kind: "directive", type: i1.UseComponentStyles, selector: "[_spUseComponentStyles]" }] });
|
|
16
|
+
__decorate([
|
|
17
|
+
CoerceBoolean
|
|
18
|
+
], ModalSectionComponent.prototype, "isFormSection", void 0);
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: ModalSectionComponent, decorators: [{
|
|
20
|
+
type: Component,
|
|
21
|
+
args: [{ selector: 'sp-modal-section', hostDirectives: [UseComponentStyles], standalone: false, template: "<ng-container *ngIf=\"isFormSection; else sectionBlock\">\n <fieldset _spUseComponentStyles class=\"sapphire-modal-layout__section\">\n <legend _spUseComponentStyles class=\"sapphire-modal-layout__section-title\">\n <ng-container [ngTemplateOutlet]=\"titleTpl\"></ng-container>\n </legend>\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\n </fieldset>\n</ng-container>\n\n<ng-template #sectionBlock>\n <section _spUseComponentStyles class=\"sapphire-modal-layout__section\">\n <header _spUseComponentStyles class=\"sapphire-modal-layout__section-title\">\n <ng-container [ngTemplateOutlet]=\"titleTpl\"></ng-container>\n </header>\n <ng-container [ngTemplateOutlet]=\"contentTpl\"></ng-container>\n </section>\n</ng-template>\n\n<ng-template #contentTpl>\n <ng-content></ng-content>\n</ng-template>\n\n<ng-template #titleTpl>\n <h5 semibold=\"true\" sp-body size=\"sm\">\n <ng-content select=\"sp-modal-section-title\"></ng-content>\n </h5>\n</ng-template>\n" }]
|
|
22
|
+
}], propDecorators: { isFormSection: [{
|
|
23
|
+
type: Input
|
|
24
|
+
}] } });
|
|
25
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwtc2VjdGlvbi5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL21vZGFsL3NyYy9sYXlvdXQvbW9kYWwtc2VjdGlvbi5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi9zcmMvbGliL21vZGFsL3NyYy9sYXlvdXQvbW9kYWwtc2VjdGlvbi5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiO0FBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFFakQsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sNkNBQTZDLENBQUM7QUFDakYsT0FBTyxFQUFFLGFBQWEsRUFBRSxNQUFNLDBDQUEwQyxDQUFDOzs7OztBQVF6RSxNQUFNLE9BQU8scUJBQXFCO0lBTmxDO1FBU0Usa0JBQWEsR0FBaUIsS0FBSyxDQUFDO0tBQ3JDOztrSEFKWSxxQkFBcUI7c0dBQXJCLHFCQUFxQiw0SkNYbEMsdy9CQTJCQTtBRGJFO0lBREMsYUFBYTs0REFDc0I7MkZBSHpCLHFCQUFxQjtrQkFOakMsU0FBUzsrQkFDRSxrQkFBa0Isa0JBQ1osQ0FBQyxrQkFBa0IsQ0FBQyxjQUV4QixLQUFLOzhCQUtqQixhQUFhO3NCQUZaLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBCb29sZWFuSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jZGsvY29lcmNpb24nO1xuaW1wb3J0IHsgVXNlQ29tcG9uZW50U3R5bGVzIH0gZnJvbSAnLi4vLi4vLi4vY29tbW9uL3NhcHBoaXJlLXZpZXctZW5jYXBzdWxhdGlvbic7XG5pbXBvcnQgeyBDb2VyY2VCb29sZWFuIH0gZnJvbSAnLi4vLi4vLi4vY29tbW9uL2NvZXJjZS1ib29sZWFuLmRlY29yYXRvcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3NwLW1vZGFsLXNlY3Rpb24nLFxuICBob3N0RGlyZWN0aXZlczogW1VzZUNvbXBvbmVudFN0eWxlc10sXG4gIHRlbXBsYXRlVXJsOiAnLi9tb2RhbC1zZWN0aW9uLmNvbXBvbmVudC5odG1sJyxcbiAgc3RhbmRhbG9uZTogZmFsc2UsXG59KVxuZXhwb3J0IGNsYXNzIE1vZGFsU2VjdGlvbkNvbXBvbmVudCB7XG4gIEBJbnB1dCgpXG4gIEBDb2VyY2VCb29sZWFuXG4gIGlzRm9ybVNlY3Rpb246IEJvb2xlYW5JbnB1dCA9IGZhbHNlO1xufVxuIiwiPG5nLWNvbnRhaW5lciAqbmdJZj1cImlzRm9ybVNlY3Rpb247IGVsc2Ugc2VjdGlvbkJsb2NrXCI+XG4gIDxmaWVsZHNldCBfc3BVc2VDb21wb25lbnRTdHlsZXMgY2xhc3M9XCJzYXBwaGlyZS1tb2RhbC1sYXlvdXRfX3NlY3Rpb25cIj5cbiAgICA8bGVnZW5kIF9zcFVzZUNvbXBvbmVudFN0eWxlcyBjbGFzcz1cInNhcHBoaXJlLW1vZGFsLWxheW91dF9fc2VjdGlvbi10aXRsZVwiPlxuICAgICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJ0aXRsZVRwbFwiPjwvbmctY29udGFpbmVyPlxuICAgIDwvbGVnZW5kPlxuICAgIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwiY29udGVudFRwbFwiPjwvbmctY29udGFpbmVyPlxuICA8L2ZpZWxkc2V0PlxuPC9uZy1jb250YWluZXI+XG5cbjxuZy10ZW1wbGF0ZSAjc2VjdGlvbkJsb2NrPlxuICA8c2VjdGlvbiBfc3BVc2VDb21wb25lbnRTdHlsZXMgY2xhc3M9XCJzYXBwaGlyZS1tb2RhbC1sYXlvdXRfX3NlY3Rpb25cIj5cbiAgICA8aGVhZGVyIF9zcFVzZUNvbXBvbmVudFN0eWxlcyBjbGFzcz1cInNhcHBoaXJlLW1vZGFsLWxheW91dF9fc2VjdGlvbi10aXRsZVwiPlxuICAgICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJ0aXRsZVRwbFwiPjwvbmctY29udGFpbmVyPlxuICAgIDwvaGVhZGVyPlxuICAgIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwiY29udGVudFRwbFwiPjwvbmctY29udGFpbmVyPlxuICA8L3NlY3Rpb24+XG48L25nLXRlbXBsYXRlPlxuXG48bmctdGVtcGxhdGUgI2NvbnRlbnRUcGw+XG4gIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbjwvbmctdGVtcGxhdGU+XG5cbjxuZy10ZW1wbGF0ZSAjdGl0bGVUcGw+XG4gIDxoNSBzZW1pYm9sZD1cInRydWVcIiBzcC1ib2R5IHNpemU9XCJzbVwiPlxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cInNwLW1vZGFsLXNlY3Rpb24tdGl0bGVcIj48L25nLWNvbnRlbnQ+XG4gIDwvaDU+XG48L25nLXRlbXBsYXRlPlxuIl19
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
import { NgModule } from '@angular/core';
|
|
2
|
-
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { CommonModule, NgIf } from '@angular/common';
|
|
3
3
|
import { DialogModule } from '@angular/cdk/dialog';
|
|
4
4
|
import { SapphireThemeModule } from '../../theme/public_api';
|
|
5
5
|
import { SapphireTypographyModule } from '../../typography/public_api';
|
|
@@ -10,6 +10,8 @@ import { DialogComponent } from './dialog/dialog.component';
|
|
|
10
10
|
import { ModalHeaderComponent, ModalHeaderDirective, } from './layout/modal-header.component';
|
|
11
11
|
import { ModalBodyComponent } from './layout/modal-body.component';
|
|
12
12
|
import { ModalFooterComponent, ModalFooterDirective, } from './layout/modal-footer.component';
|
|
13
|
+
import { ModalSectionComponent } from './layout/modal-section.component';
|
|
14
|
+
import { ModalSectionTitleDirective } from './layout/modal-section-title.directive';
|
|
13
15
|
import { DialogTriggerDirective } from './dialog/dialog-trigger.directive';
|
|
14
16
|
import { ConfirmationDialogComponent } from './dialog/confirmation-dialog.component';
|
|
15
17
|
import { DangerDialogComponent } from './dialog/danger-dialog.component';
|
|
@@ -31,6 +33,8 @@ SapphireModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
|
|
|
31
33
|
ModalFooterComponent,
|
|
32
34
|
ModalCloseButtonDirective,
|
|
33
35
|
ModalBackButtonDirective,
|
|
36
|
+
ModalSectionComponent,
|
|
37
|
+
ModalSectionTitleDirective,
|
|
34
38
|
DialogComponent,
|
|
35
39
|
DialogTriggerDirective,
|
|
36
40
|
ConfirmationDialogComponent,
|
|
@@ -42,6 +46,7 @@ SapphireModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
|
|
|
42
46
|
AlertDialogActions,
|
|
43
47
|
PanelComponent,
|
|
44
48
|
PanelTriggerDirective], imports: [CommonModule,
|
|
49
|
+
NgIf,
|
|
45
50
|
DialogModule,
|
|
46
51
|
SapphireThemeModule,
|
|
47
52
|
SapphireTypographyModule,
|
|
@@ -59,6 +64,8 @@ SapphireModalModule.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", ver
|
|
|
59
64
|
ModalFooterDirective,
|
|
60
65
|
ModalBackButtonDirective,
|
|
61
66
|
ModalCloseButtonDirective,
|
|
67
|
+
ModalSectionComponent,
|
|
68
|
+
ModalSectionTitleDirective,
|
|
62
69
|
DialogComponent,
|
|
63
70
|
DialogTriggerDirective,
|
|
64
71
|
ConfirmationDialogComponent,
|
|
@@ -87,6 +94,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
87
94
|
ModalFooterComponent,
|
|
88
95
|
ModalCloseButtonDirective,
|
|
89
96
|
ModalBackButtonDirective,
|
|
97
|
+
ModalSectionComponent,
|
|
98
|
+
ModalSectionTitleDirective,
|
|
90
99
|
DialogComponent,
|
|
91
100
|
DialogTriggerDirective,
|
|
92
101
|
ConfirmationDialogComponent,
|
|
@@ -101,6 +110,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
101
110
|
],
|
|
102
111
|
imports: [
|
|
103
112
|
CommonModule,
|
|
113
|
+
NgIf,
|
|
104
114
|
DialogModule,
|
|
105
115
|
SapphireThemeModule,
|
|
106
116
|
SapphireTypographyModule,
|
|
@@ -121,6 +131,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
121
131
|
ModalFooterDirective,
|
|
122
132
|
ModalBackButtonDirective,
|
|
123
133
|
ModalCloseButtonDirective,
|
|
134
|
+
ModalSectionComponent,
|
|
135
|
+
ModalSectionTitleDirective,
|
|
124
136
|
DialogComponent,
|
|
125
137
|
DialogTriggerDirective,
|
|
126
138
|
ConfirmationDialogComponent,
|
|
@@ -135,4 +147,4 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
135
147
|
],
|
|
136
148
|
}]
|
|
137
149
|
}] });
|
|
138
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
150
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwubW9kdWxlLmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vc3JjL2xpYi9tb2RhbC9zcmMvbW9kYWwubW9kdWxlLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxRQUFRLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDekMsT0FBTyxFQUFFLFlBQVksRUFBRSxJQUFJLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUNyRCxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0scUJBQXFCLENBQUM7QUFDbkQsT0FBTyxFQUFFLG1CQUFtQixFQUFFLE1BQU0sd0JBQXdCLENBQUM7QUFDN0QsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sNkJBQTZCLENBQUM7QUFDdkUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sdUJBQXVCLENBQUM7QUFDM0QsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDL0QsT0FBTyxFQUFFLHNCQUFzQixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDL0UsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLDJCQUEyQixDQUFDO0FBQzVELE9BQU8sRUFDTCxvQkFBb0IsRUFDcEIsb0JBQW9CLEdBQ3JCLE1BQU0saUNBQWlDLENBQUM7QUFDekMsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sK0JBQStCLENBQUM7QUFDbkUsT0FBTyxFQUNMLG9CQUFvQixFQUNwQixvQkFBb0IsR0FDckIsTUFBTSxpQ0FBaUMsQ0FBQztBQUN6QyxPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUN6RSxPQUFPLEVBQUUsMEJBQTBCLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUNwRixPQUFPLEVBQUUsc0JBQXNCLEVBQUUsTUFBTSxtQ0FBbUMsQ0FBQztBQUMzRSxPQUFPLEVBQUUsMkJBQTJCLEVBQUUsTUFBTSx3Q0FBd0MsQ0FBQztBQUNyRixPQUFPLEVBQUUscUJBQXFCLEVBQUUsTUFBTSxrQ0FBa0MsQ0FBQztBQUN6RSxPQUFPLEVBQ0wsa0JBQWtCLEVBQ2xCLGVBQWUsRUFDZixvQkFBb0IsRUFDcEIsa0JBQWtCLEVBQ2xCLGVBQWUsR0FDaEIsTUFBTSxpQ0FBaUMsQ0FBQztBQUN6QyxPQUFPLEVBQUUsY0FBYyxFQUFFLE1BQU0seUJBQXlCLENBQUM7QUFDekQsT0FBTyxFQUFFLHFCQUFxQixFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDeEUsT0FBTyxFQUFFLG9CQUFvQixFQUFFLE1BQU0saUNBQWlDLENBQUM7QUFDdkUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sMENBQTBDLENBQUM7QUFDOUUsT0FBTyxFQUFFLHdCQUF3QixFQUFFLE1BQU0sc0NBQXNDLENBQUM7QUFDaEYsT0FBTyxFQUFFLHlCQUF5QixFQUFFLE1BQU0sdUNBQXVDLENBQUM7QUFDbEYsT0FBTyxFQUFFLDZCQUE2QixFQUFFLE1BQU0sbUNBQW1DLENBQUM7O0FBOERsRixNQUFNLE9BQU8sbUJBQW1COztnSEFBbkIsbUJBQW1CO2lIQUFuQixtQkFBbUIsaUJBMUQ1QixvQkFBb0I7UUFDcEIsb0JBQW9CO1FBQ3BCLGtCQUFrQjtRQUNsQixvQkFBb0I7UUFDcEIseUJBQXlCO1FBQ3pCLHdCQUF3QjtRQUN4QixxQkFBcUI7UUFDckIsMEJBQTBCO1FBQzFCLGVBQWU7UUFDZixzQkFBc0I7UUFDdEIsMkJBQTJCO1FBQzNCLHFCQUFxQjtRQUNyQixvQkFBb0I7UUFDcEIsZUFBZTtRQUNmLGVBQWU7UUFDZixrQkFBa0I7UUFDbEIsa0JBQWtCO1FBQ2xCLGNBQWM7UUFDZCxxQkFBcUIsYUFHckIsWUFBWTtRQUNaLElBQUk7UUFDSixZQUFZO1FBQ1osbUJBQW1CO1FBQ25CLHdCQUF3QjtRQUN4QixrQkFBa0I7UUFDbEIsb0JBQW9CO1FBQ3BCLDZCQUE2QjtRQUM3QixzQkFBc0I7UUFDdEIsb0JBQW9CO1FBQ3BCLG9CQUFvQjtRQUNwQixrQkFBa0IsYUFHbEIsb0JBQW9CO1FBQ3BCLG9CQUFvQjtRQUNwQixrQkFBa0I7UUFDbEIsb0JBQW9CO1FBQ3BCLG9CQUFvQjtRQUNwQixvQkFBb0I7UUFDcEIsd0JBQXdCO1FBQ3hCLHlCQUF5QjtRQUN6QixxQkFBcUI7UUFDckIsMEJBQTBCO1FBQzFCLGVBQWU7UUFDZixzQkFBc0I7UUFDdEIsMkJBQTJCO1FBQzNCLHFCQUFxQjtRQUNyQixvQkFBb0I7UUFDcEIsZUFBZTtRQUNmLGVBQWU7UUFDZixrQkFBa0I7UUFDbEIsa0JBQWtCO1FBQ2xCLGNBQWM7UUFDZCxxQkFBcUI7aUhBR1osbUJBQW1CLFlBckM1QixZQUFZO1FBRVosWUFBWTtRQUNaLG1CQUFtQjtRQUNuQix3QkFBd0I7UUFDeEIsa0JBQWtCO1FBQ2xCLG9CQUFvQjtRQUNwQiw2QkFBNkI7MkZBOEJwQixtQkFBbUI7a0JBNUQvQixRQUFRO21CQUFDO29CQUNSLFlBQVksRUFBRTt3QkFDWixvQkFBb0I7d0JBQ3BCLG9CQUFvQjt3QkFDcEIsa0JBQWtCO3dCQUNsQixvQkFBb0I7d0JBQ3BCLHlCQUF5Qjt3QkFDekIsd0JBQXdCO3dCQUN4QixxQkFBcUI7d0JBQ3JCLDBCQUEwQjt3QkFDMUIsZUFBZTt3QkFDZixzQkFBc0I7d0JBQ3RCLDJCQUEyQjt3QkFDM0IscUJBQXFCO3dCQUNyQixvQkFBb0I7d0JBQ3BCLGVBQWU7d0JBQ2YsZUFBZTt3QkFDZixrQkFBa0I7d0JBQ2xCLGtCQUFrQjt3QkFDbEIsY0FBYzt3QkFDZCxxQkFBcUI7cUJBQ3RCO29CQUNELE9BQU8sRUFBRTt3QkFDUCxZQUFZO3dCQUNaLElBQUk7d0JBQ0osWUFBWTt3QkFDWixtQkFBbUI7d0JBQ25CLHdCQUF3Qjt3QkFDeEIsa0JBQWtCO3dCQUNsQixvQkFBb0I7d0JBQ3BCLDZCQUE2Qjt3QkFDN0Isc0JBQXNCO3dCQUN0QixvQkFBb0I7d0JBQ3BCLG9CQUFvQjt3QkFDcEIsa0JBQWtCO3FCQUNuQjtvQkFDRCxPQUFPLEVBQUU7d0JBQ1Asb0JBQW9CO3dCQUNwQixvQkFBb0I7d0JBQ3BCLGtCQUFrQjt3QkFDbEIsb0JBQW9CO3dCQUNwQixvQkFBb0I7d0JBQ3BCLG9CQUFvQjt3QkFDcEIsd0JBQXdCO3dCQUN4Qix5QkFBeUI7d0JBQ3pCLHFCQUFxQjt3QkFDckIsMEJBQTBCO3dCQUMxQixlQUFlO3dCQUNmLHNCQUFzQjt3QkFDdEIsMkJBQTJCO3dCQUMzQixxQkFBcUI7d0JBQ3JCLG9CQUFvQjt3QkFDcEIsZUFBZTt3QkFDZixlQUFlO3dCQUNmLGtCQUFrQjt3QkFDbEIsa0JBQWtCO3dCQUNsQixjQUFjO3dCQUNkLHFCQUFxQjtxQkFDdEI7aUJBQ0YiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBOZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuaW1wb3J0IHsgQ29tbW9uTW9kdWxlLCBOZ0lmIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IERpYWxvZ01vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2Nkay9kaWFsb2cnO1xuaW1wb3J0IHsgU2FwcGhpcmVUaGVtZU1vZHVsZSB9IGZyb20gJy4uLy4uL3RoZW1lL3B1YmxpY19hcGknO1xuaW1wb3J0IHsgU2FwcGhpcmVUeXBvZ3JhcGh5TW9kdWxlIH0gZnJvbSAnLi4vLi4vdHlwb2dyYXBoeS9wdWJsaWNfYXBpJztcbmltcG9ydCB7IFNhcHBoaXJlSWNvbk1vZHVsZSB9IGZyb20gJy4uLy4uL2ljb24vcHVibGljX2FwaSc7XG5pbXBvcnQgeyBTYXBwaGlyZUJ1dHRvbk1vZHVsZSB9IGZyb20gJy4uLy4uL2J1dHRvbi9wdWJsaWNfYXBpJztcbmltcG9ydCB7IFNjcm9sbE1vbml0b3JEaXJlY3RpdmUgfSBmcm9tICcuLi8uLi9jb21tb24vc2Nyb2xsLW1vbml0b3IuZGlyZWN0aXZlJztcbmltcG9ydCB7IERpYWxvZ0NvbXBvbmVudCB9IGZyb20gJy4vZGlhbG9nL2RpYWxvZy5jb21wb25lbnQnO1xuaW1wb3J0IHtcbiAgTW9kYWxIZWFkZXJDb21wb25lbnQsXG4gIE1vZGFsSGVhZGVyRGlyZWN0aXZlLFxufSBmcm9tICcuL2xheW91dC9tb2RhbC1oZWFkZXIuY29tcG9uZW50JztcbmltcG9ydCB7IE1vZGFsQm9keUNvbXBvbmVudCB9IGZyb20gJy4vbGF5b3V0L21vZGFsLWJvZHkuY29tcG9uZW50JztcbmltcG9ydCB7XG4gIE1vZGFsRm9vdGVyQ29tcG9uZW50LFxuICBNb2RhbEZvb3RlckRpcmVjdGl2ZSxcbn0gZnJvbSAnLi9sYXlvdXQvbW9kYWwtZm9vdGVyLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBNb2RhbFNlY3Rpb25Db21wb25lbnQgfSBmcm9tICcuL2xheW91dC9tb2RhbC1zZWN0aW9uLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBNb2RhbFNlY3Rpb25UaXRsZURpcmVjdGl2ZSB9IGZyb20gJy4vbGF5b3V0L21vZGFsLXNlY3Rpb24tdGl0bGUuZGlyZWN0aXZlJztcbmltcG9ydCB7IERpYWxvZ1RyaWdnZXJEaXJlY3RpdmUgfSBmcm9tICcuL2RpYWxvZy9kaWFsb2ctdHJpZ2dlci5kaXJlY3RpdmUnO1xuaW1wb3J0IHsgQ29uZmlybWF0aW9uRGlhbG9nQ29tcG9uZW50IH0gZnJvbSAnLi9kaWFsb2cvY29uZmlybWF0aW9uLWRpYWxvZy5jb21wb25lbnQnO1xuaW1wb3J0IHsgRGFuZ2VyRGlhbG9nQ29tcG9uZW50IH0gZnJvbSAnLi9kaWFsb2cvZGFuZ2VyLWRpYWxvZy5jb21wb25lbnQnO1xuaW1wb3J0IHtcbiAgQWxlcnREaWFsb2dBY3Rpb25zLFxuICBBbGVydERpYWxvZ0JvZHksXG4gIEFsZXJ0RGlhbG9nQ29tcG9uZW50LFxuICBBbGVydERpYWxvZ0hlYWRpbmcsXG4gIEFsZXJ0RGlhbG9nSWNvbixcbn0gZnJvbSAnLi9kaWFsb2cvYWxlcnQtZGlhbG9nLmNvbXBvbmVudCc7XG5pbXBvcnQgeyBQYW5lbENvbXBvbmVudCB9IGZyb20gJy4vcGFuZWwvcGFuZWwuY29tcG9uZW50JztcbmltcG9ydCB7IFBhbmVsVHJpZ2dlckRpcmVjdGl2ZSB9IGZyb20gJy4vcGFuZWwvcGFuZWwtdHJpZ2dlci5kaXJlY3RpdmUnO1xuaW1wb3J0IHsgTW9kYWxMYXlvdXRDb21wb25lbnQgfSBmcm9tICcuL2xheW91dC9tb2RhbC1sYXlvdXQuY29tcG9uZW50JztcbmltcG9ydCB7IFVzZUNvbXBvbmVudFN0eWxlcyB9IGZyb20gJy4uLy4uL2NvbW1vbi9zYXBwaGlyZS12aWV3LWVuY2Fwc3VsYXRpb24nO1xuaW1wb3J0IHsgTW9kYWxCYWNrQnV0dG9uRGlyZWN0aXZlIH0gZnJvbSAnLi9sYXlvdXQvbW9kYWwtYmFjay1idXR0b24uZGlyZWN0aXZlJztcbmltcG9ydCB7IE1vZGFsQ2xvc2VCdXR0b25EaXJlY3RpdmUgfSBmcm9tICcuL2xheW91dC9tb2RhbC1jbG9zZS1idXR0b24uZGlyZWN0aXZlJztcbmltcG9ydCB7IFNhcHBoaXJlRmVlZGJhY2tNZXNzYWdlTW9kdWxlIH0gZnJvbSAnLi4vLi4vZmVlZGJhY2stbWVzc2FnZS9wdWJsaWNfYXBpJztcblxuQE5nTW9kdWxlKHtcbiAgZGVjbGFyYXRpb25zOiBbXG4gICAgTW9kYWxMYXlvdXRDb21wb25lbnQsXG4gICAgTW9kYWxIZWFkZXJDb21wb25lbnQsXG4gICAgTW9kYWxCb2R5Q29tcG9uZW50LFxuICAgIE1vZGFsRm9vdGVyQ29tcG9uZW50LFxuICAgIE1vZGFsQ2xvc2VCdXR0b25EaXJlY3RpdmUsXG4gICAgTW9kYWxCYWNrQnV0dG9uRGlyZWN0aXZlLFxuICAgIE1vZGFsU2VjdGlvbkNvbXBvbmVudCxcbiAgICBNb2RhbFNlY3Rpb25UaXRsZURpcmVjdGl2ZSxcbiAgICBEaWFsb2dDb21wb25lbnQsXG4gICAgRGlhbG9nVHJpZ2dlckRpcmVjdGl2ZSxcbiAgICBDb25maXJtYXRpb25EaWFsb2dDb21wb25lbnQsXG4gICAgRGFuZ2VyRGlhbG9nQ29tcG9uZW50LFxuICAgIEFsZXJ0RGlhbG9nQ29tcG9uZW50LFxuICAgIEFsZXJ0RGlhbG9nSWNvbixcbiAgICBBbGVydERpYWxvZ0JvZHksXG4gICAgQWxlcnREaWFsb2dIZWFkaW5nLFxuICAgIEFsZXJ0RGlhbG9nQWN0aW9ucyxcbiAgICBQYW5lbENvbXBvbmVudCxcbiAgICBQYW5lbFRyaWdnZXJEaXJlY3RpdmUsXG4gIF0sXG4gIGltcG9ydHM6IFtcbiAgICBDb21tb25Nb2R1bGUsXG4gICAgTmdJZixcbiAgICBEaWFsb2dNb2R1bGUsXG4gICAgU2FwcGhpcmVUaGVtZU1vZHVsZSxcbiAgICBTYXBwaGlyZVR5cG9ncmFwaHlNb2R1bGUsXG4gICAgU2FwcGhpcmVJY29uTW9kdWxlLFxuICAgIFNhcHBoaXJlQnV0dG9uTW9kdWxlLFxuICAgIFNhcHBoaXJlRmVlZGJhY2tNZXNzYWdlTW9kdWxlLFxuICAgIFNjcm9sbE1vbml0b3JEaXJlY3RpdmUsXG4gICAgTW9kYWxIZWFkZXJEaXJlY3RpdmUsXG4gICAgTW9kYWxGb290ZXJEaXJlY3RpdmUsXG4gICAgVXNlQ29tcG9uZW50U3R5bGVzLFxuICBdLFxuICBleHBvcnRzOiBbXG4gICAgTW9kYWxMYXlvdXRDb21wb25lbnQsXG4gICAgTW9kYWxIZWFkZXJDb21wb25lbnQsXG4gICAgTW9kYWxCb2R5Q29tcG9uZW50LFxuICAgIE1vZGFsRm9vdGVyQ29tcG9uZW50LFxuICAgIE1vZGFsSGVhZGVyRGlyZWN0aXZlLFxuICAgIE1vZGFsRm9vdGVyRGlyZWN0aXZlLFxuICAgIE1vZGFsQmFja0J1dHRvbkRpcmVjdGl2ZSxcbiAgICBNb2RhbENsb3NlQnV0dG9uRGlyZWN0aXZlLFxuICAgIE1vZGFsU2VjdGlvbkNvbXBvbmVudCxcbiAgICBNb2RhbFNlY3Rpb25UaXRsZURpcmVjdGl2ZSxcbiAgICBEaWFsb2dDb21wb25lbnQsXG4gICAgRGlhbG9nVHJpZ2dlckRpcmVjdGl2ZSxcbiAgICBDb25maXJtYXRpb25EaWFsb2dDb21wb25lbnQsXG4gICAgRGFuZ2VyRGlhbG9nQ29tcG9uZW50LFxuICAgIEFsZXJ0RGlhbG9nQ29tcG9uZW50LFxuICAgIEFsZXJ0RGlhbG9nSWNvbixcbiAgICBBbGVydERpYWxvZ0JvZHksXG4gICAgQWxlcnREaWFsb2dIZWFkaW5nLFxuICAgIEFsZXJ0RGlhbG9nQWN0aW9ucyxcbiAgICBQYW5lbENvbXBvbmVudCxcbiAgICBQYW5lbFRyaWdnZXJEaXJlY3RpdmUsXG4gIF0sXG59KVxuZXhwb3J0IGNsYXNzIFNhcHBoaXJlTW9kYWxNb2R1bGUge31cbiJdfQ==
|
|
@@ -16,14 +16,14 @@ export class PanelComponent extends ModalBaseComponent {
|
|
|
16
16
|
}
|
|
17
17
|
}
|
|
18
18
|
PanelComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: PanelComponent, deps: [{ token: i1.DialogRef }], target: i0.ɵɵFactoryTarget.Component });
|
|
19
|
-
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: i2.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-surface)}.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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)}\n"] });
|
|
19
|
+
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: i2.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-surface)}.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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"] });
|
|
20
20
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: PanelComponent, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
22
|
args: [{ selector: 'sp-panel', template: '<ng-content></ng-content>', host: {
|
|
23
23
|
class: 'sapphire-panel',
|
|
24
24
|
'[class.sapphire-panel--sm]': 'size === "sm"',
|
|
25
25
|
'[class.sapphire-panel--visible]': '!dialogRef.closing',
|
|
26
|
-
}, 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-surface)}.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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)}\n"] }]
|
|
26
|
+
}, 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-surface)}.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;justify-content:space-between;padding:var(--sapphire-semantic-size-spacing-lg) var(--sapphire-semantic-size-spacing-container-horizontal-md);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;padding:var(--sapphire-semantic-size-spacing-3xs) 0;display:flex;flex-direction:column;justify-content:center;word-break:break-word}.sapphire-modal-layout__subheading{color:var(--sapphire-semantic-color-foreground-secondary);margin-top:var(--sapphire-semantic-size-spacing-2xs)}.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"] }]
|
|
27
27
|
}], ctorParameters: function () { return [{ type: i1.DialogRef }]; }, propDecorators: { size: [{
|
|
28
28
|
type: Input
|
|
29
29
|
}] } });
|
|
@@ -311,7 +311,7 @@ SelectComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", versio
|
|
|
311
311
|
provide: FieldControl,
|
|
312
312
|
useExisting: forwardRef(() => SelectComponent),
|
|
313
313
|
},
|
|
314
|
-
], 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: i6.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' : 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 >\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-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-
|
|
314
|
+
], 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: i6.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' : 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 >\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}\n"], dependencies: [{ kind: "directive", type: i7.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i8.IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: i9.ListboxComponent, selector: "sp-listbox", inputs: ["selectedValues", "spListboxItems", "disabled", "multiple", "navigationWrapDisabled", "aria-label", "aria-labelledby", "id"], outputs: ["selectedValuesChange", "selected"], exportAs: ["spListbox"] }, { kind: "directive", type: i10.ListboxInputDirective, selector: "input[spListboxInput]", inputs: ["spListboxInput"] }, { kind: "component", type: i11.PopoverComponent, selector: "sp-popover", inputs: ["noPadding", "noMaxWidth", "noAutoFocus", "trapFocus"] }, { kind: "directive", type: i12.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: i13.VisuallyHiddenDirective, selector: "[spVisuallyHidden]", inputs: ["spVisuallyHidden"] }, { kind: "component", type: i14.HiddenSelectComponent, selector: "sp-hidden-select" }, { kind: "pipe", type: i7.AsyncPipe, name: "async" }] });
|
|
315
315
|
__decorate([
|
|
316
316
|
AutoId()
|
|
317
317
|
], SelectComponent.prototype, "_valueContainerId", void 0);
|
|
@@ -341,7 +341,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
341
341
|
'[attr.aria-label]': 'null',
|
|
342
342
|
'[attr.aria-labelledby]': 'null',
|
|
343
343
|
'[attr.placeholder]': 'null',
|
|
344
|
-
}, 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' : 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 >\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-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-
|
|
344
|
+
}, 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' : 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 >\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}\n"] }]
|
|
345
345
|
}], ctorParameters: function () { return [{ type: i1.SelectValueHolder }, { type: i2.IconRegistry }, { type: i3.FocusMonitor }, { type: i3.InputModalityDetector }, { type: i4.FieldComponent, decorators: [{
|
|
346
346
|
type: Optional
|
|
347
347
|
}] }, { type: i5.SearchableSelectDirective, decorators: [{
|
|
@@ -101,7 +101,7 @@ SelectButtonComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0",
|
|
|
101
101
|
useExisting: forwardRef(() => SelectButtonComponent),
|
|
102
102
|
},
|
|
103
103
|
ViewEncapsulationProvider,
|
|
104
|
-
], 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-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-
|
|
104
|
+
], 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}\n"], dependencies: [{ kind: "directive", type: i4.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i5.IconComponent, selector: "sp-icon", inputs: ["name", "size", "color"] }, { kind: "component", type: i6.ListboxComponent, selector: "sp-listbox", inputs: ["selectedValues", "spListboxItems", "disabled", "multiple", "navigationWrapDisabled", "aria-label", "aria-labelledby", "id"], outputs: ["selectedValuesChange", "selected"], exportAs: ["spListbox"] }, { kind: "component", type: i7.PopoverComponent, selector: "sp-popover", inputs: ["noPadding", "noMaxWidth", "noAutoFocus", "trapFocus"] }, { kind: "directive", type: i8.PopoverTriggerDirective, selector: "[spPopoverTriggerFor]", inputs: ["spPopoverPlacement", "spPopoverTriggerFor", "spPopoverNonModal", "spPopoverTriggerOpenOnPressStart", "spPopoverTriggerCloseOnScroll", "spPopoverTriggerDisabled", "spPopoverDisablePushInsideViewport"], outputs: ["spPopoverTriggerOpened", "spPopoverTriggerClosed"], exportAs: ["spPopoverTrigger"] }, { kind: "directive", type: i2.CdkMonitorFocus, selector: "[cdkMonitorElementFocus], [cdkMonitorSubtreeFocus]", outputs: ["cdkFocusChange"], exportAs: ["cdkMonitorFocus"] }, { kind: "component", type: i9.ButtonComponent, selector: "button[sp-button], a[sp-button]", inputs: ["variant", "size", "disabled", "iconAlign", "type"] }, { kind: "directive", type: i10.ButtonIconDirective, selector: "[spButtonIcon]" }, { kind: "component", type: i11.HiddenSelectComponent, selector: "sp-hidden-select" }] });
|
|
105
105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImport: i0, type: SelectButtonComponent, decorators: [{
|
|
106
106
|
type: Component,
|
|
107
107
|
args: [{ selector: 'sp-select-button', exportAs: 'spSelectButton', providers: [
|
|
@@ -118,7 +118,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.2.0", ngImpor
|
|
|
118
118
|
], host: {
|
|
119
119
|
'[attr.aria-label]': 'null',
|
|
120
120
|
'[attr.aria-labelledby]': 'null',
|
|
121
|
-
}, standalone: false, 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-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-
|
|
121
|
+
}, standalone: false, 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}\n"] }]
|
|
122
122
|
}], ctorParameters: function () { return [{ type: i1.SelectValueHolder }, { type: i2.FocusMonitor }, { type: i3.IconRegistry }]; }, propDecorators: { size: [{
|
|
123
123
|
type: Input
|
|
124
124
|
}], variant: [{
|