@maxio-com/self-service 1.4.2 → 1.5.0

package/dist/maxio-components.umd.js

@@ -2062,7 +2062,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"IconContainer\": () => (/* binding */ IconContainer),\n/* harmony export */   \"Rotate\": () => (/* binding */ Rotate),\n/* harmony export */   \"StyledButton\": () => (/* binding */ StyledButton)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../theme */ \"./packages/custom-ui-components/src/theme/index.ts\");\n/* harmony import */ var _mixins__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../mixins */ \"./packages/custom-ui-components/src/mixins/index.ts\");\n\n\n\n\nvar rotate = (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.keyframes)([\"from{transform:rotate(0deg);}to{transform:rotate(360deg);}\"]);\nvar commonStyle = (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"outline:none;border:none;display:inline-flex;align-items:center;column-gap:8px;cursor:pointer;box-sizing:border-box;\", \";transition:background-color 250ms ease-in-out,color 250ms ease-in-out,box-shadow 250ms ease-in-out;&:disabled{cursor:not-allowed;}\"], _mixins__WEBPACK_IMPORTED_MODULE_2__.fontSmoothing);\nvar StyledButton = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].button.withConfig({\n  displayName: \"Buttonstyles__StyledButton\",\n  componentId: \"maxio-components__sc-2dax65-0\"\n})([\"&&&{\", \";\", \";\", \";\", \";\", \";\", \";}\"], commonStyle, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'size'));\n}, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'color'));\n}, function (_ref) {\n  var hasIconOnly = _ref.hasIconOnly,\n      theme = _ref.theme,\n      size = _ref.size;\n  return hasIconOnly && (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"padding-left:\", \"px;padding-right:\", \"px;aspect-ratio:1;\"], size === 'medium' ? theme.space[4] - 1 : theme.space[3] - 1, size === 'medium' ? theme.space[4] - 1 : theme.space[3] - 1);\n}, function (_ref2) {\n  var isLoading = _ref2.isLoading,\n      disabled = _ref2.disabled,\n      color = _ref2.color,\n      theme = _ref2.theme;\n  return isLoading && !disabled && (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"color:\", \";pointer-events:none;\"], color === 'secondary' ? theme.colors.gray.dark : theme.colors[color].light);\n}, (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)(function (props) {\n  return _theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentCSSOverrides(props, 'Button');\n}));\nvar Rotate = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].div.withConfig({\n  displayName: \"Buttonstyles__Rotate\",\n  componentId: \"maxio-components__sc-2dax65-1\"\n})([\"&&&{display:flex;animation:\", \" 2s linear infinite;}\"], rotate);\nvar IconContainer = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].div.withConfig({\n  displayName: \"Buttonstyles__IconContainer\",\n  componentId: \"maxio-components__sc-2dax65-2\"\n})([\"&&&{display:flex;justify-content:center;\", \";}\"], function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'iconSize'));\n});\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/atoms/Button/Button.styles.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"IconContainer\": () => (/* binding */ IconContainer),\n/* harmony export */   \"Rotate\": () => (/* binding */ Rotate),\n/* harmony export */   \"StyledButton\": () => (/* binding */ StyledButton)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../theme */ \"./packages/custom-ui-components/src/theme/index.ts\");\n/* harmony import */ var _mixins__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../mixins */ \"./packages/custom-ui-components/src/mixins/index.ts\");\n\n\n\n\nvar rotate = (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.keyframes)([\"from{transform:rotate(0deg);}to{transform:rotate(360deg);}\"]);\nvar commonStyle = (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"outline:none;border:none;display:inline-flex;justify-content:center;align-items:center;column-gap:8px;cursor:pointer;box-sizing:border-box;\", \";transition:background-color 250ms ease-in-out,color 250ms ease-in-out,box-shadow 250ms ease-in-out;&:disabled{cursor:not-allowed;}\"], _mixins__WEBPACK_IMPORTED_MODULE_2__.fontSmoothing);\nvar StyledButton = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].button.withConfig({\n  displayName: \"Buttonstyles__StyledButton\",\n  componentId: \"maxio-components__sc-2dax65-0\"\n})([\"&&&{\", \";\", \";\", \";\", \";\", \";\", \";}\"], commonStyle, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'size'));\n}, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'color'));\n}, function (_ref) {\n  var hasIconOnly = _ref.hasIconOnly,\n      theme = _ref.theme,\n      size = _ref.size;\n  return hasIconOnly && (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"padding-left:\", \"px;padding-right:\", \"px;aspect-ratio:1;\"], size === 'medium' ? theme.space[4] - 1 : theme.space[3] - 1, size === 'medium' ? theme.space[4] - 1 : theme.space[3] - 1);\n}, function (_ref2) {\n  var isLoading = _ref2.isLoading,\n      disabled = _ref2.disabled,\n      color = _ref2.color,\n      theme = _ref2.theme;\n  return isLoading && !disabled && (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)([\"color:\", \";pointer-events:none;\"], color === 'secondary' ? theme.colors.gray.dark : theme.colors[color].light);\n}, (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)(function (props) {\n  return _theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentCSSOverrides(props, 'Button');\n}));\nvar Rotate = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].div.withConfig({\n  displayName: \"Buttonstyles__Rotate\",\n  componentId: \"maxio-components__sc-2dax65-1\"\n})([\"&&&{display:flex;animation:\", \" 2s linear infinite;}\"], rotate);\nvar IconContainer = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].div.withConfig({\n  displayName: \"Buttonstyles__IconContainer\",\n  componentId: \"maxio-components__sc-2dax65-2\"\n})([\"&&&{display:flex;justify-content:center;\", \";}\"], function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Button', 'iconSize'));\n});\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/atoms/Button/Button.styles.ts?");
 
 /***/ }),
 
@@ -2139,7 +2139,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"buttonSettings\": () => (/* binding */ buttonSettings)\n/* harmony export */ });\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar commonSettings = {\n  fontWeight: 2,\n  fontFamily: 'secondary',\n  borderRadius: 3,\n  lineHeight: '100%',\n  boxShadow: function boxShadow(props) {\n    return props.boxShadows.input;\n  },\n  '&:focus-visible': {\n    boxShadow: function boxShadow(props) {\n      return \"0 0 0 3px \".concat(props.colors.primary.light);\n    }\n  }\n};\nvar buttonSettings = {\n  componentVariants: {\n    color: {\n      prop: 'colorVariant',\n      variants: {\n        'solid-primary': {\n          backgroundColor: 'primary.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'primary.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'primary.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-primary': {\n          backgroundColor: 'transparent',\n          color: 'primary.main',\n          borderColor: 'primary.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'primary.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'primary.light',\n            borderColor: 'primary.light'\n          }\n        },\n        'solid-secondary': {\n          backgroundColor: 'secondary.main',\n          color: 'black.main',\n          borderColor: 'gray.light',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          '&:hover': {\n            backgroundColor: 'secondary.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'gray.light',\n            color: 'white.main',\n            border: 'none',\n            boxShadow: 'none'\n          }\n        },\n        'outline-secondary': {\n          backgroundColor: 'transparent',\n          color: 'black.main',\n          borderColor: 'gray.light',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'secondary.dark'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'gray.light'\n          }\n        },\n        'solid-success': {\n          backgroundColor: 'success.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'success.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'success.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-success': {\n          backgroundColor: 'transparent',\n          color: 'success.main',\n          borderColor: 'success.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'success.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'success.light',\n            borderColor: 'success.light'\n          }\n        },\n        'solid-danger': {\n          backgroundColor: 'danger.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'danger.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'danger.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-danger': {\n          backgroundColor: 'transparent',\n          color: 'danger.main',\n          borderColor: 'danger.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'danger.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'danger.light',\n            borderColor: 'danger.light'\n          }\n        }\n      }\n    },\n    size: {\n      prop: 'size',\n      variants: {\n        small: _objectSpread({\n          minHeight: '3',\n          paddingTop: '2',\n          paddingBottom: '2',\n          paddingLeft: '3',\n          paddingRight: '3',\n          fontSize: '0',\n          lineHeight: '0'\n        }, commonSettings),\n        medium: _objectSpread({\n          minHeight: '4',\n          paddingTop: '3',\n          paddingBottom: '3',\n          paddingLeft: '5',\n          paddingRight: '5',\n          fontSize: '1',\n          lineHeight: '1'\n        }, commonSettings)\n      }\n    },\n    iconSize: {\n      prop: 'iconSize',\n      variants: {\n        small: {\n          width: '0',\n          height: '0'\n        },\n        medium: {\n          width: '1',\n          height: '1'\n        }\n      }\n    }\n  }\n};\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/atoms/Button/settings.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"buttonSettings\": () => (/* binding */ buttonSettings)\n/* harmony export */ });\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nvar commonSettings = {\n  fontWeight: 2,\n  fontFamily: 'secondary',\n  borderRadius: 3,\n  lineHeight: '100%',\n  boxShadow: function boxShadow(props) {\n    return props.boxShadows.input;\n  },\n  '&:focus-visible': {\n    boxShadow: function boxShadow(props) {\n      return \"0 0 0 3px \".concat(props.colors.primary.light);\n    }\n  }\n};\nvar buttonSettings = {\n  componentVariants: {\n    color: {\n      prop: 'colorVariant',\n      variants: {\n        'solid-primary': {\n          backgroundColor: 'primary.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'primary.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'primary.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-primary': {\n          backgroundColor: 'transparent',\n          color: 'primary.main',\n          borderColor: 'primary.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'primary.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'primary.light',\n            borderColor: 'primary.light'\n          }\n        },\n        'solid-secondary': {\n          backgroundColor: 'secondary.main',\n          color: 'black.main',\n          borderColor: 'gray.light',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          '&:hover': {\n            backgroundColor: 'secondary.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'gray.light',\n            color: 'white.main',\n            border: 'none',\n            boxShadow: 'none'\n          }\n        },\n        'outline-secondary': {\n          backgroundColor: 'transparent',\n          color: 'black.main',\n          borderColor: 'gray.light',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'secondary.dark'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'gray.light'\n          }\n        },\n        'solid-success': {\n          backgroundColor: 'success.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'success.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'success.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-success': {\n          backgroundColor: 'transparent',\n          color: 'success.main',\n          borderColor: 'success.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'success.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'success.light',\n            borderColor: 'success.light'\n          }\n        },\n        'solid-danger': {\n          backgroundColor: 'danger.main',\n          color: 'white.main',\n          '&:hover': {\n            backgroundColor: 'danger.dark',\n            boxShadow: 'none'\n          },\n          '&:disabled': {\n            backgroundColor: 'danger.light',\n            boxShadow: 'none'\n          }\n        },\n        'outline-danger': {\n          backgroundColor: 'transparent',\n          color: 'danger.main',\n          borderColor: 'danger.main',\n          borderWidth: '1px',\n          borderStyle: 'solid',\n          boxShadow: 'none',\n          '&:hover': {\n            backgroundColor: 'danger.light'\n          },\n          '&:disabled': {\n            backgroundColor: 'transparent',\n            color: 'danger.light',\n            borderColor: 'danger.light'\n          }\n        }\n      }\n    },\n    size: {\n      prop: 'size',\n      variants: {\n        small: _objectSpread({\n          paddingTop: '2',\n          paddingBottom: '2',\n          paddingLeft: '3',\n          paddingRight: '3',\n          fontSize: '0',\n          lineHeight: '0'\n        }, commonSettings),\n        medium: _objectSpread({\n          paddingTop: '3',\n          paddingBottom: '3',\n          paddingLeft: '5',\n          paddingRight: '5',\n          fontSize: '1',\n          lineHeight: '1'\n        }, commonSettings)\n      }\n    },\n    iconSize: {\n      prop: 'iconSize',\n      variants: {\n        small: {\n          width: '0',\n          height: '0'\n        },\n        medium: {\n          width: '1',\n          height: '1'\n        }\n      }\n    }\n  }\n};\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/atoms/Button/settings.ts?");
 
 /***/ }),
 
