{"action":"created","issue":{"url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/866","repository_url":"https://api.github.com/repos/react-native-training/react-native-elements","labels_url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/866/labels{/name}","comments_url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/866/comments","events_url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/866/events","html_url":"https://github.com/react-native-training/react-native-elements/pull/866","id":292412858,"number":866,"title":"ListItem v1 (Android & iOS)","user":{"login":"martinezguillaume","id":17292331,"avatar_url":"https://avatars0.githubusercontent.com/u/17292331?v=4","gravatar_id":"","url":"https://api.github.com/users/martinezguillaume","html_url":"https://github.com/martinezguillaume","followers_url":"https://api.github.com/users/martinezguillaume/followers","following_url":"https://api.github.com/users/martinezguillaume/following{/other_user}","gists_url":"https://api.github.com/users/martinezguillaume/gists{/gist_id}","starred_url":"https://api.github.com/users/martinezguillaume/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/martinezguillaume/subscriptions","organizations_url":"https://api.github.com/users/martinezguillaume/orgs","repos_url":"https://api.github.com/users/martinezguillaume/repos","events_url":"https://api.github.com/users/martinezguillaume/events{/privacy}","received_events_url":"https://api.github.com/users/martinezguillaume/received_events","type":"User","site_admin":false},"labels":[{"id":439000338,"url":"https://api.github.com/repos/react-native-training/react-native-elements/labels/Enhancement","name":"Enhancement","color":"0052cc","default":false},{"id":580176327,"url":"https://api.github.com/repos/react-native-training/react-native-elements/labels/Needs%20Response%20from%20Author","name":"Needs Response from Author","color":"d93f0b","default":false},{"id":587058854,"url":"https://api.github.com/repos/react-native-training/react-native-elements/labels/New%20Component","name":"New Component","color":"0e8a16","default":false},{"id":655936080,"url":"https://api.github.com/repos/react-native-training/react-native-elements/labels/v1","name":"v1","color":"fbca04","default":false}],"state":"closed","locked":false,"assignee":null,"assignees":[],"milestone":{"url":"https://api.github.com/repos/react-native-training/react-native-elements/milestones/2","html_url":"https://github.com/react-native-training/react-native-elements/milestone/2","labels_url":"https://api.github.com/repos/react-native-training/react-native-elements/milestones/2/labels","id":3141650,"number":2,"title":"Beta 4 Release","description":"The 4th beta for v1.0.0","creator":{"login":"iRoachie","id":5962998,"avatar_url":"https://avatars2.githubusercontent.com/u/5962998?v=4","gravatar_id":"","url":"https://api.github.com/users/iRoachie","html_url":"https://github.com/iRoachie","followers_url":"https://api.github.com/users/iRoachie/followers","following_url":"https://api.github.com/users/iRoachie/following{/other_user}","gists_url":"https://api.github.com/users/iRoachie/gists{/gist_id}","starred_url":"https://api.github.com/users/iRoachie/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/iRoachie/subscriptions","organizations_url":"https://api.github.com/users/iRoachie/orgs","repos_url":"https://api.github.com/users/iRoachie/repos","events_url":"https://api.github.com/users/iRoachie/events{/privacy}","received_events_url":"https://api.github.com/users/iRoachie/received_events","type":"User","site_admin":false},"open_issues":3,"closed_issues":1,"state":"open","created_at":"2018-02-25T18:10:34Z","updated_at":"2018-02-25T20:50:38Z","due_on":null,"closed_at":null},"comments":2,"created_at":"2018-01-29T13:48:25Z","updated_at":"2018-02-25T20:50:38Z","closed_at":"2018-02-25T20:50:38Z","author_association":"COLLABORATOR","pull_request":{"url":"https://api.github.com/repos/react-native-training/react-native-elements/pulls/866","html_url":"https://github.com/react-native-training/react-native-elements/pull/866","diff_url":"https://github.com/react-native-training/react-native-elements/pull/866.diff","patch_url":"https://github.com/react-native-training/react-native-elements/pull/866.patch"},"body":"This is a first shot of the new ListItem component for the v1.0.\r\nRefactored and simplified.\r\n## Props:\r\n```js\r\n  containerStyle: ViewPropTypes.style,\r\n  component: PropTypes.element,\r\n  onPress: PropTypes.func,\r\n  title: PropTypes.node,\r\n  subtitle: PropTypes.node,\r\n  titleProps: PropTypes.object,\r\n  subtitleProps: PropTypes.object,\r\n  icon: PropTypes.object,\r\n  avatar: PropTypes.object,\r\n  leftElement: PropTypes.element,\r\n  rightElement: PropTypes.element,\r\n  rightTitle: PropTypes.node,\r\n  rightTitleProps: PropTypes.object,\r\n  textInputProps: PropTypes.object,\r\n  switchProps: PropTypes.object,\r\n  checkBoxProps: PropTypes.object,\r\n  badgeProps: PropTypes.object,\r\n  disclosure: PropTypes.bool,\r\n  checkmark: PropTypes.bool,\r\n```\r\n\r\n## Use case 1\r\n\r\n### before\r\n```js\r\n            <ListItem\r\n              roundAvatar\r\n              avatar={{ uri: l.avatar_url }}\r\n              onPress={log}\r\n              title={l.name}\r\n              subtitle={l.subtitle}\r\n            />\r\n```\r\n### after\r\n```js\r\n           <ListItem\r\n              avatar={<Avatar rounded source={{ uri: l.avatar_url }} />}\r\n              onPress={log}\r\n              title={l.name}\r\n              subtitle={l.subtitle}\r\n            />\r\n```\r\nor\r\n```js\r\n           <ListItem\r\n              avatar={{ rounded source={ uri: l.avatar_url }}\r\n              onPress={log}\r\n              title={l.name}\r\n              subtitle={l.subtitle}\r\n            />\r\n```\r\n\r\n## Use case 2\r\n\r\n### before\r\n```js\r\n              <ListItem\r\n                leftIcon={{ name: 'user-circle-o', type: 'font-awesome', style: {color: 'blue'} }}\r\n                title={l.name}\r\n                titleStyle={{color: 'red'}}\r\n                subtitle={l.subtitle}\r\n                rightTitle='11:00am'\r\n                rightTitleStyle={{color: 'green'}}\r\n              />\r\n```\r\n### after\r\n```js\r\n            <ListItem\r\n              leftElement={\r\n                <Icon\r\n                  name=\"user-circle-o\"\r\n                  type=\"font-awesome\"\r\n                  color=\"blue\"\r\n                  size={40}\r\n                />\r\n              }\r\n              title={l.name}\r\n              titleProps={{ style: { color: 'red' } }}\r\n              subtitle={l.subtitle}\r\n              rightTitle=\"11:00am\"\r\n              rightTitleProps={{ style: { color: 'green' } }}\r\n            />\r\n```\r\n\r\n## Use case 3\r\n\r\n### before\r\n```js\r\n          <ListItem\r\n            title={'Name w/ placeholder'}\r\n            textInput={true}\r\n            textInputPlaceholder={'John Doe'}\r\n          />\r\n```\r\n### after\r\n```js\r\n          <ListItem\r\n            onPress={log}\r\n            title={'Name w/ placeholder'}\r\n            textInputProps={{ placeholder: 'John Doe' }}\r\n          />\r\n```\r\n\r\n## Use case 4\r\n\r\n### before\r\n```js\r\n          <ListItem\r\n            title=\"RNE is the best\"\r\n            hideChevron={false}\r\n          />\r\n```\r\n\r\n### after\r\n```js\r\n          <ListItem\r\n            title=\"RNE is the best\"\r\n            disclosure\r\n          />\r\n```\r\n\r\n## Things missing\r\n\r\n- [x] Badge support\r\n- [x] Switch button support\r\n- [ ] CheckBox support"},"comment":{"url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/comments/368343376","html_url":"https://github.com/react-native-training/react-native-elements/pull/866#issuecomment-368343376","issue_url":"https://api.github.com/repos/react-native-training/react-native-elements/issues/866","id":368343376,"user":{"login":"martinezguillaume","id":17292331,"avatar_url":"https://avatars0.githubusercontent.com/u/17292331?v=4","gravatar_id":"","url":"https://api.github.com/users/martinezguillaume","html_url":"https://github.com/martinezguillaume","followers_url":"https://api.github.com/users/martinezguillaume/followers","following_url":"https://api.github.com/users/martinezguillaume/following{/other_user}","gists_url":"https://api.github.com/users/martinezguillaume/gists{/gist_id}","starred_url":"https://api.github.com/users/martinezguillaume/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/martinezguillaume/subscriptions","organizations_url":"https://api.github.com/users/martinezguillaume/orgs","repos_url":"https://api.github.com/users/martinezguillaume/repos","events_url":"https://api.github.com/users/martinezguillaume/events{/privacy}","received_events_url":"https://api.github.com/users/martinezguillaume/received_events","type":"User","site_admin":false},"created_at":"2018-02-25T20:50:38Z","updated_at":"2018-02-25T20:50:38Z","author_association":"COLLABORATOR","body":"Closed in favor of https://github.com/react-native-training/react-native-elements/pull/945"}}
{"actor":{"display_login":"martinezguillaume"}}