@shipengine/elements 0.37.3 → 0.37.12

package/index.cjs

@@ -4536,8 +4536,7 @@ const useShipmentMetadata = shipment => {
 };
 
 let _$2 = t => t,
-  _t$2,
-  _t2$2;
+  _t$2;
 const findGenericPackageFromCarriers = carriers => {
   const carrier = carriers.find(c => c.packages.some(p => p.packageCode === "package"));
   return carrier === null || carrier === void 0 ? void 0 : carrier.packages.find(p => p.packageCode === "package");
@@ -4564,17 +4563,14 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
       [c.carrierCode]: partialResults[c.carrierCode] === undefined
     }));
     const genericPackage = findGenericPackageFromCarriers(carriers);
-    const packageOptions = [...(genericPackage ? [{
-      label: t(_t$2 || (_t$2 = _$2`packageCategories.browseRates`)),
-      options: [{
+    const customPackageOptions = [...(genericPackage || (customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? [{
+      label: t(_t$2 || (_t$2 = _$2`packageCategories.customPackages`)),
+      options: [...(genericPackage ? [{
         label: t("packageCodes.package"),
         value: {
           code: "package"
         }
-      }]
-    }] : []), ...((customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? [{
-      label: t(_t2$2 || (_t2$2 = _$2`packageCategories.myCustomPackages`)),
-      options: customPackageTypes.sort((a, b) => a.name.localeCompare(b.name)).map(({
+      }] : []), ...((customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? customPackageTypes.sort((a, b) => a.name.localeCompare(b.name)).map(({
         dimensions,
         name,
         packageId
@@ -4585,7 +4581,7 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
             code: packageId
           }
         };
-      })
+      }) : [])]
     }] : [])];
     return carriers.reduce((options, carrier) => {
       if (carrier.packages.length === 0) return options;
@@ -4606,7 +4602,7 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
         })),
         value: carrier.carrierId
       }];
-    }, packageOptions);
+    }, customPackageOptions);
   }, [carriers, customPackageTypes, isPoBox, isUnsupportedUpsCountry, t]);
 };
 
