docs: adds theme stories

Author: gregfromstl

packages/thirdweb/src/bridge/Token.ts

@@ -158,7 +158,7 @@ export async function tokens(options: tokens.Options): Promise<tokens.Result> {
 
 export declare namespace tokens {
   /**
-   * Input parameters for {@link Bridge.tokens}.
+   * Input parameters for {@link tokens}.
    */
   type Options = {
     /** Your {@link ThirdwebClient} instance. */

packages/thirdweb/src/stories/Bridge/UnsupportedTokenScreen.stories.tsx

@@ -78,6 +78,22 @@ export const IndexingToken: Story = {
   },
 };
 
+export const IndexingTokenLight: Story = {
+  args: {
+    theme: "light",
+    chain: defineChain(1), // Ethereum mainnet - will show indexing spinner
+  },
+  parameters: {
+    backgrounds: { default: "light" },
+    docs: {
+      description: {
+        story:
+          "Shows the loading state when a token is being indexed by the Universal Bridge on a mainnet chain (light theme).",
+      },
+    },
+  },
+};
+
 export const TestnetNotSupported: Story = {
   args: {
     theme: "dark",
@@ -93,3 +109,19 @@ export const TestnetNotSupported: Story = {
     },
   },
 };
+
+export const TestnetNotSupportedLight: Story = {
+  args: {
+    theme: "light",
+    chain: defineChain(11155111), // Sepolia testnet - will show error state
+  },
+  parameters: {
+    backgrounds: { default: "light" },
+    docs: {
+      description: {
+        story:
+          "Shows the error state when trying to use the Universal Bridge on a testnet chain (Sepolia in this example, light theme).",
+      },
+    },
+  },
+};