fly-components/addon/components/fly-panel.js

gistfile1.js

// fly-components/addon/components/fly-panel.js
import Ember from 'ember';
import layout from '../templates/components/fly-panel';

export default Ember.Component.extend({
  tagName: 'div',
  classNames: ['fly-panel'],
  layout: layout,
  header: null,
  subHeader: null,
  content: null
});

// fly-components/addon/templates/fly-panel.hbs
{{#if template}}
  {{yield}}
{{else}}
  {{fly-panel-header content=header}}
  {{fly-panel-header
    classNames="fly-panel-sub-header"
    content=subHeader}}
  {{fly-panel-body content=content}}
  {{fly-panel-footer content=footer}}
{{/if}}