@@ -3591,7 +3591,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Container\": () => (/* binding */ Container),\n/* harmony export */   \"IconWrapper\": () => (/* binding */ IconWrapper)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../theme */ \"./packages/custom-ui-components/src/theme/index.ts\");\n/* harmony import */ var _atoms_Box__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../atoms/Box */ \"./packages/custom-ui-components/src/components/atoms/Box/index.ts\");\n\n\n\n\nvar Container = styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"].div.withConfig({\n  displayName: \"Alertstyles__Container\",\n  componentId: \"maxio-components__sc-gxtxj5-0\"\n})([\"&&&{box-sizing:border-box;\", \";\", \";\", \";}\"], function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Alert', 'size'));\n}, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Alert', 'color'));\n}, (0,styled_components__WEBPACK_IMPORTED_MODULE_3__.css)(function (props) {\n  return _theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentCSSOverrides(props, 'Alert');\n}));\nvar IconWrapper = (0,styled_components__WEBPACK_IMPORTED_MODULE_3__[\"default\"])(_atoms_Box__WEBPACK_IMPORTED_MODULE_2__[\"default\"]).withConfig({\n  displayName: \"Alertstyles__IconWrapper\",\n  componentId: \"maxio-components__sc-gxtxj5-1\"\n})([\"&&&{position:relative;bottom:-\", \"px;}\"], function (props) {\n  return props.theme.space[1];\n});\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/Alert.styles.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Container\": () => (/* binding */ Container)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n/* harmony import */ var _theme__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../../theme */ \"./packages/custom-ui-components/src/theme/index.ts\");\n\n\n\nvar Container = styled_components__WEBPACK_IMPORTED_MODULE_2__[\"default\"].div.withConfig({\n  displayName: \"Alertstyles__Container\",\n  componentId: \"maxio-components__sc-gxtxj5-0\"\n})([\"&&&{box-sizing:border-box;\", \";\", \";\", \";}\"], function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Alert', 'size'));\n}, function (props) {\n  return (0,styled_system__WEBPACK_IMPORTED_MODULE_0__.variant)(_theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentVariant(props, 'Alert', 'color'));\n}, (0,styled_components__WEBPACK_IMPORTED_MODULE_2__.css)(function (props) {\n  return _theme__WEBPACK_IMPORTED_MODULE_1__.ThemeUtilities.getComponentCSSOverrides(props, 'Alert');\n}));\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/Alert.styles.ts?");
 
 /***/ }),
 
@@ -3602,7 +3602,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _chargify_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/icons */ \"./packages/icons/src/index.ts\");\n/* harmony import */ var _atoms__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../atoms */ \"./packages/custom-ui-components/src/components/atoms/index.ts\");\n/* harmony import */ var _Alert_styles__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Alert.styles */ \"./packages/custom-ui-components/src/components/molecules/Alert/Alert.styles.ts\");\n/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./components */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts\");\n\n\n\n\n\n\nvar Alert = function Alert(_ref) {\n  var title = _ref.title,\n      _ref$color = _ref.color,\n      color = _ref$color === void 0 ? 'primary' : _ref$color,\n      _ref$size = _ref.size,\n      size = _ref$size === void 0 ? 'regular' : _ref$size,\n      buttonLabel = _ref.buttonLabel,\n      icon = _ref.icon,\n      onClick = _ref.onClick,\n      children = _ref.children,\n      _ref$whiteSpace = _ref.whiteSpace,\n      whiteSpace = _ref$whiteSpace === void 0 ? 'pre-line' : _ref$whiteSpace;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Alert_styles__WEBPACK_IMPORTED_MODULE_3__.Container, {\n    size: size,\n    color: color,\n    role: \"alert\"\n  }, title && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginBottom: 2\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.BodyText, {\n    variant: \"body2\",\n    color: \"inherit\",\n    fontWeight: 600,\n    whiteSpace: whiteSpace\n  }, icon && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Alert_styles__WEBPACK_IMPORTED_MODULE_3__.IconWrapper, {\n    marginRight: 2,\n    display: 'inline'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_1__.Icon, {\n    type: icon,\n    fill: \"currentColor\",\n    size: 16\n  })), title)), children, buttonLabel && onClick && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginTop: 4\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    label: buttonLabel,\n    onClick: onClick,\n    color: \"secondary\"\n  })));\n};\n\nAlert.TextMessage = _components__WEBPACK_IMPORTED_MODULE_4__.TextMessage;\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Alert);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/Alert.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _atoms__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../atoms */ \"./packages/custom-ui-components/src/components/atoms/index.ts\");\n/* harmony import */ var _Alert_styles__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Alert.styles */ \"./packages/custom-ui-components/src/components/molecules/Alert/Alert.styles.ts\");\n/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./components */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts\");\n\n\n\n\n\nvar Alert = function Alert(_ref) {\n  var title = _ref.title,\n      _ref$color = _ref.color,\n      color = _ref$color === void 0 ? 'primary' : _ref$color,\n      _ref$size = _ref.size,\n      size = _ref$size === void 0 ? 'regular' : _ref$size,\n      buttonLabel = _ref.buttonLabel,\n      icon = _ref.icon,\n      onClick = _ref.onClick,\n      children = _ref.children;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Alert_styles__WEBPACK_IMPORTED_MODULE_2__.Container, {\n    size: size,\n    color: color,\n    role: \"alert\"\n  }, title && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components__WEBPACK_IMPORTED_MODULE_3__.Title, {\n    text: title,\n    icon: icon\n  }), children, buttonLabel && onClick && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_1__.Box, {\n    marginTop: 4\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    label: buttonLabel,\n    onClick: onClick,\n    color: \"secondary\"\n  })));\n};\n\nAlert.TextMessage = _components__WEBPACK_IMPORTED_MODULE_3__.TextMessage;\nAlert.Title = _components__WEBPACK_IMPORTED_MODULE_3__.Title;\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Alert);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/Alert.tsx?");
 
 /***/ }),
 
@@ -3617,6 +3617,28 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 
 /***/ }),
 
+/***/ "./packages/custom-ui-components/src/components/molecules/Alert/components/Title.styles.ts":
+/*!*************************************************************************************************!*\
+  !*** ./packages/custom-ui-components/src/components/molecules/Alert/components/Title.styles.ts ***!
+  \*************************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TitleWrapper\": () => (/* binding */ TitleWrapper)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n\n\nvar TitleWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].div.withConfig({\n  displayName: \"Titlestyles__TitleWrapper\",\n  componentId: \"maxio-components__sc-1t0vg3w-0\"\n})([\"&&&{display:flex;align-items:center;\", \";}\"], styled_system__WEBPACK_IMPORTED_MODULE_0__.grid);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/components/Title.styles.ts?");
+
+/***/ }),
+
+/***/ "./packages/custom-ui-components/src/components/molecules/Alert/components/Title.tsx":
+/*!*******************************************************************************************!*\
+  !*** ./packages/custom-ui-components/src/components/molecules/Alert/components/Title.tsx ***!
+  \*******************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Title\": () => (/* binding */ Title)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _chargify_icons__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/icons */ \"./packages/icons/src/index.ts\");\n/* harmony import */ var _atoms__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../../atoms */ \"./packages/custom-ui-components/src/components/atoms/index.ts\");\n/* harmony import */ var _Title_styles__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./Title.styles */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/Title.styles.ts\");\n\n\n\n\nvar Title = function Title(_ref) {\n  var text = _ref.text,\n      icon = _ref.icon;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginBottom: 2\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Title_styles__WEBPACK_IMPORTED_MODULE_3__.TitleWrapper, {\n    gridGap: 2\n  }, icon && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_1__.Icon, {\n    type: icon,\n    fill: \"currentColor\",\n    size: 16\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_2__.BodyText, {\n    variant: \"body2\",\n    color: \"inherit\",\n    fontWeight: 600\n  }, text)));\n};\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/components/Title.tsx?");
+
+/***/ }),
+
 /***/ "./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts":
 /*!******************************************************************************************!*\
   !*** ./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts ***!
@@ -3624,7 +3646,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TextMessage\": () => (/* reexport safe */ _TextMessage__WEBPACK_IMPORTED_MODULE_0__.TextMessage)\n/* harmony export */ });\n/* harmony import */ var _TextMessage__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./TextMessage */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/TextMessage.tsx\");\n\n\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"TextMessage\": () => (/* reexport safe */ _TextMessage__WEBPACK_IMPORTED_MODULE_0__.TextMessage),\n/* harmony export */   \"Title\": () => (/* reexport safe */ _Title__WEBPACK_IMPORTED_MODULE_1__.Title)\n/* harmony export */ });\n/* harmony import */ var _TextMessage__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./TextMessage */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/TextMessage.tsx\");\n/* harmony import */ var _Title__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./Title */ \"./packages/custom-ui-components/src/components/molecules/Alert/components/Title.tsx\");\n\n\n\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/Alert/components/index.ts?");
 
 /***/ }),
 
