@larose-ui/devtools 0.1.2 → 1.0.0
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.d.ts +3 -10
- package/dist/index.js +7 -33
- package/package.json +8 -7
package/dist/index.d.ts
CHANGED
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import * as react from 'react';
|
|
2
2
|
import { ReactNode } from 'react';
|
|
3
3
|
import { LaRoseRuntimeContext } from '@larose-ui/core';
|
|
4
|
-
import {
|
|
4
|
+
import { ComponentPerformanceSummary } from '@larose-ui/devtools-core';
|
|
5
|
+
export { ComponentPerformanceSummary, getComponentPerformance } from '@larose-ui/devtools-core';
|
|
5
6
|
|
|
6
7
|
interface DevToolsPanelProps {
|
|
7
8
|
defaultOpen?: boolean;
|
|
@@ -11,14 +12,6 @@ declare function DevToolsProvider({ children }: {
|
|
|
11
12
|
children: ReactNode;
|
|
12
13
|
}): react.JSX.Element;
|
|
13
14
|
|
|
14
|
-
interface ComponentPerformanceSummary {
|
|
15
|
-
renderCount: number;
|
|
16
|
-
lastRenderMs: number | null;
|
|
17
|
-
avgRenderMs: number | null;
|
|
18
|
-
threshold: string | null;
|
|
19
|
-
}
|
|
20
|
-
declare function getComponentPerformance(events: UIEvent[]): ComponentPerformanceSummary;
|
|
21
|
-
|
|
22
15
|
interface ReactComponentInfo {
|
|
23
16
|
displayName: string;
|
|
24
17
|
props: Record<string, string>;
|
|
@@ -43,4 +36,4 @@ declare function InspectorOverlay({ target, }: {
|
|
|
43
36
|
}): react.JSX.Element | null;
|
|
44
37
|
declare function buildInspectorReadout(element: InspectedElement, runtime: LaRoseRuntimeContext | null, performance?: ComponentPerformanceSummary | null): string[];
|
|
45
38
|
|
|
46
|
-
export {
|
|
39
|
+
export { DevToolsPanel, type DevToolsPanelProps, DevToolsProvider, type InspectedElement, InspectorOverlay, type ReactComponentInfo, buildInspectorReadout, resolveReactComponentInfo, useComponentInspector };
|
package/dist/index.js
CHANGED
|
@@ -228,39 +228,8 @@ function buildInspectorReadout(element, runtime, performance) {
|
|
|
228
228
|
return lines;
|
|
229
229
|
}
|
|
230
230
|
|
|
231
|
-
// src/componentPerformance.ts
|
|
232
|
-
function getComponentPerformance(events) {
|
|
233
|
-
const perfEvents = events.filter((event) => event.type === "performance");
|
|
234
|
-
if (perfEvents.length === 0) {
|
|
235
|
-
return {
|
|
236
|
-
renderCount: 0,
|
|
237
|
-
lastRenderMs: null,
|
|
238
|
-
avgRenderMs: null,
|
|
239
|
-
threshold: null
|
|
240
|
-
};
|
|
241
|
-
}
|
|
242
|
-
const renderTimes = perfEvents.map((event) => event.metadata?.renderTimeMs).filter((value) => typeof value === "number");
|
|
243
|
-
const last = perfEvents.at(-1);
|
|
244
|
-
if (!last) {
|
|
245
|
-
return {
|
|
246
|
-
renderCount: 0,
|
|
247
|
-
lastRenderMs: null,
|
|
248
|
-
avgRenderMs: null,
|
|
249
|
-
threshold: null
|
|
250
|
-
};
|
|
251
|
-
}
|
|
252
|
-
const lastRenderMs = typeof last.metadata?.renderTimeMs === "number" ? last.metadata.renderTimeMs : null;
|
|
253
|
-
const threshold = typeof last.metadata?.threshold === "string" ? last.metadata.threshold : null;
|
|
254
|
-
const avgRenderMs = renderTimes.length > 0 ? renderTimes.reduce((sum, ms) => sum + ms, 0) / renderTimes.length : null;
|
|
255
|
-
return {
|
|
256
|
-
renderCount: perfEvents.length,
|
|
257
|
-
lastRenderMs,
|
|
258
|
-
avgRenderMs,
|
|
259
|
-
threshold
|
|
260
|
-
};
|
|
261
|
-
}
|
|
262
|
-
|
|
263
231
|
// src/DevToolsPanel.tsx
|
|
232
|
+
import { getComponentPerformance } from "@larose-ui/devtools-core";
|
|
264
233
|
import { Fragment, jsx as jsx2, jsxs } from "react/jsx-runtime";
|
|
265
234
|
function DevToolsPanel({ defaultOpen = false }) {
|
|
266
235
|
const [open, setOpen] = useState2(defaultOpen);
|
|
@@ -559,12 +528,17 @@ function DevToolsProvider({ children }) {
|
|
|
559
528
|
/* @__PURE__ */ jsx2(DevToolsPanel, {})
|
|
560
529
|
] });
|
|
561
530
|
}
|
|
531
|
+
|
|
532
|
+
// src/index.ts
|
|
533
|
+
import {
|
|
534
|
+
getComponentPerformance as getComponentPerformance2
|
|
535
|
+
} from "@larose-ui/devtools-core";
|
|
562
536
|
export {
|
|
563
537
|
DevToolsPanel,
|
|
564
538
|
DevToolsProvider,
|
|
565
539
|
InspectorOverlay,
|
|
566
540
|
buildInspectorReadout,
|
|
567
|
-
getComponentPerformance,
|
|
541
|
+
getComponentPerformance2 as getComponentPerformance,
|
|
568
542
|
resolveReactComponentInfo,
|
|
569
543
|
useComponentInspector
|
|
570
544
|
};
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@larose-ui/devtools",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "1.0.0",
|
|
4
4
|
"description": "In-app DevTools inspector for laRose UI platform",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -17,13 +17,14 @@
|
|
|
17
17
|
"README.md"
|
|
18
18
|
],
|
|
19
19
|
"dependencies": {
|
|
20
|
-
"@larose-ui/core": "0.
|
|
21
|
-
"@larose-ui/
|
|
22
|
-
"@larose-ui/
|
|
20
|
+
"@larose-ui/core": "0.2.0",
|
|
21
|
+
"@larose-ui/devtools-core": "0.2.0",
|
|
22
|
+
"@larose-ui/observability": "0.2.0",
|
|
23
|
+
"@larose-ui/runtime": "1.0.0"
|
|
23
24
|
},
|
|
24
25
|
"peerDependencies": {
|
|
25
26
|
"react": ">=18",
|
|
26
|
-
"@larose-ui/permissions": "0.
|
|
27
|
+
"@larose-ui/permissions": "0.2.0"
|
|
27
28
|
},
|
|
28
29
|
"devDependencies": {
|
|
29
30
|
"@testing-library/jest-dom": "^6.6.3",
|
|
@@ -36,8 +37,8 @@
|
|
|
36
37
|
"tsup": "^8.3.5",
|
|
37
38
|
"typescript": "^5.7.2",
|
|
38
39
|
"vitest": "^2.1.8",
|
|
39
|
-
"@larose-ui/permissions": "0.
|
|
40
|
-
"@larose-ui/testing": "0.
|
|
40
|
+
"@larose-ui/permissions": "0.2.0",
|
|
41
|
+
"@larose-ui/testing": "0.2.0"
|
|
41
42
|
},
|
|
42
43
|
"license": "MIT",
|
|
43
44
|
"publishConfig": {
|