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

package/src/InputFieldWrapper/components/Prefix/Prefix.tsx

@@ -1,12 +1,7 @@
 import React from "react";
-import {
-  Text as RNText,
-  StyleProp,
-  TextStyle,
-  View,
-  ViewStyle,
-} from "react-native";
-import { IconNames } from "@jobber/design";
+import type { StyleProp, TextStyle, ViewStyle } from "react-native";
+import { Text as RNText, View } from "react-native";
+import type { IconNames } from "@jobber/design";
 import { Icon } from "../../../Icon";
 import { Text } from "../../../Text";
 import { useAtlantisTheme } from "../../../AtlantisThemeContext";

package/src/InputFieldWrapper/components/Suffix/Suffix.test.tsx

@@ -1,12 +1,8 @@
 import React from "react";
 import { render, renderHook } from "@testing-library/react-native";
-import { TextStyle } from "react-native";
-import {
-  SuffixIcon,
-  SuffixIconProps,
-  SuffixLabel,
-  SuffixLabelProps,
-} from "./Suffix";
+import type { TextStyle } from "react-native";
+import type { SuffixIconProps, SuffixLabelProps } from "./Suffix";
+import { SuffixIcon, SuffixLabel } from "./Suffix";
 import { useTypographyStyles } from "../../../Typography";
 
 const mockLabel = "$";

package/src/InputFieldWrapper/components/Suffix/Suffix.tsx

@@ -1,12 +1,7 @@
 import React from "react";
-import {
-  Pressable,
-  Text as RNText,
-  StyleProp,
-  TextStyle,
-  View,
-} from "react-native";
-import { IconNames } from "@jobber/design";
+import type { StyleProp, TextStyle } from "react-native";
+import { Pressable, Text as RNText, View } from "react-native";
+import type { IconNames } from "@jobber/design";
 import { Icon } from "../../../Icon";
 import { Text } from "../../../Text";
 import { useTypographyStyles } from "../../../Typography";

package/src/InputNumber/InputNumber.tsx

@@ -1,8 +1,10 @@
-import React, { Ref, forwardRef, useState } from "react";
+import type { Ref } from "react";
+import React, { forwardRef, useState } from "react";
 import { Platform } from "react-native";
 import flow from "lodash/flow";
 import identity from "lodash/identity";
-import { InputText, InputTextProps, InputTextRef } from "../InputText";
+import type { InputTextProps, InputTextRef } from "../InputText";
+import { InputText } from "../InputText";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 
 type NumberKeyboard = "decimal-pad" | "numbers-and-punctuation";

package/src/InputPassword/InputPassword.test.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { fireEvent, render, waitFor } from "@testing-library/react-native";
 import { InputPassword } from "./InputPassword";
