@stigg/react-sdk 4.4.0-beta.6 → 4.4.0-beta.8

package/dist/react-sdk.esm.js

@@ -11,7 +11,7 @@ import moment from 'moment';
 import isNil from 'lodash-es/isNil';
 import { compact, map, isFunction, countBy, uniq, merge as merge$1, keyBy, padStart, range, partition as partition$1 } from 'lodash-es';
 import classNames from 'classnames';
-import { Select, OutlinedInput, MenuItem, Grid, Box as Box$1, Tooltip, tooltipClasses, Link, Divider as Divider$1, LinearProgress as LinearProgress$1, linearProgressClasses, Button as Button$2, buttonClasses, StepIcon, css as css$2, TextField, CircularProgress, Paper, Collapse, Radio, Alert, Chip } from '@mui/material';
+import { Select, OutlinedInput, MenuItem, Grid, Box as Box$1, Tooltip, tooltipClasses, Link, Divider as Divider$1, LinearProgress as LinearProgress$1, linearProgressClasses, Button as Button$2, buttonClasses, StepIcon, TextField, CircularProgress, Paper, Collapse, Radio, Alert, Chip } from '@mui/material';
 import getSymbolFromCurrency from 'currency-symbol-map';
 import Switch from 'react-switch';
 import Skeleton$1, { SkeletonTheme } from 'react-loading-skeleton';
