tiddlywiki 5.2.0 → 5.2.1

package/editions/tw5.com/tiddlers/filters/syntax/Intersection Filter Run Prefix.tid

@@ -0,0 +1,15 @@
+created: 20211128212902292
+modified: 20211128212904721
+tags: [[Filter Syntax]] [[Filter Run Prefix]]
+title: Intersection Filter Run Prefix
+type: text/vnd.tiddlywiki
+
+<<.from-version "5.1.23">>
+
+|''purpose'' |find the intersection of titles from previous runs with titles in this filter run |
+|''input'' |all titles from previous filter runs |
+|''output''|the titles that are present in both the result of this filter run and the output from previous runs |
+
+The filter output from previous runs is set aside. The `:intersection` filter run is started with all tiddler titles as input. Once this latest filter run has completed, the latest output is compared to the set-aside output. A new output is produced that contains only titles that appeared in both the set-aside output and the latest output.
+
+[[Examples|Intersection Filter Run Prefix (Examples)]]

package/editions/tw5.com/tiddlers/filters/syntax/Map Filter Run Prefix (Examples).tid

@@ -1,5 +1,5 @@
 created: 20210618134753828
-modified: 20210618140945870
+modified: 20211125152755859
 tags: [[Filter Syntax]] [[Filter Run Prefix Examples]] [[Map Filter Run Prefix]]
 title: Map Filter Run Prefix (Examples)
 type: text/vnd.tiddlywiki
@@ -14,3 +14,28 @@ Replace the input titles with the caption field if it exists, otherwise preserve
 For each title in a shopping list, calculate the total cost of purchasing each item:
 
 <<.operator-example 2 "[tag[shopping]] :map[get[quantity]else[0]multiply{!!price}]">>
+
+!! Comparison between `:map` and `:and`/`+` filter run prefixes
+
+The functionality of the `:map` filter run prefix has some overlap with the `:and` prefix (alias `+`). They will sometimes return the same results as each other. In at least these cases, the results will be different:
+
+# The `:and` filter run can modify the number of items (either increase or decrease). The `:map` run will never alter the number of items.
+# The number of items in the `:and` filter run will also decrease due to de-duplication. The `:map` run will not de-duplicate.
+# Explicit references to the "currentTiddler" variable will behave differently
+# Implicit references to the "currentTiddler" using TextReference will behave differently.
+
+| `:map` | `:and` |
+|!results are the same|<|
+|^<<.operator-example 1.1 "[range[5]] :map[add[1]]">>|^<<.operator-example 1.2 "[range[5]] :and[add[1]]">>|
+|^<<.operator-example 2.1 "[range[5]] :map[addsuffix[ hello]]">>|^<<.operator-example 2.2 "[range[5]] :and[addsuffix[ hello]]">>|
+|^<<.operator-example 3.1 "[tag[shopping]] :map[get[quantity]]">>|^<<.operator-example 3.2 "[tag[shopping]] :and[get[quantity]]">>|
+|!decrease in the number of items|<|
+|^<<.operator-example 4.1 "[range[5]] :map[sum[]]">>|^<<.operator-example 4.2 "[range[5]] :and[sum[]]">>|
+|^<<.operator-example 5.1 "[range[5]] :map[join[,]]">>|^<<.operator-example 5.2 "[range[5]] :and[join[,]]">>|
+|!increase in the number of items|<|
+|^<<.operator-example 6.1 "[[1,2,3]] [[4,5]] :map[split[,]]">>|^<<.operator-example 6.2 "[[1,2,3]] [[4,5]] :and[split[,]]">>|
+|!de-duplication|<|
+|^<<.operator-example 7.1 "[range[5]] :map[[hello]]">>|^<<.operator-example 7.2 "[range[5]] :and[[hello]]">>|
+|!currentTiddler|<|
+|^<<.operator-example 8.1 "[tag[shopping]] :map[<currentTiddler>]">>|^<<.operator-example 8.2 "[tag[shopping]] :and[<currentTiddler>]">>|
+|^<<.operator-example 9.1 "[tag[shopping]] :map[{!!quantity}]">>|^<<.operator-example 9.2 "[tag[shopping]] :and[{!!quantity}]">>|

package/editions/tw5.com/tiddlers/filters/syntax/Map Filter Run Prefix.tid

