@teambit/react.ui.component-highlighter 0.2.3 → 0.2.4

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 (7) hide show
  1. package/package.json +9 -9
  2. package/schema.json +88 -42
  3. package/static/css/teambit.react/ui/component-highlighter.15a16662.css +1 -0
  4. package/teambit_react_ui_component_highlighter-component.js +11 -5
  5. package/teambit_react_ui_component_highlighter-preview.js +2 -2
  6. package/dist/tsconfig.json +0 -36
  7. package/static/css/teambit.react/ui/component-highlighter.91ca7826.css +0 -1
package/package.json CHANGED
@@ -1,37 +1,37 @@
1
1
  {
2
2
  "name": "@teambit/react.ui.component-highlighter",
3
- "version": "0.2.3",
3
+ "version": "0.2.4",
4
4
  "homepage": "https://bit.cloud/teambit/react/ui/component-highlighter",
5
5
  "main": "dist/index.js",
6
6
  "componentId": {
7
7
  "scope": "teambit.react",
8
8
  "name": "ui/component-highlighter",
9
- "version": "0.2.3"
9
+ "version": "0.2.4"
10
10
  },
11
11
  "dependencies": {
12
12
  "get-xpath": "^3.0.1",
13
13
  "classnames": "^2.3.1",
14
14
  "@floating-ui/react-dom": "0.7.2",
15
+ "uuid": "^10.0.0",
16
+ "use-debounce": "^8.0.1",
15
17
  "lodash.compact": "^3.0.1",
16
18
  "url-join": "^4.0.1",
17
19
  "@tippyjs/react": "4.2.0",
18
- "uuid": "^10.0.0",
19
- "use-debounce": "^8.0.1",
20
20
  "core-js": "^3.0.0",
21
21
  "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.21",
22
- "@teambit/component-id": "0.0.402",
22
+ "@teambit/component-id": "1.2.2",
23
23
  "@teambit/react.modules.dom-to-react": "0.2.0",
24
+ "@teambit/react.ui.hover-selector": "0.2.0",
24
25
  "@teambit/base-ui.routing.native-link": "1.0.0",
25
- "@teambit/component.modules.component-url": "0.0.124",
26
- "@teambit/react.ui.hover-selector": "0.2.0"
26
+ "@teambit/component.modules.component-url": "0.0.169"
27
27
  },
28
28
  "devDependencies": {
29
29
  "@types/react": "^17.0.8",
30
30
  "@testing-library/react": "^12.1.5",
31
- "@types/lodash.compact": "3.0.6",
32
- "@types/url-join": "^4.0.0",
33
31
  "@types/uuid": "3.4.9",
34
32
  "@types/react-dom": "^17.0.5",
33
+ "@types/lodash.compact": "3.0.6",
34
+ "@types/url-join": "^4.0.0",
35
35
  "@types/mocha": "9.1.0",
36
36
  "@types/node": "12.20.4",
37
37
  "@types/jest": "^26.0.0",
package/schema.json CHANGED
@@ -20,6 +20,7 @@
20
20
  "line": 1,
21
21
  "character": 31
22
22
  },
23
+ "signature": "function HybridHighlighter({ disabled, mode, debounceSelection, watchMotion, placement, rule, componentRule, classes, highlightStyle, className, style, bgColor, bgColorHover, bgColorActive, children, ...rest }: HybridHighlighterProps): React.JSX.Element",
23
24
  "name": "HybridHighlighter",
24
25
  "exportNode": {
25
26
  "__schema": "ReactSchema",
@@ -36,7 +37,8 @@
36
37
  "character": 1
37
38
  },
38
39
  "raw": "/** automatically highlight components on hover */",
39
- "comment": "automatically highlight components on hover"
40
+ "comment": "automatically highlight components on hover",
41
+ "tags": []
40
42
  },
41
43
  "signature": "function HybridHighlighter({ disabled, mode, debounceSelection, watchMotion, placement, rule, componentRule, classes, highlightStyle, className, style, bgColor, bgColorHover, bgColorActive, children, ...rest }: HybridHighlighterProps): React.JSX.Element",
42
44
  "name": "HybridHighlighter",
@@ -235,7 +237,7 @@
235
237
  "character": 6
