multi-named-blocks.hbs

{{! calling side }}

<Tabs>
  <:tab name="index.js">
    <Snippet name="2-mirage-index" />
  <:/tab>
  <:tab name="App.js">
    <Snippet name="2-mirage-app" />
  <:/tab>
</Tabs>




{{! Tabs template }}

<div>
  {{#each this.blocks.tab as |tab|}}
    <button 
      {{on "click" this.setActiveTab tab}} 
      
      class="
        {{if (eq this.activeTab tab) 
          "text-gray-900 text-border-gray-900" 
          "text-gray-400 border-gray-200"
        }}
      "
    />
      {{tab.args.name}}
    </button>
  {{/each}}

  <div class="mt-6">
    {{yield to=this.activeTab}}
  </div>
</div>