react-x11 1.2.0 → 2.0.0

package/package.json

@@ -1,32 +1,69 @@
 {
   "name": "react-x11",
-  "version": "1.2.0",
+  "version": "2.0.0",
   "description": "react renderer with X11 as a target",
   "main": "./src/index.js",
   "files": [
     "src"
   ],
   "scripts": {
-    "test": "node --test",
+    "test": "node --import tsx --test --test-timeout=60000",
+    "typecheck": "tsc -p tsconfig.json",
     "lint": "eslint .",
     "format": "prettier --write .",
     "format:check": "prettier --check .",
+    "examples:app": "tsx examples/app.jsx",
+    "examples:theming": "tsx examples/theming.jsx",
+    "examples:appearance": "tsx examples/appearance.jsx",
     "examples:simple": "tsx examples/simple.jsx",
     "examples:simple-nojsx": "node examples/simple-nojsx.js",
     "examples:xeyes": "tsx examples/xeyes.jsx",
     "examples:dashboard": "tsx examples/dashboard.jsx",
     "examples:tasks": "tsx examples/tasks.jsx",
-    "examples:tasks:hot": "node --enable-source-maps --import ./examples/hmr-register.mjs examples/tasks-hot.jsx",
+    "examples:tasks:hot": "node --enable-source-maps --import react-x11/refresh/register examples/tasks-hot.jsx",
     "examples:menu": "tsx examples/menu.jsx",
+    "examples:monitor": "tsx examples/monitor.jsx",
+    "examples:attention": "tsx examples/attention.jsx",
+    "examples:tooltips": "tsx examples/tooltips.jsx",
+    "examples:chat": "tsx examples/chat.jsx",
+    "examples:clipboard": "tsx examples/clipboard.jsx",
+    "labs:urischeme": "tsx examples/labs/urischeme.jsx",
+    "filedialog:probe": "node scripts/filedialog-probe.mjs",
+    "a11y:probe": "node scripts/a11y-probe.mjs",
+    "scale:probe": "node scripts/scale-probe.mjs",
+    "xi2:probe": "node scripts/xi2-probe.mjs",
+    "globalmenu:host": "node scripts/globalmenu-host.mjs",
+    "devtools:proxy": "node scripts/devtools-proxy.mjs",
+    "examples:fonts": "tsx examples/fonts.jsx",
     "examples:form": "tsx examples/form.jsx",
-    "examples:richtext": "tsx examples/richtext.jsx",
+    "examples:rules": "tsx examples/rules.jsx",
+    "examples:selection": "tsx examples/selection.jsx",
+    "examples:settings": "tsx examples/settings.jsx",
+    "examples:timer": "tsx examples/timer.jsx",
     "examples:widgets": "tsx examples/widgets.jsx",
-    "examples:gl": "tsx examples/gl.jsx",
-    "examples:three": "tsx examples/three.jsx",
+    "examples:password": "tsx examples/password.jsx",
+    "examples:icons": "tsx examples/icons.jsx",
+    "examples:raster-gate": "tsx examples/raster-gate.jsx",
+    "examples:stress": "tsx examples/stress/index.jsx",
+    "examples:finder": "tsx examples/finder.jsx",
+    "examples:foreign": "tsx examples/foreign.jsx",
+    "examples:frame": "tsx examples/frame.jsx",
+    "labs:text-baseline": "tsx examples/labs/text-baseline.jsx",
+    "examples:viewer3d": "tsx examples/viewer3d.jsx",
+    "examples:transparent": "tsx examples/transparent.jsx",
     "examples:windows": "tsx examples/windows.jsx",
+    "examples:wm": "tsx examples/wm.jsx",
+    "examples:dnd-source": "tsx examples/dnd-source.jsx",
+    "examples:dnd-target": "tsx examples/dnd-target.jsx",
+    "stress:check": "tsx scripts/check-stress.jsx",
     "screenshots": "tsx scripts/screenshots.jsx",
     "screenshots:framed": "tsx scripts/screenshots-framed.jsx",
-    "bench": "tsx scripts/bench/protocol.js"
+    "bench": "tsx scripts/bench/protocol.js",
+    "bench:pixels": "tsx scripts/bench/pixels.js",
+    "bench:frames": "tsx scripts/bench/frames.js",
+    "docs:dev": "npm --prefix website start",
+    "docs:build": "npm --prefix website run build",
+    "docs:test": "npm --prefix website test"
   },
   "repository": {
     "type": "git",
@@ -45,11 +82,33 @@
     "node": ">=20.19"
   },
   "dependencies": {
-    "ntk": "^3.7.2",
-    "react-reconciler": "^0.33.0"
+    "ntk": "^8.3.0",
+    "react-reconciler": "^0.33.0",
+    "yoga-layout": "^3.2.1"
+  },
+  "optionalDependencies": {
+    "dbus-native": "^0.15.1"
   },
   "peerDependencies": {
-    "react": "^19.0.0"
+    "react": "^19.0.0",
+    "@babel/core": "^8.0.0",
+    "@babel/plugin-transform-react-jsx": "^8.0.0",
+    "hot-module-replacement": "^4.0.1",
+    "react-refresh": "^0.18.0"
+  },
+  "peerDependenciesMeta": {
+    "@babel/core": {
+      "optional": true
+    },
+    "@babel/plugin-transform-react-jsx": {
+      "optional": true
+    },
+    "hot-module-replacement": {
+      "optional": true
+    },
+    "react-refresh": {
+      "optional": true
+    }
   },
   "overrides": {
     "brace-expansion": "^5.0.8"
@@ -58,19 +117,78 @@
     "@babel/core": "^8.0.1",
     "@babel/plugin-transform-react-jsx": "^8.0.1",
     "@eslint/js": "^9.32.0",
+    "@types/react": "^19.2.17",
     "eslint": "^9.32.0",
     "eslint-plugin-react": "^7.37.5",
-    "globals": "^16.0.0",
-    "hot-module-replacement": "^4.0.0",
+    "globals": "^17.8.0",
+    "hot-module-replacement": "^4.0.1",
+    "katex": "^0.18.1",
     "prettier": "^3.6.0",
     "react": "^19.2.8",
     "react-devtools-core": "^7.0.1",
     "react-refresh": "^0.18.0",
     "tsx": "^4.23.1",
+    "typescript": "^7.0.2",
     "ws": "^8.21.1"
   },
   "type": "module",
   "exports": {
-    ".": "./src/index.js"
-  }
+    ".": {
+      "types": "./src/index.d.ts",
+      "default": "./src/index.js"
+    },
+    "./jsx-runtime": {
+      "types": "./src/jsx-runtime.d.ts",
+      "default": "./src/jsx-runtime.js"
+    },
+    "./jsx-dev-runtime": {
+      "types": "./src/jsx-dev-runtime.d.ts",
+      "default": "./src/jsx-dev-runtime.js"
+    },
+    "./debug": {
+      "types": "./src/debug.d.ts",
+      "default": "./src/debug.js"
+    },
+    "./host": {
+      "types": "./src/host.d.ts",
+      "default": "./src/host.js"
+    },
+    "./node": {
+      "types": "./src/node.d.ts",
+      "default": "./src/node.js"
+    },
+    "./style": {
+      "types": "./src/style.d.ts",
+      "default": "./src/style.js"
+    },
+    "./yoga": {
+      "types": "./src/yoga.d.ts",
+      "default": "./src/yoga.js"
+    },
+    "./ntk": {
+      "types": "./src/ntk.d.ts",
+      "default": "./src/ntk.js"
+    },
+    "./test": {
+      "types": "./src/testing/index.d.ts",
+      "default": "./src/testing/index.js"
+    },
+    "./refresh": {
+      "types": "./src/refresh/index.d.ts",
+      "default": "./src/refresh/index.js"
+    },
+    "./refresh/register": {
+      "types": "./src/refresh/register.d.ts",
+      "default": "./src/refresh/register.js"
+    },
+    "./refresh/loader": {
+      "types": "./src/refresh/loader.d.ts",
+      "default": "./src/refresh/loader.js"
+    },
+    "./keysyms": {
+      "types": "./src/keysyms.d.ts",
+      "default": "./src/keysyms.js"
+    }
+  },
+  "types": "./src/index.d.ts"
 }

