const sizes: Record<string, string> = {
  xs: 'h-2 w-2',
  sm: 'h-3 w-3',
  med: 'h-5 w-5',
  lg: 'h-6 w-6',
  xlg: 'h-8 w-8'
}

export const getDefaultThumbClass = (size: string): string => {
  const defaultSize: string = size in sizes ? sizes[size] : sizes.med
  // return `block ${defaultSize} bg-white shadow-[0_2px_10px] shadow-blackA7 rounded-[20px] hover:bg-violet3 focus:outline-none focus:shadow-[0_2px_10px] focus:shadow-blackA8`

  return `block ${defaultSize} cursor-pointer bg-white shadow-[0_2px_10px] shadow-blackA7 rounded-[20px] hover:bg-violet3 focus:outline-none focus:shadow-[0_2px_10px] focus:shadow-blackA8`
}
