@ascentgl/ads-ui 0.0.49 → 0.0.51
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.
|
@@ -5698,7 +5698,7 @@ class AdsModalComponent {
|
|
|
5698
5698
|
this.elRef = elRef;
|
|
5699
5699
|
this.data = data;
|
|
5700
5700
|
/** @ignore */
|
|
5701
|
-
this.defaultHeaderPadding = '24px
|
|
5701
|
+
this.defaultHeaderPadding = '24px 0 16px 24px';
|
|
5702
5702
|
/** @ignore */
|
|
5703
5703
|
this.defaultContentPadding = '0 24px 24px 24px';
|
|
5704
5704
|
/** @ignore */
|
|
@@ -5733,11 +5733,11 @@ class AdsModalComponent {
|
|
|
5733
5733
|
this.dialogRef.close();
|
|
5734
5734
|
}
|
|
5735
5735
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AdsModalComponent, deps: [{ token: i1$4.MatDialogRef }, { token: i1.AdsIconRegistry }, { token: i0.Renderer2 }, { token: i0.ElementRef }, { token: MAT_DIALOG_DATA }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5736
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AdsModalComponent, isStandalone: false, selector: "ads-modal", ngImport: i0, template: "<div mat-dialog-title>\n @if (data.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"data.headerTemplate; context: { data: data.templateData }\" />\n }\n {{ data.title }}\n <div class=\"cross-icon-container\">\n <ads-icon name=\"cross\" size=\"xxs\" stroke=\"iconPrimary\" (click)=\"onClose()\" />\n </div>\n</div>\n\n<div mat-dialog-content>\n @if (data.contentTemplate) {\n <ng-container *ngTemplateOutlet=\"data.contentTemplate; context: { data: data.templateData }\" />\n }\n {{ data.content }}\n</div>\n\n<div mat-dialog-actions>\n @if (data.actionsTemplate) {\n <ng-container *ngTemplateOutlet=\"data.actionsTemplate; context: { data: data.templateData }\" />\n } @else {\n <div class=\"actions-container\">\n @if (!data.hideCancel) {\n <ads-button variant=\"secondary\" (click)=\"onCancel()\">\n @if (data.cancelButtonText) {\n {{ data.cancelButtonText }}\n } @else {\n {{ 'Cancel' }}\n }\n </ads-button>\n }\n <ads-button variant=\"primary\" (click)=\"onSubmit()\">\n @if (data.confirmButtonText) {\n {{ data.confirmButtonText }}\n } @else {\n {{ 'Save' }}\n }\n </ads-button>\n </div>\n }\n</div>\n", styles: ["::ng-deep .mat-mdc-dialog-surface{--mdc-dialog-container-shape: 10px;--mdc-dialog-container-color: var(--color-white)}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title{display:flex;justify-content:space-between;--mdc-dialog-subhead-color: var(--color-dark);--mdc-dialog-subhead-line-height: 26px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 600}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title:before{content:none}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container{
|
|
5736
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AdsModalComponent, isStandalone: false, selector: "ads-modal", ngImport: i0, template: "<div mat-dialog-title>\n @if (data.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"data.headerTemplate; context: { data: data.templateData }\" />\n }\n {{ data.title }}\n <div class=\"cross-icon-container\">\n <ads-icon name=\"cross\" size=\"xxs\" stroke=\"iconPrimary\" (click)=\"onClose()\" />\n </div>\n</div>\n\n<div mat-dialog-content>\n @if (data.contentTemplate) {\n <ng-container *ngTemplateOutlet=\"data.contentTemplate; context: { data: data.templateData }\" />\n }\n {{ data.content }}\n</div>\n\n<div mat-dialog-actions>\n @if (data.actionsTemplate) {\n <ng-container *ngTemplateOutlet=\"data.actionsTemplate; context: { data: data.templateData }\" />\n } @else {\n <div class=\"actions-container\">\n @if (!data.hideCancel) {\n <ads-button variant=\"secondary\" (click)=\"onCancel()\">\n @if (data.cancelButtonText) {\n {{ data.cancelButtonText }}\n } @else {\n {{ 'Cancel' }}\n }\n </ads-button>\n }\n <ads-button variant=\"primary\" (click)=\"onSubmit()\">\n @if (data.confirmButtonText) {\n {{ data.confirmButtonText }}\n } @else {\n {{ 'Save' }}\n }\n </ads-button>\n </div>\n }\n</div>\n", styles: ["::ng-deep .mat-mdc-dialog-surface{--mdc-dialog-container-shape: 10px;--mdc-dialog-container-color: var(--color-white)}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title{display:flex;justify-content:space-between;--mdc-dialog-subhead-color: var(--color-dark);--mdc-dialog-subhead-line-height: 26px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 600}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title:before{content:none}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container{display:flex;align-items:center;padding-right:16px}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container ads-icon,::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container ads-icon>svg{cursor:pointer;width:16px!important;height:16px!important}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-container .mat-mdc-dialog-title+.mat-mdc-dialog-content{padding-top:8px}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-content{letter-spacing:normal!important;--mdc-dialog-supporting-text-color: var(--color-medium);--mdc-dialog-supporting-text-line-height: 21px;--mdc-dialog-supporting-text-size: 16px;--mdc-dialog-supporting-text-weight: 400}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-actions{border-top:1px solid var(--color-light);display:block}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-actions .actions-container{gap:16px;display:flex;justify-content:flex-end}\n"], dependencies: [{ kind: "directive", type: i1$4.MatDialogTitle, selector: "[mat-dialog-title], [matDialogTitle]", inputs: ["id"], exportAs: ["matDialogTitle"] }, { kind: "directive", type: i1$4.MatDialogActions, selector: "[mat-dialog-actions], mat-dialog-actions, [matDialogActions]", inputs: ["align"] }, { kind: "directive", type: i1$4.MatDialogContent, selector: "[mat-dialog-content], mat-dialog-content, [matDialogContent]" }, { kind: "component", type: AdsButtonComponent, selector: "ads-button", inputs: ["id", "variant", "disabled", "size", "type"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }, { kind: "directive", type: i1$1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
5737
5737
|
}
|
|
5738
5738
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AdsModalComponent, decorators: [{
|
|
5739
5739
|
type: Component,
|
|
5740
|
-
args: [{ selector: 'ads-modal', standalone: false, template: "<div mat-dialog-title>\n @if (data.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"data.headerTemplate; context: { data: data.templateData }\" />\n }\n {{ data.title }}\n <div class=\"cross-icon-container\">\n <ads-icon name=\"cross\" size=\"xxs\" stroke=\"iconPrimary\" (click)=\"onClose()\" />\n </div>\n</div>\n\n<div mat-dialog-content>\n @if (data.contentTemplate) {\n <ng-container *ngTemplateOutlet=\"data.contentTemplate; context: { data: data.templateData }\" />\n }\n {{ data.content }}\n</div>\n\n<div mat-dialog-actions>\n @if (data.actionsTemplate) {\n <ng-container *ngTemplateOutlet=\"data.actionsTemplate; context: { data: data.templateData }\" />\n } @else {\n <div class=\"actions-container\">\n @if (!data.hideCancel) {\n <ads-button variant=\"secondary\" (click)=\"onCancel()\">\n @if (data.cancelButtonText) {\n {{ data.cancelButtonText }}\n } @else {\n {{ 'Cancel' }}\n }\n </ads-button>\n }\n <ads-button variant=\"primary\" (click)=\"onSubmit()\">\n @if (data.confirmButtonText) {\n {{ data.confirmButtonText }}\n } @else {\n {{ 'Save' }}\n }\n </ads-button>\n </div>\n }\n</div>\n", styles: ["::ng-deep .mat-mdc-dialog-surface{--mdc-dialog-container-shape: 10px;--mdc-dialog-container-color: var(--color-white)}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title{display:flex;justify-content:space-between;--mdc-dialog-subhead-color: var(--color-dark);--mdc-dialog-subhead-line-height: 26px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 600}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title:before{content:none}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container{
|
|
5740
|
+
args: [{ selector: 'ads-modal', standalone: false, template: "<div mat-dialog-title>\n @if (data.headerTemplate) {\n <ng-container *ngTemplateOutlet=\"data.headerTemplate; context: { data: data.templateData }\" />\n }\n {{ data.title }}\n <div class=\"cross-icon-container\">\n <ads-icon name=\"cross\" size=\"xxs\" stroke=\"iconPrimary\" (click)=\"onClose()\" />\n </div>\n</div>\n\n<div mat-dialog-content>\n @if (data.contentTemplate) {\n <ng-container *ngTemplateOutlet=\"data.contentTemplate; context: { data: data.templateData }\" />\n }\n {{ data.content }}\n</div>\n\n<div mat-dialog-actions>\n @if (data.actionsTemplate) {\n <ng-container *ngTemplateOutlet=\"data.actionsTemplate; context: { data: data.templateData }\" />\n } @else {\n <div class=\"actions-container\">\n @if (!data.hideCancel) {\n <ads-button variant=\"secondary\" (click)=\"onCancel()\">\n @if (data.cancelButtonText) {\n {{ data.cancelButtonText }}\n } @else {\n {{ 'Cancel' }}\n }\n </ads-button>\n }\n <ads-button variant=\"primary\" (click)=\"onSubmit()\">\n @if (data.confirmButtonText) {\n {{ data.confirmButtonText }}\n } @else {\n {{ 'Save' }}\n }\n </ads-button>\n </div>\n }\n</div>\n", styles: ["::ng-deep .mat-mdc-dialog-surface{--mdc-dialog-container-shape: 10px;--mdc-dialog-container-color: var(--color-white)}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title{display:flex;justify-content:space-between;--mdc-dialog-subhead-color: var(--color-dark);--mdc-dialog-subhead-line-height: 26px;--mdc-dialog-subhead-size: 20px;--mdc-dialog-subhead-weight: 600}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title:before{content:none}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container{display:flex;align-items:center;padding-right:16px}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container ads-icon,::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-title .cross-icon-container ads-icon>svg{cursor:pointer;width:16px!important;height:16px!important}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-container .mat-mdc-dialog-title+.mat-mdc-dialog-content{padding-top:8px}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-content{letter-spacing:normal!important;--mdc-dialog-supporting-text-color: var(--color-medium);--mdc-dialog-supporting-text-line-height: 21px;--mdc-dialog-supporting-text-size: 16px;--mdc-dialog-supporting-text-weight: 400}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-actions{border-top:1px solid var(--color-light);display:block}::ng-deep .mat-mdc-dialog-surface .mat-mdc-dialog-actions .actions-container{gap:16px;display:flex;justify-content:flex-end}\n"] }]
|
|
5741
5741
|
}], ctorParameters: () => [{ type: i1$4.MatDialogRef }, { type: i1.AdsIconRegistry }, { type: i0.Renderer2 }, { type: i0.ElementRef }, { type: undefined, decorators: [{
|
|
5742
5742
|
type: Inject,
|
|
5743
5743
|
args: [MAT_DIALOG_DATA]
|
|
@@ -6333,11 +6333,11 @@ class AdsVerticalStepperComponent {
|
|
|
6333
6333
|
this.focusedStepIndex = this.steps().findIndex((step) => step.status === VerticalStepStatus.Current);
|
|
6334
6334
|
}
|
|
6335
6335
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AdsVerticalStepperComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
6336
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AdsVerticalStepperComponent, isStandalone: false, selector: "ads-vertical-stepper", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"vertical-stepper\">\n @for (step of steps(); track index; let first = $first; let last = $last; let index = $index) {\n <div
|
|
6336
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.5", type: AdsVerticalStepperComponent, isStandalone: false, selector: "ads-vertical-stepper", inputs: { steps: { classPropertyName: "steps", publicName: "steps", isSignal: true, isRequired: true, transformFunction: null } }, ngImport: i0, template: "<div class=\"vertical-stepper\">\n @for (step of steps(); track index; let first = $first; let last = $last; let index = $index) {\n <div\n class=\"step\"\n [class.focused]=\"step.status === VerticalStepStatus.Current\"\n [ngClass]=\"{ clickable: step.onClick }\"\n >\n @if (!first) {\n <div class=\"line-container\">\n <div></div>\n <div></div>\n </div>\n }\n\n <div\n class=\"step-icon-wrapper\"\n (click)=\"step.onClick && step.status !== VerticalStepStatus.Disabled ? step.onClick!(step) : null\"\n [ngClass]=\"step.status\"\n [class.clickable]=\"step.onClick && step.status !== VerticalStepStatus.Disabled\"\n >\n <div class=\"step-icon\" [matTooltip]=\"step.tooltip || ''\" [matTooltipDisabled]=\"!step.tooltip\">\n <ads-icon [name]=\"step.icon\" size=\"sm\" stroke=\"white\" theme=\"white\" />\n </div>\n\n <span class=\"title\">{{ step.title }}</span>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:flex}.vertical-stepper{display:flex;flex-direction:column}.vertical-stepper .step{display:flex;justify-content:center;align-items:center;flex-direction:column}.vertical-stepper .step .line-container{display:flex;padding:8px 0}.vertical-stepper .step .line-container div{flex:1;height:40px}.vertical-stepper .step .line-container div:first-child{border-right:1px solid var(--color-light)}.vertical-stepper .step .line-container div:last-child{border-left:1px solid var(--color-light)}.vertical-stepper .step .step-icon-wrapper{display:flex;align-items:center;flex-direction:column}.vertical-stepper .step .step-icon-wrapper .step-icon{border-radius:80px;display:flex;justify-content:center;align-items:center;box-sizing:border-box}.vertical-stepper .step .step-icon-wrapper .title{line-height:21px;color:var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.clickable{cursor:pointer}.vertical-stepper .step .step-icon-wrapper.completed .step-icon{background-color:var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.current .step-icon{background-color:var(--color-secondary)}.vertical-stepper .step .step-icon-wrapper.current .title{color:var(--color-dark)}.vertical-stepper .step .step-icon-wrapper.disabled .step-icon{background-color:var(--color-white);border:2px solid var(--color-light)}.vertical-stepper .step .step-icon-wrapper.disabled .step-icon ::ng-deep ads-icon svg{fill:var(--color-light);stroke:var(--color-light)}.vertical-stepper .step .step-icon-wrapper.disabled .title{color:var(--color-medium)}.vertical-stepper .step .step-icon-wrapper.future .step-icon{background-color:transparent;border:2px solid var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.future .step-icon ::ng-deep ads-icon svg{fill:var(--color-primary);stroke:var(--color-primary)}.vertical-stepper .step:not(.focused) ::ng-deep .step-icon{height:40px;width:40px}.vertical-stepper .step:not(.focused) ::ng-deep .step-icon ads-icon,.vertical-stepper .step:not(.focused) ::ng-deep .step-icon svg{width:16px!important;height:16px!important}.vertical-stepper .step:not(.focused) .title{color:var(--color-medium)}.vertical-stepper .step.focused .step-icon{height:72px;width:72px}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i8$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i1.AdsIconComponent, selector: "ads-icon", inputs: ["size", "name", "color", "theme", "stroke"] }] }); }
|
|
6337
6337
|
}
|
|
6338
6338
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.5", ngImport: i0, type: AdsVerticalStepperComponent, decorators: [{
|
|
6339
6339
|
type: Component,
|
|
6340
|
-
args: [{ selector: 'ads-vertical-stepper', standalone: false, template: "<div class=\"vertical-stepper\">\n @for (step of steps(); track index; let first = $first; let last = $last; let index = $index) {\n <div
|
|
6340
|
+
args: [{ selector: 'ads-vertical-stepper', standalone: false, template: "<div class=\"vertical-stepper\">\n @for (step of steps(); track index; let first = $first; let last = $last; let index = $index) {\n <div\n class=\"step\"\n [class.focused]=\"step.status === VerticalStepStatus.Current\"\n [ngClass]=\"{ clickable: step.onClick }\"\n >\n @if (!first) {\n <div class=\"line-container\">\n <div></div>\n <div></div>\n </div>\n }\n\n <div\n class=\"step-icon-wrapper\"\n (click)=\"step.onClick && step.status !== VerticalStepStatus.Disabled ? step.onClick!(step) : null\"\n [ngClass]=\"step.status\"\n [class.clickable]=\"step.onClick && step.status !== VerticalStepStatus.Disabled\"\n >\n <div class=\"step-icon\" [matTooltip]=\"step.tooltip || ''\" [matTooltipDisabled]=\"!step.tooltip\">\n <ads-icon [name]=\"step.icon\" size=\"sm\" stroke=\"white\" theme=\"white\" />\n </div>\n\n <span class=\"title\">{{ step.title }}</span>\n </div>\n </div>\n }\n</div>\n", styles: [":host{display:flex}.vertical-stepper{display:flex;flex-direction:column}.vertical-stepper .step{display:flex;justify-content:center;align-items:center;flex-direction:column}.vertical-stepper .step .line-container{display:flex;padding:8px 0}.vertical-stepper .step .line-container div{flex:1;height:40px}.vertical-stepper .step .line-container div:first-child{border-right:1px solid var(--color-light)}.vertical-stepper .step .line-container div:last-child{border-left:1px solid var(--color-light)}.vertical-stepper .step .step-icon-wrapper{display:flex;align-items:center;flex-direction:column}.vertical-stepper .step .step-icon-wrapper .step-icon{border-radius:80px;display:flex;justify-content:center;align-items:center;box-sizing:border-box}.vertical-stepper .step .step-icon-wrapper .title{line-height:21px;color:var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.clickable{cursor:pointer}.vertical-stepper .step .step-icon-wrapper.completed .step-icon{background-color:var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.current .step-icon{background-color:var(--color-secondary)}.vertical-stepper .step .step-icon-wrapper.current .title{color:var(--color-dark)}.vertical-stepper .step .step-icon-wrapper.disabled .step-icon{background-color:var(--color-white);border:2px solid var(--color-light)}.vertical-stepper .step .step-icon-wrapper.disabled .step-icon ::ng-deep ads-icon svg{fill:var(--color-light);stroke:var(--color-light)}.vertical-stepper .step .step-icon-wrapper.disabled .title{color:var(--color-medium)}.vertical-stepper .step .step-icon-wrapper.future .step-icon{background-color:transparent;border:2px solid var(--color-primary)}.vertical-stepper .step .step-icon-wrapper.future .step-icon ::ng-deep ads-icon svg{fill:var(--color-primary);stroke:var(--color-primary)}.vertical-stepper .step:not(.focused) ::ng-deep .step-icon{height:40px;width:40px}.vertical-stepper .step:not(.focused) ::ng-deep .step-icon ads-icon,.vertical-stepper .step:not(.focused) ::ng-deep .step-icon svg{width:16px!important;height:16px!important}.vertical-stepper .step:not(.focused) .title{color:var(--color-medium)}.vertical-stepper .step.focused .step-icon{height:72px;width:72px}\n"] }]
|
|
6341
6341
|
}] });
|
|
6342
6342
|
|
|
6343
6343
|
class AdsVerticalStepperModule {
|