@rango-dev/widget-embedded 0.20.1-next.21 → 0.20.1-next.23

package/dist/libs/tabManager/index.d.ts

@@ -0,0 +1,3 @@
+export { TabManager } from './tabManager';
+export type { TabManagerInterface } from './tabManager.types';
+//# sourceMappingURL=index.d.ts.map

package/dist/libs/tabManager/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC1C,YAAY,EAAE,mBAAmB,EAAE,MAAM,oBAAoB,CAAC"}

package/dist/libs/tabManager/tabManager.constants.d.ts

@@ -0,0 +1,4 @@
+export declare const TIMEOUT = 300;
+export declare const MAXIMUM_TAB_ID = 100000;
+export declare const CHANNEL_NAME = "rango-widget";
+//# sourceMappingURL=tabManager.constants.d.ts.map

package/dist/libs/tabManager/tabManager.constants.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabManager.constants.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,OAAO,MAAM,CAAC;AAC3B,eAAO,MAAM,cAAc,SAAU,CAAC;AACtC,eAAO,MAAM,YAAY,iBAAiB,CAAC"}

package/dist/libs/tabManager/tabManager.d.ts

@@ -0,0 +1,63 @@
+import type { Events, TabManagerInterface } from './tabManager.types';
+export declare class TabManager implements TabManagerInterface {
+    private tabId;
+    private state;
+    private lastTryClaim;
+    private events;
+    private channel;
+    constructor(events: Events);
+    /**
+     * This is applicable when a user in an inactive tab seeks to activate that tab.
+     */
+    forceClaim: () => void;
+    isClaimed: () => boolean;
+    /**
+     * remove event listeners
+     */
+    destroy: () => void;
+    /**
+     * Reacting to messages and window events to claim.
+     */
+    private initEvents;
+    /**
+     * Runs after a `ping` message and checks if current tab is claimed the tabs,
+     *    if yes, it responds with `pong`, If not, it doesn't do anything.
+     *
+     * Note 1: If we receive a `ping` message,
+     *    it means a tab is trying to claim tabs directly, usually it's the active tab.
+     *
+     * Note 2: If multiple tabs are opening at once, all of them are broadcasting `ping`
+     *    and eventually all of them will `claim` the queue after the TIMEOUT.
+     *    For avoiding this, we will accepts the oldest broadcasted ping. (`isPingSentBefore`)
+     */
+    private claimedByCurrentTab;
+    private handleMessageEvent;
+    private handleVisibilityChange;
+    private handleResume;
+    /**
+     * Runs after receiving `pong` message, which means one of tabs already claimed the tabs.
+     */
+    private alreadyClaimedByAnotherTab;
+    /**
+     * Try to send a `ping` message to know if the tabs `claimed` or not.
+     * On constructing instance, or whenever page is active we will try.
+     */
+    private tryClaim;
+    /**
+     * If `lastCheck` is exist, it means there is no other tabs which `claimed` the tabs.
+     * And we mark the current tab as `claimed`
+     */
+    private check;
+    private claim;
+    /**
+     * Setting current time as `lastCheck` and broadcast a `ping` message event.
+     */
+    private setLastCheck;
+    private resetLastCheck;
+    /**
+     * Upon receipt of a "force-claim" message,
+     * the presently active tab is expected to deactivate itself and initiate any attached callback associated with this event.
+     */
+    private forceRelease;
+}
+//# sourceMappingURL=tabManager.d.ts.map

package/dist/libs/tabManager/tabManager.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabManager.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EACV,MAAM,EAGN,mBAAmB,EACpB,MAAM,oBAAoB,CAAC;AAI5B,qBAAa,UAAW,YAAW,mBAAmB;IACpD,OAAO,CAAC,KAAK,CAAK;IAClB,OAAO,CAAC,KAAK,CAAgE;IAC7E,OAAO,CAAC,YAAY,CAAqB;IACzC,OAAO,CAAC,MAAM,CAAc;IAC5B,OAAO,CAAC,OAAO,CAAmB;gBAEtB,MAAM,EAAE,MAAM;IAQ1B;;OAEG;IACH,UAAU,aAUR;IAEF,SAAS,gBAEP;IAEF;;OAEG;IACH,OAAO,aAOL;IAEF;;OAEG;IACH,OAAO,CAAC,UAAU;IAiBlB;;;;;;;;;;OAUG;IACH,OAAO,CAAC,mBAAmB;IAY3B,OAAO,CAAC,kBAAkB,CAyBxB;IAEF,OAAO,CAAC,sBAAsB,CAI5B;IAEF,OAAO,CAAC,YAAY,CAOlB;IACF;;OAEG;IACH,OAAO,CAAC,0BAA0B;IAIlC;;;OAGG;YACW,QAAQ;IAatB;;;OAGG;IACH,OAAO,CAAC,KAAK;IAeb,OAAO,CAAC,KAAK;IAKb;;OAEG;IACH,OAAO,CAAC,YAAY;IASpB,OAAO,CAAC,cAAc;IAItB;;;OAGG;IACH,OAAO,CAAC,YAAY;CAcrB"}

