Direction component
Install
npx shadcn add https://ui.happenings.social/r/direction.json
Or with namespace
npx shadcn add @happenings/direction
Preview
RTL/LTR direction provider. Wraps your app to support bidirectional text layout.
Dependencies
src/components/ui/direction.tsx
"use client"
import * as React from "react"
import { Direction } from "radix-ui"
function DirectionProvider({
dir,
direction,
children,
}: React.ComponentProps<typeof Direction.DirectionProvider> & {
direction?: React.ComponentProps<typeof Direction.DirectionProvider>["dir"]
}) {
return (
<Direction.DirectionProvider dir={direction ?? dir}>
{children}
</Direction.DirectionProvider>
)
}
const useDirection = Direction.useDirection
export { DirectionProvider, useDirection }