@things-factory/figure-ui 10.1.75 → 10.1.77

package/client/modeller/{v3-editor.ts → editor.ts}

@@ -4,41 +4,41 @@ import type { OxThreePane } from '@operato/layout'
 import '@operato/layout'
 import { customElement, property, state } from 'lit/decorators.js'
 import { live } from 'lit/directives/live.js'
-import { PART_LIMIT, parseV3Recipe, resolveV3Recipe, v3PartCountOf, v3RecipeIdFor } from '@hatiolab/figure-model'
-import type { RecipeTemplate } from './v3-recipes.js'
-import './figure-v3-recipe-catalog.js'
-import type { V3Asset, V3AuthoringAction, V3InputChange, V3PartEdit, V3PrimitiveCreation, V3ProposalStep, V3Recipe, V3RecipeValue } from '@hatiolab/figure-model'
-import type { V3ProductSession } from './v3-product-session.js'
-import { captureV3Thumbnail } from './v3-thumbnail.js'
-import { drawableV3Parts } from './v3-renderer.js'
-import './v3-canvas.js'
-import './figure-v3-parts.js'
-import './figure-v3-material.js'
-import './figure-v3-links.js'
-import './figure-v3-controls.js'
-import './figure-v3-clips.js'
-import './figure-v3-preview.js'
+import { PART_LIMIT, parseFigureRecipe, resolveFigureRecipe, figurePartCountOf, figureRecipeIdFor } from '@hatiolab/figure-model'
+import type { RecipeTemplate } from './recipes.js'
+import './figure-recipe-catalog.js'
+import type { FigureAsset, FigureAuthoringAction, FigureInputChange, FigurePartEdit, FigurePrimitiveCreation, FigureProposalStep, FigureRecipe, FigureRecipeValue } from '@hatiolab/figure-model'
+import type { FigureProductSession } from './product-session.js'
+import { captureFigureThumbnail } from './thumbnail.js'
+import { drawableFigureParts } from './renderer.js'
+import './canvas.js'
+import './figure-parts.js'
+import './figure-material-panel.js'
+import './figure-links.js'
+import './figure-controls.js'
+import './figure-clips.js'
+import './figure-preview.js'
 import './figure-settings.js'
 import { DEFAULT_VIEW, type ViewSettings } from './figure-view.js'
-import './figure-v3-capability.js'
-import { gizmoChanges, gizmoReachOf, keepBottomChanges, type GizmoReach, type GizmoResult } from './v3-gizmo.js'
-import { keyActionOf } from './v3-keys.js'
-import { groupFields, ownerOf, partLabelOf, repeatOf, type FieldLike, type FieldGroup } from './v3-fields.js'
+import './figure-capability-panel.js'
+import { gizmoChanges, gizmoReachOf, keepBottomChanges, type GizmoReach, type GizmoResult } from './gizmo.js'
+import { keyActionOf } from './keys.js'
+import { groupFields, ownerOf, partLabelOf, repeatOf, type FieldLike, type FieldGroup } from './fields.js'
 import { SidePanelStyles } from './side-panel-styles.js'
 import { ScrollbarStyles } from '@operato/styles'
-import { alignChanges, boxOf, canMirror, mirrorChanges, type AlignTool } from './v3-align.js'
-import type { V3PaletteKind, V3PartRow } from './figure-v3-parts.js'
-import { paletteRecipe } from './v3-palette.js'
-import type { FigureV3Canvas } from './v3-canvas.js'
-import { nudgeOf } from './v3-stage-model.js'
-import { editRefusalOf, inDeclaredRoom, inputRangeRefusalOf, narrowingRetryOf, partRefusalOf, placementRefusalOf, recipeRefusalOf, removalNoticeOf, sizeRangeRefusalOf } from './v3-refusals.js'
-import type { V3RenderPart } from './v3-renderer.js'
-import type { V3BudgetLine } from './v3-maturity.js'
-import { instanceRangeOf, instanceRangeToDeclare, proportionToFollow, rangeDiffers, rangeWith, turnsAboutAJoint, valueNow } from './v3-links.js'
-import { jointFanOf } from './v3-joint-fan.js'
-import { jointDragOf } from './v3-joint-drag.js'
-import type { FirstSave } from './v3-first-save.js'
-import { isLive, livePartsOf, liveOverSession, NOTHING_LIVE, scrubbed, scrubStep, type LiveValues } from './v3-live.js'
+import { alignChanges, boxOf, canMirror, mirrorChanges, type AlignTool } from './align.js'
+import type { FigurePaletteKind, FigurePartRow } from './figure-parts.js'
+import { paletteRecipe } from './palette.js'
+import type { FigureCanvas } from './canvas.js'
+import { nudgeOf } from './stage-model.js'
+import { editRefusalOf, inDeclaredRoom, inputRangeRefusalOf, narrowingRetryOf, partRefusalOf, placementRefusalOf, recipeRefusalOf, removalNoticeOf, sizeRangeRefusalOf } from './refusals.js'
+import type { FigureRenderPart } from './renderer.js'
+import type { FigureBudgetLine } from './maturity.js'
+import { instanceRangeOf, instanceRangeToDeclare, proportionToFollow, rangeDiffers, rangeWith, turnsAboutAJoint, valueNow } from './links.js'
+import { jointFanOf } from './joint-fan.js'
+import { jointDragOf } from './joint-drag.js'
+import type { FirstSave } from './first-save.js'
+import { isLive, livePartsOf, liveOverSession, NOTHING_LIVE, scrubbed, scrubStep, type LiveValues } from './live.js'
 
 
 /**
@@ -48,8 +48,8 @@ import { isLive, livePartsOf, liveOverSession, NOTHING_LIVE, scrubbed, scrubStep
 type SideTab = 'properties' | 'capability' | 'motion' | 'verdict' | 'view' | 'history'
 
 /** Product editor surface. The injected session is shared by page persistence and AI commands. */
