@jobber/components-native 0.114.17-JOB-90457--9c066de.4 → 0.115.1

package/dist/docs/ProgressIndicator/ProgressIndicator.md

@@ -58,13 +58,10 @@ The indicator does not participate in the keyboard tab order.
 
 ### Reduced motion
 
-The width transition between `value` updates is intentionally **preserved**
-under
+The width transition between `value` updates is disabled under
 [`prefers-reduced-motion: reduce`](https://developer.mozilla.org/docs/Web/CSS/@media/prefers-reduced-motion).
-The slide between progress values conveys functional information about progress,
-direction, and magnitude — it is exempt under
-[WCAG 2.3.3 ("Animation from Interactions")](https://www.w3.org/WAI/WCAG21/Understanding/animation-from-interactions.html).
-Removing the transition would make progress harder to perceive, not easier.
+The fill updates immediately to the new value, so current progress remains
+visible without interpolation. The stepped variation does not animate.
 
 ## Relationship to ProgressBar
 

package/dist/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@jobber/components-native",
-    "version": "0.114.17-JOB-90457--9c066de.4+9c066de0",
+    "version": "0.115.1",
     "license": "MIT",
     "description": "React Native implementation of Atlantis",
     "repository": {
@@ -123,5 +123,5 @@
         "react-native-screens": ">=4.18.0",
         "react-native-svg": ">=12.0.0"
     },
-    "gitHead": "9c066de0ed5e3a4a021d14ff31ba5f57ce0813a0"
+    "gitHead": "df5ca5cd691c56be40fad67fae7ea644724656cc"
 }

package/dist/src/Select/SelectRoot.test.js

@@ -1,5 +1,6 @@
 import React from "react";
-import { render, screen, within } from "@testing-library/react-native";
+import { fireEvent, render, screen, within, } from "@testing-library/react-native";
+import { Pressable } from "react-native";
 import { SelectRoot } from "./SelectRoot";
 import { SelectTrigger } from "./components/SelectTrigger";
 import { SelectLabel } from "./components/SelectLabel";
@@ -12,6 +13,34 @@ function renderRoot(props = {}) {
             React.createElement(SelectPrimitive.Value, { placeholder: "Select an option" }))));
 }
 describe("SelectRoot chrome", () => {
+    it("shows the placeholder when a controlled value is cleared to undefined", () => {
+        function ControlledSelect() {
+            const [value, setValue] = React.useState();
+            return (React.createElement(React.Fragment, null,
+                React.createElement(SelectRoot, { value: value, onValueChange: setValue },
+                    React.createElement(SelectTrigger, null,
+                        React.createElement(SelectPrimitive.Value, { placeholder: "Select an option" })),
+                    React.createElement(SelectPrimitive.Item, { testID: "toronto-option", value: "tor", label: "Toronto" })),
+                React.createElement(Pressable, { testID: "clear-value", onPress: () => setValue(undefined) })));
+        }
+        render(React.createElement(ControlledSelect, null));
+        fireEvent.press(screen.getByTestId("toronto-option"));
+        expect(screen.getByText("Toronto")).toBeDefined();
+        fireEvent.press(screen.getByTestId("clear-value"));
+        expect(screen.queryByText("Toronto")).toBeNull();
+        expect(screen.getByText("Select an option")).toHaveStyle({
+            color: tokens["color-text--secondary"],
+        });
+    });
+    it("preserves an uncontrolled default value across rerenders", () => {
+        const { rerender } = renderRoot({
+            defaultValue: { value: "tor", label: "Toronto" },
+        });
+        rerender(React.createElement(SelectRoot, { defaultValue: { value: "tor", label: "Toronto" } },
+            React.createElement(SelectTrigger, null,
+                React.createElement(SelectPrimitive.Value, { placeholder: "Select an option" }))));
+        expect(screen.getByText("Toronto")).toBeDefined();
+    });
     it("renders a composed label (visible, hidden from assistive tech)", () => {
         render(React.createElement(SelectRoot, null,
             React.createElement(SelectLabel, null, "City"),

package/dist/src/primitives/Select/SelectPrimitive.js

@@ -21,9 +21,16 @@ export const SELECT_TRIGGER_DEFAULT_TEST_ID = "ATL-Select-Trigger";
 function useIsDarkTheme() {
     return useAtlantisTheme().effectiveTheme === "dark";
 }
-function SelectPrimitiveRoot(_a) {
-    var props = __rest(_a, []);
-    return React.createElement(Primitive.Root, Object.assign({}, props));
+// @rn-primitives/select treats `undefined` as uncontrolled. Keep an explicitly
+// controlled empty value defined so clearing the prop cannot reveal stale
+// internal state. Its undefined fields cannot match a public string item value.
+const EMPTY_CONTROLLED_VALUE = {};
+function SelectPrimitiveRoot(props) {
+    const isControlled = Object.prototype.hasOwnProperty.call(props, "value");
+    const value = isControlled && props.value === undefined
+        ? EMPTY_CONTROLLED_VALUE
+        : props.value;
+    return React.createElement(Primitive.Root, Object.assign({}, props, { value: value }));
 }
 /**
  * Styled trigger field. Renders only its `children` — compose

package/dist/src/primitives/Select/SelectPrimitive.test.js

@@ -9,6 +9,7 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
 };
 import React from "react";
 import { render, screen, userEvent, within, } from "@testing-library/react-native";
+import { Pressable } from "react-native";
 import { darkTokens } from "@jobber/design";
 import { PortalHost } from "@rn-primitives/portal";
 import { SelectPrimitive } from "./SelectPrimitive";
@@ -30,6 +31,35 @@ function renderSelect({ defaultValue, onOpenChange, disabled, invalid, testID, t
         React.createElement(SelectPrimitive.Trigger, { ref: triggerRef, testID: testID, invalid: invalid },
             React.createElement(SelectPrimitive.Value, { placeholder: "Select an option" }))));
 }
+describe("SelectPrimitive.Root", () => {
+    it("does not select an empty-string item when a controlled value is cleared", () => __awaiter(void 0, void 0, void 0, function* () {
+        function ControlledSelect() {
+            const [value, setValue] = React.useState({ value: "tor", label: "Toronto" });
+            return (React.createElement(React.Fragment, null,
+                React.createElement(SelectPrimitive.Root, { value: value, onValueChange: setValue },
+                    React.createElement(SelectPrimitive.Trigger, null,
+                        React.createElement(SelectPrimitive.Value, { placeholder: "Select an option" })),
+                    React.createElement(SelectPrimitive.Portal, null,
+                        React.createElement(SelectPrimitive.Overlay, null),
+                        React.createElement(SelectPrimitive.Content, null,
+                            React.createElement(SelectPrimitive.Viewport, null,
+                                React.createElement(SelectPrimitive.Item, { testID: "empty-option", value: "", label: "Empty" },
+                                    React.createElement(SelectPrimitive.ItemText, null),
+                                    React.createElement(SelectPrimitive.ItemIndicator, null,
+                                        React.createElement(Icon, { name: "checkmark" }))),
+                                React.createElement(SelectPrimitive.Item, { value: "tor", label: "Toronto" },
+                                    React.createElement(SelectPrimitive.ItemText, null),
+                                    React.createElement(SelectPrimitive.ItemIndicator, null,
+                                        React.createElement(Icon, { name: "checkmark" }))))))),
+                React.createElement(Pressable, { testID: "clear-value", onPress: () => setValue(undefined) })));
+        }
+        render(React.createElement(ControlledSelect, null), { wrapper: PortalHostWrapper });
+        yield user.press(screen.getByTestId("clear-value"));
+        yield openSelect();
+        expect(screen.getByTestId("empty-option").props.accessibilityState).toMatchObject({ checked: false });
+        expect(screen.queryByTestId("checkmark")).toBeNull();
+    }));
+});
 describe("SelectPrimitive.Trigger", () => {
     it("renders with the default testID", () => {
         renderSelect();