@xelto.npm/xc2-lib 0.0.72 → 0.0.73

package/dist/index.cjs.js

@@ -52618,9 +52618,11 @@ var AppTileComponent = function AppTileComponent(_ref3) {
     _ref3$illustrationNam = _ref3.illustrationName,
     illustrationName = _ref3$illustrationNam === void 0 ? 'ilu_availability_by_item' : _ref3$illustrationNam,
     _ref3$forwardedRef = _ref3.forwardedRef,
-    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef;
+    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef,
+    onClick = _ref3.onClick;
   return /*#__PURE__*/React.createElement(StyledAppTileWrapper, {
-    ref: forwardedRef
+    ref: forwardedRef,
+    onClick: onClick
   }, /*#__PURE__*/React.createElement(Illustration, {
     illustrationName: illustrationName,
     color: '',
@@ -52638,7 +52640,7 @@ var AppTileComponent = function AppTileComponent(_ref3) {
 };
 AppTileComponent.propTypes = {
   description: propTypes.exports.string,
-  header: propTypes.exports.bool,
+  header: propTypes.exports.string,
   illustrationName: propTypes.exports.string,
   onClick: propTypes.exports.func,
   forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
@@ -52651,18 +52653,14 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
   var fluid = _ref.fluid;
   return {
     width: fluid ? '100%' : 'auto',
-    // fontSize:  '16px',
-    // lineHeight: '15px',
     borderRadius: '24px',
     fontWeight: 'bold',
     boxShadow: 'none',
-    // padding: props => props.size === 'big' ? '34px 60px' : '4px 24px',
     border: '2px solid #293072',
     backgroundColor: theme.mainPallete.primary.white,
     color: theme.mainPallete.primary.blue,
     textTransform: 'uppercase',
     fontFamily: ['"Barlow", sans-serif'],
-    // backgroundColor: theme.mainPallete.primary.red,
     '&:hover': {
       boxShadow: 'none'
     },
@@ -52832,7 +52830,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     },
     '&.big': {
       padding: '21px',
-      //PADDDINGi DO USTALENIA
       fontSize: '16px',
       lineHeight: '15px',
       borderRadius: '31px',
@@ -52852,7 +52849,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     },
     '&.small': {
       padding: '14px 21px',
-      //PADDDINGi DO USTALENIA
       fontSize: '16px',
       lineHeight: '15px',
       borderRadius: '24px',
@@ -52872,8 +52868,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     }
   };
 });
-
-// @ts-ignore
 var CustomButtonComponent = function CustomButtonComponent(_ref2) {
   var type = _ref2.type,
     text = _ref2.text,
@@ -52887,7 +52881,6 @@ var CustomButtonComponent = function CustomButtonComponent(_ref2) {
   var colorClassName = disabled ? 'grey' : color ? color : 'navy-blue'; // navy-blue / red / black / grey / special-green
   var typeClassName = type || 'primary'; // primary / secondary / ghost
   var sizeClassName = size || 'big'; // null / big / small
-  // const behaviourClassName = behaviour || '';
   var finalClassName = "".concat(typeClassName, " ").concat(colorClassName, " ").concat(sizeClassName);
   return /*#__PURE__*/React__namespace.createElement(CustomButton, _extends$1e({
     disabled: disabled,
@@ -52899,8 +52892,20 @@ var CustomButtonComponent = function CustomButtonComponent(_ref2) {
     ref: forwardedRef
   }, props), text);
 };
+CustomButtonComponent.propTypes = {
+  color: propTypes.exports.string,
+  disabled: propTypes.exports.bool,
+  fluid: propTypes.exports.bool,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })]),
+  onClick: propTypes.exports.func,
+  size: propTypes.exports.string,
+  type: propTypes.exports.string,
+  text: propTypes.exports.string
+};
 
