retold 4.0.4 → 4.0.8

package/docs/architecture/templating/template-composition.md

@@ -0,0 +1,196 @@
+# Template Composition Expressions
+
+Composition expressions render other templates, enabling modular and reusable template designs. They are the primary mechanism for building complex output from simple, focused pieces.
+
+## Template (T)
+
+Renders a registered template by its hash. Optionally resolves data from an address to pass as the Record.
+
+**Tags:** `{~Template:TEMPLATE_HASH~}` `{~T:TEMPLATE_HASH~}` or `{~T:TEMPLATE_HASH:DATA_ADDRESS~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| TEMPLATE_HASH | The hash of a registered template |
+| DATA_ADDRESS | Optional. Address to resolve and pass as Record to the rendered template. |
+
+**Examples:**
+
+```javascript
+_Pict.TemplateProvider.addTemplate('UserBadge',
+	'<span class="badge">{~D:Record.Name~} ({~D:Record.Role~})</span>');
+
+_Pict.AppData.CurrentUser = { Name: 'Alice', Role: 'Admin' };
+
+// Render with data from an address
+_Pict.parseTemplate('{~T:UserBadge:AppData.CurrentUser~}');
+// '<span class="badge">Alice (Admin)</span>'
+
+// Without a data address, uses the current Record
+_Pict.parseTemplate('{~T:UserBadge~}', { Name: 'Bob', Role: 'User' });
+// '<span class="badge">Bob (User)</span>'
+```
+
+This is the most common composition expression. Use it to break large templates into smaller, reusable fragments.
+
+---
+
+## TemplateByDataAddress (TBDA)
+
+Reads a **template string** (the actual template content) from a data address and parses it inline. The value at the address must be a valid template string.
+
+**Tags:** `{~TemplateByDataAddress:ADDRESS~}` `{~TBDA:ADDRESS~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| ADDRESS | Path to a string containing template content |
+
+**Examples:**
+
+```javascript
+_Pict.AppData.CustomHeader = '<h1>{~D:AppData.SiteName~}</h1>';
+_Pict.AppData.SiteName = 'My Bookstore';
+
+_Pict.parseTemplate('{~TBDA:AppData.CustomHeader~}');
+// '<h1>My Bookstore</h1>'
+```
+
+This is useful when template content is stored in configuration, database records, or user-defined layouts. The resolved string is fully parsed -- it can contain any Jellyfish expressions.
+
+---
+
+## TemplateFromAddress (TFA)
+
+Identical to TemplateByDataAddress. Reads template content from a data address and parses it.
+
+**Tags:** `{~TemplateFromAddress:ADDRESS~}` `{~TFA:ADDRESS~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| ADDRESS | Path to a string containing template content |
+
+**Examples:**
+
+```javascript
+_Pict.parseTemplate('{~TFA:Record.TemplateContent~}',
+	{ TemplateContent: '<strong>{~D:Record.Label~}</strong>', Label: 'Important' });
+// '<strong>Important</strong>'
+```
+
+---
+
+## TemplateByReference (TBR)
+
+Reads a **template hash** (the name of a registered template) from a data address, then renders that registered template.
+
+**Tags:** `{~TemplateByReference:ADDRESS~}` `{~TBR:ADDRESS~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| ADDRESS | Path to a string containing a template hash |
+
+**Examples:**
+
+```javascript
+_Pict.TemplateProvider.addTemplate('CardLayout',
+	'<div class="card">{~D:Record.Content~}</div>');
+_Pict.TemplateProvider.addTemplate('ListLayout',
+	'<li>{~D:Record.Content~}</li>');
+
+// The template to use is determined by data
+_Pict.parseTemplate('{~TBR:Record.LayoutType~}',
+	{ LayoutType: 'CardLayout', Content: 'Hello' });
+// '<div class="card">Hello</div>'
+
+_Pict.parseTemplate('{~TBR:Record.LayoutType~}',
+	{ LayoutType: 'ListLayout', Content: 'Hello' });
+// '<li>Hello</li>'
+```
+
+The difference between TBR and TBDA: TBR resolves a template **name** from data and looks it up in the TemplateProvider. TBDA resolves the template **content** from data and parses it directly. Use TBR when the data controls which pre-registered template to use. Use TBDA when the data contains the actual template markup.
+
+---
+
+## TemplateFromMap (TFM)
+
+Looks up a key in a map/object, retrieves the entry, and renders a template with that entry as the Record.
+
+**Tags:** `{~TemplateFromMap:TEMPLATE_HASH:MAP_ADDRESS:KEY_ADDRESS~}` `{~TFM:TEMPLATE_HASH:MAP_ADDRESS:KEY_ADDRESS~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| TEMPLATE_HASH | Hash of the template to render |
+| MAP_ADDRESS | Address of the map/object to look up in |
+| KEY_ADDRESS | Address containing the key to use for the lookup |
+
+**Examples:**
+
+```javascript
+_Pict.AppData.DinosaurIndex = {
+	'Dino-01': { Name: 'Brontosaurus', Era: 'Jurassic' },
+	'Dino-02': { Name: 'T-Rex', Era: 'Cretaceous' },
+	'Dino-03': { Name: 'Triceratops', Era: 'Cretaceous' }
+};
+
+_Pict.TemplateProvider.addTemplate('DinoCard',
+	'<div><strong>{~D:Record.Name~}</strong> ({~D:Record.Era~})</div>');
+
+// Look up a dinosaur by ID and render its card
+_Pict.parseTemplate(
+	'{~TFM:DinoCard:AppData.DinosaurIndex:Record.IDDinosaur~}',
+	{ IDDinosaur: 'Dino-01' });
+// '<div><strong>Brontosaurus</strong> (Jurassic)</div>'
+```
+
+This pattern is common when rendering related records. Rather than embedding all related data in each record, store a map of related entities in AppData and look them up by key during rendering.
+
+---
+
+## TemplateByType (TBT)
+
+Checks the JavaScript type of a value (`typeof`) and renders a template if the type matches. Optionally renders a fallback template if the type does not match.
+
+**Tags:** `{~TemplateByType:DATA_ADDRESS:TYPE:TEMPLATE_IF_MATCH~}` `{~TBT:DATA_ADDRESS:TYPE:TEMPLATE_IF_MATCH~}` or `{~TBT:DATA_ADDRESS:TYPE:TEMPLATE_IF_MATCH:FALLBACK_DATA_ADDRESS:FALLBACK_TEMPLATE~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| DATA_ADDRESS | Address of the value to type-check |
+| TYPE | Expected JavaScript type (`string`, `number`, `object`, `boolean`, `undefined`) |
+| TEMPLATE_IF_MATCH | Template hash to render if the type matches |
+| FALLBACK_DATA_ADDRESS | Optional. Data address for the fallback template |
+| FALLBACK_TEMPLATE | Optional. Template hash to render if the type does not match |
+
+**Examples:**
+
+```javascript
+_Pict.TemplateProvider.addTemplate('ShowString',
+	'<p>Text: {~D:Record.Value~}</p>');
+_Pict.TemplateProvider.addTemplate('ShowNumber',
+	'<p>Number: {~Digits:Record.Value~}</p>');
+_Pict.TemplateProvider.addTemplate('ShowDefault',
+	'<p>Unknown type</p>');
+
+// Render different templates based on value type
+_Pict.AppData.Item = { Value: 'Hello' };
+_Pict.parseTemplate('{~TBT:AppData.Item.Value:string:ShowString~}');
+// '<p>Text: Hello</p>'
+
+// With fallback
+_Pict.AppData.Item = { Value: 42 };
+_Pict.parseTemplate(
+	'{~TBT:AppData.Item.Value:string:ShowString:AppData.Item:ShowNumber~}');
+// '<p>Number: 42.00</p>'
+```
+
+TemplateByType is useful when rendering heterogeneous data where the same field may contain different types across records.

package/docs/architecture/templating/template-expressions.md

@@ -0,0 +1,217 @@
+# Template Expressions
+
+Jellyfish ships with 44 built-in template expressions organized into ten categories. Each expression follows the same syntax: `{~TAG:parameters~}`. Most expressions have a long form and a shorthand (e.g. `Data` and `D`).
+
+This page provides an overview of each category with links to the full documentation and individual reference pages.
+
+---
+
+## Data Access Expressions
+
+Data access expressions resolve values from Pict's address space and return them as strings. These are the most frequently used expressions in Jellyfish templates.
+
+```html
+<h1>{~D:AppData.PageTitle~}</h1>
+<h1>{~DWAF:Record.Title^Untitled~}</h1>
+<script>var config = {~DJ:AppData.Config~};</script>
+```
+
+[Data Access Expressions — Full Documentation](architecture/templating/data-access.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Data](architecture/templating/ref-data.md) | `D` | Resolve a value from the address space |
+| [DataWithTemplateFallback](architecture/templating/ref-dwtf.md) | `DWTF` | Data with template fallback if falsy |
+| [DataWithAbsoluteFallback](architecture/templating/ref-dwaf.md) | `DWAF` | Data with literal fallback if falsy |
+| [DataValueByKey](architecture/templating/ref-dvbk.md) | `DVBK` | Dynamic key lookup on an object |
+| [DataJson](architecture/templating/ref-dj.md) | `DJ` | JSON-serialize a value |
+| [DataEncodeJavascriptString](architecture/templating/ref-dejs.md) | `DEJS` | Escape a value for JS string literals |
+
+---
+
+## Data Formatting Expressions
+
+Formatting expressions transform resolved values for display -- numbers, dates, currencies, and string manipulation.
+
+```html
+<span>{~Dollars:Record.Price~}</span>
+<time>{~DateTimeFormat:Record.PublishedDate^MMMM Do, YYYY~}</time>
+<p>{~J:, ^Record.City^Record.State^Record.Country~}</p>
+```
+
+[Data Formatting Expressions — Full Documentation](architecture/templating/data-formatting.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Digits](architecture/templating/ref-digits.md) | `Digits` | Format number with 2 decimals and thousands separators |
+| [Dollars](architecture/templating/ref-dollars.md) | `Dollars` | Format as US currency |
+| [PascalCaseIdentifier](architecture/templating/ref-pascalcaseidentifier.md) | `PascalCaseIdentifier` | Convert string to PascalCase |
+| [DateTimeYMD](architecture/templating/ref-datetimeymd.md) | `DateTimeYMD`, `DateYMD` | Format date as YYYY-MM-DD (timezone-aware) |
+| [DateTimeFormat](architecture/templating/ref-datetimeformat.md) | `DateTimeFormat`, `DateFormat` | Format date with custom DayJS pattern |
+| [DateOnlyYMD](architecture/templating/ref-dateonlyymd.md) | `DateOnlyYMD` | Format date-only as YYYY-MM-DD (UTC) |
+| [DateOnlyFormat](architecture/templating/ref-dateonlyformat.md) | `DateOnlyFormat` | Format date-only with custom pattern (UTC) |
+| [Join](architecture/templating/ref-join.md) | `J` | Join multiple values with a separator |
+| [JoinUnique](architecture/templating/ref-joinunique.md) | `JU` | Join deduplicated values |
+| [PluckJoinUnique](architecture/templating/ref-pluckjoinunique.md) | `PJU` | Pluck a property from array items, deduplicate, and join |
+| [HtmlCommentStart](architecture/templating/ref-hcs.md) | `HCS` | Conditionally start an HTML comment |
+| [HtmlCommentEnd](architecture/templating/ref-hce.md) | `HCE` | Conditionally end an HTML comment |
+
+---
+
+## Logic Expressions
+
+Logic expressions evaluate conditions and control what content appears in the rendered output.
+
+```html
+{~TIfAbs:AdminPanel::AppData.UserRole^==^admin~}
+{~NE:Record.HasAvatar^<img src="avatar.png">~}
+```
+
+[Logic Expressions — Full Documentation](architecture/templating/logic.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [TemplateIf](architecture/templating/ref-tif.md) | `TIf` | Compare two data values, render template if true |
+| [TemplateIfAbsolute](architecture/templating/ref-tifabs.md) | `TIfAbs` | Compare data value against a literal |
+| [NotEmpty](architecture/templating/ref-ne.md) | `NE` | Output literal text if value is truthy |
+
+---
+
+## Iteration Expressions
+
+Iteration expressions render a template once for each item in a collection.
+
+```html
+<ul>{~TS:ProductRow:AppData.Products~}</ul>
+{~TSWP:ItemRow:AppData.Items:AppData.DisplayConfig~}
+{~TVS:ValueDisplay:AppData.Tags~}
+```
+
+[Iteration Expressions — Full Documentation](architecture/templating/iteration.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [TemplateSet](architecture/templating/ref-ts.md) | `TS` | Render template for each item in an array |
+| [TemplateSetFromMap](architecture/templating/ref-tsfm.md) | `TSFM` | Look up array by key in map, render each item |
+| [TemplateSetWithPayload](architecture/templating/ref-tswp.md) | `TSWP` | Render with extra payload data per item |
+| [TemplateValueSet](architecture/templating/ref-tvs.md) | `TVS` | Iterate over values with Key/Value/Index/Count metadata |
+
+---
+
+## Template Composition Expressions
+
+Composition expressions render other templates, enabling modular and reusable template designs.
+
+```html
+{~T:UserCard:AppData.CurrentUser~}
+{~TBR:Record.TemplateName~}
+{~TFM:DinoCard:AppData.DinosaurMap:Record.IDDinosaur~}
+```
+
+[Template Composition Expressions — Full Documentation](architecture/templating/template-composition.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Template](architecture/templating/ref-template.md) | `T` | Render a registered template by hash |
+| [TemplateByDataAddress](architecture/templating/ref-tbda.md) | `TBDA` | Parse template content from a data address |
+| [TemplateFromAddress](architecture/templating/ref-tfa.md) | `TFA` | Same as TBDA |
+| [TemplateByReference](architecture/templating/ref-tbr.md) | `TBR` | Resolve template hash from data, render it |
+| [TemplateFromMap](architecture/templating/ref-tfm.md) | `TFM` | Look up record in map, render template with it |
+| [TemplateByType](architecture/templating/ref-tbt.md) | `TBT` | Render template based on value's JavaScript type |
+
+---
+
+## Solver Expressions
+
+Solver expressions evaluate mathematical expressions using Fable's expression parser, with support for arithmetic, built-in functions, and variable references.
+
+```html
+<span>Total: {~S:Price*Quantity:Record~}</span>
+<span>Area: {~S:ROUND(PI()*Radius*Radius,2):Record~}</span>
+{~SBR:AppData.PricingFormula:AppData.OrderData~}
+```
+
+[Solver Expressions — Full Documentation](architecture/templating/solvers.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Solve](architecture/templating/ref-solve.md) | `S` | Evaluate a math expression |
+| [SolveByReference](architecture/templating/ref-sbr.md) | `SBR` | Evaluate an equation string from data |
+
+---
+
+## Entity Expressions
+
+Entity expressions integrate with Pict's Meadow API layer to fetch records from REST endpoints and render them with templates. These are inherently asynchronous.
+
+```html
+{~E:Book^42^BookCard~}
+{~E:Book^Record.IDBook^BookCard~}
+```
+
+[Entity Expressions — Full Documentation](architecture/templating/entity.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Entity](architecture/templating/ref-entity.md) | `E` | Fetch an entity by type and ID, render with template |
+
+---
+
+## View and Self-Reference Expressions
+
+These expressions bridge templates with Pict's view system and JavaScript runtime.
+
+```html
+{~V:HeaderView~}
+{~VRS:ChildView~}
+<button onclick="{~P~}.views['MyView'].doSomething()">Click</button>
+```
+
+[View and Self-Reference Expressions — Full Documentation](architecture/templating/views.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [View](architecture/templating/ref-view.md) | `V` | Render a Pict view inline |
+| [ViewRetainingScope](architecture/templating/ref-vrs.md) | `VRS` | Render a view while carrying scope through |
+| [Pict](architecture/templating/ref-pict.md) | `P` | Reference to the Pict instance for event handlers |
+
+---
+
+## Debugging Expressions
+
+Debugging expressions help during development by logging values, inserting breakpoints, and rendering object structures.
+
+```html
+{~LS:Processing user section~}
+{~LV:AppData.CurrentUser~}
+{~Breakpoint~}
+{~DT:AppData.DebugData~}
+```
+
+[Debugging Expressions — Full Documentation](architecture/templating/debugging.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [Breakpoint](architecture/templating/ref-breakpoint.md) | `Breakpoint` | Insert a debugger breakpoint |
+| [LogStatement](architecture/templating/ref-ls.md) | `LS` | Log a literal message |
+| [LogValue](architecture/templating/ref-lv.md) | `LV` | Log a resolved value with type info |
+| [LogValueTree](architecture/templating/ref-lvt.md) | `LVT` | Log an object tree to console |
+| [DataTree](architecture/templating/ref-dt.md) | `DT` | Render an object tree as HTML |
+
+---
+
+## Data Generation Expressions
+
+Data generation expressions produce random values for testing, unique IDs, or placeholder content.
+
+```html
+<span>{~RN:1,100~}</span>
+<code>REF-{~RNS:6~}</code>
+```
+
+[Data Generation Expressions — Full Documentation](architecture/templating/data-generation.md)
+
+| Expression | Tags | Description |
+|-----------|------|-------------|
+| [RandomNumber](architecture/templating/ref-rn.md) | `RN` | Generate a random integer |
+| [RandomNumberString](architecture/templating/ref-rns.md) | `RNS` | Generate a zero-padded random numeric string |

package/docs/architecture/templating/views.md

@@ -0,0 +1,154 @@
+# View and Self-Reference Expressions
+
+These expressions bridge templates with Pict's view system and JavaScript runtime. They render views inline, retain scope across view boundaries, and provide the Pict instance reference for event handlers.
+
+## View (V)
+
+Renders a registered Pict view by its hash. The view's render output is captured as a string and inserted into the template.
+
+**Tags:** `{~View:VIEW_HASH~}` `{~V:VIEW_HASH~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| VIEW_HASH | The hash identifier of a registered Pict view |
+
+**Examples:**
+
+```javascript
+// Register a view
+let _HeaderView = _Pict.addView('HeaderView',
+	{
+		ViewIdentifier: 'HeaderView',
+		DefaultRenderable: 'HeaderContent',
+		Templates: [
+			{
+				Hash: 'HeaderContent',
+				Template: '<header><h1>{~D:AppData.SiteName~}</h1></header>'
+			}
+		],
+		Renderables: [
+			{
+				RenderableHash: 'HeaderContent',
+				TemplateHash: 'HeaderContent',
+				DestinationAddress: '#header'
+			}
+		]
+	});
+
+// Embed the view in a template
+_Pict.parseTemplate('<div class="page">{~V:HeaderView~}<main>Content</main></div>');
+```
+
+The View expression triggers the view's render pipeline, capturing its output to a virtual render target. This output is then inserted at the expression's location in the template string.
+
+---
+
+## ViewRetainingScope (VRS)
+
+Same as View, but passes the current scope through to the child view using `renderWithScope()`. The child view can access values from the parent's Scope namespace.
+
+**Tags:** `{~ViewRetainingScope:VIEW_HASH~}` `{~VRS:VIEW_HASH~}`
+
+**Parameters:**
+
+| Parameter | Description |
+|-----------|-------------|
+| VIEW_HASH | The hash identifier of a registered Pict view |
+
+**Examples:**
+
+```javascript
+// Parent template sets scope values
+_Pict.parseTemplate(
+	'{~VRS:ChildView~}',
+	null,    // no record
+	null,    // no callback
+	null,    // no context
+	{ theme: 'dark', layout: 'compact' }  // scope
+);
+
+// Inside ChildView's templates, Scope values are accessible:
+// '{~D:Scope.theme~}' resolves to 'dark'
+// '{~D:Scope.layout~}' resolves to 'compact'
+```
+
+Use VRS when a parent view needs to pass contextual configuration to child views without polluting AppData. Scope is sticky -- it travels through the rendering chain without being modified, so deeply nested views all see the same scope values set by the parent.
+
+The plain `{~V:...~}` expression does not carry scope. Use it when the child view is self-contained and does not need context from its parent.
+
+---
+
+## Pict / Self-Reference (P)
+
+Returns the browser-side JavaScript reference to the Pict instance. This is essential for wiring event handlers in server-rendered HTML.
+
+**Tags:** `{~Pict~}` `{~P~}`
+
+**Parameters:** None. This expression takes no parameters.
+
+**Default value:** `window._Pict`
+
+**Examples:**
+
+```html
+<!-- Simple click handler -->
+<button onclick="{~P~}.views['CartView'].addItem({~D:Record.IDProduct~})">
+	Add to Cart
+</button>
+
+<!-- Calling a view method with data -->
+<a href="#" onclick="{~P~}.views['Nav'].navigate('{~DEJS:Record.Route~}'); return false;">
+	{~D:Record.Label~}
+</a>
+
+<!-- Accessing Pict state from inline JS -->
+<script>
+var currentUser = {~P~}.AppData.User;
+</script>
+```
+
+```javascript
+// Default
+_Pict.parseTemplate('{~P~}');
+// 'window._Pict'
+
+// Custom browser address (for nested Pict instances)
+_Pict.browserAddress = 'window._Pict.children[0]';
+_Pict.parseTemplate('{~P~}');
+// 'window._Pict.children[0]'
+```
+
+The Pict expression solves the problem of connecting server-rendered templates to client-side behavior. Without it, onclick handlers and inline scripts would need to hardcode the Pict instance path, which breaks when Pict instances are nested or when the global reference changes.
+
+### Common Patterns
+
+**View method calls from rendered HTML:**
+
+```javascript
+_Pict.TemplateProvider.addTemplate('ActionButton', [
+	'<button onclick="{~P~}.views[\'TodoView\'].toggleComplete(\'{~DEJS:Record.GUID~}\')">',
+	'	{~D:Record.Title~}',
+	'</button>'
+].join('\n'));
+```
+
+**Form submission:**
+
+```javascript
+_Pict.TemplateProvider.addTemplate('SearchForm', [
+	'<form onsubmit="{~P~}.views[\'SearchView\'].search(this.q.value); return false;">',
+	'	<input name="q" type="text" />',
+	'	<button type="submit">Search</button>',
+	'</form>'
+].join('\n'));
+```
+
+**Data attributes for JavaScript initialization:**
+
+```html
+<div data-pict-ref="{~P~}" data-view="ChartView">
+	{~V:ChartView~}
+</div>
+```

package/docs/examples/todolist/todo-list.md

@@ -82,7 +82,7 @@ npm install
 npm run build
 ```
 
-Open **http://localhost:8086** in a browser. The server serves the built client as static files. The web client includes a sortable task list with search and pagination, an add/edit form, and week/month/year calendar views.
+Open **http://localhost:8086** in a browser. The server serves the built client as static files. The web client includes a sortable task list with search and pagination, an add/edit form, and week/month/year calendar views.  You may have to restart the server for the client to begin serving, depending on your environment.
 
 See [Web Client](examples/todolist/todo-list-web-client.md) for details.
 

package/docs/modules/apps.md

@@ -0,0 +1,26 @@
+# Apps — Applications
+
+Full-stack applications built on the Retold ecosystem, combining Fable, Meadow, Orator, and Pict into complete systems.
+
+## Modules
+
+### [Retold Content System](/apps/retold-content-system/)
+
+Content management system built on the Retold ecosystem.
+
+**npm:** `retold-content-system`
+
+---
+
+### [Retold Remote](/apps/retold-remote/)
+
+Remote access application built on the Retold ecosystem.
+
+**npm:** `retold-remote`
+
+## All Apps Modules
+
+| Module | Description |
+|--------|-------------|
+| [retold-content-system](/apps/retold-content-system/) | Content management system built on the Retold ecosystem |
+| [retold-remote](/apps/retold-remote/) | Remote access application built on the Retold ecosystem |

package/docs/modules/pict.md

@@ -185,6 +185,22 @@ Markdown parsing and content rendering with Mermaid diagrams and KaTeX math equa
 
 ---
 
+### [Pict-Section-Code](/pict/pict-section-code/)
+
+Code editor and syntax highlighter wrapping CodeJar. Provides editable code editors and read-only syntax-highlighted displays with built-in support for JavaScript, JSON, HTML, CSS, and SQL. Supports custom highlighter functions and two-way data binding to Pict AppData.
+
+**npm:** `pict-section-code`
+
+---
+
+### [Pict-Section-MarkdownEditor](/pict/pict-section-markdowneditor/)
+
+Segmented markdown editor built on CodeMirror v6. Splits documents into independently editable segments with drag-and-drop reorder, formatting toolbar, image upload hooks, and live rich previews with Mermaid diagrams and KaTeX math. Supports read-only mode, rendered view toggle, and server-side image upload integration.
+
+**npm:** `pict-section-markdowneditor`
+
+---
+
 ### [Pict-Section-Flow](/pict/pict-section-flow/)
 
 Flow diagram section for visual workflow and process representations.
@@ -228,6 +244,8 @@ Flow diagram section for visual workflow and process representations.
 | [pict-service-commandlineutility](/pict/pict-service-commandlineutility/) | CLI utility tools |
 | [pict-section-recordset](/pict/pict-section-recordset/) | CRUD record management views |
 | [pict-section-content](/pict/pict-section-content/) | Markdown parsing and content rendering |
+| [pict-section-code](/pict/pict-section-code/) | Code editor and syntax highlighter wrapping CodeJar |
+| [pict-section-markdowneditor](/pict/pict-section-markdowneditor/) | Segmented markdown editor built on CodeMirror v6 |
 | [pict-section-form](/pict/pict-section-form/) | Configuration-driven dynamic forms |
 | [pict-section-tuigrid](/pict/pict-section-tuigrid/) | Toast UI Grid tabular data |
 | [pict-router](/pict/pict-router/) | Hash-based URL routing |

package/docs/modules/utility.md

@@ -1,9 +1,19 @@
 # Utility — Build & Documentation Tools
 
-The utility group provides supporting tools for building, documenting, testing, and supervising Retold applications.
+The utility group provides supporting tools for building, documenting, testing, caching, templating, and supervising Retold applications.
 
 ## Modules
 
+### [CacheTrax](/utility/cachetrax/)
+
+Lightweight in-memory object cache combining a hash map for O(1) key lookups with a double linked list for ordered eviction. Supports automatic size-based pruning on insert, time-based expiration, touch-to-refresh, and custom pruning functions.
+
+**Key features:** O(1) hash-indexed reads, configurable `maxLength` and `maxAge`, FIFO eviction, custom prune functions, Fable service integration, browser compatible.
+
+**npm:** `cachetrax` · **Version:** 1.0.x
+
+---
+
 ### [Indoctrinate](/utility/indoctrinate/)
 
 Documentation scaffolding and generation. Scans source trees, catalogs content with automatic label-based metadata, and generates structured output in multiple formats. Powers the Retold documentation hub by generating cross-module catalogs and keyword search indexes.
@@ -24,6 +34,16 @@ JSON manifest for consistent data description and parsing across all application
 
 ---
 
+### [Precedent](/utility/precedent/)
+
+Meta-templating engine for processing text streams with pattern-based template expressions. Define start/end pattern markers with string or function parsers, and Precedent handles nested pattern resolution automatically using a word tree architecture.
+
+**Key features:** Pattern-based start/end markers, string or function parsers, nested pattern support with prefix precedence, data passing to handlers, zero external dependencies, browser compatible.
+
+**npm:** `precedent` · **Version:** 1.0.x
+
+---
+
 ### [Quackage](/utility/quackage/)
 
 Standardized build tool for Retold modules. Handles browser bundling (Browserify), transpilation, unit testing, file management, JSON view assembly, and documentation generation from a single CLI.
@@ -48,7 +68,9 @@ Process supervision tool for running commands on schedule with LLM integration.
 
 | Module | Description |
 |--------|-------------|
+| [cachetrax](/utility/cachetrax/) | Hash-indexed object cache with time and size based expiration |
 | [indoctrinate](/utility/indoctrinate/) | Documentation scaffolding with content cataloging and cross-module search |
 | [manyfest](/utility/manyfest/) | JSON manifest for data description, validation, and address-based access |
+| [precedent](/utility/precedent/) | Meta-templating engine with pattern-based start/end markers and word tree matching |
 | [quackage](/utility/quackage/) | Build tool for browser bundles, testing, and packaging |
 | [ultravisor](/utility/ultravisor/) | Process supervision with scheduled tasks and LLM integration |