@shipengine/elements 2.20.0 → 2.22.0

package/cjs/elements-provider/elements-context-provider.cjs

@@ -0,0 +1,85 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var React = require('react');
+var featureFlags = require('../utilities/feature-flags/feature-flags.cjs');
+
+const DEFAULT_LOCALE = "en-US";
+/**
+ * @category Contexts
+ */
+const ElementsContext = /*#__PURE__*/React.createContext(undefined);
+const getDefaultLocale = () => {
+  var _a;
+  /**
+   * We need to check if window is defined as some applications
+   * use Elements with a Server Side framework where window.navigator is not defined
+   */
+  if (typeof window === "undefined") {
+    return DEFAULT_LOCALE;
+  }
+  return (_a = navigator === null || navigator === void 0 ? void 0 : navigator.language) !== null && _a !== void 0 ? _a : DEFAULT_LOCALE;
+};
+/**
+ * @category Providers
+ */
+const ElementsContextProvider = ({
+  baseURL: _baseURL = "https://elements.shipengine.com",
+  cdnURL: _cdnURL = "https://cdn.packlink.com",
+  children,
+  container,
+  features,
+  getToken,
+  locale: localeProp,
+  onError: _onError = () => {},
+  scope: _scope = "lmnt",
+  theme,
+  emotionCacheShadowRootContainer
+}) => {
+  var _a;
+  const locale = localeProp || getDefaultLocale();
+  const defaultGlobalFeatures = featureFlags.getDefaultFeatures(["globalFeatures"]);
+  const globalFeatures = Object.assign(Object.assign({}, defaultGlobalFeatures), (_a = features === null || features === void 0 ? void 0 : features.globalFeatures) !== null && _a !== void 0 ? _a : {});
+  const getFeatures = key => {
+    var _a;
+    return featureFlags.deepMergeFeatures((_a = featureFlags.getDefaultFeatures([key])) !== null && _a !== void 0 ? _a : {}, features === null || features === void 0 ? void 0 : features[key]);
+  };
+  const value = {
+    baseURL: _baseURL,
+    cdnURL: _cdnURL,
+    container,
+    emotionCacheShadowRootContainer,
+    getFeatures,
+    getToken,
+    globalFeatures,
+    locale,
+    onError: _onError,
+    scope: _scope,
+    theme
+  };
+  return jsxRuntime.jsx(ElementsContext.Provider, Object.assign({
+    value: value
+  }, {
+    children: children
+  }));
+};
+/**
+ * Must be used within {@link ElementsProvider}
+ *
+ * @category Elements Hooks
+ *
+ * @see {@link registerElement}
+ */
+const useElements = () => {
+  const context = React.useContext(ElementsContext);
+  if (!context) {
+    throw new Error("useElements must be called from within the scope of ElementsProvider");
+  }
+  return context;
+};
+
+exports.ElementsContext = ElementsContext;
+exports.ElementsContextProvider = ElementsContextProvider;
+exports.useElements = useElements;

package/cjs/elements-provider/elements-provider.cjs

