@buoy-gg/time-machine 7.0.36 → 7.0.38

package/README.md

@@ -1,55 +1,60 @@
 # @buoy-gg/time-machine
 
-## Description
+Save and restore supported client state while testing a React Native app. A restore point can include registered storage, Redux, Zustand, Jotai, and the React Query cache. Review the restore preview before applying changes.
 
-time-machine package for the monorepo.
+## Install
 
-## Installation
-
-This package is part of the monorepo and is automatically available to other packages and the example app.
+```bash
+npm install @buoy-gg/core @buoy-gg/time-machine
+```
 
-## Usage
+## Account setup
 
-```typescript
-import { TimeMachineComponent } from '@buoy-gg/time-machine';
+Start in a development build with a Free or Pro Buoy account key. From the app directory:
 
-// Use in your component
-<TimeMachineComponent title="Hello World" />
+```bash
+npx --package=@buoy-gg/core buoy login
 ```
 
-## Development
+For Expo, initialize Buoy with the key written to `.env.local`:
 
-### Building
+```tsx
+import { Buoy } from "@buoy-gg/core";
 
-```bash
-pnpm build
+Buoy.init({ licenseKey: process.env.EXPO_PUBLIC_BUOY_KEY });
 ```
 
-### Type Checking
+For React Native CLI, pass the key through your app's environment configuration; `.env.local` is not loaded automatically. Keep the menu inside the providers used by your app. Restart the development server after installing packages. See the [Quick Start](https://buoy.gg/buoy/latest/docs/quick-start) for the complete root component.
 
-```bash
-pnpm typecheck
-```
+## Use a restore point
 
-### Clean Build
+Mount `FloatingDevTools` in your app. Buoy discovers this package. Install and configure the source tools for the state you want to capture: Storage, Redux, Zustand, Jotai, or React Query.
 
-```bash
-pnpm clean
-```
+1. Put the app into a recognizable test state and capture a named restore point.
+2. Change a disposable value through the app.
+3. Open the restore preview. Check additions, removals, overwrites, skipped items, and selected sources.
+4. Restore, then read the value from the app and inspect the per-source results.
 
-## Structure
+To repeat one restore many times, tap **Action bar** in the tool header or swipe a restore point and choose **Bar**. The tool minimizes and a floating strip stays over the app with one restore point armed: tap to restore it (long press for state only, without changing screens), `+` to name, capture and arm a new point, the chevron beside the name picks another. Each restore from the strip saves a "Before last restore" copy first and offers Undo for ten seconds. The strip's picker has a "Reload the app after restoring" switch for screens that read their state from storage only on mount (a cart kept in a React context, for example): a live restore cannot reach `useState`, a reload can. The strip returns after a reload and can be dragged or hidden at the screen edge.
 
