@maxio-com/self-service 1.3.1 → 1.4.0

package/dist/maxio-components.umd.js

@@ -8222,7 +8222,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 framer_motion__WEBPACK_IMPORTED_MODULE_13__ = __webpack_require__(/*! framer-motion */ \"./node_modules/.pnpm/framer-motion@7.3.5_biqbaboplfbrettd7655fr4n2y/node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs\");\n/* harmony import */ var framer_motion__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! framer-motion */ \"./node_modules/.pnpm/framer-motion@7.3.5_biqbaboplfbrettd7655fr4n2y/node_modules/framer-motion/dist/es/render/dom/motion.mjs\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_12__ = __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/* harmony import */ var _chargify_device_provider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/device-provider */ \"./packages/device-provider/src/index.ts\");\n/* harmony import */ var _SubscriptionDetails__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../SubscriptionDetails */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../hooks */ \"./packages/subscriptions-manager/src/hooks/index.ts\");\n/* harmony import */ var _containers_ComponentsContainer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../containers/ComponentsContainer */ \"./packages/subscriptions-manager/src/containers/ComponentsContainer/index.ts\");\n/* harmony import */ var _containers_BilingDetailsContainer_BilingDetailsContainer__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../containers/BilingDetailsContainer/BilingDetailsContainer */ \"./packages/subscriptions-manager/src/containers/BilingDetailsContainer/BilingDetailsContainer.tsx\");\n/* harmony import */ var _Subscription_styles__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Subscription.styles */ \"./packages/subscriptions-manager/src/components/Subscription/Subscription.styles.ts\");\n/* harmony import */ var _motion__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./motion */ \"./packages/subscriptions-manager/src/components/Subscription/motion.ts\");\n/* harmony import */ var _SubscriptionDetails_components_Notification__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../SubscriptionDetails/components/Notification */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Notification/index.tsx\");\n/* harmony import */ var _containers_CustomFieldsContainer__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../containers/CustomFieldsContainer */ \"./packages/subscriptions-manager/src/containers/CustomFieldsContainer/index.ts\");\n/* harmony import */ var _containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../containers/SubscriptionContainer/hooks/useSubscriptionAvailableActions */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/hooks/useSubscriptionAvailableActions.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\n\n\n\n\n\n\n\n\n\n\n\n\nvar Subscription = function Subscription(_ref) {\n  var id = _ref.id,\n      catalogId = _ref.catalogId,\n      name = _ref.name,\n      price = _ref.price,\n      statusTag = _ref.statusTag,\n      description = _ref.description,\n      status = _ref.status,\n      onShowDetails = _ref.onShowDetails,\n      detailsVisible = _ref.detailsVisible,\n      _ref$cardColor = _ref.cardColor,\n      cardColor = _ref$cardColor === void 0 ? 'white' : _ref$cardColor,\n      nextBillingAmount = _ref.nextBillingAmount,\n      nextBillingDate = _ref.nextBillingDate,\n      basePlanPrice = _ref.basePlanPrice,\n      cancellationDate = _ref.cancellationDate,\n      expirationDate = _ref.expirationDate,\n      _ref$layout = _ref.layout,\n      layout = _ref$layout === void 0 ? 'expandable-card' : _ref$layout,\n      autoResumeDate = _ref.autoResumeDate,\n      trialExpirationDate = _ref.trialExpirationDate,\n      priceAfterTrial = _ref.priceAfterTrial,\n      trialPrice = _ref.trialPrice,\n      currentBalance = _ref.currentBalance,\n      nextBillingAttempt = _ref.nextBillingAttempt,\n      interval = _ref.interval,\n      billingDetails = _ref.billingDetails,\n      renderComponentsSection = _ref.renderComponentsSection,\n      renderCustomFieldsSection = _ref.renderCustomFieldsSection,\n      scheduledCancellationDate = _ref.scheduledCancellationDate,\n      availableActions = _ref.availableActions;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_12__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var _useServices = (0,_hooks__WEBPACK_IMPORTED_MODULE_4__.useServices)(),\n      modalsService = _useServices.modalsService;\n\n  var _useDeviceInfo = (0,_chargify_device_provider__WEBPACK_IMPORTED_MODULE_2__.useDeviceInfo)(),\n      device = _useDeviceInfo.device;\n\n  var isOnMobileDevice = ['tablet', 'mobile'].includes(device);\n\n  var showPauseSubscriptionModal = function showPauseSubscriptionModal() {\n    modalsService.send({\n      type: 'SHOW_PAUSE_SUBSCRIPTION',\n      catalogId: catalogId,\n      subscriptionId: id\n    });\n  };\n\n  var showPlanChangeModal = function showPlanChangeModal() {\n    modalsService.send({\n      type: 'SHOW_SUBSCRIPTION_PLAN_CHANGE',\n      catalogId: catalogId,\n      subscriptionId: id\n    });\n  };\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.SubscriptionItem, {\n    marginBottom: 5,\n    \"data-testid\": \"subscription-\".concat(id)\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card, {\n    color: cardColor\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    onClick: onShowDetails,\n    style: {\n      cursor: layout === 'expandable-card' ? 'pointer' : 'auto'\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Header, {\n    enableBorder: detailsVisible\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.SubscriptionHeader, {\n    title: name,\n    price: price,\n    interval: interval,\n    tag: statusTag\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(framer_motion__WEBPACK_IMPORTED_MODULE_13__.AnimatePresence, {\n    initial: layout !== 'all-details'\n  }, detailsVisible && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(framer_motion__WEBPACK_IMPORTED_MODULE_14__.motion.div, _objectSpread(_objectSpread({}, _motion__WEBPACK_IMPORTED_MODULE_8__.bodyMotion), {}, {\n    style: {\n      overflow: 'hidden'\n    }\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Body, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 7]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: \"h4\"\n  }, t('subscription_details.plan_details', {\n    ns: 'subscriptions-manager'\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 17]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SubscriptionDetails_components_Notification__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n    status: status,\n    marginBottom: 5\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, null, description), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SubscriptionDetails__WEBPACK_IMPORTED_MODULE_3__.SubscriptionDetails, {\n    scheduledCancellationDate: scheduledCancellationDate,\n    subscriptionStatus: status,\n    nextBillingAmount: nextBillingAmount,\n    nextBillingDate: nextBillingDate,\n    basePlanPrice: basePlanPrice,\n    cancellationDate: cancellationDate,\n    expirationDate: expirationDate,\n    trialExpirationDate: trialExpirationDate,\n    priceAfterTrial: priceAfterTrial,\n    trialPrice: trialPrice,\n    nextBillingAttempt: nextBillingAttempt,\n    currentBalance: currentBalance,\n    autoResumeDate: autoResumeDate\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button.Group, null, availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.CHANGE_PLAN) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"primary\",\n    size: \"medium\",\n    label: t('plan_change.configure_plan'),\n    onClick: showPlanChangeModal\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.PAUSE) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    size: \"medium\",\n    label: t('pause_subscription.put_on_hold'),\n    onClick: showPauseSubscriptionModal\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.RESUME) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    label: t('resume_subscription.resume'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_RESUME_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.CANCEL) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    label: t('cancel_subscription.cancel'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_CANCEL_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.UNDO_CANCELATION) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    label: t('cancel_subscription.undo_cancelation_button'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_UNDO_CANCELATION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.REACTIVATE) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"primary\",\n    label: t('reactivate_subscription.reactivate'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_REACTIVATE_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }))))), renderComponentsSection && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_ComponentsContainer__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n    catalogId: catalogId,\n    subscriptionId: id\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.RowWrapper, {\n    marginTop: 5,\n    paddingTop: 5\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 7]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: \"h4\"\n  }, t('subscription_details.billing_info', {\n    ns: 'subscriptions-manager'\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 17]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_BilingDetailsContainer_BilingDetailsContainer__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n    subscriptionId: id,\n    catalogId: catalogId,\n    billingDetails: billingDetails\n  })))), renderCustomFieldsSection && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.RowWrapper, {\n    marginTop: 5,\n    paddingTop: 5\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_CustomFieldsContainer__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    subscriptionId: id,\n    catalogId: catalogId\n  }))))), layout === 'expandable-card' && detailsVisible && isOnMobileDevice && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.FooterContentWrapper, null, detailsVisible && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.ToggleWrapper, {\n    marginTop: 3,\n    onClick: onShowDetails\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Anchor, {\n    label: t('less', {\n      ns: 'common'\n    })\n  }))))));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Subscription);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/Subscription/Subscription.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 framer_motion__WEBPACK_IMPORTED_MODULE_14__ = __webpack_require__(/*! framer-motion */ \"./node_modules/.pnpm/framer-motion@7.3.5_biqbaboplfbrettd7655fr4n2y/node_modules/framer-motion/dist/es/components/AnimatePresence/index.mjs\");\n/* harmony import */ var framer_motion__WEBPACK_IMPORTED_MODULE_15__ = __webpack_require__(/*! framer-motion */ \"./node_modules/.pnpm/framer-motion@7.3.5_biqbaboplfbrettd7655fr4n2y/node_modules/framer-motion/dist/es/render/dom/motion.mjs\");\n/* harmony import */ var react_i18next__WEBPACK_IMPORTED_MODULE_13__ = __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/* harmony import */ var _chargify_device_provider__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! @chargify/device-provider */ \"./packages/device-provider/src/index.ts\");\n/* harmony import */ var _SubscriptionDetails__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ../SubscriptionDetails */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/index.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ../../hooks */ \"./packages/subscriptions-manager/src/hooks/index.ts\");\n/* harmony import */ var _containers_ComponentsContainer__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ../../containers/ComponentsContainer */ \"./packages/subscriptions-manager/src/containers/ComponentsContainer/index.ts\");\n/* harmony import */ var _containers_BilingDetailsContainer_BilingDetailsContainer__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ../../containers/BilingDetailsContainer/BilingDetailsContainer */ \"./packages/subscriptions-manager/src/containers/BilingDetailsContainer/BilingDetailsContainer.tsx\");\n/* harmony import */ var _Subscription_styles__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Subscription.styles */ \"./packages/subscriptions-manager/src/components/Subscription/Subscription.styles.ts\");\n/* harmony import */ var _motion__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./motion */ \"./packages/subscriptions-manager/src/components/Subscription/motion.ts\");\n/* harmony import */ var _SubscriptionDetails_components_Notification__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ../SubscriptionDetails/components/Notification */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Notification/index.tsx\");\n/* harmony import */ var _containers_CustomFieldsContainer__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ../../containers/CustomFieldsContainer */ \"./packages/subscriptions-manager/src/containers/CustomFieldsContainer/index.ts\");\n/* harmony import */ var _containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__ = __webpack_require__(/*! ../../containers/SubscriptionContainer/hooks/useSubscriptionAvailableActions */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/hooks/useSubscriptionAvailableActions.ts\");\n/* harmony import */ var _SubscriptionReferalCode__WEBPACK_IMPORTED_MODULE_12__ = __webpack_require__(/*! ../SubscriptionReferalCode */ \"./packages/subscriptions-manager/src/components/SubscriptionReferalCode/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\n\n\n\n\n\n\n\n\n\n\n\n\n\nvar Subscription = function Subscription(_ref) {\n  var id = _ref.id,\n      catalogId = _ref.catalogId,\n      name = _ref.name,\n      price = _ref.price,\n      statusTag = _ref.statusTag,\n      description = _ref.description,\n      status = _ref.status,\n      onShowDetails = _ref.onShowDetails,\n      detailsVisible = _ref.detailsVisible,\n      _ref$cardColor = _ref.cardColor,\n      cardColor = _ref$cardColor === void 0 ? 'white' : _ref$cardColor,\n      nextBillingAmount = _ref.nextBillingAmount,\n      nextBillingDate = _ref.nextBillingDate,\n      basePlanPrice = _ref.basePlanPrice,\n      cancellationDate = _ref.cancellationDate,\n      expirationDate = _ref.expirationDate,\n      _ref$layout = _ref.layout,\n      layout = _ref$layout === void 0 ? 'expandable-card' : _ref$layout,\n      autoResumeDate = _ref.autoResumeDate,\n      trialExpirationDate = _ref.trialExpirationDate,\n      priceAfterTrial = _ref.priceAfterTrial,\n      trialPrice = _ref.trialPrice,\n      currentBalance = _ref.currentBalance,\n      nextBillingAttempt = _ref.nextBillingAttempt,\n      interval = _ref.interval,\n      billingDetails = _ref.billingDetails,\n      renderComponentsSection = _ref.renderComponentsSection,\n      renderCustomFieldsSection = _ref.renderCustomFieldsSection,\n      scheduledCancellationDate = _ref.scheduledCancellationDate,\n      availableActions = _ref.availableActions,\n      referralCode = _ref.referralCode;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_13__.useTranslation)(['subscriptions-manager']),\n      t = _useTranslation.t;\n\n  var _useServices = (0,_hooks__WEBPACK_IMPORTED_MODULE_4__.useServices)(),\n      modalsService = _useServices.modalsService;\n\n  var _useDeviceInfo = (0,_chargify_device_provider__WEBPACK_IMPORTED_MODULE_2__.useDeviceInfo)(),\n      device = _useDeviceInfo.device;\n\n  var isOnMobileDevice = ['tablet', 'mobile'].includes(device);\n\n  var showPauseSubscriptionModal = function showPauseSubscriptionModal() {\n    modalsService.send({\n      type: 'SHOW_PAUSE_SUBSCRIPTION',\n      catalogId: catalogId,\n      subscriptionId: id\n    });\n  };\n\n  var showPlanChangeModal = function showPlanChangeModal() {\n    modalsService.send({\n      type: 'SHOW_SUBSCRIPTION_PLAN_CHANGE',\n      catalogId: catalogId,\n      subscriptionId: id\n    });\n  };\n\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.SubscriptionItem, {\n    marginBottom: 5,\n    \"data-testid\": \"subscription-\".concat(id)\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card, {\n    color: cardColor\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", {\n    onClick: onShowDetails,\n    style: {\n      cursor: layout === 'expandable-card' ? 'pointer' : 'auto'\n    }\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Header, {\n    enableBorder: detailsVisible\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.SubscriptionHeader, {\n    title: name,\n    price: price,\n    interval: interval,\n    tag: statusTag\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(framer_motion__WEBPACK_IMPORTED_MODULE_14__.AnimatePresence, {\n    initial: layout !== 'all-details'\n  }, detailsVisible && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(framer_motion__WEBPACK_IMPORTED_MODULE_15__.motion.div, _objectSpread(_objectSpread({}, _motion__WEBPACK_IMPORTED_MODULE_8__.bodyMotion), {}, {\n    style: {\n      overflow: 'hidden'\n    }\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Body, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 7]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: \"h4\"\n  }, t('subscription_details.plan_details', {\n    ns: 'subscriptions-manager'\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 17]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SubscriptionDetails_components_Notification__WEBPACK_IMPORTED_MODULE_9__[\"default\"], {\n    status: status,\n    marginBottom: 5\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.BodyText, null, description), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SubscriptionDetails__WEBPACK_IMPORTED_MODULE_3__.SubscriptionDetails, {\n    scheduledCancellationDate: scheduledCancellationDate,\n    subscriptionStatus: status,\n    nextBillingAmount: nextBillingAmount,\n    nextBillingDate: nextBillingDate,\n    basePlanPrice: basePlanPrice,\n    cancellationDate: cancellationDate,\n    expirationDate: expirationDate,\n    trialExpirationDate: trialExpirationDate,\n    priceAfterTrial: priceAfterTrial,\n    trialPrice: trialPrice,\n    nextBillingAttempt: nextBillingAttempt,\n    currentBalance: currentBalance,\n    autoResumeDate: autoResumeDate\n  }), referralCode ? /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_SubscriptionReferalCode__WEBPACK_IMPORTED_MODULE_12__[\"default\"], {\n    label: t('subscription_details.referral_code'),\n    referalCode: referralCode\n  }) : null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button.Group, null, availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.CHANGE_PLAN) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"primary\",\n    size: \"medium\",\n    label: t('plan_change.configure_plan'),\n    onClick: showPlanChangeModal\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.PAUSE) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    size: \"medium\",\n    label: t('pause_subscription.put_on_hold'),\n    onClick: showPauseSubscriptionModal\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.RESUME) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    label: t('resume_subscription.resume'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_RESUME_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.CANCEL) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    label: t('cancel_subscription.cancel'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_CANCEL_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.UNDO_CANCELATION) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"secondary\",\n    label: t('cancel_subscription.undo_cancelation_button'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_UNDO_CANCELATION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }), availableActions.includes(_containers_SubscriptionContainer_hooks_useSubscriptionAvailableActions__WEBPACK_IMPORTED_MODULE_11__.SubscriptionActions.REACTIVATE) && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Button, {\n    color: \"primary\",\n    label: t('reactivate_subscription.reactivate'),\n    onClick: function onClick() {\n      modalsService.send({\n        type: 'SHOW_REACTIVATE_SUBSCRIPTION',\n        subscriptionId: id,\n        catalogId: catalogId\n      });\n    }\n  }))))), renderComponentsSection && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_ComponentsContainer__WEBPACK_IMPORTED_MODULE_5__[\"default\"], {\n    catalogId: catalogId,\n    subscriptionId: id\n  }), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.RowWrapper, {\n    marginTop: 5,\n    paddingTop: 5\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Row, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 7]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Heading, {\n    variant: \"h4\"\n  }, t('subscription_details.billing_info', {\n    ns: 'subscriptions-manager'\n  }))), /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Column, {\n    span: [24, 17]\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_BilingDetailsContainer_BilingDetailsContainer__WEBPACK_IMPORTED_MODULE_6__[\"default\"], {\n    subscriptionId: id,\n    catalogId: catalogId,\n    billingDetails: billingDetails\n  })))), renderCustomFieldsSection && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.RowWrapper, {\n    marginTop: 5,\n    paddingTop: 5\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_containers_CustomFieldsContainer__WEBPACK_IMPORTED_MODULE_10__[\"default\"], {\n    subscriptionId: id,\n    catalogId: catalogId\n  }))))), layout === 'expandable-card' && detailsVisible && isOnMobileDevice && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Card.Footer, null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.FooterContentWrapper, null, detailsVisible && /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_Subscription_styles__WEBPACK_IMPORTED_MODULE_7__.ToggleWrapper, {\n    marginTop: 3,\n    onClick: onShowDetails\n  }, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_chargify_custom_ui_components__WEBPACK_IMPORTED_MODULE_1__.Anchor, {\n    label: t('less', {\n      ns: 'common'\n    })\n  }))))));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (Subscription);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/Subscription/Subscription.tsx?");
 
 /***/ }),
 
@@ -8596,7 +8596,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 */   \"Active\": () => (/* reexport safe */ _Active__WEBPACK_IMPORTED_MODULE_0__.Active),\n/* harmony export */   \"Canceled\": () => (/* reexport safe */ _Canceled__WEBPACK_IMPORTED_MODULE_2__.Canceled),\n/* harmony export */   \"CancellationScheduled\": () => (/* reexport safe */ _CancellationScheduled__WEBPACK_IMPORTED_MODULE_1__.CancellationScheduled),\n/* harmony export */   \"Expired\": () => (/* reexport safe */ _Expired__WEBPACK_IMPORTED_MODULE_4__.Expired),\n/* harmony export */   \"OnHold\": () => (/* reexport safe */ _OnHold__WEBPACK_IMPORTED_MODULE_6__.OnHold),\n/* harmony export */   \"PastDue\": () => (/* reexport safe */ _PastDue__WEBPACK_IMPORTED_MODULE_5__.PastDue),\n/* harmony export */   \"PlanChangeScheduled\": () => (/* reexport safe */ _PlanChangeScheduled__WEBPACK_IMPORTED_MODULE_10__.PlanChangeScheduled),\n/* harmony export */   \"Trial\": () => (/* reexport safe */ _Trial__WEBPACK_IMPORTED_MODULE_7__.Trial),\n/* harmony export */   \"TrialExpired\": () => (/* reexport safe */ _TrialExpired__WEBPACK_IMPORTED_MODULE_8__.TrialExpired),\n/* harmony export */   \"Unpaid\": () => (/* reexport safe */ _Unpaid__WEBPACK_IMPORTED_MODULE_9__.Unpaid)\n/* harmony export */ });\n/* harmony import */ var _Active__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Active */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Active/index.ts\");\n/* harmony import */ var _CancellationScheduled__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CancellationScheduled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/CancellationScheduled/index.ts\");\n/* harmony import */ var _Canceled__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Canceled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Canceled/index.ts\");\n/* harmony import */ var _DetailRow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./DetailRow */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/DetailRow/index.ts\");\n/* harmony import */ var _Expired__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Expired */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Expired/index.ts\");\n/* harmony import */ var _PastDue__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./PastDue */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/PastDue/index.ts\");\n/* harmony import */ var _OnHold__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./OnHold */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/OnHold/index.ts\");\n/* harmony import */ var _Trial__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Trial */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Trial/index.ts\");\n/* harmony import */ var _TrialExpired__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./TrialExpired */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/TrialExpired/index.ts\");\n/* harmony import */ var _Unpaid__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Unpaid */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Unpaid/index.ts\");\n/* harmony import */ var _PlanChangeScheduled__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./PlanChangeScheduled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/PlanChangeScheduled/index.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/SubscriptionDetails/components/index.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"Active\": () => (/* reexport safe */ _Active__WEBPACK_IMPORTED_MODULE_0__.Active),\n/* harmony export */   \"Canceled\": () => (/* reexport safe */ _Canceled__WEBPACK_IMPORTED_MODULE_2__.Canceled),\n/* harmony export */   \"CancellationScheduled\": () => (/* reexport safe */ _CancellationScheduled__WEBPACK_IMPORTED_MODULE_1__.CancellationScheduled),\n/* harmony export */   \"DetailRow\": () => (/* reexport safe */ _DetailRow__WEBPACK_IMPORTED_MODULE_3__.DetailRow),\n/* harmony export */   \"Expired\": () => (/* reexport safe */ _Expired__WEBPACK_IMPORTED_MODULE_4__.Expired),\n/* harmony export */   \"OnHold\": () => (/* reexport safe */ _OnHold__WEBPACK_IMPORTED_MODULE_6__.OnHold),\n/* harmony export */   \"PastDue\": () => (/* reexport safe */ _PastDue__WEBPACK_IMPORTED_MODULE_5__.PastDue),\n/* harmony export */   \"PlanChangeScheduled\": () => (/* reexport safe */ _PlanChangeScheduled__WEBPACK_IMPORTED_MODULE_10__.PlanChangeScheduled),\n/* harmony export */   \"Trial\": () => (/* reexport safe */ _Trial__WEBPACK_IMPORTED_MODULE_7__.Trial),\n/* harmony export */   \"TrialExpired\": () => (/* reexport safe */ _TrialExpired__WEBPACK_IMPORTED_MODULE_8__.TrialExpired),\n/* harmony export */   \"Unpaid\": () => (/* reexport safe */ _Unpaid__WEBPACK_IMPORTED_MODULE_9__.Unpaid)\n/* harmony export */ });\n/* harmony import */ var _Active__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./Active */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Active/index.ts\");\n/* harmony import */ var _CancellationScheduled__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ./CancellationScheduled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/CancellationScheduled/index.ts\");\n/* harmony import */ var _Canceled__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ./Canceled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Canceled/index.ts\");\n/* harmony import */ var _DetailRow__WEBPACK_IMPORTED_MODULE_3__ = __webpack_require__(/*! ./DetailRow */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/DetailRow/index.ts\");\n/* harmony import */ var _Expired__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./Expired */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Expired/index.ts\");\n/* harmony import */ var _PastDue__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./PastDue */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/PastDue/index.ts\");\n/* harmony import */ var _OnHold__WEBPACK_IMPORTED_MODULE_6__ = __webpack_require__(/*! ./OnHold */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/OnHold/index.ts\");\n/* harmony import */ var _Trial__WEBPACK_IMPORTED_MODULE_7__ = __webpack_require__(/*! ./Trial */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Trial/index.ts\");\n/* harmony import */ var _TrialExpired__WEBPACK_IMPORTED_MODULE_8__ = __webpack_require__(/*! ./TrialExpired */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/TrialExpired/index.ts\");\n/* harmony import */ var _Unpaid__WEBPACK_IMPORTED_MODULE_9__ = __webpack_require__(/*! ./Unpaid */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/Unpaid/index.ts\");\n/* harmony import */ var _PlanChangeScheduled__WEBPACK_IMPORTED_MODULE_10__ = __webpack_require__(/*! ./PlanChangeScheduled */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/PlanChangeScheduled/index.ts\");\n\n\n\n\n\n\n\n\n\n\n\n\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/SubscriptionDetails/components/index.ts?");
 
 /***/ }),
 
@@ -8633,6 +8633,28 @@ eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harm
 
 /***/ }),
 