@@ -14663,6 +14659,7 @@ const RateForm = ({
   carriers,
   disabled,
   displayableRateErrors,
+  displayableSaveRateErrors,
   errors,
   features,
   isLoading,
@@ -14795,6 +14792,12 @@ const RateForm = ({
         title: "errorTypes.rateInvalid"
       };
     }
+    if (displayableSaveRateErrors === null || displayableSaveRateErrors === void 0 ? void 0 : displayableSaveRateErrors.length) {
+      return {
+        messages: displayableSaveRateErrors,
+        title: "errorTypes.saveRate"
+      };
+    }
     if (labelErrors === null || labelErrors === void 0 ? void 0 : labelErrors.length) {
       return {
         messages: labelErrors,
@@ -14802,7 +14805,7 @@ const RateForm = ({
       };
     }
     return undefined;
-  }, [rateOptions, labelErrors, displayableRateErrors, outOfBandDisplayableErrors]);
+  }, [displayableRateErrors, outOfBandDisplayableErrors, rateOptions.length, displayableSaveRateErrors, labelErrors]);
   return jsxRuntime.jsxs("form", Object.assign({
     id: "rate-form",
     onSubmit: handleSubmit,
@@ -14911,15 +14914,29 @@ const SuspendSalesOrder = ({
 };
 
 const styles$2 = createStyles({
+  itemDescription: theme => ({
+    display: "flex",
+    flexDirection: "column",
+    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0)}px ${theme.spacing(0)}px`
+  }),
   itemDetail: theme => ({
-    padding: `${theme.spacing(0)}px ${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0)}px`
+    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0.5)}px ${theme.spacing(0)}px`,
+    verticalAlign: "top"
   }),
   itemName: theme => ({
-    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0.5)}px ${theme.spacing(0)}px`
+    // Set item name to max 3 lines and truncate with ellipsis
+    "-webkit-box-orient": "vertical",
+    "-webkit-line-clamp": "3",
+    display: "-webkit-box",
+    lineHeight: `${theme.spacing(2.5)}px`,
+    maxHeight: `${theme.spacing(7.5)}px`,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "normal"
   }),
   numericCell: () => ({
     textAlign: "right",
-    width: "100px"
+    width: "80px"
   }),
   tableWrapper: theme => ({
     "&& > div": {
@@ -14978,23 +14995,18 @@ const ItemsBreakdown = ({
           quantity,
           value,
           totalValue
-        }, index) => jsxRuntime.jsxs(React.Fragment, {
-          children: [jsxRuntime.jsx(giger.TableBaseRow, {
-            children: jsxRuntime.jsx(giger.TableBodyCell, Object.assign({
-              colSpan: 4,
-              css: styles$2.itemName
+        }, index) => jsxRuntime.jsx(React.Fragment, {
+          children: jsxRuntime.jsxs(giger.TableBaseRow, {
+            children: [jsxRuntime.jsxs(giger.TableBodyCell, Object.assign({
+              css: styles$2.itemDescription
             }, {
-              children: jsxRuntime.jsx(giger.Typography, {
+              children: [jsxRuntime.jsx(giger.Typography, Object.assign({
+                css: styles$2.itemName
+              }, {
                 children: name
-              })
-            }))
-          }), jsxRuntime.jsxs(giger.TableBaseRow, {
-            children: [jsxRuntime.jsx(giger.TableBodyCell, Object.assign({
-              css: styles$2.itemDetail
-            }, {
-              children: jsxRuntime.jsx(giger.Typography, {
+              })), jsxRuntime.jsx(giger.Typography, {
                 children: detail
-              })
+              })]
             })), jsxRuntime.jsx(giger.TableBodyCell, Object.assign({
               css: [styles$2.numericCell, styles$2.itemDetail]
             }, {
@@ -15008,7 +15020,7 @@ const ItemsBreakdown = ({
             }, {
               children: totalValue && formatMoney(totalValue)
             }))]
-          })]
+          })
         }, index))
       })
     }))
@@ -16005,6 +16017,7 @@ const ShipmentForm = ({
           }, {
             children: presetCategory.options.map(preset => jsxRuntime.jsx(giger.Option, Object.assign({
               onClick: () => {
+                onDirty(); // bypass rate cache
                 handleApplyPreset(preset.value);
               },
               selected: ___default["default"].isEqual(selectedPreset, preset.value),
@@ -16901,7 +16914,8 @@ var common = {
 			warehouses: "Unable to load warehouses"
 		},
 		unknown: "Oops! Something went wrong.",
-		noRatesAvailable: "No rates available for this shipment. Please check your shipment configuration."
+		noRatesAvailable: "No rates available for this shipment. Please check your shipment configuration.",
+		saveRateError: "An error occurred while attempting to save your rate. Please try again later or save a different rate option."
 	},
 	errorTypes: {
 		accountStatus: "Account status error",
@@ -16909,6 +16923,7 @@ var common = {
 		integrations: "Integrations error",
 		purchase: "Purchase error",
 		rateInvalid: "Invalid rate configuration",
+		saveRate: "Error saving rate",
 		security: "Security error",
 		shipmentStatus: "Shipment status error",
 		system: "System error",
@@ -16949,8 +16964,7 @@ var common = {
 		december: "December"
 	},
 	packageCategories: {
-		browseRates: "Browse Rates",
-		myCustomPackages: "My Custom Packages"
+		customPackages: "Custom Packages"
 	},
 	packageCodes: {
 		"package": "Custom"
@@ -18190,11 +18204,14 @@ const useRatesForm = ({
     carrierId,
     serviceCode
   }) => __awaiter(void 0, void 0, void 0, function* () {
+    var _d, _e;
     if (!shipment) throw new Error("shipment not found");
+    // clear any errors before attempting to save
+    setBeforeSaveError(undefined);
     try {
       const beforeSaveResponse = yield onBeforeRateSaved === null || onBeforeRateSaved === void 0 ? void 0 : onBeforeRateSaved(carrierId, serviceCode);
       let updatedShipment;
-      if (!beforeSaveResponse) {
+      if (!beforeSaveResponse || Object.keys(beforeSaveResponse).length === 0) {
         updatedShipment = yield updateShipment(Object.assign(Object.assign({}, shipment), {
           carrierId,
           serviceCode,
@@ -18227,24 +18244,34 @@ const useRatesForm = ({
         return;
       }
     } catch (e) {
-      setBeforeSaveError({
-        errorCode: "unknown",
-        errorSource: "client",
-        errorType: "unknown",
-        message: e.message
-      });
+      if (Array.isArray(e)) {
+        if (e[0] instanceof alchemy.SE.CodedError) setBeforeSaveError(e[0]);else setBeforeSaveError({
+          errorCode: "unknown",
+          errorSource: "client",
+          errorType: "unknown",
+          message: (_d = e[0].message) !== null && _d !== void 0 ? _d : "An unknown error occurred"
+        });
+      } else {
+        if (e instanceof alchemy.SE.CodedError) setBeforeSaveError(e);else setBeforeSaveError({
+          errorCode: "unknown",
+          errorSource: "client",
+          errorType: "unknown",
+          message: (_e = e.message) !== null && _e !== void 0 ? _e : "An unknown error occurred"
+        });
+      }
+      return;
     }
   }), [onBeforeRateSaved, onUpdatedShipment, resetRates, shipment, updateShipment]);
   const handleSubmit = React.useCallback(rateId => __awaiter(void 0, void 0, void 0, function* () {
-    var _d;
+    var _f, _g, _h;
     setBeforeCreateError(undefined);
     if (!shipment) return;
     const preferredRates = preferredRatesResponse === null || preferredRatesResponse === void 0 ? void 0 : preferredRatesResponse.map(r => r.rate);
-    const rate = [...((_d = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.rates) !== null && _d !== void 0 ? _d : []), ...(preferredRates !== null && preferredRates !== void 0 ? preferredRates : [])].find(r => r.rateId === rateId);
+    const rate = [...((_f = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.rates) !== null && _f !== void 0 ? _f : []), ...(preferredRates !== null && preferredRates !== void 0 ? preferredRates : [])].find(r => r.rateId === rateId);
     if (rate) {
       try {
         const beforePurchaseResponse = yield onBeforeLabelCreate === null || onBeforeLabelCreate === void 0 ? void 0 : onBeforeLabelCreate(rate, shipment);
-        if (!beforePurchaseResponse) {
+        if (!beforePurchaseResponse || Object.keys(beforePurchaseResponse).length === 0) {
           yield purchaseLabel(rateId, shipment, rate);
           return;
         }
@@ -18271,12 +18298,21 @@ const useRatesForm = ({
           }
         }
       } catch (e) {
-        setBeforeCreateError({
-          errorCode: "unknown",
-          errorSource: "client",
-          errorType: "unknown",
-          message: e.message
-        });
+        if (Array.isArray(e)) {
+          if (e[0] instanceof alchemy.SE.CodedError) setBeforeCreateError(e[0]);else setBeforeCreateError({
+            errorCode: "unknown",
+            errorSource: "client",
+            errorType: "unknown",
+            message: (_g = e[0].message) !== null && _g !== void 0 ? _g : "An unknown error occurred"
+          });
+        } else {
+          if (e instanceof alchemy.SE.CodedError) setBeforeCreateError(e);else setBeforeCreateError({
+            errorCode: "unknown",
+            errorSource: "client",
+            errorType: "unknown",
+            message: (_h = e.message) !== null && _h !== void 0 ? _h : "An unknown error occurred"
+          });
+        }
         return;
       }
     }
@@ -18297,6 +18333,11 @@ const useRatesForm = ({
       name: "CodedError"
     }))) !== null && _b !== void 0 ? _b : [];
   }
+  const displayableSaveRateErrors = useScrubErrors({
+    errors: errors,
+    predicate: React.useCallback(e => e.message.includes("Only residential delivery addresses are allowed for UPS Ground Saver."), []),
+    scrubber: React.useCallback(() => "common:errorMessages.saveRateError", [])
+  });
   const displayableRateErrors = useScrubErrors({
     errors: errors,
     predicate: React.useCallback(e => e.message.includes("No rates are available for service_codes"), []),
@@ -18309,6 +18350,7 @@ const useRatesForm = ({
   return {
     carriers,
     displayableRateErrors,
+    displayableSaveRateErrors,
     errors: errors.length > 0 ? errors : undefined,
     isLoading: ratesCalculating,
     labelErrors: displayableLabelErrors,
@@ -18736,13 +18778,18 @@ const PurchaseLabelBySalesOrder = _a => {
     salesOrder,
     warehouseId
   });
+  const {
+    data: insuranceAccount,
+    isLoading: insuranceIsLoading
+  } = alchemy.useGetInsuranceAccount("shipsurance");
   return jsxRuntime.jsx(SuspendSalesOrder, Object.assign({
     salesOrder: salesOrder
   }, salesOrderProps, {
-    isLoading: salesOrderLoading || configureShipmentProps.isLoading
+    isLoading: salesOrderLoading || configureShipmentProps.isLoading || insuranceIsLoading
   }, {
     children: salesOrder && jsxRuntime.jsx(ConfigureShipment, Object.assign({
       features: features,
+      insuranceAccount: insuranceAccount,
       salesOrder: salesOrder
     }, configureShipmentProps, props))
   }));
@@ -18811,11 +18858,16 @@ const PurchaseLabelByShipment = _a => {
     void shipmentProps.refetchShipment();
     onShipmentUpdated === null || onShipmentUpdated === void 0 ? void 0 : onShipmentUpdated(shipment);
   };
+  const {
+    data: insuranceAccount,
+    isLoading: insuranceIsLoading
+  } = alchemy.useGetInsuranceAccount("shipsurance");
   return jsxRuntime.jsx(SuspendShipment, Object.assign({
     shipment: shipment
   }, shipmentProps, {
     children: shipment && jsxRuntime.jsx(ConfigureShipment, Object.assign({
       errors: shipmentProps.errors,
+      insuranceAccount: insuranceAccount,
       isLoading: shipmentProps.isLoading,
       onShipmentUpdated: handleShipmentUpdated,
       shipment: shipment

package/index.js

@@ -1,7 +1,7 @@
 import { jsx, jsxs, Fragment } from '@emotion/react/jsx-runtime';
 import { useTranslation, Trans } from 'react-i18next';
 import { InlineNotification, NotificationType, Typography, Link, ButtonSize, Spinner, Icon, IconSize, Divider, Skeleton, SkeletonAnimation, SkeletonVariant, Grid, GridChild, Pagination, SkeletonBackgroundColor, RadioGroup, Radio, SpinnerSize, FormField, FieldMessageType, Checkbox, Input, SelectAutocomplete, Select as Select$1, OptionGroup, Option, Button, Switch as Switch$1, Textarea, ChipList, Chip, ButtonVariant, ButtonColor, Tag, TagColor, Stepper, Step, IconTooltip, Table, TableBody, TableBaseRow, TableBodyCell, TableHeader, TableHeaderCell, Popover, DropdownOptionList, DatePicker as DatePicker$1, BottomSheet } from '@packlink/giger';
-import alchemy, { SE, logger, useValidateAddresses, useListCarriers, useConnectCarrier, useListWarehouses, useUpdateWarehouse, useCreateWarehouse, useDeleteWarehouse, useGetWalletHistory, useGetAccountSettings, useUpdateAccountSettings, AlchemyContext, useAddFunds, useGetCarrierById, useUpdateAutoFunding, useGetAutoFundingConfiguration, Currency, useUpdateFundingSource, useListFundingSources, useCreateFundingSource, useRegisterCarrier, useUpdateSalesOrderShipment, useParseAddress, useListCustomPackageTypes, useCalculateRates, useGetShipmentRates, useListLabels, useCreateLabel, useListSalesOrderShipments, useCreateSalesOrderShipment, CodedError, useListSalesOrders, useGetSalesOrder, useListOrderSources, useRefreshOrderSource, useCreateShipment, useGetShipment, useGetSalesOrderShipment, useGetLabel, useVoidLabel } from '@shipengine/alchemy';
+import alchemy, { SE, logger, useValidateAddresses, useListCarriers, useConnectCarrier, useListWarehouses, useUpdateWarehouse, useCreateWarehouse, useDeleteWarehouse, useGetWalletHistory, useGetAccountSettings, useUpdateAccountSettings, AlchemyContext, useAddFunds, useGetCarrierById, useUpdateAutoFunding, useGetAutoFundingConfiguration, Currency, useUpdateFundingSource, useListFundingSources, useCreateFundingSource, useRegisterCarrier, useUpdateSalesOrderShipment, useParseAddress, useListCustomPackageTypes, useCalculateRates, useGetShipmentRates, useListLabels, useCreateLabel, useListSalesOrderShipments, useCreateSalesOrderShipment, CodedError, useListSalesOrders, useGetSalesOrder, useListOrderSources, useRefreshOrderSource, useGetInsuranceAccount, useCreateShipment, useGetShipment, useGetSalesOrderShipment, useGetLabel, useVoidLabel } from '@shipengine/alchemy';
 import axios from 'axios';
 import _$3, { get as get$1, isEqual } from 'lodash';
 import { zodResolver } from '@hookform/resolvers/zod';
@@ -4504,8 +4504,7 @@ const useShipmentMetadata = shipment => {
 };
 
 let _$2 = t => t,
-  _t$2,
-  _t2$2;
+  _t$2;
 const findGenericPackageFromCarriers = carriers => {
   const carrier = carriers.find(c => c.packages.some(p => p.packageCode === "package"));
   return carrier === null || carrier === void 0 ? void 0 : carrier.packages.find(p => p.packageCode === "package");
@@ -4532,17 +4531,14 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
       [c.carrierCode]: partialResults[c.carrierCode] === undefined
     }));
     const genericPackage = findGenericPackageFromCarriers(carriers);
-    const packageOptions = [...(genericPackage ? [{
-      label: t(_t$2 || (_t$2 = _$2`packageCategories.browseRates`)),
-      options: [{
+    const customPackageOptions = [...(genericPackage || (customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? [{
+      label: t(_t$2 || (_t$2 = _$2`packageCategories.customPackages`)),
+      options: [...(genericPackage ? [{
         label: t("packageCodes.package"),
         value: {
           code: "package"
         }
-      }]
-    }] : []), ...((customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? [{
-      label: t(_t2$2 || (_t2$2 = _$2`packageCategories.myCustomPackages`)),
-      options: customPackageTypes.sort((a, b) => a.name.localeCompare(b.name)).map(({
+      }] : []), ...((customPackageTypes === null || customPackageTypes === void 0 ? void 0 : customPackageTypes.length) ? customPackageTypes.sort((a, b) => a.name.localeCompare(b.name)).map(({
         dimensions,
         name,
         packageId
@@ -4553,7 +4549,7 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
             code: packageId
           }
         };
-      })
+      }) : [])]
     }] : [])];
     return carriers.reduce((options, carrier) => {
       if (carrier.packages.length === 0) return options;
@@ -4574,7 +4570,7 @@ const usePackageOptions = (carriers, customPackageTypes, shipment) => {
         })),
         value: carrier.carrierId
       }];
-    }, packageOptions);
+    }, customPackageOptions);
   }, [carriers, customPackageTypes, isPoBox, isUnsupportedUpsCountry, t]);
 };
 
@@ -14631,6 +14627,7 @@ const RateForm = ({
   carriers,
   disabled,
   displayableRateErrors,
+  displayableSaveRateErrors,
   errors,
   features,
   isLoading,
@@ -14763,6 +14760,12 @@ const RateForm = ({
         title: "errorTypes.rateInvalid"
       };
     }
+    if (displayableSaveRateErrors === null || displayableSaveRateErrors === void 0 ? void 0 : displayableSaveRateErrors.length) {
+      return {
+        messages: displayableSaveRateErrors,
+        title: "errorTypes.saveRate"
+      };
+    }
     if (labelErrors === null || labelErrors === void 0 ? void 0 : labelErrors.length) {
       return {
         messages: labelErrors,
@@ -14770,7 +14773,7 @@ const RateForm = ({
       };
     }
     return undefined;
-  }, [rateOptions, labelErrors, displayableRateErrors, outOfBandDisplayableErrors]);
+  }, [displayableRateErrors, outOfBandDisplayableErrors, rateOptions.length, displayableSaveRateErrors, labelErrors]);
   return jsxs("form", Object.assign({
     id: "rate-form",
     onSubmit: handleSubmit,
@@ -14879,15 +14882,29 @@ const SuspendSalesOrder = ({
 };
 
 const styles$2 = createStyles({
+  itemDescription: theme => ({
+    display: "flex",
+    flexDirection: "column",
+    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0)}px ${theme.spacing(0)}px`
+  }),
   itemDetail: theme => ({
-    padding: `${theme.spacing(0)}px ${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0)}px`
+    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0.5)}px ${theme.spacing(0)}px`,
+    verticalAlign: "top"
   }),
   itemName: theme => ({
-    padding: `${theme.spacing(2)}px ${theme.spacing(2)}px ${theme.spacing(0.5)}px ${theme.spacing(0)}px`
+    // Set item name to max 3 lines and truncate with ellipsis
+    "-webkit-box-orient": "vertical",
+    "-webkit-line-clamp": "3",
+    display: "-webkit-box",
+    lineHeight: `${theme.spacing(2.5)}px`,
+    maxHeight: `${theme.spacing(7.5)}px`,
+    overflow: "hidden",
+    textOverflow: "ellipsis",
+    whiteSpace: "normal"
   }),
   numericCell: () => ({
     textAlign: "right",
-    width: "100px"
+    width: "80px"
   }),
   tableWrapper: theme => ({
     "&& > div": {
@@ -14946,23 +14963,18 @@ const ItemsBreakdown = ({
           quantity,
           value,
           totalValue
-        }, index) => jsxs(Fragment$1, {
-          children: [jsx(TableBaseRow, {
-            children: jsx(TableBodyCell, Object.assign({
-              colSpan: 4,
-              css: styles$2.itemName
+        }, index) => jsx(Fragment$1, {
+          children: jsxs(TableBaseRow, {
+            children: [jsxs(TableBodyCell, Object.assign({
+              css: styles$2.itemDescription
             }, {
-              children: jsx(Typography, {
+              children: [jsx(Typography, Object.assign({
+                css: styles$2.itemName
+              }, {
                 children: name
-              })
-            }))
-          }), jsxs(TableBaseRow, {
-            children: [jsx(TableBodyCell, Object.assign({
-              css: styles$2.itemDetail
-            }, {
-              children: jsx(Typography, {
+              })), jsx(Typography, {
                 children: detail
-              })
+              })]
             })), jsx(TableBodyCell, Object.assign({
               css: [styles$2.numericCell, styles$2.itemDetail]
             }, {
@@ -14976,7 +14988,7 @@ const ItemsBreakdown = ({
             }, {
               children: totalValue && formatMoney(totalValue)
             }))]
-          })]
+          })
         }, index))
       })
     }))
@@ -15973,6 +15985,7 @@ const ShipmentForm = ({
           }, {
             children: presetCategory.options.map(preset => jsx(Option, Object.assign({
               onClick: () => {
+                onDirty(); // bypass rate cache
                 handleApplyPreset(preset.value);
               },
               selected: _$3.isEqual(selectedPreset, preset.value),
@@ -16869,7 +16882,8 @@ var common = {
 			warehouses: "Unable to load warehouses"
 		},
 		unknown: "Oops! Something went wrong.",
-		noRatesAvailable: "No rates available for this shipment. Please check your shipment configuration."
+		noRatesAvailable: "No rates available for this shipment. Please check your shipment configuration.",
+		saveRateError: "An error occurred while attempting to save your rate. Please try again later or save a different rate option."
 	},
 	errorTypes: {
 		accountStatus: "Account status error",
@@ -16877,6 +16891,7 @@ var common = {
 		integrations: "Integrations error",
 		purchase: "Purchase error",
 		rateInvalid: "Invalid rate configuration",
+		saveRate: "Error saving rate",
 		security: "Security error",
 		shipmentStatus: "Shipment status error",
 		system: "System error",
@@ -16917,8 +16932,7 @@ var common = {
 		december: "December"
 	},
 	packageCategories: {
-		browseRates: "Browse Rates",
-		myCustomPackages: "My Custom Packages"
+		customPackages: "Custom Packages"
 	},
 	packageCodes: {
 		"package": "Custom"
@@ -18158,11 +18172,14 @@ const useRatesForm = ({
     carrierId,
     serviceCode
   }) => __awaiter(void 0, void 0, void 0, function* () {
+    var _d, _e;
     if (!shipment) throw new Error("shipment not found");
+    // clear any errors before attempting to save
+    setBeforeSaveError(undefined);
     try {
       const beforeSaveResponse = yield onBeforeRateSaved === null || onBeforeRateSaved === void 0 ? void 0 : onBeforeRateSaved(carrierId, serviceCode);
       let updatedShipment;
-      if (!beforeSaveResponse) {
+      if (!beforeSaveResponse || Object.keys(beforeSaveResponse).length === 0) {
         updatedShipment = yield updateShipment(Object.assign(Object.assign({}, shipment), {
           carrierId,
           serviceCode,
@@ -18195,24 +18212,34 @@ const useRatesForm = ({
         return;
       }
     } catch (e) {
-      setBeforeSaveError({
-        errorCode: "unknown",
-        errorSource: "client",
-        errorType: "unknown",
-        message: e.message
-      });
+      if (Array.isArray(e)) {
+        if (e[0] instanceof SE.CodedError) setBeforeSaveError(e[0]);else setBeforeSaveError({
+          errorCode: "unknown",
+          errorSource: "client",
+          errorType: "unknown",
+          message: (_d = e[0].message) !== null && _d !== void 0 ? _d : "An unknown error occurred"
+        });
+      } else {
+        if (e instanceof SE.CodedError) setBeforeSaveError(e);else setBeforeSaveError({
+          errorCode: "unknown",
+          errorSource: "client",
+          errorType: "unknown",
+          message: (_e = e.message) !== null && _e !== void 0 ? _e : "An unknown error occurred"
+        });
+      }
+      return;
     }
   }), [onBeforeRateSaved, onUpdatedShipment, resetRates, shipment, updateShipment]);
   const handleSubmit = useCallback(rateId => __awaiter(void 0, void 0, void 0, function* () {
-    var _d;
+    var _f, _g, _h;
     setBeforeCreateError(undefined);
     if (!shipment) return;
     const preferredRates = preferredRatesResponse === null || preferredRatesResponse === void 0 ? void 0 : preferredRatesResponse.map(r => r.rate);
-    const rate = [...((_d = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.rates) !== null && _d !== void 0 ? _d : []), ...(preferredRates !== null && preferredRates !== void 0 ? preferredRates : [])].find(r => r.rateId === rateId);
+    const rate = [...((_f = ratesResponse === null || ratesResponse === void 0 ? void 0 : ratesResponse.rates) !== null && _f !== void 0 ? _f : []), ...(preferredRates !== null && preferredRates !== void 0 ? preferredRates : [])].find(r => r.rateId === rateId);
     if (rate) {
       try {
         const beforePurchaseResponse = yield onBeforeLabelCreate === null || onBeforeLabelCreate === void 0 ? void 0 : onBeforeLabelCreate(rate, shipment);
-        if (!beforePurchaseResponse) {
+        if (!beforePurchaseResponse || Object.keys(beforePurchaseResponse).length === 0) {
           yield purchaseLabel(rateId, shipment, rate);
           return;
         }
@@ -18239,12 +18266,21 @@ const useRatesForm = ({
           }
         }
       } catch (e) {
-        setBeforeCreateError({
-          errorCode: "unknown",
-          errorSource: "client",
-          errorType: "unknown",
-          message: e.message
-        });
+        if (Array.isArray(e)) {
+          if (e[0] instanceof SE.CodedError) setBeforeCreateError(e[0]);else setBeforeCreateError({
+            errorCode: "unknown",
+            errorSource: "client",
+            errorType: "unknown",
+            message: (_g = e[0].message) !== null && _g !== void 0 ? _g : "An unknown error occurred"
+          });
+        } else {
+          if (e instanceof SE.CodedError) setBeforeCreateError(e);else setBeforeCreateError({
+            errorCode: "unknown",
+            errorSource: "client",
+            errorType: "unknown",
+            message: (_h = e.message) !== null && _h !== void 0 ? _h : "An unknown error occurred"
+          });
+        }
         return;
       }
     }
@@ -18265,6 +18301,11 @@ const useRatesForm = ({
       name: "CodedError"
     }))) !== null && _b !== void 0 ? _b : [];
   }
+  const displayableSaveRateErrors = useScrubErrors({
+    errors: errors,
+    predicate: useCallback(e => e.message.includes("Only residential delivery addresses are allowed for UPS Ground Saver."), []),
+    scrubber: useCallback(() => "common:errorMessages.saveRateError", [])
+  });
   const displayableRateErrors = useScrubErrors({
     errors: errors,
     predicate: useCallback(e => e.message.includes("No rates are available for service_codes"), []),
@@ -18277,6 +18318,7 @@ const useRatesForm = ({
   return {
     carriers,
     displayableRateErrors,
+    displayableSaveRateErrors,
     errors: errors.length > 0 ? errors : undefined,
     isLoading: ratesCalculating,
     labelErrors: displayableLabelErrors,
@@ -18704,13 +18746,18 @@ const PurchaseLabelBySalesOrder = _a => {
     salesOrder,
     warehouseId
   });
+  const {
+    data: insuranceAccount,
+    isLoading: insuranceIsLoading
+  } = useGetInsuranceAccount("shipsurance");
   return jsx(SuspendSalesOrder, Object.assign({
     salesOrder: salesOrder
   }, salesOrderProps, {
-    isLoading: salesOrderLoading || configureShipmentProps.isLoading
+    isLoading: salesOrderLoading || configureShipmentProps.isLoading || insuranceIsLoading
   }, {
     children: salesOrder && jsx(ConfigureShipment, Object.assign({
       features: features,
+      insuranceAccount: insuranceAccount,
       salesOrder: salesOrder
     }, configureShipmentProps, props))
   }));
@@ -18779,11 +18826,16 @@ const PurchaseLabelByShipment = _a => {
     void shipmentProps.refetchShipment();
     onShipmentUpdated === null || onShipmentUpdated === void 0 ? void 0 : onShipmentUpdated(shipment);
   };
+  const {
+    data: insuranceAccount,
+    isLoading: insuranceIsLoading
+  } = useGetInsuranceAccount("shipsurance");
   return jsx(SuspendShipment, Object.assign({
     shipment: shipment
   }, shipmentProps, {
     children: shipment && jsx(ConfigureShipment, Object.assign({
       errors: shipmentProps.errors,
+      insuranceAccount: insuranceAccount,
       isLoading: shipmentProps.isLoading,
       onShipmentUpdated: handleShipmentUpdated,
       shipment: shipment

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shipengine/elements",
-  "version": "0.37.3",
+  "version": "0.37.12",
   "peerDependencies": {
     "@packlink/giger": "*",
     "react-i18next": "*",

package/src/components/items-breakdown/items-breakdown.styles.d.ts

@@ -1,9 +1,22 @@
 export declare const styles: {
+    itemDescription: (theme: import("@packlink/giger-theme/dist/lib/Theme").Theme) => {
+        display: "flex";
+        flexDirection: "column";
+        padding: string;
+    };
     itemDetail: (theme: import("@packlink/giger-theme/dist/lib/Theme").Theme) => {
         padding: string;
+        verticalAlign: string;
     };
     itemName: (theme: import("@packlink/giger-theme/dist/lib/Theme").Theme) => {
-        padding: string;
+        "-webkit-box-orient": string;
+        "-webkit-line-clamp": string;
+        display: "-webkit-box";
+        lineHeight: string;
+        maxHeight: string;
+        overflow: "hidden";
+        textOverflow: "ellipsis";
+        whiteSpace: "normal";
     };
     numericCell: () => {
         textAlign: "right";

package/src/components/templates/rate-form/rate-form.d.ts

@@ -4,6 +4,7 @@ export type RateFormProps = {
     carriers?: SE.Carrier[];
     disabled?: boolean;
     displayableRateErrors?: string[];
+    displayableSaveRateErrors?: string[];
     errors?: SE.CodedError[];
     features?: ConfigureShipmentFeatures;
     isLoading?: boolean;
@@ -19,4 +20,4 @@ export type RateFormProps = {
     rates?: SE.Rate[];
     shipment?: SE.SalesOrderShipment;
 };
-export declare const RateForm: ({ carriers, disabled, displayableRateErrors, errors, features, isLoading, labelErrors, labels, labelsLoading, onSave, onSelectRate, onSubmit, outOfBandDisplayableErrors, preferredRates, preferredServiceCodes, rates, shipment, }: RateFormProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const RateForm: ({ carriers, disabled, displayableRateErrors, displayableSaveRateErrors, errors, features, isLoading, labelErrors, labels, labelsLoading, onSave, onSelectRate, onSubmit, outOfBandDisplayableErrors, preferredRates, preferredServiceCodes, rates, shipment, }: RateFormProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/src/elements/account-settings/account-settings.d.ts

@@ -637,6 +637,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     };
                     unknown: string;
                     noRatesAvailable: string;
+                    saveRateError: string;
                 };
                 errorTypes: {
                     accountStatus: string;
@@ -644,6 +645,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     integrations: string;
                     purchase: string;
                     rateInvalid: string;
+                    saveRate: string;
                     security: string;
                     shipmentStatus: string;
                     system: string;
@@ -684,8 +686,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     december: string;
                 };
                 packageCategories: {
-                    browseRates: string;
-                    myCustomPackages: string;
+                    customPackages: string;
                 };
                 packageCodes: {
                     package: string;

package/src/elements/configure-shipment/configure-shipment.d.ts

@@ -41,6 +41,7 @@ export type ConfigureShipmentProps = {
     errors?: Templates.ShipmentFormProps["errors"];
     features?: ConfigureShipmentFeatures;
     getPreferredRates?: (shipment: SE.SalesOrderShipment, isInternational: boolean) => Promise<PreferredRatesResponse | undefined>;
+    insuranceAccount?: SE.InsuranceAccount;
     isLoading?: Templates.ShipmentFormProps["isLoading"];
     onAddressValidation?: UseShipmentFormProps["onAddressValidation"];
     onApplyPreset?: UseShipmentFormProps["onApplyPreset"];

package/src/elements/configure-shipment/hooks/use-rates-form.d.ts

@@ -24,6 +24,7 @@ export type UseRatesFormProps = {
 export declare const useRatesForm: ({ getPreferredRates, onBeforeRateSaved, onBeforeLabelCreate, onLabelCreateFailure, onLabelCreateSuccess, onRateSaved, onRatesCalculated, onShipmentUpdated, printLabelLayout, shipment, }: UseRatesFormProps) => {
     carriers: SE.Carrier[] | undefined;
     displayableRateErrors: string[] | undefined;
+    displayableSaveRateErrors: string[] | undefined;
     errors: SE.CodedError[] | undefined;
     isLoading: boolean;
     labelErrors: string[] | undefined;

package/src/elements/onboarding/onboarding.d.ts

@@ -621,6 +621,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     };
                     unknown: string;
                     noRatesAvailable: string;
+                    saveRateError: string;
                 };
                 errorTypes: {
                     accountStatus: string;
@@ -628,6 +629,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     integrations: string;
                     purchase: string;
                     rateInvalid: string;
+                    saveRate: string;
                     security: string;
                     shipmentStatus: string;
                     system: string;
@@ -668,8 +670,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     december: string;
                 };
                 packageCategories: {
-                    browseRates: string;
-                    myCustomPackages: string;
+                    customPackages: string;
                 };
                 packageCodes: {
                     package: string;

package/src/elements/purchase-label/purchase-label.d.ts

@@ -718,6 +718,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     };
                     unknown: string;
                     noRatesAvailable: string;
+                    saveRateError: string;
                 };
                 errorTypes: {
                     accountStatus: string;
@@ -725,6 +726,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     integrations: string;
                     purchase: string;
                     rateInvalid: string;
+                    saveRate: string;
                     security: string;
                     shipmentStatus: string;
                     system: string;
@@ -762,35 +764,10 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     september: string;
                     october: string;
                     november: string;
-                    /**
-                     * # Purchase Label Component
-                     *
-                     * The `<PurchaseLabel />` component is used to purchase shipping labels from various carriers
-                     *
-                     * @param ElementProps The props necessary to render the `<PurchaseLabel />` component for shipment
-                     * based or sales order based label purchasing.
-                     *
-                     * @returns Element An EmotionJSX.Element that will render the `<PurchaseLabel />` component
-                     * with all the appropriate wrappers.
-                     *
-                     * @example
-                     * You can see how the `<Component />` is used in the `createElement` function call below.
-                     * ```tsx
-                     * export const Element = alchemy.createElement(Component, ErrorFallback, {
-                     *   css: { height: "100%", maxWidth: "800px", minWidth: "440px", width: "100%" },
-                     *   resources: { en },
-                     * });
-                     * ```
-                     *
-                     * <br />
-                     *
-                     * @see {@link PurchaseLabel.Element | The **Element** created to render `<PurchaseLabel />`}
-                     */
                     december: string;
                 };
                 packageCategories: {
-                    browseRates: string;
-                    myCustomPackages: string;
+                    customPackages: string;
                 };
                 packageCodes: {
                     package: string;

package/src/elements/view-shipment/view-shipment.d.ts

@@ -641,6 +641,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     };
                     unknown: string;
                     noRatesAvailable: string;
+                    saveRateError: string;
                 };
                 errorTypes: {
                     accountStatus: string;
@@ -648,6 +649,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     integrations: string;
                     purchase: string;
                     rateInvalid: string;
+                    saveRate: string;
                     security: string;
                     shipmentStatus: string;
                     system: string;
@@ -688,8 +690,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     december: string;
                 };
                 packageCategories: {
-                    browseRates: string;
-                    myCustomPackages: string;
+                    customPackages: string;
                 };
                 packageCodes: {
                     package: string;

package/src/elements/void-label/void-label.d.ts

@@ -637,6 +637,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     };
                     unknown: string;
                     noRatesAvailable: string;
+                    saveRateError: string;
                 };
                 errorTypes: {
                     accountStatus: string;
@@ -644,6 +645,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     integrations: string;
                     purchase: string;
                     rateInvalid: string;
+                    saveRate: string;
                     security: string;
                     shipmentStatus: string;
                     system: string;
@@ -684,8 +686,7 @@ export declare const Element: ({ resources, ...props }: ComponentProps & {
                     december: string;
                 };
                 packageCategories: {
-                    browseRates: string;
-                    myCustomPackages: string;
+                    customPackages: string;
                 };
                 packageCodes: {
                     package: string;

package/src/locales/en/index.d.ts

@@ -509,6 +509,7 @@ declare const _default: {
             };
             unknown: string;
             noRatesAvailable: string;
+            saveRateError: string;
         };
         errorTypes: {
             accountStatus: string;
@@ -516,6 +517,7 @@ declare const _default: {
             integrations: string;
             purchase: string;
             rateInvalid: string;
+            saveRate: string;
             security: string;
             shipmentStatus: string;
             system: string;
@@ -556,8 +558,7 @@ declare const _default: {
             december: string;
         };
         packageCategories: {
-            browseRates: string;
-            myCustomPackages: string;
+            customPackages: string;
         };
         packageCodes: {
             package: string;