kmind-apm-web-react 0.1.0

package/dist/index.d.ts

@@ -0,0 +1,22 @@
+import { Component, ReactNode, ErrorInfo } from 'react';
+import { KmindConfig } from 'kmind-apm-web';
+
+declare function initKmindReact(config?: Partial<KmindConfig>): void;
+declare function useKmindRoute(route: string): void;
+declare class KmindErrorBoundary extends Component<{
+    children: ReactNode;
+    fallback?: ReactNode;
+}, {
+    failed: boolean;
+}> {
+    state: {
+        failed: boolean;
+    };
+    static getDerivedStateFromError(): {
+        failed: boolean;
+    };
+    componentDidCatch(error: Error, info: ErrorInfo): void;
+    render(): ReactNode;
+}
+
+export { KmindErrorBoundary, initKmindReact, useKmindRoute };

package/dist/index.js

@@ -0,0 +1,37 @@
+// src/index.tsx
+import { Component, useEffect, useRef } from "react";
+import { init, logger, recordMetric } from "kmind-apm-web";
+function viteEnv() {
+  return import.meta.env ?? {};
+}
+function initKmindReact(config = {}) {
+  const env = viteEnv();
+  init({ serviceName: config.serviceName ?? env.VITE_KMIND_SERVICE_NAME ?? "react-app", clientKey: config.clientKey ?? env.VITE_KMIND_CLIENT_KEY ?? "", endpoint: config.endpoint ?? env.VITE_KMIND_ENDPOINT, statusEndpoint: config.statusEndpoint ?? env.VITE_KMIND_STATUS_ENDPOINT, ...config });
+}
+function useKmindRoute(route) {
+  const previous = useRef(void 0);
+  useEffect(() => {
+    if (previous.current !== void 0 && previous.current !== route) recordMetric("navigation.route_change", 1, { route });
+    previous.current = route;
+  }, [route]);
+}
+var KmindErrorBoundary = class extends Component {
+  constructor() {
+    super(...arguments);
+    this.state = { failed: false };
+  }
+  static getDerivedStateFromError() {
+    return { failed: true };
+  }
+  componentDidCatch(error, info) {
+    logger.error(error.message, { "exception.stacktrace": error.stack ?? "", "react.component_stack": info.componentStack });
+  }
+  render() {
+    return this.state.failed ? this.props.fallback ?? null : this.props.children;
+  }
+};
+export {
+  KmindErrorBoundary,
+  initKmindReact,
+  useKmindRoute
+};

package/package.json

@@ -0,0 +1,12 @@
+{
+  "name": "kmind-apm-web-react",
+  "version": "0.1.0",
+  "type": "module",
+  "main": "dist/index.js",
+  "types": "dist/index.d.ts",
+  "exports": { ".": { "types": "./dist/index.d.ts", "import": "./dist/index.js" } },
+  "scripts": { "build": "tsup" },
+  "dependencies": { "kmind-apm-web": "*" },
+  "peerDependencies": { "react": ">=18" },
+  "devDependencies": { "@types/react": "^19.1.2", "react": "^19.1.0", "tsup": "^8.5.0", "typescript": "^5.8.3" }
+}

package/src/index.tsx

@@ -0,0 +1,16 @@
+import { Component, type ErrorInfo, type ReactNode, useEffect, useRef } from "react";
+import { init, logger, recordMetric, type KmindConfig } from "kmind-apm-web";
+
+type PublicEnv = Record<string, string | undefined>;
+function viteEnv(): PublicEnv { return (import.meta as ImportMeta & { env?: PublicEnv }).env ?? {}; }
+export function initKmindReact(config: Partial<KmindConfig> = {}): void {
+  const env = viteEnv();
+  init({ serviceName: config.serviceName ?? env.VITE_KMIND_SERVICE_NAME ?? "react-app", clientKey: config.clientKey ?? env.VITE_KMIND_CLIENT_KEY ?? "", endpoint: config.endpoint ?? env.VITE_KMIND_ENDPOINT, statusEndpoint: config.statusEndpoint ?? env.VITE_KMIND_STATUS_ENDPOINT, ...config });
+}
+export function useKmindRoute(route: string): void { const previous = useRef<string | undefined>(undefined); useEffect(() => { if (previous.current !== undefined && previous.current !== route) recordMetric("navigation.route_change", 1, { route }); previous.current = route; }, [route]); }
+export class KmindErrorBoundary extends Component<{ children: ReactNode; fallback?: ReactNode }, { failed: boolean }> {
+  state = { failed: false };
+  static getDerivedStateFromError() { return { failed: true }; }
+  componentDidCatch(error: Error, info: ErrorInfo) { logger.error(error.message, { "exception.stacktrace": error.stack ?? "", "react.component_stack": info.componentStack }); }
+  render() { return this.state.failed ? this.props.fallback ?? null : this.props.children; }
+}

package/tsconfig.json

@@ -0,0 +1 @@
+{ "compilerOptions": { "target": "ES2020", "module": "ESNext", "moduleResolution": "Bundler", "strict": true, "jsx": "react-jsx", "declaration": true, "lib": ["DOM", "ES2020"], "skipLibCheck": true }, "include": ["src"] }

package/tsup.config.ts

@@ -0,0 +1,2 @@
+import { defineConfig } from "tsup";
+export default defineConfig({ entry: ["src/index.tsx"], format: ["esm"], dts: true, target: "es2020", clean: true, external: ["react", "react/jsx-runtime", "kmind-apm-web"] });