@@ -1,5 +1,5 @@
 created: 20210618133745003
-modified: 20210618134747652
+modified: 20211029025541750
 tags: [[Filter Syntax]] [[Filter Run Prefix]]
 title: Map Filter Run Prefix
 type: text/vnd.tiddlywiki
@@ -14,6 +14,14 @@ Each input title from previous runs is passed to this run in turn. The filter ru
 
 Note that within the filter run, the "currentTiddler" variable is set to the title of the tiddler being processed. This permits filter runs like `:map[{!!price}multiply{!!cost}]` to be used for computation. The value of currentTiddler outside the run is available in the variable "..currentTiddler".
 
+The following variables are available within the filter run:
+
+* ''currentTiddler'' - the input title
+* ''..currentTiddler'' - the value of the variable `currentTiddler` outside the filter run.
+* ''index'' - <<.from-version "5.2.1">> the numeric index of the current list item (with zero being the first item in the list).
+* ''revIndex'' - <<.from-version "5.2.1">> the reverse numeric index of the current list item (with zero being the last item in the list).
+* ''length'' - <<.from-version "5.2.1">> the total length of the input list.
+
 Filter runs used with the `:map` prefix should return the same number of items that they are passed. Any missing entries will be treated as an empty string. In particular, when retrieving the value of a field with the [[get Operator]] it is helpful to guard against a missing field value using the [[else Operator]]. For example `[get[myfield]else[default-value]...`.
 
 [[Examples|Map Filter Run Prefix (Examples)]]

package/editions/tw5.com/tiddlers/filters/syntax/Named Filter Run Prefix.tid

@@ -1,6 +1,6 @@
 created: 20201214044413473
-modified: 20201214053018350
-tags: 
+modified: 20211118025845599
+tags: [[Filter Syntax]]
 title: Named Filter Run Prefix
 
 <$set name="prefixlist" filter="""[all[shadows+tiddlers]has[module-type]module-type[filterrunprefix]trim:prefix[$:/core/modules/filterrunprefixes/]trim:suffix[.js]addprefix["]addsuffix["]join[|]addprefix[(]addsuffix[)]]""">

package/editions/tw5.com/tiddlers/filters/syntax/Reduce Filter Run Prefix (Examples).tid

@@ -0,0 +1,27 @@
+created: 20211124151912931
+modified: 20211124160747921
+tags: [[Filter Syntax]] [[Reduce Filter Run Prefix]] [[Filter Run Prefix Examples]]
+title: Reduce Filter Run Prefix (Examples)
+type: text/vnd.tiddlywiki
+
+\define multiply-input() [multiply<accumulator>]
+
+The following examples use these data tiddlers:
+
+<ul>
+<$list filter="[tag[shopping]!has[draft.of]]">
+<li>
+''<$link><$text text=<<currentTiddler>>/></$link>'' quantity: <$text text={{!!quantity}}/>,  price: <$text text={{!!price}}/>
+</li>
+</$list>
+</ul>
+
+<<.operator-example 1 "[tag[shopping]] :reduce[get[quantity]add<accumulator>]">>
+<<.operator-example 2 "[tag[shopping]] :reduce[get[price]multiply{!!quantity}add<accumulator>]">>
+<<.operator-example 3 "[tag[shopping]] :reduce[<index>compare:number:gt[0]then<accumulator>addsuffix[, ]addsuffix<currentTiddler>else<currentTiddler>]" "Uses `<index>` to act differently on the first item than the rest. Just for demonstration. Better to use the [[join Operator]] to accomplish this task">>
+<<.operator-example 4 "[tag[non-existent]] :reduce[get[price]multiply{!!quantity}add<accumulator>]" "Empty input produces empty output">>
+<<.operator-example 5 "[tag[non-existent]] :reduce[get[price]multiply{!!quantity}add<accumulator>] :else[[0]]" "Use `:else` to ensure output if input was empty">>
+
+<$macrocall $name=".tip" _="""Unlike the [[reduce Operator]], the `:reduce` prefix cannot specify an initial value for the accumulator, so its initial value will always be empty (which is treated as 0 by mathematical operators). So `=1 =2 =3 :reduce[multiply<accumulator>]` will produce 0, not 6. If you need to specify an initial accumulator value, use the [[reduce Operator]]."""/>
+<<.operator-example 6 "=1 =2 =3 :reduce[multiply<accumulator>]" "Empty initial value is treated as 0 by mathematical operators">>
+<<.operator-example 7 "=1 =2 =3 +[reduce<multiply-input>,[1]]" "Setting initial value is sometimes necessary for correct results">>

