@activecollab/components 1.0.283 → 1.0.285

package/dist/cjs/components/AvatarGroup/AvatarGroup.js

@@ -5,11 +5,14 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.AvatarGroup = void 0;
+var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _react = _interopRequireWildcard(require("react"));
 var _Typography = require("../Typography/Typography");
 var _Styles = require("./Styles");
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
@@ -17,7 +20,8 @@ var AvatarGroup = function AvatarGroup(_ref) {
   var limit = _ref.limit,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 34 : _ref$size,
-    children = _ref.children;
+    children = _ref.children,
+    counterProps = _ref.counterProps;
   var _children = _react.Children.toArray(children).slice(0, limit);
   var handleVariant = (0, _react.useMemo)(function () {
     if (size >= 34) return "Caption 1";
@@ -32,15 +36,20 @@ var AvatarGroup = function AvatarGroup(_ref) {
         outline: "1px solid var(--page-paper-main)"
       }
     }));
-  }), limit >= _react.Children.count(children) ? null : /*#__PURE__*/_react.default.createElement(_Styles.LengthCountStyles, {
+  }), limit >= _react.Children.count(children) ? null : /*#__PURE__*/_react.default.createElement(_StyledLengthCountStyles, _extends({
     size: size,
-    style: {
-      marginInlineStart: "-8px"
-    }
-  }, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
+    role: "status",
+    "aria-label": "Rest of the users"
+  }, counterProps), /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     variant: handleVariant,
     weight: "medium"
   }, "+", _react.Children.count(children) - limit)));
 };
 exports.AvatarGroup = AvatarGroup;
+var _StyledLengthCountStyles = (0, _styledComponents.default)(_Styles.LengthCountStyles).withConfig({
+  displayName: "AvatarGroup___StyledLengthCountStyles",
+  componentId: "sc-1rsx1j5-0"
+})({
+  marginInlineStart: "-8px"
+});
 //# sourceMappingURL=AvatarGroup.js.map