-import { InputFieldWrapperProps } from "../InputFieldWrapper";
+import type { InputFieldWrapperProps } from "../InputFieldWrapper";
 
 const MockInputFieldWrapper = jest.fn();
 jest.mock("../InputFieldWrapper", () => ({

package/src/InputPassword/InputPassword.tsx

@@ -1,6 +1,8 @@
-import React, { Ref, forwardRef, useState } from "react";
-import { IconNames } from "@jobber/design";
-import { InputText, InputTextProps, InputTextRef } from "../InputText";
+import type { Ref } from "react";
+import React, { forwardRef, useState } from "react";
+import type { IconNames } from "@jobber/design";
+import type { InputTextProps, InputTextRef } from "../InputText";
+import { InputText } from "../InputText";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 
 export const InputPassword = forwardRef(InputPasswordInternal);

package/src/InputPressable/InputPressable.test.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
 import { InputPressable } from ".";
-import { InputFieldWrapperProps } from "../InputFieldWrapper";
+import type { InputFieldWrapperProps } from "../InputFieldWrapper";
 
 const MockInputFieldWrapper = jest.fn();
 jest.mock("../InputFieldWrapper", () => ({

package/src/InputPressable/InputPressable.tsx

@@ -1,9 +1,11 @@
-import React, { Ref, forwardRef, useEffect, useState } from "react";
-import { IconNames } from "@jobber/design";
-import { FieldError } from "react-hook-form";
+import type { Ref } from "react";
+import React, { forwardRef, useEffect, useState } from "react";
+import type { IconNames } from "@jobber/design";
+import type { FieldError } from "react-hook-form";
 import { Text as NativeText, Pressable } from "react-native";
-import { Clearable, useShowClear } from "@jobber/hooks";
-import { XOR } from "ts-xor";
+import type { Clearable } from "@jobber/hooks";
+import { useShowClear } from "@jobber/hooks";
+import type { XOR } from "ts-xor";
 import { useStyles } from "./InputPressable.style";
 import { InputFieldWrapper, useCommonInputStyles } from "../InputFieldWrapper";
 

package/src/InputSearch/InputSearch.tsx

@@ -1,8 +1,10 @@
-import React, { Ref, forwardRef, useEffect } from "react";
+import type { Ref } from "react";
+import React, { forwardRef, useEffect } from "react";
 import { View } from "react-native";
 import { useDebounce } from "@jobber/hooks/useDebounce";
 import { styles } from "./InputSearch.style";
-import { InputText, InputTextProps, InputTextRef } from "../InputText";
+import type { InputTextProps, InputTextRef } from "../InputText";
+import { InputText } from "../InputText";
 
 export const InputSearch = forwardRef(SearchInputInternal);
 

package/src/InputText/InputText.test.tsx

@@ -1,20 +1,19 @@
 import React, { useEffect } from "react";
+import type { RenderAPI } from "@testing-library/react-native";
 import {
-  RenderAPI,
   fireEvent,
   render,
   renderHook,
   waitFor,
 } from "@testing-library/react-native";
-import { Platform, TextStyle } from "react-native";
+import type { TextStyle } from "react-native";
+import { Platform } from "react-native";
 import { FormProvider, useForm } from "react-hook-form";
-import { InputText, InputTextProps } from "./InputText";
+import type { InputTextProps } from "./InputText";
+import { InputText } from "./InputText";
 import { InputAccessoriesProvider } from "./context";
-import {
-  Clearable,
-  InputFieldWrapperProps,
-  useCommonInputStyles,
-} from "../InputFieldWrapper";
+import type { Clearable, InputFieldWrapperProps } from "../InputFieldWrapper";
+import { useCommonInputStyles } from "../InputFieldWrapper";
 
 const MockInputFieldWrapper = jest.fn();
 jest.mock("../InputFieldWrapper", () => ({

package/src/InputText/InputText.tsx

@@ -1,6 +1,5 @@
+import type { Ref, SyntheticEvent } from "react";
 import React, {
-  Ref,
-  SyntheticEvent,
   forwardRef,
   useEffect,
   useImperativeHandle,
@@ -8,24 +7,24 @@ import React, {
   useRef,
   useState,
 } from "react";
-import {
+import type {
   NativeSyntheticEvent,
-  Platform,
   ReturnKeyTypeOptions,
   StyleProp,
-  TextInput,
   TextInputFocusEventData,
   TextInputProps,
   TextStyle,
 } from "react-native";
-import { RegisterOptions } from "react-hook-form";
-import { IconNames } from "@jobber/design";
+import { Platform, TextInput } from "react-native";
+import type { RegisterOptions } from "react-hook-form";
+import type { IconNames } from "@jobber/design";
 import identity from "lodash/identity";
-import { Clearable, useShowClear } from "@jobber/hooks";
+import type { Clearable } from "@jobber/hooks";
+import { useShowClear } from "@jobber/hooks";
 import { useStyles } from "./InputText.style";
 import { useInputAccessoriesContext } from "./context";
 import { useFormController } from "../hooks";
-import {
+import type {
   InputFieldStyleOverride,
   InputFieldWrapperProps,
 } from "../InputFieldWrapper/InputFieldWrapper";

package/src/InputText/context/InputAccessoriesContext.ts

@@ -1,5 +1,5 @@
 import { createContext, useContext } from "react";
-import { InputAccessoriesContextProps } from "./types";
+import type { InputAccessoriesContextProps } from "./types";
 
 const inputAccessoriesContextDefaultValues: InputAccessoriesContextProps = {
   elements: {},

package/src/InputText/context/InputAccessoriesProvider.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode, useEffect, useRef, useState } from "react";
+import type { ReactNode } from "react";
+import React, { useEffect, useRef, useState } from "react";
 import {
   InputAccessoryView,
   Keyboard,

package/src/InputTime/InputTime.tsx

@@ -1,15 +1,15 @@
 import React, { useMemo, useState } from "react";
-import { FieldError, UseControllerProps } from "react-hook-form";
-import { XOR } from "ts-xor";
+import type { FieldError, UseControllerProps } from "react-hook-form";
+import type { XOR } from "ts-xor";
 import DateTimePicker from "react-native-modal-datetime-picker";
 import { Keyboard, View } from "react-native";
-import { Clearable } from "@jobber/hooks";
+import type { Clearable } from "@jobber/hooks";
 import { styles } from "./InputTime.style";
 import { getTimeZoneOffsetInMinutes, roundUpToNearestMinutes } from "./utils";
 import { useAtlantisContext } from "../AtlantisContext";
 import { InputPressable } from "../InputPressable";
 import { FormField } from "../FormField";
-import { InputFieldWrapperProps } from "../InputFieldWrapper";
+import type { InputFieldWrapperProps } from "../InputFieldWrapper";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 
 interface InputTimeBaseProps

package/src/InputTime/utils/utils.test.ts

@@ -1,9 +1,6 @@
 import { set } from "date-fns";
-import {
-  MinutesIncrement,
-  getTimeZoneOffsetInMinutes,
-  roundUpToNearestMinutes,
-} from ".";
+import type { MinutesIncrement } from ".";
+import { getTimeZoneOffsetInMinutes, roundUpToNearestMinutes } from ".";
 
 describe("roundUpToNearestMinutes", () => {
   it.each<[MinutesIncrement, Record<string, number>]>([

package/src/Menu/Menu.test.tsx

@@ -2,7 +2,8 @@ import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
 import { Host } from "react-native-portalize";
 import { View } from "react-native";
-import { Menu, MenuOptionProps, MenuProps } from ".";
+import type { MenuOptionProps, MenuProps } from ".";
+import { Menu } from ".";
 import { tokens } from "../utils/design";
 import { Icon } from "../Icon";
 import { Button } from "../Button";

package/src/Menu/Menu.tsx

@@ -1,7 +1,7 @@
 import React, { useCallback, useRef, useState } from "react";
+import type { LayoutRectangle } from "react-native";
 import {
   Keyboard,
-  LayoutRectangle,
   Platform,
   Pressable,
   View,
@@ -11,7 +11,7 @@ import { Portal } from "react-native-portalize";
 import { useSafeAreaFrame } from "react-native-safe-area-context";
 import { useStyles } from "./Menu.style";
 import { findViewpoint } from "./utils";
-import { MenuProps } from "./types";
+import type { MenuProps } from "./types";
 import { MenuOption } from "./components/MenuOption";
 import { Overlay } from "./components/Overlay";
 import { Button } from "../Button";

package/src/Menu/components/MenuOption/MenuOption.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { Pressable, View } from "react-native";
 import capitalize from "lodash/capitalize";
 import { useStyles } from "./MenuOption.style";
-import { MenuOptionInternalProps } from "../../types";
+import type { MenuOptionInternalProps } from "../../types";
 import { Flex } from "../../../Flex";
 import { Typography } from "../../../Typography";
 import { Icon } from "../../../Icon";

package/src/Menu/components/Overlay/Overlay.tsx

@@ -1,7 +1,7 @@
 import React from "react";
 import { Pressable, View } from "react-native";
 import { useStyles } from "./Overlay.style";
-import { OverlayProp } from "../../types";
+import type { OverlayProp } from "../../types";
 
 export function Overlay({ setOpen }: OverlayProp): JSX.Element {
   const styles = useStyles();

package/src/Menu/types.ts

@@ -1,5 +1,5 @@
-import { IconColorNames, IconNames } from "@jobber/design";
-import { TextAlign } from "../Typography";
+import type { IconColorNames, IconNames } from "@jobber/design";
+import type { TextAlign } from "../Typography";
 
 export interface MenuOptionProps {
   readonly label: string;

package/src/Menu/utils.ts

@@ -1,5 +1,5 @@
-import { LayoutRectangle } from "react-native";
-import { useStyles } from "./Menu.style";
+import type { LayoutRectangle } from "react-native";
+import type { useStyles } from "./Menu.style";
 
 interface ScreenInfo {
   windowHeight: number;

package/src/ProgressBar/ProgressBar.test.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { render, screen } from "@testing-library/react-native";
-import { ProgressBar, ProgressBarProps } from ".";
+import type { ProgressBarProps } from ".";
+import { ProgressBar } from ".";
 
 const defaultSetupProps = {
   total: 0,

package/src/ProgressBar/ProgressBar.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { View } from "react-native";
-import { ProgressBarProps } from "./types";
+import type { ProgressBarProps } from "./types";
 import { useStyles } from "./ProgressBar.style";
 import { ProgressBarInner, calculateWidth } from "./ProgressBarInner";
 import { ProgressBarStepped } from "./ProgressBarStepped";

package/src/ProgressBar/types.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
 
 export interface ProgressBarProps {
   /**

package/src/Select/Select.test.tsx

@@ -1,5 +1,6 @@
 import React from "react";
-import { RenderAPI, fireEvent, render } from "@testing-library/react-native";
+import type { RenderAPI } from "@testing-library/react-native";
+import { fireEvent, render } from "@testing-library/react-native";
 import { tokens } from "@jobber/design/foundation";
 import { AccessibilityInfo } from "react-native";
 import { Option, Select } from ".";

package/src/Select/Select.tsx

@@ -1,11 +1,12 @@
-import React, { ReactElement } from "react";
+import type { ReactElement } from "react";
+import React from "react";
 import { View } from "react-native";
-import { RegisterOptions } from "react-hook-form";
+import type { RegisterOptions } from "react-hook-form";
 import { useStyles } from "./Select.style";
 import { SelectInternalPicker } from "./components/SelectInternalPicker";
 import { InputFieldWrapper } from "../InputFieldWrapper";
 import { Icon } from "../Icon";
-import { TextVariation } from "../Typography";
+import type { TextVariation } from "../Typography";
 import { Text } from "../Text";
 import { useFormController } from "../hooks";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
@@ -158,6 +159,7 @@ export function Select({
                 level="textSupporting"
                 variation={textVariation}
                 hideFromScreenReader={true}
+                selectable={false}
               >
                 {label}
               </Text>
@@ -167,6 +169,7 @@ export function Select({
                 <Text
                   variation={disabled ? "disabled" : "base"}
                   hideFromScreenReader={true}
+                  selectable={false}
                 >
                   {getValue()}
                 </Text>

package/src/Select/components/SelectDefaultPicker/SelectDefaultPicker.ios.tsx

@@ -9,7 +9,7 @@ import {
 import { Picker } from "@react-native-picker/picker";
 import { SafeAreaView } from "react-native-safe-area-context";
 import { styles } from "./SelectDefaultPicker.style";
-import { SelectInternalPickerProps } from "../../types";
+import type { SelectInternalPickerProps } from "../../types";
 import { SelectPressable } from "../SelectPressable/SelectPressable";
 import { useAtlantisI18n } from "../../../hooks/useAtlantisI18n";
 

package/src/Select/components/SelectDefaultPicker/SelectDefaultPicker.tsx

@@ -1,7 +1,7 @@
 import React, { useRef } from "react";
 import { Picker } from "@react-native-picker/picker";
 import { styles } from "./SelectDefaultPicker.style";
-import { SelectInternalPickerProps } from "../../types";
+import type { SelectInternalPickerProps } from "../../types";
 import { SelectPressable } from "../SelectPressable";
 import { useAtlantisTheme } from "../../../AtlantisThemeContext";
 
@@ -18,7 +18,7 @@ export function SelectDefaultPicker({
   const { tokens } = useAtlantisTheme();
 
   return (
-    <SelectPressable onPress={() => pickerRef.current?.focus()}>
+    <SelectPressable onPress={pickerRef.current?.focus}>
       {children}
       <Picker
         ref={pickerRef}

package/src/Select/components/SelectIOSPicker/SelectIOSPicker.tsx

@@ -1,5 +1,6 @@
-import { HostComponent, requireNativeComponent } from "react-native";
-import {
+import type { HostComponent } from "react-native";
+import { requireNativeComponent } from "react-native";
+import type {
   SelectInternalPickerProps,
   SelectOnOptionPressEvent,
 } from "../../types";

package/src/Select/components/SelectInternalPicker/SelectInternalPicker.test.tsx

@@ -1,8 +1,9 @@
-import React, { ElementType } from "react";
+import type { ElementType } from "react";
+import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
 import { View } from "react-native";
 import { SelectInternalPicker } from ".";
-import { SelectInternalPickerProps } from "../../types";
+import type { SelectInternalPickerProps } from "../../types";
 import { Text } from "../../../Text";
 
 let Platform: { OS: "ios" | "android"; Version: string | number };

package/src/Select/components/SelectInternalPicker/SelectInternalPicker.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { handlePress, isIOS14AndUp } from "./utils";
-import { SelectInternalPickerProps } from "../../types";
+import type { SelectInternalPickerProps } from "../../types";
 import { SelectIOSPicker } from "../SelectIOSPicker";
 import { SelectPressable } from "../SelectPressable";
 import { SelectDefaultPicker } from "../SelectDefaultPicker";

package/src/Select/components/SelectInternalPicker/utils.ts

@@ -1,5 +1,5 @@
 import { Platform } from "react-native";
-import {
+import type {
   SelectInternalPickerProps,
   SelectOnOptionPressEvent,
 } from "../../types";

package/src/Select/components/SelectPressable/SelectPressable.tsx

@@ -1,7 +1,8 @@
 import React from "react";
-import { Keyboard, Pressable, PressableProps } from "react-native";
+import type { PressableProps } from "react-native";
+import { Keyboard, Pressable } from "react-native";
 import { useStyles } from "./SelectPressable.style";
-import { SelectInternalPickerProps } from "../../types";
+import type { SelectInternalPickerProps } from "../../types";
 import { useIsScreenReaderEnabled } from "../../../hooks";
 
 type SelectPressableProps = Pick<SelectInternalPickerProps, "children"> &

package/src/Select/index.ts

@@ -1 +1,2 @@
-export { Select, Option, SelectOption, SelectProps } from "./Select";
+export type { SelectOption, SelectProps } from "./Select";
+export { Select, Option } from "./Select";

package/src/Select/types.ts

@@ -1,4 +1,4 @@
-import { ReactNode } from "react";
+import type { ReactNode } from "react";
 
 export interface SelectInternalPickerProps {
   /**

package/src/Switch/Switch.test.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
-import { ViewStyle } from "react-native";
+import type { ViewStyle } from "react-native";
 import { Switch } from "./Switch";
 
 it("renders a labeled Switch with value true", () => {

package/src/Switch/Switch.tsx

@@ -1,7 +1,8 @@
 import React, { useState } from "react";
 import { View } from "react-native";
-import { XOR } from "ts-xor";
-import { BaseSwitch, BaseSwitchProps } from "./components/BaseSwitch";
+import type { XOR } from "ts-xor";
+import type { BaseSwitchProps } from "./components/BaseSwitch";
+import { BaseSwitch } from "./components/BaseSwitch";
 import { useStyles } from "./Switch.styles";
 import { Text } from "../Text";
 

package/src/Switch/index.ts

@@ -1 +1,2 @@
-export { Switch, SwitchProps } from "./Switch";
+export type { SwitchProps } from "./Switch";
+export { Switch } from "./Switch";

package/src/Text/Text.test.tsx

@@ -196,3 +196,26 @@ describe("onTextLayout", () => {
     expect(onTextLayoutMock).toHaveBeenCalledWith(mockEvent);
   });
 });
+
+describe("TypographyGestureDetector", () => {
+  it("wraps text with TypographyGestureDetector by default (collapsable=false)", () => {
+    const { getByRole } = render(<Text>Test Text</Text>);
+    const textElement = getByRole("text");
+
+    expect(textElement.props.collapsable).toBe(false);
+  });
+
+  it("wraps text with TypographyGestureDetector (collapsable=false) when selectable=true", () => {
+    const { getByRole } = render(<Text selectable={true}>Test Text</Text>);
+    const textElement = getByRole("text");
+
+    expect(textElement.props.collapsable).toBe(false);
+  });
+
+  it("does not wrap text with TypographyGestureDetector when selectable=false", () => {
+    const { getByRole } = render(<Text selectable={false}>Test Text</Text>);
+    const textElement = getByRole("text");
+
+    expect(textElement.props.collapsable).toBeUndefined();
+  });
+});

package/src/Text/Text.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import {
+import type {
   BaseWeight,
   LineHeight,
   OnTextLayoutEvent,
@@ -8,11 +8,11 @@ import {
   TextSize,
   TextVariation,
   TruncateLength,
-  Typography,
   TypographyProps,
 } from "../Typography";
+import { Typography } from "../Typography";
 import { tokens } from "../utils/design";
-import { TypographyUnsafeStyle } from "../Typography/Typography";
+import type { TypographyUnsafeStyle } from "../Typography/Typography";
 
 export interface TextProps
   extends Pick<TypographyProps<"base">, "maxFontScaleSize" | "selectable"> {

package/src/Text/index.ts

@@ -1 +1,2 @@
-export { Text, TextLevel, TEXT_MAX_SCALED_FONT_SIZES } from "./Text";
+export type { TextLevel } from "./Text";
+export { Text, TEXT_MAX_SCALED_FONT_SIZES } from "./Text";

package/src/TextList/TextList.tsx

@@ -1,8 +1,10 @@
 import React from "react";
 import { View } from "react-native";
 import { useStyles } from "./TextList.style";
-import { Content, Spacing } from "../Content";
-import { Text, TextLevel } from "../Text";
+import type { Spacing } from "../Content";
+import { Content } from "../Content";
+import type { TextLevel } from "../Text";
+import { Text } from "../Text";
 
 const BULLET_SYMBOL = `\u2022`;
 

package/src/ThumbnailList/ThumbnailList.test.tsx

@@ -2,7 +2,7 @@ import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
 import { Host } from "react-native-portalize";
 import { ThumbnailList } from "./ThumbnailList";
-import { File } from "../FormatFile/types";
+import type { File } from "../FormatFile/types";
 
 const snapshotFile: File[] = [
   {

package/src/ThumbnailList/ThumbnailList.tsx

@@ -1,9 +1,11 @@
 import React from "react";
 import { View } from "react-native";
 import isNil from "lodash/isNil";
-import { RowCount, ThumbnailListProps } from "./types";
+import type { ThumbnailListProps } from "./types";
+import { RowCount } from "./types";
 import { useStyles } from "./ThumbnailList.style";
-import { File, FormatFile } from "../FormatFile";
+import type { File } from "../FormatFile";
+import { FormatFile } from "../FormatFile";
 
 function isImage(file: File) {
   return !!file.contentType && file.contentType.includes("image/");

package/src/ThumbnailList/types.ts

@@ -1,4 +1,4 @@
-import { CreateThumbnail, File } from "../FormatFile";
+import type { CreateThumbnail, File } from "../FormatFile";
 
 export enum RowCount {
   TwoRows = 2,

package/src/Toast/Toast.tsx

@@ -1,9 +1,10 @@
 import React from "react";
-import Toast, {
+import type {
   ToastConfig,
   ToastConfigParams,
   ToastPosition,
 } from "react-native-toast-message";
+import Toast from "react-native-toast-message";
 import { AccessibilityInfo, TouchableOpacity, View } from "react-native";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { useStyles } from "./Toast.styles";