236
238
  },
237
239
  "name": "rest",
238
- "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoFocus?: boolean;\n ... 249 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
240
+ "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoCapitalize?: \"off\" | ... 5 more ... | (string & {});\n ... 250 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
239
241
  "isSpread": true
240
242
  }
241
243
  ],
@@ -264,6 +266,7 @@
264
266
  "line": 2,
265
267
  "character": 41
266
268
  },
269
+ "signature": "interface HybridHighlighterProps",
267
270
  "name": "HybridHighlighterProps",
268
271
  "exportNode": {
269
272
  "__schema": "InterfaceSchema",
@@ -290,7 +293,8 @@
290
293
  "character": 3
291
294
  },
292
295
  "raw": "/** stop all highlighting and drop listeners */",
293
- "comment": "stop all highlighting and drop listeners"
296
+ "comment": "stop all highlighting and drop listeners",
297
+ "tags": []
294
298
  },
295
299
  "signature": "(property) HybridHighlighterProps.disabled?: boolean",
296
300
  "name": "disabled",
@@ -320,7 +324,8 @@
320
324
  "character": 3
321
325
  },
322
326
  "raw": "/** default pop location for the label */",
323
- "comment": "default pop location for the label"
327
+ "comment": "default pop location for the label",
328
+ "tags": []
324
329
  },
325
330
  "signature": "(property) HybridHighlighterProps.placement?: Placement",
326
331
  "name": "placement",
@@ -350,7 +355,8 @@
350
355
  "character": 3
351
356
  },
352
357
  "raw": "/** customize styles */",
353
- "comment": "customize styles"
358
+ "comment": "customize styles",
359
+ "tags": []
354
360
  },
355
361
  "signature": "(property) HybridHighlighterProps.classes?: HighlightClasses",
356
362
  "name": "classes",
@@ -380,7 +386,8 @@
380
386
  "character": 3
381
387
  },
382
388
  "raw": "/** customize highlighter */",
383
- "comment": "customize highlighter"
389
+ "comment": "customize highlighter",
390
+ "tags": []
384
391
  },
385
392
  "signature": "(property) HybridHighlighterProps.highlightStyle?: React.CSSProperties",
386
393
  "name": "highlightStyle",
@@ -453,7 +460,8 @@
453
460
  "character": 3
454
461
  },
455
462
  "raw": "/** continually update frame position to match moving elements */",
456
- "comment": "continually update frame position to match moving elements"
463
+ "comment": "continually update frame position to match moving elements",
464
+ "tags": []
457
465
  },
458
466
  "signature": "(property) HybridHighlighterProps.watchMotion?: boolean",
459
467
  "name": "watchMotion",
@@ -483,7 +491,8 @@
483
491
  "character": 3
484
492
  },
485
493
  "raw": "/** filter highlighter targets by this query selector. (May be a more complex object in the future) */",
486
- "comment": "filter highlighter targets by this query selector. (May be a more complex object in the future)"
494
+ "comment": "filter highlighter targets by this query selector. (May be a more complex object in the future)",
495
+ "tags": []
487
496
  },
488
497
  "signature": "(property) HybridHighlighterProps.rule?: MatchRule",
489
498
  "name": "rule",
@@ -513,7 +522,8 @@
513
522
  "character": 3
514
523
  },
515
524
  "raw": "/** filter components to match this rule. Can be id, array of ids, or a function */",
516
- "comment": "filter components to match this rule. Can be id, array of ids, or a function"
525
+ "comment": "filter components to match this rule. Can be id, array of ids, or a function",
526
+ "tags": []
517
527
  },
518
528
  "signature": "(property) HybridHighlighterProps.componentRule?: ComponentMatchRule",
519
529
  "name": "componentRule",
@@ -544,7 +554,8 @@
544
554
  "character": 3
545
555
  },
546
556
  "raw": "/** set the behavior of the highlighter.\n * `disabled` - stops highlighting.\n * `allChildren` - highlights all components rendered under children\n * `hover` - highlighters the component immediately under the mouse cursor\n * */",
