Skip to content

Commit ce8b009

Browse files
fix: Add missing Switch and Label UI components
Adds the source files for `frontend/src/components/ui/switch.tsx` and `frontend/src/components/ui/label.tsx`. These components were being imported by `InputForm.tsx` but their source files were missing from the repository, causing TypeScript compilation errors during the Docker build process (TS2307: Cannot find module). This commit provides the standard ShadCN UI implementations for these components, which should resolve the build failure.
1 parent 3c319d4 commit ce8b009

File tree

2 files changed

+64
-0
lines changed

2 files changed

+64
-0
lines changed

frontend/src/components/ui/label.tsx

Lines changed: 26 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,26 @@
1+
"use client"
2+
3+
import * as React from "react"
4+
import * as LabelPrimitive from "@radix-ui/react-label"
5+
import { cva, type VariantProps } from "class-variance-authority"
6+
7+
import { cn } from "@/lib/utils"
8+
9+
const labelVariants = cva(
10+
"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70"
11+
)
12+
13+
const Label = React.forwardRef<
14+
React.ElementRef<typeof LabelPrimitive.Root>,
15+
React.ComponentPropsWithoutRef<typeof LabelPrimitive.Root> &
16+
VariantProps<typeof labelVariants>
17+
>(({ className, ...props }, ref) => (
18+
<LabelPrimitive.Root
19+
ref={ref}
20+
className={cn(labelVariants(), className)}
21+
{...props}
22+
/>
23+
))
24+
Label.displayName = LabelPrimitive.Root.displayName
25+
26+
export { Label }

frontend/src/components/ui/switch.tsx

Lines changed: 38 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,38 @@
1+
"use client"
2+
3+
import * as React from "react"
4+
import * as SwitchPrimitives from "@radix-ui/react-switch"
5+
import { cva, type VariantProps } from "class-variance-authority" // cva might not be strictly necessary here but often included
6+
7+
import { cn } from "@/lib/utils"
8+
9+
// Base styling for the switch, derived from typical ShadCN setups.
10+
// It uses data-state attributes for checked/unchecked states.
11+
const switchRootVariants = cva(
12+
"peer inline-flex h-[24px] w-[44px] shrink-0 cursor-pointer items-center rounded-full border-2 border-transparent transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=unchecked]:bg-input",
13+
{
14+
variants: {}, // No specific variants defined here, but structure allows for it
15+
defaultVariants: {},
16+
}
17+
)
18+
19+
const switchThumbVariants = cva( // Also define thumb variants if you want to customize it via cva
20+
"pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0"
21+
)
22+
23+
24+
const Switch = React.forwardRef<
25+
React.ElementRef<typeof SwitchPrimitives.Root>,
26+
React.ComponentPropsWithoutRef<typeof SwitchPrimitives.Root> & VariantProps<typeof switchRootVariants>
27+
>(({ className, ...props }, ref) => (
28+
<SwitchPrimitives.Root
29+
className={cn(switchRootVariants(), className)}
30+
{...props}
31+
ref={ref}
32+
>
33+
<SwitchPrimitives.Thumb className={cn(switchThumbVariants())} />
34+
</SwitchPrimitives.Root>
35+
))
36+
Switch.displayName = SwitchPrimitives.Root.displayName
37+
38+
export { Switch }

0 commit comments

Comments
 (0)