@easemate/web-kit 0.1.0

package/build/elements/monitor/index.d.cts

@@ -0,0 +1,112 @@
+import type { MonitorFpsDetail } from "./fps.cjs";
+import { type TemplateResult } from 'lit-html';
+import "./fps.cjs";
+type CoreWebVitals = {
+    LCP: number | null;
+    INP: number | null;
+    CLS: number;
+    FCP: number | null;
+    TBT: number;
+};
+type NavigationMetrics = {
+    ttfb: number | null;
+    domInteractive: number | null;
+    loadTime: number | null;
+};
+type ResourceSummary = {
+    js: {
+        count: number;
+        size: number;
+    };
+    css: {
+        count: number;
+        size: number;
+    };
+    img: {
+        count: number;
+        size: number;
+    };
+    other: {
+        count: number;
+        size: number;
+    };
+    totalSize: number;
+};
+type MemoryUsage = {
+    jsHeapSizeLimit: number;
+    totalJSHeapSize: number;
+    usedJSHeapSize: number;
+} | null;
+interface PerformanceMetrics {
+    coreWebVitals: CoreWebVitals;
+    navigation: NavigationMetrics;
+    resources: ResourceSummary;
+    memory: MemoryUsage;
+    fps: number | null;
+    longTasks: {
+        count: number;
+        totalDuration: number;
+    };
+}
+interface ConnectionInfo {
+    effectiveType: string;
+    rtt: number;
+}
+declare global {
+    interface Performance {
+        memory?: {
+            jsHeapSizeLimit: number;
+            totalJSHeapSize: number;
+            usedJSHeapSize: number;
+        };
+    }
+    interface Navigator {
+        connection?: {
+            effectiveType: string;
+            rtt: number;
+            addEventListener: (type: string, listener: EventListener) => void;
+            removeEventListener: (type: string, listener: EventListener) => void;
+        };
+    }
+}
+export declare class Monitor extends HTMLElement {
+    requestRender: () => void;
+    accessor metrics: PerformanceMetrics;
+    accessor network: ConnectionInfo;
+    private observers;
+    private memoryInterval;
+    private clsEntries;
+    private inpEntries;
+    private maxINP;
+    private longTaskEntries;
+    private trendHistory;
+    private maxTrendLength;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    handleFpsUpdate(event: CustomEvent<MonitorFpsDetail>): void;
+    private handlePageLoad;
+    private initObservers;
+    private collectInitialMetrics;
+    private collectNavigationTiming;
+    private processPerformanceEntry;
+    private calculateSessionWindowCLS;
+    private processResourceEntries;
+    private calculateLongTasksAndTBT;
+    private startMemoryMonitoring;
+    private stopMemoryMonitoring;
+    private initNetworkMonitoring;
+    private stopNetworkMonitoring;
+    private updateNetworkInfo;
+    private updateTrend;
+    private getTrendDirection;
+    private getOverallStatus;
+    render(): TemplateResult;
+    private renderExpanded;
+    private renderMetricBox;
+    private renderVitalsAndTiming;
+    private renderRealtime;
+    private renderMemory;
+    private renderNetworkInfo;
+    private renderResources;
+}
+export {};

package/build/elements/monitor/index.d.ts

@@ -0,0 +1,112 @@
+import type { MonitorFpsDetail } from "./fps.js";
+import { type TemplateResult } from 'lit-html';
+import "./fps.js";
+type CoreWebVitals = {
+    LCP: number | null;
+    INP: number | null;
+    CLS: number;
+    FCP: number | null;
+    TBT: number;
+};
+type NavigationMetrics = {
+    ttfb: number | null;
+    domInteractive: number | null;
+    loadTime: number | null;
+};
+type ResourceSummary = {
+    js: {
+        count: number;
+        size: number;
+    };
+    css: {
+        count: number;
+        size: number;
+    };
+    img: {
+        count: number;
+        size: number;
+    };
+    other: {
+        count: number;
+        size: number;
+    };
+    totalSize: number;
+};
+type MemoryUsage = {
+    jsHeapSizeLimit: number;
+    totalJSHeapSize: number;
+    usedJSHeapSize: number;
+} | null;
+interface PerformanceMetrics {
+    coreWebVitals: CoreWebVitals;
+    navigation: NavigationMetrics;
+    resources: ResourceSummary;
+    memory: MemoryUsage;
+    fps: number | null;
+    longTasks: {
+        count: number;
+        totalDuration: number;
+    };
+}
+interface ConnectionInfo {
+    effectiveType: string;
+    rtt: number;
+}
+declare global {
+    interface Performance {
+        memory?: {
+            jsHeapSizeLimit: number;
+            totalJSHeapSize: number;
+            usedJSHeapSize: number;
+        };
+    }
+    interface Navigator {
+        connection?: {
+            effectiveType: string;
+            rtt: number;
+            addEventListener: (type: string, listener: EventListener) => void;
+            removeEventListener: (type: string, listener: EventListener) => void;
+        };
+    }
+}
+export declare class Monitor extends HTMLElement {
+    requestRender: () => void;
+    accessor metrics: PerformanceMetrics;
+    accessor network: ConnectionInfo;
+    private observers;
+    private memoryInterval;
+    private clsEntries;
+    private inpEntries;
+    private maxINP;
+    private longTaskEntries;
+    private trendHistory;
+    private maxTrendLength;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    handleFpsUpdate(event: CustomEvent<MonitorFpsDetail>): void;
+    private handlePageLoad;
+    private initObservers;
+    private collectInitialMetrics;
+    private collectNavigationTiming;
+    private processPerformanceEntry;
+    private calculateSessionWindowCLS;
+    private processResourceEntries;
+    private calculateLongTasksAndTBT;
+    private startMemoryMonitoring;
+    private stopMemoryMonitoring;
+    private initNetworkMonitoring;
+    private stopNetworkMonitoring;
+    private updateNetworkInfo;
+    private updateTrend;
+    private getTrendDirection;
+    private getOverallStatus;
+    render(): TemplateResult;
+    private renderExpanded;
+    private renderMetricBox;
+    private renderVitalsAndTiming;
+    private renderRealtime;
+    private renderMemory;
+    private renderNetworkInfo;
+    private renderResources;
+}
+export {};