@shipengine/elements 2.19.0 → 2.21.0

package/package.json

@@ -1,10 +1,14 @@
 {
   "name": "@shipengine/elements",
-  "version": "2.19.0",
+  "version": "2.21.0",
+  "module": "./index.js",
+  "main": "./index.js",
+  "types": "./src/index.d.ts",
+  "typings": "./types/src/index.d.ts",
   "peerDependencies": {
-    "@emotion/react": "11.x",
-    "react-i18next": "11.x",
-    "i18next": "22.x",
+    "@emotion/react": ">=11",
+    "react-i18next": ">=11",
+    "i18next": ">=22",
     "react": "17.x || 18.x",
     "react-dom": "17.x || 18.x"
   },
@@ -13,42 +17,269 @@
   },
   "exports": {
     ".": {
-      "types": "./src/index.d.ts",
-      "default": "./index.js"
-    },
-    "./components": "./components.js",
-    "./constants": "./constants.js",
-    "./elements": "./elements.js",
-    "./extensions": "./extensions.js",
-    "./hooks": "./hooks.js",
-    "./schemas": "./schemas.js",
-    "./types": "./types.js",
-    "./utilities": "./utilities.js",
-    "./workflows": "./workflows.js"
+      "source": "./src/index.ts",
+      "import": {
+        "types": "./types/src/index.d.ts",
+        "default": "./esm/index.js"
+      },
+      "require": {
+        "types": "./types/src/index.d.ts",
+        "default": "./cjs/index.cjs"
+      }
+    },
+    "./elements-provider": {
+      "source": "./src/elements-provider/index.ts",
+      "import": {
+        "types": "./types/src/elements-provider/index.d.ts",
+        "default": "./esm/elements-provider/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements-provider/index.d.ts",
+        "default": "./cjs/elements-provider/index.cjs"
+      }
+    },
+    "./labels-grid": {
+      "source": "./src/elements-provider/index.ts",
+      "import": {
+        "types": "./types/src/elements/labels-grid/index.d.ts",
+        "default": "./esm/elements/labels-grid/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/labels-grid/index.d.ts",
+        "default": "./cjs/elements/labels-grid/index.cjs"
+      }
+    },
+    "./manage-carriers": {
+      "source": "./src/elements/manage-carriers/index.ts",
+      "import": {
+        "types": "./types/src/elements/manage-carriers/index.d.ts",
+        "default": "./esm/elements/manage-carriers/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/manage-carriers/index.d.ts",
+        "default": "./cjs/elements/manage-carriers/index.cjs"
+      }
+    },
+    "./manage-external-carriers": {
+      "source": "./srcelements/manage-external-carriers/index.ts",
+      "import": {
+        "types": "./types/src/elements/manage-external-carriers/index.d.ts",
+        "default": "./esm/elements/manage-external-carriers/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/manage-external-carriers/index.d.ts",
+        "default": "./cjs/elements/manage-external-carriers/index.cjs"
+      }
+    },
+    "./manage-funding": {
+      "source": "./src/elements/manage-funding/index.ts",
+      "import": {
+        "types": "./types/src/elements/manage-funding/index.d.ts",
+        "default": "./esm/elements/manage-funding/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/manage-funding/index.d.ts",
+        "default": "./cjs/elements/manage-funding/index.cjs"
+      }
+    },
+    "./manage-warehouses": {
+      "source": "./src/elements/manage-warehouses/index.ts",
+      "import": {
+        "types": "./types/src/elements/manage-warehouses/index.d.ts",
+        "default": "./esm/elements/manage-warehouses/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/manage-warehouses/index.d.ts",
+        "default": "./cjs/elements/manage-warehouses/index.cjs"
+      }
+    },
+    "./payment-method-settings": {
+      "source": "./src/elements/payment-method-settings/index.ts",
+      "import": {
+        "types": "./types/src/elements/payment-method-settings/index.d.ts",
+        "default": "./esm/elements/payment-method-settings/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/payment-method-settings/index.d.ts",
+        "default": "./cjs/elements/payment-method-settings/index.cjs"
+      }
+    },
+    "./purchase-label": {
+      "source": "./src/elements/purchase-label/index.ts",
+      "import": {
+        "types": "./types/src/elements/purchase-label/index.d.ts",
+        "default": "./esm/elements/purchase-label/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/purchase-label/index.d.ts",
+        "default": "./cjs/elements/purchase-label/index.cjs"
+      }
+    },
+    "./select-label-layout": {
+      "source": "./src/elements/select-label-layout/index.ts",
+      "import": {
+        "types": "./types/src/elements/select-label-layout/index.d.ts",
+        "default": "./esm/elements/select-label-layout/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/select-label-layout/index.d.ts",
+        "default": "./cjs/elements/select-label-layout/index.cjs"
+      }
+    },
+    "./shipment-summary": {
+      "source": "./src/elements/shipment-summary/index.ts",
+      "import": {
+        "types": "./types/src/elements/shipment-summary/index.d.ts",
+        "default": "./esm/elements/shipment-summary/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/shipment-summary/index.d.ts",
+        "default": "./cjs/elements/shipment-summary/index.cjs"
+      }
+    },
+    "./shipments-grid": {
+      "source": "./src/elements/shipments-grid/index.ts",
+      "import": {
+        "types": "./types/src/elements/shipments-grid/index.d.ts",
+        "default": "./esm/elements/shipments-grid/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/shipments-grid/index.d.ts",
+        "default": "./cjs/elements/shipments-grid/index.cjs"
+      }
+    },
+    "./theme-creator": {
+      "source": "./src/elements/theme-creator/index.ts",
+      "import": {
+        "types": "./types/src/elements/theme-creator/index.d.ts",
+        "default": "./esm/elements/theme-creator/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/theme-creator/index.d.ts",
+        "default": "./cjs/elements/theme-creator/index.cjs"
+      }
+    },
+    "./transaction-history": {
+      "source": "./src/elements/transaction-history/index.ts",
+      "import": {
+        "types": "./types/src/elements/transaction-history/index.d.ts",
+        "default": "./esm/elements/transaction-history/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/transaction-history/index.d.ts",
+        "default": "./cjs/elements/transaction-history/index.cjs"
+      }
+    },
+    "./unit-settings": {
+      "source": "./src/elements/unit-settings/index.ts",
+      "import": {
+        "types": "./types/src/elements/unit-settings/index.d.ts",
+        "default": "./esm/elements/unit-settings/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/unit-settings/index.d.ts",
+        "default": "./cjs/elements/unit-settings/index.cjs"
+      }
+    },
+    "./vat-settings": {
+      "source": "./src/elements/vat-settings/index.ts",
+      "import": {
+        "types": "./types/src/elements/vat-settings/index.d.ts",
+        "default": "./esm/elements/vat-settings/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/vat-settings/index.d.ts",
+        "default": "./cjs/elements/vat-settings/index.cjs"
+      }
+    },
+    "./void-label": {
+      "source": "./src/elements/void-label/index.ts",
+      "import": {
+        "types": "./types/src/elements/void-label/index.d.ts",
+        "default": "./esm/elements/void-label/index.js"
+      },
+      "require": {
+        "types": "./types/src/elements/void-label/index.d.ts",
+        "default": "./cjs/elements/void-label/index.cjs"
+      }
+    },
+    "./account-settings": {
+      "source": "./src/workflows/account-settings/index.ts",
+      "import": {
+        "types": "./types/src/workflows/account-settings/index.d.ts",
+        "default": "./esm/workflows/account-settings/index.js"
+      },
+      "require": {
+        "types": "./types/src/workflows/account-settings/index.d.ts",
+        "default": "./cjs/workflows/account-settings/index.cjs"
+      }
+    },
+    "./onboarding": {
+      "source": "./src/workflows/onboarding/index.ts",
+      "import": {
+        "types": "./types/src/workflows/onboarding/index.d.ts",
+        "default": "./esm/workflows/onboarding/index.js"
+      },
+      "require": {
+        "types": "./types/src/workflows/onboarding/index.d.ts",
+        "default": "./cjs/workflows/onboarding/index.cjs"
+      }
+    },
+    "./label-workflow": {
+      "source": "./src/workflows/label-workflow/index.ts",
+      "import": {
+        "types": "./types/src/workflows/label-workflow/index.d.ts",
+        "default": "./esm/workflows/label-workflow/index.js"
+      },
+      "require": {
+        "types": "./types/src/workflows/label-workflow/index.d.ts",
+        "default": "./cjs/workflows/label-workflow/index.cjs"
+      }
+    },
+    "./carrier-services": {
+      "source": "./src/workflows/carrier-services/index.ts",
+      "import": {
+        "types": "./types/src/workflows/carrier-services/index.d.ts",
+        "default": "./esm/workflows/carrier-services/index.js"
+      },
+      "require": {
+        "types": "./types/src/workflows/carrier-services/index.d.ts",
+        "default": "./cjs/workflows/carrier-services/index.cjs"
+      }
+    },
+    "./connect-external-carriers ": {
+      "source": "./src/workflows/connect-external-carrier/index.ts",
+      "import": {
+        "types": "./types/src/workflows/connect-external-carrier/index.d.ts",
+        "default": "./esm/workflows/connect-external-carrier/index.js"
+      },
+      "require": {
+        "types": "./types/src/workflows/connect-external-carrier/index.d.ts",
+        "default": "./cjs/workflows/connect-external-carrier/index.cjs"
+      }
+    }
   },
