@things-factory/figure-ui 10.1.57 → 10.1.59

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 { live } from 'lit/directives/live.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'
@@ -31,7 +32,7 @@ import { nudgeOf } from './v3-stage-model.js'
 import { narrowingRetryOf, partRefusalOf, sizeRangeRefusalOf } from './v3-refusals.js'
 import type { V3RenderPart } from './v3-renderer.js'
 import type { V3BudgetLine } from './v3-maturity.js'
-import { instanceRangeOf, instanceRangeToDeclare, rangeDiffers, turnsAboutAJoint } from './v3-links.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'
@@ -764,7 +765,22 @@ export class FigureV3Editor extends LitElement {
       <h3>${i18next.t('figure.label.instance-range')}</h3>
       ${(['x', 'y', 'z'] as const).map(
         axis => html`<div inline-field>
-          <label>${axis.toUpperCase()}</label><span>${mm(range.declared[axis].min)} – ${mm(range.declared[axis].max)} mm</span>
+          <label>${axis.toUpperCase()} <span unit>mm</span></label>
+          <div pair>
+            ${(['min', 'max'] as const).map(
+              bound => html`<input
+                aria-label=${`size.${axis}.${bound}`}
+                type="number"
+                step="any"
+                .value=${live(String(Math.round(range.declared[axis][bound])))}
+                ?disabled=${unavailable}
+                @change=${(e: Event) => {
+                  const next = rangeWith(range.declared, axis, bound, (e.target as HTMLInputElement).valueAsNumber)
+                  if (next) this.linkCommand({ kind: 'declare-instance-size', range: next, replace: true })
+                }}
+              />`
+            )}
+          </div>
         </div>`
       )}
       ${differs
@@ -788,7 +804,18 @@ export class FigureV3Editor extends LitElement {
    * 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) {
-    if (asset.sizing === 'uniform') return html`<div inline-field><label>${i18next.t('figure.label.sizing-rule')}</label><span>${i18next.t('figure.label.sizing-uniform')}</span></div>`
+    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)
+      return html`<div inline-field><label>${i18next.t('figure.label.sizing-rule')}</label><span>${i18next.t('figure.label.sizing-uniform')}</span></div>
+        ${follow?.count
+          ? html`<p hint>${i18next.t('figure.text.proportion-to-follow', { count: follow.count })}</p>
+              <button act ?disabled=${unavailable} @click=${() => this.linkCommand({ kind: 'follow-size-in-proportion' })}>
+                <md-icon>open_in_full</md-icon>${i18next.t('figure.button.follow-size-in-proportion')}
+              </button>`
+          : nothing}
+        ${follow?.kept.length ? html`<p hint>${i18next.t('figure.text.proportion-kept', { what: follow.kept.join(', ') })}</p>` : nothing}`
+    }
     return html`${turnsAboutAJoint(asset) ? html`<p hint>${i18next.t('figure.text.sizing-uniform-proposed')}</p>` : nothing}
       <button act ?disabled=${unavailable} title=${i18next.t('figure.text.sizing-uniform-explained')} @click=${() => this.linkCommand({ kind: 'scale-uniformly' })}>
         <md-icon>aspect_ratio</md-icon>${i18next.t('figure.button.scale-uniformly')}
@@ -842,7 +869,8 @@ export class FigureV3Editor extends LitElement {
     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
+    /* The pitch as it stands: the part's own number, a constant, or what a pitch that follows a length comes to. */
+    const pitch = asset.designInputs[own] ?? model.constants.find(c => c.id === layout?.args[4])?.value ?? valueNow(asset, layout?.args[4])
     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] ?? ''

package/client/modeller/v3-links.ts

@@ -1,4 +1,4 @@
-import { V3_FACES, v3ShapeFaces, v3PartsExtentOf, compileV3Graph, defaultInstanceSizeRange, foldInstanceSizeRange, v3AttachmentsOf, v3BindingsOf, v3InstanceSizeLimitsOf } from '@hatiolab/figure-model'
+import { V3_FACES, v3ShapeFaces, v3PartsExtentOf, compileV3Graph, proposeV3Proportion, defaultInstanceSizeRange, foldInstanceSizeRange, v3AttachmentsOf, v3BindingsOf, v3InstanceSizeLimitsOf } from '@hatiolab/figure-model'
 import type { V3SizeRange } from '@hatiolab/figure-model'
 import type { V3Asset, V3BindingPlace, V3Face, V3Joint } from '@hatiolab/figure-model'
 
@@ -442,6 +442,44 @@ export function instanceRangeToDeclare(asset: V3Asset): { range: V3SizeRange; at
 }
 
 /** Whether measuring again would change the declared range (to a micrometre). */
+/**
+ * The declared range with one end typed by the author: the sizes a figure may be placed at are a claim about the
+ * product (a gantry spans metres, not 30 cm to 29 m), and measuring only ever widens them. Nothing when the typed
+ * value is not a number; whether the figure holds there is the command's to say.
+ */
+export function rangeWith(declared: V3SizeRange, axis: Axis, bound: 'min' | 'max', value: number): V3SizeRange | undefined {
+  if (!Number.isFinite(value)) return undefined
+  const next = structuredClone(declared)
+  next[axis][bound] = value
+  return next
+}
+
+/**
+ * For a figure that grows by one ratio: how many of its lengths would follow the ratio, and which it leaves with their
+ * own number (not those that follow another length -- they grow with it). Nothing for a figure of another sizing.
+ */
+export function proportionToFollow(asset: V3Asset): { count: number; kept: string[] } | undefined {
+  if (asset.sizing !== 'uniform') return undefined
+  try {
+    const plan = proposeV3Proportion(asset)
+    return { count: plan.dimensions.length + plan.lengths.length, kept: plan.skipped.filter(s => !s.follows).map(s => s.what) }
+  } catch {
+    return undefined
+  }
+}
+
+/** A value of the figure as it stands, by its graph reference. */
+export function valueNow(asset: V3Asset, ref: string | undefined): number | undefined {
+  if (!ref) return undefined
+  try {
+    const values = compileV3Graph(asset.document.model as never).evaluate({ ...asset.designInputs, ...asset.stateDefaults }).values as Record<string, number>
+    const value = values[ref]
+    return typeof value === 'number' && Number.isFinite(value) ? value : undefined
+  } catch {
+    return undefined
+  }
+}
+
 export function rangeDiffers(a: V3SizeRange, b: V3SizeRange): boolean {
   return AXES.some(axis => Math.abs(a[axis].min - b[axis].min) > 1e-3 || Math.abs(a[axis].max - b[axis].max) > 1e-3)
 }

package/dist-client/modeller/v3-clips.d.ts

@@ -34,6 +34,6 @@ export declare const trackEdit: (clip: Clip, track: ClipTrack, patch?: Partial<P
     state: string;
     clip: string;
     keys: ClipKey[];
-    loop: "wrap" | "hold";
+    loop: "hold" | "wrap";
     interpolation: "linear" | "step";
 };

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 { live } from 'lit/directives/live.js';
 import { PART_LIMIT, v3PartCountOf } from '@hatiolab/figure-model';
 import { captureV3Thumbnail } from './v3-thumbnail.js';
 import { drawableV3Parts } from './v3-renderer.js';
@@ -26,7 +27,7 @@ import { alignChanges, boxOf, canMirror, mirrorChanges } from './v3-align.js';
 import { paletteRecipe } from './v3-palette.js';
 import { nudgeOf } from './v3-stage-model.js';
 import { narrowingRetryOf, partRefusalOf, sizeRangeRefusalOf } from './v3-refusals.js';
-import { instanceRangeOf, instanceRangeToDeclare, rangeDiffers, turnsAboutAJoint } from './v3-links.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 { liveOverSession, NOTHING_LIVE, scrubbed, scrubStep } from './v3-live.js';
@@ -778,7 +779,21 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
         return html `<section>
       <h3>${i18next.t('figure.label.instance-range')}</h3>
       ${['x', 'y', 'z'].map(axis => html `<div inline-field>
-          <label>${axis.toUpperCase()}</label><span>${mm(range.declared[axis].min)} – ${mm(range.declared[axis].max)} mm</span>
+          <label>${axis.toUpperCase()} <span unit>mm</span></label>
+          <div pair>
+            ${['min', 'max'].map(bound => html `<input
+                aria-label=${`size.${axis}.${bound}`}
+                type="number"
+                step="any"
+                .value=${live(String(Math.round(range.declared[axis][bound])))}
+                ?disabled=${unavailable}
+                @change=${(e) => {
+            const next = rangeWith(range.declared, axis, bound, e.target.valueAsNumber);
+            if (next)
+                this.linkCommand({ kind: 'declare-instance-size', range: next, replace: true });
+        }}
+              />`)}
+          </div>
         </div>`)}
       ${differs
             ? html `<p hint>
@@ -801,8 +816,18 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
      * it is offered it -- a mechanism does not shear -- and the author decides (chief architect's ruling 2026-09-24).
      */
     renderSizingRule(asset, unavailable) {
-        if (asset.sizing === 'uniform')
-            return html `<div inline-field><label>${i18next.t('figure.label.sizing-rule')}</label><span>${i18next.t('figure.label.sizing-uniform')}</span></div>`;
+        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);
+            return html `<div inline-field><label>${i18next.t('figure.label.sizing-rule')}</label><span>${i18next.t('figure.label.sizing-uniform')}</span></div>
+        ${follow?.count
+                ? html `<p hint>${i18next.t('figure.text.proportion-to-follow', { count: follow.count })}</p>
+              <button act ?disabled=${unavailable} @click=${() => this.linkCommand({ kind: 'follow-size-in-proportion' })}>
+                <md-icon>open_in_full</md-icon>${i18next.t('figure.button.follow-size-in-proportion')}
+              </button>`
+                : nothing}
+        ${follow?.kept.length ? html `<p hint>${i18next.t('figure.text.proportion-kept', { what: follow.kept.join(', ') })}</p>` : nothing}`;
+        }
         return html `${turnsAboutAJoint(asset) ? html `<p hint>${i18next.t('figure.text.sizing-uniform-proposed')}</p>` : nothing}
       <button act ?disabled=${unavailable} title=${i18next.t('figure.text.sizing-uniform-explained')} @click=${() => this.linkCommand({ kind: 'scale-uniformly' })}>
         <md-icon>aspect_ratio</md-icon>${i18next.t('figure.button.scale-uniformly')}
@@ -855,7 +880,8 @@ let FigureV3Editor = class FigureV3Editor extends LitElement {
         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;
+        /* The pitch as it stands: the part's own number, a constant, or what a pitch that follows a length comes to. */
+        const pitch = asset.designInputs[own] ?? model.constants.find(c => c.id === layout?.args[4])?.value ?? valueNow(asset, layout?.args[4]);
         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] ?? '';