@laerdal/life-react-components 1.10.3-dev.1.full → 1.10.3-dev.11

package/dist/Chips/ChoiceChips.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["React","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","Size","ChoiceChips","selected","disabled","onClick","values","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","size","Medium","label"],"mappings":";;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,SAAQC,aAAR,EAAuBC,WAAvB,EAAoCC,oBAApC,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;AACA,SAAQC,IAAR,QAAmB,UAAnB;;;;AAEA,IAAMC,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCV,KAAK,CAACW,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEb,EAAAA,KAAK,CAACc,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACN,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMQ,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAP,IAAAA,OAAO,IAAIA,OAAO,CAACO,KAAD,CAAlB;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAwC;AACtCJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGN,MAAM,CAACU,GAAP,CAAW,UAACJ,KAAD;AAAA;;AAAA,0BACV,KAAC,aAAD;AAEE,QAAA,QAAQ,EAAER,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,2BAAKQ,KAAK,CAACK,IAAX,qDAAmBhB,IAAI,CAACiB,MAAxB,cAAkCd,QAAQ,GAAG,UAAH,GAAgB,EAA1D,cAAgEI,YAAY,KAAKI,KAAK,CAACA,KAAvB,GAA+B,SAA/B,GAA2C,SAA3G,iBAHX;AAIE,QAAA,WAAW,EAAEZ,yBAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACI,QAAD,IAAaO,YAAY,CAACC,KAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAE,CAAC;AAAA,iBAAI,CAACV,QAAD,IAAaS,aAAa,CAACC,CAAD,EAAIF,KAAJ,CAA9B;AAAA,SANd;AAAA,+BAOE,KAAC,oBAAD;AAAA,iCACE,KAAC,WAAD;AAAA,sBACGA,KAAK,CAACO;AADT;AADF;AAPF,SACOP,KAAK,CAACA,KADb,CADU;AAAA,KAAX;AADH,IADF;AAmBD,CA1DD;;AA4DA,eAAeV,WAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\nimport {Size} from '../types';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n                                                                 selected,\n                                                                 disabled,\n                                                                 onClick,\n                                                                 values\n                                                               }: ChoiceChipProps) => {\n  /**\n   * Globally used variables within the component.\n   */\n  const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n  /**\n   * Set the selected value for the chip.\n   */\n  React.useEffect(() => {\n    setSelectedChip(selected);\n  }, [selected]);\n\n  /**\n   * Sets selected chip and fires an event to parent component.\n   * @param value - Chip which was selected.\n   */\n  const onSelectChip = (value: ChipValue) => {\n    // Update selected chip\n    setSelectedChip(value.value);\n\n    // Fire the event\n    onClick && onClick(value);\n  };\n\n  const handleKeyDown = (e: any, value: ChipValue) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      onSelectChip(value);\n    }\n  };\n\n  /**\n   * Return Choice Chip component.\n   */\n  return (\n    <>\n      {values.map((value: ChipValue) => (\n        <ChipContainer\n          key={value.value}\n          tabIndex={disabled ? -1 : 0}\n          className={`${value.size ?? Size.Medium} ${disabled ? 'disabled' : ''} ${selectedChip === value.value ? 'default' : 'outline'} interactive`}\n          onMouseDown={defaultOnMouseDownHandler}\n          onClick={() => !disabled && onSelectChip(value)}\n          onKeyDown={e => !disabled && handleKeyDown(e, value)}>\n          <ChipContentContainer>\n            <ChipContent>\n              {value.label}\n            </ChipContent>\n          </ChipContentContainer>\n        </ChipContainer>\n      ))}\n    </>\n  );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.js"}
+{"version":3,"sources":["../../src/Chips/ChoiceChips.tsx"],"names":["React","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","Size","ChoiceChips","selected","disabled","onClick","values","useState","selectedChip","setSelectedChip","useEffect","onSelectChip","value","handleKeyDown","e","key","map","item","size","Medium","label","className","rest"],"mappings":";;;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AAEA;AACA;AACA;;AACA,SAAQC,aAAR,EAAuBC,WAAvB,EAAoCC,oBAApC,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;AACA,SAAQC,IAAR,QAAmB,UAAnB;;;;AAEA,IAAMC,WAAqD,GAAG,SAAxDA,WAAwD,OAKwB;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,QAGqB;AAAA,MAFrBC,OAEqB,QAFrBA,OAEqB;AAAA,MADrBC,MACqB,QADrBA,MACqB;;AACpF;AACF;AACA;AACE,wBAAwCV,KAAK,CAACW,QAAN,CAAuB,EAAvB,CAAxC;AAAA;AAAA,MAAOC,YAAP;AAAA,MAAqBC,eAArB;AAEA;AACF;AACA;;;AACEb,EAAAA,KAAK,CAACc,SAAN,CAAgB,YAAM;AACpBD,IAAAA,eAAe,CAACN,QAAD,CAAf;AACD,GAFD,EAEG,CAACA,QAAD,CAFH;AAIA;AACF;AACA;AACA;;AACE,MAAMQ,YAAY,GAAG,SAAfA,YAAe,CAACC,KAAD,EAAsB;AACzC;AACAH,IAAAA,eAAe,CAACG,KAAK,CAACA,KAAP,CAAf,CAFyC,CAIzC;;AACAP,IAAAA,OAAO,IAAIA,OAAO,CAACO,KAAD,CAAlB;AACD,GAND;;AAQA,MAAMC,aAAa,GAAG,SAAhBA,aAAgB,CAACC,CAAD,EAASF,KAAT,EAA8B;AAClD,QAAIE,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAnC,EAAwC;AACtCJ,MAAAA,YAAY,CAACC,KAAD,CAAZ;AACD;AACF,GAJD;AAMA;AACF;AACA;;;AACE,sBACE;AAAA,cACGN,MAAM,CAACU,GAAP,CAAW,UAACC,IAAD,EAAqB;AAC/B,UAAOL,KAAP,GAAgEK,IAAhE,CAAOL,KAAP;AAAA,uBAAgEK,IAAhE,CAAcC,IAAd;AAAA,UAAcA,IAAd,2BAAqBjB,IAAI,CAACkB,MAA1B;AAAA,UAAkCC,KAAlC,GAAgEH,IAAhE,CAAkCG,KAAlC;AAAA,UAAyCC,SAAzC,GAAgEJ,IAAhE,CAAyCI,SAAzC;AAAA,UAAuDC,IAAvD,4BAAgEL,IAAhE;;AACA,0BACE,KAAC,aAAD;AAEE,QAAA,QAAQ,EAAEb,QAAQ,GAAG,CAAC,CAAJ,GAAQ,CAF5B;AAGE,QAAA,SAAS,YAAKc,IAAL,cAAad,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CI,YAAY,KAAKI,KAAjB,GAAyB,SAAzB,GAAqC,SAAhF,0BAAyGS,SAAS,IAAI,EAAtH,CAHX;AAIE,QAAA,WAAW,EAAErB,yBAJf;AAKE,QAAA,OAAO,EAAE;AAAA,iBAAM,CAACI,QAAD,IAAaO,YAAY,CAACM,IAAD,CAA/B;AAAA,SALX;AAME,QAAA,SAAS,EAAE,mBAAAH,CAAC;AAAA,iBAAI,CAACV,QAAD,IAAaS,aAAa,CAACC,CAAD,EAAIG,IAAJ,CAA9B;AAAA;AANd,SAOMK,IAPN;AAAA,+BAQE,KAAC,oBAAD;AAAA,iCACE,KAAC,WAAD;AAAA,sBACGF;AADH;AADF;AARF,UACOR,KADP,CADF;AAgBD,KAlBA;AADH,IADF;AAuBD,CA9DD;;AAgEA,eAAeV,WAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipValue, ChoiceChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\nimport {Size} from '../types';\n\nconst ChoiceChips: React.FunctionComponent<ChoiceChipProps> = ({\n                                                                 selected,\n                                                                 disabled,\n                                                                 onClick,\n                                                                 values\n                                                               }: ChoiceChipProps) => {\n  /**\n   * Globally used variables within the component.\n   */\n  const [selectedChip, setSelectedChip] = React.useState<string>('');\n\n  /**\n   * Set the selected value for the chip.\n   */\n  React.useEffect(() => {\n    setSelectedChip(selected);\n  }, [selected]);\n\n  /**\n   * Sets selected chip and fires an event to parent component.\n   * @param value - Chip which was selected.\n   */\n  const onSelectChip = (value: ChipValue) => {\n    // Update selected chip\n    setSelectedChip(value.value);\n\n    // Fire the event\n    onClick && onClick(value);\n  };\n\n  const handleKeyDown = (e: any, value: ChipValue) => {\n    if (e.key === 'Enter' || e.key === ' ') {\n      onSelectChip(value);\n    }\n  };\n\n  /**\n   * Return Choice Chip component.\n   */\n  return (\n    <>\n      {values.map((item: ChipValue) => {\n        const {value, size = Size.Medium, label, className, ...rest } = item;\n        return (\n          <ChipContainer\n            key={value}\n            tabIndex={disabled ? -1 : 0}\n            className={`${size} ${disabled ? 'disabled' : ''} ${selectedChip === value ? 'default' : 'outline'} interactive ${className || ''}`}\n            onMouseDown={defaultOnMouseDownHandler}\n            onClick={() => !disabled && onSelectChip(item)}\n            onKeyDown={e => !disabled && handleKeyDown(e, item)}\n            {...rest}>\n            <ChipContentContainer>\n              <ChipContent>\n                {label}\n              </ChipContent>\n            </ChipContentContainer>\n          </ChipContainer>\n        );\n      })}\n    </>\n  );\n};\n\nexport default ChoiceChips;\n"],"file":"ChoiceChips.js"}

