@corensystem/coren-ui 1.0.0-next.20260924.75108.887a9c2

package/dist/footprint-viewer.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"footprint-viewer.mjs","names":[],"sources":["../src/footprint-viewer.ts"],"sourcesContent":["// Headless projected-footprints-on-reality-mesh viewer (no built-in UI). Streams the DroneDeploy reality\n// mesh (Cesium 3D Tiles) and paints every villa's ground footprint straight DOWN onto the mesh surface,\n// coloured by construction progress — a \"progress light from above\". There is NO IFC fragment: 684 villa\n// outline polygons (~180 KB `footprints.json`) are rasterised into one canvas texture and projected onto the\n// tiles in world space via an onBeforeCompile shader; recolouring is a single texture redraw.\n//\n// Identity is the villa code `${model}-${roshnPlotNumber}` (e.g. \"VL6-1901\"); every hover/select callback\n// returns it, and `getVillaRecord(code)` returns its zone/batch/progress. Adapted from the\n// embed-projected-footprints handoff reference; the DOM panel/tooltip are removed and hover/select are routed\n// through callbacks. A few parity helpers (setMeshVisible / setModelVisible / setModelOpacity /\n// setColourMode / setLabelsVisible / fitVilla) are added so the existing host UI can drive it unchanged.\nimport {TilesRenderer} from \"3d-tiles-renderer\";\nimport * as OBC from \"@thatopen/components\";\nimport * as THREE from \"three\";\nimport {DRACOLoader} from \"three/examples/jsm/loaders/DRACOLoader.js\";\nimport {GLTFLoader} from \"three/examples/jsm/loaders/GLTFLoader.js\";\n\nexport type ColorMode = \"progress\" | \"off\";\n\nexport interface VillaRecord {\n\tcode: string;\n\tzone?: string; // \"1A\" | \"1B\" — from progress JSON (neighbourhood)\n\tbatch?: string; // \"10\"        — from progress JSON (batchNumber)\n\tblock?: string;\n\tactual?: number;\n\tplanned?: number;\n\tvariance?: number;\n\tcolor: string; // milestone hex, or the grey UNASSIGNED fallback\n\tcontractor?: string;\n\tmodel?: string;\n\tplot?: string;\n\tunitType?: string;\n\ttypology?: string;\n}\n\nexport interface FootprintViewerOptions {\n\ttilesetUrl?: string; // default \"/reality-mesh/capture2/mesh_3d/tileset.json\"\n\tdracoPath?: string; // default \"/reality-mesh/draco/gltf/\"\n\tworkerUrl?: string; // default \"/worker.mjs\"\n\tfootprintsUrl?: string; // default \"/footprints.json\"\n\tprogressUrls?: string[]; // default [\"/house-progress.json\", \"/house-progress-IMA.json\"]\n\tmeshOpacity?: number; // default 0.85\n\tprojectionStrength?: number; // default 0.85\n\tcolorMode?: ColorMode; // default \"progress\"\n\ttransparent?: boolean; // clear with alpha 0 so the host can place its own image/backdrop behind the canvas\n\tonReady?: (v: FootprintViewer) => void;\n\tonHover?: (code: string | null) => void; // villa code under the cursor\n\tonSelect?: (code: string | null) => void; // villa code clicked / selected\n\t// Called each frame with how the host's backdrop image should render for the current camera: opacity 1→0\n\t// and blur growing as you zoom in (and fading on tilt/rotate), scale tracking the zoom.\n\tonBackdrop?: (s: {opacity: number; blurPx: number; scale: number}) => void;\n}\n\nexport interface FootprintViewer {\n\tsetMeshOpacity(op: number): void; // 0..1\n\tsetProjectionStrength(s: number): void; // 0..1 — footprint colour blend on the mesh\n\tsetColorMode(mode: ColorMode): void; // \"progress\" paints footprints, \"off\" hides them\n\tsetVillaColours(map: Record<string, string>): void; // villa code -> hex; live recolour\n\tsetVisibleVillas(codes: string[] | null): void; // only these codes paint their footprint; null = all (no filter)\n\tgetVillaCodes(): string[];\n\tgetVillaRecord(code: string): VillaRecord | null; // zone/batch/actual/… by code\n\tselectVilla(code: string | null): void; // programmatic select\n\tgetSelectedVilla(): string | null;\n\tfitAll(): Promise<void>;\n\tfitVilla(code: string): Promise<void>; // frame a single villa (6× its footprint box)\n\tresetView(animate?: boolean): Promise<void>; // return to the canonical open pose (call on opening Reality)\n\tsetView(\n\t\tpose: {elevationDeg?: number; azimuthDeg?: number; zoom?: number; panX?: number; panZ?: number},\n\t\tanimate?: boolean,\n\t): Promise<void>;\n\tgetZoomFactor(): number; // 1 ≈ whole-site fit; higher = more zoomed in (a single villa framing is ≈8–10)\n\tisZoomedIn(): boolean; // true once the camera is meaningfully closer than the default open distance\n\tzoomIn(): void; // dolly the camera closer (toolbar +)\n\tzoomOut(): void; // dolly the camera further (toolbar −)\n\tsetInteractionMode(mode: \"orbit\" | \"pan\"): void; // left-drag = rotate vs pan\n\ttopDownView(): Promise<void>; // straight-down satellite view, fitted to the site\n\tgetCameraPose(): {\n\t\tposition: [number, number, number];\n\t\ttarget: [number, number, number];\n\t\televationDeg: number; // above the horizontal (90 = straight down)\n\t\tazimuthDeg: number;\n\t\tdistance: number;\n\t};\n\t// Parity helpers so a host UI written against the old reality-mesh viewer drives this one unchanged:\n\tsetMeshVisible(v: boolean): void;\n\tsetModelVisible(v: boolean): void; // maps to colour mode (the footprint projection is the \"model\")\n\tsetModelOpacity(op: number): void; // maps to projection strength\n\tsetColourMode(mode: ColorMode | \"material\"): void; // \"material\" is treated as \"off\"\n\tsetLabelsVisible(v: boolean): void; // master toggle for all LOD labels (Zone → Block → Villa by zoom)\n\tonHover?: (code: string | null) => void;\n\tonSelect?: (code: string | null) => void;\n\tdispose(): void;\n}\n\n// --- Fixed alignment (see handoff; do not change unless re-fitting the mesh) ---\nconst SEED = {offX: 512, offY: -560, scale: 3.29, rot: -170, zoff: 26.9};\nconst CENTER = {x: -452.29, z: 1069.75};\nconst FLOOR_Y = 0;\nconst UNASSIGNED = \"#9ca3af\";\n\n// Canonical \"open\" camera pose — the 3/4 oblique the Reality view lands on every time it's opened.\n// elevationDeg = degrees above the horizontal (90 = straight down), azimuthDeg = rotation around +Y,\n// zoom = distance multiplier (1 ≈ frame the whole site). Tune with the dev sliders, then bake final values here.\nexport const OPEN_POSE = {elevationDeg: 42, azimuthDeg: 78, zoom: 0.95, panX: 0.14, panZ: 0.66};\n// Level-of-detail labels keyed on `frac` = camera distance ÷ full-site fit distance (1 ≈ fully zoomed out to\n// the site fit; smaller = more zoomed in). As you zoom IN the labels get finer: Zone → Block → Villa numbers.\n// Zoom% ≈ 100×(1 − frac), so the bands below map to the requested ~20/50/80% hand-offs:\n//   • BLOCK..ZONE (0.50 < frac ≤ 0.80)  → Zone labels  (~20–50% zoom) — one per zone, centred on its villas\n//   • VILLA..BLOCK (0.20 < frac ≤ 0.50) → Block labels (~50–80% zoom) — one per block, centred on its villas\n//   • frac ≤ LABEL_ZOOM_FRAC (0.20)     → per-villa number chips (~80%+ zoom)\n// Lower a threshold to require MORE zoom before that tier appears.\nconst LABEL_ZOOM_FRAC = 0.2;\nconst BLOCK_LABEL_FRAC = 0.5;\nconst ZONE_LABEL_FRAC = 0.8;\n// Plan-image backdrop behaviour as the camera moves (the host applies these to the <img>):\nconst BACKDROP_ZOOM_FADE = 0.3; // fully faded once zoomed in 30% closer than the open distance\nconst BACKDROP_ZOOMOUT_FADE = 0.1; // fully faded once zoomed out 10% further than the open distance\nconst BACKDROP_BASE_BLUR = 4; // px blur at the open pose\nconst BACKDROP_MAX_BLUR = 22; // px blur as the fade completes\nconst BACKDROP_TILT_FADE = 0.05; // fade to 0 once tilt/rotation deviates >5% of its range from the open pose\n\ntype Footprint = {z: string; p: [number, number][]};\ntype ProgressRec = {\n\tcolor?: string;\n\tactual?: number;\n\tplanned?: number;\n\tvariance?: number;\n\tlabel?: string;\n\tzone?: string;\n\tbatch?: string;\n\tblock?: string;\n\tcontractor?: string;\n\tmodel?: string;\n\tplot?: string;\n\tunitType?: string;\n\ttypology?: string;\n};\n\nexport async function createFootprintViewer(\n\tcontainer: HTMLElement,\n\toptions: FootprintViewerOptions = {},\n): Promise<FootprintViewer> {\n\tconst o = {\n\t\ttilesetUrl: \"/reality-mesh/capture2/mesh_3d/tileset.json\",\n\t\tdracoPath: \"/reality-mesh/draco/gltf/\",\n\t\tworkerUrl: \"/worker.mjs\",\n\t\tfootprintsUrl: \"/footprints.json\",\n\t\tprogressUrls: [\"/house-progress.json\", \"/house-progress-IMA.json\"],\n\t\tmeshOpacity: 0.85,\n\t\tprojectionStrength: 0.85,\n\t\tcolorMode: \"progress\" as ColorMode,\n\t\t...options,\n\t};\n\n\tlet meshOp = o.meshOpacity;\n\tlet strength = o.projectionStrength;\n\tlet colorMode: ColorMode = o.colorMode;\n\n\t// --- World (ThatOpen scene/camera/renderer; drives the render loop) --------\n\tconst components = new OBC.Components();\n\tconst world = components.get(OBC.Worlds).create<OBC.SimpleScene, OBC.OrthoPerspectiveCamera, OBC.SimpleRenderer>();\n\tworld.scene = new OBC.SimpleScene(components);\n\tworld.scene.setup();\n\t// Transparent clear lets the host place an image (e.g. the plan backdrop) behind the canvas so it renders\n\t// exactly like the 2D plan image; otherwise a flat dark grey.\n\tworld.scene.three.background = o.transparent ? null : new THREE.Color(\"#1a1d21\");\n\tworld.renderer = new OBC.SimpleRenderer(components, container);\n\t// Hide the ThatOpen logo the renderer injects into the container (a `data-thatopen-*` overlay div).\n\tworld.renderer.showLogo = false;\n\tworld.camera = new OBC.OrthoPerspectiveCamera(components);\n\tawait world.camera.controls.setLookAt(12, 10, 12, 0, 0, 0);\n\tcomponents.init();\n\n\tconst gl = (world.renderer as OBC.SimpleRenderer).three;\n\tgl.setPixelRatio(Math.min(window.devicePixelRatio, 1.5));\n\tif (o.transparent) gl.setClearColor(0x000000, 0); // see-through where nothing renders (host draws the backdrop)\n\n\t// Zoom out over the ~1.8 km site without clipping.\n\tconst FAR = 5_000_000;\n\tconst MAX_DOLLY = 2_000_000;\n\tconst raiseClip = () => {\n\t\tconst cam = world.camera.three as THREE.PerspectiveCamera;\n\t\tif (cam.far !== FAR) {\n\t\t\tcam.far = FAR;\n\t\t\tcam.updateProjectionMatrix();\n\t\t}\n\t\tif (world.camera.controls.maxDistance !== MAX_DOLLY) world.camera.controls.maxDistance = MAX_DOLLY;\n\t};\n\traiseClip();\n\tworld.camera.controls.addEventListener(\"update\", raiseClip);\n\n\t// Fragments worker only drives the render loop (no model is loaded).\n\tconst workerResponse = await fetch(o.workerUrl);\n\tif (!workerResponse.ok) throw new Error(\"Fragments worker (/worker.mjs) not found.\");\n\tconst workerBlob = await workerResponse.blob();\n\tconst workerUrl = URL.createObjectURL(new File([workerBlob], \"worker.mjs\", {type: \"text/javascript\"}));\n\tconst fragments = components.get(OBC.FragmentsManager);\n\tfragments.init(workerUrl);\n\tworld.camera.controls.addEventListener(\"update\", () => fragments.core.update());\n\n\t// --- Footprints + progress (merge Zone A + Zone B into one code->record) ---\n\tconst footRes = await fetch(o.footprintsUrl);\n\tif (!footRes.ok) throw new Error(\"Could not load footprints.json\");\n\tconst footprints = (await footRes.json()) as Record<string, Footprint>;\n\tconst entries = Object.entries(footprints);\n\n\tconst progress = new Map<string, ProgressRec>();\n\tawait Promise.all(\n\t\to.progressUrls.map(async (url) => {\n\t\t\ttry {\n\t\t\t\tconst res = await fetch(url);\n\t\t\t\tif (!res.ok) return;\n\t\t\t\tconst doc = (await res.json()) as {houses: Record<string, ProgressRec>};\n\t\t\t\tfor (const [code, rec] of Object.entries(doc.houses)) progress.set(code, rec);\n\t\t\t} catch {\n\t\t\t\t/* those villas fall back to UNASSIGNED grey */\n\t\t\t}\n\t\t}),\n\t);\n\n\tconst overrideColours = new Map<string, string>();\n\tconst colourFor = (code: string) => overrideColours.get(code) ?? progress.get(code)?.color ?? UNASSIGNED;\n\n\t// --- World XZ bbox of ALL footprints (+ margin) ----------------------------\n\tconst MARGIN = 40;\n\tlet minX = Infinity;\n\tlet minZ = Infinity;\n\tlet maxX = -Infinity;\n\tlet maxZ = -Infinity;\n\tfor (const [, fp] of entries)\n\t\tfor (const [x, z] of fp.p) {\n\t\t\tif (x < minX) minX = x;\n\t\t\tif (x > maxX) maxX = x;\n\t\t\tif (z < minZ) minZ = z;\n\t\t\tif (z > maxZ) maxZ = z;\n\t\t}\n\tminX -= MARGIN;\n\tminZ -= MARGIN;\n\tmaxX += MARGIN;\n\tmaxZ += MARGIN;\n\tconst bw = maxX - minX;\n\tconst bh = maxZ - minZ;\n\n\t// --- Rasterise footprints into an offscreen canvas texture -----------------\n\t// world XZ -> UV: u = (x-minX)/bw, v = (z-minZ)/bh; flipY=false so v=0 is the top canvas row (z=minZ),\n\t// matching the shader's uv.y = (worldZ-minZ)/bh.\n\tconst MAXPX = 2048;\n\tconst cw = bw >= bh ? MAXPX : Math.max(1, Math.round((MAXPX * bw) / bh));\n\tconst ch = bw >= bh ? Math.max(1, Math.round((MAXPX * bh) / bw)) : MAXPX;\n\tconst canvas = document.createElement(\"canvas\");\n\tcanvas.width = cw;\n\tcanvas.height = ch;\n\tconst ctx2d = canvas.getContext(\"2d\");\n\tif (!ctx2d) throw new Error(\"Could not create 2D canvas context.\");\n\n\tconst brighten = (hex: string, amount = 0.45) =>\n\t\t`#${new THREE.Color(hex).lerp(new THREE.Color(1, 1, 1), amount).getHexString()}`;\n\n\tlet hoverCode: string | null = null;\n\tlet selectedCode: string | null = null;\n\t// Search/filter whitelist: when set, only these codes paint their footprint (the rest show bare mesh), so the\n\t// 3D view narrows to the same subset the 2D map + rail show. `null` = no filter (every footprint paints).\n\tlet visibleCodes: Set<string> | null = null;\n\tfunction drawTexture() {\n\t\tctx2d!.clearRect(0, 0, cw, ch);\n\t\tfor (const [code, fp] of entries) {\n\t\t\tif (fp.p.length < 3) continue;\n\t\t\tif (visibleCodes && !visibleCodes.has(code)) continue;\n\t\t\tctx2d!.beginPath();\n\t\t\tfor (let i = 0; i < fp.p.length; i++) {\n\t\t\t\tconst [x, z] = fp.p[i];\n\t\t\t\tconst px = ((x - minX) / bw) * cw;\n\t\t\t\tconst py = ((z - minZ) / bh) * ch;\n\t\t\t\tif (i === 0) ctx2d!.moveTo(px, py);\n\t\t\t\telse ctx2d!.lineTo(px, py);\n\t\t\t}\n\t\t\tctx2d!.closePath();\n\t\t\tconst base = colourFor(code);\n\t\t\tctx2d!.fillStyle = code === hoverCode || code === selectedCode ? brighten(base) : base;\n\t\t\tctx2d!.fill();\n\t\t}\n\t}\n\tdrawTexture();\n\n\tconst texture = new THREE.CanvasTexture(canvas);\n\ttexture.colorSpace = THREE.SRGBColorSpace;\n\ttexture.flipY = false;\n\ttexture.needsUpdate = true;\n\n\tconst projUniforms = {\n\t\tuMin: {value: new THREE.Vector2(minX, minZ)},\n\t\tuSize: {value: new THREE.Vector2(bw, bh)},\n\t\tuTex: {value: texture},\n\t\tuStrength: {value: colorMode === \"off\" ? 0 : strength},\n\t};\n\tconst effectiveStrength = () => (colorMode === \"off\" ? 0 : strength);\n\n\t// Patch a streamed tile material to sample the projection texture from above.\n\tfunction patchMaterial(m: THREE.Material) {\n\t\tconst mm = m as THREE.Material & {userData: {__fpPatched?: boolean}};\n\t\tif (mm.userData.__fpPatched) return;\n\t\tmm.userData.__fpPatched = true;\n\t\tm.onBeforeCompile = (shader) => {\n\t\t\tshader.uniforms.uMin = projUniforms.uMin;\n\t\t\tshader.uniforms.uSize = projUniforms.uSize;\n\t\t\tshader.uniforms.uTex = projUniforms.uTex;\n\t\t\tshader.uniforms.uStrength = projUniforms.uStrength;\n\t\t\tshader.vertexShader = \"varying vec3 vWorldPos;\\n\" + shader.vertexShader;\n\t\t\tshader.vertexShader = shader.vertexShader.replace(\n\t\t\t\t\"#include <begin_vertex>\",\n\t\t\t\t\"#include <begin_vertex>\\n\\tvWorldPos = (modelMatrix * vec4(transformed, 1.0)).xyz;\",\n\t\t\t);\n\t\t\tshader.fragmentShader =\n\t\t\t\t\"uniform vec2 uMin;\\nuniform vec2 uSize;\\nuniform sampler2D uTex;\\nuniform float uStrength;\\nvarying vec3 vWorldPos;\\n\" +\n\t\t\t\tshader.fragmentShader;\n\t\t\tshader.fragmentShader = shader.fragmentShader.replace(\n\t\t\t\t\"#include <dithering_fragment>\",\n\t\t\t\t\"#include <dithering_fragment>\\n\" +\n\t\t\t\t\t\"\\tvec2 fpUv = (vWorldPos.xz - uMin) / uSize;\\n\" +\n\t\t\t\t\t\"\\tif (fpUv.x >= 0.0 && fpUv.x <= 1.0 && fpUv.y >= 0.0 && fpUv.y <= 1.0) {\\n\" +\n\t\t\t\t\t\"\\t\\tvec4 fpCol = texture2D(uTex, fpUv);\\n\" +\n\t\t\t\t\t\"\\t\\tgl_FragColor.rgb = mix(gl_FragColor.rgb, fpCol.rgb, fpCol.a * uStrength);\\n\" +\n\t\t\t\t\t\"\\t}\",\n\t\t\t);\n\t\t};\n\t\tm.needsUpdate = true;\n\t}\n\n\t// --- Point-in-polygon index for hover/click picking ------------------------\n\ttype Indexed = {code: string; poly: [number, number][]; minx: number; maxx: number; minz: number; maxz: number};\n\tconst index: Indexed[] = [];\n\tfor (const [code, fp] of entries) {\n\t\tif (fp.p.length < 3) continue;\n\t\tlet ix = Infinity;\n\t\tlet ax = -Infinity;\n\t\tlet iz = Infinity;\n\t\tlet az = -Infinity;\n\t\tfor (const [x, z] of fp.p) {\n\t\t\tif (x < ix) ix = x;\n\t\t\tif (x > ax) ax = x;\n\t\t\tif (z < iz) iz = z;\n\t\t\tif (z > az) az = z;\n\t\t}\n\t\tindex.push({code, poly: fp.p, minx: ix, maxx: ax, minz: iz, maxz: az});\n\t}\n\tfunction pointInPoly(x: number, z: number, poly: [number, number][]): boolean {\n\t\tlet inside = false;\n\t\tfor (let i = 0, j = poly.length - 1; i < poly.length; j = i++) {\n\t\t\tconst xi = poly[i][0];\n\t\t\tconst zi = poly[i][1];\n\t\t\tconst xj = poly[j][0];\n\t\t\tconst zj = poly[j][1];\n\t\t\tconst hit = zi > z !== zj > z && x < ((xj - xi) * (z - zi)) / (zj - zi) + xi;\n\t\t\tif (hit) inside = !inside;\n\t\t}\n\t\treturn inside;\n\t}\n\tfunction villaAt(x: number, z: number): string | null {\n\t\tfor (const it of index) {\n\t\t\tif (x < it.minx || x > it.maxx || z < it.minz || z > it.maxz) continue;\n\t\t\tif (pointInPoly(x, z, it.poly)) return it.code;\n\t\t}\n\t\treturn null;\n\t}\n\n\t// --- Camera frame on the footprint bbox ------------------------------------\n\tconst fpBox = new THREE.Box3(new THREE.Vector3(minX, FLOOR_Y - 5, minZ), new THREE.Vector3(maxX, FLOOR_Y + 40, maxZ));\n\tasync function fitAll() {\n\t\tawait resetView(true);\n\t}\n\t// Distance that frames the whole site at a given zoom (1 ≈ fit). Derived from the footprint radius + fov;\n\t// NOT from fitToBox — fitToBox reorients a flat, wide box to straight-down, which is the top-down bug.\n\tfunction poseDistance(zoom: number) {\n\t\tconst size = fpBox.getSize(new THREE.Vector3());\n\t\tconst radius = Math.hypot(size.x, size.z) / 2 || 100;\n\t\tconst vfov = (((world.camera.three as THREE.PerspectiveCamera).fov ?? 60) * Math.PI) / 180;\n\t\treturn (radius / Math.tan(vfov / 2)) * zoom;\n\t}\n\t// Place the camera at (elevation, azimuth, distance) around a target and look at it — a pure setLookAt, so\n\t// the angle is exactly what we ask for and stays put (no fitToBox reorientation).\n\tasync function applyPose(target: THREE.Vector3, elevDeg: number, azimDeg: number, dist: number, animate: boolean) {\n\t\tconst elev = (elevDeg * Math.PI) / 180;\n\t\tconst azim = (azimDeg * Math.PI) / 180;\n\t\tconst dir = new THREE.Vector3(Math.cos(elev) * Math.sin(azim), Math.sin(elev), Math.cos(elev) * Math.cos(azim));\n\t\tawait world.camera.controls.setLookAt(\n\t\t\ttarget.x + dir.x * dist,\n\t\t\ttarget.y + dir.y * dist,\n\t\t\ttarget.z + dir.z * dist,\n\t\t\ttarget.x,\n\t\t\ttarget.y,\n\t\t\ttarget.z,\n\t\t\tanimate,\n\t\t);\n\t}\n\t// Current open pose (dev sliders drive this live via setView; resetView returns it to OPEN_POSE).\n\tlet curElev = OPEN_POSE.elevationDeg;\n\tlet curAzim = OPEN_POSE.azimuthDeg;\n\tlet curZoom = OPEN_POSE.zoom;\n\tlet curPanX = OPEN_POSE.panX ?? 0; // -1..1 fraction of the site half-width the target is offset by (X axis)\n\tlet curPanZ = OPEN_POSE.panZ ?? 0; // -1..1 fraction of the site half-depth the target is offset by (Z axis)\n\t// The look-at target = site centre + the pan offset (so the sliders slide the framed point across the site).\n\tfunction poseTarget() {\n\t\tconst c = fpBox.getCenter(new THREE.Vector3());\n\t\tconst s = fpBox.getSize(new THREE.Vector3());\n\t\tc.x += curPanX * (s.x / 2);\n\t\tc.z += curPanZ * (s.z / 2);\n\t\treturn c;\n\t}\n\tasync function resetView(animate = true) {\n\t\tcurElev = OPEN_POSE.elevationDeg;\n\t\tcurAzim = OPEN_POSE.azimuthDeg;\n\t\tcurZoom = OPEN_POSE.zoom;\n\t\tcurPanX = OPEN_POSE.panX ?? 0;\n\t\tcurPanZ = OPEN_POSE.panZ ?? 0;\n\t\tawait applyPose(poseTarget(), curElev, curAzim, poseDistance(curZoom), animate);\n\t}\n\tasync function setView(\n\t\tpose: {elevationDeg?: number; azimuthDeg?: number; zoom?: number; panX?: number; panZ?: number},\n\t\tanimate = false,\n\t) {\n\t\tif (pose.elevationDeg != null) curElev = pose.elevationDeg;\n\t\tif (pose.azimuthDeg != null) curAzim = pose.azimuthDeg;\n\t\tif (pose.zoom != null) curZoom = pose.zoom;\n\t\tif (pose.panX != null) curPanX = pose.panX;\n\t\tif (pose.panZ != null) curPanZ = pose.panZ;\n\t\tawait applyPose(poseTarget(), curElev, curAzim, poseDistance(curZoom), animate);\n\t}\n\tawait resetView(false);\n\n\t// --- Reality mesh (DroneDeploy 3D Tiles, ECEF) -----------------------------\n\tconst satGroup = new THREE.Group();\n\tconst enuGroup = new THREE.Group();\n\tsatGroup.add(enuGroup);\n\tworld.scene.three.add(satGroup);\n\n\tconst tiles = new TilesRenderer(o.tilesetUrl);\n\ttiles.errorTarget = 16;\n\ttiles.maxDepth = 7;\n\ttiles.lruCache.maxSize = 200;\n\ttiles.lruCache.minSize = 100;\n\ttiles.lruCache.maxBytesSize = 0.2 * 2 ** 30;\n\ttiles.lruCache.unloadPercent = 0.25;\n\tconst draco = new DRACOLoader(tiles.manager);\n\tdraco.setDecoderPath(o.dracoPath);\n\tconst gltfLoader = new GLTFLoader(tiles.manager);\n\tgltfLoader.setDRACOLoader(draco);\n\ttiles.manager.addHandler(/\\.(gltf|glb)$/i, gltfLoader);\n\ttiles.setCamera(world.camera.three);\n\ttiles.setResolutionFromRenderer(world.camera.three, gl);\n\tenuGroup.add(tiles.group);\n\n\tfunction styleTile(root: THREE.Object3D) {\n\t\troot.traverse((n) => {\n\t\t\tconst mesh = n as THREE.Mesh;\n\t\t\tif (!mesh.isMesh) return;\n\t\t\tconst mats = Array.isArray(mesh.material) ? mesh.material : [mesh.material];\n\t\t\tfor (const m of mats) {\n\t\t\t\tif (!m) continue;\n\t\t\t\tm.transparent = meshOp < 1;\n\t\t\t\t(m as THREE.Material & {opacity: number}).opacity = meshOp;\n\t\t\t\tm.depthWrite = meshOp >= 1;\n\t\t\t\tpatchMaterial(m);\n\t\t\t\tm.needsUpdate = true;\n\t\t\t}\n\t\t});\n\t}\n\ttiles.addEventListener(\"load-model\", (e: {scene?: THREE.Object3D}) => {\n\t\tif (e.scene) styleTile(e.scene);\n\t\tfragments.core.update();\n\t});\n\n\tfunction applyMeshPlacement() {\n\t\tsatGroup.position.set(CENTER.x + SEED.offX, FLOOR_Y - 0.05 + SEED.zoff, CENTER.z - SEED.offY);\n\t\tsatGroup.scale.setScalar(SEED.scale);\n\t\tsatGroup.rotation.y = (SEED.rot * Math.PI) / 180;\n\t\ttiles.group.traverse((n) => styleTile(n));\n\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\tfragments.core.update();\n\t}\n\n\tlet framed = false;\n\ttiles.addEventListener(\"load-tile-set\", () => {\n\t\tconst sphere = new THREE.Sphere();\n\t\tif (framed || !tiles.getBoundingSphere(sphere)) return;\n\t\tframed = true;\n\t\ttiles.group.position.copy(sphere.center).multiplyScalar(-1); // ECEF -> origin\n\t\tenuGroup.quaternion.setFromUnitVectors(sphere.center.clone().normalize(), new THREE.Vector3(0, 1, 0));\n\t\tapplyMeshPlacement();\n\t\t// Frame the selected villa if one was carried in (e.g. Plan → Reality); otherwise the canonical open pose.\n\t\t// (Without this, a villa selected before the mesh finished streaming would get yanked back to the overview.)\n\t\tif (selectedCode) void api.fitVilla(selectedCode);\n\t\telse void resetView();\n\t\tapi.onReady_?.();\n\t});\n\tworld.renderer.onBeforeUpdate.add(() => {\n\t\ttiles.setResolutionFromRenderer(world.camera.three, gl);\n\t\ttiles.update();\n\t});\n\n\t// --- Pointer: raycast the mesh -> point-in-polygon -> villa code -----------\n\tconst raycaster = new THREE.Raycaster();\n\traycaster.far = FAR;\n\tconst ndc = new THREE.Vector2();\n\n\tfunction codeAtClient(clientX: number, clientY: number): string | null {\n\t\tconst rect = gl.domElement.getBoundingClientRect();\n\t\tndc.x = ((clientX - rect.left) / rect.width) * 2 - 1;\n\t\tndc.y = -((clientY - rect.top) / rect.height) * 2 + 1;\n\t\traycaster.setFromCamera(ndc, world.camera.three);\n\t\tconst hits = raycaster.intersectObject(tiles.group, true);\n\t\tconst pt = hits.length ? hits[0].point : null;\n\t\treturn pt ? villaAt(pt.x, pt.z) : null;\n\t}\n\n\tfunction setHover(code: string | null) {\n\t\tif (code === hoverCode) return;\n\t\thoverCode = code;\n\t\tdrawTexture();\n\t\ttexture.needsUpdate = true;\n\t\tfragments.core.update();\n\t\tapi.onHover?.(code);\n\t}\n\n\tlet hoverClient: {x: number; y: number} | null = null;\n\tlet hoverRAF = 0;\n\tconst onMove = (ev: MouseEvent) => {\n\t\thoverClient = {x: ev.clientX, y: ev.clientY};\n\t\tif (!hoverRAF)\n\t\t\thoverRAF = requestAnimationFrame(() => {\n\t\t\t\thoverRAF = 0;\n\t\t\t\tif (!hoverClient) return;\n\t\t\t\tsetHover(codeAtClient(hoverClient.x, hoverClient.y));\n\t\t\t});\n\t};\n\tconst onLeave = () => {\n\t\thoverClient = null;\n\t\tsetHover(null);\n\t};\n\tconst onClick = (ev: MouseEvent) => {\n\t\tapi.selectVilla(codeAtClient(ev.clientX, ev.clientY));\n\t};\n\tcontainer.addEventListener(\"mousemove\", onMove);\n\tcontainer.addEventListener(\"mouseleave\", onLeave);\n\tcontainer.addEventListener(\"click\", onClick);\n\n\t// --- Villa-number labels (HTML chips over each footprint, matching the 2D chips) -----------------------\n\t// pointer-events:none so they never block orbit/hover/click. Each chip sits over its footprint centroid,\n\t// black by default and white when its villa is selected. These are the FINEST LOD tier — shown only once\n\t// zoomed in past LABEL_ZOOM_FRAC (coarser Zone/Block group labels take over further out; see below).\n\tlet labelsVisible = true;\n\tconst LABEL_Y = FLOOR_Y - 0.05 + SEED.zoff; // ≈ the mesh surface level, so chips sit on the villas\n\tconst styleLabel = (el: HTMLDivElement, light: boolean) => {\n\t\tel.style.background = light ? \"#ffffff\" : \"#000000\";\n\t\tel.style.color = light ? \"#111827\" : \"#ffffff\";\n\t};\n\t// The one chip look — reused by villa numbers AND the Zone/Block group labels so every tier is identical.\n\tconst CHIP_CSS =\n\t\t\"padding:2px 6px;border-radius:5px;font:600 12px/1 ui-sans-serif,system-ui,-apple-system,sans-serif;\" +\n\t\t\"white-space:nowrap;box-shadow:0 1px 3px rgba(0,0,0,.35)\";\n\tconst makeChip = (text: string) => {\n\t\tconst el = document.createElement(\"div\");\n\t\tel.style.cssText = \"position:absolute;left:0;top:0;visibility:hidden;pointer-events:none;will-change:transform\";\n\t\tconst inner = document.createElement(\"div\");\n\t\tinner.textContent = text;\n\t\tinner.style.cssText = CHIP_CSS;\n\t\tstyleLabel(inner, false);\n\t\tel.appendChild(inner);\n\t\treturn {el, inner};\n\t};\n\tconst labelEls = index.map((it) => {\n\t\tconst {el, inner} = makeChip(it.code.split(\"-\").pop() ?? it.code); // plot number only, like the 2D chips\n\t\treturn {\n\t\t\tcode: it.code,\n\t\t\tel,\n\t\t\tinner,\n\t\t\tcenter: new THREE.Vector3((it.minx + it.maxx) / 2, LABEL_Y, (it.minz + it.maxz) / 2),\n\t\t};\n\t});\n\tconst labelLayer = document.createElement(\"div\");\n\tlabelLayer.style.cssText = \"position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:2\";\n\tfor (const L of labelEls) labelLayer.appendChild(L.el);\n\tcontainer.appendChild(labelLayer);\n\tconst restyleLabels = () => {\n\t\tfor (const L of labelEls) styleLabel(L.inner, L.code === selectedCode);\n\t};\n\n\t// --- Grouping labels (Zone / Block) — one centred chip per group, shown at coarser zooms (see LABEL_FRACs).\n\t// Each chip sits at the centroid (mean footprint centre) of every villa in that group, resolved from the\n\t// progress records' zone/block fields (block numbering is global: Zone 1-A 01–28, Zone 1-B 29–68).\n\ttype GroupLabel = {el: HTMLDivElement; center: THREE.Vector3};\n\tconst makeGroupLabels = (keyOf: (rec: ProgressRec) => {key: string; text: string} | null): GroupLabel[] => {\n\t\tconst groups = new Map<string, {text: string; sx: number; sz: number; n: number}>();\n\t\tfor (const it of index) {\n\t\t\tconst rec = progress.get(it.code);\n\t\t\tconst info = rec ? keyOf(rec) : null;\n\t\t\tif (!info) continue;\n\t\t\tconst cx = (it.minx + it.maxx) / 2;\n\t\t\tconst cz = (it.minz + it.maxz) / 2;\n\t\t\tconst g = groups.get(info.key) ?? {text: info.text, sx: 0, sz: 0, n: 0};\n\t\t\tg.sx += cx;\n\t\t\tg.sz += cz;\n\t\t\tg.n += 1;\n\t\t\tgroups.set(info.key, g);\n\t\t}\n\t\treturn [...groups.values()].map((g) => {\n\t\t\tconst {el} = makeChip(g.text); // identical style to the villa number chips\n\t\t\tlabelLayer.appendChild(el);\n\t\t\treturn {el, center: new THREE.Vector3(g.sx / g.n, LABEL_Y, g.sz / g.n)};\n\t\t});\n\t};\n\tconst zoneLabels = makeGroupLabels((rec) =>\n\t\trec.zone ? {key: rec.zone, text: `Zone 1 - ${rec.zone.slice(1)}`} : null,\n\t);\n\tconst blockLabels = makeGroupLabels((rec) =>\n\t\trec.block ? {key: `${rec.zone}-${rec.block}`, text: `Block-${String(rec.block).padStart(2, \"0\")}`} : null,\n\t);\n\n\tconst _labelTarget = new THREE.Vector3();\n\tconst _proj = new THREE.Vector3();\n\tconst placeLabel = (L: GroupLabel, show: boolean, cam: THREE.Camera, wpx: number, hpx: number) => {\n\t\tif (show) {\n\t\t\t_proj.copy(L.center).project(cam);\n\t\t\tshow = _proj.z > -1 && _proj.z < 1 && Math.abs(_proj.x) < 1.15 && Math.abs(_proj.y) < 1.15;\n\t\t}\n\t\tif (!show) {\n\t\t\tif (L.el.style.visibility !== \"hidden\") L.el.style.visibility = \"hidden\";\n\t\t\treturn;\n\t\t}\n\t\tL.el.style.visibility = \"visible\";\n\t\tL.el.style.transform = `translate(-50%,-50%) translate(${(_proj.x * 0.5 + 0.5) * wpx}px,${(-_proj.y * 0.5 + 0.5) * hpx}px)`;\n\t};\n\tfunction updateLabels() {\n\t\tconst wpx = container.clientWidth;\n\t\tconst hpx = container.clientHeight;\n\t\tconst cam = world.camera.three;\n\t\tconst target = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t_labelTarget,\n\t\t);\n\t\t// frac = camera distance as a fraction of the full-site fit distance → picks the LOD tier.\n\t\tconst frac = cam.position.distanceTo(target) / poseDistance(1);\n\t\tconst showVilla = labelsVisible && frac <= LABEL_ZOOM_FRAC;\n\t\tconst showBlock = labelsVisible && frac > LABEL_ZOOM_FRAC && frac <= BLOCK_LABEL_FRAC;\n\t\tconst showZone = labelsVisible && frac > BLOCK_LABEL_FRAC && frac <= ZONE_LABEL_FRAC;\n\t\tfor (const L of labelEls) placeLabel(L, showVilla, cam, wpx, hpx);\n\t\tfor (const L of blockLabels) placeLabel(L, showBlock, cam, wpx, hpx);\n\t\tfor (const L of zoneLabels) placeLabel(L, showZone, cam, wpx, hpx);\n\t}\n\tworld.renderer.onBeforeUpdate.add(updateLabels);\n\n\t// --- Plan-image backdrop reaction (opacity / blur / scale from the camera each frame) ------------------\n\t// 0% zoom (the open distance) → opacity 1, base blur; by BACKDROP_ZOOM_FADE (30%) closer → opacity 0, max\n\t// blur; scale tracks the zoom (grows as you dolly in) so the backdrop moves with the model. Tilting or\n\t// rotating away from the open pose past BACKDROP_TILT_FADE (5% of range) fades it to 0 (a flat image only\n\t// reads right from the open angle). The host applies {opacity, blurPx, scale} to its <img>.\n\tconst D0 = poseDistance(OPEN_POSE.zoom); // the \"0% zoom\" reference distance (open pose)\n\tconst _bdTarget = new THREE.Vector3();\n\tfunction updateBackdrop() {\n\t\tif (!options.onBackdrop) return;\n\t\tconst target = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t_bdTarget,\n\t\t);\n\t\tconst cam = world.camera.three;\n\t\tconst dx = cam.position.x - target.x;\n\t\tconst dy = cam.position.y - target.y;\n\t\tconst dz = cam.position.z - target.z;\n\t\tconst dist = Math.hypot(dx, dy, dz) || D0;\n\t\t// Fade progress (0 at the open distance → 1 fully faded): zoom IN over 30% closer, or zoom OUT over 10%\n\t\t// further. Blur grows and the backdrop scales with the zoom in both directions.\n\t\tconst zoomInFrac = (D0 - dist) / D0; // + = zoomed in, − = zoomed out\n\t\tconst p =\n\t\t\tzoomInFrac >= 0 ? Math.min(1, zoomInFrac / BACKDROP_ZOOM_FADE) : Math.min(1, -zoomInFrac / BACKDROP_ZOOMOUT_FADE);\n\t\t// orientation deviation from the open pose (as a fraction of each control's range)\n\t\tconst elevationDeg = (Math.atan2(dy, Math.hypot(dx, dz)) * 180) / Math.PI;\n\t\tconst azimuthDeg = (Math.atan2(dx, dz) * 180) / Math.PI;\n\t\tlet azDev = Math.abs(azimuthDeg - OPEN_POSE.azimuthDeg) % 360;\n\t\tif (azDev > 180) azDev = 360 - azDev;\n\t\tconst dev = Math.max(azDev / 360, Math.abs(elevationDeg - OPEN_POSE.elevationDeg) / 84);\n\t\tconst orientOpacity = 1 - Math.min(1, Math.max(0, (dev - BACKDROP_TILT_FADE) / BACKDROP_TILT_FADE));\n\t\toptions.onBackdrop({\n\t\t\topacity: (1 - p) * orientOpacity,\n\t\t\tblurPx: BACKDROP_BASE_BLUR + p * (BACKDROP_MAX_BLUR - BACKDROP_BASE_BLUR),\n\t\t\tscale: Math.min(3, Math.max(0.3, D0 / dist)), // zoom the backdrop with the model (in AND out)\n\t\t});\n\t}\n\tworld.renderer.onBeforeUpdate.add(updateBackdrop);\n\n\t// --- Public API ------------------------------------------------------------\n\tconst api: FootprintViewer & {onReady_?: () => void} = {\n\t\tsetMeshOpacity(op) {\n\t\t\tmeshOp = op;\n\t\t\ttiles.group.traverse((n) => styleTile(n));\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetProjectionStrength(s) {\n\t\t\tstrength = s;\n\t\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetColorMode(mode) {\n\t\t\tcolorMode = mode;\n\t\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetVillaColours(map) {\n\t\t\tfor (const [code, hex] of Object.entries(map)) overrideColours.set(code, hex);\n\t\t\tdrawTexture();\n\t\t\ttexture.needsUpdate = true;\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetVisibleVillas(codes) {\n\t\t\tvisibleCodes = codes ? new Set(codes) : null;\n\t\t\tdrawTexture();\n\t\t\ttexture.needsUpdate = true;\n\t\t\tfragments.core.update();\n\t\t},\n\t\tgetVillaCodes() {\n\t\t\treturn entries.map(([code]) => code);\n\t\t},\n\t\tgetVillaRecord(code) {\n\t\t\tif (!footprints[code]) return null;\n\t\t\tconst rec = progress.get(code);\n\t\t\treturn {\n\t\t\t\tcode,\n\t\t\t\tzone: rec?.zone,\n\t\t\t\tbatch: rec?.batch,\n\t\t\t\tblock: rec?.block,\n\t\t\t\tactual: rec?.actual,\n\t\t\t\tplanned: rec?.planned,\n\t\t\t\tvariance: rec?.variance,\n\t\t\t\tcolor: colourFor(code),\n\t\t\t\tcontractor: rec?.contractor,\n\t\t\t\tmodel: rec?.model,\n\t\t\t\tplot: rec?.plot,\n\t\t\t\tunitType: rec?.unitType,\n\t\t\t\ttypology: rec?.typology,\n\t\t\t};\n\t\t},\n\t\tselectVilla(code) {\n\t\t\tselectedCode = code;\n\t\t\tdrawTexture();\n\t\t\ttexture.needsUpdate = true;\n\t\t\trestyleLabels(); // selected villa's chip turns white\n\t\t\tfragments.core.update();\n\t\t\tapi.onSelect?.(code);\n\t\t},\n\t\tgetSelectedVilla() {\n\t\t\treturn selectedCode;\n\t\t},\n\t\tfitAll,\n\t\tresetView,\n\t\tsetView,\n\t\tgetZoomFactor() {\n\t\t\tconst t = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t\tnew THREE.Vector3(),\n\t\t\t);\n\t\t\tconst dist = world.camera.three.position.distanceTo(t);\n\t\t\tconst siteFit = poseDistance(1); // distance that frames the whole site\n\t\t\treturn dist > 1e-3 ? siteFit / dist : 1;\n\t\t},\n\t\tisZoomedIn() {\n\t\t\tconst t = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t\tnew THREE.Vector3(),\n\t\t\t);\n\t\t\t// >2% closer than the default open distance counts as zoomed in (small margin avoids rest-jitter).\n\t\t\treturn world.camera.three.position.distanceTo(t) < poseDistance(OPEN_POSE.zoom) * 0.98;\n\t\t},\n\t\tzoomIn() {\n\t\t\tconst t = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t\tnew THREE.Vector3(),\n\t\t\t);\n\t\t\tvoid world.camera.controls.dolly(world.camera.three.position.distanceTo(t) * 0.3, true);\n\t\t},\n\t\tzoomOut() {\n\t\t\tconst t = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t\tnew THREE.Vector3(),\n\t\t\t);\n\t\t\tvoid world.camera.controls.dolly(-world.camera.three.position.distanceTo(t) * 0.3, true);\n\t\t},\n\t\tsetInteractionMode(mode) {\n\t\t\tconst controls = world.camera.controls as unknown as {\n\t\t\t\tmouseButtons: {left: number};\n\t\t\t\tconstructor: {ACTION?: Record<string, number>};\n\t\t\t};\n\t\t\tconst ACTION = controls.constructor.ACTION ?? {ROTATE: 1, TRUCK: 2};\n\t\t\tcontrols.mouseButtons.left = mode === \"pan\" ? ACTION.TRUCK : ACTION.ROTATE;\n\t\t},\n\t\tasync topDownView() {\n\t\t\t// Straight-down (satellite) view, then fitToBox tightens it to the site — fitToBox naturally frames a\n\t\t\t// flat, wide footprint box from directly above, which is exactly the fitted top-down we want.\n\t\t\tconst c = fpBox.getCenter(new THREE.Vector3());\n\t\t\tconst up = poseDistance(1);\n\t\t\tawait world.camera.controls.setLookAt(c.x, c.y + up, c.z + up * 0.001, c.x, c.y, c.z, false);\n\t\t\tawait world.camera.controls.fitToBox(fpBox, true);\n\t\t},\n\t\tgetCameraPose() {\n\t\t\tconst p = world.camera.three.position;\n\t\t\tconst t = (world.camera.controls as unknown as {getTarget(v: THREE.Vector3): THREE.Vector3}).getTarget(\n\t\t\t\tnew THREE.Vector3(),\n\t\t\t);\n\t\t\tconst dx = p.x - t.x;\n\t\t\tconst dy = p.y - t.y;\n\t\t\tconst dz = p.z - t.z;\n\t\t\tconst horiz = Math.hypot(dx, dz);\n\t\t\treturn {\n\t\t\t\tposition: [p.x, p.y, p.z],\n\t\t\t\ttarget: [t.x, t.y, t.z],\n\t\t\t\televationDeg: (Math.atan2(dy, horiz) * 180) / Math.PI,\n\t\t\t\tazimuthDeg: (Math.atan2(dx, dz) * 180) / Math.PI,\n\t\t\t\tdistance: Math.hypot(dx, dy, dz),\n\t\t\t};\n\t\t},\n\t\tasync fitVilla(code) {\n\t\t\tconst it = index.find((i) => i.code === code);\n\t\t\tif (!it) return;\n\t\t\tconst cx = (it.minx + it.maxx) / 2;\n\t\t\tconst cz = (it.minz + it.maxz) / 2;\n\t\t\t// Fly to the villa keeping the CURRENT oblique angle (a direct pose, not fitToBox which would snap\n\t\t\t// top-down). Distance frames ~6× the villa footprint so it settles with surrounding context.\n\t\t\tconst radius = (Math.max(it.maxx - it.minx, it.maxz - it.minz) * 6) / 2 || 20;\n\t\t\tconst vfov = (((world.camera.three as THREE.PerspectiveCamera).fov ?? 60) * Math.PI) / 180;\n\t\t\tawait applyPose(new THREE.Vector3(cx, FLOOR_Y, cz), curElev, curAzim, radius / Math.tan(vfov / 2), true);\n\t\t},\n\t\t// --- Parity helpers (host UI written against the old viewer) --------------\n\t\tsetMeshVisible(v) {\n\t\t\tsatGroup.visible = v;\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetModelVisible(v) {\n\t\t\tcolorMode = v ? \"progress\" : \"off\";\n\t\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetModelOpacity(op) {\n\t\t\tstrength = op;\n\t\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetColourMode(mode) {\n\t\t\tcolorMode = mode === \"off\" || mode === \"material\" ? \"off\" : \"progress\";\n\t\t\tprojUniforms.uStrength.value = effectiveStrength();\n\t\t\tfragments.core.update();\n\t\t},\n\t\tsetLabelsVisible(v) {\n\t\t\tlabelsVisible = v;\n\t\t\tupdateLabels();\n\t\t},\n\t\tonHover: options.onHover,\n\t\tonSelect: options.onSelect,\n\t\tdispose() {\n\t\t\tcontainer.removeEventListener(\"mousemove\", onMove);\n\t\t\tcontainer.removeEventListener(\"mouseleave\", onLeave);\n\t\t\tcontainer.removeEventListener(\"click\", onClick);\n\t\t\ttry {\n\t\t\t\ttiles.dispose();\n\t\t\t} catch {\n\t\t\t\t/* ignore */\n\t\t\t}\n\t\t\tcomponents.dispose();\n\t\t\tcontainer.replaceChildren();\n\t\t},\n\t};\n\tapi.onReady_ = () => options.onReady?.(api);\n\n\treturn api;\n}\n"],"mappings":"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"}

