From 8f107dbe8e44139ff9184494bcc123cc4d6fe1e2 Mon Sep 17 00:00:00 2001
From: MRBadri <badri0000badri@gmail.com>
Date: Sat, 9 Mar 2024 17:57:14 +0330
Subject: [PATCH] fix(breadcrumbs): add RTL support to the breadcrumbs
 component (#2486)

---
 .changeset/red-terms-rule.md                        | 5 +++++
 packages/components/breadcrumbs/src/breadcrumbs.tsx | 6 +++++-
 2 files changed, 10 insertions(+), 1 deletion(-)
 create mode 100644 .changeset/red-terms-rule.md

diff --git a/.changeset/red-terms-rule.md b/.changeset/red-terms-rule.md
new file mode 100644
index 0000000000..8eddf102d7
--- /dev/null
+++ b/.changeset/red-terms-rule.md
@@ -0,0 +1,5 @@
+---
+"@nextui-org/breadcrumbs": patch
+---
+
+Add RTL support to the breadcrumbs component
diff --git a/packages/components/breadcrumbs/src/breadcrumbs.tsx b/packages/components/breadcrumbs/src/breadcrumbs.tsx
index 67f5c32a5c..2d1fa3b82c 100644
--- a/packages/components/breadcrumbs/src/breadcrumbs.tsx
+++ b/packages/components/breadcrumbs/src/breadcrumbs.tsx
@@ -14,7 +14,11 @@ const Breadcrumbs = forwardRef<"div", BreadcrumbsProps>((props, ref) => {
     children,
     childCount,
     itemProps,
-    separator = <ChevronRightIcon />,
+    separator = (
+      <div className="rtl:transform rtl:rotate-180">
+        <ChevronRightIcon />
+      </div>
+    ),
     maxItems,
     itemsBeforeCollapse,
     itemsAfterCollapse,