@ascentgl/ads-ui 20.0.39 → 20.0.40
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.
|
@@ -6096,6 +6096,7 @@ class AdsExpansionPanelComponent {
|
|
|
6096
6096
|
this.headerPadding = input('', ...(ngDevMode ? [{ debugName: "headerPadding" }] : []));
|
|
6097
6097
|
/** Content padding size size () */
|
|
6098
6098
|
this.contentPadding = input('', ...(ngDevMode ? [{ debugName: "contentPadding" }] : []));
|
|
6099
|
+
this.expandedChange = output();
|
|
6099
6100
|
this.registry.register([adsIconChevronDown, adsIconChevronUp]);
|
|
6100
6101
|
}
|
|
6101
6102
|
get expanded() {
|
|
@@ -6110,6 +6111,7 @@ class AdsExpansionPanelComponent {
|
|
|
6110
6111
|
if (contentPadding && !!this.contentPadding()) {
|
|
6111
6112
|
contentPadding.style.padding = this.contentPadding();
|
|
6112
6113
|
}
|
|
6114
|
+
this.panel.expandedChange.subscribe(value => this.expandedChange.emit(value));
|
|
6113
6115
|
}
|
|
6114
6116
|
/** @ignore */
|
|
6115
6117
|
toggleAndStop(panel, event) {
|
|
@@ -6117,7 +6119,7 @@ class AdsExpansionPanelComponent {
|
|
|
6117
6119
|
event.stopPropagation();
|
|
6118
6120
|
}
|
|
6119
6121
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AdsExpansionPanelComponent, deps: [{ token: i1.AdsIconRegistry }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6120
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AdsExpansionPanelComponent, isStandalone: false, selector: "ads-expansion-panel", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, chevronColor: { classPropertyName: "chevronColor", publicName: "chevronColor", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, headerTemplateData: { classPropertyName: "headerTemplateData", publicName: "headerTemplateData", isSignal: true, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, chevronSize: { classPropertyName: "chevronSize", publicName: "chevronSize", isSignal: true, isRequired: false, transformFunction: null }, headerPadding: { classPropertyName: "headerPadding", publicName: "headerPadding", isSignal: true, isRequired: false, transformFunction: null }, contentPadding: { classPropertyName: "contentPadding", publicName: "contentPadding", isSignal: true, isRequired: false, transformFunction: null } }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true, static: true }], ngImport: i0, template: "<mat-expansion-panel [expanded]=\"isExpanded()\" [ngStyle]=\"{ width: width() }\" #panel [disabled]=\"disabled()\">\n <mat-expansion-panel-header>\n <mat-panel-title>\n @if (!!headerTemplate()) {\n <ng-container *ngTemplateOutlet=\"headerTemplate()!; context: { data: headerTemplateData() }\" />\n } @else {\n {{ header() }}\n }\n </mat-panel-title>\n <mat-panel-description (click)=\"toggleAndStop(panel, $event)\">\n @if (panel.expanded) {\n <ads-icon [size]=\"chevronSize() === 'base' ? 'xs' : 'xxxs'\" name=\"chevron_up\" [theme]=\"chevronColor()\" />\n } @else {\n <ads-icon [size]=\"chevronSize() === 'base' ? 'xs' : 'xxxs'\" name=\"chevron_down\" [theme]=\"chevronColor()\" />\n }\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content />\n</mat-expansion-panel>\n", styles: [".mat-expansion-panel{--mat-expansion-container-shape: 5px;--mat-expansion-container-background-color: var(--color-white);--mat-expansion-container-text-color: var(--color-medium);--mat-expansion-container-text-size: font-size(text-base);box-shadow:none!important;border:1px solid var(--color-light)}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header{--mat-expansion-header-collapsed-state-height: unset;min-height:24px;height:auto;padding:16px}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header.mat-expanded{padding-bottom:8px}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header mat-panel-title{--mat-expansion-header-text-color: var(--color-dark);font-size:1.25rem;line-height:26px;font-weight:600;flex-basis:auto}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header mat-panel-description{margin:0;justify-content:end;flex-basis:auto}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header .mat-expansion-indicator{display:none}.mat-expansion-panel ::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body{--mat-expansion-container-text-size: font-size(text-base);line-height:21px;padding:0 16px 16px}.mat-expansion-panel .mat-expansion-panel-header[aria-disabled=true]{background-color:var(--color-muted)}.mat-expansion-panel .mat-expansion-panel-header[aria-disabled=true] .mat-expansion-panel-header-title{color:var(--color-medium)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i6$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "component", type: i6$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i6$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
6122
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.1.7", type: AdsExpansionPanelComponent, isStandalone: false, selector: "ads-expansion-panel", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, header: { classPropertyName: "header", publicName: "header", isSignal: true, isRequired: false, transformFunction: null }, chevronColor: { classPropertyName: "chevronColor", publicName: "chevronColor", isSignal: true, isRequired: false, transformFunction: null }, headerTemplate: { classPropertyName: "headerTemplate", publicName: "headerTemplate", isSignal: true, isRequired: false, transformFunction: null }, headerTemplateData: { classPropertyName: "headerTemplateData", publicName: "headerTemplateData", isSignal: true, isRequired: false, transformFunction: null }, isExpanded: { classPropertyName: "isExpanded", publicName: "isExpanded", isSignal: true, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, chevronSize: { classPropertyName: "chevronSize", publicName: "chevronSize", isSignal: true, isRequired: false, transformFunction: null }, headerPadding: { classPropertyName: "headerPadding", publicName: "headerPadding", isSignal: true, isRequired: false, transformFunction: null }, contentPadding: { classPropertyName: "contentPadding", publicName: "contentPadding", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { expandedChange: "expandedChange" }, viewQueries: [{ propertyName: "panel", first: true, predicate: ["panel"], descendants: true, static: true }], ngImport: i0, template: "<mat-expansion-panel [expanded]=\"isExpanded()\" [ngStyle]=\"{ width: width() }\" #panel [disabled]=\"disabled()\">\n <mat-expansion-panel-header>\n <mat-panel-title>\n @if (!!headerTemplate()) {\n <ng-container *ngTemplateOutlet=\"headerTemplate()!; context: { data: headerTemplateData() }\" />\n } @else {\n {{ header() }}\n }\n </mat-panel-title>\n <mat-panel-description (click)=\"toggleAndStop(panel, $event)\">\n @if (panel.expanded) {\n <ads-icon [size]=\"chevronSize() === 'base' ? 'xs' : 'xxxs'\" name=\"chevron_up\" [theme]=\"chevronColor()\" />\n } @else {\n <ads-icon [size]=\"chevronSize() === 'base' ? 'xs' : 'xxxs'\" name=\"chevron_down\" [theme]=\"chevronColor()\" />\n }\n </mat-panel-description>\n </mat-expansion-panel-header>\n <ng-content />\n</mat-expansion-panel>\n", styles: [".mat-expansion-panel{--mat-expansion-container-shape: 5px;--mat-expansion-container-background-color: var(--color-white);--mat-expansion-container-text-color: var(--color-medium);--mat-expansion-container-text-size: font-size(text-base);box-shadow:none!important;border:1px solid var(--color-light)}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header{--mat-expansion-header-collapsed-state-height: unset;min-height:24px;height:auto;padding:16px}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header.mat-expanded{padding-bottom:8px}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header mat-panel-title{--mat-expansion-header-text-color: var(--color-dark);font-size:1.25rem;line-height:26px;font-weight:600;flex-basis:auto}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header mat-panel-description{margin:0;justify-content:end;flex-basis:auto}.mat-expansion-panel ::ng-deep .mat-expansion-panel-header .mat-expansion-indicator{display:none}.mat-expansion-panel ::ng-deep .mat-expansion-panel-content .mat-expansion-panel-body{--mat-expansion-container-text-size: font-size(text-base);line-height:21px;padding:0 16px 16px}.mat-expansion-panel .mat-expansion-panel-header[aria-disabled=true]{background-color:var(--color-muted)}.mat-expansion-panel .mat-expansion-panel-header[aria-disabled=true] .mat-expansion-panel-header-title{color:var(--color-medium)}\n"], dependencies: [{ kind: "directive", type: i1$1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "component", type: i6$1.MatExpansionPanel, selector: "mat-expansion-panel", inputs: ["hideToggle", "togglePosition"], outputs: ["afterExpand", "afterCollapse"], exportAs: ["matExpansionPanel"] }, { kind: "directive", type: i6$1.MatExpansionPanelTitle, selector: "mat-panel-title" }, { kind: "component", type: i6$1.MatExpansionPanelHeader, selector: "mat-expansion-panel-header", inputs: ["expandedHeight", "collapsedHeight", "tabIndex"] }, { kind: "directive", type: i6$1.MatExpansionPanelDescription, selector: "mat-panel-description" }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
6121
6123
|
}
|
|
6122
6124
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.1.7", ngImport: i0, type: AdsExpansionPanelComponent, decorators: [{
|
|
6123
6125
|
type: Component,
|