package/editions/tw5.com/tiddlers/filters/syntax/Reduce Filter Run Prefix.tid

@@ -0,0 +1,38 @@
+created: 20211124151912931
+modified: 20211124170117511
+tags: [[Filter Syntax]] [[Filter Run Prefix]]
+title: Reduce Filter Run Prefix
+type: text/vnd.tiddlywiki
+
+<<.from-version "5.1.23">>
+
+|''purpose'' |replaces all filter output so far with a single item by repeatedly applying a filter run to each input title |
+|''input'' |all titles from previous filter runs |
+|''output''|the accumulated single item |
+
+Each input title from previous runs is passed to this run in turn. The result of each previous call to this run is made available in the next call via the variable named "accumulator". The result of the last call to this run is returned as the output.  A typical use is to add up the values in a given field of each input title.
+
+The following variables are available within the filter run:
+
+* ''accumulator'' - the result of the previous filter run
+* ''currentTiddler'' - the input title
+* ''..currentTiddler'' - the value of the variable `currentTiddler` outside the filter run. <<.from-version "5.2.0">>
+* ''index'' - the numeric index of the current list item (with zero being the first item in the list)
+* ''revIndex'' - the reverse numeric index of the current list item (with zero being the last item in the list)
+* ''length'' - the total length of the input list
+
+<<.tip "Compare named filter run prefix `:reduce` with [[reduce Operator]] which is used to flatten a list of items down to a single item by repeatedly applying a subfilter.">> 
+
+```
+[tag[shopping]] :reduce[get[quantity]add<accumulator>]
+```
+
+is equivalent to:
+
+```
+\define num-items() [get[quantity]add<accumulator>]
+
+[tag[shopping]reduce<num-items>]
+```
+
+[[Examples|Reduce Filter Run Prefix (Examples)]]

package/editions/tw5.com/tiddlers/filters/tan Operator.tid

@@ -0,0 +1,13 @@
+caption: tan
+created: 20211019211156303
+modified: 20211021222828332
+op-input: a [[selection of titles|Title Selection]]
+op-output: the tangent of the input angles
+op-purpose: calculate the tangent value of a list of angles (given in radians)
+tags: [[Filter Operators]] [[Mathematics Operators]] [[Trigonometric Operators]] [[Unary Mathematics Operators]]
+title: tan Operator
+type: text/vnd.tiddlywiki
+
+<<.from-version "5.1.21">> See [[Mathematics Operators]] for an overview.
+
+<<.operator-examples "tan">>

package/editions/tw5.com/tiddlers/filters/zth Operator.tid

@@ -0,0 +1,18 @@
+caption: zth
+created: 20211029023242012
+modified: 20211029023711450
+op-input: a [[selection of titles|Title Selection]]
+op-output: the <<.place Z>>th input title
+op-parameter: an integer, defaulting to 0
+op-parameter-name: Z
+op-purpose: select the <<.place Z>>th input title
+tags: [[Filter Operators]] [[Order Operators]]
+title: zth Operator
+type: text/vnd.tiddlywiki
+
+<<.from-version 5.2.1>>
+<<.place Z>> is zero-based. In other words, `zth[0]` has the same effect as `nth[1]` and the <<.olink first>> operator.
+
+<<.tip "See <<.olink nth>> for an equivalent operator with a 1 based parameter">>
+
+<<.operator-examples "zth">>

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Android.tid

@@ -1,6 +1,7 @@
 caption: Android
 created: 20140811171036268
-modified: 20160430121735629
+modified: 20211114031651878
+tags: GettingStarted
 title: GettingStarted - Android
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Chrome.tid

@@ -1,6 +1,7 @@
 caption: Chrome
 created: 20140811165935523
-modified: 20140811170107969
+modified: 20211114031651878
+tags: GettingStarted
 title: GettingStarted - Chrome
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Firefox.tid

@@ -1,6 +1,7 @@
 caption: Firefox
 created: 20140811170425199
