From 09c68efb2d8f8019eeccdb0b630e7dfcfb05f067 Mon Sep 17 00:00:00 2001 From: Antigravity Date: Thu, 16 Jul 2026 14:03:53 +0530 Subject: [PATCH] Initial commit of template --- .gitignore | 17 + components.json | 20 + eslint.config.js | 28 + index.html | 14 + package.json | 88 +++ plugins/component-tagger.ts | 103 ++++ postcss.config.js | 8 + public/placeholder.svg | 1 + public/robots.txt | 2 + src/App.tsx | 35 ++ src/components/ui/accordion.tsx | 58 ++ src/components/ui/alert-dialog.tsx | 141 +++++ src/components/ui/alert.tsx | 59 ++ src/components/ui/aspect-ratio.tsx | 7 + src/components/ui/avatar.tsx | 50 ++ src/components/ui/badge.tsx | 36 ++ src/components/ui/breadcrumb.tsx | 115 ++++ src/components/ui/button.tsx | 56 ++ src/components/ui/calendar.tsx | 66 +++ src/components/ui/card.tsx | 79 +++ src/components/ui/carousel.tsx | 262 +++++++++ src/components/ui/chart.tsx | 365 ++++++++++++ src/components/ui/checkbox.tsx | 30 + src/components/ui/collapsible.tsx | 11 + src/components/ui/command.tsx | 153 ++++++ src/components/ui/context-menu.tsx | 200 +++++++ src/components/ui/dialog.tsx | 122 ++++ src/components/ui/drawer.tsx | 118 ++++ src/components/ui/dropdown-menu.tsx | 200 +++++++ src/components/ui/form.tsx | 178 ++++++ src/components/ui/hover-card.tsx | 29 + src/components/ui/input-otp.tsx | 71 +++ src/components/ui/input.tsx | 22 + src/components/ui/label.tsx | 26 + src/components/ui/menubar.tsx | 236 ++++++++ src/components/ui/navigation-menu.tsx | 128 +++++ src/components/ui/pagination.tsx | 117 ++++ src/components/ui/popover.tsx | 31 ++ src/components/ui/progress.tsx | 28 + src/components/ui/radio-group.tsx | 44 ++ src/components/ui/resizable.tsx | 45 ++ src/components/ui/scroll-area.tsx | 48 ++ src/components/ui/select.tsx | 160 ++++++ src/components/ui/separator.tsx | 31 ++ src/components/ui/sheet.tsx | 140 +++++ src/components/ui/sidebar.tsx | 763 ++++++++++++++++++++++++++ src/components/ui/skeleton.tsx | 15 + src/components/ui/slider.tsx | 28 + src/components/ui/switch.tsx | 29 + src/components/ui/table.tsx | 117 ++++ src/components/ui/tabs.tsx | 55 ++ src/components/ui/textarea.tsx | 22 + src/components/ui/toast.tsx | 129 +++++ src/components/ui/toaster.tsx | 35 ++ src/components/ui/toggle-group.tsx | 61 ++ src/components/ui/toggle.tsx | 45 ++ src/components/ui/tooltip.tsx | 30 + src/hooks/use-mobile.tsx | 19 + src/hooks/use-toast.ts | 194 +++++++ src/index.css | 110 ++++ src/lib/utils.ts | 6 + src/main.tsx | 16 + src/pages/Index.tsx | 375 +++++++++++++ src/pages/NotFound.tsx | 24 + src/polyfills.ts | 5 + tailwind.config.js | 82 +++ tsconfig.app.json | 35 ++ tsconfig.json | 13 + tsconfig.node.json | 23 + vite.config.ts | 41 ++ 70 files changed, 6050 insertions(+) create mode 100644 .gitignore create mode 100644 components.json create mode 100644 eslint.config.js create mode 100644 index.html create mode 100644 package.json create mode 100644 plugins/component-tagger.ts create mode 100644 postcss.config.js create mode 100644 public/placeholder.svg create mode 100644 public/robots.txt create mode 100644 src/App.tsx create mode 100644 src/components/ui/accordion.tsx create mode 100644 src/components/ui/alert-dialog.tsx create mode 100644 src/components/ui/alert.tsx create mode 100644 src/components/ui/aspect-ratio.tsx create mode 100644 src/components/ui/avatar.tsx create mode 100644 src/components/ui/badge.tsx create mode 100644 src/components/ui/breadcrumb.tsx create mode 100644 src/components/ui/button.tsx create mode 100644 src/components/ui/calendar.tsx create mode 100644 src/components/ui/card.tsx create mode 100644 src/components/ui/carousel.tsx create mode 100644 src/components/ui/chart.tsx create mode 100644 src/components/ui/checkbox.tsx create mode 100644 src/components/ui/collapsible.tsx create mode 100644 src/components/ui/command.tsx create mode 100644 src/components/ui/context-menu.tsx create mode 100644 src/components/ui/dialog.tsx create mode 100644 src/components/ui/drawer.tsx create mode 100644 src/components/ui/dropdown-menu.tsx create mode 100644 src/components/ui/form.tsx create mode 100644 src/components/ui/hover-card.tsx create mode 100644 src/components/ui/input-otp.tsx create mode 100644 src/components/ui/input.tsx create mode 100644 src/components/ui/label.tsx create mode 100644 src/components/ui/menubar.tsx create mode 100644 src/components/ui/navigation-menu.tsx create mode 100644 src/components/ui/pagination.tsx create mode 100644 src/components/ui/popover.tsx create mode 100644 src/components/ui/progress.tsx create mode 100644 src/components/ui/radio-group.tsx create mode 100644 src/components/ui/resizable.tsx create mode 100644 src/components/ui/scroll-area.tsx create mode 100644 src/components/ui/select.tsx create mode 100644 src/components/ui/separator.tsx create mode 100644 src/components/ui/sheet.tsx create mode 100644 src/components/ui/sidebar.tsx create mode 100644 src/components/ui/skeleton.tsx create mode 100644 src/components/ui/slider.tsx create mode 100644 src/components/ui/switch.tsx create mode 100644 src/components/ui/table.tsx create mode 100644 src/components/ui/tabs.tsx create mode 100644 src/components/ui/textarea.tsx create mode 100644 src/components/ui/toast.tsx create mode 100644 src/components/ui/toaster.tsx create mode 100644 src/components/ui/toggle-group.tsx create mode 100644 src/components/ui/toggle.tsx create mode 100644 src/components/ui/tooltip.tsx create mode 100644 src/hooks/use-mobile.tsx create mode 100644 src/hooks/use-toast.ts create mode 100644 src/index.css create mode 100644 src/lib/utils.ts create mode 100644 src/main.tsx create mode 100644 src/pages/Index.tsx create mode 100644 src/pages/NotFound.tsx create mode 100644 src/polyfills.ts create mode 100644 tailwind.config.js create mode 100644 tsconfig.app.json create mode 100644 tsconfig.json create mode 100644 tsconfig.node.json create mode 100644 vite.config.ts diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..8990dad --- /dev/null +++ b/.gitignore @@ -0,0 +1,17 @@ +# Dependencies +node_modules + +# Lockfiles +bun.lock + +# Vite +.vite + +# Build output +dist + +# Cache +cache + +# OS files +.DS_Store diff --git a/components.json b/components.json new file mode 100644 index 0000000..e2c49ef --- /dev/null +++ b/components.json @@ -0,0 +1,20 @@ +{ + "$schema": "https://ui.shadcn.com/schema.json", + "style": "default", + "rsc": false, + "tsx": true, + "tailwind": { + "config": "tailwind.config.js", + "css": "src/index.css", + "baseColor": "slate", + "cssVariables": true, + "prefix": "" + }, + "aliases": { + "components": "@/components", + "utils": "@/lib/utils", + "ui": "@/components/ui", + "lib": "@/lib", + "hooks": "@/hooks" + } +} diff --git a/eslint.config.js b/eslint.config.js new file mode 100644 index 0000000..82c2e20 --- /dev/null +++ b/eslint.config.js @@ -0,0 +1,28 @@ +import js from '@eslint/js'; +import globals from 'globals'; +import reactHooks from 'eslint-plugin-react-hooks'; +import reactRefresh from 'eslint-plugin-react-refresh'; +import tseslint from 'typescript-eslint'; + +export default tseslint.config( + { ignores: ['dist'] }, + { + extends: [js.configs.recommended, ...tseslint.configs.recommended], + files: ['**/*.{ts,tsx}'], + languageOptions: { + ecmaVersion: 2020, + globals: globals.browser, + }, + plugins: { + 'react-hooks': reactHooks, + 'react-refresh': reactRefresh, + }, + rules: { + ...reactHooks.configs.recommended.rules, + 'react-refresh/only-export-components': [ + 'warn', + { allowConstantExport: true }, + ], + }, + } +); diff --git a/index.html b/index.html new file mode 100644 index 0000000..1c8f4a6 --- /dev/null +++ b/index.html @@ -0,0 +1,14 @@ + + + + + + + Hello World Dapp + + +
+ + + + diff --git a/package.json b/package.json new file mode 100644 index 0000000..99b11c6 --- /dev/null +++ b/package.json @@ -0,0 +1,88 @@ +{ + "name": "node-solana-starter-app", + "private": true, + "version": "0.0.0", + "type": "module", + "scripts": { + "dev": "vite --host", + "build": "vite build", + "lint": "eslint .", + "preview": "vite preview", + "watch": "vite build --watch" + }, + "dependencies": { + "@coral-xyz/anchor": "0.30.0", + "@dhiwise/component-tagger": "1.0.15", + "@hookform/resolvers": "3.9.1", + "@radix-ui/react-accordion": "1.2.2", + "@radix-ui/react-alert-dialog": "1.1.4", + "@radix-ui/react-aspect-ratio": "1.1.1", + "@radix-ui/react-avatar": "1.1.2", + "@radix-ui/react-checkbox": "1.1.3", + "@radix-ui/react-collapsible": "1.1.2", + "@radix-ui/react-context-menu": "2.2.4", + "@radix-ui/react-dialog": "1.1.4", + "@radix-ui/react-dropdown-menu": "2.1.4", + "@radix-ui/react-hover-card": "1.1.4", + "@radix-ui/react-label": "2.1.1", + "@radix-ui/react-menubar": "1.1.4", + "@radix-ui/react-navigation-menu": "1.2.3", + "@radix-ui/react-popover": "1.1.4", + "@radix-ui/react-progress": "1.1.1", + "@radix-ui/react-radio-group": "1.2.2", + "@radix-ui/react-scroll-area": "1.2.2", + "@radix-ui/react-select": "2.1.4", + "@radix-ui/react-separator": "1.1.1", + "@radix-ui/react-slider": "1.2.2", + "@radix-ui/react-slot": "1.1.1", + "@radix-ui/react-switch": "1.1.2", + "@radix-ui/react-tabs": "1.1.2", + "@radix-ui/react-toast": "1.2.4", + "@radix-ui/react-toggle": "1.1.1", + "@radix-ui/react-toggle-group": "1.1.1", + "@radix-ui/react-tooltip": "1.1.6", + "@solana/spl-token": "0.4.13", + "@solana/wallet-adapter-base": "0.9.27", + "@solana/wallet-adapter-react": "0.15.39", + "@solana/wallet-adapter-react-ui": "0.9.38", + "@solana/wallet-adapter-wallets": "0.19.36", + "@solana/web3.js": "1.98.2", + "@supabase/supabase-js": "2.57.4", + "buffer": "6.0.3", + "class-variance-authority": "0.7.1", + "clsx": "2.1.1", + "cmdk": "1.1.1", + "embla-carousel-react": "8.5.1", + "framer-motion": "12.38.0", + "lucide-react": "0.454.0", + "react": "19.1.0", + "react-copy-to-clipboard": "5.1.0", + "react-day-picker": "8.10.1", + "react-dom": "19.1.0", + "react-hook-form": "7.54.1", + "react-resizable-panels": "2.1.7", + "react-router-dom": "6.22.1", + "recharts": "2.12.7", + "tailwind-merge": "2.5.5", + "tailwindcss-animate": "1.0.7", + "vaul": "0.9.6" + }, + "devDependencies": { + "@eslint/js": "9.9.1", + "@types/react": "19.0.0", + "@types/react-dom": "19.0.0", + "@vitejs/plugin-react-swc": "4.3.0", + "autoprefixer": "10.4.20", + "eslint": "9.9.1", + "eslint-plugin-react-hooks": "5.1.0-rc.0", + "eslint-plugin-react-refresh": "0.4.11", + "estree-walker": "^3.0.3", + "globals": "15.9.0", + "magic-string": "^0.30.21", + "postcss": "8.4.35", + "tailwindcss": "3.4.11", + "typescript": "5.5.3", + "typescript-eslint": "8.3.0", + "vite": "8.0.8" + } +} diff --git a/plugins/component-tagger.ts b/plugins/component-tagger.ts new file mode 100644 index 0000000..82867d2 --- /dev/null +++ b/plugins/component-tagger.ts @@ -0,0 +1,103 @@ +import { parse } from "@babel/parser"; +import { walk } from "estree-walker"; +import MagicString from "magic-string"; +import path from "node:path"; +import type { Plugin } from "vite"; + +const VALID_EXTENSIONS = new Set([".jsx", ".tsx"]); + +/** + * Returns a Vite plugin that adds component data attributes for component selection. + */ +export default function componentTagger(): Plugin { + return { + name: "vite-plugin-component-tagger", + apply: () => true, + enforce: "pre", + + async transform(code: string, id: string) { + try { + // Ignore non-jsx files and files inside node_modules + if ( + !VALID_EXTENSIONS.has(path.extname(id)) || + id.includes("node_modules") + ) + return null; + + const ast = parse(code, { + sourceType: "module", + plugins: ["jsx", "typescript"], + }); + + const ms = new MagicString(code); + const fileRelative = path.relative(process.cwd(), id); + + walk(ast as any, { + enter(node: any) { + try { + if (node.type !== "JSXOpeningElement") return; + + // ── 1. Extract the tag / component name ────────────────────────────── + if (node.name?.type !== "JSXIdentifier") return; + const tagName = node.name.name as string; + if (!tagName) return; + + // Skip certain HTML elements that are too generic + const skipElements = new Set([ + "html", + "head", + "body", + "script", + "style", + "meta", + "link", + "title", + ]); + if (skipElements.has(tagName.toLowerCase())) return; + + // ── 2. Check whether the tag already has data-component-id ─────────────── + const alreadyTagged = node.attributes?.some( + (attr: any) => + attr.type === "JSXAttribute" && + attr.name?.name === "data-component-id", + ); + if (alreadyTagged) return; + + // ── 3. Build the id "relative/file.jsx:line:column" ───────────────── + const loc = node.loc?.start; + if (!loc) return; + const componentId = `${fileRelative}:${loc.line}:${loc.column}`; + + // ── 4. Inject the attributes just after the tag name ──────────────── + if (node.name.end != null) { + ms.appendLeft( + node.name.end, + ` data-component-id="${componentId}" data-component-name="${tagName}"`, + ); + } + } catch (error) { + console.warn( + `[component-tagger] Warning: Failed to process JSX node in ${id}:`, + error, + ); + } + }, + }); + + // If nothing changed bail out. + if (ms.toString() === code) return null; + + return { + code: ms.toString(), + map: ms.generateMap({ hires: true }), + }; + } catch (error) { + console.warn( + `[component-tagger] Warning: Failed to transform ${id}:`, + error, + ); + return null; + } + }, + }; +} diff --git a/postcss.config.js b/postcss.config.js new file mode 100644 index 0000000..a982c64 --- /dev/null +++ b/postcss.config.js @@ -0,0 +1,8 @@ +const config = { + plugins: { + tailwindcss: {}, + autoprefixer: {}, + }, +}; + +export default config; diff --git a/public/placeholder.svg b/public/placeholder.svg new file mode 100644 index 0000000..e763910 --- /dev/null +++ b/public/placeholder.svg @@ -0,0 +1 @@ + \ No newline at end of file diff --git a/public/robots.txt b/public/robots.txt new file mode 100644 index 0000000..c2a49f4 --- /dev/null +++ b/public/robots.txt @@ -0,0 +1,2 @@ +User-agent: * +Allow: / diff --git a/src/App.tsx b/src/App.tsx new file mode 100644 index 0000000..b2fb155 --- /dev/null +++ b/src/App.tsx @@ -0,0 +1,35 @@ +import { useMemo } from 'react'; +import { Routes, Route } from 'react-router-dom'; +import { Toaster } from '@/components/ui/toaster'; +import { ConnectionProvider, WalletProvider } from '@solana/wallet-adapter-react'; +import { WalletAdapterNetwork } from '@solana/wallet-adapter-base'; +import { PhantomWalletAdapter } from '@solana/wallet-adapter-wallets'; +import { WalletModalProvider } from '@solana/wallet-adapter-react-ui'; +import { clusterApiUrl } from '@solana/web3.js'; +import NotFound from './pages/NotFound'; +import Index from './pages/Index'; + +import '@solana/wallet-adapter-react-ui/styles.css'; + +const App = () => { + const network = WalletAdapterNetwork.Devnet; + const endpoint = useMemo(() => clusterApiUrl(network), [network]); + + const wallets = useMemo(() => [new PhantomWalletAdapter()], []); + + return ( + + + + + } /> + } /> + + + + + + ); +}; + +export default App; diff --git a/src/components/ui/accordion.tsx b/src/components/ui/accordion.tsx new file mode 100644 index 0000000..24c788c --- /dev/null +++ b/src/components/ui/accordion.tsx @@ -0,0 +1,58 @@ +"use client" + +import * as React from "react" +import * as AccordionPrimitive from "@radix-ui/react-accordion" +import { ChevronDown } from "lucide-react" + +import { cn } from "@/lib/utils" + +const Accordion = AccordionPrimitive.Root + +const AccordionItem = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AccordionItem.displayName = "AccordionItem" + +const AccordionTrigger = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + + svg]:rotate-180", + className + )} + {...props} + > + {children} + + + +)) +AccordionTrigger.displayName = AccordionPrimitive.Trigger.displayName + +const AccordionContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, children, ...props }, ref) => ( + +
{children}
+ +)) + +AccordionContent.displayName = AccordionPrimitive.Content.displayName + +export { Accordion, AccordionItem, AccordionTrigger, AccordionContent } diff --git a/src/components/ui/alert-dialog.tsx b/src/components/ui/alert-dialog.tsx new file mode 100644 index 0000000..25e7b47 --- /dev/null +++ b/src/components/ui/alert-dialog.tsx @@ -0,0 +1,141 @@ +"use client" + +import * as React from "react" +import * as AlertDialogPrimitive from "@radix-ui/react-alert-dialog" + +import { cn } from "@/lib/utils" +import { buttonVariants } from "@/components/ui/button" + +const AlertDialog = AlertDialogPrimitive.Root + +const AlertDialogTrigger = AlertDialogPrimitive.Trigger + +const AlertDialogPortal = AlertDialogPrimitive.Portal + +const AlertDialogOverlay = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AlertDialogOverlay.displayName = AlertDialogPrimitive.Overlay.displayName + +const AlertDialogContent = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + + + + +)) +AlertDialogContent.displayName = AlertDialogPrimitive.Content.displayName + +const AlertDialogHeader = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +AlertDialogHeader.displayName = "AlertDialogHeader" + +const AlertDialogFooter = ({ + className, + ...props +}: React.HTMLAttributes) => ( +
+) +AlertDialogFooter.displayName = "AlertDialogFooter" + +const AlertDialogTitle = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AlertDialogTitle.displayName = AlertDialogPrimitive.Title.displayName + +const AlertDialogDescription = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AlertDialogDescription.displayName = + AlertDialogPrimitive.Description.displayName + +const AlertDialogAction = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AlertDialogAction.displayName = AlertDialogPrimitive.Action.displayName + +const AlertDialogCancel = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AlertDialogCancel.displayName = AlertDialogPrimitive.Cancel.displayName + +export { + AlertDialog, + AlertDialogPortal, + AlertDialogOverlay, + AlertDialogTrigger, + AlertDialogContent, + AlertDialogHeader, + AlertDialogFooter, + AlertDialogTitle, + AlertDialogDescription, + AlertDialogAction, + AlertDialogCancel, +} diff --git a/src/components/ui/alert.tsx b/src/components/ui/alert.tsx new file mode 100644 index 0000000..41fa7e0 --- /dev/null +++ b/src/components/ui/alert.tsx @@ -0,0 +1,59 @@ +import * as React from "react" +import { cva, type VariantProps } from "class-variance-authority" + +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 & VariantProps +>(({ className, variant, ...props }, ref) => ( +
+)) +Alert.displayName = "Alert" + +const AlertTitle = React.forwardRef< + HTMLParagraphElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)) +AlertTitle.displayName = "AlertTitle" + +const AlertDescription = React.forwardRef< + HTMLParagraphElement, + React.HTMLAttributes +>(({ className, ...props }, ref) => ( +
+)) +AlertDescription.displayName = "AlertDescription" + +export { Alert, AlertTitle, AlertDescription } diff --git a/src/components/ui/aspect-ratio.tsx b/src/components/ui/aspect-ratio.tsx new file mode 100644 index 0000000..d6a5226 --- /dev/null +++ b/src/components/ui/aspect-ratio.tsx @@ -0,0 +1,7 @@ +"use client" + +import * as AspectRatioPrimitive from "@radix-ui/react-aspect-ratio" + +const AspectRatio = AspectRatioPrimitive.Root + +export { AspectRatio } diff --git a/src/components/ui/avatar.tsx b/src/components/ui/avatar.tsx new file mode 100644 index 0000000..51e507b --- /dev/null +++ b/src/components/ui/avatar.tsx @@ -0,0 +1,50 @@ +"use client" + +import * as React from "react" +import * as AvatarPrimitive from "@radix-ui/react-avatar" + +import { cn } from "@/lib/utils" + +const Avatar = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +Avatar.displayName = AvatarPrimitive.Root.displayName + +const AvatarImage = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AvatarImage.displayName = AvatarPrimitive.Image.displayName + +const AvatarFallback = React.forwardRef< + React.ElementRef, + React.ComponentPropsWithoutRef +>(({ className, ...props }, ref) => ( + +)) +AvatarFallback.displayName = AvatarPrimitive.Fallback.displayName + +export { Avatar, AvatarImage, AvatarFallback } diff --git a/src/components/ui/badge.tsx b/src/components/ui/badge.tsx new file mode 100644 index 0000000..f000e3e --- /dev/null +++ b/src/components/ui/badge.tsx @@ -0,0 +1,36 @@ +import * as React from "react" +import { cva, type VariantProps } from "class-variance-authority" + +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-primary text-primary-foreground hover:bg-primary/80", + secondary: + "border-transparent bg-secondary text-secondary-foreground hover:bg-secondary/80", + destructive: + "border-transparent bg-destructive text-destructive-foreground hover:bg-destructive/80", + outline: "text-foreground", + }, + }, + defaultVariants: { + variant: "default", + }, + } +) + +export interface BadgeProps + extends React.HTMLAttributes, + VariantProps {} + +function Badge({ className, variant, ...props }: BadgeProps) { + return ( +
+ ) +} + +export { Badge, badgeVariants } diff --git a/src/components/ui/breadcrumb.tsx b/src/components/ui/breadcrumb.tsx new file mode 100644 index 0000000..60e6c96 --- /dev/null +++ b/src/components/ui/breadcrumb.tsx @@ -0,0 +1,115 @@ +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) =>