querysub 0.471.0 → 0.472.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "querysub",
-  "version": "0.471.0",
+  "version": "0.472.0",
   "main": "index.js",
   "license": "MIT",
   "note1": "note on node-forge fork, see https://github.com/digitalbazaar/forge/issues/744 for details",

package/src/2-proxy/PathValueProxyWatcher.ts

@@ -1664,7 +1664,7 @@ export class PathValueProxyWatcher {
 
                 let maxLocks = watcher.options.maxLocksOverride || DEFAULT_MAX_LOCKS;
                 if (locks.length > maxLocks) {
-                    throw new Error(`Too many locks for ${watcher.debugName} (${locks.length} > ${maxLocks}). Use Querysub.noLocks(() => ...) around code that is accessing too many values, assuming you don't want to lock them. You can override max locks with maxLocksOverride (in options / functionMetadata). Some locks are ${JSON.stringify(locks.slice(0, 3).map(x => ({ path: x.path, startTime: x.startTime, endTime: x.endTime })))}.`);
+                    throw new Error(`Too many locks for ${watcher.debugName} (${locks.length} > ${maxLocks}). Use Querysub.noLocks(() => ...) around code that is accessing too many values, assuming you don't want to lock them. You can override max locks with maxLocksOverride (in options / functionMetadata). Some locks are ${JSON.stringify(locks.slice(-10).map(x => ({ path: x.path, startTime: x.startTime, endTime: x.endTime })))}.`);
                 }
 
 

package/src/3-path-functions/PathFunctionHelpers.ts

@@ -144,6 +144,10 @@ export function writeFunctionCall(config: {
 }) {
     let { domainName, moduleId, functionId, args, metadata } = config;
 
+    if (isNode() && !curInterceptor) {
+        throw new Error(`Naked function writes are not allowed serverside. Wrap your code in a Querysub.commitAsync!`);
+    }
+
     // NOTE: Having this be an always-increasing time means that at least if it's the same client making the call ID, the numbers will always be increasing. So we can go from the call ID to determine the order of the calls, which is extremely useful. 
     let now = getTimeUnique();
     // IMPORTANT! CallId MUST be secure, otherwise other users can guess it, and read our calls

package/src/library-components/InputAutocomplete.tsx

@@ -0,0 +1,100 @@
+import { css } from "typesafecss";
+import { InputProps } from "./Input";
+import { qreact } from "../4-dom/qreact";
+
+export class InputAutocomplete extends qreact.Component<InputProps & {
+    value: string | { value: string };
+    label?: string;
+    options: string[];
+    onChangeValue: (value: string) => void;
+    focusOnMount?: boolean;
+}> {
+    handleInput = (e: Event) => {
+        const input = e.currentTarget as HTMLInputElement;
+        const inputEvent = e as InputEvent;
+
+        // Only autocomplete on text insertion, not deletion
+        if (!inputEvent.inputType || !inputEvent.inputType.startsWith("insert")) {
+            return;
+        }
+
+        const selectionStart = input.selectionStart || 0;
+        const userTyped = input.value.slice(0, selectionStart);
+
+        if (!userTyped) {
+            return;
+        }
+
+        // Find matching character names
+        const options = this.props.options;
+        const lowerUserTyped = userTyped.toLowerCase();
+        const match = options.find(name =>
+            name.toLowerCase().startsWith(lowerUserTyped)
+        );
+
+        if (match) {
+            // Replace with the matched name's casing
+            input.value = match;
+            input.setSelectionRange(userTyped.length, match.length);
+        }
+    };
+
+    handleKeyDown = (e: KeyboardEvent) => {
+        const input = e.currentTarget as HTMLInputElement;
+
+        if (e.key === "Tab" || e.key === "Enter") {
+            e.preventDefault();
+            this.props.onChangeValue(input.value);
+            input.blur();
+        } else if (e.key === "Escape") {
+            input.value = this.getValue();
+            input.blur();
+        }
+    };
+
+    handleBlur = (e: FocusEvent) => {
+        const input = e.currentTarget as HTMLInputElement;
+        this.props.onChangeValue(input.value);
+    };
+    getValue() {
+        if (typeof this.props.value === "string") {
+            return this.props.value;
+        }
+        return this.props.value.value;
+    }
+
+    render() {
+        let { value, options, onChangeValue, focusOnMount, ...nativeProps } = this.props;
+        const styleClass = (
+            css.border("1px solid hsl(0, 0%, 50%)", "soft")
+                .background("hsl(0, 0%, 7%)", "soft")
+                .color("hsl(0, 0%, 95%)", "soft")
+                .display("flex", "soft")
+                .outline("3px solid hsl(204, 100%, 50%)", "focus", "soft")
+            + " " + css.width("100%", "soft")
+            + " " + (nativeProps.className || "")
+        );
+        return (
+            <input
+                {...nativeProps as any}
+                ref={elem => {
+                    if (elem) {
+                        elem.value = this.getValue();
+                        if (focusOnMount) {
+                            setTimeout(() => {
+                                elem.focus();
+                                elem.select();
+                            }, 0);
+                        }
+                    }
+                }}
+                type="text"
+                onFocus={e => (e.currentTarget as HTMLInputElement).select()}
+                onInput={this.handleInput}
+                onKeyDown={this.handleKeyDown}
+                onBlur={this.handleBlur}
+                className={styleClass}
+            />
+        );
+    }
+}

package/src/library-components/uncaughtToast.tsx

@@ -12,9 +12,9 @@ function onUncaught(...args: unknown[]) {
     }
     // Ignore ResizeObserver errors, they are spurious
     //  - https://github.com/vercel/next.js/discussions/51551
-    if (error.message.startsWith("ResizeObserver loop")) return;
+    if (error.message?.startsWith("ResizeObserver loop")) return;
     // We should really do this better. Basically, if we're disposing or canceling, it's not actually an error, just ignore it. 
-    if (error.message.startsWith("Dispose")) return;
+    if (error.message?.startsWith("Dispose")) return;
 
     onMessage({
         type: "error",