@terreno/ui 0.13.0 → 0.14.0

package/src/Tooltip.test.tsx

@@ -1,22 +1,29 @@
 import {beforeAll, describe, expect, it, mock} from "bun:test";
 import {act} from "@testing-library/react-native";
-import {View} from "react-native";
 
 import {Text} from "./Text";
 import {Tooltip} from "./Tooltip";
 import {renderWithTheme} from "./test-utils";
 
-// Mock react-native-portalize so Portal renders inline in tests
-mock.module("react-native-portalize", () => ({
-  Host: ({children}: {children: React.ReactNode}) => <View testID="portal-host">{children}</View>,
-  Portal: ({children}: {children: React.ReactNode}) => <View testID="portal">{children}</View>,
-}));
+// Minimal shape of the tree returned by toJSON() that we rely on here.
+interface TestNode {
+  type: string;
+  props: {
+    onPointerEnter?: () => void;
+    onPointerLeave?: () => void;
+    onTouchStart?: (event?: {nativeEvent: object}) => void;
+    onLayout?: (event: {
+      nativeEvent: {layout: {height: number; width: number; x: number; y: number}};
+    }) => void;
+  };
+  children: null | Array<TestNode | string>;
+}
 
 beforeAll(() => {
-  (global as any).requestAnimationFrame = (callback: FrameRequestCallback) => {
+  globalThis.requestAnimationFrame = (callback: FrameRequestCallback) => {
     return setTimeout(() => callback(Date.now()), 0) as unknown as number;
   };
-  (global as any).cancelAnimationFrame = (id: number) => {
+  globalThis.cancelAnimationFrame = (id: number) => {
     clearTimeout(id);
   };
 });
@@ -111,14 +118,14 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const wrapper = toJSON() as any;
+    const wrapper = toJSON();
     expect(wrapper).toBeTruthy();
     expect(queryByTestId("tooltip-container")).toBeNull();
 
-    const tree = toJSON();
+    const tree = toJSON() as TestNode | null;
     await act(async () => {
       // Trigger pointer enter on the wrapper
-      const root = (tree as any).children?.[0];
+      const root = tree?.children?.[0] as TestNode | undefined;
       if (root?.props?.onPointerEnter) {
         root.props.onPointerEnter();
       }
@@ -138,8 +145,8 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const tree = toJSON() as any;
-    const root = tree.children?.[0];
+    const tree = toJSON() as TestNode;
+    const root = tree.children?.[0] as TestNode;
 
     await act(async () => {
       root.props.onTouchStart?.({nativeEvent: {}});
@@ -151,8 +158,10 @@ describe("Tooltip", () => {
     expect(queryByTestId("tooltip-container")).toBeTruthy();
 
     // Second touch should hide
-    const treeAfterShow = toJSON() as any;
-    const updatedRoot = treeAfterShow.children?.[treeAfterShow.children.length - 1];
+    const treeAfterShow = toJSON() as TestNode;
+    const updatedRoot = (treeAfterShow.children as Array<TestNode | string>)[
+      (treeAfterShow.children as Array<TestNode | string>).length - 1
+    ] as TestNode;
     await act(async () => {
       updatedRoot.props.onTouchStart?.({nativeEvent: {}});
     });
@@ -167,8 +176,8 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const tree = toJSON() as any;
-    const root = tree.children?.[0];
+    const tree = toJSON() as TestNode;
+    const root = tree.children?.[0] as TestNode;
 
     await act(async () => {
       root.props.onPointerEnter?.();
@@ -179,8 +188,10 @@ describe("Tooltip", () => {
 
     expect(queryByTestId("tooltip-container")).toBeTruthy();
 
-    const treeAfter = toJSON() as any;
-    const wrapper = treeAfter.children?.[treeAfter.children.length - 1];
+    const treeAfter = toJSON() as TestNode;
+    const wrapper = (treeAfter.children as Array<TestNode | string>)[
+      (treeAfter.children as Array<TestNode | string>).length - 1
+    ] as TestNode;
     await act(async () => {
       wrapper.props.onPointerLeave?.();
     });
@@ -206,8 +217,8 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const tree = toJSON() as any;
-    const root = tree.children?.[0];
+    const tree = toJSON() as TestNode;
+    const root = tree.children?.[0] as TestNode;
 
     await act(async () => {
       root.props.onPointerEnter?.();
@@ -227,8 +238,8 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const tree = toJSON() as any;
-    const root = tree.children?.[0];
+    const tree = toJSON() as TestNode;
+    const root = tree.children?.[0] as TestNode;
 
     // Show the tooltip
     await act(async () => {
@@ -241,11 +252,12 @@ describe("Tooltip", () => {
 
     // Find any views with onLayout to simulate layout event
     const {View: ViewComp} = await import("react-native");
-    const allViews = UNSAFE_getAllByType(ViewComp as any);
+    const allViews = UNSAFE_getAllByType(ViewComp);
     for (const v of allViews) {
-      if ((v.props as any).onLayout) {
+      const props = v.props as TestNode["props"];
+      if (props.onLayout) {
         await act(async () => {
-          (v.props as any).onLayout({
+          props.onLayout?.({
             nativeEvent: {
               layout: {height: 100, width: 200, x: 0, y: 0},
             },
@@ -280,8 +292,8 @@ describe("Tooltip", () => {
       </Tooltip>
     );
 
-    const tree = toJSON() as any;
-    const root = tree.children?.[0];
+    const tree = toJSON() as TestNode;
+    const root = tree.children?.[0] as TestNode;
     await act(async () => {
       root.props.onPointerEnter?.();
     });

package/src/Unifier.ts

@@ -8,6 +8,7 @@ import {requestPermissions} from "./Permissions";
 
 declare global {
   interface Window {
+    // biome-ignore lint/suspicious/noExplicitAny: Google Maps JS SDK global type is loaded dynamically and not bundled as a typed dependency
     google: any;
   }
 }
@@ -25,7 +26,7 @@ export function changeColorLuminance(hex: string, luminanceChange: Luminance) {
   } else if (hex.length !== 6) {
     throw new Error(`Invalid color hex: ${hex}`);
   }
-  let luminance;
+  let luminance: number;
   switch (luminanceChange) {
     case "light":
       luminance = -0.2;
@@ -127,7 +128,7 @@ class UnifierClass {
   };
 
   storage = {
-    getItem: async (key: string, defaultValue?: any) => {
+    getItem: async (key: string, defaultValue?: unknown) => {
       try {
         const jsonValue = await AsyncStorage.getItem(key);
         if (jsonValue) {
@@ -147,13 +148,13 @@ class UnifierClass {
         return defaultValue || null;
       }
     },
-    setItem: async (key: string, item: any) => {
+    setItem: async (key: string, item: unknown) => {
       try {
         const jsonValue = JSON.stringify(item);
         await AsyncStorage.setItem(key, jsonValue);
-      } catch (error: any) {
+      } catch (error: unknown) {
         console.error(`[storage] Error storing ${key}`, item, error);
-        throw new Error(error);
+        throw new Error(error instanceof Error ? error.message : String(error));
       }
     },
   };

package/src/Utilities.tsx

@@ -6,7 +6,10 @@ import {Platform} from "react-native";
 import type {APIError, BaseProfile, IconSize} from "./Common";
 import {COUNTY_AND_COUNTY_EQUIVALENT_ENTITIES} from "./Constants";
 
-export function mergeInlineStyles(inlineStyle?: any, newStyle?: any) {
+export function mergeInlineStyles(
+  inlineStyle?: {__style?: Record<string, unknown>} | undefined,
+  newStyle?: Record<string, unknown> | undefined
+) {
   const inline = get(inlineStyle, "__style");
   return {
     __style: {
@@ -104,7 +107,7 @@ export const toProps = ({
   className,
   inlineStyle,
 }: Style): {className: string; style: InlineStyle} => {
-  const props: any = {};
+  const props: {className?: string; style?: InlineStyle} = {};
 
   if (className.size > 0) {
     // Sorting here ensures that classNames are always stable, reducing diff
@@ -117,7 +120,7 @@ export const toProps = ({
     props.style = inlineStyle;
   }
 
-  return props;
+  return props as {className: string; style: InlineStyle};
 };
 
 /*
@@ -173,7 +176,7 @@ export function bind<T>(
     | {
         readonly [key: string]: string;
       }
-    | any
+    | Record<string, string>
 ): (val: T) => Style {
   const map = mapClassName((name) => scope[name]);
   return (val: T): Style => map(fn(val));
@@ -316,8 +319,8 @@ export function formattedCountyCode(state: string, countyName: string): string {
   return `${countyData.stateFP}${countyData.countyFP}`;
 }
 
-export function isAPIError(error: any): error is APIError {
-  return error?.data?.title;
+export function isAPIError(error: unknown): error is APIError {
+  return Boolean((error as {data?: {title?: unknown}} | null | undefined)?.data?.title);
 }
 
 export function printAPIError(error: APIError, details = true): string {

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

@@ -421,7 +421,6 @@ exports[`AddressField renders correctly with default props 1`] = `
                   },
                 ],
                 "props": {
-                  "activeOpacity": 1,
                   "onPress": [Function],
                   "style": {
                     "alignItems": "center",
@@ -1118,7 +1117,9 @@ exports[`AddressField renders correctly with default props 1`] = `
           },
         ],
         "props": {
-          "style": undefined,
+          "style": {
+            "width": "100%",
+          },
           "testID": undefined,
         },
         "type": "View",

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

@@ -45,9 +45,12 @@ exports[`Button renders correctly with default props 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Click me",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Click me",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -64,7 +67,7 @@ exports[`Button renders correctly with default props 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -113,9 +116,12 @@ exports[`Button renders primary variant 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Primary",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Primary",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -132,7 +138,7 @@ exports[`Button renders primary variant 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -181,9 +187,12 @@ exports[`Button renders secondary variant 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Secondary",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Secondary",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -200,7 +209,7 @@ exports[`Button renders secondary variant 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -249,9 +258,12 @@ exports[`Button renders muted variant 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Muted",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Muted",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -268,7 +280,7 @@ exports[`Button renders muted variant 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -317,9 +329,12 @@ exports[`Button renders outline variant 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Outline",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Outline",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -336,7 +351,7 @@ exports[`Button renders outline variant 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -385,9 +400,12 @@ exports[`Button renders destructive variant 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Delete",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Delete",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -404,7 +422,7 @@ exports[`Button renders destructive variant 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -453,8 +471,11 @@ exports[`Button renders disabled state 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Disabled",
-    "aria-role": "button",
+    "accessibilityLabel": "Disabled",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": true,
+    },
     "disabled": true,
     "onPress": [Function: debounced],
     "style": {
@@ -521,8 +542,11 @@ exports[`Button applies disabled styles when disabled 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Disabled",
-    "aria-role": "button",
+    "accessibilityLabel": "Disabled",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": true,
+    },
     "disabled": true,
     "onPress": [Function: debounced],
     "style": {
@@ -612,8 +636,11 @@ exports[`Button renders loading state 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Loading",
-    "aria-role": "button",
+    "accessibilityLabel": "Loading",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": true,
+    },
     "disabled": true,
     "onPress": [Function: debounced],
     "style": {
@@ -680,9 +707,12 @@ exports[`Button renders fullWidth button 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Full Width",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Full Width",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -699,7 +729,7 @@ exports[`Button renders fullWidth button 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -761,9 +791,12 @@ exports[`Button renders with icon on left 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "With Icon",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "With Icon",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -780,7 +813,7 @@ exports[`Button renders with icon on left 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -842,9 +875,12 @@ exports[`Button renders with icon on right 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Next",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Next",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -861,7 +897,7 @@ exports[`Button renders with icon on right 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -910,9 +946,12 @@ exports[`Button renders with confirmation modal props 1`] = `
   ],
   "props": {
     "accessibilityHint": "Opens a confirmation dialog",
-    "aria-label": "Delete",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Delete",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -929,7 +968,7 @@ exports[`Button renders with confirmation modal props 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;
 
@@ -978,9 +1017,12 @@ exports[`Button renders with tooltip on desktop (wrapped in Tooltip) 1`] = `
   ],
   "props": {
     "accessibilityHint": "Press to perform action",
-    "aria-label": "Hover me",
-    "aria-role": "button",
-    "disabled": undefined,
+    "accessibilityLabel": "Hover me",
+    "accessibilityRole": "button",
+    "accessibilityState": {
+      "disabled": false,
+    },
+    "disabled": false,
     "onPress": [Function: debounced],
     "style": {
       "alignItems": "center",
@@ -997,6 +1039,6 @@ exports[`Button renders with tooltip on desktop (wrapped in Tooltip) 1`] = `
     },
     "testID": undefined,
   },
-  "type": "Pressable",
+  "type": "PressableScale",
 }
 `;