@@ -0,0 +1,127 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var useRootPortal = require('../hooks/use-root-portal.cjs');
+var axios = require('axios');
+var React = require('react');
+var reactDom = require('react-dom');
+var giger = require('@shipengine/giger');
+var gigerTheme = require('@shipengine/giger-theme');
+var reactApi = require('@shipengine/react-api');
+var _package = require('../package.cjs');
+var index = require('../themes/index.cjs');
+var elementsContextProvider = require('./elements-context-provider.cjs');
+var useLoadIcons = require('./hooks/use-load-icons.cjs');
+
+/**
+ * @category Providers
+ */
+const ElementsProvider = ({
+  baseURL: _baseURL = "https://elements.shipengine.com",
+  cdnURL: _cdnURL = "https://cdn.packlink.com",
+  children,
+  container,
+  features,
+  getToken,
+  headers,
+  locale,
+  onApiError,
+  onError: _onError = () => {},
+  scope: _scope = "lmnt",
+  themeConfig,
+  defaultQueryClientOptions,
+  emotionCacheShadowRootContainer
+}) => {
+  var _a;
+  const resolveIcon = useLoadIcons.useLoadIcons({
+    cdnURL: _cdnURL
+  });
+  const theme = React.useMemo(() => {
+    var _a;
+    // The theme class expects a basic theme object, but we allow a THEME_ID key wrapped object to be used
+    // using the THEME_ID key in the prop causes the resultant theme clas to be passed to the GigerProvider
+    // wrapped with the THEME_ID key which causes it to use a "scoped" css-in-js emotion provider
+    const themeObject = new gigerTheme.Theme((_a = themeConfig && giger.THEME_ID in themeConfig ? themeConfig[giger.THEME_ID] : themeConfig) !== null && _a !== void 0 ? _a : index.fallback);
+    return themeConfig && giger.THEME_ID in themeConfig ? {
+      [giger.THEME_ID]: themeObject
+    } : themeObject;
+  }, [themeConfig]);
+  const elementsContainerRef = React.useRef(null);
+  const [shadowRoot, setShadowRoot] = React.useState();
+  const isShadowDomEnabled = "attachShadow" in HTMLElement.prototype && !((_a = features === null || features === void 0 ? void 0 : features.globalFeatures) === null || _a === void 0 ? void 0 : _a.disableShadowDOM);
+  React.useEffect(() => {
+    var _a;
+    if (isShadowDomEnabled) {
+      // use provided container as shadow dom root
+      if (container && !(container instanceof ShadowRoot) && !container.shadowRoot) {
+        setShadowRoot(container.attachShadow({
+          mode: "open"
+        }));
+      } else if (emotionCacheShadowRootContainer) {
+        // use provided shadow dom root
+        setShadowRoot(emotionCacheShadowRootContainer);
+      } else if (
+      // if no container was provided, use the elements-container
+      elementsContainerRef.current && !((_a = elementsContainerRef.current) === null || _a === void 0 ? void 0 : _a.shadowRoot)) {
+        setShadowRoot(elementsContainerRef.current.attachShadow({
+          mode: "open"
+        }));
+      }
+    }
+  }, [emotionCacheShadowRootContainer, elementsContainerRef, container, isShadowDomEnabled]);
+  const elementsContextProps = {
+    baseURL: _baseURL,
+    cdnURL: _cdnURL,
+    container,
+    emotionCacheShadowRootContainer: shadowRoot,
+    features,
+    getToken,
+    locale,
+    onError: _onError,
+    scope: _scope,
+    theme
+  };
+  const Elements = jsxRuntime.jsx(elementsContextProvider.ElementsContextProvider, Object.assign({}, elementsContextProps, {
+    children: jsxRuntime.jsx(giger.GigerProvider, Object.assign({
+      cdnUrl: _cdnURL,
+      emotionCacheShadowRootContainer: shadowRoot,
+      reference: _scope || undefined,
+      resolveIcon: resolveIcon,
+      theme: theme
+    }, {
+      children: jsxRuntime.jsx(reactApi.ShipEngine, Object.assign({
+        baseURL: _baseURL,
+        defaultQueryClientOptions: defaultQueryClientOptions,
+        getToken: getToken,
+        headers: new axios.AxiosHeaders(Object.assign(Object.assign({}, headers), {
+          "x-se-elements-version": `react-${_package.version}`
+        })),
+        onApiError: onApiError
+      }, {
+        children: jsxRuntime.jsx(useRootPortal.RootPortalProvider, Object.assign({
+          emotionCacheShadowRootContainer: shadowRoot
+        }, {
+          children: children
+        }))
+      }))
+    }))
+  }));
+  if (!isShadowDomEnabled) return Elements;
+  if (container) {
+    // if a container was provided, that will be used as the root element
+    return shadowRoot ? /*#__PURE__*/reactDom.createPortal(Elements, shadowRoot) : null;
+  }
+  return (
+    // if no container was provided, we will create a new root element
+    jsxRuntime.jsx("div", Object.assign({
+      id: "elements-container",
+      ref: elementsContainerRef
+    }, {
+      children: shadowRoot && /*#__PURE__*/reactDom.createPortal(Elements, shadowRoot)
+    }))
+  );
+};
+
+exports.ElementsProvider = ElementsProvider;

package/cjs/elements-provider/elements-test-provider.cjs

