@thecb/components 4.2.8-beta.4 → 4.2.9

package/dist/index.cjs.js

@@ -21260,7 +21260,8 @@ var Jumbo = function Jumbo(_ref) {
       CartStatus = _ref.cartStatus,
       total = _ref.total,
       itemsCount = _ref.itemsCount,
-      showCartStatus = _ref.showCartStatus,
+      _ref$showCartStatus = _ref.showCartStatus,
+      showCartStatus = _ref$showCartStatus === void 0 ? false : _ref$showCartStatus,
       openCartSlider = _ref.openCartSlider;
 
   var _useContext = React.useContext(styled.ThemeContext),
@@ -21284,12 +21285,14 @@ var Jumbo = function Jumbo(_ref) {
   }, /*#__PURE__*/React__default.createElement(Cluster, {
     minHeight: "100%",
     justify: isMobile && !showCartStatus ? "center" : showButton || showCartStatus ? "space-between" : "left",
-    align: "center"
+    align: "center",
+    nowrap: showCartStatus
   }, /*#__PURE__*/React__default.createElement(Heading$1, {
     variant: isMobile ? "h5" : "h3",
     color: "#ffffff",
     className: "themeJumboHeading",
-    themeJumboHeading: true
+    themeJumboHeading: true,
+    extraStyles: showCartStatus && isMobile && "max-width: 60%;"
   }, heading), subHeading && /*#__PURE__*/React__default.createElement(Heading$1, {
     variant: isMobile ? "h6" : "h2",
     color: "#ffffff",
@@ -34463,6 +34466,12 @@ const set$2 = fieldName => value => ({
 const CLEAR = "form/CLEAR";
 const clear = () => ({ type: CLEAR });
 
+const ADD_VALIDATOR = "field/ADD_VALIDATOR";
+const addValidator = fieldName => validator => ({
+  type: ADD_VALIDATOR,
+  payload: { fieldName, validator }
+});
+
 const createFormReducer = formConfig => (
   state = createInitialState(formConfig),
   action
@@ -34494,6 +34503,23 @@ const createFormReducer = formConfig => (
       });
     case CLEAR:
       return createInitialState(formConfig);
+    case ADD_VALIDATOR: 
+      const fieldWithOverride = action.payload.fieldName;
+      const newValidator = action.payload.validator;
+      
+      return produce(state, draftState => {
+        draftState[fieldWithOverride].validators.push(newValidator);
+        const fields = Object.entries(draftState);
+        for (let entry of fields) {
+          let fieldName = entry[0];
+          let field = entry[1];
+          let errors = computeErrors(fieldName, draftState);
+          let dirty = field.dirty;
+          draftState[fieldName].errors = errors;
+          draftState[fieldName].dirty = dirty;
+          draftState[fieldName].hasErrors = errors.length > 0;
+        }
+      });
     default:
       return state;
   }
@@ -34512,7 +34538,8 @@ const createMapDispatchToProps = formConfig => {
     const keys = Object.keys(formConfig);
     for (let fieldName of keys) {
       dispatchObj.fields[fieldName] = {
-        set: value => dispatch(set$2(fieldName)(value))
+        set: value => dispatch(set$2(fieldName)(value)),
+        addValidator: validator => dispatch(addValidator(fieldName)(validator))
       };
     }
     dispatchObj.form = { clear: () => dispatch(clear()) };
@@ -39736,11 +39763,11 @@ var formConfig$7 = {
     constraints: [validateWhen(onlyIntegers(), matchesRegex("US"), "country"), validateWhen(hasLength(0, 9), matchesRegex("US"), "country")]
   }
 };
-
-var _createFormState$7 = createFormState(formConfig$7),
-    reducer$7 = _createFormState$7.reducer,
-    mapStateToProps$8 = _createFormState$7.mapStateToProps,
-    mapDispatchToProps$7 = _createFormState$7.mapDispatchToProps;
+var formState = createFormState(formConfig$7);
+console.log("form state is", formState);
+var reducer$7 = formState.reducer,
+    mapStateToProps$8 = formState.mapStateToProps,
+    mapDispatchToProps$7 = formState.mapDispatchToProps;
 
 PaymentFormCard.reducer = reducer$7;
 PaymentFormCard.mapStateToProps = mapStateToProps$8;
@@ -39800,10 +39827,10 @@ var formConfig$8 = {
   }
 };
 
-var _createFormState$8 = createFormState(formConfig$8),
-    reducer$8 = _createFormState$8.reducer,
-    mapStateToProps$9 = _createFormState$8.mapStateToProps,
-    mapDispatchToProps$8 = _createFormState$8.mapDispatchToProps;
+var _createFormState$7 = createFormState(formConfig$8),
+    reducer$8 = _createFormState$7.reducer,
+    mapStateToProps$9 = _createFormState$7.mapStateToProps,
+    mapDispatchToProps$8 = _createFormState$7.mapDispatchToProps;
 
 PhoneForm.reducer = reducer$8;
 PhoneForm.mapStateToProps = mapStateToProps$9;
@@ -40145,10 +40172,10 @@ var formConfig$9 = {
   }
 };
 
-var _createFormState$9 = createFormState(formConfig$9),
-    reducer$9 = _createFormState$9.reducer,
-    mapStateToProps$a = _createFormState$9.mapStateToProps,
-    mapDispatchToProps$9 = _createFormState$9.mapDispatchToProps;
+var _createFormState$8 = createFormState(formConfig$9),
+    reducer$9 = _createFormState$8.reducer,
+    mapStateToProps$a = _createFormState$8.mapStateToProps,
+    mapDispatchToProps$9 = _createFormState$8.mapDispatchToProps;
 
 RegistrationForm.reducer = reducer$9;
 RegistrationForm.mapStateToProps = mapStateToProps$a;
@@ -40266,10 +40293,10 @@ var formConfig$a = {
   }
 };
 
-var _createFormState$a = createFormState(formConfig$a),
-    reducer$a = _createFormState$a.reducer,
-    mapStateToProps$b = _createFormState$a.mapStateToProps,
-    mapDispatchToProps$a = _createFormState$a.mapDispatchToProps;
+var _createFormState$9 = createFormState(formConfig$a),
+    reducer$a = _createFormState$9.reducer,
+    mapStateToProps$b = _createFormState$9.mapStateToProps,
+    mapDispatchToProps$a = _createFormState$9.mapDispatchToProps;
 
 ResetPasswordForm.reducer = reducer$a;
 ResetPasswordForm.mapStateToProps = mapStateToProps$b;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@thecb/components",
-  "version": "4.2.8-beta.4",
+  "version": "4.2.9",
   "description": "Common lib for CityBase react components",
   "main": "dist/index.cjs.js",
   "module": "dist/index.esm.js",
@@ -80,6 +80,6 @@
     "ramda": "^0.27.0",
     "react-aria-modal": "^4.0.0",
     "react-pose": "^4.0.10",
-    "redux-freeform": "^5.0.0"
+    "redux-freeform": "^5.0.1"
   }
 }

package/src/components/atoms/jumbo/Jumbo.js

@@ -18,7 +18,7 @@ const Jumbo = ({
   cartStatus: CartStatus,
   total,
   itemsCount,
-  showCartStatus,
+  showCartStatus = false,
   openCartSlider
 }) => {
   const { isMobile } = useContext(ThemeContext);
@@ -47,12 +47,14 @@ const Jumbo = ({
                   : `left`
               }
               align="center"
+              nowrap={showCartStatus}
             >
               <Heading
                 variant={isMobile ? "h5" : "h3"}
                 color="#ffffff"
                 className="themeJumboHeading"
                 themeJumboHeading
+                extraStyles={showCartStatus && isMobile && `max-width: 60%;`}
               >
                 {heading}
               </Heading>

package/src/components/molecules/payment-form-card/PaymentFormCard.state.js

@@ -54,6 +54,7 @@ const formConfig = {
   }
 };
 
-export const { reducer, mapStateToProps, mapDispatchToProps } = createFormState(
-  formConfig
-);
+const formState = createFormState(formConfig);
+console.log("form state is", formState);
+
+export const { reducer, mapStateToProps, mapDispatchToProps } = formState;