@jobber/components-native 0.82.1-JOB-131123-c660de8.42 → 0.83.0

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

@@ -1,4 +1,4 @@
-import { OnTextLayoutEvent, TextAlign, TextVariation, TruncateLength, TypographyProps } from "../Typography";
+import { TextAlign, TextVariation, TruncateLength, TypographyProps } from "../Typography";
 import { TypographyUnsafeStyle } from "../Typography/Typography";
 export interface TextProps extends Pick<TypographyProps<"base">, "maxFontScaleSize" | "selectable"> {
     /**
@@ -66,11 +66,7 @@ export interface TextProps extends Pick<TypographyProps<"base">, "maxFontScaleSi
      * More information in the [Customizing components Guide](https://atlantis.getjobber.com/guides/customizing-components).
      */
     readonly UNSAFE_style?: TypographyUnsafeStyle;
-    /**
-     * Callback that is called when the text is laid out.
-     */
-    readonly onTextLayout?: OnTextLayoutEvent;
 }
 export type TextLevel = "text" | "textSupporting";
 export declare const TEXT_MAX_SCALED_FONT_SIZES: Record<TextLevel, number>;
-export declare function Text({ level, variation, emphasis, allowFontScaling, adjustsFontSizeToFit, maxLines, align, children, reverseTheme, strikeThrough, italic, hideFromScreenReader, maxFontScaleSize, UNSAFE_style, underline, selectable, onTextLayout, }: TextProps): JSX.Element;
+export declare function Text({ level, variation, emphasis, allowFontScaling, adjustsFontSizeToFit, maxLines, align, children, reverseTheme, strikeThrough, italic, hideFromScreenReader, maxFontScaleSize, UNSAFE_style, underline, selectable, }: TextProps): JSX.Element;

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

@@ -86,13 +86,12 @@ export interface TypographyProps<T extends FontFamily> extends Pick<TextProps, "
      */
     readonly strikeThrough?: boolean;
     readonly UNSAFE_style?: TypographyUnsafeStyle;
-    readonly onTextLayout?: OnTextLayoutEvent;
 }
 export interface TypographyUnsafeStyle {
     textStyle?: StyleProp<TextStyle>;
 }
 export declare const Typography: React.MemoExoticComponent<typeof InternalTypography>;
-declare function InternalTypography<T extends FontFamily = "base">({ fontFamily, fontStyle, fontWeight, transform, color, align, size, children, maxLines, allowFontScaling, maxFontScaleSize, adjustsFontSizeToFit, lineHeight, letterSpacing, reverseTheme, hideFromScreenReader, accessibilityRole, strikeThrough, underline, UNSAFE_style, selectable, onTextLayout, }: TypographyProps<T>): JSX.Element;
+declare function InternalTypography<T extends FontFamily = "base">({ fontFamily, fontStyle, fontWeight, transform, color, align, size, children, maxLines, allowFontScaling, maxFontScaleSize, adjustsFontSizeToFit, lineHeight, letterSpacing, reverseTheme, hideFromScreenReader, accessibilityRole, strikeThrough, underline, UNSAFE_style, selectable, }: TypographyProps<T>): JSX.Element;
 export type FontFamily = "base" | "display";
 export type FontStyle = "regular" | "italic";
 export type FontWeight = "regular" | "medium" | "bold" | "semiBold" | "extraBold" | "black";
@@ -109,5 +108,4 @@ export type LineHeight = "extravagant" | "jumbo" | "largest" | "larger" | "large
 export type LetterSpacing = "base" | "loose";
 export type TextAccessibilityRole = "text" | "header";
 export type TruncateLength = "single" | "small" | "base" | "large" | "extraLarge" | "unlimited";
-export type OnTextLayoutEvent = Exclude<TextProps["onTextLayout"], undefined>;
 export {};

package/dist/types/src/Typography/index.d.ts

@@ -1,5 +1,5 @@
 export { Typography } from "./Typography";
-export type { FontFamily, FontStyle, FontWeight, BaseWeight, DisplayWeight, BaseStyle, DisplayStyle, TextColor, TextTransform, TextSize, TextAlign, LineHeight, LetterSpacing, TextAccessibilityRole, TextVariation, TypographyProps, TruncateLength, OnTextLayoutEvent, } from "./Typography";
+export type { FontFamily, FontStyle, FontWeight, BaseWeight, DisplayWeight, BaseStyle, DisplayStyle, TextColor, TextTransform, TextSize, TextAlign, LineHeight, LetterSpacing, TextAccessibilityRole, TextVariation, TypographyProps, TruncateLength, } from "./Typography";
 export { getTypographyStyles, useTypographyStyles } from "./Typography.style";
 export { typographyStyles } from "./Typography.style";
 export { TypographyGestureDetector } from "./TypographyGestureDetector";

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@jobber/components-native",
-  "version": "0.82.1-JOB-131123-c660de8.42+c660de80",
+  "version": "0.83.0",
   "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": "c660de80e0981b2e2f775c44289a65688fb62156"
