Clarify docs

* Add chinese translations for the new network activity button

core/images/network-activity.tid

@@ -0,0 +1,11 @@
+title: $:/core/images/network-activity
+tags: $:/tags/Image
+
+<svg width="22pt" height="22pt" class="tc-image-network-activity tc-image-button" viewBox="0 0 128 128"><g class={{{ [{$:/state/http-requests}match[0]then[]else[tc-network-activity-background]] }}}>
+<$list filter="[{$:/state/http-requests}match[0]]" variable="ignore">
+<path d="M64.043 45.153a4.002 4.002 0 0 1 4.367 2.21l.084.188 30.403 73.4a4 4 0 0 1-7.307 3.25l-.084-.188-3.103-7.49-8.898 8.899a3.985 3.985 0 0 1-2.624 1.166l-.205.005a3.987 3.987 0 0 1-2.828-1.171l-9.849-9.848-9.847 9.848a3.985 3.985 0 0 1-2.624 1.166l-.204.005a3.987 3.987 0 0 1-2.829-1.171l-8.899-8.9-3.102 7.491a4 4 0 1 1-7.391-3.062l30.403-73.4a4.001 4.001 0 0 1 4.495-2.39l.042-.008Zm13.636 56.74-8.023 8.024 7.02 7.019 8.023-8.022-7.02-7.02Zm-27.353.008-7.019 7.019 8.016 8.016 7.019-7.02-8.016-8.015Zm13.68-13.68-8.023 8.023 8.016 8.016 8.023-8.023-8.016-8.016Zm-8.971-8.971-4.687 11.315 8.001-8.001-3.314-3.314Zm17.933.009-3.305 3.305 7.979 7.979-4.674-11.284ZM64 57.607l-5.666 13.68c.096.072.188.15.278.232l.133.126 5.261 5.262 5.262-5.262c.128-.127.261-.244.4-.35L64 57.607Zm0-34.69a8 8 0 1 1 0 16 8 8 0 0 1 0-16Z"/>
+</$list>
+<$list filter="[{$:/state/http-requests}!match[0]]" variable="ignore">
+<path d="M109.395.952a4.002 4.002 0 0 1 3.787 2.708C117.529 11.62 120 20.753 120 30.462c0 15.186-6.044 28.96-15.858 39.047a4 4 0 1 1-6.47-4.626l-.12-.094C106.466 56.074 112 43.914 112 30.462c0-8.492-2.205-16.469-6.074-23.39l.054-.036a4 4 0 0 1 3.415-6.084Zm-90.762 0a4 4 0 0 1 3.072 6.562l.093.06A47.786 47.786 0 0 0 16 30.463c0 13.315 5.42 25.363 14.176 34.058l-.01.007a4 4 0 1 1-6.312 4.863l-.063.05C14.017 59.359 8 45.613 8 30.462c0-9.77 2.502-18.956 6.9-26.952A4.002 4.002 0 0 1 18.634.952Z"/><path d="M64.043 44.698a4.002 4.002 0 0 1 4.367 2.21l.084.188 30.403 73.4a4 4 0 0 1-7.307 3.25l-.084-.188-3.103-7.49-8.898 8.9a3.985 3.985 0 0 1-2.624 1.166l-.205.005a3.987 3.987 0 0 1-2.828-1.172l-9.849-9.848-9.847 9.848a3.985 3.985 0 0 1-2.624 1.167l-.204.005a3.987 3.987 0 0 1-2.829-1.172l-8.899-8.899-3.102 7.49a4 4 0 0 1-7.391-3.061l30.403-73.4a4.001 4.001 0 0 1 4.495-2.39l.042-.009ZM77.68 101.44l-8.023 8.023 7.02 7.019 8.023-8.022-7.02-7.02Zm-27.353.007-7.019 7.019 8.016 8.016 7.019-7.019-8.016-8.016Zm13.68-13.68-8.023 8.023 8.016 8.016 8.023-8.023-8.016-8.016Zm-8.971-8.971L50.348 90.11l8.001-8.001-3.314-3.314Zm17.933.009-3.305 3.305 7.979 7.979-4.674-11.284ZM64 57.152l-5.666 13.68c.096.073.188.15.278.232l.133.127 5.261 5.261 5.262-5.261c.128-.128.261-.244.4-.351L64 57.152ZM38.503 1.058a4 4 0 0 1 2.7 6.952l.17-.175C35.582 13.625 32 21.625 32 30.462c0 8.838 3.582 16.838 9.374 22.629a4 4 0 0 1-5.659 5.658l-.01.01C28.473 51.52 24 41.526 24 30.485 24 19.567 28.374 9.67 35.466 2.453a3.995 3.995 0 0 1 3.037-1.395ZM89.369.952c1.14 0 2.17.478 2.899 1.244l.005-.006C99.518 9.43 104 19.434 104 30.485c0 10.826-4.3 20.648-11.287 27.85a4 4 0 1 1-6.054-5.213l-.032-.032C92.418 47.299 96 39.299 96 30.462c0-8.73-3.496-16.643-9.164-22.416A4 4 0 0 1 89.368.952Zm-39.282 11.14a4 4 0 0 1 2.59 7.048l.01.009A15.95 15.95 0 0 0 48 30.462a15.95 15.95 0 0 0 4.687 11.315l-.01.01a4 4 0 1 1-5.82 5.47l.173.177A23.925 23.925 0 0 1 40 30.462a23.925 23.925 0 0 1 7.03-16.97l.01.01a3.991 3.991 0 0 1 3.047-1.41Zm27.895.07a3.99 3.99 0 0 1 2.984 1.336l.006-.005A23.925 23.925 0 0 1 88 30.463a23.92 23.92 0 0 1-6.707 16.642l-.3.305a4 4 0 1 1-5.679-5.632v-.002A15.95 15.95 0 0 0 80 30.462a15.95 15.95 0 0 0-4.685-11.312 4.012 4.012 0 0 1-1.333-2.987 4 4 0 0 1 4-4ZM64 22.463a8 8 0 1 1 0 16 8 8 0 0 1 0-16Z"/>
+</$list>
+</g></svg>

core/language/en-GB/Buttons.multids

@@ -67,6 +67,8 @@ More/Caption: more
 More/Hint: More actions
 NewHere/Caption: new here
 NewHere/Hint: Create a new tiddler tagged with this one
+NetworkActivity/Caption: network activity
+NetworkActivity/Hint: Cancel all network activity
 NewJournal/Caption: new journal
 NewJournal/Hint: Create a new journal tiddler
 NewJournalHere/Caption: new journal here

core/modules/editor/engines/framed.js

