@litigiovirtual/ius-design-components 1.0.225 → 1.0.226
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.
|
@@ -1,12 +1,20 @@
|
|
|
1
1
|
import { CommonModule } from '@angular/common';
|
|
2
|
-
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
|
+
import { Component, EventEmitter, HostListener, Input, Output } from '@angular/core';
|
|
3
3
|
import { IconMdComponent } from "../icon-md";
|
|
4
4
|
import { ButtonCircleTertiaryComponent } from "../button-circle-tertiary";
|
|
5
5
|
import { ButtonStandardTertiaryComponent } from "../button-standard-tertiary";
|
|
6
6
|
import * as i0 from "@angular/core";
|
|
7
7
|
import * as i1 from "@angular/common";
|
|
8
8
|
export class ButtonAccountsComponent {
|
|
9
|
-
|
|
9
|
+
onDocumentClick(event) {
|
|
10
|
+
const target = event.target;
|
|
11
|
+
if (!this.elementRef.nativeElement.contains(target)) {
|
|
12
|
+
this.isOpen = false;
|
|
13
|
+
this.openOptions = false;
|
|
14
|
+
}
|
|
15
|
+
}
|
|
16
|
+
constructor(elementRef) {
|
|
17
|
+
this.elementRef = elementRef;
|
|
10
18
|
this.isOpen = false;
|
|
11
19
|
this.openOptions = false;
|
|
12
20
|
this.accountSelected = new EventEmitter();
|
|
@@ -23,8 +31,8 @@ export class ButtonAccountsComponent {
|
|
|
23
31
|
event.preventDefault();
|
|
24
32
|
this.openOptions = !this.openOptions;
|
|
25
33
|
}
|
|
26
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
27
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, ngImport: i0, template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }] }); }
|
|
34
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
35
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }] }); }
|
|
28
36
|
}
|
|
29
37
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, decorators: [{
|
|
30
38
|
type: Component,
|
|
@@ -34,7 +42,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
34
42
|
ButtonCircleTertiaryComponent,
|
|
35
43
|
ButtonStandardTertiaryComponent
|
|
36
44
|
], template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"] }]
|
|
37
|
-
}], propDecorators: { account: [{
|
|
45
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { account: [{
|
|
38
46
|
type: Input
|
|
39
47
|
}], accountSelected: [{
|
|
40
48
|
type: Output
|
|
@@ -44,5 +52,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
44
52
|
type: Output
|
|
45
53
|
}], onPressedEditar: [{
|
|
46
54
|
type: Output
|
|
55
|
+
}], onDocumentClick: [{
|
|
56
|
+
type: HostListener,
|
|
57
|
+
args: ['document:click', ['$event']]
|
|
47
58
|
}] } });
|
|
48
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
59
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYnV0dG9uLWFjY291bnRzLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2l1cy1kZXNpZ24tY29tcG9uZW50cy9zcmMvbGliL2J1dHRvbi1hY2NvdW50cy9idXR0b24tYWNjb3VudHMuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvYnV0dG9uLWFjY291bnRzL2J1dHRvbi1hY2NvdW50cy5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBYyxZQUFZLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7QUFDakcsT0FBTyxFQUFFLGVBQWUsRUFBRSxNQUFNLFlBQVksQ0FBQztBQUM3QyxPQUFPLEVBQUUsNkJBQTZCLEVBQUUsTUFBTSwyQkFBMkIsQ0FBQztBQUMxRSxPQUFPLEVBQUUsK0JBQStCLEVBQUUsTUFBTSw2QkFBNkIsQ0FBQzs7O0FBb0I5RSxNQUFNLE9BQU8sdUJBQXVCO0lBWWxDLGVBQWUsQ0FBQyxLQUFpQjtRQUMvQixNQUFNLE1BQU0sR0FBRyxLQUFLLENBQUMsTUFBcUIsQ0FBQztRQUUzQyxJQUFJLENBQUMsSUFBSSxDQUFDLFVBQVUsQ0FBQyxhQUFhLENBQUMsUUFBUSxDQUFDLE1BQU0sQ0FBQyxFQUFFLENBQUM7WUFDcEQsSUFBSSxDQUFDLE1BQU0sR0FBRyxLQUFLLENBQUM7WUFDcEIsSUFBSSxDQUFDLFdBQVcsR0FBRyxLQUFLLENBQUM7UUFDM0IsQ0FBQztJQUNILENBQUM7SUFFRCxZQUFvQixVQUFzQjtRQUF0QixlQUFVLEdBQVYsVUFBVSxDQUFZO1FBcEIxQyxXQUFNLEdBQUcsS0FBSyxDQUFDO1FBQ2YsZ0JBQVcsR0FBRyxLQUFLLENBQUM7UUFHVixvQkFBZSxHQUFHLElBQUksWUFBWSxFQUFPLENBQUM7UUFDMUMsNEJBQXVCLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQztRQUNsRCx5QkFBb0IsR0FBRyxJQUFJLFlBQVksRUFBTyxDQUFDO1FBQy9DLG9CQUFlLEdBQUcsSUFBSSxZQUFZLEVBQU8sQ0FBQztJQWFQLENBQUM7SUFFOUMsY0FBYyxDQUFDLE9BQWdCO1FBQzdCLElBQUksQ0FBQyxNQUFNLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFDO1FBQzNCLElBQUksQ0FBQyxlQUFlLENBQUMsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFDO0lBQ3JDLENBQUM7SUFFRCxXQUFXLENBQUMsS0FBaUI7UUFDM0IsS0FBSyxDQUFDLGVBQWUsRUFBRSxDQUFDO1FBQ3hCLEtBQUssQ0FBQyxjQUFjLEVBQUUsQ0FBQztRQUN2QixJQUFJLENBQUMsV0FBVyxHQUFHLENBQUMsSUFBSSxDQUFDLFdBQVcsQ0FBQztJQUN2QyxDQUFDOytHQWhDVSx1QkFBdUI7bUdBQXZCLHVCQUF1Qiw0V0N4QnBDLGswQ0E0Qk0sdXJGRFpGLGVBQWUsc0ZBQ2YsWUFBWSw2SEFDWiw2QkFBNkIscUlBQzdCLCtCQUErQjs7NEZBS3RCLHVCQUF1QjtrQkFabkMsU0FBUzsrQkFDRSxxQkFBcUIsY0FDbkIsSUFBSSxXQUNQO3dCQUNQLGVBQWU7d0JBQ2YsWUFBWTt3QkFDWiw2QkFBNkI7d0JBQzdCLCtCQUErQjtxQkFDaEM7K0VBUVEsT0FBTztzQkFBZixLQUFLO2dCQUNJLGVBQWU7c0JBQXhCLE1BQU07Z0JBQ0csdUJBQXVCO3NCQUFoQyxNQUFNO2dCQUNHLG9CQUFvQjtzQkFBN0IsTUFBTTtnQkFDRyxlQUFlO3NCQUF4QixNQUFNO2dCQUlQLGVBQWU7c0JBRmQsWUFBWTt1QkFBQyxnQkFBZ0IsRUFBRSxDQUFDLFFBQVEsQ0FBQyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IENvbXBvbmVudCwgRWxlbWVudFJlZiwgRXZlbnRFbWl0dGVyLCBIb3N0TGlzdGVuZXIsIElucHV0LCBPdXRwdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgSWNvbk1kQ29tcG9uZW50IH0gZnJvbSBcIi4uL2ljb24tbWRcIjtcclxuaW1wb3J0IHsgQnV0dG9uQ2lyY2xlVGVydGlhcnlDb21wb25lbnQgfSBmcm9tIFwiLi4vYnV0dG9uLWNpcmNsZS10ZXJ0aWFyeVwiO1xyXG5pbXBvcnQgeyBCdXR0b25TdGFuZGFyZFRlcnRpYXJ5Q29tcG9uZW50IH0gZnJvbSBcIi4uL2J1dHRvbi1zdGFuZGFyZC10ZXJ0aWFyeVwiO1xyXG5cclxuaW50ZXJmYWNlIEFjY291bnQge1xyXG4gIGFjY291bnRJRDogbnVtYmVyO1xyXG4gIG5hbWU6IHN0cmluZztcclxuICBsb2dvPzogc3RyaW5nO1xyXG59XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2l1cy1idXR0b24tYWNjb3VudHMnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW1xyXG4gICAgSWNvbk1kQ29tcG9uZW50LFxyXG4gICAgQ29tbW9uTW9kdWxlLFxyXG4gICAgQnV0dG9uQ2lyY2xlVGVydGlhcnlDb21wb25lbnQsXHJcbiAgICBCdXR0b25TdGFuZGFyZFRlcnRpYXJ5Q29tcG9uZW50XHJcbiAgXSxcclxuICB0ZW1wbGF0ZVVybDogJy4vYnV0dG9uLWFjY291bnRzLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybDogJy4vYnV0dG9uLWFjY291bnRzLmNvbXBvbmVudC5zY3NzJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgQnV0dG9uQWNjb3VudHNDb21wb25lbnQge1xyXG4gIGlzT3BlbiA9IGZhbHNlO1xyXG4gIG9wZW5PcHRpb25zID0gZmFsc2U7XHJcblxyXG4gIEBJbnB1dCgpIGFjY291bnQhOiBBY2NvdW50O1xyXG4gIEBPdXRwdXQoKSBhY2NvdW50U2VsZWN0ZWQgPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuICBAT3V0cHV0KCkgb25QcmVzc2VkUHJlZGV0ZXJtaW5hZG8gPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuICBAT3V0cHV0KCkgb25QcmVzc2VkRGVzdmluY3VsYXIgPSBuZXcgRXZlbnRFbWl0dGVyPGFueT4oKTtcclxuICBAT3V0cHV0KCkgb25QcmVzc2VkRWRpdGFyID0gbmV3IEV2ZW50RW1pdHRlcjxhbnk+KCk7XHJcblxyXG4gIEBIb3N0TGlzdGVuZXIoJ2RvY3VtZW50OmNsaWNrJywgWyckZXZlbnQnXSlcclxuXHJcbiAgb25Eb2N1bWVudENsaWNrKGV2ZW50OiBNb3VzZUV2ZW50KSB7XHJcbiAgICBjb25zdCB0YXJnZXQgPSBldmVudC50YXJnZXQgYXMgSFRNTEVsZW1lbnQ7XHJcblxyXG4gICAgaWYgKCF0aGlzLmVsZW1lbnRSZWYubmF0aXZlRWxlbWVudC5jb250YWlucyh0YXJnZXQpKSB7XHJcbiAgICAgIHRoaXMuaXNPcGVuID0gZmFsc2U7XHJcbiAgICAgIHRoaXMub3Blbk9wdGlvbnMgPSBmYWxzZTtcclxuICAgIH1cclxuICB9XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWxlbWVudFJlZjogRWxlbWVudFJlZikge31cclxuXHJcbiAgb25DbGlja0FjY291bnQoYWNjb3VudDogQWNjb3VudCkge1xyXG4gICAgdGhpcy5pc09wZW4gPSAhdGhpcy5pc09wZW47XHJcbiAgICB0aGlzLmFjY291bnRTZWxlY3RlZC5lbWl0KGFjY291bnQpO1xyXG4gIH1cclxuXHJcbiAgc2hvd09wdGlvbnMoZXZlbnQ6IE1vdXNlRXZlbnQpIHtcclxuICAgIGV2ZW50LnN0b3BQcm9wYWdhdGlvbigpO1xyXG4gICAgZXZlbnQucHJldmVudERlZmF1bHQoKTtcclxuICAgIHRoaXMub3Blbk9wdGlvbnMgPSAhdGhpcy5vcGVuT3B0aW9ucztcclxuICB9XHJcblxyXG59XHJcbiIsIjxkaXYgY2xhc3M9XCJnZW5lcmFsXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwiaXVzLWJ0blwiIFtuZ0NsYXNzXT1cInsgaXNPcGVuOiBpc09wZW4gfVwiPlxyXG4gICAgICAgIDxkaXYgY2xhc3M9XCJjb250ZW50XCIgKGNsaWNrKT1cIm9uQ2xpY2tBY2NvdW50KGFjY291bnQpXCI+XHJcbiAgICAgICAgICAgIEBpZihhY2NvdW50LmxvZ28pIHtcclxuICAgICAgICAgICAgPGltZyBjbGFzcz1cImxvZ29cIiBbc3JjXT1cImFjY291bnQubG9nb1wiIGFsdD1cImxlbSBsb2dvXCIgLz5cclxuICAgICAgICAgICAgfSBAZWxzZSB7XHJcbiAgICAgICAgICAgIDxpdXMtaWNvbi1tZCBbaWNvbk5hbWVdPVwiJ2ljb24tYWNjb3VudC1jaXJjbGUnXCIgY2xhc3M9XCJsb2dvXCI+PC9pdXMtaWNvbi1tZD5cclxuICAgICAgICAgICAgfVxyXG5cclxuICAgICAgICAgICAgPHNwYW4gY2xhc3M9XCJuYW1lXCI+e3thY2NvdW50Lm5hbWV9fTwvc3Bhbj5cclxuICAgICAgICA8L2Rpdj5cclxuXHJcbiAgICAgICAgPGl1cy1idXR0b24tY2lyY2xlLXRlcnRpYXJ5IChjbGljayk9XCJzaG93T3B0aW9ucygkZXZlbnQpXCIgW2ljb25OYW1lXT1cIidpY29uLW1vcmUtdmVydCdcIj5cclxuICAgICAgICA8L2l1cy1idXR0b24tY2lyY2xlLXRlcnRpYXJ5PlxyXG5cclxuICAgIDwvZGl2PlxyXG5cclxuICAgIEBpZihvcGVuT3B0aW9ucykge1xyXG4gICAgPGRpdiBjbGFzcz1cIm1vcmUtYm94IGFjdGl2ZVwiPlxyXG4gICAgICAgIDxpdXMtYnV0dG9uLXN0YW5kYXJkLXRlcnRpYXJ5IFtpY29uTmFtZV09XCInaWNvbi1jaGVjay1jaXJjbGUnXCJcclxuICAgICAgICAgICAgKGJ1dHRvbkNsaWNrZWQpPVwib25QcmVzc2VkUHJlZGV0ZXJtaW5hZG8uZW1pdChhY2NvdW50KVwiPk1hcmNhciBjb21vXHJcbiAgICAgICAgICAgIHByZWRldGVybWluYWRhPC9pdXMtYnV0dG9uLXN0YW5kYXJkLXRlcnRpYXJ5PlxyXG4gICAgICAgIDxpdXMtYnV0dG9uLXN0YW5kYXJkLXRlcnRpYXJ5IFtpY29uTmFtZV09XCInaWNvbi1lZGl0J1wiXHJcbiAgICAgICAgICAgIChidXR0b25DbGlja2VkKT1cIm9uUHJlc3NlZEVkaXRhci5lbWl0KGFjY291bnQpXCI+RWRpdGFyPC9pdXMtYnV0dG9uLXN0YW5kYXJkLXRlcnRpYXJ5PlxyXG4gICAgICAgIDwhLS0gPGl1cy1idXR0b24tc3RhbmRhcmQtdGVydGlhcnkgW2ljb25OYW1lXT1cIidpY29uLWRlbGV0ZSdcIlxyXG4gICAgICAgICAgICAoYnV0dG9uQ2xpY2tlZCk9XCJvblByZXNzZWREZXN2aW5jdWxhci5lbWl0KGFjY291bnQpXCI+RGVzdmluY3VsYXI8L2l1cy1idXR0b24tc3RhbmRhcmQtdGVydGlhcnk+IC0tPlxyXG4gICAgPC9kaXY+XHJcbiAgICB9XHJcbjwvZGl2PiJdfQ==
|
|
@@ -1536,7 +1536,15 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
1536
1536
|
}] } });
|
|
1537
1537
|
|
|
1538
1538
|
class ButtonAccountsComponent {
|
|
1539
|
-
|
|
1539
|
+
onDocumentClick(event) {
|
|
1540
|
+
const target = event.target;
|
|
1541
|
+
if (!this.elementRef.nativeElement.contains(target)) {
|
|
1542
|
+
this.isOpen = false;
|
|
1543
|
+
this.openOptions = false;
|
|
1544
|
+
}
|
|
1545
|
+
}
|
|
1546
|
+
constructor(elementRef) {
|
|
1547
|
+
this.elementRef = elementRef;
|
|
1540
1548
|
this.isOpen = false;
|
|
1541
1549
|
this.openOptions = false;
|
|
1542
1550
|
this.accountSelected = new EventEmitter();
|
|
@@ -1553,8 +1561,8 @@ class ButtonAccountsComponent {
|
|
|
1553
1561
|
event.preventDefault();
|
|
1554
1562
|
this.openOptions = !this.openOptions;
|
|
1555
1563
|
}
|
|
1556
|
-
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1557
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, ngImport: i0, template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }] }); }
|
|
1564
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, deps: [{ token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1565
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.3.12", type: ButtonAccountsComponent, isStandalone: true, selector: "ius-button-accounts", inputs: { account: "account" }, outputs: { accountSelected: "accountSelected", onPressedPredeterminado: "onPressedPredeterminado", onPressedDesvincular: "onPressedDesvincular", onPressedEditar: "onPressedEditar" }, host: { listeners: { "document:click": "onDocumentClick($event)" } }, ngImport: i0, template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"], dependencies: [{ kind: "component", type: IconMdComponent, selector: "ius-icon-md", inputs: ["iconName", "color"] }, { kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ButtonCircleTertiaryComponent, selector: "ius-button-circle-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }, { kind: "component", type: ButtonStandardTertiaryComponent, selector: "ius-button-standard-tertiary", inputs: ["disabled", "iconName"], outputs: ["buttonClicked"] }] }); }
|
|
1558
1566
|
}
|
|
1559
1567
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: ButtonAccountsComponent, decorators: [{
|
|
1560
1568
|
type: Component,
|
|
@@ -1564,7 +1572,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
1564
1572
|
ButtonCircleTertiaryComponent,
|
|
1565
1573
|
ButtonStandardTertiaryComponent
|
|
1566
1574
|
], template: "<div class=\"general\">\r\n <div class=\"ius-btn\" [ngClass]=\"{ isOpen: isOpen }\">\r\n <div class=\"content\" (click)=\"onClickAccount(account)\">\r\n @if(account.logo) {\r\n <img class=\"logo\" [src]=\"account.logo\" alt=\"lem logo\" />\r\n } @else {\r\n <ius-icon-md [iconName]=\"'icon-account-circle'\" class=\"logo\"></ius-icon-md>\r\n }\r\n\r\n <span class=\"name\">{{account.name}}</span>\r\n </div>\r\n\r\n <ius-button-circle-tertiary (click)=\"showOptions($event)\" [iconName]=\"'icon-more-vert'\">\r\n </ius-button-circle-tertiary>\r\n\r\n </div>\r\n\r\n @if(openOptions) {\r\n <div class=\"more-box active\">\r\n <ius-button-standard-tertiary [iconName]=\"'icon-check-circle'\"\r\n (buttonClicked)=\"onPressedPredeterminado.emit(account)\">Marcar como\r\n predeterminada</ius-button-standard-tertiary>\r\n <ius-button-standard-tertiary [iconName]=\"'icon-edit'\"\r\n (buttonClicked)=\"onPressedEditar.emit(account)\">Editar</ius-button-standard-tertiary>\r\n <!-- <ius-button-standard-tertiary [iconName]=\"'icon-delete'\"\r\n (buttonClicked)=\"onPressedDesvincular.emit(account)\">Desvincular</ius-button-standard-tertiary> -->\r\n </div>\r\n }\r\n</div>", styles: [".h1{font-family:Roboto,sans-serif;font-size:2.375rem;font-weight:500;line-height:46px}.h2{font-family:Roboto,sans-serif;font-size:1.875rem;font-weight:700;line-height:38px}.h3{font-family:Roboto,sans-serif;font-size:1.5rem;font-weight:500;line-height:32px}.h4{font-family:Roboto,sans-serif;font-size:1.25rem;font-weight:700;line-height:26px}.h5{font-family:Roboto,sans-serif;font-size:1.125rem;font-weight:500;line-height:24px;letter-spacing:.18px}.label-large{font-family:Roboto,sans-serif;font-size:1rem;font-weight:500;line-height:22px}.body-large{font-family:Rubik,sans-serif;font-size:1rem;font-weight:400;line-height:22px}.label-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;line-height:20px;letter-spacing:.28px}.body-base{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;font-style:italic;letter-spacing:.28px}.body-base-1,.body-base-1-1{font-family:Rubik,sans-serif;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.body-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;letter-spacing:.28px}.body-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:400;line-height:16px;font-style:italic;letter-spacing:.28px}.caption-sm{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;letter-spacing:.28px}.caption-sm-italic{font-family:Rubik,sans-serif;font-size:.75rem;font-weight:500;line-height:16px;font-style:italic;letter-spacing:.28px}.ius-btn{display:inline-flex;padding:8px 12px;align-items:center;gap:8px;border-radius:8px;background-color:#fff;color:#333;border:1px solid #eaeaea;cursor:pointer;font-family:Rubik,sans-serif;font-size:.875rem;font-weight:500;font-style:normal;line-height:20px;letter-spacing:.28px;width:100%;justify-content:space-between}.ius-btn:hover:not(:disabled){border:1px solid #bfbfbf;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014}.ius-btn:active:not(:disabled){border:1px solid #8c8c8c;background-color:#eaeaea}.ius-btn.isOpen{border:1px solid #eaeaea;box-shadow:0 1px 3px #0000001f,0 1px 2px #00000014;background-color:#fff}.content{display:flex;align-items:center;gap:12px;width:100%}.general{position:relative}.logo{width:32px;height:32px;border-radius:100px;align-items:center;aspect-ratio:1/1;border:.5px solid #f5f5f5}.more-box{position:absolute;left:10%;padding:12px;gap:8px;display:flex;flex-direction:column;z-index:100;opacity:0;pointer-events:none;transform:translateY(-6px);transition:opacity .25s ease,transform .25s ease;border-radius:8px;background:#fff;box-shadow:0 2px 6px #00000024,0 1px 10px #0000001a}.more-box.active{opacity:1;transform:translateY(0);pointer-events:all}\n"] }]
|
|
1567
|
-
}], propDecorators: { account: [{
|
|
1575
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { account: [{
|
|
1568
1576
|
type: Input
|
|
1569
1577
|
}], accountSelected: [{
|
|
1570
1578
|
type: Output
|
|
@@ -1574,6 +1582,9 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
1574
1582
|
type: Output
|
|
1575
1583
|
}], onPressedEditar: [{
|
|
1576
1584
|
type: Output
|
|
1585
|
+
}], onDocumentClick: [{
|
|
1586
|
+
type: HostListener,
|
|
1587
|
+
args: ['document:click', ['$event']]
|
|
1577
1588
|
}] } });
|
|
1578
1589
|
|
|
1579
1590
|
class SectionCollapseDrawerParentComponent {
|