Locale Provider - Chakra Ui

Usage

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

Most Chakra UI components that read the locale set by the LocaleProvider.

jsx

import { LocaleProvider, useLocaleContext } from "@chakra-ui/react"

jsx

<LocaleProvider locale="..."></LocaleProvider>

Set the locale prop to the locale you want to use.

jsx

<LocaleProvider locale="ar-BH">
  <Component />
</LocaleProvider>

jsx

export const Usage = () => {
  const { locale, dir } = useLocaleContext()
  return <pre>{JSON.stringify({ locale, dir }, null, 2)}</pre>
}