@activecollab/components 1.0.293 → 1.0.294
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.
- package/dist/cjs/components/AvatarGroup/AvatarGroup.js +4 -2
- package/dist/cjs/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/esm/components/AvatarGroup/AvatarGroup.d.ts.map +1 -1
- package/dist/esm/components/AvatarGroup/AvatarGroup.js +4 -2
- package/dist/esm/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/index.js +4 -2
- package/dist/index.js.map +1 -1
- package/dist/index.min.js +1 -1
- package/dist/index.min.js.map +1 -1
- package/package.json +1 -1
|
@@ -22,7 +22,9 @@ var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
22
22
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
23
23
|
children = _ref.children,
|
|
24
24
|
counterProps = _ref.counterProps;
|
|
25
|
-
|
|
25
|
+
// always display counter with min +2 as +1 can require 1 more Avatar
|
|
26
|
+
var minChildren = _react.Children.count(children) - limit > 1 ? false : true;
|
|
27
|
+
var _children = minChildren ? _react.Children.toArray(children) : _react.Children.toArray(children).slice(0, limit);
|
|
26
28
|
var handleVariant = (0, _react.useMemo)(function () {
|
|
27
29
|
if (size >= 34) return "Caption 1";
|
|
28
30
|
return "Caption 2";
|
|
@@ -36,7 +38,7 @@ var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
36
38
|
outline: "1px solid var(--page-paper-main)"
|
|
37
39
|
}
|
|
38
40
|
}));
|
|
39
|
-
}), limit >= _react.Children.count(children) ? null : /*#__PURE__*/_react.default.createElement(_StyledLengthCountStyles, _extends({
|
|
41
|
+
}), limit >= _react.Children.count(children) || minChildren ? null : /*#__PURE__*/_react.default.createElement(_StyledLengthCountStyles, _extends({
|
|
40
42
|
size: size,
|
|
41
43
|
role: "status",
|
|
42
44
|
"aria-label": "Rest of the users"
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","limit","size","children","counterProps","
|
|
1
|
+
{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","limit","size","children","counterProps","minChildren","Children","count","_children","toArray","slice","handleVariant","useMemo","map","child","item","cloneElement","props","style","marginInlineStart","outline"],"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 // always display counter with min +2 as +1 can require 1 more Avatar\n const minChildren = Children.count(children) - limit > 1 ? false : true;\n const _children = minChildren\n ? Children.toArray(children)\n : 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) || minChildren ? 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;EACA,IAAMC,WAAW,GAAGC,eAAQ,CAACC,KAAK,CAACJ,QAAQ,CAAC,GAAGF,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,IAAI;EACvE,IAAMO,SAAS,GAAGH,WAAW,GACzBC,eAAQ,CAACG,OAAO,CAACN,QAAQ,CAAC,GAC1BG,eAAQ,CAACG,OAAO,CAACN,QAAQ,CAAC,CAACO,KAAK,CAAC,CAAC,EAAET,KAAK,CAAC;EAE9C,IAAMU,aAAa,GAAG,IAAAC,cAAO,EAAC,YAAM;IAClC,IAAIV,IAAI,IAAI,EAAE,EAAE,OAAO,WAAW;IAClC,OAAO,WAAW;EACpB,CAAC,EAAE,CAACA,IAAI,CAAC,CAAC;EAEV,oBACE,6BAAC,0BAAkB,QAChBM,SAAS,CAACK,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAO,IAAAE,mBAAY,EAACD,IAAI,kCACnBA,IAAI,CAACE,KAAK;MACbf,IAAI,EAAEA,IAAI;MACVgB,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDnB,KAAK,IAAIK,eAAQ,CAACC,KAAK,CAACJ,QAAQ,CAAC,IAAIE,WAAW,GAAG,IAAI,gBACtD;IACE,IAAI,EAAEH,IAAK;IACX,IAAI,EAAC,QAAQ;IACb,cAAW;EAAmB,GAE1BE,YAAY,gBAEhB,6BAAC,sBAAU;IAAC,OAAO,EAAEO,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/CL,eAAQ,CAACC,KAAK,CAACJ,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC;AAAC;AAAA;EAAA;EAAA;AAAA,GAVa;EAAEkB,iBAAiB,EAAE;AAAO,CAAC"}
|
|
@@ -1 +1 @@
|
|
|
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,
|
|
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,gBA0CtC,CAAC"}
|
|
@@ -9,7 +9,9 @@ export var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
9
9
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
10
10
|
children = _ref.children,
|
|
11
11
|
counterProps = _ref.counterProps;
|
|
12
|
-
|
|
12
|
+
// always display counter with min +2 as +1 can require 1 more Avatar
|
|
13
|
+
var minChildren = Children.count(children) - limit > 1 ? false : true;
|
|
14
|
+
var _children = minChildren ? Children.toArray(children) : Children.toArray(children).slice(0, limit);
|
|
13
15
|
var handleVariant = useMemo(function () {
|
|
14
16
|
if (size >= 34) return "Caption 1";
|
|
15
17
|
return "Caption 2";
|
|
@@ -23,7 +25,7 @@ export var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
23
25
|
outline: "1px solid var(--page-paper-main)"
|
|
24
26
|
}
|
|
25
27
|
}));
|
|
26
|
-
}), limit >= Children.count(children) ? null : /*#__PURE__*/React.createElement(_StyledLengthCountStyles, _extends({
|
|
28
|
+
}), limit >= Children.count(children) || minChildren ? null : /*#__PURE__*/React.createElement(_StyledLengthCountStyles, _extends({
|
|
27
29
|
size: size,
|
|
28
30
|
role: "status",
|
|
29
31
|
"aria-label": "Rest of the users"
|
|
@@ -1 +1 @@
|
|
|
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"
|
|
1
|
+
{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","useMemo","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","limit","size","children","counterProps","minChildren","count","_children","toArray","slice","handleVariant","map","child","item","props","style","marginInlineStart","outline"],"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 // always display counter with min +2 as +1 can require 1 more Avatar\n const minChildren = Children.count(children) - limit > 1 ? false : true;\n const _children = minChildren\n ? Children.toArray(children)\n : 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) || minChildren ? 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;EACA,IAAMC,WAAW,GAAGX,QAAQ,CAACY,KAAK,CAACH,QAAQ,CAAC,GAAGF,KAAK,GAAG,CAAC,GAAG,KAAK,GAAG,IAAI;EACvE,IAAMM,SAAS,GAAGF,WAAW,GACzBX,QAAQ,CAACc,OAAO,CAACL,QAAQ,CAAC,GAC1BT,QAAQ,CAACc,OAAO,CAACL,QAAQ,CAAC,CAACM,KAAK,CAAC,CAAC,EAAER,KAAK,CAAC;EAE9C,IAAMS,aAAa,GAAGd,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,QAChBK,SAAS,CAACI,GAAG,CAAC,UAACC,KAAK,EAAK;IACxB,IAAMC,IAAI,GAAGD,KAAkC;IAE/C,oBAAOjB,YAAY,CAACkB,IAAI,eACnBA,IAAI,CAACC,KAAK;MACbZ,IAAI,EAAEA,IAAI;MACVa,KAAK,EAAE;QACLC,iBAAiB,EAAE,MAAM;QACzBC,OAAO,EAAE;MACX;IAAC,GACD;EACJ,CAAC,CAAC,EAEDhB,KAAK,IAAIP,QAAQ,CAACY,KAAK,CAACH,QAAQ,CAAC,IAAIE,WAAW,GAAG,IAAI,gBACtD;IACE,IAAI,EAAEH,IAAK;IACX,IAAI,EAAC,QAAQ;IACb,cAAW;EAAmB,GAE1BE,YAAY,gBAEhB,oBAAC,UAAU;IAAC,OAAO,EAAEM,aAAc;IAAC,MAAM,EAAC;EAAQ,QAC/ChB,QAAQ,CAACY,KAAK,CAACH,QAAQ,CAAC,GAAGF,KAAK,CACvB,CAEhB,CACkB;AAEzB,CAAC;AAAC;EAAA;EAAA;AAAA,GAVa;EAAEe,iBAAiB,EAAE;AAAO,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -16013,7 +16013,9 @@
|
|
|
16013
16013
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
16014
16014
|
children = _ref.children,
|
|
16015
16015
|
counterProps = _ref.counterProps;
|
|
16016
|
-
|
|
16016
|
+
// always display counter with min +2 as +1 can require 1 more Avatar
|
|
16017
|
+
var minChildren = React.Children.count(children) - limit > 1 ? false : true;
|
|
16018
|
+
var _children = minChildren ? React.Children.toArray(children) : React.Children.toArray(children).slice(0, limit);
|
|
16017
16019
|
var handleVariant = React.useMemo(function () {
|
|
16018
16020
|
if (size >= 34) return "Caption 1";
|
|
16019
16021
|
return "Caption 2";
|
|
@@ -16027,7 +16029,7 @@
|
|
|
16027
16029
|
outline: "1px solid var(--page-paper-main)"
|
|
16028
16030
|
}
|
|
16029
16031
|
}));
|
|
16030
|
-
}), limit >= React.Children.count(children) ? null : /*#__PURE__*/React__default["default"].createElement(_StyledLengthCountStyles, _extends({
|
|
16032
|
+
}), limit >= React.Children.count(children) || minChildren ? null : /*#__PURE__*/React__default["default"].createElement(_StyledLengthCountStyles, _extends({
|
|
16031
16033
|
size: size,
|
|
16032
16034
|
role: "status",
|
|
16033
16035
|
"aria-label": "Rest of the users"
|