{#if hint}
{@html alertIcon}
{@html hint}
{/if}
{#if imageOcclusionMode}
{/if}
{#if $ioMaskEditorVisible && isImageOcclusion && !isIOImageLoaded}
{/if}
{#if !$ioMaskEditorVisible}
{#each fieldsData as field, index}
{@const content = fieldStores[index]}
{
$focusedField = fields[index];
setAddonButtonsDisabled(false);
bridgeCommand(`focus:${index}`);
}}
on:focusout={() => {
$focusedField = null;
setAddonButtonsDisabled(true);
bridgeCommand(
`blur:${index}:${getNoteId()}:${transformContentBeforeSave(
get(content),
)}`,
);
}}
on:mouseenter={() => {
$hoveredField = fields[index];
}}
on:mouseleave={() => {
$hoveredField = null;
}}
collapsed={fieldsCollapsed[index]}
dupe={cols[index] === "dupe"}
--description-font-size="{field.fontSize}px"
--description-content={`"${field.description}"`}
>
toggleField(index)}
--icon-align="bottom"
>
{field.name}
{#if cols[index] === "dupe"}
{/if}
{#if plainTextDefaults[index]}
toggleRichTextInput(index)}
/>
{:else}
togglePlainTextInput(index)}
/>
{/if}
{
saveFieldNow();
$focusedInput = null;
}}
bind:this={richTextInputs[index]}
/>
{
saveFieldNow();
$focusedInput = null;
}}
bind:this={plainTextInputs[index]}
/>
{/each}
{
updateTagsCollapsed(false);
}}
/>
updateTagsCollapsed(!$tagsCollapsed)}
>
{@html `${tagAmount > 0 ? tagAmount : ""} ${tr.editingTags()}`}
{/if}