-modified: 20140811170527083
+modified: 20211114031651878
+tags: GettingStarted
 title: GettingStarted - Firefox
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Internet Explorer.tid

@@ -1,6 +1,7 @@
 caption: Internet Explorer
 created: 20140811172058274
-modified: 20140811172247864
+modified: 20211114031651879
+tags: GettingStarted
 title: GettingStarted - Internet Explorer
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Node.js.tid

@@ -1,6 +1,7 @@
 caption: Node.js
 created: 20140811172010003
-modified: 20140811172012677
+modified: 20211114031651879
+tags: GettingStarted
 title: GettingStarted - Node.js
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Online.tid

@@ -1,7 +1,7 @@
 caption: Online
 created: 20160216191710789
-modified: 20170222152427476
-tags: 
+modified: 20211114031651879
+tags: GettingStarted
 title: GettingStarted - Online
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - Safari.tid

@@ -1,6 +1,7 @@
 caption: Safari
 created: 20140811171121022
-modified: 20150325173956502
+modified: 20211114031651879
+tags: GettingStarted
 title: GettingStarted - Safari
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/gettingstarted/GettingStarted - iOS.tid

@@ -1,6 +1,7 @@
 caption: iPad/iPhone
 created: 20140811170918707
-modified: 20140811170921731
+modified: 20211114031651879
+tags: GettingStarted
 title: GettingStarted - iOS
 type: text/vnd.tiddlywiki
 

package/editions/tw5.com/tiddlers/hellothere/HelloThere.tid

@@ -1,6 +1,6 @@
 created: 20130822170200000
 list: [[A Gentle Guide to TiddlyWiki]] [[Discover TiddlyWiki]] [[Some of the things you can do with TiddlyWiki]] [[Ten reasons to switch to TiddlyWiki]] Examples [[What happened to the original TiddlyWiki?]] [[HelloThumbnail - TWEUM2017]]
-modified: 20211003151502543
+modified: 20211208115833846
 tags: TableOfContents
 title: HelloThere
 type: text/vnd.tiddlywiki

package/editions/tw5.com/tiddlers/hellothere/Some of the things you can do with TiddlyWiki.tid

@@ -1,5 +1,5 @@
 created: 20140904090300000
-modified: 20160602051709631
+modified: 20211018102355896
 tags: HelloThere
 title: Some of the things you can do with TiddlyWiki
 type: text/vnd.tiddlywiki
@@ -11,7 +11,7 @@ type: text/vnd.tiddlywiki
 * Inventory just about anything: your recipes, personal library, contacts, music collection, and more
 * Create a blog or website
 * Write a book
-* Organise your images into galleries (see our [[ImageGallery Example]])
+* Organise your images into galleries (see [[Icon Gallery]])
 * Share the information in your ~TiddlyWiki with others, as an online file, as a file attachment, as a tiddler file, or as a link to a specific online tiddler (try clicking and dragging a tiddler from one ~TiddlyWiki file to another to see what happens)
 * Draw a sketch (Edit [[Motovun Jack.jpg]] and start drawing over the image to see what happens)
 * Use familiar web user interface elements such as lightboxes - see SampleWizard

package/editions/tw5.com/tiddlers/hellothere/badges/ProductHunt-Badge.svg.tid

@@ -1,5 +1,6 @@
 title: ProductHunt-Badge.svg
 type: image/svg+xml
+tags: [[HelloThere Badge]]
 
 <?xml version="1.0" encoding="UTF-8"?>
 <svg width="250px" height="54px" viewBox="0 0 250 54" version="1.1" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">

package/editions/tw5.com/tiddlers/hellothere/badges/ProductHunt-Link.tid

@@ -1,3 +1,4 @@
 title: Product Hunt Link
+tags: [[HelloThere Badge]]
 
 <a href="https://www.producthunt.com/posts/tiddlywiki-2?utm_source=badge-top-post-badge&utm_medium=badge&utm_souce=badge-tiddlywiki-2" alt="Product Hunt: Product of the Day" target="_blank" rel="noopener noreferrer">{{ProductHunt-Badge.svg}}</a>

package/editions/tw5.com/tiddlers/hiddensettings/Hidden Setting NewImageType.tid