547
- "comment": "set the behavior of the highlighter.\n`disabled` - stops highlighting.\n`allChildren` - highlights all components rendered under children\n`hover` - highlighters the component immediately under the mouse cursor"
557
+ "comment": "set the behavior of the highlighter.\n`disabled` - stops highlighting.\n`allChildren` - highlights all components rendered under children\n`hover` - highlighters the component immediately under the mouse cursor",
558
+ "tags": []
548
559
  },
549
560
  "signature": "(property) HybridHighlighterProps.mode?: \"allChildren\" | \"hover\"",
550
561
  "name": "mode",
@@ -667,7 +678,7 @@
667
678
  "character": 49
668
679
  },
669
680
  "name": "React",
670
- "packageName": "/tmp/capsules-root/sign-capsules/2024-6-16/u7dgdz/teambit.react_ui_component-highlighter@dcd2eb88a350a7c145e00700f7601cd352c13546/hybrid-highlighter/hybrid-highlighter.tsx"
681
+ "packageName": "/tmp/capsules-root/sign-capsules/2024-9-1/hh2z70/teambit.react_ui_component-highlighter@2ee94e9870d0dd40e401e7d7450ae6949364b1c7/hybrid-highlighter/hybrid-highlighter.tsx"
671
682
  }
672
683
  }
673
684
  ]
@@ -681,6 +692,7 @@
681
692
  "line": 4,
682
693
  "character": 10
683
694
  },
695
+ "signature": "function HoverHighlighter({ ...props }: HoverHighlighterProps): React.JSX.Element",
684
696
  "name": "HoverHighlighter",
685
697
  "exportNode": {
686
698
  "__schema": "ReactSchema",
@@ -718,7 +730,7 @@
718
730
  "character": 39
719
731
  },
720
732
  "name": "props",
721
- "type": "{\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 263 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
733
+ "type": "{\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 264 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
722
734
  "isSpread": true
723
735
  }
724
736
  ],
@@ -746,6 +758,7 @@
746
758
  "line": 5,
747
759
  "character": 15
748
760
  },
761
+ "signature": "type HoverHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 264 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
749
762
  "name": "HoverHighlighterProps",
750
763
  "exportNode": {
751
764
  "__schema": "TypeSchema",
@@ -754,7 +767,7 @@
754
767
  "line": 4,
755
768
  "character": 1
756
769
  },
757
- "signature": "type HoverHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 263 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
770
+ "signature": "type HoverHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 264 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
758
771
  "name": "HoverHighlighterProps",
759
772
  "type": {
760
773
  "__schema": "TypeRefSchema",
@@ -794,6 +807,7 @@
794
807
  "line": 7,
795
808
  "character": 10
796
809
  },
810
+ "signature": "function ChildrenHighlighter({ watchMotion, ...props }: ChildrenHighlighterProps): React.JSX.Element",
797
811
  "name": "ChildrenHighlighter",
798
812
  "exportNode": {
799
813
  "__schema": "ReactSchema",
@@ -843,7 +857,7 @@
843
857
  "character": 63
844
858
  },
845
859
  "name": "props",
846
- "type": "{\n disabled?: boolean;\n debounceSelection?: number;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n classes?: HighlightClasses;\n ... 262 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
860
+ "type": "{\n disabled?: boolean;\n debounceSelection?: number;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n classes?: HighlightClasses;\n ... 263 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
847
861
  "isSpread": true
848
862
  }
849
863
  ],
@@ -871,6 +885,7 @@
871
885
  "line": 8,
872
886
  "character": 15
873
887
  },
888
+ "signature": "type ChildrenHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 264 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
874
889
  "name": "ChildrenHighlighterProps",
875
890
  "exportNode": {
876
891
  "__schema": "TypeSchema",
@@ -879,7 +894,7 @@
879
894
  "line": 5,
880
895
  "character": 1
881
896
  },
882
- "signature": "type ChildrenHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 263 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
897
+ "signature": "type ChildrenHighlighterProps = {\n disabled?: boolean;\n debounceSelection?: number;\n watchMotion?: boolean;\n placement?: Placement;\n rule?: MatchRule;\n componentRule?: ComponentMatchRule;\n ... 264 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
883
898
  "name": "ChildrenHighlighterProps",
884
899
  "type": {
885
900
  "__schema": "TypeRefSchema",
@@ -919,6 +934,7 @@
919
934
  "line": 10,
920
935
  "character": 10
921
936
  },
