@hoddy-ui/next 2.0.25 → 2.0.27
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 +34 -24
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +38 -25
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.js
CHANGED
|
@@ -1517,7 +1517,7 @@ var TextField = ({
|
|
|
1517
1517
|
{
|
|
1518
1518
|
style: {
|
|
1519
1519
|
marginRight: 20,
|
|
1520
|
-
paddingTop: variant
|
|
1520
|
+
paddingTop: variant === "text" ? (0, import_react_native_size_matters14.ms)(13) : 0
|
|
1521
1521
|
}
|
|
1522
1522
|
},
|
|
1523
1523
|
end
|
|
@@ -1526,8 +1526,8 @@ var TextField = ({
|
|
|
1526
1526
|
import_react_native16.View,
|
|
1527
1527
|
{
|
|
1528
1528
|
style: {
|
|
1529
|
-
marginRight: 20,
|
|
1530
|
-
paddingTop: variant
|
|
1529
|
+
marginRight: variant === "text" ? 0 : 20,
|
|
1530
|
+
paddingTop: variant === "text" ? (0, import_react_native_size_matters14.ms)(13) : 0
|
|
1531
1531
|
}
|
|
1532
1532
|
},
|
|
1533
1533
|
/* @__PURE__ */ import_react16.default.createElement(
|
|
@@ -2041,6 +2041,36 @@ var OTPInput = ({
|
|
|
2041
2041
|
() => Array(length).fill(0).map((_) => import_react20.default.createRef()),
|
|
2042
2042
|
[length]
|
|
2043
2043
|
);
|
|
2044
|
+
console.log("v", value);
|
|
2045
|
+
const onChangeHandler = (val, index) => {
|
|
2046
|
+
if (value.length >= length && val.length > 0)
|
|
2047
|
+
return;
|
|
2048
|
+
if (val.length > 1) {
|
|
2049
|
+
console.log("reached", val);
|
|
2050
|
+
const digits = val.replace(/\D/g, "").slice(0, length);
|
|
2051
|
+
onChange(digits);
|
|
2052
|
+
if (digits.length === length) {
|
|
2053
|
+
inputRefs[length - 1].current?.focus();
|
|
2054
|
+
}
|
|
2055
|
+
return;
|
|
2056
|
+
}
|
|
2057
|
+
if (val.length === 0) {
|
|
2058
|
+
const newValue2 = value.slice(0, index) + value.slice(index + 1);
|
|
2059
|
+
onChange(newValue2);
|
|
2060
|
+
if (index > 0) {
|
|
2061
|
+
inputRefs[index - 1].current?.focus();
|
|
2062
|
+
}
|
|
2063
|
+
return;
|
|
2064
|
+
}
|
|
2065
|
+
const digit = val.replace(/\D/g, "").slice(0, 1);
|
|
2066
|
+
if (!digit)
|
|
2067
|
+
return;
|
|
2068
|
+
const newValue = value.slice(0, index) + digit + value.slice(index + 1);
|
|
2069
|
+
onChange(newValue);
|
|
2070
|
+
if (index < length - 1) {
|
|
2071
|
+
inputRefs[index + 1].current?.focus();
|
|
2072
|
+
}
|
|
2073
|
+
};
|
|
2044
2074
|
const colors2 = useColors();
|
|
2045
2075
|
const styles2 = import_react_native_size_matters19.ScaledSheet.create({
|
|
2046
2076
|
root: {},
|
|
@@ -2063,27 +2093,7 @@ var OTPInput = ({
|
|
|
2063
2093
|
import_react_native22.TextInput,
|
|
2064
2094
|
{
|
|
2065
2095
|
ref: inputRefs[index],
|
|
2066
|
-
onChangeText: (val) =>
|
|
2067
|
-
if (val.length === 1) {
|
|
2068
|
-
if (index !== length - 1)
|
|
2069
|
-
inputRefs[index + 1].current?.focus();
|
|
2070
|
-
let text = value;
|
|
2071
|
-
text = text.slice(0, index) + val + text.slice(index + 1);
|
|
2072
|
-
onChange(text);
|
|
2073
|
-
} else if (val.length === 0) {
|
|
2074
|
-
if (index !== 0) {
|
|
2075
|
-
inputRefs[index - 1].current?.focus();
|
|
2076
|
-
let text = value;
|
|
2077
|
-
text = text.slice(0, index);
|
|
2078
|
-
onChange(text);
|
|
2079
|
-
} else
|
|
2080
|
-
onChange("");
|
|
2081
|
-
} else {
|
|
2082
|
-
let text = val.replace(/\D/g, "").slice(0, length);
|
|
2083
|
-
onChange(text);
|
|
2084
|
-
inputRefs[text.length < length - 1 ? text.length : length - 1]?.current?.focus();
|
|
2085
|
-
}
|
|
2086
|
-
},
|
|
2096
|
+
onChangeText: (val) => onChangeHandler(val, index),
|
|
2087
2097
|
value: value[index] || "",
|
|
2088
2098
|
blurOnSubmit: false,
|
|
2089
2099
|
keyboardType: "number-pad",
|