Дублирование img при создании пользовательских модальных окон компонента скелета

Question

Я используюskeleton@0.86.9, стройный обвес и попутный ветер.
Я хочу создать модальное окно пользовательского компонента (см. https://www.skeleton.dev/utilities/modals в разделе «модальные окна компонента») для отображения изображения. Модальное окно вызывается через функцию, которая также передает конкретный URL-адрес img.
Проблема: при открытии модального окна изображение отображается дважды. 1. Изображение, как если бы у меня не было специального компонента, и 2. Пользовательское изображение, визуализированное с помощьюimghtml с моими пользовательскими стилями. Я хотел бы показать только второй.

Кодовый блок, вызывающий модальную функцию:

      <div
            on:click="{() => componentModal({ image: image })}"
            class="image h-56 w-56 shrink-0 rounded bg-cover duration-300"
            style="background-image: url({image})"
          ></div>

Сама модальная функция:

      export const componentModal = (settings: Partial<ModalSettings>): Promise<void> =>
  new Promise((resolve, reject) => {
    modalStore.trigger({
      type: 'component',
      component: { ref: FileModal },
      image: '/favicon.png',
      response: (r) => (r ? resolve() : reject()),
      ...settings,
    });
  });

:

      <script lang="ts">
  import { modalStore } from '@skeletonlabs/skeleton';

  const cImage = 'max-w-[90%] max-h-[90%] rounded-container-token overflow-hidden shadow-xl';
</script>

{#if $modalStore[0]}
  <!-- Image -->
  <img src="{$modalStore[0].image}" class="{cImage}" alt="Example" />
{/if}

Кроме того, я получаю два предупреждения в консоли браузера:

1. <FileModal> received an unexpected slot "default"
2. <FileModal> was created with unknown prop 'parent'Последнее связано только с тем фактом, что у меня нетexport let parent...установить вFileModal.svelte

Answer 1

Как оказалось, нужно использовать правильную версию скелета (т.е.1.10.x).

Кажется,type: componentпросто не поддерживалось наv0.89.6.