thirdweb 5.102.7-nightly-9f6c1a4820e37428dec6427cf77a12ab463f119d-20250616000412 → 5.103.0

package/dist/cjs/react/web/ui/components/ChainName.js

@@ -1,6 +1,7 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.ChainName = void 0;
+exports.shorterChainName = shorterChainName;
 const jsx_runtime_1 = require("react/jsx-runtime");
 const index_js_1 = require("../../../core/design-system/index.js");
 const useChainQuery_js_1 = require("../../../core/hooks/others/useChainQuery.js");
@@ -12,7 +13,7 @@ const text_js_1 = require("./text.js");
 const ChainName = (props) => {
     const { name } = (0, useChainQuery_js_1.useChainName)(props.chain);
     if (name) {
-        return ((0, jsx_runtime_1.jsx)(text_js_1.Text, { size: props.size, children: props.short ? shorterChainName(name) : name }));
+        return ((0, jsx_runtime_1.jsx)(text_js_1.Text, { size: props.size, color: props.color, style: props.style, children: props.short ? shorterChainName(name) : name }));
     }
     return (0, jsx_runtime_1.jsx)(Skeleton_js_1.Skeleton, { width: "50px", height: index_js_1.fontSize[props.size] });
 };

package/dist/cjs/react/web/ui/components/ChainName.js.map

@@ -1 +1 @@
-{"version":3,"file":"ChainName.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/ChainName.tsx"],"names":[],"mappings":";;;;AAEA,mEAAgE;AAChE,kFAA2E;AAC3E,+CAAyC;AACzC,uCAAiC;AAEjC;;GAEG;AACI,MAAM,SAAS,GAKjB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,+BAAY,EAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAE3C,IAAI,IAAI,EAAE,CAAC;QACT,OAAO,CACL,uBAAC,cAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,YACnB,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,GACvC,CACR,CAAC;IACJ,CAAC;IAED,OAAO,uBAAC,sBAAQ,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,GAAI,CAAC;AACjE,CAAC,CAAC;AAjBW,QAAA,SAAS,aAiBpB;AAEF,SAAS,gBAAgB,CAAC,IAAY;IACpC,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9B,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IAC/D,OAAO,KAAK;SACT,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;QACZ,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC;IAC7C,CAAC,CAAC;SACD,IAAI,CAAC,GAAG,CAAC,CAAC;AACf,CAAC"}
+{"version":3,"file":"ChainName.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/ChainName.tsx"],"names":[],"mappings":";;;AA+BA,4CAQC;;AArCD,mEAAgE;AAChE,kFAA2E;AAC3E,+CAAyC;AACzC,uCAAiC;AAEjC;;GAEG;AACI,MAAM,SAAS,GAOjB,CAAC,KAAK,EAAE,EAAE;IACb,MAAM,EAAE,IAAI,EAAE,GAAG,IAAA,+BAAY,EAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAE3C,IAAI,IAAI,EAAE,CAAC;QACT,OAAO,CACL,uBAAC,cAAI,IAAC,IAAI,EAAE,KAAK,CAAC,IAAI,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,EAAE,KAAK,EAAE,KAAK,CAAC,KAAK,YAC3D,KAAK,CAAC,KAAK,CAAC,CAAC,CAAC,gBAAgB,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,IAAI,GACvC,CACR,CAAC;IACJ,CAAC;IAED,OAAO,uBAAC,sBAAQ,IAAC,KAAK,EAAC,MAAM,EAAC,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,GAAI,CAAC;AACjE,CAAC,CAAC;AAnBW,QAAA,SAAS,aAmBpB;AAEF,SAAgB,gBAAgB,CAAC,IAAY;IAC3C,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC;IAC9B,MAAM,aAAa,GAAG,IAAI,GAAG,CAAC,CAAC,SAAS,EAAE,SAAS,EAAE,OAAO,CAAC,CAAC,CAAC;IAC/D,OAAO,KAAK;SACT,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;QACZ,OAAO,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,CAAC,WAAW,EAAE,CAAC,CAAC;IAC7C,CAAC,CAAC;SACD,IAAI,CAAC,GAAG,CAAC,CAAC;AACf,CAAC"}

package/dist/cjs/react/web/ui/components/TokenIcon.js