@@ -0,0 +1,55 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var React = require('react');
+var giger = require('@shipengine/giger');
+var gigerTheme = require('@shipengine/giger-theme');
+var reactApi = require('@shipengine/react-api');
+var elementsContextProvider = require('./elements-context-provider.cjs');
+var featureFlags = require('../utilities/feature-flags/feature-flags.cjs');
+
+const ElementsTestProvider = ({
+  baseURL,
+  children,
+  features
+}) => {
+  const scope = "lmnt";
+  const theme = React.useMemo(() => new gigerTheme.Theme(), []);
+  const defaultGlobalFeatures = featureFlags.getDefaultFeatures(["globalFeatures"]);
+  const getToken = React.useCallback(() => "none", []);
+  const globalFeatures = Object.assign(Object.assign({
+    enabledExternalCarriers: ["apc", "asendia", "better_trucks", "canpar", "chronopost", "couriers_please", "courierpost", "dpd", "hermes_germany", "intelliquick_delivery", "lso", "ontrac", "seko", "ups", "yodel"]
+  }, defaultGlobalFeatures), features.globalFeatures);
+  const getFeatures = key => {
+    var _a;
+    return featureFlags.deepMergeFeatures((_a = featureFlags.getDefaultFeatures([key])) !== null && _a !== void 0 ? _a : {}, features === null || features === void 0 ? void 0 : features[key]);
+  };
+  const contextValue = {
+    baseURL,
+    cdnURL: "mockCdnUrl",
+    getFeatures,
+    getToken,
+    globalFeatures,
+    onError: () => {},
+    scope,
+    theme
+  };
+  return jsxRuntime.jsx(elementsContextProvider.ElementsContext.Provider, Object.assign({
+    value: contextValue
+  }, {
+    children: jsxRuntime.jsx(giger.GigerTestProvider, Object.assign({
+      theme: theme
+    }, {
+      children: jsxRuntime.jsx(reactApi.ShipEngine, Object.assign({
+        baseURL: baseURL,
+        getToken: getToken
+      }, {
+        children: children
+      }))
+    }))
+  }));
+};
+
+exports.ElementsTestProvider = ElementsTestProvider;

package/cjs/elements-provider/hooks/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var useLoadIcons = require('./use-load-icons.cjs');
+
+
+
+exports.useLoadIcons = useLoadIcons.useLoadIcons;

package/cjs/elements-provider/hooks/use-load-icons.cjs

@@ -0,0 +1,29 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var axios = require('axios');
+var React = require('react');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var axios__default = /*#__PURE__*/_interopDefaultLegacy(axios);
+
+const useLoadIcons = ({
+  cdnURL
+}) => {
+  return React.useCallback(iconName => tslib.__awaiter(void 0, void 0, void 0, function* () {
+    // In order to remove dependencies on Giger brand library, this temporarily
+    // precludes the use of brand-specific icon overrides, until an updated
+    // Giger provider allows a different mechanism for such overrides.
+    const fallbackBrandName = "fallback";
+    const result = yield axios__default["default"].get(`/brand/${fallbackBrandName}/icons/${iconName.toLowerCase()}.svg`, {
+      baseURL: cdnURL,
+      responseType: "text"
+    });
+    return result.data;
+  }), [cdnURL]);
+};
+
+exports.useLoadIcons = useLoadIcons;

package/cjs/elements-provider/index.cjs

@@ -0,0 +1,15 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var elementsContextProvider = require('./elements-context-provider.cjs');
+var elementsProvider = require('./elements-provider.cjs');
+var elementsTestProvider = require('./elements-test-provider.cjs');
+
+
+
+exports.ElementsContext = elementsContextProvider.ElementsContext;
+exports.ElementsContextProvider = elementsContextProvider.ElementsContextProvider;
+exports.useElements = elementsContextProvider.useElements;
+exports.ElementsProvider = elementsProvider.ElementsProvider;
+exports.ElementsTestProvider = elementsTestProvider.ElementsTestProvider;

package/cjs/extensions/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var zod = require('./zod.cjs');
+
+
+
+exports.extendZod = zod.extendZod;

package/cjs/extensions/zod.cjs

