@expofp/debug 3.1.11 → 3.1.13

package/dist/lib/settings/adopt-global-settings.d.ts

@@ -0,0 +1,25 @@
+export type GlobalSettingSchema = {
+    type: 'boolean';
+    label?: string;
+    default?: boolean;
+} | {
+    type: 'string';
+    label?: string;
+    default?: string;
+    placeholder?: string;
+} | {
+    type: 'enum';
+    label?: string;
+    values: readonly string[];
+    default: string;
+};
+export interface EfpDebugGlobal {
+    settings?: Record<string, GlobalSettingSchema>;
+}
+declare global {
+    interface Window {
+        efpDebug?: EfpDebugGlobal;
+    }
+}
+export declare function adoptGlobalSettings(): void;
+//# sourceMappingURL=adopt-global-settings.d.ts.map

package/dist/lib/settings/adopt-global-settings.js

@@ -0,0 +1,41 @@
+import { registerBooleanSetting } from './register-boolean-setting.js';
+import { registerEnumSetting } from './register-enum-setting.js';
+import { registerStringSetting } from './register-string-setting.js';
+const adopted = new Set();
+export function adoptGlobalSettings() {
+    if (typeof window === 'undefined')
+        return;
+    const settings = window.efpDebug?.settings;
+    if (!settings)
+        return;
+    for (const [key, schema] of Object.entries(settings)) {
+        if (adopted.has(key))
+            continue;
+        adopted.add(key);
+        switch (schema.type) {
+            case 'boolean':
+                registerBooleanSetting({
+                    key,
+                    label: schema.label,
+                    default: schema.default,
+                });
+                break;
+            case 'string':
+                registerStringSetting({
+                    key,
+                    label: schema.label,
+                    default: schema.default,
+                    placeholder: schema.placeholder,
+                });
+                break;
+            case 'enum':
+                registerEnumSetting({
+                    key,
+                    label: schema.label,
+                    values: schema.values,
+                    default: schema.default,
+                });
+                break;
+        }
+    }
+}

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

@@ -1,6 +1,7 @@
+export * from './adopt-global-settings.js';
 export * from './register-boolean-setting.js';
-export * from './register-debug-namespaces-setting.js';
 export * from './register-enum-setting.js';
 export * from './register-setting.js';
+export * from './register-string-setting.js';
 export * from './reset-all-settings.js';
 //# sourceMappingURL=index.d.ts.map

package/dist/lib/settings/index.js

@@ -1,5 +1,6 @@
+export * from './adopt-global-settings.js';
 export * from './register-boolean-setting.js';
-export * from './register-debug-namespaces-setting.js';
 export * from './register-enum-setting.js';
 export * from './register-setting.js';
+export * from './register-string-setting.js';
 export * from './reset-all-settings.js';

package/dist/lib/settings/register-boolean-setting.d.ts

@@ -1,3 +1,9 @@
 import { type DebugSetting } from './register-setting.js';
-export declare function registerBooleanSetting(label: string): DebugSetting<boolean>;
+export interface RegisterBooleanSettingOptions {
+    key: string;
+    label?: string;
+    default?: boolean;
+    onChange?: (value: boolean) => void;
+}
+export declare function registerBooleanSetting(options: RegisterBooleanSettingOptions): DebugSetting<boolean>;
 //# sourceMappingURL=register-boolean-setting.d.ts.map

package/dist/lib/settings/register-boolean-setting.js

@@ -1,8 +1,14 @@
 import React from 'react';
 import { registerSetting } from './register-setting.js';
