Rearranage components

This commit is contained in:
Pranav
2025-01-12 00:37:32 -08:00
parent 33dc2ca2ee
commit 1e1b1f6844
6 changed files with 17 additions and 69 deletions
@@ -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>