feat: backport monorepo PRs #297, #302, #306 — floorplan thumbnails + mobile editor UI

Port floorplan item thumbnails, full mobile editor UI, and
mobile polish from the private monorepo into the public editor.

Monorepo PR #297 (feat/item-admin-advanced):
- Add optional floorPlanUrl to item asset schema (core)
- Render 2D floor-plan images inside item footprints on floorplan
- Improve slider drag with modifier key re-anchoring

Monorepo PR #302 (feat/mobile-ui):
- Mobile editor layout with draggable bottom sheet
- Mobile tab bar, selection bar, and panel sheet
- Mobile-aware panel manager and panel wrapper
- useIsMobile rewrite (useSyncExternalStore, SSR-safe)
- Camera actions hideOrbit prop
- GridSnapControl and SecondaryToggles exports
- Action menu hides on mobile contextual tabs
- SidebarTab extended with mobileDefaultSnap/mobileIcon

Monorepo PR #306 (feat/mobile-ui-polish):
- Touch gesture mapping for camera controls (one/two/three finger)
- Snap ratio constants for bottom sheet
- Thumbnail generator WebGL2 fallback (bottom-up row flip)
- ErrorBoundary scope logging, viewer scene wrap
- GPUDeviceWatcher enhanced logging and uncaptured error handler
- WebGPURenderer init error handling and diagnostics
- Post-processing log improvements
- MergedOutlineNode WebGL2 FBO corruption fix

Excluded: apps/community/*, apps/editor/*, packages/community-*,
.cursor/*, .env.example (monorepo-only files)

Co-authored-by: Pascal <open@pascal.app>

packages/viewer/src/components/viewer/index.tsx

@@ -23,6 +23,7 @@ import { LevelSystem } from '../../systems/level/level-system'
 import { ScanSystem } from '../../systems/scan/scan-system'
 import { WallCutout } from '../../systems/wall/wall-cutout'
 import { ZoneSystem } from '../../systems/zone/zone-system'
+import { ErrorBoundary } from '../error-boundary'
 import { SceneRenderer } from '../renderers/scene-renderer'
 import FrameLimiter from './frame-limiter'
 import { Lights } from './lights'
@@ -78,6 +79,10 @@ type WebGPUDeviceLossInfo = {
 
 type WebGPUDeviceLike = {
   lost: Promise<WebGPUDeviceLossInfo>
+  label?: string
+  features?: Set<string>
+  addEventListener?: (type: string, listener: EventListener) => void
+  removeEventListener?: (type: string, listener: EventListener) => void
 }
 
 function GPUDeviceWatcher() {
@@ -87,7 +92,18 @@ function GPUDeviceWatcher() {
     const backend = (gl as any).backend
     const device = backend?.device as WebGPUDeviceLike | undefined
 
-    if (!device) return
+    if (!device) {
+      console.warn('[viewer] No WebGPU device on backend — running on a fallback renderer.', {
+        backend: backend?.constructor?.name ?? 'unknown',
+        rendererType: (gl as any).constructor?.name ?? 'unknown',
+      })
+      return
+    }
+
+    console.log('[viewer] WebGPU device ready', {
+      label: device.label,
+      features: device.features ? Array.from(device.features) : [],
+    })
 
     device.lost.then((info: WebGPUDeviceLossInfo) => {
       console.error(
@@ -95,6 +111,17 @@ function GPUDeviceWatcher() {
           'The page must be reloaded to recover the GPU context.',
       )
     })
+
+    // Uncaptured errors are normally silent (only console-warned by Chrome at
+    // best). Pipe them to console.error so silent mobile crashes show up.
+    const onUncapturedError = (event: any) => {
+      console.error('[viewer] WebGPU uncaptured error:', event?.error?.message, event?.error)
+    }
+    device.addEventListener?.('uncapturederror', onUncapturedError)
+
+    return () => {
+      device.removeEventListener?.('uncapturederror', onUncapturedError)
+    }
   }, [gl])
 
   return null
@@ -121,17 +148,34 @@ const Viewer: React.FC<ViewerProps> = ({
       dpr={[1, 1.5]}
       frameloop="never"
       gl={async (props) => {
-        const renderer = new THREE.WebGPURenderer(props as any)
-        renderer.toneMapping = THREE.ACESFilmicToneMapping
-        renderer.toneMappingExposure = 0.9
-        // Awaiting init() is required when the browser falls back to the
-        // WebGL2 backend (Safari without the WebGPU flag, older Chrome on
-        // machines without a WebGPU device). In native WebGPU mode the
-        // init resolves almost instantly. Without this await, the first
-        // render throws "Renderer: .render() called before the backend is
-        // initialized" from the post-processing fallback path.
-        await renderer.init()
-        return renderer
+        try {
+          // Surface the env we're about to ask WebGPU for — catches "no
+          // navigator.gpu" / "adapter request failed" silently failing in
+          // mobile WebViews where WebGPU is gated behind flags.
+          const hasGpu = typeof navigator !== 'undefined' && 'gpu' in navigator
+          console.log('[viewer] Creating WebGPURenderer', {
+            hasNavigatorGPU: hasGpu,
+            ua: typeof navigator !== 'undefined' ? navigator.userAgent : 'n/a',
+          })
+          const renderer = new THREE.WebGPURenderer(props as any)
+          renderer.toneMapping = THREE.ACESFilmicToneMapping
+          renderer.toneMappingExposure = 0.9
+          // Awaiting init() is required when the browser falls back to the
+          // WebGL2 backend (Safari without the WebGPU flag, older Chrome on
+          // machines without a WebGPU device). In native WebGPU mode the
+          // init resolves almost instantly. Without this await, the first
+          // render throws "Renderer: .render() called before the backend is
+          // initialized" from the post-processing fallback path.
+          await renderer.init()
+          console.log('[viewer] WebGPURenderer ready', {
+            backend: (renderer as any).backend?.constructor?.name,
+            isWebGPU: (renderer as any).isWebGPURenderer === true,
+          })
+          return renderer
+        } catch (err) {
+          console.error('[viewer] WebGPURenderer init failed', err)
+          throw err
+        }
       }}
       resize={{
         debounce: 100,
@@ -144,39 +188,41 @@ const Viewer: React.FC<ViewerProps> = ({
       <FrameLimiter fps={50} />
       {/* <AnimatedBackground isDark={theme === 'dark'} /> */}
       <ViewerCamera />