@@ -1,5 +1,7 @@
+created: 20211116222524148
+modified: 20211116222535549
+tags: [[Hidden Settings]]
 title: Hidden Setting: New-Image Type
-tags: [[Hidden Setting]]
 type: text/vnd.tiddlywiki
 
 By default new images are created with the image-type `jpeg`

package/editions/tw5.com/tiddlers/hiddensettings/Hidden Setting ShowEditPreviewPerTiddler.tid

@@ -0,0 +1,10 @@
+created: 20211028083211182
+modified: 20211029090311444
+tags: [[Hidden Settings]]
+title: Hidden Setting: Show Edit Preview per Tiddler
+
+Controls whether the [[tiddler editing preview|Text preview]] is controlled globally (the default) or on a per-tiddler basis.
+
+Set it to ''yes'' to enable per-tiddler mode.
+
+$:/config/ShowEditPreview/PerTiddler

package/editions/tw5.com/tiddlers/hiddensettings/Hidden Setting_ Typin Refresh Delay.tid

@@ -4,10 +4,10 @@ tags: [[Hidden Settings]]
 title: Hidden Setting: Typing Refresh Delay
 type: text/vnd.tiddlywiki
 
-TiddlyWiki defers processing changes to draft tiddlers until a timeout has elapsed (this is called throttling). The mechanism can be extended to other tiddlers by adding a `throttle.refresh` field. See RefreshThrottling for details.
+TiddlyWiki defers processing changes to draft tiddlers and tiddlers with the prefix `$:/temp/volatile/` until a timeout has elapsed (this is called throttling). The mechanism can be extended to other tiddlers by adding a `throttle.refresh` field. See RefreshThrottling for details.
 
 The default value of 400ms gives a good balance of responsiveness in most cases but isn't always optimal on lower powered mobile devices.
 
 The timeout can now be changed by changing this value (in milliseconds):
 
-$:/config/Drafts/TypingTimeout
+$:/config/Drafts/TypingTimeout

package/editions/tw5.com/tiddlers/howtos/Creating SubStories.tid

@@ -1,44 +1,32 @@
 created: 20140214215718317
-modified: 20140919161514318
+modified: 20211127032217828
 tags: Learning
 title: Creating SubStories
 type: text/vnd.tiddlywiki
 
-This example shows how to create a sub-story within a tiddler that is independent of the main story.
+This example shows how to create a sub-story within a tiddler that is independent of the main [[story|Story River]].  The NavigatorWidget and ListWidget work together to:
 
-Here's the code:
+# Add tiddlers to the [[story|Story River]] when links are clicked. Navigate to the tiddler corresponding to the link click. (''story'' attribute of the NavigatorWidget)
+# Remove tiddlers from the [[story|Story River]] when tiddler close buttons are clicked. (''story'' attribute of NavigatorWidget)
+# Animate the opening and closing of tiddlers. (''storyview'' attribute of the ListWidget)
+# Display the list of open tiddlers. (''filter'' and ''template'' attributes of the ListWidget)
+# Display tiddlers in [[draft mode|DraftMechanism]]. (''editTemplate'' attribute of the ListWidget)
+# Track [[navigation history|HistoryMechanism]]. (''history'' attribute of both NavigatorWidget and ListWidget)
+# And more!
 
-```
-<$navigator story="MySubStoryList" history="MySubHistoryList">
+Here is the example code (see also StateMechanism for related discussion):
 
-Click this link to get started: HelloThere
+<$macrocall $name='wikitext-example-without-html'
+src='<$navigator story="$:/temp/DemoStoryList" history="$:/temp/DemoHistoryList">
 
-<$list filter="[list[MySubStoryList]]" history="MySubHistoryList">
-<div>
+{{$:/core/ui/SideBarSegments/search}}
 
-! <$button message="tm-close-tiddler" class="tc-btn-invisible">{{$:/core/images/close-button}}</$button> <$view field="title"/>
+<$list
+  filter="[list[$:/temp/DemoStoryList]]"
+  history="$:/temp/DemoHistoryList"
+  template={{$:/config/ui/ViewTemplate}}
+  editTemplate={{$:/config/ui/EditTemplate}}
+  storyview="classic"
+  emptyMessage="Use search box above. Clicked search links will open here instead of in the main story.<p>No search ideas? Click this link to get started: HelloThere</p>"/>
 
-<$transclude/>
-</div>
-</$list>
-
-</$navigator>
-```
-
-Note how you can open the HelloThere tiddler in the substory by clicking on the link below. Links within the substory open within the substory, and not in the main story.
-
-<$navigator story="MySubStoryList" history="MySubHistoryList">
-
-Click this link to get started: HelloThere
-
-<$list filter="[list[MySubStoryList]]" history="MySubHistoryList">
-<div>
-
-! <$button message="tm-close-tiddler" class="tc-btn-invisible">{{$:/core/images/close-button}}</$button> <$view field="title"/>
-
-<$transclude/>
-
-</div>
-</$list>
-
-</$navigator>
+</$navigator>'>