-@customElement('figure-v3-editor')
-export class FigureV3Editor extends LitElement {
+@customElement('figure-editor')
+export class FigureEditor extends LitElement {
   /* The operato scrollbar, as every scrolling panel of the app has it -- the side panel scrolled with the browser's own. */
   static styles = [ScrollbarStyles, SidePanelStyles, css`
     :host {
@@ -105,7 +105,7 @@ export class FigureV3Editor extends LitElement {
       opacity: 0.38;
       cursor: default;
     }
-    figure-v3-preview {
+    figure-preview {
       min-width: 0;
       min-height: 0;
     }
@@ -131,10 +131,10 @@ export class FigureV3Editor extends LitElement {
       flex: 1;
       min-height: 0;
     }
-    figure-v3-parts {
+    figure-parts {
       min-height: 0;
     }
-    figure-v3-canvas {
+    figure-canvas {
       min-width: 0;
       min-height: 0;
     }
@@ -263,7 +263,7 @@ export class FigureV3Editor extends LitElement {
       line-height: 1.5;
     }
   `]
-  @property({ attribute: false }) session?: V3ProductSession
+  @property({ attribute: false }) session?: FigureProductSession
   /** The recipe templates (ADR-0095), read by the page from the server. */
   @property({ attribute: false }) templates: RecipeTemplate[] = []
   /** Reads a template's guide; given by the page. */
@@ -278,7 +278,7 @@ export class FigureV3Editor extends LitElement {
   /** The verdict's count, drawn on its tab so it stays in sight while another tab is open. */
   @property({ type: Number }) instances?: number
   /** The cost line the parts list shows, from the maturity report. */
-  @property({ attribute: false }) budget?: V3BudgetLine
+  @property({ attribute: false }) budget?: FigureBudgetLine
   /**
    * Asks the type and name of a figure saved for the first time (the host has the catalogue's names); undefined
    * when the author cancels, and then nothing is saved. Without it a new figure is saved under a temporary type.
@@ -287,7 +287,7 @@ export class FigureV3Editor extends LitElement {
   @state() private selected = ''
   @state() private error = ''
   /** The same link offered again with the size range narrowed, after a link the declared range could not hold. */
-  @state() private retry?: { label: string; action?: V3AuthoringAction; run?: () => void }
+  @state() private retry?: { label: string; action?: FigureAuthoringAction; run?: () => void }
   @state() private tab: SideTab = 'properties'
   /** The frame the bar folds - found after the first render, since the bar is drawn before it. */
   @state() private panes?: OxThreePane
@@ -301,10 +301,10 @@ export class FigureV3Editor extends LitElement {
    * How the workbench shows the figure, in the board's own state names. The viewer's, kept in
    * their browser, never in the figure.
    */
-  @state() private view: ViewSettings = FigureV3Editor.storedView()
+  @state() private view: ViewSettings = FigureEditor.storedView()
   private static storedView(): ViewSettings {
     try {
-      const stored = JSON.parse(localStorage.getItem('figure-v3-view') ?? 'null')
+      const stored = JSON.parse(localStorage.getItem('figure-view') ?? 'null')
       return stored && typeof stored === 'object' ? { ...DEFAULT_VIEW, ...stored } : { ...DEFAULT_VIEW }
     } catch {
       return { ...DEFAULT_VIEW }
@@ -313,7 +313,7 @@ export class FigureV3Editor extends LitElement {
   private setView(view: ViewSettings) {
     this.view = { ...DEFAULT_VIEW, ...view }
     try {
-      localStorage.setItem('figure-v3-view', JSON.stringify(this.view))
+      localStorage.setItem('figure-view', JSON.stringify(this.view))
     } catch {
       /* A browser that keeps nothing still shows the change for this visit. */
     }
@@ -353,11 +353,11 @@ export class FigureV3Editor extends LitElement {
       )}
     </span>`
   }
-  /** The modeller's keys (`v3-keys.ts`): undo, redo, duplicate, remove, back to the whole figure, the gizmo's modes. */
+  /** The modeller's keys (`keys.ts`): undo, redo, duplicate, remove, back to the whole figure, the gizmo's modes. */
   private onKey = (e: KeyboardEvent) => {
     const view = this.session?.read()
     if (!view || view.loading || view.saving || !view.context || !this.isConnected) return
-    const canvas = this.renderRoot.querySelector<FigureV3Canvas>('figure-v3-canvas')
+    const canvas = this.renderRoot.querySelector<FigureCanvas>('figure-canvas')
     const path = e.composedPath()
     const action = keyActionOf(
       { key: e.key, ctrlKey: e.ctrlKey, metaKey: e.metaKey, shiftKey: e.shiftKey, altKey: e.altKey, target: path[0] as HTMLElement, inScene: !!canvas && path.includes(canvas) },
@@ -399,7 +399,7 @@ export class FigureV3Editor extends LitElement {
   }
   /** The scene toggles: the mode already shown takes the gizmo away. */
   private useGizmo(mode: 'translate' | 'rotate' | 'scale') {
-    this.renderRoot.querySelector<FigureV3Canvas>('figure-v3-canvas')?.gizmo(mode)
+    this.renderRoot.querySelector<FigureCanvas>('figure-canvas')?.gizmo(mode)
     this.gizmoMode = this.gizmoMode === mode ? undefined : mode
   }
   /**
@@ -425,15 +425,15 @@ export class FigureV3Editor extends LitElement {
     }
   }
   /** What the canvas draws: the figure with the value in hand when there is one, and without the parts hidden on the workbench. */
-  private drawnParts(geometry: Parameters<typeof drawableV3Parts>[0] | undefined, asset: unknown) {
-    const parts = (asset ? liveOverSession(asset as V3Asset, this.currentInputs(), this.live) : null) ?? drawableV3Parts(geometry ?? [])
+  private drawnParts(geometry: Parameters<typeof drawableFigureParts>[0] | undefined, asset: unknown) {
+    const parts = (asset ? liveOverSession(asset as FigureAsset, this.currentInputs(), this.live) : null) ?? drawableFigureParts(geometry ?? [])
     return parts.filter(body => !this.hiddenParts.has(ownerOf((body as { id: string }).id)))
   }
   /**
    * Where the selected part turns and how far, with the pose as it is drawn now -- a value in hand included, so the
-   * fan follows the arm while a control is dragged. Its size comes from what the joint turns (`v3-joint-fan`).
+   * fan follows the arm while a control is dragged. Its size comes from what the joint turns (`joint-fan`).
    */
-  private fanOf(asset: V3Asset | undefined) {
+  private fanOf(asset: FigureAsset | undefined) {
     if (!asset || !this.selected || this.hiddenParts.has(this.selected)) return null
     try {
       return jointFanOf(asset, this.selected, { ...this.currentInputs(), ...this.live.values })
@@ -451,12 +451,12 @@ export class FigureV3Editor extends LitElement {
     return view ? Object.fromEntries(view.fields.map(field => [field.id, field.value as number])) : {}
   }
   /** A value in hand: an input's value (design or pose) or a part edit. Nothing is recorded. */
-  private hold(values: Record<string, number>, edit?: V3PartEdit) {
+  private hold(values: Record<string, number>, edit?: FigurePartEdit) {
     this.live = { values: { ...this.live.values, ...values }, ...(edit ? { edit } : this.live.edit ? { edit: this.live.edit } : {}) }
   }
   private changed() {
     this.requestUpdate()
-    this.dispatchEvent(new CustomEvent('v3-changed', { bubbles: true, composed: true }))
+    this.dispatchEvent(new CustomEvent('changed', { bubbles: true, composed: true }))
   }
   private async save() {
     if (!this.session) return
@@ -464,7 +464,7 @@ export class FigureV3Editor extends LitElement {
       /*
         The card's picture is taken before the save starts, from a canvas of its own at the card's size —
         not from the one on screen, which stands wherever the author left it turned. A picture that cannot
-        be taken is not an error: the save goes on without it (see `v3-thumbnail.ts`).
+        be taken is not an error: the save goes on without it (see `thumbnail.ts`).
       */
       let type: string | undefined
       if (!this.session.read().id && this.firstSave) {
@@ -478,7 +478,7 @@ export class FigureV3Editor extends LitElement {
         type = answer.type
       }
       const view = this.session.read()
-      const thumbnail = await captureV3Thumbnail(drawableV3Parts(view.geometry ?? []), view.palette ?? {})
+      const thumbnail = await captureFigureThumbnail(drawableFigureParts(view.geometry ?? []), view.palette ?? {})
       const promise = this.session.save({ thumbnail, type })
       this.changed()
       await promise
@@ -489,7 +489,7 @@ export class FigureV3Editor extends LitElement {
       this.changed()
     }
   }
-  private add(kind: V3PaletteKind) {
+  private add(kind: FigurePaletteKind) {
     if (!this.session) return
     this.run(() => {
       const ids = new Set(this.session!.read().geometry.map(g => g.id))
@@ -501,7 +501,7 @@ export class FigureV3Editor extends LitElement {
     })
   }
   /**
-   * The list's own operations, as V3 part edits — each one step of the session's history. The copy and the moved
+   * The list's own operations, as part edits — each one step of the session's history. The copy and the moved
    * part stay selected.
    */
   private duplicatePart(id: string) {
@@ -545,12 +545,12 @@ export class FigureV3Editor extends LitElement {
    * A recipe put in (ADR-0095): resolved on the figure as it stands -- its parts take the next free name, onto the part
    * chosen -- and applied as one step. Refused, the kernel's sentence goes to the form as it is (condition 3).
    */
-  private insertRecipe(recipe: V3Recipe, values: Record<string, V3RecipeValue>) {
+  private insertRecipe(recipe: FigureRecipe, values: Record<string, FigureRecipeValue>) {
     try {
-      const asset = JSON.parse(this.session!.source()) as V3Asset
-      const checked = parseV3Recipe(recipe)
-      const id = v3RecipeIdFor(asset, checked)
-      const steps = resolveV3Recipe(checked, { id, ...(checked.target === 'part' ? { target: this.selected } : {}), values })
+      const asset = JSON.parse(this.session!.source()) as FigureAsset
+      const checked = parseFigureRecipe(recipe)
+      const id = figureRecipeIdFor(asset, checked)
+      const steps = resolveFigureRecipe(checked, { id, ...(checked.target === 'part' ? { target: this.selected } : {}), values })
       this.session!.applyRecipe(steps)
       this.recipeError = ''
       this.catalogOpen = false
@@ -583,8 +583,8 @@ export class FigureV3Editor extends LitElement {
   private transformed(id: string, result: GizmoResult) {
     const view = this.session!.read()
     /* A part hanging from a joint: the drag edits the joint -- its value, or where it sits (ADR-0093). */
-    const asset = JSON.parse(this.session!.source()) as V3Asset
-    const drawn = view.geometry.find(g => g.id === id) as unknown as V3RenderPart | undefined
+    const asset = JSON.parse(this.session!.source()) as FigureAsset
+    const drawn = view.geometry.find(g => g.id === id) as unknown as FigureRenderPart | undefined
     const drag = drawn ? jointDragOf(asset, ownerOf(id), drawn, result, this.currentInputs()) : null
     if (drag) {
       if (drag.kind === 'value') this.run(() => this.session!.apply([{ kind: 'set-state', input: drag.input, unit: drag.unit, value: drag.value }]))
@@ -618,7 +618,7 @@ export class FigureV3Editor extends LitElement {
       its rule (`nudge-part`). A part a joint or a fastening places, or a size that is worked out, is refused -- said in
       words, not by the part silently springing back (user, 2026-09-24: 「기즈모 컨트롤도 전혀 작동이 안되는군」).
     */
-    const body = view.geometry.find(g => g.id === id) as unknown as V3RenderPart | undefined
+    const body = view.geometry.find(g => g.id === id) as unknown as FigureRenderPart | undefined
     if (!body) return this.requestUpdate()
     const { by, turn } = nudgeOf(body, result)
     /* A size worked out from the figure's: the drag's factor beside its rule, so it still follows. */
@@ -745,15 +745,15 @@ export class FigureV3Editor extends LitElement {
     } catch {
       dims = undefined
     }
-    return html`<figure-v3-links
+    return html`<figure-links
       .asset=${asset}
       .section=${section}
       .partId=${this.selected}
       .dims=${dims}
       ?locked=${unavailable}
-      @v3-command=${(e: CustomEvent) => this.linkCommand(e.detail.action)}
-      @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-    ></figure-v3-links>`
+      @command=${(e: CustomEvent) => this.linkCommand(e.detail.action)}
+      @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+    ></figure-links>`
   }
   /** The figure's controls: try a value, name it, set its range and travel time, keep the pose. */
   private renderControls(view: { fields: Array<{ id: string; role?: string; value: number }> }, unavailable: boolean) {
@@ -764,25 +764,25 @@ export class FigureV3Editor extends LitElement {
       return null
     }
     const values = Object.fromEntries(view.fields.filter(f => f.role === 'state').map(f => [f.id, f.value]))
-    return html`<figure-v3-controls
+    return html`<figure-controls
       .asset=${asset}
       .values=${values}
       ?locked=${unavailable}
-      @v3-state=${(e: CustomEvent) => this.run(() => this.session!.apply([{ kind: 'set-state', input: e.detail.input, unit: e.detail.unit, value: e.detail.value }]))}
-      @v3-state-live=${(e: CustomEvent) => this.hold({ [e.detail.input]: e.detail.value })}
-      @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-    ></figure-v3-controls>
-    <figure-v3-clips
+      @state=${(e: CustomEvent) => this.run(() => this.session!.apply([{ kind: 'set-state', input: e.detail.input, unit: e.detail.unit, value: e.detail.value }]))}
+      @state-live=${(e: CustomEvent) => this.hold({ [e.detail.input]: e.detail.value })}
+      @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+    ></figure-controls>
+    <figure-clips
       .asset=${asset}
       .values=${values}
       ?locked=${unavailable}
-      @v3-states=${(e: CustomEvent) => this.run(() => this.session!.apply(e.detail.changes))}
-      @v3-states-live=${(e: CustomEvent) => this.hold(e.detail.values)}
-      @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-    ></figure-v3-clips>`
+      @states=${(e: CustomEvent) => this.run(() => this.session!.apply(e.detail.changes))}
+      @states-live=${(e: CustomEvent) => this.hold(e.detail.values)}
+      @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+    ></figure-clips>`
   }
   /** One command, one step of the history. A refusal a person can meet here is said in their words. */
-  private linkCommand(action: V3AuthoringAction) {
+  private linkCommand(action: FigureAuthoringAction) {
     this.retry = undefined
     this.notice = ''
     const hadSize = this.hasSize()
@@ -804,7 +804,7 @@ export class FigureV3Editor extends LitElement {
       const narrowing = narrowingRetryOf(action, error, (key, params) => i18next.t(key, params))
       if (narrowing) {
         this.error = narrowing.message
-        this.retry = { label: narrowing.label, action: narrowing.retry as V3AuthoringAction }
+        this.retry = { label: narrowing.label, action: narrowing.retry as FigureAuthoringAction }
         return
       }
       this.error =
@@ -817,7 +817,7 @@ export class FigureV3Editor extends LitElement {
               this.said(error)
     }
   }
-  private changeField(field: { id: string; unit: V3InputChange['unit']; role?: string }, event: Event) {
+  private changeField(field: { id: string; unit: FigureInputChange['unit']; role?: string }, event: Event) {
     const input = event.target as HTMLInputElement,
       value = input.valueAsNumber
     /* A height typed in keeps the part's bottom where it is, as the scale gizmo does. */
@@ -841,7 +841,7 @@ export class FigureV3Editor extends LitElement {
    * Drag a field's label (or an axis letter) sideways to scrub its value, as vector tools do: the figure follows the
    * pointer, and the release records one step. The field's number follows too, so the value in hand is always read.
    */
-  private scrub(field: { id: string; unit: V3InputChange['unit']; role?: string; value: number }, down: PointerEvent, unavailable: boolean) {
+  private scrub(field: { id: string; unit: FigureInputChange['unit']; role?: string; value: number }, down: PointerEvent, unavailable: boolean) {
     if (unavailable || down.button !== 0) return
     const label = down.currentTarget as HTMLElement
     const input = (label.closest('div[cell]')?.querySelector('input') ?? label.nextElementSibling) as HTMLInputElement | null
@@ -876,7 +876,7 @@ export class FigureV3Editor extends LitElement {
   /** The measured range, kept for the revision it was measured at: measuring evaluates the figure at its edges. */
   private range?: { at: string; of: ReturnType<typeof instanceRangeOf>; toDeclare?: ReturnType<typeof instanceRangeToDeclare> }
   /** The sizes a board may give the figure, and the way to measure them again after its parts changed. */
-  private renderInstanceRange(asset: V3Asset | undefined, unavailable: boolean) {
+  private renderInstanceRange(asset: FigureAsset | undefined, unavailable: boolean) {
     if (!asset) return nothing
     /* Another figure, or another step of this one, is measured again. */
     const at = `${this.session?.read().context ?? ''}:${this.revision}`
@@ -951,7 +951,7 @@ export class FigureV3Editor extends LitElement {
    * How the figure grows. One ratio (`sizing: 'uniform'`) is said as it is; a figure with joints that has not declared
    * it is offered it -- a mechanism does not shear -- and the author decides (chief architect's ruling 2026-09-24).
    */
-  private renderSizingRule(asset: V3Asset, unavailable: boolean) {
+  private renderSizingRule(asset: FigureAsset, unavailable: boolean) {
     if (asset.sizing === 'uniform') {
       /* One ratio reaches only what reads the size: every other length is offered to follow it, in one step. */
       const follow = proportionToFollow(asset)
@@ -973,8 +973,8 @@ export class FigureV3Editor extends LitElement {
    * The parts list, one row per part the author made: a repeat is one row with how many copies it makes now
    * (user, 2026-09-24: the conveyor's sixteen rollers were sixteen rows).
    */
-  private partRows(geometry: readonly { id: string }[]): V3PartRow[] {
-    const rows = new Map<string, V3PartRow>()
+  private partRows(geometry: readonly { id: string }[]): FigurePartRow[] {
+    const rows = new Map<string, FigurePartRow>()
     for (const g of geometry) {
       const id = ownerOf(g.id)
       const row = rows.get(id)
@@ -993,10 +993,10 @@ export class FigureV3Editor extends LitElement {
     return [...rows.values()]
   }
   /** The detail level's part budget for the list's head, from figure-model's count (a repeat once). */
-  private partBudgetOf(asset: V3Asset | undefined) {
+  private partBudgetOf(asset: FigureAsset | undefined) {
     if (!asset) return undefined
     try {
-      return { level: asset.detailLevel ?? null, used: v3PartCountOf(asset), limit: asset.detailLevel ? PART_LIMIT[asset.detailLevel] : null }
+      return { level: asset.detailLevel ?? null, used: figurePartCountOf(asset), limit: asset.detailLevel ? PART_LIMIT[asset.detailLevel] : null }
     } catch {
       return undefined
     }
@@ -1006,7 +1006,7 @@ export class FigureV3Editor extends LitElement {
    * The pitch of a row that fills its length is edited as a number (`set-repeat` makes it the part's own the first
    * time); a row of a fixed count says its pitch cannot be set yet (figure-model refuses it the same way).
    */
-  private renderRepeat(asset: V3Asset | undefined, geometry: readonly { id: string }[], unavailable: boolean) {
+  private renderRepeat(asset: FigureAsset | undefined, geometry: readonly { id: string }[], unavailable: boolean) {
     const repeat = repeatOf(this.selected, geometry)
     if (!asset || !repeat || repeat.index) return nothing
     /* The row is set on its part; what hangs from that part is copied with it and has no row of its own. */
@@ -1062,7 +1062,7 @@ export class FigureV3Editor extends LitElement {
     </section>`
   }
   /** The design input a row's pitch is read from, when it is read from one (ADR-0096). */
-  private pitchInputOf(asset: V3Asset, part: string): string | undefined {
+  private pitchInputOf(asset: FigureAsset, part: string): string | undefined {
     const pitch = asset.joints?.find(j => j.body1.part === part && j.repeat)?.repeat?.pitch as { from?: { of?: string; input?: string } } | number | undefined
     return typeof pitch === 'object' && pitch?.from?.of === 'input' ? pitch.from.input : undefined
   }
@@ -1070,7 +1070,7 @@ export class FigureV3Editor extends LitElement {
    * 「보드에서 바꿀 수 있음」 (ADR-0096): the row's pitch made a design input the figure publishes -- a name on the board and
    * a range the board's value is held to -- in one step; changed or withdrawn the same way. Only a row with a record.
    */
-  private renderPublicPitch(asset: V3Asset, pitch: number, unavailable: boolean) {
+  private renderPublicPitch(asset: FigureAsset, pitch: number, unavailable: boolean) {
     const part = this.selected
     if (!asset.joints?.some(j => j.body1.part === part && j.repeat)) return nothing
     const from = this.pitchInputOf(asset, part)
@@ -1088,18 +1088,18 @@ export class FigureV3Editor extends LitElement {
       const base = form ?? { part, label: '', min: 0, max: 0 }
       this.publishing = { ...base, [key]: key === 'label' ? target.value : target.valueAsNumber }
     }
-    const steps = (): V3ProposalStep[] => {
+    const steps = (): FigureProposalStep[] => {
       const f = form!
       const id = from ?? `${part}.pitch`
-      if (listed) return [{ kind: 'set-input-range', input: id, min: f.min, max: f.max }, { kind: 'publish-input', input: id, label: f.label }] as V3ProposalStep[]
+      if (listed) return [{ kind: 'set-input-range', input: id, min: f.min, max: f.max }, { kind: 'publish-input', input: id, label: f.label }] as FigureProposalStep[]
       const exists = asset.document.model.inputs.some(i => i.id === id)
       return [
         ...(exists ? [{ kind: 'set-input-range', input: id, min: f.min, max: f.max }] : [{ kind: 'add-design-input', id, unit: 'mm', min: f.min, max: f.max, value: pitch }]),
         ...(from ? [] : [{ kind: 'set-repeat', part, pitch: { from: { of: 'input', input: id } } }]),
         { kind: 'publish-input', input: id, label: f.label }
-      ] as V3ProposalStep[]
+      ] as FigureProposalStep[]
     }
-    const run = (list: V3ProposalStep[]) => {
+    const run = (list: FigureProposalStep[]) => {
       try {
         this.session!.applyRecipe(list)
         this.publishing = undefined
@@ -1120,7 +1120,7 @@ export class FigureV3Editor extends LitElement {
             (e.target as HTMLInputElement).checked
               ? (this.publishing = { part, label: i18next.t('figure.label.repeat-gap'), min: Math.max(1, Math.round(pitch / 2)), max: Math.round(pitch * 2) })
               : listed
-                ? run([{ kind: 'unpublish-input', input: from }, { kind: 'set-repeat', part, pitch }] as V3ProposalStep[])
+                ? run([{ kind: 'unpublish-input', input: from }, { kind: 'set-repeat', part, pitch }] as FigureProposalStep[])
                 : (this.publishing = undefined)}
         />
         ${i18next.t('figure.label.board-sets')}
@@ -1145,7 +1145,7 @@ export class FigureV3Editor extends LitElement {
     const pitch = input.valueAsNumber
     if (!Number.isFinite(pitch) || pitch === field.value) return
     /* Read from a design input the board may set: the input's value changes, the row keeps reading it (ADR-0096). */
-    const from = this.pitchInputOf(JSON.parse(this.session!.source()) as V3Asset, this.selected)
+    const from = this.pitchInputOf(JSON.parse(this.session!.source()) as FigureAsset, this.selected)
     if (from) {
       this.run(() => this.session!.apply([{ kind: 'set-design', input: from, unit: 'mm', value: pitch }]))
       input.value = String(this.session!.read().fields.find(i => i.id === from)?.value ?? field.value)
@@ -1227,7 +1227,7 @@ export class FigureV3Editor extends LitElement {
         .pane=${this.panes}
         @canvas-undo=${() => this.run(() => this.session!.undo())}
         @canvas-redo=${() => this.run(() => this.session!.redo())}
-        @canvas-fit=${() => this.renderRoot.querySelector<FigureV3Canvas>('figure-v3-canvas')?.fit()}
+        @canvas-fit=${() => this.renderRoot.querySelector<FigureCanvas>('figure-canvas')?.fit()}
       >
         ${this.renderGizmoTools(!unavailable && this.middle === 'edit')}
         ${(['edit', 'preview'] as const).map(
@@ -1248,7 +1248,7 @@ export class FigureV3Editor extends LitElement {
         : null}
       ${this.notice ? html`<div role="status" class="notice">${this.notice}</div>` : null}
       ${this.catalogOpen
-        ? html`<figure-v3-recipe-catalog
+        ? html`<figure-recipe-catalog
             .templates=${this.templates}
             .selected=${this.selected}
             .error=${this.recipeError}
@@ -1257,15 +1257,15 @@ export class FigureV3Editor extends LitElement {
             ?locked=${unavailable}
               @insert-recipe=${(e: CustomEvent) => this.insertRecipe(e.detail.recipe, e.detail.values)}
               @close-catalog=${() => (this.catalogOpen = false)}
-          ></figure-v3-recipe-catalog>`
+          ></figure-recipe-catalog>`
         : null}
       <ox-three-pane>
-        <figure-v3-parts
+        <figure-parts
           slot="start"
           .budget=${this.budget}
           @show-maturity=${() => (this.tab = 'verdict')}
           .parts=${this.partRows(view.geometry)}
-          .partBudget=${this.partBudgetOf(asset as V3Asset | undefined)}
+          .partBudget=${this.partBudgetOf(asset as FigureAsset | undefined)}
           @set-detail-level=${(e: CustomEvent) => this.linkCommand({ kind: 'set-detail-level', level: e.detail.level })}
           .selected=${this.selected}
           ?locked=${unavailable}
@@ -1280,18 +1280,18 @@ export class FigureV3Editor extends LitElement {
           @move-part-down=${(e: CustomEvent) => this.movePart(e.detail.id, e.detail.to)}
           @duplicate-part=${(e: CustomEvent) => this.duplicatePart(e.detail.id)}
           @remove-part=${(e: CustomEvent) => this.removePart(e.detail.id)}
-        ></figure-v3-parts>
+        ></figure-parts>
         ${this.middle === 'preview'
-          ? html`<figure-v3-preview
+          ? html`<figure-preview
               .asset=${asset}
               .context=${view.context ?? ''}
               .view=${this.view}
-              @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-            ></figure-v3-preview>`
-          : html`<figure-v3-canvas
+              @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+            ></figure-preview>`
+          : html`<figure-canvas
           .view=${this.view}
           .parts=${this.drawnParts(view.geometry, asset)}
-          .fan=${this.fanOf(asset as V3Asset | undefined)}
+          .fan=${this.fanOf(asset as FigureAsset | undefined)}
           .palette=${view.palette ?? {}}
           .context=${view.context ?? ''}
           .selected=${this.selected}
@@ -1301,7 +1301,7 @@ export class FigureV3Editor extends LitElement {
           @render-error=${(e: CustomEvent<Error>) => {
             this.error = e.detail.message
           }}
-        ></figure-v3-canvas>`}
+        ></figure-canvas>`}
         <aside slot="end">
           <div tabs>
             ${this.renderTab('properties', 'tune', i18next.t('figure.label.properties'))}
@@ -1329,30 +1329,30 @@ export class FigureV3Editor extends LitElement {
                     </div>
                     ${this.renderRepeatNote(view.geometry)}
                   </section>
-                  ${this.renderRepeat(asset as V3Asset | undefined, view.geometry, unavailable)}
+                  ${this.renderRepeat(asset as FigureAsset | undefined, view.geometry, unavailable)}
                   ${this.renderGroups(groupFields(own, this.selected), 'figure.label.group-placement-size', 'figure.label.group-shape', unavailable, this.renderTools(unavailable))}
                   ${this.renderLinks(unavailable, 'shape')}
-                  <figure-v3-material
+                  <figure-material-panel
                     .body=${{ ...part, id: this.selected }}
                     .palette=${view.palette ?? {}}
                     ?locked=${unavailable}
-                    @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-                    @v3-part-live=${(e: CustomEvent) => this.hold({}, e.detail.edit)}
-                  ></figure-v3-material>`
+                    @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+                    @part-live=${(e: CustomEvent) => this.hold({}, e.detail.edit)}
+                  ></figure-material-panel>`
               : html`<slot name="figure"></slot>
                   ${this.renderGroups(groupFields(common), 'figure.label.group-figure-size', 'figure.label.design-inputs', unavailable)}
-                  ${this.renderInstanceRange(asset as V3Asset | undefined, unavailable)}`}
+                  ${this.renderInstanceRange(asset as FigureAsset | undefined, unavailable)}`}
           </div>
           <div panel ?off=${tab !== 'capability'}>
             ${this.renderSubject()}
             ${this.selected && part ? this.renderLinks(unavailable, 'places') : null}
-            <figure-v3-capability
+            <figure-capability-panel
               .asset=${asset}
               .selected=${this.selected}
               ?locked=${unavailable}
               @select-part=${(e: CustomEvent) => this.choose(e.detail.id)}
-              @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
-            ></figure-v3-capability>
+              @part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}
+            ></figure-capability-panel>
           </div>
           <div panel ?off=${tab !== 'motion'}>
             ${this.renderSubject()}

package/client/modeller/{figure-v3-capability.ts → figure-capability-panel.ts}

@@ -3,8 +3,8 @@ import { customElement, property } from 'lit/decorators.js'
 import { live } from 'lit/directives/live.js'
 
 import { i18next, localize } from '@operato/i18n'
-import { v3BindingsOf } from '@hatiolab/figure-model'
-import type { FigureCapability, V3Asset } from '@hatiolab/figure-model'
+import { figureBindingsOf } from '@hatiolab/figure-model'
+import type { FigureCapability, FigureAsset } from '@hatiolab/figure-model'
 import { SidePanelStyles } from './side-panel-styles.js'
 
 /*
@@ -32,8 +32,8 @@ export function rungOf(names: readonly string[] | undefined): Rung | null {
  * holding things, to passing them on, and every place things are held, whatever part it is on. A place is not drawn,
  * so the list is the only way to find one; choosing a row selects its part, where the place is edited.
  */
-@customElement('figure-v3-capability')
-export class FigureV3Capability extends localize(i18next)(LitElement) {
+@customElement('figure-capability-panel')
+export class FigureCapabilityPanel extends localize(i18next)(LitElement) {
   static styles = [SidePanelStyles, css`
     :host {
       display: block;
@@ -84,7 +84,7 @@ export class FigureV3Capability extends localize(i18next)(LitElement) {
     }
   `]
 
-  @property({ attribute: false }) asset?: V3Asset
+  @property({ attribute: false }) asset?: FigureAsset
   /** The selected part, whose places are marked. */
   @property() selected = ''
   @property({ type: Boolean }) locked = false
@@ -94,7 +94,7 @@ export class FigureV3Capability extends localize(i18next)(LitElement) {
     if (!asset) return nothing
     const names = asset.document.capabilities.names ?? []
     const rung = rungOf(names)
-    const places = v3BindingsOf(asset)
+    const places = figureBindingsOf(asset)
     return html`<section>
       <h3>${i18next.t('figure.label.what-this-does')}</h3>
       ${(['none', 'hold', 'flow'] as const).map(
@@ -128,7 +128,7 @@ export class FigureV3Capability extends localize(i18next)(LitElement) {
   }
 
   private setRung(which: Rung) {
-    this.dispatchEvent(new CustomEvent('v3-part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which]] } }, bubbles: true, composed: true }))
+    this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which]] } }, bubbles: true, composed: true }))
   }
 
   private pick(part: string) {