-  "module": "./index.js",
-  "main": "./index.js",
   "type": "module",
-  "types": "./src/index.d.ts",
   "dependencies": {
-    "@emotion/serialize": "1.1.1",
     "@hookform/resolvers": "2.9.11",
     "@jest/globals": "28.1.3",
     "@rjsf/core": "5.16.1",
     "@rjsf/utils": "5.16.1",
     "@rjsf/validator-ajv8": "5.16.1",
-    "@shipengine/giger": "1.20.14",
+    "@rollup/plugin-node-resolve": "13.3.0",
+    "@shipengine/giger": "1.20.18",
     "@shipengine/giger-theme": "1.8.1",
-    "@shipengine/js-api": "3.2.0",
-    "@shipengine/react-api": "3.8.3",
+    "@shipengine/js-api": "3.6.0",
+    "@shipengine/react-api": "3.10.3",
     "@tanstack/react-query": "4.36.1",
     "@testing-library/dom": "8.19.0",
-    "axios": "1.7.4",
+    "axios": "1.8.4",
     "card-validator": "8.1.1",
     "classnames": "2.5.1",
     "copy-to-clipboard": "3.3.3",
     "date-fns": "3.6.0",
     "expect": "28.1.3",
+    "glob": "7.2.3",
     "humps": "2.0.1",
     "i18next-browser-languagedetector": "6.1.8",
     "js-base64": "3.7.3",
@@ -58,6 +289,7 @@
     "react-hook-form": "7.40.0",
     "react-use": "17.4.2",
     "rollup-plugin-copy": "3.4.0",
+    "rollup-plugin-typescript2": "0.34.1",
     "use-debounce": "10.0.0",
     "zod": "3.19.1"
   }

