Bug: itemStyle on macOS not supporting all styles properties. PLEASE READ

[elmcapp]

Using the picker on macOS we can use the itemStyle prop. The issue is that we can only change the width. If we try to change the alignment by using alignContent nothing happens. However you can go into the backend of the picker module and alignContent to flex start. Not sure why this prop is not fully supporting all styling properties.

below I am using alignContent:'flex-start'. It does not do anything however the width:200 does work

App.js

<Picker
   itemStyle={{alignContent: 'flex-start', width: 200}}
   selectedValue={selectedLanguage}
   onValueChange={(itemValue, itemIndex) =>
   setSelectedLanguage(itemValue)
   }>
      {/* picker items */}
</Picker>

Below I pass the same property in the styles and it works. aligning all the picker items to the left.

PickerMacOS.macos.js

<RNCPickerNativeComponent
          ref={(picker) => {
            this._picker = picker;
          }}
          testID={this.props.testID}
          style={[styles.pickerMacOS, this.props.itemStyle]}
          items={this.state.items}
          selectedIndex={this.state.selectedIndex}
          onChange={this._onChange}
        />


const styles = StyleSheet.create({
  pickerMacOS: {
    // The picker will conform to whatever width is given, but we do
    // have to set the component's height explicitly on the
    // surrounding view to ensure it gets rendered.
    height: 24,

    alignContent:'flex-start'
  },
});

Would like like to know why this is not working when importing the module or if we can fix this issue

[elmcapp]

Workaround is to use a width, alignContent, textAlign inside of the prop itemStyle

itemStyle={{
            // This workaround must include a width. You can use % width:"30%"
            width: 300,
            alignContent: isAligned ? 'flex-start' : 'center',
            textAlign: isAligned ? 'left' : 'center',
          }}