@@ -7634,8 +7634,6 @@ var useChargesSort = function useChargesSort(charges) {
 
 var _excluded$5 = ["variant"];
 
-var _templateObject$7, _templateObject2$2;
-
 var StyledButton$2 = /*#__PURE__*/_styled(Button$2, process.env.NODE_ENV === "production" ? {
   shouldForwardProp: function shouldForwardProp(prop) {
     return !prop.startsWith('$');
@@ -7647,26 +7645,36 @@ var StyledButton$2 = /*#__PURE__*/_styled(Button$2, process.env.NODE_ENV === "pr
   },
   target: "effv4rq0",
   label: "StyledButton"
-})("border-radius:10px;text-transform:none;", function (_ref) {
+})("border-radius:10px;text-transform:none;background-color:", function (_ref) {
   var theme = _ref.theme,
       $success = _ref.$success,
       $error = _ref.$error;
 
   if ($success) {
-    return css$2(_templateObject$7 || (_templateObject$7 = _taggedTemplateLiteralLoose(["\n        background-color: ", ";\n        cursor: 'default';\n\n        &:hover {\n          background-color: ", ";\n        }\n      "])), theme.stigg.palette.success, theme.stigg.palette.successDark);
+    return theme.stigg.palette.success;
+  } else if ($error) {
+    return theme.stigg.palette.error;
   }
 
-  if ($error) {
-    return css$2(_templateObject2$2 || (_templateObject2$2 = _taggedTemplateLiteralLoose(["\n        background-color: ", ";\n\n        &:hover {\n          background-color: ", ";\n        }\n      "])), theme.stigg.palette.error, theme.stigg.palette.errorDark);
+  return '';
+}, ";&:hover{background-color:", function (_ref2) {
+  var theme = _ref2.theme,
+      $success = _ref2.$success,
+      $error = _ref2.$error;
+
+  if ($success) {
+    return theme.stigg.palette.successDark;
+  } else if ($error) {
+    return theme.stigg.palette.errorDark;
   }
 
   return '';
-}, ";" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRytGIiwiZmlsZSI6IkJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZC9tYWNybyc7XHJcbmltcG9ydCB7IEJ1dHRvbiBhcyBNdWlCdXR0b24sIGNzcyB9IGZyb20gJ0BtdWkvbWF0ZXJpYWwnO1xyXG5jb25zdCBTdHlsZWRCdXR0b24gPSBzdHlsZWQoTXVpQnV0dG9uLCB7IHNob3VsZEZvcndhcmRQcm9wOiAocHJvcCkgPT4gIXByb3Auc3RhcnRzV2l0aCgnJCcpIH0pIGBcbiAgYm9yZGVyLXJhZGl1czogMTBweDtcbiAgdGV4dC10cmFuc2Zvcm06IG5vbmU7XG5cbiAgJHsoeyB0aGVtZSwgJHN1Y2Nlc3MsICRlcnJvciB9KSA9PiB7XHJcbiAgICBpZiAoJHN1Y2Nlc3MpIHtcclxuICAgICAgICByZXR1cm4gY3NzIGBcbiAgICAgICAgYmFja2dyb3VuZC1jb2xvcjogJHt0aGVtZS5zdGlnZy5wYWxldHRlLnN1Y2Nlc3N9O1xuICAgICAgICBjdXJzb3I6ICdkZWZhdWx0JztcblxuICAgICAgICAmOmhvdmVyIHtcbiAgICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLnN0aWdnLnBhbGV0dGUuc3VjY2Vzc0Rhcmt9O1xuICAgICAgICB9XG4gICAgICBgO1xyXG4gICAgfVxyXG4gICAgaWYgKCRlcnJvcikge1xyXG4gICAgICAgIHJldHVybiBjc3MgYFxuICAgICAgICBiYWNrZ3JvdW5kLWNvbG9yOiAke3RoZW1lLnN0aWdnLnBhbGV0dGUuZXJyb3J9O1xuXG4gICAgICAgICY6aG92ZXIge1xuICAgICAgICAgIGJhY2tncm91bmQtY29sb3I6ICR7dGhlbWUuc3RpZ2cucGFsZXR0ZS5lcnJvckRhcmt9O1xuICAgICAgICB9XG4gICAgICBgO1xyXG4gICAgfVxyXG4gICAgcmV0dXJuICcnO1xyXG59fVxuYDtcclxuZXhwb3J0IGNvbnN0IEJ1dHRvbiA9ICh7IHZhcmlhbnQgPSAnb3V0bGluZWQnLCAuLi5wcm9wcyB9KSA9PiB7XHJcbiAgICByZXR1cm4gUmVhY3QuY3JlYXRlRWxlbWVudChTdHlsZWRCdXR0b24sIE9iamVjdC5hc3NpZ24oeyB2YXJpYW50OiB2YXJpYW50IH0sIHByb3BzKSk7XHJcbn07XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUJ1dHRvbi5qcy5tYXAiXX0= */"));
+}, ";}" + (process.env.NODE_ENV === "production" ? "" : "/*# sourceMappingURL=data:application/json;charset=utf-8;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIkJ1dHRvbi50c3giXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBRytGIiwiZmlsZSI6IkJ1dHRvbi50c3giLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgUmVhY3QgZnJvbSAncmVhY3QnO1xyXG5pbXBvcnQgc3R5bGVkIGZyb20gJ0BlbW90aW9uL3N0eWxlZC9tYWNybyc7XHJcbmltcG9ydCB7IEJ1dHRvbiBhcyBNdWlCdXR0b24gfSBmcm9tICdAbXVpL21hdGVyaWFsJztcclxuY29uc3QgU3R5bGVkQnV0dG9uID0gc3R5bGVkKE11aUJ1dHRvbiwgeyBzaG91bGRGb3J3YXJkUHJvcDogKHByb3ApID0+ICFwcm9wLnN0YXJ0c1dpdGgoJyQnKSB9KSBgXG4gIGJvcmRlci1yYWRpdXM6IDEwcHg7XG4gIHRleHQtdHJhbnNmb3JtOiBub25lO1xuXG4gIGJhY2tncm91bmQtY29sb3I6ICR7KHsgdGhlbWUsICRzdWNjZXNzLCAkZXJyb3IgfSkgPT4ge1xyXG4gICAgaWYgKCRzdWNjZXNzKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoZW1lLnN0aWdnLnBhbGV0dGUuc3VjY2VzcztcclxuICAgIH1cclxuICAgIGVsc2UgaWYgKCRlcnJvcikge1xyXG4gICAgICAgIHJldHVybiB0aGVtZS5zdGlnZy5wYWxldHRlLmVycm9yO1xyXG4gICAgfVxyXG4gICAgcmV0dXJuICcnO1xyXG59fTtcblxuICAmOmhvdmVyIHtcbiAgICBiYWNrZ3JvdW5kLWNvbG9yOiAkeyh7IHRoZW1lLCAkc3VjY2VzcywgJGVycm9yIH0pID0+IHtcclxuICAgIGlmICgkc3VjY2Vzcykge1xyXG4gICAgICAgIHJldHVybiB0aGVtZS5zdGlnZy5wYWxldHRlLnN1Y2Nlc3NEYXJrO1xyXG4gICAgfVxyXG4gICAgZWxzZSBpZiAoJGVycm9yKSB7XHJcbiAgICAgICAgcmV0dXJuIHRoZW1lLnN0aWdnLnBhbGV0dGUuZXJyb3JEYXJrO1xyXG4gICAgfVxyXG4gICAgcmV0dXJuICcnO1xyXG59fTtcbiAgfVxuYDtcclxuZXhwb3J0IGNvbnN0IEJ1dHRvbiA9ICh7IHZhcmlhbnQgPSAnb3V0bGluZWQnLCAuLi5wcm9wcyB9KSA9PiB7XHJcbiAgICByZXR1cm4gUmVhY3QuY3JlYXRlRWxlbWVudChTdHlsZWRCdXR0b24sIE9iamVjdC5hc3NpZ24oeyB2YXJpYW50OiB2YXJpYW50IH0sIHByb3BzKSk7XHJcbn07XHJcbi8vIyBzb3VyY2VNYXBwaW5nVVJMPUJ1dHRvbi5qcy5tYXAiXX0= */"));
 
-var Button = function Button(_ref2) {
-  var _ref2$variant = _ref2.variant,
-      variant = _ref2$variant === void 0 ? 'outlined' : _ref2$variant,
-      props = _objectWithoutPropertiesLoose(_ref2, _excluded$5);
+var Button = function Button(_ref3) {
+  var _ref3$variant = _ref3.variant,
+      variant = _ref3$variant === void 0 ? 'outlined' : _ref3$variant,
+      props = _objectWithoutPropertiesLoose(_ref3, _excluded$5);
 
   return React__default.createElement(StyledButton$2, Object.assign({
     variant: variant
@@ -12628,11 +12636,12 @@ function AddonListItem(_ref) {
       setAddon(addon, initialAddonState.quantity);
     } else {
       removeAddon(addon.id);
-      onAddonsValidationChange({
-        addonId: addon.id,
-        isValid: true
-      });
     }
+
+    onAddonsValidationChange({
+      addonId: addon.id,
+      isValid: true
+    });
   };
 
   return React__default.createElement(AddonListItemContainer, {
@@ -12685,7 +12694,11 @@ function AddonListItem(_ref) {
   }), React__default.createElement(TrashButton, {
     color: "error",
     onClick: function onClick() {
-      return removeAddon(addon.id);
+      removeAddon(addon.id);
+      onAddonsValidationChange({
+        addonId: addon.id,
+        isValid: true
+      });
     }
   }, React__default.createElement(Icon, {
     icon: "Trash",
@@ -12721,10 +12734,7 @@ function CheckoutAddonsStep() {
       removeAddon = _useAddonsStepModel.removeAddon;
 
   var _useState = useState((availableAddons == null ? void 0 : availableAddons.reduce(function (acc, curr) {
-    var addonState = addons.find(function (x) {
-      return x.addon.id === curr.id;
-    });
-    acc[curr.id] = !!addonState && addonState.quantity > 0;
+    acc[curr.id] = true;
     return acc;
   }, {})) || {}),
       addonsValidation = _useState[0],
@@ -12767,15 +12777,15 @@ function CheckoutAddonsStep() {
   }));
 }
 
-var _templateObject$8, _templateObject2$3, _templateObject3$2, _templateObject4;
-var PaymentMethodContainer = /*#__PURE__*/styled$1(Grid)(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 8px;\n  border-radius: 10px;\n  border: 1px solid ", ";\n  cursor: ", ";\n"])), function (_ref) {
+var _templateObject$7, _templateObject2$2, _templateObject3$2, _templateObject4;
+var PaymentMethodContainer = /*#__PURE__*/styled$1(Grid)(_templateObject$7 || (_templateObject$7 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  padding: 8px;\n  border-radius: 10px;\n  border: 1px solid ", ";\n  cursor: ", ";\n"])), function (_ref) {
   var theme = _ref.theme;
   return theme.stigg.palette.outlinedBorder;
 }, function (_ref2) {
   var $disabled = _ref2.$disabled;
   return $disabled ? 'not-allowed' : 'pointer';
 });
-var NewPaymentMethodContainer = /*#__PURE__*/styled$1(PaymentMethodContainer)(_templateObject2$3 || (_templateObject2$3 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex-direction: column;\n  align-items: unset;\n"])));
+var NewPaymentMethodContainer = /*#__PURE__*/styled$1(PaymentMethodContainer)(_templateObject2$2 || (_templateObject2$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  flex-direction: column;\n  align-items: unset;\n"])));
 var PaymentMethodLayoutContainer = /*#__PURE__*/styled$1(Grid)(_templateObject3$2 || (_templateObject3$2 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  align-items: center;\n  flex: 1;\n  gap: 12px;\n"])));
 var PaymentMethodTextContainer = /*#__PURE__*/styled$1(Grid)(_templateObject4 || (_templateObject4 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n"])));
 
@@ -12855,8 +12865,8 @@ function NewPaymentMethod(_ref3) {
   })));
 }
 
-var _templateObject$9;
-var PaymentContainer = /*#__PURE__*/styled$1(Grid)(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  margin: 32px 0;\n"])));
+var _templateObject$8;
+var PaymentContainer = /*#__PURE__*/styled$1(Grid)(_templateObject$8 || (_templateObject$8 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: column;\n  gap: 24px;\n  margin: 32px 0;\n"])));
 function PaymentStep(_ref) {
   var onBillingAddressChange = _ref.onBillingAddressChange;
 
@@ -13077,8 +13087,8 @@ var BillingPeriodPicker$1 = function BillingPeriodPicker(_ref2) {
   })));
 };
 
-var _templateObject$a;
-var StyledPlanCharge = /*#__PURE__*/styled$1.div(_templateObject$a || (_templateObject$a = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  min-height: 60px;\n  margin-top: 16px;\n"])));
+var _templateObject$9;
+var StyledPlanCharge = /*#__PURE__*/styled$1.div(_templateObject$9 || (_templateObject$9 = /*#__PURE__*/_taggedTemplateLiteralLoose(["\n  display: flex;\n  flex-direction: row;\n  justify-content: space-between;\n  align-items: center;\n  min-height: 60px;\n  margin-top: 16px;\n"])));
 function PlanCharge(_ref) {
   var _charge$feature, _charge$feature2, _charge$feature3;