Ark Logo
GitHub
Providers
Locale

Locale

Locale provider for setting the locale and direction of the app.

Setup

The LocaleProvider component sets the locale for your app, formatting dates, numbers, and other locale-specific data.

Note: If no LocaleProvider is setup, the default locale for the app will be en-US and therefore the direction will be ltr.

import { LocaleProvider } from '@ark-ui/react'

export const App = () => {
  return <LocaleProvider locale="de-DE">{/* Your App */}</LocaleProvider>
}

Usage

To access the current locale and direction settings, use the useLocaleContext hook.

import { useLocaleContext } from '@ark-ui/react'

export const Usage = () => {
  const { locale, dir } = useLocaleContext()

  return <pre>{JSON.stringify({ locale, dir }, null, 2)}</pre>
}

API Reference

LocaleProvider

PropDefaultType
locale'en-US'
string

The locale to use for the application.