@things-factory/figure-ui 10.1.104 → 10.1.106

package/client/modeller/figure-section-editor.ts

@@ -6,8 +6,9 @@ import { i18next, localize } from '@operato/i18n'
 import { figureCavitySectionOf, figureSectionSidesOf } from '@hatiolab/figure-model'
 import type { FigureAuthoringAction, FigureEvaluatedShape, FigureSection, FigureSectionMeasure, FigureSectionPoint } from '@hatiolab/figure-model'
 import { SidePanelStyles } from './side-panel-styles.js'
-import { apexOver, drawnOf, insertAfter, markedBy, movePoint, pointLabel, removePoint, sectionOf, workingIssuesOf, workingOf, type SectionWorking } from './section-drawing.js'
-import { END_FACE } from './section-controls.js'
+import { apexOver, drawnOf, insertAfter, markedBy, movePoint, pointLabel, removePoint, sectionOf, workingIssuesOf, workingOf, workingShapeOf, type SectionWorking } from './section-drawing.js'
+import { cavityDepthOf, cavityRequestOf, cavityResultOf, END_FACE, sameOf, sidesOf } from './section-controls.js'
+import './figure-cavity-drawing.js'
 import { openPopup } from '@operato/layout'
 import './figure-section-close-choice.js'
 import type { SectionCloseChoice } from './figure-section-close-choice.js'
@@ -17,6 +18,10 @@ type Axis = 'x' | 'y' | 'z'
 /** How the section is laid on the screen, by the axis it is pushed along: across to the right, then down. */
 const SCREEN: Record<Axis, [Axis, Axis]> = { y: ['x', 'z'], x: ['z', 'y'], z: ['x', 'y'] }
 
+/** The inside said so two can be compared: its walls by side, its ends. */
+const cavityKey = (w: SectionWorking) =>
+  w.cavity ? [Object.entries(w.cavity.wall).sort(), w.cavity.start, w.cavity.end] : null
+
 /** The editor's width and room for the solid beside it: below this the two take turns. */
 export const NARROW_BELOW = 900
 
@@ -35,6 +40,10 @@ export const NARROW_BELOW = 900
  * apex is dragged or typed like a point, and is not offered while something is fastened to the end it takes away (the
  * kernel's own refusal, `pointBlocked`).
  *
+ * A rectangle's or ellipse's inside is made, changed or taken away here too, by the same drawing the section panel has
+ * (figure-cavity-drawing), drawn and judged on the widths being typed: walls that fit only a wider section are taken
+ * with it, in the same command (figure-model `set-section`'s `cavity`).
+ *
  * What the kernel would refuse is marked on the outline and said in the list; apply is held back, and the solid shows
  * the last valid state, which the caption names. Apply sends one `set-section` command (one step of the history); cancel
  * or Esc sends nothing and lets the preview go -- after asking, when something was changed: apply it, let it go, or keep
@@ -192,6 +201,26 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
       min-width: 0;
       font: inherit;
     }
+    div[cavity] {
+      display: grid;
+      gap: 6px;
+      margin-top: 10px;
+      padding-top: 8px;
+      border-top: 1px solid var(--md-sys-color-outline-variant);
+    }
+    /* The panel's width: wider, the drawing pushed the outline out of view. */
+    div[cavity] figure-cavity-drawing {
+      max-width: 340px;
+    }
+    label[toggle] {
+      display: flex;
+      align-items: center;
+      gap: 6px;
+      flex-wrap: wrap;
+    }
+    label[toggle] small[result] {
+      margin-left: auto;
+    }
     ul[issues] {
       margin: 8px 0 0;
       padding: 0 0 0 16px;
@@ -256,7 +285,9 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
     if (!this.narrow) this.show = 'outline'
   })
 
-  @state() private working: SectionWorking = { points: [], across: {}, length: 0, apex: null }
+  @state() private working: SectionWorking = { points: [], across: {}, length: 0, apex: null, cavity: null }
+  /** Walls one per side in the inside's drawing; on when they open differing. */
+  @state() private perSide = false
   @state() private selected: string | null = null
   @state() private note = ''
   private opened!: SectionWorking