@@ -16,14 +16,17 @@ const basic_js_1 = require("./basic.js");
  * @internal
  */
 function TokenIcon(props) {
-    const chainIconQuery = (0, useChainQuery_js_1.useChainIconUrl)(props.chain);
+    const chainMeta = (0, useChainQuery_js_1.useChainMetadata)(props.chain).data;
     const tokenImage = (0, react_1.useMemo)(() => {
         if ((0, nativeToken_js_1.isNativeToken)(props.token) ||
             props.token.address === addresses_js_1.NATIVE_TOKEN_ADDRESS) {
-            return chainIconQuery.url;
+            if (chainMeta?.nativeCurrency.symbol === "ETH") {
+                return "ipfs://QmcxZHpyJa8T4i63xqjPYrZ6tKrt55tZJpbXcjSDKuKaf9/ethereum/512.png"; // ETH icon
+            }
+            return chainMeta?.icon?.url;
         }
         return props.token.icon;
-    }, [props.token, chainIconQuery.url]);
+    }, [props.token, chainMeta?.icon?.url, chainMeta?.nativeCurrency.symbol]);
     return tokenImage ? ((0, jsx_runtime_1.jsx)(Img_js_1.Img, { src: tokenImage, width: index_js_1.iconSize[props.size], height: index_js_1.iconSize[props.size], fallbackImage: walletIcon_js_1.genericTokenIcon, client: props.client })) : ((0, jsx_runtime_1.jsx)(basic_js_1.Container, { center: "both", style: { width: index_js_1.iconSize[props.size], height: index_js_1.iconSize[props.size] }, color: "secondaryText", children: (0, jsx_runtime_1.jsx)(CoinsIcon_js_1.CoinsIcon, { size: index_js_1.iconSize[props.size] }) }));
 }
 //# sourceMappingURL=TokenIcon.js.map

package/dist/cjs/react/web/ui/components/TokenIcon.js.map

@@ -1 +1 @@
-{"version":3,"file":"TokenIcon.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/TokenIcon.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;AAkBb,8BAwCC;;AAzDD,iCAAgC;AAGhC,qEAA0E;AAC1E,mEAAgE;AAChE,kFAA8E;AAC9E,qEAAqE;AACrE,sEAAgE;AAChE,4EAGiD;AACjD,qCAA+B;AAC/B,yCAAuC;AACvC;;GAEG;AACH,SAAgB,SAAS,CAAC,KAUzB;IACC,MAAM,cAAc,GAAG,IAAA,kCAAe,EAAC,KAAK,CAAC,KAAK,CAAC,CAAC;IAEpD,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC9B,IACE,IAAA,8BAAa,EAAC,KAAK,CAAC,KAAK,CAAC;YAC1B,KAAK,CAAC,KAAK,CAAC,OAAO,KAAK,mCAAoB,EAC5C,CAAC;YACD,OAAO,cAAc,CAAC,GAAG,CAAC;QAC5B,CAAC;QACD,OAAO,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;IAC1B,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,cAAc,CAAC,GAAG,CAAC,CAAC,CAAC;IAEtC,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,uBAAC,YAAG,IACF,GAAG,EAAE,UAAU,EACf,KAAK,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAC3B,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAC5B,aAAa,EAAE,gCAAgB,EAC/B,MAAM,EAAE,KAAK,CAAC,MAAM,GACpB,CACH,CAAC,CAAC,CAAC,CACF,uBAAC,oBAAS,IACR,MAAM,EAAC,MAAM,EACb,KAAK,EAAE,EAAE,KAAK,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EACpE,KAAK,EAAC,eAAe,YAErB,uBAAC,wBAAS,IAAC,IAAI,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,GAAI,GAC/B,CACb,CAAC;AACJ,CAAC"}
+{"version":3,"file":"TokenIcon.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/TokenIcon.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;AAkBb,8BA2CC;;AA5DD,iCAAgC;AAGhC,qEAA0E;AAC1E,mEAAgE;AAChE,kFAA+E;AAC/E,qEAAqE;AACrE,sEAAgE;AAChE,4EAGiD;AACjD,qCAA+B;AAC/B,yCAAuC;AACvC;;GAEG;AACH,SAAgB,SAAS,CAAC,KAUzB;IACC,MAAM,SAAS,GAAG,IAAA,mCAAgB,EAAC,KAAK,CAAC,KAAK,CAAC,CAAC,IAAI,CAAC;IAErD,MAAM,UAAU,GAAG,IAAA,eAAO,EAAC,GAAG,EAAE;QAC9B,IACE,IAAA,8BAAa,EAAC,KAAK,CAAC,KAAK,CAAC;YAC1B,KAAK,CAAC,KAAK,CAAC,OAAO,KAAK,mCAAoB,EAC5C,CAAC;YACD,IAAI,SAAS,EAAE,cAAc,CAAC,MAAM,KAAK,KAAK,EAAE,CAAC;gBAC/C,OAAO,wEAAwE,CAAC,CAAC,WAAW;YAC9F,CAAC;YACD,OAAO,SAAS,EAAE,IAAI,EAAE,GAAG,CAAC;QAC9B,CAAC;QACD,OAAO,KAAK,CAAC,KAAK,CAAC,IAAI,CAAC;IAC1B,CAAC,EAAE,CAAC,KAAK,CAAC,KAAK,EAAE,SAAS,EAAE,IAAI,EAAE,GAAG,EAAE,SAAS,EAAE,cAAc,CAAC,MAAM,CAAC,CAAC,CAAC;IAE1E,OAAO,UAAU,CAAC,CAAC,CAAC,CAClB,uBAAC,YAAG,IACF,GAAG,EAAE,UAAU,EACf,KAAK,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAC3B,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAC5B,aAAa,EAAE,gCAAgB,EAC/B,MAAM,EAAE,KAAK,CAAC,MAAM,GACpB,CACH,CAAC,CAAC,CAAC,CACF,uBAAC,oBAAS,IACR,MAAM,EAAC,MAAM,EACb,KAAK,EAAE,EAAE,KAAK,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,EAAE,EACpE,KAAK,EAAC,eAAe,YAErB,uBAAC,wBAAS,IAAC,IAAI,EAAE,mBAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,GAAI,GAC/B,CACb,CAAC;AACJ,CAAC"}

