{"action":"created","issue":{"url":"https://api.github.com/repos/sveltejs/svelte/issues/890","repository_url":"https://api.github.com/repos/sveltejs/svelte","labels_url":"https://api.github.com/repos/sveltejs/svelte/issues/890/labels{/name}","comments_url":"https://api.github.com/repos/sveltejs/svelte/issues/890/comments","events_url":"https://api.github.com/repos/sveltejs/svelte/issues/890/events","html_url":"https://github.com/sveltejs/svelte/issues/890","id":264377986,"number":890,"title":"Feature request: class directives","user":{"login":"jacwright","id":120294,"avatar_url":"https://avatars2.githubusercontent.com/u/120294?v=4","gravatar_id":"","url":"https://api.github.com/users/jacwright","html_url":"https://github.com/jacwright","followers_url":"https://api.github.com/users/jacwright/followers","following_url":"https://api.github.com/users/jacwright/following{/other_user}","gists_url":"https://api.github.com/users/jacwright/gists{/gist_id}","starred_url":"https://api.github.com/users/jacwright/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/jacwright/subscriptions","organizations_url":"https://api.github.com/users/jacwright/orgs","repos_url":"https://api.github.com/users/jacwright/repos","events_url":"https://api.github.com/users/jacwright/events{/privacy}","received_events_url":"https://api.github.com/users/jacwright/received_events","type":"User","site_admin":false},"labels":[{"id":795423890,"url":"https://api.github.com/repos/sveltejs/svelte/labels/proposal","name":"proposal","color":"1d76db","default":false}],"state":"open","locked":false,"assignee":null,"assignees":[],"milestone":null,"comments":10,"created_at":"2017-10-10T21:11:51Z","updated_at":"2018-02-23T23:54:18Z","closed_at":null,"author_association":"CONTRIBUTOR","body":"Proposal for a directive to toggle classes.\r\n\r\n```\r\n<div class:active=\"thing.isActive()\" class:selected=\"selectedItem === thing\">\r\n  ...\r\n</div>\r\n``` \r\n\r\nAdding and removing a class based off of boolean state is a very common pattern. This directive would only be a nice-to-have since there are several alternatives currently in use.\r\n\r\n**Alternatives:**\r\n* the class attribute, e.g. `<div class=\"thing {{getClasses()}}\">` with a bunch of class logic in a component method—my preference is to put the logic in the template\r\n* data attributes, e.g. `<div data-active=\"{{thing.isActive()}}\">`—cons, many existing libraries (ahem bootstrap) already use classes, and the css is marginally nicer with classes (`.active` vs `[data-active=\"true\"]`)\r\n\r\nThe existing solutions are not bad, so this is very much a nice-to-have. But the little things do make a difference. Thoughts?"},"comment":{"url":"https://api.github.com/repos/sveltejs/svelte/issues/comments/368173076","html_url":"https://github.com/sveltejs/svelte/issues/890#issuecomment-368173076","issue_url":"https://api.github.com/repos/sveltejs/svelte/issues/890","id":368173076,"user":{"login":"tomcon","id":647145,"avatar_url":"https://avatars3.githubusercontent.com/u/647145?v=4","gravatar_id":"","url":"https://api.github.com/users/tomcon","html_url":"https://github.com/tomcon","followers_url":"https://api.github.com/users/tomcon/followers","following_url":"https://api.github.com/users/tomcon/following{/other_user}","gists_url":"https://api.github.com/users/tomcon/gists{/gist_id}","starred_url":"https://api.github.com/users/tomcon/starred{/owner}{/repo}","subscriptions_url":"https://api.github.com/users/tomcon/subscriptions","organizations_url":"https://api.github.com/users/tomcon/orgs","repos_url":"https://api.github.com/users/tomcon/repos","events_url":"https://api.github.com/users/tomcon/events{/privacy}","received_events_url":"https://api.github.com/users/tomcon/received_events","type":"User","site_admin":false},"created_at":"2018-02-23T23:54:18Z","updated_at":"2018-02-23T23:54:18Z","author_association":"NONE","body":"Seems to me there's something lacking in this area though I've not come across any limitation yet myself. \r\n\r\nI have had to return a complex css class through a data value though. Vue offers so much else, but what do we actually need? \r\n\r\nThis seems quite sensible and a good extension but it we're going to make a fair sized change then maybe we need to really think this through. \r\n\r\nIn any other event, it has my vote. "}}
{"actor":{"display_login":"tomcon"}}