+/***/ "./packages/subscriptions-manager/src/components/SubscriptionReferalCode/SubscriptionReferalCode.tsx":
+/*!***********************************************************************************************************!*\
+  !*** ./packages/subscriptions-manager/src/components/SubscriptionReferalCode/SubscriptionReferalCode.tsx ***!
+  \***********************************************************************************************************/
+/***/ ((__unused_webpack_module, __webpack_exports__, __webpack_require__) => {
+
+"use strict";
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"SubscriptionReferalCode\": () => (/* binding */ SubscriptionReferalCode)\n/* harmony export */ });\n/* harmony import */ var _SubscriptionDetails_components_index__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ../SubscriptionDetails/components/index */ \"./packages/subscriptions-manager/src/components/SubscriptionDetails/components/index.ts\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! react */ \"./node_modules/.pnpm/react@18.2.0/node_modules/react/index.js\");\n/* harmony import */ var react__WEBPACK_IMPORTED_MODULE_1___default = /*#__PURE__*/__webpack_require__.n(react__WEBPACK_IMPORTED_MODULE_1__);\n\n\nvar SubscriptionReferalCode = function SubscriptionReferalCode(_ref) {\n  var label = _ref.label,\n      referalCode = _ref.referalCode;\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_1___default().createElement(_SubscriptionDetails_components_index__WEBPACK_IMPORTED_MODULE_0__.DetailRow, {\n    label: {\n      value: label\n    },\n    value: {\n      value: referalCode,\n      color: 'black.main',\n      fontWeight: 0\n    }\n  });\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/SubscriptionReferalCode/SubscriptionReferalCode.tsx?");
+
+/***/ }),
+
+/***/ "./packages/subscriptions-manager/src/components/SubscriptionReferalCode/index.ts":
+/*!****************************************************************************************!*\
+  !*** ./packages/subscriptions-manager/src/components/SubscriptionReferalCode/index.ts ***!
+  \****************************************************************************************/
+/***/ ((__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 _SubscriptionReferalCode__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! ./SubscriptionReferalCode */ \"./packages/subscriptions-manager/src/components/SubscriptionReferalCode/SubscriptionReferalCode.tsx\");\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (_SubscriptionReferalCode__WEBPACK_IMPORTED_MODULE_0__.SubscriptionReferalCode);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/components/SubscriptionReferalCode/index.ts?");
+
+/***/ }),
+
 /***/ "./packages/subscriptions-manager/src/components/Summary/Summary.styles.ts":
 /*!*********************************************************************************!*\
   !*** ./packages/subscriptions-manager/src/components/Summary/Summary.styles.ts ***!
@@ -9036,7 +9058,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 _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 react_i18next__WEBPACK_IMPORTED_MODULE_6__ = __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 _components_Subscription__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../components/Subscription */ \"./packages/subscriptions-manager/src/components/Subscription/index.ts\");\n/* harmony import */ var _machines__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../machines */ \"./packages/subscriptions-manager/src/machines/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 _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./constants */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/constants.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./hooks */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/hooks/index.ts\");\nvar _excluded = [\"status\", \"product\", \"productFamilyId\", \"billing\", \"components\", \"customFields\"];\n\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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n\n\n\n\n\n\n\n\n\nvar SubscriptionContainer = function SubscriptionContainer(_ref) {\n  var id = _ref.id,\n      _onShowDetails = _ref.onShowDetails,\n      subscriptionRef = _ref.subscriptionRef,\n      _ref$layout = _ref.layout,\n      layout = _ref$layout === void 0 ? 'expandable-card' : _ref$layout,\n      detailsVisible = _ref.detailsVisible;\n\n  var _useComponentSettings = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useComponentSettings)(),\n      customerSelfService = _useComponentSettings.componentsAllocation.customerSelfService;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_6__.useTranslation)(['common']),\n      t = _useTranslation.t,\n      i18n = _useTranslation.i18n;\n\n  var _useSelector = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_7__.useSelector)(subscriptionRef, _machines__WEBPACK_IMPORTED_MODULE_2__.subscriptionSelectors.getSubscriptionDetails),\n      status = _useSelector.status,\n      product = _useSelector.product,\n      productFamilyId = _useSelector.productFamilyId,\n      billing = _useSelector.billing,\n      components = _useSelector.components,\n      customFields = _useSelector.customFields,\n      subscriptionDetails = _objectWithoutProperties(_useSelector, _excluded);\n\n  var subscriptionTag = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useSubscriptionStatus)(status);\n  var getCardColor = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (state) {\n    return _constants__WEBPACK_IMPORTED_MODULE_4__.INACTIVE_STATE.includes(state) ? 'gray' : 'white';\n  }, []);\n  var formattedSubscriptionDetails = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useFormatSubscriptionDetails)(_objectSpread(_objectSpread({\n    product: product,\n    status: status\n  }, subscriptionDetails), {}, {\n    locale: i18n.language,\n    t: t\n  }));\n  var totalPrice = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {\n    var formattedPrice = formattedSubscriptionDetails.totalPrice;\n\n    if (formattedPrice && !['trial', 'cancelled'].includes(status)) {\n      return {\n        label: formattedPrice,\n        color: _constants__WEBPACK_IMPORTED_MODULE_4__.PAYMENT_ISSUES.includes(status) ? 'danger.dark' : 'success.main'\n      };\n    }\n\n    return null;\n  }, [formattedSubscriptionDetails.totalPrice, status]);\n  var renderComponentsSection = components.updatesAllowed && customerSelfService || components.usedInBilling;\n\n  var _useComponentSettings2 = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useComponentSettings)(),\n      subscription = _useComponentSettings2.subscription;\n\n  var availableActions = (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useSubscriptionAvailableActions)({\n    status: status\n  }, subscription.scopes);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_Subscription__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _objectSpread({\n    id: id,\n    name: product.name,\n    catalogId: productFamilyId,\n    description: product.description,\n    statusTag: subscriptionTag,\n    status: status,\n    layout: layout,\n    price: totalPrice,\n    detailsVisible: detailsVisible,\n    onShowDetails: function onShowDetails() {\n      return _onShowDetails && _onShowDetails(id);\n    },\n    cardColor: getCardColor(status),\n    billingDetails: billing,\n    renderComponentsSection: renderComponentsSection,\n    renderCustomFieldsSection: customFields === null || customFields === void 0 ? void 0 : customFields.visible,\n    availableActions: availableActions\n  }, formattedSubscriptionDetails)));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SubscriptionContainer);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/containers/SubscriptionContainer/SubscriptionContainer.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 _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 react_i18next__WEBPACK_IMPORTED_MODULE_6__ = __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 _components_Subscription__WEBPACK_IMPORTED_MODULE_1__ = __webpack_require__(/*! ../../components/Subscription */ \"./packages/subscriptions-manager/src/components/Subscription/index.ts\");\n/* harmony import */ var _machines__WEBPACK_IMPORTED_MODULE_2__ = __webpack_require__(/*! ../../machines */ \"./packages/subscriptions-manager/src/machines/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 _constants__WEBPACK_IMPORTED_MODULE_4__ = __webpack_require__(/*! ./constants */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/constants.ts\");\n/* harmony import */ var _hooks__WEBPACK_IMPORTED_MODULE_5__ = __webpack_require__(/*! ./hooks */ \"./packages/subscriptions-manager/src/containers/SubscriptionContainer/hooks/index.ts\");\nvar _excluded = [\"status\", \"product\", \"productFamilyId\", \"billing\", \"components\", \"customFields\", \"referralCode\"];\n\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 _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }\n\nfunction _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }\n\n\n\n\n\n\n\n\n\n\nvar SubscriptionContainer = function SubscriptionContainer(_ref) {\n  var id = _ref.id,\n      _onShowDetails = _ref.onShowDetails,\n      subscriptionRef = _ref.subscriptionRef,\n      _ref$layout = _ref.layout,\n      layout = _ref$layout === void 0 ? 'expandable-card' : _ref$layout,\n      detailsVisible = _ref.detailsVisible;\n\n  var _useComponentSettings = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useComponentSettings)(),\n      customerSelfService = _useComponentSettings.componentsAllocation.customerSelfService;\n\n  var _useTranslation = (0,react_i18next__WEBPACK_IMPORTED_MODULE_6__.useTranslation)(['common']),\n      t = _useTranslation.t,\n      i18n = _useTranslation.i18n;\n\n  var _useSelector = (0,_xstate_react__WEBPACK_IMPORTED_MODULE_7__.useSelector)(subscriptionRef, _machines__WEBPACK_IMPORTED_MODULE_2__.subscriptionSelectors.getSubscriptionDetails),\n      status = _useSelector.status,\n      product = _useSelector.product,\n      productFamilyId = _useSelector.productFamilyId,\n      billing = _useSelector.billing,\n      components = _useSelector.components,\n      customFields = _useSelector.customFields,\n      referralCode = _useSelector.referralCode,\n      subscriptionDetails = _objectWithoutProperties(_useSelector, _excluded);\n\n  var subscriptionTag = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useSubscriptionStatus)(status);\n  var getCardColor = (0,react__WEBPACK_IMPORTED_MODULE_0__.useCallback)(function (state) {\n    return _constants__WEBPACK_IMPORTED_MODULE_4__.INACTIVE_STATE.includes(state) ? 'gray' : 'white';\n  }, []);\n  var formattedSubscriptionDetails = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useFormatSubscriptionDetails)(_objectSpread(_objectSpread({\n    product: product,\n    status: status\n  }, subscriptionDetails), {}, {\n    locale: i18n.language,\n    t: t\n  }));\n  var totalPrice = (0,react__WEBPACK_IMPORTED_MODULE_0__.useMemo)(function () {\n    var formattedPrice = formattedSubscriptionDetails.totalPrice;\n\n    if (formattedPrice && !['trial', 'cancelled'].includes(status)) {\n      return {\n        label: formattedPrice,\n        color: _constants__WEBPACK_IMPORTED_MODULE_4__.PAYMENT_ISSUES.includes(status) ? 'danger.dark' : 'success.main'\n      };\n    }\n\n    return null;\n  }, [formattedSubscriptionDetails.totalPrice, status]);\n  var renderComponentsSection = components.updatesAllowed && customerSelfService || components.usedInBilling;\n\n  var _useComponentSettings2 = (0,_hooks__WEBPACK_IMPORTED_MODULE_3__.useComponentSettings)(),\n      subscription = _useComponentSettings2.subscription;\n\n  var availableActions = (0,_hooks__WEBPACK_IMPORTED_MODULE_5__.useSubscriptionAvailableActions)({\n    status: status\n  }, subscription.scopes);\n  return /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(\"div\", null, /*#__PURE__*/react__WEBPACK_IMPORTED_MODULE_0___default().createElement(_components_Subscription__WEBPACK_IMPORTED_MODULE_1__[\"default\"], _objectSpread({\n    id: id,\n    name: product.name,\n    catalogId: productFamilyId,\n    description: product.description,\n    statusTag: subscriptionTag,\n    status: status,\n    layout: layout,\n    price: totalPrice,\n    detailsVisible: detailsVisible,\n    onShowDetails: function onShowDetails() {\n      return _onShowDetails && _onShowDetails(id);\n    },\n    cardColor: getCardColor(status),\n    billingDetails: billing,\n    renderComponentsSection: renderComponentsSection,\n    renderCustomFieldsSection: customFields === null || customFields === void 0 ? void 0 : customFields.visible,\n    availableActions: availableActions,\n    referralCode: referralCode\n  }, formattedSubscriptionDetails)));\n};\n\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (SubscriptionContainer);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/containers/SubscriptionContainer/SubscriptionContainer.tsx?");
 
 /***/ }),
 
