react-os-shell 0.3.18 → 0.3.20

package/dist/{chunk-HADXZNYO.js → chunk-SYPEBLWY.js}

@@ -514,16 +514,17 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
   const [showHint, setShowHint] = useState(true);
   const [measureEnabled, setMeasureEnabled] = useState(false);
   const [measureMode, setMeasureMode] = useState("horizontal");
-  const [measureAutocad, setMeasureAutocad] = useState(true);
   const [measureDistance, setMeasureDistance] = useState(null);
+  const [measureFixedDist, setMeasureFixedDist] = useState(null);
+  const [measureFixedInput, setMeasureFixedInput] = useState("");
   const measureModeRef = useRef(measureMode);
-  const measureAutocadRef = useRef(measureAutocad);
+  const measureFixedDistRef = useRef(measureFixedDist);
   useEffect(() => {
     measureModeRef.current = measureMode;
   }, [measureMode]);
   useEffect(() => {
-    measureAutocadRef.current = measureAutocad;
-  }, [measureAutocad]);
+    measureFixedDistRef.current = measureFixedDist;
+  }, [measureFixedDist]);
   const measureRedrawRef = useRef(null);
   const measureRef = useRef(null);
   useEffect(() => {
@@ -692,14 +693,23 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
     lineEl.setAttribute("stroke-linecap", "round");
     lineEl.style.display = "none";
     svg.appendChild(lineEl);
+    const fixedLineEl = document.createElementNS("http://www.w3.org/2000/svg", "line");
+    fixedLineEl.setAttribute("stroke", "#ff8800");
+    fixedLineEl.setAttribute("stroke-width", "1.5");
+    fixedLineEl.setAttribute("stroke-linecap", "round");
+    fixedLineEl.style.display = "none";
+    svg.appendChild(fixedLineEl);
     const snapEl = document.createElement("div");
     snapEl.style.cssText = `position:absolute;width:14px;height:14px;border:2px solid #ff8800;background:rgba(255,255,255,0.7);transform:translate(-50%,-50%) rotate(45deg);box-sizing:border-box;display:none;`;
     overlay.appendChild(snapEl);
     measureRef.current = {
       picks: [],
+      rawSecondClick: null,
       overlay,
       svg,
       line: lineEl,
+      fixedLine: fixedLineEl,
+      fixedLabel: null,
       refLine: refLineEl,
       extLineA,
       extLineB,
@@ -743,11 +753,25 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
       }
     })();
     const SNAP_PX = 12;
