misc: migrate multiple combobox to tailwind (#1947)

getlago · Dec 30, 2024 · e94ad90 · e94ad90
1 parent ffffacd
commit e94ad90
Show file tree

Hide file tree

Showing 9 changed files with 226 additions and 335 deletions.
diff --git a/src/components/form/ComboBox/ComboBox.tsx b/src/components/form/ComboBox/ComboBox.tsx
@@ -195,11 +195,7 @@ export const ComboBox = ({
         // @ts-ignore
         { value, renderGroupHeader, virtualized }
       }
-      PopperComponent={ComboBoxPopperFactory({
-        ...PopperProps,
-        grouped: !!(data || [])[0]?.group,
-        virtualized,
-      })}
+      PopperComponent={ComboBoxPopperFactory(PopperProps)}
       getOptionDisabled={(option) => !!option?.disabled}
       getOptionLabel={(option) => {
         const optionForString =

diff --git a/src/components/form/ComboBox/ComboBoxPopperFactory.tsx b/src/components/form/ComboBox/ComboBoxPopperFactory.tsx
@@ -1,19 +1,15 @@
 import { Popper, PopperProps } from '@mui/material'
-import { cx } from 'class-variance-authority'
 import { ReactNode } from 'react'
 
 import { theme } from '~/styles'
 
 import { ComboBoxProps } from './types'
 
-type ComboBoxPopperFactoryArgs = Required<Pick<ComboBoxProps, 'PopperProps'>>['PopperProps'] & {
-  grouped?: boolean
-  virtualized?: boolean
-}
+type ComboBoxPopperFactoryArgs = Required<Pick<ComboBoxProps, 'PopperProps'>>['PopperProps']
 
 // return a configured <Popper> component with custom styles
 export const ComboBoxPopperFactory =
-  ({ placement, displayInDialog, grouped, virtualized }: ComboBoxPopperFactoryArgs = {}) =>
+  ({ placement, displayInDialog }: ComboBoxPopperFactoryArgs = {}) =>
   // eslint-disable-next-line react/display-name
   (props: PopperProps) => (
     <Popper
@@ -35,13 +31,6 @@ export const ComboBoxPopperFactory =
       ]}
       {...props}
     >
-      <div
-        className={cx({
-          'combobox-popper--virtualized': virtualized,
-          'combobox-popper--grouped': grouped,
-        })}
-      >
-        {props?.children as ReactNode}
-      </div>
+      <>{props?.children as ReactNode}</>
     </Popper>
   )
diff --git a/src/components/form/ComboBox/ComboboxList.tsx b/src/components/form/ComboBox/ComboboxList.tsx
@@ -22,7 +22,7 @@ interface ComboBoxVirtualizedListProps
   children: ReactNode
 }
 
-const ComboboxListItem = ({
+export const ComboboxListItem = ({
   children,
   virtualized,
   className,