feat: apply locale and writing direction

FINALLY! I can look into translated UIs in Storybook with Svelte!

Signed-off-by: André Jaenisch <andre.jaenisch@posteo.de>
This commit is contained in:
André Jaenisch 2024-02-28 21:30:24 +01:00
parent dc707869b4
commit 6e03027b4c
No known key found for this signature in database
GPG key ID: 5A668E771F1ED854

View file

@ -1,6 +1,8 @@
import type { Preview } from '@storybook/svelte'; import type { Preview } from '@storybook/svelte';
import { init, locale, register } from 'svelte-i18n'; import { init, locale, register } from 'svelte-i18n';
import { mapLocaleToDir } from '../src/lib/i18n/index.ts';
// See src/routes/+layout.svelte // See src/routes/+layout.svelte
// Order is important! // Order is important!
import '../src/theme.postcss'; import '../src/theme.postcss';
@ -14,6 +16,15 @@ register('he', () => import('../src/lib/i18n/locales/he.json'));
init({ fallbackLocale: 'en', initialLocale: 'en' }); init({ fallbackLocale: 'en', initialLocale: 'en' });
locale.set('en'); locale.set('en');
function withI18n(storyFn, context) {
const l = context.globals.locale;
locale.set(l);
document.dir = mapLocaleToDir(l);
return storyFn();
}
const preview: Preview = { const preview: Preview = {
globalTypes: { globalTypes: {
locale: { locale: {
@ -49,4 +60,6 @@ const preview: Preview = {
} }
}; };
export const decorators = [withI18n];
export default preview; export default preview;