Direction

Open-code aq-ui accessible component family for Direction.

Preview

This is a live example. Interact with the available controls and use the keyboard to inspect the component's states and behavior.

Text direction

Logical spacing and icons follow the active direction.

Direction-aware content

Start and end adapt automatically.

LTR

Loading interactive preview…

pnpm dlx aq-ui@alpha add direction

Client module

Import the parts you need, then jump to an export for its contract.

"use client"

import { DirectionProvider } from "@/components/ui/direction"

<DirectionProvider />

const

Open-code aq-ui accessible component family for Direction.

export { DirectionProvider } from "@base-ui/react/direction-provider"

function

Public function export from Direction.

export { useDirection } from "@base-ui/react/direction-provider"

@base-ui/react@^1.7.0