tungsten 0.4.10 → 0.4.12

package/dist/timeProfiler.js

@@ -5,7 +5,7 @@
 import { performance } from 'node:perf_hooks';
 import { AsyncLocalStorage, createHook } from 'node:async_hooks';
 import chalk from 'chalk-extensions';
-import { cliOut } from "./cliOutput.js";
+import { cliOut } from './cliOutput.js';
 // Nesting has to be recorded, not inferred: sibling phases started together sit inside each other's
 // time windows, so intervals alone cannot tell a nested call from a concurrent one. Async storage
 // gives each task its own phase even when several run at once.
@@ -161,7 +161,9 @@ function reportTimeline() {
     // trimmed to what is left of the line - a wrapped note breaks the column alignment of
     // every row after it, which is worse than losing the end of one label
     const notes = fullNotes.slice(0, Math.max(0, columns - rowWidth - 1));
-    cliOut('  ' + chalk.yellow`${label.padEnd(labelWidth)}` + ' ' + chalk.orange`${ms(phase.end - phase.start).padStart(9)}` + ' ' + chalk.mediumgrey`${`cpu ${ms(ownCpu)}`.padStart(13)}` + ' ' + ' '.repeat(from) + bar
+    cliOut('  ' + chalk.yellow`${label.padEnd(labelWidth)}`
+    // cpu is the figure that says what the phase cost, so it gets the colour
+    + ' ' + chalk.mediumgrey`${ms(phase.end - phase.start).padStart(9)}` + ' ' + chalk.orange`${`cpu ${ms(ownCpu)}`.padStart(13)}` + ' ' + ' '.repeat(from) + bar
     // only pad out to the full bar when something follows it
     + (notes === '' ? '' : ' '.repeat(barWidth - to) + chalk.mediumgrey`${notes}`));
   }
@@ -189,32 +191,66 @@ export function reportStartupPhase(name) {
   report(name, lastPhaseEnd, now);
   lastPhaseEnd = now;
 }
-// Per-operation totals, for pricing one call inside a phase - a phase says where time went, this
-// says what it went on. Accumulating is two clock reads, so callers need not check whether
-// profiling is on; only the report is gated.
-const tallies = new Map();
-export function tally(name, ms) {
-  const entry = tallies.get(name) ?? {
-    calls: 0,
-    ms: 0
-  };
-  entry.calls++;
-  entry.ms += ms;
-  tallies.set(name, entry);
+const rootTallies = new Map();
+const tallyStack = [];
+function tallyNode(name) {
+  const parent = tallyStack[tallyStack.length - 1];
+  const siblings = parent === undefined ? rootTallies : parent.children;
+  let node = siblings.get(name);
+  if (node === undefined) {
+    node = {
+      name,
+      parent,
+      children: new Map(),
+      calls: 0,
+      ms: 0
+    };
+    siblings.set(name, node);
+  }
+  return node;
+}
+// Synchronous work only. Concurrent operations overlap, so summing their wall clock counts the
+// same time once per operation - 291 parallel transforms tallied as 689,576ms of an 11s run - and
+// the stack that gives the nesting assumes nothing else runs in between. Time async work with a
+// phase, whose cpu figure is attributed rather than summed.
+export function tallied(name, work) {
+  const node = tallyNode(name);
+  tallyStack.push(node);
+  const start = performance.now();
+  try {
+    return work();
+  } finally {
+    node.calls++;
+    node.ms += performance.now() - start;
+    tallyStack.pop();
+  }
 }
-// Deliberately no async variant. Concurrent operations overlap, so summing their wall clock counts
-// the same time once per operation - 291 parallel transforms tallied as 689,576ms of an 11s run.
-// Time async work with a phase, whose cpu figure is attributed rather than summed.
 function reportTallies() {
-  if (tallies.size === 0) return;
+  if (rootTallies.size === 0) return;
   cliOut('');
-  cliOut(chalk.mediumgrey`tallied work - synchronous totals across the run, nested counted in both`);
-  const nameWidth = Math.max(...[...tallies.keys()].map(name => name.length));
-  for (const [name, {
-    calls,
-    ms: total
-  }] of [...tallies].sort((a, b) => b[1].ms - a[1].ms)) {
-    cliOut('  ' + chalk.yellow`${name.padEnd(nameWidth)}` + ' ' + chalk.orange`${ms(total).padStart(10)}` + ' ' + chalk.mediumgrey`${`${calls.toLocaleString()} calls`.padStart(13)}` + ' ' + chalk.mediumgrey`${`${(total / calls).toFixed(2)}ms each`}`);
+  cliOut(chalk.mediumgrey`tallied work - synchronous, nested under what it ran inside; self is the line's own time`);
+  const rows = [];
+  const collect = (nodes, indent) => {
+    for (const node of [...nodes.values()].sort((a, b) => b.ms - a.ms)) {
+      rows.push({
+        indent,
+        node
+      });
+      collect(node.children, indent + 1);
+    }
+  };
+  collect(rootTallies, 0);
+  const nameWidth = Math.max(...rows.map(({
+    indent,
+    node
+  }) => indent * 2 + node.name.length));
+  for (const {
+    indent,
+    node
+  } of rows) {
+    const childMs = [...node.children.values()].reduce((sum, child) => sum + child.ms, 0);
+    const self = node.children.size === 0 ? '' : `self ${ms(node.ms - childMs)}`;
+    cliOut('  ' + ' '.repeat(indent * 2) + chalk.yellow`${node.name.padEnd(nameWidth - indent * 2)}` + ' ' + chalk.orange`${ms(node.ms).padStart(10)}` + ' ' + chalk.mediumgrey`${self.padStart(14)}` + ' ' + chalk.mediumgrey`${`${node.calls.toLocaleString()} calls`.padStart(13)}` + ' ' + chalk.mediumgrey`${`${(node.ms / node.calls).toFixed(2)}ms each`}`);
   }
 }
 // Other reports to print where the run total goes - the module load analysis registers itself here.
@@ -229,9 +265,9 @@ export function reportRunTotal(name) {
   const total = performance.now();
   // --profile-modules works on its own, so the extra reports are not gated on --profile
   if (startupProfiling) {
+    cliOut(chalk.yellow`${name}` + ' - ' + chalk.orange`${ms(total)}`);
     reportTimeline();
     reportTallies();
-    cliOut(chalk.yellow`${name}` + ' - ' + chalk.orange`${ms(total)}`);
   }
   for (const report of endOfRunReports) report();
 }

package/dist/update/integrateUpdateVdom.js

@@ -1,33 +1,33 @@
-import { IsHTMLElement } from "../DomNodes.js";
-import { DomRegion } from "../DomRegion.js";
-import { DomPointer } from "../DomPointer.js";
-import { ContentNodeComponentIsClassComponent, ContentNodeIsNonRendered, ContentNodeIsLiteral, ContentNodeIsHtml, ContentNodeIsComponent, ContentNodeIsArray, ContentNodeIsElement, ContentNodeElementHasValidKey } from "../ContentNode.js";
-import { StringIsHtmlEvent, htmlEvents } from "../htmlEvents.js";
-import { out, warn } from "../appOutput.js";
-import { getStyledContentFromFunctionComponent } from "../getStyledContentFromFunctionComponent.js";
-import { FunctionElement } from "../FunctionComponentStandIn.js";
-import { jssToCss } from "../style/jssToCss.js";
-import { htmlEventHandlerKey } from "../htmlEventHandlerKey.js";
-import { todo } from "../todo.js";
-import { $contentNull } from "../symbols.js";
-import { throwError } from "../throwError.js";
-import { $number, $string, RenderedContentNodeIsArray, RenderedContentNodeIsLiteral, makeRenderedContentNodeNonRendered, makeRenderedContentNodeHtml, makeRenderedContentNodeLiteral, RenderedContentNodeIsNonRendered, WideRenderedContentNodeIsArray, WideRenderedContentNodeIsLiteral, WideRenderedContentNodeIsHtml, WideRenderedContentNodeIsComponent, RenderedContentNodeSingleIsHead, RenderedContentNodeSingleIsComponent, RenderedContentNodeSingleIsHtml, RenderedContentNodeIsElement, RenderedContentNodeSingleIsLiteral } from "../RenderedContentNode.js";
-import { hasValidKey } from "../hasValidKey.js";
-import { $key, $props, $routeData, $routeParams, $type } from "../contentNodeSymbols.js";
-import { printComponentNamesInSource } from "../render/printComponentNameInSource.js";
-import { bindableHtmlElementsNumber, bindableHtmlElementsString } from "../components/bindable/bindableHtmlElements.js";
-import { checkedValueToBoolean } from "../checkedValueToBoolean.js";
-import { markOptionSelected } from "../markOptionSelected.js";
-import { innerHtmlFromProps } from "../innerHtmlFromProps.js";
-import { validChildren } from "../validChildren.js";
+import { IsHTMLElement } from '../DomNodes.js';
+import { DomRegion } from '../DomRegion.js';
+import { DomPointer } from '../DomPointer.js';
+import { ContentNodeComponentIsClassComponent, ContentNodeIsNonRendered, ContentNodeIsLiteral, ContentNodeIsHtml, ContentNodeIsComponent, ContentNodeIsArray, ContentNodeIsElement, ContentNodeElementHasValidKey } from '../ContentNode.js';
+import { StringIsHtmlEvent, htmlEvents } from '../htmlEvents.js';
+import { out, warn } from '../appOutput.js';
+import { getStyledContentFromFunctionComponent } from '../getStyledContentFromFunctionComponent.js';
+import { FunctionElement } from '../FunctionComponentStandIn.js';
+import { jssToCss } from '../style/jssToCss.js';
+import { htmlEventHandlerKey } from '../htmlEventHandlerKey.js';
+import { todo } from '../todo.js';
+import { $contentNull } from '../symbols.js';
+import { throwError } from '../throwError.js';
+import { $number, $string, RenderedContentNodeIsArray, RenderedContentNodeIsLiteral, makeRenderedContentNodeNonRendered, makeRenderedContentNodeHtml, makeRenderedContentNodeLiteral, RenderedContentNodeIsNonRendered, WideRenderedContentNodeIsArray, WideRenderedContentNodeIsLiteral, WideRenderedContentNodeIsHtml, WideRenderedContentNodeIsComponent, RenderedContentNodeSingleIsHead, RenderedContentNodeSingleIsComponent, RenderedContentNodeSingleIsHtml, RenderedContentNodeIsElement, RenderedContentNodeSingleIsLiteral } from '../RenderedContentNode.js';
+import { hasValidKey } from '../hasValidKey.js';
+import { $key, $props, $routeData, $routeParams, $type } from '../contentNodeSymbols.js';
+import { printComponentNamesInSource } from '../render/printComponentNameInSource.js';
+import { bindableHtmlElementsNumber, bindableHtmlElementsString } from '../components/bindable/bindableHtmlElements.js';
+import { checkedValueToBoolean } from '../checkedValueToBoolean.js';
+import { markOptionSelected } from '../markOptionSelected.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";
-import { $original } from "../componentProxyHandlers.js";
-import { booleanAttributeValue } from "../booleanAttributeValue.js";
-import { propsAreEqual } from "../propsAreEqual.js";
-import { markRendered, refreshTracing, renderedAt, trace, tracing } from "../stateTracking.js";
-import { beginMountScope, discardPendingMounts, endMountScope, queueMount } from "./pendingMounts.js";
+import { isDev } from '../isDev.js';
+import { $original } from '../componentProxyHandlers.js';
+import { booleanAttributeValue } from '../booleanAttributeValue.js';
+import { propsAreEqual } from '../propsAreEqual.js';
+import { markRendered, refreshTracing, renderedAt, trace, tracing } from '../stateTracking.js';
+import { beginMountScope, discardPendingMounts, endMountScope, queueMount } from './pendingMounts.js';
 /**
  * How many dom nodes each element's rendered content currently occupies, recorded on
  * every real update. When an update is skipped for unchanged props the child's dom is

package/dist/validChildren.js

@@ -1,5 +1,5 @@
-import { ContentNodeIsRendered } from "./ContentNode.js";
-import { RenderingNodeIsRendered } from "./RenderingNode.js";
+import { ContentNodeIsRendered } from './ContentNode.js';
+import { RenderingNodeIsRendered } from './RenderingNode.js';
 export function validChildren(children) {
   return ContentNodeIsRendered(children);
   //return children === 0 || children

package/dist/warnOnFrameworkChange.js

@@ -1,7 +1,7 @@
 import { join } from 'path';
 import chokidar from 'chokidar';
-import { getFrameworkDir } from "./getFrameworkDir.js";
-import { cliWarn } from "./cliOutput.js";
+import { getFrameworkDir } from './getFrameworkDir.js';
+import { cliWarn } from './cliOutput.js';
 // Dev mode only, opt-in via warnOnFrameworkChange in tungsten.config.js. Node's ESM module
 // cache can't be invalidated at runtime, so an already-running dev server can't pick up a
 // change to the tungsten package itself (e.g. a linked/workspace copy being rebuilt) without a

package/dist/zones/react.js

@@ -2,9 +2,9 @@ function _defineProperty(e, r, t) { return (r = _toPropertyKey(r)) in e ? Object
 function _toPropertyKey(t) { var i = _toPrimitive(t, "string"); return "symbol" == typeof i ? i : i + ""; }
 function _toPrimitive(t, r) { if ("object" != typeof t || !t) return t; var e = t[Symbol.toPrimitive]; if (void 0 !== e) { var i = e.call(t, r || "default"); if ("object" != typeof i) return i; throw new TypeError("@@toPrimitive must return a primitive value."); } return ("string" === r ? String : Number)(t); }
 import { TungstenSimpleComponent } from "../Components.js";
-import { createElementRef } from "../createRef.js";
-import { isServer } from "../isServer.js";
-import { jsx as _jsx } from "tungsten/jsxRuntime.js";
+import { createElementRef } from '../createRef.js';
+import { isServer } from '../isServer.js';
+import { jsx as _jsx } from "tungsten/jsx-runtime";
 export class ReactZone extends TungstenSimpleComponent {
   constructor(...args) {
     super(...args);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "tungsten",
-  "version": "0.4.10",
+  "version": "0.4.12",
   "description": "",
   "type": "module",
   "bin": {
@@ -13,6 +13,7 @@
     "./library": "./dist/components/library/index.js",
     "./react-zone": "./dist/zones/react.js",
     "./testing": "./dist/testing/index.js",
+    "./jsx-runtime": "./dist/jsx-runtime.js",
     "./*": "./dist/*",
     "./types/*": "./types/*"
   },
@@ -31,19 +32,19 @@
     "@babel/core": "^7.29.0",
     "@babel/parser": "^7.29.2",
     "@babel/plugin-syntax-import-assertions": "^7.29.7",
-    "@babel/plugin-transform-class-properties": "^7.28.6",
+    "@babel/preset-env": "^7.29.7",
     "@babel/preset-react": "^7.28.5",
+    "@babel/preset-typescript": "^7.29.7",
     "@babel/types": "^7.29.0",
     "@hono/node-server": "^1.19.11",
-    "@rollup/plugin-babel": "^5.3.1",
-    "@rollup/plugin-commonjs": "^22.0.2",
+    "@rollup/plugin-babel": "^6.1.0",
+    "@rollup/plugin-commonjs": "^28.0.9",
     "@rollup/plugin-json": "^6.1.0",
-    "@rollup/plugin-node-resolve": "^14.1.0",
+    "@rollup/plugin-node-resolve": "^16.0.3",
     "@rollup/plugin-terser": "^1.0.0",
     "@types/babel__core": "^7.20.5",
     "@types/express": "^5.0.6",
     "babel-plugin-css-to-js": "^0.0.4",
-    "babel-plugin-sxy-module-resolver": "^4.1.9",
     "babel-plugin-sxy-transform-cjs-to-esm": "^0.2.6",
     "bcryptjs": "^3.0.3",
     "chalk": "^5.6.2",
@@ -72,7 +73,7 @@
     "precinct": "^12.2.0",
     "react-router": "^6.30.3",
     "require-resolve-hook": "^1.1.0",
-    "rollup": "^2.80.0",
+    "rollup": "^4.63.1",
     "rollup-plugin-gzip": "^3.1.2",
     "sass": "^1.102.0",
     "serialize-javascript": "^6.0.2",
@@ -88,6 +89,7 @@
   },
   "devDependencies": {
     "@babel/generator": "^7.29.1",
+    "@stylistic/eslint-plugin": "^3.1.0",
     "@types/babel-types": "^7.0.16",
     "@types/babel__generator": "^7.27.0",
     "@types/chai": "^4.3.20",
@@ -100,8 +102,8 @@
     "@types/react": "19.1.9",
     "@types/react-dom": "19.1.7",
     "@types/serialize-javascript": "^5.0.4",
-    "@typescript-eslint/eslint-plugin": "^5.62.0",
-    "@typescript-eslint/parser": "^5.62.0",
+    "@typescript-eslint/eslint-plugin": "^8.69.0",
+    "@typescript-eslint/parser": "^8.69.0",
     "babel-plugin-replace-import-extension": "^1.1.5",
     "babel-plugin-sxy-transform-import-extensions": "^1.0.5",
     "babel-plugin-transform-import-extension": "^1.0.3",
@@ -113,12 +115,17 @@
     "happy-dom": "^20.11.1",
     "rimraf": "^5.0.10",
     "rollup-plugin-visualizer": "^5.14.0",
-    "sxy-test-runner": "^2.4.3",
+    "sxy-test-runner": "^2.4.9",
     "typescript": "^6.0.3"
   },
   "peerDependencies": {
     "react": "^18.2.0 || ^19.0.0",
-    "react-dom": "^18.2.0 || ^19.0.0",
+    "react-dom": "^18.2.0 || ^19.0.0"
+  },
+  "__oldDependencies": {
+    "babel-plugin-sxy-module-resolver": "^4.1.9"
+  },
+  "__oldPeerDependencies": {
     "rollup": "^2.79.1"
   },
   "peerDependenciesMeta": {

package/types/modules.d.ts

@@ -1,4 +1,6 @@
 declare module '@babel/preset-react'
+declare module '@babel/preset-env'
+declare module '@babel/preset-typescript'
 declare module 'babel-plugin-sxy-module-resolver'
 declare module 'babel-plugin-css-to-js'
 declare module '@babel/plugin-transform-class-properties'