@@ -3921,7 +3943,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Container\": () => (/* binding */ Container),\n/* harmony export */   \"DatePickerStyles\": () => (/* binding */ DatePickerStyles),\n/* harmony export */   \"InputContainer\": () => (/* binding */ InputContainer)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var polished__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! polished */ \"./node_modules/.pnpm/polished@4.2.2/node_modules/polished/dist/polished.esm.js\");\n/* harmony import */ var _mixins__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../mixins */ \"./packages/custom-ui-components/src/mixins/index.ts\");\n\n\n\nvar InputContainer = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].div.withConfig({\n  displayName: \"DatePickerstyles__InputContainer\",\n  componentId: \"maxio-components__sc-sc5uuo-0\"\n})([\"&&&{pointer-events:none;}\"]);\nvar DatePickerStyles = (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.createGlobalStyle)([\".react-calendar{width:300px;max-width:100%;background:\", \";border:none;line-height:1.125em;font-family:\", \";border-radius:\", \"px;box-shadow:0 12px 24px 0 \", \";user-select:none;\", \";}.react-calendar--doubleView{width:700px;}.react-calendar--doubleView .react-calendar__viewContainer{display:flex;margin:-0.5em;}.react-calendar--doubleView .react-calendar__viewContainer > *{width:50%;margin:0.5em;}.react-calendar,.react-calendar *,.react-calendar *:before,.react-calendar *:after{box-sizing:border-box;}.react-calendar button{margin:0;border:0;outline:none;font-family:\", \";}.react-calendar button:enabled:hover{cursor:pointer;}.react-calendar__navigation{display:flex;height:auto;padding:10px 20px;padding:\", \"px;border-bottom:1px solid \", \";column-gap:20px;}.react-calendar__navigation button{background:none;padding:0;min-width:20px;}.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus-visible{background-color:#e6e6e6;}.react-calendar__navigation button[disabled]{background:none;pointer-events:none;opacity:0.5;}.react-calendar__month-view__weekdays{text-align:center;color:\", \";font-size:0.75rem;font-weight:400;text-transform:none;abbr{text-decoration:none;border:none;cursor:default;}}.react-calendar__month-view__weekdays__weekday{padding:10px 5px;}.react-calendar__month-view__weekNumbers .react-calendar__tile{display:flex;align-items:center;justify-content:center;font-size:0.75em;font-weight:bold;padding:calc(0.75em / 0.75) calc(0.5em / 0.75);}.react-calendar__month-view__days__day--neighboringMonth{opacity:0.3;}.react-calendar__year-view .react-calendar__tile,.react-calendar__decade-view .react-calendar__tile,.react-calendar__century-view .react-calendar__tile{padding:10px 5px;border-radius:\", \"px;font-size:14px;border:\", \";}.react-calendar__century-view .react-calendar__tile{font-size:13px;}.react-calendar__tile{max-width:100%;text-align:center;padding:0.75em 0.5em;background:none;}.react-calendar__tile:disabled{background-color:\", \";pointer-events:none;opacity:0.5;}.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus-visible{background-color:#e6e6e6;}.react-calendar__tile--now{background:#ffff76;}.react-calendar__tile--now:enabled:hover,.react-calendar__tile--now:enabled:focus-visible{background:#ffffa9;}.react-calendar__tile--hasActive{background:#76baff;}.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus-visible{background:#a9d4ff;}.react-calendar--selectRange .react-calendar__tile--hover{background-color:#e6e6e6;}.react-calendar__month-view__days__day abbr{font-size:14px;border-radius:50%;width:\", \"px;height:\", \"px;display:flex;align-items:center;justify-content:center;}.react-calendar__tile.react-calendar__month-view__days__day{padding:0;}.react-calendar__month-view{padding:\", \"px;padding-top:0;}.react-calendar__tile--now,.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus-visible,.react-calendar__navigation__label:enabled:hover,.react-calendar__navigation__label:enabled:focus-visible,.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus-visible,.react-calendar__navigation button[disabled]{background:\", \";}button.react-calendar__tile--active abbr,button.react-calendar__tile--active:enabled:hover abbr,button.react-calendar__tile--active:enabled:focus-visible abbr button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend abbr,button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend:enabled:hover abbr,button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend:enabled:focus-visible abbr,.react-calendar__tile.react-calendar__tile--active.react-calendar__month-view__days__day:hover abbr,.react-calendar__tile.react-calendar__tile--active.react-calendar__month-view__days__day:focus-visible abbr,.react-calendar__tile--hasActive,.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:focus-visible{color:\", \";background:\", \";}button.react-calendar__tile--hasActive.react-calendar__year-view__months__month,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:focus-visible{border:\", \";}.react-calendar__navigation__label__labelText{font-size:1rem;color:\", \";}button.react-calendar__navigation__arrow:enabled:hover,button.react-calendar__navigation__arrow:enabled:focus-visible{background:none;}button.react-calendar__navigation__arrow:enabled:focus-visible{outline:\", \";}button.react-calendar__navigation__label{padding:10px;border-radius:\", \"px;transition:background-color 250ms ease-in-out;}.react-calendar__year-view__months,.react-calendar__decade-view__years,.react-calendar__century-view__decades{padding:\", \"px;padding-top:0;}.react-calendar__tile.react-calendar__month-view__days__day:hover,.react-calendar__tile.react-calendar__month-view__days__day:focus-visible{background:none;abbr{background:\", \";}}.react-calendar__tile--now.react-calendar__month-view__days__day{background:none;abbr{border:\", \";}&:hover,&:focus-visible{abbr{background:\", \";}}}.react-calendar__tile--now.react-calendar__year-view__months__month:not(.react-calendar__tile--hasActive),.react-calendar__tile--now.react-calendar__century-view__decades__decade:not(.react-calendar__tile--hasActive),.react-calendar__tile--now.react-calendar__decade-view__years__year:not(.react-calendar__tile--hasActive){background:none;outline:\", \";outline-offset:-2px;&:hover,&:focus-visible{background:\", \";}}.react-calendar__tile--now.react-calendar__tile--active{abbr{background:\", \";}}.react-calendar__month-view__weekdays abbr{font-weight:800;text-transform:uppercase;}.react-calendar__month-view__days__day{&--weekend{color:\", \";}}.react-calendar__tile--now.react-calendar__month-view__days__day abbr{border:\", \";}.react-calendar__tile:not(.react-calendar__tile--now,.react-calendar__month-view__days__day--weekend,.react-calendar__tile--hasActive){color:\", \";}\"], function (_ref) {\n  var theme = _ref.theme;\n  return theme.colors.white.main;\n}, function (_ref2) {\n  var theme = _ref2.theme;\n  return theme.fonts.secondary;\n}, function (_ref3) {\n  var theme = _ref3.theme;\n  return theme.radii[3];\n}, function (_ref4) {\n  var theme = _ref4.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.85, theme.colors.black.dark);\n}, _mixins__WEBPACK_IMPORTED_MODULE_0__.fontSmoothing, function (_ref5) {\n  var theme = _ref5.theme;\n  return theme.fonts.secondary;\n}, function (_ref6) {\n  var theme = _ref6.theme;\n  return theme.space[3];\n}, function (_ref7) {\n  var theme = _ref7.theme;\n  return theme.colors.white.main;\n}, function (_ref8) {\n  var theme = _ref8.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.3, theme.colors.black.dark);\n}, function (_ref9) {\n  var theme = _ref9.theme;\n  return theme.radii[3];\n}, function (_ref10) {\n  var theme = _ref10.theme;\n  return \"2px solid \".concat(theme.colors.white.main);\n}, function (_ref11) {\n  var theme = _ref11.theme;\n  return theme.colors.primary.extraLight;\n}, function (_ref12) {\n  var theme = _ref12.theme;\n  return theme.sizes[5];\n}, function (_ref13) {\n  var theme = _ref13.theme;\n  return theme.sizes[5];\n}, function (_ref14) {\n  var theme = _ref14.theme;\n  return theme.space[3];\n}, function (_ref15) {\n  var theme = _ref15.theme;\n  return theme.colors.primary.extraLight;\n}, function (_ref16) {\n  var theme = _ref16.theme;\n  return theme.colors.white.main;\n}, function (_ref17) {\n  var theme = _ref17.theme;\n  return theme.colors.primary.main;\n}, function (_ref18) {\n  var theme = _ref18.theme;\n  return \"2px solid \".concat(theme.colors.white.main);\n}, function (_ref19) {\n  var theme = _ref19.theme;\n  return theme.colors.primary.main;\n}, function (_ref20) {\n  var theme = _ref20.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref21) {\n  var theme = _ref21.theme;\n  return theme.radii[3];\n}, function (_ref22) {\n  var theme = _ref22.theme;\n  return theme.space[3];\n}, function (_ref23) {\n  var theme = _ref23.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.dark);\n}, function (_ref24) {\n  var theme = _ref24.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref25) {\n  var theme = _ref25.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.main);\n}, function (_ref26) {\n  var theme = _ref26.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref27) {\n  var theme = _ref27.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.main);\n}, function (_ref28) {\n  var theme = _ref28.theme;\n  return theme.colors.primary.main;\n}, function (_ref29) {\n  var theme = _ref29.theme;\n  return theme.colors.danger.main;\n}, function (_ref30) {\n  var theme = _ref30.theme;\n  return \"1px solid \".concat(theme.colors.primary.main);\n}, function (_ref31) {\n  var theme = _ref31.theme;\n  return theme.colors.black.main;\n});\nvar Container = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].div.withConfig({\n  displayName: \"DatePickerstyles__Container\",\n  componentId: \"maxio-components__sc-sc5uuo-1\"\n})([\"&&&{position:relative;}\"]);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.styles.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Container\": () => (/* binding */ Container),\n/* harmony export */   \"DatePickerStyles\": () => (/* binding */ DatePickerStyles)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var polished__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! polished */ \"./node_modules/.pnpm/polished@4.2.2/node_modules/polished/dist/polished.esm.js\");\n/* harmony import */ var _mixins__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../../../mixins */ \"./packages/custom-ui-components/src/mixins/index.ts\");\n\n\n\nvar DatePickerStyles = (0,styled_components__WEBPACK_IMPORTED_MODULE_1__.createGlobalStyle)([\".react-calendar{width:300px;max-width:100%;background:\", \";border:none;line-height:1.125em;font-family:\", \";border-radius:\", \"px;box-shadow:0 12px 24px 0 \", \";user-select:none;\", \";}.react-calendar--doubleView{width:700px;}.react-calendar--doubleView .react-calendar__viewContainer{display:flex;margin:-0.5em;}.react-calendar--doubleView .react-calendar__viewContainer > *{width:50%;margin:0.5em;}.react-calendar,.react-calendar *,.react-calendar *:before,.react-calendar *:after{box-sizing:border-box;}.react-calendar button{margin:0;border:0;outline:none;font-family:\", \";}.react-calendar button:enabled:hover{cursor:pointer;}.react-calendar__navigation{display:flex;height:auto;padding:10px 20px;padding:\", \"px;border-bottom:1px solid \", \";column-gap:20px;}.react-calendar__navigation button{background:none;padding:0;min-width:20px;}.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus-visible{background-color:#e6e6e6;}.react-calendar__navigation button[disabled]{background:none;pointer-events:none;opacity:0.5;}.react-calendar__month-view__weekdays{text-align:center;color:\", \";font-size:0.75rem;font-weight:400;text-transform:none;abbr{text-decoration:none;border:none;cursor:default;}}.react-calendar__month-view__weekdays__weekday{padding:10px 5px;}.react-calendar__month-view__weekNumbers .react-calendar__tile{display:flex;align-items:center;justify-content:center;font-size:0.75em;font-weight:bold;padding:calc(0.75em / 0.75) calc(0.5em / 0.75);}.react-calendar__month-view__days__day--neighboringMonth{opacity:0.3;}.react-calendar__year-view .react-calendar__tile,.react-calendar__decade-view .react-calendar__tile,.react-calendar__century-view .react-calendar__tile{padding:10px 5px;border-radius:\", \"px;font-size:14px;border:\", \";}.react-calendar__century-view .react-calendar__tile{font-size:13px;}.react-calendar__tile{max-width:100%;text-align:center;padding:0.75em 0.5em;background:none;}.react-calendar__tile:disabled{background-color:\", \";pointer-events:none;opacity:0.5;}.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus-visible{background-color:#e6e6e6;}.react-calendar__tile--now{background:#ffff76;}.react-calendar__tile--now:enabled:hover,.react-calendar__tile--now:enabled:focus-visible{background:#ffffa9;}.react-calendar__tile--hasActive{background:#76baff;}.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus-visible{background:#a9d4ff;}.react-calendar--selectRange .react-calendar__tile--hover{background-color:#e6e6e6;}.react-calendar__month-view__days__day abbr{font-size:14px;border-radius:50%;width:\", \"px;height:\", \"px;display:flex;align-items:center;justify-content:center;}.react-calendar__tile.react-calendar__month-view__days__day{padding:0;}.react-calendar__month-view{padding:\", \"px;padding-top:0;}.react-calendar__tile--now,.react-calendar__tile:enabled:hover,.react-calendar__tile:enabled:focus-visible,.react-calendar__navigation__label:enabled:hover,.react-calendar__navigation__label:enabled:focus-visible,.react-calendar__navigation button:enabled:hover,.react-calendar__navigation button:enabled:focus-visible,.react-calendar__navigation button[disabled]{background:\", \";}button.react-calendar__tile--active abbr,button.react-calendar__tile--active:enabled:hover abbr,button.react-calendar__tile--active:enabled:focus-visible abbr button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend abbr,button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend:enabled:hover abbr,button.react-calendar__tile--active.react-calendar__month-view__days__day--weekend:enabled:focus-visible abbr,.react-calendar__tile.react-calendar__tile--active.react-calendar__month-view__days__day:hover abbr,.react-calendar__tile.react-calendar__tile--active.react-calendar__month-view__days__day:focus-visible abbr,.react-calendar__tile--hasActive,.react-calendar__tile--hasActive:enabled:hover,.react-calendar__tile--hasActive:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:focus-visible{color:\", \";background:\", \";}button.react-calendar__tile--hasActive.react-calendar__year-view__months__month,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__year-view__months__month:enabled:focus-visible,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:hover,button.react-calendar__tile--hasActive.react-calendar__decade-view__years__year:enabled:focus-visible{border:\", \";}.react-calendar__navigation__label__labelText{font-size:1rem;color:\", \";}button.react-calendar__navigation__arrow:enabled:hover,button.react-calendar__navigation__arrow:enabled:focus-visible{background:none;}button.react-calendar__navigation__arrow:enabled:focus-visible{outline:\", \";}button.react-calendar__navigation__label{padding:10px;border-radius:\", \"px;transition:background-color 250ms ease-in-out;}.react-calendar__year-view__months,.react-calendar__decade-view__years,.react-calendar__century-view__decades{padding:\", \"px;padding-top:0;}.react-calendar__tile.react-calendar__month-view__days__day:hover,.react-calendar__tile.react-calendar__month-view__days__day:focus-visible{background:none;abbr{background:\", \";}}.react-calendar__tile--now.react-calendar__month-view__days__day{background:none;abbr{border:\", \";}&:hover,&:focus-visible{abbr{background:\", \";}}}.react-calendar__tile--now.react-calendar__year-view__months__month:not(.react-calendar__tile--hasActive),.react-calendar__tile--now.react-calendar__century-view__decades__decade:not(.react-calendar__tile--hasActive),.react-calendar__tile--now.react-calendar__decade-view__years__year:not(.react-calendar__tile--hasActive){background:none;outline:\", \";outline-offset:-2px;&:hover,&:focus-visible{background:\", \";}}.react-calendar__tile--now.react-calendar__tile--active{abbr{background:\", \";}}.react-calendar__month-view__weekdays abbr{font-weight:800;text-transform:uppercase;}.react-calendar__month-view__days__day{&--weekend{color:\", \";}}.react-calendar__tile--now.react-calendar__month-view__days__day abbr{border:\", \";}.react-calendar__tile:not(.react-calendar__tile--now,.react-calendar__month-view__days__day--weekend,.react-calendar__tile--hasActive){color:\", \";}\"], function (_ref) {\n  var theme = _ref.theme;\n  return theme.colors.white.main;\n}, function (_ref2) {\n  var theme = _ref2.theme;\n  return theme.fonts.secondary;\n}, function (_ref3) {\n  var theme = _ref3.theme;\n  return theme.radii[3];\n}, function (_ref4) {\n  var theme = _ref4.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.85, theme.colors.black.dark);\n}, _mixins__WEBPACK_IMPORTED_MODULE_0__.fontSmoothing, function (_ref5) {\n  var theme = _ref5.theme;\n  return theme.fonts.secondary;\n}, function (_ref6) {\n  var theme = _ref6.theme;\n  return theme.space[3];\n}, function (_ref7) {\n  var theme = _ref7.theme;\n  return theme.colors.white.main;\n}, function (_ref8) {\n  var theme = _ref8.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.3, theme.colors.black.dark);\n}, function (_ref9) {\n  var theme = _ref9.theme;\n  return theme.radii[3];\n}, function (_ref10) {\n  var theme = _ref10.theme;\n  return \"2px solid \".concat(theme.colors.white.main);\n}, function (_ref11) {\n  var theme = _ref11.theme;\n  return theme.colors.primary.extraLight;\n}, function (_ref12) {\n  var theme = _ref12.theme;\n  return theme.sizes[5];\n}, function (_ref13) {\n  var theme = _ref13.theme;\n  return theme.sizes[5];\n}, function (_ref14) {\n  var theme = _ref14.theme;\n  return theme.space[3];\n}, function (_ref15) {\n  var theme = _ref15.theme;\n  return theme.colors.primary.extraLight;\n}, function (_ref16) {\n  var theme = _ref16.theme;\n  return theme.colors.white.main;\n}, function (_ref17) {\n  var theme = _ref17.theme;\n  return theme.colors.primary.main;\n}, function (_ref18) {\n  var theme = _ref18.theme;\n  return \"2px solid \".concat(theme.colors.white.main);\n}, function (_ref19) {\n  var theme = _ref19.theme;\n  return theme.colors.primary.main;\n}, function (_ref20) {\n  var theme = _ref20.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref21) {\n  var theme = _ref21.theme;\n  return theme.radii[3];\n}, function (_ref22) {\n  var theme = _ref22.theme;\n  return theme.space[3];\n}, function (_ref23) {\n  var theme = _ref23.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.dark);\n}, function (_ref24) {\n  var theme = _ref24.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref25) {\n  var theme = _ref25.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.main);\n}, function (_ref26) {\n  var theme = _ref26.theme;\n  return \"1px solid \".concat((0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.5, theme.colors.primary.main));\n}, function (_ref27) {\n  var theme = _ref27.theme;\n  return (0,polished__WEBPACK_IMPORTED_MODULE_2__.transparentize)(0.9, theme.colors.primary.main);\n}, function (_ref28) {\n  var theme = _ref28.theme;\n  return theme.colors.primary.main;\n}, function (_ref29) {\n  var theme = _ref29.theme;\n  return theme.colors.danger.main;\n}, function (_ref30) {\n  var theme = _ref30.theme;\n  return \"1px solid \".concat(theme.colors.primary.main);\n}, function (_ref31) {\n  var theme = _ref31.theme;\n  return theme.colors.black.main;\n});\nvar Container = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].div.withConfig({\n  displayName: \"DatePickerstyles__Container\",\n  componentId: \"maxio-components__sc-sc5uuo-0\"\n})([\"&&&{position:relative;}\"]);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.styles.ts?");
 
 /***/ }),
 
