@folklore/ads 0.0.38 → 0.0.40

package/dist/cjs.js

@@ -192,6 +192,13 @@ class AdSlot extends EventEmitter__default["default"] {
   setRefreshDisabled() {
     this.refreshDisabled = true;
   }
+  setTargeting(targeting) {
+    if (this.adSlot !== null) {
+      this.adSlot.updateTargetingFromMap(targeting);
+    } else {
+      this.options.targeting = targeting;
+    }
+  }
   destroy() {
     if (this.destroyed) {
       return;
@@ -269,12 +276,16 @@ class AdSlot extends EventEmitter__default["default"] {
 /* globals refreshDisabledLineItems: [] */
 const debug = createDebug__default["default"]('folklore:ads');
 class AdsManager extends EventEmitter__default["default"] {
-  static index = 0;
-  static createAdId() {
-    const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(Math.random() * (Math.random() * 1000))}-${AdsManager.index}`;
-    AdsManager.index += 1;
-    return newId;
-  }
+  // static index = 0;
+
+  // static createAdId() {
+  //     const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
+  //         Math.random() * (Math.random() * 1000),
+  //     )}-${AdsManager.index}`;
+  //     AdsManager.index += 1;
+  //     return newId;
+  // }
+
   static getArticleTargeting(article) {
     if (article === null) {
       return null;
@@ -339,10 +350,19 @@ class AdsManager extends EventEmitter__default["default"] {
       cmd: []
     };
     this.slots = [];
+    this.index = 0;
     if (this.options.autoInit) {
       this.init();
     }
   }
+  createAdId() {
+    // const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
+    //     Math.random() * (Math.random() * 1000),
+    // )}-${this.index}`;
+    const newId = `div-gpt-ad-${this.index}`;
+    this.index += 1;
+    return newId;
+  }
   onGPTReady() {
     const {
       googletag
@@ -471,7 +491,7 @@ class AdsManager extends EventEmitter__default["default"] {
     const {
       id: providedId = null
     } = opts;
-    const id = providedId || AdsManager.createAdId();
+    const id = providedId || this.createAdId();
     debug('Creating slot #%s(%s)...', id, path);
     const slot = new AdSlot(id, path, size, {
       ...opts
@@ -745,25 +765,27 @@ function AdsProvider(_ref) {
       onResize.cancel();
     };
   }, [ads, resizeDebounceDelay, refreshOnResize]);
+  const slotsWithSizeMapping = React.useMemo(() => Object.keys(slots || {}).reduce((map, key) => ({
+    ...map,
+    [key]: {
+      ...slots[key],
+      sizeMapping: getSizeMappingFromSlot(slots[key], viewports)
+    }
+  }), {}), []);
+  const finalSlotsPath = React.useMemo(() => defaultSlotPath !== null ? {
+    default: defaultSlotPath,
+    ...slotsPath
+  } : {
+    ...slotsPath
+  }, [defaultSlotPath, slotsPath]);
   const value = React.useMemo(() => ({
     ready,
     ads,
     viewports,
-    slots: Object.keys(slots || {}).reduce((map, key) => ({
-      ...map,
-      [key]: {
-        ...slots[key],
-        sizeMapping: getSizeMappingFromSlot(slots[key], viewports)
-      }
-    }), {}),
-    slotsPath: defaultSlotPath !== null ? {
-      default: defaultSlotPath,
-      ...slotsPath
-    } : {
-      ...slotsPath
-    },
+    slots: slotsWithSizeMapping,
+    slotsPath: finalSlotsPath,
     trackingDisabled: disableTracking
-  }), [ready, ads, viewports, slots, slotsPath, defaultSlotPath, disableTracking, disabled]);
+  }), [ready, ads, viewports, slotsWithSizeMapping, finalSlotsPath, disableTracking]);
   return /*#__PURE__*/jsxRuntime.jsx(AdsContext.Provider, {
     value: value,
     children: children
@@ -878,7 +900,12 @@ function useAd(path, size) {
     //     adsManager.defineSlot(currentSlot.current);
     // }
     return currentSlot.current;
-  }, [adsManager, path, disabled, size, sizeMapping, targeting, alwaysRender, categoryExclusions]);
+  }, [adsManager, path, disabled, size, sizeMapping, alwaysRender, categoryExclusions]);
+  React.useEffect(() => {
+    if (currentSlot.current !== null) {
+      currentSlot.current.setTargeting(targeting);
+    }
+  }, [targeting]);
 
   // Set visibility
   React.useEffect(() => {

package/dist/es.js

@@ -174,6 +174,13 @@ class AdSlot extends EventEmitter {
   setRefreshDisabled() {
     this.refreshDisabled = true;
   }
+  setTargeting(targeting) {
+    if (this.adSlot !== null) {
+      this.adSlot.updateTargetingFromMap(targeting);
+    } else {
+      this.options.targeting = targeting;
+    }
+  }
   destroy() {
     if (this.destroyed) {
       return;
@@ -251,12 +258,16 @@ class AdSlot extends EventEmitter {
 /* globals refreshDisabledLineItems: [] */
 const debug = createDebug('folklore:ads');
 class AdsManager extends EventEmitter {
-  static index = 0;
-  static createAdId() {
-    const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(Math.random() * (Math.random() * 1000))}-${AdsManager.index}`;
-    AdsManager.index += 1;
-    return newId;
-  }
+  // static index = 0;
+
+  // static createAdId() {
+  //     const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
+  //         Math.random() * (Math.random() * 1000),
+  //     )}-${AdsManager.index}`;
+  //     AdsManager.index += 1;
+  //     return newId;
+  // }
+
   static getArticleTargeting(article) {
     if (article === null) {
       return null;
@@ -321,10 +332,19 @@ class AdsManager extends EventEmitter {
       cmd: []
     };
     this.slots = [];
+    this.index = 0;
     if (this.options.autoInit) {
       this.init();
     }
   }
+  createAdId() {
+    // const newId = `div-gpt-ad-${new Date().getTime()}-${Math.round(
+    //     Math.random() * (Math.random() * 1000),
+    // )}-${this.index}`;
+    const newId = `div-gpt-ad-${this.index}`;
+    this.index += 1;
+    return newId;
+  }
   onGPTReady() {
     const {
       googletag
@@ -453,7 +473,7 @@ class AdsManager extends EventEmitter {
     const {
       id: providedId = null
     } = opts;
-    const id = providedId || AdsManager.createAdId();
+    const id = providedId || this.createAdId();
     debug('Creating slot #%s(%s)...', id, path);
     const slot = new AdSlot(id, path, size, {
       ...opts
@@ -727,25 +747,27 @@ function AdsProvider(_ref) {
       onResize.cancel();
     };
   }, [ads, resizeDebounceDelay, refreshOnResize]);
+  const slotsWithSizeMapping = useMemo(() => Object.keys(slots || {}).reduce((map, key) => ({
+    ...map,
+    [key]: {
+      ...slots[key],
+      sizeMapping: getSizeMappingFromSlot(slots[key], viewports)
+    }
+  }), {}), []);
+  const finalSlotsPath = useMemo(() => defaultSlotPath !== null ? {
+    default: defaultSlotPath,
+    ...slotsPath
+  } : {
+    ...slotsPath
+  }, [defaultSlotPath, slotsPath]);
   const value = useMemo(() => ({
     ready,
     ads,
     viewports,
-    slots: Object.keys(slots || {}).reduce((map, key) => ({
-      ...map,
-      [key]: {
-        ...slots[key],
-        sizeMapping: getSizeMappingFromSlot(slots[key], viewports)
-      }
-    }), {}),
-    slotsPath: defaultSlotPath !== null ? {
-      default: defaultSlotPath,
-      ...slotsPath
-    } : {
-      ...slotsPath
-    },
+    slots: slotsWithSizeMapping,
+    slotsPath: finalSlotsPath,
     trackingDisabled: disableTracking
-  }), [ready, ads, viewports, slots, slotsPath, defaultSlotPath, disableTracking, disabled]);
+  }), [ready, ads, viewports, slotsWithSizeMapping, finalSlotsPath, disableTracking]);
   return /*#__PURE__*/jsx(AdsContext.Provider, {
     value: value,
     children: children
@@ -860,7 +882,12 @@ function useAd(path, size) {
     //     adsManager.defineSlot(currentSlot.current);
     // }
     return currentSlot.current;
-  }, [adsManager, path, disabled, size, sizeMapping, targeting, alwaysRender, categoryExclusions]);
+  }, [adsManager, path, disabled, size, sizeMapping, alwaysRender, categoryExclusions]);
+  useEffect(() => {
+    if (currentSlot.current !== null) {
+      currentSlot.current.setTargeting(targeting);
+    }
+  }, [targeting]);
 
   // Set visibility
   useEffect(() => {

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@folklore/ads",
-    "version": "0.0.38",
+    "version": "0.0.40",
     "description": "Ads library",
     "keywords": [
         "javascript",
@@ -50,7 +50,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "39bba0091b4efb93b8636ae5c2eea5e46b350b90",
+    "gitHead": "9b792452940372423d526d0fb10d3f427b7ebe1c",
     "dependencies": {
         "@folklore/hooks": "^0.0.44",
         "@folklore/tracking": "^0.0.23",