@@ -10147,7 +10169,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 */   \"subscriptionSelectors\": () => (/* binding */ subscriptionSelectors)\n/* harmony export */ });\n/* unused harmony exports getSubscriptionState, getSubscriptionDetails */\nvar getSubscriptionState = function getSubscriptionState(machineState) {\n  return machineState.context.status;\n};\nvar getSubscriptionDetails = function getSubscriptionDetails(machineState) {\n  var _machineState$context = machineState.context,\n      id = _machineState$context.id,\n      status = _machineState$context.status,\n      currency = _machineState$context.currency,\n      productFamilyId = _machineState$context.productFamilyId,\n      currentBillingAmountInCents = _machineState$context.currentBillingAmountInCents,\n      currentPeriodEndsAt = _machineState$context.currentPeriodEndsAt,\n      scheduledCancellationAt = _machineState$context.scheduledCancellationAt,\n      nextAssessmentAt = _machineState$context.nextAssessmentAt,\n      canceledAt = _machineState$context.canceledAt,\n      expiresAt = _machineState$context.expiresAt,\n      trialEndedAt = _machineState$context.trialEndedAt,\n      balanceInCents = _machineState$context.balanceInCents,\n      automaticallyResumeAt = _machineState$context.automaticallyResumeAt,\n      product = _machineState$context.product,\n      billing = _machineState$context.billing,\n      components = _machineState$context.components,\n      customFields = _machineState$context.customFields;\n  return {\n    id: id,\n    status: status,\n    productFamilyId: productFamilyId,\n    currency: currency,\n    currentBillingAmountInCents: currentBillingAmountInCents,\n    currentPeriodEndsAt: currentPeriodEndsAt,\n    scheduledCancellationAt: scheduledCancellationAt,\n    nextAssessmentAt: nextAssessmentAt,\n    canceledAt: canceledAt,\n    expiresAt: expiresAt,\n    trialEndedAt: trialEndedAt,\n    balanceInCents: balanceInCents,\n    automaticallyResumeAt: automaticallyResumeAt,\n    product: product,\n    billing: billing,\n    components: components,\n    customFields: customFields\n  };\n};\nvar subscriptionSelectors = {\n  getSubscriptionState: getSubscriptionState,\n  getSubscriptionDetails: getSubscriptionDetails\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/machines/subscription/selectors.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"subscriptionSelectors\": () => (/* binding */ subscriptionSelectors)\n/* harmony export */ });\n/* unused harmony exports getSubscriptionState, getSubscriptionDetails */\nvar getSubscriptionState = function getSubscriptionState(machineState) {\n  return machineState.context.status;\n};\nvar getSubscriptionDetails = function getSubscriptionDetails(machineState) {\n  var _machineState$context = machineState.context,\n      id = _machineState$context.id,\n      status = _machineState$context.status,\n      currency = _machineState$context.currency,\n      productFamilyId = _machineState$context.productFamilyId,\n      currentBillingAmountInCents = _machineState$context.currentBillingAmountInCents,\n      currentPeriodEndsAt = _machineState$context.currentPeriodEndsAt,\n      scheduledCancellationAt = _machineState$context.scheduledCancellationAt,\n      nextAssessmentAt = _machineState$context.nextAssessmentAt,\n      canceledAt = _machineState$context.canceledAt,\n      expiresAt = _machineState$context.expiresAt,\n      trialEndedAt = _machineState$context.trialEndedAt,\n      balanceInCents = _machineState$context.balanceInCents,\n      automaticallyResumeAt = _machineState$context.automaticallyResumeAt,\n      product = _machineState$context.product,\n      billing = _machineState$context.billing,\n      components = _machineState$context.components,\n      customFields = _machineState$context.customFields,\n      referralCode = _machineState$context.referralCode;\n  return {\n    id: id,\n    status: status,\n    productFamilyId: productFamilyId,\n    currency: currency,\n    currentBillingAmountInCents: currentBillingAmountInCents,\n    currentPeriodEndsAt: currentPeriodEndsAt,\n    scheduledCancellationAt: scheduledCancellationAt,\n    nextAssessmentAt: nextAssessmentAt,\n    canceledAt: canceledAt,\n    expiresAt: expiresAt,\n    trialEndedAt: trialEndedAt,\n    balanceInCents: balanceInCents,\n    automaticallyResumeAt: automaticallyResumeAt,\n    product: product,\n    billing: billing,\n    components: components,\n    customFields: customFields,\n    referralCode: referralCode\n  };\n};\nvar subscriptionSelectors = {\n  getSubscriptionState: getSubscriptionState,\n  getSubscriptionDetails: getSubscriptionDetails\n};\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/machines/subscription/selectors.ts?");
 
 /***/ }),
 
