@mozaic-ds/angular 2.0.0-beta.27 → 2.0.0-beta.29
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.
|
@@ -1566,7 +1566,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImpor
|
|
|
1566
1566
|
}], propDecorators: { label: [{ type: i0.Input, args: [{ isSignal: true, alias: "label", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }] } });
|
|
1567
1567
|
|
|
1568
1568
|
class MozStatusNotificationComponent {
|
|
1569
|
-
title = input
|
|
1569
|
+
title = input(...(ngDevMode ? [undefined, { debugName: "title" }] : []));
|
|
1570
1570
|
status = input('info', ...(ngDevMode ? [{ debugName: "status" }] : []));
|
|
1571
1571
|
closable = input(false, ...(ngDevMode ? [{ debugName: "closable" }] : []));
|
|
1572
1572
|
closed = output();
|
|
@@ -1592,12 +1592,12 @@ class MozStatusNotificationComponent {
|
|
|
1592
1592
|
this.closed.emit();
|
|
1593
1593
|
}
|
|
1594
1594
|
static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MozStatusNotificationComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
|
|
1595
|
-
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: MozStatusNotificationComponent, isStandalone: true, selector: "moz-status-notification", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired:
|
|
1595
|
+
static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.1.0", type: MozStatusNotificationComponent, isStandalone: true, selector: "moz-status-notification", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null }, status: { classPropertyName: "status", publicName: "status", isSignal: true, isRequired: false, transformFunction: null }, closable: { classPropertyName: "closable", publicName: "closable", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { closed: "closed" }, queries: [{ propertyName: "descriptionTpl", first: true, predicate: ["description"], isSignal: true }, { propertyName: "footerTpl", first: true, predicate: ["footer"], isSignal: true }], ngImport: i0, template: "<section role=\"status\" [class]=\"classes()\">\n <div class=\"mc-status-notification__icon\">\n <ng-container [ngComponentOutlet]=\"iconComponent()\" />\n </div>\n\n <div class=\"mc-status-notification__content\">\n @if(title()){\n <span class=\"mc-status-notification__title\">{{ title() }}</span>\n } @if (descriptionTpl()) {\n <div class=\"mc-status-notification__message\">\n <ng-container [ngTemplateOutlet]=\"descriptionTpl()\" />\n </div>\n } @if (footerTpl()) {\n <div class=\"mc-status-notification__footer\">\n <ng-container [ngTemplateOutlet]=\"footerTpl()\" />\n </div>\n }\n </div>\n\n @if (closable()) {\n <moz-icon-button\n size=\"s\"\n class=\"mc-status-notification-closable__close\"\n [ghost]=\"true\"\n type=\"button\"\n [appearance]=\"'standard'\"\n (click)=\"onCloseClick()\"\n ariaLabel=\"Close notification\"\n >\n <Cross20 icon />\n </moz-icon-button>\n }\n</section>\n", styles: [".mc-status-notification{border-radius:var(--border-radius-m, .5rem);background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7);display:flex;flex-flow:row wrap;align-items:flex-start;position:relative;box-sizing:border-box;color:var(--status-notification-color-text, #000000)}.mc-status-notification__icon{width:2rem;height:2rem;margin:.75rem;fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification__content{flex:1 1 0;padding:.75rem 1rem .75rem 0}.mc-status-notification__title,.mc-status-notification__message{line-height:var(--line-height-s, 1.3);margin-block:0}.mc-status-notification__title{font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-150, 1rem);margin-block-end:.25rem}.mc-status-notification__message{font-size:var(--font-size-100, .875rem)}.mc-status-notification__footer{align-items:flex-start;display:flex;flex-flow:row wrap;gap:.5rem;margin-top:.75rem;margin-bottom:.5rem}.mc-status-notification--information{background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7)}.mc-status-notification--information .mc-status-notification__icon{fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification--success{background:var(--status-notification-color-background-success, #ebf5de);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-success, #78be20)}.mc-status-notification--success .mc-status-notification__icon{fill:var(--status-notification-color-icon-success, #3f9e10)}.mc-status-notification--warning{background:var(--status-notification-color-background-warning, #fdf1e8);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-warning, #ef934a)}.mc-status-notification--warning .mc-status-notification__icon{fill:var(--status-notification-color-icon-warning, #ea7315)}.mc-status-notification--error{background:var(--status-notification-color-background-error, #fdeaea);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-error, #ef5f5c)}.mc-status-notification--error .mc-status-notification__icon{fill:var(--status-notification-color-icon-error, #ea302d)}.mc-status-notification-closable__close{margin:.25rem}\n"], dependencies: [{ kind: "component", type: Cross20, selector: "Cross20", inputs: ["color", "hostClass"] }, { kind: "component", type: MozIconButtonComponent, selector: "moz-icon-button", inputs: ["appearance", "size", "disabled", "ghost", "outlined", "type", "ariaLabel"] }, { kind: "directive", type: NgComponentOutlet, selector: "[ngComponentOutlet]", inputs: ["ngComponentOutlet", "ngComponentOutletInputs", "ngComponentOutletInjector", "ngComponentOutletEnvironmentInjector", "ngComponentOutletContent", "ngComponentOutletNgModule"], exportAs: ["ngComponentOutlet"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush });
|
|
1596
1596
|
}
|
|
1597
1597
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.1.0", ngImport: i0, type: MozStatusNotificationComponent, decorators: [{
|
|
1598
1598
|
type: Component,
|
|
1599
|
-
args: [{ selector: 'moz-status-notification', changeDetection: ChangeDetectionStrategy.OnPush, imports: [Cross20, MozIconButtonComponent, NgComponentOutlet, NgTemplateOutlet], template: "<section role=\"status\" [class]=\"classes()\">\n <div class=\"mc-status-notification__icon\">\n <ng-container [ngComponentOutlet]=\"iconComponent()\" />\n </div>\n\n <div class=\"mc-status-notification__content\">\n <span class=\"mc-status-notification__title\">{{ title() }}</span>\n @if (descriptionTpl()) {\n <div class=\"mc-status-notification__message\">\n <ng-container [ngTemplateOutlet]=\"descriptionTpl()\" />\n </div>\n } @if (footerTpl()) {\n <div class=\"mc-status-notification__footer\">\n <ng-container [ngTemplateOutlet]=\"footerTpl()\" />\n </div>\n }\n </div>\n\n @if (closable()) {\n <moz-icon-button\n size=\"s\"\n class=\"mc-status-notification-closable__close\"\n [ghost]=\"true\"\n type=\"button\"\n [appearance]=\"'standard'\"\n (click)=\"onCloseClick()\"\n ariaLabel=\"Close notification\"\n >\n <Cross20 icon />\n </moz-icon-button>\n }\n</section>\n", styles: [".mc-status-notification{border-radius:var(--border-radius-m, .5rem);background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7);display:flex;flex-flow:row wrap;align-items:flex-start;position:relative;box-sizing:border-box;color:var(--status-notification-color-text, #000000)}.mc-status-notification__icon{width:2rem;height:2rem;margin:.75rem;fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification__content{flex:1 1 0;padding:.75rem 1rem .75rem 0}.mc-status-notification__title,.mc-status-notification__message{line-height:var(--line-height-s, 1.3);margin-block:0}.mc-status-notification__title{font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-150, 1rem);margin-block-end:.25rem}.mc-status-notification__message{font-size:var(--font-size-100, .875rem)}.mc-status-notification__footer{align-items:flex-start;display:flex;flex-flow:row wrap;gap:.5rem;margin-top:.75rem;margin-bottom:.5rem}.mc-status-notification--information{background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7)}.mc-status-notification--information .mc-status-notification__icon{fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification--success{background:var(--status-notification-color-background-success, #ebf5de);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-success, #78be20)}.mc-status-notification--success .mc-status-notification__icon{fill:var(--status-notification-color-icon-success, #3f9e10)}.mc-status-notification--warning{background:var(--status-notification-color-background-warning, #fdf1e8);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-warning, #ef934a)}.mc-status-notification--warning .mc-status-notification__icon{fill:var(--status-notification-color-icon-warning, #ea7315)}.mc-status-notification--error{background:var(--status-notification-color-background-error, #fdeaea);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-error, #ef5f5c)}.mc-status-notification--error .mc-status-notification__icon{fill:var(--status-notification-color-icon-error, #ea302d)}.mc-status-notification-closable__close{margin:.25rem}\n"] }]
|
|
1600
|
-
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required:
|
|
1599
|
+
args: [{ selector: 'moz-status-notification', changeDetection: ChangeDetectionStrategy.OnPush, imports: [Cross20, MozIconButtonComponent, NgComponentOutlet, NgTemplateOutlet], template: "<section role=\"status\" [class]=\"classes()\">\n <div class=\"mc-status-notification__icon\">\n <ng-container [ngComponentOutlet]=\"iconComponent()\" />\n </div>\n\n <div class=\"mc-status-notification__content\">\n @if(title()){\n <span class=\"mc-status-notification__title\">{{ title() }}</span>\n } @if (descriptionTpl()) {\n <div class=\"mc-status-notification__message\">\n <ng-container [ngTemplateOutlet]=\"descriptionTpl()\" />\n </div>\n } @if (footerTpl()) {\n <div class=\"mc-status-notification__footer\">\n <ng-container [ngTemplateOutlet]=\"footerTpl()\" />\n </div>\n }\n </div>\n\n @if (closable()) {\n <moz-icon-button\n size=\"s\"\n class=\"mc-status-notification-closable__close\"\n [ghost]=\"true\"\n type=\"button\"\n [appearance]=\"'standard'\"\n (click)=\"onCloseClick()\"\n ariaLabel=\"Close notification\"\n >\n <Cross20 icon />\n </moz-icon-button>\n }\n</section>\n", styles: [".mc-status-notification{border-radius:var(--border-radius-m, .5rem);background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7);display:flex;flex-flow:row wrap;align-items:flex-start;position:relative;box-sizing:border-box;color:var(--status-notification-color-text, #000000)}.mc-status-notification__icon{width:2rem;height:2rem;margin:.75rem;fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification__content{flex:1 1 0;padding:.75rem 1rem .75rem 0}.mc-status-notification__title,.mc-status-notification__message{line-height:var(--line-height-s, 1.3);margin-block:0}.mc-status-notification__title{font-weight:var(--font-weight-semi-bold, 600);font-size:var(--font-size-150, 1rem);margin-block-end:.25rem}.mc-status-notification__message{font-size:var(--font-size-100, .875rem)}.mc-status-notification__footer{align-items:flex-start;display:flex;flex-flow:row wrap;gap:.5rem;margin-top:.75rem;margin-bottom:.5rem}.mc-status-notification--information{background:var(--status-notification-color-background-info, #e1f3f9);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-info, #3facd7)}.mc-status-notification--information .mc-status-notification__icon{fill:var(--status-notification-color-icon-info, #0b96cc)}.mc-status-notification--success{background:var(--status-notification-color-background-success, #ebf5de);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-success, #78be20)}.mc-status-notification--success .mc-status-notification__icon{fill:var(--status-notification-color-icon-success, #3f9e10)}.mc-status-notification--warning{background:var(--status-notification-color-background-warning, #fdf1e8);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-warning, #ef934a)}.mc-status-notification--warning .mc-status-notification__icon{fill:var(--status-notification-color-icon-warning, #ea7315)}.mc-status-notification--error{background:var(--status-notification-color-background-error, #fdeaea);box-shadow:inset 0 0 0 var(--border-width-s, .0625rem) var(--status-notification-color-border-error, #ef5f5c)}.mc-status-notification--error .mc-status-notification__icon{fill:var(--status-notification-color-icon-error, #ea302d)}.mc-status-notification-closable__close{margin:.25rem}\n"] }]
|
|
1600
|
+
}], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], status: [{ type: i0.Input, args: [{ isSignal: true, alias: "status", required: false }] }], closable: [{ type: i0.Input, args: [{ isSignal: true, alias: "closable", required: false }] }], closed: [{ type: i0.Output, args: ["closed"] }], descriptionTpl: [{ type: i0.ContentChild, args: ['description', { ...{ descendants: false }, isSignal: true }] }], footerTpl: [{ type: i0.ContentChild, args: ['footer', { ...{ descendants: false }, isSignal: true }] }] } });
|
|
1601
1601
|
|
|
1602
1602
|
class MozTabComponent {
|
|
1603
1603
|
label = input.required(...(ngDevMode ? [{ debugName: "label" }] : []));
|