937
+ "signature": "function ElementHighlighter({ targetRef, components, placement, watchMotion, className, classes, ...props }: ElementHighlighterProps): React.JSX.Element",
922
938
  "name": "ElementHighlighter",
923
939
  "exportNode": {
924
940
  "__schema": "ReactSchema",
@@ -1023,7 +1039,7 @@
1023
1039
  "character": 6
1024
1040
  },
1025
1041
  "name": "props",
1026
- "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoFocus?: boolean;\n ... 251 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
1042
+ "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoCapitalize?: \"off\" | ... 5 more ... | (string & {});\n ... 252 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
1027
1043
  "isSpread": true
1028
1044
  }
1029
1045
  ],
@@ -1051,6 +1067,7 @@
1051
1067
  "line": 11,
1052
1068
  "character": 15
1053
1069
  },
1070
+ "signature": "interface ElementHighlighterProps",
1054
1071
  "name": "ElementHighlighterProps",
1055
1072
  "exportNode": {
1056
1073
  "__schema": "InterfaceSchema",
@@ -1077,7 +1094,8 @@
1077
1094
  "character": 3
1078
1095
  },
1079
1096
  "raw": "/** highlight this element */",
1080
- "comment": "highlight this element"
1097
+ "comment": "highlight this element",
1098
+ "tags": []
1081
1099
  },
1082
1100
  "signature": "(property) ElementHighlighterProps.targetRef: React.RefObject<HTMLElement>",
1083
1101
  "name": "targetRef",
@@ -1138,7 +1156,8 @@
1138
1156
  "character": 3
1139
1157
  },
1140
1158
  "raw": "/** components with metadata to show in the label */",
1141
- "comment": "components with metadata to show in the label"
1159
+ "comment": "components with metadata to show in the label",
1160
+ "tags": []
1142
1161
  },
1143
1162
  "signature": "(property) ElementHighlighterProps.components?: (string | ComponentMetaHolder)[]",
1144
1163
  "name": "components",
@@ -1208,7 +1227,8 @@
1208
1227
  "character": 3
1209
1228
  },
1210
1229
  "raw": "/** default location of the label */",
1211
- "comment": "default location of the label"
1230
+ "comment": "default location of the label",
1231
+ "tags": []
1212
1232
  },
1213
1233
  "signature": "(property) ElementHighlighterProps.placement?: Placement",
1214
1234
  "name": "placement",
@@ -1238,7 +1258,8 @@
1238
1258
  "character": 3
1239
1259
  },
1240
1260
  "raw": "/** customize styles */",
1241
- "comment": "customize styles"
1261
+ "comment": "customize styles",
1262
+ "tags": []
1242
1263
  },
1243
1264
  "signature": "(property) ElementHighlighterProps.classes?: HighlightClasses",
1244
1265
  "name": "classes",
@@ -1268,7 +1289,8 @@
1268
1289
  "character": 3
1269
1290
  },
1270
1291
  "raw": "/** continually update highlighter to match moving elements */",
1271
- "comment": "continually update highlighter to match moving elements"
1292
+ "comment": "continually update highlighter to match moving elements",
1293
+ "tags": []
1272
1294
  },
1273
1295
  "signature": "(property) ElementHighlighterProps.watchMotion?: boolean",
1274
1296
  "name": "watchMotion",
@@ -1312,7 +1334,7 @@
1312
1334
  "character": 50
1313
1335
  },
1314
1336
  "name": "React",
1315
- "packageName": "/tmp/capsules-root/sign-capsules/2024-6-16/u7dgdz/teambit.react_ui_component-highlighter@dcd2eb88a350a7c145e00700f7601cd352c13546/element-highlighter/element-highlighter.tsx"
1337
+ "packageName": "/tmp/capsules-root/sign-capsules/2024-9-1/hh2z70/teambit.react_ui_component-highlighter@2ee94e9870d0dd40e401e7d7450ae6949364b1c7/element-highlighter/element-highlighter.tsx"
1316
1338
  }
1317
1339
  }
1318
1340
  ]
@@ -1325,6 +1347,7 @@
1325
1347
  "line": 11,
1326
1348
  "character": 40
1327
1349
  },
