Svelte mui Select игнорирует обработчик on:change

Question

У меня есть базовый пример элемента управления Select, к которому я пытаюсь прикрепить обработчик onChange:

      <script type="ts">
    import Select, { Option } from '@smui/select';

    const onChange = () => {
        console.log('on change!');
    };

    let fruits = ['Apple', 'Orange', 'Banana', 'Mango'];

    let value = 'Orange';
</script>

          <div>
        <Select bind:value label="Select Menu" on:change={onChange}>
          {#each fruits as fruit}
            <Option value={fruit}>{fruit}</Option>
          {/each}
        </Select>
    
        <pre class="status">Selected: {value}</pre>
      </div>

Однако обработчик событий игнорируется. Я использую последние версии smui и svelte.

Answer 1

Для каждого исходного кода компонента правильное событие:on:SMUISelect:change:

      <script type="ts">
    import Select, { Option } from '@smui/select';

    const onChange = () => {
        console.log('on change!');
    };

    let fruits = ['Apple', 'Orange', 'Banana', 'Mango'];

    let value = 'Orange';
</script>

<div>
    <Select bind:value label="Select Menu" on:SMUISelect:change={onChange}>
        {#each fruits as fruit}
        <Option value={fruit}>{fruit}</Option>
        {/each}
    </Select>

    <pre class="status">Selected: {value}</pre>
</div>