@catalystsoftware/ui 1.0.5 → 1.0.6

package/components/catalyst-ui/primitives/resizable.tsx

@@ -1,56 +0,0 @@
-import * as React from "react"
-import { GripVerticalIcon } from "lucide-react"
-import * as ResizablePrimitive from "react-resizable-panels"
-
-import { cn } from "~/components/catalyst-ui"
-
- // @dev app/components/catalyst-ui/data/primitive-data.tsx:956
-
-function ResizablePanelGroup({
-  className,
-  ...props
-}: React.ComponentProps<typeof ResizablePrimitive.PanelGroup>) {
-  return (
-    <ResizablePrimitive.PanelGroup
-      data-slot="resizable-panel-group"
-      className={cn(
-        "flex h-full w-full data-[panel-group-direction=vertical]:flex-col",
-        className
-      )}
-      {...props}
-    />
-  )
-}
-
-function ResizablePanel({
-  ...props
-}: React.ComponentProps<typeof ResizablePrimitive.Panel>) {
-  return <ResizablePrimitive.Panel data-slot="resizable-panel" {...props} />
-}
-
-function ResizableHandle({
-  withHandle,
-  className,
-  ...props
-}: React.ComponentProps<typeof ResizablePrimitive.PanelResizeHandle> & {
-  withHandle?: boolean
-}) {
-  return (
-    <ResizablePrimitive.PanelResizeHandle
-      data-slot="resizable-handle"
-      className={cn(
-        "bg-border focus-visible:ring-ring relative flex w-px items-center justify-center after:absolute after:inset-y-0 after:left-1/2 after:w-1 after:-translate-x-1/2 focus-visible:ring-1 focus-visible:ring-offset-1 focus-visible:outline-hidden data-[panel-group-direction=vertical]:h-px data-[panel-group-direction=vertical]:w-full data-[panel-group-direction=vertical]:after:left-0 data-[panel-group-direction=vertical]:after:h-1 data-[panel-group-direction=vertical]:after:w-full data-[panel-group-direction=vertical]:after:translate-x-0 data-[panel-group-direction=vertical]:after:-translate-y-1/2 [&[data-panel-group-direction=vertical]>div]:rotate-90",
-        className
-      )}
-      {...props}
-    >
-      {withHandle && (
-        <div className="bg-border z-10 flex h-4 w-3 items-center justify-center rounded-xs border">
-          <GripVerticalIcon className="size-2.5" />
-        </div>
-      )}
-    </ResizablePrimitive.PanelResizeHandle>
-  )
-}
-
-export { ResizablePanelGroup, ResizablePanel, ResizableHandle }

package/components/catalyst-ui/primitives/select.tsx

@@ -1,155 +0,0 @@
-import * as SelectPrimitive from "@radix-ui/react-select";
-import { Check, ChevronDown, ChevronRight, ChevronsUpDown, ChevronUp } from "lucide-react";
-import React from "react";
-import { cn } from "~/components/catalyst-ui";
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:3678
-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>
->(({ className, children, ...props }, ref) => (
-    <SelectPrimitive.Trigger
-        ref={ref}
-        className={cn(
-            "flex h-10 w-full items-center justify-between rounded-md border border-input bg-background px-3 py-2 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",
-            className
-        )}
-        {...props}
-    >
-        {children}
-        <SelectPrimitive.Icon asChild>
-            <ChevronsUpDown className="h-4 w-4 opacity-50" />
-        </SelectPrimitive.Icon>
-    </SelectPrimitive.Trigger>
-));
-SelectTrigger.displayName = SelectPrimitive.Trigger.displayName;
-
-const SelectScrollUpButton = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.ScrollUpButton>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollUpButton>
->(({ className, ...props }, ref) => (
-    <SelectPrimitive.ScrollUpButton
-        ref={ref}
-        className={cn(
-            "flex cursor-default items-center justify-center py-1",
-            className
-        )}
-        {...props}
-    >
-        <ChevronUp className="h-4 w-4" />
-    </SelectPrimitive.ScrollUpButton>
-));
-SelectScrollUpButton.displayName = SelectPrimitive.ScrollUpButton.displayName;
-
-const SelectScrollDownButton = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.ScrollDownButton>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.ScrollDownButton>
->(({ className, ...props }, ref) => (
-    <SelectPrimitive.ScrollDownButton
-        ref={ref}
-        className={cn(
-            "flex cursor-default items-center justify-center py-1",
-            className
-        )}
-        {...props}
-    >
-        <ChevronDown className="h-4 w-4" />
-    </SelectPrimitive.ScrollDownButton>
-));
-SelectScrollDownButton.displayName = SelectPrimitive.ScrollDownButton.displayName;
-
-const SelectContent = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.Content>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Content>
->(({ className, children, position = "popper", ...props }, ref) => (
-    <SelectPrimitive.Portal>
-        <SelectPrimitive.Content
-            ref={ref}
-            className={cn(
-                "relative z-50 max-h-96 min-w-[8rem] overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-md data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",
-                position === "popper" &&
-                "data-[side=bottom]:translate-y-1 data-[side=left]:-translate-x-1 data-[side=right]:translate-x-1 data-[side=top]:-translate-y-1",
-                className
-            )}
-            position={position}
-            {...props}
-        >
-            <SelectScrollUpButton />
-            <SelectPrimitive.Viewport
-                className={cn(
-                    "p-1",
-                    position === "popper" &&
-                    "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]"
-                )}
-            >
-                {children}
-            </SelectPrimitive.Viewport>
-            <SelectScrollDownButton />
-        </SelectPrimitive.Content>
-    </SelectPrimitive.Portal>
-));
-SelectContent.displayName = SelectPrimitive.Content.displayName;
-
-const SelectLabel = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.Label>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Label>
->(({ className, ...props }, ref) => (
-    <SelectPrimitive.Label
-        ref={ref}
-        className={cn("py-1.5 pl-8 pr-2 text-sm font-semibold", className)}
-        {...props}
-    />
-));
-SelectLabel.displayName = SelectPrimitive.Label.displayName;
-
-const SelectItem = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.Item>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Item>
->(({ className, children, ...props }, ref) => (
-    <SelectPrimitive.Item
-        ref={ref}
-        className={cn(
-            "relative flex w-full cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",
-            className
-        )}
-        {...props}
-    >
-        <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">
-            <SelectPrimitive.ItemIndicator>
-                <Check className="h-4 w-4" />
-            </SelectPrimitive.ItemIndicator>
-        </span>
-
-        <SelectPrimitive.ItemText>{children}</SelectPrimitive.ItemText>
-    </SelectPrimitive.Item>
-));
-SelectItem.displayName = SelectPrimitive.Item.displayName;
-
-const SelectSeparator = React.forwardRef<
-    React.ElementRef<typeof SelectPrimitive.Separator>,
-    React.ComponentPropsWithoutRef<typeof SelectPrimitive.Separator>
->(({ className, ...props }, ref) => (
-    <SelectPrimitive.Separator
-        ref={ref}
-        className={cn("-mx-1 my-1 h-px bg-muted", className)}
-        {...props}
-    />
-));
-SelectSeparator.displayName = SelectPrimitive.Separator.displayName;
-
-export {
-  Select,
-  SelectGroup,
-  SelectValue,
-  SelectTrigger,
-  SelectContent,
-  SelectLabel,
-  SelectItem,
-  SelectSeparator,
-  SelectScrollUpButton,
-  SelectScrollDownButton,
-}

package/components/catalyst-ui/primitives/separator.tsx

@@ -1,74 +0,0 @@
-import React from 'react'
-import * as SeparatorPrimitive from '@radix-ui/react-separator'
-import { cn } from '~/components/catalyst-ui'
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:3426
-const Separator = React.forwardRef<
-  React.ElementRef<typeof SeparatorPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof SeparatorPrimitive.Root>
->(
-  (
-    { className, orientation = 'horizontal', decorative = true, ...props },
-    ref
-  ) => (
-    <SeparatorPrimitive.Root
-      ref={ref}
-      decorative={decorative}
-      orientation={orientation}
-      className={cn(
-        'shrink-0 bg-border/30 border-border',
-        orientation === 'horizontal' ? 'h-[1px] w-full' : 'h-full w-[2px]',
-        className
-      )}
-      {...props}
-    />
-  )
-)
-Separator.displayName = SeparatorPrimitive.Root.displayName
-
-
-  const SeparatorWithText = React.forwardRef<
-  HTMLDivElement,
-  React.HTMLAttributes<HTMLDivElement> & {
-    children: React.ReactNode
-    orientation?: 'horizontal' | 'vertical'
-  }
->(({ className, children, orientation = 'horizontal', ...props }, ref) => (
-  <div
-    ref={ref}
-    className={cn(
-      'flex items-center',
-      orientation === 'horizontal' ? 'w-full' : 'h-full flex-col',
-      className
-    )}
-    {...props}
-  >
-    <Separator className="flex-1" orientation={orientation} />
-    <span className={cn(
-      'text-muted-foreground text-sm',
-      orientation === 'horizontal' ? 'px-3' : 'py-3'
-    )}>
-      {children}
-    </span>
-    <Separator className="flex-1" orientation={orientation} />
-  </div>
-))
-SeparatorWithText.displayName = 'SeparatorWithText'
-
-export { Separator, SeparatorWithText }
-
-/**usage
- * 
- * // Horizontal (default)
-<SeparatorWithText>OR</SeparatorWithText>
-
-// With custom styling
-<SeparatorWithText className="my-4">
-  Continue with
-</SeparatorWithText>
-
-// Vertical
-<SeparatorWithText orientation="vertical">
-  OR
-</SeparatorWithText>
- */