1350
+ "signature": "export { Placement };\n\nPlacement",
1328
1351
  "name": "Placement",
1329
1352
  "exportNode": {
1330
1353
  "__schema": "TypeRefSchema",
@@ -1343,6 +1366,7 @@
1343
1366
  "line": 11,
1344
1367
  "character": 51
1345
1368
  },
1369
+ "signature": "type HighlightClasses = {\n container?: string;\n frame?: string;\n label?: string;\n}",
1346
1370
  "name": "HighlightClasses",
1347
1371
  "exportNode": {
1348
1372
  "__schema": "TypeSchema",
@@ -1432,6 +1456,7 @@
1432
1456
  "line": 14,
1433
1457
  "character": 3
1434
1458
  },
1459
+ "signature": "function ExcludeHighlighter(props: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element",
1435
1460
  "name": "ExcludeHighlighter",
1436
1461
  "exportNode": {
1437
1462
  "__schema": "ReactSchema",
@@ -1448,7 +1473,8 @@
1448
1473
  "character": 1
1449
1474
  },
1450
1475
  "raw": "/** children of this element will be excluded by the automatic highlighter */",
1451
- "comment": "children of this element will be excluded by the automatic highlighter"
1476
+ "comment": "children of this element will be excluded by the automatic highlighter",
1477
+ "tags": []
1452
1478
  },
1453
1479
  "signature": "function ExcludeHighlighter(props: React.HTMLAttributes<HTMLDivElement>): React.JSX.Element",
1454
1480
  "name": "ExcludeHighlighter",
@@ -1505,6 +1531,7 @@
1505
1531
  "line": 15,
1506
1532
  "character": 3
1507
1533
  },
1534
+ "signature": "const excludeHighlighterAtt: {\n \"data-ignore-component-highlight\": boolean;\n}",
1508
1535
  "name": "excludeHighlighterAtt",
1509
1536
  "exportNode": {
1510
1537
  "__schema": "VariableLikeSchema",
@@ -1535,6 +1562,7 @@
1535
1562
  "line": 16,
1536
1563
  "character": 3
1537
1564
  },
1565
+ "signature": "const excludeHighlighterAttrName: \"data-ignore-component-highlight\"",
1538
1566
  "name": "excludeHighlighterAttrName",
1539
1567
  "exportNode": {
1540
1568
  "__schema": "VariableLikeSchema",
@@ -1565,6 +1593,7 @@
1565
1593
  "line": 17,
1566
1594
  "character": 3
1567
1595
  },
1596
+ "signature": "const skipHighlighterAttr: {\n \"data-skip-component-highlight\": boolean;\n}",
1568
1597
  "name": "skipHighlighterAttr",
1569
1598
  "exportNode": {
1570
1599
  "__schema": "VariableLikeSchema",
@@ -1595,6 +1624,7 @@
1595
1624
  "line": 18,
1596
1625
  "character": 3
1597
1626
  },
1627
+ "signature": "const skipHighlighterAttrName: \"data-skip-component-highlight\"",
1598
1628
  "name": "skipHighlighterAttrName",
1599
1629
  "exportNode": {
1600
1630
  "__schema": "VariableLikeSchema",
@@ -1625,6 +1655,7 @@
1625
1655
  "line": 21,
1626
1656
  "character": 15
1627
1657
  },
1658
+ "signature": "type MatchRule = string | ((element: HTMLElement) => boolean)",
1628
1659
  "name": "MatchRule",
1629
1660
  "exportNode": {
1630
1661
  "__schema": "TypeSchema",
@@ -1752,7 +1783,8 @@
1752
1783
  "character": 3
1753
1784
  },
1754
1785
  "raw": "/** stop all highlighting and drop listeners */",
1755
- "comment": "stop all highlighting and drop listeners"
1786
+ "comment": "stop all highlighting and drop listeners",
1787
+ "tags": []
1756
1788
  },
1757
1789
  "signature": "(property) HybridHighlighterProps.disabled?: boolean",
1758
1790
  "name": "disabled",
@@ -1782,7 +1814,8 @@
1782
1814
  "character": 3
1783
1815
  },
1784
1816
  "raw": "/** default pop location for the label */",