package/dist/cjs/react/web/ui/components/buttons.js

@@ -82,7 +82,6 @@ exports.Button = (0, elements_js_1.StyledButton)((props) => {
                     border: `1px solid ${theme.colors.borderColor}`,
                     "&:hover": {
                         borderColor: theme.colors.accentText,
-                        transform: "scale(1.01)",
                     },
                     '&[aria-selected="true"]': {
                         borderColor: theme.colors.accentText,
@@ -94,14 +93,13 @@ exports.Button = (0, elements_js_1.StyledButton)((props) => {
                     border: "1px solid transparent",
                     "&:hover": {
                         borderColor: theme.colors.accentText,
-                        transform: "scale(1.01)",
                     },
                 };
             }
             if (props.variant === "accent") {
                 return {
                     "&:hover": {
-                        transform: "scale(1.01)",
+                        opacity: 0.8,
                     },
                 };
             }
@@ -109,7 +107,6 @@ exports.Button = (0, elements_js_1.StyledButton)((props) => {
                 return {
                     "&:hover": {
                         background: theme.colors.secondaryButtonHoverBg,
-                        transform: "scale(1.01)",
                     },
                 };
             }
@@ -118,7 +115,6 @@ exports.Button = (0, elements_js_1.StyledButton)((props) => {
                     padding: 0,
                     "&:hover": {
                         color: theme.colors.primaryText,
-                        transform: "scale(1.01)",
                     },
                 };
             }

package/dist/cjs/react/web/ui/components/buttons.js.map

@@ -1 +1 @@
-{"version":3,"file":"buttons.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/buttons.tsx"],"names":[],"mappings":";AAAA,YAAY,CAAC;;;AACb,+FAAoF;AACpF,mEAK8C;AAC9C,8DAA4D;AAU/C,QAAA,MAAM,GAAmB,IAAA,0BAAY,EAAC,CAAC,KAAkB,EAAE,EAAE;IACxE,MAAM,KAAK,GAAG,IAAA,uCAAc,GAAE,CAAC;IAC/B,IAAI,KAAK,CAAC,QAAQ,EAAE,CAAC;QACnB,OAAO,EAAE,CAAC;IACZ,CAAC;IACD,OAAO;QACL,GAAG,EAAE,OAAO;QACZ,MAAM,EAAE,SAAS;QACjB,OAAO,EAAE,aAAa;QACtB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,YAAY,EAAE,iBAAM,CAAC,EAAE;QACvB,OAAO,EAAE,GAAG,mBAAQ,CAAC,EAAE,IAAI,mBAAQ,CAAC,EAAE,EAAE;QACxC,QAAQ,EAAE,mBAAQ,CAAC,EAAE;QACrB,UAAU,EAAE,GAAG;QACf,SAAS,EAAE,YAAY;QACvB,uBAAuB,EAAE,aAAa;QACtC,UAAU,EAAE,QAAQ;QACpB,UAAU,EAAE,CAAC;QACb,UAAU,EAAE,mBAAmB;QAC/B,GAAG,EAAE,CAAC,KAAK,CAAC,GAAG,IAAI,kBAAO,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC;QAC3C,KAAK,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,SAAS;QAC3C,SAAS,EAAE,QAAQ;QACnB,QAAQ,EAAE,MAAM;QAChB,UAAU,EAAE,CAAC,GAAG,EAAE;YAChB,IAAI,KAAK,CAAC,EAAE,EAAE,CAAC;gBACb,OAAO,KAAK,CAAC,MAAM,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC;YAChC,CAAC;YACD,QAAQ,KAAK,CAAC,OAAO,EAAE,CAAC;gBACtB,KAAK,SAAS;oBACZ,OAAO,KAAK,CAAC,MAAM,CAAC,eAAe,CAAC;gBACtC,KAAK,QAAQ;oBACX,OAAO,KAAK,CAAC,MAAM,CAAC,cAAc,CAAC;gBACrC,KAAK,WAAW;oBACd,OAAO,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC;gBACxC;oBACE,OAAO,MAAM,CAAC;YAClB,CAAC;QACH,CAAC,CAAC,EAAE;QACJ,KAAK,EAAE,CAAC,GAAG,EAAE;YACX,QAAQ,KAAK,CAAC,OAAO,EAAE,CAAC;gBACtB,KAAK,SAAS;oBACZ,OAAO,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC;gBACxC,KAAK,QAAQ;oBACX,OAAO,KAAK,CAAC,MAAM,CAAC,gBAAgB,CAAC;gBACvC,KAAK,WAAW;oBACd,OAAO,KAAK,CAAC,MAAM,CAAC,mBAAmB,CAAC;gBAC1C,KAAK,OAAO,CAAC;gBACb,KAAK,SAAS;oBACZ,OAAO,KAAK,CAAC,MAAM,CAAC,mBAAmB,CAAC;gBAC1C,KAAK,MAAM;oBACT,OAAO,KAAK,CAAC,MAAM,CAAC,UAAU,CAAC;gBACjC;oBACE,OAAO,KAAK,CAAC,MAAM,CAAC,iBAAiB,CAAC;YAC1C,CAAC;QACH,CAAC,CAAC,EAAE;QACJ,UAAU,EAAE;YACV,SAAS,EAAE,iBAAiB;SAC7B;QACD,aAAa,EAAE;YACb,MAAM,EAAE,aAAa;SACtB;QACD,yBAAyB,EAAE;YACzB,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;YACnC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,aAAa;YACjC,WAAW,EAAE,aAAa;YAC1B,SAAS,EAAE,MAAM;YACjB,SAAS,EAAE;gBACT,WAAW,EAAE,aAAa;aAC3B;SACF;QACD,GAAG,CAAC,GAAG,EAAE;YACP,IAAI,KAAK,CAAC,OAAO,KAAK,SAAS,EAAE,CAAC;gBAChC,OAAO;oBACL,MAAM,EAAE,aAAa,KAAK,CAAC,MAAM,CAAC,WAAW,EAAE;oBAC/C,SAAS,EAAE;wBACT,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;wBACpC,SAAS,EAAE,aAAa;qBACzB;oBACD,yBAAyB,EAAE;wBACzB,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;qBACrC;iBACF,CAAC;YACJ,CAAC;YAED,IAAI,KAAK,CAAC,OAAO,KAAK,OAAO,EAAE,CAAC;gBAC9B,OAAO;oBACL,MAAM,EAAE,uBAAuB;oBAC/B,SAAS,EAAE;wBACT,WAAW,EAAE,KAAK,CAAC,MAAM,CAAC,UAAU;wBACpC,SAAS,EAAE,aAAa;qBACzB;iBACF,CAAC;YACJ,CAAC;YAED,IAAI,KAAK,CAAC,OAAO,KAAK,QAAQ,EAAE,CAAC;gBAC/B,OAAO;oBACL,SAAS,EAAE;wBACT,SAAS,EAAE,aAAa;qBACzB;iBACF,CAAC;YACJ,CAAC;YAED,IAAI,KAAK,CAAC,OAAO,KAAK,WAAW,EAAE,CAAC;gBAClC,OAAO;oBACL,SAAS,EAAE;wBACT,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,sBAAsB;wBAC/C,SAAS,EAAE,aAAa;qBACzB;iBACF,CAAC;YACJ,CAAC;YAED,IAAI,KAAK,CAAC,OAAO,KAAK,MAAM,EAAE,CAAC;gBAC7B,OAAO;oBACL,OAAO,EAAE,CAAC;oBACV,SAAS,EAAE;wBACT,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,WAAW;wBAC/B,SAAS,EAAE,aAAa;qBACzB;iBACF,CAAC;YACJ,CAAC;YAED,OAAO,EAAE,CAAC;QACZ,CAAC,CAAC,EAAE;KACL,CAAC;AACJ,CAAC,CAAC,CAAC;AAEU,QAAA,UAAU,GAAmB,CAAC,GAAG,EAAE,CAAC,cAAM,CAAC,aAAa,CAAC,GAAG,CAAC,CAAC,EAAE,CAAC;AAEjE,QAAA,UAAU,GAAmB,IAAA,0BAAY,EAAC,CAAC,CAAC,EAAE,EAAE;IAC3D,MAAM,KAAK,GAAG,IAAA,uCAAc,GAAE,CAAC;IAC/B,OAAO;QACL,GAAG,EAAE,OAAO;QACZ,MAAM,EAAE,SAAS;QACjB,OAAO,EAAE,aAAa;QACtB,UAAU,EAAE,QAAQ;QACpB,cAAc,EAAE,QAAQ;QACxB,YAAY,EAAE,iBAAM,CAAC,EAAE;QACvB,uBAAuB,EAAE,aAAa;QACtC,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,kBAAkB;QACtC,OAAO,EAAE,KAAK;QACd,UAAU,EAAE,yCAAyC;QACrD,SAAS,EAAE;YACT,UAAU,EAAE,KAAK,CAAC,MAAM,CAAC,oBAAoB;YAC7C,KAAK,EAAE,KAAK,CAAC,MAAM,CAAC,uBAAuB;SAC5C;QACD,aAAa,EAAE;YACb,MAAM,EAAE,aAAa;SACtB;KACF,CAAC;AACJ,CAAC,CAAC,CAAC"}
+{"version":3,"file":"buttons.js","sourceRoot":"","sources":["../../../../../../src/react/web/ui/components/buttons.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/stories/Bridge/BridgeOrchestrator.stories.js

@@ -0,0 +1,228 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.CustompresetOptions = exports.TransactionLight = exports.Transaction = exports.DirectPaymentLight = exports.DirectPayment = exports.Dark = exports.Light = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const BridgeOrchestrator_js_1 = require("../../react/web/ui/Bridge/BridgeOrchestrator.js");
+const utils_js_1 = require("../utils.js");
+const fixtures_js_1 = require("./fixtures.js");
+// Wrapper component to provide theme context
+const BridgeOrchestratorWithTheme = (props) => {
+    const { theme, ...componentProps } = props;
+    return ((0, jsx_runtime_1.jsx)(utils_js_1.ModalThemeWrapper, { theme: theme, children: (0, jsx_runtime_1.jsx)(BridgeOrchestrator_js_1.BridgeOrchestrator, { ...componentProps }) }));
+};
+const meta = {
+    title: "Bridge/BridgeOrchestrator",
+    component: BridgeOrchestratorWithTheme,
+    parameters: {
+        layout: "fullscreen",
+        docs: {
+            description: {
+                component: "**BridgeOrchestrator** is the main orchestrator component that manages the complete Bridge payment flow using XState FSM.\n\n" +
+                    "## Features\n" +
+                    "- **State Machine Navigation**: Uses XState v5 for predictable state transitions\n" +
+                    "- **Payment Method Selection**: Supports wallet and fiat payment methods\n" +
+                    "- **Route Preview**: Shows detailed transaction steps and fees\n" +
+                    "- **Step Execution**: Real-time progress tracking\n" +
+                    "- **Error Handling**: Comprehensive error states with retry functionality\n" +
+                    "- **Theme Support**: Works with both light and dark themes\n\n" +
+                    "## State Flow\n" +
+                    "1. **Resolve Requirements** → 2. **Method Selection** → 3. **Quote** → 4. **Preview** → 5. **Prepare** → 6. **Execute** → 7. **Success**\n\n" +
+                    "Each state can transition to the **Error** state, which provides retry functionality.",
+            },
+        },
+    },
+    tags: ["autodocs"],
+    args: {
+        client: utils_js_1.storyClient,
+        uiOptions: fixtures_js_1.FUND_WALLET_UI_OPTIONS.usdcDefault,
+        onComplete: () => { },
+        onError: (error) => console.error("Bridge error:", error),
+        onCancel: () => { },
+        theme: "dark",
+    },
+    argTypes: {
+        theme: {
+            control: "select",
+            options: ["light", "dark"],
+            description: "Theme for the component",
+        },
+        presetOptions: {
+            control: "object",
+            description: "Quick buy options",
+        },
+        onComplete: { action: "flow completed" },
+        onError: { action: "error occurred" },
+        onCancel: { action: "flow cancelled" },
+    },
+};
+exports.default = meta;
+/**
+ * Default BridgeOrchestrator in light theme.
+ */
+exports.Light = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.FUND_WALLET_UI_OPTIONS.usdcDefault,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+    },
+};
+/**
+ * BridgeOrchestrator in dark theme.
+ */
+exports.Dark = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.FUND_WALLET_UI_OPTIONS.usdcDefault,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+    },
+};
+/**
+ * Direct payment mode for purchasing a specific product/service.
+ */
+exports.DirectPayment = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.digitalArt,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Direct payment mode shows a product purchase interface with the item image, price, seller address, and network information. The user can connect their wallet and proceed with the payment.",
+            },
+        },
+    },
+};
+/**
+ * Direct payment mode in light theme.
+ */
+exports.DirectPaymentLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.concertTicket,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of direct payment mode, showing a different product example with USDC payment.",
+            },
+        },
+    },
+};
+/**
+ * Transaction mode showing a complex contract interaction.
+ */
+exports.Transaction = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.TRANSACTION_UI_OPTIONS.contractInteraction,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Transaction mode showing a complex contract interaction (claimTo function) with function name extraction from contract ABI and detailed cost breakdown.",
+            },
+        },
+    },
+};
+/**
+ * Transaction mode in light theme showing an ERC20 token transfer.
+ */
+exports.TransactionLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.TRANSACTION_UI_OPTIONS.erc20Transfer,
+        presetOptions: undefined,
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of transaction mode showing an ERC20 token transfer with proper token amount formatting and USD conversion.",
+            },
+        },
+    },
+};
+exports.CustompresetOptions = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.FUND_WALLET_UI_OPTIONS.ethDefault,
+        presetOptions: [1, 2, 3],
+        onComplete: undefined,
+        onError: undefined,
+        onCancel: undefined,
+        receiverAddress: undefined,
+        connectOptions: undefined,
+        connectLocale: undefined,
+        purchaseData: undefined,
+        paymentLinkId: undefined,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Fund wallet mode with custom quick options showing ETH with [1, 2, 3] preset amounts.",
+            },
+        },
+    },
+};
+//# sourceMappingURL=BridgeOrchestrator.stories.js.map

