Ember 1.13, class names order in a component
<p>I've created a simple component to render icons from SVG sprite. This component should have a default CSS class to manage it's styles globally (.svg-icon). Also, I want to have a possibility to add some context dependent styles via class names through 'class' attribute.</p>

<p>JS:</p>

<pre><code>App.SvgIconComponent = Ember.Component.extend
   layoutName: 'components/svg-icon'
   classNames: ['svg-icon']
   tagName: 'svg'
   attributeBindings: ['width', 'height', 'fill'],

   width: 16
   height: 16
   fill: 'currentColor'
</code></pre>

<p>Template:</p>

<pre><code>&lt;use xlink:href="#svg-icon-{{name}}"/&gt;
</code></pre>

<p>Usage:</p>

<pre><code>{{svg-icon name="facebook" class="social__icon" width="14" height="14"}}
</code></pre>

<p>HTML output:</p>

<pre><code>&lt;svg id="ember1012" width="14" height="14" fill="currentColor" class="social__icon ember-view svg-icon"&gt;
    &lt;use xmlns:xlink="http://www.w3.org/1999/xlink" xlink:href="#svg-icon-facebook"&gt;&lt;/use&gt;
&lt;/svg&gt;
</code></pre>

<p>The problem is that Ember pushed my default class (.svg-icon) into the end of classes list. But, to avoid some issues with cascade, I need this class at the start of classes list (class="svg-icon social__icon ember-view"). Is it possible to achieve?</p>

<p>I know, that I can set classes names with classNameBindings property, but in this case I will need to use some attribute different from 'class'. Use of native 'class' attribute is preferable.</p>

<p>Thnx.</p>