@lark-apaas/miaoda-inspector 1.0.0 → 1.0.2

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.
@@ -36,7 +36,8 @@ const getCodeInfoFromProps = (fiber) => {
36
36
  "data-miaoda-column": columnNumber,
37
37
  "data-miaoda-relative-path": relativePath,
38
38
  "data-miaoda-component-name": name,
39
- "data-miaoda-metadata": metadataStr
39
+ "data-miaoda-metadata": metadataStr,
40
+ "data-ai-section-type": sectionType
40
41
  } = fiber.pendingProps;
41
42
  let metadata;
42
43
  if (metadataStr) {
@@ -52,7 +53,8 @@ const getCodeInfoFromProps = (fiber) => {
52
53
  lineNumber,
53
54
  columnNumber,
54
55
  relativePath,
55
- metadata
56
+ metadata,
57
+ sectionType: sectionType != null ? sectionType : ""
56
58
  };
57
59
  }
58
60
  return void 0;
@@ -318,12 +318,16 @@ function MiaodaInspector(props) {
318
318
  },
319
319
  [props.cwd]
320
320
  );
321
+ const updateIntervalRef = useRef(500);
321
322
  const handleMessage = useCallback(
322
323
  (event) => {
323
- var _a, _b;
324
+ var _a, _b, _c;
324
325
  const { data } = event;
325
326
  if (isIncomingMessage(data, "InitConfig")) {
326
- const { inspectorActive, userToken, appId, inspectorVersion } = data.data;
327
+ const { inspectorActive, userToken, appId, inspectorVersion, updateInterval } = data.data;
328
+ if (updateInterval !== void 0) {
329
+ updateIntervalRef.current = updateInterval;
330
+ }
327
331
  if (inspectorActive !== void 0) {
328
332
  setActive(inspectorActive);
329
333
  if (inspectorActive === false) {
@@ -364,6 +368,13 @@ function MiaodaInspector(props) {
364
368
  }
365
369
  selectedElementMap.clear();
366
370
  }
371
+ } else if (isIncomingMessage(data, "ClearModification")) {
372
+ const { elementId } = data.data;
373
+ const selectedElement = selectedElementMap.get(elementId);
374
+ if (selectedElement && selectedElement.element) {
375
+ selectedElementMap.delete(elementId);
376
+ (_c = selectedElement.dispose) == null ? void 0 : _c.call(selectedElement);
377
+ }
367
378
  } else if (isIncomingMessage(data, "EditText")) {
368
379
  const { elementId, textContent } = data.data;
369
380
  const selectedElement = selectedElementMap.get(elementId);
@@ -560,7 +571,7 @@ function MiaodaInspector(props) {
560
571
  postMessage({
561
572
  type: "PageMounted",
562
573
  data: {
563
- version: "1.0.0",
574
+ version: "1.0.2",
564
575
  feature: {
565
576
  selectParent: true,
566
577
  reverseSelect: true
@@ -568,6 +579,29 @@ function MiaodaInspector(props) {
568
579
  }
569
580
  });
570
581
  }, []);
582
+ useEffect(() => {
583
+ const intervalId = null;
584
+ const updateOnce = () => {
585
+ const coordinatesMap = {};
586
+ for (const [, selectedElement] of selectedElementMap) {
587
+ if (selectedElement.element) {
588
+ const coordinate = getElementCoordinates(selectedElement.element);
589
+ coordinatesMap[selectedElement.elementId] = coordinate;
590
+ }
591
+ }
592
+ postMessage({
593
+ type: "CoordinateUpdate",
594
+ data: coordinatesMap
595
+ });
596
+ setTimeout(updateOnce, updateIntervalRef.current);
597
+ };
598
+ updateOnce();
599
+ return () => {
600
+ if (intervalId) {
601
+ clearTimeout(intervalId);
602
+ }
603
+ };
604
+ }, []);
571
605
  return /* @__PURE__ */ jsx(
572
606
  Inspector,
573
607
  {
@@ -69,7 +69,8 @@ const getCodeInfoFromProps = (fiber) => {
69
69
  "data-miaoda-column": columnNumber,
70
70
  "data-miaoda-relative-path": relativePath,
71
71
  "data-miaoda-component-name": name,
72
- "data-miaoda-metadata": metadataStr
72
+ "data-miaoda-metadata": metadataStr,
73
+ "data-ai-section-type": sectionType
73
74
  } = fiber.pendingProps;
74
75
  let metadata;
75
76
  if (metadataStr) {
@@ -85,7 +86,8 @@ const getCodeInfoFromProps = (fiber) => {
85
86
  lineNumber,
86
87
  columnNumber,
87
88
  relativePath,
88
- metadata
89
+ metadata,
90
+ sectionType: sectionType != null ? sectionType : ""
89
91
  };
90
92
  }
91
93
  return void 0;
@@ -335,12 +335,16 @@ function MiaodaInspector(props) {
335
335
  },
336
336
  [props.cwd]
337
337
  );
338
+ const updateIntervalRef = (0, import_react.useRef)(500);
338
339
  const handleMessage = (0, import_react.useCallback)(
339
340
  (event) => {
340
- var _a, _b;
341
+ var _a, _b, _c;
341
342
  const { data } = event;
342
343
  if ((0, import_utils2.isIncomingMessage)(data, "InitConfig")) {
343
- const { inspectorActive, userToken, appId, inspectorVersion } = data.data;
344
+ const { inspectorActive, userToken, appId, inspectorVersion, updateInterval } = data.data;
345
+ if (updateInterval !== void 0) {
346
+ updateIntervalRef.current = updateInterval;
347
+ }
344
348
  if (inspectorActive !== void 0) {
345
349
  setActive(inspectorActive);
346
350
  if (inspectorActive === false) {
@@ -381,6 +385,13 @@ function MiaodaInspector(props) {
381
385
  }
382
386
  selectedElementMap.clear();
383
387
  }
388
+ } else if ((0, import_utils2.isIncomingMessage)(data, "ClearModification")) {
389
+ const { elementId } = data.data;
390
+ const selectedElement = selectedElementMap.get(elementId);
391
+ if (selectedElement && selectedElement.element) {
392
+ selectedElementMap.delete(elementId);
393
+ (_c = selectedElement.dispose) == null ? void 0 : _c.call(selectedElement);
394
+ }
384
395
  } else if ((0, import_utils2.isIncomingMessage)(data, "EditText")) {
385
396
  const { elementId, textContent } = data.data;
386
397
  const selectedElement = selectedElementMap.get(elementId);
@@ -577,7 +588,7 @@ function MiaodaInspector(props) {
577
588
  (0, import_utils2.postMessage)({
578
589
  type: "PageMounted",
579
590
  data: {
580
- version: "1.0.0",
591
+ version: "1.0.2",
581
592
  feature: {
582
593
  selectParent: true,
583
594
  reverseSelect: true
@@ -585,6 +596,29 @@ function MiaodaInspector(props) {
585
596
  }
586
597
  });
587
598
  }, []);
599
+ (0, import_react.useEffect)(() => {
600
+ const intervalId = null;
601
+ const updateOnce = () => {
602
+ const coordinatesMap = {};
603
+ for (const [, selectedElement] of selectedElementMap) {
604
+ if (selectedElement.element) {
605
+ const coordinate = getElementCoordinates(selectedElement.element);
606
+ coordinatesMap[selectedElement.elementId] = coordinate;
607
+ }
608
+ }
609
+ (0, import_utils2.postMessage)({
610
+ type: "CoordinateUpdate",
611
+ data: coordinatesMap
612
+ });
613
+ setTimeout(updateOnce, updateIntervalRef.current);
614
+ };
615
+ updateOnce();
616
+ return () => {
617
+ if (intervalId) {
618
+ clearTimeout(intervalId);
619
+ }
620
+ };
621
+ }, []);
588
622
  return /* @__PURE__ */ (0, import_jsx_runtime.jsx)(
589
623
  import_Inspector.Inspector,
590
624
  {
@@ -4,6 +4,7 @@ interface CodeInfo {
4
4
  name?: string;
5
5
  lineNumber: string;
6
6
  columnNumber: string;
7
+ sectionType?: string;
7
8
  /**
8
9
  * code source file relative path to dev-server cwd(current working directory)
9
10
  * need use with `react-dev-inspector/plugins/babel`
@@ -37,6 +38,7 @@ interface CodeDataAttribute {
37
38
  'data-miaoda-relative-path': string;
38
39
  'data-miaoda-component-name'?: string;
39
40
  'data-miaoda-metadata'?: string;
41
+ 'data-ai-section-type'?: string;
40
42
  }
41
43
  /**
42
44
  * react fiber property `_debugSource` created by `@babel/plugin-transform-react-jsx-source`
@@ -43,12 +43,13 @@ interface EditAttributesMessage extends IframeMessage<{
43
43
  }> {
44
44
  type: 'EditAttributes';
45
45
  }
46
- type IncomingMessage = InitConfigMessage | ClearSelectedMessage | EditTextMessage | EditStyleMessage | EditClassNameMessage | EditPropsMessage | EditIconPropsMessage | ReverseSelectMessage | SelectParentMessage | EditAttributesMessage;
46
+ type IncomingMessage = InitConfigMessage | ClearSelectedMessage | ClearModificationMessage | EditTextMessage | EditStyleMessage | EditClassNameMessage | EditPropsMessage | EditIconPropsMessage | ReverseSelectMessage | SelectParentMessage | EditAttributesMessage;
47
47
  interface InitConfigMessage extends IframeMessage<{
48
48
  inspectorActive?: boolean;
49
49
  userToken?: string;
50
50
  appId?: string;
51
51
  inspectorVersion?: string;
52
+ updateInterval?: number;
52
53
  }> {
53
54
  type: 'InitConfig';
54
55
  }
@@ -57,6 +58,11 @@ interface ClearSelectedMessage extends IframeMessage<{
57
58
  }> {
58
59
  type: 'ClearSelected';
59
60
  }
61
+ interface ClearModificationMessage extends IframeMessage<{
62
+ elementId: string;
63
+ }> {
64
+ type: 'ClearModification';
65
+ }
60
66
  interface EditTextMessage extends IframeMessage<{
61
67
  elementId: string;
62
68
  textContent: string;
@@ -190,11 +196,21 @@ interface SelectInspectorElementMessage extends IframeMessage<InspectorInfo> {
190
196
  interface InspectorUIConfigMessage extends IframeMessage<InspectorUIConfig> {
191
197
  type: 'InspectorUIConfig';
192
198
  }
193
- type OutgoingMessage = PageMountedMessage | TextUpdateMessage | PageScrollMessage | ElementResizeMessage | SelectInspectorElementMessage | InspectorUIConfigMessage;
199
+ interface CoordinateUpdateMessage extends IframeMessage<Record<string, {
200
+ width: number;
201
+ height: number;
202
+ top: number;
203
+ left: number;
204
+ right: number;
205
+ bottom: number;
206
+ }>> {
207
+ type: 'CoordinateUpdate';
208
+ }
209
+ type OutgoingMessage = PageMountedMessage | TextUpdateMessage | PageScrollMessage | ElementResizeMessage | SelectInspectorElementMessage | InspectorUIConfigMessage | CoordinateUpdateMessage;
194
210
  declare global {
195
211
  interface WindowEventMap {
196
212
  message: MessageEvent<IframeMessage>;
197
213
  }
198
214
  }
199
215
 
200
- export type { ClearSelectedMessage, EditAttributesMessage, EditClassNameMessage, EditIconPropsMessage, EditPropsMessage, EditStyleMessage, EditTextMessage, ElementResizeMessage, IframeMessage, IncomingMessage, InitConfigMessage, InspectorInfo, InspectorUIConfigMessage, OutgoingMessage, PageMountedMessage, PageScrollMessage, ReverseSelectMessage, SelectInspectorElementMessage, SelectParentMessage, TextUpdateMessage };
216
+ export type { ClearModificationMessage, ClearSelectedMessage, CoordinateUpdateMessage, EditAttributesMessage, EditClassNameMessage, EditIconPropsMessage, EditPropsMessage, EditStyleMessage, EditTextMessage, ElementResizeMessage, IframeMessage, IncomingMessage, InitConfigMessage, InspectorInfo, InspectorUIConfigMessage, OutgoingMessage, PageMountedMessage, PageScrollMessage, ReverseSelectMessage, SelectInspectorElementMessage, SelectParentMessage, TextUpdateMessage };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@lark-apaas/miaoda-inspector",
3
- "version": "1.0.0",
3
+ "version": "1.0.2",
4
4
  "description": "Inspector for Lark Apaas",
5
5
  "sideEffects": [
6
6
  "*.css"