package/dist/form-action-bar.d.mts

@@ -0,0 +1,32 @@
+import * as React from "react";
+//#region src/form-action-bar.d.ts
+export interface FormActionBarProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Left-aligned status node, e.g. "3 unsaved changes" or "New role — not saved yet". */
+  status?: React.ReactNode;
+  /**
+   * Pin to the bottom of the scroll region (default). Set `false` to render in normal flow —
+   * useful inside a panel that already clips its own content.
+   */
+  sticky?: boolean;
+  /** Clamp for the inner row, matching the form content it sits under. Default `1200px`. */
+  maxWidth?: string | number;
+}
+/**
+ * Page-level form footer: status on the left, actions (children) on the right.
+ *
+ * Owns its own full-bleed background, top border, and upward shadow, so it must be rendered as a
+ * **sibling of the padded content container, not a child of it** — otherwise it inherits that
+ * padding and has to cancel it with negative margins. Put the padding on an inner content div and
+ * leave the scroll container itself unpadded:
+ *
+ * ```tsx
+ * <main className="flex min-h-0 flex-1 flex-col overflow-auto">
+ *   <div className="mx-auto w-full max-w-[1200px] p-6">…form…</div>
+ *   <FormActionBar status="3 unsaved changes">…</FormActionBar>
+ * </main>
+ * ```
+ */
+declare const FormActionBar: React.ForwardRefExoticComponent<FormActionBarProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { FormActionBar };
+//# sourceMappingURL=form-action-bar.d.mts.map

