CoolFace
Apppublic

huggingface/ai-deadlines

sourceHugging Faceupdated 3d agoView on Hugging Face
781likes
toggle-group.tsx60 linesDownload Raw Back to ui
1import * as React from "react"2import * as ToggleGroupPrimitive from "@radix-ui/react-toggle-group"3import { type VariantProps } from "class-variance-authority"4 5import { cn } from "@/lib/utils"6import { toggleVariants } from "@/components/ui/toggle"7 8const ToggleGroupContext = React.createContext<9  VariantProps<typeof toggleVariants>10>({11  size: "default",12  variant: "default",13})14 15const ToggleGroup = React.forwardRef<16  React.ElementRef<typeof ToggleGroupPrimitive.Root>,17  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Root> &18    VariantProps<typeof toggleVariants>19>(({ className, variant, size, children, ...props }, ref) => (20  <ToggleGroupPrimitive.Root21    ref={ref}22    className={cn("flex items-center justify-center gap-1", className)}23    {...props}24  >25    <ToggleGroupContext.Provider value={{ variant, size }}>26      {children}27    </ToggleGroupContext.Provider>28  </ToggleGroupPrimitive.Root>29))30 31ToggleGroup.displayName = ToggleGroupPrimitive.Root.displayName32 33const ToggleGroupItem = React.forwardRef<34  React.ElementRef<typeof ToggleGroupPrimitive.Item>,35  React.ComponentPropsWithoutRef<typeof ToggleGroupPrimitive.Item> &36    VariantProps<typeof toggleVariants>37>(({ className, children, variant, size, ...props }, ref) => {38  const context = React.useContext(ToggleGroupContext)39 40  return (41    <ToggleGroupPrimitive.Item42      ref={ref}43      className={cn(44        toggleVariants({45          variant: context.variant || variant,46          size: context.size || size,47        }),48        className49      )}50      {...props}51    >52      {children}53    </ToggleGroupPrimitive.Item>54  )55})56 57ToggleGroupItem.displayName = ToggleGroupPrimitive.Item.displayName58 59export { ToggleGroup, ToggleGroupItem }60