math-main-components 0.0.14 → 0.0.16
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/README.md +9 -2
- package/dist/index.cjs.js +3 -5
- package/dist/index.esm.js +3 -5
- package/package.json +1 -1
package/README.md
CHANGED
@@ -2,6 +2,13 @@
|
|
2
2
|
|
3
3
|
Component Library for math-main-app
|
4
4
|
|
5
|
-
Includes
|
6
5
|
- reusable ui components
|
7
|
-
- math components
|
6
|
+
- math components
|
7
|
+
|
8
|
+
## Notes
|
9
|
+
- Do not use any of next.js features like next/link
|
10
|
+
|
11
|
+
## Publishing
|
12
|
+
1. increment version in `package.json`
|
13
|
+
2. run `npm publish --access public`
|
14
|
+
3. run `yarn add math-main-components@0.0.1` in project
|
package/dist/index.cjs.js
CHANGED
@@ -276,6 +276,7 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
276
276
|
function onChange(event, position) {
|
277
277
|
const regex = /^[0-9\b]+$/;
|
278
278
|
const value = event.target.value ? event.target.value : "";
|
279
|
+
console.log("current state", state);
|
279
280
|
if (value != '' && regex.test(value)) {
|
280
281
|
const digitCountBefore = state[position] == undefined ? 0 : String(state[position]).length;
|
281
282
|
const addedDigitsCount = value.length - digitCountBefore;
|
@@ -298,6 +299,7 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
298
299
|
setState(newState);
|
299
300
|
}
|
300
301
|
}
|
302
|
+
console.log("new state", state);
|
301
303
|
}
|
302
304
|
function onKeyUp(event, position) {
|
303
305
|
event.preventDefault();
|
@@ -320,14 +322,10 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
320
322
|
ref.current.value = "";
|
321
323
|
});
|
322
324
|
}
|
323
|
-
React.useCallback((element) => {
|
324
|
-
if (element)
|
325
|
-
element.focus();
|
326
|
-
}, []);
|
327
325
|
return (React__default["default"].createElement(React__default["default"].Fragment, null,
|
328
326
|
React__default["default"].createElement("div", { className: styles$e.container },
|
329
327
|
React__default["default"].createElement("input", { name: name, type: "hidden", defaultValue: Object.values(state).join("") }),
|
330
|
-
React__default["default"].createElement("div", { className: styles$e.input_wrapper }, [...Array(length)].map((
|
328
|
+
React__default["default"].createElement("div", { className: styles$e.input_wrapper }, [...Array(length)].map((value, i) => {
|
331
329
|
if (i == 0) {
|
332
330
|
return React__default["default"].createElement("input", { key: i, pattern: "[0-9]", value: state[i] ? state[i] : "", ref: fieldRefs.current[i], className: styles$e.input, type: "text", onKeyUp: (event) => onKeyUp(event, i), onInput: (event) => onChange(event, i) });
|
333
331
|
}
|
package/dist/index.esm.js
CHANGED
@@ -268,6 +268,7 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
268
268
|
function onChange(event, position) {
|
269
269
|
const regex = /^[0-9\b]+$/;
|
270
270
|
const value = event.target.value ? event.target.value : "";
|
271
|
+
console.log("current state", state);
|
271
272
|
if (value != '' && regex.test(value)) {
|
272
273
|
const digitCountBefore = state[position] == undefined ? 0 : String(state[position]).length;
|
273
274
|
const addedDigitsCount = value.length - digitCountBefore;
|
@@ -290,6 +291,7 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
290
291
|
setState(newState);
|
291
292
|
}
|
292
293
|
}
|
294
|
+
console.log("new state", state);
|
293
295
|
}
|
294
296
|
function onKeyUp(event, position) {
|
295
297
|
event.preventDefault();
|
@@ -312,14 +314,10 @@ function InputPin({ name, length, onFinished = () => { } }) {
|
|
312
314
|
ref.current.value = "";
|
313
315
|
});
|
314
316
|
}
|
315
|
-
useCallback((element) => {
|
316
|
-
if (element)
|
317
|
-
element.focus();
|
318
|
-
}, []);
|
319
317
|
return (React.createElement(React.Fragment, null,
|
320
318
|
React.createElement("div", { className: styles$e.container },
|
321
319
|
React.createElement("input", { name: name, type: "hidden", defaultValue: Object.values(state).join("") }),
|
322
|
-
React.createElement("div", { className: styles$e.input_wrapper }, [...Array(length)].map((
|
320
|
+
React.createElement("div", { className: styles$e.input_wrapper }, [...Array(length)].map((value, i) => {
|
323
321
|
if (i == 0) {
|
324
322
|
return React.createElement("input", { key: i, pattern: "[0-9]", value: state[i] ? state[i] : "", ref: fieldRefs.current[i], className: styles$e.input, type: "text", onKeyUp: (event) => onKeyUp(event, i), onInput: (event) => onChange(event, i) });
|
325
323
|
}
|