@guardian/commercial-core 4.2.1 → 4.5.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/cjs/ad-sizes.d.ts +2 -2
- package/dist/cjs/ad-sizes.js +4 -0
- package/dist/cjs/create-ad-slot.d.ts +12 -3
- package/dist/cjs/create-ad-slot.js +10 -18
- package/dist/cjs/index.d.ts +3 -1
- package/dist/cjs/index.js +4 -1
- package/dist/cjs/lib/breakpoint.d.ts +4 -0
- package/dist/cjs/lib/breakpoint.js +5 -0
- package/dist/cjs/targeting/personalised.js +11 -19
- package/dist/esm/ad-sizes.d.ts +2 -2
- package/dist/esm/ad-sizes.js +4 -0
- package/dist/esm/create-ad-slot.d.ts +12 -3
- package/dist/esm/create-ad-slot.js +10 -18
- package/dist/esm/index.d.ts +3 -1
- package/dist/esm/index.js +2 -1
- package/dist/esm/lib/breakpoint.d.ts +4 -0
- package/dist/esm/lib/breakpoint.js +2 -0
- package/dist/esm/targeting/personalised.js +11 -19
- package/package.json +3 -3
package/dist/cjs/ad-sizes.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { Breakpoint } from './lib/breakpoint';
|
|
1
2
|
declare type AdSizeString = 'fluid' | `${number},${number}`;
|
|
2
3
|
/**
|
|
3
4
|
* Store ad sizes in a way that is compatible with google-tag but also accessible via
|
|
@@ -25,8 +26,7 @@ declare class AdSize extends Array<number> {
|
|
|
25
26
|
get height(): number;
|
|
26
27
|
}
|
|
27
28
|
declare type SizeKeys = '160x600' | '300x1050' | '300x250' | '300x600' | '728x90' | '970x250' | 'billboard' | 'empty' | 'fabric' | 'fluid' | 'googleCard' | 'halfPage' | 'inlineMerchandising' | 'leaderboard' | 'merchandising' | 'merchandisingHigh' | 'merchandisingHighAdFeature' | 'mobilesticky' | 'mpu' | 'outOfPage' | 'outstreamDesktop' | 'outstreamGoogleDesktop' | 'outstreamMobile' | 'portrait' | 'skyscraper';
|
|
28
|
-
declare type SlotName = 'right' | 'comments' | 'top-above-nav' | 'mostpop' | 'merchandising' | 'merchandising-high' | 'merchandising-high-lucky' | 'survey' | 'im' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky';
|
|
29
|
-
declare type Breakpoint = 'mobile' | 'desktop' | 'phablet' | 'tablet';
|
|
29
|
+
declare type SlotName = 'right' | 'comments' | 'top-above-nav' | 'mostpop' | 'merchandising' | 'merchandising-high' | 'merchandising-high-lucky' | 'survey' | 'im' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky' | 'crossword-banner';
|
|
30
30
|
declare type SizeMapping = Partial<Record<Breakpoint, AdSize[]>>;
|
|
31
31
|
declare type SlotSizeMappings = Record<SlotName, SizeMapping>;
|
|
32
32
|
declare const createAdSize: (width: number, height: number) => AdSize;
|
package/dist/cjs/ad-sizes.js
CHANGED
|
@@ -243,6 +243,10 @@ const slotSizeMappings = {
|
|
|
243
243
|
'mobile-sticky': {
|
|
244
244
|
mobile: [adSizes.mobilesticky],
|
|
245
245
|
},
|
|
246
|
+
'crossword-banner': {
|
|
247
|
+
tablet: [adSizes.outOfPage, adSizes.empty, adSizes.leaderboard],
|
|
248
|
+
phablet: [adSizes.outOfPage, adSizes.empty, adSizes.leaderboard],
|
|
249
|
+
},
|
|
246
250
|
};
|
|
247
251
|
exports.slotSizeMappings = slotSizeMappings;
|
|
248
252
|
const getAdSize = (size) => adSizes[size];
|
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
import type { AdSize } from './ad-sizes';
|
|
1
|
+
import type { AdSize, SizeMapping } from './ad-sizes';
|
|
2
2
|
declare type SlotName = 'im' | 'high-merch' | 'high-merch-lucky' | 'high-merch-paid' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky';
|
|
3
3
|
declare type CreateSlotOptions = {
|
|
4
4
|
classes?: string;
|
|
5
5
|
name?: string;
|
|
6
6
|
sizes?: Record<string, AdSize[]>;
|
|
7
7
|
};
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
/**
|
|
9
|
+
* Given default size mappings and additional size mappings from
|
|
10
|
+
* the createAdSlot options parameter.
|
|
11
|
+
*
|
|
12
|
+
* 1. Check that the options size mappings use known device names
|
|
13
|
+
* 2. If so concat the size mappings
|
|
14
|
+
*
|
|
15
|
+
*/
|
|
16
|
+
declare const concatSizeMappings: (defaultSizeMappings: SizeMapping, optionSizeMappings?: SizeMapping) => SizeMapping;
|
|
17
|
+
declare const createAdSlot: (name: SlotName, options?: CreateSlotOptions) => HTMLElement;
|
|
18
|
+
export { createAdSlot, concatSizeMappings };
|
|
@@ -1,7 +1,8 @@
|
|
|
1
1
|
"use strict";
|
|
2
2
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.createAdSlot = void 0;
|
|
3
|
+
exports.concatSizeMappings = exports.createAdSlot = void 0;
|
|
4
4
|
const ad_sizes_1 = require("./ad-sizes");
|
|
5
|
+
const breakpoint_1 = require("./lib/breakpoint");
|
|
5
6
|
const adSlotIdPrefix = 'dfp-ad--';
|
|
6
7
|
const adSlotConfigs = {
|
|
7
8
|
im: {
|
|
@@ -102,24 +103,15 @@ const createClasses = (slotName, classes) => [...(classes?.split(' ') ?? []), sl
|
|
|
102
103
|
* 2. If so concat the size mappings
|
|
103
104
|
*
|
|
104
105
|
*/
|
|
105
|
-
const concatSizeMappings = (defaultSizeMappings, optionSizeMappings) => {
|
|
106
|
-
if
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
for (let i = 0; i < optionDevices.length; i++) {
|
|
111
|
-
const device = optionDevices[i];
|
|
112
|
-
if (optionSizeMappings[device] && defaultSizeMappings[device]) {
|
|
113
|
-
const optionSizeMappingsForDevice = optionSizeMappings[device];
|
|
114
|
-
const defaultSizeMappingsForDevice = defaultSizeMappings[device];
|
|
115
|
-
if (defaultSizeMappingsForDevice && optionSizeMappingsForDevice) {
|
|
116
|
-
// TODO can we do concatenatedSizeMappings[device]?.concat ?
|
|
117
|
-
concatenatedSizeMappings[device] = (concatenatedSizeMappings[device] ?? []).concat(optionSizeMappingsForDevice);
|
|
118
|
-
}
|
|
119
|
-
}
|
|
106
|
+
const concatSizeMappings = (defaultSizeMappings, optionSizeMappings = {}) => Object.entries(optionSizeMappings).reduce((sizeMappings, [breakpoint, optionSizes]) => {
|
|
107
|
+
// Only perform concatenation if breakpoint is of the correct type
|
|
108
|
+
if ((0, breakpoint_1.isBreakpoint)(breakpoint)) {
|
|
109
|
+
// Concatenate the option sizes onto any existing sizes present for a given breakpoint
|
|
110
|
+
sizeMappings[breakpoint] = (sizeMappings[breakpoint] ?? []).concat(optionSizes);
|
|
120
111
|
}
|
|
121
|
-
return
|
|
122
|
-
};
|
|
112
|
+
return sizeMappings;
|
|
113
|
+
}, { ...defaultSizeMappings });
|
|
114
|
+
exports.concatSizeMappings = concatSizeMappings;
|
|
123
115
|
/**
|
|
124
116
|
* Convert size mappings to a string that will be added to the ad slot
|
|
125
117
|
* data attributes.
|
package/dist/cjs/index.d.ts
CHANGED
|
@@ -8,13 +8,15 @@ export { EventTimer } from './event-timer';
|
|
|
8
8
|
export { bypassCommercialMetricsSampling, initCommercialMetrics, } from './send-commercial-metrics';
|
|
9
9
|
export type { ThirdPartyTag } from './types';
|
|
10
10
|
export { adSizes, getAdSize, slotSizeMappings, createAdSize } from './ad-sizes';
|
|
11
|
+
export { isBreakpoint } from './lib/breakpoint';
|
|
12
|
+
export type { Breakpoint } from './lib/breakpoint';
|
|
11
13
|
export type { SizeKeys, AdSizeString, AdSize, SizeMapping, SlotSizeMappings, SlotName, } from './ad-sizes';
|
|
12
14
|
export { isAdBlockInUse } from './detect-ad-blocker';
|
|
13
15
|
export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
|
|
14
16
|
export { initTrackScrollDepth } from './track-scroll-depth';
|
|
15
17
|
export { initTrackGpcSignal } from './track-gpc-signal';
|
|
16
18
|
export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
|
|
17
|
-
export { createAdSlot } from './create-ad-slot';
|
|
19
|
+
export { createAdSlot, concatSizeMappings } from './create-ad-slot';
|
|
18
20
|
export type { AdsConfig, AdsConfigBasic, AdsConfigDisabled, AdTargetingBuilder, CustomParams, } from './types';
|
|
19
21
|
export * as constants from './constants';
|
|
20
22
|
export type { ContentTargeting } from './targeting/content';
|
package/dist/cjs/index.js
CHANGED
|
@@ -24,7 +24,7 @@ var __importStar = (this && this.__importStar) || function (mod) {
|
|
|
24
24
|
return result;
|
|
25
25
|
};
|
|
26
26
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
27
|
-
exports.pickTargetingValues = exports.getViewportTargeting = exports.getSharedTargeting = exports.getSessionTargeting = exports.getPersonalisedTargeting = exports.getContentTargeting = exports.constants = exports.createAdSlot = exports.disabledAds = exports.buildAdsConfigWithConsent = exports.initTrackGpcSignal = exports.initTrackScrollDepth = exports.getPermutivePFPSegments = exports.getPermutiveSegments = exports.clearPermutiveSegments = exports.isAdBlockInUse = 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;
|
|
27
|
+
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;
|
|
28
28
|
var ias_1 = require("./third-party-tags/ias");
|
|
29
29
|
Object.defineProperty(exports, "ias", { enumerable: true, get: function () { return ias_1.ias; } });
|
|
30
30
|
var permutive_1 = require("./third-party-tags/permutive");
|
|
@@ -47,6 +47,8 @@ Object.defineProperty(exports, "adSizes", { enumerable: true, get: function () {
|
|
|
47
47
|
Object.defineProperty(exports, "getAdSize", { enumerable: true, get: function () { return ad_sizes_1.getAdSize; } });
|
|
48
48
|
Object.defineProperty(exports, "slotSizeMappings", { enumerable: true, get: function () { return ad_sizes_1.slotSizeMappings; } });
|
|
49
49
|
Object.defineProperty(exports, "createAdSize", { enumerable: true, get: function () { return ad_sizes_1.createAdSize; } });
|
|
50
|
+
var breakpoint_1 = require("./lib/breakpoint");
|
|
51
|
+
Object.defineProperty(exports, "isBreakpoint", { enumerable: true, get: function () { return breakpoint_1.isBreakpoint; } });
|
|
50
52
|
var detect_ad_blocker_1 = require("./detect-ad-blocker");
|
|
51
53
|
Object.defineProperty(exports, "isAdBlockInUse", { enumerable: true, get: function () { return detect_ad_blocker_1.isAdBlockInUse; } });
|
|
52
54
|
var permutive_2 = require("./permutive");
|
|
@@ -62,6 +64,7 @@ Object.defineProperty(exports, "buildAdsConfigWithConsent", { enumerable: true,
|
|
|
62
64
|
Object.defineProperty(exports, "disabledAds", { enumerable: true, get: function () { return ad_targeting_youtube_1.disabledAds; } });
|
|
63
65
|
var create_ad_slot_1 = require("./create-ad-slot");
|
|
64
66
|
Object.defineProperty(exports, "createAdSlot", { enumerable: true, get: function () { return create_ad_slot_1.createAdSlot; } });
|
|
67
|
+
Object.defineProperty(exports, "concatSizeMappings", { enumerable: true, get: function () { return create_ad_slot_1.concatSizeMappings; } });
|
|
65
68
|
exports.constants = __importStar(require("./constants"));
|
|
66
69
|
var content_1 = require("./targeting/content");
|
|
67
70
|
Object.defineProperty(exports, "getContentTargeting", { enumerable: true, get: function () { return content_1.getContentTargeting; } });
|
|
@@ -73,39 +73,27 @@ const getFrequencyValue = (state) => {
|
|
|
73
73
|
}
|
|
74
74
|
return '0';
|
|
75
75
|
};
|
|
76
|
-
const tcfv2AllPurposesConsented = (consents) => Object.keys(consents).length > 0 && Object.values(consents).every(Boolean);
|
|
77
|
-
const personalisedAdvertising = (state) => {
|
|
78
|
-
if (state.tcfv2)
|
|
79
|
-
return tcfv2AllPurposesConsented(state.tcfv2.consents);
|
|
80
|
-
if (state.ccpa)
|
|
81
|
-
return !state.ccpa.doNotSell;
|
|
82
|
-
if (state.aus)
|
|
83
|
-
return state.aus.personalisedAdvertising;
|
|
84
|
-
return false;
|
|
85
|
-
};
|
|
86
76
|
const getCMPTargeting = (state) => {
|
|
87
77
|
if (state.tcfv2) {
|
|
88
78
|
return {
|
|
89
79
|
cmp_interaction: state.tcfv2.eventStatus,
|
|
90
|
-
pa:
|
|
91
|
-
consent_tcfv2:
|
|
92
|
-
? 't'
|
|
93
|
-
: 'f',
|
|
80
|
+
pa: state.canTarget ? 't' : 'f',
|
|
81
|
+
consent_tcfv2: state.canTarget ? 't' : 'f',
|
|
94
82
|
rdp: 'na',
|
|
95
83
|
};
|
|
96
84
|
}
|
|
97
85
|
if (state.ccpa) {
|
|
98
86
|
return {
|
|
99
87
|
consent_tcfv2: 'na',
|
|
100
|
-
rdp: state.
|
|
101
|
-
pa: state.
|
|
88
|
+
rdp: !state.canTarget ? 't' : 'f',
|
|
89
|
+
pa: state.canTarget ? 't' : 'f',
|
|
102
90
|
};
|
|
103
91
|
}
|
|
104
92
|
if (state.aus) {
|
|
105
93
|
return {
|
|
106
94
|
consent_tcfv2: 'na',
|
|
107
95
|
rdp: 'na',
|
|
108
|
-
pa: state.
|
|
96
|
+
pa: state.canTarget ? 't' : 'f',
|
|
109
97
|
};
|
|
110
98
|
}
|
|
111
99
|
return {
|
|
@@ -123,7 +111,11 @@ const createAdManagerGroup = () => {
|
|
|
123
111
|
return group;
|
|
124
112
|
};
|
|
125
113
|
const getAdManagerGroup = (state) => {
|
|
126
|
-
if (!
|
|
114
|
+
if (!state.framework) {
|
|
115
|
+
libs_1.storage.local.remove(AMTGRP_STORAGE_KEY);
|
|
116
|
+
return null;
|
|
117
|
+
}
|
|
118
|
+
if (state.tcfv2 && !state.canTarget) {
|
|
127
119
|
libs_1.storage.local.remove(AMTGRP_STORAGE_KEY);
|
|
128
120
|
return null;
|
|
129
121
|
}
|
|
@@ -133,7 +125,7 @@ const getAdManagerGroup = (state) => {
|
|
|
133
125
|
: createAdManagerGroup();
|
|
134
126
|
};
|
|
135
127
|
const getPermutiveWithState = (state) => {
|
|
136
|
-
if (
|
|
128
|
+
if (state.canTarget)
|
|
137
129
|
return (0, permutive_1.getPermutiveSegments)();
|
|
138
130
|
(0, permutive_1.clearPermutiveSegments)();
|
|
139
131
|
return [];
|
package/dist/esm/ad-sizes.d.ts
CHANGED
|
@@ -1,3 +1,4 @@
|
|
|
1
|
+
import type { Breakpoint } from './lib/breakpoint';
|
|
1
2
|
declare type AdSizeString = 'fluid' | `${number},${number}`;
|
|
2
3
|
/**
|
|
3
4
|
* Store ad sizes in a way that is compatible with google-tag but also accessible via
|
|
@@ -25,8 +26,7 @@ declare class AdSize extends Array<number> {
|
|
|
25
26
|
get height(): number;
|
|
26
27
|
}
|
|
27
28
|
declare type SizeKeys = '160x600' | '300x1050' | '300x250' | '300x600' | '728x90' | '970x250' | 'billboard' | 'empty' | 'fabric' | 'fluid' | 'googleCard' | 'halfPage' | 'inlineMerchandising' | 'leaderboard' | 'merchandising' | 'merchandisingHigh' | 'merchandisingHighAdFeature' | 'mobilesticky' | 'mpu' | 'outOfPage' | 'outstreamDesktop' | 'outstreamGoogleDesktop' | 'outstreamMobile' | 'portrait' | 'skyscraper';
|
|
28
|
-
declare type SlotName = 'right' | 'comments' | 'top-above-nav' | 'mostpop' | 'merchandising' | 'merchandising-high' | 'merchandising-high-lucky' | 'survey' | 'im' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky';
|
|
29
|
-
declare type Breakpoint = 'mobile' | 'desktop' | 'phablet' | 'tablet';
|
|
29
|
+
declare type SlotName = 'right' | 'comments' | 'top-above-nav' | 'mostpop' | 'merchandising' | 'merchandising-high' | 'merchandising-high-lucky' | 'survey' | 'im' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky' | 'crossword-banner';
|
|
30
30
|
declare type SizeMapping = Partial<Record<Breakpoint, AdSize[]>>;
|
|
31
31
|
declare type SlotSizeMappings = Record<SlotName, SizeMapping>;
|
|
32
32
|
declare const createAdSize: (width: number, height: number) => AdSize;
|
package/dist/esm/ad-sizes.js
CHANGED
|
@@ -238,6 +238,10 @@ const slotSizeMappings = {
|
|
|
238
238
|
'mobile-sticky': {
|
|
239
239
|
mobile: [adSizes.mobilesticky],
|
|
240
240
|
},
|
|
241
|
+
'crossword-banner': {
|
|
242
|
+
tablet: [adSizes.outOfPage, adSizes.empty, adSizes.leaderboard],
|
|
243
|
+
phablet: [adSizes.outOfPage, adSizes.empty, adSizes.leaderboard],
|
|
244
|
+
},
|
|
241
245
|
};
|
|
242
246
|
const getAdSize = (size) => adSizes[size];
|
|
243
247
|
// Export for testing
|
|
@@ -1,9 +1,18 @@
|
|
|
1
|
-
import type { AdSize } from './ad-sizes';
|
|
1
|
+
import type { AdSize, SizeMapping } from './ad-sizes';
|
|
2
2
|
declare type SlotName = 'im' | 'high-merch' | 'high-merch-lucky' | 'high-merch-paid' | 'inline' | 'mostpop' | 'comments' | 'top-above-nav' | 'carrot' | 'epic' | 'mobile-sticky';
|
|
3
3
|
declare type CreateSlotOptions = {
|
|
4
4
|
classes?: string;
|
|
5
5
|
name?: string;
|
|
6
6
|
sizes?: Record<string, AdSize[]>;
|
|
7
7
|
};
|
|
8
|
-
|
|
9
|
-
|
|
8
|
+
/**
|
|
9
|
+
* Given default size mappings and additional size mappings from
|
|
10
|
+
* the createAdSlot options parameter.
|
|
11
|
+
*
|
|
12
|
+
* 1. Check that the options size mappings use known device names
|
|
13
|
+
* 2. If so concat the size mappings
|
|
14
|
+
*
|
|
15
|
+
*/
|
|
16
|
+
declare const concatSizeMappings: (defaultSizeMappings: SizeMapping, optionSizeMappings?: SizeMapping) => SizeMapping;
|
|
17
|
+
declare const createAdSlot: (name: SlotName, options?: CreateSlotOptions) => HTMLElement;
|
|
18
|
+
export { createAdSlot, concatSizeMappings };
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import { slotSizeMappings } from './ad-sizes';
|
|
2
|
+
import { isBreakpoint } from './lib/breakpoint';
|
|
2
3
|
const adSlotIdPrefix = 'dfp-ad--';
|
|
3
4
|
const adSlotConfigs = {
|
|
4
5
|
im: {
|
|
@@ -99,24 +100,14 @@ const createClasses = (slotName, classes) => [...(classes?.split(' ') ?? []), sl
|
|
|
99
100
|
* 2. If so concat the size mappings
|
|
100
101
|
*
|
|
101
102
|
*/
|
|
102
|
-
const concatSizeMappings = (defaultSizeMappings, optionSizeMappings) => {
|
|
103
|
-
if
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
for (let i = 0; i < optionDevices.length; i++) {
|
|
108
|
-
const device = optionDevices[i];
|
|
109
|
-
if (optionSizeMappings[device] && defaultSizeMappings[device]) {
|
|
110
|
-
const optionSizeMappingsForDevice = optionSizeMappings[device];
|
|
111
|
-
const defaultSizeMappingsForDevice = defaultSizeMappings[device];
|
|
112
|
-
if (defaultSizeMappingsForDevice && optionSizeMappingsForDevice) {
|
|
113
|
-
// TODO can we do concatenatedSizeMappings[device]?.concat ?
|
|
114
|
-
concatenatedSizeMappings[device] = (concatenatedSizeMappings[device] ?? []).concat(optionSizeMappingsForDevice);
|
|
115
|
-
}
|
|
116
|
-
}
|
|
103
|
+
const concatSizeMappings = (defaultSizeMappings, optionSizeMappings = {}) => Object.entries(optionSizeMappings).reduce((sizeMappings, [breakpoint, optionSizes]) => {
|
|
104
|
+
// Only perform concatenation if breakpoint is of the correct type
|
|
105
|
+
if (isBreakpoint(breakpoint)) {
|
|
106
|
+
// Concatenate the option sizes onto any existing sizes present for a given breakpoint
|
|
107
|
+
sizeMappings[breakpoint] = (sizeMappings[breakpoint] ?? []).concat(optionSizes);
|
|
117
108
|
}
|
|
118
|
-
return
|
|
119
|
-
};
|
|
109
|
+
return sizeMappings;
|
|
110
|
+
}, { ...defaultSizeMappings });
|
|
120
111
|
/**
|
|
121
112
|
* Convert size mappings to a string that will be added to the ad slot
|
|
122
113
|
* data attributes.
|
|
@@ -135,7 +126,7 @@ const createDataAttributes = (attrs) => Object.entries(attrs).reduce((result, [k
|
|
|
135
126
|
result[`data-${key}`] = value;
|
|
136
127
|
return result;
|
|
137
128
|
}, {});
|
|
138
|
-
|
|
129
|
+
const createAdSlot = (name, options = {}) => {
|
|
139
130
|
const adSlotConfig = adSlotConfigs[name];
|
|
140
131
|
const slotName = options.name ?? adSlotConfig.name ?? name;
|
|
141
132
|
const sizeMappings = concatSizeMappings(adSlotConfig.sizeMappings, options.sizes);
|
|
@@ -148,3 +139,4 @@ export const createAdSlot = (name, options = {}) => {
|
|
|
148
139
|
}
|
|
149
140
|
return createAdSlotElement(slotName, createDataAttributes(attributes), createClasses(slotName, options.classes));
|
|
150
141
|
};
|
|
142
|
+
export { createAdSlot, concatSizeMappings };
|
package/dist/esm/index.d.ts
CHANGED
|
@@ -8,13 +8,15 @@ export { EventTimer } from './event-timer';
|
|
|
8
8
|
export { bypassCommercialMetricsSampling, initCommercialMetrics, } from './send-commercial-metrics';
|
|
9
9
|
export type { ThirdPartyTag } from './types';
|
|
10
10
|
export { adSizes, getAdSize, slotSizeMappings, createAdSize } from './ad-sizes';
|
|
11
|
+
export { isBreakpoint } from './lib/breakpoint';
|
|
12
|
+
export type { Breakpoint } from './lib/breakpoint';
|
|
11
13
|
export type { SizeKeys, AdSizeString, AdSize, SizeMapping, SlotSizeMappings, SlotName, } from './ad-sizes';
|
|
12
14
|
export { isAdBlockInUse } from './detect-ad-blocker';
|
|
13
15
|
export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
|
|
14
16
|
export { initTrackScrollDepth } from './track-scroll-depth';
|
|
15
17
|
export { initTrackGpcSignal } from './track-gpc-signal';
|
|
16
18
|
export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
|
|
17
|
-
export { createAdSlot } from './create-ad-slot';
|
|
19
|
+
export { createAdSlot, concatSizeMappings } from './create-ad-slot';
|
|
18
20
|
export type { AdsConfig, AdsConfigBasic, AdsConfigDisabled, AdTargetingBuilder, CustomParams, } from './types';
|
|
19
21
|
export * as constants from './constants';
|
|
20
22
|
export type { ContentTargeting } from './targeting/content';
|
package/dist/esm/index.js
CHANGED
|
@@ -8,12 +8,13 @@ export { remarketing } from './third-party-tags/remarketing';
|
|
|
8
8
|
export { EventTimer } from './event-timer';
|
|
9
9
|
export { bypassCommercialMetricsSampling, initCommercialMetrics, } from './send-commercial-metrics';
|
|
10
10
|
export { adSizes, getAdSize, slotSizeMappings, createAdSize } from './ad-sizes';
|
|
11
|
+
export { isBreakpoint } from './lib/breakpoint';
|
|
11
12
|
export { isAdBlockInUse } from './detect-ad-blocker';
|
|
12
13
|
export { clearPermutiveSegments, getPermutiveSegments, getPermutivePFPSegments, } from './permutive';
|
|
13
14
|
export { initTrackScrollDepth } from './track-scroll-depth';
|
|
14
15
|
export { initTrackGpcSignal } from './track-gpc-signal';
|
|
15
16
|
export { buildAdsConfigWithConsent, disabledAds } from './ad-targeting-youtube';
|
|
16
|
-
export { createAdSlot } from './create-ad-slot';
|
|
17
|
+
export { createAdSlot, concatSizeMappings } from './create-ad-slot';
|
|
17
18
|
import * as constants_1 from './constants';
|
|
18
19
|
export { constants_1 as constants };
|
|
19
20
|
export { getContentTargeting } from './targeting/content';
|
|
@@ -70,39 +70,27 @@ const getFrequencyValue = (state) => {
|
|
|
70
70
|
}
|
|
71
71
|
return '0';
|
|
72
72
|
};
|
|
73
|
-
const tcfv2AllPurposesConsented = (consents) => Object.keys(consents).length > 0 && Object.values(consents).every(Boolean);
|
|
74
|
-
const personalisedAdvertising = (state) => {
|
|
75
|
-
if (state.tcfv2)
|
|
76
|
-
return tcfv2AllPurposesConsented(state.tcfv2.consents);
|
|
77
|
-
if (state.ccpa)
|
|
78
|
-
return !state.ccpa.doNotSell;
|
|
79
|
-
if (state.aus)
|
|
80
|
-
return state.aus.personalisedAdvertising;
|
|
81
|
-
return false;
|
|
82
|
-
};
|
|
83
73
|
const getCMPTargeting = (state) => {
|
|
84
74
|
if (state.tcfv2) {
|
|
85
75
|
return {
|
|
86
76
|
cmp_interaction: state.tcfv2.eventStatus,
|
|
87
|
-
pa:
|
|
88
|
-
consent_tcfv2:
|
|
89
|
-
? 't'
|
|
90
|
-
: 'f',
|
|
77
|
+
pa: state.canTarget ? 't' : 'f',
|
|
78
|
+
consent_tcfv2: state.canTarget ? 't' : 'f',
|
|
91
79
|
rdp: 'na',
|
|
92
80
|
};
|
|
93
81
|
}
|
|
94
82
|
if (state.ccpa) {
|
|
95
83
|
return {
|
|
96
84
|
consent_tcfv2: 'na',
|
|
97
|
-
rdp: state.
|
|
98
|
-
pa: state.
|
|
85
|
+
rdp: !state.canTarget ? 't' : 'f',
|
|
86
|
+
pa: state.canTarget ? 't' : 'f',
|
|
99
87
|
};
|
|
100
88
|
}
|
|
101
89
|
if (state.aus) {
|
|
102
90
|
return {
|
|
103
91
|
consent_tcfv2: 'na',
|
|
104
92
|
rdp: 'na',
|
|
105
|
-
pa: state.
|
|
93
|
+
pa: state.canTarget ? 't' : 'f',
|
|
106
94
|
};
|
|
107
95
|
}
|
|
108
96
|
return {
|
|
@@ -120,7 +108,11 @@ const createAdManagerGroup = () => {
|
|
|
120
108
|
return group;
|
|
121
109
|
};
|
|
122
110
|
const getAdManagerGroup = (state) => {
|
|
123
|
-
if (!
|
|
111
|
+
if (!state.framework) {
|
|
112
|
+
storage.local.remove(AMTGRP_STORAGE_KEY);
|
|
113
|
+
return null;
|
|
114
|
+
}
|
|
115
|
+
if (state.tcfv2 && !state.canTarget) {
|
|
124
116
|
storage.local.remove(AMTGRP_STORAGE_KEY);
|
|
125
117
|
return null;
|
|
126
118
|
}
|
|
@@ -130,7 +122,7 @@ const getAdManagerGroup = (state) => {
|
|
|
130
122
|
: createAdManagerGroup();
|
|
131
123
|
};
|
|
132
124
|
const getPermutiveWithState = (state) => {
|
|
133
|
-
if (
|
|
125
|
+
if (state.canTarget)
|
|
134
126
|
return getPermutiveSegments();
|
|
135
127
|
clearPermutiveSegments();
|
|
136
128
|
return [];
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@guardian/commercial-core",
|
|
3
|
-
"version": "4.
|
|
3
|
+
"version": "4.5.0",
|
|
4
4
|
"description": "Guardian advertising business logic",
|
|
5
5
|
"homepage": "https://github.com/guardian/commercial-core#readme",
|
|
6
6
|
"bugs": {
|
|
@@ -42,7 +42,7 @@
|
|
|
42
42
|
},
|
|
43
43
|
"prettier": "@guardian/prettier",
|
|
44
44
|
"devDependencies": {
|
|
45
|
-
"@commitlint/cli": "^
|
|
45
|
+
"@commitlint/cli": "^17.0.3",
|
|
46
46
|
"@commitlint/config-conventional": "^17.0.0",
|
|
47
47
|
"@guardian/ab-core": "^2.0.0",
|
|
48
48
|
"@guardian/consent-management-platform": "^10.6.0",
|
|
@@ -67,7 +67,7 @@
|
|
|
67
67
|
"eslint-plugin-prettier": "^4.0.0",
|
|
68
68
|
"husky": "^8.0.1",
|
|
69
69
|
"jest": "^27.4.1",
|
|
70
|
-
"lint-staged": "^
|
|
70
|
+
"lint-staged": "^13.0.3",
|
|
71
71
|
"mockdate": "^3.0.5",
|
|
72
72
|
"npm-run-all": "^4.1.5",
|
|
73
73
|
"prettier": "^2.5.0",
|