@expofp/debug 3.0.0-alpha.3 → 3.0.0-alpha.4

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expofp/debug",
-  "version": "3.0.0-alpha.3",
+  "version": "3.0.0-alpha.4",
   "type": "module",
   "description": "ExpoFP SDK internal: debug utilities",
   "license": "MIT",

package/dist/lib/debugUi/DebugOverlay.d.ts

@@ -1,7 +0,0 @@
-import '@radix-ui/themes/styles.css';
-interface DebugPanelProps {
-    onClose?: () => void;
-}
-export declare const DebugOverlay: ({ onClose }: DebugPanelProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=DebugOverlay.d.ts.map

package/dist/lib/debugUi/DebugOverlay.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import '@radix-ui/themes/styles.css';
-import { Box, Container, Theme } from '@radix-ui/themes';
-import { DebugTabs } from './DebugTabs.js';
-export const DebugOverlay = ({ onClose }) => {
-    return (_jsx(Theme, { appearance: "dark", children: _jsx(Box, { position: "fixed", top: "0", right: "0", width: "100vw", height: "100dvh", overflowY: "auto", style: { backgroundColor: 'black' }, children: _jsx(Container, { size: "4", px: "2", children: _jsx(DebugTabs, { onClose: onClose }) }) }) }));
-};

package/dist/lib/debugUi/DebugTabs.d.ts

@@ -1,6 +0,0 @@
-interface DebugTabsProps {
-    onClose?: () => void;
-}
-export declare const DebugTabs: ({ onClose }: DebugTabsProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=DebugTabs.d.ts.map

package/dist/lib/debugUi/DebugTabs.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Cross1Icon } from '@radix-ui/react-icons';
-import { Button, Tabs } from '@radix-ui/themes';
-import { LogTab } from './LogTab.js';
-import { SettingsTab } from './SettingsTab.js';
-export const DebugTabs = ({ onClose }) => (_jsxs(Tabs.Root, { defaultValue: "settingsTab", children: [_jsxs(Tabs.List, { children: [_jsx(Tabs.Trigger, { value: "settingsTab", children: "Settings" }), _jsx(Tabs.Trigger, { value: "logTab", children: "Log" }), _jsxs(Button, { ml: "auto", variant: "soft", mt: "3px", color: "gray", onClick: onClose, children: [_jsx(Cross1Icon, { width: "16", height: "16" }), " Close"] })] }), _jsx(Tabs.Content, { value: "settingsTab", children: _jsx(SettingsTab, {}) }), _jsx(Tabs.Content, { value: "logTab", children: _jsx(LogTab, {}) })] }));

package/dist/lib/debugUi/DebugUi.d.ts

@@ -1,5 +0,0 @@
-export declare const DebugUi: React.FC<{
-    open: boolean;
-    useDebugButtonState: () => [boolean, (n: boolean) => void];
-}>;
-//# sourceMappingURL=DebugUi.d.ts.map

package/dist/lib/debugUi/DebugUi.js

@@ -1,31 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { lazy, Suspense, useEffect, useState } from 'react';
-import { addDebugSecretListener } from '../utils/addDebugSecretListener.js';
-import { SideButton } from './SideButton.js';
-const LazyDebugOverlay = lazy(async () => ({
-    default: (await import('./DebugOverlay.js')).DebugOverlay,
-}));
-export const DebugUi = (props) => {
-    const [isOpen, setIsOpen] = useState(props.open);
-    const [debugButtonEnabled, setDebugButtonEnabled] = props.useDebugButtonState();
-    useEffect(() => {
-        return addDebugSecretListener(() => {
-            setDebugButtonEnabled(true);
-            setIsOpen(true);
-        });
-    }, []);
-    // set visibility of efp floorplan to none when debug ui is open
-    // otherwise, z-index issues occur
-    useEffect(() => {
-        const efpFloorplan = document.getElementsByClassName('expofp-floorplan-default')[0];
-        if (efpFloorplan) {
-            efpFloorplan.style.visibility = isOpen ? 'hidden' : 'visible';
-        }
-    }, [isOpen]);
-    if (isOpen) {
-        return (_jsx(Suspense, { fallback: null, children: _jsx(LazyDebugOverlay, { onClose: () => {
-                    setIsOpen(false);
-                } }) }));
-    }
-    return debugButtonEnabled ? _jsx(SideButton, { onClick: () => setIsOpen(true) }) : null;
-};

package/dist/lib/debugUi/LogTab.d.ts

@@ -1,2 +0,0 @@
-export declare const LogTab: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=LogTab.d.ts.map

package/dist/lib/debugUi/LogTab.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { InfoCircledIcon } from '@radix-ui/react-icons';
-import { Box, Callout } from '@radix-ui/themes';
-export const LogTab = () => {
-    return (_jsx(Box, { pt: "20px", children: _jsx(Box, { mb: "20px", children: _jsxs(Callout.Root, { children: [_jsx(Callout.Icon, { children: _jsx(InfoCircledIcon, {}) }), _jsx(Callout.Text, { children: "Implement to intercept console.info, console.warn and console.error and output them here when logging enabled." })] }) }) }));
-};

package/dist/lib/debugUi/Settings.d.ts

@@ -1,2 +0,0 @@
-export declare const Settings: React.FC;
-//# sourceMappingURL=Settings.d.ts.map

package/dist/lib/debugUi/Settings.js

@@ -1,7 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Skeleton } from '@radix-ui/themes';
-import { Suspense } from 'react';
-import { editors } from '../settings/registeredSettings.js';
-export const Settings = () => {
-    return editors.map((Editor, index) => (_jsx(Suspense, { fallback: _jsx(Skeleton, { height: "60px" }), children: _jsx(Editor, {}) }, index)));
-};