package/dist/cjs/components/AvatarGroup/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","limit","size","children","_children","Children","toArray","slice","handleVariant","useMemo","map","child","item","cloneElement","props","style","marginInlineStart","outline","count"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n  Children,\n  cloneElement,\n  PropsWithChildren,\n  ReactElement,\n  useMemo,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n  limit: number;\n  size?: number;\n}\n\nexport const AvatarGroup = ({\n  limit,\n  size = 34,\n  children,\n}: PropsWithChildren<AvatarGroupsProps>) => {\n  const _children = Children.toArray(children).slice(0, limit);\n\n  const handleVariant = useMemo(() => {\n    if (size >= 34) return \"Caption 1\";\n    return \"Caption 2\";\n  }, [size]);\n\n  return (\n    <AvatarGroupsStyles>\n      {_children.map((child) => {\n        const item = child as ReactElement<AvatarProps>;\n\n        return cloneElement(item, {\n          ...item.props,\n          size: size,\n          style: {\n            marginInlineStart: \"-8px\",\n            outline: \"1px solid var(--page-paper-main)\",\n          },\n        });\n      })}\n\n      {limit >= Children.count(children) ? null : (\n        <LengthCountStyles size={size} style={{ marginInlineStart: \"-8px\" }}>\n          <Typography variant={handleVariant} weight=\"medium\">\n            +{Children.count(children) - limit}\n          </Typography>\n        </LengthCountStyles>\n      )}\n    </AvatarGroupsStyles>\n  );\n};\n"],"mappings":";;;;;;;AAAA;AAQA;AACA;AAAiE;AAAA;AAAA;AAAA;AAAA;AAO1D,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAIoB;EAAA,IAH1CC,KAAK,QAALA,KAAK;IAAA,iBACLC,IAAI;IAAJA,IAAI,0BAAG,EAAE;IACTC,QAAQ,QAARA,QAAQ;EAER,IAAMC,SAAS,GAAGC,eAAQ,CAACC,OAAO,CAACH,QAAQ,CAAC,CAACI,KAAK,CAAC,CAAC,EAAEN,KAAK,CAAC;EAE5D,IAAMO,aAAa,GAAG,IAAAC,cAAO,EAAC,YAAM;IAClC,IAAIP,IAAI,IAAI,EAAE,EAAE,OAAO,WAAW;IAClC,OAAO,WAAW;EACpB,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACE,6BAAC,0BAAkB,QAChBE,SAAS,CAACM,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAO,IAAAE,mBAAY,EAACD,IAAI,kCACnBA,IAAI,CAACE,KAAK;MACbZ,IAAI,EAAEA,IAAI;MACVa,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDhB,KAAK,IAAII,eAAQ,CAACa,KAAK,CAACf,QAAQ,CAAC,GAAG,IAAI,gBACvC,6BAAC,yBAAiB;IAAC,IAAI,EAAED,IAAK;IAAC,KAAK,EAAE;MAAEc,iBAAiB,EAAE;IAAO;EAAE,gBAClE,6BAAC,sBAAU;IAAC,OAAO,EAAER,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/CH,eAAQ,CAACa,KAAK,CAACf,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC;AAAC"}
+{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","limit","size","children","counterProps","_children","Children","toArray","slice","handleVariant","useMemo","map","child","item","cloneElement","props","style","marginInlineStart","outline","count"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n  Children,\n  cloneElement,\n  HTMLAttributes,\n  PropsWithChildren,\n  ReactElement,\n  useMemo,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n  limit: number;\n  size?: number;\n  counterProps?: HTMLAttributes<HTMLDivElement> & {\n    [dataAttibute: `data-${string}`]: string;\n  };\n}\n\nexport const AvatarGroup = ({\n  limit,\n  size = 34,\n  children,\n  counterProps,\n}: PropsWithChildren<AvatarGroupsProps>) => {\n  const _children = Children.toArray(children).slice(0, limit);\n\n  const handleVariant = useMemo(() => {\n    if (size >= 34) return \"Caption 1\";\n    return \"Caption 2\";\n  }, [size]);\n\n  return (\n    <AvatarGroupsStyles>\n      {_children.map((child) => {\n        const item = child as ReactElement<AvatarProps>;\n\n        return cloneElement(item, {\n          ...item.props,\n          size: size,\n          style: {\n            marginInlineStart: \"-8px\",\n            outline: \"1px solid var(--page-paper-main)\",\n          },\n        });\n      })}\n\n      {limit >= Children.count(children) ? null : (\n        <LengthCountStyles\n          size={size}\n          role=\"status\"\n          aria-label=\"Rest of the users\"\n          css={{ marginInlineStart: \"-8px\" }}\n          {...counterProps}\n        >\n          <Typography variant={handleVariant} weight=\"medium\">\n            +{Children.count(children) - limit}\n          </Typography>\n        </LengthCountStyles>\n      )}\n    </AvatarGroupsStyles>\n  );\n};\n"],"mappings":";;;;;;;;AAAA;AASA;AACA;AAAiE;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAU1D,IAAMA,WAAW,GAAG,SAAdA,WAAW,OAKoB;EAAA,IAJ1CC,KAAK,QAALA,KAAK;IAAA,iBACLC,IAAI;IAAJA,IAAI,0BAAG,EAAE;IACTC,QAAQ,QAARA,QAAQ;IACRC,YAAY,QAAZA,YAAY;EAEZ,IAAMC,SAAS,GAAGC,eAAQ,CAACC,OAAO,CAACJ,QAAQ,CAAC,CAACK,KAAK,CAAC,CAAC,EAAEP,KAAK,CAAC;EAE5D,IAAMQ,aAAa,GAAG,IAAAC,cAAO,EAAC,YAAM;IAClC,IAAIR,IAAI,IAAI,EAAE,EAAE,OAAO,WAAW;IAClC,OAAO,WAAW;EACpB,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACE,6BAAC,0BAAkB,QAChBG,SAAS,CAACM,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAO,IAAAE,mBAAY,EAACD,IAAI,kCACnBA,IAAI,CAACE,KAAK;MACbb,IAAI,EAAEA,IAAI;MACVc,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDjB,KAAK,IAAIK,eAAQ,CAACa,KAAK,CAAChB,QAAQ,CAAC,GAAG,IAAI,gBACvC;IACE,IAAI,EAAED,IAAK;IACX,IAAI,EAAC,QAAQ;IACb,cAAW;EAAmB,GAE1BE,YAAY,gBAEhB,6BAAC,sBAAU;IAAC,OAAO,EAAEK,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/CH,eAAQ,CAACa,KAAK,CAAChB,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA,GAVa;EAAEgB,iBAAiB,EAAE;AAAO,CAAC"}

package/dist/cjs/utils/findHighlightedSearch.js

@@ -10,7 +10,8 @@ var findHighlightedSearch = function findHighlightedSearch(searchValue, target)
     var parser = new DOMParser();
     var doc = parser.parseFromString(purifiedTarget, "text/html");
     var text = doc.body.textContent || "";
-    var regex = new RegExp("(".concat(searchValue, ")"), "gi");
+    var checkValidSearchChars = searchValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    var regex = new RegExp("(".concat(checkValidSearchChars, ")"), "gi");
     return text.replace(regex, "<mark>$1</mark>");
   }
   return "";

package/dist/cjs/utils/findHighlightedSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"findHighlightedSearch.js","names":["findHighlightedSearch","searchValue","target","purifiedTarget","replace","parser","DOMParser","doc","parseFromString","text","body","textContent","regex","RegExp"],"sources":["../../../src/utils/findHighlightedSearch.ts"],"sourcesContent":["export const findHighlightedSearch = (searchValue: string, target: string) => {\n  if (searchValue && target) {\n    const purifiedTarget = target?.replace(/<script.*?>.*?<\\/script>/gi, \"\");\n    const parser = new DOMParser();\n\n    const doc = parser.parseFromString(purifiedTarget, \"text/html\");\n    const text = doc.body.textContent || \"\";\n\n    const regex = new RegExp(`(${searchValue})`, \"gi\");\n\n    return text.replace(regex, \"<mark>$1</mark>\");\n  }\n\n  return \"\";\n};\n"],"mappings":";;;;;;AAAO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIC,WAAmB,EAAEC,MAAc,EAAK;EAC5E,IAAID,WAAW,IAAIC,MAAM,EAAE;IACzB,IAAMC,cAAc,GAAGD,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEE,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC;IACxE,IAAMC,MAAM,GAAG,IAAIC,SAAS,EAAE;IAE9B,IAAMC,GAAG,GAAGF,MAAM,CAACG,eAAe,CAACL,cAAc,EAAE,WAAW,CAAC;IAC/D,IAAMM,IAAI,GAAGF,GAAG,CAACG,IAAI,CAACC,WAAW,IAAI,EAAE;IAEvC,IAAMC,KAAK,GAAG,IAAIC,MAAM,YAAKZ,WAAW,QAAK,IAAI,CAAC;IAElD,OAAOQ,IAAI,CAACL,OAAO,CAACQ,KAAK,EAAE,iBAAiB,CAAC;EAC/C;EAEA,OAAO,EAAE;AACX,CAAC;AAAC"}
+{"version":3,"file":"findHighlightedSearch.js","names":["findHighlightedSearch","searchValue","target","purifiedTarget","replace","parser","DOMParser","doc","parseFromString","text","body","textContent","checkValidSearchChars","regex","RegExp"],"sources":["../../../src/utils/findHighlightedSearch.ts"],"sourcesContent":["export const findHighlightedSearch = (searchValue: string, target: string) => {\n  if (searchValue && target) {\n    const purifiedTarget = target?.replace(/<script.*?>.*?<\\/script>/gi, \"\");\n    const parser = new DOMParser();\n\n    const doc = parser.parseFromString(purifiedTarget, \"text/html\");\n    const text = doc.body.textContent || \"\";\n    const checkValidSearchChars = searchValue.replace(\n      /[.*+?^${}()|[\\]\\\\]/g,\n      \"\\\\$&\"\n    );\n    const regex = new RegExp(`(${checkValidSearchChars})`, \"gi\");\n\n    return text.replace(regex, \"<mark>$1</mark>\");\n  }\n\n  return \"\";\n};\n"],"mappings":";;;;;;AAAO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIC,WAAmB,EAAEC,MAAc,EAAK;EAC5E,IAAID,WAAW,IAAIC,MAAM,EAAE;IACzB,IAAMC,cAAc,GAAGD,MAAM,aAANA,MAAM,uBAANA,MAAM,CAAEE,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC;IACxE,IAAMC,MAAM,GAAG,IAAIC,SAAS,EAAE;IAE9B,IAAMC,GAAG,GAAGF,MAAM,CAACG,eAAe,CAACL,cAAc,EAAE,WAAW,CAAC;IAC/D,IAAMM,IAAI,GAAGF,GAAG,CAACG,IAAI,CAACC,WAAW,IAAI,EAAE;IACvC,IAAMC,qBAAqB,GAAGX,WAAW,CAACG,OAAO,CAC/C,qBAAqB,EACrB,MAAM,CACP;IACD,IAAMS,KAAK,GAAG,IAAIC,MAAM,YAAKF,qBAAqB,QAAK,IAAI,CAAC;IAE5D,OAAOH,IAAI,CAACL,OAAO,CAACS,KAAK,EAAE,iBAAiB,CAAC;EAC/C;EAEA,OAAO,EAAE;AACX,CAAC;AAAC"}

package/dist/esm/components/AvatarGroup/AvatarGroup.d.ts

@@ -1,7 +1,10 @@
-import { PropsWithChildren } from "react";
+import { HTMLAttributes, PropsWithChildren } from "react";
 export interface AvatarGroupsProps {
     limit: number;
     size?: number;
+    counterProps?: HTMLAttributes<HTMLDivElement> & {
+        [dataAttibute: `data-${string}`]: string;
+    };
 }
-export declare const AvatarGroup: ({ limit, size, children, }: PropsWithChildren<AvatarGroupsProps>) => JSX.Element;
+export declare const AvatarGroup: ({ limit, size, children, counterProps, }: PropsWithChildren<AvatarGroupsProps>) => JSX.Element;
 //# sourceMappingURL=AvatarGroup.d.ts.map

package/dist/esm/components/AvatarGroup/AvatarGroup.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAc,EAGZ,iBAAiB,EAGlB,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;CACf;AAED,eAAO,MAAM,WAAW,+BAIrB,kBAAkB,iBAAiB,CAAC,gBAgCtC,CAAC"}
+{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAc,EAGZ,cAAc,EACd,iBAAiB,EAGlB,MAAM,OAAO,CAAC;AAKf,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,YAAY,CAAC,EAAE,cAAc,CAAC,cAAc,CAAC,GAAG;QAC9C,CAAC,YAAY,EAAE,QAAQ,MAAM,EAAE,GAAG,MAAM,CAAC;KAC1C,CAAC;CACH;AAED,eAAO,MAAM,WAAW,6CAKrB,kBAAkB,iBAAiB,CAAC,gBAsCtC,CAAC"}

package/dist/esm/components/AvatarGroup/AvatarGroup.js

@@ -1,4 +1,5 @@
 import _extends from "@babel/runtime/helpers/esm/extends";
+import _styled from "styled-components";
 import React, { Children, cloneElement, useMemo } from "react";
 import { Typography } from "../Typography/Typography";
 import { AvatarGroupsStyles, LengthCountStyles } from "./Styles";
@@ -6,7 +7,8 @@ export var AvatarGroup = function AvatarGroup(_ref) {
   var limit = _ref.limit,
     _ref$size = _ref.size,
     size = _ref$size === void 0 ? 34 : _ref$size,
-    children = _ref.children;
+    children = _ref.children,
+    counterProps = _ref.counterProps;
   var _children = Children.toArray(children).slice(0, limit);
   var handleVariant = useMemo(function () {
     if (size >= 34) return "Caption 1";
@@ -21,14 +23,19 @@ export var AvatarGroup = function AvatarGroup(_ref) {
         outline: "1px solid var(--page-paper-main)"
       }
     }));
-  }), limit >= Children.count(children) ? null : /*#__PURE__*/React.createElement(LengthCountStyles, {
+  }), limit >= Children.count(children) ? null : /*#__PURE__*/React.createElement(_StyledLengthCountStyles, _extends({
     size: size,
-    style: {
-      marginInlineStart: "-8px"
-    }
-  }, /*#__PURE__*/React.createElement(Typography, {
+    role: "status",
+    "aria-label": "Rest of the users"
+  }, counterProps), /*#__PURE__*/React.createElement(Typography, {
     variant: handleVariant,
     weight: "medium"
   }, "+", Children.count(children) - limit)));
 };
