@jobber/components-native 0.95.2-JOB-141866-acfcddc.7 → 0.95.2-JOB-141866-990fa70.9

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.95.2-JOB-141866-acfcddc.7+acfcddc57",
+    "version": "0.95.2-JOB-141866-990fa70.9+990fa7081",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -96,5 +96,5 @@
         "react-native-safe-area-context": "^5.4.0",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "acfcddc57c91d179ef43e2ed44fd25bd3cae6405"
+    "gitHead": "990fa708191391b1d9f973c5eccd4dd8ec532424"
 }

package/dist/src/Form/Form.js

@@ -18,7 +18,7 @@ var __rest = (this && this.__rest) || function (s, e) {
         }
     return t;
 };
-import React, { useState } from "react";
+import React, { useMemo, useState } from "react";
 import { FormProvider } from "react-hook-form";
 import { KeyboardAwareScrollView } from "react-native-keyboard-aware-scroll-view";
 import { Keyboard, Platform, View, findNodeHandle } from "react-native";
@@ -82,8 +82,11 @@ function InternalForm({ children, onBeforeSubmit, onSubmit, onSubmitError, onSub
         keyboardScreenY,
     });
     const [isSecondaryActionLoading, setIsSecondaryActionLoading] = useState(false);
-    const extraViewHeight = paddingBottom + KEYBOARD_SAVE_BUTTON_DISTANCE;
-    const calculatedKeyboardHeight = keyboardHeight - extraViewHeight;
+    const { calculatedKeyboardHeight } = useMemo(() => {
+        return {
+            calculatedKeyboardHeight: keyboardHeight - (paddingBottom + KEYBOARD_SAVE_BUTTON_DISTANCE),
+        };
+    }, [paddingBottom, keyboardHeight]);
     useScrollToError({
         formState: formMethods.formState,
         refNode: findNodeHandle(scrollViewRef.current),

package/dist/src/InputText/InputText.js

@@ -7,14 +7,6 @@ import { useInputAccessoriesContext } from "./context";
 import { useFormController } from "../hooks";
 import { InputFieldWrapper } from "../InputFieldWrapper";
 import { useCommonInputStyles } from "../InputFieldWrapper/CommonInputStyles.style";
-import { useScreenInformation } from "../Form/hooks/useScreenInformation";
-/**
- * Buffer zone in pixels for offscreen detection.
- * This makes the detection more sensitive by marking the component as offscreen
- * even if it's technically still visible but within this buffer distance from the edge.
- */
-// 44 (accessory bar height) + 20 (buffer)
-const KEYBOARD_AWARE_DETECTION_BUFFER = 64;
 export const InputText = forwardRef(InputTextInternal);
 // eslint-disable-next-line max-statements
 function InputTextInternal({ invalid, disabled, readonly = false, name, placeholder, assistiveText, showMiniLabel = true, keyboard, value: controlledValue, defaultValue, autoFocus, autoComplete = "off", spellCheck, textContentType = "none", validations, onChangeText, onSubmitEditing, onFocus, accessibilityLabel, accessibilityHint, autoCorrect, autoCapitalize, onBlur, multiline = false, prefix, suffix, transform = {}, clearable = multiline ? "never" : "while-editing", testID, secureTextEntry, styleOverride, toolbar, toolbarVisibility, loading, loadingType, }, ref) {
@@ -48,7 +40,7 @@ function InputTextInternal({ invalid, disabled, readonly = false, name, placehol
         placeholderTextColor: "transparent",
     }));
     const _name = name !== null && name !== void 0 ? name : field.name;
-    const { inputAccessoryID, register, unregister, setFocusedInput, canFocusNext, onFocusNext, isScrolling, } = useInputAccessoriesContext();
+    const { inputAccessoryID, register, unregister, setFocusedInput, canFocusNext, isScrolling, onFocusNext, } = useInputAccessoriesContext();
     useEffect(() => {
         _name &&
             register(_name, () => {
@@ -83,23 +75,40 @@ function InputTextInternal({ invalid, disabled, readonly = false, name, placehol
     }
     const styles = useStyles();
     const commonInputStyles = useCommonInputStyles();
-    const { headerHeight, windowHeight } = useScreenInformation();
+    // const { headerHeight, windowHeight } = useScreenInformation();
     // State to track if the InputText component can fully fit on screen
     // (i.e., it's completely visible). Use this state to handle visibility issues.
-    const [canFullyFitOnScreen, setCanFullyFitOnScreen] = useState(true);
+    // const [canFullyFitOnScreen, setCanFullyFitOnScreen] = useState(true);
     return (React.createElement(InputFieldWrapper, { prefix: prefix, suffix: suffix, hasValue: hasValue, placeholderMode: placeholderMode, assistiveText: assistiveText, focused: focused, error: error, invalid: invalid, placeholder: placeholder, disabled: disabled, onClear: handleClear, showClearAction: showClear, styleOverride: styleOverride, toolbar: toolbar, toolbarVisibility: toolbarVisibility, loading: loading, loadingType: loadingType },
-        React.createElement(TextInput, Object.assign({ onLayout: (event) => {
-                var _a;
-                (_a = event.target) === null || _a === void 0 ? void 0 : _a.measureInWindow((_, y, __, height) => {
-                    // Check if component can't fully fit on screen (height only)
-                    // Account for headerHeight at the top of the screen and buffer zone
-                    const visibleTop = headerHeight + KEYBOARD_AWARE_DETECTION_BUFFER; // Top of visible area (below header) with buffer
-                    const visibleBottom = windowHeight - KEYBOARD_AWARE_DETECTION_BUFFER; // Bottom of visible area with buffer
-                    const isOffScreen = y < visibleTop || // Top edge is behind or above the header (with buffer)
-                        y + height > visibleBottom; // Bottom edge is below the window (with buffer)
-                    setCanFullyFitOnScreen(!isOffScreen);
-                });
-            }, inputAccessoryViewID: inputAccessoryID || undefined, testID: testID, autoCapitalize: autoCapitalize, autoCorrect: autoCorrect, spellCheck: spellCheck, style: [
+        React.createElement(TextInput
+        // onLayout={(event: LayoutChangeEvent) => {
+        //   event.target?.measureInWindow((_, y, __, height) => {
+        //     // Check if component can't fully fit on screen (height only)
+        //     // Account for headerHeight at the top of the screen and buffer zone
+        //     const visibleTop = headerHeight + KEYBOARD_AWARE_DETECTION_BUFFER; // Top of visible area (below header) with buffer
+        //     const visibleBottom =
+        //       windowHeight - KEYBOARD_AWARE_DETECTION_BUFFER; // Bottom of visible area with buffer
+        //     const isOffScreen =
+        //       y < visibleTop || // Top edge is behind or above the header (with buffer)
+        //       y + height > visibleBottom; // Bottom edge is below the window (with buffer)
+        //     setCanFullyFitOnScreen(!isOffScreen);
+        //   });
+        // }}
+        , Object.assign({ 
+            // onLayout={(event: LayoutChangeEvent) => {
+            //   event.target?.measureInWindow((_, y, __, height) => {
+            //     // Check if component can't fully fit on screen (height only)
+            //     // Account for headerHeight at the top of the screen and buffer zone
+            //     const visibleTop = headerHeight + KEYBOARD_AWARE_DETECTION_BUFFER; // Top of visible area (below header) with buffer
+            //     const visibleBottom =
+            //       windowHeight - KEYBOARD_AWARE_DETECTION_BUFFER; // Bottom of visible area with buffer
+            //     const isOffScreen =
+            //       y < visibleTop || // Top edge is behind or above the header (with buffer)
+            //       y + height > visibleBottom; // Bottom edge is below the window (with buffer)
+            //     setCanFullyFitOnScreen(!isOffScreen);
+            //   });
+            // }}
+            inputAccessoryViewID: inputAccessoryID || undefined, testID: testID, autoCapitalize: autoCapitalize, autoCorrect: autoCorrect, spellCheck: spellCheck, style: [
                 commonInputStyles.input,
                 styles.inputPaddingTop,
                 !miniLabelActive && commonInputStyles.inputEmpty,
@@ -122,7 +131,7 @@ function InputTextInternal({ invalid, disabled, readonly = false, name, placehol
             // State for tracking if the input should be scrollable.
             // This is tech debt related to an issue where keyboard aware scrollview doesn't work if `scrollEnabled` is true. However,
             // when `scrollEnabled` is false it causes an issue where super long text inputs will jump to the top when a new line is added to the bottom of the input.
-            scrollEnabled: Platform.OS === "ios" && !canFullyFitOnScreen, textContentType: textContentType, onChangeText: handleChangeText, onSubmitEditing: handleOnSubmitEditing, returnKeyType: returnKeyType, blurOnSubmit: shouldBlurOnSubmit, accessibilityLabel: accessibilityLabel || placeholder, accessibilityHint: accessibilityHint, accessibilityState: { busy: loading }, secureTextEntry: secureTextEntry }, androidA11yProps, { onFocus: event => {
+            scrollEnabled: Platform.OS === "ios", textContentType: textContentType, onChangeText: handleChangeText, onSubmitEditing: handleOnSubmitEditing, returnKeyType: returnKeyType, blurOnSubmit: shouldBlurOnSubmit, accessibilityLabel: accessibilityLabel || placeholder, accessibilityHint: accessibilityHint, accessibilityState: { busy: loading }, secureTextEntry: secureTextEntry }, androidA11yProps, { onFocus: event => {
                 _name && setFocusedInput(_name);
                 setFocused(true);
                 onFocus === null || onFocus === void 0 ? void 0 : onFocus(event);