Localized (legacy)

The Localized component exported from @nubolab-ffwd/svelte-fluent/legacy is a wrapper around the regular Localized component that allows you to use slots instead of snippets.

import { Localized } from '@nubolab-ffwd/svelte-fluent/legacy';

Props

Name	Type	Default	Description
`id`	`string`	`undefined`	Unique identifier for the translation
`args`	`Record<string, FluentVariable>`	`undefined`	Arguments for interpolation

Slots & Slot props

Slots are provided for backwards compatibility. New code should opt to use snippets.

Name	Prop	Type	Description
`default`	`text`	`string`	Translated message
`default`	`attrs`	`Record<string, string>`	Attributes of the translation

Example

<script>
	import { Localized } from '@nubolab-ffwd/svelte-fluent/legacy';
</script>

<Localized id="confirm" let:text let:attrs>
	<div>{text}</div>
	<div>
		<button onclick={() => alert('OK clicked')}>{attrs.ok}</button>
		<button onclick={() => alert('Cancel clicked')}>{attrs.cancel}</button>
	</div>
</Localized>

en.ftl

confirm = Please confirm the action.
  .ok     = Ok
  .cancel = Cancel

Result:

Please confirm the action.