mis-crystal-design-system 14.0.75 → 14.0.76
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/esm2020/input-stepper/input-stepper/input-stepper.component.mjs +29 -15
- package/fesm2015/mis-crystal-design-system-input-stepper.mjs +28 -14
- package/fesm2015/mis-crystal-design-system-input-stepper.mjs.map +1 -1
- package/fesm2020/mis-crystal-design-system-input-stepper.mjs +28 -14
- package/fesm2020/mis-crystal-design-system-input-stepper.mjs.map +1 -1
- package/input-stepper/input-stepper/input-stepper.component.d.ts +5 -1
- package/package.json +1 -1
|
@@ -1,15 +1,25 @@
|
|
|
1
1
|
import { Component, EventEmitter, Input, Output } from '@angular/core';
|
|
2
2
|
import * as i0 from "@angular/core";
|
|
3
|
-
import * as i1 from "@angular/
|
|
3
|
+
import * as i1 from "@angular/platform-browser";
|
|
4
|
+
import * as i2 from "@angular/common";
|
|
4
5
|
const _c0 = function (a0) { return { "max-width": a0 }; };
|
|
5
6
|
const _c1 = function (a0) { return { "disabled": a0 }; };
|
|
6
7
|
export class InputStepperComponent {
|
|
7
|
-
constructor() {
|
|
8
|
+
constructor(sanitizer) {
|
|
9
|
+
this.sanitizer = sanitizer;
|
|
8
10
|
this.value = 1;
|
|
9
11
|
this.width = '200px';
|
|
10
12
|
this.minLimit = 0;
|
|
11
13
|
this.maxLimit = 2;
|
|
12
14
|
this.valueChange = new EventEmitter();
|
|
15
|
+
this.svgMinusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
16
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
17
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 9.11705C3 8.63819 3.3833 8.25 3.85612 8.25H14.1439C14.6167 8.25 15 8.63819 15 9.11705C15 9.59591 14.6167 9.9841 14.1439 9.9841H3.85612C3.3833 9.9841 3 9.59591 3 9.11705Z" fill="#0937B2"/>
|
|
18
|
+
</svg>`);
|
|
19
|
+
this.svgPlusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
20
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
21
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.85677 3.86705C9.85677 3.38819 9.47347 3 9.00066 3C8.52784 3 8.14454 3.38819 8.14454 3.86705V8.13159H3.85612C3.3833 8.13159 3 8.51978 3 8.99864C3 9.4775 3.3833 9.8657 3.85612 9.8657H8.14454V14.1329C8.14454 14.6118 8.52784 15 9.00066 15C9.47347 15 9.85677 14.6118 9.85677 14.1329V9.8657H14.1439C14.6167 9.8657 15 9.4775 15 8.99864C15 8.51978 14.6167 8.13159 14.1439 8.13159H9.85677V3.86705Z" fill="#0937B2"/>
|
|
22
|
+
</svg>`);
|
|
13
23
|
}
|
|
14
24
|
increment() {
|
|
15
25
|
if (this.value === this.maxLimit)
|
|
@@ -35,32 +45,36 @@ export class InputStepperComponent {
|
|
|
35
45
|
this.valueChange.emit(this.value);
|
|
36
46
|
}
|
|
37
47
|
}
|
|
38
|
-
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(); };
|
|
39
|
-
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars:
|
|
48
|
+
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(i0.ɵɵdirectiveInject(i1.DomSanitizer)); };
|
|
49
|
+
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars: 12, consts: [[1, "nudger", 3, "ngStyle"], [3, "ngClass", "click"], [3, "innerHtml"], ["type", "text", "readonly", "", 3, "value", "input"]], template: function InputStepperComponent_Template(rf, ctx) { if (rf & 1) {
|
|
40
50
|
i0.ɵɵelementStart(0, "div", 0)(1, "button", 1);
|
|
41
51
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_1_listener() { return ctx.decrement(); });
|
|
42
|
-
i0.ɵɵ
|
|
52
|
+
i0.ɵɵelement(2, "span", 2);
|
|
43
53
|
i0.ɵɵelementEnd();
|
|
44
|
-
i0.ɵɵelementStart(3, "input",
|
|
54
|
+
i0.ɵɵelementStart(3, "input", 3);
|
|
45
55
|
i0.ɵɵlistener("input", function InputStepperComponent_Template_input_input_3_listener($event) { return ctx.onInputChange($event.target.value); });
|
|
46
56
|
i0.ɵɵelementEnd();
|
|
47
57
|
i0.ɵɵelementStart(4, "button", 1);
|
|
48
58
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_4_listener() { return ctx.increment(); });
|
|
49
|
-
i0.ɵɵ
|
|
59
|
+
i0.ɵɵelement(5, "span", 2);
|
|
50
60
|
i0.ɵɵelementEnd()();
|
|
51
61
|
} if (rf & 2) {
|
|
52
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(
|
|
62
|
+
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(6, _c0, ctx.width));
|
|
63
|
+
i0.ɵɵadvance(1);
|
|
64
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(8, _c1, ctx.value === ctx.minLimit));
|
|
65
|
+
i0.ɵɵadvance(1);
|
|
66
|
+
i0.ɵɵproperty("innerHtml", ctx.svgMinusIcon, i0.ɵɵsanitizeHtml);
|
|
53
67
|
i0.ɵɵadvance(1);
|
|
54
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c1, ctx.value === ctx.minLimit));
|
|
55
|
-
i0.ɵɵadvance(2);
|
|
56
68
|
i0.ɵɵproperty("value", ctx.value);
|
|
57
69
|
i0.ɵɵadvance(1);
|
|
58
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
59
|
-
|
|
70
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(10, _c1, ctx.value === ctx.maxLimit));
|
|
71
|
+
i0.ɵɵadvance(1);
|
|
72
|
+
i0.ɵɵproperty("innerHtml", ctx.svgPlusIcon, i0.ɵɵsanitizeHtml);
|
|
73
|
+
} }, dependencies: [i2.NgClass, i2.NgStyle], styles: [".nudger[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button[_ngcontent-%COMP%]{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button[_ngcontent-%COMP%]:hover{background-color:#fff}input[_ngcontent-%COMP%]{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger[_ngcontent-%COMP%]{max-width:150px}}.disabled[_ngcontent-%COMP%]{opacity:.6;cursor:not-allowed}.nudger[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{display:inline-block;width:18px;height:18px}"] });
|
|
60
74
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InputStepperComponent, [{
|
|
61
75
|
type: Component,
|
|
62
|
-
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\"
|
|
63
|
-
}], function () { return []; }, { value: [{
|
|
76
|
+
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\">\n <span [innerHtml]=\"svgMinusIcon\"></span>\n </button>\n <input type=\"text\" [value]=\"value\" (input)=\"onInputChange($event.target.value)\" readonly>\n <button (click)=\"increment()\" [ngClass]=\"{'disabled': value === maxLimit}\">\n <span [innerHtml]=\"svgPlusIcon\"></span>\n </button>\n</div>\n ", styles: [".nudger{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button:hover{background-color:#fff}input{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger{max-width:150px}}.disabled{opacity:.6;cursor:not-allowed}.nudger span{display:inline-block;width:18px;height:18px}\n"] }]
|
|
77
|
+
}], function () { return [{ type: i1.DomSanitizer }]; }, { value: [{
|
|
64
78
|
type: Input
|
|
65
79
|
}], width: [{
|
|
66
80
|
type: Input
|
|
@@ -71,4 +85,4 @@ InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: Input
|
|
|
71
85
|
}], valueChange: [{
|
|
72
86
|
type: Output
|
|
73
87
|
}] }); })();
|
|
74
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
88
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiaW5wdXQtc3RlcHBlci5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9taXMtY29tcG9uZW50cy9pbnB1dC1zdGVwcGVyL2lucHV0LXN0ZXBwZXIvaW5wdXQtc3RlcHBlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9taXMtY29tcG9uZW50cy9pbnB1dC1zdGVwcGVyL2lucHV0LXN0ZXBwZXIvaW5wdXQtc3RlcHBlci5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFlBQVksRUFBRSxLQUFLLEVBQVUsTUFBTSxFQUFFLE1BQU0sZUFBZSxDQUFDOzs7Ozs7QUFRL0UsTUFBTSxPQUFPLHFCQUFxQjtJQVNoQyxZQUFvQixTQUF1QjtRQUF2QixjQUFTLEdBQVQsU0FBUyxDQUFjO1FBTmxDLFVBQUssR0FBVyxDQUFDLENBQUM7UUFDbEIsVUFBSyxHQUFZLE9BQU8sQ0FBQztRQUN6QixhQUFRLEdBQVksQ0FBQyxDQUFDO1FBQ3RCLGFBQVEsR0FBVyxDQUFDLENBQUM7UUFDcEIsZ0JBQVcsR0FBeUIsSUFBSSxZQUFZLEVBQVUsQ0FBQztRQUd2RSxJQUFJLENBQUMsWUFBWSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsdUJBQXVCLENBQUM7OzthQUdsRCxDQUFDLENBQUM7UUFDWCxJQUFJLENBQUMsV0FBVyxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsdUJBQXVCLENBQUM7OztlQUcvQyxDQUFDLENBQUM7SUFDZCxDQUFDO0lBRUYsU0FBUztRQUNQLElBQUcsSUFBSSxDQUFDLEtBQUssS0FBSyxJQUFJLENBQUMsUUFBUTtZQUFFLE9BQU87UUFDeEMsSUFBSSxDQUFDLEtBQUssRUFBRSxDQUFDO1FBQ2IsSUFBSSxDQUFDLGVBQWUsRUFBRSxDQUFDO0lBQ3pCLENBQUM7SUFFRCxTQUFTO1FBQ1AsSUFBSSxJQUFJLENBQUMsS0FBSyxHQUFHLENBQUMsRUFBRTtZQUNsQixJQUFJLENBQUMsS0FBSyxFQUFFLENBQUM7WUFDYixJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7U0FDeEI7SUFDSCxDQUFDO0lBRUQsYUFBYSxDQUFDLFFBQWdCO1FBQzVCLE1BQU0sV0FBVyxHQUFHLFFBQVEsQ0FBQyxRQUFRLEVBQUUsRUFBRSxDQUFDLENBQUM7UUFDM0MsSUFBSSxDQUFDLEtBQUssQ0FBQyxXQUFXLENBQUMsRUFBRTtZQUN2QixJQUFJLENBQUMsS0FBSyxHQUFHLFdBQVcsQ0FBQztZQUN6QixJQUFJLENBQUMsZUFBZSxFQUFFLENBQUM7U0FDeEI7SUFDSCxDQUFDO0lBRU8sZUFBZTtRQUNyQixPQUFPLENBQUMsR0FBRyxDQUFDLGNBQWMsRUFBRSxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUM7UUFDeEMsSUFBSSxDQUFDLFdBQVcsQ0FBQyxJQUFJLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQyxDQUFDO0lBQ3BDLENBQUM7OzBGQTVDVSxxQkFBcUI7d0VBQXJCLHFCQUFxQjtRQ1JsQyw4QkFBc0QsZ0JBQUE7UUFDMUMsa0dBQVMsZUFBVyxJQUFDO1FBQ3pCLDBCQUF3QztRQUM1QyxpQkFBUztRQUNULGdDQUF5RjtRQUF0RCx1R0FBUyxzQ0FBa0MsSUFBQztRQUEvRSxpQkFBeUY7UUFDekYsaUNBQTJFO1FBQW5FLGtHQUFTLGVBQVcsSUFBQztRQUN6QiwwQkFBdUM7UUFDM0MsaUJBQVMsRUFBQTs7UUFQTywrREFBaUM7UUFDbkIsZUFBNEM7UUFBNUMsZ0ZBQTRDO1FBQ2hFLGVBQTBCO1FBQTFCLCtEQUEwQjtRQUVqQixlQUFlO1FBQWYsaUNBQWU7UUFDSixlQUE0QztRQUE1QyxpRkFBNEM7UUFDaEUsZUFBeUI7UUFBekIsOERBQXlCOzt1RkRFMUIscUJBQXFCO2NBTGpDLFNBQVM7MkJBQ0UsbUJBQW1COytEQU9wQixLQUFLO2tCQUFiLEtBQUs7WUFDRyxLQUFLO2tCQUFiLEtBQUs7WUFDRyxRQUFRO2tCQUFoQixLQUFLO1lBQ0csUUFBUTtrQkFBaEIsS0FBSztZQUNJLFdBQVc7a0JBQXBCLE1BQU0iLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSW5wdXQsIE9uSW5pdCwgT3V0cHV0IH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBEb21TYW5pdGl6ZXIsIFNhZmVIdG1sIH0gZnJvbSAnQGFuZ3VsYXIvcGxhdGZvcm0tYnJvd3Nlcic7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ21pcy1pbnB1dC1zdGVwcGVyJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2lucHV0LXN0ZXBwZXIuY29tcG9uZW50Lmh0bWwnLFxuICBzdHlsZVVybHM6IFsnLi9pbnB1dC1zdGVwcGVyLmNvbXBvbmVudC5jc3MnXVxufSlcbmV4cG9ydCBjbGFzcyBJbnB1dFN0ZXBwZXJDb21wb25lbnQge1xuICBzdmdNaW51c0ljb246IFNhZmVIdG1sO1xuICBzdmdQbHVzSWNvbjogU2FmZUh0bWw7XG4gIEBJbnB1dCgpIHZhbHVlOiBudW1iZXIgPSAxO1xuICBASW5wdXQoKSB3aWR0aD86IHN0cmluZyA9ICcyMDBweCc7XG4gIEBJbnB1dCgpIG1pbkxpbWl0IDogbnVtYmVyID0gMDtcbiAgQElucHV0KCkgbWF4TGltaXQ6IG51bWJlciA9IDI7XG4gIEBPdXRwdXQoKSB2YWx1ZUNoYW5nZTogRXZlbnRFbWl0dGVyPG51bWJlcj4gPSBuZXcgRXZlbnRFbWl0dGVyPG51bWJlcj4oKTtcblxuICBjb25zdHJ1Y3Rvcihwcml2YXRlIHNhbml0aXplcjogRG9tU2FuaXRpemVyKSB7XG4gICAgdGhpcy5zdmdNaW51c0ljb24gPSB0aGlzLnNhbml0aXplci5ieXBhc3NTZWN1cml0eVRydXN0SHRtbChgXG4gICAgICA8c3ZnIHdpZHRoPVwiMThcIiBoZWlnaHQ9XCIxOFwiIHZpZXdCb3g9XCIwIDAgMTggMThcIiBmaWxsPVwibm9uZVwiIHhtbG5zPVwiaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmdcIj5cbiAgICAgICAgPHBhdGggZmlsbC1ydWxlPVwiZXZlbm9kZFwiIGNsaXAtcnVsZT1cImV2ZW5vZGRcIiBkPVwiTTMgOS4xMTcwNUMzIDguNjM4MTkgMy4zODMzIDguMjUgMy44NTYxMiA4LjI1SDE0LjE0MzlDMTQuNjE2NyA4LjI1IDE1IDguNjM4MTkgMTUgOS4xMTcwNUMxNSA5LjU5NTkxIDE0LjYxNjcgOS45ODQxIDE0LjE0MzkgOS45ODQxSDMuODU2MTJDMy4zODMzIDkuOTg0MSAzIDkuNTk1OTEgMyA5LjExNzA1WlwiIGZpbGw9XCIjMDkzN0IyXCIvPlxuICAgICAgPC9zdmc+YCk7XG4gICAgdGhpcy5zdmdQbHVzSWNvbiA9IHRoaXMuc2FuaXRpemVyLmJ5cGFzc1NlY3VyaXR5VHJ1c3RIdG1sKGBcbiAgICAgICAgPHN2ZyB3aWR0aD1cIjE4XCIgaGVpZ2h0PVwiMThcIiB2aWV3Qm94PVwiMCAwIDE4IDE4XCIgZmlsbD1cIm5vbmVcIiB4bWxucz1cImh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnXCI+XG4gICAgICAgICAgPHBhdGggZmlsbC1ydWxlPVwiZXZlbm9kZFwiIGNsaXAtcnVsZT1cImV2ZW5vZGRcIiBkPVwiTTkuODU2NzcgMy44NjcwNUM5Ljg1Njc3IDMuMzg4MTkgOS40NzM0NyAzIDkuMDAwNjYgM0M4LjUyNzg0IDMgOC4xNDQ1NCAzLjM4ODE5IDguMTQ0NTQgMy44NjcwNVY4LjEzMTU5SDMuODU2MTJDMy4zODMzIDguMTMxNTkgMyA4LjUxOTc4IDMgOC45OTg2NEMzIDkuNDc3NSAzLjM4MzMgOS44NjU3IDMuODU2MTIgOS44NjU3SDguMTQ0NTRWMTQuMTMyOUM4LjE0NDU0IDE0LjYxMTggOC41Mjc4NCAxNSA5LjAwMDY2IDE1QzkuNDczNDcgMTUgOS44NTY3NyAxNC42MTE4IDkuODU2NzcgMTQuMTMyOVY5Ljg2NTdIMTQuMTQzOUMxNC42MTY3IDkuODY1NyAxNSA5LjQ3NzUgMTUgOC45OTg2NEMxNSA4LjUxOTc4IDE0LjYxNjcgOC4xMzE1OSAxNC4xNDM5IDguMTMxNTlIOS44NTY3N1YzLjg2NzA1WlwiIGZpbGw9XCIjMDkzN0IyXCIvPlxuICAgICAgICA8L3N2Zz5gKTtcbiAgIH1cblxuICBpbmNyZW1lbnQoKSB7XG4gICAgaWYodGhpcy52YWx1ZSA9PT0gdGhpcy5tYXhMaW1pdCkgcmV0dXJuO1xuICAgIHRoaXMudmFsdWUrKztcbiAgICB0aGlzLmVtaXRWYWx1ZUNoYW5nZSgpO1xuICB9XG5cbiAgZGVjcmVtZW50KCkge1xuICAgIGlmICh0aGlzLnZhbHVlID4gMCkge1xuICAgICAgdGhpcy52YWx1ZS0tO1xuICAgICAgdGhpcy5lbWl0VmFsdWVDaGFuZ2UoKTtcbiAgICB9XG4gIH1cblxuICBvbklucHV0Q2hhbmdlKG5ld1ZhbHVlOiBzdHJpbmcpIHtcbiAgICBjb25zdCBwYXJzZWRWYWx1ZSA9IHBhcnNlSW50KG5ld1ZhbHVlLCAxMCk7XG4gICAgaWYgKCFpc05hTihwYXJzZWRWYWx1ZSkpIHtcbiAgICAgIHRoaXMudmFsdWUgPSBwYXJzZWRWYWx1ZTtcbiAgICAgIHRoaXMuZW1pdFZhbHVlQ2hhbmdlKCk7XG4gICAgfVxuICB9XG5cbiAgcHJpdmF0ZSBlbWl0VmFsdWVDaGFuZ2UoKSB7XG4gICAgY29uc29sZS5sb2coXCJ2YWx1ZSBjaGFuZ2VcIiwgdGhpcy52YWx1ZSk7XG4gICAgdGhpcy52YWx1ZUNoYW5nZS5lbWl0KHRoaXMudmFsdWUpO1xuICB9XG5cbn1cbiIsIjxkaXYgY2xhc3M9XCJudWRnZXJcIiBbbmdTdHlsZV09XCJ7J21heC13aWR0aCc6IHdpZHRoIH1cIj5cbiAgICA8YnV0dG9uIChjbGljayk9XCJkZWNyZW1lbnQoKVwiIFtuZ0NsYXNzXT1cInsnZGlzYWJsZWQnOiB2YWx1ZSA9PT0gbWluTGltaXR9XCI+XG4gICAgICAgIDxzcGFuIFtpbm5lckh0bWxdPVwic3ZnTWludXNJY29uXCI+PC9zcGFuPlxuICAgIDwvYnV0dG9uPlxuICAgIDxpbnB1dCB0eXBlPVwidGV4dFwiIFt2YWx1ZV09XCJ2YWx1ZVwiIChpbnB1dCk9XCJvbklucHV0Q2hhbmdlKCRldmVudC50YXJnZXQudmFsdWUpXCIgcmVhZG9ubHk+XG4gICAgPGJ1dHRvbiAoY2xpY2spPVwiaW5jcmVtZW50KClcIiBbbmdDbGFzc109XCJ7J2Rpc2FibGVkJzogdmFsdWUgPT09IG1heExpbWl0fVwiPlxuICAgICAgICA8c3BhbiBbaW5uZXJIdG1sXT1cInN2Z1BsdXNJY29uXCI+PC9zcGFuPlxuICAgIDwvYnV0dG9uPlxuPC9kaXY+XG4gICJdfQ==
|
|
@@ -1,17 +1,27 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
|
|
3
|
-
import * as i1 from '@angular/
|
|
3
|
+
import * as i1 from '@angular/platform-browser';
|
|
4
|
+
import * as i2 from '@angular/common';
|
|
4
5
|
import { CommonModule } from '@angular/common';
|
|
5
6
|
|
|
6
7
|
const _c0 = function (a0) { return { "max-width": a0 }; };
|
|
7
8
|
const _c1 = function (a0) { return { "disabled": a0 }; };
|
|
8
9
|
class InputStepperComponent {
|
|
9
|
-
constructor() {
|
|
10
|
+
constructor(sanitizer) {
|
|
11
|
+
this.sanitizer = sanitizer;
|
|
10
12
|
this.value = 1;
|
|
11
13
|
this.width = '200px';
|
|
12
14
|
this.minLimit = 0;
|
|
13
15
|
this.maxLimit = 2;
|
|
14
16
|
this.valueChange = new EventEmitter();
|
|
17
|
+
this.svgMinusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
18
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
19
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 9.11705C3 8.63819 3.3833 8.25 3.85612 8.25H14.1439C14.6167 8.25 15 8.63819 15 9.11705C15 9.59591 14.6167 9.9841 14.1439 9.9841H3.85612C3.3833 9.9841 3 9.59591 3 9.11705Z" fill="#0937B2"/>
|
|
20
|
+
</svg>`);
|
|
21
|
+
this.svgPlusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
22
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
23
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.85677 3.86705C9.85677 3.38819 9.47347 3 9.00066 3C8.52784 3 8.14454 3.38819 8.14454 3.86705V8.13159H3.85612C3.3833 8.13159 3 8.51978 3 8.99864C3 9.4775 3.3833 9.8657 3.85612 9.8657H8.14454V14.1329C8.14454 14.6118 8.52784 15 9.00066 15C9.47347 15 9.85677 14.6118 9.85677 14.1329V9.8657H14.1439C14.6167 9.8657 15 9.4775 15 8.99864C15 8.51978 14.6167 8.13159 14.1439 8.13159H9.85677V3.86705Z" fill="#0937B2"/>
|
|
24
|
+
</svg>`);
|
|
15
25
|
}
|
|
16
26
|
increment() {
|
|
17
27
|
if (this.value === this.maxLimit)
|
|
@@ -37,36 +47,40 @@ class InputStepperComponent {
|
|
|
37
47
|
this.valueChange.emit(this.value);
|
|
38
48
|
}
|
|
39
49
|
}
|
|
40
|
-
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(); };
|
|
41
|
-
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars:
|
|
50
|
+
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(i0.ɵɵdirectiveInject(i1.DomSanitizer)); };
|
|
51
|
+
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars: 12, consts: [[1, "nudger", 3, "ngStyle"], [3, "ngClass", "click"], [3, "innerHtml"], ["type", "text", "readonly", "", 3, "value", "input"]], template: function InputStepperComponent_Template(rf, ctx) {
|
|
42
52
|
if (rf & 1) {
|
|
43
53
|
i0.ɵɵelementStart(0, "div", 0)(1, "button", 1);
|
|
44
54
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_1_listener() { return ctx.decrement(); });
|
|
45
|
-
i0.ɵɵ
|
|
55
|
+
i0.ɵɵelement(2, "span", 2);
|
|
46
56
|
i0.ɵɵelementEnd();
|
|
47
|
-
i0.ɵɵelementStart(3, "input",
|
|
57
|
+
i0.ɵɵelementStart(3, "input", 3);
|
|
48
58
|
i0.ɵɵlistener("input", function InputStepperComponent_Template_input_input_3_listener($event) { return ctx.onInputChange($event.target.value); });
|
|
49
59
|
i0.ɵɵelementEnd();
|
|
50
60
|
i0.ɵɵelementStart(4, "button", 1);
|
|
51
61
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_4_listener() { return ctx.increment(); });
|
|
52
|
-
i0.ɵɵ
|
|
62
|
+
i0.ɵɵelement(5, "span", 2);
|
|
53
63
|
i0.ɵɵelementEnd()();
|
|
54
64
|
}
|
|
55
65
|
if (rf & 2) {
|
|
56
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(
|
|
66
|
+
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(6, _c0, ctx.width));
|
|
67
|
+
i0.ɵɵadvance(1);
|
|
68
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(8, _c1, ctx.value === ctx.minLimit));
|
|
69
|
+
i0.ɵɵadvance(1);
|
|
70
|
+
i0.ɵɵproperty("innerHtml", ctx.svgMinusIcon, i0.ɵɵsanitizeHtml);
|
|
57
71
|
i0.ɵɵadvance(1);
|
|
58
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c1, ctx.value === ctx.minLimit));
|
|
59
|
-
i0.ɵɵadvance(2);
|
|
60
72
|
i0.ɵɵproperty("value", ctx.value);
|
|
61
73
|
i0.ɵɵadvance(1);
|
|
62
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
74
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(10, _c1, ctx.value === ctx.maxLimit));
|
|
75
|
+
i0.ɵɵadvance(1);
|
|
76
|
+
i0.ɵɵproperty("innerHtml", ctx.svgPlusIcon, i0.ɵɵsanitizeHtml);
|
|
63
77
|
}
|
|
64
|
-
}, dependencies: [
|
|
78
|
+
}, dependencies: [i2.NgClass, i2.NgStyle], styles: [".nudger[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button[_ngcontent-%COMP%]{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button[_ngcontent-%COMP%]:hover{background-color:#fff}input[_ngcontent-%COMP%]{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger[_ngcontent-%COMP%]{max-width:150px}}.disabled[_ngcontent-%COMP%]{opacity:.6;cursor:not-allowed}.nudger[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{display:inline-block;width:18px;height:18px}"] });
|
|
65
79
|
(function () {
|
|
66
80
|
(typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InputStepperComponent, [{
|
|
67
81
|
type: Component,
|
|
68
|
-
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\"
|
|
69
|
-
}], function () { return []; }, { value: [{
|
|
82
|
+
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\">\n <span [innerHtml]=\"svgMinusIcon\"></span>\n </button>\n <input type=\"text\" [value]=\"value\" (input)=\"onInputChange($event.target.value)\" readonly>\n <button (click)=\"increment()\" [ngClass]=\"{'disabled': value === maxLimit}\">\n <span [innerHtml]=\"svgPlusIcon\"></span>\n </button>\n</div>\n ", styles: [".nudger{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button:hover{background-color:#fff}input{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger{max-width:150px}}.disabled{opacity:.6;cursor:not-allowed}.nudger span{display:inline-block;width:18px;height:18px}\n"] }]
|
|
83
|
+
}], function () { return [{ type: i1.DomSanitizer }]; }, { value: [{
|
|
70
84
|
type: Input
|
|
71
85
|
}], width: [{
|
|
72
86
|
type: Input
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-input-stepper.mjs","sources":["../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.ts","../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.html","../../../projects/mis-components/input-stepper/input-stepper.module.ts","../../../projects/mis-components/input-stepper/mis-crystal-design-system-input-stepper.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'mis-input-stepper',\n templateUrl: './input-stepper.component.html',\n styleUrls: ['./input-stepper.component.css']\n})\nexport class InputStepperComponent {\n @Input() value: number = 1;\n @Input() width?: string = '200px';\n @Input() minLimit : number = 0;\n @Input() maxLimit: number = 2;\n @Output() valueChange: EventEmitter<number> = new EventEmitter<number>();\n\n constructor() { }\n\n increment() {\n if(this.value === this.maxLimit) return;\n this.value++;\n this.emitValueChange();\n }\n\n decrement() {\n if (this.value > 0) {\n this.value--;\n this.emitValueChange();\n }\n }\n\n onInputChange(newValue: string) {\n const parsedValue = parseInt(newValue, 10);\n if (!isNaN(parsedValue)) {\n this.value = parsedValue;\n this.emitValueChange();\n }\n }\n\n private emitValueChange() {\n console.log(\"value change\", this.value);\n this.valueChange.emit(this.value);\n }\n\n}\n","<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\"
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-input-stepper.mjs","sources":["../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.ts","../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.html","../../../projects/mis-components/input-stepper/input-stepper.module.ts","../../../projects/mis-components/input-stepper/mis-crystal-design-system-input-stepper.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\n\n@Component({\n selector: 'mis-input-stepper',\n templateUrl: './input-stepper.component.html',\n styleUrls: ['./input-stepper.component.css']\n})\nexport class InputStepperComponent {\n svgMinusIcon: SafeHtml;\n svgPlusIcon: SafeHtml;\n @Input() value: number = 1;\n @Input() width?: string = '200px';\n @Input() minLimit : number = 0;\n @Input() maxLimit: number = 2;\n @Output() valueChange: EventEmitter<number> = new EventEmitter<number>();\n\n constructor(private sanitizer: DomSanitizer) {\n this.svgMinusIcon = this.sanitizer.bypassSecurityTrustHtml(`\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3 9.11705C3 8.63819 3.3833 8.25 3.85612 8.25H14.1439C14.6167 8.25 15 8.63819 15 9.11705C15 9.59591 14.6167 9.9841 14.1439 9.9841H3.85612C3.3833 9.9841 3 9.59591 3 9.11705Z\" fill=\"#0937B2\"/>\n </svg>`);\n this.svgPlusIcon = this.sanitizer.bypassSecurityTrustHtml(`\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M9.85677 3.86705C9.85677 3.38819 9.47347 3 9.00066 3C8.52784 3 8.14454 3.38819 8.14454 3.86705V8.13159H3.85612C3.3833 8.13159 3 8.51978 3 8.99864C3 9.4775 3.3833 9.8657 3.85612 9.8657H8.14454V14.1329C8.14454 14.6118 8.52784 15 9.00066 15C9.47347 15 9.85677 14.6118 9.85677 14.1329V9.8657H14.1439C14.6167 9.8657 15 9.4775 15 8.99864C15 8.51978 14.6167 8.13159 14.1439 8.13159H9.85677V3.86705Z\" fill=\"#0937B2\"/>\n </svg>`);\n }\n\n increment() {\n if(this.value === this.maxLimit) return;\n this.value++;\n this.emitValueChange();\n }\n\n decrement() {\n if (this.value > 0) {\n this.value--;\n this.emitValueChange();\n }\n }\n\n onInputChange(newValue: string) {\n const parsedValue = parseInt(newValue, 10);\n if (!isNaN(parsedValue)) {\n this.value = parsedValue;\n this.emitValueChange();\n }\n }\n\n private emitValueChange() {\n console.log(\"value change\", this.value);\n this.valueChange.emit(this.value);\n }\n\n}\n","<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\">\n <span [innerHtml]=\"svgMinusIcon\"></span>\n </button>\n <input type=\"text\" [value]=\"value\" (input)=\"onInputChange($event.target.value)\" readonly>\n <button (click)=\"increment()\" [ngClass]=\"{'disabled': value === maxLimit}\">\n <span [innerHtml]=\"svgPlusIcon\"></span>\n </button>\n</div>\n ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { InputStepperComponent } from './input-stepper/input-stepper.component';\n\n\n\n@NgModule({\n declarations: [\n InputStepperComponent\n ],\n imports: [\n CommonModule\n ],\n exports: [\n InputStepperComponent\n ]\n})\nexport class InputStepperModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,17 +1,27 @@
|
|
|
1
1
|
import * as i0 from '@angular/core';
|
|
2
2
|
import { EventEmitter, Component, Input, Output, NgModule } from '@angular/core';
|
|
3
|
-
import * as i1 from '@angular/
|
|
3
|
+
import * as i1 from '@angular/platform-browser';
|
|
4
|
+
import * as i2 from '@angular/common';
|
|
4
5
|
import { CommonModule } from '@angular/common';
|
|
5
6
|
|
|
6
7
|
const _c0 = function (a0) { return { "max-width": a0 }; };
|
|
7
8
|
const _c1 = function (a0) { return { "disabled": a0 }; };
|
|
8
9
|
class InputStepperComponent {
|
|
9
|
-
constructor() {
|
|
10
|
+
constructor(sanitizer) {
|
|
11
|
+
this.sanitizer = sanitizer;
|
|
10
12
|
this.value = 1;
|
|
11
13
|
this.width = '200px';
|
|
12
14
|
this.minLimit = 0;
|
|
13
15
|
this.maxLimit = 2;
|
|
14
16
|
this.valueChange = new EventEmitter();
|
|
17
|
+
this.svgMinusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
18
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
19
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M3 9.11705C3 8.63819 3.3833 8.25 3.85612 8.25H14.1439C14.6167 8.25 15 8.63819 15 9.11705C15 9.59591 14.6167 9.9841 14.1439 9.9841H3.85612C3.3833 9.9841 3 9.59591 3 9.11705Z" fill="#0937B2"/>
|
|
20
|
+
</svg>`);
|
|
21
|
+
this.svgPlusIcon = this.sanitizer.bypassSecurityTrustHtml(`
|
|
22
|
+
<svg width="18" height="18" viewBox="0 0 18 18" fill="none" xmlns="http://www.w3.org/2000/svg">
|
|
23
|
+
<path fill-rule="evenodd" clip-rule="evenodd" d="M9.85677 3.86705C9.85677 3.38819 9.47347 3 9.00066 3C8.52784 3 8.14454 3.38819 8.14454 3.86705V8.13159H3.85612C3.3833 8.13159 3 8.51978 3 8.99864C3 9.4775 3.3833 9.8657 3.85612 9.8657H8.14454V14.1329C8.14454 14.6118 8.52784 15 9.00066 15C9.47347 15 9.85677 14.6118 9.85677 14.1329V9.8657H14.1439C14.6167 9.8657 15 9.4775 15 8.99864C15 8.51978 14.6167 8.13159 14.1439 8.13159H9.85677V3.86705Z" fill="#0937B2"/>
|
|
24
|
+
</svg>`);
|
|
15
25
|
}
|
|
16
26
|
increment() {
|
|
17
27
|
if (this.value === this.maxLimit)
|
|
@@ -37,32 +47,36 @@ class InputStepperComponent {
|
|
|
37
47
|
this.valueChange.emit(this.value);
|
|
38
48
|
}
|
|
39
49
|
}
|
|
40
|
-
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(); };
|
|
41
|
-
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars:
|
|
50
|
+
InputStepperComponent.ɵfac = function InputStepperComponent_Factory(t) { return new (t || InputStepperComponent)(i0.ɵɵdirectiveInject(i1.DomSanitizer)); };
|
|
51
|
+
InputStepperComponent.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: InputStepperComponent, selectors: [["mis-input-stepper"]], inputs: { value: "value", width: "width", minLimit: "minLimit", maxLimit: "maxLimit" }, outputs: { valueChange: "valueChange" }, decls: 6, vars: 12, consts: [[1, "nudger", 3, "ngStyle"], [3, "ngClass", "click"], [3, "innerHtml"], ["type", "text", "readonly", "", 3, "value", "input"]], template: function InputStepperComponent_Template(rf, ctx) { if (rf & 1) {
|
|
42
52
|
i0.ɵɵelementStart(0, "div", 0)(1, "button", 1);
|
|
43
53
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_1_listener() { return ctx.decrement(); });
|
|
44
|
-
i0.ɵɵ
|
|
54
|
+
i0.ɵɵelement(2, "span", 2);
|
|
45
55
|
i0.ɵɵelementEnd();
|
|
46
|
-
i0.ɵɵelementStart(3, "input",
|
|
56
|
+
i0.ɵɵelementStart(3, "input", 3);
|
|
47
57
|
i0.ɵɵlistener("input", function InputStepperComponent_Template_input_input_3_listener($event) { return ctx.onInputChange($event.target.value); });
|
|
48
58
|
i0.ɵɵelementEnd();
|
|
49
59
|
i0.ɵɵelementStart(4, "button", 1);
|
|
50
60
|
i0.ɵɵlistener("click", function InputStepperComponent_Template_button_click_4_listener() { return ctx.increment(); });
|
|
51
|
-
i0.ɵɵ
|
|
61
|
+
i0.ɵɵelement(5, "span", 2);
|
|
52
62
|
i0.ɵɵelementEnd()();
|
|
53
63
|
} if (rf & 2) {
|
|
54
|
-
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(
|
|
64
|
+
i0.ɵɵproperty("ngStyle", i0.ɵɵpureFunction1(6, _c0, ctx.width));
|
|
65
|
+
i0.ɵɵadvance(1);
|
|
66
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(8, _c1, ctx.value === ctx.minLimit));
|
|
67
|
+
i0.ɵɵadvance(1);
|
|
68
|
+
i0.ɵɵproperty("innerHtml", ctx.svgMinusIcon, i0.ɵɵsanitizeHtml);
|
|
55
69
|
i0.ɵɵadvance(1);
|
|
56
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(6, _c1, ctx.value === ctx.minLimit));
|
|
57
|
-
i0.ɵɵadvance(2);
|
|
58
70
|
i0.ɵɵproperty("value", ctx.value);
|
|
59
71
|
i0.ɵɵadvance(1);
|
|
60
|
-
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(
|
|
61
|
-
|
|
72
|
+
i0.ɵɵproperty("ngClass", i0.ɵɵpureFunction1(10, _c1, ctx.value === ctx.maxLimit));
|
|
73
|
+
i0.ɵɵadvance(1);
|
|
74
|
+
i0.ɵɵproperty("innerHtml", ctx.svgPlusIcon, i0.ɵɵsanitizeHtml);
|
|
75
|
+
} }, dependencies: [i2.NgClass, i2.NgStyle], styles: [".nudger[_ngcontent-%COMP%]{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button[_ngcontent-%COMP%]{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button[_ngcontent-%COMP%]:hover{background-color:#fff}input[_ngcontent-%COMP%]{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger[_ngcontent-%COMP%]{max-width:150px}}.disabled[_ngcontent-%COMP%]{opacity:.6;cursor:not-allowed}.nudger[_ngcontent-%COMP%] span[_ngcontent-%COMP%]{display:inline-block;width:18px;height:18px}"] });
|
|
62
76
|
(function () { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(InputStepperComponent, [{
|
|
63
77
|
type: Component,
|
|
64
|
-
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\"
|
|
65
|
-
}], function () { return []; }, { value: [{
|
|
78
|
+
args: [{ selector: 'mis-input-stepper', template: "<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\">\n <span [innerHtml]=\"svgMinusIcon\"></span>\n </button>\n <input type=\"text\" [value]=\"value\" (input)=\"onInputChange($event.target.value)\" readonly>\n <button (click)=\"increment()\" [ngClass]=\"{'disabled': value === maxLimit}\">\n <span [innerHtml]=\"svgPlusIcon\"></span>\n </button>\n</div>\n ", styles: [".nudger{display:flex;align-items:center;justify-content:center;width:100%;border:1px solid #0937B2;border-radius:4px}button{cursor:pointer;border:none;background-color:#fff;transition:background-color .3s;color:#0937b2}button:hover{background-color:#fff}input{width:40%;text-align:center;padding:.5em 1em;color:#0937b2;border:none}@media screen and (max-width: 600px){.nudger{max-width:150px}}.disabled{opacity:.6;cursor:not-allowed}.nudger span{display:inline-block;width:18px;height:18px}\n"] }]
|
|
79
|
+
}], function () { return [{ type: i1.DomSanitizer }]; }, { value: [{
|
|
66
80
|
type: Input
|
|
67
81
|
}], width: [{
|
|
68
82
|
type: Input
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"mis-crystal-design-system-input-stepper.mjs","sources":["../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.ts","../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.html","../../../projects/mis-components/input-stepper/input-stepper.module.ts","../../../projects/mis-components/input-stepper/mis-crystal-design-system-input-stepper.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\n\n@Component({\n selector: 'mis-input-stepper',\n templateUrl: './input-stepper.component.html',\n styleUrls: ['./input-stepper.component.css']\n})\nexport class InputStepperComponent {\n @Input() value: number = 1;\n @Input() width?: string = '200px';\n @Input() minLimit : number = 0;\n @Input() maxLimit: number = 2;\n @Output() valueChange: EventEmitter<number> = new EventEmitter<number>();\n\n constructor() { }\n\n increment() {\n if(this.value === this.maxLimit) return;\n this.value++;\n this.emitValueChange();\n }\n\n decrement() {\n if (this.value > 0) {\n this.value--;\n this.emitValueChange();\n }\n }\n\n onInputChange(newValue: string) {\n const parsedValue = parseInt(newValue, 10);\n if (!isNaN(parsedValue)) {\n this.value = parsedValue;\n this.emitValueChange();\n }\n }\n\n private emitValueChange() {\n console.log(\"value change\", this.value);\n this.valueChange.emit(this.value);\n }\n\n}\n","<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\"
|
|
1
|
+
{"version":3,"file":"mis-crystal-design-system-input-stepper.mjs","sources":["../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.ts","../../../projects/mis-components/input-stepper/input-stepper/input-stepper.component.html","../../../projects/mis-components/input-stepper/input-stepper.module.ts","../../../projects/mis-components/input-stepper/mis-crystal-design-system-input-stepper.ts"],"sourcesContent":["import { Component, EventEmitter, Input, OnInit, Output } from '@angular/core';\nimport { DomSanitizer, SafeHtml } from '@angular/platform-browser';\n\n@Component({\n selector: 'mis-input-stepper',\n templateUrl: './input-stepper.component.html',\n styleUrls: ['./input-stepper.component.css']\n})\nexport class InputStepperComponent {\n svgMinusIcon: SafeHtml;\n svgPlusIcon: SafeHtml;\n @Input() value: number = 1;\n @Input() width?: string = '200px';\n @Input() minLimit : number = 0;\n @Input() maxLimit: number = 2;\n @Output() valueChange: EventEmitter<number> = new EventEmitter<number>();\n\n constructor(private sanitizer: DomSanitizer) {\n this.svgMinusIcon = this.sanitizer.bypassSecurityTrustHtml(`\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M3 9.11705C3 8.63819 3.3833 8.25 3.85612 8.25H14.1439C14.6167 8.25 15 8.63819 15 9.11705C15 9.59591 14.6167 9.9841 14.1439 9.9841H3.85612C3.3833 9.9841 3 9.59591 3 9.11705Z\" fill=\"#0937B2\"/>\n </svg>`);\n this.svgPlusIcon = this.sanitizer.bypassSecurityTrustHtml(`\n <svg width=\"18\" height=\"18\" viewBox=\"0 0 18 18\" fill=\"none\" xmlns=\"http://www.w3.org/2000/svg\">\n <path fill-rule=\"evenodd\" clip-rule=\"evenodd\" d=\"M9.85677 3.86705C9.85677 3.38819 9.47347 3 9.00066 3C8.52784 3 8.14454 3.38819 8.14454 3.86705V8.13159H3.85612C3.3833 8.13159 3 8.51978 3 8.99864C3 9.4775 3.3833 9.8657 3.85612 9.8657H8.14454V14.1329C8.14454 14.6118 8.52784 15 9.00066 15C9.47347 15 9.85677 14.6118 9.85677 14.1329V9.8657H14.1439C14.6167 9.8657 15 9.4775 15 8.99864C15 8.51978 14.6167 8.13159 14.1439 8.13159H9.85677V3.86705Z\" fill=\"#0937B2\"/>\n </svg>`);\n }\n\n increment() {\n if(this.value === this.maxLimit) return;\n this.value++;\n this.emitValueChange();\n }\n\n decrement() {\n if (this.value > 0) {\n this.value--;\n this.emitValueChange();\n }\n }\n\n onInputChange(newValue: string) {\n const parsedValue = parseInt(newValue, 10);\n if (!isNaN(parsedValue)) {\n this.value = parsedValue;\n this.emitValueChange();\n }\n }\n\n private emitValueChange() {\n console.log(\"value change\", this.value);\n this.valueChange.emit(this.value);\n }\n\n}\n","<div class=\"nudger\" [ngStyle]=\"{'max-width': width }\">\n <button (click)=\"decrement()\" [ngClass]=\"{'disabled': value === minLimit}\">\n <span [innerHtml]=\"svgMinusIcon\"></span>\n </button>\n <input type=\"text\" [value]=\"value\" (input)=\"onInputChange($event.target.value)\" readonly>\n <button (click)=\"increment()\" [ngClass]=\"{'disabled': value === maxLimit}\">\n <span [innerHtml]=\"svgPlusIcon\"></span>\n </button>\n</div>\n ","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { InputStepperComponent } from './input-stepper/input-stepper.component';\n\n\n\n@NgModule({\n declarations: [\n InputStepperComponent\n ],\n imports: [\n CommonModule\n ],\n exports: [\n InputStepperComponent\n ]\n})\nexport class InputStepperModule { }\n","/**\n * Generated bundle index. Do not edit.\n */\n\nexport * from './index';\n"],"names":[],"mappings":"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"}
|
|
@@ -1,12 +1,16 @@
|
|
|
1
1
|
import { EventEmitter } from '@angular/core';
|
|
2
|
+
import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
|
|
2
3
|
import * as i0 from "@angular/core";
|
|
3
4
|
export declare class InputStepperComponent {
|
|
5
|
+
private sanitizer;
|
|
6
|
+
svgMinusIcon: SafeHtml;
|
|
7
|
+
svgPlusIcon: SafeHtml;
|
|
4
8
|
value: number;
|
|
5
9
|
width?: string;
|
|
6
10
|
minLimit: number;
|
|
7
11
|
maxLimit: number;
|
|
8
12
|
valueChange: EventEmitter<number>;
|
|
9
|
-
constructor();
|
|
13
|
+
constructor(sanitizer: DomSanitizer);
|
|
10
14
|
increment(): void;
|
|
11
15
|
decrement(): void;
|
|
12
16
|
onInputChange(newValue: string): void;
|