package/editions/tw5.com/tiddlers/howtos/Debugging Stylesheets.tid

@@ -0,0 +1,11 @@
+created: 20211125175712017
+modified: 20211125175906085
+tags: [[Using Stylesheets]]
+title: Debugging Stylesheets
+type: text/vnd.tiddlywiki
+
+The core shadow tiddler $:/snippets/DebugStylesheets contains a simple tool for tracking down certain problems with mismatched brackets and other nested structures.
+
+In the list below, any stylesheets containing an error will be marked with a red cross:
+
+{{$:/snippets/DebugStylesheets}}

package/editions/tw5.com/tiddlers/howtos/How to create a custom story tiddler template.tid

@@ -0,0 +1,40 @@
+created: 20211204120244761
+modified: 20211206165108185
+tags: Learning Cascades [[Story Tiddler Template]] [[Story Tiddler Template Cascade]] [[Customise TiddlyWiki]]
+title: How to create a custom story tiddler template
+type: text/vnd.tiddlywiki
+
+Here we show how to add a rule to the [[Story Tiddler Template Cascade]] that causes tiddlers tagged <<tag "$:/tags/TiddlerList">> to be displayed with a custom appearance incorporating thumbnails of the tiddlers named in the list field.
+
+Open [[Demo Tiddler List with Custom Story Tiddler Template]] to see the demo.
+
+First, we add a new step to the story tiddler template cascade. The new filter step is:
+
+```
+[tag[$:/tags/TiddlerList]then[$:/_tw5.com/CustomStoryTiddlerTemplateDemo/Template]]
+```
+
+It can be read as:
+
+```
+If the tiddler has the tag $:/tags/TiddlerList then return $:/_tw5.com/CustomStoryTiddlerTemplateDemo/Template
+```
+
+> The template $:/_tw5.com/CustomStoryTiddlerTemplateDemo/Template also depends on styles defined in [[$:/_tw5.com/CustomStoryTiddlerTemplateDemo/Styles]].
+
+The story tiddler template cascade is defined by the tag <<tag "$:/tags/StoryTiddlerTemplateFilter">>, so we need to create a configuration tiddler with that tag.
+
+We also need to make sure that it is inserted at the correct point in the cascade:
+
+* The new rule must be after the "draft" rule to ensure that draft tiddlers with the tag $:/tags/TiddlerList can be edited
+* The new rule must be before the "default" rule otherwise it will never be executed
+
+The control panel "Cascades" tab shows that this can be achieved by inserting the new step immediately before the default step using the `list-before` field.
+
+The full list of fields in the configuration tiddler is:
+
+<<.tiddler-fields "$:/_tw5.com/CustomStoryTiddlerTemplateDemo/Filter">>
+
+Finally, we need to create the demo tiddler itself:
+
+<<.tiddler-fields "Demo Tiddler List with Custom Story Tiddler Template">>

package/editions/tw5.com/tiddlers/howtos/How to create a custom tiddler colour rule.tid

