@folklore/ads 0.0.5 → 0.0.7

package/dist/cjs.js

@@ -32,12 +32,12 @@ var createDebug__default = /*#__PURE__*/_interopDefaultLegacy(createDebug);
 const adPath = PropTypes__default["default"].string;
 const adSize = PropTypes__default["default"].oneOfType([PropTypes__default["default"].arrayOf(PropTypes__default["default"].number), PropTypes__default["default"].arrayOf(PropTypes__default["default"].string), PropTypes__default["default"].string, PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].arrayOf(PropTypes__default["default"].number), PropTypes__default["default"].arrayOf(PropTypes__default["default"].string), PropTypes__default["default"].string]))]);
 const adSizeMapping = PropTypes__default["default"].arrayOf(PropTypes__default["default"].arrayOf(PropTypes__default["default"].oneOfType([PropTypes__default["default"].arrayOf(PropTypes__default["default"].number), adSize])));
-const adPosition = PropTypes__default["default"].shape({
+const adViewports = PropTypes__default["default"].objectOf(PropTypes__default["default"].arrayOf(PropTypes__default["default"].number));
+const adSlot = PropTypes__default["default"].shape({
   size: adSize,
   sizeMapping: PropTypes__default["default"].objectOf(adSize)
 });
-const adPositions = PropTypes__default["default"].objectOf(adPosition);
-const adViewports = PropTypes__default["default"].objectOf(PropTypes__default["default"].arrayOf(PropTypes__default["default"].number));
+const adSlots = PropTypes__default["default"].objectOf(adSlot);
 const adTargeting = PropTypes__default["default"].shape({
   domain: PropTypes__default["default"].string
 });
@@ -47,9 +47,9 @@ var propTypes$3 = /*#__PURE__*/Object.freeze({
     adPath: adPath,
     adSize: adSize,
     adSizeMapping: adSizeMapping,
-    adPosition: adPosition,
-    adPositions: adPositions,
     adViewports: adViewports,
+    adSlot: adSlot,
+    adSlots: adSlots,
     adTargeting: adTargeting
 });
 
@@ -85,7 +85,7 @@ const buildSizeMappingFromSizes = (sizes, viewports) => getSortedViewports(viewp
   } = _ref2;
   return [viewPortSize, sizes.filter(size => sizeFitsInViewport(size, name === 'default' ? [300, 300] : viewPortSize))];
 });
