= ({
@@ -113,7 +115,7 @@ export const UpsertContactModal: FC = ({
name="continent"
render={({ field }) => (
field.onChange(v),
@@ -127,12 +129,12 @@ export const UpsertContactModal: FC = ({
- )
-}
+ );
+};
diff --git a/examples/react-query/components/continent/continent-select.tsx b/examples/react-query/components/continent/continent-select.tsx
index 00f88360..0bdac4ac 100644
--- a/examples/react-query/components/continent/continent-select.tsx
+++ b/examples/react-query/components/continent/continent-select.tsx
@@ -1,39 +1,39 @@
-import { FC } from "react"
-import * as SelectPrimitive from "@radix-ui/react-select"
-import { useQuery } from "@supabase-cache-helpers/postgrest-react-query"
-import { useSupabaseClient } from "@supabase/auth-helpers-react"
+import type * as SelectPrimitive from '@radix-ui/react-select';
+import { useQuery } from '@supabase-cache-helpers/postgrest-react-query';
+import { useSupabaseClient } from '@supabase/auth-helpers-react';
+import type { FC } from 'react';
-import { Database } from "@/types/database"
-import { cn } from "@/lib/utils"
import {
Select,
SelectContent,
SelectItem,
SelectTrigger,
SelectValue,
-} from "@/components/ui/select"
+} from '@/components/ui/select';
+import { cn } from '@/lib/utils';
+import type { Database } from '@/types/database';
export type ContinentSelectProps = {
- containerProps?: SelectPrimitive.SelectProps
- triggerProps?: SelectPrimitive.SelectTriggerProps
-}
+ containerProps?: SelectPrimitive.SelectProps;
+ triggerProps?: SelectPrimitive.SelectTriggerProps;
+};
export const ContinentSelect: FC = ({
containerProps,
triggerProps,
}) => {
- const supabase = useSupabaseClient()
+ const supabase = useSupabaseClient();
const { data, isLoading } = useQuery(
- supabase.from("continent").select("code,name")
- )
+ supabase.from('continent').select('code,name'),
+ );
- const { disabled, ...props } = containerProps
+ const { disabled, ...props } = containerProps;
return (
- )
-}
+ );
+};
diff --git a/examples/react-query/components/icons.tsx b/examples/react-query/components/icons.tsx
index 3096c11c..23d0261b 100644
--- a/examples/react-query/components/icons.tsx
+++ b/examples/react-query/components/icons.tsx
@@ -1,13 +1,13 @@
import {
Laptop,
- LucideProps,
+ type Icon as LucideIcon,
+ type LucideProps,
Moon,
SunMedium,
Twitter,
- type Icon as LucideIcon,
-} from "lucide-react"
+} from 'lucide-react';
-export type Icon = LucideIcon
+export type Icon = LucideIcon;
export const Icons = {
sun: SunMedium,
@@ -30,4 +30,4 @@ export const Icons = {
>
),
-}
+};
diff --git a/examples/react-query/components/layout.tsx b/examples/react-query/components/layout.tsx
index 8e4c3d6c..a4ba94d2 100644
--- a/examples/react-query/components/layout.tsx
+++ b/examples/react-query/components/layout.tsx
@@ -1,27 +1,27 @@
-import { useSubscriptionQuery } from "@supabase-cache-helpers/postgrest-react-query"
-import { useSupabaseClient } from "@supabase/auth-helpers-react"
+import { useSubscriptionQuery } from '@supabase-cache-helpers/postgrest-react-query';
+import { useSupabaseClient } from '@supabase/auth-helpers-react';
-import { Database } from "@/types/database"
-import { SiteHeader } from "@/components/site-header"
+import { SiteHeader } from '@/components/site-header';
+import type { Database } from '@/types/database';
interface LayoutProps {
- children: React.ReactNode
+ children: React.ReactNode;
}
export function Layout({ children }: LayoutProps) {
- const supabase = useSupabaseClient()
+ const supabase = useSupabaseClient();
useSubscriptionQuery(
supabase,
- "contacts",
- { event: "*", table: "contact", schema: "public" },
- ["id"]
- )
+ 'contacts',
+ { event: '*', table: 'contact', schema: 'public' },
+ ['id'],
+ );
return (
<>
{children}
>
- )
+ );
}
diff --git a/examples/react-query/components/main-nav.tsx b/examples/react-query/components/main-nav.tsx
index 42263b9b..1a2e4f1b 100644
--- a/examples/react-query/components/main-nav.tsx
+++ b/examples/react-query/components/main-nav.tsx
@@ -1,11 +1,8 @@
-import * as React from "react"
-import Link from "next/link"
+import Link from 'next/link';
+import * as React from 'react';
-import { NavItem } from "@/types/nav"
-import { siteConfig } from "@/config/site"
-import { cn } from "@/lib/utils"
-import { Icons } from "@/components/icons"
-import { Button } from "@/components/ui/button"
+import { Icons } from '@/components/icons';
+import { Button } from '@/components/ui/button';
import {
DropdownMenu,
DropdownMenuContent,
@@ -13,10 +10,13 @@ import {
DropdownMenuLabel,
DropdownMenuSeparator,
DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu"
+} from '@/components/ui/dropdown-menu';
+import { siteConfig } from '@/config/site';
+import { cn } from '@/lib/utils';
+import type { NavItem } from '@/types/nav';
interface MainNavProps {
- items?: NavItem[]
+ items?: NavItem[];
}
export function MainNav({ items }: MainNavProps) {
@@ -36,13 +36,13 @@ export function MainNav({ items }: MainNavProps) {
key={index}
href={item.href}
className={cn(
- "flex items-center text-lg font-semibold text-slate-600 hover:text-slate-900 dark:text-slate-100 sm:text-sm",
- item.disabled && "cursor-not-allowed opacity-80"
+ 'flex items-center text-lg font-semibold text-slate-600 hover:text-slate-900 dark:text-slate-100 sm:text-sm',
+ item.disabled && 'cursor-not-allowed opacity-80',
)}
>
{item.title}
- )
+ ),
)}
) : null}
@@ -52,7 +52,7 @@ export function MainNav({ items }: MainNavProps) {
variant="ghost"
className="-ml-4 text-base hover:bg-transparent focus:ring-0 md:hidden"
>
- {" "}
+ {' '}
Menu
@@ -73,10 +73,10 @@ export function MainNav({ items }: MainNavProps) {
{item.title}
- )
+ ),
)}
- )
+ );
}
diff --git a/examples/react-query/components/site-header.tsx b/examples/react-query/components/site-header.tsx
index 5469b004..ae62a0c2 100644
--- a/examples/react-query/components/site-header.tsx
+++ b/examples/react-query/components/site-header.tsx
@@ -1,10 +1,10 @@
-import Link from "next/link"
+import Link from 'next/link';
-import { siteConfig } from "@/config/site"
-import { Icons } from "@/components/icons"
-import { MainNav } from "@/components/main-nav"
-import { ThemeToggle } from "@/components/theme-toggle"
-import { buttonVariants } from "@/components/ui/button"
+import { Icons } from '@/components/icons';
+import { MainNav } from '@/components/main-nav';
+import { ThemeToggle } from '@/components/theme-toggle';
+import { buttonVariants } from '@/components/ui/button';
+import { siteConfig } from '@/config/site';
export function SiteHeader() {
return (
@@ -20,9 +20,9 @@ export function SiteHeader() {
>
@@ -36,9 +36,9 @@ export function SiteHeader() {
>
@@ -50,5 +50,5 @@ export function SiteHeader() {
- )
+ );
}
diff --git a/examples/react-query/components/theme-toggle.tsx b/examples/react-query/components/theme-toggle.tsx
index 9c5ae634..87606c4f 100644
--- a/examples/react-query/components/theme-toggle.tsx
+++ b/examples/react-query/components/theme-toggle.tsx
@@ -1,17 +1,17 @@
-import * as React from "react"
-import { useTheme } from "next-themes"
+import { useTheme } from 'next-themes';
+import * as React from 'react';
-import { Icons } from "@/components/icons"
-import { Button } from "@/components/ui/button"
+import { Icons } from '@/components/icons';
+import { Button } from '@/components/ui/button';
import {
DropdownMenu,
DropdownMenuContent,
DropdownMenuItem,
DropdownMenuTrigger,
-} from "@/components/ui/dropdown-menu"
+} from '@/components/ui/dropdown-menu';
export function ThemeToggle() {
- const { setTheme } = useTheme()
+ const { setTheme } = useTheme();
return (
@@ -23,19 +23,19 @@ export function ThemeToggle() {
- setTheme("light")}>
+ setTheme('light')}>
Light
- setTheme("dark")}>
+ setTheme('dark')}>
Dark
- setTheme("system")}>
+ setTheme('system')}>
System
- )
+ );
}
diff --git a/examples/react-query/components/typography/code.tsx b/examples/react-query/components/typography/code.tsx
index 2c4953cf..ff237e25 100644
--- a/examples/react-query/components/typography/code.tsx
+++ b/examples/react-query/components/typography/code.tsx
@@ -1,6 +1,6 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const Code: FC<
DetailedHTMLProps, HTMLElement>
@@ -8,12 +8,12 @@ export const Code: FC<
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/h1.tsx b/examples/react-query/components/typography/h1.tsx
index 2ab1ceef..ec643729 100644
--- a/examples/react-query/components/typography/h1.tsx
+++ b/examples/react-query/components/typography/h1.tsx
@@ -1,6 +1,6 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const H1: FC<
DetailedHTMLProps, HTMLHeadingElement>
@@ -8,12 +8,12 @@ export const H1: FC<
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/h2.tsx b/examples/react-query/components/typography/h2.tsx
index 543d0782..588a2bf2 100644
--- a/examples/react-query/components/typography/h2.tsx
+++ b/examples/react-query/components/typography/h2.tsx
@@ -1,6 +1,6 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const H2: FC<
DetailedHTMLProps, HTMLHeadingElement>
@@ -8,12 +8,12 @@ export const H2: FC<
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/h3.tsx b/examples/react-query/components/typography/h3.tsx
index ed751703..aa2a2f67 100644
--- a/examples/react-query/components/typography/h3.tsx
+++ b/examples/react-query/components/typography/h3.tsx
@@ -1,6 +1,6 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const H3: FC<
DetailedHTMLProps, HTMLHeadingElement>
@@ -8,12 +8,12 @@ export const H3: FC<
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/h4.tsx b/examples/react-query/components/typography/h4.tsx
index 54d94307..2a132747 100644
--- a/examples/react-query/components/typography/h4.tsx
+++ b/examples/react-query/components/typography/h4.tsx
@@ -1,6 +1,6 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const H4: FC<
DetailedHTMLProps, HTMLHeadingElement>
@@ -8,12 +8,12 @@ export const H4: FC<
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/p.tsx b/examples/react-query/components/typography/p.tsx
index a6cd70c2..b1ea972b 100644
--- a/examples/react-query/components/typography/p.tsx
+++ b/examples/react-query/components/typography/p.tsx
@@ -1,16 +1,16 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const P: FC<
DetailedHTMLProps, HTMLParagraphElement>
> = ({ className, children, ...props }) => {
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/small.tsx b/examples/react-query/components/typography/small.tsx
index b21e0046..f78a4f4d 100644
--- a/examples/react-query/components/typography/small.tsx
+++ b/examples/react-query/components/typography/small.tsx
@@ -1,16 +1,16 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const Small: FC<
DetailedHTMLProps, HTMLElement>
> = ({ className, children, ...props }) => {
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/typography/subtle.tsx b/examples/react-query/components/typography/subtle.tsx
index 17455843..3df4f3bd 100644
--- a/examples/react-query/components/typography/subtle.tsx
+++ b/examples/react-query/components/typography/subtle.tsx
@@ -1,16 +1,16 @@
-import { DetailedHTMLProps, FC, HTMLAttributes } from "react"
+import type { DetailedHTMLProps, FC, HTMLAttributes } from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
export const Subtle: FC<
DetailedHTMLProps, HTMLParagraphElement>
> = ({ className, children, ...props }) => {
return (
{children}
- )
-}
+ );
+};
diff --git a/examples/react-query/components/ui/accordion.tsx b/examples/react-query/components/ui/accordion.tsx
index 80c278bb..8b113d2e 100644
--- a/examples/react-query/components/ui/accordion.tsx
+++ b/examples/react-query/components/ui/accordion.tsx
@@ -1,12 +1,12 @@
-"use client"
+'use client';
-import * as React from "react"
-import * as AccordionPrimitive from "@radix-ui/react-accordion"
-import { ChevronDown } from "lucide-react"
+import * as AccordionPrimitive from '@radix-ui/react-accordion';
+import { ChevronDown } from 'lucide-react';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
-const Accordion = AccordionPrimitive.Root
+const Accordion = AccordionPrimitive.Root;
const AccordionItem = React.forwardRef<
React.ElementRef,
@@ -15,13 +15,13 @@ const AccordionItem = React.forwardRef<
-))
-AccordionItem.displayName = "AccordionItem"
+));
+AccordionItem.displayName = 'AccordionItem';
const AccordionTrigger = React.forwardRef<
React.ElementRef,
@@ -31,8 +31,8 @@ const AccordionTrigger = React.forwardRef<
svg]:rotate-180",
- className
+ 'flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline [&[data-state=open]>svg]:rotate-180',
+ className,
)}
{...props}
>
@@ -40,8 +40,8 @@ const AccordionTrigger = React.forwardRef<
-))
-AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName
+));
+AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName;
const AccordionContent = React.forwardRef<
React.ElementRef,
@@ -50,14 +50,14 @@ const AccordionContent = React.forwardRef<
{children}
-))
-AccordionContent.displayName = AccordionPrimitive.Content.displayName
+));
+AccordionContent.displayName = AccordionPrimitive.Content.displayName;
-export { Accordion, AccordionItem, AccordionTrigger, AccordionContent }
+export { Accordion, AccordionItem, AccordionTrigger, AccordionContent };
diff --git a/examples/react-query/components/ui/alert-dialog.tsx b/examples/react-query/components/ui/alert-dialog.tsx
index 909dd744..adbc5cc4 100644
--- a/examples/react-query/components/ui/alert-dialog.tsx
+++ b/examples/react-query/components/ui/alert-dialog.tsx
@@ -1,13 +1,13 @@
-"use client"
+'use client';
-import * as React from "react"
-import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog"
+import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
-const AlertDialog = AlertDialogPrimitive.Root
+const AlertDialog = AlertDialogPrimitive.Root;
-const AlertDialogTrigger = AlertDialogPrimitive.Trigger
+const AlertDialogTrigger = AlertDialogPrimitive.Trigger;
const AlertDialogPortal = ({
className,
@@ -19,8 +19,8 @@ const AlertDialogPortal = ({
{children}
-)
-AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName
+);
+AlertDialogPortal.displayName = AlertDialogPrimitive.Portal.displayName;
const AlertDialogOverlay = React.forwardRef<
React.ElementRef,
@@ -28,14 +28,14 @@ const AlertDialogOverlay = React.forwardRef<
>(({ className, children, ...props }, ref) => (
-))
-AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName
+));
+AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName;
const AlertDialogContent = React.forwardRef<
React.ElementRef,
@@ -46,15 +46,15 @@ const AlertDialogContent = React.forwardRef<
-))
-AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName
+));
+AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName;
const AlertDialogHeader = ({
className,
@@ -62,13 +62,13 @@ const AlertDialogHeader = ({
}: React.HTMLAttributes) => (
-)
-AlertDialogHeader.displayName = "AlertDialogHeader"
+);
+AlertDialogHeader.displayName = 'AlertDialogHeader';
const AlertDialogFooter = ({
className,
@@ -76,13 +76,13 @@ const AlertDialogFooter = ({
}: React.HTMLAttributes) => (
-)
-AlertDialogFooter.displayName = "AlertDialogFooter"
+);
+AlertDialogFooter.displayName = 'AlertDialogFooter';
const AlertDialogTitle = React.forwardRef<
React.ElementRef,
@@ -91,14 +91,14 @@ const AlertDialogTitle = React.forwardRef<
-))
-AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName
+));
+AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName;
const AlertDialogDescription = React.forwardRef<
React.ElementRef,
@@ -106,12 +106,12 @@ const AlertDialogDescription = React.forwardRef<
>(({ className, ...props }, ref) => (
-))
+));
AlertDialogDescription.displayName =
- AlertDialogPrimitive.Description.displayName
+ AlertDialogPrimitive.Description.displayName;
const AlertDialogAction = React.forwardRef<
React.ElementRef,
@@ -120,13 +120,13 @@ const AlertDialogAction = React.forwardRef<
-))
-AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName
+));
+AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName;
const AlertDialogCancel = React.forwardRef<
React.ElementRef,
@@ -135,13 +135,13 @@ const AlertDialogCancel = React.forwardRef<
-))
-AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName
+));
+AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName;
export {
AlertDialog,
@@ -153,4 +153,4 @@ export {
AlertDialogDescription,
AlertDialogAction,
AlertDialogCancel,
-}
+};
diff --git a/examples/react-query/components/ui/aspect-ratio.tsx b/examples/react-query/components/ui/aspect-ratio.tsx
index d6a5226f..aaabffbc 100644
--- a/examples/react-query/components/ui/aspect-ratio.tsx
+++ b/examples/react-query/components/ui/aspect-ratio.tsx
@@ -1,7 +1,7 @@
-"use client"
+'use client';
-import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio"
+import * as AspectRatioPrimitive from '@radix-ui/react-aspect-ratio';
-const AspectRatio = AspectRatioPrimitive.Root
+const AspectRatio = AspectRatioPrimitive.Root;
-export { AspectRatio }
+export { AspectRatio };
diff --git a/examples/react-query/components/ui/avatar.tsx b/examples/react-query/components/ui/avatar.tsx
index f06eb326..336bbdd9 100644
--- a/examples/react-query/components/ui/avatar.tsx
+++ b/examples/react-query/components/ui/avatar.tsx
@@ -1,9 +1,9 @@
-"use client"
+'use client';
-import * as React from "react"
-import * as AvatarPrimitive from "@radix-ui/react-avatar"
+import * as AvatarPrimitive from '@radix-ui/react-avatar';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
const Avatar = React.forwardRef<
React.ElementRef,
@@ -12,13 +12,13 @@ const Avatar = React.forwardRef<
-))
-Avatar.displayName = AvatarPrimitive.Root.displayName
+));
+Avatar.displayName = AvatarPrimitive.Root.displayName;
const AvatarImage = React.forwardRef<
React.ElementRef,
@@ -26,11 +26,11 @@ const AvatarImage = React.forwardRef<
>(({ className, ...props }, ref) => (
-))
-AvatarImage.displayName = AvatarPrimitive.Image.displayName
+));
+AvatarImage.displayName = AvatarPrimitive.Image.displayName;
const AvatarFallback = React.forwardRef<
React.ElementRef,
@@ -39,12 +39,12 @@ const AvatarFallback = React.forwardRef<
-))
-AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName
+));
+AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName;
-export { Avatar, AvatarImage, AvatarFallback }
+export { Avatar, AvatarImage, AvatarFallback };
diff --git a/examples/react-query/components/ui/button.tsx b/examples/react-query/components/ui/button.tsx
index 69e03618..12cbb088 100644
--- a/examples/react-query/components/ui/button.tsx
+++ b/examples/react-query/components/ui/button.tsx
@@ -1,37 +1,37 @@
-import * as React from "react"
-import { cva, VariantProps } from "class-variance-authority"
+import { type VariantProps, cva } from 'class-variance-authority';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
const buttonVariants = cva(
- "active:scale-95 inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 dark:hover:bg-slate-800 dark:hover:text-slate-100 disabled:opacity-50 dark:focus:ring-slate-400 disabled:pointer-events-none dark:focus:ring-offset-slate-900 data-[state=open]:bg-slate-100 dark:data-[state=open]:bg-slate-800",
+ 'active:scale-95 inline-flex items-center justify-center rounded-md text-sm font-medium transition-colors focus:outline-none focus:ring-2 focus:ring-slate-400 focus:ring-offset-2 dark:hover:bg-slate-800 dark:hover:text-slate-100 disabled:opacity-50 dark:focus:ring-slate-400 disabled:pointer-events-none dark:focus:ring-offset-slate-900 data-[state=open]:bg-slate-100 dark:data-[state=open]:bg-slate-800',
{
variants: {
variant: {
default:
- "bg-slate-900 text-white hover:bg-slate-700 dark:bg-slate-50 dark:text-slate-900",
+ 'bg-slate-900 text-white hover:bg-slate-700 dark:bg-slate-50 dark:text-slate-900',
destructive:
- "bg-red-500 text-white hover:bg-red-600 dark:hover:bg-red-600",
+ 'bg-red-500 text-white hover:bg-red-600 dark:hover:bg-red-600',
outline:
- "bg-transparent border border-slate-200 hover:bg-slate-100 dark:border-slate-700 dark:text-slate-100",
+ 'bg-transparent border border-slate-200 hover:bg-slate-100 dark:border-slate-700 dark:text-slate-100',
subtle:
- "bg-slate-100 text-slate-900 hover:bg-slate-200 dark:bg-slate-700 dark:text-slate-100",
+ 'bg-slate-100 text-slate-900 hover:bg-slate-200 dark:bg-slate-700 dark:text-slate-100',
ghost:
- "bg-transparent hover:bg-slate-100 dark:hover:bg-slate-800 dark:text-slate-100 dark:hover:text-slate-100 data-[state=open]:bg-transparent dark:data-[state=open]:bg-transparent",
- link: "bg-transparent dark:bg-transparent underline-offset-4 hover:underline text-slate-900 dark:text-slate-100 hover:bg-transparent dark:hover:bg-transparent",
+ 'bg-transparent hover:bg-slate-100 dark:hover:bg-slate-800 dark:text-slate-100 dark:hover:text-slate-100 data-[state=open]:bg-transparent dark:data-[state=open]:bg-transparent',
+ link: 'bg-transparent dark:bg-transparent underline-offset-4 hover:underline text-slate-900 dark:text-slate-100 hover:bg-transparent dark:hover:bg-transparent',
},
size: {
- default: "h-10 py-2 px-4",
- sm: "h-9 px-2 rounded-md",
- lg: "h-11 px-8 rounded-md",
+ default: 'h-10 py-2 px-4',
+ sm: 'h-9 px-2 rounded-md',
+ lg: 'h-11 px-8 rounded-md',
},
},
defaultVariants: {
- variant: "default",
- size: "default",
+ variant: 'default',
+ size: 'default',
},
- }
-)
+ },
+);
export interface ButtonProps
extends React.ButtonHTMLAttributes,
@@ -45,9 +45,9 @@ const Button = React.forwardRef(
ref={ref}
{...props}
/>
- )
- }
-)
-Button.displayName = "Button"
+ );
+ },
+);
+Button.displayName = 'Button';
-export { Button, buttonVariants }
+export { Button, buttonVariants };
diff --git a/examples/react-query/components/ui/checkbox.tsx b/examples/react-query/components/ui/checkbox.tsx
index 3d395ea7..c6020a2f 100644
--- a/examples/react-query/components/ui/checkbox.tsx
+++ b/examples/react-query/components/ui/checkbox.tsx
@@ -1,10 +1,10 @@
-"use client"
+'use client';
-import * as React from "react"
-import * as CheckboxPrimitive from "@radix-ui/react-checkbox"
-import { Check } from "lucide-react"
+import * as CheckboxPrimitive from '@radix-ui/react-checkbox';
+import { Check } from 'lucide-react';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
+import { cn } from '@/lib/utils';
const Checkbox = React.forwardRef<
React.ElementRef,
@@ -13,18 +13,18 @@ const Checkbox = React.forwardRef<
-))
-Checkbox.displayName = CheckboxPrimitive.Root.displayName
+));
+Checkbox.displayName = CheckboxPrimitive.Root.displayName;
-export { Checkbox }
+export { Checkbox };
diff --git a/examples/react-query/components/ui/collapsible.tsx b/examples/react-query/components/ui/collapsible.tsx
index 9fa48946..86ab87d8 100644
--- a/examples/react-query/components/ui/collapsible.tsx
+++ b/examples/react-query/components/ui/collapsible.tsx
@@ -1,11 +1,11 @@
-"use client"
+'use client';
-import * as CollapsiblePrimitive from "@radix-ui/react-collapsible"
+import * as CollapsiblePrimitive from '@radix-ui/react-collapsible';
-const Collapsible = CollapsiblePrimitive.Root
+const Collapsible = CollapsiblePrimitive.Root;
-const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger
+const CollapsibleTrigger = CollapsiblePrimitive.CollapsibleTrigger;
-const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent
+const CollapsibleContent = CollapsiblePrimitive.CollapsibleContent;
-export { Collapsible, CollapsibleTrigger, CollapsibleContent }
+export { Collapsible, CollapsibleTrigger, CollapsibleContent };
diff --git a/examples/react-query/components/ui/command.tsx b/examples/react-query/components/ui/command.tsx
index fc6a1040..ca0d721a 100644
--- a/examples/react-query/components/ui/command.tsx
+++ b/examples/react-query/components/ui/command.tsx
@@ -1,12 +1,12 @@
-"use client"
+'use client';
-import * as React from "react"
-import { DialogProps } from "@radix-ui/react-dialog"
-import { Command as CommandPrimitive, useCommandState } from "cmdk"
-import { ChevronsUpDown, Search } from "lucide-react"
+import type { DialogProps } from '@radix-ui/react-dialog';
+import { Command as CommandPrimitive, useCommandState } from 'cmdk';
+import { ChevronsUpDown, Search } from 'lucide-react';
+import * as React from 'react';
-import { cn } from "@/lib/utils"
-import { Dialog, DialogContent } from "@/components/ui/dialog"
+import { Dialog, DialogContent } from '@/components/ui/dialog';
+import { cn } from '@/lib/utils';
const Command = React.forwardRef<
React.ElementRef,
@@ -15,13 +15,13 @@ const Command = React.forwardRef<
-))
-Command.displayName = CommandPrimitive.displayName
+));
+Command.displayName = CommandPrimitive.displayName;
interface CommandDialogProps extends DialogProps {}
@@ -34,8 +34,8 @@ const CommandDialog = ({ children, ...props }: CommandDialogProps) => {