package/dist/Chips/FilterChip.cjs

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
@@ -7,6 +9,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var React = _interopRequireWildcard(require("react"));
 
 var _types = require("../types");
@@ -19,34 +25,31 @@ var _common = require("../common");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _excluded = ["selected", "text", "size", "disabled", "onClick", "className"];
+
 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; }
 
-/**
- * Import React libraries.
- */
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-/**
- * Import custom components.
- */
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-/**
- * Import custom styles.
- */
 var FilterChip = function FilterChip(_ref) {
   var selected = _ref.selected,
       text = _ref.text,
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? _types.Size.Medium : _ref$size,
       disabled = _ref.disabled,
-      _onClick = _ref.onClick;
+      _onClick = _ref.onClick,
+      className = _ref.className,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   /**
    * Return Filter Chip component.
    */
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, {
-    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'default' : 'outline', " ").concat(!!_onClick ? 'interactive' : ''),
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, _objectSpread(_objectSpread({
+    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'default' : 'outline', " ").concat(!!_onClick ? 'interactive' : '', " ").concat(className || ''),
     tabIndex: disabled || !_onClick ? -1 : 0,
     onKeyDown: function onKeyDown(e) {
       return (e.key === 'Enter' || e.key === ' ') && !disabled && _onClick && _onClick();
@@ -54,7 +57,8 @@ var FilterChip = function FilterChip(_ref) {
     onMouseDown: _common.defaultOnMouseDownHandler,
     onClick: function onClick() {
       return !disabled && _onClick && _onClick();
-    },
+    }
+  }, rest), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContentContainer, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChipStyles.ChipContent, {
         children: [selected && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
@@ -67,7 +71,7 @@ var FilterChip = function FilterChip(_ref) {
         })]
       })
     })
-  });
+  }));
 };
 
 var _default = FilterChip;

