tungsten 0.2.25 → 0.3.0

package/dist/render/renderingTreeToHtml.js

@@ -13,6 +13,7 @@ import { printComponentNamesInSource } from "./printComponentNameInSource.js";
 import { RenderingNodeElementIsComponent, RenderingNodeElementIsHtml } from "../RenderingNode.js";
 import { processHead } from "./processHead.js";
 import { processRenderingNodeHtml } from "./processRenderingNodeHtml.js";
+import { innerHtmlFromProps } from "../innerHtmlFromProps.js";
 //// Maybe we should build the full tree before rendering
 //// may need some merging with componentTreeToHtml
 export async function renderingNodeToHtml(node, noEscape, headData, lastSelect) {
@@ -93,6 +94,13 @@ export async function renderingNodeToHtml(node, noEscape, headData, lastSelect)
       ...attribProps
     } = node[$props]);
     debug('validChildren(children)', validRenderingChildren(children));
+    const innerHtml = innerHtmlFromProps(type, node[$props], validRenderingChildren(children));
+    if (innerHtml !== null) {
+      if (type in htmlVoidTags) {
+        throw new TungstenError(`nodeToHtml() error: node type ${type} is an HTML void type` + ` (cannot have children), but the node has dangerouslySetInnerHTML.`);
+      }
+      return html + `<${type}${attribs}>${innerHtml}</${type}>`;
+    }
     if (validRenderingChildren(children)) {
       if (type in htmlVoidTags) {
         throw new TungstenError(`nodeToHtml() error: node ${JSON.stringify(node)} type ${type} is an HTML void type` + ` (cannot have children), but the node has children.`);

package/dist/routing/RouteTypes.d.ts

@@ -1,6 +1,6 @@
 import type { Routes } from './Routes.js';
 export type Path = `/${string}`;
-export type RouteKey = Path | 'default' | '404';
+export type RouteKey = Path | 'default' | '404' | 'error';
 export declare function StringIsValidRouteKey(string: string, routes: Routes): string is RouteKey;
 export declare function StringIsPath(string: string): string is Path;
 export declare function RouteKeyIsPath(path: RouteKey): path is Path;

package/dist/routing/RouteTypes.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"RouteTypes.d.ts","sourceRoot":"","sources":["../../src/routing/RouteTypes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,MAAM,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAA;AAC/B,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,CAAA;AAC/C,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,IAAI,QAAQ,CAExF;AACD,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,IAAI,IAAI,CAE3D;AACD,wBAAgB,cAAc,CAAC,IAAI,EAAE,QAAQ,GAAG,IAAI,IAAI,IAAI,CAE3D"}
+{"version":3,"file":"RouteTypes.d.ts","sourceRoot":"","sources":["../../src/routing/RouteTypes.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAE,MAAM,aAAa,CAAA;AAEzC,MAAM,MAAM,IAAI,GAAG,IAAI,MAAM,EAAE,CAAA;AAC/B,MAAM,MAAM,QAAQ,GAAG,IAAI,GAAG,SAAS,GAAG,KAAK,GAAG,OAAO,CAAA;AACzD,wBAAgB,qBAAqB,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,GAAG,MAAM,IAAI,QAAQ,CAExF;AACD,wBAAgB,YAAY,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,IAAI,IAAI,CAE3D;AACD,wBAAgB,cAAc,CAAC,IAAI,EAAE,QAAQ,GAAG,IAAI,IAAI,IAAI,CAE3D"}

package/dist/routing/routeSymbols.d.ts

@@ -0,0 +1,9 @@
+export declare const $notFound: unique symbol;
+export type $NotFound = typeof $notFound;
+export declare const $404: unique symbol;
+export type $404 = typeof $404;
+export declare const $default: unique symbol;
+export type $Default = typeof $default;
+export declare const $error: unique symbol;
+export type $Error = typeof $error;
+//# sourceMappingURL=routeSymbols.d.ts.map

package/dist/routing/routeSymbols.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"routeSymbols.d.ts","sourceRoot":"","sources":["../../src/routing/routeSymbols.ts"],"names":[],"mappings":"AACA,eAAO,MAAM,SAAS,eAAqB,CAAA;AAC3C,MAAM,MAAM,SAAS,GAAG,OAAO,SAAS,CAAA;AAExC,eAAO,MAAM,IAAI,eAAgB,CAAA;AACjC,MAAM,MAAM,IAAI,GAAG,OAAO,IAAI,CAAA;AAE9B,eAAO,MAAM,QAAQ,eAAoB,CAAA;AACzC,MAAM,MAAM,QAAQ,GAAG,OAAO,QAAQ,CAAA;AAEtC,eAAO,MAAM,MAAM,eAAkB,CAAA;AACrC,MAAM,MAAM,MAAM,GAAG,OAAO,MAAM,CAAA"}

package/dist/routing/routeSymbols.js

@@ -0,0 +1,4 @@
+export const $notFound = Symbol('notFound');
+export const $404 = Symbol('404');
+export const $default = Symbol('default');
+export const $error = Symbol('error');

package/dist/update/integrateUpdateVdom.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"integrateUpdateVdom.d.ts","sourceRoot":"","sources":["../../src/update/integrateUpdateVdom.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EACH,WAAW,EAAwC,eAAe,EAElE,uBAAuB,EAG1B,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAKlD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAGjD,OAAO,EAAE,YAAY,EAAgB,MAAM,eAAe,CAAA;AAE1D,OAAO,EACe,mBAAmB,EAIT,4BAA4B,EAI3D,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAUhD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAA;AAGlE,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC5C,wBAAwB,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,UAAU,KAAK,GAAG,CAAA;IACpE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACzB,CAAA;AAYD,wBAAsB,0BAA0B,CAC5C,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,GAC/C,OAAO,CAAC,YAAY,CAAC,CA0GvB;AA+fD,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,YAAY,GAAG,mBAAmB,QAuC5E;AAgED,wBAAgB,eAAe,CAAC,IAAI,EAAE,eAAe,EAAE,UAAU,EAAE,WAAW,QAkK7E;AA6VD,KAAK,2BAA2B,GAAG;IAC/B,MAAM,EAAE,eAAe,CAAA;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,IAAI,EAAE,uBAAuB,CAAC;IAE9B,UAAU,EAAE,UAAU,CAAA;CACzB,CAAA;AACD,wBAAsB,uBAAuB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,2BAA2B,GAC3G,OAAO,CAAC,4BAA4B,CAAC,CAU1C;AAED,MAAM,MAAM,mBAAmB,CAC3B,aAAa,SAAS,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,IACzD;IACA,SAAS,EAAE,YAAY,CAAC,aAAa,CAAC,CAAA;IACtC,cAAc,EAAE,OAAO,CAAA;IACvB,cAAc,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,wBAAsB,2BAA2B,CAC7C,aAAa,SAAS,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,EAEzD,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,YAAY,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,EAC3C,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,EAC/C,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,WAAW,GACvB,OAAO,CAAC,mBAAmB,CAAC,aAAa,CAAC,CAAC,CAgD7C;AAED,wBAAgB,kBAAkB,CAC9B,IAAI,EAAE,mBAAmB,CAAC,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,GAC/D,IAAI,CAON"}
+{"version":3,"file":"integrateUpdateVdom.d.ts","sourceRoot":"","sources":["../../src/update/integrateUpdateVdom.ts"],"names":[],"mappings":"AAUA,OAAO,EAAE,UAAU,EAAE,MAAM,kBAAkB,CAAA;AAC7C,OAAO,EACH,WAAW,EAAwC,eAAe,EAElE,uBAAuB,EAG1B,MAAM,mBAAmB,CAAA;AAC1B,OAAO,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAA;AAKlD,OAAO,EAAE,eAAe,EAAE,MAAM,uBAAuB,CAAA;AAEvD,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAA;AAGjD,OAAO,EAAE,YAAY,EAAgB,MAAM,eAAe,CAAA;AAE1D,OAAO,EACe,mBAAmB,EAIT,4BAA4B,EAI3D,MAAM,2BAA2B,CAAA;AAClC,OAAO,EAAE,YAAY,EAAE,MAAM,mBAAmB,CAAA;AAYhD,OAAO,KAAK,EAAE,yBAAyB,EAAE,MAAM,mBAAmB,CAAA;AAGlE,MAAM,MAAM,mBAAmB,GAAG,WAAW,GAAG;IAC5C,wBAAwB,EAAE,CAAC,IAAI,EAAE,WAAW,EAAE,EAAE,EAAE,UAAU,KAAK,GAAG,CAAA;IACpE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAA;CACzB,CAAA;AAYD,wBAAsB,0BAA0B,CAC5C,OAAO,EAAE,YAAY,EAAE,UAAU,EAAE,WAAW,GAC/C,OAAO,CAAC,YAAY,CAAC,CA0GvB;AA8gBD,wBAAgB,oBAAoB,CAAC,IAAI,EAAE,YAAY,GAAG,mBAAmB,QAuC5E;AAgED,wBAAgB,eAAe,CAAC,IAAI,EAAE,eAAe,EAAE,UAAU,EAAE,WAAW,QAkK7E;AA0WD,KAAK,2BAA2B,GAAG;IAC/B,MAAM,EAAE,eAAe,CAAA;IACvB,QAAQ,EAAE,QAAQ,CAAC;IACnB,IAAI,EAAE,uBAAuB,CAAC;IAE9B,UAAU,EAAE,UAAU,CAAA;CACzB,CAAA;AACD,wBAAsB,uBAAuB,CAAC,EAAE,MAAM,EAAE,QAAQ,EAAE,IAAI,EAAE,UAAU,EAAE,EAAE,2BAA2B,GAC3G,OAAO,CAAC,4BAA4B,CAAC,CAU1C;AAED,MAAM,MAAM,mBAAmB,CAC3B,aAAa,SAAS,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,IACzD;IACA,SAAS,EAAE,YAAY,CAAC,aAAa,CAAC,CAAA;IACtC,cAAc,EAAE,OAAO,CAAA;IACvB,cAAc,EAAE,OAAO,CAAA;CAC1B,CAAA;AAED,wBAAsB,2BAA2B,CAC7C,aAAa,SAAS,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,EAEzD,aAAa,EAAE,aAAa,EAC5B,KAAK,EAAE,YAAY,CAAC,aAAa,CAAC,CAAC,OAAO,CAAC,EAC3C,WAAW,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,GAAG,SAAS,EAC/C,SAAS,EAAE,OAAO,EAClB,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,WAAW,GACvB,OAAO,CAAC,mBAAmB,CAAC,aAAa,CAAC,CAAC,CAgD7C;AAED,wBAAgB,kBAAkB,CAC9B,IAAI,EAAE,mBAAmB,CAAC,yBAAyB,CAAC,GAAG,EAAE,GAAG,CAAC,CAAC,GAC/D,IAAI,CAON"}

package/dist/update/integrateUpdateVdom.js

@@ -17,6 +17,8 @@ import { $key, $props, $routeData, $routeParams, $type } from "../contentNodeSym
 import { printComponentNamesInSource } from "../render/printComponentNameInSource.js";
 import { bindableHtmlElementsNumber, bindableHtmlElementsString } from "../components/bindable/bindableHtmlElements.js";
 import { checkedValueToBoolean } from "../checkedValueToBoolean.js";
+import { innerHtmlFromProps } from "../innerHtmlFromProps.js";
+import { validChildren } from "../validChildren.js";
 import { setCurrentComponent } from 'tungsten/hooks/setCurrentComponent.js';
 import { clearCurrentComponent } from 'tungsten/hooks/clearCurrentComponent.js';
 import { isDev } from "../isDev.js";
@@ -401,6 +403,15 @@ async function updateHtmlElement(tungstenElement, instance, newNode, oldNode, do
   //console.log(newNode[$type], 'children', newChildren)
   const oldChildren = oldNode.renderedChildren;
   //console.log('oldChildren', oldChildren)
+  const newInnerHtml = innerHtmlFromProps(newNode[$type], newNode[$props], validChildren(newChildren));
+  if (newInnerHtml !== null) {
+    // Replacing the markup wholesale is the only option: Tungsten holds the
+    // subtree as one opaque string and cannot diff it. Guarded so an update
+    // for an unrelated reason does not discard DOM state under the host.
+    const oldInnerHtml = innerHtmlFromProps(oldNode[$type], oldNode[$props], false);
+    if (newInnerHtml !== oldInnerHtml) domNode.innerHTML = newInnerHtml;
+    return makeRenderedContentNodeHtml(newNode, domNode, oldChildren);
+  }
   const renderedChildren = newNode[$props].__opaque === true ? oldChildren : await applyUpdate({
     tungstenElement: tungstenElement,
     instance,
@@ -783,13 +794,22 @@ async function createHtmlElement(tungstenElement, instance, node, domPointer, pa
   //!!!! node.domElement = el
   if (IsHTMLElement(domPointer.parent)) debug('***', node[$type], 'html created', htmlEl);
   // children
-  const renderedChildren = await createNode({
-    tungstenElement: tungstenElement,
-    instance,
-    newNode: node[$props].children,
-    domPointer: new DomPointer(htmlEl, htmlEl.childNodes.length),
-    parentNode: node
-  });
+  const innerHtml = innerHtmlFromProps(node[$type], node[$props], validChildren(node[$props].children));
+  let renderedChildren;
+  if (innerHtml !== null) {
+    // The raw markup owns the whole subtree, so there is nothing to create
+    // and nothing to record as rendered children.
+    htmlEl.innerHTML = innerHtml;
+    renderedChildren = makeRenderedContentNodeNonRendered();
+  } else {
+    renderedChildren = await createNode({
+      tungstenElement: tungstenElement,
+      instance,
+      newNode: node[$props].children,
+      domPointer: new DomPointer(htmlEl, htmlEl.childNodes.length),
+      parentNode: node
+    });
+  }
   if (node[$type] === 'select') {
     if (node[$props].value !== undefined && node[$props].value !== null) {
       htmlEl.value = String(node[$props].value);
@@ -930,6 +950,7 @@ function processAttributes(node) {
   delete attributes.ref;
   delete attributes.__zoneHtml;
   delete attributes.__opaque;
+  delete attributes.dangerouslySetInnerHTML;
   delete attributes.class;
   if (attributes.className !== undefined) attributes.class = attributes.className;
   delete attributes.className;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tungsten",
-  "version": "0.2.25",
+  "version": "0.3.0",
   "description": "",
   "type": "module",
   "bin": {
@@ -134,8 +134,8 @@
   "scripts": {
     "__build": "pnpm clean && pnpm build-prep && pnpm build-watch",
     "build": "run-s -c clean build-prep build-watch",
-    "clean": "rimraf intermed && rimraf dist",
-    "build-once": "rimraf intermed && rimraf dist && pnpm build-ts-once && pnpm build-babel-once",
+    "clean": "rimraf intermed dist",
+    "build-once": "rimraf intermed dist && pnpm build-ts-once && pnpm build-babel-once",
     "build-quick": "pnpm build-watch",
     "build-prep": "pnpm build-ts-once",
     "build-watch": "run-p build-ts build-babel",