@things-factory/figure-ui 10.1.56 → 10.1.58

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, rangeDiffers, rangeWith, turnsAboutAJoint } 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

package/client/modeller/v3-links.ts

@@ -442,6 +442,18 @@ 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
+}
+
 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/figure-v3-capability.d.ts

@@ -15,7 +15,7 @@ export declare class FigureV3Capability extends FigureV3Capability_base {
     /** The selected part, whose places are marked. */
     selected: string;
     locked: boolean;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     private setRung;
     private pick;
 }

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

@@ -18,7 +18,7 @@ export declare class FigureV3Clips extends FigureV3Clips_base {
     /** Where each clip is scrubbed to, in seconds. */
     private at;
     private adding;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     private renderClip;
     private renderTrack;
     private renderAdd;

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

@@ -22,7 +22,7 @@ export declare class FigureV3Controls extends FigureV3Controls_base {
     private open;
     /** Values in hand while a slider is dragged: the dial and the number follow them before the release commits. */
     private live;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     private renderControl;
     private renderDial;
     private renderSettings;

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

@@ -34,7 +34,7 @@ export declare class FigureV3Links extends FigureV3Links_base {
     /** The motion form is open over the part's own motion, to change it where it is. */
     private editingMotion;
     willUpdate(changed: Map<string, unknown>): void;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     /** Where things are held on this part: a seat things rest on, or a grip things are held in (parity row ⑤). */
     private renderPlaces;
     /** The figure holds things: `Capacity` and `Holdable`, the ladder's middle rung. One part edit, one undo step. */

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

@@ -26,7 +26,7 @@ export declare class FigureV3Material extends FigureV3Material_base {
     locked: boolean;
     /** The glow while its slider is dragged: shown beside it and drawn on the canvas, recorded on release. */
     private glowing?;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     private renderSegments;
     private swatches;
     private offered;

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

@@ -29,7 +29,7 @@ export declare class FigureV3Properties extends FigureV3Properties_base {
     private pickedPart?;
     private pickedFace?;
     private facts;
-    render(): typeof nothing | import("lit-html").TemplateResult<1>;
+    render(): import("lit-html").TemplateResult<1> | typeof nothing;
     private renderName;
     /**
      * The face the figure is placed by. In V3 it is part of the room declaration, so choosing one declares the room

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, rangeDiffers, rangeWith, turnsAboutAJoint } 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>