@rango-dev/widget-embedded 0.56.1-next.5 → 0.56.1-next.6

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@rango-dev/widget-embedded",
-  "version": "0.56.1-next.5",
+  "version": "0.56.1-next.6",
   "license": "MIT",
   "type": "module",
   "source": "./src/index.ts",
@@ -30,7 +30,7 @@
     "@rango-dev/queue-manager-rango-preset": "^0.58.1-next.0",
     "@rango-dev/queue-manager-react": "^0.33.0",
     "@rango-dev/signer-solana": "^0.46.1",
-    "@rango-dev/ui": "^0.59.1-next.1",
+    "@rango-dev/ui": "^0.59.1-next.2",
     "@rango-dev/wallets-core": "^0.55.1-next.0",
     "@rango-dev/wallets-react": "^0.42.1-next.1",
     "@rango-dev/wallets-shared": "^0.56.1-next.0",

package/src/components/Quote/Quote.tsx

@@ -5,6 +5,7 @@ import type { SwapResult } from 'rango-sdk';
 import { i18n } from '@lingui/core';
 import {
   Alert,
+  CampaignQuoteTag,
   Divider,
   FullExpandedQuote,
   InfoIcon,
@@ -110,6 +111,10 @@ export function Quote(props: QuoteProps) {
         USD_VALUE_MAX_DECIMALS
       )
     : '';
+  const {
+    config: { __UNSTABLE_OR_INTERNAL__ },
+  } = useAppStore();
+
   const priceImpact = getPriceImpact(input.usdValue, output.usdValue ?? null);
   const percentageChange = numberToString(
     priceImpact,
@@ -350,6 +355,7 @@ export function Quote(props: QuoteProps) {
       tooltipContainer={getExpanded()}
       steps={steps}
       tags={sortedQuoteTags}
+      campaignTag={__UNSTABLE_OR_INTERNAL__?.campaignTag}
       id="widget-quote-full-expanded-quote-container"
       quoteCost={
         <QuoteCostDetails
@@ -384,9 +390,18 @@ export function Quote(props: QuoteProps) {
             <TagContainer>
               {sortedQuoteTags.map((tag, index) => {
                 const key = `${tag.value}_${index}`;
+
                 return (
                   <React.Fragment key={key}>
-                    <QuoteTag label={tag.label} value={tag.value} />
+                    {tag.value == 'CAMPAIGN' &&
+                    __UNSTABLE_OR_INTERNAL__?.campaignTag ? (
+                      <CampaignQuoteTag
+                        routeTag={tag}
+                        {...__UNSTABLE_OR_INTERNAL__.campaignTag}
+                      />
+                    ) : (
+                      <QuoteTag label={tag.label} value={tag.value} />
+                    )}
                     <Divider size={4} direction="horizontal" />
                   </React.Fragment>
                 );

package/src/components/Quotes/Quotes.tsx

@@ -43,6 +43,9 @@ export function Quotes(props: PropTypes) {
   const container = propContainer || getContainer();
   const hasQuotes = !!quotes && quotes.results.length;
   const userSlippage = customSlippage ?? slippage;
+  const {
+    config: { __UNSTABLE_OR_INTERNAL__ },
+  } = useAppStore();
   const getQuoteWarning = (quote: MultiRouteSimulationResult) => {
     if (!fromToken || !toToken || !quotes) {
       return null;
@@ -85,7 +88,10 @@ export function Quotes(props: PropTypes) {
         Array.from({ length: ITEM_SKELETON_COUNT }, (_, index) => (
           <React.Fragment key={index}>
             {fullExpandedMode ? (
-              <FullExpandedQuote loading />
+              <FullExpandedQuote
+                campaignTag={__UNSTABLE_OR_INTERNAL__?.campaignTag}
+                loading
+              />
             ) : (
               <QuoteSkeleton
                 tagHidden={false}

package/src/types/config.ts

@@ -275,6 +275,13 @@ export type WidgetConfig = {
   __UNSTABLE_OR_INTERNAL__?: {
     walletConnectListedDesktopWalletLink?: string;
     autoUpdateSettings?: boolean; // If true, settings will be updated automatically based on the configuration.
+    campaignTag?: {
+      backgroundUrl: string;
+      linkUrl: string;
+      iconUrl: string;
+      title: string;
+      id: string;
+    };
     swapBoxBanner?: {
       element: ReactElement;
       routes?: string[];