@liquidcommercedev/rmn-sdk 1.5.0-beta.1 → 1.5.0-beta.11

package/dist/index.esm.js

@@ -1,6 +1,7 @@
 var RMN_SPOT_TYPE;
 (function (RMN_SPOT_TYPE) {
     // Reserve Bar Spot Types
+    RMN_SPOT_TYPE["RB_HOMEPAGE_HERO"] = "rbHomepageHero";
     RMN_SPOT_TYPE["RB_HOMEPAGE_HERO_THREE_TILE"] = "rbHomepageHeroThreeTile";
     RMN_SPOT_TYPE["RB_HOMEPAGE_HERO_TWO_TILE"] = "rbHomepageHeroTwoTile";
     RMN_SPOT_TYPE["RB_HOMEPAGE_HERO_FULL_IMAGE"] = "rbHomepageHeroFullImage";
@@ -52,14 +53,21 @@ var RMN_FILTER_PROPERTIES;
     RMN_FILTER_PROPERTIES["PUBLISHERS"] = "publishers";
     RMN_FILTER_PROPERTIES["SECTION"] = "section";
 })(RMN_FILTER_PROPERTIES || (RMN_FILTER_PROPERTIES = {}));
+var RMN_EVENT;
+(function (RMN_EVENT) {
+    RMN_EVENT["LIFECYCLE_STATE"] = "LIFECYCLE_STATE";
+    RMN_EVENT["SPOT_EVENT"] = "SPOT_EVENT";
+})(RMN_EVENT || (RMN_EVENT = {}));
 var RMN_SPOT_EVENT;
 (function (RMN_SPOT_EVENT) {
-    RMN_SPOT_EVENT["LIFECYCLE_STATE"] = "LIFECYCLE_STATE";
     RMN_SPOT_EVENT["IMPRESSION"] = "IMPRESSION";
     RMN_SPOT_EVENT["CLICK"] = "CLICK";
     RMN_SPOT_EVENT["PURCHASE"] = "PURCHASE";
     RMN_SPOT_EVENT["ADD_TO_CART"] = "ADD_TO_CART";
+    RMN_SPOT_EVENT["REMOVE_FROM_CART"] = "REMOVE_FROM_CART";
+    RMN_SPOT_EVENT["ADD_TO_CART_FROM_DETAILS"] = "ADD_TO_CART_FROM_DETAILS";
     RMN_SPOT_EVENT["ADD_TO_WISHLIST"] = "ADD_TO_WISHLIST";
+    RMN_SPOT_EVENT["EXPAND_PRODUCT"] = "EXPAND_PRODUCT";
     RMN_SPOT_EVENT["BUY_NOW"] = "BUY_NOW";
 })(RMN_SPOT_EVENT || (RMN_SPOT_EVENT = {}));
 var RMN_ENV;
@@ -70,6 +78,511 @@ var RMN_ENV;
     RMN_ENV["PRODUCTION"] = "production";
 })(RMN_ENV || (RMN_ENV = {}));
 
+const SPOT_EVENTS_EXAMPLE = [
+    {
+        event: RMN_SPOT_EVENT.CLICK,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwidXIiOm51bGx9&s=hWz37kbxi_u95EVNn2aoQhc5Aas',
+    },
+    {
+        event: RMN_SPOT_EVENT.IMPRESSION,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiYmEiOjEsImZxIjowfQ&s=djoysjCimurf-5T11AlNAwwLSS8',
+    },
+    {
+        event: RMN_SPOT_EVENT.PURCHASE,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjU5fQ&s=AAPAw-3SfZ0JMzjEGFSwt9L-2S4',
+    },
+    {
+        event: RMN_SPOT_EVENT.ADD_TO_CART,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjYwfQ&s=uzQFcjgL7m9XqUG8FvTPVN5YkZY',
+    },
+    {
+        event: RMN_SPOT_EVENT.ADD_TO_WISHLIST,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjYzfQ&s=m3ISU_iIy-OFtXrTKpI6cJAEC0k',
+    },
+    {
+        event: RMN_SPOT_EVENT.BUY_NOW,
+        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjY5fQ&s=l6MOscQC-q-FkC2Ksd7w6jjySCQ',
+    },
+];
+const RB_SPOTS_SELECTION_EXAMPLE = {
+    rbHomepageHero: [
+        {
+            id: 'abc123',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            width: 1140,
+            height: 640,
+            header: 'Premium Wine Collection',
+            description: 'Discover our exclusive selection of vintage wines',
+            ctaText: 'Shop Wines',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Wine+Collection',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Wine',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [1, 2, 3],
+        },
+        {
+            id: 'jkl012',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Whiskey Collection',
+            description: 'Premium whiskeys from around the world',
+            ctaText: 'Shop Whiskeys',
+            textColor: '#ffffff',
+            backgroundColor: '#2c1810',
+            ctaTextColor: '#2c1810',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Whiskey',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Whiskey',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [10, 11],
+        },
+        {
+            id: 'stu901',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Summer Cocktails',
+            description: 'Essential spirits for summer mixing',
+            ctaText: 'Mix It Up',
+            textColor: '#ffffff',
+            backgroundColor: '#4d3a0a',
+            ctaTextColor: '#4d3a0a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Cocktails',
+            secondaryImage: 'https://placehold.co/1140x640/png?text=Mixers',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Cocktails',
+            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Mixers',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [16, 17, 18],
+        },
+        {
+            id: 'def456',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            width: 1140,
+            height: 640,
+            header: 'Craft Beer Festival',
+            description: 'Local breweries and exclusive releases',
+            ctaText: 'Explore Beers',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Beer+Festival',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Beer',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [4, 5, 6],
+        },
+        {
+            id: 'mno345',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Champagne Selection',
+            description: 'Finest champagnes for every occasion',
+            ctaText: 'View Champagnes',
+            textColor: '#ffffff',
+            backgroundColor: '#1a1a1a',
+            ctaTextColor: '#1a1a1a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Champagne',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Champagne',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [12, 13],
+        },
+        {
+            id: 'vwx234',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Wine Regions',
+            description: 'Explore wines from top regions',
+            ctaText: 'Tour Regions',
+            textColor: '#ffffff',
+            backgroundColor: '#4d0a0a',
+            ctaTextColor: '#4d0a0a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Wine+Regions',
+            secondaryImage: 'https://placehold.co/1140x640/png?text=Vineyards',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Regions',
+            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Vineyards',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [19, 20, 21],
+        },
+        {
+            id: 'ghi789',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            width: 1140,
+            height: 640,
+            header: 'Rare Spirits',
+            description: 'Limited edition spirits collection',
+            ctaText: 'View Collection',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Rare+Spirits',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Spirits',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [7, 8, 9],
+        },
+        {
+            id: 'pqr678',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Gin Collection',
+            description: 'Artisanal gins and botanicals',
+            ctaText: 'Explore Gins',
+            textColor: '#ffffff',
+            backgroundColor: '#0a4d4d',
+            ctaTextColor: '#0a4d4d',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Gin',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Gin',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [14, 15],
+        },
+        {
+            id: 'yz5678',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Tequila Collection',
+            description: 'Premium tequilas and mezcals',
+            ctaText: 'Shop Tequila',
+            textColor: '#ffffff',
+            backgroundColor: '#0a4d2b',
+            ctaTextColor: '#0a4d2b',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Tequila',
+            secondaryImage: 'https://placehold.co/1140x640/png?text=Mezcal',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Tequila',
+            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Mezcal',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [22, 23, 24],
+        },
+    ],
+    rbHomepageHeroFullImage: [
+        {
+            id: 'hjk567',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            width: 1140,
+            height: 640,
+            header: 'Holiday Gift Guide',
+            description: 'Perfect spirits for every occasion',
+            ctaText: 'Shop Gifts',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Gift+Guide',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Gifts',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [25, 26],
+        },
+        {
+            id: 'qwe890',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
+            width: 1140,
+            height: 640,
+            header: 'Summer Wine Festival',
+            description: 'Refreshing wines for summer',
+            ctaText: 'Shop Festival',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Wine+Festival',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Festival',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [27, 28],
+        },
+    ],
+    rbHomepageHeroTwoTile: [
+        {
+            id: 'iop987',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Bourbon Selection',
+            description: "Kentucky's finest bourbons",
+            ctaText: 'Shop Bourbon',
+            textColor: '#ffffff',
+            backgroundColor: '#2c1810',
+            ctaTextColor: '#2c1810',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Bourbon',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Bourbon',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [29, 30],
+        },
+        {
+            id: 'lkj012',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Vodka Collection',
+            description: 'Premium vodkas from around the world',
+            ctaText: 'Shop Vodka',
+            textColor: '#ffffff',
+            backgroundColor: '#1a1a1a',
+            ctaTextColor: '#1a1a1a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Vodka',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Vodka',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [31, 32],
+        },
+    ],
+    rbHomepageHeroThreeTile: [
+        {
+            id: 'bnm345',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Rum Collection',
+            description: 'Caribbean and craft rums',
+            ctaText: 'Shop Rum',
+            textColor: '#ffffff',
+            backgroundColor: '#4d3a0a',
+            ctaTextColor: '#4d3a0a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Rum',
+            secondaryImage: 'https://placehold.co/1140x640/png?text=Craft+Rum',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Rum',
+            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Craft',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [33, 34],
+        },
+        {
+            id: 'fgh678',
+            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
+            width: 1140,
+            height: 640,
+            header: 'Scotch Selection',
+            description: 'Single malts and blends',
+            ctaText: 'Shop Scotch',
+            textColor: '#ffffff',
+            backgroundColor: '#4d0a0a',
+            ctaTextColor: '#4d0a0a',
+            primaryImage: 'https://placehold.co/1140x640/png?text=Scotch',
+            secondaryImage: 'https://placehold.co/1140x640/png?text=Single+Malts',
+            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Scotch',
+            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Malts',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [35, 36],
+        },
+    ],
+    rbLargeCategoryImageTout: [
+        {
+            id: 'cde567',
+            spot: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            width: 468,
+            height: 410,
+            header: 'Rare & Limited Edition',
+            description: 'Discover our collection of hard-to-find and limited release spirits.',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/468x410/png?text=Rare+Spirits',
+            mobilePrimaryImage: 'https://placehold.co/468x410/png?text=Mobile+Rare+Spirits',
+            ctaText: 'Shop Rare Spirits',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [37, 38, 39, 40, 41],
+        },
+        {
+            id: 'efg789',
+            spot: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            width: 468,
+            height: 410,
+            header: 'Vintage Champagnes',
+            description: 'Explore our prestigious collection of aged champagnes.',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/468x410/png?text=Vintage+Champagne',
+            mobilePrimaryImage: 'https://placehold.co/468x410/png?text=Mobile+Champagne',
+            ctaText: 'View Collection',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [42, 43, 44, 45, 46],
+        },
+        {
+            id: 'ghi012',
+            spot: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
+            width: 468,
+            height: 410,
+            header: 'Small Batch Bourbon',
+            description: 'Hand-selected premium bourbon from craft distilleries.',
+            textColor: '#ffffff',
+            ctaTextColor: '#ffffff',
+            primaryImage: 'https://placehold.co/468x410/png?text=Craft+Bourbon',
+            mobilePrimaryImage: 'https://placehold.co/468x410/png?text=Mobile+Bourbon',
+            ctaText: 'Explore Bourbon',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [47, 48, 49, 50, 51],
+        },
+    ],
+    rbSmallDiscoverTout: [
+        {
+            id: 'jkl345',
+            spot: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            width: 224,
+            height: 378,
+            header: 'Château Margaux 2015 Bordeaux',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x378/png?text=Château+Margaux',
+            mobilePrimaryImage: 'https://placehold.co/224x378/png?text=Mobile+Château+Margaux',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [52, 53, 54, 55, 56],
+        },
+        {
+            id: 'lmn678',
+            spot: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            width: 224,
+            height: 378,
+            header: 'Macallan 25 Year',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x378/png?text=Macallan+25',
+            mobilePrimaryImage: 'https://placehold.co/224x378/png?text=Mobile+Macallan',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [57, 58, 59, 60, 61],
+        },
+        {
+            id: 'nop901',
+            spot: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
+            width: 224,
+            height: 378,
+            header: 'Louis XIII Cognac',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x378/png?text=Louis+XIII',
+            mobilePrimaryImage: 'https://placehold.co/224x378/png?text=Mobile+Louis+XIII',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [62, 63, 64, 65, 66],
+        },
+    ],
+    rbSmallCategoryImageTout: [
+        {
+            id: 'qrs234',
+            spot: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            width: 224,
+            height: 410,
+            header: 'Japanese Sake',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x410/png?text=Japanese+Sake',
+            mobilePrimaryImage: 'https://placehold.co/224x410/png?text=Mobile+Japanese+Sake',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [67, 68, 69, 70, 71],
+        },
+        {
+            id: 'stu567',
+            spot: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            width: 224,
+            height: 410,
+            header: 'Craft Vermouth',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x410/png?text=Craft+Vermouth',
+            mobilePrimaryImage: 'https://placehold.co/224x410/png?text=Mobile+Vermouth',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [72, 73, 74, 75, 76],
+        },
+        {
+            id: 'vwx890',
+            spot: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            variant: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
+            width: 224,
+            height: 410,
+            header: 'Premium Mezcal',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/224x410/png?text=Premium+Mezcal',
+            mobilePrimaryImage: 'https://placehold.co/224x410/png?text=Mobile+Mezcal',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [77, 78, 79, 80, 81],
+        },
+    ],
+    rbCollectionBannerWithoutTextBlock: [
+        {
+            id: 'yz1234',
+            spot: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            variant: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            width: 887,
+            height: 344,
+            primaryImage: 'https://placehold.co/887x344/png?text=Summer+Cocktails',
+            mobilePrimaryImage: 'https://placehold.co/887x344/png?text=Mobile+Summer+Cocktails',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [82, 83, 84, 85, 86],
+        },
+        {
+            id: 'abc567',
+            spot: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            variant: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            width: 887,
+            height: 344,
+            primaryImage: 'https://placehold.co/887x344/png?text=Holiday+Spirits',
+            mobilePrimaryImage: 'https://placehold.co/887x344/png?text=Mobile+Holiday+Spirits',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [87, 88, 89, 90, 91],
+        },
+        {
+            id: 'def901',
+            spot: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            variant: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
+            width: 887,
+            height: 344,
+            primaryImage: 'https://placehold.co/887x344/png?text=Wine+Essentials',
+            mobilePrimaryImage: 'https://placehold.co/887x344/png?text=Mobile+Wine+Essentials',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [92, 93, 94, 95, 96],
+        },
+    ],
+    rbNavigationBanner: [
+        {
+            id: 'ghi234',
+            spot: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            variant: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            width: 440,
+            height: 220,
+            header: 'Explore Tequilas',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/440x220/png?text=Tequila+Collection',
+            mobilePrimaryImage: 'https://placehold.co/440x220/png?text=Mobile+Tequila+Collection',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [97, 98, 99, 100, 101],
+        },
+        {
+            id: 'jkl678',
+            spot: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            variant: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            width: 440,
+            height: 220,
+            header: 'Craft Gin Selection',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/440x220/png?text=Gin+Selection',
+            mobilePrimaryImage: 'https://placehold.co/440x220/png?text=Mobile+Gin+Selection',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [102, 103, 104, 105, 106],
+        },
+        {
+            id: 'mno012',
+            spot: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            variant: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
+            width: 440,
+            height: 220,
+            header: 'Premium Vodka',
+            textColor: '#ffffff',
+            primaryImage: 'https://placehold.co/440x220/png?text=Vodka+Premium',
+            mobilePrimaryImage: 'https://placehold.co/440x220/png?text=Mobile+Vodka+Premium',
+            events: SPOT_EVENTS_EXAMPLE,
+            productIds: [107, 108, 109, 110, 111],
+        },
+    ],
+};
+
 const REQUEST_CLOUD_PARTNER_SITE = 'X-Liquid-Partner-Site';
 const REQUEST_CLOUD_PROTECTED_KEY = 'X-Liquid-Protected';
 const REQUEST_CLOUD_PROTECTED_TIMESTAMP = 'X-Liquid-Timestamp';
