@leanix/components 0.4.711 → 0.4.713
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.
|
@@ -578,11 +578,11 @@ class ButtonComponent {
|
|
|
578
578
|
return removeFontAwesomeVariant(iconName);
|
|
579
579
|
}
|
|
580
580
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ButtonComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
581
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: ButtonComponent, isStandalone: true, selector: "button[lx-button]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: false, isRequired: false, transformFunction: null }, pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, square: { classPropertyName: "square", publicName: "square", isSignal: false, isRequired: false, transformFunction: null }, circle: { classPropertyName: "circle", publicName: "circle", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, endIcon: { classPropertyName: "endIcon", publicName: "endIcon", isSignal: true, isRequired: false, transformFunction: null }, showSpinner: { classPropertyName: "showSpinner", publicName: "showSpinner", isSignal: false, isRequired: false, transformFunction: null } }, host: { properties: { "attr.size": "this.size", "attr.color": "this.color", "attr.mode": "this.mode", "class.pressed": "this.pressed", "class.selected": "this.selected", "class.square": "this.square", "class.circle": "this.circle", "class.withIcon": "this.hasIcon", "class.loading": "this.showSpinner", "disabled": "this.isDisabled" } }, ngImport: i0, template: "@let startIcon = iconName();\n@let endIcon = endIconName();\n\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n } @else if (startIcon && iconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && iconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && endIconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && endIconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.spin{animation:spin 2s infinite linear}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}ui5-busy-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]{cursor:default}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid][disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=default][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=default][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=default][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid][disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=light][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=light][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid][disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=primary][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcoloractive) r g b/.5);border:none}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=primary][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid][disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=danger][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(188.6956521739,7.3043478261,7.3043478261) r g b/.5);border:none}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=danger][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid][disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=success][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(20.4,81.6,35.2) r g b/.5);border:none}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=success][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading{position:relative;color:transparent!important}\n"], dependencies: [{ kind: "component", type: IconComponent$1, selector: "ui5-icon", inputs: ["design", "name", "accessibleName", "showTooltip", "mode"], exportAs: ["ui5Icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BusyIndicatorComponent, selector: "ui5-busy-indicator", inputs: ["text", "size", "active", "delay", "textPlacement"], exportAs: ["ui5BusyIndicator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
581
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.17", type: ButtonComponent, isStandalone: true, selector: "button[lx-button]", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: false, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, mode: { classPropertyName: "mode", publicName: "mode", isSignal: false, isRequired: false, transformFunction: null }, pressed: { classPropertyName: "pressed", publicName: "pressed", isSignal: false, isRequired: false, transformFunction: null }, selected: { classPropertyName: "selected", publicName: "selected", isSignal: false, isRequired: false, transformFunction: null }, square: { classPropertyName: "square", publicName: "square", isSignal: false, isRequired: false, transformFunction: null }, circle: { classPropertyName: "circle", publicName: "circle", isSignal: false, isRequired: false, transformFunction: null }, disabled: { classPropertyName: "disabled", publicName: "disabled", isSignal: false, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, endIcon: { classPropertyName: "endIcon", publicName: "endIcon", isSignal: true, isRequired: false, transformFunction: null }, showSpinner: { classPropertyName: "showSpinner", publicName: "showSpinner", isSignal: false, isRequired: false, transformFunction: null } }, host: { properties: { "attr.size": "this.size", "attr.color": "this.color", "attr.mode": "this.mode", "class.pressed": "this.pressed", "class.selected": "this.selected", "class.square": "this.square", "class.circle": "this.circle", "class.withIcon": "this.hasIcon", "class.loading": "this.showSpinner", "disabled": "this.isDisabled" } }, ngImport: i0, template: "@let startIcon = iconName();\n@let endIcon = endIconName();\n\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n } @else if (startIcon && iconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && iconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && endIconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && endIconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.spin{animation:spin 2s infinite linear}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}ui5-busy-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]:not(.loading){opacity:.5;cursor:default}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid].loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=default][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid].selected.loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=default][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=default][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid].loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=light][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid].selected.loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=light][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid].loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=primary][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcoloractive) r g b/.5);border:none}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid].selected.loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=primary][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid].loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=danger][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(188.6956521739,7.3043478261,7.3043478261) r g b/.5);border:none}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid].selected.loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=danger][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid].loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=success][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(20.4,81.6,35.2) r g b/.5);border:none}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid].selected.loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=success][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading{position:relative;color:transparent!important}\n"], dependencies: [{ kind: "component", type: IconComponent$1, selector: "ui5-icon", inputs: ["design", "name", "accessibleName", "showTooltip", "mode"], exportAs: ["ui5Icon"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BusyIndicatorComponent, selector: "ui5-busy-indicator", inputs: ["text", "size", "active", "delay", "textPlacement"], exportAs: ["ui5BusyIndicator"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
582
582
|
}
|
|
583
583
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.17", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
584
584
|
type: Component,
|
|
585
|
-
args: [{ selector: 'button[lx-button]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IconComponent$1, NgTemplateOutlet, BusyIndicatorComponent], template: "@let startIcon = iconName();\n@let endIcon = endIconName();\n\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n } @else if (startIcon && iconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && iconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && endIconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && endIconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.spin{animation:spin 2s infinite linear}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}ui5-busy-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]{cursor:default}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid][disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=default][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=default][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=default][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=default][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid][disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=light][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=light][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=light][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid][disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=primary][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcoloractive) r g b/.5);border:none}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=primary][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=primary][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid][disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=danger][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(188.6956521739,7.3043478261,7.3043478261) r g b/.5);border:none}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=danger][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=danger][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid][disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:hover:not([disabled])[disabled][mode=solid],:host[color=success][mode=solid]:focus:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(20.4,81.6,35.2) r g b/.5);border:none}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid].selected[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=outline]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=ghost]:hover:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link][disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success][mode=link]:focus:not([disabled])[disabled][mode=solid],:host[color=success][mode=link]:hover:not([disabled])[disabled][mode=solid],:host[color=success][mode=link]:active:not([disabled])[disabled][mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading{position:relative;color:transparent!important}\n"] }]
|
|
585
|
+
args: [{ selector: 'button[lx-button]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IconComponent$1, NgTemplateOutlet, BusyIndicatorComponent], template: "@let startIcon = iconName();\n@let endIcon = endIconName();\n\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <ui5-busy-indicator [active]=\"true\" [delay]=\"0\" size=\"S\" />\n } @else if (startIcon && iconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && iconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && endIconKind() === 'sap') {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && endIconKind() === 'fa') {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.spin{animation:spin 2s infinite linear}@keyframes spin{0%{-webkit-transform:rotate(0deg);transform:rotate(0)}to{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}ui5-busy-indicator{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]:not(.loading){opacity:.5;cursor:default}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid].loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=default][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid].selected.loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #f0f2f5 r g b/.5);border:none}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=default][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=default][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=default][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid].loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=light][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #c2c9d6 r g b/.5);border:none}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid].selected.loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #e1e5eb r g b/.5);border:none}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #fff r g b/.5);border:none}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=light][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=light][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid].loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=primary][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcoloractive) r g b/.5);border:none}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid].selected.loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolorhover) r g b/.5);border:none}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from var(--lx-primarybutton-backgroundcolor) r g b/.5);border:none}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=primary][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=primary][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid].loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=danger][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(188.6956521739,7.3043478261,7.3043478261) r g b/.5);border:none}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid].selected.loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(246.149068323,26.350931677,26.350931677) r g b/.5);border:none}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #f96464 r g b/.5);border:none}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=danger][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=danger][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid].loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:hover:not([disabled]).loading[mode=solid],:host[color=success][mode=solid]:focus:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(20.4,81.6,35.2) r g b/.5);border:none}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid].selected.loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=outline]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from rgb(35.7,142.8,61.6) r g b/.5);border:none}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=ghost]:hover:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from #33cc58 r g b/.5);border:none}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link].loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success][mode=link]:focus:not([disabled]).loading[mode=solid],:host[color=success][mode=link]:hover:not([disabled]).loading[mode=solid],:host[color=success][mode=link]:active:not([disabled]).loading[mode=solid]{background-color:rgb(from transparent r g b/.5);border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading{position:relative;color:transparent!important}\n"] }]
|
|
586
586
|
}], propDecorators: { size: [{
|
|
587
587
|
type: Input
|
|
588
588
|
}, {
|