eai-frontend-components 2.0.4 → 2.0.6

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "eai-frontend-components",
-  "version": "2.0.4",
-  "description": "Modern React UI component library based on shadcn/ui with TypeScript, Tailwind CSS, and full accessibility support. Perfect for building beautiful, responsive applications.",
+  "version": "2.0.6",
+  "description": "Biblioteca de componentes UI reutilizáveis baseada em shadcn/ui e Radix UI para projetos EAI.",
   "private": false,
   "publishConfig": {
     "access": "public",
@@ -23,7 +23,8 @@
   "types": "dist/index.d.ts",
   "files": [
     "dist",
-    "src"
+    "README.md",
+    "LICENSE"
   ],
   "scripts": {
     "build": "rollup -c",
@@ -36,7 +37,6 @@
     "test": "echo \"No tests specified\" && exit 0",
     "ci": "npm run lint && npm run type-check && npm run build",
     "release": "semantic-release",
-    "postinstall": "npm run build",
     "prepublishOnly": "npm run ci"
   },
   "peerDependencies": {

package/src/components/ui/accordion.tsx

@@ -1,48 +0,0 @@
-import * as AccordionPrimitive from '@radix-ui/react-accordion';
-import { ChevronDown } from 'lucide-react';
-import * as React from 'react';
-
-import { cn } from '../../lib/utils';
-
-const Accordion = AccordionPrimitive.Root;
-
-const AccordionItem = React.forwardRef<
-	React.ElementRef<typeof AccordionPrimitive.Item>,
-	React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Item>
->(({ className, ...props }, ref) => <AccordionPrimitive.Item ref={ref} className={cn('border-b', className)} {...props} />);
-AccordionItem.displayName = 'AccordionItem';
-
-const AccordionTrigger = React.forwardRef<
-	React.ElementRef<typeof AccordionPrimitive.Trigger>,
-	React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Trigger>
->(({ className, children, ...props }, ref) => (
-	<AccordionPrimitive.Header className='flex'>
-		<AccordionPrimitive.Trigger
-			ref={ref}
-			className={cn('flex flex-1 items-center justify-between p-4 font-medium transition-all [&[data-state=open]>svg]:rotate-180', className)}
-			{...props}
-		>
-			{children}
-			<ChevronDown className='h-4 w-4 shrink-0 transition-transform duration-200' />
-		</AccordionPrimitive.Trigger>
-	</AccordionPrimitive.Header>
-));
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
-
-const AccordionContent = React.forwardRef<
-	React.ElementRef<typeof AccordionPrimitive.Content>,
-	React.ComponentPropsWithoutRef<typeof AccordionPrimitive.Content>
->(({ className, children, ...props }, ref) => (
-	<AccordionPrimitive.Content
-		ref={ref}
-		className='overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down'
-		{...props}
-	>
-		<div className={cn('p-4 pt-0', className)}>{children}</div>
-	</AccordionPrimitive.Content>
-));
-
-AccordionContent.displayName = AccordionPrimitive.Content.displayName;
-
-export { Accordion, AccordionContent, AccordionItem, AccordionTrigger };
-

package/src/components/ui/alert-dialog.tsx

@@ -1,138 +0,0 @@
-import { cn } from "@/lib/utils"
-import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"
-import * as React from "react"
-import { buttonVariants } from "./button"
-
-const AlertDialog = AlertDialogPrimitive.Root
-
-const AlertDialogTrigger = AlertDialogPrimitive.Trigger
-
-const AlertDialogPortal = AlertDialogPrimitive.Portal
-
-const AlertDialogOverlay = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Overlay>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Overlay>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Overlay
-    className={cn(
-      "fixed inset-0 z-50 bg-black/80  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}
-  />
-))
-AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName
-
-const AlertDialogContent = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Content>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Content>
->(({ className, ...props }, ref) => (
-  <AlertDialogPortal>
-    <AlertDialogOverlay />
-    <AlertDialogPrimitive.Content
-      ref={ref}
-      className={cn(
-        "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg",
-        className
-      )}
-      {...props}
-    />
-  </AlertDialogPortal>
-))
-AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName
-
-const AlertDialogHeader = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col space-y-2 text-center sm:text-left",
-      className
-    )}
-    {...props}
-  />
-)
-AlertDialogHeader.displayName = "AlertDialogHeader"
-
-const AlertDialogFooter = ({
-  className,
-  ...props
-}: React.HTMLAttributes<HTMLDivElement>) => (
-  <div
-    className={cn(
-      "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",
-      className
-    )}
-    {...props}
-  />
-)
-AlertDialogFooter.displayName = "AlertDialogFooter"
-
-const AlertDialogTitle = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Title>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Title>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Title
-    ref={ref}
-    className={cn("text-lg font-semibold", className)}
-    {...props}
-  />
-))
-AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName
-
-const AlertDialogDescription = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Description>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Description>
->(({ className, ...props }, ref) => (
-  <AlertDialogPrimitive.Description
-    ref={ref}
-    className={cn("text-sm text-muted-foreground", className)}
-    {...props}
-  />
-))
-AlertDialogDescription.displayName =
-  AlertDialogPrimitive.Description.displayName
-
-  const AlertDialogAction = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Action>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Action> & {
-    variant?: "default" | "outline" | "destructive" | "secondary"; // Adapte conforme suas variantes
-  }
->(({ className, variant = "default", ...props }, ref) => (
-  <AlertDialogPrimitive.Action
-    ref={ref}
-    className={cn(buttonVariants({ variant }), className)}
-    {...props}
-  />
-));
-
-AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
-
-
-const AlertDialogCancel = React.forwardRef<
-  React.ElementRef<typeof AlertDialogPrimitive.Cancel>,
-  React.ComponentPropsWithoutRef<typeof AlertDialogPrimitive.Cancel> & {
-    variant?: "default" | "outline" | "destructive" | "secondary"; // Adapte conforme suas variantes
-  }
->(({ className, variant = "outline", ...props }, ref) => (
-  <AlertDialogPrimitive.Cancel
-    ref={ref}
-    className={cn(
-      buttonVariants({ variant }), // Usa a variante passada como prop
-      "mt-2 sm:mt-0",
-      className
-    )}
-    {...props}
-  />
-));
-
-AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
-
-
-export {
-  AlertDialog, AlertDialogAction,
-  AlertDialogCancel, AlertDialogContent, AlertDialogDescription, AlertDialogFooter, AlertDialogHeader, AlertDialogOverlay, AlertDialogPortal, AlertDialogTitle, AlertDialogTrigger
-}
-

