@guardian/commercial-core 4.8.0 → 4.10.0

package/dist/cjs/ad-sizes.js

@@ -21,7 +21,8 @@ exports.createAdSize = exports.slotSizeMappings = exports.getAdSize = exports.ad
 class AdSize extends Array {
     constructor([width, height]) {
         super();
-        this.push(width, height);
+        this[0] = width;
+        this[1] = height;
     }
     toString() {
         return this.width === 0 && this.height === 0

package/dist/cjs/event-timer.d.ts

@@ -32,6 +32,8 @@ interface EventTimerProperties {
     pageHeightVH?: number;
     gpcSignal?: number;
     lazyLoadMarginPercent?: number;
+    hasLabsContainer?: boolean;
+    labsUrl?: string;
 }
 export declare class EventTimer {
     private _events;
@@ -70,9 +72,9 @@ export declare class EventTimer {
      * Adds an event timer property
      *
      * @param {string} name - the property's name
-     * @param {value} number - the property's value
+     * @param value - the property's value
      */
-    setProperty(name: 'adSlotsInline' | 'adSlotsTotal' | 'pageHeightVH' | 'gpcSignal' | 'lazyLoadMarginPercent', value: number): void;
+    setProperty<T extends keyof EventTimerProperties>(name: T, value: EventTimerProperties[T]): void;
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'

package/dist/cjs/event-timer.js

@@ -112,7 +112,7 @@ class EventTimer {
      * Adds an event timer property
      *
      * @param {string} name - the property's name
-     * @param {value} number - the property's value
+     * @param value - the property's value
      */
     setProperty(name, value) {
         this.properties[name] = value;

package/dist/cjs/index.d.ts

@@ -14,6 +14,7 @@ export type { SizeKeys, AdSizeString, AdSize, SizeMapping, SlotSizeMappings, Slo
 export { isAdBlockInUse } from './detect-ad-blocker';
 export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
 export { initTrackScrollDepth } from './track-scroll-depth';
+export { initTrackLabsContainer } from './track-labs-container';
 export { initTrackGpcSignal } from './track-gpc-signal';
 export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
 export { createAdSlot, concatSizeMappings } from './create-ad-slot';

package/dist/cjs/index.js

@@ -24,7 +24,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
     return result;
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.pickTargetingValues = exports.getViewportTargeting = exports.getSharedTargeting = exports.getSessionTargeting = exports.getPersonalisedTargeting = exports.getContentTargeting = exports.constants = exports.concatSizeMappings = exports.createAdSlot = exports.disabledAds = exports.buildAdsConfigWithConsent = exports.initTrackGpcSignal = exports.initTrackScrollDepth = exports.getPermutivePFPSegments = exports.getPermutiveSegments = exports.clearPermutiveSegments = exports.isAdBlockInUse = exports.isBreakpoint = exports.createAdSize = exports.slotSizeMappings = exports.getAdSize = exports.adSizes = exports.initCommercialMetrics = exports.bypassCommercialMetricsSampling = exports.EventTimer = exports.remarketing = exports.inizio = exports.twitter = exports.fbPixel = exports.permutive = exports.ias = void 0;
+exports.pickTargetingValues = exports.getViewportTargeting = exports.getSharedTargeting = exports.getSessionTargeting = exports.getPersonalisedTargeting = exports.getContentTargeting = exports.constants = exports.concatSizeMappings = exports.createAdSlot = exports.disabledAds = exports.buildAdsConfigWithConsent = exports.initTrackGpcSignal = exports.initTrackLabsContainer = exports.initTrackScrollDepth = exports.getPermutivePFPSegments = exports.getPermutiveSegments = exports.clearPermutiveSegments = exports.isAdBlockInUse = exports.isBreakpoint = exports.createAdSize = exports.slotSizeMappings = exports.getAdSize = exports.adSizes = exports.initCommercialMetrics = exports.bypassCommercialMetricsSampling = exports.EventTimer = exports.remarketing = exports.inizio = exports.twitter = exports.fbPixel = exports.permutive = exports.ias = void 0;
 var ias_1 = require("./third-party-tags/ias");
 Object.defineProperty(exports, "ias", { enumerable: true, get: function () { return ias_1.ias; } });
 var permutive_1 = require("./third-party-tags/permutive");
@@ -57,6 +57,8 @@ Object.defineProperty(exports, "getPermutiveSegments", { enumerable: true, get:
 Object.defineProperty(exports, "getPermutivePFPSegments", { enumerable: true, get: function () { return permutive_2.getPermutivePFPSegments; } });
 var track_scroll_depth_1 = require("./track-scroll-depth");
 Object.defineProperty(exports, "initTrackScrollDepth", { enumerable: true, get: function () { return track_scroll_depth_1.initTrackScrollDepth; } });
+var track_labs_container_1 = require("./track-labs-container");
+Object.defineProperty(exports, "initTrackLabsContainer", { enumerable: true, get: function () { return track_labs_container_1.initTrackLabsContainer; } });
 var track_gpc_signal_1 = require("./track-gpc-signal");
 Object.defineProperty(exports, "initTrackGpcSignal", { enumerable: true, get: function () { return track_gpc_signal_1.initTrackGpcSignal; } });
 var ad_targeting_youtube_1 = require("./ad-targeting-youtube");

package/dist/cjs/track-labs-container.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Collect commercial metrics on:
+ * - whether the page contains a Guardian Labs container element (aka 'dumathoin'), and if so
+ * - when the element is scrolled into view
+ */
+declare const initTrackLabsContainer: () => void;
+export { initTrackLabsContainer };

package/dist/cjs/track-labs-container.js

@@ -0,0 +1,35 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.initTrackLabsContainer = void 0;
+const libs_1 = require("@guardian/libs");
+const event_timer_1 = require("./event-timer");
+/**
+ * Collect commercial metrics on:
+ * - whether the page contains a Guardian Labs container element (aka 'dumathoin'), and if so
+ * - when the element is scrolled into view
+ */
+const initTrackLabsContainer = () => {
+    const target = document.querySelector('section.dumathoin');
+    if (target === null)
+        return;
+    const labsUrl = document
+        .querySelector('h1.dumathoin__title a')
+        ?.getAttribute('href');
+    if (labsUrl === null)
+        return;
+    const eventTimer = event_timer_1.EventTimer.get();
+    (0, libs_1.log)('commercial', 'Page has labs container');
+    eventTimer.setProperty('hasLabsContainer', true);
+    eventTimer.setProperty('labsUrl', labsUrl);
+    const observer = new IntersectionObserver((entries) => {
+        entries.map((entry) => {
+            if (entry.isIntersecting) {
+                (0, libs_1.log)('commercial', 'Labs container in view');
+                eventTimer.trigger('labsContainerInView');
+                observer.unobserve(entry.target);
+            }
+        });
+    });
+    observer.observe(target);
+};
+exports.initTrackLabsContainer = initTrackLabsContainer;

package/dist/esm/ad-sizes.js

@@ -18,7 +18,8 @@
 class AdSize extends Array {
     constructor([width, height]) {
         super();
-        this.push(width, height);
+        this[0] = width;
+        this[1] = height;
     }
     toString() {
         return this.width === 0 && this.height === 0

package/dist/esm/event-timer.d.ts

@@ -32,6 +32,8 @@ interface EventTimerProperties {
     pageHeightVH?: number;
     gpcSignal?: number;
     lazyLoadMarginPercent?: number;
+    hasLabsContainer?: boolean;
+    labsUrl?: string;
 }
 export declare class EventTimer {
     private _events;
@@ -70,9 +72,9 @@ export declare class EventTimer {
      * Adds an event timer property
      *
      * @param {string} name - the property's name
-     * @param {value} number - the property's value
+     * @param value - the property's value
      */
-    setProperty(name: 'adSlotsInline' | 'adSlotsTotal' | 'pageHeightVH' | 'gpcSignal' | 'lazyLoadMarginPercent', value: number): void;
+    setProperty<T extends keyof EventTimerProperties>(name: T, value: EventTimerProperties[T]): void;
     /**
      * Creates a new performance mark
      * For slot events also ensures each TYPE of event event is marked only once for 'first'

package/dist/esm/event-timer.js

@@ -109,7 +109,7 @@ export class EventTimer {
      * Adds an event timer property
      *
      * @param {string} name - the property's name
-     * @param {value} number - the property's value
+     * @param value - the property's value
      */
     setProperty(name, value) {
         this.properties[name] = value;

package/dist/esm/index.d.ts

@@ -14,6 +14,7 @@ export type { SizeKeys, AdSizeString, AdSize, SizeMapping, SlotSizeMappings, Slo
 export { isAdBlockInUse } from './detect-ad-blocker';
 export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
 export { initTrackScrollDepth } from './track-scroll-depth';
+export { initTrackLabsContainer } from './track-labs-container';
 export { initTrackGpcSignal } from './track-gpc-signal';
 export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
 export { createAdSlot, concatSizeMappings } from './create-ad-slot';

package/dist/esm/index.js

@@ -12,6 +12,7 @@ export { isBreakpoint } from './lib/breakpoint';
 export { isAdBlockInUse } from './detect-ad-blocker';
 export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
 export { initTrackScrollDepth } from './track-scroll-depth';
+export { initTrackLabsContainer } from './track-labs-container';
 export { initTrackGpcSignal } from './track-gpc-signal';
 export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
 export { createAdSlot, concatSizeMappings } from './create-ad-slot';

package/dist/esm/track-labs-container.d.ts

@@ -0,0 +1,7 @@
+/**
+ * Collect commercial metrics on:
+ * - whether the page contains a Guardian Labs container element (aka 'dumathoin'), and if so
+ * - when the element is scrolled into view
+ */
+declare const initTrackLabsContainer: () => void;
+export { initTrackLabsContainer };

package/dist/esm/track-labs-container.js

@@ -0,0 +1,32 @@
+import { log } from '@guardian/libs';
+import { EventTimer } from './event-timer';
+/**
+ * Collect commercial metrics on:
+ * - whether the page contains a Guardian Labs container element (aka 'dumathoin'), and if so
+ * - when the element is scrolled into view
+ */
+const initTrackLabsContainer = () => {
+    const target = document.querySelector('section.dumathoin');
+    if (target === null)
+        return;
+    const labsUrl = document
+        .querySelector('h1.dumathoin__title a')
+        ?.getAttribute('href');
+    if (labsUrl === null)
+        return;
+    const eventTimer = EventTimer.get();
+    log('commercial', 'Page has labs container');
+    eventTimer.setProperty('hasLabsContainer', true);
+    eventTimer.setProperty('labsUrl', labsUrl);
+    const observer = new IntersectionObserver((entries) => {
+        entries.map((entry) => {
+            if (entry.isIntersecting) {
+                log('commercial', 'Labs container in view');
+                eventTimer.trigger('labsContainerInView');
+                observer.unobserve(entry.target);
+            }
+        });
+    });
+    observer.observe(target);
+};
+export { initTrackLabsContainer };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@guardian/commercial-core",
-  "version": "4.8.0",
+  "version": "4.10.0",
   "description": "Guardian advertising business logic",
   "homepage": "https://github.com/guardian/commercial-core#readme",
   "bugs": {
@@ -47,9 +47,9 @@
     "@guardian/ab-core": "^2.0.0",
     "@guardian/consent-management-platform": "^10.6.0",
     "@guardian/eslint-config-typescript": "^1.0.0",
-    "@guardian/libs": "5.1.0",
-    "@guardian/prettier": "^1.0.0",
-    "@octokit/core": "^3.5.1",
+    "@guardian/libs": "^7.1.3",
+    "@guardian/prettier": "^2.1.1",
+    "@octokit/core": "^4.0.5",
     "@semantic-release/github": "^8.0.2",
     "@types/google.analytics": "^0.0.42",
     "@types/googletag": "^2.0.0",
@@ -57,7 +57,7 @@
     "@typescript-eslint/eslint-plugin": "^5.5.0",
     "@typescript-eslint/parser": "^5.5.0",
     "commitizen": "^4.2.4",
-    "conventional-changelog-conventionalcommits": "^4.6.3",
+    "conventional-changelog-conventionalcommits": "^5.0.0",
     "cz-conventional-changelog": "^3.3.0",
     "eslint": "^8.4.1",
     "eslint-config-prettier": "^8.3.0",
@@ -82,6 +82,6 @@
   },
   "peerDependencies": {
     "@guardian/ab-core": "^2.0.0",
-    "@guardian/libs": "^3.3.0"
+    "@guardian/libs": ">6"
   }
 }