@shipengine/elements 2.24.1 → 2.26.0

package/dist/esm/utilities/address.js

@@ -0,0 +1,26 @@
+import { usStates, countries } from '../constants/shipengine/address.js';
+
+/**
+ * Returns a simplified list of countries for use in dropdowns and forms.
+ *
+ * @returns Array of country objects with name and code properties
+ */
+const getCountries = () => {
+  return countries.map(country => ({
+    name: country.name,
+    code: country.code
+  }));
+};
+/**
+ * Returns a simplified list of US states for use in dropdowns and forms.
+ *
+ * @returns Array of US state objects with name and code properties
+ */
+const getUsStates = () => {
+  return usStates.map(state => ({
+    name: state.name,
+    code: state.code
+  }));
+};
+
+export { getCountries, getUsStates };

package/dist/esm/utilities/files.js

@@ -0,0 +1,32 @@
+/**
+ * Creates a local file from an AxiosResponse containing a blob.
+ */
+const createLocalFileFromBlobResponse = (type, {
+  data: blob
+}) => {
+  const url = URL.createObjectURL(new Blob([blob], {
+    type: blob.type
+  }));
+  const fileName = type === "label" ? "labels-download" : "shipments-download";
+  triggerDownload(url, fileName);
+};
+/**
+ * Triggers the download of the sent URL.
+ * @param {string} url - The URL for the download.
+ * @param {string} filename - The filename for the download.
+ */
+const triggerDownload = (url, filename) => {
+  const downloadLink = createInvisibleAnchor(url, filename);
+  document.body.appendChild(downloadLink);
+  downloadLink.click();
+  document.body.removeChild(downloadLink);
+};
+const createInvisibleAnchor = (url, filename) => {
+  const downloadLink = document.createElement("a");
+  downloadLink.setAttribute("href", url);
+  downloadLink.setAttribute("download", filename);
+  downloadLink.style.display = "none";
+  return downloadLink;
+};
+
+export { createLocalFileFromBlobResponse, triggerDownload };

package/dist/esm/utilities/formatString.js

@@ -17,5 +17,13 @@ const replaceSpacesWithDashes = str => str === null || str === void 0 ? void 0 :
 const addSpaceBetweenWords = str => str.replace(/([a-z])([A-Z])/g, "$1 $2") // add space if there is a lowercase letter followed by an uppercase letter
 .replace(/(?<=[a-zA-Z])(\d)/g, " $1") // add space if there is a letter followed by a number
 .trim();
+/**
+ * Converts a string from camelCase or PascalCase to snake_case
+ *
+ * @example
+ * toSnakeCase("helloWorld") // returns "hello_world"
+ * toSnakeCase("HelloWorld") // returns "hello_world"
+ */
+const toSnakeCase = str => str.replace(/[A-Z]/g, letter => `_${letter.toLowerCase()}`);
 
-export { addSpaceBetweenWords, capitalizeFirstLetter, capitalizeFirstLetterOfEachWord, pascalize, replaceSpacesWithDashes };
+export { addSpaceBetweenWords, capitalizeFirstLetter, capitalizeFirstLetterOfEachWord, pascalize, replaceSpacesWithDashes, toSnakeCase };

package/dist/esm/utilities/index.js

@@ -1,3 +1,5 @@
 export { createStyles, scopeTheme } from './styles.js';
 export { getSellerIdFromToken, isOnboarded, validateShipFromAddress } from './checks.js';
+export { createLocalFileFromBlobResponse } from './files.js';
+export { getCountries, getUsStates } from './address.js';
 export { getDefaultFeatures } from './feature-flags/feature-flags.js';

package/dist/esm/utilities/money.js

@@ -36,6 +36,19 @@ const calculateTotal = (...values) => {
     return value ? total + ((_a = value.amount) !== null && _a !== void 0 ? _a : 0) : total;
   }, 0);
 };
+/**
+ * @internal
+ *
+ * # Money Utils - maskCreditCardNumber
+ */
+const maskCreditCardNumber = cc => {
+  const sanitizedCC = cc.replace(/\s/g, "");
+  if (!sanitizedCC || sanitizedCC.length < 15 || sanitizedCC.length > 16) {
+    return cc;
+  }
+  const maskedCCNumber = "*".repeat(sanitizedCC.length - 4) + sanitizedCC.slice(-4);
+  return maskedCCNumber.replace(/(.{4})/g, "$1 ").trim();
+};
 /**
  * @internal
  *
@@ -94,4 +107,4 @@ const getCurrencySymbolFromString = currency => {
   return currencySymbol;
 };
 
-export { calculateTotal, currencySymbol, formatCreditCardNumber, formatExpiration, formatMoney, getCurrencyFromString, getCurrencySymbolFromString };
+export { calculateTotal, currencySymbol, formatCreditCardNumber, formatExpiration, formatMoney, getCurrencyFromString, getCurrencySymbolFromString, maskCreditCardNumber };

package/dist/esm/utilities/rate-warning-messages.js

@@ -0,0 +1,23 @@
+import rateMessages from '../data/rate-messages.json.js';
+
+/**
+ * Builds warning messages for a rate by combining messages from different sources:
+ * 1. Messages for serviceCode:shipDay combination
+ * 2. Messages for serviceCode:packageType combination
+ * 3. Messages for serviceCode only
+ * 4. Existing warning messages from the rate
+ */
+const buildRateWarningMessages = ({
+  serviceCode,
+  packageType,
+  shipDay,
+  existingWarningMessages = []
+}) => {
+  const keys = [shipDay && `${serviceCode}:${shipDay}`, packageType && `${serviceCode}:${packageType}`, serviceCode].filter(Boolean);
+  return [...keys.flatMap(key => {
+    var _a;
+    return (_a = rateMessages[key]) !== null && _a !== void 0 ? _a : [];
+  }), ...existingWarningMessages];
+};
+
+export { buildRateWarningMessages };

