react-native-better-html 1.0.10 → 1.0.11

package/dist/index.mjs

@@ -1167,6 +1167,10 @@ var InputFieldComponent = forwardRef(
     defaultValue,
     value,
     editable = true,
+    label,
+    isError,
+    infoMessage,
+    errorMessage,
     autoFocus,
     autoCapitalize,
     autoComplete,
@@ -1237,81 +1241,108 @@ var InputFieldComponent = forwardRef(
       []
     );
     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", flex: 1, height: readyHeight, children: [
-      prefix && /* @__PURE__ */ jsx9(
-        View_default,
-        {
-          isRow: true,
-          height: "100%",
-          backgroundColor: prefixSuffixBackgroundColor,
-          alignItems: "center",
-          borderWidth,
-          borderRightWidth: 0,
-          borderTopLeftRadius: theme2.styles.borderRadius,
-          borderBottomLeftRadius: theme2.styles.borderRadius,
-          borderColor: theme2.colors.border,
-          paddingHorizontal: readyPaddingHorizontal,
-          children: /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: prefix })
-        }
-      ),
-      /* @__PURE__ */ jsx9(
-        Animate_default.View,
+    return /* @__PURE__ */ jsxs4(View_default, { flex: 1, gap: theme2.styles.gap / 3, children: [
+      label && /* @__PURE__ */ jsx9(Text_default, { fontSize: 14, color: theme2.colors.textSecondary, children: label }),
+      /* @__PURE__ */ jsxs4(View_default, { isRow: true, position: "relative", alignItems: "center", flex: 1, height: readyHeight, children: [
+        prefix && /* @__PURE__ */ jsx9(
+          View_default,
+          {
+            isRow: true,
+            height: "100%",
+            backgroundColor: prefixSuffixBackgroundColor,
+            alignItems: "center",
+            borderWidth,
+            borderRightWidth: 0,
+            borderTopLeftRadius: theme2.styles.borderRadius,
+            borderBottomLeftRadius: theme2.styles.borderRadius,
+            borderColor: theme2.colors.border,
+            paddingHorizontal: readyPaddingHorizontal,
+            children: typeof prefix === "string" ? /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: prefix }) : prefix
+          }
+        ),
+        /* @__PURE__ */ jsx9(
+          Animate_default.View,
+          {
+            flex: 1,
+            backgroundColor: theme2.colors.backgroundContent,
+            borderTopLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
+            borderBottomLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
+            borderTopRightRadius: suffix ? 0 : theme2.styles.borderRadius,
+            borderBottomRightRadius: suffix ? 0 : theme2.styles.borderRadius,
+            borderWidth,
+            initialBorderColor: theme2.colors.border,
+            animateBorderColor: isFocused ? theme2.colors.primary : isError ? theme2.colors.error : theme2.colors.border,
+            overflow: "hidden",
+            children: /* @__PURE__ */ jsx9(
+              TextInput,
+              {
+                style: textInputStyle,
+                value: internalValue,
+                defaultValue,
+                autoCapitalize,
+                autoComplete,
+                autoCorrect,
+                autoFocus,
+                placeholder,
+                placeholderTextColor: theme2.colors.textSecondary + "80",
+                enterKeyHint: returnKeyLabel,
+                returnKeyType,
+                onSubmitEditing: onPressEnter,
+                readOnly: !editable,
+                textAlign,
+                keyboardAppearance,
+                keyboardType,
+                cursorColor: theme2.colors.primary,
+                selectionColor: theme2.colors.primary,
+                secureTextEntry,
+                onFocus: onFocusElement,
+                onBlur: onBlurElement,
+                onChangeText,
+                onPress,
+                ref: textInputRef
+              }
+            )
+          }
+        ),
+        suffix && /* @__PURE__ */ jsx9(
+          View_default,
+          {
+            isRow: true,
+            height: "100%",
+            backgroundColor: prefixSuffixBackgroundColor,
+            alignItems: "center",
+            borderWidth,
+            borderLeftWidth: 0,
+            borderTopRightRadius: theme2.styles.borderRadius,
+            borderBottomRightRadius: theme2.styles.borderRadius,
+            borderColor: theme2.colors.border,
+            paddingHorizontal: readyPaddingHorizontal,
+            children: typeof suffix === "string" ? /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: suffix }) : suffix
+          }
+        )
+      ] }),
+      infoMessage && /* @__PURE__ */ jsx9(
+        Animate_default.Text,
         {
-          flex: 1,
-          backgroundColor: theme2.colors.backgroundContent,
-          borderTopLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
-          borderBottomLeftRadius: prefix ? 0 : theme2.styles.borderRadius,
-          borderTopRightRadius: suffix ? 0 : theme2.styles.borderRadius,
-          borderBottomRightRadius: suffix ? 0 : theme2.styles.borderRadius,
-          borderWidth,
-          initialBorderColor: theme2.colors.border,
-          animateBorderColor: isFocused ? theme2.colors.primary : theme2.colors.border,
-          overflow: "hidden",
-          children: /* @__PURE__ */ jsx9(
-            TextInput,
-            {
-              style: textInputStyle,
-              value: internalValue,
-              defaultValue,
-              autoCapitalize,
-              autoComplete,
-              autoCorrect,
-              autoFocus,
-              placeholder,
-              placeholderTextColor: theme2.colors.textSecondary + "80",
-              enterKeyHint: returnKeyLabel,
-              returnKeyType,
-              onSubmitEditing: onPressEnter,
-              readOnly: !editable,
-              textAlign,
-              keyboardAppearance,
-              keyboardType,
-              cursorColor: theme2.colors.primary,
-              selectionColor: theme2.colors.primary,
-              secureTextEntry,
-              onFocus: onFocusElement,
-              onBlur: onBlurElement,
-              onChangeText,
-              onPress,
-              ref: textInputRef
-            }
-          )
+          fontSize: 14,
+          color: theme2.colors.textSecondary,
+          initialHeight: 0,
+          initialOpacity: 0,
+          animateHeight: 17,
+          animateOpacity: 1,
+          children: infoMessage
         }
       ),
