@things-factory/figure-ui 10.1.48 → 10.1.49

package/client/modeller/figure-v3-parts.ts

@@ -3,6 +3,7 @@ import { css, html, LitElement, nothing } from 'lit'
 import { customElement, property } from 'lit/decorators.js'
 import { i18next, localize } from '@operato/i18n'
 import { ScrollbarStyles } from '@operato/styles'
+import { PART_LIMIT } from '@hatiolab/figure-model'
 import type { V3PrimitiveCreation } from '@hatiolab/figure-model'
 import type { V3BudgetLine } from './v3-maturity.js'
 import { partLabelOf } from './v3-fields.js'
@@ -28,6 +29,8 @@ export interface V3PartRow {
   hidden?: boolean
   /** 자산이 지금 상태에서 보이지 않는다고 한 것. 저장되는 것이고, 여기서는 표시만 한다. */
   invisible?: boolean
+  /** 되풀이한 부품이면 지금 몇 개로 그려지나. 되풀이는 한 부품이다 — 한 줄로 보인다. */
+  copies?: number
 }
 
 /** 제공자마다의 아이콘. Material Symbols 이름이다. */
@@ -147,25 +150,61 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
         font-style: normal;
         color: var(--md-sys-color-error);
       }
+      span[room][full] {
+        color: var(--md-sys-color-error);
+        font-weight: 600;
+      }
+      p[full] {
+        margin: 4px 0 0;
+        font-size: 0.68rem;
+        color: var(--md-sys-color-error);
+      }
+      div[level] {
+        display: grid;
+        grid-template-columns: auto minmax(0, 1fr);
+        align-items: center;
+        gap: 6px;
+        margin: 0 0 6px;
+        font-size: 0.68rem;
+        color: var(--md-sys-color-on-surface-variant);
+      }
+      div[level] select {
+        min-width: 0;
+        padding: 2px 4px;
+        font: inherit;
+        font-size: 0.7rem;
+        color: var(--md-sys-color-on-surface);
+        background: var(--md-sys-color-surface-container-lowest);
+        border: 1px solid var(--md-sys-color-outline-variant);
+        border-radius: 6px;
+      }
+      small[copies] {
+        color: var(--md-sys-color-on-surface-variant);
+      }
       span[room] {
         font-size: 0.7rem;
         font-weight: 400;
         letter-spacing: 0;
         text-transform: none;
       }