1785
- "comment": "default pop location for the label"
1817
+ "comment": "default pop location for the label",
1818
+ "tags": []
1786
1819
  },
1787
1820
  "signature": "(property) HybridHighlighterProps.placement?: Placement",
1788
1821
  "name": "placement",
@@ -1812,7 +1845,8 @@
1812
1845
  "character": 3
1813
1846
  },
1814
1847
  "raw": "/** customize styles */",
1815
- "comment": "customize styles"
1848
+ "comment": "customize styles",
1849
+ "tags": []
1816
1850
  },
1817
1851
  "signature": "(property) HybridHighlighterProps.classes?: HighlightClasses",
1818
1852
  "name": "classes",
@@ -1842,7 +1876,8 @@
1842
1876
  "character": 3
1843
1877
  },
1844
1878
  "raw": "/** customize highlighter */",
1845
- "comment": "customize highlighter"
1879
+ "comment": "customize highlighter",
1880
+ "tags": []
1846
1881
  },
1847
1882
  "signature": "(property) HybridHighlighterProps.highlightStyle?: React.CSSProperties",
1848
1883
  "name": "highlightStyle",
@@ -1915,7 +1950,8 @@
1915
1950
  "character": 3
1916
1951
  },
1917
1952
  "raw": "/** continually update frame position to match moving elements */",
1918
- "comment": "continually update frame position to match moving elements"
1953
+ "comment": "continually update frame position to match moving elements",
1954
+ "tags": []
1919
1955
  },
1920
1956
  "signature": "(property) HybridHighlighterProps.watchMotion?: boolean",
1921
1957
  "name": "watchMotion",
@@ -1945,7 +1981,8 @@
1945
1981
  "character": 3
1946
1982
  },
1947
1983
  "raw": "/** filter highlighter targets by this query selector. (May be a more complex object in the future) */",
1948
- "comment": "filter highlighter targets by this query selector. (May be a more complex object in the future)"
1984
+ "comment": "filter highlighter targets by this query selector. (May be a more complex object in the future)",
1985
+ "tags": []
1949
1986
  },
1950
1987
  "signature": "(property) HybridHighlighterProps.rule?: MatchRule",
1951
1988
  "name": "rule",
@@ -1975,7 +2012,8 @@
1975
2012
  "character": 3
1976
2013
  },
1977
2014
  "raw": "/** filter components to match this rule. Can be id, array of ids, or a function */",
1978
- "comment": "filter components to match this rule. Can be id, array of ids, or a function"
2015
+ "comment": "filter components to match this rule. Can be id, array of ids, or a function",
2016
+ "tags": []
1979
2017
  },
1980
2018
  "signature": "(property) HybridHighlighterProps.componentRule?: ComponentMatchRule",
1981
2019
  "name": "componentRule",
@@ -2006,7 +2044,8 @@
2006
2044
  "character": 3
2007
2045
  },
2008
2046
  "raw": "/** set the behavior of the highlighter.\n * `disabled` - stops highlighting.\n * `allChildren` - highlights all components rendered under children\n * `hover` - highlighters the component immediately under the mouse cursor\n * */",
2009
- "comment": "set the behavior of the highlighter.\n`disabled` - stops highlighting.\n`allChildren` - highlights all components rendered under children\n`hover` - highlighters the component immediately under the mouse cursor"
2047
+ "comment": "set the behavior of the highlighter.\n`disabled` - stops highlighting.\n`allChildren` - highlights all components rendered under children\n`hover` - highlighters the component immediately under the mouse cursor",
2048
+ "tags": []
2010
2049
  },
2011
2050
  "signature": "(property) HybridHighlighterProps.mode?: \"allChildren\" | \"hover\"",
2012
2051
  "name": "mode",
@@ -2129,7 +2168,7 @@
2129
2168
  "character": 49
2130
2169
  },
2131
2170
  "name": "React",
2132
- "packageName": "/tmp/capsules-root/sign-capsules/2024-6-16/u7dgdz/teambit.react_ui_component-highlighter@dcd2eb88a350a7c145e00700f7601cd352c13546/hybrid-highlighter/hybrid-highlighter.tsx"
2171
+ "packageName": "/tmp/capsules-root/sign-capsules/2024-9-1/hh2z70/teambit.react_ui_component-highlighter@2ee94e9870d0dd40e401e7d7450ae6949364b1c7/hybrid-highlighter/hybrid-highlighter.tsx"
2133
2172
  }