package/dist/cjs/stories/Bridge/BridgeOrchestrator.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BridgeOrchestrator.stories.js","sourceRoot":"","sources":["../../../../src/stories/Bridge/BridgeOrchestrator.stories.tsx"],"names":[],"mappings":"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"}

package/dist/cjs/stories/Bridge/DirectPayment.stories.js

@@ -0,0 +1,194 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.NoImageLight = exports.NoImage = exports.PhysicalProductLight = exports.PhysicalProduct = exports.SubscriptionServiceLight = exports.SubscriptionService = exports.ConcertTicketLight = exports.ConcertTicket = exports.DigitalArtLight = exports.DigitalArt = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const DirectPayment_js_1 = require("../../react/web/ui/Bridge/DirectPayment.js");
+const utils_js_1 = require("../utils.js");
+const fixtures_js_1 = require("./fixtures.js");
+// Wrapper component to provide theme context
+const DirectPaymentWithTheme = (props) => {
+    const { theme, ...componentProps } = props;
+    return ((0, jsx_runtime_1.jsx)(utils_js_1.ModalThemeWrapper, { theme: theme, children: (0, jsx_runtime_1.jsx)(DirectPayment_js_1.DirectPayment, { ...componentProps }) }));
+};
+const meta = {
+    title: "Bridge/DirectPayment",
+    component: DirectPaymentWithTheme,
+    parameters: {
+        layout: "centered",
+        docs: {
+            description: {
+                component: "DirectPayment component displays a product/service purchase interface with payment details.\n\n" +
+                    "## Features\n" +
+                    "- **Product Display**: Shows product name, image, and pricing\n" +
+                    "- **Payment Details**: Token amount, network information, and seller address\n" +
+                    "- **Wallet Integration**: Connect button or continue with active wallet\n" +
+                    "- **Responsive Design**: Adapts to different screen sizes and themes\n" +
+                    "- **Fee Configuration**: Support for sender or receiver paying fees\n\n" +
+                    "This component is used in the 'direct_payment' mode of BridgeOrchestrator for purchasing specific items or services. It now accepts uiOptions directly to configure payment info and metadata.",
+            },
+        },
+    },
+    tags: ["autodocs"],
+    args: {
+        client: utils_js_1.storyClient,
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.digitalArt,
+        onContinue: (_amount, _token, _receiverAddress) => { },
+        theme: "dark",
+    },
+    argTypes: {
+        theme: {
+            control: "select",
+            options: ["light", "dark"],
+            description: "Theme for the component",
+        },
+        onContinue: {
+            action: "continue clicked",
+            description: "Called when user continues with the payment",
+        },
+        uiOptions: {
+            description: "UI configuration for direct payment mode including payment info and metadata",
+        },
+    },
+};
+exports.default = meta;
+exports.DigitalArt = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.digitalArt,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Example of purchasing a digital art NFT with ETH payment. Shows the product image, pricing in ETH, and seller information with sender paying fees.",
+            },
+        },
+    },
+};
+exports.DigitalArtLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.digitalArt,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of the digital art purchase interface.",
+            },
+        },
+    },
+};
+exports.ConcertTicket = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.concertTicket,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Example of purchasing a concert ticket with USDC payment. Shows different product type, stable token pricing, and receiver paying fees.",
+            },
+        },
+    },
+};
+exports.ConcertTicketLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.concertTicket,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of the concert ticket purchase.",
+            },
+        },
+    },
+};
+exports.SubscriptionService = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.subscription,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Example of a subscription service payment with detailed description. Shows how the component works for recurring service payments with comprehensive product information.",
+            },
+        },
+    },
+};
+exports.SubscriptionServiceLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.subscription,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of subscription service payment with full description text.",
+            },
+        },
+    },
+};
+exports.PhysicalProduct = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.sneakers,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Example of purchasing physical products with crypto payments. Shows how the component adapts to different product types with ETH payment.",
+            },
+        },
+    },
+};
+exports.PhysicalProductLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.sneakers,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of physical product purchase.",
+            },
+        },
+    },
+};
+exports.NoImage = {
+    args: {
+        theme: "dark",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.credits,
+    },
+    parameters: {
+        backgrounds: { default: "dark" },
+        docs: {
+            description: {
+                story: "Example of purchasing digital credits without product image. Shows how the component handles text-only products with description fallback.",
+            },
+        },
+    },
+};
+exports.NoImageLight = {
+    args: {
+        theme: "light",
+        uiOptions: fixtures_js_1.DIRECT_PAYMENT_UI_OPTIONS.credits,
+    },
+    parameters: {
+        backgrounds: { default: "light" },
+        docs: {
+            description: {
+                story: "Light theme version of credits purchase without image.",
+            },
+        },
+    },
+};
+//# sourceMappingURL=DirectPayment.stories.js.map

