From 25145271a45b52a8d697ed163cf2ce37f8e19e9c Mon Sep 17 00:00:00 2001 From: pmario Date: Sat, 17 Feb 2024 22:14:57 +0100 Subject: [PATCH] doc-macros new v5.3.x syntax --- .../tw5.com/tiddlers/system/doc-macros.tid | 251 ++++++++++-------- .../tw5.com/tiddlers/system/doc-styles.tid | 36 ++- 2 files changed, 168 insertions(+), 119 deletions(-) diff --git a/editions/tw5.com/tiddlers/system/doc-macros.tid b/editions/tw5.com/tiddlers/system/doc-macros.tid index e4a425f9a..95bdfaf6d 100644 --- a/editions/tw5.com/tiddlers/system/doc-macros.tid +++ b/editions/tw5.com/tiddlers/system/doc-macros.tid @@ -4,78 +4,107 @@ tags: $:/tags/Macro title: $:/editions/tw5.com/doc-macros type: text/vnd.tiddlywiki -\define .concat(1,2,3,4,5) $1$$2$$3$$4$$5$ +\whitespace trim -\define .def(_) $_$ -\define .em(_) $_$ -\define .strong(_) $_$ -\define .place(_) $_$ -\define .word(_) "$_$" +\function .concat(1,2,3,4,5) [[$(1)$$(2)$$(3)$$(4)$$(5)$]substitute[]] -\define .preamble(_) :.doc-preamble $_$ -\define .note(_) +\procedure .def(_) <<_>> + +\procedure .em(_) <<_>> +\procedure .strong(_) <<_>> +\procedure .place(_) <<_>> +\function .word(_) [["]] [<_>] =[["]] +[join[]] + +\procedure .preamble(_)
<<_>>
+ + + + +\procedure .note(_) @@.doc-note -;Note -: $_$ +; Note +: <<_>> @@ \end -\define .tid(_) $_$ -\define .tag(_) $_$ -\define .field(_) $_$ -\define .value(_) $_$ -\define .op(_) $_$ -\define .var(_) $_$ -\define .wid(_) $$_$ -\define .attr(_) $_$ -\define .param(_) $_$ +\procedure .tid(_) <<_>> +\procedure .tag(_) <<_>> +\procedure .field(_) <<_>> +\procedure .value(_) <<_>> +\procedure .op(_) <<_>> +\procedure .var(_) <<_>> +\procedure .wid(_) <$macrocall $name=".concat" 1="$" 2=<<_>>/> +\procedure .attr(_) <<_>> +\procedure .param(_) <<_>> -\define .mtitle(_) $_$ Macro -\define .otitle(_) $_$ Operator -\define .vtitle(_) $_$ Variable - -\define .link(_,to) <$link to="$to$">$_$ -\define .clink(_,to) <<.link """$_$""" "$to$">> -\define .dlink(_,to) <$macrocall $name=".link" _=<<.def "$_$">> to="$to$">/> -\define .dlink-ex(_,to) <<.def "$_$">> -\define .flink(to) <$macrocall $name=".link" _=<<.field {{$to$!!caption}}>> to="$to$"/> -\define .mlink(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to=<<.mtitle "$_$">>/> -\define .mlink2(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to="$to$"/> -\define .olink(_) <$macrocall $name=".link" _=<<.op "$_$">> to=<<.otitle "$_$">>/> -\define .olink2(_,to) <$macrocall $name=".link" _=<<.op "$_$">> to=<<.otitle "$to$">>/> -\define .vlink(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to=<<.vtitle "$_$">>/> -\define .vlink2(_,to) <$macrocall $name=".link" _=<<.var "$_$">> to="$to$"/> -\define .wlink(to) <$macrocall $name=".link" _=<<.wid {{$to$!!caption}}>> to="$to$"/> -\define .wlink2(_,to) <$macrocall $name=".link" _="$_$" to="$to$"/> - -\define .key(_) $_$ -\define .combokey(_) <$macrocall $name=".if" cond="$_$" then=<<.key '$_$'>>/> -\define .keycombo(1,2,3,4) <<.combokey "$1$">><<.if "$2$" +>><<.combokey "$2$">><<.if "$3$" +>><<.combokey "$3$">><<.if "$4$" +>><<.combokey "$4$">> - -\define .tab(_) {{$_$!!caption}} -\define .sidebar-tab(_) <<.tab "$:/core/ui/SideBar/$_$">> -\define .more-tab(_) <<.tab "$:/core/ui/MoreSideBar/$_$">> -\define .info-tab(_) <<.tab "$:/core/ui/TiddlerInfo/$_$">> -\define .controlpanel-tab(_) <<.tab "$:/core/ui/ControlPanel/$_$">> -\define .advancedsearch-tab(_) <<.tab "$:/core/ui/AdvancedSearch/$_$">> -\define .toc-tab() <<.tab "TableOfContents">> -\define .example-tab(_) $_$ - -\define .doc-tabs() -<$macrocall $name="tabs" - tabsList="[tagdescription[tab]]" - default={{{ [tagfirst[]] }}} - explicitState={{{ [addprefix[$:/state/tab/]] }}} - class={{{ [[doc-tabs]] [encodeuricomponent[]escapecss[]addprefix[doc-tabs-]] +[join[ ]] }}} /> +\procedure .tiddler-fields(tiddler) +<$tiddler tiddler=<>> +
+

+ <$link> + {{||$:/core/ui/TiddlerIcon}}<$text text=<>/> + +

+ + + <$list filter="[all[current]fields[]sort[title]] -title" template="$:/core/ui/TiddlerFieldTemplate" variable="listItem"/> + +
+
+ \end -\define .doc-tab-link(text, target, tooltip:"", class:"") + +\function .mtitle(_) [<_>] Macro +[join[ ]] +\function .otitle(_) [<_>] Operator +[join[ ]] +\function .vtitle(_) [<_>] Variable +[join[ ]] + +\procedure .link(_,to) <$link to=<> ><<_>> +\procedure .clink(_,to) <$link to=<>><<_>> + +\procedure .dlink(_,to) <$link to=<>><$macrocall $name=".def" _=<<_>>/> + +\procedure .dlink-ex(_,to) > class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><$macrocall $name=".def" _=<<_>>/> +\procedure .flink(to) <$macrocall $name=".link" _=`<<.field {{$(to)$!!caption}}>>` to=<>/> + +\procedure .mlink(_) <$link to={{{ [.mtitle<_>] }}}><$macrocall $name=".var" _=<<_>>/> +\procedure .mlink2(_,to) <$link to=<>><$macrocall $name=".var" _=<<_>>/> + +\procedure .olink(_) <$link to={{{ [.otitle<_>] }}}><$macrocall $name=".op" _=<<_>>/> +\procedure .olink2(_,to) <$link to={{{ [.otitle] }}}><$macrocall $name=".op" _=<<_>>/> + +\procedure .vlink(_) <$link to={{{ [.vtitle<_>] }}}><$macrocall $name=".var" _=<<_>>/> +\procedure .vlink2(_,to) <$link to=<>><$macrocall $name=".var" _=<<_>>/> + +\procedure .wlink(to) <$link to=<> > <$macrocall $name=".wid" _={{{ [get[caption]] }}}> +\procedure .wlink2(_,to) <$link to=<> ><<_>> + +\procedure .key(_) <<_>> +\procedure .keys(_) <<_>> + +\procedure .tab(_) <$transclude $tiddler=<<_>> $field=caption ><<_>> +\procedure .sidebar-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/SideBar/$(_)$`/> +\procedure .more-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/MoreSideBar/$(_)$`/> +\procedure .info-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/TiddlerInfo/$(_)$`/> +\procedure .controlpanel-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/ControlPanel/$(_)$`/> +\procedure .advancedsearch-tab(_) <$macrocall $name=".tab" _=`$:/core/ui/AdvancedSearch/$(_)$`/> +\procedure .toc-tab() <$macrocall $name=".tab" _="TableOfContents"/> +\procedure .example-tab(_) <<_>> + +\procedure .doc-tabs() +<$macrocall $name="tabs" + tabsList="[tagdescription[tab]]" + default={{{ [tagfirst[]] }}} + explicitState={{{ [addprefix[$:/state/tab/]] }}} + class={{{ [[doc-tabs]] [encodeuricomponent[]escapecss[]addprefix[doc-tabs-]] +[join[ ]] }}} /> +\end +\procedure .doc-tab-link(text, target, tooltip:"", class:"") <$tiddler tiddler={{{ [search:text[.doc-tabs]] :else[tags[]search:text[.doc-tabs]first[]] :else[] }}} > -<$button class={{{ [[tc-btn-invisible tc-tiddlylink]] [<__class__>] +[join[ ]] }}} - set={{{ [addprefix[$:/state/tab/]] }}} - setTo=<<__target__>> - tooltip=<<__tooltip__>>> - <<__text__>> +<$button class={{{ [[tc-btn-invisible tc-tiddlylink]] [] +[join[ ]] }}} + set={{{ [addprefix[$:/state/tab/]] }}} + setTo=<> + tooltip=<>> + <> <$list filter="[[$:/StoryList]contains]" variable="ignore" emptyMessage="<$action-navigate />"> <$action-sendmessage $message="tm-scroll" selector={{{ [encodeuricomponent[]addprefix[.doc-tabs-]] }}} /> @@ -84,34 +113,53 @@ type: text/vnd.tiddlywiki \end -\define .widget-attr-link(text, target) +\procedure .widget-attr-link(text, target) <$macrocall $name=".doc-tab-link" - text={{{ [[]] [<__text__>] [[]] +[join[]] }}} - class="doc-tab-link" - target=<<__target__>> - tooltip={{{ [[Show more information about the ']] [<__text__>] [[' attribute]] +[join[]] }}} /> + text={{{ [[]] [] [[]] +[join[]] }}} + class="doc-tab-link" + target=<> + tooltip={{{ [[Show more information about the ']] [] [[' attribute]] +[join[]] }}} /> \end -\define .button(_) {{$:/core/ui/Buttons/$_$!!caption}} +\procedure .button(_) <$transclude $tiddler=`$:/core/ui/Buttons/$(_)$` $field="caption" ><<_>> -\define .icon(_) {{$_$}} +\procedure .icon(_) <$transclude $tiddler=<<_>>/> -\define .tip(_)
{{$:/core/images/tip}}
$_$
-\define .warning(_)
{{$:/core/images/warning}}
$_$
+\procedure .infoBox(text:"", title, icon:"$:/core/images/info-button", class, iconSize:"1.4rem") +\function _f.tipClass() [[doc-icon-block]] [!is[blank]then] +[join[ ]] +<$log/> +
>> + <%if [!is[blank]] %><div>''<<title>>''</div><% endif %> + <div class="doc-block-icon"><$transclude $tiddler=<<icon>> size=<<iconSize>>/></div> + <<text>> +</div><br/> +\end -\define .state-prefix() $:/state/editions/tw5.com/ +\procedure .note(_:"", title:"Note", icon:"$:/core/images/info-button", class:"doc-note", iconSize:"22pt") +<$macrocall $name=".infoBox" text=<<_>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/> +\end -\define .lorem() +\procedure .tip(text:"", title:"Tip" , icon:"$:/core/images/tip", class:"doc-tip", iconSize:"22pt") +<$macrocall $name=".infoBox" text=<<text>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/> +\end + +\procedure .warning(text:"", title:"Warning", icon:"$:/core/images/warning", class:"doc-warning", iconSize:"22pt") +<$macrocall $name=".infoBox" text=<<text>> title=<<title>> icon=<<icon>> class=<<class>> iconSize=<<iconSize>>/> +\end + +\procedure .state-prefix() $:/state/editions/tw5.com/ + +\procedure .lorem() Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. \end -\define .toc-lorem() +\procedure .toc-lorem() This is an example tiddler. See [[Table-of-Contents Macros (Examples)]]. <<.lorem>> \end -\define .example(n,eg,egvar:NO-SUCH-VAR) +\procedure .example(n,eg,egvar:NO-SUCH-VAR) <div class="doc-example"> <$reveal default="$egvar$" type="match" text="NO-SUCH-VAR"> <$macrocall $name="copy-to-clipboard-above-right" src="""$eg$"""/> @@ -148,7 +196,7 @@ $$$ </$list> \end -\define .bad-example(eg) +\procedure .bad-example(eg) <table class="doc-bad-example"> <tbody> <tr class="evenRow"> @@ -162,42 +210,27 @@ $eg$ </table> \end -\define .link-badge(text,link,colour) -<a href=<<__link__>> class="doc-link-badge" style="background-color:$colour$;" target="_blank" rel="noopener noreferrer"><$text text=<<__text__>>/></a> +\procedure .link-badge(text,link,colour) +<a href=<<link>> class="doc-link-badge" style="background-color:$colour$;" target="_blank" rel="noopener noreferrer"><$text text=<<text>>/></a> \end -\define .link-badge-added(link,colour:#ffe246) <<.link-badge "added" """$link$""" """$colour$""">> -\define .link-badge-addendum(link,colour:#fcc84a) <<.link-badge "addendum" """$link$""" """$colour$""">> -\define .link-badge-extended(link,colour:#f9a344) <<.link-badge "extended" """$link$""" """$colour$""">> -\define .link-badge-fixed(link,colour:#ffa86d) <<.link-badge "fixed" """$link$""" """$colour$""">> -\define .link-badge-here(link,colour:#d88e63) <<.link-badge "here" """$link$""" """$colour$""">> -\define .link-badge-hide(link,colour:#9d959f) <<.link-badge "hide" """$link$""" """$colour$""">> -\define .link-badge-improved(link,colour:#7593c7) <<.link-badge "improved" """$link$""" """$colour$""">> -\define .link-badge-modified(link,colour:#7f99c9) <<.link-badge "modified" """$link$""" """$colour$""">> -\define .link-badge-removed(link,colour:#a9aabc) <<.link-badge "removed" """$link$""" """$colour$""">> -\define .link-badge-renamed(link,colour:#b4b995) <<.link-badge "renamed" """$link$""" """$colour$""">> -\define .link-badge-updated(link,colour:#91ba66) <<.link-badge "updated" """$link$""" """$colour$""">> +\procedure .link-badge-added(link,colour:#ffe246) <<.link-badge "added" """$link$""" """$colour$""">> +\procedure .link-badge-addendum(link,colour:#fcc84a) <<.link-badge "addendum" """$link$""" """$colour$""">> +\procedure .link-badge-extended(link,colour:#f9a344) <<.link-badge "extended" """$link$""" """$colour$""">> +\procedure .link-badge-fixed(link,colour:#ffa86d) <<.link-badge "fixed" """$link$""" """$colour$""">> +\procedure .link-badge-here(link,colour:#d88e63) <<.link-badge "here" """$link$""" """$colour$""">> +\procedure .link-badge-hide(link,colour:#9d959f) <<.link-badge "hide" """$link$""" """$colour$""">> +\procedure .link-badge-improved(link,colour:#7593c7) <<.link-badge "improved" """$link$""" """$colour$""">> +\procedure .link-badge-modified(link,colour:#7f99c9) <<.link-badge "modified" """$link$""" """$colour$""">> +\procedure .link-badge-removed(link,colour:#a9aabc) <<.link-badge "removed" """$link$""" """$colour$""">> +\procedure .link-badge-renamed(link,colour:#b4b995) <<.link-badge "renamed" """$link$""" """$colour$""">> +\procedure .link-badge-updated(link,colour:#91ba66) <<.link-badge "updated" """$link$""" """$colour$""">> -\define .tiddler-fields(tiddler) -<$tiddler tiddler=<<__tiddler__>>> -<div class="doc-tiddler-fields"> -<h2> -<$link> -<span class="tc-tiddler-title-icon">{{||$:/core/ui/TiddlerIcon}}</span><$text text=<<currentTiddler>>/> -</$link> -</h2> -<table class="tc-view-field-table"> -<tbody> -<$list filter="[all[current]fields[]sort[title]] -title" template="$:/core/ui/TiddlerFieldTemplate" variable="listItem"/> -</tbody> -</table> -</div> -</$tiddler> -\end -\define .banner-credits(credit,url) -<img src=<<__url__>> width="140" style="float:left;margin-right:0.5em;"/> + +\procedure .banner-credits(credit,url) +<img src=<<url>> width="140" style="float:left;margin-right:0.5em;"/> $credit$ @@ -206,9 +239,9 @@ $credit$ </div> \end -\define .contributors(usernames) +\procedure .contributors(usernames) <ol class="doc-github-contributors"> -<$list filter="[enlist<__usernames__>sort[]]" variable="username"> +<$list filter="[enlist<usernames>sort[]]" variable="username"> <li> <a href={{{ [[https://github.com/]addsuffix<username>] }}} class="tc-tiddlylink-external" target="_blank" rel="noopener noreferrer"><img src={{{ [[https://github.com/]addsuffix<username>addsuffix[.png?size=64]] }}} width="64" height="64"/><span class="doc-github-contributor-username">@<$text text=<<username>>/></span></a> </li> diff --git a/editions/tw5.com/tiddlers/system/doc-styles.tid b/editions/tw5.com/tiddlers/system/doc-styles.tid index 9ae22868f..50142a081 100644 --- a/editions/tw5.com/tiddlers/system/doc-styles.tid +++ b/editions/tw5.com/tiddlers/system/doc-styles.tid @@ -85,7 +85,6 @@ td svg { .doc-preamble { border: 2px solid <<colour code-border>>; color: <<colour very-muted-foreground>>; - font-size: 90%; margin-left: 0; padding: 0.5em 0.7em; } @@ -112,7 +111,7 @@ td svg { } .doc-example input[type=search] { - width: 95%; + width: 95%; } .doc-example pre:first-child { margin-top: 0; @@ -138,7 +137,7 @@ td svg { } .doc-bad-example code, .doc-bad-example pre, table.doc-bad-example { - background-color:#ffff80; + background-color:#ffff80; } .doc-table th, .doc-table tr { @@ -164,19 +163,37 @@ tr.doc-table-subheading { } .doc-icon-block { - border-left: 2px solid <<colour code-border>>; + border-left: 4px solid <<colour blockquote-bar>>; margin-left: 3em; padding-left: 0.6em; position: relative; } + .doc-block-icon { position: absolute; left: -3em; top: 0.2em; } + +.doc-icon-block.doc-note { + border-left: 4px solid <<colour blockquote-bar>>; + background: <<colour blockquote-bar>>11; +} + +.doc-icon-block.doc-tip { + border-left: 4px solid <<colour primary>>; + background: <<colour primary>>11; +} + +.doc-icon-block.doc-warning { + border-left: 4px solid <<colour alert-highlight>>; + background: <<colour alert-highlight>>11; +} + .doc-block-icon .tc-image-tip { fill: <<colour primary>>; } + .doc-block-icon .tc-image-warning { fill: <<colour alert-highlight>>; } @@ -241,7 +258,6 @@ a.doc-deprecated-version.tc-tiddlylink { height: 1em; } - .doc-tiddler-fields table, .doc-tiddler-fields h2 { margin: 0.5em 0; @@ -294,13 +310,13 @@ ol.doc-github-contributors li { color: #666; } .doc-tabs.tc-tab-buttons button { - font-size: 1rem; - padding: 0.5em; + font-size: 1rem; + padding: 0.5em; } .doc-tabs button .doc-attr { - background-color: unset; - color: #666; + background-color: unset; + color: #666; } .doc-tab-link .doc-attr { - color: unset; + color: unset; }