@jobber/components-native 0.84.4-match-mobi-55ef4ec.7 → 0.84.4-match-mobi-540af48.10

package/dist/src/ProgressBar/ProgressBarInner.js

@@ -1,21 +1,12 @@
 import React from "react";
 import { View } from "react-native";
-// import Reanimated from "react-native-reanimated";
-// import { useTiming } from "utils/reanimated";
 import { useStyles } from "./ProgressBar.style";
-export function ProgressBarInner({ width, 
-// animationDuration = 0,
-color, }) {
-    // Animation breaking on Android
-    // const [animatedOpacity] = useTiming({
-    //   duration: animationDuration,
-    //   fromValue: 0,
-    //   toValue: 1,
-    // });
+export function ProgressBarInner({ width, color, style, testID, }) {
     const styles = useStyles();
-    return (React.createElement(View, { style: [
+    return (React.createElement(View, { testID: testID, style: [
             styles.progressBarInner,
             Object.assign({ width: `${width}%` }, (color && { backgroundColor: color })),
+            style,
         ] }));
 }
 export function calculateWidth(total, current) {

package/dist/src/ProgressBar/ProgressBarStepped.js

@@ -1,9 +1,13 @@
 import React from "react";
 import { View } from "react-native";
 import { useStyles } from "./ProgressBar.style";
-export function ProgressBarStepped({ total, current, color, loading, inProgress, }) {
+export function ProgressBarStepped({ total, current, color, loading, inProgress, UNSAFE_style, }) {
     const styles = useStyles();
-    return (React.createElement(View, { style: [styles.progressBarContainer, { height: 10 }] }, Array.from({ length: total }).map((_, index) => {
+    return (React.createElement(View, { testID: "progressbar-container", style: [
+            styles.progressBarContainer,
+            { height: 10 },
+            UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.progressBarContainer,
+        ] }, Array.from({ length: total }).map((_, index) => {
         const step = index + 1;
         const isCompleted = step <= current;
         const lastStep = step === total;
@@ -17,6 +21,7 @@ export function ProgressBarStepped({ total, current, color, loading, inProgress,
                     step <= inProgressSteps &&
                     styles.inProgressStep,
                 lastStep && { marginRight: 0 },
+                UNSAFE_style === null || UNSAFE_style === void 0 ? void 0 : UNSAFE_style.step,
             ], testID: isCompleted
                 ? "progress-step-completed"
                 : step <= inProgressSteps

package/dist/src/Select/Select.style.js

@@ -12,6 +12,7 @@ export const useStyles = buildThemedStyles(tokens => {
                 minHeight: tokens["space-largest"] + tokens["space-small"],
                 marginVertical: 0,
                 borderWidth: 0,
+                backgroundColor: "transparent",
             },
         ]),
         input: StyleSheet.flatten([

package/dist/src/Select/components/SelectPressable/SelectPressable.js

@@ -7,7 +7,7 @@ import { useIsScreenReaderEnabled } from "../../../hooks";
  * screen-reader is being used to avoid screen-readers from ignoring the press
  * on the MenuView
  */
-export function SelectPressable({ children, onPress, }) {
+export function SelectPressable({ children, onPress }) {
     const isScreenReaderEnabled = useIsScreenReaderEnabled();
     const styles = useStyles();
     if (isScreenReaderEnabled)

package/dist/src/StatusLabel/StatusLabel.style.js

@@ -5,18 +5,18 @@ export const useStyles = buildThemedStyles(tokens => {
             flexDirection: "row",
             justifyContent: "flex-end",
             alignItems: "center",
+            alignSelf: "flex-start",
             flexWrap: "nowrap",
             flexGrow: 0,
             flexShrink: 1,
             gap: tokens["space-smaller"],
             backgroundColor: tokens["color-success--surface"],
             borderRadius: tokens["radius-large"],
-            paddingVertical: tokens["space-smaller"],
+            paddingVertical: tokens["space-smallest"] + tokens["space-minuscule"],
             paddingHorizontal: tokens["space-small"],
         },
         statusLabelText: {
             flexShrink: 1,
-            marginBottom: -1,
         },
         labelTextStartAligned: {
             flexDirection: "row-reverse",

package/dist/src/Switch/components/BaseSwitch/BaseSwitch.js

@@ -4,6 +4,7 @@ import { Switch } from "react-native-gesture-handler";
 import { useFormController } from "../../../hooks";
 import { useAtlantisTheme } from "../../../AtlantisThemeContext";
 export function BaseSwitch({ value, defaultValue, onValueChange, disabled = false, accessibilityLabel, name, }) {
+    var _a;
     const { field } = useFormController({
         name,
         value: value !== null && value !== void 0 ? value : defaultValue,
@@ -43,12 +44,17 @@ export function BaseSwitch({ value, defaultValue, onValueChange, disabled = fals
             };
         }
     }
+    // Temporary fix for iOS 26. Remove when we upgrade to RN 0.81.
+    // https://github.com/facebook/react-native/pull/53389
+    const iOSBackgroundColor = Platform.OS === "ios" && ((_a = Platform.Version) === null || _a === void 0 ? void 0 : _a.startsWith("26."))
+        ? undefined
+        : tokens["color-interactive--background"];
     return (React.createElement(Switch, { value: internalValue, onValueChange: (val) => {
             if (!disabled) {
                 onValueChange === null || onValueChange === void 0 ? void 0 : onValueChange(val);
                 field.onChange(val);
             }
-        }, disabled: disabled, thumbColor: getThumbColor(), trackColor: getTrackColors(), ios_backgroundColor: tokens["color-interactive--background"], accessibilityLabel: accessibilityLabel, accessibilityRole: "switch", accessibilityState: {
+        }, disabled: disabled, thumbColor: getThumbColor(), trackColor: getTrackColors(), ios_backgroundColor: iOSBackgroundColor, accessibilityLabel: accessibilityLabel, accessibilityRole: "switch", accessibilityState: {
             disabled: disabled,
             checked: internalValue,
         } }));

package/dist/src/Typography/Typography.js

@@ -38,7 +38,7 @@ function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, colo
         style.push(UNSAFE_style.textStyle);
     }
     const numberOfLinesForNativeText = maxNumberOfLines[maxLines];
-    const text = getTransformedText(children, transform);
+    const content = transformChildren(children, transform);
     const accessibilityProps = hideFromScreenReader
         ? {
             accessibilityRole: "none",
@@ -50,7 +50,7 @@ function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, colo
     const textComponent = (React.createElement(Text, Object.assign({ allowFontScaling,
         adjustsFontSizeToFit,
         style,
-        numberOfLines: numberOfLinesForNativeText }, accessibilityProps, { maxFontSizeMultiplier: getScaleMultiplier(maxFontScaleSize, sizeAndHeight.fontSize), selectable: selectable, selectionColor: tokens["color-brand--highlight"], onTextLayout: onTextLayout }), text));
+        numberOfLines: numberOfLinesForNativeText }, accessibilityProps, { maxFontSizeMultiplier: getScaleMultiplier(maxFontScaleSize, sizeAndHeight.fontSize), selectable: selectable, selectionColor: tokens["color-brand--highlight"], onTextLayout: onTextLayout }), content));
     // If text is not selectable, there's no need for TypographyGestureDetector
     // since it only prevents accidental highlighting of selectable text
     if (!selectable) {
@@ -80,15 +80,26 @@ function getFontStyle(fontFamily = "base", fontStyle = "regular", fontWeight = "
 function getTransformedText(text, transform) {
     switch (transform) {
         case "lowercase":
-            return text === null || text === void 0 ? void 0 : text.toLocaleLowerCase();
+            return text.toLocaleLowerCase();
         case "uppercase":
-            return text === null || text === void 0 ? void 0 : text.toLocaleUpperCase();
+            return text.toLocaleUpperCase();
         case "capitalize":
-            return capitalize(text || "");
+            return capitalize(text);
         default:
             return text;
     }
 }
+function transformChildren(children, transform) {
+    if (children == null || !transform || transform === "none")
+        return children;
+    return React.Children.map(children, child => {
+        if (typeof child === "string") {
+            return getTransformedText(child, transform);
+        }
+        // Keep non-string children (numbers, elements, fragments) unchanged
+        return child;
+    });
+}
 function getColorStyle(styles, color, reverseTheme) {
     if (color === "default" || !color) {
         return styles.greyBlue;

package/dist/src/hooks/useAtlantisI18n/locales/en.json

@@ -18,6 +18,7 @@
     "goBack": "Go back",
     "InputFieldWrapper.clear": "Clear input",
     "InputPassword.enterPassword": "Enter a password",
+    "InputEmail.enterEmail": "Enter a valid email address (email@example.com)",
     "loading": "Loading",
     "menu": "Menu",
     "more": "More",

package/dist/src/hooks/useAtlantisI18n/locales/es.json

@@ -18,6 +18,7 @@
     "goBack": "Volver",
     "InputFieldWrapper.clear": "Borrar",
     "InputPassword.enterPassword": "Escriba una contraseña",
+    "InputEmail.enterEmail": "Introduzca una dirección de correo electrónico válida (email@example.com)",
     "loading": "Cargando",
     "menu": "Menú",
     "more": "Más",

package/dist/src/hooks/useFormController.js

@@ -1,8 +1,7 @@
 import { v1 } from "react-native-uuid";
-import { useController, useForm, useFormContext } from "react-hook-form";
+import { get, useController, useForm, useFormContext } from "react-hook-form";
 import { useState } from "react";
 export function useFormController({ name, value, validations, }) {
-    var _a, _b;
     const fieldName = useControlName(name);
     const form = useForm({
         mode: "onTouched",
@@ -14,21 +13,13 @@ export function useFormController({ name, value, validations, }) {
         name: fieldName,
         control,
         rules: validations,
-        defaultValue: value || undefined,
+        defaultValue: typeof value === "boolean" ? value : value || undefined,
     });
     // The naming convention established by react-hook-form for arrays of fields is, for example, "emails.0.description".
-    // This corresponds to the structure of the error object, e.g. { emails: { 0: { description: "foobar" } } }
-    // We assume here that fields will either follow this period-delimited three-part convention, or else that they are simple and indivisible (e.g. "city").
-    // TODO: Add support for two-part identifiers (e.g. "property.province")
-    const fieldIdentifiers = fieldName.split(".");
-    let error;
-    if (fieldIdentifiers.length === 3) {
-        const [section, item, identifier] = fieldIdentifiers;
-        error = (_b = (_a = errors[section]) === null || _a === void 0 ? void 0 : _a[item]) === null || _b === void 0 ? void 0 : _b[identifier];
-    }
-    else {
-        error = errors[fieldName];
-    }
+    // Preserve original behavior: only treat three-part names as nested paths.
+    // For anything else, perform a flat lookup to avoid behavioral changes.
+    const identifiers = fieldName.split(".");
+    const error = identifiers.length === 3 ? get(errors, fieldName) : errors[fieldName];
     return { error, field };
 }
 function useControlName(name) {

package/dist/tsconfig.build.json

@@ -0,0 +1,7 @@
+{
+    "extends": "./tsconfig.json",
+    "compilerOptions": {
+        // Exclude "@jobber/hooks" from paths to avoid building hooks from src
+        "paths": {}
+    }
+}