@rehagro/ui 1.0.63 → 1.0.65

package/dist/native.d.mts

@@ -237,6 +237,59 @@ declare const TextInput: React__default.ForwardRefExoticComponent<Omit<TextInput
     borderWidth?: TextInputBorderWidth;
 } & React__default.RefAttributes<TextInput$1>>;
 
+type TextAreaStatus = "default" | "error";
+type TextAreaSize = "sm" | "md" | "lg";
+type TextAreaRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
+type TextAreaBorderWidth = "sm" | "md" | "lg";
+type TextAreaProps = Omit<TextInputProps$1, "style" | "multiline"> & {
+    /** Label text displayed above the textarea */
+    label?: string;
+    /** Subtitle displayed next to the label. Use "*" for the required marker. */
+    subtitle?: string;
+    /** Validation status */
+    status?: TextAreaStatus;
+    /** Text/padding size */
+    size?: TextAreaSize;
+    /** Border radius */
+    radius?: TextAreaRadius;
+    /** Helper/error message displayed below the textarea */
+    helperText?: React__default.ReactNode;
+    /** Number of visible text rows (default 3) */
+    rows?: number;
+    /** Custom style for the outermost wrapper */
+    wrapperStyle?: StyleProp<ViewStyle>;
+    /** Custom style for the textarea container */
+    style?: StyleProp<ViewStyle>;
+    /** Custom border color. Overrides the resting border color from `status`/`focused`. */
+    borderColor?: string;
+    /** Border width token (`sm` 1px, `md` 2px, `lg` 3px). */
+    borderWidth?: TextAreaBorderWidth;
+};
+declare const TextArea: React__default.ForwardRefExoticComponent<Omit<TextInputProps$1, "style" | "multiline"> & {
+    /** Label text displayed above the textarea */
+    label?: string;
+    /** Subtitle displayed next to the label. Use "*" for the required marker. */
+    subtitle?: string;
+    /** Validation status */
+    status?: TextAreaStatus;
+    /** Text/padding size */
+    size?: TextAreaSize;
+    /** Border radius */
+    radius?: TextAreaRadius;
+    /** Helper/error message displayed below the textarea */
+    helperText?: React__default.ReactNode;
+    /** Number of visible text rows (default 3) */
+    rows?: number;
+    /** Custom style for the outermost wrapper */
+    wrapperStyle?: StyleProp<ViewStyle>;
+    /** Custom style for the textarea container */
+    style?: StyleProp<ViewStyle>;
+    /** Custom border color. Overrides the resting border color from `status`/`focused`. */
+    borderColor?: string;
+    /** Border width token (`sm` 1px, `md` 2px, `lg` 3px). */
+    borderWidth?: TextAreaBorderWidth;
+} & React__default.RefAttributes<TextInput$1>>;
+
 type CheckboxSize = "sm" | "md" | "lg";
 type CheckboxProps = Omit<PressableProps, "style" | "onPress"> & {
     /** Checkbox size */
@@ -617,4 +670,4 @@ type ProgressBarProps = {
 };
 declare const ProgressBar: React__default.ForwardRefExoticComponent<ProgressBarProps & React__default.RefAttributes<View>>;
 
-export { ActivityIndicator, type ActivityIndicatorColor, type ActivityIndicatorProps, type ActivityIndicatorSize, Avatar, type AvatarProps, type AvatarSize, type AvatarVariant, Button, ButtonColor, type ButtonProps, type ButtonRadius, type ButtonSize, type ButtonVariant, Card, CardContent, type CardContentProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardPadding, type CardProps, type CardRadius, type CardVariant, Checkbox, type CheckboxProps, type CheckboxSize, IconButton, type IconButtonColor, type IconButtonProps, type IconButtonRadius, type IconButtonSize, type IconButtonVariant, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarThickness, type ProgressBarVariant, Radio, type RadioColor, RadioGroup, type RadioGroupProps, RadioOption, type RadioOptionProps, type RadioOrientation, type RadioProps, type RadioSize, RehagroNativeProvider, type RehagroNativeProviderProps, type RehagroNativeTheme, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectRadius, type SelectSingleProps, type SelectSize, type SelectStatus, Tag, type TagColor, type TagProps, type TagSize, Text, type TextColor, TextInput, type TextInputProps, type TextInputRadius, type TextInputSize, type TextInputStatus, type TextProps, type TextSize, useRehagroTheme };
+export { ActivityIndicator, type ActivityIndicatorColor, type ActivityIndicatorProps, type ActivityIndicatorSize, Avatar, type AvatarProps, type AvatarSize, type AvatarVariant, Button, ButtonColor, type ButtonProps, type ButtonRadius, type ButtonSize, type ButtonVariant, Card, CardContent, type CardContentProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardPadding, type CardProps, type CardRadius, type CardVariant, Checkbox, type CheckboxProps, type CheckboxSize, IconButton, type IconButtonColor, type IconButtonProps, type IconButtonRadius, type IconButtonSize, type IconButtonVariant, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarThickness, type ProgressBarVariant, Radio, type RadioColor, RadioGroup, type RadioGroupProps, RadioOption, type RadioOptionProps, type RadioOrientation, type RadioProps, type RadioSize, RehagroNativeProvider, type RehagroNativeProviderProps, type RehagroNativeTheme, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectRadius, type SelectSingleProps, type SelectSize, type SelectStatus, Tag, type TagColor, type TagProps, type TagSize, Text, TextArea, type TextAreaBorderWidth, type TextAreaProps, type TextAreaRadius, type TextAreaSize, type TextAreaStatus, type TextColor, TextInput, type TextInputProps, type TextInputRadius, type TextInputSize, type TextInputStatus, type TextProps, type TextSize, useRehagroTheme };

package/dist/native.d.ts

@@ -237,6 +237,59 @@ declare const TextInput: React__default.ForwardRefExoticComponent<Omit<TextInput
     borderWidth?: TextInputBorderWidth;
 } & React__default.RefAttributes<TextInput$1>>;
 