-```
-time-machine/
-├── src/
-│   └── index.ts        # Main export file
-├── lib/                # Built output (git ignored)
-├── package.json
-├── tsconfig.json
-└── README.md
-```
+Live restore applies supported state in place. Restore + reload writes persisted storage and reloads JavaScript so the app can initialize from that storage. Optional Expo Router URL restoration does not recreate the entire navigation back stack.
+
+Each tile in the Sources strip is a switch. A source switched off is left out of every capture and restore, so a store the app cannot survive having replaced (a Zustand store holding live handles, for example) can stay untouched while the rest of the state round-trips.
+
+## Restore limits
+
+Restoring can remove keys absent from the snapshot. Exclude values you need to preserve in the preview. Read-only or unsupported values are skipped and reported. SecureStore and MMKV require the same registered keys and instances as the Storage tool.
+
+Backend changes, component-local useState, and in-flight requests are not restored. A restored cart or session remains subject to backend validation. Redux needs a supported full-state restore integration; writable Jotai atoms can be restored, while read-only atoms recompute. React Query mutation history is not replayed.
+
+## API
+
+For explicit registration, use the exported `createTimeMachineTool` or `timeMachineToolPreset`. Advanced integrations can use `timeMachineStore`, `RestoreOptions`, and `RestoreOutcome`.
+
+See the [Time Machine guide](https://buoy.gg/buoy/latest/docs/tools/time-machine) for source-specific behavior, persistent exclusions, and restore results.
+
+## Desktop and MCP
 
-## Dependencies
+React Native connections require `@buoy-gg/external-sync`. Follow the [Desktop connection guide](https://buoy.gg/buoy/latest/docs/desktop), sign in to Desktop separately, and confirm the selected device. [MCP](https://buoy.gg/buoy/latest/docs/mcp) also needs a process account and Pro access.
 
-- Uses `@buoy-gg/shared-ui` for common components and utilities
-- React and React Native as peer dependencies
+Device data can travel over your LAN to the configured broker. Account validation makes network requests. See [Telemetry](https://buoy.gg/buoy/latest/docs/telemetry) for data-flow details.

package/lib/commonjs/components/HeaderActions.js

@@ -0,0 +1,91 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.HeaderBarButton = HeaderBarButton;
+exports.TimeMachineHeaderActions = TimeMachineHeaderActions;
+var _reactNative = require("react-native");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _core = require("@buoy-gg/core");
+var _HeaderReloadButton = require("./HeaderReloadButton");
+var _TimeMachineFloatingTool = require("./floating/TimeMachineFloatingTool");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * The tool's header actions, in Network's header language: labeled
+ * dark-glass chips. "Action bar" is named for the thing it opens, the
+ * floating action bar over the app, and takes the accent ink as the one
+ * action a newcomer has to find. Reload is the plain JS reload.
+ *
+ * Action bar puts a restore point on the floating bar and gets the modal out
+ * of the way. The preview screen passes the point it is showing as `armId`,
+ * so opening it from there arms that point; the list leaves it to the
+ * default rule.
+ */
+
+function HeaderBarButton({
+  armId
+}) {
+  const host = (0, _core.useToolHost)();
+  const onPress = () => {
+    (0, _TimeMachineFloatingTool.openTimeMachineFloatingTool)(armId);
+    // Same move as Network: the bar is for using the app, so the modal
+    // minimizes to the dock instead of covering the screen the bar controls.
+    host.minimize();
+  };
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
+    style: styles.labeledChip,
+    onPress: onPress,
+    accessibilityLabel: "Open the floating action bar over the app",
+    accessibilityRole: "button",
+    testID: "time-machine-header-bar",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.View, {
+      style: styles.glyph
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+      style: styles.label,
+      children: "Action bar"
+    })]
+  });
+}
+function TimeMachineHeaderActions({
+  armId
+}) {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+    style: styles.row,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(HeaderBarButton, {
+      armId: armId
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_HeaderReloadButton.HeaderReloadButton, {})]
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  row: {
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 8
+  },
+  labeledChip: {
+    height: 32,
+    flexDirection: "row",
+    alignItems: "center",
+    gap: 6,
+    paddingHorizontal: 10,
+    borderRadius: 8,
+    borderWidth: 1,
+    borderColor: _sharedUi.night.color.border,
+    backgroundColor: _sharedUi.night.color.buttonSurface
+  },
+  // A small strip outline: the thing the button opens.
+  glyph: {
+    width: 14,
+    height: 8,
+    borderRadius: 3,
+    borderWidth: 1.5,
+    borderColor: _sharedUi.night.color.accent
+  },
+  label: {
+    fontSize: 11,
+    fontWeight: "700",
+    color: _sharedUi.night.color.accent
+  }
+});
+//# sourceMappingURL=HeaderActions.js.map

package/lib/commonjs/components/HeaderReloadButton.js

@@ -8,10 +8,11 @@ var _reactNative = require("react-native");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
- * Labeled "RELOAD APP" header action — the one reload affordance in the tool.
- * Plain JS-bundle reload (no restore): in-memory state rebuilds from whatever
- * is persisted. Registered as the preset's default headerActions, so it shows
- * on every screen unless a screen overrides the header actions.
+ * The reload header action: a plain JS-bundle reload (no restore), so
+ * in-memory state rebuilds from whatever is persisted.
+ *
+ * A labeled dark-glass chip, the same shape as the Pin chip beside it and
+ * Network's "Override": the words are the whole explanation.
  */
 
 function HeaderReloadButton() {
@@ -24,38 +25,34 @@ function HeaderReloadButton() {
       // No reload mechanism available (bare production build) — nothing to do.
     }
   };
