Background actions and media query tracking (#9641)

* Initial commit cherry picked from #8702 * Initial docs from #8702 ...which need to also be turned into a changenote * Add changenote
2026-10-05 07:31:43 +00:00 · 2026-02-06 16:30:46 +00:00
parent 67f13c585d
commit 5cf3fcd843
11 changed files with 373 additions and 24 deletions
@@ -0,0 +1,22 @@
+title: Background Actions
+created: 20250212154426403
+modified: 20250212154426403
+tags: Mechanisms
+
+<<.demo-tiddler """
+title: SampleBackgroundAction: Story Change
+tags: $:/tags/BackgroundAction
+track-filter: [list[$:/StoryList]]
+
+<$action-sendmessage $message="tm-notify" $param="SampleBackgroundAction: Story Change" list={{$:/StoryList!!list}}/>
+
+Story List:
+
+<ol>
+<$list filter="[enlist<list>]">
+<li>
+<$text text=<<currentTiddler>>/>
+</li>
+</$list>
+</ol>
+""">>
@@ -4,8 +4,8 @@ tags: Mechanisms
 title: InfoMechanism
 type: text/vnd.tiddlywiki

-\define example(name)
-<$transclude tiddler="""$:/info/url/$name$""" mode="inline"/>
+\procedure example(name)
+<$text text={{{ [[$:/info/url/]addsuffix<name>get[text]] }}} />
 \end

 System tiddlers in the namespace `$:/info/` are used to expose information about the system (including the current browser) so that WikiText applications can adapt themselves to available features.
@@ -19,6 +19,8 @@ System tiddlers in the namespace `$:/info/` are used to expose information about
 |[[$:/info/browser/language]] |<<.from-version "5.1.20">> Language as reported by browser (note that some browsers report two character codes such as `en` while others report full codes such as `en-GB`) |
 |[[$:/info/browser/screen/width]] |Screen width in pixels |
 |[[$:/info/browser/screen/height]] |Screen height in pixels |
+|[[$:/info/browser/darkmode]] |<<.from-version "5.4.0">> Is dark mode preferred? ("yes" or "no") |
+|[[$:/info/darkmode]] |<<.deprecated-since "5.4.0">> Alias for  $:/info/browser/darkmode |
 |`$:/info/browser/window/*` |<<.from-version "5.4.0">> Tiddlers reporting window dimensions, updated when the windows are resized |
 |[[$:/info/node]] |Running under [[Node.js]]? ("yes" or "no") |
 |[[$:/info/url/full]] |<<.from-version "5.1.14">> Full URL of wiki (eg, ''<<example full>>'') |
@@ -0,0 +1,13 @@
+title: Media Query Tracker Mechanism
+tags: Mechanisms
+created: 20250212154426403
+modified: 20250212154426403
+
+
+<<.from-version "5.4.0">> The media query tracker mechanism allows you to define [[custom CSS media queries|https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_media_queries/Using_media_queries]] to be bound to a specified [[info|InfoMechanism]] tiddler. The info tiddler will be dynamically update to reflect the current state of the media query.
+
+Adding or modifying a tiddler tagged $:/tags/MediaQueryTracker takes effect immediately.
+
+The media queries are always applied against the main window. This is relevant for viewport related media queries such as `min-width` which will always respect the main window and ignore the sizes of any external windows.
+
+The core includes a media query tracker that is used for tracking the operating system dark/light setting. See $:/core/wiki/config/MediaQueryTrackers/DarkLightPreferred for details.
@@ -0,0 +1,14 @@
+title: $:/changenotes/5.4.0/#9641
+description: Background actions and media query tracking
+tags: $:/tags/ChangeNote
+release: 5.4.0
+change-type: enhancement
+change-category: internal
+github-links: https://github.com/TiddlyWiki/TiddlyWiki5/pull/9641
+github-contributors: Jermolene
+
+Introduces[[Background Actions]] that are triggered whenever there is a change to the results of a specified filter.
+
+Building on that, it also introduces a new [[Media Query Tracker Mechanism]] that can track the results of any CSS media query (not just dark mode), storing the results in a shadow `$:/info/...` tiddler
+
+These improvements were cherrypicked from [[#8702 - Colour Handling Improvements|https://github.com/TiddlyWiki/TiddlyWiki5/pull/8702]] when it was deferred until v5.5.0.