snapshot of https://github.com/shadcn-ui/ui.git (main, 2026-09-15; blobs > 131072B omitted)

2026-09-15 22:44:43 +05:00
commit 1416db152c
5727 changed files with 630238 additions and 0 deletions
--- a/apps/v4/registry/bases/aria/ui/breadcrumb.tsx
+++ b/apps/v4/registry/bases/aria/ui/breadcrumb.tsx
@@ -0,0 +1,140 @@
+"use client"
+
+import * as React from "react"
+import { cn } from "cn"
+import {
+  Breadcrumb as BreadcrumbPrimitive,
+  Breadcrumbs as BreadcrumbsPrimitive,
+  composeRenderProps,
+  Link as LinkPrimitive,
+  type BreadcrumbProps,
+  type BreadcrumbsProps,
+  type LinkProps,
+} from "react-aria-components"
+
+import { IconPlaceholder } from "@/app/(create)/components/icon-placeholder"
+
+function Breadcrumb({ className, ...props }: React.ComponentProps<"nav">) {
+  return (
+    <nav
+      aria-label="breadcrumb"
+      data-slot="breadcrumb"
+      className={cn("cn-breadcrumb", className)}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbList<T extends object>({
+  className,
+  ...props
+}: BreadcrumbsProps<T>) {
+  return (
+    <BreadcrumbsPrimitive
+      data-slot="breadcrumb-list"
+      className={cn(
+        "cn-breadcrumb-list flex flex-wrap items-center wrap-break-word",
+        className
+      )}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbItem({
+  className,
+  children,
+  separatorClassName,
+  ...props
+}: BreadcrumbProps & { separatorClassName?: string }) {
+  return (
+    <BreadcrumbPrimitive
+      data-slot="breadcrumb-item"
+      className={cn("cn-breadcrumb-item inline-flex items-center", className)}
+      {...props}
+    >
+      {composeRenderProps(children, (children, { isCurrent }) => (
+        <>
+          {children}
+          {!isCurrent && (
+            <span
+              data-slot="breadcrumb-separator"
+              role="presentation"
+              aria-hidden="true"
+              className={cn("cn-breadcrumb-separator", separatorClassName)}
+            >
+              <IconPlaceholder
+                lucide="ChevronRightIcon"
+                tabler="IconChevronRight"
+                hugeicons="ArrowRight01Icon"
+                phosphor="CaretRightIcon"
+                remixicon="RiArrowRightSLine"
+                className="cn-rtl-flip"
+              />
+            </span>
+          )}
+        </>
+      ))}
+    </BreadcrumbPrimitive>
+  )
+}
+
+function BreadcrumbLink({ className, render, ...props }: LinkProps) {
+  return (
+    <LinkPrimitive
+      data-slot="breadcrumb-link"
+      className={cn("cn-breadcrumb-link", className)}
+      render={render}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbPage({ className, ...props }: React.ComponentProps<"span">) {
+  return (
+    <span
+      data-slot="breadcrumb-page"
+      role="link"
+      aria-disabled="true"
+      aria-current="page"
+      className={cn("cn-breadcrumb-page", className)}
+      {...props}
+    />
+  )
+}
+
+function BreadcrumbEllipsis({
+  className,
+  ...props
+}: React.ComponentProps<"span">) {
+  return (
+    <span
+      data-slot="breadcrumb-ellipsis"
+      role="presentation"
+      aria-hidden="true"
+      className={cn(
+        "cn-breadcrumb-ellipsis flex items-center justify-center",
+        className
+      )}
+      {...props}
+    >
+      <IconPlaceholder
+        lucide="MoreHorizontalIcon"
+        tabler="IconDots"
+        hugeicons="MoreHorizontalCircle01Icon"
+        phosphor="DotsThreeIcon"
+        remixicon="RiMoreLine"
+      />
+      <span className="sr-only">More</span>
+    </span>
+  )
+}
+
+export {
+  Breadcrumb,
+  BreadcrumbList,
+  BreadcrumbItem,
+  BreadcrumbLink,
+  BreadcrumbPage,
+  BreadcrumbEllipsis,
+}