+type TextAreaStatus = "default" | "error";
+type TextAreaSize = "sm" | "md" | "lg";
+type TextAreaRadius = "none" | "xxs" | "xs" | "sm" | "md" | "lg" | "xl" | "full";
+type TextAreaBorderWidth = "sm" | "md" | "lg";
+type TextAreaProps = Omit<TextInputProps$1, "style" | "multiline"> & {
+    /** Label text displayed above the textarea */
+    label?: string;
+    /** Subtitle displayed next to the label. Use "*" for the required marker. */
+    subtitle?: string;
+    /** Validation status */
+    status?: TextAreaStatus;
+    /** Text/padding size */
+    size?: TextAreaSize;
+    /** Border radius */
+    radius?: TextAreaRadius;
+    /** Helper/error message displayed below the textarea */
+    helperText?: React__default.ReactNode;
+    /** Number of visible text rows (default 3) */
+    rows?: number;
+    /** Custom style for the outermost wrapper */
+    wrapperStyle?: StyleProp<ViewStyle>;
+    /** Custom style for the textarea container */
+    style?: StyleProp<ViewStyle>;
+    /** Custom border color. Overrides the resting border color from `status`/`focused`. */
+    borderColor?: string;
+    /** Border width token (`sm` 1px, `md` 2px, `lg` 3px). */
+    borderWidth?: TextAreaBorderWidth;
+};
+declare const TextArea: React__default.ForwardRefExoticComponent<Omit<TextInputProps$1, "style" | "multiline"> & {
+    /** Label text displayed above the textarea */
+    label?: string;
+    /** Subtitle displayed next to the label. Use "*" for the required marker. */
+    subtitle?: string;
+    /** Validation status */
+    status?: TextAreaStatus;
+    /** Text/padding size */
+    size?: TextAreaSize;
+    /** Border radius */
+    radius?: TextAreaRadius;
+    /** Helper/error message displayed below the textarea */
+    helperText?: React__default.ReactNode;
+    /** Number of visible text rows (default 3) */
+    rows?: number;
+    /** Custom style for the outermost wrapper */
+    wrapperStyle?: StyleProp<ViewStyle>;
+    /** Custom style for the textarea container */
+    style?: StyleProp<ViewStyle>;
+    /** Custom border color. Overrides the resting border color from `status`/`focused`. */
+    borderColor?: string;
+    /** Border width token (`sm` 1px, `md` 2px, `lg` 3px). */
+    borderWidth?: TextAreaBorderWidth;
+} & React__default.RefAttributes<TextInput$1>>;
+
 type CheckboxSize = "sm" | "md" | "lg";
 type CheckboxProps = Omit<PressableProps, "style" | "onPress"> & {
     /** Checkbox size */
@@ -617,4 +670,4 @@ type ProgressBarProps = {
 };
 declare const ProgressBar: React__default.ForwardRefExoticComponent<ProgressBarProps & React__default.RefAttributes<View>>;
 
-export { ActivityIndicator, type ActivityIndicatorColor, type ActivityIndicatorProps, type ActivityIndicatorSize, Avatar, type AvatarProps, type AvatarSize, type AvatarVariant, Button, ButtonColor, type ButtonProps, type ButtonRadius, type ButtonSize, type ButtonVariant, Card, CardContent, type CardContentProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardPadding, type CardProps, type CardRadius, type CardVariant, Checkbox, type CheckboxProps, type CheckboxSize, IconButton, type IconButtonColor, type IconButtonProps, type IconButtonRadius, type IconButtonSize, type IconButtonVariant, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarThickness, type ProgressBarVariant, Radio, type RadioColor, RadioGroup, type RadioGroupProps, RadioOption, type RadioOptionProps, type RadioOrientation, type RadioProps, type RadioSize, RehagroNativeProvider, type RehagroNativeProviderProps, type RehagroNativeTheme, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectRadius, type SelectSingleProps, type SelectSize, type SelectStatus, Tag, type TagColor, type TagProps, type TagSize, Text, type TextColor, TextInput, type TextInputProps, type TextInputRadius, type TextInputSize, type TextInputStatus, type TextProps, type TextSize, useRehagroTheme };
+export { ActivityIndicator, type ActivityIndicatorColor, type ActivityIndicatorProps, type ActivityIndicatorSize, Avatar, type AvatarProps, type AvatarSize, type AvatarVariant, Button, ButtonColor, type ButtonProps, type ButtonRadius, type ButtonSize, type ButtonVariant, Card, CardContent, type CardContentProps, CardFooter, type CardFooterProps, CardHeader, type CardHeaderProps, type CardPadding, type CardProps, type CardRadius, type CardVariant, Checkbox, type CheckboxProps, type CheckboxSize, IconButton, type IconButtonColor, type IconButtonProps, type IconButtonRadius, type IconButtonSize, type IconButtonVariant, ProgressBar, type ProgressBarColor, type ProgressBarProps, type ProgressBarThickness, type ProgressBarVariant, Radio, type RadioColor, RadioGroup, type RadioGroupProps, RadioOption, type RadioOptionProps, type RadioOrientation, type RadioProps, type RadioSize, RehagroNativeProvider, type RehagroNativeProviderProps, type RehagroNativeTheme, Select, type SelectMultipleProps, type SelectOption, type SelectProps, type SelectRadius, type SelectSingleProps, type SelectSize, type SelectStatus, Tag, type TagColor, type TagProps, type TagSize, Text, TextArea, type TextAreaBorderWidth, type TextAreaProps, type TextAreaRadius, type TextAreaSize, type TextAreaStatus, type TextColor, TextInput, type TextInputProps, type TextInputRadius, type TextInputSize, type TextInputStatus, type TextProps, type TextSize, useRehagroTheme };

package/dist/native.js

@@ -443,6 +443,118 @@ var TextInput = react.forwardRef(function TextInput2({
     )
   ] });
 });
