@dub/analytics - npm Package Compare versions

Comparing version 0.0.17 to 0.0.18

dist/index.d.ts

 interface AnalyticsProps {
+    /**
+     * The API endpoint to send analytics data to.
+     * @default 'https://api.dub.co'
+     */
+    apiHost?: string;
+    /**
+     * The Attribution Model to use for the analytics event.
+     *
+     * @default 'last-click'
+     *
+     * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
+     * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+     */
+    attributionModel?: 'first-click' | 'last-click';
+    /**
+     * The cookie options to use for the analytics event.
+     */
     cookieOptions?: {
         /**
          * Specifies the value for the {@link https://tools.ietf.org/html/rfc6265#section-5.2.3|Domain Set-Cookie attribute}. By default, no
-         * domain is set, and most clients will consider the cookie to apply to only
-         * the current domain.
+         * domain is set, and most clients will consider the cookie to apply to only the current domain.
+         * By default, the domain is set to the current hostname (including all subdomains).
+         *
+         * @default `.` + window.location.hostname
          */
@@ -80,10 +99,12 @@ domain?: string | undefined;
     /**
-     * The Attribution Model to use for the analytics event.
+     * The query parameter to listen to for client-side click-tracking (e.g. `?ref=abc123`)
      *
-     * @default 'last-click'
-     *
-     * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
-     * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+     * @default 'ref'
      */
-    attributionModel?: 'first-click' | 'last-click';
+    queryParam?: string;
+    /**
+     * Custom properties to pass to the script.
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement
+     */
+    scriptProps?: React.DetailedHTMLProps<React.ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>;
 }
@@ -90,0 +111,0 @@

dist/index.js

 // package.json
 var name = "@dub/analytics";
-var version = "0.0.17";
+var version = "0.0.18";
 
@@ -11,6 +11,7 @@ // src/utils.tsx
 // src/generic.ts
-var src = "https://www.dubcdn.com/analytics/script.js";
 function inject(props) {
+  var _a, _b;
   if (!isBrowser())
     return;
+  const src = ((_a = props.scriptProps) == null ? void 0 : _a.src) || "https://www.dubcdn.com/analytics/script.js";
   if (document.head.querySelector(`script[src*="${src}"]`))
@@ -20,5 +21,11 @@ return;
   script.src = src;
-  script.defer = true;
+  script.defer = ((_b = props.scriptProps) == null ? void 0 : _b.defer) || true;
   script.setAttribute("data-sdkn", name);
   script.setAttribute("data-sdkv", version);
+  if (props.apiHost) {
+    script.setAttribute("data-api-host", props.apiHost);
+  }
+  if (props.attributionModel) {
+    script.setAttribute("data-attribution-model", props.attributionModel);
+  }
   if (props.cookieOptions && Object.keys(props.cookieOptions).length > 0) {
@@ -30,5 +37,8 @@ script.setAttribute(
   }
-  if (props.attributionModel) {
-    script.setAttribute("data-attribution-model", props.attributionModel);
+  if (props.queryParam) {
+    script.setAttribute("data-query-param", props.queryParam);
   }
+  if (props.scriptProps) {
+    Object.assign(script, props.scriptProps);
+  }
   script.onerror = () => {
@@ -35,0 +45,0 @@ console.log(`[Dub Web Analytics] failed to load script from ${src}.`);

dist/react/index.d.ts

 interface AnalyticsProps {
+    /**
+     * The API endpoint to send analytics data to.
+     * @default 'https://api.dub.co'
+     */
+    apiHost?: string;
+    /**
+     * The Attribution Model to use for the analytics event.
+     *
+     * @default 'last-click'
+     *
+     * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
+     * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+     */
+    attributionModel?: 'first-click' | 'last-click';
+    /**
+     * The cookie options to use for the analytics event.
+     */
     cookieOptions?: {
         /**
          * Specifies the value for the {@link https://tools.ietf.org/html/rfc6265#section-5.2.3|Domain Set-Cookie attribute}. By default, no
-         * domain is set, and most clients will consider the cookie to apply to only
-         * the current domain.
+         * domain is set, and most clients will consider the cookie to apply to only the current domain.
+         * By default, the domain is set to the current hostname (including all subdomains).
+         *
+         * @default `.` + window.location.hostname
          */
@@ -80,10 +99,12 @@ domain?: string | undefined;
     /**
-     * The Attribution Model to use for the analytics event.
+     * The query parameter to listen to for client-side click-tracking (e.g. `?ref=abc123`)
      *
-     * @default 'last-click'
-     *
-     * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
-     * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+     * @default 'ref'
      */
-    attributionModel?: 'first-click' | 'last-click';
+    queryParam?: string;
+    /**
+     * Custom properties to pass to the script.
+     * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement
+     */
+    scriptProps?: React.DetailedHTMLProps<React.ScriptHTMLAttributes<HTMLScriptElement>, HTMLScriptElement>;
 }
@@ -90,0 +111,0 @@

dist/react/index.js

@@ -8,3 +8,3 @@ "use client";
 var name = "@dub/analytics";
-var version = "0.0.17";
+var version = "0.0.18";
 
@@ -17,6 +17,7 @@ // src/utils.tsx
 // src/generic.ts
-var src = "https://www.dubcdn.com/analytics/script.js";
 function inject(props) {
+  var _a, _b;
   if (!isBrowser())
     return;
+  const src = ((_a = props.scriptProps) == null ? void 0 : _a.src) || "https://www.dubcdn.com/analytics/script.js";
   if (document.head.querySelector(`script[src*="${src}"]`))
@@ -26,5 +27,11 @@ return;
   script.src = src;
-  script.defer = true;
+  script.defer = ((_b = props.scriptProps) == null ? void 0 : _b.defer) || true;
   script.setAttribute("data-sdkn", name);
   script.setAttribute("data-sdkv", version);
+  if (props.apiHost) {
+    script.setAttribute("data-api-host", props.apiHost);
+  }
+  if (props.attributionModel) {
+    script.setAttribute("data-attribution-model", props.attributionModel);
+  }
   if (props.cookieOptions && Object.keys(props.cookieOptions).length > 0) {
@@ -36,5 +43,8 @@ script.setAttribute(
   }
-  if (props.attributionModel) {
-    script.setAttribute("data-attribution-model", props.attributionModel);
+  if (props.queryParam) {
+    script.setAttribute("data-query-param", props.queryParam);
   }
+  if (props.scriptProps) {
+    Object.assign(script, props.scriptProps);
+  }
   script.onerror = () => {
@@ -41,0 +51,0 @@ console.log(`[Dub Web Analytics] failed to load script from ${src}.`);

package.json

 {
   "name": "@dub/analytics",
-  "version": "0.0.17",
+  "version": "0.0.18",
   "description": "",
@@ -5,0 +5,0 @@ "keywords": [

src/generic.ts

@@ -5,4 +5,2 @@ import { name, version } from '../package.json';
 
-const src = 'https://www.dubcdn.com/analytics/script.js';
-
 /**
@@ -14,2 +12,5 @@ * Injects the Dub Web Analytics script into the page head.
 
+  const src =
+    props.scriptProps?.src || 'https://www.dubcdn.com/analytics/script.js';
+
   if (document.head.querySelector(`script[src*="${src}"]`)) return;
@@ -19,9 +20,14 @@
   script.src = src;
-  script.defer = true;
+  script.defer = props.scriptProps?.defer || true;
   script.setAttribute('data-sdkn', name);
   script.setAttribute('data-sdkv', version);
 
-  // TODO:
-  // Merge the cookieOptions and attributionModel into options
+  if (props.apiHost) {
+    script.setAttribute('data-api-host', props.apiHost);
+  }
 
+  if (props.attributionModel) {
+    script.setAttribute('data-attribution-model', props.attributionModel);
+  }
+
   if (props.cookieOptions && Object.keys(props.cookieOptions).length > 0) {
@@ -34,6 +40,10 @@ script.setAttribute(
 
-  if (props.attributionModel) {
-    script.setAttribute('data-attribution-model', props.attributionModel);
+  if (props.queryParam) {
+    script.setAttribute('data-query-param', props.queryParam);
   }
 
+  if (props.scriptProps) {
+    Object.assign(script, props.scriptProps);
+  }
+
   script.onerror = (): void => {
@@ -40,0 +50,0 @@ // eslint-disable-next-line no-console -- Logging to console is intentional

src/types.ts

 export type AllowedPropertyValues = string | number | boolean | null;
 
 export interface AnalyticsProps {
+  /**
+   * The API endpoint to send analytics data to.
+   * @default 'https://api.dub.co'
+   */
+  apiHost?: string;
+
+  /**
+   * The Attribution Model to use for the analytics event.
+   *
+   * @default 'last-click'
+   *
+   * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
+   * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+   */
+  attributionModel?: 'first-click' | 'last-click';
+
+  /**
+   * The cookie options to use for the analytics event.
+   */
   cookieOptions?: {
     /**
      * Specifies the value for the {@link https://tools.ietf.org/html/rfc6265#section-5.2.3|Domain Set-Cookie attribute}. By default, no
-     * domain is set, and most clients will consider the cookie to apply to only
-     * the current domain.
+     * domain is set, and most clients will consider the cookie to apply to only the current domain.
+     * By default, the domain is set to the current hostname (including all subdomains).
+     *
+     * @default `.` + window.location.hostname
      */
@@ -90,10 +111,16 @@ domain?: string | undefined;
   /**
-   * The Attribution Model to use for the analytics event.
+   * The query parameter to listen to for client-side click-tracking (e.g. `?ref=abc123`)
    *
-   * @default 'last-click'
-   *
-   * - `first-click` - The first click model gives all the credit to the first touchpoint in the customer journey.
-   * - `last-click` - The last click model gives all the credit to the last touchpoint in the customer journey.
+   * @default 'ref'
    */
-  attributionModel?: 'first-click' | 'last-click';
+  queryParam?: string;
+
+  /**
+   * Custom properties to pass to the script.
+   * @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLScriptElement
+   */
+  scriptProps?: React.DetailedHTMLProps<
+    React.ScriptHTMLAttributes<HTMLScriptElement>,
+    HTMLScriptElement
+  >;
 }
@@ -100,0 +127,0 @@

No alert changes

Improved metrics

Total package byte prevSize

62927

increased by13.58%

Lines of code

736

increased by18.33%

No dependency changes