package/dist/cjs/stories/Bridge/DirectPayment.stories.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"DirectPayment.stories.js","sourceRoot":"","sources":["../../../../src/stories/Bridge/DirectPayment.stories.tsx"],"names":[],"mappings":";;;;AAEA,iFAGoD;AACpD,0CAA6D;AAC7D,+CAA0D;AAO1D,6CAA6C;AAC7C,MAAM,sBAAsB,GAAG,CAAC,KAAkC,EAAE,EAAE;IACpE,MAAM,EAAE,KAAK,EAAE,GAAG,cAAc,EAAE,GAAG,KAAK,CAAC;IAC3C,OAAO,CACL,uBAAC,4BAAiB,IAAC,KAAK,EAAE,KAAK,YAC7B,uBAAC,gCAAa,OAAK,cAAc,GAAI,GACnB,CACrB,CAAC;AACJ,CAAC,CAAC;AAEF,MAAM,IAAI,GAAG;IACX,KAAK,EAAE,sBAAsB;IAC7B,SAAS,EAAE,sBAAsB;IACjC,UAAU,EAAE;QACV,MAAM,EAAE,UAAU;QAClB,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,SAAS,EACP,iGAAiG;oBACjG,eAAe;oBACf,iEAAiE;oBACjE,gFAAgF;oBAChF,2EAA2E;oBAC3E,wEAAwE;oBACxE,yEAAyE;oBACzE,gMAAgM;aACnM;SACF;KACF;IACD,IAAI,EAAE,CAAC,UAAU,CAAC;IAClB,IAAI,EAAE;QACJ,MAAM,EAAE,sBAAW;QACnB,SAAS,EAAE,uCAAyB,CAAC,UAAU;QAC/C,UAAU,EAAE,CAAC,OAAO,EAAE,MAAM,EAAE,gBAAgB,EAAE,EAAE,GAAE,CAAC;QACrD,KAAK,EAAE,MAAM;KACd;IACD,QAAQ,EAAE;QACR,KAAK,EAAE;YACL,OAAO,EAAE,QAAQ;YACjB,OAAO,EAAE,CAAC,OAAO,EAAE,MAAM,CAAC;YAC1B,WAAW,EAAE,yBAAyB;SACvC;QACD,UAAU,EAAE;YACV,MAAM,EAAE,kBAAkB;YAC1B,WAAW,EAAE,6CAA6C;SAC3D;QACD,SAAS,EAAE;YACT,WAAW,EACT,8EAA8E;SACjF;KACF;CAC4C,CAAC;AAEhD,kBAAe,IAAI,CAAC;AAGP,QAAA,UAAU,GAAU;IAC/B,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,uCAAyB,CAAC,UAAU;KAChD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,oJAAoJ;aACvJ;SACF;KACF;CACF,CAAC;AAEW,QAAA,eAAe,GAAU;IACpC,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,SAAS,EAAE,uCAAyB,CAAC,UAAU;KAChD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;QACjC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,4DAA4D;aACpE;SACF;KACF;CACF,CAAC;AAEW,QAAA,aAAa,GAAU;IAClC,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,uCAAyB,CAAC,aAAa;KACnD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,yIAAyI;aAC5I;SACF;KACF;CACF,CAAC;AAEW,QAAA,kBAAkB,GAAU;IACvC,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,SAAS,EAAE,uCAAyB,CAAC,aAAa;KACnD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;QACjC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,qDAAqD;aAC7D;SACF;KACF;CACF,CAAC;AAEW,QAAA,mBAAmB,GAAU;IACxC,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,uCAAyB,CAAC,YAAY;KAClD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,2KAA2K;aAC9K;SACF;KACF;CACF,CAAC;AAEW,QAAA,wBAAwB,GAAU;IAC7C,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,SAAS,EAAE,uCAAyB,CAAC,YAAY;KAClD;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;QACjC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,iFAAiF;aACpF;SACF;KACF;CACF,CAAC;AAEW,QAAA,eAAe,GAAU;IACpC,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,uCAAyB,CAAC,QAAQ;KAC9C;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,2IAA2I;aAC9I;SACF;KACF;CACF,CAAC;AAEW,QAAA,oBAAoB,GAAU;IACzC,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,SAAS,EAAE,uCAAyB,CAAC,QAAQ;KAC9C;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;QACjC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,mDAAmD;aAC3D;SACF;KACF;CACF,CAAC;AAEW,QAAA,OAAO,GAAU;IAC5B,IAAI,EAAE;QACJ,KAAK,EAAE,MAAM;QACb,SAAS,EAAE,uCAAyB,CAAC,OAAO;KAC7C;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,MAAM,EAAE;QAChC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EACH,4IAA4I;aAC/I;SACF;KACF;CACF,CAAC;AAEW,QAAA,YAAY,GAAU;IACjC,IAAI,EAAE;QACJ,KAAK,EAAE,OAAO;QACd,SAAS,EAAE,uCAAyB,CAAC,OAAO;KAC7C;IACD,UAAU,EAAE;QACV,WAAW,EAAE,EAAE,OAAO,EAAE,OAAO,EAAE;QACjC,IAAI,EAAE;YACJ,WAAW,EAAE;gBACX,KAAK,EAAE,wDAAwD;aAChE;SACF;KACF;CACF,CAAC"}