@teambit/react.ui.component-highlighter 0.0.493 → 0.0.494

package/{multi-highlighter/multi-highlighter.composition.tsx → children-highlighter/children-highlighter.composition.tsx}

@@ -3,23 +3,23 @@ import React from 'react';
 import { MockedComponentWithMeta } from '@teambit/react.ui.highlighter.component-metadata.bit-component-meta';
 import { IconButton } from '@teambit/design.ui.icon-button';
 import { ExcludeHighlighter } from '../ignore-highlighter';
-import { MultiHighlighter } from './multi-highlighter';
+import { ChildrenHighlighter } from './children-highlighter';
 
-export const MultiHighlighterPreview = () => {
+export const ChildrenHighlighterPreview = () => {
   return (
-    <MultiHighlighter style={{ padding: 40, minWidth: 200 }}>
+    <ChildrenHighlighter style={{ padding: 40, minWidth: 200 }}>
       <MockedComponentWithMeta>hover here</MockedComponentWithMeta>
       <br />
       <br />
       <br />
       <IconButton>this will be highlighted with dropdown</IconButton>
-    </MultiHighlighter>
+    </ChildrenHighlighter>
   );
 };
 
-export const MultiHighlighterWithCustomColors = () => {
+export const ChildrenHighlighterWithCustomColors = () => {
   return (
-    <MultiHighlighter
+    <ChildrenHighlighter
       style={{ padding: 40, minWidth: 200, color: 'yellow' }}
       bgColor="cornflowerblue"
       bgColorHover="blue"
@@ -30,14 +30,14 @@ export const MultiHighlighterWithCustomColors = () => {
       <br />
       <br />
       <MockedComponentWithMeta>also here</MockedComponentWithMeta>
-    </MultiHighlighter>
+    </ChildrenHighlighter>
   );
 };
 
-export const MultiHighlighterInsideIgnore = () => {
+export const ChildrenHighlighterInsideIgnore = () => {
   return (
     <ExcludeHighlighter>
-      <MultiHighlighter>
+      <ChildrenHighlighter>
         Multi Highlighter should still work when inside <code>{'<ExcludeHighlighter>'}</code>
         <br />
         It should only skip exclusion zones inside of it.
@@ -49,14 +49,14 @@ export const MultiHighlighterInsideIgnore = () => {
         <br />
         <br />
         <MockedComponentWithMeta>also here</MockedComponentWithMeta>
-      </MultiHighlighter>
+      </ChildrenHighlighter>
     </ExcludeHighlighter>
   );
 };
 
-export const MultiHighlighterWithRule = () => {
+export const ChildrenHighlighterWithRule = () => {
   return (
-    <MultiHighlighter rule="#someSubTree *" style={{ minWidth: 300 }}>
+    <ChildrenHighlighter rule="#someSubTree *" style={{ minWidth: 300 }}>
       <div>
         element filter: <code>"#someSubTree *"</code>
       </div>
@@ -68,13 +68,13 @@ export const MultiHighlighterWithRule = () => {
       <div id="someSubTree">
         <MockedComponentWithMeta>this will be highlighted</MockedComponentWithMeta>
       </div>
-    </MultiHighlighter>
+    </ChildrenHighlighter>
   );
 };
 
-export const MultiHighlighterWithComponentRule = () => {
+export const ChildrenHighlighterWithComponentRule = () => {
   return (
-    <MultiHighlighter componentRule="teambit.design/ui/icon-button" style={{ minWidth: 300 }}>
+    <ChildrenHighlighter componentRule="teambit.design/ui/icon-button" style={{ minWidth: 300 }}>
       <div>
         component filter: <code>"teambit.design/ui/icon-button"</code>
       </div>
@@ -84,14 +84,14 @@ export const MultiHighlighterWithComponentRule = () => {
       <br />
       <br />
       <IconButton>this will be highlighted</IconButton>
-    </MultiHighlighter>
+    </ChildrenHighlighter>
   );
 };
 
 // export const HighlightingAllElementsInTheEnterprisePage = () => {
 //   return (
-//     <MultiHighlighter>
+//     <ChildrenHighlighter>
 //       <EnterpriseOffering style={{ height: 300 }} />
-//     </MultiHighlighter>
+//     </ChildrenHighlighter>
 //   );
 // };

package/{multi-highlighter/multi-highlighter.spec.tsx → children-highlighter/children-highlighter.spec.tsx}

@@ -1,9 +1,9 @@
 import React from 'react';
 import { render } from '@testing-library/react';
-import { MultiHighlighterPreview } from './multi-highlighter.composition';
+import { ChildrenHighlighterPreview } from './children-highlighter.composition';
 
-it('should not throw when rendering the multi-highlighter', () => {
-  const { getByText } = render(<MultiHighlighterPreview />);
+it('should not throw when rendering the children-highlighter', () => {
+  const { getByText } = render(<ChildrenHighlighterPreview />);
 
   const rendered = getByText('hover here');
 

package/children-highlighter/children-highlighter.tsx

@@ -0,0 +1,9 @@
+import React from 'react';
+
+import { HybridHighlighter, HybridHighlighterProps } from '../hybrid-highlighter';
+
+export type ChildrenHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
+
+export function ChildrenHighlighter({ watchMotion = false, ...props }: ChildrenHighlighterProps) {
+  return <HybridHighlighter {...props} mode={'allChildren'} watchMotion={watchMotion} />;
+}

package/children-highlighter/index.ts

@@ -0,0 +1,5 @@
+export { useChildrenHighlighter } from './use-children-highlighter';
+export type { ChildrenHighlighterOptions } from './use-children-highlighter';
+
+export { ChildrenHighlighter } from './children-highlighter';
+export type { ChildrenHighlighterProps } from './children-highlighter';

package/{multi-highlighter/use-multi-highlighter.tsx → children-highlighter/use-children-highlighter.tsx}

@@ -10,7 +10,7 @@ import { HighlightTarget } from '../element-highlighter';
 import { excludeHighlighterSelector } from '../ignore-highlighter';
 import { ruleMatcher, MatchRule, ComponentMatchRule, componentRuleMatcher } from '../rule-matcher';
 
-type useMultiHighlighterProps = {
+export type ChildrenHighlighterOptions = {
   onChange: (highlighterTargets: Record<string, HighlightTarget>) => void;
   disabled?: boolean;
   scopeRef: RefObject<HTMLElement>;
@@ -23,14 +23,14 @@ type useMultiHighlighterProps = {
   // watchDom?: boolean;
 };
 
-export function useMultiHighlighter({
+export function useChildrenHighlighter({
   onChange,
   disabled,
   scopeRef,
   scopeClass: scopeSelector = '',
   rule,
   componentRule,
-}: useMultiHighlighterProps) {
+}: ChildrenHighlighterOptions) {
   useEffect(() => {
     const nextTargets: Record<string, HighlightTarget> = {};
     const scopeElement = scopeRef.current;

package/component-highlighter.docs.md

@@ -94,7 +94,7 @@ The Component Highlighter comes in a few different modes:
 In addition to changing the `mode` prop, you can also use convenience exports from the same package:
 
 ```tsx
-import { MultiHighlighter, HoverHighlighter } from '@teambit/react.ui.component-highlighter';
+import { ChildrenHighlighter, HoverHighlighter } from '@teambit/react.ui.component-highlighter';
 
 function example() {
   return (
@@ -103,9 +103,9 @@ function example() {
         <App />
       </HoverHighlighter>
 
-      <MultiHighlighter>
+      <ChildrenHighlighter>
         <App />
-      </MultiHighlighter>
+      </ChildrenHighlighter>
     </div>
   );
 }

package/dist/children-highlighter/children-highlighter.composition.d.ts

@@ -0,0 +1,5 @@
+export declare const ChildrenHighlighterPreview: () => JSX.Element;
+export declare const ChildrenHighlighterWithCustomColors: () => JSX.Element;
+export declare const ChildrenHighlighterInsideIgnore: () => JSX.Element;
+export declare const ChildrenHighlighterWithRule: () => JSX.Element;
+export declare const ChildrenHighlighterWithComponentRule: () => JSX.Element;

package/dist/{multi-highlighter/multi-highlighter.composition.js → children-highlighter/children-highlighter.composition.js}

@@ -3,34 +3,34 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MultiHighlighterWithComponentRule = exports.MultiHighlighterWithRule = exports.MultiHighlighterInsideIgnore = exports.MultiHighlighterWithCustomColors = exports.MultiHighlighterPreview = void 0;
+exports.ChildrenHighlighterWithComponentRule = exports.ChildrenHighlighterWithRule = exports.ChildrenHighlighterInsideIgnore = exports.ChildrenHighlighterWithCustomColors = exports.ChildrenHighlighterPreview = void 0;
 const react_1 = __importDefault(require("react"));
 // import { EnterpriseOffering } from '@teambit/evangelist.pages.enterprise-offering';
 const react_ui_highlighter_component_metadata_bit_component_meta_1 = require("@teambit/react.ui.highlighter.component-metadata.bit-component-meta");
 const design_ui_icon_button_1 = require("@teambit/design.ui.icon-button");
 const ignore_highlighter_1 = require("../ignore-highlighter");
-const multi_highlighter_1 = require("./multi-highlighter");
-const MultiHighlighterPreview = () => {
-    return (react_1.default.createElement(multi_highlighter_1.MultiHighlighter, { style: { padding: 40, minWidth: 200 } },
+const children_highlighter_1 = require("./children-highlighter");
+const ChildrenHighlighterPreview = () => {
+    return (react_1.default.createElement(children_highlighter_1.ChildrenHighlighter, { style: { padding: 40, minWidth: 200 } },
         react_1.default.createElement(react_ui_highlighter_component_metadata_bit_component_meta_1.MockedComponentWithMeta, null, "hover here"),
         react_1.default.createElement("br", null),
         react_1.default.createElement("br", null),
         react_1.default.createElement("br", null),
         react_1.default.createElement(design_ui_icon_button_1.IconButton, null, "this will be highlighted with dropdown")));
 };
-exports.MultiHighlighterPreview = MultiHighlighterPreview;
-const MultiHighlighterWithCustomColors = () => {
-    return (react_1.default.createElement(multi_highlighter_1.MultiHighlighter, { style: { padding: 40, minWidth: 200, color: 'yellow' }, bgColor: "cornflowerblue", bgColorHover: "blue", bgColorActive: "DarkSlateBlue" },
+exports.ChildrenHighlighterPreview = ChildrenHighlighterPreview;
+const ChildrenHighlighterWithCustomColors = () => {
+    return (react_1.default.createElement(children_highlighter_1.ChildrenHighlighter, { style: { padding: 40, minWidth: 200, color: 'yellow' }, bgColor: "cornflowerblue", bgColorHover: "blue", bgColorActive: "DarkSlateBlue" },
         react_1.default.createElement(react_ui_highlighter_component_metadata_bit_component_meta_1.MockedComponentWithMeta, null, "hover here"),
         react_1.default.createElement("br", null),
         react_1.default.createElement("br", null),
         react_1.default.createElement("br", null),
         react_1.default.createElement(react_ui_highlighter_component_metadata_bit_component_meta_1.MockedComponentWithMeta, null, "also here")));
 };
-exports.MultiHighlighterWithCustomColors = MultiHighlighterWithCustomColors;
-const MultiHighlighterInsideIgnore = () => {
+exports.ChildrenHighlighterWithCustomColors = ChildrenHighlighterWithCustomColors;
+const ChildrenHighlighterInsideIgnore = () => {
     return (react_1.default.createElement(ignore_highlighter_1.ExcludeHighlighter, null,
-        react_1.default.createElement(multi_highlighter_1.MultiHighlighter, null,
+        react_1.default.createElement(children_highlighter_1.ChildrenHighlighter, null,
             "Multi Highlighter should still work when inside ",
             react_1.default.createElement("code", null, '<ExcludeHighlighter>'),
             react_1.default.createElement("br", null),
@@ -44,9 +44,9 @@ const MultiHighlighterInsideIgnore = () => {
             react_1.default.createElement("br", null),
             react_1.default.createElement(react_ui_highlighter_component_metadata_bit_component_meta_1.MockedComponentWithMeta, null, "also here"))));
 };
-exports.MultiHighlighterInsideIgnore = MultiHighlighterInsideIgnore;
-const MultiHighlighterWithRule = () => {
-    return (react_1.default.createElement(multi_highlighter_1.MultiHighlighter, { rule: "#someSubTree *", style: { minWidth: 300 } },
+exports.ChildrenHighlighterInsideIgnore = ChildrenHighlighterInsideIgnore;
+const ChildrenHighlighterWithRule = () => {
+    return (react_1.default.createElement(children_highlighter_1.ChildrenHighlighter, { rule: "#someSubTree *", style: { minWidth: 300 } },
         react_1.default.createElement("div", null,
             "element filter: ",
             react_1.default.createElement("code", null, "\"#someSubTree *\"")),
@@ -58,9 +58,9 @@ const MultiHighlighterWithRule = () => {
         react_1.default.createElement("div", { id: "someSubTree" },
             react_1.default.createElement(react_ui_highlighter_component_metadata_bit_component_meta_1.MockedComponentWithMeta, null, "this will be highlighted"))));
 };
-exports.MultiHighlighterWithRule = MultiHighlighterWithRule;
-const MultiHighlighterWithComponentRule = () => {
-    return (react_1.default.createElement(multi_highlighter_1.MultiHighlighter, { componentRule: "teambit.design/ui/icon-button", style: { minWidth: 300 } },
+exports.ChildrenHighlighterWithRule = ChildrenHighlighterWithRule;
+const ChildrenHighlighterWithComponentRule = () => {
+    return (react_1.default.createElement(children_highlighter_1.ChildrenHighlighter, { componentRule: "teambit.design/ui/icon-button", style: { minWidth: 300 } },
         react_1.default.createElement("div", null,
             "component filter: ",
             react_1.default.createElement("code", null, "\"teambit.design/ui/icon-button\"")),
@@ -71,12 +71,12 @@ const MultiHighlighterWithComponentRule = () => {
         react_1.default.createElement("br", null),
         react_1.default.createElement(design_ui_icon_button_1.IconButton, null, "this will be highlighted")));
 };
-exports.MultiHighlighterWithComponentRule = MultiHighlighterWithComponentRule;
+exports.ChildrenHighlighterWithComponentRule = ChildrenHighlighterWithComponentRule;
 // export const HighlightingAllElementsInTheEnterprisePage = () => {
 //   return (
-//     <MultiHighlighter>
+//     <ChildrenHighlighter>
 //       <EnterpriseOffering style={{ height: 300 }} />
-//     </MultiHighlighter>
+//     </ChildrenHighlighter>
 //   );
 // };
-//# sourceMappingURL=multi-highlighter.composition.js.map
+//# sourceMappingURL=children-highlighter.composition.js.map

package/dist/children-highlighter/children-highlighter.composition.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"children-highlighter.composition.js","sourceRoot":"","sources":["../../children-highlighter/children-highlighter.composition.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,sFAAsF;AACtF,oJAA8G;AAC9G,0EAA4D;AAC5D,8DAA2D;AAC3D,iEAA6D;AAEtD,MAAM,0BAA0B,GAAG,GAAG,EAAE;IAC7C,OAAO,CACL,8BAAC,0CAAmB,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QACxD,8BAAC,oFAAuB,qBAAqC;QAC7D,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,kCAAU,iDAAoD,CAC3C,CACvB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,0BAA0B,8BAUrC;AAEK,MAAM,mCAAmC,GAAG,GAAG,EAAE;IACtD,OAAO,CACL,8BAAC,0CAAmB,IAClB,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,EACtD,OAAO,EAAC,gBAAgB,EACxB,YAAY,EAAC,MAAM,EACnB,aAAa,EAAC,eAAe;QAE7B,8BAAC,oFAAuB,qBAAqC;QAC7D,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,oFAAuB,oBAAoC,CACxC,CACvB,CAAC;AACJ,CAAC,CAAC;AAfW,QAAA,mCAAmC,uCAe9C;AAEK,MAAM,+BAA+B,GAAG,GAAG,EAAE;IAClD,OAAO,CACL,8BAAC,uCAAkB;QACjB,8BAAC,0CAAmB;;YAC8B,4CAAO,sBAAsB,CAAQ;YACrF,yCAAM;;YAEN,yCAAM;YACN,yCAAM;YACN,yCAAM;YACN,8BAAC,oFAAuB,qBAAqC;YAC7D,yCAAM;YACN,yCAAM;YACN,yCAAM;YACN,8BAAC,oFAAuB,oBAAoC,CACxC,CACH,CACtB,CAAC;AACJ,CAAC,CAAC;AAlBW,QAAA,+BAA+B,mCAkB1C;AAEK,MAAM,2BAA2B,GAAG,GAAG,EAAE;IAC9C,OAAO,CACL,8BAAC,0CAAmB,IAAC,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QACjE;;YACkB,iEAA6B,CACzC;QACN,yCAAM;QACN,8BAAC,oFAAuB,yBAAyC;QACjE,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,uCAAK,EAAE,EAAC,aAAa;YACnB,8BAAC,oFAAuB,mCAAmD,CACvE,CACc,CACvB,CAAC;AACJ,CAAC,CAAC;AAhBW,QAAA,2BAA2B,+BAgBtC;AAEK,MAAM,oCAAoC,GAAG,GAAG,EAAE;IACvD,OAAO,CACL,8BAAC,0CAAmB,IAAC,aAAa,EAAC,+BAA+B,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QACzF;;YACoB,gFAA4C,CAC1D;QACN,yCAAM;QACN,8BAAC,oFAAuB,yBAAyC;QACjE,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,kCAAU,mCAAsC,CAC7B,CACvB,CAAC;AACJ,CAAC,CAAC;AAdW,QAAA,oCAAoC,wCAc/C;AAEF,oEAAoE;AACpE,aAAa;AACb,4BAA4B;AAC5B,uDAAuD;AACvD,6BAA6B;AAC7B,OAAO;AACP,KAAK"}

package/dist/children-highlighter/children-highlighter.d.ts

@@ -0,0 +1,3 @@
+import { HybridHighlighterProps } from '../hybrid-highlighter';
+export declare type ChildrenHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
+export declare function ChildrenHighlighter({ watchMotion, ...props }: ChildrenHighlighterProps): JSX.Element;

package/dist/{multi-highlighter/multi-highlighter.js → children-highlighter/children-highlighter.js}

@@ -14,12 +14,12 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.MultiHighlighter = void 0;
+exports.ChildrenHighlighter = void 0;
 const react_1 = __importDefault(require("react"));
-const hybrid_highligher_1 = require("../hybrid-highligher");
-function MultiHighlighter(_a) {
+const hybrid_highlighter_1 = require("../hybrid-highlighter");
+function ChildrenHighlighter(_a) {
     var { watchMotion = false } = _a, props = __rest(_a, ["watchMotion"]);
-    return react_1.default.createElement(hybrid_highligher_1.HybridHighlighter, Object.assign({}, props, { mode: 'allChildren', watchMotion: watchMotion }));
+    return react_1.default.createElement(hybrid_highlighter_1.HybridHighlighter, Object.assign({}, props, { mode: 'allChildren', watchMotion: watchMotion }));
 }
-exports.MultiHighlighter = MultiHighlighter;
-//# sourceMappingURL=multi-highlighter.js.map
+exports.ChildrenHighlighter = ChildrenHighlighter;
+//# sourceMappingURL=children-highlighter.js.map

package/dist/children-highlighter/children-highlighter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"children-highlighter.js","sourceRoot":"","sources":["../../children-highlighter/children-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAE1B,8DAAkF;AAIlF,SAAgB,mBAAmB,CAAC,EAA2D;QAA3D,EAAE,WAAW,GAAG,KAAK,OAAsC,EAAjC,KAAK,cAA/B,eAAiC,CAAF;IACjE,OAAO,8BAAC,sCAAiB,oBAAK,KAAK,IAAE,IAAI,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,IAAI,CAAC;AACzF,CAAC;AAFD,kDAEC"}

package/dist/{multi-highlighter/multi-highlighter.spec.js → children-highlighter/children-highlighter.spec.js}

@@ -5,9 +5,9 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 const react_1 = __importDefault(require("react"));
 const react_2 = require("@testing-library/react");
-const multi_highlighter_composition_1 = require("./multi-highlighter.composition");
-it('should not throw when rendering the multi-highlighter', () => {
-    const { getByText } = (0, react_2.render)(react_1.default.createElement(multi_highlighter_composition_1.MultiHighlighterPreview, null));
+const children_highlighter_composition_1 = require("./children-highlighter.composition");
+it('should not throw when rendering the children-highlighter', () => {
+    const { getByText } = (0, react_2.render)(react_1.default.createElement(children_highlighter_composition_1.ChildrenHighlighterPreview, null));
     const rendered = getByText('hover here');
     expect(rendered).toBeInstanceOf(HTMLElement);
 });
@@ -19,4 +19,4 @@ it('should not throw when rendering the multi-highlighter', () => {
 //   const rendered = queryAllByText('input/button');
 //   expect(rendered).toHaveLength(2);
 // });
-//# sourceMappingURL=multi-highlighter.spec.js.map
+//# sourceMappingURL=children-highlighter.spec.js.map

package/dist/children-highlighter/children-highlighter.spec.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"children-highlighter.spec.js","sourceRoot":"","sources":["../../children-highlighter/children-highlighter.spec.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,kDAAgD;AAChD,yFAAgF;AAEhF,EAAE,CAAC,0DAA0D,EAAE,GAAG,EAAE;IAClE,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,6DAA0B,OAAG,CAAC,CAAC;IAE7D,MAAM,QAAQ,GAAG,SAAS,CAAC,YAAY,CAAC,CAAC;IAEzC,MAAM,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC;AAC/C,CAAC,CAAC,CAAC;AAEH,sFAAsF;AACtF,4EAA4E;AAC5E,oDAAoD;AAEpD,8BAA8B;AAC9B,sDAAsD;AAEtD,qDAAqD;AACrD,sCAAsC;AACtC,MAAM"}

package/dist/children-highlighter/index.d.ts

@@ -0,0 +1,4 @@
+export { useChildrenHighlighter } from './use-children-highlighter';
+export type { ChildrenHighlighterOptions } from './use-children-highlighter';
+export { ChildrenHighlighter } from './children-highlighter';
+export type { ChildrenHighlighterProps } from './children-highlighter';

package/dist/children-highlighter/index.js

@@ -0,0 +1,8 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ChildrenHighlighter = exports.useChildrenHighlighter = void 0;
+var use_children_highlighter_1 = require("./use-children-highlighter");
+Object.defineProperty(exports, "useChildrenHighlighter", { enumerable: true, get: function () { return use_children_highlighter_1.useChildrenHighlighter; } });
+var children_highlighter_1 = require("./children-highlighter");
+Object.defineProperty(exports, "ChildrenHighlighter", { enumerable: true, get: function () { return children_highlighter_1.ChildrenHighlighter; } });
+//# sourceMappingURL=index.js.map

package/dist/children-highlighter/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../children-highlighter/index.ts"],"names":[],"mappings":";;;AAAA,uEAAoE;AAA3D,kIAAA,sBAAsB,OAAA;AAG/B,+DAA6D;AAApD,2HAAA,mBAAmB,OAAA"}

package/dist/{multi-highlighter/use-multi-highlighter.d.ts → children-highlighter/use-children-highlighter.d.ts}

@@ -1,7 +1,7 @@
 import { RefObject } from 'react';
 import { HighlightTarget } from '../element-highlighter';
 import { MatchRule, ComponentMatchRule } from '../rule-matcher';
-declare type useMultiHighlighterProps = {
+export declare type ChildrenHighlighterOptions = {
     onChange: (highlighterTargets: Record<string, HighlightTarget>) => void;
     disabled?: boolean;
     scopeRef: RefObject<HTMLElement>;
@@ -10,5 +10,4 @@ declare type useMultiHighlighterProps = {
     rule?: MatchRule;
     componentRule?: ComponentMatchRule;
 };
-export declare function useMultiHighlighter({ onChange, disabled, scopeRef, scopeClass: scopeSelector, rule, componentRule, }: useMultiHighlighterProps): void;
-export {};
+export declare function useChildrenHighlighter({ onChange, disabled, scopeRef, scopeClass: scopeSelector, rule, componentRule, }: ChildrenHighlighterOptions): void;

package/dist/{multi-highlighter/use-multi-highlighter.js → children-highlighter/use-children-highlighter.js}

@@ -3,14 +3,14 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.useMultiHighlighter = void 0;
+exports.useChildrenHighlighter = void 0;
 const react_1 = require("react");
 const get_xpath_1 = __importDefault(require("get-xpath"));
 const react_modules_dom_to_react_1 = require("@teambit/react.modules.dom-to-react");
 const react_ui_highlighter_component_metadata_bit_component_meta_1 = require("@teambit/react.ui.highlighter.component-metadata.bit-component-meta");
 const ignore_highlighter_1 = require("../ignore-highlighter");
 const rule_matcher_1 = require("../rule-matcher");
-function useMultiHighlighter({ onChange, disabled, scopeRef, scopeClass: scopeSelector = '', rule, componentRule, }) {
+function useChildrenHighlighter({ onChange, disabled, scopeRef, scopeClass: scopeSelector = '', rule, componentRule, }) {
     (0, react_1.useEffect)(() => {
         const nextTargets = {};
         const scopeElement = scopeRef.current;
@@ -38,7 +38,7 @@ function useMultiHighlighter({ onChange, disabled, scopeRef, scopeClass: scopeSe
         onChange(nextTargets);
     }, [disabled, scopeSelector]);
 }
-exports.useMultiHighlighter = useMultiHighlighter;
+exports.useChildrenHighlighter = useChildrenHighlighter;
 function targetsSelector(
 /**
  * the scope in which to consider the exclude selector.
@@ -47,4 +47,4 @@ function targetsSelector(
 scopeSelector = ':scope') {
     return `:not(${scopeSelector} ${ignore_highlighter_1.excludeHighlighterSelector}, ${scopeSelector} ${ignore_highlighter_1.excludeHighlighterSelector} *)`;
 }
-//# sourceMappingURL=use-multi-highlighter.js.map
+//# sourceMappingURL=use-children-highlighter.js.map

package/dist/children-highlighter/use-children-highlighter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-children-highlighter.js","sourceRoot":"","sources":["../../children-highlighter/use-children-highlighter.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAA6C;AAC7C,0DAAiC;AACjC,oFAAiF;AACjF,oJAI6E;AAE7E,8DAAmE;AACnE,kDAAmG;AAenG,SAAgB,sBAAsB,CAAC,EACrC,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,UAAU,EAAE,aAAa,GAAG,EAAE,EAC9B,IAAI,EACJ,aAAa,GACc;IAC3B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAoC,EAAE,CAAC;QACxD,MAAM,YAAY,GAAG,QAAQ,CAAC,OAAO,CAAC;QACtC,IAAI,CAAC,YAAY,IAAI,QAAQ;YAAE,OAAO;QAEtC,wCAAwC;QACxC,IAAI,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAc,eAAe,CAAC,IAAI,aAAa,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/G,uBAAuB;QACvB,IAAI,IAAI;YAAE,WAAW,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAA,0BAAW,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC;QAC9E,yBAAyB;QACzB,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,CAAC,0CAAa,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACvE,cAAc;QACd,MAAM,WAAW,GAAG,IAAI,GAAG,CAAC,YAAY,CAAC,CAAC;QAE1C,WAAW,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC9B,IAAI,CAAC,OAAO;gBAAE,OAAO;YACrB,MAAM,KAAK,GAAG,IAAA,wCAAW,EAAC,OAAO,CAAC,CAAC;YACnC,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CACrC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAA,6EAAgB,EAAC,CAAC,CAAC,IAAI,IAAA,mCAAoB,EAAC,EAAE,IAAI,EAAE,CAAC,CAAC,+EAAkB,CAAC,EAAE,EAAE,aAAa,CAAC,CACrE,CAAC;YAEhC,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC;gBAAE,OAAO;YAE1C,MAAM,GAAG,GAAG,IAAA,mBAAQ,EAAC,OAAO,CAAC,CAAC;YAE9B,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAC;QACjE,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,WAAW,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC;AAChC,CAAC;AAtCD,wDAsCC;AAED,SAAS,eAAe;AACtB;;;GAGG;AACH,aAAa,GAAG,QAAQ;IAExB,OAAO,QAAQ,aAAa,IAAI,+CAA0B,KAAK,aAAa,IAAI,+CAA0B,KAAK,CAAC;AAClH,CAAC"}

package/dist/component-highlighter.docs.md

@@ -94,7 +94,7 @@ The Component Highlighter comes in a few different modes:
 In addition to changing the `mode` prop, you can also use convenience exports from the same package:
 
 ```tsx
-import { MultiHighlighter, HoverHighlighter } from '@teambit/react.ui.component-highlighter';
+import { ChildrenHighlighter, HoverHighlighter } from '@teambit/react.ui.component-highlighter';
 
 function example() {
   return (
@@ -103,9 +103,9 @@ function example() {
         <App />
       </HoverHighlighter>
 
-      <MultiHighlighter>
+      <ChildrenHighlighter>
         <App />
-      </MultiHighlighter>
+      </ChildrenHighlighter>
     </div>
   );
 }

package/dist/hover-highlighter/hover-highlighter.d.ts

@@ -1,3 +1,3 @@
-import { HybridHighlighterProps } from '../hybrid-highligher';
+import { HybridHighlighterProps } from '../hybrid-highlighter';
 export declare type HoverHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
 export declare function HoverHighlighter({ ...props }: HoverHighlighterProps): JSX.Element;

package/dist/hover-highlighter/hover-highlighter.js

@@ -16,10 +16,10 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.HoverHighlighter = void 0;
 const react_1 = __importDefault(require("react"));
-const hybrid_highligher_1 = require("../hybrid-highligher");
+const hybrid_highlighter_1 = require("../hybrid-highlighter");
 function HoverHighlighter(_a) {
     var props = __rest(_a, []);
-    return react_1.default.createElement(hybrid_highligher_1.HybridHighlighter, Object.assign({}, props, { mode: 'hover' }));
+    return react_1.default.createElement(hybrid_highlighter_1.HybridHighlighter, Object.assign({}, props, { mode: 'hover' }));
 }
 exports.HoverHighlighter = HoverHighlighter;
 //# sourceMappingURL=hover-highlighter.js.map

package/dist/hover-highlighter/hover-highlighter.js.map

@@ -1 +1 @@
-{"version":3,"file":"hover-highlighter.js","sourceRoot":"","sources":["../../hover-highlighter/hover-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,4DAAiF;AAIjF,SAAgB,gBAAgB,CAAC,EAAmC;QAA9B,KAAK,cAAV,EAAY,CAAF;IACzC,OAAO,8BAAC,qCAAiB,oBAAK,KAAK,IAAE,IAAI,EAAE,OAAO,IAAI,CAAC;AACzD,CAAC;AAFD,4CAEC"}
+{"version":3,"file":"hover-highlighter.js","sourceRoot":"","sources":["../../hover-highlighter/hover-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAC1B,8DAAkF;AAIlF,SAAgB,gBAAgB,CAAC,EAAmC;QAA9B,KAAK,cAAV,EAAY,CAAF;IACzC,OAAO,8BAAC,sCAAiB,oBAAK,KAAK,IAAE,IAAI,EAAE,OAAO,IAAI,CAAC;AACzD,CAAC;AAFD,4CAEC"}

package/dist/{hybrid-highligher → hybrid-highlighter}/hybrid-highlighter.js

@@ -39,7 +39,7 @@ const classnames_1 = __importDefault(require("classnames"));
 const uuid_1 = require("uuid");
 const hover_highlighter_1 = require("../hover-highlighter");
 const element_highlighter_1 = require("../element-highlighter");
-const use_multi_highlighter_1 = require("../multi-highlighter/use-multi-highlighter");
+const children_highlighter_1 = require("../children-highlighter");
 /** automatically highlight components on hover */
 function HybridHighlighter(_a) {
     var { disabled, mode = 'hover', debounceSelection = 80, watchMotion = true, placement, rule, componentRule, classes, highlightStyle, className, style, bgColor, bgColorHover, bgColorActive, size, children } = _a, rest = __rest(_a, ["disabled", "mode", "debounceSelection", "watchMotion", "placement", "rule", "componentRule", "classes", "highlightStyle", "className", "style", "bgColor", "bgColorHover", "bgColorActive", "size", "children"]);
@@ -59,7 +59,7 @@ function HybridHighlighter(_a) {
         rule,
         componentRule,
     });
-    (0, use_multi_highlighter_1.useMultiHighlighter)({
+    (0, children_highlighter_1.useChildrenHighlighter)({
         onChange: setTarget,
         scopeRef: ref,
         scopeClass,

package/dist/hybrid-highlighter/hybrid-highlighter.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"hybrid-highlighter.js","sourceRoot":"","sources":["../../hybrid-highlighter/hybrid-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8F;AAC9F,4DAAoC;AACpC,+BAA0B;AAE1B,4DAA2D;AAC3D,gEAMgC;AAChC,kEAAiE;AAsCjE,kDAAkD;AAClD,SAAgB,iBAAiB,CAAC,EAmBT;QAnBS,EAChC,QAAQ,EACR,IAAI,GAAG,OAAO,EACd,iBAAiB,GAAG,EAAE,EACtB,WAAW,GAAG,IAAI,EAClB,SAAS,EACT,IAAI,EACJ,aAAa,EAEb,OAAO,EACP,cAAc,EACd,SAAS,EACT,KAAK,EACL,OAAO,EACP,YAAY,EACZ,aAAa,EACb,IAAI,EACJ,QAAQ,OAEe,EADpB,IAAI,cAlByB,iNAmBjC,CADQ;IAEP,MAAM,GAAG,GAAG,IAAA,iBAAS,GAAkB,CAAC;IACxC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAkC,EAAE,CAAC,CAAC;IAC3E,MAAM,UAAU,GAAG,IAAA,cAAM,EAAC,YAAY,IAAA,SAAE,GAAE,EAAE,CAAC,CAAC,OAAO,CAAC;IACtD,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAEtD,8BAA8B;IAC9B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,QAAQ;YAAE,SAAS,CAAC,EAAE,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,QAAQ,GAAG,IAAA,uCAAmB,EAClC,CAAC,UAAU,EAAE,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC3E,IAAI,EACJ;QACE,gBAAgB,EAAE,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QACpD,UAAU;QACV,QAAQ,EAAE,QAAQ,IAAI,IAAI,KAAK,OAAO;QACtC,IAAI;QACJ,aAAa;KACd,CACF,CAAC;IAEF,IAAA,6CAAsB,EAAC;QACrB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,GAAG;QACb,UAAU;QACV,QAAQ,EAAE,QAAQ,IAAI,IAAI,KAAK,aAAa;QAC5C,IAAI;QACJ,aAAa;KACd,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,IAAA,eAAO,EACrB,GAAG,EAAE,CAAC,iBACJ,yBAAyB,EAAE,OAAO,EAClC,+BAA+B,EAAE,YAAY,EAC7C,gCAAgC,EAAE,aAAa,IAC5C,KAAK,EACR,EACF,CAAC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,KAAK,CAAC,CAC9C,CAAC;IAEF,OAAO,CACL,qDACE,GAAG,EAAE,GAAG,IACJ,IAAI,EACJ,QAAQ,IACZ,KAAK,EAAE,OAAO,EACd,SAAS,EAAE,IAAA,oBAAU,EAAC,SAAS,EAAE,UAAU,CAAC;QAG3C,QAAQ;QAKR,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC,CAC9C,8BAAC,wCAAkB,IACjB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,cAAc,EACrB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,GACV,CACH,CAAC,CACE,CACP,CAAC;AACJ,CAAC;AAxFD,8CAwFC"}

package/dist/hybrid-highlighter/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../hybrid-highlighter/index.ts"],"names":[],"mappings":";;;AAAA,2DAAyD;AAAhD,uHAAA,iBAAiB,OAAA"}

package/dist/index.d.ts

@@ -1,9 +1,9 @@
-export { HybridHighlighter as ComponentHighlighter } from './hybrid-highligher';
-export type { HybridHighlighterProps as ComponentHighlightProps } from './hybrid-highligher';
+export { HybridHighlighter as ComponentHighlighter } from './hybrid-highlighter';
+export type { HybridHighlighterProps as ComponentHighlightProps } from './hybrid-highlighter';
 export { HoverHighlighter } from './hover-highlighter';
 export type { HoverHighlighterProps } from './hover-highlighter';
-export { MultiHighlighter } from './multi-highlighter';
-export type { MultiHighlighterProps } from './multi-highlighter';
+export { ChildrenHighlighter } from './children-highlighter';
+export type { ChildrenHighlighterProps } from './children-highlighter';
 export { ElementHighlighter } from './element-highlighter';
 export type { ElementHighlighterProps, HighlightTarget, Placement, HighlightClasses } from './element-highlighter';
 export { ExcludeHighlighter, excludeHighlighterAtt, excludeHighlighterSelector, excludeHighlighterAttrName, } from './ignore-highlighter';

package/dist/index.js

@@ -1,12 +1,12 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.excludeHighlighterAttrName = exports.excludeHighlighterSelector = exports.excludeHighlighterAtt = exports.ExcludeHighlighter = exports.ElementHighlighter = exports.MultiHighlighter = exports.HoverHighlighter = exports.ComponentHighlighter = void 0;
-var hybrid_highligher_1 = require("./hybrid-highligher");
-Object.defineProperty(exports, "ComponentHighlighter", { enumerable: true, get: function () { return hybrid_highligher_1.HybridHighlighter; } });
+exports.excludeHighlighterAttrName = exports.excludeHighlighterSelector = exports.excludeHighlighterAtt = exports.ExcludeHighlighter = exports.ElementHighlighter = exports.ChildrenHighlighter = exports.HoverHighlighter = exports.ComponentHighlighter = void 0;
+var hybrid_highlighter_1 = require("./hybrid-highlighter");
+Object.defineProperty(exports, "ComponentHighlighter", { enumerable: true, get: function () { return hybrid_highlighter_1.HybridHighlighter; } });
 var hover_highlighter_1 = require("./hover-highlighter");
 Object.defineProperty(exports, "HoverHighlighter", { enumerable: true, get: function () { return hover_highlighter_1.HoverHighlighter; } });
-var multi_highlighter_1 = require("./multi-highlighter");
-Object.defineProperty(exports, "MultiHighlighter", { enumerable: true, get: function () { return multi_highlighter_1.MultiHighlighter; } });
+var children_highlighter_1 = require("./children-highlighter");
+Object.defineProperty(exports, "ChildrenHighlighter", { enumerable: true, get: function () { return children_highlighter_1.ChildrenHighlighter; } });
 var element_highlighter_1 = require("./element-highlighter");
 Object.defineProperty(exports, "ElementHighlighter", { enumerable: true, get: function () { return element_highlighter_1.ElementHighlighter; } });
 var ignore_highlighter_1 = require("./ignore-highlighter");

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";;;AAAA,yDAAgF;AAAvE,yHAAA,iBAAiB,OAAwB;AAGlD,yDAAuD;AAA9C,qHAAA,gBAAgB,OAAA;AAGzB,yDAAuD;AAA9C,qHAAA,gBAAgB,OAAA;AAGzB,6DAA2D;AAAlD,yHAAA,kBAAkB,OAAA;AAG3B,2DAK8B;AAJ5B,wHAAA,kBAAkB,OAAA;AAClB,2HAAA,qBAAqB,OAAA;AACrB,gIAAA,0BAA0B,OAAA;AAC1B,gIAAA,0BAA0B,OAAA"}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../index.ts"],"names":[],"mappings":";;;AAAA,2DAAiF;AAAxE,0HAAA,iBAAiB,OAAwB;AAGlD,yDAAuD;AAA9C,qHAAA,gBAAgB,OAAA;AAGzB,+DAA6D;AAApD,2HAAA,mBAAmB,OAAA;AAG5B,6DAA2D;AAAlD,yHAAA,kBAAkB,OAAA;AAG3B,2DAK8B;AAJ5B,wHAAA,kBAAkB,OAAA;AAClB,2HAAA,qBAAqB,OAAA;AACrB,gIAAA,0BAA0B,OAAA;AAC1B,gIAAA,0BAA0B,OAAA"}

package/hover-highlighter/hover-highlighter.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { HybridHighlighter, HybridHighlighterProps } from '../hybrid-highligher';
+import { HybridHighlighter, HybridHighlighterProps } from '../hybrid-highlighter';
 
 export type HoverHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
 

package/{hybrid-highligher → hybrid-highlighter}/hybrid-highlighter.tsx

@@ -10,7 +10,7 @@ import {
   HighlightClasses,
   HighlighterSize,
 } from '../element-highlighter';
-import { useMultiHighlighter } from '../multi-highlighter/use-multi-highlighter';
+import { useChildrenHighlighter } from '../children-highlighter';
 import type { MatchRule, ComponentMatchRule } from '../rule-matcher';
 
 export interface HybridHighlighterProps extends React.HTMLAttributes<HTMLDivElement> {
@@ -91,7 +91,7 @@ export function HybridHighlighter({
     }
   );
 
-  useMultiHighlighter({
+  useChildrenHighlighter({
     onChange: setTarget,
     scopeRef: ref,
     scopeClass,

package/index.ts

@@ -1,11 +1,11 @@
-export { HybridHighlighter as ComponentHighlighter } from './hybrid-highligher';
-export type { HybridHighlighterProps as ComponentHighlightProps } from './hybrid-highligher';
+export { HybridHighlighter as ComponentHighlighter } from './hybrid-highlighter';
+export type { HybridHighlighterProps as ComponentHighlightProps } from './hybrid-highlighter';
 
 export { HoverHighlighter } from './hover-highlighter';
 export type { HoverHighlighterProps } from './hover-highlighter';
 
-export { MultiHighlighter } from './multi-highlighter';
-export type { MultiHighlighterProps } from './multi-highlighter';
+export { ChildrenHighlighter } from './children-highlighter';
+export type { ChildrenHighlighterProps } from './children-highlighter';
 
 export { ElementHighlighter } from './element-highlighter';
 export type { ElementHighlighterProps, HighlightTarget, Placement, HighlightClasses } from './element-highlighter';

package/package.json

@@ -1,14 +1,15 @@
 {
   "name": "@teambit/react.ui.component-highlighter",
-  "version": "0.0.493",
+  "version": "0.0.494",
   "homepage": "https://bit.dev/teambit/react/ui/component-highlighter",
   "main": "dist/index.js",
   "componentId": {
     "scope": "teambit.react",
     "name": "ui/component-highlighter",
-    "version": "0.0.493"
+    "version": "0.0.494"
   },
   "dependencies": {
+    "get-xpath": "3.0.1",
     "classnames": "2.2.6",
     "@popperjs/core": "2.6.0",
     "react-popper": "2.2.4",
@@ -16,22 +17,21 @@
     "uuid": "3.4.0",
     "url-join": "4.0.1",
     "@tippyjs/react": "4.2.0",
-    "get-xpath": "3.0.1",
     "core-js": "^3.0.0",
     "@teambit/base-ui.utils.popper-js.ignore-popper-size": "1.0.0",
     "@teambit/base-ui.utils.popper-js.resize-to-match-reference": "1.0.0",
     "@teambit/base-ui.routing.native-link": "1.0.0",
-    "@teambit/component-id": "0.0.389",
-    "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.11",
-    "@teambit/ui-foundation.ui.constants.z-indexes": "0.0.477",
-    "@teambit/react.modules.dom-to-react": "0.0.477",
-    "@teambit/react.ui.hover-selector": "0.0.155",
-    "@teambit/component.modules.component-url": "0.0.110"
+    "@teambit/component-id": "0.0.390",
+    "@teambit/react.ui.highlighter.component-metadata.bit-component-meta": "0.0.12",
+    "@teambit/react.modules.dom-to-react": "0.0.478",
+    "@teambit/ui-foundation.ui.constants.z-indexes": "0.0.478",
+    "@teambit/react.ui.hover-selector": "0.0.156",
+    "@teambit/component.modules.component-url": "0.0.111"
   },
   "devDependencies": {
     "@types/react": "^17.0.8",
-    "@types/classnames": "2.2.11",
     "@testing-library/react": "11.2.6",
+    "@types/classnames": "2.2.11",
     "@types/react-dom": "^17.0.5",
     "@types/uuid": "3.4.9",
     "@types/url-join": "4.0.0",
@@ -43,7 +43,7 @@
     "@teambit/design.ui.icon-button": "1.0.10"
   },
   "peerDependencies": {
-    "@teambit/legacy": "1.0.185",
+    "@teambit/legacy": "1.0.186",
     "react-dom": "^16.8.0 || ^17.0.0",
     "react": "^16.8.0 || ^17.0.0"
   },
@@ -71,7 +71,7 @@
         "react": "-"
       },
       "peerDependencies": {
-        "@teambit/legacy": "1.0.185",
+        "@teambit/legacy": "1.0.186",
         "react-dom": "^16.8.0 || ^17.0.0",
         "react": "^16.8.0 || ^17.0.0"
       }

package/dist/hybrid-highligher/hybrid-highlighter.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"hybrid-highlighter.js","sourceRoot":"","sources":["../../hybrid-highligher/hybrid-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+CAA8F;AAC9F,4DAAoC;AACpC,+BAA0B;AAE1B,4DAA2D;AAC3D,gEAMgC;AAChC,sFAAiF;AAsCjF,kDAAkD;AAClD,SAAgB,iBAAiB,CAAC,EAmBT;QAnBS,EAChC,QAAQ,EACR,IAAI,GAAG,OAAO,EACd,iBAAiB,GAAG,EAAE,EACtB,WAAW,GAAG,IAAI,EAClB,SAAS,EACT,IAAI,EACJ,aAAa,EAEb,OAAO,EACP,cAAc,EACd,SAAS,EACT,KAAK,EACL,OAAO,EACP,YAAY,EACZ,aAAa,EACb,IAAI,EACJ,QAAQ,OAEe,EADpB,IAAI,cAlByB,iNAmBjC,CADQ;IAEP,MAAM,GAAG,GAAG,IAAA,iBAAS,GAAkB,CAAC;IACxC,MAAM,CAAC,OAAO,EAAE,SAAS,CAAC,GAAG,IAAA,gBAAQ,EAAkC,EAAE,CAAC,CAAC;IAC3E,MAAM,UAAU,GAAG,IAAA,cAAM,EAAC,YAAY,IAAA,SAAE,GAAE,EAAE,CAAC,CAAC,OAAO,CAAC;IACtD,MAAM,UAAU,GAAG,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,MAAM,GAAG,CAAC,CAAC;IAEtD,8BAA8B;IAC9B,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,QAAQ;YAAE,SAAS,CAAC,EAAE,CAAC,CAAC;IAC9B,CAAC,EAAE,CAAC,QAAQ,CAAC,CAAC,CAAC;IAEf,MAAM,QAAQ,GAAG,IAAA,uCAAmB,EAClC,CAAC,UAAU,EAAE,EAAE,CAAC,SAAS,CAAC,UAAU,CAAC,CAAC,CAAC,EAAE,cAAc,EAAE,UAAU,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAC3E,IAAI,EACJ;QACE,gBAAgB,EAAE,UAAU,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,CAAC;QACpD,UAAU;QACV,QAAQ,EAAE,QAAQ,IAAI,IAAI,KAAK,OAAO;QACtC,IAAI;QACJ,aAAa;KACd,CACF,CAAC;IAEF,IAAA,2CAAmB,EAAC;QAClB,QAAQ,EAAE,SAAS;QACnB,QAAQ,EAAE,GAAG;QACb,UAAU;QACV,QAAQ,EAAE,QAAQ,IAAI,IAAI,KAAK,aAAa;QAC5C,IAAI;QACJ,aAAa;KACd,CAAC,CAAC;IAEH,MAAM,OAAO,GAAG,IAAA,eAAO,EACrB,GAAG,EAAE,CAAC,iBACJ,yBAAyB,EAAE,OAAO,EAClC,+BAA+B,EAAE,YAAY,EAC7C,gCAAgC,EAAE,aAAa,IAC5C,KAAK,EACR,EACF,CAAC,OAAO,EAAE,YAAY,EAAE,aAAa,EAAE,KAAK,CAAC,CAC9C,CAAC;IAEF,OAAO,CACL,qDACE,GAAG,EAAE,GAAG,IACJ,IAAI,EACJ,QAAQ,IACZ,KAAK,EAAE,OAAO,EACd,SAAS,EAAE,IAAA,oBAAU,EAAC,SAAS,EAAE,UAAU,CAAC;QAG3C,QAAQ;QAKR,MAAM,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,EAAE,CAAC,CAC9C,8BAAC,wCAAkB,IACjB,GAAG,EAAE,GAAG,EACR,MAAM,EAAE,MAAM,EACd,OAAO,EAAE,OAAO,EAChB,KAAK,EAAE,cAAc,EACrB,SAAS,EAAE,SAAS,EACpB,WAAW,EAAE,WAAW,EACxB,IAAI,EAAE,IAAI,GACV,CACH,CAAC,CACE,CACP,CAAC;AACJ,CAAC;AAxFD,8CAwFC"}

package/dist/hybrid-highligher/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../hybrid-highligher/index.ts"],"names":[],"mappings":";;;AAAA,2DAAyD;AAAhD,uHAAA,iBAAiB,OAAA"}

package/dist/multi-highlighter/index.d.ts

@@ -1,2 +0,0 @@
-export { MultiHighlighter } from './multi-highlighter';
-export type { MultiHighlighterProps } from './multi-highlighter';

package/dist/multi-highlighter/index.js

@@ -1,6 +0,0 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.MultiHighlighter = void 0;
-var multi_highlighter_1 = require("./multi-highlighter");
-Object.defineProperty(exports, "MultiHighlighter", { enumerable: true, get: function () { return multi_highlighter_1.MultiHighlighter; } });
-//# sourceMappingURL=index.js.map

package/dist/multi-highlighter/index.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../multi-highlighter/index.ts"],"names":[],"mappings":";;;AAAA,yDAAuD;AAA9C,qHAAA,gBAAgB,OAAA"}

package/dist/multi-highlighter/multi-highlighter.composition.d.ts

@@ -1,5 +0,0 @@
-export declare const MultiHighlighterPreview: () => JSX.Element;
-export declare const MultiHighlighterWithCustomColors: () => JSX.Element;
-export declare const MultiHighlighterInsideIgnore: () => JSX.Element;
-export declare const MultiHighlighterWithRule: () => JSX.Element;
-export declare const MultiHighlighterWithComponentRule: () => JSX.Element;

package/dist/multi-highlighter/multi-highlighter.composition.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"multi-highlighter.composition.js","sourceRoot":"","sources":["../../multi-highlighter/multi-highlighter.composition.tsx"],"names":[],"mappings":";;;;;;AAAA,kDAA0B;AAC1B,sFAAsF;AACtF,oJAA8G;AAC9G,0EAA4D;AAC5D,8DAA2D;AAC3D,2DAAuD;AAEhD,MAAM,uBAAuB,GAAG,GAAG,EAAE;IAC1C,OAAO,CACL,8BAAC,oCAAgB,IAAC,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QACrD,8BAAC,oFAAuB,qBAAqC;QAC7D,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,kCAAU,iDAAoD,CAC9C,CACpB,CAAC;AACJ,CAAC,CAAC;AAVW,QAAA,uBAAuB,2BAUlC;AAEK,MAAM,gCAAgC,GAAG,GAAG,EAAE;IACnD,OAAO,CACL,8BAAC,oCAAgB,IACf,KAAK,EAAE,EAAE,OAAO,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,KAAK,EAAE,QAAQ,EAAE,EACtD,OAAO,EAAC,gBAAgB,EACxB,YAAY,EAAC,MAAM,EACnB,aAAa,EAAC,eAAe;QAE7B,8BAAC,oFAAuB,qBAAqC;QAC7D,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,oFAAuB,oBAAoC,CAC3C,CACpB,CAAC;AACJ,CAAC,CAAC;AAfW,QAAA,gCAAgC,oCAe3C;AAEK,MAAM,4BAA4B,GAAG,GAAG,EAAE;IAC/C,OAAO,CACL,8BAAC,uCAAkB;QACjB,8BAAC,oCAAgB;;YACiC,4CAAO,sBAAsB,CAAQ;YACrF,yCAAM;;YAEN,yCAAM;YACN,yCAAM;YACN,yCAAM;YACN,8BAAC,oFAAuB,qBAAqC;YAC7D,yCAAM;YACN,yCAAM;YACN,yCAAM;YACN,8BAAC,oFAAuB,oBAAoC,CAC3C,CACA,CACtB,CAAC;AACJ,CAAC,CAAC;AAlBW,QAAA,4BAA4B,gCAkBvC;AAEK,MAAM,wBAAwB,GAAG,GAAG,EAAE;IAC3C,OAAO,CACL,8BAAC,oCAAgB,IAAC,IAAI,EAAC,gBAAgB,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QAC9D;;YACkB,iEAA6B,CACzC;QACN,yCAAM;QACN,8BAAC,oFAAuB,yBAAyC;QACjE,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,uCAAK,EAAE,EAAC,aAAa;YACnB,8BAAC,oFAAuB,mCAAmD,CACvE,CACW,CACpB,CAAC;AACJ,CAAC,CAAC;AAhBW,QAAA,wBAAwB,4BAgBnC;AAEK,MAAM,iCAAiC,GAAG,GAAG,EAAE;IACpD,OAAO,CACL,8BAAC,oCAAgB,IAAC,aAAa,EAAC,+BAA+B,EAAC,KAAK,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE;QACtF;;YACoB,gFAA4C,CAC1D;QACN,yCAAM;QACN,8BAAC,oFAAuB,yBAAyC;QACjE,yCAAM;QACN,yCAAM;QACN,yCAAM;QACN,8BAAC,kCAAU,mCAAsC,CAChC,CACpB,CAAC;AACJ,CAAC,CAAC;AAdW,QAAA,iCAAiC,qCAc5C;AAEF,oEAAoE;AACpE,aAAa;AACb,yBAAyB;AACzB,uDAAuD;AACvD,0BAA0B;AAC1B,OAAO;AACP,KAAK"}

package/dist/multi-highlighter/multi-highlighter.d.ts

@@ -1,3 +0,0 @@
-import { HybridHighlighterProps } from '../hybrid-highligher';
-export declare type MultiHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
-export declare function MultiHighlighter({ watchMotion, ...props }: MultiHighlighterProps): JSX.Element;

package/dist/multi-highlighter/multi-highlighter.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"multi-highlighter.js","sourceRoot":"","sources":["../../multi-highlighter/multi-highlighter.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;AAAA,kDAA0B;AAE1B,4DAAiF;AAIjF,SAAgB,gBAAgB,CAAC,EAAwD;QAAxD,EAAE,WAAW,GAAG,KAAK,OAAmC,EAA9B,KAAK,cAA/B,eAAiC,CAAF;IAC9D,OAAO,8BAAC,qCAAiB,oBAAK,KAAK,IAAE,IAAI,EAAE,aAAa,EAAE,WAAW,EAAE,WAAW,IAAI,CAAC;AACzF,CAAC;AAFD,4CAEC"}

package/dist/multi-highlighter/multi-highlighter.spec.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"multi-highlighter.spec.js","sourceRoot":"","sources":["../../multi-highlighter/multi-highlighter.spec.tsx"],"names":[],"mappings":";;;;;AAAA,kDAA0B;AAC1B,kDAAgD;AAChD,mFAA0E;AAE1E,EAAE,CAAC,uDAAuD,EAAE,GAAG,EAAE;IAC/D,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,cAAM,EAAC,8BAAC,uDAAuB,OAAG,CAAC,CAAC;IAE1D,MAAM,QAAQ,GAAG,SAAS,CAAC,YAAY,CAAC,CAAC;IAEzC,MAAM,CAAC,QAAQ,CAAC,CAAC,cAAc,CAAC,WAAW,CAAC,CAAC;AAC/C,CAAC,CAAC,CAAC;AAEH,sFAAsF;AACtF,4EAA4E;AAC5E,oDAAoD;AAEpD,8BAA8B;AAC9B,sDAAsD;AAEtD,qDAAqD;AACrD,sCAAsC;AACtC,MAAM"}

package/dist/multi-highlighter/use-multi-highlighter.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"use-multi-highlighter.js","sourceRoot":"","sources":["../../multi-highlighter/use-multi-highlighter.tsx"],"names":[],"mappings":";;;;;;AAAA,iCAA6C;AAC7C,0DAAiC;AACjC,oFAAiF;AACjF,oJAI6E;AAE7E,8DAAmE;AACnE,kDAAmG;AAenG,SAAgB,mBAAmB,CAAC,EAClC,QAAQ,EACR,QAAQ,EACR,QAAQ,EACR,UAAU,EAAE,aAAa,GAAG,EAAE,EAC9B,IAAI,EACJ,aAAa,GACY;IACzB,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,MAAM,WAAW,GAAoC,EAAE,CAAC;QACxD,MAAM,YAAY,GAAG,QAAQ,CAAC,OAAO,CAAC;QACtC,IAAI,CAAC,YAAY,IAAI,QAAQ;YAAE,OAAO;QAEtC,wCAAwC;QACxC,IAAI,WAAW,GAAG,KAAK,CAAC,IAAI,CAAC,YAAY,CAAC,gBAAgB,CAAc,eAAe,CAAC,IAAI,aAAa,EAAE,CAAC,CAAC,CAAC,CAAC;QAC/G,uBAAuB;QACvB,IAAI,IAAI;YAAE,WAAW,GAAG,WAAW,CAAC,MAAM,CAAC,CAAC,IAAI,EAAE,EAAE,CAAC,IAAA,0BAAW,EAAC,IAAI,EAAE,IAAI,CAAC,CAAC,CAAC;QAC9E,yBAAyB;QACzB,MAAM,YAAY,GAAG,WAAW,CAAC,GAAG,CAAC,0CAAa,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC;QACvE,cAAc;QACd,MAAM,WAAW,GAAG,IAAI,GAAG,CAAC,YAAY,CAAC,CAAC;QAE1C,WAAW,CAAC,OAAO,CAAC,CAAC,OAAO,EAAE,EAAE;YAC9B,IAAI,CAAC,OAAO;gBAAE,OAAO;YACrB,MAAM,KAAK,GAAG,IAAA,wCAAW,EAAC,OAAO,CAAC,CAAC;YACnC,MAAM,kBAAkB,GAAG,KAAK,CAAC,MAAM,CACrC,CAAC,CAAC,EAAE,EAAE,CAAC,IAAA,6EAAgB,EAAC,CAAC,CAAC,IAAI,IAAA,mCAAoB,EAAC,EAAE,IAAI,EAAE,CAAC,CAAC,+EAAkB,CAAC,EAAE,EAAE,aAAa,CAAC,CACrE,CAAC;YAEhC,IAAI,kBAAkB,CAAC,MAAM,GAAG,CAAC;gBAAE,OAAO;YAE1C,MAAM,GAAG,GAAG,IAAA,mBAAQ,EAAC,OAAO,CAAC,CAAC;YAE9B,WAAW,CAAC,GAAG,CAAC,GAAG,EAAE,OAAO,EAAE,UAAU,EAAE,kBAAkB,EAAE,CAAC;QACjE,CAAC,CAAC,CAAC;QAEH,QAAQ,CAAC,WAAW,CAAC,CAAC;IACxB,CAAC,EAAE,CAAC,QAAQ,EAAE,aAAa,CAAC,CAAC,CAAC;AAChC,CAAC;AAtCD,kDAsCC;AAED,SAAS,eAAe;AACtB;;;GAGG;AACH,aAAa,GAAG,QAAQ;IAExB,OAAO,QAAQ,aAAa,IAAI,+CAA0B,KAAK,aAAa,IAAI,+CAA0B,KAAK,CAAC;AAClH,CAAC"}

package/multi-highlighter/index.ts

@@ -1,2 +0,0 @@
-export { MultiHighlighter } from './multi-highlighter';
-export type { MultiHighlighterProps } from './multi-highlighter';

package/multi-highlighter/multi-highlighter.tsx

@@ -1,9 +0,0 @@
-import React from 'react';
-
-import { HybridHighlighter, HybridHighlighterProps } from '../hybrid-highligher';
-
-export type MultiHighlighterProps = Omit<HybridHighlighterProps, 'mode'>;
-
-export function MultiHighlighter({ watchMotion = false, ...props }: MultiHighlighterProps) {
-  return <HybridHighlighter {...props} mode={'allChildren'} watchMotion={watchMotion} />;
-}