pcb-scene3d-viewer 1.0.1 → 1.1.0

package/src/PcbScene3dCutoutCircleDetector.mjs

@@ -0,0 +1,84 @@
+/**
+ * Detects sampled circular drill cutouts for faster geometry clipping.
+ */
+export class PcbScene3dCutoutCircleDetector {
+    static #DEFAULT_EPSILON = 0.001
+    static #MAX_RELATIVE_ERROR = 0.025
+    static #MIN_POINT_COUNT = 8
+
+    /**
+     * Resolves circle metadata for sampled circular drill cutouts.
+     * @param {{ x: number, y: number }[]} points
+     * @param {number} [epsilon]
+     * @returns {{ isCircular: true, centerX: number, centerY: number, radius: number } | null}
+     */
+    static resolve(points, epsilon = this.#DEFAULT_EPSILON) {
+        if (
+            !Array.isArray(points) ||
+            points.length < PcbScene3dCutoutCircleDetector.#MIN_POINT_COUNT
+        ) {
+            return null
+        }
+
+        const center = PcbScene3dCutoutCircleDetector.#resolveCentroid(points)
+        const radii = points.map((point) =>
+            Math.hypot(point.x - center.x, point.y - center.y)
+        )
+        const radius =
+            radii.reduce((sum, value) => sum + value, 0) / radii.length
+        const maxError = Math.max(
+            ...radii.map((value) => Math.abs(value - radius))
+        )
+        const tolerance = Math.max(
+            Number(epsilon || 0),
+            radius * PcbScene3dCutoutCircleDetector.#MAX_RELATIVE_ERROR
+        )
+
+        if (
+            !Number.isFinite(radius) ||
+            radius <= Number(epsilon || 0) ||
+            maxError > tolerance
+        ) {
+            return null
+        }
+
+        return {
+            isCircular: true,
+            centerX: center.x,
+            centerY: center.y,
+            radius
+        }
+    }
+
+    /**
+     * Resolves squared distance from a point to circular cutout center.
+     * @param {{ x: number, y: number }} point
+     * @param {{ centerX?: number, centerY?: number }} cutout
+     * @returns {number}
+     */
+    static distanceSquared(point, cutout) {
+        const dx = point.x - Number(cutout.centerX || 0)
+        const dy = point.y - Number(cutout.centerY || 0)
+        return dx * dx + dy * dy
+    }
+
+    /**
+     * Resolves the centroid of one point list.
+     * @param {{ x: number, y: number }[]} points
+     * @returns {{ x: number, y: number }}
+     */
+    static #resolveCentroid(points) {
+        const sum = points.reduce(
+            (accumulator, point) => ({
+                x: accumulator.x + Number(point.x || 0),
+                y: accumulator.y + Number(point.y || 0)
+            }),
+            { x: 0, y: 0 }
+        )
+
+        return {
+            x: sum.x / points.length,
+            y: sum.y / points.length
+        }
+    }
+}

package/src/PcbScene3dCutoutGeometryFilter.mjs

@@ -1,3 +1,5 @@
+import { PcbScene3dCutoutCircleDetector } from './PcbScene3dCutoutCircleDetector.mjs'
+
 /**
  * Clips filled 2D geometry against drill-cutout polygons.
  */
@@ -79,7 +81,7 @@ export class PcbScene3dCutoutGeometryFilter {
     /**
      * Resolves clipping settings.
      * @param {{ maxDepth?: number, maxEdgeLength?: number }} options
-     * @returns {{ maxDepth: number, maxEdgeLength: number }}
+     * @returns {{ maxDepth: number, maxEdgeLength: number, maxEdgeLengthSquared: number }}
      */
     static #resolveSettings(options) {
         const maxEdgeLength = Math.max(
@@ -94,24 +96,35 @@ export class PcbScene3dCutoutGeometryFilter {
                     PcbScene3dCutoutGeometryFilter.#DEFAULT_MAX_DEPTH,
                 0
             ),
-            maxEdgeLength
+            maxEdgeLength,
+            maxEdgeLengthSquared: maxEdgeLength * maxEdgeLength
         }
     }
 
     /**
      * Prepares cutout polygons with bounds for fast overlap checks.
      * @param {{ x: number, y: number }[][]} cutouts
-     * @returns {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number } }[]}
+     * @returns {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number }, isCircular?: boolean, centerX?: number, centerY?: number, radius?: number }[]}
      */
     static #prepareCutouts(cutouts) {
         return cutouts
             .filter((cutout) => Array.isArray(cutout) && cutout.length >= 3)
