Динамическое использование FontAwesome в Svelte Native

Question

Я хотел бы сделать что-то вроде этого:

      <script lang="ts">
  const icons = { bars: "&#xf0c9;" };
</script>

<page>
    <actionBar>
        <gridLayout columns="40, *" class="action-header">
            <label row="0" col="0" class="button-selected">
                <formattedString>
                    <span class="fas" text={icons.bars} />
                </formattedString>
            </label>
            <label row="0" col="1" text="App Header" />
        </gridLayout>
    </action Bar>
</page>

Однако, когда я пытаюсь это сделать, я получаю необработанный текст () вместо значка, как ожидалось. Если я вставлю это значение напрямую, оно будет вести себя правильно. Что мне нужно сделать, чтобы правильно проанализировать динамическое значение?