+var TextArea = react.forwardRef(function TextArea2({
+  label,
+  subtitle,
+  status = "default",
+  size = "md",
+  radius = "xs",
+  helperText,
+  rows = 3,
+  editable = true,
+  wrapperStyle,
+  style,
+  borderColor,
+  borderWidth = "sm",
+  accessibilityLabel,
+  ...rest
+}, ref) {
+  const theme = useRehagroTheme();
+  const [focused, setFocused] = react.useState(false);
+  const isDisabled = editable === false;
+  const paddingMap2 = {
+    sm: 12,
+    md: 14,
+    lg: 16
+  };
+  const fontSizeMap = {
+    sm: 14,
+    md: 14,
+    lg: 16
+  };
+  const radiusMap2 = {
+    none: 0,
+    xxs: theme.radiusXxs ?? 4,
+    xs: theme.radiusXs ?? 8,
+    sm: theme.radiusSm ?? 12,
+    md: theme.radiusMd ?? 16,
+    lg: theme.radiusLg ?? 24,
+    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 effectiveBorderColor = hasError ? theme.danger : focused ? theme.primary : borderColor ?? theme.border;
+  const lineHeight = fontSizeMap[size] * 1.4;
+  const minHeight = lineHeight * Math.max(rows, 1) + paddingMap2[size] * 2;
+  const containerStyle = {
+    minHeight,
+    paddingHorizontal: paddingMap2[size],
+    paddingVertical: paddingMap2[size],
+    borderRadius: radiusMap2[radius],
+    borderWidth: borderWidthMap[borderWidth],
+    borderColor: effectiveBorderColor,
+    backgroundColor: isDisabled ? theme.background : theme.surface,
+    opacity: isDisabled ? 0.5 : 1
+  };
+  const inputId = accessibilityLabel ?? label;
+  return /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: [{ gap: 4 }, wrapperStyle], children: [
+    label && /* @__PURE__ */ jsxRuntime.jsxs(reactNative.View, { style: { flexDirection: "row", alignItems: "baseline", gap: 4 }, children: [
+      /* @__PURE__ */ jsxRuntime.jsx(reactNative.Text, { style: { fontSize: 14, fontWeight: "500", color: theme.text }, children: label }),
+      subtitle && /* @__PURE__ */ jsxRuntime.jsx(
+        reactNative.Text,
+        {
+          style: {
+            fontSize: 14,
+            color: subtitle.trim() === "*" ? theme.danger : theme.textMuted
+          },
+          children: subtitle
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsxRuntime.jsx(reactNative.View, { style: [containerStyle, style], children: /* @__PURE__ */ jsxRuntime.jsx(
+      reactNative.TextInput,
+      {
+        ref,
+        editable,
+        multiline: true,
+        textAlignVertical: "top",
+        accessibilityLabel: inputId,
+        accessibilityState: { disabled: isDisabled },
+        "aria-invalid": status === "error",
+        onFocus: (e) => {
+          setFocused(true);
+          rest.onFocus?.(e);
+        },
+        onBlur: (e) => {
+          setFocused(false);
+          rest.onBlur?.(e);
+        },
+        style: {
+          flex: 1,
+          fontSize: fontSizeMap[size],
+          color: theme.text
+        },
+        placeholderTextColor: theme.textMuted,
+        ...rest
+      }
+    ) }),
+    helperText && /* @__PURE__ */ jsxRuntime.jsx(
+      reactNative.Text,
+      {
+        style: {
+          fontSize: 12,
+          color: hasError ? theme.danger : theme.textMuted
+        },
+        children: helperText
+      }
+    )
+  ] });
+});
 var CheckIcon = ({ size, color }) => /* @__PURE__ */ jsxRuntime.jsx(
   reactNative.View,
   {
@@ -691,7 +803,7 @@ var ActivityIndicator3 = react.forwardRef(
     );
   }
 );
-var Text5 = react.forwardRef(function Text6({ size = "sm", color = "default", bold = false, style, children, ...rest }, ref) {
+var Text6 = react.forwardRef(function Text7({ size = "sm", color = "default", bold = false, style, children, ...rest }, ref) {
   const theme = useRehagroTheme();
   const colorMap = {
     default: theme.text ?? "#111827",
@@ -1659,7 +1771,8 @@ exports.RadioOption = RadioOption;
 exports.RehagroNativeProvider = RehagroNativeProvider;
 exports.Select = Select;
 exports.Tag = Tag;
-exports.Text = Text5;
+exports.Text = Text6;
+exports.TextArea = TextArea;
 exports.TextInput = TextInput;
 exports.useRehagroTheme = useRehagroTheme;
 //# sourceMappingURL=native.js.map