@@ -274,6 +305,10 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
   private get kind() {
     return this.body && drawnOf(this.body.shape)?.section.kind
   }
+  /** A pushed rectangle or ellipse can have an inside; a drawn section's is a later stage. */
+  private get hollowable() {
+    return !!this.body?.shape.extrusion && (this.kind === 'rectangle' || this.kind === 'ellipse')
+  }
 
   connectedCallback() {
     super.connectedCallback()
@@ -282,6 +317,7 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
     this.lastValid = this.working
     this.openedAt = this.revision
     this.extent = this.extentOf(this.working)
+    this.perSide = !!this.working.cavity && sameOf(Object.values(this.working.cavity.wall)) === undefined
     window.addEventListener('keydown', this.keys, true)
     if (this.parentElement) this.room.observe(this.parentElement)
   }
@@ -310,6 +346,8 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
    */
   private keys = (e: KeyboardEvent) => {
     const inField = (e.composedPath()[0] as HTMLElement)?.tagName === 'INPUT'
+    /* A number being typed in the inside's drawing: Esc there puts the number back, not the editor away. */
+    if (inField && e.composedPath().some(el => (el as HTMLElement).tagName === 'FIGURE-CAVITY-DRAWING')) return
     /* While the close is being asked, the question has the keys: Esc there is 계속 편집. */
     if (this.asking) return
     const take = () => (e.preventDefault(), e.stopImmediatePropagation())
@@ -351,10 +389,8 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
   }
 
   /** The solid behind shows the working state, or the last valid one while the working one is refused. */
-  private preview() {
-    this.dispatchEvent(
-      new CustomEvent('command-live', { detail: { action: this.action(this.lastValid) }, bubbles: true, composed: true })
-    )
+  private preview(w = this.lastValid) {
+    this.dispatchEvent(new CustomEvent('command-live', { detail: { action: this.action(w) }, bubbles: true, composed: true }))
   }
 
   /** One command for everything changed since the editor opened; a measure not changed is not sent (it may follow another). */
@@ -363,13 +399,15 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
     const changed = (a: number | undefined, b: number | undefined) => Math.abs((a ?? 0) - (b ?? 0)) > 1e-9
     const across = Object.fromEntries(Object.entries(w.across).filter(([k, v]) => changed(v, o.across[k as Axis])))
     const apexMoved = !w.apex !== !o.apex || (!!w.apex && Object.entries(w.apex).some(([k, v]) => changed(v, o.apex![k as Axis])))
+    const cavityMoved = JSON.stringify(cavityKey(w)) !== JSON.stringify(cavityKey(o))
     return {
       kind: 'set-section',
       part: this.body!.id,
       ...(this.kind === 'polygon' ? { points: w.points.map(p => ({ ...p })) } : {}),
       ...(Object.keys(across).length ? { across } : {}),
       ...(changed(w.length, o.length) ? { length: w.length } : {}),
-      ...(apexMoved ? { apex: w.apex ? { ...w.apex } : null } : {})
+      ...(apexMoved ? { apex: w.apex ? { ...w.apex } : null } : {}),
+      ...(cavityMoved ? { cavity: w.cavity ? { wall: { ...w.cavity.wall }, start: w.cavity.start, end: w.cavity.end } : null } : {})
     }
   }
 
@@ -403,7 +441,8 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
         w.points.map(p => [p.id, p.x ?? 0, p.y ?? 0, p.z ?? 0]),
         Object.entries(w.across).sort(),
         w.length,
-        w.apex ? Object.entries(w.apex).sort() : null
+        w.apex ? Object.entries(w.apex).sort() : null,
+        cavityKey(w)
       ])
     return !!this.opened && key(this.working) !== key(this.opened)
   }
