@springmicro/cart 0.6.4 → 0.7.1

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@springmicro/cart",
   "private": false,
-  "version": "0.6.4",
+  "version": "0.7.1",
   "type": "module",
   "main": "dist/index.js",
   "types": "dist/index.d.ts",
@@ -24,7 +24,7 @@
     "@nanostores/persistent": "^0.10.1",
     "@nanostores/query": "^0.3.3",
     "@nanostores/react": "^0.7.2",
-    "@springmicro/utils": "0.6.4",
+    "@springmicro/utils": "0.7.1",
     "dotenv": "^16.4.5",
     "nanostores": "^0.10.3",
     "react": "^18.2.0",
@@ -49,5 +49,5 @@
     "vite-plugin-css-injected-by-js": "^3.5.1",
     "yup": "^1.4.0"
   },
-  "gitHead": "231b7271a35509c623b20df1ab7c9d386a9a0cf7"
+  "gitHead": "3fba722cf2e25b298d1b774c2b39ae8ac5743076"
 }

package/src/checkout/ReviewCartAndCalculateTaxes.tsx

@@ -25,6 +25,7 @@ import {
 import { AddressValues } from "./components/Address";
 import { useFormik } from "formik";
 import { postCheckout } from "../utils/api";
+import { CheckoutFieldsType } from ".";
 
 async function createOrder(cart, apiBaseUrl, dev) {
   dev && console.log("Creating order");
@@ -131,6 +132,7 @@ export default function ReviewAndCalculateTaxes({
   CollectExtraInfo = undefined,
   defaultValues = {},
   dev,
+  hideFields = [],
 }) {
   dev && console.log({ products, prices });
   const [formDisabled, setFormDisabled] = useState(true);
@@ -397,6 +399,7 @@ export default function ReviewAndCalculateTaxes({
             formik={formik}
             prices={prices}
             products={products}
+            hideFields={hideFields}
           />
           <AddCard
             cardRequired={cardRequired}
@@ -409,6 +412,7 @@ export default function ReviewAndCalculateTaxes({
               formDisabled,
               formError,
             }}
+            hideFields={hideFields}
           />
         </Box>
       )}
@@ -416,8 +420,8 @@ export default function ReviewAndCalculateTaxes({
   );
 }
 
-function CheckoutActionFields({ formik, products, prices }) {
-  const checkoutFields = [
+function CheckoutActionFields({ formik, products, prices, hideFields = [] }) {
+  const checkoutFields: Record<string, CheckoutFieldsType> = [
     ...Object.keys(products).flatMap((productKey) =>
       (products[productKey].actions ?? []).flatMap(
         (action) => action.checkout_fields ?? []
@@ -447,33 +451,35 @@ function CheckoutActionFields({ formik, products, prices }) {
   const handleInputChange = (e) => {
     formik.handleChange(e);
   };
-
+  // console.log({ checkoutFields });
   return (
     <Box sx={{ display: "flex", flexDirection: "column", mx: 3, gap: 2 }}>
-      {Object.keys(checkoutFields).map((key) => {
-        const {
-          name,
-          label,
-          type = "string", // todo
-          required = true, // can be a string
-        } = checkoutFields[key];
-
-        return (
-          <TextField
-            fullWidth
-            name={name}
-            label={label}
-            required={required === true || required === "true"}
-            onBlur={formik.handleBlur}
-            onChange={handleInputChange}
-            onFocus={handleInputFocus}
-            variant="outlined"
-            value={formik.values[name]}
-            error={Boolean(formik.touched[name] && formik.errors[name])}
-            helperText={formik.touched[name] && formik.errors[name]}
-          />
-        );
-      })}
+      {Object.keys(checkoutFields)
+        .filter((key) => !["email", ...hideFields].includes(key))
+        .map((key) => {
+          const {
+            name,
+            label,
+            type = "string", // todo
+            required = true, // can be a string
+          } = checkoutFields[key];
+
+          return (
+            <TextField
+              fullWidth
+              name={name}
+              label={label}
+              required={required === true || required === "true"}
+              onBlur={formik.handleBlur}
+              onChange={handleInputChange}
+              onFocus={handleInputFocus}
+              variant="outlined"
+              value={formik.values[name]}
+              error={Boolean(formik.touched[name] && formik.errors[name])}
+              helperText={formik.touched[name] && formik.errors[name]}
+            />
+          );
+        })}
     </Box>
   );
 }

package/src/checkout/components/AddCard.tsx

@@ -68,6 +68,7 @@ export type AddCardProps = {
     formDisabled;
     formError;
   };
+  hideFields?: string[];
 };
 
 export const AddCard = ({
@@ -84,6 +85,7 @@ export const AddCard = ({
     formDisabled,
     formError,
   },
+  hideFields = [],
 }: AddCardProps) => {
   return (
     <Container id="paymentMethodForm">
@@ -203,11 +205,13 @@ export const AddCard = ({
                     Billing Address
                   </Typography>
                   <AddressCountryField formik={formik} name="country" />
-                  <AddressEmailField
-                    formik={formik}
-                    name="email"
-                    sx={{ mt: 2 }}
-                  />
+                  {!hideFields.includes("email") && (
+                    <AddressEmailField
+                      formik={formik}
+                      name="email"
+                      sx={{ mt: 2 }}
+                    />
+                  )}
                   <AddressOrganizationNameField
                     sx={{ mt: 2 }}
                     formik={formik}

package/src/checkout/components/Address.tsx

@@ -177,7 +177,7 @@ export function AddressEmailField({ formik, name, sx }: AddressFieldProps) {
   return (
     <>
       <TextField
-        label="Billing email"
+        label="Email"
         sx={{ width: 400, display: "block", ...sx }}
         name={name as string}
         id={name as string}

package/src/checkout/index.tsx

@@ -11,7 +11,7 @@ import { FormikConfig } from "formik";
 export type CheckoutFieldsType = {
   name: string;
   label?: string; // Defaults to a formated version of the name
-  required?: boolean; // Defaults to true
+  required?: boolean | string; // Defaults to true
   type?: "string"; // Defaults to "string" (text)
 };
 
@@ -23,6 +23,7 @@ export default function Checkout({
   disableMissingImage = false,
   CollectExtraInfo,
   defaultValues,
+  hideFields = [],
   dev,
 }: {
   apiBaseUrl: string;
@@ -32,6 +33,7 @@ export default function Checkout({
   disableMissingImage?: boolean;
   CollectExtraInfo?: React.FC<{ formik: FormikConfig<any> }>;
   defaultValues?: Record<string, any>;
+  hideFields?: string[];
   dev?: boolean;
 }) {
   const store = useStore(cartStore);
@@ -221,6 +223,7 @@ export default function Checkout({
             CollectExtraInfo={CollectExtraInfo}
             defaultValues={defaultValues}
             dev={dev}
+            hideFields={hideFields}
           />
         )}
         {status === 2 && order !== undefined && (