@things-factory/figure-ui 10.1.77 → 10.1.78

package/client/modeller/editor.ts

@@ -2,6 +2,8 @@ import { LitElement, html, css, nothing, type PropertyValues } from 'lit'
 import { i18next } from '@operato/i18n'
 import type { OxThreePane } from '@operato/layout'
 import '@operato/layout'
+import { notify } from '@operato/layout'
+import { OxPrompt } from '@operato/popup'
 import { customElement, property, state } from 'lit/decorators.js'
 import { live } from 'lit/directives/live.js'
 import { PART_LIMIT, parseFigureRecipe, resolveFigureRecipe, figurePartCountOf, figureRecipeIdFor } from '@hatiolab/figure-model'
@@ -247,17 +249,6 @@ export class FigureEditor extends LitElement {
       color: var(--md-sys-color-on-secondary-container);
       border-color: var(--md-sys-color-primary);
     }
-    .error {
-      padding: 10px;
-      background: var(--md-sys-color-error-container);
-      color: var(--md-sys-color-on-error-container);
-      white-space: pre-wrap;
-    }
-    .notice {
-      padding: 8px 10px;
-      background: var(--md-sys-color-surface-container);
-      color: var(--md-sys-color-on-surface);
-    }
     .hint {
       color: var(--md-sys-color-on-surface-variant);
       line-height: 1.5;
@@ -386,6 +377,35 @@ export class FigureEditor extends LitElement {
     window.removeEventListener('keydown', this.onKey, true)
     super.disconnectedCallback()
   }
+  /**
+   * Refusals and notices go to the app's shared surfaces, as every screen's do (user, 2026-09-27: 「왜 모두가 사용하는
+   * notification 오류 표현 방법을 사용하지 않고」 · 「혹은 oxprompt 에서 확인하고 진행하던지」). A refusal with a way on --
+   * delete and fit the space again, narrow the range -- asks in the app's prompt and goes on when confirmed; any
+   * other refusal is the app's notification, which stays until it is closed.
+   */
+  private toldViewError = ''
+  private tell(changed: PropertyValues) {
+    if (changed.has('error') && this.error) {
+      const retry = this.retry
+      if (retry) this.ask(this.error, retry)
+      else notify({ level: 'error', message: this.error })
+    }
+    if (changed.has('notice') && this.notice) notify({ level: 'info', message: this.notice })
+    const viewError = this.session?.read()?.error ?? ''
+    if (viewError && viewError !== this.toldViewError) notify({ level: 'error', message: viewError })
+    this.toldViewError = viewError
+  }
+  private async ask(message: string, retry: { label: string; action?: FigureAuthoringAction; run?: () => void }) {
+    const agreed = await OxPrompt.open({
+      type: 'question',
+      text: message,
+      confirmButton: { text: retry.label },
+      cancelButton: { text: i18next.t('figure.button.keep-editing') }
+    })
+    if (!agreed) return
+    if (retry.run) retry.run()
+    else this.linkCommand(retry.action!)
+  }
   protected willUpdate(_changed: PropertyValues) {
     const view = this.session?.read()
     if (view?.context !== this.lastContext) {
@@ -524,10 +544,17 @@ export class FigureEditor extends LitElement {
       if (this.selected === id) this.selected = ''
       this.changed()
     } catch (error) {
-      /* The refusal a person meets most: another part stands on this one or follows its size. Said in their words. */
+      /*
+        A part in the declared space goes, and the space is fitted to the parts left, in the same click: every space
+        this product declares is fitted to the parts (「부품에 맞추기」, the AI's fit-room -- no padding), so fitting it
+        again keeps what it says, and there is nothing to ask (user, 2026-09-27: 「이 확인이 꼭 필요한가 ?」).
+      */
+      if (!refitRoom && inDeclaredRoom(error)) {
+        this.removePart(id, true)
+        if (!this.error) this.notice = [this.notice, i18next.t('figure.text.removal-space-refitted')].filter(Boolean).join(' ')
+        return
+      }
       this.error = partRefusalOf(error, id, (key, params) => i18next.t(key, params)) ?? this.said(error)
-      /* In the declared room only: the way on is to delete it and fit the room to the parts left, in one step. */
-      if (!refitRoom && inDeclaredRoom(error)) this.retry = { label: i18next.t('figure.button.remove-and-refit-room', { part: id }), run: () => this.removePart(id, true) }
     }
   }
   private toggleHiddenPart(id: string) {
@@ -1186,6 +1213,7 @@ export class FigureEditor extends LitElement {
   }
   updated(changed: PropertyValues<this>) {
     super.updated?.(changed)
+    this.tell(changed)
     const panes = this.renderRoot.querySelector<OxThreePane>('ox-three-pane') ?? undefined
     if (panes !== this.panes) this.panes = panes
   }
@@ -1238,15 +1266,6 @@ export class FigureEditor extends LitElement {
         <span slot="status" class="status" role="status" ?dirty=${status === 'figure.text.unsaved-changes'}>${i18next.t(status)}</span>
         <button slot="commit" save ?disabled=${unavailable || (!view.dirty && !!view.id)} @click=${this.save}>${i18next.t('figure.button.save')}</button>
       </ox-canvas-bar>
-      ${this.error || view.error
-        ? html`<div role="alert" class="error">
-            ${this.error || view.error}
-            ${this.retry && this.error
-              ? html`<button act @click=${() => (this.retry!.run ? this.retry!.run() : this.linkCommand(this.retry!.action!))}><md-icon>straighten</md-icon>${this.retry.label}</button>`
-              : null}
-          </div>`
-        : null}
-      ${this.notice ? html`<div role="status" class="notice">${this.notice}</div>` : null}
       ${this.catalogOpen
         ? html`<figure-recipe-catalog
             .templates=${this.templates}

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

@@ -76,6 +76,15 @@ export declare class FigureEditor extends LitElement {
     private onKey;
     connectedCallback(): void;
     disconnectedCallback(): void;
+    /**
+     * Refusals and notices go to the app's shared surfaces, as every screen's do (user, 2026-09-27: 「왜 모두가 사용하는
+     * notification 오류 표현 방법을 사용하지 않고」 · 「혹은 oxprompt 에서 확인하고 진행하던지」). A refusal with a way on --
+     * delete and fit the space again, narrow the range -- asks in the app's prompt and goes on when confirmed; any
+     * other refusal is the app's notification, which stays until it is closed.
+     */
+    private toldViewError;
+    private tell;
+    private ask;
     protected willUpdate(_changed: PropertyValues): void;
     /** The scene toggles: the mode already shown takes the gizmo away. */
     private useGizmo;

package/dist-client/modeller/editor.js

@@ -3,6 +3,8 @@ import { __decorate, __metadata } from "tslib";
 import { LitElement, html, css, nothing } from 'lit';
 import { i18next } from '@operato/i18n';
 import '@operato/layout';
+import { notify } from '@operato/layout';
+import { OxPrompt } from '@operato/popup';
 import { customElement, property, state } from 'lit/decorators.js';
 import { live } from 'lit/directives/live.js';
 import { PART_LIMIT, parseFigureRecipe, resolveFigureRecipe, figurePartCountOf, figureRecipeIdFor } from '@hatiolab/figure-model';
@@ -92,6 +94,13 @@ let FigureEditor = class FigureEditor extends LitElement {
             else
                 this.selected = '';
         };
+        /**
+         * Refusals and notices go to the app's shared surfaces, as every screen's do (user, 2026-09-27: 「왜 모두가 사용하는
+         * notification 오류 표현 방법을 사용하지 않고」 · 「혹은 oxprompt 에서 확인하고 진행하던지」). A refusal with a way on --
+         * delete and fit the space again, narrow the range -- asks in the app's prompt and goes on when confirmed; any
+         * other refusal is the app's notification, which stays until it is closed.
+         */
+        this.toldViewError = '';
     }
     static { FigureEditor_1 = this; }
     /* The operato scrollbar, as every scrolling panel of the app has it -- the side panel scrolled with the browser's own. */
@@ -291,17 +300,6 @@ let FigureEditor = class FigureEditor extends LitElement {
       color: var(--md-sys-color-on-secondary-container);
       border-color: var(--md-sys-color-primary);
     }
-    .error {
-      padding: 10px;
-      background: var(--md-sys-color-error-container);
-      color: var(--md-sys-color-on-error-container);
-      white-space: pre-wrap;
-    }
-    .notice {
-      padding: 8px 10px;
-      background: var(--md-sys-color-surface-container);
-      color: var(--md-sys-color-on-surface);
-    }
     .hint {
       color: var(--md-sys-color-on-surface-variant);
       line-height: 1.5;
@@ -358,6 +356,35 @@ let FigureEditor = class FigureEditor extends LitElement {
         window.removeEventListener('keydown', this.onKey, true);
         super.disconnectedCallback();
     }
+    tell(changed) {
+        if (changed.has('error') && this.error) {
+            const retry = this.retry;
+            if (retry)
+                this.ask(this.error, retry);
+            else
+                notify({ level: 'error', message: this.error });
+        }
+        if (changed.has('notice') && this.notice)
+            notify({ level: 'info', message: this.notice });
+        const viewError = this.session?.read()?.error ?? '';
+        if (viewError && viewError !== this.toldViewError)
+            notify({ level: 'error', message: viewError });
+        this.toldViewError = viewError;
+    }
+    async ask(message, retry) {
+        const agreed = await OxPrompt.open({
+            type: 'question',
+            text: message,
+            confirmButton: { text: retry.label },
+            cancelButton: { text: i18next.t('figure.button.keep-editing') }
+        });
+        if (!agreed)
+            return;
+        if (retry.run)
+            retry.run();
+        else
+            this.linkCommand(retry.action);
+    }
     willUpdate(_changed) {
         const view = this.session?.read();
         if (view?.context !== this.lastContext) {
@@ -510,11 +537,18 @@ let FigureEditor = class FigureEditor extends LitElement {
             this.changed();
         }
         catch (error) {
-            /* The refusal a person meets most: another part stands on this one or follows its size. Said in their words. */
+            /*
+              A part in the declared space goes, and the space is fitted to the parts left, in the same click: every space
+              this product declares is fitted to the parts (「부품에 맞추기」, the AI's fit-room -- no padding), so fitting it
+              again keeps what it says, and there is nothing to ask (user, 2026-09-27: 「이 확인이 꼭 필요한가 ?」).
+            */
+            if (!refitRoom && inDeclaredRoom(error)) {
+                this.removePart(id, true);
+                if (!this.error)
+                    this.notice = [this.notice, i18next.t('figure.text.removal-space-refitted')].filter(Boolean).join(' ');
+                return;
+            }
             this.error = partRefusalOf(error, id, (key, params) => i18next.t(key, params)) ?? this.said(error);
-            /* In the declared room only: the way on is to delete it and fit the room to the parts left, in one step. */
-            if (!refitRoom && inDeclaredRoom(error))
-                this.retry = { label: i18next.t('figure.button.remove-and-refit-room', { part: id }), run: () => this.removePart(id, true) };
         }
     }
     toggleHiddenPart(id) {
@@ -1198,6 +1232,7 @@ let FigureEditor = class FigureEditor extends LitElement {
     }
     updated(changed) {
         super.updated?.(changed);
+        this.tell(changed);
         const panes = this.renderRoot.querySelector('ox-three-pane') ?? undefined;
         if (panes !== this.panes)
             this.panes = panes;
@@ -1251,15 +1286,6 @@ let FigureEditor = class FigureEditor extends LitElement {
         <span slot="status" class="status" role="status" ?dirty=${status === 'figure.text.unsaved-changes'}>${i18next.t(status)}</span>
         <button slot="commit" save ?disabled=${unavailable || (!view.dirty && !!view.id)} @click=${this.save}>${i18next.t('figure.button.save')}</button>
       </ox-canvas-bar>
-      ${this.error || view.error
-            ? html `<div role="alert" class="error">
-            ${this.error || view.error}
-            ${this.retry && this.error
-                ? html `<button act @click=${() => (this.retry.run ? this.retry.run() : this.linkCommand(this.retry.action))}><md-icon>straighten</md-icon>${this.retry.label}</button>`
-                : null}
-          </div>`
-            : null}
-      ${this.notice ? html `<div role="status" class="notice">${this.notice}</div>` : null}
       ${this.catalogOpen
             ? html `<figure-recipe-catalog
             .templates=${this.templates}