<template>
  <div class="grid gap-4 mt-4 text-center">
    <Example :label="selectedIcon" :key="selectedIcon">
      <AisIcon :icon="selectedIcon" class="text-4xl mb-2" />
    </Example>
    <AisSelect :options="coreIconKeys" v-model="selectedIcon" />
  </div>
</template>

<script setup>
import {ref} from 'vue'
import AisIcon from '@/components/icon/AisIcon.vue'
import AisSelect from '@/components/select/AisSelect.vue'
import Example from '@/components/docs/ComponentExample.vue'
import { coreIconKeys } from "@c/icon/ais-icons";

const selectedIcon = ref('arrow')
</script>
