@jobber/components-native 0.84.1 → 0.84.2-CLEANUPus-25aa17e.18

package/src/AutoLink/components/ComposeTextWithLinks/ComposeTextWithLinks.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { Platform } from "react-native";
-import { ComposeTextWithLinksProps } from "../../types";
+import type { ComposeTextWithLinksProps } from "../../types";
 import { onLongPressLink, onPressLink } from "../../utils";
 import { Link } from "../Link/Link";
 import { Text } from "../../../Text";

package/src/AutoLink/hooks/useCreateLinkedText.ts

@@ -1,4 +1,5 @@
-import Autolinker, { Match } from "autolinker";
+import type { Match } from "autolinker";
+import Autolinker from "autolinker";
 import { useTokenGenerator } from "./useTokenGenerator";
 import { shouldIgnoreURL } from "../utils";
 

package/src/AutoLink/types.ts

@@ -1,5 +1,5 @@
-import { Match } from "autolinker";
-import { TextProps } from "react-native";
+import type { Match } from "autolinker";
+import type { TextProps } from "react-native";
 
 export interface AutoLinkProps extends Pick<TextProps, "selectable"> {
   /**

package/src/AutoLink/utils.ts

@@ -1,7 +1,7 @@
-import { EmailMatch, Match, PhoneMatch } from "autolinker";
+import type { EmailMatch, Match, PhoneMatch } from "autolinker";
 import { Linking } from "react-native";
 import { copyTextToClipboard } from "./clipboard";
-import { I18nKeys, useAtlantisI18nValue } from "../hooks/useAtlantisI18n";
+import type { I18nKeys, useAtlantisI18nValue } from "../hooks/useAtlantisI18n";
 
 function hasPrefix(text: string, prefixes: string[]): boolean {
   return prefixes.some(prefix => text.includes(prefix));

package/src/Banner/Banner.tsx

@@ -1,7 +1,8 @@
-import React, { PropsWithChildren, ReactElement } from "react";
+import type { PropsWithChildren, ReactElement } from "react";
+import React from "react";
 import { Pressable, Text as RNText, View } from "react-native";
-import { IconNames } from "@jobber/design";
-import { BannerProps, BannerTypes } from "./types";
+import type { IconNames } from "@jobber/design";
+import type { BannerProps, BannerTypes } from "./types";
 import { useStyles } from "./Banner.style";
 import { BannerIcon } from "./components/BannerIcon/BannerIcon";
 import { Content } from "../Content";

package/src/Banner/components/BannerIcon/BannerIcon.tsx

@@ -1,9 +1,9 @@
 import React from "react";
-import { IconNames } from "@jobber/design";
+import type { IconNames } from "@jobber/design";
 import { View } from "react-native";
 import { useStyles } from "./BannerIcon.style";
 import { Icon } from "../../../Icon";
-import { BannerTypes } from "../../types";
+import type { BannerTypes } from "../../types";
 
 export interface BannerIconProps {
   readonly icon: IconNames;

package/src/Banner/types.ts

@@ -1,6 +1,6 @@
-import { IconNames } from "@jobber/design";
-import { ReactElement } from "react";
-import { StyleProp, ViewStyle } from "react-native";
+import type { IconNames } from "@jobber/design";
+import type { ReactElement } from "react";
+import type { StyleProp, ViewStyle } from "react-native";
 
 export type BannerTypes = "error" | "warning" | "notice";
 

package/src/BottomSheet/BottomSheet.test.tsx

@@ -3,7 +3,7 @@ import { act, fireEvent, render, waitFor } from "@testing-library/react-native";
 import { AccessibilityInfo, View } from "react-native";
 import { Host, Portal } from "react-native-portalize";
 import { BottomSheet } from ".";
-import { BottomSheetRef } from "./BottomSheet";
+import type { BottomSheetRef } from "./BottomSheet";
 import { waitForUntestableRender } from "../utils/test/wait";
 import { Text } from "../Text";
 

package/src/BottomSheet/BottomSheet.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode, Ref, RefObject, forwardRef, useState } from "react";
+import type { ReactNode, Ref, RefObject } from "react";
+import React, { forwardRef, useState } from "react";
 import { Modalize } from "react-native-modalize";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
 import { Keyboard, View } from "react-native";

package/src/BottomSheet/components/BottomSheetOption/BottomSheetOption.tsx

@@ -1,8 +1,8 @@
 import React from "react";
 import { TouchableOpacity, View } from "react-native";
-import { IconColorNames, IconNames } from "@jobber/design";
+import type { IconColorNames, IconNames } from "@jobber/design";
 import { useStyles } from "./BottomSheetOption.styles";
-import { TextAlign } from "../../../Typography";
+import type { TextAlign } from "../../../Typography";
 import { capitalize } from "../../../utils/intl";
 import { Text } from "../../../Text";
 import { Icon } from "../../../Icon";

package/src/BottomSheet/components/BottomSheetOption/index.ts

@@ -1 +1,2 @@
-export { BottomSheetOption, BottomSheetOptionProps } from "./BottomSheetOption";
+export type { BottomSheetOptionProps } from "./BottomSheetOption";
+export { BottomSheetOption } from "./BottomSheetOption";

package/src/Button/Button.test.tsx

@@ -1,9 +1,11 @@
-import React, { CSSProperties, ReactElement } from "react";
+import type { CSSProperties, ReactElement } from "react";
+import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
 import { Path } from "react-native-svg";
-import { ReactTestInstance } from "react-test-renderer";
-import { Button, ButtonType, ButtonVariation } from ".";
-import { ButtonSize } from "./types";
+import type { ReactTestInstance } from "react-test-renderer";
+import type { ButtonType, ButtonVariation } from ".";
+import { Button } from ".";
+import type { ButtonSize } from "./types";
 import { baseButtonHeight, smallButtonHeight } from "./Button.style";
 import { tokens } from "../utils/design";
 

package/src/Button/Button.tsx

@@ -1,11 +1,13 @@
 import React from "react";
-import { StyleProp, TouchableHighlight, View, ViewStyle } from "react-native";
-import { IconColorNames, IconNames } from "@jobber/design";
-import { XOR } from "ts-xor";
+import type { StyleProp, ViewStyle } from "react-native";
+import { TouchableHighlight, View } from "react-native";
+import type { IconColorNames, IconNames } from "@jobber/design";
+import type { XOR } from "ts-xor";
 import { useStyles } from "./Button.style";
 import { InternalButtonLoading } from "./components/InternalButtonLoading";
-import { ButtonSize, ButtonType, ButtonVariation } from "./types";
-import { ActionLabel, ActionLabelVariation } from "../ActionLabel";
+import type { ButtonSize, ButtonType, ButtonVariation } from "./types";
+import type { ActionLabelVariation } from "../ActionLabel";
+import { ActionLabel } from "../ActionLabel";
 import { Icon } from "../Icon";
 import { useAtlantisTheme } from "../AtlantisThemeContext";
 

package/src/Button/components/InternalButtonLoading/InternalButtonLoading.test.tsx

@@ -5,7 +5,7 @@ import {
   darkPattern,
   lightPattern,
 } from "./InternalButtonLoading";
-import { ButtonType, ButtonVariation } from "../../types";
+import type { ButtonType, ButtonVariation } from "../../types";
 
 describe("Loading pattern", () => {
   it.each<[string, ButtonType, ButtonVariation]>([

package/src/Button/components/InternalButtonLoading/InternalButtonLoading.tsx

@@ -10,7 +10,7 @@ import Animated, {
 } from "react-native-reanimated";
 import { styles } from "./InternalButtonLoading.style";
 import { tokens } from "../../../utils/design";
-import { ButtonType, ButtonVariation } from "../../types";
+import type { ButtonType, ButtonVariation } from "../../types";
 
 interface InternalButtonLoadingProps {
   readonly variation: ButtonVariation;

package/src/ButtonGroup/ButtonGroup.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 { Alert } from "react-native";
-import { ButtonGroup, ButtonGroupProps } from "./ButtonGroup";
+import type { ButtonGroupProps } from "./ButtonGroup";
+import { ButtonGroup } from "./ButtonGroup";
 import { Button } from "../Button";
 import * as atlantisContext from "../AtlantisContext/AtlantisContext";
 import { atlantisContextDefaultValues } from "../AtlantisContext";

package/src/ButtonGroup/ButtonGroup.tsx

@@ -4,9 +4,9 @@ import { PrimaryAction, SecondaryAction } from "./ButtonGroupAction";
 import { useStyles } from "./ButtonGroup.style";
 import { SecondaryActionSheet } from "./components/SecondaryActionSheet";
 import { getActions, usePreventTapWhenOffline } from "./utils";
-import { ButtonGroupActionElement } from "./types";
+import type { ButtonGroupActionElement } from "./types";
 import { Button } from "../Button";
-import { BottomSheetRef } from "../BottomSheet/BottomSheet";
+import type { BottomSheetRef } from "../BottomSheet/BottomSheet";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 
 export interface ButtonGroupProps {

package/src/ButtonGroup/ButtonGroupAction.tsx

@@ -1,6 +1,6 @@
-import { IconColorNames, IconNames } from "@jobber/design";
+import type { IconColorNames, IconNames } from "@jobber/design";
 import React from "react";
-import { ButtonType, ButtonVariation } from "../Button";
+import type { ButtonType, ButtonVariation } from "../Button";
 
 export interface ButtonGroupActionProps {
   /**

package/src/ButtonGroup/components/SecondaryActionSheet/SecondaryActionSheet.tsx

@@ -1,9 +1,11 @@
-import React, { RefObject } from "react";
+import type { RefObject } from "react";
+import React from "react";
 import { View } from "react-native";
 import { Portal } from "react-native-portalize";
-import { ButtonGroupSecondaryActionProps } from "../../types";
+import type { ButtonGroupSecondaryActionProps } from "../../types";
 import { BottomSheetOption } from "../../../BottomSheet/components/BottomSheetOption";
-import { BottomSheet, BottomSheetRef } from "../../../BottomSheet/BottomSheet";
+import type { BottomSheetRef } from "../../../BottomSheet/BottomSheet";
+import { BottomSheet } from "../../../BottomSheet/BottomSheet";
 
 interface SecondaryActionSheetProps {
   readonly actions: ButtonGroupSecondaryActionProps[];

package/src/ButtonGroup/types.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from "react";
-import {
+import type { ReactElement } from "react";
+import type {
   ButtonGroupActionProps,
   ButtonGroupPrimaryActionProps,
   ButtonGroupSecondaryActionProps,

package/src/ButtonGroup/utils.ts

@@ -1,14 +1,11 @@
 import React, { useCallback } from "react";
 import { Alert } from "react-native";
-import {
+import type {
   ButtonGroupActionElement,
   ButtonGroupPrimaryActionElement,
 } from "./types";
-import {
-  ButtonGroupActionProps,
-  PrimaryAction,
-  SecondaryAction,
-} from "./ButtonGroupAction";
+import type { ButtonGroupActionProps } from "./ButtonGroupAction";
+import { PrimaryAction, SecondaryAction } from "./ButtonGroupAction";
 import { useAtlantisContext } from "../AtlantisContext/AtlantisContext";
 import { useAtlantisI18n } from "../hooks/useAtlantisI18n";
 

package/src/Card/Card.tsx

@@ -1,12 +1,12 @@
-import React, { ReactNode } from "react";
-import {
+import type { ReactNode } from "react";
+import React from "react";
+import type {
   LayoutChangeEvent,
-  Pressable,
   PressableStateCallbackType,
-  View,
 } from "react-native";
-import { IconNames } from "@jobber/design";
-import { XOR } from "ts-xor";
+import { Pressable, View } from "react-native";
+import type { IconNames } from "@jobber/design";
+import type { XOR } from "ts-xor";
 import { useStyles } from "./Card.style";
 import { InternalCardHeader } from "./components/InternalCardHeader";
 import { ErrorMessageWrapper } from "../ErrorMessageWrapper";

package/src/Card/components/InternalCardHeader.tsx

@@ -1,4 +1,5 @@
-import React, { ReactNode } from "react";
+import type { ReactNode } from "react";
+import React from "react";
 import { Pressable, View } from "react-native";
 import { useStyles } from "./InternalCardHeader.style";
 

package/src/Checkbox/Checkbox.tsx

@@ -1,6 +1,7 @@
 import React from "react";
-import { ColorValue, Pressable, View } from "react-native";
-import { XOR } from "ts-xor";
+import type { ColorValue } from "react-native";
+import { Pressable, View } from "react-native";
+import type { XOR } from "ts-xor";
 import { useStyles } from "./Checkbox.style";
 import { Text } from "../Text";
 import { Icon } from "../Icon";

package/src/Checkbox/CheckboxGroup.test.tsx

@@ -1,14 +1,10 @@
 import React from "react";
-import {
-  RenderAPI,
-  fireEvent,
-  render,
-  waitFor,
-} from "@testing-library/react-native";
+import type { RenderAPI } from "@testing-library/react-native";
+import { fireEvent, render, waitFor } from "@testing-library/react-native";
 import { FormProvider, useForm } from "react-hook-form";
 import { CheckboxGroup } from "./CheckboxGroup";
 import { Checkbox } from "./Checkbox";
-import { CheckboxGroupState } from "./types";
+import type { CheckboxGroupState } from "./types";
 import { Button } from "../Button";
 
 const onSubmitMock = jest.fn();

package/src/Checkbox/CheckboxGroup.tsx

@@ -2,10 +2,11 @@ import React, { Fragment, useReducer } from "react";
 import { View } from "react-native";
 import isEmpty from "lodash/isEmpty";
 import reduce from "lodash/reduce";
-import { XOR } from "ts-xor";
+import type { XOR } from "ts-xor";
 import { useStyles } from "./CheckboxGroup.style";
-import { Checkbox, CheckboxProps } from "./Checkbox";
-import { CheckboxElement, CheckboxGroupState } from "./types";
+import type { CheckboxProps } from "./Checkbox";
+import { Checkbox } from "./Checkbox";
+import type { CheckboxElement, CheckboxGroupState } from "./types";
 import {
   checkboxGroupReducer,
   initCheckboxGroupState,

package/src/Checkbox/CheckboxGroupReducer.test.ts

@@ -2,7 +2,7 @@ import {
   checkboxGroupReducer,
   initCheckboxGroupState,
 } from "./CheckboxGroupReducer";
-import { CheckboxGroupState } from "./types";
+import type { CheckboxGroupState } from "./types";
 
 let state: CheckboxGroupState;
 const checkbox1 = "checkbox1";

package/src/Checkbox/CheckboxGroupReducer.ts

@@ -1,5 +1,8 @@
 import deepmerge from "deepmerge";
-import { CheckboxGroupState, CheckboxGroupStateInitializer } from "./types";
+import type {
+  CheckboxGroupState,
+  CheckboxGroupStateInitializer,
+} from "./types";
 
 interface UpdateAction {
   type: "Update";

package/src/Checkbox/types.ts

@@ -1,5 +1,5 @@
-import { ReactElement } from "react";
-import { Checkbox, CheckboxProps } from "./Checkbox";
+import type { ReactElement } from "react";
+import type { Checkbox, CheckboxProps } from "./Checkbox";
 
 export interface CheckboxGroupChildrenState {
   [key: string]: boolean;

package/src/Chip/Chip.tsx

@@ -1,6 +1,7 @@
 import React, { useMemo } from "react";
-import { AccessibilityRole, Pressable, View } from "react-native";
-import { IconNames } from "@jobber/design";
+import type { AccessibilityRole } from "react-native";
+import { Pressable, View } from "react-native";
+import type { IconNames } from "@jobber/design";
 import { useStyles } from "./Chip.style";
 import { Icon } from "../Icon";
 import { Typography } from "../Typography";

package/src/Content/Content.test.tsx

@@ -1,8 +1,9 @@
 import React from "react";
 import { render, renderHook } from "@testing-library/react-native";
 import { View } from "react-native";
-import { ReactTestInstance } from "react-test-renderer";
-import { Content, ContentProps } from "./Content";
+import type { ReactTestInstance } from "react-test-renderer";
+import type { ContentProps } from "./Content";
+import { Content } from "./Content";
 import { useSpaceAroundStyles } from "./ContentSpaceAround.style";
 import { useVerticalStyles } from "./ContentVertical.style";
 import { useHorizontalStyles } from "./ContentHorizontal.style";

package/src/Content/Content.tsx

@@ -1,5 +1,7 @@
-import React, { ReactNode } from "react";
-import { StyleProp, View, ViewStyle } from "react-native";
+import type { ReactNode } from "react";
+import React from "react";
+import type { StyleProp, ViewStyle } from "react-native";
+import { View } from "react-native";
 import { useHorizontalStyles } from "./ContentHorizontal.style";
 import { useVerticalStyles } from "./ContentVertical.style";
 import { useSpaceAroundStyles } from "./ContentSpaceAround.style";

package/src/ContentOverlay/ContentOverlay.test.tsx

@@ -2,12 +2,10 @@ import React, { createRef } from "react";
 import { fireEvent, render, waitFor } from "@testing-library/react-native";
 import { AccessibilityInfo, View } from "react-native";
 import { Host } from "react-native-portalize";
-import { ReactTestInstance, act } from "react-test-renderer";
-import {
-  ContentOverlay,
-  ContentOverlayRef,
-  ModalBackgroundColor,
-} from "./ContentOverlay";
+import type { ReactTestInstance } from "react-test-renderer";
+import { act } from "react-test-renderer";
+import type { ContentOverlayRef, ModalBackgroundColor } from "./ContentOverlay";
+import { ContentOverlay } from "./ContentOverlay";
 import { tokens } from "../utils/design";
 import { Button } from "../Button";
 import { Content } from "../Content";

package/src/ContentOverlay/ContentOverlay.tsx

@@ -1,5 +1,5 @@
+import type { Ref } from "react";
 import React, {
-  Ref,
   forwardRef,
   useCallback,
   useImperativeHandle,
@@ -9,10 +9,9 @@ import React, {
 } from "react";
 import { Modalize } from "react-native-modalize";
 import { useSafeAreaInsets } from "react-native-safe-area-context";
+import type { NativeScrollEvent, NativeSyntheticEvent } from "react-native";
 import {
   AccessibilityInfo,
-  NativeScrollEvent,
-  NativeSyntheticEvent,
   Platform,
   View,
   findNodeHandle,
@@ -22,7 +21,7 @@ import { Portal } from "react-native-portalize";
 import { useKeyboardVisibility } from "./hooks/useKeyboardVisibility";
 import { useStyles } from "./ContentOverlay.style";
 import { useViewLayoutHeight } from "./hooks/useViewLayoutHeight";
-import {
+import type {
   ContentOverlayProps,
   ContentOverlayRef,
   ModalBackgroundColor,

package/src/ContentOverlay/hooks/useKeyboardVisibility.test.ts

@@ -1,5 +1,6 @@
 import { act, renderHook } from "@testing-library/react-hooks";
-import { DeviceEventEmitter, KeyboardEvent } from "react-native";
+import type { KeyboardEvent } from "react-native";
+import { DeviceEventEmitter } from "react-native";
 import { useKeyboardVisibility } from "./useKeyboardVisibility";
 
 const keyboardEvent: Partial<KeyboardEvent> = {

package/src/ContentOverlay/hooks/useKeyboardVisibility.ts

@@ -1,5 +1,6 @@
 import { useEffect, useState } from "react";
-import { Keyboard, KeyboardEvent } from "react-native";
+import type { KeyboardEvent } from "react-native";
+import { Keyboard } from "react-native";
 
 interface KeyboardVisibility {
   readonly isKeyboardVisible: boolean;

package/src/ContentOverlay/hooks/useViewLayoutHeight.test.ts

@@ -1,5 +1,5 @@
 import { act, renderHook } from "@testing-library/react-hooks";
-import { LayoutChangeEvent } from "react-native";
+import type { LayoutChangeEvent } from "react-native";
 import { useViewLayoutHeight } from "./useViewLayoutHeight";
 
 describe("useViewLayoutHeight", () => {

package/src/ContentOverlay/hooks/useViewLayoutHeight.ts

@@ -1,5 +1,5 @@
 import { useState } from "react";
-import { LayoutChangeEvent } from "react-native";
+import type { LayoutChangeEvent } from "react-native";
 
 export function useViewLayoutHeight(): {
   readonly handleLayout: ({ nativeEvent }: LayoutChangeEvent) => void;

package/src/ContentOverlay/types.ts

@@ -1,5 +1,5 @@
-import { ReactNode } from "react";
-import { Modalize } from "react-native-modalize";
+import type { ReactNode } from "react";
+import type { Modalize } from "react-native-modalize";
 
 export interface ContentOverlayProps {
   /**

package/src/Disclosure/Disclosure.test.tsx

@@ -1,6 +1,6 @@
 import React from "react";
 import { fireEvent, render, screen } from "@testing-library/react-native";
-import { ReactTestInstance } from "react-test-renderer";
+import type { ReactTestInstance } from "react-test-renderer";
 import { Disclosure } from ".";
 import { Text } from "../Text";
 

package/src/Disclosure/Disclosure.tsx

@@ -1,5 +1,6 @@
 import React, { useState } from "react";
-import { LayoutChangeEvent, TouchableOpacity, View } from "react-native";
+import type { LayoutChangeEvent } from "react-native";
+import { TouchableOpacity, View } from "react-native";
 import Reanimated, {
   Easing,
   useAnimatedStyle,

package/src/EmptyState/EmptyState.test.tsx

@@ -1,6 +1,7 @@
 import React from "react";
 import { fireEvent, render } from "@testing-library/react-native";
-import { EmptyState, EmptyStateProps } from "./EmptyState";
+import type { EmptyStateProps } from "./EmptyState";
+import { EmptyState } from "./EmptyState";
 import * as IconComponent from "../Icon/Icon";
 
 const primaryOnPress = jest.fn();

package/src/EmptyState/EmptyState.tsx

@@ -1,4 +1,4 @@
-import { IconColorNames, IconNames } from "@jobber/design";
+import type { IconColorNames, IconNames } from "@jobber/design";
 import React from "react";
 import { View } from "react-native";
 import { useStyles } from "./EmptyState.style";
@@ -6,7 +6,8 @@ import { Text } from "../Text";
 import { Content } from "../Content";
 import { Icon } from "../Icon";
 import { Heading } from "../Heading";
-import { Button, ButtonType } from "../Button";
+import type { ButtonType } from "../Button";
+import { Button } from "../Button";
 
 interface Action {
   label: string;

package/src/ErrorMessageWrapper/ErrorMessageWrapper.tsx

@@ -1,5 +1,7 @@
-import React, { ReactNode, useEffect, useRef } from "react";
-import { View, ViewStyle } from "react-native";
+import type { ReactNode } from "react";
+import React, { useEffect, useRef } from "react";
+import type { ViewStyle } from "react-native";
+import { View } from "react-native";
 import { v4 } from "react-native-uuid";
 import { useErrorMessageContext } from "./context";
 import { useStyles } from "./ErrorMessageWrapper.style";

package/src/ErrorMessageWrapper/context/ErrorMessageContext.tsx

@@ -1,6 +1,6 @@
 /* eslint-disable @typescript-eslint/no-unused-vars */
 import { createContext, useContext } from "react";
-import { ErrorMessageContextProps } from "./types";
+import type { ErrorMessageContextProps } from "./types";
 
 const defaultValues: ErrorMessageContextProps = {
   elements: {},

package/src/ErrorMessageWrapper/context/ErrorMessageProvider.tsx

@@ -1,12 +1,9 @@
-import React, { ReactNode, RefObject, useState } from "react";
-import {
-  AccessibilityInfo,
-  NativeMethods,
-  View,
-  findNodeHandle,
-} from "react-native";
+import type { ReactNode, RefObject } from "react";
+import React, { useState } from "react";
+import type { NativeMethods, View } from "react-native";
+import { AccessibilityInfo, findNodeHandle } from "react-native";
 import { ErrorMessageContext } from "./ErrorMessageContext";
-import {
+import type {
   Element,
   ErrorMessageContextProps,
   ErrorMessageContextRegisterParams,

package/src/ErrorMessageWrapper/context/types.ts

@@ -1,5 +1,5 @@
-import { RefObject } from "react";
-import { NativeMethods, View } from "react-native";
+import type { RefObject } from "react";
+import type { NativeMethods, View } from "react-native";
 
 interface Methods {
   /**

package/src/Flex/Flex.styles.tsx

@@ -1,5 +1,7 @@
-import { StyleSheet, ViewStyle } from "react-native";
-import { ColumnKeys, Spacing, spacing } from "./types";
+import type { ViewStyle } from "react-native";
+import { StyleSheet } from "react-native";
+import type { ColumnKeys, Spacing } from "./types";
+import { spacing } from "./types";
 import { tokens as staticTokens } from "../utils/design";
 
 export const styles = StyleSheet.create({

package/src/Flex/Flex.test.tsx

@@ -1,10 +1,11 @@
 import React from "react";
 import { render } from "@testing-library/react-native";
-import { View, ViewStyle } from "react-native";
-import { ReactTestInstance } from "react-test-renderer";
+import type { ViewStyle } from "react-native";
+import { View } from "react-native";
+import type { ReactTestInstance } from "react-test-renderer";
 import { tokens } from "@jobber/design/foundation";
 import { Flex } from "./Flex";
-import { FlexProps, Spacing } from "./types";
+import type { FlexProps, Spacing } from "./types";
 import { columnStyles } from "./Flex.styles";
 import { Text } from "../Text";
 import { Icon } from "../Icon";

package/src/Flex/Flex.tsx

@@ -1,8 +1,9 @@
-import React, { Children, PropsWithChildren } from "react";
+import type { PropsWithChildren } from "react";
+import React, { Children } from "react";
 import { View } from "react-native";
 import chunk from "lodash/chunk";
 import { columnStyles, gapStyles, styles } from "./Flex.styles";
-import { FlexProps } from "./types";
+import type { FlexProps } from "./types";
 import { Content } from "../Content";
 
 export function Flex({

package/src/Flex/types.ts

@@ -1,4 +1,4 @@
-import { ViewStyle } from "react-native";
+import type { ViewStyle } from "react-native";
 
 export type ColumnKeys = "shrink" | "grow";