package/dist/Chips/FilterChip.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["FilterChip","selected","text","size","Size","Medium","disabled","onClick","e","key","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;AAGA;;AACA;;AAKA;;AAKA;;AAMA;;;;;;;;AApBA;AACA;AACA;;AAIA;AACA;AACA;;AAGA;AACA;AACA;AASA,IAAMA,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,uBAHrBC,IAGqB;AAAA,MAHrBA,IAGqB,0BAHdC,YAAKC,MAGS;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE,qBAAC,yBAAD;AACE,IAAA,SAAS,YAAKJ,IAAL,cAAaG,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CL,QAAQ,GAAG,SAAH,GAAe,SAAlE,cAA+E,CAAC,CAACM,QAAF,GAAY,aAAZ,GAA4B,EAA3G,CADX;AAEE,IAAA,QAAQ,EAAED,QAAQ,IAAI,CAACC,QAAb,GAAuB,CAAC,CAAxB,GAA4B,CAFxC;AAGE,IAAA,SAAS,EAAE,mBAAAC,CAAC;AAAA,aAAI,CAACA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAhC,KAAwC,CAACH,QAAzC,IAAqDC,QAArD,IAAgEA,QAAO,EAA3E;AAAA,KAHd;AAIE,IAAA,WAAW,EAAEG,iCAJf;AAKE,IAAA,OAAO,EAAE;AAAA,aAAM,CAACJ,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA,KALX;AAAA,2BAME,qBAAC,gCAAD;AAAA,6BACE,sBAAC,uBAAD;AAAA,mBACGN,QAAQ,iBAAI;AAAK,UAAA,SAAS,EAAE,qBAAhB;AAAA,iCAAuC,qBAAC,kBAAD,CAAa,SAAb;AAAuB,YAAA,SAAS,EAAE;AAAlC;AAAvC,UADf,eAEE;AAAA,oBAAMC;AAAN,UAFF;AAAA;AADF;AANF,IADF;AAeD,CA3BD;;eA6BeF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n                                                                selected,\n                                                                text,\n                                                                size = Size.Medium,\n                                                                disabled,\n                                                                onClick\n                                                              }: FilterChipProps) => {\n\n\n  /**\n   * Return Filter Chip component.\n   */\n  return (\n    <ChipContainer\n      className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'default' : 'outline'} ${!!onClick ? 'interactive' : ''}`}\n      tabIndex={disabled || !onClick ? -1 : 0}\n      onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disabled && onClick && onClick()}\n      onMouseDown={defaultOnMouseDownHandler}\n      onClick={() => !disabled && onClick && onClick()}>\n      <ChipContentContainer>\n        <ChipContent>\n          {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckMark className={'icon'}/></div>}\n          <div>{text}</div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.cjs"}
+{"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["FilterChip","selected","text","size","Size","Medium","disabled","onClick","className","rest","e","key","defaultOnMouseDownHandler"],"mappings":";;;;;;;;;;;;;;;AAGA;;AACA;;AAKA;;AAKA;;AAMA;;;;;;;;;;;;;;AAEA,IAAMA,UAAoD,GAAG,SAAvDA,UAAuD,OAQwB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,IAMqB,QANrBA,IAMqB;AAAA,uBALrBC,IAKqB;AAAA,MALrBA,IAKqB,0BALdC,YAAKC,MAKS;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,OAGqB;AAAA,MAFrBC,SAEqB,QAFrBA,SAEqB;AAAA,MADlBC,IACkB;;AAGnF;AACF;AACA;AACE,sBACE,qBAAC,yBAAD;AACE,IAAA,SAAS,YAAKN,IAAL,cAAaG,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CL,QAAQ,GAAG,SAAH,GAAe,SAAlE,cAA+E,CAAC,CAACM,QAAF,GAAY,aAAZ,GAA4B,EAA3G,cAAiHC,SAAS,IAAI,EAA9H,CADX;AAEE,IAAA,QAAQ,EAAEF,QAAQ,IAAI,CAACC,QAAb,GAAuB,CAAC,CAAxB,GAA4B,CAFxC;AAGE,IAAA,SAAS,EAAE,mBAAAG,CAAC;AAAA,aAAI,CAACA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAhC,KAAwC,CAACL,QAAzC,IAAqDC,QAArD,IAAgEA,QAAO,EAA3E;AAAA,KAHd;AAIE,IAAA,WAAW,EAAEK,iCAJf;AAKE,IAAA,OAAO,EAAE;AAAA,aAAM,CAACN,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA;AALX,KAMME,IANN;AAAA,2BAOE,qBAAC,gCAAD;AAAA,6BACE,sBAAC,uBAAD;AAAA,mBACGR,QAAQ,iBAAI;AAAK,UAAA,SAAS,EAAE,qBAAhB;AAAA,iCAAuC,qBAAC,kBAAD,CAAa,SAAb;AAAuB,YAAA,SAAS,EAAE;AAAlC;AAAvC,UADf,eAEE;AAAA,oBAAMC;AAAN,UAFF;AAAA;AADF;AAPF,KADF;AAgBD,CA9BD;;eAgCeF,U","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n                                                                selected,\n                                                                text,\n                                                                size = Size.Medium,\n                                                                disabled,\n                                                                onClick,\n                                                                className,\n                                                                ...rest\n                                                              }: FilterChipProps) => {\n\n\n  /**\n   * Return Filter Chip component.\n   */\n  return (\n    <ChipContainer\n      className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'default' : 'outline'} ${!!onClick ? 'interactive' : ''} ${className || ''}`}\n      tabIndex={disabled || !onClick ? -1 : 0}\n      onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disabled && onClick && onClick()}\n      onMouseDown={defaultOnMouseDownHandler}\n      onClick={() => !disabled && onClick && onClick()}\n      {...rest}>\n      <ChipContentContainer>\n        <ChipContent>\n          {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckMark className={'icon'}/></div>}\n          <div>{text}</div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.cjs"}

package/dist/Chips/FilterChip.js

@@ -1,3 +1,11 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["selected", "text", "size", "disabled", "onClick", "className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 /**
  * Import React libraries.
  */
@@ -27,13 +35,15 @@ var FilterChip = function FilterChip(_ref) {
       _ref$size = _ref.size,
       size = _ref$size === void 0 ? Size.Medium : _ref$size,
       disabled = _ref.disabled,
-      _onClick = _ref.onClick;
+      _onClick = _ref.onClick,
+      className = _ref.className,
+      rest = _objectWithoutProperties(_ref, _excluded);
 
   /**
    * Return Filter Chip component.
    */
-  return /*#__PURE__*/_jsx(ChipContainer, {
-    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'default' : 'outline', " ").concat(!!_onClick ? 'interactive' : ''),
+  return /*#__PURE__*/_jsx(ChipContainer, _objectSpread(_objectSpread({
+    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', " ").concat(selected ? 'default' : 'outline', " ").concat(!!_onClick ? 'interactive' : '', " ").concat(className || ''),
     tabIndex: disabled || !_onClick ? -1 : 0,
     onKeyDown: function onKeyDown(e) {
       return (e.key === 'Enter' || e.key === ' ') && !disabled && _onClick && _onClick();
@@ -41,7 +51,8 @@ var FilterChip = function FilterChip(_ref) {
     onMouseDown: defaultOnMouseDownHandler,
     onClick: function onClick() {
       return !disabled && _onClick && _onClick();
-    },
+    }
+  }, rest), {}, {
     children: /*#__PURE__*/_jsx(ChipContentContainer, {
       children: /*#__PURE__*/_jsxs(ChipContent, {
         children: [selected && /*#__PURE__*/_jsx("div", {
@@ -54,7 +65,7 @@ var FilterChip = function FilterChip(_ref) {
         })]
       })
     })
-  });
+  }));
 };
 
 export default FilterChip;

package/dist/Chips/FilterChip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["React","Size","SystemIcons","ChipContent","ChipContentContainer","ChipContainer","defaultOnMouseDownHandler","FilterChip","selected","text","size","Medium","disabled","onClick","e","key"],"mappings":"AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,IAAR,QAAmB,UAAnB;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,QAA0B,gBAA1B;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,EAAqBC,oBAArB,EAA2CC,aAA3C,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;AAEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAMwB;AAAA,MALrBC,QAKqB,QALrBA,QAKqB;AAAA,MAJrBC,IAIqB,QAJrBA,IAIqB;AAAA,uBAHrBC,IAGqB;AAAA,MAHrBA,IAGqB,0BAHdT,IAAI,CAACU,MAGS;AAAA,MAFrBC,QAEqB,QAFrBA,QAEqB;AAAA,MADrBC,QACqB,QADrBA,OACqB;;AAGnF;AACF;AACA;AACE,sBACE,KAAC,aAAD;AACE,IAAA,SAAS,YAAKH,IAAL,cAAaE,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CJ,QAAQ,GAAG,SAAH,GAAe,SAAlE,cAA+E,CAAC,CAACK,QAAF,GAAY,aAAZ,GAA4B,EAA3G,CADX;AAEE,IAAA,QAAQ,EAAED,QAAQ,IAAI,CAACC,QAAb,GAAuB,CAAC,CAAxB,GAA4B,CAFxC;AAGE,IAAA,SAAS,EAAE,mBAAAC,CAAC;AAAA,aAAI,CAACA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAhC,KAAwC,CAACH,QAAzC,IAAqDC,QAArD,IAAgEA,QAAO,EAA3E;AAAA,KAHd;AAIE,IAAA,WAAW,EAAEP,yBAJf;AAKE,IAAA,OAAO,EAAE;AAAA,aAAM,CAACM,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA,KALX;AAAA,2BAME,KAAC,oBAAD;AAAA,6BACE,MAAC,WAAD;AAAA,mBACGL,QAAQ,iBAAI;AAAK,UAAA,SAAS,EAAE,qBAAhB;AAAA,iCAAuC,KAAC,WAAD,CAAa,SAAb;AAAuB,YAAA,SAAS,EAAE;AAAlC;AAAvC,UADf,eAEE;AAAA,oBAAMC;AAAN,UAFF;AAAA;AADF;AANF,IADF;AAeD,CA3BD;;AA6BA,eAAeF,UAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n                                                                selected,\n                                                                text,\n                                                                size = Size.Medium,\n                                                                disabled,\n                                                                onClick\n                                                              }: FilterChipProps) => {\n\n\n  /**\n   * Return Filter Chip component.\n   */\n  return (\n    <ChipContainer\n      className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'default' : 'outline'} ${!!onClick ? 'interactive' : ''}`}\n      tabIndex={disabled || !onClick ? -1 : 0}\n      onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disabled && onClick && onClick()}\n      onMouseDown={defaultOnMouseDownHandler}\n      onClick={() => !disabled && onClick && onClick()}>\n      <ChipContentContainer>\n        <ChipContent>\n          {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckMark className={'icon'}/></div>}\n          <div>{text}</div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.js"}
+{"version":3,"sources":["../../src/Chips/FilterChip.tsx"],"names":["React","Size","SystemIcons","ChipContent","ChipContentContainer","ChipContainer","defaultOnMouseDownHandler","FilterChip","selected","text","size","Medium","disabled","onClick","className","rest","e","key"],"mappings":";;;;;;;;AAAA;AACA;AACA;AACA,OAAO,KAAKA,KAAZ,MAAuB,OAAvB;AACA,SAAQC,IAAR,QAAmB,UAAnB;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,QAA0B,gBAA1B;AAEA;AACA;AACA;;AACA,SAAQC,WAAR,EAAqBC,oBAArB,EAA2CC,aAA3C,QAA+D,cAA/D;AAEA;AACA;AACA;;AAEA,SAAQC,yBAAR,QAAwC,WAAxC;;;;AAEA,IAAMC,UAAoD,GAAG,SAAvDA,UAAuD,OAQwB;AAAA,MAPrBC,QAOqB,QAPrBA,QAOqB;AAAA,MANrBC,IAMqB,QANrBA,IAMqB;AAAA,uBALrBC,IAKqB;AAAA,MALrBA,IAKqB,0BALdT,IAAI,CAACU,MAKS;AAAA,MAJrBC,QAIqB,QAJrBA,QAIqB;AAAA,MAHrBC,QAGqB,QAHrBA,OAGqB;AAAA,MAFrBC,SAEqB,QAFrBA,SAEqB;AAAA,MADlBC,IACkB;;AAGnF;AACF;AACA;AACE,sBACE,KAAC,aAAD;AACE,IAAA,SAAS,YAAKL,IAAL,cAAaE,QAAQ,GAAG,UAAH,GAAgB,EAArC,cAA2CJ,QAAQ,GAAG,SAAH,GAAe,SAAlE,cAA+E,CAAC,CAACK,QAAF,GAAY,aAAZ,GAA4B,EAA3G,cAAiHC,SAAS,IAAI,EAA9H,CADX;AAEE,IAAA,QAAQ,EAAEF,QAAQ,IAAI,CAACC,QAAb,GAAuB,CAAC,CAAxB,GAA4B,CAFxC;AAGE,IAAA,SAAS,EAAE,mBAAAG,CAAC;AAAA,aAAI,CAACA,CAAC,CAACC,GAAF,KAAU,OAAV,IAAqBD,CAAC,CAACC,GAAF,KAAU,GAAhC,KAAwC,CAACL,QAAzC,IAAqDC,QAArD,IAAgEA,QAAO,EAA3E;AAAA,KAHd;AAIE,IAAA,WAAW,EAAEP,yBAJf;AAKE,IAAA,OAAO,EAAE;AAAA,aAAM,CAACM,QAAD,IAAaC,QAAb,IAAwBA,QAAO,EAArC;AAAA;AALX,KAMME,IANN;AAAA,2BAOE,KAAC,oBAAD;AAAA,6BACE,MAAC,WAAD;AAAA,mBACGP,QAAQ,iBAAI;AAAK,UAAA,SAAS,EAAE,qBAAhB;AAAA,iCAAuC,KAAC,WAAD,CAAa,SAAb;AAAuB,YAAA,SAAS,EAAE;AAAlC;AAAvC,UADf,eAEE;AAAA,oBAAMC;AAAN,UAFF;AAAA;AADF;AAPF,KADF;AAgBD,CA9BD;;AAgCA,eAAeF,UAAf","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\nimport {Size} from '../types';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContent, ChipContentContainer, ChipContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {FilterChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler} from '../common';\n\nconst FilterChip: React.FunctionComponent<FilterChipProps> = ({\n                                                                selected,\n                                                                text,\n                                                                size = Size.Medium,\n                                                                disabled,\n                                                                onClick,\n                                                                className,\n                                                                ...rest\n                                                              }: FilterChipProps) => {\n\n\n  /**\n   * Return Filter Chip component.\n   */\n  return (\n    <ChipContainer\n      className={`${size} ${disabled ? 'disabled' : ''} ${selected ? 'default' : 'outline'} ${!!onClick ? 'interactive' : ''} ${className || ''}`}\n      tabIndex={disabled || !onClick ? -1 : 0}\n      onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disabled && onClick && onClick()}\n      onMouseDown={defaultOnMouseDownHandler}\n      onClick={() => !disabled && onClick && onClick()}\n      {...rest}>\n      <ChipContentContainer>\n        <ChipContent>\n          {selected && <div className={'chip-icon icon-left'}><SystemIcons.CheckMark className={'icon'}/></div>}\n          <div>{text}</div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n};\n\nexport default FilterChip;\n"],"file":"FilterChip.js"}

