Abizrh
40 lines
988 B
Vue
40 lines
988 B
Vue
<script setup lang="ts">
|
|
import type { HeaderPrep, RefSearchNav } from '../types.ts'
|
|
|
|
const props = defineProps<{
|
|
prep: HeaderPrep
|
|
refSearchNav: RefSearchNav
|
|
}>()
|
|
|
|
function emitSearchNavClick() {
|
|
props.refSearchNav.onClick()
|
|
}
|
|
|
|
function onInput(event: Event) {
|
|
props.refSearchNav.onInput((event.target as HTMLInputElement).value)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<header>
|
|
<div class="flex items-center justify-between">
|
|
<div class="flex items-center">
|
|
<div class="ml-3 text-lg font-bold text-gray-900">
|
|
{{ prep.title }}
|
|
</div>
|
|
</div>
|
|
<div class="flex items-center">
|
|
<div class="ml-3 text-lg text-gray-900">
|
|
<Input
|
|
type="text"
|
|
placeholder="Search"
|
|
class="w-full rounded-md border border-gray-300 bg-white px-4 py-2 text-gray-900 sm:text-sm"
|
|
@click="emitSearchNavClick"
|
|
@input="onInput"
|
|
/>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</template>
|