@activecollab/components 1.0.274 → 1.0.275
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 +5 -1
- 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 +6 -2
- package/dist/esm/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/index.js +5 -1
- 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
|
@@ -19,6 +19,10 @@ var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
19
19
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
20
20
|
children = _ref.children;
|
|
21
21
|
var _children = _react.Children.toArray(children).slice(0, limit);
|
|
22
|
+
var handleVariant = (0, _react.useMemo)(function () {
|
|
23
|
+
if (size >= 34) return "Caption 1";
|
|
24
|
+
return "Caption 2";
|
|
25
|
+
}, [size]);
|
|
22
26
|
return /*#__PURE__*/_react.default.createElement(_Styles.AvatarGroupsStyles, null, _children.map(function (child) {
|
|
23
27
|
var item = child;
|
|
24
28
|
return /*#__PURE__*/(0, _react.cloneElement)(item, _objectSpread(_objectSpread({}, item.props), {}, {
|
|
@@ -34,7 +38,7 @@ var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
34
38
|
marginInlineStart: "-8px"
|
|
35
39
|
}
|
|
36
40
|
}, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
37
|
-
variant:
|
|
41
|
+
variant: handleVariant,
|
|
38
42
|
weight: "medium"
|
|
39
43
|
}, "+", _react.Children.count(children) - limit)));
|
|
40
44
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","limit","size","children","_children","Children","toArray","slice","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} 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 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
|
|
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 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAc,EAGZ,iBAAiB,
|
|
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,5 +1,5 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import React, { Children, cloneElement } from "react";
|
|
2
|
+
import React, { Children, cloneElement, useMemo } from "react";
|
|
3
3
|
import { Typography } from "../Typography/Typography";
|
|
4
4
|
import { AvatarGroupsStyles, LengthCountStyles } from "./Styles";
|
|
5
5
|
export var AvatarGroup = function AvatarGroup(_ref) {
|
|
@@ -8,6 +8,10 @@ export var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
8
8
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
9
9
|
children = _ref.children;
|
|
10
10
|
var _children = Children.toArray(children).slice(0, limit);
|
|
11
|
+
var handleVariant = useMemo(function () {
|
|
12
|
+
if (size >= 34) return "Caption 1";
|
|
13
|
+
return "Caption 2";
|
|
14
|
+
}, [size]);
|
|
11
15
|
return /*#__PURE__*/React.createElement(AvatarGroupsStyles, null, _children.map(function (child) {
|
|
12
16
|
var item = child;
|
|
13
17
|
return /*#__PURE__*/cloneElement(item, _extends({}, item.props, {
|
|
@@ -23,7 +27,7 @@ export var AvatarGroup = function AvatarGroup(_ref) {
|
|
|
23
27
|
marginInlineStart: "-8px"
|
|
24
28
|
}
|
|
25
29
|
}, /*#__PURE__*/React.createElement(Typography, {
|
|
26
|
-
variant:
|
|
30
|
+
variant: handleVariant,
|
|
27
31
|
weight: "medium"
|
|
28
32
|
}, "+", Children.count(children) - limit)));
|
|
29
33
|
};
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","limit","size","children","_children","toArray","slice","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} 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 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
|
|
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"}
|
package/dist/index.js
CHANGED
|
@@ -15773,6 +15773,10 @@
|
|
|
15773
15773
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
15774
15774
|
children = _ref.children;
|
|
15775
15775
|
var _children = React.Children.toArray(children).slice(0, limit);
|
|
15776
|
+
var handleVariant = React.useMemo(function () {
|
|
15777
|
+
if (size >= 34) return "Caption 1";
|
|
15778
|
+
return "Caption 2";
|
|
15779
|
+
}, [size]);
|
|
15776
15780
|
return /*#__PURE__*/React__default["default"].createElement(AvatarGroupsStyles, null, _children.map(function (child) {
|
|
15777
15781
|
var item = child;
|
|
15778
15782
|
return /*#__PURE__*/React.cloneElement(item, _objectSpread2(_objectSpread2({}, item.props), {}, {
|
|
@@ -15788,7 +15792,7 @@
|
|
|
15788
15792
|
marginInlineStart: "-8px"
|
|
15789
15793
|
}
|
|
15790
15794
|
}, /*#__PURE__*/React__default["default"].createElement(Typography, {
|
|
15791
|
-
variant:
|
|
15795
|
+
variant: handleVariant,
|
|
15792
15796
|
weight: "medium"
|
|
15793
15797
|
}, "+", React.Children.count(children) - limit)));
|
|
15794
15798
|
};
|