Click @ only shows 8 item in the list, whereas i have 36

[theWanderer78]

When i type '@', i see only 8 item, even i realy world scenario i have 36 item, but only see 8. how to fix this? Can we enable scroll?

<template>
  <div id="app">
    <Mentionable :keys="['@']" :items="items" insert-space>
      <textarea rows="6" class="input" v-model="text" />
    </Mentionable>

    {{ text }}
  </div>
</template>

<script>
import { Mentionable } from "vue-mention";

export default {
  name: "App",
  components: {
    Mentionable,
  },
  data() {
    return {
      text: "",
      items: [
        {
          value: "1st item",
          label: "1st item",
        },
        {
          value: "2nd item",
          label: "2nd item",
        },
        {
          value: "3rd item",
          label: "3rd item",
        },
        {
          value: "4th item",
          label: "4th item",
        },
        {
          value: "5th item",
          label: "5th item",
        },
        {
          value: "6th item",
          label: "6th item",
        },
        {
          value: "7th item",
          label: "7th item",
        },
        {
          value: "8th item",
          label: "8th item",
        },
        {
          value: "9th item",
          label: "9th item",
        },
        {
          value: "10th item",
          label: "10th item",
        },
        {
          value: "11ith item",
          label: "11th item",
        },
      ],
    };
  },
};
</script>

<style>
body {
  font-family: "Avenir", Helvetica, Arial, sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-align: center;
  color: #2c3e50;
  margin: 32px;
}

.input {
  width: 100%;
}

.mention-item {
  padding: 4px 10px;
  border-radius: 4px;
}

.mention-selected {
  background: rgb(192, 250, 153);
}
</style>

[luthfimunadzar]

hey @theWanderer78 i found how to set limit hope it works for you, for me its work