@activecollab/components 1.0.110 → 1.0.111

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.
@@ -19,7 +19,7 @@ var OptionContent = function OptionContent(_ref) {
19
19
  textColor = _ref.textColor,
20
20
  name = _ref.name,
21
21
  additionalInfo = _ref.additionalInfo;
22
- return /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, imageUrl || color ? /*#__PURE__*/_react.default.createElement(_Styles.StyledOptionIndicator, {
22
+ return /*#__PURE__*/_react.default.createElement(_Styles.StyledOptionContentWrapper, null, imageUrl || color ? /*#__PURE__*/_react.default.createElement(_Styles.StyledOptionIndicator, {
23
23
  className: "c-option--label",
24
24
  backgroundColor: color
25
25
  }, imageUrl ? /*#__PURE__*/_react.default.createElement(_Avatar.Avatar, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":["OptionContent","imageUrl","color","textColor","name","additionalInfo","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAcO,IAAMA,aAAqC,GAAG,SAAxCA,aAAwC,OAM/C;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,cACI,QADJA,cACI;AACJ,sBACE,4DACGJ,QAAQ,IAAIC,KAAZ,gBACC,6BAAC,6BAAD;AACE,IAAA,SAAS,EAAC,iBADZ;AAEE,IAAA,eAAe,EAAEA;AAFnB,KAIGD,QAAQ,gBACP,6BAAC,cAAD;AAAQ,IAAA,SAAS,EAAC,kBAAlB;AAAqC,IAAA,GAAG,EAAEA;AAA1C,IADO,GAEL,IANN,CADD,GASG,IAVN,eAWE,6BAAC,wBAAD;AAAkB,IAAA,SAAS,EAAC,gBAA5B;AAA6C,IAAA,SAAS,EAAEE;AAAxD,KACGC,IADH,CAXF,EAcGC,cAAc,gBACb,6BAAC,4BAAD,QAAuBA,cAAvB,CADa,GAEX,IAhBN,CADF;AAoBD,CA3BM;;;AA6BPL,aAAa,CAACM,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { FC } from \"react\";\nimport { Avatar } from \"../../Avatar/Avatar\";\nimport {\n StyledOptionIndicator,\n StyledOptionText,\n StyledAdditionalInfo,\n} from \"./Styles\";\n\ninterface OptionContentProps {\n imageUrl?: string;\n color?: string;\n textColor?: string;\n name: string;\n additionalInfo?: string;\n}\n\nexport const OptionContent: FC<OptionContentProps> = ({\n imageUrl,\n color,\n textColor,\n name,\n additionalInfo,\n}) => {\n return (\n <>\n {imageUrl || color ? (\n <StyledOptionIndicator\n className=\"c-option--label\"\n backgroundColor={color}\n >\n {imageUrl ? (\n <Avatar className=\"c-option--avatar\" url={imageUrl} />\n ) : null}\n </StyledOptionIndicator>\n ) : null}\n <StyledOptionText className=\"c-option--text\" textColor={textColor}>\n {name}\n </StyledOptionText>\n {additionalInfo ? (\n <StyledAdditionalInfo>{additionalInfo}</StyledAdditionalInfo>\n ) : null}\n </>\n );\n};\n\nOptionContent.displayName = \"OptionContent\";\n"],"file":"OptionContent.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":["OptionContent","imageUrl","color","textColor","name","additionalInfo","displayName"],"mappings":";;;;;;;AAAA;;AACA;;AACA;;;;AAeO,IAAMA,aAAqC,GAAG,SAAxCA,aAAwC,OAM/C;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,cACI,QADJA,cACI;AACJ,sBACE,6BAAC,kCAAD,QACGJ,QAAQ,IAAIC,KAAZ,gBACC,6BAAC,6BAAD;AACE,IAAA,SAAS,EAAC,iBADZ;AAEE,IAAA,eAAe,EAAEA;AAFnB,KAIGD,QAAQ,gBACP,6BAAC,cAAD;AAAQ,IAAA,SAAS,EAAC,kBAAlB;AAAqC,IAAA,GAAG,EAAEA;AAA1C,IADO,GAEL,IANN,CADD,GASG,IAVN,eAWE,6BAAC,wBAAD;AAAkB,IAAA,SAAS,EAAC,gBAA5B;AAA6C,IAAA,SAAS,EAAEE;AAAxD,KACGC,IADH,CAXF,EAcGC,cAAc,gBACb,6BAAC,4BAAD,QAAuBA,cAAvB,CADa,GAEX,IAhBN,CADF;AAoBD,CA3BM;;;AA6BPL,aAAa,CAACM,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { FC } from \"react\";\nimport { Avatar } from \"../../Avatar/Avatar\";\nimport {\n StyledOptionIndicator,\n StyledOptionText,\n StyledAdditionalInfo,\n StyledOptionContentWrapper,\n} from \"./Styles\";\n\ninterface OptionContentProps {\n imageUrl?: string;\n color?: string;\n textColor?: string;\n name: string;\n additionalInfo?: string;\n}\n\nexport const OptionContent: FC<OptionContentProps> = ({\n imageUrl,\n color,\n textColor,\n name,\n additionalInfo,\n}) => {\n return (\n <StyledOptionContentWrapper>\n {imageUrl || color ? (\n <StyledOptionIndicator\n className=\"c-option--label\"\n backgroundColor={color}\n >\n {imageUrl ? (\n <Avatar className=\"c-option--avatar\" url={imageUrl} />\n ) : null}\n </StyledOptionIndicator>\n ) : null}\n <StyledOptionText className=\"c-option--text\" textColor={textColor}>\n {name}\n </StyledOptionText>\n {additionalInfo ? (\n <StyledAdditionalInfo>{additionalInfo}</StyledAdditionalInfo>\n ) : null}\n </StyledOptionContentWrapper>\n );\n};\n\nOptionContent.displayName = \"OptionContent\";\n"],"file":"OptionContent.js"}
@@ -5,7 +5,7 @@ function _typeof(obj) { "@babel/helpers - typeof"; if (typeof Symbol === "functi
5
5
  Object.defineProperty(exports, "__esModule", {
6
6
  value: true
7
7
  });
8
- exports.StyledOptionText = exports.StyledOptionIndicator = exports.StyledAdditionalInfo = void 0;
8
+ exports.StyledOptionText = exports.StyledOptionIndicator = exports.StyledOptionContentWrapper = exports.StyledAdditionalInfo = void 0;
9
9
 
10
10
  var _styledComponents = _interopRequireWildcard(require("styled-components"));
11
11
 
@@ -13,9 +13,17 @@ function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "functio
13
13
 
14
14
  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
15
 
16
+ var StyledOptionContentWrapper = _styledComponents.default.div.withConfig({
17
+ displayName: "Styles__StyledOptionContentWrapper",
18
+ componentId: "sc-6fiqyy-0"
19
+ })(["display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;"]);
20
+
21
+ exports.StyledOptionContentWrapper = StyledOptionContentWrapper;
22
+ StyledOptionContentWrapper.displayName = "StyledOptionContentWrapper";
23
+
16
24
  var StyledOptionIndicator = _styledComponents.default.div.withConfig({
17
25
  displayName: "Styles__StyledOptionIndicator",
18
- componentId: "sc-6fiqyy-0"
26
+ componentId: "sc-6fiqyy-1"
19
27
  })(["height:24px;width:24px;border-radius:100%;margin-right:8px;flex-shrink:0;", ""], function (props) {
20
28
  return props.backgroundColor && !props.children && (0, _styledComponents.css)(["background-color:", ";"], props.backgroundColor);
21
29
  });
@@ -25,7 +33,7 @@ StyledOptionIndicator.displayName = "StyledOptionIndicator";
25
33
 
26
34
  var StyledOptionText = _styledComponents.default.span.withConfig({
27
35
  displayName: "Styles__StyledOptionText",
28
- componentId: "sc-6fiqyy-1"
36
+ componentId: "sc-6fiqyy-2"
29
37
  })(["", " flex-grow:1;line-height:18px;", ""], {
30
38
  "overflow": "hidden",
31
39
  "textOverflow": "ellipsis",
@@ -39,7 +47,7 @@ StyledOptionText.displayName = "StyledOptionText";
39
47
 
40
48
  var StyledAdditionalInfo = _styledComponents.default.span.withConfig({
41
49
  displayName: "Styles__StyledAdditionalInfo",
42
- componentId: "sc-6fiqyy-2"
50
+ componentId: "sc-6fiqyy-3"
43
51
  })(["margin:0 0 0 5px;line-height:18px;flex-shrink:0;"]);
44
52
 
45
53
  exports.StyledAdditionalInfo = StyledAdditionalInfo;
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":["StyledOptionIndicator","styled","div","props","backgroundColor","children","css","displayName","StyledOptionText","span","textColor","StyledAdditionalInfo"],"mappings":";;;;;;;;;AAAA;;;;;;AAGO,IAAMA,qBAAqB,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,sFAM9B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,eAAN,IACA,CAACD,KAAK,CAACE,QADP,QAEAC,qBAFA,8BAGsBH,KAAK,CAACC,eAH5B,CADA;AAAA,CAN8B,CAA3B;;;AAcPJ,qBAAqB,CAACO,WAAtB,GAAoC,uBAApC;;AAEO,IAAMC,gBAAgB,GAAGP,0BAAOQ,IAAV;AAAA;AAAA;AAAA,+CACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAIzB,UAACN,KAAD;AAAA,SACAA,KAAK,CAACO,SAAN,QACAJ,qBADA,mBAEWH,KAAK,CAACO,SAFjB,CADA;AAAA,CAJyB,CAAtB;;;AAWPF,gBAAgB,CAACD,WAAjB,GAA+B,kBAA/B;;AAEO,IAAMI,oBAAoB,GAAGV,0BAAOQ,IAAV;AAAA;AAAA;AAAA,wDAA1B;;;AAMPE,oBAAoB,CAACJ,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nexport const StyledOptionIndicator = styled.div<{ backgroundColor?: string }>`\n height: 24px;\n width: 24px;\n border-radius: 100%;\n margin-right: 8px;\n flex-shrink: 0;\n ${(props) =>\n props.backgroundColor &&\n !props.children &&\n css`\n background-color: ${props.backgroundColor};\n `}\n`;\n\nStyledOptionIndicator.displayName = \"StyledOptionIndicator\";\n\nexport const StyledOptionText = styled.span<{ textColor?: string }>`\n ${tw`tw-truncate`}\n flex-grow: 1;\n line-height: 18px;\n ${(props) =>\n props.textColor &&\n css`\n color: ${props.textColor};\n `}\n`;\n\nStyledOptionText.displayName = \"StyledOptionText\";\n\nexport const StyledAdditionalInfo = styled.span`\n margin: 0 0 0 5px;\n line-height: 18px;\n flex-shrink: 0;\n`;\n\nStyledAdditionalInfo.displayName = \"StyledAdditionalInfo\";\n"],"file":"Styles.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":["StyledOptionContentWrapper","styled","div","displayName","StyledOptionIndicator","props","backgroundColor","children","css","StyledOptionText","span","textColor","StyledAdditionalInfo"],"mappings":";;;;;;;;;AAAA;;;;;;AAGO,IAAMA,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,kGAAhC;;;AAQPF,0BAA0B,CAACG,WAA3B,GAAyC,4BAAzC;;AAEO,IAAMC,qBAAqB,GAAGH,0BAAOC,GAAV;AAAA;AAAA;AAAA,sFAM9B,UAACG,KAAD;AAAA,SACAA,KAAK,CAACC,eAAN,IACA,CAACD,KAAK,CAACE,QADP,QAEAC,qBAFA,8BAGsBH,KAAK,CAACC,eAH5B,CADA;AAAA,CAN8B,CAA3B;;;AAcPF,qBAAqB,CAACD,WAAtB,GAAoC,uBAApC;;AAEO,IAAMM,gBAAgB,GAAGR,0BAAOS,IAAV;AAAA;AAAA;AAAA,+CACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAIzB,UAACL,KAAD;AAAA,SACAA,KAAK,CAACM,SAAN,QACAH,qBADA,mBAEWH,KAAK,CAACM,SAFjB,CADA;AAAA,CAJyB,CAAtB;;;AAWPF,gBAAgB,CAACN,WAAjB,GAA+B,kBAA/B;;AAEO,IAAMS,oBAAoB,GAAGX,0BAAOS,IAAV;AAAA;AAAA;AAAA,wDAA1B;;;AAMPE,oBAAoB,CAACT,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nexport const StyledOptionContentWrapper = styled.div`\n display: flex;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n align-items: center;\n`;\n\nStyledOptionContentWrapper.displayName = \"StyledOptionContentWrapper\";\n\nexport const StyledOptionIndicator = styled.div<{ backgroundColor?: string }>`\n height: 24px;\n width: 24px;\n border-radius: 100%;\n margin-right: 8px;\n flex-shrink: 0;\n ${(props) =>\n props.backgroundColor &&\n !props.children &&\n css`\n background-color: ${props.backgroundColor};\n `}\n`;\n\nStyledOptionIndicator.displayName = \"StyledOptionIndicator\";\n\nexport const StyledOptionText = styled.span<{ textColor?: string }>`\n ${tw`tw-truncate`}\n flex-grow: 1;\n line-height: 18px;\n ${(props) =>\n props.textColor &&\n css`\n color: ${props.textColor};\n `}\n`;\n\nStyledOptionText.displayName = \"StyledOptionText\";\n\nexport const StyledAdditionalInfo = styled.span`\n margin: 0 0 0 5px;\n line-height: 18px;\n flex-shrink: 0;\n`;\n\nStyledAdditionalInfo.displayName = \"StyledAdditionalInfo\";\n"],"file":"Styles.js"}
@@ -1 +1 @@
1
- {"version":3,"file":"OptionContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AAQlC,UAAU,kBAAkB;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA2BhD,CAAC"}
1
+ {"version":3,"file":"OptionContent.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":[],"mappings":"AAAA,OAAc,EAAE,EAAE,EAAE,MAAM,OAAO,CAAC;AASlC,UAAU,kBAAkB;IAC1B,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,cAAc,CAAC,EAAE,MAAM,CAAC;CACzB;AAED,eAAO,MAAM,aAAa,EAAE,EAAE,CAAC,kBAAkB,CA2BhD,CAAC"}
@@ -1,13 +1,13 @@
1
1
  import React from "react";
2
2
  import { Avatar } from "../../Avatar/Avatar";
3
- import { StyledOptionIndicator, StyledOptionText, StyledAdditionalInfo } from "./Styles";
3
+ import { StyledOptionIndicator, StyledOptionText, StyledAdditionalInfo, StyledOptionContentWrapper } from "./Styles";
4
4
  export var OptionContent = function OptionContent(_ref) {
5
5
  var imageUrl = _ref.imageUrl,
6
6
  color = _ref.color,
7
7
  textColor = _ref.textColor,
8
8
  name = _ref.name,
9
9
  additionalInfo = _ref.additionalInfo;
10
- return /*#__PURE__*/React.createElement(React.Fragment, null, imageUrl || color ? /*#__PURE__*/React.createElement(StyledOptionIndicator, {
10
+ return /*#__PURE__*/React.createElement(StyledOptionContentWrapper, null, imageUrl || color ? /*#__PURE__*/React.createElement(StyledOptionIndicator, {
11
11
  className: "c-option--label",
12
12
  backgroundColor: color
13
13
  }, imageUrl ? /*#__PURE__*/React.createElement(Avatar, {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":["React","Avatar","StyledOptionIndicator","StyledOptionText","StyledAdditionalInfo","OptionContent","imageUrl","color","textColor","name","additionalInfo","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAA0B,OAA1B;AACA,SAASC,MAAT,QAAuB,qBAAvB;AACA,SACEC,qBADF,EAEEC,gBAFF,EAGEC,oBAHF,QAIO,UAJP;AAcA,OAAO,IAAMC,aAAqC,GAAG,SAAxCA,aAAwC,OAM/C;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,cACI,QADJA,cACI;AACJ,sBACE,0CACGJ,QAAQ,IAAIC,KAAZ,gBACC,oBAAC,qBAAD;AACE,IAAA,SAAS,EAAC,iBADZ;AAEE,IAAA,eAAe,EAAEA;AAFnB,KAIGD,QAAQ,gBACP,oBAAC,MAAD;AAAQ,IAAA,SAAS,EAAC,kBAAlB;AAAqC,IAAA,GAAG,EAAEA;AAA1C,IADO,GAEL,IANN,CADD,GASG,IAVN,eAWE,oBAAC,gBAAD;AAAkB,IAAA,SAAS,EAAC,gBAA5B;AAA6C,IAAA,SAAS,EAAEE;AAAxD,KACGC,IADH,CAXF,EAcGC,cAAc,gBACb,oBAAC,oBAAD,QAAuBA,cAAvB,CADa,GAEX,IAhBN,CADF;AAoBD,CA3BM;AA6BPL,aAAa,CAACM,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { FC } from \"react\";\nimport { Avatar } from \"../../Avatar/Avatar\";\nimport {\n StyledOptionIndicator,\n StyledOptionText,\n StyledAdditionalInfo,\n} from \"./Styles\";\n\ninterface OptionContentProps {\n imageUrl?: string;\n color?: string;\n textColor?: string;\n name: string;\n additionalInfo?: string;\n}\n\nexport const OptionContent: FC<OptionContentProps> = ({\n imageUrl,\n color,\n textColor,\n name,\n additionalInfo,\n}) => {\n return (\n <>\n {imageUrl || color ? (\n <StyledOptionIndicator\n className=\"c-option--label\"\n backgroundColor={color}\n >\n {imageUrl ? (\n <Avatar className=\"c-option--avatar\" url={imageUrl} />\n ) : null}\n </StyledOptionIndicator>\n ) : null}\n <StyledOptionText className=\"c-option--text\" textColor={textColor}>\n {name}\n </StyledOptionText>\n {additionalInfo ? (\n <StyledAdditionalInfo>{additionalInfo}</StyledAdditionalInfo>\n ) : null}\n </>\n );\n};\n\nOptionContent.displayName = \"OptionContent\";\n"],"file":"OptionContent.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionContent/OptionContent.tsx"],"names":["React","Avatar","StyledOptionIndicator","StyledOptionText","StyledAdditionalInfo","StyledOptionContentWrapper","OptionContent","imageUrl","color","textColor","name","additionalInfo","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAA0B,OAA1B;AACA,SAASC,MAAT,QAAuB,qBAAvB;AACA,SACEC,qBADF,EAEEC,gBAFF,EAGEC,oBAHF,EAIEC,0BAJF,QAKO,UALP;AAeA,OAAO,IAAMC,aAAqC,GAAG,SAAxCA,aAAwC,OAM/C;AAAA,MALJC,QAKI,QALJA,QAKI;AAAA,MAJJC,KAII,QAJJA,KAII;AAAA,MAHJC,SAGI,QAHJA,SAGI;AAAA,MAFJC,IAEI,QAFJA,IAEI;AAAA,MADJC,cACI,QADJA,cACI;AACJ,sBACE,oBAAC,0BAAD,QACGJ,QAAQ,IAAIC,KAAZ,gBACC,oBAAC,qBAAD;AACE,IAAA,SAAS,EAAC,iBADZ;AAEE,IAAA,eAAe,EAAEA;AAFnB,KAIGD,QAAQ,gBACP,oBAAC,MAAD;AAAQ,IAAA,SAAS,EAAC,kBAAlB;AAAqC,IAAA,GAAG,EAAEA;AAA1C,IADO,GAEL,IANN,CADD,GASG,IAVN,eAWE,oBAAC,gBAAD;AAAkB,IAAA,SAAS,EAAC,gBAA5B;AAA6C,IAAA,SAAS,EAAEE;AAAxD,KACGC,IADH,CAXF,EAcGC,cAAc,gBACb,oBAAC,oBAAD,QAAuBA,cAAvB,CADa,GAEX,IAhBN,CADF;AAoBD,CA3BM;AA6BPL,aAAa,CAACM,WAAd,GAA4B,eAA5B","sourcesContent":["import React, { FC } from \"react\";\nimport { Avatar } from \"../../Avatar/Avatar\";\nimport {\n StyledOptionIndicator,\n StyledOptionText,\n StyledAdditionalInfo,\n StyledOptionContentWrapper,\n} from \"./Styles\";\n\ninterface OptionContentProps {\n imageUrl?: string;\n color?: string;\n textColor?: string;\n name: string;\n additionalInfo?: string;\n}\n\nexport const OptionContent: FC<OptionContentProps> = ({\n imageUrl,\n color,\n textColor,\n name,\n additionalInfo,\n}) => {\n return (\n <StyledOptionContentWrapper>\n {imageUrl || color ? (\n <StyledOptionIndicator\n className=\"c-option--label\"\n backgroundColor={color}\n >\n {imageUrl ? (\n <Avatar className=\"c-option--avatar\" url={imageUrl} />\n ) : null}\n </StyledOptionIndicator>\n ) : null}\n <StyledOptionText className=\"c-option--text\" textColor={textColor}>\n {name}\n </StyledOptionText>\n {additionalInfo ? (\n <StyledAdditionalInfo>{additionalInfo}</StyledAdditionalInfo>\n ) : null}\n </StyledOptionContentWrapper>\n );\n};\n\nOptionContent.displayName = \"OptionContent\";\n"],"file":"OptionContent.js"}
@@ -1,3 +1,4 @@
1
+ export declare const StyledOptionContentWrapper: import("styled-components").StyledComponent<"div", any, {}, never>;
1
2
  export declare const StyledOptionIndicator: import("styled-components").StyledComponent<"div", any, {
2
3
  backgroundColor?: string | undefined;
3
4
  }, never>;
@@ -1 +1 @@
1
- {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,qBAAqB;;SAYjC,CAAC;AAIF,eAAO,MAAM,gBAAgB;;SAS5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,qEAIhC,CAAC"}
1
+ {"version":3,"file":"Styles.d.ts","sourceRoot":"","sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,0BAA0B,oEAMtC,CAAC;AAIF,eAAO,MAAM,qBAAqB;;SAYjC,CAAC;AAIF,eAAO,MAAM,gBAAgB;;SAS5B,CAAC;AAIF,eAAO,MAAM,oBAAoB,qEAIhC,CAAC"}
@@ -1,14 +1,19 @@
1
1
  import styled, { css } from "styled-components";
2
+ export var StyledOptionContentWrapper = styled.div.withConfig({
3
+ displayName: "Styles__StyledOptionContentWrapper",
4
+ componentId: "sc-6fiqyy-0"
5
+ })(["display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;"]);
6
+ StyledOptionContentWrapper.displayName = "StyledOptionContentWrapper";
2
7
  export var StyledOptionIndicator = styled.div.withConfig({
3
8
  displayName: "Styles__StyledOptionIndicator",
4
- componentId: "sc-6fiqyy-0"
9
+ componentId: "sc-6fiqyy-1"
5
10
  })(["height:24px;width:24px;border-radius:100%;margin-right:8px;flex-shrink:0;", ""], function (props) {
6
11
  return props.backgroundColor && !props.children && css(["background-color:", ";"], props.backgroundColor);
7
12
  });
8
13
  StyledOptionIndicator.displayName = "StyledOptionIndicator";
9
14
  export var StyledOptionText = styled.span.withConfig({
10
15
  displayName: "Styles__StyledOptionText",
11
- componentId: "sc-6fiqyy-1"
16
+ componentId: "sc-6fiqyy-2"
12
17
  })(["", " flex-grow:1;line-height:18px;", ""], {
13
18
  "overflow": "hidden",
14
19
  "textOverflow": "ellipsis",
@@ -19,7 +24,7 @@ export var StyledOptionText = styled.span.withConfig({
19
24
  StyledOptionText.displayName = "StyledOptionText";
20
25
  export var StyledAdditionalInfo = styled.span.withConfig({
21
26
  displayName: "Styles__StyledAdditionalInfo",
22
- componentId: "sc-6fiqyy-2"
27
+ componentId: "sc-6fiqyy-3"
23
28
  })(["margin:0 0 0 5px;line-height:18px;flex-shrink:0;"]);
24
29
  StyledAdditionalInfo.displayName = "StyledAdditionalInfo";
25
30
  //# sourceMappingURL=Styles.js.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":["styled","css","StyledOptionIndicator","div","props","backgroundColor","children","displayName","StyledOptionText","span","textColor","StyledAdditionalInfo"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAGA,OAAO,IAAMC,qBAAqB,GAAGF,MAAM,CAACG,GAAV;AAAA;AAAA;AAAA,sFAM9B,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,eAAN,IACA,CAACD,KAAK,CAACE,QADP,IAEAL,GAFA,6BAGsBG,KAAK,CAACC,eAH5B,CADA;AAAA,CAN8B,CAA3B;AAcPH,qBAAqB,CAACK,WAAtB,GAAoC,uBAApC;AAEA,OAAO,IAAMC,gBAAgB,GAAGR,MAAM,CAACS,IAAV;AAAA;AAAA;AAAA,+CACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAIzB,UAACL,KAAD;AAAA,SACAA,KAAK,CAACM,SAAN,IACAT,GADA,kBAEWG,KAAK,CAACM,SAFjB,CADA;AAAA,CAJyB,CAAtB;AAWPF,gBAAgB,CAACD,WAAjB,GAA+B,kBAA/B;AAEA,OAAO,IAAMI,oBAAoB,GAAGX,MAAM,CAACS,IAAV;AAAA;AAAA;AAAA,wDAA1B;AAMPE,oBAAoB,CAACJ,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nexport const StyledOptionIndicator = styled.div<{ backgroundColor?: string }>`\n height: 24px;\n width: 24px;\n border-radius: 100%;\n margin-right: 8px;\n flex-shrink: 0;\n ${(props) =>\n props.backgroundColor &&\n !props.children &&\n css`\n background-color: ${props.backgroundColor};\n `}\n`;\n\nStyledOptionIndicator.displayName = \"StyledOptionIndicator\";\n\nexport const StyledOptionText = styled.span<{ textColor?: string }>`\n ${tw`tw-truncate`}\n flex-grow: 1;\n line-height: 18px;\n ${(props) =>\n props.textColor &&\n css`\n color: ${props.textColor};\n `}\n`;\n\nStyledOptionText.displayName = \"StyledOptionText\";\n\nexport const StyledAdditionalInfo = styled.span`\n margin: 0 0 0 5px;\n line-height: 18px;\n flex-shrink: 0;\n`;\n\nStyledAdditionalInfo.displayName = \"StyledAdditionalInfo\";\n"],"file":"Styles.js"}
1
+ {"version":3,"sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":["styled","css","StyledOptionContentWrapper","div","displayName","StyledOptionIndicator","props","backgroundColor","children","StyledOptionText","span","textColor","StyledAdditionalInfo"],"mappings":"AAAA,OAAOA,MAAP,IAAiBC,GAAjB,QAA4B,mBAA5B;AAGA,OAAO,IAAMC,0BAA0B,GAAGF,MAAM,CAACG,GAAV;AAAA;AAAA;AAAA,kGAAhC;AAQPD,0BAA0B,CAACE,WAA3B,GAAyC,4BAAzC;AAEA,OAAO,IAAMC,qBAAqB,GAAGL,MAAM,CAACG,GAAV;AAAA;AAAA;AAAA,sFAM9B,UAACG,KAAD;AAAA,SACAA,KAAK,CAACC,eAAN,IACA,CAACD,KAAK,CAACE,QADP,IAEAP,GAFA,6BAGsBK,KAAK,CAACC,eAH5B,CADA;AAAA,CAN8B,CAA3B;AAcPF,qBAAqB,CAACD,WAAtB,GAAoC,uBAApC;AAEA,OAAO,IAAMK,gBAAgB,GAAGT,MAAM,CAACU,IAAV;AAAA;AAAA;AAAA,+CACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAIzB,UAACJ,KAAD;AAAA,SACAA,KAAK,CAACK,SAAN,IACAV,GADA,kBAEWK,KAAK,CAACK,SAFjB,CADA;AAAA,CAJyB,CAAtB;AAWPF,gBAAgB,CAACL,WAAjB,GAA+B,kBAA/B;AAEA,OAAO,IAAMQ,oBAAoB,GAAGZ,MAAM,CAACU,IAAV;AAAA;AAAA;AAAA,wDAA1B;AAMPE,oBAAoB,CAACR,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\n\nexport const StyledOptionContentWrapper = styled.div`\n display: flex;\n overflow: hidden;\n text-overflow: ellipsis;\n white-space: nowrap;\n align-items: center;\n`;\n\nStyledOptionContentWrapper.displayName = \"StyledOptionContentWrapper\";\n\nexport const StyledOptionIndicator = styled.div<{ backgroundColor?: string }>`\n height: 24px;\n width: 24px;\n border-radius: 100%;\n margin-right: 8px;\n flex-shrink: 0;\n ${(props) =>\n props.backgroundColor &&\n !props.children &&\n css`\n background-color: ${props.backgroundColor};\n `}\n`;\n\nStyledOptionIndicator.displayName = \"StyledOptionIndicator\";\n\nexport const StyledOptionText = styled.span<{ textColor?: string }>`\n ${tw`tw-truncate`}\n flex-grow: 1;\n line-height: 18px;\n ${(props) =>\n props.textColor &&\n css`\n color: ${props.textColor};\n `}\n`;\n\nStyledOptionText.displayName = \"StyledOptionText\";\n\nexport const StyledAdditionalInfo = styled.span`\n margin: 0 0 0 5px;\n line-height: 18px;\n flex-shrink: 0;\n`;\n\nStyledAdditionalInfo.displayName = \"StyledAdditionalInfo\";\n"],"file":"Styles.js"}
package/dist/index.js CHANGED
@@ -7046,16 +7046,21 @@
7046
7046
  })(["margin-left:12px;"]);
7047
7047
  StyledRadioButton.displayName = "StyledRadioButton";
7048
7048
 
7049
+ var StyledOptionContentWrapper = styled__default["default"].div.withConfig({
7050
+ displayName: "Styles__StyledOptionContentWrapper",
7051
+ componentId: "sc-6fiqyy-0"
7052
+ })(["display:flex;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;align-items:center;"]);
7053
+ StyledOptionContentWrapper.displayName = "StyledOptionContentWrapper";
7049
7054
  var StyledOptionIndicator = styled__default["default"].div.withConfig({
7050
7055
  displayName: "Styles__StyledOptionIndicator",
7051
- componentId: "sc-6fiqyy-0"
7056
+ componentId: "sc-6fiqyy-1"
7052
7057
  })(["height:24px;width:24px;border-radius:100%;margin-right:8px;flex-shrink:0;", ""], function (props) {
7053
7058
  return props.backgroundColor && !props.children && styled.css(["background-color:", ";"], props.backgroundColor);
7054
7059
  });
7055
7060
  StyledOptionIndicator.displayName = "StyledOptionIndicator";
7056
7061
  var StyledOptionText = styled__default["default"].span.withConfig({
7057
7062
  displayName: "Styles__StyledOptionText",
7058
- componentId: "sc-6fiqyy-1"
7063
+ componentId: "sc-6fiqyy-2"
7059
7064
  })(["", " flex-grow:1;line-height:18px;", ""], {
7060
7065
  "overflow": "hidden",
7061
7066
  "textOverflow": "ellipsis",
@@ -7066,7 +7071,7 @@
7066
7071
  StyledOptionText.displayName = "StyledOptionText";
7067
7072
  var StyledAdditionalInfo = styled__default["default"].span.withConfig({
7068
7073
  displayName: "Styles__StyledAdditionalInfo",
7069
- componentId: "sc-6fiqyy-2"
7074
+ componentId: "sc-6fiqyy-3"
7070
7075
  })(["margin:0 0 0 5px;line-height:18px;flex-shrink:0;"]);
7071
7076
  StyledAdditionalInfo.displayName = "StyledAdditionalInfo";
7072
7077
 
@@ -7076,7 +7081,7 @@
7076
7081
  textColor = _ref.textColor,
7077
7082
  name = _ref.name,
7078
7083
  additionalInfo = _ref.additionalInfo;
7079
- return /*#__PURE__*/React__default["default"].createElement(React__default["default"].Fragment, null, imageUrl || color ? /*#__PURE__*/React__default["default"].createElement(StyledOptionIndicator, {
7084
+ return /*#__PURE__*/React__default["default"].createElement(StyledOptionContentWrapper, null, imageUrl || color ? /*#__PURE__*/React__default["default"].createElement(StyledOptionIndicator, {
7080
7085
  className: "c-option--label",
7081
7086
  backgroundColor: color
7082
7087
  }, imageUrl ? /*#__PURE__*/React__default["default"].createElement(Avatar, {