@@ -55,8 +55,8 @@ const CommandInput = React.forwardRef<
CommandInput.displayName = CommandPrimitive.Input.displayName;
-const CommandList = React.forwardRef<
- React.ElementRef
,
+const CommandList = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const CommandEmpty = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>((props, ref) => (
,
+const CommandGroup = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const CommandSeparator = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const CommandItem = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DialogOverlay = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DialogContent = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, children, ...props }, ref) => (
@@ -80,8 +80,8 @@ const DialogFooter = ({
);
DialogFooter.displayName = 'DialogFooter';
-const DialogTitle = React.forwardRef<
- React.ElementRef,
+const DialogTitle = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DialogDescription = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DrawerOverlay = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DrawerContent = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, children, ...props }, ref) => (
@@ -77,8 +77,8 @@ const DrawerFooter = ({
);
DrawerFooter.displayName = 'DrawerFooter';
-const DrawerTitle = React.forwardRef<
- React.ElementRef,
+const DrawerTitle = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DrawerDescription = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DropdownMenuSubTrigger = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef & {
inset?: boolean;
}
@@ -40,8 +40,8 @@ const DropdownMenuSubTrigger = React.forwardRef<
DropdownMenuSubTrigger.displayName =
DropdownMenuPrimitive.SubTrigger.displayName;
-const DropdownMenuSubContent = React.forwardRef<
- React.ElementRef,
+const DropdownMenuSubContent = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
,
+const DropdownMenuContent = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, sideOffset = 4, ...props }, ref) => (
@@ -74,8 +74,8 @@ const DropdownMenuContent = React.forwardRef<
));
DropdownMenuContent.displayName = DropdownMenuPrimitive.Content.displayName;
-const DropdownMenuItem = React.forwardRef<
- React.ElementRef,
+const DropdownMenuItem = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef & {
inset?: boolean;
}
@@ -92,8 +92,8 @@ const DropdownMenuItem = React.forwardRef<
));
DropdownMenuItem.displayName = DropdownMenuPrimitive.Item.displayName;
-const DropdownMenuCheckboxItem = React.forwardRef<
- React.ElementRef,
+const DropdownMenuCheckboxItem = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, children, checked, ...props }, ref) => (
,
+const DropdownMenuRadioItem = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, children, ...props }, ref) => (
,
+const DropdownMenuLabel = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef & {
inset?: boolean;
}
@@ -156,8 +156,8 @@ const DropdownMenuLabel = React.forwardRef<
));
DropdownMenuLabel.displayName = DropdownMenuPrimitive.Label.displayName;
-const DropdownMenuSeparator = React.forwardRef<
- React.ElementRef,
+const DropdownMenuSeparator = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef
>(({ className, ...props }, ref) => (
(
+const FormItemContext = createContext(
{} as FormItemContextValue,
);
@@ -73,7 +73,7 @@ const FormItem = ({
errors,
...props
}: React.HTMLAttributes & { errors: ValidationError[] }) => {
- const id = React.useId();
+ const id = useId();
return (
@@ -83,7 +83,7 @@ const FormItem = ({
};
const useFormItem = () => {
- const itemContext = React.useContext(FormItemContext);
+ const itemContext = useContext(FormItemContext);
if (!itemContext) {
throw new Error('useFormField should be used within ');
diff --git a/src/components/ui/Input.tsx b/src/components/ui/Input.tsx
index 18d6b46..f2f405b 100644
--- a/src/components/ui/Input.tsx
+++ b/src/components/ui/Input.tsx
@@ -1,10 +1,10 @@
-import * as React from 'react';
+import { forwardRef } from 'react';
import { cx } from '@/lib/utils';
export type InputProps = React.InputHTMLAttributes;
-const Input = React.forwardRef(
+const Input = forwardRef(
({ className, type, ...props }, ref) => {
return (
,
+const Label = forwardRef<
+ React.ComponentRef,
React.ComponentPropsWithoutRef &
VariantProps
>(({ className, ...props }, ref) => (
diff --git a/src/components/ui/Pagination.tsx b/src/components/ui/Pagination.tsx
index 1bfeb6f..0c3e30b 100644
--- a/src/components/ui/Pagination.tsx
+++ b/src/components/ui/Pagination.tsx
@@ -5,7 +5,7 @@ import {
ChevronRightIcon,
MoreHorizontalIcon,
} from 'lucide-react';
-import * as React from 'react';
+import { forwardRef } from 'react';
const Pagination = ({ className, ...props }: React.ComponentProps<'nav'>) => (