package/dist/lib/debugUi/SettingsItem.d.ts

@@ -1,6 +0,0 @@
-interface SettingsItemProps extends React.PropsWithChildren {
-    label: string;
-}
-export declare const SettingsItem: ({ label, children }: SettingsItemProps) => import("react/jsx-runtime").JSX.Element;
-export {};
-//# sourceMappingURL=SettingsItem.d.ts.map

package/dist/lib/debugUi/SettingsItem.js

@@ -1,5 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
-import { Box, Heading, Separator } from '@radix-ui/themes';
-export const SettingsItem = ({ label, children }) => {
-    return (_jsxs(_Fragment, { children: [_jsxs(Box, { children: [_jsx(Heading, { size: "4", children: label }), _jsx(Box, { mt: "10px", children: children })] }), _jsx(Separator, { size: "4", my: "20px" })] }));
-};

package/dist/lib/debugUi/SettingsTab.d.ts

@@ -1,2 +0,0 @@
-export declare const SettingsTab: () => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SettingsTab.d.ts.map

package/dist/lib/debugUi/SettingsTab.js

@@ -1,13 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { InfoCircledIcon } from '@radix-ui/react-icons';
-import { AlertDialog, Box, Button, Callout, Flex } from '@radix-ui/themes';
-import { resetAllSettings } from '../settings/resetAllSettings.js';
-import { Settings } from './Settings.js';
-export const SettingsTab = () => {
-    return (_jsxs(Box, { pt: "20px", children: [_jsx(Box, { mb: "20px", children: _jsxs(Callout.Root, { children: [_jsx(Callout.Icon, { children: _jsx(InfoCircledIcon, {}) }), _jsx(Callout.Text, { children: "These settings will persist across page reloads in your browser." })] }) }), _jsx(Settings, {}), _jsxs(Flex, { gap: "3", mt: "40px", justify: "center", children: [_jsx(Button, { onClick: () => {
-                            window.location.reload();
-                        }, children: "Reload with the applied changes" }), _jsxs(AlertDialog.Root, { children: [_jsx(AlertDialog.Trigger, { children: _jsx(Button, { color: "red", children: "Reset all and reload" }) }), _jsxs(AlertDialog.Content, { maxWidth: "450px", children: [_jsx(AlertDialog.Title, { children: "Reset all and reload" }), _jsx(AlertDialog.Description, { size: "2", children: "This will reset all settings, disable debug mode, and reload the page." }), _jsxs(Flex, { gap: "3", mt: "4", justify: "end", children: [_jsx(AlertDialog.Cancel, { children: _jsx(Button, { variant: "soft", color: "gray", children: "Cancel" }) }), _jsx(AlertDialog.Action, { children: _jsx(Button, { variant: "solid", color: "red", onClick: () => {
-                                                        resetAllSettings();
-                                                        window.location.reload();
-                                                    }, children: "Reset all and reload" }) })] })] })] })] })] }));
-};

package/dist/lib/debugUi/SideButton.d.ts