+  "gitHead": "5b2a570f0d657e82d04a8d60964242f67da3fab0"
 }

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

@@ -6,7 +6,6 @@ exports[`when Heading called with Subtitle variation should match snapshot 1`] =
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -41,7 +40,6 @@ exports[`when Heading called with an alignment should match snapshot 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
   style={
@@ -75,7 +73,6 @@ exports[`when Heading called with maxLines should match snapshot 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   numberOfLines={1}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -110,7 +107,6 @@ exports[`when Heading called with reverseTheme should match snapshot 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
   style={
@@ -144,7 +140,6 @@ exports[`when Heading called with sub-heading variation and text-color should ma
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.375}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -179,7 +174,6 @@ exports[`when Heading called with sub-heading variation should match snapshot 1`
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.375}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -214,7 +208,6 @@ exports[`when Heading called with text as the only prop should match snapshot 1`
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
   style={
@@ -248,7 +241,6 @@ exports[`when Heading called with title variation should match snapshot 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.0625}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"

package/src/InputSearch/InputSearch.tsx

@@ -1,6 +1,6 @@
 import React, { Ref, forwardRef, useEffect } from "react";
 import { View } from "react-native";
-import debounce from "lodash/debounce";
+import { useDebounce } from "@jobber/hooks/useDebounce";
 import { styles } from "./InputSearch.style";
 import { InputText, InputTextProps, InputTextRef } from "../InputText";
 
@@ -49,14 +49,12 @@ function SearchInputInternal(
   }: InputSearchProps,
   ref: Ref<InputTextRef>,
 ) {
-  const delayedSearch = debounce(onDebouncedChange, wait);
+  const debouncedSearch = useDebounce(onDebouncedChange, wait);
   const handleChange = (newValue = "") => onChange(newValue);
 
   useEffect(() => {
-    delayedSearch(value);
-
-    return delayedSearch.cancel;
-  }, [value, delayedSearch]);
+    debouncedSearch(value);
+  }, [value, debouncedSearch]);
 
   return (
     <View style={styles.container}>

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

@@ -25,7 +25,6 @@ exports[`StatusLabel alignment when alignment prop set to "end" should match sna
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -105,7 +104,6 @@ exports[`StatusLabel alignment when alignment prop set to default ("start") shou
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -185,7 +183,6 @@ exports[`StatusLabel status when status prop set to "critical" should match snap
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -265,7 +262,6 @@ exports[`StatusLabel status when status prop set to "inactive" should match snap
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -345,7 +341,6 @@ exports[`StatusLabel status when status prop set to "informative" should match s
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -425,7 +420,6 @@ exports[`StatusLabel status when status prop set to "warning" should match snaps
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"
@@ -505,7 +499,6 @@ exports[`StatusLabel status when status prop set to default ("success") should m
       adjustsFontSizeToFit={false}
       allowFontScaling={true}
       collapsable={false}
-      ellipsizeMode="middle"
       maxFontSizeMultiplier={1.1428571428571428}
       selectable={true}
       selectionColor="hsl(86, 100%, 46%)"

package/src/Text/Text.test.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { fireEvent, render, screen } from "@testing-library/react-native";
+import { render } from "@testing-library/react-native";
 import { Text } from ".";
 import { tokens } from "../utils/design";
 
@@ -135,7 +135,6 @@ it("renders with italic styling", () => {
 
 it("renders text that is inaccessible", () => {
   const text = render(<Text hideFromScreenReader={true}>Test Text</Text>);
-
   expect(text.root.props).toEqual(
     expect.objectContaining({
       accessibilityRole: "none",
@@ -146,7 +145,7 @@ it("renders text that is inaccessible", () => {
 });
 
 it("renders text with underline styling", () => {
-  const text = render(<Text underline="dotted">Test Text</Text>);
+  const text = render(<Text underline="dashed">Test Text</Text>);
 
   expect(text.toJSON()).toMatchSnapshot();
 });
@@ -160,39 +159,12 @@ describe("UNSAFE_style", () => {
       },
     };
 
-    render(<Text UNSAFE_style={customStyle}>Test Text</Text>);
-    const textElement = screen.getByRole("text");
+    const { getByRole } = render(
+      <Text UNSAFE_style={customStyle}>Test Text</Text>,
+    );
+    const textElement = getByRole("text");
     expect(textElement.props.style).toContainEqual(
       expect.objectContaining(customStyle.textStyle),
     );
   });
 });
-
-describe("onTextLayout", () => {
-  it("calls onTextLayout callback when text layout event occurs", () => {
-    const onTextLayoutMock = jest.fn();
-    render(<Text onTextLayout={onTextLayoutMock}>Test Text</Text>);
-
-    const textElement = screen.getByRole("text");
-    const mockEvent = {
-      nativeEvent: {
-        lines: [
-          {
-            text: "Test Text",
-            x: 0,
-            y: 0,
-            width: 100,
-            height: 20,
-            ascender: 15,
-            descender: -5,
-            capHeight: 14,
-            xHeight: 10,
-          },
-        ],
-      },
-    };
-    fireEvent(textElement, "onTextLayout", mockEvent);
-    expect(onTextLayoutMock).toHaveBeenCalledTimes(1);
-    expect(onTextLayoutMock).toHaveBeenCalledWith(mockEvent);
-  });
-});

package/src/Text/Text.tsx

@@ -2,7 +2,6 @@ import React from "react";
 import {
   BaseWeight,
   LineHeight,
-  OnTextLayoutEvent,
   TextAccessibilityRole,
   TextAlign,
   TextSize,
@@ -94,11 +93,6 @@ export interface TextProps
    * More information in the [Customizing components Guide](https://atlantis.getjobber.com/guides/customizing-components).
    */
   readonly UNSAFE_style?: TypographyUnsafeStyle;
-
-  /**
-   * Callback that is called when the text is laid out.
-   */
-  readonly onTextLayout?: OnTextLayoutEvent;
 }
 
 export type TextLevel = "text" | "textSupporting";
@@ -142,7 +136,6 @@ export function Text({
   UNSAFE_style,
   underline,
   selectable,
-  onTextLayout,
 }: TextProps): JSX.Element {
   const accessibilityRole: TextAccessibilityRole = "text";
 
@@ -156,7 +149,6 @@ export function Text({
       maxFontScaleSize={maxFontScaleSize || TEXT_MAX_SCALED_FONT_SIZES[level]}
       selectable={selectable}
       underline={underline}
-      onTextLayout={onTextLayout}
       {...{
         ...levelStyles[level],
         allowFontScaling,

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

@@ -6,7 +6,6 @@ exports[`renders text supporting with no additional props 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.1428571428571428}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -41,7 +40,6 @@ exports[`renders text supporting with variation success 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.1428571428571428}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -76,7 +74,6 @@ exports[`renders text supporting with variation success reverseTheme true 1`] =
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={1.1428571428571428}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -111,7 +108,6 @@ exports[`renders text that is not scaled down with adjustsFontSize false 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   numberOfLines={4}
   selectable={true}
@@ -147,7 +143,6 @@ exports[`renders text that is scaled down with adjustsFontSize true 1`] = `
   adjustsFontSizeToFit={true}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   numberOfLines={4}
   selectable={true}
@@ -183,7 +178,6 @@ exports[`renders text with base variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -218,7 +212,6 @@ exports[`renders text with center alignment 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -253,7 +246,6 @@ exports[`renders text with error variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -288,7 +280,6 @@ exports[`renders text with error variation reverseTheme true 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -323,7 +314,6 @@ exports[`renders text with info variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -358,7 +348,6 @@ exports[`renders text with left alignment 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -393,7 +382,6 @@ exports[`renders text with no additional props 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -428,7 +416,6 @@ exports[`renders text with right alignment 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -463,7 +450,6 @@ exports[`renders text with subdued variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -498,7 +484,6 @@ exports[`renders text with success variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -533,7 +518,6 @@ exports[`renders text with success variation reverseTheme true 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -568,7 +552,6 @@ exports[`renders text with underline styling 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -591,7 +574,7 @@ exports[`renders text with underline styling 1`] = `
         "letterSpacing": 0,
       },
       {
-        "textDecorationStyle": "dotted",
+        "textDecorationStyle": "dashed",
       },
       {
         "textDecorationColor": "hsl(197, 15%, 43%)",
@@ -610,7 +593,6 @@ exports[`renders text with warn variation 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -645,7 +627,6 @@ exports[`renders with italic styling 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"
@@ -683,7 +664,6 @@ exports[`renders with strikethrough styling 1`] = `
   adjustsFontSizeToFit={false}
   allowFontScaling={true}
   collapsable={false}
-  ellipsizeMode="middle"
   maxFontSizeMultiplier={3.125}
   selectable={true}
   selectionColor="hsl(86, 100%, 46%)"

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

@@ -41,7 +41,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
           adjustsFontSizeToFit={false}
           allowFontScaling={true}
           collapsable={false}
-          ellipsizeMode="middle"
           maxFontSizeMultiplier={3.125}
           selectable={true}
           selectionColor="hsl(86, 100%, 46%)"
@@ -81,7 +80,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
             adjustsFontSizeToFit={false}
             allowFontScaling={true}
             collapsable={false}
-            ellipsizeMode="middle"
             maxFontSizeMultiplier={3.125}
             selectable={true}
             selectionColor="hsl(86, 100%, 46%)"
@@ -135,7 +133,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
           adjustsFontSizeToFit={false}
           allowFontScaling={true}
           collapsable={false}
-          ellipsizeMode="middle"
           maxFontSizeMultiplier={3.125}
           selectable={true}
           selectionColor="hsl(86, 100%, 46%)"
@@ -175,7 +172,6 @@ exports[`TextList when the bulletItems is provided displays the text list 1`] =
             adjustsFontSizeToFit={false}
             allowFontScaling={true}
             collapsable={false}
-            ellipsizeMode="middle"
             maxFontSizeMultiplier={3.125}
             selectable={true}
             selectionColor="hsl(86, 100%, 46%)"

package/src/Typography/Typography.test.tsx

@@ -1,5 +1,5 @@
 import React from "react";
-import { fireEvent, render } from "@testing-library/react-native";
+import { render } from "@testing-library/react-native";
 import { I18nManager } from "react-native";
 import { Typography } from "./Typography";
 
@@ -251,34 +251,3 @@ describe("underline", () => {
     },
   );
 });
-
-describe("onTextLayout", () => {
-  it("calls onTextLayout callback when text layout event occurs", () => {
-    const onTextLayoutMock = jest.fn();
-    const { getByRole } = render(
-      <Typography onTextLayout={onTextLayoutMock}>Test Text</Typography>,
-    );
-
-    const textElement = getByRole("text");
-    const mockEvent = {
-      nativeEvent: {
-        lines: [
-          {
-            text: "Test Text",
-            x: 0,
-            y: 0,
-            width: 100,
-            height: 20,
-            ascender: 15,
-            descender: -5,
-            capHeight: 14,
-            xHeight: 10,
-          },
-        ],
-      },
-    };
-    fireEvent(textElement, "onTextLayout", mockEvent);
-    expect(onTextLayoutMock).toHaveBeenCalledTimes(1);
-    expect(onTextLayoutMock).toHaveBeenCalledWith(mockEvent);
-  });
-});

package/src/Typography/Typography.tsx

@@ -120,8 +120,6 @@ export interface TypographyProps<T extends FontFamily>
   readonly strikeThrough?: boolean;
 
   readonly UNSAFE_style?: TypographyUnsafeStyle;
-
-  readonly onTextLayout?: OnTextLayoutEvent;
 }
 
 const maxNumberOfLines = {
@@ -162,7 +160,6 @@ function InternalTypography<T extends FontFamily = "base">({
   underline,
   UNSAFE_style,
   selectable = true,
-  onTextLayout,
 }: TypographyProps<T>): JSX.Element {
   const styles = useTypographyStyles();
   const sizeAndHeight = getSizeAndHeightStyle(size, styles, lineHeight);
@@ -212,7 +209,6 @@ function InternalTypography<T extends FontFamily = "base">({
           adjustsFontSizeToFit,
           style,
           numberOfLines: numberOfLinesForNativeText,
-          ellipsizeMode: "middle",
         }}
         {...accessibilityProps}
         maxFontSizeMultiplier={getScaleMultiplier(
@@ -221,7 +217,6 @@ function InternalTypography<T extends FontFamily = "base">({
         )}
         selectable={selectable}
         selectionColor={tokens["color-brand--highlight"]}
-        onTextLayout={onTextLayout}
       >
         {text}
       </Text>
@@ -482,5 +477,3 @@ export type TruncateLength =
   | "large"
   | "extraLarge"
   | "unlimited";
-
-export type OnTextLayoutEvent = Exclude<TextProps["onTextLayout"], undefined>;