@cowprotocol/widget-lib 2.2.4 → 2.3.0

package/IframeCowEventEmitter.d.ts

@@ -4,7 +4,7 @@ export declare class IframeCowEventEmitter {
     private eventEmitter;
     private listeners;
     private widgetListener;
-    constructor(contentWindow: Window, listeners?: CowWidgetEventListeners);
+    constructor(contentWindow: Window, iframeOrigin: string, listeners?: CowWidgetEventListeners);
     stopListeningIframe(): void;
     updateListeners(listeners?: CowWidgetEventListeners): void;
 }

package/README.md

@@ -6,11 +6,11 @@ look and much more!
 
 ## Live example
 
-See the widget in action in the [widget configurator](https://widget.cow.fi)
+See the widget in action in the [widget configurator](https://widget.cow.finance)
 
 ## Docs
 
-You can find a detailed description of all widget parameters in the [documentation](https://docs.cow.fi/cow-protocol/tutorials/widget)
+You can find a detailed description of all widget parameters in the [documentation](https://docs.cow.finance/cow-protocol/tutorials/widget)
 
 ## Quick start
 

package/index.cjs

@@ -1 +1 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("@cowprotocol/iframe-transport"),D=require("@cowprotocol/events");var d=(e=>(e.ACTIVATE="ACTIVATE",e.READY="READY",e.UPDATE_HEIGHT="UPDATE_HEIGHT",e.SET_FULL_HEIGHT="SET_FULL_HEIGHT",e.EMIT_COW_EVENT="EMIT_COW_EVENT",e.PROVIDER_RPC_REQUEST="PROVIDER_RPC_REQUEST",e.INTERCEPT_WINDOW_OPEN="INTERCEPT_WINDOW_OPEN",e.PROCESS_HOOK="PROCESS_HOOK",e))(d||{}),O=(e=>(e.UPDATE_PARAMS="UPDATE_PARAMS",e.UPDATE_APP_DATA="UPDATE_APP_DATA",e.PROVIDER_RPC_RESPONSE="PROVIDER_RPC_RESPONSE",e.PROVIDER_ON_EVENT="PROVIDER_ON_EVENT",e.HOOK_RESULT="HOOK_RESULT",e))(O||{}),u=(e=>(e.ON_BEFORE_APPROVAL="ON_BEFORE_APPROVAL",e.ON_BEFORE_TRADE="ON_BEFORE_TRADE",e.ON_BEFORE_WRAP_UNWRAP="ON_BEFORE_WRAP_UNWRAP",e.ON_BEFORE_ORDER_CANCEL="ON_BEFORE_ORDER_CANCEL",e.ON_BEFORE_ORDERS_CANCEL="ON_BEFORE_ORDERS_CANCEL",e))(u||{}),R=(e=>(e.SWAP="swap",e.LIMIT="limit",e.ADVANCED="advanced",e.YIELD="yield",e))(R||{});const b=["primary","background","paper","text","danger","warning","alert","info","success"],r=new S.IframeTransport("cowSwapWidget");class H{constructor(t,n=[]){this.contentWindow=t,this.updateListeners(n),this.widgetListener=r.listenToMessageFromWindow(this.contentWindow,d.EMIT_COW_EVENT,o=>this.eventEmitter.emit(o.event,o.payload))}eventEmitter=new D.SimpleCowEventEmitter;listeners=[];widgetListener;stopListeningIframe(){r.stopListeningWindowListener(this.contentWindow,this.widgetListener)}updateListeners(t){for(const n of this.listeners)this.eventEmitter.off(n);this.listeners=t||[];for(const n of this.listeners)this.eventEmitter.on(n)}}class y{constructor(t,n){this.appWindow=t,this.iframeWidow=n,this.forwardSdkMessage=o=>{F(o.data)&&(typeof window<"u"&&o.origin===window.location.origin||(U(o.data)?this.appWindow.parent.postMessage(o.data,"*"):B(o.data)&&this.iframeWidow.postMessage(o.data,"*")))},this.startListening()}forwardSdkMessage;startListening(){this.appWindow.addEventListener("message",this.forwardSdkMessage)}stopListening(){this.appWindow.removeEventListener("message",this.forwardSdkMessage)}}function F(e){return typeof e=="object"&&e!==null&&"id"in e&&typeof e.id=="string"}function U(e){return"method"in e&&typeof e.method=="string"&&"params"in e&&"env"in e&&typeof e.env=="object"&&e.env!==null&&"sdkVersion"in e.env}function B(e){return"success"in e&&typeof e.success=="boolean"&&"version"in e&&typeof e.version=="string"}function L(e){return!!(e&&typeof e=="object")}const C="_";function M(e){const t=typeof e.baseUrl=="string"?e.baseUrl:"https://swap.cow.fi",n=I(e);return t+"/#"+n+"?"+v(e)}function I(e){const{chainId:t=1,sell:n,buy:o,tradeType:i=R.SWAP}=e,c=[n?.asset||C,o?.asset||C].map(encodeURIComponent).join("/");return`/${t}/widget/${i}/${c}`}function v(e){const t=new URLSearchParams;return x(G(j(k(V(t,e),e),e),e),e)}function V(e,t){const{sell:n,buy:o}=t;return n?.amount&&e.append("sellAmount",n.amount),o?.amount&&e.append("buyAmount",o.amount),e}function k(e,t){const n=t.theme;return n?(L(n)?(e.append("palette",encodeURIComponent(JSON.stringify(n))),e.append("theme",n.baseTheme)):(e.append("palette","null"),e.append("theme",n)),e):(e.append("palette","null"),e)}function j(e,t){return t.targetChainId&&e.append("targetChainId",t.targetChainId.toString()),e}function G(e,t){return t.locale&&e.append("lng",t.locale),e}function x(e,t){return Q(t.hooks)?e.append("hooksEnabled","true"):e.delete("hooksEnabled"),e}function Q(e){return!!e&&Object.values(e).some(Boolean)}const N="640px",K="450px",$=20,Y={updateParams:()=>{},updateListeners:()=>{},updateProvider:()=>{},destroy:()=>{}};function z(e,t){const{params:n,provider:o,listeners:i,onReady:c}=t;let f=o,p=n;if(typeof window>"u")return Y;const s=J(n),l=[];c&&l.push(Z(s.contentWindow||window,c)),e.innerHTML="",e.appendChild(s);const{contentWindow:a}=s;if(!a)throw console.error("Iframe does not contain a window",s),new Error("Iframe does not contain a window!");l.push(X(a,n.appCode)),l.push(...ee(s,n.height,n.maxHeight)),l.push(q());let T=null;function A(){a&&(T&&window.removeEventListener("message",T),T=oe(a,p.hooks),l.push(T))}A();const h=new H(window,i);let P=g(a,null,f);s.addEventListener("load",()=>{m(a,p,f)});const W=new y(window,a);return{updateParams:E=>{p=E,m(a,p,f),A()},updateListeners:E=>h.updateListeners(E),updateProvider:E=>{f=E,P=g(a,P,E)},destroy:()=>{P.disconnect(),h.stopListeningIframe(),l.forEach(E=>window.removeEventListener("message",E)),W.stopListening(),e.removeChild(s)}}}function g(e,t,n){t&&t.disconnect();const o=t||new S.IframeRpcProviderBridge(e);return n&&o.onConnect(n),o}function J(e){const{width:t=K,height:n=N}=e,o=document.createElement("iframe");return o.src=M(e),o.width=t,o.height=n,o.style.border="0",o.allow="clipboard-read; clipboard-write",o}function m(e,t,n){const o=!!n,i=I(t),c=v(t).toString(),{theme:f,hooks:p,...s}=t;r.postMessageToWindow(e,O.UPDATE_PARAMS,{urlParams:{pathname:i,search:c},appParams:s,hasProvider:o})}function X(e,t){return r.listenToMessageFromWindow(window,d.ACTIVATE,()=>{r.postMessageToWindow(e,O.UPDATE_APP_DATA,{metaData:t?{appCode:t}:void 0})})}function Z(e,t){let n=!1;return r.listenToMessageFromWindow(window,d.READY,()=>{n||(n=!0,t())})}function q(){return r.listenToMessageFromWindow(window,d.INTERCEPT_WINDOW_OPEN,({href:e,rel:t,target:n})=>{const o=e.toString();if(!o.startsWith("http")&&o.match(/^[a-zA-Z0-9]+:\/\//)){window.open(o,n,t);return}})}function ee(e,t=N,n){return[r.listenToMessageFromWindow(window,d.UPDATE_HEIGHT,o=>{const i=o.height?o.height+$:void 0;e.style.height=i?`${n?Math.min(i,n):i}px`:t}),r.listenToMessageFromWindow(window,d.SET_FULL_HEIGHT,({isUpToSmall:o})=>{e.style.height=o?t:`${n||document.body.offsetHeight}px`})]}const te={[u.ON_BEFORE_APPROVAL]:(e,t)=>t?.onBeforeApproval?t.onBeforeApproval(e):!0,[u.ON_BEFORE_TRADE]:(e,t)=>t?.onBeforeTrade?t.onBeforeTrade(e):!0,[u.ON_BEFORE_WRAP_UNWRAP]:(e,t)=>t?.onBeforeWrapOrUnwrap?t.onBeforeWrapOrUnwrap(e):!0,[u.ON_BEFORE_ORDER_CANCEL]:(e,t)=>t?.onBeforeOrderCancel?t.onBeforeOrderCancel(e):!0,[u.ON_BEFORE_ORDERS_CANCEL]:(e,t)=>t?.onBeforeOrdersCancel?t.onBeforeOrdersCancel(e):!0};function ne(e,t){return te[e.event](e.payload,t)}function oe(e,t){return r.listenToMessageFromWindow(window,d.PROCESS_HOOK,async n=>{let o=!1;try{o=await ne(n,t)}catch{}r.postMessageToWindow(e,O.HOOK_RESULT,{id:n.id,result:o})})}const re=Object.values(R);function ie(e,t,n){if(w(e)){const o=e[n];return _(o)?o[t]:o}if(_(e)){const o=e[t];return w(o)?o[n]:o}return e}function w(e){return typeof e!="object"?!1:Object.keys(e).every(t=>re.includes(t))}const se=/^\d+$/;function _(e){return typeof e!="object"?!1:Object.keys(e).every(t=>se.test(t))}function ae(e){return w(e)?Object.values(e).flatMap(t=>_(t)?Object.values(t):[t]):_(e)?Object.values(e).flatMap(t=>w(t)?Object.values(t):[t]):[e]}exports.TradeType=R;exports.WIDGET_PALETTE_COLORS=b;exports.WidgetHookEvents=u;exports.WidgetMethodsEmit=d;exports.WidgetMethodsListen=O;exports.createCowSwapWidget=z;exports.isCowSwapWidgetPalette=L;exports.isPerNetworkConfig=_;exports.isPerTradeTypeConfig=w;exports.resolveFlexibleConfig=ie;exports.resolveFlexibleConfigValues=ae;exports.widgetIframeTransport=r;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const S=require("@cowprotocol/iframe-transport"),b=require("@cowprotocol/events");var c=(e=>(e.ACTIVATE="ACTIVATE",e.READY="READY",e.UPDATE_HEIGHT="UPDATE_HEIGHT",e.SET_FULL_HEIGHT="SET_FULL_HEIGHT",e.EMIT_COW_EVENT="EMIT_COW_EVENT",e.PROVIDER_RPC_REQUEST="PROVIDER_RPC_REQUEST",e.INTERCEPT_WINDOW_OPEN="INTERCEPT_WINDOW_OPEN",e.PROCESS_HOOK="PROCESS_HOOK",e))(c||{}),T=(e=>(e.UPDATE_PARAMS="UPDATE_PARAMS",e.UPDATE_APP_DATA="UPDATE_APP_DATA",e.PROVIDER_RPC_RESPONSE="PROVIDER_RPC_RESPONSE",e.PROVIDER_ON_EVENT="PROVIDER_ON_EVENT",e.HOOK_RESULT="HOOK_RESULT",e))(T||{}),E=(e=>(e.ON_BEFORE_APPROVAL="ON_BEFORE_APPROVAL",e.ON_BEFORE_TRADE="ON_BEFORE_TRADE",e.ON_BEFORE_WRAP_UNWRAP="ON_BEFORE_WRAP_UNWRAP",e.ON_BEFORE_ORDER_CANCEL="ON_BEFORE_ORDER_CANCEL",e.ON_BEFORE_ORDERS_CANCEL="ON_BEFORE_ORDERS_CANCEL",e))(E||{}),P=(e=>(e.SWAP="swap",e.LIMIT="limit",e.ADVANCED="advanced",e.YIELD="yield",e))(P||{});const U=["primary","background","paper","text","danger","warning","alert","info","success"],s=new S.IframeTransport("cowSwapWidget");class y{constructor(t,n,o=[]){this.contentWindow=t,this.updateListeners(o),this.widgetListener=s.listenToMessageFromWindow(this.contentWindow,c.EMIT_COW_EVENT,r=>this.eventEmitter.emit(r.event,r.payload),n)}eventEmitter=new b.SimpleCowEventEmitter;listeners=[];widgetListener;stopListeningIframe(){s.stopListeningWindowListener(this.contentWindow,this.widgetListener)}updateListeners(t){for(const n of this.listeners)this.eventEmitter.off(n);this.listeners=t||[];for(const n of this.listeners)this.eventEmitter.on(n)}}class H{constructor(t,n){this.appWindow=t,this.iframeWidow=n,this.forwardSdkMessage=o=>{F(o.data)&&(typeof window<"u"&&o.origin===window.location.origin||(B(o.data)?this.appWindow.parent.postMessage(o.data,"*"):M(o.data)&&this.iframeWidow.postMessage(o.data,"*")))},this.startListening()}forwardSdkMessage;startListening(){this.appWindow.addEventListener("message",this.forwardSdkMessage)}stopListening(){this.appWindow.removeEventListener("message",this.forwardSdkMessage)}}function F(e){return typeof e=="object"&&e!==null&&"id"in e&&typeof e.id=="string"}function B(e){return"method"in e&&typeof e.method=="string"&&"params"in e&&"env"in e&&typeof e.env=="object"&&e.env!==null&&"sdkVersion"in e.env}function M(e){return"success"in e&&typeof e.success=="boolean"&&"version"in e&&typeof e.version=="string"}function V(e="Default",t="#1c5dbf",...n){console.debug(`%c [COW][${e}]`,`font-weight: bold; color: ${t}`,...n)}function k(...e){V("Widget","#47aba8",...e)}function v(e){return!!(e&&typeof e=="object")}const C="_";function j(e){const t=typeof e.baseUrl=="string"?e.baseUrl:"https://swap.cow.finance",n=I(e);return t+"/#"+n+"?"+W(e)}function I(e){const{chainId:t=1,sell:n,buy:o,tradeType:r=P.SWAP}=e,a=[n?.asset||C,o?.asset||C].map(encodeURIComponent).join("/");return`/${t}/widget/${r}/${a}`}function W(e){const t=new URLSearchParams;return K($(Q(x(G(t,e),e),e),e),e)}function G(e,t){const{sell:n,buy:o}=t;return n?.amount&&e.append("sellAmount",n.amount),o?.amount&&e.append("buyAmount",o.amount),e}function x(e,t){const n=t.theme;return n?(v(n)?(e.append("palette",encodeURIComponent(JSON.stringify(n))),e.append("theme",n.baseTheme)):(e.append("palette","null"),e.append("theme",n)),e):(e.append("palette","null"),e)}function Q(e,t){return t.targetChainId&&e.append("targetChainId",t.targetChainId.toString()),e}function $(e,t){return t.locale&&e.append("lng",t.locale),e}function K(e,t){return Y(t.hooks)?e.append("hooksEnabled","true"):e.delete("hooksEnabled"),e}function Y(e){return!!e&&Object.values(e).some(Boolean)}const N="640px",J="450px",X=20,z={updateParams:()=>{},updateListeners:()=>{},updateProvider:()=>{},destroy:()=>{}};function Z(e,t){const{params:n,provider:o,listeners:r,onReady:a}=t;let f=o,w=n;if(typeof window>"u")return z;const d=q(n),i=ee(d);k("Resolved trusted iframe origin",{iframeOrigin:i});const p=[];a&&p.push(ne(d.contentWindow||window,i,a)),e.innerHTML="",e.appendChild(d);const{contentWindow:u}=d;if(!u)throw console.error("Iframe does not contain a window",d),new Error("Iframe does not contain a window!");p.push(te(u,i,n.appCode)),p.push(...se(d,i,n.height,n.maxHeight)),p.push(oe(i));let R=null;function A(){u&&(R&&window.removeEventListener("message",R),R=ue(u,i,w.hooks),p.push(R))}A();const g=new y(window,i,r);let h=m(u,i,null,f);d.addEventListener("load",()=>{L(u,i,w,f)});const D=new H(window,u);return{updateParams:l=>{w=l,L(u,i,w,f),A()},updateListeners:l=>g.updateListeners(l),updateProvider:l=>{f=l,h=m(u,i,h,l)},destroy:()=>{h.disconnect(),g.stopListeningIframe(),p.forEach(l=>window.removeEventListener("message",l)),D.stopListening(),e.removeChild(d)}}}function m(e,t,n,o){n&&n.disconnect();const r=n||new S.IframeRpcProviderBridge(e,t);return o&&r.onConnect(o),r}function q(e){const{width:t=J,height:n=N}=e,o=document.createElement("iframe");return o.src=j(e),o.width=t,o.height=n,o.style.border="0",o.allow="clipboard-read; clipboard-write",o}function ee(e){return new URL(e.src).origin}function L(e,t,n,o){const r=!!o,a=I(n),f=W(n).toString(),{theme:w,hooks:d,...i}=n;s.postMessageToWindow(e,T.UPDATE_PARAMS,{urlParams:{pathname:a,search:f},appParams:i,hasProvider:r},t)}function te(e,t,n){return s.listenToMessageFromWindow(window,c.ACTIVATE,()=>{s.postMessageToWindow(e,T.UPDATE_APP_DATA,{metaData:n?{appCode:n}:void 0},t)},t)}function ne(e,t,n){let o=!1;return s.listenToMessageFromWindow(window,c.READY,()=>{o||(o=!0,n())},t)}function oe(e){return s.listenToMessageFromWindow(window,c.INTERCEPT_WINDOW_OPEN,({href:t,rel:n,target:o})=>{const r=re(t.toString(),e);r&&ie(r)&&window.open(r,o,n)},e)}function re(e,t){const n=e.trim();if(!n)return null;try{return new URL(n,t).toString()}catch{return null}}function ie(e){try{const t=new URL(e).protocol;return t==="http:"||t==="https:"}catch{return!1}}function se(e,t,n=N,o){return[s.listenToMessageFromWindow(window,c.UPDATE_HEIGHT,r=>{const a=r.height?r.height+X:void 0;e.style.height=a?`${o?Math.min(a,o):a}px`:n},t),s.listenToMessageFromWindow(window,c.SET_FULL_HEIGHT,({isUpToSmall:r})=>{e.style.height=r?n:`${o||document.body.offsetHeight}px`},t)]}const ae={[E.ON_BEFORE_APPROVAL]:(e,t)=>t?.onBeforeApproval?t.onBeforeApproval(e):!0,[E.ON_BEFORE_TRADE]:(e,t)=>t?.onBeforeTrade?t.onBeforeTrade(e):!0,[E.ON_BEFORE_WRAP_UNWRAP]:(e,t)=>t?.onBeforeWrapOrUnwrap?t.onBeforeWrapOrUnwrap(e):!0,[E.ON_BEFORE_ORDER_CANCEL]:(e,t)=>t?.onBeforeOrderCancel?t.onBeforeOrderCancel(e):!0,[E.ON_BEFORE_ORDERS_CANCEL]:(e,t)=>t?.onBeforeOrdersCancel?t.onBeforeOrdersCancel(e):!0};function de(e,t){return ae[e.event](e.payload,t)}function ue(e,t,n){return s.listenToMessageFromWindow(window,c.PROCESS_HOOK,async o=>{let r=!1;try{r=await de(o,n)}catch{}s.postMessageToWindow(e,T.HOOK_RESULT,{id:o.id,result:r},t)},t)}const ce=Object.values(P);function le(e,t,n){if(_(e)){const o=e[n];return O(o)?o[t]:o}if(O(e)){const o=e[t];return _(o)?o[n]:o}return e}function _(e){return typeof e!="object"?!1:Object.keys(e).every(t=>ce.includes(t))}const Ee=/^\d+$/;function O(e){return typeof e!="object"?!1:Object.keys(e).every(t=>Ee.test(t))}function fe(e){return _(e)?Object.values(e).flatMap(t=>O(t)?Object.values(t):[t]):O(e)?Object.values(e).flatMap(t=>_(t)?Object.values(t):[t]):[e]}exports.TradeType=P;exports.WIDGET_PALETTE_COLORS=U;exports.WidgetHookEvents=E;exports.WidgetMethodsEmit=c;exports.WidgetMethodsListen=T;exports.createCowSwapWidget=Z;exports.isCowSwapWidgetPalette=v;exports.isPerNetworkConfig=O;exports.isPerTradeTypeConfig=_;exports.resolveFlexibleConfig=le;exports.resolveFlexibleConfigValues=fe;exports.widgetIframeTransport=s;

package/index.js

@@ -1,29 +1,29 @@
-import { IframeTransport as D, IframeRpcProviderBridge as v } from "@cowprotocol/iframe-transport";
-import { SimpleCowEventEmitter as W } from "@cowprotocol/events";
-var E = /* @__PURE__ */ ((e) => (e.ACTIVATE = "ACTIVATE", e.READY = "READY", e.UPDATE_HEIGHT = "UPDATE_HEIGHT", e.SET_FULL_HEIGHT = "SET_FULL_HEIGHT", e.EMIT_COW_EVENT = "EMIT_COW_EVENT", e.PROVIDER_RPC_REQUEST = "PROVIDER_RPC_REQUEST", e.INTERCEPT_WINDOW_OPEN = "INTERCEPT_WINDOW_OPEN", e.PROCESS_HOOK = "PROCESS_HOOK", e))(E || {}), R = /* @__PURE__ */ ((e) => (e.UPDATE_PARAMS = "UPDATE_PARAMS", e.UPDATE_APP_DATA = "UPDATE_APP_DATA", e.PROVIDER_RPC_RESPONSE = "PROVIDER_RPC_RESPONSE", e.PROVIDER_ON_EVENT = "PROVIDER_ON_EVENT", e.HOOK_RESULT = "HOOK_RESULT", e))(R || {}), l = /* @__PURE__ */ ((e) => (e.ON_BEFORE_APPROVAL = "ON_BEFORE_APPROVAL", e.ON_BEFORE_TRADE = "ON_BEFORE_TRADE", e.ON_BEFORE_WRAP_UNWRAP = "ON_BEFORE_WRAP_UNWRAP", e.ON_BEFORE_ORDER_CANCEL = "ON_BEFORE_ORDER_CANCEL", e.ON_BEFORE_ORDERS_CANCEL = "ON_BEFORE_ORDERS_CANCEL", e))(l || {}), P = /* @__PURE__ */ ((e) => (e.SWAP = "swap", e.LIMIT = "limit", e.ADVANCED = "advanced", e.YIELD = "yield", e))(P || {});
-const ae = ["primary", "background", "paper", "text", "danger", "warning", "alert", "info", "success"], r = new D("cowSwapWidget");
-class H {
-  constructor(t, n = []) {
-    this.contentWindow = t, this.updateListeners(n), this.widgetListener = r.listenToMessageFromWindow(this.contentWindow, E.EMIT_COW_EVENT, (o) => this.eventEmitter.emit(o.event, o.payload));
+import { IframeTransport as D, IframeRpcProviderBridge as W } from "@cowprotocol/iframe-transport";
+import { SimpleCowEventEmitter as U } from "@cowprotocol/events";
+var l = /* @__PURE__ */ ((e) => (e.ACTIVATE = "ACTIVATE", e.READY = "READY", e.UPDATE_HEIGHT = "UPDATE_HEIGHT", e.SET_FULL_HEIGHT = "SET_FULL_HEIGHT", e.EMIT_COW_EVENT = "EMIT_COW_EVENT", e.PROVIDER_RPC_REQUEST = "PROVIDER_RPC_REQUEST", e.INTERCEPT_WINDOW_OPEN = "INTERCEPT_WINDOW_OPEN", e.PROCESS_HOOK = "PROCESS_HOOK", e))(l || {}), T = /* @__PURE__ */ ((e) => (e.UPDATE_PARAMS = "UPDATE_PARAMS", e.UPDATE_APP_DATA = "UPDATE_APP_DATA", e.PROVIDER_RPC_RESPONSE = "PROVIDER_RPC_RESPONSE", e.PROVIDER_ON_EVENT = "PROVIDER_ON_EVENT", e.HOOK_RESULT = "HOOK_RESULT", e))(T || {}), p = /* @__PURE__ */ ((e) => (e.ON_BEFORE_APPROVAL = "ON_BEFORE_APPROVAL", e.ON_BEFORE_TRADE = "ON_BEFORE_TRADE", e.ON_BEFORE_WRAP_UNWRAP = "ON_BEFORE_WRAP_UNWRAP", e.ON_BEFORE_ORDER_CANCEL = "ON_BEFORE_ORDER_CANCEL", e.ON_BEFORE_ORDERS_CANCEL = "ON_BEFORE_ORDERS_CANCEL", e))(p || {}), A = /* @__PURE__ */ ((e) => (e.SWAP = "swap", e.LIMIT = "limit", e.ADVANCED = "advanced", e.YIELD = "yield", e))(A || {});
+const fe = ["primary", "background", "paper", "text", "danger", "warning", "alert", "info", "success"], s = new D("cowSwapWidget");
+class b {
+  constructor(n, t, o = []) {
+    this.contentWindow = n, this.updateListeners(o), this.widgetListener = s.listenToMessageFromWindow(this.contentWindow, l.EMIT_COW_EVENT, (r) => this.eventEmitter.emit(r.event, r.payload), t);
   }
-  eventEmitter = new W();
+  eventEmitter = new U();
   listeners = [];
   widgetListener;
   stopListeningIframe() {
-    r.stopListeningWindowListener(this.contentWindow, this.widgetListener);
+    s.stopListeningWindowListener(this.contentWindow, this.widgetListener);
   }
-  updateListeners(t) {
-    for (const n of this.listeners)
-      this.eventEmitter.off(n);
-    this.listeners = t || [];
-    for (const n of this.listeners)
-      this.eventEmitter.on(n);
+  updateListeners(n) {
+    for (const t of this.listeners)
+      this.eventEmitter.off(t);
+    this.listeners = n || [];
+    for (const t of this.listeners)
+      this.eventEmitter.on(t);
   }
 }
-class U {
-  constructor(t, n) {
-    this.appWindow = t, this.iframeWidow = n, this.forwardSdkMessage = (o) => {
-      b(o.data) && (typeof window < "u" && o.origin === window.location.origin || (B(o.data) ? this.appWindow.parent.postMessage(o.data, "*") : F(o.data) && this.iframeWidow.postMessage(o.data, "*")));
+class H {
+  constructor(n, t) {
+    this.appWindow = n, this.iframeWidow = t, this.forwardSdkMessage = (o) => {
+      y(o.data) && (typeof window < "u" && o.origin === window.location.origin || (B(o.data) ? this.appWindow.parent.postMessage(o.data, "*") : F(o.data) && this.iframeWidow.postMessage(o.data, "*")));
     }, this.startListening();
   }
   forwardSdkMessage;
@@ -34,7 +34,7 @@ class U {
     this.appWindow.removeEventListener("message", this.forwardSdkMessage);
   }
 }
-function b(e) {
+function y(e) {
   return typeof e == "object" && e !== null && "id" in e && typeof e.id == "string";
 }
 function B(e) {
@@ -43,51 +43,57 @@ function B(e) {
 function F(e) {
   return "success" in e && typeof e.success == "boolean" && "version" in e && typeof e.version == "string";
 }
-function y(e) {
+function M(e = "Default", n = "#1c5dbf", ...t) {
+  console.debug(`%c [COW][${e}]`, `font-weight: bold; color: ${n}`, ...t);
+}
+function V(...e) {
+  M("Widget", "#47aba8", ...e);
+}
+function k(e) {
   return !!(e && typeof e == "object");
 }
-const m = "_";
-function M(e) {
-  const t = typeof e.baseUrl == "string" ? e.baseUrl : "https://swap.cow.fi", n = S(e);
-  return t + "/#" + n + "?" + I(e);
+const C = "_";
+function j(e) {
+  const n = typeof e.baseUrl == "string" ? e.baseUrl : "https://swap.cow.finance", t = S(e);
+  return n + "/#" + t + "?" + I(e);
 }
 function S(e) {
   const {
-    chainId: t = 1,
-    sell: n,
+    chainId: n = 1,
+    sell: t,
     buy: o,
-    tradeType: i = P.SWAP
-  } = e, u = [n?.asset || m, o?.asset || m].map(encodeURIComponent).join("/");
-  return `/${t}/widget/${i}/${u}`;
+    tradeType: r = A.SWAP
+  } = e, a = [t?.asset || C, o?.asset || C].map(encodeURIComponent).join("/");
+  return `/${n}/widget/${r}/${a}`;
 }
 function I(e) {
-  const t = new URLSearchParams();
-  return x(G(j(k(V(t, e), e), e), e), e);
+  const n = new URLSearchParams();
+  return K($(Q(x(G(n, e), e), e), e), e);
 }
-function V(e, t) {
+function G(e, n) {
   const {
-    sell: n,
+    sell: t,
     buy: o
-  } = t;
-  return n?.amount && e.append("sellAmount", n.amount), o?.amount && e.append("buyAmount", o.amount), e;
+  } = n;
+  return t?.amount && e.append("sellAmount", t.amount), o?.amount && e.append("buyAmount", o.amount), e;
 }
-function k(e, t) {
-  const n = t.theme;
-  return n ? (y(n) ? (e.append("palette", encodeURIComponent(JSON.stringify(n))), e.append("theme", n.baseTheme)) : (e.append("palette", "null"), e.append("theme", n)), e) : (e.append("palette", "null"), e);
+function x(e, n) {
+  const t = n.theme;
+  return t ? (k(t) ? (e.append("palette", encodeURIComponent(JSON.stringify(t))), e.append("theme", t.baseTheme)) : (e.append("palette", "null"), e.append("theme", t)), e) : (e.append("palette", "null"), e);
 }
-function j(e, t) {
-  return t.targetChainId && e.append("targetChainId", t.targetChainId.toString()), e;
+function Q(e, n) {
+  return n.targetChainId && e.append("targetChainId", n.targetChainId.toString()), e;
 }
-function G(e, t) {
-  return t.locale && e.append("lng", t.locale), e;
+function $(e, n) {
+  return n.locale && e.append("lng", n.locale), e;
 }
-function x(e, t) {
-  return Q(t.hooks) ? e.append("hooksEnabled", "true") : e.delete("hooksEnabled"), e;
+function K(e, n) {
+  return Y(n.hooks) ? e.append("hooksEnabled", "true") : e.delete("hooksEnabled"), e;
 }
-function Q(e) {
+function Y(e) {
   return !!e && Object.values(e).some(Boolean);
 }
-const g = "640px", K = "450px", $ = 20, Y = {
+const N = "640px", J = "450px", X = 20, z = {
   updateParams: () => {
   },
   updateListeners: () => {
@@ -97,168 +103,190 @@ const g = "640px", K = "450px", $ = 20, Y = {
   destroy: () => {
   }
 };
-function de(e, t) {
+function pe(e, n) {
   const {
-    params: n,
+    params: t,
     provider: o,
-    listeners: i,
-    onReady: u
-  } = t;
-  let f = o, p = n;
-  if (typeof window > "u") return Y;
-  const s = z(n), c = [];
-  u && c.push(X(s.contentWindow || window, u)), e.innerHTML = "", e.appendChild(s);
+    listeners: r,
+    onReady: a
+  } = n;
+  let E = o, w = t;
+  if (typeof window > "u") return z;
+  const d = Z(t), i = q(d);
+  V("Resolved trusted iframe origin", {
+    iframeOrigin: i
+  });
+  const f = [];
+  a && f.push(ne(d.contentWindow || window, i, a)), e.innerHTML = "", e.appendChild(d);
   const {
-    contentWindow: a
-  } = s;
-  if (!a)
-    throw console.error("Iframe does not contain a window", s), new Error("Iframe does not contain a window!");
-  c.push(J(a, n.appCode)), c.push(...q(s, n.height, n.maxHeight)), c.push(Z());
-  let w = null;
-  function A() {
-    a && (w && window.removeEventListener("message", w), w = ne(a, p.hooks), c.push(w));
+    contentWindow: u
+  } = d;
+  if (!u)
+    throw console.error("Iframe does not contain a window", d), new Error("Iframe does not contain a window!");
+  f.push(ee(u, i, t.appCode)), f.push(...ie(d, i, t.height, t.maxHeight)), f.push(te(i));
+  let _ = null;
+  function h() {
+    u && (_ && window.removeEventListener("message", _), _ = de(u, i, w.hooks), f.push(_));
   }
-  A();
-  const h = new H(window, i);
-  let T = C(a, null, f);
-  s.addEventListener("load", () => {
-    L(a, p, f);
+  h();
+  const m = new b(window, i, r);
+  let P = g(u, i, null, E);
+  d.addEventListener("load", () => {
+    L(u, i, w, E);
   });
-  const N = new U(window, a);
+  const v = new H(window, u);
   return {
-    updateParams: (d) => {
-      p = d, L(a, p, f), A();
+    updateParams: (c) => {
+      w = c, L(u, i, w, E), h();
     },
-    updateListeners: (d) => h.updateListeners(d),
-    updateProvider: (d) => {
-      f = d, T = C(a, T, d);
+    updateListeners: (c) => m.updateListeners(c),
+    updateProvider: (c) => {
+      E = c, P = g(u, i, P, c);
     },
     destroy: () => {
-      T.disconnect(), h.stopListeningIframe(), c.forEach((d) => window.removeEventListener("message", d)), N.stopListening(), e.removeChild(s);
+      P.disconnect(), m.stopListeningIframe(), f.forEach((c) => window.removeEventListener("message", c)), v.stopListening(), e.removeChild(d);
     }
   };
 }
-function C(e, t, n) {
+function g(e, n, t, o) {
   t && t.disconnect();
-  const o = t || new v(e);
-  return n && o.onConnect(n), o;
+  const r = t || new W(e, n);
+  return o && r.onConnect(o), r;
 }
-function z(e) {
+function Z(e) {
   const {
-    width: t = K,
-    height: n = g
+    width: n = J,
+    height: t = N
   } = e, o = document.createElement("iframe");
-  return o.src = M(e), o.width = t, o.height = n, o.style.border = "0", o.allow = "clipboard-read; clipboard-write", o;
+  return o.src = j(e), o.width = n, o.height = t, o.style.border = "0", o.allow = "clipboard-read; clipboard-write", o;
+}
+function q(e) {
+  return new URL(e.src).origin;
 }
-function L(e, t, n) {
-  const o = !!n, i = S(t), u = I(t).toString(), {
-    theme: f,
-    hooks: p,
-    ...s
+function L(e, n, t, o) {
+  const r = !!o, a = S(t), E = I(t).toString(), {
+    theme: w,
+    hooks: d,
+    ...i
   } = t;
-  r.postMessageToWindow(e, R.UPDATE_PARAMS, {
+  s.postMessageToWindow(e, T.UPDATE_PARAMS, {
     urlParams: {
-      pathname: i,
-      search: u
+      pathname: a,
+      search: E
     },
-    appParams: s,
-    hasProvider: o
-  });
+    appParams: i,
+    hasProvider: r
+  }, n);
 }
-function J(e, t) {
-  return r.listenToMessageFromWindow(window, E.ACTIVATE, () => {
-    r.postMessageToWindow(e, R.UPDATE_APP_DATA, {
+function ee(e, n, t) {
+  return s.listenToMessageFromWindow(window, l.ACTIVATE, () => {
+    s.postMessageToWindow(e, T.UPDATE_APP_DATA, {
       metaData: t ? {
         appCode: t
       } : void 0
-    });
-  });
+    }, n);
+  }, n);
 }
-function X(e, t) {
-  let n = !1;
-  return r.listenToMessageFromWindow(window, E.READY, () => {
-    n || (n = !0, t());
-  });
+function ne(e, n, t) {
+  let o = !1;
+  return s.listenToMessageFromWindow(window, l.READY, () => {
+    o || (o = !0, t());
+  }, n);
 }
-function Z() {
-  return r.listenToMessageFromWindow(window, E.INTERCEPT_WINDOW_OPEN, ({
-    href: e,
+function te(e) {
+  return s.listenToMessageFromWindow(window, l.INTERCEPT_WINDOW_OPEN, ({
+    href: n,
     rel: t,
-    target: n
+    target: o
   }) => {
-    const o = e.toString();
-    if (!o.startsWith("http") && o.match(/^[a-zA-Z0-9]+:\/\//)) {
-      window.open(o, n, t);
-      return;
-    }
-  });
+    const r = oe(n.toString(), e);
+    r && re(r) && window.open(r, o, t);
+  }, e);
 }
-function q(e, t = g, n) {
-  return [r.listenToMessageFromWindow(window, E.UPDATE_HEIGHT, (o) => {
-    const i = o.height ? o.height + $ : void 0;
-    e.style.height = i ? `${n ? Math.min(i, n) : i}px` : t;
-  }), r.listenToMessageFromWindow(window, E.SET_FULL_HEIGHT, ({
-    isUpToSmall: o
+function oe(e, n) {
+  const t = e.trim();
+  if (!t)
+    return null;
+  try {
+    return new URL(t, n).toString();
+  } catch {
+    return null;
+  }
+}
+function re(e) {
+  try {
+    const n = new URL(e).protocol;
+    return n === "http:" || n === "https:";
+  } catch {
+    return !1;
+  }
+}
+function ie(e, n, t = N, o) {
+  return [s.listenToMessageFromWindow(window, l.UPDATE_HEIGHT, (r) => {
+    const a = r.height ? r.height + X : void 0;
+    e.style.height = a ? `${o ? Math.min(a, o) : a}px` : t;
+  }, n), s.listenToMessageFromWindow(window, l.SET_FULL_HEIGHT, ({
+    isUpToSmall: r
   }) => {
-    e.style.height = o ? t : `${n || document.body.offsetHeight}px`;
-  })];
-}
-const ee = {
-  [l.ON_BEFORE_APPROVAL]: (e, t) => t?.onBeforeApproval ? t.onBeforeApproval(e) : !0,
-  [l.ON_BEFORE_TRADE]: (e, t) => t?.onBeforeTrade ? t.onBeforeTrade(e) : !0,
-  [l.ON_BEFORE_WRAP_UNWRAP]: (e, t) => t?.onBeforeWrapOrUnwrap ? t.onBeforeWrapOrUnwrap(e) : !0,
-  [l.ON_BEFORE_ORDER_CANCEL]: (e, t) => t?.onBeforeOrderCancel ? t.onBeforeOrderCancel(e) : !0,
-  [l.ON_BEFORE_ORDERS_CANCEL]: (e, t) => t?.onBeforeOrdersCancel ? t.onBeforeOrdersCancel(e) : !0
+    e.style.height = r ? t : `${o || document.body.offsetHeight}px`;
+  }, n)];
+}
+const se = {
+  [p.ON_BEFORE_APPROVAL]: (e, n) => n?.onBeforeApproval ? n.onBeforeApproval(e) : !0,
+  [p.ON_BEFORE_TRADE]: (e, n) => n?.onBeforeTrade ? n.onBeforeTrade(e) : !0,
+  [p.ON_BEFORE_WRAP_UNWRAP]: (e, n) => n?.onBeforeWrapOrUnwrap ? n.onBeforeWrapOrUnwrap(e) : !0,
+  [p.ON_BEFORE_ORDER_CANCEL]: (e, n) => n?.onBeforeOrderCancel ? n.onBeforeOrderCancel(e) : !0,
+  [p.ON_BEFORE_ORDERS_CANCEL]: (e, n) => n?.onBeforeOrdersCancel ? n.onBeforeOrdersCancel(e) : !0
 };
-function te(e, t) {
-  return ee[e.event](e.payload, t);
+function ae(e, n) {
+  return se[e.event](e.payload, n);
 }
-function ne(e, t) {
-  return r.listenToMessageFromWindow(window, E.PROCESS_HOOK, async (n) => {
-    let o = !1;
+function de(e, n, t) {
+  return s.listenToMessageFromWindow(window, l.PROCESS_HOOK, async (o) => {
+    let r = !1;
     try {
-      o = await te(n, t);
+      r = await ae(o, t);
     } catch {
     }
-    r.postMessageToWindow(e, R.HOOK_RESULT, {
-      id: n.id,
-      result: o
-    });
-  });
+    s.postMessageToWindow(e, T.HOOK_RESULT, {
+      id: o.id,
+      result: r
+    }, n);
+  }, n);
 }
-const oe = Object.values(P);
-function Ee(e, t, n) {
-  if (_(e)) {
-    const o = e[n];
-    return O(o) ? o[t] : o;
-  }
+const ue = Object.values(A);
+function we(e, n, t) {
   if (O(e)) {
     const o = e[t];
-    return _(o) ? o[n] : o;
+    return R(o) ? o[n] : o;
+  }
+  if (R(e)) {
+    const o = e[n];
+    return O(o) ? o[t] : o;
   }
   return e;
 }
-function _(e) {
-  return typeof e != "object" ? !1 : Object.keys(e).every((t) => oe.includes(t));
-}
-const re = /^\d+$/;
 function O(e) {
-  return typeof e != "object" ? !1 : Object.keys(e).every((t) => re.test(t));
+  return typeof e != "object" ? !1 : Object.keys(e).every((n) => ue.includes(n));
+}
+const ce = /^\d+$/;
+function R(e) {
+  return typeof e != "object" ? !1 : Object.keys(e).every((n) => ce.test(n));
 }
-function ue(e) {
-  return _(e) ? Object.values(e).flatMap((t) => O(t) ? Object.values(t) : [t]) : O(e) ? Object.values(e).flatMap((t) => _(t) ? Object.values(t) : [t]) : [e];
+function _e(e) {
+  return O(e) ? Object.values(e).flatMap((n) => R(n) ? Object.values(n) : [n]) : R(e) ? Object.values(e).flatMap((n) => O(n) ? Object.values(n) : [n]) : [e];
 }
 export {
-  P as TradeType,
-  ae as WIDGET_PALETTE_COLORS,
-  l as WidgetHookEvents,
-  E as WidgetMethodsEmit,
-  R as WidgetMethodsListen,
-  de as createCowSwapWidget,
-  y as isCowSwapWidgetPalette,
-  O as isPerNetworkConfig,
-  _ as isPerTradeTypeConfig,
-  Ee as resolveFlexibleConfig,
-  ue as resolveFlexibleConfigValues,
-  r as widgetIframeTransport
+  A as TradeType,
+  fe as WIDGET_PALETTE_COLORS,
+  p as WidgetHookEvents,
+  l as WidgetMethodsEmit,
+  T as WidgetMethodsListen,
+  pe as createCowSwapWidget,
+  k as isCowSwapWidgetPalette,
+  R as isPerNetworkConfig,
+  O as isPerTradeTypeConfig,
+  we as resolveFlexibleConfig,
+  _e as resolveFlexibleConfigValues,
+  s as widgetIframeTransport
 };

package/logger.d.ts

@@ -0,0 +1 @@
+export declare function logWidget(...args: unknown[]): void;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cowprotocol/widget-lib",
-  "version": "2.2.4",
+  "version": "2.3.0",
   "description": "CoW Swap Widget Library. Allows you to easily embed a CoW Swap widget on your website.",
   "repository": {
     "type": "git",
@@ -15,9 +15,9 @@
     "access": "public"
   },
   "dependencies": {
-    "@cowprotocol/cow-sdk": "8.0.5",
-    "@cowprotocol/events": "^4.1.2",
-    "@cowprotocol/iframe-transport": "^2.0.12"
+    "@cowprotocol/cow-sdk": "8.1.0",
+    "@cowprotocol/events": "^4.2.0",
+    "@cowprotocol/iframe-transport": "^2.1.0"
   },
   "exports": {
     ".": {

package/types.d.ts

@@ -227,7 +227,7 @@ export interface CowSwapWidgetParams {
     /**
      * The base url of the widget implementation
      * The parameter can have the URL directly, or an object with the environment property,
-     * The base URL will default to the production environment if not specified, so it will use https://swap.cow.fi by default.
+     * The base URL will default to the production environment if not specified, so it will use https://swap.cow.finance by default.
      */
     baseUrl?: string;
     /**