@@ -0,0 +1,24 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var zod = require('zod');
+
+/* eslint-disable @typescript-eslint/no-unused-vars -- Allow unused generics in ZodObject interface overload */
+function nullishDefault(defaultValue) {
+  return this.nullish().transform(v => v !== null && v !== void 0 ? v : defaultValue);
+}
+/**
+ * @internal
+ *
+ * # Form Utilities
+ *
+ * @category Form Validation
+ */
+const extendZod = () => {
+  zod.z.ZodString.prototype.nullishDefault = nullishDefault;
+  zod.z.ZodNumber.prototype.nullishDefault = nullishDefault;
+  zod.z.ZodObject.prototype.nullishDefault = nullishDefault;
+};
+
+exports.extendZod = extendZod;

package/cjs/features/manage-carriers/hooks/index.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var useCarrierMetadata = require('./use-carrier-metadata.cjs');
+var useListFundingSourceCarriers = require('./use-list-funding-source-carriers.cjs');
+
+
+
+exports.useCarrierMetadata = useCarrierMetadata.useCarrierMetadata;
+exports.useListFundingSourceCarriers = useListFundingSourceCarriers.useListFundingSourceCarriers;

package/cjs/features/manage-carriers/hooks/use-carrier-metadata.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var carrierMetadatas = require('../../../data/carrier-metadatas.cjs');
+
+const useCarrierMetadata = () => {
+  return carrierMetadatas["default"];
+};
+
+exports.useCarrierMetadata = useCarrierMetadata;

package/cjs/features/manage-carriers/hooks/use-list-funding-source-carriers.cjs

@@ -0,0 +1,74 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var carrier = require('../../../utilities/shipengine/carrier.cjs');
+var insurance = require('../../../utilities/shipengine/insurance.cjs');
+var React = require('react');
+var reactApi = require('@shipengine/react-api');
+var useCarrierMetadata = require('./use-carrier-metadata.cjs');
+
+const useListFundingSourceCarriers = () => {
+  var _a, _b;
+  const {
+    data: connectedCarriers,
+    error,
+    isInitialLoading,
+    refetch
+  } = reactApi.useListCarriers();
+  const {
+    data: fundingSourceMetadata,
+    isLoading: isFundingSourceMetadataLoading
+  } = reactApi.useGetFundingSourceMetadata();
+  const {
+    data: insuranceProviderAcceptedTerms,
+    isLoading: isInsuranceProviderAcceptedTermsLoading,
+    refetch: refetchInsuranceProviderAcceptedTerms
+  } = reactApi.useGetInsuranceFundingSourceAcceptedTerms();
+  const {
+    carrierProfiles: fundingSourceCarrierProfiles,
+    countryCode: fundingSourceRegion
+  } = (_a = fundingSourceMetadata === null || fundingSourceMetadata === void 0 ? void 0 : fundingSourceMetadata.defaultRegionProfile) !== null && _a !== void 0 ? _a : {
+    carrierProfiles: []
+  };
+  const {
+    optionalTerms
+  } = (_b = fundingSourceMetadata === null || fundingSourceMetadata === void 0 ? void 0 : fundingSourceMetadata.defaultFundingSourceProfile) !== null && _b !== void 0 ? _b : {
+    optionalTerms: []
+  };
+  const carrierProfiles = carrier.filterFundingSourceCarriers(fundingSourceCarrierProfiles, fundingSourceRegion);
+  //TODO: Remove hardcoded carrierMetadata and insuranceProviderMetadata when the friendlyName is available in the funding source metadata response
+  const carrierMetadata = useCarrierMetadata.useCarrierMetadata();
+  const insuranceProviderProfiles = React.useMemo(() => {
+    return optionalTerms.map(t => {
+      return Object.assign({
+        agreedToTerms: insurance.getIsInsuraceProviderAccepted(t.termType, insuranceProviderAcceptedTerms === null || insuranceProviderAcceptedTerms === void 0 ? void 0 : insuranceProviderAcceptedTerms.acceptedTerms),
+        terms: Object.assign({}, t)
+      }, insurance.getInsuranceProviderWithFriendlyName(t.termType));
+    });
+  }, [optionalTerms, insuranceProviderAcceptedTerms]);
+  const normalizeConnectedCarrierCodes = new Set(connectedCarriers === null || connectedCarriers === void 0 ? void 0 : connectedCarriers.map(c => {
+    var _a;
+    return c.carrierCode === "usps" || ((_a = c.nickname) === null || _a === void 0 ? void 0 : _a.includes("free")) ? "stamps_com" : c.carrierCode;
+  }));
+  const fundingSourceCarrierMetadata = carrierProfiles === null || carrierProfiles === void 0 ? void 0 : carrierProfiles.map(cp => {
+    var _a, _b;
+    return {
+      carrierProfile: cp,
+      friendlyName: (_b = (_a = carrierMetadata[cp.carrierCode]) === null || _a === void 0 ? void 0 : _a.name) !== null && _b !== void 0 ? _b : cp.carrierCode
+    };
+  });
+  return {
+    data: fundingSourceCarrierMetadata === null || fundingSourceCarrierMetadata === void 0 ? void 0 : fundingSourceCarrierMetadata.map(m => ({
+      carrier: m,
+      isConnected: normalizeConnectedCarrierCodes.has(m.carrierProfile.carrierCode)
+    })),
+    error: error,
+    insuranceProviderProfiles,
+    isLoading: isInitialLoading || isFundingSourceMetadataLoading || isInsuranceProviderAcceptedTermsLoading,
+    refetch,
+    refetchInsuranceProviderAcceptedTerms
+  };
+};
+
+exports.useListFundingSourceCarriers = useListFundingSourceCarriers;

