From 209a81a2b019c579547f1ef29dd35d05a0b5db2a Mon Sep 17 00:00:00 2001
From: Jean-Philippe Kha <jean-philippe.kha@filigran.io>
Date: Thu, 29 Aug 2024 09:55:52 +0200
Subject: [PATCH] [filigran-ui] Filigran-ui fix command missing focus, combobox
 border, select placeholder

---
 packages/filigran-ui/src/components/clients/combobox.tsx | 4 ++--
 packages/filigran-ui/src/components/clients/command.tsx  | 2 +-
 packages/filigran-ui/src/components/clients/select.tsx   | 3 +--
 3 files changed, 4 insertions(+), 5 deletions(-)

diff --git a/packages/filigran-ui/src/components/clients/combobox.tsx b/packages/filigran-ui/src/components/clients/combobox.tsx
index 6298a49..547036f 100644
--- a/packages/filigran-ui/src/components/clients/combobox.tsx
+++ b/packages/filigran-ui/src/components/clients/combobox.tsx
@@ -60,7 +60,7 @@ function Combobox({
           variant="outline"
           role="combobox"
           aria-expanded={open}
-          className={cn('w-full justify-between', className)}
+          className={cn('w-full justify-between border-input', className)}
           onClick={() => setOpen(!open)}>
           {value ? (
             dataTab.find((data) => data.value === value)?.label
@@ -70,7 +70,7 @@ function Combobox({
           <ChevronDown className="h-4 cursor-pointer text-muted-foreground" />
         </Button>
       </PopoverTrigger>
-      <PopoverContent className="popover-content-width-same-as-its-trigger p-0">
+      <PopoverContent className="p-0 popover-content-width-same-as-its-trigger">
         <Command onChange={handleSearchInputChange}>
           <CommandInput placeholder={placeholder} />
           <CommandList>
diff --git a/packages/filigran-ui/src/components/clients/command.tsx b/packages/filigran-ui/src/components/clients/command.tsx
index f5f1140..35b8f1a 100644
--- a/packages/filigran-ui/src/components/clients/command.tsx
+++ b/packages/filigran-ui/src/components/clients/command.tsx
@@ -119,7 +119,7 @@ const CommandItem = React.forwardRef<
   <CommandPrimitive.Item
     ref={ref}
     className={cn(
-      'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-accent aria-selected:text-accent-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',
+      'relative flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none aria-selected:bg-muted aria-selected:text-muted-foreground data-[disabled=true]:pointer-events-none data-[disabled=true]:opacity-50',
       className
     )}
     {...props}
diff --git a/packages/filigran-ui/src/components/clients/select.tsx b/packages/filigran-ui/src/components/clients/select.tsx
index 129b1b5..aa1e553 100644
--- a/packages/filigran-ui/src/components/clients/select.tsx
+++ b/packages/filigran-ui/src/components/clients/select.tsx
@@ -15,7 +15,6 @@ const Select = SelectPrimitive.Root
 const SelectGroup = SelectPrimitive.Group
 
 const SelectValue = SelectPrimitive.Value
-
 const SelectTrigger = React.forwardRef<
   React.ElementRef<typeof SelectPrimitive.Trigger>,
   React.ComponentPropsWithoutRef<typeof SelectPrimitive.Trigger>
@@ -23,7 +22,7 @@ const SelectTrigger = React.forwardRef<
   <SelectPrimitive.Trigger
     ref={ref}
     className={cn(
-      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-s py-xs text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 [&>span]:line-clamp-1',
+      'flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-s py-xs text-sm ring-offset-background focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground [&>span]:line-clamp-1',
       className
     )}
     {...props}>