@things-factory/figure-ui 10.1.48 → 10.1.49

package/dist-client/modeller/v3-editor.js

@@ -4,6 +4,7 @@ import { LitElement, html, css, nothing } from 'lit';
 import { i18next } from '@operato/i18n';
 import '@operato/layout';
 import { customElement, property, state } from 'lit/decorators.js';
+import { PART_LIMIT, v3PartCountOf } from '@hatiolab/figure-model';
 import { captureV3Thumbnail } from './v3-thumbnail.js';
 import { drawableV3Parts } from './v3-renderer.js';
 import './v3-canvas.js';
@@ -18,10 +19,11 @@ import { DEFAULT_VIEW } from './figure-view.js';
 import './figure-v3-capability.js';
 import { gizmoChanges, gizmoReachOf } from './v3-gizmo.js';
 import { keyActionOf } from './v3-keys.js';
-import { groupFields, partLabelOf, repeatOf } from './v3-fields.js';
+import { groupFields, ownerOf, partLabelOf, repeatOf } from './v3-fields.js';
 import { SidePanelStyles } from './side-panel-styles.js';
 import { alignChanges, boxOf, canMirror, mirrorChanges } from './v3-align.js';
 import { paletteRecipe } from './v3-palette.js';
+import { nudgeOf } from './v3-stage-model.js';
 import { instanceRangeOf, rangeDiffers, turnsAboutAJoint } from './v3-links.js';
 import { jointFanOf } from './v3-joint-fan.js';
 import { isLive, livePartsOf, NOTHING_LIVE, scrubbed, scrubStep } from './v3-live.js';
@@ -280,7 +282,7 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
             this.error = '';
             this.hiddenParts = new Set();
         }
-        if (view && !view.geometry.some(g => g.id === this.selected))
+        if (view && !view.geometry.some(g => ownerOf(g.id) === this.selected))
             this.selected = '';
     }
     run(action) {
@@ -300,7 +302,7 @@ let FigureV3Editor = 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. */
     drawnParts(geometry, asset) {
         const parts = (isLive(this.live) && asset ? livePartsOf(asset, this.live) : null) ?? drawableV3Parts(geometry ?? []);
-        return parts.filter(body => !this.hiddenParts.has(body.id));
+        return parts.filter(body => !this.hiddenParts.has(ownerOf(body.id)));
     }
     /**
      * Where the selected part turns and how far, with the pose as it is drawn now -- a value in hand included, so the
@@ -403,7 +405,8 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
     /** What the gizmo may write for the selected part — read off the asset being edited. */
     reachOf(id) {
         const none = { translate: false, rotate: false, scale: false };
-        if (!id || !this.session)
+        /* 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);
@@ -417,10 +420,39 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
         const view = this.session.read();
         const sizes = Object.fromEntries(view.fields.map(field => [field.id, field.value]));
         const changes = gizmoChanges(id, this.reachOf(id), result, sizes);
-        if (changes.length)
+        if (changes.length) {
             this.run(() => this.session.apply(changes));
-        else
+            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);
+        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. */
     align(tool) {
@@ -486,7 +518,7 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
      */
     renderRepeatNote(geometry) {
         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;
     }
     renamePart(input) {
         const name = input.value.trim();
@@ -691,9 +723,118 @@ let FigureV3Editor = 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).
+     */
+    partRows(geometry) {
+        const rows = new Map();
+        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.shape?.provider ?? '',
+                hidden: this.hiddenParts.has(id),
+                invisible: g.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). */
+    partBudgetOf(asset) {
+        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).
+     */
+    renderRepeat(asset, geometry, unavailable) {
+        const repeat = repeatOf(this.selected, geometry);
+        if (!asset || !repeat || repeat.index)
+            return nothing;
+        const model = asset.document.model;
+        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', 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) => 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.
+     */
+    setPitch(field, event) {
+        const input = event.target;
+        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?.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. */
     choose(id) {
-        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';
     }
@@ -731,11 +872,12 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
         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
@@ -769,18 +911,15 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
           slot="start"
           .budget=${this.budget}
           @show-maturity=${() => (this.tab = 'verdict')}
-          .parts=${view.geometry.map((g) => ({
-            id: g.id,
-            provider: g.shape?.provider ?? '',
-            hidden: this.hiddenParts.has(g.id),
-            invisible: g.visible === false
-        }))}
+          .parts=${this.partRows(view.geometry)}
+          .partBudget=${this.partBudgetOf(asset)}
+          @set-detail-level=${(e) => this.linkCommand({ kind: 'set-detail-level', level: e.detail.level })}
           .selected=${this.selected}
           ?locked=${unavailable}
           @add-part=${(e) => this.add(e.detail.kind)}
           @select-part=${(e) => this.choose(e.detail.id)}
           @toggle-part-hidden=${(e) => this.toggleHiddenPart(e.detail.id)}
-          @set-all-parts-hidden=${(e) => (this.hiddenParts = e.detail.hidden ? new Set(view.geometry.map(g => g.id)) : new Set())}
+          @set-all-parts-hidden=${(e) => (this.hiddenParts = e.detail.hidden ? new Set(view.geometry.map(g => ownerOf(g.id))) : new Set())}
           @move-part-up=${(e) => this.movePart(e.detail.id, e.detail.to)}
           @move-part-down=${(e) => this.movePart(e.detail.id, e.detail.to)}
           @duplicate-part=${(e) => this.duplicatePart(e.detail.id)}
@@ -834,10 +973,11 @@ let FigureV3Editor = 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, 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) => this.run(() => this.session.edit(e.detail.edit))}