@@ -1,4 +0,0 @@
-export declare const SideButton: ({ onClick }: {
-    onClick?: () => void;
-}) => import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=SideButton.d.ts.map

package/dist/lib/debugUi/SideButton.js

@@ -1,37 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-export const SideButton = ({ onClick }) => {
-    const size = 64;
-    const width = 20;
-    const radius = 14;
-    return (_jsx("button", { type: "button", style: {
-            position: 'fixed',
-            right: 0,
-            top: '50%',
-            transform: 'translateY(-50%)',
-            padding: 0,
-            border: 'none',
-            background: 'transparent',
-            cursor: 'pointer',
-            zIndex: 9999,
-            boxSizing: 'border-box',
-        }, onClick: onClick, children: _jsx("div", { style: {
-                width,
-                height: size,
-                paddingLeft: 4,
-                display: 'flex',
-                alignItems: 'center',
-                justifyContent: 'center',
-                background: 'var(--side-tab-bg, rgba(0,0,0,0.5))',
-                color: 'white',
-                borderRadius: `${radius}px 0 0 ${radius}px`,
-                fontSize: Math.round(size * 0.25),
-                lineHeight: 1,
-                userSelect: 'none',
-                cursor: 'pointer',
-                filter: 'grayscale(0.5)',
-                boxSizing: 'border-box',
-            }, children: _jsx(ChevronLeftSvg, { size: size * 0.7 }) }) }));
-};
-function ChevronLeftSvg({ size = 18, strokeWidth = 3, ...props }) {
-    return (_jsx("svg", { width: size, height: size, viewBox: "0 0 24 24", fill: "none", ...props, children: _jsx("path", { fill: "none", d: "M14.5 5.5L8.5 12l6 6.5", stroke: "currentColor", strokeWidth: strokeWidth, strokeLinecap: "round", strokeLinejoin: "round" }) }));
-}

package/dist/lib/debugUi/index.d.ts

@@ -1,2 +0,0 @@
-export { renderDebugUi } from './renderDebugUi.js';
-//# sourceMappingURL=index.d.ts.map

package/dist/lib/debugUi/index.js

@@ -1 +0,0 @@
-export { renderDebugUi } from './renderDebugUi.js';

package/dist/lib/debugUi/renderDebugUi.d.ts

@@ -1,2 +0,0 @@
-export declare function renderDebugUi(): void;
-//# sourceMappingURL=renderDebugUi.d.ts.map

package/dist/lib/debugUi/renderDebugUi.js

@@ -1,24 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { registerBooleanSetting } from '../settings/index.js';
-import { addDebugSecretListener } from '../utils/addDebugSecretListener.js';
-export function renderDebugUi() {
-    const showDebugButtonSetting = registerBooleanSetting('Show Debug Button Overlay');
-    const render = async (open) => {
-        const { DebugUi } = await import('./DebugUi.js');
-        const { createRoot } = await import('react-dom/client');
-        const rootElement = document.createElement('div');
-        document.body.appendChild(rootElement);
-        const root = createRoot(rootElement);
-        root.render(_jsx(DebugUi, { useDebugButtonState: showDebugButtonSetting.useState, open: open }));
-    };
-    if (showDebugButtonSetting.get()) {
-        render(false);
-    }
-    else {
-        const unsuscribe = addDebugSecretListener(() => {
-            unsuscribe();
-            showDebugButtonSetting.set(true);
-            render(true);
-        });
-    }
-}

package/dist/lib/editors/BooleanEditor.d.ts

@@ -1,3 +0,0 @@
-import type { EditorProps } from './EditorProps.js';
-export declare const BooleanEditor: React.FC<EditorProps<boolean>>;
-//# sourceMappingURL=BooleanEditor.d.ts.map

package/dist/lib/editors/BooleanEditor.js

@@ -1,6 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { Flex, Switch } from '@radix-ui/themes';
-import { SettingsItem } from '../debugUi/SettingsItem.js';
-export const BooleanEditor = (props) => {
-    return (_jsx(SettingsItem, { label: props.label, children: _jsx(Flex, { children: _jsx(Switch, { checked: props.value, onCheckedChange: (checked) => props.onChange(checked) }) }) }));
-};

package/dist/lib/editors/EditorProps.d.ts

@@ -1,7 +0,0 @@
-export type EditorProps<T, K = void> = {
-    label: string;
-    value: T;
-    context: K;
-    onChange: (value: T) => void;
-};
-//# sourceMappingURL=EditorProps.d.ts.map