-      suffix && /* @__PURE__ */ jsx9(
-        View_default,
+      errorMessage && /* @__PURE__ */ jsx9(
+        Animate_default.Text,
         {
-          isRow: true,
-          height: "100%",
-          backgroundColor: prefixSuffixBackgroundColor,
-          alignItems: "center",
-          borderWidth,
-          borderLeftWidth: 0,
-          borderTopRightRadius: theme2.styles.borderRadius,
-          borderBottomRightRadius: theme2.styles.borderRadius,
-          borderColor: theme2.colors.border,
-          paddingHorizontal: readyPaddingHorizontal,
-          children: /* @__PURE__ */ jsx9(Text_default, { fontWeight: 700, children: suffix })
+          fontSize: 14,
+          color: theme2.colors.error,
+          initialHeight: 0,
+          initialOpacity: 0,
+          animateHeight: 17,
+          animateOpacity: 1,
+          children: errorMessage
         }
       )
     ] });
@@ -1345,15 +1376,16 @@ InputFieldComponent.password = forwardRef(function Password(props, ref) {
     }
   );
 });
-InputFieldComponent.code = forwardRef(function Password2(props, ref) {
+InputFieldComponent.code = forwardRef(function Password2({ isSmall, ...props }, ref) {
   const theme2 = useTheme8();
   return /* @__PURE__ */ jsx9(
     InputFieldComponent,
     {
-      fontSize: 42,
+      fontSize: isSmall ? 36 : 42,
       fontWeight: 900,
-      lineHeight: 50,
-      paddingVertical: theme2.styles.space * 2,
+      lineHeight: isSmall ? 42 : 50,
+      paddingVertical: isSmall ? theme2.styles.space : theme2.styles.space * 2,
+      paddingHorizontal: isSmall ? theme2.styles.gap : void 0,
       textAlign: "center",
       ...props,
       ref
@@ -1369,14 +1401,15 @@ var InputField_default = InputField;
 // src/components/StatusBar.tsx
 import { memo as memo10 } from "react";
 import { useTheme as useTheme9 } from "react-better-core";
-import { StatusBar as NativeStatusBar } from "react-native";
+import { StatusBar as NativeStatusBar, Platform as Platform4 } from "react-native";
 import { jsx as jsx10 } from "react/jsx-runtime";
-function StatusBar({ darkStatusBar, hidden }) {
+function StatusBar({ darkStatusBar, hidden, barStyle, androidBarStyle, iOSBarStyle }) {
   const theme2 = useTheme9();
   return /* @__PURE__ */ jsx10(
     NativeStatusBar,
     {
       backgroundColor: darkStatusBar ? theme2.colors.backgroundSecondary : void 0,
+      barStyle: barStyle ?? (Platform4.OS === "android" ? androidBarStyle : iOSBarStyle),
       hidden
     }
   );