Unit Settings Element

The Unit Settings Element allows you to change the units of measurement you prefer to use for the dimensions and weight of the packages you ship. This flexibility ensures that you can work with the units that best suit your needs.

By default, the Element selects imperial units (inches, pounds/oz) for US seller accounts and metric units (centimeters, grams/kilograms) for non-US seller accounts.

The chosen units of measurement will be used within the Purchase Label Element when selecting package dimensions and on the shipment breakdown within the Shipment Summary Element.

This can be used as a stand-alone Element and/or utilized within the Account Settings Element via the Units of Measure section.

React Component

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
import { UnitSettings, ElementsProvider } from '@shipengine/elements';
import { themeConfig } from '../themeConfig';

const tokenPath = '/path/to/token/endpoint';

const Foo = () => {
  const getToken = useCallback(() => {
    return fetch(tokenPath).then((res) => res.text());
  }, []);

  return (
    <ElementsProvider
      getToken={getToken}
      themeConfig={themeConfig}
      onError={handleError}
    >
      <UnitSettings.Element />
    </ElementsProvider>
  );
};

SDK

1
2
3
4
5
6
7
8
// Creates a new instance of the Elements SDK.
const elements = new ElementsSDK(getToken, {
  onError: (err: Error) => console.error(err),
  themeConfig: themeConfig,
  locale: 'en-US',
});

const unitSettings = elements.create('unitSettings');