@activecollab/components 1.0.181 → 1.0.182

package/dist/cjs/components/Chip/Chip.js

@@ -13,7 +13,7 @@ var _Styles = require("./Styles");
 
 var _Typography = require("../Typography/Typography");
 
-var _excluded = ["leftAdornment", "label", "onClose", "size"];
+var _excluded = ["leftAdornment", "label", "onClose", "size", "color", "backgroundColor", "closeClassName", "isLabel"];
 
 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); }
 
@@ -31,10 +31,18 @@ var Chip = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       onClose = _ref.onClose,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? "regular" : _ref$size,
+      color = _ref.color,
+      backgroundColor = _ref.backgroundColor,
+      closeClassName = _ref.closeClassName,
+      isLabel = _ref.isLabel,
       rest = _objectWithoutProperties(_ref, _excluded);
 
   var showClose = typeof onClose === "function";
   var variant = (0, _react.useMemo)(function () {
+    if (isLabel) {
+      return "Caption 2";
+    }
+
     switch (size) {
       case "regular":
         return "Body 2";
@@ -45,20 +53,24 @@ var Chip = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
       default:
         return "Caption 1";
     }
-  }, [size]);
+  }, [isLabel, size]);
   return /*#__PURE__*/_react.default.createElement(_Styles.ChipContainer, _extends({}, rest, {
     ref: ref,
     $size: size,
-    $showClose: showClose
+    $showClose: showClose,
+    $color: color,
+    $backgroundColor: backgroundColor,
+    $isLabel: isLabel,
+    "data-testid": "chip-container"
   }), leftAdornment, /*#__PURE__*/_react.default.createElement(_Typography.Typography, {
     variant: variant,
-    className: "tw-flex-1 tw-truncate"
+    "data-testid": "chip-typography"
   }, label), showClose ? /*#__PURE__*/_react.default.createElement(_Styles.ChipTrigger, {
     $size: size,
     onClick: onClose,
-    className: "tw-ml-0.5"
+    className: closeClassName
   }, /*#__PURE__*/_react.default.createElement(_Styles.ChipCloseIcon, {
-    fill: "currentColor"
+    fill: color ? color : "currentColor"
   })) : null);
 });
 

