No cancel button on Picker component

[castusoft]

Picker's useWheelPicker modal is missing cancelLabel button even if I set it. Plus no matter how I apply styles, it is not getting it.

<Picker
            label="Trip type"
            useWheelPicker
            value={tripType}
            onChange={nativePickerValue => setTripType(nativePickerValue)}
            trailingAccessory={<ReloadSvg width={24} height={24} fill='black'/>}
            containerStyle={{borderWidth: 1, borderColor: Colors.grey50, padding: 3}}
            topBarProps={{
              doneLabel: 'Ok',
              cancelLabel: 'NO',
              title: 'Trip type',
              useSafeArea: true,
              includeStatusBar: true,
              titleStyle: {color: 'red'},
              containerStyle: {backgroundColor: 'red'}
          }}
          >
            {_.map(options, option => (
              <Picker.Item key={option.value} value={option.value} label={option.label} disabled={option.disabled}/>
            ))}
          </Picker>

Related to

• [ x ] Components
• Demo
• Docs
• Typings

Screenshots/Video

Environment

• React Native version: 0.71.6
• React Native UI Lib version: ^7.2.4

Affected platforms

• Android
• [ x ] iOS
• Web

[kilimchoi]

is there a way to style the OK button? it's shifted to the right too much.

[ethanshar]

@kilimchoi Have you tried passing doneButtonProps in topBarProps?

@castusoft You need to pass a callback to onCancel in topBarProps in order for it to be rendered