package/dist/lib/editors/EditorProps.js

@@ -1 +0,0 @@
-export {};

package/dist/lib/editors/EnumEditor.d.ts

@@ -1,5 +0,0 @@
-import type { EditorProps } from './EditorProps.js';
-export declare function EnumEditor<T>(props: EditorProps<T, {
-    values: readonly T[];
-}>): import("react/jsx-runtime").JSX.Element;
-//# sourceMappingURL=EnumEditor.d.ts.map

package/dist/lib/editors/EnumEditor.js

@@ -1,16 +0,0 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Select } from '@radix-ui/themes';
-import { SettingsItem } from '../debugUi/SettingsItem.js';
-export function EnumEditor(props) {
-    const stringMode = props.context.values.every((v) => typeof v === 'string');
-    const stringify = stringMode ? (v) => v : (v) => JSON.stringify(v);
-    const parse = stringMode ? (v) => v : (v) => JSON.parse(v);
-    const value = stringify(props.value);
-    const values = props.context.values.map((v) => ({
-        value: stringify(v),
-        label: stringify(v),
-    })) || [];
-    return (_jsx(SettingsItem, { label: "Data.js validation", children: _jsxs(Select.Root, { value: value, onValueChange: (value) => {
-                props.onChange(parse(value));
-            }, children: [_jsx(Select.Trigger, {}), _jsx(Select.Content, { children: values.map((v) => (_jsx(Select.Item, { value: v.value, children: v.label }, v.value))) })] }) }));
-}

package/dist/lib/initDebug.d.ts

@@ -1,2 +0,0 @@
-export declare function initDebug(): void;
-//# sourceMappingURL=initDebug.d.ts.map

package/dist/lib/initDebug.js

@@ -1,15 +0,0 @@
-let debugInitialized = false;
-export function initDebug() {
-    if (debugInitialized) {
-        return;
-    }
-    debugInitialized = true;
-    // if not browser, exit
-    if (typeof window === 'undefined' && typeof document === 'undefined') {
-        return;
-    }
-    // add a simple debug button to the page (right, center, fixed position)
-    import('./debugUi/index.js').then(({ renderDebugUi }) => {
-        renderDebugUi();
-    });
-}

package/dist/lib/settings/registerBooleanSetting.d.ts

@@ -1,3 +0,0 @@
-import { type DebugSetting } from './registerSetting.js';
-export declare function registerBooleanSetting(label: string): DebugSetting<boolean>;
-//# sourceMappingURL=registerBooleanSetting.d.ts.map

package/dist/lib/settings/registerBooleanSetting.js

@@ -1,8 +0,0 @@
-import React from 'react';
-import { registerSetting } from './registerSetting.js';
-export function registerBooleanSetting(label) {
-    const BooleanEditorLazy = React.lazy(() => import('../editors/BooleanEditor.js').then((mod) => ({
-        default: mod.BooleanEditor,
-    })));
-    return registerSetting(label, false, BooleanEditorLazy);
-}

package/dist/lib/settings/registerEnumSetting.d.ts

@@ -1,3 +0,0 @@
-import { type DebugSetting } from './registerSetting.js';
-export declare function registerEnumSetting<T>(label: string, values: readonly T[], defaultValue: T): DebugSetting<T>;
-//# sourceMappingURL=registerEnumSetting.d.ts.map

package/dist/lib/settings/registerEnumSetting.js

@@ -1,10 +0,0 @@
-import React from 'react';
-import { registerSetting } from './registerSetting.js';
-export function registerEnumSetting(label, values, defaultValue) {
-    const EnumEditorLazy = React.lazy(() => import('../editors/EnumEditor.js').then((mod) => ({
-        default: mod.EnumEditor,
-    })));
-    return registerSetting(label, defaultValue, EnumEditorLazy, {
-        values,
-    });
-}

package/dist/lib/settings/registerSetting.d.ts

@@ -1,9 +0,0 @@
-import type { EditorProps } from '../editors/EditorProps.js';
-export interface DebugSetting<T> {
-    get: () => T;
-    set: (value: T) => void;
-    reset: () => void;
-    useState: () => [T, (value: T) => void];
-}
-export declare function registerSetting<T, K = void>(label: string, defaultValue: T, Editor: React.FC<EditorProps<T, K>>, context?: K): DebugSetting<T>;
-//# sourceMappingURL=registerSetting.d.ts.map