+      /* Three to a row, small (user, 2026-09-24): the palette is reached for, not read -- the list below is what grows. */
       div[palette] {
         display: grid;
-        grid-template-columns: repeat(2, 1fr);
-        gap: 4px;
+        grid-template-columns: repeat(3, minmax(0, 1fr));
+        gap: 3px;
       }
       button[shape] {
         display: flex;
         flex-direction: column;
         align-items: center;
-        gap: 2px;
-        padding: 7px 2px 5px 2px;
+        gap: 1px;
+        min-width: 0;
+        padding: 5px 1px 4px;
         font: var(--label-font, inherit);
-        font-size: 0.66rem;
+        font-size: 0.6rem;
+        line-height: 1.2;
+        text-align: center;
+        overflow-wrap: anywhere;
         color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
         background: none;
         border: 1px solid var(--md-sys-color-outline-variant);
@@ -182,7 +221,7 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
         cursor: default;
       }
       button[shape] md-icon {
-        --md-icon-size: 20px;
+        --md-icon-size: 18px;
       }
       ol {
         margin: 0;
@@ -323,8 +362,15 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
    * 기준이 저작을 이끈다(V2 모델러의 정체성). 등급이 D 면 무엇이 넘쳤는지를 적는다. 누르면 성숙도 탭이 열린다.
    */
   @property({ attribute: false }) budget?: V3BudgetLine
+  /**
+   * 디테일 등급의 부품 한도 — V2 의 S/M/L(사용자 2026-09-24). 부품을 넣기 **전에** 몇 개 남았는지 보이고, 다 차면 팔레트가
+   * 잠긴다. 되풀이는 한 부품으로 센다. 등급을 안 정했으면 한도는 없다.
+   */
+  @property({ attribute: false }) partBudget?: { level: 'S' | 'M' | 'L' | null; used: number; limit: number | null }
 
   render() {
+    const b = this.partBudget
+    const full = !!b && b.limit !== null && b.used >= b.limit
     return html`
       <section>
         <h3>${i18next.t('figure.label.shapes')}</h3>
@@ -333,8 +379,8 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
             recipe => html`
               <button
                 shape
-                ?disabled=${this.locked}
-                title=${i18next.t(recipe.label)}
+                ?disabled=${this.locked || full}
+                title=${full ? i18next.t('figure.text.part-limit-reached') : i18next.t(recipe.label)}
                 @click=${() => this.ask('add-part', { kind: recipe.kind })}
               >
                 <md-icon>${recipe.icon}</md-icon>
@@ -343,14 +389,18 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
             `
           )}
         </div>
+        ${full ? html`<p full>${i18next.t('figure.text.part-limit-reached-short', { level: b!.level, limit: b!.limit })}</p>` : nothing}
       </section>
 
       <section list>
         <h3>
           <span>${i18next.t('figure.label.parts')}</span>
-          <span room>${this.parts.length}</span>
+          <span room ?full=${full} title=${i18next.t('figure.text.limit-comes-from-level')}
+            >${b && b.limit !== null ? i18next.t('figure.text.n-of-limit', { used: b.used, limit: b.limit }) : (b?.used ?? this.parts.length)}</span
+          >
           ${this.renderShowAll()}
         </h3>
+        ${this.renderLevel()}
         ${this.renderBudget()}
         ${this.parts.length === 0
           ? html`<p quiet>${i18next.t('figure.text.no-parts-yet')}</p>`
@@ -361,6 +411,31 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
     `
   }
 
+  /** 디테일 등급 — 고르면 한도가 바뀐다. V2 의 자리 그대로, 목록 머리 아래. */
+  private renderLevel() {
+    const b = this.partBudget
+    if (!b) return nothing
+    return html`<div level>
+      <label for="detail-level">${i18next.t('figure.label.detail-level')}</label>
+      <select
+        id="detail-level"
+        title=${i18next.t('figure.text.detail-level-explained')}
+        ?disabled=${this.locked}
+        @change=${(e: Event) => {
+          const value = (e.target as HTMLSelectElement).value
+          this.dispatchEvent(new CustomEvent('set-detail-level', { detail: { level: value || null }, bubbles: true, composed: true }))
+        }}
+      >
+        <option value="" ?selected=${!b.level}>${i18next.t('figure.label.detail-none')}</option>
+        ${(['S', 'M', 'L'] as const).map(
+          one => html`<option value=${one} ?selected=${one === b.level}>
+            ${one} ${i18next.t('figure.label.detail-' + one)} · ${i18next.t('figure.text.n-parts-at-most', { limit: PART_LIMIT[one] })}
+          </option>`
+        )}
+      </select>
+    </div>`
+  }
+
   private renderBudget() {
     const b = this.budget
     if (!b || !this.parts.length) return nothing
@@ -434,7 +509,7 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
         </button>
         <md-icon>${PROVIDER_ICON[part.provider] ?? 'deployed_code'}</md-icon>
         <span label title=${part.id}
-          >${partLabelOf(part.id)}${part.invisible ? html`<small>${i18next.t('figure.label.state-hidden')}</small>` : nothing}</span
+          >${partLabelOf(part.id)}${part.copies ? html` <small copies>× ${part.copies}</small>` : nothing}${part.invisible ? html`<small>${i18next.t('figure.label.state-hidden')}</small>` : nothing}</span
         >
         ${selected ? this.renderOps(part.id, index) : nothing}
       </li>

package/client/modeller/side-panel-styles.ts

@@ -88,6 +88,14 @@ export const SidePanelStyles = css`
     overflow-wrap: anywhere;
     white-space: normal;
   }
+  /* A value read, not edited, beside its label: the field's size and colour, not the page's. */
+  div[inline-field] > span[value] {
+    font-size: 0.76rem;
+    color: var(--md-sys-color-on-surface);
+  }
+  label span[unit] {
+    color: var(--md-sys-color-outline);
+  }
   div[inline-field] + div[inline-field],
   div[inline-field] + div[vector-row],
   div[vector-row] + div[inline-field] {

package/client/modeller/v3-canvas.ts

@@ -8,6 +8,7 @@ import type { V3RenderPart } from './v3-renderer.js'
 import { DEFAULT_VIEW, sceneLook, WORKBENCH, type ViewSettings } from './figure-view.js'
 import { boardFor, changedKeys, componentOf, gizmoResultOf, type Board } from './v3-stage-model.js'
 import { JOINT_FAN } from './v3-joint-fan.js'
+import { ownerOf } from './v3-fields.js'
 
 /*
  * The V3 modeller's canvas -- a things-scene board in editing mode, as the V2 modeller's was.
@@ -160,7 +161,12 @@ export class FigureV3Canvas extends LitElement {
     if (!this.stage) return
     const needed = boardFor(this.parts, this.board)
     const outgrown = !this.board || needed.width > this.board.width || needed.height > this.board.height || needed.depth > this.board.depth
-    if (this.scene && this.standingFor === this.context && !outgrown) {
+    if (this.scene && this.standingFor === this.context) {
+      /*
+        A part dragged past the board's edge grows the board where it stands. Standing it up again lost the selection,
+        the gizmo and the camera after every such drag -- the gizmo seemed not to work at all (user, 2026-09-24).
+      */
+      if (outgrown) this.grow(needed)
       this.sync()
       return
     }
@@ -214,6 +220,19 @@ export class FigureV3Canvas extends LitElement {
     return found
   }
 
+  /** A larger board under the same scene: its size, and the grid that suits it. Components are re-placed by `sync`. */
+  private grow(needed: Board & { depth: number }) {
+    const layer = this.scene?.root
+    this.board = needed
+    if (!layer) return
+    this.writing = true
+    try {
+      layer.set({ width: needed.width, height: needed.height, depth: needed.depth, gridStep: niceGridStep(Math.max(needed.width, needed.height)) })
+    } finally {
+      this.writing = false
+    }
+  }
+
   /** Bring the components to the evaluation: remove the gone, write only what differs, add the new. */
   private sync() {
     const layer = this.scene?.root
@@ -251,7 +270,7 @@ export class FigureV3Canvas extends LitElement {
     root.on('selected', (after: unknown) => {
       const name = (after as SceneComponent[] | undefined)?.[0]?.state?.name
       const id = typeof name === 'string' ? name : ''
-      if (id !== this.selected) this.dispatchEvent(new CustomEvent('part-selected', { detail: id, bubbles: true, composed: true }))
+      if (ownerOf(id) !== this.selected) this.dispatchEvent(new CustomEvent('part-selected', { detail: id, bubbles: true, composed: true }))
     })
     /*
       A change comes up to the board with the component in the last argument's `origin` (the scene appends
@@ -275,10 +294,11 @@ export class FigureV3Canvas extends LitElement {
     const layer = this.scene?.root
     const root = layer?.root
     if (!layer || !root) return
-    const component = this.selected ? this.standing().get(this.selected) : undefined
+    /* A repeat is selected whole: every copy of it (the editor selects the part the author made). */
+    const wanted = this.selected ? [...this.standing()].filter(([name]) => ownerOf(name) === this.selected).map(([, component]) => component) : []
     const now = root.selected ?? []
-    if ((now[0] ?? undefined) === component && now.length === (component ? 1 : 0)) return
-    root.selected = component ? [component] : []
+    if (now.length === wanted.length && wanted.every((one, i) => now[i] === one)) return
+    root.selected = wanted
     layer.invalidate?.()
   }
 

package/client/modeller/v3-editor.ts

@@ -3,6 +3,7 @@ import { i18next } from '@operato/i18n'
 import type { OxThreePane } from '@operato/layout'
 import '@operato/layout'
 import { customElement, property, state } from 'lit/decorators.js'
+import { PART_LIMIT, v3PartCountOf } from '@hatiolab/figure-model'
 import type { V3Asset, V3AuthoringAction, V3InputChange, V3PartEdit, V3PrimitiveCreation } from '@hatiolab/figure-model'
 import type { V3ProductSession } from './v3-product-session.js'
 import { captureV3Thumbnail } from './v3-thumbnail.js'
@@ -19,12 +20,14 @@ import { DEFAULT_VIEW, type ViewSettings } from './figure-view.js'
 import './figure-v3-capability.js'
 import { gizmoChanges, gizmoReachOf, type GizmoReach, type GizmoResult } from './v3-gizmo.js'
 import { keyActionOf } from './v3-keys.js'
-import { groupFields, partLabelOf, repeatOf, type FieldLike, type FieldGroup } from './v3-fields.js'
+import { groupFields, ownerOf, partLabelOf, repeatOf, type FieldLike, type FieldGroup } from './v3-fields.js'
 import { SidePanelStyles } from './side-panel-styles.js'
 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 type { V3RenderPart } from './v3-renderer.js'
 import type { V3BudgetLine } from './v3-maturity.js'
 import { instanceRangeOf, rangeDiffers, turnsAboutAJoint } from './v3-links.js'
 import { jointFanOf } from './v3-joint-fan.js'
@@ -288,7 +291,7 @@ export class FigureV3Editor extends LitElement {
       this.error = ''
       this.hiddenParts = new Set()
     }
-    if (view && !view.geometry.some(g => g.id === this.selected)) this.selected = ''
+    if (view && !view.geometry.some(g => ownerOf(g.id) === this.selected)) this.selected = ''
   }
   private run(action: () => unknown) {
     try {
@@ -305,7 +308,7 @@ 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 = (isLive(this.live) && asset ? livePartsOf(asset as V3Asset, this.live) : null) ?? drawableV3Parts(geometry ?? [])
-    return parts.filter(body => !this.hiddenParts.has((body as { id: string }).id))
+    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
@@ -397,7 +400,8 @@ export class FigureV3Editor extends LitElement {
   /** What the gizmo may write for the selected part — read off the asset being edited. */
   private reachOf(id: string): GizmoReach {
     const none = { translate: false, rotate: false, scale: false }
-    if (!id || !this.session) return none
+    /* A repeat is moved and sized through its row, not by a gizmo on one copy. */
+    if (!id || !this.session || !this.session.read().geometry.some(g => g.id === id)) return none
     try {
       return gizmoReachOf(JSON.parse(this.session.source()), id)
     } catch {
@@ -409,8 +413,36 @@ export class FigureV3Editor extends LitElement {
     const view = this.session!.read()
     const sizes = Object.fromEntries(view.fields.map(field => [field.id, field.value as number]))
     const changes = gizmoChanges(id, this.reachOf(id), result, sizes)
-    if (changes.length) this.run(() => this.session!.apply(changes))
-    else this.requestUpdate()
+    if (changes.length) {
+      this.run(() => this.session!.apply(changes))
+      return
+    }
+    /*
+      A part whose place is worked out (a converted one) has no numbers for the gizmo to write: the drag is added beside
+      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
+    if (!body) return this.requestUpdate()
+    if (result.scale && !result.position && !result.rotation) {
+      this.error = i18next.t('figure.text.gizmo-size-worked-out', { part: partLabelOf(id) })
+      return this.requestUpdate()
+    }
+    const { by, turn } = nudgeOf(body, result)
+    if (!Object.keys(by).length && !Object.keys(turn).length) return this.requestUpdate()
+    try {
+      this.session!.command({ kind: 'nudge-part', part: id, ...(Object.keys(by).length ? { by } : {}), ...(Object.keys(turn).length ? { turn } : {}) })
+      this.error = ''
+      this.changed()
+    } catch (error) {
+      const message = error instanceof Error ? error.message : String(error)
+      this.error = /carried by a joint/.test(message)
+        ? i18next.t('figure.text.gizmo-joint-places', { part: partLabelOf(id) })
+        : /is fastened to/.test(message)
+          ? i18next.t('figure.text.gizmo-fastening-places', { part: partLabelOf(id) })
+          : message
+      this.requestUpdate()
+    }
   }
   /** 맞추기 — one tool, one step of the history, through the same inputs as the gizmo. */
   private align(tool: AlignTool) {
@@ -473,7 +505,7 @@ export class FigureV3Editor extends LitElement {
    */
   private renderRepeatNote(geometry: readonly unknown[] | undefined) {
     const repeat = repeatOf(this.selected, geometry)
-    return repeat ? html`<p hint>${i18next.t('figure.text.repeat-member', { name: repeat.name, count: repeat.count, index: repeat.index })}</p>` : nothing
+    return repeat?.index ? html`<p hint>${i18next.t('figure.text.repeat-member', { name: repeat.name, count: repeat.count, index: repeat.index })}</p>` : nothing
   }
   private renamePart(input: HTMLInputElement) {
     const name = input.value.trim()
@@ -672,9 +704,117 @@ export class FigureV3Editor extends LitElement {
         <md-icon>aspect_ratio</md-icon>${i18next.t('figure.button.scale-uniformly')}
       </button>`
   }
+  /**
+   * The parts list, one row per part the author made: a repeat is one row with how many copies it makes now (V2 listed
+   * its parts the same way; 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>()
+    for (const g of geometry) {
+      const id = ownerOf(g.id)
+      const row = rows.get(id)
+      if (row) {
+        row.copies = (row.copies ?? 1) + 1
+        continue
+      }
+      rows.set(id, {
+        id,
+        provider: (g as { shape?: { provider?: string } }).shape?.provider ?? '',
+        hidden: this.hiddenParts.has(id),
+        invisible: (g as { visible?: boolean }).visible === false,
+        ...(id !== g.id ? { copies: 1 } : {})
+      })
+    }
+    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) {
+    if (!asset) return undefined
+    try {
+      return { level: asset.detailLevel ?? null, used: v3PartCountOf(asset), limit: asset.detailLevel ? PART_LIMIT[asset.detailLevel] : null }
+    } catch {
+      return undefined
+    }
+  }
+  /**
+   * A repeat: which way its copies run, how many there are now, and how far apart -- V2's `repeat: { axis, pitch }`.
+   * 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) {
+    const repeat = repeatOf(this.selected, geometry)
+    if (!asset || !repeat || repeat.index) return nothing
+    const model = asset.document.model as unknown as {
+      nodes: { id: string; op: string; args: string[]; params?: Record<string, string> }[]
+      constants: { id: string; value: number }[]
+      inputs: { id: string; max?: number }[]
+    }
+    const layout = model.nodes.find(n => n.id === `${this.selected}.layout`)
+    const axis = model.nodes.find(n => n.id === `${this.selected}.repeat`)?.params?.axis ?? '?'
+    const own = `${this.selected}.repeat.pitch`
+    const pitch = asset.designInputs[own] ?? model.constants.find(c => c.id === layout?.args[4])?.value
+    const fits = layout?.op === 'fit-pitch@1'
+    /* What the pitch gives, in numbers: this many copies at the length it is authored, and how long it may be placed. */
+    const lengthRef = layout?.args[0] ?? ''
+    const length = asset.designInputs[lengthRef]
+    const longest = model.inputs.find(i => i.id === lengthRef)?.max
+    const limit = model.constants.find(c => c.id === layout?.args[6])?.value
+    const field = { id: own, unit: 'mm' as const, role: 'design', value: pitch ?? 0 }
+    return html`<section>
+      <h3>${i18next.t('figure.label.repeat')}</h3>
+      <div inline-field><label>${i18next.t('figure.label.repeat-axis')}</label><span value>${axis.toUpperCase()}</span></div>
+      <div inline-field><label>${i18next.t('figure.label.repeat-count')}</label><span value>${repeat.count}</span></div>
+      <div inline-field>
+        <label>${i18next.t('figure.label.repeat-gap')} <span unit>mm</span></label>
+        <input
+          type="number"
+          step="any"
+          aria-label=${own}
+          .value=${String(pitch ?? '')}
+          ?disabled=${unavailable || !fits}
+          @change=${(e: Event) => this.setPitch(field, e)}
+        />
+      </div>
+      <p hint>
+        ${fits && length !== undefined && longest !== undefined && limit !== undefined
+          ? i18next.t('figure.text.repeat-what-pitch-gives', {
+              length: length.toLocaleString(),
+              count: repeat.count,
+              longest: longest.toLocaleString(),
+              limit
+            })
+          : i18next.t(fits ? 'figure.text.repeat-fits-length' : 'figure.text.repeat-fixed-count')}
+      </p>
+    </section>`
+  }
+  /**
+   * A pitch always goes through `set-repeat`: the command moves the longest length with it (at most `limit` copies),
+   * which a plain input edit would not. Refused only when the authored length would already hold more copies than
+   * that -- said with the numbers.
+   */
+  private setPitch(field: { id: string; value: number }, event: Event) {
+    const input = event.target as HTMLInputElement
+    const pitch = input.valueAsNumber
+    if (!Number.isFinite(pitch) || pitch === field.value) return
+    try {
+      this.session!.command({ kind: 'set-repeat', part: this.selected, pitch })
+      this.error = ''
+      this.changed()
+    } catch (error) {
+      input.value = String(field.value)
+      const code = (error as { code?: string })?.code
+      const message = error instanceof Error ? error.message : String(error)
+      const found = /\((\d[\d.]*) mm\) a pitch under ([\d.]+) mm makes more than (\d+)/.exec(message)
+      this.error =
+        code === 'INPUT_RANGE' && found
+          ? i18next.t('figure.text.repeat-pitch-too-small', { length: Number(found[1]).toLocaleString(), min: found[2], limit: found[3] })
+          : message
+    }
+  }
   /** Choose a part, from the list, the canvas or a place row. A figure-level tab gives way to the part's properties. */
   private choose(id: string) {
-    this.selected = id
+    /* A copy on the canvas selects its repeat: the part the author made. */
+    this.selected = id ? ownerOf(id) : id
     if (id && (this.tab === 'verdict' || this.tab === 'view' || this.tab === 'history')) this.tab = 'properties'
   }
   private asset(): unknown {
@@ -707,11 +847,12 @@ export class FigureV3Editor extends LitElement {
     const view = this.session?.read()
     if (!view) return html`<p>${i18next.t('figure.text.opening-model')}</p>`
     const unavailable = view.loading || !!view.error || view.saving || !view.context
-    const part = view.geometry.find(g => g.id === this.selected)
+    const part = view.geometry.find(g => ownerOf(g.id) === this.selected)
     /* The controls (state inputs) have their own place in the motion tab; these are the design values. */
     const design = view.fields.filter(i => i.role !== 'state')
-    const own = design.filter(i => this.selected && i.id.startsWith(this.selected + '.'))
-    const common = design.filter(i => !view.geometry.some(g => i.id.startsWith(g.id + '.')))
+    /* A repeat's own row values (its pitch) have their own section, not the shape's. */
+    const own = design.filter(i => this.selected && i.id.startsWith(this.selected + '.') && !i.id.startsWith(this.selected + '.repeat.'))
+    const common = design.filter(i => !view.geometry.some(g => i.id.startsWith(ownerOf(g.id) + '.')))
     const status = view.loading
       ? 'figure.text.loading-figure'
       : view.saving
@@ -747,21 +888,16 @@ export class FigureV3Editor extends LitElement {
           slot="start"
           .budget=${this.budget}
           @show-maturity=${() => (this.tab = 'verdict')}
-          .parts=${view.geometry.map(
-            (g): V3PartRow => ({
-              id: g.id,
-              provider: (g as { shape?: { provider?: string } }).shape?.provider ?? '',
-              hidden: this.hiddenParts.has(g.id),
-              invisible: (g as { visible?: boolean }).visible === false
-            })
-          )}
+          .parts=${this.partRows(view.geometry)}
+          .partBudget=${this.partBudgetOf(asset as V3Asset | undefined)}
+          @set-detail-level=${(e: CustomEvent) => this.linkCommand({ kind: 'set-detail-level', level: e.detail.level })}
           .selected=${this.selected}
           ?locked=${unavailable}
           @add-part=${(e: CustomEvent) => this.add(e.detail.kind)}
           @select-part=${(e: CustomEvent) => this.choose(e.detail.id)}
           @toggle-part-hidden=${(e: CustomEvent) => this.toggleHiddenPart(e.detail.id)}
           @set-all-parts-hidden=${(e: CustomEvent) =>
-            (this.hiddenParts = e.detail.hidden ? new Set(view.geometry.map(g => g.id)) : new Set())}
+            (this.hiddenParts = e.detail.hidden ? new Set(view.geometry.map(g => ownerOf(g.id))) : new Set())}
           @move-part-up=${(e: CustomEvent) => this.movePart(e.detail.id, e.detail.to)}
           @move-part-down=${(e: CustomEvent) => this.movePart(e.detail.id, e.detail.to)}
           @duplicate-part=${(e: CustomEvent) => this.duplicatePart(e.detail.id)}
@@ -815,10 +951,11 @@ export class FigureV3Editor extends LitElement {
                     </div>
                     ${this.renderRepeatNote(view.geometry)}
                   </section>
-                  ${this.renderGroups(groupFields(design, this.selected), 'figure.label.group-placement-size', 'figure.label.group-shape', unavailable, this.renderTools(unavailable))}
+                  ${this.renderRepeat(asset as V3Asset | 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
-                    .body=${part}
+                    .body=${{ ...part, id: this.selected }}
                     .palette=${view.palette ?? {}}
                     ?locked=${unavailable}
                     @v3-part-edit=${(e: CustomEvent) => this.run(() => this.session!.edit(e.detail.edit))}

package/client/modeller/v3-fields.ts

@@ -66,7 +66,11 @@ export function partLabelOf(id: string): string {
  */
 export function repeatOf(id: string, geometry: readonly unknown[] | undefined): { name: string; count: number; index: number } | null {
   const path = pathOf(id)
-  if (!path) return null
+  if (!path) {
+    /* The repeat itself, by its name: how many copies it makes now. */
+    const copies = (geometry ?? []).filter(g => pathOf((g as { id?: string }).id ?? '')?.[0] === `${id}.repeat`).length
+    return copies ? { name: id, count: copies, index: 0 } : null
+  }
   const count = (geometry ?? []).filter(g => pathOf((g as { id?: string }).id ?? '')?.[0] === path[0]).length
   const index = path.find((step): step is number => typeof step === 'number')
   return { name: String(path[0]).replace(/\.repeat$/, ''), count, index: (index ?? 0) + 1 }
@@ -82,3 +86,13 @@ function pathOf(id: string): unknown[] | null {
   }
 }
 
+/**
+ * The authored part a body belongs to: a repeat's copy belongs to its repeat (`roller`), any other body is its own. The
+ * editor selects, lists, hides and names parts by this -- what the author made, not every body the kernel draws
+ * (user, 2026-09-24: the conveyor's sixteen rollers were sixteen rows).
+ */
+export function ownerOf(id: string): string {
+  const path = pathOf(id)
+  return path ? String(path[0]).replace(/\.repeat$/, '') : id
+}
+

package/client/modeller/v3-stage-model.ts

@@ -126,6 +126,30 @@ export function gizmoResultOf(part: V3RenderPart, after: Record<string, unknown>
   return result
 }
 
+/**
+ * A drag as amounts, for a part whose place is worked out (`nudge-part`): how far its origin moved and how far each of
+ * its angles turned (rigid@1's order, degrees). Nothing on an axis that did not change.
+ */
+export function nudgeOf(part: V3RenderPart, result: GizmoResult): { by: Partial<Record<'x' | 'y' | 'z', number>>; turn: Partial<Record<'x' | 'y' | 'z', number>> } {
+  const axes = ['x', 'y', 'z'] as const
+  const by: Partial<Record<'x' | 'y' | 'z', number>> = {}
+  const turn: Partial<Record<'x' | 'y' | 'z', number>> = {}
+  if (result.position) axes.forEach((axis, i) => {
+    const d = round(result.position![i]! - (part.pose.t[i] as number))
+    if (Math.abs(d) > 1e-6) by[axis] = d
+  })
+  if (result.rotation) {
+    const r = part.pose.r
+    const now = new THREE.Euler().setFromRotationMatrix(new THREE.Matrix4().set(r[0]![0]!, r[0]![1]!, r[0]![2]!, 0, r[1]![0]!, r[1]![1]!, r[1]![2]!, 0, r[2]![0]!, r[2]![1]!, r[2]![2]!, 0, 0, 0, 0, 1), 'XYZ')
+    const was: number[] = [now.x, now.y, now.z].map(radians => (radians * 180) / Math.PI)
+    axes.forEach((axis, i) => {
+      const d = round(result.rotation![i]! - was[i]!)
+      if (Math.abs(d) > 1e-6) turn[axis] = d
+    })
+  }
+  return { by, turn }
+}
+
 /** The keys of `next` whose values differ from `current` -- only those are set, so the scene raises no echo. */
 export function changedKeys(current: Record<string, unknown>, next: Record<string, unknown>): Record<string, unknown> | null {
   const diff: Record<string, unknown> = {}

package/dist-client/modeller/figure-v3-parts.d.ts

@@ -22,6 +22,8 @@ export interface V3PartRow {
     hidden?: boolean;
     /** 자산이 지금 상태에서 보이지 않는다고 한 것. 저장되는 것이고, 여기서는 표시만 한다. */
     invisible?: boolean;
+    /** 되풀이한 부품이면 지금 몇 개로 그려지나. 되풀이는 한 부품이다 — 한 줄로 보인다. */
+    copies?: number;
 }
 /** 팔레트 — 저작 API 가 만들 수 있는 것만 보인다. */
 export type V3PaletteKind = V3PrimitiveCreation['kind'] | 'plate' | 'wall';
@@ -38,7 +40,18 @@ export declare class FigureV3Parts extends FigureV3Parts_base {
      * 기준이 저작을 이끈다(V2 모델러의 정체성). 등급이 D 면 무엇이 넘쳤는지를 적는다. 누르면 성숙도 탭이 열린다.
      */
     budget?: V3BudgetLine;
+    /**
+     * 디테일 등급의 부품 한도 — V2 의 S/M/L(사용자 2026-09-24). 부품을 넣기 **전에** 몇 개 남았는지 보이고, 다 차면 팔레트가
+     * 잠긴다. 되풀이는 한 부품으로 센다. 등급을 안 정했으면 한도는 없다.
+     */
+    partBudget?: {
+        level: 'S' | 'M' | 'L' | null;
+        used: number;
+        limit: number | null;
+    };
     render(): import("lit-html").TemplateResult<1>;
+    /** 디테일 등급 — 고르면 한도가 바뀐다. V2 의 자리 그대로, 목록 머리 아래. */
+    private renderLevel;
     private renderBudget;
     /** 한꺼번에 감추고 한꺼번에 되돌린다 — 하나라도 감춰져 있으면 다 되돌리고, 다 보이면 다 감춘다. */
     private renderShowAll;