vim-web 0.3.44-dev.69 → 0.3.44-dev.70

package/dist/vim-web.js

@@ -3,7 +3,7 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key !== "symbol" ? key + "" : key, value);
 var _a2;
 import * as React from "react";
-import React__default, { useState, useRef, useEffect, useMemo, useCallback, useImperativeHandle, useContext, Component, forwardRef, useLayoutEffect } from "react";
+import React__default, { useState, useRef, useEffect, useMemo, useCallback, useImperativeHandle, useContext, Component, forwardRef, useSyncExternalStore, useLayoutEffect } from "react";
 import ReactDOM, { flushSync as flushSync$1 } from "react-dom";
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x["default"] : x;
@@ -50725,17 +50725,6 @@ function clamp$1(value, min2, max2) {
   }
   return Math.min(Math.max(value, min2), max2);
 }
-function sanitize(value, strict, fallback) {
-  if (!strict) {
-    if (value === "" || value === "-") return value;
-  }
-  const num = parseFloat(value);
-  console.log(num);
-  if (isNaN(num)) {
-    return strict ? fallback.toString() : void 0;
-  }
-  return String(num);
-}
 function addBox(b1, b2) {
   const r = b1.clone();
   r.min.x += b2.min.x;
@@ -74676,10 +74665,10 @@ function useStateRef(initialValue) {
     }
   }
   const event = useRef(new distExports.SimpleEventDispatcher());