package/dist/cjs/components/Chip/Chip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Chip/Chip.tsx"],"names":["Chip","React","forwardRef","ref","leftAdornment","label","onClose","size","rest","showClose","variant","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;;;;;;;;;;;;;AASO,IAAMA,IAAI,gBAAGC,eAAMC,UAAN,CAGlB,gBAA+DC,GAA/D,EAAuE;AAAA,MAApEC,aAAoE,QAApEA,aAAoE;AAAA,MAArDC,KAAqD,QAArDA,KAAqD;AAAA,MAA9CC,OAA8C,QAA9CA,OAA8C;AAAA,uBAArCC,IAAqC;AAAA,MAArCA,IAAqC,0BAA9B,SAA8B;AAAA,MAAhBC,IAAgB;;AACvE,MAAMC,SAAS,GAAG,OAAOH,OAAP,KAAmB,UAArC;AACA,MAAMI,OAAO,GAAG,oBAAQ,YAAM;AAC5B,YAAQH,IAAR;AACE,WAAK,SAAL;AACE,eAAO,QAAP;;AACF,WAAK,KAAL;AACE,eAAO,QAAP;;AACF;AACE,eAAO,WAAP;AANJ;AAQD,GATe,EASb,CAACA,IAAD,CATa,CAAhB;AAUA,sBACE,6BAAC,qBAAD,eAAmBC,IAAnB;AAAyB,IAAA,GAAG,EAAEL,GAA9B;AAAmC,IAAA,KAAK,EAAEI,IAA1C;AAAgD,IAAA,UAAU,EAAEE;AAA5D,MACGL,aADH,eAEE,6BAAC,sBAAD;AAAY,IAAA,OAAO,EAAEM,OAArB;AAA8B,IAAA,SAAS,EAAE;AAAzC,KACGL,KADH,CAFF,EAKGI,SAAS,gBACR,6BAAC,mBAAD;AAAa,IAAA,KAAK,EAAEF,IAApB;AAA0B,IAAA,OAAO,EAAED,OAAnC;AAA4C,IAAA,SAAS,EAAE;AAAvD,kBACE,6BAAC,qBAAD;AAAe,IAAA,IAAI,EAAC;AAApB,IADF,CADQ,GAIN,IATN,CADF;AAaD,CA5BmB,CAAb;;;AA8BPN,IAAI,CAACW,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { Typography } from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(({ leftAdornment, label, onClose, size = \"regular\", ...rest }, ref) => {\n  const showClose = typeof onClose === \"function\";\n  const variant = useMemo(() => {\n    switch (size) {\n      case \"regular\":\n        return \"Body 2\";\n      case \"big\":\n        return \"Body 1\";\n      default:\n        return \"Caption 1\";\n    }\n  }, [size]);\n  return (\n    <ChipContainer {...rest} ref={ref} $size={size} $showClose={showClose}>\n      {leftAdornment}\n      <Typography variant={variant} className={\"tw-flex-1 tw-truncate\"}>\n        {label}\n      </Typography>\n      {showClose ? (\n        <ChipTrigger $size={size} onClick={onClose} className={\"tw-ml-0.5\"}>\n          <ChipCloseIcon fill=\"currentColor\" />\n        </ChipTrigger>\n      ) : null}\n    </ChipContainer>\n  );\n});\n\nChip.displayName = \"Chip\";\n"],"file":"Chip.js"}
+{"version":3,"sources":["../../../../src/components/Chip/Chip.tsx"],"names":["Chip","React","forwardRef","ref","leftAdornment","label","onClose","size","color","backgroundColor","closeClassName","isLabel","rest","showClose","variant","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AAEA;;;;;;;;;;;;;;AAaO,IAAMA,IAAI,gBAAGC,eAAMC,UAAN,CAIlB,gBAYEC,GAZF,EAaK;AAAA,MAXDC,aAWC,QAXDA,aAWC;AAAA,MAVDC,KAUC,QAVDA,KAUC;AAAA,MATDC,OASC,QATDA,OASC;AAAA,uBARDC,IAQC;AAAA,MARDA,IAQC,0BARM,SAQN;AAAA,MAPDC,KAOC,QAPDA,KAOC;AAAA,MANDC,eAMC,QANDA,eAMC;AAAA,MALDC,cAKC,QALDA,cAKC;AAAA,MAJDC,OAIC,QAJDA,OAIC;AAAA,MAHEC,IAGF;;AACH,MAAMC,SAAS,GAAG,OAAOP,OAAP,KAAmB,UAArC;AACA,MAAMQ,OAAO,GAAG,oBAAQ,YAAM;AAC5B,QAAIH,OAAJ,EAAa;AACX,aAAO,WAAP;AACD;;AACD,YAAQJ,IAAR;AACE,WAAK,SAAL;AACE,eAAO,QAAP;;AACF,WAAK,KAAL;AACE,eAAO,QAAP;;AACF;AACE,eAAO,WAAP;AANJ;AAQD,GAZe,EAYb,CAACI,OAAD,EAAUJ,IAAV,CAZa,CAAhB;AAaA,sBACE,6BAAC,qBAAD,eACMK,IADN;AAEE,IAAA,GAAG,EAAET,GAFP;AAGE,IAAA,KAAK,EAAEI,IAHT;AAIE,IAAA,UAAU,EAAEM,SAJd;AAKE,IAAA,MAAM,EAAEL,KALV;AAME,IAAA,gBAAgB,EAAEC,eANpB;AAOE,IAAA,QAAQ,EAAEE,OAPZ;AAQE,mBAAa;AARf,MAUGP,aAVH,eAWE,6BAAC,sBAAD;AAAY,IAAA,OAAO,EAAEU,OAArB;AAA8B,mBAAa;AAA3C,KACGT,KADH,CAXF,EAcGQ,SAAS,gBACR,6BAAC,mBAAD;AACE,IAAA,KAAK,EAAEN,IADT;AAEE,IAAA,OAAO,EAAED,OAFX;AAGE,IAAA,SAAS,EAAEI;AAHb,kBAKE,6BAAC,qBAAD;AAAe,IAAA,IAAI,EAAEF,KAAK,GAAGA,KAAH,GAAW;AAArC,IALF,CADQ,GAQN,IAtBN,CADF;AA0BD,CA1DiB,CAAb;;;AA6DPR,IAAI,CAACe,WAAL,GAAmB,MAAnB","sourcesContent":["import React, { ReactNode, useMemo } from \"react\";\nimport { ChipCloseIcon, ChipContainer, ChipTrigger } from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { Typography } from \"../Typography/Typography\";\n\nexport interface ChipProps {\n  label: string;\n  onClose?: React.MouseEventHandler<HTMLButtonElement>;\n  leftAdornment?: ReactNode;\n  size?: InputSize;\n  color?: string;\n  backgroundColor?: string;\n  closeClassName?: string;\n  isLabel?: boolean;\n}\n\nexport const Chip = React.forwardRef<\n  HTMLDivElement,\n  ChipProps & Omit<React.ComponentPropsWithoutRef<\"div\">, keyof ChipProps>\n>(\n  (\n    {\n      leftAdornment,\n      label,\n      onClose,\n      size = \"regular\",\n      color,\n      backgroundColor,\n      closeClassName,\n      isLabel,\n      ...rest\n    },\n    ref\n  ) => {\n    const showClose = typeof onClose === \"function\";\n    const variant = useMemo(() => {\n      if (isLabel) {\n        return \"Caption 2\";\n      }\n      switch (size) {\n        case \"regular\":\n          return \"Body 2\";\n        case \"big\":\n          return \"Body 1\";\n        default:\n          return \"Caption 1\";\n      }\n    }, [isLabel, size]);\n    return (\n      <ChipContainer\n        {...rest}\n        ref={ref}\n        $size={size}\n        $showClose={showClose}\n        $color={color}\n        $backgroundColor={backgroundColor}\n        $isLabel={isLabel}\n        data-testid={\"chip-container\"}\n      >\n        {leftAdornment}\n        <Typography variant={variant} data-testid={\"chip-typography\"}>\n          {label}\n        </Typography>\n        {showClose ? (\n          <ChipTrigger\n            $size={size}\n            onClick={onClose}\n            className={closeClassName}\n          >\n            <ChipCloseIcon fill={color ? color : \"currentColor\"} />\n          </ChipTrigger>\n        ) : null}\n      </ChipContainer>\n    );\n  }\n);\n\nChip.displayName = \"Chip\";\n"],"file":"Chip.js"}

package/dist/cjs/components/Chip/Styles.js

@@ -17,6 +17,8 @@ var _Trigger = require("../Trigger");
 
 var _FontStyle = require("../FontStyle");
 
+var _Styles = require("../Typography/Styles");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -24,7 +26,7 @@ function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj &&
 var ChipContainer = _styledComponents.default.div.withConfig({
   displayName: "Styles__ChipContainer",
   componentId: "sc-7s0bd1-0"
-})(["min-width:44px;max-width:220px;", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", ""], {
+})(["min-width:44px;max-width:220px;", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", " ", "{", " ", "}", " ", " ", " ", " ", " ", " ", ""], {
   "height": "1.5rem"
 }, {
   "borderRadius": "0.25rem"
@@ -48,6 +50,21 @@ var ChipContainer = _styledComponents.default.div.withConfig({
   "fontWeight": "400"
 }, {
   "backgroundColor": "var(--color-theme-400)"
+}, _Styles.StyledTypography, {
+  "flex": "1 1 0%"
+}, {
+  "overflow": "hidden",
+  "textOverflow": "ellipsis",
+  "whiteSpace": "nowrap"
+}, function (_ref) {
+  var $color = _ref.$color;
+  return $color && (0, _styledComponents.css)(["", "{color:", ";}"], _Styles.StyledTypography, $color);
+}, function (_ref2) {
+  var $isLabel = _ref2.$isLabel;
+  return $isLabel && (0, _styledComponents.css)(["", "{color:#303037;}"], _Styles.StyledTypography);
+}, function (_ref3) {
+  var $backgroundColor = _ref3.$backgroundColor;
+  return $backgroundColor && (0, _styledComponents.css)(["background-color:", ";"], $backgroundColor);
 }, function (props) {
   return props.$showClose ? null : (0, _styledComponents.css)(["", ""], {
     "paddingRight": "0.375rem"
@@ -79,12 +96,14 @@ ChipLabel.displayName = "ChipLabel";
 var ChipTrigger = (0, _styledComponents.default)(_Trigger.Trigger).withConfig({
   displayName: "Styles__ChipTrigger",
   componentId: "sc-7s0bd1-2"
-})(["", " ", " ", " &:hover{", "}", " ", " ", ""], {
+})(["", " ", " ", " ", " &:hover{", "}", " ", " ", ""], {
   "display": "flex"
 }, {
   "alignItems": "center"
 }, {
   "justifyContent": "center"
+}, {
+  "marginLeft": "0.125rem"
 }, {
   "backgroundColor": "var(--color-theme-transparent-400)"
 }, function (props) {

package/dist/cjs/components/Chip/Styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Chip/Styles.ts"],"names":["ChipContainer","styled","div","FontStyle","BoxSizingStyle","props","$showClose","css","$size","displayName","ChipLabel","span","ChipTrigger","Trigger","ChipCloseIcon","CloseSmallIcon"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;;;;;AAEO,IAAMA,aAAa,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,iIAMpB;AAAA;AAAA,CANoB,EAOpB;AAAA;AAAA,CAPoB,EAQpB;AAAA;AAAA,CARoB,EASpB;AAAA;AAAA,CAToB,EAUpB;AAAA;AAAA,CAVoB,EAWpB;AAAA;AAAA,CAXoB,EAatBC,oBAbsB,EActBC,8BAdsB,EAiBpB;AAAA;AAAA,CAjBoB,EAkBpB;AAAA;AAAA,CAlBoB,EAmBpB;AAAA;AAAA,CAnBoB,EAoBpB;AAAA;AAAA,CApBoB,EAqBpB;AAAA;AAAA,CArBoB,EAwBpB;AAAA;AAAA,CAxBoB,EA0BtB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,GACI,IADJ,OAEIC,qBAFJ,YAGU;AAAA;AAAA,GAHV,CADA;AAAA,CA1BsB,EAiCtB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,SAAhB,QACAD,qBADA,mBADA;AAAA,CAjCsB,EAuCtB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,OAAhB,QACAD,qBADA,mBADA;AAAA,CAvCsB,EA6CtB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,KAAhB,QACAD,qBADA,mBADA;AAAA,CA7CsB,CAAnB;;;AAoDPP,aAAa,CAACS,WAAd,GAA4B,eAA5B;;AAEO,IAAMC,SAAS,GAAGT,0BAAOU,IAAV;AAAA;AAAA;AAAA,kBAChB;AAAA;AAAA,CADgB,EAEhB;AAAA;AAAA;AAAA;AAAA,CAFgB,CAAf;;;AAKPD,SAAS,CAACD,WAAV,GAAwB,WAAxB;AAEO,IAAMG,WAAW,GAAG,+BAAOC,gBAAP,CAAH;AAAA;AAAA;AAAA,mDAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAGlB;AAAA;AAAA,CAHkB,EAMhB;AAAA;AAAA,CANgB,EASpB,UAACR,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,SAAhB,QACAD,qBADA,8BADA;AAAA,CAToB,EAgBpB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,OAAhB,QACAD,qBADA,8BADA;AAAA,CAhBoB,EAuBpB,UAACF,KAAD;AAAA,SACAA,KAAK,CAACG,KAAN,KAAgB,KAAhB,QACAD,qBADA,8BADA;AAAA,CAvBoB,CAAjB;;AA+BPK,WAAW,CAACH,WAAZ,GAA0B,aAA1B;AAEO,IAAMK,aAAa,GAAG,+BAAOC,qBAAP,CAAH;AAAA;AAAA;AAAA,aACpB;AAAA;AAAA,CADoB,CAAnB;;AAIPD,aAAa,CAACL,WAAd,GAA4B,eAA5B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\nimport { FontStyle } from \"../FontStyle\";\n\nexport const ChipContainer = styled.div<{\n  $showClose?: boolean;\n  $size?: string;\n}>`\n  min-width: 44px;\n  max-width: 220px;\n  ${tw`tw-h-6`}\n  ${tw`tw-rounded`}\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-pl-1.5`}\n  ${tw`tw-overflow-hidden`}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  // font\n  ${tw`tw-text-body-2`}\n  ${tw`tw-text-theme-900`}\n  ${tw`tw-leading-regular`}\n  ${tw`tw-tracking-regular`}\n  ${tw`tw-font-regular`}\n\n  // background\n  ${tw`tw-bg-theme-400`}\n\n  ${(props) =>\n    props.$showClose\n      ? null\n      : css`\n          ${tw`tw-pr-1.5`}\n        `}\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  ${tw`tw-w-full`}\n  ${tw`tw-truncate`}\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<{ $size?: string }>`\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-justify-center`}\n\n  &:hover {\n    ${tw`tw-bg-theme-transparent-400`}\n  }\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  ${tw`tw-text-theme-700`}\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"file":"Styles.js"}
+{"version":3,"sources":["../../../../src/components/Chip/Styles.ts"],"names":["ChipContainer","styled","div","FontStyle","BoxSizingStyle","StyledTypography","$color","css","$isLabel","$backgroundColor","props","$showClose","$size","displayName","ChipLabel","span","ChipTrigger","Trigger","ChipCloseIcon","CloseSmallIcon"],"mappings":";;;;;;;;;AAAA;;AAEA;;AACA;;AACA;;AACA;;AACA;;;;;;AAEO,IAAMA,aAAa,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,+JASpB;AAAA;AAAA,CAToB,EAUpB;AAAA;AAAA,CAVoB,EAWpB;AAAA;AAAA,CAXoB,EAYpB;AAAA;AAAA,CAZoB,EAapB;AAAA;AAAA,CAboB,EAcpB;AAAA;AAAA,CAdoB,EAgBtBC,oBAhBsB,EAiBtBC,8BAjBsB,EAoBpB;AAAA;AAAA,CApBoB,EAqBpB;AAAA;AAAA,CArBoB,EAsBpB;AAAA;AAAA,CAtBoB,EAuBpB;AAAA;AAAA,CAvBoB,EAwBpB;AAAA;AAAA,CAxBoB,EA2BpB;AAAA;AAAA,CA3BoB,EA6BtBC,wBA7BsB,EA8BlB;AAAA;AAAA,CA9BkB,EA+BlB;AAAA;AAAA;AAAA;AAAA,CA/BkB,EAkCtB;AAAA,MAAGC,MAAH,QAAGA,MAAH;AAAA,SACAA,MAAM,QACNC,qBADM,yBAEFF,wBAFE,EAGOC,MAHP,CADN;AAAA,CAlCsB,EAyCtB;AAAA,MAAGE,QAAH,SAAGA,QAAH;AAAA,SACAA,QAAQ,QACRD,qBADQ,4BAEJF,wBAFI,CADR;AAAA,CAzCsB,EAiDtB;AAAA,MAAGI,gBAAH,SAAGA,gBAAH;AAAA,SACAA,gBAAgB,QAChBF,qBADgB,8BAEME,gBAFN,CADhB;AAAA,CAjDsB,EAuDtB,UAACC,KAAD;AAAA,SACAA,KAAK,CAACC,UAAN,GACI,IADJ,OAEIJ,qBAFJ,YAGU;AAAA;AAAA,GAHV,CADA;AAAA,CAvDsB,EA8DtB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,QACAL,qBADA,mBADA;AAAA,CA9DsB,EAoEtB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,QACAL,qBADA,mBADA;AAAA,CApEsB,EA0EtB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,QACAL,qBADA,mBADA;AAAA,CA1EsB,CAAnB;;;AAiFPP,aAAa,CAACa,WAAd,GAA4B,eAA5B;;AAEO,IAAMC,SAAS,GAAGb,0BAAOc,IAAV;AAAA;AAAA;AAAA,kBAChB;AAAA;AAAA,CADgB,EAEhB;AAAA;AAAA;AAAA;AAAA,CAFgB,CAAf;;;AAKPD,SAAS,CAACD,WAAV,GAAwB,WAAxB;AAEO,IAAMG,WAAW,GAAG,+BAAOC,gBAAP,CAAH;AAAA;AAAA;AAAA,wDAClB;AAAA;AAAA,CADkB,EAElB;AAAA;AAAA,CAFkB,EAGlB;AAAA;AAAA,CAHkB,EAIlB;AAAA;AAAA,CAJkB,EAQhB;AAAA;AAAA,CARgB,EAWpB,UAACP,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,SAAhB,QACAL,qBADA,8BADA;AAAA,CAXoB,EAkBpB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,OAAhB,QACAL,qBADA,8BADA;AAAA,CAlBoB,EAyBpB,UAACG,KAAD;AAAA,SACAA,KAAK,CAACE,KAAN,KAAgB,KAAhB,QACAL,qBADA,8BADA;AAAA,CAzBoB,CAAjB;;AAiCPS,WAAW,CAACH,WAAZ,GAA0B,aAA1B;AAEO,IAAMK,aAAa,GAAG,+BAAOC,qBAAP,CAAH;AAAA;AAAA;AAAA,aACpB;AAAA;AAAA,CADoB,CAAnB;;AAIPD,aAAa,CAACL,WAAd,GAA4B,eAA5B","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { CloseSmallIcon } from \"../Icons\";\nimport { BoxSizingStyle } from \"../BoxSizingStyle\";\nimport { Trigger } from \"../Trigger\";\nimport { FontStyle } from \"../FontStyle\";\nimport { StyledTypography } from \"../Typography/Styles\";\n\nexport const ChipContainer = styled.div<{\n  $showClose?: boolean;\n  $size?: string;\n  $color?: string;\n  $backgroundColor?: string;\n  $isLabel?: boolean;\n}>`\n  min-width: 44px;\n  max-width: 220px;\n  ${tw`tw-h-6`}\n  ${tw`tw-rounded`}\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-pl-1.5`}\n  ${tw`tw-overflow-hidden`}\n\n  ${FontStyle}\n  ${BoxSizingStyle}\n\n  // font\n  ${tw`tw-text-body-2`}\n  ${tw`tw-text-theme-900`}\n  ${tw`tw-leading-regular`}\n  ${tw`tw-tracking-regular`}\n  ${tw`tw-font-regular`}\n\n  // background\n  ${tw`tw-bg-theme-400`}\n\n  ${StyledTypography} {\n    ${tw`tw-flex-1`}\n    ${tw`tw-truncate`}\n  }\n\n  ${({ $color }) =>\n    $color &&\n    css`\n      ${StyledTypography} {\n        color: ${$color};\n      }\n    `}\n  ${({ $isLabel }) =>\n    $isLabel &&\n    css`\n      ${StyledTypography} {\n        color: #303037;\n      }\n    `}\n\n  ${({ $backgroundColor }) =>\n    $backgroundColor &&\n    css`\n      background-color: ${$backgroundColor};\n    `}\n\n  ${(props) =>\n    props.$showClose\n      ? null\n      : css`\n          ${tw`tw-pr-1.5`}\n        `}\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n    `}\n`;\n\nChipContainer.displayName = \"ChipContainer\";\n\nexport const ChipLabel = styled.span`\n  ${tw`tw-w-full`}\n  ${tw`tw-truncate`}\n`;\n\nChipLabel.displayName = \"ChipLabel\";\n\nexport const ChipTrigger = styled(Trigger)<{ $size?: string }>`\n  ${tw`tw-flex`}\n  ${tw`tw-items-center`}\n  ${tw`tw-justify-center`}\n  ${tw`tw-ml-0.5`}\n\n\n  &:hover {\n    ${tw`tw-bg-theme-transparent-400`}\n  }\n\n  ${(props) =>\n    props.$size === \"regular\" &&\n    css`\n      height: 24px;\n      width: 24px;\n    `}\n\n  ${(props) =>\n    props.$size === \"small\" &&\n    css`\n      height: 18px;\n      width: 18px;\n    `}\n\n  ${(props) =>\n    props.$size === \"big\" &&\n    css`\n      height: 30px;\n      width: 30px;\n    `}\n`;\n\nChipTrigger.displayName = \"ChipTrigger\";\n\nexport const ChipCloseIcon = styled(CloseSmallIcon)`\n  ${tw`tw-text-theme-700`}\n`;\n\nChipCloseIcon.displayName = \"ChipCloseIcon\";\n"],"file":"Styles.js"}

package/dist/cjs/components/ComboBox/ComboBox.js

@@ -53,7 +53,7 @@ var _ConditionWrapper = require("../../helpers/ConditionWrapper/ConditionWrapper
 
 var _classnames = _interopRequireDefault(require("classnames"));
 
-var _excluded = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid", "type", "renderChip", "forceCloseMenu", "renderOption", "limitChips", "hiddenNumberText", "inPortal", "inputWrapperClassName"];
+var _excluded = ["options", "selected", "loading", "loadingText", "onChange", "placeholder", "handleEmptyAction", "disabled", "size", "invalid", "type", "renderChip", "forceCloseMenu", "renderOption", "limitChips", "hiddenNumberText", "inPortal", "inputWrapperClassName", "scrollWrapper"];
 
 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); }
 
@@ -109,6 +109,7 @@ var ComboBox = function ComboBox(_ref) {
       _ref$inPortal = _ref.inPortal,
       inPortal = _ref$inPortal === void 0 ? false : _ref$inPortal,
       inputWrapperClassName = _ref.inputWrapperClassName,
+      scrollWrapper = _ref.scrollWrapper,
       prop = _objectWithoutProperties(_ref, _excluded);
 
   var selectedName = (0, _react.useMemo)(function () {
@@ -272,24 +273,39 @@ var ComboBox = function ComboBox(_ref) {
         "marginRight": "0.125rem"
       }
     })) : undefined;
+
+    var onClose = function onClose(e) {
+      e.preventDefault();
+      e.stopPropagation();
+
+      if (Array.isArray(selected) && selected.includes(option.id)) {
+        if (typeof onChange === "function") {
+          var newSelected = selected.filter(function (item) {
+            return item !== option.id;
+          });
+          onChange(newSelected);
+        }
+      }
+    };
+
+    var showOnClose = true;
+
+    if (disabled) {
+      showOnClose = false;
+    }
+
+    if (option.color) {
+      showOnClose = false;
+    }
+
     return /*#__PURE__*/_react.default.createElement(_Chip.Chip, {
       className: "c-combo-box-chip",
       leftAdornment: leftAdornment,
       label: option.name,
       key: index,
-      onClose: !disabled ? function (e) {
-        e.preventDefault();
-        e.stopPropagation();
-
-        if (Array.isArray(selected) && selected.includes(option.id)) {
-          if (typeof onChange === "function") {
-            var newSelected = selected.filter(function (item) {
-              return item !== option.id;
-            });
-            onChange(newSelected);
-          }
-        }
-      } : undefined,
+      backgroundColor: option.color,
+      isLabel: Boolean(option.color),
+      onClose: showOnClose ? onClose : undefined,
       size: size
     });
   }, [disabled, onChange, renderChip, selected, size]);
@@ -350,7 +366,9 @@ var ComboBox = function ComboBox(_ref) {
 
       (_elementRef$current = elementRef.current) === null || _elementRef$current === void 0 ? void 0 : _elementRef$current.focus();
     },
-    $_css3: autoSize === "auto" ? "auto" : undefined
+    $_css3: autoSize === "auto" ? "auto" : undefined,
+    $_css4: autoSize === "auto" && scrollWrapper ? "scroll" : undefined,
+    $_css5: autoSize === "auto" && scrollWrapper ? "80px" : undefined
   }, /*#__PURE__*/_react.default.createElement(_Styles.StyledChipWrapper, {
     $autoSize: autoSize,
     $open: open,
@@ -455,8 +473,12 @@ var _StyledTypography = (0, _styledComponents.default)(_Typography.Typography).w
 var _StyledStyledInputWrapper = (0, _styledComponents.default)(_Styles2.StyledInputWrapper).withConfig({
   displayName: "ComboBox___StyledStyledInputWrapper",
   componentId: "sc-uvsz9l-2"
-})(["display:flex;justify-content:space-between;flex:1;height:", ";"], function (p) {
+})(["display:flex;justify-content:space-between;flex:1;height:", ";overflow-y:", ";max-height:", ";"], function (p) {
   return p.$_css3;
+}, function (p) {
+  return p.$_css4;
+}, function (p) {
+  return p.$_css5;
 });
 
 var _StyledTrigger = (0, _styledComponents.default)(_Trigger.Trigger).withConfig({

package/dist/cjs/components/ComboBox/ComboBox.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":["ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","size","invalid","type","renderChip","forceCloseMenu","renderOption","limitChips","hiddenNumberText","inPortal","inputWrapperClassName","prop","selectedName","value","map","v","find","q","id","name","setValue","handleOnChange","e","target","childNode","setChildNode","elementRef","handleRef","wrapperRef","chipWrapper","comboBoxRef","open","setOpen","current","contains","handleOnKeyDown","key","stopPropagation","focus","blur","emptyAction","handleChange","selectedValue","onOpen","handleRenderOption","option","props","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","handleBlur","renderChipAdornment","index","avatarProps","leftAdornment","undefined","Array","isArray","includes","newSelected","filter","item","autoSize","length","startAdornment","elements","total","forEach","isGrouped","push","groupedOptions","o","_index","hidden","splice","showXIcon","hasSelected","display","flex","alignSelf","width","children","zIndex","clientWidth","displayName"],"mappings":"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","sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useEffect,\n  useRef,\n  useMemo,\n  Fragment,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport {\n  IAutocompleteProps,\n  isOptionGroup,\n} from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps, IOptionItemProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n  StyledComboBoxCloseSmallIcon,\n  StyledComboBoxCollapseExpandSingleIcon,\n  StyledComboBoxInput,\n  StyledComboBoxList,\n  StyledChipWrapper,\n} from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { InputAdornment } from \"../Input/InputAdornment\";\nimport { Checkbox } from \"../Checkbox\";\nimport { Chip } from \"../Chip\";\nimport { StyledInput, StyledInputWrapper } from \"../Input/Styles\";\nimport { useOnClickOutside } from \"../../hooks/useOnClickOutside\";\nimport { Avatar, IAvatar } from \"../Avatar\";\nimport { Trigger } from \"../Trigger\";\nimport { Typography } from \"../Typography/Typography\";\nimport tw from \"twin.macro\";\nimport { Portal } from \"../../helpers\";\nimport { ConditionalWrapper } from \"../../helpers/ConditionWrapper/ConditionWrapper\";\nimport classNames from \"classnames\";\n\nexport interface IComboBoxProps\n  extends Omit<IAutocompleteProps, \"handleChange\" | \"inputEl\"> {\n  /** Set combobox in to loading state */\n  loading?: boolean;\n  /** Text to display while in loading state */\n  loadingText?: string;\n  /** onChange callback */\n  onChange?: (\n    e: (string | number)[] | string | number | null | undefined\n  ) => void;\n  /** Placeholder for Select input */\n  placeholder?: string;\n  /** disable Input element */\n  disabled?: boolean;\n  /** Combobox size */\n  size?: InputSize;\n  /** Invalid state */\n  invalid?: boolean;\n  /** Render Chip */\n  renderChip?: <T extends IOptionItemProps>(\n    item: T,\n    key?: string | number\n  ) => JSX.Element;\n  /** Close menu on change */\n  forceCloseMenu?: boolean;\n  /** Limit chips */\n  limitChips?: number;\n  /** Hidden number text */\n  hiddenNumberText?: (hidden: number) => string;\n  /** Render Autocomplete in <Portal> */\n  inPortal?: boolean;\n  /** inputWrapperClassName */\n  inputWrapperClassName?: string;\n}\n\nexport const ComboBox: FC<IComboBoxProps> = ({\n  options = [],\n  selected,\n  loading = false,\n  loadingText,\n  onChange,\n  placeholder,\n  handleEmptyAction,\n  disabled = false,\n  size = \"regular\",\n  invalid = false,\n  type = \"single\",\n  renderChip,\n  forceCloseMenu = type === \"single\",\n  renderOption,\n  limitChips = 2,\n  hiddenNumberText,\n  inPortal = false,\n  inputWrapperClassName,\n  ...prop\n}) => {\n  const selectedName = useMemo(() => {\n    let value = \"\";\n    if (!selected) {\n      return value;\n    }\n    options.map((v) => {\n      if ((v as IOptionGroupProps)?.options) {\n        return (v as IOptionGroupProps).options.find((q) => {\n          if (q.id === selected) {\n            value = q.name;\n            return;\n          }\n        });\n      } else {\n        if (v.id === selected) {\n          value = v.name;\n          return;\n        }\n      }\n    });\n    return value;\n  }, [options, selected]);\n  const [value, setValue] = useState(selectedName);\n  const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n  const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n  const elementRef = useRef<HTMLInputElement | null>(null);\n  const handleRef = useForkRef(setChildNode, elementRef);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const chipWrapper = useRef<HTMLDivElement>(null);\n  const comboBoxRef = useRef<HTMLDivElement | null>(null);\n\n  const [open, setOpen] = useState(false);\n\n  useOnClickOutside(wrapperRef, (e) => {\n    if (e.target && comboBoxRef.current?.contains(e.target as Node)) {\n      return;\n    }\n    setOpen(false);\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Escape\" && open) {\n        setOpen(false);\n        setValue(selectedName);\n        e.stopPropagation();\n      }\n      if (e.key === \"Enter\" && type === \"multiple\") {\n        setValue(\"\");\n      }\n    },\n    [open, selectedName, type]\n  );\n\n  useEffect(() => {\n    open && childNode?.focus();\n    !open && childNode?.blur();\n  }, [childNode, open]);\n\n  useEffect(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const emptyAction = useCallback(\n    (v) => {\n      handleEmptyAction?.(v);\n      setOpen(false);\n    },\n    [handleEmptyAction]\n  );\n\n  const handleChange = useCallback(\n    (selectedValue) => {\n      onChange?.(selectedValue);\n      if (forceCloseMenu) {\n        setOpen(false);\n      }\n    },\n    [forceCloseMenu, onChange]\n  );\n\n  const onOpen = useCallback(() => {\n    if (!disabled) {\n      setOpen(true);\n    }\n  }, [disabled]);\n\n  const handleRenderOption = useCallback(\n    (option, props) => {\n      if (typeof renderOption === \"function\") {\n        return renderOption(option, props);\n      }\n      if (type === \"multiple\") {\n        return (\n          <>\n            <OptionContent\n              imageUrl={option.image}\n              color={option.color}\n              textColor={option.textColor}\n              name={option.name}\n            />\n            <Checkbox {...props} />\n          </>\n        );\n      }\n      return (\n        <>\n          <OptionContent\n            imageUrl={option.image}\n            color={option.color}\n            textColor={option.textColor}\n            name={option.name}\n          />\n          <RadioButton {...props} />\n        </>\n      );\n    },\n    [type, renderOption]\n  );\n\n  const handleDeselect = useCallback(\n    (e) => {\n      e.stopPropagation();\n      if (type === \"multiple\") {\n        onChange?.([]);\n      } else {\n        onChange?.(\"\");\n      }\n\n      setOpen(false);\n    },\n    [type, onChange]\n  );\n\n  const handleMouseDown = useCallback((e) => {\n    e.preventDefault();\n  }, []);\n\n  const handleBlur = useCallback(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const renderChipAdornment = useCallback(\n    (option, index) => {\n      if (typeof renderChip === \"function\") {\n        return renderChip(option, index);\n      }\n      const avatarProps: Partial<IAvatar> = {\n        size: 18,\n      };\n      switch (size) {\n        case \"big\":\n          avatarProps.size = 22;\n          break;\n        case \"small\":\n          avatarProps.size = 14;\n          break;\n      }\n      const leftAdornment = option.image ? (\n        <Avatar\n          css={`\n            ${tw`tw-my-0.5`}\n            ${tw`tw-mr-0.5`}\n          `}\n          url={option.image}\n          {...avatarProps}\n        />\n      ) : undefined;\n\n      return (\n        <Chip\n          className={\"c-combo-box-chip\"}\n          leftAdornment={leftAdornment}\n          label={option.name}\n          key={index}\n          onClose={\n            !disabled\n              ? (e) => {\n                  e.preventDefault();\n                  e.stopPropagation();\n                  if (Array.isArray(selected) && selected.includes(option.id)) {\n                    if (typeof onChange === \"function\") {\n                      const newSelected = selected.filter(\n                        (item) => item !== option.id\n                      );\n                      onChange(newSelected);\n                    }\n                  }\n                }\n              : undefined\n          }\n          size={size}\n        />\n      );\n    },\n    [disabled, onChange, renderChip, selected, size]\n  );\n\n  const autoSize = useMemo(() => {\n    if (\n      type === \"multiple\" &&\n      open &&\n      Array.isArray(selected) &&\n      selected.length > 1\n    ) {\n      return \"auto\";\n    }\n    return size;\n  }, [open, selected, size, type]);\n\n  const startAdornment = useMemo(() => {\n    if (type === \"multiple\" && Array.isArray(selected) && selected.length > 0) {\n      const elements: JSX.Element[] = [];\n      let total = 0;\n      options.forEach((option, index) => {\n        const isGrouped = isOptionGroup(option);\n        if (selected.includes(option.id) && !isGrouped) {\n          total = total + 1;\n          elements.push(renderChipAdornment(option, index));\n        } else if (isGrouped) {\n          const groupedOptions = option.options.filter((o) =>\n            selected.includes(o.id)\n          );\n          total = total + groupedOptions.length;\n          if (groupedOptions.length > 0) {\n            groupedOptions.forEach((o, _index) => {\n              elements.push(renderChipAdornment(o, `${index}_${_index}`));\n            });\n          }\n        }\n      });\n      let hidden = 0;\n      if (!open && limitChips > 0 && elements.length > limitChips) {\n        hidden = elements.splice(\n          limitChips,\n          elements.length - limitChips\n        ).length;\n      }\n\n      return (\n        <Fragment>\n          {elements}\n          {hidden > 0 && (\n            <Typography\n              variant={\n                size === \"small\"\n                  ? \"Caption 1\"\n                  : size === \"regular\"\n                  ? \"Body 2\"\n                  : \"Body 1\"\n              }\n              css={`\n                display: flex;\n                flex-shrink: 0;\n                align-items: center;\n              `}\n            >\n              {typeof hiddenNumberText === \"function\"\n                ? hiddenNumberText(hidden)\n                : `+${hidden}`}\n            </Typography>\n          )}\n        </Fragment>\n      );\n    }\n    return undefined;\n  }, [\n    type,\n    selected,\n    options,\n    open,\n    limitChips,\n    hiddenNumberText,\n    renderChipAdornment,\n    size,\n  ]);\n\n  const showXIcon =\n    Array.isArray(selected) && type === \"multiple\" && selected.length > 0;\n\n  const hasSelected =\n    type === \"multiple\" && Array.isArray(selected) && selected.length > 0;\n\n  return (\n    <div className=\"c-combo-box\">\n      {type === \"multiple\" ? (\n        <>\n          <StyledInputWrapper\n            $size={size}\n            $invalid={invalid}\n            ref={comboBoxRef}\n            css={`\n              display: flex;\n              justify-content: space-between;\n              flex: 1;\n              height: ${autoSize === \"auto\" ? \"auto\" : undefined};\n            `}\n            className={classNames(\n              \"c-combo-box-input-wrapper\",\n              inputWrapperClassName\n            )}\n            onClick={() => {\n              elementRef.current?.focus();\n            }}\n          >\n            <StyledChipWrapper\n              $autoSize={autoSize}\n              $open={open}\n              ref={chipWrapper}\n            >\n              {startAdornment}\n              <StyledInput\n                className={\"c-combo-box-input\"}\n                onBlur={handleBlur}\n                onFocus={onOpen}\n                ref={handleRef}\n                value={loading && loadingText ? loadingText : value}\n                onKeyDown={handleOnKeyDown}\n                onChange={handleOnChange}\n                placeholder={!hasSelected ? placeholder : undefined}\n                disabled={disabled}\n                $size={size}\n                $loading={loading}\n                style={{\n                  display: \"flex\",\n                  flex: 1,\n                  alignSelf: \"center\",\n                  width: autoSize === \"auto\" ? \"auto\" : \"100%\",\n                }}\n              />\n            </StyledChipWrapper>\n            {!disabled && (\n              <>\n                {loading ? (\n                  <SpinnerLoader />\n                ) : (\n                  <>\n                    {showXIcon && (\n                      <Trigger\n                        onMouseDown={handleMouseDown}\n                        onClick={handleDeselect}\n                        data-testid={\"deselect-all\"}\n                        css={`\n                          display: flex;\n                          justify-content: center;\n                        `}\n                      >\n                        <StyledComboBoxCloseSmallIcon />\n                      </Trigger>\n                    )}\n                    <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n                  </>\n                )}\n              </>\n            )}\n          </StyledInputWrapper>\n        </>\n      ) : (\n        <StyledComboBoxInput\n          className={classNames(\"c-combo-box-input\", inputWrapperClassName)}\n          onBlur={handleBlur}\n          onFocus={onOpen}\n          wrapRef={comboBoxRef}\n          ref={handleRef}\n          value={loading && loadingText ? loadingText : value}\n          onKeyDown={handleOnKeyDown}\n          onChange={handleOnChange}\n          placeholder={placeholder}\n          disabled={disabled}\n          size={size}\n          invalid={invalid}\n          $loading={loading}\n          startAdornment={startAdornment}\n          endAdornment={\n            !disabled ? (\n              <InputAdornment disablePointerEvents={disabled}>\n                {loading ? (\n                  <SpinnerLoader />\n                ) : selected ? (\n                  <Button\n                    onMouseDown={handleMouseDown}\n                    onClick={handleDeselect}\n                    variant=\"text gray\"\n                    size=\"small\"\n                  >\n                    <StyledComboBoxCloseSmallIcon />\n                  </Button>\n                ) : null}\n                <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n              </InputAdornment>\n            ) : null\n          }\n        />\n      )}\n\n      {!disabled ? (\n        <ConditionalWrapper\n          condition={inPortal}\n          wrap={(children) => <Portal>{children}</Portal>}\n        >\n          <Popper\n            anchorEl={comboBoxRef.current}\n            open={open}\n            placement=\"bottom\"\n            style={{\n              zIndex: 10,\n              width: comboBoxRef.current?.clientWidth,\n            }}\n            ref={wrapperRef}\n            strategy={\"fixed\"}\n          >\n            <RemoveScroll noIsolation allowPinchZoom>\n              <StyledComboBoxList $width={comboBoxRef.current?.clientWidth}>\n                <Autocomplete\n                  {...prop}\n                  inputEl={childNode}\n                  selected={selected}\n                  handleChange={handleChange}\n                  renderOption={handleRenderOption}\n                  options={options}\n                  type={type}\n                  handleEmptyAction={emptyAction}\n                />\n              </StyledComboBoxList>\n            </RemoveScroll>\n          </Popper>\n        </ConditionalWrapper>\n      ) : null}\n    </div>\n  );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"file":"ComboBox.js"}
+{"version":3,"sources":["../../../../src/components/ComboBox/ComboBox.tsx"],"names":["ComboBox","options","selected","loading","loadingText","onChange","placeholder","handleEmptyAction","disabled","size","invalid","type","renderChip","forceCloseMenu","renderOption","limitChips","hiddenNumberText","inPortal","inputWrapperClassName","scrollWrapper","prop","selectedName","value","map","v","find","q","id","name","setValue","handleOnChange","e","target","childNode","setChildNode","elementRef","handleRef","wrapperRef","chipWrapper","comboBoxRef","open","setOpen","current","contains","handleOnKeyDown","key","stopPropagation","focus","blur","emptyAction","handleChange","selectedValue","onOpen","handleRenderOption","option","props","image","color","textColor","handleDeselect","handleMouseDown","preventDefault","handleBlur","renderChipAdornment","index","avatarProps","leftAdornment","undefined","onClose","Array","isArray","includes","newSelected","filter","item","showOnClose","Boolean","autoSize","length","startAdornment","elements","total","forEach","isGrouped","push","groupedOptions","o","_index","hidden","splice","showXIcon","hasSelected","display","flex","alignSelf","width","children","zIndex","clientWidth","displayName"],"mappings":"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","sourcesContent":["import React, {\n  FC,\n  useCallback,\n  useState,\n  useEffect,\n  useRef,\n  useMemo,\n  Fragment,\n} from \"react\";\nimport { RadioButton } from \"../RadioButton\";\nimport { Autocomplete } from \"../Autocomplete\";\nimport { Button } from \"../Button/Button\";\nimport {\n  IAutocompleteProps,\n  isOptionGroup,\n} from \"../Autocomplete/Autocomplete\";\nimport useForkRef from \"../../utils/useForkRef\";\nimport { Popper } from \"../Popper\";\nimport { IOptionGroupProps, IOptionItemProps } from \"../Select\";\nimport { RemoveScroll } from \"react-remove-scroll\";\nimport { SpinnerLoader } from \"../Loaders/Spinner/SpinnerLoader\";\nimport { OptionContent } from \"../Select/OptionContent/OptionContent\";\nimport {\n  StyledComboBoxCloseSmallIcon,\n  StyledComboBoxCollapseExpandSingleIcon,\n  StyledComboBoxInput,\n  StyledComboBoxList,\n  StyledChipWrapper,\n} from \"./Styles\";\nimport { InputSize } from \"../Input/types\";\nimport { InputAdornment } from \"../Input/InputAdornment\";\nimport { Checkbox } from \"../Checkbox\";\nimport { Chip } from \"../Chip\";\nimport { StyledInput, StyledInputWrapper } from \"../Input/Styles\";\nimport { useOnClickOutside } from \"../../hooks/useOnClickOutside\";\nimport { Avatar, IAvatar } from \"../Avatar\";\nimport { Trigger } from \"../Trigger\";\nimport { Typography } from \"../Typography/Typography\";\nimport tw from \"twin.macro\";\nimport { Portal } from \"../../helpers\";\nimport { ConditionalWrapper } from \"../../helpers/ConditionWrapper/ConditionWrapper\";\nimport classNames from \"classnames\";\n\nexport interface IComboBoxProps\n  extends Omit<IAutocompleteProps, \"handleChange\" | \"inputEl\"> {\n  /** Set combobox in to loading state */\n  loading?: boolean;\n  /** Text to display while in loading state */\n  loadingText?: string;\n  /** onChange callback */\n  onChange?: (\n    e: (string | number)[] | string | number | null | undefined\n  ) => void;\n  /** Placeholder for Select input */\n  placeholder?: string;\n  /** disable Input element */\n  disabled?: boolean;\n  /** Combobox size */\n  size?: InputSize;\n  /** Invalid state */\n  invalid?: boolean;\n  /** Render Chip */\n  renderChip?: <T extends IOptionItemProps>(\n    item: T,\n    key?: string | number\n  ) => JSX.Element;\n  /** Close menu on change */\n  forceCloseMenu?: boolean;\n  /** Limit chips */\n  limitChips?: number;\n  /** Hidden number text */\n  hiddenNumberText?: (hidden: number) => string;\n  /** Render Autocomplete in <Portal> */\n  inPortal?: boolean;\n  /** inputWrapperClassName */\n  inputWrapperClassName?: string;\n  /** scrollWrapper */\n  scrollWrapper?: boolean;\n}\n\nexport const ComboBox: FC<IComboBoxProps> = ({\n  options = [],\n  selected,\n  loading = false,\n  loadingText,\n  onChange,\n  placeholder,\n  handleEmptyAction,\n  disabled = false,\n  size = \"regular\",\n  invalid = false,\n  type = \"single\",\n  renderChip,\n  forceCloseMenu = type === \"single\",\n  renderOption,\n  limitChips = 2,\n  hiddenNumberText,\n  inPortal = false,\n  inputWrapperClassName,\n  scrollWrapper,\n  ...prop\n}) => {\n  const selectedName = useMemo(() => {\n    let value = \"\";\n    if (!selected) {\n      return value;\n    }\n    options.map((v) => {\n      if ((v as IOptionGroupProps)?.options) {\n        return (v as IOptionGroupProps).options.find((q) => {\n          if (q.id === selected) {\n            value = q.name;\n            return;\n          }\n        });\n      } else {\n        if (v.id === selected) {\n          value = v.name;\n          return;\n        }\n      }\n    });\n    return value;\n  }, [options, selected]);\n  const [value, setValue] = useState(selectedName);\n  const handleOnChange = useCallback((e) => setValue(e.target.value), []);\n  const [childNode, setChildNode] = useState<HTMLInputElement | null>();\n  const elementRef = useRef<HTMLInputElement | null>(null);\n  const handleRef = useForkRef(setChildNode, elementRef);\n  const wrapperRef = useRef<HTMLDivElement>(null);\n  const chipWrapper = useRef<HTMLDivElement>(null);\n  const comboBoxRef = useRef<HTMLDivElement | null>(null);\n\n  const [open, setOpen] = useState(false);\n\n  useOnClickOutside(wrapperRef, (e) => {\n    if (e.target && comboBoxRef.current?.contains(e.target as Node)) {\n      return;\n    }\n    setOpen(false);\n  });\n\n  const handleOnKeyDown = useCallback(\n    (e) => {\n      if (e.key === \"Escape\" && open) {\n        setOpen(false);\n        setValue(selectedName);\n        e.stopPropagation();\n      }\n      if (e.key === \"Enter\" && type === \"multiple\") {\n        setValue(\"\");\n      }\n    },\n    [open, selectedName, type]\n  );\n\n  useEffect(() => {\n    open && childNode?.focus();\n    !open && childNode?.blur();\n  }, [childNode, open]);\n\n  useEffect(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const emptyAction = useCallback(\n    (v) => {\n      handleEmptyAction?.(v);\n      setOpen(false);\n    },\n    [handleEmptyAction]\n  );\n\n  const handleChange = useCallback(\n    (selectedValue) => {\n      onChange?.(selectedValue);\n      if (forceCloseMenu) {\n        setOpen(false);\n      }\n    },\n    [forceCloseMenu, onChange]\n  );\n\n  const onOpen = useCallback(() => {\n    if (!disabled) {\n      setOpen(true);\n    }\n  }, [disabled]);\n\n  const handleRenderOption = useCallback(\n    (option, props) => {\n      if (typeof renderOption === \"function\") {\n        return renderOption(option, props);\n      }\n      if (type === \"multiple\") {\n        return (\n          <>\n            <OptionContent\n              imageUrl={option.image}\n              color={option.color}\n              textColor={option.textColor}\n              name={option.name}\n            />\n            <Checkbox {...props} />\n          </>\n        );\n      }\n      return (\n        <>\n          <OptionContent\n            imageUrl={option.image}\n            color={option.color}\n            textColor={option.textColor}\n            name={option.name}\n          />\n          <RadioButton {...props} />\n        </>\n      );\n    },\n    [type, renderOption]\n  );\n\n  const handleDeselect = useCallback(\n    (e) => {\n      e.stopPropagation();\n      if (type === \"multiple\") {\n        onChange?.([]);\n      } else {\n        onChange?.(\"\");\n      }\n\n      setOpen(false);\n    },\n    [type, onChange]\n  );\n\n  const handleMouseDown = useCallback((e) => {\n    e.preventDefault();\n  }, []);\n\n  const handleBlur = useCallback(() => {\n    setValue(selectedName);\n  }, [selectedName]);\n\n  const renderChipAdornment = useCallback(\n    (option, index) => {\n      if (typeof renderChip === \"function\") {\n        return renderChip(option, index);\n      }\n      const avatarProps: Partial<IAvatar> = {\n        size: 18,\n      };\n      switch (size) {\n        case \"big\":\n          avatarProps.size = 22;\n          break;\n        case \"small\":\n          avatarProps.size = 14;\n          break;\n      }\n      const leftAdornment = option.image ? (\n        <Avatar\n          css={`\n            ${tw`tw-my-0.5`}\n            ${tw`tw-mr-0.5`}\n          `}\n          url={option.image}\n          {...avatarProps}\n        />\n      ) : undefined;\n\n      const onClose = (e) => {\n        e.preventDefault();\n        e.stopPropagation();\n        if (Array.isArray(selected) && selected.includes(option.id)) {\n          if (typeof onChange === \"function\") {\n            const newSelected = selected.filter((item) => item !== option.id);\n            onChange(newSelected);\n          }\n        }\n      };\n\n      let showOnClose = true;\n      if (disabled) {\n        showOnClose = false;\n      }\n      if (option.color) {\n        showOnClose = false;\n      }\n\n      return (\n        <Chip\n          className={\"c-combo-box-chip\"}\n          leftAdornment={leftAdornment}\n          label={option.name}\n          key={index}\n          backgroundColor={option.color}\n          isLabel={Boolean(option.color)}\n          onClose={showOnClose ? onClose : undefined}\n          size={size}\n        />\n      );\n    },\n    [disabled, onChange, renderChip, selected, size]\n  );\n\n  const autoSize = useMemo(() => {\n    if (\n      type === \"multiple\" &&\n      open &&\n      Array.isArray(selected) &&\n      selected.length > 1\n    ) {\n      return \"auto\";\n    }\n    return size;\n  }, [open, selected, size, type]);\n\n  const startAdornment = useMemo(() => {\n    if (type === \"multiple\" && Array.isArray(selected) && selected.length > 0) {\n      const elements: JSX.Element[] = [];\n      let total = 0;\n      options.forEach((option, index) => {\n        const isGrouped = isOptionGroup(option);\n        if (selected.includes(option.id) && !isGrouped) {\n          total = total + 1;\n          elements.push(renderChipAdornment(option, index));\n        } else if (isGrouped) {\n          const groupedOptions = option.options.filter((o) =>\n            selected.includes(o.id)\n          );\n          total = total + groupedOptions.length;\n          if (groupedOptions.length > 0) {\n            groupedOptions.forEach((o, _index) => {\n              elements.push(renderChipAdornment(o, `${index}_${_index}`));\n            });\n          }\n        }\n      });\n      let hidden = 0;\n      if (!open && limitChips > 0 && elements.length > limitChips) {\n        hidden = elements.splice(\n          limitChips,\n          elements.length - limitChips\n        ).length;\n      }\n\n      return (\n        <Fragment>\n          {elements}\n          {hidden > 0 && (\n            <Typography\n              variant={\n                size === \"small\"\n                  ? \"Caption 1\"\n                  : size === \"regular\"\n                  ? \"Body 2\"\n                  : \"Body 1\"\n              }\n              css={`\n                display: flex;\n                flex-shrink: 0;\n                align-items: center;\n              `}\n            >\n              {typeof hiddenNumberText === \"function\"\n                ? hiddenNumberText(hidden)\n                : `+${hidden}`}\n            </Typography>\n          )}\n        </Fragment>\n      );\n    }\n    return undefined;\n  }, [\n    type,\n    selected,\n    options,\n    open,\n    limitChips,\n    hiddenNumberText,\n    renderChipAdornment,\n    size,\n  ]);\n\n  const showXIcon =\n    Array.isArray(selected) && type === \"multiple\" && selected.length > 0;\n\n  const hasSelected =\n    type === \"multiple\" && Array.isArray(selected) && selected.length > 0;\n\n  return (\n    <div className=\"c-combo-box\">\n      {type === \"multiple\" ? (\n        <>\n          <StyledInputWrapper\n            $size={size}\n            $invalid={invalid}\n            ref={comboBoxRef}\n            css={`\n              display: flex;\n              justify-content: space-between;\n              flex: 1;\n              height: ${autoSize === \"auto\" ? \"auto\" : undefined};\n              overflow-y: ${autoSize === \"auto\" && scrollWrapper\n                ? \"scroll\"\n                : undefined};\n              max-height: ${autoSize === \"auto\" && scrollWrapper\n                ? \"80px\"\n                : undefined};\n            `}\n            className={classNames(\n              \"c-combo-box-input-wrapper\",\n              inputWrapperClassName\n            )}\n            onClick={() => {\n              elementRef.current?.focus();\n            }}\n          >\n            <StyledChipWrapper\n              $autoSize={autoSize}\n              $open={open}\n              ref={chipWrapper}\n            >\n              {startAdornment}\n              <StyledInput\n                className={\"c-combo-box-input\"}\n                onBlur={handleBlur}\n                onFocus={onOpen}\n                ref={handleRef}\n                value={loading && loadingText ? loadingText : value}\n                onKeyDown={handleOnKeyDown}\n                onChange={handleOnChange}\n                placeholder={!hasSelected ? placeholder : undefined}\n                disabled={disabled}\n                $size={size}\n                $loading={loading}\n                style={{\n                  display: \"flex\",\n                  flex: 1,\n                  alignSelf: \"center\",\n                  width: autoSize === \"auto\" ? \"auto\" : \"100%\",\n                }}\n              />\n            </StyledChipWrapper>\n            {!disabled && (\n              <>\n                {loading ? (\n                  <SpinnerLoader />\n                ) : (\n                  <>\n                    {showXIcon && (\n                      <Trigger\n                        onMouseDown={handleMouseDown}\n                        onClick={handleDeselect}\n                        data-testid={\"deselect-all\"}\n                        css={`\n                          display: flex;\n                          justify-content: center;\n                        `}\n                      >\n                        <StyledComboBoxCloseSmallIcon />\n                      </Trigger>\n                    )}\n                    <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n                  </>\n                )}\n              </>\n            )}\n          </StyledInputWrapper>\n        </>\n      ) : (\n        <StyledComboBoxInput\n          className={classNames(\"c-combo-box-input\", inputWrapperClassName)}\n          onBlur={handleBlur}\n          onFocus={onOpen}\n          wrapRef={comboBoxRef}\n          ref={handleRef}\n          value={loading && loadingText ? loadingText : value}\n          onKeyDown={handleOnKeyDown}\n          onChange={handleOnChange}\n          placeholder={placeholder}\n          disabled={disabled}\n          size={size}\n          invalid={invalid}\n          $loading={loading}\n          startAdornment={startAdornment}\n          endAdornment={\n            !disabled ? (\n              <InputAdornment disablePointerEvents={disabled}>\n                {loading ? (\n                  <SpinnerLoader />\n                ) : selected ? (\n                  <Button\n                    onMouseDown={handleMouseDown}\n                    onClick={handleDeselect}\n                    variant=\"text gray\"\n                    size=\"small\"\n                  >\n                    <StyledComboBoxCloseSmallIcon />\n                  </Button>\n                ) : null}\n                <StyledComboBoxCollapseExpandSingleIcon $open={open} />\n              </InputAdornment>\n            ) : null\n          }\n        />\n      )}\n\n      {!disabled ? (\n        <ConditionalWrapper\n          condition={inPortal}\n          wrap={(children) => <Portal>{children}</Portal>}\n        >\n          <Popper\n            anchorEl={comboBoxRef.current}\n            open={open}\n            placement=\"bottom\"\n            style={{\n              zIndex: 10,\n              width: comboBoxRef.current?.clientWidth,\n            }}\n            ref={wrapperRef}\n            strategy={\"fixed\"}\n          >\n            <RemoveScroll noIsolation allowPinchZoom>\n              <StyledComboBoxList $width={comboBoxRef.current?.clientWidth}>\n                <Autocomplete\n                  {...prop}\n                  inputEl={childNode}\n                  selected={selected}\n                  handleChange={handleChange}\n                  renderOption={handleRenderOption}\n                  options={options}\n                  type={type}\n                  handleEmptyAction={emptyAction}\n                />\n              </StyledComboBoxList>\n            </RemoveScroll>\n          </Popper>\n        </ConditionalWrapper>\n      ) : null}\n    </div>\n  );\n};\n\nComboBox.displayName = \"ComboBox\";\n"],"file":"ComboBox.js"}

package/dist/cjs/components/Entity/EntityCard.js

@@ -15,8 +15,12 @@ var _Card = require("../Card");
 
 var _EntityGroup = require("./EntityGroup");
 
+var _classnames = _interopRequireDefault(require("classnames"));
+
 var _excluded = ["children", "isCollection", "background", "className", "as"];
 
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -38,6 +42,7 @@ var EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
   var _useContext = (0, _react.useContext)(_EntityGroup.EntityGroupContext),
       renderAs = _useContext.renderAs;
 
+  var classSuffix = "c-entity-card-".concat(renderAs);
   var paperType = renderAs === "grid" ? "paper-1" : "paper-2";
   var Component = as || _Card.Card;
   return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityCard, _extends({
@@ -45,7 +50,7 @@ var EntityCard = /*#__PURE__*/(0, _react.forwardRef)(function (_ref, ref) {
     $renderAs: renderAs,
     $background: background,
     paperType: paperType,
-    className: className,
+    className: (0, _classnames.default)("c-entity-card", classSuffix, className),
     $isCollection: isCollection
   }, rest, {
     ref: ref

package/dist/cjs/components/Entity/EntityCard.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["EntityCard","ref","children","isCollection","background","className","as","rest","EntityGroupContext","renderAs","paperType","Component","Card","displayName"],"mappings":";;;;;;;;;AAAA;;AAOA;;AAEA;;AAKA;;;;;;;;;;;;;;AAsBO,IAAMA,UAAsD,gBACjE,uBACE,gBASEC,GATF,EAUK;AAAA,MARDC,QAQC,QARDA,QAQC;AAAA,MAPDC,YAOC,QAPDA,YAOC;AAAA,MANDC,UAMC,QANDA,UAMC;AAAA,MALDC,SAKC,QALDA,SAKC;AAAA,MAJDC,EAIC,QAJDA,EAIC;AAAA,MAHEC,IAGF;;AACH,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,MAAMC,SAAS,GAAGD,QAAQ,KAAK,MAAb,GAAsB,SAAtB,GAAkC,SAApD;AACA,MAAME,SAAS,GAAGL,EAAE,IAAIM,UAAxB;AACA,sBACE,6BAAC,wBAAD;AACE,IAAA,EAAE,EAAED,SADN;AAEE,IAAA,SAAS,EAAEF,QAFb;AAGE,IAAA,WAAW,EAAEL,UAHf;AAIE,IAAA,SAAS,EAAEM,SAJb;AAKE,IAAA,SAAS,EAAEL,SALb;AAME,IAAA,aAAa,EAAEF;AANjB,KAOMI,IAPN;AAQE,IAAA,GAAG,EAAEN;AARP,MAUGC,QAVH,CADF;AAcD,CA7BH,CADK;;AAiCPF,UAAU,CAACa,WAAX,GAAyB,YAAzB","sourcesContent":["import React, {\n  BaseHTMLAttributes,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  useContext,\n} from \"react\";\nimport { StyledEntityCard } from \"./Styles\";\n\nimport { Card, ICardProps } from \"../Card\";\nimport {\n  PolymorphicComponentPropsWithRef,\n  PolymorphicRef,\n} from \"../../utils/types\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport interface IEntityCardProps\n  extends ICardProps,\n    BaseHTMLAttributes<HTMLElement> {\n  /** ClassName to add on Card */\n  className?: string;\n  /** Show as group of Cards on grid */\n  isCollection?: boolean;\n  /** Background color to override for Card */\n  background?: string;\n  /** CSSProperties to override for Card */\n  style?: CSSProperties;\n}\n\nexport type EntityCardProps<C extends React.ElementType> =\n  PolymorphicComponentPropsWithRef<C, IEntityCardProps>;\n\nexport type EntityComponent = <C extends React.ElementType = typeof Card>(\n  props: EntityCardProps<C>\n) => ReactElement | null;\n\nexport const EntityCard: EntityComponent & { displayName?: string } =\n  forwardRef(\n    <C extends React.ElementType = typeof Card>(\n      {\n        children,\n        isCollection,\n        background,\n        className,\n        as,\n        ...rest\n      }: EntityCardProps<C>,\n      ref?: PolymorphicRef<C>\n    ) => {\n      const { renderAs } = useContext(EntityGroupContext);\n      const paperType = renderAs === \"grid\" ? \"paper-1\" : \"paper-2\";\n      const Component = as || Card;\n      return (\n        <StyledEntityCard\n          as={Component}\n          $renderAs={renderAs}\n          $background={background}\n          paperType={paperType}\n          className={className}\n          $isCollection={isCollection}\n          {...rest}\n          ref={ref}\n        >\n          {children}\n        </StyledEntityCard>\n      );\n    }\n  );\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}
+{"version":3,"sources":["../../../../src/components/Entity/EntityCard.tsx"],"names":["EntityCard","ref","children","isCollection","background","className","as","rest","EntityGroupContext","renderAs","classSuffix","paperType","Component","Card","displayName"],"mappings":";;;;;;;;;AAAA;;AAOA;;AAEA;;AAKA;;AACA;;;;;;;;;;;;;;;;AAsBO,IAAMA,UAAsD,gBACjE,uBACE,gBASEC,GATF,EAUK;AAAA,MARDC,QAQC,QARDA,QAQC;AAAA,MAPDC,YAOC,QAPDA,YAOC;AAAA,MANDC,UAMC,QANDA,UAMC;AAAA,MALDC,SAKC,QALDA,SAKC;AAAA,MAJDC,EAIC,QAJDA,EAIC;AAAA,MAHEC,IAGF;;AACH,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,MAAMC,WAAW,2BAAoBD,QAApB,CAAjB;AACA,MAAME,SAAS,GAAGF,QAAQ,KAAK,MAAb,GAAsB,SAAtB,GAAkC,SAApD;AACA,MAAMG,SAAS,GAAGN,EAAE,IAAIO,UAAxB;AACA,sBACE,6BAAC,wBAAD;AACE,IAAA,EAAE,EAAED,SADN;AAEE,IAAA,SAAS,EAAEH,QAFb;AAGE,IAAA,WAAW,EAAEL,UAHf;AAIE,IAAA,SAAS,EAAEO,SAJb;AAKE,IAAA,SAAS,EAAE,yBAAW,eAAX,EAA4BD,WAA5B,EAAyCL,SAAzC,CALb;AAME,IAAA,aAAa,EAAEF;AANjB,KAOMI,IAPN;AAQE,IAAA,GAAG,EAAEN;AARP,MAUGC,QAVH,CADF;AAcD,CA9BH,CADK;;AAkCPF,UAAU,CAACc,WAAX,GAAyB,YAAzB","sourcesContent":["import React, {\n  BaseHTMLAttributes,\n  CSSProperties,\n  forwardRef,\n  ReactElement,\n  useContext,\n} from \"react\";\nimport { StyledEntityCard } from \"./Styles\";\n\nimport { Card, ICardProps } from \"../Card\";\nimport {\n  PolymorphicComponentPropsWithRef,\n  PolymorphicRef,\n} from \"../../utils/types\";\nimport { EntityGroupContext } from \"./EntityGroup\";\nimport classNames from \"classnames\";\n\nexport interface IEntityCardProps\n  extends ICardProps,\n    BaseHTMLAttributes<HTMLElement> {\n  /** ClassName to add on Card */\n  className?: string;\n  /** Show as group of Cards on grid */\n  isCollection?: boolean;\n  /** Background color to override for Card */\n  background?: string;\n  /** CSSProperties to override for Card */\n  style?: CSSProperties;\n}\n\nexport type EntityCardProps<C extends React.ElementType> =\n  PolymorphicComponentPropsWithRef<C, IEntityCardProps>;\n\nexport type EntityComponent = <C extends React.ElementType = typeof Card>(\n  props: EntityCardProps<C>\n) => ReactElement | null;\n\nexport const EntityCard: EntityComponent & { displayName?: string } =\n  forwardRef(\n    <C extends React.ElementType = typeof Card>(\n      {\n        children,\n        isCollection,\n        background,\n        className,\n        as,\n        ...rest\n      }: EntityCardProps<C>,\n      ref?: PolymorphicRef<C>\n    ) => {\n      const { renderAs } = useContext(EntityGroupContext);\n      const classSuffix = `c-entity-card-${renderAs}`;\n      const paperType = renderAs === \"grid\" ? \"paper-1\" : \"paper-2\";\n      const Component = as || Card;\n      return (\n        <StyledEntityCard\n          as={Component}\n          $renderAs={renderAs}\n          $background={background}\n          paperType={paperType}\n          className={classNames(\"c-entity-card\", classSuffix, className)}\n          $isCollection={isCollection}\n          {...rest}\n          ref={ref}\n        >\n          {children}\n        </StyledEntityCard>\n      );\n    }\n  );\n\nEntityCard.displayName = \"EntityCard\";\n"],"file":"EntityCard.js"}

package/dist/cjs/components/Entity/EntityProperty.js

@@ -39,8 +39,9 @@ var EntityProperty = function EntityProperty(_ref) {
   var _useContext = (0, _react.useContext)(_EntityGroup.EntityGroupContext),
       renderAs = _useContext.renderAs;
 
+  var classSuffix = "c-entity-property-".concat(renderAs);
   return /*#__PURE__*/_react.default.createElement(_Styles.StyledEntityProperty, _extends({
-    className: (0, _classnames.default)("c-entity-property", className)
+    className: (0, _classnames.default)("c-entity-property", classSuffix, className)
   }, props, {
     $order: listOrder,
     $width: listWidth,

package/dist/cjs/components/Entity/EntityProperty.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","EntityGroupContext","renderAs","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAUO,IAAMA,cAAkD,GAAG,SAArDA,cAAqD,OAM5D;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,KACC;;AACJ,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,sBACE,6BAAC,4BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,mBAAX,EAAgCH,SAAhC;AADb,KAEMC,KAFN;AAGE,IAAA,MAAM,EAAEJ,SAHV;AAIE,IAAA,MAAM,EAAEC,SAJV;AAKE,IAAA,sBAAsB,EAAEC,qBAL1B;AAME,IAAA,SAAS,EAAEI;AANb,KADF;AAUD,CAlBM;;;AAoBPP,cAAc,CAACQ,WAAf,GAA6B,gBAA7B","sourcesContent":["import React, { HTMLAttributes, useContext } from \"react\";\nimport { StyledEntityProperty } from \"./Styles\";\nimport classNames from \"classnames\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport type VisibleFromBreakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport interface IEntityCardPropertyProps\n  extends HTMLAttributes<HTMLDivElement> {\n  listOrder?: number;\n  listWidth?: string | number;\n  visibleFromBreakpoint?: VisibleFromBreakpoint;\n}\n\nexport const EntityProperty: React.FC<IEntityCardPropertyProps> = ({\n  listOrder,\n  listWidth,\n  visibleFromBreakpoint,\n  className,\n  ...props\n}) => {\n  const { renderAs } = useContext(EntityGroupContext);\n  return (\n    <StyledEntityProperty\n      className={classNames(\"c-entity-property\", className)}\n      {...props}\n      $order={listOrder}\n      $width={listWidth}\n      $visibleFromBreakpoint={visibleFromBreakpoint}\n      $renderAs={renderAs}\n    />\n  );\n};\n\nEntityProperty.displayName = \"EntityProperty\";\n"],"file":"EntityProperty.js"}
+{"version":3,"sources":["../../../../src/components/Entity/EntityProperty.tsx"],"names":["EntityProperty","listOrder","listWidth","visibleFromBreakpoint","className","props","EntityGroupContext","renderAs","classSuffix","displayName"],"mappings":";;;;;;;;;AAAA;;AACA;;AACA;;AACA;;;;;;;;;;;;;;;;AAUO,IAAMA,cAAkD,GAAG,SAArDA,cAAqD,OAM5D;AAAA,MALJC,SAKI,QALJA,SAKI;AAAA,MAJJC,SAII,QAJJA,SAII;AAAA,MAHJC,qBAGI,QAHJA,qBAGI;AAAA,MAFJC,SAEI,QAFJA,SAEI;AAAA,MADDC,KACC;;AACJ,oBAAqB,uBAAWC,+BAAX,CAArB;AAAA,MAAQC,QAAR,eAAQA,QAAR;;AACA,MAAMC,WAAW,+BAAwBD,QAAxB,CAAjB;AACA,sBACE,6BAAC,4BAAD;AACE,IAAA,SAAS,EAAE,yBAAW,mBAAX,EAAgCC,WAAhC,EAA6CJ,SAA7C;AADb,KAEMC,KAFN;AAGE,IAAA,MAAM,EAAEJ,SAHV;AAIE,IAAA,MAAM,EAAEC,SAJV;AAKE,IAAA,sBAAsB,EAAEC,qBAL1B;AAME,IAAA,SAAS,EAAEI;AANb,KADF;AAUD,CAnBM;;;AAqBPP,cAAc,CAACS,WAAf,GAA6B,gBAA7B","sourcesContent":["import React, { HTMLAttributes, useContext } from \"react\";\nimport { StyledEntityProperty } from \"./Styles\";\nimport classNames from \"classnames\";\nimport { EntityGroupContext } from \"./EntityGroup\";\n\nexport type VisibleFromBreakpoint = \"sm\" | \"md\" | \"lg\" | \"xl\" | \"2xl\";\nexport interface IEntityCardPropertyProps\n  extends HTMLAttributes<HTMLDivElement> {\n  listOrder?: number;\n  listWidth?: string | number;\n  visibleFromBreakpoint?: VisibleFromBreakpoint;\n}\n\nexport const EntityProperty: React.FC<IEntityCardPropertyProps> = ({\n  listOrder,\n  listWidth,\n  visibleFromBreakpoint,\n  className,\n  ...props\n}) => {\n  const { renderAs } = useContext(EntityGroupContext);\n  const classSuffix = `c-entity-property-${renderAs}`;\n  return (\n    <StyledEntityProperty\n      className={classNames(\"c-entity-property\", classSuffix, className)}\n      {...props}\n      $order={listOrder}\n      $width={listWidth}\n      $visibleFromBreakpoint={visibleFromBreakpoint}\n      $renderAs={renderAs}\n    />\n  );\n};\n\nEntityProperty.displayName = \"EntityProperty\";\n"],"file":"EntityProperty.js"}

package/dist/cjs/components/Entity/Styles.js

@@ -41,7 +41,7 @@ var StyledEntityProperty = (0, _styledComponents.default)("div").withConfig({
 })(["", " ", " ", " ", " ", " ", " ", " ", " ", ""], function (_ref4) {
   var $renderAs = _ref4.$renderAs,
       $width = _ref4.$width;
-  return $renderAs === "list" && (0, _styledComponents.css)(["display:flex;align-items:center;min-width:24px;flex:", ";"], $width ? "unset" : 1);
+  return $renderAs === "list" && (0, _styledComponents.css)(["display:flex;align-items:center;min-width:24px;flex:", ";"], $width ? "initial" : 1);
 }, function (props) {
   return props.$renderAs === "list" && props.$order && (0, _styledComponents.css)(["order:", ";"], props.$order);
 }, function (props) {

package/dist/cjs/components/Entity/Styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../../../src/components/Entity/Styles.ts"],"names":["StyledEntityCard","Card","$renderAs","css","props","$background","$isCollection","PaperStyles","displayName","StyledEntityProperty","$width","$order","$visibleFromBreakpoint","StyledEntityGroup","$gap","StyledEntityActions"],"mappings":"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","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Card } from \"../Card\";\nimport { PaperStyles } from \"../Paper/Styles\";\nimport { VisibleFromBreakpoint } from \"./EntityProperty\";\nimport tw from \"twin.macro\";\n\nexport const StyledEntityCard = styled(Card)<{\n  $renderAs: string;\n  $gap?: number;\n  $background?: string;\n  $isCollection?: boolean;\n}>`\n  line-height: 1.375;\n  ${({ $renderAs }) =>\n    $renderAs === \"list\" &&\n    css`\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      min-height: 48px;\n      margin-bottom: 4px;\n      justify-content: space-between;\n      padding: 0 16px 0 16px;\n    `}\n\n  ${({ $renderAs }) =>\n    $renderAs === \"grid\" &&\n    css`\n      display: flex;\n      flex-direction: column;\n      position: relative;\n      padding: 20px 24px;\n      height: 280px;\n    `}\n\n\n  ${(props) =>\n    props.$background &&\n    css`\n      background-color: ${props.$background};\n    `}\n\n  ${({ $isCollection, $background }) =>\n    $isCollection &&\n    css`\n      &::after {\n        display: block;\n        content: \"\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        left: 0;\n        transform: rotate(-3deg);\n        z-index: -1;\n        ${PaperStyles};\n        background-color: ${$background};\n      }\n    `}\n`;\nStyledEntityCard.displayName = \"StyledEntityCard\";\n\nexport const StyledEntityProperty = styled(\"div\")<{\n  $renderAs?: string;\n  $order?: number;\n  $width?: number | string;\n  $visibleFromBreakpoint?: VisibleFromBreakpoint;\n}>`\n  ${({ $renderAs, $width }) =>\n    $renderAs === \"list\" &&\n    css`\n      display: flex;\n      align-items: center;\n      min-width: 24px;\n      flex: ${$width ? \"unset\" : 1};\n    `}\n\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    props.$order &&\n    css`\n      order: ${props.$order};\n    `}\n\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    props.$width &&\n    css`\n      width: ${props.$width};\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint &&\n    css`\n      ${tw`tw-hidden`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"sm\" &&\n    css`\n      ${tw`sm:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"md\" &&\n    css`\n      ${tw`md:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"lg\" &&\n    css`\n      ${tw`lg:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"xl\" &&\n    css`\n      ${tw`xl:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"2xl\" &&\n    css`\n      ${tw`2xl:tw-flex`}\n    `}\n`;\n\nStyledEntityProperty.displayName = \"StyledEntityProperty\";\n\nexport const StyledEntityGroup = styled(\"div\")<{\n  $renderAs: string;\n  $gap?: number;\n}>`\n  ${({ $renderAs, $gap }) =>\n    $renderAs === \"grid\" &&\n    css`\n      display: grid;\n      grid-gap: ${$gap ? `${$gap}px` : \"initial\"};\n      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n    `}\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\nStyledEntityGroup.displayName = \"StyledEntityGroup\";\n\nexport const StyledEntityActions = styled(\"div\")<{ $renderAs?: string }>`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  ${({ $renderAs }) =>\n    $renderAs === \"grid\" &&\n    css`\n      position: absolute;\n      right: 16px;\n      top: 20px;\n    `}\n\n  ${({ $renderAs }) =>\n    $renderAs === \"list\" &&\n    css`\n      justify-self: flex-end;\n    `}\n`;\n"],"file":"Styles.js"}
+{"version":3,"sources":["../../../../src/components/Entity/Styles.ts"],"names":["StyledEntityCard","Card","$renderAs","css","props","$background","$isCollection","PaperStyles","displayName","StyledEntityProperty","$width","$order","$visibleFromBreakpoint","StyledEntityGroup","$gap","StyledEntityActions"],"mappings":"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","sourcesContent":["import styled, { css } from \"styled-components\";\nimport { Card } from \"../Card\";\nimport { PaperStyles } from \"../Paper/Styles\";\nimport { VisibleFromBreakpoint } from \"./EntityProperty\";\nimport tw from \"twin.macro\";\n\nexport const StyledEntityCard = styled(Card)<{\n  $renderAs: string;\n  $gap?: number;\n  $background?: string;\n  $isCollection?: boolean;\n}>`\n  line-height: 1.375;\n  ${({ $renderAs }) =>\n    $renderAs === \"list\" &&\n    css`\n      display: flex;\n      flex-direction: row;\n      align-items: center;\n      min-height: 48px;\n      margin-bottom: 4px;\n      justify-content: space-between;\n      padding: 0 16px 0 16px;\n    `}\n\n  ${({ $renderAs }) =>\n    $renderAs === \"grid\" &&\n    css`\n      display: flex;\n      flex-direction: column;\n      position: relative;\n      padding: 20px 24px;\n      height: 280px;\n    `}\n\n\n  ${(props) =>\n    props.$background &&\n    css`\n      background-color: ${props.$background};\n    `}\n\n  ${({ $isCollection, $background }) =>\n    $isCollection &&\n    css`\n      &::after {\n        display: block;\n        content: \"\";\n        position: absolute;\n        top: 0;\n        bottom: 0;\n        right: 0;\n        left: 0;\n        transform: rotate(-3deg);\n        z-index: -1;\n        ${PaperStyles};\n        background-color: ${$background};\n      }\n    `}\n`;\nStyledEntityCard.displayName = \"StyledEntityCard\";\n\nexport const StyledEntityProperty = styled(\"div\")<{\n  $renderAs?: string;\n  $order?: number;\n  $width?: number | string;\n  $visibleFromBreakpoint?: VisibleFromBreakpoint;\n}>`\n  ${({ $renderAs, $width }) =>\n    $renderAs === \"list\" &&\n    css`\n      display: flex;\n      align-items: center;\n      min-width: 24px;\n      flex: ${$width ? \"initial\" : 1};\n    `}\n\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    props.$order &&\n    css`\n      order: ${props.$order};\n    `}\n\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    props.$width &&\n    css`\n      width: ${props.$width};\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint &&\n    css`\n      ${tw`tw-hidden`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"sm\" &&\n    css`\n      ${tw`sm:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"md\" &&\n    css`\n      ${tw`md:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"lg\" &&\n    css`\n      ${tw`lg:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"xl\" &&\n    css`\n      ${tw`xl:tw-flex`}\n    `}\n  ${({ $visibleFromBreakpoint }) =>\n    $visibleFromBreakpoint === \"2xl\" &&\n    css`\n      ${tw`2xl:tw-flex`}\n    `}\n`;\n\nStyledEntityProperty.displayName = \"StyledEntityProperty\";\n\nexport const StyledEntityGroup = styled(\"div\")<{\n  $renderAs: string;\n  $gap?: number;\n}>`\n  ${({ $renderAs, $gap }) =>\n    $renderAs === \"grid\" &&\n    css`\n      display: grid;\n      grid-gap: ${$gap ? `${$gap}px` : \"initial\"};\n      grid-template-columns: repeat(auto-fill, minmax(260px, 1fr));\n    `}\n  ${(props) =>\n    props.$renderAs === \"list\" &&\n    css`\n      display: flex;\n      flex-direction: column;\n    `}\n`;\nStyledEntityGroup.displayName = \"StyledEntityGroup\";\n\nexport const StyledEntityActions = styled(\"div\")<{ $renderAs?: string }>`\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n\n  ${({ $renderAs }) =>\n    $renderAs === \"grid\" &&\n    css`\n      position: absolute;\n      right: 16px;\n      top: 20px;\n    `}\n\n  ${({ $renderAs }) =>\n    $renderAs === \"list\" &&\n    css`\n      justify-self: flex-end;\n    `}\n`;\n"],"file":"Styles.js"}

package/dist/cjs/components/Select/OptionContent/Styles.js

@@ -9,6 +9,8 @@ exports.StyledOptionText = exports.StyledOptionIndicator = exports.StyledOptionC
 
 var _styledComponents = _interopRequireWildcard(require("styled-components"));
 
+var _Typography = require("../../Typography");
+
 function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
 function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || _typeof(obj) !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
@@ -30,8 +32,7 @@ var StyledOptionIndicator = _styledComponents.default.div.withConfig({
 
 exports.StyledOptionIndicator = StyledOptionIndicator;
 StyledOptionIndicator.displayName = "StyledOptionIndicator";
-
-var StyledOptionText = _styledComponents.default.span.withConfig({
+var StyledOptionText = (0, _styledComponents.default)(_Typography.Body2).withConfig({
   displayName: "Styles__StyledOptionText",
   componentId: "sc-6fiqyy-2"
 })(["", " flex-grow:1;line-height:28px;padding-right:10px;", ""], {
@@ -41,7 +42,6 @@ var StyledOptionText = _styledComponents.default.span.withConfig({
 }, function (props) {
   return props.textColor && (0, _styledComponents.css)(["color:", ";"], props.textColor);
 });
-
 exports.StyledOptionText = StyledOptionText;
 StyledOptionText.displayName = "StyledOptionText";
 

package/dist/cjs/components/Select/OptionContent/Styles.js.map

@@ -1 +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,0HAAhC;;;AAUPF,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,kEACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAKzB,UAACL,KAAD;AAAA,SACAA,KAAK,CAACM,SAAN,QACAH,qBADA,mBAEWH,KAAK,CAACM,SAFjB,CADA;AAAA,CALyB,CAAtB;;;AAYPF,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  height: 100%;\n  flex-grow: 1;\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: 28px;\n  padding-right: 10px;\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"}
+{"version":3,"sources":["../../../../../src/components/Select/OptionContent/Styles.ts"],"names":["StyledOptionContentWrapper","styled","div","displayName","StyledOptionIndicator","props","backgroundColor","children","css","StyledOptionText","Body2","textColor","StyledAdditionalInfo","span"],"mappings":";;;;;;;;;AAAA;;AAEA;;;;;;AAEO,IAAMA,0BAA0B,GAAGC,0BAAOC,GAAV;AAAA;AAAA;AAAA,0HAAhC;;;AAUPF,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,GAAG,+BAAOC,iBAAP,CAAH;AAAA;AAAA;AAAA,kEACvB;AAAA;AAAA;AAAA;AAAA,CADuB,EAKzB,UAACL,KAAD;AAAA,SACAA,KAAK,CAACM,SAAN,QACAH,qBADA,mBAEWH,KAAK,CAACM,SAFjB,CADA;AAAA,CALyB,CAAtB;;AAYPF,gBAAgB,CAACN,WAAjB,GAA+B,kBAA/B;;AAEO,IAAMS,oBAAoB,GAAGX,0BAAOY,IAAV;AAAA;AAAA;AAAA,wDAA1B;;;AAMPD,oBAAoB,CAACT,WAArB,GAAmC,sBAAnC","sourcesContent":["import styled, { css } from \"styled-components\";\nimport tw from \"twin.macro\";\nimport { Body2 } from \"../../Typography\";\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  height: 100%;\n  flex-grow: 1;\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(Body2)<{ textColor?: string }>`\n  ${tw`tw-truncate`}\n  flex-grow: 1;\n  line-height: 28px;\n  padding-right: 10px;\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/esm/components/Chip/Chip.d.ts

@@ -5,6 +5,10 @@ export interface ChipProps {
     onClose?: React.MouseEventHandler<HTMLButtonElement>;
     leftAdornment?: ReactNode;
     size?: InputSize;
+    color?: string;
+    backgroundColor?: string;
+    closeClassName?: string;
+    isLabel?: boolean;
 }
 export declare const Chip: React.ForwardRefExoticComponent<ChipProps & Omit<Pick<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "slot" | "style" | "title" | "key" | "css" | "defaultChecked" | "defaultValue" | "suppressContentEditableWarning" | "suppressHydrationWarning" | "accessKey" | "className" | "contentEditable" | "contextMenu" | "dir" | "draggable" | "hidden" | "id" | "lang" | "placeholder" | "spellCheck" | "tabIndex" | "translate" | "radioGroup" | "role" | "about" | "datatype" | "inlist" | "prefix" | "property" | "resource" | "typeof" | "vocab" | "autoCapitalize" | "autoCorrect" | "autoSave" | "color" | "itemProp" | "itemScope" | "itemType" | "itemID" | "itemRef" | "results" | "security" | "unselectable" | "inputMode" | "is" | "cs" | "aria-activedescendant" | "aria-atomic" | "aria-autocomplete" | "aria-busy" | "aria-checked" | "aria-colcount" | "aria-colindex" | "aria-colspan" | "aria-controls" | "aria-current" | "aria-describedby" | "aria-details" | "aria-disabled" | "aria-dropeffect" | "aria-errormessage" | "aria-expanded" | "aria-flowto" | "aria-grabbed" | "aria-haspopup" | "aria-hidden" | "aria-invalid" | "aria-keyshortcuts" | "aria-label" | "aria-labelledby" | "aria-level" | "aria-live" | "aria-modal" | "aria-multiline" | "aria-multiselectable" | "aria-orientation" | "aria-owns" | "aria-placeholder" | "aria-posinset" | "aria-pressed" | "aria-readonly" | "aria-relevant" | "aria-required" | "aria-roledescription" | "aria-rowcount" | "aria-rowindex" | "aria-rowspan" | "aria-selected" | "aria-setsize" | "aria-sort" | "aria-valuemax" | "aria-valuemin" | "aria-valuenow" | "aria-valuetext" | "children" | "dangerouslySetInnerHTML" | "onCopy" | "onCopyCapture" | "onCut" | "onCutCapture" | "onPaste" | "onPasteCapture" | "onCompositionEnd" | "onCompositionEndCapture" | "onCompositionStart" | "onCompositionStartCapture" | "onCompositionUpdate" | "onCompositionUpdateCapture" | "onFocus" | "onFocusCapture" | "onBlur" | "onBlurCapture" | "onChange" | "onChangeCapture" | "onBeforeInput" | "onBeforeInputCapture" | "onInput" | "onInputCapture" | "onReset" | "onResetCapture" | "onSubmit" | "onSubmitCapture" | "onInvalid" | "onInvalidCapture" | "onLoad" | "onLoadCapture" | "onError" | "onErrorCapture" | "onKeyDown" | "onKeyDownCapture" | "onKeyPress" | "onKeyPressCapture" | "onKeyUp" | "onKeyUpCapture" | "onAbort" | "onAbortCapture" | "onCanPlay" | "onCanPlayCapture" | "onCanPlayThrough" | "onCanPlayThroughCapture" | "onDurationChange" | "onDurationChangeCapture" | "onEmptied" | "onEmptiedCapture" | "onEncrypted" | "onEncryptedCapture" | "onEnded" | "onEndedCapture" | "onLoadedData" | "onLoadedDataCapture" | "onLoadedMetadata" | "onLoadedMetadataCapture" | "onLoadStart" | "onLoadStartCapture" | "onPause" | "onPauseCapture" | "onPlay" | "onPlayCapture" | "onPlaying" | "onPlayingCapture" | "onProgress" | "onProgressCapture" | "onRateChange" | "onRateChangeCapture" | "onSeeked" | "onSeekedCapture" | "onSeeking" | "onSeekingCapture" | "onStalled" | "onStalledCapture" | "onSuspend" | "onSuspendCapture" | "onTimeUpdate" | "onTimeUpdateCapture" | "onVolumeChange" | "onVolumeChangeCapture" | "onWaiting" | "onWaitingCapture" | "onAuxClick" | "onAuxClickCapture" | "onClick" | "onClickCapture" | "onContextMenu" | "onContextMenuCapture" | "onDoubleClick" | "onDoubleClickCapture" | "onDrag" | "onDragCapture" | "onDragEnd" | "onDragEndCapture" | "onDragEnter" | "onDragEnterCapture" | "onDragExit" | "onDragExitCapture" | "onDragLeave" | "onDragLeaveCapture" | "onDragOver" | "onDragOverCapture" | "onDragStart" | "onDragStartCapture" | "onDrop" | "onDropCapture" | "onMouseDown" | "onMouseDownCapture" | "onMouseEnter" | "onMouseLeave" | "onMouseMove" | "onMouseMoveCapture" | "onMouseOut" | "onMouseOutCapture" | "onMouseOver" | "onMouseOverCapture" | "onMouseUp" | "onMouseUpCapture" | "onSelect" | "onSelectCapture" | "onTouchCancel" | "onTouchCancelCapture" | "onTouchEnd" | "onTouchEndCapture" | "onTouchMove" | "onTouchMoveCapture" | "onTouchStart" | "onTouchStartCapture" | "onPointerDown" | "onPointerDownCapture" | "onPointerMove" | "onPointerMoveCapture" | "onPointerUp" | "onPointerUpCapture" | "onPointerCancel" | "onPointerCancelCapture" | "onPointerEnter" | "onPointerEnterCapture" | "onPointerLeave" | "onPointerLeaveCapture" | "onPointerOver" | "onPointerOverCapture" | "onPointerOut" | "onPointerOutCapture" | "onGotPointerCapture" | "onGotPointerCaptureCapture" | "onLostPointerCapture" | "onLostPointerCaptureCapture" | "onScroll" | "onScrollCapture" | "onWheel" | "onWheelCapture" | "onAnimationStart" | "onAnimationStartCapture" | "onAnimationEnd" | "onAnimationEndCapture" | "onAnimationIteration" | "onAnimationIterationCapture" | "onTransitionEnd" | "onTransitionEndCapture" | "tw">, keyof ChipProps> & React.RefAttributes<HTMLDivElement>>;
 //# sourceMappingURL=Chip.d.ts.map