miller-columns proposal

controllers.application.js

// see templates/application.hbs

templates.application.hbs

{{!-- in miller-columns.hbs --}}

{{yield (hash
	search=(component "miller-columns-search")			
  columns=columns
  column=(component "miller-columns-column)
  {{!-- additional necessary functions/properties --}}
)}}

{{!-- in targeting-module.hbs --}}

{{#miller-columns as |mil| columns=targetingColumns}}
	<header>
  	{{breadcrumb onCrumbClick=(action "...")}}
    {{mil.search onQueryChange=(action "...")}}
  </header>
  {{#if searchResults}}
  	{{#each searchResults as |result|}}
    	<ul>
      	<li>{{result.name}}</li>
        ...
      </ul>
    {{/each}}
    {{!-- perhaps have a search-results component here? --}}
  {{/if}}
	{{#each mil.columns as |column|}}
  	{{#mil.column}}
	    {{#if cell.viewType === "RANGE"}}
      	{{!-- custom content for column, not a checkbox/label combo --}}
      {{#else}}
        <ul>
          {{#each column.children as |cell|}}
            <li>
              <input disabled={{get disabledStateLookup cell.urn}} onchange={{action "checkboxChanged"}}>
              <label>
              {{#if isDisabled(cell)}}
                {{!-- render disabled state, etc --}}
              {{/if}}
            </li>
          {{/each}}
        </ul>
      {{/else}}
    {{/mil.column}}
  {{/each}}
{{/miller-columns}}

twiddle.json

{
  "version": "0.15.0",
  "EmberENV": {
    "FEATURES": {}
  },
  "options": {
    "use_pods": false,
    "enable-testing": false
  },
  "dependencies": {
    "jquery": "https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js",
    "ember": "3.2.2",
    "ember-template-compiler": "3.2.2",
    "ember-testing": "3.2.2"
  },
  "addons": {
    "ember-data": "3.2.0"
  }
}