@ytspar/devbar 1.0.0-canary.3007fc6 → 1.0.0-canary.45bdaca

package/dist/GlobalDevBar.d.ts

@@ -7,11 +7,16 @@
  * This is a vanilla JS replacement for the React-based GlobalDevBar component
  * to avoid React dependency conflicts in host applications.
  */
-import type { ConsoleLog, DevBarControl, GlobalDevBarOptions, OutlineNode, PageSchema, SweetlinkCommand } from './types.js';
-export type { ConsoleLog, SweetlinkCommand, OutlineNode, PageSchema, GlobalDevBarOptions, DevBarControl, };
+import { getThemeColors } from './constants.js';
+import type { ConsoleLog, DebugConfig, DevBarControl, GlobalDevBarOptions, OutlineNode, PageSchema, SweetlinkCommand, ThemeMode } from './types.js';
+export type { ConsoleLog, DebugConfig, SweetlinkCommand, OutlineNode, PageSchema, GlobalDevBarOptions, DevBarControl, ThemeMode, };
+export type { DevBarPosition, DevBarSettings, MetricsVisibility } from './settings.js';
+export { ACCENT_COLOR_PRESETS, DEFAULT_SETTINGS, getSettingsManager } from './settings.js';
+type LogChangeListener = (errorCount: number, warningCount: number, infoCount: number) => void;
 interface EarlyConsoleCapture {
     errorCount: number;
     warningCount: number;
+    infoCount: number;
     logs: ConsoleLog[];
     originalConsole: {
         log: typeof console.log;
@@ -20,11 +25,16 @@ interface EarlyConsoleCapture {
         info: typeof console.info;
     } | null;
     isPatched: boolean;
+    listeners: LogChangeListener[];
+    addListener: (listener: LogChangeListener) => void;
+    removeListener: (listener: LogChangeListener) => void;
 }
 declare const earlyConsoleCapture: EarlyConsoleCapture;
 export declare class GlobalDevBar {
     private static customControls;
     private options;
+    private debugConfig;
+    private debug;
     private container;
     private ws;
     private consoleLogs;
@@ -41,13 +51,22 @@ export declare class GlobalDevBar {
     private apiKeyStatus;
     private lastOutline;
     private lastSchema;
+    private savingOutline;
+    private savingSchema;
     private consoleFilter;
     private showOutlineModal;
     private showSchemaModal;
+    private activeTooltips;
     private breakpointInfo;
     private perfStats;
     private lcpValue;
+    private clsValue;
+    private inpValue;
     private reconnectAttempts;
+    private readonly currentAppPort;
+    private readonly baseWsPort;
+    private wsVerified;
+    private serverProjectDir;
     private lastDotPosition;
     private reconnectTimeout;
     private screenshotTimeout;
@@ -60,17 +79,30 @@ export declare class GlobalDevBar {
     private keydownHandler;
     private fcpObserver;
     private lcpObserver;
+    private clsObserver;
+    private inpObserver;
     private destroyed;
+    private themeMode;
+    private themeMediaQuery;
+    private themeMediaHandler;
+    private compactMode;
+    private showSettingsPopover;
     private overlayElement;
+    private settingsManager;
+    private logChangeListener;
     constructor(options?: GlobalDevBarOptions);
     /**
      * Get tooltip class name(s) if tooltips are enabled, otherwise empty string
      */
     private tooltipClass;
     /**
-     * Get current error and warning counts from the log array
+     * Get current error, warning, and info counts from the log array
      */
     private getLogCounts;
+    /**
+     * Reset position style properties on an element to clear stale values
+     */
+    private resetPositionStyles;
     /**
      * Create a collapsed count badge (used for error/warning counts in minimized state)
      */
@@ -106,13 +138,50 @@ export declare class GlobalDevBar {
     private injectStyles;
     private connectWebSocket;
     private handleSweetlinkCommand;
+    /**
+     * Handle settings loaded from server
+     */
+    private handleSettingsLoaded;
+    /**
+     * Apply settings to the DevBar state and options
+     */
+    private applySettings;
     /**
      * Handle notification state updates with auto-clear timeout
      */
     private handleNotification;
     private setupBreakpointDetection;
+    /**
+     * Get which metrics should be visible vs hidden based on available space.
+     * Dynamically calculates based on window width, number of badges, and other elements.
+     * Returns metrics in display order (FCP, LCP, CLS, INP, pageSize).
+     * Hides metrics in reverse priority order (pageSize first, then INP, CLS, LCP, FCP).
+     */
+    private getResponsiveMetricVisibility;
     private setupPerformanceMonitoring;
     private setupKeyboardShortcuts;
+    private setupTheme;
+    private loadCompactMode;
+    /**
+     * Get the current theme mode
+     */
+    getThemeMode(): ThemeMode;
+    /**
+     * Set the theme mode
+     */
+    setThemeMode(mode: ThemeMode): void;
+    /**
+     * Get the current effective theme colors
+     */
+    getColors(): ReturnType<typeof getThemeColors>;
+    /**
+     * Toggle compact mode
+     */
+    toggleCompactMode(): void;
+    /**
+     * Check if compact mode is enabled
+     */
+    isCompactMode(): boolean;
     private copyPathToClipboard;
     private handleScreenshot;
     private handleDesignReview;
@@ -177,21 +246,89 @@ export declare class GlobalDevBar {
      * Render key-value pairs as rows with ellipsis overflow and hover tooltip
      */
     private renderKeyValueItems;
-    private renderCollapsed;
-    private renderExpanded;
     /**
-     * Create a console badge for error/warning counts
+     * Render compact mode - single row with essential controls only
+     * Shows: connection dot, error/warn badges, screenshot button, settings gear
      */
-    private createConsoleBadge;
-    private createScreenshotButton;
+    private renderCompact;
+    /**
+     * Create the settings gear button
+     */
+    private createSettingsButton;
     /**
-     * Get the tooltip text for the screenshot button based on current state
+     * Create the compact mode toggle button with chevron icon
      */
-    private getScreenshotTooltip;
+    private createCompactToggleButton;
     /**
-     * Get the tooltip text for the AI review button based on current state
+     * Create a settings section with title
      */
-    private getAIReviewTooltip;
+    private createSettingsSection;
+    /**
+     * Create a toggle switch row
+     */
+    private createToggleRow;
+    /**
+     * Render the settings popover
+     */
+    private renderSettingsPopover;
+    /**
+     * Reset all settings to defaults
+     */
+    private resetToDefaults;
+    private renderCollapsed;
+    private renderExpanded;
+    /** Base styles for tooltip containers */
+    private readonly TOOLTIP_BASE_STYLES;
+    /** Create a tooltip container element and track it for cleanup */
+    private createTooltipContainer;
+    /** Remove a tooltip and untrack it */
+    private removeTooltip;
+    /** Clear all active tooltips (called on re-render) */
+    private clearAllTooltips;
+    /** Add a bold title to tooltip (metric name, feature name, etc.) */
+    private addTooltipTitle;
+    /** Add a description paragraph to tooltip */
+    private addTooltipDescription;
+    /** Add a muted uppercase section header to tooltip */
+    private addTooltipSectionHeader;
+    /** Add a colored row with dot + label + value (for thresholds) */
+    private addTooltipColoredRow;
+    /** Add an info row with label + value (for breakpoint details) */
+    private addTooltipInfoRow;
+    /** Position tooltip above the anchor element, adjusting for screen edges */
+    private positionTooltip;
+    /** Attach an HTML tooltip to an element with custom content builder */
+    private attachHtmlTooltip;
+    /**
+     * Attach an HTML tooltip with click-to-toggle support for mobile.
+     * - Click toggles tooltip open/closed (pinned state)
+     * - Hover opens tooltip on mouseenter (if not pinned)
+     * - Hover closes tooltip on mouseleave (if not pinned)
+     */
+    private attachClickToggleTooltip;
+    /** Attach a metric tooltip with title, description, and colored thresholds */
+    private attachMetricTooltip;
+    /** Attach a breakpoint tooltip showing current breakpoint and all breakpoint ranges */
+    private attachBreakpointTooltip;
+    /** Attach a simple info tooltip with title and description */
+    private attachInfoTooltip;
+    /** Add a keyboard shortcut row to tooltip */
+    private addTooltipShortcut;
+    /** Add a warning message to tooltip */
+    private addTooltipWarning;
+    /** Add a success status message to tooltip */
+    private addTooltipSuccess;
+    /** Add an error status message to tooltip */
+    private addTooltipError;
+    /** Add a "in progress" status to tooltip */
+    private addTooltipProgress;
+    /** Attach a button tooltip with custom title color */
+    private attachButtonTooltip;
+    /**
+     * Create a console badge for error/warning/info counts
+     */
+    private createConsoleBadge;
+    private createScreenshotButton;
     private createAIReviewButton;
     private createOutlineButton;
     private createSchemaButton;
@@ -212,3 +349,4 @@ export declare function getGlobalDevBar(): GlobalDevBar | null;
  */
 export declare function destroyGlobalDevBar(): void;
 export { earlyConsoleCapture };
+//# sourceMappingURL=GlobalDevBar.d.ts.map

package/dist/GlobalDevBar.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"GlobalDevBar.d.ts","sourceRoot":"","sources":["../src/GlobalDevBar.ts"],"names":[],"mappings":"AAAA;;;;;;;;GAQG;AAGH,OAAO,EAWL,cAAc,EAgBf,MAAM,gBAAgB,CAAC;AAYxB,OAAO,KAAK,EACV,UAAU,EACV,WAAW,EACX,aAAa,EACb,mBAAmB,EACnB,WAAW,EACX,UAAU,EACV,gBAAgB,EAChB,SAAS,EACV,MAAM,YAAY,CAAC;AAqBpB,YAAY,EACV,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,WAAW,EACX,UAAU,EACV,mBAAmB,EACnB,aAAa,EACb,SAAS,GACV,CAAC;AAGF,YAAY,EAAE,cAAc,EAAE,cAAc,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACvF,OAAO,EAAE,oBAAoB,EAAE,gBAAgB,EAAE,kBAAkB,EAAE,MAAM,eAAe,CAAC;AAqB3F,KAAK,iBAAiB,GAAG,CAAC,UAAU,EAAE,MAAM,EAAE,YAAY,EAAE,MAAM,EAAE,SAAS,EAAE,MAAM,KAAK,IAAI,CAAC;AAE/F,UAAU,mBAAmB;IAC3B,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,SAAS,EAAE,MAAM,CAAC;IAClB,IAAI,EAAE,UAAU,EAAE,CAAC;IACnB,eAAe,EAAE;QACf,GAAG,EAAE,OAAO,OAAO,CAAC,GAAG,CAAC;QACxB,KAAK,EAAE,OAAO,OAAO,CAAC,KAAK,CAAC;QAC5B,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;QAC1B,IAAI,EAAE,OAAO,OAAO,CAAC,IAAI,CAAC;KAC3B,GAAG,IAAI,CAAC;IACT,SAAS,EAAE,OAAO,CAAC;IACnB,SAAS,EAAE,iBAAiB,EAAE,CAAC;IAC/B,WAAW,EAAE,CAAC,QAAQ,EAAE,iBAAiB,KAAK,IAAI,CAAC;IACnD,cAAc,EAAE,CAAC,QAAQ,EAAE,iBAAiB,KAAK,IAAI,CAAC;CACvD;AAED,QAAA,MAAM,mBAAmB,EAAE,mBAoFvB,CAAC;AAeL,qBAAa,YAAY;IAEvB,OAAO,CAAC,MAAM,CAAC,cAAc,CAAuB;IAEpD,OAAO,CAAC,OAAO,CAC8B;IAC7C,OAAO,CAAC,WAAW,CAAe;IAClC,OAAO,CAAC,KAAK,CAAe;IAC5B,OAAO,CAAC,SAAS,CAA+B;IAChD,OAAO,CAAC,EAAE,CAA0B;IACpC,OAAO,CAAC,WAAW,CAAoB;IACvC,OAAO,CAAC,kBAAkB,CAAS;IACnC,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,SAAS,CAAS;IAC1B,OAAO,CAAC,iBAAiB,CAAS;IAClC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,cAAc,CAAuB;IAC7C,OAAO,CAAC,sBAAsB,CAAS;IACvC,OAAO,CAAC,gBAAgB,CAAuB;IAC/C,OAAO,CAAC,iBAAiB,CAAuB;IAChD,OAAO,CAAC,uBAAuB,CAAS;IACxC,OAAO,CAAC,YAAY,CAKJ;IAChB,OAAO,CAAC,WAAW,CAAuB;IAC1C,OAAO,CAAC,UAAU,CAAuB;IACzC,OAAO,CAAC,aAAa,CAAS;IAC9B,OAAO,CAAC,YAAY,CAAS;IAC7B,OAAO,CAAC,aAAa,CAA0C;IAG/D,OAAO,CAAC,gBAAgB,CAAS;IACjC,OAAO,CAAC,eAAe,CAAS;IAGhC,OAAO,CAAC,cAAc,CAA6B;IAEnD,OAAO,CAAC,cAAc,CAAmE;IACzF,OAAO,CAAC,SAAS,CAMD;IAChB,OAAO,CAAC,QAAQ,CAAuB;IACvC,OAAO,CAAC,QAAQ,CAAK;IACrB,OAAO,CAAC,QAAQ,CAAK;IAErB,OAAO,CAAC,iBAAiB,CAAK;IAG9B,OAAO,CAAC,QAAQ,CAAC,cAAc,CAAS;IACxC,OAAO,CAAC,QAAQ,CAAC,UAAU,CAAS;IACpC,OAAO,CAAC,UAAU,CAAS;IAC3B,OAAO,CAAC,gBAAgB,CAAuB;IAG/C,OAAO,CAAC,eAAe,CAA8D;IAErF,OAAO,CAAC,gBAAgB,CAA8C;IACtE,OAAO,CAAC,iBAAiB,CAA8C;IACvE,OAAO,CAAC,iBAAiB,CAA8C;IACvE,OAAO,CAAC,mBAAmB,CAA8C;IACzE,OAAO,CAAC,wBAAwB,CAA8C;IAC9E,OAAO,CAAC,cAAc,CAA8C;IACpE,OAAO,CAAC,aAAa,CAA8C;IAEnE,OAAO,CAAC,aAAa,CAA6B;IAClD,OAAO,CAAC,cAAc,CAA6C;IACnE,OAAO,CAAC,WAAW,CAAoC;IACvD,OAAO,CAAC,WAAW,CAAoC;IACvD,OAAO,CAAC,WAAW,CAAoC;IACvD,OAAO,CAAC,WAAW,CAAoC;IACvD,OAAO,CAAC,SAAS,CAAS;IAG1B,OAAO,CAAC,SAAS,CAAuB;IACxC,OAAO,CAAC,eAAe,CAA+B;IACtD,OAAO,CAAC,iBAAiB,CAAmD;IAG5E,OAAO,CAAC,WAAW,CAAS;IAG5B,OAAO,CAAC,mBAAmB,CAAS;IAGpC,OAAO,CAAC,cAAc,CAA+B;IAGrD,OAAO,CAAC,eAAe,CAAkB;IAGzC,OAAO,CAAC,iBAAiB,CAAkC;gBAE/C,OAAO,GAAE,mBAAwB;IAuC7C;;OAEG;IACH,OAAO,CAAC,YAAY;IAUpB;;OAEG;IACH,OAAO,CAAC,YAAY;IAapB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAI3B;;OAEG;IACH,OAAO,CAAC,oBAAoB;IA0B5B;;OAEG;IACH,MAAM,CAAC,eAAe,CAAC,OAAO,EAAE,aAAa,GAAG,IAAI;IAWpD;;OAEG;IACH,MAAM,CAAC,iBAAiB,CAAC,EAAE,EAAE,MAAM,GAAG,IAAI;IAS1C;;OAEG;IACH,MAAM,CAAC,WAAW,IAAI,aAAa,EAAE;IAIrC;;OAEG;IACH,MAAM,CAAC,aAAa,IAAI,IAAI;IAQ5B;;OAEG;IACH,IAAI,IAAI,IAAI;IA4CZ;;OAEG;IACH,WAAW,IAAI,MAAM;IAIrB;;OAEG;IACH,OAAO,IAAI,IAAI;IA0Df,OAAO,CAAC,YAAY;IAUpB,OAAO,CAAC,gBAAgB;YAsGV,sBAAsB;IA8IpC;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAe5B;;OAEG;IACH,OAAO,CAAC,aAAa;IAiBrB;;OAEG;IACH,OAAO,CAAC,kBAAkB;IA+C1B,OAAO,CAAC,wBAAwB;IA4BhC;;;;;OAKG;IACH,OAAO,CAAC,6BAA6B;IAkErC,OAAO,CAAC,0BAA0B;IAyHlC,OAAO,CAAC,sBAAsB;IAkD9B,OAAO,CAAC,UAAU;IA6BlB,OAAO,CAAC,eAAe;IAMvB;;OAEG;IACH,YAAY,IAAI,SAAS;IAIzB;;OAEG;IACH,YAAY,CAAC,IAAI,EAAE,SAAS,GAAG,IAAI;IAenC;;OAEG;IACH,SAAS,IAAI,UAAU,CAAC,OAAO,cAAc,CAAC;IAI9C;;OAEG;IACH,iBAAiB,IAAI,IAAI;IAOzB;;OAEG;IACH,aAAa,IAAI,OAAO;YAIV,mBAAmB;YAenB,gBAAgB;YA6FhB,kBAAkB;IAsDhC;;;OAGG;IACH,OAAO,CAAC,4BAA4B;IAgBpC;;OAEG;IACH,OAAO,CAAC,qBAAqB;IA2B7B;;OAEG;IACH,OAAO,CAAC,wBAAwB;IAMhC;;OAEG;IACH,OAAO,CAAC,uBAAuB;IAK/B,OAAO,CAAC,qBAAqB;IAQ7B,OAAO,CAAC,gBAAgB;IAQxB,OAAO,CAAC,iBAAiB;IAyBzB,OAAO,CAAC,gBAAgB;IAyBxB,OAAO,CAAC,gBAAgB;IAexB,OAAO,CAAC,MAAM;IAoCd,OAAO,CAAC,cAAc;IAiCtB,OAAO,CAAC,8BAA8B;IAuFtC;;OAEG;IACH,OAAO,CAAC,gCAAgC;IA+CxC;;OAEG;IACH,OAAO,CAAC,6BAA6B;IAwDrC,OAAO,CAAC,kBAAkB;IAkG1B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAgCzB,OAAO,CAAC,kBAAkB;IA0C1B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAyD1B,OAAO,CAAC,iBAAiB;IAmDzB;;OAEG;IACH,OAAO,CAAC,mBAAmB;IAiC3B;;OAEG;IACH,OAAO,CAAC,iBAAiB;IAgCzB;;;OAGG;IACH,OAAO,CAAC,qBAAqB;IAuD7B;;OAEG;IACH,OAAO,CAAC,mBAAmB;IA4C3B;;;OAGG;IACH,OAAO,CAAC,aAAa;IAoIrB;;OAEG;IACH,OAAO,CAAC,oBAAoB;IAqE5B;;OAEG;IACH,OAAO,CAAC,yBAAyB;IAiEjC;;OAEG;IACH,OAAO,CAAC,qBAAqB;IAsB7B;;OAEG;IACH,OAAO,CAAC,eAAe;IAqDvB;;OAEG;IACH,OAAO,CAAC,qBAAqB;IA6V7B;;OAEG;IACH,OAAO,CAAC,eAAe;IAMvB,OAAO,CAAC,eAAe;IA6IvB,OAAO,CAAC,cAAc;IAubtB,yCAAyC;IACzC,OAAO,CAAC,QAAQ,CAAC,mBAAmB,CAYzB;IAEX,kEAAkE;IAClE,OAAO,CAAC,sBAAsB;IAS9B,sCAAsC;IACtC,OAAO,CAAC,aAAa;IAKrB,sDAAsD;IACtD,OAAO,CAAC,gBAAgB;IAOxB,oEAAoE;IACpE,OAAO,CAAC,eAAe;IAYvB,6CAA6C;IAC7C,OAAO,CAAC,qBAAqB;IAW7B,sDAAsD;IACtD,OAAO,CAAC,uBAAuB;IAa/B,kEAAkE;IAClE,OAAO,CAAC,oBAAoB;IAqC5B,kEAAkE;IAClE,OAAO,CAAC,iBAAiB;IAqBzB,4EAA4E;IAC5E,OAAO,CAAC,eAAe;IAiCvB,uEAAuE;IACvE,OAAO,CAAC,iBAAiB;IAqCzB;;;;;OAKG;IACH,OAAO,CAAC,wBAAwB;IA0FhC,8EAA8E;IAC9E,OAAO,CAAC,mBAAmB;IA+B3B,uFAAuF;IACvF,OAAO,CAAC,uBAAuB;IA+D/B,8DAA8D;IAC9D,OAAO,CAAC,iBAAiB;IAczB,6CAA6C;IAC7C,OAAO,CAAC,kBAAkB;IAyB1B,uCAAuC;IACvC,OAAO,CAAC,iBAAiB;IA2BzB,8CAA8C;IAC9C,OAAO,CAAC,iBAAiB;IAuCzB,6CAA6C;IAC7C,OAAO,CAAC,eAAe;IAyCvB,4CAA4C;IAC5C,OAAO,CAAC,kBAAkB;IA6B1B,sDAAsD;IACtD,OAAO,CAAC,mBAAmB;IA0C3B;;OAEG;IACH,OAAO,CAAC,kBAAkB;IAyC1B,OAAO,CAAC,sBAAsB;IA+G9B,OAAO,CAAC,oBAAoB;IAkE5B,OAAO,CAAC,mBAAmB;IAoC3B,OAAO,CAAC,kBAAkB;CAsC3B;AAmBD;;;;;GAKG;AACH,wBAAgB,gBAAgB,CAAC,OAAO,CAAC,EAAE,mBAAmB,GAAG,YAAY,CAiB5E;AAED;;GAEG;AACH,wBAAgB,eAAe,IAAI,YAAY,GAAG,IAAI,CAErD;AAED;;GAEG;AACH,wBAAgB,mBAAmB,IAAI,IAAI,CAM1C;AAGD,OAAO,EAAE,mBAAmB,EAAE,CAAC"}