diff --git a/apps/web/components/root-providers.tsx b/apps/web/components/root-providers.tsx index 4d1d7068d..fcc3fa4a0 100644 --- a/apps/web/components/root-providers.tsx +++ b/apps/web/components/root-providers.tsx @@ -4,7 +4,6 @@ import { useMemo } from 'react'; import dynamic from 'next/dynamic'; -import { ReactQueryStreamedHydration } from '@tanstack/react-query-next-experimental'; import { ThemeProvider } from 'next-themes'; import { CaptchaProvider } from '@kit/auth/captcha/client'; @@ -53,29 +52,27 @@ export function RootProviders({ - - - - + + + - - - {children} - - - + + + {children} + + + - - - - - + + + + diff --git a/apps/web/package.json b/apps/web/package.json index 8ebabd7f3..f31345aa6 100644 --- a/apps/web/package.json +++ b/apps/web/package.json @@ -57,7 +57,6 @@ "@radix-ui/react-icons": "^1.3.0", "@supabase/supabase-js": "^2.45.3", "@tanstack/react-query": "5.52.2", - "@tanstack/react-query-next-experimental": "^5.53.1", "@tanstack/react-table": "^8.20.5", "date-fns": "^3.6.0", "lucide-react": "^0.438.0", diff --git a/packages/ui/README.md b/packages/ui/README.md index deeb6840c..7a1e388bc 100644 --- a/packages/ui/README.md +++ b/packages/ui/README.md @@ -12,13 +12,11 @@ This package define two sets of components: To install a Shadcn UI component, you can use the following command in the root of the repository: ```bash -npx shadcn-ui@latest add --path=packages/ui/src/shadcn +npx shadcn@latest add -c packages/ui ``` For example, to install the `Button` component, you can use the following command: ```bash -npx shadcn-ui@latest add button --path=packages/ui/src/shadcn -``` - -We pass the `--path` flag to specify the path where the component should be installed. \ No newline at end of file +npx shadcn-ui@latest add button -c packages/ui +``` \ No newline at end of file diff --git a/components.json b/packages/ui/components.json similarity index 51% rename from components.json rename to packages/ui/components.json index b282fe339..7906bed9e 100644 --- a/components.json +++ b/packages/ui/components.json @@ -4,14 +4,17 @@ "rsc": true, "tsx": true, "tailwind": { - "config": "tailwind.config.js", - "css": "app/globals.css", + "config": "./tailwind.config.ts", + "css": "../../apps/web/styles/globals.css", "baseColor": "slate", "cssVariables": true, "prefix": "" }, "aliases": { - "components": "@kit/ui", - "utils": "@kit/ui/utils" + "components": "~components", + "utils": "~utils", + "lib": "~lib", + "hooks": "~hooks", + "ui": "~ui" } -} \ No newline at end of file +} diff --git a/packages/ui/package.json b/packages/ui/package.json index 514df2908..4a3fbde81 100644 --- a/packages/ui/package.json +++ b/packages/ui/package.json @@ -34,7 +34,8 @@ "lucide-react": "^0.438.0", "react-top-loading-bar": "2.3.1", "recharts": "^2.12.7", - "tailwind-merge": "^2.5.2" + "tailwind-merge": "^2.5.2", + "vaul": "^0.9.1" }, "devDependencies": { "@kit/eslint-config": "workspace:*", @@ -103,7 +104,7 @@ "./switch": "./src/shadcn/switch.tsx", "./breadcrumb": "./src/shadcn/breadcrumb.tsx", "./chart": "./src/shadcn/chart.tsx", - "./utils": "./src/utils/index.ts", + "./utils": "./src/lib/utils/index.ts", "./if": "./src/makerkit/if.tsx", "./trans": "./src/makerkit/trans.tsx", "./divider": "./src/makerkit/divider.tsx", diff --git a/packages/ui/src/utils/cn.ts b/packages/ui/src/lib/utils/cn.ts similarity index 100% rename from packages/ui/src/utils/cn.ts rename to packages/ui/src/lib/utils/cn.ts diff --git a/packages/ui/src/utils/index.ts b/packages/ui/src/lib/utils/index.ts similarity index 100% rename from packages/ui/src/utils/index.ts rename to packages/ui/src/lib/utils/index.ts diff --git a/packages/ui/src/utils/is-route-active.ts b/packages/ui/src/lib/utils/is-route-active.ts similarity index 100% rename from packages/ui/src/utils/is-route-active.ts rename to packages/ui/src/lib/utils/is-route-active.ts diff --git a/packages/ui/src/makerkit/bordered-navigation-menu.tsx b/packages/ui/src/makerkit/bordered-navigation-menu.tsx index b6ea29014..4c6b5646a 100644 --- a/packages/ui/src/makerkit/bordered-navigation-menu.tsx +++ b/packages/ui/src/makerkit/bordered-navigation-menu.tsx @@ -3,13 +3,13 @@ import Link from 'next/link'; import { usePathname } from 'next/navigation'; +import { cn, isRouteActive } from '../lib/utils'; import { Button } from '../shadcn/button'; import { NavigationMenu, NavigationMenuItem, NavigationMenuList, } from '../shadcn/navigation-menu'; -import { cn, isRouteActive } from '../utils'; import { Trans } from './trans'; export function BorderedNavigationMenu(props: React.PropsWithChildren) { diff --git a/packages/ui/src/makerkit/card-button.tsx b/packages/ui/src/makerkit/card-button.tsx index 6df8872b8..9a5189531 100644 --- a/packages/ui/src/makerkit/card-button.tsx +++ b/packages/ui/src/makerkit/card-button.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import { Slot, Slottable } from '@radix-ui/react-slot'; import { ChevronRight } from 'lucide-react'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; export const CardButton = React.forwardRef< HTMLButtonElement, diff --git a/packages/ui/src/makerkit/divider.tsx b/packages/ui/src/makerkit/divider.tsx index 9ffe1b54d..3c338dfdd 100644 --- a/packages/ui/src/makerkit/divider.tsx +++ b/packages/ui/src/makerkit/divider.tsx @@ -1,4 +1,4 @@ -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; export function Divider(props: { className?: string }) { return
; diff --git a/packages/ui/src/makerkit/empty-state.tsx b/packages/ui/src/makerkit/empty-state.tsx index dba3bf134..10234a4aa 100644 --- a/packages/ui/src/makerkit/empty-state.tsx +++ b/packages/ui/src/makerkit/empty-state.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { cn } from '../lib/utils'; import { Button } from '../shadcn/button'; -import { cn } from '../utils'; const EmptyStateHeading = React.forwardRef< HTMLHeadingElement, diff --git a/packages/ui/src/makerkit/image-upload-input.tsx b/packages/ui/src/makerkit/image-upload-input.tsx index 2da63b32b..edca89f40 100644 --- a/packages/ui/src/makerkit/image-upload-input.tsx +++ b/packages/ui/src/makerkit/image-upload-input.tsx @@ -7,9 +7,9 @@ import Image from 'next/image'; import { UploadCloud, X } from 'lucide-react'; +import { cn } from '../lib/utils'; import { Button } from '../shadcn/button'; import { Label } from '../shadcn/label'; -import { cn } from '../utils'; import { If } from './if'; type Props = Omit, 'value'> & { diff --git a/packages/ui/src/makerkit/loading-overlay.tsx b/packages/ui/src/makerkit/loading-overlay.tsx index 4974f0a92..ac1356fce 100644 --- a/packages/ui/src/makerkit/loading-overlay.tsx +++ b/packages/ui/src/makerkit/loading-overlay.tsx @@ -1,6 +1,6 @@ import type { PropsWithChildren } from 'react'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; import { Spinner } from './spinner'; export function LoadingOverlay({ diff --git a/packages/ui/src/makerkit/marketing/cta-button.tsx b/packages/ui/src/makerkit/marketing/cta-button.tsx index c5c704312..e8323a4f1 100644 --- a/packages/ui/src/makerkit/marketing/cta-button.tsx +++ b/packages/ui/src/makerkit/marketing/cta-button.tsx @@ -1,7 +1,7 @@ import { forwardRef } from 'react'; +import { cn } from '../../lib/utils'; import { Button } from '../../shadcn/button'; -import { cn } from '../../utils'; export const CtaButton = forwardRef< HTMLButtonElement, diff --git a/packages/ui/src/makerkit/marketing/feature-card.tsx b/packages/ui/src/makerkit/marketing/feature-card.tsx index 66d16a4c7..095a93fb6 100644 --- a/packages/ui/src/makerkit/marketing/feature-card.tsx +++ b/packages/ui/src/makerkit/marketing/feature-card.tsx @@ -1,12 +1,12 @@ import React, { forwardRef } from 'react'; +import { cn } from '../../lib/utils'; import { CardContent, CardDescription, CardHeader, CardTitle, } from '../../shadcn/card'; -import { cn } from '../../utils'; interface FeatureCardProps extends React.HTMLAttributes { label: string; diff --git a/packages/ui/src/makerkit/marketing/feature-grid.tsx b/packages/ui/src/makerkit/marketing/feature-grid.tsx index c7947271b..f5fda36e6 100644 --- a/packages/ui/src/makerkit/marketing/feature-grid.tsx +++ b/packages/ui/src/makerkit/marketing/feature-grid.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; export const FeatureGrid = forwardRef< HTMLDivElement, diff --git a/packages/ui/src/makerkit/marketing/feature-showcase.tsx b/packages/ui/src/makerkit/marketing/feature-showcase.tsx index 33a2405ab..485162ddd 100644 --- a/packages/ui/src/makerkit/marketing/feature-showcase.tsx +++ b/packages/ui/src/makerkit/marketing/feature-showcase.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; interface FeatureShowcaseProps extends React.HTMLAttributes { heading: React.ReactNode; diff --git a/packages/ui/src/makerkit/marketing/footer.tsx b/packages/ui/src/makerkit/marketing/footer.tsx index 7dcde1740..abae76206 100644 --- a/packages/ui/src/makerkit/marketing/footer.tsx +++ b/packages/ui/src/makerkit/marketing/footer.tsx @@ -1,6 +1,6 @@ import { forwardRef } from 'react'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; interface FooterSection { heading: React.ReactNode; diff --git a/packages/ui/src/makerkit/marketing/gradient-secondary-text.tsx b/packages/ui/src/makerkit/marketing/gradient-secondary-text.tsx index 46dc26cd4..96709e3e6 100644 --- a/packages/ui/src/makerkit/marketing/gradient-secondary-text.tsx +++ b/packages/ui/src/makerkit/marketing/gradient-secondary-text.tsx @@ -2,7 +2,7 @@ import { forwardRef } from 'react'; import { Slot, Slottable } from '@radix-ui/react-slot'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; export const GradientSecondaryText = forwardRef< HTMLSpanElement, diff --git a/packages/ui/src/makerkit/marketing/gradient-text.tsx b/packages/ui/src/makerkit/marketing/gradient-text.tsx index 1707040fa..73f139c53 100644 --- a/packages/ui/src/makerkit/marketing/gradient-text.tsx +++ b/packages/ui/src/makerkit/marketing/gradient-text.tsx @@ -1,6 +1,6 @@ import React, { forwardRef } from 'react'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; export const GradientText = forwardRef< HTMLSpanElement, diff --git a/packages/ui/src/makerkit/marketing/header.tsx b/packages/ui/src/makerkit/marketing/header.tsx index e970790d8..8f0562ec6 100644 --- a/packages/ui/src/makerkit/marketing/header.tsx +++ b/packages/ui/src/makerkit/marketing/header.tsx @@ -1,6 +1,6 @@ import { forwardRef } from 'react'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; interface HeaderProps extends React.HTMLAttributes { logo?: React.ReactNode; diff --git a/packages/ui/src/makerkit/marketing/hero-title.tsx b/packages/ui/src/makerkit/marketing/hero-title.tsx index 94352d699..b7fcb8109 100644 --- a/packages/ui/src/makerkit/marketing/hero-title.tsx +++ b/packages/ui/src/makerkit/marketing/hero-title.tsx @@ -2,7 +2,7 @@ import { forwardRef } from 'react'; import { Slot, Slottable } from '@radix-ui/react-slot'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; export const HeroTitle = forwardRef< HTMLHeadingElement, diff --git a/packages/ui/src/makerkit/marketing/hero.tsx b/packages/ui/src/makerkit/marketing/hero.tsx index 8564f6f9e..2c6eeee86 100644 --- a/packages/ui/src/makerkit/marketing/hero.tsx +++ b/packages/ui/src/makerkit/marketing/hero.tsx @@ -1,7 +1,7 @@ import React from 'react'; +import { cn } from '../../lib/utils'; import { Heading } from '../../shadcn/heading'; -import { cn } from '../../utils'; import { HeroTitle } from './hero-title'; interface HeroProps { diff --git a/packages/ui/src/makerkit/marketing/newsletter-signup-container.tsx b/packages/ui/src/makerkit/marketing/newsletter-signup-container.tsx index 5bb565c4a..864b3d091 100644 --- a/packages/ui/src/makerkit/marketing/newsletter-signup-container.tsx +++ b/packages/ui/src/makerkit/marketing/newsletter-signup-container.tsx @@ -2,9 +2,9 @@ import { useCallback, useState } from 'react'; +import { cn } from '../../lib/utils'; import { Alert, AlertDescription, AlertTitle } from '../../shadcn/alert'; import { Heading } from '../../shadcn/heading'; -import { cn } from '../../utils'; import { Spinner } from '../spinner'; import { NewsletterSignup } from './newsletter-signup'; diff --git a/packages/ui/src/makerkit/marketing/newsletter-signup.tsx b/packages/ui/src/makerkit/marketing/newsletter-signup.tsx index 9791eb8a1..87c02ab68 100644 --- a/packages/ui/src/makerkit/marketing/newsletter-signup.tsx +++ b/packages/ui/src/makerkit/marketing/newsletter-signup.tsx @@ -4,6 +4,7 @@ import { zodResolver } from '@hookform/resolvers/zod'; import { useForm } from 'react-hook-form'; import { z } from 'zod'; +import { cn } from '../../lib/utils'; import { Button } from '../../shadcn/button'; import { Form, @@ -13,7 +14,6 @@ import { FormMessage, } from '../../shadcn/form'; import { Input } from '../../shadcn/input'; -import { cn } from '../../utils'; const NewsletterFormSchema = z.object({ email: z.string().email('Please enter a valid email address'), diff --git a/packages/ui/src/makerkit/marketing/pill.tsx b/packages/ui/src/makerkit/marketing/pill.tsx index 2a3e7d718..3da959fe7 100644 --- a/packages/ui/src/makerkit/marketing/pill.tsx +++ b/packages/ui/src/makerkit/marketing/pill.tsx @@ -2,7 +2,7 @@ import { forwardRef } from 'react'; import { Slot, Slottable } from '@radix-ui/react-slot'; -import { cn } from '../../utils'; +import { cn } from '../../lib/utils'; import { GradientSecondaryText } from './gradient-secondary-text'; export const Pill = forwardRef< diff --git a/packages/ui/src/makerkit/marketing/secondary-hero.tsx b/packages/ui/src/makerkit/marketing/secondary-hero.tsx index abb95c6e9..3192bcca4 100644 --- a/packages/ui/src/makerkit/marketing/secondary-hero.tsx +++ b/packages/ui/src/makerkit/marketing/secondary-hero.tsx @@ -1,7 +1,7 @@ import { forwardRef } from 'react'; +import { cn } from '../../lib/utils'; import { Heading } from '../../shadcn/heading'; -import { cn } from '../../utils'; interface SecondaryHeroProps extends React.HTMLAttributes { pill?: React.ReactNode; diff --git a/packages/ui/src/makerkit/mode-toggle.tsx b/packages/ui/src/makerkit/mode-toggle.tsx index 755b29a07..9f9b95f0a 100644 --- a/packages/ui/src/makerkit/mode-toggle.tsx +++ b/packages/ui/src/makerkit/mode-toggle.tsx @@ -5,6 +5,7 @@ import { useMemo } from 'react'; import { Computer, Moon, Sun } from 'lucide-react'; import { useTheme } from 'next-themes'; +import { cn } from '../lib/utils'; import { Button } from '../shadcn/button'; import { DropdownMenu, @@ -16,7 +17,6 @@ import { DropdownMenuSubTrigger, DropdownMenuTrigger, } from '../shadcn/dropdown-menu'; -import { cn } from '../utils'; import { Trans } from './trans'; const MODES = ['light', 'dark', 'system']; diff --git a/packages/ui/src/makerkit/multi-step-form.tsx b/packages/ui/src/makerkit/multi-step-form.tsx index 4a0b56c62..3d84c3ae1 100644 --- a/packages/ui/src/makerkit/multi-step-form.tsx +++ b/packages/ui/src/makerkit/multi-step-form.tsx @@ -16,7 +16,7 @@ import { useMutation } from '@tanstack/react-query'; import { Path, UseFormReturn } from 'react-hook-form'; import { z } from 'zod'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; interface MultiStepFormProps { schema: T; diff --git a/packages/ui/src/makerkit/page.tsx b/packages/ui/src/makerkit/page.tsx index 5d7015333..fd5a28075 100644 --- a/packages/ui/src/makerkit/page.tsx +++ b/packages/ui/src/makerkit/page.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; export type PageLayoutStyle = 'sidebar' | 'header' | 'custom'; diff --git a/packages/ui/src/makerkit/profile-avatar.tsx b/packages/ui/src/makerkit/profile-avatar.tsx index b21b50f51..c304b874a 100644 --- a/packages/ui/src/makerkit/profile-avatar.tsx +++ b/packages/ui/src/makerkit/profile-avatar.tsx @@ -1,5 +1,5 @@ +import { cn } from '../lib/utils'; import { Avatar, AvatarFallback, AvatarImage } from '../shadcn/avatar'; -import { cn } from '../utils'; type SessionProps = { displayName: string | null; diff --git a/packages/ui/src/makerkit/sidebar.tsx b/packages/ui/src/makerkit/sidebar.tsx index 4c2ae66b5..e8c76a71f 100644 --- a/packages/ui/src/makerkit/sidebar.tsx +++ b/packages/ui/src/makerkit/sidebar.tsx @@ -9,6 +9,7 @@ import { cva } from 'class-variance-authority'; import { ChevronDown } from 'lucide-react'; import { z } from 'zod'; +import { cn, isRouteActive } from '../lib/utils'; import { Button } from '../shadcn/button'; import { Tooltip, @@ -16,7 +17,6 @@ import { TooltipProvider, TooltipTrigger, } from '../shadcn/tooltip'; -import { cn, isRouteActive } from '../utils'; import { SidebarContext } from './context/sidebar.context'; import { If } from './if'; import type { NavigationConfigSchema } from './navigation-config.schema'; diff --git a/packages/ui/src/makerkit/spinner.tsx b/packages/ui/src/makerkit/spinner.tsx index ee1839bfc..8d16c0b2f 100644 --- a/packages/ui/src/makerkit/spinner.tsx +++ b/packages/ui/src/makerkit/spinner.tsx @@ -1,4 +1,4 @@ -import { cn } from '../utils'; +import { cn } from '../lib/utils'; export function Spinner( props: React.PropsWithChildren<{ diff --git a/packages/ui/src/makerkit/stepper.tsx b/packages/ui/src/makerkit/stepper.tsx index 0c86082db..da2360218 100644 --- a/packages/ui/src/makerkit/stepper.tsx +++ b/packages/ui/src/makerkit/stepper.tsx @@ -4,7 +4,7 @@ import { Fragment, useCallback } from 'react'; import { cva } from 'class-variance-authority'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; import { If } from './if'; import { Trans } from './trans'; diff --git a/packages/ui/src/shadcn/accordion.tsx b/packages/ui/src/shadcn/accordion.tsx index d02ba5761..593a67834 100644 --- a/packages/ui/src/shadcn/accordion.tsx +++ b/packages/ui/src/shadcn/accordion.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import * as AccordionPrimitive from '@radix-ui/react-accordion'; import { ChevronDownIcon } from '@radix-ui/react-icons'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; const Accordion = AccordionPrimitive.Root; diff --git a/packages/ui/src/shadcn/alert-dialog.tsx b/packages/ui/src/shadcn/alert-dialog.tsx index 2f7804bec..9e8f7426e 100644 --- a/packages/ui/src/shadcn/alert-dialog.tsx +++ b/packages/ui/src/shadcn/alert-dialog.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as AlertDialogPrimitive from '@radix-ui/react-alert-dialog'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; import { buttonVariants } from './button'; const AlertDialog = AlertDialogPrimitive.Root; diff --git a/packages/ui/src/shadcn/alert.tsx b/packages/ui/src/shadcn/alert.tsx index 5ab680f25..8666f5a5e 100644 --- a/packages/ui/src/shadcn/alert.tsx +++ b/packages/ui/src/shadcn/alert.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { type VariantProps, cva } from 'class-variance-authority'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; const alertVariants = cva( 'relative w-full bg-gradient-to-r rounded-lg border px-4 py-3 text-sm [&>svg+div]:translate-y-[-3px] [&>svg]:absolute [&>svg]:left-4 [&>svg]:top-4 [&>svg]:text-foreground [&>svg~*]:pl-7', diff --git a/packages/ui/src/shadcn/avatar.tsx b/packages/ui/src/shadcn/avatar.tsx index dd486fabf..9793aa8b4 100644 --- a/packages/ui/src/shadcn/avatar.tsx +++ b/packages/ui/src/shadcn/avatar.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as AvatarPrimitive from '@radix-ui/react-avatar'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Avatar = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/badge.tsx b/packages/ui/src/shadcn/badge.tsx index a2d542b29..8a72a6492 100644 --- a/packages/ui/src/shadcn/badge.tsx +++ b/packages/ui/src/shadcn/badge.tsx @@ -2,7 +2,7 @@ import * as React from 'react'; import { type VariantProps, cva } from 'class-variance-authority'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const badgeVariants = cva( 'inline-flex items-center rounded-md 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', diff --git a/packages/ui/src/shadcn/breadcrumb.tsx b/packages/ui/src/shadcn/breadcrumb.tsx index 12770d075..33df9a229 100644 --- a/packages/ui/src/shadcn/breadcrumb.tsx +++ b/packages/ui/src/shadcn/breadcrumb.tsx @@ -3,7 +3,7 @@ import * as React from 'react'; import { ChevronRightIcon, DotsHorizontalIcon } from '@radix-ui/react-icons'; import { Slot } from '@radix-ui/react-slot'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; const Breadcrumb = React.forwardRef< HTMLElement, diff --git a/packages/ui/src/shadcn/button.tsx b/packages/ui/src/shadcn/button.tsx index 744edd466..7b3a30e07 100644 --- a/packages/ui/src/shadcn/button.tsx +++ b/packages/ui/src/shadcn/button.tsx @@ -4,7 +4,7 @@ import { Slot } from '@radix-ui/react-slot'; import { cva } from 'class-variance-authority'; import type { VariantProps } from 'class-variance-authority'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const buttonVariants = cva( 'inline-flex items-center justify-center whitespace-nowrap rounded-md text-sm font-medium transition-colors focus-visible:outline-none focus-visible:ring-1 focus-visible:ring-ring disabled:pointer-events-none disabled:opacity-50', diff --git a/packages/ui/src/shadcn/calendar.tsx b/packages/ui/src/shadcn/calendar.tsx index 9430ec3de..f5da65e5b 100644 --- a/packages/ui/src/shadcn/calendar.tsx +++ b/packages/ui/src/shadcn/calendar.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { ChevronLeft, ChevronRight } from 'lucide-react'; import { DayPicker } from 'react-day-picker'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; import { buttonVariants } from './button'; export type { DateRange } from 'react-day-picker'; diff --git a/packages/ui/src/shadcn/card.tsx b/packages/ui/src/shadcn/card.tsx index 8513daa48..3b88cc12d 100644 --- a/packages/ui/src/shadcn/card.tsx +++ b/packages/ui/src/shadcn/card.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Card = React.forwardRef< HTMLDivElement, diff --git a/packages/ui/src/shadcn/chart.tsx b/packages/ui/src/shadcn/chart.tsx index d3c010d85..409d7d232 100644 --- a/packages/ui/src/shadcn/chart.tsx +++ b/packages/ui/src/shadcn/chart.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as RechartsPrimitive from 'recharts'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; // Format: { THEME_NAME: CSS_SELECTOR } const THEMES = { light: '', dark: '.dark' } as const; diff --git a/packages/ui/src/shadcn/checkbox.tsx b/packages/ui/src/shadcn/checkbox.tsx index 97482b635..f5b70f0da 100644 --- a/packages/ui/src/shadcn/checkbox.tsx +++ b/packages/ui/src/shadcn/checkbox.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import * as CheckboxPrimitive from '@radix-ui/react-checkbox'; import { CheckIcon } from '@radix-ui/react-icons'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Checkbox = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/command.tsx b/packages/ui/src/shadcn/command.tsx index e89cae4df..07ce16eab 100644 --- a/packages/ui/src/shadcn/command.tsx +++ b/packages/ui/src/shadcn/command.tsx @@ -6,7 +6,7 @@ import { type DialogProps } from '@radix-ui/react-dialog'; import { MagnifyingGlassIcon } from '@radix-ui/react-icons'; import { Command as CommandPrimitive } from 'cmdk'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; import { Dialog, DialogContent } from './dialog'; const Command = React.forwardRef< diff --git a/packages/ui/src/shadcn/dialog.tsx b/packages/ui/src/shadcn/dialog.tsx index 313468c87..1c0ac7219 100644 --- a/packages/ui/src/shadcn/dialog.tsx +++ b/packages/ui/src/shadcn/dialog.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import * as DialogPrimitive from '@radix-ui/react-dialog'; import { Cross2Icon } from '@radix-ui/react-icons'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Dialog = DialogPrimitive.Root; diff --git a/packages/ui/src/shadcn/dropdown-menu.tsx b/packages/ui/src/shadcn/dropdown-menu.tsx index afbfb7710..9521ff48b 100644 --- a/packages/ui/src/shadcn/dropdown-menu.tsx +++ b/packages/ui/src/shadcn/dropdown-menu.tsx @@ -9,7 +9,7 @@ import { DotFilledIcon, } from '@radix-ui/react-icons'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const DropdownMenu = DropdownMenuPrimitive.Root; diff --git a/packages/ui/src/shadcn/form.tsx b/packages/ui/src/shadcn/form.tsx index 9e74f1c7c..6f103c614 100644 --- a/packages/ui/src/shadcn/form.tsx +++ b/packages/ui/src/shadcn/form.tsx @@ -7,8 +7,8 @@ import { Slot } from '@radix-ui/react-slot'; import type { ControllerProps, FieldPath, FieldValues } from 'react-hook-form'; import { Controller, FormProvider, useFormContext } from 'react-hook-form'; +import { cn } from '../lib/utils'; import { Trans } from '../makerkit/trans'; -import { cn } from '../utils'; import { Label } from './label'; const Form = FormProvider; diff --git a/packages/ui/src/shadcn/heading.tsx b/packages/ui/src/shadcn/heading.tsx index ab75453e8..534ae3b78 100644 --- a/packages/ui/src/shadcn/heading.tsx +++ b/packages/ui/src/shadcn/heading.tsx @@ -1,4 +1,4 @@ -import { cn } from '../utils'; +import { cn } from '../lib/utils'; type Level = 1 | 2 | 3 | 4 | 5 | 6; diff --git a/packages/ui/src/shadcn/index.ts b/packages/ui/src/shadcn/index.ts index 4c35088cf..f88d26aaf 100644 --- a/packages/ui/src/shadcn/index.ts +++ b/packages/ui/src/shadcn/index.ts @@ -1 +1 @@ -export { cn } from '../utils/cn'; +export { cn } from '../lib/utils'; diff --git a/packages/ui/src/shadcn/input-otp.tsx b/packages/ui/src/shadcn/input-otp.tsx index a626efdc9..ee2479bd5 100644 --- a/packages/ui/src/shadcn/input-otp.tsx +++ b/packages/ui/src/shadcn/input-otp.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { DashIcon } from '@radix-ui/react-icons'; import { OTPInput, OTPInputContext } from 'input-otp'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; const InputOTP = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/input.tsx b/packages/ui/src/shadcn/input.tsx index 8879b09e1..1bbba669f 100644 --- a/packages/ui/src/shadcn/input.tsx +++ b/packages/ui/src/shadcn/input.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; export type InputProps = React.InputHTMLAttributes; diff --git a/packages/ui/src/shadcn/label.tsx b/packages/ui/src/shadcn/label.tsx index 1aa238d96..4dff81ca2 100644 --- a/packages/ui/src/shadcn/label.tsx +++ b/packages/ui/src/shadcn/label.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import * as LabelPrimitive from '@radix-ui/react-label'; import { type VariantProps, cva } from 'class-variance-authority'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const labelVariants = cva( 'text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70', diff --git a/packages/ui/src/shadcn/navigation-menu.tsx b/packages/ui/src/shadcn/navigation-menu.tsx index 4718259e7..4fe37806b 100644 --- a/packages/ui/src/shadcn/navigation-menu.tsx +++ b/packages/ui/src/shadcn/navigation-menu.tsx @@ -6,7 +6,7 @@ import { ChevronDownIcon } from '@radix-ui/react-icons'; import * as NavigationMenuPrimitive from '@radix-ui/react-navigation-menu'; import { cva } from 'class-variance-authority'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const NavigationMenu = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/popover.tsx b/packages/ui/src/shadcn/popover.tsx index 1e60e0b62..3cebc5423 100644 --- a/packages/ui/src/shadcn/popover.tsx +++ b/packages/ui/src/shadcn/popover.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as PopoverPrimitive from '@radix-ui/react-popover'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Popover = PopoverPrimitive.Root; diff --git a/packages/ui/src/shadcn/radio-group.tsx b/packages/ui/src/shadcn/radio-group.tsx index 631164857..37e42bc97 100644 --- a/packages/ui/src/shadcn/radio-group.tsx +++ b/packages/ui/src/shadcn/radio-group.tsx @@ -5,7 +5,7 @@ import * as React from 'react'; import { CheckIcon } from '@radix-ui/react-icons'; import * as RadioGroupPrimitive from '@radix-ui/react-radio-group'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const RadioGroup = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/scroll-area.tsx b/packages/ui/src/shadcn/scroll-area.tsx index 3dfec4af8..24ef95d04 100644 --- a/packages/ui/src/shadcn/scroll-area.tsx +++ b/packages/ui/src/shadcn/scroll-area.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as ScrollAreaPrimitive from '@radix-ui/react-scroll-area'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const ScrollArea = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/select.tsx b/packages/ui/src/shadcn/select.tsx index 33277551f..3091f2b3e 100644 --- a/packages/ui/src/shadcn/select.tsx +++ b/packages/ui/src/shadcn/select.tsx @@ -10,7 +10,7 @@ import { } from '@radix-ui/react-icons'; import * as SelectPrimitive from '@radix-ui/react-select'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Select = SelectPrimitive.Root; diff --git a/packages/ui/src/shadcn/separator.tsx b/packages/ui/src/shadcn/separator.tsx index 4a584571d..f8cb5a611 100644 --- a/packages/ui/src/shadcn/separator.tsx +++ b/packages/ui/src/shadcn/separator.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as SeparatorPrimitive from '@radix-ui/react-separator'; -import { cn } from '../utils'; +import { cn } from '../lib/utils'; const Separator = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/sheet.tsx b/packages/ui/src/shadcn/sheet.tsx index f3b6941fa..9cde8b7bb 100644 --- a/packages/ui/src/shadcn/sheet.tsx +++ b/packages/ui/src/shadcn/sheet.tsx @@ -7,7 +7,7 @@ import { cva } from 'class-variance-authority'; import type { VariantProps } from 'class-variance-authority'; import { X } from 'lucide-react'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Sheet = SheetPrimitive.Root; diff --git a/packages/ui/src/shadcn/switch.tsx b/packages/ui/src/shadcn/switch.tsx index 163bf5e50..208b57bcc 100644 --- a/packages/ui/src/shadcn/switch.tsx +++ b/packages/ui/src/shadcn/switch.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as SwitchPrimitives from '@radix-ui/react-switch'; -import { cn } from '@kit/ui/utils'; +import { cn } from '../lib/utils'; const Switch = React.forwardRef< React.ElementRef, diff --git a/packages/ui/src/shadcn/table.tsx b/packages/ui/src/shadcn/table.tsx index ff4b8f96f..f69830652 100644 --- a/packages/ui/src/shadcn/table.tsx +++ b/packages/ui/src/shadcn/table.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Table = React.forwardRef< HTMLTableElement, diff --git a/packages/ui/src/shadcn/tabs.tsx b/packages/ui/src/shadcn/tabs.tsx index f26f82d04..04d4c3ccf 100644 --- a/packages/ui/src/shadcn/tabs.tsx +++ b/packages/ui/src/shadcn/tabs.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as TabsPrimitive from '@radix-ui/react-tabs'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const Tabs = TabsPrimitive.Root; diff --git a/packages/ui/src/shadcn/textarea.tsx b/packages/ui/src/shadcn/textarea.tsx index fbc84457b..1031fd26f 100644 --- a/packages/ui/src/shadcn/textarea.tsx +++ b/packages/ui/src/shadcn/textarea.tsx @@ -1,6 +1,6 @@ import * as React from 'react'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; export type TextareaProps = React.TextareaHTMLAttributes; diff --git a/packages/ui/src/shadcn/tooltip.tsx b/packages/ui/src/shadcn/tooltip.tsx index 3f8981609..7d74163ad 100644 --- a/packages/ui/src/shadcn/tooltip.tsx +++ b/packages/ui/src/shadcn/tooltip.tsx @@ -4,7 +4,7 @@ import * as React from 'react'; import * as TooltipPrimitive from '@radix-ui/react-tooltip'; -import { cn } from '../utils/cn'; +import { cn } from '../lib/utils'; const TooltipProvider = TooltipPrimitive.Provider; diff --git a/packages/ui/tsconfig.json b/packages/ui/tsconfig.json index c4697e934..3f909c1ed 100644 --- a/packages/ui/tsconfig.json +++ b/packages/ui/tsconfig.json @@ -1,8 +1,15 @@ { "extends": "@kit/tsconfig/base.json", "compilerOptions": { - "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json" + "tsBuildInfoFile": "node_modules/.cache/tsbuildinfo.json", + "paths": { + "~/components": ["./src/shadcn/*"], + "~/utils": ["./src/lib/utils"], + "~/lib/*": ["./src/lib/*"], + "~/hooks": ["./src/hooks"], + "~/ui": ["./src/shadcn/*"] + } }, "include": ["*.ts", "src"], "exclude": ["node_modules"] -} +} \ No newline at end of file diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml index 37d648e00..c1e1c1414 100644 --- a/pnpm-lock.yaml +++ b/pnpm-lock.yaml @@ -126,9 +126,6 @@ importers: '@tanstack/react-query': specifier: 5.52.2 version: 5.52.2(react@18.3.1) - '@tanstack/react-query-next-experimental': - specifier: ^5.53.1 - version: 5.53.1(@tanstack/react-query@5.52.2(react@18.3.1))(next@14.2.7(@opentelemetry/api@1.9.0)(@playwright/test@1.46.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1) '@tanstack/react-table': specifier: ^8.20.5 version: 8.20.5(react-dom@18.3.1(react@18.3.1))(react@18.3.1) @@ -1260,6 +1257,9 @@ importers: tailwind-merge: specifier: ^2.5.2 version: 2.5.2 + vaul: + specifier: ^0.9.1 + version: 0.9.1(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) devDependencies: '@kit/eslint-config': specifier: workspace:* @@ -3916,13 +3916,6 @@ packages: '@tanstack/query-core@5.52.2': resolution: {integrity: sha512-9vvbFecK4A0nDnrc/ks41e3UHONF1DAnGz8Tgbxkl59QcvKWmc0ewhYuIKRh8NC4ja5LTHT9EH16KHbn2AIYWA==} - '@tanstack/react-query-next-experimental@5.53.1': - resolution: {integrity: sha512-EmvJSE6JH6NnE9wX8FzY5PmnaJnyELTAcS9mxOvGOZJttZmLS+E8l8cdQZQToTzniXzeHCoQjvpuABETfgi4ng==} - peerDependencies: - '@tanstack/react-query': ^5.53.1 - next: ^13 || ^14 || ^15 - react: 18.3.1 - '@tanstack/react-query@5.52.2': resolution: {integrity: sha512-d4OwmobpP+6+SvuAxW1RzAY95Pv87Gu+0GjtErzFOUXo+n0FGcwxKvzhswCsXKxsgnAr3bU2eJ2u+GXQAutkCQ==} peerDependencies: @@ -7641,6 +7634,12 @@ packages: resolution: {integrity: sha512-OljLrQ9SQdOUqTaQxqL5dEfZWrXExyyWsozYlAWFawPVNuD83igl7uJD2RTkNMbniIYgt8l81eCJGIdQF7avLQ==} engines: {node: ^14.17.0 || ^16.13.0 || >=18.0.0} + vaul@0.9.1: + resolution: {integrity: sha512-fAhd7i4RNMinx+WEm6pF3nOl78DFkAazcN04ElLPFF9BMCNGbY/kou8UMhIcicm0rJCNePJP0Yyza60gGOD0Jw==} + peerDependencies: + react: 18.3.1 + react-dom: 18.3.1 + vercel-email@0.0.6: resolution: {integrity: sha512-lpELZ8/B6qyLMUOzmvZiU5evo1Hv5jfSpI/rrzny5UYfOAUKFYycraXNT+fT/cC6ewUKQVJDg8/v3LwyX3cCzA==} @@ -11234,12 +11233,6 @@ snapshots: '@tanstack/query-core@5.52.2': {} - '@tanstack/react-query-next-experimental@5.53.1(@tanstack/react-query@5.52.2(react@18.3.1))(next@14.2.7(@opentelemetry/api@1.9.0)(@playwright/test@1.46.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1))(react@18.3.1)': - dependencies: - '@tanstack/react-query': 5.52.2(react@18.3.1) - next: 14.2.7(@babel/core@7.25.2)(@opentelemetry/api@1.9.0)(@playwright/test@1.46.1)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) - react: 18.3.1 - '@tanstack/react-query@5.52.2(react@18.3.1)': dependencies: '@tanstack/query-core': 5.52.2 @@ -15536,6 +15529,15 @@ snapshots: validate-npm-package-name@5.0.1: {} + vaul@0.9.1(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1): + dependencies: + '@radix-ui/react-dialog': 1.1.1(@types/react-dom@18.3.0)(@types/react@18.3.5)(react-dom@18.3.1(react@18.3.1))(react@18.3.1) + react: 18.3.1 + react-dom: 18.3.1(react@18.3.1) + transitivePeerDependencies: + - '@types/react' + - '@types/react-dom' + vercel-email@0.0.6: {} vfile-message@4.0.2: