npm - @activecollab/components - Versions diffs - 1.0.282 → 1.0.284 - Mend

@activecollab/components 1.0.282 → 1.0.284

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 (16) hide show

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

@@ -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 CHANGED Viewed

	@@ -1 +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"}
1	+ {"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/components/CommandPalette/CommandPalette.js CHANGED Viewed

@@ -176,7 +176,7 @@ _CommandPalette.displayName = "CommandPalette";
 var CommandPalette = Object.assign({}, _CommandPalette, {
   List: _CommandPaletteList.CommandPaletteList,
   Item: _CommandPaletteItem.CommandPaletteItem,
-  CommandItem: _CommandPaletteItem.CommandPaletteItem
+  CommandItem: _CommandPaletteCommandItem.CommandPaletteCommandItem
 });
 exports.CommandPalette = CommandPalette;
 //# sourceMappingURL=CommandPalette.js.map

package/dist/cjs/components/CommandPalette/CommandPalette.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPalette.js","names":["_CommandPalette","forwardRef","ref","children","onChangeSearch","search","mode","setMode","loading","rest","useState","selected","setSelected","listWrapperRef","useRef","handleChange","e","target","value","scrollToTop","current","scrollTo","top","behavior","scrollToBottom","scrollHeight","filterChildren","useMemo","itemsLength","commandsLength","items","deepMap","child","item","clonedElement","type","CommandPaletteList","cloneElement","props","CommandPaletteCommandItem","index","CommandPaletteItem","handleChangeSelected","direction","document","querySelectorAll","newIndex","newItem","forEach","_","i","length","scrollIntoView","block","key","preventDefault","displayName","CommandPalette","Object","assign","List","Item","CommandItem"],"sources":["../../../../src/components/CommandPalette/CommandPalette.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n cloneElement,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\nimport {\n StyledCommandPalette,\n StyledCommandPaletteWrapper,\n} from \"./CommandPalette.styles\";\nimport { CommandPaletteCommandItem } from \"./CommandPaletteCommandItem\";\nimport { CommandPaletteHeader } from \"./CommandPaletteHeader\";\nimport {\n CommandPaletteItem,\n CommandPaletteItemProps,\n} from \"./CommandPaletteItem\";\nimport { CommandPaletteList } from \"./CommandPaletteList\";\n\nimport {\n ModeContextProvider,\n SelectedContextProvider,\n SearchContextProvider,\n} from \"./context\";\n\nimport { deepMap } from \"../../utils/deepChildrenMap\";\n\nexport interface CommandPaletteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const _CommandPalette = forwardRef<\n HTMLDivElement,\n PropsWithChildren<CommandPaletteProps>\n>(\n (\n { children, onChangeSearch, search, mode, setMode, loading, ...rest },\n ref\n ) => {\n const [selected, setSelected] = useState<number>(0);\n const listWrapperRef = useRef<HTMLDivElement>(null);\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n const scrollToTop = () => {\n listWrapperRef.current?.scrollTo({ top: 0, behavior: \"smooth\" });\n };\n\n const scrollToBottom = () => {\n listWrapperRef.current?.scrollTo({\n top: listWrapperRef.current.scrollHeight,\n behavior: \"smooth\",\n });\n };\n\n const filterChildren = useMemo(() => {\n let itemsLength = 0;\n let commandsLength = 0;\n\n const items = deepMap(children, (child) => {\n const item = child as ReactElement<CommandPaletteItemProps>;\n let clonedElement;\n\n if (item && item.type === CommandPaletteList) {\n clonedElement = cloneElement(item, {\n ...item.props,\n });\n }\n\n if (item && item.type === CommandPaletteCommandItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n commandsLength++;\n }\n\n if (item && item.type === CommandPaletteItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n }\n\n return clonedElement;\n });\n\n return { items, itemsLength, commandsLength };\n }, [children, selected]);\n\n const handleChangeSelected = (direction?: \"up\" \| \"down\") => {\n const items = document.querySelectorAll(\".cp-item\");\n\n let index = 0;\n let newIndex = 0;\n let newItem: Element \| null = null;\n\n if (direction === \"down\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = index === items.length - 1 ? 0 : index + 1;\n } else if (direction === \"up\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = !index ? items.length - 1 : index - 1;\n } else {\n setSelected(0);\n }\n\n newItem = items[newIndex];\n\n if (newItem && typeof newIndex === \"number\") {\n setSelected(newIndex);\n\n newItem.scrollIntoView({\n behavior: \"smooth\",\n block: newIndex ? \"center\" : \"end\",\n });\n }\n };\n\n return (\n <Dialog {...rest} ref={ref}>\n <SearchContextProvider value={{ search, onChangeSearch }}>\n <SelectedContextProvider value={{ selected: selected, setSelected }}>\n <StyledCommandPalette\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n handleChangeSelected(\"down\");\n }\n\n if (e.key === \"ArrowUp\") {\n e.preventDefault();\n handleChangeSelected(\"up\");\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n scrollToBottom();\n setSelected(filterChildren.itemsLength - 1);\n }\n\n if (e.key === \"Home\") {\n e.preventDefault();\n scrollToTop();\n setSelected(0);\n }\n }}\n >\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPaletteHeader\n handleChange={handleChange}\n commandsLength={filterChildren.commandsLength}\n itemsLength={filterChildren.itemsLength}\n loading={loading}\n />\n </ModeContextProvider>\n\n <StyledCommandPaletteWrapper ref={listWrapperRef}>\n {filterChildren.items}\n </StyledCommandPaletteWrapper>\n </StyledCommandPalette>\n </SelectedContextProvider>\n </SearchContextProvider>\n </Dialog>\n );\n }\n);\n\n_CommandPalette.displayName = \"CommandPalette\";\n\n// https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34757\nexport const CommandPalette = Object.assign({}, _CommandPalette, {\n List: CommandPaletteList,\n Item: CommandPaletteItem,\n CommandItem: CommandPaletteItem,\n});\n"],"mappings":"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"}
1	+ {"version":3,"file":"CommandPalette.js","names":["_CommandPalette","forwardRef","ref","children","onChangeSearch","search","mode","setMode","loading","rest","useState","selected","setSelected","listWrapperRef","useRef","handleChange","e","target","value","scrollToTop","current","scrollTo","top","behavior","scrollToBottom","scrollHeight","filterChildren","useMemo","itemsLength","commandsLength","items","deepMap","child","item","clonedElement","type","CommandPaletteList","cloneElement","props","CommandPaletteCommandItem","index","CommandPaletteItem","handleChangeSelected","direction","document","querySelectorAll","newIndex","newItem","forEach","_","i","length","scrollIntoView","block","key","preventDefault","displayName","CommandPalette","Object","assign","List","Item","CommandItem"],"sources":["../../../../src/components/CommandPalette/CommandPalette.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n cloneElement,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\nimport {\n StyledCommandPalette,\n StyledCommandPaletteWrapper,\n} from \"./CommandPalette.styles\";\nimport { CommandPaletteCommandItem } from \"./CommandPaletteCommandItem\";\nimport { CommandPaletteHeader } from \"./CommandPaletteHeader\";\nimport {\n CommandPaletteItem,\n CommandPaletteItemProps,\n} from \"./CommandPaletteItem\";\nimport { CommandPaletteList } from \"./CommandPaletteList\";\n\nimport {\n ModeContextProvider,\n SelectedContextProvider,\n SearchContextProvider,\n} from \"./context\";\n\nimport { deepMap } from \"../../utils/deepChildrenMap\";\n\nexport interface CommandPaletteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const _CommandPalette = forwardRef<\n HTMLDivElement,\n PropsWithChildren<CommandPaletteProps>\n>(\n (\n { children, onChangeSearch, search, mode, setMode, loading, ...rest },\n ref\n ) => {\n const [selected, setSelected] = useState<number>(0);\n const listWrapperRef = useRef<HTMLDivElement>(null);\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n const scrollToTop = () => {\n listWrapperRef.current?.scrollTo({ top: 0, behavior: \"smooth\" });\n };\n\n const scrollToBottom = () => {\n listWrapperRef.current?.scrollTo({\n top: listWrapperRef.current.scrollHeight,\n behavior: \"smooth\",\n });\n };\n\n const filterChildren = useMemo(() => {\n let itemsLength = 0;\n let commandsLength = 0;\n\n const items = deepMap(children, (child) => {\n const item = child as ReactElement<CommandPaletteItemProps>;\n let clonedElement;\n\n if (item && item.type === CommandPaletteList) {\n clonedElement = cloneElement(item, {\n ...item.props,\n });\n }\n\n if (item && item.type === CommandPaletteCommandItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n commandsLength++;\n }\n\n if (item && item.type === CommandPaletteItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n }\n\n return clonedElement;\n });\n\n return { items, itemsLength, commandsLength };\n }, [children, selected]);\n\n const handleChangeSelected = (direction?: \"up\" \| \"down\") => {\n const items = document.querySelectorAll(\".cp-item\");\n\n let index = 0;\n let newIndex = 0;\n let newItem: Element \| null = null;\n\n if (direction === \"down\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = index === items.length - 1 ? 0 : index + 1;\n } else if (direction === \"up\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = !index ? items.length - 1 : index - 1;\n } else {\n setSelected(0);\n }\n\n newItem = items[newIndex];\n\n if (newItem && typeof newIndex === \"number\") {\n setSelected(newIndex);\n\n newItem.scrollIntoView({\n behavior: \"smooth\",\n block: newIndex ? \"center\" : \"end\",\n });\n }\n };\n\n return (\n <Dialog {...rest} ref={ref}>\n <SearchContextProvider value={{ search, onChangeSearch }}>\n <SelectedContextProvider value={{ selected: selected, setSelected }}>\n <StyledCommandPalette\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n handleChangeSelected(\"down\");\n }\n\n if (e.key === \"ArrowUp\") {\n e.preventDefault();\n handleChangeSelected(\"up\");\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n scrollToBottom();\n setSelected(filterChildren.itemsLength - 1);\n }\n\n if (e.key === \"Home\") {\n e.preventDefault();\n scrollToTop();\n setSelected(0);\n }\n }}\n >\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPaletteHeader\n handleChange={handleChange}\n commandsLength={filterChildren.commandsLength}\n itemsLength={filterChildren.itemsLength}\n loading={loading}\n />\n </ModeContextProvider>\n\n <StyledCommandPaletteWrapper ref={listWrapperRef}>\n {filterChildren.items}\n </StyledCommandPaletteWrapper>\n </StyledCommandPalette>\n </SelectedContextProvider>\n </SearchContextProvider>\n </Dialog>\n );\n }\n);\n\n_CommandPalette.displayName = \"CommandPalette\";\n\n// https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34757\nexport const CommandPalette = Object.assign({}, _CommandPalette, {\n List: CommandPaletteList,\n Item: CommandPaletteItem,\n CommandItem: CommandPaletteCommandItem,\n});\n"],"mappings":"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"}

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

@@ -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 CHANGED Viewed

	@@ -1 +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"}
1	+ {"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 CHANGED Viewed

@@ -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 CHANGED Viewed

	@@ -1 +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"}
1	+ {"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/components/CommandPalette/CommandPalette.d.ts CHANGED Viewed

@@ -19,6 +19,6 @@ export declare const CommandPalette: React.ForwardRefExoticComponent<CommandPale
         displayName: string;
     };
     Item: React.ForwardRefExoticComponent<CommandPaletteItemProps & React.RefAttributes<HTMLLIElement>>;
-    CommandItem: React.ForwardRefExoticComponent<CommandPaletteItemProps & React.RefAttributes<HTMLLIElement>>;
+    CommandItem: React.ForwardRefExoticComponent<import("./CommandPaletteCommandItem").CommandPaletteCommandItemProps & React.RefAttributes<HTMLLIElement>>;
 };
 //# sourceMappingURL=CommandPalette.d.ts.map

package/dist/esm/components/CommandPalette/CommandPalette.js CHANGED Viewed

@@ -155,6 +155,6 @@ _CommandPalette.displayName = "CommandPalette";
 export var CommandPalette = Object.assign({}, _CommandPalette, {
   List: CommandPaletteList,
   Item: CommandPaletteItem,
-  CommandItem: CommandPaletteItem
+  CommandItem: CommandPaletteCommandItem
 });
 //# sourceMappingURL=CommandPalette.js.map

package/dist/esm/components/CommandPalette/CommandPalette.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"CommandPalette.js","names":["React","cloneElement","forwardRef","useMemo","useRef","useState","Dialog","StyledCommandPalette","StyledCommandPaletteWrapper","CommandPaletteCommandItem","CommandPaletteHeader","CommandPaletteItem","CommandPaletteList","ModeContextProvider","SelectedContextProvider","SearchContextProvider","deepMap","_CommandPalette","ref","children","onChangeSearch","search","mode","setMode","loading","rest","selected","setSelected","listWrapperRef","handleChange","e","target","value","scrollToTop","current","scrollTo","top","behavior","scrollToBottom","scrollHeight","filterChildren","itemsLength","commandsLength","items","child","item","clonedElement","type","props","index","handleChangeSelected","direction","document","querySelectorAll","newIndex","newItem","forEach","_","i","length","scrollIntoView","block","key","preventDefault","displayName","CommandPalette","Object","assign","List","Item","CommandItem"],"sources":["../../../../src/components/CommandPalette/CommandPalette.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n cloneElement,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\nimport {\n StyledCommandPalette,\n StyledCommandPaletteWrapper,\n} from \"./CommandPalette.styles\";\nimport { CommandPaletteCommandItem } from \"./CommandPaletteCommandItem\";\nimport { CommandPaletteHeader } from \"./CommandPaletteHeader\";\nimport {\n CommandPaletteItem,\n CommandPaletteItemProps,\n} from \"./CommandPaletteItem\";\nimport { CommandPaletteList } from \"./CommandPaletteList\";\n\nimport {\n ModeContextProvider,\n SelectedContextProvider,\n SearchContextProvider,\n} from \"./context\";\n\nimport { deepMap } from \"../../utils/deepChildrenMap\";\n\nexport interface CommandPaletteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const _CommandPalette = forwardRef<\n HTMLDivElement,\n PropsWithChildren<CommandPaletteProps>\n>(\n (\n { children, onChangeSearch, search, mode, setMode, loading, ...rest },\n ref\n ) => {\n const [selected, setSelected] = useState<number>(0);\n const listWrapperRef = useRef<HTMLDivElement>(null);\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n const scrollToTop = () => {\n listWrapperRef.current?.scrollTo({ top: 0, behavior: \"smooth\" });\n };\n\n const scrollToBottom = () => {\n listWrapperRef.current?.scrollTo({\n top: listWrapperRef.current.scrollHeight,\n behavior: \"smooth\",\n });\n };\n\n const filterChildren = useMemo(() => {\n let itemsLength = 0;\n let commandsLength = 0;\n\n const items = deepMap(children, (child) => {\n const item = child as ReactElement<CommandPaletteItemProps>;\n let clonedElement;\n\n if (item && item.type === CommandPaletteList) {\n clonedElement = cloneElement(item, {\n ...item.props,\n });\n }\n\n if (item && item.type === CommandPaletteCommandItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n commandsLength++;\n }\n\n if (item && item.type === CommandPaletteItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n }\n\n return clonedElement;\n });\n\n return { items, itemsLength, commandsLength };\n }, [children, selected]);\n\n const handleChangeSelected = (direction?: \"up\" \| \"down\") => {\n const items = document.querySelectorAll(\".cp-item\");\n\n let index = 0;\n let newIndex = 0;\n let newItem: Element \| null = null;\n\n if (direction === \"down\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = index === items.length - 1 ? 0 : index + 1;\n } else if (direction === \"up\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = !index ? items.length - 1 : index - 1;\n } else {\n setSelected(0);\n }\n\n newItem = items[newIndex];\n\n if (newItem && typeof newIndex === \"number\") {\n setSelected(newIndex);\n\n newItem.scrollIntoView({\n behavior: \"smooth\",\n block: newIndex ? \"center\" : \"end\",\n });\n }\n };\n\n return (\n <Dialog {...rest} ref={ref}>\n <SearchContextProvider value={{ search, onChangeSearch }}>\n <SelectedContextProvider value={{ selected: selected, setSelected }}>\n <StyledCommandPalette\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n handleChangeSelected(\"down\");\n }\n\n if (e.key === \"ArrowUp\") {\n e.preventDefault();\n handleChangeSelected(\"up\");\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n scrollToBottom();\n setSelected(filterChildren.itemsLength - 1);\n }\n\n if (e.key === \"Home\") {\n e.preventDefault();\n scrollToTop();\n setSelected(0);\n }\n }}\n >\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPaletteHeader\n handleChange={handleChange}\n commandsLength={filterChildren.commandsLength}\n itemsLength={filterChildren.itemsLength}\n loading={loading}\n />\n </ModeContextProvider>\n\n <StyledCommandPaletteWrapper ref={listWrapperRef}>\n {filterChildren.items}\n </StyledCommandPaletteWrapper>\n </StyledCommandPalette>\n </SelectedContextProvider>\n </SearchContextProvider>\n </Dialog>\n );\n }\n);\n\n_CommandPalette.displayName = \"CommandPalette\";\n\n// https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34757\nexport const CommandPalette = Object.assign({}, _CommandPalette, {\n List: CommandPaletteList,\n Item: CommandPaletteItem,\n CommandItem: CommandPaletteItem,\n});\n"],"mappings":"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"}
1	+ {"version":3,"file":"CommandPalette.js","names":["React","cloneElement","forwardRef","useMemo","useRef","useState","Dialog","StyledCommandPalette","StyledCommandPaletteWrapper","CommandPaletteCommandItem","CommandPaletteHeader","CommandPaletteItem","CommandPaletteList","ModeContextProvider","SelectedContextProvider","SearchContextProvider","deepMap","_CommandPalette","ref","children","onChangeSearch","search","mode","setMode","loading","rest","selected","setSelected","listWrapperRef","handleChange","e","target","value","scrollToTop","current","scrollTo","top","behavior","scrollToBottom","scrollHeight","filterChildren","itemsLength","commandsLength","items","child","item","clonedElement","type","props","index","handleChangeSelected","direction","document","querySelectorAll","newIndex","newItem","forEach","_","i","length","scrollIntoView","block","key","preventDefault","displayName","CommandPalette","Object","assign","List","Item","CommandItem"],"sources":["../../../../src/components/CommandPalette/CommandPalette.tsx"],"sourcesContent":["import React, {\n ChangeEvent,\n cloneElement,\n forwardRef,\n PropsWithChildren,\n ReactElement,\n useMemo,\n useRef,\n useState,\n} from \"react\";\nimport { Dialog, DialogProps } from \"../Dialog\";\nimport {\n StyledCommandPalette,\n StyledCommandPaletteWrapper,\n} from \"./CommandPalette.styles\";\nimport { CommandPaletteCommandItem } from \"./CommandPaletteCommandItem\";\nimport { CommandPaletteHeader } from \"./CommandPaletteHeader\";\nimport {\n CommandPaletteItem,\n CommandPaletteItemProps,\n} from \"./CommandPaletteItem\";\nimport { CommandPaletteList } from \"./CommandPaletteList\";\n\nimport {\n ModeContextProvider,\n SelectedContextProvider,\n SearchContextProvider,\n} from \"./context\";\n\nimport { deepMap } from \"../../utils/deepChildrenMap\";\n\nexport interface CommandPaletteProps extends DialogProps {\n onChangeSearch: (search: string) => void;\n search: string;\n mode: string;\n setMode: (value: string) => void;\n loading?: boolean;\n}\n\nexport const _CommandPalette = forwardRef<\n HTMLDivElement,\n PropsWithChildren<CommandPaletteProps>\n>(\n (\n { children, onChangeSearch, search, mode, setMode, loading, ...rest },\n ref\n ) => {\n const [selected, setSelected] = useState<number>(0);\n const listWrapperRef = useRef<HTMLDivElement>(null);\n\n const handleChange = (e: ChangeEvent<HTMLInputElement>) => {\n onChangeSearch(e.target.value);\n };\n\n const scrollToTop = () => {\n listWrapperRef.current?.scrollTo({ top: 0, behavior: \"smooth\" });\n };\n\n const scrollToBottom = () => {\n listWrapperRef.current?.scrollTo({\n top: listWrapperRef.current.scrollHeight,\n behavior: \"smooth\",\n });\n };\n\n const filterChildren = useMemo(() => {\n let itemsLength = 0;\n let commandsLength = 0;\n\n const items = deepMap(children, (child) => {\n const item = child as ReactElement<CommandPaletteItemProps>;\n let clonedElement;\n\n if (item && item.type === CommandPaletteList) {\n clonedElement = cloneElement(item, {\n ...item.props,\n });\n }\n\n if (item && item.type === CommandPaletteCommandItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n commandsLength++;\n }\n\n if (item && item.type === CommandPaletteItem) {\n clonedElement = cloneElement(item, {\n ...item.props,\n index: itemsLength,\n selected,\n });\n\n itemsLength++;\n }\n\n return clonedElement;\n });\n\n return { items, itemsLength, commandsLength };\n }, [children, selected]);\n\n const handleChangeSelected = (direction?: \"up\" \| \"down\") => {\n const items = document.querySelectorAll(\".cp-item\");\n\n let index = 0;\n let newIndex = 0;\n let newItem: Element \| null = null;\n\n if (direction === \"down\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = index === items.length - 1 ? 0 : index + 1;\n } else if (direction === \"up\") {\n items.forEach((_, i) => {\n if (i === selected) {\n index = i;\n }\n });\n\n newIndex = !index ? items.length - 1 : index - 1;\n } else {\n setSelected(0);\n }\n\n newItem = items[newIndex];\n\n if (newItem && typeof newIndex === \"number\") {\n setSelected(newIndex);\n\n newItem.scrollIntoView({\n behavior: \"smooth\",\n block: newIndex ? \"center\" : \"end\",\n });\n }\n };\n\n return (\n <Dialog {...rest} ref={ref}>\n <SearchContextProvider value={{ search, onChangeSearch }}>\n <SelectedContextProvider value={{ selected: selected, setSelected }}>\n <StyledCommandPalette\n onKeyDown={(e) => {\n if (e.key === \"ArrowDown\") {\n e.preventDefault();\n handleChangeSelected(\"down\");\n }\n\n if (e.key === \"ArrowUp\") {\n e.preventDefault();\n handleChangeSelected(\"up\");\n }\n\n if (e.key === \"End\") {\n e.preventDefault();\n scrollToBottom();\n setSelected(filterChildren.itemsLength - 1);\n }\n\n if (e.key === \"Home\") {\n e.preventDefault();\n scrollToTop();\n setSelected(0);\n }\n }}\n >\n <ModeContextProvider value={{ mode, setMode }}>\n <CommandPaletteHeader\n handleChange={handleChange}\n commandsLength={filterChildren.commandsLength}\n itemsLength={filterChildren.itemsLength}\n loading={loading}\n />\n </ModeContextProvider>\n\n <StyledCommandPaletteWrapper ref={listWrapperRef}>\n {filterChildren.items}\n </StyledCommandPaletteWrapper>\n </StyledCommandPalette>\n </SelectedContextProvider>\n </SearchContextProvider>\n </Dialog>\n );\n }\n);\n\n_CommandPalette.displayName = \"CommandPalette\";\n\n// https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34757\nexport const CommandPalette = Object.assign({}, _CommandPalette, {\n List: CommandPaletteList,\n Item: CommandPaletteItem,\n CommandItem: CommandPaletteCommandItem,\n});\n"],"mappings":"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"}

package/dist/index.js CHANGED Viewed

@@ -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",
@@ -16512,7 +16518,7 @@
   var CommandPalette = Object.assign({}, _CommandPalette, {
     List: CommandPaletteList,
     Item: CommandPaletteItem,
-    CommandItem: CommandPaletteItem
+    CommandItem: CommandPaletteCommandItem
   });
   exports.Accordion = Accordion;