@next/third-parties 14.0.5-canary.6 → 14.0.5-canary.8

package/dist/ThirdPartyScriptEmbed.d.ts

@@ -1,8 +1,8 @@
 import React from 'react';
 export type ScriptEmbed = {
     html?: string | null;
-    height?: number | null;
-    width?: number | null;
+    height?: string | number | null;
+    width?: string | number | null;
     children?: React.ReactElement | React.ReactElement[];
     dataNtpc?: string;
 };

package/dist/google/ga.d.ts

@@ -0,0 +1,8 @@
+import type { GAParams } from '../types/google';
+declare global {
+    interface Window {
+        dataLayer?: Object[];
+    }
+}
+export declare function GoogleAnalytics(props: GAParams): import("react/jsx-runtime").JSX.Element;
+export declare const sendGAEvent: (...args: Object[]) => void;

package/dist/google/ga.js

@@ -0,0 +1,51 @@
+"use strict";
+'use client';
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.sendGAEvent = exports.GoogleAnalytics = void 0;
+const jsx_runtime_1 = require("react/jsx-runtime");
+// TODO: Evaluate import 'client only'
+const react_1 = require("react");
+const script_1 = __importDefault(require("next/script"));
+let currDataLayerName = undefined;
+function GoogleAnalytics(props) {
+    const { gaId, dataLayerName = 'dataLayer' } = props;
+    if (currDataLayerName === undefined) {
+        currDataLayerName = dataLayerName;
+    }
+    (0, react_1.useEffect)(() => {
+        // performance.mark is being used as a feature use signal. While it is traditionally used for performance
+        // benchmarking it is low overhead and thus considered safe to use in production and it is a widely available
+        // existing API.
+        // The performance measurement will be handled by Chrome Aurora
+        performance.mark('mark_feature_usage', {
+            detail: {
+                feature: 'next-third-parties-ga',
+            },
+        });
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsx)(script_1.default, { id: "_next-ga-init", dangerouslySetInnerHTML: {
+                    __html: `
+          window['${dataLayerName}'] = window['${dataLayerName}'] || [];
+          function gtag(){window['${dataLayerName}'].push(arguments);}
+          gtag('js', new Date());
+
+          gtag('config', '${gaId}');`,
+                } }), (0, jsx_runtime_1.jsx)(script_1.default, { id: "_next-ga", src: `https://www.googletagmanager.com/gtag/js?id=${gaId}` })] }));
+}
+exports.GoogleAnalytics = GoogleAnalytics;
+const sendGAEvent = (...args) => {
+    if (currDataLayerName === undefined) {
+        console.warn(`@next/third-parties: GA has not been initialized`);
+        return;
+    }
+    if (window[currDataLayerName]) {
+        window[currDataLayerName].push(...args);
+    }
+    else {
+        console.warn(`@next/third-parties: GA dataLayer ${currDataLayerName} does not exist`);
+    }
+};
+exports.sendGAEvent = sendGAEvent;

package/dist/google/gtm.js

@@ -22,6 +22,7 @@ function GoogleTagManager(props) {
         // performance.mark is being used as a feature use signal. While it is traditionally used for performance
         // benchmarking it is low overhead and thus considered safe to use in production and it is a widely available
         // existing API.
+        // The performance measurement will be handled by Chrome Aurora
         performance.mark('mark_feature_usage', {
             detail: {
                 feature: 'next-third-parties-gtm',

package/dist/google/index.d.ts

@@ -1,3 +1,4 @@
 export { default as GoogleMapsEmbed } from './google-maps-embed';
 export { default as YouTubeEmbed } from './youtube-embed';
 export { GoogleTagManager, sendGTMEvent } from './gtm';
+export { GoogleAnalytics, sendGAEvent } from './ga';

package/dist/google/index.js

@@ -3,7 +3,7 @@ var __importDefault = (this && this.__importDefault) || function (mod) {
     return (mod && mod.__esModule) ? mod : { "default": mod };
 };
 Object.defineProperty(exports, "__esModule", { value: true });
-exports.sendGTMEvent = exports.GoogleTagManager = exports.YouTubeEmbed = exports.GoogleMapsEmbed = void 0;
+exports.sendGAEvent = exports.GoogleAnalytics = exports.sendGTMEvent = exports.GoogleTagManager = exports.YouTubeEmbed = exports.GoogleMapsEmbed = void 0;
 var google_maps_embed_1 = require("./google-maps-embed");
 Object.defineProperty(exports, "GoogleMapsEmbed", { enumerable: true, get: function () { return __importDefault(google_maps_embed_1).default; } });
 var youtube_embed_1 = require("./youtube-embed");
@@ -11,3 +11,6 @@ Object.defineProperty(exports, "YouTubeEmbed", { enumerable: true, get: function
 var gtm_1 = require("./gtm");
 Object.defineProperty(exports, "GoogleTagManager", { enumerable: true, get: function () { return gtm_1.GoogleTagManager; } });
 Object.defineProperty(exports, "sendGTMEvent", { enumerable: true, get: function () { return gtm_1.sendGTMEvent; } });
+var ga_1 = require("./ga");
+Object.defineProperty(exports, "GoogleAnalytics", { enumerable: true, get: function () { return ga_1.GoogleAnalytics; } });
+Object.defineProperty(exports, "sendGAEvent", { enumerable: true, get: function () { return ga_1.sendGAEvent; } });

package/dist/types/google.d.ts

@@ -11,15 +11,20 @@ export type GTMParams = {
     auth?: string;
     preview?: string;
 };
+export type GAParams = {
+    gaId: string;
+    dataLayerName?: string;
+};
 export type GoogleMapsEmbed = {
-    height?: number;
-    width?: number;
+    height?: number | string;
+    width?: number | string;
     mode: 'place' | 'view' | 'directions' | 'streetview' | 'search';
     apiKey: string;
-    style: string;
-    allowfullscreen: boolean;
-    loading: 'eager' | 'lazy';
+    style?: string;
+    allowfullscreen?: boolean;
+    loading?: 'eager' | 'lazy';
     q?: string;
+    id?: string;
     center?: string;
     zoom?: string;
     maptype?: string;

package/google.d.ts

@@ -0,0 +1 @@
+export * from './dist/google/index'

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@next/third-parties",
-  "version": "14.0.5-canary.6",
+  "version": "14.0.5-canary.8",
   "repository": {
     "url": "vercel/next.js",
     "directory": "packages/third-parties"
@@ -12,7 +12,8 @@
     }
   },
   "files": [
-    "dist"
+    "dist",
+    "google.d.ts"
   ],
   "license": "MIT",
   "scripts": {
@@ -25,7 +26,7 @@
     "third-party-capital": "1.0.20"
   },
   "devDependencies": {
-    "next": "14.0.5-canary.6",
+    "next": "14.0.5-canary.8",
     "outdent": "0.8.0",
     "prettier": "2.5.1"
   },