@activecollab/components 1.0.297 → 1.0.299
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 +31 -62
- package/dist/cjs/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/cjs/components/AvatarGroup/Styles.js +3 -6
- package/dist/cjs/components/AvatarGroup/Styles.js.map +1 -1
- package/dist/cjs/components/Icons/collection/ProjectStar.js +50 -0
- package/dist/cjs/components/Icons/collection/ProjectStar.js.map +1 -0
- package/dist/cjs/components/Icons/collection/index.js +7 -0
- package/dist/cjs/components/Icons/collection/index.js.map +1 -1
- package/dist/esm/components/AvatarGroup/AvatarGroup.d.ts.map +1 -1
- package/dist/esm/components/AvatarGroup/AvatarGroup.js +29 -63
- package/dist/esm/components/AvatarGroup/AvatarGroup.js.map +1 -1
- package/dist/esm/components/AvatarGroup/Styles.d.ts +0 -1
- package/dist/esm/components/AvatarGroup/Styles.d.ts.map +1 -1
- package/dist/esm/components/AvatarGroup/Styles.js +3 -6
- package/dist/esm/components/AvatarGroup/Styles.js.map +1 -1
- package/dist/esm/components/Icons/collection/ProjectStar.d.ts +23 -0
- package/dist/esm/components/Icons/collection/ProjectStar.d.ts.map +1 -0
- package/dist/esm/components/Icons/collection/ProjectStar.js +43 -0
- package/dist/esm/components/Icons/collection/ProjectStar.js.map +1 -0
- package/dist/esm/components/Icons/collection/index.d.ts +1 -0
- package/dist/esm/components/Icons/collection/index.d.ts.map +1 -1
- package/dist/esm/components/Icons/collection/index.js +1 -0
- package/dist/esm/components/Icons/collection/index.js.map +1 -1
- package/dist/index.js +226 -222
- 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
|
@@ -10,12 +10,16 @@ var _react = _interopRequireWildcard(require("react"));
|
|
|
10
10
|
var _Tooltip = require("../Tooltip");
|
|
11
11
|
var _Typography = require("../Typography/Typography");
|
|
12
12
|
var _Styles = require("./Styles");
|
|
13
|
+
var _excluded = ["limit", "size", "children", "hasTooltip"];
|
|
13
14
|
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); }
|
|
14
15
|
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; }
|
|
15
16
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
17
|
+
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); }
|
|
16
18
|
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; }
|
|
17
19
|
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; }
|
|
18
20
|
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; }
|
|
21
|
+
function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
|
|
22
|
+
function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
|
|
19
23
|
var AvatarGroup = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
20
24
|
var _Children$toArray;
|
|
21
25
|
var limit = _ref.limit,
|
|
@@ -23,7 +27,8 @@ var AvatarGroup = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
23
27
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
24
28
|
children = _ref.children,
|
|
25
29
|
_ref$hasTooltip = _ref.hasTooltip,
|
|
26
|
-
hasTooltip = _ref$hasTooltip === void 0 ? false : _ref$hasTooltip
|
|
30
|
+
hasTooltip = _ref$hasTooltip === void 0 ? false : _ref$hasTooltip,
|
|
31
|
+
rest = _objectWithoutProperties(_ref, _excluded);
|
|
27
32
|
// always display counter with min +2 as +1 can takes space of an 1 more Avatar
|
|
28
33
|
var minChildren = _react.Children.count(children) - limit > 1 ? false : true;
|
|
29
34
|
// gap between Avatars
|
|
@@ -40,66 +45,38 @@ var AvatarGroup = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
|
|
|
40
45
|
props = _ref2.props;
|
|
41
46
|
return props.alt;
|
|
42
47
|
});
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
48
|
+
return /*#__PURE__*/_react.default.createElement(_Styles.AvatarGroupsStyles, _extends({
|
|
49
|
+
hasTooltip: hasTooltip,
|
|
50
|
+
ref: ref
|
|
51
|
+
}, rest), _children.map(function (child, index) {
|
|
52
|
+
var item = child;
|
|
46
53
|
var tooltipText = item.props.alt;
|
|
47
54
|
var alt = "Image of ".concat(tooltipText);
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
alt: alt,
|
|
54
|
-
style: {
|
|
55
|
-
marginLeft: "-".concat(gap, "px"),
|
|
56
|
-
outline: "1px solid var(--page-paper-main)"
|
|
57
|
-
}
|
|
58
|
-
})));
|
|
59
|
-
}
|
|
60
|
-
return /*#__PURE__*/(0, _react.cloneElement)(item, _objectSpread(_objectSpread({}, item.props), {}, {
|
|
55
|
+
return /*#__PURE__*/_react.default.createElement(_Tooltip.Tooltip, {
|
|
56
|
+
title: tooltipText ? tooltipText : "",
|
|
57
|
+
disable: !hasTooltip,
|
|
58
|
+
key: alt
|
|
59
|
+
}, /*#__PURE__*/(0, _react.cloneElement)(item, _objectSpread(_objectSpread({}, item.props), {}, {
|
|
61
60
|
size: size,
|
|
62
61
|
alt: alt,
|
|
63
62
|
style: {
|
|
64
|
-
|
|
63
|
+
// component preserves it's width
|
|
64
|
+
marginLeft: "-".concat(index === 0 ? null : gap, "px"),
|
|
65
65
|
outline: "1px solid var(--page-paper-main)"
|
|
66
66
|
}
|
|
67
|
-
}));
|
|
68
|
-
}
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
}, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
81
|
-
variant: handleVariant,
|
|
82
|
-
weight: "medium"
|
|
83
|
-
}, "+", _react.Children.count(children) - limit)));
|
|
84
|
-
}
|
|
85
|
-
return /*#__PURE__*/_react.default.createElement(_StyledLengthCountStyles2, {
|
|
86
|
-
size: size,
|
|
87
|
-
role: "status",
|
|
88
|
-
"aria-label": "Rest of the users",
|
|
89
|
-
$_css2: "-".concat(gap, "px")
|
|
90
|
-
}, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
91
|
-
variant: handleVariant,
|
|
92
|
-
weight: "medium"
|
|
93
|
-
}, "+", _react.Children.count(children) - limit));
|
|
94
|
-
};
|
|
95
|
-
return /*#__PURE__*/_react.default.createElement(_Styles.AvatarGroupsStyles, {
|
|
96
|
-
hasTooltip: hasTooltip,
|
|
97
|
-
gap: gap,
|
|
98
|
-
ref: ref
|
|
99
|
-
}, _children.map(function (child) {
|
|
100
|
-
var item = child;
|
|
101
|
-
return renderAvatars(item);
|
|
102
|
-
}), limit >= _react.Children.count(children) || minChildren ? null : renderCounter());
|
|
67
|
+
})));
|
|
68
|
+
}), limit >= _react.Children.count(children) || minChildren ? null : /*#__PURE__*/_react.default.createElement(_StyledTooltip, {
|
|
69
|
+
title: nameArr.join(",\n"),
|
|
70
|
+
disable: !hasTooltip
|
|
71
|
+
}, /*#__PURE__*/_react.default.createElement(_StyledLengthCountStyles, {
|
|
72
|
+
size: size,
|
|
73
|
+
role: "status",
|
|
74
|
+
"aria-label": "Rest of the users",
|
|
75
|
+
$_css: "-".concat(gap, "px")
|
|
76
|
+
}, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
|
|
77
|
+
variant: handleVariant,
|
|
78
|
+
weight: "medium"
|
|
79
|
+
}, "+", _react.Children.count(children) - limit))));
|
|
103
80
|
});
|
|
104
81
|
exports.AvatarGroup = AvatarGroup;
|
|
105
82
|
AvatarGroup.displayName = "AvatarGroup";
|
|
@@ -118,12 +95,4 @@ var _StyledLengthCountStyles = (0, _styledComponents.default)(_Styles.LengthCoun
|
|
|
118
95
|
marginLeft: p.$_css
|
|
119
96
|
};
|
|
120
97
|
});
|
|
121
|
-
var _StyledLengthCountStyles2 = (0, _styledComponents.default)(_Styles.LengthCountStyles).withConfig({
|
|
122
|
-
displayName: "AvatarGroup___StyledLengthCountStyles2",
|
|
123
|
-
componentId: "sc-1rsx1j5-2"
|
|
124
|
-
})(function (p) {
|
|
125
|
-
return {
|
|
126
|
-
marginLeft: p.$_css2
|
|
127
|
-
};
|
|
128
|
-
});
|
|
129
98
|
//# sourceMappingURL=AvatarGroup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","forwardRef","ref","limit","size","children","hasTooltip","minChildren","Children","count","gap","_children","toArray","slice","handleVariant","useMemo","nameArr","map","item","props","alt","
|
|
1
|
+
{"version":3,"file":"AvatarGroup.js","names":["AvatarGroup","forwardRef","ref","limit","size","children","hasTooltip","rest","minChildren","Children","count","gap","_children","toArray","slice","handleVariant","useMemo","nameArr","map","item","props","alt","child","index","tooltipText","cloneElement","style","marginLeft","outline","join","displayName","whiteSpace","lineHeight"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n Children,\n cloneElement,\n PropsWithChildren,\n ReactElement,\n useMemo,\n forwardRef,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n limit: number;\n size?: number;\n hasTooltip?: boolean;\n}\n\nexport const AvatarGroup = forwardRef<\n HTMLDivElement,\n PropsWithChildren<AvatarGroupsProps>\n>(({ limit, size = 34, children, hasTooltip = false, ...rest }, ref) => {\n // always display counter with min +2 as +1 can takes space of an 1 more Avatar\n const minChildren = Children.count(children) - limit > 1 ? false : true;\n // gap between Avatars\n const gap = 8;\n\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 // get all names indexed above limit number from alt tag on Avatar for counter tooltip\n const nameArr = Children.toArray(children)\n ?.slice(limit)\n .map((item) => {\n const { props } = item as ReactElement;\n return props.alt;\n });\n\n return (\n <AvatarGroupsStyles hasTooltip={hasTooltip} ref={ref} {...rest}>\n {_children.map((child, index) => {\n const item = child as ReactElement<AvatarProps>;\n const tooltipText = item.props.alt;\n const alt = `Image of ${tooltipText}`;\n return (\n <Tooltip\n title={tooltipText ? tooltipText : \"\"}\n disable={!hasTooltip}\n key={alt}\n >\n {cloneElement(item, {\n ...item.props,\n size: size,\n alt: alt,\n style: {\n // component preserves it's width\n marginLeft: `-${index === 0 ? null : gap}px`,\n outline: \"1px solid var(--page-paper-main)\",\n },\n })}\n </Tooltip>\n );\n })}\n\n {limit >= Children.count(children) || minChildren ? null : (\n <Tooltip\n title={nameArr.join(\",\\n\")}\n disable={!hasTooltip}\n css={{\n whiteSpace: \"break-spaces\",\n lineHeight: \"18px\",\n }}\n >\n <LengthCountStyles\n size={size}\n role=\"status\"\n aria-label=\"Rest of the users\"\n css={{\n marginLeft: `-${gap}px`,\n }}\n >\n <Typography variant={handleVariant} weight=\"medium\">\n +{Children.count(children) - limit}\n </Typography>\n </LengthCountStyles>\n </Tooltip>\n )}\n </AvatarGroupsStyles>\n );\n});\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":"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"}
|
|
@@ -10,14 +10,11 @@ function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { de
|
|
|
10
10
|
var AvatarGroupsStyles = _styledComponents.default.div.withConfig({
|
|
11
11
|
displayName: "Styles__AvatarGroupsStyles",
|
|
12
12
|
componentId: "sc-1padv46-0"
|
|
13
|
-
})(["", " align-items:center;
|
|
13
|
+
})(["", " align-items:center;align-items:center;background-color:", ";border-radius:var(--ac-br-6);cursor:pointer;display:flex;justify-content:center;padding:", ";user-select:none;width:fit-content;"], _FontStyle.FontStyle, function (props) {
|
|
14
14
|
return !props.hasTooltip && "var(--color-theme-300)";
|
|
15
15
|
}, function (_ref) {
|
|
16
|
-
var
|
|
17
|
-
return
|
|
18
|
-
}, function (_ref2) {
|
|
19
|
-
var gap = _ref2.gap;
|
|
20
|
-
return "calc(100% + ".concat(gap * 2, "px + 5px)");
|
|
16
|
+
var hasTooltip = _ref.hasTooltip;
|
|
17
|
+
return hasTooltip ? "5px 0" : "5px";
|
|
21
18
|
});
|
|
22
19
|
exports.AvatarGroupsStyles = AvatarGroupsStyles;
|
|
23
20
|
var LengthCountStyles = _styledComponents.default.div.withConfig({
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["AvatarGroupsStyles","styled","div","FontStyle","props","hasTooltip","
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["AvatarGroupsStyles","styled","div","FontStyle","props","hasTooltip","LengthCountStyles","size"],"sources":["../../../../src/components/AvatarGroup/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const AvatarGroupsStyles = styled.div<{\n hasTooltip: boolean;\n}>`\n ${FontStyle}\n align-items: center;\n align-items: center;\n background-color: ${(props) => !props.hasTooltip && \"var(--color-theme-300)\"};\n border-radius: var(--ac-br-6);\n cursor: pointer;\n display: flex;\n justify-content: center;\n padding: ${({ hasTooltip }) => (hasTooltip ? \"5px 0\" : \"5px\")};\n user-select: none;\n width: fit-content;\n`;\n\ninterface LengthCountStylesProps {\n size: number;\n}\n\nexport const LengthCountStyles = styled.div<LengthCountStylesProps>`\n align-items: center;\n background-color: var(--color-theme-400);\n block-size: ${(props) => props.size + \"px\"};\n border-radius: var(--ac-br-rounded);\n display: flex;\n inline-size: ${(props) => props.size + \"px\"};\n justify-content: center;\n outline: 1px solid var(--page-paper-main);\n z-index: 99;\n`;\n"],"mappings":";;;;;;AAAA;AACA;AAAyC;AAElC,IAAMA,kBAAkB,GAAGC,yBAAM,CAACC,GAAG;EAAA;EAAA;AAAA,0MAGxCC,oBAAS,EAGS,UAACC,KAAK;EAAA,OAAK,CAACA,KAAK,CAACC,UAAU,IAAI,wBAAwB;AAAA,GAKjE;EAAA,IAAGA,UAAU,QAAVA,UAAU;EAAA,OAAQA,UAAU,GAAG,OAAO,GAAG,KAAK;AAAA,CAAC,CAG9D;AAAC;AAMK,IAAMC,iBAAiB,GAAGL,yBAAM,CAACC,GAAG;EAAA;EAAA;AAAA,gOAG3B,UAACE,KAAK;EAAA,OAAKA,KAAK,CAACG,IAAI,GAAG,IAAI;AAAA,GAG3B,UAACH,KAAK;EAAA,OAAKA,KAAK,CAACG,IAAI,GAAG,IAAI;AAAA,EAI5C;AAAC"}
|
|
@@ -0,0 +1,50 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, "__esModule", {
|
|
4
|
+
value: true
|
|
5
|
+
});
|
|
6
|
+
exports.default = void 0;
|
|
7
|
+
var _react = _interopRequireDefault(require("react"));
|
|
8
|
+
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
|
9
|
+
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); }
|
|
10
|
+
/**
|
|
11
|
+
* @component ProjectStarIcon
|
|
12
|
+
* @description
|
|
13
|
+
*
|
|
14
|
+
* The React Icon component is a visual element that displays an icon to represent a concept, object, or action.
|
|
15
|
+
* The Icon component is
|
|
16
|
+
* customizable, allowing for variations in size, color, and style to fit the needs of the application.
|
|
17
|
+
*
|
|
18
|
+
*
|
|
19
|
+
* @example
|
|
20
|
+
* return (
|
|
21
|
+
* <ProjectStarIcon className="mr-2" />
|
|
22
|
+
* )
|
|
23
|
+
*
|
|
24
|
+
* @see
|
|
25
|
+
* https://system.activecollab.com/?path=/story/foundation-icons-icons--icons
|
|
26
|
+
* @see
|
|
27
|
+
* https://design.activecollab.com/docs/foundations/icons
|
|
28
|
+
*/
|
|
29
|
+
var ProjectStarIcon = /*#__PURE__*/_react.default.forwardRef(function (props, svgRef) {
|
|
30
|
+
return /*#__PURE__*/_react.default.createElement("svg", _extends({
|
|
31
|
+
width: 24,
|
|
32
|
+
height: 24,
|
|
33
|
+
viewBox: "0 0 24 24",
|
|
34
|
+
xmlns: "http://www.w3.org/2000/svg",
|
|
35
|
+
"data-testid": "ProjectStarIcon",
|
|
36
|
+
fill: "var(--color-theme-600)",
|
|
37
|
+
focusable: false,
|
|
38
|
+
ref: svgRef
|
|
39
|
+
}, props), /*#__PURE__*/_react.default.createElement("path", {
|
|
40
|
+
fillRule: "evenodd",
|
|
41
|
+
clipRule: "evenodd",
|
|
42
|
+
d: "M4 15v5h5v-5H4zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2H4a2 2 0 01-2-2v-5a2 2 0 012-2zm11-9v5h5V4h-5zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2h-5a2 2 0 01-2-2V4a2 2 0 012-2zm0 13v5h5v-5h-5zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2h-5a2 2 0 01-2-2v-5a2 2 0 012-2z"
|
|
43
|
+
}), /*#__PURE__*/_react.default.createElement("path", {
|
|
44
|
+
d: "M6.505 9.631L4.198 10.9a.429.429 0 01-.592-.193.477.477 0 01-.044-.29l.44-2.687-1.865-1.903a.474.474 0 01-.008-.649.432.432 0 01.251-.133l2.578-.392 1.153-2.445a.43.43 0 01.787 0L8.05 4.653l2.578.392c.24.036.406.269.371.52a.467.467 0 01-.128.262L9.006 7.73l.44 2.686a.456.456 0 01-.357.53.42.42 0 01-.278-.046L6.505 9.63z"
|
|
45
|
+
}));
|
|
46
|
+
});
|
|
47
|
+
ProjectStarIcon.displayName = "ProjectStarIcon";
|
|
48
|
+
var _default = ProjectStarIcon;
|
|
49
|
+
exports.default = _default;
|
|
50
|
+
//# sourceMappingURL=ProjectStar.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"ProjectStar.js","names":["ProjectStarIcon","React","forwardRef","props","svgRef","displayName"],"sources":["../../../../../src/components/Icons/collection/ProjectStar.tsx"],"sourcesContent":["import React from \"react\";\n\n/**\n * @component ProjectStarIcon\n * @description\n *\n * The React Icon component is a visual element that displays an icon to represent a concept, object, or action.\n * The Icon component is\n * customizable, allowing for variations in size, color, and style to fit the needs of the application.\n *\n *\n * @example\n * return (\n * <ProjectStarIcon className=\"mr-2\" />\n * )\n *\n * @see\n * https://system.activecollab.com/?path=/story/foundation-icons-icons--icons\n * @see\n * https://design.activecollab.com/docs/foundations/icons\n */\nconst ProjectStarIcon = React.forwardRef(\n (props: React.SVGProps<SVGSVGElement>, svgRef?: React.Ref<SVGSVGElement>) => (\n <svg\n width={24}\n height={24}\n viewBox=\"0 0 24 24\"\n xmlns=\"http://www.w3.org/2000/svg\"\n data-testid=\"ProjectStarIcon\"\n fill=\"var(--color-theme-600)\"\n focusable={false}\n ref={svgRef}\n {...props}\n >\n <path\n fillRule=\"evenodd\"\n clipRule=\"evenodd\"\n d=\"M4 15v5h5v-5H4zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2H4a2 2 0 01-2-2v-5a2 2 0 012-2zm11-9v5h5V4h-5zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2h-5a2 2 0 01-2-2V4a2 2 0 012-2zm0 13v5h5v-5h-5zm0-2h5a2 2 0 012 2v5a2 2 0 01-2 2h-5a2 2 0 01-2-2v-5a2 2 0 012-2z\"\n />\n <path d=\"M6.505 9.631L4.198 10.9a.429.429 0 01-.592-.193.477.477 0 01-.044-.29l.44-2.687-1.865-1.903a.474.474 0 01-.008-.649.432.432 0 01.251-.133l2.578-.392 1.153-2.445a.43.43 0 01.787 0L8.05 4.653l2.578.392c.24.036.406.269.371.52a.467.467 0 01-.128.262L9.006 7.73l.44 2.686a.456.456 0 01-.357.53.42.42 0 01-.278-.046L6.505 9.63z\" />\n </svg>\n )\n);\nProjectStarIcon.displayName = \"ProjectStarIcon\";\nexport default ProjectStarIcon;\n"],"mappings":";;;;;;AAAA;AAA0B;AAAA;AAE1B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,IAAMA,eAAe,gBAAGC,cAAK,CAACC,UAAU,CACtC,UAACC,KAAoC,EAAEC,MAAiC;EAAA,oBACtE;IACE,KAAK,EAAE,EAAG;IACV,MAAM,EAAE,EAAG;IACX,OAAO,EAAC,WAAW;IACnB,KAAK,EAAC,4BAA4B;IAClC,eAAY,iBAAiB;IAC7B,IAAI,EAAC,wBAAwB;IAC7B,SAAS,EAAE,KAAM;IACjB,GAAG,EAAEA;EAAO,GACRD,KAAK,gBAET;IACE,QAAQ,EAAC,SAAS;IAClB,QAAQ,EAAC,SAAS;IAClB,CAAC,EAAC;EAAiP,EACnP,eACF;IAAM,CAAC,EAAC;EAAmU,EAAG,CAC1U;AAAA,CACP,CACF;AACDH,eAAe,CAACK,WAAW,GAAG,iBAAiB;AAAC,eACjCL,eAAe;AAAA"}
|
|
@@ -735,6 +735,12 @@ Object.defineProperty(exports, "ProjectSearchIcon", {
|
|
|
735
735
|
return _ProjectSearch.default;
|
|
736
736
|
}
|
|
737
737
|
});
|
|
738
|
+
Object.defineProperty(exports, "ProjectStarIcon", {
|
|
739
|
+
enumerable: true,
|
|
740
|
+
get: function get() {
|
|
741
|
+
return _ProjectStar.default;
|
|
742
|
+
}
|
|
743
|
+
});
|
|
738
744
|
Object.defineProperty(exports, "ProjectTemplateAddIcon", {
|
|
739
745
|
enumerable: true,
|
|
740
746
|
get: function get() {
|
|
@@ -1091,6 +1097,7 @@ var _PlaySmall = _interopRequireDefault(require("./PlaySmall"));
|
|
|
1091
1097
|
var _PriorityLow = _interopRequireDefault(require("./PriorityLow"));
|
|
1092
1098
|
var _ProjectAdd = _interopRequireDefault(require("./ProjectAdd"));
|
|
1093
1099
|
var _ProjectSearch = _interopRequireDefault(require("./ProjectSearch"));
|
|
1100
|
+
var _ProjectStar = _interopRequireDefault(require("./ProjectStar"));
|
|
1094
1101
|
var _ProjectTemplateAdd = _interopRequireDefault(require("./ProjectTemplateAdd"));
|
|
1095
1102
|
var _ProjectTemplateConvert = _interopRequireDefault(require("./ProjectTemplateConvert"));
|
|
1096
1103
|
var _ProjectTemplate = _interopRequireDefault(require("./ProjectTemplate"));
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Icons/collection/index.tsx"],"sourcesContent":["export { default as ActivityIcon } from \"./Activity\";\nexport { default as AddCrossTinyIcon } from \"./AddCrossTiny\";\nexport { default as AddCrossIcon } from \"./AddCross\";\nexport { default as ArrowBackMobileIcon } from \"./ArrowBackMobile\";\nexport { default as ArrowCollapseMultipleIcon } from \"./ArrowCollapseMultiple\";\nexport { default as ArrowDownLongIcon } from \"./ArrowDownLong\";\nexport { default as ArrowDownIcon } from \"./ArrowDown\";\nexport { default as ArrowExpandeMultipleIcon } from \"./ArrowExpandeMultiple\";\nexport { default as ArrowLeftBoxIcon } from \"./ArrowLeftBox\";\nexport { default as ArrowLeftIcon } from \"./ArrowLeft\";\nexport { default as ArrowRefreshIcon } from \"./ArrowRefresh\";\nexport { default as ArrowRightIcon } from \"./ArrowRight\";\nexport { default as ArrowUpLongIcon } from \"./ArrowUpLong\";\nexport { default as ArrowUpIcon } from \"./ArrowUp\";\nexport { default as AssignIcon } from \"./Assign\";\nexport { default as AttachmentIcon } from \"./Attachment\";\nexport { default as BellOffSmallIcon } from \"./BellOffSmall\";\nexport { default as BellOffIcon } from \"./BellOff\";\nexport { default as BillingIcon } from \"./Billing\";\nexport { default as BudgetAlertIcon } from \"./BudgetAlert\";\nexport { default as CalendarAddXIcon } from \"./CalendarAddX\";\nexport { default as CalendarIcon } from \"./Calendar\";\nexport { default as CancelCrossIcon } from \"./CancelCross\";\nexport { default as CaretLeftIcon } from \"./CaretLeft\";\nexport { default as CaretRightIcon } from \"./CaretRight\";\nexport { default as ChatIcon } from \"./Chat\";\nexport { default as CheckIcon } from \"./Check\";\nexport { default as CheckboxBlankTogglerIcon } from \"./CheckboxBlankToggler\";\nexport { default as CheckboxIcon } from \"./Checkbox\";\nexport { default as ChecklistSmallIcon } from \"./ChecklistSmall\";\nexport { default as ChecklistIcon } from \"./Checklist\";\nexport { default as CircleMultipleIcon } from \"./CircleMultiple\";\nexport { default as ClockAddIcon } from \"./ClockAdd\";\nexport { default as ClockSmallIcon } from \"./ClockSmall\";\nexport { default as ClockStopwatchSmallIcon } from \"./ClockStopwatchSmall\";\nexport { default as ClockStopwatchIcon } from \"./ClockStopwatch\";\nexport { default as ClockIcon } from \"./Clock\";\nexport { default as CloseSmallIcon } from \"./CloseSmall\";\nexport { default as CloseIcon } from \"./Close\";\nexport { default as CollapsIcon } from \"./CollapsIcon\";\nexport { default as CollapseAllIcon } from \"./CollapseAll\";\nexport { default as CollapseExpandSingleIcon } from \"./CollapseExpandSingle\";\nexport { default as CompanyIcon } from \"./Company\";\nexport { default as ComputerIcon } from \"./Computer\";\nexport { default as CopyIcon } from \"./Copy\";\nexport { default as CrownBlankIcon } from \"./CrownBlank\";\nexport { default as CrownSelectedIcon } from \"./CrownSelected\";\nexport { default as DependencySmallIcon } from \"./DependencySmall\";\nexport { default as DependencyIcon } from \"./Dependency\";\nexport { default as DiscussionAddIcon } from \"./DiscussionAdd\";\nexport { default as DiscussionIcon } from \"./Discussion\";\nexport { default as DollarCheckmarkSmallIcon } from \"./DollarCheckmarkSmall\";\nexport { default as DollarCheckmarkIcon } from \"./DollarCheckmark\";\nexport { default as DollarClockSmallIcon } from \"./DollarClockSmall\";\nexport { default as DollarClockIcon } from \"./DollarClock\";\nexport { default as DollarDocumentIcon } from \"./DollarDocument\";\nexport { default as DollarOffSmallIcon } from \"./DollarOffSmall\";\nexport { default as DollarOffIcon } from \"./DollarOff\";\nexport { default as DollarSmallIcon } from \"./DollarSmall\";\nexport { default as DollarIcon } from \"./Dollar\";\nexport { default as DownloadIcon } from \"./Download\";\nexport { default as DriveIcon } from \"./Drive\";\nexport { default as DropboxIcon } from \"./Dropbox\";\nexport { default as DuplicateIcon } from \"./Duplicate\";\nexport { default as EditMultipleIcon } from \"./EditMultiple\";\nexport { default as EditIcon } from \"./Edit\";\nexport { default as EmojiIcon } from \"./Emoji\";\nexport { default as EstimatePlusIcon } from \"./EstimatePlus\";\nexport { default as EstimatesIcon } from \"./Estimates\";\nexport { default as ExpandAllIcon } from \"./ExpandAll\";\nexport { default as ExpenseAddIcon } from \"./ExpenseAdd\";\nexport { default as EyeOffSmallIcon } from \"./EyeOffSmall\";\nexport { default as EyeOffIcon } from \"./EyeOff\";\nexport { default as EyeSmallIcon } from \"./EyeSmall\";\nexport { default as EyeIcon } from \"./Eye\";\nexport { default as FilterIcon } from \"./Filter\";\nexport { default as FolderMoveIcon } from \"./FolderMove\";\nexport { default as FolderOutlineIcon } from \"./FolderOutline\";\nexport { default as GiftIcon } from \"./Gift\";\nexport { default as HashtagIcon } from \"./Hashtag\";\nexport { default as HelpIcon } from \"./Help\";\nexport { default as ImageIcon } from \"./Image\";\nexport { default as InfoSmallIcon } from \"./InfoSmall\";\nexport { default as InfoIcon } from \"./Info\";\nexport { default as InsertLinkIcon } from \"./InsertLink\";\nexport { default as IntegrationsIcon } from \"./Integrations\";\nexport { default as InvoicesIcon } from \"./Invoices\";\nexport { default as LabelsIcon } from \"./Labels\";\nexport { default as LockSmallIcon } from \"./LockSmall\";\nexport { default as LockIcon } from \"./Lock\";\nexport { default as MarkerIcon } from \"./Marker\";\nexport { default as MessageAddIcon } from \"./MessageAdd\";\nexport { default as MessageEmptyIcon } from \"./MessageEmpty\";\nexport { default as MessageSmallIcon } from \"./MessageSmall\";\nexport { default as MessageIcon } from \"./Message\";\nexport { default as MinusIcon } from \"./Minus\";\nexport { default as MoveTriggerIcon } from \"./MoveTrigger\";\nexport { default as MyWorkIcon } from \"./MyWork\";\nexport { default as NoteAddIcon } from \"./NoteAdd\";\nexport { default as NoteIcon } from \"./Note\";\nexport { default as NotificationBellIcon } from \"./NotificationBell\";\nexport { default as OpenExpandedIcon } from \"./OpenExpanded\";\nexport { default as OpenSheetIcon } from \"./OpenSheet\";\nexport { default as OrderFirstIcon } from \"./OrderFirst\";\nexport { default as PaidSmallIcon } from \"./PaidSmall\";\nexport { default as PauseCircleOutlineIcon } from \"./PauseCircleOutline\";\nexport { default as PauseIcon } from \"./PauseIcon\";\nexport { default as PauseSmallIcon } from \"./PauseSmall\";\nexport { default as PencilSmallIcon } from \"./PencilSmall\";\nexport { default as PencilIcon } from \"./Pencil\";\nexport { default as PendingPaymentSmallIcon } from \"./PendingPaymentSmall\";\nexport { default as PeopleIcon } from \"./People\";\nexport { default as PersonCircleOffIcon } from \"./PersonCircleOff\";\nexport { default as PersonCircleIcon } from \"./PersonCircle\";\nexport { default as PersonPlusIcon } from \"./PersonPlus\";\nexport { default as PersonIcon } from \"./Person\";\nexport { default as PlayCircleOutlineIcon } from \"./PlayCircleOutline\";\nexport { default as PlayIcon } from \"./PlayIcon\";\nexport { default as PlaySmallIcon } from \"./PlaySmall\";\nexport { default as PriorityLowIcon } from \"./PriorityLow\";\nexport { default as ProjectAddIcon } from \"./ProjectAdd\";\nexport { default as ProjectSearchIcon } from \"./ProjectSearch\";\nexport { default as ProjectTemplateAddIcon } from \"./ProjectTemplateAdd\";\nexport { default as ProjectTemplateConvertIcon } from \"./ProjectTemplateConvert\";\nexport { default as ProjectTemplateIcon } from \"./ProjectTemplate\";\nexport { default as ProjectsIcon } from \"./Projects\";\nexport { default as RadioBlankIcon } from \"./RadioBlank\";\nexport { default as RadioButtonIcon } from \"./RadioButton\";\nexport { default as RearangeIcon } from \"./Rearange\";\nexport { default as RearrangeSmallIcon } from \"./RearrangeSmall\";\nexport { default as RecurringCheckmarkSmallIcon } from \"./RecurringCheckmarkSmall\";\nexport { default as RecurringCheckmarkIcon } from \"./RecurringCheckmark\";\nexport { default as ReportTimeIcon } from \"./ReportTime\";\nexport { default as ReportsIcon } from \"./Reports\";\nexport { default as RocketIcon } from \"./Rocket\";\nexport { default as SearchLargeIcon } from \"./SearchLarge\";\nexport { default as SearchIcon } from \"./Search\";\nexport { default as SendBlankIcon } from \"./SendBlank\";\nexport { default as SendFilledIcon } from \"./SendFilled\";\nexport { default as SettingsIcon } from \"./Settings\";\nexport { default as SortGeneralIcon } from \"./SortGeneral\";\nexport { default as SortIcon } from \"./SortIcon\";\nexport { default as StarOutlineIcon } from \"./StarOutline\";\nexport { default as StarIcon } from \"./Star\";\nexport { default as SystemSettingsIcon } from \"./SystemSettings\";\nexport { default as TaskAddIcon } from \"./TaskAdd\";\nexport { default as TaskListAddIcon } from \"./TaskListAdd\";\nexport { default as TaskListCompleteIcon } from \"./TaskListComplete\";\nexport { default as TaskListIcon } from \"./TaskList\";\nexport { default as ThumbUpOutlineIcon } from \"./ThumbUpOutline\";\nexport { default as TrashIcon } from \"./Trash\";\nexport { default as TreeDotsIcon } from \"./TreeDots\";\nexport { default as UploadIcon } from \"./Upload\";\nexport { default as ViewGridIcon } from \"./ViewGrid\";\nexport { default as ViewListIcon } from \"./ViewList\";\nexport { default as ViewTimelineIcon } from \"./ViewTimeline\";\nexport { default as VolumeHighIcon } from \"./VolumeHigh\";\nexport { default as WarningTriangleSmallIcon } from \"./WarningTriangleSmall\";\nexport { default as WarningTriangleIcon } from \"./WarningTriangle\";\nexport { default as WarningIcon } from \"./Warning\";\nexport { default as WorkloadIcon } from \"./Workload\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAqD"}
|
|
1
|
+
{"version":3,"file":"index.js","names":[],"sources":["../../../../../src/components/Icons/collection/index.tsx"],"sourcesContent":["export { default as ActivityIcon } from \"./Activity\";\nexport { default as AddCrossTinyIcon } from \"./AddCrossTiny\";\nexport { default as AddCrossIcon } from \"./AddCross\";\nexport { default as ArrowBackMobileIcon } from \"./ArrowBackMobile\";\nexport { default as ArrowCollapseMultipleIcon } from \"./ArrowCollapseMultiple\";\nexport { default as ArrowDownLongIcon } from \"./ArrowDownLong\";\nexport { default as ArrowDownIcon } from \"./ArrowDown\";\nexport { default as ArrowExpandeMultipleIcon } from \"./ArrowExpandeMultiple\";\nexport { default as ArrowLeftBoxIcon } from \"./ArrowLeftBox\";\nexport { default as ArrowLeftIcon } from \"./ArrowLeft\";\nexport { default as ArrowRefreshIcon } from \"./ArrowRefresh\";\nexport { default as ArrowRightIcon } from \"./ArrowRight\";\nexport { default as ArrowUpLongIcon } from \"./ArrowUpLong\";\nexport { default as ArrowUpIcon } from \"./ArrowUp\";\nexport { default as AssignIcon } from \"./Assign\";\nexport { default as AttachmentIcon } from \"./Attachment\";\nexport { default as BellOffSmallIcon } from \"./BellOffSmall\";\nexport { default as BellOffIcon } from \"./BellOff\";\nexport { default as BillingIcon } from \"./Billing\";\nexport { default as BudgetAlertIcon } from \"./BudgetAlert\";\nexport { default as CalendarAddXIcon } from \"./CalendarAddX\";\nexport { default as CalendarIcon } from \"./Calendar\";\nexport { default as CancelCrossIcon } from \"./CancelCross\";\nexport { default as CaretLeftIcon } from \"./CaretLeft\";\nexport { default as CaretRightIcon } from \"./CaretRight\";\nexport { default as ChatIcon } from \"./Chat\";\nexport { default as CheckIcon } from \"./Check\";\nexport { default as CheckboxBlankTogglerIcon } from \"./CheckboxBlankToggler\";\nexport { default as CheckboxIcon } from \"./Checkbox\";\nexport { default as ChecklistSmallIcon } from \"./ChecklistSmall\";\nexport { default as ChecklistIcon } from \"./Checklist\";\nexport { default as CircleMultipleIcon } from \"./CircleMultiple\";\nexport { default as ClockAddIcon } from \"./ClockAdd\";\nexport { default as ClockSmallIcon } from \"./ClockSmall\";\nexport { default as ClockStopwatchSmallIcon } from \"./ClockStopwatchSmall\";\nexport { default as ClockStopwatchIcon } from \"./ClockStopwatch\";\nexport { default as ClockIcon } from \"./Clock\";\nexport { default as CloseSmallIcon } from \"./CloseSmall\";\nexport { default as CloseIcon } from \"./Close\";\nexport { default as CollapsIcon } from \"./CollapsIcon\";\nexport { default as CollapseAllIcon } from \"./CollapseAll\";\nexport { default as CollapseExpandSingleIcon } from \"./CollapseExpandSingle\";\nexport { default as CompanyIcon } from \"./Company\";\nexport { default as ComputerIcon } from \"./Computer\";\nexport { default as CopyIcon } from \"./Copy\";\nexport { default as CrownBlankIcon } from \"./CrownBlank\";\nexport { default as CrownSelectedIcon } from \"./CrownSelected\";\nexport { default as DependencySmallIcon } from \"./DependencySmall\";\nexport { default as DependencyIcon } from \"./Dependency\";\nexport { default as DiscussionAddIcon } from \"./DiscussionAdd\";\nexport { default as DiscussionIcon } from \"./Discussion\";\nexport { default as DollarCheckmarkSmallIcon } from \"./DollarCheckmarkSmall\";\nexport { default as DollarCheckmarkIcon } from \"./DollarCheckmark\";\nexport { default as DollarClockSmallIcon } from \"./DollarClockSmall\";\nexport { default as DollarClockIcon } from \"./DollarClock\";\nexport { default as DollarDocumentIcon } from \"./DollarDocument\";\nexport { default as DollarOffSmallIcon } from \"./DollarOffSmall\";\nexport { default as DollarOffIcon } from \"./DollarOff\";\nexport { default as DollarSmallIcon } from \"./DollarSmall\";\nexport { default as DollarIcon } from \"./Dollar\";\nexport { default as DownloadIcon } from \"./Download\";\nexport { default as DriveIcon } from \"./Drive\";\nexport { default as DropboxIcon } from \"./Dropbox\";\nexport { default as DuplicateIcon } from \"./Duplicate\";\nexport { default as EditMultipleIcon } from \"./EditMultiple\";\nexport { default as EditIcon } from \"./Edit\";\nexport { default as EmojiIcon } from \"./Emoji\";\nexport { default as EstimatePlusIcon } from \"./EstimatePlus\";\nexport { default as EstimatesIcon } from \"./Estimates\";\nexport { default as ExpandAllIcon } from \"./ExpandAll\";\nexport { default as ExpenseAddIcon } from \"./ExpenseAdd\";\nexport { default as EyeOffSmallIcon } from \"./EyeOffSmall\";\nexport { default as EyeOffIcon } from \"./EyeOff\";\nexport { default as EyeSmallIcon } from \"./EyeSmall\";\nexport { default as EyeIcon } from \"./Eye\";\nexport { default as FilterIcon } from \"./Filter\";\nexport { default as FolderMoveIcon } from \"./FolderMove\";\nexport { default as FolderOutlineIcon } from \"./FolderOutline\";\nexport { default as GiftIcon } from \"./Gift\";\nexport { default as HashtagIcon } from \"./Hashtag\";\nexport { default as HelpIcon } from \"./Help\";\nexport { default as ImageIcon } from \"./Image\";\nexport { default as InfoSmallIcon } from \"./InfoSmall\";\nexport { default as InfoIcon } from \"./Info\";\nexport { default as InsertLinkIcon } from \"./InsertLink\";\nexport { default as IntegrationsIcon } from \"./Integrations\";\nexport { default as InvoicesIcon } from \"./Invoices\";\nexport { default as LabelsIcon } from \"./Labels\";\nexport { default as LockSmallIcon } from \"./LockSmall\";\nexport { default as LockIcon } from \"./Lock\";\nexport { default as MarkerIcon } from \"./Marker\";\nexport { default as MessageAddIcon } from \"./MessageAdd\";\nexport { default as MessageEmptyIcon } from \"./MessageEmpty\";\nexport { default as MessageSmallIcon } from \"./MessageSmall\";\nexport { default as MessageIcon } from \"./Message\";\nexport { default as MinusIcon } from \"./Minus\";\nexport { default as MoveTriggerIcon } from \"./MoveTrigger\";\nexport { default as MyWorkIcon } from \"./MyWork\";\nexport { default as NoteAddIcon } from \"./NoteAdd\";\nexport { default as NoteIcon } from \"./Note\";\nexport { default as NotificationBellIcon } from \"./NotificationBell\";\nexport { default as OpenExpandedIcon } from \"./OpenExpanded\";\nexport { default as OpenSheetIcon } from \"./OpenSheet\";\nexport { default as OrderFirstIcon } from \"./OrderFirst\";\nexport { default as PaidSmallIcon } from \"./PaidSmall\";\nexport { default as PauseCircleOutlineIcon } from \"./PauseCircleOutline\";\nexport { default as PauseIcon } from \"./PauseIcon\";\nexport { default as PauseSmallIcon } from \"./PauseSmall\";\nexport { default as PencilSmallIcon } from \"./PencilSmall\";\nexport { default as PencilIcon } from \"./Pencil\";\nexport { default as PendingPaymentSmallIcon } from \"./PendingPaymentSmall\";\nexport { default as PeopleIcon } from \"./People\";\nexport { default as PersonCircleOffIcon } from \"./PersonCircleOff\";\nexport { default as PersonCircleIcon } from \"./PersonCircle\";\nexport { default as PersonPlusIcon } from \"./PersonPlus\";\nexport { default as PersonIcon } from \"./Person\";\nexport { default as PlayCircleOutlineIcon } from \"./PlayCircleOutline\";\nexport { default as PlayIcon } from \"./PlayIcon\";\nexport { default as PlaySmallIcon } from \"./PlaySmall\";\nexport { default as PriorityLowIcon } from \"./PriorityLow\";\nexport { default as ProjectAddIcon } from \"./ProjectAdd\";\nexport { default as ProjectSearchIcon } from \"./ProjectSearch\";\nexport { default as ProjectStarIcon } from \"./ProjectStar\";\nexport { default as ProjectTemplateAddIcon } from \"./ProjectTemplateAdd\";\nexport { default as ProjectTemplateConvertIcon } from \"./ProjectTemplateConvert\";\nexport { default as ProjectTemplateIcon } from \"./ProjectTemplate\";\nexport { default as ProjectsIcon } from \"./Projects\";\nexport { default as RadioBlankIcon } from \"./RadioBlank\";\nexport { default as RadioButtonIcon } from \"./RadioButton\";\nexport { default as RearangeIcon } from \"./Rearange\";\nexport { default as RearrangeSmallIcon } from \"./RearrangeSmall\";\nexport { default as RecurringCheckmarkSmallIcon } from \"./RecurringCheckmarkSmall\";\nexport { default as RecurringCheckmarkIcon } from \"./RecurringCheckmark\";\nexport { default as ReportTimeIcon } from \"./ReportTime\";\nexport { default as ReportsIcon } from \"./Reports\";\nexport { default as RocketIcon } from \"./Rocket\";\nexport { default as SearchLargeIcon } from \"./SearchLarge\";\nexport { default as SearchIcon } from \"./Search\";\nexport { default as SendBlankIcon } from \"./SendBlank\";\nexport { default as SendFilledIcon } from \"./SendFilled\";\nexport { default as SettingsIcon } from \"./Settings\";\nexport { default as SortGeneralIcon } from \"./SortGeneral\";\nexport { default as SortIcon } from \"./SortIcon\";\nexport { default as StarOutlineIcon } from \"./StarOutline\";\nexport { default as StarIcon } from \"./Star\";\nexport { default as SystemSettingsIcon } from \"./SystemSettings\";\nexport { default as TaskAddIcon } from \"./TaskAdd\";\nexport { default as TaskListAddIcon } from \"./TaskListAdd\";\nexport { default as TaskListCompleteIcon } from \"./TaskListComplete\";\nexport { default as TaskListIcon } from \"./TaskList\";\nexport { default as ThumbUpOutlineIcon } from \"./ThumbUpOutline\";\nexport { default as TrashIcon } from \"./Trash\";\nexport { default as TreeDotsIcon } from \"./TreeDots\";\nexport { default as UploadIcon } from \"./Upload\";\nexport { default as ViewGridIcon } from \"./ViewGrid\";\nexport { default as ViewListIcon } from \"./ViewList\";\nexport { default as ViewTimelineIcon } from \"./ViewTimeline\";\nexport { default as VolumeHighIcon } from \"./VolumeHigh\";\nexport { default as WarningTriangleSmallIcon } from \"./WarningTriangleSmall\";\nexport { default as WarningTriangleIcon } from \"./WarningTriangle\";\nexport { default as WarningIcon } from \"./Warning\";\nexport { default as WorkloadIcon } from \"./Workload\";\n"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AAAqD"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAMf,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,WAAW;;
|
|
1
|
+
{"version":3,"file":"AvatarGroup.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"names":[],"mappings":"AAAA,OAAO,KAON,MAAM,OAAO,CAAC;AAMf,MAAM,WAAW,iBAAiB;IAChC,KAAK,EAAE,MAAM,CAAC;IACd,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,UAAU,CAAC,EAAE,OAAO,CAAC;CACtB;AAED,eAAO,MAAM,WAAW;;wCA6EtB,CAAC"}
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/esm/extends";
|
|
2
|
-
import
|
|
2
|
+
import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
|
|
3
3
|
import _styled2 from "styled-components";
|
|
4
4
|
import _styled from "styled-components";
|
|
5
|
+
var _excluded = ["limit", "size", "children", "hasTooltip"];
|
|
5
6
|
import React, { Children, cloneElement, useMemo, forwardRef } from "react";
|
|
6
7
|
import { Tooltip } from "../Tooltip";
|
|
7
8
|
import { Typography } from "../Typography/Typography";
|
|
@@ -13,7 +14,8 @@ export var AvatarGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
13
14
|
size = _ref$size === void 0 ? 34 : _ref$size,
|
|
14
15
|
children = _ref.children,
|
|
15
16
|
_ref$hasTooltip = _ref.hasTooltip,
|
|
16
|
-
hasTooltip = _ref$hasTooltip === void 0 ? false : _ref$hasTooltip
|
|
17
|
+
hasTooltip = _ref$hasTooltip === void 0 ? false : _ref$hasTooltip,
|
|
18
|
+
rest = _objectWithoutPropertiesLoose(_ref, _excluded);
|
|
17
19
|
// always display counter with min +2 as +1 can takes space of an 1 more Avatar
|
|
18
20
|
var minChildren = Children.count(children) - limit > 1 ? false : true;
|
|
19
21
|
// gap between Avatars
|
|
@@ -30,66 +32,38 @@ export var AvatarGroup = /*#__PURE__*/forwardRef(function (_ref, ref) {
|
|
|
30
32
|
props = _ref2.props;
|
|
31
33
|
return props.alt;
|
|
32
34
|
});
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
35
|
+
return /*#__PURE__*/React.createElement(AvatarGroupsStyles, _extends({
|
|
36
|
+
hasTooltip: hasTooltip,
|
|
37
|
+
ref: ref
|
|
38
|
+
}, rest), _children.map(function (child, index) {
|
|
39
|
+
var item = child;
|
|
36
40
|
var tooltipText = item.props.alt;
|
|
37
41
|
var alt = "Image of " + tooltipText;
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
alt: alt,
|
|
44
|
-
style: {
|
|
45
|
-
marginLeft: "-" + gap + "px",
|
|
46
|
-
outline: "1px solid var(--page-paper-main)"
|
|
47
|
-
}
|
|
48
|
-
})));
|
|
49
|
-
}
|
|
50
|
-
return /*#__PURE__*/cloneElement(item, _extends({}, item.props, {
|
|
42
|
+
return /*#__PURE__*/React.createElement(Tooltip, {
|
|
43
|
+
title: tooltipText ? tooltipText : "",
|
|
44
|
+
disable: !hasTooltip,
|
|
45
|
+
key: alt
|
|
46
|
+
}, /*#__PURE__*/cloneElement(item, _extends({}, item.props, {
|
|
51
47
|
size: size,
|
|
52
48
|
alt: alt,
|
|
53
49
|
style: {
|
|
54
|
-
|
|
50
|
+
// component preserves it's width
|
|
51
|
+
marginLeft: "-" + (index === 0 ? null : gap) + "px",
|
|
55
52
|
outline: "1px solid var(--page-paper-main)"
|
|
56
53
|
}
|
|
57
|
-
}));
|
|
58
|
-
}
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
71
|
-
variant: handleVariant,
|
|
72
|
-
weight: "medium"
|
|
73
|
-
}, "+", Children.count(children) - limit)));
|
|
74
|
-
}
|
|
75
|
-
return /*#__PURE__*/React.createElement(_StyledLengthCountStyles2, {
|
|
76
|
-
size: size,
|
|
77
|
-
role: "status",
|
|
78
|
-
"aria-label": "Rest of the users",
|
|
79
|
-
$_css2: "-" + gap + "px"
|
|
80
|
-
}, /*#__PURE__*/React.createElement(Typography, {
|
|
81
|
-
variant: handleVariant,
|
|
82
|
-
weight: "medium"
|
|
83
|
-
}, "+", Children.count(children) - limit));
|
|
84
|
-
};
|
|
85
|
-
return /*#__PURE__*/React.createElement(AvatarGroupsStyles, {
|
|
86
|
-
hasTooltip: hasTooltip,
|
|
87
|
-
gap: gap,
|
|
88
|
-
ref: ref
|
|
89
|
-
}, _children.map(function (child) {
|
|
90
|
-
var item = child;
|
|
91
|
-
return renderAvatars(item);
|
|
92
|
-
}), limit >= Children.count(children) || minChildren ? null : renderCounter());
|
|
54
|
+
})));
|
|
55
|
+
}), limit >= Children.count(children) || minChildren ? null : /*#__PURE__*/React.createElement(_StyledTooltip, {
|
|
56
|
+
title: nameArr.join(",\n"),
|
|
57
|
+
disable: !hasTooltip
|
|
58
|
+
}, /*#__PURE__*/React.createElement(_StyledLengthCountStyles, {
|
|
59
|
+
size: size,
|
|
60
|
+
role: "status",
|
|
61
|
+
"aria-label": "Rest of the users",
|
|
62
|
+
$_css: "-" + gap + "px"
|
|
63
|
+
}, /*#__PURE__*/React.createElement(Typography, {
|
|
64
|
+
variant: handleVariant,
|
|
65
|
+
weight: "medium"
|
|
66
|
+
}, "+", Children.count(children) - limit))));
|
|
93
67
|
});
|
|
94
68
|
AvatarGroup.displayName = "AvatarGroup";
|
|
95
69
|
var _StyledTooltip = _styled(Tooltip).withConfig({
|
|
@@ -107,12 +81,4 @@ var _StyledLengthCountStyles = _styled(LengthCountStyles).withConfig({
|
|
|
107
81
|
marginLeft: p.$_css
|
|
108
82
|
};
|
|
109
83
|
});
|
|
110
|
-
var _StyledLengthCountStyles2 = _styled(LengthCountStyles).withConfig({
|
|
111
|
-
displayName: "AvatarGroup___StyledLengthCountStyles2",
|
|
112
|
-
componentId: "sc-1rsx1j5-2"
|
|
113
|
-
})(function (p) {
|
|
114
|
-
return {
|
|
115
|
-
marginLeft: p.$_css2
|
|
116
|
-
};
|
|
117
|
-
});
|
|
118
84
|
//# sourceMappingURL=AvatarGroup.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","useMemo","forwardRef","Tooltip","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","ref","limit","size","children","hasTooltip","minChildren","count","gap","_children","toArray","slice","handleVariant","nameArr","map","item","props","alt","
|
|
1
|
+
{"version":3,"file":"AvatarGroup.js","names":["React","Children","cloneElement","useMemo","forwardRef","Tooltip","Typography","AvatarGroupsStyles","LengthCountStyles","AvatarGroup","ref","limit","size","children","hasTooltip","rest","minChildren","count","gap","_children","toArray","slice","handleVariant","nameArr","map","item","props","alt","child","index","tooltipText","style","marginLeft","outline","join","displayName","whiteSpace","lineHeight"],"sources":["../../../../src/components/AvatarGroup/AvatarGroup.tsx"],"sourcesContent":["import React, {\n Children,\n cloneElement,\n PropsWithChildren,\n ReactElement,\n useMemo,\n forwardRef,\n} from \"react\";\nimport { AvatarProps } from \"../Avatar/Avatar\";\nimport { Tooltip } from \"../Tooltip\";\nimport { Typography } from \"../Typography/Typography\";\nimport { AvatarGroupsStyles, LengthCountStyles } from \"./Styles\";\n\nexport interface AvatarGroupsProps {\n limit: number;\n size?: number;\n hasTooltip?: boolean;\n}\n\nexport const AvatarGroup = forwardRef<\n HTMLDivElement,\n PropsWithChildren<AvatarGroupsProps>\n>(({ limit, size = 34, children, hasTooltip = false, ...rest }, ref) => {\n // always display counter with min +2 as +1 can takes space of an 1 more Avatar\n const minChildren = Children.count(children) - limit > 1 ? false : true;\n // gap between Avatars\n const gap = 8;\n\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 // get all names indexed above limit number from alt tag on Avatar for counter tooltip\n const nameArr = Children.toArray(children)\n ?.slice(limit)\n .map((item) => {\n const { props } = item as ReactElement;\n return props.alt;\n });\n\n return (\n <AvatarGroupsStyles hasTooltip={hasTooltip} ref={ref} {...rest}>\n {_children.map((child, index) => {\n const item = child as ReactElement<AvatarProps>;\n const tooltipText = item.props.alt;\n const alt = `Image of ${tooltipText}`;\n return (\n <Tooltip\n title={tooltipText ? tooltipText : \"\"}\n disable={!hasTooltip}\n key={alt}\n >\n {cloneElement(item, {\n ...item.props,\n size: size,\n alt: alt,\n style: {\n // component preserves it's width\n marginLeft: `-${index === 0 ? null : gap}px`,\n outline: \"1px solid var(--page-paper-main)\",\n },\n })}\n </Tooltip>\n );\n })}\n\n {limit >= Children.count(children) || minChildren ? null : (\n <Tooltip\n title={nameArr.join(\",\\n\")}\n disable={!hasTooltip}\n css={{\n whiteSpace: \"break-spaces\",\n lineHeight: \"18px\",\n }}\n >\n <LengthCountStyles\n size={size}\n role=\"status\"\n aria-label=\"Rest of the users\"\n css={{\n marginLeft: `-${gap}px`,\n }}\n >\n <Typography variant={handleVariant} weight=\"medium\">\n +{Children.count(children) - limit}\n </Typography>\n </LengthCountStyles>\n </Tooltip>\n )}\n </AvatarGroupsStyles>\n );\n});\n\nAvatarGroup.displayName = \"AvatarGroup\";\n"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/Styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB;gBACjB,OAAO;
|
|
1
|
+
{"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../src/components/AvatarGroup/Styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,kBAAkB;gBACjB,OAAO;SAapB,CAAC;AAEF,UAAU,sBAAsB;IAC9B,IAAI,EAAE,MAAM,CAAC;CACd;AAED,eAAO,MAAM,iBAAiB,wFAU7B,CAAC"}
|
|
@@ -3,14 +3,11 @@ import { FontStyle } from "../FontStyle";
|
|
|
3
3
|
export var AvatarGroupsStyles = styled.div.withConfig({
|
|
4
4
|
displayName: "Styles__AvatarGroupsStyles",
|
|
5
5
|
componentId: "sc-1padv46-0"
|
|
6
|
-
})(["", " align-items:center;
|
|
6
|
+
})(["", " align-items:center;align-items:center;background-color:", ";border-radius:var(--ac-br-6);cursor:pointer;display:flex;justify-content:center;padding:", ";user-select:none;width:fit-content;"], FontStyle, function (props) {
|
|
7
7
|
return !props.hasTooltip && "var(--color-theme-300)";
|
|
8
8
|
}, function (_ref) {
|
|
9
|
-
var
|
|
10
|
-
return
|
|
11
|
-
}, function (_ref2) {
|
|
12
|
-
var gap = _ref2.gap;
|
|
13
|
-
return "calc(100% + " + gap * 2 + "px + 5px)";
|
|
9
|
+
var hasTooltip = _ref.hasTooltip;
|
|
10
|
+
return hasTooltip ? "5px 0" : "5px";
|
|
14
11
|
});
|
|
15
12
|
export var LengthCountStyles = styled.div.withConfig({
|
|
16
13
|
displayName: "Styles__LengthCountStyles",
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Styles.js","names":["styled","FontStyle","AvatarGroupsStyles","div","props","hasTooltip","
|
|
1
|
+
{"version":3,"file":"Styles.js","names":["styled","FontStyle","AvatarGroupsStyles","div","props","hasTooltip","LengthCountStyles","size"],"sources":["../../../../src/components/AvatarGroup/Styles.ts"],"sourcesContent":["import styled from \"styled-components\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const AvatarGroupsStyles = styled.div<{\n hasTooltip: boolean;\n}>`\n ${FontStyle}\n align-items: center;\n align-items: center;\n background-color: ${(props) => !props.hasTooltip && \"var(--color-theme-300)\"};\n border-radius: var(--ac-br-6);\n cursor: pointer;\n display: flex;\n justify-content: center;\n padding: ${({ hasTooltip }) => (hasTooltip ? \"5px 0\" : \"5px\")};\n user-select: none;\n width: fit-content;\n`;\n\ninterface LengthCountStylesProps {\n size: number;\n}\n\nexport const LengthCountStyles = styled.div<LengthCountStylesProps>`\n align-items: center;\n background-color: var(--color-theme-400);\n block-size: ${(props) => props.size + \"px\"};\n border-radius: var(--ac-br-rounded);\n display: flex;\n inline-size: ${(props) => props.size + \"px\"};\n justify-content: center;\n outline: 1px solid var(--page-paper-main);\n z-index: 99;\n`;\n"],"mappings":"AAAA,OAAOA,MAAM,MAAM,mBAAmB;AACtC,SAASC,SAAS,QAAQ,cAAc;AAExC,OAAO,IAAMC,kBAAkB,GAAGF,MAAM,CAACG,GAAG;EAAA;EAAA;AAAA,0MAGxCF,SAAS,EAGS,UAACG,KAAK;EAAA,OAAK,CAACA,KAAK,CAACC,UAAU,IAAI,wBAAwB;AAAA,GAKjE;EAAA,IAAGA,UAAU,QAAVA,UAAU;EAAA,OAAQA,UAAU,GAAG,OAAO,GAAG,KAAK;AAAA,CAAC,CAG9D;AAMD,OAAO,IAAMC,iBAAiB,GAAGN,MAAM,CAACG,GAAG;EAAA;EAAA;AAAA,gOAG3B,UAACC,KAAK;EAAA,OAAKA,KAAK,CAACG,IAAI,GAAG,IAAI;AAAA,GAG3B,UAACH,KAAK;EAAA,OAAKA,KAAK,CAACG,IAAI,GAAG,IAAI;AAAA,EAI5C"}
|