@lotics/ui 1.13.1 → 1.13.2

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@lotics/ui",
-  "version": "1.13.1",
+  "version": "1.13.2",
   "type": "module",
   "exports": {
     "./tokens": "./src/tokens.ts",

package/src/picker.tsx

@@ -109,7 +109,12 @@ function StandardPicker<T extends string>(props: PickerProps<T, false>) {
         placeholder={placeholder}
         enabled={!disabled}
       >
-        {(!value || includeEmptyOption) && <RNPicker.Item label="" value="" />}
+        {(!value || includeEmptyOption) && (
+          // Show the placeholder as the empty option (the standard
+          // `<option value="" selected>Placeholder</option>` pattern) so a
+          // native select hints what to choose.
+          <RNPicker.Item label={!value ? (placeholder ?? "") : ""} value="" />
+        )}
         {options.map((option) =>
           option ? (
             <RNPicker.Item
@@ -259,6 +264,13 @@ function PickerTrigger<T extends string>({
     <Pressable
       ref={ref}
       testID={testID}
+      // Without a role this Pressable renders as an unfocusable <div> on web —
+      // the trigger drops out of the tab order and Enter/Space can't open it.
+      // `button` makes it tab-focusable and maps keyboard activation to onPress;
+      // `expanded` announces open/closed to assistive tech. The accessible name
+      // comes from the visible selection/placeholder text below.
+      accessibilityRole="button"
+      accessibilityState={{ expanded: open, disabled }}
       style={[
         styles.pressable,
         open && !enableSearch && styles.opened,