package/dist/libs/tabManager/tabManager.types.d.ts

@@ -0,0 +1,29 @@
+export type ID = number;
+type PingMessage = {
+    name: 'ping';
+    pingAt: number;
+};
+type PongMessage = {
+    name: 'pong';
+};
+type ForceClaimMessage = {
+    name: 'force-claim';
+    candidateId: ID;
+};
+type ForceReleaseMessage = {
+    name: 'force-release';
+    candidateId: ID;
+};
+export type Message = PingMessage | PongMessage | ForceClaimMessage | ForceReleaseMessage;
+export type Events = {
+    onInit?: () => void;
+    onClaim?: () => void;
+    onRelease?: () => void;
+};
+export interface TabManagerInterface {
+    forceClaim: () => void;
+    isClaimed: () => boolean;
+    destroy: () => void;
+}
+export {};
+//# sourceMappingURL=tabManager.types.d.ts.map

package/dist/libs/tabManager/tabManager.types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"tabManager.types.d.ts","sourceRoot":"","sources":["../../../src/libs/tabManager/tabManager.types.ts"],"names":[],"mappings":"AAAA,MAAM,MAAM,EAAE,GAAG,MAAM,CAAC;AAExB,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAC;IAAC,MAAM,EAAE,MAAM,CAAA;CAAE,CAAC;AACpD,KAAK,WAAW,GAAG;IAAE,IAAI,EAAE,MAAM,CAAA;CAAE,CAAC;AACpC,KAAK,iBAAiB,GAAG;IACvB,IAAI,EAAE,aAAa,CAAC;IACpB,WAAW,EAAE,EAAE,CAAC;CACjB,CAAC;AACF,KAAK,mBAAmB,GAAG;IAAE,IAAI,EAAE,eAAe,CAAC;IAAC,WAAW,EAAE,EAAE,CAAA;CAAE,CAAC;AAEtE,MAAM,MAAM,OAAO,GACf,WAAW,GACX,WAAW,GACX,iBAAiB,GACjB,mBAAmB,CAAC;AAExB,MAAM,MAAM,MAAM,GAAG;IAEnB,MAAM,CAAC,EAAE,MAAM,IAAI,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,IAAI,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,IAAI,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,mBAAmB;IAClC,UAAU,EAAE,MAAM,IAAI,CAAC;IACvB,SAAS,EAAE,MAAM,OAAO,CAAC;IACzB,OAAO,EAAE,MAAM,IAAI,CAAC;CACrB"}

package/dist/pages/ConfirmSwapPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ConfirmSwapPage.d.ts","sourceRoot":"","sources":["../../src/pages/ConfirmSwapPage.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAmD5E,wBAAgB,eAAe,sBA2T9B"}
+{"version":3,"file":"ConfirmSwapPage.d.ts","sourceRoot":"","sources":["../../src/pages/ConfirmSwapPage.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAmD5E,wBAAgB,eAAe,sBA4T9B"}

package/dist/pages/HistoryPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"HistoryPage.d.ts","sourceRoot":"","sources":["../../src/pages/HistoryPage.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAkCxC,wBAAgB,WAAW,sBAqE1B"}
+{"version":3,"file":"HistoryPage.d.ts","sourceRoot":"","sources":["../../src/pages/HistoryPage.tsx"],"names":[],"mappings":"AAKA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAiCxC,wBAAgB,WAAW,sBAiE1B"}

package/dist/pages/Home.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuCnD,wBAAgB,IAAI,sBAmPnB"}
+{"version":3,"file":"Home.d.ts","sourceRoot":"","sources":["../../src/pages/Home.tsx"],"names":[],"mappings":"AAEA,OAAO,KAA8B,MAAM,OAAO,CAAC;AAuCnD,wBAAgB,IAAI,sBAyPnB"}

package/dist/pages/SwapDetailsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"SwapDetailsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SwapDetailsPage.tsx"],"names":[],"mappings":"AAEA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,wBAAgB,eAAe,sBAoD9B"}
+{"version":3,"file":"SwapDetailsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SwapDetailsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAK,MAAM,OAAO,CAAC;AAS1B,wBAAgB,eAAe,sBAgE9B"}

package/dist/pages/WalletsPage.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"WalletsPage.d.ts","sourceRoot":"","sources":["../../src/pages/WalletsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAsBxC,eAAO,MAAM,mBAAmB,OAAQ,CAAC;AACzC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,wBAAgB,WAAW,sBAkE1B"}
+{"version":3,"file":"WalletsPage.d.ts","sourceRoot":"","sources":["../../src/pages/WalletsPage.tsx"],"names":[],"mappings":"AAIA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAuBxC,eAAO,MAAM,mBAAmB,OAAQ,CAAC;AACzC,eAAO,MAAM,oBAAoB,MAAM,CAAC;AAExC,wBAAgB,WAAW,sBAoE1B"}