package/cjs/features/manage-carriers/index.cjs

@@ -0,0 +1,11 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var manageCarriers = require('./manage-carriers.cjs');
+var useManageCarriers = require('./use-manage-carriers.cjs');
+
+
+
+exports.ShipEngineCarriers = manageCarriers.ShipEngineCarriers;
+exports.useManageCarriers = useManageCarriers.useManageCarriers;

package/cjs/features/manage-carriers/manage-carriers-row/index.cjs

@@ -0,0 +1,9 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var manageCarriersRow = require('./manage-carriers-row.cjs');
+
+
+
+exports.ManageCarriersRow = manageCarriersRow.ManageCarriersRow;

package/cjs/features/manage-carriers/manage-carriers-row/manage-carriers-row.cjs

@@ -0,0 +1,112 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var tslib = require('tslib');
+var jsxRuntime = require('@emotion/react/jsx-runtime');
+var React = require('react');
+var reactI18next = require('react-i18next');
+var giger = require('@shipengine/giger');
+var reactApi = require('@shipengine/react-api');
+var manageCarriersRow_styles = require('./manage-carriers-row.styles.cjs');
+var addressPreferenceContext = require('../../../components/address-preference-context/address-preference-context.cjs');
+var registerFundingSourceCarrierForm = require('../register-funding-source-carrier-form/register-funding-source-carrier-form.cjs');
+var carrierIcon = require('../../../components/carrier-icon/carrier-icon.cjs');
+var linkAction = require('../../../components/link-action/link-action.cjs');
+
+const ManageCarriersRow = ({
+  fundingSourceCarrier: {
+    carrier,
+    isConnected
+  },
+  registerCarrier,
+  address,
+  carrierToConnect,
+  setCarrierToConnect
+}) => {
+  const {
+    friendlyName,
+    carrierProfile
+  } = carrier;
+  const {
+    t
+  } = reactI18next.useTranslation(["manage-carriers"]);
+  const [showDropDown, setShowDropDown] = React.useState(false);
+  const [isSubmitting, setIsSubmitting] = React.useState(false);
+  const requirementTypes = carrierProfile.registrationRequirements.map(r => r.requirementType);
+  const requiresAddress = requirementTypes.includes(reactApi.SE.MetadataRequirement.PickupAddress);
+  const requiresTermsAcceptance = carrierProfile.requiredTerms.length > 0;
+  const handleRegister = values => tslib.__awaiter(void 0, void 0, void 0, function* () {
+    setIsSubmitting(true);
+    showDropDown && setShowDropDown(false);
+    yield registerCarrier(values);
+    setIsSubmitting(false);
+  });
+  const handleClickConnect = () => tslib.__awaiter(void 0, void 0, void 0, function* () {
+    if (requiresAddress || requiresTermsAcceptance) {
+      setCarrierToConnect(carrierProfile.carrierCode);
+      setShowDropDown(true);
+    } else yield handleRegister();
+  });
+  return jsxRuntime.jsxs("div", Object.assign({
+    css: manageCarriersRow_styles.styles.container,
+    "data-testid": "carrier-row"
+  }, {
+    children: [jsxRuntime.jsxs("div", Object.assign({
+      css: manageCarriersRow_styles.styles.rowContainer
+    }, {
+      children: [jsxRuntime.jsxs("div", Object.assign({
+        css: manageCarriersRow_styles.styles.logoContainer
+      }, {
+        children: [jsxRuntime.jsx("div", {
+          children: jsxRuntime.jsx(carrierIcon.CarrierIcon, {
+            carrierCode: carrierProfile.carrierCode,
+            carrierName: friendlyName,
+            size: giger.IconSize.SIZE_REGULAR
+          })
+        }), jsxRuntime.jsx(giger.Typography, Object.assign({
+          variant: "subtitle1"
+        }, {
+          children: friendlyName
+        }))]
+      })), !showDropDown && jsxRuntime.jsx(linkAction.LinkAction, {
+        css: manageCarriersRow_styles.styles.getConnectButton(isConnected),
+        isDisabled: isConnected,
+        isLoading: isSubmitting,
+        onClick: handleClickConnect,
+        title: isConnected ? t("manage-carriers:actions.status.connected") : t("manage-carriers:actions.status.notConnected")
+      })]
+    })), showDropDown && carrierToConnect === carrierProfile.carrierCode && jsxRuntime.jsx("div", Object.assign({
+      css: {
+        padding: "0 16px 16px"
+      }
+    }, {
+      children: jsxRuntime.jsx(addressPreferenceContext.AddressPreferenceProvider, Object.assign({
+        onSubmit: _a => tslib.__awaiter(void 0, void 0, void 0, function* () {
+          var _b;
+          var {
+              passengerData
+            } = _a,
+            rest = tslib.__rest(_a, ["passengerData"]);
+          yield handleRegister(Object.assign(Object.assign({}, passengerData), {
+            pickupAddress: Object.assign(Object.assign({}, rest.originAddress), {
+              company: (_b = rest.originAddress.companyName) !== null && _b !== void 0 ? _b : "",
+              email: rest.originAddress.email,
+              fullName: rest.originAddress.name
+            })
+          }));
+        })
+      }, {
+        children: jsxRuntime.jsx(registerFundingSourceCarrierForm.RegisterFundingSourceCarrierForm, {
+          defaultAddress: address,
+          onCancel: () => setShowDropDown(false),
+          onSubmit: handleRegister,
+          requirementTypes: requirementTypes,
+          terms: carrierProfile.requiredTerms
+        })
+      }))
+    }))]
+  }));
+};
+
+exports.ManageCarriersRow = ManageCarriersRow;

package/cjs/features/manage-carriers/manage-carriers-row/manage-carriers-row.styles.cjs

@@ -0,0 +1,32 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var styles$1 = require('../../../utilities/styles.cjs');
+
+const styles = styles$1.createStyles({
+  container: {
+    display: "flex",
+    flexDirection: "column"
+  },
+  getConnectButton: isConnected => theme => Object.assign({
+    padding: `0 ${styles$1.scopeTheme(theme).spacing(0.5)}px`
+  }, isConnected && {
+    backgroundColor: styles$1.scopeTheme(theme).palette.success.main,
+    borderRadius: styles$1.scopeTheme(theme).borderRadius.XS,
+    color: styles$1.scopeTheme(theme).palette.white
+  }),
+  logoContainer: theme => ({
+    alignItems: "center",
+    columnGap: `${styles$1.scopeTheme(theme).spacing(1)}px`,
+    display: "flex"
+  }),
+  rowContainer: theme => ({
+    alignItems: "center",
+    display: "flex",
+    justifyContent: "space-between",
+    padding: `${styles$1.scopeTheme(theme).spacing(2)}px`
+  })
+});
+
+exports.styles = styles;