funkwhale/front/src/components/ui/Input.vue

39 wiersze
729 B
Vue
Czysty Zwykły widok Historia

<script setup lang="ts">
import { ref } from 'vue'
const icon = defineProp<string>()
const placeholder = defineProp<string>()
const modelValue = defineModel<string>({
required: true
})
const input = ref()
</script>
<template>
<div
:class="{ 'has-icon': !!icon }"
class="funkwhale input"
@click="input.focus()"
>
<div v-if="icon" class="prefix">
<i :class="['bi', icon]" />
</div>
<input
v-bind="$attrs"
v-model="modelValue"
ref="input"
:placeholder="placeholder"
@click.stop
/>
<div v-if="$slots['input-right']" class="input-right">
<slot name="input-right" />
</div>
</div>
</template>
<style lang="scss">
@import './style.scss'
</style>