@page "/Storage"
<PageTitle>Storage</PageTitle>
<script type="module" src="@Assets["Components/Pages/Storage.razor.js"]"></script>

<main>
    <Panel>
        <LegendContent>
            Stores
            <button id="newStoreButton">New</button>
        </LegendContent>
        <ChildContent>
            <div id="storeList" class="grid-stores">
            </div>
        </ChildContent>
    </Panel>

    <dialog id="inputDialog">
        <Panel LegendId="inputTitle">
            <form method="dialog" id="inputForm">
                <p>
                    <input id="inputDialogInput" type="text"/>
                </p>
                <div class="flex-row">
                    <button type="submit">Confirm</button>
                    <button id="cancelInputButton" type="reset">Cancel</button>
                </div>
            </form>
        </Panel>
    </dialog>

    <dialog id="confirmDialog">
        <Panel Legend="Are you sure?">
            <form method="dialog" id="confirmForm">
                <p id="confirmMessage">
                </p>
                <div class="flex-row">
                    <button type="submit">Confirm</button>
                    <button id="cancelConfirmButton" type="reset">Cancel</button>
                </div>
            </form>
        </Panel>
    </dialog>

    <div id="openedStores">
    </div>
    <Log/>
</main>