Direction | Tile UI Solid

Hook value: ltr

Start aligned text follows the provider direction.

import { createSignal } from 'solid-js';
import { Button, DirectionProvider, useDirection } from '@tile-ui/solid';

function DirectionValue() {
	const direction = useDirection();
	return <p class="component-preview__text">Hook value: {direction()}</p>;

Use DirectionProvider and useDirection when layout behavior must react to LTR or RTL reading direction.

Registry install

pnpm dlx shadcn@latest add @tile-ui/direction

Package usage

import { DirectionProvider } from '@tile-ui/solid';

<DirectionProvider dir="rtl">
	<App />
</DirectionProvider>

Highlights

Reactive provider value
useDirection accessor hook
Normalized LTR and RTL DOM direction

Registry dependencies

Item	Purpose
`direction`	Component source and module styles
`core`	Framework-agnostic logic helpers
`styles`	Shared SCSS tokens and globals

API reference

DirectionProvider

Prop	Type	Default
`dir`	`'ltr' \| 'rtl'`	—
`direction`	`DirectionValue`	—

useDirection

Prop	Type	Default
`return`	`Accessor<DirectionValue>`	—