changed combobox

frontend/components/global/ComboBox.vue

@@ -9,11 +9,14 @@ type Option = {
 type Props = {
     options: Option[];
     modelValue: string[];
+    placeholder?: string;
 };
 
 // props
 
-const props = defineProps<Props>();
+const props = withDefaults(defineProps<Props>(), {
+    placeholder: "جست و جو",
+});
 
 const { modelValue } = toRefs(props);
 
@@ -48,11 +51,11 @@ watch(
 <template>
     <ComboboxRoot class="relative" dir="rtl" v-model="value">
         <ComboboxAnchor
-            class="w-full inline-flex items-center justify-between rounded-full border border-slate-200 hover:border-slate-300 focus:border-slate-800 px-[1rem] text-sm leading-none py-3.5 gap-[5px] bg-slate-50 text-black hover:bg-white/90 transition-all data-[placeholder]:text-black/80 typo-label-sm outline-none"
+            class="w-full inline-flex items-center justify-between rounded-xl border-[1.5px] border-slate-200 focus:border-slate-800 px-[1rem] text-sm leading-none py-3.5 gap-[5px] bg-slate-50 text-black hover:border-black transition-all data-[placeholder]:text-black/80 typo-label-sm outline-none"
         >
             <ComboboxInput
-                class="!bg-transparent outline-none text-black h-full selection:bg-slate-100 placeholder-stone-400"
+                class="!bg-transparent outline-none text-black h-full selection:bg-slate-100 placeholder-slate-400"
-                placeholder="جست و جوی دسته بندی"
+                :placeholder="placeholder"
             />
             <ComboboxTrigger>
                 <Icon name="ci:chevron-down" class="size-5" />
@@ -60,7 +63,7 @@ watch(
         </ComboboxAnchor>
 
         <ComboboxContent
-            class="absolute z-10 w-full mt-1.5 bg-slate-50 overflow-hidden rounded-3xl shadow-sm border border-slate-200 will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=bottom]:animate-slideUpAndFade"
+            class="absolute z-10 w-full mt-1.5 bg-slate-50 overflow-hidden rounded-xl shadow-sm border border-slate-200 will-change-[opacity,transform] data-[side=top]:animate-slideDownAndFade data-[side=bottom]:animate-slideUpAndFade"
         >
             <ComboboxViewport class="p-[1rem]">
                 <ComboboxEmpty