+var _StyledLengthCountStyles = _styled(LengthCountStyles).withConfig({
+  displayName: "AvatarGroup___StyledLengthCountStyles",
+  componentId: "sc-1rsx1j5-0"
+})({
+  marginInlineStart: "-8px"
+});
 //# sourceMappingURL=AvatarGroup.js.map

package/dist/esm/components/AvatarGroup/AvatarGroup.js.map

@@ -1 +1 @@
-{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","useMemo","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","limit","size","children","_children","toArray","slice","handleVariant","map","child","item","props","style","marginInlineStart","outline","count"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n  Children,\n  cloneElement,\n  PropsWithChildren,\n  ReactElement,\n  useMemo,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n  limit: number;\n  size?: number;\n}\n\nexport const AvatarGroup = ({\n  limit,\n  size = 34,\n  children,\n}: PropsWithChildren<AvatarGroupsProps>) => {\n  const _children = Children.toArray(children).slice(0, limit);\n\n  const handleVariant = useMemo(() => {\n    if (size >= 34) return \"Caption 1\";\n    return \"Caption 2\";\n  }, [size]);\n\n  return (\n    <AvatarGroupsStyles>\n      {_children.map((child) => {\n        const item = child as ReactElement<AvatarProps>;\n\n        return cloneElement(item, {\n          ...item.props,\n          size: size,\n          style: {\n            marginInlineStart: \"-8px\",\n            outline: \"1px solid var(--page-paper-main)\",\n          },\n        });\n      })}\n\n      {limit >= Children.count(children) ? null : (\n        <LengthCountStyles size={size} style={{ marginInlineStart: \"-8px\" }}>\n          <Typography variant={handleVariant} weight=\"medium\">\n            +{Children.count(children) - limit}\n          </Typography>\n        </LengthCountStyles>\n      )}\n    </AvatarGroupsStyles>\n  );\n};\n"],"mappings":";AAAA,OAAOA,KAAK,IACVC,QAAQ,EACRC,YAAY,EAGZC,OAAO,QACF,OAAO;AAEd,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SAASC,kBAAkB,EAAEC,iBAAiB,QAAQ,UAAU;AAOhE,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAIoB;EAAA,IAH1CC,KAAK,QAALA,KAAK;IAAA,iBACLC,IAAI;IAAJA,IAAI,0BAAG,EAAE;IACTC,QAAQ,QAARA,QAAQ;EAER,IAAMC,SAAS,GAAGV,QAAQ,CAACW,OAAO,CAACF,QAAQ,CAAC,CAACG,KAAK,CAAC,CAAC,EAAEL,KAAK,CAAC;EAE5D,IAAMM,aAAa,GAAGX,OAAO,CAAC,YAAM;IAClC,IAAIM,IAAI,IAAI,EAAE,EAAE,OAAO,WAAW;IAClC,OAAO,WAAW;EACpB,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACE,oBAAC,kBAAkB,QAChBE,SAAS,CAACI,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAOd,YAAY,CAACe,IAAI,eACnBA,IAAI,CAACC,KAAK;MACbT,IAAI,EAAEA,IAAI;MACVU,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDb,KAAK,IAAIP,QAAQ,CAACqB,KAAK,CAACZ,QAAQ,CAAC,GAAG,IAAI,gBACvC,oBAAC,iBAAiB;IAAC,IAAI,EAAED,IAAK;IAAC,KAAK,EAAE;MAAEW,iBAAiB,EAAE;IAAO;EAAE,gBAClE,oBAAC,UAAU;IAAC,OAAO,EAAEN,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/Cb,QAAQ,CAACqB,KAAK,CAACZ,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC"}
+{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","useMemo","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","limit","size","children","counterProps","_children","toArray","slice","handleVariant","map","child","item","props","style","marginInlineStart","outline","count"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n  Children,\n  cloneElement,\n  HTMLAttributes,\n  PropsWithChildren,\n  ReactElement,\n  useMemo,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n  limit: number;\n  size?: number;\n  counterProps?: HTMLAttributes<HTMLDivElement> & {\n    [dataAttibute: `data-${string}`]: string;\n  };\n}\n\nexport const AvatarGroup = ({\n  limit,\n  size = 34,\n  children,\n  counterProps,\n}: PropsWithChildren<AvatarGroupsProps>) => {\n  const _children = Children.toArray(children).slice(0, limit);\n\n  const handleVariant = useMemo(() => {\n    if (size >= 34) return \"Caption 1\";\n    return \"Caption 2\";\n  }, [size]);\n\n  return (\n    <AvatarGroupsStyles>\n      {_children.map((child) => {\n        const item = child as ReactElement<AvatarProps>;\n\n        return cloneElement(item, {\n          ...item.props,\n          size: size,\n          style: {\n            marginInlineStart: \"-8px\",\n            outline: \"1px solid var(--page-paper-main)\",\n          },\n        });\n      })}\n\n      {limit >= Children.count(children) ? null : (\n        <LengthCountStyles\n          size={size}\n          role=\"status\"\n          aria-label=\"Rest of the users\"\n          css={{ marginInlineStart: \"-8px\" }}\n          {...counterProps}\n        >\n          <Typography variant={handleVariant} weight=\"medium\">\n            +{Children.count(children) - limit}\n          </Typography>\n        </LengthCountStyles>\n      )}\n    </AvatarGroupsStyles>\n  );\n};\n"],"mappings":";;AAAA,OAAOA,KAAK,IACVC,QAAQ,EACRC,YAAY,EAIZC,OAAO,QACF,OAAO;AAEd,SAASC,UAAU,QAAQ,0BAA0B;AACrD,SAASC,kBAAkB,EAAEC,iBAAiB,QAAQ,UAAU;AAUhE,OAAO,IAAMC,WAAW,GAAG,SAAdA,WAAW,OAKoB;EAAA,IAJ1CC,KAAK,QAALA,KAAK;IAAA,iBACLC,IAAI;IAAJA,IAAI,0BAAG,EAAE;IACTC,QAAQ,QAARA,QAAQ;IACRC,YAAY,QAAZA,YAAY;EAEZ,IAAMC,SAAS,GAAGX,QAAQ,CAACY,OAAO,CAACH,QAAQ,CAAC,CAACI,KAAK,CAAC,CAAC,EAAEN,KAAK,CAAC;EAE5D,IAAMO,aAAa,GAAGZ,OAAO,CAAC,YAAM;IAClC,IAAIM,IAAI,IAAI,EAAE,EAAE,OAAO,WAAW;IAClC,OAAO,WAAW;EACpB,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACE,oBAAC,kBAAkB,QAChBG,SAAS,CAACI,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAOf,YAAY,CAACgB,IAAI,eACnBA,IAAI,CAACC,KAAK;MACbV,IAAI,EAAEA,IAAI;MACVW,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDd,KAAK,IAAIP,QAAQ,CAACsB,KAAK,CAACb,QAAQ,CAAC,GAAG,IAAI,gBACvC;IACE,IAAI,EAAED,IAAK;IACX,IAAI,EAAC,QAAQ;IACb,cAAW;EAAmB,GAE1BE,YAAY,gBAEhB,oBAAC,UAAU;IAAC,OAAO,EAAEI,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/Cd,QAAQ,CAACsB,KAAK,CAACb,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC;AAAC;EAAA;EAAA;AAAA,GAVa;EAAEa,iBAAiB,EAAE;AAAO,CAAC"}