@@ -529,8 +568,7 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
     const grid = Math.max(10, Math.pow(10, Math.floor(Math.log10(e))) / 2)
     const lines: number[] = []
     for (let g = -Math.floor(e / grid) * grid; g <= e; g += grid) lines.push(g)
-    const cavity = this.body!.shape.cavity
-    const inside = cavity && !invalid ? figureCavitySectionOf(section, this.axis, cavity.wall) : undefined
+    const inside = w.cavity && !invalid ? figureCavitySectionOf(section, this.axis, w.cavity.wall) : undefined
     const sized = (axis: Axis) => this.measures?.measures[axis] === 'editable'
     return html`<div caption ?last-valid=${invalid}>
         ${invalid ? i18next.t('figure.text.section-editor-last-valid') : i18next.t('figure.text.section-editor-units', { h: h.toUpperCase(), v: v.toUpperCase() })}
@@ -710,6 +748,62 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
         : nothing}`
   }
 
+  /** The inside, as the section panel shows it, on the working section: on or off, what it makes, its drawing. */
+  private cavityBlock(invalid: boolean) {
+    const w = this.working
+    const shape = workingShapeOf(this.body!.shape, w)
+    return html`<div cavity>
+      <label toggle>
+        <input
+          type="checkbox"
+          .checked=${live(!!w.cavity)}
+          @change=${(ev: Event) => {
+            const on = (ev.target as HTMLInputElement).checked
+            const ask = cavityRequestOf(shape, {})
+            const wall = typeof ask.wall === 'number' ? Object.fromEntries(sidesOf(this.axis).map(side => [side, ask.wall as number])) : (ask.wall as Record<string, number>)
+            this.change({ ...w, cavity: on ? { wall, start: ask.start, end: ask.end } : null })
+          }}
+        />
+        ${i18next.t('figure.label.section-cavity')}
+        ${w.cavity && !invalid
+          ? html`<small result>
+              ${i18next.t('figure.text.section-depth', {
+                result: i18next.t(`figure.label.section-result-${cavityResultOf(shape.cavity!)}`),
+                depth: String(cavityDepthOf(shape))
+              })}
+            </small>`
+          : nothing}
+      </label>
+      ${w.cavity
+        ? html`<figure-cavity-drawing
+              .body=${{ id: this.body!.id, shape }}
+              .perSide=${this.perSide}
+              @command-live=${(ev: CustomEvent) => {
+                ev.stopPropagation()
+                const c = this.cavityOf(ev.detail.action)
+                this.preview(c && this.valid({ ...this.working, cavity: c }) ? { ...this.working, cavity: c } : this.lastValid)
+              }}
+              @command=${(ev: CustomEvent) => {
+                ev.stopPropagation()
+                const c = this.cavityOf(ev.detail.action)
+                if (c) this.change({ ...this.working, cavity: c })
+              }}
+            ></figure-cavity-drawing>
+            <label toggle>
+              <input type="checkbox" .checked=${live(this.perSide)} @change=${(ev: Event) => (this.perSide = (ev.target as HTMLInputElement).checked)} />
+              ${i18next.t('figure.label.section-wall-per-side')}
+            </label>`
+        : nothing}
+    </div>`
+  }
+
+  /** The inside a drawing's set-cavity asks for, every wall written out; the drawing's commands stay in the editor. */
+  private cavityOf(action: FigureAuthoringAction | null): SectionWorking['cavity'] | undefined {
+    if (action?.kind !== 'set-cavity' || !action.cavity) return undefined
+    const { wall, start, end } = action.cavity
+    return { wall: typeof wall === 'number' ? Object.fromEntries(sidesOf(this.axis).map(side => [side, wall])) : ({ ...wall } as Record<string, number>), start, end }
+  }
+
   private list(issues: ReturnType<typeof workingIssuesOf>['issues'], words: ReturnType<typeof workingIssuesOf>['words']) {
     const [h, v] = SCREEN[this.axis]
     const marked = markedBy(issues)
@@ -773,6 +867,7 @@ export class FigureSectionEditor extends localize(i18next)(LitElement) {
             )}
           </ol>`
         : nothing}
+      ${this.hollowable ? this.cavityBlock(words.length > 0) : nothing}
       ${this.note ? html`<small role="status">${this.note}</small>` : nothing}
       ${words.length
         ? html`<ul issues role="alert">