package/dist/lib/settings/registerSetting.js

@@ -1,64 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { useCallback, useEffect, useState } from 'react';
-import { editors, resets } from './registeredSettings.js';
-const LOCAL_STORAGE_EVENT = 'efp-local-storage';
-export function registerSetting(label, defaultValue, Editor, context) {
-    const key = `efp-debug-setting-"${label}"`;
-    const get = () => tryJsonParse(localStorage.getItem(key), defaultValue);
-    const set = (value) => {
-        localStorage.setItem(key, JSON.stringify(value));
-        emitLocalStorageChange(key);
-    };
-    const reset = () => {
-        localStorage.removeItem(key);
-        emitLocalStorageChange(key);
-    };
-    resets.push(reset);
-    function useLocalStorageState() {
-        const [state, setState] = useState(get());
-        useEffect(() => {
-            const update = () => setState(get());
-            const onStorage = (e) => {
-                if (e.key === key)
-                    update();
-            };
-            const onLocal = (e) => {
-                const { detail } = e;
-                if (detail?.key === key)
-                    update();
-            };
-            window.addEventListener('storage', onStorage);
-            window.addEventListener(LOCAL_STORAGE_EVENT, onLocal);
-            return () => {
-                window.removeEventListener('storage', onStorage);
-                window.removeEventListener(LOCAL_STORAGE_EVENT, onLocal);
-            };
-        }, []);
-        const setValueCallback = useCallback(set, []);
-        return [state, setValueCallback];
-    }
-    const EditorImpl = () => {
-        const [state, setState] = useLocalStorageState();
-        return _jsx(Editor, { label: label, value: state, context: context, onChange: setState });
-    };
-    editors.push(EditorImpl);
-    return {
-        get,
-        set,
-        reset,
-        useState: useLocalStorageState,
-    };
-}
-function tryJsonParse(str, fallback) {
-    if (str === null)
-        return fallback;
-    try {
-        return JSON.parse(str);
-    }
-    catch {
-        return fallback;
-    }
-}
-function emitLocalStorageChange(key) {
-    window.dispatchEvent(new CustomEvent(LOCAL_STORAGE_EVENT, { detail: { key } }));
-}

package/dist/lib/settings/registeredSettings.d.ts

@@ -1,3 +0,0 @@
-export declare const editors: React.FC[];
-export declare const resets: (() => void)[];
-//# sourceMappingURL=registeredSettings.d.ts.map

package/dist/lib/settings/registeredSettings.js

@@ -1,2 +0,0 @@
-export const editors = [];
-export const resets = [];

package/dist/lib/settings/resetAllSettings.d.ts

@@ -1,2 +0,0 @@
-export declare function resetAllSettings(): void;
-//# sourceMappingURL=resetAllSettings.d.ts.map

package/dist/lib/settings/resetAllSettings.js

@@ -1,4 +0,0 @@
-import { resets } from './registeredSettings.js';
-export function resetAllSettings() {
-    resets.forEach((reset) => reset());
-}

package/dist/lib/utils/addDebugSecretListener.d.ts

@@ -1,2 +0,0 @@
-export declare function addDebugSecretListener(callback: () => void): () => void;
-//# sourceMappingURL=addDebugSecretListener.d.ts.map

package/dist/lib/utils/addDebugSecretListener.js

@@ -1,31 +0,0 @@
-const SECRET_PHRASE = 'dbg123';
-const callbacks = [];
-let initialized = false;
-export function addDebugSecretListener(callback) {
-    callbacks.push(callback);
-    if (!initialized) {
-        initialized = true;
-        let buffer = '';
-        function onKeyDown(e) {
-            // Ignore modifier keys
-            if (e.ctrlKey || e.metaKey || e.altKey)
-                return;
-            if (e.key.length !== 1)
-                return;
-            buffer += e.key.toLowerCase();
-            // Keep buffer length sane
-            buffer = buffer.slice(-SECRET_PHRASE.length);
-            if (buffer === SECRET_PHRASE) {
-                buffer = '';
-                callbacks.forEach((cb) => cb());
-            }
-        }
-        document.addEventListener('keydown', onKeyDown);
-    }
-    return () => {
-        const index = callbacks.indexOf(callback);
-        if (index !== -1) {
-            callbacks.splice(index, 1);
-        }
-    };
-}