From 0e1bca37beefbb3557367cd884f4be2c7d9bebc7 Mon Sep 17 00:00:00 2001 From: Wassim SAMAD Date: Wed, 27 May 2026 20:43:48 -0400 Subject: [PATCH] =?UTF-8?q?feat(editor):=20preset-system=20primitives=20?= =?UTF-8?q?=E2=80=94=20presettable,=20sceneApi=20subtree=20round-trip,=20i?= =?UTF-8?q?solate=20+=20setCaptureMode=20enum,=20headless=20exports?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Per pascalorg/editor#340 (redesigned: single live canvas, no Viewer scene prop). Core - `capabilities.presettable` on `NodeDefinition` + `isPresettable` / `isPresettableKind` helpers. Explicit `false` on level / building / site / zone / spawn / guide / scan / item; implicit `true` for any kind with `def.parametrics`. - `sceneApi.getSubtreeSnapshot(rootId)` + `materializeSubtree(subtree, position, parentId?)` for round-tripping a node subtree through catalog storage. Strips id / parentId / absolute root position / host refs (`wallId`, `wallT`); fresh IDs minted at materialize time; child ordering preserved (FIFO walk). Viewer - `` prop + `ViewerHandle.setIsolated(ids | null)`. Walks `sceneRegistry`, hides every registered group not in the isolated set's ancestor + descendant closure. Building block for preset capture + future focus-mode UX. Editor - `useEditor.captureMode: CaptureMode` discriminated union (`idle` | `standard` | `preset`). `isCaptureMode` stays as a derived boolean for the existing read sites; `setCaptureMode` accepts both the boolean shape (back-compat) and the enum. - `preset` capture mode in `SnapshotCaptureOverlay`: drag locked to a square, mode-picker hidden, transparent flag forwarded through the `camera-controls:generate-thumbnail` emitter event. - Headless exports: `Inspector` (alias of `ParametricInspector`), `FloatingMenu` (alias of `FloatingActionMenu`), `ToolbarLeft` / `ToolbarRight` (aliases of `ViewerToolbarLeft` / `ViewerToolbarRight`), `useSelection` hook returning `{selectedIds, selectedNode, building/ level/zone}`, plus re-exports of `useScene` / `useViewer` from core / viewer so consumer shells (community, embedders) need only one import. Out of scope by design (see issue #340 "Out of scope"): a separate offscreen Viewer rendering an arbitrary subtree. The unified preset modal captures inside the live canvas via isolation + the existing snapshot pipeline — no `useScene` factory / React context refactor. Co-Authored-By: Claude Opus 4.7 (1M context) --- packages/core/src/events/bus.ts | 7 + .../__bench__/relations-resolver.bench.ts | 2 + packages/core/src/registry/index.ts | 39 ++- packages/core/src/registry/registry.test.ts | 43 ++- packages/core/src/registry/registry.ts | 18 ++ .../src/registry/relations-resolver.test.ts | 2 + packages/core/src/registry/scene-api.ts | 36 +++ packages/core/src/registry/subtree.test.ts | 164 +++++++++++ packages/core/src/registry/subtree.ts | 278 ++++++++++++++++++ packages/core/src/registry/types.ts | 37 +++ .../core/src/services/drag-session.test.ts | 2 + packages/core/src/services/hosting.test.ts | 2 + .../editor/snapshot-capture-overlay.tsx | 66 ++++- .../components/editor/thumbnail-generator.tsx | 5 + packages/editor/src/hooks/use-selection.ts | 64 ++++ packages/editor/src/index.tsx | 29 +- packages/editor/src/store/use-editor.tsx | 34 ++- packages/nodes/src/building/definition.ts | 1 + packages/nodes/src/guide/definition.ts | 3 + packages/nodes/src/item/definition.ts | 4 + packages/nodes/src/level/definition.ts | 3 + packages/nodes/src/scan/definition.ts | 3 + packages/nodes/src/site/definition.ts | 1 + packages/nodes/src/spawn/definition.ts | 2 + packages/nodes/src/zone/definition.ts | 3 + .../viewer/src/components/viewer/index.tsx | 71 ++++- packages/viewer/src/index.ts | 7 +- packages/viewer/src/lib/isolation.ts | 96 ++++++ 28 files changed, 974 insertions(+), 48 deletions(-) create mode 100644 packages/core/src/registry/subtree.test.ts create mode 100644 packages/core/src/registry/subtree.ts create mode 100644 packages/editor/src/hooks/use-selection.ts create mode 100644 packages/viewer/src/lib/isolation.ts diff --git a/packages/core/src/events/bus.ts b/packages/core/src/events/bus.ts index 1466770f1..143b17c48 100644 --- a/packages/core/src/events/bus.ts +++ b/packages/core/src/events/bus.ts @@ -130,6 +130,13 @@ export interface ThumbnailGenerateEvent { * that should fire immediately from the current camera pose. */ snapLevels?: boolean + /** + * When true, keep the rendered alpha channel — emits a transparent PNG + * without baking the scene background into the output. Used by the + * preset capture flow so saved preset thumbnails composite cleanly on + * any palette background. + */ + transparent?: boolean } export interface CameraControlFitSceneEvent { diff --git a/packages/core/src/registry/__bench__/relations-resolver.bench.ts b/packages/core/src/registry/__bench__/relations-resolver.bench.ts index 562a6150e..cc90af35d 100644 --- a/packages/core/src/registry/__bench__/relations-resolver.bench.ts +++ b/packages/core/src/registry/__bench__/relations-resolver.bench.ts @@ -110,6 +110,8 @@ function makeScene(nodes: Record): SceneApi { markDirty: () => {}, pauseHistory: () => {}, resumeHistory: () => {}, + getSubtreeSnapshot: () => null, + materializeSubtree: () => null, } } diff --git a/packages/core/src/registry/index.ts b/packages/core/src/registry/index.ts index 69ff7ebe9..4968ba6eb 100644 --- a/packages/core/src/registry/index.ts +++ b/packages/core/src/registry/index.ts @@ -1,6 +1,23 @@ +export type { + ArcResizeHandle, + Cursor, + EditorApi, + EndpointMoveHandle, + HandleAnchor, + HandleAxis, + HandleDescriptor, + HandleList, + HandlePlacement, + HandlePortal, + LinearResizeHandle, + RadialResizeHandle, + TapActionHandle, +} from './handles' export { discoverPlugins, getSelectableKinds, + isPresettable, + isPresettableKind, isRegistryMovable, isRegistrySelectable, kindsWithFloorplanScope, @@ -17,22 +34,14 @@ export { collectDescendants, type SpatialQuery, } from './relations-resolver' -export type { - ArcResizeHandle, - Cursor, - EditorApi, - EndpointMoveHandle, - HandleAnchor, - HandleAxis, - HandleDescriptor, - HandleList, - HandlePlacement, - HandlePortal, - LinearResizeHandle, - RadialResizeHandle, - TapActionHandle, -} from './handles' export { createSceneApi, type SceneStoreLike } from './scene-api' +export { + buildSubtreeSnapshot, + type MaterializedSubtree, + materializeSubtree, + type NodeSubtree, + type SubtreeNode, +} from './subtree' export type { Affordance, AnyNodeDefinition, diff --git a/packages/core/src/registry/registry.test.ts b/packages/core/src/registry/registry.test.ts index 0e1abc0f9..79ab46df7 100644 --- a/packages/core/src/registry/registry.test.ts +++ b/packages/core/src/registry/registry.test.ts @@ -1,6 +1,12 @@ import { beforeEach, describe, expect, test } from 'bun:test' import { z } from 'zod' -import { loadPlugin, nodeRegistry, registerNode } from './registry' +import { + isPresettable, + isPresettableKind, + loadPlugin, + nodeRegistry, + registerNode, +} from './registry' import type { AnyNodeDefinition, Plugin } from './types' function makeDefinition( @@ -70,6 +76,41 @@ describe('nodeRegistry', () => { }) }) +describe('isPresettable', () => { + beforeEach(() => { + nodeRegistry._reset() + }) + + test('explicit true wins', () => { + const def = makeDefinition('explicit-true', { capabilities: { presettable: true } }) + expect(isPresettable(def)).toBe(true) + }) + + test('explicit false wins even with parametrics', () => { + const def = makeDefinition('explicit-false', { + capabilities: { presettable: false }, + parametrics: { groups: [] } as any, + }) + expect(isPresettable(def)).toBe(false) + }) + + test('defaults to true when parametrics exists', () => { + const def = makeDefinition('param', { parametrics: { groups: [] } as any }) + expect(isPresettable(def)).toBe(true) + }) + + test('defaults to false without parametrics', () => { + const def = makeDefinition('no-param') + expect(isPresettable(def)).toBe(false) + }) + + test('isPresettableKind looks up the registry', () => { + registerNode(makeDefinition('shelfy', { parametrics: { groups: [] } as any })) + expect(isPresettableKind('shelfy')).toBe(true) + expect(isPresettableKind('unknown')).toBe(false) + }) +}) + describe('loadPlugin', () => { beforeEach(() => { nodeRegistry._reset() diff --git a/packages/core/src/registry/registry.ts b/packages/core/src/registry/registry.ts index 8cfbea8c9..c6ce27f2f 100644 --- a/packages/core/src/registry/registry.ts +++ b/packages/core/src/registry/registry.ts @@ -146,6 +146,24 @@ export function isRegistryMovable(kind: string): boolean { return false } +/** + * Whether the kind can be saved as a reusable preset. Default: an + * explicit `capabilities.presettable` boolean wins; otherwise the kind + * is presettable iff it declares `def.parametrics`. Read by host apps + * (community shell) to gate "save as preset" UI on a selection. + */ +export function isPresettable(def: AnyNodeDefinition): boolean { + if (typeof def.capabilities.presettable === 'boolean') { + return def.capabilities.presettable + } + return def.parametrics !== undefined +} + +export function isPresettableKind(kind: string): boolean { + const def = nodeRegistry.get(kind) + return def ? isPresettable(def) : false +} + export async function loadPlugin(plugin: Plugin): Promise { if (plugin.apiVersion !== HOST_API_VERSION) { throw new Error( diff --git a/packages/core/src/registry/relations-resolver.test.ts b/packages/core/src/registry/relations-resolver.test.ts index 2d33139c0..21a4ff1c7 100644 --- a/packages/core/src/registry/relations-resolver.test.ts +++ b/packages/core/src/registry/relations-resolver.test.ts @@ -47,6 +47,8 @@ function makeFakeScene(nodes: Record): SceneApi { markDirty: () => {}, pauseHistory: () => {}, resumeHistory: () => {}, + getSubtreeSnapshot: () => null, + materializeSubtree: () => null, } } diff --git a/packages/core/src/registry/scene-api.ts b/packages/core/src/registry/scene-api.ts index 1858a336f..7d7631b53 100644 --- a/packages/core/src/registry/scene-api.ts +++ b/packages/core/src/registry/scene-api.ts @@ -1,5 +1,6 @@ import type { AnyNode, AnyNodeId } from '../schema/types' import { pauseSceneHistory, resumeSceneHistory } from '../store/history-control' +import { buildSubtreeSnapshot, materializeSubtree as runMaterializeSubtree } from './subtree' import type { SceneApi } from './types' /** @@ -14,6 +15,7 @@ export type SceneStoreLike = { rootNodeIds: AnyNodeId[] dirtyNodes: Set createNode: (node: AnyNode, parentId?: AnyNodeId) => void + createNodes?: (ops: { node: AnyNode; parentId?: AnyNodeId }[]) => void updateNode: (id: AnyNodeId, data: Partial) => void deleteNode: (id: AnyNodeId) => void markDirty: (id: AnyNodeId) => void @@ -104,5 +106,39 @@ export function createSceneApi(store: SceneStoreLike): SceneApi { resumeSceneHistory(store) snapshot = null }, + + getSubtreeSnapshot(rootId) { + return buildSubtreeSnapshot(store.getState().nodes, rootId) + }, + + materializeSubtree(subtree, position, parentId) { + const { rootId, nodes } = runMaterializeSubtree(subtree, position) + const state = store.getState() + // Prefer batched `createNodes` when the store exposes it — keeps + // children-array writes and dirty-marking in one tick, identical + // to how `applyNodeChanges` lands a multi-node paste. The + // minimal `SceneStoreLike` does not require it, so the test + // store can fall back to per-node `createNode` calls. + const root = nodes[0] + if (!root) return null + const ops: { node: AnyNode; parentId?: AnyNodeId }[] = [] + for (let i = 0; i < nodes.length; i += 1) { + const node = nodes[i]! + if (i === 0) { + ops.push(parentId ? { node, parentId } : { node }) + } else { + ops.push({ node }) + } + } + const createNodes = state.createNodes + if (createNodes) { + createNodes(ops) + } else { + for (const op of ops) { + state.createNode(op.node, op.parentId) + } + } + return rootId + }, } } diff --git a/packages/core/src/registry/subtree.test.ts b/packages/core/src/registry/subtree.test.ts new file mode 100644 index 000000000..726d10c70 --- /dev/null +++ b/packages/core/src/registry/subtree.test.ts @@ -0,0 +1,164 @@ +import { describe, expect, test } from 'bun:test' +import type { AnyNode, AnyNodeId } from '../schema/types' +import { buildSubtreeSnapshot, materializeSubtree } from './subtree' + +function makeNode(id: string, type: string, extra: Record = {}): AnyNode { + return { + object: 'node', + id, + type, + parentId: null, + visible: true, + metadata: {}, + ...extra, + } as unknown as AnyNode +} + +describe('buildSubtreeSnapshot', () => { + test('returns null for missing root', () => { + expect(buildSubtreeSnapshot({}, 'missing' as AnyNodeId)).toBeNull() + }) + + test('strips id / parentId / position / wallId from the root', () => { + const nodes: Record = { + ['door_1' as AnyNodeId]: makeNode('door_1', 'door', { + parentId: 'level_1', + position: [1, 2, 3], + wallId: 'wall_x', + wallT: 0.4, + width: 0.9, + height: 2.1, + }), + } + const snap = buildSubtreeSnapshot(nodes, 'door_1' as AnyNodeId) + expect(snap).not.toBeNull() + expect((snap?.root as any).id).toBeUndefined() + expect((snap?.root as any).parentId).toBeUndefined() + expect((snap?.root as any).position).toBeUndefined() + expect((snap?.root as any).wallId).toBeUndefined() + expect((snap?.root as any).wallT).toBeUndefined() + expect((snap?.root as any).width).toBe(0.9) + expect((snap?.root as any).height).toBe(2.1) + expect(snap?.rootKind).toBe('door') + }) + + test('captures descendants via the children array', () => { + const nodes: Record = { + ['shelf_1' as AnyNodeId]: makeNode('shelf_1', 'shelf', { + position: [5, 0, 5], + children: ['item_a', 'item_b'], + width: 1, + }), + ['item_a' as AnyNodeId]: makeNode('item_a', 'item', { + parentId: 'shelf_1', + position: [0, 0, 0], + }), + ['item_b' as AnyNodeId]: makeNode('item_b', 'item', { + parentId: 'shelf_1', + position: [0.3, 0, 0], + }), + } + const snap = buildSubtreeSnapshot(nodes, 'shelf_1' as AnyNodeId) + expect(snap?.descendants).toHaveLength(2) + // Descendants keep their local positions. + expect((snap?.descendants[0] as any).position).toEqual([0, 0, 0]) + expect((snap?.descendants[1] as any).position).toEqual([0.3, 0, 0]) + // Internal child references rewritten to tokens, not original ids. + const childTokens = (snap?.root as any).children as string[] + expect(childTokens).toHaveLength(2) + for (const t of childTokens) { + expect(t.includes('::')).toBe(true) + expect(t.startsWith('item::')).toBe(true) + } + }) +}) + +describe('materializeSubtree', () => { + test('round-trips a single-node snapshot at a new position with fresh ids', () => { + const original = makeNode('door_orig', 'door', { + position: [1, 2, 3], + wallId: 'wall_x', + width: 0.9, + height: 2.1, + }) + const snap = buildSubtreeSnapshot( + { ['door_orig' as AnyNodeId]: original }, + 'door_orig' as AnyNodeId, + ) + if (!snap) throw new Error('snap') + + const { rootId, nodes } = materializeSubtree(snap, [10, 0, -4]) + expect(nodes).toHaveLength(1) + const newRoot = nodes[0] as any + expect(newRoot.id).toBe(rootId) + expect(newRoot.id).not.toBe('door_orig') + expect(newRoot.id.startsWith('door_')).toBe(true) + expect(newRoot.parentId).toBeNull() + expect(newRoot.position).toEqual([10, 0, -4]) + // Host ref was stripped at snapshot time; materialize doesn't re-add it. + expect(newRoot.wallId).toBeUndefined() + // Parametric fields preserved verbatim. + expect(newRoot.width).toBe(0.9) + expect(newRoot.height).toBe(2.1) + }) + + test('preserves a parent/child subtree with remapped ids and relative positions', () => { + const nodes: Record = { + ['shelf_1' as AnyNodeId]: makeNode('shelf_1', 'shelf', { + position: [5, 0, 5], + children: ['item_a', 'item_b'], + width: 1, + }), + ['item_a' as AnyNodeId]: makeNode('item_a', 'item', { + parentId: 'shelf_1', + position: [0, 0, 0], + }), + ['item_b' as AnyNodeId]: makeNode('item_b', 'item', { + parentId: 'shelf_1', + position: [0.3, 0, 0], + }), + } + const snap = buildSubtreeSnapshot(nodes, 'shelf_1' as AnyNodeId)! + const { rootId, nodes: out } = materializeSubtree(snap, [99, 0, -99]) + expect(out).toHaveLength(3) + const root = out[0] as any + expect(root.id).toBe(rootId) + expect(root.id).not.toBe('shelf_1') + expect(root.position).toEqual([99, 0, -99]) + // Children point at fresh ids that exist in the output. + const ids = new Set(out.map((n) => (n as any).id)) + expect(root.children).toHaveLength(2) + for (const cid of root.children) expect(ids.has(cid)).toBe(true) + // Descendant parentIds point at the new root id. + for (let i = 1; i < out.length; i += 1) { + const desc = out[i] as any + expect(desc.parentId).toBe(rootId) + // Position preserved. + expect(Array.isArray(desc.position)).toBe(true) + } + // Internal-token metadata is gone. + for (const node of out) { + const md = (node as any).metadata ?? {} + expect(md.__subtreeKey).toBeUndefined() + } + }) + + test('two materializations yield disjoint id sets', () => { + const nodes: Record = { + ['shelf_1' as AnyNodeId]: makeNode('shelf_1', 'shelf', { + position: [0, 0, 0], + children: ['item_a'], + }), + ['item_a' as AnyNodeId]: makeNode('item_a', 'item', { + parentId: 'shelf_1', + position: [0, 0, 0], + }), + } + const snap = buildSubtreeSnapshot(nodes, 'shelf_1' as AnyNodeId)! + const first = materializeSubtree(snap, [0, 0, 0]) + const second = materializeSubtree(snap, [1, 0, 0]) + const idsA = new Set(first.nodes.map((n) => (n as any).id)) + const idsB = new Set(second.nodes.map((n) => (n as any).id)) + for (const id of idsA) expect(idsB.has(id)).toBe(false) + }) +}) diff --git a/packages/core/src/registry/subtree.ts b/packages/core/src/registry/subtree.ts new file mode 100644 index 000000000..7c9aac3aa --- /dev/null +++ b/packages/core/src/registry/subtree.ts @@ -0,0 +1,278 @@ +import { generateId } from '../schema/base' +import type { AnyNode, AnyNodeId } from '../schema/types' + +// A serializable, location-independent snapshot of a single-root node +// subtree — designed to round-trip through JSON storage (the unified +// `items` catalog's `node_data` column) and re-materialize at a new +// position with fresh IDs. +// +// Stripping rules applied at snapshot time: +// 1. `id` is removed from the root and every descendant; the host's +// `parentId` on the root is removed too. Fresh IDs are minted at +// materialize time, and parent / child references are rewritten +// with the new IDs. +// 2. The root's absolute world `position` is stripped — the placement +// site decides where the preset lands. Descendants keep their +// positions verbatim because those are local-to-parent (still valid +// after the root is repositioned). +// 3. Host anchor fields on the root are stripped: `wallId` (doors, +// windows, items hosted on walls) and `wallT` (linear parameter +// along the wall). They are re-derived at materialize time by the +// consumer's auto-attach UX (drop a door on a wall → re-anchor). +// 4. Every other field — `rotation`, parametric fields, `children`, +// `metadata`, schema-defined defaults — is preserved verbatim. +// +// The shape is intentionally a plain `AnyNode`-shaped record (with the +// id/parentId-bearing properties optional) plus a flat descendants +// array, rather than a recursive tree, so consumers parsing it through +// a kind's Zod schema land in the same world as `createNode` (one node +// per registry entry, container fields holding ID arrays). + +export type SubtreeNode = Omit & { + // Children on container kinds are kept as either an array of legacy + // descendant IDs (subtree-relative — re-mapped at materialize time) + // or an array of fresh prefixes the materializer turns into IDs. We + // preserve the original strings verbatim and rebuild a fresh ID map + // at materialize time. + children?: AnyNodeId[] +} + +export type NodeSubtree = { + /** Kind of the root node — duplicated from `root.type` for cheap lookups before parsing. */ + rootKind: string + /** Root node, with id / parentId / absolute position / host refs stripped. */ + root: SubtreeNode + /** Flat list of descendants. Each carries its `parentId` pointing inside the subtree. */ + descendants: SubtreeNode[] + /** + * Stable internal IDs (UUID-free, only valid within this snapshot) so + * `parentId` / `children` arrays inside `descendants` can reference + * each other. The materialize step minted fresh real IDs and remaps + * these tokens to them. + */ + internalIds: { + rootKey: string + /** Per-descendant token. `descendants[i].metadata.__subtreeKey` carries the same string. */ + descendantKeys: string[] + } +} + +const SUBTREE_KEY = '__subtreeKey' + +function getDescendantIds(node: AnyNode): AnyNodeId[] { + if ('children' in node && Array.isArray((node as { children?: unknown }).children)) { + return (node as { children: AnyNodeId[] }).children + } + return [] +} + +function stripRootFields(node: AnyNode): SubtreeNode { + // Doors / windows / wall-hosted items carry `wallId`; doors / windows + // also carry `side`, but `side` is a logical wall-side declaration the + // re-attach UX can re-derive from cursor + hit normal. Keeping it on + // descendants is fine — only the root is ever re-anchored. + const { + id: _id, + parentId: _parentId, + position: _position, + wallId: _wallId, + wallT: _wallT, + ...rest + } = node as AnyNode & { + position?: unknown + wallId?: unknown + wallT?: unknown + } + return rest as SubtreeNode +} + +function stripDescendantFields(node: AnyNode): SubtreeNode { + // Descendants keep their `parentId` — it's been rewritten to point at + // the parent's internal token by the caller, and `materializeSubtree` + // reads it to re-anchor the descendant under the freshly-minted root. + // Only `id` is stripped (a fresh one is minted at materialize time). + const { id: _id, ...rest } = node + return rest as SubtreeNode +} + +/** + * Build a {@link NodeSubtree} snapshot rooted at `rootId`. Walks the + * `children` array recursively, so any kind that participates in the + * scene-graph's containment model is captured (slab → ceiling holes + * stay on the slab, stair → segments, roof → segments, shelf → items). + * + * Returns `null` if `rootId` is missing from `nodes`. + */ +export function buildSubtreeSnapshot( + nodes: Readonly>, + rootId: AnyNodeId, +): NodeSubtree | null { + const rootNode = nodes[rootId] + if (!rootNode) return null + + // Collect every node id reachable from the root via `children`. + // FIFO walk so siblings keep their original `children` array order + // in `descendants` — important for kinds where order is semantic + // (stair segments, roof segments). The root lands at index 0. + const subtreeIds: AnyNodeId[] = [] + const seen = new Set() + const queue: AnyNodeId[] = [rootId] + let head = 0 + while (head < queue.length) { + const id = queue[head++]! + if (seen.has(id)) continue + const node = nodes[id] + if (!node) continue + seen.add(id) + subtreeIds.push(id) + for (const childId of getDescendantIds(node)) queue.push(childId) + } + + // Assign internal tokens. Mirror the existing id prefix so the + // generated IDs at materialize time keep the same `wall_…`, `door_…` + // shape — helpful for debugging and lookup heuristics. + const idToKey = new Map() + let counter = 0 + for (const id of subtreeIds) { + const prefix = id.includes('_') ? id.slice(0, id.indexOf('_')) : 'node' + idToKey.set(id, `${prefix}::${counter++}`) + } + const rootKey = idToKey.get(rootId)! + + // Clone + rewrite each node so internal references point at tokens + // instead of original ids. Tokens land in `metadata.__subtreeKey` + // for descendants so we can re-discover them at materialize time. + const descendants: SubtreeNode[] = [] + let rootStripped: SubtreeNode | null = null + + for (const id of subtreeIds) { + const original = nodes[id] + if (!original) continue + // Deep-clone via JSON: strips three.js refs / functions / circular + // links (same trick `cloneLevelSubtree` uses for runtime nodes). + const cloned = JSON.parse(JSON.stringify(original)) as AnyNode + // Rewrite children to tokens. + if ('children' in cloned && Array.isArray((cloned as { children?: unknown }).children)) { + ;(cloned as { children: unknown }).children = (cloned as { children: AnyNodeId[] }).children + .map((cid) => idToKey.get(cid)) + .filter((key): key is string => key !== undefined) as unknown as AnyNodeId[] + } + // Rewrite parentId on descendants to point at the parent's token. + if (id !== rootId && cloned.parentId) { + const parentKey = idToKey.get(cloned.parentId as AnyNodeId) + ;(cloned as { parentId: string | null }).parentId = parentKey ?? null + } + if (id === rootId) { + rootStripped = stripRootFields(cloned) + } else { + const stripped = stripDescendantFields(cloned) + const meta = (stripped as { metadata?: Record }).metadata + ;(stripped as { metadata?: Record }).metadata = { + ...(meta ?? {}), + [SUBTREE_KEY]: idToKey.get(id), + } + descendants.push(stripped) + } + } + + if (!rootStripped) return null + + return { + rootKind: rootNode.type, + root: rootStripped, + descendants, + internalIds: { + rootKey, + descendantKeys: descendants.map((d) => { + const meta = (d as { metadata?: Record }).metadata + return (meta?.[SUBTREE_KEY] as string) ?? '' + }), + }, + } +} + +export type MaterializedSubtree = { + /** Fresh id assigned to the root. */ + rootId: AnyNodeId + /** Every materialized node, root first, ready to feed into `createNodes`. */ + nodes: AnyNode[] + /** Internal-token → fresh-id map, mostly useful for tests. */ + idMap: Map +} + +/** + * Re-hydrate a {@link NodeSubtree} into a flat list of real nodes with + * fresh IDs. The caller decides where to insert them — typically by + * passing `nodes[0]` as the root op to `createNodes`, with `parentId` + * set to the active level / wall / parent surface — and `position` is + * stamped onto the root before materializing. + * + * Stripping is reversed: the root receives the supplied `position`; + * host anchor fields (wallId / wallT) stay absent and must be filled + * by the caller's auto-attach pass when applicable. + * + * The returned `nodes` are NOT parsed through the Zod schemas — the + * caller is responsible for `def.schema.parse(...)` before insertion + * if it wants schema-default merging. `createNode` re-validates via + * the registry, so unsafe payloads can't slip into the scene store. + */ +export function materializeSubtree( + subtree: NodeSubtree, + position: readonly [number, number, number], +): MaterializedSubtree { + const idMap = new Map() + + function tokenToId(token: string): AnyNodeId { + const existing = idMap.get(token) + if (existing) return existing + const prefix = token.includes('::') ? token.slice(0, token.indexOf('::')) : 'node' + const fresh = generateId(prefix) as AnyNodeId + idMap.set(token, fresh) + return fresh + } + + const rootId = tokenToId(subtree.internalIds.rootKey) + + // Reserve fresh IDs for all descendants up-front so children arrays + // resolve regardless of declaration order. + for (const key of subtree.internalIds.descendantKeys) tokenToId(key) + + function remap(node: SubtreeNode, freshId: AnyNodeId, parentId: AnyNodeId | null): AnyNode { + const remapped = JSON.parse(JSON.stringify(node)) as AnyNode + ;(remapped as { id: AnyNodeId }).id = freshId + ;(remapped as { parentId: AnyNodeId | null }).parentId = parentId + if ('children' in remapped && Array.isArray((remapped as { children?: unknown }).children)) { + ;(remapped as { children: AnyNodeId[] }).children = ( + remapped as { children: string[] } + ).children + .map((token) => idMap.get(token)) + .filter((id): id is AnyNodeId => id !== undefined) + } + // Strip the internal-token marker — irrelevant once materialized. + const meta = (remapped as { metadata?: Record }).metadata + if (meta && SUBTREE_KEY in meta) { + const { [SUBTREE_KEY]: _drop, ...rest } = meta + ;(remapped as { metadata: Record }).metadata = rest + } + return remapped + } + + const rootNode = remap(subtree.root, rootId, null) + ;(rootNode as { position: [number, number, number] }).position = [ + position[0], + position[1], + position[2], + ] + + const out: AnyNode[] = [rootNode] + for (let i = 0; i < subtree.descendants.length; i += 1) { + const descendant = subtree.descendants[i]! + const token = subtree.internalIds.descendantKeys[i]! + const freshId = tokenToId(token) + const parentToken = (descendant as { parentId?: string | null }).parentId ?? null + const parentFreshId = parentToken ? (idMap.get(parentToken) ?? null) : null + out.push(remap(descendant, freshId, parentFreshId)) + } + + return { rootId, nodes: out, idMap } +} diff --git a/packages/core/src/registry/types.ts b/packages/core/src/registry/types.ts index 6f80cfdc3..41d75f4db 100644 --- a/packages/core/src/registry/types.ts +++ b/packages/core/src/registry/types.ts @@ -4,6 +4,7 @@ import type { ZodObject, z } from 'zod' import type { MaterialSchema } from '../schema/material' import type { AnyNode, AnyNodeId } from '../schema/types' import type { HandleList } from './handles' +import type { NodeSubtree } from './subtree' // ─── GeometryContext ───────────────────────────────────────────────── // @@ -970,6 +971,24 @@ export type Capabilities = { * declaring the same flag. */ floorplanLevelContainer?: boolean + /** + * Whether instances of this kind can be saved as a reusable preset + * (unified `items` catalog, `kind='preset'`). The editor itself does + * not act on this flag — host apps read it to gate "save as preset" + * UI on the selected node. Default resolution (callers should use the + * `isPresettable(def)` helper rather than reading this directly): + * + * - explicit `true` → presettable + * - explicit `false` → not presettable + * - undefined → presettable when `def.parametrics` exists + * + * Structural / utility kinds (level, building, site, zone, spawn, + * guide, scan, item) opt out explicitly because saving them as a + * standalone preset has no meaning — items already have their own + * catalog, scans/guides carry user-uploaded imagery, and the rest + * are non-leaf scene containers. + */ + presettable?: boolean } /** @@ -1282,6 +1301,24 @@ export type SceneApi = { markDirty: (id: AnyNodeId) => void pauseHistory: () => void resumeHistory: () => void + /** + * Build a {@link NodeSubtree} snapshot rooted at `rootId` — a + * serializable, location-independent payload suitable for storage + * in the unified `items` catalog. See {@link buildSubtreeSnapshot} + * for the stripping rules. Returns `null` if `rootId` is missing. + */ + getSubtreeSnapshot: (rootId: AnyNodeId) => NodeSubtree | null + /** + * Re-hydrate a {@link NodeSubtree} into the scene at `position`. The + * root and every descendant get fresh IDs; the root is parented to + * `parentId` (when provided) or becomes a scene root. Returns the + * new root id, or `null` if the subtree had no root node. + */ + materializeSubtree: ( + subtree: NodeSubtree, + position: readonly [number, number, number], + parentId?: AnyNodeId, + ) => AnyNodeId | null } // ─── Registry surface ──────────────────────────────────────────────── diff --git a/packages/core/src/services/drag-session.test.ts b/packages/core/src/services/drag-session.test.ts index 29869f81b..129a4b85c 100644 --- a/packages/core/src/services/drag-session.test.ts +++ b/packages/core/src/services/drag-session.test.ts @@ -52,6 +52,8 @@ function makeSpyScene(initial: Record = {}): SceneApi & { resumeHistory: () => { calls.resumeHistory += 1 }, + getSubtreeSnapshot: () => null, + materializeSubtree: () => null, _calls: calls, } } diff --git a/packages/core/src/services/hosting.test.ts b/packages/core/src/services/hosting.test.ts index e3ae6cb20..9a4ba8087 100644 --- a/packages/core/src/services/hosting.test.ts +++ b/packages/core/src/services/hosting.test.ts @@ -52,6 +52,8 @@ function makeFakeScene(nodes: Record): SceneApi { markDirty: () => {}, pauseHistory: () => {}, resumeHistory: () => {}, + getSubtreeSnapshot: () => null, + materializeSubtree: () => null, } } diff --git a/packages/editor/src/components/editor/snapshot-capture-overlay.tsx b/packages/editor/src/components/editor/snapshot-capture-overlay.tsx index d86325959..99532a909 100644 --- a/packages/editor/src/components/editor/snapshot-capture-overlay.tsx +++ b/packages/editor/src/components/editor/snapshot-capture-overlay.tsx @@ -7,7 +7,11 @@ import { useIsMobile } from '../../hooks/use-mobile' import { triggerSFX } from '../../lib/sfx-bus' import useEditor from '../../store/use-editor' -type CaptureMode = 'standard' | 'viewport' | 'area' +// Local crop-mode enum — distinct from `useEditor.captureMode` (which +// describes *why* a capture is happening, e.g. `preset`). This one says +// HOW the captured pixels are cropped: full-frame 16:9 (`standard`), +// raw canvas viewport, or user-dragged area. +type CropMode = 'standard' | 'viewport' | 'area' type CaptureState = 'idle' | 'capturing' | 'saved' interface DragPoint { @@ -21,7 +25,7 @@ interface Drag { } function getResolution( - mode: CaptureMode, + mode: CropMode, overlayEl: HTMLDivElement | null, drag: Drag | null, ): { w: number; h: number } | null { @@ -47,10 +51,15 @@ function getResolution( export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { const isCaptureMode = useEditor((s) => s.isCaptureMode) + const captureMode = useEditor((s) => s.captureMode) const setCaptureMode = useEditor((s) => s.setCaptureMode) const isMobile = useIsMobile() + // `preset` capture mode locks the overlay to a square area crop with + // a transparent background — the user picks framing but not the + // crop shape. Matches the unified preset-thumbnail capture flow. + const isPreset = captureMode.mode === 'preset' - const [mode, setMode] = useState('standard') + const [mode, setMode] = useState('standard') const [drag, setDrag] = useState(null) const [isDragging, setIsDragging] = useState(false) const [captureState, setCaptureState] = useState('idle') @@ -66,15 +75,16 @@ export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { return () => window.removeEventListener('keydown', onKey) }, [isCaptureMode, setCaptureMode]) - // Reset local state when entering capture mode + // Reset local state when entering capture mode. Preset mode forces + // `area` so the overlay shows the square selection rect immediately. useEffect(() => { if (isCaptureMode) { - setMode('standard') + setMode(isPreset ? 'area' : 'standard') setDrag(null) setIsDragging(false) setCaptureState('idle') } - }, [isCaptureMode]) + }, [isCaptureMode, isPreset]) // Listen for snapshot saved to show feedback then exit useEffect(() => { @@ -142,11 +152,28 @@ export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { start: { x: snapshot.start.x + dx, y: snapshot.start.y + dy }, end: { x: snapshot.end.x + dx, y: snapshot.end.y + dy }, }) + } else if (isPreset) { + // Preset mode locks the rect to a square — use the smaller + // axis to keep the drag predictable, sign-correct so the user + // can still drag in any quadrant. + setDrag((d) => { + if (!d) return null + const dx = pt.x - d.start.x + const dy = pt.y - d.start.y + const side = Math.min(Math.abs(dx), Math.abs(dy)) + return { + start: d.start, + end: { + x: d.start.x + Math.sign(dx || 1) * side, + y: d.start.y + Math.sign(dy || 1) * side, + }, + } + }) } else { setDrag((d) => (d ? { start: d.start, end: pt } : null)) } }, - [isDragging], + [isDragging, isPreset], ) const onPointerUp = useCallback(() => { @@ -225,8 +252,12 @@ export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { projectId, captureMode: mode, cropRegion, + // In preset mode, the ThumbnailGenerator should keep the alpha + // channel transparent so the saved preset thumbnail composes + // cleanly onto any palette background. + transparent: isPreset, }) - }, [captureState, mode, drag, projectId]) + }, [captureState, mode, drag, projectId, isPreset]) if (!isCaptureMode) return null @@ -343,7 +374,10 @@ export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { {/* Bottom-center mode toolbar */}
{(() => { - const modeButtons = ( + // Preset capture mode locks both the crop shape (square) and + // the transparent-background output — hide the per-shape + // mode buttons so the user has nothing to second-guess. + const modeButtons = isPreset ? null : ( <> -
{modeButtons}
-
+ {modeButtons && ( +
{modeButtons}
+ )} +
{resolutionDisplay} {captureButton}
@@ -420,7 +462,7 @@ export function SnapshotCaptureOverlay({ projectId }: { projectId: string }) { return (
{modeButtons} -
+ {modeButtons &&
} {resolutionDisplay}
{captureButton} diff --git a/packages/editor/src/components/editor/thumbnail-generator.tsx b/packages/editor/src/components/editor/thumbnail-generator.tsx index d23812f27..e81cde62d 100644 --- a/packages/editor/src/components/editor/thumbnail-generator.tsx +++ b/packages/editor/src/components/editor/thumbnail-generator.tsx @@ -461,6 +461,11 @@ export const ThumbnailGenerator = ({ onThumbnailCapture }: ThumbnailGeneratorPro captureMode?: 'standard' | 'viewport' | 'area' cropRegion?: { x: number; y: number; width: number; height: number } snapLevels?: boolean + // `transparent` is informational here — the render pipeline already + // captures with alpha (see `setClearAlpha(0)` above) — the flag is + // forwarded so future tweaks (suppressing the ground occluder, theme + // background bits) can branch on it without touching the emitter. + transparent?: boolean }) => { await generate(event.snapLevels === true, event.captureMode, event.cropRegion) } diff --git a/packages/editor/src/hooks/use-selection.ts b/packages/editor/src/hooks/use-selection.ts new file mode 100644 index 000000000..0a118f8a4 --- /dev/null +++ b/packages/editor/src/hooks/use-selection.ts @@ -0,0 +1,64 @@ +'use client' + +import type { AnyNode, AnyNodeId } from '@pascal-app/core' +import { useScene } from '@pascal-app/core' +import { useViewer } from '@pascal-app/viewer' + +/** + * Resolved current selection — selected node IDs plus a convenience + * lookup into the live scene store. Returned shape is intentionally + * narrow: hosts that need richer per-node state can compose this with + * `useScene()` themselves. + */ +export type Selection = { + /** Multi-select node IDs (drives the rest of the editor's UI). */ + selectedIds: AnyNodeId[] + /** Currently active building context — surfaces / palettes filter on this. */ + buildingId: AnyNodeId | null + /** Currently active level context. */ + levelId: AnyNodeId | null + /** Currently active zone context. */ + zoneId: AnyNodeId | null + /** + * Resolved nodes for `selectedIds`. Missing entries (deleted nodes) are + * filtered out, so the array length may be ≤ `selectedIds.length`. + */ + selectedNodes: AnyNode[] + /** + * The single selected node, or `null` when zero or multiple nodes are + * selected. Useful for "save as preset" / inspector gating where the + * UI only makes sense for a unique selection. + */ + selectedNode: AnyNode | null +} + +/** + * Subscribe to the current selection. Equivalent to reading from + * `useViewer().selection` plus a live `useScene()` lookup, packaged as + * a single hook so consumers building their own shells (community, + * standalone editor app, embedders) don't have to learn the two + * separate stores. + * + * Selection state intentionally lives in `useViewer` (it tracks the + * camera / visibility hierarchy: building → level → zone → nodes), not + * `useScene` — see `wiki/architecture/scene-registry.md`. + */ +export function useSelection(): Selection { + const selection = useViewer((s) => s.selection) + const nodes = useScene((s) => s.nodes) + + const selectedIds = selection.selectedIds as AnyNodeId[] + const selectedNodes = selectedIds + .map((id) => nodes[id]) + .filter((n): n is AnyNode => n !== undefined) + const selectedNode = selectedNodes.length === 1 ? (selectedNodes[0] ?? null) : null + + return { + selectedIds, + buildingId: (selection.buildingId ?? null) as AnyNodeId | null, + levelId: (selection.levelId ?? null) as AnyNodeId | null, + zoneId: (selection.zoneId ?? null) as AnyNodeId | null, + selectedNodes, + selectedNode, + } +} diff --git a/packages/editor/src/index.tsx b/packages/editor/src/index.tsx index c4ead4eed..476bf94c4 100644 --- a/packages/editor/src/index.tsx +++ b/packages/editor/src/index.tsx @@ -1,5 +1,17 @@ +// Re-exports of the scene / viewer hooks so consumers composing their +// own shells on top of `@pascal-app/editor` (community-app, embedders) +// don't have to learn three separate package imports. The canonical +// definitions still live in `@pascal-app/core` / `@pascal-app/viewer`. +export { useScene } from '@pascal-app/core' +export { useViewer } from '@pascal-app/viewer' export type { EditorProps } from './components/editor' export { default as Editor } from './components/editor' +// Headless component aliases: the implementation files keep their +// internal names (`ParametricInspector`, `FloatingActionMenu`) because +// they're referenced throughout the editor's own internals; the public +// surface uses the shorter, shell-friendly names from the unified +// preset-system spec. +export { FloatingActionMenu as FloatingMenu } from './components/editor/floating-action-menu' export { type SnapshotCameraData, ThumbnailGenerator, @@ -89,8 +101,19 @@ export { WALL_FINE_GRID_STEP, type WallPlanPoint, } from './components/tools/wall/wall-drafting' -export { CameraActions as ViewerToolbarRight } from './components/ui/action-menu/camera-actions' -export { ViewToggles as ViewerToolbarLeft } from './components/ui/action-menu/view-toggles' +// `ToolbarLeft` / `ToolbarRight` are the headless-spec aliases for the +// existing `ViewerToolbarLeft` / `ViewerToolbarRight` exports — the +// underlying components are the same; the alias just matches the names +// used in `pascalorg/private-editor:plans/community-preset-system.md` +// so consumer code stays close to the spec vocabulary. +export { + CameraActions as ToolbarRight, + CameraActions as ViewerToolbarRight, +} from './components/ui/action-menu/camera-actions' +export { + ViewToggles as ToolbarLeft, + ViewToggles as ViewerToolbarLeft, +} from './components/ui/action-menu/view-toggles' export { useCommandPalette } from './components/ui/command-palette' export { ActionButton, ActionGroup } from './components/ui/controls/action-button' export { MaterialPicker } from './components/ui/controls/material-picker' @@ -107,6 +130,7 @@ export { CollectionsPopover } from './components/ui/panels/collections/collectio // ceiling height presets, etc.) use `parametrics.customPanel` to mount // a kind-owned panel and need PanelWrapper for the chrome. export { PanelWrapper } from './components/ui/panels/panel-wrapper' +export { ParametricInspector as Inspector } from './components/ui/panels/parametric-inspector' // Presets popover — used by kind-owned door / window panels for their // hardware / type / opening presets. export { PresetsPopover } from './components/ui/panels/presets/presets-popover' @@ -138,6 +162,7 @@ export type { SaveStatus } from './hooks/use-auto-save' export { type UseDragActionArgs, useDragAction } from './hooks/use-drag-action' // Phase 5 Stage D — extras for kind-owned placement tools (FenceTool etc.). export { markToolCancelConsumed } from './hooks/use-keyboard' +export { type Selection, useSelection } from './hooks/use-selection' export { EDITOR_LAYER } from './lib/constants' // Helper libs used by the kind-owned roof / stair / elevator panels. export { diff --git a/packages/editor/src/store/use-editor.tsx b/packages/editor/src/store/use-editor.tsx index 0b0d74248..b1b37adc0 100644 --- a/packages/editor/src/store/use-editor.tsx +++ b/packages/editor/src/store/use-editor.tsx @@ -48,6 +48,20 @@ const MAX_FLOORPLAN_PANE_RATIO = 0.85 export type ViewMode = '3d' | '2d' | 'split' export type SplitOrientation = 'horizontal' | 'vertical' +// Snapshot capture is invoked from two surfaces with different policies. +// `standard` mirrors the existing user-driven UX — pick region / viewport / +// area, save the blob as a project thumbnail. `preset` is the constrained +// variant for the unified preset capture flow (community save-as-preset +// modal): the overlay locks to a square crop, the renderer clears alpha +// (transparent background), and the rendered set is locked to `isolated` +// — `ThumbnailGenerator` consults `captureMode.mode === 'preset'` and +// applies those constraints. Keeping it a discriminated union lets us +// add future modes without surfacing the choice to end users. +export type CaptureMode = + | { mode: 'idle' } + | { mode: 'standard' } + | { mode: 'preset'; isolated: AnyNodeId[] } + export type Phase = 'site' | 'structure' | 'furnish' export type Mode = 'select' | 'edit' | 'delete' | 'build' | 'material-paint' @@ -253,9 +267,16 @@ type EditorState = { // Preview mode (viewer-like experience inside the editor) isPreviewMode: boolean setPreviewMode: (preview: boolean) => void - // Capture mode (snapshot toolbar — hides panels for clean framing) + // Capture mode (snapshot toolbar — hides panels for clean framing). + // `captureMode` is the canonical discriminated-union state; the boolean + // `isCaptureMode` is kept synced as a derived convenience for the many + // existing read sites that just gate chrome visibility on "is capture + // active". New write sites should pass a `CaptureMode` shape; passing a + // boolean is accepted as a back-compat shim (`true` → `'standard'`, + // `false` → `'idle'`). + captureMode: CaptureMode isCaptureMode: boolean - setCaptureMode: (active: boolean) => void + setCaptureMode: (next: boolean | CaptureMode) => void // View mode (3D only, 2D only, or split 2D+3D) viewMode: ViewMode setViewMode: (mode: ViewMode) => void @@ -287,7 +308,6 @@ type EditorState = { setFirstPersonMode: (enabled: boolean) => void activeSidebarPanel: string setActiveSidebarPanel: (id: string) => void - setIsCaptureMode: (enabled: boolean) => void floorplanPaneRatio: number setFloorplanPaneRatio: (ratio: number) => void // Mobile-only: pixel height of the secondary panel sheet while open (0 when closed). @@ -739,8 +759,13 @@ const useEditor = create()( set({ isPreviewMode: false }) } }, + captureMode: { mode: 'idle' } as CaptureMode, isCaptureMode: false, - setCaptureMode: (active) => set({ isCaptureMode: active }), + setCaptureMode: (next) => { + const resolved: CaptureMode = + typeof next === 'boolean' ? { mode: next ? 'standard' : 'idle' } : next + set({ captureMode: resolved, isCaptureMode: resolved.mode !== 'idle' }) + }, viewMode: DEFAULT_PERSISTED_EDITOR_UI_STATE.viewMode, setViewMode: (mode) => set({ viewMode: mode, isFloorplanOpen: mode !== '3d' }), splitOrientation: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.splitOrientation, @@ -795,7 +820,6 @@ const useEditor = create()( }, activeSidebarPanel: DEFAULT_ACTIVE_SIDEBAR_PANEL, setActiveSidebarPanel: (id) => set({ activeSidebarPanel: id }), - setIsCaptureMode: (enabled) => set({ isCaptureMode: enabled }), floorplanPaneRatio: DEFAULT_PERSISTED_EDITOR_LAYOUT_STATE.floorplanPaneRatio, setFloorplanPaneRatio: (ratio) => set({ floorplanPaneRatio: normalizeFloorplanPaneRatio(ratio) }), diff --git a/packages/nodes/src/building/definition.ts b/packages/nodes/src/building/definition.ts index 4f050ce38..207733a14 100644 --- a/packages/nodes/src/building/definition.ts +++ b/packages/nodes/src/building/definition.ts @@ -28,6 +28,7 @@ export const buildingDefinition: NodeDefinition = { duplicable: false, deletable: false, floorplanLevelContainer: true, + presettable: false, }, parametrics: buildingParametrics, diff --git a/packages/nodes/src/guide/definition.ts b/packages/nodes/src/guide/definition.ts index 5eff55a8f..49985f837 100644 --- a/packages/nodes/src/guide/definition.ts +++ b/packages/nodes/src/guide/definition.ts @@ -24,6 +24,9 @@ export const guideDefinition: NodeDefinition = { selectable: { hitVolume: 'bbox' }, duplicable: false, deletable: true, + // Guides are scene-specific measurement annotations — saving them + // as reusable catalog items has no meaning. + presettable: false, }, parametrics: guideParametrics, diff --git a/packages/nodes/src/item/definition.ts b/packages/nodes/src/item/definition.ts index 3f54947f1..400bd1ba4 100644 --- a/packages/nodes/src/item/definition.ts +++ b/packages/nodes/src/item/definition.ts @@ -72,6 +72,10 @@ export const itemDefinition: NodeDefinition = { selectable: { hitVolume: 'bbox' }, duplicable: true, deletable: true, + // The GLB-kind item already has its own catalog — the unified + // preset system treats `kind='preset'` (parametric subtree + // snapshots) and `kind='glb'` (this) as siblings, not duplicates. + presettable: false, // Floor items get lifted by slabs underneath via the generic // ``. Wall- / ceiling-attached items live in // their parent's local frame and skip the lift via `applies`. diff --git a/packages/nodes/src/level/definition.ts b/packages/nodes/src/level/definition.ts index c502a32c9..e7623f684 100644 --- a/packages/nodes/src/level/definition.ts +++ b/packages/nodes/src/level/definition.ts @@ -30,6 +30,9 @@ export const levelDefinition: NodeDefinition = { // mirror that. duplicable: false, deletable: true, + // Container kind — saving a level as a standalone preset has no + // meaning (its contents make sense only inside a building). + presettable: false, }, parametrics: levelParametrics, diff --git a/packages/nodes/src/scan/definition.ts b/packages/nodes/src/scan/definition.ts index 1edd6d0a8..f97ee2568 100644 --- a/packages/nodes/src/scan/definition.ts +++ b/packages/nodes/src/scan/definition.ts @@ -23,6 +23,9 @@ export const scanDefinition: NodeDefinition = { selectable: { hitVolume: 'bbox' }, duplicable: false, deletable: true, + // Scans carry user-uploaded imagery — cataloging them as + // reusable presets is out of scope. + presettable: false, }, parametrics: scanParametrics, diff --git a/packages/nodes/src/site/definition.ts b/packages/nodes/src/site/definition.ts index c8c2f956b..70dd62b0c 100644 --- a/packages/nodes/src/site/definition.ts +++ b/packages/nodes/src/site/definition.ts @@ -26,6 +26,7 @@ export const siteDefinition: NodeDefinition = { // override their selection). Same reasoning as `level`. duplicable: false, deletable: false, + presettable: false, }, parametrics: siteParametrics, diff --git a/packages/nodes/src/spawn/definition.ts b/packages/nodes/src/spawn/definition.ts index 45e430acc..543f98699 100644 --- a/packages/nodes/src/spawn/definition.ts +++ b/packages/nodes/src/spawn/definition.ts @@ -27,6 +27,8 @@ export const spawnDefinition: NodeDefinition = { duplicable: false, // singleton per level deletable: true, selectable: { hitVolume: 'bbox' }, + // Spawn is a singleton anchor — no meaning as a reusable preset. + presettable: false, // Slab elevation lift via the generic ``. The // spawn marker is a 1.8m-tall figure with a ~0.6m ring footprint. floorPlaced: { diff --git a/packages/nodes/src/zone/definition.ts b/packages/nodes/src/zone/definition.ts index 01c3dc728..a1e44d2e8 100644 --- a/packages/nodes/src/zone/definition.ts +++ b/packages/nodes/src/zone/definition.ts @@ -30,6 +30,9 @@ export const zoneDefinition: NodeDefinition = { selectable: { hitVolume: 'bbox' }, duplicable: true, deletable: true, + // Zones describe regions of a site — they don't translate as + // reusable presets independent of their site context. + presettable: false, }, parametrics: zoneParametrics, diff --git a/packages/viewer/src/components/viewer/index.tsx b/packages/viewer/src/components/viewer/index.tsx index 8601c0e9b..0c0e69089 100644 --- a/packages/viewer/src/components/viewer/index.tsx +++ b/packages/viewer/src/components/viewer/index.tsx @@ -1,10 +1,11 @@ 'use client' -import { StairOpeningSystem } from '@pascal-app/core' +import { type AnyNodeId, StairOpeningSystem } from '@pascal-app/core' import { Canvas, extend, type ThreeToJSXElements, useFrame, useThree } from '@react-three/fiber' -import { useEffect } from 'react' +import { forwardRef, useEffect, useImperativeHandle, useRef } from 'react' import * as THREE from 'three/webgpu' import { PERF_OVERLAY_ENABLED, pushGpuSample } from '../../lib/gpu-perf' +import { applyIsolation, clearIsolation } from '../../lib/isolation' import type { ColorPreset, RenderShading } from '../../lib/materials' import { getSceneTheme } from '../../lib/scene-themes' import useViewer, { type RenderContext } from '../../store/use-viewer' @@ -130,17 +131,63 @@ interface ViewerProps { textures?: boolean colorPreset?: ColorPreset } + /** + * Visibility filter on the live canvas. When non-null, every registered + * node group whose id is not in `isolate` (or in the isolated set's + * ancestor / descendant closure) is hidden. Pass `null` (or omit) to + * clear. Powers the unified preset-capture flow (community modal sets + * this to the subtree it wants to thumbnail) and is the building block + * for a future focus-mode UX. + */ + isolate?: AnyNodeId[] | null } -const Viewer: React.FC = ({ - children, - hoverStyles = DEFAULT_HOVER_STYLES, - selectionManager = 'default', - perf = false, - useBvh = true, - renderContext = 'editor', - defaultRender, -}) => { +/** Imperative handle exposed via `ref` on ``. */ +export type ViewerHandle = { + /** + * Apply / clear the same visibility filter as the `isolate` prop. Useful + * for transient cases (a temporary hover-to-isolate UX) where holding + * the value in React state would be over-engineering. Passing `null` + * clears. + */ + setIsolated(ids: AnyNodeId[] | null): void +} + +const Viewer = forwardRef(function Viewer( + { + children, + hoverStyles = DEFAULT_HOVER_STYLES, + selectionManager = 'default', + perf = false, + useBvh = true, + renderContext = 'editor', + defaultRender, + isolate, + }, + ref, +) { + useImperativeHandle( + ref, + () => ({ + setIsolated: (ids) => applyIsolation(ids), + }), + [], + ) + + // Track the most recently-applied isolation so the cleanup path can + // restore visibility even if the prop is removed while the component is + // still mounted. `clearIsolation()` is a no-op when nothing was applied. + const isolateRef = useRef(undefined) + useEffect(() => { + isolateRef.current = isolate ?? null + applyIsolation(isolate ?? null) + return () => { + // Only clear if this effect was the one that applied — protects + // against a parent unmount racing with a setIsolated() consumer. + if (isolateRef.current === isolate) clearIsolation() + } + }, [isolate]) + const isDark = useViewer((state) => getSceneTheme(state.sceneTheme).appearance === 'dark') useEffect(() => { const ctx = renderContext @@ -261,7 +308,7 @@ const Viewer: React.FC = ({ ) -} +}) const DebugRenderer = () => { useFrame(({ gl, scene, camera }) => { diff --git a/packages/viewer/src/index.ts b/packages/viewer/src/index.ts index 5cdbc7b1f..fa034da39 100644 --- a/packages/viewer/src/index.ts +++ b/packages/viewer/src/index.ts @@ -12,7 +12,7 @@ export { ErrorBoundary } from './components/error-boundary' // `@pascal-app/nodes//renderer.tsx` and are loaded by the registry // — no per-kind re-exports needed. export { NodeRenderer } from './components/renderers/node-renderer' -export { default as Viewer } from './components/viewer' +export { default as Viewer, type ViewerHandle } from './components/viewer' export type { HoverStyle, HoverStyles } from './components/viewer/post-processing' export { DEFAULT_HOVER_STYLES, @@ -37,6 +37,11 @@ export { SUBTRACTION, } from './lib/csg-utils' export type { EdgeMode } from './lib/edge-style' +export { + applyIsolation, + clearIsolation, + computeIsolationVisibleSet, +} from './lib/isolation' export { GRID_LAYER, OVERLAY_LAYER, SCENE_LAYER, ZONE_LAYER } from './lib/layers' export { applyMaterialPresetToMaterials, diff --git a/packages/viewer/src/lib/isolation.ts b/packages/viewer/src/lib/isolation.ts new file mode 100644 index 000000000..83f4d88ae --- /dev/null +++ b/packages/viewer/src/lib/isolation.ts @@ -0,0 +1,96 @@ +'use client' + +import type { AnyNodeId } from '@pascal-app/core' +import { sceneRegistry, useScene } from '@pascal-app/core' +import type { Object3D } from 'three' + +// Marker stashed on each Object3D we touch during isolation so we can +// restore the original `.visible` flag. Stored under a `Symbol` so it +// can't collide with any kind's own userData fields. +const ORIGINAL_VISIBLE = Symbol('isolation:original-visible') + +type IsolationCarrier = Object3D & { [ORIGINAL_VISIBLE]?: boolean } + +/** + * Build the set of node IDs that must remain visible to "isolate" the + * provided ids — the ids themselves, every ancestor along the parent + * chain (so containers stay rendered, otherwise the scene root would go + * dark), and every descendant (so children of the isolated nodes still + * render even after we explicitly toggle individual visibility flags). + * + * Pure / no I/O — exported for testing. + */ +export function computeIsolationVisibleSet( + ids: ReadonlyArray, + nodes: Readonly>, +): Set { + const visible = new Set(ids) + + for (const id of ids) { + let parentId = nodes[id]?.parentId + while (parentId) { + visible.add(parentId) + parentId = nodes[parentId]?.parentId + } + } + + const stack: string[] = [...ids] + while (stack.length > 0) { + const current = stack.pop()! + const node = nodes[current] + const children = node && Array.isArray(node.children) ? (node.children as string[]) : [] + for (const child of children) { + if (!visible.has(child)) { + visible.add(child) + stack.push(child) + } + } + } + + return visible +} + +/** + * Imperative visibility filter on the live `sceneRegistry`. Walks every + * registered (id, Object3D) pair and toggles `obj.visible` so only nodes + * inside the isolation set remain rendered. Stashes the original visible + * flag under a private Symbol so {@link clearIsolation} can restore the + * exact prior state — important because nodes may have been hidden by + * other features (`useScene.nodes[id].visible === false`). + * + * Composite-visibility note: setting an ancestor group to `visible=true` + * is necessary because Three.js culls every descendant when an ancestor + * is hidden. The pre-image of the isolation set therefore includes both + * the ancestor chain and the descendant tree of the requested IDs. + * + * Pass `null` to clear isolation (equivalent to calling + * {@link clearIsolation}). + */ +export function applyIsolation(ids: ReadonlyArray | null): void { + if (ids == null || ids.length === 0) { + clearIsolation() + return + } + + const visible = computeIsolationVisibleSet( + ids as ReadonlyArray, + useScene.getState().nodes, + ) + for (const [id, obj] of sceneRegistry.nodes) { + const carrier = obj as IsolationCarrier + if (carrier[ORIGINAL_VISIBLE] === undefined) { + carrier[ORIGINAL_VISIBLE] = carrier.visible + } + carrier.visible = visible.has(id) + } +} + +export function clearIsolation(): void { + for (const [, obj] of sceneRegistry.nodes) { + const carrier = obj as IsolationCarrier + if (carrier[ORIGINAL_VISIBLE] !== undefined) { + carrier.visible = carrier[ORIGINAL_VISIBLE] + delete carrier[ORIGINAL_VISIBLE] + } + } +}