@rehagro/ui 1.0.42 → 1.0.44

package/dist/native.mjs

@@ -324,6 +324,8 @@ var TextInput = forwardRef(function TextInput2({
   editable = true,
   wrapperStyle,
   style,
+  borderColor,
+  borderWidth = "sm",
   accessibilityLabel,
   ...rest
 }, ref) {
@@ -333,17 +335,23 @@ var TextInput = forwardRef(function TextInput2({
   const heightMap = {
     sm: theme.inputHeightSm ?? 36,
     md: theme.inputHeightMd ?? 44,
-    lg: theme.inputHeightLg ?? 52
+    lg: theme.inputHeightLg ?? 52,
+    // `xl` (44) sits between md/lg — same height as web. Native
+    // theme doesn't expose a token for it, so we fall back to a
+    // hard-coded value matching the CSS `--rh-input-height-xl`.
+    xl: 44
   };
   const paddingMap2 = {
     sm: 12,
     md: 14,
-    lg: 16
+    lg: 16,
+    xl: 14
   };
   const fontSizeMap = {
     sm: 14,
     md: 14,
-    lg: 16
+    lg: 16,
+    xl: 14
   };
   const radiusMap2 = {
     none: 0,
@@ -355,14 +363,19 @@ var TextInput = forwardRef(function TextInput2({
     xl: theme.radiusXl ?? 32,
     full: 9999
   };
+  const borderWidthMap = {
+    sm: theme.borderWidthSm ?? 1,
+    md: theme.borderWidthMd ?? 2,
+    lg: theme.borderWidthLg ?? 3
+  };
   const hasError = status === "error" || !!helperText;
-  const borderColor = hasError ? theme.danger : focused ? theme.primary : theme.border;
+  const effectiveBorderColor = hasError ? theme.danger : focused ? theme.primary : borderColor ?? theme.border;
   const containerStyle = {
     height: heightMap[size],
     paddingHorizontal: paddingMap2[size],
     borderRadius: radiusMap2[radius],
-    borderWidth: theme.borderWidthSm,
-    borderColor,
+    borderWidth: borderWidthMap[borderWidth],
+    borderColor: effectiveBorderColor,
     backgroundColor: isDisabled ? theme.background : theme.surface,
     flexDirection: "row",
     alignItems: "center",
@@ -373,7 +386,19 @@ var TextInput = forwardRef(function TextInput2({
   return /* @__PURE__ */ jsxs(View, { style: [{ gap: 4 }, wrapperStyle], children: [
     label && /* @__PURE__ */ jsxs(View, { style: { flexDirection: "row", alignItems: "baseline", gap: 4 }, children: [
       /* @__PURE__ */ jsx(Text, { style: { fontSize: 14, fontWeight: "500", color: theme.text }, children: label }),
-      subtitle && /* @__PURE__ */ jsx(Text, { style: { fontSize: 14, color: theme.textMuted }, children: subtitle })
+      subtitle && /* @__PURE__ */ jsx(
+        Text,
+        {
+          style: {
+            fontSize: 14,
+            // Required-marker convention (matches web): a lone
+            // `*` is rendered in danger color; any other text
+            // stays muted.
+            color: subtitle.trim() === "*" ? theme.danger : theme.textMuted
+          },
+          children: subtitle
+        }
+      )
     ] }),
     /* @__PURE__ */ jsxs(View, { style: [containerStyle, style], children: [
       leftIcon && /* @__PURE__ */ jsx(View, { accessibilityElementsHidden: true, children: leftIcon }),