package/components/catalyst-ui/primitives/sheet.tsx

@@ -1,126 +0,0 @@
-import * as DialogPrimitive from "@radix-ui/react-dialog";
-import { cva } from "class-variance-authority";
-import { X } from "lucide-react";
-import React from "react";
-import { cn } from "~/components/catalyst-ui";
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:4773
-const Sheet = DialogPrimitive.Root;
-const SheetTrigger = DialogPrimitive.Trigger;
-const SheetClose = DialogPrimitive.Close;
-const SheetPortal = DialogPrimitive.Portal;
-
-const SheetOverlay = React.forwardRef<
-    React.ElementRef<typeof DialogPrimitive.Overlay>,
-    React.ComponentPropsWithoutRef<typeof DialogPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-    <DialogPrimitive.Overlay
-        className={cn(
-            "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0",
-            className
-        )}
-        {...props}
-        ref={ref}
-    />
-));
-SheetOverlay.displayName = DialogPrimitive.Overlay.displayName;
-
-const sheetVariants = cva(
-    "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:duration-300 data-[state=open]:duration-500",
-    {
-        variants: {
-            side: {
-                top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",
-                bottom:
-                    "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",
-                left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",
-                right:
-                    "inset-y-0 right-0 h-full w-3/4  border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",
-            },
-        },
-        defaultVariants: {
-            side: "right",
-        },
-    }
-);
-
-interface SheetContentProps
-    extends React.ComponentPropsWithoutRef<typeof DialogPrimitive.Content>,
-    VariantProps<typeof sheetVariants> { }
-
-const SheetContent = React.forwardRef<
-    React.ElementRef<typeof DialogPrimitive.Content>,
-    SheetContentProps
->(({ side = "right", className, children, ...props }, ref) => (
-    <SheetPortal>
-        <SheetOverlay />
-        <DialogPrimitive.Content
-            ref={ref}
-            className={cn(sheetVariants({ side }), className)}
-            {...props}
-        >
-            {children}
-            <DialogPrimitive.Close className="absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-secondary">
-                <X className="h-4 w-4" />
-                <span className="sr-only">Close</span>
-            </DialogPrimitive.Close>
-        </DialogPrimitive.Content>
-    </SheetPortal>
-));
-SheetContent.displayName = DialogPrimitive.Content.displayName;
-
-const SheetHeader = ({
-    className,
-    ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-    <div
-        className={cn(
-            "flex flex-col space-y-2 text-center sm:text-left",
-            className
-        )}
-        {...props}
-    />
-);
-SheetHeader.displayName = "SheetHeader";
-
-const SheetFooter = ({
-    className,
-    ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-    <div
-        className={cn(
-            "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-            className
-        )}
-        {...props}
-    />
-);
-SheetFooter.displayName = "SheetFooter";
-
-const SheetTitle = React.forwardRef<
-    React.ElementRef<typeof DialogPrimitive.Title>,
-    React.ComponentPropsWithoutRef<typeof DialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-    <DialogPrimitive.Title
-        ref={ref}
-        className={cn("text-lg font-semibold text-foreground", className)}
-        {...props}
-    />
-));
-SheetTitle.displayName = DialogPrimitive.Title.displayName;
-
-const SheetDescription = React.forwardRef<
-    React.ElementRef<typeof DialogPrimitive.Description>,
-    React.ComponentPropsWithoutRef<typeof DialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-    <DialogPrimitive.Description
-        ref={ref}
-        className={cn("text-sm text-muted-foreground", className)}
-        {...props}
-    />
-));
-SheetDescription.displayName = DialogPrimitive.Description.displayName;
-
-export {
-  Sheet,  SheetPortal,  SheetOverlay,  SheetTrigger,  SheetClose,  SheetContent,  SheetHeader,  SheetFooter,  SheetTitle,  SheetDescription,  type SheetContentProps
-}

