fix: ListBox animation

supabase · Feb 12, 2022 · d38f9b2 · d38f9b2
1 parent a824594
commit d38f9b2
Show file tree

Hide file tree

Showing 2 changed files with 8 additions and 4 deletions.
diff --git a/src/components/Listbox/Listbox2.tsx b/src/components/Listbox/Listbox2.tsx
@@ -95,10 +95,10 @@ function Listbox({
   }, [value])
 
   useEffect(() => {
-    console.log(triggerRef?.current?.offsetWidth)
-    if (document) {
-      document.documentElement.style.setProperty('--width-listbox', `533px`)
-    }
+    document.documentElement.style.setProperty(
+      '--width-listbox',
+      `${triggerRef.current?.offsetWidth}px`
+    )
   }, [])
 
   useEffect(() => {

diff --git a/src/lib/theme/defaultTheme.ts b/src/lib/theme/defaultTheme.ts
@@ -1415,6 +1415,10 @@ export default {
       border-gray-100 dark:border-gray-600 max-h-60 
       rounded-md py-1 text-base 
       sm:text-sm z-10 overflow-hidden overflow-y-scroll
+
+      origin-dropdown
+      data-open:animate-dropdown-content-show
+      data-closed:animate-dropdown-content-hide
     `,
     with_icon: 'pl-10',
     addOnBefore: `