package/dist/Chips/InputChip.cjs

@@ -1,5 +1,7 @@
 "use strict";
 
+var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
+
 var _typeof = require("@babel/runtime/helpers/typeof");
 
 Object.defineProperty(exports, "__esModule", {
@@ -7,6 +9,10 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.default = void 0;
 
+var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
+
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var React = _interopRequireWildcard(require("react"));
 
 var _index = require("../icons/index");
@@ -19,21 +25,16 @@ var _types = require("../types");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _excluded = ["icon", "text", "variant", "size", "disabled", "onClick", "disableRemove", "onRemove", "className"];
+
 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; }
 
-/**
- * Import React libraries.
- */
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
 
-/**
- * Import custom components.
- */
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { (0, _defineProperty2.default)(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
 
-/**
- * Import custom styles.
- */
 var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var _ref2;
 
@@ -46,7 +47,9 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       disabled = _ref.disabled,
       _onClick = _ref.onClick,
       disableRemove = _ref.disableRemove,
-      onRemove = _ref.onRemove;
+      onRemove = _ref.onRemove,
+      className = _ref.className,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var containerRef = (_ref2 = ref) !== null && _ref2 !== void 0 ? _ref2 : React.useRef(null);
   var removeRef = React.useRef(null);
   (0, _common.useActionWithin)(containerRef, [removeRef]);
@@ -74,15 +77,16 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
    */
 
 
-  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContainer, _objectSpread(_objectSpread({
     ref: containerRef,
-    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', "  ").concat(variant, " ").concat(!!_onClick ? 'interactive' : ''),
+    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', "  ").concat(variant, " ").concat(!!_onClick ? 'interactive' : '', " ").concat(className || ''),
     tabIndex: disabled || !_onClick ? -1 : 0,
     onMouseDown: _common.defaultOnMouseDownHandler,
     onKeyDown: handleContainerKeyDown,
     onClick: function onClick() {
       return !disabled && _onClick && _onClick();
-    },
+    }
+  }, rest), {}, {
     children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipStyles.ChipContentContainer, {
       children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_ChipStyles.ChipContent, {
         className: 'with-action-right',
@@ -113,7 +117,7 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         })]
       })
     })
