foldkit 0.111.1 → 0.112.1

package/dist/runtime/runtime.js

@@ -1,7 +1,6 @@
-import { BrowserRuntime } from '@effect/platform-browser';
 import { Array, Cause, Context, Duration, Effect, Exit, Fiber, Function, Layer, Match, Option, Predicate, PubSub, Queue, Record, Ref, Scheduler, Schema, Stream, SubscriptionRef, pipe, } from 'effect';
 import { h } from 'snabbdom';
-import { createOverlay } from '../devTools/overlay.js';
+import { BrowserRuntime } from '@effect/platform-browser';
 import { createDevToolsStore, } from '../devTools/store.js';
 import { startWebSocketBridge } from '../devTools/webSocketBridge.js';
 import { __beginRender as beginHtmlRender, __clearRuntime as clearHtmlRuntime, __createBoundaryRegistry as createHtmlBoundaryRegistry, __setRuntime as setHtmlRuntime, } from '../html/index.js';
@@ -540,9 +539,10 @@ const makeRuntime = ({ ports, Model, flags: resolveFlags, init, update, view, ma
             position: config.position ?? DEFAULT_DEV_TOOLS_POSITION,
             mode: resolveDevToolsMode(config.mode ?? DEFAULT_DEV_TOOLS_MODE),
             maybeBanner: Option.fromNullishOr(config.banner),
+            maybeOverlay: Option.fromNullishOr(config.overlay),
         })));
         if (Option.isSome(resolvedDevTools)) {
-            const { position, mode, maybeBanner } = resolvedDevTools.value;
+            const { position, mode, maybeBanner, maybeOverlay } = resolvedDevTools.value;
             // NOTE: when excludeFromHistory is active, the runtime drops
             // excluded Messages from the recorded history. Replay walks the
             // recorded entries forward from the nearest keyframe. With
@@ -590,7 +590,10 @@ const makeRuntime = ({ ports, Model, flags: resolveFlags, init, update, view, ma
             // The init render runs below; capture the events it produces. We
             // record init AFTER that render so the buffer reflects the mounts
             // that fired on the first paint.
-            yield* createOverlay(devToolsStore, position, mode, maybeBanner);
+            yield* Option.match(maybeOverlay, {
+                onNone: () => Effect.void,
+                onSome: overlay => overlay(devToolsStore, position, mode, maybeBanner),
+            });
             if (import.meta.hot) {
                 const maybeMessageSchema = devTools !== undefined && devTools !== false
                     ? Option.fromNullishOr(devTools.Message)
@@ -658,10 +661,24 @@ const makeRuntime = ({ ports, Model, flags: resolveFlags, init, update, view, ma
             yield* crashWith(cause, maybeMessage);
         }))));
         // NOTE: reloading on bfcache restore is a page-level decision, so
-        // only a page-owning runtime installs the listener. An embedded app
-        // must never force the host page to reload.
-        if (manageDocument) {
-            yield* Effect.acquireRelease(Effect.sync(() => addBfcacheRestoreListener()), removeBfcacheRestoreListener => Effect.sync(() => removeBfcacheRestoreListener()));
+        // only a page-owning runtime that manages the document installs the
+        // listener. An app started through `embed` carries a host connector
+        // and must never force the host page to reload, so it is excluded
+        // even when it manages the document.
+        //
+        // The listener is installed for the page's whole lifetime and is
+        // deliberately not torn down with the runtime scope.
+        // `BrowserRuntime.runMain` interrupts the runtime on `beforeunload`,
+        // which is exactly when the browser freezes the page into the
+        // back/forward cache. A scope-bound listener would be removed by that
+        // interrupt before the freeze, so the `pageshow` restore would have
+        // nothing left to reload and the page would come back blank: the
+        // interrupt finalizer empties the container. A full document
+        // navigation (the only way into and out of a cross-origin-isolated
+        // page) is what exercises this path. Registration is idempotent, so an
+        // HMR re-run does not stack listeners.
+        if (manageDocument && Option.isNone(maybeConnector)) {
+            yield* Effect.sync(() => addBfcacheRestoreListener());
         }
         if (subscriptions) {
             yield* pipe(subscriptions, Record.toEntries, Effect.forEach(([_key, { dependenciesSchema, modelToDependencies, keepAliveEquivalence, dependenciesToStream, },]) => Effect.gen(function* () {

package/dist/runtime/subscription.d.ts

@@ -42,7 +42,7 @@ type Entry<Model, Message, Dependencies, Services = never> = EntryWithoutKeepAli
  *   Stream can still read the latest dependencies via the second
  *   `readDependencies` argument. Use this when the Stream needs mid-flight
  *   access to data that changes often but shouldn't trigger restarts
- *   (Foldkit UI's `Ui.DragAndDrop.autoScroll` reading the latest pointer
+ *   (Foldkit UI's `DragAndDrop.autoScroll` reading the latest pointer
  *   `clientY` each rAF tick is the canonical example).
  *
  * `dependenciesSchema` must be a `Schema.Struct` so every dependency is

package/dist/subscription/public.d.ts

@@ -1,5 +1,5 @@
 export { aggregate, lift, make, persistent } from '../runtime/subscription.js';
-export type { Subscription, Subscriptions } from '../runtime/subscription.js';
+export type { EntryWithoutKeepAlive, Subscription, Subscriptions, } from '../runtime/subscription.js';
 export { animationFrame } from './animationFrame.js';
 export type { AnimationFrameConfig } from './animationFrame.js';
 //# sourceMappingURL=public.d.ts.map

package/dist/subscription/public.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/subscription/public.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE9E,YAAY,EAAE,YAAY,EAAE,aAAa,EAAE,MAAM,4BAA4B,CAAA;AAE7E,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA"}
+{"version":3,"file":"public.d.ts","sourceRoot":"","sources":["../../src/subscription/public.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,SAAS,EAAE,IAAI,EAAE,IAAI,EAAE,UAAU,EAAE,MAAM,4BAA4B,CAAA;AAE9E,YAAY,EACV,qBAAqB,EACrB,YAAY,EACZ,aAAa,GACd,MAAM,4BAA4B,CAAA;AAEnC,OAAO,EAAE,cAAc,EAAE,MAAM,qBAAqB,CAAA;AAEpD,YAAY,EAAE,oBAAoB,EAAE,MAAM,qBAAqB,CAAA"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "foldkit",
-  "version": "0.111.1",
+  "version": "0.112.1",
   "description": "A TypeScript frontend framework, built on Effect and architected like Elm",
   "type": "module",
   "main": "./dist/index.js",
@@ -95,6 +95,10 @@
       "types": "./dist/struct/public.d.ts",
       "import": "./dist/struct/public.js"
     },
+    "./submodel": {
+      "types": "./dist/submodel/public.d.ts",
+      "import": "./dist/submodel/public.js"
+    },
     "./subscription": {
       "types": "./dist/subscription/public.d.ts",
       "import": "./dist/subscription/public.js"
@@ -107,94 +111,6 @@
       "types": "./dist/test/vitest.d.ts",
       "import": "./dist/test/vitest.js"
     },
-    "./ui": {
-      "types": "./dist/ui/index.d.ts",
-      "import": "./dist/ui/index.js"
-    },
-    "./ui/animation": {
-      "types": "./dist/ui/animation/public.d.ts",
-      "import": "./dist/ui/animation/public.js"
-    },
-    "./ui/button": {
-      "types": "./dist/ui/button/public.d.ts",
-      "import": "./dist/ui/button/public.js"
-    },
-    "./ui/calendar": {
-      "types": "./dist/ui/calendar/public.d.ts",
-      "import": "./dist/ui/calendar/public.js"
-    },
-    "./ui/checkbox": {
-      "types": "./dist/ui/checkbox/public.d.ts",
-      "import": "./dist/ui/checkbox/public.js"
-    },
-    "./ui/dialog": {
-      "types": "./dist/ui/dialog/public.d.ts",
-      "import": "./dist/ui/dialog/public.js"
-    },
-    "./ui/disclosure": {
-      "types": "./dist/ui/disclosure/public.d.ts",
-      "import": "./dist/ui/disclosure/public.js"
-    },
-    "./ui/fieldset": {
-      "types": "./dist/ui/fieldset/public.d.ts",
-      "import": "./dist/ui/fieldset/public.js"
-    },
-    "./ui/input": {
-      "types": "./dist/ui/input/public.d.ts",
-      "import": "./dist/ui/input/public.js"
-    },
-    "./ui/listbox": {
-      "types": "./dist/ui/listbox/public.d.ts",
-      "import": "./dist/ui/listbox/public.js"
-    },
-    "./ui/combobox": {
-      "types": "./dist/ui/combobox/public.d.ts",
-      "import": "./dist/ui/combobox/public.js"
-    },
-    "./ui/menu": {
-      "types": "./dist/ui/menu/public.d.ts",
-      "import": "./dist/ui/menu/public.js"
-    },
-    "./ui/popover": {
-      "types": "./dist/ui/popover/public.d.ts",
-      "import": "./dist/ui/popover/public.js"
-    },
-    "./ui/radioGroup": {
-      "types": "./dist/ui/radioGroup/public.d.ts",
-      "import": "./dist/ui/radioGroup/public.js"
-    },
-    "./ui/select": {
-      "types": "./dist/ui/select/public.d.ts",
-      "import": "./dist/ui/select/public.js"
-    },
-    "./ui/slider": {
-      "types": "./dist/ui/slider/public.d.ts",
-      "import": "./dist/ui/slider/public.js"
-    },
-    "./ui/switch": {
-      "types": "./dist/ui/switch/public.d.ts",
-      "import": "./dist/ui/switch/public.js"
-    },
-    "./ui/textarea": {
-      "types": "./dist/ui/textarea/public.d.ts",
-      "import": "./dist/ui/textarea/public.js"
-    },
-    "./ui/tabs": {
-      "types": "./dist/ui/tabs/public.d.ts",
-      "import": "./dist/ui/tabs/public.js"
-    },
-    "./ui/toast": {
-      "types": "./dist/ui/toast/public.d.ts",
-      "import": "./dist/ui/toast/public.js"
-    },
-    "./ui/tooltip": {
-      "types": "./dist/ui/tooltip/public.d.ts",
-      "import": "./dist/ui/tooltip/public.js"
-    },
-    "./ui/virtualList": {
-      "types": "./dist/ui/virtualList/public.d.ts",
-      "import": "./dist/ui/virtualList/public.js"
-    },
     "./url": {
       "types": "./dist/url/public.d.ts",
       "import": "./dist/url/public.js"
@@ -202,6 +118,10 @@
     "./devtools-protocol": {
       "types": "./dist/devTools/public.d.ts",
       "import": "./dist/devTools/public.js"
+    },
+    "./devtools-host": {
+      "types": "./dist/devTools/host.d.ts",
+      "import": "./dist/devTools/host.js"
     }
   },
   "sideEffects": false,
@@ -237,7 +157,6 @@
     "directory": "packages/foldkit"
   },
   "dependencies": {
-    "@floating-ui/dom": "^1.7.6",
     "clsx": "^2.1.1",
     "snabbdom": "^3.6.3"
   },
@@ -249,10 +168,10 @@
   },
   "scripts": {
     "clean": "rimraf dist *.tsbuildinfo",
-    "build": "pnpm run clean && node scripts/inline-css.js && tsc -b tsconfig.build.json",
-    "watch": "node scripts/inline-css.js && tsc -b tsconfig.build.json --watch",
+    "build": "pnpm run clean && tsc -b tsconfig.build.json",
+    "watch": "tsc -b tsconfig.build.json --watch",
     "lint": "eslint src",
-    "typecheck": "node scripts/inline-css.js && tsc -b tsconfig.build.json --noEmit",
+    "typecheck": "tsc -b tsconfig.build.json --noEmit",
     "test": "vitest run",
     "docs": "typedoc"
   }

package/dist/devTools/overlay-styles.d.ts

@@ -1,3 +0,0 @@
-declare const overlayStyles = ":host {\n  position: relative;\n  z-index: 2147483647;\n\n  --dt-bg: #1e1e2e;\n  --dt-surface-selected: #282839;\n  --dt-border: #45475a;\n  --dt-text: #cdd6f4;\n  --dt-text-muted: #9399b2;\n  --dt-accent: #cba6f7;\n  --dt-live: #a6e3a1;\n  --dt-paused: #fab387;\n  --dt-json-string: #a6e3a1;\n  --dt-json-number: #89b4fa;\n  --dt-json-boolean: #fab387;\n  --dt-json-null: #9399b2;\n  --dt-json-key: #89dceb;\n  --dt-json-tag: #cba6f7;\n  --dt-json-preview: #9399b2;\n  --dt-json-arrow: #9399b2;\n  --dt-tree-hover: #313244;\n  --dt-diff-changed: #74c7ec;\n}\n\n*,\n*::before,\n*::after {\n  box-sizing: border-box;\n  margin: 0;\n  padding: 0;\n}\nbutton {\n  font: inherit;\n  color: inherit;\n}\nul {\n  list-style: none;\n}\n\n.fixed {\n  position: fixed;\n}\n.flex {\n  display: flex;\n}\n.flex-col {\n  flex-direction: column;\n}\n.flex-1 {\n  flex: 1 1 0%;\n}\n.items-center {\n  align-items: center;\n}\n.justify-center {\n  justify-content: center;\n}\n.justify-between {\n  justify-content: space-between;\n}\n.shrink-0 {\n  flex-shrink: 0;\n}\n.inline-block {\n  display: inline-block;\n}\n.gap-0\\.5 {\n  gap: 2px;\n}\n.gap-1\\.5 {\n  gap: 6px;\n}\n.gap-2 {\n  gap: 8px;\n}\n.gap-3 {\n  gap: 12px;\n}\n.gap-px {\n  gap: 1px;\n}\n.px-1 {\n  padding-left: 4px;\n  padding-right: 4px;\n}\n.px-2 {\n  padding-left: 8px;\n  padding-right: 8px;\n}\n.px-2\\.5 {\n  padding-left: 10px;\n  padding-right: 10px;\n}\n.p-3 {\n  padding: 12px;\n}\n.px-3 {\n  padding-left: 12px;\n  padding-right: 12px;\n}\n.py-0\\.5 {\n  padding-top: 2px;\n  padding-bottom: 2px;\n}\n.pt-1 {\n  padding-top: 4px;\n}\n.pl-1 {\n  padding-left: 4px;\n}\n.py-1 {\n  padding-top: 4px;\n  padding-bottom: 4px;\n}\n.py-1\\.5 {\n  padding-top: 6px;\n  padding-bottom: 6px;\n}\n.py-2 {\n  padding-top: 8px;\n  padding-bottom: 8px;\n}\n.py-px {\n  padding-top: 1px;\n  padding-bottom: 1px;\n}\n.w-1\\.5 {\n  width: 6px;\n}\n.h-1\\.5 {\n  height: 6px;\n}\n.w-3 {\n  width: 12px;\n}\n.w-5 {\n  width: 20px;\n}\n.h-5 {\n  height: 20px;\n}\n.w-14 {\n  width: 56px;\n}\n.h-14 {\n  height: 56px;\n}\n.min-w-0 {\n  min-width: 0;\n}\n.min-w-5 {\n  min-width: 20px;\n}\n.min-h-0 {\n  min-height: 0;\n}\n/* Badge positions \u2014 flush against side edge */\n.dt-pos-br {\n  bottom: 16px;\n  right: 0;\n  border-radius: 6px 0 0 6px;\n}\n.dt-pos-bl {\n  bottom: 16px;\n  left: 0;\n  border-radius: 0 6px 6px 0;\n}\n.dt-pos-tr {\n  top: 16px;\n  right: 0;\n  border-radius: 6px 0 0 6px;\n}\n.dt-pos-tl {\n  top: 16px;\n  left: 0;\n  border-radius: 0 6px 6px 0;\n}\n.overflow-hidden {\n  overflow: hidden;\n}\n.overflow-auto {\n  overflow: auto;\n}\n.overflow-y-auto {\n  overflow-y: auto;\n}\n.overscroll-none {\n  overscroll-behavior: none;\n}\n\n.truncate {\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n}\n.rounded {\n  border-radius: 4px;\n}\n.rounded-lg {\n  border-radius: 8px;\n}\n.rounded-full {\n  border-radius: 9999px;\n}\n.border {\n  border-width: 1px;\n  border-style: solid;\n  border-color: var(--dt-border);\n}\n.border-b {\n  border-bottom: 1px solid var(--dt-border);\n}\n.border-t {\n  border-top: 1px solid var(--dt-border);\n}\n.border-r {\n  border-right: 1px solid var(--dt-border);\n}\n.border-l {\n  border-left: 1px solid var(--dt-border);\n}\n.border-none {\n  border: none;\n}\n.selected {\n  background-color: var(--dt-surface-selected);\n}\n.dt-row:hover:not(.selected) {\n  background-color: var(--dt-tree-hover);\n}\n.dt-header-button:hover {\n  color: var(--dt-text);\n}\n.dt-resume-button:hover {\n  opacity: 0.7;\n}\n.dt-scroll-pill {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 6px;\n  flex-shrink: 0;\n  padding: 4px 12px;\n  background-color: var(--dt-surface-selected);\n  border: none;\n  border-bottom: 1px solid var(--dt-border);\n  color: var(--dt-accent);\n  font-family:\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n  font-size: 13px;\n  cursor: pointer;\n}\n.dt-scroll-pill-icon {\n  width: 12px;\n  height: 12px;\n}\n.dt-scroll-pill-text {\n  margin-top: 1px;\n}\n.dt-scroll-pill:hover {\n  background-color: var(--dt-tree-hover);\n}\n.dt-scroll-pill:focus-visible {\n  outline: 1px solid var(--dt-accent);\n  outline-offset: -1px;\n}\n.dt-filter-wrapper {\n  position: relative;\n  flex-shrink: 0;\n  border-bottom: 1px solid var(--dt-border);\n}\n.dt-filter-button {\n  width: 100%;\n  display: flex;\n  align-items: center;\n  justify-content: space-between;\n  padding: 6px 12px;\n  background: transparent;\n  border: none;\n  color: var(--dt-text-muted);\n  font-family:\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n  font-size: 13px;\n  cursor: pointer;\n  text-align: left;\n}\n.dt-filter-button:hover {\n  color: var(--dt-text);\n  background-color: var(--dt-tree-hover);\n}\n.dt-filter-button:focus-visible {\n  outline: 1px solid var(--dt-accent);\n  outline-offset: -1px;\n}\n.dt-filter-button[data-open] {\n  color: var(--dt-text);\n  background-color: var(--dt-surface-selected);\n}\n.dt-filter-button[data-open]:hover {\n  background-color: var(--dt-tree-hover);\n}\n.dt-filter-button[data-open] .json-arrow {\n  transform: rotate(180deg);\n}\n.dt-filter-items {\n  position: absolute;\n  top: 100%;\n  left: 0;\n  right: 0;\n  background-color: var(--dt-bg);\n  border-top: 1px solid var(--dt-border);\n  border-bottom: 1px solid var(--dt-border);\n  z-index: 10;\n  max-height: 200px;\n  overflow-y: auto;\n  outline: none;\n}\n.dt-filter-item {\n  padding: 6px 12px;\n  color: var(--dt-text-muted);\n  cursor: pointer;\n  font-family:\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n  font-size: 13px;\n  border-bottom: 1px solid var(--dt-border);\n}\n.dt-filter-item:last-child {\n  border-bottom: none;\n}\n.dt-filter-item[data-active] {\n  background-color: var(--dt-tree-hover);\n  color: var(--dt-text);\n}\n.dt-filter-item[data-selected] {\n  color: var(--dt-accent);\n}\n.dt-filter-check {\n  width: 12px;\n  height: 12px;\n  visibility: hidden;\n}\n.dt-filter-item[data-selected] .dt-filter-check {\n  visibility: visible;\n  color: var(--dt-accent);\n}\n.dt-filter-backdrop {\n  position: fixed;\n  inset: 0;\n  pointer-events: none;\n}\n.dt-tab-button {\n  position: relative;\n  background: transparent;\n  border: none;\n  border-right: 1px solid var(--dt-border);\n  outline: none;\n  flex: 1;\n}\n.dt-tab-button:last-child {\n  border-right: none;\n}\n.dt-tab-active {\n  background-color: var(--dt-surface-selected);\n}\n.dt-tab-button:not(.dt-tab-active):hover {\n  color: var(--dt-text);\n  background-color: rgba(49, 50, 68, 0.3);\n}\n.font-sans {\n  font-family:\n    system-ui,\n    -apple-system,\n    BlinkMacSystemFont,\n    'Segoe UI',\n    Roboto,\n    sans-serif;\n}\n.font-mono {\n  font-family:\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n}\n.font-medium {\n  font-weight: 500;\n}\n.font-semibold {\n  font-weight: 600;\n}\n.text-xs {\n  font-size: 12px;\n}\n.text-2xs {\n  font-size: 10px;\n}\n.text-sm {\n  font-size: 11px;\n}\n.text-base {\n  font-size: 13px;\n}\n.text-md {\n  font-size: 15px;\n}\n.text-lg {\n  font-size: 20px;\n}\n.text-xl {\n  font-size: 26px;\n}\n.italic {\n  font-style: italic;\n}\n.text-right {\n  text-align: right;\n}\n.tracking-wide {\n  letter-spacing: 0.025em;\n}\n.tracking-wider {\n  letter-spacing: 0.05em;\n}\n.leading-none {\n  line-height: 1;\n}\n.leading-snug {\n  line-height: 1.35;\n}\n.bg-dt-bg {\n  background-color: var(--dt-bg);\n}\n.bg-dt-live {\n  background-color: var(--dt-live);\n}\n.bg-transparent {\n  background-color: transparent;\n}\n.text-dt {\n  color: var(--dt-text);\n}\n.text-dt-bg {\n  color: var(--dt-bg);\n}\n.text-dt-muted {\n  color: var(--dt-text-muted);\n}\n.text-dt-accent {\n  color: var(--dt-accent);\n}\n.text-dt-live {\n  color: var(--dt-live);\n}\n.text-dt-paused {\n  color: var(--dt-paused);\n}\n.cursor-pointer {\n  cursor: pointer;\n}\n.outline-none {\n  outline: none;\n}\n.transition-colors {\n  transition-property: color, background-color, border-color;\n  transition-duration: 100ms;\n  transition-timing-function: ease;\n}\n\n/* Panel */\n.dt-panel {\n  width: 360px;\n  height: 480px;\n  box-shadow: 0 8px 32px rgba(0, 0, 0, 0.5);\n  z-index: 99998;\n}\n/* Panel positions */\n.dt-panel-br {\n  bottom: 16px;\n  right: 28px;\n}\n.dt-panel-bl {\n  bottom: 16px;\n  left: 28px;\n}\n.dt-panel-tr {\n  top: 16px;\n  right: 28px;\n}\n.dt-panel-tl {\n  top: 16px;\n  left: 28px;\n}\n.dt-panel-wide {\n  width: 720px;\n}\n.dt-message-pane {\n  width: 320px;\n  flex-shrink: 0;\n}\n.dt-badge {\n  z-index: 99999;\n  box-shadow: -2px 0 8px rgba(0, 0, 0, 0.3);\n  transition: background-color 150ms ease;\n  border: 1px solid var(--dt-border);\n}\n.dt-badge-accent:hover {\n  background-color: #252538;\n}\n.dt-badge-paused {\n  background-color: var(--dt-paused);\n  color: var(--dt-bg);\n  border: none;\n}\n.dt-badge-paused:hover {\n  background-color: #e0a070;\n}\n.dt-badge.dt-pos-br,\n.dt-badge.dt-pos-tr {\n  border-right: none;\n}\n.dt-badge.dt-pos-bl,\n.dt-badge.dt-pos-tl {\n  border-left: none;\n}\n\n/* JSON tree */\n.tree-row {\n  position: relative;\n  white-space: nowrap;\n  line-height: 18px;\n  padding-right: 8px;\n}\n.tree-row-expandable:hover {\n  background-color: var(--dt-tree-hover);\n}\n.inspector-tree {\n  font-family:\n    ui-monospace, SFMono-Regular, 'SF Mono', Menlo, Consolas, monospace;\n}\n.json-key {\n  color: var(--dt-json-key);\n}\n.json-string {\n  color: var(--dt-json-string);\n}\n.json-number {\n  color: var(--dt-json-number);\n}\n.json-boolean {\n  color: var(--dt-json-boolean);\n}\n.json-null {\n  color: var(--dt-json-null);\n}\n.json-tag {\n  color: var(--dt-json-tag);\n  margin-right: 4px;\n}\n.json-preview {\n  color: var(--dt-json-preview);\n}\n.json-arrow {\n  color: var(--dt-json-arrow);\n  width: 10px;\n  height: 10px;\n  user-select: none;\n}\n\n/* Diff */\n.diff-changed {\n  background-color: rgba(116, 199, 236, 0.06);\n}\n.diff-dot {\n  position: absolute;\n  left: 3px;\n  width: 5px;\n  height: 5px;\n  border-radius: 9999px;\n  background-color: var(--dt-diff-changed);\n}\n.diff-dot-inline {\n  width: 5px;\n  height: 5px;\n  border-radius: 9999px;\n  background-color: var(--dt-diff-changed);\n  flex-shrink: 0;\n}\n.dot-column {\n  width: 5px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.pause-column {\n  width: 8px;\n  flex-shrink: 0;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n.dt-pause-icon {\n  width: 8px;\n  height: 8px;\n  color: var(--dt-paused);\n}\n\n/* Interaction blocker \u2014 covers the app while time-travelling */\n.dt-interaction-blocker {\n  position: fixed;\n  inset: 0;\n  z-index: 99997;\n  cursor: not-allowed;\n}\n\n/* Scrubber */\n.dt-scrubber-row {\n  background-color: var(--dt-bg);\n}\n.dt-scrubber-control {\n  position: relative;\n  height: 16px;\n  width: 100%;\n  padding: 0 7px;\n  display: flex;\n  align-items: center;\n}\n.dt-scrubber-track {\n  width: 100%;\n  height: 4px;\n  background-color: var(--dt-border);\n  border-radius: 9999px;\n  cursor: pointer;\n}\n.dt-scrubber-track[data-disabled] {\n  cursor: not-allowed;\n}\n.dt-scrubber-fill {\n  height: 100%;\n  background-color: var(--dt-accent);\n  border-radius: 9999px;\n}\n.dt-scrubber-thumb {\n  width: 14px;\n  height: 14px;\n  border-radius: 9999px;\n  background-color: var(--dt-accent);\n  border: 2px solid var(--dt-bg);\n  cursor: grab;\n  outline: none;\n  top: 50%;\n  margin-top: -7px;\n  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);\n}\n.dt-scrubber-thumb:focus-visible {\n  outline: 2px solid var(--dt-text);\n  outline-offset: 2px;\n}\n.dt-scrubber-thumb[data-dragging] {\n  cursor: grabbing;\n}\n.dt-scrubber-position {\n  width: 72px;\n  padding-left: 12px;\n  border-left: 1px solid var(--dt-border);\n  align-self: stretch;\n  margin-top: -8px;\n  margin-bottom: -8px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n/* Mobile */\n@media (max-width: 767px) {\n  .dt-panel {\n    top: 0;\n    left: 0;\n    right: 0;\n    bottom: 0;\n    width: 100%;\n    height: 100%;\n    border-radius: 0;\n    border: none;\n  }\n  .dt-panel-wide {\n    width: 100%;\n  }\n  .dt-content {\n    flex-direction: column;\n  }\n  .dt-message-pane {\n    width: 100%;\n    max-height: 40%;\n    border-bottom: 1px solid var(--dt-border);\n  }\n  .message-list > :last-child {\n    border-bottom: none;\n  }\n  .dt-inspector-pane {\n    border-left: none;\n  }\n  .dt-badge.dt-pos-br,\n  .dt-badge.dt-pos-bl {\n    bottom: 44px;\n  }\n}\n";
-export { overlayStyles };
-//# sourceMappingURL=overlay-styles.d.ts.map

package/dist/devTools/overlay-styles.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"overlay-styles.d.ts","sourceRoot":"","sources":["../../src/devTools/overlay-styles.ts"],"names":[],"mappings":"AAAA,QAAA,MAAM,aAAa,g1YAgsBlB,CAAA;AAED,OAAO,EAAE,aAAa,EAAE,CAAA"}