package/dist/esm/utils/findHighlightedSearch.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"findHighlightedSearch.d.ts","sourceRoot":"","sources":["../../../src/utils/findHighlightedSearch.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,qBAAqB,gBAAiB,MAAM,UAAU,MAAM,WAcxE,CAAC"}
+{"version":3,"file":"findHighlightedSearch.d.ts","sourceRoot":"","sources":["../../../src/utils/findHighlightedSearch.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,qBAAqB,gBAAiB,MAAM,UAAU,MAAM,WAiBxE,CAAC"}

package/dist/esm/utils/findHighlightedSearch.js

@@ -4,7 +4,8 @@ export var findHighlightedSearch = function findHighlightedSearch(searchValue, t
     var parser = new DOMParser();
     var doc = parser.parseFromString(purifiedTarget, "text/html");
     var text = doc.body.textContent || "";
-    var regex = new RegExp("(" + searchValue + ")", "gi");
+    var checkValidSearchChars = searchValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+    var regex = new RegExp("(" + checkValidSearchChars + ")", "gi");
     return text.replace(regex, "<mark>$1</mark>");
   }
   return "";

package/dist/esm/utils/findHighlightedSearch.js.map

@@ -1 +1 @@
-{"version":3,"file":"findHighlightedSearch.js","names":["findHighlightedSearch","searchValue","target","purifiedTarget","replace","parser","DOMParser","doc","parseFromString","text","body","textContent","regex","RegExp"],"sources":["../../../src/utils/findHighlightedSearch.ts"],"sourcesContent":["export const findHighlightedSearch = (searchValue: string, target: string) => {\n  if (searchValue && target) {\n    const purifiedTarget = target?.replace(/<script.*?>.*?<\\/script>/gi, \"\");\n    const parser = new DOMParser();\n\n    const doc = parser.parseFromString(purifiedTarget, \"text/html\");\n    const text = doc.body.textContent || \"\";\n\n    const regex = new RegExp(`(${searchValue})`, \"gi\");\n\n    return text.replace(regex, \"<mark>$1</mark>\");\n  }\n\n  return \"\";\n};\n"],"mappings":"AAAA,OAAO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIC,WAAmB,EAAEC,MAAc,EAAK;EAC5E,IAAID,WAAW,IAAIC,MAAM,EAAE;IACzB,IAAMC,cAAc,GAAGD,MAAM,oBAANA,MAAM,CAAEE,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC;IACxE,IAAMC,MAAM,GAAG,IAAIC,SAAS,EAAE;IAE9B,IAAMC,GAAG,GAAGF,MAAM,CAACG,eAAe,CAACL,cAAc,EAAE,WAAW,CAAC;IAC/D,IAAMM,IAAI,GAAGF,GAAG,CAACG,IAAI,CAACC,WAAW,IAAI,EAAE;IAEvC,IAAMC,KAAK,GAAG,IAAIC,MAAM,OAAKZ,WAAW,QAAK,IAAI,CAAC;IAElD,OAAOQ,IAAI,CAACL,OAAO,CAACQ,KAAK,EAAE,iBAAiB,CAAC;EAC/C;EAEA,OAAO,EAAE;AACX,CAAC"}
+{"version":3,"file":"findHighlightedSearch.js","names":["findHighlightedSearch","searchValue","target","purifiedTarget","replace","parser","DOMParser","doc","parseFromString","text","body","textContent","checkValidSearchChars","regex","RegExp"],"sources":["../../../src/utils/findHighlightedSearch.ts"],"sourcesContent":["export const findHighlightedSearch = (searchValue: string, target: string) => {\n  if (searchValue && target) {\n    const purifiedTarget = target?.replace(/<script.*?>.*?<\\/script>/gi, \"\");\n    const parser = new DOMParser();\n\n    const doc = parser.parseFromString(purifiedTarget, \"text/html\");\n    const text = doc.body.textContent || \"\";\n    const checkValidSearchChars = searchValue.replace(\n      /[.*+?^${}()|[\\]\\\\]/g,\n      \"\\\\$&\"\n    );\n    const regex = new RegExp(`(${checkValidSearchChars})`, \"gi\");\n\n    return text.replace(regex, \"<mark>$1</mark>\");\n  }\n\n  return \"\";\n};\n"],"mappings":"AAAA,OAAO,IAAMA,qBAAqB,GAAG,SAAxBA,qBAAqB,CAAIC,WAAmB,EAAEC,MAAc,EAAK;EAC5E,IAAID,WAAW,IAAIC,MAAM,EAAE;IACzB,IAAMC,cAAc,GAAGD,MAAM,oBAANA,MAAM,CAAEE,OAAO,CAAC,4BAA4B,EAAE,EAAE,CAAC;IACxE,IAAMC,MAAM,GAAG,IAAIC,SAAS,EAAE;IAE9B,IAAMC,GAAG,GAAGF,MAAM,CAACG,eAAe,CAACL,cAAc,EAAE,WAAW,CAAC;IAC/D,IAAMM,IAAI,GAAGF,GAAG,CAACG,IAAI,CAACC,WAAW,IAAI,EAAE;IACvC,IAAMC,qBAAqB,GAAGX,WAAW,CAACG,OAAO,CAC/C,qBAAqB,EACrB,MAAM,CACP;IACD,IAAMS,KAAK,GAAG,IAAIC,MAAM,OAAKF,qBAAqB,QAAK,IAAI,CAAC;IAE5D,OAAOH,IAAI,CAACL,OAAO,CAACS,KAAK,EAAE,iBAAiB,CAAC;EAC/C;EAEA,OAAO,EAAE;AACX,CAAC"}

package/dist/index.js

@@ -15968,7 +15968,8 @@
     var limit = _ref.limit,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? 34 : _ref$size,
-      children = _ref.children;
+      children = _ref.children,
+      counterProps = _ref.counterProps;
     var _children = React.Children.toArray(children).slice(0, limit);
     var handleVariant = React.useMemo(function () {
       if (size >= 34) return "Caption 1";
@@ -15983,16 +15984,21 @@
           outline: "1px solid var(--page-paper-main)"
         }
       }));
