{#snippet menuButton( item: Item, index: number, isSub = false, )}
{ event.stopPropagation(); if (item.items) { if (active === index && submenuOpen) closeSubmenu(); else { active = index; openSubmenu(item.items); } } else { exec(item.action); } }} > {item.label} {#if item.items}
→
{/if}
{/snippet}
{ if (event.target === event.currentTarget) onclose(); }} oncontextmenu={(event) => { event.preventDefault(); onclose(); }} >
0 && height > 0} onpointermove={(event) => hoverItem(event, false)} onkeydown={onKey} bind:clientWidth={width} bind:clientHeight={height} role="menu" aria-label={t("shortcut.context_menu")} aria-owns={submenuOpen ? submenuId : undefined} aria-activedescendant={submenuOpen && subActive !== null ? `${componentId}-sub-${subActive}` : active === null ? undefined : `${componentId}-${active}`} tabindex="0" > {#each items as item, index} {#if item.type === "separator"}
{:else} {@render menuButton(item, index)} {/if} {/each}
{#if submenuOpen && activeItem?.items}
0 && submenuHeight > 0} onpointermove={(event) => hoverItem(event, true)} bind:this={submenuElement} bind:clientWidth={submenuWidth} bind:clientHeight={submenuHeight} role="menu" aria-label={activeItem.label} tabindex="-1" > {#each activeItem.items as sub, subIndex} {#if sub.type === "separator"}
{:else} {@render menuButton(sub, subIndex, true)} {/if} {/each}
{/if}