Skip to content

Commit 95b318f

Browse files
author
codegen-bot
committed
LC-173: Migrate LambdaCurry/forms to ShadCN tailwind V4
1 parent 7bed517 commit 95b318f

7 files changed

Lines changed: 170 additions & 137 deletions

File tree

‎apps/docs/src/main.css‎

Lines changed: 45 additions & 43 deletions
Original file line numberDiff line numberDiff line change
@@ -2,71 +2,73 @@
22
@tailwind components;
33
@tailwind utilities;
44

5-
:root {
6-
--background: 0 0% 100%;
7-
--foreground: 222.2 47.4% 11.2%;
5+
@layer base {
6+
@theme {
7+
--background: 0 0% 100%;
8+
--foreground: 222.2 47.4% 11.2%;
89

9-
--muted: 210 40% 96.1%;
10-
--muted-foreground: 215.4 16.3% 46.9%;
10+
--muted: 210 40% 96.1%;
11+
--muted-foreground: 215.4 16.3% 46.9%;
1112

12-
--popover: 0 0% 100%;
13-
--popover-foreground: 222.2 47.4% 11.2%;
13+
--popover: 0 0% 100%;
14+
--popover-foreground: 222.2 47.4% 11.2%;
1415

15-
--border: 214.3 31.8% 91.4%;
16-
--input: 214.3 31.8% 91.4%;
16+
--border: 214.3 31.8% 91.4%;
17+
--input: 214.3 31.8% 91.4%;
1718

18-
--card: 0 0% 100%;
19-
--card-foreground: 222.2 47.4% 11.2%;
19+
--card: 0 0% 100%;
20+
--card-foreground: 222.2 47.4% 11.2%;
2021

21-
--primary: 222.2 47.4% 11.2%;
22-
--primary-foreground: 210 40% 98%;
22+
--primary: 222.2 47.4% 11.2%;
23+
--primary-foreground: 210 40% 98%;
2324

24-
--secondary: 210 40% 96.1%;
25-
--secondary-foreground: 222.2 47.4% 11.2%;
25+
--secondary: 210 40% 96.1%;
26+
--secondary-foreground: 222.2 47.4% 11.2%;
2627

27-
--accent: 210 40% 96.1%;
28-
--accent-foreground: 222.2 47.4% 11.2%;
28+
--accent: 210 40% 96.1%;
29+
--accent-foreground: 222.2 47.4% 11.2%;
2930

30-
--destructive: 0 100% 50%;
31-
--destructive-foreground: 210 40% 98%;
31+
--destructive: 0 100% 50%;
32+
--destructive-foreground: 210 40% 98%;
3233

33-
--ring: 215 20.2% 65.1%;
34+
--ring: 215 20.2% 65.1%;
3435

35-
--radius: 0.5rem;
36-
}
36+
--radius: 0.5rem;
37+
}
3738

38-
@layer base {
3939
.dark {
40-
--background: 224 71% 4%;
41-
--foreground: 213 31% 91%;
40+
@theme {
41+
--background: 224 71% 4%;
42+
--foreground: 213 31% 91%;
4243

43-
--muted: 223 47% 11%;
44-
--muted-foreground: 215.4 16.3% 56.9%;
44+
--muted: 223 47% 11%;
45+
--muted-foreground: 215.4 16.3% 56.9%;
4546

46-
--accent: 216 34% 17%;
47-
--accent-foreground: 210 40% 98%;
47+
--accent: 216 34% 17%;
48+
--accent-foreground: 210 40% 98%;
4849

49-
--popover: 224 71% 4%;
50-
--popover-foreground: 215 20.2% 65.1%;
50+
--popover: 224 71% 4%;
51+
--popover-foreground: 215 20.2% 65.1%;
5152

52-
--border: 216 34% 17%;
53-
--input: 216 34% 17%;
53+
--border: 216 34% 17%;
54+
--input: 216 34% 17%;
5455

55-
--card: 224 71% 4%;
56-
--card-foreground: 213 31% 91%;
56+
--card: 224 71% 4%;
57+
--card-foreground: 213 31% 91%;
5758

58-
--primary: 210 40% 98%;
59-
--primary-foreground: 222.2 47.4% 1.2%;
59+
--primary: 210 40% 98%;
60+
--primary-foreground: 222.2 47.4% 1.2%;
6061

61-
--secondary: 222.2 47.4% 11.2%;
62-
--secondary-foreground: 210 40% 98%;
62+
--secondary: 222.2 47.4% 11.2%;
63+
--secondary-foreground: 210 40% 98%;
6364

64-
--destructive: 0 63% 31%;
65-
--destructive-foreground: 210 40% 98%;
65+
--destructive: 0 63% 31%;
66+
--destructive-foreground: 210 40% 98%;
6667

67-
--ring: 216 34% 17%;
68+
--ring: 216 34% 17%;
6869

69-
--radius: 0.5rem;
70+
--radius: 0.5rem;
71+
}
7072
}
7173
}
7274

‎apps/docs/tailwind.config.js‎

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,6 +1,6 @@
11
/** @type {import('tailwindcss').Config} */
22
module.exports = {
3-
darkMode: ['class'],
3+
darkMode: 'class',
44
content: ['./src/**/*.{ts,tsx}', '../../packages/components/src/**/*.{ts,tsx}'],
55
theme: {
66
screens: {
@@ -73,4 +73,4 @@ module.exports = {
7373
},
7474
},
7575
plugins: [require('tailwindcss-animate')],
76-
};
76+
};

‎packages/components/package.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -82,7 +82,7 @@
8282
"glob": "^11.0.0",
8383
"postcss": "^8.4.49",
8484
"react": "^19.0.0",
85-
"tailwindcss": "^3.4.17",
85+
"tailwindcss": "^4.0.0",
8686
"typescript": "^5.7.2",
8787
"vite": "^5.4.11",
8888
"vite-plugin-dts": "^4.4.0",

‎packages/components/src/ui/button.tsx‎

Lines changed: 12 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -36,12 +36,17 @@ export interface ButtonProps
3636
asChild?: boolean;
3737
}
3838

