@buoy-gg/core 7.0.15 → 7.0.17

package/lib/commonjs/index.web.js

@@ -3,6 +3,18 @@
 Object.defineProperty(exports, "__esModule", {
   value: true
 });
+Object.defineProperty(exports, "AppHostProvider", {
+  enumerable: true,
+  get: function () {
+    return _AppHostWeb.AppHostProvider;
+  }
+});
+Object.defineProperty(exports, "AppOverlay", {
+  enumerable: true,
+  get: function () {
+    return _AppHostWeb.AppOverlay;
+  }
+});
 Object.defineProperty(exports, "DialMenu", {
   enumerable: true,
   get: function () {
@@ -111,6 +123,12 @@ Object.defineProperty(exports, "settingsStyles", {
     return _floatingToolsReact.settingsStyles;
   }
 });
+Object.defineProperty(exports, "useAppHost", {
+  enumerable: true,
+  get: function () {
+    return _AppHostWeb.useAppHost;
+  }
+});
 Object.defineProperty(exports, "useFloatingTools", {
   enumerable: true,
   get: function () {
@@ -127,5 +145,6 @@ var _FloatingDevToolsWeb = require("./floatingMenu/FloatingDevTools.web.js");
 var _floatingToolsWeb = require("./floatingMenu/floatingTools.web.js");
 var _DialDevToolsWeb = require("./floatingMenu/dial/DialDevTools.web.js");
 var _DevToolsSettingsModalWeb = require("./floatingMenu/DevToolsSettingsModal.web.js");
+var _AppHostWeb = require("./floatingMenu/AppHost.web.js");
 var _autoDiscoverPresetsWeb = require("./utils/autoDiscoverPresets.web.js");
 var _floatingToolsReact = require("@buoy-gg/floating-tools-react");

package/lib/commonjs/toolkit.js

@@ -0,0 +1,427 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+Object.defineProperty(exports, "Activity", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Activity;
+  }
+});
+Object.defineProperty(exports, "AlertTriangle", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.AlertTriangle;
+  }
+});
+Object.defineProperty(exports, "Badge", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Badge;
+  }
+});
+Object.defineProperty(exports, "Bug", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Bug;
+  }
+});
+Object.defineProperty(exports, "Check", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Check;
+  }
+});
+Object.defineProperty(exports, "CheckCircle", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.CheckCircle;
+  }
+});
+Object.defineProperty(exports, "ChevronDown", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ChevronDown;
+  }
+});
+Object.defineProperty(exports, "ChevronLeft", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ChevronLeft;
+  }
+});
+Object.defineProperty(exports, "ChevronRight", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ChevronRight;
+  }
+});
+Object.defineProperty(exports, "ChevronUp", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ChevronUp;
+  }
+});
+Object.defineProperty(exports, "Clock", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Clock;
+  }
+});
+Object.defineProperty(exports, "CompactRow", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.CompactRow;
+  }
+});
+Object.defineProperty(exports, "Copy", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Copy;
+  }
+});
+Object.defineProperty(exports, "CopyButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.CopyButton;
+  }
+});
+Object.defineProperty(exports, "CountBadge", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.CountBadge;
+  }
+});
+Object.defineProperty(exports, "DataViewer", {
+  enumerable: true,
+  get: function () {
+    return _dataViewer.DataViewer;
+  }
+});
+Object.defineProperty(exports, "Database", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Database;
+  }
+});
+Object.defineProperty(exports, "EmptyState", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.EmptyState;
+  }
+});
+Object.defineProperty(exports, "EventStepperFooter", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.EventStepperFooter;
+  }
+});
+Object.defineProperty(exports, "Eye", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Eye;
+  }
+});
+Object.defineProperty(exports, "EyeOff", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.EyeOff;
+  }
+});
+Object.defineProperty(exports, "FileJson", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.FileJson;
+  }
+});
+Object.defineProperty(exports, "FileText", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.FileText;
+  }
+});
+Object.defineProperty(exports, "Filter", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Filter;
+  }
+});
+Object.defineProperty(exports, "FlaskConical", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.FlaskConical;
+  }
+});
+Object.defineProperty(exports, "Globe", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Globe;
+  }
+});
+Object.defineProperty(exports, "Hash", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Hash;
+  }
+});
+Object.defineProperty(exports, "HeaderSearchButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.HeaderSearchButton;
+  }
+});
+Object.defineProperty(exports, "Info", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Info;
+  }
+});
+Object.defineProperty(exports, "InlineCopyButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.InlineCopyButton;
+  }
+});
+Object.defineProperty(exports, "JsModal", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.JsModal;
+  }
+});
+Object.defineProperty(exports, "Key", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Key;
+  }
+});
+Object.defineProperty(exports, "Layers", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Layers;
+  }
+});
+Object.defineProperty(exports, "Lock", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Lock;
+  }
+});
+Object.defineProperty(exports, "MethodBadge", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.MethodBadge;
+  }
+});
+Object.defineProperty(exports, "ModalHeader", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ModalHeader;
+  }
+});
+Object.defineProperty(exports, "NoDataEmptyState", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.NoDataEmptyState;
+  }
+});
+Object.defineProperty(exports, "NoResultsEmptyState", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.NoResultsEmptyState;
+  }
+});
+Object.defineProperty(exports, "NoSearchResultsEmptyState", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.NoSearchResultsEmptyState;
+  }
+});
+Object.defineProperty(exports, "Pause", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Pause;
+  }
+});
+Object.defineProperty(exports, "Play", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Play;
+  }
+});
+Object.defineProperty(exports, "Plus", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Plus;
+  }
+});
+Object.defineProperty(exports, "Power", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Power;
+  }
+});
+Object.defineProperty(exports, "PowerToggleButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.PowerToggleButton;
+  }
+});
+Object.defineProperty(exports, "RefreshCw", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.RefreshCw;
+  }
+});
+Object.defineProperty(exports, "RelativeTime", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.RelativeTime;
+  }
+});
+Object.defineProperty(exports, "Search", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Search;
+  }
+});
+Object.defineProperty(exports, "SectionHeader", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.SectionHeader;
+  }
+});
+Object.defineProperty(exports, "Settings", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Settings;
+  }
+});
+Object.defineProperty(exports, "Shield", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Shield;
+  }
+});
+Object.defineProperty(exports, "StatusBadge", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.StatusBadge;
+  }
+});
+Object.defineProperty(exports, "TabSelector", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.TabSelector;
+  }
+});
+Object.defineProperty(exports, "ToolButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ToolButton;
+  }
+});
+Object.defineProperty(exports, "ToolbarClearButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ToolbarClearButton;
+  }
+});
+Object.defineProperty(exports, "ToolbarCopyButton", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.ToolbarCopyButton;
+  }
+});
+Object.defineProperty(exports, "Trash2", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Trash2;
+  }
+});
+Object.defineProperty(exports, "TypeBadge", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.TypeBadge;
+  }
+});
+Object.defineProperty(exports, "User", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.User;
+  }
+});
+Object.defineProperty(exports, "Wifi", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Wifi;
+  }
+});
+Object.defineProperty(exports, "X", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.X;
+  }
+});
+Object.defineProperty(exports, "Zap", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.Zap;
+  }
+});
+Object.defineProperty(exports, "copyToClipboard", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.copyToClipboard;
+  }
+});
+Object.defineProperty(exports, "devToolsStorageKeys", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.devToolsStorageKeys;
+  }
+});
+Object.defineProperty(exports, "displayValue", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.displayValue;
+  }
+});
+Object.defineProperty(exports, "formatRelativeTime", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.formatRelativeTime;
+  }
+});
+Object.defineProperty(exports, "persistentStorage", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.persistentStorage;
+  }
+});
+Object.defineProperty(exports, "safeStringify", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.safeStringify;
+  }
+});
+Object.defineProperty(exports, "toolTheme", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.toolTheme;
+  }
+});
+Object.defineProperty(exports, "usePersistedState", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.usePersistedState;
+  }
+});
+Object.defineProperty(exports, "useSafeAreaInsets", {
+  enumerable: true,
+  get: function () {
+    return _sharedUi.useSafeAreaInsets;
+  }
+});
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _dataViewer = require("@buoy-gg/shared-ui/dataViewer");

