<wxs src="../common/utils.wxs" module="_" />

<view style="{{ customStyle }}" class="{{ classPrefix }} {{prefix}}-class" id="t-bar">
  <view
    wx:for="{{menus}}"
    wx:key="index"
    bindtap="handleToggle"
    data-index="{{index}}"
    class="{{_.cls(classPrefix + '__item', [['active', activeIdx == index], ['disabled', item.disabled]])}} {{prefix}}-class-item"
    aria-disabled="{{item.disabled}}"
    aria-role="button"
    aria-expanded="{{activeIdx === index}}"
    aria-haspopup="menu"
  >
    <view class="{{classPrefix}}__title {{prefix}}-class-label">{{item.label}}</view>
    <t-icon
      name="caret-down-small"
      t-class="{{prefix}}-class-icon"
      class="{{classPrefix}}__icon {{classPrefix}}__icon--{{activeIdx == index ? 'active' : ''}}"
      aria-hidden="{{true}}"
    />
  </view>
  <slot />
</view>
