i18n Plugin

The i18n plugin provides support for multiple languages and locales. By default, Day Flow core only includes the English (en-US) locale to keep the bundle size as small as possible.

Installation

Install the i18n plugin package:


npm install @dayflow/plugin-localization
# or
pnpm add @dayflow/plugin-localization

Usage

To enable support for additional languages, register the plugin and provide the desired locale objects.


import { useCalendarApp, DayFlowCalendar } from '@dayflow/core';
import {
  createLocalizationPlugin,
  zh,
  ja,
  fr,
} from '@dayflow/plugin-localization';
 
function MyCalendar() {
  const calendar = useCalendarApp({
    views: [
      /* your views */
    ],
    plugins: [
      createLocalizationPlugin({
        locales: [zh, ja, fr], // Register the languages you need
      }),
    ],
    locale: 'zh-CN', // Set the current locale
  });
 
  return <DayFlowCalendar calendar={calendar} />;
}

Configuration

The plugin accepts a list of Locale objects to register in the global locale registry.


interface LocalizationConfig {
  locales: Locale[];
}

Available Locales

The following locales are currently available in the @dayflow/plugin-localization package:

Export	Language	Locale Code
`zh`	Chinese	`zh-CN`
`ja`	Japanese	`ja-JP`
`ko`	Korean	`ko-KR`
`fr`	French	`fr-FR`
`de`	German	`de-DE`
`es`	Spanish	`es-ES`
`en`	English	`en-US` (Also built-in to core)

Custom Locales

You can also register your own custom locales without using the plugin, or by passing them to the plugin:


const myCustomLocale = {
  code: 'pt-BR',
  messages: {
    today: 'Hoje',
    day: 'Dia',
    week: 'Semana',
    month: 'Mês',
    // ... all other translation keys
  },
};
 
const calendar = useCalendarApp({
  plugins: [
    createLocalizationPlugin({
      locales: [myCustomLocale],
    }),
  ],
  locale: 'pt-BR',
});