@shipengine/elements 1.9.0 → 2.1.0

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

@@ -1,38 +1,15 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { RateFormProps } from "../../components/templates/rate-form";
-import { ShipmentFormFeatures, ShipmentFormProps } from "../../components/templates/shipment-form";
-import { VatSettingsFeatures } from "../../features";
+import { ShipmentFormProps } from "../../components/templates/shipment-form";
 import { UseShippingPresetsOptionsProps } from "../../hooks";
 import { PreferredRatesResponse } from "../../types";
+import { PurchaseLabelFeatures } from "../../utilities";
 import { UseRatesFormProps, UseShipmentFormProps } from "./hooks";
 export type ShipmentFormMode = "browse_rates" | "select_service";
-export type RateFormFeatures = {
-    enableFunding?: boolean;
-    enableGlobalPostFiltering?: boolean;
-    enablePudoUI?: boolean;
-    labelLayout?: boolean;
-    nicknameRate?: boolean;
-    requireDhlTermsAcknowledgement?: boolean;
-    saveRate?: boolean;
-};
-export type ConfigureShipmentFeatures = {
-    compatibleCountryCodes?: UseShipmentFormProps["compatibleCountryCodes"];
-    configureShipment?: {
-        enableErrorWhenShipmentCancelled: boolean;
-    };
-    partnerMessages?: {
-        incompleteLabelPurchaseRequirements?: string;
-    };
-    presentation?: {
-        poweredByShipEngine?: boolean;
-    };
-    rateForm?: RateFormFeatures;
-    shipmentForm?: ShipmentFormFeatures;
-};
 export type ConfigureShipmentProps = {
     currency: SE.Currency;
     errors?: ShipmentFormProps["errors"];
-    features?: ConfigureShipmentFeatures & VatSettingsFeatures;
+    features?: PurchaseLabelFeatures;
     getPreferredRates?: (shipment: SE.SalesOrderShipment, isInternational: boolean) => Promise<PreferredRatesResponse | undefined>;
     insuranceAccount?: SE.InsuranceAccount;
     isLoading?: ShipmentFormProps["isLoading"];

package/src/elements/purchase-label/hooks/use-address.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { AddressParserPayload } from "../../../components/templates/address-parser";
 import { AddressPreference } from "../../../components/templates/address-preference-display";
 import { CharsetWarning, OnChangeAddressOptions } from "../../../components/templates/shipment-form";

package/src/elements/purchase-label/hooks/use-configure-shipment.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { ConfigureShipmentProps } from "../configure-shipment";
 import { UsePendingShipmentProps } from "./use-pending-shipment";
 export type UseConfigureShipmentProps = {

package/src/elements/purchase-label/hooks/use-customs.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 export type UseCustomsProps = {
     onUpdate?: (shipment: SE.SalesOrderShipment) => Promise<void> | void;
     shipment?: SE.SalesOrderShipment;
@@ -6,4 +6,5 @@ export type UseCustomsProps = {
 export declare const useCustoms: ({ onUpdate, shipment }: UseCustomsProps) => {
     customsErrors: SE.CodedError[] | null;
     handleUpdateCustoms: (customs: SE.Customs, products: SE.Product[]) => Promise<SE.SalesOrderShipment>;
+    handleUpdateTaxableIds: (taxIds: SE.TaxIdentifier[], onError: (errors: SE.CodedError[]) => void) => Promise<SE.SalesOrderShipment>;
 };

package/src/elements/purchase-label/hooks/use-import-sales-order.d.ts

@@ -5,7 +5,7 @@ export type UseImportSalesOrderProps = {
     salesOrderId?: string;
 };
 export declare const useImportSalesOrder: ({ externalOrderId, externalOrderNumber, orderSourceCode, salesOrderId, }: UseImportSalesOrderProps) => {
-    errors: import("@shipengine/alchemy").CodedError[] | undefined;
+    errors: import("@shipengine/react-api").CodedError[] | undefined;
     isLoading: boolean;
-    salesOrder: import("@shipengine/alchemy").SalesOrder | undefined;
+    salesOrder: import("@shipengine/react-api").SalesOrder | undefined;
 };

package/src/elements/purchase-label/hooks/use-load-shipment.d.ts

@@ -2,8 +2,8 @@ export type UseLoadShipmentProps = {
     shipmentId: string;
 };
 export declare const useLoadShipment: ({ shipmentId }: UseLoadShipmentProps) => {
-    errors: import("@shipengine/alchemy").CodedError[] | undefined;
+    errors: import("@shipengine/react-api").CodedError[] | undefined;
     isLoading: boolean;
-    refetchShipment: <TPageData>(options?: (import("@tanstack/query-core").RefetchOptions & import("@tanstack/query-core").RefetchQueryFilters<TPageData>) | undefined) => Promise<import("@tanstack/query-core").QueryObserverResult<import("@shipengine/alchemy").SalesOrderShipment, import("@shipengine/alchemy").CodedError[]>>;
-    shipment: import("@shipengine/alchemy").SalesOrderShipment | undefined;
+    refetchShipment: <TPageData>(options?: (import("@tanstack/query-core").RefetchOptions & import("@tanstack/query-core").RefetchQueryFilters<TPageData>) | undefined) => Promise<import("@tanstack/query-core").QueryObserverResult<import("@shipengine/react-api").SalesOrderShipment, import("@shipengine/react-api").CodedError[]>>;
+    shipment: import("@shipengine/react-api").SalesOrderShipment | undefined;
 };

package/src/elements/purchase-label/hooks/use-pending-shipment.d.ts

@@ -1,4 +1,4 @@
-import { CodedError, SE } from "@shipengine/alchemy";
+import { CodedError, SE } from "@shipengine/react-api";
 export type UsePendingShipmentProps = {
     breakOnCancelledShipment?: boolean;
     onLoad?: (salesOrder: SE.SalesOrder, shipments: SE.SalesOrderShipment[], pendingShipment?: SE.SalesOrderShipment) => Promise<void> | void;

package/src/elements/purchase-label/hooks/use-presets.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { ShippingPreset } from "../../../types";
 export type UsePresetsProps = {
     onApply?: (preset: ShippingPreset, shipment: SE.SalesOrderShipment) => Promise<void> | void;

package/src/elements/purchase-label/hooks/use-rates-form.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { UseRatesWithCacheProps } from "./use-rates-with-cache";
 export type UseRatesFormProps = {
     getPreferredRates?: UseRatesWithCacheProps["getPreferredRates"];

package/src/elements/purchase-label/hooks/use-rates-with-cache.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { UseRequestRatesProps } from "./use-request-rates";
 export type UseRatesWithCacheProps = {
     getPreferredRates?: UseRequestRatesProps["getPreferredRates"];

package/src/elements/purchase-label/hooks/use-request-preferred-rates.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { UseRequestRatesProps } from "./use-request-rates";
 export type RequestPreferredRatesProps = {
     getPreferredRates?: UseRequestRatesProps["getPreferredRates"];

package/src/elements/purchase-label/hooks/use-request-rates.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { PreferredRatesResponse } from "../../../types";
 import { ConfigureShipmentProps } from "../configure-shipment";
 export type UseRequestRatesProps = {

package/src/elements/purchase-label/hooks/use-shipment-form.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { ShippingPreset } from "../../../types";
 import { UseAddressProps } from "./use-address";
 import { UsePresetsProps } from "./use-presets";
@@ -29,6 +29,7 @@ export declare const useShipmentForm: ({ compatibleCountryCodes, onAddressValida
         fullAddress: string;
     }) => Promise<SE.AddressExtraction>;
     onUpdateCustoms: (customs: SE.Customs, products: SE.Product[]) => Promise<SE.SalesOrderShipment>;
+    onUpdateTaxableIds: (taxIds: SE.TaxIdentifier[], onError: (errors: SE.CodedError[]) => void) => Promise<SE.SalesOrderShipment>;
     parseAddressErrors: SE.CodedError[] | undefined;
     resetParseAddress: () => void;
     resetSalesOrderShipment: () => void;

package/src/elements/purchase-label/purchase-label-by-sales-order.d.ts

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { UseImportSalesOrderProps } from "./hooks";
 import { PurchaseLabelCommonProps } from "./purchase-label";
 export type PurchaseLabelSalesOrderProps = PurchaseLabelCommonProps & {

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

@@ -1,4 +1,4 @@
-import { SE } from "@shipengine/alchemy";
+import { SE } from "@shipengine/react-api";
 import { PurchaseLabelCommonProps } from "./purchase-label";
 export type PurchaseLabelByShipmentProps = PurchaseLabelCommonProps & {
     currency?: SE.Currency;

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

@@ -1,5 +1,6 @@
 import React from "react";
 import { UseShippingPresetsOptionsProps } from "../../hooks";
+import { PurchaseLabelFeatures } from "../../utilities";
 import { ConfigureShipmentProps } from "./configure-shipment";
 import { UseConfigureShipmentProps } from "./hooks";
 import { PurchaseLabelSalesOrderProps } from "./purchase-label-by-sales-order";
@@ -16,7 +17,7 @@ export type PurchaseLabelCommonProps = {
     /**
      * `features` is a set of feature flags you would like to enable or disable in this component.
      */
-    features?: ConfigureShipmentProps["features"];
+    features?: PurchaseLabelFeatures;
     /**
      *`getPreferredRates is an async/sync optional callback function that will be invoked each time rates are caculated.
      * This is an optional callback function that returns an array of ShipEngine rates. The rates from this response will
@@ -139,7 +140,7 @@ export type ElementProps = PurchaseLabelByShipmentProps | PurchaseLabelSalesOrde
  * @example
  * You can see how the `<Component />` is used in the `createElement` function call below.
  * ```tsx
- * export const Element = alchemy.createElement(Component, ErrorFallback, {
+ * export const Element = createElement(Component, ErrorFallback, {
  *   css: { height: "100%", maxWidth: "800px", minWidth: "440px", width: "100%" },
  *   resources: { en },
  * });
@@ -181,12 +182,12 @@ export declare const Component: ({ features, ...props }: ElementProps) => import
  * <br />
  *
  * - Once a label has been purchased using this Element, you can take the `shipmentId` for the
- * associated shipment and pass it into the `<ViewShipment.Element />` Element in order to view
+ * associated shipment and pass it into the `<ShipmentSummary.Element />` Element in order to view
  * the shipment details.
  *
  * @see {@link PurchaseLabel.PurchaseLabelCommonProps | The **Common props** used in `<PurchaseLabel.Element />`}
  *
- * @see {@link ViewShipment.Element | The next step in the label purchase workflow `<ViewShipment.Element />`}
+ * @see {@link ShipmentSummary.Element | The next step in the label purchase workflow `<ShipmentSummary.Element />`}
  */
 export declare const Element: ({ resources, ...props }: ElementProps & {
     resources?: {
@@ -286,7 +287,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     genericText: string;
                 };
             };
-            "shipengine-carriers": {
+            "manage-carriers": {
                 title: string;
                 headers: {
                     accountCarriers: string;
@@ -318,14 +319,6 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     vatSettings: {
                         title: string;
                     };
-                    /**
-                     * # Purchase Label Component Props
-                     *
-                     * These are the shared props that will be passed into the `<PurchaseLabel.Element />`, and work
-                     * for either shipment-based or sales order-based label purchasing.
-                     *
-                     * @see {@link PurchaseLabel.Element | This prop types usage in `<PurchaseLabel.Element />`}
-                     */
                     carriers: {
                         title: string;
                         subtitle: string;
@@ -357,6 +350,11 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     billing: {
                         title: string;
                         subtitleCard: string;
+                        /**
+                         * `onAddressValidation` is an async/sync callback function that will be invoked on each Address
+                         * validation request. For example, whenever you update the `Ship To Address` or
+                         * `Ship From Address` for a given shipment.
+                         */
                         subtitleBilling: string;
                     };
                 };
@@ -372,6 +370,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                         title: string;
                     };
                 };
+                noFundingSource: string;
             };
             "rate-details": {
                 total: string;
@@ -426,14 +425,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     addPackageDetails: string;
                 };
                 errorMessages: {
-                    customsItemsRequired: string; /**
-                     * # Purchase Label Component Props
-                     *
-                     * These are the shared props that will be passed into the `<PurchaseLabel.Element />`, and work
-                     * for either shipment-based or sales order-based label purchasing.
-                     *
-                     * @see {@link PurchaseLabel.Element | This prop types usage in `<PurchaseLabel.Element />`}
-                     */
+                    customsItemsRequired: string;
                     invalidAddress: string;
                     noRates: string;
                     salesOrderNotLoaded: string;
@@ -466,6 +458,10 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     requestedShipping: string;
                     shipDate: string;
                     service: string;
+                    /**
+                     *  `onApplyPreset` is an async/sync callback function that will be invoked each time a `Preset`
+                     *  has been applied to a shipment.
+                     */
                     shipTo: string;
                     addShipToAddress: string;
                     warehouse: string;
@@ -480,10 +476,6 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     contentDescription: string;
                 };
                 loading: {
-                    /**
-                     * `onBeforeRateSave` is an async/sync callback function that will be invoked before each time a user
-                     * saves a rate.
-                     */
                     calculatingRates: string;
                 };
                 modes: {
@@ -567,8 +559,21 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     subtitle: string;
                     inlineMessage: string;
                 };
+                errors: {
+                    noCarriers: {
+                        title: string;
+                        subtitle: string;
+                    };
+                };
                 success: {
-                    title: string;
+                    title: string; /**
+                     *`getPreferredRates is an async/sync optional callback function that will be invoked each time rates are caculated.
+                     * This is an optional callback function that returns an array of ShipEngine rates. The rates from this response will
+                     * be spliced into the normal get rates response the Elements makes internally. If a service code matches a service
+                     * code on a rate returned from getPreferredRates, the rate returned from getPreferredRates will not be shown in the
+                     * rate form. These preferred rates will be displayed with a set of UI enhancements that incude a dynamic cost savings
+                     * flag and green checkmark when the rate is selected.
+                     */
                     subtitle: string;
                     action: string;
                 };
@@ -591,10 +596,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                 };
                 termsAndAgreementTitles: {
                     "WW9kZWwgRGlyZWN0IC0gVGVybXMgYW5kIENvbmRpdGlvbnMgKOKAnFRlcm1z4oCdKQ==": string;
-                    "RXZyaSBTZW5kIFRlcm1zICYgQ29uZGl0aW9ucw==": string; /**
-                     * `onChangeShipmentFormMode` is an async/sync callback function that will be invoked each time
-                     * the user toggles the `Shipment Form Mode` between `Browse Rates` and `Selected Rate`.
-                     */
+                    "RXZyaSBTZW5kIFRlcm1zICYgQ29uZGl0aW9ucw==": string;
                     "VGVybXMgb2YgU2VydmljZSBVbml0ZWQgS2luZ2RvbQ==": string;
                     RFBEIFN0YW5kYXJkIFRlcm1zIGFuZCBDb25kaXRpb25z: string;
                     "R2xvYmFsUG9zdCBUZXJtcyBhbmQgQ29uZGl0aW9ucw==": string;
@@ -615,6 +617,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                 returnToAddressIsDifferent: string;
                 setDefault: string;
                 shipFrom: string;
+                noWarehouses: string;
             };
             "manage-funding": {
                 actions: {
@@ -662,6 +665,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                 errors: {
                     balanceUnknown: string;
                     unableToFindBalance: string;
+                    noFundingSource: string;
                 };
                 byoc: {
                     invoiceNotification: string;
@@ -761,7 +765,17 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     toastTitle: string;
                     toastBody: string;
                 };
-            };
+                deleteCarrierErrorTitle: string;
+                deleteCarrierErrorMessage: string;
+                loadingDeletingCarrier: string;
+            }; /**
+             *`getPreferredRates is an async/sync optional callback function that will be invoked each time rates are caculated.
+             * This is an optional callback function that returns an array of ShipEngine rates. The rates from this response will
+             * be spliced into the normal get rates response the Elements makes internally. If a service code matches a service
+             * code on a rate returned from getPreferredRates, the rate returned from getPreferredRates will not be shown in the
+             * rate form. These preferred rates will be displayed with a set of UI enhancements that incude a dynamic cost savings
+             * flag and green checkmark when the rate is selected.
+             */
             common: {
                 actions: {
                     add: string;
@@ -856,10 +870,6 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     adultSignature: string;
                     delivery: string;
                     deliveryMailed: string;
-                    /**
-                     * `onChangeShipmentFormMode` is an async/sync callback function that will be invoked each time
-                     * the user toggles the `Shipment Form Mode` between `Browse Rates` and `Selected Rate`.
-                     */
                     directSignature: string;
                     none: string;
                     signature: string;
@@ -867,13 +877,29 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                 };
                 customs: {
                     addDeclaration: string;
+                    noResults: string;
                     contents: {
                         documents: string;
                         gift: string;
+                        /**
+                         * `onLabelCreateFailure` is an async/sync callback function that will be invoked each time a
+                         * label purchase fails.
+                         */
                         merchandise: string;
                         returnedGoods: string;
                         sample: string;
                     };
+                    taxIds: {
+                        sectionTitle: string;
+                        addTaxId: string;
+                        sectionTitleTooltip: string;
+                        entityTypeTooltipText: string; /**
+                         * `onLoad` is an async/sync callback provided by the host application that is invoked after the
+                         * element is loaded. (This may be useful to grab the shipmentId of a one-off label)
+                         */
+                        entityTypeTooltipPointOne: string;
+                        entityTypeTooltipPointTwo: string;
+                    };
                     currencyChange: string;
                     declarations: string;
                     descriptionTooltip: {
@@ -883,10 +909,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     };
                     fields: {
                         contentsType: string;
-                        countryOfOrigin: string; /**
-                         * `onRateSaved` is an async/sync callback function that will be invoked each time a rate is
-                         * saved by the user when rate shopping in the host application.
-                         */
+                        countryOfOrigin: string;
                         description: string;
                         harmonizedTariffCode: string;
                         ifDeliveryFails: string;
@@ -894,6 +917,11 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                         sku: string;
                         value: string;
                         valueQuantity: string;
+                        taxId: string;
+                        taxIdType: string;
+                        taxIdTypeValue: string;
+                        taxIssuingAuthority: string;
+                        entityType: string;
                     };
                     nonDelivery: {
                         returnToSender: string;
@@ -916,10 +944,7 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                         fundingSourceMetadata: string;
                         label: string;
                         labels: string;
-                        salesOrder: string; /**
-                         * `printLabelLayout` is a string that represents the label layout you would like to use when
-                         * purchasing a label. e.g. `4x6`
-                         */
+                        salesOrder: string;
                         shipment: string;
                         shipments: string;
                         warehouses: string;
@@ -969,6 +994,8 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     shipment: string;
                     shipments: string;
                     warehouses: string;
+                    funding: string;
+                    paymentMethod: string;
                 };
                 months: {
                     january: string;
@@ -1047,6 +1074,16 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
                     gram: string;
                     kilogram: string;
                 };
+                actionsMenu: {
+                    menuTitle: string;
+                    actions: {
+                        printLabel: string;
+                        voidLabel: string;
+                        printForms: string;
+                        edit: string;
+                        remove: string;
+                    };
+                };
                 ZnVuZGluZ19zb3VyY2VfaWQgbXVzdCBiZSBhbiBpbnRlZ2Vy: string;
                 T25seSByZXNpZGVudGlhbCBkZWxpdmVyeSBhZGRyZXNzZXMgYXJlIGFsbG93ZWQgZm9yIFVQUyBHcm91bmQgU2F2ZXIu: string;
                 "VGhlIHNlbGVjdGVkIHNlcnZpY2UgaW5jbHVkZXMgaW5zdXJhbmNlIGZvciBhbiBpbnN1cmVkIGFtb3VudCB1cCB0byAkMTAwLgo=": string;
@@ -1062,7 +1099,11 @@ export declare const Element: ({ resources, ...props }: ElementProps & {
             };
             "account-settings": {
                 messages: {
-                    noFundingSources: string;
+                    transactionHistory: {
+                        noTransactions: string;
+                    };
+                    noFundingSourceDescription: string;
+                    noFundingSourceAction: string;
                 };
                 title: string;
                 sections: {

package/src/elements/shipment-summary/index.d.ts

@@ -0,0 +1 @@
+export * as ShipmentSummary from "./shipment-summary";