@shipengine/elements 2.28.0 → 2.29.1

package/dist/cjs/components/grid-controller/index.cjs

@@ -1,13 +1,13 @@
 'use strict';
 
-var gridController = require('./grid-controller.cjs');
 var cellFormattedDate = require('./cell-formatted-date.cjs');
+var gridController = require('./grid-controller.cjs');
 var gridFooter = require('./grid-footer.cjs');
 var sortableHeader = require('./sortable-header/sortable-header.cjs');
 
 
 
-exports.GridController = gridController.GridController;
 exports.CellFormattedDate = cellFormattedDate.CellFormattedDate;
+exports.GridController = gridController.GridController;
 exports.GridFooter = gridFooter.GridFooter;
 exports.SortableHeader = sortableHeader.SortableHeader;

package/dist/cjs/components/grid-filters/components/index.cjs

@@ -1,15 +1,15 @@
 'use strict';
 
-var shipmentIdFilter = require('./shipment-id-filter/shipment-id-filter.cjs');
 var createdDateFilter = require('./created-date-filter/created-date-filter.cjs');
 var labelIdFilter = require('./label-id-filter/label-id-filter.cjs');
 var labelStatusFilter = require('./label-status-filter/label-status-filter.cjs');
+var shipmentIdFilter = require('./shipment-id-filter/shipment-id-filter.cjs');
 var trackingStatusFilter = require('./tracking-status-filter/tracking-status-filter.cjs');
 
 
 
-exports.ShipmentIdFilter = shipmentIdFilter.ShipmentIdFilter;
 exports.CreatedDateFilter = createdDateFilter.CreatedDateFilter;
 exports.LabelIdFilter = labelIdFilter.LabelIdFilter;
 exports.LabelStatusFilter = labelStatusFilter.LabelStatusFilter;
+exports.ShipmentIdFilter = shipmentIdFilter.ShipmentIdFilter;
 exports.TrackingStatusFilter = trackingStatusFilter.TrackingStatusFilter;

package/dist/cjs/components/grid-filters/components/label-id-filter/label-id-filter.cjs

@@ -9,8 +9,8 @@ var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactI18next = require('react-i18next');
 var reactUse = require('react-use');
-var labelIdFilterShema = require('./label-id-filter-shema.cjs');
 var labelIdFilter_styles = require('./label-id-filter.styles.cjs');
+var labelIdFilterShema = require('./label-id-filter-shema.cjs');
 var textInput = require('../../../field/text-input/text-input.cjs');
 var submitButton = require('../../../field/submit-button/submit-button.cjs');
 

package/dist/cjs/components/grid-filters/components/label-status-filter/label-status-filter.cjs

@@ -8,8 +8,8 @@ var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactI18next = require('react-i18next');
 var reactUse = require('react-use');
-var labelStatusFilterSchema = require('./label-status-filter-schema.cjs');
 var labelStatusFilter_styles = require('./label-status-filter.styles.cjs');