@@ -3932,7 +3954,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/index.js\");\n/* harmony import */ var react_calendar__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! react-calendar */ \"./node_modules/.pnpm/react-calendar@3.8.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-calendar/dist/esm/index.js\");\n/* harmony import */ var react_fit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-fit */ \"./node_modules/.pnpm/react-fit@1.4.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-fit/dist/esm/Fit.js\");\n/* harmony import */ var _chargify_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @chargify/icons */ \"./packages/icons/src/index.ts\");\n/* harmony import */ var _atoms__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../atoms */ \"./packages/custom-ui-components/src/components/atoms/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../hooks */ \"./packages/custom-ui-components/src/hooks/index.ts\");\n/* harmony import */ var _DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DatePicker.styles */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.styles.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./constants */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/constants.ts\");\n/* harmony import */ var _translations__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./translations */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/translations.ts\");\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\n\nvar DatePicker = function DatePicker(_ref) {\n  var value = _ref.value,\n      _ref$translations = _ref.translations,\n      translations = _ref$translations === void 0 ? _translations__WEBPACK_IMPORTED_MODULE_8__.defaultTranslations : _ref$translations,\n      _ref$locale = _ref.locale,\n      locale = _ref$locale === void 0 ? 'en' : _ref$locale,\n      minDate = _ref.minDate,\n      maxDate = _ref.maxDate,\n      portalContainer = _ref.portalContainer,\n      _ref$calendarAlignmen = _ref.calendarAlignment,\n      calendarAlignment = _ref$calendarAlignmen === void 0 ? 'left' : _ref$calendarAlignmen,\n      _onChange = _ref.onChange,\n      modalRef = _ref.modalRef,\n      disabled = _ref.disabled;\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),\n      _useState2 = _slicedToArray(_useState, 2),\n      showCalendar = _useState2[0],\n      setCalendar = _useState2[1];\n\n  var calendarContainerRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n  var inputRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n  var placeholder = translations.placeholder;\n  var portalElement = portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current;\n  (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useOnClickOutside)([calendarContainerRef, portalContainer], function () {\n    if (showCalendar) {\n      setCalendar(false);\n    }\n  }, modalRef === null || modalRef === void 0 ? void 0 : modalRef.current);\n\n  var renderCalendar = function renderCalendar() {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_calendar__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n      onChange: function onChange(date) {\n        _onChange(date);\n\n        setCalendar(false);\n      },\n      value: value,\n      nextLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_3__.Icon, {\n        type: \"chevronRight\",\n        fill: \"black.main\",\n        size: 12\n      }),\n      next2Label: null,\n      prevLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_3__.Icon, {\n        type: \"chevronLeft\",\n        fill: \"black.main\",\n        size: 12\n      }),\n      prev2Label: null,\n      minDate: minDate,\n      maxDate: maxDate,\n      locale: locale\n    });\n  };\n\n  var calculateDropdownPosition = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\n    var element = calendarContainerRef.current;\n\n    var _element$getBoundingC = element.getBoundingClientRect(),\n        top = _element$getBoundingC.top,\n        height = _element$getBoundingC.height,\n        left = _element$getBoundingC.left,\n        width = _element$getBoundingC.width;\n\n    var alignmentPosition = calendarAlignment === 'left' ? left : left - (_constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH - width);\n    return {\n      top: top + height + window.scrollY,\n      left: alignmentPosition + window.scrollX,\n      width: _constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH\n    };\n  }, [portalContainer, calendarAlignment]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__.Container, {\n    ref: calendarContainerRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__.DatePickerStyles, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    onClick: function onClick() {\n      return !disabled && setCalendar(!showCalendar);\n    },\n    style: {\n      cursor: disabled ? 'not-allowed' : 'pointer'\n    },\n    \"data-testid\": \"calendar-input\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__.InputContainer, {\n    ref: inputRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_4__.Input, {\n    onChange: function onChange() {\n      return false;\n    },\n    inputSize: \"small\",\n    iconRight: \"calendar\",\n    placeholder: placeholder,\n    readOnly: true,\n    value: value === null || value === void 0 ? void 0 : value.toLocaleDateString(locale),\n    disabled: disabled\n  }))), showCalendar && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, portalElement ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/(0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({\n      position: 'absolute',\n      zIndex: 1\n    }, calculateDropdownPosition())\n  }, renderCalendar()), portalElement)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_fit__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    invertSecondaryAxis: calendarAlignment === 'right'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: {\n      position: 'absolute',\n      width: _constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH\n    },\n    \"data-testid\": \"calendar-container\"\n  }, renderCalendar()))));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DatePicker);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_dom__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react-dom */ \"./node_modules/.pnpm/react-dom@18.2.0_react@18.2.0/node_modules/react-dom/index.js\");\n/* harmony import */ var react_calendar__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-calendar */ \"./node_modules/.pnpm/react-calendar@3.8.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-calendar/dist/esm/index.js\");\n/* harmony import */ var react_fit__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-fit */ \"./node_modules/.pnpm/react-fit@1.4.0_biqbaboplfbrettd7655fr4n2y/node_modules/react-fit/dist/esm/Fit.js\");\n/* harmony import */ var _chargify_icons__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @chargify/icons */ \"./packages/icons/src/index.ts\");\n/* harmony import */ var _atoms__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../atoms */ \"./packages/custom-ui-components/src/components/atoms/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../hooks */ \"./packages/custom-ui-components/src/hooks/index.ts\");\n/* harmony import */ var _DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./DatePicker.styles */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.styles.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./constants */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/constants.ts\");\n/* harmony import */ var _translations__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./translations */ \"./packages/custom-ui-components/src/components/molecules/DatePicker/translations.ts\");\n/* harmony import */ var _constants__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../../../constants */ \"./packages/custom-ui-components/src/constants.ts\");\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\nfunction _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }\n\nfunction _nonIterableRest() { throw new TypeError(\"Invalid attempt to destructure non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.\"); }\n\nfunction _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === \"string\") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === \"Object\" && o.constructor) n = o.constructor.name; if (n === \"Map\" || n === \"Set\") return Array.from(o); if (n === \"Arguments\" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }\n\nfunction _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) { arr2[i] = arr[i]; } return arr2; }\n\nfunction _iterableToArrayLimit(arr, i) { var _i = arr == null ? null : typeof Symbol !== \"undefined\" && arr[Symbol.iterator] || arr[\"@@iterator\"]; if (_i == null) return; var _arr = []; var _n = true; var _d = false; var _s, _e; try { for (_i = _i.call(arr); !(_n = (_s = _i.next()).done); _n = true) { _arr.push(_s.value); if (i && _arr.length === i) break; } } catch (err) { _d = true; _e = err; } finally { try { if (!_n && _i[\"return\"] != null) _i[\"return\"](); } finally { if (_d) throw _e; } } return _arr; }\n\nfunction _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar DatePicker = function DatePicker(_ref) {\n  var value = _ref.value,\n      _ref$translations = _ref.translations,\n      translations = _ref$translations === void 0 ? _translations__WEBPACK_IMPORTED_MODULE_8__.defaultTranslations : _ref$translations,\n      _ref$locale = _ref.locale,\n      locale = _ref$locale === void 0 ? 'en' : _ref$locale,\n      minDate = _ref.minDate,\n      maxDate = _ref.maxDate,\n      portalContainer = _ref.portalContainer,\n      _ref$calendarAlignmen = _ref.calendarAlignment,\n      calendarAlignment = _ref$calendarAlignmen === void 0 ? 'left' : _ref$calendarAlignmen,\n      _onChange = _ref.onChange,\n      modalRef = _ref.modalRef,\n      disabled = _ref.disabled;\n\n  var _useState = (0,react__WEBPACK_IMPORTED_MODULE_0__.useState)(false),\n      _useState2 = _slicedToArray(_useState, 2),\n      showCalendar = _useState2[0],\n      setCalendar = _useState2[1];\n\n  var calendarContainerRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n  var inputRef = (0,react__WEBPACK_IMPORTED_MODULE_0__.useRef)(null);\n  var placeholder = translations.placeholder;\n  var portalElement = portalContainer === null || portalContainer === void 0 ? void 0 : portalContainer.current;\n  (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useOnClickOutside)([calendarContainerRef, portalContainer], function () {\n    if (showCalendar) {\n      setCalendar(false);\n    }\n  }, modalRef === null || modalRef === void 0 ? void 0 : modalRef.current);\n\n  var renderCalendar = function renderCalendar() {\n    return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_calendar__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n      onChange: function onChange(date) {\n        _onChange(date);\n\n        setCalendar(false);\n      },\n      value: value,\n      nextLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_3__.Icon, {\n        type: \"chevronRight\",\n        fill: \"black.main\",\n        size: 12\n      }),\n      next2Label: null,\n      prevLabel: /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_icons__WEBPACK_IMPORTED_MODULE_3__.Icon, {\n        type: \"chevronLeft\",\n        fill: \"black.main\",\n        size: 12\n      }),\n      prev2Label: null,\n      minDate: minDate,\n      maxDate: maxDate,\n      locale: locale\n    });\n  };\n\n  var calculateDropdownPosition = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function () {\n    var element = calendarContainerRef.current;\n\n    var _element$getBoundingC = element.getBoundingClientRect(),\n        top = _element$getBoundingC.top,\n        height = _element$getBoundingC.height,\n        left = _element$getBoundingC.left,\n        width = _element$getBoundingC.width;\n\n    var alignmentPosition = calendarAlignment === 'left' ? left : left - (_constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH - width);\n    return {\n      top: top + height + window.scrollY,\n      left: alignmentPosition + window.scrollX,\n      width: _constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH\n    };\n  }, [calendarAlignment]);\n\n  var handleBackspace = function handleBackspace(e) {\n    if (e.key === _constants__WEBPACK_IMPORTED_MODULE_9__.KEYBOARD_KEYS.BACKSPACE) {\n      _onChange(null);\n    }\n  };\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__.Container, {\n    ref: calendarContainerRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_DatePicker_styles__WEBPACK_IMPORTED_MODULE_6__.DatePickerStyles, null), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    onClick: function onClick() {\n      return !disabled && setCalendar(!showCalendar);\n    },\n    style: {\n      cursor: disabled ? 'not-allowed' : 'pointer'\n    },\n    \"data-testid\": \"calendar-input\"\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    ref: inputRef\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_atoms__WEBPACK_IMPORTED_MODULE_4__.Input, {\n    onChange: function onChange() {\n      return false;\n    },\n    inputSize: \"small\",\n    iconRight: \"calendar\",\n    placeholder: placeholder,\n    readOnly: true,\n    onKeyDown: handleBackspace,\n    value: (value === null || value === void 0 ? void 0 : value.toLocaleDateString(locale)) || '',\n    disabled: disabled\n  }))), showCalendar && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, portalElement ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/(0,react_dom__WEBPACK_IMPORTED_MODULE_1__.createPortal)( /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: _objectSpread({\n      position: 'absolute',\n      zIndex: 1\n    }, calculateDropdownPosition())\n  }, renderCalendar()), portalElement)) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_fit__WEBPACK_IMPORTED_MODULE_2__[\"default\"], {\n    invertSecondaryAxis: calendarAlignment === 'right'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    style: {\n      position: 'absolute',\n      width: _constants__WEBPACK_IMPORTED_MODULE_7__.CALENDAR_WIDTH\n    },\n    \"data-testid\": \"calendar-container\"\n  }, renderCalendar()))));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (DatePicker);\n\n//# sourceURL=webpack://Maxio/./packages/custom-ui-components/src/components/molecules/DatePicker/DatePicker.tsx?");
 
 /***/ }),
 