-  const validate = useRef((value2) => value2);
+  const validate = useRef((next, current) => next);
   const confirm = useRef((value2) => value2);
   const set3 = (value2) => {
-    const finalValue = validate.current(value2);
+    const finalValue = validate.current(value2, ref.current);
     if (finalValue === ref.current) return;
     ref.current = finalValue;
     setValue(finalValue);
@@ -74730,7 +74719,7 @@ function useStateRef(initialValue) {
      * @param on - A function that validates (and optionally transforms) the new state value.
      */
     useValidate(on) {
-      set3(on(ref.current));
+      set3(on(ref.current, ref.current));
       useEffect(() => {
         validate.current = on;
       }, []);
@@ -75544,6 +75533,44 @@ function modalContent(modal) {
     return /* @__PURE__ */ jsxRuntimeExports.jsx(LoadingBox, { content: modal });
   }
 }
+function InputNumber(props) {
+  const defaultValue = useRef(props.state.get());
+  const externalValue = useSyncExternalStore(
+    (callback) => props.state.onChange.subscribe(callback),
+    () => props.state.get()
+  );
+  const [inputValue, setInputValue] = useState(externalValue.toString());
+  useEffect(() => {
+    const parsed = parseFloat(inputValue);
+    if (isNaN(parsed) || parsed !== externalValue) {
+      setInputValue(externalValue.toString());
+    }
+  }, [externalValue]);
+  const handleChange = (e) => {
+    const input = e.target.value;
+    setInputValue(input);
+    const parsed = parseFloat(input);
+    if (!isNaN(parsed)) {
+      props.state.set(parsed);
+    }
+  };
+  const handleBlur = () => {
+    const parsed = parseFloat(inputValue);
+    const value = isNaN(parsed) ? defaultValue.current : parsed;
+    props.state.set(value);
+    setInputValue(props.state.get().toString());
+  };
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(
+    "input",
+    {
+      type: "number",
+      value: inputValue,
+      onChange: handleChange,
+      onBlur: handleBlur,
+      className: "vc-border vc-inline vc-border-gray-300 vc-py-1 vc-w-full vc-px-1"
+    }
+  );
+}
 function GenericPanel(props) {
   const [panelPosition, setPanelPosition] = useState({
     top: 0,
@@ -75568,17 +75595,19 @@ function GenericPanel(props) {
     };
   }, [props.showPanel.get()]);
   if (!props.showPanel.get()) return null;
-  const createTextBox = (field) => /* @__PURE__ */ jsxRuntimeExports.jsx(
-    "input",
-    {
-      id: field.id,
-      type: "text",
-      value: field.state.get(),
-      onChange: (e) => field.state.set(e.target.value),
-      className: "vc-border vc-inline vc-border-gray-300 vc-py-1 vc-w-full vc-px-1",
-      onBlur: () => field.state.confirm()
-    }
-  );
+  const createTextBox = (field) => {
+    return /* @__PURE__ */ jsxRuntimeExports.jsx(
+      "input",
+      {
+        id: field.id,
+        type: "number",
+        value: field.state.get(),
+        onChange: (e) => field.state.set(e.target.value),
+        className: "vc-border vc-inline vc-border-gray-300 vc-py-1 vc-w-full vc-px-1",
+        onBlur: () => field.state.confirm()
+      }
+    );
+  };
   const createCheckbox = (field) => /* @__PURE__ */ jsxRuntimeExports.jsx(
     "input",
     {
@@ -75591,7 +75620,9 @@ function GenericPanel(props) {
   );
   const renderField = (field) => {
     let fieldElement = null;
-    if (field.type === "text") {
+    if (field.type === "number") {
+      fieldElement = /* @__PURE__ */ jsxRuntimeExports.jsx(InputNumber, { state: field.state });
+    } else if (field.type === "text") {
       fieldElement = createTextBox(field);
     } else if (field.type === "bool") {
       fieldElement = createCheckbox(field);
@@ -75662,9 +75693,9 @@ function SectionBoxPanel(props) {
     header: "Section Box Offsets",
     showPanel: props.state.showOffsetPanel,
     fields: [
-      { type: "text", id: "topOffset", label: "Top Offset", state: props.state.topOffset },
-      { type: "text", id: "sideOffset", label: "Side Offset", state: props.state.sideOffset },
-      { type: "text", id: "bottomOffset", label: "Bottom Offset", state: props.state.bottomOffset }
+      { type: "number", id: "topOffset", label: "Top Offset", state: props.state.topOffset },
+      { type: "number", id: "sideOffset", label: "Side Offset", state: props.state.sideOffset },
+      { type: "number", id: "bottomOffset", label: "Bottom Offset", state: props.state.bottomOffset }
     ]
   });
 }
@@ -75673,9 +75704,9 @@ function useSectionBox(adapter) {
   const visible2 = useStateRef(false);
   const showOffsetPanel = useStateRef(false);
   const auto = useStateRef(false);
-  const topOffset = useStateRef("1");
-  const sideOffset = useStateRef("1");
-  const bottomOffset = useStateRef("1");
+  const topOffset = useStateRef(1);
+  const sideOffset = useStateRef(1);
+  const bottomOffset = useStateRef(1);
   const boxRef = useRef(adapter.getBox());
   const getSelectionBox = useAsyncFuncRef(adapter.getSelectionBox);
   const getSceneBox = useAsyncFuncRef(adapter.getSceneBox);
@@ -75698,9 +75729,6 @@ function useSectionBox(adapter) {
   });
   visible2.useValidate((v) => enable.get() && v);
   showOffsetPanel.useValidate((v) => enable.get() && v);
-  topOffset.useConfirm((v) => sanitize(v, true, 1));
-  sideOffset.useConfirm((v) => sanitize(v, true, 1));
-  bottomOffset.useConfirm((v) => sanitize(v, true, 1));
   topOffset.useOnChange((v) => sectionBox2.call(boxRef.current));
   sideOffset.useOnChange((v) => sectionBox2.call(boxRef.current));
   bottomOffset.useOnChange((v) => sectionBox2.call(boxRef.current));
@@ -75711,7 +75739,7 @@ function useSectionBox(adapter) {
   const sectionBox2 = useArgActionRef((baseBox) => {
     if (baseBox === void 0) return;
     boxRef.current = baseBox;
-    const newBox = addBox(baseBox, offsetsToBox3(topOffset.get(), sideOffset.get(), bottomOffset.get()));
+    const newBox = addBox(baseBox, offsetsToBox3_(topOffset.get(), sideOffset.get(), bottomOffset.get()));
     adapter.setBox(newBox);
   });
   const sectionSelection2 = useFuncRef(async () => {
@@ -75739,14 +75767,10 @@ function useSectionBox(adapter) {
     getSelectionBox
   };
 }
-function offsetsToBox3(top, side, bottom) {
-  const getNumber = (s) => {
-    const num = parseFloat(s);
-    return isNaN(num) ? 0 : num;
-  };
+function offsetsToBox3_(top, side, bottom) {
   return new Box3(
-    new Vector3(-getNumber(side), -getNumber(side), -getNumber(bottom)),
-    new Vector3(getNumber(side), getNumber(side), getNumber(top))
+    new Vector3(-side, -side, -bottom),
+    new Vector3(side, side, top)
   );
 }
 function useWebglSectionBox(viewer) {
@@ -75837,7 +75861,7 @@ function IsolationSettingsPanel(props) {
     fields: [
       { type: "bool", id: "showGhost", label: "Show Ghost", state: props.state.showGhost },
       // { type: 'bool', id: 'showRooms', label: 'Show Rooms', state: props.state.showRooms },
-      { type: "text", id: "ghostOpacity", label: "Ghost Opacity", state: props.state.ghostOpacity }
+      { type: "number", id: "ghostOpacity", label: "Ghost Opacity", state: props.state.ghostOpacity }
     ]
   });
 }
@@ -75848,7 +75872,7 @@ function useSharedIsolation(adapter) {
   const showPanel = useStateRef(false);
   const showRooms = useStateRef(false);
   const showGhost = useStateRef(false);
-  const ghostOpacity = useStateRef(() => adapter.getGhostOpacity().toFixed(4));
+  const ghostOpacity = useStateRef(() => adapter.getGhostOpacity());
   const onAutoIsolate = useFuncRef(() => {
     if (adapter.hasSelection()) {
       adapter.isolateSelection();
@@ -75868,13 +75892,15 @@ function useSharedIsolation(adapter) {
       if (autoIsolate2.get()) onAutoIsolate.call();
     });
   }, []);
-  ghostOpacity.useConfirm((v) => sanitize(v, true, 0.04));
   autoIsolate2.useOnChange((v) => {
     if (v) onAutoIsolate.call();
   });
   showGhost.useOnChange((v) => adapter.showGhost(v));
   showRooms.useOnChange((v) => adapter.setShowRooms(v));
-  ghostOpacity.useOnChange((v) => adapter.setGhostOpacity(parseFloat(v)));
+  ghostOpacity.useValidate((next, current) => {
+    return next <= 0 ? current : next;
+  });
+  ghostOpacity.useOnChange((v) => adapter.setGhostOpacity(v));
   return {
     adapter: _adapter,
     visibility,