package/lib/commonjs/utils/autoDiscoverPresets.web.js

@@ -25,6 +25,39 @@ var _jsxRuntime = require("react/jsx-runtime");
  * @platform React DOM Web (Vite, CRA, Next.js, Electron)
  */
 
+/**
+ * Dashed-square glyph for debug-borders (no BIF brand icon exists for it
+ * yet). Plain SVG so it renders identically everywhere — emoji icons are
+ * banned here: WKWebView (Capacitor/Tauri) renders them as tofu boxes.
+ */function DebugBordersGlyph({
+  size
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("svg", {
+    width: size,
+    height: size,
+    viewBox: "0 0 24 24",
+    "aria-hidden": "true",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
+      x: "3",
+      y: "3",
+      width: "18",
+      height: "18",
+      rx: "2",
+      fill: "none",
+      stroke: "#10b981",
+      strokeWidth: "2",
+      strokeDasharray: "4 3"
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("rect", {
+      x: "8",
+      y: "8",
+      width: "8",
+      height: "8",
+      rx: "1",
+      fill: "#10b98155"
+    })]
+  });
+}
+
 // =============================
 // Default Tool Presets (Fallback)
 // =============================
@@ -32,6 +65,8 @@ var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Default tool presets for when packages don't export web presets yet.
  * These will be used until each @buoy-gg/* package exports its own preset.
+ * Icons are the BIF brand icon components (same artwork as native) —
+ * never emoji strings (tofu in WKWebView).
  */
 const defaultToolPresets = exports.defaultToolPresets = [{
   id: 'env',
@@ -47,7 +82,9 @@ const defaultToolPresets = exports.defaultToolPresets = [{
   name: 'STORAGE',
   description: 'AsyncStorage browser',
   slot: 'both',
-  icon: '💾',
+  icon: size => /*#__PURE__*/(0, _jsxRuntime.jsx)(_floatingToolsCore.StorageIcon, {
+    size: size
+  }),
   color: '#BA68C8'
 }, {
   id: 'network',
@@ -63,28 +100,36 @@ const defaultToolPresets = exports.defaultToolPresets = [{
   name: 'QUERY',
   description: 'React Query inspector',
   slot: 'both',
-  icon: '🔍',
+  icon: size => /*#__PURE__*/(0, _jsxRuntime.jsx)(_floatingToolsCore.QueryIcon, {
+    size: size
+  }),
   color: '#FF4154'
 }, {
   id: 'route-events',
   name: 'ROUTES',
   description: 'Route tracking & navigation inspector',
   slot: 'both',
-  icon: '🗺️',
+  icon: size => /*#__PURE__*/(0, _jsxRuntime.jsx)(_floatingToolsCore.RoutesIcon, {
+    size: size
+  }),
   color: '#FF9F1C'
 }, {
   id: 'highlight-updates',
   name: 'RENDERS',
   description: 'View component render tracking',
   slot: 'dial',
-  icon: '✨',
+  icon: size => /*#__PURE__*/(0, _jsxRuntime.jsx)(_floatingToolsCore.RendersIcon, {
+    size: size
+  }),
   color: '#10b981'
 }, {
   id: 'debug-borders',
   name: 'DEBUG BORDERS',
   description: 'Component layout borders',
   slot: 'dial',
-  icon: '📐',
+  icon: size => /*#__PURE__*/(0, _jsxRuntime.jsx)(DebugBordersGlyph, {
+    size: size
+  }),
   color: '#10b981'
 }];
 

package/lib/module/floatingMenu/AppHost.js

@@ -5,6 +5,7 @@ import React, { createContext, useCallback, useContext, useMemo, useState, useEf
 import { BackHandler, Modal, StyleSheet, View } from "react-native";
 import { resolveOpenAppsState } from "./AppHostLogic.js";
 import { useMinimizedTools } from "./MinimizedToolsContext.js";
+import { ToolModalShell } from "./ToolHost.js";
 import { useDevToolsSettings } from "./DevToolsSettingsModal";
 import { jsx as _jsx, Fragment as _Fragment } from "react/jsx-runtime";
 const AppHostContext = /*#__PURE__*/createContext(null);
@@ -76,6 +77,7 @@ export const AppHostProvider = ({
           singleton: appDef.singleton,
           icon: resolvedIcon,
           color: appDef.color,
+          modal: appDef.modal,
           minimized: minimized // Preserve minimized state
         });
       }
@@ -250,6 +252,22 @@ const AppRenderer = ({
       enableSharedModalDimensions: true
     } : {})
   };
+
+  // Declarative chrome: the component is a plain body — wrap it in the shared
+  // modal shell (JsModal + managed header + search + toasts).
+  if (app.modal && (app.launchMode === "self-modal" || !app.launchMode)) {
+    return /*#__PURE__*/_jsx(ToolModalShell, {
+      app: app,
+      config: app.modal,
+      visible: isVisible,
+      zIndex: zIndex,
+      onClose: onClose,
+      onMinimize: onMinimize,
+      initialModalState: app.restoreState,
+      enableSharedModalDimensions: globalEnableSharedModalDimensions === true,
+      bodyProps: mergedProps
+    });
+  }
   if (app.launchMode === "self-modal") {
     return /*#__PURE__*/_jsx(Comp, {
       ...mergedProps,