@toolpath/viewer 1.1.0 → 1.1.1

package/dist/index.d.ts

@@ -114,7 +114,7 @@ interface GridProps {
  * fixed cells is either invisible on a 900 mm plate or a solid wash under a
  * 12 mm insert.
  */
-declare const Grid: ({ step, extent, color, opacity }: GridProps) => react.JSX.Element;
+declare const Grid: ({ step, extent, color, opacity }: GridProps) => react.JSX.Element | null;
 interface AxesProps {
     size?: number;
 }
@@ -336,6 +336,18 @@ interface GridSpec {
  * The plane is the *bottom* of the part, not `z = 0`: parts usually sit on
  * `z = 0` and then the two agree, but one modelled about its centre would
  * otherwise be sliced in half by its own grid.
+ *
+ * **Give this a measured box.** The plane is `box.min.z`, which is `+Infinity`
+ * for an empty one. Nothing else in the spec shows it — `getSize` and
+ * `getCenter` both short-circuit to zero for an empty `Box3` — so the step and
+ * the extent come back looking ordinary and {@link gridGeometry} then builds
+ * every vertex on a plane at infinity, which three.js reports as "Computed
+ * radius is NaN" once per mount.
+ *
+ * `useContentBox` hands back an empty box until the scene has been
+ * measured, so a caller pairing the two wants `if (box.isEmpty()) return null`
+ * ahead of this. That is what the package's own `Grid` does, and it is why it
+ * draws nothing on the opening frame rather than a grid nobody asked for.
  */
 declare function gridSpec(box: Box3): GridSpec;
 /**

package/dist/index.js

@@ -155,6 +155,18 @@ function gridGeometry(spec) {
   geometry.setAttribute("position", new Float32BufferAttribute(positions, 3));
   return geometry;
 }
+function gridFor(box, options = {}) {
+  if (box.isEmpty()) return null;
+  const spec = gridSpec(box);
+  const cell = options.step ?? spec.step;
+  return gridGeometry({
+    ...spec,
+    step: cell,
+    // Snapped outwards to a whole number of cells, so the part sits inside the
+    // grid rather than ending part-way through a square.
+    extent: options.extent ?? Math.ceil(spec.extent / cell) * cell
+  });
+}
 
 // src/primitives.tsx
 import { jsx, jsxs } from "react/jsx-runtime";
@@ -162,18 +174,9 @@ var FURNITURE = { [EXCLUDE_FROM_FRAME]: true };
 var Grid = ({ step, extent, color, opacity = 0.35 }) => {
   const theme = resolveTheme();
   const box = useContentBox();
-  const geometry = useMemo(() => {
-    const spec = gridSpec(box);
-    const cell = step ?? spec.step;
-    return gridGeometry({
-      ...spec,
-      step: cell,
-      // Snapped outwards to a whole number of cells, so the part sits inside
-      // the grid rather than ending part-way through a square.
-      extent: extent ?? Math.ceil(spec.extent / cell) * cell
-    });
-  }, [box, extent, step]);
-  useEffect(() => () => geometry.dispose(), [geometry]);
+  const geometry = useMemo(() => gridFor(box, { step, extent }), [box, extent, step]);
+  useEffect(() => () => geometry?.dispose(), [geometry]);
+  if (!geometry) return null;
   return /* @__PURE__ */ jsx("lineSegments", { geometry, renderOrder: -1, raycast: () => null, userData: FURNITURE, children: /* @__PURE__ */ jsx("lineBasicMaterial", { color: color ?? theme.cubeEdge, transparent: true, opacity }) });
 };
 var Axes = ({ size = 25 }) => /* @__PURE__ */ jsx("axesHelper", { args: [size], userData: FURNITURE, raycast: () => null });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@toolpath/viewer",
-  "version": "1.1.0",
+  "version": "1.1.1",
   "description": "React Three Fiber viewer for Toolpath Engine part reports",
   "license": "MIT",
   "engines": {