package/dist/form-action-bar.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-action-bar.d.mts","names":[],"sources":["../src/form-action-bar.tsx"],"mappings":";;iBAGiB,2BAA2B,MAAM,eAAe;;EAEhE,SAAS,MAAM;;;;;EAKf;;EAEA;;;;;;;;;;;;;;;;;cAkBK,eAAa,MAAA,0BAAA,qBAAA,MAAA,cAAA"}

package/dist/form-action-bar.mjs

@@ -0,0 +1,42 @@
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/form-action-bar.tsx
+/**
+* Page-level form footer: status on the left, actions (children) on the right.
+*
+* Owns its own full-bleed background, top border, and upward shadow, so it must be rendered as a
+* **sibling of the padded content container, not a child of it** — otherwise it inherits that
+* padding and has to cancel it with negative margins. Put the padding on an inner content div and
+* leave the scroll container itself unpadded:
+*
+* ```tsx
+* <main className="flex min-h-0 flex-1 flex-col overflow-auto">
+*   <div className="mx-auto w-full max-w-[1200px] p-6">…form…</div>
+*   <FormActionBar status="3 unsaved changes">…</FormActionBar>
+* </main>
+* ```
+*/
+const FormActionBar = React.forwardRef(({ status, sticky = true, maxWidth = "1200px", className, children, ...props }, ref) => /* @__PURE__ */ jsx("div", {
+	ref,
+	"data-core-artifact": "form-action-bar",
+	"data-core-surface-owner": "artifact",
+	className: cn("wwc:flex wwc:h-[53px] wwc:w-full wwc:shrink-0 wwc:items-center wwc:border-t wwc:border-border wwc:bg-card wwc:px-6", "wwc:shadow-[0_-4px_16px_rgba(0,0,0,0.06)]", sticky && "wwc:sticky wwc:bottom-0 wwc:z-30", className),
+	...props,
+	children: /* @__PURE__ */ jsxs("div", {
+		className: "wwc:mx-auto wwc:flex wwc:w-full wwc:items-center wwc:justify-between wwc:gap-4",
+		style: { maxWidth: typeof maxWidth === "number" ? `${maxWidth}px` : maxWidth },
+		children: [/* @__PURE__ */ jsx("div", {
+			className: "wwc:min-w-0 wwc:truncate wwc:text-sm wwc:text-muted-foreground",
+			children: status
+		}), /* @__PURE__ */ jsx("div", {
+			className: "wwc:flex wwc:shrink-0 wwc:items-center wwc:gap-2",
+			children
+		})]
+	})
+}));
+FormActionBar.displayName = "FormActionBar";
+//#endregion
+export { FormActionBar };
+
+//# sourceMappingURL=form-action-bar.mjs.map