-const getSizeMappingFromPosition = (_ref3, viewports) => {
+const getSizeMappingFromSlot = (_ref3, viewports) => {
   let {
     size: allSizes = [],
     sizeMapping = null
@@ -330,7 +330,9 @@ class AdsManager extends EventEmitter__default["default"] {
     this.personnalizedAdsDisabled = this.options.disablePersonnalizedAds;
     this.ready = false;
     this.enabled = false;
-    this.googletag = window.googletag;
+    this.googletag = typeof window !== 'undefined' ? window.googletag : {
+      cmd: []
+    };
     this.slots = [];
     if (this.options.autoInit) {
       this.init();
@@ -391,7 +393,7 @@ class AdsManager extends EventEmitter__default["default"] {
     if (renderSlot !== null) {
       renderSlot.setRenderEvent(event);
     }
-    const lineItems = window.refreshDisabledLineItems || [];
+    const lineItems = typeof window !== 'undefined' ? window.refreshDisabledLineItems || [] : [];
     if (isArray__default["default"](lineItems) && lineItems.indexOf(lineItemId) > -1) {
       renderSlot.setRefreshDisabled();
     }
@@ -580,7 +582,7 @@ const viewports = {
   desktop: [1024, 0],
   laptop: [1400, 700]
 };
-const positions = {
+const slots = {
   top: {
     size: [[320, 50], [1382, 600], [320, 100], [970, 90], [1024, 300], [970, 250], [300, 150], [1382, 300], [300, 100], [250, 250], [300, 250]],
     sizeMapping: {
@@ -631,7 +633,7 @@ const propTypes$2 = {
   autoInit: PropTypes__default["default"].bool,
   resizeDebounceDelay: PropTypes__default["default"].number,
   refreshOnResize: PropTypes__default["default"].bool,
-  positions: adViewports,
+  slots: adSlots,
   viewports: adViewports
 };
 const defaultProps$2 = {
@@ -641,7 +643,7 @@ const defaultProps$2 = {
   autoInit: true,
   resizeDebounceDelay: 500,
   refreshOnResize: false,
-  positions: positions,
+  slots: slots,
   viewports: viewports
 };
 function AdsProvider(_ref) {
@@ -654,7 +656,7 @@ function AdsProvider(_ref) {
     resizeDebounceDelay,
     refreshOnResize,
     viewports,
-    positions
+    slots
   } = _ref;
   const [ready, setReady] = React.useState(false);
   const adsRef = React.useRef(null);
@@ -702,14 +704,14 @@ function AdsProvider(_ref) {
     ready,
     ads,
     viewports,
-    positions,
+    slots,
     slotsPath: defaultSlotPath !== null ? {
       default: defaultSlotPath,
       ...slotsPath
     } : {
       ...slotsPath
     }
-  }), [ready, ads, viewports, positions, slotsPath, defaultSlotPath]);
+  }), [ready, ads, viewports, slots, slotsPath, defaultSlotPath]);
   return /*#__PURE__*/jsxRuntime.jsx(AdsContext.Provider, {
     value: value,
     children: children
@@ -896,8 +898,7 @@ function useAd(path, size) {
 }
 
 const propTypes = {
-  position: PropTypes__default["default"].string.isRequired,
-  slot: PropTypes__default["default"].string,
+  slot: PropTypes__default["default"].string.isRequired,
   path: adPath,
   size: adSize,
   sizeMapping: adSizeMapping,
@@ -912,7 +913,6 @@ const propTypes = {
 };
 const defaultProps = {
   path: null,
-  slot: 'default',
   size: null,
   sizeMapping: null,
   targeting: null,
@@ -926,7 +926,6 @@ const defaultProps = {
 };
 function Ad(_ref) {
   let {
-    position: positionName,
     slot: slotName,
     path,
     size,
@@ -942,21 +941,21 @@ function Ad(_ref) {
   } = _ref;
   const {
     viewports,
-    positions,
+    slots,
     slotsPath
   } = useAdsContext();
-  const position = positionName !== null ? positions[positionName] || null : null;
-  const finalPath = path || (slotName !== null ? slotsPath[slotName] : null) || (positionName !== null ? slotsPath[positionName] : null);
-  const finalSize = size !== null ? size : position.size;
+  const slot = slotName !== null ? slots[slotName] || null : null;
+  const finalPath = path || (slotName !== null ? slotsPath[slotName] : null) || slotsPath.default;
+  const finalSize = size !== null ? size : slot.size;
 
   // Targeting
   const contextTargeting = useAdsTargeting();
-  const finalSizeMapping = React.useMemo(() => sizeMapping !== null ? sizeMapping : getSizeMappingFromPosition(position, viewports), [sizeMapping, position, viewports]);
-  const allTargeting = React.useMemo(() => contextTargeting !== null || targeting !== null || positionName !== null ? {
-    position: positionName,
+  const finalSizeMapping = React.useMemo(() => sizeMapping !== null ? sizeMapping : getSizeMappingFromSlot(slot, viewports), [sizeMapping, slot, viewports]);
+  const allTargeting = React.useMemo(() => contextTargeting !== null || targeting !== null || slotName !== null ? {
+    slot: slotName,
     ...contextTargeting,
     ...targeting
-  } : null, [contextTargeting, targeting, positionName]);
+  } : null, [contextTargeting, targeting, slotName]);
   const finalAdTargeting = React.useMemo(() => {
     const {
       refreshAds = null,
@@ -1026,18 +1025,9 @@ function Ad(_ref) {
       [emptyClassName]: emptyClassName !== null && isEmpty && !keepSize
     }]),
     ref: refObserver,
-    style: isEmpty && !keepSize ? {
-      height: 0,
-      paddingBottom: 0,
-      overflow: 'hidden',
-      opacity: 0
-    } : null,
     children: /*#__PURE__*/jsxRuntime.jsx("div", {
       className: adClassName,
-      style: {
-        ...sizeStyle,
-        margin: 'auto'
-      },
+      style: sizeStyle,
       children: /*#__PURE__*/jsxRuntime.jsx("div", {
         id: id
       })
@@ -1057,10 +1047,10 @@ exports.buildSizeMappingFromSizes = buildSizeMappingFromSizes;
 exports.buildSizeMappingFromViewports = buildSizeMappingFromViewports;
 exports.getAdSizes = getAdSizes;
 exports.getMinimumAdSize = getMinimumAdSize;
-exports.getSizeMappingFromPosition = getSizeMappingFromPosition;
+exports.getSizeMappingFromSlot = getSizeMappingFromSlot;
 exports.getSortedViewports = getSortedViewports;
-exports.positions = positions;
 exports.sizeFitsInViewport = sizeFitsInViewport;
+exports.slots = slots;
 exports.useAd = useAd;
 exports.useAdsContext = useAdsContext;
 exports.useAdsTargeting = useAdsTargeting;

package/dist/es.js

@@ -15,12 +15,12 @@ import { useTracking } from '@folklore/tracking';
 const adPath = PropTypes.string;
 const adSize = PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.arrayOf(PropTypes.string), PropTypes.string, PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), PropTypes.arrayOf(PropTypes.string), PropTypes.string]))]);
 const adSizeMapping = PropTypes.arrayOf(PropTypes.arrayOf(PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.number), adSize])));
-const adPosition = PropTypes.shape({
+const adViewports = PropTypes.objectOf(PropTypes.arrayOf(PropTypes.number));
+const adSlot = PropTypes.shape({
   size: adSize,
   sizeMapping: PropTypes.objectOf(adSize)
 });
-const adPositions = PropTypes.objectOf(adPosition);
-const adViewports = PropTypes.objectOf(PropTypes.arrayOf(PropTypes.number));
+const adSlots = PropTypes.objectOf(adSlot);
 const adTargeting = PropTypes.shape({
   domain: PropTypes.string
 });
@@ -30,9 +30,9 @@ var propTypes$3 = /*#__PURE__*/Object.freeze({
     adPath: adPath,
     adSize: adSize,
     adSizeMapping: adSizeMapping,
-    adPosition: adPosition,
-    adPositions: adPositions,
     adViewports: adViewports,
+    adSlot: adSlot,
+    adSlots: adSlots,
     adTargeting: adTargeting
 });
 
@@ -68,7 +68,7 @@ const buildSizeMappingFromSizes = (sizes, viewports) => getSortedViewports(viewp
   } = _ref2;
   return [viewPortSize, sizes.filter(size => sizeFitsInViewport(size, name === 'default' ? [300, 300] : viewPortSize))];
 });
-const getSizeMappingFromPosition = (_ref3, viewports) => {
+const getSizeMappingFromSlot = (_ref3, viewports) => {
   let {
     size: allSizes = [],
     sizeMapping = null
@@ -313,7 +313,9 @@ class AdsManager extends EventEmitter {
     this.personnalizedAdsDisabled = this.options.disablePersonnalizedAds;
     this.ready = false;
     this.enabled = false;
-    this.googletag = window.googletag;
+    this.googletag = typeof window !== 'undefined' ? window.googletag : {
+      cmd: []
+    };
     this.slots = [];
     if (this.options.autoInit) {
       this.init();
@@ -374,7 +376,7 @@ class AdsManager extends EventEmitter {
     if (renderSlot !== null) {
       renderSlot.setRenderEvent(event);
     }
-    const lineItems = window.refreshDisabledLineItems || [];
+    const lineItems = typeof window !== 'undefined' ? window.refreshDisabledLineItems || [] : [];
     if (isArray(lineItems) && lineItems.indexOf(lineItemId) > -1) {
       renderSlot.setRefreshDisabled();
     }
@@ -563,7 +565,7 @@ const viewports = {
   desktop: [1024, 0],
   laptop: [1400, 700]
 };
-const positions = {
+const slots = {
   top: {
     size: [[320, 50], [1382, 600], [320, 100], [970, 90], [1024, 300], [970, 250], [300, 150], [1382, 300], [300, 100], [250, 250], [300, 250]],
     sizeMapping: {
@@ -614,7 +616,7 @@ const propTypes$2 = {
   autoInit: PropTypes.bool,
   resizeDebounceDelay: PropTypes.number,
   refreshOnResize: PropTypes.bool,
-  positions: adViewports,
+  slots: adSlots,
   viewports: adViewports
 };
 const defaultProps$2 = {
@@ -624,7 +626,7 @@ const defaultProps$2 = {
   autoInit: true,
   resizeDebounceDelay: 500,
   refreshOnResize: false,
-  positions: positions,
+  slots: slots,
   viewports: viewports
 };
 function AdsProvider(_ref) {
@@ -637,7 +639,7 @@ function AdsProvider(_ref) {
     resizeDebounceDelay,
     refreshOnResize,
     viewports,
-    positions
+    slots
   } = _ref;
   const [ready, setReady] = useState(false);
   const adsRef = useRef(null);
@@ -685,14 +687,14 @@ function AdsProvider(_ref) {
     ready,
     ads,
     viewports,
-    positions,
+    slots,
     slotsPath: defaultSlotPath !== null ? {
       default: defaultSlotPath,
       ...slotsPath
     } : {
       ...slotsPath
     }
-  }), [ready, ads, viewports, positions, slotsPath, defaultSlotPath]);
+  }), [ready, ads, viewports, slots, slotsPath, defaultSlotPath]);
   return /*#__PURE__*/jsx(AdsContext.Provider, {
     value: value,
     children: children
@@ -879,8 +881,7 @@ function useAd(path, size) {
 }
 
 const propTypes = {
-  position: PropTypes.string.isRequired,
-  slot: PropTypes.string,
+  slot: PropTypes.string.isRequired,
   path: adPath,
   size: adSize,
   sizeMapping: adSizeMapping,
@@ -895,7 +896,6 @@ const propTypes = {
 };
 const defaultProps = {
   path: null,
-  slot: 'default',
   size: null,
   sizeMapping: null,
   targeting: null,
@@ -909,7 +909,6 @@ const defaultProps = {
 };
 function Ad(_ref) {
   let {
-    position: positionName,
     slot: slotName,
     path,
     size,
@@ -925,21 +924,21 @@ function Ad(_ref) {
   } = _ref;
   const {
     viewports,
-    positions,
+    slots,
     slotsPath
   } = useAdsContext();
-  const position = positionName !== null ? positions[positionName] || null : null;
-  const finalPath = path || (slotName !== null ? slotsPath[slotName] : null) || (positionName !== null ? slotsPath[positionName] : null);
-  const finalSize = size !== null ? size : position.size;
+  const slot = slotName !== null ? slots[slotName] || null : null;
+  const finalPath = path || (slotName !== null ? slotsPath[slotName] : null) || slotsPath.default;
+  const finalSize = size !== null ? size : slot.size;
 
   // Targeting
   const contextTargeting = useAdsTargeting();
-  const finalSizeMapping = useMemo(() => sizeMapping !== null ? sizeMapping : getSizeMappingFromPosition(position, viewports), [sizeMapping, position, viewports]);
-  const allTargeting = useMemo(() => contextTargeting !== null || targeting !== null || positionName !== null ? {
-    position: positionName,
+  const finalSizeMapping = useMemo(() => sizeMapping !== null ? sizeMapping : getSizeMappingFromSlot(slot, viewports), [sizeMapping, slot, viewports]);
+  const allTargeting = useMemo(() => contextTargeting !== null || targeting !== null || slotName !== null ? {
+    slot: slotName,
     ...contextTargeting,
     ...targeting
-  } : null, [contextTargeting, targeting, positionName]);
+  } : null, [contextTargeting, targeting, slotName]);
   const finalAdTargeting = useMemo(() => {
     const {
       refreshAds = null,
@@ -1009,18 +1008,9 @@ function Ad(_ref) {
       [emptyClassName]: emptyClassName !== null && isEmpty && !keepSize
     }]),
     ref: refObserver,
-    style: isEmpty && !keepSize ? {
-      height: 0,
-      paddingBottom: 0,
-      overflow: 'hidden',
-      opacity: 0
-    } : null,
     children: /*#__PURE__*/jsx("div", {
       className: adClassName,
-      style: {
-        ...sizeStyle,
-        margin: 'auto'
-      },
+      style: sizeStyle,
       children: /*#__PURE__*/jsx("div", {
         id: id
       })
@@ -1030,4 +1020,4 @@ function Ad(_ref) {
 Ad.propTypes = propTypes;
 Ad.defaultProps = defaultProps;
 
-export { Ad, AdSlot, AdsManager, AdsProvider, AdsTargetingProvider, propTypes$3 as PropTypes, buildSizeMappingFromSizes, buildSizeMappingFromViewports, getAdSizes, getMinimumAdSize, getSizeMappingFromPosition, getSortedViewports, positions, sizeFitsInViewport, useAd, useAdsContext, useAdsTargeting, useTrackAd as useAdsTracking, viewports };
+export { Ad, AdSlot, AdsManager, AdsProvider, AdsTargetingProvider, propTypes$3 as PropTypes, buildSizeMappingFromSizes, buildSizeMappingFromViewports, getAdSizes, getMinimumAdSize, getSizeMappingFromSlot, getSortedViewports, sizeFitsInViewport, slots, useAd, useAdsContext, useAdsTargeting, useTrackAd as useAdsTracking, viewports };

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@folklore/ads",
-    "version": "0.0.5",
+    "version": "0.0.7",
     "description": "Ads library",
     "keywords": [
         "javascript",
@@ -50,7 +50,7 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "cbdee31b7e205f95c4ab462380feee74c076daa1",
+    "gitHead": "534c66f1119953e57b47773878494c1b7bab2620",
     "dependencies": {
         "@folklore/hooks": "^0.0.41",
         "@folklore/tracking": "^0.0.16",