@mjhls/mjh-framework 1.0.7 → 1.0.9

package/dist/index.js

@@ -9,6 +9,7 @@ var React__default = _interopDefault(React);
 var url = _interopDefault(require('url'));
 var PropTypes = _interopDefault(require('prop-types'));
 var ReactDOM = _interopDefault(require('react-dom'));
+var events = _interopDefault(require('events'));
 
 function _extends() {
   _extends = Object.assign || function (target) {
@@ -11238,6 +11239,1356 @@ var Normal = function Normal(props) {
   );
 };
 
+var utils$2 = createCommonjsModule(function (module, exports) {
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.loadGPTScript = loadGPTScript;
+
+function doloadGPTScript(resolve, reject) {
+  window.googletag = window.googletag || {};
+  window.googletag.cmd = window.googletag.cmd || [];
+  var scriptTag = document.createElement('script');
+  scriptTag.src = "".concat(document.location.protocol, "//securepubads.g.doubleclick.net/tag/js/gpt.js");
+  scriptTag.async = true;
+  scriptTag.type = 'text/javascript';
+
+  scriptTag.onerror = function scriptTagOnError(errs) {
+    reject(errs);
+  };
+
+  scriptTag.onload = function scriptTagOnLoad() {
+    resolve(window.googletag);
+  };
+
+  document.getElementsByTagName('head')[0].appendChild(scriptTag);
+}
+
+function loadGPTScript() {
+  return new Promise(function (resolve, reject) {
+    doloadGPTScript(resolve, reject);
+  });
+}
+});
+
+unwrapExports(utils$2);
+var utils_1$1 = utils$2.loadGPTScript;
+
+var manager = createCommonjsModule(function (module, exports) {
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = void 0;
+
+
+
+var Utils = _interopRequireWildcard(utils$2);
+
+function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } else { var newObj = {}; if (obj != null) { for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = Object.defineProperty && Object.getOwnPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : {}; if (desc.get || desc.set) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } } newObj.default = obj; return newObj; } }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+var loadPromise = null;
+var googleGPTScriptLoadPromise = null;
+var singleRequestEnabled = true;
+var disableInitialLoadEnabled = false;
+var lazyLoadEnabled = false;
+var lazyLoadConfig = null;
+var servePersonalizedAds = true;
+var registeredSlots = {};
+var managerAlreadyInitialized = false;
+var globalTargetingArguments = {};
+var globalAdSenseAttributes = {};
+var DFPManager = Object.assign(new events.EventEmitter().setMaxListeners(0), {
+  singleRequestIsEnabled: function singleRequestIsEnabled() {
+    return singleRequestEnabled;
+  },
+  configureSingleRequest: function configureSingleRequest(value) {
+    singleRequestEnabled = !!value;
+  },
+  disableInitialLoadIsEnabled: function disableInitialLoadIsEnabled() {
+    return disableInitialLoadEnabled;
+  },
+  configureDisableInitialLoad: function configureDisableInitialLoad(value) {
+    disableInitialLoadEnabled = !!value;
+  },
+  configureLazyLoad: function configureLazyLoad() {
+    var enable = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
+    var config = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : null;
+    var conf = null;
+
+    if (config !== null && _typeof(config) === 'object') {
+      conf = _objectSpread({}, config);
+    }
+
+    lazyLoadEnabled = !!enable;
+    lazyLoadConfig = conf;
+  },
+  lazyLoadIsEnabled: function lazyLoadIsEnabled() {
+    return lazyLoadEnabled;
+  },
+  getLazyLoadConfig: function getLazyLoadConfig() {
+    return lazyLoadConfig;
+  },
+  getAdSenseAttribute: function getAdSenseAttribute(key) {
+    return globalAdSenseAttributes[key];
+  },
+  configurePersonalizedAds: function configurePersonalizedAds(value) {
+    servePersonalizedAds = value;
+  },
+  personalizedAdsEnabled: function personalizedAdsEnabled() {
+    return servePersonalizedAds;
+  },
+  setAdSenseAttribute: function setAdSenseAttribute(key, value) {
+    this.setAdSenseAttributes(_defineProperty({}, key, value));
+  },
+  getAdSenseAttributes: function getAdSenseAttributes() {
+    return _objectSpread({}, globalAdSenseAttributes);
+  },
+  setAdSenseAttributes: function setAdSenseAttributes(attrs) {
+    Object.assign(globalAdSenseAttributes, attrs);
+
+    if (managerAlreadyInitialized === true) {
+      this.getGoogletag().then(function (googletag) {
+        googletag.cmd.push(function () {
+          var pubadsService = googletag.pubads();
+          Object.keys(globalAdSenseAttributes).forEach(function (key) {
+            pubadsService.set(key, globalTargetingArguments[key]);
+          });
+        });
+      });
+    }
+  },
+  setTargetingArguments: function setTargetingArguments(data) {
+    Object.assign(globalTargetingArguments, data);
+
+    if (managerAlreadyInitialized === true) {
+      this.getGoogletag().then(function (googletag) {
+        googletag.cmd.push(function () {
+          var pubadsService = googletag.pubads();
+          Object.keys(globalTargetingArguments).forEach(function (varName) {
+            if (pubadsService) {
+              pubadsService.setTargeting(varName, globalTargetingArguments[varName]);
+            }
+          });
+        });
+      });
+    }
+  },
+  getTargetingArguments: function getTargetingArguments() {
+    return _objectSpread({}, globalTargetingArguments);
+  },
+  getSlotProperty: function getSlotProperty(slotId, propName) {
+    var slot = this.getRegisteredSlots()[slotId];
+    var ret = null;
+
+    if (slot !== undefined) {
+      ret = slot[propName] || ret;
+    }
+
+    return ret;
+  },
+  getSlotTargetingArguments: function getSlotTargetingArguments(slotId) {
+    var propValue = this.getSlotProperty(slotId, 'targetingArguments');
+    return propValue ? _objectSpread({}, propValue) : null;
+  },
+  getSlotAdSenseAttributes: function getSlotAdSenseAttributes(slotId) {
+    var propValue = this.getSlotProperty(slotId, 'adSenseAttributes');
+    return propValue ? _objectSpread({}, propValue) : null;
+  },
+  init: function init() {
+    var _this = this;
+
+    if (managerAlreadyInitialized === false) {
+      managerAlreadyInitialized = true;
+      this.getGoogletag().then(function (googletag) {
+        googletag.cmd.push(function () {
+          var pubadsService = googletag.pubads();
+          pubadsService.addEventListener('slotRenderEnded', function (event) {
+            var slotId = event.slot.getSlotElementId();
+
+            _this.emit('slotRenderEnded', {
+              slotId: slotId,
+              event: event
+            });
+          });
+          pubadsService.addEventListener('impressionViewable', function (event) {
+            var slotId = event.slot.getSlotElementId();
+
+            _this.emit('impressionViewable', {
+              slotId: slotId,
+              event: event
+            });
+          });
+          pubadsService.addEventListener('slotVisibilityChanged', function (event) {
+            var slotId = event.slot.getSlotElementId();
+
+            _this.emit('slotVisibilityChanged', {
+              slotId: slotId,
+              event: event
+            });
+          });
+          pubadsService.setRequestNonPersonalizedAds(_this.personalizedAdsEnabled() ? 0 : 1);
+        });
+      });
+    }
+  },
+  getGoogletag: function getGoogletag() {
+    if (googleGPTScriptLoadPromise === null) {
+      googleGPTScriptLoadPromise = Utils.loadGPTScript();
+    }
+
+    return googleGPTScriptLoadPromise;
+  },
+  setCollapseEmptyDivs: function setCollapseEmptyDivs(collapse) {
+    this.collapseEmptyDivs = collapse;
+  },
+  load: function load() {
+    var _this2 = this;
+
+    for (var _len = arguments.length, slots = new Array(_len), _key = 0; _key < _len; _key++) {
+      slots[_key] = arguments[_key];
+    }
+
+    if (loadPromise === null) {
+      loadPromise = this.doLoad.apply(this, slots);
+    } else {
+      loadPromise = loadPromise.then(function () {
+        return _this2.doLoad.apply(_this2, slots);
+      });
+    }
+  },
+  doLoad: function doLoad() {
+    this.init();
+    var availableSlots = {};
+
+    for (var _len2 = arguments.length, slots = new Array(_len2), _key2 = 0; _key2 < _len2; _key2++) {
+      slots[_key2] = arguments[_key2];
+    }
+
+    if (slots.length > 0) {
+      availableSlots = slots.filter(function (slotId) {
+        return Object.prototype.hasOwnProperty.call(registeredSlots, slotId);
+      });
+    } else {
+      availableSlots = Object.keys(registeredSlots);
+    }
+
+    availableSlots = availableSlots.filter(function (id) {
+      return !registeredSlots[id].loading && !registeredSlots[id].gptSlot;
+    });
+    availableSlots.forEach(function (slotId) {
+      registeredSlots[slotId].loading = true;
+    });
+    return this.gptLoadAds(availableSlots);
+  },
+  gptLoadAds: function gptLoadAds(slotsToInitialize) {
+    var _this3 = this;
+
+    return new Promise(function (resolve) {
+      _this3.getGoogletag().then(function (googletag) {
+        slotsToInitialize.forEach(function (currentSlotId) {
+          registeredSlots[currentSlotId].loading = false;
+          googletag.cmd.push(function () {
+            var slot = registeredSlots[currentSlotId];
+            var gptSlot;
+            var adUnit = "".concat(slot.dfpNetworkId, "/").concat(slot.adUnit);
+
+            if (slot.renderOutOfThePage === true) {
+              gptSlot = googletag.defineOutOfPageSlot(adUnit, currentSlotId);
+            } else {
+              gptSlot = googletag.defineSlot(adUnit, slot.sizes, currentSlotId);
+            }
+
+            if (gptSlot !== null) {
+              slot.gptSlot = gptSlot;
+
+              var slotTargetingArguments = _this3.getSlotTargetingArguments(currentSlotId);
+
+              if (slotTargetingArguments !== null) {
+                Object.keys(slotTargetingArguments).forEach(function (varName) {
+                  if (slot && slot.gptSlot) {
+                    slot.gptSlot.setTargeting(varName, slotTargetingArguments[varName]);
+                  }
+                });
+              }
+
+              var slotAdSenseAttributes = _this3.getSlotAdSenseAttributes(currentSlotId);
+
+              if (slotAdSenseAttributes !== null) {
+                Object.keys(slotAdSenseAttributes).forEach(function (varName) {
+                  slot.gptSlot.set(varName, slotAdSenseAttributes[varName]);
+                });
+              }
+
+              slot.gptSlot.addService(googletag.pubads());
+
+              if (slot.sizeMapping) {
+                var smbuilder = googletag.sizeMapping();
+                slot.sizeMapping.forEach(function (mapping) {
+                  smbuilder = smbuilder.addSize(mapping.viewport, mapping.sizes);
+                });
+                slot.gptSlot.defineSizeMapping(smbuilder.build());
+              }
+            }
+          });
+        });
+
+        _this3.configureOptions(googletag);
+
+        googletag.cmd.push(function () {
+          googletag.enableServices();
+
+          if (!_this3.disableInitialLoadIsEnabled()) {
+            slotsToInitialize.forEach(function (theSlotId) {
+              googletag.display(theSlotId);
+            });
+          }
+
+          resolve();
+        });
+      });
+    });
+  },
+  configureOptions: function configureOptions(googletag) {
+    var _this4 = this;
+
+    googletag.cmd.push(function () {
+      var pubadsService = googletag.pubads();
+      pubadsService.setRequestNonPersonalizedAds(_this4.personalizedAdsEnabled() ? 0 : 1);
+
+      var targetingArguments = _this4.getTargetingArguments(); // set global targetting arguments
+
+
+      Object.keys(targetingArguments).forEach(function (varName) {
+        if (pubadsService) {
+          pubadsService.setTargeting(varName, targetingArguments[varName]);
+        }
+      }); // set global adSense attributes
+
+      var adSenseAttributes = _this4.getAdSenseAttributes();
+
+      Object.keys(adSenseAttributes).forEach(function (key) {
+        pubadsService.set(key, adSenseAttributes[key]);
+      });
+
+      if (_this4.lazyLoadIsEnabled()) {
+        var args = [];
+
+        var config = _this4.getLazyLoadConfig();
+
+        if (config !== null) {
+          args.push(config);
+        }
+
+        pubadsService.enableLazyLoad.call(args);
+      }
+
+      if (_this4.singleRequestIsEnabled()) {
+        pubadsService.enableSingleRequest();
+      }
+
+      if (_this4.disableInitialLoadIsEnabled()) {
+        pubadsService.disableInitialLoad();
+      }
+
+      if (_this4.collapseEmptyDivs === true || _this4.collapseEmptyDivs === false) {
+        pubadsService.collapseEmptyDivs(_this4.collapseEmptyDivs);
+      }
+    });
+  },
+  getRefreshableSlots: function getRefreshableSlots() {
+    var slots = {};
+
+    for (var _len3 = arguments.length, slotsArray = new Array(_len3), _key3 = 0; _key3 < _len3; _key3++) {
+      slotsArray[_key3] = arguments[_key3];
+    }
+
+    if (slotsArray.length === 0) {
+      var slotsToRefresh = Object.keys(registeredSlots).map(function (k) {
+        return registeredSlots[k];
+      });
+      return slotsToRefresh.reduce(function (last, slot) {
+        if (slot.slotShouldRefresh() === true) {
+          slots[slot.slotId] = slot;
+        }
+
+        return slots;
+      }, slots);
+    }
+
+    return slotsArray.reduce(function (last, slotId) {
+      var slot = registeredSlots[slotId];
+
+      if (typeof slot !== 'undefined') {
+        slots[slotId] = slot;
+      }
+
+      return slots;
+    }, slots);
+  },
+  refresh: function refresh() {
+    if (loadPromise === null) {
+      this.load();
+    } else {
+      this.gptRefreshAds(Object.keys(this.getRefreshableSlots.apply(this, arguments)));
+    }
+  },
+  gptRefreshAds: function gptRefreshAds(slots) {
+    var _this5 = this;
+
+    return this.getGoogletag().then(function (googletag) {
+      _this5.configureOptions(googletag);
+
+      googletag.cmd.push(function () {
+        var pubadsService = googletag.pubads();
+        pubadsService.refresh(slots.map(function (slotId) {
+          return registeredSlots[slotId].gptSlot;
+        }));
+      });
+    });
+  },
+  reload: function reload() {
+    var _this6 = this;
+
+    return this.destroyGPTSlots.apply(this, arguments).then(function () {
+      return _this6.load();
+    });
+  },
+  destroyGPTSlots: function destroyGPTSlots() {
+    var _this7 = this;
+
+    for (var _len4 = arguments.length, slotsToDestroy = new Array(_len4), _key4 = 0; _key4 < _len4; _key4++) {
+      slotsToDestroy[_key4] = arguments[_key4];
+    }
+
+    if (slotsToDestroy.length === 0) {
+      // eslint-disable-next-line no-param-reassign
+      slotsToDestroy = Object.keys(registeredSlots);
+    }
+
+    return new Promise(function (resolve) {
+      var slots = []; // eslint-disable-next-line guard-for-in,no-restricted-syntax
+
+      for (var idx in slotsToDestroy) {
+        var slotId = slotsToDestroy[idx];
+        var slot = registeredSlots[slotId];
+        slots.push(slot);
+      }
+
+      _this7.getGoogletag().then(function (googletag) {
+        googletag.cmd.push(function () {
+          if (managerAlreadyInitialized === true) {
+            if (slotsToDestroy.length > 0) {
+              // eslint-disable-next-line guard-for-in,no-restricted-syntax
+              for (var _idx in slots) {
+                var _slot = slots[_idx];
+                slots.push(_slot.gptSlot);
+                delete _slot.gptSlot;
+              }
+
+              googletag.destroySlots(slots);
+            } else {
+              googletag.destroySlots();
+            }
+          }
+
+          resolve(slotsToDestroy);
+        });
+      });
+    });
+  },
+  registerSlot: function registerSlot(_ref) {
+    var _this8 = this;
+
+    var slotId = _ref.slotId,
+        dfpNetworkId = _ref.dfpNetworkId,
+        adUnit = _ref.adUnit,
+        sizes = _ref.sizes,
+        renderOutOfThePage = _ref.renderOutOfThePage,
+        sizeMapping = _ref.sizeMapping,
+        adSenseAttributes = _ref.adSenseAttributes,
+        targetingArguments = _ref.targetingArguments,
+        slotShouldRefresh = _ref.slotShouldRefresh;
+    var autoLoad = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : true;
+
+    if (!Object.prototype.hasOwnProperty.call(registeredSlots, slotId)) {
+      registeredSlots[slotId] = {
+        slotId: slotId,
+        sizes: sizes,
+        renderOutOfThePage: renderOutOfThePage,
+        dfpNetworkId: dfpNetworkId,
+        adUnit: adUnit,
+        adSenseAttributes: adSenseAttributes,
+        targetingArguments: targetingArguments,
+        sizeMapping: sizeMapping,
+        slotShouldRefresh: slotShouldRefresh,
+        loading: false
+      };
+      this.emit('slotRegistered', {
+        slotId: slotId
+      });
+
+      if (autoLoad === true && loadPromise !== null) {
+        loadPromise = loadPromise.catch().then(function () {
+          var slot = registeredSlots[slotId];
+
+          if (typeof slot !== 'undefined') {
+            var loading = slot.loading,
+                gptSlot = slot.gptSlot;
+
+            if (loading === false && !gptSlot) {
+              _this8.load(slotId);
+            }
+          }
+        });
+      }
+    }
+  },
+  unregisterSlot: function unregisterSlot(_ref2) {
+    var slotId = _ref2.slotId;
+    this.destroyGPTSlots(slotId);
+    delete registeredSlots[slotId];
+  },
+  getRegisteredSlots: function getRegisteredSlots() {
+    return registeredSlots;
+  },
+  attachSlotRenderEnded: function attachSlotRenderEnded(cb) {
+    this.on('slotRenderEnded', cb);
+  },
+  detachSlotRenderEnded: function detachSlotRenderEnded(cb) {
+    this.removeListener('slotRenderEnded', cb);
+  },
+  attachSlotVisibilityChanged: function attachSlotVisibilityChanged(cb) {
+    this.on('slotVisibilityChanged', cb);
+  },
+  detachSlotVisibilityChanged: function detachSlotVisibilityChanged(cb) {
+    this.removeListener('slotVisibilityChanged', cb);
+  },
+  attachSlotIsViewable: function attachSlotIsViewable(cb) {
+    this.on('impressionViewable', cb);
+  },
+  detachSlotIsViewable: function detachSlotIsViewable(cb) {
+    this.removeListener('impressionViewable', cb);
+  }
+});
+var _default = DFPManager;
+exports.default = _default;
+});
+
+unwrapExports(manager);
+
+var dfpslotsprovider = createCommonjsModule(function (module, exports) {
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.Context = void 0;
+
+var _react = _interopRequireDefault(React__default);
+
+var _propTypes = _interopRequireDefault(PropTypes);
+
+var _manager = _interopRequireDefault(manager);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+// React.createContext is undefined for React < 16.3
+var Context = _react.default.createContext ? _react.default.createContext({
+  dfpNetworkId: null,
+  dfpAdUnit: null,
+  dfpSizeMapping: null,
+  dfpTargetingArguments: null,
+  newSlotCallback: null
+}) : null;
+exports.Context = Context;
+
+var DFPSlotsProvider =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits(DFPSlotsProvider, _React$Component);
+
+  function DFPSlotsProvider(props) {
+    var _this;
+
+    _classCallCheck(this, DFPSlotsProvider);
+
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(DFPSlotsProvider).call(this, props));
+    _this.loadAdsIfPossible = _this.loadAdsIfPossible.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.newSlotCallback = _this.newSlotCallback.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.applyConfigs = _this.applyConfigs.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.shouldReloadConfig = _this.shouldReloadConfig.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.attachLoadCallback = _this.attachLoadCallback.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.getContextValue = _this.getContextValue.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.loadAlreadyCalled = false;
+    _this.loadCallbackAttached = false;
+    _this.shouldReloadAds = false;
+    _this.totalSlots = 0;
+    _this.contextValue = {};
+
+    if (Context === null) {
+      _this.getChildContext = function () {
+        return _this.getContextValue();
+      };
+    }
+
+    return _this;
+  }
+
+  _createClass(DFPSlotsProvider, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      this.applyConfigs();
+
+      if (this.props.autoLoad && !this.loadAdsIfPossible()) {
+        this.attachLoadCallback();
+      }
+    }
+  }, {
+    key: "shouldComponentUpdate",
+    value: function shouldComponentUpdate(nextProps) {
+      this.shouldReloadAds = this.shouldReloadConfig(nextProps);
+
+      if (nextProps.children !== this.props.children) {
+        return true;
+      }
+
+      if (nextProps.autoLoad && !this.props.autoLoad) {
+        return true;
+      }
+
+      return this.shouldReloadAds;
+    }
+  }, {
+    key: "componentDidUpdate",
+    value: function componentDidUpdate() {
+      this.applyConfigs();
+
+      if (this.props.autoLoad) {
+        if (this.loadAlreadyCalled) {
+          if (this.shouldReloadAds) {
+            _manager.default.reload();
+          }
+        } else if (!this.loadAdsIfPossible()) {
+          this.attachLoadCallback();
+        }
+      }
+
+      this.shouldReloadAds = false;
+    }
+  }, {
+    key: "getContextValue",
+    value: function getContextValue() {
+      var _this$props = this.props,
+          dfpNetworkId = _this$props.dfpNetworkId,
+          dfpAdUnit = _this$props.adUnit,
+          dfpSizeMapping = _this$props.sizeMapping,
+          dfpTargetingArguments = _this$props.targetingArguments,
+          _this$contextValue = this.contextValue,
+          ctxDfpNetworkId = _this$contextValue.dfpNetworkId,
+          ctxDfpAdUnit = _this$contextValue.adUnit,
+          ctxDfpSizeMapping = _this$contextValue.sizeMapping,
+          ctxDfpTargetingArguments = _this$contextValue.targetingArguments; // performance: update context value object only when any of its
+      // props is updated.
+
+      if (dfpNetworkId !== ctxDfpNetworkId || dfpAdUnit !== ctxDfpAdUnit || dfpSizeMapping !== ctxDfpSizeMapping || dfpTargetingArguments !== ctxDfpTargetingArguments) {
+        this.contextValue = {
+          dfpNetworkId: dfpNetworkId,
+          dfpAdUnit: dfpAdUnit,
+          dfpSizeMapping: dfpSizeMapping,
+          dfpTargetingArguments: dfpTargetingArguments,
+          newSlotCallback: this.newSlotCallback
+        };
+      }
+
+      return this.contextValue;
+    }
+  }, {
+    key: "applyConfigs",
+    value: function applyConfigs() {
+      _manager.default.configurePersonalizedAds(this.props.personalizedAds);
+
+      _manager.default.configureSingleRequest(this.props.singleRequest);
+
+      _manager.default.configureDisableInitialLoad(this.props.disableInitialLoad);
+
+      _manager.default.configureLazyLoad(!!this.props.lazyLoad, typeof this.props.lazyLoad === 'boolean' ? null : this.props.lazyLoad);
+
+      _manager.default.setAdSenseAttributes(this.props.adSenseAttributes);
+
+      _manager.default.setCollapseEmptyDivs(this.props.collapseEmptyDivs);
+    }
+  }, {
+    key: "attachLoadCallback",
+    value: function attachLoadCallback() {
+      if (this.loadCallbackAttached === false) {
+        _manager.default.on('slotRegistered', this.loadAdsIfPossible);
+
+        this.loadCallbackAttached = true;
+        return true;
+      }
+
+      return false;
+    } // pretty strait-forward interface that children ad slots use to register
+    // with their DFPSlotProvider parent node.
+
+  }, {
+    key: "newSlotCallback",
+    value: function newSlotCallback() {
+      this.totalSlots++;
+    } // Checks all the mounted children ads have been already registered
+    // in the DFPManager before trying to call the gpt load scripts.
+    // This is helpful when trying to fetch ads with a single request.
+
+  }, {
+    key: "loadAdsIfPossible",
+    value: function loadAdsIfPossible() {
+      var r = false;
+
+      if (Object.keys(_manager.default.getRegisteredSlots()).length >= this.totalSlots) {
+        _manager.default.removeListener('slotRegistered', this.loadAdsIfPossible);
+
+        _manager.default.load();
+
+        this.loadAlreadyCalled = true;
+        this.loadCallbackAttached = false;
+        r = true;
+      }
+
+      return r;
+    }
+  }, {
+    key: "shouldReloadConfig",
+    value: function shouldReloadConfig(nextProps) {
+      var reloadConfig = nextProps.autoReload || this.props.autoReload;
+
+      if (this.props.autoLoad || nextProps.autoLoad) {
+        if (_typeof(reloadConfig) === 'object') {
+          var attrs = Object.keys(reloadConfig); // eslint-disable-next-line guard-for-in, no-restricted-syntax
+
+          for (var i in attrs) {
+            var propName = attrs[i]; // eslint-disable-next-line
+
+            if (reloadConfig[propName] === true && this.props[propName] !== nextProps[propName]) {
+              return true;
+            }
+          }
+        }
+      }
+
+      return false;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var children = this.props.children;
+
+      if (Context === null) {
+        return children;
+      }
+
+      return _react.default.createElement(Context.Provider, {
+        value: this.getContextValue()
+      }, children);
+    }
+  }]);
+
+  return DFPSlotsProvider;
+}(_react.default.Component);
+
+exports.default = DFPSlotsProvider;
+
+_defineProperty(DFPSlotsProvider, "propTypes", {
+  children: _propTypes.default.oneOfType([_propTypes.default.element, _propTypes.default.array]).isRequired,
+  autoLoad: _propTypes.default.bool,
+  autoReload: _propTypes.default.shape({
+    dfpNetworkId: _propTypes.default.bool,
+    personalizedAds: _propTypes.default.bool,
+    singleRequest: _propTypes.default.bool,
+    disableInitialLoad: _propTypes.default.bool,
+    adUnit: _propTypes.default.bool,
+    sizeMapping: _propTypes.default.bool,
+    adSenseAttributes: _propTypes.default.bool,
+    targetingArguments: _propTypes.default.bool,
+    collapseEmptyDivs: _propTypes.default.bool,
+    lazyLoad: _propTypes.default.bool
+  }),
+  dfpNetworkId: _propTypes.default.string.isRequired,
+  personalizedAds: _propTypes.default.bool,
+  singleRequest: _propTypes.default.bool,
+  disableInitialLoad: _propTypes.default.bool,
+  adUnit: _propTypes.default.string,
+  sizeMapping: _propTypes.default.arrayOf(_propTypes.default.object),
+  adSenseAttributes: _propTypes.default.object,
+  targetingArguments: _propTypes.default.object,
+  collapseEmptyDivs: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.object]),
+  adSenseAttrs: _propTypes.default.object,
+  lazyLoad: _propTypes.default.oneOfType([_propTypes.default.bool, _propTypes.default.shape({
+    fetchMarginPercent: _propTypes.default.number,
+    renderMarginPercent: _propTypes.default.number,
+    mobileScaling: _propTypes.default.number
+  })])
+});
+
+_defineProperty(DFPSlotsProvider, "defaultProps", {
+  autoLoad: true,
+  autoReload: {
+    dfpNetworkId: false,
+    personalizedAds: false,
+    singleRequest: false,
+    disableInitialLoad: false,
+    adUnit: false,
+    sizeMapping: false,
+    adSenseAttributes: false,
+    targetingArguments: false,
+    collapseEmptyDivs: false,
+    lazyLoad: false
+  },
+  personalizedAds: true,
+  singleRequest: true,
+  disableInitialLoad: false,
+  collapseEmptyDivs: null,
+  lazyLoad: false
+});
+
+if (Context === null) {
+  // React < 16.3
+  DFPSlotsProvider.childContextTypes = {
+    dfpNetworkId: _propTypes.default.string,
+    dfpAdUnit: _propTypes.default.string,
+    dfpSizeMapping: _propTypes.default.arrayOf(_propTypes.default.object),
+    dfpTargetingArguments: _propTypes.default.object,
+    newSlotCallback: _propTypes.default.func
+  };
+}
+});
+
+unwrapExports(dfpslotsprovider);
+var dfpslotsprovider_1 = dfpslotsprovider.Context;
+
+var adslot = createCommonjsModule(function (module, exports) {
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.default = exports.AdSlot = void 0;
+
+var _react = _interopRequireDefault(React__default);
+
+var _propTypes = _interopRequireDefault(PropTypes);
+
+var _manager = _interopRequireDefault(manager);
+
+
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+function _typeof(obj) { if (typeof Symbol === "function" && typeof Symbol.iterator === "symbol") { _typeof = function _typeof(obj) { return typeof obj; }; } else { _typeof = function _typeof(obj) { return obj && typeof Symbol === "function" && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }; } return _typeof(obj); }
+
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; var ownKeys = Object.keys(source); if (typeof Object.getOwnPropertySymbols === 'function') { ownKeys = ownKeys.concat(Object.getOwnPropertySymbols(source).filter(function (sym) { return Object.getOwnPropertyDescriptor(source, sym).enumerable; })); } ownKeys.forEach(function (key) { _defineProperty(target, key, source[key]); }); } return target; }
+
+function _classCallCheck(instance, Constructor) { if (!(instance instanceof Constructor)) { throw new TypeError("Cannot call a class as a function"); } }
+
+function _defineProperties(target, props) { for (var i = 0; i < props.length; i++) { var descriptor = props[i]; descriptor.enumerable = descriptor.enumerable || false; descriptor.configurable = true; if ("value" in descriptor) descriptor.writable = true; Object.defineProperty(target, descriptor.key, descriptor); } }
+
+function _createClass(Constructor, protoProps, staticProps) { if (protoProps) _defineProperties(Constructor.prototype, protoProps); if (staticProps) _defineProperties(Constructor, staticProps); return Constructor; }
+
+function _possibleConstructorReturn(self, call) { if (call && (_typeof(call) === "object" || typeof call === "function")) { return call; } return _assertThisInitialized(self); }
+
+function _getPrototypeOf(o) { _getPrototypeOf = Object.setPrototypeOf ? Object.getPrototypeOf : function _getPrototypeOf(o) { return o.__proto__ || Object.getPrototypeOf(o); }; return _getPrototypeOf(o); }
+
+function _inherits(subClass, superClass) { if (typeof superClass !== "function" && superClass !== null) { throw new TypeError("Super expression must either be null or a function"); } subClass.prototype = Object.create(superClass && superClass.prototype, { constructor: { value: subClass, writable: true, configurable: true } }); if (superClass) _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
+function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+
+function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+
+var dynamicAdCount = 0;
+
+var AdSlot =
+/*#__PURE__*/
+function (_React$Component) {
+  _inherits(AdSlot, _React$Component);
+
+  function AdSlot(props) {
+    var _this;
+
+    _classCallCheck(this, AdSlot);
+
+    _this = _possibleConstructorReturn(this, _getPrototypeOf(AdSlot).call(this, props));
+    _this.doRegisterSlot = _this.doRegisterSlot.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.generateSlotId = _this.generateSlotId.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.getSlotId = _this.getSlotId.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.mapContextToAdSlotProps = _this.mapContextToAdSlotProps.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.slotShouldRefresh = _this.slotShouldRefresh.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.slotRenderEnded = _this.slotRenderEnded.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.slotRegisterCallback = _this.slotRegisterCallback.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.slotIsViewable = _this.slotIsViewable.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.slotVisibilityChanged = _this.slotVisibilityChanged.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.getClasses = _this.getClasses.bind(_assertThisInitialized(_assertThisInitialized(_this)));
+    _this.state = {
+      slotId: _this.props.slotId || null,
+      className: _this.props.className || ''
+    };
+    _this.adElementRef = _react.default.createRef ? _react.default.createRef() : function (element) {
+      _this.adElementRef = element;
+    };
+    return _this;
+  }
+
+  _createClass(AdSlot, [{
+    key: "componentDidMount",
+    value: function componentDidMount() {
+      // register this ad-unit in the <DFPSlotProvider>, when available.
+      if (this.context !== undefined && this.context.newSlotCallback) {
+        this.context.newSlotCallback();
+      }
+
+      this.registerSlot();
+    }
+  }, {
+    key: "componentWillUnmount",
+    value: function componentWillUnmount() {
+      this.unregisterSlot();
+    }
+  }, {
+    key: "getSlotId",
+    value: function getSlotId() {
+      return this.props.slotId || this.state.slotId;
+    }
+  }, {
+    key: "getClasses",
+    value: function getClasses() {
+      var baseClass = 'adunitContainer';
+      var extraClasses = this.state.className.split(' ');
+      extraClasses.push(baseClass);
+      return extraClasses;
+    }
+  }, {
+    key: "generateSlotId",
+    value: function generateSlotId() {
+      return "adSlot-".concat(dynamicAdCount++);
+    }
+  }, {
+    key: "mapContextToAdSlotProps",
+    value: function mapContextToAdSlotProps() {
+      var context = this.context;
+      var mappedProps = {};
+
+      if (context.dfpNetworkId !== undefined) {
+        mappedProps.dfpNetworkId = context.dfpNetworkId;
+      }
+
+      if (context.dfpAdUnit !== undefined) {
+        mappedProps.adUnit = context.dfpAdUnit;
+      }
+
+      if (context.dfpSizeMapping !== undefined) {
+        mappedProps.sizeMapping = context.dfpSizeMapping;
+      }
+
+      if (context.dfpTargetingArguments !== undefined) {
+        mappedProps.targetingArguments = context.dfpTargetingArguments;
+      }
+
+      return mappedProps;
+    }
+  }, {
+    key: "doRegisterSlot",
+    value: function doRegisterSlot() {
+      _manager.default.registerSlot(_objectSpread({}, this.mapContextToAdSlotProps(), this.props, this.state, {
+        slotShouldRefresh: this.slotShouldRefresh
+      }));
+
+      if (this.props.fetchNow === true) {
+        _manager.default.load(this.getSlotId());
+      }
+
+      _manager.default.attachSlotRenderEnded(this.slotRenderEnded);
+
+      _manager.default.attachSlotIsViewable(this.slotIsViewable);
+
+      _manager.default.attachSlotVisibilityChanged(this.slotVisibilityChanged);
+
+      this.slotRegisterCallback();
+    }
+  }, {
+    key: "registerSlot",
+    value: function registerSlot() {
+      if (this.state.slotId === null) {
+        this.setState({
+          slotId: this.generateSlotId()
+        }, this.doRegisterSlot);
+      } else {
+        this.doRegisterSlot();
+      }
+    }
+  }, {
+    key: "unregisterSlot",
+    value: function unregisterSlot() {
+      _manager.default.unregisterSlot(_objectSpread({}, this.mapContextToAdSlotProps(), this.props, this.state));
+
+      _manager.default.detachSlotRenderEnded(this.slotRenderEnded);
+
+      _manager.default.detachSlotIsViewable(this.slotIsViewable);
+
+      _manager.default.detachSlotVisibilityChanged(this.slotVisibilityChanged);
+    }
+  }, {
+    key: "slotRenderEnded",
+    value: function slotRenderEnded(eventData) {
+      if (eventData.slotId === this.getSlotId()) {
+        if (this.props.onSlotRender !== undefined) {
+          // now that slot has rendered we have access to the ref
+          var params = _objectSpread({}, eventData, {
+            adElementRef: this.adElementRef
+          });
+
+          this.props.onSlotRender(params);
+        }
+      }
+    }
+  }, {
+    key: "slotRegisterCallback",
+    value: function slotRegisterCallback() {
+      if (typeof this.props.onSlotRegister === 'function') {
+        this.props.onSlotRegister({
+          slotId: this.getSlotId(),
+          sizes: this.props.sizes,
+          slotCount: dynamicAdCount,
+          adElementRef: this.adElementRef
+        });
+      }
+    }
+  }, {
+    key: "slotIsViewable",
+    value: function slotIsViewable(eventData) {
+      if (eventData.slotId === this.getSlotId()) {
+        if (this.props.onSlotIsViewable !== undefined) {
+          this.props.onSlotIsViewable(eventData);
+        }
+      }
+    }
+  }, {
+    key: "slotVisibilityChanged",
+    value: function slotVisibilityChanged(eventData) {
+      if (eventData.slotId === this.getSlotId()) {
+        if (this.props.onSlotVisibilityChanged !== undefined) {
+          this.props.onSlotVisibilityChanged(eventData);
+        }
+      }
+    }
+  }, {
+    key: "slotShouldRefresh",
+    value: function slotShouldRefresh() {
+      var r = true;
+
+      if (this.props.shouldRefresh !== undefined) {
+        r = this.props.shouldRefresh(_objectSpread({}, this.mapContextToAdSlotProps(), this.props, {
+          slotId: this.getSlotId()
+        }));
+      }
+
+      return r;
+    }
+  }, {
+    key: "render",
+    value: function render() {
+      var slotId = this.state.slotId;
+      var props = {
+        className: 'adBox'
+      };
+
+      if (slotId !== null) {
+        props.id = slotId;
+      }
+
+      return _react.default.createElement("div", {
+        className: this.getClasses().join(' ').trim()
+      }, _react.default.createElement("div", _extends({
+        ref: this.adElementRef
+      }, props)));
+    }
+  }]);
+
+  return AdSlot;
+}(_react.default.Component);
+
+exports.AdSlot = AdSlot;
+
+_defineProperty(AdSlot, "propTypes", {
+  dfpNetworkId: _propTypes.default.string,
+  adUnit: _propTypes.default.string,
+  sizes: _propTypes.default.arrayOf(_propTypes.default.oneOfType([_propTypes.default.arrayOf(_propTypes.default.number), _propTypes.default.string])),
+  renderOutOfThePage: _propTypes.default.bool,
+  sizeMapping: _propTypes.default.arrayOf(_propTypes.default.object),
+  fetchNow: _propTypes.default.bool,
+  adSenseAttributes: _propTypes.default.object,
+  targetingArguments: _propTypes.default.object,
+  onSlotRender: _propTypes.default.func,
+  onSlotRegister: _propTypes.default.func,
+  onSlotIsViewable: _propTypes.default.func,
+  onSlotVisibilityChanged: _propTypes.default.func,
+  shouldRefresh: _propTypes.default.func,
+  slotId: _propTypes.default.string,
+  className: _propTypes.default.string
+});
+
+_defineProperty(AdSlot, "defaultProps", {
+  fetchNow: false
+});
+
+if (dfpslotsprovider.Context === null) {
+  // React < 16.3
+  AdSlot.contextTypes = {
+    dfpNetworkId: _propTypes.default.string,
+    dfpAdUnit: _propTypes.default.string,
+    dfpSizeMapping: _propTypes.default.arrayOf(_propTypes.default.object),
+    dfpTargetingArguments: _propTypes.default.object,
+    newSlotCallback: _propTypes.default.func
+  };
+} else {
+  AdSlot.contextType = dfpslotsprovider.Context;
+}
+
+var _default = AdSlot;
+exports.default = _default;
+});
+
+unwrapExports(adslot);
+var adslot_1 = adslot.AdSlot;
+
+var lib = createCommonjsModule(function (module, exports) {
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.DFPSlotsProvider = exports.AdSlot = exports.DFPManager = void 0;
+
+var _manager = _interopRequireDefault(manager);
+
+var _adslot = _interopRequireDefault(adslot);
+
+var _dfpslotsprovider = _interopRequireDefault(dfpslotsprovider);
+
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+
+var DFPManager = _manager.default;
+exports.DFPManager = DFPManager;
+var AdSlot = _adslot.default;
+exports.AdSlot = AdSlot;
+var DFPSlotsProvider = _dfpslotsprovider.default;
+exports.DFPSlotsProvider = DFPSlotsProvider;
+});
+
+unwrapExports(lib);
+var lib_1 = lib.DFPSlotsProvider;
+var lib_2 = lib.AdSlot;
+var lib_3 = lib.DFPManager;
+
+var AD728x90 = function (_Component) {
+  inherits(AD728x90, _Component);
+
+  function AD728x90(props) {
+    classCallCheck(this, AD728x90);
+
+    var _this = possibleConstructorReturn(this, (AD728x90.__proto__ || Object.getPrototypeOf(AD728x90)).call(this, props));
+
+    _this.option = {
+      networkID: props.networkID,
+      adUnit: props.adUnit
+    };
+    return _this;
+  }
+
+  createClass(AD728x90, [{
+    key: 'render',
+    value: function render() {
+      return React__default.createElement(
+        lib_1,
+        {
+          dfpNetworkId: this.option.networkID,
+          sizeMapping: [{ viewport: [768, 1], sizes: [[728, 90]] }, { viewport: [1, 1], sizes: [[320, 50]] }] },
+        React__default.createElement(
+          'div',
+          { className: 'AD728x90' },
+          React__default.createElement(lib_2, {
+            slotId: 'test',
+            sizes: [[728, 90], [320, 50]],
+            adUnit: this.option.adUnit,
+            sizeMapping: [{ viewport: [768, 1], sizes: [[728, 90]] }, { viewport: [1, 1], sizes: [[320, 50]] }],
+            onSlotVisibilityChanged: function onSlotVisibilityChanged(dfpEventData) {
+              if (dfpEventData.event.inViewPercentage < '70') {
+                lib_3.refresh('test');
+              }
+            },
+            onSlotIsViewable: function onSlotIsViewable(dfpEventData) {
+              return console.log('slot 1 viewable!.', dfpEventData);
+            }
+          })
+        )
+      );
+    }
+  }]);
+  return AD728x90;
+}(React.Component);
+
+// Main
+var Normal$1 = function Normal$$1(props) {
+  var config = props.config,
+      title = props.title,
+      keywords = props.keywords,
+      description = props.description,
+      website = props.website;
+
+
+  function navigation() {
+    switch (config.navComponent) {
+      case 'normal':
+        return React__default.createElement(Normal, { logo: website.logo, dataObject: config.navItems });
+      case 'magazine':
+        return React__default.createElement(Magazine, { logo: website.logo, dataObject: config.navItems });
+      case 'native':
+        return React__default.createElement(Native, { logo: website.logo, dataObject: config.navItems });
+      default:
+        return React__default.createElement('noNav', null);
+    }
+  }
+
+  function layout() {
+    switch (config.columns) {
+      case '2':
+        return React__default.createElement(
+          Column2,
+          { rightItems: config.rightItems },
+          props.children
+        );
+      case '3':
+        return React__default.createElement(
+          Column3,
+          { leftItems: config.leftItems, rightItems: config.rightItems },
+          props.children
+        );
+      default:
+        return React__default.createElement('noLayout', null);
+    }
+  }
+
+  return React__default.createElement(
+    'section',
+    null,
+    React__default.createElement(Header, { title: title, keyword: keywords, description: description }),
+    navigation(),
+    React__default.createElement(
+      Container,
+      null,
+      React__default.createElement(AD728x90, { networkID: '20642765', adUnit: 'aesthetic_authority' })
+    ),
+    React__default.createElement(
+      Container,
+      null,
+      layout()
+    )
+  );
+};
+
+var AD300x250 = function (_Component) {
+  inherits(AD300x250, _Component);
+
+  function AD300x250(props) {
+    classCallCheck(this, AD300x250);
+
+    var _this = possibleConstructorReturn(this, (AD300x250.__proto__ || Object.getPrototypeOf(AD300x250)).call(this, props));
+
+    _this.option = {
+      networkID: props.networkID,
+      adUnit: props.adUnit
+    };
+    return _this;
+  }
+
+  createClass(AD300x250, [{
+    key: 'render',
+    value: function render() {
+      return React__default.createElement(
+        lib_1,
+        { dfpNetworkId: this.option.networkID },
+        React__default.createElement(
+          'div',
+          { className: 'AD300x250' },
+          React__default.createElement(lib_2, { sizes: [[300, 250]], adUnit: this.option.adUnit })
+        )
+      );
+    }
+  }]);
+  return AD300x250;
+}(React.Component);
+
+var AD300x250x600 = function (_Component) {
+  inherits(AD300x250x600, _Component);
+
+  function AD300x250x600(props) {
+    classCallCheck(this, AD300x250x600);
+
+    var _this = possibleConstructorReturn(this, (AD300x250x600.__proto__ || Object.getPrototypeOf(AD300x250x600)).call(this, props));
+
+    _this.option = {
+      networkID: props.networkID,
+      adUnit: props.adUnit
+    };
+    return _this;
+  }
+
+  createClass(AD300x250x600, [{
+    key: 'render',
+    value: function render() {
+      return React__default.createElement(
+        lib_1,
+        { dfpNetworkId: this.option.networkID },
+        React__default.createElement(
+          'div',
+          { className: 'AD300x250' },
+          React__default.createElement(lib_2, {
+            sizes: [[300, 250], [300, 600]],
+            adUnit: this.option.adUnit
+          })
+        )
+      );
+    }
+  }]);
+  return AD300x250x600;
+}(React.Component);
+
 exports.DeckContent = Content;
 exports.DeckQueue = Queue;
 exports.Column2 = Column2;
@@ -11247,4 +12598,8 @@ exports.LeftNav = LeftNav;
 exports.NavMagazine = Magazine;
 exports.NavNative = Native;
 exports.NavNormal = Normal;
+exports.TemplateNormal = Normal$1;
+exports.AD300x250 = AD300x250;
+exports.AD300x250x600 = AD300x250x600;
+exports.AD728x90 = AD728x90;
 //# sourceMappingURL=index.js.map