package/src/components/ui/alert.tsx

@@ -1,36 +0,0 @@
-import { cva, type VariantProps } from 'class-variance-authority';
-import * as React from 'react';
-import { cn } from '../../lib/utils';
-
-const alertVariants = cva(
-	'relative w-full rounded-lg border p-4 [&>svg~*]:pl-7 [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground',
-	{
-		variants: {
-			variant: {
-				default: 'bg-background text-foreground',
-				destructive: 'border-destructive/50 text-destructive dark:border-destructive [&>svg]:text-destructive',
-			},
-		},
-		defaultVariants: {
-			variant: 'default',
-		},
-	},
-);
-
-const Alert = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement> & VariantProps<typeof alertVariants>>(
-	({ className, variant, ...props }, ref) => <div ref={ref} role='alert' className={cn(alertVariants({ variant }), className)} {...props} />,
-);
-Alert.displayName = 'Alert';
-
-const AlertTitle = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLHeadingElement>>(({ className, ...props }, ref) => (
-	<h5 ref={ref} className={cn('mb-1 font-medium leading-none tracking-tight', className)} {...props} />
-));
-AlertTitle.displayName = 'AlertTitle';
-
-const AlertDescription = React.forwardRef<HTMLParagraphElement, React.HTMLAttributes<HTMLParagraphElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('text-sm [&_p]:leading-relaxed', className)} {...props} />
-));
-AlertDescription.displayName = 'AlertDescription';
-
-export { Alert, AlertDescription, AlertTitle };
-

package/src/components/ui/avatar.tsx