package/types/src/components/address-preference-context/address-preference-context.d.ts

@@ -0,0 +1,57 @@
+import { RegisterFundingSourceCarrierPayload } from "../../features/manage-carriers/register-funding-source-carrier-form";
+import { ReactNode } from "react";
+import { SE } from "@shipengine/js-api";
+import { AddressValidationPreference } from "../address-preference-select";
+import { WalletPayload } from "../forms/wallet-form";
+import { WarehousePayload } from "../forms/warehouse-form";
+type WarehouseData = Pick<WarehousePayload, "name" | "isDefault" | "warehouseId">;
+type WalletData = {
+    creditCard: WalletPayload["creditCard"];
+    iovationBlackbox: WalletPayload["iovationBlackbox"];
+};
+type WalletUpdateData = Omit<WalletData, "iovationBlackbox"> & Partial<Pick<WalletData, "iovationBlackbox">>;
+type RegisterFundingSourceCarrierData = {
+    agreeToTerms: RegisterFundingSourceCarrierPayload["agreeToTerms"];
+};
+type InternalValidateAddressPayload = {
+    addresses: {
+        originAddress: SE.Address;
+        returnAddress?: SE.Address | undefined;
+    };
+    data?: WarehouseData | WalletData | WalletUpdateData | RegisterFundingSourceCarrierData;
+    onValid: (payload: {
+        originAddress: SE.Address;
+        returnAddress?: SE.Address;
+    }) => void;
+};
+export type ValidationPreference = {
+    originAddress: AddressValidationPreference;
+    returnAddress?: AddressValidationPreference;
+};
+export type AddressPreferenceProviderProps = {
+    children: ReactNode;
+    className?: string;
+    formHeader?: React.ReactNode;
+    onSubmit: (payload: {
+        originAddress: SE.Address;
+        passengerData: InternalValidateAddressPayload["data"];
+        returnAddress?: SE.Address | undefined;
+    }) => Promise<void> | void;
+    userInput?: {
+        originAddress: SE.Address;
+        returnAddress?: SE.Address | undefined;
+    };
+};
+export type AddressPreferenceValue = {
+    data: InternalValidateAddressPayload["data"];
+    userInput?: {
+        originAddress: SE.Address;
+        returnAddress?: SE.Address | undefined;
+    };
+    validateAddress: (payload: InternalValidateAddressPayload) => Promise<void>;
+    validationPreference?: ValidationPreference;
+};
+export declare const AddressPreferenceContext: import("react").Context<AddressPreferenceValue | undefined>;
+export declare const AddressPreferenceProvider: (props: AddressPreferenceProviderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const useAddressPreference: () => AddressPreferenceValue;
+export {};

package/types/src/components/address-preference-display/address-preference-display.d.ts

@@ -0,0 +1,16 @@
+import { SE } from "@shipengine/react-api";
+export type AddressPreference = SE.AddressValidation & {
+    alternative?: SE.Address;
+    alternativeSource: "originalAddress" | "matchedAddress";
+    isModified: boolean;
+    selection: SE.ShippingAddressTo;
+    selectionSource: "originalAddress" | "matchedAddress";
+    toggle: () => SE.Address;
+};
+export type AddressPreferenceDisplayProps = {
+    addressPreference: AddressPreference;
+    onChangePreference?: (selectedAddress: SE.Address) => Promise<void>;
+    onEditAddress?: () => void;
+    onToggleDisclosure?: (isOpen: boolean, addressPreference: AddressPreference) => void;
+};
+export declare const AddressPreferenceDisplay: ({ addressPreference, onChangePreference, onEditAddress, onToggleDisclosure, }: AddressPreferenceDisplayProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/src/components/carrier-balance/carrier-balance.styles.d.ts

@@ -0,0 +1,5 @@
+export declare const styles: {
+    getBalanceText: (balance?: number) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        color: string;
+    };
+};

package/types/src/components/carrier-connection-card/carrier-connection-card.styles.d.ts

@@ -0,0 +1,35 @@
+export declare const styles: {
+    article: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        ":hover": {
+            borderColor: string;
+        };
+        alignItems: "center";
+        border: string;
+        borderRadius: number;
+        cursor: "pointer";
+        display: "flex";
+        flexDirection: "row";
+        flexWrap: "nowrap";
+        paddingBottom: number;
+        paddingLeft: number;
+        paddingRight: number;
+        paddingTop: number;
+        position: "relative";
+    };
+    carrierLogo: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        flex: string;
+        marginRight: number;
+        maxHeight: string;
+        width: string;
+    };
+    carrierName: () => {
+        display: "block";
+        flex: string;
+    };
+    spacer: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "block";
+        flex: string;
+        height: string;
+        position: "relative";
+    };
+};