package/client/modeller/figure-section-panel.ts

@@ -4,30 +4,12 @@ import { customElement, property, state } from 'lit/decorators.js'
 import { live } from 'lit/directives/live.js'
 
 import { i18next, localize } from '@operato/i18n'
-import type { FigureAuthoringAction, FigureCavityRequest, FigureEvaluatedShape } from '@hatiolab/figure-model'
+import type { FigureAuthoringAction, FigureEvaluatedShape } from '@hatiolab/figure-model'
 import { SidePanelStyles } from './side-panel-styles.js'
 import { drawnOf } from './section-drawing.js'
 import './figure-cavity-drawing.js'
-import {
-  END_FACE,
-  SIDE_FACE,
-  cavityDepthOf,
-  cavityRefusalOf,
-  cavityRequestOf,
-  cavityResultOf,
-  cornerLimitOf,
-  cornerRefusalOf,
-  defaultWallOf,
-  mm,
-  sameOf,
-  sidesOf,
-  sideWallLimitOf,
-  wallLimitOf,
-  type FigureCavityAsk
-} from './section-controls.js'
+import { cavityDepthOf, cavityRequestOf, cavityResultOf, cornerLimitOf, cornerRefusalOf, mm, sameOf } from './section-controls.js'
 
-type Axis = 'x' | 'y' | 'z'
-type End = 'start' | 'end'
 type Body = { id: string; shape: FigureEvaluatedShape }
 
 /**
@@ -114,7 +96,7 @@ export class FigureSectionPanel extends localize(i18next)(LitElement) {
           </div>`
         : nothing}
       ${kind === 'rectangle' ? this.renderCorner(body) : nothing}
-      ${/* No inside for a drawn section: the control is not there, rather than a line saying so. */ kind === 'rectangle' || kind === 'ellipse' ? this.renderCavity(body, e.axis) : nothing}
+      ${/* No inside for a drawn section: the control is not there, rather than a line saying so. */ kind === 'rectangle' || kind === 'ellipse' ? this.renderCavity(body) : nothing}
     </section>`
   }
 
@@ -142,29 +124,13 @@ export class FigureSectionPanel extends localize(i18next)(LitElement) {
     </div>`
   }
 
