Picker with MULTI – wrong value type

[mb8z]

Description

Picker component with MULTI mode needs whole options to render their proper labels within text field

Related to

• Components
• Demo
• Docs
• Typings

Steps to reproduce

1. Create a Picker component, with mode set to "MULTI".
2. Use sample options (e.g. [{ label: 'Hello', value: '1' }, { label: 'World', value: '2' }])
3. Pass ['1'] as the Pickers value – no labels renders in the text field
4. Now pass [{ label: 'Hello', value: '1' }] as the value – the labels in the text field are now rendered correctly

Expected behavior

The expected behaviour would be to follow the expected type for the value

Actual behavior

See above

Code snippe

import { Picker as RNUIPicker } from 'react-native-ui-lib';

const options = [
  { value: '1', label: 'One' },
  { value: '2', label: 'Two' },
  { value: '3', label: 'Three' },
];
<Picker
  mode={Picker.modes.MULTI}
  value={['1', '2']}
>
  {options.map((option) => {
    return (
      <Picker.Item
        key={option.value}
        value={option.value}
        label={option.label}
      />
    );
  })}
</Picker>
// Versus
<Picker
  mode={Picker.modes.MULTI}
  value={[{ value: '1', label: 'One' }, { value: '2', label: 'Two' }]}
>
  {options.map((option) => {
    return (
      <Picker.Item
        key={option.value}
        value={option.value}
        label={option.label}
      />
    );
  })}
</Picker>

Screenshots/Video

—

Environment

• React Native version: 0.72.3
• React Native UI Lib version: 7.7.0

Affected platforms

• Android
• iOS – only tested here
• Web

[ethanshar]

Hi @mb8z
This issue has been fixed
Please try a recent version