@rango-dev/widget-embedded 0.17.1-next.26 → 0.17.1-next.27

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;AAqD5E,wBAAgB,eAAe,sBA4S9B"}
+{"version":3,"file":"ConfirmSwapPage.d.ts","sourceRoot":"","sources":["../../src/pages/ConfirmSwapPage.tsx"],"names":[],"mappings":"AAoBA,OAAO,KAAuD,MAAM,OAAO,CAAC;AAqD5E,wBAAgB,eAAe,sBA2S9B"}

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

@@ -1 +1 @@
-{"version":3,"file":"LiquiditySourcePage.d.ts","sourceRoot":"","sources":["../../src/pages/LiquiditySourcePage.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAgBxC,UAAU,SAAS;IACjB,UAAU,EAAE,WAAW,GAAG,SAAS,CAAC;CACrC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,qBAoH5D"}
+{"version":3,"file":"LiquiditySourcePage.d.ts","sourceRoot":"","sources":["../../src/pages/LiquiditySourcePage.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAmB,MAAM,OAAO,CAAC;AAexC,UAAU,SAAS;IACjB,UAAU,EAAE,WAAW,GAAG,SAAS,CAAC;CACrC;AAED,wBAAgB,mBAAmB,CAAC,EAAE,UAAU,EAAE,EAAE,SAAS,qBAqH5D"}

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

@@ -1 +1 @@
-{"version":3,"file":"SettingsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SettingsPage.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,MAAM,OAAO,CAAC;AAa1B,wBAAgB,YAAY,sBA+J3B"}
+{"version":3,"file":"SettingsPage.d.ts","sourceRoot":"","sources":["../../src/pages/SettingsPage.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,MAAM,OAAO,CAAC;AAY1B,wBAAgB,YAAY,sBA2K3B"}

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

@@ -1 +1 @@
-{"version":3,"file":"ThemePage.d.ts","sourceRoot":"","sources":["../../src/pages/ThemePage.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,wBAAgB,SAAS,sBAkExB"}
+{"version":3,"file":"ThemePage.d.ts","sourceRoot":"","sources":["../../src/pages/ThemePage.tsx"],"names":[],"mappings":"AAWA,OAAO,KAAK,MAAM,OAAO,CAAC;AAc1B,wBAAgB,SAAS,sBAiExB"}

package/dist/store/AppStore.d.ts

@@ -4,7 +4,43 @@ import React from 'react';
 type AppStoreProviderProps = PropsWithChildren<{
     config?: WidgetConfig;
 }>;
-export declare const AppStoreContext: React.Context<import("zustand").UseBoundStore<import("zustand").StoreApi<import("./app").AppStoreState>> | null>;
+export declare const AppStoreContext: React.Context<import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<import("./app").AppStoreState>, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<import("./app").AppStoreState, {
+            theme: import("./slices/settings").ThemeMode;
+            language: "en" | "es" | "ja" | "fr";
+            affiliatePercent: number | null;
+            affiliateRef: string | null;
+            affiliateWallets: {
+                [key: string]: string;
+            } | null;
+            slippage: number;
+            customSlippage: number | null;
+            infiniteApprove: boolean;
+            preferredBlockchains: string[];
+            disabledLiquiditySources: string[];
+        }>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => void | Promise<void>;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: import("./app").AppStoreState) => void) => () => void;
+        onFinishHydration: (fn: (state: import("./app").AppStoreState) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<import("./app").AppStoreState, {
+            theme: import("./slices/settings").ThemeMode;
+            language: "en" | "es" | "ja" | "fr";
+            affiliatePercent: number | null;
+            affiliateRef: string | null;
+            affiliateWallets: {
+                [key: string]: string;
+            } | null;
+            slippage: number;
+            customSlippage: number | null;
+            infiniteApprove: boolean;
+            preferredBlockchains: string[];
+            disabledLiquiditySources: string[];
+        }>>;
+    };
+}> | null>;
 export declare function useAppStore(): import("./app").AppStoreState;
 export declare function AppStoreProvider(props: AppStoreProviderProps): React.JSX.Element;
 export {};

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

@@ -1 +1 @@
-{"version":3,"file":"AppStore.d.ts","sourceRoot":"","sources":["../../src/store/AppStore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAA4C,MAAM,OAAO,CAAC;AAKjE,KAAK,qBAAqB,GAAG,iBAAiB,CAAC;IAAE,MAAM,CAAC,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE1E,eAAO,MAAM,eAAe,kHAAuC,CAAC;AAEpE,wBAAgB,WAAW,kCAQ1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBAY5D"}
+{"version":3,"file":"AppStore.d.ts","sourceRoot":"","sources":["../../src/store/AppStore.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAC;AAE/C,OAAO,KAAuD,MAAM,OAAO,CAAC;AAK5E,KAAK,qBAAqB,GAAG,iBAAiB,CAAC;IAAE,MAAM,CAAC,EAAE,YAAY,CAAA;CAAE,CAAC,CAAC;AAE1E,eAAO,MAAM,eAAe;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;UAAuC,CAAC;AAEpE,wBAAgB,WAAW,kCAc1B;AAED,wBAAgB,gBAAgB,CAAC,KAAK,EAAE,qBAAqB,qBAY5D"}

package/dist/store/app.d.ts

@@ -1,8 +1,45 @@
 import type { ConfigSlice } from './slices/config';
 import type { DataSlice } from './slices/data';
+import type { SettingsSlice } from './slices/settings';
 import type { WidgetConfig } from '../types';
 import type { StateCreator } from 'zustand';
 export type StateCreatorWithInitialData<T extends Partial<WidgetConfig>, R extends Record<string, unknown>, V extends Record<string, unknown>> = (initialData: T | undefined, ...rest: Parameters<StateCreator<R, [], [], V>>) => ReturnType<StateCreator<R, [], [], V>>;
-export type AppStoreState = DataSlice & ConfigSlice;
-export declare function createAppStore(initialData?: WidgetConfig): import("zustand").UseBoundStore<import("zustand").StoreApi<AppStoreState>>;
+export type AppStoreState = DataSlice & ConfigSlice & SettingsSlice;
+export declare function createAppStore(initialData?: WidgetConfig): import("zustand").UseBoundStore<Omit<import("zustand").StoreApi<AppStoreState>, "persist"> & {
+    persist: {
+        setOptions: (options: Partial<import("zustand/middleware").PersistOptions<AppStoreState, {
+            theme: import("./slices/settings").ThemeMode;
+            language: "en" | "es" | "ja" | "fr";
+            affiliatePercent: number | null;
+            affiliateRef: string | null;
+            affiliateWallets: {
+                [key: string]: string;
+            } | null;
+            slippage: number;
+            customSlippage: number | null;
+            infiniteApprove: boolean;
+            preferredBlockchains: string[];
+            disabledLiquiditySources: string[];
+        }>>) => void;
+        clearStorage: () => void;
+        rehydrate: () => void | Promise<void>;
+        hasHydrated: () => boolean;
+        onHydrate: (fn: (state: AppStoreState) => void) => () => void;
+        onFinishHydration: (fn: (state: AppStoreState) => void) => () => void;
+        getOptions: () => Partial<import("zustand/middleware").PersistOptions<AppStoreState, {
+            theme: import("./slices/settings").ThemeMode;
+            language: "en" | "es" | "ja" | "fr";
+            affiliatePercent: number | null;
+            affiliateRef: string | null;
+            affiliateWallets: {
+                [key: string]: string;
+            } | null;
+            slippage: number;
+            customSlippage: number | null;
+            infiniteApprove: boolean;
+            preferredBlockchains: string[];
+            disabledLiquiditySources: string[];
+        }>>;
+    };
+}>;
 //# sourceMappingURL=app.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/store/app.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAO5C,MAAM,MAAM,2BAA2B,CACrC,CAAC,SAAS,OAAO,CAAC,YAAY,CAAC,EAC/B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAC/B,CACF,WAAW,EAAE,CAAC,GAAG,SAAS,EAC1B,GAAG,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,KAC5C,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAE5C,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,CAAC;AAEpD,wBAAgB,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY,8EAKxD"}
+{"version":3,"file":"app.d.ts","sourceRoot":"","sources":["../../src/store/app.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,iBAAiB,CAAC;AACnD,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAC/C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AACvD,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,UAAU,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAS5C,MAAM,MAAM,2BAA2B,CACrC,CAAC,SAAS,OAAO,CAAC,YAAY,CAAC,EAC/B,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,EACjC,CAAC,SAAS,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC,IAC/B,CACF,WAAW,EAAE,CAAC,GAAG,SAAS,EAC1B,GAAG,IAAI,EAAE,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,KAC5C,UAAU,CAAC,YAAY,CAAC,CAAC,EAAE,EAAE,EAAE,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC;AAE5C,MAAM,MAAM,aAAa,GAAG,SAAS,GAAG,WAAW,GAAG,aAAa,CAAC;AAEpE,wBAAgB,cAAc,CAAC,WAAW,CAAC,EAAE,YAAY;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA4BxD"}

package/dist/store/slices/settings.d.ts

@@ -0,0 +1,39 @@
+import type { ConfigSlice } from './config';
+import type { WidgetConfig } from '../../types';
+import type { SwapperMeta } from 'rango-sdk';
+import type { StateCreator } from 'zustand';
+import { type Language } from '@rango-dev/ui';
+export type ThemeMode = 'auto' | 'dark' | 'light';
+export interface SettingsSlice {
+    theme: ThemeMode;
+    language: Language;
+    disabledLiquiditySources: string[];
+    /** Keeping a history of blockchains that user has selected (in Swap process) */
+    preferredBlockchains: string[];
+    slippage: number;
+    customSlippage: number | null;
+    infiniteApprove: boolean;
+    affiliateRef: string | null;
+    affiliatePercent: number | null;
+    affiliateWallets: {
+        [key: string]: string;
+    } | null;
+    setSlippage: (slippage: number) => void;
+    setCustomSlippage: (customSlippage: number | null) => void;
+    toggleInfiniteApprove: () => void;
+    toggleLiquiditySource: (name: string) => void;
+    setTheme: (theme: ThemeMode) => void;
+    setLanguage: (language: Language) => void;
+    toggleAllLiquiditySources: (swappers: SwapperMeta[], shouldReset?: boolean) => void;
+    setAffiliateRef: (affiliateRef: string | null) => void;
+    setAffiliatePercent: (affiliatePercent: number | null) => void;
+    setAffiliateWallets: (affiliateWallets: {
+        [key: string]: string;
+    } | null) => void;
+    addPreferredBlockchain: (blockchain: string) => void;
+    updateSettings: (config: WidgetConfig) => void;
+}
+export declare const createSettingsSlice: StateCreator<SettingsSlice & ConfigSlice, [
+], [
+], SettingsSlice>;
+//# sourceMappingURL=settings.d.ts.map

package/dist/store/slices/settings.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../../src/store/slices/settings.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,UAAU,CAAC;AAC5C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,aAAa,CAAC;AAChD,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAC7C,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,SAAS,CAAC;AAE5C,OAAO,EAAE,KAAK,QAAQ,EAAE,MAAM,eAAe,CAAC;AAQ9C,MAAM,MAAM,SAAS,GAAG,MAAM,GAAG,MAAM,GAAG,OAAO,CAAC;AAElD,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,SAAS,CAAC;IACjB,QAAQ,EAAE,QAAQ,CAAC;IACnB,wBAAwB,EAAE,MAAM,EAAE,CAAC;IACnC,gFAAgF;IAChF,oBAAoB,EAAE,MAAM,EAAE,CAAC;IAC/B,QAAQ,EAAE,MAAM,CAAC;IACjB,cAAc,EAAE,MAAM,GAAG,IAAI,CAAC;IAC9B,eAAe,EAAE,OAAO,CAAC;IACzB,YAAY,EAAE,MAAM,GAAG,IAAI,CAAC;IAC5B,gBAAgB,EAAE,MAAM,GAAG,IAAI,CAAC;IAChC,gBAAgB,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,GAAG,IAAI,CAAC;IAEnD,WAAW,EAAE,CAAC,QAAQ,EAAE,MAAM,KAAK,IAAI,CAAC;IACxC,iBAAiB,EAAE,CAAC,cAAc,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC3D,qBAAqB,EAAE,MAAM,IAAI,CAAC;IAClC,qBAAqB,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,IAAI,CAAC;IAC9C,QAAQ,EAAE,CAAC,KAAK,EAAE,SAAS,KAAK,IAAI,CAAC;IACrC,WAAW,EAAE,CAAC,QAAQ,EAAE,QAAQ,KAAK,IAAI,CAAC;IAC1C,yBAAyB,EAAE,CACzB,QAAQ,EAAE,WAAW,EAAE,EACvB,WAAW,CAAC,EAAE,OAAO,KAClB,IAAI,CAAC;IACV,eAAe,EAAE,CAAC,YAAY,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IACvD,mBAAmB,EAAE,CAAC,gBAAgB,EAAE,MAAM,GAAG,IAAI,KAAK,IAAI,CAAC;IAC/D,mBAAmB,EAAE,CACnB,gBAAgB,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,GAAG,IAAI,KAC/C,IAAI,CAAC;IACV,sBAAsB,EAAE,CAAC,UAAU,EAAE,MAAM,KAAK,IAAI,CAAC;IACrD,cAAc,EAAE,CAAC,MAAM,EAAE,YAAY,KAAK,IAAI,CAAC;CAChD;AAED,eAAO,MAAM,mBAAmB,EAAE,YAAY,CAC5C,aAAa,GAAG,WAAW,EAC3B;CAAE,EACF;CAAE,EACF,aAAa,CAoHb,CAAC"}

package/dist/types/config.d.ts

@@ -86,14 +86,27 @@ export type BlockchainAndTokenConfig = {
     tokens?: Asset[];
 };
 /**
- * `ExperimentalFeatures`
+ * `Features`
  *
- * @property {boolean} routing
- *- This property is optional and sets experimental in quote api.
+ * @property {'visible' | 'hidden'} [theme]
+ * - The visibility state for the theme feature. Optional property.
+ *
+ * @property {'visible' | 'hidden'} [language]
+ * - The visibility state for the language feature. Optional property.
+ *
+ * @property {'disabled' | 'enabled'} [experimentalRoute]
+ * - The enablement state for the experimental route feature. Optional property.
+ *
+ * @property {'visible' | 'hidden'} [connectWalletButton]
+ * - The visibility state for the connect wallet button feature. Optional property.
+ *
+ * @property {'visible' | 'hidden'} [notification]
+ * - The visibility state for the notification feature. Optional property.
+ *
+ * @property {'visible' | 'hidden'} [liquiditySource]
+ * - The visibility state for the liquiditySource feature. Optional property.
  */
-type ExperimentalFeatures = {
-    routing?: boolean;
-};
+export type Features = Partial<Record<'theme' | 'language' | 'connectWalletButton' | 'notification' | 'liquiditySource', 'visible' | 'hidden'>> & Partial<Record<'experimentalRoute', 'disabled' | 'enabled'>>;
 /**
  * The type WidgetConfig defines the configuration options for a widget, including API key, affiliate
  * reference, amount, blockchain and token configurations, liquidity sources, wallet types, language,
@@ -133,7 +146,14 @@ type ExperimentalFeatures = {
  * you could use to pin tokens of your choice to the top of the token list.
  * @property {boolean} enableNewLiquiditySources - The `enableNewLiquiditySources` property is a boolean value that when you
  * set it to true, whenever a new liquidity source is added, it will be added to your list as well.
- * @property {ExperimentalFeatures} experimental - The `experimental` property is an optional object that specifies some experimental features.
+ * @property {Features} features - An optional object for configuring the visibility or enablement of various features.
+ *   Keys include:
+ *   - 'notification': Visibility state for the notification icon.
+ *   - 'theme': Visibility state for the theme.
+ *   - 'liquiditySource': Visibility state for liquidity source.
+ *   - 'connectWalletButton': Visibility state for the wallet connect icon.
+ *   - 'language': Visibility state for the language.
+ *   - 'experimentalRoute': Enablement state for the experimental route.
  */
 export type WidgetConfig = {
     apiKey: string;
@@ -152,7 +172,6 @@ export type WidgetConfig = {
     externalWallets?: boolean;
     pinnedTokens?: Asset[];
     enableNewLiquiditySources?: boolean;
-    experimental?: ExperimentalFeatures;
+    features?: Features;
 };
-export {};
 //# sourceMappingURL=config.d.ts.map

package/dist/types/config.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAC;AAC9C,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,0BAA0B,CAAC;AAClE,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,2BAA2B,CAAC;AAC5D,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,WAAW,CAAC;AAEvC;;;;;;;GAOG;AACH,MAAM,MAAM,gBAAgB,GAAG,MAAM,YAAY,CAAC;AAClD,MAAM,MAAM,YAAY,GAAG;IACzB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,IAAI,CAAC,EAAE,MAAM,CAAC;CACf,CAAC;AAEF;;;;;;;;;;;;;;;;;GAiBG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB,IAAI,CAAC,EAAE,MAAM,GAAG,OAAO,GAAG,MAAM,CAAC;IACjC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,MAAM,CAAC,EAAE;QAAE,KAAK,CAAC,EAAE,YAAY,CAAC;QAAC,IAAI,CAAC,EAAE,YAAY,CAAA;KAAE,CAAC;IACvD,YAAY,CAAC,EAAE,MAAM,CAAC;IACtB,qBAAqB,CAAC,EAAE,MAAM,CAAC;IAC/B,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,WAAW,CAAC,EAAE,OAAO,CAAC;CACvB,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,eAAe,GAAG;IAC5B,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,OAAO,CAAC,EAAE;QAAE,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAA;KAAE,CAAC;CACrC,CAAC;AAEF;;;;;;;;;;GAUG;AACH,MAAM,MAAM,wBAAwB,GAAG;IACrC,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,KAAK,CAAC,EAAE,KAAK,CAAC;IACd,WAAW,CAAC,EAAE,MAAM,EAAE,CAAC;IACvB,MAAM,CAAC,EAAE,KAAK,EAAE,CAAC;CAClB,CAAC;AAEF;;;;;GAKG;AACH,KAAK,oBAAoB,GAAG;IAC1B,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAwCG;AAEH,MAAM,MAAM,YAAY,GAAG;IACzB,MAAM,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,sBAAsB,CAAC,EAAE,MAAM,CAAC;IAChC,SAAS,CAAC,EAAE,eAAe,CAAC;IAC5B,MAAM,CAAC,EAAE,MAAM,CAAC;IAChB,IAAI,CAAC,EAAE,wBAAwB,CAAC;IAChC,EAAE,CAAC,EAAE,wBAAwB,CAAC;IAC9B,gBAAgB,CAAC,EAAE,MAAM,EAAE,CAAC;IAC5B,OAAO,CAAC,EAAE,CAAC,UAAU,GAAG,iBAAiB,CAAC,EAAE,CAAC;IAC7C,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,iBAAiB,CAAC,EAAE,OAAO,CAAC;IAC5B,QAAQ,CAAC,EAAE,QAAQ,CAAC;IACpB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,eAAe,CAAC,EAAE,OAAO,CAAC;IAC1B,YAAY,CAAC,EAAE,KAAK,EAAE,CAAC;IACvB,yBAAyB,CAAC,EAAE,OAAO,CAAC;IACpC,YAAY,CAAC,EAAE,oBAAoB,CAAC;CACrC,CAAC"}
+{"version":3,"file":"config.d.ts","sourceRoot":"","sources":["../../src/types/config.ts"],"names":[],"mappings":"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"}

package/dist/utils/settings.d.ts

@@ -1,3 +1,4 @@
+import type { Features } from '../types';
 import type { SwapperMeta } from 'rango-sdk';
 export type LiquiditySourceType = 'BRIDGE' | 'AGGREGATOR' | 'DEX';
 export type UniqueSwappersGroupType = {
@@ -7,6 +8,8 @@ export type UniqueSwappersGroupType = {
     type: LiquiditySourceType;
     selected: boolean;
 };
-export declare function getUniqueSwappersGroups(swappers: SwapperMeta[]): UniqueSwappersGroupType[];
+export declare function getUniqueSwappersGroups(swappers: SwapperMeta[], disabledLiquiditySources: string[]): UniqueSwappersGroupType[];
 export declare function sortLiquiditySourcesByGroupTitle(a: SwapperMeta, b: SwapperMeta): 1 | -1 | 0;
+export declare function isFeatureHidden(feature: keyof Features, features?: Features): boolean;
+export declare function isFeatureEnabled(feature: keyof Features, features?: Features): boolean;
 //# sourceMappingURL=settings.d.ts.map

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

@@ -1 +1 @@
-{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../src/utils/settings.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAM7C,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,YAAY,GAAG,KAAK,CAAC;AAElE,MAAM,MAAM,uBAAuB,GAAG;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,mBAAmB,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,QAAQ,EAAE,WAAW,EAAE,GACtB,uBAAuB,EAAE,CAuC3B;AAED,wBAAgB,gCAAgC,CAC9C,CAAC,EAAE,WAAW,EACd,CAAC,EAAE,WAAW,cAWf"}
+{"version":3,"file":"settings.d.ts","sourceRoot":"","sources":["../../src/utils/settings.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,QAAQ,EAAE,MAAM,UAAU,CAAC;AACzC,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,WAAW,CAAC;AAI7C,MAAM,MAAM,mBAAmB,GAAG,QAAQ,GAAG,YAAY,GAAG,KAAK,CAAC;AAElE,MAAM,MAAM,uBAAuB,GAAG;IACpC,EAAE,EAAE,MAAM,CAAC;IACX,UAAU,EAAE,MAAM,CAAC;IACnB,IAAI,EAAE,MAAM,CAAC;IACb,IAAI,EAAE,mBAAmB,CAAC;IAC1B,QAAQ,EAAE,OAAO,CAAC;CACnB,CAAC;AAEF,wBAAgB,uBAAuB,CACrC,QAAQ,EAAE,WAAW,EAAE,EACvB,wBAAwB,EAAE,MAAM,EAAE,GACjC,uBAAuB,EAAE,CAqC3B;AAED,wBAAgB,gCAAgC,CAC9C,CAAC,EAAE,WAAW,EACd,CAAC,EAAE,WAAW,cAWf;AAED,wBAAgB,eAAe,CAAC,OAAO,EAAE,MAAM,QAAQ,EAAE,QAAQ,CAAC,EAAE,QAAQ,WAE3E;AAED,wBAAgB,gBAAgB,CAAC,OAAO,EAAE,MAAM,QAAQ,EAAE,QAAQ,CAAC,EAAE,QAAQ,WAE5E"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.17.1-next.26",
+  "version": "0.17.1-next.27",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",

package/src/components/HeaderButtons/HomeButtons.tsx

@@ -11,7 +11,9 @@ import {
 } from '@rango-dev/ui';
 import React from 'react';
 
+import { useAppStore } from '../../store/AppStore';
 import { getContainer } from '../../utils/common';
+import { isFeatureHidden } from '../../utils/settings';
 import { NotificationContent } from '../NotificationContent';
 
 import { HeaderButton } from './HeaderButtons.styles';
@@ -26,6 +28,12 @@ export function HomeButtons(props: HomeButtonsPropTypes) {
     onClickNotifications,
   } = props;
 
+  const {
+    config: { features },
+  } = useAppStore();
+
+  const isNotificationsHidden = isFeatureHidden('notification', features);
+
   return (
     <>
       <Tooltip
@@ -41,25 +49,27 @@ export function HomeButtons(props: HomeButtonsPropTypes) {
         </HeaderButton>
       </Tooltip>
 
-      <Tooltip
-        container={getContainer()}
-        side="top"
-        content={i18n.t('Notifications')}>
-        <Popover
-          align="center"
-          collisionBoundary={layoutRef}
-          collisionPadding={{ right: 20, left: 20 }}
+      {!isNotificationsHidden && (
+        <Tooltip
           container={getContainer()}
-          content={<NotificationContent />}>
-          <HeaderButton
-            size="small"
-            variant="ghost"
-            onClick={onClickNotifications}>
-            <NotificationsIcon size={18} color="black" />
-            <UnreadNotificationsBadge />
-          </HeaderButton>
-        </Popover>
-      </Tooltip>
+          side="top"
+          content={i18n.t('Notifications')}>
+          <Popover
+            align="center"
+            collisionBoundary={layoutRef}
+            collisionPadding={{ right: 20, left: 20 }}
+            container={getContainer()}
+            content={<NotificationContent />}>
+            <HeaderButton
+              size="small"
+              variant="ghost"
+              onClick={onClickNotifications}>
+              <NotificationsIcon size={18} color="black" />
+              <UnreadNotificationsBadge />
+            </HeaderButton>
+          </Popover>
+        </Tooltip>
+      )}
       <Tooltip
         container={getContainer()}
         side="top"

package/src/components/Layout/Layout.tsx

@@ -5,9 +5,11 @@ import { BottomLogo, Divider, Header } from '@rango-dev/ui';
 import React from 'react';
 
 import { useNavigateBack } from '../../hooks/useNavigateBack';
+import { useAppStore } from '../../store/AppStore';
 import { useUiStore } from '../../store/ui';
 import { useWalletsStore } from '../../store/wallets';
 import { getContainer } from '../../utils/common';
+import { isFeatureHidden } from '../../utils/settings';
 import { BackButton, CancelButton, WalletButton } from '../HeaderButtons';
 
 import { Container, Content, Footer } from './Layout.styles';
@@ -22,6 +24,14 @@ function LayoutComponent(props: PropsWithChildren<PropTypes>, ref: Ref) {
     fixedHeight = true,
   } = props;
   const connectedWallets = useWalletsStore.use.connectedWallets();
+  const {
+    config: { features },
+  } = useAppStore();
+
+  const isConnectWalletHidden = isFeatureHidden(
+    'connectWalletButton',
+    features
+  );
 
   const connectWalletsButtonDisabled =
     useUiStore.use.connectWalletsButtonDisabled();
@@ -44,7 +54,7 @@ function LayoutComponent(props: PropsWithChildren<PropTypes>, ref: Ref) {
         suffix={
           <>
             {header.suffix}
-            {header.onWallet && (
+            {header.onWallet && !isConnectWalletHidden && (
               <WalletButton
                 container={getContainer()}
                 onClick={onConnectWallet}

package/src/components/NoResult/NoResult.tsx

@@ -12,17 +12,14 @@ import React from 'react';
 
 import { errorMessages } from '../../constants/errors';
 import { useAppStore } from '../../store/AppStore';
-import { useSettingsStore } from '../../store/settings';
 
 import { makeInfo } from './NoResult.helpers';
 import { Container, Footer, PrefixIcon } from './NoResult.styles';
 
 export function NoResult(props: PropTypes) {
   const { fetch, error } = props;
-  const disabledLiquiditySources =
-    useSettingsStore.use.disabledLiquiditySources();
-  const toggleAllLiquiditySources =
-    useSettingsStore.use.toggleAllLiquiditySources();
+  const disabledLiquiditySources = useAppStore().disabledLiquiditySources;
+  const toggleAllLiquiditySources = useAppStore().toggleAllLiquiditySources;
 
   const swappers = useAppStore().swappers();
 

package/src/components/QuoteWarningsAndErrors/SlippageWariningModal.tsx

@@ -9,7 +9,7 @@ import React from 'react';
 import { useNavigate } from 'react-router-dom';
 
 import { navigationRoutes } from '../../constants/navigationRoutes';
-import { useSettingsStore } from '../../store/settings';
+import { useAppStore } from '../../store/AppStore';
 import { QuoteWarningType } from '../../types';
 import { getContainer } from '../../utils/common';
 
@@ -21,7 +21,7 @@ type PropsTypes = {
 };
 
 export function SlippageWarningModal(props: PropsTypes) {
-  const { customSlippage, slippage } = useSettingsStore();
+  const { customSlippage, slippage } = useAppStore();
   const { open, onClose, onConfirm, warning } = props;
   const navigate = useNavigate();
   const userSlippage = customSlippage ?? slippage;

package/src/components/Slippage/Slippage.tsx

@@ -14,17 +14,15 @@ import {
   MIN_SLIPPGAE,
   SLIPPAGES,
 } from '../../constants/swapSettings';
-import { useSettingsStore } from '../../store/settings';
+import { useAppStore } from '../../store/AppStore';
 import { getContainer } from '../../utils/common';
 
 import { BaseContainer, Head, SlippageChipsContainer } from './Slippage.styles';
 import { SlippageTooltipContent } from './SlippageTooltipContent';
 
 export function Slippage() {
-  const slippage = useSettingsStore.use.slippage();
-  const setSlippage = useSettingsStore.use.setSlippage();
-  const customSlippage = useSettingsStore.use.customSlippage();
-  const setCustomSlippage = useSettingsStore.use.setCustomSlippage();
+  const { slippage, setSlippage, customSlippage, setCustomSlippage } =
+    useAppStore();
 
   return (
     <BaseContainer>

package/src/containers/App/App.tsx

@@ -11,7 +11,6 @@ import { useLanguage } from '../../hooks/useLanguage';
 import { useTheme } from '../../hooks/useTheme';
 import { useAppStore } from '../../store/AppStore';
 import { useNotificationStore } from '../../store/notification';
-import { useSettingsStore } from '../../store/settings';
 import { WidgetContext } from '../Wallets';
 
 import { MainContainer } from './App.styles';
@@ -29,7 +28,6 @@ export function Main() {
 
   useEffect(() => {
     void fetchMeta().catch();
-    void useSettingsStore.persist.rehydrate();
     void useNotificationStore.persist.rehydrate();
     widgetContext.onConnectWallet(setLastConnectedWalletWithNetwork);
   }, []);

package/src/containers/Wallets/Wallets.tsx

@@ -28,7 +28,7 @@ export const WidgetContext = createContext<WidgetContextInterface>({
 });
 
 function Main(props: PropsWithChildren<PropTypes>) {
-  const { updateConfig } = useAppStore();
+  const { updateConfig, updateSettings } = useAppStore();
   const blockchains = useAppStore().blockchains();
   const tokens = useAppStore().tokens();
   const walletOptions: ProvidersOptions = {
@@ -42,6 +42,7 @@ function Main(props: PropsWithChildren<PropTypes>) {
   useEffect(() => {
     if (props.config) {
       updateConfig(props.config);
+      updateSettings(props.config);
     }
   }, [props.config]);
 

package/src/hooks/useConfirmSwap/useConfirmSwap.ts

@@ -7,8 +7,8 @@ import { useEffect } from 'react';
 
 import { useAppStore } from '../../store/AppStore';
 import { useQuoteStore } from '../../store/quote';
-import { useSettingsStore } from '../../store/settings';
 import { useWalletsStore } from '../../store/wallets';
+import { isFeatureEnabled } from '../../utils/settings';
 import { createQuoteRequestBody, getWalletsForNewSwap } from '../../utils/swap';
 import { useFetchQuote } from '../useFetchQuote';
 
@@ -36,11 +36,11 @@ export function useConfirmSwap(): ConfirmSwap {
     affiliateRef,
     affiliateWallets,
     disabledLiquiditySources,
-  } = useSettingsStore();
+  } = useAppStore();
   const { connectedWallets } = useWalletsStore();
   const blockchains = useAppStore().blockchains();
   const tokens = useAppStore().tokens();
-  const { experimental } = useAppStore().config;
+  const { features } = useAppStore().config;
   const { enableNewLiquiditySources } = useAppStore().config;
 
   const userSlippage = customSlippage || slippage;
@@ -78,7 +78,7 @@ export function useConfirmSwap(): ConfirmSwap {
       initialQuote: initialQuote ?? undefined,
       destination: customDestination,
     });
-    if (experimental?.routing) {
+    if (isFeatureEnabled('experimentalRoute', features)) {
       requestBody.experimental = true;
     }
     let currentQuote: BestRouteResponse;

package/src/hooks/useLanguage.ts

@@ -3,7 +3,7 @@ import type { LanguageItem } from '../constants/languages';
 import { type Language } from '@rango-dev/ui';
 
 import { DEFAULT_LANGUAGE, LANGUAGES } from '../constants/languages';
-import { useSettingsStore } from '../store/settings';
+import { useAppStore } from '../store/AppStore';
 
 interface UseLanguage {
   languages: LanguageItem[];
@@ -13,8 +13,7 @@ interface UseLanguage {
 }
 
 export function useLanguage(): UseLanguage {
-  const language = useSettingsStore.use.language();
-  const setLanguage = useSettingsStore.use.setLanguage();
+  const { setLanguage, language } = useAppStore();
   const languages = LANGUAGES;
   const defaultLanguage = DEFAULT_LANGUAGE;
 

package/src/hooks/usePrepareBlockchainList/usePrepareBlockchainList.ts

@@ -6,7 +6,7 @@ import type { BlockchainMeta } from 'rango-sdk';
 
 import { useEffect } from 'react';
 
-import { useSettingsStore } from '../../store/settings';
+import { useAppStore } from '../../store/AppStore';
 
 import { isInVisibleList, prepare } from './usePrepareBlockchainList.helpers';
 
@@ -20,7 +20,7 @@ export function usePrepareBlockchainList(
   blockchains: BlockchainMeta[],
   options?: PrepareListOptions
 ): UsePrepareList {
-  const { preferredBlockchains, addPreferredBlockchain } = useSettingsStore();
+  const { preferredBlockchains, addPreferredBlockchain } = useAppStore();
 
   useEffect(() => {
     if (options?.selected) {

package/src/hooks/useSwapInput.ts

@@ -5,11 +5,11 @@ import { useCallback, useEffect, useState } from 'react';
 
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
-import { useSettingsStore } from '../store/settings';
 import { QuoteErrorType } from '../types';
 import { debounce } from '../utils/common';
 import { isPositiveNumber } from '../utils/numbers';
 import { generateQuoteWarnings } from '../utils/quote';
+import { isFeatureEnabled } from '../utils/settings';
 import { createQuoteRequestBody } from '../utils/swap';
 import { tokensAreEqual } from '../utils/wallets';
 
@@ -40,7 +40,7 @@ type UseSwapInput = {
  */
 export function useSwapInput(): UseSwapInput {
   const { fetch: fetchQuote, cancelFetch } = useFetchQuote();
-  const { liquiditySources, enableNewLiquiditySources, experimental } =
+  const { liquiditySources, enableNewLiquiditySources, features } =
     useAppStore().config;
   const tokens = useAppStore().tokens();
   const {
@@ -58,7 +58,7 @@ export function useSwapInput(): UseSwapInput {
     affiliateRef,
     affiliateWallets,
     disabledLiquiditySources,
-  } = useSettingsStore();
+  } = useAppStore();
   const [loading, setLoading] = useState(false);
   const [error, setError] = useState<QuoteError | null>(null);
   const [warning, setWarning] = useState<QuoteWarning | null>(null);
@@ -105,7 +105,7 @@ export function useSwapInput(): UseSwapInput {
         affiliatePercent,
         affiliateWallets,
       });
-      if (experimental?.routing) {
+      if (isFeatureEnabled('experimentalRoute', features)) {
         requestBody.experimental = true;
       }
       fetchQuote(requestBody)

package/src/hooks/useSyncStoresWithConfig.ts

@@ -4,7 +4,6 @@ import { useEffect, useLayoutEffect, useMemo, useRef } from 'react';
 
 import { useAppStore } from '../store/AppStore';
 import { useQuoteStore } from '../store/quote';
-import { useSettingsStore } from '../store/settings';
 import { tokensAreEqual } from '../utils/wallets';
 
 export function useSyncStoresWithConfig() {
@@ -26,7 +25,7 @@ export function useSyncStoresWithConfig() {
   const tokens = useAppStore().tokens();
 
   const { setAffiliateRef, setAffiliatePercent, setAffiliateWallets } =
-    useSettingsStore();
+    useAppStore();
 
   const fromTokensConfig = useMemo(
     () => config?.from?.tokens,

package/src/hooks/useTheme.ts

@@ -1,6 +1,4 @@
 /* eslint-disable @typescript-eslint/no-magic-numbers */
-import type { WidgetTheme } from '../types';
-
 import {
   createTheme,
   darkTheme as defaultDarkTheme,
@@ -8,7 +6,8 @@ import {
 } from '@rango-dev/ui';
 import { useEffect, useState } from 'react';
 
-import { useSettingsStore } from '../store/settings';
+import { useAppStore } from '../store/AppStore';
+import { type WidgetTheme } from '../types';
 import {
   DEFAULT_FONT_FAMILY,
   DEFAULT_PRIMARY_RADIUS,
@@ -26,8 +25,8 @@ export function useTheme(props: WidgetTheme) {
   } = props;
 
   const [OSTheme, setOSTheme] = useState('light');
-  const theme = useSettingsStore.use.theme();
-  const setTheme = useSettingsStore.use.setTheme();
+
+  const { setTheme, theme } = useAppStore();
 
   const { dark, light } = customizedThemeTokens(colors);