package/dist/form-action-bar.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-action-bar.mjs","names":[],"sources":["../src/form-action-bar.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nexport interface FormActionBarProps extends React.HTMLAttributes<HTMLDivElement> {\n\t/** Left-aligned status node, e.g. \"3 unsaved changes\" or \"New role — not saved yet\". */\n\tstatus?: React.ReactNode;\n\t/**\n\t * Pin to the bottom of the scroll region (default). Set `false` to render in normal flow —\n\t * useful inside a panel that already clips its own content.\n\t */\n\tsticky?: boolean;\n\t/** Clamp for the inner row, matching the form content it sits under. Default `1200px`. */\n\tmaxWidth?: string | number;\n}\n\n/**\n * Page-level form footer: status on the left, actions (children) on the right.\n *\n * Owns its own full-bleed background, top border, and upward shadow, so it must be rendered as a\n * **sibling of the padded content container, not a child of it** — otherwise it inherits that\n * padding and has to cancel it with negative margins. Put the padding on an inner content div and\n * leave the scroll container itself unpadded:\n *\n * ```tsx\n * <main className=\"flex min-h-0 flex-1 flex-col overflow-auto\">\n *   <div className=\"mx-auto w-full max-w-[1200px] p-6\">…form…</div>\n *   <FormActionBar status=\"3 unsaved changes\">…</FormActionBar>\n * </main>\n * ```\n */\nconst FormActionBar = React.forwardRef<HTMLDivElement, FormActionBarProps>(\n\t({status, sticky = true, maxWidth = \"1200px\", className, children, ...props}, ref) => (\n\t\t<div\n\t\t\tref={ref}\n\t\t\tdata-core-artifact=\"form-action-bar\"\n\t\t\tdata-core-surface-owner=\"artifact\"\n\t\t\tclassName={cn(\n\t\t\t\t\"wwc:flex wwc:h-[53px] wwc:w-full wwc:shrink-0 wwc:items-center wwc:border-t wwc:border-border wwc:bg-card wwc:px-6\",\n\t\t\t\t\"wwc:shadow-[0_-4px_16px_rgba(0,0,0,0.06)]\",\n\t\t\t\tsticky && \"wwc:sticky wwc:bottom-0 wwc:z-30\",\n\t\t\t\tclassName,\n\t\t\t)}\n\t\t\t{...props}\n\t\t>\n\t\t\t<div\n\t\t\t\tclassName=\"wwc:mx-auto wwc:flex wwc:w-full wwc:items-center wwc:justify-between wwc:gap-4\"\n\t\t\t\tstyle={{maxWidth: typeof maxWidth === \"number\" ? `${maxWidth}px` : maxWidth}}\n\t\t\t>\n\t\t\t\t<div className=\"wwc:min-w-0 wwc:truncate wwc:text-sm wwc:text-muted-foreground\">{status}</div>\n\t\t\t\t<div className=\"wwc:flex wwc:shrink-0 wwc:items-center wwc:gap-2\">{children}</div>\n\t\t\t</div>\n\t\t</div>\n\t),\n);\nFormActionBar.displayName = \"FormActionBar\";\n\nexport {FormActionBar};\n"],"mappings":";;;;;;;;;;;;;;;;;;;AA8BA,MAAM,gBAAgB,MAAM,YAC1B,EAAC,QAAQ,SAAS,MAAM,WAAW,UAAU,WAAW,UAAU,GAAG,SAAQ,QAC7E,oBAAC,OAAD;CACM;CACL,sBAAmB;CACnB,2BAAwB;CACxB,WAAW,GACV,sHACA,6CACA,UAAU,oCACV,SACD;CACA,GAAI;CAEJ,UAAA,qBAAC,OAAD;EACC,WAAU;EACV,OAAO,EAAC,UAAU,OAAO,aAAa,WAAW,GAAG,SAAS,MAAM,SAAQ;EAF5E,UAAA,CAIC,oBAAC,OAAD;GAAK,WAAU;GAAkE,UAAA;EAAY,CAAA,GAC7F,oBAAC,OAAD;GAAK,WAAU;GAAoD;EAAc,CAAA,CAC7E;;AACD,CAAA,CAEP;AACA,cAAc,cAAc"}

package/dist/form-dialog.d.mts

@@ -0,0 +1,116 @@
+import { Button } from "./button.mjs";
+import * as React from "react";
+//#region src/form-dialog.d.ts
+/**
+ * Reads whether this dialog has already refused a submit. Rarely needed directly — `FormDialogField`
+ * resolves it for you — but available for a call site rendering a field layout of its own.
+ */
+export declare function useFormDialogAttempted(): boolean;
+export interface FormDialogProps {
+  open: boolean;
+  onOpenChange: (open: boolean) => void;
+  /** Dialog heading. */
+  title: React.ReactNode;
+  /** Optional sub-heading under the title band. */
+  description?: React.ReactNode;
+  /**
+   * Max width of the dialog in pixels. Defaults to `520` — the width of the narrowest shipped
+   * authoring dialog; widen only when a field row genuinely needs two columns.
+   */
+  width?: number;
+  /**
+   * Whether the form may be submitted. The submit button stays enabled either way — this only
+   * decides whether a press succeeds or reveals the errors.
+   */
+  valid: boolean;
+  /** Footer guidance shown until a submit is refused, e.g. "Name it, then create." */
+  hint?: React.ReactNode;
+  /** Replaces `hint` once a submit has been refused. Say what is missing, not that something is. */
+  error?: React.ReactNode;
+  /** Label of the confirming button, e.g. "Create process". */
+  submitLabel: React.ReactNode;
+  /** Label of the dismissing button. Defaults to "Cancel". */
+  cancelLabel?: React.ReactNode;
+  /** Variant of the confirming button. Defaults to the primary `default`. */
+  submitVariant?: React.ComponentProps<typeof Button>["variant"];
+  /** Extra props for the confirming button — test hooks, `data-*` attributes. */
+  submitProps?: Omit<React.ComponentProps<typeof Button>, "onClick" | "variant" | "children">;
+  /** Runs only when `valid` is true. Closes the dialog afterwards unless `keepOpenOnSubmit`. */
+  onSubmit: () => void;
+  /** Clears the form. Runs after a successful submit AND whenever the dialog closes. */
+  onReset?: () => void;
+  /** Keep the dialog open after a successful submit — for a form that stays up to add another. */
+  keepOpenOnSubmit?: boolean;
+  /** Applied to `DialogContent`, after the width. */
+  className?: string;
+  children: React.ReactNode;
+}
+/** Single-step create/edit modal: header band, field body, guidance-and-actions footer. */
+export declare function FormDialog({ open, onOpenChange, title, description, width, valid, hint, error, submitLabel, cancelLabel, submitVariant, submitProps, onSubmit, onReset, keepOpenOnSubmit, className, children }: FormDialogProps): import("react/jsx-runtime").JSX.Element;
+/** What the render-prop form of a field hands its control. */
+export interface FormDialogFieldState {
+  /** Whether to paint the field red — validity already resolved against `attempted`. */
+  invalid: boolean;
+  /** Put this on the control. It is what the field's `<label>` points at. */
+  id: string;
+  /** Put this on the control as `aria-describedby` — the id of the hint line, when there is one. */
+  describedBy?: string;
+  /**
+   * Id of the caption itself. For a control `htmlFor` cannot name — a toggle group, a radio row —
+   * point the group at this with `aria-labelledby` instead.
+   */
+  labelId: string;
+}
+export interface FormDialogFieldProps {
+  /** Field name. Rendered as the house's uppercase muted caption, in a real `<label>`. */
+  label: React.ReactNode;
+  /**
+   * True while the field's value is unacceptable — plain validity, not "should I show red now".
+   * The dialog decides the timing: nothing paints until a submit has been refused.
+   */
+  invalid?: boolean;
+  /** Muted helper line under the control, e.g. "Its rows are the tokens of this process." */
+  hint?: React.ReactNode;
+  /**
+   * Id of the control this labels. Only needed for the plain-children form, where the field cannot
+   * reach the control to give it one — with the render prop, take `id` from the state instead.
+   */
+  htmlFor?: string;
+  className?: string;
+  /**
+   * The control. Given as a function to receive `invalid` already resolved against `attempted`, plus
+   * the `id` the label points at and the `describedBy` of the hint line — spread them onto your own
+   * input as `aria-invalid`, `id` and `aria-describedby`. Fields with nothing to validate can pass
+   * plain children instead, naming the control with `htmlFor`.
+   */
+  children: React.ReactNode | ((state: FormDialogFieldState) => React.ReactNode);
+}
+/**
+ * One labelled field inside a {@link FormDialog}.
+ *
+ * The caption is a real `<label>` bound to the control, not a styled `<span>`: a caption that only
+ * looks like a label reads to a screen reader as "edit, blank", and no amount of visual review
+ * catches it. The id comes from here because the field is the only thing that sees both sides —
+ * take it from the render prop, or name your own control with `htmlFor`.
+ */
+export declare function FormDialogField({ label, invalid, hint, htmlFor, className, children }: FormDialogFieldProps): import("react/jsx-runtime").JSX.Element;
+export interface FormDialogRowProps {
+  /** Columns from the `sm` breakpoint up. Below it the fields always stack. Defaults to `2`. */
+  columns?: 2 | 3;
+  className?: string;
+  children: React.ReactNode;
+}
+/** Puts sibling {@link FormDialogField}s side by side, stacking them on a narrow viewport. */
+export declare function FormDialogRow({ columns, className, children }: FormDialogRowProps): import("react/jsx-runtime").JSX.Element;
+/** Muted explanatory paragraph between fields — what the form will actually produce. */
+export declare function FormDialogNote({ className, children }: {
+  className?: string;
+  children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+/** Amber caveat between fields — true, non-blocking, and worth reading before submitting. */
+export declare function FormDialogCaveat({ className, children }: {
+  className?: string;
+  children: React.ReactNode;
+}): import("react/jsx-runtime").JSX.Element;
+//#endregion
+//# sourceMappingURL=form-dialog.d.mts.map

package/dist/form-dialog.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-dialog.d.mts","names":[],"sources":["../src/form-dialog.tsx"],"mappings":";;;;;;;wBAqCgB;iBAIC;EAChB;EACA,eAAe;;EAEf,OAAO,MAAM;;EAEb,cAAc,MAAM;;;;;EAKpB;;;;;EAKA;;EAEA,OAAO,MAAM;;EAEb,QAAQ,MAAM;;EAEd,aAAa,MAAM;;EAEnB,cAAc,MAAM;;EAEpB,gBAAgB,MAAM,sBAAsB;;EAE5C,cAAc,KAAK,MAAM,sBAAsB;;EAE/C;;EAEA;;EAEA;;EAEA;EACA,UAAU,MAAM;;;wBAID,aACf,MACA,cACA,OACA,aACA,OACA,OACA,MACA,OACA,aACA,aACA,eACA,aACA,UACA,SACA,kBACA,WACA,YACE,8CAAe,IAAA;;iBAoED;;EAEhB;;EAEA;;EAEA;;;;;EAKA;;iBAGgB;;EAEhB,OAAO,MAAM;;;;;EAKb;;EAEA,OAAO,MAAM;;;;;EAKb;EACA;;;;;;;EAOA,UAAU,MAAM,cAAc,OAAO,yBAAyB,MAAM;;;;;;;;;;wBAWrD,kBAAiB,OAAO,SAAiB,MAAM,SAAS,WAAW,YAAW,mDAAoB,IAAA;iBAgCjG;;EAEhB;EACA;EACA,UAAU,MAAM;;;wBAID,gBAAe,SAAa,WAAW,YAAW,iDAAkB,IAAA;;wBASpE,iBAAgB,WAAW;EAAY;EAAoB,UAAU,MAAM;gCAAU,IAAA;;wBAKrF,mBAAkB,WAAW;EAAY;EAAoB,UAAU,MAAM;gCAAU,IAAA"}

package/dist/form-dialog.mjs

@@ -0,0 +1,149 @@
+import { Button } from "./button.mjs";
+import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle } from "./dialog.mjs";
+import { Label } from "./label.mjs";
+import { cn } from "@corensystem/coren-utils";
+import * as React from "react";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/form-dialog.tsx
+const FormDialogContext = React.createContext({ attempted: false });
+/**
+* Reads whether this dialog has already refused a submit. Rarely needed directly — `FormDialogField`
+* resolves it for you — but available for a call site rendering a field layout of its own.
+*/
+function useFormDialogAttempted() {
+	return React.useContext(FormDialogContext).attempted;
+}
+/** Single-step create/edit modal: header band, field body, guidance-and-actions footer. */
+function FormDialog({ open, onOpenChange, title, description, width = 520, valid, hint, error, submitLabel, cancelLabel = "Cancel", submitVariant, submitProps, onSubmit, onReset, keepOpenOnSubmit = false, className, children }) {
+	const [attempted, setAttempted] = React.useState(false);
+	const clear = React.useCallback(() => {
+		setAttempted(false);
+		onReset?.();
+	}, [onReset]);
+	const close = (next) => {
+		if (!next) clear();
+		onOpenChange(next);
+	};
+	const submit = () => {
+		if (!valid) {
+			setAttempted(true);
+			return;
+		}
+		onSubmit();
+		if (keepOpenOnSubmit) {
+			clear();
+			return;
+		}
+		close(false);
+	};
+	const context = React.useMemo(() => ({ attempted }), [attempted]);
+	return /* @__PURE__ */ jsx(Dialog, {
+		open,
+		onOpenChange: close,
+		children: /* @__PURE__ */ jsxs(DialogContent, {
+			"data-core-artifact": "form-dialog",
+			className: cn("wwc:w-[calc(100vw-2rem)]", className),
+			style: { maxWidth: width },
+			children: [
+				/* @__PURE__ */ jsxs(DialogHeader, {
+					className: "wwc:flex-col wwc:items-start wwc:gap-0.5",
+					children: [/* @__PURE__ */ jsx(DialogTitle, { children: title }), description ? /* @__PURE__ */ jsx(DialogDescription, {
+						className: "wwc:text-xs",
+						children: description
+					}) : null]
+				}),
+				/* @__PURE__ */ jsx(FormDialogContext.Provider, {
+					value: context,
+					children: /* @__PURE__ */ jsx("div", {
+						className: "wwc:grid wwc:gap-4 wwc:p-4",
+						children
+					})
+				}),
+				/* @__PURE__ */ jsxs(DialogFooter, { children: [/* @__PURE__ */ jsx("span", {
+					className: "wwc:text-sm",
+					children: attempted && !valid ? /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-destructive",
+						children: error
+					}) : /* @__PURE__ */ jsx("span", {
+						className: "wwc:text-muted-foreground",
+						children: hint
+					})
+				}), /* @__PURE__ */ jsxs("div", {
+					className: "wwc:flex wwc:items-center wwc:gap-2",
+					children: [/* @__PURE__ */ jsx(Button, {
+						variant: "outline",
+						onClick: () => close(false),
+						children: cancelLabel
+					}), /* @__PURE__ */ jsx(Button, {
+						variant: submitVariant,
+						onClick: submit,
+						...submitProps,
+						children: submitLabel
+					})]
+				})] })
+			]
+		})
+	});
+}
+/**
+* One labelled field inside a {@link FormDialog}.
+*
+* The caption is a real `<label>` bound to the control, not a styled `<span>`: a caption that only
+* looks like a label reads to a screen reader as "edit, blank", and no amount of visual review
+* catches it. The id comes from here because the field is the only thing that sees both sides —
+* take it from the render prop, or name your own control with `htmlFor`.
+*/
+function FormDialogField({ label, invalid = false, hint, htmlFor, className, children }) {
+	const showError = useFormDialogAttempted() && invalid;
+	const generatedId = React.useId();
+	const fieldId = htmlFor ?? generatedId;
+	const hintId = `${generatedId}-hint`;
+	const labelId = `${generatedId}-label`;
+	return /* @__PURE__ */ jsxs("div", {
+		className: cn("wwc:space-y-1.5", className),
+		children: [
+			/* @__PURE__ */ jsx(Label, {
+				id: labelId,
+				htmlFor: fieldId,
+				className: "wwc:text-xs wwc:leading-4 wwc:font-semibold wwc:tracking-wide wwc:text-muted-foreground wwc:uppercase",
+				children: label
+			}),
+			typeof children === "function" ? children({
+				invalid: showError,
+				id: fieldId,
+				describedBy: hint ? hintId : void 0,
+				labelId
+			}) : children,
+			hint ? /* @__PURE__ */ jsx("p", {
+				id: hintId,
+				className: "wwc:text-xs wwc:text-muted-foreground",
+				children: hint
+			}) : null
+		]
+	});
+}
+/** Puts sibling {@link FormDialogField}s side by side, stacking them on a narrow viewport. */
+function FormDialogRow({ columns = 2, className, children }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: cn("wwc:grid wwc:gap-4", columns === 2 ? "wwc:sm:grid-cols-2" : "wwc:sm:grid-cols-3", className),
+		children
+	});
+}
+/** Muted explanatory paragraph between fields — what the form will actually produce. */
+function FormDialogNote({ className, children }) {
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("wwc:text-xs wwc:text-muted-foreground", className),
+		children
+	});
+}
+/** Amber caveat between fields — true, non-blocking, and worth reading before submitting. */
+function FormDialogCaveat({ className, children }) {
+	return /* @__PURE__ */ jsx("p", {
+		className: cn("wwc:text-xs wwc:text-amber-600", className),
+		children
+	});
+}
+//#endregion
+export { FormDialog, FormDialogCaveat, FormDialogField, FormDialogNote, FormDialogRow, useFormDialogAttempted };
+
+//# sourceMappingURL=form-dialog.mjs.map

