<script lang="ts" setup>
import { colorSchemes, vue } from '@factor/api'

import InputSelect from './InputSelectCustom.vue'

const list = vue.computed(() => {
  const l = colorSchemes().map((scheme) => {
    return {
      name: scheme.name,
      value: scheme.value,
    }
  })

  return [{ format: 'title', name: 'Color Schemes' }, ...l]
})
</script>

<script lang="ts">
export default {
  inheritAttrs: false,
}
</script>

<template>
  <InputSelect v-bind="{ ...$attrs, list }" />
</template>
