<import-sjs
  from="./index.sjs"
  name="util"
></import-sjs>
<view
  class="ant-copilot-prompts {{className}}"
  style="{{style}}"
>
  <slot name="prompts-title">
    <view
      a:if="{{title}}"
      class="ant-copilot-prompts-title"
    >
      {{title}}
    </view>
  </slot>
  <view
    a:if="{{vertical}}"
    class="ant-copilot-prompts-vertical-list"
  >
    <block
      a:for="{{items}}"
      a:for-index="index"
      a:for-item="item"
    >
      <slot
        name="prompts-item"
        item="{{item}}"
      >
        <view
          class="ant-copilot-prompts-vertical-list-item {{item.disabled ? 'disabled' : ''}}"
          data-item="{{item}}"
          data-index="{{index}}"
          onTap="onItemTap"
        >
          <ant-icon
            a:if="{{!util.isUrl(item.icon)}}"
            type="{{item.icon}}"
            className="ant-copilot-prompts-vertical-list-item-icon"
          ></ant-icon>
          <image
            a:else
            mode="scaleToFill"
            src="{{item.icon}}"
            class="ant-copilot-prompts-vertical-list-item-image"
          ></image>
          <text
            a:if="{{item.label}}"
            class="ant-copilot-prompts-vertical-list-item-label"
          >{{item.label}}</text>
          <text
            a:if="{{item.description}}"
            class="ant-copilot-prompts-vertical-list-item-description"
          >{{item.description}}</text>
          <ant-icon
            a:if="{{item.showArrow}}"
            type="RightOutline"
            class="ant-copilot-prompts-vertical-list-item-arrow"
          ></ant-icon>
        </view>
      </slot>
    </block>
  </view>
  <scroll-view
    a:else
    scrollX="{{!wrap}}"
    enableFlex="true"
    class="ant-copilot-prompts-horizontal-list {{wrap ? 'wrap' : ''}}"
  >
    <view
      class="ant-copilot-prompts-horizontal-list-item {{item.disabled ? 'disabled' : ''}}"
      a:for="{{items}}"
      a:for-index="index"
      a:for-item="item"
    >
      <slot
        name="prompts-item"
        item="{{item}}"
        index="{{index}}"
      >
        <ant-typography
          className="ant-copilot-prompts-horizontal-list-item-typography"
          iconPosition="left"
          icon="{{item.icon}}"
          data-item="{{item}}"
          data-index="{{index}}"
          onTap="onItemTap"
        >
          {{item.label}}
        </ant-typography>
      </slot>
    </view>
  </scroll-view>
</view>