Rearranage components
This commit is contained in:
@@ -1,15 +0,0 @@
|
||||
<template>
|
||||
<div class="py-4 space-y-4 bg-white dark:bg-slate-700">
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-6 bg-slate-100 dark:bg-slate-500 rounded w-2/5" />
|
||||
</div>
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-4 bg-slate-100 dark:bg-slate-500 rounded" />
|
||||
<div class="h-4 bg-slate-100 dark:bg-slate-500 rounded" />
|
||||
<div class="h-4 bg-slate-100 dark:bg-slate-500 rounded" />
|
||||
</div>
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-4 bg-slate-100 dark:bg-slate-500 rounded w-1/5" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -1,52 +0,0 @@
|
||||
<script>
|
||||
import { debounce } from '@chatwoot/utils';
|
||||
export default {
|
||||
props: {
|
||||
placeholder: {
|
||||
type: String,
|
||||
default: '',
|
||||
},
|
||||
},
|
||||
emits: ['search'],
|
||||
data() {
|
||||
return {
|
||||
searchQuery: '',
|
||||
};
|
||||
},
|
||||
methods: {
|
||||
handleInput: debounce(
|
||||
() => {
|
||||
this.$emit('search', this.searchQuery);
|
||||
},
|
||||
500,
|
||||
true
|
||||
),
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
||||
<template>
|
||||
<div class="relative flex items-center">
|
||||
<div
|
||||
class="absolute inset-y-0 left-0 flex items-center px-2 py-2 text-slate-500"
|
||||
>
|
||||
<fluent-icon icon="search" size="14" />
|
||||
</div>
|
||||
<input
|
||||
id="search"
|
||||
v-model="searchQuery"
|
||||
:placeholder="placeholder"
|
||||
type="text"
|
||||
name="search"
|
||||
class="block w-full h-8 px-2 pl-6 pr-1 text-sm border rounded-md focus-visible:outline-none text-slate-800 border-slate-100 bg-slate-75 placeholder:text-slate-400 focus:ring focus:border-woot-500 focus:ring-woot-200 hover:border-woot-200"
|
||||
@input="handleInput"
|
||||
/>
|
||||
<div class="absolute inset-y-0 right-0 flex py-1.5 pr-1.5">
|
||||
<kbd
|
||||
class="inline-flex items-center px-1 font-sans border rounded border-slate-200 text-xxs text-slate-400"
|
||||
>
|
||||
{{ '⌘K' }}
|
||||
</kbd>
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
@@ -0,0 +1,15 @@
|
||||
<template>
|
||||
<div class="py-4 space-y-4">
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-6 bg-n-slate-7 rounded w-2/5" />
|
||||
</div>
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-4 bg-n-slate-7 rounded" />
|
||||
<div class="h-4 bg-n-slate-7 rounded" />
|
||||
<div class="h-4 bg-n-slate-7 rounded" />
|
||||
</div>
|
||||
<div class="space-y-2 animate-pulse">
|
||||
<div class="h-4 bg-n-slate-7 rounded w-1/5" />
|
||||
</div>
|
||||
</div>
|
||||
</template>
|
||||
Reference in New Issue
Block a user