@@ -1,48 +0,0 @@
-import * as React from "react"
-import * as AvatarPrimitive from "@radix-ui/react-avatar"
-
-import { cn } from "@/lib/utils"
-
-const Avatar = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Root>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Root>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Root
-    ref={ref}
-    className={cn(
-      "relative flex h-10 w-10 shrink-0 overflow-hidden rounded-full",
-      className
-    )}
-    {...props}
-  />
-))
-Avatar.displayName = AvatarPrimitive.Root.displayName
-
-const AvatarImage = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Image>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Image>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Image
-    ref={ref}
-    className={cn("aspect-square h-full w-full", className)}
-    {...props}
-  />
-))
-AvatarImage.displayName = AvatarPrimitive.Image.displayName
-
-const AvatarFallback = React.forwardRef<
-  React.ElementRef<typeof AvatarPrimitive.Fallback>,
-  React.ComponentPropsWithoutRef<typeof AvatarPrimitive.Fallback>
->(({ className, ...props }, ref) => (
-  <AvatarPrimitive.Fallback
-    ref={ref}
-    className={cn(
-      "flex h-full w-full items-center justify-center rounded-full bg-muted",
-      className
-    )}
-    {...props}
-  />
-))
-AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName
-
-export { Avatar, AvatarImage, AvatarFallback }

package/src/components/ui/badge.tsx

@@ -1,35 +0,0 @@
-import { type VariantProps, cva } from 'class-variance-authority';
-import * as React from 'react';
-import { cn } from '../../lib/utils';
-
-const badgeVariants = cva(
-	'inline-flex items-center rounded-full border px-2.5 py-0.5 text-xs font-semibold transition-colors focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2',
-	{
-		variants: {
-			variant: {
-				default: 'border-transparent bg-background-primary text-primary-foreground',
-				secondary: 'border-transparent bg-background-secondary text-secondary-foreground',
-				surface: 'border-transparent bg-primary-100 text-primary',
-				destructive: 'border-transparent bg-destructive text-destructive-foreground',
-				outline: 'text-foreground',
-				green: 'border-transparent bg-green-50 text-emerald-700',
-				red: 'border-transparent bg-red-50 text-red-600',
-				gray: 'border-transparent bg-zinc-100 text-zinc-950',
-				blue: 'border-transparent bg-blue-50 text-blue-600',
-				orange: 'border-transparent bg-orange-50 text-orange-600',
-			},
-		},
-		defaultVariants: {
-			variant: 'default',
-		},
-	},
-);
-
-export interface BadgeProps extends React.HTMLAttributes<HTMLDivElement>, VariantProps<typeof badgeVariants> {}
-
-function Badge({ className, variant, ...props }: BadgeProps) {
-	return <div className={cn(badgeVariants({ variant }), className)} {...props} />;
-}
-
-export { Badge, badgeVariants };
-

package/src/components/ui/breadcrumb.tsx

