otimus-library 0.0.19 → 0.0.21
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/components/oc-badge/oc-badge.component.mjs +10 -10
- package/esm2022/lib/components/oc-chip/oc-chip.component.mjs +33 -0
- package/esm2022/lib/components/oc-filter/oc-filter.component.mjs +9 -9
- package/esm2022/lib/components/oc-input/oc-input.component.mjs +8 -8
- package/esm2022/lib/components/oc-key-value/oc-key-value.component.mjs +7 -7
- package/esm2022/lib/components/oc-modal/oc-modal.component.mjs +13 -15
- package/esm2022/public-api.mjs +2 -1
- package/fesm2022/otimus-library.mjs +73 -46
- package/fesm2022/otimus-library.mjs.map +1 -1
- package/lib/components/oc-badge/oc-badge.component.d.ts +4 -4
- package/lib/components/oc-chip/oc-chip.component.d.ts +12 -0
- package/lib/components/oc-filter/oc-filter.component.d.ts +4 -4
- package/lib/components/oc-input/oc-input.component.d.ts +4 -4
- package/lib/components/oc-key-value/oc-key-value.component.d.ts +3 -3
- package/lib/components/oc-modal/oc-modal.component.d.ts +4 -3
- package/package.json +1 -1
- package/public-api.d.ts +1 -0
- package/styles/styles.scss +0 -1
- package/assets/iconfont/MaterialIcons-Outlined.woff2 +0 -0
- package/assets/iconfont/MaterialIcons-Regular.eot +0 -0
- package/assets/iconfont/MaterialIcons-Regular.ijmap +0 -1
- package/assets/iconfont/MaterialIcons-Regular.svg +0 -2373
- package/assets/iconfont/MaterialIcons-Regular.ttf +0 -0
- package/assets/iconfont/MaterialIcons-Regular.woff +0 -0
- package/assets/iconfont/MaterialIcons-Regular.woff2 +0 -0
- package/assets/iconfont/README.md +0 -9
- package/assets/iconfont/material-icons.scss +0 -51
|
@@ -4,27 +4,27 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
import * as i1 from "@angular/common";
|
|
5
5
|
export class OcBadgeComponent {
|
|
6
6
|
constructor() {
|
|
7
|
-
this.
|
|
8
|
-
this.
|
|
9
|
-
this.
|
|
7
|
+
this.ocSize = 'small';
|
|
8
|
+
this.ocColor = 'notification';
|
|
9
|
+
this.ocWaved = false;
|
|
10
10
|
this.classList = [];
|
|
11
11
|
}
|
|
12
12
|
ngOnInit() {
|
|
13
|
-
this.classList.push(this.
|
|
14
|
-
if (this.
|
|
13
|
+
this.classList.push(this.ocSize, this.ocColor);
|
|
14
|
+
if (this.ocWaved)
|
|
15
15
|
this.classList.push('waved');
|
|
16
16
|
}
|
|
17
17
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcBadgeComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
18
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcBadgeComponent, isStandalone: true, selector: "oc-badge", inputs: {
|
|
18
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcBadgeComponent, isStandalone: true, selector: "oc-badge", inputs: { ocSize: "ocSize", ocColor: "ocColor", ocWaved: "ocWaved" }, ngImport: i0, template: "<div>\r\n <div class=\"oc-badge\" [ngClass]=\"classList\">\r\n <ng-content>\r\n \r\n </ng-content>\r\n </div>\r\n</div>\r\n", styles: [".oc-badge{border-radius:50%;display:flex;justify-content:center;align-items:center;color:#f8f9ff}.oc-badge>*{color:#f8f9ff;font-weight:600}.notification{background-color:#ed3a3a}.brand-g{background-color:#00dda3}.brand-p{background-color:#5505a2}.success{background-color:#4ab858}.warning{background-color:#ebbc2e}.small{width:22px;height:22px;font-size:1rem}.medium{width:28px;height:28px;font-size:1.25rem}.large{width:34px;height:34px;font-size:1.5rem}.waved{position:relative;z-index:2}.waved:before,.waved:after{z-index:-1;content:\"\";position:absolute;top:0;border-radius:50%;width:100%;height:100%;animation:wave infinite 2s}.waved:after{animation-delay:.6s}.waved.notification:before,.waved.notification:after{background-color:#ed3a3a}.waved.brand-g:before,.waved.brand-g:after{background-color:#00dda3}.waved.brand-p:before,.waved.brand-p:after{background-color:#5505a2}.waved.success:before,.waved.success:after{background-color:#4ab858}.waved.warning:before,.waved.warning:after{background-color:#ebbc2e}@keyframes wave{0%{transform:scale(0)}to{opacity:0;transform:scale(2)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
19
19
|
}
|
|
20
20
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcBadgeComponent, decorators: [{
|
|
21
21
|
type: Component,
|
|
22
22
|
args: [{ selector: 'oc-badge', standalone: true, imports: [CommonModule], template: "<div>\r\n <div class=\"oc-badge\" [ngClass]=\"classList\">\r\n <ng-content>\r\n \r\n </ng-content>\r\n </div>\r\n</div>\r\n", styles: [".oc-badge{border-radius:50%;display:flex;justify-content:center;align-items:center;color:#f8f9ff}.oc-badge>*{color:#f8f9ff;font-weight:600}.notification{background-color:#ed3a3a}.brand-g{background-color:#00dda3}.brand-p{background-color:#5505a2}.success{background-color:#4ab858}.warning{background-color:#ebbc2e}.small{width:22px;height:22px;font-size:1rem}.medium{width:28px;height:28px;font-size:1.25rem}.large{width:34px;height:34px;font-size:1.5rem}.waved{position:relative;z-index:2}.waved:before,.waved:after{z-index:-1;content:\"\";position:absolute;top:0;border-radius:50%;width:100%;height:100%;animation:wave infinite 2s}.waved:after{animation-delay:.6s}.waved.notification:before,.waved.notification:after{background-color:#ed3a3a}.waved.brand-g:before,.waved.brand-g:after{background-color:#00dda3}.waved.brand-p:before,.waved.brand-p:after{background-color:#5505a2}.waved.success:before,.waved.success:after{background-color:#4ab858}.waved.warning:before,.waved.warning:after{background-color:#ebbc2e}@keyframes wave{0%{transform:scale(0)}to{opacity:0;transform:scale(2)}}\n"] }]
|
|
23
|
-
}], propDecorators: {
|
|
23
|
+
}], propDecorators: { ocSize: [{
|
|
24
24
|
type: Input
|
|
25
|
-
}],
|
|
25
|
+
}], ocColor: [{
|
|
26
26
|
type: Input
|
|
27
|
-
}],
|
|
27
|
+
}], ocWaved: [{
|
|
28
28
|
type: Input
|
|
29
29
|
}] } });
|
|
30
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
30
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2MtYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvb3RpbXVzLWxpYnJhcnkvc3JjL2xpYi9jb21wb25lbnRzL29jLWJhZGdlL29jLWJhZGdlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1iYWRnZS9vYy1iYWRnZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxLQUFLLEVBQVUsTUFBTSxlQUFlLENBQUM7OztBQVN6RCxNQUFNLE9BQU8sZ0JBQWdCO0lBUDdCO1FBUVcsV0FBTSxHQUFpQyxPQUFPLENBQUE7UUFDOUMsWUFBTyxHQUFtRSxjQUFjLENBQUE7UUFDeEYsWUFBTyxHQUFZLEtBQUssQ0FBQTtRQUVqQyxjQUFTLEdBQWEsRUFBRSxDQUFBO0tBTXpCO0lBSkMsUUFBUTtRQUNOLElBQUksQ0FBQyxTQUFTLENBQUMsSUFBSSxDQUFDLElBQUksQ0FBQyxNQUFNLEVBQUUsSUFBSSxDQUFDLE9BQU8sQ0FBQyxDQUFBO1FBQzlDLElBQUcsSUFBSSxDQUFDLE9BQU87WUFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsQ0FBQTtJQUMvQyxDQUFDOzhHQVZVLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLDBJQ1Y3QixzSUFPQSwwbkNERFksWUFBWTs7MkZBSVgsZ0JBQWdCO2tCQVA1QixTQUFTOytCQUNFLFVBQVUsY0FDUixJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUM7OEJBS2QsTUFBTTtzQkFBZCxLQUFLO2dCQUNHLE9BQU87c0JBQWYsS0FBSztnQkFDRyxPQUFPO3NCQUFmLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xyXG5pbXBvcnQgeyBDb21wb25lbnQsIElucHV0LCBPbkluaXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnb2MtYmFkZ2UnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXHJcbiAgdGVtcGxhdGVVcmw6ICcuL29jLWJhZGdlLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybDogJy4vb2MtYmFkZ2UuY29tcG9uZW50LnNjc3MnXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBPY0JhZGdlQ29tcG9uZW50IGltcGxlbWVudHMgT25Jbml0IHtcclxuICBASW5wdXQoKSBvY1NpemU6ICdzbWFsbCcgfCAnbWVkaXVtJyB8ICdsYXJnZScgPSAnc21hbGwnXHJcbiAgQElucHV0KCkgb2NDb2xvcjogJ25vdGlmaWNhdGlvbicgfCAnYnJhbmQtZycgfCAnYnJhbmQtcCcgfCAnc3VjY2VzcycgfCAnd2FybmluZycgPSAnbm90aWZpY2F0aW9uJ1xyXG4gIEBJbnB1dCgpIG9jV2F2ZWQ6IGJvb2xlYW4gPSBmYWxzZVxyXG5cclxuICBjbGFzc0xpc3Q6IHN0cmluZ1tdID0gW11cclxuXHJcbiAgbmdPbkluaXQoKTogdm9pZCB7XHJcbiAgICB0aGlzLmNsYXNzTGlzdC5wdXNoKHRoaXMub2NTaXplLCB0aGlzLm9jQ29sb3IpXHJcbiAgICBpZih0aGlzLm9jV2F2ZWQpIHRoaXMuY2xhc3NMaXN0LnB1c2goJ3dhdmVkJylcclxuICB9XHJcbn1cclxuIiwiPGRpdj5cclxuICA8ZGl2IGNsYXNzPVwib2MtYmFkZ2VcIiBbbmdDbGFzc109XCJjbGFzc0xpc3RcIj5cclxuICAgIDxuZy1jb250ZW50PlxyXG4gIFxyXG4gICAgPC9uZy1jb250ZW50PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj5cclxuIl19
|
|
@@ -0,0 +1,33 @@
|
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
|
+
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
3
|
+
import * as i0 from "@angular/core";
|
|
4
|
+
import * as i1 from "@angular/common";
|
|
5
|
+
export class OcChipComponent {
|
|
6
|
+
constructor() {
|
|
7
|
+
this.ocSelected = false;
|
|
8
|
+
this.ocType = 'select';
|
|
9
|
+
this.ocBg = 'green';
|
|
10
|
+
this.ocText = '';
|
|
11
|
+
this.ocClick = new EventEmitter;
|
|
12
|
+
}
|
|
13
|
+
ocEvent() {
|
|
14
|
+
this.ocClick.emit();
|
|
15
|
+
}
|
|
16
|
+
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcChipComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
17
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.5", type: OcChipComponent, isStandalone: true, selector: "oc-chip", inputs: { ocSelected: "ocSelected", ocType: "ocType", ocBg: "ocBg", ocText: "ocText" }, outputs: { ocClick: "ocClick" }, ngImport: i0, template: "<button\n [ngClass]=\"{\n 'oc-chip': true,\n selected: ocSelected,\n 'not-selectable': ocType !== 'select',\n 'tag': ocType === 'tag',\n 'remove': ocType === 'remove',\n 'green-bg': ocBg === 'green',\n 'red-bg': ocBg === 'red'\n }\"\n type=\"button\"\n [title]=\"ocText\"\n (click)=\"ocType === 'select' ? ocEvent() : null\"\n>\n <ng-content></ng-content>\n @if (ocType === 'remove') {\n <span class=\"material-symbols-outlined\" (click)=\"ocEvent()\">close</span>\n }\n</button>\n", styles: [".oc-chip{background-color:#f7f7f7;color:#8f9596;border:2px solid #d1d5db;border-radius:16px;font-size:1rem;font-weight:600;padding:3px 18px;transition:.3s ease!important;cursor:pointer}.oc-chip:hover{filter:brightness(.95)}.oc-chip:active{filter:brightness(.85)}.selected{background-color:#ccfbe6dc;border:2px solid #00dda3;color:#00dda3}.selected.red-bg{color:#ed3a3a;border-color:#ed3a3a;background-color:#ffcaca}.not-selectable{border:none;background-color:#f7f7f7;color:#8f9596;cursor:default}.not-selectable:active{cursor:not-allowed}.material-symbols-outlined{font-size:.9rem;width:10px;height:10px}.remove{display:flex;align-items:center;gap:.5rem;padding-right:.5rem}.remove:hover{filter:brightness(1)}.remove span{display:flex;align-items:center;justify-content:center;padding:5px;cursor:pointer;border-radius:50%;transition:.1s ease}.remove span:hover{background-color:#d1d5db}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }] }); }
|
|
18
|
+
}
|
|
19
|
+
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcChipComponent, decorators: [{
|
|
20
|
+
type: Component,
|
|
21
|
+
args: [{ selector: 'oc-chip', standalone: true, imports: [CommonModule], template: "<button\n [ngClass]=\"{\n 'oc-chip': true,\n selected: ocSelected,\n 'not-selectable': ocType !== 'select',\n 'tag': ocType === 'tag',\n 'remove': ocType === 'remove',\n 'green-bg': ocBg === 'green',\n 'red-bg': ocBg === 'red'\n }\"\n type=\"button\"\n [title]=\"ocText\"\n (click)=\"ocType === 'select' ? ocEvent() : null\"\n>\n <ng-content></ng-content>\n @if (ocType === 'remove') {\n <span class=\"material-symbols-outlined\" (click)=\"ocEvent()\">close</span>\n }\n</button>\n", styles: [".oc-chip{background-color:#f7f7f7;color:#8f9596;border:2px solid #d1d5db;border-radius:16px;font-size:1rem;font-weight:600;padding:3px 18px;transition:.3s ease!important;cursor:pointer}.oc-chip:hover{filter:brightness(.95)}.oc-chip:active{filter:brightness(.85)}.selected{background-color:#ccfbe6dc;border:2px solid #00dda3;color:#00dda3}.selected.red-bg{color:#ed3a3a;border-color:#ed3a3a;background-color:#ffcaca}.not-selectable{border:none;background-color:#f7f7f7;color:#8f9596;cursor:default}.not-selectable:active{cursor:not-allowed}.material-symbols-outlined{font-size:.9rem;width:10px;height:10px}.remove{display:flex;align-items:center;gap:.5rem;padding-right:.5rem}.remove:hover{filter:brightness(1)}.remove span{display:flex;align-items:center;justify-content:center;padding:5px;cursor:pointer;border-radius:50%;transition:.1s ease}.remove span:hover{background-color:#d1d5db}\n"] }]
|
|
22
|
+
}], propDecorators: { ocSelected: [{
|
|
23
|
+
type: Input
|
|
24
|
+
}], ocType: [{
|
|
25
|
+
type: Input
|
|
26
|
+
}], ocBg: [{
|
|
27
|
+
type: Input
|
|
28
|
+
}], ocText: [{
|
|
29
|
+
type: Input
|
|
30
|
+
}], ocClick: [{
|
|
31
|
+
type: Output
|
|
32
|
+
}] } });
|
|
33
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2MtY2hpcC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9vdGltdXMtbGlicmFyeS9zcmMvbGliL2NvbXBvbmVudHMvb2MtY2hpcC9vYy1jaGlwLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1jaGlwL29jLWNoaXAuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFlBQVksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQy9DLE9BQU8sRUFBRSxTQUFTLEVBQUUsWUFBWSxFQUFFLEtBQUssRUFBRSxNQUFNLEVBQUUsTUFBTSxlQUFlLENBQUM7OztBQVN2RSxNQUFNLE9BQU8sZUFBZTtJQVA1QjtRQVFXLGVBQVUsR0FBWSxLQUFLLENBQUE7UUFDM0IsV0FBTSxHQUFnQyxRQUFRLENBQUE7UUFDOUMsU0FBSSxHQUFvQixPQUFPLENBQUE7UUFDL0IsV0FBTSxHQUFXLEVBQUUsQ0FBQTtRQUNsQixZQUFPLEdBQXNCLElBQUksWUFBaUIsQ0FBQTtLQUs3RDtJQUhDLE9BQU87UUFDTCxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFBO0lBQ3JCLENBQUM7OEdBVFUsZUFBZTtrR0FBZixlQUFlLDRMQ1Y1QixtZ0JBbUJBLGs3QkRiWSxZQUFZOzsyRkFJWCxlQUFlO2tCQVAzQixTQUFTOytCQUNFLFNBQVMsY0FDUCxJQUFJLFdBQ1AsQ0FBQyxZQUFZLENBQUM7OEJBS2QsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csSUFBSTtzQkFBWixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSztnQkFDSSxPQUFPO3NCQUFoQixNQUFNIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tbW9uTW9kdWxlIH0gZnJvbSAnQGFuZ3VsYXIvY29tbW9uJztcbmltcG9ydCB7IENvbXBvbmVudCwgRXZlbnRFbWl0dGVyLCBJbnB1dCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ29jLWNoaXAnLFxuICBzdGFuZGFsb25lOiB0cnVlLFxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlXSxcbiAgdGVtcGxhdGVVcmw6ICcuL29jLWNoaXAuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vb2MtY2hpcC5jb21wb25lbnQuc2Nzcydcbn0pXG5leHBvcnQgY2xhc3MgT2NDaGlwQ29tcG9uZW50IHtcbiAgQElucHV0KCkgb2NTZWxlY3RlZDogYm9vbGVhbiA9IGZhbHNlXG4gIEBJbnB1dCgpIG9jVHlwZTogJ3NlbGVjdCcgfCAncmVtb3ZlJyB8ICd0YWcnID0gJ3NlbGVjdCdcbiAgQElucHV0KCkgb2NCZzogJ2dyZWVuJyB8ICdyZWQnID0gJ2dyZWVuJ1xuICBASW5wdXQoKSBvY1RleHQ6IHN0cmluZyA9ICcnXG4gIEBPdXRwdXQoKSBvY0NsaWNrOiBFdmVudEVtaXR0ZXI8YW55PiA9IG5ldyBFdmVudEVtaXR0ZXI8YW55PlxuXG4gIG9jRXZlbnQoKSB7XG4gICAgdGhpcy5vY0NsaWNrLmVtaXQoKVxuICB9XG59XG4iLCI8YnV0dG9uXG4gIFtuZ0NsYXNzXT1cIntcbiAgICAnb2MtY2hpcCc6IHRydWUsXG4gICAgc2VsZWN0ZWQ6IG9jU2VsZWN0ZWQsXG4gICAgJ25vdC1zZWxlY3RhYmxlJzogb2NUeXBlICE9PSAnc2VsZWN0JyxcbiAgICAndGFnJzogb2NUeXBlID09PSAndGFnJyxcbiAgICAncmVtb3ZlJzogb2NUeXBlID09PSAncmVtb3ZlJyxcbiAgICAnZ3JlZW4tYmcnOiBvY0JnID09PSAnZ3JlZW4nLFxuICAgICdyZWQtYmcnOiBvY0JnID09PSAncmVkJ1xuICB9XCJcbiAgdHlwZT1cImJ1dHRvblwiXG4gIFt0aXRsZV09XCJvY1RleHRcIlxuICAoY2xpY2spPVwib2NUeXBlID09PSAnc2VsZWN0JyA/IG9jRXZlbnQoKSA6IG51bGxcIlxuPlxuICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIEBpZiAob2NUeXBlID09PSAncmVtb3ZlJykge1xuICAgIDxzcGFuIGNsYXNzPVwibWF0ZXJpYWwtc3ltYm9scy1vdXRsaW5lZFwiIChjbGljayk9XCJvY0V2ZW50KClcIj5jbG9zZTwvc3Bhbj5cbiAgfVxuPC9idXR0b24+XG4iXX0=
|
|
@@ -6,24 +6,24 @@ import * as i1 from "@angular/common";
|
|
|
6
6
|
export class OcFilterComponent {
|
|
7
7
|
constructor() {
|
|
8
8
|
this.isOpen = false;
|
|
9
|
-
this.
|
|
10
|
-
this.
|
|
11
|
-
this.
|
|
9
|
+
this.ocText = 'Filtros';
|
|
10
|
+
this.ocActive = 0;
|
|
11
|
+
this.ocSide = 'left';
|
|
12
12
|
}
|
|
13
13
|
toggleOpen() {
|
|
14
14
|
this.isOpen = !this.isOpen;
|
|
15
15
|
}
|
|
16
16
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcFilterComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
17
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcFilterComponent, isStandalone: true, selector: "oc-filter", inputs: {
|
|
17
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcFilterComponent, isStandalone: true, selector: "oc-filter", inputs: { ocText: "ocText", ocActive: "ocActive", ocSide: "ocSide" }, ngImport: i0, template: "<div class=\"oc-filter-row\" [ngClass]=\"{\r\n reverse: ocSide === 'right'\r\n}\">\r\n <button class=\"oc-filter-btn\" (click)=\"toggleOpen()\">\r\n <span class=\"material-symbols-outlined md-18\">filter_list</span>\r\n {{ocText}}\r\n <div class=\"badge\">\r\n <oc-badge *ngIf=\"ocActive > 0\" ocSize=\"small\" ocColor=\"success\" [ocWaved]=\"true\">{{ocActive}}</oc-badge>\r\n </div>\r\n </button>\r\n \r\n <div class=\"filter-row-content\">\r\n <ng-content select=\"[row]\"></ng-content>\r\n </div>\r\n \r\n</div>\r\n<div *ngIf=\"isOpen\" class=\"oc-filter-content\">\r\n <ng-content select=\"[body]\">\r\n </ng-content>\r\n</div>\r\n", styles: [".oc.button{height:3rem;padding:0 2rem;background-color:#d1d5db;color:#353535;border-radius:.5rem;border:none;font-weight:500;font-size:1rem;transition:.15s ease;display:flex;justify-content:center;align-items:center;gap:.5rem;cursor:pointer}.oc.button.align-left{padding-left:1rem}.oc.button.align-right{padding-right:1rem}.oc.button:hover{filter:brightness(.95)}.oc.button:active{transform:translateY(1.5px)}.oc.button.no-bg{color:#8f9596;background-color:transparent}.oc.button.no-bg:hover{background-color:#f8f9ff}.oc.button.error{background-color:#ed3a3a;color:#f8f9ff}.oc.button.p-1{background-color:#5505a2;color:#f8f9ff}.oc.button.p-2{background-color:#1e0832;color:#f8f9ff}.oc.button.p-3{background-color:#7737b5;color:#f8f9ff}.oc.button.p-4{background-color:#9969c7;color:#f8f9ff}.oc.button.g-1{background-color:#00dda3;color:#1e0832}.oc.button.g-2{background-color:#1ae0ac;color:#1e0832}.oc.button.g-3{background-color:#33e4b5;color:#1e0832}.oc.button.g-4{background-color:#94ffe3;color:#1e0832}.oc.button.gray-1{background-color:#d1d5db;color:#353535}.oc.button.gray-2{background-color:#8f9596;color:#f8f9ff}.oc.button.gray-3{background-color:#7e8485;color:#f8f9ff}.oc.button.gray-4{background-color:#353535;color:#f8f9ff}.oc.button.small{height:2.5rem!important}.oc.button.large{height:3.5rem!important}.oc.button.icon{height:3rem;width:3rem;padding:0}.oc.button.icon.small{width:2.5rem!important;padding:0}.oc.button.icon.large{width:3.5rem!important;padding:0}.oc.button.outlined{background-color:transparent;border:2px solid}.oc.button.outlined.p-1{color:#5505a2}.oc.button.outlined.p-2{color:#1e0832}.oc.button.outlined.p-3{color:#7737b5}.oc.button.outlined.p-4{color:#9969c7}.oc.button.outlined.g-1{color:#00dda3}.oc.button.outlined.g-2{color:#1ae0ac}.oc.button.outlined.g-3{color:#33e4b5}.oc.button.outlined.g-4{color:#94ffe3}.oc.button.outlined.gray-1{color:#8f9596}.oc.button.outlined.gray-2{color:#7e8485}.oc.button.outlined.gray-3{color:#353535}.oc-filter-row{width:100%;display:flex;align-items:center;gap:1rem}.oc-filter-row .filter-row-content{width:100%}.reverse{flex-direction:row-reverse}.oc-filter-btn{background-color:#5505a2;color:#f8f9ff;border:none;border-radius:.5rem;padding:.4rem .8rem;font-weight:600;display:flex;align-items:center;gap:.2rem;transition:.2s ease;position:relative;cursor:pointer}.oc-filter-btn:hover{filter:brightness(.9)}.oc-filter-btn .material-symbols-outlined{font-size:1rem;color:#f7f7f7}.oc-filter-btn img{width:15px;filter:brightness(0) invert(1)}.oc-filter-btn .badge{position:absolute;top:-8px;right:-12px}.oc-filter-content{width:100%;animation:showing-up .15s ease;overflow:hidden;margin-top:1rem}@keyframes showing-up{0%{height:0px;opacity:0}to{height:100%;opacity:1}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: OcBadgeComponent, selector: "oc-badge", inputs: ["ocSize", "ocColor", "ocWaved"] }] }); }
|
|
18
18
|
}
|
|
19
19
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcFilterComponent, decorators: [{
|
|
20
20
|
type: Component,
|
|
21
|
-
args: [{ selector: 'oc-filter', standalone: true, imports: [CommonModule, OcBadgeComponent], template: "<div class=\"oc-filter-row\" [ngClass]=\"{\r\n reverse:
|
|
22
|
-
}], propDecorators: {
|
|
21
|
+
args: [{ selector: 'oc-filter', standalone: true, imports: [CommonModule, OcBadgeComponent], template: "<div class=\"oc-filter-row\" [ngClass]=\"{\r\n reverse: ocSide === 'right'\r\n}\">\r\n <button class=\"oc-filter-btn\" (click)=\"toggleOpen()\">\r\n <span class=\"material-symbols-outlined md-18\">filter_list</span>\r\n {{ocText}}\r\n <div class=\"badge\">\r\n <oc-badge *ngIf=\"ocActive > 0\" ocSize=\"small\" ocColor=\"success\" [ocWaved]=\"true\">{{ocActive}}</oc-badge>\r\n </div>\r\n </button>\r\n \r\n <div class=\"filter-row-content\">\r\n <ng-content select=\"[row]\"></ng-content>\r\n </div>\r\n \r\n</div>\r\n<div *ngIf=\"isOpen\" class=\"oc-filter-content\">\r\n <ng-content select=\"[body]\">\r\n </ng-content>\r\n</div>\r\n", styles: [".oc.button{height:3rem;padding:0 2rem;background-color:#d1d5db;color:#353535;border-radius:.5rem;border:none;font-weight:500;font-size:1rem;transition:.15s ease;display:flex;justify-content:center;align-items:center;gap:.5rem;cursor:pointer}.oc.button.align-left{padding-left:1rem}.oc.button.align-right{padding-right:1rem}.oc.button:hover{filter:brightness(.95)}.oc.button:active{transform:translateY(1.5px)}.oc.button.no-bg{color:#8f9596;background-color:transparent}.oc.button.no-bg:hover{background-color:#f8f9ff}.oc.button.error{background-color:#ed3a3a;color:#f8f9ff}.oc.button.p-1{background-color:#5505a2;color:#f8f9ff}.oc.button.p-2{background-color:#1e0832;color:#f8f9ff}.oc.button.p-3{background-color:#7737b5;color:#f8f9ff}.oc.button.p-4{background-color:#9969c7;color:#f8f9ff}.oc.button.g-1{background-color:#00dda3;color:#1e0832}.oc.button.g-2{background-color:#1ae0ac;color:#1e0832}.oc.button.g-3{background-color:#33e4b5;color:#1e0832}.oc.button.g-4{background-color:#94ffe3;color:#1e0832}.oc.button.gray-1{background-color:#d1d5db;color:#353535}.oc.button.gray-2{background-color:#8f9596;color:#f8f9ff}.oc.button.gray-3{background-color:#7e8485;color:#f8f9ff}.oc.button.gray-4{background-color:#353535;color:#f8f9ff}.oc.button.small{height:2.5rem!important}.oc.button.large{height:3.5rem!important}.oc.button.icon{height:3rem;width:3rem;padding:0}.oc.button.icon.small{width:2.5rem!important;padding:0}.oc.button.icon.large{width:3.5rem!important;padding:0}.oc.button.outlined{background-color:transparent;border:2px solid}.oc.button.outlined.p-1{color:#5505a2}.oc.button.outlined.p-2{color:#1e0832}.oc.button.outlined.p-3{color:#7737b5}.oc.button.outlined.p-4{color:#9969c7}.oc.button.outlined.g-1{color:#00dda3}.oc.button.outlined.g-2{color:#1ae0ac}.oc.button.outlined.g-3{color:#33e4b5}.oc.button.outlined.g-4{color:#94ffe3}.oc.button.outlined.gray-1{color:#8f9596}.oc.button.outlined.gray-2{color:#7e8485}.oc.button.outlined.gray-3{color:#353535}.oc-filter-row{width:100%;display:flex;align-items:center;gap:1rem}.oc-filter-row .filter-row-content{width:100%}.reverse{flex-direction:row-reverse}.oc-filter-btn{background-color:#5505a2;color:#f8f9ff;border:none;border-radius:.5rem;padding:.4rem .8rem;font-weight:600;display:flex;align-items:center;gap:.2rem;transition:.2s ease;position:relative;cursor:pointer}.oc-filter-btn:hover{filter:brightness(.9)}.oc-filter-btn .material-symbols-outlined{font-size:1rem;color:#f7f7f7}.oc-filter-btn img{width:15px;filter:brightness(0) invert(1)}.oc-filter-btn .badge{position:absolute;top:-8px;right:-12px}.oc-filter-content{width:100%;animation:showing-up .15s ease;overflow:hidden;margin-top:1rem}@keyframes showing-up{0%{height:0px;opacity:0}to{height:100%;opacity:1}}\n"] }]
|
|
22
|
+
}], propDecorators: { ocText: [{
|
|
23
23
|
type: Input
|
|
24
|
-
}],
|
|
24
|
+
}], ocActive: [{
|
|
25
25
|
type: Input
|
|
26
|
-
}],
|
|
26
|
+
}], ocSide: [{
|
|
27
27
|
type: Input
|
|
28
28
|
}] } });
|
|
29
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
29
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2MtZmlsdGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1maWx0ZXIvb2MtZmlsdGVyLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1maWx0ZXIvb2MtZmlsdGVyLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxZQUFZLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUMvQyxPQUFPLEVBQUUsU0FBUyxFQUFFLEtBQUssRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUNqRCxPQUFPLEVBQUUsZ0JBQWdCLEVBQUUsTUFBTSxnQ0FBZ0MsQ0FBQzs7O0FBU2xFLE1BQU0sT0FBTyxpQkFBaUI7SUFQOUI7UUFRRSxXQUFNLEdBQVksS0FBSyxDQUFBO1FBQ2QsV0FBTSxHQUFXLFNBQVMsQ0FBQTtRQUMxQixhQUFRLEdBQVcsQ0FBQyxDQUFBO1FBQ3BCLFdBQU0sR0FBcUIsTUFBTSxDQUFBO0tBSzNDO0lBSEMsVUFBVTtRQUNSLElBQUksQ0FBQyxNQUFNLEdBQUcsQ0FBQyxJQUFJLENBQUMsTUFBTSxDQUFBO0lBQzVCLENBQUM7OEdBUlUsaUJBQWlCO2tHQUFqQixpQkFBaUIsMklDWDlCLDJwQkFvQkEseXVGRGJZLFlBQVksaU9BQUUsZ0JBQWdCOzsyRkFJN0IsaUJBQWlCO2tCQVA3QixTQUFTOytCQUNFLFdBQVcsY0FDVCxJQUFJLFdBQ1AsQ0FBQyxZQUFZLEVBQUUsZ0JBQWdCLENBQUM7OEJBTWhDLE1BQU07c0JBQWQsS0FBSztnQkFDRyxRQUFRO3NCQUFoQixLQUFLO2dCQUNHLE1BQU07c0JBQWQsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IENvbXBvbmVudCwgSW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuaW1wb3J0IHsgT2NCYWRnZUNvbXBvbmVudCB9IGZyb20gJy4uL29jLWJhZGdlL29jLWJhZGdlLmNvbXBvbmVudCc7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ29jLWZpbHRlcicsXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBpbXBvcnRzOiBbQ29tbW9uTW9kdWxlLCBPY0JhZGdlQ29tcG9uZW50XSxcclxuICB0ZW1wbGF0ZVVybDogJy4vb2MtZmlsdGVyLmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybDogJy4vb2MtZmlsdGVyLmNvbXBvbmVudC5zY3NzJ1xyXG59KVxyXG5leHBvcnQgY2xhc3MgT2NGaWx0ZXJDb21wb25lbnQge1xyXG4gIGlzT3BlbjogYm9vbGVhbiA9IGZhbHNlXHJcbiAgQElucHV0KCkgb2NUZXh0OiBzdHJpbmcgPSAnRmlsdHJvcydcclxuICBASW5wdXQoKSBvY0FjdGl2ZTogbnVtYmVyID0gMFxyXG4gIEBJbnB1dCgpIG9jU2lkZTogJ2xlZnQnIHwgJ3JpZ2h0JyA9ICdsZWZ0J1xyXG5cclxuICB0b2dnbGVPcGVuKCkge1xyXG4gICAgdGhpcy5pc09wZW4gPSAhdGhpcy5pc09wZW5cclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cIm9jLWZpbHRlci1yb3dcIiBbbmdDbGFzc109XCJ7XHJcbiAgcmV2ZXJzZTogb2NTaWRlID09PSAncmlnaHQnXHJcbn1cIj5cclxuICA8YnV0dG9uIGNsYXNzPVwib2MtZmlsdGVyLWJ0blwiIChjbGljayk9XCJ0b2dnbGVPcGVuKClcIj5cclxuICAgIDxzcGFuIGNsYXNzPVwibWF0ZXJpYWwtc3ltYm9scy1vdXRsaW5lZCBtZC0xOFwiPmZpbHRlcl9saXN0PC9zcGFuPlxyXG4gICAge3tvY1RleHR9fVxyXG4gICAgPGRpdiBjbGFzcz1cImJhZGdlXCI+XHJcbiAgICAgIDxvYy1iYWRnZSAqbmdJZj1cIm9jQWN0aXZlID4gMFwiIG9jU2l6ZT1cInNtYWxsXCIgb2NDb2xvcj1cInN1Y2Nlc3NcIiBbb2NXYXZlZF09XCJ0cnVlXCI+e3tvY0FjdGl2ZX19PC9vYy1iYWRnZT5cclxuICAgIDwvZGl2PlxyXG4gIDwvYnV0dG9uPlxyXG4gIFxyXG4gIDxkaXYgY2xhc3M9XCJmaWx0ZXItcm93LWNvbnRlbnRcIj5cclxuICAgIDxuZy1jb250ZW50IHNlbGVjdD1cIltyb3ddXCI+PC9uZy1jb250ZW50PlxyXG4gIDwvZGl2PlxyXG4gIFxyXG48L2Rpdj5cclxuPGRpdiAqbmdJZj1cImlzT3BlblwiIGNsYXNzPVwib2MtZmlsdGVyLWNvbnRlbnRcIj5cclxuICA8bmctY29udGVudCBzZWxlY3Q9XCJbYm9keV1cIj5cclxuICA8L25nLWNvbnRlbnQ+XHJcbjwvZGl2PlxyXG4iXX0=
|
|
@@ -6,8 +6,8 @@ export class OcInputComponent {
|
|
|
6
6
|
constructor(el, renderer) {
|
|
7
7
|
this.el = el;
|
|
8
8
|
this.renderer = renderer;
|
|
9
|
-
this.
|
|
10
|
-
this.
|
|
9
|
+
this.ocSize = 'medium';
|
|
10
|
+
this.ocPlaceholder = '';
|
|
11
11
|
this.inputId = `oc-${Math.random()}`;
|
|
12
12
|
}
|
|
13
13
|
ngAfterViewInit() {
|
|
@@ -20,16 +20,16 @@ export class OcInputComponent {
|
|
|
20
20
|
}
|
|
21
21
|
}
|
|
22
22
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcInputComponent, deps: [{ token: i0.ElementRef }, { token: i0.Renderer2 }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
23
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcInputComponent, isStandalone: true, selector: "oc-input", inputs: {
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcInputComponent, isStandalone: true, selector: "oc-input", inputs: { ocError: "ocError", ocSize: "ocSize", ocPlaceholder: "ocPlaceholder" }, ngImport: i0, template: "<div class=\"oc-input-box\" [ngClass]=\"{\r\n 'small': ocSize === 'small',\r\n 'large': ocSize === 'large',\r\n error: !!ocError\r\n}\" [id]=\"inputId\">\r\n <ng-content></ng-content>\r\n <label>{{ocPlaceholder}}</label>\r\n <small\r\n *ngIf=\"ocError\"\r\n class=\"error-msg\"\r\n >{{ocError}}</small>\r\n</div>\r\n", styles: [".oc-input-box{position:relative}.oc-input-box select *{background-color:#f8f9ff}.oc-input-box label{position:absolute;left:0;top:0;padding:.5rem .7rem;font-size:.85rem;color:#8f9596;pointer-events:none;transition:.3s ease;border-radius:.5rem}.oc-input-box input,.oc-input-box textarea,.oc-input-box select{font-size:1rem;border-radius:.7rem;background-color:#f7f7f7;border:1px solid #d1d5db;outline:none;padding:.6rem .9rem;width:100%;transition:.3s ease;color:#1e0832;font-weight:500}.oc-input-box input:focus,.oc-input-box textarea:focus,.oc-input-box select:focus{border:1px solid #00dda3;box-shadow:0 4px 3.2px #00dda314}.oc-input-box input:not(:placeholder-shown)~label,.oc-input-box input:focus~label,.oc-input-box textarea:not(:placeholder-shown)~label,.oc-input-box textarea:focus~label,.oc-input-box select:valid~label,.oc-input-box select:focus~label{transform:translateY(-.82rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#f8f9ff;padding:2px 10px}.error input,.error textarea,.error select{border:1px solid #ed3a3a;box-shadow:0 4px 6.1px #a1000014}.error small,.error label{color:#ed3a3a!important;font-weight:600}.small input,.small textarea,.small select{padding:.3rem .7rem;border-radius:.5rem}.small label{padding:.5rem .7rem}.small input:focus~label,.small input:not(:placeholder-shown)~label,.small textarea:focus~label,.small textarea:not(:placeholder-shown)~label,.small select:focus~label,.small select:valid~label{transform:translateY(-.99rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#fff;padding:2px 10px}.large input,.large textarea,.large select{padding:1rem;border-radius:1rem}.large label{padding:1rem .7rem}.large input:focus~label,.large input:not(:placeholder-shown)~label,.large textarea:focus~label,.large textarea:not(:placeholder-shown)~label,.large select:focus~label,.large select:valid~label{transform:translateY(-.77rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#fff;padding:2px 10px}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }], encapsulation: i0.ViewEncapsulation.None }); }
|
|
24
24
|
}
|
|
25
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcInputComponent, decorators: [{
|
|
26
26
|
type: Component,
|
|
27
|
-
args: [{ selector: 'oc-input', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"oc-input-box\" [ngClass]=\"{\r\n 'small':
|
|
28
|
-
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: {
|
|
27
|
+
args: [{ selector: 'oc-input', standalone: true, imports: [CommonModule], encapsulation: ViewEncapsulation.None, template: "<div class=\"oc-input-box\" [ngClass]=\"{\r\n 'small': ocSize === 'small',\r\n 'large': ocSize === 'large',\r\n error: !!ocError\r\n}\" [id]=\"inputId\">\r\n <ng-content></ng-content>\r\n <label>{{ocPlaceholder}}</label>\r\n <small\r\n *ngIf=\"ocError\"\r\n class=\"error-msg\"\r\n >{{ocError}}</small>\r\n</div>\r\n", styles: [".oc-input-box{position:relative}.oc-input-box select *{background-color:#f8f9ff}.oc-input-box label{position:absolute;left:0;top:0;padding:.5rem .7rem;font-size:.85rem;color:#8f9596;pointer-events:none;transition:.3s ease;border-radius:.5rem}.oc-input-box input,.oc-input-box textarea,.oc-input-box select{font-size:1rem;border-radius:.7rem;background-color:#f7f7f7;border:1px solid #d1d5db;outline:none;padding:.6rem .9rem;width:100%;transition:.3s ease;color:#1e0832;font-weight:500}.oc-input-box input:focus,.oc-input-box textarea:focus,.oc-input-box select:focus{border:1px solid #00dda3;box-shadow:0 4px 3.2px #00dda314}.oc-input-box input:not(:placeholder-shown)~label,.oc-input-box input:focus~label,.oc-input-box textarea:not(:placeholder-shown)~label,.oc-input-box textarea:focus~label,.oc-input-box select:valid~label,.oc-input-box select:focus~label{transform:translateY(-.82rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#f8f9ff;padding:2px 10px}.error input,.error textarea,.error select{border:1px solid #ed3a3a;box-shadow:0 4px 6.1px #a1000014}.error small,.error label{color:#ed3a3a!important;font-weight:600}.small input,.small textarea,.small select{padding:.3rem .7rem;border-radius:.5rem}.small label{padding:.5rem .7rem}.small input:focus~label,.small input:not(:placeholder-shown)~label,.small textarea:focus~label,.small textarea:not(:placeholder-shown)~label,.small select:focus~label,.small select:valid~label{transform:translateY(-.99rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#fff;padding:2px 10px}.large input,.large textarea,.large select{padding:1rem;border-radius:1rem}.large label{padding:1rem .7rem}.large input:focus~label,.large input:not(:placeholder-shown)~label,.large textarea:focus~label,.large textarea:not(:placeholder-shown)~label,.large select:focus~label,.large select:valid~label{transform:translateY(-.77rem) translate(.6rem);color:#7e8485;font-weight:600;background-color:#fff;padding:2px 10px}\n"] }]
|
|
28
|
+
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { ocError: [{
|
|
29
29
|
type: Input
|
|
30
|
-
}],
|
|
30
|
+
}], ocSize: [{
|
|
31
31
|
type: Input
|
|
32
|
-
}],
|
|
32
|
+
}], ocPlaceholder: [{
|
|
33
33
|
type: Input
|
|
34
34
|
}] } });
|
|
35
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
35
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2MtaW5wdXQuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvb3RpbXVzLWxpYnJhcnkvc3JjL2xpYi9jb21wb25lbnRzL29jLWlucHV0L29jLWlucHV0LmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1pbnB1dC9vYy1pbnB1dC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFpQixTQUFTLEVBQWMsS0FBSyxFQUFhLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFVMUcsTUFBTSxPQUFPLGdCQUFnQjtJQU0zQixZQUFvQixFQUFjLEVBQVUsUUFBbUI7UUFBM0MsT0FBRSxHQUFGLEVBQUUsQ0FBWTtRQUFVLGFBQVEsR0FBUixRQUFRLENBQVc7UUFKdEQsV0FBTSxHQUFrQyxRQUFRLENBQUM7UUFDakQsa0JBQWEsR0FBVyxFQUFFLENBQUM7UUFDcEMsWUFBTyxHQUFXLE1BQU0sSUFBSSxDQUFDLE1BQU0sRUFBRSxFQUFFLENBQUM7SUFFMEIsQ0FBQztJQUVuRSxlQUFlO1FBQ2IsTUFBTSxRQUFRLEdBQUcsSUFBSSxDQUFDLEVBQUUsQ0FBQyxhQUFhLENBQUM7UUFFdkMsSUFBSSxRQUFRLEVBQUU7WUFDWixNQUFNLFlBQVksR0FBRyxRQUFRLENBQUMsYUFBYSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1lBRXJELElBQUksWUFBWSxFQUFFO2dCQUNoQixJQUFJLENBQUMsUUFBUSxDQUFDLFlBQVksQ0FBQyxZQUFZLEVBQUUsYUFBYSxFQUFFLEVBQUUsQ0FBQyxDQUFDO2FBQzdEO1NBQ0Y7SUFDSCxDQUFDOzhHQWxCVSxnQkFBZ0I7a0dBQWhCLGdCQUFnQixzSkNYN0IsMlVBWUEsaWdFRE5ZLFlBQVk7OzJGQUtYLGdCQUFnQjtrQkFSNUIsU0FBUzsrQkFDRSxVQUFVLGNBQ1IsSUFBSSxXQUNQLENBQUMsWUFBWSxDQUFDLGlCQUdSLGlCQUFpQixDQUFDLElBQUk7dUdBRzVCLE9BQU87c0JBQWYsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUs7Z0JBQ0csYUFBYTtzQkFBckIsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XHJcbmltcG9ydCB7IEFmdGVyVmlld0luaXQsIENvbXBvbmVudCwgRWxlbWVudFJlZiwgSW5wdXQsIFJlbmRlcmVyMiwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnb2MtaW5wdXQnLFxyXG4gIHN0YW5kYWxvbmU6IHRydWUsXHJcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXHJcbiAgdGVtcGxhdGVVcmw6ICcuL29jLWlucHV0LmNvbXBvbmVudC5odG1sJyxcclxuICBzdHlsZVVybHM6IFsnLi9vYy1pbnB1dC5jb21wb25lbnQuc2NzcyddLFxyXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmVcclxufSlcclxuZXhwb3J0IGNsYXNzIE9jSW5wdXRDb21wb25lbnQgaW1wbGVtZW50cyBBZnRlclZpZXdJbml0IHtcclxuICBASW5wdXQoKSBvY0Vycm9yPzogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIG9jU2l6ZT86ICdzbWFsbCcgfCAnbWVkaXVtJyB8ICdsYXJnZScgPSAnbWVkaXVtJztcclxuICBASW5wdXQoKSBvY1BsYWNlaG9sZGVyOiBzdHJpbmcgPSAnJztcclxuICBpbnB1dElkOiBzdHJpbmcgPSBgb2MtJHtNYXRoLnJhbmRvbSgpfWA7XHJcblxyXG4gIGNvbnN0cnVjdG9yKHByaXZhdGUgZWw6IEVsZW1lbnRSZWYsIHByaXZhdGUgcmVuZGVyZXI6IFJlbmRlcmVyMikge31cclxuXHJcbiAgbmdBZnRlclZpZXdJbml0KCkge1xyXG4gICAgY29uc3QgaW5wdXRCb3ggPSB0aGlzLmVsLm5hdGl2ZUVsZW1lbnQ7XHJcblxyXG4gICAgaWYgKGlucHV0Qm94KSB7XHJcbiAgICAgIGNvbnN0IGlucHV0RWxlbWVudCA9IGlucHV0Qm94LnF1ZXJ5U2VsZWN0b3IoJ2lucHV0Jyk7XHJcblxyXG4gICAgICBpZiAoaW5wdXRFbGVtZW50KSB7XHJcbiAgICAgICAgdGhpcy5yZW5kZXJlci5zZXRBdHRyaWJ1dGUoaW5wdXRFbGVtZW50LCAncGxhY2Vob2xkZXInLCAnJyk7XHJcbiAgICAgIH1cclxuICAgIH1cclxuICB9XHJcbn1cclxuIiwiPGRpdiBjbGFzcz1cIm9jLWlucHV0LWJveFwiIFtuZ0NsYXNzXT1cIntcclxuICAnc21hbGwnOiBvY1NpemUgPT09ICdzbWFsbCcsXHJcbiAgJ2xhcmdlJzogb2NTaXplID09PSAnbGFyZ2UnLFxyXG4gIGVycm9yOiAhIW9jRXJyb3JcclxufVwiIFtpZF09XCJpbnB1dElkXCI+XHJcbiAgPG5nLWNvbnRlbnQ+PC9uZy1jb250ZW50PlxyXG4gIDxsYWJlbD57e29jUGxhY2Vob2xkZXJ9fTwvbGFiZWw+XHJcbiAgPHNtYWxsXHJcbiAgICAqbmdJZj1cIm9jRXJyb3JcIlxyXG4gICAgY2xhc3M9XCJlcnJvci1tc2dcIlxyXG4gID57e29jRXJyb3J9fTwvc21hbGw+XHJcbjwvZGl2PlxyXG4iXX0=
|
|
@@ -2,18 +2,18 @@ import { Component, Input, ViewEncapsulation } from '@angular/core';
|
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
3
|
export class OcKeyValueComponent {
|
|
4
4
|
constructor() {
|
|
5
|
-
this.
|
|
6
|
-
this.
|
|
5
|
+
this.ocKey = '';
|
|
6
|
+
this.ocValue = '';
|
|
7
7
|
}
|
|
8
8
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcKeyValueComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
9
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.5", type: OcKeyValueComponent, isStandalone: true, selector: "oc-key-value", inputs: {
|
|
9
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.0.5", type: OcKeyValueComponent, isStandalone: true, selector: "oc-key-value", inputs: { ocKey: "ocKey", ocValue: "ocValue" }, ngImport: i0, template: "<div class=\"oc-key-value\">\n <!-- \u00CDcone -->\n <ng-content></ng-content>\n <p>\n @if (ocKey) {\n <span>{{ocKey}}:</span>\n }\n {{ocValue}}\n </p>\n</div>", styles: [".oc-key-value{display:flex;align-items:center;gap:.5rem;font-size:1rem}.oc-key-value p{color:#7e8485;font-weight:600}.oc-key-value span{color:#5505a2;font-weight:700}.oc-key-value .material-symbols-outlined{color:#5505a2}\n"], encapsulation: i0.ViewEncapsulation.None }); }
|
|
10
10
|
}
|
|
11
11
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcKeyValueComponent, decorators: [{
|
|
12
12
|
type: Component,
|
|
13
|
-
args: [{ selector: 'oc-key-value', standalone: true, imports: [], encapsulation: ViewEncapsulation.None, template: "<div class=\"oc-key-value\">\n <!-- \u00CDcone -->\n <ng-content></ng-content>\n <p>\n @if (
|
|
14
|
-
}], propDecorators: {
|
|
13
|
+
args: [{ selector: 'oc-key-value', standalone: true, imports: [], encapsulation: ViewEncapsulation.None, template: "<div class=\"oc-key-value\">\n <!-- \u00CDcone -->\n <ng-content></ng-content>\n <p>\n @if (ocKey) {\n <span>{{ocKey}}:</span>\n }\n {{ocValue}}\n </p>\n</div>", styles: [".oc-key-value{display:flex;align-items:center;gap:.5rem;font-size:1rem}.oc-key-value p{color:#7e8485;font-weight:600}.oc-key-value span{color:#5505a2;font-weight:700}.oc-key-value .material-symbols-outlined{color:#5505a2}\n"] }]
|
|
14
|
+
}], propDecorators: { ocKey: [{
|
|
15
15
|
type: Input
|
|
16
|
-
}],
|
|
16
|
+
}], ocValue: [{
|
|
17
17
|
type: Input
|
|
18
18
|
}] } });
|
|
19
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
19
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2Mta2V5LXZhbHVlLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1rZXktdmFsdWUvb2Mta2V5LXZhbHVlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1rZXktdmFsdWUvb2Mta2V5LXZhbHVlLmNvbXBvbmVudC5odG1sIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUFBLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLGlCQUFpQixFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVVwRSxNQUFNLE9BQU8sbUJBQW1CO0lBUmhDO1FBU1csVUFBSyxHQUFXLEVBQUUsQ0FBQTtRQUNsQixZQUFPLEdBQVcsRUFBRSxDQUFBO0tBQzlCOzhHQUhZLG1CQUFtQjtrR0FBbkIsbUJBQW1CLHdIQ1ZoQyxtTEFTTTs7MkZEQ08sbUJBQW1CO2tCQVIvQixTQUFTOytCQUNFLGNBQWMsY0FDWixJQUFJLFdBQ1AsRUFBRSxpQkFHSSxpQkFBaUIsQ0FBQyxJQUFJOzhCQUc1QixLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csT0FBTztzQkFBZixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCwgVmlld0VuY2Fwc3VsYXRpb24gfSBmcm9tICdAYW5ndWxhci9jb3JlJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnb2Mta2V5LXZhbHVlJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW10sXG4gIHRlbXBsYXRlVXJsOiAnLi9vYy1rZXktdmFsdWUuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybDogJy4vb2Mta2V5LXZhbHVlLmNvbXBvbmVudC5zY3NzJyxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZVxufSlcbmV4cG9ydCBjbGFzcyBPY0tleVZhbHVlQ29tcG9uZW50IHtcbiAgQElucHV0KCkgb2NLZXk6IHN0cmluZyA9ICcnXG4gIEBJbnB1dCgpIG9jVmFsdWU6IHN0cmluZyA9ICcnXG59XG4iLCI8ZGl2IGNsYXNzPVwib2Mta2V5LXZhbHVlXCI+XG4gIDwhLS0gw41jb25lIC0tPlxuICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gIDxwPlxuICAgIEBpZiAob2NLZXkpIHtcbiAgICAgIDxzcGFuPnt7b2NLZXl9fTo8L3NwYW4+XG4gICAgfVxuICAgIHt7b2NWYWx1ZX19XG4gIDwvcD5cbjwvZGl2PiJdfQ==
|
|
@@ -4,32 +4,30 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
import * as i1 from "@angular/common";
|
|
5
5
|
export class OcModalComponent {
|
|
6
6
|
constructor() {
|
|
7
|
-
this.
|
|
8
|
-
this.
|
|
7
|
+
this.ocTitle = '';
|
|
8
|
+
this.ocSize = 'medium';
|
|
9
9
|
this.isOpen = false;
|
|
10
|
+
this.closing = false;
|
|
10
11
|
}
|
|
11
|
-
// hasTitleContent: boolean = false
|
|
12
|
-
// @ContentChild('titleContent', { read: ElementRef })
|
|
13
|
-
// titleContent!: ElementRef;
|
|
14
|
-
// ngAfterContentInit() {
|
|
15
|
-
// this.hasTitleContent = !!this.titleContent.nativeElement.innerHTML.trim();
|
|
16
|
-
// console.log(this.hasTitleContent)
|
|
17
|
-
// }
|
|
18
12
|
open() {
|
|
19
13
|
this.isOpen = true;
|
|
20
14
|
}
|
|
21
15
|
close() {
|
|
22
|
-
this.
|
|
16
|
+
this.closing = true;
|
|
17
|
+
setTimeout(() => {
|
|
18
|
+
this.isOpen = false;
|
|
19
|
+
this.closing = false;
|
|
20
|
+
}, 100);
|
|
23
21
|
}
|
|
24
22
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcModalComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
25
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcModalComponent, isStandalone: true, selector: "oc-modal", inputs: {
|
|
23
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.0.5", type: OcModalComponent, isStandalone: true, selector: "oc-modal", inputs: { ocTitle: "ocTitle", ocSize: "ocSize" }, ngImport: i0, template: "<div class=\"oc-modal-bg\" *ngIf=\"isOpen\" [ngClass]=\"{'closing-bg': closing}\">\n <div class=\"oc-modal\" [ngClass]=\"{large: ocSize === 'large', medium: ocSize === 'medium', small: ocSize === 'small', closing: closing}\">\n <header class=\"oc-modal-header\">\n <h3 *ngIf=\"ocTitle.trim().length > 0\">{{ocTitle}}</h3>\n <button (click)=\"close()\" class=\"oc-close-btn\">\n <span class=\"material-symbols-outlined md-18\" title=\"Fechar\">close</span>\n </button>\n </header>\n <div class=\"oc-modal-content\">\n <ng-content></ng-content>\n </div>\n <footer class=\"oc-modal-footer\">\n <ng-content select=\"[footer]\"></ng-content>\n </footer>\n </div>\n</div>", styles: [".oc.button{height:3rem;padding:0 2rem;background-color:#d1d5db;color:#353535;border-radius:.5rem;border:none;font-weight:500;font-size:1rem;transition:.15s ease;display:flex;justify-content:center;align-items:center;gap:.5rem;cursor:pointer}.oc.button.align-left{padding-left:1rem}.oc.button.align-right{padding-right:1rem}.oc.button:hover{filter:brightness(.95)}.oc.button:active{transform:translateY(1.5px)}.oc.button.no-bg{color:#8f9596;background-color:transparent}.oc.button.no-bg:hover{background-color:#f8f9ff}.oc.button.error{background-color:#ed3a3a;color:#f8f9ff}.oc.button.p-1{background-color:#5505a2;color:#f8f9ff}.oc.button.p-2{background-color:#1e0832;color:#f8f9ff}.oc.button.p-3{background-color:#7737b5;color:#f8f9ff}.oc.button.p-4{background-color:#9969c7;color:#f8f9ff}.oc.button.g-1{background-color:#00dda3;color:#1e0832}.oc.button.g-2{background-color:#1ae0ac;color:#1e0832}.oc.button.g-3{background-color:#33e4b5;color:#1e0832}.oc.button.g-4{background-color:#94ffe3;color:#1e0832}.oc.button.gray-1{background-color:#d1d5db;color:#353535}.oc.button.gray-2{background-color:#8f9596;color:#f8f9ff}.oc.button.gray-3{background-color:#7e8485;color:#f8f9ff}.oc.button.gray-4{background-color:#353535;color:#f8f9ff}.oc.button.small{height:2.5rem!important}.oc.button.large{height:3.5rem!important}.oc.button.icon{height:3rem;width:3rem;padding:0}.oc.button.icon.small{width:2.5rem!important;padding:0}.oc.button.icon.large{width:3.5rem!important;padding:0}.oc.button.outlined{background-color:transparent;border:2px solid}.oc.button.outlined.p-1{color:#5505a2}.oc.button.outlined.p-2{color:#1e0832}.oc.button.outlined.p-3{color:#7737b5}.oc.button.outlined.p-4{color:#9969c7}.oc.button.outlined.g-1{color:#00dda3}.oc.button.outlined.g-2{color:#1ae0ac}.oc.button.outlined.g-3{color:#33e4b5}.oc.button.outlined.g-4{color:#94ffe3}.oc.button.outlined.gray-1{color:#8f9596}.oc.button.outlined.gray-2{color:#7e8485}.oc.button.outlined.gray-3{color:#353535}*{box-sizing:border-box}.oc-modal-bg{display:flex;justify-content:center;align-items:center;padding:1rem;background-color:#00000080;position:fixed;top:0;left:0;width:100%;height:100%;z-index:20}.oc-modal{animation:show-up-modal .3s ease;width:100%;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;background-color:#f8f9ff;border-radius:1rem}.oc-modal-footer{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:.5rem}.oc-modal-content{margin:0;padding:0;margin-bottom:2rem;max-height:80vh;overflow-y:auto;overflow-x:hidden}.oc-modal-header{display:flex;align-items:center;justify-content:space-between;padding:0;margin:0;position:sticky;top:0;width:100%}.oc-modal-header h3{margin:0;padding:0;margin-bottom:2rem;font-size:1.5rem;color:#353535}.oc-modal-header .oc-close-btn{margin:0;margin-right:.5rem;padding:0;border:none;background-color:transparent;color:#d1d5db;width:15px;height:15px;border-radius:50%;transition:.15s ease;cursor:pointer;position:absolute;top:0;right:0}.oc-modal-header .oc-close-btn span{transition:.15s ease}.oc-modal-header .oc-close-btn:hover span{color:#8f9596}.small{width:400px}.medium{width:600px}.large{width:800px}.closing{animation:closeModal .15s ease}.closing-bg{transition:.1s ease;opacity:0}@keyframes show-up-modal{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes closeModal{0%{opacity:1}to{opacity:.5;transform:scale(.5)}}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
26
24
|
}
|
|
27
25
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.0.5", ngImport: i0, type: OcModalComponent, decorators: [{
|
|
28
26
|
type: Component,
|
|
29
|
-
args: [{ selector: 'oc-modal', standalone: true, imports: [CommonModule], template: "<div class=\"oc-modal-bg\" *ngIf=\"isOpen\">\n <div class=\"oc-modal\" [ngClass]=\"{large:
|
|
30
|
-
}], propDecorators: {
|
|
27
|
+
args: [{ selector: 'oc-modal', standalone: true, imports: [CommonModule], template: "<div class=\"oc-modal-bg\" *ngIf=\"isOpen\" [ngClass]=\"{'closing-bg': closing}\">\n <div class=\"oc-modal\" [ngClass]=\"{large: ocSize === 'large', medium: ocSize === 'medium', small: ocSize === 'small', closing: closing}\">\n <header class=\"oc-modal-header\">\n <h3 *ngIf=\"ocTitle.trim().length > 0\">{{ocTitle}}</h3>\n <button (click)=\"close()\" class=\"oc-close-btn\">\n <span class=\"material-symbols-outlined md-18\" title=\"Fechar\">close</span>\n </button>\n </header>\n <div class=\"oc-modal-content\">\n <ng-content></ng-content>\n </div>\n <footer class=\"oc-modal-footer\">\n <ng-content select=\"[footer]\"></ng-content>\n </footer>\n </div>\n</div>", styles: [".oc.button{height:3rem;padding:0 2rem;background-color:#d1d5db;color:#353535;border-radius:.5rem;border:none;font-weight:500;font-size:1rem;transition:.15s ease;display:flex;justify-content:center;align-items:center;gap:.5rem;cursor:pointer}.oc.button.align-left{padding-left:1rem}.oc.button.align-right{padding-right:1rem}.oc.button:hover{filter:brightness(.95)}.oc.button:active{transform:translateY(1.5px)}.oc.button.no-bg{color:#8f9596;background-color:transparent}.oc.button.no-bg:hover{background-color:#f8f9ff}.oc.button.error{background-color:#ed3a3a;color:#f8f9ff}.oc.button.p-1{background-color:#5505a2;color:#f8f9ff}.oc.button.p-2{background-color:#1e0832;color:#f8f9ff}.oc.button.p-3{background-color:#7737b5;color:#f8f9ff}.oc.button.p-4{background-color:#9969c7;color:#f8f9ff}.oc.button.g-1{background-color:#00dda3;color:#1e0832}.oc.button.g-2{background-color:#1ae0ac;color:#1e0832}.oc.button.g-3{background-color:#33e4b5;color:#1e0832}.oc.button.g-4{background-color:#94ffe3;color:#1e0832}.oc.button.gray-1{background-color:#d1d5db;color:#353535}.oc.button.gray-2{background-color:#8f9596;color:#f8f9ff}.oc.button.gray-3{background-color:#7e8485;color:#f8f9ff}.oc.button.gray-4{background-color:#353535;color:#f8f9ff}.oc.button.small{height:2.5rem!important}.oc.button.large{height:3.5rem!important}.oc.button.icon{height:3rem;width:3rem;padding:0}.oc.button.icon.small{width:2.5rem!important;padding:0}.oc.button.icon.large{width:3.5rem!important;padding:0}.oc.button.outlined{background-color:transparent;border:2px solid}.oc.button.outlined.p-1{color:#5505a2}.oc.button.outlined.p-2{color:#1e0832}.oc.button.outlined.p-3{color:#7737b5}.oc.button.outlined.p-4{color:#9969c7}.oc.button.outlined.g-1{color:#00dda3}.oc.button.outlined.g-2{color:#1ae0ac}.oc.button.outlined.g-3{color:#33e4b5}.oc.button.outlined.g-4{color:#94ffe3}.oc.button.outlined.gray-1{color:#8f9596}.oc.button.outlined.gray-2{color:#7e8485}.oc.button.outlined.gray-3{color:#353535}*{box-sizing:border-box}.oc-modal-bg{display:flex;justify-content:center;align-items:center;padding:1rem;background-color:#00000080;position:fixed;top:0;left:0;width:100%;height:100%;z-index:20}.oc-modal{animation:show-up-modal .3s ease;width:100%;padding:1rem;display:flex;flex-direction:column;justify-content:space-between;background-color:#f8f9ff;border-radius:1rem}.oc-modal-footer{width:100%;display:flex;justify-content:flex-end;align-items:center;gap:.5rem}.oc-modal-content{margin:0;padding:0;margin-bottom:2rem;max-height:80vh;overflow-y:auto;overflow-x:hidden}.oc-modal-header{display:flex;align-items:center;justify-content:space-between;padding:0;margin:0;position:sticky;top:0;width:100%}.oc-modal-header h3{margin:0;padding:0;margin-bottom:2rem;font-size:1.5rem;color:#353535}.oc-modal-header .oc-close-btn{margin:0;margin-right:.5rem;padding:0;border:none;background-color:transparent;color:#d1d5db;width:15px;height:15px;border-radius:50%;transition:.15s ease;cursor:pointer;position:absolute;top:0;right:0}.oc-modal-header .oc-close-btn span{transition:.15s ease}.oc-modal-header .oc-close-btn:hover span{color:#8f9596}.small{width:400px}.medium{width:600px}.large{width:800px}.closing{animation:closeModal .15s ease}.closing-bg{transition:.1s ease;opacity:0}@keyframes show-up-modal{0%{opacity:.5;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes closeModal{0%{opacity:1}to{opacity:.5;transform:scale(.5)}}\n"] }]
|
|
28
|
+
}], propDecorators: { ocTitle: [{
|
|
31
29
|
type: Input
|
|
32
|
-
}],
|
|
30
|
+
}], ocSize: [{
|
|
33
31
|
type: Input
|
|
34
32
|
}] } });
|
|
35
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
33
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoib2MtbW9kYWwuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvb3RpbXVzLWxpYnJhcnkvc3JjL2xpYi9jb21wb25lbnRzL29jLW1vZGFsL29jLW1vZGFsLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9saWIvY29tcG9uZW50cy9vYy1tb2RhbC9vYy1tb2RhbC5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBNEIsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7QUFTM0UsTUFBTSxPQUFPLGdCQUFnQjtJQVA3QjtRQVFXLFlBQU8sR0FBVyxFQUFFLENBQUE7UUFDcEIsV0FBTSxHQUFnQyxRQUFRLENBQUE7UUFFdkQsV0FBTSxHQUFZLEtBQUssQ0FBQTtRQUV2QixZQUFPLEdBQVksS0FBSyxDQUFBO0tBWXpCO0lBVkMsSUFBSTtRQUNGLElBQUksQ0FBQyxNQUFNLEdBQUcsSUFBSSxDQUFBO0lBQ3BCLENBQUM7SUFDRCxLQUFLO1FBQ0gsSUFBSSxDQUFDLE9BQU8sR0FBRyxJQUFJLENBQUE7UUFDbkIsVUFBVSxDQUFDLEdBQUcsRUFBRTtZQUNkLElBQUksQ0FBQyxNQUFNLEdBQUcsS0FBSyxDQUFBO1lBQ25CLElBQUksQ0FBQyxPQUFPLEdBQUcsS0FBSyxDQUFBO1FBQ3RCLENBQUMsRUFBQyxHQUFHLENBQUMsQ0FBQTtJQUNSLENBQUM7OEdBakJVLGdCQUFnQjtrR0FBaEIsZ0JBQWdCLHNIQ1Y3Qiwrc0JBZU0seTRHRFRNLFlBQVk7OzJGQUlYLGdCQUFnQjtrQkFQNUIsU0FBUzsrQkFDRSxVQUFVLGNBQ1IsSUFBSSxXQUNQLENBQUMsWUFBWSxDQUFDOzhCQUtkLE9BQU87c0JBQWYsS0FBSztnQkFDRyxNQUFNO3NCQUFkLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21tb25Nb2R1bGUgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBDb250ZW50Q2hpbGQsIEVsZW1lbnRSZWYsIElucHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ29jLW1vZGFsJyxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW0NvbW1vbk1vZHVsZV0sXG4gIHRlbXBsYXRlVXJsOiAnLi9vYy1tb2RhbC5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9vYy1tb2RhbC5jb21wb25lbnQuc2Nzcydcbn0pXG5leHBvcnQgY2xhc3MgT2NNb2RhbENvbXBvbmVudCB7XG4gIEBJbnB1dCgpIG9jVGl0bGU6IHN0cmluZyA9ICcnXG4gIEBJbnB1dCgpIG9jU2l6ZTogJ3NtYWxsJyB8ICdtZWRpdW0nIHwnbGFyZ2UnID0gJ21lZGl1bSdcblxuICBpc09wZW46IGJvb2xlYW4gPSBmYWxzZVxuXG4gIGNsb3Npbmc6IGJvb2xlYW4gPSBmYWxzZVxuXG4gIG9wZW4oKSB7XG4gICAgdGhpcy5pc09wZW4gPSB0cnVlXG4gIH1cbiAgY2xvc2UoKSB7XG4gICAgdGhpcy5jbG9zaW5nID0gdHJ1ZVxuICAgIHNldFRpbWVvdXQoKCkgPT4ge1xuICAgICAgdGhpcy5pc09wZW4gPSBmYWxzZVxuICAgICAgdGhpcy5jbG9zaW5nID0gZmFsc2VcbiAgICB9LDEwMClcbiAgfVxufVxuIiwiPGRpdiBjbGFzcz1cIm9jLW1vZGFsLWJnXCIgKm5nSWY9XCJpc09wZW5cIiBbbmdDbGFzc109XCJ7J2Nsb3NpbmctYmcnOiBjbG9zaW5nfVwiPlxuICA8ZGl2IGNsYXNzPVwib2MtbW9kYWxcIiBbbmdDbGFzc109XCJ7bGFyZ2U6IG9jU2l6ZSA9PT0gJ2xhcmdlJywgbWVkaXVtOiBvY1NpemUgPT09ICdtZWRpdW0nLCBzbWFsbDogb2NTaXplID09PSAnc21hbGwnLCBjbG9zaW5nOiBjbG9zaW5nfVwiPlxuICAgIDxoZWFkZXIgY2xhc3M9XCJvYy1tb2RhbC1oZWFkZXJcIj5cbiAgICAgIDxoMyAqbmdJZj1cIm9jVGl0bGUudHJpbSgpLmxlbmd0aCA+IDBcIj57e29jVGl0bGV9fTwvaDM+XG4gICAgICA8YnV0dG9uIChjbGljayk9XCJjbG9zZSgpXCIgY2xhc3M9XCJvYy1jbG9zZS1idG5cIj5cbiAgICAgICAgPHNwYW4gY2xhc3M9XCJtYXRlcmlhbC1zeW1ib2xzLW91dGxpbmVkIG1kLTE4XCIgdGl0bGU9XCJGZWNoYXJcIj5jbG9zZTwvc3Bhbj5cbiAgICAgIDwvYnV0dG9uPlxuICAgIDwvaGVhZGVyPlxuICAgIDxkaXYgY2xhc3M9XCJvYy1tb2RhbC1jb250ZW50XCI+XG4gICAgICA8bmctY29udGVudD48L25nLWNvbnRlbnQ+XG4gICAgPC9kaXY+XG4gICAgPGZvb3RlciBjbGFzcz1cIm9jLW1vZGFsLWZvb3RlclwiPlxuICAgICAgPG5nLWNvbnRlbnQgc2VsZWN0PVwiW2Zvb3Rlcl1cIj48L25nLWNvbnRlbnQ+XG4gICAgPC9mb290ZXI+XG4gIDwvZGl2PlxuPC9kaXY+Il19
|
package/esm2022/public-api.mjs
CHANGED
|
@@ -10,4 +10,5 @@ export * from './lib/directives/oc-tooltip/oc-tooltip.directive';
|
|
|
10
10
|
export * from './lib/components/oc-input/oc-input.component';
|
|
11
11
|
export * from './lib/components/oc-modal/oc-modal.component';
|
|
12
12
|
export * from './lib/components/oc-key-value/oc-key-value.component';
|
|
13
|
-
|
|
13
|
+
export * from './lib/components/oc-chip/oc-chip.component';
|
|
14
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicHVibGljLWFwaS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3Byb2plY3RzL290aW11cy1saWJyYXJ5L3NyYy9wdWJsaWMtYXBpLnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiJBQUNBOztFQUVFO0FBRUYsY0FBYyw4QkFBOEIsQ0FBQTtBQUM1QyxjQUFjLGdDQUFnQyxDQUFBO0FBQzlDLGNBQWMsOENBQThDLENBQUE7QUFDNUQsY0FBYyw4Q0FBOEMsQ0FBQTtBQUM1RCxjQUFjLGdEQUFnRCxDQUFBO0FBQzlELGNBQWMsa0RBQWtELENBQUE7QUFDaEUsY0FBYyw4Q0FBOEMsQ0FBQTtBQUM1RCxjQUFjLDhDQUE4QyxDQUFBO0FBQzVELGNBQWMsc0RBQXNELENBQUE7QUFDcEUsY0FBYyw0Q0FBNEMsQ0FBQSIsInNvdXJjZXNDb250ZW50IjpbIlxyXG4vKlxyXG4qIFB1YmxpYyBBUEkgU3VyZmFjZSBvZiBvdGltdXMtbGlicmFyeVxyXG4qL1xyXG5cclxuZXhwb3J0ICogZnJvbSAnLi9saWIvb3RpbXVzLWxpYnJhcnkuc2VydmljZSdcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvb3RpbXVzLWxpYnJhcnkuY29tcG9uZW50J1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL29jLXRhYmxlL29jLXRhYmxlLmNvbXBvbmVudCdcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9vYy1iYWRnZS9vYy1iYWRnZS5jb21wb25lbnQnXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvb2MtZmlsdGVyL29jLWZpbHRlci5jb21wb25lbnQnXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2RpcmVjdGl2ZXMvb2MtdG9vbHRpcC9vYy10b29sdGlwLmRpcmVjdGl2ZSdcclxuZXhwb3J0ICogZnJvbSAnLi9saWIvY29tcG9uZW50cy9vYy1pbnB1dC9vYy1pbnB1dC5jb21wb25lbnQnXHJcbmV4cG9ydCAqIGZyb20gJy4vbGliL2NvbXBvbmVudHMvb2MtbW9kYWwvb2MtbW9kYWwuY29tcG9uZW50J1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL29jLWtleS12YWx1ZS9vYy1rZXktdmFsdWUuY29tcG9uZW50J1xyXG5leHBvcnQgKiBmcm9tICcuL2xpYi9jb21wb25lbnRzL29jLWNoaXAvb2MtY2hpcC5jb21wb25lbnQnIl19
|