@@ -6594,7 +6616,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"IconWrapper\": () => (/* binding */ IconWrapper)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n\n\nvar IconWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].div.withConfig({\n  displayName: \"Iconstyles__IconWrapper\",\n  componentId: \"maxio-components__sc-r7ym3h-0\"\n})([\"&&&{display:inline-flex;line-height:0;\", \";}&&& .svg-inline--fa{width:\", \";height:\", \";}\"], styled_system__WEBPACK_IMPORTED_MODULE_0__.color, function (_ref) {\n  var size = _ref.size;\n  return size ? \"\".concat(size, \"px\") : '100%';\n}, function (_ref2) {\n  var size = _ref2.size;\n  return size ? \"\".concat(size, \"px\") : '100%';\n});\n\n//# sourceURL=webpack://Maxio/./packages/icons/src/Icon.styles.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"IconWrapper\": () => (/* binding */ IconWrapper)\n/* harmony export */ });\n/* harmony import */ var styled_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! styled-components */ \"./node_modules/.pnpm/styled-components@5.3.5_7i5myeigehqah43i5u7wbekgba/node_modules/styled-components/dist/styled-components.browser.esm.js\");\n/* harmony import */ var styled_system__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! styled-system */ \"./node_modules/.pnpm/styled-system@5.1.5/node_modules/styled-system/dist/index.esm.js\");\n\n\nvar IconWrapper = styled_components__WEBPACK_IMPORTED_MODULE_1__[\"default\"].span.withConfig({\n  displayName: \"Iconstyles__IconWrapper\",\n  componentId: \"maxio-components__sc-r7ym3h-0\"\n})([\"&&&{display:inline-flex;line-height:0;\", \";}&&& .svg-inline--fa{width:\", \";height:\", \";}\"], styled_system__WEBPACK_IMPORTED_MODULE_0__.color, function (_ref) {\n  var size = _ref.size;\n  return size ? \"\".concat(size, \"px\") : '100%';\n}, function (_ref2) {\n  var size = _ref2.size;\n  return size ? \"\".concat(size, \"px\") : '100%';\n});\n\n//# sourceURL=webpack://Maxio/./packages/icons/src/Icon.styles.ts?");
 
 /***/ }),
 
@@ -8002,7 +8024,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeAlerts\": () => (/* binding */ PlanChangeAlerts)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n\n\n\nvar PlanChangeAlerts = function PlanChangeAlerts(_ref) {\n  var basePlanPrice = _ref.basePlanPrice,\n      productChangeStrategy = _ref.productChangeStrategy,\n      nextBillingDate = _ref.nextBillingDate,\n      totalCharge = _ref.totalCharge;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_2__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var commonAlertProps = {\n    color: 'success',\n    icon: 'receipt'\n  };\n\n  switch (productChangeStrategy) {\n    case 'prorated':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread(_objectSpread({}, commonAlertProps), {}, {\n        title: t('plan_change.prorated_title', {\n          totalCharge: totalCharge\n        })\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.prorated_description')));\n\n    case 'non-prorated':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread(_objectSpread({}, commonAlertProps), {}, {\n        title: t('plan_change.instant_title', {\n          date: nextBillingDate,\n          basePlanPrice: basePlanPrice\n        })\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.instant_description')));\n\n    case 'delayed':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread(_objectSpread({}, commonAlertProps), {}, {\n        title: t('plan_change.delayed_title', {\n          date: nextBillingDate,\n          basePlanPrice: basePlanPrice\n        })\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.delayed_description')));\n  }\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeAlerts/PlanChangeAlerts.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeAlerts\": () => (/* binding */ PlanChangeAlerts)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\nfunction ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }\n\nfunction _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }\n\nfunction _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }\n\n\n\n\nvar PlanChangeAlerts = function PlanChangeAlerts(_ref) {\n  var basePlanPrice = _ref.basePlanPrice,\n      productChangeStrategy = _ref.productChangeStrategy,\n      nextBillingDate = _ref.nextBillingDate,\n      totalCharge = _ref.totalCharge,\n      creditBalance = _ref.creditBalance;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_2__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var commonAlertProps = {\n    color: 'success',\n    icon: 'receipt'\n  };\n\n  switch (productChangeStrategy) {\n    case 'prorated':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread({}, commonAlertProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert.Title, {\n        text: t('plan_change.prorated_title', {\n          totalCharge: totalCharge,\n          credit: creditBalance\n        }),\n        icon: 'receipt'\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert.Title, {\n        text: t('plan_change.plan_change_immediately'),\n        icon: 'clock'\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert.Title, {\n        text: t('plan_change.prorated_renewed_title', {\n          date: nextBillingDate\n        }),\n        icon: 'calendar'\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.prorated_description')));\n\n    case 'non-prorated':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread({}, commonAlertProps), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert.Title, {\n        text: t('plan_change.instant_title', {\n          totalCharge: totalCharge\n        }),\n        icon: 'receipt'\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert.Title, {\n        text: t('plan_change.plan_change_immediately'),\n        icon: 'clock'\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.instant_description')));\n\n    case 'delayed':\n      return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Alert, _objectSpread(_objectSpread({}, commonAlertProps), {}, {\n        title: t('plan_change.delayed_title', {\n          date: nextBillingDate,\n          basePlanPrice: basePlanPrice\n        })\n      }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n        variant: 'body2',\n        color: 'success.main'\n      }, t('plan_change.delayed_description')));\n  }\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeAlerts/PlanChangeAlerts.tsx?");
 
 /***/ }),
 