@@ -1,115 +0,0 @@
-import * as React from "react"
-import { Slot } from "@radix-ui/react-slot"
-import { ChevronRight, MoreHorizontal } from "lucide-react"
-
-import { cn } from "@/lib/utils"
-
-const Breadcrumb = React.forwardRef<
-  HTMLElement,
-  React.ComponentPropsWithoutRef<"nav"> & {
-    separator?: React.ReactNode
-  }
->(({ ...props }, ref) => <nav ref={ref} aria-label="breadcrumb" {...props} />)
-Breadcrumb.displayName = "Breadcrumb"
-
-const BreadcrumbList = React.forwardRef<
-  HTMLOListElement,
-  React.ComponentPropsWithoutRef<"ol">
->(({ className, ...props }, ref) => (
-  <ol
-    ref={ref}
-    className={cn(
-      "flex flex-wrap items-center gap-1.5 break-words text-sm text-muted-foreground sm:gap-2.5",
-      className
-    )}
-    {...props}
-  />
-))
-BreadcrumbList.displayName = "BreadcrumbList"
-
-const BreadcrumbItem = React.forwardRef<
-  HTMLLIElement,
-  React.ComponentPropsWithoutRef<"li">
->(({ className, ...props }, ref) => (
-  <li
-    ref={ref}
-    className={cn("inline-flex items-center gap-1.5", className)}
-    {...props}
-  />
-))
-BreadcrumbItem.displayName = "BreadcrumbItem"
-
-const BreadcrumbLink = React.forwardRef<
-  HTMLAnchorElement,
-  React.ComponentPropsWithoutRef<"a"> & {
-    asChild?: boolean
-  }
->(({ asChild, className, ...props }, ref) => {
-  const Comp = asChild ? Slot : "a"
-
-  return (
-    <Comp
-      ref={ref}
-      className={cn("transition-colors hover:text-foreground", className)}
-      {...props}
-    />
-  )
-})
-BreadcrumbLink.displayName = "BreadcrumbLink"
-
-const BreadcrumbPage = React.forwardRef<
-  HTMLSpanElement,
-  React.ComponentPropsWithoutRef<"span">
->(({ className, ...props }, ref) => (
-  <span
-    ref={ref}
-    role="link"
-    aria-disabled="true"
-    aria-current="page"
-    className={cn("font-normal text-foreground", className)}
-    {...props}
-  />
-))
-BreadcrumbPage.displayName = "BreadcrumbPage"
-
-const BreadcrumbSeparator = ({
-  children,
-  className,
-  ...props
-}: React.ComponentProps<"li">) => (
-  <li
-    role="presentation"
-    aria-hidden="true"
-    className={cn("[&>svg]:w-3.5 [&>svg]:h-3.5", className)}
-    {...props}
-  >
-    {children ?? <ChevronRight />}
-  </li>
-)
-BreadcrumbSeparator.displayName = "BreadcrumbSeparator"
-
-const BreadcrumbEllipsis = ({
-  className,
-  ...props
-}: React.ComponentProps<"span">) => (
-  <span
-    role="presentation"
-    aria-hidden="true"
-    className={cn("flex h-9 w-9 items-center justify-center", className)}
-    {...props}
-  >
-    <MoreHorizontal className="h-4 w-4" />
-    <span className="sr-only">More</span>
-  </span>
-)
-BreadcrumbEllipsis.displayName = "BreadcrumbElipssis"
-
-export {
-  Breadcrumb,
-  BreadcrumbList,
-  BreadcrumbItem,
-  BreadcrumbLink,
-  BreadcrumbPage,
-  BreadcrumbSeparator,
-  BreadcrumbEllipsis,
-}

package/src/components/ui/button.tsx

@@ -1,43 +0,0 @@
-import { Slot } from '@radix-ui/react-slot';
-import { type VariantProps, cva } from 'class-variance-authority';
-import * as React from 'react';
-import { cn } from '../../lib/utils';
-
-const buttonVariants = cva(
-	'inline-flex items-center justify-center gap-2 self-start px-4 py-2 whitespace-nowrap rounded-md text-sm font-medium 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 [&_svg]:pointer-events-none [&_svg]:size-4 [&_svg]:shrink-0',
-	{
-		variants: {
-			variant: {
-				default: 'bg-background-primary text-white hover:bg-background-primary-hover disabled:opacity-50',
-				secondary: 'bg-secondary text-secondary-foreground hover:bg-secondary-hover disabled:opacity-50',
-				destructive: 'bg-red-600 text-destructive-foreground hover:bg-destructive/90 disabled:opacity-50',
-				outline: 'border border-input bg-background hover:bg-accent hover:text-accent-foreground disabled:opacity-50',
-				ghost: 'hover:bg-accent hover:text-accent-foreground disabled:opacity-50',
-				link: 'text-primary underline-offset-4 hover:underline disabled:opacity-50',
-			},
-			size: {
-				default: 'h-10 px-4 py-2',
-				sm: 'h-9 rounded-md px-3',
-				lg: 'h-11 rounded-md px-8',
-				icon: 'h-10 w-10',
-			},
-		},
-		defaultVariants: {
-			variant: 'default',
-			size: 'default',
-		},
-	},
-);
-
-export interface ButtonProps extends React.ButtonHTMLAttributes<HTMLButtonElement>, VariantProps<typeof buttonVariants> {
-	asChild?: boolean;
-}
-
-const Button = React.forwardRef<HTMLButtonElement, ButtonProps>(({ className, variant, size, asChild = false, ...props }, ref) => {
-	const Comp = asChild ? Slot : 'button';
-	return <Comp className={cn(buttonVariants({ variant, size, className }))} ref={ref} {...props} />;
-});
-Button.displayName = 'Button';
-
-export { Button, buttonVariants };
-

package/src/components/ui/calendar.tsx