package/dist/esm/utilities/shipengine/warehouses.js

@@ -1,5 +1,6 @@
 const getDefaultWarehouse = warehouses => {
-  return warehouses === null || warehouses === void 0 ? void 0 : warehouses.find(w => w.isDefault);
+  var _a;
+  return (_a = warehouses === null || warehouses === void 0 ? void 0 : warehouses.find(w => w.isDefault)) !== null && _a !== void 0 ? _a : warehouses === null || warehouses === void 0 ? void 0 : warehouses[0];
 };
 const getWarehouseById = (warehouseId, warehouses) => {
   return warehouses === null || warehouses === void 0 ? void 0 : warehouses.find(w => w.warehouseId === warehouseId);

package/dist/esm/workflows/connect-external-carrier/connect-external-carrier.js

@@ -64,7 +64,7 @@ const Component = ({
     refetch: refetchSchema
   } = useGetCarrierConnectionForm({
     carrierName: selectedCarrier !== null && selectedCarrier !== void 0 ? selectedCarrier : "apicode-dummy-carrier",
-    enabled: false
+    enabled: !!selectedCarrier
   });
   useEffect(() => {
     if (selectedCarrier && needsRefetch) {
@@ -131,7 +131,9 @@ const Component = ({
       const updatedSchema = Object.assign({}, schema);
       // camelize required fields, as casing varies between carriers
       if (updatedSchema.required && Array.isArray(updatedSchema.required)) {
-        updatedSchema.required = updatedSchema.required.map(humps.camelize);
+        updatedSchema.required = updatedSchema.required.map(item => {
+          return typeof item === "string" ? humps.camelize(item) : item;
+        });
       }
       // camelize property keys
       // fail safe to ensure schema properties and required array match in the event the camelizeKeys from shipengine/js-api isn't consistent
@@ -153,7 +155,9 @@ const Component = ({
     const updatedUiSchema = Object.assign({}, uiSchemaClone);
     // add nickname to ui:order and camelize the values to ensure consistency with jsonSchema properties and required array
     if (!hasNicknameProperty && updatedUiSchema["ui:order"]) {
-      updatedUiSchema["ui:order"] = [...updatedUiSchema["ui:order"], "nickname"].map(humps.camelize);
+      // ui:order is typically an array of strings, but apparently can also be an array of arrays of strings, so we need to recursively camelize the items
+      const camelizeUIOrderItem = item => typeof item === "string" ? humps.camelize(item) : item.map(i => humps.camelize(i));
+      updatedUiSchema["ui:order"] = [...updatedUiSchema["ui:order"], "nickname"].map(camelizeUIOrderItem);
     }
     return updatedUiSchema;
   }, [uiSchema, hasNicknameProperty]);

package/dist/esm/workflows/label-workflow/label-workflow.js

@@ -44,6 +44,7 @@ const Component = _a => {
     data: accountSettings
   } = useGetAccountSettings();
   const {
+    createNewShipmentForNotFound,
     shipment,
     salesOrder,
     isLoading: isConfiguringShipment,
@@ -57,19 +58,24 @@ const Component = _a => {
     useWarehouses: (_b = propFeatures === null || propFeatures === void 0 ? void 0 : propFeatures.shipmentForm) === null || _b === void 0 ? void 0 : _b.useWarehouses,
     warehouseId
   }));
+  // Track if we have a shipment_not_found error to avoid reusing the bad shipment ID
+  const hasShipmentNotFoundError = configureShipmentErrors === null || configureShipmentErrors === void 0 ? void 0 : configureShipmentErrors.some(error => error.message === "shipment_not_found");
+  const shipmentId = _multiplexedId && "shipmentId" in _multiplexedId ? _multiplexedId.shipmentId : undefined;
   const {
     data: insuranceAccount,
     isInitialLoading: insuranceIsLoading
   } = useGetInsuranceAccount((shipment === null || shipment === void 0 ? void 0 : shipment.insuranceProvider) === SE.InsuranceProviderType.SHIPSURANCE ? SE.InsuranceProviderType.SHIPSURANCE : undefined);
   const {
     data: labelsResponse,
-    isLoading: isLabelsLoading,
+    isFetching: isLabelsLoading,
     error: listLabelsErrors,
     refetch: refetchLabels
   } = useListLabels({
-    enabled: _multiplexedId && "shipmentId" in _multiplexedId ? true : !!(shipment === null || shipment === void 0 ? void 0 : shipment.shipmentId),
+    enabled:
+    // Don't enable if we have a shipment_not_found error (avoid reusing bad ID)
+    hasShipmentNotFoundError ? false : _multiplexedId && "shipmentId" in _multiplexedId ? true : !!(shipment === null || shipment === void 0 ? void 0 : shipment.shipmentId),
     queryFnParams: {
-      shipmentId: _multiplexedId && "shipmentId" in _multiplexedId ? _multiplexedId.shipmentId : shipment === null || shipment === void 0 ? void 0 : shipment.shipmentId
+      shipmentId: (shipment === null || shipment === void 0 ? void 0 : shipment.shipmentId) || (!hasShipmentNotFoundError ? shipmentId : undefined)
     }
   });
   /**
@@ -173,6 +179,8 @@ const Component = _a => {
     data: shipment || salesOrder,
     errors: errors.length ? errors : undefined,
     isLoading: isLabelsLoading || isConfiguringShipment || insuranceIsLoading,
+    onCreateNewShipment: createNewShipmentForNotFound,
+    shipmentId: shipmentId,
     children: element && getElement(element)
   });
 };

package/dist/esm/workflows/onboarding/components/confirmation-and-submission-step/confirmation-and-submission-step.js

@@ -71,7 +71,7 @@ const ConfirmationAndSubmissionStep = ({
       }),
       children: [jsx(CcProviderLogo, {
         provider: provider,
-        width: 36
+        width: 56
       }), jsx(Typography, {
         variant: "body2",
         children: `**** **** **** ${last4 !== null && last4 !== void 0 ? last4 : "****"}`

package/dist/esm/workflows/onboarding/components/confirmation-and-submission-step/use-confirmation-and-submission-step.js

@@ -1,8 +1,10 @@
 import { __awaiter } from '../../../../_virtual/_tslib.js';
+import { useScrubErrors } from '../../../../hooks/use-scrub-errors.js';
 import { useAddSandboxCarriers, useCreateFundingSource, useUpdateFundingSource, useRegisterCarrier } from '@shipengine/react-api';
 import { getSellerIdFromToken } from '../../../../utilities/checks.js';
 import { getDefaultWarehouse } from '../../../../utilities/shipengine/warehouses.js';
 import { useState, useCallback } from 'react';
+import { useTranslation } from 'react-i18next';
 import { useManageWarehouses } from '../../../../features/manage-warehouses/use-manage-warehouses.js';
 import { useElements } from '../../../../elements-provider/elements-context-provider.js';
 
@@ -13,6 +15,9 @@ const useConfirmationAndSubmissionStep = ({
     globalFeatures,
     getToken
   } = useElements();
+  const {
+    t
+  } = useTranslation();
   const [isSubmittingOnboarding, setIsSubmittingOnboarding] = useState(false);
   const {
     createWarehouse,
@@ -33,6 +38,15 @@ const useConfirmationAndSubmissionStep = ({
     mutateAsync: createFundingSource,
     reset: resetCreateFundingSource
   } = useCreateFundingSource();
+  const displayableCreateFundingSourceErrors = useScrubErrors({
+    errors: createFundingSourceErrors !== null && createFundingSourceErrors !== void 0 ? createFundingSourceErrors : undefined,
+    predicate: useCallback(e => e.message.includes("An unexpected error occurred."), []),
+    scrubber: useCallback(() => {
+      return `${t("common:errorMessages.fundingSourceCreationFailed", {
+        email: globalFeatures.supportEmailAddress
+      })} `;
+    }, [globalFeatures.supportEmailAddress, t])
+  });
   const {
     error: updatePaymentMethodErrors,
     isLoading: isUpdatingPaymentMethod,
@@ -294,7 +308,9 @@ const useConfirmationAndSubmissionStep = ({
     setIsSubmittingOnboarding(false);
   }), [onboardSeller, updateExistingFundingSource, onStepComplete, createFundingSourceErrors, registerCarrierErrors, updatePaymentMethodErrors, updateWarehouseErrors]);
   return {
-    createFundingSourceErrors,
+    createFundingSourceErrors: displayableCreateFundingSourceErrors === null || displayableCreateFundingSourceErrors === void 0 ? void 0 : displayableCreateFundingSourceErrors.map(message => ({
+      message
+    })),
     createOnboardingSubmissionHandler,
     isLoading: {
       connectingCarriers: isRegisteringCarriers,

package/dist/esm/workflows/onboarding/components/onboarding-wizard/onboarding-wizard.js

@@ -59,6 +59,7 @@ const OnboardingWizard = ({
     isLoadingTermsAgreementStep,
     fundingSourceRequiredTerms,
     fundingSourceMetadata,
+    hasFreeStampsConnected,
     handleSubmitTermsAgreement,
     refetchCarriers,
     refetchFundingSources,
@@ -165,8 +166,10 @@ const OnboardingWizard = ({
       return jsx(TermsAgreementStep, {
         carrierProfilesToRegister: carrierProfilesToRegister,
         enabledCarrierProfiles: enabledCarrierProfiles,
+        fundingSourceRequiredTerms: fundingSourceRequiredTerms,
         insuranceProviderProfiles: insuranceProviderProfiles,
-        onSubmit: handleSubmitTermsAgreement
+        onSubmit: handleSubmitTermsAgreement,
+        showStampsLogo: hasFreeStampsConnected
       });
     },
     label: t("onboarding:stepLabel.termsAgreement")

package/dist/esm/workflows/onboarding/components/terms-agreement-form/terms-agreement-form.js

@@ -18,6 +18,7 @@ import { SubmitButton } from '../../../../components/field/submit-button/submit-
 const TermsAgreementForm = ({
   carrierTerms,
   hideTerms,
+  requiredTerms = [],
   insuranceProviderTerms,
   isSubmitDisabled,
   onSubmit
@@ -85,32 +86,38 @@ const TermsAgreementForm = ({
           variant: "body1",
           children: t("terms.shipEngineTitle")
         }), jsx(DisplayTerm, {
-          term: {
+          terms: {
             links: [{
               link: "https://www.shipengine.com/terms-of-service/",
-              locale: "en-US",
-              title: t("onboarding:termsAndAgreementLinkText.shipEngineToS")
+              title: "ShipEngine Terms of Service",
+              locale: "en-US"
             }, {
-              link: "https://auctane.com/legal/privacy-policy/",
-              locale: "en-US",
-              title: t("onboarding:termsAndAgreementLinkText.auctanePrivacyPolicy")
+              link: "https://www.auctane.com/terms-of-service/",
+              title: "Auctane Terms of Service",
+              locale: "en-US"
+            }, {
+              link: "https://www.stamps.com/wallet-terms-of-service/",
+              title: "Stamps Wallet Terms of Service",
+              locale: "en-US"
             }]
           }
-        }), !!carrierTerms.length && jsxs(Fragment, {
+        }), requiredTerms.map(term => jsx(DisplayTerm, {
+          terms: term
+        }, term.termType)), !!carrierTerms.length && jsxs(Fragment, {
           children: [jsx(Spacer, {}), jsx(Typography, {
             bold: true,
             variant: "body1",
             children: t("terms.carriersTitle")
-          }), carrierTerms.map(term => jsx(DisplayTerm, {
-            term: term
-          }, term.termType))]
+          }), carrierTerms.map((term, idx) => jsx(DisplayTerm, {
+            terms: term
+          }, idx))]
         }), enableParcelGuard && !!insuranceProviderTerms.length && jsxs(Fragment, {
           children: [jsx(Spacer, {}), jsx(Typography, {
             bold: true,
             variant: "body1",
             children: t("terms.insuranceProvidersTitle")
           }), insuranceProviderTerms.map(term => jsx(DisplayTerm, {
-            term: term
+            terms: term
           }, term.termType))]
         })]
       }), jsx(ButtonGroup, {

package/dist/esm/workflows/onboarding/components/terms-agreement-form/terms-agreement-form.styles.js

@@ -13,9 +13,6 @@ const styles = createStyles({
     display: "inline-flex",
     fontWeight: scopeTheme(theme).typography.fontWeight.normal
   }),
-  fullWidth: {
-    width: "100%"
-  },
   termsWell: theme => ({
     backgroundColor: scopeTheme(theme).palette.gray.ultraLight,
     marginBottom: scopeTheme(theme).spacing(6),

package/dist/esm/workflows/onboarding/components/terms-agreement-step/terms-agreement-step.js

@@ -1,20 +1,24 @@
 import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
-import { InlineNotification, NotificationType, Icon, IconSize } from '@shipengine/giger';
+import { InlineNotification, NotificationType, IconSize, Icon } from '@shipengine/giger';
 import { IconNames } from '@shipengine/giger-theme';
 import { useTranslation } from 'react-i18next';
 import { styles } from './terms-agreement-step.styles.js';
 import { TermsAgreementForm } from '../terms-agreement-form/terms-agreement-form.js';
 import { useCarrierMetadata } from '../../../../features/manage-carriers/hooks/use-carrier-metadata.js';
 import { useElements } from '../../../../elements-provider/elements-context-provider.js';
+import { UPSTermsDisclosure } from '../../../../components/ups-terms-disclosure/ups-terms-disclosure.js';
 import { Spacer } from '../../../../components/spacer/spacer.js';
 import { StepHeader } from '../step-header/step-header.js';
+import { CarrierIcon } from '../../../../components/carrier-icon/carrier-icon.js';
 import { CarrierLogo } from '../../../../components/carrier-logo/carrier-logo.js';
 
 const TermsAgreementStep = ({
   carrierProfilesToRegister,
   insuranceProviderProfiles,
   onSubmit,
-  enabledCarrierProfiles
+  enabledCarrierProfiles,
+  fundingSourceRequiredTerms,
+  showStampsLogo = false
 }) => {
   var _a, _b, _c, _d, _e;
   const {
@@ -27,11 +31,17 @@ const TermsAgreementStep = ({
   } = useElements();
   const carrierFriendlyNames = useCarrierMetadata();
   const hideTerms = carrierProfilesToRegister.length === 0 && (insuranceProviderProfiles === null || insuranceProviderProfiles === void 0 ? void 0 : insuranceProviderProfiles.length) === 0;
-  const carrierTerms = carrierProfilesToRegister.flatMap(c => c.requiredTerms);
+  const carrierTerms = carrierProfilesToRegister.map(c => {
+    const disclosure = c.carrierCode === "ups_walleted" ? jsx(UPSTermsDisclosure, {}) : undefined;
+    return {
+      links: c.requiredTerms.flatMap(term => term.links),
+      disclosure
+    };
+  });
   const insuranceProviderTerms = (_a = insuranceProviderProfiles === null || insuranceProviderProfiles === void 0 ? void 0 : insuranceProviderProfiles.flatMap(p => p.terms)) !== null && _a !== void 0 ? _a : [];
   const showParcelGuard = enableParcelGuard && ((_b = insuranceProviderProfiles === null || insuranceProviderProfiles === void 0 ? void 0 : insuranceProviderProfiles.length) !== null && _b !== void 0 ? _b : 0) > 0;
   const hasInsuranceToRegister = showParcelGuard && ((_c = insuranceProviderProfiles === null || insuranceProviderProfiles === void 0 ? void 0 : insuranceProviderProfiles.length) !== null && _c !== void 0 ? _c : 0) > 0;
-  const hasEnabledCarriersConfigurationError = !enabledCarrierProfiles || (enabledCarrierProfiles === null || enabledCarrierProfiles === void 0 ? void 0 : enabledCarrierProfiles.length) === 0;
+  const hasEnabledCarriersConfigurationError = !showStampsLogo && (!enabledCarrierProfiles || (enabledCarrierProfiles === null || enabledCarrierProfiles === void 0 ? void 0 : enabledCarrierProfiles.length) === 0);
   const hasAlreadyConnectedCarriers = ((_d = enabledCarrierProfiles === null || enabledCarrierProfiles === void 0 ? void 0 : enabledCarrierProfiles.length) !== null && _d !== void 0 ? _d : 0) > 0 && carrierProfilesToRegister.length === 0 && (insuranceProviderProfiles === null || insuranceProviderProfiles === void 0 ? void 0 : insuranceProviderProfiles.length) === 0;
   const hasCarriersToRegister = ((_e = enabledCarrierProfiles === null || enabledCarrierProfiles === void 0 ? void 0 : enabledCarrierProfiles.length) !== null && _e !== void 0 ? _e : 0) > 0 && carrierProfilesToRegister.length > 0;
   // Handle case where partner has not correctly enabled carriers and there is no insurance to register
@@ -46,20 +56,33 @@ const TermsAgreementStep = ({
       children: t("errors.noCarriers.subtitle")
     });
   }
-  const renderCarrierLogos = () => {
-    if (!carrierProfilesToRegister.length) return null;
-    return carrierProfilesToRegister.map(p => {
+  const renderCarrierIcons = () => {
+    var _a;
+    const stampsCarrierProfile = {
+      carrierCode: "stamps_com",
+      carrierName: (_a = carrierFriendlyNames["stamps_com"]) === null || _a === void 0 ? void 0 : _a.name
+    };
+    let carriersToDisplay;
+    // kind of a goofy way to just display stamps/usps logo without sending it in the payload to register
+    // we don't want to register stamps as a carrier if it's not being used as the primary payment method
+    if (showStampsLogo) {
+      carriersToDisplay = [stampsCarrierProfile, ...carrierProfilesToRegister];
+    } else {
+      carriersToDisplay = carrierProfilesToRegister;
+    }
+    return carriersToDisplay.map(p => {
       var _a;
-      return jsx(CarrierLogo, {
+      return jsx(CarrierIcon, {
         carrierCode: p.carrierCode,
         carrierName: ((_a = carrierFriendlyNames[p.carrierCode]) === null || _a === void 0 ? void 0 : _a.name) || p.carrierCode,
-        size: "lg"
+        size: IconSize.SIZE_EXTRA_LARGE
       }, p.carrierCode);
     });
   };
   const renderInsuranceLogos = () => {
     if (!hasInsuranceToRegister) return null;
-    return jsxs(Fragment, {
+    return jsxs("div", {
+      css: styles.insuranceLogosContainer,
       children: [hasCarriersToRegister && jsx(Icon, {
         css: styles.plus,
         name: IconNames.PLUS,
@@ -85,13 +108,13 @@ const TermsAgreementStep = ({
       }), jsx(Spacer, {
         multiplier: 4
       })]
-    }), (hasCarriersToRegister || hasInsuranceToRegister) && jsxs(Fragment, {
+    }), (hasCarriersToRegister || hasInsuranceToRegister || showStampsLogo) && jsxs(Fragment, {
       children: [jsx(StepHeader, {
         subtitle: t("termsAgreement.subtitle"),
         title: t("termsAgreement.title")
       }), jsxs("div", {
         css: styles.carrierLogos,
-        children: [renderCarrierLogos(), renderInsuranceLogos()]
+        children: [renderCarrierIcons(), renderInsuranceLogos()]
       })]
     }), jsx("div", {
       css: styles.fullWidth,
@@ -99,7 +122,8 @@ const TermsAgreementStep = ({
         carrierTerms: carrierTerms,
         hideTerms: hideTerms,
         insuranceProviderTerms: insuranceProviderTerms,
-        onSubmit: onSubmit
+        onSubmit: onSubmit,
+        requiredTerms: fundingSourceRequiredTerms
       })
     })]
   });

package/dist/esm/workflows/onboarding/components/terms-agreement-step/terms-agreement-step.styles.js

@@ -7,7 +7,8 @@ const styles = createStyles({
     flexWrap: "wrap",
     gap: scopeTheme(theme).spacing(1),
     justifyContent: "center",
-    padding: `${scopeTheme(theme).spacing(3)}px 0`
+    alignItems: "center",
+    padding: `${scopeTheme(theme).spacing(2)}px 0`
   }),
   container: theme => ({
     alignItems: "center",
@@ -20,9 +21,14 @@ const styles = createStyles({
   fullWidth: {
     width: "100%"
   },
-  plus: () => ({
-    alignItems: "center",
-    display: "flex"
+  plus: theme => ({
+    alignSelf: "center",
+    paddingBottom: scopeTheme(theme).spacing(1)
+  }),
+  insuranceLogosContainer: theme => ({
+    display: "flex",
+    gap: scopeTheme(theme).spacing(1),
+    paddingTop: scopeTheme(theme).spacing(1)
   })
 });
 

package/dist/esm/workflows/onboarding/components/terms-agreement-step/use-terms-agreement-step.js

@@ -32,26 +32,25 @@ const useTermsAgreementStep = ({
   const fundingSourceRegion = fundingSourceMetadata === null || fundingSourceMetadata === void 0 ? void 0 : fundingSourceMetadata.defaultRegionProfile.countryCode;
   const fundingSourceCarrierProfiles = fundingSourceMetadata === null || fundingSourceMetadata === void 0 ? void 0 : fundingSourceMetadata.defaultRegionProfile.carrierProfiles;
   const carrierProfilesFilteredByRegion = filterFundingSourceCarriers(fundingSourceCarrierProfiles, fundingSourceRegion);
+  const hasFreeStampsConnected = carriers === null || carriers === void 0 ? void 0 : carriers.some(c => c.carrierCode === "stamps_com" && c.fundingSourceId === null);
   // filter carrier profiles based on enabled carriers
-  const enabledCarrierProfiles = carrierProfilesFilteredByRegion === null || carrierProfilesFilteredByRegion === void 0 ? void 0 : carrierProfilesFilteredByRegion.filter(c => enabledCarriers.includes(c.carrierCode));
+  const enabledCarrierProfiles = carrierProfilesFilteredByRegion === null || carrierProfilesFilteredByRegion === void 0 ? void 0 : carrierProfilesFilteredByRegion.filter(c => {
+    if (c.carrierCode === "stamps_com" && hasFreeStampsConnected) {
+      // if stamps_com is connected as a free account, we don't want to show it in the list of carriers to register. The funding source creation will convert it to a walleted carrier as the default carrier.
+      return false;
+    }
+    // filter out carriers that are not enabled by the feature flag
+    return enabledCarriers.includes(c.carrierCode);
+  });
   const carrierProfilesToRegister = useMemo(() => {
     if (!enabledCarrierProfiles) return [];
-    // add Stamps/USPS carrier ToS from funding source terms
-    const carrierProfiles = enabledCarrierProfiles.map(c => {
-      if (c.carrierCode === "stamps_com" && fundingSourceRequiredTerms) {
-        return Object.assign(Object.assign({}, c), {
-          requiredTerms: [...fundingSourceRequiredTerms, ...c.requiredTerms]
-        });
-      }
-      return c;
-    });
     // handle existing funding source
     const {
       fundingSourceId
     } = (fundingSources === null || fundingSources === void 0 ? void 0 : fundingSources[0]) || {};
-    if (!fundingSourceId || !carriers) return carrierProfiles;
+    if (!fundingSourceId || !carriers) return enabledCarrierProfiles;
     const connectedCarriers = carriers.filter(c => c.fundingSourceId === fundingSourceId);
-    return carrierProfiles.filter(profile => {
+    return enabledCarrierProfiles.filter(profile => {
       // filter out carriers that are already connected
       const isConnected = connectedCarriers.some(c => c.carrierCode === profile.carrierCode && c.fundingSourceId === fundingSourceId);
       // if stamps_com is enabled, and usps is connected to the funding source,
@@ -98,6 +97,7 @@ const useTermsAgreementStep = ({
     carrierProfilesToRegister,
     enabledCarrierProfiles,
     fundingSourceMetadata,
+    hasFreeStampsConnected,
     fundingSourceRequiredTerms,
     fundingSources,
     handleSubmitTermsAgreement,

package/dist/types/components/display-term/display-term.d.ts

@@ -1,6 +1,6 @@
-import type { SE } from "@shipengine/js-api";
+import type { TermsWithDisclosure } from "@types";
 export type DisplayTermProps = {
-    term: Pick<SE.MetadataRequiredTerm, "links">;
+    terms: TermsWithDisclosure;
 };
-export declare const DisplayTerm: ({ term }: DisplayTermProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const DisplayTerm: ({ terms }: DisplayTermProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=display-term.d.ts.map

package/dist/types/components/display-term/display-term.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"display-term.d.ts","sourceRoot":"","sources":["../../../../src/components/display-term/display-term.tsx"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,EAAE,EAAE,MAAM,oBAAoB,CAAC;AAM7C,MAAM,MAAM,gBAAgB,GAAG;IAC7B,IAAI,EAAE,IAAI,CAAC,EAAE,CAAC,oBAAoB,EAAE,OAAO,CAAC,CAAC;CAC9C,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,UAAU,gBAAgB,qDAuBrD,CAAC"}
+{"version":3,"file":"display-term.d.ts","sourceRoot":"","sources":["../../../../src/components/display-term/display-term.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,EAAE,mBAAmB,EAAE,MAAM,QAAQ,CAAC;AAMlD,MAAM,MAAM,gBAAgB,GAAG;IAC7B,KAAK,EAAE,mBAAmB,CAAC;CAC5B,CAAC;AAEF,eAAO,MAAM,WAAW,GAAI,WAAW,gBAAgB,qDA2BtD,CAAC"}

package/dist/types/components/field/credit-card-input/credit-card-input.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"credit-card-input.d.ts","sourceRoot":"","sources":["../../../../../src/components/field/credit-card-input/credit-card-input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAIxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAYlE,eAAO,MAAM,eAAe,EAAE,eAAe,CAAC,gBAAgB,CAwB7D,CAAC"}
+{"version":3,"file":"credit-card-input.d.ts","sourceRoot":"","sources":["../../../../../src/components/field/credit-card-input/credit-card-input.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,IAAI,gBAAgB,EAAE,MAAM,mBAAmB,CAAC;AAKxE,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,4BAA4B,CAAC;AAgBlE,eAAO,MAAM,eAAe,EAAE,eAAe,CAAC,gBAAgB,CAoC7D,CAAC"}

package/dist/types/components/field/rate-select/rate-card/rate-card.d.ts

@@ -1,5 +1,5 @@
 import type { WithCommonProps } from "@shipengine/giger";
-import type { ServicePoint } from "@shipengine/react-api";
+import type { LabelDisplayScheme, ServicePoint } from "@shipengine/react-api";
 import type { RateOption } from "@types";
 export type RateCardProps = Partial<RateOption> & WithCommonProps<{
     isAcknowledged?: boolean;
@@ -8,10 +8,12 @@ export type RateCardProps = Partial<RateOption> & WithCommonProps<{
     mapViewEnabled?: boolean;
     onClick?: (rateId: string) => void;
     onClickAcknowledgement?: (isAcknowledged: boolean) => void;
+    onPaperlessAcknowledgementChange?: (usePaperless?: boolean, labelDisplayScheme?: LabelDisplayScheme) => void;
     onSelectServicePoint?: (servicePoint?: ServicePoint) => void;
     selected?: boolean;
     selectedRateCost?: number;
     showVatFeatures?: boolean;
+    paperlessLabelChecked?: boolean;
 }>;
-export declare const RateCard: ({ carrierCode, carrierFriendlyName, carrierNickname, className, confirmationAmount, deliveryDays, insuranceAmount, isAcknowledged, messages, onClick, onClickAcknowledgement, onSelectServicePoint, otherAmount, rateId, requiresAcknowledgement, rateAcknowledgementMessage, selected, serviceCode, packageType, serviceType, shippingAmount, taxAmount, showVatFeatures, isLoading: servicePointsLoading, isPreferredRate, selectedRateCost, servicePoints, mapViewEnabled, rateDetails, }: RateCardProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const RateCard: ({ carrierCode, carrierFriendlyName, carrierNickname, className, confirmationAmount, deliveryDays, insuranceAmount, isAcknowledged, messages, onClick, onClickAcknowledgement, onPaperlessAcknowledgementChange, onSelectServicePoint, otherAmount, rateId, requiresAcknowledgement, rateAcknowledgementMessage, selected, serviceCode, packageType, serviceType, shippingAmount, taxAmount, showVatFeatures, isLoading: servicePointsLoading, isPreferredRate, selectedRateCost, servicePoints, mapViewEnabled, rateDetails, paperlessDisplaySchemes, paperlessLabelChecked, }: RateCardProps) => import("@emotion/react/jsx-runtime").JSX.Element;
 //# sourceMappingURL=rate-card.d.ts.map

package/dist/types/components/field/rate-select/rate-card/rate-card.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rate-card.d.ts","sourceRoot":"","sources":["../../../../../../src/components/field/rate-select/rate-card/rate-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGzD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC1D,OAAO,KAAK,EAAuC,UAAU,EAAE,MAAM,QAAQ,CAAC;AA4F9E,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,UAAU,CAAC,GAC7C,eAAe,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sBAAsB,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D,oBAAoB,CAAC,EAAE,CAAC,YAAY,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;CAC3B,CAAC,CAAC;AAEL,eAAO,MAAM,QAAQ,GAAI,8dA8BtB,aAAa,qDA0If,CAAC"}
+{"version":3,"file":"rate-card.d.ts","sourceRoot":"","sources":["../../../../../../src/components/field/rate-select/rate-card/rate-card.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,eAAe,EAAE,MAAM,mBAAmB,CAAC;AAGzD,OAAO,KAAK,EAAE,kBAAkB,EAAE,YAAY,EAAE,MAAM,uBAAuB,CAAC;AAC9E,OAAO,KAAK,EAAuC,UAAU,EAAE,MAAM,QAAQ,CAAC;AA2F9E,MAAM,MAAM,aAAa,GAAG,OAAO,CAAC,UAAU,CAAC,GAC7C,eAAe,CAAC;IACd,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,cAAc,CAAC,EAAE,OAAO,CAAC;IACzB,OAAO,CAAC,EAAE,CAAC,MAAM,EAAE,MAAM,KAAK,IAAI,CAAC;IACnC,sBAAsB,CAAC,EAAE,CAAC,cAAc,EAAE,OAAO,KAAK,IAAI,CAAC;IAC3D,gCAAgC,CAAC,EAAE,CACjC,YAAY,CAAC,EAAE,OAAO,EACtB,kBAAkB,CAAC,EAAE,kBAAkB,KACpC,IAAI,CAAC;IACV,oBAAoB,CAAC,EAAE,CAAC,YAAY,CAAC,EAAE,YAAY,KAAK,IAAI,CAAC;IAC7D,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,gBAAgB,CAAC,EAAE,MAAM,CAAC;IAC1B,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,qBAAqB,CAAC,EAAE,OAAO,CAAC;CACjC,CAAC,CAAC;AAEL,eAAO,MAAM,QAAQ,GAAI,gjBAiCtB,aAAa,qDAkKf,CAAC"}

package/dist/types/components/field/rate-select/rate-card/rate-card.styles.d.ts

@@ -2,10 +2,8 @@ import type { Theme } from "@emotion/react";
 export declare const getRateCardFirstLineSize: (theme: Theme) => string;
 export declare const styles: {
     acknowledgment: (theme: import("../../../../../typings/emotion").ScopedGigerTheme) => {
-        alignItems: string;
         color: string;
         display: string;
-        paddingTop: number;
     };
     divider: (theme: import("../../../../../typings/emotion").ScopedGigerTheme) => {
         borderColor: string;
@@ -27,5 +25,12 @@ export declare const styles: {
         right: number;
         top: number;
     };
+    paperlessText: (theme: import("../../../../../typings/emotion").ScopedGigerTheme) => {
+        display: string;
+        gap: number;
+        paddingTop: number;
+        color: string;
+        alignItems: string;
+    };
 };
 //# sourceMappingURL=rate-card.styles.d.ts.map

package/dist/types/components/field/rate-select/rate-card/rate-card.styles.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"rate-card.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/field/rate-select/rate-card/rate-card.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAG5C,eAAO,MAAM,wBAAwB,GAAI,OAAO,KAAK,WAA2C,CAAC;AAEjG,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2BjB,CAAC"}
+{"version":3,"file":"rate-card.styles.d.ts","sourceRoot":"","sources":["../../../../../../src/components/field/rate-select/rate-card/rate-card.styles.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,gBAAgB,CAAC;AAG5C,eAAO,MAAM,wBAAwB,GAAI,OAAO,KAAK,WAA2C,CAAC;AAEjG,eAAO,MAAM,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAgCjB,CAAC"}