text: <div class="bs-example" data-test-fastboot-container>
    <BsForm @formLayout="inline" @model={{this}} as |form|>
      <form.element
        @controlType="power-select"
        @options={{typeChoices}}
        @label="Type"
        @property="type" as |el|>
        <el.control @searchEnabled @class="ml-sm-1"/>
      </form.element>
      <form.element
        @controlType="checkbox"
        @disabled={{bs-eq type tabs}}
        @label="Stacked"
        @property="stacked"
        @onChange={{action "updateStacked"}}
        class="ml-sm-2"
      />
      <form.element
        @controlType="checkbox"
        @disabled={{stacked}}
        @label="Justified"
        @property="justified"
        class="ml-sm-2"
      />
      <form.element
        @controlType="checkbox"
        @disabled={{stacked}}
        @label="Fill"
        @property="fill"
        class="ml-sm-2"
      />
    </BsForm>
    <hr>
    <!-- BEGIN-SNIPPET nav-demo -->
    <BsNav
      @type={{type}}
      @justified={{justified}}
      @stacked={{stacked}}
      @fill={{fill}} as |nav|
    >
      <nav.item>
        <nav.link-to @route="index">Home</nav.link-to>
      </nav.item>
      <nav.item>
        <nav.link-to @route="demo.navs">Nav</nav.link-to>
      </nav.item>
      <nav.dropdown as |dd|>
        <dd.toggle>
          Dropdown
          <span class="caret"></span>
        </dd.toggle>
        <dd.menu as |ddm|>
          <ddm.item>
            <ddm.link-to @route="index">Home</ddm.link-to>
          </ddm.item>
          <ddm.item>
            <ddm.link-to @route="demo.navs">Nav</ddm.link-to>
          </ddm.item>
        </dd.menu>
      </nav.dropdown>
    </BsNav>
    <!-- END-SNIPPET -->
  </div>
  <div class="highlight">
    <CodeSnippet
      @name="nav-demo.hbs"
      @dynamicProperties={{hash
        type=type
        stacked=stacked
        justified=justified
        fill=fill
      }}
    />
  </div>
  