{#snippet popover()}
{/snippet} {#snippet kbdText()} {dynamicMapping ?? icon ?? info.display ?? info.id ?? `0x${info.code.toString(16)}`} {/snippet} {#snippet kbdSnippet(withPopover = true)}
1023} class:warn={!retrievedInfo} {@attach withPopover && hasPopover ? actionTooltip(popover) : null} > {@render kbdText()}
{/snippet} {#snippet inlineKbdSnippet()} {#if !info.icon && dynamicMapping?.length === 1}
1023} class:warn={!retrievedInfo} class:left={info.variant === "left"} class:right={info.variant === "right"}>{dynamicMapping}
{:else if !icon && info.id?.length === 1}
1023} class:warn={!retrievedInfo} class:left={info.variant === "left"} class:right={info.variant === "right"}>{info.id}
{:else}
1023} {@attach hasPopover ? actionTooltip(popover) : null} > {@render kbdText()}
{/if} {/snippet} {#if display === "keys"} {@render kbdSnippet()} {:else if display === "verbose"} {#if isVerbose(info)}
{@render kbdSnippet(false)}
{info.title}
{:else} {@render inlineKbdSnippet()} {/if} {:else if display === "inline-keys" || display === "inline-text"} {@render inlineKbdSnippet()} {/if}