@things-factory/figure-ui 10.1.16 → 10.1.17

package/dist-client/pages/figure-modeller-page.js

@@ -1,7 +1,6 @@
 import { __decorate, __metadata } from "tslib";
 import '@material/web/icon/icon.js';
 import '../modeller/figure-side.js';
-import '../modeller/figure-ask.js';
 import '../modeller/figure-canvas.js';
 import { captureThumbnail } from '../modeller/figure-thumbnail.js';
 import '../modeller/figure-preview.js';
@@ -66,7 +65,7 @@ function rememberPanes(panes) {
  */
 function startingModel(type) {
     return {
-        board: { width: 300, height: 300, depth: 300, figureType: type, detailLevel: 'M' },
+        draft: { width: 300, height: 300, depth: 300, figureType: type, detailLevel: 'M' },
         parts: []
     };
 }
@@ -84,7 +83,7 @@ function startingModel(type) {
  *
  * ## 편집 데이터는 씬 모델 하나뿐이다
  *
- * 이 페이지가 갖는 것은 보드 하나와 부품 목록 — 미리보기에 그대로 세워지는 씬 모델이다.
+ * 이 페이지가 갖는 것은 초안 하나와 부품 목록 — 미리보기에 그대로 세워지는 씬 모델이다.
  * 저장 형식(`FigureSource`)으로 바꾸는 것은 **경계에서만** 한다: 저장할 때, 판단할 때,
  * AI 후보와 비교할 때. 그 변환은 `figure-source.ts` 한 곳에서만 일어난다.
  *
@@ -701,14 +700,14 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     }
   `; }
     willUpdate(changed) {
-        if (changed.has('board') || changed.has('parts')) {
-            this.folded = this.board ? toFigureSource(this.board, this.parts) : undefined;
+        if (changed.has('draft') || changed.has('parts')) {
+            this.folded = this.draft ? toFigureSource(this.draft, this.parts) : undefined;
         }
     }
     /**
      * 페이지 밖 AI 도크에도 **지금 손에 든 정본**을 알려 준다.
      *
-     * 모델러 안의 `figure-ask` 는 이미 `folded`를 직접 받는다. 반면 asidebar 도크는 주소의 id만
+     * asidebar 도크는 주소의 id만
      * 알았으므로 DB에 저장된 옛 판을 읽었다. 저장 전 변경을 두고 "왜 발행이 안 되나" 또는
      * "이 부품을 줄여 달라"고 물으면 대화가 엉뚱한 판을 보게 되는 결함이었다.
      *
@@ -720,7 +719,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         if (changed.has('figure') && changed.get('figure')?.id !== this.figure?.id) {
             this.proposalFeedback = [];
         }
-        if (changed.has('board') || changed.has('parts') || changed.has('figure')) {
+        if (changed.has('draft') || changed.has('parts') || changed.has('figure')) {
             window.dispatchEvent(new CustomEvent('figure-ai-context', {
                 detail: { figureId: this.figure?.id, source: this.folded }
             }));
@@ -729,15 +728,15 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     /**
      * A candidate from the dock opens the review lane. It does not become the draft.
      *
-     * This used to write `board` and `parts` straight onto the working draft and then set
+     * This used to write `draft` and `parts` straight onto the working draft and then set
      * `proposalSession = undefined` — the dock's candidate overwrote what the author had open and
      * erased the lane built to review it. There was no moment where the person said yes, and a
      * draft has no version history to go back to, so the previous work was simply gone.
      *
      * `ai-client-base`'s analysis contract states this as a literal type: `approvalRequired: true`,
      * and of `proposal`, "It is never an instruction to mutate canonical state." The in-page
-     * `figure-ask` entrance already honoured it through `openAiProposal`; the dock entrance is now
-     * the same door. Applying is what the take button does, from the lane, per change.
+     * The in-page entrance honoured this through `openAiProposal` before it was removed, and the dock
+     * entrance is now the same door. Applying is what the take button does, from the lane, per change.
      *
      * ## Why the overwrite was there — so it does not come back
      *
@@ -847,13 +846,13 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         @toggle-part-hidden=${(e) => this.toggleHidden(e.detail.index)}
         @set-all-parts-hidden=${(e) => this.setAllHidden(e.detail.hidden)}
         @change-detail-level=${(e) => this.changeDetailLevel(e.detail.level)}
-        @update-board=${(e) => this.updateBoard(e.detail.board)}
+        @update-draft=${(e) => this.updateDraft(e.detail.draft)}
         @part-tool=${(e) => this.runTool(e.detail.index, e.detail.tool, e.detail.axis)}
         @pick-part=${(e) => this.pickPart(e.detail.name)}
       >
         <figure-parts
           .parts=${this.parts}
-          .level=${(this.board?.detailLevel ?? 'M')}
+          .level=${(this.draft?.detailLevel ?? 'M')}
           .selected=${this.selected}
         ></figure-parts>
 
@@ -867,7 +866,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
                     <h4>${i18next.t('figure.label.now')}</h4>
                     <figure-canvas
                       .figureId=${this.figure?.id || this.figure?.type}
-                      .board=${this.board}
+                      .draft=${this.draft}
                       .parts=${this.parts}
                       .picked=${this.pickedName}
                       .view=${this.view}
@@ -890,10 +889,10 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
                 </div>
               `
             : this.mode === 'preview'
-                ? html `<figure-preview .source=${source}></figure-preview>`
+                ? html `<figure-preview .source=${source} .view=${this.view}></figure-preview>`
                 : html `<figure-canvas
                   .figureId=${this.figure?.id || this.figure?.type}
-                  .board=${this.board}
+                  .draft=${this.draft}
                   .parts=${this.parts}
                   .picked=${this.pickedName}
                   .view=${this.view}
@@ -909,7 +908,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
           .figureState=${this.figure?.state}
           .figureVersion=${this.figure?.version ?? 0}
           .dirty=${this.dirty}
-          .board=${this.board}
+          .draft=${this.draft}
           .parts=${this.parts}
           .source=${source}
           .selected=${this.selected}
@@ -1027,7 +1026,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     renderProposed() {
         if (!this.proposalSession)
             return '';
-        return html `<figure-preview .source=${this.proposalSession.source}></figure-preview>`;
+        return html `<figure-preview .source=${this.proposalSession.source} .view=${this.view}></figure-preview>`;
     }
     /**
      * 무엇을 받을지 고른다.
@@ -1108,14 +1107,21 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     }
     /** 변경 하나. 무엇을 하겠다는 것인지 부호로 먼저 말한다. */
     renderChange(change) {
+        /*
+          Every ChangeKind needs a row here. A kind the map does not answer draws an empty icon and a
+          key with no name beside it, which reads as a broken row rather than a missing case — the
+          `satisfies` makes the compiler say so instead.
+        */
         const icon = {
             added: 'add',
             changed: 'edit',
             removed: 'remove',
             base: 'aspect_ratio',
+            placement: 'vertical_align_bottom',
             detail: 'tune',
-            anchor: 'my_location',
-            styleKit: 'palette'
+            styleKit: 'palette',
+            animations: 'animation',
+            capabilities: 'hub'
         }[change.kind];
         const on = this.proposalSession?.picked.has(change.key);
         return html `
@@ -1147,7 +1153,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     /**
      * 발행 게이트의 구조화된 수정안 하나를 현재 작업 사본에만 겹쳐 본다. 서버가 준 값은
      * `part.anchor.axis = to`라는 데이터이지 사람이 읽을 문장을 다시 해석한 결과가 아니다.
-     * 원본 `board`/`parts`는 여기서 전혀 바꾸지 않고, 아래의 `take()`만 바꾼 사본을 적용한다.
+     * 원본 `draft`/`parts`는 여기서 전혀 바꾸지 않고, 아래의 `take()`만 바꾼 사본을 적용한다.
      */
     previewSizingFix(fix) {
         if (!this.folded)
@@ -1180,8 +1186,8 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
             return;
         this.recordHistory();
         const taken = proposals.applyProposal(this.folded, this.proposalSession.source, this.proposalSession.picked);
-        const { board, parts } = fromFigureSource(taken);
-        this.board = board;
+        const { draft, parts } = fromFigureSource(taken);
+        this.draft = draft;
         this.parts = parts;
         this.selected = parts.length ? 0 : -1;
         this.dirty = true;
@@ -1318,7 +1324,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         // 서버가 준 것을 그대로 쓴다. 읽지 못하면 오류보고없이 빈 상태로 바꾸지 않는다.
         // 그러면 사용자가 저장을 선택해 원본을 덮어쓴다.
         const model = figure.source ? fromFigureSource(JSON.parse(figure.source)) : undefined;
-        this.board = model?.board;
+        this.draft = model?.draft;
         this.parts = model?.parts ?? [];
         /*
           **아무것도 고르지 않은 채로 연다.**
@@ -1346,9 +1352,9 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         this.mode = 'edit';
         // 타입 이름을 사람이 정하기 전까지는 임시 이름을 쓴다. 저장할 때 확정한다.
         const draftType = `FIGURE_${Date.now().toString(36).toUpperCase()}`;
-        const { board, parts } = startingModel(draftType);
+        const { draft, parts } = startingModel(draftType);
         this.figure = { id: '', type: draftType, name: '' };
-        this.board = board;
+        this.draft = draft;
         this.parts = parts;
         /* 고른 것이 없다 — 부품이 없으니 속성 패널도 고를 것을 기다린다. */
         this.selected = -1;
@@ -1368,10 +1374,10 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         if (!type || this.figure?.id)
             return;
         const sanitized = type.replace(/[^A-Za-z0-9_]/g, '_').toUpperCase();
-        if (this.board)
-            this.board.figureType = sanitized;
+        if (this.draft)
+            this.draft.figureType = sanitized;
         this.figure = { ...this.figure, type: sanitized };
-        this.folded = this.board ? toFigureSource(this.board, this.parts) : undefined;
+        this.folded = this.draft ? toFigureSource(this.draft, this.parts) : undefined;
         this.dirty = true;
     }
     /**
@@ -1388,7 +1394,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     }
     snapshotState() {
         return {
-            board: this.board ? structuredClone(this.board) : undefined,
+            draft: this.draft ? structuredClone(this.draft) : undefined,
             parts: structuredClone(this.parts),
             selected: this.selected
         };
@@ -1410,7 +1416,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         const prev = this.undoStack[this.undoStack.length - 1];
         this.undoStack = this.undoStack.slice(0, -1);
         this.redoStack = [this.snapshotState(), ...this.redoStack.slice(0, 49)];
-        this.board = prev.board ? structuredClone(prev.board) : undefined;
+        this.draft = prev.draft ? structuredClone(prev.draft) : undefined;
         this.parts = structuredClone(prev.parts);
         this.selected = this.parts.length ? Math.max(-1, Math.min(prev.selected, this.parts.length - 1)) : -1;
         this.dirty = true;
@@ -1422,7 +1428,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         const next = this.redoStack[0];
         this.redoStack = this.redoStack.slice(1);
         this.undoStack = [...this.undoStack.slice(-49), this.snapshotState()];
-        this.board = next.board ? structuredClone(next.board) : undefined;
+        this.draft = next.draft ? structuredClone(next.draft) : undefined;
         this.parts = structuredClone(next.parts);
         this.selected = this.parts.length ? Math.max(-1, Math.min(next.selected, this.parts.length - 1)) : -1;
         this.dirty = true;
@@ -1441,10 +1447,10 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         this.dirty = true;
     }
     addPart(primitive) {
-        if (!this.board)
+        if (!this.draft)
             return;
         // 추가한 것을 바로 수정할 수 있게 선택 상태로 둔다.
-        this.put(edits.addPart(this.board, this.parts, primitive), this.parts.length);
+        this.put(edits.addPart(this.draft, this.parts, primitive), this.parts.length);
     }
     removePart(index) {
         this.put(edits.removePart(this.parts, index), Math.max(0, index - 1));
@@ -1464,26 +1470,26 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
      * 부품 목록은 건드리지 않는다. `put` 은 부품을 함께 받으므로 여기서 쓰면 능력 하나를
      * 고칠 때마다 부품 목록이 새 배열이 되고, 그리는 쪽이 전부 다시 그린다.
      */
-    updateBoard(board) {
-        this.recordHistory('board');
-        this.board = board;
+    updateDraft(draft) {
+        this.recordHistory('draft');
+        this.draft = draft;
         this.dirty = true;
     }
     /**
      * 디테일 등급을 바꾼다.
      *
      * 이 값은 부품 수 한도를 정하고 성숙도의 한 축이 된다. 부품보다 위에 있는 값이라
-     * 보드에 담는다.
+     * 초안에 담는다.
      *
      * 한도를 내려서 이미 넣은 부품 수보다 작아질 수 있다. 그때 부품을 지우지 않는다.
      * 검증이 위반으로 알리고, 성숙도가 등급에 안 맞는다고 말한다. 저작자가 무엇을 뺄지
      * 정할 일이지 도구가 정할 일이 아니다.
      */
     changeDetailLevel(level) {
-        if (!this.board)
+        if (!this.draft)
             return;
         this.recordHistory('detailLevel');
-        this.board = { ...this.board, detailLevel: level };
+        this.draft = { ...this.draft, detailLevel: level };
         this.dirty = true;
     }
     /**
@@ -1527,18 +1533,18 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
      * 규칙은 `part-edits` 가 갖는다. 여기서는 어느 것을 부를지만 정한다.
      */
     runTool(index, tool, axis) {
-        const board = this.board;
-        if (!board)
+        const draft = this.draft;
+        if (!draft)
             return;
         if (tool === 'center')
-            this.put(edits.centerPart(board, this.parts, index, axis));
+            this.put(edits.centerPart(draft, this.parts, index, axis));
         else if (tool === 'floor')
             this.put(edits.alignPartToStart(this.parts, index, axis));
         else if (tool === 'snap')
-            this.put(edits.snapPart(board, this.parts, index));
+            this.put(edits.snapPart(draft, this.parts, index));
         // 대칭 복제는 부품이 하나 늘어난다 — 새로 생긴 것을 선택 상태로 둔다
         else if (tool === 'mirror')
-            this.put(edits.mirrorPart(board, this.parts, index, axis), index + 1);
+            this.put(edits.mirrorPart(draft, this.parts, index, axis), index + 1);
     }
     /**
      * 캔버스에서 부품을 선택했다.
@@ -1588,7 +1594,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
     }
     async fillThumbnail(id) {
         await this.updateComplete;
-        const thumbnail = await captureThumbnail(this.board, this.parts);
+        const thumbnail = await captureThumbnail(this.draft, this.parts);
         if (!thumbnail || this.figure?.id !== id) {
             return;
         }
@@ -1608,7 +1614,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         }
         if (!this.figure.id) {
             // 신규 저장: 타입 코드와 표시 이름을 명확히 팝업으로 확인/입력받음
-            let defaultType = this.board?.figureType || this.figure.type || '';
+            let defaultType = this.draft?.figureType || this.figure.type || '';
             if (!defaultType || defaultType.startsWith('FIGURE_')) {
                 defaultType = 'FIGURE';
             }
@@ -1628,7 +1634,7 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
         this.saveModalError = '';
         try {
             if (!this.figure.id) {
-                const typeToSave = (this.saveModalType || this.board?.figureType || this.figure.type || 'FIGURE').trim().toUpperCase();
+                const typeToSave = (this.saveModalType || this.draft?.figureType || this.figure.type || 'FIGURE').trim().toUpperCase();
                 const nameToSave = (this.saveModalName || this.figure.name || typeToSave).trim();
                 if (!typeToSave) {
                     throw new Error('타입 이름을 입력하세요.');
@@ -1637,12 +1643,12 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
                 if (taken.includes(typeToSave)) {
                     throw new Error(i18next.t('figure.text.type-name-already-taken', { type: typeToSave }));
                 }
-                if (this.board)
-                    this.board.figureType = typeToSave;
+                if (this.draft)
+                    this.draft.figureType = typeToSave;
                 this.figure = { ...this.figure, type: typeToSave, name: nameToSave };
                 this.folded = { ...this.folded, type: typeToSave };
                 const sourceJson = JSON.stringify(this.folded);
-                const thumbnail = await captureThumbnail(this.board, this.parts);
+                const thumbnail = await captureThumbnail(this.draft, this.parts);
                 const result = await createFigure({
                     type: typeToSave,
                     name: nameToSave,
@@ -1661,11 +1667,11 @@ let FigureModellerPage = class FigureModellerPage extends FigureModellerPageBase
             // 기존 모델 업데이트: folded.type이 figure.type과 일치하도록 보장
             if (this.figure.type && this.folded.type !== this.figure.type) {
                 this.folded = { ...this.folded, type: this.figure.type };
-                if (this.board)
-                    this.board.figureType = this.figure.type;
+                if (this.draft)
+                    this.draft.figureType = this.figure.type;
             }
             const sourceJson = JSON.stringify(this.folded);
-            const thumbnail = await captureThumbnail(this.board, this.parts);
+            const thumbnail = await captureThumbnail(this.draft, this.parts);
             const result = await updateFigure(this.figure.id, {
                 name: this.figure.name,
                 category: this.figure.category,
@@ -1736,7 +1742,7 @@ __decorate([
 __decorate([
     state(),
     __metadata("design:type", Object)
-], FigureModellerPage.prototype, "board", void 0);
+], FigureModellerPage.prototype, "draft", void 0);
 __decorate([
     state(),
     __metadata("design:type", Array)