-  private renderCavity(body: Body, axis: Axis) {
+  /*
+   * The inside: made or taken away here, and drawn -- walls dragged or their number pressed and typed, ends pressed
+   * open or closed (figure-cavity-drawing). The number fields under the drawing went (user 2026-10-01): they said the
+   * drawing again.
+   */
+  private renderCavity(body: Body) {
     const cavity = body.shape.cavity
-    const request = (patch: Partial<FigureCavityRequest>) => cavityRequestOf(body.shape, patch)
-    const said = (ask: FigureCavityAsk | null) =>
-      !ask
-        ? ''
-        : ask.code === 'not-positive'
-          ? i18next.t('figure.text.section-not-positive')
-          : i18next.t(`figure.text.section-${ask.code === 'wall-too-thick' ? 'wall' : 'ends'}-over`, { max: String(ask.max) })
-    const cavityField = (key: string, now: number | undefined, patch: (value: number) => Partial<FigureCavityRequest>) =>
-      this.number(key, now, {
-        min: 0,
-        ask: value => {
-          if (!(value > 0)) return i18next.t('figure.text.section-not-positive')
-          const ask = cavityRefusalOf(body.shape, request(patch(value)))
-          /* One side too thick: the most it can be is the width across less the wall opposite, not the even limit. */
-          const side = key.startsWith('wall.') ? key.slice(5) : undefined
-          if (ask?.code === 'wall-too-thick' && side && cavity)
-            return said({ code: 'wall-too-thick', max: mm(sideWallLimitOf(body.shape, cavity.wall, side)) })
-          return said(ask)
-        },
-        action: value => ({ kind: 'set-cavity', part: body.id, cavity: request(patch(value)) })
-      })
     return html`<div field>
         <label toggle>
           <input
@@ -174,7 +140,7 @@ export class FigureSectionPanel extends localize(i18next)(LitElement) {
             @change=${(ev: Event) => {
               const on = (ev.target as HTMLInputElement).checked
               ;(ev.target as HTMLInputElement).checked = !!cavity
-              this.command({ kind: 'set-cavity', part: body.id, cavity: on ? request({}) : null })
+              this.command({ kind: 'set-cavity', part: body.id, cavity: on ? cavityRequestOf(body.shape, {}) : null })
             }}
           />
           ${i18next.t('figure.label.section-cavity')}
@@ -188,69 +154,15 @@ export class FigureSectionPanel extends localize(i18next)(LitElement) {
             </small>`
           : nothing}
       </div>
-      ${cavity ? html`<figure-cavity-drawing .body=${body} .perSide=${this.perSide} ?locked=${this.locked}></figure-cavity-drawing>` : nothing}
       ${cavity
-        ? html`<div form>
-              <label>${i18next.t('figure.label.section-wall')}</label>
-              <div>
-              ${this.perSide
-                ? html`<div sides>
-                    ${[...sidesOf(axis)].sort((a, b) => a[0]!.localeCompare(b[0]!) || (a[1] === '-' ? -1 : 1)).map(
-                      side => html`<label>
-                        <span>${i18next.t('figure.label.face-' + SIDE_FACE[side])}</span>
-                        ${cavityField(`wall.${side}`, cavity.wall[side], value => ({ wall: { ...cavity.wall, [side]: value } }))}
-                      </label>`
-                    )}
-                  </div>`
-                : cavityField('wall', sameOf(Object.values(cavity.wall)), value => ({ wall: value }))}
-              ${this.perSide || this.refusals.wall
-                ? nothing
-                : html`<small>${i18next.t('figure.text.section-wall-at-most', { max: String(mm(wallLimitOf(body.shape))) })}</small>`}
-              <label toggle>
-                <input
-                  type="checkbox"
-                  .checked=${live(this.perSide)}
-                  ?disabled=${this.locked}
-                  @change=${(ev: Event) => (this.perSide = (ev.target as HTMLInputElement).checked)}
-                />
-                ${i18next.t('figure.label.section-wall-per-side')}
-              </label>
-              </div>
-            </div>
-            ${(['start', 'end'] as const).map(end => this.renderEnd(body, axis, end, cavity[end], request, cavityField))}`
+        ? html`<figure-cavity-drawing .body=${body} .perSide=${this.perSide} ?locked=${this.locked}></figure-cavity-drawing>
+            <label toggle>
+              <input type="checkbox" .checked=${live(this.perSide)} ?disabled=${this.locked} @change=${(ev: Event) => (this.perSide = (ev.target as HTMLInputElement).checked)} />
+              ${i18next.t('figure.label.section-wall-per-side')}
+            </label>`
         : nothing}`
   }
 
-  private renderEnd(
-    body: Body,
-    axis: Axis,
-    end: End,
-    now: 'open' | { closed: number },
-    request: (patch: Partial<FigureCavityRequest>) => FigureCavityRequest,
-    cavityField: (key: string, now: number | undefined, patch: (value: number) => Partial<FigureCavityRequest>) => unknown
-  ) {
-    const closed = now !== 'open'
-    return html`<div form>
-      <label>${i18next.t('figure.label.face-' + END_FACE(axis, end))}</label>
-      <div row>
-        <select
-          .value=${live(closed ? 'closed' : 'open')}
-          ?disabled=${this.locked}
-          @change=${(ev: Event) => {
-            const select = ev.target as HTMLSelectElement
-            const want = select.value
-            select.value = closed ? 'closed' : 'open'
-            this.command({ kind: 'set-cavity', part: body.id, cavity: request({ [end]: want === 'open' ? 'open' : { closed: defaultWallOf(body.shape) } }) })
-          }}
-        >
-          <option value="closed">${i18next.t('figure.label.section-end-closed')}</option>
-          <option value="open">${i18next.t('figure.label.section-end-open')}</option>
-        </select>
-        ${closed ? cavityField(`closed.${end}`, now.closed, value => ({ [end]: { closed: value } })) : html`<span></span>`}
-      </div>
-    </div>`
-  }
-
   /**
    * A millimetre field. Typing draws the value (or, if the kernel would refuse it, says why under the field and draws the
    * figure as it stands); Enter or leaving sends it once; Esc puts the value back.

package/client/modeller/section-drawing.ts

@@ -1,5 +1,5 @@
 import { FIGURE_SECTION_PLANE, FIGURE_SECTION_POINT_LIMIT, checkFigureSection, figureExtrusionFeaturesOf, figureSectionSidesOf } from '@hatiolab/figure-model'
-import type { FigureEvaluatedShape, FigureSection, FigureSectionIssue, FigureSectionPoint } from '@hatiolab/figure-model'
+import type { FigureCavityRequest, FigureEvaluatedShape, FigureSection, FigureSectionIssue, FigureSectionPoint } from '@hatiolab/figure-model'
 
 /*
  * What the section editor does to a drawn section's points, and how it says what is wrong with them (ADR-0100 §3.2).
@@ -106,6 +106,8 @@ export interface SectionWorking {
   length: number
   /** A drawn section's end drawn to one point (a pyramid), across the plane axes; null for a push. */
   apex: Partial<Record<Axis, number>> | null
+  /** A pushed rectangle's or ellipse's inside, every side's wall written out; null for none or a drawn section. */
+  cavity: { wall: Record<string, number>; start: FigureCavityRequest['start']; end: FigureCavityRequest['end'] } | null
 }
 
 /** A pushed part's section, axis and ends -- or a pyramid's, whose end is its apex (figure-model `loft@1`). */
@@ -135,7 +137,28 @@ export function workingOf(shape: FigureEvaluatedShape): SectionWorking {
       : s.kind === 'ellipse'
         ? { [u]: 2 * s.radius[u]!, [v]: 2 * s.radius[v]! }
         : {}
-  return { points: s.kind === 'polygon' ? s.points.map(p => ({ ...p })) : [], across, length: e.end - e.start, apex: e.apex ? { ...e.apex } : null }
+  const c = shape.extrusion && shape.cavity
+  return {
+    points: s.kind === 'polygon' ? s.points.map(p => ({ ...p })) : [],
+    across,
+    length: e.end - e.start,
+    apex: e.apex ? { ...e.apex } : null,
+    cavity: c ? { wall: { ...c.wall }, start: c.start, end: c.end } : null
+  }
+}
+
+/**
+ * The part as the working state would make it: its section, its length from the same start, its inside -- what the
+ * inside's drawing reads, so its walls are judged against the widths being typed and not the ones the editor opened with.
+ */
+export function workingShapeOf(shape: FigureEvaluatedShape, w: SectionWorking): FigureEvaluatedShape {
+  const e = shape.extrusion!
+  const { cavity: _, ...rest } = shape
+  return {
+    ...rest,
+    extrusion: { ...e, section: sectionOf(shape, w), end: e.start + w.length },
+    ...(w.cavity ? { cavity: { id: shape.cavity?.id ?? 'inside', wall: { ...w.cavity.wall }, start: w.cavity.start, end: w.cavity.end } } : {})
+  } as FigureEvaluatedShape
 }
 
 /** The section the working state makes, of the part's own kind: its corners kept, its points or widths the working ones. */
@@ -159,8 +182,8 @@ export function workingIssuesOf(
   const words = issues.map(i => issueWords(i, w.points, e.axis))
   if (!(Number.isFinite(w.length) && w.length > 0)) words.push({ key: 'figure.text.section-issue-length', params: {} })
   if (w.apex && !Object.values(w.apex).every(n => Number.isFinite(n))) words.push({ key: 'figure.text.section-issue-number', params: {} })
-  if (!issues.length && words.length === 0 && shape.cavity) {
-    const made = figureExtrusionFeaturesOf({ axis: e.axis, section, start: e.start, end: e.start + w.length }, [shape.cavity])
+  if (!issues.length && words.length === 0 && w.cavity) {
+    const made = figureExtrusionFeaturesOf({ axis: e.axis, section, start: e.start, end: e.start + w.length }, [{ id: 'inside', ...w.cavity }])
     if ('refused' in made) {
       const r = made.refused
       words.push({ key: r.code === 'CAVITY_NO_LENGTH' ? 'figure.text.section-issue-cavity-length' : 'figure.text.section-issue-cavity-walls', params: {} })

package/dist-client/modeller/canvas.d.ts

@@ -21,8 +21,6 @@ export declare class FigureCanvas extends LitElement {
      * would reach the editor as an edit.
      */
     viewOnly: boolean;
-    /** The editor shows a new figure's start card over the canvas: the canvas's own one-line hint gives way to it. */
-    startShown: boolean;
     /** Where the selected part turns and how far (`joint-fan`): shown, never picked, never saved. */
     fan: FigureRenderPart | null;
     /**

package/dist-client/modeller/canvas.js

@@ -1,7 +1,6 @@
 import { __decorate, __metadata } from "tslib";
-import { LitElement, html, css, nothing, unsafeCSS } from 'lit';
+import { LitElement, html, css, unsafeCSS } from 'lit';
 import { customElement, property, query } from 'lit/decorators.js';
-import { i18next } from '@operato/i18n';
 import { create, Model, niceGridStep } from '@hatiolab/things-scene';
 import { DEFAULT_VIEW, sceneLook, WORKBENCH } from './figure-view.js';
 import { boardFor, changedKeys, componentOf, gizmoResultOf } from './stage-model.js';
@@ -31,8 +30,6 @@ let FigureCanvas = class FigureCanvas extends LitElement {
          * would reach the editor as an edit.
          */
         this.viewOnly = false;
-        /** The editor shows a new figure's start card over the canvas: the canvas's own one-line hint gives way to it. */
-        this.startShown = false;
         /** Where the selected part turns and how far (`joint-fan`): shown, never picked, never saved. */
         this.fan = null;
         /**
@@ -72,17 +69,13 @@ let FigureCanvas = class FigureCanvas extends LitElement {
       width: 100%;
       height: 100%;
     }
-    p {
-      position: absolute;
-      inset: 45% 1rem auto;
-      margin: 0;
-      text-align: center;
-      pointer-events: none;
-      color: #f4f4f4;
-    }
   `; }
     render() {
-        return html `<div stage></div>${this.parts.length || this.startShown ? nothing : html `<p>${i18next.t('figure.text.add-a-shape-to-start')}</p>`}`;
+        /*
+         * No line of its own over an empty stage: a new figure's start card says how to begin, and an empty stage otherwise
+         * is one loading, or with every part hidden -- where 「도형을 추가해…」 flashed and said the wrong thing (2026-10-02).
+         */
+        return html `<div stage></div>`;
     }
     firstUpdated() {
         this.standUp();
@@ -381,10 +374,6 @@ __decorate([
     property({ type: Boolean }),
     __metadata("design:type", Object)
 ], FigureCanvas.prototype, "viewOnly", void 0);
-__decorate([
-    property({ type: Boolean }),
-    __metadata("design:type", Object)
-], FigureCanvas.prototype, "startShown", void 0);
 __decorate([
     property({ attribute: false }),
     __metadata("design:type", Object)