package/components/catalyst-ui/primitives/skeleton.tsx

@@ -1,15 +0,0 @@
-import { cn } from "~/components/catalyst-ui"
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:288
-
-function Skeleton({ className, ...props }: React.ComponentProps<"div">) {
-  return (
-    <div
-      data-slot="skeleton"
-      className={cn("bg-accent animate-pulse rounded-md", className)}
-      {...props}
-    />
-  )
-}
-
-export { Skeleton }

package/components/catalyst-ui/primitives/slider.tsx

@@ -1,27 +0,0 @@
-import * as SliderPrimitive from "@radix-ui/react-slider";
-import { cn } from "~/components/catalyst-ui";
-import React from "react";
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:2559
-const Slider = React.forwardRef<
-    React.ElementRef<typeof SliderPrimitive.Root>,
-    React.ComponentPropsWithoutRef<typeof SliderPrimitive.Root>
->(({ className, ...props }, ref) => (
-    <SliderPrimitive.Root
-        ref={ref}
-        className={cn(
-            "relative flex w-full touch-none select-none items-center",
-            className
-        )}
-        {...props}
-    >
-        <SliderPrimitive.Track className="relative h-2 w-full grow overflow-hidden rounded-full bg-secondary">
-            <SliderPrimitive.Range className="absolute h-full bg-primary" />
-        </SliderPrimitive.Track>
-        <SliderPrimitive.Thumb className="block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50" />
-    </SliderPrimitive.Root>
-));
-Slider.displayName = SliderPrimitive.Root.displayName;
-
-
-export { Slider }

package/components/catalyst-ui/primitives/switch.tsx