package/types/src/components/carrier-icon/carrier-icon.d.ts

@@ -0,0 +1,13 @@
+import { IconSize } from "@shipengine/giger";
+export declare const styles: {
+    getIconSize: (size: IconSize) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        height: string;
+        width: string;
+    };
+};
+export type CarrierIconProps = {
+    carrierCode: string;
+    carrierName?: string;
+    size?: IconSize;
+};
+export declare const CarrierIcon: ({ carrierCode, carrierName, size, }: CarrierIconProps) => import("@emotion/react/jsx-runtime").JSX.Element;

package/types/src/components/cc-provider-logo/cc-provider-logo.d.ts

@@ -0,0 +1,7 @@
+import { Provider } from "@shipengine/js-api";
+type CcProviderLogoProps = {
+    provider?: Provider;
+    width?: number;
+};
+export declare const CcProviderLogo: ({ provider, width }: CcProviderLogoProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export {};

package/types/src/components/cc-provider-logo/index.d.ts

@@ -0,0 +1 @@
+export * from "./cc-provider-logo";

package/types/src/components/collapsible-panel/collapsible-panel.styles.d.ts

@@ -0,0 +1,20 @@
+export declare const styles: {
+    button: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        alignItems: "center";
+        backgroundColor: "transparent";
+        color: string;
+        display: "flex";
+        fontWeight: number;
+        justifyContent: "space-between";
+        padding: number;
+        width: string;
+    };
+    getContentStyles: (nested?: boolean) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        padding: number;
+    };
+    getHeaderStyles: (nested?: boolean) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        backgroundColor: string;
+        display: "flex";
+        padding: string;
+    };
+};

