From be0b798e211447ae3f1085895671d35025edf363 Mon Sep 17 00:00:00 2001 From: shadcn Date: Wed, 14 Jan 2026 20:46:23 +0400 Subject: [PATCH] feat: add breadcrumb --- apps/v4/app/(app)/llm/[[...slug]]/route.ts | 4 +- .../docs/components/base/breadcrumb.mdx | 188 +++++++----------- .../docs/components/radix/breadcrumb.mdx | 181 ++++++----------- apps/v4/examples/__index__.tsx | 78 -------- apps/v4/examples/base/breadcrumb-demo.tsx | 11 +- apps/v4/examples/base/breadcrumb-dropdown.tsx | 12 +- apps/v4/examples/base/breadcrumb-link.tsx | 6 +- .../examples/base/breadcrumb-responsive.tsx | 139 ------------- .../v4/examples/base/breadcrumb-separator.tsx | 6 +- .../base/breadcrumb-with-dropdown.tsx | 52 ----- .../v4/examples/base/breadcrumb-with-link.tsx | 34 ---- .../v4/examples/radix/breadcrumb-dropdown.tsx | 6 +- .../examples/radix/breadcrumb-responsive.tsx | 138 ------------- .../examples/radix/breadcrumb-separator.tsx | 6 +- .../radix/breadcrumb-with-dropdown.tsx | 52 ----- .../examples/radix/breadcrumb-with-link.tsx | 38 ---- 16 files changed, 157 insertions(+), 794 deletions(-) delete mode 100644 apps/v4/examples/base/breadcrumb-responsive.tsx delete mode 100644 apps/v4/examples/base/breadcrumb-with-dropdown.tsx delete mode 100644 apps/v4/examples/base/breadcrumb-with-link.tsx delete mode 100644 apps/v4/examples/radix/breadcrumb-responsive.tsx delete mode 100644 apps/v4/examples/radix/breadcrumb-with-dropdown.tsx delete mode 100644 apps/v4/examples/radix/breadcrumb-with-link.tsx diff --git a/apps/v4/app/(app)/llm/[[...slug]]/route.ts b/apps/v4/app/(app)/llm/[[...slug]]/route.ts index 1bc44d4779..78390a5d1f 100644 --- a/apps/v4/app/(app)/llm/[[...slug]]/route.ts +++ b/apps/v4/app/(app)/llm/[[...slug]]/route.ts @@ -3,7 +3,7 @@ import { NextResponse, type NextRequest } from "next/server" import { processMdxForLLMs } from "@/lib/llm" import { source } from "@/lib/source" -import { getActiveStyle } from "@/registry/_legacy-styles" +import { getActiveStyle, type Style } from "@/registry/_legacy-styles" export const revalidate = false @@ -36,7 +36,7 @@ export async function GET( const processedContent = processMdxForLLMs( await page.data.getText("raw"), - effectiveStyle + effectiveStyle as Style["name"] ) return new NextResponse(processedContent, { diff --git a/apps/v4/content/docs/components/base/breadcrumb.mdx b/apps/v4/content/docs/components/base/breadcrumb.mdx index 74a1edb574..4546d8a864 100644 --- a/apps/v4/content/docs/components/base/breadcrumb.mdx +++ b/apps/v4/content/docs/components/base/breadcrumb.mdx @@ -5,12 +5,7 @@ base: base component: true --- - + ## Installation @@ -65,11 +60,13 @@ import { - Home + }>Home - Components + }> + Components + @@ -81,142 +78,91 @@ import { ## Examples +### Basic + +A basic breadcrumb with a home link and a components link. + + + ### Custom separator Use a custom component as `children` for `` to create a custom separator. - - -```tsx showLineNumbers {1,10-12} -import { SlashIcon } from "lucide-react" - -... - - - - - Home - - - - - - Components - - - -``` - ---- + ### Dropdown You can compose `` with a `` to create a dropdown in the breadcrumb. - - -```tsx showLineNumbers {1-6,11-21} -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/components/ui/dropdown-menu" - -... - - - - - Components - - - Documentation - Themes - GitHub - - - -``` - ---- + ### Collapsed We provide a `` component to show a collapsed state when the breadcrumb is too long. - - -```tsx showLineNumbers {1,9} -import { BreadcrumbEllipsis } from "@/components/ui/breadcrumb" - -... - - - - {/* ... */} - - - - {/* ... */} - - -``` - ---- + ### Link component -To use a custom link component from your routing library, you can use the `asChild` prop on ``. +To use a custom link component from your routing library, you can use the `render` prop on ``. - + -```tsx showLineNumbers {1,8-10} -import Link from "next/link" +## API Reference -... +### Breadcrumb - - - - - Home - - - {/* ... */} - - -``` +The `Breadcrumb` component is the root navigation element that wraps all breadcrumb components. ---- +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | -### Responsive +### BreadcrumbList -Here's an example of a responsive breadcrumb that composes `` with ``, ``, and ``. +The `BreadcrumbList` component displays the ordered list of breadcrumb items. -It displays a dropdown on desktop and a drawer on mobile. +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | - +### BreadcrumbItem + +The `BreadcrumbItem` component wraps individual breadcrumb items. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbLink + +The `BreadcrumbLink` component displays a clickable link in the breadcrumb. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbPage + +The `BreadcrumbPage` component displays the current page in the breadcrumb (non-clickable). + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbSeparator + +The `BreadcrumbSeparator` component displays a separator between breadcrumb items. You can pass custom children to override the default separator icon. + +| Prop | Type | Default | +| ----------- | ----------------- | ------- | +| `children` | `React.ReactNode` | - | +| `className` | `string` | - | + +### BreadcrumbEllipsis + +The `BreadcrumbEllipsis` component displays an ellipsis indicator for collapsed breadcrumb items. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | diff --git a/apps/v4/content/docs/components/radix/breadcrumb.mdx b/apps/v4/content/docs/components/radix/breadcrumb.mdx index 82d6dd5da1..8303b40afe 100644 --- a/apps/v4/content/docs/components/radix/breadcrumb.mdx +++ b/apps/v4/content/docs/components/radix/breadcrumb.mdx @@ -5,12 +5,7 @@ base: radix component: true --- - + ## Installation @@ -37,7 +32,6 @@ npx shadcn@latest add breadcrumb Update the import paths to match your project setup. @@ -81,142 +75,91 @@ import { ## Examples +### Basic + +A basic breadcrumb with a home link and a components link. + + + ### Custom separator Use a custom component as `children` for `` to create a custom separator. - - -```tsx showLineNumbers {1,10-12} -import { SlashIcon } from "lucide-react" - -... - - - - - Home - - - - - - Components - - - -``` - ---- + ### Dropdown You can compose `` with a `` to create a dropdown in the breadcrumb. - - -```tsx showLineNumbers {1-6,11-21} -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/components/ui/dropdown-menu" - -... - - - - - Components - - - Documentation - Themes - GitHub - - - -``` - ---- + ### Collapsed We provide a `` component to show a collapsed state when the breadcrumb is too long. - - -```tsx showLineNumbers {1,9} -import { BreadcrumbEllipsis } from "@/components/ui/breadcrumb" - -... - - - - {/* ... */} - - - - {/* ... */} - - -``` - ---- + ### Link component To use a custom link component from your routing library, you can use the `asChild` prop on ``. - + -```tsx showLineNumbers {1,8-10} -import Link from "next/link" +## API Reference -... +### Breadcrumb - - - - - Home - - - {/* ... */} - - -``` +The `Breadcrumb` component is the root navigation element that wraps all breadcrumb components. ---- +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | -### Responsive +### BreadcrumbList -Here's an example of a responsive breadcrumb that composes `` with ``, ``, and ``. +The `BreadcrumbList` component displays the ordered list of breadcrumb items. -It displays a dropdown on desktop and a drawer on mobile. +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | - +### BreadcrumbItem + +The `BreadcrumbItem` component wraps individual breadcrumb items. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbLink + +The `BreadcrumbLink` component displays a clickable link in the breadcrumb. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbPage + +The `BreadcrumbPage` component displays the current page in the breadcrumb (non-clickable). + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | + +### BreadcrumbSeparator + +The `BreadcrumbSeparator` component displays a separator between breadcrumb items. You can pass custom children to override the default separator icon. + +| Prop | Type | Default | +| ----------- | ----------------- | ------- | +| `children` | `React.ReactNode` | - | +| `className` | `string` | - | + +### BreadcrumbEllipsis + +The `BreadcrumbEllipsis` component displays an ellipsis indicator for collapsed breadcrumb items. + +| Prop | Type | Default | +| ----------- | -------- | ------- | +| `className` | `string` | - | diff --git a/apps/v4/examples/__index__.tsx b/apps/v4/examples/__index__.tsx index 0cd7b7e69a..6795f630a2 100644 --- a/apps/v4/examples/__index__.tsx +++ b/apps/v4/examples/__index__.tsx @@ -525,19 +525,6 @@ export const ExamplesIndex: Record> = { return { default: mod.default || mod[exportName] } }), }, - "breadcrumb-responsive": { - name: "breadcrumb-responsive", - filePath: "examples/radix/breadcrumb-responsive.tsx", - component: React.lazy(async () => { - const mod = await import("./radix/breadcrumb-responsive") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-responsive" - return { default: mod.default || mod[exportName] } - }), - }, "breadcrumb-separator": { name: "breadcrumb-separator", filePath: "examples/radix/breadcrumb-separator.tsx", @@ -551,32 +538,6 @@ export const ExamplesIndex: Record> = { return { default: mod.default || mod[exportName] } }), }, - "breadcrumb-with-dropdown": { - name: "breadcrumb-with-dropdown", - filePath: "examples/radix/breadcrumb-with-dropdown.tsx", - component: React.lazy(async () => { - const mod = await import("./radix/breadcrumb-with-dropdown") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-with-dropdown" - return { default: mod.default || mod[exportName] } - }), - }, - "breadcrumb-with-link": { - name: "breadcrumb-with-link", - filePath: "examples/radix/breadcrumb-with-link.tsx", - component: React.lazy(async () => { - const mod = await import("./radix/breadcrumb-with-link") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-with-link" - return { default: mod.default || mod[exportName] } - }), - }, "button-as-child": { name: "button-as-child", filePath: "examples/radix/button-as-child.tsx", @@ -7679,19 +7640,6 @@ export const ExamplesIndex: Record> = { return { default: mod.default || mod[exportName] } }), }, - "breadcrumb-responsive": { - name: "breadcrumb-responsive", - filePath: "examples/base/breadcrumb-responsive.tsx", - component: React.lazy(async () => { - const mod = await import("./base/breadcrumb-responsive") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-responsive" - return { default: mod.default || mod[exportName] } - }), - }, "breadcrumb-separator": { name: "breadcrumb-separator", filePath: "examples/base/breadcrumb-separator.tsx", @@ -7705,32 +7653,6 @@ export const ExamplesIndex: Record> = { return { default: mod.default || mod[exportName] } }), }, - "breadcrumb-with-dropdown": { - name: "breadcrumb-with-dropdown", - filePath: "examples/base/breadcrumb-with-dropdown.tsx", - component: React.lazy(async () => { - const mod = await import("./base/breadcrumb-with-dropdown") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-with-dropdown" - return { default: mod.default || mod[exportName] } - }), - }, - "breadcrumb-with-link": { - name: "breadcrumb-with-link", - filePath: "examples/base/breadcrumb-with-link.tsx", - component: React.lazy(async () => { - const mod = await import("./base/breadcrumb-with-link") - const exportName = - Object.keys(mod).find( - (key) => - typeof mod[key] === "function" || typeof mod[key] === "object" - ) || "breadcrumb-with-link" - return { default: mod.default || mod[exportName] } - }), - }, "button-as-child": { name: "button-as-child", filePath: "examples/base/button-as-child.tsx", diff --git a/apps/v4/examples/base/breadcrumb-demo.tsx b/apps/v4/examples/base/breadcrumb-demo.tsx index 506b6ea135..c09ca8e7de 100644 --- a/apps/v4/examples/base/breadcrumb-demo.tsx +++ b/apps/v4/examples/base/breadcrumb-demo.tsx @@ -8,6 +8,7 @@ import { BreadcrumbPage, BreadcrumbSeparator, } from "@/examples/base/ui/breadcrumb" +import { Button } from "@/examples/base/ui/button" import { DropdownMenu, DropdownMenuContent, @@ -21,12 +22,14 @@ export function BreadcrumbDemo() { - }>Home + }>Home - + } + > Toggle menu @@ -41,9 +44,7 @@ export function BreadcrumbDemo() { - }> - Components - + }>Components diff --git a/apps/v4/examples/base/breadcrumb-dropdown.tsx b/apps/v4/examples/base/breadcrumb-dropdown.tsx index 0b89a7b5cc..adc0012970 100644 --- a/apps/v4/examples/base/breadcrumb-dropdown.tsx +++ b/apps/v4/examples/base/breadcrumb-dropdown.tsx @@ -14,7 +14,7 @@ import { DropdownMenuItem, DropdownMenuTrigger, } from "@/examples/base/ui/dropdown-menu" -import { ChevronDownIcon, SlashIcon } from "lucide-react" +import { ChevronDownIcon, DotIcon } from "lucide-react" export function BreadcrumbDropdown() { return ( @@ -24,13 +24,15 @@ export function BreadcrumbDropdown() { }>Home - + - + } + > Components - + @@ -42,7 +44,7 @@ export function BreadcrumbDropdown() { - + Breadcrumb diff --git a/apps/v4/examples/base/breadcrumb-link.tsx b/apps/v4/examples/base/breadcrumb-link.tsx index d0159aba1c..192b3b6fac 100644 --- a/apps/v4/examples/base/breadcrumb-link.tsx +++ b/apps/v4/examples/base/breadcrumb-link.tsx @@ -13,11 +13,13 @@ export function BreadcrumbLinkDemo() { - }>Home + }> + Home + - }> + }> Components diff --git a/apps/v4/examples/base/breadcrumb-responsive.tsx b/apps/v4/examples/base/breadcrumb-responsive.tsx deleted file mode 100644 index d3d2521fa6..0000000000 --- a/apps/v4/examples/base/breadcrumb-responsive.tsx +++ /dev/null @@ -1,139 +0,0 @@ -"use client" - -import * as React from "react" -import Link from "next/link" -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/base/ui/breadcrumb" -import { Button } from "@/examples/base/ui/button" -import { - Drawer, - DrawerClose, - DrawerContent, - DrawerDescription, - DrawerFooter, - DrawerHeader, - DrawerTitle, - DrawerTrigger, -} from "@/examples/base/ui/drawer" -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuGroup, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/examples/base/ui/dropdown-menu" - -import { useMediaQuery } from "@/hooks/use-media-query" - -const items = [ - { href: "#", label: "Home" }, - { href: "#", label: "Documentation" }, - { href: "#", label: "Building Your Application" }, - { href: "#", label: "Data Fetching" }, - { label: "Caching and Revalidating" }, -] - -const ITEMS_TO_DISPLAY = 3 - -export function BreadcrumbResponsive() { - const [open, setOpen] = React.useState(false) - const isDesktop = useMediaQuery("(min-width: 768px)") - - return ( - - - - }> - {items[0].label} - - - - {items.length > ITEMS_TO_DISPLAY ? ( - <> - - {isDesktop ? ( - - - - - - - {items.slice(1, -2).map((item, index) => ( - - - {item.label} - - - ))} - - - - ) : ( - - - - - - - Navigate to - - Select a page to navigate to. - - -
- {items.slice(1, -2).map((item, index) => ( - - {item.label} - - ))} -
- - - - Close - - - - - )} - - - - ) : null} - {items.slice(-ITEMS_TO_DISPLAY + 1).map((item, index) => ( - - {item.href ? ( - <> - } - className="max-w-20 truncate md:max-w-none" - > - {item.label} - - - - ) : ( - - {item.label} - - )} - - ))} - - - ) -} diff --git a/apps/v4/examples/base/breadcrumb-separator.tsx b/apps/v4/examples/base/breadcrumb-separator.tsx index b46ea72923..e623e45b50 100644 --- a/apps/v4/examples/base/breadcrumb-separator.tsx +++ b/apps/v4/examples/base/breadcrumb-separator.tsx @@ -7,7 +7,7 @@ import { BreadcrumbPage, BreadcrumbSeparator, } from "@/examples/base/ui/breadcrumb" -import { SlashIcon } from "lucide-react" +import { DotIcon } from "lucide-react" export function BreadcrumbSeparatorDemo() { return ( @@ -17,7 +17,7 @@ export function BreadcrumbSeparatorDemo() { }>Home - + }> @@ -25,7 +25,7 @@ export function BreadcrumbSeparatorDemo() { - + Breadcrumb diff --git a/apps/v4/examples/base/breadcrumb-with-dropdown.tsx b/apps/v4/examples/base/breadcrumb-with-dropdown.tsx deleted file mode 100644 index 0e4b1b942a..0000000000 --- a/apps/v4/examples/base/breadcrumb-with-dropdown.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/base/ui/breadcrumb" -import { Button } from "@/examples/base/ui/button" -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/examples/base/ui/dropdown-menu" - -export function BreadcrumbWithDropdown() { - return ( - - - - Home - - - - - } - > - - Toggle menu - - - Documentation - Themes - GitHub - - - - - - Components - - - - Breadcrumb - - - - ) -} diff --git a/apps/v4/examples/base/breadcrumb-with-link.tsx b/apps/v4/examples/base/breadcrumb-with-link.tsx deleted file mode 100644 index 05350dd161..0000000000 --- a/apps/v4/examples/base/breadcrumb-with-link.tsx +++ /dev/null @@ -1,34 +0,0 @@ -import Link from "next/link" -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/base/ui/breadcrumb" - -export function BreadcrumbWithLink() { - return ( - - - - Home} /> - - - - - - - - Components} /> - - - - Breadcrumb - - - - ) -} diff --git a/apps/v4/examples/radix/breadcrumb-dropdown.tsx b/apps/v4/examples/radix/breadcrumb-dropdown.tsx index cf38aa76b0..b4d3e01d7e 100644 --- a/apps/v4/examples/radix/breadcrumb-dropdown.tsx +++ b/apps/v4/examples/radix/breadcrumb-dropdown.tsx @@ -14,7 +14,7 @@ import { DropdownMenuItem, DropdownMenuTrigger, } from "@/examples/radix/ui/dropdown-menu" -import { ChevronDownIcon, SlashIcon } from "lucide-react" +import { ChevronDownIcon, DotIcon } from "lucide-react" export function BreadcrumbDropdown() { return ( @@ -26,7 +26,7 @@ export function BreadcrumbDropdown() { - + @@ -44,7 +44,7 @@ export function BreadcrumbDropdown() { - + Breadcrumb diff --git a/apps/v4/examples/radix/breadcrumb-responsive.tsx b/apps/v4/examples/radix/breadcrumb-responsive.tsx deleted file mode 100644 index b0bb93564e..0000000000 --- a/apps/v4/examples/radix/breadcrumb-responsive.tsx +++ /dev/null @@ -1,138 +0,0 @@ -"use client" - -import * as React from "react" -import Link from "next/link" -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/radix/ui/breadcrumb" -import { Button } from "@/examples/radix/ui/button" -import { - Drawer, - DrawerClose, - DrawerContent, - DrawerDescription, - DrawerFooter, - DrawerHeader, - DrawerTitle, - DrawerTrigger, -} from "@/examples/radix/ui/drawer" -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuGroup, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/examples/radix/ui/dropdown-menu" - -import { useMediaQuery } from "@/hooks/use-media-query" - -const items = [ - { href: "#", label: "Home" }, - { href: "#", label: "Documentation" }, - { href: "#", label: "Building Your Application" }, - { href: "#", label: "Data Fetching" }, - { label: "Caching and Revalidating" }, -] - -const ITEMS_TO_DISPLAY = 3 - -export function BreadcrumbResponsive() { - const [open, setOpen] = React.useState(false) - const isDesktop = useMediaQuery("(min-width: 768px)") - - return ( - - - - - {items[0].label} - - - - {items.length > ITEMS_TO_DISPLAY ? ( - <> - - {isDesktop ? ( - - - - - - - {items.slice(1, -2).map((item, index) => ( - - - {item.label} - - - ))} - - - - ) : ( - - - - - - - Navigate to - - Select a page to navigate to. - - -
- {items.slice(1, -2).map((item, index) => ( - - {item.label} - - ))} -
- - - - - - - - )} - - - - ) : null} - {items.slice(-ITEMS_TO_DISPLAY + 1).map((item, index) => ( - - {item.href ? ( - <> - - {item.label} - - - - ) : ( - - {item.label} - - )} - - ))} - - - ) -} diff --git a/apps/v4/examples/radix/breadcrumb-separator.tsx b/apps/v4/examples/radix/breadcrumb-separator.tsx index ed7b6391fa..0eb1a417ac 100644 --- a/apps/v4/examples/radix/breadcrumb-separator.tsx +++ b/apps/v4/examples/radix/breadcrumb-separator.tsx @@ -7,7 +7,7 @@ import { BreadcrumbPage, BreadcrumbSeparator, } from "@/examples/radix/ui/breadcrumb" -import { SlashIcon } from "lucide-react" +import { DotIcon } from "lucide-react" export function BreadcrumbSeparatorDemo() { return ( @@ -19,7 +19,7 @@ export function BreadcrumbSeparatorDemo() { - + @@ -27,7 +27,7 @@ export function BreadcrumbSeparatorDemo() { - + Breadcrumb diff --git a/apps/v4/examples/radix/breadcrumb-with-dropdown.tsx b/apps/v4/examples/radix/breadcrumb-with-dropdown.tsx deleted file mode 100644 index a35007a8b9..0000000000 --- a/apps/v4/examples/radix/breadcrumb-with-dropdown.tsx +++ /dev/null @@ -1,52 +0,0 @@ -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/radix/ui/breadcrumb" -import { Button } from "@/examples/radix/ui/button" -import { - DropdownMenu, - DropdownMenuContent, - DropdownMenuItem, - DropdownMenuTrigger, -} from "@/examples/radix/ui/dropdown-menu" - -export function BreadcrumbWithDropdown() { - return ( - - - - Home - - - - - - - - - Documentation - Themes - GitHub - - - - - - Components - - - - Breadcrumb - - - - ) -} diff --git a/apps/v4/examples/radix/breadcrumb-with-link.tsx b/apps/v4/examples/radix/breadcrumb-with-link.tsx deleted file mode 100644 index c8b99dc32f..0000000000 --- a/apps/v4/examples/radix/breadcrumb-with-link.tsx +++ /dev/null @@ -1,38 +0,0 @@ -import Link from "next/link" -import { - Breadcrumb, - BreadcrumbEllipsis, - BreadcrumbItem, - BreadcrumbLink, - BreadcrumbList, - BreadcrumbPage, - BreadcrumbSeparator, -} from "@/examples/radix/ui/breadcrumb" - -export function BreadcrumbWithLink() { - return ( - - - - - Home - - - - - - - - - - Components - - - - - Breadcrumb - - - - ) -}