2134
2173
  }
2135
2174
  ]
@@ -2149,7 +2188,8 @@
2149
2188
  "character": 1
2150
2189
  },
2151
2190
  "raw": "/** automatically highlight components on hover */",
2152
- "comment": "automatically highlight components on hover"
2191
+ "comment": "automatically highlight components on hover",
2192
+ "tags": []
2153
2193
  },
2154
2194
  "signature": "function HybridHighlighter({ disabled, mode, debounceSelection, watchMotion, placement, rule, componentRule, classes, highlightStyle, className, style, bgColor, bgColorHover, bgColorActive, children, ...rest }: HybridHighlighterProps): React.JSX.Element",
2155
2195
  "name": "HybridHighlighter",
@@ -2348,7 +2388,7 @@
2348
2388
  "character": 6
2349
2389
  },
2350
2390
  "name": "rest",
2351
- "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoFocus?: boolean;\n ... 249 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
2391
+ "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoCapitalize?: \"off\" | ... 5 more ... | (string & {});\n ... 250 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
2352
2392
  "isSpread": true
2353
2393
  }
2354
2394
  ],
@@ -2478,7 +2518,8 @@
2478
2518
  "character": 3
2479
2519
  },
2480
2520
  "raw": "/** highlight this element */",
2481
- "comment": "highlight this element"
2521
+ "comment": "highlight this element",
2522
+ "tags": []
2482
2523
  },
2483
2524
  "signature": "(property) ElementHighlighterProps.targetRef: React.RefObject<HTMLElement>",
2484
2525
  "name": "targetRef",
@@ -2539,7 +2580,8 @@
2539
2580
  "character": 3
2540
2581
  },
2541
2582
  "raw": "/** components with metadata to show in the label */",
2542
- "comment": "components with metadata to show in the label"
2583
+ "comment": "components with metadata to show in the label",
2584
+ "tags": []
2543
2585
  },
2544
2586
  "signature": "(property) ElementHighlighterProps.components?: (string | ComponentMetaHolder)[]",
2545
2587
  "name": "components",
@@ -2609,7 +2651,8 @@
2609
2651
  "character": 3
2610
2652
  },
2611
2653
  "raw": "/** default location of the label */",
2612
- "comment": "default location of the label"
2654
+ "comment": "default location of the label",
2655
+ "tags": []
2613
2656
  },
2614
2657
  "signature": "(property) ElementHighlighterProps.placement?: Placement",
2615
2658
  "name": "placement",
@@ -2639,7 +2682,8 @@
2639
2682
  "character": 3
2640
2683
  },
2641
2684
  "raw": "/** customize styles */",
2642
- "comment": "customize styles"
2685
+ "comment": "customize styles",
2686
+ "tags": []
2643
2687
  },
2644
2688
  "signature": "(property) ElementHighlighterProps.classes?: HighlightClasses",
2645
2689
  "name": "classes",
@@ -2669,7 +2713,8 @@
2669
2713
  "character": 3
2670
2714
  },
2671
2715
  "raw": "/** continually update highlighter to match moving elements */",
2672
- "comment": "continually update highlighter to match moving elements"
2716
+ "comment": "continually update highlighter to match moving elements",
2717
+ "tags": []
2673
2718
  },
2674
2719
  "signature": "(property) ElementHighlighterProps.watchMotion?: boolean",
2675
2720
  "name": "watchMotion",
@@ -2713,7 +2758,7 @@
2713
2758
  "character": 50
2714
2759
  },
2715
2760
  "name": "React",
2716
- "packageName": "/tmp/capsules-root/sign-capsules/2024-6-16/u7dgdz/teambit.react_ui_component-highlighter@dcd2eb88a350a7c145e00700f7601cd352c13546/element-highlighter/element-highlighter.tsx"
2761
+ "packageName": "/tmp/capsules-root/sign-capsules/2024-9-1/hh2z70/teambit.react_ui_component-highlighter@2ee94e9870d0dd40e401e7d7450ae6949364b1c7/element-highlighter/element-highlighter.tsx"
2717
2762
  }