@@ -0,0 +1,36 @@
+created: 20211206114114698
+modified: 20211206165150302
+tags: Learning Cascades [[Customise TiddlyWiki]]
+title: How to create a custom tiddler colour rule
+type: text/vnd.tiddlywiki
+
+Here we show how to add a rule to the [[Tiddler Colour Cascade]] that causes tiddlers with the tag <<tag "TableOfContents">> to be given a bright blue colour and tiddlers with the tag <<tag "Working with TiddlyWiki">> to be given a dark purple colour.
+
+<<.tip "[[How to create a custom tiddler icon rule]] describes how the same tiddlers have been given a custom icon">>
+
+First, we add a new step to the tiddler colour cascade. The new filter step is:
+
+```
+[tag[TableOfContents]then[#1e90ff]]
+[tag[Working with TiddlyWiki]then[darkorchid]]
+```
+
+It can be read as:
+
+```
+If the tiddler has the tag "TableOfContents" then return the colour #1e90ff
+Else if the tiddler has the tag "Working with TiddlyWiki" then return the colour darkorchid
+```
+
+The tiddler colour cascade is defined by the tag <<tag "$:/tags/TiddlerColourFilter">>, so we need to create a configuration tiddler with that tag.
+
+We also need to make sure that it is inserted at the correct point in the cascade:
+
+* The new rule must be after the "colour-field" rule to ensure that tiddlers with an explicit ''color'' field will respect the value of that field
+* The new rule must be before the "default" icon otherwise it will never be seen if the default colour is specified
+
+The control panel "Cascades" tab shows that this can be achieved by inserting the new step immediately before the default step using the `list-before` field.
+
+The full list of fields in the configuration tiddler is:
+
+<<.tiddler-fields "$:/_tw5.com/CustomTiddlerColourCascadeDemo">>

package/editions/tw5.com/tiddlers/howtos/How to create a custom tiddler icon rule.tid

@@ -0,0 +1,36 @@
+created: 20211204161649863
+modified: 20211206165129215
+tags: Learning Cascades [[Tiddler Icon Cascade]] [[Customise TiddlyWiki]]
+title: How to create a custom tiddler icon rule
+type: text/vnd.tiddlywiki
+
+Here we show how to add a rule to the [[Tiddler Icon Cascade]] that causes tiddlers with the tag <<tag "TableOfContents">> to be given the "globe" icon <<.icon $:/core/images/globe>> and tiddlers with the tag <<tag "Working with TiddlyWiki">> to be given the "help" icon <<.icon $:/core/images/help>>.
+
+<<.tip "[[How to create a custom tiddler colour rule]] describes how the same tiddlers have been given a custom colour">>
+
+First, we add a new step to the tiddler icon cascade. The new filter step is:
+
+```
+[tag[TableOfContents]then[$:/core/images/globe]]
+[tag[Working with TiddlyWiki]then[$:/core/images/help]] 
+```
+
+It can be read as:
+
+```
+If the tiddler has the tag "TableOfContents" then return $:/core/images/globe
+Else if the tiddler has the tag "Working with TiddlyWiki" then return $:/core/images/help
+```
+
+The tiddler icon cascade is defined by the tag <<tag "$:/tags/TiddlerIconFilter">>, so we need to create a configuration tiddler with that tag.
+
+We also need to make sure that it is inserted at the correct point in the cascade:
+
+* The new rule must be after the "icon-field" rule to ensure that tiddlers with an explicit ''icon'' field will respect the value of that field
+* The new rule must be before the "default" icon otherwise it will never be seen if the default icon is specified
+
+The control panel "Cascades" tab shows that this can be achieved by inserting the new step immediately before the default step using the `list-before` field.
+
+The full list of fields in the configuration tiddler is:
+
+<<.tiddler-fields "$:/_tw5.com/CustomTiddlerIconCascadeDemo">>

package/editions/tw5.com/tiddlers/howtos/How to create dynamic editor toolbar buttons.tid

@@ -1,5 +1,5 @@
 created: 20201216182347597
-modified: 20201217193318816
+modified: 20211018102328148
 tags: 
 title: How to create dynamic editor toolbar buttons
 type: text/vnd.tiddlywiki
@@ -86,7 +86,7 @@ This tiddler contains all the necessary elements that are important for toolbar
 : Is used as the button tooltip
 
 ; icon 
-: Assigns the button icon. We use `$:/core/images/spiral` {{$:/core/images/spiral}} here.
+: Assigns the button icon. We use `$:/core/images/spiral` {{$:/core/images/spiral}} here. More button icons can be found in the [[Icon Gallery]]
 
 ; shortcuts
 : This is the [[Keyboard Shortcut Descriptor]] eg: `((temp-bold))`

package/editions/tw5.com/tiddlers/howtos/Simple ways to write protect tiddlers.tid

