@jobber/components-native 0.84.1-JOB-131539-aa42e78.8 → 0.84.1-scotttho-e5ab79e.5

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.84.1-JOB-131539-aa42e78.8+aa42e786",
+    "version": "0.84.1-scotttho-e5ab79e.5+e5ab79e22",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -79,5 +79,5 @@
         "react-native-safe-area-context": "^5.4.0",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "aa42e7869a6ef4352d1f35e348f11ef95c53df0c"
+    "gitHead": "e5ab79e22a44c39d9568e9b89af971df893fbe8c"
 }

package/dist/src/ButtonGroup/utils.js

@@ -1,6 +1,6 @@
 import React, { useCallback } from "react";
 import { Alert } from "react-native";
-import { PrimaryAction, SecondaryAction, } from "./ButtonGroupAction";
+import { PrimaryAction, SecondaryAction } from "./ButtonGroupAction";
 import { useAtlantisContext } from "../AtlantisContext/AtlantisContext";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 /**

package/dist/src/Card/Card.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Pressable, View, } from "react-native";
+import { Pressable, View } from "react-native";
 import { useStyles } from "./Card.style";
 import { InternalCardHeader } from "./components/InternalCardHeader";
 import { ErrorMessageWrapper } from "../ErrorMessageWrapper";

package/dist/src/ErrorMessageWrapper/context/ErrorMessageProvider.js

@@ -1,5 +1,5 @@
 import React, { useState } from "react";
-import { AccessibilityInfo, findNodeHandle, } from "react-native";
+import { AccessibilityInfo, findNodeHandle } from "react-native";
 import { ErrorMessageContext } from "./ErrorMessageContext";
 export function ErrorMessageProvider({ children, }) {
     const [elements, setElements] = useState({});

package/dist/src/Form/Form.js

@@ -21,12 +21,12 @@ var __rest = (this && this.__rest) || function (s, e) {
 import React, { 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";
+import { Keyboard, Platform, View, findNodeHandle } from "react-native";
 import { useStyles } from "./Form.style";
 import { FormErrorBanner } from "./components/FormErrorBanner";
 import { KEYBOARD_SAVE_BUTTON_DISTANCE } from "./constants";
 import { FormMessageBanner } from "./components/FormMessageBanner";
-import { FormSubmitErrorType, } from "./types";
+import { FormSubmitErrorType } from "./types";
 import { FormMask } from "./components/FormMask";
 import { useInternalForm } from "./hooks/useInternalForm";
 import { useFormViewRefs } from "./hooks/useFormViewRefs";

package/dist/src/Form/components/FormSaveButton/FormSaveButton.js

@@ -9,7 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import React from "react";
 import { useFormContext } from "react-hook-form";
-import { ButtonGroup, } from "../../../ButtonGroup";
+import { ButtonGroup } from "../../../ButtonGroup";
 import { useAtlantisI18n } from "../../../hooks/useAtlantisI18n";
 export function FormSaveButton({ primaryAction, loading, label, secondaryActions, setSecondaryActionLoading, onOpenBottomSheet, onCloseBottomSheet, }) {
     const { t } = useAtlantisI18n();

package/dist/src/Form/hooks/useInternalForm.js

@@ -1,4 +1,4 @@
-import { useForm, } from "react-hook-form";
+import { useForm } from "react-hook-form";
 import { useAtlantisContext } from "../../AtlantisContext";
 import { useAtlantisFormContext } from "../context/AtlantisFormContext";
 export function useInternalForm({ mode, reValidateMode, initialValues, formRef, localCacheKey, localCacheId, scrollViewRef, saveButtonHeight, messageBannerHeight, }) {

package/dist/src/Form/hooks/useScrollToError/useScrollToError.js

@@ -1,5 +1,5 @@
 import { useCallback, useState } from "react";
-import { Keyboard, Platform, } from "react-native";
+import { Keyboard, Platform } from "react-native";
 import { useIsScreenReaderEnabled } from "../../../hooks";
 import { useErrorMessageContext } from "../../../ErrorMessageWrapper";
 export function useScrollToError({ formState: { errors, isValid, submitCount }, refNode, setFocus, scrollToPosition, }) {

package/dist/src/FormatFile/FormatFile.js

@@ -11,10 +11,10 @@ import React, { createRef, useCallback, useState } from "react";
 import { TouchableOpacity, View } from "react-native";
 import { useStyles } from "./FormatFile.style";
 import { MediaView } from "./components/MediaView";
-import { FormatFileBottomSheet, } from "./components/FormatFileBottomSheet";
+import { FormatFileBottomSheet } from "./components/FormatFileBottomSheet";
 import { FileView } from "./components/FileView";
 import { acceptedExtensions, videoExtensions } from "./constants";
-import { StatusCode, } from "./types";
+import { StatusCode } from "./types";
 import { AtlantisFormatFileContext } from "./context/FormatFileContext";
 import { createUseCreateThumbnail } from "./utils/createUseCreateThumbnail";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";

package/dist/src/Heading/Heading.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Typography, } from "../Typography";
+import { Typography } from "../Typography";
 import { tokens } from "../utils/design";
 export const HEADING_MAX_SCALED_FONT_SIZE = {
     subHeading: tokens["typography--fontSize-base"] * 1.375,

package/dist/src/InputFieldWrapper/CommonInputStyles.style.js

@@ -1,5 +1,5 @@
 import { StyleSheet } from "react-native";
-import { buildThemedStyles, } from "../AtlantisThemeContext";
+import { buildThemedStyles } from "../AtlantisThemeContext";
 import { getTypographyStyles } from "../Typography";
 import { tokens as staticTokens } from "../utils/design";
 export const createCommonInputTokens = (tokens) => {

package/dist/src/InputFieldWrapper/InputFieldWrapper.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Text as RNText, View, } from "react-native";
+import { Text as RNText, View } from "react-native";
 import { useStyles } from "./InputFieldWrapper.style";
 import { PrefixIcon, PrefixLabel } from "./components/Prefix/Prefix";
 import { SuffixIcon, SuffixLabel } from "./components/Suffix/Suffix";

package/dist/src/InputFieldWrapper/components/Prefix/Prefix.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Text as RNText, View, } from "react-native";
+import { Text as RNText, View } from "react-native";
 import { Icon } from "../../../Icon";
 import { Text } from "../../../Text";
 import { useAtlantisTheme } from "../../../AtlantisThemeContext";

package/dist/src/InputFieldWrapper/components/Suffix/Suffix.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Pressable, Text as RNText, View, } from "react-native";
+import { Pressable, Text as RNText, View } from "react-native";
 import { Icon } from "../../../Icon";
 import { Text } from "../../../Text";
 import { useTypographyStyles } from "../../../Typography";

package/dist/src/InputText/InputText.js

@@ -1,5 +1,5 @@
 import React, { forwardRef, useEffect, useImperativeHandle, useMemo, useRef, useState, } from "react";
-import { Platform, TextInput, } from "react-native";
+import { Platform, TextInput } from "react-native";
 import identity from "lodash/identity";
 import { useShowClear } from "@jobber/hooks";
 import { useStyles } from "./InputText.style";

package/dist/src/Select/Select.js

@@ -28,10 +28,10 @@ export function Select({ value, defaultValue, onChange, children, placeholder, l
         React.createElement(View, { testID: getTestID(testID), accessible: true, accessibilityLabel: getA11yLabel(), accessibilityValue: { text: getValue() }, accessibilityHint: t("Select.a11yHint"), accessibilityRole: "button", accessibilityState: { disabled: disabled } },
             React.createElement(SelectInternalPicker, { disabled: disabled, options: getOptions(), onChange: handleChange },
                 React.createElement(View, { style: [styles.container, (invalid || !!error) && styles.invalid] },
-                    label && (React.createElement(Text, { level: "textSupporting", variation: textVariation, hideFromScreenReader: true }, label)),
+                    label && (React.createElement(Text, { level: "textSupporting", variation: textVariation, hideFromScreenReader: true, selectable: false }, label)),
                     React.createElement(View, { style: styles.input },
                         React.createElement(View, { style: styles.value },
-                            React.createElement(Text, { variation: disabled ? "disabled" : "base", hideFromScreenReader: true }, getValue())),
+                            React.createElement(Text, { variation: disabled ? "disabled" : "base", hideFromScreenReader: true, selectable: false }, getValue())),
                         React.createElement(View, { style: styles.icon },
                             React.createElement(Icon, { name: "arrowDown", color: valueTextVariation }))))))));
     function getA11yLabel() {

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

@@ -4,10 +4,11 @@ import { styles } from "./SelectDefaultPicker.style";
 import { SelectPressable } from "../SelectPressable";
 import { useAtlantisTheme } from "../../../AtlantisThemeContext";
 export function SelectDefaultPicker({ children, options, disabled, onChange, }) {
+    var _a;
     const selectedItem = options.find(option => option.isActive);
     const pickerRef = useRef(null);
     const { tokens } = useAtlantisTheme();
-    return (React.createElement(SelectPressable, { onPress: () => { var _a; return (_a = pickerRef.current) === null || _a === void 0 ? void 0 : _a.focus(); } },
+    return (React.createElement(SelectPressable, { onPress: (_a = pickerRef.current) === null || _a === void 0 ? void 0 : _a.focus },
         children,
         React.createElement(Picker, { ref: pickerRef, selectedValue: selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.value, onValueChange: onChange, mode: "dropdown", enabled: !disabled, style: styles.androidPickerContainer }, options.map(({ label, value, isActive }, i) => (React.createElement(Picker.Item, { key: i, label: label, value: value, color: isSelected(isActive) }))))));
     function isSelected(isActive) {

package/dist/src/Text/Text.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { Typography, } from "../Typography";
+import { Typography } from "../Typography";
 import { tokens } from "../utils/design";
 const levelStyles = {
     text: {

package/dist/src/Typography/Typography.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { I18nManager, StyleSheet, Text, } from "react-native";
+import { I18nManager, StyleSheet, Text } from "react-native";
 import { TypographyGestureDetector } from "./TypographyGestureDetector";
 import { useTypographyStyles } from "./Typography.style";
 import { capitalize } from "../utils/intl";
@@ -47,11 +47,16 @@ function InternalTypography({ fontFamily, fontStyle, fontWeight, transform, colo
         }
         : { accessibilityRole };
     const { tokens } = useAtlantisTheme();
-    return (React.createElement(TypographyGestureDetector, null,
-        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)));
+    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));
+    // If text is not selectable, there's no need for TypographyGestureDetector
+    // since it only prevents accidental highlighting of selectable text
+    if (!selectable) {
+        return textComponent;
+    }
+    return React.createElement(TypographyGestureDetector, null, textComponent);
 }
 function getScaleMultiplier(maxFontScaleSize = 0, size = 1) {
     if (maxFontScaleSize === 0)

package/dist/src/Typography/Typography.style.js

@@ -1,7 +1,7 @@
 import { Platform, StyleSheet } from "react-native";
 import { webFonts } from "./webFonts";
 import { tokens as staticTokens } from "../utils/design";
-import { buildThemedStyles, } from "../AtlantisThemeContext";
+import { buildThemedStyles } from "../AtlantisThemeContext";
 const extravagantLineHeight = staticTokens["typography--lineHeight-extravagant"];
 const jumboLineHeight = staticTokens["typography--lineHeight-jumbo"];
 const largestLineHeight = staticTokens["typography--lineHeight-largest"];

package/dist/src/hooks/useFormController.js

@@ -1,5 +1,5 @@
 import { v1 } from "react-native-uuid";
-import { useController, useForm, useFormContext, } from "react-hook-form";
+import { useController, useForm, useFormContext } from "react-hook-form";
 import { useState } from "react";
 export function useFormController({ name, value, validations, }) {
     var _a, _b;

package/dist/src/utils/test/MockSafeAreaProvider.js

@@ -1,5 +1,5 @@
 import React from "react";
-import { SafeAreaProvider, } from "react-native-safe-area-context";
+import { SafeAreaProvider } from "react-native-safe-area-context";
 export function MockSafeAreaProvider({ frame, insets, children, }) {
     const initialFrame = { x: 0, y: 0, width: 0, height: 0 };
     const initialInsets = { bottom: 50, top: 50, left: 0, right: 0 };

package/dist/tsconfig.json

@@ -28,6 +28,7 @@
     "exclude": [
         "node_modules",
         "dist/**/*",
+        "tsconfig.eslint.json",
         "**/*.test.ts",
         "**/*.test.tsx",
     ],