@shipengine/alchemy 2.1.9 → 2.2.0

package/components/element-container-provider/element-container-provider.d.ts

@@ -0,0 +1,18 @@
+type ElementContainerContextValue = {
+    elementContainer: HTMLDivElement | null;
+};
+export type ElementContainerProviderProps = {
+    children: React.ReactNode;
+    className?: string;
+};
+/**
+ * Provides the HTML element marking the boundary of the Element
+ *
+ * Useful for re-targetting portal-based UI that would otherwise render at React's #root, placing it outside of
+ * the Element and lacking any styles.
+ *
+ * @example <IconTooltip container={elementContainer} {...otherProps} />
+ */
+export declare const ElementContainerProvider: ({ children, className, }: ElementContainerProviderProps) => import("@emotion/react/jsx-runtime").JSX.Element;
+export declare const useElementContainer: () => ElementContainerContextValue;
+export {};

package/components/element-container-provider/index.d.ts

@@ -0,0 +1 @@
+export * from "./element-container-provider";

package/components/index.d.ts

@@ -1,3 +1,4 @@
 export * from "./alchemy-provider";
 export * from "./element";
+export * from "./element-container-provider";
 export * from "./error-boundary";

package/index.js

@@ -9778,6 +9778,24 @@ var classnames = {
 
 const cx = classnamesExports;
 
+const ElementContainerContext = React.createContext(void 0);
+const ElementContainerProvider = ({
+  children,
+  className
+}) => {
+  const { scope } = useAlchemy();
+  const elementContainerRef = React.useRef(null);
+  return /* @__PURE__ */ jsx(ElementContainerContext.Provider, { value: { elementContainer: elementContainerRef.current }, children: /* @__PURE__ */ jsx("div", { className: cx(scope, className), "data-testid": scope, ref: elementContainerRef, children }) });
+};
+const useElementContainer = () => {
+  const context = React.useContext(ElementContainerContext);
+  if (!context)
+    throw new Error(
+      "useElementContainer must be called from within the scope of <ElementContainerProvider />"
+    );
+  return context;
+};
+
 class ErrorBoundary extends React__namespace.Component {
   constructor(props) {
     super(props);
@@ -10249,7 +10267,7 @@ const Element = ({
 }) => {
   const { scope, onError } = useAlchemy();
   const i18n = useI18n({ resources });
-  return /* @__PURE__ */ jsx("div", { className: cx(scope, className), "data-testid": scope, children: /* @__PURE__ */ jsx(react.CacheProvider, { value: memoizedCreateCache(scope), children: /* @__PURE__ */ jsx(reactI18next.I18nextProvider, { i18n, children: /* @__PURE__ */ jsx(ErrorBoundary, { fallback: FallbackComponent, onError, children }) }) }) });
+  return /* @__PURE__ */ jsx(ElementContainerProvider, { className, children: /* @__PURE__ */ jsx(react.CacheProvider, { value: memoizedCreateCache(scope), children: /* @__PURE__ */ jsx(reactI18next.I18nextProvider, { i18n, children: /* @__PURE__ */ jsx(ErrorBoundary, { fallback: FallbackComponent, onError, children }) }) }) });
 };
 
 var __defProp = Object.defineProperty;
@@ -10327,6 +10345,7 @@ exports.CustomPackagesAPI = CustomPackagesAPI;
 exports.CustomsContentsType = CustomsContentsType;
 exports.CustomsNonDeliveryType = CustomsNonDeliveryType;
 exports.Element = Element;
+exports.ElementContainerProvider = ElementContainerProvider;
 exports.ErrorBoundary = ErrorBoundary;
 exports.FundingSourcesAPI = FundingSourcesAPI;
 exports.InsuranceAPI = InsuranceAPI;
@@ -10367,6 +10386,7 @@ exports.useCreateShipment = useCreateShipment;
 exports.useCreateWarehouse = useCreateWarehouse;
 exports.useDeleteWarehouse = useDeleteWarehouse;
 exports.useDownloadRateCard = useDownloadRateCard;
+exports.useElementContainer = useElementContainer;
 exports.useFundingSourcesAddFunds = useFundingSourcesAddFunds;
 exports.useGetAccountSettings = useGetAccountSettings;
 exports.useGetAutoFundingConfiguration = useGetAutoFundingConfiguration;

package/index.mjs

@@ -1,5 +1,5 @@
 import * as React from 'react';
-import { createContext, forwardRef, useContext, createElement as createElement$1, Fragment, useState, useEffect, useCallback, useMemo } from 'react';
+import { createContext, forwardRef, useContext, createElement as createElement$1, Fragment, useState, useEffect, useCallback, useMemo, useRef } from 'react';
 import { jsx as jsx$1, jsxs as jsxs$1 } from 'react/jsx-runtime';
 import { css, Global, ThemeProvider, CacheProvider } from '@emotion/react';
 import { BrandName } from '@packlink/brands';
@@ -9756,6 +9756,24 @@ var classnames = {
 
 const cx = classnamesExports;
 
+const ElementContainerContext = createContext(void 0);
+const ElementContainerProvider = ({
+  children,
+  className
+}) => {
+  const { scope } = useAlchemy();
+  const elementContainerRef = useRef(null);
+  return /* @__PURE__ */ jsx(ElementContainerContext.Provider, { value: { elementContainer: elementContainerRef.current }, children: /* @__PURE__ */ jsx("div", { className: cx(scope, className), "data-testid": scope, ref: elementContainerRef, children }) });
+};
+const useElementContainer = () => {
+  const context = useContext(ElementContainerContext);
+  if (!context)
+    throw new Error(
+      "useElementContainer must be called from within the scope of <ElementContainerProvider />"
+    );
+  return context;
+};
+
 class ErrorBoundary extends React.Component {
   constructor(props) {
     super(props);
@@ -10227,7 +10245,7 @@ const Element = ({
 }) => {
   const { scope, onError } = useAlchemy();
   const i18n = useI18n({ resources });
-  return /* @__PURE__ */ jsx("div", { className: cx(scope, className), "data-testid": scope, children: /* @__PURE__ */ jsx(CacheProvider, { value: memoizedCreateCache(scope), children: /* @__PURE__ */ jsx(I18nextProvider, { i18n, children: /* @__PURE__ */ jsx(ErrorBoundary, { fallback: FallbackComponent, onError, children }) }) }) });
+  return /* @__PURE__ */ jsx(ElementContainerProvider, { className, children: /* @__PURE__ */ jsx(CacheProvider, { value: memoizedCreateCache(scope), children: /* @__PURE__ */ jsx(I18nextProvider, { i18n, children: /* @__PURE__ */ jsx(ErrorBoundary, { fallback: FallbackComponent, onError, children }) }) }) });
 };
 
 var __defProp = Object.defineProperty;
@@ -10291,4 +10309,4 @@ const alchemy = {
   createElement
 };
 
-export { AccountSettingsAPI, AddressesAPI, AlchemyContext, AlchemyProvider, AlchemyTestProvider, CarriersAPI, CodedError, ConfirmationType, CreditCardVendor, Currency, CustomPackagesAPI, CustomsContentsType, CustomsNonDeliveryType, Element, ErrorBoundary, FundingSourcesAPI, InsuranceAPI, InsuranceProviderType, LabelsAPI, OrderSourcesAPI, RateCardStatus, RateCardsAPI, RatesAPI, types as SE, SalesOrderShipmentsAPI, SalesOrdersAPI, ShipEngine, ShipEngineAPI, ShipEngineContext, ShipmentsAPI, WarehousesAPI, alchemy, alchemy as default, delay, getEndUserIpAddress, isCodedError, isCodedErrors, logger, memoizedCreateCache, onError, renderAlchemyProviders, retryUntil, useAddFunds, useAlchemy, useCalculateRates, useConnectCarrier, useCreateFundingSource, useCreateLabel, useCreateRateCard, useCreateSalesOrderShipment, useCreateShipment, useCreateWarehouse, useDeleteWarehouse, useDownloadRateCard, useFundingSourcesAddFunds, useGetAccountSettings, useGetAutoFundingConfiguration, useGetCarrierById, useGetCountriesByCarrier, useGetCurrenciesByCarrier, useGetFundingSourceById, useGetInsuranceAccount, useGetLabel, useGetPackageRatingGroupByCarrier, useGetRateCardById, useGetSalesOrder, useGetSalesOrderShipment, useGetServicesByCarrier, useGetShipment, useGetShipmentRates, useGetWalletHistory, useI18n, useListCarriers, useListCustomPackageTypes, useListFundingSources, useListLabels, useListOrderSources, useListRateCards, useListSalesOrderShipments, useListSalesOrders, useListShipments, useListWarehouses, useLoadFonts, useLoadIcons, useLoadTheme, useNotifySalesOrderShipped, useParseAddress, usePublishRateCard, useRefreshOrderSource, useRefreshOrderSourceAsync, useRegisterCarrier, useShipEngine, useUpdateAccountSettings, useUpdateAutoFunding, useUpdateFundingSource, useUpdateRateCard, useUpdateSalesOrderShipment, useUpdateWarehouse, useUploadRateCard, useValidateAddresses, useVoidLabel };
+export { AccountSettingsAPI, AddressesAPI, AlchemyContext, AlchemyProvider, AlchemyTestProvider, CarriersAPI, CodedError, ConfirmationType, CreditCardVendor, Currency, CustomPackagesAPI, CustomsContentsType, CustomsNonDeliveryType, Element, ElementContainerProvider, ErrorBoundary, FundingSourcesAPI, InsuranceAPI, InsuranceProviderType, LabelsAPI, OrderSourcesAPI, RateCardStatus, RateCardsAPI, RatesAPI, types as SE, SalesOrderShipmentsAPI, SalesOrdersAPI, ShipEngine, ShipEngineAPI, ShipEngineContext, ShipmentsAPI, WarehousesAPI, alchemy, alchemy as default, delay, getEndUserIpAddress, isCodedError, isCodedErrors, logger, memoizedCreateCache, onError, renderAlchemyProviders, retryUntil, useAddFunds, useAlchemy, useCalculateRates, useConnectCarrier, useCreateFundingSource, useCreateLabel, useCreateRateCard, useCreateSalesOrderShipment, useCreateShipment, useCreateWarehouse, useDeleteWarehouse, useDownloadRateCard, useElementContainer, useFundingSourcesAddFunds, useGetAccountSettings, useGetAutoFundingConfiguration, useGetCarrierById, useGetCountriesByCarrier, useGetCurrenciesByCarrier, useGetFundingSourceById, useGetInsuranceAccount, useGetLabel, useGetPackageRatingGroupByCarrier, useGetRateCardById, useGetSalesOrder, useGetSalesOrderShipment, useGetServicesByCarrier, useGetShipment, useGetShipmentRates, useGetWalletHistory, useI18n, useListCarriers, useListCustomPackageTypes, useListFundingSources, useListLabels, useListOrderSources, useListRateCards, useListSalesOrderShipments, useListSalesOrders, useListShipments, useListWarehouses, useLoadFonts, useLoadIcons, useLoadTheme, useNotifySalesOrderShipped, useParseAddress, usePublishRateCard, useRefreshOrderSource, useRefreshOrderSourceAsync, useRegisterCarrier, useShipEngine, useUpdateAccountSettings, useUpdateAutoFunding, useUpdateFundingSource, useUpdateRateCard, useUpdateSalesOrderShipment, useUpdateWarehouse, useUploadRateCard, useValidateAddresses, useVoidLabel };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@shipengine/alchemy",
-  "version": "2.1.9",
+  "version": "2.2.0",
   "main": "./index.js",
   "types": "./index.d.ts",
   "exports": {