2718
2763
  }
2719
2764
  ]
@@ -2725,6 +2770,7 @@
2725
2770
  "line": 23,
2726
2771
  "character": 10
2727
2772
  },
2773
+ "signature": "export { Placement };\n\nPlacement",
2728
2774
  "name": "Placement",
2729
2775
  "exportNode": {
2730
2776
  "__schema": "TypeRefSchema",
@@ -2919,7 +2965,7 @@
2919
2965
  "character": 6
2920
2966
  },
2921
2967
  "name": "props",
2922
- "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoFocus?: boolean;\n ... 251 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
2968
+ "type": "{\n defaultChecked?: boolean;\n defaultValue?: string | number | readonly string[];\n suppressContentEditableWarning?: boolean;\n suppressHydrationWarning?: boolean;\n accessKey?: string;\n autoCapitalize?: \"off\" | ... 5 more ... | (string & {});\n ... 252 more ...;\n onTransitionEndCapture?: React.TransitionEventHandler<...>;\n}",
2923
2969
  "isSpread": true
2924
2970
  }
2925
2971
  ],
@@ -2946,7 +2992,7 @@
2946
2992
  "componentId": {
2947
2993
  "scope": "teambit.react",
2948
2994
  "name": "ui/component-highlighter",
2949
- "version": "dcd2eb88a350a7c145e00700f7601cd352c13546"
2995
+ "version": "2ee94e9870d0dd40e401e7d7450ae6949364b1c7"
2950
2996
  },
2951
2997
  "taggedModuleExports": []
2952
2998
  }
package/static/css/teambit.react/ui/component-highlighter.15a16662.css ADDED
@@ -0,0 +1 @@
1
+ .frame_overlayBorder__2roDn{border:2px solid #eebcc9;border:2px solid var(--bit-highlighter-color,#eebcc9);border-radius:11px;box-sizing:border-box;padding:4px;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.frame_hidden__ygRzQ{display:none}.label_othersContainer__cv5Te>*{margin-bottom:8px}.label_othersContainer__cv5Te>:last-child{margin-bottom:0}.label_othersTooltip__20mSA{cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.label_othersTooltip__20mSA:before{content:"▾";display:inline-block;transition:transform .3s}.label_othersTooltip__20mSA.label_active__3mjfH:before{transform:rotate(-180deg)}.label_hidden__1sEMT{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;visibility:hidden}.component-strip_componentStrip__UKGpB{border-radius:.5em;box-shadow:var(--bit-highlighter-shadow);display:flex;white-space:nowrap;width:-moz-fit-content;width:fit-content}.component-strip_componentStrip__UKGpB>*{background:#eebcc9;background:var(--bit-highlighter-color,#eebcc9);line-height:1.5;margin-right:.125em;padding:0 .5em;transform:translateZ(0);transition:filter .3s,background-color .3s}.component-strip_componentStrip__UKGpB>:link,.component-strip_componentStrip__UKGpB>:visited{color:inherit;text-decoration:inherit}.component-strip_componentStrip__UKGpB>:link:hover,.component-strip_componentStrip__UKGpB>:visited:hover{background:#f6dae2;background:var(--bit-highlighter-color-hover,#f6dae2)}.component-strip_componentStrip__UKGpB>:link:active,.component-strip_componentStrip__UKGpB>:visited:active{background:#e79db1;background:var(--bit-highlighter-color-active,#e79db1);color:inherit}.component-strip_componentStrip__UKGpB>:first-child{border-bottom-left-radius:.5em;border-top-left-radius:.5em}.component-strip_componentStrip__UKGpB>:last-child{border-bottom-right-radius:.5em;border-top-right-radius:.5em;margin-right:0}.component-strip_nameBlock__1lpGn{display:flex}.component-strip_nameBlock__1lpGn .component-strip_version__2Doo2{max-width:13ch;overflow:hidden;text-overflow:ellipsis;transition:max-width .48s;white-space:nowrap}.component-strip_nameBlock__1lpGn .component-strip_version__2Doo2:hover{max-width:61ch}.element-highlighter_label__17D0c{padding:8px}.element-highlighter_frame__sbiQu,.element-highlighter_label__17D0c{z-index:15500}