-var _excluded$7 = ["text", "type", "icon", "color", "fluid", "onClick", "forwardedRef"];
+var _excluded$7 = ["color", "disabled", "fluid", "forwardedRef", "icon", "onClick", "text", "type"];
 var CustomIconButton = styled$1(Button$2)(function (_ref) {
   var fluid = _ref.fluid;
   return {
@@ -52912,7 +52917,6 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
     textTransform: 'uppercase',
     fontFamily: ['"Barlow", sans-serif'],
     padding: '4px 25px 4px 21px',
-    //PADDDINGi DO USTALENIA
     fontSize: '16px',
     lineHeight: '15px',
     '@media(min-width: 1024px)': {
@@ -52921,7 +52925,6 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
       lineHeight: '16px',
       borderRadius: '24px'
     },
-    // backgroundColor: theme.mainPallete.primary.red,
     '&:hover': {
       boxShadow: 'none',
       'img': {
@@ -53094,23 +53097,22 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
   };
 });
 var IconButtonComponent = function IconButtonComponent(_ref2) {
-  var text = _ref2.text,
-    type = _ref2.type,
-    icon = _ref2.icon,
-    color = _ref2.color,
+  var color = _ref2.color,
+    disabled = _ref2.disabled,
     fluid = _ref2.fluid,
-    onClick = _ref2.onClick,
     forwardedRef = _ref2.forwardedRef,
+    _ref2$icon = _ref2.icon,
+    icon = _ref2$icon === void 0 ? 'icon_wf_download' : _ref2$icon,
+    onClick = _ref2.onClick,
+    text = _ref2.text,
+    type = _ref2.type,
     props = _objectWithoutProperties$1(_ref2, _excluded$7);
-  var colorClassName = color || '';
-  var typeClassName = type || '';
-  // const resolutionClassName = resolution === '480x800' ? 'regular' : resolution === '720x1280' ? 'big' :resolution === '1024x768/1440x960/1920x1080' ? 'small' : ''
-  // const widthClassName = width === '100%' ? 'width100' : width === '50%' ? 'width50' : width === '33%' ? 'width33' : '';
+  var colorClassName = color || 'navy-blue';
+  var typeClassName = type || 'primary';
   var finalClassName = "".concat(typeClassName, " ").concat(colorClassName);
-  // const iconVariant = icon === 'download' ? IconDownloadGrey : IconDownloadWhite;
-  // const iconVariant = `${type} ${icon} ${colorClassName}`;
   return /*#__PURE__*/React__namespace.createElement(CustomIconButton, _extends$1e({}, props, {
     onClick: onClick,
+    disabled: disabled,
     fluid: fluid,
     ref: forwardedRef,
     startIcon: /*#__PURE__*/React__namespace.createElement(Icon, {
@@ -53122,6 +53124,19 @@ var IconButtonComponent = function IconButtonComponent(_ref2) {
     disableRipple: true
   }), text);
 };
+IconButtonComponent.propTypes = {
+  color: propTypes.exports.string,
+  disabled: propTypes.exports.bool,
+  icon: propTypes.exports.string,
+  fluid: propTypes.exports.bool,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })]),
+  onClick: propTypes.exports.func,
+  size: propTypes.exports.string,
+  type: propTypes.exports.string,
+  text: propTypes.exports.string
+};
 
 var _g$v;
 function _extends$y() { _extends$y = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$y.apply(this, arguments); }
@@ -66085,7 +66100,45 @@ var Logo = function Logo(_ref2) {
   }, props), logoName === 'logo_xelcode' && /*#__PURE__*/React.createElement(SvgLogoXelcode, null), logoName === 'logo_xelcode_dashboard' && /*#__PURE__*/React.createElement(SvgLogoXelcodeDashboard, null));
 };
 
