Static Tag Macro demonstration

somewhere else

<<taga $:/tags/GettingStarted>>

StaticTagMacro

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

\define tag-body-inner(colour,fallbackTarget,colourA,colourB)
<$set name="foregroundColor" value=<<contrastcolour target:"""$colour$""" fallbackTarget:"""$fallbackTarget$""" colourA:"""$colourA$""" colourB:"""$colourB$""">>>
<$set name="backgroundColor" value="""$colour$"""><!--popup=<<qualify "$:/state/popup/tag">>-->
<$button popup=<<qualify "$:/state/popup/tag">> class="tc-btn-invisible tc-tag-label" style=<<tag-styles>> static="yes">
<$transclude tiddler={{!!icon}}/> <$view field="title" format="text" />
</$button>
<$reveal state=<<qualify "$:/state/popup/tag">> render="always" type="popup" position="below" animate="yes" ><div class="tc-drop-down"><$transclude tiddler="$:/core/ui/ListItemTemplate"/>
<hr>
<$list filter="[all[current]tagging[]]" template="$:/core/ui/ListItemTemplate"/>
</div>
</$reveal>
</$set>
</$set>
\end

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

<$macrocall $name="tag-body" colour={{!!color}} palette={{$:/palette}}/>

tagMacroA

\define taga(tag)
{{$tag$||StaticTagMacro}}
\end

https://github.com/Arlen22/TiddlyWiki5/tree/tagMacroTest

After doing this I changed things around some more and added a way to notify popup reveals directly from the popup mechanism when there is a change rather than waiting for the whole program to update. It still needs a bit of help, but it is better. Of course, I also included always render for all popups. The result is that dropdowns open almost instantly.