-            .map((cutout) => ({
-                points: cutout,
-                segments:
-                    PcbScene3dCutoutGeometryFilter.#buildCutoutSegments(cutout),
-                bounds: PcbScene3dCutoutGeometryFilter.#resolveBounds(cutout)
-            }))
+            .map((cutout) => {
+                const circularCutout =
+                    PcbScene3dCutoutCircleDetector.resolve(cutout)
+
+                return {
+                    points: cutout,
+                    segments:
+                        PcbScene3dCutoutGeometryFilter.#buildCutoutSegments(
+                            cutout
+                        ),
+                    bounds: PcbScene3dCutoutGeometryFilter.#resolveBounds(
+                        cutout
+                    ),
+                    ...circularCutout
+                }
+            })
     }
 
     /**
@@ -151,7 +164,7 @@ export class PcbScene3dCutoutGeometryFilter {
      * @param {number[]} positions
      * @param {{ x: number, y: number, z: number }[]} triangle
      * @param {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number } }[]} cutouts
-     * @param {{ maxDepth: number, maxEdgeLength: number }} settings
+     * @param {{ maxDepth: number, maxEdgeLength: number, maxEdgeLengthSquared: number }} settings
      * @param {number} depth
      * @param {{ changed: boolean }} state
      * @param {object | null} [cutoutIndex]
@@ -199,8 +212,8 @@ export class PcbScene3dCutoutGeometryFilter {
 
         if (
             depth >= settings.maxDepth ||
-            PcbScene3dCutoutGeometryFilter.#maxEdgeLength(triangle) <=
-                settings.maxEdgeLength
+            PcbScene3dCutoutGeometryFilter.#maxEdgeLengthSquared(triangle) <=
+                settings.maxEdgeLengthSquared
         ) {
             return
         }
@@ -443,23 +456,22 @@ export class PcbScene3dCutoutGeometryFilter {
     }
 
     /**
-     * Resolves the longest edge in one triangle.
+     * Resolves the longest squared edge length in one triangle.
      * @param {{ x: number, y: number }[]} triangle
      * @returns {number}
      */
-    static #maxEdgeLength(triangle) {
-        let maxLength = 0
+    static #maxEdgeLengthSquared(triangle) {
+        let maxLengthSquared = 0
 
         for (let index = 0; index < triangle.length; index += 1) {
             const point = triangle[index]
             const next = triangle[(index + 1) % triangle.length]
-            maxLength = Math.max(
-                maxLength,
-                Math.hypot(point.x - next.x, point.y - next.y)
-            )
+            const dx = point.x - next.x
+            const dy = point.y - next.y
+            maxLengthSquared = Math.max(maxLengthSquared, dx * dx + dy * dy)
         }
 
-        return maxLength
+        return maxLengthSquared
     }
 
     /**
@@ -496,10 +508,17 @@ export class PcbScene3dCutoutGeometryFilter {
      */
     static #boundsOverlap(first, second) {
         return (
-            first.minX <= second.maxX &&
-            first.maxX >= second.minX &&
-            first.minY <= second.maxY &&
-            first.maxY >= second.minY
+            first.minX <=
+                second.maxX +
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            first.maxX >=
+                second.minX -
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            first.minY <=
+                second.maxY +
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            first.maxY >=
+                second.minY - PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON
         )
     }
 