@@ -1,6 +1,6 @@
 created: 20180310002601813
-modified: 20180310003428093
-tags: Learning
+modified: 20211106021629911
+tags: Learning [[How to apply custom styles]]
 title: Simple ways to write protect tiddlers
 type: text/vnd.tiddlywiki
 
@@ -10,9 +10,8 @@ Sometimes you want to protect individual tiddlers from accidental changes, eithe
 
 Create a tiddler with the following contents and tag it as `$:/tags/Stylesheet` :
 
-```
-.tc-tagged-Locked button[title="Edit this tiddler"]   {display: none;}
-
+```css
+[data-tags*="Locked"] button[title="Edit this tiddler"]   {display: none;}
 ```
 
 If your TW language isn't English, then you'll need to change the text in 'title="...."' to whatever the text is when you hover over the edit button.

package/editions/tw5.com/tiddlers/howtos/Text preview.tid

@@ -1,9 +1,9 @@
 created: 20160817104110857
-modified: 20160817104802841
+modified: 20211029090145708
 tags: [[Editor toolbar]]
 title: Text preview
 
-Pressing the eye icon {{$:/core/ui/EditorToolbar/preview}} will open or close a preview window for your WikiText (The icon-eye will also open or close).
+Pressing the eye icon {{$:/core/ui/EditorToolbar/preview}} will open or close a preview window showing the results of rendering the WikiText (the icon-eye will also open or close).
 
 Right to the eye there is another icon, {{$:/core/images/chevron-down}}, which when clicked, shows you a dropdown which gives you access to six different types of preview:
 
@@ -12,3 +12,7 @@ Right to the eye there is another icon, {{$:/core/images/chevron-down}}, which w
 * //parsetree// and //widgettree// show you the two object trees that ~TiddlyWiki internally generates from ~WikiText. The //parsetree// collects basic information about your ~WikiText. From the informations of the parsetree the //widgettree// then generates extended informations and finally the above html (and the widgettree also does other things).
 * //differences from current// shows you the differences since the tiddler was last saved. Deleted parts are <span style="color:red;">red</span>, added parts are <span style="color:green;">green</span>.
 * //differences from shadow (if any)// does the same, but this time it shows you the differences to the underlying [[shadow-tiddler|ShadowTiddlers]].
+
+<<.tip "By default, the preview pane button controls whether the preview pane is displayed for all tiddlers that are open for editing. There is a [[hidden setting|Hidden Setting: Show Edit Preview per Tiddler]] to make the button work on a per-tiddler basis">>
+
+<<.tip "The variable [[tv-tiddler-preview|tv-tiddler-preview Variable]] can be used to detect whether content is being displayed in the preview pane.">>

package/editions/tw5.com/tiddlers/howtos/Using Stylesheets.tid

@@ -1,5 +1,5 @@
 created: 20140305091244145
-modified: 20210104090402829
+modified: 20211125175708977
 tags: [[Customise TiddlyWiki]]
 title: Using Stylesheets
 type: text/vnd.tiddlywiki
@@ -16,9 +16,9 @@ type: text/vnd.tiddlywiki
 
 The first steps to changing the appearance of ~TiddlyWiki are to choose and apply:
 
-* One of the available themes: <span class="tc-btn-standard"> {{$:/core/ui/Buttons/theme}} </span>
-* Modify the colour palette: <span class="tc-btn-standard"> {{$:/core/ui/Buttons/palette}} </span>
-* Experiment with the <$button actions=<<openCpTheme>> ><<.icon $:/core/images/options-button>> ControlPanel</$button>
+* One of the available themes: {{$:/core/ui/Buttons/theme}}
+* Modify the colour palette: {{$:/core/ui/Buttons/palette}}
+* Experiment with the <$button actions=<<openCpTheme>> class="tc-btn-invisible"><<.icon $:/core/images/options-button>> ~ControlPanel</$button>
 
 ! Work with Stylesheets
 
@@ -73,3 +73,7 @@ A stylesheet tiddler is processed such that it is first wikified and then the te
 !! Stylesheet Macros
 
 The ~TiddlyWiki core provides several [[global macros that are helpful in constructing stylesheets|Stylesheet Macros]].
+
+!! See Also
+
+* <<list-links "[tag[Using Stylesheets]]">>