39-
const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(
40-
({ className, variant, size, asChild = false, ...props }, ref) => {
41-
const Comp = asChild ? Slot : 'button';
42-
return <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />;
43-
},
44-
);
39+
export function Button({ className, variant, size, asChild = false, ...props }: ButtonProps) {
40+
const Comp = asChild ? Slot : 'button';
41+
return (
42+
<Comp
43+
className={cn(buttonVariants({ variant, size, className }))}
44+
data-slot="button"
45+
{...props}
46+
/>
47+
);
48+
}
49+
4550
Button.displayName = 'Button';
4651

47-
export { Button, buttonVariants };
52+
export { buttonVariants };

‎packages/components/src/ui/checkbox-field.tsx‎

Lines changed: 21 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -30,23 +30,38 @@ export interface CheckboxProps<
3030
checkClassName?: string;
3131
}
3232

33-
const CheckboxField = React.forwardRef<HTMLDivElement, CheckboxProps>(
34-
({ control, name, className, label, description, components, indicatorClassName, checkClassName, ...props }, ref) => (
33+
export function CheckboxField<
34+
TFieldValues extends FieldValues = FieldValues,
35+
TName extends FieldPath<TFieldValues> = FieldPath<TFieldValues>,
36+
>({
37+
control,
38+
name,
39+
className,
40+
label,
41+
description,
42+
components,
43+
indicatorClassName,
44+
checkClassName,
45+
...props
46+
}: CheckboxProps<TFieldValues, TName>) {
47+
return (
3548
<FormField
3649
control={control}
3750
name={name}
3851
render={({ field, fieldState }) => (
39-
<FormItem className={cn('flex flex-row items-start space-y-0', className)} ref={ref}>
52+
<FormItem className={cn('flex flex-row items-start space-y-0', className)}>
4053
<FormControl Component={components?.FormControl}>
4154
<CheckboxPrimitive.Root
4255
ref={field.ref}
4356
className="peer h-4 w-4 shrink-0 rounded-sm border border-primary ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground"
4457
checked={field.value}
4558
onCheckedChange={field.onChange}
59+
data-slot="checkbox"
4660
{...props}
4761
>
4862
<CheckboxPrimitive.Indicator
4963
className={cn('flex items-center justify-center text-current', indicatorClassName)}
64+
data-slot="indicator"
5065
>
5166
<Check className={cn('h-4 w-4', checkClassName)} />
5267
</CheckboxPrimitive.Indicator>
@@ -66,9 +81,9 @@ const CheckboxField = React.forwardRef<HTMLDivElement, CheckboxProps>(
6681
</FormItem>
6782
)}
6883
/>
69-
),
70-
);
84+
);
85+
}
7186

7287
CheckboxField.displayName = CheckboxPrimitive.Root.displayName;
7388

74-
export { CheckboxField as Checkbox };
89+
export { CheckboxField as Checkbox };

0 commit comments

Comments
 (0)