@@ -6032,6 +6545,94 @@ axios.HttpStatusCode = HttpStatusCode;
 
 axios.default = axios;
 
+/**
+ * Keyword patterns for each RMN_SPOT_EVENT.
+ * Each event type has required keywords that must be present and optional ones.
+ *
+ * Note: The order of checks matters - more specific patterns must be checked before general ones
+ * to avoid incorrect matches.
+ */
+const EVENT_KEYWORDS = {
+    [RMN_SPOT_EVENT.ADD_TO_CART_FROM_DETAILS]: {
+        required: ['add', 'cart'],
+        optional: ['details', 'detail', 'single', 'profile', 'page', 'pdp'],
+    },
+    [RMN_SPOT_EVENT.BUY_NOW]: {
+        required: ['buy', 'now'],
+    },
+    [RMN_SPOT_EVENT.EXPAND_PRODUCT]: {
+        required: ['product'],
+        optional: ['details', 'expand', 'modal', 'popup', 'quickview', 'view'],
+    },
+    [RMN_SPOT_EVENT.ADD_TO_WISHLIST]: {
+        required: ['add', 'wishlist'],
+    },
+    [RMN_SPOT_EVENT.REMOVE_FROM_CART]: {
+        required: ['remove', 'cart'],
+    },
+    [RMN_SPOT_EVENT.PURCHASE]: {
+        required: ['purchase'],
+    },
+    [RMN_SPOT_EVENT.ADD_TO_CART]: {
+        required: ['add', 'cart'],
+    },
+};
+/**
+ * Normalizes an event name by converting to lowercase, removing special characters,
+ * and splitting into words.
+ */
+function normalizeEventName(event) {
+    return event
+        .toLowerCase()
+        .replace(/[^a-z0-9\s]+/g, ' ') // Replace special chars with spaces
+        .split(/\s+/) // Split on whitespace
+        .filter(Boolean); // Remove empty strings
+}
+/**
+ * Checks if a word matches a keyword, considering word boundaries.
+ * This prevents partial word matches (e.g., "card" shouldn't match "cart").
+ */
+function wordMatchesKeyword(word, keyword) {
+    // Create a RegExp that matches the keyword as a whole word
+    const keywordRegex = new RegExp(`^${keyword}s?$|${keyword}s?\\W|\\W${keyword}s?$|\\W${keyword}s?\\W`);
+    return keywordRegex.test(` ${word} `); // Add spaces to handle word boundaries
+}
+/**
+ * Checks if all required keywords and at least one optional keyword (if specified) are present.
+ */
+function matchesKeywordPattern(words, required, optional) {
+    // Check if all required keywords are present as whole words
+    const hasAllRequired = required.every((keyword) => words.some((word) => wordMatchesKeyword(word, keyword)));
+    if (!hasAllRequired) {
+        return false;
+    }
+    // If no optional keywords are specified, return true
+    if (!(optional === null || optional === void 0 ? void 0 : optional.length)) {
+        return true;
+    }
+    // If optional keywords exist, check if at least one matches as a whole word
+    return optional.some((keyword) => words.some((word) => wordMatchesKeyword(word, keyword)));
+}
+/**
+ * Determines the event type from a raw event string by checking for keyword patterns.
+ *
+ * @param {string} [event] - The raw event string to evaluate
+ * @returns {RMN_SPOT_EVENT | null} - The corresponding RMN_SPOT_EVENT or null if no match
+ */
+function getEventTypeFromRawEvent(event) {
+    if (!(event === null || event === void 0 ? void 0 : event.trim())) {
+        return null;
+    }
+    const words = normalizeEventName(event);
+    // Use Object.entries to maintain the exact order defined in EVENT_KEYWORDS
+    for (const [eventType, { required, optional }] of Object.entries(EVENT_KEYWORDS)) {
+        if (matchesKeywordPattern(words, required, optional)) {
+            return eventType;
+        }
+    }
+    return null;
+}
+
 class SingletonManager {
     /**
      * Retrieves an instance of the specified class using the provided instance creator function.
@@ -6088,114 +6689,421 @@ class ObjectHelper {
         return Object.values(source);
     }
     /**
-     * Checks if a given key is present in a source object.
-     *
-     * @param {Record<string, any>} source - The object to search within.
-     * @param {string} key - The key to check for.
-     * @return {boolean} - True if the key is present in the source, false otherwise.
+     * Checks if a given key is present in a source object.
+     *
+     * @param {Record<string, any>} source - The object to search within.
+     * @param {string} key - The key to check for.
+     * @return {boolean} - True if the key is present in the source, false otherwise.
+     */
+    includes(source, key) {
+        return key in source;
+    }
+    /**
+     * Checks if the given value is included in the values of a source object.
+     *
+     * @param {Record<string, any>} source - The source object to check the values from.
+     * @param {string} value - The value to search for in the source object values.
+     * @returns {boolean} - True if the value is found in the source object values, false otherwise.
+     */
+    valuesIncludes(source, value) {
+        const sourceValues = Object.values(source);
+        return sourceValues.includes(value);
+    }
+    /**
+     * Checks if all keys from the given 'keys' array are present in the 'source' object.
+     *
+     * @param {Record<string, any>} source - The object to be checked.
+     * @param {string[]} keys - The array of keys to be checked in the 'source' object.
+     * @return {boolean} - Returns true if all keys are present in the 'source' object,
+     *                    false otherwise.
+     */
+    hasAllValues(source, keys) {
+        const sourceKeys = Object.keys(source);
+        return keys.every((key) => sourceKeys.includes(key));
+    }
+    /**
+     * Checks if the given object is an array.
+     *
+     * @param {any} obj - The object to check.
+     * @return {boolean} - Returns true if the object is an array, otherwise returns false.
+     */
+    isArray(obj) {
+        return Object.prototype.toString.call(obj) === '[object Array]';
+    }
+    /**
+     * Merges the value with the target value.
+     *
+     * @param {any[] | Record<string, T>} targetValue - The target value to merge with.
+     * @param {Record<string, any>} value - The value to merge.
+     * @returns {Record<string, any>} - The merged value.
+     */
+    mergeValue(targetValue, value) {
+        var _a;
+        if (this.isArray(value)) {
+            return this.mergeArrayValues(targetValue, value);
+        }
+        else if (typeof value === 'object') {
+            return this.mergeObjectValues(targetValue, value);
+        }
+        return (_a = value !== null && value !== void 0 ? value : targetValue) !== null && _a !== void 0 ? _a : undefined;
+    }
+    /**
+     * Merges the values of an array or object with a given array of objects and returns the merged result as an object.
+     * If the targetValue is not an array, it returns a copy of the value array.
+     *
+     * @param targetValue - The target array or object to merge values into.
+     * @param value - The array of objects containing values to merge into the targetValue.
+     * @returns The merged result as an object.
+     */
+    mergeArrayValues(targetValue, value) {
+        if (!this.isArray(targetValue)) {
+            return [...value];
+        }
+        // make TypeScript understand that targetValue is an array
+        const targetArray = targetValue;
+        for (let i = 0, l = value.length; i < l; i++) {
+            targetArray[i] = this.mergeValue(targetArray[i], value[i]);
+        }
+        return targetArray;
+    }
+    /**
+     * Merges the values of two objects or arrays into a single object.
+     * If the target value is an array or a record, the method merges the values into the target value.
+     * If the target value is not an array or a record, it returns the new value.
+     *
+     * @template T - The type of the values in the target object.
+     * @param {object[]|Record<string, T>} targetValue - The target object or array to merge the values into.
+     * @param {Record<string, any>} value - The new values to merge into the target object or array.
+     * @returns {Record<string, any>} - The merged object or array.
+     */
+    mergeObjectValues(targetValue, value) {
+        if (targetValue && typeof targetValue === 'object') {
+            this.innerMerge(targetValue, value);
+            return targetValue;
+        }
+        return value ? { ...value } : value;
+    }
+    /**
+     * Merges the properties of the source object into the target object.
+     *
+     * @param {Record<string, any>} target - The target object to merge the properties into.
+     * @param {Record<string, any>} source - The source object containing the properties to merge.
+     *
+     * @return {void} - This method does not return any value.
+     */
+    innerMerge(target, source) {
+        for (const key of Object.keys(source)) {
+            target[key] = this.mergeValue(target[key], source[key]);
+        }
+    }
+}
+
+/**
+ * Recursively extracts ID values from a nested data structure.
+ * Searches for specified property names and collects their primitive values (strings/numbers).
+ *
+ * @param data - The data structure to search through (can be nested objects/arrays)
+ * @param propertyNames - Array of property names to look for
+ * @returns Array of extracted ID values (strings/numbers only)
+ *
+ * @example
+ * const data = {
+ *   id: [1, 2, 3],
+ *   nested: { id: 'abc' },
+ *   items: [{ id: 456 }]
+ * };
+ * extractDeepIds(data); // Returns [1, 2, 3, 'abc', 456]
+ */
+function extractDeepIds(data, propertyNames) {
+    const ids = [];
+    const defaulPropertyNames = [
+        'id',
+        'upc',
+        'groupingId',
+        'sku',
+        'productId',
+        'item_id',
+        'isbn',
+        'asin',
+        'mpn',
+        'model_number',
+        'article_number',
+        'variant_id',
+        'item_number',
+        'catalog_id',
+        'reference_id',
+    ];
+    // Set for faster property name lookups
+    const propertySet = new Set(defaulPropertyNames);
+    /**
+     * Processes a value and extracts IDs if it matches criteria
+     * @param value - The value to process
+     * @param currentKey - The property name of the current value
+     */
+    const processValue = (value, currentKey) => {
+        // Early exit for null/undefined values
+        if (value == null)
+            return;
+        // If current key matches our target properties
+        if (currentKey && propertySet.has(currentKey)) {
+            if (Array.isArray(value)) {
+                // Filter and push valid array values in one pass
+                ids.push(...value.filter((item) => typeof item === 'string' || typeof item === 'number'));
+            }
+            else if (typeof value === 'string' || typeof value === 'number') {
+                ids.push(value);
+            }
+            return; // Stop processing this branch after handling the ID
+        }
+        // Recursively process nested structures
+        if (Array.isArray(value)) {
+            value.forEach((item) => processValue(item));
+        }
+        else if (typeof value === 'object') {
+            // Process all enumerable properties
+            for (const [key, val] of Object.entries(value)) {
+                processValue(val, key);
+            }
+        }
+    };
+    processValue(data);
+    return ids; // No need to filter nulls as we handle that during collection
+}
+// Fallback method using fetch if sendBeacon isn't available
+async function fallbackEventFire(url) {
+    try {
+        const racePromise = Promise.race([
+            // Promise #1: The fetch request
+            fetch(url, {
+                method: 'POST',
+                keepalive: true,
+            }),
+            // Promise #2: The timeout
+            new Promise((_, reject) => setTimeout(() => reject(new Error('Request timeout')), 2000)),
+        ]);
+        /**
+         * Prevent requests from hanging indefinitely
+         * Improve user experience by failing fast
+         * Handle slow network conditions gracefully
+         * Ensure resources are freed up in a timely manner
+         */
+        const response = await racePromise;
+        return response.ok;
+    }
+    catch (_a) {
+        return false;
+    }
+}
+/**
+ * Extracts and decodes a URL from a base64-encoded query parameter.
+ *
+ * @param {string} url - The URL containing the base64-encoded query parameter.
+ * @returns {string | null} - The decoded URL or null if not found or invalid.
+ */
+function getRedirectUrlFromPayload(url) {
+    try {
+        const base64String = new URL(url).searchParams.get('e');
+        if (!base64String) {
+            return null;
+        }
+        const data = JSON.parse(atob(base64String));
+        return data.ur || null;
+    }
+    catch (_a) {
+        return null;
+    }
+}
+/**
+ * Fires an event using the navigator.sendBeacon method or a fallback method if sendBeacon is not available.
+ * If the event is a click event and a redirect URL is found, it redirects the user to that URL.
+ *
+ * @param {IFireEventParams} params - The parameters for firing the event.
+ * @param {RMN_SPOT_EVENT} params.event - The event type.
+ * @param {string} params.eventUrl - The URL to which the event is sent.
+ * @returns {Promise<void>} - A promise that resolves when the event is fired.
+ */
+async function fireEvent({ event, eventUrl }) {
+    var _a;
+    try {
+        const didFireEvent = ((_a = navigator === null || navigator === void 0 ? void 0 : navigator.sendBeacon) === null || _a === void 0 ? void 0 : _a.call(navigator, eventUrl)) || (await fallbackEventFire(eventUrl));
+        if (!didFireEvent) {
+            return;
+        }
+        if (event === RMN_SPOT_EVENT.CLICK) {
+            const redirectUrl = getRedirectUrlFromPayload(eventUrl);
+            if (redirectUrl) {
+                window.location.href = redirectUrl;
+            }
+        }
+    }
+    catch (_b) {
+        // Handle errors silently
+    }
+}
+function calculateScaleFactor(elementScale) {
+    // Step 1: Apply square root for non-linear scaling
+    // This creates a more gradual scaling effect, especially for larger changes
+    // For example:
+    // - elementScale of 0.25 (1/4 size) becomes 0.5
+    // - elementScale of 1 (unchanged) remains 1
+    // - elementScale of 4 (4x size) becomes 2
+    const baseFactor = Math.sqrt(elementScale);
+    // Step 2: Apply additional dampening to further soften the scaling effect
+    // The dampening factor (0.5) can be adjusted:
+    // - Lower values (closer to 0) make scaling more subtle
+    // - Higher values (closer to 1) make scaling more pronounced
+    const dampening = 0.35;
+    // Calculate the scaleFactor:
+    // 1. (baseFactor - 1) represents the change from the original size
+    // 2. Multiply by dampening to reduce the effect
+    // 3. Add 1 to center the scaling around the original size
+    // For example, if baseFactor is 2:
+    // scaleFactor = 1 + (2 - 1) * 0.5 = 1.5
+    const scaleFactor = 1 + (baseFactor - 1) * dampening;
+    // Step 3: Define the allowed range for the scale factor
+    // This ensures that the font size never changes too drastically
+    const minScale = 0.35; // Font will never be smaller than 50% of original
+    const maxScale = 1.5; // Font will never be larger than 150% of original
+    // Step 4: Clamp the scale factor to the defined range
+    // Math.min ensures the value doesn't exceed maxScale
+    // Math.max ensures the value isn't less than minScale
+    return Math.max(minScale, Math.min(maxScale, scaleFactor));
+}
+
+class UniqueIdGenerator {
+    /**
+     * Initialize the generator with a node ID
+     * @param nodeId Number between 0-1023 to identify this instance
      */
-    includes(source, key) {
-        return key in source;
+    static initialize(nodeId = Math.floor(Math.random() * 1024)) {
+        if (nodeId < 0 || nodeId >= 1 << this.nodeBits) {
+            throw new Error(`Node ID must be between 0 and ${(1 << this.nodeBits) - 1}`);
+        }
+        this.nodeId = nodeId;
     }
     /**
-     * Checks if the given value is included in the values of a source object.
-     *
-     * @param {Record<string, any>} source - The source object to check the values from.
-     * @param {string} value - The value to search for in the source object values.
-     * @returns {boolean} - True if the value is found in the source object values, false otherwise.
+     * Convert a number to base32 string with specified length
      */
-    valuesIncludes(source, value) {
-        const sourceValues = Object.values(source);
-        return sourceValues.includes(value);
+    static toBase32(num, length) {
+        let result = '';
+        while (num > 0) {
+            result = this.base32Chars[Number(num % BigInt(32))] + result;
+            // @ts-expect-error - TS doesn't support bigint division
+            num = num / 32n;
+        }
+        return result.padStart(length, '0');
     }
     /**
-     * Checks if all keys from the given 'keys' array are present in the 'source' object.
-     *
-     * @param {Record<string, any>} source - The object to be checked.
-     * @param {string[]} keys - The array of keys to be checked in the 'source' object.
-     * @return {boolean} - Returns true if all keys are present in the 'source' object,
-     *                    false otherwise.
+     * Generate a cryptographically secure random number
      */
-    hasAllValues(source, keys) {
-        const sourceKeys = Object.keys(source);
-        return keys.every((key) => sourceKeys.includes(key));
+    static getSecureRandom() {
+        if (typeof crypto !== 'undefined') {
+            const buffer = new Uint32Array(1);
+            crypto.getRandomValues(buffer);
+            return buffer[0];
+        }
+        return Math.floor(Math.random() * 0xffffffff);
     }
     /**
-     * Checks if the given object is an array.
-     *
-     * @param {any} obj - The object to check.
-     * @return {boolean} - Returns true if the object is an array, otherwise returns false.
+     * Wait until next millisecond
      */
-    isArray(obj) {
-        return Object.prototype.toString.call(obj) === '[object Array]';
+    static waitNextMillis(lastTimestamp) {
+        let timestamp = Date.now();
+        while (timestamp <= lastTimestamp) {
+            timestamp = Date.now();
+        }
+        return timestamp;
     }
     /**
-     * Merges the value with the target value.
+     * Generates a highly unique ID with the following format:
+     * TTTTTTTTTTCCCCNNNNNRRRR
+     * T: Timestamp (10 chars)
+     * C: Counter (4 chars)
+     * N: Node ID (5 chars)
+     * R: Random (4 chars)
      *
-     * @param {any[] | Record<string, T>} targetValue - The target value to merge with.
-     * @param {Record<string, any>} value - The value to merge.
-     * @returns {Record<string, any>} - The merged value.
+     * Total length: 23 characters, always uppercase alphanumeric
      */
-    mergeValue(targetValue, value) {
-        var _a;
-        if (this.isArray(value)) {
-            return this.mergeArrayValues(targetValue, value);
+    static generate() {
+        if (this.nodeId === undefined) {
+            this.initialize();
         }
-        else if (typeof value === 'object') {
-            return this.mergeObjectValues(targetValue, value);
+        let timestamp = Date.now() - this.epoch;
+        // Handle clock moving backwards or same millisecond
+        if (timestamp < this.lastTimestamp) {
+            throw new Error('Clock moved backwards. Refusing to generate ID.');
         }
-        return (_a = value !== null && value !== void 0 ? value : targetValue) !== null && _a !== void 0 ? _a : undefined;
+        if (timestamp === this.lastTimestamp) {
+            this.sequence = (this.sequence + 1) & ((1 << this.sequenceBits) - 1);
+            if (this.sequence === 0) {
+                timestamp = this.waitNextMillis(this.lastTimestamp);
+            }
+        }
+        else {
+            this.sequence = 0;
+        }
+        this.lastTimestamp = timestamp;
+        // Generate random component
+        const random = this.getSecureRandom() & 0xffff; // 16 bits of randomness
+        // Combine all components into a BigInt
+        // const id =
+        //   (BigInt(timestamp) << BigInt(this.nodeBits + this.sequenceBits + 16)) |
+        //   (BigInt(this.nodeId) << BigInt(this.sequenceBits + 16)) |
+        //   (BigInt(this.sequence) << BigInt(16)) |
+        //   BigInt(random);
+        // Convert to base32 representation
+        const timeComponent = this.toBase32(BigInt(timestamp), 10);
+        const counterComponent = this.toBase32(BigInt(this.sequence), 4);
+        const nodeComponent = this.toBase32(BigInt(this.nodeId), 5);
+        const randomComponent = this.toBase32(BigInt(random), 4);
+        return `${timeComponent}${counterComponent}${nodeComponent}${randomComponent}`;
     }
     /**
-     * Merges the values of an array or object with a given array of objects and returns the merged result as an object.
-     * If the targetValue is not an array, it returns a copy of the value array.
-     *
-     * @param targetValue - The target array or object to merge values into.
-     * @param value - The array of objects containing values to merge into the targetValue.
-     * @returns The merged result as an object.
+     * Validates if a string matches the expected ID format
      */
-    mergeArrayValues(targetValue, value) {
-        if (!this.isArray(targetValue)) {
-            return [...value];
+    static isValid(id) {
+        if (!/^[0-9A-HJ-NP-Z]{23}$/.test(id))
+            return false;
+        try {
+            const timeComponent = id.slice(0, 10);
+            const timestamp = this.decodeBase32(timeComponent);
+            const now = Date.now() - this.epoch;
+            return timestamp >= 0 && timestamp <= now;
         }
-        // make TypeScript understand that targetValue is an array
-        const targetArray = targetValue;
-        for (let i = 0, l = value.length; i < l; i++) {
-            targetArray[i] = this.mergeValue(targetArray[i], value[i]);
+        catch (_a) {
+            return false;
         }
-        return targetArray;
     }
     /**
-     * Merges the values of two objects or arrays into a single object.
-     * If the target value is an array or a record, the method merges the values into the target value.
-     * If the target value is not an array or a record, it returns the new value.
-     *
-     * @template T - The type of the values in the target object.
-     * @param {object[]|Record<string, T>} targetValue - The target object or array to merge the values into.
-     * @param {Record<string, any>} value - The new values to merge into the target object or array.
-     * @returns {Record<string, any>} - The merged object or array.
+     * Decode base32 string to number
      */
-    mergeObjectValues(targetValue, value) {
-        if (targetValue && typeof targetValue === 'object') {
-            this.innerMerge(targetValue, value);
-            return targetValue;
+    static decodeBase32(str) {
+        let result = 0;
+        for (const char of str) {
+            result = result * 32 + this.base32Chars.indexOf(char);
         }
-        return value ? { ...value } : value;
+        return result;
     }
     /**
-     * Merges the properties of the source object into the target object.
-     *
-     * @param {Record<string, any>} target - The target object to merge the properties into.
-     * @param {Record<string, any>} source - The source object containing the properties to merge.
-     *
-     * @return {void} - This method does not return any value.
+     * Extract timestamp from ID
      */
-    innerMerge(target, source) {
-        for (const key of Object.keys(source)) {
-            target[key] = this.mergeValue(target[key], source[key]);
-        }
+    static getTimestamp(id) {
+        if (!this.isValid(id))
+            throw new Error('Invalid ID format');
+        const timeComponent = id.slice(0, 10);
+        const timestamp = this.decodeBase32(timeComponent);
+        return new Date(timestamp + this.epoch);
     }
 }
+// Constants for bit manipulation
+UniqueIdGenerator.epoch = 1577836800000; // 2020-01-01 as epoch
+UniqueIdGenerator.nodeBits = 10;
+UniqueIdGenerator.sequenceBits = 12;
+// Instance variables
+UniqueIdGenerator.lastTimestamp = -1;
+UniqueIdGenerator.sequence = 0;
+// Character set for base32 encoding (excluding similar looking characters)
+UniqueIdGenerator.base32Chars = '0123456789ABCDEFGHJKMNPQRSTVWXYZ';
 
 var commonjsGlobal = typeof globalThis !== 'undefined' ? globalThis : typeof window !== 'undefined' ? window : typeof global !== 'undefined' ? global : typeof self !== 'undefined' ? self : {};
 
@@ -15203,8 +16111,21 @@ class IntersectionObserverService {
     }
 }
 
-class LocalStorage {
+var ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX;
+(function (ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX) {
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["PLACEMENT_ID"] = 0] = "PLACEMENT_ID";
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["SPOT_ID"] = 1] = "SPOT_ID";
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["SPOT_TYPE"] = 2] = "SPOT_TYPE";
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["EVENTS"] = 3] = "EVENTS";
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["PRODUCT_IDS"] = 4] = "PRODUCT_IDS";
+    ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX["CREATED_AT"] = 5] = "CREATED_AT";
+})(ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX || (ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX = {}));
+class LocalStorageService {
     constructor() {
+        if (typeof window.localStorage === 'undefined') {
+            console.warn('Local storage is not supported in this environment');
+            return;
+        }
         this.spots = new Map();
         // Sync local storage with the current state
         this.syncLocalStorage();
@@ -15212,19 +16133,23 @@ class LocalStorage {
         this.removeExpiredSpots();
     }
     static getInstance() {
-        if (!LocalStorage.instance) {
-            LocalStorage.instance = new LocalStorage();
+        if (!LocalStorageService.instance) {
+            LocalStorageService.instance = new LocalStorageService();
         }
-        return LocalStorage.instance;
+        return LocalStorageService.instance;
     }
     syncLocalStorage() {
-        const localStorageData = localStorage.getItem(LocalStorage.localStorageKey);
-        // TODO: Encrypt the data before storing it in the local storage
+        const localStorageData = window.localStorage.getItem(LocalStorageService.localStorageKey);
         if (localStorageData) {
             try {
-                const parsedData = JSON.parse(localStorageData);
+                const decryptedData = this.decryptData(localStorageData);
+                const parsedData = JSON.parse(decryptedData);
                 if (parsedData && typeof parsedData === 'object') {
-                    this.spots = this.objToMap(parsedData);
+                    const data = {};
+                    for (const [key, value] of Object.entries(parsedData)) {
+                        data[key] = this.arrayToObject(value);
+                    }
+                    this.spots = this.objectToMap(data);
                 }
                 else {
                     this.clearLocalStorage();
@@ -15237,43 +16162,176 @@ class LocalStorage {
         }
     }
     setSpot(spotId, data) {
+        var _a;
         data.createdAt = Date.now();
-        this.spots.set(spotId, data);
+        (_a = this.spots) === null || _a === void 0 ? void 0 : _a.set(spotId, data);
         this.updateLocalStorage();
     }
-    getSpot(spotId) {
-        return this.spots.get(spotId);
-    }
     removeSpot(spotId) {
-        this.spots.delete(spotId);
+        var _a;
+        (_a = this.spots) === null || _a === void 0 ? void 0 : _a.delete(spotId);
         this.updateLocalStorage();
     }
+    getSpot(spotId) {
+        var _a;
+        return (_a = this.spots) === null || _a === void 0 ? void 0 : _a.get(spotId);
+    }
+    getSpots() {
+        if (!this.spots)
+            return undefined;
+        return this.mapToObject(this.spots);
+    }
     updateLocalStorage() {
-        const data = this.mapToObj(this.spots);
-        localStorage.setItem(LocalStorage.localStorageKey, JSON.stringify(data));
+        if (!this.spots)
+            return undefined;
+        const data = this.mapToObject(this.spots);
+        const dataArray = {};
+        for (const [key, value] of Object.entries(data)) {
+            dataArray[key] = this.objectToArray(value);
+        }
+        try {
+            const encryptedData = this.encryptData(JSON.stringify(dataArray));
+            window.localStorage.setItem(LocalStorageService.localStorageKey, encryptedData);
+        }
+        catch (_a) {
+            // If there is an error parsing the data, clear the local storage to prevent any issues
+            this.clearLocalStorage();
+        }
     }
     clearLocalStorage() {
-        localStorage.removeItem(LocalStorage.localStorageKey);
+        window.localStorage.removeItem(LocalStorageService.localStorageKey);
     }
     removeExpiredSpots() {
+        var _a;
         const currentTime = Date.now();
-        this.spots.forEach((spot, spotId) => {
-            var _a;
-            if (currentTime - ((_a = spot.createdAt) !== null && _a !== void 0 ? _a : 0) > LocalStorage.spotExpirationTime) {
-                this.spots.delete(spotId);
+        (_a = this.spots) === null || _a === void 0 ? void 0 : _a.forEach((spot, spotId) => {
+            var _a, _b;
+            if (currentTime - ((_a = spot.createdAt) !== null && _a !== void 0 ? _a : 0) > LocalStorageService.spotExpirationTime) {
+                (_b = this.spots) === null || _b === void 0 ? void 0 : _b.delete(spotId);
             }
         });
         this.updateLocalStorage();
     }
-    mapToObj(map) {
+    mapToObject(map) {
         return Object.fromEntries(map);
     }
-    objToMap(obj) {
-        return new Map(Object.entries(obj));
+    objectToMap(obj) {
+        return new Map(Object.entries(obj));
+    }
+    objectToArray(obj) {
+        return [obj.placementId, obj.spotId, obj.spotType, obj.events, obj.productIds, obj.createdAt];
+    }
+    arrayToObject(arr) {
+        return {
+            placementId: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.PLACEMENT_ID],
+            spotId: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.SPOT_ID],
+            spotType: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.SPOT_TYPE],
+            events: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.EVENTS],
+            productIds: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.PRODUCT_IDS],
+            createdAt: arr[ENUM_LOCAL_STORAGE_SPOT_ARRAY_INDEX.CREATED_AT],
+        };
+    }
+    encryptData(data) {
+        if (!LocalStorageService.encryptData)
+            return data;
+        // For now, we are using base64 encoding to encrypt the data
+        // Later we will use Jose encryption
+        const encryptedData = btoa(data);
+        return encryptedData;
+    }
+    decryptData(data) {
+        if (!LocalStorageService.encryptData)
+            return data;
+        // For now, we are using base64 encoding to encrypt
+        // Later we will use Jose encryption
+        const decryptedData = atob(data);
+        return decryptedData;
+    }
+}
+LocalStorageService.localStorageKey = 'lc_rmn';
+LocalStorageService.spotExpirationTime = 1000 * 60 * 60 * 24 * 7; // 7 days
+LocalStorageService.encryptData = true;
+
+/**
+ * PubsubService class
+ * Manages event subscriptions and publications
+ * @template IRmnEventMap A record type defining the structure of events and their data
+ */
+class PubsubService {
+    constructor() {
+        /**
+         * Object to store subscribers for each event type
+         */
+        this.subscribers = {};
+    }
+    static getInstance() {
+        if (!PubsubService.instance) {
+            PubsubService.instance = new PubsubService();
+        }
+        return PubsubService.instance;
+    }
+    /**
+     * Subscribe to an event
+     * @param eventType - The type of event to subscribe to
+     * @param callback - The function to be called when the event is published
+     * @returns A function to unsubscribe from the event
+     *
+     * @Example:
+     * const unsubscribe = pubSub.subscribe('userLogin', (data) => {
+     *   console.log(`User ${data.username} logged in`);
+     * });
+     */
+    subscribe(eventType, callback) {
+        if (!this.subscribers[eventType]) {
+            this.subscribers[eventType] = [];
+        }
+        this.subscribers[eventType].push(callback);
+        // Return an unsubscribe function
+        return () => {
+            this.subscribers[eventType] = this.subscribers[eventType].filter((cb) => cb !== callback);
+        };
+    }
+    /**
+     * Publish an event
+     * @param eventType - The type of event to publish
+     * @param data - The data to be passed to the event subscribers
+     *
+     * @Example:
+     * pubSub.publish('userLogin', { username: 'john_doe', timestamp: Date.now() });
+     */
+    publish(eventType, data) {
+        if (!this.subscribers[eventType]) {
+            return;
+        }
+        this.subscribers[eventType].forEach((callback) => callback(data));
     }
 }
-LocalStorage.localStorageKey = 'lc_rmn';
-LocalStorage.spotExpirationTime = 1000 * 60 * 60 * 24 * 7; // 7 days
+/**
+ * Usage Example:
+ *
+ * interface IRmnEventMap {
+ *   userLogin: { username: string; timestamp: number };
+ *   pageView: { url: string; timestamp: number };
+ * }
+ *
+ * const pubSub = new PubsubService<IRmnEventMap>();
+ *
+ * // Subscribe to events
+ * const unsubscribeLogin = pubSub.subscribe('userLogin', (data) => {
+ *   console.log(`User ${data.username} logged in at ${new Date(data.timestamp)}`);
+ * });
+ *
+ * pubSub.subscribe('pageView', (data) => {
+ *   console.log(`Page ${data.url} viewed at ${new Date(data.timestamp)}`);
+ * });
+ *
+ * // Publish events
+ * pubSub.publish('userLogin', { username: 'john_doe', timestamp: Date.now() });
+ * pubSub.publish('pageView', { url: '/home', timestamp: Date.now() });
+ *
+ * // Unsubscribe from an event
+ * unsubscribeLogin();
+ */
 
 class ResizeObserverService {
     constructor({ element, maxSize, minScale }) {
@@ -15343,36 +16401,6 @@ class ResizeObserverService {
     }
 }
 
-function calculateScaleFactor(elementScale) {
-    // Step 1: Apply square root for non-linear scaling
-    // This creates a more gradual scaling effect, especially for larger changes
-    // For example:
-    // - elementScale of 0.25 (1/4 size) becomes 0.5
-    // - elementScale of 1 (unchanged) remains 1
-    // - elementScale of 4 (4x size) becomes 2
-    const baseFactor = Math.sqrt(elementScale);
-    // Step 2: Apply additional dampening to further soften the scaling effect
-    // The dampening factor (0.5) can be adjusted:
-    // - Lower values (closer to 0) make scaling more subtle
-    // - Higher values (closer to 1) make scaling more pronounced
-    const dampening = 0.35;
-    // Calculate the scaleFactor:
-    // 1. (baseFactor - 1) represents the change from the original size
-    // 2. Multiply by dampening to reduce the effect
-    // 3. Add 1 to center the scaling around the original size
-    // For example, if baseFactor is 2:
-    // scaleFactor = 1 + (2 - 1) * 0.5 = 1.5
-    const scaleFactor = 1 + (baseFactor - 1) * dampening;
-    // Step 3: Define the allowed range for the scale factor
-    // This ensures that the font size never changes too drastically
-    const minScale = 0.35; // Font will never be smaller than 50% of original
-    const maxScale = 1.5; // Font will never be larger than 150% of original
-    // Step 4: Clamp the scale factor to the defined range
-    // Math.min ensures the value doesn't exceed maxScale
-    // Math.max ensures the value isn't less than minScale
-    return Math.max(minScale, Math.min(maxScale, scaleFactor));
-}
-
 const CAROUSEL_COMPONENT_STYLE = ({ width, height, fluid }) => `
     :host {
         position: relative;
@@ -15387,11 +16415,13 @@ const CAROUSEL_COMPONENT_STYLE = ({ width, height, fluid }) => `
         position: relative;
         height: 100%;
         width: 100%;
+        display: flex;
+        transition: transform 0.5s ease-in-out;
     }
 
     .slide {
-        display: none;
-
+        flex: 0 0 100%;
+        display: flex;
         justify-content: center;
         align-items: center;
         height: 100%;
@@ -15696,9 +16726,9 @@ if (typeof window !== 'undefined' && typeof window.customElements !== 'undefined
         renderSlides() {
             const slidesContainer = document.createElement('div');
             slidesContainer.className = 'slides';
-            this.slides.forEach((slide, index) => {
+            this.slides.forEach((slide) => {
                 const slideElement = document.createElement('div');
-                slideElement.className = `slide ${index === this.currentSlide ? 'active' : ''}`;
+                slideElement.className = 'slide';
                 if (slide instanceof HTMLElement) {
                     slideElement.appendChild(slide);
                 }
@@ -15777,10 +16807,9 @@ if (typeof window !== 'undefined' && typeof window.customElements !== 'undefined
         updateCarousel() {
             if (!this.slidesContainer)
                 return;
-            const slides = Array.from(this.slidesContainer.children);
-            slides.forEach((slide, index) => {
-                slide.classList.toggle('active', index === this.currentSlide);
-            });
+            // Calculate the translation distance based on current slide
+            const translateX = -this.currentSlide * 100;
+            this.slidesContainer.style.transform = `translateX(${translateX}%)`;
             this.updateDots();
         }
         updateDots() {
@@ -16032,141 +17061,6 @@ class ElementService {
     }
 }
 
-class UniqueIdGenerator {
-    /**
-     * Initialize the generator with a node ID
-     * @param nodeId Number between 0-1023 to identify this instance
-     */
-    static initialize(nodeId = Math.floor(Math.random() * 1024)) {
-        if (nodeId < 0 || nodeId >= 1 << this.nodeBits) {
-            throw new Error(`Node ID must be between 0 and ${(1 << this.nodeBits) - 1}`);
-        }
-        this.nodeId = nodeId;
-    }
-    /**
-     * Convert a number to base32 string with specified length
-     */
-    static toBase32(num, length) {
-        let result = '';
-        while (num > 0) {
-            result = this.base32Chars[Number(num % BigInt(32))] + result;
-            // @ts-expect-error - TS doesn't support bigint division
-            num = num / 32n;
-        }
-        return result.padStart(length, '0');
-    }
-    /**
-     * Generate a cryptographically secure random number
-     */
-    static getSecureRandom() {
-        if (typeof crypto !== 'undefined') {
-            const buffer = new Uint32Array(1);
-            crypto.getRandomValues(buffer);
-            return buffer[0];
-        }
-        return Math.floor(Math.random() * 0xffffffff);
-    }
-    /**
-     * Wait until next millisecond
-     */
-    static waitNextMillis(lastTimestamp) {
-        let timestamp = Date.now();
-        while (timestamp <= lastTimestamp) {
-            timestamp = Date.now();
-        }
-        return timestamp;
-    }
-    /**
-     * Generates a highly unique ID with the following format:
-     * TTTTTTTTTTCCCCNNNNNRRRR
-     * T: Timestamp (10 chars)
-     * C: Counter (4 chars)
-     * N: Node ID (5 chars)
-     * R: Random (4 chars)
-     *
-     * Total length: 23 characters, always uppercase alphanumeric
-     */
-    static generate() {
-        if (this.nodeId === undefined) {
-            this.initialize();
-        }
-        let timestamp = Date.now() - this.epoch;
-        // Handle clock moving backwards or same millisecond
-        if (timestamp < this.lastTimestamp) {
-            throw new Error('Clock moved backwards. Refusing to generate ID.');
-        }
-        if (timestamp === this.lastTimestamp) {
-            this.sequence = (this.sequence + 1) & ((1 << this.sequenceBits) - 1);
-            if (this.sequence === 0) {
-                timestamp = this.waitNextMillis(this.lastTimestamp);
-            }
-        }
-        else {
-            this.sequence = 0;
-        }
-        this.lastTimestamp = timestamp;
-        // Generate random component
-        const random = this.getSecureRandom() & 0xffff; // 16 bits of randomness
-        // Combine all components into a BigInt
-        // const id =
-        //   (BigInt(timestamp) << BigInt(this.nodeBits + this.sequenceBits + 16)) |
-        //   (BigInt(this.nodeId) << BigInt(this.sequenceBits + 16)) |
-        //   (BigInt(this.sequence) << BigInt(16)) |
-        //   BigInt(random);
-        // Convert to base32 representation
-        const timeComponent = this.toBase32(BigInt(timestamp), 10);
-        const counterComponent = this.toBase32(BigInt(this.sequence), 4);
-        const nodeComponent = this.toBase32(BigInt(this.nodeId), 5);
-        const randomComponent = this.toBase32(BigInt(random), 4);
-        return `${timeComponent}${counterComponent}${nodeComponent}${randomComponent}`;
-    }
-    /**
-     * Validates if a string matches the expected ID format
-     */
-    static isValid(id) {
-        if (!/^[0-9A-HJ-NP-Z]{23}$/.test(id))
-            return false;
-        try {
-            const timeComponent = id.slice(0, 10);
-            const timestamp = this.decodeBase32(timeComponent);
-            const now = Date.now() - this.epoch;
-            return timestamp >= 0 && timestamp <= now;
-        }
-        catch (_a) {
-            return false;
-        }
-    }
-    /**
-     * Decode base32 string to number
-     */
-    static decodeBase32(str) {
-        let result = 0;
-        for (const char of str) {
-            result = result * 32 + this.base32Chars.indexOf(char);
-        }
-        return result;
-    }
-    /**
-     * Extract timestamp from ID
-     */
-    static getTimestamp(id) {
-        if (!this.isValid(id))
-            throw new Error('Invalid ID format');
-        const timeComponent = id.slice(0, 10);
-        const timestamp = this.decodeBase32(timeComponent);
-        return new Date(timestamp + this.epoch);
-    }
-}
-// Constants for bit manipulation
-UniqueIdGenerator.epoch = 1577836800000; // 2020-01-01 as epoch
-UniqueIdGenerator.nodeBits = 10;
-UniqueIdGenerator.sequenceBits = 12;
-// Instance variables
-UniqueIdGenerator.lastTimestamp = -1;
-UniqueIdGenerator.sequence = 0;
-// Character set for base32 encoding (excluding similar looking characters)
-UniqueIdGenerator.base32Chars = '0123456789ABCDEFGHJKMNPQRSTVWXYZ';
-
 function convertHexToRgba(hex, opacity = 1) {
     // Remove # if present
     const cleanHex = hex.replace('#', '');
@@ -16204,12 +17098,13 @@ function spotHtmlStringToElement(htmlString) {
     spot.className = 'spot';
     spot.innerHTML = htmlString;
     Object.assign(spot.style, {
-        position: 'relative',
         display: 'block',
         width: '100%',
         height: '100%',
         margin: '0',
         padding: '0',
+        containerType: 'inline-size',
+        position: 'relative',
     });
     return spot;
 }
@@ -17079,7 +17974,6 @@ const STYLES$6 = ({ textColor = '#ffffff', ctaTextColor = textColor, ctaBorderCo
                 box-sizing: border-box;
                 color: ${textColor};
                 cursor: pointer;
-                container-type: inline-size;
             }
 
             .${prefix}__text {
@@ -17095,7 +17989,7 @@ const STYLES$6 = ({ textColor = '#ffffff', ctaTextColor = textColor, ctaBorderCo
             .${prefix}__header {
                 font-size: 24px;
                 margin: 0;
-                font-family: "Cormorant";
+                font-family: "Cormorant", system-ui;
                 font-style: normal;
                 font-weight: 300;
                 line-height: normal;
@@ -17214,7 +18108,6 @@ const STYLES$5 = ({ textColor = '#212121', backgroundColor = '#e8e6de', ctaTextC
         height: 100%;
         display: block;
         position: relative;
-        container-type: inline-size;
     }
 
     .${prefix}__content {
@@ -17405,15 +18298,20 @@ function rbHomepageHeroThreeTileTemplate(spot, config) {
 const STYLES$4 = ({ textColor = '#212121', backgroundColor = '#e8e6de', ctaTextColor = textColor, primaryImage, mobilePrimaryImage = primaryImage, }, { prefix }) => `
   <style>
     .${prefix} {
+        width: 100%;
+        height: 100%;
+        background-color: transparent;
+        cursor: pointer;
+        position: relative;
+    }
+
+    .${prefix}__content {
         width: 100%;
         height: 100%;
         display: flex;
         flex-direction: column-reverse;
         background-color: transparent;
         gap: 6px;
-        cursor: pointer;
-        container-type: inline-size;
-        position: relative;
     }
 
     .${prefix}__image {
@@ -17444,7 +18342,7 @@ const STYLES$4 = ({ textColor = '#212121', backgroundColor = '#e8e6de', ctaTextC
         font-size: 18px;
         margin: 0;
         color: inherit;
-        font-family: "Cormorant";
+        font-family: "Cormorant", system-ui;
         font-style: normal;
         font-weight: 700;
         line-height: normal;
@@ -17486,7 +18384,7 @@ const STYLES$4 = ({ textColor = '#212121', backgroundColor = '#e8e6de', ctaTextC
     }
 
     @container (min-width: 768px) {
-        .${prefix} {
+        .${prefix}__content {
             flex-direction: row;
         }
         .${prefix}__image {
@@ -17541,12 +18439,14 @@ function rbHomepageHeroTwoTileTemplate(spot, config) {
     ${GFONT_CORMORANT}
     ${STYLES$4(spot, config)}
     <div class="${prefix}">
-        <div class="${prefix}__text">
-            ${spot.header ? `<h2 class="${prefix}__header">${spot.header}</h2>` : ''}
-            ${spot.description ? `<p class="${prefix}__description">${spot.description}</p>` : ''}
-            ${spot.ctaText ? `<span class="${prefix}__cta-button">${spot.ctaText}</span>` : ''}
-        </div>
-        <div class="${prefix}__image"></div>
+      <div class="${prefix}__content">
+          <div class="${prefix}__text">
+              ${spot.header ? `<h2 class="${prefix}__header">${spot.header}</h2>` : ''}
+              ${spot.description ? `<p class="${prefix}__description">${spot.description}</p>` : ''}
+              ${spot.ctaText ? `<span class="${prefix}__cta-button">${spot.ctaText}</span>` : ''}
+          </div>
+          <div class="${prefix}__image"></div>
+      </div>
     </div>
   `;
 }
@@ -17569,12 +18469,10 @@ const STYLES$3 = ({ textColor = '#ffffff', ctaTextColor = textColor, ctaBorderCo
         overflow: hidden;
         cursor: pointer;
         color: ${textColor};
-        container-type: inline-size;
       }
 
       .${prefix}__text {
         padding: 20px;
-        width: 70%;
         display: flex;
         flex-direction: column;
         justify-content: center;
@@ -17586,7 +18484,7 @@ const STYLES$3 = ({ textColor = '#ffffff', ctaTextColor = textColor, ctaBorderCo
         color: inherit;
         margin: 0;
         font-size: 20px;
-        font-family: "Cormorant";
+        font-family: "Cormorant", system-ui;
         font-style: normal;
         font-weight: 300;
         line-height: normal;
@@ -17705,7 +18603,6 @@ const STYLES$2 = ({ textColor = '#ffffff', primaryImage, mobilePrimaryImage = pr
       background-size: cover;
       background-position: center;
       background-repeat: no-repeat;
-      container-type: inline-size;
       position: relative;
     }
 
@@ -17775,12 +18672,7 @@ const STYLES$1 = ({ textColor = '#ffffff', primaryImage, mobilePrimaryImage = pr
         border-radius: 5px;
         overflow: hidden;
         cursor: pointer;
-        container-type: inline-size;
-      }
-
-      .${prefix}__text {
-        padding: 10px;
-        width: 70%;
+        position: relative;
       }
 
       .${prefix}__header {
@@ -17791,6 +18683,7 @@ const STYLES$1 = ({ textColor = '#ffffff', primaryImage, mobilePrimaryImage = pr
         font-style: normal;
         font-weight: 400;
         margin: 0;
+        padding: 10px;
       }
 
       @container (min-width: 640px) {
@@ -17808,9 +18701,7 @@ function rbSmallCategoryImageToutTemplate(spot, config) {
     ${GFONT_CORMORANT}
     ${STYLES$1(spot, config)}
     <div class="${prefix}">
-      <div class="${prefix}__text">
-        ${spot.header ? `<h2 class="${prefix}__header">${spot.header}</h2>` : ''}
-      </div>
+      ${spot.header ? `<h2 class="${prefix}__header">${spot.header}</h2>` : ''}
     </div>
   `;
 }
@@ -17825,7 +18716,6 @@ const STYLES = ({ textColor = '#000000', backgroundColor = 'transparent', primar
       display: flex;
       flex-direction: column;
       border-radius: 5px;
-      container-type: inline-size;
     }
 
     .${prefix}__image {
@@ -17961,94 +18851,164 @@ const SPOT_TEMPLATE_HTML_ELEMENT = (spot, config) => {
     return spotHtmlStringToElement(spotHtmlString);
 };
 
-/**
- * PubSub class
- * Manages event subscriptions and publications
- * @template IEventMap A record type defining the structure of events and their data
- */
-class PubSub {
+// For the moment, we will only focus on sites that use Google Analytics,
+// but we will add support for other analytics tools in the future.
+var AnalyticsTool;
+(function (AnalyticsTool) {
+    AnalyticsTool["GoogleAnalytics"] = "google-analytics";
+    AnalyticsTool["Other"] = "Other";
+})(AnalyticsTool || (AnalyticsTool = {}));
+
+class DataLayerMonitor {
+    constructor() {
+        if (!window.dataLayer) {
+            return;
+        }
+        this.originalPush = window.dataLayer.push;
+    }
+    static getInstance() {
+        if (!DataLayerMonitor.instance) {
+            DataLayerMonitor.instance = new DataLayerMonitor();
+        }
+        return DataLayerMonitor.instance;
+    }
+    setListener(listener) {
+        this.listener = listener;
+    }
+    start() {
+        window.dataLayer.push = (...args) => {
+            const result = this.originalPush.apply(window.dataLayer, args);
+            const pushedEvent = args[0];
+            if (this.listener) {
+                const normalizedData = this.cleanEventData(pushedEvent);
+                if (normalizedData) {
+                    this.listener(normalizedData);
+                }
+            }
+            return result;
+        };
+    }
+    cleanEventData(data) {
+        const eventName = getEventTypeFromRawEvent(data.event);
+        if (!eventName) {
+            return null;
+        }
+        const productIds = extractDeepIds(data.value);
+        return {
+            event: eventName,
+            productIds,
+        };
+    }
+    stop() {
+        if (this.originalPush) {
+            window.dataLayer.push = this.originalPush;
+        }
+        this.listener = undefined;
+    }
+}
+
+// @TODO: Add support for user to push events to our own data layer, if they don't use any analytics tool.
+// window.rmnDataLayer = window.rmnDataLayer || [];
+class MonitorService {
     constructor() {
-        /**
-         * Object to store subscribers for each event type
-         */
-        this.subscribers = {};
+        const analyticsTool = this.detectAnalyticsTool();
+        switch (analyticsTool) {
+            case AnalyticsTool.GoogleAnalytics:
+                this.implementedMonitor = DataLayerMonitor.getInstance();
+                break;
+            case AnalyticsTool.Other:
+            default:
+                console.warn('This site uses an unsupported analytics tool.');
+                break;
+        }
+        if (analyticsTool === AnalyticsTool.Other) {
+            return;
+        }
+        this.pubSubService = PubsubService.getInstance();
+        this.localStorageService = LocalStorageService.getInstance();
     }
     static getInstance() {
-        if (!PubSub.instance) {
-            PubSub.instance = new PubSub();
+        if (!MonitorService.instance) {
+            MonitorService.instance = new MonitorService();
         }
-        return PubSub.instance;
+        return MonitorService.instance;
     }
-    /**
-     * Subscribe to an event
-     * @param eventType - The type of event to subscribe to
-     * @param callback - The function to be called when the event is published
-     * @returns A function to unsubscribe from the event
-     *
-     * @Example:
-     * const unsubscribe = pubSub.subscribe('userLogin', (data) => {
-     *   console.log(`User ${data.username} logged in`);
-     * });
-     */
-    subscribe(eventType, callback) {
-        if (!this.subscribers[eventType]) {
-            this.subscribers[eventType] = [];
+    start() {
+        if (!this.implementedMonitor)
+            return;
+        this.implementedMonitor.setListener(async (eventData) => {
+            var _a;
+            await this.matchAndFireEvent(eventData, (_a = this.localStorageService) === null || _a === void 0 ? void 0 : _a.getSpots());
+        });
+        this.implementedMonitor.start();
+    }
+    async matchAndFireEvent(eventData, spots) {
+        var _a, _b;
+        if (!spots)
+            return;
+        const eventProductIds = new Set(eventData.productIds);
+        for (const spot of Object.values(spots)) {
+            if (!spot.productIds.length)
+                continue;
+            const hasCommonProductIds = spot.productIds.find((productId) => eventProductIds.has(productId));
+            if (hasCommonProductIds) {
+                if (Object.values(RMN_SPOT_EVENT).includes(eventData.event)) {
+                    await this.fireAndPublishSpotEvent({
+                        spotEvent: eventData.event,
+                        eventUrl: (_b = (_a = spot.events.find((event) => event.event === eventData.event)) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '',
+                        placementId: spot.placementId,
+                        spotId: spot.spotId,
+                    });
+                }
+            }
         }
-        this.subscribers[eventType].push(callback);
-        // Return an unsubscribe function
-        return () => {
-            this.subscribers[eventType] = this.subscribers[eventType].filter((cb) => cb !== callback);
-        };
     }
-    /**
-     * Publish an event
-     * @param eventType - The type of event to publish
-     * @param data - The data to be passed to the event subscribers
-     *
-     * @Example:
-     * pubSub.publish('userLogin', { username: 'john_doe', timestamp: Date.now() });
-     */
-    publish(eventType, data) {
-        if (!this.subscribers[eventType]) {
+    async fireAndPublishSpotEvent({ spotEvent, eventUrl, placementId, spotId, }) {
+        await fireEvent({
+            event: spotEvent,
+            eventUrl,
+        });
+        if (!this.pubSubService)
             return;
+        this.pubSubService.publish(RMN_EVENT.SPOT_EVENT, {
+            eventType: spotEvent,
+            placementId,
+            spotId,
+        });
+    }
+    detectAnalyticsTool() {
+        let analyticsTool = AnalyticsTool.Other;
+        // Check for Google Analytics
+        if (typeof window.ga !== 'undefined') {
+            analyticsTool = AnalyticsTool.GoogleAnalytics;
         }
-        this.subscribers[eventType].forEach((callback) => callback(data));
+        // Check for Google Analytics 4
+        if (typeof window.gtag !== 'undefined') {
+            analyticsTool = AnalyticsTool.GoogleAnalytics;
+        }
+        // Check for Google Tag Manager
+        if (typeof window.google_tag_manager !== 'undefined') {
+            analyticsTool = AnalyticsTool.GoogleAnalytics;
+        }
+        // @TODO: Add support for other analytics tools
+        // Check for Heap Analytics
+        // Check for Mixpanel
+        // Check for Woopra
+        // Check for Segment
+        // Check for Amplitude
+        return analyticsTool;
     }
 }
-/**
- * Usage Example:
- *
- * interface IEventMap {
- *   userLogin: { username: string; timestamp: number };
- *   pageView: { url: string; timestamp: number };
- * }
- *
- * const pubSub = new PubSub<IEventMap>();
- *
- * // Subscribe to events
- * const unsubscribeLogin = pubSub.subscribe('userLogin', (data) => {
- *   console.log(`User ${data.username} logged in at ${new Date(data.timestamp)}`);
- * });
- *
- * pubSub.subscribe('pageView', (data) => {
- *   console.log(`Page ${data.url} viewed at ${new Date(data.timestamp)}`);
- * });
- *
- * // Publish events
- * pubSub.publish('userLogin', { username: 'john_doe', timestamp: Date.now() });
- * pubSub.publish('pageView', { url: '/home', timestamp: Date.now() });
- *
- * // Unsubscribe from an event
- * unsubscribeLogin();
- */
 
 class EventService {
     constructor() {
-        this.pubSub = PubSub.getInstance();
-        this.localStorage = LocalStorage.getInstance();
+        this.pubSubService = PubsubService.getInstance();
+        this.localStorageService = LocalStorageService.getInstance();
         this.activeSpots = new Map();
         this.spotStates = new Map();
         this.intersectionObserver = new IntersectionObserverService();
+        // Start the user monitor, which will track and check user interactions
+        MonitorService.getInstance().start();
     }
     static getInstance() {
         if (!EventService.instance) {
@@ -18057,16 +19017,16 @@ class EventService {
         return EventService.instance;
     }
     subscribe(eventType, callback) {
-        return this.pubSub.subscribe(eventType, callback);
+        return this.pubSubService.subscribe(eventType, callback);
     }
     publish(eventType, data) {
-        this.pubSub.publish(eventType, data);
+        this.pubSubService.publish(eventType, data);
     }
     registerSpot(params) {
         const { placementId, spot, spotElement } = params;
         this.activeSpots.set(placementId, { spotElement });
         // Fire impression event
-        this.fireImpressionEvent(placementId, spot, spotElement);
+        this.fireImpressionEvent(placementId, spot);
         // Handle intersection observer
         this.handleIntersectionObserver(placementId, spot, spotElement);
         // Attach click event listener
@@ -18141,30 +19101,42 @@ class EventService {
                 },
             };
         }
-        this.spotStates.set(placementId, { ...currentState, ...updates });
+        const merged = this.deepMerge(currentState, updates);
+        this.spotStates.set(placementId, merged);
         if (publish) {
-            this.pubSub.publish(RMN_SPOT_EVENT.LIFECYCLE_STATE, this.spotStates.get(placementId));
+            this.pubSubService.publish(RMN_EVENT.LIFECYCLE_STATE, this.spotStates.get(placementId));
         }
     }
-    async handleClick({ placementId, spot, spotElement, }) {
+    deepMerge(current, updates) {
+        return {
+            identifier: updates.identifier
+                ? { ...current.identifier, ...updates.identifier }
+                : current.identifier,
+            dom: updates.dom ? { ...current.dom, ...updates.dom } : current.dom,
+            state: updates.state ? { ...current.state, ...updates.state } : current.state,
+            displayConfig: updates.displayConfig
+                ? { ...current.displayConfig, ...updates.displayConfig }
+                : current.displayConfig,
+        };
+    }
+    async handleClick({ placementId, spot }) {
         var _a, _b, _c;
-        // Publish click event
-        this.pubSub.publish(RMN_SPOT_EVENT.CLICK, {
+        this.pubSubService.publish(RMN_EVENT.SPOT_EVENT, {
+            eventType: RMN_SPOT_EVENT.CLICK,
             placementId,
             spotId: spot.id,
-            spotElement,
         });
-        // Fire click event
-        await this.fireEvent({
+        await fireEvent({
             event: RMN_SPOT_EVENT.CLICK,
             eventUrl: (_b = (_a = spot.events.find((event) => event.event === RMN_SPOT_EVENT.CLICK)) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '',
         });
         // Save spot to local storage for event tracking
-        this.localStorage.setSpot(spot.id, {
+        this.localStorageService.setSpot(spot.id, {
+            placementId,
             spotId: spot.id,
             spotType: spot.spot,
             events: spot.events,
-            productIds: (_c = spot.productIds) !== null && _c !== void 0 ? _c : [1, 'GROUPING-12345', 'DAN-12345', 131398103],
+            productIds: (_c = spot.productIds) !== null && _c !== void 0 ? _c : [1, 2, 3],
         });
     }
     handleIntersectionObserver(placementId, _spot, spotElement) {
@@ -18179,51 +19151,20 @@ class EventService {
         };
         this.intersectionObserver.observe(spotElement, spotIsVisibleCallback);
     }
-    fireImpressionEvent(placementId, spot, spotElement) {
-        this.pubSub.publish(RMN_SPOT_EVENT.IMPRESSION, {
+    fireImpressionEvent(placementId, spot) {
+        this.pubSubService.publish(RMN_EVENT.SPOT_EVENT, {
+            eventType: RMN_SPOT_EVENT.IMPRESSION,
             placementId,
             spotId: spot.id,
-            spotElement,
         });
         (async () => {
             var _a, _b;
-            await this.fireEvent({
+            await fireEvent({
                 event: RMN_SPOT_EVENT.IMPRESSION,
                 eventUrl: (_b = (_a = spot.events.find((event) => event.event === RMN_SPOT_EVENT.IMPRESSION)) === null || _a === void 0 ? void 0 : _a.url) !== null && _b !== void 0 ? _b : '',
             });
         })();
     }
-    /**
-     * Fires an event using the navigator.sendBeacon method and redirects the user if the event is a click event.
-     *
-     * @param {IFireEventParams} params - The parameters for firing the event.
-     * @param {RMN_SPOT_EVENT} params.event - The event type.
-     * @param {string} params.eventUrl - The URL to which the event is sent.
-     * @returns {Promise<void>} - A promise that resolves when the event is fired.
-     */
-    async fireEvent({ event, eventUrl }) {
-        const didFireEvent = navigator.sendBeacon(eventUrl);
-        if (didFireEvent && event === RMN_SPOT_EVENT.CLICK) {
-            window.location.href = this.getRedirectUrlFromPayload(eventUrl);
-        }
-    }
-    /**
-     * Extracts and decodes a URL from a base64-encoded query parameter.
-     *
-     * @param {string} url - The URL containing the base64-encoded query parameter.
-     * @returns {string} - The decoded URL or an empty string if decoding fails.
-     */
-    getRedirectUrlFromPayload(url) {
-        var _a, _b;
-        const base64String = (_a = new URL(url).searchParams.get('e')) !== null && _a !== void 0 ? _a : '';
-        try {
-            const data = JSON.parse(atob(base64String));
-            return (_b = data.ur) !== null && _b !== void 0 ? _b : '';
-        }
-        catch (_c) {
-            return '';
-        }
-    }
 }
 
 const SELECTION_API_PATH = '/spots/selection';
@@ -18256,176 +19197,6 @@ class SelectionService extends BaseApi {
     }
 }
 
-const SPOT_EVENTS_EXAMPLE = [
-    {
-        event: RMN_SPOT_EVENT.CLICK,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwidXIiOm51bGx9&s=hWz37kbxi_u95EVNn2aoQhc5Aas',
-    },
-    {
-        event: RMN_SPOT_EVENT.IMPRESSION,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiYmEiOjEsImZxIjowfQ&s=djoysjCimurf-5T11AlNAwwLSS8',
-    },
-    {
-        event: RMN_SPOT_EVENT.PURCHASE,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjU5fQ&s=AAPAw-3SfZ0JMzjEGFSwt9L-2S4',
-    },
-    {
-        event: RMN_SPOT_EVENT.ADD_TO_CART,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjYwfQ&s=uzQFcjgL7m9XqUG8FvTPVN5YkZY',
-    },
-    {
-        event: RMN_SPOT_EVENT.ADD_TO_WISHLIST,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjYzfQ&s=m3ISU_iIy-OFtXrTKpI6cJAEC0k',
-    },
-    {
-        event: RMN_SPOT_EVENT.BUY_NOW,
-        url: 'https://dev.rmn.liquidcommerce.cloud/api/spots/event?e=eyJ2IjoiMS4xMiIsImF2IjozMDY1NzgzLCJhdCI6MTYzLCJidCI6MCwiY20iOjQ0MDE5MjQxOCwiY2giOjYzMTg0LCJjayI6e30sImNyIjo0ODE4NTUzNzUsImRpIjoiOWMxNGFhMGI3NWY4NDMxNTllMTAwYWQzNzA1NzQyYzMiLCJkaiI6MCwiaWkiOiIxZjU0MGM5NmQ1N2M0YmZjODFlZjRkNjhkMzFjNDVkOSIsImRtIjozLCJmYyI6NjU2NjgyNTQ5LCJmbCI6NjQzOTMxODIxLCJpcCI6IjM1LjIyMy4xOTguOTUiLCJudyI6MTE1MDAsInBjIjo1MDAwLCJvcCI6NTAwMCwibXAiOjUwMDAsImVjIjowLCJnbSI6MCwiZXAiOm51bGwsInByIjoyNDkzMTYsInJ0IjoxLCJycyI6NTAwLCJzYSI6IjU1Iiwic2IiOiJpLTA0MDI0ODg4ZDlkMWRjZWQ3Iiwic3AiOjI3MjI3Miwic3QiOjEyODcyOTYsInRyIjp0cnVlLCJ1ayI6IjNhZWRhMWMxLTZhYjItNDUwNy04Mzg5LTEwZTJmNDMxYjM5MSIsInRzIjoxNzI5MzU5MDU0OTI3LCJiZiI6dHJ1ZSwicG4iOiJyYlByb2R1Y3RVcGNzIiwiZ2MiOnRydWUsImdDIjp0cnVlLCJncyI6Im5vbmUiLCJkYyI6MSwidHoiOiJBbWVyaWNhL05ld19Zb3JrIiwiZXQiOjY5fQ&s=l6MOscQC-q-FkC2Ksd7w6jjySCQ',
-    },
-];
-const RB_SPOTS_SELECTION_EXAMPLE = {
-    rbHomepageHeroFullImage: [
-        {
-            id: '111111_111111',
-            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
-            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
-            width: 1140,
-            height: 640,
-            header: 'Artisanal Craft Beer Collection',
-            description: 'Discover our curated selection of small-batch, flavor-packed craft beers.',
-            ctaText: 'Explore the Collection',
-            textColor: '#ffffff',
-            ctaTextColor: '#ffffff',
-            primaryImage: 'https://placehold.co/1140x640/png?text=Craft+Beer+Collection',
-            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Craft+Beer',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-        {
-            id: '222222_222222',
-            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
-            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_FULL_IMAGE,
-            width: 1140,
-            height: 640,
-            header: 'Summer Wine Spectacular',
-            description: 'Refresh your palate with our handpicked selection of crisp, summer wines.',
-            ctaText: 'Shop Summer Wines',
-            textColor: '#000000',
-            ctaTextColor: '#ffffff',
-            primaryImage: 'https://placehold.co/1140x640/png?text=Summer+Wines',
-            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Summer+Wines',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbHomepageHeroTwoTile: [
-        {
-            id: '333333_333333',
-            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
-            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_TWO_TILE,
-            width: 1140,
-            height: 640,
-            header: 'Whiskey Wonderland',
-            description: 'Embark on a journey through our premium whiskey selection.',
-            ctaText: 'Discover Whiskeys',
-            textColor: '#ffffff',
-            backgroundColor: '#2c1a05',
-            ctaTextColor: '#2c1a05',
-            primaryImage: 'https://placehold.co/1140x640/png?text=Whiskey+Collection',
-            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Whiskey',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbHomepageHeroThreeTile: [
-        {
-            id: '444444_444444',
-            spot: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
-            variant: RMN_SPOT_TYPE.RB_HOMEPAGE_HERO_THREE_TILE,
-            width: 1140,
-            height: 640,
-            header: 'Cocktail Essentials',
-            description: 'Stock your bar with premium spirits and mixers for the perfect cocktail.',
-            ctaText: 'Build Your Bar',
-            textColor: '#ffffff',
-            backgroundColor: '#1a3c4d',
-            ctaTextColor: '#1a3c4d',
-            primaryImage: 'https://placehold.co/1140x640/png?text=Cocktail+Spirits',
-            secondaryImage: 'https://placehold.co/1140x640/png?text=Cocktail+Mixers',
-            mobilePrimaryImage: 'https://placehold.co/640x640/png?text=Mobile+Cocktail+Kit',
-            mobileSecondaryImage: 'https://placehold.co/640x320/png?text=Mobile+Cocktail+Mixers',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbLargeCategoryImageTout: [
-        {
-            id: '555555_555555',
-            spot: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
-            variant: RMN_SPOT_TYPE.RB_LARGE_CATEGORY_IMAGE_TOUT,
-            width: 468,
-            height: 410,
-            header: 'Rare & Limited Edition',
-            description: 'Discover our collection of hard-to-find and limited release spirits.',
-            textColor: '#ffffff',
-            ctaTextColor: '#ffffff',
-            primaryImage: 'https://placehold.co/468x410/png?text=Rare+Spirits',
-            mobilePrimaryImage: 'https://placehold.co/468x410/png?text=Mobile+Rare+Spirits',
-            ctaText: 'Shop Rare Spirits',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbSmallDiscoverTout: [
-        {
-            id: '666666_666666',
-            spot: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
-            variant: RMN_SPOT_TYPE.RB_SMALL_DISCOVER_TOUT,
-            width: 224,
-            height: 378,
-            header: 'Château Margaux 2015 Bordeaux',
-            textColor: '#ffffff',
-            primaryImage: 'https://placehold.co/224x378/png?text=Château+Margaux',
-            mobilePrimaryImage: 'https://placehold.co/224x378/png?text=Mobile+Château+Margaux',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbSmallCategoryImageTout: [
-        {
-            id: '777777_777777',
-            spot: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
-            variant: RMN_SPOT_TYPE.RB_SMALL_CATEGORY_IMAGE_TOUT,
-            width: 224,
-            height: 410,
-            header: 'Japanese Sake',
-            textColor: '#ffffff',
-            primaryImage: 'https://placehold.co/224x410/png?text=Japanese+Sake',
-            mobilePrimaryImage: 'https://placehold.co/224x410/png?text=Mobile+Japanese+Sake',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbCollectionBannerWithoutTextBlock: [
-        {
-            id: '888888_888888',
-            spot: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
-            variant: RMN_SPOT_TYPE.RB_COLLECTION_BANNER_WITHOUT_TEXT_BLOCK,
-            width: 887,
-            height: 344,
-            primaryImage: 'https://placehold.co/887x344/png?text=Summer+Cocktails',
-            mobilePrimaryImage: 'https://placehold.co/887x344/png?text=Mobile+Summer+Cocktails',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-    rbNavigationBanner: [
-        {
-            id: '999999_999999',
-            spot: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
-            variant: RMN_SPOT_TYPE.RB_NAVIGATION_BANNER,
-            width: 440,
-            height: 220,
-            header: 'Explore Tequilas',
-            textColor: '#ffffff',
-            primaryImage: 'https://placehold.co/440x220/png?text=Tequila+Collection',
-            mobilePrimaryImage: 'https://placehold.co/440x220/png?text=Mobile+Tequila+Collection',
-            events: SPOT_EVENTS_EXAMPLE,
-        },
-    ],
-};
-
 class LiquidCommerceRmnClient {
     constructor(auth) {
         this.selectionService = SelectionService.getInstance(auth);
@@ -18439,7 +19210,7 @@ class LiquidCommerceRmnClient {
      *
      * @param {ISpotSelectionParams} params - Spots selection parameters.
      *
-     * @return {Promise<ISpots | {error : string}>} - The spots response object.
+     * @return {Promise<ISpots | { error : string }>} - The spots response object.
      */
     async spotSelection(params) {
         return this.selectionService.spotSelection(params);
@@ -18453,13 +19224,19 @@ class LiquidCommerceRmnClient {
      */
     async injectSpotElement(params) {
         var _a;
+        if (typeof window === 'undefined' || typeof document === 'undefined') {
+            console.warn('LiquidCommerce Rmn Sdk: Methods which create elements are only available in browser environments.');
+            return;
+        }
         const config = params.config;
         let inject = params.inject;
         if (!inject.length) {
+            // Handle no spots error state
             this.eventService.handleSpotState('all', {
                 state: {
                     error: 'No spot elements provided for injection.',
                     loading: false,
+                    mounted: false,
                 },
             });
             return;
@@ -18478,9 +19255,12 @@ class LiquidCommerceRmnClient {
         // const response = await this.useSpotSelectionExample(inject);
         // Handle the response
         if (typeof response === 'object' && 'error' in response) {
+            // Handle request error state
             this.eventService.handleSpotState('all', {
                 state: {
                     error: response.error,
+                    mounted: false,
+                    loading: false,
                 },
             });
             return;
@@ -18489,9 +19269,11 @@ class LiquidCommerceRmnClient {
             const itemConfig = (_a = item.config) !== null && _a !== void 0 ? _a : config;
             const spots = response[item.placementId];
             if (!(spots === null || spots === void 0 ? void 0 : spots.length)) {
+                // Handle no spots found error state
                 this.eventService.handleSpotState(item.placementId, {
                     state: {
                         error: `No spots found for type "${item.spotType}".`,
+                        mounted: false,
                         loading: false,
                     },
                 });
@@ -18500,9 +19282,11 @@ class LiquidCommerceRmnClient {
             const placementId = item.placementId.replace('#', '');
             const placement = document.getElementById(placementId);
             if (!placement) {
+                // Handle placement not found error state
                 this.eventService.handleSpotState(item.placementId, {
                     state: {
                         error: `Placement not found for id "${placementId}".`,
+                        mounted: false,
                         loading: false,
                     },
                 });
@@ -18513,16 +19297,18 @@ class LiquidCommerceRmnClient {
             placement.removeAttribute('class');
             Object.assign(placement.style, {
                 width: '100%',
-                height: 'auto',
+                height: '100%',
                 display: 'flex',
                 justifyContent: 'center',
             });
+            // Handle single spot
             if (spots.length === 1) {
                 const isInjected = this.injectOneSpotElement(item, placement, spots[0], itemConfig);
                 if (!isInjected) {
                     continue;
                 }
             }
+            // Handle multiple spots (carousel)
             if (spots.length > 1) {
                 const isInjected = this.injectCarouselSpotElement(placement, spots, itemConfig);
                 if (!isInjected) {
@@ -18566,18 +19352,24 @@ class LiquidCommerceRmnClient {
         const carouselSlides = [];
         for (const spotItem of spots) {
             this.eventService.handleSpotState(placement.id, {
+                identifier: {
+                    placementId: placement.id,
+                    spotType: spotItem.spot,
+                    spotId: spotItem.id,
+                },
                 displayConfig: {
+                    isSingleItem: false,
                     isCarousel: true,
                     isCarouselItem: true,
-                    isSingleItem: false,
                 },
-            }, false);
+            });
             const spot = this.elementService.overrideSpotColors(spotItem, config === null || config === void 0 ? void 0 : config.colors);
             const content = SPOT_TEMPLATE_HTML_ELEMENT(spot, { overlay: config === null || config === void 0 ? void 0 : config.overlay });
             if (!content) {
                 this.eventService.handleSpotState(placement.id, {
                     state: {
                         error: `Failed to inject carousel spot item element. Could not create element for type "${spot.spot}".`,
+                        mounted: false,
                         loading: false,
                     },
                 });
@@ -18610,6 +19402,7 @@ class LiquidCommerceRmnClient {
             this.eventService.handleSpotState(placement.id, {
                 state: {
                     error: `Failed to inject spot carousel element. Could not create spot carousel element.`,
+                    mounted: false,
                     loading: false,
                 },
             });
@@ -18619,10 +19412,12 @@ class LiquidCommerceRmnClient {
         this.eventService.handleSpotState(placement.id, {
             dom: {
                 spotElement: carouselElement,
+                visibleOnViewport: false,
             },
             state: {
                 mounted: true,
                 loading: false,
+                error: undefined,
             },
         });
         return true;
@@ -18639,18 +19434,25 @@ class LiquidCommerceRmnClient {
      */
     injectOneSpotElement(injectItem, placement, spot, config) {
         var _a;
-        const spotData = this.elementService.overrideSpotColors(spot, config === null || config === void 0 ? void 0 : config.colors);
         this.eventService.handleSpotState(injectItem.placementId, {
+            identifier: {
+                placementId: injectItem.placementId,
+                spotType: injectItem.spotType,
+                spotId: spot.id,
+            },
             displayConfig: {
                 isSingleItem: true,
+                isCarousel: false,
+                isCarouselItem: false,
             },
-        }, false);
-        // Create the spot template element
+        });
+        const spotData = this.elementService.overrideSpotColors(spot, config === null || config === void 0 ? void 0 : config.colors);
         const content = SPOT_TEMPLATE_HTML_ELEMENT(spotData, { overlay: config === null || config === void 0 ? void 0 : config.overlay });
         if (!content) {
             this.eventService.handleSpotState(injectItem.placementId, {
                 state: {
                     error: `Failed to inject spot element. Could not create element for type "${injectItem.spotType}".`,
+                    mounted: false,
                     loading: false,
                 },
             });
@@ -18671,6 +19473,7 @@ class LiquidCommerceRmnClient {
             this.eventService.handleSpotState(injectItem.placementId, {
                 state: {
                     error: `Failed to inject spot element. Could not create element for type "${injectItem.spotType}".`,
+                    mounted: false,
                     loading: false,
                 },
             });
@@ -18685,10 +19488,12 @@ class LiquidCommerceRmnClient {
         this.eventService.handleSpotState(injectItem.placementId, {
             dom: {
                 spotElement,
+                visibleOnViewport: false,
             },
             state: {
                 mounted: true,
                 loading: false,
+                error: undefined,
             },
         });
         return true;
@@ -18709,6 +19514,8 @@ class LiquidCommerceRmnClient {
                 this.eventService.handleSpotState(item.placementId, {
                     state: {
                         error: `Duplicate placement id (${item.placementId}) found. Please provide a unique placement id for each spot element.`,
+                        mounted: false,
+                        loading: false,
                     },
                 });
                 return false;
@@ -18724,6 +19531,8 @@ class LiquidCommerceRmnClient {
                 this.eventService.handleSpotState(item.placementId, {
                     state: {
                         error: `Invalid spot type (${item.spotType}) found. Please provide a valid spot type for each spot element.`,
+                        mounted: false,
+                        loading: false,
                     },
                 });
                 continue;
@@ -18732,6 +19541,7 @@ class LiquidCommerceRmnClient {
         }
         return newInject;
     }
+    // Initialize spots with loading state and identifiers
     updateSpotsState(inject) {
         for (const item of inject) {
             this.eventService.handleSpotState(item.placementId, {
@@ -18741,6 +19551,8 @@ class LiquidCommerceRmnClient {
                 },
                 state: {
                     loading: true,
+                    mounted: false,
+                    error: undefined,
                 },
             });
         }
@@ -18832,4 +19644,4 @@ function RmnCreateSpotElement(spot, config) {
     });
 }
 
-export { LiquidCommerceRmnClient, RMN_ENV, RMN_FILTER_PROPERTIES, RMN_SPOT_EVENT, RMN_SPOT_TYPE, RmnClient, RmnCreateSpotElement, RmnEventManager };
+export { LiquidCommerceRmnClient, RMN_ENV, RMN_EVENT, RMN_FILTER_PROPERTIES, RMN_SPOT_EVENT, RMN_SPOT_TYPE, RmnClient, RmnCreateSpotElement, RmnEventManager };