fix: import the React types the declarations annotate props with

src/components/ActionDropdown/ActionDropdown.spec.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { render, screen } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 

src/components/Checkbox/Checkbox.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
 import { CheckIcon } from 'lucide-react';
 

src/components/DataTable/DataTableHead.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { ACTIONS_COLUMN_ID } from './constants.ts';
 import { useDataTableHandle } from './hooks.ts';
 import { flexRender } from './utils.tsx';

src/components/DataTable/store.ts

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import {
   createTable,
   getCoreRowModel,

src/components/DataTable/utils.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import type {
   ColumnDef,
   ColumnPinningState,

src/components/DatePicker/Calendar.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { range } from 'lodash-es';
 import { AnimatePresence, motion } from 'motion/react';
 

src/components/DropdownButton/DropdownButton.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { ChevronDownIcon } from 'lucide-react';
 
 import { cn } from '#utils';

src/components/DropdownMenu/DropdownMenuCheckboxItem.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { CheckIcon } from 'lucide-react';
 

src/components/DropdownMenu/DropdownMenuItem.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 import { cn } from '#utils';

src/components/DropdownMenu/DropdownMenuLabel.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 import { cn } from '#utils';

src/components/DropdownMenu/DropdownMenuRadioItem.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { CheckIcon } from 'lucide-react';
 

src/components/DropdownMenu/DropdownMenuSeparator.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 import { cn } from '#utils';

src/components/DropdownMenu/DropdownMenuSubContent.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 
 import { cn } from '#utils';

src/components/DropdownMenu/DropdownMenuSubTrigger.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as DropdownMenuPrimitive from '@radix-ui/react-dropdown-menu';
 import { ChevronRightIcon } from 'lucide-react';
 

src/components/Form/Form.stories.tsx

@@ -1,5 +1,6 @@
 /* eslint-disable perfectionist/sort-objects */
 
+import type React from 'react';
 import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 
 import { filterObject, sleep } from '@douglasneuroinformatics/libjs';

src/components/Form/Form.tsx

@@ -1,3 +1,4 @@
+import type React from 'react';
 import { Fragment, useEffect, useState } from 'react';
 
 import type { ZodErrorLike, ZodTypeLike } from '@douglasneuroinformatics/libjs';

src/components/Form/NumberField/NumberFieldInput.tsx

@@ -1,3 +1,4 @@
+import type React from 'react';
 import { useEffect, useId, useRef, useState } from 'react';
 
 import { parseNumber } from '@douglasneuroinformatics/libjs';

src/components/HoverCard/HoverCardContent.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Content } from '@radix-ui/react-hover-card';
 
 import { cn } from '#utils';

src/components/Label/Label.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as LabelPrimitive from '@radix-ui/react-label';
 import { cva } from 'class-variance-authority';
 import type { VariantProps } from 'class-variance-authority';

src/components/OneTimePasswordInput/OneTimePasswordInput.spec.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { render, screen } from '@testing-library/react';
 import { describe, expect, it } from 'vitest';
 

src/components/RadioGroup/RadioGroupItem.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Indicator, Item } from '@radix-ui/react-radio-group';
 import { CircleIcon } from 'lucide-react';
 

src/components/ScrollArea/ScrollArea.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Corner, Root, Scrollbar, Thumb, Viewport } from '@radix-ui/react-scroll-area';
 
 import { cn } from '#utils';

src/components/Select/SelectContent.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 
 import { cn } from '#utils';

src/components/Select/SelectItem.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { CheckIcon } from 'lucide-react';
 

src/components/Select/SelectLabel.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 
 import { cn } from '#utils';

src/components/Select/SelectScrollDownButton.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { ChevronDownIcon } from 'lucide-react';
 

src/components/Select/SelectScrollUpButton.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 import { ChevronUpIcon } from 'lucide-react';
 

src/components/Select/SelectSeparator.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 
 import { cn } from '#utils';

src/components/Select/SelectTrigger.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SelectPrimitive from '@radix-ui/react-select';
 
 import { DropdownButton } from '../DropdownButton/DropdownButton.tsx';

src/components/Separator/Separator.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as SeparatorPrimitive from '@radix-ui/react-separator';
 
 import { cn } from '#utils';

src/components/Sheet/SheetDescription.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Description } from '@radix-ui/react-dialog';
 
 import { cn } from '#utils';

src/components/Sheet/SheetOverlay.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Overlay } from '@radix-ui/react-dialog';
 
 import { cn } from '#utils';

src/components/Sheet/SheetTitle.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Title } from '@radix-ui/react-dialog';
 
 import { cn } from '#utils';

src/components/Slider/Slider.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Range, Root, Thumb, Track } from '@radix-ui/react-slider';
 
 import { cn } from '#utils';

src/components/Table/TableBody.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableBody = ({ className, ref, ...props }: React.ComponentProps<'tbody'>) => {

src/components/Table/TableCaption.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableCaption = ({ className, ref, ...props }: React.ComponentProps<'caption'>) => {

src/components/Table/TableCell.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableCell = ({ className, ref, ...props }: React.ComponentProps<'td'>) => {

src/components/Table/TableFooter.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableFooter = ({ className, ref, ...props }: React.ComponentProps<'tfoot'>) => {

src/components/Table/TableHead.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableHead = ({ className, ref, ...props }: React.ComponentProps<'th'>) => {

src/components/Table/TableHeader.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableHeader = ({ className, ref, ...props }: React.ComponentProps<'thead'>) => {

src/components/Table/TableRoot.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableRoot = ({ className, ref, ...props }: React.ComponentProps<'table'>) => {

src/components/Table/TableRow.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { cn } from '#utils';
 
 export const TableRow = ({ className, ref, ...props }: React.ComponentProps<'tr'>) => {

src/components/Tabs/TabsContent.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 
 import { cn } from '#utils';

src/components/Tabs/TabsList.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 
 import { cn } from '#utils';

src/components/Tabs/TabsRoot.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Root } from '@radix-ui/react-tabs';
 
 export const TabsRoot = ({ ref, ...props }: React.ComponentProps<typeof Root>) => {

src/components/Tabs/TabsTrigger.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import * as TabsPrimitive from '@radix-ui/react-tabs';
 
 import { cn } from '#utils';

src/components/Tooltip/TooltipTrigger.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { Trigger } from '@radix-ui/react-tooltip';
 
 import { Button } from '../Button/Button.tsx';

src/providers/CoreProvider/CoreProvider.stories.tsx

@@ -1,3 +1,4 @@
+import type React from 'react';
 import { useState } from 'react';
 
 import type { Meta, StoryObj } from '@storybook/react-vite';

src/providers/CoreProvider/CoreProvider.tsx

@@ -1,3 +1,5 @@
+import type React from 'react';
+
 import { DestructiveActionDialog } from './DestructiveActionDialog.tsx';
 import { NotificationHub } from './NotificationHub.tsx';