@buoy-gg/time-machine 7.0.41 → 7.0.42

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

@@ -1,193 +1 @@
-"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
+"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");function NamePromptModal({visible:e,summary:r,onCapture:a,onCancel:t}){const[i,n]=(0,_react.useState)("");(0,_react.useEffect)(()=>{if(e)n("")},[e]);const o=()=>a(i.trim());return(0,_jsxRuntime.jsx)(_reactNative.Modal,{visible:e,transparent:true,animationType:"fade",onRequestClose:t,statusBarTranslucent:true,children:(0,_jsxRuntime.jsx)(_reactNative.KeyboardAvoidingView,{behavior:_reactNative.Platform.OS==="ios"?"padding":void 0,style:styles.fill,children:(0,_jsxRuntime.jsx)(_reactNative.Pressable,{style:styles.backdrop,onPress:t,accessibilityLabel:"Cancel",testID:"time-machine-bar-name-backdrop",children:(0,_jsxRuntime.jsxs)(_reactNative.Pressable,{style:styles.card,onPress:s=>s.stopPropagation(),testID:"time-machine-bar-name-panel",accessible:false,children:[(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.title,children:"Name this restore point"}),r?(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.summary,testID:"time-machine-bar-name-summary",children:r}):null,(0,_jsxRuntime.jsx)(_reactNative.TextInput,{testID:"time-machine-bar-name-input",accessibilityLabel:"Restore point name",value:i,onChangeText:n,onSubmitEditing:o,placeholder:"Screen and time, if left empty",placeholderTextColor:_sharedUi.night.color.placeholder,autoFocus:true,autoCorrect:false,autoCapitalize:"none",returnKeyType:"done",style:styles.input}),(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.hint,children:"Captures the state the app is in right now and arms it on the bar."}),(0,_jsxRuntime.jsxs)(_reactNative.View,{style:styles.actions,children:[(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:"time-machine-bar-name-cancel",accessibilityRole:"button",onPress:t,style:styles.secondary,children:(0,_jsxRuntime.jsx)(_reactNative.Text,{style:styles.secondaryText,children:"Cancel"})}),(0,_jsxRuntime.jsx)(_reactNative.TouchableOpacity,{testID:"time-machine-bar-name-capture",accessibilityRole:"button",accessibilityLabel:"Capture and arm this restore point",onPress:o,style:styles.primary,children:(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:.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"}});