@safaricom-mxl/nextjs/dist/index.js

MXL Javascript RUM agent for nextjs

var __getOwnPropNames = Object.getOwnPropertyNames;
var __commonJS = (cb, mod) => function __require() {
  return mod || (0, cb[__getOwnPropNames(cb)[0]])((mod = { exports: {} }).exports, mod), mod.exports;
};

// package.json
var require_package = __commonJS({
  "package.json"(exports, module) {
    module.exports = {
      name: "@safaricom-mxl/nextjs",
      version: "0.0.61",
      description: "MXL Javascript RUM agent for nextjs",
      main: "./dist/index.js",
      type: "module",
      scripts: {
        test: "vitest",
        dev: "rm -rf /dist && tsup --watch",
        build: "rm -rf dist && tsup",
        clean: "git clean -xdf .turbo node_modules coverage dist tmp",
        format: "biome format .",
        lint: "biome check ."
      },
      keywords: [
        "mxl",
        "event tracker",
        "web analytics",
        "analytics"
      ],
      author: "Francis Masha",
      license: "MIT",
      exports: {
        ".": {
          browser: "./dist/index.js",
          import: "./dist/index.js",
          require: "./dist/index.cjs"
        },
        "./server": {
          import: "./dist/server.cjs",
          default: "./dist/server.js"
        }
      },
      typesVersions: {
        "*": {
          "*": [
            "dist/index.d.ts",
            "dist/server.d.ts"
          ]
        }
      },
      types: "dist/index.d.ts",
      files: [
        "dist",
        "package.json",
        "LICENSE"
      ],
      devDependencies: {
        "@safaricom-mxl/tsconfig": "workspace:*",
        "@types/node": "^22.13.11",
        "@types/react": "19.0.12",
        "@types/react-dom": "19.0.4",
        "@vitest/browser": "^3.0.9",
        react: "19.0.0",
        tsup: "^8.4.0",
        typescript: "^5.8.2",
        vitest: "^3.0.9"
      },
      peerDependencies: {
        next: "^12.0.0 || ^13.0.0 || ^14.0.0 || ^15.0.0",
        react: "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0",
        "react-dom": "^16.8.0 || ^17.0.0 || ^18.0.0 || ^19.0.0"
      },
      publishConfig: {
        access: "public"
      },
      dependencies: {
        "@safaricom-mxl/browser": "workspace:*",
        "server-only": "^0.0.1"
      },
      peerDependenciesMeta: {
        next: {
          optional: true
        },
        react: {
          optional: true
        }
      }
    };
  }
});

// src/index.tsx
import Script from "next/script";
import React from "react";
export * from "@safaricom-mxl/browser";
var packageJson = require_package();
var SCRIPT_URL = "http://mxl-scripts.service-availability.apps.ocpthikadev01.safaricom.net/v1/mxl.js";
var OTEL_WEB_URL = "http://mxl-scripts.service-availability.apps.ocpthikadev01.safaricom.net/v1/otel-web.js";
var stringify = (obj) => {
  if (typeof obj === "object" && obj !== null && obj !== void 0) {
    const entries = Object.entries(obj).map(([key, value]) => {
      if (key === "filter") {
        return `"${key}":${value}`;
      }
      return `"${key}":${JSON.stringify(value)}`;
    });
    return `{${entries.join(",")}}`;
  }
  return JSON.stringify(obj);
};
function MxlAnalyticsComponent({
  profileId,
  cdnUrl,
  globalProperties,
  injectOtelWeb,
  ...options
}) {
  const methods = [
    {
      name: "init",
      value: {
        ...options,
        sdk: "nextjs",
        sdkVersion: packageJson.version
      }
    }
  ];
  if (profileId) {
    methods.push({
      name: "identify",
      value: {
        profileId
      }
    });
  }
  if (globalProperties) {
    methods.push({
      name: "setGlobalProperties",
      value: globalProperties
    });
  }
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(Script, { src: cdnUrl ?? SCRIPT_URL, async: true, defer: true }), injectOtelWeb && /* @__PURE__ */ React.createElement(Script, { src: OTEL_WEB_URL, async: true, defer: true }), /* @__PURE__ */ React.createElement(
    Script,
    {
      dangerouslySetInnerHTML: {
        __html: `window.mxl = window.mxl || function(...args) {(window.mxl.q = window.mxl.q || []).push(args)};
          ${methods.map((method) => {
          return `window.mxl('${method.name}', ${stringify(method.value)});`;
        }).join("\n")}`
      }
    }
  ));
}
function IdentifyComponent(props) {
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
    Script,
    {
      dangerouslySetInnerHTML: {
        __html: `window.mxl('identify', ${JSON.stringify(props)});`
      }
    }
  ));
}
function SetGlobalPropertiesComponent(props) {
  return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
    Script,
    {
      dangerouslySetInnerHTML: {
        __html: `window.mxl('setGlobalProperties', ${JSON.stringify(props)});`
      }
    }
  ));
}
function useMxlAnalytics() {
  return {
    track,
    screenView,
    identify,
    increment,
    decrement,
    clear,
    setGlobalProperties
  };
}
function setGlobalProperties(properties) {
  window.mxl?.("setGlobalProperties", properties);
}
function track(name, properties) {
  window.mxl?.("track", name, properties);
}
function screenView(pathOrProperties, propertiesOrUndefined) {
  window.mxl?.("screenView", pathOrProperties, propertiesOrUndefined);
}
function identify(payload) {
  window.mxl?.("identify", payload);
}
function increment(payload) {
  window.mxl?.("increment", payload);
}
function decrement(payload) {
  window.mxl?.("decrement", payload);
}
function clear() {
  window.mxl?.("clear");
}
export {
  IdentifyComponent,
  MxlAnalyticsComponent,
  SetGlobalPropertiesComponent,
  useMxlAnalytics
};