@omegagrid/form 0.7.6 → 0.7.8
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numericInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,gBAAiB,SAAQ,WAAW,CAAC,MAAM,CAAC;IAExD,MAAM,CAAC,MAAM,
|
|
1
|
+
{"version":3,"file":"numericInput.d.ts","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":"AAGA,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAE5C,qBACa,gBAAiB,SAAQ,WAAW,CAAC,MAAM,CAAC;IAExD,MAAM,CAAC,MAAM,4BA4BV;IAGH,GAAG,EAAE,MAAM,CAAC;IAGZ,GAAG,EAAE,MAAM,CAAC;IAEZ,QAAQ;;IASR,UAAU,GAAI,GAAG,aAAa,UAW7B;IAED,SAAS,GAAI,GAAG,UAAU,UAEzB;IAED,WAAW,CAAC,KAAK,EAAE,MAAM;IASzB,EAAE,aAAkD;IACpD,IAAI,aAAiD;IAErD,MAAM,6CASJ;CAEF"}
|
|
@@ -32,15 +32,14 @@ let FormNumericInput = class FormNumericInput extends BaseControl {
|
|
|
32
32
|
this.up = () => this.updateValue((this.value ?? -1) + 1);
|
|
33
33
|
this.down = () => this.updateValue((this.value ?? 1) - 1);
|
|
34
34
|
this.render = () => html `
|
|
35
|
-
<
|
|
36
|
-
|
|
37
|
-
.
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
</div>
|
|
35
|
+
<og-numericinput
|
|
36
|
+
?buttons="${true}"
|
|
37
|
+
.min="${this.min}"
|
|
38
|
+
.max="${this.max}"
|
|
39
|
+
.value="${this.value}"
|
|
40
|
+
.placeholder="${this.model?.props.placeholder}"
|
|
41
|
+
@change="${this._onChange}">
|
|
42
|
+
</og-numericinput>
|
|
44
43
|
`;
|
|
45
44
|
this.addEventListener('keydown', this._onKeydown);
|
|
46
45
|
}
|
|
@@ -54,19 +53,13 @@ let FormNumericInput = class FormNumericInput extends BaseControl {
|
|
|
54
53
|
}
|
|
55
54
|
};
|
|
56
55
|
FormNumericInput.styles = [...BaseControl.styles, css `
|
|
57
|
-
|
|
56
|
+
og-numericinput {
|
|
58
57
|
border: 1px solid var(--og-accent-color);
|
|
59
58
|
background-color: var(--og-form-background-color);
|
|
60
59
|
color: var(--og-text-color);
|
|
61
|
-
font-size: var(--og-font-size);
|
|
62
60
|
height: ${constants.FORM_CONTROL_HEIGHT}px;
|
|
63
61
|
line-height: ${constants.FORM_CONTROL_HEIGHT}px;
|
|
64
|
-
outline: none;
|
|
65
62
|
width: 100%;
|
|
66
|
-
position: relative;
|
|
67
|
-
text-align: right;
|
|
68
|
-
padding-right: 20px;
|
|
69
|
-
border-radius: var(--og-base-radius);
|
|
70
63
|
}
|
|
71
64
|
|
|
72
65
|
.buttons {
|
|
@@ -79,33 +72,6 @@ FormNumericInput.styles = [...BaseControl.styles, css `
|
|
|
79
72
|
background-color: var(--og-accent-color);
|
|
80
73
|
}
|
|
81
74
|
|
|
82
|
-
.buttons > div {
|
|
83
|
-
color: var(--og-text-color-2);
|
|
84
|
-
position: absolute;
|
|
85
|
-
left: 0;
|
|
86
|
-
right: 0;
|
|
87
|
-
height: 50%;
|
|
88
|
-
overflow: hidden;
|
|
89
|
-
text-align: center;
|
|
90
|
-
line-height: 10px;
|
|
91
|
-
}
|
|
92
|
-
|
|
93
|
-
.buttons > div:hover {
|
|
94
|
-
opacity: 0.5;
|
|
95
|
-
}
|
|
96
|
-
|
|
97
|
-
.buttons > div og-icon {
|
|
98
|
-
height: 100%;
|
|
99
|
-
}
|
|
100
|
-
|
|
101
|
-
#btnUp {
|
|
102
|
-
top: 0;
|
|
103
|
-
}
|
|
104
|
-
|
|
105
|
-
#btnDown {
|
|
106
|
-
bottom: 0;
|
|
107
|
-
}
|
|
108
|
-
|
|
109
75
|
:host {
|
|
110
76
|
position: relative;
|
|
111
77
|
box-sizing: border-box;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"numericInput.js","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,WAAmB;
|
|
1
|
+
{"version":3,"file":"numericInput.js","sourceRoot":"","sources":["../../../src/ui/controls/numericInput.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,SAAS,MAAM,iBAAiB,CAAC;AACxC,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,MAAM,KAAK,CAAC;AAChC,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAC;AAC5D,OAAO,EAAE,WAAW,EAAE,MAAM,eAAe,CAAC;AAGrC,IAAM,gBAAgB,GAAtB,MAAM,gBAAiB,SAAQ,WAAmB;IAsCxD,QAAQ;QACP,KAAK,CAAC,QAAQ,EAAE,CAAC;IAClB,CAAC;IAED;QACC,KAAK,EAAE,CAAC;QAIT,eAAU,GAAG,CAAC,CAAgB,EAAE,EAAE;YACjC,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;gBACf,KAAK,SAAS;oBACb,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,IAAI,CAAC,EAAE,EAAE,CAAC;oBACV,MAAM;gBACP,KAAK,WAAW;oBACf,CAAC,CAAC,cAAc,EAAE,CAAC;oBACnB,IAAI,CAAC,IAAI,EAAE,CAAC;oBACZ,MAAM;YACR,CAAC;QACF,CAAC,CAAA;QAED,cAAS,GAAG,CAAC,CAAa,EAAE,EAAE;YAC7B,IAAI,CAAC,WAAW,CAAC,UAAU,CAAE,CAAC,CAAC,MAA2B,CAAC,KAAK,CAAC,CAAC,CAAC;QACpE,CAAC,CAAA;QAWD,OAAE,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QACpD,SAAI,GAAG,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,KAAK,IAAI,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC;QAErD,WAAM,GAAG,GAAG,EAAE,CAAC,IAAI,CAAA;;eAEL,IAAI;WACR,IAAI,CAAC,GAAG;WACR,IAAI,CAAC,GAAG;aACN,IAAI,CAAC,KAAK;mBACJ,IAAI,CAAC,KAAK,EAAE,KAAK,CAAC,WAAW;cAClC,IAAI,CAAC,SAAS;;EAE1B,CAAC;QAzCD,IAAI,CAAC,gBAAgB,CAAC,SAAS,EAAE,IAAI,CAAC,UAAU,CAAC,CAAC;IACnD,CAAC;IAmBD,WAAW,CAAC,KAAa;QACxB,IAAI,KAAK,IAAI,IAAI,EAAE,CAAC;YACnB,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;YAC5D,KAAK,GAAG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,KAAK,EAAE,IAAI,CAAC,GAAG,CAAC,CAAC;QAC7D,CAAC;QACD,KAAK,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;QACzB,IAAI,CAAC,aAAa,EAAE,CAAC;IACtB,CAAC;;AArEM,uBAAM,GAAG,CAAC,GAAG,WAAW,CAAC,MAAM,EAAE,GAAG,CAAA;;;;;aAK/B,SAAS,CAAC,mBAAmB;kBACxB,SAAS,CAAC,mBAAmB;;;;;;;;;;;;;;;;;;;;;;EAsB7C,CAAC,AA5BW,CA4BV;AAGH;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AAGZ;IADC,QAAQ,CAAC,EAAC,IAAI,EAAE,MAAM,EAAC,CAAC;6CACb;AApCA,gBAAgB;IAD5B,aAAa,CAAC,sBAAsB,CAAC;GACzB,gBAAgB,CAuF5B","sourcesContent":["import constants from \"../../constants\";\nimport { css, html } from \"lit\";\nimport { customElement, property } from \"lit/decorators.js\";\nimport { BaseControl } from \"./baseControl\";\n\n@customElement('og-form-numericinput')\nexport class FormNumericInput extends BaseControl<number> {\n\n\tstatic styles = [...BaseControl.styles, css`\n\t\tog-numericinput {\n\t\t\tborder: 1px solid var(--og-accent-color);\n\t\t\tbackground-color: var(--og-form-background-color);\n\t\t\tcolor: var(--og-text-color);\n\t\t\theight: ${constants.FORM_CONTROL_HEIGHT}px;\n\t\t\tline-height: ${constants.FORM_CONTROL_HEIGHT}px;\n\t\t\twidth: 100%;\n\t\t}\n\n\t\t.buttons {\n\t\t\tdisplay: none;\n\t\t\tposition: absolute;\n\t\t\ttop: 0;\n\t\t\tright: 0;\n\t\t\tbottom: 0;\n\t\t\twidth: 15px;\n\t\t\tbackground-color: var(--og-accent-color);\n\t\t}\n\n\t\t:host {\n\t\t\tposition: relative;\n\t\t\tbox-sizing: border-box;\n\t\t}\n\n\t\t:host(:hover) .buttons {\n\t\t\tdisplay: block;\n\t\t}\n\t`];\n\n\t@property({type: Number})\n\tmin: number;\n\n\t@property({type: Number})\n\tmax: number;\n\n\tvalidate() {\n\t\tsuper.validate();\n\t}\n\n\tconstructor() {\n\t\tsuper();\n\t\tthis.addEventListener('keydown', this._onKeydown);\n\t}\n\n\t_onKeydown = (e: KeyboardEvent) => {\n\t\tswitch (e.key) {\n\t\t\tcase 'ArrowUp':\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.up();\n\t\t\t\tbreak;\n\t\t\tcase 'ArrowDown':\n\t\t\t\te.preventDefault();\n\t\t\t\tthis.down();\n\t\t\t\tbreak;\n\t\t}\n\t}\n\n\t_onChange = (e: InputEvent) => {\n\t\tthis.updateValue(parseFloat((e.target as HTMLInputElement).value));\n\t}\n\n\tupdateValue(value: number) {\n\t\tif (value != null) {\n\t\t\tvalue = isNaN(this.min) ? value : Math.max(value, this.min);\n\t\t\tvalue = isNaN(this.max) ? value : Math.min(value, this.max);\n\t\t}\n\t\tsuper.updateValue(value);\n\t\tthis.requestUpdate();\n\t}\n\n\tup = () => this.updateValue((this.value ?? -1) + 1);\n\tdown = () => this.updateValue((this.value ?? 1) - 1);\n\n\trender = () => html`\n\t\t<og-numericinput\n\t\t\t?buttons=\"${true}\"\n\t\t\t.min=\"${this.min}\"\n\t\t\t.max=\"${this.max}\"\n\t\t\t.value=\"${this.value}\"\n\t\t\t.placeholder=\"${this.model?.props.placeholder}\"\n\t\t\t@change=\"${this._onChange}\">\n\t\t</og-numericinput>\n\t`;\n\t\n}"]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@omegagrid/form",
|
|
3
|
-
"version": "0.7.
|
|
3
|
+
"version": "0.7.8",
|
|
4
4
|
"license": "UNLICENSED",
|
|
5
5
|
"description": "Universal form component",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -27,10 +27,10 @@
|
|
|
27
27
|
"_prepublish": "yarn test && yarn lint"
|
|
28
28
|
},
|
|
29
29
|
"dependencies": {
|
|
30
|
-
"@omegagrid/calendar": "^0.7.
|
|
31
|
-
"@omegagrid/core": "^0.7.
|
|
32
|
-
"@omegagrid/localize": "^0.7.
|
|
33
|
-
"@omegagrid/tree": "^0.7.
|
|
30
|
+
"@omegagrid/calendar": "^0.7.8",
|
|
31
|
+
"@omegagrid/core": "^0.7.8",
|
|
32
|
+
"@omegagrid/localize": "^0.7.8",
|
|
33
|
+
"@omegagrid/tree": "^0.7.8",
|
|
34
34
|
"lit": "^3.1.1",
|
|
35
35
|
"lit-html": "^3.1.1",
|
|
36
36
|
"ts-debounce": "^4.0.0"
|