add new checkbox variants

This commit is contained in:
miloschwartz 2025-03-27 23:12:11 -04:00
parent 66f324e18c
commit fbd78ab842
No known key found for this signature in database
2 changed files with 40 additions and 18 deletions

View file

@ -57,15 +57,15 @@ export async function createOrg(
); );
} }
const userOrgIds = req.userOrgIds; // const userOrgIds = req.userOrgIds;
if (userOrgIds && userOrgIds.length > MAX_ORGS) { // if (userOrgIds && userOrgIds.length > MAX_ORGS) {
return next( // return next(
createHttpError( // createHttpError(
HttpCode.FORBIDDEN, // HttpCode.FORBIDDEN,
`Maximum number of organizations reached.` // `Maximum number of organizations reached.`
) // )
); // );
} // }
const { orgId, name } = parsedBody.data; const { orgId, name } = parsedBody.data;

View file

@ -5,22 +5,44 @@ import * as CheckboxPrimitive from "@radix-ui/react-checkbox";
import { Check } from "lucide-react"; import { Check } from "lucide-react";
import { cn } from "@app/lib/cn"; import { cn } from "@app/lib/cn";
import { cva, type VariantProps } from "class-variance-authority";
// Define checkbox variants
const checkboxVariants = cva(
"peer h-4 w-4 shrink-0 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",
{
variants: {
variant: {
outlinePrimary:
"border-2 rounded-sm border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
outline:
"border-2 rounded-sm border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground",
outlinePrimarySquare:
"border-2 rounded-[20%] border-primary data-[state=checked]:bg-primary data-[state=checked]:text-primary-foreground",
outlineSquare:
"border-2 rounded-[20%] border-input data-[state=checked]:bg-muted data-[state=checked]:text-accent-foreground"
}
},
defaultVariants: {
variant: "outlinePrimary"
}
}
);
interface CheckboxProps
extends React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root>,
VariantProps<typeof checkboxVariants> {}
const Checkbox = React.forwardRef< const Checkbox = React.forwardRef<
React.ElementRef<typeof CheckboxPrimitive.Root>, React.ElementRef<typeof CheckboxPrimitive.Root>,
React.ComponentPropsWithoutRef<typeof CheckboxPrimitive.Root> CheckboxProps
>(({ className, ...props }, ref) => ( >(({ className, variant, ...props }, ref) => (
<CheckboxPrimitive.Root <CheckboxPrimitive.Root
ref={ref} ref={ref}
className={cn( className={cn(checkboxVariants({ variant }), className)}
"peer h-4 w-4 shrink-0 rounded-sm border-2 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",
className
)}
{...props} {...props}
> >
<CheckboxPrimitive.Indicator <CheckboxPrimitive.Indicator className="flex items-center justify-center text-current">
className={cn("flex items-center justify-center text-current")}
>
<Check className="h-4 w-4" /> <Check className="h-4 w-4" />
</CheckboxPrimitive.Indicator> </CheckboxPrimitive.Indicator>
</CheckboxPrimitive.Root> </CheckboxPrimitive.Root>