-    }), limit >= React.Children.count(children) ? null : /*#__PURE__*/React__default["default"].createElement(LengthCountStyles, {
+    }), limit >= React.Children.count(children) ? null : /*#__PURE__*/React__default["default"].createElement(_StyledLengthCountStyles, _extends({
       size: size,
-      style: {
-        marginInlineStart: "-8px"
-      }
-    }, /*#__PURE__*/React__default["default"].createElement(Typography, {
+      role: "status",
+      "aria-label": "Rest of the users"
+    }, counterProps), /*#__PURE__*/React__default["default"].createElement(Typography, {
       variant: handleVariant,
       weight: "medium"
     }, "+", React.Children.count(children) - limit)));
   };
+  var _StyledLengthCountStyles = styled__default["default"](LengthCountStyles).withConfig({
+    displayName: "AvatarGroup___StyledLengthCountStyles",
+    componentId: "sc-1rsx1j5-0"
+  })({
+    marginInlineStart: "-8px"
+  });
 
   var StyledCommandPalette = styled__default["default"].div.withConfig({
     displayName: "CommandPalettestyles__StyledCommandPalette",
@@ -16259,7 +16265,8 @@
       var parser = new DOMParser();
       var doc = parser.parseFromString(purifiedTarget, "text/html");
       var text = doc.body.textContent || "";
-      var regex = new RegExp("(".concat(searchValue, ")"), "gi");
+      var checkValidSearchChars = searchValue.replace(/[.*+?^${}()|[\]\\]/g, "\\$&");
+      var regex = new RegExp("(".concat(checkValidSearchChars, ")"), "gi");
       return text.replace(regex, "<mark>$1</mark>");
     }
     return "";