initial

layers/ui/components/select/option.vue

@@ -0,0 +1,48 @@
+<template>
+  <div
+    :class="[cn.b(), cn.is('selected', selected), cn.is('disabled', disabled)]"
+    :tabindex="disabled ? -1 : 0"
+    @click="$emit('click')"
+    @keydown.space="$emit('click')"
+    @keydown.enter="$emit('click')"
+  >
+    <slot>
+      <!--      <UiCoin v-if="coin" :name="coin" :class="cn.e('coin')" circle /> -->
+
+      <span :class="[cn.e('label')]">{{ label }}</span>
+
+      <UiIconSCheck
+        v-if="multiple"
+        :class="cn.e('checkbox')"
+      />
+    </slot>
+  </div>
+</template>
+
+<script setup lang="ts">
+import useClassname from '../../composables/use-classname'
+
+// import UiCoin from 'alfabit-ui/components/coin/coin.vue';
+
+export interface Props {
+  label: string
+  disabled?: boolean
+  selected?: boolean
+  multiple?: boolean
+  coin?: string
+}
+
+defineOptions({
+  name: 'UiSelectOption',
+})
+
+const props = withDefaults(defineProps<Props>(), {
+  disabled: false,
+  selected: false,
+  multiple: false,
+})
+
+defineEmits(['click'])
+
+const cn = useClassname('ui-select-option')
+</script>