Ищем рабочий пример сплит-кнопки smui

Question

Я следую примеру SMUI здесь:https://sveltematerialui.com/demo/button/

и я написал этот компонент (UserDropdown):

      <script>
    import Button, { Group, GroupItem, Icon } from '@smui/button';
    import Menu from '@smui/menu';
    import List, { Item, Separator, Text } from '@smui/list';

    let menu
    export let user
    export let onLogout
</script>

{#if user && user.hasOwnProperty('username')}
    <Group variant="outlined">
        <Button variant="outlined">
           Logged in as: { user.username }
        </Button>
        <div use:GroupItem>
            <Button on:click={() => menu.setOpen(true)} variant="raised" style="padding: 0; min-width: 36px;">
                <Icon class="material-icons" style="margin: 0;">arrow_drop_down</Icon>
            </Button>
            <Menu bind:this={menu} anchorCorner="TOP_LEFT">
                <List>
                    <Item on:SMUI:action={onLogout}>
                        <Text>Logout</Text>
                    </Item>
                </List>
            </Menu>
        </div>
    </Group>

{:else}

<div>
    <a href="/login">LOGIN</a>
</div>
{/if}

Несмотря на то, что код почти дословно взят с сайта SMUI, он не работает. Я получаю эту ошибку:

      Cannot read properties of null (reading 'SmuiElement')
TypeError: Cannot read properties of null (reading 'SmuiElement')
    at CommonIcon.svelte:32:23
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1771:22)
    at Object.default (/src/lib/components/UserDropdown.svelte:43:96)
    at Object.default (/node_modules/@smui/button/dist/Button.svelte:195:34)
    at eval (/node_modules/@smui/common/dist/SmuiElement.svelte:62:40)
    at eval (/node_modules/@smui/common/dist/SmuiElement.svelte:63:7)
    at SmuiElement.svelte:11:10
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1771:22)
    at Button.svelte:2:17
    at Object.$$render (/node_modules/svelte/internal/index.mjs:1771:22)

У кого-нибудь есть рабочий пример сплит-кнопки SMUI, который работает с 7.0 beta 1?

Спасибо

Answer 1

У меня была такая же проблема. Когда я проверял, у меня не было@smui/buttonв моем package.json

Просто делать

      npm i @smui/button

И это должно работать

Answer 2

У меня была такая же проблема с использованием DataTable, и я исправил ее, импортировав метку из@smui/data-tableвместо@smui/common. В конце концов они указывают на один и тот же файл, поэтому я действительно не понимаю причину ошибки, но она ее решила.