TiddlyWiki5/core/wiki/macros/tree.tid

title: $:/core/macros/tree
tags: $:/tags/Macro

\define leaf-link(full-title, chunk)
<$link to=<<__full-title__>>><$text text=<<__chunk__>>/></$link>
\end

\define leaf-node(prefix, chunk)
<li>
<$list filter="[<__prefix__>addsuffix<__chunk__>is[shadow]] [<__prefix__>addsuffix<__chunk__>is[tiddler]]" variable="full-title">
<$list filter="[<full-title>removeprefix<__prefix__>]" variable="chunk">
<span>{{$:/core/images/file}}</span> <$macrocall $name="leaf-link" full-title=<<full-title>> chunk=<<chunk>>/>
</$list>
</$list>
</li>
\end

\define branch-node(prefix, chunk)
<li>
<$set name="reveal-state" value={{{ [[$:/state/tree/]addsuffix<__prefix__>addsuffix<__chunk__>] }}}>
<$reveal type="nomatch" stateTitle=<<reveal-state>> text="show">
<$button setTitle=<<reveal-state>> setTo="show" class="tc-btn-invisible">
{{$:/core/images/folder}} <$text text=<<__chunk__>>/>
</$button>
</$reveal>
<$reveal type="match" stateTitle=<<reveal-state>> text="show">
<$button setTitle=<<reveal-state>> setTo="hide" class="tc-btn-invisible">
{{$:/core/images/folder}} <$text text=<<__chunk__>>/>
</$button>
</$reveal>
<span>(<$count filter="[all[shadows+tiddlers]removeprefix<__prefix__>removeprefix<__chunk__>] -[<__prefix__>addsuffix<__chunk__>]"/>)</span>
<$reveal type="match" stateTitle=<<reveal-state>> text="show">
<$macrocall $name="tree-node" prefix={{{ [<__prefix__>addsuffix<__chunk__>] }}}/>
</$reveal>
</$set>
</li>
\end

\define tree-node(prefix)
<ol>
<$list filter="[all[shadows+tiddlers]removeprefix<__prefix__>splitbefore[/]sort[]!suffix[/]]" variable="chunk">
<$macrocall $name="leaf-node" prefix=<<__prefix__>> chunk=<<chunk>>/>
</$list>
<$list filter="[all[shadows+tiddlers]removeprefix<__prefix__>splitbefore[/]sort[]suffix[/]]" variable="chunk">
<$macrocall $name="branch-node" prefix=<<__prefix__>> chunk=<<chunk>>/>
</$list>
</ol>
\end

\define tree(prefix: "$:/")
<div class="tc-tree">
<span><$text text=<<__prefix__>>/></span>
<div>
<$macrocall $name="tree-node" prefix=<<__prefix__>>/>
</div>
</div>
\end