@@ -543,7 +562,7 @@ export class PcbScene3dCutoutGeometryFilter {
     /**
      * Returns true when one triangle intersects or covers a cutout.
      * @param {{ x: number, y: number }[]} triangle
-     * @param {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number } }} cutout
+     * @param {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number }, isCircular?: boolean, centerX?: number, centerY?: number, radius?: number }} cutout
      * @returns {boolean}
      */
     static #doesTriangleOverlapCutout(triangle, cutout) {
@@ -587,10 +606,28 @@ export class PcbScene3dCutoutGeometryFilter {
     /**
      * Returns true when a point is inside or on a cutout.
      * @param {{ x: number, y: number }} point
-     * @param {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number } }} cutout
+     * @param {{ points: { x: number, y: number }[], segments: { start: { x: number, y: number }, end: { x: number, y: number }, dx: number, dy: number, lengthSquared: number, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], bounds: { minX: number, maxX: number, minY: number, maxY: number }, isCircular?: boolean, centerX?: number, centerY?: number, radius?: number }} cutout
      * @returns {boolean}
      */
     static #isPointInsideOrOnCutout(point, cutout) {
+        if (
+            !PcbScene3dCutoutGeometryFilter.#pointOverlapsBounds(
+                point,
+                cutout.bounds
+            )
+        ) {
+            return false
+        }
+
+        if (cutout.isCircular) {
+            return (
+                PcbScene3dCutoutCircleDetector.distanceSquared(point, cutout) <=
+                (Number(cutout.radius || 0) +
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON) **
+                    2
+            )
+        }
+
         return (
             PcbScene3dCutoutGeometryFilter.#isPointOnCutoutBoundary(
                 point,
@@ -603,13 +640,47 @@ export class PcbScene3dCutoutGeometryFilter {
         )
     }
 
+    /**
+     * Returns true when a point lies within a bounding box tolerance.
+     * @param {{ x: number, y: number }} point
+     * @param {{ minX: number, maxX: number, minY: number, maxY: number }} bounds
+     * @returns {boolean}
+     */
+    static #pointOverlapsBounds(point, bounds) {
+        return (
+            point.x >=
+                bounds.minX -
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            point.x <=
+                bounds.maxX +
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            point.y >=
+                bounds.minY -
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON &&
+            point.y <=
+                bounds.maxY + PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON
+        )
+    }
+
     /**
      * Returns true when a point lies inside a cutout and away from its border.
      * @param {{ x: number, y: number }} point
-     * @param {{ points: { x: number, y: number }[], bounds: { minX: number, maxX: number, minY: number, maxY: number } }} cutout
+     * @param {{ points: { x: number, y: number }[], bounds: { minX: number, maxX: number, minY: number, maxY: number }, isCircular?: boolean, centerX?: number, centerY?: number, radius?: number }} cutout
      * @returns {boolean}
      */
     static #isPointStrictlyInsideCutout(point, cutout) {
+        if (cutout.isCircular) {
+            const radius = Math.max(
+                0,
+                Number(cutout.radius || 0) -
+                    PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON
+            )
+            return (
+                PcbScene3dCutoutCircleDetector.distanceSquared(point, cutout) <
+                radius * radius
+            )
+        }
+
         const polygon = cutout.points
 
         let inside = false
