import React from 'react';
import PropTypes from 'prop-types';
import { compose } from 'recompose';
import { Animated } from 'react-native';
import styled from '@ui/styled';

import NativePicker from './PickerFromRNWeb'; // todo
import InputUnderline from '../InputUnderline';
import InputWrapper from '../InputWrapper';
import FloatingLabel from '../FloatingLabel';
import withInputControlStyles from '../withInputControlStyles';

const StyledNativePicker = compose(
  withInputControlStyles,
  styled({
    background: 'none',
    border: 'none',
    borderRadius: 0,
    outline: 'none',
  }),
)(NativePicker);

const Picker = ({ wrapperStyle, ...props }) => (
  <InputWrapper style={wrapperStyle}>
    <StyledNativePicker {...props} prompt={props.placeholder} />
    <FloatingLabel animation={new Animated.Value(1)}>{props.label}</FloatingLabel>
    <InputUnderline />
  </InputWrapper>
);

Picker.propTypes = {
  label: PropTypes.string,
  placeholder: PropTypes.string,
  wrapperStyle: PropTypes.any, // eslint-disable-line
};

export default Picker;
export const { Item } = NativePicker;

@@ -639,16 +639,23 @@
 erStyle,
+ value,
  ...prop
@@ -736,16 +736,38 @@
 ..props%7D
+ selectedValue=%7Bvalue%7D
  prompt=
@@ -1052,16 +1052,63 @@
 le-line%0A
+  value: PropTypes.any, // eslint-disable-line%0A
 %7D;%0A%0Aexpo

fix input selected value on web