feat

apps/v4/content/docs/components/base/alert-dialog.mdx

@@ -146,6 +146,17 @@ Use the `AlertDialogAction` component to add a destructive action button to the
   previewClassName="h-56"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="alert-dialog-rtl"
+  direction="rtl"
+  previewClassName="h-56"
+/>
+
 ## API Reference
 
 ### size

apps/v4/content/docs/components/base/alert.mdx

@@ -109,6 +109,17 @@ You can customize the alert colors by adding custom classes such as `bg-amber-50
   previewClassName="h-auto sm:h-72 p-6"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="alert-rtl"
+  direction="rtl"
+  previewClassName="h-auto sm:h-72 p-6"
+/>
+
 ## API Reference
 
 ### Alert

apps/v4/content/docs/components/base/aspect-ratio.mdx

@@ -79,6 +79,17 @@ A portrait aspect ratio component using the `ratio={9 / 16}` prop. This is usefu
   previewClassName="h-96"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="aspect-ratio-rtl"
+  direction="rtl"
+  previewClassName="h-96"
+/>
+
 ## API Reference
 
 ### AspectRatio

apps/v4/content/docs/components/base/avatar.mdx

@@ -129,6 +129,17 @@ You can use the `Avatar` component as a trigger for a dropdown menu.
 
 <ComponentPreview styleName="base-nova" name="avatar-dropdown" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="avatar-rtl"
+  direction="rtl"
+  previewClassName="h-72"
+/>
+
 ## API Reference
 
 ### Avatar

apps/v4/content/docs/components/base/badge.mdx

@@ -85,6 +85,16 @@ You can customize the colors of a badge by adding custom classes such as `bg-gre
 
 <ComponentPreview styleName="base-nova" name="badge-colors" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="badge-rtl"
+  direction="rtl"
+/>
+
 ## API Reference
 
 ### Badge

apps/v4/content/docs/components/base/breadcrumb.mdx

@@ -116,6 +116,17 @@ To use a custom link component from your routing library, you can use the `rende
 
 <ComponentPreview styleName="base-nova" name="breadcrumb-link" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="base-nova"
+  name="breadcrumb-rtl"
+  direction="rtl"
+  previewClassName="p-2"
+/>
+
 ## API Reference
 
 ### Breadcrumb

apps/v4/content/docs/components/base/dropdown-menu.mdx

@@ -170,8 +170,6 @@ To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl)
   direction="rtl"
 />
 
-
-
 ## API Reference
 
 See the [Base UI documentation](https://base-ui.com/react/components/dropdown-menu) for the full API reference.

apps/v4/content/docs/components/base/sidebar.mdx

@@ -5,12 +5,7 @@ base: base
 component: true
 ---
 
-<figure className="flex flex-col gap-4">
-  <ComponentPreview styleName="base-nova" name="sidebar-demo" type="block" />
-  <figcaption className="text-center text-sm text-gray-500">
-    A sidebar that collapses to icons.
-  </figcaption>
-</figure>
+<ComponentPreview styleName="base-nova" name="sidebar-demo" type="block" caption="A sidebar that collapses to icons." />
 
 Sidebars are one of the most complex components to build. They are central
 to any application and often contain a lot of moving parts.

apps/v4/content/docs/components/radix/alert-dialog.mdx

@@ -146,6 +146,17 @@ Use the `AlertDialogAction` component to add a destructive action button to the
   previewClassName="h-56"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="alert-dialog-rtl"
+  direction="rtl"
+  previewClassName="h-56"
+/>
+
 ## API Reference
 
 ### size

apps/v4/content/docs/components/radix/alert.mdx

@@ -113,6 +113,17 @@ You can customize the alert colors by adding custom classes such as `bg-amber-50
   previewClassName="h-auto sm:h-72 p-6"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="alert-rtl"
+  direction="rtl"
+  previewClassName="h-auto sm:h-72 p-6"
+/>
+
 ## API Reference
 
 ### Alert

apps/v4/content/docs/components/radix/aspect-ratio.mdx

@@ -82,6 +82,17 @@ A portrait aspect ratio component using the `ratio={9 / 16}` prop. This is usefu
   previewClassName="h-96"
 />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="aspect-ratio-rtl"
+  direction="rtl"
+  previewClassName="h-96"
+/>
+
 ## API Reference
 
 ### AspectRatio

apps/v4/content/docs/components/radix/avatar.mdx

@@ -145,6 +145,17 @@ You can use the `Avatar` component as a trigger for a dropdown menu.
 
 <ComponentPreview styleName="radix-nova" name="avatar-dropdown" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="avatar-rtl"
+  direction="rtl"
+  previewClassName="h-72"
+/>
+
 ## API Reference
 
 ### Avatar

apps/v4/content/docs/components/radix/badge.mdx

@@ -81,6 +81,16 @@ You can customize the colors of a badge by adding custom classes such as `bg-gre
 
 <ComponentPreview styleName="radix-nova" name="badge-colors" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="badge-rtl"
+  direction="rtl"
+/>
+
 ## API Reference
 
 ### Badge

apps/v4/content/docs/components/radix/breadcrumb.mdx

@@ -110,6 +110,17 @@ To use a custom link component from your routing library, you can use the `asChi
 
 <ComponentPreview styleName="radix-nova" name="breadcrumb-link" />
 
+## RTL
+
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
+
+<ComponentPreview
+  styleName="radix-nova"
+  name="breadcrumb-rtl"
+  direction="rtl"
+  previewClassName="p-2"
+/>
+
 ## API Reference
 
 ### Breadcrumb

apps/v4/content/docs/components/radix/dropdown-menu.mdx

@@ -163,9 +163,9 @@ A richer example combining groups, icons, and submenus.
 
 <ComponentPreview styleName="radix-nova" name="dropdown-menu-complex" />
 
-### RTL
+## RTL
 
-Wrap your menu in `DirectionProvider` for right-to-left support.
+To enable RTL support in shadcn/ui, see the [RTL configuration guide](/docs/rtl).
 
 <ComponentPreview
   styleName="radix-nova"