hperrin / svelte-material-ui

Svelte Material UI Components
https://sveltematerialui.com/
Apache License 2.0
3.28k stars 288 forks source link

InitialFocus in dialog ignored when using conditional rendering #576

Open pboguslawski opened 1 year ago

pboguslawski commented 1 year ago

Describe the bug Forcing initial button focus in dialog with 2 buttons using defaultAction use={[InitialFocus]} like on https://sveltematerialui.com/demo/dialog/ does not work when one button or two buttons are rendered conditionally i.e. when

    <Actions>
        {#if $condition}
            <Button action="retry">
                <Label>Retry</Label>
            </Button>
        {/if}
        <Button action="reload" defaultAction use={[InitialFocus]}>
            <Label>Reload</Label>
        </Button>
    </Actions>

or

    <Actions>
        {#if $condition}
        <Button action="retry">
            <Label>Retry</Label>
        </Button>
        <Button action="reload"  defaultAction use={[InitialFocus]}>
            <Label>Reload</Label>
        </Button>
        {/if}
    </Actions>

retry button is initially focused not reload. No such problem when not conditional rendering is used i.e.

    <Actions>
        <Button action="retry">
            <Label>Retry</Label>
        </Button>
        <Button action="reload"  defaultAction use={[InitialFocus]}>
            <Label>Reload</Label>
        </Button>
    </Actions>

Expected behavior Initial focus is set on reload in both above scenarios when condition is true.