40 lines
802 B
Vue
40 lines
802 B
Vue
<script setup lang="ts">
|
|
defineProps({
|
|
search: {
|
|
type: String,
|
|
default: undefined,
|
|
},
|
|
noPadding: {
|
|
type: Boolean,
|
|
default: true,
|
|
},
|
|
})
|
|
|
|
const emit = defineEmits<{
|
|
(event: 'update:search', value: string): void
|
|
}>()
|
|
|
|
function update(event: any) {
|
|
emit('update:search', event.target.value)
|
|
}
|
|
</script>
|
|
|
|
<template>
|
|
<div flex="~ col gap2" border="b base" flex-1 navbar-glass pb4 :class="[{ p4: !noPadding }]">
|
|
<div flex="~ gap4">
|
|
<slot name="search">
|
|
<NTextInput
|
|
placeholder="Search..."
|
|
icon="carbon-search"
|
|
n="primary" flex-auto
|
|
:class="{ 'px-5 py-2': !noPadding }"
|
|
:value="search"
|
|
@input="update"
|
|
/>
|
|
</slot>
|
|
<slot name="actions" />
|
|
</div>
|
|
<slot />
|
|
</div>
|
|
</template>
|