{#if iconData} {/if} (primaryOpen = true)} on:blur on:focus on:input on:keyup on:blur={onBlur} on:input={onInput} on:keyup={updateValueOnEnter} value={primaryLabel || ""} placeholder={placeholder || ""} {disabled} readonly class="spectrum-Textfield-input spectrum-InputGroup-input" class:labelPadding={iconData} class:open={primaryOpen} /> {#if primaryValue && showClearIcon} {/if}
{#if primaryOpen}
{#if autocomplete} updateSearch(event)} {disabled} placeholder="Search" /> {/if}
    {#if placeholderOption}
  • onSelectOption(null)} > {placeholderOption}
  • {/if} {#each groupTitles as title}
    {title}
    {#if primaryOptions} {#each primaryOptions[title].data as option, idx}
  • onPickPrimary({ value: primaryOptions[title].getValue(option), label: primaryOptions[title].getLabel(option), })} > {#if primaryOptions[title].getIcon(option)} {:else if getPrimaryOptionColour(option, idx)} {/if}
    {primaryOptions[title].getLabel(option)}
    {#if getPrimaryOptionIcon(option, idx) && getPrimaryOptionColour(option, idx)} {/if}
  • {/each} {/if} {/each}
{/if} {#if secondaryOptions.length}
{#if secondaryOpen}
    {#each secondaryOptions as option, idx}
  • onPickSecondary(getSecondaryOptionValue(option, idx))} > {#if getSecondaryOptionColour(option, idx)} {/if} {getSecondaryOptionLabel(option, idx)}
  • {/each}
{/if}
{/if}