@coherent.js/devtools 1.0.0-beta.5 → 1.0.0-beta.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.
- package/dist/index.js +18 -52
- package/dist/index.js.map +4 -4
- package/package.json +2 -2
- package/types/index.d.ts +389 -27
package/dist/index.js
CHANGED
|
@@ -2074,47 +2074,12 @@ function createDevTools(coherentInstance) {
|
|
|
2074
2074
|
return new DevTools(coherentInstance);
|
|
2075
2075
|
}
|
|
2076
2076
|
|
|
2077
|
-
// ../core/src/core/object-utils.js
|
|
2078
|
-
function isCoherentObject2(obj) {
|
|
2079
|
-
if (!obj || typeof obj !== "object" || Array.isArray(obj)) {
|
|
2080
|
-
return false;
|
|
2081
|
-
}
|
|
2082
|
-
const keys = Object.keys(obj);
|
|
2083
|
-
if (keys.length === 0) {
|
|
2084
|
-
return false;
|
|
2085
|
-
}
|
|
2086
|
-
return keys.every((key) => {
|
|
2087
|
-
if (key === "text") return true;
|
|
2088
|
-
return /^[a-zA-Z][a-zA-Z0-9-]*$/.test(key);
|
|
2089
|
-
});
|
|
2090
|
-
}
|
|
2091
|
-
function hasChildren(component) {
|
|
2092
|
-
if (Array.isArray(component)) {
|
|
2093
|
-
return component.length > 0;
|
|
2094
|
-
}
|
|
2095
|
-
if (isCoherentObject2(component)) {
|
|
2096
|
-
if (component.children !== void 0 && component.children !== null) {
|
|
2097
|
-
return Array.isArray(component.children) ? component.children.length > 0 : true;
|
|
2098
|
-
}
|
|
2099
|
-
const keys = Object.keys(component);
|
|
2100
|
-
return keys.some((key) => {
|
|
2101
|
-
const value = component[key];
|
|
2102
|
-
return value && typeof value === "object" && value.children;
|
|
2103
|
-
});
|
|
2104
|
-
}
|
|
2105
|
-
return false;
|
|
2106
|
-
}
|
|
2107
|
-
function normalizeChildren(children) {
|
|
2108
|
-
if (children === null || children === void 0) {
|
|
2109
|
-
return [];
|
|
2110
|
-
}
|
|
2111
|
-
if (Array.isArray(children)) {
|
|
2112
|
-
return children.flat().filter((child) => child !== null && child !== void 0);
|
|
2113
|
-
}
|
|
2114
|
-
return [children];
|
|
2115
|
-
}
|
|
2116
|
-
|
|
2117
2077
|
// src/component-visualizer.js
|
|
2078
|
+
import {
|
|
2079
|
+
isCoherentObject as isCoherentObject2,
|
|
2080
|
+
hasChildren,
|
|
2081
|
+
normalizeChildren
|
|
2082
|
+
} from "@coherent.js/core";
|
|
2118
2083
|
var ComponentVisualizer = class {
|
|
2119
2084
|
constructor(options = {}) {
|
|
2120
2085
|
this.options = {
|
|
@@ -2883,6 +2848,7 @@ function showPerformanceDashboard(dashboard) {
|
|
|
2883
2848
|
}
|
|
2884
2849
|
|
|
2885
2850
|
// src/enhanced-errors.js
|
|
2851
|
+
import { isCoherentObject as isCoherentObject3, hasChildren as hasChildren2 } from "@coherent.js/core";
|
|
2886
2852
|
var EnhancedErrorHandler = class {
|
|
2887
2853
|
constructor(options = {}) {
|
|
2888
2854
|
this.options = {
|
|
@@ -2934,13 +2900,13 @@ var EnhancedErrorHandler = class {
|
|
|
2934
2900
|
hasDynamicContent: this.hasDynamicContent(component),
|
|
2935
2901
|
estimatedSize: this.estimateSize(component)
|
|
2936
2902
|
};
|
|
2937
|
-
if (
|
|
2903
|
+
if (isCoherentObject3(component)) {
|
|
2938
2904
|
const entries = Object.entries(component);
|
|
2939
2905
|
if (entries.length === 1) {
|
|
2940
2906
|
const [_tagName, props] = entries;
|
|
2941
2907
|
analysis.tagName = _tagName;
|
|
2942
2908
|
analysis.propCount = Object.keys(props).length;
|
|
2943
|
-
analysis.hasChildren =
|
|
2909
|
+
analysis.hasChildren = hasChildren2(props);
|
|
2944
2910
|
analysis.eventHandlers = this.extractEventHandlers(props);
|
|
2945
2911
|
}
|
|
2946
2912
|
}
|
|
@@ -2956,11 +2922,11 @@ var EnhancedErrorHandler = class {
|
|
|
2956
2922
|
component: this.summarizeComponent(component),
|
|
2957
2923
|
children: []
|
|
2958
2924
|
};
|
|
2959
|
-
if (
|
|
2925
|
+
if (isCoherentObject3(component) && context.depth < this.options.maxContextDepth) {
|
|
2960
2926
|
const entries = Object.entries(component);
|
|
2961
2927
|
if (entries.length === 1) {
|
|
2962
2928
|
const [tagName, props] = entries;
|
|
2963
|
-
if (
|
|
2929
|
+
if (hasChildren2(props)) {
|
|
2964
2930
|
const children = Array.isArray(props.children) ? props.children : [props.children];
|
|
2965
2931
|
children.forEach((child, index) => {
|
|
2966
2932
|
if (child && typeof child === "object") {
|
|
@@ -2977,7 +2943,7 @@ var EnhancedErrorHandler = class {
|
|
|
2977
2943
|
* Validate component props
|
|
2978
2944
|
*/
|
|
2979
2945
|
validateProps(component) {
|
|
2980
|
-
if (!
|
|
2946
|
+
if (!isCoherentObject3(component)) return { valid: true, issues: [] };
|
|
2981
2947
|
const entries = Object.entries(component);
|
|
2982
2948
|
if (entries.length !== 1) return { valid: false, issues: ["Component must have exactly one root element"] };
|
|
2983
2949
|
const [tagName, props] = entries;
|
|
@@ -3135,7 +3101,7 @@ var EnhancedErrorHandler = class {
|
|
|
3135
3101
|
if (typeof component === "boolean") return "boolean";
|
|
3136
3102
|
if (typeof component === "function") return "function";
|
|
3137
3103
|
if (Array.isArray(component)) return "array";
|
|
3138
|
-
if (
|
|
3104
|
+
if (isCoherentObject3(component)) return "element";
|
|
3139
3105
|
return "object";
|
|
3140
3106
|
}
|
|
3141
3107
|
/**
|
|
@@ -3147,7 +3113,7 @@ var EnhancedErrorHandler = class {
|
|
|
3147
3113
|
if (typeof component === "string" || typeof component === "number") return true;
|
|
3148
3114
|
if (typeof component === "function") return true;
|
|
3149
3115
|
if (Array.isArray(component)) return component.every((child) => this.isValidComponent(child));
|
|
3150
|
-
if (
|
|
3116
|
+
if (isCoherentObject3(component)) {
|
|
3151
3117
|
const entries = Object.entries(component);
|
|
3152
3118
|
return entries.length === 1;
|
|
3153
3119
|
}
|
|
@@ -3162,12 +3128,12 @@ var EnhancedErrorHandler = class {
|
|
|
3162
3128
|
assessComplexity(component) {
|
|
3163
3129
|
let complexity = 0;
|
|
3164
3130
|
if (typeof component === "object" && component !== null) {
|
|
3165
|
-
if (
|
|
3131
|
+
if (isCoherentObject3(component)) {
|
|
3166
3132
|
const entries = Object.entries(component);
|
|
3167
3133
|
if (entries.length === 1) {
|
|
3168
3134
|
const [_tagName, props] = entries;
|
|
3169
3135
|
complexity += Object.keys(props).length;
|
|
3170
|
-
if (
|
|
3136
|
+
if (hasChildren2(props)) {
|
|
3171
3137
|
const children = Array.isArray(props.children) ? props.children : [props.children];
|
|
3172
3138
|
children.forEach((child) => {
|
|
3173
3139
|
complexity += this.assessComplexity(child);
|
|
@@ -3208,13 +3174,13 @@ var EnhancedErrorHandler = class {
|
|
|
3208
3174
|
*/
|
|
3209
3175
|
summarizeComponent(component) {
|
|
3210
3176
|
const type = this.getComponentType(component);
|
|
3211
|
-
if (type === "element" &&
|
|
3177
|
+
if (type === "element" && isCoherentObject3(component)) {
|
|
3212
3178
|
const entries = Object.entries(component);
|
|
3213
3179
|
if (entries.length === 1) {
|
|
3214
3180
|
const [tagName, props] = entries;
|
|
3215
3181
|
const propCount = Object.keys(props).length;
|
|
3216
|
-
const
|
|
3217
|
-
return `<${tagName}> (${propCount} props, ${
|
|
3182
|
+
const hasChildren3 = hasChildren3(props);
|
|
3183
|
+
return `<${tagName}> (${propCount} props, ${hasChildren3 ? "has" : "no"} children)`;
|
|
3218
3184
|
}
|
|
3219
3185
|
}
|
|
3220
3186
|
if (type === "text") {
|