+    const segSegIntersect = (A, B) => {
+      const x1 = A.ax, y1 = A.ay, x2 = A.bx, y2 = A.by;
+      const x3 = B.ax, y3 = B.ay, x4 = B.bx, y4 = B.by;
+      const d = (x2 - x1) * (y4 - y3) - (y2 - y1) * (x4 - x3);
+      if (Math.abs(d) < 1e-12) return null;
+      const t = ((x3 - x1) * (y4 - y3) - (y3 - y1) * (x4 - x3)) / d;
+      const u = ((x3 - x1) * (y2 - y1) - (y3 - y1) * (x2 - x1)) / d;
+      const eps = 1e-6;
+      if (t < -eps || t > 1 + eps || u < -eps || u > 1 + eps) return null;
+      return { x: x1 + t * (x2 - x1), y: y1 + t * (y2 - y1) };
+    };
     const findSnap = (cx, cy) => {
       const s = measureRef.current;
       if (!s || !ready) return null;
       let best = null;
       let bestD2 = SNAP_PX * SNAP_PX;
+      const NEARBY_PX = SNAP_PX * 3;
+      const nearbyD2 = NEARBY_PX * NEARBY_PX;
+      const nearby = [];
       for (const seg of s.segments) {
         const ap = pxFromScene(seg.ax, seg.ay);
         const bp = pxFromScene(seg.bx, seg.by);
@@ -755,35 +779,53 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
         const llen = Math.sqrt(ldx * ldx + ldy * ldy) || 1;
         const segDir = { dx: ldx / llen, dy: ldy / llen };
         let dx = cx - ap.x, dy = cy - ap.y;
-        let d2 = dx * dx + dy * dy;
-        if (d2 < bestD2) {
+        let dEpA2 = dx * dx + dy * dy;
+        if (dEpA2 < bestD2) {
           best = { sx: seg.ax, sy: seg.ay, type: "endpoint", dir: segDir };
-          bestD2 = d2;
+          bestD2 = dEpA2;
         }
         dx = cx - bp.x;
         dy = cy - bp.y;
-        d2 = dx * dx + dy * dy;
-        if (d2 < bestD2) {
+        let dEpB2 = dx * dx + dy * dy;
+        if (dEpB2 < bestD2) {
           best = { sx: seg.bx, sy: seg.by, type: "endpoint", dir: segDir };
-          bestD2 = d2;
+          bestD2 = dEpB2;
         }
         const sdx = bp.x - ap.x, sdy = bp.y - ap.y;
         const len2 = sdx * sdx + sdy * sdy;
+        let dLine2 = Infinity;
         if (len2 > 0) {
           const t = ((cx - ap.x) * sdx + (cy - ap.y) * sdy) / len2;
           if (t > 0 && t < 1) {
             const px = ap.x + t * sdx, py = ap.y + t * sdy;
             dx = cx - px;
             dy = cy - py;
-            d2 = dx * dx + dy * dy;
-            if (d2 < bestD2) {
+            dLine2 = dx * dx + dy * dy;
+            if (dLine2 < bestD2) {
               const sx = seg.ax + t * (seg.bx - seg.ax);
               const sy = seg.ay + t * (seg.by - seg.ay);
               best = { sx, sy, type: "line", dir: segDir };
-              bestD2 = d2;
+              bestD2 = dLine2;
             }
           }
         }
+        if (dEpA2 < nearbyD2 || dEpB2 < nearbyD2 || dLine2 < nearbyD2) {
+          nearby.push(seg);
+        }
+      }
+      for (let i = 0; i < nearby.length; i++) {
+        for (let j = i + 1; j < nearby.length; j++) {
+          const ix = segSegIntersect(nearby[i], nearby[j]);
+          if (!ix) continue;
+          const p = pxFromScene(ix.x, ix.y);
+          const dx = cx - p.x, dy = cy - p.y;
+          const d2 = dx * dx + dy * dy;
+          if (d2 >= SNAP_PX * SNAP_PX) continue;
+          if (!best || best.type !== "intersection" || d2 < bestD2) {
+            best = { sx: ix.x, sy: ix.y, type: "intersection" };
+            bestD2 = d2;
+          }
+        }
       }
       return best;
     };
@@ -807,24 +849,48 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
       el.style.left = `${p.x}px`;
       el.style.top = `${p.y}px`;
     };
-    const computeRenderedEnds = () => {
+    const reconcileLockedPick = () => {
+      const s = measureRef.current;
+      if (!s || !s.rawSecondClick || s.picks.length < 2) return;
+      const a = s.picks[0];
+      const raw = s.rawSecondClick;
+      const fixed = measureFixedDistRef.current;
+      const mode = measureModeRef.current;
+      if (fixed !== null && Number.isFinite(fixed) && (mode === "horizontal" || mode === "vertical")) {
+        if (mode === "horizontal") {
+          const sign = raw.x >= a.x ? 1 : -1;
+          s.picks[1] = { x: a.x + sign * Math.abs(fixed), y: raw.y };
+        } else {
+          const sign = raw.y >= a.y ? 1 : -1;
+          s.picks[1] = { x: raw.x, y: a.y + sign * Math.abs(fixed) };
+        }
+      } else {
+        s.picks[1] = { x: raw.x, y: raw.y };
+      }
+    };
+    const computeMainDimEnds = () => {
       const s = measureRef.current;
       const a = s.picks[0];
       const b = s.picks[1];
       const mode = measureModeRef.current;
-      if (mode === "horizontal") {
-        return { from: a, to: { x: b.x, y: a.y } };
+      const fixed = measureFixedDistRef.current;
+      if (fixed !== null && Number.isFinite(fixed) && mode === "horizontal") {
+        return { from: { x: b.x, y: a.y }, to: { x: b.x, y: b.y } };
       }
-      if (mode === "vertical") {
-        return { from: a, to: { x: a.x, y: b.y } };
+      if (fixed !== null && Number.isFinite(fixed) && mode === "vertical") {
+        return { from: { x: a.x, y: b.y }, to: { x: b.x, y: b.y } };
       }
+      if (mode === "horizontal") return { from: a, to: { x: b.x, y: a.y } };
+      if (mode === "vertical") return { from: a, to: { x: a.x, y: b.y } };
       return { from: a, to: b };
     };
     const updateOverlay = () => {
       const s = measureRef.current;
       if (!s) return;
+      reconcileLockedPick();
       const mode = measureModeRef.current;
-      const autocad = measureAutocadRef.current;
+      const fixed = measureFixedDistRef.current;
+      const fixedActive = fixed !== null && Number.isFinite(fixed) && (mode === "horizontal" || mode === "vertical");
       if (s.markers[0]) positionMarker(s.markers[0], s.picks[0].x, s.picks[0].y);
       if (s.markers[1]) positionMarker(s.markers[1], s.picks[1].x, s.picks[1].y);
       const refDir = mode === "horizontal" ? { dx: 1, dy: 0 } : mode === "vertical" ? { dx: 0, dy: 1 } : null;
@@ -852,24 +918,43 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
       }
       if (s.picks.length === 2) {
         const a = s.picks[0], b = s.picks[1];
-        const ends = computeRenderedEnds();
+        const ends = computeMainDimEnds();
         const fp = pxFromScene(ends.from.x, ends.from.y);
         const tp = pxFromScene(ends.to.x, ends.to.y);
         s.line.setAttribute("x1", String(fp.x));
         s.line.setAttribute("y1", String(fp.y));
         s.line.setAttribute("x2", String(tp.x));
         s.line.setAttribute("y2", String(tp.y));
-        s.line.style.display = "";
-        if (autocad) {
-          s.line.setAttribute("marker-start", "url(#dxf-measure-arrow)");
-          s.line.setAttribute("marker-end", "url(#dxf-measure-arrow)");
+        s.line.setAttribute("marker-start", "url(#dxf-measure-arrow)");
+        s.line.setAttribute("marker-end", "url(#dxf-measure-arrow)");
+        const mainLen = Math.hypot(tp.x - fp.x, tp.y - fp.y);
+        s.line.style.display = mainLen > 0.5 ? "" : "none";
+        if (fixedActive && s.fixedLine) {
+          const r = mode === "horizontal" ? { x: b.x, y: a.y } : { x: a.x, y: b.y };
+          const ap = pxFromScene(a.x, a.y);
+          const rp = pxFromScene(r.x, r.y);
+          s.fixedLine.setAttribute("x1", String(ap.x));
+          s.fixedLine.setAttribute("y1", String(ap.y));
+          s.fixedLine.setAttribute("x2", String(rp.x));
+          s.fixedLine.setAttribute("y2", String(rp.y));
+          s.fixedLine.setAttribute("marker-start", "url(#dxf-measure-arrow)");
+          s.fixedLine.setAttribute("marker-end", "url(#dxf-measure-arrow)");
+          s.fixedLine.style.display = "";
+          const fLabel = ensureFixedLabel();
+          fLabel.textContent = formatMeasureDistance(Math.abs(fixed));
+          const fcx = (ap.x + rp.x) / 2;
+          const fcy = (ap.y + rp.y) / 2;
+          fLabel.style.left = `${fcx}px`;
+          fLabel.style.top = `${fcy}px`;
+          const w = canvas.clientWidth, h = canvas.clientHeight;
+          fLabel.style.display = fcx < 0 || fcy < 0 || fcx > w || fcy > h ? "none" : "";
         } else {
-          s.line.removeAttribute("marker-start");
-          s.line.removeAttribute("marker-end");
+          if (s.fixedLine) s.fixedLine.style.display = "none";
+          if (s.fixedLabel) s.fixedLabel.style.display = "none";
         }
         const extA = s.extLineA;
         const extB = s.extLineB;
-        if (autocad && mode === "horizontal" && Math.abs(b.y - a.y) > 1e-9) {
+        if (!fixedActive && mode === "horizontal" && Math.abs(b.y - a.y) > 1e-9) {
           const p = pxFromScene(b.x, a.y);
           const q = pxFromScene(b.x, b.y);
           extB.setAttribute("x1", String(p.x));
@@ -878,7 +963,7 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
           extB.setAttribute("y2", String(q.y));
           extB.style.display = "";
           extA.style.display = "none";
-        } else if (autocad && mode === "vertical" && Math.abs(b.x - a.x) > 1e-9) {
+        } else if (!fixedActive && mode === "vertical" && Math.abs(b.x - a.x) > 1e-9) {
           const p = pxFromScene(a.x, b.y);
           const q = pxFromScene(b.x, b.y);
           extB.setAttribute("x1", String(p.x));
@@ -898,13 +983,25 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
           s.label.style.top = `${cy}px`;
           const w = canvas.clientWidth, h = canvas.clientHeight;
           s.label.style.display = cx < 0 || cy < 0 || cx > w || cy > h ? "none" : "";
+          if (mainLen <= 0.5) s.label.style.display = "none";
         }
       } else {
         s.line.style.display = "none";
+        if (s.fixedLine) s.fixedLine.style.display = "none";
+        if (s.fixedLabel) s.fixedLabel.style.display = "none";
         if (s.extLineA) s.extLineA.style.display = "none";
         if (s.extLineB) s.extLineB.style.display = "none";
       }
     };
+    const ensureFixedLabel = () => {
+      const s = measureRef.current;
+      if (s.fixedLabel) return s.fixedLabel;
+      const el = document.createElement("div");
+      el.style.cssText = `position:absolute;left:-9999px;top:-9999px;transform:translate(-50%,-50%);padding:2px 6px;font-size:11px;font-weight:600;font-family:system-ui,-apple-system,sans-serif;background:rgba(255,136,0,0.75);color:#fff;border-radius:4px;white-space:nowrap;box-shadow:0 1px 4px rgba(0,0,0,0.25);pointer-events:none;`;
+      overlay.appendChild(el);
+      s.fixedLabel = el;
+      return el;
+    };
     const DRAG_TOL = 4;
     const DRAG_TIME = 350;
     let downX = 0, downY = 0, downTime = 0, downActive = false, dragging = false;
@@ -954,11 +1051,20 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
     const recomputeLabel = () => {
       const s = measureRef.current;
       if (!s || s.picks.length !== 2) return;
+      reconcileLockedPick();
       const a = s.picks[0], b = s.picks[1];
       const mode = measureModeRef.current;
+      const fixed = measureFixedDistRef.current;
+      const fixedActive = fixed !== null && Number.isFinite(fixed) && (mode === "horizontal" || mode === "vertical");
       let dist;
       let suffix = "";
-      if (mode === "horizontal") {
+      if (fixedActive && mode === "horizontal") {
+        dist = Math.abs(b.y - a.y);
+        suffix = " \u2195";
+      } else if (fixedActive && mode === "vertical") {
+        dist = Math.abs(b.x - a.x);
+        suffix = " \u2194";
+      } else if (mode === "horizontal") {
         dist = Math.abs(b.x - a.x);
         suffix = " \u2194";
       } else if (mode === "vertical") {
@@ -984,16 +1090,23 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
         for (const m of s.markers) m.parentElement?.removeChild(m);
         s.markers = [];
         s.picks = [];
+        s.rawSecondClick = null;
         s.line.style.display = "none";
+        if (s.fixedLine) s.fixedLine.style.display = "none";
+        if (s.fixedLabel) s.fixedLabel.style.display = "none";
         if (s.refLine) s.refLine.style.display = "none";
         if (s.extLineA) s.extLineA.style.display = "none";
         if (s.extLineB) s.extLineB.style.display = "none";
         if (s.label) s.label.style.opacity = "0";
         setMeasureDistance(null);
       }
-      s.picks.push({ x: p.x, y: p.y });
-      s.markers.push(makeMarker());
-      if (s.picks.length === 2) {
+      if (s.picks.length === 0) {
+        s.picks.push({ x: p.x, y: p.y });
+        s.markers.push(makeMarker());
+      } else {
+        s.rawSecondClick = { x: p.x, y: p.y };
+        s.picks.push({ x: p.x, y: p.y });
+        s.markers.push(makeMarker());
         recomputeLabel();
       }
       updateOverlay();
@@ -1039,7 +1152,7 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
   }, [measureEnabled, loading, error]);
   useEffect(() => {
     measureRedrawRef.current?.();
-  }, [measureMode, measureAutocad]);
+  }, [measureMode, measureFixedDist]);
   const toggleLayer = (name) => {
     setLayers((prev) => prev.map((l) => {
       if (l.name !== name) return l;
@@ -1130,21 +1243,6 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
         }
       ),
       measureEnabled && /* @__PURE__ */ jsxs(Fragment, { children: [
-        /* @__PURE__ */ jsx(
-          "button",
-          {
-            onClick: () => {
-              setMeasureAutocad((prev) => {
-                const next = !prev;
-                if (next && measureMode === "point") setMeasureMode("horizontal");
-                return next;
-              });
-            },
-            className: btn + (measureAutocad ? " bg-orange-100 text-orange-700" : ""),
-            title: measureAutocad ? "AutoCAD dim style is ON \u2014 extension lines + arrows" : "AutoCAD dim style is OFF \u2014 plain line. Click to turn on (also switches to H if you're in Point).",
-            children: "\u22A5"
-          }
-        ),
         /* @__PURE__ */ jsxs("div", { className: "flex items-stretch h-7 rounded border border-gray-200 overflow-hidden text-[11px] font-semibold", children: [
           /* @__PURE__ */ jsx(
             "button",
@@ -1173,6 +1271,41 @@ function DxfPanel({ url, filename, onDownload, onEmail }) {
               children: "V"
             }
           )
+        ] }),
+        (measureMode === "horizontal" || measureMode === "vertical") && /* @__PURE__ */ jsxs("div", { className: "flex items-center gap-1", children: [
+          /* @__PURE__ */ jsx(
+            "input",
+            {
+              type: "number",
+              inputMode: "decimal",
+              step: "any",
+              value: measureFixedInput,
+              placeholder: measureMode === "horizontal" ? "fix \u0394x" : "fix \u0394y",
+              onChange: (e) => {
+                const raw = e.target.value;
+                setMeasureFixedInput(raw);
+                if (raw.trim() === "") setMeasureFixedDist(null);
+                else {
+                  const n = parseFloat(raw);
+                  setMeasureFixedDist(Number.isFinite(n) && n !== 0 ? n : null);
+                }
+              },
+              className: "h-7 w-20 px-1.5 text-[11px] font-mono rounded border border-gray-200 bg-white text-gray-700 focus:outline-none focus:border-orange-400",
+              title: "Lock the second pick's axis coord to first pick + this value (mm). The reported measurement becomes the perpendicular distance."
+            }
+          ),
+          measureFixedDist !== null && /* @__PURE__ */ jsx(
+            "button",
+            {
+              onClick: () => {
+                setMeasureFixedDist(null);
+                setMeasureFixedInput("");
+              },
+              className: "text-gray-400 hover:text-gray-600 text-[11px] px-1",
+              title: "Clear fixed distance",
+              children: "\xD7"
+            }
+          )
         ] })
       ] }),
       measureEnabled && measureDistance !== null && /* @__PURE__ */ jsxs(
@@ -2546,5 +2679,5 @@ function ImagePanel({ url, filename, onDownload, onEmail }) {
 }
 
 export { Preview, setPdfPreview };
-//# sourceMappingURL=chunk-HADXZNYO.js.map
-//# sourceMappingURL=chunk-HADXZNYO.js.map
+//# sourceMappingURL=chunk-SYPEBLWY.js.map
+//# sourceMappingURL=chunk-SYPEBLWY.js.map