{"action":"created","issue":{"url":"https://api.github.com/repos/shama/bel/issues/25","repository_url":"https://api.github.com/repos/shama/bel","labels_url":"https://api.github.com/repos/shama/bel/issues/25/labels{/name}","comments_url":"https://api.github.com/repos/shama/bel/issues/25/comments","events_url":"https://api.github.com/repos/shama/bel/issues/25/events","html_url":"https://github.com/shama/bel/issues/25","id":149531348,"number":25,"title":"thoughts on extensible custom tags","user":{"login":"SilentCicero","id":9806174,"avatar_url":"https://avatars.githubusercontent.com/u/9806174?v=3","gravatar_id":"","url":"https://api.github.com/users/SilentCicero","html_url":"https://github.com/SilentCicero","followers_url":"https://api.github.com/users/SilentCicero/followers","following_url":"https://api.github.com/users/SilentCicero/following{/other_user}","gists_url":"https://api.github.com/users/SilentCicero/gists{/gist_id}","starred_url":"https://api.github.com/users/SilentCicero/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/SilentCicero/subscriptions","organizations_url":"https://api.github.com/users/SilentCicero/orgs","repos_url":"https://api.github.com/users/SilentCicero/repos","events_url":"https://api.github.com/users/SilentCicero/events{/privacy}","received_events_url":"https://api.github.com/users/SilentCicero/received_events","type":"User","site_admin":false},"labels":[],"state":"open","locked":false,"assignee":null,"milestone":null,"comments":7,"created_at":"2016-04-19T17:42:07Z","updated_at":"2016-06-17T03:02:10Z","closed_at":null,"body":"So this may not be in the philosophy of bel, but how/should/can I easily create an extensible module for bel/yoyo (the module I use) that allows for custom tags/props that just render functions.\r\n\r\nHere is what I'm thinking:\r\n\r\n```\r\nconst Button = function (opts) {\r\n    return bel`<button>my ${opts.name} button</button>`\r\n}\r\n\r\nconst Col = function (_yield, opts) {\r\n   return bel`<div class=\"column\">${_yield}</div>`\r\n}\r\n\r\nconst customtagsuse = bel`<div><Button name=\"Nick\" /></div>`\r\n\r\n// which is actually just\r\n\r\nconst customtagsuse = bel`<div>${Button({name: \"Nick\"})}</div>`\r\n\r\n// or\r\n\r\nconst customtagsuse2 = bel`<div><Col> some cols </Col></div>`\r\n\r\n// which is actually\r\n\r\nconst customtagsuse2 = bel`<div>${Col(\" some cols \")}</div>`\r\n```\r\n\r\nKinda reactish, but all it's doing is regexing the string, and replacing it with the element.\r\n\r\nI'm thinking of providing a layer to bel.\r\n\r\nso something like:\r\n\r\n```\r\nvar extensible = require(\"bel-custom\")\r\nvar bel = extensible(require(\"bel))\r\nbel.customElements = {\"Button\": Button}; // sort of thing\r\n```\r\n\r\nAny thoughts on design patterns, approaches, potential pitfalls, potential benefits @shama?"},"comment":{"url":"https://api.github.com/repos/shama/bel/issues/comments/226669328","html_url":"https://github.com/shama/bel/issues/25#issuecomment-226669328","issue_url":"https://api.github.com/repos/shama/bel/issues/25","id":226669328,"user":{"login":"timwis","id":761444,"avatar_url":"https://avatars.githubusercontent.com/u/761444?v=3","gravatar_id":"","url":"https://api.github.com/users/timwis","html_url":"https://github.com/timwis","followers_url":"https://api.github.com/users/timwis/followers","following_url":"https://api.github.com/users/timwis/following{/other_user}","gists_url":"https://api.github.com/users/timwis/gists{/gist_id}","starred_url":"https://api.github.com/users/timwis/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/timwis/subscriptions","organizations_url":"https://api.github.com/users/timwis/orgs","repos_url":"https://api.github.com/users/timwis/repos","events_url":"https://api.github.com/users/timwis/events{/privacy}","received_events_url":"https://api.github.com/users/timwis/received_events","type":"User","site_admin":false},"created_at":"2016-06-17T03:02:10Z","updated_at":"2016-06-17T03:02:10Z","body":"Hey guys, was thinking about this today and had a similar idea... what about using proper custom elements from the web components spec?"}}
{"actor":{"display_login":"timwis"}}