package/dist/store/ui.d.ts

@@ -1,9 +1,9 @@
 interface UiState {
-    connectWalletsButtonDisabled: boolean;
-    selectedSwapRequestId: string | null;
-    currentPage: string;
-    setSelectedSwap: (requestId: string | null) => void;
-    setCurrentPage: (path: string) => void;
+    isActiveTab: boolean;
+    tabManagerInitiated: boolean;
+    showActivateTabModal: boolean;
+    activateCurrentTab: (setCurrentTabAsActive: () => void, hasRunningSwaps: boolean) => void;
+    setShowActivateTabModal: (flag: boolean) => void;
 }
 export declare const useUiStore: {
     (): UiState;
@@ -11,12 +11,14 @@ export declare const useUiStore: {
     <U_1>(selector: (state: UiState) => U_1, equalityFn: (a: U_1, b: U_1) => boolean): U_1;
 } & import("zustand").StoreApi<UiState> & {
     use: {
-        connectWalletsButtonDisabled: () => boolean;
-        selectedSwapRequestId: () => string | null;
-        currentPage: () => string;
-        setSelectedSwap: () => (requestId: string | null) => void;
-        setCurrentPage: () => (path: string) => void;
+        isActiveTab: () => boolean;
+        tabManagerInitiated: () => boolean;
+        showActivateTabModal: () => boolean;
+        activateCurrentTab: () => (setCurrentTabAsActive: () => void, hasRunningSwaps: boolean) => void;
+        setShowActivateTabModal: () => (flag: boolean) => void;
     };
 };
+export declare const setCurrentTabAsActive: () => void;
+export declare const destroyTabManager: () => void;
 export {};
 //# sourceMappingURL=ui.d.ts.map

package/dist/store/ui.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/store/ui.ts"],"names":[],"mappings":"AAIA,UAAU,OAAO;IACf,4BAA4B,EAAE,OAAO,CAAC;IACtC,qBAAqB,EAAE,MAAM,GAAG,IAAI,CAAC;IACrC,WAAW,EAAE,MAAM,CAAC;IACpB,eAAe,EAAE,CAAC,SAAS,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACpD,cAAc,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;CACxC;AAED,eAAO,MAAM,UAAU;;;;;;;;;2CAJQ,MAAM,GAAG,IAAI,KAAK,IAAI;qCAC5B,MAAM,KAAK,IAAI;;CAWvC,CAAC"}
+{"version":3,"file":"ui.d.ts","sourceRoot":"","sources":["../../src/store/ui.ts"],"names":[],"mappings":"AAQA,UAAU,OAAO;IACf,WAAW,EAAE,OAAO,CAAC;IACrB,mBAAmB,EAAE,OAAO,CAAC;IAC7B,oBAAoB,EAAE,OAAO,CAAC;IAC9B,kBAAkB,EAAE,CAClB,qBAAqB,EAAE,MAAM,IAAI,EACjC,eAAe,EAAE,OAAO,KACrB,IAAI,CAAC;IACV,uBAAuB,EAAE,CAAC,IAAI,EAAE,OAAO,KAAK,IAAI,CAAC;CAClD;AAED,eAAO,MAAM,UAAU;;;;;;;;;0DANI,MAAM,IAAI,mBAChB,OAAO,KACrB,IAAI;8CACuB,OAAO,KAAK,IAAI;;CAqBjD,CAAC;AASF,eAAO,MAAM,qBAAqB,YAAwB,CAAC;AAE3D,eAAO,MAAM,iBAAiB,YAAqB,CAAC"}

package/dist/utils/quote.d.ts

@@ -4,7 +4,6 @@ import type { SimulationAssetAndAmount, SimulationValidationStatus } from '@rang
 import type { Asset, BestRouteResponse, BlockchainMeta, Token } from 'rango-sdk';
 import type { PendingSwap } from 'rango-types';
 import BigNumber from 'bignumber.js';
-export declare function searchParamsToToken(tokens: Token[], searchParams: string | null, chain: BlockchainMeta | null): Token | null;
 export declare function getQuoteToTokenUsdPrice(quote: BestRouteResponse | null): number | null | undefined;
 export declare function isNumberOfSwapsChanged(quoteA: BestRouteResponse, quoteB: BestRouteResponse): boolean;
 export declare function isQuoteSwappersUpdated(quoteA: BestRouteResponse, quoteB: BestRouteResponse): boolean;

package/dist/utils/quote.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"quote.d.ts","sourceRoot":"","sources":["../../src/utils/quote.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACjE,OAAO,KAAK,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,KAAK,EACV,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC;AACtD,OAAO,KAAK,EACV,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,KAAK,EACN,MAAM,WAAW,CAAC;AACnB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,SAAS,MAAM,cAAc,CAAC;AAqBrC,wBAAgB,mBAAmB,CACjC,MAAM,EAAE,KAAK,EAAE,EACf,YAAY,EAAE,MAAM,GAAG,IAAI,EAC3B,KAAK,EAAE,cAAc,GAAG,IAAI,GAC3B,KAAK,GAAG,IAAI,CAqBd;AAED,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,iBAAiB,GAAG,IAAI,GAC9B,MAAM,GAAG,IAAI,GAAG,SAAS,CAE3B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAK1B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,cAAc,CAC5B,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,GACxB,OAAO,CAMT;AAED,wBAAgB,oBAAoB,CAClC,YAAY,EAAE,SAAS,GAAG,IAAI,EAC9B,YAAY,EAAE,SAAS,GAAG,CAAC,WAQ5B;AAED,wBAAgB,0BAA0B,CACxC,cAAc,EAAE,MAAM,EACtB,GAAG,EAAE,0BAA0B,EAAE,GAAG,IAAI,GACvC,wBAAwB,EAAE,GAAG,IAAI,CAcnC;AAED,wBAAgB,mBAAmB,CACjC,WAAW,EAAE,MAAM,GAClB,uBAAuB,CASzB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,KAAK,EAAE,EAAE,CAAC,SAAS,KAAK,EAAE,EACnE,KAAK,EAAE,CAAC,EACR,KAAK,EAAE,CAAC,KAUT;AAED,wBAAgB,gBAAgB,CAC9B,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,cAAc,EAAE,EAC7B,MAAM,EAAE,KAAK,EAAE,GACd;IACD,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,SAAS,EAAE,KAAK,GAAG,IAAI,CAAC;IACxB,YAAY,EAAE,cAAc,GAAG,IAAI,CAAC;IACpC,OAAO,EAAE,KAAK,GAAG,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;CACrB,CA4CA;AAED,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,iBAAiB,EACxB,MAAM,EAAE;IACN,SAAS,EAAE,KAAK,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC;IACf,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;CACtB,GACA,YAAY,GAAG,IAAI,CAiDrB;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,iBAAiB,GACvB,UAAU,GAAG,IAAI,CA+BnB;AAED,wBAAgB,cAAc,CAC5B,aAAa,EAAE,SAAS,GAAG,MAAM,GAAG,IAAI,EACxC,cAAc,EAAE,SAAS,GAAG,MAAM,GAAG,IAAI,GACxC,MAAM,GAAG,IAAI,CAcf;AAED,eAAO,MAAM,oBAAoB,UAAW,IAAI,EAAE;iBAEnB,MAAM;WAAS,MAAM;GAanD,CAAC"}
+{"version":3,"file":"quote.d.ts","sourceRoot":"","sources":["../../src/utils/quote.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AACjE,OAAO,KAAK,EAAE,uBAAuB,EAAE,IAAI,EAAE,MAAM,eAAe,CAAC;AACnE,OAAO,KAAK,EACV,wBAAwB,EACxB,0BAA0B,EAC3B,MAAM,8CAA8C,CAAC;AACtD,OAAO,KAAK,EACV,KAAK,EACL,iBAAiB,EACjB,cAAc,EACd,KAAK,EACN,MAAM,WAAW,CAAC;AACnB,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,aAAa,CAAC;AAG/C,OAAO,SAAS,MAAM,cAAc,CAAC;AAqBrC,wBAAgB,uBAAuB,CACrC,KAAK,EAAE,iBAAiB,GAAG,IAAI,GAC9B,MAAM,GAAG,IAAI,GAAG,SAAS,CAE3B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAK1B;AAED,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,2BAA2B,CACzC,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,WAO1B;AAED,wBAAgB,cAAc,CAC5B,MAAM,EAAE,iBAAiB,EACzB,MAAM,EAAE,iBAAiB,GACxB,OAAO,CAMT;AAED,wBAAgB,oBAAoB,CAClC,YAAY,EAAE,SAAS,GAAG,IAAI,EAC9B,YAAY,EAAE,SAAS,GAAG,CAAC,WAQ5B;AAED,wBAAgB,0BAA0B,CACxC,cAAc,EAAE,MAAM,EACtB,GAAG,EAAE,0BAA0B,EAAE,GAAG,IAAI,GACvC,wBAAwB,EAAE,GAAG,IAAI,CAcnC;AAED,wBAAgB,mBAAmB,CACjC,WAAW,EAAE,MAAM,GAClB,uBAAuB,CASzB;AAED,wBAAgB,gBAAgB,CAAC,CAAC,SAAS,KAAK,EAAE,EAAE,CAAC,SAAS,KAAK,EAAE,EACnE,KAAK,EAAE,CAAC,EACR,KAAK,EAAE,CAAC,KAUT;AAED,wBAAgB,gBAAgB,CAC9B,WAAW,EAAE,WAAW,EACxB,WAAW,EAAE,cAAc,EAAE,EAC7B,MAAM,EAAE,KAAK,EAAE,GACd;IACD,cAAc,EAAE,cAAc,GAAG,IAAI,CAAC;IACtC,SAAS,EAAE,KAAK,GAAG,IAAI,CAAC;IACxB,YAAY,EAAE,cAAc,GAAG,IAAI,CAAC;IACpC,OAAO,EAAE,KAAK,GAAG,IAAI,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;CACrB,CA4CA;AAED,wBAAgB,qBAAqB,CACnC,KAAK,EAAE,iBAAiB,EACxB,MAAM,EAAE;IACN,SAAS,EAAE,KAAK,CAAC;IACjB,OAAO,EAAE,KAAK,CAAC;IACf,MAAM,EAAE,KAAK,EAAE,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;CACtB,GACA,YAAY,GAAG,IAAI,CAiDrB;AAED,wBAAgB,mBAAmB,CACjC,KAAK,EAAE,iBAAiB,GACvB,UAAU,GAAG,IAAI,CA+BnB;AAED,wBAAgB,cAAc,CAC5B,aAAa,EAAE,SAAS,GAAG,MAAM,GAAG,IAAI,EACxC,cAAc,EAAE,SAAS,GAAG,MAAM,GAAG,IAAI,GACxC,MAAM,GAAG,IAAI,CAcf;AAED,eAAO,MAAM,oBAAoB,UAAW,IAAI,EAAE;iBAEnB,MAAM;WAAS,MAAM;GAanD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.20.1-next.21",
+  "version": "0.20.1-next.23",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -23,9 +23,9 @@
     "@lingui/react": "4.2.1",
     "@rango-dev/provider-all": "^0.25.1-next.3",
     "@rango-dev/queue-manager-core": "^0.25.0",
-    "@rango-dev/queue-manager-rango-preset": "^0.25.1-next.2",
-    "@rango-dev/queue-manager-react": "^0.24.0",
-    "@rango-dev/ui": "^0.26.1-next.12",
+    "@rango-dev/queue-manager-rango-preset": "^0.25.1-next.3",
+    "@rango-dev/queue-manager-react": "^0.24.1-next.0",
+    "@rango-dev/ui": "^0.26.1-next.13",
     "@rango-dev/wallets-react": "^0.11.1-next.1",
     "@rango-dev/wallets-shared": "^0.25.1-next.1",
     "bignumber.js": "^9.1.1",

package/src/QueueManager.tsx

@@ -13,6 +13,7 @@ import { isEvmBlockchain } from 'rango-types';
 import React, { useMemo } from 'react';
 
 import { useAppStore } from './store/AppStore';
+import { useUiStore } from './store/ui';
 import { useWalletsStore } from './store/wallets';
 import { getConfig } from './utils/configs';
 import { walletAndSupportedChainsNames } from './utils/wallets';
@@ -91,6 +92,8 @@ function QueueManager(props: PropsWithChildren<{ apiKey?: string }>) {
     isMobileWallet,
   };
 
+  const isActiveTab = useUiStore.use.isActiveTab();
+
   return (
     <ManagerProvider
       queuesDefs={[swapQueueDef]}
@@ -98,7 +101,7 @@ function QueueManager(props: PropsWithChildren<{ apiKey?: string }>) {
       onPersistedDataLoaded={(manager) => {
         checkWaitingForNetworkChange(manager);
       }}
-      isPaused={false}>
+      isPaused={!isActiveTab}>
       {props.children}
     </ManagerProvider>
   );

package/src/components/AppRouter.tsx

@@ -10,8 +10,6 @@ import { MemoryRouter, useInRouterContext } from 'react-router';
 import { useForceAutoConnect } from '../hooks/useForceAutoConnect';
 import { useAppStore } from '../store/AppStore';
 
-import { UpdateUrl } from './UpdateUrl';
-
 export function AppRouter({
   children,
   ...props
@@ -37,10 +35,5 @@ export function AppRouter({
     canSwitchNetworkTo,
   });
 
-  return (
-    <>
-      <Router>{children}</Router>
-      {isRouterInContext && <UpdateUrl />}
-    </>
-  );
+  return <Router>{children}</Router>;
 }

package/src/components/AppRoutes.tsx

@@ -2,6 +2,8 @@ import React from 'react';
 import { useRoutes } from 'react-router-dom';
 
 import { navigationRoutes } from '../constants/navigationRoutes';
+import { useSyncStoresWithConfig } from '../hooks/useSyncStoresWithConfig';
+import { useSyncUrlAndStore } from '../hooks/useSyncUrlAndStore';
 import { ConfirmSwapPage } from '../pages/ConfirmSwapPage';
 import { HistoryPage } from '../pages/HistoryPage';
 import { Home } from '../pages/Home';
@@ -15,6 +17,15 @@ import { ThemePage } from '../pages/ThemePage';
 import { WalletsPage } from '../pages/WalletsPage';
 
 export function AppRoutes() {
+  /**
+   * The configuration of the widget should initially be applied to the widget state.
+   * If search parameters exist in the URL,
+   * they should be applied later and take precedence over the widget configuration.
+   * To achieve this, it is crucial to execute these hooks in the correct sequence.
+   */
+  useSyncStoresWithConfig();
+  useSyncUrlAndStore();
+
   return useRoutes([
     {
       path: navigationRoutes.home,

package/src/components/ConfirmWalletsModal/WalletList.tsx

@@ -25,6 +25,7 @@ import {
   TIME_TO_IGNORE_MODAL,
 } from '../../pages/WalletsPage';
 import { useAppStore } from '../../store/AppStore';
+import { useUiStore } from '../../store/ui';
 import { useWalletsStore } from '../../store/wallets';
 import { getBlockchainDisplayNameFor } from '../../utils/meta';
 import {
@@ -44,6 +45,7 @@ import {
 export function WalletList(props: PropTypes) {
   const { chain, isSelected, selectWallet, limit, onShowMore } = props;
   const { config } = useAppStore();
+  const isActiveTab = useUiStore.use.isActiveTab();
 
   const connectedWallets = useWalletsStore.use.connectedWallets();
   const { blockchains } = useAppStore();
@@ -289,6 +291,7 @@ export function WalletList(props: PropTypes) {
               description={connectedWalletDescription}
               onClick={onClick}
               selected={isSelected(wallet.type, chain)}
+              disabled={!isActiveTab}
               {...wallet}
             />
           </>

package/src/components/Layout/Layout.tsx

@@ -1,6 +1,8 @@
 import type { PropTypes } from './Layout.types';
+import type { PendingSwap } from 'rango-types';
 import type { PropsWithChildren } from 'react';
 
+import { useManager } from '@rango-dev/queue-manager-react';
 import { BottomLogo, Divider, Header } from '@rango-dev/ui';
 import React, { useEffect, useRef } from 'react';
 
@@ -8,10 +10,13 @@ import { RANGO_SWAP_BOX_ID } from '../../constants';
 import { useNavigateBack } from '../../hooks/useNavigateBack';
 import { useTheme } from '../../hooks/useTheme';
 import { useAppStore } from '../../store/AppStore';
-import { useUiStore } from '../../store/ui';
+import { setCurrentTabAsActive, useUiStore } from '../../store/ui';
 import { useWalletsStore } from '../../store/wallets';
 import { getContainer } from '../../utils/common';
+import { getPendingSwaps } from '../../utils/queue';
 import { isFeatureHidden } from '../../utils/settings';
+import { ActivateTabAlert } from '../common/ActivateTabAlert';
+import { ActivateTabModal } from '../common/ActivateTabModal';
 import { BackButton, CancelButton, WalletButton } from '../HeaderButtons';
 
 import { onScrollContentAttachStatusToContainer } from './Layout.helpers';
@@ -30,14 +35,25 @@ function Layout(props: PropsWithChildren<PropTypes>) {
     features
   );
 
-  const connectWalletsButtonDisabled =
-    useUiStore.use.connectWalletsButtonDisabled();
+  const {
+    isActiveTab,
+    tabManagerInitiated,
+    showActivateTabModal,
+    setShowActivateTabModal,
+    activateCurrentTab,
+  } = useUiStore();
   const navigateBack = useNavigateBack();
+  const { manager } = useManager();
+  const pendingSwaps: PendingSwap[] = getPendingSwaps(manager).map(
+    ({ swap }) => swap
+  );
+  const hasRunningSwap = pendingSwaps.some((swap) => swap.status === 'running');
+
+  const onActivateTab = () =>
+    activateCurrentTab(setCurrentTabAsActive, hasRunningSwap);
 
   const onConnectWallet = () => {
-    if (!connectWalletsButtonDisabled && header.onWallet) {
-      header.onWallet();
-    }
+    header.onWallet?.();
   };
 
   const showBackButton =
@@ -79,12 +95,25 @@ function Layout(props: PropsWithChildren<PropTypes>) {
         }
       />
       <Content ref={scrollViewRef}>{children}</Content>
+      <ActivateTabModal
+        open={showActivateTabModal}
+        onClose={() => setShowActivateTabModal(false)}
+        onConfirm={onActivateTab}
+      />
       {(hasLogo || footer) && (
         <Footer>
-          <div className="footer__content">{footer}</div>
+          <div className="footer__content">
+            {footer}
+            {tabManagerInitiated && !isActiveTab && (
+              <>
+                <Divider size={12} />
+                <ActivateTabAlert onActivateTab={onActivateTab} />
+              </>
+            )}
+          </div>
+          <Divider size={12} />
           {hasLogo && (
             <div className="footer__logo">
-              <Divider size={12} />
               <BottomLogo />
             </div>
           )}

package/src/components/NotificationContent/NotificationContent.tsx

@@ -14,7 +14,6 @@ import { useNavigate } from 'react-router-dom';
 import { navigationRoutes } from '../../constants/navigationRoutes';
 import { useAppStore } from '../../store/AppStore';
 import { useNotificationStore } from '../../store/notification';
-import { useUiStore } from '../../store/ui';
 
 import { Container, Images, List } from './NotificationContent.styles';
 import { NotificationNotFound } from './NotificationNotFound';
@@ -23,7 +22,6 @@ const MAX_NOTIFICATIONS_DISPLAYED = 4;
 
 export function NotificationContent() {
   const navigate = useNavigate();
-  const setSelectedSwap = useUiStore.use.setSelectedSwap();
 
   const { getUnreadNotifications } = useNotificationStore();
 
@@ -35,7 +33,6 @@ export function NotificationContent() {
     .slice(0, MAX_NOTIFICATIONS_DISPLAYED);
 
   const handleOnClick = (requestId: Notification['requestId']) => {
-    setSelectedSwap(requestId);
     navigate(`${navigationRoutes.swaps}/${requestId}`);
   };
 

package/src/components/QuoteWarningsAndErrors/HighValueLossWarningModal.tsx

@@ -28,13 +28,14 @@ import { Flex } from './QuoteWarningsAndErrors.styles';
 
 type Props = {
   open: boolean;
+  confirmationDisabled: boolean;
   onClose: () => void;
   onConfirm: () => void;
   warning: HighValueLossWarning;
 };
 
 export function HighValueLossWarningModal(props: Props) {
-  const { open, onClose, onConfirm, warning } = props;
+  const { open, onClose, onConfirm, warning, confirmationDisabled } = props;
   const type = warning.warningLevel === 'high' ? 'error' : 'warning';
   const highValueLossData = [
     {
@@ -99,6 +100,7 @@ export function HighValueLossWarningModal(props: Props) {
         size="large"
         prefix={<WarningIcon />}
         fullWidth
+        disabled={confirmationDisabled}
         onClick={onConfirm}>
         {errorMessages().highValueLossError.confirmMessage}
       </Button>

package/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.tsx

@@ -17,8 +17,9 @@ export function QuoteWarningsAndErrors(props: PropTypes) {
   const {
     warning,
     error,
-    refetchQuote,
     showWarningModal,
+    confirmationDisabled,
+    refetchQuote,
     onOpenWarningModal,
     onCloseWarningModal,
     onConfirmWarningModal,
@@ -26,6 +27,7 @@ export function QuoteWarningsAndErrors(props: PropTypes) {
   } = props;
 
   const warningModalHandlers = {
+    confirmationDisabled,
     open: showWarningModal,
     onClose: onCloseWarningModal,
     onConfirm: onConfirmWarningModal,

package/src/components/QuoteWarningsAndErrors/QuoteWarningsAndErrors.types.ts

@@ -5,6 +5,7 @@ export interface PropTypes {
   error: QuoteError | null;
   warning: QuoteWarning | null;
   showWarningModal: boolean;
+  confirmationDisabled: boolean;
   refetchQuote: () => void;
   onOpenWarningModal: () => void;
   onCloseWarningModal: () => void;

package/src/components/QuoteWarningsAndErrors/SlippageWariningModal.tsx

@@ -15,6 +15,7 @@ import { getContainer } from '../../utils/common';
 
 type PropsTypes = {
   open: boolean;
+  confirmationDisabled: boolean;
   onClose: () => void;
   onConfirm: () => void;
   warning: InsufficientSlippageWarning | HighSlippageWarning;
@@ -22,7 +23,7 @@ type PropsTypes = {
 
 export function SlippageWarningModal(props: PropsTypes) {
   const { customSlippage, slippage } = useAppStore();
-  const { open, onClose, onConfirm, warning } = props;
+  const { open, onClose, onConfirm, warning, confirmationDisabled } = props;
   const navigate = useNavigate();
   const userSlippage = customSlippage ?? slippage;
   return (
@@ -68,6 +69,7 @@ export function SlippageWarningModal(props: PropsTypes) {
           type="primary"
           variant="contained"
           fullWidth
+          disabled={confirmationDisabled}
           onClick={onConfirm}>
           {i18n.t('Confirm anyway')}
         </Button>

package/src/components/QuoteWarningsAndErrors/UnknownPriceWarningModal.tsx

@@ -8,13 +8,14 @@ import { getContainer } from '../../utils/common';
 
 type Props = {
   open: boolean;
+  confirmationDisabled: boolean;
   onClose: () => void;
   onConfirm: () => void;
   warning: UnknownPriceWarning;
 };
 
 export function UnknownPriceWarningModal(props: Props) {
-  const { open, onClose, onConfirm } = props;
+  const { open, onClose, onConfirm, confirmationDisabled } = props;
 
   return (
     <Modal open={open} onClose={onClose} container={getContainer()}>
@@ -30,6 +31,7 @@ export function UnknownPriceWarningModal(props: Props) {
         size="large"
         prefix={<WarningIcon />}
         fullWidth
+        disabled={confirmationDisabled}
         onClick={onConfirm}>
         {errorMessages().unknownPriceError.confirmMessage}
       </Button>

package/src/components/SwapDetails/SwapDetails.tsx

@@ -38,6 +38,7 @@ import {
 import { useAppStore } from '../../store/AppStore';
 import { useNotificationStore } from '../../store/notification';
 import { useQuoteStore } from '../../store/quote';
+import { useUiStore } from '../../store/ui';
 import { getContainer } from '../../utils/common';
 import {
   formatTooltipNumbers,
@@ -79,6 +80,7 @@ export function SwapDetails(props: SwapDetailsProps) {
   const swappers = useAppStore().swappers();
   const tokens = useAppStore().tokens();
   const retry = useQuoteStore.use.retry();
+  const isActiveTab = useUiStore.use.isActiveTab();
   const navigate = useNavigate();
   const [_, handleCopy] = useCopyToClipboard(RESET_INTERVAL);
   const listRef = useRef<HTMLDivElement | null>(null);
@@ -407,6 +409,7 @@ export function SwapDetails(props: SwapDetailsProps) {
         onDelete={onDelete}
         message={stepMessage.detailedMessage.content}
         currentStepWallet={currentStepWallet}
+        walletButtonDisabled={!isActiveTab}
       />
       <SwapDetailsCompleteModal
         open={!!showCompletedModal}

package/src/components/SwapDetailsModal/SwapDetailsModal.WalletState.tsx

@@ -10,7 +10,14 @@ import { mapStatusToWalletState } from '../../utils/wallets';
 import { WalletContainer } from './SwapDetailsModal.styles';
 
 export const WalletStateContent = (props: WalletStateContentProps) => {
-  const { type, title, currentStepWallet, message, showWalletButton } = props;
+  const {
+    type,
+    title,
+    currentStepWallet,
+    message,
+    showWalletButton,
+    walletButtonDisabled,
+  } = props;
   const { connect, getWalletInfo, state } = useWallets();
   const walletType = currentStepWallet?.walletType;
   const walletState = walletType
@@ -31,6 +38,7 @@ export const WalletStateContent = (props: WalletStateContentProps) => {
             type={walletType}
             state={walletState}
             link={walletInfo.installLink}
+            disabled={walletButtonDisabled}
             onClick={async () => connect(walletType)}
           />
         </WalletContainer>

package/src/components/SwapDetailsModal/SwapDetailsModal.tsx

@@ -12,8 +12,15 @@ import { modalNetworkValues } from './SwapDetailsModal.helpers';
 import { WalletStateContent } from './SwapDetailsModal.WalletState';
 
 export function SwapDetailsModal(props: ModalPropTypes) {
-  const { state, onClose, onDelete, onCancel, currentStepWallet, message } =
-    props;
+  const {
+    state,
+    onClose,
+    onDelete,
+    onCancel,
+    currentStepWallet,
+    message,
+    walletButtonDisabled,
+  } = props;
 
   const showWalletStateContent =
     state === PendingSwapNetworkStatus.WaitingForNetworkChange ||
@@ -31,6 +38,7 @@ export function SwapDetailsModal(props: ModalPropTypes) {
           title={modalNetworkValues[state].title}
           currentStepWallet={currentStepWallet}
           message={message}
+          walletButtonDisabled={walletButtonDisabled}
           showWalletButton={
             state !== PendingSwapNetworkStatus.WaitingForNetworkChange
           }

package/src/components/SwapDetailsModal/SwapDetailsModal.types.ts

@@ -17,6 +17,7 @@ export interface ModalPropTypes {
   state: ModalState;
   currentStepWallet: WalletTypeAndAddress | null;
   message: string;
+  walletButtonDisabled: boolean;
 }
 
 export interface CompleteModalPropTypes {
@@ -49,6 +50,7 @@ export interface WalletStateContentProps extends ModalNetworkValueTypes {
   currentStepWallet: WalletTypeAndAddress | null;
   message: string;
   showWalletButton: boolean;
+  walletButtonDisabled: boolean;
 }
 
 export type CancelContentProps = Pick<ModalPropTypes, 'onClose' | 'onCancel'>;