@@ -8024,7 +8046,40 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeSummary\": () => (/* binding */ PlanChangeSummary)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n\n\n\nvar PlanChangeSummary = function PlanChangeSummary(_ref) {\n  var productName = _ref.productName,\n      basePlanPrice = _ref.basePlanPrice,\n      isProrated = _ref.isProrated,\n      existingBalance = _ref.existingBalance,\n      billingEndDate = _ref.billingEndDate,\n      nextBillingAmount = _ref.nextBillingAmount;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_2__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Box, {\n    display: 'flex',\n    justifyContent: 'center',\n    marginBottom: 6\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: 'h4'\n  }, t('plan_change.summary_title'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Box, {\n    marginBottom: 9\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, {\n    rowGap: 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 24\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: 'h4'\n  }, t('plan_change.plan_summary_title', {\n    planName: productName\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.base_plan_price'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, basePlanPrice)), isProrated ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.existing_balance'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, existingBalance))) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 16\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.next_billing_amount', {\n    planName: productName,\n    date: billingEndDate\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, nextBillingAmount)))));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummary/PlanChangeSummary.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeSummary\": () => (/* binding */ PlanChangeSummary)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/Trans.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _components_index__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./components/index */ \"./packages/subscriptions-manager/src/components/PlanChangeSummary/components/index.ts\");\n\n\n\n\nvar PlanChangeSummary = function PlanChangeSummary(_ref) {\n  var productName = _ref.productName,\n      basePlanPrice = _ref.basePlanPrice,\n      productChangeStrategy = _ref.productChangeStrategy,\n      existingBalance = _ref.existingBalance,\n      billingEndDate = _ref.billingEndDate,\n      nextBillingAmount = _ref.nextBillingAmount,\n      currentProductName = _ref.currentProductName,\n      proratedCreditAmount = _ref.proratedCreditAmount;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_3__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var isProrated = productChangeStrategy === 'prorated';\n  var isImmediate = productChangeStrategy === 'non-prorated';\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Box, {\n    marginBottom: 6\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body1',\n    color: 'black.main'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(react_i18next__WEBPACK_IMPORTED_MODULE_4__.Trans, {\n    t: t,\n    i18nKey: 'plan_change.plan_change_from_to',\n    tOptions: {\n      currentPlan: currentProductName,\n      newPlan: productName\n    }\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Box, {\n    marginBottom: 9\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, {\n    rowGap: 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 24\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: 'h4'\n  }, t('plan_change.plan_summary_title', {\n    planName: productName\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.base_plan_price'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, basePlanPrice)), isProrated ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_index__WEBPACK_IMPORTED_MODULE_2__.ProratedColumns, {\n    productName: productName,\n    billingEndDate: billingEndDate,\n    proratedCreditAmount: proratedCreditAmount\n  }) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_index__WEBPACK_IMPORTED_MODULE_2__.NonProratedColumns, {\n    isImmediate: isImmediate,\n    nextBillingAmount: nextBillingAmount,\n    billingEndDate: billingEndDate,\n    existingBalance: existingBalance,\n    productName: productName\n  }))));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummary/PlanChangeSummary.tsx?");
+
+/***/ }),
+
+/***/ "./packages/subscriptions-manager/src/components/PlanChangeSummary/components/NonProratedColumns.tsx":
+/*!***********************************************************************************************************!*\
+  !*** ./packages/subscriptions-manager/src/components/PlanChangeSummary/components/NonProratedColumns.tsx ***!
+  \***********************************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"NonProratedColumns\": () => (/* binding */ NonProratedColumns)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n\n\n\nvar NonProratedColumns = function NonProratedColumns(_ref) {\n  var existingBalance = _ref.existingBalance,\n      productName = _ref.productName,\n      billingEndDate = _ref.billingEndDate,\n      nextBillingAmount = _ref.nextBillingAmount,\n      isImmediate = _ref.isImmediate;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_2__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, isImmediate ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 16\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.current_credit_service_balance'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, existingBalance))) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 16\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.next_billing_amount', {\n    planName: productName,\n    date: billingEndDate\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, nextBillingAmount)));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummary/components/NonProratedColumns.tsx?");
+
+/***/ }),
+
+/***/ "./packages/subscriptions-manager/src/components/PlanChangeSummary/components/ProratedColumns.tsx":
+/*!********************************************************************************************************!*\
+  !*** ./packages/subscriptions-manager/src/components/PlanChangeSummary/components/ProratedColumns.tsx ***!
+  \********************************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"ProratedColumns\": () => (/* binding */ ProratedColumns)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n\n\n\nvar ProratedColumns = function ProratedColumns(_ref) {\n  var proratedCreditAmount = _ref.proratedCreditAmount,\n      productName = _ref.productName,\n      billingEndDate = _ref.billingEndDate;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_2__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    variant: 'body2',\n    color: 'gray.dark',\n    fontWeight: 600\n  }, t('plan_change.prorated_credit', {\n    planName: productName,\n    date: billingEndDate\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, {\n    textAlign: 'right',\n    color: 'success.main',\n    fontWeight: 700\n  }, proratedCreditAmount)));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummary/components/ProratedColumns.tsx?");
+
+/***/ }),
+
+/***/ "./packages/subscriptions-manager/src/components/PlanChangeSummary/components/index.ts":
+/*!*********************************************************************************************!*\
+  !*** ./packages/subscriptions-manager/src/components/PlanChangeSummary/components/index.ts ***!
+  \*********************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"NonProratedColumns\": () => (/* reexport safe */ _NonProratedColumns__WEBPACK_IMPORTED_MODULE_1__.NonProratedColumns),\n/* harmony export */   \"ProratedColumns\": () => (/* reexport safe */ _ProratedColumns__WEBPACK_IMPORTED_MODULE_0__.ProratedColumns)\n/* harmony export */ });\n/* harmony import */ var _ProratedColumns__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./ProratedColumns */ \"./packages/subscriptions-manager/src/components/PlanChangeSummary/components/ProratedColumns.tsx\");\n/* harmony import */ var _NonProratedColumns__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./NonProratedColumns */ \"./packages/subscriptions-manager/src/components/PlanChangeSummary/components/NonProratedColumns.tsx\");\n\n\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummary/components/index.ts?");
 
 /***/ }),
 
@@ -8046,7 +8101,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeSummaryCharges\": () => (/* binding */ PlanChangeSummaryCharges)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var i18next__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! i18next */ \"./node_modules/.pnpm/i18next@21.9.1/node_modules/i18next/dist/esm/i18next.js\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _Summary__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Summary */ \"./packages/subscriptions-manager/src/components/Summary/index.ts\");\n/* harmony import */ var _utils_mapChargeSummaryToTable__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/mapChargeSummaryToTable */ \"./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/utils/mapChargeSummaryToTable.ts\");\n/* harmony import */ var _TotalCharge__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../TotalCharge */ \"./packages/subscriptions-manager/src/components/TotalCharge/index.ts\");\n\n\n\n\n\n\n\n\nvar PlanChangeSummaryCharges = function PlanChangeSummaryCharges(_ref) {\n  var changePlanPreview = _ref.changePlanPreview,\n      currency = _ref.currency;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_7__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Summary__WEBPACK_IMPORTED_MODULE_4__.Summary, {\n    paddingX: 5,\n    paddingTop: 2,\n    marginBottom: 3\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_TotalCharge__WEBPACK_IMPORTED_MODULE_6__.TotalCharge, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.SummaryTable, {\n    rows: (0,_utils_mapChargeSummaryToTable__WEBPACK_IMPORTED_MODULE_5__.mapChargeSummaryToTable)({\n      changePlanPreview: changePlanPreview,\n      t: t,\n      language: i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language,\n      currency: currency\n    }),\n    columnSpans: [12, 12]\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Box, {\n    paddingTop: 3,\n    paddingBottom: 4\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.BodyText, {\n    variant: \"body1\",\n    color: \"success.main\",\n    fontWeight: 3\n  }, t('plan_change.total_charge'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.BodyText, {\n    variant: \"body1\",\n    color: \"success.main\",\n    textAlign: \"right\",\n    fontWeight: 3\n  }, (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_2__.formatCurrency)(currency, changePlanPreview.totalInCents > 0 ? changePlanPreview.totalInCents : 0, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language))))));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/PlanChangeSummaryCharges.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PlanChangeSummaryCharges\": () => (/* binding */ PlanChangeSummaryCharges)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var i18next__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! i18next */ \"./node_modules/.pnpm/i18next@21.9.1/node_modules/i18next/dist/esm/i18next.js\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _Summary__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../Summary */ \"./packages/subscriptions-manager/src/components/Summary/index.ts\");\n/* harmony import */ var _utils_mapChargeSummaryToTable__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./utils/mapChargeSummaryToTable */ \"./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/utils/mapChargeSummaryToTable.ts\");\n/* harmony import */ var _TotalCharge__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../TotalCharge */ \"./packages/subscriptions-manager/src/components/TotalCharge/index.ts\");\n\n\n\n\n\n\n\n\nvar PlanChangeSummaryCharges = function PlanChangeSummaryCharges(_ref) {\n  var changePlanPreview = _ref.changePlanPreview,\n      currency = _ref.currency;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_7__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Summary__WEBPACK_IMPORTED_MODULE_4__.Summary, {\n    paddingX: 5,\n    paddingTop: 2,\n    marginBottom: 6\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_TotalCharge__WEBPACK_IMPORTED_MODULE_6__.TotalCharge, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.SummaryTable, {\n    rows: (0,_utils_mapChargeSummaryToTable__WEBPACK_IMPORTED_MODULE_5__.mapChargeSummaryToTable)({\n      changePlanPreview: changePlanPreview,\n      t: t,\n      language: i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language,\n      currency: currency\n    }),\n    columnSpans: [12, 12]\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Box, {\n    paddingTop: 3,\n    paddingBottom: 4\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.BodyText, {\n    variant: \"body1\",\n    color: \"success.main\",\n    fontWeight: 3\n  }, t('plan_change.total_charge'))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.Column, {\n    span: 12\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_3__.BodyText, {\n    variant: \"body1\",\n    color: \"success.main\",\n    textAlign: \"right\",\n    fontWeight: 3\n  }, (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_2__.formatCurrency)(currency, changePlanPreview.totalInCents > 0 ? changePlanPreview.totalInCents : 0, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language))))));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/PlanChangeSummaryCharges.tsx?");
 
 /***/ }),
 
