Merge remote-tracking branch 'origin/main' into fix/fri-8-may

# Conflicts:
#	packages/editor/src/components/tools/fence/move-fence-endpoint-tool.tsx
#	packages/editor/src/components/tools/select/box-select-tool.tsx
#	packages/editor/src/components/tools/wall/move-wall-tool.tsx
#	packages/editor/src/components/ui/panels/column-panel.tsx
#	packages/editor/src/components/ui/panels/door-panel.tsx
#	packages/editor/src/components/ui/panels/window-panel.tsx
#	packages/viewer/src/components/renderers/column/column-renderer.tsx
#	packages/viewer/src/components/viewer/index.tsx
#	packages/viewer/src/systems/slab/slab-system.tsx

packages/viewer/src/components/renderers/door/door-renderer.tsx

@@ -1,6 +1,6 @@
 import { type DoorNode, useRegistry, useScene } from '@pascal-app/core'
 import { useLayoutEffect, useRef } from 'react'
-import { MeshBasicMaterial, type Mesh } from 'three'
+import { type Mesh, MeshBasicMaterial } from 'three'
 import { useNodeEvents } from '../../../hooks/use-node-events'
 
 const doorHitboxMaterial = new MeshBasicMaterial({ visible: false })

packages/viewer/src/components/renderers/fence/fence-renderer.tsx

@@ -2,28 +2,12 @@ import { type FenceNode, useRegistry, useScene } from '@pascal-app/core'
 import { useLayoutEffect, useMemo, useRef } from 'react'
 import type { Mesh } from 'three'
 import { useNodeEvents } from '../../../hooks/use-node-events'
-import {
-  createMaterial,
-  createMaterialFromPresetRef,
-  DEFAULT_STAIR_MATERIAL,
-} from '../../../lib/materials'
+import { DEFAULT_STAIR_MATERIAL } from '../../../lib/materials'
 
 export const FenceRenderer = ({ node }: { node: FenceNode }) => {
   const ref = useRef<Mesh>(null!)
   const handlers = useNodeEvents(node, 'fence')
-  const material = useMemo(() => {
-    const presetMaterial = createMaterialFromPresetRef(node.materialPreset)
-    if (presetMaterial) return presetMaterial
-    const mat = node.material
-    if (!mat) return DEFAULT_STAIR_MATERIAL
-    return createMaterial(mat)
-  }, [
-    node.materialPreset,
-    node.material,
-    node.material?.preset,
-    node.material?.properties,
-    node.material?.texture,
-  ])
+  const material = useMemo(() => DEFAULT_STAIR_MATERIAL, [])
 
   useRegistry(node.id, 'fence', ref)
   useLayoutEffect(() => {

packages/viewer/src/components/renderers/slab/slab-renderer.tsx

@@ -1,5 +1,5 @@
 import { getMaterialPresetByRef, type SlabNode, useRegistry } from '@pascal-app/core'
-import { useMemo, useRef } from 'react'
+import { useEffect, useMemo, useRef } from 'react'
 import type { Mesh } from 'three'
 import * as THREE from 'three'
 import { useNodeEvents } from '../../../hooks/use-node-events'

packages/viewer/src/components/renderers/stair-segment/stair-segment-renderer.tsx

@@ -24,10 +24,27 @@ export const StairSegmentRenderer = ({ node }: { node: StairSegmentNode }) => {
   const parentNode = node.parentId
     ? (nodes[node.parentId as AnyNodeId] as StairNode | undefined)
     : undefined
-  const material = useMemo(
-    () => getStraightStairSegmentBodyMaterials(node, parentNode),
-    [node, parentNode],
-  )
+
+  const material = useMemo(() => {
+    return getStraightStairSegmentBodyMaterials(node, parentNode)
+  }, [
+    node.materialPreset,
+    node.material,
+    node.material?.preset,
+    node.material?.properties,
+    node.material?.texture,
+    parentNode?.materialPreset,
+    parentNode?.material,
+    parentNode?.material?.preset,
+    parentNode?.material?.properties,
+    parentNode?.material?.texture,
+    parentNode?.railingMaterialPreset,
+    parentNode?.railingMaterial,
+    parentNode?.sideMaterialPreset,
+    parentNode?.sideMaterial,
+    parentNode?.treadMaterialPreset,
+    parentNode?.treadMaterial,
+  ])
 
   const placeholderGeometry = useMemo(() => {
     const geometry = new THREE.BufferGeometry()

packages/viewer/src/components/renderers/stair/stair-renderer.tsx

@@ -112,9 +112,9 @@ export const StairRenderer = ({ node }: { node: StairNode }) => {
           receiveShadow
         />
       ) : null}
-      {!isSegmentBasedStair ? (
+      {isSegmentBasedStair ? null : (
         <CurvedStairBody bodyMaterials={straightBodyMaterials} stair={node} />
-      ) : null}
+      )}
       <StairRailings material={railingMaterial} stair={node} />
       {isSegmentBasedStair ? (
         <group name="segments-wrapper" visible={false}>
@@ -292,7 +292,7 @@ function StairRailings({ stair, material }: { stair: StairNode; material: THREE.
       ))}
       {railPaths.slice(1).map((segmentPath, index) => {
         const previousPath = railPaths[index]
-        if (!previousPath || !segmentPath.connectFromPrevious) return null
+        if (!(previousPath && segmentPath.connectFromPrevious)) return null
         if (previousPath.layout.segment.segmentType === 'landing') return null
         if (segmentPath.layout.segment.segmentType === 'landing') return null
 
@@ -451,10 +451,10 @@ function CurvedStairBody({
       {isSpiral && (stair.showCenterColumn ?? true) ? (
         <mesh
           castShadow
-          receiveShadow
           material={sideMaterial}
           name="stair-side"
           position={[0, spiralColumnHeight / 2, 0]}
+          receiveShadow
         >
           <cylinderGeometry
             args={[spiralColumnRadius, spiralColumnRadius, spiralColumnHeight, 10]}