@reekon-tools/boldr-cad 0.1.0 → 1.0.0

package/src/render/hit.ts

@@ -1,14 +1,17 @@
-import { ed, isSel, type Hit } from '../app/state';
+import { ed, type Hit } from '../app/state';
 import { distSeg, hyp, normAng, pointInPoly } from '../model/geom';
 import { settings } from '../model/settings';
 import { roomGeom } from '../model/rooms';
 import { roomValid } from '../model/sketch';
 import { page, SK } from '../model/store';
 import { edgePoint } from '../model/openings';
+import { elevOpen, wallBodyAt } from '../editor/elevation';
 import type { Note, OpeningEdge } from '../model/types';
-import { arcAngles, OPENING_TICK_EXT, openingFrame } from '../model/planGeom';
-import { FONT } from './theme';
-import { cvs, mainT, noteHandles, S, s2w, underlayH, underlayHandles, type Xform } from './view';
+import { cabinetFootprints } from '../model/facesolve';
+import { arcAngles, curveFrame, edgeId, OPENING_TICK_EXT, openingFrame, wallThick } from '../model/planGeom';
+import { noteLook, shapeOutline } from '../model/markup';
+import { smoothPolyline } from '../model/smooth';
+import { leaderPath, linkBox, mainT, noteHandles, noteTextBox, S, s2w, underlayH, underlayHandles, underlayLocal, type Xform } from './view';
 
 /** The handle closest to (sx, sy) within `tol` px (small boxes put handles close together; take the nearest, not the first). */
 function nearestHandle<H extends { x: number; y: number }>(hs: H[], sx: number, sy: number, tol: number): H | null {
@@ -17,35 +20,101 @@ function nearestHandle<H extends { x: number; y: number }>(hs: H[], sx: number,
   return best;
 }
 
+/** Which part of tile `n` screen point sx, sy picks: its card (a little round it), its leader's tip, or along its leader. */
+export function linkHit(T: Xform, n: Note, sx: number, sy: number, tol: number): 'card' | 'tip' | 'leader' | null {
+  const b = linkBox(T, n), pad = tol / 2;
+  if (sx >= b.x - pad && sx <= b.x + b.s + pad && sy >= b.y - pad && sy <= b.y + b.s + pad) return 'card';
+  const lp = leaderPath(T, n, b);
+  if (!lp) return null;
+  // (its tip, as its handle is: that end alone moves, even before the tile's selected)
+  if (hyp(sx - lp[1][0], sy - lp[1][1]) < tol + 2) return 'tip';
+  return distSeg({ x: sx, y: sy }, { x: lp[0][0], y: lp[0][1] }, { x: lp[1][0], y: lp[1][1] }) < tol + noteLook(n).width / 2 ? 'leader' : null;
+}
+
+/** The link tile under a screen point on the plan, in any mode (a view-only tap opens what it's for); the top one. */
+export function linkAt(sx: number, sy: number, touch = false): (Note & { link: NonNullable<Note['link']> }) | null {
+  if (!settings.layers.annot || elevOpen()) return null;
+  const sk = SK(), T = mainT(), tol = touch ? 20 : 10;
+  for (let i = sk.notes.length - 1; i >= 0; i--) {
+    const n = sk.notes[i];
+    if (n.type === 'link' && n.link && linkHit(T, n, sx, sy, tol)) return n as Note & { link: NonNullable<Note['link']> };
+  }
+  return null;
+}
+
 function notePointHit(n: Note, sx: number, sy: number, T: Xform, tol: number): boolean {
+  if (n.type === 'link') return !!linkHit(T, n, sx, sy, tol);
   if (n.type === 'text') {
-    const [x, y] = S(T, n.x!, n.y!);
-    cvs.ctx.font = '600 14px ' + FONT;
-    const w = cvs.ctx.measureText(n.text!).width + 16;
-    return sx >= x - 4 && sx <= x + w + 4 && sy >= y - 18 && sy <= y + 18;
+    const b = noteTextBox(T, n);
+    return sx >= b.x - 4 && sx <= b.x + b.w + 4 && sy >= b.y - 4 && sy <= b.y + b.h + 4;
+  }
+  const outline = shapeOutline(n);
+  if (outline) {
+    // on its outline (as thick as it's drawn), or anywhere inside it
+    const sp = outline.map(p => S(T, p[0], p[1])), reach = tol + noteLook(n).width / 2;
+    if (pointInPoly({ x: sx, y: sy }, sp.map(([x, y]) => ({ x, y })))) return true;
+    return sp.some(([ax, ay], i) => { const [bx, by] = sp[(i + 1) % sp.length]; return distSeg({ x: sx, y: sy }, { x: ax, y: ay }, { x: bx, y: by }) < reach; });
   }
   const pts = n.pts!;
   if (n.type === 'cloud') {
     const [x1, y1] = S(T, pts[0][0], pts[0][1]), [x2, y2] = S(T, pts[1][0], pts[1][1]);
     return sx >= Math.min(x1, x2) - tol && sx <= Math.max(x1, x2) + tol && sy >= Math.min(y1, y2) - tol && sy <= Math.max(y1, y2) + tol;
   }
-  for (let i = 1; i < pts.length; i++) {
-    const [ax, ay] = S(T, pts[i - 1][0], pts[i - 1][1]), [bx, by] = S(T, pts[i][0], pts[i][1]);
-    if (distSeg({ x: sx, y: sy }, { x: ax, y: ay }, { x: bx, y: by }) < tol) return true;
+  // a thick stroke is as easy to hit from its edge as a thin one from its middle; a pen stroke along its curve, as drawn
+  const reach = tol + noteLook(n).width / 2, sp = smoothPolyline(pts.map(p => S(T, p[0], p[1])), 0.5);
+  for (let i = 1; i < sp.length; i++) {
+    const [ax, ay] = sp[i - 1], [bx, by] = sp[i];
+    if (distSeg({ x: sx, y: sy }, { x: ax, y: ay }, { x: bx, y: by }) < reach) return true;
   }
   return false;
 }
 
-/** What's under a screen point. Chips win, then points, openings, lines/curves, then room fills. */
-export function hitAny(sx: number, sy: number, { touch = false, only = null as string | null } = {}): Hit | null {
+/**
+ * The least a wall's thickness can be on screen (px) for its two edges to be picked apart from it: a finger's width,
+ * or a mouse's. Thinner, it's picked whole.
+ */
+export const EDGE_MIN_PX = { touch: 24, mouse: 12 };
+
+/**
+ * A wall picked at (sx, sy): one of its edges (faces) when `faces` asks for them, it's wide enough on screen to tell
+ * them apart, and the pointer is on the outer quarter of its width either side (or just past its face); otherwise the
+ * wall, with the side of its centreline the pointer was on.
+ */
+function wallHit(id: string, sx: number, sy: number, touch: boolean, faces: boolean): Hit {
+  const sk = SK(), l = sk.lines[id], T = mainT();
+  if (l.kind !== 'wall' || l.anchor) return { type: 'line', id };
+  const A = sk.points[l.a], B = sk.points[l.b], [wx, wy] = s2w(sx, sy);
+  // (how far off its centreline, + to the left of A → B)
+  const k = ((B.x - A.x) * (wy - A.y) - (B.y - A.y) * (wx - A.x)) / (hyp(B.x - A.x, B.y - A.y) || 1);
+  const side: 1 | -1 = k >= 0 ? 1 : -1;
+  if (faces && !l.constr && l.thick * T.s >= (touch ? EDGE_MIN_PX.touch : EDGE_MIN_PX.mouse) && Math.abs(k) >= l.thick / 4) return { type: 'wface', id: edgeId(id, side) };
+  return { type: 'line', id, side };
+}
+
+/** A curved wall picked at (sx, sy): its outer (+1) or inner (−1) edge as wallHit picks a straight wall's, or the wall. */
+function curveHit(type: 'circle' | 'arc', id: string, sx: number, sy: number, touch: boolean, faces: boolean): Hit {
+  const sk = SK(), T = mainT(), w = sk.circles[id] ?? sk.arcs[id], f = curveFrame(sk, id);
+  if (!w || !f || w.kind !== 'wall') return { type, id };
+  // (how far off its centreline, + outside it)
+  const [wx, wy] = s2w(sx, sy), k = hyp(wx - f.o.x, wy - f.o.y) - f.r, side: 1 | -1 = k >= 0 ? 1 : -1, t = wallThick(w);
+  if (faces && !w.constr && t * T.s >= (touch ? EDGE_MIN_PX.touch : EDGE_MIN_PX.mouse) && Math.abs(k) >= t / 4) return { type: 'wface', id: edgeId(id, side) };
+  return { type, id, side };
+}
+
+/**
+ * What's under a screen point. Chips win, then points, openings, lines/curves, then room fills. `faces`: a wall's
+ * edges can be picked on their own (see wallHit).
+ */
+export function hitAny(sx: number, sy: number, { touch = false, only = null as string | null, faces = false } = {}): Hit | null {
   const sk = SK(), T = mainT(), tol = touch ? 20 : 10;
   if (ed.mode === 'annotate') {
     // image underlay (annotate mode only, so it never gets in the way of drafting):
     // handles of the selected image first, then markup on top of it, then the image itself
-    const u = page().underlay, showU = !!u && settings.layers.underlay;
-    if (showU && !u!.locked && !only && isSel('underlay', 'u')) {
-      const hd = nearestHandle(underlayHandles(T, u!), sx, sy, tol + 4);
-      if (hd) return { type: 'uhandle', id: 'u', part: hd.part };
+    const ims = settings.layers.underlay ? page().underlays : [];
+    const selIm = ed.sel.length === 1 && ed.sel[0].type === 'underlay' ? ims.find(u => u.id === ed.sel[0].id) : undefined;
+    if (selIm && !selIm.locked && !only) {
+      const hd = nearestHandle(underlayHandles(T, selIm), sx, sy, tol + 4);
+      if (hd) return { type: 'uhandle', id: selIm.id, part: hd.part };
     }
     // handles of the one selected arrow / cloud / pen stroke
     if (!only && settings.layers.annot && ed.sel.length === 1 && ed.sel[0].type === 'note') {
@@ -53,10 +122,20 @@ export function hitAny(sx: number, sy: number, { touch = false, only = null as s
       const hd = n && nearestHandle(noteHandles(T, n), sx, sy, tol + 4);
       if (hd) return { type: 'nhandle', id: n!.id, part: hd.part };
     }
-    for (let i = sk.notes.length - 1; i >= 0; i--) if (notePointHit(sk.notes[i], sx, sy, T, tol)) return { type: 'note', id: sk.notes[i].id };
-    if (showU && !only) {
+    for (let i = sk.notes.length - 1; i >= 0; i--) {
+      const n = sk.notes[i];
+      // (a link's tile: which part, as dragging it moves the card, its leader's tip, or the two together)
+      if (n.type === 'link') { const part = linkHit(T, n, sx, sy, tol); if (part) return part === 'card' ? { type: 'note', id: n.id } : { type: 'note', id: n.id, part }; continue; }
+      if (notePointHit(n, sx, sy, T, tol)) return { type: 'note', id: n.id };
+    }
+    if (!only) {
+      // the topmost image under the point
       const [wx, wy] = s2w(sx, sy);
-      if (wx >= u!.x && wx <= u!.x + u!.w && wy <= u!.y && wy >= u!.y - underlayH(u!)) return { type: 'underlay', id: 'u' };
+      for (let i = ims.length - 1; i >= 0; i--) {
+        // (in its own frame: a turned image is tapped where it's drawn)
+        const u = ims[i], q = underlayLocal(u, wx, wy);
+        if (Math.abs(q.x) <= u.w / 2 && Math.abs(q.y) <= underlayH(u) / 2) return { type: 'underlay', id: u.id };
+      }
     }
     return null;
   }
@@ -70,11 +149,13 @@ export function hitAny(sx: number, sy: number, { touch = false, only = null as s
         if (h.kind === 'cons') return { type: 'cons', id: h.id };
         if (h.kind === 'odim') return { type: 'odim', id: h.id, part: h.part };
         if (h.kind === 'room') return { type: 'room', id: h.id };
+        if (h.kind === 'elev') return { type: 'elev', id: h.id };
       }
     }
   }
   let best: { type: Hit['type']; id: string; d: number } | null = null;
   const consider = (type: Hit['type'], id: string, d: number) => { if (d < tol && (!best || d < best.d)) best = { type, id, d }; };
+  // a cabinet's corners can be picked, like a window's (to dimension or constrain to; dragging one moves the cabinet)
   for (const id in sk.points) { const p = sk.points[id]; const [x, y] = S(T, p.x, p.y); consider('point', id, hyp(x - sx, y - sy) - 4); }
   if (best) return { type: (best as { type: Hit['type'] }).type, id: (best as { id: string }).id };
   // door/window edge anchors behave like points for geometry picks (the dimension tool)
@@ -90,6 +171,22 @@ export function hitAny(sx: number, sy: number, { touch = false, only = null as s
     }
     if (bestA) return { type: 'oanchor', id: bestA.id, part: bestA.edge };
   }
+  // the ends of a door or window that's picked (or has an end picked): pickable on their own — not before, so a
+  // first tap near an end still grabs the door or window itself
+  if (!only) {
+    let bestE: { id: string; edge: OpeningEdge; d: number } | null = null;
+    for (const id in sk.openings) {
+      const shown = ed.sel.some(x => (x.type === 'opening' && x.id === id) || (x.type === 'oanchor' && x.id.startsWith(id + '|')));
+      if (!shown) continue;
+      for (const edge of ['s0', 's1'] as const) {
+        const p = edgePoint(sk, id, edge);
+        if (!p) continue;
+        const [x, y] = S(T, p.x, p.y), d = hyp(x - sx, y - sy) - 4;
+        if (d < tol && (!bestE || d < bestE.d)) bestE = { id, edge, d };
+      }
+    }
+    if (bestE) return { type: 'oanchor', id: bestE.id, part: bestE.edge };
+  }
   // openings: anywhere over the span (plus a margin), out to the jamb ticks across the wall
   if (!only) {
     for (const id in sk.openings) {
@@ -104,6 +201,7 @@ export function hitAny(sx: number, sy: number, { touch = false, only = null as s
   }
   for (const id in sk.lines) {
     const l = sk.lines[id];
+    if (l.anchor || (l.cab && !only)) continue; // a wall face's edges from the plan: after what's drawn on it
     if (l.constr && !settings.layers.construction) continue;
     const A = sk.points[l.a], B = sk.points[l.b];
     const [ax, ay] = S(T, A.x, A.y), [bx, by] = S(T, B.x, B.y);
@@ -125,7 +223,28 @@ export function hitAny(sx: number, sy: number, { touch = false, only = null as s
     const tw = sk.arcs[id].kind === 'wall' ? Math.max(0, ((sk.arcs[id].thick || 4.5) * T.s) / 2 - tol / 2) : 0;
     if (at <= sweep) consider('arc', id, Math.abs(hyp(x - sx, y - sy) - g.r * T.s) - tw);
   }
-  if (best) return { type: (best as { type: Hit['type'] }).type, id: (best as { id: string }).id };
+  if (best) {
+    const b = best as { type: Hit['type']; id: string };
+    if (b.type === 'line') return wallHit(b.id, sx, sy, touch, faces);
+    return b.type === 'circle' || b.type === 'arc' ? curveHit(b.type, b.id, sx, sy, touch, faces) : { type: b.type, id: b.id };
+  }
+  if (elevOpen()) {
+    // the wall view: a cabinet or a door/window under the pointer, then the plan's edges (floor, ceiling, corners, openings' sides)
+    if (!only) { const [wx, wy] = s2w(sx, sy), b = wallBodyAt(wx, wy, tol / T.s); if (b) return b; }
+    for (const id in sk.lines) {
+      const l = sk.lines[id];
+      if (!l.anchor && !l.cab) continue; // (and a cabinet's edges, as a window's)
+      const A = sk.points[l.a], B = sk.points[l.b], [ax, ay] = S(T, A.x, A.y), [bx, by] = S(T, B.x, B.y);
+      consider('line', id, distSeg({ x: sx, y: sy }, { x: ax, y: ay }, { x: bx, y: by }));
+    }
+    if (best) return { type: (best as { type: Hit['type'] }).type, id: (best as { id: string }).id };
+    return null;
+  }
+  // a cabinet's footprint (the plan only shows it: tapping it opens its wall)
+  if (!only && settings.layers.cabinets) {
+    const [wx, wy] = s2w(sx, sy);
+    for (const fp of cabinetFootprints(sk)) if (pointInPoly({ x: wx, y: wy }, fp.pts)) return { type: 'cabfoot', id: fp.key + '#' + fp.id };
+  }
   if (!only && settings.layers.rooms) {
     const [wx, wy] = s2w(sx, sy);
     for (const id in sk.rooms) {

package/src/render/icons.ts

@@ -2,15 +2,21 @@
 export const IC: Record<string, string> = {
   select: '<path d="M6 3.5l12.5 7.2-5.6 1.4-2.6 5.4z"/>',
   line: '<path d="M6.6 17.4L17.4 6.6"/><circle cx="5" cy="19" r="2"/><circle cx="19" cy="5" r="2"/>',
-  freehand: '<path d="M3 7.5c1.6-3 3.4-3 5 0s3.4 3 5 0 3.4-3 5 0"/><path d="M12 11v3M10.5 12.5L12 14l1.5-1.5" stroke-width="1.6"/><path d="M3 20l5-4 5 3 6-5"/>',
-  wall: '<path d="M3 8.5h18M3 15.5h18M3 8.5v7M21 8.5v7"/>',
+  // a freehand squiggle beside a pen nib (a stroke made into a shape)
+  freehand: '<path d="M3.6 2c1.8 2 2.6 4 2.2 6.2-.4 2.2-2.6 4.4-2.9 6.8-.2 1.8.4 3.2 1.8 4.4"/><path d="M7.2 20.4l1.9-9.9 5.1-.9 4.6 4.4-.9 4.6z"/><path d="M14.2 9.6l2.2-3.3M18.8 14l3.6-2M7.2 20.4l5.2-4.4"/>',
+  // a corner rounded off (Figma 2523:101119)
+  fillet: '<path d="M2 22V12.91C2 6.88 6.88 2 12.91 2H22"/>',
+  // a corner cut off straight, its corners sharp (Figma 2523:101121)
+  chamfer: '<path d="M2 22V11.79L9.45 2H22" stroke-linejoin="miter"/>',
+  // a corner of wall as drawn in plan: an L-shaped band, hatched (not a box, so it isn't taken for the Rectangle)
+  wall: '<path d="M4 20V4h16v5H9v11z"/><path d="M4 16.5l5-5M4 10.5L10.5 4M12.5 9l5-5" stroke-width="1.3"/>',
   rect: '<rect x="4.5" y="6" width="15" height="12" rx="1"/>',
   circle: '<circle cx="12" cy="12" r="7.5"/><circle cx="12" cy="12" r="1" fill="currentColor"/>',
-  arc: '<path d="M4.5 17a8.5 8.5 0 0 1 15 0"/><circle cx="4.5" cy="17" r="1.6"/><circle cx="19.5" cy="17" r="1.6"/>',
+  arc: '<path d="M4.5 13.5a8.5 8.5 0 0 1 15 0"/><circle cx="4.5" cy="13.5" r="1.6"/><circle cx="19.5" cy="13.5" r="1.6"/>', // (centred in the box: y 9–15)
   dim: '<path d="M4 7v10M20 7v10M4 12h16M7.5 9.5L4.5 12l3 2.5M16.5 9.5l3 2.5-3 2.5"/>',
   trim: '<circle cx="6.5" cy="7" r="2.6"/><circle cx="6.5" cy="17" r="2.6"/><path d="M8.6 8.6L20 18M8.6 15.4L20 6"/>',
   offset: '<path d="M4 15L15 4M9 20L20 9"/><path d="M11 9l2.5 2.5"/>',
-  split: '<path d="M3 12h6.5M14.5 12H21"/><circle cx="12" cy="12" r="2.2" fill="currentColor"/><path d="M12 4.5v3M12 16.5v3"/>',
+  split: '<path d="M3 12H9.5M14.5 12H21"/><path d="M12 14.1969C13.2151 14.1969 14.2 13.2119 14.2 11.9969C14.2 10.7818 13.2151 9.79688 12 9.79688C10.785 9.79688 9.80005 10.7818 9.80005 11.9969C9.80005 13.2119 10.785 14.1969 12 14.1969Z" fill="currentColor"/><path d="M12 4V7M12 17V20"/>',
   opening: '<path d="M5 20V6"/><path d="M5 6a14 14 0 0 1 14 14"/><path d="M3 20h18"/>',
   room: '<path d="M4 5h9v6h7v8H4z"/>',
   constr: '<path d="M5 19L19 5" stroke-dasharray="2.5 3"/>',
@@ -18,7 +24,13 @@ export const IC: Record<string, string> = {
   redo: '<path d="M15 14l5-5-5-5"/><path d="M20 9H9.5a5.5 5.5 0 0 0 0 11H13"/>',
   pen: '<path d="M4 20l1-4.5L16 4.5l3.5 3.5L8.5 19z"/><path d="M13.5 7l3.5 3.5"/>',
   arrow: '<path d="M5 19L18 6"/><path d="M10 6h8v8"/>',
-  image: '<rect x="3.5" y="5" width="13" height="13" rx="1.5"/><path d="M3.5 15l4-4 5 5"/><path d="M19 3v6M16 6h6"/>',
+  // the markup shapes beside Arrow (its Line drawn as Draft's)
+  mline: '<path d="M6.6 17.4L17.4 6.6"/><circle cx="5" cy="19" r="2"/><circle cx="19" cy="5" r="2"/>',
+  mrect: '<rect x="4.5" y="6" width="15" height="12" rx="1"/>',
+  mtri: '<path d="M12 4.5L20.5 19h-17z" stroke-linejoin="round"/>',
+  mcircle: '<circle cx="12" cy="12" r="7.5"/>',
+  // BOLDR's annotation editors' Add image (Lucide's image-plus)
+  image: '<path d="M16 5h6"/><path d="M19 2v6"/><path d="M21 11.5V19a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h7.5"/><path d="m21 15-3.086-3.086a2 2 0 0 0-2.828 0L6 21"/><circle cx="9" cy="9" r="2"/>',
   text: '<path d="M5 6h14M12 6v13M9 19h6"/>',
   cloud: '<path d="M7 18a3 3 0 0 1-.4-6A4.5 4.5 0 0 1 15 9.6 3.5 3.5 0 1 1 17.5 18z"/>',
   calib: '<path d="M3 15l12-12 6 6-12 12z"/><path d="M7 11l2 2M10 8l2 2M13 5l2 2"/>',
@@ -31,17 +43,27 @@ export const IC: Record<string, string> = {
   eyeoff: '<path d="M2.5 12S6 5.5 12 5.5 21.5 12 21.5 12 18 18.5 12 18.5 2.5 12 2.5 12z"/><circle cx="12" cy="12" r="2.8"/><path d="M4 20L20 4"/>',
   auto: '<path d="M12 3l1.8 4.6L18.5 9l-4.7 1.6L12 15l-1.8-4.4L5.5 9l4.7-1.4z"/><path d="M18 15l.8 2 2 .8-2 .8-.8 2-.8-2-2-.8 2-.8z"/>',
   layers: '<path d="M12 3l9 5-9 5-9-5z"/><path d="M3 13l9 5 9-5"/>',
+  // a plan sheet unrolling from its roll, rooms drawn on it (the pages and spaces)
+  spaces: '<path d="M10 5.50353H21V20.5035H6.1C5.14522 20.5035 4.22955 20.1242 3.55442 19.4491C2.87928 18.774 2.5 17.8583 2.5 16.9035M2.5 16.9035V5.50353C2.5 5.50353 2.5 3 5 3C7.5 3 7.5 5.00353 7.5 5.00353V16.0035C7.5 16.0035 6.99996 14.5 4.99996 14.5C2.5 14.5 2.5 16.9035 2.5 16.9035Z"/><path stroke-width="1" d="M14.0188 9L14.0188 11.2622M14.0188 14.7405V16.9144M10.2797 13H12.2797M15.758 13H17.7579M10.2797 9H17.7579V17H10.2797V9Z"/>',
   back: '<path d="M15 4.5L7.5 12l7.5 7.5"/>',
+  // a turn clockwise (Lucide's rotate-cw): how far an image is turned
+  rotate: '<path d="M21 12a9 9 0 1 1-9-9c2.52 0 4.93 1 6.74 2.74L21 8"/><path d="M21 3v5h-5"/>',
+  // a circle half filled: how see-through
+  opacity: '<circle cx="12" cy="12" r="8"/><path d="M12 4a8 8 0 0 1 0 16z" fill="currentColor" stroke="none"/>',
+  // two overlapping sheets: the front one solid (bring to front), or the back one (send to back)
+  tofront: '<path d="M13 3.5H5C4.17157 3.5 3.5 4.17157 3.5 5V13C3.5 13.8284 4.17157 14.5 5 14.5H13C13.8284 14.5 14.5 13.8284 14.5 13V5C14.5 4.17157 13.8284 3.5 13 3.5Z" stroke-width="1.5" stroke-dasharray="2.75 2.5"/><path d="M19 9.5H11C10.1716 9.5 9.5 10.1716 9.5 11V19C9.5 19.8284 10.1716 20.5 11 20.5H19C19.8284 20.5 20.5 19.8284 20.5 19V11C20.5 10.1716 19.8284 9.5 19 9.5Z" fill="currentColor" fill-opacity="0.35"/>',
+  toback: '<path d="M19 9.5H11C10.1716 9.5 9.5 10.1716 9.5 11V19C9.5 19.8284 10.1716 20.5 11 20.5H19C19.8284 20.5 20.5 19.8284 20.5 19V11C20.5 10.1716 19.8284 9.5 19 9.5Z" stroke-width="1.5" stroke-dasharray="2.75 2.5"/><path d="M13 3.5H5C4.17157 3.5 3.5 4.17157 3.5 5V13C3.5 13.8284 4.17157 14.5 5 14.5H13C13.8284 14.5 14.5 13.8284 14.5 13V5C14.5 4.17157 13.8284 3.5 13 3.5Z" fill="currentColor" fill-opacity="0.35"/>',
   share: '<circle cx="6" cy="12" r="2.4"/><circle cx="18" cy="6" r="2.4"/><circle cx="18" cy="18" r="2.4"/><path d="M8.2 10.9l7.6-3.8M8.2 13.1l7.6 3.8"/>',
   dots: '<circle cx="5" cy="12" r="1.6" fill="currentColor"/><circle cx="12" cy="12" r="1.6" fill="currentColor"/><circle cx="19" cy="12" r="1.6" fill="currentColor"/>',
-  save: '<path d="M5 4h11l3 3v13H5z"/><path d="M8 4v5h7V4M8 20v-6h8v6"/>',
+  // BOLDR's save (Figma 2247:138414): a filled disk, the full 24 box
+  save: '<path transform="translate(-25.5 -12.5)" fill="currentColor" stroke="none" d="M44.0271 12.5H27.374C26.3412 12.5 25.5 13.3412 25.5 14.374V34.626C25.5 35.6588 26.3305 36.5 27.374 36.5H47.626C48.6588 36.5 49.5 35.6695 49.5 34.626V17.9729L44.0271 12.5ZM37.5 33.1886C35.4024 33.1886 33.6988 31.4849 33.6988 29.3873C33.6988 27.2897 35.4024 25.5861 37.5 25.5861C39.5976 25.5861 41.3012 27.2897 41.3012 29.3873C41.3012 31.4849 39.5976 33.1886 37.5 33.1886ZM41.4184 20.2622H29.4503V15.8434H41.4184V20.2622Z"/>',
   bt: '<path d="M7 18H6a5 5 0 0 1-.6-10A7 7 0 0 1 18.5 6.6 5.5 5.5 0 0 1 18.5 18H17"/><path d="M9.5 11l5 4-2.5 2V8.5l2.5 2-5 4"/>',
   h: '<path d="M4 12h16"/><circle cx="4" cy="12" r="1.8" fill="currentColor"/><circle cx="20" cy="12" r="1.8" fill="currentColor"/>',
   v: '<path d="M12 4v16"/><circle cx="12" cy="4" r="1.8" fill="currentColor"/><circle cx="12" cy="20" r="1.8" fill="currentColor"/>',
   par: '<path d="M5 18L13 6M11 18L19 6"/>',
-  perp: '<path d="M4 19h16M10 19V5"/><path d="M10 15h4v4"/>',
+  perp: '<path d="M4 19H20M10 19V5"/><path d="M10 14H15V19"/>',
   tan: '<circle cx="12" cy="14" r="6"/><path d="M3 8h18"/>',
-  col: '<path d="M3 20l6-6M15 8l6-6"/><path d="M10.5 12.5l3-3" stroke-dasharray="1.5 2"/>',
+  col: '<path d="M3 20L8.5 14.5M15.5 7.5L21 2"/><path d="M10.5 12.5L13.5 9.5" stroke-dasharray="1.5 2"/>',
   eq: '<path d="M5 9h14M5 15h14"/>',
   mid: '<path d="M3.5 17L20.5 7"/><circle cx="12" cy="12" r="2.6" fill="currentColor"/>',
   online: '<path d="M3.5 17L20.5 7"/><circle cx="15.5" cy="9.6" r="2.4"/>',
@@ -50,11 +72,33 @@ export const IC: Record<string, string> = {
   unlock: '<rect x="5.5" y="10.5" width="13" height="9.5" rx="2"/><path d="M8.5 10.5V8a3.5 3.5 0 0 1 6.8-1.2"/>',
   angle: '<path d="M4 19h16M4 19L15 5"/><path d="M10.5 19a6.5 6.5 0 0 0-2.6-5.2"/>',
   diam: '<circle cx="12" cy="12" r="7.5"/><path d="M6.7 17.3L17.3 6.7"/>',
-  merge: '<circle cx="6" cy="12" r="2.2"/><circle cx="18" cy="12" r="2.2"/><path d="M9 12h6M12.5 9.5L15 12l-2.5 2.5"/>',
+  merge: '<path d="M4.2 14.1969C5.41503 14.1969 6.4 13.2119 6.4 11.9969C6.4 10.7818 5.41503 9.79688 4.2 9.79688C2.98497 9.79688 2 10.7818 2 11.9969C2 13.2119 2.98497 14.1969 4.2 14.1969Z"/><path d="M18 14.1969C19.2151 14.1969 20.2 13.2119 20.2 11.9969C20.2 10.7818 19.2151 9.79688 18 9.79688C16.785 9.79688 15.8 10.7818 15.8 11.9969C15.8 13.2119 16.785 14.1969 18 14.1969Z"/><path d="M6.5 12H14.5M12 14.5L14.5 12L12 9.5" stroke-width="1.5"/>',
   chain: '<path d="M9 7H6a5 5 0 0 0 0 10h3M15 7h3a5 5 0 0 1 0 10h-3M8 12h8"/>',
   thick: '<path d="M3 7h18M3 17h18"/><path d="M12 9.5v5M10.3 11l1.7-1.7 1.7 1.7M10.3 13l1.7 1.7 1.7-1.7"/>',
+  // a wall's length measured on its face on top, at the bottom, left or right (as the page shows the wall), or along its
+  // centerline (a level wall's, a plumb one's): a wall dimension's choices
+  faceT: '<path d="M3 16h18" stroke-width="1.3"/><path d="M3 8h18M6 5.5L3 8l3 2.5M18 5.5L21 8l-3 2.5"/>',
+  faceB: '<path d="M3 8h18" stroke-width="1.3"/><path d="M3 16h18M6 13.5L3 16l3 2.5M18 13.5L21 16l-3 2.5"/>',
+  faceL: '<path d="M16 3v18" stroke-width="1.3"/><path d="M8 3v18M5.5 6L8 3l2.5 3M5.5 18L8 21l2.5-3"/>',
+  faceR: '<path d="M8 3v18" stroke-width="1.3"/><path d="M16 3v18M13.5 6L16 3l2.5 3M13.5 18L16 21l2.5-3"/>',
+  faceMidH: '<path d="M3 6h18M3 18h18" stroke-width="1.3"/><path d="M3 12h18M6 9.5L3 12l3 2.5M18 9.5L21 12l-3 2.5"/>',
+  faceMidV: '<path d="M6 3v18M18 3v18" stroke-width="1.3"/><path d="M12 3v18M9.5 6L12 3l2.5 3M9.5 18L12 21l2.5-3"/>',
+  // the distance between two walls (plumb ones; H: level): between their faces toward each other, their centerlines,
+  // their far faces
+  spanIn: '<path d="M2.5 4v16M7 4v16M17 4v16M21.5 4v16" stroke-width="1.3"/><path d="M7 12h10M9.5 9.5L7 12l2.5 2.5M14.5 9.5L17 12l-2.5 2.5"/>',
+  spanMid: '<path d="M2.5 4v16M7 4v16M17 4v16M21.5 4v16" stroke-width="1.3"/><path d="M4.75 4v16M19.25 4v16" stroke-width="1" stroke-dasharray="1.5 2"/><path d="M4.75 12h14.5M7.25 9.5L4.75 12l2.5 2.5M16.75 9.5l2.5 2.5-2.5 2.5"/>',
+  spanOut: '<path d="M2.5 3v12M7 3v12M17 3v12M21.5 3v12" stroke-width="1.3"/><path d="M2.5 19.5h19M5 17L2.5 19.5 5 22M19 17l2.5 2.5L19 22"/>',
+  spanInH: '<path d="M4 2.5h16M4 7h16M4 17h16M4 21.5h16" stroke-width="1.3"/><path d="M12 7v10M9.5 9.5L12 7l2.5 2.5M9.5 14.5L12 17l2.5-2.5"/>',
+  spanMidH: '<path d="M4 2.5h16M4 7h16M4 17h16M4 21.5h16" stroke-width="1.3"/><path d="M4 4.75h16M4 19.25h16" stroke-width="1" stroke-dasharray="1.5 2"/><path d="M12 4.75v14.5M9.5 7.25L12 4.75l2.5 2.5M9.5 16.75l2.5 2.5 2.5-2.5"/>',
+  spanOutH: '<path d="M3 2.5h12M3 7h12M3 17h12M3 21.5h12" stroke-width="1.3"/><path d="M19.5 2.5v19M17 5L19.5 2.5 22 5M17 19l2.5 2.5L22 19"/>',
+  // a curved wall's diameter across its inner face, its centerline, its outer face
+  ringIn: '<circle cx="12" cy="12" r="5.5" stroke-width="1.3"/><circle cx="12" cy="12" r="9.5" stroke-width="1.3"/><path d="M6.5 12h11M9 9.5L6.5 12 9 14.5M15 9.5l2.5 2.5L15 14.5"/>',
+  ringMid: '<circle cx="12" cy="12" r="5.5" stroke-width="1.3"/><circle cx="12" cy="12" r="9.5" stroke-width="1.3"/><circle cx="12" cy="12" r="7.5" stroke-width="1" stroke-dasharray="1.5 2"/><path d="M4.5 12h15M7 9.5L4.5 12 7 14.5M17 9.5l2.5 2.5L17 14.5"/>',
+  ringOut: '<circle cx="12" cy="12" r="5.5" stroke-width="1.3"/><circle cx="12" cy="12" r="9.5" stroke-width="1.3"/><path d="M2.5 12h19M5 9.5L2.5 12 5 14.5M19 9.5l2.5 2.5L19 14.5"/>',
   flip: '<path d="M12 3v18"/><path d="M8 7L3 12l5 5zM16 7l5 5-5 5z"/>',
   ref: '<path d="M8 4a12 12 0 0 0 0 16M16 4a12 12 0 0 1 0 16"/>',
+  hline: '<path d="M3 13h18"/><path d="M3 20h18" stroke-dasharray="2 3"/><path d="M17 4v6M15 8l2 2 2-2"/>',
+  cabinet: '<rect x="4" y="6" width="16" height="14" rx="1"/><path d="M12 6v14M10 11v3M14 11v3M3 20h18"/>',
   window: '<path d="M2.5 8.5v7M21.5 8.5v7M2.5 12h3M18.5 12h3"/><path d="M5.5 10h13M5.5 14h13M5.5 8.5v7M18.5 8.5v7"/>',
   door: '<path d="M5 20V6"/><path d="M5 6a14 14 0 0 1 14 14"/><path d="M3 20h18"/>',
   convert: '<path d="M4 17c3-6 4.5 1 7.5-4.5S16 9 20 6"/><path d="M4 21h16" stroke-dasharray="3 2.5"/>',
@@ -64,9 +108,24 @@ export const IC: Record<string, string> = {
   close: '<path d="M6 6l12 12M18 6L6 18"/>',
   closeShape: '<path d="M5 18V6h12"/><path d="M17 6l2 12H5" stroke-dasharray="2 2.5"/>',
   width: '<path d="M3 8v8M21 8v8M3 12h18M6 9.5L3.5 12 6 14.5M18 9.5l2.5 2.5-2.5 2.5"/>',
-  elev: '<path d="M3 20h18"/><rect x="4.5" y="5" width="15" height="15"/><rect x="7.5" y="11" width="4" height="9"/><rect x="13.5" y="8.5" width="3.5" height="4"/>',
+  elev: '<path d="M2 20L22 20"/><path d="M20 5H4V20H20V5Z"/><path d="M11.5 11H7.5V20H11.5V11Z" stroke-width="1"/><path d="M17 9H14V13H17V9Z" stroke-width="1"/>',
   conc: '<circle cx="12" cy="12" r="8"/><circle cx="12" cy="12" r="3.5"/>',
   color: '<circle cx="12" cy="12" r="7" fill="currentColor"/>',
+  // links: open what a tile is for (Lucide's external-link); a tile's leader (a card, its line out to an arrowhead);
+  // a measurement linked to a dimension, and let go of (Lucide's link and unlink); saved to the drawing's group
+  // (Lucide's folder-plus)
+  open: '<path d="M15 3h6v6"/><path d="M10 14L21 3"/><path d="M18 13v6a2 2 0 0 1-2 2H5a2 2 0 0 1-2-2V8a2 2 0 0 1 2-2h6"/>',
+  leader: '<rect x="3" y="3" width="8.5" height="8.5" rx="2"/><path d="M11.5 11.5L20 20"/><path d="M14.5 20H20v-5.5"/>',
+  link: '<path d="M10 13a5 5 0 0 0 7.54.54l3-3a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M14 11a5 5 0 0 0-7.54-.54l-3 3a5 5 0 0 0 7.07 7.07l1.71-1.71"/>',
+  unlink: '<path d="M18.84 12.25l1.72-1.71a5 5 0 0 0-7.07-7.07l-1.72 1.71"/><path d="M5.17 11.75l-1.71 1.71a5 5 0 0 0 7.07 7.07l1.71-1.71"/><path d="M8 2v3M2 8h3M16 19v3M19 16h3"/>',
+  // the link tiles' size (Lucide's scaling)
+  tilesize: '<path d="M21 3L9 15"/><path d="M12 3H3v18h18v-9"/><path d="M16 3h5v5"/><path d="M14 15H9v-5"/>',
+  savegroup: '<path d="M12 10v6M9 13h6"/><path d="M20 20a2 2 0 0 0 2-2V8a2 2 0 0 0-2-2h-7.9a2 2 0 0 1-1.69-.9L9.6 3.9A2 2 0 0 0 7.93 3H4a2 2 0 0 0-2 2v13a2 2 0 0 0 2 2z"/>',
+  // the 3D tab's rail: the corner view (a block seen from a corner), from above (the block, its top filled in), cut away
+  // (a room whose front walls are low)
+  home3d: '<path d="M12 3l8 4.5v9L12 21l-8-4.5v-9z"/><path d="M4 7.5L12 12l8-4.5M12 12v9"/>',
+  top3d: '<path d="M12 3l8 4.5v9L12 21l-8-4.5v-9z"/><path d="M4 7.5L12 12l8-4.5M12 12v9"/><path d="M12 3l8 4.5-8 4.5-8-4.5z" fill="currentColor" fill-opacity="0.55"/>',
+  cutaway: '<path d="M3.5 14.5V6.5L12 2l8.5 4.5v8"/><path d="M12 2v8L3.5 14.5M12 10l8.5 4.5" stroke-width="1.5"/><path d="M3.5 12.5L12 17l8.5-4.5M3.5 14.5L12 19l8.5-4.5M12 17v2"/>',
 };
 
 export const icon = (k: string, s = 24): string =>