package/types/src/components/disclosure/disclosure.styles.d.ts

@@ -0,0 +1,22 @@
+export declare const styles: {
+    container: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        gap: number;
+        paddingBottom: number;
+    };
+    content: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        [x: string]: string | number | {
+            maxWidth: string;
+        };
+        backgroundColor: string;
+        maxWidth: string;
+        padding: number;
+    };
+    toggle: {
+        backgroundColor: "transparent";
+        border: number;
+        cursor: "pointer";
+        lineHeight: number;
+        padding: number;
+    };
+};

package/types/src/components/display-term/display-term.styles.d.ts

@@ -0,0 +1,25 @@
+export declare const styles: {
+    container: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        flexDirection: "column";
+        gap: number;
+        padding: string;
+    };
+    link: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        "&:visited": {
+            color: string;
+        };
+        fontWeight: number;
+    };
+    termLink: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        flexDirection: "column";
+        gap: number;
+        listStyle: "none";
+    };
+    terms: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        flexDirection: "column";
+        gap: number;
+    };
+};

package/types/src/components/drawer/drawer.styles.d.ts

@@ -0,0 +1,27 @@
+export declare const styles: {
+    container: {
+        backgroundColor: "#11003A";
+    };
+    getChildrenStyles: (isOpen?: boolean) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        height: string;
+        overflow: "scroll";
+        paddingBottom: number;
+    };
+    getDrawerStyles: (isOpen?: boolean) => (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        backgroundColor: "#11003A";
+        bottom: number;
+        height: string;
+        minWidth: string;
+        position: "fixed";
+        transformOrigin: string;
+        transition: "height 0.5s;";
+    };
+    headerStyles: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        alignItems: "center";
+        color: "#fff";
+        display: "flex";
+        height: number;
+        justifyContent: "space-between";
+        padding: number;
+    };
+};

package/types/src/components/enable-insurance-banner/enable-insurance-banner.styles.d.ts

@@ -0,0 +1,37 @@
+export declare const styles: {
+    container: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        border: string;
+        borderRadius: number;
+        display: "flex";
+        flexDirection: "column";
+        gap: number;
+        lineHeight: string;
+        padding: number;
+    };
+    description: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        fontSize: string;
+    };
+    link: {
+        cursor: "pointer";
+        fontWeight: "normal";
+        textDecoration: string;
+    };
+    successContainer: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        border: string;
+        borderRadius: number;
+        display: "flex";
+        gap: number;
+        lineHeight: string;
+        padding: number;
+    };
+    successMessage: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        flex: number;
+        flexDirection: "column";
+        gap: number;
+    };
+    title: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        display: "flex";
+        gap: number;
+    };
+};

package/types/src/components/error-display/error-display.styles.d.ts

@@ -0,0 +1,19 @@
+export declare const styles: {
+    errorContainer: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        alignItems: "center";
+        backgroundColor: string;
+        display: "flex";
+        flexDirection: "column";
+        paddingBottom: number;
+        paddingTop: number;
+        rowGap: number;
+    };
+    errorCTA: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        color: string;
+        fontSize: string;
+        lineHeight: string;
+    };
+    errorHeading: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        fontSize: string;
+    };
+};

package/types/src/components/error-state/error-state.styles.d.ts

@@ -0,0 +1,18 @@
+export declare const styles: {
+    container: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        alignItems: "center";
+        display: "flex";
+        flexDirection: "column";
+        margin: string;
+        padding: number;
+        rowGap: number;
+        textAlign: "center";
+    };
+    icon: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        color: string;
+    };
+    subtitleContainer: {
+        display: "flex";
+        flexDirection: "column";
+    };
+};

package/types/src/components/field/field.styles.d.ts

@@ -0,0 +1,14 @@
+export declare const styles: {
+    overrideStyles: (theme: import("../../utilities/styles").ScopedGigerTheme) => {
+        "&& input, && span[role='button']": {
+            cursor: "auto";
+            fontWeight: number;
+        };
+        "&& input:hover": {
+            cursor: "pointer";
+        };
+        "&&.disabled input:hover": {
+            cursor: "not-allowed";
+        };
+    };
+};