Option to pass styles through the `style` attribute

[harrisjose]

Would be helpful in cases where we need to style the svg using dynamically generated values or values from an external source..

[rlivsey]

I'd be happy to accept a PR for this.

An aside, I do wonder if this should be converted to be a component with tagName: 'svg'using positional parameters vs a helper then we'd get all this stuff for free?

[harrisjose]

Converting it into a component seems like a cool idea. Would be happy to play around with this over the weekend, if no one else is working on it.

[harrisjose]

A couple of questions, regarding converting this into a component.

I understand we'd use the component tagName property and strip the

[harrisjose]

I played around with this and here's a hacky version that works....

export default Ember.Component.extend({
attributeBindings: ['style'],
tagName: 'svg',
path: null,
content: null,

init() {
this._super(...arguments);
let path = this.get('path');
var jsonPath = dottify(path);

var svg = Ember.get(SVGs, jsonPath);

if (typeof svg === "undefined" && /\.svg$/.test(path)) {
  svg = Ember.get(SVGs, jsonPath.slice(0, -4));
}
Ember.assert("No SVG found for "+path, svg);

let attrs = Ember.$(svg)[0].attributes;
for (var i = 0; i < attrs.length; i++) {
  //push attribute name in to attr binding array
  this.get('attributeBindings').push(attrs[i].name);
  //set attribute as a prop
  this.set(attrs[i].name, attrs[i].value);
}
//set the contents of the svg to a prop and use that in the template
this.set('content', Ember.String.htmlSafe(Ember.$(svg).html()));
}
}).reopenClass({
positionalParams: ['path']
});

Can you let me know what changes i need to make, so that i can send a pr... I'm also on the fence about how we should handle attribute bindings...do I explicitly specify everything like I've done for the style attribute ?