@jobber/components-native 0.80.1-upgrade-to-2ee92b7.19 → 0.80.2

package/dist/types/src/AtlantisThemeContext/AtlantisThemeContext.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 import { AtlantisThemeContextProviderProps, AtlantisThemeContextValue } from "./types";
-export declare function AtlantisThemeContextProvider({ children, dangerouslyOverrideTheme, }: AtlantisThemeContextProviderProps): React.JSX.Element;
+export declare function AtlantisThemeContextProvider({ children, dangerouslyOverrideTheme, }: AtlantisThemeContextProviderProps): JSX.Element;
 export declare function useAtlantisTheme(): AtlantisThemeContextValue;

package/dist/types/src/Glimmer/Glimmer.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 import { useSizeStyles } from "./Glimmer.size.style";
 import { useShapeStyles } from "./Glimmer.shape.style";
 export type GlimmerShapes = keyof ReturnType<typeof useShapeStyles>;
@@ -27,5 +26,5 @@ interface GlimmerProps {
 }
 export declare const GLIMMER_TEST_ID = "ATL-Glimmer";
 export declare const GLIMMER_SHINE_TEST_ID = "ATL-Glimmer-Shine";
-export declare function Glimmer({ width, shape, size, timing, }: GlimmerProps): React.JSX.Element;
+export declare function Glimmer({ width, shape, size, timing, }: GlimmerProps): JSX.Element;
 export {};

package/dist/types/src/ProgressBar/ProgressBarStepped.d.ts

@@ -1,4 +1,3 @@
-import React from "react";
 interface ProgressBarSteppedProps {
     readonly total: number;
     readonly current: number;
@@ -6,5 +5,5 @@ interface ProgressBarSteppedProps {
     readonly loading?: boolean;
     readonly inProgress?: number;
 }
-export declare function ProgressBarStepped({ total, current, color, loading, inProgress, }: ProgressBarSteppedProps): React.JSX.Element;
+export declare function ProgressBarStepped({ total, current, color, loading, inProgress, }: ProgressBarSteppedProps): JSX.Element;
 export {};

package/jestSetup.js

@@ -33,6 +33,5 @@ jest.mock("react-native-reanimated", () => {
     FadeIn: {
       duration: () => undefined,
     },
-    useEvent: () => ({ listeners: [] }),
   };
 });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components-native",
-  "version": "0.80.1-upgrade-to-2ee92b7.19+2ee92b75",
+  "version": "0.80.2",
   "license": "MIT",
   "description": "React Native implementation of Atlantis",
   "repository": {
@@ -70,7 +70,7 @@
     "date-fns-tz": "^2.0.0",
     "react": "^18.2.0",
     "react-intl": "^6.4.2",
-    "react-native": ">=0.76.0",
+    "react-native": ">=0.69.2",
     "react-native-gesture-handler": ">=2.10.0",
     "react-native-keyboard-aware-scroll-view": "^0.9.5",
     "react-native-modal-datetime-picker": " >=13.0.0",
@@ -80,5 +80,5 @@
     "react-native-safe-area-context": "^4.5.2",
     "react-native-svg": ">=12.0.0"
   },
-  "gitHead": "2ee92b753e53fd4b5235e27553378ad899192068"
+  "gitHead": "f9f0fd3344b7bdc1198d5fd23a6f4057ad31f9c4"
 }

package/src/Disclosure/Disclosure.test.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { fireEvent, render, screen } from "@testing-library/react-native";
+import { fireEvent, render } from "@testing-library/react-native";
 import { ReactTestInstance } from "react-test-renderer";
 import { Disclosure } from ".";
 import { Text } from "../Text";
@@ -23,107 +23,49 @@ function fireLayoutEvent(disclosureContent: ReactTestInstance) {
   });
 }
 