package/dist/form-dialog.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-dialog.mjs","names":[],"sources":["../src/form-dialog.tsx"],"sourcesContent":["import {cn} from \"@corensystem/coren-utils\";\nimport * as React from \"react\";\n\nimport {Button} from \"./button\";\nimport {Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle} from \"./dialog\";\nimport {Label} from \"./label\";\n\n/**\n * The house contract for a single-step create/edit modal, in one place.\n *\n * Every authoring dialog in the library had grown its own copy of the same three decisions:\n *\n *   1. **Submit is never disabled.** A greyed-out button tells the user nothing about what is\n *      missing. Instead the press is swallowed, `attempted` flips true, and the offending fields\n *      light up. `FormDialog` owns that flag so a call site never declares it again.\n *   2. **Validity and error display are separate.** Call sites pass each field's *validity*\n *      (`invalid`) and this component decides *when* it becomes visible — never before the user has\n *      actually tried to submit. That is why `FormDialogField` takes `invalid`, not `showError`.\n *   3. **Reset runs on close as well as on success.** Re-opening a dialog that still holds the last\n *      attempt's half-typed values is a bug every copy had to remember not to write.\n *\n * The footer's left slot is guidance, not decoration: it holds `hint` in steady state and swaps to\n * `error` once a submit has been refused, so the explanation appears where the user is already\n * looking when the button does nothing.\n */\n\ninterface FormDialogContextValue {\n\t/** True once a submit has been refused; fields paint their errors only after this. */\n\tattempted: boolean;\n}\n\nconst FormDialogContext = React.createContext<FormDialogContextValue>({attempted: false});\n\n/**\n * Reads whether this dialog has already refused a submit. Rarely needed directly — `FormDialogField`\n * resolves it for you — but available for a call site rendering a field layout of its own.\n */\nexport function useFormDialogAttempted(): boolean {\n\treturn React.useContext(FormDialogContext).attempted;\n}\n\nexport interface FormDialogProps {\n\topen: boolean;\n\tonOpenChange: (open: boolean) => void;\n\t/** Dialog heading. */\n\ttitle: React.ReactNode;\n\t/** Optional sub-heading under the title band. */\n\tdescription?: React.ReactNode;\n\t/**\n\t * Max width of the dialog in pixels. Defaults to `520` — the width of the narrowest shipped\n\t * authoring dialog; widen only when a field row genuinely needs two columns.\n\t */\n\twidth?: number;\n\t/**\n\t * Whether the form may be submitted. The submit button stays enabled either way — this only\n\t * decides whether a press succeeds or reveals the errors.\n\t */\n\tvalid: boolean;\n\t/** Footer guidance shown until a submit is refused, e.g. \"Name it, then create.\" */\n\thint?: React.ReactNode;\n\t/** Replaces `hint` once a submit has been refused. Say what is missing, not that something is. */\n\terror?: React.ReactNode;\n\t/** Label of the confirming button, e.g. \"Create process\". */\n\tsubmitLabel: React.ReactNode;\n\t/** Label of the dismissing button. Defaults to \"Cancel\". */\n\tcancelLabel?: React.ReactNode;\n\t/** Variant of the confirming button. Defaults to the primary `default`. */\n\tsubmitVariant?: React.ComponentProps<typeof Button>[\"variant\"];\n\t/** Extra props for the confirming button — test hooks, `data-*` attributes. */\n\tsubmitProps?: Omit<React.ComponentProps<typeof Button>, \"onClick\" | \"variant\" | \"children\">;\n\t/** Runs only when `valid` is true. Closes the dialog afterwards unless `keepOpenOnSubmit`. */\n\tonSubmit: () => void;\n\t/** Clears the form. Runs after a successful submit AND whenever the dialog closes. */\n\tonReset?: () => void;\n\t/** Keep the dialog open after a successful submit — for a form that stays up to add another. */\n\tkeepOpenOnSubmit?: boolean;\n\t/** Applied to `DialogContent`, after the width. */\n\tclassName?: string;\n\tchildren: React.ReactNode;\n}\n\n/** Single-step create/edit modal: header band, field body, guidance-and-actions footer. */\nexport function FormDialog({\n\topen,\n\tonOpenChange,\n\ttitle,\n\tdescription,\n\twidth = 520,\n\tvalid,\n\thint,\n\terror,\n\tsubmitLabel,\n\tcancelLabel = \"Cancel\",\n\tsubmitVariant,\n\tsubmitProps,\n\tonSubmit,\n\tonReset,\n\tkeepOpenOnSubmit = false,\n\tclassName,\n\tchildren,\n}: FormDialogProps) {\n\tconst [attempted, setAttempted] = React.useState(false);\n\n\t// One place to land after every exit — a dismiss, a successful submit, or an Escape — so no path\n\t// can leave the next open showing the last attempt's values.\n\tconst clear = React.useCallback(() => {\n\t\tsetAttempted(false);\n\t\tonReset?.();\n\t}, [onReset]);\n\n\tconst close = (next: boolean) => {\n\t\tif (!next) clear();\n\t\tonOpenChange(next);\n\t};\n\n\tconst submit = () => {\n\t\tif (!valid) {\n\t\t\tsetAttempted(true);\n\t\t\treturn;\n\t\t}\n\t\tonSubmit();\n\t\tif (keepOpenOnSubmit) {\n\t\t\t// Same clear, minus the close: the form empties and stays up for the next entry.\n\t\t\tclear();\n\t\t\treturn;\n\t\t}\n\t\tclose(false);\n\t};\n\n\tconst context = React.useMemo(() => ({attempted}), [attempted]);\n\n\treturn (\n\t\t<Dialog open={open} onOpenChange={close}>\n\t\t\t<DialogContent\n\t\t\t\tdata-core-artifact=\"form-dialog\"\n\t\t\t\tclassName={cn(\"wwc:w-[calc(100vw-2rem)]\", className)}\n\t\t\t\tstyle={{maxWidth: width}}\n\t\t\t>\n\t\t\t\t<DialogHeader className=\"wwc:flex-col wwc:items-start wwc:gap-0.5\">\n\t\t\t\t\t<DialogTitle>{title}</DialogTitle>\n\t\t\t\t\t{description ? <DialogDescription className=\"wwc:text-xs\">{description}</DialogDescription> : null}\n\t\t\t\t</DialogHeader>\n\t\t\t\t<FormDialogContext.Provider value={context}>\n\t\t\t\t\t<div className=\"wwc:grid wwc:gap-4 wwc:p-4\">{children}</div>\n\t\t\t\t</FormDialogContext.Provider>\n\t\t\t\t<DialogFooter>\n\t\t\t\t\t<span className=\"wwc:text-sm\">\n\t\t\t\t\t\t{attempted && !valid ? (\n\t\t\t\t\t\t\t<span className=\"wwc:text-destructive\">{error}</span>\n\t\t\t\t\t\t) : (\n\t\t\t\t\t\t\t<span className=\"wwc:text-muted-foreground\">{hint}</span>\n\t\t\t\t\t\t)}\n\t\t\t\t\t</span>\n\t\t\t\t\t<div className=\"wwc:flex wwc:items-center wwc:gap-2\">\n\t\t\t\t\t\t<Button variant=\"outline\" onClick={() => close(false)}>\n\t\t\t\t\t\t\t{cancelLabel}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t<Button variant={submitVariant} onClick={submit} {...submitProps}>\n\t\t\t\t\t\t\t{submitLabel}\n\t\t\t\t\t\t</Button>\n\t\t\t\t\t</div>\n\t\t\t\t</DialogFooter>\n\t\t\t</DialogContent>\n\t\t</Dialog>\n\t);\n}\n\n/** What the render-prop form of a field hands its control. */\nexport interface FormDialogFieldState {\n\t/** Whether to paint the field red — validity already resolved against `attempted`. */\n\tinvalid: boolean;\n\t/** Put this on the control. It is what the field's `<label>` points at. */\n\tid: string;\n\t/** Put this on the control as `aria-describedby` — the id of the hint line, when there is one. */\n\tdescribedBy?: string;\n\t/**\n\t * Id of the caption itself. For a control `htmlFor` cannot name — a toggle group, a radio row —\n\t * point the group at this with `aria-labelledby` instead.\n\t */\n\tlabelId: string;\n}\n\nexport interface FormDialogFieldProps {\n\t/** Field name. Rendered as the house's uppercase muted caption, in a real `<label>`. */\n\tlabel: React.ReactNode;\n\t/**\n\t * True while the field's value is unacceptable — plain validity, not \"should I show red now\".\n\t * The dialog decides the timing: nothing paints until a submit has been refused.\n\t */\n\tinvalid?: boolean;\n\t/** Muted helper line under the control, e.g. \"Its rows are the tokens of this process.\" */\n\thint?: React.ReactNode;\n\t/**\n\t * Id of the control this labels. Only needed for the plain-children form, where the field cannot\n\t * reach the control to give it one — with the render prop, take `id` from the state instead.\n\t */\n\thtmlFor?: string;\n\tclassName?: string;\n\t/**\n\t * The control. Given as a function to receive `invalid` already resolved against `attempted`, plus\n\t * the `id` the label points at and the `describedBy` of the hint line — spread them onto your own\n\t * input as `aria-invalid`, `id` and `aria-describedby`. Fields with nothing to validate can pass\n\t * plain children instead, naming the control with `htmlFor`.\n\t */\n\tchildren: React.ReactNode | ((state: FormDialogFieldState) => React.ReactNode);\n}\n\n/**\n * One labelled field inside a {@link FormDialog}.\n *\n * The caption is a real `<label>` bound to the control, not a styled `<span>`: a caption that only\n * looks like a label reads to a screen reader as \"edit, blank\", and no amount of visual review\n * catches it. The id comes from here because the field is the only thing that sees both sides —\n * take it from the render prop, or name your own control with `htmlFor`.\n */\nexport function FormDialogField({label, invalid = false, hint, htmlFor, className, children}: FormDialogFieldProps) {\n\tconst attempted = useFormDialogAttempted();\n\t// The whole point of the split: an untouched form is never red, however invalid it is.\n\tconst showError = attempted && invalid;\n\tconst generatedId = React.useId();\n\tconst fieldId = htmlFor ?? generatedId;\n\tconst hintId = `${generatedId}-hint`;\n\tconst labelId = `${generatedId}-label`;\n\n\treturn (\n\t\t<div className={cn(\"wwc:space-y-1.5\", className)}>\n\t\t\t<Label\n\t\t\t\tid={labelId}\n\t\t\t\thtmlFor={fieldId}\n\t\t\t\t// `leading-4` restores what `text-xs` gave the plain <span> this replaced: `Label`'s own\n\t\t\t\t// `leading-none` would shorten every caption's line box by 4px and move every field.\n\t\t\t\tclassName=\"wwc:text-xs wwc:leading-4 wwc:font-semibold wwc:tracking-wide wwc:text-muted-foreground wwc:uppercase\"\n\t\t\t>\n\t\t\t\t{label}\n\t\t\t</Label>\n\t\t\t{typeof children === \"function\"\n\t\t\t\t? children({invalid: showError, id: fieldId, describedBy: hint ? hintId : undefined, labelId})\n\t\t\t\t: children}\n\t\t\t{hint ? (\n\t\t\t\t<p id={hintId} className=\"wwc:text-xs wwc:text-muted-foreground\">\n\t\t\t\t\t{hint}\n\t\t\t\t</p>\n\t\t\t) : null}\n\t\t</div>\n\t);\n}\n\nexport interface FormDialogRowProps {\n\t/** Columns from the `sm` breakpoint up. Below it the fields always stack. Defaults to `2`. */\n\tcolumns?: 2 | 3;\n\tclassName?: string;\n\tchildren: React.ReactNode;\n}\n\n/** Puts sibling {@link FormDialogField}s side by side, stacking them on a narrow viewport. */\nexport function FormDialogRow({columns = 2, className, children}: FormDialogRowProps) {\n\treturn (\n\t\t<div className={cn(\"wwc:grid wwc:gap-4\", columns === 2 ? \"wwc:sm:grid-cols-2\" : \"wwc:sm:grid-cols-3\", className)}>\n\t\t\t{children}\n\t\t</div>\n\t);\n}\n\n/** Muted explanatory paragraph between fields — what the form will actually produce. */\nexport function FormDialogNote({className, children}: {className?: string; children: React.ReactNode}) {\n\treturn <p className={cn(\"wwc:text-xs wwc:text-muted-foreground\", className)}>{children}</p>;\n}\n\n/** Amber caveat between fields — true, non-blocking, and worth reading before submitting. */\nexport function FormDialogCaveat({className, children}: {className?: string; children: React.ReactNode}) {\n\treturn <p className={cn(\"wwc:text-xs wwc:text-amber-600\", className)}>{children}</p>;\n}\n"],"mappings":"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"}