@@ -8068,7 +8123,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"mapChargeSummaryToTable\": () => (/* binding */ mapChargeSummaryToTable)\n/* harmony export */ });\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n\nvar mapChargeSummaryToTable = function mapChargeSummaryToTable(_ref) {\n  var changePlanPreview = _ref.changePlanPreview,\n      t = _ref.t,\n      language = _ref.language,\n      currency = _ref.currency;\n\n  var formatAmount = function formatAmount(amount) {\n    return (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_0__.formatCurrency)(currency, amount, language);\n  };\n\n  var chargesSummary = [[{\n    value: t('plan_change.subtotal'),\n    fontWeight: 3,\n    fontSize: 1\n  }, {\n    value: formatAmount(changePlanPreview.subtotalInCents > 0 ? changePlanPreview.subtotalInCents : 0),\n    fontWeight: 3,\n    fontSize: 1,\n    textAlign: 'right'\n  }]];\n  chargesSummary.push([{\n    value: t('plan_change.taxes'),\n    fontWeight: 3,\n    fontSize: 1\n  }, {\n    value: formatAmount(changePlanPreview.totalTaxInCents),\n    fontWeight: 3,\n    fontSize: 1,\n    textAlign: 'right'\n  }]);\n  return chargesSummary;\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/utils/mapChargeSummaryToTable.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"mapChargeSummaryToTable\": () => (/* binding */ mapChargeSummaryToTable)\n/* harmony export */ });\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n\nvar mapChargeSummaryToTable = function mapChargeSummaryToTable(_ref) {\n  var changePlanPreview = _ref.changePlanPreview,\n      t = _ref.t,\n      language = _ref.language,\n      currency = _ref.currency;\n\n  var formatAmount = function formatAmount(amount) {\n    return (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_0__.formatCurrency)(currency, amount, language);\n  };\n\n  var positiveCreditBalance = changePlanPreview.totalInCents > 0;\n  var chargesSummary = [[{\n    value: t('plan_change.subtotal'),\n    fontWeight: 3,\n    fontSize: 1\n  }, {\n    value: formatAmount(changePlanPreview.subtotalInCents),\n    fontWeight: 3,\n    fontSize: 1,\n    textAlign: 'right'\n  }], [{\n    value: t('plan_change.taxes'),\n    fontWeight: 3,\n    fontSize: 1\n  }, {\n    value: formatAmount(changePlanPreview.totalTaxInCents),\n    fontWeight: 3,\n    fontSize: 1,\n    textAlign: 'right'\n  }]];\n\n  if (changePlanPreview.productChangeStrategy === 'prorated') {\n    chargesSummary.push([{\n      value: positiveCreditBalance ? t('plan_change.credit_balance_to_be_applied') : t('plan_change.credit_balance_change'),\n      fontWeight: 3,\n      fontSize: 1\n    }, {\n      value: \"\".concat(positiveCreditBalance ? '' : '+').concat(formatAmount(Math.abs(changePlanPreview.totalInCents))),\n      fontWeight: 3,\n      fontSize: 1,\n      textAlign: 'right'\n    }]);\n  }\n\n  return chargesSummary;\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/utils/mapChargeSummaryToTable.ts?");
 
 /***/ }),
 
@@ -9014,7 +9069,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PreviewProductMigrationContainer\": () => (/* binding */ PreviewProductMigrationContainer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var i18next__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! i18next */ \"./node_modules/.pnpm/i18next@21.9.1/node_modules/i18next/dist/esm/i18next.js\");\n/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! @xstate/react */ \"./node_modules/.pnpm/@xstate+react@3.0.1_csov6svwxizbqjpbal6caks7le/node_modules/@xstate/react/es/useSelector.js\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n/* harmony import */ var _components_PlanChangeSummaryCharges__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../components/PlanChangeSummaryCharges */ \"./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/index.ts\");\n/* harmony import */ var _machines_changePlan__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../machines/changePlan */ \"./packages/subscriptions-manager/src/machines/changePlan/index.ts\");\n/* harmony import */ var _components_PlanChangeSummary__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components/PlanChangeSummary */ \"./packages/subscriptions-manager/src/components/PlanChangeSummary/index.ts\");\n/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../components */ \"./packages/subscriptions-manager/src/components/index.ts\");\n\n\n\n\n\n\n\n\n\nvar PreviewProductMigrationContainer = function PreviewProductMigrationContainer(_ref) {\n  var changePlanService = _ref.changePlanService,\n      currency = _ref.currency;\n  var planPreview = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_8__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_5__.changePlanSelectors.getChangePlanPreview);\n  var productChangeStrategy = planPreview.productChangeStrategy,\n      product = planPreview.product,\n      existingBalanceInCents = planPreview.existingBalanceInCents,\n      billingEndDate = planPreview.billingEndDate,\n      totalInCents = planPreview.totalInCents;\n\n  var formatAmount = function formatAmount(amount) {\n    return (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_3__.formatCurrency)(currency, amount, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language);\n  };\n\n  var nextBillingAmountInCents = product.priceInCents - existingBalanceInCents;\n  var isProrated = productChangeStrategy === 'prorated';\n  var basePlanPrice = formatAmount(product.priceInCents);\n  var totalCharge = formatAmount(totalInCents > 0 ? totalInCents : 0);\n  var nextBillingDate = (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_3__.formatDate)(billingEndDate, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language);\n  var existingBalance = formatAmount(existingBalanceInCents);\n  var nextBillingAmount = formatAmount(nextBillingAmountInCents);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_PlanChangeSummary__WEBPACK_IMPORTED_MODULE_6__.PlanChangeSummary, {\n    isProrated: isProrated,\n    productName: product.name,\n    basePlanPrice: basePlanPrice,\n    billingEndDate: (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_3__.formatDate)(billingEndDate),\n    existingBalance: existingBalance,\n    nextBillingAmount: nextBillingAmount\n  }), isProrated ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_PlanChangeSummaryCharges__WEBPACK_IMPORTED_MODULE_4__[\"default\"], {\n    changePlanPreview: planPreview,\n    currency: currency\n  }) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginBottom: isProrated ? 0 : 8\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components__WEBPACK_IMPORTED_MODULE_7__.PlanChangeAlerts, {\n    productChangeStrategy: productChangeStrategy,\n    nextBillingDate: nextBillingDate,\n    basePlanPrice: basePlanPrice,\n    totalCharge: totalCharge\n  })));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/containers/PreviewProductMigrationContainer/PreviewProductMigrationContainer.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"PreviewProductMigrationContainer\": () => (/* binding */ PreviewProductMigrationContainer)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var i18next__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! i18next */ \"./node_modules/.pnpm/i18next@21.9.1/node_modules/i18next/dist/esm/i18next.js\");\n/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! @xstate/react */ \"./node_modules/.pnpm/@xstate+react@3.0.1_csov6svwxizbqjpbal6caks7le/node_modules/@xstate/react/es/useSelector.js\");\n/* harmony import */ var _chargify_formatters__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/formatters */ \"./packages/formatters/src/index.ts\");\n/* harmony import */ var _components_PlanChangeSummaryCharges__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../components/PlanChangeSummaryCharges */ \"./packages/subscriptions-manager/src/components/PlanChangeSummaryCharges/index.ts\");\n/* harmony import */ var _machines_changePlan__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../machines/changePlan */ \"./packages/subscriptions-manager/src/machines/changePlan/index.ts\");\n/* harmony import */ var _components_PlanChangeSummary__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../components/PlanChangeSummary */ \"./packages/subscriptions-manager/src/components/PlanChangeSummary/index.ts\");\n/* harmony import */ var _components__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../components */ \"./packages/subscriptions-manager/src/components/index.ts\");\n\n\n\n\n\n\n\n\nvar PreviewProductMigrationContainer = function PreviewProductMigrationContainer(_ref) {\n  var changePlanService = _ref.changePlanService,\n      currency = _ref.currency,\n      currentProductName = _ref.currentProductName;\n  var planPreview = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_7__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_4__.changePlanSelectors.getChangePlanPreview);\n  var productChangeStrategy = planPreview.productChangeStrategy,\n      product = planPreview.product,\n      existingBalanceInCents = planPreview.existingBalanceInCents,\n      billingEndDate = planPreview.billingEndDate,\n      totalInCents = planPreview.totalInCents,\n      proratedAdjustmentInCents = planPreview.proratedAdjustmentInCents;\n\n  var formatAmount = function formatAmount(amount) {\n    return (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_2__.formatCurrency)(currency, amount, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language);\n  };\n\n  var nextBillingAmountInCents = product.priceInCents - existingBalanceInCents;\n  var isNotDelayed = productChangeStrategy !== 'delayed';\n  var basePlanPrice = formatAmount(product.priceInCents);\n  var totalCharge = formatAmount(totalInCents > 0 ? totalInCents : 0);\n  var nextBillingDate = (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_2__.formatDate)(billingEndDate, i18next__WEBPACK_IMPORTED_MODULE_1__[\"default\"].language);\n  var existingBalance = formatAmount(existingBalanceInCents);\n  var nextBillingAmount = formatAmount(nextBillingAmountInCents);\n  var proratedCreditAmount = formatAmount(proratedAdjustmentInCents);\n  var creditBalance = formatAmount(totalInCents < 0 ? Math.abs(totalInCents) : 0);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_PlanChangeSummary__WEBPACK_IMPORTED_MODULE_5__.PlanChangeSummary, {\n    currentProductName: currentProductName,\n    productChangeStrategy: productChangeStrategy,\n    productName: product.name,\n    basePlanPrice: basePlanPrice,\n    billingEndDate: (0,_chargify_formatters__WEBPACK_IMPORTED_MODULE_2__.formatDate)(billingEndDate),\n    existingBalance: existingBalance,\n    nextBillingAmount: nextBillingAmount,\n    proratedCreditAmount: proratedCreditAmount\n  }), isNotDelayed ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_PlanChangeSummaryCharges__WEBPACK_IMPORTED_MODULE_3__[\"default\"], {\n    changePlanPreview: planPreview,\n    currency: currency\n  }) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components__WEBPACK_IMPORTED_MODULE_6__.PlanChangeAlerts, {\n    creditBalance: creditBalance,\n    productChangeStrategy: productChangeStrategy,\n    nextBillingDate: nextBillingDate,\n    basePlanPrice: basePlanPrice,\n    totalCharge: totalCharge\n  }));\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/containers/PreviewProductMigrationContainer/PreviewProductMigrationContainer.tsx?");
 
 /***/ }),
 