-describe("Disclosure", () => {
-  const defaultProps = {
-    header: <Text>This is the header</Text>,
-    content: <Text>This is the content</Text>,
-    onToggle: jest.fn(),
-  };
-
-  it("renders a Disclosure with a header and a content when open is true", () => {
-    render(
-      <Disclosure
-        header={<Text>This is the header</Text>}
-        content={<Text>This is the content</Text>}
-        open={true}
-        isEmpty={false}
-        onToggle={() => {
-          return;
-        }}
-      />,
-    );
-
-    expect(screen.getByText("This is the header")).toBeTruthy();
-
-    const content = screen.getByTestId("content");
-    fireLayoutEvent(content);
-
-    expect(screen.getByText("This is the content")).toBeTruthy();
-    expect(screen.getByTestId("arrowUp")).toBeTruthy();
-  });
-
-  it("renders a Disclosure with a header and with a content of size 0 when open is false", () => {
-    render(
-      <Disclosure
-        header={<Text>This is the header</Text>}
-        content={<Text>This is the content</Text>}
-        open={false}
-        isEmpty={false}
-        onToggle={() => {
-          return;
-        }}
-      />,
-    );
-
-    expect(screen.getByText("This is the header")).toBeTruthy();
-
-    const content = screen.getByTestId("content");
-    fireLayoutEvent(content);
-
-    expect(screen.getByText("This is the content")).toBeTruthy();
-    expect(screen.getByTestId("arrowUp")).toBeTruthy();
-  });
-
-  it("should not render the caret when the Disclosure is empty", () => {
-    render(
-      <Disclosure
-        header={<Text>This is the header</Text>}
-        content={<Text>This is the content</Text>}
-        open={false}
-        isEmpty={true}
-        onToggle={() => {
-          return;
-        }}
-      />,
-    );
-
-    expect(screen.getByText("This is the header")).toBeTruthy();
-    expect(screen.queryByTestId("arrowUp")).toBeNull();
-  });
-
-  it("calls onToggle when header is pressed", () => {
-    const onToggleMock = jest.fn();
-    const { getByText } = render(
-      <Disclosure
-        {...defaultProps}
-        onToggle={onToggleMock}
-        open={false}
-        isEmpty={false}
-      />,
-    );
-
-    const headerText = getByText("This is the header");
-
-    fireEvent.press(headerText);
-
-    expect(onToggleMock).toHaveBeenCalledTimes(1);
-  });
-
-  it("does not call onToggle when header is pressed and isEmpty is true", () => {
-    const onToggleMock = jest.fn();
-    const { getByText } = render(
-      <Disclosure
-        {...defaultProps}
-        onToggle={onToggleMock}
-        open={false}
-        isEmpty={true}
-      />,
-    );
-
-    const headerText = getByText("This is the header");
+it("renders a Disclosure with a header and a content when open is true", () => {
+  const disclosure = render(
+    <Disclosure
+      header={<Text>This is the header</Text>}
+      content={<Text>This is the content</Text>}
+      open={true}
+      isEmpty={false}
+      onToggle={() => {
+        return;
+      }}
+    />,
+  );
+  fireLayoutEvent(disclosure.getByTestId("content"));
+  expect(disclosure).toMatchSnapshot();
+});
 
-    fireEvent.press(headerText);
+it("renders a Disclosure with a header and with a content of size 0 when closed is false", () => {
+  const disclosure = render(
+    <Disclosure
+      header={<Text>This is the header</Text>}
+      content={<Text>This is the content</Text>}
+      open={false}
+      isEmpty={false}
+      onToggle={() => {
+        return;
+      }}
+    />,
+  );
+  fireLayoutEvent(disclosure.getByTestId("content"));
+  expect(disclosure).toMatchSnapshot();
+});
 
-    expect(onToggleMock).not.toHaveBeenCalled();
-  });
+it("should not render the caret when the Disclosure is empty", () => {
+  const disclosure = render(
+    <Disclosure
+      header={<Text>This is the header</Text>}
+      content={<Text>This is the content</Text>}
+      open={false}
+      isEmpty={true}
+      onToggle={() => {
+        return;
+      }}
+    />,
+  );
+  expect(disclosure).toMatchSnapshot();
 });

package/src/Disclosure/__snapshots__/Disclosure.test.tsx.snap

@@ -0,0 +1,482 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`renders a Disclosure with a header and a content when open is true 1`] = `
+<View
+  style={
+    {
+      "width": "100%",
+    }
+  }
+>
+  <View
+    accessibilityState={
+      {
+        "busy": undefined,
+        "checked": undefined,
+        "disabled": false,
+        "expanded": undefined,
+        "selected": undefined,
+      }
+    }
+    accessibilityValue={
+      {
+        "max": undefined,
+        "min": undefined,
+        "now": undefined,
+        "text": undefined,
+      }
+    }
+    accessible={true}
+    collapsable={false}
+    focusable={true}
+    onClick={[Function]}
+    onResponderGrant={[Function]}
+    onResponderMove={[Function]}
+    onResponderRelease={[Function]}
+    onResponderTerminate={[Function]}
+    onResponderTerminationRequest={[Function]}
+    onStartShouldSetResponder={[Function]}
+    style={
+      {
+        "opacity": 1,
+      }
+    }
+  >
+    <View
+      style={
+        {
+          "alignItems": "flex-start",
+          "flexDirection": "row",
+          "justifyContent": "space-between",
+        }
+      }
+    >
+      <Text
+        accessibilityRole="text"
+        adjustsFontSizeToFit={false}
+        allowFontScaling={true}
+        collapsable={false}
+        maxFontSizeMultiplier={3.125}
+        selectable={true}
+        selectionColor="hsl(86, 100%, 46%)"
+        style={
+          [
+            {
+              "fontFamily": "inter-regular",
+            },
+            {
+              "color": "hsl(198, 35%, 21%)",
+            },
+            {
+              "textAlign": "left",
+            },
+            {
+              "fontSize": 16,
+              "lineHeight": 20,
+            },
+            {
+              "letterSpacing": 0,
+            },
+          ]
+        }
+      >
+        This is the header
+      </Text>
+      <View
+        style={
+          [
+            {
+              "transform": [
+                {
+                  "rotateZ": "0deg",
+                },
+              ],
+            },
+          ]
+        }
+      >
+        <SVGMock
+          style={
+            {
+              "display": "flex",
+              "fill": "hsl(0, 0%, 72%)",
+              "height": 24,
+              "verticalAlign": "middle",
+              "width": 24,
+            }
+          }
+          testID="arrowUp"
+          viewBox="0 0 24 24"
+        >
+          <Path
+            d="M16.297 14.709a.996.996 0 0 0 1.41-.001.994.994 0 0 0 0-1.41l-5-5.005a.998.998 0 0 0-1.415 0l-5 5a.994.994 0 0 0 0 1.41.996.996 0 0 0 1.411.001L12 10.416l4.297 4.293Z"
+            fill="hsl(0, 0%, 72%)"
+          />
+        </SVGMock>
+      </View>
+    </View>
+  </View>
+  <RCTScrollView
+    collapsable={false}
+    scrollEnabled={false}
+    scrollEventThrottle={0.0001}
+    showsHorizontalScrollIndicator={false}
+    showsVerticalScrollIndicator={false}
+    style={
+      {
+        "height": 100,
+        "paddingTop": 8,
+      }
+    }
+  >
+    <View>
+      <View
+        onLayout={[Function]}
+        testID="content"
+      >
+        <Text
+          accessibilityRole="text"
+          adjustsFontSizeToFit={false}
+          allowFontScaling={true}
+          collapsable={false}
+          maxFontSizeMultiplier={3.125}
+          selectable={true}
+          selectionColor="hsl(86, 100%, 46%)"
+          style={
+            [
+              {
+                "fontFamily": "inter-regular",
+              },
+              {
+                "color": "hsl(198, 35%, 21%)",
+              },
+              {
+                "textAlign": "left",
+              },
+              {
+                "fontSize": 16,
+                "lineHeight": 20,
+              },
+              {
+                "letterSpacing": 0,
+              },
+            ]
+          }
+        >
+          This is the content
+        </Text>
+      </View>
+    </View>
+  </RCTScrollView>
+</View>
+`;
+
+exports[`renders a Disclosure with a header and with a content of size 0 when closed is false 1`] = `
+<View
+  style={
+    {
+      "width": "100%",
+    }
+  }
+>
+  <View
+    accessibilityState={
+      {
+        "busy": undefined,
+        "checked": undefined,
+        "disabled": false,
+        "expanded": undefined,
+        "selected": undefined,
+      }
+    }
+    accessibilityValue={
+      {
+        "max": undefined,
+        "min": undefined,
+        "now": undefined,
+        "text": undefined,
+      }
+    }
+    accessible={true}
+    collapsable={false}
+    focusable={true}
+    onClick={[Function]}
+    onResponderGrant={[Function]}
+    onResponderMove={[Function]}
+    onResponderRelease={[Function]}
+    onResponderTerminate={[Function]}
+    onResponderTerminationRequest={[Function]}
+    onStartShouldSetResponder={[Function]}
+    style={
+      {
+        "opacity": 1,
+      }
+    }
+  >
+    <View
+      style={
+        {
+          "alignItems": "flex-start",
+          "flexDirection": "row",
+          "justifyContent": "space-between",
+        }
+      }
+    >
+      <Text
+        accessibilityRole="text"
+        adjustsFontSizeToFit={false}
+        allowFontScaling={true}
+        collapsable={false}
+        maxFontSizeMultiplier={3.125}
+        selectable={true}
+        selectionColor="hsl(86, 100%, 46%)"
+        style={
+          [
+            {
+              "fontFamily": "inter-regular",
+            },
+            {
+              "color": "hsl(198, 35%, 21%)",
+            },
+            {
+              "textAlign": "left",
+            },
+            {
+              "fontSize": 16,
+              "lineHeight": 20,
+            },
+            {
+              "letterSpacing": 0,
+            },
+          ]
+        }
+      >
+        This is the header
+      </Text>
+      <View
+        style={
+          [
+            {
+              "transform": [
+                {
+                  "rotateZ": "-180deg",
+                },
+              ],
+            },
+          ]
+        }
+      >
+        <SVGMock
+          style={
+            {
+              "display": "flex",
+              "fill": "hsl(0, 0%, 72%)",
+              "height": 24,
+              "verticalAlign": "middle",
+              "width": 24,
+            }
+          }
+          testID="arrowUp"
+          viewBox="0 0 24 24"
+        >
+          <Path
+            d="M16.297 14.709a.996.996 0 0 0 1.41-.001.994.994 0 0 0 0-1.41l-5-5.005a.998.998 0 0 0-1.415 0l-5 5a.994.994 0 0 0 0 1.41.996.996 0 0 0 1.411.001L12 10.416l4.297 4.293Z"
+            fill="hsl(0, 0%, 72%)"
+          />
+        </SVGMock>
+      </View>
+    </View>
+  </View>
+  <RCTScrollView
+    collapsable={false}
+    scrollEnabled={false}
+    scrollEventThrottle={0.0001}
+    showsHorizontalScrollIndicator={false}
+    showsVerticalScrollIndicator={false}
+    style={
+      {
+        "height": 0,
+        "paddingTop": 8,
+      }
+    }
+  >
+    <View>
+      <View
+        onLayout={[Function]}
+        testID="content"
+      >
+        <Text
+          accessibilityRole="text"
+          adjustsFontSizeToFit={false}
+          allowFontScaling={true}
+          collapsable={false}
+          maxFontSizeMultiplier={3.125}
+          selectable={true}
+          selectionColor="hsl(86, 100%, 46%)"
+          style={
+            [
+              {
+                "fontFamily": "inter-regular",
+              },
+              {
+                "color": "hsl(198, 35%, 21%)",
+              },
+              {
+                "textAlign": "left",
+              },
+              {
+                "fontSize": 16,
+                "lineHeight": 20,
+              },
+              {
+                "letterSpacing": 0,
+              },
+            ]
+          }
+        >
+          This is the content
+        </Text>
+      </View>
+    </View>
+  </RCTScrollView>
+</View>
+`;
+
+exports[`should not render the caret when the Disclosure is empty 1`] = `
+<View
+  style={
+    {
+      "width": "100%",
+    }
+  }
+>
+  <View
+    accessibilityState={
+      {
+        "busy": undefined,
+        "checked": undefined,
+        "disabled": true,
+        "expanded": undefined,
+        "selected": undefined,
+      }
+    }
+    accessibilityValue={
+      {
+        "max": undefined,
+        "min": undefined,
+        "now": undefined,
+        "text": undefined,
+      }
+    }
+    accessible={true}
+    collapsable={false}
+    focusable={true}
+    onClick={[Function]}
+    onResponderGrant={[Function]}
+    onResponderMove={[Function]}
+    onResponderRelease={[Function]}
+    onResponderTerminate={[Function]}
+    onResponderTerminationRequest={[Function]}
+    onStartShouldSetResponder={[Function]}
+    style={
+      {
+        "opacity": 1,
+      }
+    }
+  >
+    <View
+      style={
+        {
+          "alignItems": "flex-start",
+          "flexDirection": "row",
+          "justifyContent": "space-between",
+        }
+      }
+    >
+      <Text
+        accessibilityRole="text"
+        adjustsFontSizeToFit={false}
+        allowFontScaling={true}
+        collapsable={false}
+        maxFontSizeMultiplier={3.125}
+        selectable={true}
+        selectionColor="hsl(86, 100%, 46%)"
+        style={
+          [
+            {
+              "fontFamily": "inter-regular",
+            },
+            {
+              "color": "hsl(198, 35%, 21%)",
+            },
+            {
+              "textAlign": "left",
+            },
+            {
+              "fontSize": 16,
+              "lineHeight": 20,
+            },
+            {
+              "letterSpacing": 0,
+            },
+          ]
+        }
+      >
+        This is the header
+      </Text>
+    </View>
+  </View>
+  <RCTScrollView
+    collapsable={false}
+    scrollEnabled={false}
+    scrollEventThrottle={0.0001}
+    showsHorizontalScrollIndicator={false}
+    showsVerticalScrollIndicator={false}
+    style={
+      {
+        "height": 0,
+        "paddingTop": 8,
+      }
+    }
+  >
+    <View>
+      <View
+        onLayout={[Function]}
+        testID="content"
+      >
+        <Text
+          accessibilityRole="text"
+          adjustsFontSizeToFit={false}
+          allowFontScaling={true}
+          collapsable={false}
+          maxFontSizeMultiplier={3.125}
+          selectable={true}
+          selectionColor="hsl(86, 100%, 46%)"
+          style={
+            [
+              {
+                "fontFamily": "inter-regular",
+              },
+              {
+                "color": "hsl(198, 35%, 21%)",
+              },
+              {
+                "textAlign": "left",
+              },
+              {
+                "fontSize": 16,
+                "lineHeight": 20,
+              },
+              {
+                "letterSpacing": 0,
+              },
+            ]
+          }
+        >
+          This is the content
+        </Text>
+      </View>
+    </View>
+  </RCTScrollView>
+</View>
+`;

package/src/Form/Form.test.tsx

@@ -545,7 +545,7 @@ describe("Form", () => {
   });
 
   describe("Safe Area", () => {
-    it("does render a safe area when there's NO saveButtonOffset provided", () => {
+    it("does render a safe area when there's a saveButtonOffset is provided", () => {
       const { getByTestId } = render(<FormTest onSubmit={onSubmitMock} />);
 
       expect(getByTestId("ATL-FormSafeArea")).toBeDefined();