@@ -1,187 +0,0 @@
-
-
-import * as SwitchPrimitive from "@radix-ui/react-switch";
-import { cva, type VariantProps } from "class-variance-authority";
-import { cn } from "~/components/catalyst-ui";
-import React from "react";
-
-// @dev app/components/catalyst-ui/data/primitive-data.tsx:2921
-
-type SwitchVariantContextValue = {
-  size?: "sm" | "md" | "lg";
-  variant?: "default" | "destructive" | "success" | "info" | "warning";
-  shape?: "default" | "square";
-  style?: "solid" | "outline";
-  mini?: boolean;
-};
-
-const SwitchVariantContext = React.createContext<SwitchVariantContextValue>({});
-
-export const switchRootVariants = cva(
-  "peer inline-flex shrink-0 cursor-pointer items-center border transition-colors focus-visible:outline-none focus-visible:ring-[3px] focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50",
-  {
-    variants: {
-      size: {
-        sm: "h-5 w-9",
-        md: "h-6 w-10",
-        lg: "h-7 w-12",
-      },
-      variant: {
-        default: "focus-visible:ring-ring data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
-        destructive: "focus-visible:border-destructive focus-visible:ring-destructive/20 dark:focus-visible:ring-destructive/40 data-[state=checked]:bg-destructive data-[state=unchecked]:bg-input",
-        success: "focus-visible:border-green-600 dark:focus-visible:border-green-400 focus-visible:ring-green-600/20 dark:focus-visible:ring-green-400/40 data-[state=checked]:bg-green-600 dark:data-[state=checked]:bg-green-400 data-[state=unchecked]:bg-input",
-        info: "focus-visible:border-sky-600 dark:focus-visible:border-sky-400 focus-visible:ring-sky-600/20 dark:focus-visible:ring-sky-400/40 data-[state=checked]:bg-sky-600 dark:data-[state=checked]:bg-sky-400 data-[state=unchecked]:bg-input",
-        warning: "focus-visible:border-amber-600 dark:focus-visible:border-amber-400 focus-visible:ring-amber-600/20 dark:focus-visible:ring-amber-400/40 data-[state=checked]:bg-amber-600 dark:data-[state=checked]:bg-amber-400 data-[state=unchecked]:bg-input",
-      },
-      shape: {
-        default: "rounded-full",
-        square: "rounded-xs",
-      },
-      style: {
-        solid: "border-transparent",
-        outline: "data-[state=checked]:bg-transparent",
-      },
-      mini: {
-        true: "h-3 border-none",
-        false: "",
-      },
-    },
-    compoundVariants: [
-      {
-        style: "outline",
-        variant: "default",
-        className: "focus-visible:border-primary data-[state=checked]:border-primary",
-      },
-      {
-        style: "outline",
-        variant: "destructive",
-        className: "data-[state=checked]:border-destructive",
-      },
-      {
-        style: "outline",
-        variant: "success",
-        className: "data-[state=checked]:border-green-600 dark:data-[state=checked]:border-green-400",
-      },
-      {
-        style: "outline",
-        variant: "info",
-        className: "data-[state=checked]:border-sky-600 dark:data-[state=checked]:border-sky-400",
-      },
-      {
-        style: "outline",
-        variant: "warning",
-        className: "data-[state=checked]:border-amber-600 dark:data-[state=checked]:border-amber-400",
-      },
-    ],
-    defaultVariants: {
-      size: "sm",
-      variant: "default",
-      shape: "default",
-      style: "solid",
-      mini: false,
-    },
-  }
-);
-
-export const switchThumbVariants = cva(
-  "pointer-events-none block rounded-full bg-background shadow-lg ring-0 transition-transform",
-  {
-    variants: {
-      size: {
-        sm: "h-4 w-4 data-[state=checked]:translate-x-4 data-[state=unchecked]:translate-x-1 data-[state=checked]:rtl:-translate-x-4 data-[state=unchecked]:rtl:-translate-x-1",
-        md: "h-5 w-5 data-[state=checked]:translate-x-4.5 data-[state=unchecked]:translate-x-1 data-[state=checked]:rtl:-translate-x-4.5 data-[state=unchecked]:rtl:-translate-x-1",
-        lg: "h-6 w-6 data-[state=checked]:translate-x-5.5 data-[state=unchecked]:translate-x-1 data-[state=checked]:rtl:-translate-x-5.5 data-[state=unchecked]:rtl:-translate-x-1",
-      },
-      shape: {
-        default: "rounded-full",
-        square: "rounded-xs",
-      },
-      style: {
-        solid: "",
-        outline: "border",
-      },
-      mini: {
-        true: "size-4.5 border border-input",
-        false: "",
-      },
-    },
-    compoundVariants: [
-      {
-        style: "outline",
-        className: "data-[state=checked]:border-background",
-      },
-      {
-        style: "outline",
-        variant: "default",
-        className: "data-[state=checked]:bg-primary dark:data-[state=checked]:bg-primary",
-      },
-      {
-        style: "outline",
-        variant: "destructive",
-        className: "data-[state=checked]:bg-destructive dark:data-[state=checked]:bg-destructive",
-      },
-      {
-        style: "outline",
-        variant: "success",
-        className: "data-[state=checked]:bg-green-600 dark:data-[state=checked]:bg-green-400",
-      },
-      {
-        style: "outline",
-        variant: "info",
-        className: "data-[state=checked]:bg-sky-600 dark:data-[state=checked]:bg-sky-400",
-      },
-      {
-        style: "outline",
-        variant: "warning",
-        className: "data-[state=checked]:bg-amber-600 dark:data-[state=checked]:bg-amber-400",
-      },
-    ],
-    defaultVariants: {
-      size: "sm",
-      shape: "default",
-      style: "solid",
-      mini: false,
-    },
-  }
-);
-
-const Switch = React.forwardRef<
-  React.ElementRef<typeof SwitchPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Root> &
-    VariantProps<typeof switchRootVariants> &
-    SwitchVariantContextValue
->(({ className, size, variant, shape, style, mini, children, ...props }, ref) => {
-  const contextValue = { size, variant, shape, style, mini };
-
-  return (
-    <SwitchVariantContext.Provider value={contextValue}>
-      <SwitchPrimitive.Root
-        className={cn(switchRootVariants({ size, variant, shape, style, mini }), className)}
-        {...props}
-        ref={ref}
-      >
-        {children || <SwitchThumb />}
-      </SwitchPrimitive.Root>
-    </SwitchVariantContext.Provider>
-  );
-});
-Switch.displayName = SwitchPrimitive.Root.displayName;
-
-// Thumb component consuming context
-const SwitchThumb = React.forwardRef<
-  React.ElementRef<typeof SwitchPrimitive.Thumb>,
-  React.ComponentPropsWithoutRef<typeof SwitchPrimitive.Thumb>
->(({ className, ...props }, ref) => {
-  const { size, shape, style, mini, variant } = React.useContext(SwitchVariantContext);
-
-  return (
-    <SwitchPrimitive.Thumb
-      ref={ref}
-      className={cn(switchThumbVariants({ size, shape, style, mini, variant }), className)}
-      {...props}
-    />
-  );
-});
-SwitchThumb.displayName = SwitchPrimitive.Thumb.displayName;
-
-export { Switch, SwitchThumb };