@terreno/ui 0.16.1 → 0.17.0

package/package.json

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

package/src/SelectBadge.android.test.tsx

@@ -0,0 +1,62 @@
+import {afterAll, beforeAll, describe, expect, it, mock} from "bun:test";
+import {act} from "@testing-library/react-native";
+import {Platform} from "react-native";
+
+import {SelectBadge} from "./SelectBadge";
+import {renderWithTheme} from "./test-utils";
+
+// Force Platform.OS to "android" for this file so SelectBadge takes the
+// renderPicker branch (native Picker overlay) instead of the iOS modal.
+const originalOS = Platform.OS;
+beforeAll(() => {
+  Object.defineProperty(Platform, "OS", {configurable: true, value: "android"});
+});
+afterAll(() => {
+  Object.defineProperty(Platform, "OS", {configurable: true, value: originalOS});
+});
+
+describe("SelectBadge (android)", () => {
+  const options = [
+    {label: "Option A", value: "a"},
+    {label: "Option B", value: "b"},
+    {label: "Option C", value: "c"},
+  ];
+
+  it("renders the Android-native Picker overlay", () => {
+    const {UNSAFE_getAllByProps, toJSON} = renderWithTheme(
+      <SelectBadge onChange={() => {}} options={options} value="a" />
+    );
+    // The Android picker should be rendered (not the iOS modal or web dropdown)
+    expect(toJSON()).toBeTruthy();
+    // Find the picker by its selectedValue prop (Android overlay renders a Picker directly)
+    const pickers = UNSAFE_getAllByProps({selectedValue: "a"});
+    expect(pickers.length).toBeGreaterThan(0);
+  });
+
+  it("invokes onChange when Android picker value changes", () => {
+    const handleChange = mock((_val: string) => {});
+    const {UNSAFE_getAllByProps} = renderWithTheme(
+      <SelectBadge onChange={handleChange} options={options} value="a" />
+    );
+    const pickers = UNSAFE_getAllByProps({selectedValue: "a"});
+    const picker = pickers.find(
+      (p: {props?: {onValueChange?: (v: string) => void}}) =>
+        typeof p.props?.onValueChange === "function"
+    );
+    expect(picker).toBeDefined();
+    act(() => {
+      if (picker) {
+        picker.props.onValueChange("b");
+      }
+    });
+    expect(handleChange).toHaveBeenCalledWith("b");
+  });
+
+  it("renders with disabled prop on Android", () => {
+    const {UNSAFE_getAllByProps} = renderWithTheme(
+      <SelectBadge disabled onChange={() => {}} options={options} value="a" />
+    );
+    const pickers = UNSAFE_getAllByProps({enabled: false});
+    expect(pickers.length).toBeGreaterThan(0);
+  });
+});

package/src/SelectBadge.test.tsx

@@ -137,6 +137,22 @@ describe("SelectBadge", () => {
     expect(handleChange).toHaveBeenCalledWith("b");
   });
 
+  it("closes picker without calling onChange when Save is pressed with empty value", () => {
+    const handleChange = mock((_val: string) => {});
+    const {getByLabelText} = renderWithTheme(
+      <SelectBadge onChange={handleChange} options={defaultOptions} value="" />
+    );
+    // Open the iOS picker modal
+    act(() => {
+      fireEvent.press(getByLabelText("Open select badge options"));
+    });
+    // Press Save without changing value (iosDisplayValue is "" which is falsy)
+    act(() => {
+      fireEvent.press(getByLabelText("Save selected value"));
+    });
+    expect(handleChange).not.toHaveBeenCalled();
+  });
+
   it("does not call onChange when iOS picker is dismissed", () => {
     const handleChange = mock((_val: string) => {});
     const {getByLabelText} = renderWithTheme(