@0x1f320.sh/why-did-you-render-mcp 1.0.0-dev.5 → 1.0.0-dev.6

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (3) hide show
  1. package/dist/client/index.cjs +47 -0
  2. package/dist/client/index.js +47 -0
  3. package/package.json +1 -1
package/dist/client/index.cjs CHANGED
@@ -1,6 +1,52 @@
1
1
  Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
2
2
  //#region src/client/utils/describe-value.ts
3
3
  const MAX_DEPTH = 8;
4
+ const REACT_ELEMENT_SYMBOL = Symbol.for("react.element");
5
+ const REACT_TRANSITIONAL_ELEMENT_SYMBOL = Symbol.for("react.transitional.element");
6
+ const REACT_MEMO_TYPE = Symbol.for("react.memo");
7
+ const REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref");
8
+ function isReactElement(value) {
9
+ if (typeof value !== "object" || value === null) return false;
10
+ const v = value;
11
+ return v.$$typeof === REACT_ELEMENT_SYMBOL || v.$$typeof === REACT_TRANSITIONAL_ELEMENT_SYMBOL || v.$$typeof === 60103;
12
+ }
13
+ function resolveComponentInfo(type) {
14
+ let memo = false;
15
+ let forwardRef = false;
16
+ let current = type;
17
+ for (let i = 0; i < 5; i++) {
18
+ if (typeof current !== "object" || current === null) break;
19
+ const wrapper = current;
20
+ if (wrapper.$$typeof === REACT_MEMO_TYPE) {
21
+ memo = true;
22
+ current = wrapper.type;
23
+ } else if (wrapper.$$typeof === REACT_FORWARD_REF_TYPE) {
24
+ forwardRef = true;
25
+ current = wrapper.render;
26
+ } else break;
27
+ }
28
+ let name = "Unknown";
29
+ if (typeof current === "string") name = current;
30
+ else if (typeof current === "function") name = current.displayName || current.name || "Anonymous";
31
+ return {
32
+ name,
33
+ memo,
34
+ forwardRef
35
+ };
36
+ }
37
+ function serializeReactElement(el, seen, depth) {
38
+ const component = resolveComponentInfo(el.type);
39
+ const props = {};
40
+ if (el.props && typeof el.props === "object") for (const key of Object.keys(el.props)) {
41
+ if (key === "children") continue;
42
+ props[key] = serialize(el.props[key], seen, depth + 1);
43
+ }
44
+ return {
45
+ type: "react-node",
46
+ component,
47
+ props
48
+ };
49
+ }
4
50
  function serialize(value, seen, depth) {
5
51
  if (value === null) return null;
6
52
  if (value === void 0) return null;
@@ -21,6 +67,7 @@ function serialize(value, seen, depth) {
21
67
  if (seen.has(value)) return "[Circular]";
22
68
  if (depth >= MAX_DEPTH) return "[MaxDepth]";
23
69
  seen.add(value);
70
+ if (isReactElement(value)) return serializeReactElement(value, seen, depth);
24
71
  if (Array.isArray(value)) return value.map((item) => serialize(item, seen, depth + 1));
25
72
  const ctorName = Object.getPrototypeOf(value)?.constructor?.name;
26
73
  if (ctorName && ctorName !== "Object") {
package/dist/client/index.js CHANGED
@@ -1,5 +1,51 @@
1
1
  //#region src/client/utils/describe-value.ts
2
2
  const MAX_DEPTH = 8;
3
+ const REACT_ELEMENT_SYMBOL = Symbol.for("react.element");
4
+ const REACT_TRANSITIONAL_ELEMENT_SYMBOL = Symbol.for("react.transitional.element");
5
+ const REACT_MEMO_TYPE = Symbol.for("react.memo");
6
+ const REACT_FORWARD_REF_TYPE = Symbol.for("react.forward_ref");
7
+ function isReactElement(value) {
8
+ if (typeof value !== "object" || value === null) return false;
9
+ const v = value;
10
+ return v.$$typeof === REACT_ELEMENT_SYMBOL || v.$$typeof === REACT_TRANSITIONAL_ELEMENT_SYMBOL || v.$$typeof === 60103;
11
+ }
12
+ function resolveComponentInfo(type) {
13
+ let memo = false;
14
+ let forwardRef = false;
15
+ let current = type;
16
+ for (let i = 0; i < 5; i++) {
17
+ if (typeof current !== "object" || current === null) break;
18
+ const wrapper = current;
19
+ if (wrapper.$$typeof === REACT_MEMO_TYPE) {
20
+ memo = true;
21
+ current = wrapper.type;
22
+ } else if (wrapper.$$typeof === REACT_FORWARD_REF_TYPE) {
23
+ forwardRef = true;
24
+ current = wrapper.render;
25
+ } else break;
26
+ }
27
+ let name = "Unknown";
28
+ if (typeof current === "string") name = current;
29
+ else if (typeof current === "function") name = current.displayName || current.name || "Anonymous";
30
+ return {
31
+ name,
32
+ memo,
33
+ forwardRef
34
+ };
35
+ }
36
+ function serializeReactElement(el, seen, depth) {
37
+ const component = resolveComponentInfo(el.type);
38
+ const props = {};
39
+ if (el.props && typeof el.props === "object") for (const key of Object.keys(el.props)) {
40
+ if (key === "children") continue;
41
+ props[key] = serialize(el.props[key], seen, depth + 1);
42
+ }
43
+ return {
44
+ type: "react-node",
45
+ component,
46
+ props
47
+ };
48
+ }
3
49
  function serialize(value, seen, depth) {
4
50
  if (value === null) return null;
5
51
  if (value === void 0) return null;
@@ -20,6 +66,7 @@ function serialize(value, seen, depth) {
20
66
  if (seen.has(value)) return "[Circular]";
21
67
  if (depth >= MAX_DEPTH) return "[MaxDepth]";
22
68
  seen.add(value);
69
+ if (isReactElement(value)) return serializeReactElement(value, seen, depth);
23
70
  if (Array.isArray(value)) return value.map((item) => serialize(item, seen, depth + 1));
24
71
  const ctorName = Object.getPrototypeOf(value)?.constructor?.name;
25
72
  if (ctorName && ctorName !== "Object") {
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@0x1f320.sh/why-did-you-render-mcp",
3
- "version": "1.0.0-dev.5",
3
+ "version": "1.0.0-dev.6",
4
4
  "type": "module",
5
5
  "description": "MCP server that collects why-did-you-render data from browser and exposes it to coding agents",
6
6
  "license": "MIT",