-  return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.TouchableOpacity, {
-    style: styles.button,
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+    style: styles.chip,
     onPress: onPress,
-    hitSlop: {
-      top: 8,
-      bottom: 8,
-      left: 8,
-      right: 8
-    },
     accessibilityLabel: "Reload app",
+    accessibilityHint: "Reloads the JavaScript bundle without restoring anything",
     accessibilityRole: "button",
     testID: "time-machine-reload-app",
-    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.RefreshCw, {
-      size: 12,
-      color: _sharedUi.night.color.textSecondary
-    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
       style: styles.label,
-      children: "RELOAD APP"
-    })]
+      children: "Reload app"
+    })
   });
 }
 const styles = _reactNative.StyleSheet.create({
-  button: {
-    flexDirection: "row",
+  chip: {
+    height: 32,
+    paddingHorizontal: 10,
+    borderRadius: 8,
+    borderWidth: 1,
+    borderColor: _sharedUi.night.color.border,
+    backgroundColor: _sharedUi.night.color.buttonSurface,
     alignItems: "center",
-    gap: 6,
-    padding: 4
+    justifyContent: "center"
   },
   label: {
-    color: _sharedUi.night.color.textSecondary,
-    fontSize: 12,
-    fontWeight: "600"
+    fontSize: 11,
+    fontWeight: "700",
+    color: _sharedUi.night.color.textSecondary
   }
 });
 //# sourceMappingURL=HeaderReloadButton.js.map

package/lib/commonjs/components/TimeMachineBody.js

@@ -8,7 +8,6 @@ var _react = require("react");
 var _reactNative = require("react-native");
 var _sharedUi = require("@buoy-gg/shared-ui");
 var _core = require("@buoy-gg/core");
-var _license = require("@buoy-gg/license");
 var _useTimeMachine = require("../hooks/useTimeMachine");
 var _timeMachineStore = require("../store/timeMachineStore");
 var _primitives = require("../ui/primitives");
@@ -22,6 +21,9 @@ var _UndoDeleteBar = require("./list/UndoDeleteBar");
 var _SourcesStrip = require("./list/SourcesStrip");
 var _WipeAllRow = require("./list/WipeAllRow");
 var _PreviewFlow = require("./preview/PreviewFlow");
+var _TimeMachineFloatingTool = require("./floating/TimeMachineFloatingTool");
+var _armedPoint = require("./floating/armedPoint");
+var _sourceSettings = require("../store/sourceSettings");
 var _jsxRuntime = require("react/jsx-runtime");
 /**
  * Time Machine body — the screen router plus the restore-point list.
@@ -37,6 +39,7 @@ var _jsxRuntime = require("react/jsx-runtime");
  * app-wide wipe kept last and understated.
  */
 
+const isBarOpen = () => (0, _sharedUi.getFloatingTools)().some(tool => tool.id === _TimeMachineFloatingTool.TIME_MACHINE_FLOATING_TOOL_ID);
 function TimeMachineBody() {
   const [screen, setScreen] = (0, _react.useState)({
     kind: "list"
@@ -83,21 +86,35 @@ function RestorePointList({
     hasLoaded,
     busy,
     lastOutcome,
-    recentlyDeleted
+    recentlyDeleted,
+    remoteProviders
   } = (0, _useTimeMachine.useTimeMachineState)();
-  const isPro = (0, _license.useIsPro)();
   const snapshotLimit = (0, _sharedUi.useLimit)("timeMachine.snapshots");
   const host = (0, _core.useToolHost)();
   const insets = (0, _sharedUi.useSafeAreaInsets)({
     minBottom: 16
   });
+  // Which point the floating restore bar has armed, while the bar is open.
+  const barOpen = (0, _react.useSyncExternalStore)(_sharedUi.subscribeFloatingTools, isBarOpen, isBarOpen);
+  const pickedId = (0, _react.useSyncExternalStore)(_armedPoint.subscribePickedPoint, _armedPoint.getPickedPointId, _armedPoint.getPickedPointId);
+  const armedId = barOpen ? (0, _armedPoint.resolveArmedPoint)(snapshots, pickedId)?.id : undefined;
+  // Restoring the same point from this list again and again is what the bar
+  // is for; say so once, at the moment it is true.
+  const listRestores = (0, _react.useRef)({});
+  const [barHintFor, setBarHintFor] = (0, _react.useState)(null);
+  const putOnBar = id => {
+    setBarHintFor(null);
+    (0, _TimeMachineFloatingTool.openTimeMachineFloatingTool)(id);
+    host.minimize();
+  };
 
   // Header search (when hosted by the core shell) filters the list.
   const query = host.search.trim().toLowerCase();
   const visible = query ? snapshots.filter(s => s.name.toLowerCase().includes(query)) : snapshots;
 
-  // Infinity for Pro, so this is simply false for them.
-  const atCaptureLimit = snapshots.length >= snapshotLimit;
+  // Infinity for Pro, so this is simply false for them. The bar's safety
+  // slot is not a point you chose to keep, so it does not count.
+  const atCaptureLimit = snapshots.filter(s => !s.safety).length >= snapshotLimit;
   const captureDisabled = busy !== null || atCaptureLimit;
 
   /**
@@ -117,12 +134,16 @@ function RestorePointList({
       (0, _confirm.confirmDestructive)("Restore fresh install?", "This wipes all app storage and reloads the app.", "Wipe & reload", () => void _timeMachineStore.timeMachineStore.restore(meta.id, "reload"));
       return;
     }
+    const count = (listRestores.current[meta.id] ?? 0) + 1;
+    listRestores.current[meta.id] = count;
+    if (count >= 2 && !barOpen) setBarHintFor(meta.id);
     void _timeMachineStore.timeMachineStore.restore(meta.id, "live").then(outcome => {
       const clean = Object.values(outcome.results).every(r => r.ok);
       if (!clean || outcome.willReload) return;
       host.minimize();
     });
   };
+  const barHint = barHintFor && !barOpen ? snapshots.find(s => s.id === barHintFor) ?? null : null;
   return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.ScrollView, {
     style: styles.fill,
     contentContainerStyle: [styles.content, {
@@ -152,24 +173,47 @@ function RestorePointList({
     }), atCaptureLimit ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Footnote, {
       tone: "warning",
       testID: "time-machine-limit",
-      children: ["Free plan keeps ", snapshotLimit, " restore points. Upgrade to Pro for unlimited snapshots."]
+      children: ["Free plan keeps ", snapshotLimit, " restore point", snapshotLimit === 1 ? "" : "s", ". Upgrade to Pro for unlimited snapshots."]
     }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.SectionLabel, {
       children: "Sources"
     }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_SourcesStrip.SourcesStrip, {
-      sources: sources
-    }), sources.filter(s => s.detail && !(s.canCapture && s.canRestore)).map(s => /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Footnote, {
-      testID: `time-machine-source-${s.id}-detail`,
-      children: [s.label, ": ", s.detail]
-    }, s.id)), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.SectionLabel, {
+      sources: sources,
+      onToggle: remoteProviders ? undefined : _sourceSettings.setSourceEnabled
+    }), remoteProviders ? null : /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.Footnote, {
+      testID: "time-machine-sources-hint",
+      children: "Switch a source off to leave it out of every capture and restore."
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_primitives.SectionLabel, {
       children: "Restore Points"
-    }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Group, {
+    }), barHint ? /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+      style: styles.barHint,
+      testID: "time-machine-bar-hint",
+      children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Footnote, {
+        children: ["Restoring \"", barHint.name, "\" a lot? Put it on the floating action bar and restore it with one tap."]
+      }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+        onPress: () => putOnBar(barHint.id),
+        accessibilityRole: "button",
+        testID: "time-machine-bar-hint-pin",
+        hitSlop: {
+          top: 6,
+          bottom: 6,
+          left: 6,
+          right: 6
+        },
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+          style: styles.barHintAction,
+          children: "Open the action bar"
+        })
+      })]
+    }) : null, /*#__PURE__*/(0, _jsxRuntime.jsxs)(_primitives.Group, {
       children: [visible.map(meta => /*#__PURE__*/(0, _jsxRuntime.jsx)(_SnapshotRow.SnapshotRow, {
         meta: meta,
         busy: busy !== null,
+        armed: meta.id === armedId,
         onOpen: () => onOpenPreview(meta),
         onRestore: () => restore(meta),
         onDelete: () => void _timeMachineStore.timeMachineStore.delete(meta.id),
-        onDuplicate: () => void _timeMachineStore.timeMachineStore.duplicate(meta.id)
+        onDuplicate: () => void _timeMachineStore.timeMachineStore.duplicate(meta.id),
+        onArm: () => putOnBar(meta.id)
       }, meta.id)), visible.length === 0 ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_sharedUi.ToolEmptyState, {
         testID: "time-machine-empty",
         ...(!hasLoaded ? {
@@ -205,6 +249,17 @@ function RestorePointList({
   });
 }
 const styles = _reactNative.StyleSheet.create({
+  barHint: {
+    marginHorizontal: _tmTheme.tm.gutter,
+    marginBottom: 8
+  },
+  barHintAction: {
+    color: _tmTheme.tm.color.accent,
+    fontSize: _tmTheme.tm.font.footnote,
+    fontWeight: "600",
+    paddingHorizontal: _tmTheme.tm.textInset,
+    paddingTop: 2
+  },
   fill: {
     flex: 1,
     // Transparent so JsModal's ToolBackground shows through (the modal paints opaque base beneath it).

package/lib/commonjs/components/floating/NamePromptModal.js

@@ -0,0 +1,193 @@
+"use strict";
+
+Object.defineProperty(exports, "__esModule", {
+  value: true
+});
+exports.NamePromptModal = NamePromptModal;
+var _react = require("react");
+var _reactNative = require("react-native");
+var _sharedUi = require("@buoy-gg/shared-ui");
+var _jsxRuntime = require("react/jsx-runtime");
+/**
+ * "Name this restore point": the dialog `+` on the restore bar opens.
+ *
+ * A real Modal rather than a panel under the strip, so it sits centered over
+ * the app, above the keyboard, wherever the strip happens to be. An empty
+ * name is allowed: the store then names the point after the screen and the
+ * time, the same default the tool's capture bar uses.
+ */
+
+function NamePromptModal({
+  visible,
+  summary,
+  onCapture,
+  onCancel
+}) {
+  const [name, setName] = (0, _react.useState)("");
+  // Every opening starts blank, so a cancelled name never comes back.
+  (0, _react.useEffect)(() => {
+    if (visible) setName("");
+  }, [visible]);
+  const submit = () => onCapture(name.trim());
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Modal, {
+    visible: visible,
+    transparent: true,
+    animationType: "fade",
+    onRequestClose: onCancel,
+    statusBarTranslucent: true,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.KeyboardAvoidingView, {
+      behavior: _reactNative.Platform.OS === "ios" ? "padding" : undefined,
+      style: styles.fill,
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Pressable, {
+        style: styles.backdrop,
+        onPress: onCancel,
+        accessibilityLabel: "Cancel",
+        testID: "time-machine-bar-name-backdrop",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.Pressable, {
+          style: styles.card,
+          onPress: event => event.stopPropagation(),
+          testID: "time-machine-bar-name-panel"
+          // A Pressable is one accessibility element by default, which
+          // hid the field and both buttons from VoiceOver and from tests.
+          ,
+          accessible: false,
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.title,
+            children: "Name this restore point"
+          }), summary ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.summary,
+            testID: "time-machine-bar-name-summary",
+            children: summary
+          }) : null, /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TextInput, {
+            testID: "time-machine-bar-name-input",
+            accessibilityLabel: "Restore point name",
+            value: name,
+            onChangeText: setName,
+            onSubmitEditing: submit,
+            placeholder: "Screen and time, if left empty",
+            placeholderTextColor: _sharedUi.night.color.placeholder,
+            autoFocus: true,
+            autoCorrect: false
+            // Names are labels, not sentences: "bag" should stay "bag".
+            ,
+            autoCapitalize: "none",
+            returnKeyType: "done",
+            style: styles.input
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+            style: styles.hint,
+            children: "Captures the state the app is in right now and arms it on the bar."
+          }), /*#__PURE__*/(0, _jsxRuntime.jsxs)(_reactNative.View, {
+            style: styles.actions,
+            children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+              testID: "time-machine-bar-name-cancel",
+              accessibilityRole: "button",
+              onPress: onCancel,
+              style: styles.secondary,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.secondaryText,
+                children: "Cancel"
+              })
+            }), /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.TouchableOpacity, {
+              testID: "time-machine-bar-name-capture",
+              accessibilityRole: "button",
+              accessibilityLabel: "Capture and arm this restore point",
+              onPress: submit,
+              style: styles.primary,
+              children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactNative.Text, {
+                style: styles.primaryText,
+                children: "Capture"
+              })
+            })]
+          })]
+        })
+      })
+    })
+  });
+}
+const styles = _reactNative.StyleSheet.create({
+  fill: {
+    flex: 1
+  },
+  backdrop: {
+    flex: 1,
+    backgroundColor: "rgba(0, 0, 0, 0.55)",
+    alignItems: "center",
+    justifyContent: "center",
+    padding: 24
+  },
+  card: {
+    width: "100%",
+    maxWidth: 360,
+    borderRadius: _sharedUi.night.radius.sheet,
+    borderWidth: 1,
+    borderColor: _sharedUi.night.color.separator,
+    backgroundColor: _sharedUi.night.color.surface,
+    padding: 18,
+    gap: 12,
+    shadowColor: "#000",
+    shadowOffset: {
+      width: 0,
+      height: 12
+    },
+    shadowOpacity: 0.4,
+    shadowRadius: 24,
+    elevation: 12
+  },
+  title: {
+    color: _sharedUi.night.color.text,
+    fontSize: _sharedUi.night.font.title,
+    fontWeight: "600"
+  },
+  input: {
+    minHeight: 44,
+    borderRadius: _sharedUi.night.radius.input,
+    borderWidth: 1,
+    borderColor: _sharedUi.night.color.accentBorder,
+    backgroundColor: _sharedUi.night.color.surfaceElevated,
+    color: _sharedUi.night.color.text,
+    fontSize: _sharedUi.night.font.row,
+    paddingHorizontal: 12
+  },
+  summary: {
+    color: _sharedUi.night.color.textTertiary,
+    fontSize: _sharedUi.night.font.caption,
+    marginTop: -6
+  },
+  hint: {
+    color: _sharedUi.night.color.textSecondary,
+    fontSize: _sharedUi.night.font.caption,
+    lineHeight: 18
+  },
+  actions: {
+    flexDirection: "row",
+    justifyContent: "flex-end",
+    gap: 10,
+    marginTop: 4
+  },
+  secondary: {
+    minHeight: 40,
+    paddingHorizontal: 14,
+    borderRadius: _sharedUi.night.radius.input,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  secondaryText: {
+    color: _sharedUi.night.color.textSecondary,
+    fontSize: 14,
+    fontWeight: "600"
+  },
+  primary: {
+    minHeight: 40,
+    paddingHorizontal: 18,
+    borderRadius: _sharedUi.night.radius.input,
+    backgroundColor: _sharedUi.night.color.accent,
+    alignItems: "center",
+    justifyContent: "center"
+  },
+  primaryText: {
+    color: _sharedUi.night.color.onAccent,
+    fontSize: 14,
+    fontWeight: "700"
+  }
+});
+//# sourceMappingURL=NamePromptModal.js.map