title: $:/core/ui/EditTemplate/tags
tags: $:/tags/EditTemplate

\whitespace trim

\define lingo-base() $:/language/EditTemplate/

\define tag-styles()
background-color:$(backgroundColor)$;
fill:$(foregroundColor)$;
color:$(foregroundColor)$;
\end

\define tag-body-inner(colour,fallbackTarget,colourA,colourB,icon)
\whitespace trim
<$vars foregroundColor=<<contrastcolour target:"""$colour$""" fallbackTarget:"""$fallbackTarget$""" colourA:"""$colourA$""" colourB:"""$colourB$""">> backgroundColor="""$colour$""">
<span style=<<tag-styles>> class="tc-tag-label tc-tag-list-item">
<$transclude tiddler="""$icon$"""/>&nbsp;<$view field="title" format="text" />
<$button message="tm-remove-tag" param={{!!title}} class="tc-btn-invisible tc-remove-tag-button">&times;</$button>
</span>
</$vars>
\end

\define tag-body(colour,palette,icon)
<$macrocall $name="tag-body-inner" colour="""$colour$""" fallbackTarget={{$palette$##tag-background}} colourA={{$palette$##foreground}} colourB={{$palette$##background}} icon="""$icon$"""/>
\end

\define tag-picker-actions()
<$action-listops
	$tiddler=<<currentTiddler>>
	$field="tags"
	$subfilter="[<tag>] [all[current]tags[]]"
/>
\end

<div class="tc-edit-tags">
<$fieldmangler>
<$list filter="[all[current]tags[]sort[title]]" storyview="pop">
<$macrocall $name="tag-body" colour={{!!color}} palette={{$:/palette}} icon={{!!icon}}/>
</$list>
</$fieldmangler>
<$set name="tabIndex" value={{$:/config/EditTabIndex}}>
<$macrocall $name="tag-picker" actions=<<tag-picker-actions>>/>
</$set>
</div>