-  });
+  }));
 });
 var _default = InputChip;
 exports.default = _default;

package/dist/Chips/InputChip.cjs.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["InputChip","React","forwardRef","ref","icon","text","variant","States","Default","size","Size","Medium","disabled","onClick","disableRemove","onRemove","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","handleContainerKeyDown","key","defaultOnMouseDownHandler","icons","className","e"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipVariant, InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\nimport {Size, States} from '../types';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = React.forwardRef(({\n                                                                               icon,\n                                                                               text,\n                                                                               variant = States.Default,\n                                                                               size = Size.Medium,\n                                                                               disabled,\n                                                                               onClick,\n                                                                               disableRemove,\n                                                                               onRemove\n                                                                             }: InputChipProps, ref) => {\n\n  const containerRef = ref as React.MutableRefObject<HTMLDivElement> ?? React.useRef<HTMLDivElement>(null);\n  const removeRef = React.useRef<HTMLDivElement>(null);\n\n  useActionWithin(containerRef, [removeRef]);\n\n  /**\n   * Calls onRemove action when remove button is clicked.\n   * @param event - Event handler from the button click.\n   */\n  const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n    !!event && event.stopPropagation();\n    onRemove(event);\n  };\n\n  const handleContainerKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      !disabled && onClick && onClick();\n    }\n    if (event.key === 'Backspace' && !disableRemove) {\n      !disableRemove && onRemove && onRemove(event);\n    }\n  };\n\n  /**\n   * Return Input Chip component.\n   */\n  return (\n    <ChipContainer ref={containerRef}\n                   className={`${size} ${disabled ? 'disabled' : ''}  ${variant} ${!!onClick ? 'interactive' : ''}`}\n                   tabIndex={disabled || !onClick ? -1 : 0}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onKeyDown={handleContainerKeyDown}\n                   onClick={() => !disabled && onClick && onClick()}>\n      <ChipContentContainer>\n        <ChipContent className={'with-action-right'}>\n          {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n          <div>{text}</div>\n\n          <div ref={removeRef}\n               className={`action-right ${disableRemove ? 'disabled' : ''}`}\n               tabIndex={disableRemove || disabled ? -1 : 0}\n               onMouseDown={defaultOnMouseDownHandler}\n               onClick={e => !disableRemove && !disabled && onRemoveClick(e)}\n               onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disableRemove && !disabled && onRemoveClick(e)}>\n            <div className={'chip-icon'}>\n              <SystemIcons.Close className={'remove'}/>\n            </div>\n          </div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n});\n\nexport default InputChip;\n"],"file":"InputChip.cjs"}
+{"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["InputChip","React","forwardRef","ref","icon","text","variant","States","Default","size","Size","Medium","disabled","onClick","disableRemove","onRemove","className","rest","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","handleContainerKeyDown","key","defaultOnMouseDownHandler","icons","e"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipVariant, InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\nimport {Size, States} from '../types';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = React.forwardRef(({\n                                                                               icon,\n                                                                               text,\n                                                                               variant = States.Default,\n                                                                               size = Size.Medium,\n                                                                               disabled,\n                                                                               onClick,\n                                                                               disableRemove,\n                                                                               onRemove,\n                                                                               className,\n                                                                               ...rest\n                                                                             }: InputChipProps, ref) => {\n\n  const containerRef = ref as React.MutableRefObject<HTMLDivElement> ?? React.useRef<HTMLDivElement>(null);\n  const removeRef = React.useRef<HTMLDivElement>(null);\n\n  useActionWithin(containerRef, [removeRef]);\n\n  /**\n   * Calls onRemove action when remove button is clicked.\n   * @param event - Event handler from the button click.\n   */\n  const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n    !!event && event.stopPropagation();\n    onRemove(event);\n  };\n\n  const handleContainerKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      !disabled && onClick && onClick();\n    }\n    if (event.key === 'Backspace' && !disableRemove) {\n      !disableRemove && onRemove && onRemove(event);\n    }\n  };\n\n  /**\n   * Return Input Chip component.\n   */\n  return (\n    <ChipContainer ref={containerRef}\n                   className={`${size} ${disabled ? 'disabled' : ''}  ${variant} ${!!onClick ? 'interactive' : ''} ${className || ''}`}\n                   tabIndex={disabled || !onClick ? -1 : 0}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onKeyDown={handleContainerKeyDown}\n                   onClick={() => !disabled && onClick && onClick()}\n                   {...rest}>\n      <ChipContentContainer>\n        <ChipContent className={'with-action-right'}>\n          {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n          <div>{text}</div>\n\n          <div ref={removeRef}\n               className={`action-right ${disableRemove ? 'disabled' : ''}`}\n               tabIndex={disableRemove || disabled ? -1 : 0}\n               onMouseDown={defaultOnMouseDownHandler}\n               onClick={e => !disableRemove && !disabled && onRemoveClick(e)}\n               onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disableRemove && !disabled && onRemoveClick(e)}>\n            <div className={'chip-icon'}>\n              <SystemIcons.Close className={'remove'}/>\n            </div>\n          </div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n});\n\nexport default InputChip;\n"],"file":"InputChip.cjs"}

