@pico-intl-dev/svelte

Svelte store bindings for pico-intl.

Status: stable v1 for Svelte apps covered by the published Svelte + Vite adoption fixture. SvelteKit route-level behavior is not part of the stable contract until a dedicated fixture lands.

Install

npm install @pico-intl-dev/core @pico-intl-dev/svelte svelte

Usage

// src/lib/i18n.ts
import { createI18n } from '@pico-intl-dev/core';
import { createI18nStore } from '@pico-intl-dev/svelte';

const i18n = createI18n({
  base: 'en',
  locale: 'en',
  messages: { greeting: 'Hello, {{name}}' },
});

export const { t, locale, dir, isRTL, setLocale, i18n: rawI18n } = createI18nStore(i18n);

<script lang="ts">
  import { dir, locale, setLocale, t } from '$lib/i18n';
</script>

<h1 dir={$dir}>{$t('greeting', { name: 'Ana' })}</h1>
<p>{$locale}</p>
<button on:click={() => setLocale('es')}>Spanish</button>

API

| Export | Purpose | | --- | --- | | createI18nStore(i18n) | Creates Svelte-readable stores from a PicoIntlInstance | | t | Readable store emitting the translate function | | locale | Readable store emitting the current locale | | dir | Readable store emitting ltr or rtl for the current locale | | isRTL | Readable store emitting whether the current locale is RTL | | setLocale() | Locale switcher | | i18n | Raw instance |

Production notes

• This package uses the Svelte store contract and does not depend on browser globals.
• For SvelteKit, decide whether the instance is per-request or client-side singleton based on your app architecture.

Verification

npm run build:all
npm run test:integration