-
-      {/* <directionalLight position={[10, 10, 5]} intensity={0.5} castShadow
-        /> */}
-      <Lights />
-      <Bvh>
-        <SceneRenderer />
-      </Bvh>
-
-      {/* Default Systems */}
-      <LevelSystem />
-      <GuideSystem />
-      <ScanSystem />
-      <WallCutout />
-      {/* Core systems */}
-      <CeilingSystem />
-      <DoorSystem />
-      <FenceSystem />
-      <ItemSystem />
-      <RoofSystem />
-      <SlabSystem />
-      <StairSystem />
-      <WallSystem />
-      <WindowSystem />
-      <ZoneSystem />
-      <PostProcessing hoverStyles={hoverStyles} />
-      {/* <DebugRenderer /> */}
       <GPUDeviceWatcher />
 
-      <ItemLightSystem />
-      <ItemMeshMetadataSystem />
-      {selectionManager === 'default' && <SelectionManager />}
-      {perf && <PerfMonitor />}
-      {children}
+      <ErrorBoundary fallback={null} scope="viewer-scene">
+        {/* <directionalLight position={[10, 10, 5]} intensity={0.5} castShadow
+          /> */}
+        <Lights />
+        <Bvh>
+          <SceneRenderer />
+        </Bvh>
+
+        {/* Default Systems */}
+        <LevelSystem />
+        <GuideSystem />
+        <ScanSystem />
+        <WallCutout />
+        {/* Core systems */}
+        <CeilingSystem />
+        <DoorSystem />
+        <FenceSystem />
+        <ItemSystem />
+        <RoofSystem />
+        <SlabSystem />
+        <StairSystem />
+        <WallSystem />
+        <WindowSystem />
+        <ZoneSystem />
+        <PostProcessing hoverStyles={hoverStyles} />
+        {/* <DebugRenderer /> */}
+
+        <ItemLightSystem />
+        <ItemMeshMetadataSystem />
+        {selectionManager === 'default' && <SelectionManager />}
+        {perf && <PerfMonitor />}
+        {children}
+      </ErrorBoundary>
     </Canvas>
   )
 }