package/dist/Chips/InputChip.js

@@ -1,3 +1,11 @@
+import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
+import _objectWithoutProperties from "@babel/runtime/helpers/esm/objectWithoutProperties";
+var _excluded = ["icon", "text", "variant", "size", "disabled", "onClick", "disableRemove", "onRemove", "className"];
+
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) { symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); } keys.push.apply(keys, symbols); } return keys; }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+
 /**
  * Import React libraries.
  */
@@ -32,7 +40,10 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
       disabled = _ref.disabled,
       _onClick = _ref.onClick,
       disableRemove = _ref.disableRemove,
-      onRemove = _ref.onRemove;
+      onRemove = _ref.onRemove,
+      className = _ref.className,
+      rest = _objectWithoutProperties(_ref, _excluded);
+
   var containerRef = (_ref2 = ref) !== null && _ref2 !== void 0 ? _ref2 : React.useRef(null);
   var removeRef = React.useRef(null);
   useActionWithin(containerRef, [removeRef]);
@@ -60,15 +71,16 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
    */
 
 
-  return /*#__PURE__*/_jsx(ChipContainer, {
+  return /*#__PURE__*/_jsx(ChipContainer, _objectSpread(_objectSpread({
     ref: containerRef,
-    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', "  ").concat(variant, " ").concat(!!_onClick ? 'interactive' : ''),
+    className: "".concat(size, " ").concat(disabled ? 'disabled' : '', "  ").concat(variant, " ").concat(!!_onClick ? 'interactive' : '', " ").concat(className || ''),
     tabIndex: disabled || !_onClick ? -1 : 0,
     onMouseDown: defaultOnMouseDownHandler,
     onKeyDown: handleContainerKeyDown,
     onClick: function onClick() {
       return !disabled && _onClick && _onClick();
-    },
+    }
+  }, rest), {}, {
     children: /*#__PURE__*/_jsx(ChipContentContainer, {
       children: /*#__PURE__*/_jsxs(ChipContent, {
         className: 'with-action-right',
@@ -99,7 +111,7 @@ var InputChip = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
         })]
       })
     })
-  });
+  }));
 });
 export default InputChip;
 //# sourceMappingURL=InputChip.js.map

