@terreno/ui 0.12.2 → 0.13.3

package/dist/useConsentHistory.d.ts

@@ -38,15 +38,16 @@ interface ConsentHistoryHookState {
     isLoading: boolean;
     refetch: () => void | Promise<void>;
 }
+interface ConsentHistoryEnhancedApi {
+    useGetMyConsentsQuery: () => ConsentHistoryHookState;
+}
 interface ConsentHistoryApi {
     injectEndpoints: (options: {
         endpoints: (build: ConsentHistoryQueryBuilder) => {
             getMyConsents: unknown;
         };
         overrideExisting: boolean;
-    }) => {
-        useGetMyConsentsQuery: () => ConsentHistoryHookState;
-    };
+    }) => ConsentHistoryEnhancedApi;
 }
 export declare const useConsentHistory: (api: ConsentHistoryApi, baseUrl?: string) => {
     entries: ConsentHistoryEntry[];

package/dist/useConsentHistory.js

@@ -1,7 +1,22 @@
-export const useConsentHistory = (api, baseUrl) => {
-    var _a;
-    const base = baseUrl || "";
-    const enhancedApi = api.injectEndpoints({
+/**
+ * Cache the enhanced api per (api, baseUrl). `injectEndpoints` logs a console
+ * error in development whenever an endpoint with the same name is re-injected
+ * (with `overrideExisting: false`), so calling it on every render of every
+ * consumer would flood the console. WeakMap-by-api lets the GC reclaim entries
+ * when the api object is unreachable.
+ */
+const enhancedApiCache = new WeakMap();
+const getEnhancedApi = (api, base) => {
+    let byBase = enhancedApiCache.get(api);
+    if (!byBase) {
+        byBase = new Map();
+        enhancedApiCache.set(api, byBase);
+    }
+    const cached = byBase.get(base);
+    if (cached) {
+        return cached;
+    }
+    const enhanced = api.injectEndpoints({
         endpoints: (build) => ({
             getMyConsents: build.query({
                 providesTags: ["MyConsents"],
@@ -10,6 +25,13 @@ export const useConsentHistory = (api, baseUrl) => {
         }),
         overrideExisting: false,
     });
+    byBase.set(base, enhanced);
+    return enhanced;
+};
+export const useConsentHistory = (api, baseUrl) => {
+    var _a;
+    const base = baseUrl || "";
+    const enhancedApi = getEnhancedApi(api, base);
     const { data, isLoading, error, refetch } = enhancedApi.useGetMyConsentsQuery();
     const entries = Array.isArray(data) ? data : ((_a = data === null || data === void 0 ? void 0 : data.data) !== null && _a !== void 0 ? _a : []);
     return { entries, error, isLoading, refetch };

package/dist/useConsentHistory.js.map

@@ -1 +1 @@
-{"version":3,"file":"useConsentHistory.js","sourceRoot":"","sources":["../src/useConsentHistory.ts"],"names":[],"mappings":"AA8CA,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,GAAsB,EAAE,OAAgB,EAAE,EAAE;;IAC5E,MAAM,IAAI,GAAG,OAAO,IAAI,EAAE,CAAC;IAE3B,MAAM,WAAW,GAAG,GAAG,CAAC,eAAe,CAAC;QACtC,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YACrB,aAAa,EAAE,KAAK,CAAC,KAAK,CAAC;gBACzB,YAAY,EAAE,CAAC,YAAY,CAAC;gBAC5B,KAAK,EAAE,GAAG,EAAE,CAAC,GAAG,IAAI,cAAc;aACnC,CAAC;SACH,CAAC;QACF,gBAAgB,EAAE,KAAK;KACxB,CAAC,CAAC;IAEH,MAAM,EAAC,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAC,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAC;IAC9E,MAAM,OAAO,GAA0B,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,mCAAI,EAAE,CAAC,CAAC;IAEvF,OAAO,EAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAC,CAAC;AAC9C,CAAC,CAAC"}
+{"version":3,"file":"useConsentHistory.js","sourceRoot":"","sources":["../src/useConsentHistory.ts"],"names":[],"mappings":"AAgDA;;;;;;GAMG;AACH,MAAM,gBAAgB,GAAG,IAAI,OAAO,EAA6D,CAAC;AAElG,MAAM,cAAc,GAAG,CAAC,GAAsB,EAAE,IAAY,EAA6B,EAAE;IACzF,IAAI,MAAM,GAAG,gBAAgB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACvC,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACnB,gBAAgB,CAAC,GAAG,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IACpC,CAAC;IACD,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAChC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,MAAM,CAAC;IAChB,CAAC;IACD,MAAM,QAAQ,GAAG,GAAG,CAAC,eAAe,CAAC;QACnC,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YACrB,aAAa,EAAE,KAAK,CAAC,KAAK,CAAC;gBACzB,YAAY,EAAE,CAAC,YAAY,CAAC;gBAC5B,KAAK,EAAE,GAAG,EAAE,CAAC,GAAG,IAAI,cAAc;aACnC,CAAC;SACH,CAAC;QACF,gBAAgB,EAAE,KAAK;KACxB,CAAC,CAAC;IACH,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC3B,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,iBAAiB,GAAG,CAAC,GAAsB,EAAE,OAAgB,EAAE,EAAE;;IAC5E,MAAM,IAAI,GAAG,OAAO,IAAI,EAAE,CAAC;IAC3B,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IAE9C,MAAM,EAAC,IAAI,EAAE,SAAS,EAAE,KAAK,EAAE,OAAO,EAAC,GAAG,WAAW,CAAC,qBAAqB,EAAE,CAAC;IAC9E,MAAM,OAAO,GAA0B,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAA,IAAI,aAAJ,IAAI,uBAAJ,IAAI,CAAE,IAAI,mCAAI,EAAE,CAAC,CAAC;IAEvF,OAAO,EAAC,OAAO,EAAE,KAAK,EAAE,SAAS,EAAE,OAAO,EAAC,CAAC;AAC9C,CAAC,CAAC"}

package/dist/useSubmitConsent.d.ts

@@ -22,18 +22,19 @@ interface SubmitConsentMutationBuilder {
         };
     }) => unknown;
 }
+interface SubmitConsentEnhancedApi {
+    useSubmitConsentResponseMutation: () => [
+        (body: SubmitConsentBody) => SubmitConsentMutationResult,
+        SubmitConsentMutationHookState
+    ];
+}
 interface SubmitConsentApiWithTags {
     injectEndpoints: (options: {
         endpoints: (build: SubmitConsentMutationBuilder) => {
             submitConsentResponse: unknown;
         };
         overrideExisting: boolean;
-    }) => {
-        useSubmitConsentResponseMutation: () => [
-            (body: SubmitConsentBody) => SubmitConsentMutationResult,
-            SubmitConsentMutationHookState
-        ];
-    };
+    }) => SubmitConsentEnhancedApi;
 }
 interface SubmitConsentApi {
     enhanceEndpoints: (options: {

package/dist/useSubmitConsent.js

@@ -1,7 +1,23 @@
-export const useSubmitConsent = (api, baseUrl) => {
-    const base = baseUrl || "";
+/**
+ * Cache the enhanced api per (api, baseUrl). `injectEndpoints` logs a console
+ * error in development whenever an endpoint with the same name is re-injected
+ * (with `overrideExisting: false`), so calling it on every render of every
+ * consumer would flood the console. WeakMap-by-api lets the GC reclaim entries
+ * when the api object is unreachable.
+ */
+const enhancedApiCache = new WeakMap();
+const getEnhancedApi = (api, base) => {
+    let byBase = enhancedApiCache.get(api);
+    if (!byBase) {
+        byBase = new Map();
+        enhancedApiCache.set(api, byBase);
+    }
+    const cached = byBase.get(base);
+    if (cached) {
+        return cached;
+    }
     const apiWithConsentTags = api.enhanceEndpoints({ addTagTypes: ["PendingConsents"] });
-    const enhancedApi = apiWithConsentTags.injectEndpoints({
+    const enhanced = apiWithConsentTags.injectEndpoints({
         endpoints: (build) => ({
             submitConsentResponse: build.mutation({
                 invalidatesTags: ["PendingConsents"],
@@ -14,6 +30,12 @@ export const useSubmitConsent = (api, baseUrl) => {
         }),
         overrideExisting: false,
     });
+    byBase.set(base, enhanced);
+    return enhanced;
+};
+export const useSubmitConsent = (api, baseUrl) => {
+    const base = baseUrl || "";
+    const enhancedApi = getEnhancedApi(api, base);
     const [submitMutation, { isLoading: isSubmitting, error }] = enhancedApi.useSubmitConsentResponseMutation();
     const submit = async (body) => {
         return submitMutation(body).unwrap();

package/dist/useSubmitConsent.js.map

@@ -1 +1 @@
-{"version":3,"file":"useSubmitConsent.js","sourceRoot":"","sources":["../src/useSubmitConsent.ts"],"names":[],"mappings":"AA4CA,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,GAAqB,EAAE,OAAgB,EAAE,EAAE;IAC1E,MAAM,IAAI,GAAG,OAAO,IAAI,EAAE,CAAC;IAC3B,MAAM,kBAAkB,GAAG,GAAG,CAAC,gBAAgB,CAAC,EAAC,WAAW,EAAE,CAAC,iBAAiB,CAAC,EAAC,CAAC,CAAC;IAEpF,MAAM,WAAW,GAAG,kBAAkB,CAAC,eAAe,CAAC;QACrD,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YACrB,qBAAqB,EAAE,KAAK,CAAC,QAAQ,CAAC;gBACpC,eAAe,EAAE,CAAC,iBAAiB,CAAC;gBACpC,KAAK,EAAE,CAAC,IAAuB,EAAE,EAAE,CAAC,CAAC;oBACnC,IAAI;oBACJ,MAAM,EAAE,MAAM;oBACd,GAAG,EAAE,GAAG,IAAI,mBAAmB;iBAChC,CAAC;aACH,CAAC;SACH,CAAC;QACF,gBAAgB,EAAE,KAAK;KACxB,CAAC,CAAC;IAEH,MAAM,CAAC,cAAc,EAAE,EAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAC,CAAC,GACtD,WAAW,CAAC,gCAAgC,EAAE,CAAC;IAEjD,MAAM,MAAM,GAAG,KAAK,EAAE,IAAuB,EAAE,EAAE;QAC/C,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,OAAO,EAAC,KAAK,EAAE,YAAY,EAAE,MAAM,EAAC,CAAC;AACvC,CAAC,CAAC"}
+{"version":3,"file":"useSubmitConsent.js","sourceRoot":"","sources":["../src/useSubmitConsent.ts"],"names":[],"mappings":"AA8CA;;;;;;GAMG;AACH,MAAM,gBAAgB,GAAG,IAAI,OAAO,EAA2D,CAAC;AAEhG,MAAM,cAAc,GAAG,CAAC,GAAqB,EAAE,IAAY,EAA4B,EAAE;IACvF,IAAI,MAAM,GAAG,gBAAgB,CAAC,GAAG,CAAC,GAAG,CAAC,CAAC;IACvC,IAAI,CAAC,MAAM,EAAE,CAAC;QACZ,MAAM,GAAG,IAAI,GAAG,EAAE,CAAC;QACnB,gBAAgB,CAAC,GAAG,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;IACpC,CAAC;IACD,MAAM,MAAM,GAAG,MAAM,CAAC,GAAG,CAAC,IAAI,CAAC,CAAC;IAChC,IAAI,MAAM,EAAE,CAAC;QACX,OAAO,MAAM,CAAC;IAChB,CAAC;IACD,MAAM,kBAAkB,GAAG,GAAG,CAAC,gBAAgB,CAAC,EAAC,WAAW,EAAE,CAAC,iBAAiB,CAAC,EAAC,CAAC,CAAC;IACpF,MAAM,QAAQ,GAAG,kBAAkB,CAAC,eAAe,CAAC;QAClD,SAAS,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,CAAC;YACrB,qBAAqB,EAAE,KAAK,CAAC,QAAQ,CAAC;gBACpC,eAAe,EAAE,CAAC,iBAAiB,CAAC;gBACpC,KAAK,EAAE,CAAC,IAAuB,EAAE,EAAE,CAAC,CAAC;oBACnC,IAAI;oBACJ,MAAM,EAAE,MAAM;oBACd,GAAG,EAAE,GAAG,IAAI,mBAAmB;iBAChC,CAAC;aACH,CAAC;SACH,CAAC;QACF,gBAAgB,EAAE,KAAK;KACxB,CAAC,CAAC;IACH,MAAM,CAAC,GAAG,CAAC,IAAI,EAAE,QAAQ,CAAC,CAAC;IAC3B,OAAO,QAAQ,CAAC;AAClB,CAAC,CAAC;AAEF,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,GAAqB,EAAE,OAAgB,EAAE,EAAE;IAC1E,MAAM,IAAI,GAAG,OAAO,IAAI,EAAE,CAAC;IAC3B,MAAM,WAAW,GAAG,cAAc,CAAC,GAAG,EAAE,IAAI,CAAC,CAAC;IAE9C,MAAM,CAAC,cAAc,EAAE,EAAC,SAAS,EAAE,YAAY,EAAE,KAAK,EAAC,CAAC,GACtD,WAAW,CAAC,gCAAgC,EAAE,CAAC;IAEjD,MAAM,MAAM,GAAG,KAAK,EAAE,IAAuB,EAAE,EAAE;QAC/C,OAAO,cAAc,CAAC,IAAI,CAAC,CAAC,MAAM,EAAE,CAAC;IACvC,CAAC,CAAC;IAEF,OAAO,EAAC,KAAK,EAAE,YAAY,EAAE,MAAM,EAAC,CAAC;AACvC,CAAC,CAAC"}

package/package.json

@@ -137,5 +137,5 @@
     "test:coverage": "TZ=America/New_York bun run ../scripts/check-coverage.ts",
     "types": "bun typedoc"
   },
-  "version": "0.12.2"
+  "version": "0.13.3"
 }

package/src/ConsentFormScreen.test.tsx

@@ -1,30 +1,10 @@
-import {afterAll, describe, expect, it, mock} from "bun:test";
+import {describe, expect, it, mock} from "bun:test";
 import {act, fireEvent} from "@testing-library/react-native";
-import {Text as RNText} from "react-native";
-
-// Capture the real MarkdownView export before mocking so we can restore it in
-// afterAll and avoid leaking a test-only mock to sibling test files.
-const RealMarkdownViewModule = require("./MarkdownView");
-
-// Mock MarkdownView with a simple Text passthrough so we can assert on the
-// rendered (variable-substituted) content without depending on
-// react-native-markdown-display's tokenization.
-mock.module("./MarkdownView", () => ({
-  MarkdownView: ({children}: {children: string}) => (
-    <RNText testID="markdown-view">{children}</RNText>
-  ),
-}));
 
 import {ConsentFormScreen} from "./ConsentFormScreen";
 import {renderWithTheme} from "./test-utils";
 import type {ConsentFormPublic} from "./useConsentForms";
 
-// Restore the real MarkdownView so downstream test files (e.g.
-// MarkdownView.test.tsx) see the un-mocked module regardless of test order.
-afterAll(() => {
-  mock.module("./MarkdownView", () => RealMarkdownViewModule);
-});
-
 const baseForm: ConsentFormPublic = {
   active: true,
   agreeButtonText: "I agree",
@@ -59,7 +39,7 @@ describe("ConsentFormScreen", () => {
   });
 
   it("substitutes variables in content and preserves unknown placeholders", () => {
-    const {getByTestId} = renderWithTheme(
+    const {getByText} = renderWithTheme(
       <ConsentFormScreen
         form={{...baseForm, content: {en: "Hello {{name}}, {{missing}} stays"}}}
         locale="en"
@@ -67,7 +47,7 @@ describe("ConsentFormScreen", () => {
         variables={{name: "Ada"}}
       />
     );
-    expect(getByTestId("markdown-view").props.children).toBe("Hello Ada, {{missing}} stays");
+    expect(getByText("Hello Ada, {{missing}} stays")).toBeTruthy();
   });
 
   it("invokes onAgree with signature and checkbox values", () => {
@@ -164,4 +144,92 @@ describe("ConsentFormScreen", () => {
     );
     expect(getByTestId("consent-form-scroll-hint")).toBeTruthy();
   });
+
+  it("shows footer scroll hint when scroll to bottom is required but not done", () => {
+    const form = {...baseForm, requireScrollToBottom: true};
+    const {getByTestId, queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(getByTestId("consent-footer-scroll-hint")).toBeTruthy();
+    expect(queryByTestId("consent-footer-signature-hint")).toBeNull();
+  });
+
+  it("hides footer scroll hint when scroll to bottom is not required", () => {
+    const {queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={baseForm} locale="en" onAgree={() => {}} />
+    );
+    expect(queryByTestId("consent-footer-scroll-hint")).toBeNull();
+  });
+
+  it("shows footer signature hint when signature is required but not provided", () => {
+    const form = {...baseForm, captureSignature: true};
+    const {getByTestId, queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(getByTestId("consent-footer-signature-hint")).toBeTruthy();
+    expect(queryByTestId("consent-footer-scroll-hint")).toBeNull();
+  });
+
+  it("hides footer signature hint when signature is not required", () => {
+    const {queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={baseForm} locale="en" onAgree={() => {}} />
+    );
+    expect(queryByTestId("consent-footer-signature-hint")).toBeNull();
+  });
+
+  it("shows both footer hints when scroll and signature are both required", () => {
+    const form = {...baseForm, captureSignature: true, requireScrollToBottom: true};
+    const {getByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(getByTestId("consent-footer-scroll-hint")).toBeTruthy();
+    expect(getByTestId("consent-footer-signature-hint")).toBeTruthy();
+  });
+
+  it("shows the required-items legend when any checkbox is required", () => {
+    const form: ConsentFormPublic = {
+      ...baseForm,
+      checkboxes: [{label: "Required box", required: true}],
+    };
+    const {getByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(getByTestId("consent-form-required-legend")).toBeTruthy();
+  });
+
+  it("hides the required-items legend when no checkbox is required", () => {
+    const form: ConsentFormPublic = {
+      ...baseForm,
+      checkboxes: [{label: "Optional box", required: false}],
+    };
+    const {queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(queryByTestId("consent-form-required-legend")).toBeNull();
+  });
+
+  it("shows the checkbox footer hint when a required checkbox is unchecked", () => {
+    const form: ConsentFormPublic = {
+      ...baseForm,
+      checkboxes: [{label: "Required box", required: true}],
+    };
+    const {getByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    expect(getByTestId("consent-footer-checkboxes-hint")).toBeTruthy();
+  });
+
+  it("hides the checkbox footer hint once required checkboxes are checked", () => {
+    const form: ConsentFormPublic = {
+      ...baseForm,
+      checkboxes: [{label: "Required box", required: true}],
+    };
+    const {getByTestId, queryByTestId} = renderWithTheme(
+      <ConsentFormScreen form={form} locale="en" onAgree={() => {}} />
+    );
+    act(() => {
+      fireEvent.press(getByTestId("consent-form-checkbox-0"));
+    });
+    expect(queryByTestId("consent-footer-checkboxes-hint")).toBeNull();
+  });
 });

package/src/ConsentFormScreen.tsx

@@ -50,6 +50,7 @@ export const ConsentFormScreen: React.FC<ConsentFormScreenProps> = ({
   });
 
   const signatureProvided = !form.captureSignature || Boolean(signatureValue);
+  const hasRequiredCheckboxes = form.checkboxes.some((checkbox) => checkbox.required);
 
   const canAgree = hasScrolledToBottom && allRequiredCheckboxesChecked && signatureProvided;
 
@@ -140,6 +141,21 @@ export const ConsentFormScreen: React.FC<ConsentFormScreenProps> = ({
           />
         </Box>
       </Box>
+      {Boolean(form.requireScrollToBottom && !hasScrolledToBottom) && (
+        <Text align="center" color="error" size="sm" testID="consent-footer-scroll-hint">
+          Please scroll to the bottom to continue
+        </Text>
+      )}
+      {Boolean(hasRequiredCheckboxes && !allRequiredCheckboxesChecked) && (
+        <Text align="center" color="error" size="sm" testID="consent-footer-checkboxes-hint">
+          Please check all required items marked with *
+        </Text>
+      )}
+      {Boolean(form.captureSignature && !signatureValue) && (
+        <Text align="center" color="error" size="sm" testID="consent-footer-signature-hint">
+          Please provide your signature to continue
+        </Text>
+      )}
     </Box>
   );
 
@@ -159,6 +175,11 @@ export const ConsentFormScreen: React.FC<ConsentFormScreenProps> = ({
 
           {form.checkboxes.length > 0 && (
             <Box direction="column" gap={2} testID="consent-form-checkboxes">
+              {hasRequiredCheckboxes && (
+                <Text color="secondaryDark" size="sm" testID="consent-form-required-legend">
+                  * indicates a required item
+                </Text>
+              )}
               {form.checkboxes.map((checkbox, index) => {
                 const key = index.toString();
                 const isChecked = checkboxValues[key] ?? false;

package/src/Field.tsx

@@ -50,7 +50,7 @@ export const Field: FC<FieldProps> = ({type, ...rest}) => {
   } else if (type && ["date", "time", "datetime"].includes(type)) {
     return (
       <DateTimeField
-        {...(rest as DateTimeFieldProps as any)}
+        {...(rest as Omit<DateTimeFieldProps, "type">)}
         type={type as "date" | "time" | "datetime"}
       />
     );

package/src/HeightField.test.tsx

@@ -206,3 +206,71 @@ describe("HeightField", () => {
     });
   });
 });
+
+describe("HeightField - Android platform", () => {
+  // Toggle Platform.OS to "android" to exercise the Android rendering branch
+  // that uses SelectField pickers instead of the Pressable+ActionSheet path.
+  const {Platform} = require("react-native") as {Platform: {OS: string}};
+  const originalOS = Platform.OS;
+
+  beforeEach(() => {
+    Platform.OS = "android";
+  });
+
+  afterEach(() => {
+    Platform.OS = originalOS;
+  });
+
+  it("renders Android pickers with title, helperText, and errorText", () => {
+    const onChange = mock(() => {});
+    const {getByText, queryByLabelText} = renderWithTheme(
+      <HeightField
+        errorText="Required"
+        helperText="Enter height"
+        onChange={onChange}
+        title="Height"
+        value="70"
+      />
+    );
+    // Title and helper/error rendered
+    expect(getByText("Height")).toBeTruthy();
+    expect(getByText("Enter height")).toBeTruthy();
+    expect(getByText("Required")).toBeTruthy();
+    // The Pressable from the iOS branch should NOT be present.
+    expect(queryByLabelText("Height selector")).toBeNull();
+  });
+
+  it("renders Android pickers in disabled state", () => {
+    const onChange = mock(() => {});
+    const {root} = renderWithTheme(
+      <HeightField disabled onChange={onChange} title="Height" value="60" />
+    );
+    expect(root).toBeTruthy();
+  });
+
+  it("forwards feet picker changes to onChange (Android)", () => {
+    const onChange = mock(() => {});
+    const {SelectField} = require("./SelectField") as {
+      SelectField: React.ComponentType<{onChange?: (v: string) => void}>;
+    };
+    const {UNSAFE_getAllByType} = renderWithTheme(<HeightField onChange={onChange} value="70" />);
+    const selects = UNSAFE_getAllByType(SelectField);
+    expect(selects.length).toBe(2);
+    // First SelectField is feet. value="70" → 5ft 10in. Bumping feet to 6 yields 6*12+10=82.
+    selects[0].props.onChange?.("6");
+    expect(onChange).toHaveBeenCalledWith("82");
+  });
+
+  it("forwards inches picker changes to onChange (Android)", () => {
+    const onChange = mock(() => {});
+    const {SelectField} = require("./SelectField") as {
+      SelectField: React.ComponentType<{onChange?: (v: string) => void}>;
+    };
+    const {UNSAFE_getAllByType} = renderWithTheme(<HeightField onChange={onChange} value="70" />);
+    const selects = UNSAFE_getAllByType(SelectField);
+    expect(selects.length).toBe(2);
+    // Second SelectField is inches. value="70" → 5ft 10in. Changing inches to 3 yields 5*12+3=63.
+    selects[1].props.onChange?.("3");
+    expect(onChange).toHaveBeenCalledWith("63");
+  });
+});

package/src/Modal.tsx

@@ -12,7 +12,7 @@ import {Gesture, GestureDetector} from "react-native-gesture-handler";
 import {runOnJS} from "react-native-reanimated";
 
 import {Button} from "./Button";
-import type {ModalProps} from "./Common";
+import type {ModalProps, TerrenoTheme} from "./Common";
 import {Heading} from "./Heading";
 import {Icon} from "./Icon";
 import {isMobileDevice} from "./MediaQuery";
@@ -45,7 +45,7 @@ const ModalContent: FC<{
   secondaryButtonOnClick?: ModalProps["secondaryButtonOnClick"];
   onDismiss: ModalProps["onDismiss"];
   sizePx: DimensionValue;
-  theme: any;
+  theme: TerrenoTheme;
   isMobile: boolean;
 }> = ({
   children,

package/src/NumberField.test.tsx

@@ -4,23 +4,23 @@ import {act, fireEvent, waitFor} from "@testing-library/react-native";
 import {NumberField} from "./NumberField";
 import {renderWithTheme} from "./test-utils";
 
+const noOp = (): void => {};
+
 describe("NumberField", () => {
   it("renders correctly with default props", () => {
-    const {toJSON} = renderWithTheme(
-      <NumberField label="Number" onChange={() => {}} type="number" />
-    );
+    const {toJSON} = renderWithTheme(<NumberField label="Number" onChange={noOp} type="number" />);
     expect(toJSON()).toMatchSnapshot();
   });
 
   it("renders with initial value", () => {
     const {getByDisplayValue} = renderWithTheme(
-      <NumberField label="Number" onChange={() => {}} type="number" value="42" />
+      <NumberField label="Number" onChange={noOp} type="number" value="42" />
     );
     expect(getByDisplayValue("42")).toBeTruthy();
   });
 
   it("calls onChange with valid integer", async () => {
-    const handleChange = mock((_value: string) => {});
+    const handleChange = mock((_value: string): void => {});
     const {getByDisplayValue} = renderWithTheme(
       <NumberField label="Number" onChange={handleChange} type="number" value="" />
     );
@@ -36,7 +36,7 @@ describe("NumberField", () => {
   });
 
   it("does not call onChange with non-integer for number type", async () => {
-    const handleChange = mock((_value: string) => {});
+    const handleChange = mock((_value: string): void => {});
     const {getByDisplayValue} = renderWithTheme(
       <NumberField label="Number" onChange={handleChange} type="number" value="" />
     );
@@ -51,7 +51,7 @@ describe("NumberField", () => {
   });
 
   it("calls onChange with valid decimal", async () => {
-    const handleChange = mock((_value: string) => {});
+    const handleChange = mock((_value: string): void => {});
     const {getByDisplayValue} = renderWithTheme(
       <NumberField label="Decimal" onChange={handleChange} type="decimal" value="" />
     );
@@ -67,7 +67,7 @@ describe("NumberField", () => {
   });
 
   it("handles leading dot for decimal type", async () => {
-    const handleChange = mock((_value: string) => {});
+    const handleChange = mock((_value: string): void => {});
     const {getByDisplayValue} = renderWithTheme(
       <NumberField label="Decimal" onChange={handleChange} type="decimal" value="" />
     );
@@ -84,40 +84,34 @@ describe("NumberField", () => {
 
   it("validates max value", () => {
     const {getByText} = renderWithTheme(
-      <NumberField label="Number" max={100} onChange={() => {}} type="number" value="150" />
+      <NumberField label="Number" max={100} onChange={noOp} type="number" value="150" />
     );
     expect(getByText("Value must be less than or equal to 100")).toBeTruthy();
   });
 
   it("validates min value", () => {
     const {getByText} = renderWithTheme(
-      <NumberField label="Number" min={10} onChange={() => {}} type="number" value="5" />
+      <NumberField label="Number" min={10} onChange={noOp} type="number" value="5" />
     );
     expect(getByText("Value must be greater than or equal to 10")).toBeTruthy();
   });
 
   it("shows custom errorText", () => {
     const {getByText} = renderWithTheme(
-      <NumberField
-        errorText="Custom error"
-        label="Number"
-        onChange={() => {}}
-        type="number"
-        value=""
-      />
+      <NumberField errorText="Custom error" label="Number" onChange={noOp} type="number" value="" />
     );
     expect(getByText("Custom error")).toBeTruthy();
   });
 
   it("does not show error for valid number within range", () => {
     const {queryByText} = renderWithTheme(
-      <NumberField label="Number" max={100} min={0} onChange={() => {}} type="number" value="50" />
+      <NumberField label="Number" max={100} min={0} onChange={noOp} type="number" value="50" />
     );
     expect(queryByText(/must be/)).toBeNull();
   });
 
   it("syncs value when prop changes", async () => {
-    const handleChange = mock((_value: string) => {});
+    const handleChange = mock((_value: string): void => {});
     const {getByDisplayValue, unmount} = renderWithTheme(
       <NumberField label="Number" onChange={handleChange} type="number" value="10" />
     );