@@ -72,6 +72,9 @@ function FramedEngine(options) {
 	if(this.widget.editRows) {
 		this.domNode.setAttribute("rows",this.widget.editRows);
 	}
+	if(this.widget.editDir) {
+		this.domNode.setAttribute("dir",this.widget.editDir);
+	}
 	if(this.widget.editTabIndex) {
 		this.iframeNode.setAttribute("tabindex",this.widget.editTabIndex);
 	}
@@ -120,6 +123,7 @@ FramedEngine.prototype.copyStyles = function() {
 	this.domNode.style["-webkit-text-fill-color"] = "currentcolor";
 	// Ensure we don't force text direction to LTR
 	this.domNode.style.removeProperty("direction");
+	this.domNode.style.removeProperty("unicodeBidi");
 };
 
 /*

core/modules/editor/engines/simple.js

@@ -52,6 +52,9 @@ function SimpleEngine(options) {
 	if(this.widget.editTabIndex) {
 		this.domNode.setAttribute("tabindex",this.widget.editTabIndex);
 	}
+	if(this.widget.editDir) {
+		this.domNode.setAttribute("dir",this.widget.editDir);
+	}
 	if(this.widget.editAutoComplete) {
 		this.domNode.setAttribute("autocomplete",this.widget.editAutoComplete);
 	}

core/modules/editor/factory.js

@@ -183,6 +183,7 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
 		this.editFocusSelectFromStart = $tw.utils.parseNumber(this.getAttribute("focusSelectFromStart","0"));
 		this.editFocusSelectFromEnd = $tw.utils.parseNumber(this.getAttribute("focusSelectFromEnd","0"));
 		this.editTabIndex = this.getAttribute("tabindex");
+		this.editDir = this.getAttribute("dir");
 		this.editCancelPopups = this.getAttribute("cancelPopups","") === "yes";
 		this.editInputActions = this.getAttribute("inputActions");
 		this.editRefreshTitle = this.getAttribute("refreshTitle");
@@ -220,7 +221,7 @@ function editTextWidgetFactory(toolbarEngine,nonToolbarEngine) {
 	EditTextWidget.prototype.refresh = function(changedTiddlers) {
 		var changedAttributes = this.computeAttributes();
 		// Completely rerender if any of our attributes have changed
-		if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || changedAttributes["class"] || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup ||  changedAttributes.rows || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"] || changedAttributes.disabled || changedAttributes.fileDrop) {
+		if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes["default"] || changedAttributes["class"] || changedAttributes.placeholder || changedAttributes.size || changedAttributes.autoHeight || changedAttributes.minHeight || changedAttributes.focusPopup ||  changedAttributes.rows || changedAttributes.tabindex || changedAttributes.dir || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || changedTiddlers[HEIGHT_MODE_TITLE] || changedTiddlers[ENABLE_TOOLBAR_TITLE] || changedTiddlers["$:/palette"]  || changedAttributes.disabled || changedAttributes.fileDrop) {
 			this.refreshSelf();
 			return true;
 		} else if (changedTiddlers[this.editRefreshTitle]) {

core/modules/parsers/wikiparser/rules/dir.js

@@ -0,0 +1,51 @@
+/*\
+title: $:/core/modules/parsers/wikiparser/rules/dir.js
+type: application/javascript
+module-type: wikirule
+
+Wiki pragma rule for specifying text direction
+
+```
+\dir rtl
+\dir ltr
+\dir auto
+```
+
+\*/
+(function(){
+
+/*jslint node: true, browser: true */
+/*global $tw: false */
+"use strict";
+
+exports.name = "dir";
+exports.types = {pragma: true};
+
+/*
+Instantiate parse rule
+*/
+exports.init = function(parser) {
+	this.parser = parser;
+	// Regexp to match
+	this.matchRegExp = /^\\dir[^\S\n]*(\S+)\r?\n/mg;
+};
+
+/*
+Parse the most recent match
+*/
+exports.parse = function() {
+	var self = this;
+	// Move past the pragma invocation
+	this.parser.pos = this.matchRegExp.lastIndex;
+	// Parse tree nodes to return
+	return [{
+		type: "element",
+		tag: this.parser.parseAsInline ? "span" : "div",
+		attributes: {
+			dir: {type: "string", value: this.match[1]}
+		},
+		children: []
+	}];
+};
+
+})();

core/modules/parsers/wikiparser/wikiparser.js

@@ -36,6 +36,7 @@ options: see below:
 */
 var WikiParser = function(type,text,options) {
 	this.wiki = options.wiki;
+	this.parseAsInline = options.parseAsInline;
 	var self = this;
 	// Check for an externally linked tiddler
 	if($tw.browser && (text || "") === "" && options._canonical_uri) {

core/modules/startup/rootwidget.js

@@ -20,6 +20,38 @@ exports.before = ["story"];
 exports.synchronous = true;
 
 exports.startup = function() {
+	// Install the HTTP client event handler
+	$tw.httpClient = new $tw.utils.HttpClient();
+	var getPropertiesWithPrefix = function(properties,prefix) {
+		var result = Object.create(null);
+		$tw.utils.each(properties,function(value,name) {
+			if(name.indexOf(prefix) === 0) {
+				result[name.substring(prefix.length)] = properties[name];
+			}
+		});
+		return result;
+	};
+	$tw.rootWidget.addEventListener("tm-http-request",function(event) {
+		var params = event.paramObject || {};
+		$tw.httpClient.initiateHttpRequest({
+			wiki: event.widget.wiki,
+			url: params.url,
+			method: params.method,
+			body: params.body,
+			oncompletion: params.oncompletion,
+			onprogress: params.onprogress,
+			bindStatus: params["bind-status"],
+			bindProgress: params["bind-progress"],
+			variables: getPropertiesWithPrefix(params,"var-"),
+			headers: getPropertiesWithPrefix(params,"header-"),
+			passwordHeaders: getPropertiesWithPrefix(params,"password-header-"),
+			queryStrings: getPropertiesWithPrefix(params,"query-"),
+			passwordQueryStrings: getPropertiesWithPrefix(params,"password-query-")
+		});
+	});
+	$tw.rootWidget.addEventListener("tm-http-cancel-all-requests",function(event) {
+		$tw.httpClient.cancelAllHttpRequests();
+	});
 	// Install the modal message mechanism
 	$tw.modal = new $tw.utils.Modal($tw.wiki);
 	$tw.rootWidget.addEventListener("tm-modal",function(event) {

core/modules/utils/dom/http.js

@@ -3,7 +3,7 @@ title: $:/core/modules/utils/dom/http.js
 type: application/javascript
 module-type: utils
 
-Browser HTTP support
+HTTP support
 
 \*/
 (function(){
@@ -13,11 +13,204 @@ Browser HTTP support
 "use strict";
 
 /*
-A quick and dirty HTTP function; to be refactored later. Options are:
+Manage tm-http-request events. Options include:
+wiki: Reference to the wiki to be used for state tiddler tracking
+stateTrackerTitle: Title of tiddler to be used for state tiddler tracking
+*/
+function HttpClient(options) {
+	options = options || {};
+	this.nextId = 1;
+	this.wiki = options.wiki || $tw.wiki;
+	this.stateTrackerTitle = options.stateTrackerTitle || "$:/state/http-requests";
+	this.requests = []; // Array of {id: string,request: HttpClientRequest}
+	this.updateRequestTracker();
+}
+
+/*
+Return the index into this.requests[] corresponding to a given ID. Returns null if not found
+*/
+HttpClient.prototype.getRequestIndex = function(targetId) {
+	var targetIndex = null;
+	$tw.utils.each(this.requests,function(requestInfo,index) {
+		if(requestInfo.id === targetId) {
+			targetIndex = index;
+		}
+	});
+	return targetIndex;
+};
+
+/*
+Update the state tiddler that is tracking the outstanding requests
+*/
+HttpClient.prototype.updateRequestTracker = function() {
+	this.wiki.addTiddler({title: this.stateTrackerTitle, text: "" + this.requests.length});
+};
+
+HttpClient.prototype.initiateHttpRequest = function(options) {
+	var self = this,
+		id = this.nextId,
+		request = new HttpClientRequest(options);
+	this.nextId += 1;
+	this.requests.push({id: id, request: request});
+	this.updateRequestTracker();
+	request.send(function(err) {
+		var targetIndex = self.getRequestIndex(id);
+		if(targetIndex !== null) {
+			self.requests.splice(targetIndex,1);
+			self.updateRequestTracker();
+		}
+	});
+	return id;
+};
+
+HttpClient.prototype.cancelAllHttpRequests = function() {
+	var self = this;
+	if(this.requests.length > 0) {
+		for(var t=this.requests.length - 1; t--; t>=0) {
+			var requestInfo = this.requests[t];
+			requestInfo.request.cancel();
+		}	
+	}
+	this.requests = [];
+	this.updateRequestTracker();
+};
+
+HttpClient.prototype.cancelHttpRequest = function(targetId) {
+	var targetIndex = this.getRequestIndex(targetId);
+	if(targetIndex !== null) {
+		this.requests[targetIndex].request.cancel();
+		this.requests.splice(targetIndex,1);
+		this.updateRequestTracker();
+	}
+};
+
+/*
+Initiate an HTTP request. Options:
+wiki: wiki to be used for executing action strings
+url: URL for request
+method: method eg GET, POST
+body: text of request body
+oncompletion: action string to be invoked on completion
+onprogress: action string to be invoked on progress updates
+bindStatus: optional title of tiddler to which status ("pending", "complete", "error") should be written
+bindProgress: optional title of tiddler to which the progress of the request (0 to 100) should be bound
+variables: hashmap of variable name to string value passed to action strings
+headers: hashmap of header name to header value to be sent with the request
+passwordHeaders: hashmap of header name to password store name to be sent with the request
+queryStrings: hashmap of query string parameter name to parameter value to be sent with the request
+passwordQueryStrings: hashmap of query string parameter name to password store name to be sent with the request
+*/
+function HttpClientRequest(options) {
+	var self = this;
+	console.log("Initiating an HTTP request",options)
+	this.wiki = options.wiki;
+	this.completionActions = options.oncompletion;
+	this.progressActions = options.onprogress;
+	this.bindStatus = options["bind-status"];
+	this.bindProgress = options["bind-progress"];
+	this.method = options.method || "GET";
+	this.body = options.body || "";
+	this.variables = options.variables;
+	var url = options.url;
+	$tw.utils.each(options.queryStrings,function(value,name) {
+		url = $tw.utils.setQueryStringParameter(url,name,value);
+	});
+	$tw.utils.each(options.passwordQueryStrings,function(value,name) {
+		url = $tw.utils.setQueryStringParameter(url,name,$tw.utils.getPassword(value) || "");
+	});
+	this.url = url;
+	this.requestHeaders = {};
+	$tw.utils.each(options.headers,function(value,name) {
+		self.requestHeaders[name] = value;
+	});
+	$tw.utils.each(options.passwordHeaders,function(value,name) {
+		self.requestHeaders[name] = $tw.utils.getPassword(value) || "";
+	});
+}
+
+HttpClientRequest.prototype.send = function(callback) {
+	var self = this,
+		setBinding = function(title,text) {
+			if(title) {
+				this.wiki.addTiddler(new $tw.Tiddler({title: title, text: text}));
+			}
+		};
+	if(this.url) {
+		setBinding(this.bindStatus,"pending");
+		setBinding(this.bindProgress,"0");
+		// Set the request tracker tiddler
+		var requestTrackerTitle = this.wiki.generateNewTitle("$:/temp/HttpRequest");
+		this.wiki.addTiddler({
+			title: requestTrackerTitle,
+			tags: "$:/tags/HttpRequest",
+			text: JSON.stringify({
+				url: this.url,
+				type: this.method,
+				status: "inprogress",
+				headers: this.requestHeaders,
+				data: this.body
+			})
+		});
+		this.xhr = $tw.utils.httpRequest({
+			url: this.url,
+			type: this.method,
+			headers: this.requestHeaders,
+			data: this.body,
+			callback: function(err,data,xhr) {
+				var hasSucceeded = xhr.status >= 200 && xhr.status < 300,
+					completionCode = hasSucceeded ? "complete" : "error",
+					headers = {};
+				$tw.utils.each(xhr.getAllResponseHeaders().split("\r\n"),function(line) {
+					var pos = line.indexOf(":");
+					if(pos !== -1) {
+						headers[line.substr(0,pos)] = line.substr(pos + 1).trim();
+					}
+				});
+				setBinding(self.bindStatus,completionCode);
+				setBinding(self.bindProgress,"100");
+				var resultVariables = {
+					status: xhr.status.toString(),
+					statusText: xhr.statusText,
+					error: (err || "").toString(),
+					data: (data || "").toString(),
+					headers: JSON.stringify(headers)
+				};
+				self.wiki.addTiddler(new $tw.Tiddler(self.wiki.getTiddler(requestTrackerTitle),{
+					status: completionCode,
+				}));
+				self.wiki.invokeActionString(self.completionActions,undefined,$tw.utils.extend({},self.variables,resultVariables),{parentWidget: $tw.rootWidget});
+				callback(hasSucceeded ? null : xhr.statusText);
+				// console.log("Back!",err,data,xhr);
+			},
+			progress: function(lengthComputable,loaded,total) {
+				if(lengthComputable) {
+					setBinding(self.bindProgress,"" + Math.floor((loaded/total) * 100))
+				}
+				self.wiki.invokeActionString(self.progressActions,undefined,{
+					lengthComputable: lengthComputable ? "yes" : "no",
+					loaded: loaded,
+					total: total
+				},{parentWidget: $tw.rootWidget});
+			}
+		});
+	}
+};
+
+HttpClientRequest.prototype.cancel = function() {
+	if(this.xhr) {
+		this.xhr.abort();
+	}
+};
+
+exports.HttpClient = HttpClient;
+
+/*
+Make an HTTP request. Options are:
 	url: URL to retrieve
 	headers: hashmap of headers to send
 	type: GET, PUT, POST etc
 	callback: function invoked with (err,data,xhr)
+	progress: optional function invoked with (lengthComputable,loaded,total)
 	returnProp: string name of the property to return as first argument of callback
 */
 exports.httpRequest = function(options) {
@@ -83,8 +276,16 @@ exports.httpRequest = function(options) {
 		options.callback($tw.language.getString("Error/XMLHttpRequest") + ": " + this.status,null,this);
 		}
 	};
+	// Handle progress
+	if(options.progress) {
+		request.onprogress = function(event) {
+			console.log("Progress event",event)
+			options.progress(event.lengthComputable,event.loaded,event.total);
+		};
+	}
 	// Make the request
 	request.open(type,url,true);
+	// Headers
 	if(headers) {
 		$tw.utils.each(headers,function(header,headerTitle,object) {
 			request.setRequestHeader(headerTitle,header);
@@ -96,6 +297,7 @@ exports.httpRequest = function(options) {
 	if(!hasHeader("X-Requested-With") && !isSimpleRequest(type,headers)) {
 		request.setRequestHeader("X-Requested-With","TiddlyWiki");
 	}
+	// Send data
 	try {
 		request.send(data);
 	} catch(e) {
@@ -104,4 +306,19 @@ exports.httpRequest = function(options) {
 	return request;
 };
 
+exports.setQueryStringParameter = function(url,paramName,paramValue) {
+	var URL = $tw.browser ? window.URL : require("url").URL,
+		newUrl;
+	try {
+		newUrl = new URL(url);
+	} catch(e) {
+	}
+	if(newUrl && paramName) {
+		newUrl.searchParams.set(paramName,paramValue || "");
+		return newUrl.toString();
+	} else {
+		return url;
+	}
+};
+
 })();

core/modules/widgets/edit.js

@@ -48,6 +48,7 @@ EditWidget.prototype.execute = function() {
 	this.editPlaceholder = this.getAttribute("placeholder");
 	this.editTabIndex = this.getAttribute("tabindex");
 	this.editFocus = this.getAttribute("focus","");
+	this.editDir = this.getAttribute("dir");
 	this.editCancelPopups = this.getAttribute("cancelPopups","");
 	this.editInputActions = this.getAttribute("inputActions");
 	this.editRefreshTitle = this.getAttribute("refreshTitle");
@@ -90,7 +91,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
 EditWidget.prototype.refresh = function(changedTiddlers) {
 	var changedAttributes = this.computeAttributes();
 	// Refresh if an attribute has changed, or the type associated with the target tiddler has changed
-	if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes.tabindex || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || (changedTiddlers[this.editTitle] && this.getEditorType() !== this.editorType)) {
+	if(changedAttributes.tiddler || changedAttributes.field || changedAttributes.index || changedAttributes.tabindex || changedAttributes.dir || changedAttributes.cancelPopups || changedAttributes.inputActions || changedAttributes.refreshTitle || changedAttributes.autocomplete || (changedTiddlers[this.editTitle] && this.getEditorType() !== this.editorType)) {
 		this.refreshSelf();
 		return true;
 	} else {

core/modules/widgets/reveal.js

@@ -42,6 +42,9 @@ RevealWidget.prototype.render = function(parent,nextSibling) {
 	if(this.style) {
 		domNode.setAttribute("style",this.style);
 	}
+	if(this.direction) {
+		domNode.setAttribute("dir",this.direction);
+	}
 	parent.insertBefore(domNode,nextSibling);
 	this.renderChildren(domNode,null);
 	if(!domNode.isTiddlyWikiFakeDom && this.type === "popup" && this.isOpen) {
@@ -123,6 +126,7 @@ RevealWidget.prototype.execute = function() {
 	this["default"] = this.getAttribute("default","");
 	this.animate = this.getAttribute("animate","no");
 	this.retain = this.getAttribute("retain","no");
+	this.direction = this.getAttribute("dir");
 	this.openAnimation = this.animate === "no" ? undefined : "open";
 	this.closeAnimation = this.animate === "no" ? undefined : "close";
 	this.updatePopupPosition = this.getAttribute("updatePopupPosition","no") === "yes";
@@ -214,7 +218,7 @@ Selectively refreshes the widget if needed. Returns true if the widget or any of
 */
 RevealWidget.prototype.refresh = function(changedTiddlers) {
 	var changedAttributes = this.computeAttributes();
-	if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes.positionAllowNegative || changedAttributes["default"] || changedAttributes.animate || changedAttributes.stateTitle || changedAttributes.stateField || changedAttributes.stateIndex) {
+	if(changedAttributes.state || changedAttributes.type || changedAttributes.text || changedAttributes.position || changedAttributes.positionAllowNegative || changedAttributes["default"] || changedAttributes.animate || changedAttributes.stateTitle || changedAttributes.stateField || changedAttributes.stateIndex || changedAttributes.dir) {
 		this.refreshSelf();
 		return true;
 	} else {

core/modules/widgets/widget.js

@@ -718,23 +718,44 @@ Widget.prototype.findFirstDomNode = function() {
 };
 
 /*
-Remove any DOM nodes created by this widget or its children
+Entry into destroy procedure
+*/
+Widget.prototype.destroyChildren = function() {
+	$tw.utils.each(this.children,function(childWidget) {
+		childWidget.destroy();
+	});
+};
+/*
+Legacy entry into destroy procedure
 */
 Widget.prototype.removeChildDomNodes = function() {
-	// If this widget has directly created DOM nodes, delete them and exit. This assumes that any child widgets are contained within the created DOM nodes, which would normally be the case
+	this.destroy();
+};
+/*
+Default destroy
+*/
+Widget.prototype.destroy = function() {
+	// call children to remove their resources
+	this.destroyChildren();
+	// remove our resources
+	this.children = [];
+	this.removeLocalDomNodes();	
+};
+
+/*
+Remove any DOM nodes created by this widget 
+*/
+Widget.prototype.removeLocalDomNodes = function() {
+	// If this widget has directly created DOM nodes, delete them and exit.
 	if(this.domNodes.length > 0) {
 		$tw.utils.each(this.domNodes,function(domNode) {
 			domNode.parentNode.removeChild(domNode);
 		});
 		this.domNodes = [];
-	} else {
-		// Otherwise, ask the child widgets to delete their DOM nodes
-		$tw.utils.each(this.children,function(childWidget) {
-			childWidget.removeChildDomNodes();
-		});
 	}
 };
 
+
 /*
 Invoke the action widgets that are descendents of the current widget.
 */

core/modules/wiki.js

@@ -1415,6 +1415,14 @@ exports.checkTiddlerText = function(title,targetText,options) {
 	return text === targetText;
 }
 
+/*
+Execute an action string without an associated context widget
+*/
+exports.invokeActionString = function(actions,event,variables,options) {
+	var widget = this.makeWidget(null,{parentWidget: options.parentWidget});
+	widget.invokeActionString(actions,null,event,variables);
+};
+
 /*
 Read an array of browser File objects, invoking callback(tiddlerFieldsArray) once they're all read
 */

core/palettes/Vanilla.tid

@@ -54,6 +54,7 @@ modal-footer-background: #f5f5f5
 modal-footer-border: #dddddd
 modal-header-border: #eeeeee
 muted-foreground: #bbb
+network-activity-foreground: #448844
 notification-background: #ffffdd
 notification-border: #999999
 page-background: #f4f4f4

core/templates/single.tiddler.window.tid

@@ -12,7 +12,8 @@ tc-page-container tc-page-view-$(storyviewTitle)$ tc-language-$(languageTitle)$
 	tv-config-toolbar-class={{$:/config/Toolbar/ButtonClass}}
 	tv-show-missing-links={{$:/config/MissingLinks}}
 	storyviewTitle={{$:/view}}
-	languageTitle={{{ [{$:/language}get[name]] }}}>
+	languageTitle={{{ [{$:/language}get[name]] }}}
+	tv-text-direction={{$:/config/DefaultTextDirection}}>
 
 <div class=<<containerClasses>>>
 

core/ui/EditTemplate.tid

@@ -29,6 +29,7 @@ title: $:/core/ui/EditTemplate
 	data-tiddler-title=<<currentTiddler>>
 	data-tags={{!!tags}}
 	class={{{ [all[shadows+tiddlers]tag[$:/tags/ClassFilters/TiddlerTemplate]!is[draft]] :map:flat[subfilter{!!text}] tc-tiddler-frame tc-tiddler-edit-frame [<currentTiddler>is[tiddler]then[tc-tiddler-exists]] [<currentTiddler>is[missing]!is[shadow]then[tc-tiddler-missing]] [<currentTiddler>is[shadow]then[tc-tiddler-exists tc-tiddler-shadow]] [<currentTiddler>is[system]then[tc-tiddler-system]] [{!!class}] [<currentTiddler>tags[]encodeuricomponent[]addprefix[tc-tagged-]] +[join[ ]] }}}
+	dir=<<tv-text-direction>>
 	role="region"
 	aria-label={{$:/language/EditTemplate/Caption}}>
 <$fieldmangler>

core/ui/EditTemplate/body-editor.tid

@@ -9,6 +9,7 @@ title: $:/core/ui/EditTemplate/body/editor
   placeholder={{$:/language/EditTemplate/Body/Placeholder}}
   tabindex={{$:/config/EditTabIndex}}
   focus={{{ [{$:/config/AutoFocus}match[text]then[true]] ~[[false]] }}}
+  dir=<<tv-text-direction>>
   cancelPopups="yes"
   fileDrop={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}}
 

core/ui/EditTemplate/body/default.tid

@@ -15,7 +15,7 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
 	importState=<<qualify $:/state/ImportImage>> >
 <$dropzone importTitle=<<importTitle>> autoOpenOnImport="no" contentTypesFilter={{$:/config/Editor/ImportContentTypesFilter}} class="tc-dropzone-editor" enable={{{ [{$:/config/DragAndDrop/Enable}match[no]] :else[subfilter{$:/config/Editor/EnableImportFilter}then[yes]else[no]] }}} filesOnly="yes" actions=<<importFileActions>> >
 <$reveal stateTitle=<<edit-preview-state>> type="match" text="yes" tag="div">
-<div class="tc-tiddler-preview">
+<div class="tc-tiddler-preview" dir=<<tv-text-direction>>>
 
 <$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/>
 
@@ -32,7 +32,7 @@ $:/config/EditorToolbarButtons/Visibility/$(currentTiddler)$
 </div>
 </$reveal>
 
-<$reveal stateTitle=<<edit-preview-state>> type="nomatch" text="yes" tag="div">
+<$reveal stateTitle=<<edit-preview-state>> type="nomatch" text="yes" tag="div" dir=<<tv-text-direction>>>
 
 <$transclude tiddler="$:/core/ui/EditTemplate/body/editor" mode="inline"/>
 

core/ui/EditTemplate/controls.tid

@@ -5,7 +5,7 @@ tags: $:/tags/EditTemplate
 $:/config/EditToolbarButtons/Visibility/$(listItem)$
 \end
 \whitespace trim
-<div class="tc-tiddler-title tc-tiddler-edit-title">
+<div class="tc-tiddler-title tc-tiddler-edit-title" dir=<<tv-text-direction>>>
 <$view field="title"/>
 <span class="tc-tiddler-controls tc-titlebar"><$list filter="[all[shadows+tiddlers]tag[$:/tags/EditToolbar]!has[draft.of]]" variable="listItem"><$let tv-config-toolbar-class={{{ [enlist<tv-config-toolbar-class>] [<listItem>encodeuricomponent[]addprefix[tc-btn-]] +[join[ ]]}}}><$reveal type="nomatch" state=<<config-title>> text="hide"><$transclude tiddler=<<listItem>>/></$reveal></$let></$list></span>
 <div style="clear: both;"></div>

core/ui/EditTemplate/fields.tid

@@ -74,7 +74,7 @@ $value={{{ [subfilter<get-field-value-tiddler-filter>get[text]] }}}/>
 \whitespace trim
 
 <$set name="newFieldValueTiddlerPrefix" value=<<newFieldValueTiddlerPrefix>> emptyValue=<<qualify "$:/temp/NewFieldValue">> >
-<div class="tc-edit-fields">
+<div class="tc-edit-fields" dir=<<tv-text-direction>>>
 <table class={{{ [all[current]fields[]] :filter[lookup[$:/config/EditTemplateFields/Visibility/]!match[hide]] +[count[]!match[0]] +[then[tc-edit-fields]] ~[[tc-edit-fields tc-edit-fields-small]] }}}>
 <tbody>
 <$list filter="[all[current]fields[]] +[sort[title]]" variable="currentField" storyview="pop">
@@ -101,7 +101,7 @@ $value={{{ [subfilter<get-field-value-tiddler-filter>get[text]] }}}/>
 </div>
 
 <$fieldmangler>
-<div class="tc-edit-field-add">
+<div class="tc-edit-field-add" dir=<<tv-text-direction>>>
 <em class="tc-edit tc-small-gap-right">
 <<lingo Fields/Add/Prompt>>
 </em>

core/ui/EditTemplate/shadow.tid

@@ -14,7 +14,7 @@ tags: $:/tags/EditTemplate
 <$list filter="[all[current]shadowsource[]]" variable="pluginTitle">
 
 <$set name="pluginLink" value=<<pluginLinkBody>>>
-<div class="tc-message-box">
+<div class="tc-message-box" dir=<<tv-text-direction>>>
 
 <<lingo Warning>>
 
@@ -29,7 +29,7 @@ tags: $:/tags/EditTemplate
 <$list filter="[all[current]shadowsource[]]" variable="pluginTitle">
 
 <$set name="pluginLink" value=<<pluginLinkBody>>>
-<div class="tc-message-box">
+<div class="tc-message-box" dir=<<tv-text-direction>>>
 
 <<lingo OverriddenWarning>>
 

core/ui/EditTemplate/tags.tid

@@ -27,7 +27,7 @@ color:$(foregroundColor)$;
 
 \define edit-tags-template(tagField:"tags")
 \whitespace trim
-<div class="tc-edit-tags">
+<div class="tc-edit-tags" dir=<<tv-text-direction>>>
 <$list filter="[list[!!$tagField$]sort[title]]" storyview="pop">
 <$macrocall $name="tag-body" colour={{{ [<currentTiddler>] :cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerColourFilter]!is[draft]get[text]] }}} palette={{$:/palette}} icon={{{ [<currentTiddler>] :cascade[all[shadows+tiddlers]tag[$:/tags/TiddlerIconFilter]!is[draft]get[text]] }}} tagField=<<__tagField__>>/>
 </$list>

core/ui/EditTemplate/title.tid

@@ -2,13 +2,13 @@ title: $:/core/ui/EditTemplate/title
 tags: $:/tags/EditTemplate
 
 \whitespace trim
-<$edit-text field="draft.title" class="tc-titlebar tc-edit-texteditor" focus={{{ [{$:/config/AutoFocus}match[title]then[true]] ~[[false]] }}} tabindex={{$:/config/EditTabIndex}} cancelPopups="yes"/>
+<$edit-text field="draft.title" class="tc-titlebar tc-edit-texteditor" focus={{{ [{$:/config/AutoFocus}match[title]then[true]] ~[[false]] }}} tabindex={{$:/config/EditTabIndex}} cancelPopups="yes" dir=<<tv-text-direction>>/>
 
 <$vars pattern="""[\|\[\]{}]""" bad-chars="""`| [ ] { }`""">
 
 <$list filter="[all[current]regexp:draft.title<pattern>]" variable="listItem">
 
-<div class="tc-message-box">
+<div class="tc-message-box" dir=<<tv-text-direction>>>
 
 {{$:/core/images/warning}}&#32;{{$:/language/EditTemplate/Title/BadCharacterWarning}}
 
@@ -18,7 +18,7 @@ tags: $:/tags/EditTemplate
 
 </$vars>
 
-<$reveal state="!!draft.title" type="nomatch" text={{!!draft.of}} tag="div">
+<$reveal state="!!draft.title" type="nomatch" text={{!!draft.of}} tag="div" dir=<<tv-text-direction>>>
 
 <$list filter="[{!!draft.title}!is[missing]]" variable="listItem">
 

core/ui/EditTemplate/type.tid

@@ -9,7 +9,7 @@ first-search-filter: [all[shadows+tiddlers]prefix[$:/language/Docs/Types/]sort[d
 <div class="tc-edit-type-selector-wrapper">
 <em class="tc-edit tc-small-gap-right"><<lingo Type/Prompt>></em>
 <div class="tc-type-selector-dropdown-wrapper">
-<div class="tc-type-selector"><$fieldmangler>
+<div class="tc-type-selector" dir=<<tv-text-direction>>}><$fieldmangler>
 <$macrocall $name="keyboard-driven-input" tiddler=<<currentTiddler>> storeTitle=<<typeInputTiddler>> refreshTitle=<<refreshTitle>> selectionStateTitle=<<typeSelectionTiddler>> field="type" tag="input" default="" placeholder={{$:/language/EditTemplate/Type/Placeholder}} focusPopup=<<qualify "$:/state/popup/type-dropdown">> class="tc-edit-typeeditor tc-edit-texteditor tc-popup-handle" tabindex={{$:/config/EditTabIndex}} focus={{{ [{$:/config/AutoFocus}match[type]then[true]] ~[[false]] }}} cancelPopups="yes" configTiddlerFilter="[[$:/core/ui/EditTemplate/type]]" inputCancelActions=<<input-cancel-actions>>/><$button popup=<<qualify "$:/state/popup/type-dropdown">> class="tc-btn-invisible tc-btn-dropdown tc-small-gap" tooltip={{$:/language/EditTemplate/Type/Dropdown/Hint}} aria-label={{$:/language/EditTemplate/Type/Dropdown/Caption}}>{{$:/core/images/down-arrow}}</$button><$button message="tm-remove-field" param="type" class="tc-btn-invisible tc-btn-icon" tooltip={{$:/language/EditTemplate/Type/Delete/Hint}} aria-label={{$:/language/EditTemplate/Type/Delete/Caption}}>{{$:/core/images/delete-button}}<$action-deletetiddler $filter="[<storeTitle>] [<refreshTitle>] [<selectionStateTitle>]"/></$button>
 </$fieldmangler></div>
 

core/ui/EditorToolbar/link-dropdown.tid

@@ -18,7 +18,7 @@ title: $:/core/ui/EditorToolbar/link-dropdown
 
 \define external-link()
 \whitespace trim
-<$button class="tc-btn-invisible" style="width: auto; display: inline-block; background-colour: inherit;" actions=<<add-link-actions>>>
+<$button class="tc-btn-invisible tc-btn-mini" style="width: auto; display: inline-block; background-colour: inherit;" actions=<<add-link-actions>>>
 {{$:/core/images/chevron-right}}
 </$button>
 \end
@@ -45,7 +45,7 @@ title: $:/core/ui/EditorToolbar/link-dropdown
 <$reveal tag="span" state=<<storeTitle>> type="nomatch" text="">
 <<external-link>>
 &#32;
-<$button class="tc-btn-invisible" style="width: auto; display: inline-block; background-colour: inherit;">
+<$button class="tc-btn-invisible tc-btn-mini" style="width: auto; display: inline-block; background-colour: inherit;">
 <<cancel-search-actions>><$set name="cssEscapedTitle" value={{{ [<storyTiddler>escapecss[]] }}}><$action-sendmessage $message="tm-focus-selector" $param=<<get-focus-selector>>/></$set>
 {{$:/core/images/close-button}}
 </$button>

core/ui/PageControls/network-activity.tid

@@ -0,0 +1,16 @@
+title: $:/core/ui/Buttons/network-activity
+tags: $:/tags/PageControls
+caption: {{$:/core/images/network-activity}} {{$:/language/Buttons/NetworkActivity/Caption}}
+description: {{$:/language/Buttons/NetworkActivity/Hint}}
+
+\whitespace trim
+<$button message="tm-http-cancel-all-requests" tooltip={{$:/language/Buttons/NetworkActivity/Hint}} aria-label={{$:/language/Buttons/NetworkActivity/Caption}} class=<<tv-config-toolbar-class>>>
+<$list filter="[<tv-config-toolbar-icons>match[yes]]">
+{{$:/core/images/network-activity}}
+</$list>
+<$list filter="[<tv-config-toolbar-text>match[yes]]">
+<span class="tc-btn-text">
+<$text text={{$:/language/Buttons/NetworkActivity/Caption}}/>
+</span>
+</$list>
+</$button>

core/ui/PageTemplate.tid

@@ -13,7 +13,8 @@ icon: $:/core/images/layout-button
 	tv-enable-drag-and-drop={{$:/config/DragAndDrop/Enable}}
 	tv-show-missing-links={{$:/config/MissingLinks}}
 	storyviewTitle={{$:/view}}
-	languageTitle={{{ [{$:/language}get[name]] }}}>
+	languageTitle={{{ [{$:/language}get[name]] }}}
+	tv-text-direction={{$:/config/DefaultTextDirection}}>
 
 <div class={{{ [all[shadows+tiddlers]tag[$:/tags/ClassFilters/PageTemplate]!is[draft]] :map:flat[subfilter{!!text}] tc-page-container [[tc-page-view-]addsuffix<storyviewTitle>] [[tc-language-]addsuffix<languageTitle>] :and[unique[]join[ ]] }}} >
 

core/ui/ViewTemplate.tid

@@ -7,7 +7,7 @@ $:/state/folded/$(currentTiddler)$
 \define cancel-delete-tiddler-actions(message) <$action-sendmessage $message="tm-$message$-tiddler"/>
 \import [all[shadows+tiddlers]tag[$:/tags/Macro/View]!is[draft]] [all[shadows+tiddlers]tag[$:/tags/Global/View]!is[draft]]
 <$vars storyTiddler=<<currentTiddler>> tiddlerInfoState=<<qualify "$:/state/popup/tiddler-info">>>
-<div data-tiddler-title=<<currentTiddler>> data-tags={{!!tags}} class={{{ [all[shadows+tiddlers]tag[$:/tags/ClassFilters/TiddlerTemplate]!is[draft]] :map:flat[subfilter{!!text}] tc-tiddler-frame tc-tiddler-view-frame [<currentTiddler>is[tiddler]then[tc-tiddler-exists]] [<currentTiddler>is[missing]!is[shadow]then[tc-tiddler-missing]] [<currentTiddler>is[shadow]then[tc-tiddler-exists tc-tiddler-shadow]] [<currentTiddler>is[shadow]is[tiddler]then[tc-tiddler-overridden-shadow]] [<currentTiddler>is[system]then[tc-tiddler-system]] [{!!class}] [<currentTiddler>tags[]encodeuricomponent[]addprefix[tc-tagged-]] +[join[ ]] }}} role="article">
+<div dir=<<tv-text-direction>> data-tiddler-title=<<currentTiddler>> data-tags={{!!tags}} class={{{ [all[shadows+tiddlers]tag[$:/tags/ClassFilters/TiddlerTemplate]!is[draft]] :map:flat[subfilter{!!text}] tc-tiddler-frame tc-tiddler-view-frame [<currentTiddler>is[tiddler]then[tc-tiddler-exists]] [<currentTiddler>is[missing]!is[shadow]then[tc-tiddler-missing]] [<currentTiddler>is[shadow]then[tc-tiddler-exists tc-tiddler-shadow]] [<currentTiddler>is[shadow]is[tiddler]then[tc-tiddler-overridden-shadow]] [<currentTiddler>is[system]then[tc-tiddler-system]] [{!!class}] [<currentTiddler>tags[]encodeuricomponent[]addprefix[tc-tagged-]] +[join[ ]] }}} role="article">
 <$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewTemplate]!is[draft]]" variable="listItem">
 <$transclude tiddler=<<listItem>>/>
 </$list>

core/ui/ViewTemplate/body.tid

@@ -3,7 +3,7 @@ tags: $:/tags/ViewTemplate
 
 \import [all[shadows+tiddlers]tag[$:/tags/Macro/View/Body]!is[draft]] [all[shadows+tiddlers]tag[$:/tags/Global/View/Body]!is[draft]]
 
-<$reveal tag="div" class="tc-tiddler-body" type="nomatch" stateTitle=<<folded-state>> text="hide" retain="yes" animate="yes">
+<$reveal tag="div" class="tc-tiddler-body" type="nomatch" stateTitle=<<folded-state>> text="hide" retain="yes" animate="yes" dir=<<tv-text-direction>>>
 
 <$transclude tiddler={{{ [<currentTiddler>] :cascade[all[shadows+tiddlers]tag[$:/tags/ViewTemplateBodyFilter]!is[draft]get[text]] :and[!is[blank]else[$:/core/ui/ViewTemplate/body/default]] }}} />
 

core/ui/ViewTemplate/subtitle.tid

@@ -3,7 +3,7 @@ tags: $:/tags/ViewTemplate
 
 \whitespace trim
 <$reveal type="nomatch" stateTitle=<<folded-state>> text="hide" tag="div" retain="yes" animate="yes">
-<div class="tc-subtitle">
+<div class="tc-subtitle" dir=<<tv-text-direction>>>
 <$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewTemplate/Subtitle]!has[draft.of]]" variable="subtitleTiddler" counter="indexSubtitleTiddler">
 <$list filter="[<indexSubtitleTiddler-first>match[no]]" variable="ignore">
 &nbsp;

core/ui/ViewTemplate/tags.tid

@@ -3,5 +3,5 @@ tags: $:/tags/ViewTemplate
 
 \whitespace trim
 <$reveal type="nomatch" stateTitle=<<folded-state>> text="hide" tag="div" retain="yes" animate="yes">
-<div class="tc-tags-wrapper"><$list filter="[all[current]tags[]sort[title]]" template="$:/core/ui/TagTemplate" storyview="pop"/></div>
+<div class="tc-tags-wrapper" dir=<<tv-text-direction>>><$list filter="[all[current]tags[]sort[title]]" template="$:/core/ui/TagTemplate" storyview="pop"/></div>
 </$reveal>

core/ui/ViewTemplate/title.tid

@@ -6,7 +6,7 @@ tags: $:/tags/ViewTemplate
 fill:$(foregroundColor)$;
 \end
 <div class="tc-tiddler-title">
-<div class="tc-titlebar">
+<div class="tc-titlebar" dir=<<tv-text-direction>>>
 <span class="tc-tiddler-controls">
 <$list filter="[all[shadows+tiddlers]tag[$:/tags/ViewToolbar]!has[draft.of]] :filter[lookup[$:/config/ViewToolbarButtons/Visibility/]!match[hide]]" storyview="pop" variable="listItem"><$set name="tv-config-toolbar-class" filter="[<tv-config-toolbar-class>] [<listItem>encodeuricomponent[]addprefix[tc-btn-]]"><$transclude tiddler=<<listItem>>/></$set></$list>
 </span>

core/wiki/config/DefaultTextDirection.tid

@@ -0,0 +1,2 @@
+title: $:/config/DefaultTextDirection
+text: auto

core/wiki/config/PageControlButtons.multids

@@ -13,6 +13,7 @@ core/ui/Buttons/language: hide
 core/ui/Buttons/tag-manager: hide
 core/ui/Buttons/manager: hide
 core/ui/Buttons/more-page-actions: hide
+core/ui/Buttons/network-activity: hide
 core/ui/Buttons/new-journal: hide
 core/ui/Buttons/new-image: hide
 core/ui/Buttons/palette: hide

core/wiki/macros/toc.tid

@@ -19,9 +19,9 @@ tags: $:/tags/Macro
 \define toc-body(tag,sort:"",itemClassFilter,exclude,path)
 \whitespace trim
 <ol class="tc-toc">
-  <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[enlist<__exclude__>]""">
+  <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[subfilter<__exclude__>]""">
     <$let item=<<currentTiddler>> path={{{ [<__path__>addsuffix[/]addsuffix<__tag__>] }}}>
-      <$set name="excluded" filter="""[enlist<__exclude__>] [<__tag__>]""">
+      <$set name="excluded" filter="[subfilter<__exclude__>] [<__tag__>]">
         <$set name="toc-item-class" filter=<<__itemClassFilter__>> emptyValue="toc-item-selected" value="toc-item">
           <li class=<<toc-item-class>>>
             <$list filter="[all[current]toc-link[no]]" emptyMessage="<$link to={{{ [<currentTiddler>get[target]else<currentTiddler>] }}}><<toc-caption>></$link>">
@@ -36,8 +36,8 @@ tags: $:/tags/Macro
 </ol>
 \end
 
-\define toc(tag,sort:"",itemClassFilter:"")
-<$macrocall $name="toc-body"  tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> />
+\define toc(tag,sort:"",itemClassFilter:"", exclude)
+<$macrocall $name="toc-body"  tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> exclude=<<__exclude__>>/>
 \end
 
 \define toc-linked-expandable-body(tag,sort:"",itemClassFilter,exclude,path)
@@ -75,7 +75,7 @@ tags: $:/tags/Macro
     <li class=<<toc-item-class>>>
       <$reveal type="nomatch" stateTitle=<<toc-state>> text="open">
         <$button setTitle=<<toc-state>> setTo="open" class="tc-btn-invisible tc-popup-keep">
-         <$transclude tiddler=<<toc-closed-icon>> />
+        <$transclude tiddler=<<toc-closed-icon>> />
           <<toc-caption>>
         </$button>
       </$reveal>
@@ -100,9 +100,9 @@ tags: $:/tags/Macro
 \define toc-expandable(tag,sort:"",itemClassFilter:"",exclude,path)
 \whitespace trim
 <$let tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> path={{{ [<__path__>addsuffix[/]addsuffix<__tag__>] }}}>
-  <$set name="excluded" filter="""[enlist<__exclude__>] [<__tag__>]""">
+  <$set name="excluded" filter="[subfilter<__exclude__>] [<__tag__>]">
     <ol class="tc-toc toc-expandable">
-      <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[enlist<__exclude__>]""">
+      <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[subfilter<__exclude__>]""">
         <$list filter="[all[current]toc-link[no]]" emptyMessage=<<toc-expandable-empty-message>> >
           <$macrocall $name="toc-unlinked-expandable-body" tag=<<__tag__>> sort=<<__sort__>> itemClassFilter="""itemClassFilter""" exclude=<<excluded>> path=<<path>> />
         </$list>
@@ -174,9 +174,9 @@ tags: $:/tags/Macro
 \define toc-selective-expandable(tag,sort:"",itemClassFilter,exclude,path)
 \whitespace trim
 <$let tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> path={{{ [<__path__>addsuffix[/]addsuffix<__tag__>] }}}>
-  <$set name="excluded" filter="[enlist<__exclude__>] [<__tag__>]">
+  <$set name="excluded" filter="[subfilter<__exclude__>] [<__tag__>]">
     <ol class="tc-toc toc-selective-expandable">
-      <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[enlist<__exclude__>]""">
+      <$list filter="""[all[shadows+tiddlers]tag<__tag__>!has[draft.of]$sort$] -[<__tag__>] -[subfilter<__exclude__>]""">
         <$list filter="[all[current]toc-link[no]]" variable="ignore" emptyMessage=<<toc-selective-expandable-empty-message>> >
           <$macrocall $name="toc-unlinked-selective-expandable-body" tag=<<__tag__>> sort=<<__sort__>> itemClassFilter=<<__itemClassFilter__>> exclude=<<excluded>> path=<<path>>/>
         </$list>
@@ -186,13 +186,13 @@ tags: $:/tags/Macro
 </$let>
 \end
 
-\define toc-tabbed-external-nav(tag,sort:"",selectedTiddler:"$:/temp/toc/selectedTiddler",unselectedText,missingText,template:"")
+\define toc-tabbed-external-nav(tag,sort:"",selectedTiddler:"$:/temp/toc/selectedTiddler",unselectedText,missingText,template:"",exclude)
 \whitespace trim
 <$tiddler tiddler={{{ [<__selectedTiddler__>get[text]] }}}>
   <div class="tc-tabbed-table-of-contents">
     <$linkcatcher to=<<__selectedTiddler__>>>
       <div class="tc-table-of-contents">
-        <$macrocall $name="toc-selective-expandable" tag=<<__tag__>> sort=<<__sort__>> itemClassFilter="[all[current]] -[<__selectedTiddler__>get[text]]"/>
+        <$macrocall $name="toc-selective-expandable" tag=<<__tag__>> sort=<<__sort__>> itemClassFilter="[all[current]] -[<__selectedTiddler__>get[text]]" exclude=<<__exclude__>>/>
       </div>
     </$linkcatcher>
     <div class="tc-tabbed-table-of-contents-content">
@@ -210,9 +210,9 @@ tags: $:/tags/Macro
 </$tiddler>
 \end
 
-\define toc-tabbed-internal-nav(tag,sort:"",selectedTiddler:"$:/temp/toc/selectedTiddler",unselectedText,missingText,template:"")
+\define toc-tabbed-internal-nav(tag,sort:"",selectedTiddler:"$:/temp/toc/selectedTiddler",unselectedText,missingText,template:"",exclude)
 \whitespace trim
 <$linkcatcher to=<<__selectedTiddler__>>>
-  <$macrocall $name="toc-tabbed-external-nav" tag=<<__tag__>> sort=<<__sort__>> selectedTiddler=<<__selectedTiddler__>> unselectedText=<<__unselectedText__>> missingText=<<__missingText__>> template=<<__template__>>/>
+  <$macrocall $name="toc-tabbed-external-nav" tag=<<__tag__>> sort=<<__sort__>> selectedTiddler=<<__selectedTiddler__>> unselectedText=<<__unselectedText__>> missingText=<<__missingText__>> template=<<__template__>> exclude=<<__exclude__>> />
 </$linkcatcher>
 \end

core/wiki/tags/PageControls.tid

@@ -1,2 +1,2 @@
 title: $:/tags/PageControls
-list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/layout]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/more-page-actions]]
+list: [[$:/core/ui/Buttons/home]] [[$:/core/ui/Buttons/close-all]] [[$:/core/ui/Buttons/fold-all]] [[$:/core/ui/Buttons/unfold-all]] [[$:/core/ui/Buttons/permaview]] [[$:/core/ui/Buttons/new-tiddler]] [[$:/core/ui/Buttons/new-journal]] [[$:/core/ui/Buttons/new-image]] [[$:/core/ui/Buttons/import]] [[$:/core/ui/Buttons/export-page]] [[$:/core/ui/Buttons/control-panel]] [[$:/core/ui/Buttons/advanced-search]] [[$:/core/ui/Buttons/manager]] [[$:/core/ui/Buttons/tag-manager]] [[$:/core/ui/Buttons/language]] [[$:/core/ui/Buttons/palette]] [[$:/core/ui/Buttons/theme]] [[$:/core/ui/Buttons/layout]] [[$:/core/ui/Buttons/storyview]] [[$:/core/ui/Buttons/encryption]] [[$:/core/ui/Buttons/timestamp]] [[$:/core/ui/Buttons/full-screen]] [[$:/core/ui/Buttons/print]] [[$:/core/ui/Buttons/save-wiki]] [[$:/core/ui/Buttons/refresh]] [[$:/core/ui/Buttons/network-activity]] [[$:/core/ui/Buttons/more-page-actions]]

editions/dev/tiddlers/Widget `destroy` method examples.tid

@@ -0,0 +1,36 @@
+created: 20230601123245916
+modified: 20230601125015463
+title: Widget `destroy` method examples
+type: text/vnd.tiddlywiki
+
+!! When using a v-dom library
+
+Virtual DOM libraries manages its internal state and apply state to DOM periodically, this is so called [["controlled" component|https://react.dev/learn/sharing-state-between-components#controlled-and-uncontrolled-components]]. When Tiddlywiki remove a DOM element controlled by a v-dom library, it may throws error.
+
+So when creating a plugin providing v-dom library binding, you need to tell v-dom library (for example, React.js) the DOM element is removed. We will use `destroy` method for this.
+
+```js
+  render() {
+    // ...other render related code
+    if (this.root === undefined || this.containerElement === undefined) {
+      // initialize the v-dom library
+      this.root = ReactDom.createRoot(document.createElement('div'));
+    }
+  }
+
+  destroy() {
+    // end the lifecycle of v-dom library
+    this.root && this.root.unmount();
+  }
+```
+
+The `destroy` method will be called by parent widget. If you widget don't have any child widget, you can just write your own tear down logic. If it may have some child widget, don't forget to call original `destroy` method in the `Widget` class to destroy children widgets.
+
+```js
+Widget.prototype.destroy();
+this.root && this.root.unmount();
+/** if you are using ESNext
+super.destroy();
+this.root?.unmount();
+*/
+```

editions/dev/tiddlers/from tw5.com/moduletypes/WidgetModules.tid

@@ -1,7 +1,8 @@
-title: WidgetModules
+created: 20131101130700000
+modified: 20230601130631884
 tags: dev moduletypes
-created: 201311011307
-modified: 201311011307
+title: WidgetModules
+type: text/vnd.tiddlywiki
 
 ! Introduction
 
@@ -78,4 +79,10 @@ The individual methods defined by the widget object are documented in the source
 !! Widget `refreshChildren` method
 !! Widget `findNextSiblingDomNode` method
 !! Widget `findFirstDomNode` method
+!! Widget `destroy` method
+
+<<.from-version "5.3.0">> Gets called when any parent widget is unmounted from the widget tree.
+
+[[Examples|Widget `destroy` method examples]]
+
 !! Widget `removeChildDomNodes` method

editions/dev/tiddlers/system/doc-styles.tid

@@ -0,0 +1,40 @@
+created: 20150117152612000
+modified: 20230325101137075
+tags: $:/tags/Stylesheet
+title: $:/editions/tw5.com/doc-styles
+type: text/vnd.tiddlywiki
+
+a.doc-from-version.tc-tiddlylink {
+    display: inline-block;
+    border-radius: 1em;
+	background: <<colour muted-foreground>>;
+	color: <<colour background>>;
+	fill: <<colour background>>;
+    padding: 0 0.4em;
+    font-size: 0.7em;
+    text-transform: uppercase;
+    font-weight: bold;
+    line-height: 1.5;
+    vertical-align: text-bottom;
+}
+
+a.doc-deprecated-version.tc-tiddlylink {
+    display: inline-block;
+    border-radius: 1em;
+	background: red;
+	color: <<colour background>>;
+	fill: <<colour background>>;
+    padding: 0 0.4em;
+    font-size: 0.7em;
+    text-transform: uppercase;
+    font-weight: bold;
+    line-height: 1.5;
+    vertical-align: text-bottom;
+}
+
+.doc-deprecated-version svg,
+.doc-from-version svg {
+	width: 1em;
+	height: 1em;
+    vertical-align: text-bottom;
+}

editions/dev/tiddlers/system/version-macros.tid

@@ -0,0 +1,14 @@
+code-body: yes
+created: 20161008085627406
+modified: 20221007122259593
+tags: $:/tags/Macro
+title: $:/editions/tw5.com/version-macros
+type: text/vnd.tiddlywiki
+
+\define .from-version(version)
+<$link to={{{ [<__version__>addprefix[Release ]] }}} class="doc-from-version">{{$:/core/images/warning}} New in: <$text text=<<__version__>>/></$link>
+\end
+
+\define .deprecated-since(version, superseded:"TODO-Link")
+<$link to="Deprecated - What does it mean" class="doc-deprecated-version tc-btn-invisible">{{$:/core/images/warning}} Deprecated since: <$text text=<<__version__>>/></$link> (see <$link to=<<__superseded__>>><$text text=<<__superseded__>>/></$link>)
+\end

editions/tw5.com/tiddlers/Right-To-Left Languages.tid

@@ -0,0 +1,11 @@
+created: 20230613162508509
+modified: 20230613162508509
+title: Right-To-Left Languages
+type: text/vnd.tiddlywiki
+
+<<.from-version "5.3.0">> The [[language plugins|Languages]] in TiddlyWiki's plugin library apply the appropriate [["right-to-left" setting|https://www.w3.org/International/questions/qa-html-dir]] to the entire document. To set the right to left setting independently for an individual tiddler, use the `\dir` [[pragma|Pragma]] at the top of the tiddler:
+
+```
+\dir rtl
+This text will be displayed with right-to-left formatting
+```

editions/tw5.com/tiddlers/macros/TableOfContentsMacro.tid

@@ -1,5 +1,5 @@
 created: 20140919155729620
-modified: 20220819093733569
+modified: 20230427125500432
 tags: Macros [[Core Macros]]
 title: Table-of-Contents Macros
 type: text/vnd.tiddlywiki
@@ -53,15 +53,21 @@ These two parameters are combined into a single [[filter expression|Filter Expre
 
 <<.var toc-tabbed-internal-nav>> and <<.var toc-tabbed-external-nav>> take additional parameters:
 
-;selectedTiddler
+; selectedTiddler
 : The title of the [[state tiddler|StateMechanism]] for noting the currently selected tiddler, defaulting to `$:/temp/toc/selectedTiddler`. It is recommended that this be a [[system tiddler|SystemTiddlers]]
-;unselectedText
+
+; unselectedText
 : The text to display when no tiddler is selected in the tree
-;missingText
+
+; missingText
 : The text to display if the selected tiddler doesn't exist
-;template
+
+; template
 : Optionally, the title of a tiddler to use as a [[template|TemplateTiddlers]] for transcluding the selected tiddler into the right-hand panel
 
+; exclude <<.from-version "5.3.0">>
+: This optional parameter can be used to exclude tiddlers from the TOC list. It allows a [[Title List]] or a <<.olink subfilter>>. Eg: `exclude:"HelloThere [[Title with spaces]]"` or `exclude:"[has[excludeTOC]]"`. Where the former will exclude two tiddlers and the later would exclude every tiddler that has a field <<.field excludeTOC>> independent of its value.<br>''Be aware'' that eg: `[prefix[H]]` is a shortcut for `[all[tiddlers]prefix[H]]`, which can have a performance impact, if used carelessly. So use $:/AdvancedSearch -> ''Filters'' tab to test the <<.param exclude>> parameter
+
 !! Custom Icons
 
 <<.from-version "5.2.4">>

editions/tw5.com/tiddlers/messages/WidgetMessage_ tm-http-cancel-all-requests.tid

@@ -0,0 +1,12 @@
+caption: tm-http-cancel-all-requests
+created: 20230429161453032
+modified: 20230429161453032
+tags: Messages
+title: WidgetMessage: tm-http-cancel-all-requests
+type: text/vnd.tiddlywiki
+
+The ''tm-http-cancel-all-requests'' message is used to cancel all outstanding HTTP requests initiated with [[WidgetMessage: tm-http-request]].
+
+Note that the state tiddler $:/state/http-requests contains a number representing the number of outstanding HTTP requests in progress.
+
+It does not take any parameters.

editions/tw5.com/tiddlers/messages/WidgetMessage_ tm-http-request Example Zotero.tid

@@ -0,0 +1,115 @@
+title: WidgetMessage: tm-http-request Example - Zotero
+tags: $:/tags/Macro
+
+\procedure select-zotero-group()
+Specify the Zotero group ID to import
+<$edit-text tiddler="$:/config/zotero-group" tag="input"/> or 
+<$select tiddler="$:/config/zotero-group">
+<option value="4813312">com216</option>
+<option value="4913310">pos252</option>
+<option value="4747244">idt575</option>
+</$select>
+\end
+
+\procedure zotero-save-item(item)
+<$action-createtiddler
+	$basetitle={{{ =[[_zotero_import ]] =[<item>jsonget[key]] =[[ ]] =[<item>jsonget[title]] +[join[]] }}}
+	text={{{ [<item>jsonget[title]] }}}
+	tags="$:/tags/ZoteroImport"
+>
+	<$action-setmultiplefields $tiddler=<<createTiddler-title>> $fields="[<item>jsonindexes[]addprefix[zotero-]]" $values="[<item>jsonindexes[]] :map[<item>jsonget<currentTiddler>else[.XXXXX.]]"/>
+	<$list filter="[<item>jsonindexes[creators]]" variable="creatorIndex">
+		<$action-setmultiplefields $tiddler=<<createTiddler-title>> $fields="[<item>jsonget[creators],<creatorIndex>,[creatorType]addprefix[zotero-]]" $values="[<item>jsonget[creators],<creatorIndex>,[lastName]] [<item>jsonget[creators],<creatorIndex>,[firstName]] +[join[, ]] :else[<item>jsonget[creators],<creatorIndex>,[name]] "/>
+	</$list>
+</$action-createtiddler>
+\end zotero-save-item
+
+\procedure zotero-save-items(data)
+<$list filter="[<data>jsonindexes[]] :map[<data>jsonextract<currentTiddler>,[data]]" variable="item">
+	<$macrocall $name="zotero-save-item" item=<<item>>/>
+</$list>
+\end zotero-save-items
+
+\procedure zotero-get-items(start:"0",limit:"25")
+
+\procedure completion()
+\import [[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]
+	<$action-log msg="In completion"/>
+	<$action-log/>
+	<!-- Success -->
+	<$list filter="[<status>compare:number:gteq[200]compare:number:lteq[299]]" variable="ignore">
+		<!-- Import these items -->
+		<$macrocall $name="zotero-save-items" data=<<data>>/>
+		<!-- Check if there are any more items to download -->
+		<$list filter="[<headers>jsonget[total-results]subtract<start>subtract<limit>compare:number:gt[0]]" variable="ignore">
+			<$macrocall $name="zotero-get-items" start={{{ [<start>add<limit>] }}} limit=<<limit>>/>
+		</$list>
+	</$list>
+\end completion
+
+\procedure progress()
+\import [[$:/core/ui/PageMacros]] [all[shadows+tiddlers]tag[$:/tags/Macro]!has[draft.of]]
+	<$action-log message="In progress-actions"/>
+\end progress
+
+\procedure request-url()
+\rules only transcludeinline transcludeblock filteredtranscludeinline filteredtranscludeblock
+https://api.zotero.org/groups/{{$:/config/zotero-group}}/items/
+\end request-url
+
+<$wikify name="url" text=<<request-url>>>
+	<$action-sendmessage
+		$message="tm-http-request"
+		url=<<url>>
+		method="GET"
+		query-format="json"
+		query-sort="title"
+		query-start=<<start>>
+		query-limit=<<limit>>
+		header-accept="application/json"
+		bind-status="$:/temp/zotero/status"
+		bind-progress="$:/temp/zotero/progress"
+		oncompletion=<<completion>>
+		onprogress=<<progress>>
+		var-start=<<start>>
+		var-limit=<<limit>>
+	/>
+</$wikify>
+\end
+
+\procedure zotero-actions()
+<$macrocall $name="zotero-get-items" start="0" limit="50"/>
+\end
+
+<<select-zotero-group>>
+
+<$button actions=<<zotero-actions>>>
+Start import from Zotero group
+</$button>
+
+<$button message="tm-http-cancel-all-requests">
+Cancel all HTTP requests
+</$button> Outstanding requests: {{$:/state/http-requests}}
+
+<$list filter="[tag[$:/tags/ZoteroImport]limit[1]]" variable="ignore">
+
+!! Imported Tiddlers
+
+<$button>
+<$action-deletetiddler $filter="[tag[$:/tags/ZoteroImport]]"/>
+Delete these tiddlers
+</$button>
+
+Export: <$macrocall $name="exportButton" exportFilter="[tag[$:/tags/ZoteroImport]]" lingoBase="$:/language/Buttons/ExportTiddlers/"/>
+
+</$list>
+
+<ol>
+<$list filter="[tag[$:/tags/ZoteroImport]]">
+<li>
+<$link>
+<$view field="title"/>
+</$link>
+</li>
+</$list>
+</ol>

editions/tw5.com/tiddlers/messages/WidgetMessage_ tm-http-request.tid

@@ -0,0 +1,51 @@
+caption: tm-http-request
+created: 20230429161453032
+modified: 20230429161453032
+tags: Messages
+title: WidgetMessage: tm-http-request
+type: text/vnd.tiddlywiki
+
+The ''tm-http-request'' message is used to make an HTTP request to a server.
+
+It uses the following properties on the `event` object:
+
+|!Name |!Description |
+|param |Not used |
+|paramObject |Hashmap of parameters (see below) |
+
+The following parameters are used:
+
+|!Name |!Description |
+|method |HTTP method (eg "GET", "POST") |
+|body |String data to be sent with the request |
+|query-* |Query string parameters with string values |
+|header-* |Headers with string values |
+|password-header-* |Headers with values taken from the password store |
+|password-query-* |Query string parameters with values taken from the password store |
+|var-* |Variables to be passed to the completion and progress handlers (without the "var-" prefix) |
+|bind-status |Title of tiddler to which the status of the request ("pending", "complete", "error") should be bound |
+|bind-progress |Title of tiddler to which the progress of the request (0 to 100) should be bound |
+|oncompletion |Action strings to be executed when the request completes |
+|onprogress |Action strings to be executed when progress is reported |
+
+The following variables are passed to the completion handler:
+
+|!Name |!Description |
+|status |HTTP result status code (see [[MDN|https://developer.mozilla.org/en-US/docs/Web/HTTP/Status]]) |
+|statusText |HTTP result status text |
+|error |Error string |
+|data |Returned data |
+|headers |Response headers as a JSON object |
+
+The following variables are passed to the progress handler:
+
+|!Name |!Description |
+|lengthComputable |Whether the progress loaded and total figures are valid - "yes" or "no" |
+|loaded |Number of bytes loaded so far |
+|total |Total number bytes to be loaded |
+
+Note that the state tiddler $:/state/http-requests contains a number representing the number of outstanding HTTP requests in progress.
+
+!! Examples
+
+* [[Zotero's|https://www.zotero.org/]] API for retrieving reference items: [[WidgetMessage: tm-http-request Example - Zotero]]

editions/tw5.com/tiddlers/messages/config-zotero-group.tid

@@ -0,0 +1,2 @@
+title: $:/config/zotero-group
+text: 4813312

editions/tw5.com/tiddlers/pragmas/Pragma_ _dir.tid

@@ -0,0 +1,13 @@
+created: 20230613162508509
+modified: 20230613162508509
+tags: Pragmas
+title: Pragma: \dir
+type: text/vnd.tiddlywiki
+
+<<.from-version "5.3.0">> The ''\dir'' [[pragma|Pragmas]] is used to set the text direction of text within a tiddler -- see [[Right-To-Left Languages]].
+
+The ''\dir'' pragma should be used after any procedure, function, widget or macro definitions.
+
+* `\dir ltr` – sets text direction to left-to-right
+* `\dir rtl` – sets text direction to right-to-left
+* `\dir auto` – causes the browser to attempt to automatically deduce the text direction

languages/zh-Hans/Buttons.multids

@@ -67,6 +67,8 @@ More/Caption: 更多
 More/Hint: 更多操作
 NewHere/Caption: 添加子条目
 NewHere/Hint: 创建一个标签为此条目名称的新条目
+NetworkActivity/Caption: 网络活动
+NetworkActivity/Hint: 取消所有网络活动
 NewJournal/Caption: 添加日志
 NewJournal/Hint: 创建一个新的日志条目
 NewJournalHere/Caption: 添加子日志

languages/zh-Hant/Buttons.multids

@@ -67,6 +67,8 @@ More/Caption: 更多
 More/Hint: 更多動作
 NewHere/Caption: 新增子條目
 NewHere/Hint: 建立一個標籤為此條目名稱的新條目
+NetworkActivity/Caption: 網路活動
+NetworkActivity/Hint: 取消所有網路活動
 NewJournal/Caption: 新增日誌
 NewJournal/Hint: 建立一個新的日誌條目
 NewJournalHere/Caption: 新增子日誌

plugins/tiddlywiki/browser-storage/settings.tid

@@ -28,6 +28,16 @@ This setting allows a custom alert message to be displayed when an attempt to st
 
 <$link to="$:/config/BrowserStorage/QuotaExceededAlert">Quota Exceeded Alert</$link>: <$edit-text tiddler="$:/config/BrowserStorage/QuotaExceededAlert" default="" tag="input" size="50"/>
 
+! Prevent browser from evicting local storage
+
+Permission for local storage persistence: ''{{$:/info/browser/storage/persisted}}''
+
+The first time a tiddler is saved to local storage a request will be made to prevent automatic eviction of local storage for this site. This means the data will not be cleared unless the user manually clears it.
+
+Old browsers may not support this feature. New browsers might not support the feature if the wiki is hosted on a non-localhost unencrypted http connection.
+
+Some browsers will explicitly prompt the user for permission. Other browsers may automatically grant or deny the request based on site usage or based on whether the site is bookmarked.
+
 ! Startup Log
 
 The tiddler $:/temp/BrowserStorage/Log contains a log of the tiddlers that were loaded from local storage at startup:

plugins/tiddlywiki/browser-storage/startup.js

@@ -19,7 +19,8 @@ exports.after = ["startup"];
 exports.synchronous = true;
 
 var ENABLED_TITLE = "$:/config/BrowserStorage/Enabled",
-	SAVE_FILTER_TITLE = "$:/config/BrowserStorage/SaveFilter";
+	SAVE_FILTER_TITLE = "$:/config/BrowserStorage/SaveFilter",
+	PERSISTED_STATE_TITLE = "$:/info/browser/storage/persisted";
 
 var BrowserStorageUtil = require("$:/plugins/tiddlywiki/browser-storage/util.js").BrowserStorageUtil;
 
@@ -53,6 +54,48 @@ exports.startup = function() {
 		$tw.wiki.addTiddler({title: ENABLED_TITLE, text: "no"});
 		$tw.browserStorage.clearLocalStorage();
 	});
+	// Helpers for protecting storage from eviction
+	var setPersistedState = function(state) {
+			$tw.wiki.addTiddler({title: PERSISTED_STATE_TITLE, text: state});
+		},
+		requestPersistence = function() {
+			setPersistedState("requested");
+			navigator.storage.persist().then(function(persisted) {
+				console.log("Request for persisted storage " + (persisted ? "granted" : "denied"));
+				setPersistedState(persisted ? "granted" : "denied");
+			});
+		},
+		persistPermissionRequested = false,
+		requestPersistenceOnFirstSave = function() {
+			$tw.hooks.addHook("th-saving-tiddler", function(tiddler) {
+				if (!persistPermissionRequested) {
+					var filteredChanges = filterFn.call($tw.wiki, function(iterator) {
+						iterator(tiddler,tiddler.getFieldString("title"));
+					});
+					if (filteredChanges.length > 0) {
+						// The tiddler will be saved to local storage, so request persistence
+						requestPersistence();
+						persistPermissionRequested = true;
+					}
+				}
+				return tiddler;
+			});
+		};
+	// Request the browser to never evict the localstorage. Some browsers such as firefox
+	// will prompt the user. To make the decision easier for the user only prompt them
+	// when they click the save button on a tiddler which will be stored to localstorage.
+	if (navigator.storage && navigator.storage.persist) {
+		navigator.storage.persisted().then(function(isPersisted) {
+			if (!isPersisted) {
+				setPersistedState("not requested yet");
+				requestPersistenceOnFirstSave();
+			} else {
+				setPersistedState("granted");
+			}
+		});
+	} else {
+		setPersistedState("feature not available");
+	}
 	// Track tiddler changes
 	$tw.wiki.addEventListener("change",function(changes) {
 		// Bail if browser storage is disabled
@@ -76,6 +119,10 @@ exports.startup = function() {
 			if(title === ENABLED_TITLE) {
 				return;
 			}
+			// This should always be queried from the browser, so don't store it in local storage
+			if(title === PERSISTED_STATE_TITLE) {
+				return;
+			}
 			// Save the tiddler
 			$tw.browserStorage.saveTiddlerToLocalStorage(title);
 		});

plugins/tiddlywiki/codemirror/engine.js

@@ -109,6 +109,9 @@ function CodeMirrorEngine(options) {
 	if(this.widget.editTabIndex) {
 		config["tabindex"] = this.widget.editTabIndex;
 	}
+	if(this.widget.editDir) {
+		config.direction = this.widget.editDir;
+	}
 	config.editWidget = this.widget;
 	// Create the CodeMirror instance
 	this.cm = window.CodeMirror(function(cmDomNode) {

themes/tiddlywiki/vanilla/base.tid

@@ -1388,9 +1388,8 @@ html body.tc-body.tc-single-tiddler-window {
 	height: 1.2em;
 }
 
-.tc-editor-toolbar .tc-drop-down a,
-.tc-editor-toolbar .tc-drop-down button {
-	padding: 0;
+.tc-editor-toolbar .tc-drop-down button.tc-btn-mini {
+	padding: 2px 4px;
 }
 
 .tc-editor-toolbar button:hover {
@@ -3185,6 +3184,10 @@ span.tc-translink > a:first-child {
 	fill: <<colour background>>;
 }
 
+.tc-network-activity-background {
+	fill: <<colour network-activity-foreground>>;
+}
+
 /*
 ** Flexbox utility classes
 */