<template>
  <div class="more-tips bg-white ">
    <div class="font-size-0 whitespace-nowrap scroll-x">
      <div class="more-tips-item  inline-block mr-[8px]" v-for="(item, index) in guideWords" :key="index">
        <span :class="['font-medium text-[12px] text-center', `color-${index}`]" @click="sendReply(item)">
          {{ item }}
        </span>
      </div>
    </div>
  </div>
</template>

<script setup>
import { SEND_MESSAGE_CONTENT_TEXT } from "@/constants/constant";
import { defineProps } from "vue";

defineProps({
  guideWords: {
    type: Array,
    default: [],
  },
});

const sendReply = (item) => {
  uni.$emit(SEND_MESSAGE_CONTENT_TEXT, item);
};
</script>

<style lang="scss" scoped>
@import "./styles/index.scss";
</style>
