coer-elements 2.0.13 → 2.0.16
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/components/lib/coer-button/coer-button.component.d.ts +1 -1
- package/fesm2022/coer-elements-components.mjs +2 -2
- package/fesm2022/coer-elements-components.mjs.map +1 -1
- package/fesm2022/coer-elements-pages.mjs +4 -4
- package/fesm2022/coer-elements-pages.mjs.map +1 -1
- package/package.json +5 -5
- package/styles/coer-elements.css +255 -204
@@ -6,7 +6,7 @@ export declare class CoerButton implements OnInit, OnDestroy {
|
|
6
6
|
private _tooltip;
|
7
7
|
private _tooltipElement;
|
8
8
|
id: import("@angular/core").InputSignal<string>;
|
9
|
-
color: import("@angular/core").InputSignal<"default" | "primary" | "secondary" | "success" | "warning" | "danger" | "navigation" | "information" | "dark">;
|
9
|
+
color: import("@angular/core").InputSignal<"default" | "primary" | "secondary" | "success" | "warning" | "danger" | "navigation" | "information" | "dark" | "light">;
|
10
10
|
type: import("@angular/core").InputSignal<"filled" | "outline" | "icon" | "icon-outline" | "icon-no-border">;
|
11
11
|
icon: import("@angular/core").InputSignal<string>;
|
12
12
|
iconPosition: import("@angular/core").InputSignal<"left" | "right">;
|
@@ -242,11 +242,11 @@ class CoerButton {
|
|
242
242
|
Tools.Sleep().then(() => this._element.blur());
|
243
243
|
}
|
244
244
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerButton, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
245
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerButton, isStandalone: false, selector: "coer-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, path: { classPropertyName: "path", publicName: "path", isSignal: true, isRequired: false, transformFunction: null }, animation: { classPropertyName: "animation", publicName: "animation", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div [ngClass]=\"{ 'coer-button': true }\">\r\n <a [id]=\"_id + '-container'\"\r\n [routerLink]=\"(path().length > 0 && _isEnable()) ? path() : null\"\r\n [ngClass]=\"{ 'loading': isLoading(), 'animate__animated animate__zoomIn': true, 'animate__disabled': !animation(), 'invisible': isInvisible() || isReadonly() }\"\r\n [ngStyle]=\"{ 'margin-top': marginTop(), 'margin-right': marginRight(), 'margin-bottom': marginBottom(), 'margin-left': marginLeft() }\">\r\n \r\n @if(type() =='filled' || type() == 'outline') {\r\n <button mat-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary' && type() =='filled'),\r\n 'secondary-filled' : (color() == 'secondary' && type() =='filled'),\r\n 'success-filled' : (color() == 'success' && type() =='filled'),\r\n 'warning-filled' : (color() == 'warning' && type() =='filled'),\r\n 'danger-filled' : (color() == 'danger' && type() =='filled'),\r\n 'navigation-filled' : (color() == 'navigation' && type() =='filled'),\r\n 'information-filled' : (color() == 'information' && type() =='filled'),\r\n 'dark-filled' : (color() == 'dark' && type() =='filled'),\r\n 'primary-outline' : (color() == 'primary' && type() =='outline'),\r\n 'secondary-outline' : (color() == 'secondary' && type() =='outline'),\r\n 'success-outline' : (color() == 'success' && type() =='outline'),\r\n 'warning-outline' : (color() == 'warning' && type() =='outline'),\r\n 'danger-outline' : (color() == 'danger' && type() =='outline'),\r\n 'navigation-outline' : (color() == 'navigation' && type() =='outline'),\r\n 'information-outline': (color() == 'information' && type() =='outline'),\r\n 'dark-outline' : (color() == 'dark' && type() =='outline'),\r\n 'readonly': isDisabled(),\r\n 'cursor-wait': isLoading()\r\n }\"\r\n [ngStyle]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'height' : height(),\r\n 'min-height': minHeight()\r\n }\">\r\n <span class=\"slot\" *ngIf=\"!isLoading(); else loading\" >\r\n @if(iconPosition() == 'left') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span>\r\n }\r\n\r\n <span [ngClass]=\"{ \r\n 'ms-2': (iconPosition() == 'left' && icon().length > 0), \r\n 'me-2': (iconPosition() == 'right' && icon().length > 0) \r\n }\">\r\n <ng-content></ng-content>\r\n </span>\r\n\r\n @if(iconPosition() == 'right') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span> \r\n }\r\n </span>\r\n\r\n <ng-template #loading>\r\n <span class=\"slot fa-fade\">\r\n <span class=\"me-2\"> Loading </span>\r\n <i class=\"spinner-border\"></i>\r\n </span>\r\n </ng-template>\r\n </button>\r\n }\r\n\r\n @else {\r\n @if (type() == 'icon') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary'),\r\n 'secondary-filled' : (color() == 'secondary'),\r\n 'success-filled' : (color() == 'success'),\r\n 'warning-filled' : (color() == 'warning'),\r\n 'danger-filled' : (color() == 'danger'),\r\n 'navigation-filled' : (color() == 'navigation'),\r\n 'information-filled': (color() == 'information'),\r\n 'dark-filled' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-outline') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-no-border') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'icon-no-border' : true\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n }\r\n </a>\r\n</div>", styles: [":root{--blue: #0d6efd;--gray: #6c757d;--green: #198754;--yellow:#ffc107;--red: #dc3545;--smoke: #f5f5f5;--black: #252525;--orange:#fd6031;--white: #ffffff;--purple:#a615bc;--primary-inner: var(--primary, var(--orange));--secondary-inner: var(--secondary, var(--gray));--success-inner: var(--success, var(--green));--warning-inner: var(--warning, var(--yellow));--danger-inner: var(--danger, var(--red));--navigation-inner: var(--navigation, var(--orange));--information-inner: var(--information, var(--blue));--breadcrumbs-inner: var(--app-breadcrumbs, var(--blue));--background-inner: var(--app-background, var(--smoke));--containers-inner: var(--app-containers, var(--white));--sidenav-inner: var(--app-sidenav, var(--black));--sidenav-text-inner: var(--app-sidenav-text, var(--smoke));--sidenav-active-inner: var(--app-sidenav-active, var(--orange));--toolbar-inner: var(--app-toolbar, var(--smoke));--toolbar-text-inner: var(--app-toolbar-text, var(--black))}.text-transparent{color:transparent!important}.text-transparent-bold{color:transparent!important;font-weight:700!important}.border-transparent{border-color:transparent!important}.border-top-transparent{border-top-color:transparent!important}.border-right-transparent{border-right-color:transparent!important}.border-bottom-transparent{border-bottom-color:transparent!important}.border-left-transparent{border-left-color:transparent!important}.background-transparent{background-color:transparent!important}.background-border-transparent{background-color:transparent!important;border-color:transparent!important}.text-blue{color:var(--blue)!important}.text-blue-bold{color:var(--blue)!important;font-weight:700!important}.border-blue{border-color:var(--blue)!important}.border-top-blue{border-top-color:var(--blue)!important}.border-right-blue{border-right-color:var(--blue)!important}.border-bottom-blue{border-bottom-color:var(--blue)!important}.border-left-blue{border-left-color:var(--blue)!important}.background-blue{background-color:var(--blue)!important}.background-border-blue{background-color:var(--blue)!important;border-color:var(--blue)!important}.text-gray{color:var(--gray)!important}.text-gray-bold{color:var(--gray)!important;font-weight:700!important}.border-gray{border-color:var(--gray)!important}.border-top-gray{border-top-color:var(--gray)!important}.border-right-gray{border-right-color:var(--gray)!important}.border-bottom-gray{border-bottom-color:var(--gray)!important}.border-left-gray{border-left-color:var(--gray)!important}.background-gray{background-color:var(--gray)!important}.background-border-gray{background-color:var(--gray)!important;border-color:var(--gray)!important}.text-green{color:var(--green)!important}.text-green-bold{color:var(--green)!important;font-weight:700!important}.border-green{border-color:var(--green)!important}.border-top-green{border-top-color:var(--green)!important}.border-right-green{border-right-color:var(--green)!important}.border-bottom-green{border-bottom-color:var(--green)!important}.border-left-green{border-left-color:var(--green)!important}.background-green{background-color:var(--green)!important}.background-border-green{background-color:var(--green)!important;border-color:var(--green)!important}.text-yellow{color:var(--yellow)!important}.text-yellow-bold{color:var(--yellow)!important;font-weight:700!important}.border-yellow{border-color:var(--yellow)!important}.border-top-yellow{border-top-color:var(--yellow)!important}.border-right-yellow{border-right-color:var(--yellow)!important}.border-bottom-yellow{border-bottom-color:var(--yellow)!important}.border-left-yellow{border-left-color:var(--yellow)!important}.background-yellow{background-color:var(--yellow)!important}.background-border-yellow{background-color:var(--yellow)!important;border-color:var(--yellow)!important}.text-red{color:var(--red)!important}.text-red-bold{color:var(--red)!important;font-weight:700!important}.border-red{border-color:var(--red)!important}.border-top-red{border-top-color:var(--red)!important}.border-right-red{border-right-color:var(--red)!important}.border-bottom-red{border-bottom-color:var(--red)!important}.border-left-red{border-left-color:var(--red)!important}.background-red{background-color:var(--red)!important}.background-border-red{background-color:var(--red)!important;border-color:var(--red)!important}.text-smoke{color:var(--smoke)!important}.text-smoke-bold{color:var(--smoke)!important;font-weight:700!important}.border-smoke{border-color:var(--smoke)!important}.border-top-smoke{border-top-color:var(--smoke)!important}.border-right-smoke{border-right-color:var(--smoke)!important}.border-bottom-smoke{border-bottom-color:var(--smoke)!important}.border-left-smoke{border-left-color:var(--smoke)!important}.background-smoke{background-color:var(--smoke)!important}.background-border-smoke{background-color:var(--smoke)!important;border-color:var(--smoke)!important}.text-black{color:var(--black)!important}.text-black-bold{color:var(--black)!important;font-weight:700!important}.border-black{border-color:var(--black)!important}.border-top-black{border-top-color:var(--black)!important}.border-right-black{border-right-color:var(--black)!important}.border-bottom-black{border-bottom-color:var(--black)!important}.border-left-black{border-left-color:var(--black)!important}.background-black{background-color:var(--black)!important}.background-border-black{background-color:var(--black)!important;border-color:var(--black)!important}.text-orange{color:var(--orange)!important}.text-orange-bold{color:var(--orange)!important;font-weight:700!important}.border-orange{border-color:var(--orange)!important}.border-top-orange{border-top-color:var(--orange)!important}.border-right-orange{border-right-color:var(--orange)!important}.border-bottom-orange{border-bottom-color:var(--orange)!important}.border-left-orange{border-left-color:var(--orange)!important}.background-orange{background-color:var(--orange)!important}.background-border-orange{background-color:var(--orange)!important;border-color:var(--orange)!important}.text-white{color:var(--white)!important}.text-white-bold{color:var(--white)!important;font-weight:700!important}.border-white{border-color:var(--white)!important}.border-top-white{border-top-color:var(--white)!important}.border-right-white{border-right-color:var(--white)!important}.border-bottom-white{border-bottom-color:var(--white)!important}.border-left-white{border-left-color:var(--white)!important}.background-white{background-color:var(--white)!important}.background-border-white{background-color:var(--white)!important;border-color:var(--white)!important}.text-purple{color:var(--purple)!important}.text-purple-bold{color:var(--purple)!important;font-weight:700!important}.border-purple{border-color:var(--purple)!important}.border-top-purple{border-top-color:var(--purple)!important}.border-right-purple{border-right-color:var(--purple)!important}.border-bottom-purple{border-bottom-color:var(--purple)!important}.border-left-purple{border-left-color:var(--purple)!important}.background-purple{background-color:var(--purple)!important}.background-border-purple{background-color:var(--purple)!important;border-color:var(--purple)!important}.text-primary{color:var(--primary-inner)!important}.text-primary-bold{color:var(--primary-inner)!important;font-weight:700!important}.border-primary{border-color:var(--primary-inner)!important}.border-top-primary{border-top-color:var(--primary-inner)!important}.border-right-primary{border-right-color:var(--primary-inner)!important}.border-bottom-primary{border-bottom-color:var(--primary-inner)!important}.border-left-primary{border-left-color:var(--primary-inner)!important}.background-primary{background-color:var(--primary-inner)!important}.background-border-primary{background-color:var(--primary-inner)!important;border-color:var(--primary-inner)!important}.text-secondary{color:var(--secondary-inner)!important}.text-secondary-bold{color:var(--secondary-inner)!important;font-weight:700!important}.border-secondary{border-color:var(--secondary-inner)!important}.border-top-secondary{border-top-color:var(--secondary-inner)!important}.border-right-secondary{border-right-color:var(--secondary-inner)!important}.border-bottom-secondary{border-bottom-color:var(--secondary-inner)!important}.border-left-secondary{border-left-color:var(--secondary-inner)!important}.background-secondary{background-color:var(--secondary-inner)!important}.background-border-secondary{background-color:var(--secondary-inner)!important;border-color:var(--secondary-inner)!important}.text-success{color:var(--success-inner)!important}.text-success-bold{color:var(--success-inner)!important;font-weight:700!important}.border-success{border-color:var(--success-inner)!important}.border-top-success{border-top-color:var(--success-inner)!important}.border-right-success{border-right-color:var(--success-inner)!important}.border-bottom-success{border-bottom-color:var(--success-inner)!important}.border-left-success{border-left-color:var(--success-inner)!important}.background-success{background-color:var(--success-inner)!important}.background-border-success{background-color:var(--success-inner)!important;border-color:var(--success-inner)!important}.text-warning{color:var(--warning-inner)!important}.text-warning-bold{color:var(--warning-inner)!important;font-weight:700!important}.border-warning{border-color:var(--warning-inner)!important}.border-top-warning{border-top-color:var(--warning-inner)!important}.border-right-warning{border-right-color:var(--warning-inner)!important}.border-bottom-warning{border-bottom-color:var(--warning-inner)!important}.border-left-warning{border-left-color:var(--warning-inner)!important}.background-warning{background-color:var(--warning-inner)!important}.background-border-warning{background-color:var(--warning-inner)!important;border-color:var(--warning-inner)!important}.text-danger{color:var(--danger-inner)!important}.text-danger-bold{color:var(--danger-inner)!important;font-weight:700!important}.border-danger{border-color:var(--danger-inner)!important}.border-top-danger{border-top-color:var(--danger-inner)!important}.border-right-danger{border-right-color:var(--danger-inner)!important}.border-bottom-danger{border-bottom-color:var(--danger-inner)!important}.border-left-danger{border-left-color:var(--danger-inner)!important}.background-danger{background-color:var(--danger-inner)!important}.background-border-danger{background-color:var(--danger-inner)!important;border-color:var(--danger-inner)!important}.text-navigation{color:var(--navigation-inner)!important}.text-navigation-bold{color:var(--navigation-inner)!important;font-weight:700!important}.border-navigation{border-color:var(--navigation-inner)!important}.border-top-navigation{border-top-color:var(--navigation-inner)!important}.border-right-navigation{border-right-color:var(--navigation-inner)!important}.border-bottom-navigation{border-bottom-color:var(--navigation-inner)!important}.border-left-navigation{border-left-color:var(--navigation-inner)!important}.background-navigation{background-color:var(--navigation-inner)!important}.background-border-navigation{background-color:var(--navigation-inner)!important;border-color:var(--navigation-inner)!important}.text-information{color:var(--information-inner)!important}.text-information-bold{color:var(--information-inner)!important;font-weight:700!important}.border-information{border-color:var(--information-inner)!important}.border-top-information{border-top-color:var(--information-inner)!important}.border-right-information{border-right-color:var(--information-inner)!important}.border-bottom-information{border-bottom-color:var(--information-inner)!important}.border-left-information{border-left-color:var(--information-inner)!important}.background-information{background-color:var(--information-inner)!important}.background-border-information{background-color:var(--information-inner)!important;border-color:var(--information-inner)!important}.text-breadcrumbs{color:var(--breadcrumbs-inner)!important}.text-breadcrumbs-bold{color:var(--breadcrumbs-inner)!important;font-weight:700!important}.border-breadcrumbs{border-color:var(--breadcrumbs-inner)!important}.border-top-breadcrumbs{border-top-color:var(--breadcrumbs-inner)!important}.border-right-breadcrumbs{border-right-color:var(--breadcrumbs-inner)!important}.border-bottom-breadcrumbs{border-bottom-color:var(--breadcrumbs-inner)!important}.border-left-breadcrumbs{border-left-color:var(--breadcrumbs-inner)!important}.background-breadcrumbs{background-color:var(--breadcrumbs-inner)!important}.background-border-breadcrumbs{background-color:var(--breadcrumbs-inner)!important;border-color:var(--breadcrumbs-inner)!important}.text-app-background{color:var(--background-inner)!important}.text-app-background-bold{color:var(--background-inner)!important;font-weight:700!important}.border-app-background{border-color:var(--background-inner)!important}.border-top-app-background{border-top-color:var(--background-inner)!important}.border-right-app-background{border-right-color:var(--background-inner)!important}.border-bottom-app-background{border-bottom-color:var(--background-inner)!important}.border-left-app-background{border-left-color:var(--background-inner)!important}.background-app-background{background-color:var(--background-inner)!important}.background-border-app-background{background-color:var(--background-inner)!important;border-color:var(--background-inner)!important}.text-app-container{color:var(--containers-inner)!important}.text-app-container-bold{color:var(--containers-inner)!important;font-weight:700!important}.border-app-container{border-color:var(--containers-inner)!important}.border-top-app-container{border-top-color:var(--containers-inner)!important}.border-right-app-container{border-right-color:var(--containers-inner)!important}.border-bottom-app-container{border-bottom-color:var(--containers-inner)!important}.border-left-app-container{border-left-color:var(--containers-inner)!important}.background-app-container{background-color:var(--containers-inner)!important}.background-border-app-container{background-color:var(--containers-inner)!important;border-color:var(--containers-inner)!important}.text-app-sidenav{color:var(--sidenav-inner)!important}.text-app-sidenav-bold{color:var(--sidenav-inner)!important;font-weight:700!important}.border-app-sidenav{border-color:var(--sidenav-inner)!important}.border-top-app-sidenav{border-top-color:var(--sidenav-inner)!important}.border-right-app-sidenav{border-right-color:var(--sidenav-inner)!important}.border-bottom-app-sidenav{border-bottom-color:var(--sidenav-inner)!important}.border-left-app-sidenav{border-left-color:var(--sidenav-inner)!important}.background-app-sidenav{background-color:var(--sidenav-inner)!important}.background-border-app-sidenav{background-color:var(--sidenav-inner)!important;border-color:var(--sidenav-inner)!important}.text-app-sidenav-text{color:var(--sidenav-text-inner)!important}.text-app-sidenav-text-bold{color:var(--sidenav-text-inner)!important;font-weight:700!important}.border-app-sidenav-text{border-color:var(--sidenav-text-inner)!important}.border-top-app-sidenav-text{border-top-color:var(--sidenav-text-inner)!important}.border-right-app-sidenav-text{border-right-color:var(--sidenav-text-inner)!important}.border-bottom-app-sidenav-text{border-bottom-color:var(--sidenav-text-inner)!important}.border-left-app-sidenav-text{border-left-color:var(--sidenav-text-inner)!important}.background-app-sidenav-text{background-color:var(--sidenav-text-inner)!important}.background-border-app-sidenav-text{background-color:var(--sidenav-text-inner)!important;border-color:var(--sidenav-text-inner)!important}.text-app-sidenav-active{color:var(--sidenav-active-inner)!important}.text-app-sidenav-active-bold{color:var(--sidenav-active-inner)!important;font-weight:700!important}.border-app-sidenav-active{border-color:var(--sidenav-active-inner)!important}.border-top-app-sidenav-active{border-top-color:var(--sidenav-active-inner)!important}.border-right-app-sidenav-active{border-right-color:var(--sidenav-active-inner)!important}.border-bottom-app-sidenav-active{border-bottom-color:var(--sidenav-active-inner)!important}.border-left-app-sidenav-active{border-left-color:var(--sidenav-active-inner)!important}.background-app-sidenav-active{background-color:var(--sidenav-active-inner)!important}.background-border-app-sidenav-active{background-color:var(--sidenav-active-inner)!important;border-color:var(--sidenav-active-inner)!important}.text-app-toolbar{color:var(--toolbar-inner)!important}.text-app-toolbar-bold{color:var(--toolbar-inner)!important;font-weight:700!important}.border-app-toolbar{border-color:var(--toolbar-inner)!important}.border-top-app-toolbar{border-top-color:var(--toolbar-inner)!important}.border-right-app-toolbar{border-right-color:var(--toolbar-inner)!important}.border-bottom-app-toolbar{border-bottom-color:var(--toolbar-inner)!important}.border-left-app-toolbar{border-left-color:var(--toolbar-inner)!important}.background-app-toolbar{background-color:var(--toolbar-inner)!important}.background-border-app-toolbar{background-color:var(--toolbar-inner)!important;border-color:var(--toolbar-inner)!important}.text-app-toolbar-text{color:var(--toolbar-text-inner)!important}.text-app-toolbar-text-bold{color:var(--toolbar-text-inner)!important;font-weight:700!important}.border-app-toolbar-text{border-color:var(--toolbar-text-inner)!important}.border-top-app-toolbar-text{border-top-color:var(--toolbar-text-inner)!important}.border-right-app-toolbar-text{border-right-color:var(--toolbar-text-inner)!important}.border-bottom-app-toolbar-text{border-bottom-color:var(--toolbar-text-inner)!important}.border-left-app-toolbar-text{border-left-color:var(--toolbar-text-inner)!important}.background-app-toolbar-text{background-color:var(--toolbar-text-inner)!important}.background-border-app-toolbar-text{background-color:var(--toolbar-text-inner)!important;border-color:var(--toolbar-text-inner)!important}coer-button{display:contents!important}div.coer-button{display:contents!important}div.coer-button a{display:inline-block!important;height:fit-content!important;text-decoration:none!important}div.coer-button a.animate__disabled{animation-duration:0s!important}div.coer-button button{font-size:17px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button .slot{width:100px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}div.coer-button button.primary-filled{background-color:var(--primary-inner)!important;color:var(--white)!important}div.coer-button button.primary-outline{background-color:var(--white)!important;border:1px solid var(--primary-inner)!important;color:var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--primary-inner)!important}div.coer-button button.secondary-filled{background-color:var(--secondary-inner)!important;color:var(--white)!important}div.coer-button button.secondary-outline{background-color:var(--white)!important;border:1px solid var(--secondary-inner)!important;color:var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--secondary-inner)!important}div.coer-button button.success-filled{background-color:var(--success-inner)!important;color:var(--white)!important}div.coer-button button.success-outline{background-color:var(--white)!important;border:1px solid var(--success-inner)!important;color:var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):focus{box-shadow:0 0 20px var(--success-inner)!important}div.coer-button button.warning-filled{background-color:var(--warning-inner)!important;color:var(--black)!important}div.coer-button button.warning-outline{background-color:var(--white)!important;border:1px solid var(--warning-inner)!important;color:var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):focus{box-shadow:0 0 20px var(--warning-inner)!important}div.coer-button button.danger-filled{background-color:var(--danger-inner)!important;color:var(--white)!important}div.coer-button button.danger-outline{background-color:var(--white)!important;border:1px solid var(--danger-inner)!important;color:var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):focus{box-shadow:0 0 20px var(--danger-inner)!important}div.coer-button button.navigation-filled{background-color:var(--navigation-inner)!important;color:var(--white)!important}div.coer-button button.navigation-outline{background-color:var(--white)!important;border:1px solid var(--navigation-inner)!important;color:var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):focus{box-shadow:0 0 20px var(--navigation-inner)!important}div.coer-button button.information-filled{background-color:var(--information-inner)!important;color:var(--white)!important}div.coer-button button.information-outline{background-color:var(--white)!important;border:1px solid var(--information-inner)!important;color:var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):focus{box-shadow:0 0 20px var(--information-inner)!important}div.coer-button button.dark-filled{background-color:var(--black)!important;color:var(--white)!important}div.coer-button button.dark-outline{background-color:var(--white)!important;border:1px solid var(--black)!important;color:var(--black)!important}div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):focus{box-shadow:0 0 20px var(--black)!important}div.coer-button button.primary-filled:not(.readonly):hover,div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):hover,div.coer-button button.primary-outline:not(.readonly):focus,div.coer-button button.secondary-filled:not(.readonly):hover,div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):hover,div.coer-button button.secondary-outline:not(.readonly):focus,div.coer-button button.success-filled:not(.readonly):hover,div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):hover,div.coer-button button.success-outline:not(.readonly):focus,div.coer-button button.warning-filled:not(.readonly):hover,div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):hover,div.coer-button button.warning-outline:not(.readonly):focus,div.coer-button button.danger-filled:not(.readonly):hover,div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):hover,div.coer-button button.danger-outline:not(.readonly):focus,div.coer-button button.navigation-filled:not(.readonly):hover,div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):hover,div.coer-button button.navigation-outline:not(.readonly):focus,div.coer-button button.dark-filled:not(.readonly):hover,div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):hover,div.coer-button button.dark-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button{width:40px!important;height:40px!important;padding:0!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border{width:25px!important;height:25px!important;background-color:transparent!important;border:none!important;overflow:visible!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border *{font-size:medium!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-left,div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-in-right{font-size:20px!important}div.coer-button button.readonly,div.coer-button button.readonly:hover,div.coer-button button.readonly:focus{background-color:#dfdede!important;border-color:#dfdede!important;color:var(--white)!important}div.coer-button coer-button[ishidden=true],div.coer-button coer-button[ng-reflect-invisible=true]{position:relative!important;top:10000vh;left:10000vw}div.coer-button a.loading{cursor:wait!important}div.coer-button i{display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button i.spinner-border{width:15px!important;height:15px!important;font-size:16px!important}div.coer-button span{font-weight:700!important}div.coer-button .mat-mdc-button-touch-target{width:0px!important;height:0px!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
|
245
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.0.1", type: CoerButton, isStandalone: false, selector: "coer-button", inputs: { id: { classPropertyName: "id", publicName: "id", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: true, isRequired: false, transformFunction: null }, type: { classPropertyName: "type", publicName: "type", isSignal: true, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, iconPosition: { classPropertyName: "iconPosition", publicName: "iconPosition", isSignal: true, isRequired: false, transformFunction: null }, path: { classPropertyName: "path", publicName: "path", isSignal: true, isRequired: false, transformFunction: null }, animation: { classPropertyName: "animation", publicName: "animation", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, isDisabled: { classPropertyName: "isDisabled", publicName: "isDisabled", isSignal: true, isRequired: false, transformFunction: null }, isReadonly: { classPropertyName: "isReadonly", publicName: "isReadonly", isSignal: true, isRequired: false, transformFunction: null }, isInvisible: { classPropertyName: "isInvisible", publicName: "isInvisible", isSignal: true, isRequired: false, transformFunction: null }, width: { classPropertyName: "width", publicName: "width", isSignal: true, isRequired: false, transformFunction: null }, minWidth: { classPropertyName: "minWidth", publicName: "minWidth", isSignal: true, isRequired: false, transformFunction: null }, maxWidth: { classPropertyName: "maxWidth", publicName: "maxWidth", isSignal: true, isRequired: false, transformFunction: null }, height: { classPropertyName: "height", publicName: "height", isSignal: true, isRequired: false, transformFunction: null }, minHeight: { classPropertyName: "minHeight", publicName: "minHeight", isSignal: true, isRequired: false, transformFunction: null }, marginTop: { classPropertyName: "marginTop", publicName: "marginTop", isSignal: true, isRequired: false, transformFunction: null }, marginRight: { classPropertyName: "marginRight", publicName: "marginRight", isSignal: true, isRequired: false, transformFunction: null }, marginBottom: { classPropertyName: "marginBottom", publicName: "marginBottom", isSignal: true, isRequired: false, transformFunction: null }, marginLeft: { classPropertyName: "marginLeft", publicName: "marginLeft", isSignal: true, isRequired: false, transformFunction: null }, tooltipPosition: { classPropertyName: "tooltipPosition", publicName: "tooltipPosition", isSignal: true, isRequired: false, transformFunction: null }, tooltip: { classPropertyName: "tooltip", publicName: "tooltip", isSignal: false, isRequired: false, transformFunction: null } }, outputs: { onClick: "onClick" }, ngImport: i0, template: "<div [ngClass]=\"{ 'coer-button': true }\">\r\n <a [id]=\"_id + '-container'\"\r\n [routerLink]=\"(path().length > 0 && _isEnable()) ? path() : null\"\r\n [ngClass]=\"{ 'loading': isLoading(), 'animate__animated animate__zoomIn': true, 'animate__disabled': !animation(), 'invisible': isInvisible() || isReadonly() }\"\r\n [ngStyle]=\"{ 'margin-top': marginTop(), 'margin-right': marginRight(), 'margin-bottom': marginBottom(), 'margin-left': marginLeft() }\">\r\n \r\n @if(type() =='filled' || type() == 'outline') {\r\n <button mat-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary' && type() =='filled'),\r\n 'secondary-filled' : (color() == 'secondary' && type() =='filled'),\r\n 'success-filled' : (color() == 'success' && type() =='filled'),\r\n 'warning-filled' : (color() == 'warning' && type() =='filled'),\r\n 'danger-filled' : (color() == 'danger' && type() =='filled'),\r\n 'navigation-filled' : (color() == 'navigation' && type() =='filled'),\r\n 'information-filled' : (color() == 'information' && type() =='filled'),\r\n 'dark-filled' : (color() == 'dark' && type() =='filled'),\r\n 'light-filled' : (color() == 'light' && type() =='filled'),\r\n 'primary-outline' : (color() == 'primary' && type() =='outline'),\r\n 'secondary-outline' : (color() == 'secondary' && type() =='outline'),\r\n 'success-outline' : (color() == 'success' && type() =='outline'),\r\n 'warning-outline' : (color() == 'warning' && type() =='outline'),\r\n 'danger-outline' : (color() == 'danger' && type() =='outline'),\r\n 'navigation-outline' : (color() == 'navigation' && type() =='outline'),\r\n 'information-outline': (color() == 'information' && type() =='outline'),\r\n 'dark-outline' : (color() == 'dark' && type() =='outline'),\r\n 'light-outline' : (color() == 'light' && type() =='outline'),\r\n 'readonly': isDisabled(),\r\n 'cursor-wait': isLoading()\r\n }\"\r\n [ngStyle]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'height' : height(),\r\n 'min-height': minHeight()\r\n }\">\r\n <span class=\"slot\" *ngIf=\"!isLoading(); else loading\" >\r\n @if(iconPosition() == 'left') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span>\r\n }\r\n\r\n <span [ngClass]=\"{ \r\n 'ms-2': (iconPosition() == 'left' && icon().length > 0), \r\n 'me-2': (iconPosition() == 'right' && icon().length > 0) \r\n }\">\r\n <ng-content></ng-content>\r\n </span>\r\n\r\n @if(iconPosition() == 'right') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span> \r\n }\r\n </span>\r\n\r\n <ng-template #loading>\r\n <span class=\"slot fa-fade\">\r\n <span class=\"me-2\"> Loading </span>\r\n <i class=\"spinner-border\"></i>\r\n </span>\r\n </ng-template>\r\n </button>\r\n }\r\n\r\n @else {\r\n @if (type() == 'icon') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary'),\r\n 'secondary-filled' : (color() == 'secondary'),\r\n 'success-filled' : (color() == 'success'),\r\n 'warning-filled' : (color() == 'warning'),\r\n 'danger-filled' : (color() == 'danger'),\r\n 'navigation-filled' : (color() == 'navigation'),\r\n 'information-filled': (color() == 'information'),\r\n 'dark-filled' : (color() == 'dark'),\r\n 'light-filled' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-outline') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'light-outline' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-no-border') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'light-outline' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'icon-no-border' : true\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n }\r\n </a>\r\n</div>", styles: ["coer-button{display:contents!important}div.coer-button{display:contents!important}div.coer-button a{display:inline-block!important;height:fit-content!important;text-decoration:none!important}div.coer-button a.animate__disabled{animation-duration:0s!important}div.coer-button button{font-size:17px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button .slot{width:100px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}div.coer-button button.primary-filled{background-color:var(--primary-inner)!important;color:var(--white)!important}div.coer-button button.primary-outline{background-color:var(--white)!important;color:var(--primary-inner)!important;border:1px solid var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):hover,div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):hover,div.coer-button button.primary-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.secondary-filled{background-color:var(--secondary-inner)!important;color:var(--white)!important}div.coer-button button.secondary-outline{background-color:var(--white)!important;color:var(--secondary-inner)!important;border:1px solid var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):hover,div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):hover,div.coer-button button.secondary-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.success-filled{background-color:var(--success-inner)!important;color:var(--white)!important}div.coer-button button.success-outline{background-color:var(--white)!important;color:var(--success-inner)!important;border:1px solid var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):focus{box-shadow:0 0 20px var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):hover,div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):hover,div.coer-button button.success-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.warning-filled{background-color:var(--warning-inner)!important;color:var(--black)!important}div.coer-button button.warning-outline{background-color:var(--white)!important;color:var(--warning-inner)!important;border:1px solid var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):focus{box-shadow:0 0 20px var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):hover,div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):hover,div.coer-button button.warning-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.danger-filled{background-color:var(--danger-inner)!important;color:var(--white)!important}div.coer-button button.danger-outline{background-color:var(--white)!important;color:var(--danger-inner)!important;border:1px solid var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):focus{box-shadow:0 0 20px var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):hover,div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):hover,div.coer-button button.danger-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.navigation-filled{background-color:var(--navigation-inner)!important;color:var(--white)!important}div.coer-button button.navigation-outline{background-color:var(--white)!important;color:var(--navigation-inner)!important;border:1px solid var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):focus{box-shadow:0 0 20px var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):hover,div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):hover,div.coer-button button.navigation-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.information-filled{background-color:var(--information-inner)!important;color:var(--white)!important}div.coer-button button.information-outline{background-color:var(--white)!important;color:var(--information-inner)!important;border:1px solid var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):focus{box-shadow:0 0 20px var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):hover,div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):hover,div.coer-button button.information-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.dark-filled{background-color:var(--black)!important;color:var(--white)!important}div.coer-button button.dark-outline{background-color:var(--white)!important;color:var(--black)!important;border:1px solid var(--black)!important}div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):focus{box-shadow:0 0 20px var(--black)!important}div.coer-button button.dark-filled:not(.readonly):hover,div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):hover,div.coer-button button.dark-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.light-filled{background-color:var(--white)!important;color:var(--black)!important}div.coer-button button.light-outline{background-color:transparent!important;color:var(--white)!important;border:1px solid var(--white)!important}div.coer-button button.light-filled:not(.readonly):focus,div.coer-button button.light-outline:not(.readonly):focus{box-shadow:0 0 20px var(--white)!important}div.coer-button button.light-filled:not(.readonly):hover,div.coer-button button.light-filled:not(.readonly):focus,div.coer-button button.light-outline:not(.readonly):hover,div.coer-button button.light-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button{width:40px!important;height:40px!important;padding:0!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border{width:25px!important;height:25px!important;background-color:transparent!important;border:none!important;overflow:visible!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border *{font-size:medium!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-left,div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-in-right{font-size:20px!important}div.coer-button button.readonly,div.coer-button button.readonly:hover,div.coer-button button.readonly:focus{background-color:#dfdede!important;border-color:#dfdede!important;color:var(--white)!important}div.coer-button coer-button[ishidden=true],div.coer-button coer-button[ng-reflect-invisible=true]{position:relative!important;top:10000vh;left:10000vw}div.coer-button a.loading{cursor:wait!important}div.coer-button i{display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button i.spinner-border{width:15px!important;height:15px!important;font-size:16px!important}div.coer-button span{font-weight:700!important}div.coer-button .mat-mdc-button-touch-target{width:0px!important;height:0px!important}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgStyle, selector: "[ngStyle]", inputs: ["ngStyle"] }, { kind: "directive", type: i2$1.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "component", type: i3.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: i3.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }] }); }
|
246
246
|
}
|
247
247
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.0.1", ngImport: i0, type: CoerButton, decorators: [{
|
248
248
|
type: Component,
|
249
|
-
args: [{ selector: 'coer-button', standalone: false, template: "<div [ngClass]=\"{ 'coer-button': true }\">\r\n <a [id]=\"_id + '-container'\"\r\n [routerLink]=\"(path().length > 0 && _isEnable()) ? path() : null\"\r\n [ngClass]=\"{ 'loading': isLoading(), 'animate__animated animate__zoomIn': true, 'animate__disabled': !animation(), 'invisible': isInvisible() || isReadonly() }\"\r\n [ngStyle]=\"{ 'margin-top': marginTop(), 'margin-right': marginRight(), 'margin-bottom': marginBottom(), 'margin-left': marginLeft() }\">\r\n \r\n @if(type() =='filled' || type() == 'outline') {\r\n <button mat-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary' && type() =='filled'),\r\n 'secondary-filled' : (color() == 'secondary' && type() =='filled'),\r\n 'success-filled' : (color() == 'success' && type() =='filled'),\r\n 'warning-filled' : (color() == 'warning' && type() =='filled'),\r\n 'danger-filled' : (color() == 'danger' && type() =='filled'),\r\n 'navigation-filled' : (color() == 'navigation' && type() =='filled'),\r\n 'information-filled' : (color() == 'information' && type() =='filled'),\r\n 'dark-filled' : (color() == 'dark' && type() =='filled'),\r\n 'primary-outline' : (color() == 'primary' && type() =='outline'),\r\n 'secondary-outline' : (color() == 'secondary' && type() =='outline'),\r\n 'success-outline' : (color() == 'success' && type() =='outline'),\r\n 'warning-outline' : (color() == 'warning' && type() =='outline'),\r\n 'danger-outline' : (color() == 'danger' && type() =='outline'),\r\n 'navigation-outline' : (color() == 'navigation' && type() =='outline'),\r\n 'information-outline': (color() == 'information' && type() =='outline'),\r\n 'dark-outline' : (color() == 'dark' && type() =='outline'),\r\n 'readonly': isDisabled(),\r\n 'cursor-wait': isLoading()\r\n }\"\r\n [ngStyle]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'height' : height(),\r\n 'min-height': minHeight()\r\n }\">\r\n <span class=\"slot\" *ngIf=\"!isLoading(); else loading\" >\r\n @if(iconPosition() == 'left') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span>\r\n }\r\n\r\n <span [ngClass]=\"{ \r\n 'ms-2': (iconPosition() == 'left' && icon().length > 0), \r\n 'me-2': (iconPosition() == 'right' && icon().length > 0) \r\n }\">\r\n <ng-content></ng-content>\r\n </span>\r\n\r\n @if(iconPosition() == 'right') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span> \r\n }\r\n </span>\r\n\r\n <ng-template #loading>\r\n <span class=\"slot fa-fade\">\r\n <span class=\"me-2\"> Loading </span>\r\n <i class=\"spinner-border\"></i>\r\n </span>\r\n </ng-template>\r\n </button>\r\n }\r\n\r\n @else {\r\n @if (type() == 'icon') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary'),\r\n 'secondary-filled' : (color() == 'secondary'),\r\n 'success-filled' : (color() == 'success'),\r\n 'warning-filled' : (color() == 'warning'),\r\n 'danger-filled' : (color() == 'danger'),\r\n 'navigation-filled' : (color() == 'navigation'),\r\n 'information-filled': (color() == 'information'),\r\n 'dark-filled' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-outline') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-no-border') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'icon-no-border' : true\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n }\r\n </a>\r\n</div>", styles: [":root{--blue: #0d6efd;--gray: #6c757d;--green: #198754;--yellow:#ffc107;--red: #dc3545;--smoke: #f5f5f5;--black: #252525;--orange:#fd6031;--white: #ffffff;--purple:#a615bc;--primary-inner: var(--primary, var(--orange));--secondary-inner: var(--secondary, var(--gray));--success-inner: var(--success, var(--green));--warning-inner: var(--warning, var(--yellow));--danger-inner: var(--danger, var(--red));--navigation-inner: var(--navigation, var(--orange));--information-inner: var(--information, var(--blue));--breadcrumbs-inner: var(--app-breadcrumbs, var(--blue));--background-inner: var(--app-background, var(--smoke));--containers-inner: var(--app-containers, var(--white));--sidenav-inner: var(--app-sidenav, var(--black));--sidenav-text-inner: var(--app-sidenav-text, var(--smoke));--sidenav-active-inner: var(--app-sidenav-active, var(--orange));--toolbar-inner: var(--app-toolbar, var(--smoke));--toolbar-text-inner: var(--app-toolbar-text, var(--black))}.text-transparent{color:transparent!important}.text-transparent-bold{color:transparent!important;font-weight:700!important}.border-transparent{border-color:transparent!important}.border-top-transparent{border-top-color:transparent!important}.border-right-transparent{border-right-color:transparent!important}.border-bottom-transparent{border-bottom-color:transparent!important}.border-left-transparent{border-left-color:transparent!important}.background-transparent{background-color:transparent!important}.background-border-transparent{background-color:transparent!important;border-color:transparent!important}.text-blue{color:var(--blue)!important}.text-blue-bold{color:var(--blue)!important;font-weight:700!important}.border-blue{border-color:var(--blue)!important}.border-top-blue{border-top-color:var(--blue)!important}.border-right-blue{border-right-color:var(--blue)!important}.border-bottom-blue{border-bottom-color:var(--blue)!important}.border-left-blue{border-left-color:var(--blue)!important}.background-blue{background-color:var(--blue)!important}.background-border-blue{background-color:var(--blue)!important;border-color:var(--blue)!important}.text-gray{color:var(--gray)!important}.text-gray-bold{color:var(--gray)!important;font-weight:700!important}.border-gray{border-color:var(--gray)!important}.border-top-gray{border-top-color:var(--gray)!important}.border-right-gray{border-right-color:var(--gray)!important}.border-bottom-gray{border-bottom-color:var(--gray)!important}.border-left-gray{border-left-color:var(--gray)!important}.background-gray{background-color:var(--gray)!important}.background-border-gray{background-color:var(--gray)!important;border-color:var(--gray)!important}.text-green{color:var(--green)!important}.text-green-bold{color:var(--green)!important;font-weight:700!important}.border-green{border-color:var(--green)!important}.border-top-green{border-top-color:var(--green)!important}.border-right-green{border-right-color:var(--green)!important}.border-bottom-green{border-bottom-color:var(--green)!important}.border-left-green{border-left-color:var(--green)!important}.background-green{background-color:var(--green)!important}.background-border-green{background-color:var(--green)!important;border-color:var(--green)!important}.text-yellow{color:var(--yellow)!important}.text-yellow-bold{color:var(--yellow)!important;font-weight:700!important}.border-yellow{border-color:var(--yellow)!important}.border-top-yellow{border-top-color:var(--yellow)!important}.border-right-yellow{border-right-color:var(--yellow)!important}.border-bottom-yellow{border-bottom-color:var(--yellow)!important}.border-left-yellow{border-left-color:var(--yellow)!important}.background-yellow{background-color:var(--yellow)!important}.background-border-yellow{background-color:var(--yellow)!important;border-color:var(--yellow)!important}.text-red{color:var(--red)!important}.text-red-bold{color:var(--red)!important;font-weight:700!important}.border-red{border-color:var(--red)!important}.border-top-red{border-top-color:var(--red)!important}.border-right-red{border-right-color:var(--red)!important}.border-bottom-red{border-bottom-color:var(--red)!important}.border-left-red{border-left-color:var(--red)!important}.background-red{background-color:var(--red)!important}.background-border-red{background-color:var(--red)!important;border-color:var(--red)!important}.text-smoke{color:var(--smoke)!important}.text-smoke-bold{color:var(--smoke)!important;font-weight:700!important}.border-smoke{border-color:var(--smoke)!important}.border-top-smoke{border-top-color:var(--smoke)!important}.border-right-smoke{border-right-color:var(--smoke)!important}.border-bottom-smoke{border-bottom-color:var(--smoke)!important}.border-left-smoke{border-left-color:var(--smoke)!important}.background-smoke{background-color:var(--smoke)!important}.background-border-smoke{background-color:var(--smoke)!important;border-color:var(--smoke)!important}.text-black{color:var(--black)!important}.text-black-bold{color:var(--black)!important;font-weight:700!important}.border-black{border-color:var(--black)!important}.border-top-black{border-top-color:var(--black)!important}.border-right-black{border-right-color:var(--black)!important}.border-bottom-black{border-bottom-color:var(--black)!important}.border-left-black{border-left-color:var(--black)!important}.background-black{background-color:var(--black)!important}.background-border-black{background-color:var(--black)!important;border-color:var(--black)!important}.text-orange{color:var(--orange)!important}.text-orange-bold{color:var(--orange)!important;font-weight:700!important}.border-orange{border-color:var(--orange)!important}.border-top-orange{border-top-color:var(--orange)!important}.border-right-orange{border-right-color:var(--orange)!important}.border-bottom-orange{border-bottom-color:var(--orange)!important}.border-left-orange{border-left-color:var(--orange)!important}.background-orange{background-color:var(--orange)!important}.background-border-orange{background-color:var(--orange)!important;border-color:var(--orange)!important}.text-white{color:var(--white)!important}.text-white-bold{color:var(--white)!important;font-weight:700!important}.border-white{border-color:var(--white)!important}.border-top-white{border-top-color:var(--white)!important}.border-right-white{border-right-color:var(--white)!important}.border-bottom-white{border-bottom-color:var(--white)!important}.border-left-white{border-left-color:var(--white)!important}.background-white{background-color:var(--white)!important}.background-border-white{background-color:var(--white)!important;border-color:var(--white)!important}.text-purple{color:var(--purple)!important}.text-purple-bold{color:var(--purple)!important;font-weight:700!important}.border-purple{border-color:var(--purple)!important}.border-top-purple{border-top-color:var(--purple)!important}.border-right-purple{border-right-color:var(--purple)!important}.border-bottom-purple{border-bottom-color:var(--purple)!important}.border-left-purple{border-left-color:var(--purple)!important}.background-purple{background-color:var(--purple)!important}.background-border-purple{background-color:var(--purple)!important;border-color:var(--purple)!important}.text-primary{color:var(--primary-inner)!important}.text-primary-bold{color:var(--primary-inner)!important;font-weight:700!important}.border-primary{border-color:var(--primary-inner)!important}.border-top-primary{border-top-color:var(--primary-inner)!important}.border-right-primary{border-right-color:var(--primary-inner)!important}.border-bottom-primary{border-bottom-color:var(--primary-inner)!important}.border-left-primary{border-left-color:var(--primary-inner)!important}.background-primary{background-color:var(--primary-inner)!important}.background-border-primary{background-color:var(--primary-inner)!important;border-color:var(--primary-inner)!important}.text-secondary{color:var(--secondary-inner)!important}.text-secondary-bold{color:var(--secondary-inner)!important;font-weight:700!important}.border-secondary{border-color:var(--secondary-inner)!important}.border-top-secondary{border-top-color:var(--secondary-inner)!important}.border-right-secondary{border-right-color:var(--secondary-inner)!important}.border-bottom-secondary{border-bottom-color:var(--secondary-inner)!important}.border-left-secondary{border-left-color:var(--secondary-inner)!important}.background-secondary{background-color:var(--secondary-inner)!important}.background-border-secondary{background-color:var(--secondary-inner)!important;border-color:var(--secondary-inner)!important}.text-success{color:var(--success-inner)!important}.text-success-bold{color:var(--success-inner)!important;font-weight:700!important}.border-success{border-color:var(--success-inner)!important}.border-top-success{border-top-color:var(--success-inner)!important}.border-right-success{border-right-color:var(--success-inner)!important}.border-bottom-success{border-bottom-color:var(--success-inner)!important}.border-left-success{border-left-color:var(--success-inner)!important}.background-success{background-color:var(--success-inner)!important}.background-border-success{background-color:var(--success-inner)!important;border-color:var(--success-inner)!important}.text-warning{color:var(--warning-inner)!important}.text-warning-bold{color:var(--warning-inner)!important;font-weight:700!important}.border-warning{border-color:var(--warning-inner)!important}.border-top-warning{border-top-color:var(--warning-inner)!important}.border-right-warning{border-right-color:var(--warning-inner)!important}.border-bottom-warning{border-bottom-color:var(--warning-inner)!important}.border-left-warning{border-left-color:var(--warning-inner)!important}.background-warning{background-color:var(--warning-inner)!important}.background-border-warning{background-color:var(--warning-inner)!important;border-color:var(--warning-inner)!important}.text-danger{color:var(--danger-inner)!important}.text-danger-bold{color:var(--danger-inner)!important;font-weight:700!important}.border-danger{border-color:var(--danger-inner)!important}.border-top-danger{border-top-color:var(--danger-inner)!important}.border-right-danger{border-right-color:var(--danger-inner)!important}.border-bottom-danger{border-bottom-color:var(--danger-inner)!important}.border-left-danger{border-left-color:var(--danger-inner)!important}.background-danger{background-color:var(--danger-inner)!important}.background-border-danger{background-color:var(--danger-inner)!important;border-color:var(--danger-inner)!important}.text-navigation{color:var(--navigation-inner)!important}.text-navigation-bold{color:var(--navigation-inner)!important;font-weight:700!important}.border-navigation{border-color:var(--navigation-inner)!important}.border-top-navigation{border-top-color:var(--navigation-inner)!important}.border-right-navigation{border-right-color:var(--navigation-inner)!important}.border-bottom-navigation{border-bottom-color:var(--navigation-inner)!important}.border-left-navigation{border-left-color:var(--navigation-inner)!important}.background-navigation{background-color:var(--navigation-inner)!important}.background-border-navigation{background-color:var(--navigation-inner)!important;border-color:var(--navigation-inner)!important}.text-information{color:var(--information-inner)!important}.text-information-bold{color:var(--information-inner)!important;font-weight:700!important}.border-information{border-color:var(--information-inner)!important}.border-top-information{border-top-color:var(--information-inner)!important}.border-right-information{border-right-color:var(--information-inner)!important}.border-bottom-information{border-bottom-color:var(--information-inner)!important}.border-left-information{border-left-color:var(--information-inner)!important}.background-information{background-color:var(--information-inner)!important}.background-border-information{background-color:var(--information-inner)!important;border-color:var(--information-inner)!important}.text-breadcrumbs{color:var(--breadcrumbs-inner)!important}.text-breadcrumbs-bold{color:var(--breadcrumbs-inner)!important;font-weight:700!important}.border-breadcrumbs{border-color:var(--breadcrumbs-inner)!important}.border-top-breadcrumbs{border-top-color:var(--breadcrumbs-inner)!important}.border-right-breadcrumbs{border-right-color:var(--breadcrumbs-inner)!important}.border-bottom-breadcrumbs{border-bottom-color:var(--breadcrumbs-inner)!important}.border-left-breadcrumbs{border-left-color:var(--breadcrumbs-inner)!important}.background-breadcrumbs{background-color:var(--breadcrumbs-inner)!important}.background-border-breadcrumbs{background-color:var(--breadcrumbs-inner)!important;border-color:var(--breadcrumbs-inner)!important}.text-app-background{color:var(--background-inner)!important}.text-app-background-bold{color:var(--background-inner)!important;font-weight:700!important}.border-app-background{border-color:var(--background-inner)!important}.border-top-app-background{border-top-color:var(--background-inner)!important}.border-right-app-background{border-right-color:var(--background-inner)!important}.border-bottom-app-background{border-bottom-color:var(--background-inner)!important}.border-left-app-background{border-left-color:var(--background-inner)!important}.background-app-background{background-color:var(--background-inner)!important}.background-border-app-background{background-color:var(--background-inner)!important;border-color:var(--background-inner)!important}.text-app-container{color:var(--containers-inner)!important}.text-app-container-bold{color:var(--containers-inner)!important;font-weight:700!important}.border-app-container{border-color:var(--containers-inner)!important}.border-top-app-container{border-top-color:var(--containers-inner)!important}.border-right-app-container{border-right-color:var(--containers-inner)!important}.border-bottom-app-container{border-bottom-color:var(--containers-inner)!important}.border-left-app-container{border-left-color:var(--containers-inner)!important}.background-app-container{background-color:var(--containers-inner)!important}.background-border-app-container{background-color:var(--containers-inner)!important;border-color:var(--containers-inner)!important}.text-app-sidenav{color:var(--sidenav-inner)!important}.text-app-sidenav-bold{color:var(--sidenav-inner)!important;font-weight:700!important}.border-app-sidenav{border-color:var(--sidenav-inner)!important}.border-top-app-sidenav{border-top-color:var(--sidenav-inner)!important}.border-right-app-sidenav{border-right-color:var(--sidenav-inner)!important}.border-bottom-app-sidenav{border-bottom-color:var(--sidenav-inner)!important}.border-left-app-sidenav{border-left-color:var(--sidenav-inner)!important}.background-app-sidenav{background-color:var(--sidenav-inner)!important}.background-border-app-sidenav{background-color:var(--sidenav-inner)!important;border-color:var(--sidenav-inner)!important}.text-app-sidenav-text{color:var(--sidenav-text-inner)!important}.text-app-sidenav-text-bold{color:var(--sidenav-text-inner)!important;font-weight:700!important}.border-app-sidenav-text{border-color:var(--sidenav-text-inner)!important}.border-top-app-sidenav-text{border-top-color:var(--sidenav-text-inner)!important}.border-right-app-sidenav-text{border-right-color:var(--sidenav-text-inner)!important}.border-bottom-app-sidenav-text{border-bottom-color:var(--sidenav-text-inner)!important}.border-left-app-sidenav-text{border-left-color:var(--sidenav-text-inner)!important}.background-app-sidenav-text{background-color:var(--sidenav-text-inner)!important}.background-border-app-sidenav-text{background-color:var(--sidenav-text-inner)!important;border-color:var(--sidenav-text-inner)!important}.text-app-sidenav-active{color:var(--sidenav-active-inner)!important}.text-app-sidenav-active-bold{color:var(--sidenav-active-inner)!important;font-weight:700!important}.border-app-sidenav-active{border-color:var(--sidenav-active-inner)!important}.border-top-app-sidenav-active{border-top-color:var(--sidenav-active-inner)!important}.border-right-app-sidenav-active{border-right-color:var(--sidenav-active-inner)!important}.border-bottom-app-sidenav-active{border-bottom-color:var(--sidenav-active-inner)!important}.border-left-app-sidenav-active{border-left-color:var(--sidenav-active-inner)!important}.background-app-sidenav-active{background-color:var(--sidenav-active-inner)!important}.background-border-app-sidenav-active{background-color:var(--sidenav-active-inner)!important;border-color:var(--sidenav-active-inner)!important}.text-app-toolbar{color:var(--toolbar-inner)!important}.text-app-toolbar-bold{color:var(--toolbar-inner)!important;font-weight:700!important}.border-app-toolbar{border-color:var(--toolbar-inner)!important}.border-top-app-toolbar{border-top-color:var(--toolbar-inner)!important}.border-right-app-toolbar{border-right-color:var(--toolbar-inner)!important}.border-bottom-app-toolbar{border-bottom-color:var(--toolbar-inner)!important}.border-left-app-toolbar{border-left-color:var(--toolbar-inner)!important}.background-app-toolbar{background-color:var(--toolbar-inner)!important}.background-border-app-toolbar{background-color:var(--toolbar-inner)!important;border-color:var(--toolbar-inner)!important}.text-app-toolbar-text{color:var(--toolbar-text-inner)!important}.text-app-toolbar-text-bold{color:var(--toolbar-text-inner)!important;font-weight:700!important}.border-app-toolbar-text{border-color:var(--toolbar-text-inner)!important}.border-top-app-toolbar-text{border-top-color:var(--toolbar-text-inner)!important}.border-right-app-toolbar-text{border-right-color:var(--toolbar-text-inner)!important}.border-bottom-app-toolbar-text{border-bottom-color:var(--toolbar-text-inner)!important}.border-left-app-toolbar-text{border-left-color:var(--toolbar-text-inner)!important}.background-app-toolbar-text{background-color:var(--toolbar-text-inner)!important}.background-border-app-toolbar-text{background-color:var(--toolbar-text-inner)!important;border-color:var(--toolbar-text-inner)!important}coer-button{display:contents!important}div.coer-button{display:contents!important}div.coer-button a{display:inline-block!important;height:fit-content!important;text-decoration:none!important}div.coer-button a.animate__disabled{animation-duration:0s!important}div.coer-button button{font-size:17px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button .slot{width:100px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}div.coer-button button.primary-filled{background-color:var(--primary-inner)!important;color:var(--white)!important}div.coer-button button.primary-outline{background-color:var(--white)!important;border:1px solid var(--primary-inner)!important;color:var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--primary-inner)!important}div.coer-button button.secondary-filled{background-color:var(--secondary-inner)!important;color:var(--white)!important}div.coer-button button.secondary-outline{background-color:var(--white)!important;border:1px solid var(--secondary-inner)!important;color:var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--secondary-inner)!important}div.coer-button button.success-filled{background-color:var(--success-inner)!important;color:var(--white)!important}div.coer-button button.success-outline{background-color:var(--white)!important;border:1px solid var(--success-inner)!important;color:var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):focus{box-shadow:0 0 20px var(--success-inner)!important}div.coer-button button.warning-filled{background-color:var(--warning-inner)!important;color:var(--black)!important}div.coer-button button.warning-outline{background-color:var(--white)!important;border:1px solid var(--warning-inner)!important;color:var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):focus{box-shadow:0 0 20px var(--warning-inner)!important}div.coer-button button.danger-filled{background-color:var(--danger-inner)!important;color:var(--white)!important}div.coer-button button.danger-outline{background-color:var(--white)!important;border:1px solid var(--danger-inner)!important;color:var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):focus{box-shadow:0 0 20px var(--danger-inner)!important}div.coer-button button.navigation-filled{background-color:var(--navigation-inner)!important;color:var(--white)!important}div.coer-button button.navigation-outline{background-color:var(--white)!important;border:1px solid var(--navigation-inner)!important;color:var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):focus{box-shadow:0 0 20px var(--navigation-inner)!important}div.coer-button button.information-filled{background-color:var(--information-inner)!important;color:var(--white)!important}div.coer-button button.information-outline{background-color:var(--white)!important;border:1px solid var(--information-inner)!important;color:var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):focus{box-shadow:0 0 20px var(--information-inner)!important}div.coer-button button.dark-filled{background-color:var(--black)!important;color:var(--white)!important}div.coer-button button.dark-outline{background-color:var(--white)!important;border:1px solid var(--black)!important;color:var(--black)!important}div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):focus{box-shadow:0 0 20px var(--black)!important}div.coer-button button.primary-filled:not(.readonly):hover,div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):hover,div.coer-button button.primary-outline:not(.readonly):focus,div.coer-button button.secondary-filled:not(.readonly):hover,div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):hover,div.coer-button button.secondary-outline:not(.readonly):focus,div.coer-button button.success-filled:not(.readonly):hover,div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):hover,div.coer-button button.success-outline:not(.readonly):focus,div.coer-button button.warning-filled:not(.readonly):hover,div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):hover,div.coer-button button.warning-outline:not(.readonly):focus,div.coer-button button.danger-filled:not(.readonly):hover,div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):hover,div.coer-button button.danger-outline:not(.readonly):focus,div.coer-button button.navigation-filled:not(.readonly):hover,div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):hover,div.coer-button button.navigation-outline:not(.readonly):focus,div.coer-button button.dark-filled:not(.readonly):hover,div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):hover,div.coer-button button.dark-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button{width:40px!important;height:40px!important;padding:0!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border{width:25px!important;height:25px!important;background-color:transparent!important;border:none!important;overflow:visible!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border *{font-size:medium!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-left,div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-in-right{font-size:20px!important}div.coer-button button.readonly,div.coer-button button.readonly:hover,div.coer-button button.readonly:focus{background-color:#dfdede!important;border-color:#dfdede!important;color:var(--white)!important}div.coer-button coer-button[ishidden=true],div.coer-button coer-button[ng-reflect-invisible=true]{position:relative!important;top:10000vh;left:10000vw}div.coer-button a.loading{cursor:wait!important}div.coer-button i{display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button i.spinner-border{width:15px!important;height:15px!important;font-size:16px!important}div.coer-button span{font-weight:700!important}div.coer-button .mat-mdc-button-touch-target{width:0px!important;height:0px!important}\n"] }]
|
249
|
+
args: [{ selector: 'coer-button', standalone: false, template: "<div [ngClass]=\"{ 'coer-button': true }\">\r\n <a [id]=\"_id + '-container'\"\r\n [routerLink]=\"(path().length > 0 && _isEnable()) ? path() : null\"\r\n [ngClass]=\"{ 'loading': isLoading(), 'animate__animated animate__zoomIn': true, 'animate__disabled': !animation(), 'invisible': isInvisible() || isReadonly() }\"\r\n [ngStyle]=\"{ 'margin-top': marginTop(), 'margin-right': marginRight(), 'margin-bottom': marginBottom(), 'margin-left': marginLeft() }\">\r\n \r\n @if(type() =='filled' || type() == 'outline') {\r\n <button mat-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary' && type() =='filled'),\r\n 'secondary-filled' : (color() == 'secondary' && type() =='filled'),\r\n 'success-filled' : (color() == 'success' && type() =='filled'),\r\n 'warning-filled' : (color() == 'warning' && type() =='filled'),\r\n 'danger-filled' : (color() == 'danger' && type() =='filled'),\r\n 'navigation-filled' : (color() == 'navigation' && type() =='filled'),\r\n 'information-filled' : (color() == 'information' && type() =='filled'),\r\n 'dark-filled' : (color() == 'dark' && type() =='filled'),\r\n 'light-filled' : (color() == 'light' && type() =='filled'),\r\n 'primary-outline' : (color() == 'primary' && type() =='outline'),\r\n 'secondary-outline' : (color() == 'secondary' && type() =='outline'),\r\n 'success-outline' : (color() == 'success' && type() =='outline'),\r\n 'warning-outline' : (color() == 'warning' && type() =='outline'),\r\n 'danger-outline' : (color() == 'danger' && type() =='outline'),\r\n 'navigation-outline' : (color() == 'navigation' && type() =='outline'),\r\n 'information-outline': (color() == 'information' && type() =='outline'),\r\n 'dark-outline' : (color() == 'dark' && type() =='outline'),\r\n 'light-outline' : (color() == 'light' && type() =='outline'),\r\n 'readonly': isDisabled(),\r\n 'cursor-wait': isLoading()\r\n }\"\r\n [ngStyle]=\"{\r\n 'width' : width(),\r\n 'min-width' : minWidth(),\r\n 'max-width' : maxWidth(),\r\n 'height' : height(),\r\n 'min-height': minHeight()\r\n }\">\r\n <span class=\"slot\" *ngIf=\"!isLoading(); else loading\" >\r\n @if(iconPosition() == 'left') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span>\r\n }\r\n\r\n <span [ngClass]=\"{ \r\n 'ms-2': (iconPosition() == 'left' && icon().length > 0), \r\n 'me-2': (iconPosition() == 'right' && icon().length > 0) \r\n }\">\r\n <ng-content></ng-content>\r\n </span>\r\n\r\n @if(iconPosition() == 'right') {\r\n <span>\r\n <i [class]=\"_icon()\"></i>\r\n </span> \r\n }\r\n </span>\r\n\r\n <ng-template #loading>\r\n <span class=\"slot fa-fade\">\r\n <span class=\"me-2\"> Loading </span>\r\n <i class=\"spinner-border\"></i>\r\n </span>\r\n </ng-template>\r\n </button>\r\n }\r\n\r\n @else {\r\n @if (type() == 'icon') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-filled' : (color() == 'primary'),\r\n 'secondary-filled' : (color() == 'secondary'),\r\n 'success-filled' : (color() == 'success'),\r\n 'warning-filled' : (color() == 'warning'),\r\n 'danger-filled' : (color() == 'danger'),\r\n 'navigation-filled' : (color() == 'navigation'),\r\n 'information-filled': (color() == 'information'),\r\n 'dark-filled' : (color() == 'dark'),\r\n 'light-filled' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-outline') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'light-outline' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'cursor-wait' : isLoading()\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n\r\n @else if (type() == 'icon-no-border') {\r\n <button mat-icon-button\r\n [id]=\"_id + '-inner-button'\"\r\n type=\"button\"\r\n (click)=\"_Click()\"\r\n [ngClass]=\"{\r\n 'primary-outline' : (color() == 'primary'),\r\n 'secondary-outline' : (color() == 'secondary'),\r\n 'success-outline' : (color() == 'success'),\r\n 'warning-outline' : (color() == 'warning'),\r\n 'danger-outline' : (color() == 'danger'),\r\n 'navigation-outline' : (color() == 'navigation'),\r\n 'information-outline': (color() == 'information'),\r\n 'dark-outline' : (color() == 'dark'),\r\n 'light-outline' : (color() == 'light'),\r\n 'readonly' : (isDisabled() || isLoading()),\r\n 'icon-no-border' : true\r\n }\">\r\n <i [class]=\"_icon()\"></i>\r\n </button>\r\n }\r\n }\r\n </a>\r\n</div>", styles: ["coer-button{display:contents!important}div.coer-button{display:contents!important}div.coer-button a{display:inline-block!important;height:fit-content!important;text-decoration:none!important}div.coer-button a.animate__disabled{animation-duration:0s!important}div.coer-button button{font-size:17px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button .slot{width:100px!important;display:flex!important;align-items:center!important;justify-content:center!important;overflow:visible!important}div.coer-button button.primary-filled{background-color:var(--primary-inner)!important;color:var(--white)!important}div.coer-button button.primary-outline{background-color:var(--white)!important;color:var(--primary-inner)!important;border:1px solid var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--primary-inner)!important}div.coer-button button.primary-filled:not(.readonly):hover,div.coer-button button.primary-filled:not(.readonly):focus,div.coer-button button.primary-outline:not(.readonly):hover,div.coer-button button.primary-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.secondary-filled{background-color:var(--secondary-inner)!important;color:var(--white)!important}div.coer-button button.secondary-outline{background-color:var(--white)!important;color:var(--secondary-inner)!important;border:1px solid var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):focus{box-shadow:0 0 20px var(--secondary-inner)!important}div.coer-button button.secondary-filled:not(.readonly):hover,div.coer-button button.secondary-filled:not(.readonly):focus,div.coer-button button.secondary-outline:not(.readonly):hover,div.coer-button button.secondary-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.success-filled{background-color:var(--success-inner)!important;color:var(--white)!important}div.coer-button button.success-outline{background-color:var(--white)!important;color:var(--success-inner)!important;border:1px solid var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):focus{box-shadow:0 0 20px var(--success-inner)!important}div.coer-button button.success-filled:not(.readonly):hover,div.coer-button button.success-filled:not(.readonly):focus,div.coer-button button.success-outline:not(.readonly):hover,div.coer-button button.success-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.warning-filled{background-color:var(--warning-inner)!important;color:var(--black)!important}div.coer-button button.warning-outline{background-color:var(--white)!important;color:var(--warning-inner)!important;border:1px solid var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):focus{box-shadow:0 0 20px var(--warning-inner)!important}div.coer-button button.warning-filled:not(.readonly):hover,div.coer-button button.warning-filled:not(.readonly):focus,div.coer-button button.warning-outline:not(.readonly):hover,div.coer-button button.warning-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.danger-filled{background-color:var(--danger-inner)!important;color:var(--white)!important}div.coer-button button.danger-outline{background-color:var(--white)!important;color:var(--danger-inner)!important;border:1px solid var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):focus{box-shadow:0 0 20px var(--danger-inner)!important}div.coer-button button.danger-filled:not(.readonly):hover,div.coer-button button.danger-filled:not(.readonly):focus,div.coer-button button.danger-outline:not(.readonly):hover,div.coer-button button.danger-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.navigation-filled{background-color:var(--navigation-inner)!important;color:var(--white)!important}div.coer-button button.navigation-outline{background-color:var(--white)!important;color:var(--navigation-inner)!important;border:1px solid var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):focus{box-shadow:0 0 20px var(--navigation-inner)!important}div.coer-button button.navigation-filled:not(.readonly):hover,div.coer-button button.navigation-filled:not(.readonly):focus,div.coer-button button.navigation-outline:not(.readonly):hover,div.coer-button button.navigation-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.information-filled{background-color:var(--information-inner)!important;color:var(--white)!important}div.coer-button button.information-outline{background-color:var(--white)!important;color:var(--information-inner)!important;border:1px solid var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):focus{box-shadow:0 0 20px var(--information-inner)!important}div.coer-button button.information-filled:not(.readonly):hover,div.coer-button button.information-filled:not(.readonly):focus,div.coer-button button.information-outline:not(.readonly):hover,div.coer-button button.information-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.dark-filled{background-color:var(--black)!important;color:var(--white)!important}div.coer-button button.dark-outline{background-color:var(--white)!important;color:var(--black)!important;border:1px solid var(--black)!important}div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):focus{box-shadow:0 0 20px var(--black)!important}div.coer-button button.dark-filled:not(.readonly):hover,div.coer-button button.dark-filled:not(.readonly):focus,div.coer-button button.dark-outline:not(.readonly):hover,div.coer-button button.dark-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.light-filled{background-color:var(--white)!important;color:var(--black)!important}div.coer-button button.light-outline{background-color:transparent!important;color:var(--white)!important;border:1px solid var(--white)!important}div.coer-button button.light-filled:not(.readonly):focus,div.coer-button button.light-outline:not(.readonly):focus{box-shadow:0 0 20px var(--white)!important}div.coer-button button.light-filled:not(.readonly):hover,div.coer-button button.light-filled:not(.readonly):focus,div.coer-button button.light-outline:not(.readonly):hover,div.coer-button button.light-outline:not(.readonly):focus{filter:brightness(1.1)!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button{width:40px!important;height:40px!important;padding:0!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border{width:25px!important;height:25px!important;background-color:transparent!important;border:none!important;overflow:visible!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border *{font-size:medium!important}div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-left,div.coer-button button.mdc-icon-button.mat-mdc-icon-button.icon-no-border i.bi-box-arrow-in-right{font-size:20px!important}div.coer-button button.readonly,div.coer-button button.readonly:hover,div.coer-button button.readonly:focus{background-color:#dfdede!important;border-color:#dfdede!important;color:var(--white)!important}div.coer-button coer-button[ishidden=true],div.coer-button coer-button[ng-reflect-invisible=true]{position:relative!important;top:10000vh;left:10000vw}div.coer-button a.loading{cursor:wait!important}div.coer-button i{display:flex!important;align-items:center!important;justify-content:center!important}div.coer-button i.spinner-border{width:15px!important;height:15px!important;font-size:16px!important}div.coer-button span{font-weight:700!important}div.coer-button .mat-mdc-button-touch-target{width:0px!important;height:0px!important}\n"] }]
|
250
250
|
}], propDecorators: { tooltip: [{
|
251
251
|
type: Input
|
252
252
|
}] } });
|