Update to SDk 1.4.0 and add Sol logo

hyperlane-xyz · Jul 11, 2023 · f49891a · f49891a
1 parent e04bf0f
commit f49891a
Show file tree

Hide file tree

Showing 12 changed files with 161 additions and 24 deletions.
diff --git a/.gitignore b/.gitignore
@@ -9,6 +9,7 @@ cache/
 /coverage
 coverage.json
 /test/outputs
+/storybook-static
 
 # production
 /artifacts

diff --git a/package.json b/package.json
@@ -1,16 +1,16 @@
 {
   "name": "@hyperlane-xyz/widgets",
   "description": "Common react components for Hyperlane projects",
-  "version": "1.3.5-beta0",
+  "version": "1.4.0",
   "author": "J M Rossy",
   "peerDependencies": {
-    "@hyperlane-xyz/sdk": "^1.3.4",
+    "@hyperlane-xyz/sdk": "^1.4",
     "react": "^18",
     "react-dom": "^18"
   },
   "devDependencies": {
     "@babel/core": "^7.20.12",
-    "@hyperlane-xyz/sdk": "1.3.4",
+    "@hyperlane-xyz/sdk": "1.4.0",
     "@mdx-js/react": "^1.6.22",
     "@storybook/addon-actions": "^6.5.15",
     "@storybook/addon-docs": "^6.5.15",

diff --git a/src/icons/ChainLogo.tsx b/src/icons/ChainLogo.tsx
@@ -1,6 +1,7 @@
 import React, { ReactElement, memo } from 'react';
 
 import { chainMetadata } from '@hyperlane-xyz/sdk';
+import { solana, solanatestnet } from '@hyperlane-xyz/sdk/dist/consts/chainMetadata';
 
 import ArbitrumBlack from '../logos/black/Arbitrum';
 import AvalancheBlack from '../logos/black/Avalanche';
@@ -11,6 +12,7 @@ import GnosisBlack from '../logos/black/Gnosis';
 import MoonbeamBlack from '../logos/black/Moonbeam';
 import OptimismBlack from '../logos/black/Optimism';
 import PolygonBlack from '../logos/black/Polygon';
+import SolanaBlack from '../logos/black/Solana';
 import ArbitrumColor from '../logos/color/Arbitrum';
 import AvalancheColor from '../logos/color/Avalanche';
 import BscColor from '../logos/color/Bsc';
@@ -20,6 +22,7 @@ import GnosisColor from '../logos/color/Gnosis';
 import MoonbeamColor from '../logos/color/Moonbeam';
 import OptimismColor from '../logos/color/Optimism';
 import PolygonColor from '../logos/color/Polygon';
+import SolanaColor from '../logos/color/Solana';
 
 import { Circle } from './Circle';
 import { QuestionMarkIcon } from './QuestionMark';
@@ -47,6 +50,10 @@ const CHAIN_TO_LOGO: Record<number, { black: SvgIcon; color: SvgIcon }> = {
   [chainMetadata.optimismgoerli.chainId]: { black: OptimismBlack, color: OptimismColor },
   [chainMetadata.polygon.chainId]: { black: PolygonBlack, color: PolygonColor },
   [chainMetadata.sepolia.chainId]: { black: EthereumBlack, color: EthereumColor },
+  // TODO replace with access via chainMetadata when it's added there
+  [solana.chainId]: { black: SolanaBlack, color: SolanaColor },
+  [solanatestnet.chainId]: { black: SolanaBlack, color: SolanaColor },
+  [chainMetadata.solanadevnet.chainId]: { black: SolanaBlack, color: SolanaColor },
 };
 
 export interface ChainLogoProps {

diff --git a/src/icons/Circle.tsx b/src/icons/Circle.tsx
@@ -10,7 +10,7 @@ export function Circle({
   children,
 }: PropsWithChildren<{
   size: string | number;
-  title: string;
+  title?: string;
   bgColorSeed?: number;
   classes?: string;
 }>) {

diff --git a/src/logos/black/Eclipse.tsx b/src/logos/black/Eclipse.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { SVGProps } from 'react';
+
+const SvgEclipse = (props: SVGProps<SVGSVGElement>) => (
+  <svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path
+      d="M44.01 83.75a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-1.318 9.375a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm7.633-3.818a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065ZM50.108 100a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM32.414 79.065a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514ZM28 87.293a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm8.228-.658a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-3.809 9.889a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-8.924-26.23a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-6.839 5.995a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm7.57 2.478a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-6.821 7.777a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm1.205-27.769a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-8.22 3.002a3.282 3.282 0 1 0 0-6.564 3.282 3.282 0 0 0 0 6.564Zm5.756 5.132a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-8.793 4.667a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm11.149-25.309a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-8.346-.293a3.281 3.281 0 1 0 0-6.563 3.281 3.281 0 0 0 0 6.563Zm3.07 6.883a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064ZM3.792 53.9a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm19.4-19.23a2.257 2.257 0 1 0 0-4.513 2.257 2.257 0 0 0 0 4.514Zm-7.208-3.389a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-.086 7.479a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.065Zm-8.631-2.55a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm24.696-10.458a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-4.97-5.814a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-3.228 6.82a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm-6.518-5.561a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm26.23-.329a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-1.972-7.196a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-5.882 5.006a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm-3.408-7.533a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm23.77 9.615a2.257 2.257 0 1 0 0-4.515 2.257 2.257 0 0 0 0 4.514Zm1.323-7.322a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-7.638 2.32a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm.217-8.175a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM67.586 25.45a2.257 2.257 0 1 0 0-4.515 2.257 2.257 0 0 0 0 4.514ZM72 19.265a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-8.228-.835a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm3.81-7.371a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm8.923 23.161a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm6.835-3.946a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-7.566-3.976a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm6.821-5.258a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.583ZM81.39 45.734a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm8.22-.948a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-5.76-6.63a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm8.797-2.149a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM81.493 58.242a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm8.351 2.348a3.282 3.282 0 1 0 0-6.564 3.282 3.282 0 0 0 0 6.563Zm-3.07-8.387a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm9.434 1.476a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.584ZM76.803 69.843a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm7.209 5.439a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm.09-8.978a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm8.631 5.069a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-24.696 7.389a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm4.97 7.858a3.282 3.282 0 1 0 0-6.562 3.282 3.282 0 0 0 0 6.563Zm3.228-8.314a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm6.518 8.08a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-26.235-2.74a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm1.977 9.244a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.564Zm5.882-6.508a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm3.408 10.057a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.584Z"
+      fill="#000"
+    />
+  </svg>
+);
+export default SvgEclipse;
diff --git a/src/logos/black/Solana.tsx b/src/logos/black/Solana.tsx
@@ -0,0 +1,9 @@
+import * as React from 'react';
+import { SVGProps } from 'react';
+
+const SvgSolana = (props: SVGProps<SVGSVGElement>) => (
+  <svg xmlns="http://www.w3.org/2000/svg" xmlSpace="preserve" viewBox="0 0 397.7 311.7" {...props}>
+    <path d="M64.6 237.9c2.4-2.4 5.7-3.8 9.2-3.8h317.4c5.8 0 8.7 7 4.6 11.1l-62.7 62.7c-2.4 2.4-5.7 3.8-9.2 3.8H6.5c-5.8 0-8.7-7-4.6-11.1l62.7-62.7zM64.6 3.8C67.1 1.4 70.4 0 73.8 0h317.4c5.8 0 8.7 7 4.6 11.1l-62.7 62.7c-2.4 2.4-5.7 3.8-9.2 3.8H6.5c-5.8 0-8.7-7-4.6-11.1L64.6 3.8zM333.1 120.1c-2.4-2.4-5.7-3.8-9.2-3.8H6.5c-5.8 0-8.7 7-4.6 11.1l62.7 62.7c2.4 2.4 5.7 3.8 9.2 3.8h317.4c5.8 0 8.7-7 4.6-11.1l-62.7-62.7z" />
+  </svg>
+);
+export default SvgSolana;
diff --git a/src/logos/black/index.ts b/src/logos/black/index.ts
@@ -2,10 +2,12 @@ export { default as Arbitrum } from './Arbitrum';
 export { default as Avalanche } from './Avalanche';
 export { default as Bsc } from './Bsc';
 export { default as Celo } from './Celo';
+export { default as Eclipse } from './Eclipse';
 export { default as Ethereum } from './Ethereum';
 export { default as Gnosis } from './Gnosis';
 export { default as Hyperlane } from './Hyperlane';
 export { default as Moonbeam } from './Moonbeam';
 export { default as Near } from './Near';
 export { default as Optimism } from './Optimism';
 export { default as Polygon } from './Polygon';
+export { default as Solana } from './Solana';
diff --git a/src/logos/color/Eclipse.tsx b/src/logos/color/Eclipse.tsx
@@ -0,0 +1,12 @@
+import * as React from 'react';
+import { SVGProps } from 'react';
+
+const SvgEclipse = (props: SVGProps<SVGSVGElement>) => (
+  <svg viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg" {...props}>
+    <path
+      d="M44.01 83.75a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-1.318 9.375a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm7.633-3.818a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065ZM50.108 100a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM32.414 79.065a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514ZM28 87.293a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm8.228-.658a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-3.809 9.889a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-8.924-26.23a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-6.839 5.995a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm7.57 2.478a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-6.821 7.777a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm1.205-27.769a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-8.22 3.002a3.282 3.282 0 1 0 0-6.564 3.282 3.282 0 0 0 0 6.564Zm5.756 5.132a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm-8.793 4.667a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm11.149-25.309a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-8.346-.293a3.281 3.281 0 1 0 0-6.563 3.281 3.281 0 0 0 0 6.563Zm3.07 6.883a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064ZM3.792 53.9a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm19.4-19.23a2.257 2.257 0 1 0 0-4.513 2.257 2.257 0 0 0 0 4.514Zm-7.208-3.389a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-.086 7.479a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.065Zm-8.631-2.55a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm24.696-10.458a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-4.97-5.814a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-3.228 6.82a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm-6.518-5.561a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm26.23-.329a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm-1.972-7.196a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-5.882 5.006a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm-3.408-7.533a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm23.77 9.615a2.257 2.257 0 1 0 0-4.515 2.257 2.257 0 0 0 0 4.514Zm1.323-7.322a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-7.638 2.32a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm.217-8.175a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM67.586 25.45a2.257 2.257 0 1 0 0-4.515 2.257 2.257 0 0 0 0 4.514ZM72 19.265a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-8.228-.835a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm3.81-7.371a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm8.923 23.161a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm6.835-3.946a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-7.566-3.976a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm6.821-5.258a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.583ZM81.39 45.734a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm8.22-.948a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm-5.76-6.63a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm8.797-2.149a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583ZM81.493 58.242a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm8.351 2.348a3.282 3.282 0 1 0 0-6.564 3.282 3.282 0 0 0 0 6.563Zm-3.07-8.387a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm9.434 1.476a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.584ZM76.803 69.843a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm7.209 5.439a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.563Zm.09-8.978a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm8.631 5.069a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-24.696 7.389a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm4.97 7.858a3.282 3.282 0 1 0 0-6.562 3.282 3.282 0 0 0 0 6.563Zm3.228-8.314a2.532 2.532 0 1 0 0-5.064 2.532 2.532 0 0 0 0 5.064Zm6.518 8.08a3.792 3.792 0 1 0 0-7.583 3.792 3.792 0 0 0 0 7.583Zm-26.235-2.74a2.257 2.257 0 1 0 0-4.514 2.257 2.257 0 0 0 0 4.514Zm1.977 9.244a3.282 3.282 0 1 0 0-6.563 3.282 3.282 0 0 0 0 6.564Zm5.882-6.508a2.532 2.532 0 1 0 0-5.065 2.532 2.532 0 0 0 0 5.065Zm3.408 10.057a3.792 3.792 0 1 0 0-7.584 3.792 3.792 0 0 0 0 7.584Z"
+      fill="#ff4301"
+    />
+  </svg>
+);
+export default SvgEclipse;
diff --git a/src/logos/color/Solana.tsx b/src/logos/color/Solana.tsx
@@ -0,0 +1,92 @@
+import * as React from 'react';
+import { SVGProps } from 'react';
+
+const SvgSolana = (props: SVGProps<SVGSVGElement>) => (
+  <svg xmlns="http://www.w3.org/2000/svg" xmlSpace="preserve" viewBox="0 0 397.7 311.7" {...props}>
+    <linearGradient
+      id="solana_svg__a"
+      x1={360.88}
+      x2={141.21}
+      y1={351.46}
+      y2={-69.29}
+      gradientTransform="matrix(1 0 0 -1 0 314)"
+      gradientUnits="userSpaceOnUse"
+    >
+      <stop
+        offset={0}
+        style={{
+          stopColor: '#00ffa3',
+        }}
+      />
+      <stop
+        offset={1}
+        style={{
+          stopColor: '#dc1fff',
+        }}
+      />
+    </linearGradient>
+    <path
+      d="M64.6 237.9c2.4-2.4 5.7-3.8 9.2-3.8h317.4c5.8 0 8.7 7 4.6 11.1l-62.7 62.7c-2.4 2.4-5.7 3.8-9.2 3.8H6.5c-5.8 0-8.7-7-4.6-11.1l62.7-62.7z"
+      style={{
+        fill: 'url(#solana_svg__a)',
+      }}
+    />
+    <linearGradient
+      id="solana_svg__b"
+      x1={264.83}
+      x2={45.16}
+      y1={401.6}
+      y2={-19.15}
+      gradientTransform="matrix(1 0 0 -1 0 314)"
+      gradientUnits="userSpaceOnUse"
+    >
+      <stop
+        offset={0}
+        style={{
+          stopColor: '#00ffa3',
+        }}
+      />
+      <stop
+        offset={1}
+        style={{
+          stopColor: '#dc1fff',
+        }}
+      />
+    </linearGradient>
+    <path
+      d="M64.6 3.8C67.1 1.4 70.4 0 73.8 0h317.4c5.8 0 8.7 7 4.6 11.1l-62.7 62.7c-2.4 2.4-5.7 3.8-9.2 3.8H6.5c-5.8 0-8.7-7-4.6-11.1L64.6 3.8z"
+      style={{
+        fill: 'url(#solana_svg__b)',
+      }}
+    />
+    <linearGradient
+      id="solana_svg__c"
+      x1={312.55}
+      x2={92.88}
+      y1={376.69}
+      y2={-44.06}
+      gradientTransform="matrix(1 0 0 -1 0 314)"
+      gradientUnits="userSpaceOnUse"
+    >
+      <stop
+        offset={0}
+        style={{
+          stopColor: '#00ffa3',
+        }}
+      />
+      <stop
+        offset={1}
+        style={{
+          stopColor: '#dc1fff',
+        }}
+      />
+    </linearGradient>
+    <path
+      d="M333.1 120.1c-2.4-2.4-5.7-3.8-9.2-3.8H6.5c-5.8 0-8.7 7-4.6 11.1l62.7 62.7c2.4 2.4 5.7 3.8 9.2 3.8h317.4c5.8 0 8.7-7 4.6-11.1l-62.7-62.7z"
+      style={{
+        fill: 'url(#solana_svg__c)',
+      }}
+    />
+  </svg>
+);
+export default SvgSolana;
diff --git a/src/logos/color/index.ts b/src/logos/color/index.ts
@@ -2,9 +2,11 @@ export { default as Arbitrum } from './Arbitrum';
 export { default as Avalanche } from './Avalanche';
 export { default as Bsc } from './Bsc';
 export { default as Celo } from './Celo';
+export { default as Eclipse } from './Eclipse';
 export { default as Ethereum } from './Ethereum';
 export { default as Gnosis } from './Gnosis';
 export { default as Hyperlane } from './Hyperlane';
 export { default as Moonbeam } from './Moonbeam';
 export { default as Optimism } from './Optimism';
 export { default as Polygon } from './Polygon';
+export { default as Solana } from './Solana';
diff --git a/src/stories/WideChevron.stories.tsx b/src/stories/WideChevron.stories.tsx
@@ -1,7 +1,7 @@
 import { ComponentMeta, ComponentStory } from '@storybook/react';
 import React from 'react';
 
-import { Color } from '../color';
+import { ColorPalette } from '../color';
 import { WideChevron } from '../icons/WideChevron';
 
 export default {
@@ -13,7 +13,7 @@ const Template: ComponentStory<typeof WideChevron> = (args) => <WideChevron {...
 
 export const BlueEastRounded = Template.bind({});
 BlueEastRounded.args = {
-  color: Color.Blue,
+  color: ColorPalette.Blue,
   direction: 'e',
   rounded: true,
   width: 50,
@@ -22,7 +22,7 @@ BlueEastRounded.args = {
 
 export const BlackSouthUnrounded = Template.bind({});
 BlackSouthUnrounded.args = {
-  color: Color.Black,
+  color: ColorPalette.Black,
   direction: 's',
   rounded: false,
   width: 50,

diff --git a/yarn.lock b/yarn.lock
@@ -2196,23 +2196,23 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@hyperlane-xyz/core@npm:1.3.4":
-  version: 1.3.4
-  resolution: "@hyperlane-xyz/core@npm:1.3.4"
+"@hyperlane-xyz/core@npm:1.4.0":
+  version: 1.4.0
+  resolution: "@hyperlane-xyz/core@npm:1.4.0"
   dependencies:
-    "@hyperlane-xyz/utils": 1.3.4
+    "@hyperlane-xyz/utils": 1.4.0
     "@openzeppelin/contracts": ^4.8.0
     "@openzeppelin/contracts-upgradeable": ^4.8.0
-  checksum: aaea49039a37dc093fb785ba79480be28a41b62936dd2910ac25fbe07e8275ea6a1f8f477e0872c8d5880dede24e2fb5bce5f0153626a36113de18578e4032f7
+  checksum: 46f431e4becd655e725ccab48429840128deba19a74bac13747cf50542fc22ee0d7e941d190f77bad5009a982d0ef4241ff17d6704ddd02ba47fa4a9253a6c35
   languageName: node
   linkType: hard
 
-"@hyperlane-xyz/sdk@npm:1.3.4":
-  version: 1.3.4
-  resolution: "@hyperlane-xyz/sdk@npm:1.3.4"
+"@hyperlane-xyz/sdk@npm:1.4.0":
+  version: 1.4.0
+  resolution: "@hyperlane-xyz/sdk@npm:1.4.0"
   dependencies:
-    "@hyperlane-xyz/core": 1.3.4
-    "@hyperlane-xyz/utils": 1.3.4
+    "@hyperlane-xyz/core": 1.4.0
+    "@hyperlane-xyz/utils": 1.4.0
     "@types/coingecko-api": ^1.0.10
     "@types/debug": ^4.1.7
     "@wagmi/chains": ^0.2.6
@@ -2221,16 +2221,16 @@ __metadata:
     debug: ^4.3.4
     ethers: ^5.7.2
     zod: ^3.21.2
-  checksum: c881b51ea1e0aada4cf12a485a0b614ee0fbb6095941c63ec0ba7bc41a59b29e7a05498ab8ac3e89a50430b2973218dece6f2cbd09fd8697bead49be99b3663a
+  checksum: 50aee754c0dd71806d5f2d5ef3b5f1dfe9a3080ed6f5db11d6457aa2aadd3607b88d0d9467aef0fa624828841105f1af37cc109c04f00e7f2eb897def0656ba2
   languageName: node
   linkType: hard
 
-"@hyperlane-xyz/utils@npm:1.3.4":
-  version: 1.3.4
-  resolution: "@hyperlane-xyz/utils@npm:1.3.4"
+"@hyperlane-xyz/utils@npm:1.4.0":
+  version: 1.4.0
+  resolution: "@hyperlane-xyz/utils@npm:1.4.0"
   dependencies:
     ethers: ^5.7.2
-  checksum: 7bed3465604dd3e20d31ebc2b4d101cfe6a934df9d0625a11e9fb5dfa39dbd009c1fc4ad269a32662d4c4a3abadacf5195f53462be021494ba15896036a53f7a
+  checksum: f346975f1bc47739209d975dd67da5d048ba15ac246d69ffa882143a8898b628f03e2d807895c1f2bad28a2c6675857e7dd74b4329a8090730cdf33482b71271
   languageName: node
   linkType: hard
 
@@ -2239,7 +2239,7 @@ __metadata:
   resolution: "@hyperlane-xyz/widgets@workspace:."
   dependencies:
     "@babel/core": ^7.20.12
-    "@hyperlane-xyz/sdk": 1.3.4
+    "@hyperlane-xyz/sdk": 1.4.0
     "@mdx-js/react": ^1.6.22
     "@storybook/addon-actions": ^6.5.15
     "@storybook/addon-docs": ^6.5.15
@@ -2269,7 +2269,7 @@ __metadata:
     ts-node: ^10.8.0
     typescript: ^4.7.2
   peerDependencies:
-    "@hyperlane-xyz/sdk": ^1.3.4
+    "@hyperlane-xyz/sdk": ^1.4
     react: ^18
     react-dom: ^18
   languageName: unknown