monkey-style-guide 21.2.33 → 21.2.34
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.
|
@@ -824,7 +824,7 @@ class MonkeyAlertComponent {
|
|
|
824
824
|
return typeIcons[type];
|
|
825
825
|
}
|
|
826
826
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: MonkeyAlertComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
827
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.23", type: MonkeyAlertComponent, isStandalone: true, selector: "monkey-alert", inputs: { buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onButtonClicked: "onButtonClicked" }, host: { attributes: { "data-testid": "monkey-alert" }, properties: { "attr.id": "id", "id": "id" } }, ngImport: i0, template: "<div [class]=\"'monkey-alert__card ' + type()\">\r\n @if (type()) {\r\n <i class=\"mk-i mk-i-{{icon(type())}} {{'monkey-alert__card__type-' + type()}}\"></i>\r\n }\r\n <div class=\"monkey-alert__card__content\">\r\n <h4 class=\"monkey-alert__card__title\">{{ title() }}</h4>\r\n <h5 class=\"monkey-alert__card__message\">{{ message() }}</h5>\r\n @if (buttonLabel()) {\r\n <div>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"mecx-link fw-medium fs-base\"\r\n (click)=\"onButtonClicked.emit()\"\r\n >\r\n <span>{{ buttonLabel() }}</span>\r\n </a>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: ["monkey-alert{display:flex}monkey-alert .mecx-link{letter-spacing:.42px}monkey-alert .monkey-alert__card{border-radius:8px;display:flex;gap:var(--mecx-spaces-xs);padding:var(--mecx-spaces-cozy)}monkey-alert .monkey-alert__card.alert{background-color:var(--mecx-color-warning-100);border:solid 2px var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.alert>.mk-i{color:var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.default{background-color:var(--mecx-color-gray-50);border:solid 2px var(--mecx-color-gray-400)}monkey-alert .monkey-alert__card.default>.mk-i{color:var(--mecx-color-gray-900)}monkey-alert .monkey-alert__card.error{background-color:var(--mecx-color-error-100);border:solid 2px var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.error>.mk-i{color:var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.info{background-color:var(--mecx-color-question-100);border:solid 2px var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.info>.mk-i{color:var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.success{background-color:var(--mecx-color-success-100);border:solid 2px var(--mecx-color-success-500)}monkey-alert .monkey-alert__card.success>.mk-i{color:var(--mecx-color-success-500)}monkey-alert .monkey-alert__card__content{display:flex;flex-direction:column}monkey-alert .monkey-alert__card__title{color:var(--mecx-color-gray-900);font-size:var(--mecx-fs-base);font-weight:var(--mecx-fw-semibold);letter-spacing:.14px;line-height:var(--mecx-lh-24)}monkey-alert .monkey-alert__card__message{color:var(--mecx-color-gray-700);font-size:var(--mecx-fs-xxs);font-weight:var(--mecx-fw-regular);letter-spacing:.14px;line-height:var(--mecx-lh-24);margin-bottom:8px}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
827
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.23", type: MonkeyAlertComponent, isStandalone: true, selector: "monkey-alert", inputs: { buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, message: { classPropertyName: "message", publicName: "message", isSignal: true, isRequired: true, transformFunction: null }, title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: true, transformFunction: null }, id: { classPropertyName: "id", publicName: "id", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onButtonClicked: "onButtonClicked" }, host: { attributes: { "data-testid": "monkey-alert" }, properties: { "attr.id": "id", "id": "id" } }, ngImport: i0, template: "<div [class]=\"'monkey-alert__card ' + type()\">\r\n @if (type()) {\r\n <i class=\"mk-i mk-i-{{icon(type())}} {{'monkey-alert__card__type-' + type()}}\"></i>\r\n }\r\n <div class=\"monkey-alert__card__content\">\r\n <h4 class=\"monkey-alert__card__title\">{{ title() }}</h4>\r\n <h5 class=\"monkey-alert__card__message\">{{ message() }}</h5>\r\n @if (buttonLabel()) {\r\n <div>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"mecx-link fw-medium fs-base\"\r\n (click)=\"onButtonClicked.emit()\"\r\n >\r\n <span>{{ buttonLabel() }}</span>\r\n </a>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: ["monkey-alert{display:flex}monkey-alert .mecx-link{letter-spacing:.42px}monkey-alert .monkey-alert__card{border-radius:8px;display:flex;gap:var(--mecx-spaces-xs);padding:var(--mecx-spaces-cozy);width:100%}monkey-alert .monkey-alert__card.alert{background-color:var(--mecx-color-warning-100);border:solid 2px var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.alert>.mk-i{color:var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.default{background-color:var(--mecx-color-gray-50);border:solid 2px var(--mecx-color-gray-400)}monkey-alert .monkey-alert__card.default>.mk-i{color:var(--mecx-color-gray-900)}monkey-alert .monkey-alert__card.error{background-color:var(--mecx-color-error-100);border:solid 2px var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.error>.mk-i{color:var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.info{background-color:var(--mecx-color-question-100);border:solid 2px var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.info>.mk-i{color:var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.success{background-color:var(--mecx-color-success-100);border:solid 2px var(--mecx-color-success-500)}monkey-alert .monkey-alert__card.success>.mk-i{color:var(--mecx-color-success-500)}monkey-alert .monkey-alert__card__content{display:flex;flex-direction:column}monkey-alert .monkey-alert__card__title{color:var(--mecx-color-gray-900);font-size:var(--mecx-fs-base);font-weight:var(--mecx-fw-semibold);letter-spacing:.14px;line-height:var(--mecx-lh-24)}monkey-alert .monkey-alert__card__message{color:var(--mecx-color-gray-700);font-size:var(--mecx-fs-xxs);font-weight:var(--mecx-fw-regular);letter-spacing:.14px;line-height:var(--mecx-lh-24);margin-bottom:8px}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
828
828
|
}
|
|
829
829
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.23", ngImport: i0, type: MonkeyAlertComponent, decorators: [{
|
|
830
830
|
type: Component,
|
|
@@ -832,7 +832,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.23", ngImpo
|
|
|
832
832
|
'data-testid': 'monkey-alert',
|
|
833
833
|
'[attr.id]': 'id',
|
|
834
834
|
'[id]': 'id'
|
|
835
|
-
}, template: "<div [class]=\"'monkey-alert__card ' + type()\">\r\n @if (type()) {\r\n <i class=\"mk-i mk-i-{{icon(type())}} {{'monkey-alert__card__type-' + type()}}\"></i>\r\n }\r\n <div class=\"monkey-alert__card__content\">\r\n <h4 class=\"monkey-alert__card__title\">{{ title() }}</h4>\r\n <h5 class=\"monkey-alert__card__message\">{{ message() }}</h5>\r\n @if (buttonLabel()) {\r\n <div>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"mecx-link fw-medium fs-base\"\r\n (click)=\"onButtonClicked.emit()\"\r\n >\r\n <span>{{ buttonLabel() }}</span>\r\n </a>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: ["monkey-alert{display:flex}monkey-alert .mecx-link{letter-spacing:.42px}monkey-alert .monkey-alert__card{border-radius:8px;display:flex;gap:var(--mecx-spaces-xs);padding:var(--mecx-spaces-cozy)}monkey-alert .monkey-alert__card.alert{background-color:var(--mecx-color-warning-100);border:solid 2px var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.alert>.mk-i{color:var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.default{background-color:var(--mecx-color-gray-50);border:solid 2px var(--mecx-color-gray-400)}monkey-alert .monkey-alert__card.default>.mk-i{color:var(--mecx-color-gray-900)}monkey-alert .monkey-alert__card.error{background-color:var(--mecx-color-error-100);border:solid 2px var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.error>.mk-i{color:var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.info{background-color:var(--mecx-color-question-100);border:solid 2px var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.info>.mk-i{color:var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.success{background-color:var(--mecx-color-success-100);border:solid 2px var(--mecx-color-success-500)}monkey-alert .monkey-alert__card.success>.mk-i{color:var(--mecx-color-success-500)}monkey-alert .monkey-alert__card__content{display:flex;flex-direction:column}monkey-alert .monkey-alert__card__title{color:var(--mecx-color-gray-900);font-size:var(--mecx-fs-base);font-weight:var(--mecx-fw-semibold);letter-spacing:.14px;line-height:var(--mecx-lh-24)}monkey-alert .monkey-alert__card__message{color:var(--mecx-color-gray-700);font-size:var(--mecx-fs-xxs);font-weight:var(--mecx-fw-regular);letter-spacing:.14px;line-height:var(--mecx-lh-24);margin-bottom:8px}\n"] }]
|
|
835
|
+
}, template: "<div [class]=\"'monkey-alert__card ' + type()\">\r\n @if (type()) {\r\n <i class=\"mk-i mk-i-{{icon(type())}} {{'monkey-alert__card__type-' + type()}}\"></i>\r\n }\r\n <div class=\"monkey-alert__card__content\">\r\n <h4 class=\"monkey-alert__card__title\">{{ title() }}</h4>\r\n <h5 class=\"monkey-alert__card__message\">{{ message() }}</h5>\r\n @if (buttonLabel()) {\r\n <div>\r\n <a\r\n href=\"javascript:void(0)\"\r\n class=\"mecx-link fw-medium fs-base\"\r\n (click)=\"onButtonClicked.emit()\"\r\n >\r\n <span>{{ buttonLabel() }}</span>\r\n </a>\r\n </div>\r\n }\r\n </div>\r\n</div>\r\n", styles: ["monkey-alert{display:flex}monkey-alert .mecx-link{letter-spacing:.42px}monkey-alert .monkey-alert__card{border-radius:8px;display:flex;gap:var(--mecx-spaces-xs);padding:var(--mecx-spaces-cozy);width:100%}monkey-alert .monkey-alert__card.alert{background-color:var(--mecx-color-warning-100);border:solid 2px var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.alert>.mk-i{color:var(--mecx-color-warning-500)}monkey-alert .monkey-alert__card.default{background-color:var(--mecx-color-gray-50);border:solid 2px var(--mecx-color-gray-400)}monkey-alert .monkey-alert__card.default>.mk-i{color:var(--mecx-color-gray-900)}monkey-alert .monkey-alert__card.error{background-color:var(--mecx-color-error-100);border:solid 2px var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.error>.mk-i{color:var(--mecx-color-error-500)}monkey-alert .monkey-alert__card.info{background-color:var(--mecx-color-question-100);border:solid 2px var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.info>.mk-i{color:var(--mecx-color-question-500)}monkey-alert .monkey-alert__card.success{background-color:var(--mecx-color-success-100);border:solid 2px var(--mecx-color-success-500)}monkey-alert .monkey-alert__card.success>.mk-i{color:var(--mecx-color-success-500)}monkey-alert .monkey-alert__card__content{display:flex;flex-direction:column}monkey-alert .monkey-alert__card__title{color:var(--mecx-color-gray-900);font-size:var(--mecx-fs-base);font-weight:var(--mecx-fw-semibold);letter-spacing:.14px;line-height:var(--mecx-lh-24)}monkey-alert .monkey-alert__card__message{color:var(--mecx-color-gray-700);font-size:var(--mecx-fs-xxs);font-weight:var(--mecx-fw-regular);letter-spacing:.14px;line-height:var(--mecx-lh-24);margin-bottom:8px}\n"] }]
|
|
836
836
|
}], ctorParameters: () => [], propDecorators: { buttonLabel: [{ type: i0.Input, args: [{ isSignal: true, alias: "buttonLabel", required: false }] }], message: [{ type: i0.Input, args: [{ isSignal: true, alias: "message", required: true }] }], title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: true }] }], type: [{ type: i0.Input, args: [{ isSignal: true, alias: "type", required: true }] }], onButtonClicked: [{ type: i0.Output, args: ["onButtonClicked"] }], id: [{
|
|
837
837
|
type: Input
|
|
838
838
|
}] } });
|