-export function registerBooleanSetting(label) {
+export function registerBooleanSetting(options) {
     const BooleanEditorLazy = React.lazy(() => import('../ui/boolean-editor.js').then((mod) => ({
         default: mod.BooleanEditor,
     })));
-    return registerSetting(label, false, BooleanEditorLazy);
+    return registerSetting({
+        key: options.key,
+        label: options.label,
+        default: options.default ?? false,
+        Editor: BooleanEditorLazy,
+        onChange: options.onChange,
+    });
 }

package/dist/lib/settings/register-enum-setting.d.ts

@@ -1,3 +1,10 @@
 import { type DebugSetting } from './register-setting.js';
-export declare function registerEnumSetting<T>(label: string, values: readonly T[], defaultValue: T): DebugSetting<T>;
+export interface RegisterEnumSettingOptions<T> {
+    key: string;
+    label?: string;
+    values: readonly T[];
+    default: T;
+    onChange?: (value: T) => void;
+}
+export declare function registerEnumSetting<T>(options: RegisterEnumSettingOptions<T>): DebugSetting<T>;
 //# sourceMappingURL=register-enum-setting.d.ts.map

package/dist/lib/settings/register-enum-setting.js

@@ -1,10 +1,15 @@
 import React from 'react';
 import { registerSetting } from './register-setting.js';
-export function registerEnumSetting(label, values, defaultValue) {
+export function registerEnumSetting(options) {
     const EnumEditorLazy = React.lazy(() => import('../ui/enum-editor.js').then((mod) => ({
         default: mod.EnumEditor,
     })));
-    return registerSetting(label, defaultValue, EnumEditorLazy, {
-        values,
+    return registerSetting({
+        key: options.key,
+        label: options.label,
+        default: options.default,
+        Editor: EnumEditorLazy,
+        context: { values: options.values },
+        onChange: options.onChange,
     });
 }

package/dist/lib/settings/register-setting.d.ts

@@ -5,5 +5,15 @@ export interface DebugSetting<T> {
     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>;
+export interface RegisterSettingOptions<T, K = void> {
+    key: string;
+    label?: string;
+    default: T;
+    Editor: React.FC<EditorProps<T, K>>;
+    context?: K;
+    onChange?: (value: T) => void;
+    serialize?: (value: T) => string;
+    deserialize?: (raw: string) => T;
+}
+export declare function registerSetting<T, K = void>(options: RegisterSettingOptions<T, K>): DebugSetting<T>;
 //# sourceMappingURL=register-setting.d.ts.map

package/dist/lib/settings/register-setting.js

@@ -2,15 +2,28 @@ import { jsx as _jsx } from "react/jsx-runtime";
 import { useEffect, useState } from 'react';
 import { editors, resets } from './setting-registry.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);
+export function registerSetting(options) {
+    const { key, default: defaultValue, Editor, context, onChange, serialize = JSON.stringify, deserialize = (raw) => JSON.parse(raw), } = options;
+    const label = options.label ?? key;
+    const get = () => {
+        const raw = localStorage.getItem(key);
+        if (raw === null)
+            return defaultValue;
+        try {
+            return deserialize(raw);
+        }
+        catch {
+            return defaultValue;
+        }
+    };
     const set = (value) => {
-        localStorage.setItem(key, JSON.stringify(value));
+        localStorage.setItem(key, serialize(value));
+        onChange?.(value);
         emitLocalStorageChange(key);
     };
     const reset = () => {
         localStorage.removeItem(key);
+        onChange?.(defaultValue);
         emitLocalStorageChange(key);
     };
     resets.push(reset);
@@ -38,7 +51,6 @@ export function registerSetting(label, defaultValue, Editor, context) {
     }
     const EditorImpl = () => {
         const [state, setState] = useLocalStorageState();
-        // context is always provided by callers that register an Editor expecting it
         return _jsx(Editor, { label: label, value: state, context: context, onChange: setState });
     };
     EditorImpl.displayName = `DebugSetting(${label})`;
@@ -50,16 +62,6 @@ export function registerSetting(label, defaultValue, Editor, context) {
         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/register-string-setting.d.ts

@@ -0,0 +1,10 @@
+import { type DebugSetting } from './register-setting.js';
+export interface RegisterStringSettingOptions {
+    key: string;
+    label?: string;
+    default?: string;
+    placeholder?: string;
+    onChange?: (value: string) => void;
+}
+export declare function registerStringSetting(options: RegisterStringSettingOptions): DebugSetting<string>;
+//# sourceMappingURL=register-string-setting.d.ts.map

package/dist/lib/settings/register-string-setting.js

@@ -0,0 +1,17 @@
+import React from 'react';
+import { registerSetting } from './register-setting.js';
+export function registerStringSetting(options) {
+    const StringEditorLazy = React.lazy(() => import('../ui/string-editor.js').then((mod) => ({
+        default: mod.StringEditor,
+    })));
+    return registerSetting({
+        key: options.key,
+        label: options.label,
+        default: options.default ?? '',
+        Editor: StringEditorLazy,
+        context: { placeholder: options.placeholder },
+        onChange: options.onChange,
+        serialize: (v) => v,
+        deserialize: (v) => v,
+    });
+}

package/dist/lib/ui/render-debug-ui.js

@@ -1,6 +1,6 @@
 import { jsx as _jsx } from "react/jsx-runtime";
-import { registerBooleanSetting } from '../settings/index.js';
-import { registerDebugNamespacesSetting } from '../settings/register-debug-namespaces-setting.js';
+import debug from 'debug';
+import { registerBooleanSetting, registerStringSetting } from '../settings/index.js';
 import { addDebugSecretListener } from '../utils/add-debug-secret-listener.js';
 let rendered = false;
 export function renderDebugUi() {
@@ -8,8 +8,21 @@ export function renderDebugUi() {
         return;
     }
     rendered = true;
-    const showDebugButtonSetting = registerBooleanSetting('Show Debug Button Overlay');
-    registerDebugNamespacesSetting();
+    const showDebugButtonSetting = registerBooleanSetting({
+        key: 'efp:show-debug-button',
+        label: 'Show Debug Button Overlay',
+    });
+    registerStringSetting({
+        key: 'debug',
+        label: 'Debug namespaces',
+        placeholder: 'e.g. efp:*',
+        onChange: (value) => {
+            if (value)
+                debug.enable(value);
+            else
+                debug.disable();
+        },
+    });
     const render = async (open) => {
         const { DebugUi } = await import('./debug-ui.js');
         const { createRoot } = await import('react-dom/client');

package/dist/lib/ui/settings-list.js

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

package/dist/lib/ui/string-editor.d.ts

@@ -0,0 +1,5 @@
+import type { EditorProps } from '../settings/editor-props.js';
+export declare const StringEditor: React.FC<EditorProps<string, {
+    placeholder?: string;
+}>>;
+//# sourceMappingURL=string-editor.d.ts.map

package/dist/lib/ui/string-editor.js

@@ -0,0 +1,7 @@
+import { jsx as _jsx } from "react/jsx-runtime";
+import { TextField } from '@radix-ui/themes';
+import { SettingsItem } from './settings-item.js';
+export const StringEditor = (props) => {
+    return (_jsx(SettingsItem, { label: props.label, children: _jsx(TextField.Root, { placeholder: props.context?.placeholder, value: props.value, onChange: (e) => props.onChange(e.target.value), style: { minWidth: 220 } }) }));
+};
+StringEditor.displayName = 'StringEditor';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@expofp/debug",
-  "version": "3.1.11",
+  "version": "3.1.13",
   "type": "module",
   "description": "ExpoFP SDK internal: debug utilities",
   "homepage": "https://developer.expofp.com/",

package/dist/lib/settings/register-debug-namespaces-setting.d.ts

@@ -1,6 +0,0 @@
-export declare const STORAGE_KEY = "debug";
-export declare const LOCAL_STORAGE_EVENT = "efp-local-storage";
-export declare function registerDebugNamespacesSetting(): void;
-export declare function getDebugNamespaces(): string;
-export declare function setDebugNamespaces(pattern: string): void;
-//# sourceMappingURL=register-debug-namespaces-setting.d.ts.map

package/dist/lib/settings/register-debug-namespaces-setting.js

@@ -1,26 +0,0 @@
-import debug from 'debug';
-import React from 'react';
-import { editors, resets } from './setting-registry.js';
-export const STORAGE_KEY = 'debug';
-export const LOCAL_STORAGE_EVENT = 'efp-local-storage';
-export function registerDebugNamespacesSetting() {
-    const DebugNamespacesEditorLazy = React.lazy(() => import('../ui/debug-namespaces-editor.js').then((mod) => ({
-        default: mod.DebugNamespacesEditor,
-    })));
-    resets.push(() => setDebugNamespaces(''));
-    editors.push(DebugNamespacesEditorLazy);
-}
-export function getDebugNamespaces() {
-    return localStorage.getItem(STORAGE_KEY) ?? '';
-}
-export function setDebugNamespaces(pattern) {
-    if (pattern) {
-        localStorage.setItem(STORAGE_KEY, pattern);
-        debug.enable(pattern);
-    }
-    else {
-        localStorage.removeItem(STORAGE_KEY);
-        debug.disable();
-    }
-    window.dispatchEvent(new CustomEvent(LOCAL_STORAGE_EVENT, { detail: { key: STORAGE_KEY } }));
-}

package/dist/lib/ui/debug-namespaces-editor.d.ts

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

package/dist/lib/ui/debug-namespaces-editor.js

@@ -1,32 +0,0 @@
-import { jsx as _jsx } from "react/jsx-runtime";
-import { TextField } from '@radix-ui/themes';
-import { useEffect, useState } from 'react';
-import { getDebugNamespaces, LOCAL_STORAGE_EVENT, setDebugNamespaces, STORAGE_KEY, } from '../settings/register-debug-namespaces-setting.js';
-import { SettingsItem } from './settings-item.js';
-export const DebugNamespacesEditor = () => {
-    const [value, setValue] = useState(getDebugNamespaces);
-    useEffect(() => {
-        const update = () => setValue(getDebugNamespaces());
-        const onLocal = (e) => {
-            const detail = e.detail;
-            if (detail?.key === STORAGE_KEY)
-                update();
-        };
-        const onStorage = (e) => {
-            if (e.key === STORAGE_KEY)
-                update();
-        };
-        window.addEventListener('storage', onStorage);
-        window.addEventListener(LOCAL_STORAGE_EVENT, onLocal);
-        return () => {
-            window.removeEventListener('storage', onStorage);
-            window.removeEventListener(LOCAL_STORAGE_EVENT, onLocal);
-        };
-    }, []);
-    return (_jsx(SettingsItem, { label: "Debug namespaces", children: _jsx(TextField.Root, { placeholder: "e.g. efp:*", value: value, onChange: (e) => {
-                const next = e.target.value;
-                setValue(next);
-                setDebugNamespaces(next);
-            }, style: { minWidth: 220 } }) }));
-};
-DebugNamespacesEditor.displayName = 'DebugNamespacesEditor';