Your bookmarks

Dictionary

Common microcopy for our components in more than 25 languages.

We added support to our own dictionary. It handles common translations in components like Close

You have available our dictionary in @kiwicom/orbit-components/lib/data/dictionary/... There are files which contains our own translations.

Example:

import en_GB from "@kiwicom/orbit-components/lib/data/dictionary/en-GB.json"; 
import ThemeProvider from "@kiwicom/orbit-components/lib/ThemeProvider";
import Tooltip from "@kiwicom/orbit-components/lib/Tooltip";
import Heading from "@kiwicom/orbit-components/lib/Heading";

const App = () => 
  <ThemeProvider dictionary={en_GB}>
    <Tooltip content="Write your text here. If it’s longer than three li…">
      <Heading>
        Orbit design system
      </Heading>
    </Tooltip>
  </ThemeProvider>;

Fallbacks

  • If translation key not exists in your language the fallback is en_GB which is our default lang
  • If translation key not exists in both files (your language, default language), the translation key will be rendered e.g. button_close

Your own dictionary

There is option to add your own dictionary, just pass object containing keys and values.

import ThemeProvider from "@kiwicom/orbit-components/lib/ThemeProvider";

const App = () => 
  <ThemeProvider dictionary={{
    "button_close": "My own translation"
  }}>
    <Button type="secondary" size="large" />
  </ThemeProvider>;

Languages

We store all inner string we translate inside of our Github repository and export them to NPM.