package/src/ClickToComponent.js

@@ -13,12 +13,15 @@
 import { spawn } from 'node:child_process';
 import { fileURLToPath } from 'node:url';
 import { setClickToComponentHandler } from './events.js';
+import { selectInDevTools } from './DevToolsIntegration.js';
 
 const STACK_FRAME = /^\s*at\s+(?:(.+?)\s+\()?(.+?):(\d+):(\d+)\)?\s*$/;
 
 /** The first stack frame outside React/the reconciler/node internals — the
- * user's own JSX call site for whatever element this Error was captured at. */
-function resolveLocation(debugStack) {
+ * user's own JSX call site for whatever element this Error was captured at.
+ * Exported because `react-x11/test`'s `sourceOf` answers the same question
+ * for a test that a click answers for an editor. */
+export function resolveLocation(debugStack) {
   const stack = debugStack?.stack;
   if (!stack) return null;
   for (const line of stack.split('\n').slice(1)) {
@@ -159,6 +162,10 @@ function handleClick(node, native) {
     // Alt+Shift+Click
     logOwnerChain(fiber);
   }
+  // With DevTools attached, the click that says which element this is says
+  // it there too — the tree jumps to the component instead of the user
+  // hunting for the row they just clicked. Nothing to do when it is not.
+  selectInDevTools(node);
   flashHighlight(node);
   openInEditor(location);
 }