package/dist/Chips/InputChip.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["React","SystemIcons","icons","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","useActionWithin","Size","States","InputChip","forwardRef","ref","icon","text","variant","Default","size","Medium","disabled","onClick","disableRemove","onRemove","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","handleContainerKeyDown","key","className","e"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipVariant, InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\nimport {Size, States} from '../types';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = React.forwardRef(({\n                                                                               icon,\n                                                                               text,\n                                                                               variant = States.Default,\n                                                                               size = Size.Medium,\n                                                                               disabled,\n                                                                               onClick,\n                                                                               disableRemove,\n                                                                               onRemove\n                                                                             }: InputChipProps, ref) => {\n\n  const containerRef = ref as React.MutableRefObject<HTMLDivElement> ?? React.useRef<HTMLDivElement>(null);\n  const removeRef = React.useRef<HTMLDivElement>(null);\n\n  useActionWithin(containerRef, [removeRef]);\n\n  /**\n   * Calls onRemove action when remove button is clicked.\n   * @param event - Event handler from the button click.\n   */\n  const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n    !!event && event.stopPropagation();\n    onRemove(event);\n  };\n\n  const handleContainerKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      !disabled && onClick && onClick();\n    }\n    if (event.key === 'Backspace' && !disableRemove) {\n      !disableRemove && onRemove && onRemove(event);\n    }\n  };\n\n  /**\n   * Return Input Chip component.\n   */\n  return (\n    <ChipContainer ref={containerRef}\n                   className={`${size} ${disabled ? 'disabled' : ''}  ${variant} ${!!onClick ? 'interactive' : ''}`}\n                   tabIndex={disabled || !onClick ? -1 : 0}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onKeyDown={handleContainerKeyDown}\n                   onClick={() => !disabled && onClick && onClick()}>\n      <ChipContentContainer>\n        <ChipContent className={'with-action-right'}>\n          {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n          <div>{text}</div>\n\n          <div ref={removeRef}\n               className={`action-right ${disableRemove ? 'disabled' : ''}`}\n               tabIndex={disableRemove || disabled ? -1 : 0}\n               onMouseDown={defaultOnMouseDownHandler}\n               onClick={e => !disableRemove && !disabled && onRemoveClick(e)}\n               onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disableRemove && !disabled && onRemoveClick(e)}>\n            <div className={'chip-icon'}>\n              <SystemIcons.Close className={'remove'}/>\n            </div>\n          </div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n});\n\nexport default InputChip;\n"],"file":"InputChip.js"}
+{"version":3,"sources":["../../src/Chips/InputChip.tsx"],"names":["React","SystemIcons","icons","ChipContainer","ChipContent","ChipContentContainer","defaultOnMouseDownHandler","useActionWithin","Size","States","InputChip","forwardRef","ref","icon","text","variant","Default","size","Medium","disabled","onClick","disableRemove","onRemove","className","rest","containerRef","useRef","removeRef","onRemoveClick","event","stopPropagation","handleContainerKeyDown","key","e"],"mappings":"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","sourcesContent":["/**\n * Import React libraries.\n */\nimport * as React from 'react';\n\n/**\n * Import custom components.\n */\nimport {SystemIcons, SystemIcons as icons} from '../icons/index';\n\n/**\n * Import custom styles.\n */\nimport {ChipContainer, ChipContent, ChipContentContainer} from './ChipStyles';\n\n/**\n * Import custom types.\n */\nimport {ChipVariant, InputChipProps} from './ChipTypes';\nimport {defaultOnMouseDownHandler, useActionWithin} from '../common';\nimport {Size, States} from '../types';\n\nconst InputChip: React.FunctionComponent<InputChipProps> = React.forwardRef(({\n                                                                               icon,\n                                                                               text,\n                                                                               variant = States.Default,\n                                                                               size = Size.Medium,\n                                                                               disabled,\n                                                                               onClick,\n                                                                               disableRemove,\n                                                                               onRemove,\n                                                                               className,\n                                                                               ...rest\n                                                                             }: InputChipProps, ref) => {\n\n  const containerRef = ref as React.MutableRefObject<HTMLDivElement> ?? React.useRef<HTMLDivElement>(null);\n  const removeRef = React.useRef<HTMLDivElement>(null);\n\n  useActionWithin(containerRef, [removeRef]);\n\n  /**\n   * Calls onRemove action when remove button is clicked.\n   * @param event - Event handler from the button click.\n   */\n  const onRemoveClick = (event?: React.MouseEvent<HTMLDivElement> | React.KeyboardEvent) => {\n    !!event && event.stopPropagation();\n    onRemove(event);\n  };\n\n  const handleContainerKeyDown = (event: React.KeyboardEvent) => {\n    if (event.key === 'Enter' || event.key === ' ') {\n      !disabled && onClick && onClick();\n    }\n    if (event.key === 'Backspace' && !disableRemove) {\n      !disableRemove && onRemove && onRemove(event);\n    }\n  };\n\n  /**\n   * Return Input Chip component.\n   */\n  return (\n    <ChipContainer ref={containerRef}\n                   className={`${size} ${disabled ? 'disabled' : ''}  ${variant} ${!!onClick ? 'interactive' : ''} ${className || ''}`}\n                   tabIndex={disabled || !onClick ? -1 : 0}\n                   onMouseDown={defaultOnMouseDownHandler}\n                   onKeyDown={handleContainerKeyDown}\n                   onClick={() => !disabled && onClick && onClick()}\n                   {...rest}>\n      <ChipContentContainer>\n        <ChipContent className={'with-action-right'}>\n          {icon && <div className={'chip-icon icon-left'}>{icons[icon]({className: 'icon'})}</div>}\n\n          <div>{text}</div>\n\n          <div ref={removeRef}\n               className={`action-right ${disableRemove ? 'disabled' : ''}`}\n               tabIndex={disableRemove || disabled ? -1 : 0}\n               onMouseDown={defaultOnMouseDownHandler}\n               onClick={e => !disableRemove && !disabled && onRemoveClick(e)}\n               onKeyDown={e => (e.key === 'Enter' || e.key === ' ') && !disableRemove && !disabled && onRemoveClick(e)}>\n            <div className={'chip-icon'}>\n              <SystemIcons.Close className={'remove'}/>\n            </div>\n          </div>\n        </ChipContent>\n      </ChipContentContainer>\n    </ChipContainer>\n  );\n});\n\nexport default InputChip;\n"],"file":"InputChip.js"}

