{"action":"opened","issue":{"url":"https://api.github.com/repos/nteract/vdom/issues/11","repository_url":"https://api.github.com/repos/nteract/vdom","labels_url":"https://api.github.com/repos/nteract/vdom/issues/11/labels{/name}","comments_url":"https://api.github.com/repos/nteract/vdom/issues/11/comments","events_url":"https://api.github.com/repos/nteract/vdom/issues/11/events","html_url":"https://github.com/nteract/vdom/issues/11","id":260376799,"number":11,"title":"Write some best practices guidance for creating components","user":{"login":"rgbkrk","id":836375,"avatar_url":"https://avatars0.githubusercontent.com/u/836375?v=4","gravatar_id":"","url":"https://api.github.com/users/rgbkrk","html_url":"https://github.com/rgbkrk","followers_url":"https://api.github.com/users/rgbkrk/followers","following_url":"https://api.github.com/users/rgbkrk/following{/other_user}","gists_url":"https://api.github.com/users/rgbkrk/gists{/gist_id}","starred_url":"https://api.github.com/users/rgbkrk/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/rgbkrk/subscriptions","organizations_url":"https://api.github.com/users/rgbkrk/orgs","repos_url":"https://api.github.com/users/rgbkrk/repos","events_url":"https://api.github.com/users/rgbkrk/events{/privacy}","received_events_url":"https://api.github.com/users/rgbkrk/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":0,"created_at":"2017-09-25T18:45:41Z","updated_at":"2017-09-25T18:45:41Z","closed_at":null,"author_association":"OWNER","body":"Within `vdom`, the best way (that I can think of right now) to create new elements is to create functions that return elements:\r\n\r\n```python\r\nfrom vdom import h, p\r\ndef happiness(level=90, max=100):\r\n  smiley = \"😃\"\r\n  percent = level / float(max)\r\n    \r\n  if(percent < 0.25):\r\n    smiley = \"☹️\"\r\n  elif(percent < 0.50):\r\n    smiley = \"😐\"\r\n  elif(percent < 0.75):\r\n    smiley = \"😀\"\r\n\r\n    \r\n  return p([\r\n      'Happiness ', smiley, h('br'), h('meter', level, min=\"0\", max=max, value=level)\r\n  ])\r\n\r\n# Usage:\r\n\r\nhappiness()\r\n\r\ndiv([\r\n  happiness(10),\r\n  happiness(32),\r\n  happiness(65),\r\n  happiness(80)\r\n])\r\n```\r\n\r\nExample in nteract:\r\n\r\n![screen shot 2017-09-25 at 11 45 17 am](https://user-images.githubusercontent.com/836375/30825220-06d853ba-a1e7-11e7-9383-2962d12c9a4a.png)\r\n\r\n"}}
{"actor":{"display_login":"rgbkrk"}}