@@ -1,142 +0,0 @@
-import { ChevronDownIcon, ChevronLeftIcon, ChevronRightIcon } from 'lucide-react';
-import * as React from 'react';
-import { DayButton, DayPicker, getDefaultClassNames } from 'react-day-picker';
-import { cn } from '../../lib/utils';
-import { Button, buttonVariants } from './button';
-
-function Calendar({
-	className,
-	classNames,
-	showOutsideDays = true,
-	captionLayout = 'label',
-	buttonVariant = 'ghost',
-	formatters,
-	components,
-	...props
-}: React.ComponentProps<typeof DayPicker> & {
-	buttonVariant?: React.ComponentProps<typeof Button>['variant'];
-}) {
-	const defaultClassNames = getDefaultClassNames();
-
-	return (
-		<DayPicker
-			showOutsideDays={showOutsideDays}
-			className={cn(
-				'bg-background group/calendar p-3 [--cell-size:2rem] [[data-slot=card-content]_&]:bg-transparent [[data-slot=popover-content]_&]:bg-transparent',
-				String.raw`rtl:**:[.rdp-button\_next>svg]:rotate-180`,
-				String.raw`rtl:**:[.rdp-button\_previous>svg]:rotate-180`,
-				className,
-			)}
-			captionLayout={captionLayout}
-			formatters={{
-				formatMonthDropdown: (date) => date.toLocaleString('default', { month: 'short' }),
-				...formatters,
-			}}
-			classNames={{
-				root: cn('w-fit', defaultClassNames.root),
-				months: cn('relative flex flex-col gap-4 md:flex-row', defaultClassNames.months),
-				month: cn('flex w-full flex-col gap-4', defaultClassNames.month),
-				nav: cn('absolute inset-x-0 top-0 flex w-full items-center justify-between gap-1', defaultClassNames.nav),
-				button_previous: cn(
-					buttonVariants({ variant: buttonVariant }),
-					'h-[--cell-size] w-[--cell-size] select-none p-0 aria-disabled:opacity-50',
-					defaultClassNames.button_previous,
-				),
-				button_next: cn(
-					buttonVariants({ variant: buttonVariant }),
-					'h-[--cell-size] w-[--cell-size] select-none p-0 aria-disabled:opacity-50',
-					defaultClassNames.button_next,
-				),
-				month_caption: cn('flex h-[--cell-size] w-full items-center justify-center px-[--cell-size]', defaultClassNames.month_caption),
-				dropdowns: cn('flex h-[--cell-size] w-full items-center justify-center gap-1.5 text-sm font-medium', defaultClassNames.dropdowns),
-				dropdown_root: cn(
-					'has-focus:border-ring border-input shadow-xs has-focus:ring-ring/50 has-focus:ring-[3px] relative rounded-md border',
-					defaultClassNames.dropdown_root,
-				),
-				dropdown: cn('absolute inset-0 opacity-0', defaultClassNames.dropdown),
-				caption_label: cn(
-					'select-none font-medium',
-					captionLayout === 'label'
-						? 'text-sm'
-						: '[&>svg]:text-muted-foreground flex h-8 items-center gap-1 rounded-md pl-2 pr-1 text-sm [&>svg]:size-3.5',
-					defaultClassNames.caption_label,
-				),
-				table: 'w-full border-collapse',
-				weekdays: cn('flex', defaultClassNames.weekdays),
-				weekday: cn('text-muted-foreground flex-1 select-none rounded-md text-[0.8rem] font-normal', defaultClassNames.weekday),
-				week: cn('mt-2 flex w-full', defaultClassNames.week),
-				week_number_header: cn('w-[--cell-size] select-none', defaultClassNames.week_number_header),
-				week_number: cn('text-muted-foreground select-none text-[0.8rem]', defaultClassNames.week_number),
-				day: cn(
-					'group/day relative aspect-square h-[32px] w-[32px] select-none p-0 text-center [&:first-child[data-selected=true]_button]:rounded-l-md [&:last-child[data-selected=true]_button]:rounded-r-md',
-					defaultClassNames.day,
-				),
-				range_start: cn('bg-accent rounded-l-md', defaultClassNames.range_start),
-				range_middle: cn('rounded-none', defaultClassNames.range_middle),
-				range_end: cn('bg-accent rounded-r-md', defaultClassNames.range_end),
-				today: cn('bg-accent text-accent-foreground rounded-md data-[selected=true]:rounded-none', defaultClassNames.today),
-				outside: cn('text-muted-foreground aria-selected:text-muted-foreground', defaultClassNames.outside),
-				disabled: cn('text-muted-foreground opacity-50', defaultClassNames.disabled),
-				hidden: cn('invisible', defaultClassNames.hidden),
-				...classNames,
-			}}
-			components={{
-				Root: ({ className, rootRef, ...props }) => {
-					return <div data-slot='calendar' ref={rootRef} className={cn(className)} {...props} />;
-				},
-				Chevron: ({ className, orientation, ...props }) => {
-					if (orientation === 'left') {
-						return <ChevronLeftIcon className={cn('size-4', className)} {...props} />;
-					}
-
-					if (orientation === 'right') {
-						return <ChevronRightIcon className={cn('size-4', className)} {...props} />;
-					}
-
-					return <ChevronDownIcon className={cn('size-4', className)} {...props} />;
-				},
-				DayButton: CalendarDayButton,
-				WeekNumber: ({ children, ...props }) => {
-					return (
-						<td {...props}>
-							<div className='flex size-[--cell-size] items-center justify-center text-center'>{children}</div>
-						</td>
-					);
-				},
-				...components,
-			}}
-			{...props}
-		/>
-	);
-}
-
-function CalendarDayButton({ className, day, modifiers, ...props }: React.ComponentProps<typeof DayButton>) {
-	const defaultClassNames = getDefaultClassNames();
-
-	const ref = React.useRef<HTMLButtonElement>(null);
-	React.useEffect(() => {
-		if (modifiers.focused) ref.current?.focus();
-	}, [modifiers.focused]);
-
-	return (
-		<Button
-			ref={ref}
-			variant='ghost'
-			size='icon'
-			data-day={day.date.toLocaleDateString()}
-			data-selected-single={modifiers.selected && !modifiers.range_start && !modifiers.range_end && !modifiers.range_middle}
-			data-range-start={modifiers.range_start}
-			data-range-end={modifiers.range_end}
-			data-range-middle={modifiers.range_middle}
-			className={cn(
-				'data-[selected-single=true]:bg-background-primary data-[selected-single=true]:text-primary-foreground data-[range-middle=true]:bg-accent data-[range-middle=true]:text-accent-foreground data-[range-start=true]:bg-background-primary data-[range-start=true]:text-primary-foreground data-[range-end=true]:bg-background-primary data-[range-end=true]:text-primary-foreground group-data-[focused=true]/day:border-ring group-data-[focused=true]/day:ring-ring/50 flex aspect-square h-auto w-full min-w-[--cell-size] flex-col gap-1 font-normal leading-none data-[range-end=true]:rounded-md data-[range-middle=true]:rounded-none data-[range-start=true]:rounded-md group-data-[focused=true]/day:relative group-data-[focused=true]/day:z-10 group-data-[focused=true]/day:ring-[3px] [&>span]:text-xs [&>span]:opacity-70',
-				defaultClassNames.day,
-				className,
-			)}
-			{...props}
-		/>
-	);
-}
-
-export { Calendar, CalendarDayButton };
-

package/src/components/ui/card.tsx

@@ -1,35 +0,0 @@
-import * as React from 'react';
-import { cn } from '../../lib/utils';
-
-const Card = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('rounded-lg border bg-card text-card-foreground shadow-sm', className)} {...props} />
-));
-Card.displayName = 'Card';
-
-const CardHeader = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('flex p-6', className)} {...props} />
-));
-CardHeader.displayName = 'CardHeader';
-
-const CardTitle = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('text-2xl font-semibold leading-none tracking-tight', className)} {...props} />
-));
-CardTitle.displayName = 'CardTitle';
-
-const CardDescription = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('text-sm text-muted-foreground', className)} {...props} />
-));
-CardDescription.displayName = 'CardDescription';
-
-const CardContent = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('py-8 px-6', className)} {...props} />
-));
-CardContent.displayName = 'CardContent';
-
-const CardFooter = React.forwardRef<HTMLDivElement, React.HTMLAttributes<HTMLDivElement>>(({ className, ...props }, ref) => (
-	<div ref={ref} className={cn('flex items-center p-6', className)} {...props} />
-));
-CardFooter.displayName = 'CardFooter';
-
-export { Card, CardContent, CardDescription, CardFooter, CardHeader, CardTitle };
-