{
  "name": "WheelPicker",
  "category": "form",
  "description": "A customizable WheelPicker component",
  "note": "When using Android by default the FlatList will have <code>maxToRenderPerBatch</code> prop set to <code>items.length</code> to solve FlatList bug on Android, you can override it by passing your own <code>flatListProps</code> with <code>maxToRenderPerBatch</code> prop.<br/>See the RN FlatList issue for more info: https://github.com/facebook/react-native/issues/15990",
  "example": "https://github.com/wix/react-native-ui-lib/blob/master/demo/src/screens/componentScreens/WheelPickerScreen.tsx",
  "images": [],
  "props": [
    {"name": "initialValue", "type": "number | string", "description": "Initial value (uncontrolled)"},
    {"name": "items", "type": "WheelPickerItemProps[]", "description": "Data source for WheelPicker"},
    {"name": "itemHeight", "type": "number", "description": "Height of each item in the WheelPicker", "default": "44"},
    {"name": "numberOfVisibleRows", "type": "number", "description": "Number of rows visible", "default": "5"},
    {"name": "activeTextColor", "type": "string", "description": "Text color for the focused row"},
    {"name": "inactiveTextColor", "type": "string", "description": "Text color for other, non-focused rows"},
    {"name": "textStyle", "type": "TextStyle", "description": "Row text custom style"},
    {"name": "label", "type": "string", "description": "Additional label to render next to the items text"},
    {"name": "labelStyle", "type": "TextStyle", "description": "Additional label's style"},
    {"name": "labelProps", "type": "TextProps", "description": "Additional label's props"},
    {
      "name": "onChange",
      "type": "(item: string | number, index: number) => void",
      "description": "Change item event callback"
    },
    {
      "name": "style",
      "type": "ViewStyle",
      "description": "Container's custom style",
      "note": "height is computed according to itemHeight * numberOfVisibleRows"
    },
    {
      "name": "align",
      "type": "WheelPickerAlign",
      "description": "Align the content to center, right ot left",
      "default": "center"
    },
    {"name": "separatorsStyle", "type": "ViewStyle", "description": "Extra style for the separators"},
    {"name": "testID", "type": "string", "description": "test identifier"},
    {
      "name": "flatListProps",
      "type": "FlatListProps",
      "description": "Props to be sent to the FlatList."
    }
  ],
  "snippet": [
    "<WheelPicker",
    "  items={[{label: 'Yes', value: 'yes'}, {label: 'No', value: 'no'}, {label: 'Maybe', value: 'maybe'}]$1}",
    "  initialValue={'yes'$2}",
    "  onChange={() => console.log('changed')$3}",
    "/>"
  ]
}