package/dist/ChipsInput/ChipDropdownInput.cjs

@@ -15,6 +15,8 @@ var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/de
 
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
 
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteral"));
 
 var _propTypes = _interopRequireDefault(require("prop-types"));
@@ -37,6 +39,8 @@ var _styles = require("../styles");
 
 var _jsxRuntime = require("react/jsx-runtime");
 
+var _excluded = ["list", "onInputChange", "disableSorting", "messageOnNoResults", "values", "inputId", "variants", "placeholder", "validationMessage", "onValueChange", "suggestion", "loading", "maxSelectedItems", "multiLine", "size", "icon", "disableFiltering", "disabled", "altPlaceholder", "required"];
+
 var _templateObject;
 
 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); }
@@ -49,7 +53,7 @@ function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { va
 
 var Wrapper = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  position: relative;\n  display: inline-block;\n  width: 100%;\n\n  ", " {\n    position: relative;\n\n    &:focus, &.focus-visible-within {\n      z-index: ", " !important;\n    }\n  }\n"])), _ChipInputField.ChipInputContainer, _styles.Z_INDEXES.dropdown + 1);
 
-var ChipDropdownInput = function ChipDropdownInput(_ref) {
+var ChipDropdownInput = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
   var list = _ref.list,
       onInputChange = _ref.onInputChange,
       disableSorting = _ref.disableSorting,
@@ -71,7 +75,8 @@ var ChipDropdownInput = function ChipDropdownInput(_ref) {
       disableFiltering = _ref.disableFiltering,
       disabled = _ref.disabled,
       altPlaceholder = _ref.altPlaceholder,
-      required = _ref.required;
+      required = _ref.required,
+      rest = (0, _objectWithoutProperties2.default)(_ref, _excluded);
 
   // Initiate states
   var _React$useState = React.useState([]),
@@ -124,7 +129,10 @@ var ChipDropdownInput = function ChipDropdownInput(_ref) {
   }, [], (0, _common.useFocusOutsideRef)(function () {
     return setDropdownIsOpen(false);
   }));
-  var inputRef = React.useRef(null);
+  var inputRef = React.useRef();
+  React.useImperativeHandle(ref, function () {
+    return inputRef.current;
+  }, [inputRef]);
   /**
    * Sets initial values for the chips.
    */
@@ -334,7 +342,7 @@ var ChipDropdownInput = function ChipDropdownInput(_ref) {
 
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(Wrapper, {
     ref: containerRef,
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipInputField.ChipInputField, {
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_ChipInputField.ChipInputField, _objectSpread({
       inputId: inputId,
       ref: inputRef,
       items: chips,
@@ -355,7 +363,8 @@ var ChipDropdownInput = function ChipDropdownInput(_ref) {
       onActivationChange: function onActivationChange(value) {
         return setDropdownIsOpen(value);
       }
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownContent, {
+    }, rest)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_Dropdown.DropdownContent, {
+      containerRef: containerRef,
       customizationProps: {
         action: function action() {},
         pinTopItem: true,
@@ -378,8 +387,7 @@ var ChipDropdownInput = function ChipDropdownInput(_ref) {
       id: "".concat(inputId, "_dropdowncontent")
     })]
   });
-};
-
+});
 exports.ChipDropdownInput = ChipDropdownInput;
 ChipDropdownInput.propTypes = {
   list: _propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.shape({