-var _excluded$5 = ["buttons"];
+/**
+A function that returns a universally unique identifier (uuid).  
+example: 1b83fd69-abe7-468c-bea1-306a8aa1c81d
+@returns `string` : 32 character uuid (see example)
+*/
+
+function uuid() {
+	const hashTable = [
+		"a",
+		"b",
+		"c",
+		"d",
+		"e",
+		"f",
+		"0",
+		"1",
+		"2",
+		"3",
+		"4",
+		"5",
+		"6",
+		"7",
+		"8",
+		"9",
+	];
+	let uuid = [];
+	for (let i = 0; i < 36; i++) {
+		if (i === 8 || i === 13 || i === 18 || i === 23) {
+			uuid[i] = "-";
+		} else {
+			uuid[i] = hashTable[Math.ceil(Math.random() * hashTable.length - 1)];
+		}
+	}
+	return uuid.join("");
+}
+
+var uuid_1 = uuid;
+
+var _excluded$5 = ["buttons", "forwardedRef"];
 var StyledBottomBarWrapper = styled$1(Box$1)(function (_ref) {
   _objectDestructuringEmpty(_ref);
   return {
@@ -66112,8 +66165,12 @@ var StyledBottomBarWrapper = styled$1(Box$1)(function (_ref) {
 });
 var BottomBarComponent = function BottomBarComponent(_ref2) {
   var buttons = _ref2.buttons,
+    _ref2$forwardedRef = _ref2.forwardedRef,
+    forwardedRef = _ref2$forwardedRef === void 0 ? function () {} : _ref2$forwardedRef,
     props = _objectWithoutProperties$1(_ref2, _excluded$5);
-  return /*#__PURE__*/React.createElement(StyledBottomBarWrapper, props, buttons.map(function (item) {
+  return /*#__PURE__*/React.createElement(StyledBottomBarWrapper, _extends$1e({
+    ref: forwardedRef
+  }, props), buttons.map(function (item) {
     var disabled = (item === null || item === void 0 ? void 0 : item.disabled) || false;
     var fluid = (item === null || item === void 0 ? void 0 : item.fluid) || true;
     var onClick = (item === null || item === void 0 ? void 0 : item.onClick) || '';
@@ -66122,6 +66179,7 @@ var BottomBarComponent = function BottomBarComponent(_ref2) {
     var color = (item === null || item === void 0 ? void 0 : item.color) || 'navy-blue';
     var size = (item === null || item === void 0 ? void 0 : item.size) || 'small';
     return /*#__PURE__*/React.createElement(CustomButtonComponent, {
+      key: uuid_1(),
       disabled: disabled,
       fluid: fluid,
       onClick: onClick && typeof onClick === "function" ? onClick : undefined,
@@ -66132,6 +66190,20 @@ var BottomBarComponent = function BottomBarComponent(_ref2) {
     });
   }));
 };
+BottomBarComponent.propTypes = {
+  buttons: propTypes.exports.arrayOf(propTypes.exports.shape({
+    disabled: propTypes.exports.bool,
+    fluid: propTypes.exports.bool,
+    onClick: propTypes.exports.func,
+    type: propTypes.exports.string,
+    text: propTypes.exports.string,
+    color: propTypes.exports.string,
+    size: propTypes.exports.string
+  })),
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var StyledInfoBar = styled$1('div')(function (_ref) {
   _objectDestructuringEmpty(_ref);
@@ -66164,8 +66236,6 @@ var StyledInfoRow = styled$1('div')(function (_ref2) {
     }
   };
 });
-
-// @ts-ignore
 var BottomInfoBar = function BottomInfoBar(_ref3) {
   var _ref3$noLogo = _ref3.noLogo,
     noLogo = _ref3$noLogo === void 0 ? false : _ref3$noLogo,
@@ -66173,8 +66243,12 @@ var BottomInfoBar = function BottomInfoBar(_ref3) {
     leftText = _ref3$leftText === void 0 ? 'left' : _ref3$leftText,
     _ref3$rightText = _ref3.rightText,
     rightText = _ref3$rightText === void 0 ? 'right' : _ref3$rightText,
-    onRightTextClick = _ref3.onRightTextClick;
-  return /*#__PURE__*/React__namespace.createElement(StyledInfoBar, null, /*#__PURE__*/React__namespace.createElement(StyledInfoRow, {
+    onRightTextClick = _ref3.onRightTextClick,
+    _ref3$forwardedRef = _ref3.forwardedRef,
+    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef;
+  return /*#__PURE__*/React__namespace.createElement(StyledInfoBar, {
+    ref: forwardedRef
+  }, /*#__PURE__*/React__namespace.createElement(StyledInfoRow, {
     noLogo: noLogo
   }, /*#__PURE__*/React__namespace.createElement("div", null, /*#__PURE__*/React__namespace.createElement(CustomButtonComponent, {
     type: "ghost",
@@ -66195,6 +66269,15 @@ var BottomInfoBar = function BottomInfoBar(_ref3) {
     }
   }))));
 };
+BottomInfoBar.propTypes = {
+  noLogo: propTypes.exports.bool,
+  leftText: propTypes.exports.string,
+  rightText: propTypes.exports.string,
+  onRightTextClick: propTypes.exports.func,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var _excluded$4 = ["disabled", "label", "checked", "onChange", "indeterminate", "forwardedRef"];
 var StyledFormControlLabel$1 = styled$1(FormControlLabel$2)(function (_ref) {
@@ -89803,11 +89886,16 @@ var StyledModuleTileWrapper = styled$1(Box$1)(function (_ref) {
   };
 });
 var ModuleTile = function ModuleTile(_ref2) {
-  var fluid = _ref2.fluid,
-    illustrationName = _ref2.illustrationName,
+  var _ref2$fluid = _ref2.fluid,
+    fluid = _ref2$fluid === void 0 ? false : _ref2$fluid,
+    _ref2$illustrationNam = _ref2.illustrationName,
+    illustrationName = _ref2$illustrationNam === void 0 ? 'ilu_availability_by_item' : _ref2$illustrationNam,
     header = _ref2.header,
-    onClick = _ref2.onClick;
+    onClick = _ref2.onClick,
+    _ref2$forwardedRef = _ref2.forwardedRef,
+    forwardedRef = _ref2$forwardedRef === void 0 ? function () {} : _ref2$forwardedRef;
   return /*#__PURE__*/React.createElement(StyledModuleTileWrapper, {
+    ref: forwardedRef,
     fluid: fluid,
     onClick: onClick
   }, /*#__PURE__*/React.createElement(Illustration, {
@@ -89817,6 +89905,15 @@ var ModuleTile = function ModuleTile(_ref2) {
     type: 'module-tile-header'
   }));
 };
+ModuleTile.propTypes = {
+  fluid: propTypes.exports.bool,
+  header: propTypes.exports.string,
+  illustrationName: propTypes.exports.string,
+  onClick: propTypes.exports.func,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var StyledStepperContainer = styled$1(Box$1)(function (_ref) {
   _objectDestructuringEmpty(_ref);
@@ -90147,44 +90244,6 @@ var RadioGroupComponent = function RadioGroupComponent(_ref2) {
   }, renderRadioOptions(options));
 };
 
-/**
-A function that returns a universally unique identifier (uuid).  
-example: 1b83fd69-abe7-468c-bea1-306a8aa1c81d
-@returns `string` : 32 character uuid (see example)
-*/
-
-function uuid() {
-	const hashTable = [
-		"a",
-		"b",
-		"c",
-		"d",
-		"e",
-		"f",
-		"0",
-		"1",
-		"2",
-		"3",
-		"4",
-		"5",
-		"6",
-		"7",
-		"8",
-		"9",
-	];
-	let uuid = [];
-	for (let i = 0; i < 36; i++) {
-		if (i === 8 || i === 13 || i === 18 || i === 23) {
-			uuid[i] = "-";
-		} else {
-			uuid[i] = hashTable[Math.ceil(Math.random() * hashTable.length - 1)];
-		}
-	}
-	return uuid.join("");
-}
-
-var uuid_1 = uuid;
-
 var StyledMenu = styled$1('div')(function (_ref) {
   var variant = _ref.variant;
   return {

package/dist/index.esm.js

@@ -52598,9 +52598,11 @@ var AppTileComponent = function AppTileComponent(_ref3) {
     _ref3$illustrationNam = _ref3.illustrationName,
     illustrationName = _ref3$illustrationNam === void 0 ? 'ilu_availability_by_item' : _ref3$illustrationNam,
     _ref3$forwardedRef = _ref3.forwardedRef,
-    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef;
+    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef,
+    onClick = _ref3.onClick;
   return /*#__PURE__*/React__default.createElement(StyledAppTileWrapper, {
-    ref: forwardedRef
+    ref: forwardedRef,
+    onClick: onClick
   }, /*#__PURE__*/React__default.createElement(Illustration, {
     illustrationName: illustrationName,
     color: '',
@@ -52618,7 +52620,7 @@ var AppTileComponent = function AppTileComponent(_ref3) {
 };
 AppTileComponent.propTypes = {
   description: propTypes.exports.string,
-  header: propTypes.exports.bool,
+  header: propTypes.exports.string,
   illustrationName: propTypes.exports.string,
   onClick: propTypes.exports.func,
   forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
@@ -52631,18 +52633,14 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
   var fluid = _ref.fluid;
   return {
     width: fluid ? '100%' : 'auto',
-    // fontSize:  '16px',
-    // lineHeight: '15px',
     borderRadius: '24px',
     fontWeight: 'bold',
     boxShadow: 'none',
-    // padding: props => props.size === 'big' ? '34px 60px' : '4px 24px',
     border: '2px solid #293072',
     backgroundColor: theme.mainPallete.primary.white,
     color: theme.mainPallete.primary.blue,
     textTransform: 'uppercase',
     fontFamily: ['"Barlow", sans-serif'],
-    // backgroundColor: theme.mainPallete.primary.red,
     '&:hover': {
       boxShadow: 'none'
     },
@@ -52812,7 +52810,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     },
     '&.big': {
       padding: '21px',
-      //PADDDINGi DO USTALENIA
       fontSize: '16px',
       lineHeight: '15px',
       borderRadius: '31px',
@@ -52832,7 +52829,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     },
     '&.small': {
       padding: '14px 21px',
-      //PADDDINGi DO USTALENIA
       fontSize: '16px',
       lineHeight: '15px',
       borderRadius: '24px',
@@ -52852,8 +52848,6 @@ var CustomButton = styled$1(Button$2)(function (_ref) {
     }
   };
 });
-
-// @ts-ignore
 var CustomButtonComponent = function CustomButtonComponent(_ref2) {
   var type = _ref2.type,
     text = _ref2.text,
@@ -52867,7 +52861,6 @@ var CustomButtonComponent = function CustomButtonComponent(_ref2) {
   var colorClassName = disabled ? 'grey' : color ? color : 'navy-blue'; // navy-blue / red / black / grey / special-green
   var typeClassName = type || 'primary'; // primary / secondary / ghost
   var sizeClassName = size || 'big'; // null / big / small
-  // const behaviourClassName = behaviour || '';
   var finalClassName = "".concat(typeClassName, " ").concat(colorClassName, " ").concat(sizeClassName);
   return /*#__PURE__*/React.createElement(CustomButton, _extends$1e({
     disabled: disabled,
@@ -52879,8 +52872,20 @@ var CustomButtonComponent = function CustomButtonComponent(_ref2) {
     ref: forwardedRef
   }, props), text);
 };
+CustomButtonComponent.propTypes = {
+  color: propTypes.exports.string,
+  disabled: propTypes.exports.bool,
+  fluid: propTypes.exports.bool,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })]),
+  onClick: propTypes.exports.func,
+  size: propTypes.exports.string,
+  type: propTypes.exports.string,
+  text: propTypes.exports.string
+};
 
-var _excluded$7 = ["text", "type", "icon", "color", "fluid", "onClick", "forwardedRef"];
+var _excluded$7 = ["color", "disabled", "fluid", "forwardedRef", "icon", "onClick", "text", "type"];
 var CustomIconButton = styled$1(Button$2)(function (_ref) {
   var fluid = _ref.fluid;
   return {
@@ -52892,7 +52897,6 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
     textTransform: 'uppercase',
     fontFamily: ['"Barlow", sans-serif'],
     padding: '4px 25px 4px 21px',
-    //PADDDINGi DO USTALENIA
     fontSize: '16px',
     lineHeight: '15px',
     '@media(min-width: 1024px)': {
@@ -52901,7 +52905,6 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
       lineHeight: '16px',
       borderRadius: '24px'
     },
-    // backgroundColor: theme.mainPallete.primary.red,
     '&:hover': {
       boxShadow: 'none',
       'img': {
@@ -53074,23 +53077,22 @@ var CustomIconButton = styled$1(Button$2)(function (_ref) {
   };
 });
 var IconButtonComponent = function IconButtonComponent(_ref2) {
-  var text = _ref2.text,
-    type = _ref2.type,
-    icon = _ref2.icon,
-    color = _ref2.color,
+  var color = _ref2.color,
+    disabled = _ref2.disabled,
     fluid = _ref2.fluid,
-    onClick = _ref2.onClick,
     forwardedRef = _ref2.forwardedRef,
+    _ref2$icon = _ref2.icon,
+    icon = _ref2$icon === void 0 ? 'icon_wf_download' : _ref2$icon,
+    onClick = _ref2.onClick,
+    text = _ref2.text,
+    type = _ref2.type,
     props = _objectWithoutProperties$1(_ref2, _excluded$7);
-  var colorClassName = color || '';
-  var typeClassName = type || '';
-  // const resolutionClassName = resolution === '480x800' ? 'regular' : resolution === '720x1280' ? 'big' :resolution === '1024x768/1440x960/1920x1080' ? 'small' : ''
-  // const widthClassName = width === '100%' ? 'width100' : width === '50%' ? 'width50' : width === '33%' ? 'width33' : '';
+  var colorClassName = color || 'navy-blue';
+  var typeClassName = type || 'primary';
   var finalClassName = "".concat(typeClassName, " ").concat(colorClassName);
-  // const iconVariant = icon === 'download' ? IconDownloadGrey : IconDownloadWhite;
-  // const iconVariant = `${type} ${icon} ${colorClassName}`;
   return /*#__PURE__*/React.createElement(CustomIconButton, _extends$1e({}, props, {
     onClick: onClick,
+    disabled: disabled,
     fluid: fluid,
     ref: forwardedRef,
     startIcon: /*#__PURE__*/React.createElement(Icon, {
@@ -53102,6 +53104,19 @@ var IconButtonComponent = function IconButtonComponent(_ref2) {
     disableRipple: true
   }), text);
 };
+IconButtonComponent.propTypes = {
+  color: propTypes.exports.string,
+  disabled: propTypes.exports.bool,
+  icon: propTypes.exports.string,
+  fluid: propTypes.exports.bool,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })]),
+  onClick: propTypes.exports.func,
+  size: propTypes.exports.string,
+  type: propTypes.exports.string,
+  text: propTypes.exports.string
+};
 
 var _g$v;
 function _extends$y() { _extends$y = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends$y.apply(this, arguments); }
@@ -66065,7 +66080,45 @@ var Logo = function Logo(_ref2) {
   }, props), logoName === 'logo_xelcode' && /*#__PURE__*/React__default.createElement(SvgLogoXelcode, null), logoName === 'logo_xelcode_dashboard' && /*#__PURE__*/React__default.createElement(SvgLogoXelcodeDashboard, null));
 };
 
-var _excluded$5 = ["buttons"];
+/**
+A function that returns a universally unique identifier (uuid).  
+example: 1b83fd69-abe7-468c-bea1-306a8aa1c81d
+@returns `string` : 32 character uuid (see example)
+*/
+
+function uuid() {
+	const hashTable = [
+		"a",
+		"b",
+		"c",
+		"d",
+		"e",
+		"f",
+		"0",
+		"1",
+		"2",
+		"3",
+		"4",
+		"5",
+		"6",
+		"7",
+		"8",
+		"9",
+	];
+	let uuid = [];
+	for (let i = 0; i < 36; i++) {
+		if (i === 8 || i === 13 || i === 18 || i === 23) {
+			uuid[i] = "-";
+		} else {
+			uuid[i] = hashTable[Math.ceil(Math.random() * hashTable.length - 1)];
+		}
+	}
+	return uuid.join("");
+}
+
+var uuid_1 = uuid;
+
+var _excluded$5 = ["buttons", "forwardedRef"];
 var StyledBottomBarWrapper = styled$1(Box$1)(function (_ref) {
   _objectDestructuringEmpty(_ref);
   return {
@@ -66092,8 +66145,12 @@ var StyledBottomBarWrapper = styled$1(Box$1)(function (_ref) {
 });
 var BottomBarComponent = function BottomBarComponent(_ref2) {
   var buttons = _ref2.buttons,
+    _ref2$forwardedRef = _ref2.forwardedRef,
+    forwardedRef = _ref2$forwardedRef === void 0 ? function () {} : _ref2$forwardedRef,
     props = _objectWithoutProperties$1(_ref2, _excluded$5);
-  return /*#__PURE__*/React__default.createElement(StyledBottomBarWrapper, props, buttons.map(function (item) {
+  return /*#__PURE__*/React__default.createElement(StyledBottomBarWrapper, _extends$1e({
+    ref: forwardedRef
+  }, props), buttons.map(function (item) {
     var disabled = (item === null || item === void 0 ? void 0 : item.disabled) || false;
     var fluid = (item === null || item === void 0 ? void 0 : item.fluid) || true;
     var onClick = (item === null || item === void 0 ? void 0 : item.onClick) || '';
@@ -66102,6 +66159,7 @@ var BottomBarComponent = function BottomBarComponent(_ref2) {
     var color = (item === null || item === void 0 ? void 0 : item.color) || 'navy-blue';
     var size = (item === null || item === void 0 ? void 0 : item.size) || 'small';
     return /*#__PURE__*/React__default.createElement(CustomButtonComponent, {
+      key: uuid_1(),
       disabled: disabled,
       fluid: fluid,
       onClick: onClick && typeof onClick === "function" ? onClick : undefined,
@@ -66112,6 +66170,20 @@ var BottomBarComponent = function BottomBarComponent(_ref2) {
     });
   }));
 };
+BottomBarComponent.propTypes = {
+  buttons: propTypes.exports.arrayOf(propTypes.exports.shape({
+    disabled: propTypes.exports.bool,
+    fluid: propTypes.exports.bool,
+    onClick: propTypes.exports.func,
+    type: propTypes.exports.string,
+    text: propTypes.exports.string,
+    color: propTypes.exports.string,
+    size: propTypes.exports.string
+  })),
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var StyledInfoBar = styled$1('div')(function (_ref) {
   _objectDestructuringEmpty(_ref);
@@ -66144,8 +66216,6 @@ var StyledInfoRow = styled$1('div')(function (_ref2) {
     }
   };
 });
-
-// @ts-ignore
 var BottomInfoBar = function BottomInfoBar(_ref3) {
   var _ref3$noLogo = _ref3.noLogo,
     noLogo = _ref3$noLogo === void 0 ? false : _ref3$noLogo,
@@ -66153,8 +66223,12 @@ var BottomInfoBar = function BottomInfoBar(_ref3) {
     leftText = _ref3$leftText === void 0 ? 'left' : _ref3$leftText,
     _ref3$rightText = _ref3.rightText,
     rightText = _ref3$rightText === void 0 ? 'right' : _ref3$rightText,
-    onRightTextClick = _ref3.onRightTextClick;
-  return /*#__PURE__*/React.createElement(StyledInfoBar, null, /*#__PURE__*/React.createElement(StyledInfoRow, {
+    onRightTextClick = _ref3.onRightTextClick,
+    _ref3$forwardedRef = _ref3.forwardedRef,
+    forwardedRef = _ref3$forwardedRef === void 0 ? function () {} : _ref3$forwardedRef;
+  return /*#__PURE__*/React.createElement(StyledInfoBar, {
+    ref: forwardedRef
+  }, /*#__PURE__*/React.createElement(StyledInfoRow, {
     noLogo: noLogo
   }, /*#__PURE__*/React.createElement("div", null, /*#__PURE__*/React.createElement(CustomButtonComponent, {
     type: "ghost",
@@ -66175,6 +66249,15 @@ var BottomInfoBar = function BottomInfoBar(_ref3) {
     }
   }))));
 };
+BottomInfoBar.propTypes = {
+  noLogo: propTypes.exports.bool,
+  leftText: propTypes.exports.string,
+  rightText: propTypes.exports.string,
+  onRightTextClick: propTypes.exports.func,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var _excluded$4 = ["disabled", "label", "checked", "onChange", "indeterminate", "forwardedRef"];
 var StyledFormControlLabel$1 = styled$1(FormControlLabel$2)(function (_ref) {
@@ -89783,11 +89866,16 @@ var StyledModuleTileWrapper = styled$1(Box$1)(function (_ref) {
   };
 });
 var ModuleTile = function ModuleTile(_ref2) {
-  var fluid = _ref2.fluid,
-    illustrationName = _ref2.illustrationName,
+  var _ref2$fluid = _ref2.fluid,
+    fluid = _ref2$fluid === void 0 ? false : _ref2$fluid,
+    _ref2$illustrationNam = _ref2.illustrationName,
+    illustrationName = _ref2$illustrationNam === void 0 ? 'ilu_availability_by_item' : _ref2$illustrationNam,
     header = _ref2.header,
-    onClick = _ref2.onClick;
+    onClick = _ref2.onClick,
+    _ref2$forwardedRef = _ref2.forwardedRef,
+    forwardedRef = _ref2$forwardedRef === void 0 ? function () {} : _ref2$forwardedRef;
   return /*#__PURE__*/React__default.createElement(StyledModuleTileWrapper, {
+    ref: forwardedRef,
     fluid: fluid,
     onClick: onClick
   }, /*#__PURE__*/React__default.createElement(Illustration, {
@@ -89797,6 +89885,15 @@ var ModuleTile = function ModuleTile(_ref2) {
     type: 'module-tile-header'
   }));
 };
+ModuleTile.propTypes = {
+  fluid: propTypes.exports.bool,
+  header: propTypes.exports.string,
+  illustrationName: propTypes.exports.string,
+  onClick: propTypes.exports.func,
+  forwardedRef: propTypes.exports.oneOfType([propTypes.exports.func, propTypes.exports.shape({
+    current: propTypes.exports.any
+  })])
+};
 
 var StyledStepperContainer = styled$1(Box$1)(function (_ref) {
   _objectDestructuringEmpty(_ref);
@@ -90127,44 +90224,6 @@ var RadioGroupComponent = function RadioGroupComponent(_ref2) {
   }, renderRadioOptions(options));
 };
 
-/**
-A function that returns a universally unique identifier (uuid).  
-example: 1b83fd69-abe7-468c-bea1-306a8aa1c81d
-@returns `string` : 32 character uuid (see example)
-*/
-
-function uuid() {
-	const hashTable = [
-		"a",
-		"b",
-		"c",
-		"d",
-		"e",
-		"f",
-		"0",
-		"1",
-		"2",
-		"3",
-		"4",
-		"5",
-		"6",
-		"7",
-		"8",
-		"9",
-	];
-	let uuid = [];
-	for (let i = 0; i < 36; i++) {
-		if (i === 8 || i === 13 || i === 18 || i === 23) {
-			uuid[i] = "-";
-		} else {
-			uuid[i] = hashTable[Math.ceil(Math.random() * hashTable.length - 1)];
-		}
-	}
-	return uuid.join("");
-}
-
-var uuid_1 = uuid;
-
 var StyledMenu = styled$1('div')(function (_ref) {
   var variant = _ref.variant;
   return {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@xelto.npm/xc2-lib",
-  "version": "0.0.72",
+  "version": "0.0.73",
   "author": "XELTO",
   "description": "React component library based on MUI",
   "license": "ISC",