@@ -11159,7 +11181,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 xstate_lib_model__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! xstate/lib/model */ \"./node_modules/.pnpm/xstate@4.33.6/node_modules/xstate/lib/model.js\");\n\nvar subscriptionModel = (0,xstate_lib_model__WEBPACK_IMPORTED_MODULE_0__.createModel)({\n  id: null,\n  status: 'active',\n  currency: 'USD',\n  scheduledCancellationAt: null,\n  currentBillingAmountInCents: 0,\n  productFamilyId: null,\n  expiresAt: null,\n  automaticallyResumeAt: null,\n  trialEndedAt: null,\n  canceledAt: null,\n  currentPeriodEndsAt: null,\n  nextAssessmentAt: null,\n  nextProductId: null,\n  balanceInCents: 0,\n  product: {\n    id: null,\n    name: '',\n    description: null,\n    priceInCents: 0,\n    interval: 0,\n    intervalUnit: null,\n    trialPriceInCents: 0,\n    trialInterval: null,\n    trialIntervalUnit: null\n  },\n  components: {\n    updatesAllowed: null,\n    usedInBilling: null\n  },\n  billing: {\n    paymentProfileConnected: false,\n    paymentProfileId: null,\n    address: {\n      address: null,\n      address2: null,\n      city: null,\n      state: null,\n      zip: null,\n      country: null\n    },\n    creditCard: {\n      firstName: null,\n      lastName: null,\n      cardType: null,\n      maskedNumber: null,\n      expirationMonth: 0,\n      expirationYear: 0\n    },\n    bankAccount: {\n      maskedAccountNumber: null,\n      maskedRoutingNumber: null,\n      bankName: null,\n      firstName: null,\n      lastName: null\n    }\n  }\n}, {\n  events: {\n    UPDATE_SUBSCRIPTION: function UPDATE_SUBSCRIPTION(event) {\n      return event;\n    }\n  }\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (subscriptionModel);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/models/subscription/subscription.ts?");
+eval("/* harmony export */ __webpack_require__.d(__webpack_exports__, {\n/* harmony export */   \"default\": () => (__WEBPACK_DEFAULT_EXPORT__)\n/* harmony export */ });\n/* harmony import */ var xstate_lib_model__WEBPACK_IMPORTED_MODULE_0__ = __webpack_require__(/*! xstate/lib/model */ \"./node_modules/.pnpm/xstate@4.33.6/node_modules/xstate/lib/model.js\");\n\nvar subscriptionModel = (0,xstate_lib_model__WEBPACK_IMPORTED_MODULE_0__.createModel)({\n  id: null,\n  status: 'active',\n  currency: 'USD',\n  scheduledCancellationAt: null,\n  currentBillingAmountInCents: 0,\n  productFamilyId: null,\n  expiresAt: null,\n  automaticallyResumeAt: null,\n  trialEndedAt: null,\n  canceledAt: null,\n  currentPeriodEndsAt: null,\n  nextAssessmentAt: null,\n  nextProductId: null,\n  balanceInCents: 0,\n  referralCode: null,\n  product: {\n    id: null,\n    name: '',\n    description: null,\n    priceInCents: 0,\n    interval: 0,\n    intervalUnit: null,\n    trialPriceInCents: 0,\n    trialInterval: null,\n    trialIntervalUnit: null\n  },\n  components: {\n    updatesAllowed: null,\n    usedInBilling: null\n  },\n  billing: {\n    paymentProfileConnected: false,\n    paymentProfileId: null,\n    address: {\n      address: null,\n      address2: null,\n      city: null,\n      state: null,\n      zip: null,\n      country: null\n    },\n    creditCard: {\n      firstName: null,\n      lastName: null,\n      cardType: null,\n      maskedNumber: null,\n      expirationMonth: 0,\n      expirationYear: 0\n    },\n    bankAccount: {\n      maskedAccountNumber: null,\n      maskedRoutingNumber: null,\n      bankName: null,\n      firstName: null,\n      lastName: null\n    }\n  }\n}, {\n  events: {\n    UPDATE_SUBSCRIPTION: function UPDATE_SUBSCRIPTION(event) {\n      return event;\n    }\n  }\n});\n/* harmony default export */ const __WEBPACK_DEFAULT_EXPORT__ = (subscriptionModel);\n\n//# sourceURL=webpack://Maxio/./packages/subscriptions-manager/src/models/subscription/subscription.ts?");
 
 /***/ }),
 

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.3.1",
+  "version": "1.4.0",
   "scripts": {
     "test": "jest",
     "test:coverage": "jest --coverage",

package/typings/packages/data-access/src/DataAccess.d.ts

@@ -46,6 +46,7 @@ declare class DataAccess {
         productFamilyId: number;
         state: string;
         balanceInCents: number;
+        referralCode: string;
         currentPeriodEndsAt: string;
         nextAssessmentAt: string;
         nextProductId?: number;
@@ -188,6 +189,7 @@ declare class DataAccess {
             productFamilyId: number;
             state: string;
             balanceInCents: number;
+            referralCode: string;
             currentPeriodEndsAt: string;
             nextAssessmentAt: string;
             nextProductId?: number;

package/typings/packages/data-access/src/types/subscription.d.ts

@@ -4,6 +4,7 @@ export declare type Subscription = {
     product_family_id: number;
     state: string;
     balance_in_cents: number;
+    referral_code: string | null;
     current_period_ends_at: string | null;
     next_assessment_at: string | null;
     next_product_id?: number | null;

package/typings/packages/subscriptions-manager/src/components/Subscription/Subscription.d.ts

@@ -27,6 +27,7 @@ declare type SubscriptionProps = {
     renderComponentsSection?: boolean;
     renderCustomFieldsSection?: boolean;
     availableActions?: SubscriptionActions[];
+    referralCode?: string;
 } & FormattedSubscriptionDetails;
-declare const Subscription: ({ id, catalogId, name, price, statusTag, description, status, onShowDetails, detailsVisible, cardColor, nextBillingAmount, nextBillingDate, basePlanPrice, cancellationDate, expirationDate, layout, autoResumeDate, trialExpirationDate, priceAfterTrial, trialPrice, currentBalance, nextBillingAttempt, interval, billingDetails, renderComponentsSection, renderCustomFieldsSection, scheduledCancellationDate, availableActions, }: SubscriptionProps) => JSX.Element;
+declare const Subscription: ({ id, catalogId, name, price, statusTag, description, status, onShowDetails, detailsVisible, cardColor, nextBillingAmount, nextBillingDate, basePlanPrice, cancellationDate, expirationDate, layout, autoResumeDate, trialExpirationDate, priceAfterTrial, trialPrice, currentBalance, nextBillingAttempt, interval, billingDetails, renderComponentsSection, renderCustomFieldsSection, scheduledCancellationDate, availableActions, referralCode, }: SubscriptionProps) => JSX.Element;
 export default Subscription;

package/typings/packages/subscriptions-manager/src/components/SubscriptionReferalCode/SubscriptionReferalCode.d.ts

@@ -0,0 +1,7 @@
+/// <reference types="react" />
+declare type Props = {
+    label: string;
+    referalCode: string;
+};
+export declare const SubscriptionReferalCode: ({ label, referalCode }: Props) => JSX.Element;
+export {};

package/typings/packages/subscriptions-manager/src/components/SubscriptionReferalCode/index.d.ts

@@ -0,0 +1,2 @@
+import { SubscriptionReferalCode } from './SubscriptionReferalCode';
+export default SubscriptionReferalCode;

package/typings/packages/subscriptions-manager/src/machines/subscription/selectors.d.ts

@@ -27,6 +27,7 @@ export declare const getSubscriptionDetails: (machineState: SubscriptionState) =
         updatesAllowed: null;
         visible: null;
     };
+    referralCode: string;
 };
 export declare const subscriptionSelectors: {
     getSubscriptionState: (machineState: SubscriptionState) => import("../../models").SubscriptionStatus;
@@ -54,6 +55,7 @@ export declare const subscriptionSelectors: {
             updatesAllowed: null;
             visible: null;
         };
+        referralCode: string;
     };
 };
 export {};

package/typings/packages/subscriptions-manager/src/machines/subscriptions/actions.d.ts

@@ -37,6 +37,7 @@ export declare const updateSubscription: import("xstate").AssignAction<{
                 trialEndedAt: string;
                 automaticallyResumeAt: string;
                 balanceInCents: number;
+                referralCode: string;
                 product: import("type-fest/source/partial-deep").PartialObjectDeep<import("../../models").SubscriptionProduct, {}>;
                 billing: import("type-fest/source/partial-deep").PartialObjectDeep<import("../../models/subscription/types").SubscriptionBilling, {}>;
                 components: import("type-fest/source/partial-deep").PartialObjectDeep<{

package/typings/packages/subscriptions-manager/src/models/subscription/types.d.ts

@@ -18,6 +18,7 @@ export interface SubscriptionModel {
     trialEndedAt: string | null;
     automaticallyResumeAt: string | null;
     balanceInCents: number | null;
+    referralCode: string | null;
     product: SubscriptionProduct;
     billing: SubscriptionBilling;
     components: {