@@ -638,18 +709,33 @@ export class PcbScene3dCutoutGeometryFilter {
     /**
      * Returns true when a point lies on a cutout edge.
      * @param {{ x: number, y: number }} point
-     * @param {{ points: { x: number, y: number }[] }} cutout
+     * @param {{ segments: { start: { x: number, y: number }, end: { x: number, y: number }, bounds: { minX: number, maxX: number, minY: number, maxY: number } }[], isCircular?: boolean, centerX?: number, centerY?: number, radius?: number }} cutout
      * @returns {boolean}
      */
     static #isPointOnCutoutBoundary(point, cutout) {
-        const polygon = cutout.points
+        if (cutout.isCircular) {
+            return (
+                Math.abs(
+                    Math.sqrt(
+                        PcbScene3dCutoutCircleDetector.distanceSquared(
+                            point,
+                            cutout
+                        )
+                    ) - Number(cutout.radius || 0)
+                ) <= PcbScene3dCutoutGeometryFilter.#GEOMETRY_EPSILON
+            )
+        }
 
-        for (let index = 0; index < polygon.length; index += 1) {
+        for (const segment of cutout.segments) {
             if (
+                PcbScene3dCutoutGeometryFilter.#pointOverlapsBounds(
+                    point,
+                    segment.bounds
+                ) &&
                 PcbScene3dCutoutGeometryFilter.#isPointOnSegment(
                     point,
-                    polygon[index],
-                    polygon[(index + 1) % polygon.length]
+                    segment.start,
+                    segment.end
                 )
             ) {
                 return true
@@ -703,9 +789,18 @@ export class PcbScene3dCutoutGeometryFilter {
         ) {
             const triangleStart = triangle[triangleIndex]
             const triangleEnd = triangle[(triangleIndex + 1) % triangle.length]
+            const triangleSegmentBounds =
+                PcbScene3dCutoutGeometryFilter.#resolveSegmentBounds(
+                    triangleStart,
+                    triangleEnd
+                )
 
             for (const segment of cutout.segments) {
                 if (
+                    PcbScene3dCutoutGeometryFilter.#boundsOverlap(
+                        triangleSegmentBounds,
+                        segment.bounds
+                    ) &&
                     PcbScene3dCutoutGeometryFilter.#segmentsIntersect(
                         triangleStart,
                         triangleEnd,
@@ -721,6 +816,21 @@ export class PcbScene3dCutoutGeometryFilter {
         return false
     }
 
+    /**
+     * Resolves one finite segment bounding box.
+     * @param {{ x: number, y: number }} firstStart
+     * @param {{ x: number, y: number }} firstEnd
+     * @returns {{ minX: number, maxX: number, minY: number, maxY: number }}
+     */
+    static #resolveSegmentBounds(firstStart, firstEnd) {
+        return {
+            minX: Math.min(firstStart.x, firstEnd.x),
+            maxX: Math.max(firstStart.x, firstEnd.x),
+            minY: Math.min(firstStart.y, firstEnd.y),
+            maxY: Math.max(firstStart.y, firstEnd.y)
+        }
+    }
+
     /**
      * Returns true when two finite line segments intersect.
      * @param {{ x: number, y: number }} firstStart

package/src/PcbScene3dDetailCoordinateNormalizer.mjs

@@ -4,7 +4,7 @@
 export class PcbScene3dDetailCoordinateNormalizer {
     /**
      * Creates a reusable normalizer for one scene description.
-     * @param {{ board?: { centerX?: number, centerY?: number }, boardAssemblyModel?: any, coordinateSystem?: string, sourceFormat?: string } | null} sceneDescription Scene metadata.
+     * @param {{ board?: { centerX?: number, centerY?: number }, coordinateSystem?: string, sourceFormat?: string } | null} sceneDescription Scene metadata.
      * @returns {(x: number, y: number) => { x: number, y: number }}
      */
     static create(sceneDescription) {
@@ -18,7 +18,7 @@ export class PcbScene3dDetailCoordinateNormalizer {
 
     /**
      * Normalizes one source detail coordinate into centered scene space.
-     * @param {{ board?: { centerX?: number, centerY?: number }, boardAssemblyModel?: any, coordinateSystem?: string, sourceFormat?: string } | null} sceneDescription Scene metadata.
+     * @param {{ board?: { centerX?: number, centerY?: number }, coordinateSystem?: string, sourceFormat?: string } | null} sceneDescription Scene metadata.
      * @param {number} x Source X coordinate.
      * @param {number} y Source Y coordinate.
      * @returns {{ x: number, y: number }}
@@ -32,34 +32,7 @@ export class PcbScene3dDetailCoordinateNormalizer {
 
         return {
             x: sourceX - centerX,
-            y: PcbScene3dDetailCoordinateNormalizer.#usesAssemblyModelPcbY(
-                sceneDescription
-            )
-                ? centerY - sourceY
-                : sourceY - centerY
-        }
-    }
-
-    /**
-     * Checks whether detail primitives are being aligned to an assembly model
-     * that still uses the source PCB Y axis.
-     * @param {{ boardAssemblyModel?: any, coordinateSystem?: string, sourceFormat?: string } | null} sceneDescription Scene metadata.
-     * @returns {boolean}
-     */
-    static #usesAssemblyModelPcbY(sceneDescription) {
-        if (
-            String(sceneDescription?.coordinateSystem || '') === 'kicad-3d-y-up'
-        ) {
-            return false
+            y: sourceY - centerY
         }
-
-        const sourceFormat = String(
-            sceneDescription?.sourceFormat || ''
-        ).toLowerCase()
-
-        return (
-            sourceFormat === 'altium' &&
-            Boolean(sceneDescription?.boardAssemblyModel)
-        )
     }
 }

package/src/PcbScene3dExternalModels.mjs

@@ -1,5 +1,7 @@
 import { PcbScene3dBoardAssemblyPresentation } from './PcbScene3dBoardAssemblyPresentation.mjs'
 import { PcbScene3dBoardAssemblyPlacement } from './PcbScene3dBoardAssemblyPlacement.mjs'
+import { PcbScene3dBoardAssemblyTransform } from './PcbScene3dBoardAssemblyTransform.mjs'
+import { PcbScene3dBufferAttributeFactory } from './PcbScene3dBufferAttributeFactory.mjs'
 import { PcbScene3dExternalModelLoadOrder } from './PcbScene3dExternalModelLoadOrder.mjs'
 import { PcbScene3dMountRig } from './PcbScene3dMountRig.mjs'
 import { PcbScene3dStepLoader } from './PcbScene3dStepLoader.mjs'
@@ -329,7 +331,7 @@ export class PcbScene3dExternalModels {
     /**
      * Wraps a full board assembly model in board-local scene coordinates.
      * @param {any} THREE
-     * @param {{ positionMil?: { x?: number, y?: number, z?: number }, board?: { widthMil?: number, heightMil?: number, thicknessMil?: number } }} placement
+     * @param {{ positionMil?: { x?: number, y?: number, z?: number }, board?: { widthMil?: number, heightMil?: number, thicknessMil?: number }, sourceFrameScale?: { y?: number } }} placement
      * @param {any} modelGroup
      * @returns {any}
      */
@@ -338,6 +340,7 @@ export class PcbScene3dExternalModels {
         const positionMil = placement?.positionMil || {}
 
         PcbScene3dBoardAssemblyPresentation.apply(modelGroup, placement?.board)
+        PcbScene3dBoardAssemblyTransform.apply(modelGroup, placement)
         wrapperGroup.position.set(
             Number(positionMil.x || 0),
             Number(positionMil.y || 0),
@@ -720,14 +723,28 @@ export class PcbScene3dExternalModels {
             const geometry = new THREE.BufferGeometry()
             geometry.setAttribute(
                 'position',
-                new THREE.Float32BufferAttribute(meshPayload.positions, 3)
+                PcbScene3dBufferAttributeFactory.createFloat32(
+                    THREE,
+                    meshPayload.positions,
+                    3
+                )
+            )
+            geometry.setIndex(
+                PcbScene3dBufferAttributeFactory.createUint32(
+                    THREE,
+                    meshPayload.indices,
+                    1
+                )
             )
-            geometry.setIndex(meshPayload.indices)
 
             if (meshPayload.normals.length) {
                 geometry.setAttribute(
                     'normal',
-                    new THREE.Float32BufferAttribute(meshPayload.normals, 3)
+                    PcbScene3dBufferAttributeFactory.createFloat32(
+                        THREE,
+                        meshPayload.normals,
+                        3
+                    )
                 )
             } else {
                 geometry.computeVertexNormals()
@@ -752,7 +769,7 @@ export class PcbScene3dExternalModels {
     /**
      * Measures raw STEP mesh bounds in mil before the group-level unit scale is
      * applied.
-     * @param {{ positions?: number[] }[]} meshPayloads STEP mesh payloads.
+     * @param {{ positions?: ArrayLike<number> }[]} meshPayloads STEP mesh payloads.
      * @returns {{ minX: number, minY: number, minZ: number, maxX: number, maxY: number, maxZ: number, centerX: number, centerY: number, centerZ: number, sizeX: number, sizeY: number, sizeZ: number } | null}
      */
     static #measureSourceBoundsMil(meshPayloads) {
@@ -765,7 +782,9 @@ export class PcbScene3dExternalModels {
 
         ;(Array.isArray(meshPayloads) ? meshPayloads : []).forEach(
             (meshPayload) => {
-                ;(Array.isArray(meshPayload?.positions)
+                ;(PcbScene3dBufferAttributeFactory.isNumberSequence(
+                    meshPayload?.positions
+                )
                     ? meshPayload.positions
                     : []
                 ).forEach((value, index) => {
@@ -817,7 +836,7 @@ export class PcbScene3dExternalModels {
      * when the importer exposes them.
      * @param {any} THREE
      * @param {any} geometry
-     * @param {{ color?: number[] | null, indices?: number[], faceColors?: { first: number, last: number, color: number[] | null }[] }} meshPayload
+     * @param {{ color?: number[] | null, indices?: ArrayLike<number>, faceColors?: { first: number, last: number, color: number[] | null }[] }} meshPayload
      * @returns {any[]}
      */
     static #buildStepMeshMaterials(THREE, geometry, meshPayload) {
@@ -886,14 +905,12 @@ export class PcbScene3dExternalModels {
     /**
      * Applies grouped material ranges for face-colored STEP triangles.
      * @param {any} geometry
-     * @param {number[]} indices
+     * @param {ArrayLike<number>} indices
      * @param {{ first: number, last: number }[]} faceColors
      * @returns {void}
      */
     static #applyFaceColorGroups(geometry, indices, faceColors) {
-        const triangleCount = Math.floor(
-            (Array.isArray(indices) ? indices.length : 0) / 3
-        )
+        const triangleCount = Math.floor(Number(indices?.length || 0) / 3)
         let triangleIndex = 0
         let faceColorIndex = 0
 
@@ -929,15 +946,13 @@ export class PcbScene3dExternalModels {
     /**
      * Returns true when one face-color range overlaps valid triangle indices.
      * @param {{ first?: number, last?: number }} faceColor
-     * @param {number[] | undefined} indices
+     * @param {ArrayLike<number> | undefined} indices
      * @returns {boolean}
      */
     static #isValidFaceColorRange(faceColor, indices) {
         const first = Number(faceColor?.first)
         const last = Number(faceColor?.last)
-        const triangleCount = Math.floor(
-            (Array.isArray(indices) ? indices.length : 0) / 3
-        )
+        const triangleCount = Math.floor(Number(indices?.length || 0) / 3)
 
         return (
             Number.isInteger(first) &&

package/src/PcbScene3dRuntime.mjs

@@ -1,4 +1,5 @@
 import { PcbScene3dBoardSolderMaskFactory } from './PcbScene3dBoardSolderMaskFactory.mjs'
+import { PcbScene3dBodyColor } from './PcbScene3dBodyColor.mjs'
 import { PcbScene3dCameraRig } from './PcbScene3dCameraRig.mjs'
 import { PcbScene3dCircuitJsonAdapter } from './PcbScene3dCircuitJsonAdapter.mjs'
 import { PcbScene3dCopperFactory } from './PcbScene3dCopperFactory.mjs'
@@ -12,7 +13,7 @@ import { PcbScene3dMountRig } from './PcbScene3dMountRig.mjs'
 import { PcbScene3dPresetState } from './PcbScene3dPresetState.mjs'
 import { PcbScene3dRenderGroupVisibility } from './PcbScene3dRenderGroupVisibility.mjs'
 import { PcbScene3dRuntimeBoardMeshes } from './PcbScene3dRuntimeBoardMeshes.mjs'
-import { PcbScene3dSilkscreenFactory } from './PcbScene3dSilkscreenFactory.mjs'
+import { PcbScene3dSilkscreenChunkedFactory } from './PcbScene3dSilkscreenChunkedFactory.mjs'
 import { PcbScene3dTrueTypeTextFactory } from './PcbScene3dTrueTypeTextFactory.mjs'
 import { PcbScene3dSelectionStyler } from './PcbScene3dSelectionStyler.mjs'
 import { PcbScene3dViaFactory } from './PcbScene3dViaFactory.mjs'
@@ -340,6 +341,12 @@ export class PcbScene3dRuntime {
             )
         )
         this.#groups.set('board', boardGroup)
+        PcbScene3dRuntimeBoardMeshes.applyBoardFaceSide(
+            this.#three,
+            boardGroup,
+            this.#presetState.get(),
+            this.#sceneDescription
+        )
         this.#rootGroup.add(boardGroup)
         const silkscreenGroup = new THREE.Group()
         this.#groups.set('silkscreen', silkscreenGroup)
@@ -376,14 +383,18 @@ export class PcbScene3dRuntime {
      * @returns {void}
      */
     #applyViewScale(preset) {
-        if (!this.#viewOrientationGroup) {
-            return
-        }
+        if (!this.#viewOrientationGroup) return
         const scale = PcbScene3dRuntime.resolveViewScale(
             preset,
             this.#sceneDescription
         )
         this.#viewOrientationGroup.scale.set(scale.x, scale.y, scale.z)
+        PcbScene3dRuntimeBoardMeshes.applyBoardFaceSide(
+            this.#three,
+            this.#groups.get('board'),
+            preset,
+            this.#sceneDescription
+        )
         PcbScene3dExternalModels.applyViewCompensation(
             this.#groups.get('silkscreen'),
             scale
@@ -448,22 +459,24 @@ export class PcbScene3dRuntime {
      */
     async #loadDeferredSilkscreen() {
         const silkscreenGroup = this.#groups.get('silkscreen')
-        if (!silkscreenGroup || silkscreenGroup.children.length) {
-            return
-        }
+        if (!silkscreenGroup || silkscreenGroup.children.length) return
 
         await PcbScene3dTrueTypeTextFactory.prepareEmbeddedFonts(
             this.#sceneDescription.detail.embeddedFonts || []
         )
-
-        const detailGroup = PcbScene3dSilkscreenFactory.buildGroup(
+        const detailGroup = await PcbScene3dSilkscreenChunkedFactory.buildGroup(
             this.#three,
             this.#sceneDescription.detail.silkscreen || {},
             this.#sceneDescription.board.thicknessMil / 2 + 1.18,
             -(this.#sceneDescription.board.thicknessMil / 2 + 1.18),
-            (x, y) => this.#normalizeDetailPoint(x, y)
+            (x, y) => this.#normalizeDetailPoint(x, y),
+            {
+                shouldContinue: () => !this.#isDisposed,
+                yieldToMain: () => PcbScene3dRuntime.#yieldToNextFrame()
+            }
         )
 
+        if (this.#isDisposed) return
         if (detailGroup.children.length) {
             silkscreenGroup.add(detailGroup)
             this.#applyViewScale(this.#presetState.get())
@@ -526,7 +539,7 @@ export class PcbScene3dRuntime {
         const family = component.body.family
         const size = component.body.sizeMil
         const material = new THREE.MeshStandardMaterial({
-            color: PcbScene3dRuntime.#resolveBodyColor(family),
+            color: PcbScene3dBodyColor.resolve(family),
             roughness: 0.72,
             metalness: family === 'chip' ? 0.12 : 0.08
         })
@@ -971,26 +984,4 @@ export class PcbScene3dRuntime {
         const dy = Number(end?.y || 0) - Number(start?.y || 0)
         return Math.hypot(dx, dy)
     }
-
-    /**
-     * Resolves a simple body color by package family.
-     * @param {string} family
-     * @returns {number}
-     */
-    static #resolveBodyColor(family) {
-        if (family === 'radial-capacitor') {
-            return 0xa60f10
-        }
-        if (family === 'connector-block') {
-            return 0xd5d6da
-        }
-        if (family === 'test-point') {
-            return 0x0ea5a8
-        }
-        if (family === 'chip') {
-            return 0xf5f5ef
-        }
-
-        return 0x232428
-    }
 }