@@ -10532,7 +10587,7 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 /***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
 
 "use strict";
-eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @xstate/react */ \"./node_modules/.pnpm/@xstate+react@3.0.1_csov6svwxizbqjpbal6caks7le/node_modules/@xstate/react/es/useSelector.js\");\n/* harmony import */ var _chargify_toasts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/toasts */ \"./packages/toasts/src/index.ts\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../hooks */ \"./packages/subscriptions-manager/src/hooks/index.ts\");\n/* harmony import */ var _contexts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../contexts */ \"./packages/subscriptions-manager/src/contexts/index.ts\");\n/* harmony import */ var _machines__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../machines */ \"./packages/subscriptions-manager/src/machines/index.ts\");\n/* harmony import */ var _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../machines/changePlan */ \"./packages/subscriptions-manager/src/machines/changePlan/index.ts\");\n/* harmony import */ var _containers_ChangePlanContainer__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../containers/ChangePlanContainer */ \"./packages/subscriptions-manager/src/containers/ChangePlanContainer/index.ts\");\n/* harmony import */ var _containers_PreviewProductMigrationContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../containers/PreviewProductMigrationContainer */ \"./packages/subscriptions-manager/src/containers/PreviewProductMigrationContainer/index.ts\");\n/* harmony import */ var _components_ErrorAlert__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./components/ErrorAlert */ \"./packages/subscriptions-manager/src/modals/ChangeSubscriptionPlan/components/Content/components/ErrorAlert.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar Content = function Content(_ref) {\n  var onClose = _ref.onClose,\n      catalogId = _ref.catalogId,\n      subscriptionId = _ref.subscriptionId,\n      displayMode = _ref.displayMode,\n      onProcessingUpdate = _ref.onProcessingUpdate;\n  var toastService = (0,_chargify_toasts__WEBPACK_IMPORTED_MODULE_1__.useToastMessages)();\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_10__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var _useContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_contexts__WEBPACK_IMPORTED_MODULE_4__.GlobalStateContext),\n      subscriptionsService = _useContext.subscriptionsService;\n\n  var _useSelector = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(subscriptionsService, _machines__WEBPACK_IMPORTED_MODULE_5__.subscriptionsSelectors.getSubscriptionById(catalogId, subscriptionId)),\n      subscription = _useSelector.subscription;\n\n  var onPlanChangeSuccess = function onPlanChangeSuccess() {\n    onClose(true);\n    toastService.show({\n      level: 'success',\n      message: t('plan_change.success_plan_change')\n    });\n  };\n\n  var changePlanService = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useChangePlan)(catalogId, subscriptionId, subscription.product.id, onPlanChangeSuccess);\n  var currentPlanId = subscription.product.id;\n\n  var _useSelector2 = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__.changePlanSelectors.getChangePlanStatus),\n      configurePlanStep = _useSelector2.configurePlanStep,\n      previewPlanStep = _useSelector2.previewPlanStep,\n      configurePlanStepLoading = _useSelector2.configurePlanStepLoading,\n      updatePlanLoading = _useSelector2.updatePlanLoading,\n      previewPlanLoading = _useSelector2.previewPlanLoading,\n      isError = _useSelector2.isError;\n\n  var selectedPlan = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__.changePlanSelectors.getSelectedPlan);\n  (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n    changePlanService.send({\n      type: 'GET_PRODUCTS'\n    });\n  }, []);\n  (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n    onProcessingUpdate(updatePlanLoading);\n  }, [updatePlanLoading, onProcessingUpdate]);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card, {\n    border: displayMode === 'layer' ? 'sharp' : 'rounded'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Header, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Modal.Title, {\n    onClose: onClose,\n    title: t('plan_change.change_plan')\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Body, null, isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_ErrorAlert__WEBPACK_IMPORTED_MODULE_9__.ErrorAlert, null) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, configurePlanStepLoading ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.SkeletonLoader, {\n    height: 400\n  }) : null, configurePlanStep ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_ChangePlanContainer__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n    changePlanService: changePlanService,\n    currency: subscription.currency,\n    currentPlanId: currentPlanId\n  }) : null, previewPlanStep ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_PreviewProductMigrationContainer__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n    currency: subscription.currency,\n    changePlanService: changePlanService\n  }) : null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button.Group, {\n    alignment: \"right\"\n  }, previewPlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginRight: 'auto'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    color: 'secondary',\n    label: t('go_back', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'GO_BACK'\n      });\n    },\n    iconLeft: 'chevronLeft'\n  })) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    color: \"secondary\",\n    label: t('close', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return onClose(false);\n    }\n  }), configurePlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    isLoading: previewPlanLoading,\n    label: t('continue', {\n      ns: 'common'\n    }),\n    disabled: selectedPlan === currentPlanId,\n    loadingText: t('processing', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'GET_PREVIEW_PRODUCT_MIGRATION'\n      });\n    }\n  }) : null, previewPlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    label: t('confirm_changes', {\n      ns: 'common'\n    }),\n    isLoading: updatePlanLoading,\n    loadingText: t('processing', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'CONFIRM_CHANGE_PLAN'\n      });\n    }\n  }) : null)));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Content);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/modals/ChangeSubscriptionPlan/components/Content/Content.tsx?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_0___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_0__);\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! react-i18next */ \"./node_modules/.pnpm/react-i18next@11.18.6_4sidbwfhen5r7txudrvpua6nty/node_modules/react-i18next/dist/es/useTranslation.js\");\n/* harmony import */ var _xstate_react__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! @xstate/react */ \"./node_modules/.pnpm/@xstate+react@3.0.1_csov6svwxizbqjpbal6caks7le/node_modules/@xstate/react/es/useSelector.js\");\n/* harmony import */ var _chargify_toasts__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! @chargify/toasts */ \"./packages/toasts/src/index.ts\");\n/* harmony import */ var _chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/custom-ui-components */ \"./packages/custom-ui-components/src/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../../../../hooks */ \"./packages/subscriptions-manager/src/hooks/index.ts\");\n/* harmony import */ var _contexts__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../../../contexts */ \"./packages/subscriptions-manager/src/contexts/index.ts\");\n/* harmony import */ var _machines__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../../../machines */ \"./packages/subscriptions-manager/src/machines/index.ts\");\n/* harmony import */ var _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../../../machines/changePlan */ \"./packages/subscriptions-manager/src/machines/changePlan/index.ts\");\n/* harmony import */ var _containers_ChangePlanContainer__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ../../../../containers/ChangePlanContainer */ \"./packages/subscriptions-manager/src/containers/ChangePlanContainer/index.ts\");\n/* harmony import */ var _containers_PreviewProductMigrationContainer__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ../../../../containers/PreviewProductMigrationContainer */ \"./packages/subscriptions-manager/src/containers/PreviewProductMigrationContainer/index.ts\");\n/* harmony import */ var _components_ErrorAlert__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./components/ErrorAlert */ \"./packages/subscriptions-manager/src/modals/ChangeSubscriptionPlan/components/Content/components/ErrorAlert.tsx\");\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar Content = function Content(_ref) {\n  var onClose = _ref.onClose,\n      catalogId = _ref.catalogId,\n      subscriptionId = _ref.subscriptionId,\n      displayMode = _ref.displayMode,\n      onProcessingUpdate = _ref.onProcessingUpdate;\n  var toastService = (0,_chargify_toasts__WEBPACK_IMPORTED_MODULE_1__.useToastMessages)();\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_10__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var _useContext = (0,react__WEBPACK_IMPORTED_MODULE_0__.useContext)(_contexts__WEBPACK_IMPORTED_MODULE_4__.GlobalStateContext),\n      subscriptionsService = _useContext.subscriptionsService;\n\n  var _useSelector = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(subscriptionsService, _machines__WEBPACK_IMPORTED_MODULE_5__.subscriptionsSelectors.getSubscriptionById(catalogId, subscriptionId)),\n      subscription = _useSelector.subscription;\n\n  var onPlanChangeSuccess = function onPlanChangeSuccess() {\n    onClose(true);\n    toastService.show({\n      level: 'success',\n      message: t('plan_change.success_plan_change')\n    });\n  };\n\n  var changePlanService = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useChangePlan)(catalogId, subscriptionId, subscription.product.id, onPlanChangeSuccess);\n  var currentPlanId = subscription.product.id;\n\n  var _useSelector2 = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__.changePlanSelectors.getChangePlanStatus),\n      configurePlanStep = _useSelector2.configurePlanStep,\n      previewPlanStep = _useSelector2.previewPlanStep,\n      configurePlanStepLoading = _useSelector2.configurePlanStepLoading,\n      updatePlanLoading = _useSelector2.updatePlanLoading,\n      previewPlanLoading = _useSelector2.previewPlanLoading,\n      isError = _useSelector2.isError;\n\n  var selectedPlan = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_11__.useSelector)(changePlanService, _machines_changePlan__WEBPACK_IMPORTED_MODULE_6__.changePlanSelectors.getSelectedPlan);\n  (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n    changePlanService.send({\n      type: 'GET_PRODUCTS'\n    });\n  }, []);\n  (0,react__WEBPACK_IMPORTED_MODULE_0__.useEffect)(function () {\n    onProcessingUpdate(updatePlanLoading);\n  }, [updatePlanLoading, onProcessingUpdate]);\n  var modalTitle = configurePlanStep ? t('plan_change.change_plan') : t('plan_change.summary_title');\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card, {\n    border: displayMode === 'layer' ? 'sharp' : 'rounded'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Header, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Modal.Title, {\n    onClose: onClose,\n    title: modalTitle\n  })), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Body, null, isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_ErrorAlert__WEBPACK_IMPORTED_MODULE_9__.ErrorAlert, null) : /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement((react__WEBPACK_IMPORTED_MODULE_0___default().Fragment), null, configurePlanStepLoading ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.SkeletonLoader, {\n    height: 400\n  }) : null, configurePlanStep ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_ChangePlanContainer__WEBPACK_IMPORTED_MODULE_7__[\"default\"], {\n    changePlanService: changePlanService,\n    currency: subscription.currency,\n    currentPlanId: currentPlanId\n  }) : null, previewPlanStep ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_PreviewProductMigrationContainer__WEBPACK_IMPORTED_MODULE_8__[\"default\"], {\n    currentProductName: subscription.product.name,\n    currency: subscription.currency,\n    changePlanService: changePlanService\n  }) : null)), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Card.Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button.Group, {\n    alignment: \"right\"\n  }, previewPlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Box, {\n    marginRight: 'auto'\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    color: 'secondary',\n    label: t('go_back', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'GO_BACK'\n      });\n    },\n    iconLeft: 'chevronLeft'\n  })) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    color: \"secondary\",\n    label: t('close', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return onClose(false);\n    }\n  }), configurePlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    isLoading: previewPlanLoading,\n    label: t('continue', {\n      ns: 'common'\n    }),\n    disabled: selectedPlan === currentPlanId,\n    loadingText: t('processing', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'GET_PREVIEW_PRODUCT_MIGRATION'\n      });\n    }\n  }) : null, previewPlanStep && !isError ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_2__.Button, {\n    label: t('confirm_changes', {\n      ns: 'common'\n    }),\n    isLoading: updatePlanLoading,\n    loadingText: t('processing', {\n      ns: 'common'\n    }),\n    onClick: function onClick() {\n      return changePlanService.send({\n        type: 'CONFIRM_CHANGE_PLAN'\n      });\n    }\n  }) : null)));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Content);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/modals/ChangeSubscriptionPlan/components/Content/Content.tsx?");
 
 /***/ }),
 

package/package.json

@@ -5,7 +5,7 @@
   "module": "dist/maxio-components.esm.js",
   "browser": "dist/maxio-components.umd.js",
   "types": "typings/sdk/components-sdk/src/index.d.ts",
-  "version": "1.4.2",
+  "version": "1.5.0",
   "scripts": {
     "test": "jest",
     "test:coverage": "jest --coverage",

package/typings/packages/custom-ui-components/src/components/molecules/Alert/Alert.d.ts

@@ -9,12 +9,15 @@ export interface AlertProps {
     onClick?: () => void;
     buttonLabel?: string;
     icon?: IconType;
-    whiteSpace?: 'pre-line' | 'normal';
 }
 declare const Alert: {
-    ({ title, color, size, buttonLabel, icon, onClick, children, whiteSpace, }: AlertProps): JSX.Element;
+    ({ title, color, size, buttonLabel, icon, onClick, children, }: AlertProps): JSX.Element;
     TextMessage: ({ children, ...rest }: {
         children: React.ReactNode;
     } & import("../../atoms/BodyText/BodyText").BodyTextProps) => JSX.Element;
+    Title: ({ text, icon }: {
+        text: string;
+        icon?: "close" | "edit" | "plus" | "clock" | "search" | "chevronDown" | "chevronLeft" | "chevronRight" | "calendar" | "check" | "spinner" | "questionCircle" | "receipt" | "file" | "fileSolid" | "filter" | "arrowDown" | "filePlus" | "filePdf" | "circleInfo" | "circleCheck" | "exclamationTriangle" | "ellipsis" | "circleCross";
+    }) => JSX.Element;
 };
 export default Alert;