package/dist/form-layout.d.mts

@@ -0,0 +1,33 @@
+import * as React from "react";
+import { VariantProps } from "class-variance-authority";
+//#region src/form-layout.d.ts
+declare const formLayoutVariants: (props?: ({
+  layout?: "horizontal" | "vertical" | "inline" | null | undefined;
+  size?: "sm" | "md" | "lg" | "xl" | "full" | null | undefined;
+} & import("class-variance-authority/types").ClassProp) | undefined) => string;
+export interface FormLayoutProps extends React.FormHTMLAttributes<HTMLFormElement>, VariantProps<typeof formLayoutVariants> {}
+/** Layout container for forms with consistent spacing and sizing. */
+declare const FormLayout: React.ForwardRefExoticComponent<FormLayoutProps & React.RefAttributes<HTMLFormElement>>;
+export interface FormSectionProps extends React.HTMLAttributes<HTMLFieldSetElement> {
+  /** Section title */
+  title?: string;
+  /** Section description */
+  description?: string;
+}
+/** Grouped section within a form. */
+declare const FormSection: React.ForwardRefExoticComponent<FormSectionProps & React.RefAttributes<HTMLFieldSetElement>>;
+export interface FormRowProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Number of columns (for horizontal layouts) */
+  columns?: 1 | 2 | 3 | 4;
+}
+/** Row within a form for grouping fields horizontally. */
+declare const FormRow: React.ForwardRefExoticComponent<FormRowProps & React.RefAttributes<HTMLDivElement>>;
+export interface FormActionsProps extends React.HTMLAttributes<HTMLDivElement> {
+  /** Alignment of actions */
+  align?: "left" | "center" | "right" | "between";
+}
+/** Container for form action buttons. */
+declare const FormActions: React.ForwardRefExoticComponent<FormActionsProps & React.RefAttributes<HTMLDivElement>>;
+//#endregion
+export { FormActions, FormLayout, FormRow, FormSection, formLayoutVariants };
+//# sourceMappingURL=form-layout.d.mts.map

package/dist/form-layout.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"form-layout.d.mts","names":[],"sources":["../src/form-layout.tsx"],"mappings":";;;cAIM,qBAAkB;;;6CAmBtB;iBAEe,wBACR,MAAM,mBAAmB,kBAAkB,oBAAoB;;cAGlE,YAAU,MAAA,0BAAA,kBAAA,MAAA,cAAA;iBASC,yBAAyB,MAAM,eAAe;;EAE9D;;EAEA;;;cAIK,aAAW,MAAA,0BAAA,mBAAA,MAAA,cAAA;iBAeA,qBAAqB,MAAM,eAAe;;EAE1D;;;cAIK,SAAO,MAAA,0BAAA,eAAA,MAAA,cAAA;iBAgBI,yBAAyB,MAAM,eAAe;;EAE9D;;;cAIK,aAAW,MAAA,0BAAA,mBAAA,MAAA,cAAA"}