@phantomstudios/ft-lib - npm Package Compare versions

Comparing version 0.3.0-rc1 to 0.3.0-rc10

lib/FTTracking/index.d.ts

@@ -9,2 +9,4 @@ import { gaTracker } from "../gaTracker";
     sendGTMPageViewYN?: boolean;
+    sendBrandedContent?: boolean;
+    disableAppFormatTransform?: boolean;
 }
@@ -17,2 +19,3 @@ export declare class FTTracking {
     scrollTracker: ScrollTracker;
+    disableAppFormatTransform: boolean;
     oEvent: (detail: OrigamiEventType) => void;
@@ -19,0 +22,0 @@ gaEvent: (category: string, action: string, label: string) => void;

lib/FTTracking/index.js

@@ -24,2 +24,3 @@ "use strict";
     sendGTMPageViewYN: true,
+    sendBrandedContent: true,
 };
@@ -31,2 +32,4 @@ var FTTracking = /** @class */ (function () {
         this.gaTracker = new gaTracker_1.gaTracker(this.options);
+        this.disableAppFormatTransform =
+            this.options.disableAppFormatTransform || false;
         this.oEvent = this.oTracker.eventDispatcher;
@@ -58,6 +61,8 @@ this.gaEvent = this.options.isCustomGTMEvent
         //Update passed config to otracker,send pageview events and reset scrollTracker
-        (0, yupValidator_1.validateConfig)(config);
+        (0, yupValidator_1.validateConfig)(config, this.disableAppFormatTransform);
         this.oTracker.config = config;
         this.oTracker.broadcastPageView();
-        this.oTracker.broadcastBrandedContent();
+        if (this.options.sendBrandedContent) {
+            this.oTracker.broadcastBrandedContent();
+        }
         this.scrollTracker.reset();
@@ -64,0 +69,0 @@ if (this.options.sendGTMPageViewYN) {

lib/oTracker/index.js

@@ -27,4 +27,4 @@ "use strict";
     function oTracker(config, options) {
-        this._config = (0, yupValidator_1.parseConfig)(config);
-        (0, yupValidator_1.validateConfig)(this._config);
+        this._config = (0, yupValidator_1.parseConfig)(config, options.disableAppFormatTransform || false);
+        (0, yupValidator_1.validateConfig)(this._config, options.disableAppFormatTransform || false);
         this._config.source_id = o_tracking_1.default.getRootID();
@@ -47,3 +47,5 @@ this.options = options;
         this.broadcastPageView();
-        this.broadcastBrandedContent();
+        if (options.sendBrandedContent) {
+            this.broadcastBrandedContent();
+        }
     }
@@ -50,0 +52,0 @@ Object.defineProperty(oTracker.prototype, "config", {

lib/utils/attention.js

 "use strict";
-var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    var desc = Object.getOwnPropertyDescriptor(m, k);
-    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
-      desc = { enumerable: true, get: function() { return m[k]; } };
-    }
-    Object.defineProperty(o, k2, desc);
-}) : (function(o, m, k, k2) {
-    if (k2 === undefined) k2 = k;
-    o[k2] = m[k];
-}));
-var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
-    Object.defineProperty(o, "default", { enumerable: true, value: v });
-}) : function(o, v) {
-    o["default"] = v;
-});
-var __importStar = (this && this.__importStar) || function (mod) {
-    if (mod && mod.__esModule) return mod;
-    var result = {};
-    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
-    __setModuleDefault(result, mod);
-    return result;
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Attention = void 0;
-var oViewport = __importStar(require("@financial-times/o-viewport"));
+var o_viewport_1 = __importDefault(require("@financial-times/o-viewport"));
 var ATTENTION_INTERVAL = 15000;
@@ -63,3 +43,3 @@ var ATTENTION_EVENTS = [
         // Need to wait for this to be available
-        oViewport.listenTo("visibility");
+        o_viewport_1.default.listenTo("visibility");
         document.body.addEventListener("oViewport.visibility", function (ev) { return _this.handleVisibilityChange(ev); }, false);
@@ -66,0 +46,0 @@ this.addVideoEvents();

lib/utils/scroll.d.ts

@@ -0,1 +1,2 @@
+import { ConfigType } from "./yupValidator";
 import { TrackingOptions } from "../FTTracking";
@@ -5,3 +6,2 @@ import { FTTracking } from "../FTTracking";
 import { oTracker } from "../oTracker";
-import { ConfigType } from "./yupValidator";
 import "./intersectionObserverPolyfill";
@@ -8,0 +8,0 @@ export declare class ScrollTracker {

lib/utils/yupValidator.d.ts

 import { InferType, ValidationError } from "yup";
 declare const configSchema: import("yup").ObjectSchema<{
-    product: any;
+    product: string | undefined;
     url: string;
@@ -27,3 +27,3 @@ feature: string;
 }, import("yup").AnyObject, {
-    product: any;
+    product: undefined;
     url: undefined;
@@ -73,6 +73,6 @@ feature: undefined;
 export type OrigamiEventType = InferType<typeof origamiEventSchema>;
-export declare const parseConfig: (config: ConfigType) => ConfigType;
-export declare const validateConfig: (config: ConfigType) => ValidationError[] | undefined;
+export declare const parseConfig: (config: ConfigType, disableAppFormatTransform: boolean) => ConfigType;
+export declare const validateConfig: (config: ConfigType, disableAppFormatTransform: boolean) => ValidationError[] | undefined;
 export declare const validateOrigamiEvent: (config: OrigamiEventType) => ValidationError[] | undefined;
 export {};
 //# sourceMappingURL=yupValidator.d.ts.map

lib/utils/yupValidator.js

@@ -5,4 +5,8 @@ "use strict";
 var yup_1 = require("yup");
+var disableAppFormatTransformValue = false;
 //transform passed values to first character uppercase and replace spaces with underscores
-var unifyValuesTransform = function (value) {
+var unifyValuesTransform = function (value, disableTransform) {
+    if (disableTransform === void 0) { disableTransform = false; }
+    if (disableTransform)
+        return value;
     return (value.trim().charAt(0).toUpperCase() +
@@ -20,5 +24,5 @@ value.trim().slice(1).toLowerCase().replace(/ /g, "_").replace(/-/g, "_"));
 var configSchema = (0, yup_1.object)({
-    product: (0, yup_1.string)().equals(["paid-post"]),
+    product: (0, yup_1.string)().oneOf(["paid-post", "commercial-ft-com"]),
     url: (0, yup_1.string)().required(),
-    feature: (0, yup_1.string)().required().oneOf(["channel", "microsite"]),
+    feature: (0, yup_1.string)().required().oneOf(["channel", "microsite", "commercial"]),
     author: (0, yup_1.string)().defined().default("").transform(authorTransform),
@@ -43,3 +47,5 @@ sponsor: (0, yup_1.string)().defined().default(""),
         .defined()
-        .transform(unifyValuesTransform)
+        .transform(function (value) {
+        return unifyValuesTransform(value, disableAppFormatTransformValue);
+    })
         .oneOf([
@@ -56,2 +62,10 @@ "Stream",
         "Photo_essay",
+        "home-page",
+        "capabilities",
+        "my-products",
+        "audience",
+        "case-studies",
+        "markets",
+        "news-and-insights",
+        "other",
     ]),
@@ -104,4 +118,5 @@ publishDate: (0, yup_1.string)().nullable().default(""),
 });
-var parseConfig = function (config) {
+var parseConfig = function (config, disableAppFormatTransform) {
     var _a;
+    disableAppFormatTransformValue = disableAppFormatTransform;
     try {
@@ -127,4 +142,5 @@ //Replace app value based on deprecated hasVideo field and then remove hasVideo
 exports.parseConfig = parseConfig;
-var validateConfig = function (config) {
+var validateConfig = function (config, disableAppFormatTransform) {
     var _a;
+    disableAppFormatTransformValue = disableAppFormatTransform;
     try {
@@ -131,0 +147,0 @@ configSchema.validateSync(config, {

package.json

 {
   "name": "@phantomstudios/ft-lib",
   "description": "A collection of Javascript UI & tracking utils for FT sites",
-  "version": "0.3.0-rc1",
+  "version": "0.3.0-rc10",
   "main": "lib/index.js",
@@ -49,3 +49,3 @@ "types": "lib/index.d.ts",
     "babel-jest": "^26.0.1",
-    "browser-env": "^3.2.6",
+    "browser-env": "^2.0.21",
     "debug": "^4.3.2",
@@ -70,4 +70,4 @@ "eslint": "^7.26.0",
     "@financial-times/o-tracking": "^4.5.1",
-    "@financial-times/o-viewport": "^4.0.5"
+    "@financial-times/o-viewport": "^5.1.2"
   }
 }

README.md

@@ -24,3 +24,3 @@ # ft-lib
 ```bash
-npm i @phntms/ft-lib
+npm i @phantomstudios/ft-lib
 ```
@@ -43,2 +43,3 @@
   isCustomGTMEvent: true, //selects between GTM and UA(GTAG) event formats - TODO - handle automatically by detecting loaded GTM/UA?
+  disableAppFormatTransform: false, //by default the config.app variable is formatted, ie: "app": "home-page" -> "app": "Home_page" - set to true to disable this formatting
 
@@ -54,3 +55,3 @@ ```
 ```Javascript
-import { FTTracking } from '@phntms/ft-lib'
+import { FTTracking } from '@phantomstudios/ft-lib'
 
@@ -73,3 +74,3 @@ //For Wagtail sites, get server-rendered o-tracking-data
 ```Javascript
-import { consentMonitor } from "@phntms/ft-lib";
+import { consentMonitor } from "@phantomstudios/ft-lib";
 
@@ -85,3 +86,3 @@ new consentMonitor("FT.staging.testsite.com". ["localhost", "phq", "staging"]);
 ```Javascript
-import { permutiveVideoUtils } from "@phntms/ft-lib";
+import { permutiveVideoUtils } from "@phantomstudios/ft-lib";
 
@@ -104,3 +105,3 @@ const permutivevideoTracker = new permutiveVideoUtils("<FT-CAMPAIGN>","<VIDEO-TITLE>","<VIDEO-ID/URL>")  //Data will be site implementation specific
 ```Javascript
-import { reactPlayerTracking } from "@phntms/ft-lib";
+import { reactPlayerTracking } from "@phantomstudios/ft-lib";
 
@@ -132,3 +133,3 @@ const [videoTracker] = useState(
 ```Javascript
-import { ytIframeTracking } from '@phntms/ft-lib';
+import { ytIframeTracking } from '@phantomstudios/ft-lib';
 
@@ -160,7 +161,7 @@ const VIDEO_IFRAME_ID = 'video-iframe';
 
-[npm-image]: https://img.shields.io/npm/v/@phntms/ft-lib.svg?style=flat-square&logo=react
-[npm-url]: https://npmjs.org/package/@phntms/ft-lib
-[npm-downloads-image]: https://img.shields.io/npm/dm/@phntms/ft-lib.svg
-[npm-downloads-url]: https://npmcharts.com/compare/@phntms/ft-lib?minimal=true
+[npm-image]: https://img.shields.io/npm/v/@phantomstudios/ft-lib.svg?style=flat-square&logo=react
+[npm-url]: https://npmjs.org/package/@phantomstudios/ft-lib
+[npm-downloads-image]: https://img.shields.io/npm/dm/@phantomstudios/ft-lib.svg
+[npm-downloads-url]: https://npmcharts.com/compare/@phantomstudios/ft-lib?minimal=true
 [ci-image]: https://github.com/phantomstudios/ft-lib/workflows/test/badge.svg
 [ci-url]: https://github.com/phantomstudios/ft-lib/actions

src/FTTracking/index.ts

@@ -15,2 +15,4 @@ import { consentMonitor } from "../consentMonitor";
   sendGTMPageViewYN?: boolean;
+  sendBrandedContent?: boolean;
+  disableAppFormatTransform?: boolean;
 }
@@ -22,2 +24,3 @@
   sendGTMPageViewYN: true,
+  sendBrandedContent: true,
 };
@@ -31,2 +34,3 @@
   scrollTracker: ScrollTracker;
+  disableAppFormatTransform: boolean;
   oEvent: (detail: OrigamiEventType) => void;
@@ -40,2 +44,4 @@ gaEvent: (category: string, action: string, label: string) => void;
     this.gaTracker = new gaTracker(this.options);
+    this.disableAppFormatTransform =
+      this.options.disableAppFormatTransform || false;
 
@@ -68,6 +74,8 @@ this.oEvent = this.oTracker.eventDispatcher;
     //Update passed config to otracker,send pageview events and reset scrollTracker
-    validateConfig(config);
+    validateConfig(config, this.disableAppFormatTransform);
     this.oTracker.config = config;
     this.oTracker.broadcastPageView();
-    this.oTracker.broadcastBrandedContent();
+    if (this.options.sendBrandedContent) {
+      this.oTracker.broadcastBrandedContent();
+    }
     this.scrollTracker.reset();
@@ -74,0 +82,0 @@ if (this.options.sendGTMPageViewYN) {

src/oTracker/index.ts

@@ -22,4 +22,7 @@ import oTracking from "@financial-times/o-tracking";
   constructor(config: ConfigType, options: TrackingOptions) {
-    this._config = parseConfig(config);
-    validateConfig(this._config);
+    this._config = parseConfig(
+      config,
+      options.disableAppFormatTransform || false
+    );
+    validateConfig(this._config, options.disableAppFormatTransform || false);
     this._config.source_id = oTracking.getRootID();
@@ -47,3 +50,5 @@ this.options = options;
     this.broadcastPageView();
-    this.broadcastBrandedContent();
+    if (options.sendBrandedContent) {
+      this.broadcastBrandedContent();
+    }
   }
@@ -50,0 +55,0 @@

src/utils/attention.js

@@ -1,2 +0,2 @@
-import * as oViewport from "@financial-times/o-viewport";
+import oViewport from "@financial-times/o-viewport";
 
@@ -3,0 +3,0 @@ const ATTENTION_INTERVAL = 15000;

src/utils/scroll.ts

@@ -0,1 +1,3 @@
+import { Attention } from "./attention";
+import { ConfigType, OrigamiEventType } from "./yupValidator";
 import { TrackingOptions } from "../FTTracking";
@@ -5,4 +7,2 @@ import { FTTracking } from "../FTTracking";
 import { oTracker } from "../oTracker";
-import { Attention } from "./attention";
-import { ConfigType, OrigamiEventType } from "./yupValidator";
 
@@ -9,0 +9,0 @@ import "./intersectionObserverPolyfill";

src/utils/yupValidator.ts

@@ -11,4 +11,7 @@ import {
 
+let disableAppFormatTransformValue = false;
+
 //transform passed values to first character uppercase and replace spaces with underscores
-const unifyValuesTransform = (value: string) => {
+const unifyValuesTransform = (value: string, disableTransform = false) => {
+  if (disableTransform) return value;
   return (
@@ -32,5 +35,5 @@ value.trim().charAt(0).toUpperCase() +
 const configSchema = object({
-  product: string().equals(["paid-post"]),
+  product: string().oneOf(["paid-post", "commercial-ft-com"]),
   url: string().required(),
-  feature: string().required().oneOf(["channel", "microsite"]),
+  feature: string().required().oneOf(["channel", "microsite", "commercial"]),
   author: string().defined().default("").transform(authorTransform),
@@ -55,3 +58,5 @@ sponsor: string().defined().default(""),
     .defined()
-    .transform(unifyValuesTransform)
+    .transform((value) =>
+      unifyValuesTransform(value, disableAppFormatTransformValue)
+    )
     .oneOf([
@@ -68,2 +73,10 @@ "Stream",
       "Photo_essay",
+      "home-page",
+      "capabilities",
+      "my-products",
+      "audience",
+      "case-studies",
+      "markets",
+      "news-and-insights",
+      "other",
     ]),
@@ -121,3 +134,7 @@ publishDate: string().nullable().default(""),
 
-export const parseConfig = (config: ConfigType): ConfigType => {
+export const parseConfig = (
+  config: ConfigType,
+  disableAppFormatTransform: boolean
+): ConfigType => {
+  disableAppFormatTransformValue = disableAppFormatTransform;
   try {
@@ -144,4 +161,6 @@ //Replace app value based on deprecated hasVideo field and then remove hasVideo
 export const validateConfig = (
-  config: ConfigType
+  config: ConfigType,
+  disableAppFormatTransform: boolean
 ): ValidationError[] | undefined => {
+  disableAppFormatTransformValue = disableAppFormatTransform;
   try {
@@ -148,0 +167,0 @@ configSchema.validateSync(config, {

No alert changes

Improved metrics

Total package byte prevSize

223309

increased by1.07%

Lines of code

3777

increased by0.99%

Number of lines in readme file

160

increased by0.63%

No dependency changes