@panneau/field-number 4.0.39 → 4.0.40-alpha.1
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/dist/index.js +232 -99
- package/package.json +6 -6
package/dist/index.js
CHANGED
|
@@ -1,129 +1,262 @@
|
|
|
1
|
-
import
|
|
2
|
-
import _defineProperty from '@babel/runtime/helpers/defineProperty';
|
|
3
|
-
import _slicedToArray from '@babel/runtime/helpers/slicedToArray';
|
|
4
|
-
import _objectWithoutProperties from '@babel/runtime/helpers/objectWithoutProperties';
|
|
1
|
+
import { c } from 'react/compiler-runtime';
|
|
5
2
|
import classNames from 'classnames';
|
|
6
3
|
import isNaN from 'lodash/isNaN';
|
|
7
4
|
import isNumber from 'lodash/isNumber';
|
|
8
|
-
import {
|
|
5
|
+
import { useState } from 'react';
|
|
9
6
|
import Icon from '@panneau/element-icon';
|
|
10
7
|
import TextField from '@panneau/field-text';
|
|
11
|
-
import {
|
|
8
|
+
import { jsx, jsxs } from 'react/jsx-runtime';
|
|
12
9
|
|
|
13
10
|
var styles = {"container":"panneau-field-number-container","arrow":"panneau-field-number-arrow","dataListItems":"panneau-field-number-dataListItems","dataListItem":"panneau-field-number-dataListItem","dataListItemButton":"panneau-field-number-dataListItemButton"};
|
|
14
11
|
|
|
15
|
-
var _excluded = ["value", "step", "floatStep", "float", "dataList", "autoComplete", "disabled", "className", "onChange"];
|
|
16
12
|
function isNumeric(str) {
|
|
17
13
|
if (typeof str !== 'string') return false; // we only process strings!
|
|
18
14
|
return !isNaN(str) &&
|
|
19
15
|
// use type coercion to parse the _entirety_ of the string (`parseFloat` alone does not do this)...
|
|
20
16
|
!isNaN(parseFloat(str));
|
|
21
17
|
}
|
|
22
|
-
function NumberField(
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
18
|
+
function NumberField(t0) {
|
|
19
|
+
const $ = c(52);
|
|
20
|
+
let props;
|
|
21
|
+
let t1;
|
|
22
|
+
let t2;
|
|
23
|
+
let t3;
|
|
24
|
+
let t4;
|
|
25
|
+
let t5;
|
|
26
|
+
let t6;
|
|
27
|
+
let t7;
|
|
28
|
+
let t8;
|
|
29
|
+
let t9;
|
|
30
|
+
if ($[0] !== t0) {
|
|
31
|
+
({
|
|
32
|
+
value: t1,
|
|
33
|
+
step: t2,
|
|
34
|
+
floatStep: t3,
|
|
35
|
+
float: t4,
|
|
36
|
+
dataList: t5,
|
|
37
|
+
autoComplete: t6,
|
|
38
|
+
disabled: t7,
|
|
39
|
+
className: t8,
|
|
40
|
+
onChange: t9,
|
|
41
|
+
...props
|
|
42
|
+
} = t0);
|
|
43
|
+
$[0] = t0;
|
|
44
|
+
$[1] = props;
|
|
45
|
+
$[2] = t1;
|
|
46
|
+
$[3] = t2;
|
|
47
|
+
$[4] = t3;
|
|
48
|
+
$[5] = t4;
|
|
49
|
+
$[6] = t5;
|
|
50
|
+
$[7] = t6;
|
|
51
|
+
$[8] = t7;
|
|
52
|
+
$[9] = t8;
|
|
53
|
+
$[10] = t9;
|
|
54
|
+
} else {
|
|
55
|
+
props = $[1];
|
|
56
|
+
t1 = $[2];
|
|
57
|
+
t2 = $[3];
|
|
58
|
+
t3 = $[4];
|
|
59
|
+
t4 = $[5];
|
|
60
|
+
t5 = $[6];
|
|
61
|
+
t6 = $[7];
|
|
62
|
+
t7 = $[8];
|
|
63
|
+
t8 = $[9];
|
|
64
|
+
t9 = $[10];
|
|
65
|
+
}
|
|
66
|
+
const value = t1 === undefined ? null : t1;
|
|
67
|
+
const step = t2 === undefined ? 1 : t2;
|
|
68
|
+
const floatStep = t3 === undefined ? 0.1 : t3;
|
|
69
|
+
const float = t4 === undefined ? false : t4;
|
|
70
|
+
const dataList = t5 === undefined ? null : t5;
|
|
71
|
+
const autoComplete = t6 === undefined ? false : t6;
|
|
72
|
+
const disabled = t7 === undefined ? false : t7;
|
|
73
|
+
const className = t8 === undefined ? null : t8;
|
|
74
|
+
const onChange = t9 === undefined ? null : t9;
|
|
75
|
+
let t10;
|
|
76
|
+
if ($[11] !== float) {
|
|
77
|
+
t10 = newValue => {
|
|
78
|
+
if (newValue !== null) {
|
|
79
|
+
if (float) {
|
|
80
|
+
return newValue;
|
|
81
|
+
}
|
|
82
|
+
if (isNumber(newValue)) {
|
|
83
|
+
return newValue;
|
|
84
|
+
}
|
|
85
|
+
if (isNumeric(newValue)) {
|
|
86
|
+
return float ? parseFloat(newValue) : parseInt(newValue, 10);
|
|
87
|
+
}
|
|
46
88
|
}
|
|
47
|
-
|
|
48
|
-
|
|
89
|
+
return null;
|
|
90
|
+
};
|
|
91
|
+
$[11] = float;
|
|
92
|
+
$[12] = t10;
|
|
93
|
+
} else {
|
|
94
|
+
t10 = $[12];
|
|
95
|
+
}
|
|
96
|
+
const parseValue = t10;
|
|
97
|
+
let t11;
|
|
98
|
+
if ($[13] !== float || $[14] !== onChange || $[15] !== parseValue) {
|
|
99
|
+
t11 = val => {
|
|
100
|
+
if (onChange !== null) {
|
|
101
|
+
if (float) {
|
|
102
|
+
onChange(val !== null && val.length > 0 ? val : null);
|
|
103
|
+
} else {
|
|
104
|
+
onChange(val !== null && val.length > 0 ? parseValue(val) : null);
|
|
105
|
+
}
|
|
106
|
+
onChange(val !== null && val.length > 0 ? parseValue(val) : null);
|
|
49
107
|
}
|
|
50
|
-
|
|
51
|
-
|
|
108
|
+
};
|
|
109
|
+
$[13] = float;
|
|
110
|
+
$[14] = onChange;
|
|
111
|
+
$[15] = parseValue;
|
|
112
|
+
$[16] = t11;
|
|
113
|
+
} else {
|
|
114
|
+
t11 = $[16];
|
|
115
|
+
}
|
|
116
|
+
const onInputChange = t11;
|
|
117
|
+
const hasDataList = dataList !== null;
|
|
118
|
+
const [dataListActive, setDataListActive] = useState(false);
|
|
119
|
+
let t12;
|
|
120
|
+
if ($[17] !== hasDataList) {
|
|
121
|
+
t12 = () => {
|
|
122
|
+
if (hasDataList) {
|
|
123
|
+
setDataListActive(true);
|
|
52
124
|
}
|
|
53
|
-
}
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
125
|
+
};
|
|
126
|
+
$[17] = hasDataList;
|
|
127
|
+
$[18] = t12;
|
|
128
|
+
} else {
|
|
129
|
+
t12 = $[18];
|
|
130
|
+
}
|
|
131
|
+
const onInputFocus = t12;
|
|
132
|
+
let t13;
|
|
133
|
+
if ($[19] !== dataListActive || $[20] !== hasDataList) {
|
|
134
|
+
t13 = () => {
|
|
135
|
+
if (hasDataList && dataListActive) {
|
|
136
|
+
setDataListActive(false);
|
|
62
137
|
}
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
138
|
+
};
|
|
139
|
+
$[19] = dataListActive;
|
|
140
|
+
$[20] = hasDataList;
|
|
141
|
+
$[21] = t13;
|
|
142
|
+
} else {
|
|
143
|
+
t13 = $[21];
|
|
144
|
+
}
|
|
145
|
+
const onInputBlur = t13;
|
|
146
|
+
let t14;
|
|
147
|
+
if ($[22] !== onChange || $[23] !== parseValue) {
|
|
148
|
+
t14 = dataListValue => {
|
|
149
|
+
if (onChange !== null && dataListValue !== null) {
|
|
150
|
+
onChange(parseValue(dataListValue));
|
|
151
|
+
setDataListActive(false);
|
|
152
|
+
}
|
|
153
|
+
};
|
|
154
|
+
$[22] = onChange;
|
|
155
|
+
$[23] = parseValue;
|
|
156
|
+
$[24] = t14;
|
|
157
|
+
} else {
|
|
158
|
+
t14 = $[24];
|
|
159
|
+
}
|
|
160
|
+
const onDataListClick = t14;
|
|
161
|
+
const t15 = className !== null;
|
|
162
|
+
let t16;
|
|
163
|
+
if ($[25] !== className || $[26] !== t15) {
|
|
164
|
+
t16 = classNames([styles.container, {
|
|
165
|
+
[className]: t15
|
|
166
|
+
}]);
|
|
167
|
+
$[25] = className;
|
|
168
|
+
$[26] = t15;
|
|
169
|
+
$[27] = t16;
|
|
170
|
+
} else {
|
|
171
|
+
t16 = $[27];
|
|
172
|
+
}
|
|
173
|
+
const t17 = value !== null ? `${value}` : "";
|
|
174
|
+
const t18 = float ? floatStep : step;
|
|
175
|
+
const t19 = autoComplete ? "on" : "off";
|
|
176
|
+
let t20;
|
|
177
|
+
if ($[28] !== disabled || $[29] !== onInputBlur || $[30] !== onInputChange || $[31] !== onInputFocus || $[32] !== props || $[33] !== t17 || $[34] !== t18 || $[35] !== t19) {
|
|
178
|
+
t20 = /*#__PURE__*/jsx(TextField, {
|
|
93
179
|
type: "number",
|
|
94
180
|
className: styles.input,
|
|
95
|
-
value:
|
|
96
|
-
step:
|
|
97
|
-
autoComplete:
|
|
181
|
+
value: t17,
|
|
182
|
+
step: t18,
|
|
183
|
+
autoComplete: t19,
|
|
98
184
|
onChange: onInputChange,
|
|
99
185
|
onFocus: onInputFocus,
|
|
100
186
|
onBlur: onInputBlur,
|
|
101
|
-
disabled: disabled
|
|
102
|
-
|
|
187
|
+
disabled: disabled,
|
|
188
|
+
...props
|
|
189
|
+
});
|
|
190
|
+
$[28] = disabled;
|
|
191
|
+
$[29] = onInputBlur;
|
|
192
|
+
$[30] = onInputChange;
|
|
193
|
+
$[31] = onInputFocus;
|
|
194
|
+
$[32] = props;
|
|
195
|
+
$[33] = t17;
|
|
196
|
+
$[34] = t18;
|
|
197
|
+
$[35] = t19;
|
|
198
|
+
$[36] = t20;
|
|
199
|
+
} else {
|
|
200
|
+
t20 = $[36];
|
|
201
|
+
}
|
|
202
|
+
let t21;
|
|
203
|
+
if ($[37] !== dataListActive || $[38] !== disabled || $[39] !== hasDataList) {
|
|
204
|
+
t21 = !disabled && hasDataList ? /*#__PURE__*/jsx("div", {
|
|
103
205
|
className: styles.arrow,
|
|
104
206
|
children: /*#__PURE__*/jsx(Icon, {
|
|
105
|
-
name: dataListActive ?
|
|
207
|
+
name: dataListActive ? "caret-up" : "caret-down"
|
|
106
208
|
})
|
|
107
|
-
}) : null
|
|
209
|
+
}) : null;
|
|
210
|
+
$[37] = dataListActive;
|
|
211
|
+
$[38] = disabled;
|
|
212
|
+
$[39] = hasDataList;
|
|
213
|
+
$[40] = t21;
|
|
214
|
+
} else {
|
|
215
|
+
t21 = $[40];
|
|
216
|
+
}
|
|
217
|
+
let t22;
|
|
218
|
+
if ($[41] !== dataList || $[42] !== dataListActive || $[43] !== disabled || $[44] !== hasDataList || $[45] !== onDataListClick) {
|
|
219
|
+
t22 = !disabled && hasDataList && dataListActive ? /*#__PURE__*/jsx("ul", {
|
|
108
220
|
className: styles.dataListItems,
|
|
109
|
-
children: dataList.map(
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
221
|
+
children: dataList.map(dataListValue_0 => /*#__PURE__*/jsx("li", {
|
|
222
|
+
className: styles.dataListItem,
|
|
223
|
+
children: /*#__PURE__*/jsx("button", {
|
|
224
|
+
className: styles.dataListItemButton,
|
|
225
|
+
type: "button",
|
|
226
|
+
onTouchStart: () => {
|
|
227
|
+
onDataListClick(dataListValue_0);
|
|
228
|
+
},
|
|
229
|
+
onMouseDown: () => {
|
|
230
|
+
onDataListClick(dataListValue_0);
|
|
231
|
+
},
|
|
232
|
+
children: dataListValue_0
|
|
233
|
+
})
|
|
234
|
+
}, `data-list-${dataListValue_0}`))
|
|
235
|
+
}) : null;
|
|
236
|
+
$[41] = dataList;
|
|
237
|
+
$[42] = dataListActive;
|
|
238
|
+
$[43] = disabled;
|
|
239
|
+
$[44] = hasDataList;
|
|
240
|
+
$[45] = onDataListClick;
|
|
241
|
+
$[46] = t22;
|
|
242
|
+
} else {
|
|
243
|
+
t22 = $[46];
|
|
244
|
+
}
|
|
245
|
+
let t23;
|
|
246
|
+
if ($[47] !== t16 || $[48] !== t20 || $[49] !== t21 || $[50] !== t22) {
|
|
247
|
+
t23 = /*#__PURE__*/jsxs("div", {
|
|
248
|
+
className: t16,
|
|
249
|
+
children: [t20, t21, t22]
|
|
250
|
+
});
|
|
251
|
+
$[47] = t16;
|
|
252
|
+
$[48] = t20;
|
|
253
|
+
$[49] = t21;
|
|
254
|
+
$[50] = t22;
|
|
255
|
+
$[51] = t23;
|
|
256
|
+
} else {
|
|
257
|
+
t23 = $[51];
|
|
258
|
+
}
|
|
259
|
+
return t23;
|
|
127
260
|
}
|
|
128
261
|
|
|
129
262
|
var definition = {
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@panneau/field-number",
|
|
3
|
-
"version": "4.0.
|
|
3
|
+
"version": "4.0.40-alpha.1",
|
|
4
4
|
"description": "A number field",
|
|
5
5
|
"keywords": [
|
|
6
6
|
"javascript"
|
|
@@ -64,15 +64,15 @@
|
|
|
64
64
|
},
|
|
65
65
|
"dependencies": {
|
|
66
66
|
"@babel/runtime": "^7.28.6",
|
|
67
|
-
"@panneau/core": "^4.0.
|
|
68
|
-
"@panneau/element-icon": "^4.0.
|
|
69
|
-
"@panneau/field-text": "^4.0.
|
|
70
|
-
"@panneau/themes": "^4.0.
|
|
67
|
+
"@panneau/core": "^4.0.40-alpha.1",
|
|
68
|
+
"@panneau/element-icon": "^4.0.40-alpha.1",
|
|
69
|
+
"@panneau/field-text": "^4.0.40-alpha.1",
|
|
70
|
+
"@panneau/themes": "^4.0.40-alpha.1",
|
|
71
71
|
"classnames": "^2.5.1",
|
|
72
72
|
"lodash": "^4.17.21"
|
|
73
73
|
},
|
|
74
74
|
"publishConfig": {
|
|
75
75
|
"access": "public"
|
|
76
76
|
},
|
|
77
|
-
"gitHead": "
|
|
77
|
+
"gitHead": "66520f92373b3aa371222b354d60ed3cf3d20c96"
|
|
78
78
|
}
|