@litigiovirtual/ius-design-components 1.0.167 → 1.0.168
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/simple-card-contador/simple-card-contador.component.mjs +30 -16
- package/fesm2022/litigiovirtual-ius-design-components.mjs +29 -15
- package/fesm2022/litigiovirtual-ius-design-components.mjs.map +1 -1
- package/lib/simple-card-contador/simple-card-contador.component.d.ts +5 -3
- package/package.json +1 -1
|
@@ -4,36 +4,50 @@ import * as i0 from "@angular/core";
|
|
|
4
4
|
export class SimpleCardContadorComponent {
|
|
5
5
|
constructor() {
|
|
6
6
|
this.title = '';
|
|
7
|
-
this.value =
|
|
7
|
+
this.value = 1;
|
|
8
|
+
this.maxValue = 0;
|
|
8
9
|
this.valueChange = new EventEmitter();
|
|
10
|
+
this.errorMaxValue = new EventEmitter();
|
|
9
11
|
}
|
|
10
12
|
step(el, dir) {
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
el.stepDown();
|
|
15
|
-
this.syncAndEmit(el.value);
|
|
13
|
+
const current = Number(el.value) || 1;
|
|
14
|
+
const next = current + dir;
|
|
15
|
+
this.applyLimitsAndEmit(next, el);
|
|
16
16
|
}
|
|
17
|
-
onTyped(
|
|
18
|
-
|
|
17
|
+
onTyped(el) {
|
|
18
|
+
const n = Number(el.value);
|
|
19
|
+
this.applyLimitsAndEmit(n, el);
|
|
19
20
|
}
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
21
|
+
applyLimitsAndEmit(n, el) {
|
|
22
|
+
let value = Number.isNaN(n) ? 1 : n;
|
|
23
|
+
if (value < 1) {
|
|
24
|
+
value = 1;
|
|
25
|
+
}
|
|
26
|
+
if (this.maxValue > 0 && value > this.maxValue) {
|
|
27
|
+
value = this.maxValue;
|
|
28
|
+
this.errorMaxValue.emit('El valor sobrepasa el limite que puedes asignar');
|
|
29
|
+
}
|
|
30
|
+
this.value = value;
|
|
31
|
+
if (el) {
|
|
32
|
+
el.value = String(value);
|
|
33
|
+
}
|
|
34
|
+
this.valueChange.emit(value);
|
|
25
35
|
}
|
|
26
36
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
27
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
37
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value", maxValue: "maxValue" }, outputs: { valueChange: "valueChange", errorMaxValue: "errorMaxValue" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"], dependencies: [{ kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }] }); }
|
|
28
38
|
}
|
|
29
39
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, decorators: [{
|
|
30
40
|
type: Component,
|
|
31
|
-
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
41
|
+
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"] }]
|
|
32
42
|
}], propDecorators: { title: [{
|
|
33
43
|
type: Input
|
|
34
44
|
}], value: [{
|
|
35
45
|
type: Input
|
|
46
|
+
}], maxValue: [{
|
|
47
|
+
type: Input
|
|
36
48
|
}], valueChange: [{
|
|
37
49
|
type: Output
|
|
50
|
+
}], errorMaxValue: [{
|
|
51
|
+
type: Output
|
|
38
52
|
}] } });
|
|
39
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
53
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoic2ltcGxlLWNhcmQtY29udGFkb3IuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvc2ltcGxlLWNhcmQtY29udGFkb3Ivc2ltcGxlLWNhcmQtY29udGFkb3IuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvaXVzLWRlc2lnbi1jb21wb25lbnRzL3NyYy9saWIvc2ltcGxlLWNhcmQtY29udGFkb3Ivc2ltcGxlLWNhcmQtY29udGFkb3IuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsS0FBSyxFQUFFLE1BQU0sRUFBRSxNQUFNLGVBQWUsQ0FBQztBQUN2RSxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sWUFBWSxDQUFDOztBQVU3QyxNQUFNLE9BQU8sMkJBQTJCO0lBUHhDO1FBUVcsVUFBSyxHQUFZLEVBQUUsQ0FBQztRQUNwQixVQUFLLEdBQUcsQ0FBQyxDQUFDO1FBQ1YsYUFBUSxHQUFHLENBQUMsQ0FBQztRQUNaLGdCQUFXLEdBQUcsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUN6QyxrQkFBYSxHQUFHLElBQUksWUFBWSxFQUFVLENBQUM7S0FvQ3REO0lBbENDLElBQUksQ0FBQyxFQUFvQixFQUFFLEdBQVc7UUFDcEMsTUFBTSxPQUFPLEdBQUcsTUFBTSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsSUFBSSxDQUFDLENBQUM7UUFDdEMsTUFBTSxJQUFJLEdBQUcsT0FBTyxHQUFHLEdBQUcsQ0FBQztRQUMzQixJQUFJLENBQUMsa0JBQWtCLENBQUMsSUFBSSxFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBQ3BDLENBQUM7SUFFRCxPQUFPLENBQUMsRUFBb0I7UUFDMUIsTUFBTSxDQUFDLEdBQUcsTUFBTSxDQUFDLEVBQUUsQ0FBQyxLQUFLLENBQUMsQ0FBQztRQUMzQixJQUFJLENBQUMsa0JBQWtCLENBQUMsQ0FBQyxFQUFFLEVBQUUsQ0FBQyxDQUFDO0lBQ2pDLENBQUM7SUFFTyxrQkFBa0IsQ0FBQyxDQUFTLEVBQUUsRUFBcUI7UUFFekQsSUFBSSxLQUFLLEdBQUcsTUFBTSxDQUFDLEtBQUssQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUMsQ0FBQyxDQUFDLENBQUM7UUFFcEMsSUFBSSxLQUFLLEdBQUcsQ0FBQyxFQUFFLENBQUM7WUFDZCxLQUFLLEdBQUcsQ0FBQyxDQUFDO1FBQ1osQ0FBQztRQUVELElBQUksSUFBSSxDQUFDLFFBQVEsR0FBRyxDQUFDLElBQUksS0FBSyxHQUFHLElBQUksQ0FBQyxRQUFRLEVBQUUsQ0FBQztZQUMvQyxLQUFLLEdBQUcsSUFBSSxDQUFDLFFBQVEsQ0FBQztZQUN0QixJQUFJLENBQUMsYUFBYSxDQUFDLElBQUksQ0FBQyxpREFBaUQsQ0FBQyxDQUFBO1FBQzVFLENBQUM7UUFFRCxJQUFJLENBQUMsS0FBSyxHQUFHLEtBQUssQ0FBQztRQUVuQixJQUFJLEVBQUUsRUFBRSxDQUFDO1lBQ1AsRUFBRSxDQUFDLEtBQUssR0FBRyxNQUFNLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDM0IsQ0FBQztRQUVELElBQUksQ0FBQyxXQUFXLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQy9CLENBQUM7K0dBdENVLDJCQUEyQjttR0FBM0IsMkJBQTJCLCtOQ1h4QyxrZ0NBdUNBLDBsR0RoQ1ksZUFBZTs7NEZBSWQsMkJBQTJCO2tCQVB2QyxTQUFTOytCQUNFLDBCQUEwQixjQUN4QixJQUFJLFdBQ1AsQ0FBQyxlQUFlLENBQUM7OEJBS2pCLEtBQUs7c0JBQWIsS0FBSztnQkFDRyxLQUFLO3NCQUFiLEtBQUs7Z0JBQ0csUUFBUTtzQkFBaEIsS0FBSztnQkFDSSxXQUFXO3NCQUFwQixNQUFNO2dCQUNHLGFBQWE7c0JBQXRCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE91dHB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBJY29uWGxDb21wb25lbnQgfSBmcm9tICcuLi9pY29uLXhsJztcclxuXHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2l1cy1zaW1wbGUtY2FyZC1jb250YWRvcicsXHJcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcclxuICBpbXBvcnRzOiBbSWNvblhsQ29tcG9uZW50XSxcclxuICB0ZW1wbGF0ZVVybDogJy4vc2ltcGxlLWNhcmQtY29udGFkb3IuY29tcG9uZW50Lmh0bWwnLFxyXG4gIHN0eWxlVXJsOiAnLi9zaW1wbGUtY2FyZC1jb250YWRvci5jb21wb25lbnQuc2NzcydcclxufSlcclxuZXhwb3J0IGNsYXNzIFNpbXBsZUNhcmRDb250YWRvckNvbXBvbmVudCB7XHJcbiAgQElucHV0KCkgdGl0bGU/OiBzdHJpbmcgPSAnJztcclxuICBASW5wdXQoKSB2YWx1ZSA9IDE7XHJcbiAgQElucHV0KCkgbWF4VmFsdWUgPSAwO1xyXG4gIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZSA9IG5ldyBFdmVudEVtaXR0ZXI8bnVtYmVyPigpO1xyXG4gIEBPdXRwdXQoKSBlcnJvck1heFZhbHVlID0gbmV3IEV2ZW50RW1pdHRlcjxzdHJpbmc+KCk7XHJcblxyXG4gIHN0ZXAoZWw6IEhUTUxJbnB1dEVsZW1lbnQsIGRpcjogMSB8IC0xKSB7XHJcbiAgICBjb25zdCBjdXJyZW50ID0gTnVtYmVyKGVsLnZhbHVlKSB8fCAxO1xyXG4gICAgY29uc3QgbmV4dCA9IGN1cnJlbnQgKyBkaXI7XHJcbiAgICB0aGlzLmFwcGx5TGltaXRzQW5kRW1pdChuZXh0LCBlbCk7XHJcbiAgfVxyXG5cclxuICBvblR5cGVkKGVsOiBIVE1MSW5wdXRFbGVtZW50KSB7XHJcbiAgICBjb25zdCBuID0gTnVtYmVyKGVsLnZhbHVlKTtcclxuICAgIHRoaXMuYXBwbHlMaW1pdHNBbmRFbWl0KG4sIGVsKTtcclxuICB9XHJcblxyXG4gIHByaXZhdGUgYXBwbHlMaW1pdHNBbmRFbWl0KG46IG51bWJlciwgZWw/OiBIVE1MSW5wdXRFbGVtZW50KSB7XHJcblxyXG4gICAgbGV0IHZhbHVlID0gTnVtYmVyLmlzTmFOKG4pID8gMSA6IG47XHJcblxyXG4gICAgaWYgKHZhbHVlIDwgMSkge1xyXG4gICAgICB2YWx1ZSA9IDE7XHJcbiAgICB9XHJcblxyXG4gICAgaWYgKHRoaXMubWF4VmFsdWUgPiAwICYmIHZhbHVlID4gdGhpcy5tYXhWYWx1ZSkge1xyXG4gICAgICB2YWx1ZSA9IHRoaXMubWF4VmFsdWU7XHJcbiAgICAgIHRoaXMuZXJyb3JNYXhWYWx1ZS5lbWl0KCdFbCB2YWxvciBzb2JyZXBhc2EgZWwgbGltaXRlIHF1ZSBwdWVkZXMgYXNpZ25hcicpXHJcbiAgICB9XHJcblxyXG4gICAgdGhpcy52YWx1ZSA9IHZhbHVlO1xyXG5cclxuICAgIGlmIChlbCkge1xyXG4gICAgICBlbC52YWx1ZSA9IFN0cmluZyh2YWx1ZSk7XHJcbiAgICB9XHJcblxyXG4gICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KHZhbHVlKTtcclxuICB9XHJcblxyXG5cclxufVxyXG5cclxuXHJcblxyXG4iLCI8ZGl2IGNsYXNzPVwiZ2VuZXJhbC1jb250YWluZXJcIj5cclxuICA8ZGl2IGNsYXNzPVwiY29udGFpbmVyXCI+XHJcbiAgICA8ZGl2IGNsYXNzPVwibGVmdFwiPlxyXG4gICAgICA8cD57eyB0aXRsZSB9fTwvcD5cclxuICAgIDwvZGl2PlxyXG5cclxuICAgIDxkaXYgY2xhc3M9XCJyaWdodFwiPlxyXG4gICAgICA8ZGl2IGNsYXNzPVwibnVtLXdyYXBwZXJcIj5cclxuICAgICAgICA8aW5wdXRcclxuICAgICAgICAgICNudW1cclxuICAgICAgICAgIHR5cGU9XCJudW1iZXJcIlxyXG4gICAgICAgICAgW3N0ZXBdPVwiMVwiXHJcbiAgICAgICAgICBbbWluXT1cIjFcIlxyXG4gICAgICAgICAgW21heF09XCJtYXhWYWx1ZSA+IDAgPyBtYXhWYWx1ZSA6IG51bGxcIlxyXG4gICAgICAgICAgW3ZhbHVlXT1cInZhbHVlXCJcclxuICAgICAgICAgIChpbnB1dCk9XCJvblR5cGVkKG51bSlcIlxyXG4gICAgICAgICAgKGJsdXIpPVwib25UeXBlZChudW0pXCJcclxuICAgICAgICAvPlxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgIGNsYXNzPVwic3BpbiB1cFwiXHJcbiAgICAgICAgICAoY2xpY2spPVwic3RlcChudW0sICsxKVwiXHJcbiAgICAgICAgPlxyXG4gICAgICAgICAgPGl1cy1pY29uLXhsXHJcbiAgICAgICAgICAgIFtpY29uTmFtZV09XCInaWNvbi1rZXlib2FyZC1hcnJvdy11cCdcIlxyXG4gICAgICAgICAgPjwvaXVzLWljb24teGw+XHJcbiAgICAgICAgPC9idXR0b24+XHJcblxyXG4gICAgICAgIDxidXR0b25cclxuICAgICAgICAgIGNsYXNzPVwic3BpbiBkb3duXCJcclxuICAgICAgICAgIChjbGljayk9XCJzdGVwKG51bSwgLTEpXCJcclxuICAgICAgICA+XHJcbiAgICAgICAgICA8aXVzLWljb24teGxcclxuICAgICAgICAgICAgW2ljb25OYW1lXT1cIidpY29uLWtleWJvYXJkLWFycm93LWRvd24nXCJcclxuICAgICAgICAgID48L2l1cy1pY29uLXhsPlxyXG4gICAgICAgIDwvYnV0dG9uPlxyXG4gICAgICA8L2Rpdj5cclxuICAgIDwvZGl2PlxyXG4gIDwvZGl2PlxyXG48L2Rpdj5cclxuIl19
|
|
@@ -5041,37 +5041,51 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImpo
|
|
|
5041
5041
|
class SimpleCardContadorComponent {
|
|
5042
5042
|
constructor() {
|
|
5043
5043
|
this.title = '';
|
|
5044
|
-
this.value =
|
|
5044
|
+
this.value = 1;
|
|
5045
|
+
this.maxValue = 0;
|
|
5045
5046
|
this.valueChange = new EventEmitter();
|
|
5047
|
+
this.errorMaxValue = new EventEmitter();
|
|
5046
5048
|
}
|
|
5047
5049
|
step(el, dir) {
|
|
5048
|
-
|
|
5049
|
-
|
|
5050
|
-
|
|
5051
|
-
el.stepDown();
|
|
5052
|
-
this.syncAndEmit(el.value);
|
|
5050
|
+
const current = Number(el.value) || 1;
|
|
5051
|
+
const next = current + dir;
|
|
5052
|
+
this.applyLimitsAndEmit(next, el);
|
|
5053
5053
|
}
|
|
5054
|
-
onTyped(
|
|
5055
|
-
|
|
5054
|
+
onTyped(el) {
|
|
5055
|
+
const n = Number(el.value);
|
|
5056
|
+
this.applyLimitsAndEmit(n, el);
|
|
5056
5057
|
}
|
|
5057
|
-
|
|
5058
|
-
|
|
5059
|
-
|
|
5060
|
-
|
|
5061
|
-
|
|
5058
|
+
applyLimitsAndEmit(n, el) {
|
|
5059
|
+
let value = Number.isNaN(n) ? 1 : n;
|
|
5060
|
+
if (value < 1) {
|
|
5061
|
+
value = 1;
|
|
5062
|
+
}
|
|
5063
|
+
if (this.maxValue > 0 && value > this.maxValue) {
|
|
5064
|
+
value = this.maxValue;
|
|
5065
|
+
this.errorMaxValue.emit('El valor sobrepasa el limite que puedes asignar');
|
|
5066
|
+
}
|
|
5067
|
+
this.value = value;
|
|
5068
|
+
if (el) {
|
|
5069
|
+
el.value = String(value);
|
|
5070
|
+
}
|
|
5071
|
+
this.valueChange.emit(value);
|
|
5062
5072
|
}
|
|
5063
5073
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
5064
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value" }, outputs: { valueChange: "valueChange" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
5074
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: SimpleCardContadorComponent, isStandalone: true, selector: "ius-simple-card-contador", inputs: { title: "title", value: "value", maxValue: "maxValue" }, outputs: { valueChange: "valueChange", errorMaxValue: "errorMaxValue" }, ngImport: i0, template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"], dependencies: [{ kind: "component", type: IconXlComponent, selector: "ius-icon-xl", inputs: ["iconName", "color"] }] }); }
|
|
5065
5075
|
}
|
|
5066
5076
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: SimpleCardContadorComponent, decorators: [{
|
|
5067
5077
|
type: Component,
|
|
5068
|
-
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num
|
|
5078
|
+
args: [{ selector: 'ius-simple-card-contador', standalone: true, imports: [IconXlComponent], template: "<div class=\"general-container\">\r\n <div class=\"container\">\r\n <div class=\"left\">\r\n <p>{{ title }}</p>\r\n </div>\r\n\r\n <div class=\"right\">\r\n <div class=\"num-wrapper\">\r\n <input\r\n #num\r\n type=\"number\"\r\n [step]=\"1\"\r\n [min]=\"1\"\r\n [max]=\"maxValue > 0 ? maxValue : null\"\r\n [value]=\"value\"\r\n (input)=\"onTyped(num)\"\r\n (blur)=\"onTyped(num)\"\r\n />\r\n <button\r\n class=\"spin up\"\r\n (click)=\"step(num, +1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-up'\"\r\n ></ius-icon-xl>\r\n </button>\r\n\r\n <button\r\n class=\"spin down\"\r\n (click)=\"step(num, -1)\"\r\n >\r\n <ius-icon-xl\r\n [iconName]=\"'icon-keyboard-arrow-down'\"\r\n ></ius-icon-xl>\r\n </button>\r\n </div>\r\n </div>\r\n </div>\r\n</div>\r\n", 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}.general-container{position:relative}.container{display:flex;padding:4px 4px 4px 12px;align-items:center;gap:0;align-self:stretch;border-radius:8px;border:1px solid #eaeaea;background:#fff;justify-content:space-between}.container .left{display:flex;flex-direction:column;justify-content:center;align-items:flex-start;gap:8px;flex:1 1 auto;min-width:0;width:55%}.container .left p{display:flex;align-items:center;gap:10px;margin:0;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:Rubik;font-size:.875rem;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right{padding:var(--Spacing-Spacing-xs, 8px);display:flex;align-items:center;width:45%}.container .right .num-wrapper{position:relative;display:inline-flex;align-items:center;height:40px;border-radius:14px;background:#f5f5f5;padding:6px 44px 6px 12px}.container .right .num-wrapper input[type=number]{appearance:textfield;-moz-appearance:textfield;-webkit-appearance:none;border:0;outline:0;width:100%;background:transparent;color:#8c8c8c;font-family:Rubik;font-size:.875rem;font-style:normal;font-weight:400;line-height:20px;letter-spacing:.28px}.container .right .num-wrapper input::-webkit-outer-spin-button,.container .right .num-wrapper input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.container .right .num-wrapper .spin{position:absolute;right:8px;width:28px;height:18px;border:0;background:transparent;cursor:pointer;border-radius:6px;display:flex;align-items:center;justify-content:center}.container .right .num-wrapper .up{top:15px}.container .right .num-wrapper .down{bottom:-1px}\n"] }]
|
|
5069
5079
|
}], propDecorators: { title: [{
|
|
5070
5080
|
type: Input
|
|
5071
5081
|
}], value: [{
|
|
5072
5082
|
type: Input
|
|
5083
|
+
}], maxValue: [{
|
|
5084
|
+
type: Input
|
|
5073
5085
|
}], valueChange: [{
|
|
5074
5086
|
type: Output
|
|
5087
|
+
}], errorMaxValue: [{
|
|
5088
|
+
type: Output
|
|
5075
5089
|
}] } });
|
|
5076
5090
|
|
|
5077
5091
|
class SegmentComponent {
|