Upgrade Your Widget

Overview

This guide will help you migrate your existing widget integration to Squid v2.0.

After migrating explore upgrading your widget's style with the new widget studio.

What is Squid v2.0?

Squid v2.0 is a completely new version of the widget, designed to be more flexible and customizable.

Migrate from Squid V1

If you're coming from Squid V1, you'll need to make some changes to your code to migrate to Squid v2.0 and the v3 widget.

To upgrade to the newest version of the widget update to 3.0.10

yarn add @0xsquid/widget@^3.0.10

Breaking Changes

Squid v2.0 uses Wagmi v2 and ethers v6. Make sure to upgrade to these versions if you have these packages as a part of your project:

yarn add wagmi@^2.12.8 ethers@^6

Learn more about the wagmi upgrade here

Renamed properties

• defaultTokens has been renamed to defaultTokensPerChain

• initialFromChainId and initialToChainId are now defined in the initialAssets object

API URL

The API URL is now https://apiplus.squidrouter.com.

So, if you had something like this:

<SquidWidget
  config={{
    integratorId: "<your-integrator-id>",0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee
    apiUrl: "https://api.squidrouter.com",
    defaultTokens: [
      {
        address: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
        chainId: "1",
      },
    ],
    initialFromChainId: "1",
    initialToChainId: "42161",
  }}
/>

You'll need to change it to this:

<SquidWidget
  config={{
    integratorId: "<your-integrator-id>",
    apiUrl: "https://apiplus.squidrouter.com",
    defaultTokensPerChain: [
      {
        address: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
        chainId: "1",
      },
    ],
    initialAssets: {
      from: {
        address: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
        chainId: "1",
      },
      to: {
        address: "0xeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeeee",
        chainId: "42161",
      },
    },
  }}
/>

Theme

The new Squid widget comes with a new theming system to better match your brand.

• The style property has been removed in favor of theme

• The themeType property has been added

Visit our new widget studio to create your theme.

Removed properties

These properties have been removed from the widget config:

• enableGetGasOnDestination (Will be added back in the future)

• companyName

• titles

• enableExpress

• mainLogoUrl

• internalSameChainSwapAllowed

• advanced.disableTradeLimit

• advanced.shareOnTwitter

• favTokens

• comingSoonChainIds

• showOnRampLink

• onChainQuoting

• environment

• infiniteApproval

New properties

• degenMode

Migrate from old Squid v2.0

If you're coming from the old Squid v2.0 widget, you'll need to make some changes to your code to migrate to the new one.

API URL

The API URL is now https://apiplus.squidrouter.com.

Theme

Squid v2.0 comes with a new theming system to better match your brand.

• The style property has been removed in favor of theme

• The themeType property has been added

Visit our new widget studio to create your theme.

Removed properties

These properties have been removed from the widget config:

• enableGetGasOnDestination (Will be added back in the future)

• companyName

• titles

• enableExpress

• mainLogoUrl

• internalSameChainSwapAllowed

• advanced.disableTradeLimit

• advanced.shareOnTwitter

• favTokens

• comingSoonChainIds

• showOnRampLink

• onChainQuoting

• environment

• infiniteApproval

New properties

• degenMode