+var labelStatusFilterSchema = require('./label-status-filter-schema.cjs');
 
 function _interopNamespaceDefault(e) {
   var n = Object.create(null);

package/dist/cjs/components/grid-filters/components/shipment-id-filter/shipment-id-filter.cjs

@@ -9,8 +9,8 @@ var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactI18next = require('react-i18next');
 var reactUse = require('react-use');
-var shipmentIdFilterShema = require('./shipment-id-filter-shema.cjs');
 var shipmentIdFilter_styles = require('./shipment-id-filter.styles.cjs');
+var shipmentIdFilterShema = require('./shipment-id-filter-shema.cjs');
 var textInput = require('../../../field/text-input/text-input.cjs');
 var submitButton = require('../../../field/submit-button/submit-button.cjs');
 

package/dist/cjs/components/grid-filters/components/tracking-status-filter/tracking-status-filter.cjs

@@ -8,8 +8,8 @@ var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactI18next = require('react-i18next');
 var reactUse = require('react-use');
-var trackingStatusFilterSchema = require('./tracking-status-filter-schema.cjs');
 var trackingStatusFilter_styles = require('./tracking-status-filter.styles.cjs');
+var trackingStatusFilterSchema = require('./tracking-status-filter-schema.cjs');
 var checkboxInput = require('../../../field/checkbox-input/checkbox-input.cjs');
 var spacer = require('../../../spacer/spacer.cjs');
 

package/dist/cjs/components/history/history-card/history-card.cjs

@@ -8,8 +8,8 @@ var React = require('react');
 var reactI18next = require('react-i18next');
 var funding = require('../../../assets/funding.svg.cjs');
 var historyCard_styles = require('./history-card.styles.cjs');
-var elementsContextProvider = require('../../../elements-provider/elements-context-provider.cjs');
 var label = require('./label/label.cjs');
+var elementsContextProvider = require('../../../elements-provider/elements-context-provider.cjs');
 
 const HistoryCard = ({
   transaction,

package/dist/cjs/components/modal/index.cjs

@@ -1,11 +1,11 @@
 'use strict';
 
-var modalContainer = require('./modal-container.cjs');
 var modal = require('./modal.cjs');
+var modalContainer = require('./modal-container.cjs');
 
 
 
+exports.Modal = modal.Modal;
 exports.ModalContainer = modalContainer.ModalContainer;
 exports.ModalContext = modalContainer.ModalContext;
 exports.useModal = modalContainer.useModal;
-exports.Modal = modal.Modal;

package/dist/cjs/components/modal/modal.cjs

@@ -4,8 +4,8 @@ var _tslib = require('../../_virtual/_tslib.cjs');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 var giger = require('@shipengine/giger');
 var gigerTheme = require('@shipengine/giger-theme');
-var modalContainer = require('./modal-container.cjs');
 var modal_styles = require('./modal.styles.cjs');
+var modalContainer = require('./modal-container.cjs');
 
 const Modal = ({
   children,

package/dist/cjs/components/payment/payment-method-selector/index.cjs

@@ -0,0 +1,7 @@
+'use strict';
+
+var paymentMethodSelector = require('./payment-method-selector.cjs');
+
+
+
+exports.PaymentMethodSelector = paymentMethodSelector.PaymentMethodSelector;

package/dist/cjs/components/payment/payment-method-selector/payment-method-selector.cjs

@@ -0,0 +1,55 @@
+'use strict';
+
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var giger = require('@shipengine/giger');
+var gigerTheme = require('@shipengine/giger-theme');
+var reactI18next = require('react-i18next');
+var paymentMethodSelector_styles = require('./payment-method-selector.styles.cjs');
+
+const PaymentMethodSelector = ({
+  name = "paymentMethod",
+  onChange,
+  payByBankEnabled = false,
+  value
+}) => {
+  const {
+    t
+  } = reactI18next.useTranslation("register-wallet");
+  const paymentMethods = [{
+    value: "credit_card",
+    icon: gigerTheme.IconNames.CREDIT_CARD,
+    label: t("sections.paymentMethod.creditCard")
+  }, payByBankEnabled ? {
+    value: "pay_by_bank_us",
+    icon: gigerTheme.IconNames.BANK,
+    label: t("sections.paymentMethod.payByBank")
+  } : undefined];
+  return jsxRuntime.jsx("div", {
+    css: paymentMethodSelector_styles.styles.paymentMethodSelector,
+    children: jsxRuntime.jsx(giger.RadioGroup, {
+      name: name,
+      onChange: e => onChange(e.target.value),
+      value: value,
+      children: paymentMethods.map(method => {
+        return method !== undefined ? jsxRuntime.jsx("div", {
+          css: [paymentMethodSelector_styles.styles.paymentMethodOption, value === method.value && paymentMethodSelector_styles.styles.paymentMethodOptionSelected],
+          onClick: () => onChange(method.value),
+          children: jsxRuntime.jsx(giger.Radio, {
+            checked: value === method.value,
+            readOnly: true,
+            value: method.value,
+            children: jsxRuntime.jsxs("div", {
+              css: paymentMethodSelector_styles.styles.paymentMethodOptionContent,
+              children: [jsxRuntime.jsx(giger.Icon, {
+                name: method.icon,
+                size: giger.IconSize.SIZE_SMALL
+              }), method.label]
+            })
+          })
+        }, method.value) : null;
+      })
+    })
+  });
+};
+
+exports.PaymentMethodSelector = PaymentMethodSelector;

package/dist/cjs/components/payment/payment-method-selector/payment-method-selector.styles.cjs

@@ -0,0 +1,58 @@
+'use strict';
+
+var styles$1 = require('../../../utilities/styles.cjs');
+
+const styles = styles$1.createStyles({
+  paymentMethodSelector: () => ({
+    display: "flex",
+    flexDirection: "column",
+    gap: "12px",
+    "& .giger-radio-group": {
+      display: "flex",
+      flexDirection: "column",
+      gap: "12px"
+    }
+  }),
+  paymentMethodOption: theme => ({
+    padding: styles$1.scopeTheme(theme).spacing(2),
+    border: `1px solid ${styles$1.scopeTheme(theme).palette.gray.light}`,
+    borderRadius: styles$1.scopeTheme(theme).spacing(),
+    background: styles$1.scopeTheme(theme).palette.white,
+    marginBottom: styles$1.scopeTheme(theme).spacing(1),
+    transition: "all 0.2s ease",
+    cursor: "pointer",
+    "&:hover": {
+      borderColor: styles$1.scopeTheme(theme).palette.primary.main
+    },
+    "& .giger-radio": {
+      margin: 0,
+      width: "100%",
+      pointerEvents: "none",
+      // Disable pointer events on radio to let div handle clicks
+      "& .giger-radio__container": {
+        width: "100%",
+        justifyContent: "flex-start"
+      },
+      "& .giger-radio__label": {
+        fontWeight: 500,
+        marginLeft: styles$1.scopeTheme(theme).spacing(1),
+        flex: 1,
+        cursor: "pointer"
+      },
+      "& .giger-radio__input": {
+        pointerEvents: "auto" // Re-enable pointer events on the actual input
+      }
+    }
+  }),
+  paymentMethodOptionSelected: theme => ({
+    borderColor: styles$1.scopeTheme(theme).palette.primary.main,
+    backgroundColor: styles$1.scopeTheme(theme).palette.gray.megaLight
+  }),
+  paymentMethodOptionContent: () => ({
+    display: "flex",
+    alignItems: "center",
+    gap: "8px"
+  })
+});
+
+exports.styles = styles;

package/dist/cjs/components/wallet-card/wallet-card.cjs

@@ -4,8 +4,8 @@ var jsxRuntime = require('@emotion/react/jsx-runtime');
 var giger = require('@shipengine/giger');
 var reactI18next = require('react-i18next');
 var walletCard_styles = require('./wallet-card.styles.cjs');
-var ccProviderLogo = require('../cc-provider-logo/cc-provider-logo.cjs');
 var settingsCard = require('../settings-card/settings-card.cjs');
+var ccProviderLogo = require('../cc-provider-logo/cc-provider-logo.cjs');
 
 const WalletCard = ({
   fundingSource,

package/dist/cjs/contexts/auctane-pay-session-context.cjs

@@ -0,0 +1,158 @@
+'use strict';
+
+var _tslib = require('../_virtual/_tslib.cjs');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var reactApi = require('@shipengine/react-api');
+var React = require('react');
+
+const SESSION_STORAGE_KEY = "auctane_pay_session";
+const storeSession = (session, expiresAt) => {
+  try {
+    const data = {
+      session,
+      expiresAt
+    };
+    sessionStorage.setItem(SESSION_STORAGE_KEY, JSON.stringify(data));
+  } catch (error) {
+    console.warn("Failed to store session in sessionStorage:", error);
+  }
+};
+const retrieveStoredSession = () => {
+  try {
+    const stored = sessionStorage.getItem(SESSION_STORAGE_KEY);
+    if (!stored) return null;
+    const data = JSON.parse(stored);
+    return data;
+  } catch (error) {
+    console.warn("Failed to retrieve session from sessionStorage:", error);
+    return null;
+  }
+};
+const clearStoredSession = () => {
+  try {
+    sessionStorage.removeItem(SESSION_STORAGE_KEY);
+  } catch (error) {
+    console.warn("Failed to clear session from sessionStorage:", error);
+  }
+};
+const AuctanePaySessionContext = /*#__PURE__*/React.createContext(undefined);
+/**
+ * Provider that manages Adyen payment session creation and redirect handling.
+ * Each call to getSessionData() creates a fresh session - sessions are not cached
+ * to avoid reusing sessions after authorization.
+ *
+ * @example
+ * ```tsx
+ * <AuctanePaySessionProvider paymentPreferences={["add_funds", "subscription"]}>
+ *   <OnboardingWizard>
+ *     <FundingStep />
+ *   </OnboardingWizard>
+ * </AuctanePaySessionProvider>
+ * ```
+ */
+const AuctanePaySessionProvider = ({
+  children,
+  paymentPreferences = ["add_funds", "subscription"],
+  returnUrl
+}) => {
+  const [sessionError, setSessionError] = React.useState(null);
+  // Track the last created session for saveSessionForRedirect
+  const lastSessionRef = React.useRef(null);
+  const {
+    mutateAsync: createAdyenSession,
+    isLoading: isCreating
+  } = reactApi.useCreateAuctanePaySession();
+  const createSession = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    try {
+      setSessionError(null);
+      const cleanUrl = returnUrl || `${window.location.origin}${window.location.pathname}`;
+      const session = yield createAdyenSession({
+        paymentPreferences,
+        returnUrl: cleanUrl
+      });
+      if (session) {
+        const expiresAt = new Date(session.metadata.adyenExpiration).getTime();
+        lastSessionRef.current = {
+          session,
+          expiresAt
+        };
+      }
+      return session;
+    } catch (err) {
+      const error = err instanceof Error ? err : new Error("Failed to create Adyen session");
+      setSessionError(error);
+      throw error;
+    }
+  }), [createAdyenSession, paymentPreferences, returnUrl]);
+  const getSessionData = React.useCallback(() => _tslib.__awaiter(void 0, void 0, void 0, function* () {
+    // Always create a fresh session to avoid reusing sessions after authorization
+    return createSession();
+  }), [createSession]);
+  const clearSession = React.useCallback(() => {
+    lastSessionRef.current = null;
+    setSessionError(null);
+    clearStoredSession();
+  }, []);
+  const saveSessionForRedirect = React.useCallback(() => {
+    if (lastSessionRef.current) {
+      storeSession(lastSessionRef.current.session, lastSessionRef.current.expiresAt);
+    }
+  }, []);
+  const restoreSessionAfterRedirect = React.useCallback(() => {
+    const storedData = retrieveStoredSession();
+    if (!storedData) {
+      return null;
+    }
+    // Check if session is still valid
+    if (Date.now() >= storedData.expiresAt) {
+      clearStoredSession();
+      return null;
+    }
+    // Update lastSessionRef so saveSessionForRedirect can work if needed
+    lastSessionRef.current = storedData;
+    // Clear from storage after restoring (single-use)
+    clearStoredSession();
+    return storedData.session;
+  }, []);
+  const value = React.useMemo(() => ({
+    isCreating,
+    sessionError,
+    getSessionData,
+    clearSession,
+    saveSessionForRedirect,
+    restoreSessionAfterRedirect
+  }), [isCreating, sessionError, getSessionData, clearSession, saveSessionForRedirect, restoreSessionAfterRedirect]);
+  return jsxRuntime.jsx(AuctanePaySessionContext.Provider, {
+    value: value,
+    children: children
+  });
+};
+/**
+ * Hook to access the Adyen payment session context
+ *
+ * @throws Error if used outside of AuctanePaySessionProvider
+ *
+ * @example
+ * ```tsx
+ * const WalletForm = () => {
+ *   const { getSessionData, sessionData } = useAuctanePaySession();
+ *
+ *   const { adyenRef, submit } = useFinancialService({
+ *     getAdyenSessionData: getSessionData,  // Uses cached session!
+ *     paymentMethod: "credit_card",
+ *   });
+ *
+ *   return <div ref={adyenRef} />;
+ * };
+ * ```
+ */
+const useAuctanePaySession = () => {
+  const context = React.useContext(AuctanePaySessionContext);
+  if (!context) {
+    throw new Error("useAuctanePaySession must be used within AuctanePaySessionProvider");
+  }
+  return context;
+};
+
+exports.AuctanePaySessionProvider = AuctanePaySessionProvider;
+exports.useAuctanePaySession = useAuctanePaySession;

package/dist/cjs/contexts/index.cjs

@@ -0,0 +1,8 @@
+'use strict';
+
+var auctanePaySessionContext = require('./auctane-pay-session-context.cjs');
+
+
+
+exports.AuctanePaySessionProvider = auctanePaySessionContext.AuctanePaySessionProvider;
+exports.useAuctanePaySession = auctanePaySessionContext.useAuctanePaySession;

package/dist/cjs/create-element/element/element.cjs

@@ -6,8 +6,8 @@ var cx = require('classnames');
 var React = require('react');
 var reactI18next = require('react-i18next');
 var errorBoundary = require('../error-boundary/error-boundary.cjs');
-var useI18n = require('./hooks/use-i18n.cjs');
 var elementsContextProvider = require('../../elements-provider/elements-context-provider.cjs');
+var useI18n = require('./hooks/use-i18n.cjs');
 
 const Element = ({
   children,

package/dist/cjs/elements/customs-form/customs-form-element.stories.cjs

@@ -4,10 +4,10 @@ Object.defineProperty(exports, '__esModule', { value: true });
 
 var _tslib = require('../../_virtual/_tslib.cjs');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
-var addonActions = require('@storybook/addon-actions');
 var reactApi = require('@shipengine/react-api');
-var customsFormElement = require('./customs-form-element.cjs');
+var addonActions = require('@storybook/addon-actions');
 var shipment = require('../../factories/shipengine/shipment.cjs');
+var customsFormElement = require('./customs-form-element.cjs');
 
 var customsFormElement_stories = {
   title: "Label Workflow/Nested Elements/CustomsForm Element",

package/dist/cjs/elements/index.cjs

@@ -1,43 +1,43 @@
 'use strict';
 
+var carrierServices = require('../workflows/carrier-services/carrier-services.cjs');
+var customsFormElement = require('./customs-form/customs-form-element.cjs');
+var customsFormTypes = require('./customs-form/customs-form-types.cjs');
+var labelsGrid = require('./labels-grid/labels-grid.cjs');
 var manageCarriers = require('./manage-carriers/manage-carriers.cjs');
+var manageExternalCarriers = require('./manage-external-carriers/manage-external-carriers.cjs');
+var manageFundingElement = require('./manage-funding/manage-funding-element.cjs');
 var manageWarehouses = require('./manage-warehouses/manage-warehouses.cjs');
+var paymentMethodSettingsElement = require('./payment-method-settings/payment-method-settings-element.cjs');
 var purchaseLabel = require('./purchase-label/purchase-label.cjs');
-var manageExternalCarriers = require('./manage-external-carriers/manage-external-carriers.cjs');
-var labelsGrid = require('./labels-grid/labels-grid.cjs');
+var selectLabelLayoutElement = require('./select-label-layout/select-label-layout-element.cjs');
+var shipmentSummary = require('./shipment-summary/shipment-summary.cjs');
 var shipmentsGrid = require('./shipments-grid/shipments-grid.cjs');
 var themeCreator = require('./theme-creator/theme-creator.cjs');
 var themeCreatorProvider = require('./theme-creator/theme-creator-provider.cjs');
-var shipmentSummary = require('./shipment-summary/shipment-summary.cjs');
-var voidLabel = require('./void-label/void-label.cjs');
-var unitSettingsElement = require('./unit-settings/unit-settings-element.cjs');
-var manageFundingElement = require('./manage-funding/manage-funding-element.cjs');
-var selectLabelLayoutElement = require('./select-label-layout/select-label-layout-element.cjs');
-var paymentMethodSettingsElement = require('./payment-method-settings/payment-method-settings-element.cjs');
-var carrierServices = require('../workflows/carrier-services/carrier-services.cjs');
 var transactionHistoryElement = require('./transaction-history/transaction-history-element.cjs');
-var customsFormElement = require('./customs-form/customs-form-element.cjs');
-var customsFormTypes = require('./customs-form/customs-form-types.cjs');
+var unitSettingsElement = require('./unit-settings/unit-settings-element.cjs');
+var voidLabel = require('./void-label/void-label.cjs');
 
 
 
+exports.CarrierServices = carrierServices;
+exports.CustomsForm = customsFormElement;
+exports.extractCustomsFormData = customsFormTypes.extractCustomsFormData;
+exports.getDefaultCustomsFormValues = customsFormTypes.getDefaultCustomsFormValues;
+exports.LabelsGrid = labelsGrid;
 exports.ManageCarriers = manageCarriers;
+exports.ManageExternalCarriers = manageExternalCarriers;
+exports.ManageFunding = manageFundingElement;
 exports.ManageWarehouses = manageWarehouses;
+exports.PaymentMethodSettings = paymentMethodSettingsElement;
 exports.PurchaseLabel = purchaseLabel;
-exports.ManageExternalCarriers = manageExternalCarriers;
-exports.LabelsGrid = labelsGrid;
+exports.SelectLabelLayout = selectLabelLayoutElement;
+exports.ShipmentSummary = shipmentSummary;
 exports.ShipmentsGrid = shipmentsGrid;
 exports.ThemeCreator = themeCreator;
 exports.ThemeCreatorProvider = themeCreatorProvider.ThemeCreatorProvider;
 exports.useThemeCreator = themeCreatorProvider.useThemeCreator;
-exports.ShipmentSummary = shipmentSummary;
-exports.VoidLabel = voidLabel;
-exports.UnitSettings = unitSettingsElement;
-exports.ManageFunding = manageFundingElement;
-exports.SelectLabelLayout = selectLabelLayoutElement;
-exports.PaymentMethodSettings = paymentMethodSettingsElement;
-exports.CarrierServices = carrierServices;
 exports.TransactionHistory = transactionHistoryElement;
-exports.CustomsForm = customsFormElement;
-exports.extractCustomsFormData = customsFormTypes.extractCustomsFormData;
-exports.getDefaultCustomsFormValues = customsFormTypes.getDefaultCustomsFormValues;
+exports.UnitSettings = unitSettingsElement;
+exports.VoidLabel = voidLabel;

package/dist/cjs/elements/labels-grid/labels-grid.cjs

@@ -15,12 +15,12 @@ var errorState = require('../../components/error-state/error-state.cjs');
 var gridController = require('../../components/grid-controller/grid-controller.cjs');
 var gridFooter = require('../../components/grid-controller/grid-footer.cjs');
 var gridFilters = require('../../components/grid-filters/grid-filters.cjs');
+var poweredByShipengine = require('../../components/powered-by-shipengine/powered-by-shipengine.cjs');
 var cellFormattedDate = require('../../components/grid-controller/cell-formatted-date.cjs');
 var index = require('../../locales/en/index.cjs');
 var createElement = require('../../create-element/create-element.cjs');
 var elementsContextProvider = require('../../elements-provider/elements-context-provider.cjs');
 var spacer = require('../../components/spacer/spacer.cjs');
-var poweredByShipengine = require('../../components/powered-by-shipengine/powered-by-shipengine.cjs');
 var errorFallback = require('../../components/error-fallback/error-fallback.cjs');
 var carrierIcon = require('../../components/carrier-icon/carrier-icon.cjs');
 

package/dist/cjs/elements/manage-carriers/manage-carriers.cjs

@@ -4,10 +4,10 @@ var _tslib = require('../../_virtual/_tslib.cjs');
 var jsxRuntime = require('@emotion/react/jsx-runtime');
 var reactApi = require('@shipengine/react-api');
 var React = require('react');
+var index = require('../../locales/en/index.cjs');
 var createElement = require('../../create-element/create-element.cjs');
 var manageCarriers = require('../../features/manage-carriers/manage-carriers.cjs');
 var errorFallback = require('../../components/error-fallback/error-fallback.cjs');
-var index = require('../../locales/en/index.cjs');
 
 /**
  * # Manage-Carriers Element

package/dist/cjs/elements/manage-external-carriers/manage-external-carriers.cjs

@@ -31,11 +31,13 @@ var errorFallback = require('../../components/error-fallback/error-fallback.cjs'
  * @see {@link AccountSettings.Element | The `<AccountSettings />` component renders the `<ManageExternalCarriers />` component}
  */
 const Component = ({
-  isModalFullScreen
+  isModalFullScreen,
+  onCarrierConnected
 }) => {
   const props = _tslib.__rest(useManageExternalCarriers.useManageExternalCarriers(), []);
   return jsxRuntime.jsx(manageExternalCarriers.ExternalCarriers, Object.assign({
-    isModalFullScreen: isModalFullScreen
+    isModalFullScreen: isModalFullScreen,
+    onCarrierConnected: onCarrierConnected
   }, props));
 };
 const Element = createElement.createElement(Component, errorFallback.ErrorFallback, {

package/dist/cjs/elements/purchase-label/components/customs-forms/customs-forms.cjs

@@ -10,10 +10,10 @@ var windsorFramework = require('./windsor-framework/windsor-framework.cjs');
 var shipment = require('../../../../utilities/shipengine/shipment.cjs');
 var useCustomsContentsOptions = require('../../hooks/use-customs-contents-options.cjs');
 var useCustomsNonDeliveryOptions = require('../../hooks/use-customs-non-delivery-options.cjs');
+var section = require('../../../../components/section/section.cjs');
 var productsDisplay = require('./products-display/products-display.cjs');
 var taxIds = require('./tax-ids/tax-ids.cjs');
 var canadaDdp = require('../../../../types/canada-ddp.cjs');
-var section = require('../../../../components/section/section.cjs');
 var select = require('../../../../components/field/select/select.cjs');
 var spacer = require('../../../../components/spacer/spacer.cjs');
 

package/dist/cjs/elements/purchase-label/components/customs-forms/product-form/product-form.cjs

@@ -11,8 +11,8 @@ var validation = require('../../../../../utilities/validation.cjs');
 var React = require('react');
 var reactHookForm = require('react-hook-form');
 var reactI18next = require('react-i18next');
-var productFormSchema = require('./product-form-schema.cjs');
 var productForm_styles = require('./product-form.styles.cjs');
+var productFormSchema = require('./product-form-schema.cjs');
 var textArea = require('../../../../../components/field/text-area/text-area.cjs');
 var textInput = require('../../../../../components/field/text-input/text-input.cjs');
 var inputGroup = require('../../../../../components/field/input-group/input-group.cjs');

package/dist/cjs/elements/purchase-label/components/rate-form/rate-form.cjs

@@ -11,12 +11,12 @@ var reactI18next = require('react-i18next');
 var rateSchema = require('./rate-schema.cjs');
 var rateView = require('./rate-view.cjs');
 var useRateOptions = require('../../hooks/use-rate-options.cjs');
-var section = require('../../../../components/section/section.cjs');
 var fundAndPurchase = require('../fund-and-purchase/fund-and-purchase.cjs');
-var poweredByShipengine = require('../../../../components/powered-by-shipengine/powered-by-shipengine.cjs');
 var elementsContextProvider = require('../../../../elements-provider/elements-context-provider.cjs');
+var section = require('../../../../components/section/section.cjs');
 var selectLabelLayout = require('../../../../features/select-label-layout/select-label-layout.cjs');
 var spacer = require('../../../../components/spacer/spacer.cjs');
+var poweredByShipengine = require('../../../../components/powered-by-shipengine/powered-by-shipengine.cjs');
 
 const RateForm = ({
   carriers,