react-native-better-html 1.0.9 → 1.0.10

package/dist/index.mjs

@@ -1138,8 +1138,19 @@ Image2.profileImage = ImageComponent.profileImage;
 var Image_default = Image2;
 
 // src/components/InputField.tsx
-import { forwardRef, memo as memo9, useCallback as useCallback2, useEffect as useEffect4, useImperativeHandle, useMemo as useMemo8, useState as useState2 } from "react";
-import { TextInput } from "react-native";
+import {
+  forwardRef,
+  memo as memo9,
+  useCallback as useCallback2,
+  useEffect as useEffect4,
+  useImperativeHandle,
+  useMemo as useMemo8,
+  useRef,
+  useState as useState2
+} from "react";
+import {
+  TextInput
+} from "react-native";
 import {
   darkenColor,
   lightenColor,
@@ -1163,19 +1174,30 @@ var InputFieldComponent = forwardRef(
     keyboardAppearance = "default",
     keyboardType,
     secureTextEntry,
+    returnKeyLabel,
+    returnKeyType,
+    height,
+    fontSize = 16,
+    fontWeight = 400,
+    lineHeight = 20,
+    textAlign,
+    paddingHorizontal,
+    paddingVertical,
     onFocus,
     onBlur,
-    onChange
+    onChange,
+    onPress,
+    onPressEnter
   }, ref) => {
     const theme2 = useTheme8();
     const { colorTheme } = useBetterCoreContext3();
+    const textInputRef = useRef(null);
     const [internalValue, setInternalValue] = useState2(value?.toString() || defaultValue || "");
     const [isFocused, setIsFocused] = useBooleanState4();
     const borderWidth = 1;
-    const lineHeight = 20;
-    const paddingHorizontal = theme2.styles.space;
-    const paddingVertical = (theme2.styles.space + theme2.styles.gap) / 2;
-    const height = borderWidth + paddingVertical + lineHeight + paddingVertical + borderWidth;
+    const readyPaddingHorizontal = paddingHorizontal ?? theme2.styles.space;
+    const readyPaddingVertical = paddingVertical ? parseFloat(paddingVertical.toString()) : (theme2.styles.space + theme2.styles.gap) / 2;
+    const readyHeight = height ?? borderWidth + readyPaddingVertical + lineHeight + readyPaddingVertical + borderWidth;
     const onFocusElement = useCallback2((event) => {
       setIsFocused.setTrue();
       onFocus?.(event);
@@ -1194,13 +1216,14 @@ var InputFieldComponent = forwardRef(
     const textInputStyle = useMemo8(
       () => ({
         flex: 1,
-        fontSize: 16,
+        fontSize,
+        fontWeight,
         lineHeight,
         color: theme2.colors.textPrimary,
-        paddingHorizontal,
-        paddingVertical
+        paddingHorizontal: readyPaddingHorizontal,
+        paddingVertical: readyPaddingVertical
       }),
-      [theme2.colors, lineHeight, paddingHorizontal, paddingVertical]
+      [theme2.colors, fontSize, fontWeight, lineHeight, readyPaddingHorizontal, readyPaddingVertical]
     );
     useEffect4(() => {
       if (value === void 0) return;
@@ -1209,12 +1232,12 @@ var InputFieldComponent = forwardRef(
     useImperativeHandle(
       ref,
       () => {
-        return {};
+        return textInputRef.current;
       },
       []
     );
     const prefixSuffixBackgroundColor = colorTheme === "light" ? darkenColor(theme2.colors.backgroundContent, 0.03) : lightenColor(theme2.colors.backgroundContent, 0.1);
-    return /* @__PURE__ */ jsxs4(View_default, { isRow: true, position: "relative", alignItems: "center", height, children: [
+    return /* @__PURE__ */ jsxs4(View_default, { isRow: true, position: "relative", alignItems: "center", flex: 1, height: readyHeight, children: [
       prefix && /* @__PURE__ */ jsx9(
         View_default,
         {
@@ -1227,7 +1250,7 @@ var InputFieldComponent = forwardRef(
           borderTopLeftRadius: theme2.styles.borderRadius,
           borderBottomLeftRadius: theme2.styles.borderRadius,
           borderColor: theme2.colors.border,
-          paddingHorizontal,
+          paddingHorizontal: readyPaddingHorizontal,
           children: /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: prefix })
         }
       ),
@@ -1256,7 +1279,11 @@ var InputFieldComponent = forwardRef(
               autoFocus,
               placeholder,
               placeholderTextColor: theme2.colors.textSecondary + "80",
+              enterKeyHint: returnKeyLabel,
+              returnKeyType,
+              onSubmitEditing: onPressEnter,
               readOnly: !editable,
+              textAlign,
               keyboardAppearance,
               keyboardType,
               cursorColor: theme2.colors.primary,
@@ -1264,7 +1291,9 @@ var InputFieldComponent = forwardRef(
               secureTextEntry,
               onFocus: onFocusElement,
               onBlur: onBlurElement,
-              onChangeText
+              onChangeText,
+              onPress,
+              ref: textInputRef
             }
           )
         }
@@ -1281,7 +1310,7 @@ var InputFieldComponent = forwardRef(
           borderTopRightRadius: theme2.styles.borderRadius,
           borderBottomRightRadius: theme2.styles.borderRadius,
           borderColor: theme2.colors.border,
-          paddingHorizontal,
+          paddingHorizontal: readyPaddingHorizontal,
           children: /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: suffix })
         }
       )
@@ -1316,9 +1345,25 @@ InputFieldComponent.password = forwardRef(function Password(props, ref) {
     }
   );
 });
+InputFieldComponent.code = forwardRef(function Password2(props, ref) {
+  const theme2 = useTheme8();
+  return /* @__PURE__ */ jsx9(
+    InputFieldComponent,
+    {
+      fontSize: 42,
+      fontWeight: 900,
+      lineHeight: 50,
+      paddingVertical: theme2.styles.space * 2,
+      textAlign: "center",
+      ...props,
+      ref
+    }
+  );
+});
 var InputField = memo9(InputFieldComponent);
 InputField.email = InputFieldComponent.email;
 InputField.password = InputFieldComponent.password;
+InputField.code = InputFieldComponent.code;
 var InputField_default = InputField;
 
 // src/components/StatusBar.tsx