@things-factory/figure-ui 10.1.7 → 10.1.9

package/dist-client/modeller/figure-animations.js

@@ -5,6 +5,12 @@ import { live } from 'lit/directives/live.js';
 import { i18next, localize } from '@operato/i18n';
 import { ScrollbarStyles } from '@operato/styles';
 import { AXES, CHANNEL_PATHS, CLIP_DRIVES, INTERPOLATIONS, LIMITS } from '@hatiolab/figure-model';
+const MOTION_RECIPES = [
+    { id: 'conveyor', name: 'conveyor-running', drive: 'loop', path: 'rotation', end: { x: 360, y: 0, z: 0 } },
+    { id: 'gate', name: 'gate-open', drive: 'hold', path: 'rotation', end: { x: 0, y: 90, z: 0 }, pivot: { x: 0, y: 0, z: 0 } },
+    { id: 'pusher', name: 'pusher-position', drive: 'hold', path: 'translation', end: { x: 100, y: 0, z: 0 } },
+    { id: 'lift', name: 'lift-height', drive: 'hold', path: 'translation', end: { x: 0, y: 100, z: 0 } }
+];
 /** 새 clip 의 키 둘. **하나로 만들지 않는다** — 키 하나는 움직임이 아니라 자세다. */
 const NEW_KEYS = [
     { at: 0, value: { x: 0, y: 0, z: 0 } },
@@ -26,12 +32,21 @@ function freeName(taken) {
             return name;
     }
 }
+function freeRecipeName(taken, base) {
+    const used = new Set(taken.map(clip => clip.name));
+    if (!used.has(base))
+        return base;
+    for (let n = 2;; n++)
+        if (!used.has(`${base}-${n}`))
+            return `${base}-${n}`;
+}
 let FigureAnimations = class FigureAnimations extends localize(i18next)(LitElement) {
     constructor() {
         super(...arguments);
         this.parts = [];
         /** 펼쳐 둔 clip. 이름이 아니라 자리로 잡는다 — 이름은 편집 중에 바뀐다. */
         this.open = 0;
+        this.recipeTarget = '';
     }
     static { this.styles = [
         ScrollbarStyles,
@@ -72,6 +87,11 @@ let FigureAnimations = class FigureAnimations extends localize(i18next)(LitEleme
         color: var(--md-sys-color-on-surface-variant);
       }
 
+      div[recipes] { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
+      button[recipe] { min-height: 54px; align-items: flex-start; flex-direction: column; text-align: left; }
+      button[recipe] strong { font-size: 0.74rem; }
+      button[recipe] span { color: var(--md-sys-color-on-surface-variant); font-size: 0.68rem; line-height: 1.35; }
+
       /* ── clip ─────────────────────────────────────────────────────── */
 
       div[clip] {
@@ -254,7 +274,8 @@ let FigureAnimations = class FigureAnimations extends localize(i18next)(LitEleme
         <p quiet>${i18next.t('figure.text.animation-is-driven-by-a-fact')}</p>
       </section>
 
-      ${this.clips.length === 0 ? this.renderEmpty() : this.renderClips()}
+      ${this.renderRecipes()}
+      ${this.clips.length === 0 ? nothing : this.renderClips()}
 
       <section>
         <button @click=${() => this.addClip()} ?disabled=${this.partNames.length === 0}>
@@ -274,11 +295,24 @@ let FigureAnimations = class FigureAnimations extends localize(i18next)(LitEleme
      * 「clip 을 추가하세요」라고만 쓰면 처음 여는 사람은 clip 이 무엇인지 모른 채 단추를 누른다.
      * 그래서 무엇을 만들 수 있는지 예를 들고, 그것이 어떻게 움직이는지(사실이 들어온다)를 적는다.
      */
-    renderEmpty() {
+    renderRecipes() {
         return html `
       <section>
-        <p quiet>${i18next.t('figure.text.animation-empty-what-it-is')}</p>
-        <p quiet>${i18next.t('figure.text.animation-empty-examples')}</p>
+        <h3>${i18next.t('figure.label.motion-intent')}</h3>
+        <p quiet>${i18next.t('figure.text.motion-intent-help')}</p>
+        ${this.partNames.length
+            ? html `<select .value=${this.recipeTarget} @change=${(e) => (this.recipeTarget = e.target.value)}>
+              ${this.partNames.map(name => html `<option value=${name}>${name}</option>`)}
+            </select>
+            <div recipes>
+              ${MOTION_RECIPES.map(recipe => html `
+                <button recipe @click=${() => this.addRecipe(recipe)}>
+                  <strong>${i18next.t('figure.label.recipe-' + recipe.id)}</strong>
+                  <span>${i18next.t('figure.text.recipe-' + recipe.id)}</span>
+                </button>
+              `)}
+            </div>`
+            : html `<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`}
       </section>
     `;
     }
@@ -552,6 +586,21 @@ let FigureAnimations = class FigureAnimations extends localize(i18next)(LitEleme
         this.open = this.clips.length;
         this.tell([...this.clips, clip]);
     }
+    /** Recipe creates a valid, editable two-pose clip; it never saves or publishes the Figure. */
+    addRecipe(recipe) {
+        const target = this.recipeTarget || this.partNames[0];
+        if (!target)
+            return;
+        const channel = {
+            target,
+            path: recipe.path,
+            keys: [{ at: 0, value: startValue(recipe.path) }, { at: 1, value: { ...recipe.end } }]
+        };
+        if (recipe.pivot)
+            channel.pivot = { ...recipe.pivot };
+        this.open = this.clips.length;
+        this.tell([...this.clips, { name: freeRecipeName(this.clips, recipe.name), drive: recipe.drive, channels: [channel] }]);
+    }
     renameClip(at, name) {
         this.patchClip(at, { name: name.trim() });
     }
@@ -648,6 +697,10 @@ __decorate([
     state(),
     __metadata("design:type", Object)
 ], FigureAnimations.prototype, "open", void 0);
+__decorate([
+    state(),
+    __metadata("design:type", Object)
+], FigureAnimations.prototype, "recipeTarget", void 0);
 FigureAnimations = __decorate([
     customElement('figure-animations')
 ], FigureAnimations);

package/dist-client/modeller/figure-animations.js.map

@@ -1 +1 @@
-{"version":3,"file":"figure-animations.js","sourceRoot":"","sources":["../../client/modeller/figure-animations.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, type TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { AXES, CHANNEL_PATHS, CLIP_DRIVES, INTERPOLATIONS, LIMITS } from '@hatiolab/figure-model'\nimport type { ChannelPath, Vec3 } from '@hatiolab/figure-model'\n\nimport type { BoardModel, PartModel } from './figure-source.js'\n\n/**\n * 이 도형이 **어떻게 움직이는가.**\n *\n * ## 왜 탭 하나가 필요한가\n *\n * 움직임은 형식에 있고 런타임까지 서 있었다 — 검증이 촘촘히 보고, 청사진이 움직이는 부품을\n * 단독 묶음으로 빼고(합치면 따로 못 움직인다), 씬이 frameClock 을 구독해 실제로 돌린다.\n * 미리보기에도 clip 마다 슬라이더가 있었다.\n *\n * **만들 자리만 없었다.** 그래서 움직이는 도형을 얻는 길이 「AI 가 후보로 내놓는 것」 하나였고,\n * 채널 하나를 고치려면 손댈 화면이 없었다.\n *\n * ## 부품이 아니라 도형의 것이다\n *\n * clip 하나가 부품 여럿을 함께 움직인다 — 문 열림은 왼짝과 오른짝이 반대로 미끄러지는 것\n * 하나다. 그래서 부품을 고르고 「이 부품의 움직임」을 적는 형태가 될 수 없고, 속성 탭이 아니라\n * 자기 탭에 산다.\n *\n * ## 트윈은 타임라인을 재생하지 않는다\n *\n * 「문 열기 clip 을 재생하라」가 아니라 **「지금 40% 열려 있다」**다. 그래서 clip 마다 그 값을\n * 어떻게 받을지(`drive`)를 저작 시점에 정한다 — 도는 롤러는 배속을 받고, 열린 문은 0~1 위치를\n * 받는다. 이 선택이 화면에서 가장 설명이 필요한 자리다.\n */\n\ntype Clip = NonNullable<BoardModel['animations']>[number]\ntype Channel = Clip['channels'][number]\ntype Keyframe = Channel['keys'][number]\n\n/** 새 clip 의 키 둘. **하나로 만들지 않는다** — 키 하나는 움직임이 아니라 자세다. */\nconst NEW_KEYS: Keyframe[] = [\n  { at: 0, value: { x: 0, y: 0, z: 0 } },\n  { at: 1, value: { x: 0, y: 0, z: 0 } }\n]\n\n/** `scale` 만 1 에서 시작한다 — 0 은 부품을 지운다. */\nfunction startValue(path: ChannelPath): Vec3 {\n  return path === 'scale' ? { x: 1, y: 1, z: 1 } : { x: 0, y: 0, z: 0 }\n}\n\nfunction keysFor(path: ChannelPath): Keyframe[] {\n  return NEW_KEYS.map(key => ({ at: key.at, value: startValue(path) }))\n}\n\n/** 이미 쓴 이름을 비켜 간다. `type` 처럼 저장되는 식별자는 아니지만 인스턴스가 이 이름으로 구동한다. */\nfunction freeName(taken: readonly Clip[]): string {\n  const used = new Set(taken.map(clip => clip.name))\n  for (let n = 1; ; n++) {\n    const name = `clip-${n}`\n    if (!used.has(name)) return name\n  }\n}\n\n@customElement('figure-animations')\nexport class FigureAnimations extends localize(i18next)(LitElement) {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        min-height: 0;\n        overflow-y: auto;\n        background-color: var(--md-sys-color-surface-container-lowest);\n        color: var(--md-sys-color-on-surface);\n        font: var(--label-font, inherit);\n        font-size: 0.76rem;\n      }\n\n      section {\n        display: flex;\n        flex-direction: column;\n        gap: var(--spacing-medium, 8px);\n        padding: var(--spacing-large, 12px);\n        border-bottom: 1px solid var(--md-sys-color-outline-variant);\n      }\n\n      /* 다른 탭들과 같은 눈금이다 */\n      h3 {\n        margin: 0 0 2px 0;\n        font-size: var(--ui-t-micro, 11px);\n        font-weight: 700;\n        letter-spacing: 0.04em;\n        text-transform: uppercase;\n        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n      }\n\n      p[quiet] {\n        margin: 0;\n        font-size: 0.72rem;\n        line-height: 1.5;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n\n      /* ── clip ─────────────────────────────────────────────────────── */\n\n      div[clip] {\n        display: flex;\n        flex-direction: column;\n        gap: var(--spacing-medium, 8px);\n        padding: 8px;\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 4px;\n      }\n      div[clip][on] {\n        border-color: var(--md-sys-color-primary);\n        background-color: var(--md-sys-color-surface-container-low);\n      }\n\n      div[head] {\n        display: flex;\n        align-items: center;\n        gap: 6px;\n      }\n      div[head] input[name] {\n        flex: 1;\n        min-width: 0;\n      }\n\n      /* ── channel ──────────────────────────────────────────────────── */\n\n      div[channel] {\n        display: flex;\n        flex-direction: column;\n        gap: 6px;\n        padding: 6px 8px;\n        border-left: 2px solid var(--md-sys-color-outline-variant);\n        background-color: var(--md-sys-color-surface-container-lowest);\n      }\n      div[channel][orphan] {\n        border-left-color: var(--md-sys-color-error);\n      }\n\n      div[row] {\n        display: flex;\n        align-items: center;\n        gap: 6px;\n      }\n      div[row] > label {\n        flex: none;\n        min-width: 3.2em;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n\n      /* ── keyframe ─────────────────────────────────────────────────── */\n\n      table[keys] {\n        width: 100%;\n        border-collapse: collapse;\n      }\n      table[keys] th {\n        padding: 0 2px 2px;\n        font-size: 0.68rem;\n        font-weight: 600;\n        text-align: left;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n      table[keys] td {\n        padding: 1px 2px;\n      }\n      table[keys] input {\n        width: 100%;\n        min-width: 0;\n      }\n      table[keys] td[drop] {\n        width: 1.6em;\n      }\n\n      input,\n      select {\n        box-sizing: border-box;\n        padding: 3px 5px;\n        font: inherit;\n        font-size: 0.74rem;\n        color: var(--md-sys-color-on-surface);\n        background-color: var(--md-sys-color-surface-container-lowest);\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 3px;\n      }\n      input:focus,\n      select:focus {\n        outline: none;\n        border-color: var(--md-sys-color-primary);\n      }\n      input[bad] {\n        border-color: var(--md-sys-color-error);\n      }\n\n      button {\n        display: inline-flex;\n        align-items: center;\n        gap: 3px;\n        padding: 3px 8px;\n        font: inherit;\n        font-size: 0.72rem;\n        color: var(--md-sys-color-on-surface);\n        background-color: var(--md-sys-color-surface-container);\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 3px;\n        cursor: pointer;\n      }\n      button:hover:not(:disabled) {\n        background-color: var(--md-sys-color-surface-container-high);\n      }\n      button:disabled {\n        opacity: 0.4;\n        cursor: default;\n      }\n      button[plain] {\n        padding: 1px 4px;\n        background: none;\n        border: none;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n      button[plain]:hover:not(:disabled) {\n        color: var(--md-sys-color-error);\n        background: none;\n      }\n      button md-icon {\n        font-size: 14px;\n        width: 14px;\n        height: 14px;\n      }\n\n      /* ── 예산 ─────────────────────────────────────────────────────── */\n\n      div[budget] {\n        display: flex;\n        align-items: baseline;\n        gap: 6px;\n      }\n      div[budget] strong {\n        font-size: 0.86rem;\n        font-weight: 700;\n      }\n      div[budget][over] strong {\n        color: var(--md-sys-color-error);\n      }\n\n      p[warn] {\n        margin: 0;\n        font-size: 0.7rem;\n        line-height: 1.5;\n        color: var(--md-sys-color-error);\n      }\n    `\n  ]\n\n  @property({ type: Object }) board?: BoardModel\n  @property({ type: Array }) parts: PartModel[] = []\n\n  /** 펼쳐 둔 clip. 이름이 아니라 자리로 잡는다 — 이름은 편집 중에 바뀐다. */\n  @state() private open = 0\n\n  private get clips(): Clip[] {\n    return this.board?.animations ?? []\n  }\n\n  /** 부품 이름 — 채널이 이것을 가리킨다. */\n  private get partNames(): string[] {\n    return this.parts.map(part => part.name).filter(name => !!name)\n  }\n\n  /**\n   * 몇 부품이 움직이나 — 채널이 가리키는 **서로 다른 부품**의 수.\n   *\n   * clip 수가 아니다. 한 부품을 세 clip 이 움직여도 그 부품 하나가 단독 묶음이 될 뿐이다.\n   * 청사진이 묶음을 가르는 기준과 같은 셈이어야 화면의 수와 판정의 수가 맞는다.\n   */\n  private get movingParts(): number {\n    const moving = new Set<string>()\n    for (const clip of this.clips) for (const channel of clip.channels) moving.add(channel.target)\n    return moving.size\n  }\n\n  render(): TemplateResult {\n    if (!this.board) return html``\n\n    return html`\n      <section>\n        <h3>${i18next.t('figure.label.animation')}</h3>\n        <p quiet>${i18next.t('figure.text.animation-is-driven-by-a-fact')}</p>\n      </section>\n\n      ${this.clips.length === 0 ? this.renderEmpty() : this.renderClips()}\n\n      <section>\n        <button @click=${() => this.addClip()} ?disabled=${this.partNames.length === 0}>\n          <md-icon>add</md-icon>${i18next.t('figure.button.add-clip')}\n        </button>\n        ${this.partNames.length === 0\n          ? html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`\n          : nothing}\n      </section>\n\n      ${this.clips.length === 0 ? nothing : this.renderBudget()}\n    `\n  }\n\n  /**\n   * 빈 화면 — **이 탭이 무엇인지 가르치는 자리다.**\n   *\n   * 「clip 을 추가하세요」라고만 쓰면 처음 여는 사람은 clip 이 무엇인지 모른 채 단추를 누른다.\n   * 그래서 무엇을 만들 수 있는지 예를 들고, 그것이 어떻게 움직이는지(사실이 들어온다)를 적는다.\n   */\n  private renderEmpty(): TemplateResult {\n    return html`\n      <section>\n        <p quiet>${i18next.t('figure.text.animation-empty-what-it-is')}</p>\n        <p quiet>${i18next.t('figure.text.animation-empty-examples')}</p>\n      </section>\n    `\n  }\n\n  private renderClips(): TemplateResult {\n    return html`\n      <section>\n        ${this.clips.map((clip, at) => this.renderClip(clip, at))}\n      </section>\n    `\n  }\n\n  private renderClip(clip: Clip, at: number): TemplateResult {\n    const on = this.open === at\n    const duplicate = this.clips.some((other, i) => i !== at && other.name === clip.name)\n    const nameless = !clip.name?.trim()\n\n    return html`\n      <div clip ?on=${on}>\n        <div head>\n          <button plain @click=${() => (this.open = on ? -1 : at)} title=${i18next.t('figure.label.channels')}>\n            <md-icon>${on ? 'expand_more' : 'chevron_right'}</md-icon>\n          </button>\n          <input\n            name\n            .value=${live(clip.name ?? '')}\n            ?bad=${duplicate || nameless}\n            placeholder=${i18next.t('figure.label.clip-name')}\n            title=${duplicate ? i18next.t('figure.text.clip-name-taken') : i18next.t('figure.text.clip-name-is-how-it-is-driven')}\n            @change=${(e: Event) => this.renameClip(at, (e.target as HTMLInputElement).value)}\n          />\n          <select\n            .value=${live(clip.drive ?? 'loop')}\n            title=${i18next.t('figure.text.drive-explained')}\n            @change=${(e: Event) => this.setDrive(at, (e.target as HTMLSelectElement).value as Clip['drive'])}\n          >\n            ${CLIP_DRIVES.map(\n              drive => html`<option value=${drive}>${i18next.t('figure.label.drive-' + drive)}</option>`\n            )}\n          </select>\n          <button plain @click=${() => this.removeClip(at)} title=${i18next.t('figure.button.remove')}>\n            <md-icon>close</md-icon>\n          </button>\n        </div>\n\n        ${duplicate ? html`<p warn>${i18next.t('figure.text.clip-name-taken')}</p>` : nothing}\n        ${nameless ? html`<p warn>${i18next.t('figure.text.clip-needs-a-name')}</p>` : nothing}\n        ${on ? this.renderChannels(clip, at) : nothing}\n      </div>\n    `\n  }\n\n  private renderChannels(clip: Clip, at: number): TemplateResult {\n    return html`\n      <p quiet>${i18next.t('figure.text.drive-' + (clip.drive ?? 'loop') + '-note')}</p>\n\n      ${clip.channels.length === 0 ? html`<p warn>${i18next.t('figure.text.clip-needs-a-channel')}</p>` : nothing}\n      ${clip.channels.map((channel, j) => this.renderChannel(channel, at, j))}\n\n      <button @click=${() => this.addChannel(at)}>\n        <md-icon>add</md-icon>${i18next.t('figure.button.add-channel')}\n      </button>\n    `\n  }\n\n  /**\n   * 채널 하나 — 어느 부품의 어느 속성을 움직이나.\n   *\n   * 없는 부품을 가리키는 채널은 붉게 낸다. 부품 이름을 바꾸면 그 순간 이렇게 되는데,\n   * 검증은 저장할 때 말하고 여기서는 **그 자리에서** 보여 준다.\n   */\n  private renderChannel(channel: Channel, at: number, j: number): TemplateResult {\n    const orphan = !this.partNames.includes(channel.target)\n    const turning = channel.path === 'rotation'\n\n    return html`\n      <div channel ?orphan=${orphan}>\n        <div row>\n          <label>${i18next.t('figure.label.channel-target')}</label>\n          <select\n            .value=${live(channel.target ?? '')}\n            @change=${(e: Event) => this.setChannel(at, j, { target: (e.target as HTMLSelectElement).value })}\n          >\n            ${orphan ? html`<option value=${channel.target}>${channel.target}</option>` : nothing}\n            ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n          </select>\n          <button plain @click=${() => this.removeChannel(at, j)} title=${i18next.t('figure.button.remove')}>\n            <md-icon>close</md-icon>\n          </button>\n        </div>\n\n        ${orphan ? html`<p warn>${i18next.t('figure.text.channel-target-is-gone')}</p>` : nothing}\n\n        <div row>\n          <label>${i18next.t('figure.label.channel-path')}</label>\n          <select\n            .value=${live(channel.path)}\n            @change=${(e: Event) => this.setPath(at, j, (e.target as HTMLSelectElement).value as ChannelPath)}\n          >\n            ${CHANNEL_PATHS.map(path => html`<option value=${path}>${i18next.t('figure.label.path-' + path)}</option>`)}\n          </select>\n          <select\n            .value=${live(channel.interpolation ?? 'linear')}\n            title=${i18next.t('figure.text.interpolation-explained')}\n            @change=${(e: Event) =>\n              this.setChannel(at, j, { interpolation: (e.target as HTMLSelectElement).value as Channel['interpolation'] })}\n          >\n            ${INTERPOLATIONS.map(\n              one => html`<option value=${one}>${i18next.t('figure.label.interpolation-' + one)}</option>`\n            )}\n          </select>\n        </div>\n\n        <p quiet>${i18next.t('figure.text.path-' + channel.path + '-unit')}</p>\n\n        ${turning ? this.renderPivot(channel, at, j) : nothing}\n        ${this.renderKeys(channel, at, j)}\n      </div>\n    `\n  }\n\n  /**\n   * 회전 중심 — **`rotation` 에서만 뜻이 있다.**\n   *\n   * 그래서 경로가 rotation 일 때만 낸다. 언제나 내면 저작자가 옮김·배율에도 적고, 검증이\n   * 저장할 때 「쓰이지 않는다」고 알린다. 안 보이면 적을 일이 없다.\n   */\n  private renderPivot(channel: Channel, at: number, j: number): TemplateResult {\n    const pivot = channel.pivot\n    const on = pivot !== undefined\n\n    return html`\n      <div row>\n        <label>${i18next.t('figure.label.channel-pivot')}</label>\n        <button\n          @click=${() => this.setChannel(at, j, { pivot: on ? undefined : { x: 0, y: 0, z: 0 } })}\n          title=${i18next.t('figure.text.pivot-defaults-to-the-part-centre')}\n        >\n          ${i18next.t(on ? 'figure.button.pivot-clear' : 'figure.button.pivot-set')}\n        </button>\n        ${on\n          ? AXES.map(\n              axis => html`\n                <input\n                  type=\"number\"\n                  step=\"1\"\n                  .value=${live(String(pivot![axis]))}\n                  aria-label=${axis}\n                  @change=${(e: Event) =>\n                    this.setChannel(at, j, {\n                      pivot: { ...pivot!, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n                    })}\n                />\n              `\n            )\n          : nothing}\n      </div>\n    `\n  }\n\n  /**\n   * 키프레임 표.\n   *\n   * **둘 미만으로 못 내려간다.** 하나뿐이면 움직이는 것이 아니라 자세 하나이고, 형식이\n   * 오류로 막는다. 저장하고 나서 알려 주는 것보다 지우는 단추를 죽이는 것이 낫다.\n   *\n   * 시각이 오름차순이어야 하는 것도 형식의 규칙이다. 여기서는 어긋난 줄을 붉게 내고 값을\n   * 고치지는 않는다 — 저작자가 3 을 1 로 고치던 중일 수 있다.\n   */\n  private renderKeys(channel: Channel, at: number, j: number): TemplateResult {\n    const keys = channel.keys ?? []\n\n    return html`\n      <table keys>\n        <tr>\n          <th>${i18next.t('figure.label.key-at')}</th>\n          ${AXES.map(axis => html`<th>${axis}</th>`)}\n          <th></th>\n        </tr>\n        ${keys.map((key, k) => {\n          const backwards = k > 0 && key.at <= (keys[k - 1]!.at ?? 0)\n          return html`\n            <tr>\n              <td>\n                <input\n                  type=\"number\"\n                  step=\"0.1\"\n                  min=\"0\"\n                  ?bad=${backwards || key.at < 0}\n                  .value=${live(String(key.at))}\n                  title=${backwards ? i18next.t('figure.text.keys-must-rise') : ''}\n                  @change=${(e: Event) =>\n                    this.setKey(at, j, k, { at: Math.max(0, Number((e.target as HTMLInputElement).value) || 0) })}\n                />\n              </td>\n              ${AXES.map(\n                axis => html`\n                  <td>\n                    <input\n                      type=\"number\"\n                      step=${channel.path === 'scale' ? '0.1' : '1'}\n                      .value=${live(String(key.value[axis]))}\n                      aria-label=${axis}\n                      @change=${(e: Event) =>\n                        this.setKey(at, j, k, {\n                          value: { ...key.value, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n                        })}\n                    />\n                  </td>\n                `\n              )}\n              <td drop>\n                <button\n                  plain\n                  ?disabled=${keys.length <= 2}\n                  title=${keys.length <= 2 ? i18next.t('figure.text.two-keys-at-least') : i18next.t('figure.button.remove')}\n                  @click=${() => this.removeKey(at, j, k)}\n                >\n                  <md-icon>close</md-icon>\n                </button>\n              </td>\n            </tr>\n          `\n        })}\n      </table>\n\n      ${keys.some((key, k) => k > 0 && key.at <= (keys[k - 1]!.at ?? 0))\n        ? html`<p warn>${i18next.t('figure.text.keys-must-rise')}</p>`\n        : nothing}\n\n      <button @click=${() => this.addKey(at, j)}>\n        <md-icon>add</md-icon>${i18next.t('figure.button.add-key')}\n      </button>\n    `\n  }\n\n  /**\n   * 움직이는 부품 예산.\n   *\n   * **넘어도 막지 않는다.** 움직이는 부품은 저마다 단독 묶음이라 draw call 이 늘고 프레임마다\n   * 갱신이 는다 — 그 대가가 수로 보이면 저작자가 아낀다. 랜드마크 설비 하나는 정교해도 되고,\n   * 그 값이 도면 예산에 드러나면 된다.\n   */\n  private renderBudget(): TemplateResult {\n    const used = this.movingParts\n    const over = used > LIMITS.animatedParts\n\n    return html`\n      <section>\n        <h3>${i18next.t('figure.label.budget-animations')}</h3>\n        <div budget ?over=${over}>\n          <strong>${used}</strong>\n          <span quiet>/ ${LIMITS.animatedParts}</span>\n        </div>\n        <p quiet>${i18next.t('figure.text.animated-parts-cost')}</p>\n        ${over ? html`<p warn>${i18next.t('figure.text.animated-parts-over')}</p>` : nothing}\n      </section>\n    `\n  }\n\n  // ─── 고치기 ───────────────────────────────────────────────────────────────\n\n  /**\n   * 보드에 실어 올려보낸다.\n   *\n   * `animations` 는 도형 전체의 것이므로 부품 편집(`update-part`)이 아니라 `update-board` 로\n   * 간다. 빈 배열은 칸을 지운다 — clip 을 다 지운 도형은 `animations: []` 가 아니라 없는 것이다.\n   */\n  private tell(animations: Clip[]): void {\n    if (!this.board) return\n\n    const board: BoardModel = { ...this.board }\n    if (animations.length === 0) delete board.animations\n    else board.animations = animations\n\n    this.dispatchEvent(new CustomEvent('update-board', { detail: { board }, bubbles: true, composed: true }))\n  }\n\n  private patchClip(at: number, patch: Partial<Clip>): void {\n    this.tell(this.clips.map((clip, i) => (i === at ? { ...clip, ...patch } : clip)))\n  }\n\n  private patchChannel(at: number, j: number, next: Channel): void {\n    const clip = this.clips[at]\n    if (!clip) return\n    this.patchClip(at, { channels: clip.channels.map((channel, i) => (i === j ? next : channel)) })\n  }\n\n  private addClip(): void {\n    const target = this.partNames[0]\n    if (!target) return\n\n    const clip: Clip = {\n      name: freeName(this.clips),\n      drive: 'loop',\n      channels: [{ target, path: 'translation', keys: keysFor('translation') }]\n    }\n\n    this.open = this.clips.length\n    this.tell([...this.clips, clip])\n  }\n\n  private renameClip(at: number, name: string): void {\n    this.patchClip(at, { name: name.trim() })\n  }\n\n  private setDrive(at: number, drive: Clip['drive']): void {\n    this.patchClip(at, { drive })\n  }\n\n  private removeClip(at: number): void {\n    if (this.open >= at) this.open = Math.max(0, this.open - 1)\n    this.tell(this.clips.filter((_, i) => i !== at))\n  }\n\n  private addChannel(at: number): void {\n    const clip = this.clips[at]\n    const target = this.partNames[0]\n    if (!clip || !target) return\n\n    this.patchClip(at, {\n      channels: [...clip.channels, { target, path: 'translation', keys: keysFor('translation') }]\n    })\n  }\n\n  private setChannel(at: number, j: number, patch: Partial<Channel>): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const next: Channel = { ...channel, ...patch }\n    /* `undefined` 를 얹는 것은 지우는 뜻이다. 남겨 두면 저장 형식에 빈 칸이 실린다. */\n    if ('pivot' in patch && patch.pivot === undefined) delete next.pivot\n    this.patchChannel(at, j, next)\n  }\n\n  /**\n   * 경로를 바꾼다 — **값까지 함께 옮긴다.**\n   *\n   * 옮김·회전의 0 은 「제자리」인데 배율의 0 은 **부품을 지운다.** 경로만 바꾸고 값을 그대로\n   * 두면 저작자는 부품이 사라진 것을 보고 도구가 고장 난 줄 안다. 그래서 옮김·회전 ↔ 배율을\n   * 건널 때 시작값을 그 경로의 제자리로 되돌린다. 시각은 지킨다 — 저작자가 짠 박자다.\n   */\n  private setPath(at: number, j: number, path: ChannelPath): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const crossing = (channel.path === 'scale') !== (path === 'scale')\n    const next: Channel = {\n      ...channel,\n      path,\n      keys: crossing ? channel.keys.map(key => ({ at: key.at, value: startValue(path) })) : channel.keys\n    }\n    /* 회전이 아니면 회전 중심은 쓰이지 않는다. 남겨 두면 검증이 「쓰이지 않는다」고 알린다. */\n    if (path !== 'rotation') delete next.pivot\n\n    this.patchChannel(at, j, next)\n  }\n\n  private removeChannel(at: number, j: number): void {\n    const clip = this.clips[at]\n    if (!clip) return\n    this.patchClip(at, { channels: clip.channels.filter((_, i) => i !== j) })\n  }\n\n  /** 마지막 키에서 1 초 뒤. 값은 그 키를 그대로 받는다 — 붙여 놓고 고치는 것이 짜기 쉽다. */\n  private addKey(at: number, j: number): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const last = channel.keys[channel.keys.length - 1]\n    const key: Keyframe = { at: (last?.at ?? 0) + 1, value: { ...(last?.value ?? startValue(channel.path)) } }\n    this.patchChannel(at, j, { ...channel, keys: [...channel.keys, key] })\n  }\n\n  private setKey(at: number, j: number, k: number, patch: Partial<Keyframe>): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n    this.patchChannel(at, j, {\n      ...channel,\n      keys: channel.keys.map((key, i) => (i === k ? { ...key, ...patch } : key))\n    })\n  }\n\n  /** 둘 미만으로 내려가지 않는다 — 단추가 이미 죽어 있지만 밖에서 불릴 수 있다. */\n  private removeKey(at: number, j: number, k: number): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel || channel.keys.length <= 2) return\n    this.patchChannel(at, j, { ...channel, keys: channel.keys.filter((_, i) => i !== k) })\n  }\n}\n"]}
+{"version":3,"file":"figure-animations.js","sourceRoot":"","sources":["../../client/modeller/figure-animations.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing, type TemplateResult } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { ScrollbarStyles } from '@operato/styles'\n\nimport { AXES, CHANNEL_PATHS, CLIP_DRIVES, INTERPOLATIONS, LIMITS } from '@hatiolab/figure-model'\nimport type { ChannelPath, Vec3 } from '@hatiolab/figure-model'\n\nimport type { BoardModel, PartModel } from './figure-source.js'\n\n/**\n * 이 도형이 **어떻게 움직이는가.**\n *\n * ## 왜 탭 하나가 필요한가\n *\n * 움직임은 형식에 있고 런타임까지 서 있었다 — 검증이 촘촘히 보고, 청사진이 움직이는 부품을\n * 단독 묶음으로 빼고(합치면 따로 못 움직인다), 씬이 frameClock 을 구독해 실제로 돌린다.\n * 미리보기에도 clip 마다 슬라이더가 있었다.\n *\n * **만들 자리만 없었다.** 그래서 움직이는 도형을 얻는 길이 「AI 가 후보로 내놓는 것」 하나였고,\n * 채널 하나를 고치려면 손댈 화면이 없었다.\n *\n * ## 부품이 아니라 도형의 것이다\n *\n * clip 하나가 부품 여럿을 함께 움직인다 — 문 열림은 왼짝과 오른짝이 반대로 미끄러지는 것\n * 하나다. 그래서 부품을 고르고 「이 부품의 움직임」을 적는 형태가 될 수 없고, 속성 탭이 아니라\n * 자기 탭에 산다.\n *\n * ## 트윈은 타임라인을 재생하지 않는다\n *\n * 「문 열기 clip 을 재생하라」가 아니라 **「지금 40% 열려 있다」**다. 그래서 clip 마다 그 값을\n * 어떻게 받을지(`drive`)를 저작 시점에 정한다 — 도는 롤러는 배속을 받고, 열린 문은 0~1 위치를\n * 받는다. 이 선택이 화면에서 가장 설명이 필요한 자리다.\n */\n\ntype Clip = NonNullable<BoardModel['animations']>[number]\ntype Channel = Clip['channels'][number]\ntype Keyframe = Channel['keys'][number]\n\n/** A first-success motion: intent first, raw clip/channel editing second. */\ninterface MotionRecipe {\n  id: 'conveyor' | 'gate' | 'pusher' | 'lift'\n  name: string\n  drive: Clip['drive']\n  path: ChannelPath\n  end: Vec3\n  pivot?: Vec3\n}\n\nconst MOTION_RECIPES: readonly MotionRecipe[] = [\n  { id: 'conveyor', name: 'conveyor-running', drive: 'loop', path: 'rotation', end: { x: 360, y: 0, z: 0 } },\n  { id: 'gate', name: 'gate-open', drive: 'hold', path: 'rotation', end: { x: 0, y: 90, z: 0 }, pivot: { x: 0, y: 0, z: 0 } },\n  { id: 'pusher', name: 'pusher-position', drive: 'hold', path: 'translation', end: { x: 100, y: 0, z: 0 } },\n  { id: 'lift', name: 'lift-height', drive: 'hold', path: 'translation', end: { x: 0, y: 100, z: 0 } }\n]\n\n/** 새 clip 의 키 둘. **하나로 만들지 않는다** — 키 하나는 움직임이 아니라 자세다. */\nconst NEW_KEYS: Keyframe[] = [\n  { at: 0, value: { x: 0, y: 0, z: 0 } },\n  { at: 1, value: { x: 0, y: 0, z: 0 } }\n]\n\n/** `scale` 만 1 에서 시작한다 — 0 은 부품을 지운다. */\nfunction startValue(path: ChannelPath): Vec3 {\n  return path === 'scale' ? { x: 1, y: 1, z: 1 } : { x: 0, y: 0, z: 0 }\n}\n\nfunction keysFor(path: ChannelPath): Keyframe[] {\n  return NEW_KEYS.map(key => ({ at: key.at, value: startValue(path) }))\n}\n\n/** 이미 쓴 이름을 비켜 간다. `type` 처럼 저장되는 식별자는 아니지만 인스턴스가 이 이름으로 구동한다. */\nfunction freeName(taken: readonly Clip[]): string {\n  const used = new Set(taken.map(clip => clip.name))\n  for (let n = 1; ; n++) {\n    const name = `clip-${n}`\n    if (!used.has(name)) return name\n  }\n}\n\nfunction freeRecipeName(taken: readonly Clip[], base: string): string {\n  const used = new Set(taken.map(clip => clip.name))\n  if (!used.has(base)) return base\n  for (let n = 2; ; n++) if (!used.has(`${base}-${n}`)) return `${base}-${n}`\n}\n\n@customElement('figure-animations')\nexport class FigureAnimations extends localize(i18next)(LitElement) {\n  static styles = [\n    ScrollbarStyles,\n    css`\n      :host {\n        display: flex;\n        flex-direction: column;\n        min-height: 0;\n        overflow-y: auto;\n        background-color: var(--md-sys-color-surface-container-lowest);\n        color: var(--md-sys-color-on-surface);\n        font: var(--label-font, inherit);\n        font-size: 0.76rem;\n      }\n\n      section {\n        display: flex;\n        flex-direction: column;\n        gap: var(--spacing-medium, 8px);\n        padding: var(--spacing-large, 12px);\n        border-bottom: 1px solid var(--md-sys-color-outline-variant);\n      }\n\n      /* 다른 탭들과 같은 눈금이다 */\n      h3 {\n        margin: 0 0 2px 0;\n        font-size: var(--ui-t-micro, 11px);\n        font-weight: 700;\n        letter-spacing: 0.04em;\n        text-transform: uppercase;\n        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n      }\n\n      p[quiet] {\n        margin: 0;\n        font-size: 0.72rem;\n        line-height: 1.5;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n\n      div[recipes] { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }\n      button[recipe] { min-height: 54px; align-items: flex-start; flex-direction: column; text-align: left; }\n      button[recipe] strong { font-size: 0.74rem; }\n      button[recipe] span { color: var(--md-sys-color-on-surface-variant); font-size: 0.68rem; line-height: 1.35; }\n\n      /* ── clip ─────────────────────────────────────────────────────── */\n\n      div[clip] {\n        display: flex;\n        flex-direction: column;\n        gap: var(--spacing-medium, 8px);\n        padding: 8px;\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 4px;\n      }\n      div[clip][on] {\n        border-color: var(--md-sys-color-primary);\n        background-color: var(--md-sys-color-surface-container-low);\n      }\n\n      div[head] {\n        display: flex;\n        align-items: center;\n        gap: 6px;\n      }\n      div[head] input[name] {\n        flex: 1;\n        min-width: 0;\n      }\n\n      /* ── channel ──────────────────────────────────────────────────── */\n\n      div[channel] {\n        display: flex;\n        flex-direction: column;\n        gap: 6px;\n        padding: 6px 8px;\n        border-left: 2px solid var(--md-sys-color-outline-variant);\n        background-color: var(--md-sys-color-surface-container-lowest);\n      }\n      div[channel][orphan] {\n        border-left-color: var(--md-sys-color-error);\n      }\n\n      div[row] {\n        display: flex;\n        align-items: center;\n        gap: 6px;\n      }\n      div[row] > label {\n        flex: none;\n        min-width: 3.2em;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n\n      /* ── keyframe ─────────────────────────────────────────────────── */\n\n      table[keys] {\n        width: 100%;\n        border-collapse: collapse;\n      }\n      table[keys] th {\n        padding: 0 2px 2px;\n        font-size: 0.68rem;\n        font-weight: 600;\n        text-align: left;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n      table[keys] td {\n        padding: 1px 2px;\n      }\n      table[keys] input {\n        width: 100%;\n        min-width: 0;\n      }\n      table[keys] td[drop] {\n        width: 1.6em;\n      }\n\n      input,\n      select {\n        box-sizing: border-box;\n        padding: 3px 5px;\n        font: inherit;\n        font-size: 0.74rem;\n        color: var(--md-sys-color-on-surface);\n        background-color: var(--md-sys-color-surface-container-lowest);\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 3px;\n      }\n      input:focus,\n      select:focus {\n        outline: none;\n        border-color: var(--md-sys-color-primary);\n      }\n      input[bad] {\n        border-color: var(--md-sys-color-error);\n      }\n\n      button {\n        display: inline-flex;\n        align-items: center;\n        gap: 3px;\n        padding: 3px 8px;\n        font: inherit;\n        font-size: 0.72rem;\n        color: var(--md-sys-color-on-surface);\n        background-color: var(--md-sys-color-surface-container);\n        border: 1px solid var(--md-sys-color-outline-variant);\n        border-radius: 3px;\n        cursor: pointer;\n      }\n      button:hover:not(:disabled) {\n        background-color: var(--md-sys-color-surface-container-high);\n      }\n      button:disabled {\n        opacity: 0.4;\n        cursor: default;\n      }\n      button[plain] {\n        padding: 1px 4px;\n        background: none;\n        border: none;\n        color: var(--md-sys-color-on-surface-variant);\n      }\n      button[plain]:hover:not(:disabled) {\n        color: var(--md-sys-color-error);\n        background: none;\n      }\n      button md-icon {\n        font-size: 14px;\n        width: 14px;\n        height: 14px;\n      }\n\n      /* ── 예산 ─────────────────────────────────────────────────────── */\n\n      div[budget] {\n        display: flex;\n        align-items: baseline;\n        gap: 6px;\n      }\n      div[budget] strong {\n        font-size: 0.86rem;\n        font-weight: 700;\n      }\n      div[budget][over] strong {\n        color: var(--md-sys-color-error);\n      }\n\n      p[warn] {\n        margin: 0;\n        font-size: 0.7rem;\n        line-height: 1.5;\n        color: var(--md-sys-color-error);\n      }\n    `\n  ]\n\n  @property({ type: Object }) board?: BoardModel\n  @property({ type: Array }) parts: PartModel[] = []\n\n  /** 펼쳐 둔 clip. 이름이 아니라 자리로 잡는다 — 이름은 편집 중에 바뀐다. */\n  @state() private open = 0\n  @state() private recipeTarget = ''\n\n  private get clips(): Clip[] {\n    return this.board?.animations ?? []\n  }\n\n  /** 부품 이름 — 채널이 이것을 가리킨다. */\n  private get partNames(): string[] {\n    return this.parts.map(part => part.name).filter(name => !!name)\n  }\n\n  /**\n   * 몇 부품이 움직이나 — 채널이 가리키는 **서로 다른 부품**의 수.\n   *\n   * clip 수가 아니다. 한 부품을 세 clip 이 움직여도 그 부품 하나가 단독 묶음이 될 뿐이다.\n   * 청사진이 묶음을 가르는 기준과 같은 셈이어야 화면의 수와 판정의 수가 맞는다.\n   */\n  private get movingParts(): number {\n    const moving = new Set<string>()\n    for (const clip of this.clips) for (const channel of clip.channels) moving.add(channel.target)\n    return moving.size\n  }\n\n  render(): TemplateResult {\n    if (!this.board) return html``\n\n    return html`\n      <section>\n        <h3>${i18next.t('figure.label.animation')}</h3>\n        <p quiet>${i18next.t('figure.text.animation-is-driven-by-a-fact')}</p>\n      </section>\n\n      ${this.renderRecipes()}\n      ${this.clips.length === 0 ? nothing : this.renderClips()}\n\n      <section>\n        <button @click=${() => this.addClip()} ?disabled=${this.partNames.length === 0}>\n          <md-icon>add</md-icon>${i18next.t('figure.button.add-clip')}\n        </button>\n        ${this.partNames.length === 0\n          ? html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`\n          : nothing}\n      </section>\n\n      ${this.clips.length === 0 ? nothing : this.renderBudget()}\n    `\n  }\n\n  /**\n   * 빈 화면 — **이 탭이 무엇인지 가르치는 자리다.**\n   *\n   * 「clip 을 추가하세요」라고만 쓰면 처음 여는 사람은 clip 이 무엇인지 모른 채 단추를 누른다.\n   * 그래서 무엇을 만들 수 있는지 예를 들고, 그것이 어떻게 움직이는지(사실이 들어온다)를 적는다.\n   */\n  private renderRecipes(): TemplateResult {\n    return html`\n      <section>\n        <h3>${i18next.t('figure.label.motion-intent')}</h3>\n        <p quiet>${i18next.t('figure.text.motion-intent-help')}</p>\n        ${this.partNames.length\n          ? html`<select .value=${this.recipeTarget} @change=${(e: Event) => (this.recipeTarget = (e.target as HTMLSelectElement).value)}>\n              ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n            </select>\n            <div recipes>\n              ${MOTION_RECIPES.map(recipe => html`\n                <button recipe @click=${() => this.addRecipe(recipe)}>\n                  <strong>${i18next.t('figure.label.recipe-' + recipe.id)}</strong>\n                  <span>${i18next.t('figure.text.recipe-' + recipe.id)}</span>\n                </button>\n              `)}\n            </div>`\n          : html`<p quiet>${i18next.t('figure.text.animation-needs-a-named-part')}</p>`}\n      </section>\n    `\n  }\n\n  private renderClips(): TemplateResult {\n    return html`\n      <section>\n        ${this.clips.map((clip, at) => this.renderClip(clip, at))}\n      </section>\n    `\n  }\n\n  private renderClip(clip: Clip, at: number): TemplateResult {\n    const on = this.open === at\n    const duplicate = this.clips.some((other, i) => i !== at && other.name === clip.name)\n    const nameless = !clip.name?.trim()\n\n    return html`\n      <div clip ?on=${on}>\n        <div head>\n          <button plain @click=${() => (this.open = on ? -1 : at)} title=${i18next.t('figure.label.channels')}>\n            <md-icon>${on ? 'expand_more' : 'chevron_right'}</md-icon>\n          </button>\n          <input\n            name\n            .value=${live(clip.name ?? '')}\n            ?bad=${duplicate || nameless}\n            placeholder=${i18next.t('figure.label.clip-name')}\n            title=${duplicate ? i18next.t('figure.text.clip-name-taken') : i18next.t('figure.text.clip-name-is-how-it-is-driven')}\n            @change=${(e: Event) => this.renameClip(at, (e.target as HTMLInputElement).value)}\n          />\n          <select\n            .value=${live(clip.drive ?? 'loop')}\n            title=${i18next.t('figure.text.drive-explained')}\n            @change=${(e: Event) => this.setDrive(at, (e.target as HTMLSelectElement).value as Clip['drive'])}\n          >\n            ${CLIP_DRIVES.map(\n              drive => html`<option value=${drive}>${i18next.t('figure.label.drive-' + drive)}</option>`\n            )}\n          </select>\n          <button plain @click=${() => this.removeClip(at)} title=${i18next.t('figure.button.remove')}>\n            <md-icon>close</md-icon>\n          </button>\n        </div>\n\n        ${duplicate ? html`<p warn>${i18next.t('figure.text.clip-name-taken')}</p>` : nothing}\n        ${nameless ? html`<p warn>${i18next.t('figure.text.clip-needs-a-name')}</p>` : nothing}\n        ${on ? this.renderChannels(clip, at) : nothing}\n      </div>\n    `\n  }\n\n  private renderChannels(clip: Clip, at: number): TemplateResult {\n    return html`\n      <p quiet>${i18next.t('figure.text.drive-' + (clip.drive ?? 'loop') + '-note')}</p>\n\n      ${clip.channels.length === 0 ? html`<p warn>${i18next.t('figure.text.clip-needs-a-channel')}</p>` : nothing}\n      ${clip.channels.map((channel, j) => this.renderChannel(channel, at, j))}\n\n      <button @click=${() => this.addChannel(at)}>\n        <md-icon>add</md-icon>${i18next.t('figure.button.add-channel')}\n      </button>\n    `\n  }\n\n  /**\n   * 채널 하나 — 어느 부품의 어느 속성을 움직이나.\n   *\n   * 없는 부품을 가리키는 채널은 붉게 낸다. 부품 이름을 바꾸면 그 순간 이렇게 되는데,\n   * 검증은 저장할 때 말하고 여기서는 **그 자리에서** 보여 준다.\n   */\n  private renderChannel(channel: Channel, at: number, j: number): TemplateResult {\n    const orphan = !this.partNames.includes(channel.target)\n    const turning = channel.path === 'rotation'\n\n    return html`\n      <div channel ?orphan=${orphan}>\n        <div row>\n          <label>${i18next.t('figure.label.channel-target')}</label>\n          <select\n            .value=${live(channel.target ?? '')}\n            @change=${(e: Event) => this.setChannel(at, j, { target: (e.target as HTMLSelectElement).value })}\n          >\n            ${orphan ? html`<option value=${channel.target}>${channel.target}</option>` : nothing}\n            ${this.partNames.map(name => html`<option value=${name}>${name}</option>`)}\n          </select>\n          <button plain @click=${() => this.removeChannel(at, j)} title=${i18next.t('figure.button.remove')}>\n            <md-icon>close</md-icon>\n          </button>\n        </div>\n\n        ${orphan ? html`<p warn>${i18next.t('figure.text.channel-target-is-gone')}</p>` : nothing}\n\n        <div row>\n          <label>${i18next.t('figure.label.channel-path')}</label>\n          <select\n            .value=${live(channel.path)}\n            @change=${(e: Event) => this.setPath(at, j, (e.target as HTMLSelectElement).value as ChannelPath)}\n          >\n            ${CHANNEL_PATHS.map(path => html`<option value=${path}>${i18next.t('figure.label.path-' + path)}</option>`)}\n          </select>\n          <select\n            .value=${live(channel.interpolation ?? 'linear')}\n            title=${i18next.t('figure.text.interpolation-explained')}\n            @change=${(e: Event) =>\n              this.setChannel(at, j, { interpolation: (e.target as HTMLSelectElement).value as Channel['interpolation'] })}\n          >\n            ${INTERPOLATIONS.map(\n              one => html`<option value=${one}>${i18next.t('figure.label.interpolation-' + one)}</option>`\n            )}\n          </select>\n        </div>\n\n        <p quiet>${i18next.t('figure.text.path-' + channel.path + '-unit')}</p>\n\n        ${turning ? this.renderPivot(channel, at, j) : nothing}\n        ${this.renderKeys(channel, at, j)}\n      </div>\n    `\n  }\n\n  /**\n   * 회전 중심 — **`rotation` 에서만 뜻이 있다.**\n   *\n   * 그래서 경로가 rotation 일 때만 낸다. 언제나 내면 저작자가 옮김·배율에도 적고, 검증이\n   * 저장할 때 「쓰이지 않는다」고 알린다. 안 보이면 적을 일이 없다.\n   */\n  private renderPivot(channel: Channel, at: number, j: number): TemplateResult {\n    const pivot = channel.pivot\n    const on = pivot !== undefined\n\n    return html`\n      <div row>\n        <label>${i18next.t('figure.label.channel-pivot')}</label>\n        <button\n          @click=${() => this.setChannel(at, j, { pivot: on ? undefined : { x: 0, y: 0, z: 0 } })}\n          title=${i18next.t('figure.text.pivot-defaults-to-the-part-centre')}\n        >\n          ${i18next.t(on ? 'figure.button.pivot-clear' : 'figure.button.pivot-set')}\n        </button>\n        ${on\n          ? AXES.map(\n              axis => html`\n                <input\n                  type=\"number\"\n                  step=\"1\"\n                  .value=${live(String(pivot![axis]))}\n                  aria-label=${axis}\n                  @change=${(e: Event) =>\n                    this.setChannel(at, j, {\n                      pivot: { ...pivot!, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n                    })}\n                />\n              `\n            )\n          : nothing}\n      </div>\n    `\n  }\n\n  /**\n   * 키프레임 표.\n   *\n   * **둘 미만으로 못 내려간다.** 하나뿐이면 움직이는 것이 아니라 자세 하나이고, 형식이\n   * 오류로 막는다. 저장하고 나서 알려 주는 것보다 지우는 단추를 죽이는 것이 낫다.\n   *\n   * 시각이 오름차순이어야 하는 것도 형식의 규칙이다. 여기서는 어긋난 줄을 붉게 내고 값을\n   * 고치지는 않는다 — 저작자가 3 을 1 로 고치던 중일 수 있다.\n   */\n  private renderKeys(channel: Channel, at: number, j: number): TemplateResult {\n    const keys = channel.keys ?? []\n\n    return html`\n      <table keys>\n        <tr>\n          <th>${i18next.t('figure.label.key-at')}</th>\n          ${AXES.map(axis => html`<th>${axis}</th>`)}\n          <th></th>\n        </tr>\n        ${keys.map((key, k) => {\n          const backwards = k > 0 && key.at <= (keys[k - 1]!.at ?? 0)\n          return html`\n            <tr>\n              <td>\n                <input\n                  type=\"number\"\n                  step=\"0.1\"\n                  min=\"0\"\n                  ?bad=${backwards || key.at < 0}\n                  .value=${live(String(key.at))}\n                  title=${backwards ? i18next.t('figure.text.keys-must-rise') : ''}\n                  @change=${(e: Event) =>\n                    this.setKey(at, j, k, { at: Math.max(0, Number((e.target as HTMLInputElement).value) || 0) })}\n                />\n              </td>\n              ${AXES.map(\n                axis => html`\n                  <td>\n                    <input\n                      type=\"number\"\n                      step=${channel.path === 'scale' ? '0.1' : '1'}\n                      .value=${live(String(key.value[axis]))}\n                      aria-label=${axis}\n                      @change=${(e: Event) =>\n                        this.setKey(at, j, k, {\n                          value: { ...key.value, [axis]: Number((e.target as HTMLInputElement).value) || 0 }\n                        })}\n                    />\n                  </td>\n                `\n              )}\n              <td drop>\n                <button\n                  plain\n                  ?disabled=${keys.length <= 2}\n                  title=${keys.length <= 2 ? i18next.t('figure.text.two-keys-at-least') : i18next.t('figure.button.remove')}\n                  @click=${() => this.removeKey(at, j, k)}\n                >\n                  <md-icon>close</md-icon>\n                </button>\n              </td>\n            </tr>\n          `\n        })}\n      </table>\n\n      ${keys.some((key, k) => k > 0 && key.at <= (keys[k - 1]!.at ?? 0))\n        ? html`<p warn>${i18next.t('figure.text.keys-must-rise')}</p>`\n        : nothing}\n\n      <button @click=${() => this.addKey(at, j)}>\n        <md-icon>add</md-icon>${i18next.t('figure.button.add-key')}\n      </button>\n    `\n  }\n\n  /**\n   * 움직이는 부품 예산.\n   *\n   * **넘어도 막지 않는다.** 움직이는 부품은 저마다 단독 묶음이라 draw call 이 늘고 프레임마다\n   * 갱신이 는다 — 그 대가가 수로 보이면 저작자가 아낀다. 랜드마크 설비 하나는 정교해도 되고,\n   * 그 값이 도면 예산에 드러나면 된다.\n   */\n  private renderBudget(): TemplateResult {\n    const used = this.movingParts\n    const over = used > LIMITS.animatedParts\n\n    return html`\n      <section>\n        <h3>${i18next.t('figure.label.budget-animations')}</h3>\n        <div budget ?over=${over}>\n          <strong>${used}</strong>\n          <span quiet>/ ${LIMITS.animatedParts}</span>\n        </div>\n        <p quiet>${i18next.t('figure.text.animated-parts-cost')}</p>\n        ${over ? html`<p warn>${i18next.t('figure.text.animated-parts-over')}</p>` : nothing}\n      </section>\n    `\n  }\n\n  // ─── 고치기 ───────────────────────────────────────────────────────────────\n\n  /**\n   * 보드에 실어 올려보낸다.\n   *\n   * `animations` 는 도형 전체의 것이므로 부품 편집(`update-part`)이 아니라 `update-board` 로\n   * 간다. 빈 배열은 칸을 지운다 — clip 을 다 지운 도형은 `animations: []` 가 아니라 없는 것이다.\n   */\n  private tell(animations: Clip[]): void {\n    if (!this.board) return\n\n    const board: BoardModel = { ...this.board }\n    if (animations.length === 0) delete board.animations\n    else board.animations = animations\n\n    this.dispatchEvent(new CustomEvent('update-board', { detail: { board }, bubbles: true, composed: true }))\n  }\n\n  private patchClip(at: number, patch: Partial<Clip>): void {\n    this.tell(this.clips.map((clip, i) => (i === at ? { ...clip, ...patch } : clip)))\n  }\n\n  private patchChannel(at: number, j: number, next: Channel): void {\n    const clip = this.clips[at]\n    if (!clip) return\n    this.patchClip(at, { channels: clip.channels.map((channel, i) => (i === j ? next : channel)) })\n  }\n\n  private addClip(): void {\n    const target = this.partNames[0]\n    if (!target) return\n\n    const clip: Clip = {\n      name: freeName(this.clips),\n      drive: 'loop',\n      channels: [{ target, path: 'translation', keys: keysFor('translation') }]\n    }\n\n    this.open = this.clips.length\n    this.tell([...this.clips, clip])\n  }\n\n  /** Recipe creates a valid, editable two-pose clip; it never saves or publishes the Figure. */\n  private addRecipe(recipe: MotionRecipe): void {\n    const target = this.recipeTarget || this.partNames[0]\n    if (!target) return\n    const channel: Channel = {\n      target,\n      path: recipe.path,\n      keys: [{ at: 0, value: startValue(recipe.path) }, { at: 1, value: { ...recipe.end } }]\n    }\n    if (recipe.pivot) channel.pivot = { ...recipe.pivot }\n    this.open = this.clips.length\n    this.tell([...this.clips, { name: freeRecipeName(this.clips, recipe.name), drive: recipe.drive, channels: [channel] }])\n  }\n\n  private renameClip(at: number, name: string): void {\n    this.patchClip(at, { name: name.trim() })\n  }\n\n  private setDrive(at: number, drive: Clip['drive']): void {\n    this.patchClip(at, { drive })\n  }\n\n  private removeClip(at: number): void {\n    if (this.open >= at) this.open = Math.max(0, this.open - 1)\n    this.tell(this.clips.filter((_, i) => i !== at))\n  }\n\n  private addChannel(at: number): void {\n    const clip = this.clips[at]\n    const target = this.partNames[0]\n    if (!clip || !target) return\n\n    this.patchClip(at, {\n      channels: [...clip.channels, { target, path: 'translation', keys: keysFor('translation') }]\n    })\n  }\n\n  private setChannel(at: number, j: number, patch: Partial<Channel>): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const next: Channel = { ...channel, ...patch }\n    /* `undefined` 를 얹는 것은 지우는 뜻이다. 남겨 두면 저장 형식에 빈 칸이 실린다. */\n    if ('pivot' in patch && patch.pivot === undefined) delete next.pivot\n    this.patchChannel(at, j, next)\n  }\n\n  /**\n   * 경로를 바꾼다 — **값까지 함께 옮긴다.**\n   *\n   * 옮김·회전의 0 은 「제자리」인데 배율의 0 은 **부품을 지운다.** 경로만 바꾸고 값을 그대로\n   * 두면 저작자는 부품이 사라진 것을 보고 도구가 고장 난 줄 안다. 그래서 옮김·회전 ↔ 배율을\n   * 건널 때 시작값을 그 경로의 제자리로 되돌린다. 시각은 지킨다 — 저작자가 짠 박자다.\n   */\n  private setPath(at: number, j: number, path: ChannelPath): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const crossing = (channel.path === 'scale') !== (path === 'scale')\n    const next: Channel = {\n      ...channel,\n      path,\n      keys: crossing ? channel.keys.map(key => ({ at: key.at, value: startValue(path) })) : channel.keys\n    }\n    /* 회전이 아니면 회전 중심은 쓰이지 않는다. 남겨 두면 검증이 「쓰이지 않는다」고 알린다. */\n    if (path !== 'rotation') delete next.pivot\n\n    this.patchChannel(at, j, next)\n  }\n\n  private removeChannel(at: number, j: number): void {\n    const clip = this.clips[at]\n    if (!clip) return\n    this.patchClip(at, { channels: clip.channels.filter((_, i) => i !== j) })\n  }\n\n  /** 마지막 키에서 1 초 뒤. 값은 그 키를 그대로 받는다 — 붙여 놓고 고치는 것이 짜기 쉽다. */\n  private addKey(at: number, j: number): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n\n    const last = channel.keys[channel.keys.length - 1]\n    const key: Keyframe = { at: (last?.at ?? 0) + 1, value: { ...(last?.value ?? startValue(channel.path)) } }\n    this.patchChannel(at, j, { ...channel, keys: [...channel.keys, key] })\n  }\n\n  private setKey(at: number, j: number, k: number, patch: Partial<Keyframe>): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel) return\n    this.patchChannel(at, j, {\n      ...channel,\n      keys: channel.keys.map((key, i) => (i === k ? { ...key, ...patch } : key))\n    })\n  }\n\n  /** 둘 미만으로 내려가지 않는다 — 단추가 이미 죽어 있지만 밖에서 불릴 수 있다. */\n  private removeKey(at: number, j: number, k: number): void {\n    const channel = this.clips[at]?.channels[j]\n    if (!channel || channel.keys.length <= 2) return\n    this.patchChannel(at, j, { ...channel, keys: channel.keys.filter((_, i) => i !== k) })\n  }\n}\n"]}

package/dist-client/modeller/figure-ask.d.ts

@@ -1,6 +1,7 @@
 import '@material/web/icon/icon.js';
 import { LitElement } from 'lit';
 import type { FigureSource } from '@hatiolab/figure-model';
+import type { ProposalFeedback } from '../types.js';
 declare const FigureAsk_base: (new (...args: any[]) => LitElement) & typeof LitElement;
 /**
  * 말로 시키는 줄.
@@ -26,6 +27,8 @@ export declare class FigureAsk extends FigureAsk_base {
     source?: FigureSource;
     /** 새로 만들 때 쓸 타입 이름. */
     type: string;
+    /** 이 모델러 세션에서 사람이 명시적으로 남긴 이전 후보 반응. */
+    feedback: ProposalFeedback[];
     private asking;
     private failure;
     private picture?;

package/dist-client/modeller/figure-ask.js

@@ -28,6 +28,8 @@ let FigureAsk = class FigureAsk extends localize(i18next)(LitElement) {
         super(...arguments);
         /** 새로 만들 때 쓸 타입 이름. */
         this.type = '';
+        /** 이 모델러 세션에서 사람이 명시적으로 남긴 이전 후보 반응. */
+        this.feedback = [];
         this.asking = false;
         this.failure = '';
     }
@@ -224,6 +226,9 @@ let FigureAsk = class FigureAsk extends localize(i18next)(LitElement) {
                 type: this.source ? undefined : this.type,
                 // 그리는 쪽이 풀 수 있는 토큰만 보낸다. 서버는 이 목록 밖의 색을 거절한다.
                 palette: Object.keys(activePalette()),
+                // 구조적으로는 맞지만 품질 근거가 남으면 한 번 더 개선 후보를 시킨다.
+                refine: true,
+                feedback: this.feedback,
                 image: this.picture
             });
             this.dispatchEvent(new CustomEvent('proposed', { detail: { proposal }, bubbles: true, composed: true }));
@@ -247,6 +252,10 @@ __decorate([
     property({ type: String }),
     __metadata("design:type", Object)
 ], FigureAsk.prototype, "type", void 0);
+__decorate([
+    property({ type: Array }),
+    __metadata("design:type", Array)
+], FigureAsk.prototype, "feedback", void 0);
 __decorate([
     state(),
     __metadata("design:type", Object)

package/dist-client/modeller/figure-ask.js.map

@@ -1 +1 @@
-{"version":3,"file":"figure-ask.js","sourceRoot":"","sources":["../../client/modeller/figure-ask.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport type { FigureSource } from '@hatiolab/figure-model'\nimport { activePalette } from '@hatiolab/things-scene'\n\nimport { proposeFigure } from '../graphql/index.js'\nimport type { FigureProposal } from '../types.js'\n\n/**\n * 말로 시키는 줄.\n *\n * ## 무엇을 시키는지가 화면에 보여야 한다\n *\n * 정본이 있으면 **고치는 것**이고, 없으면 **만드는 것**이다. 같은 칸으로 두 가지를\n * 하면 저작자가 「이게 지금 것을 덮어쓰나」를 매번 걱정한다. 그래서 무엇을 할지\n * 칸 옆에 적어 둔다.\n *\n * ## 후보를 여기서 받지 않는다\n *\n * 이 컴포넌트는 시키고 결과를 **알릴 뿐**이다. 받을지 버릴지는 저작면이 정한다 —\n * 정본은 한 벌이고 그 한 벌을 가진 자리가 정해야 한다.\n *\n * ## 팔레트를 함께 보낸다\n *\n * 서버는 팔레트를 모른다. 그리는 쪽이 어떤 토큰을 풀 수 있는지 아는 유일한 자리다.\n */\n@customElement('figure-ask')\nexport class FigureAsk extends localize(i18next)(LitElement) {\n  static styles = css`\n    /*\n      이 부품은 **자기 줄을 갖지 않는다.**\n\n      전에는 테두리와 여백으로 스스로 한 줄이 되었다. 저작면의 머리줄 바로 아래에 놓이니\n      화면 위쪽이 두 줄이 되었고, 위 줄은 이름을 페이지 제목과 겹쳐 적고 있었다. 캔버스가\n      주인공인 화면에서 그 두 줄은 비싸다.\n\n      이제 머리줄 안에 들어가 그 줄의 남는 폭을 쓴다. 테두리·여백은 담는 줄이 갖는다.\n    */\n    :host {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      font: var(--label-font, inherit);\n      /*\n        이 줄의 글자 크기를 여기서 정한다.\n\n        안 적어 두면 브라우저 기본 크기(16px)를 물려받는다. 아래 패널들은 전부 12px\n        언저리라 위 두 줄만 커 보이고, 단추가 화면 전체와 따로 논다.\n\n        form 요소(input · button)는 글꼴을 물려받지 않으므로 각자 적어야 한다.\n      */\n      font-size: 0.76rem;\n    }\n\n    form {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      align-items: center;\n      gap: var(--spacing-medium, 8px);\n    }\n\n    md-icon[lead] {\n      --md-icon-size: 18px;\n      flex: none;\n      color: var(--md-sys-color-primary);\n    }\n\n    input[ask] {\n      flex: 1;\n      min-width: 0;\n      padding: 6px 10px;\n      font: var(--input-field-font, inherit);\n      font-size: 0.78rem;\n      color: var(--md-sys-color-on-surface);\n      background-color: var(--md-sys-color-surface-container-lowest);\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 6px;\n    }\n    input[ask]:focus {\n      outline: 2px solid var(--md-sys-color-primary);\n      outline-offset: -1px;\n    }\n    input[ask][disabled] {\n      opacity: 0.5;\n    }\n\n    /* 무엇을 시키는 것인지 — 만드나 고치나 */\n    span[mode] {\n      flex: none;\n      font-size: 0.72rem;\n      color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n    }\n\n    /* 그림 붙이기. 붙인 것이 있으면 이름을 보여 준다 */\n    label[picture] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      flex: none;\n      padding: 5px 9px;\n      font-size: 0.74rem;\n      color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 6px;\n      cursor: pointer;\n    }\n    label[picture]:hover {\n      background-color: var(--md-sys-color-surface-container);\n    }\n    label[picture][has] {\n      color: var(--md-sys-color-on-primary-container);\n      background-color: var(--md-sys-color-primary-container);\n      border-color: transparent;\n    }\n    label[picture] md-icon {\n      --md-icon-size: 16px;\n    }\n    label[picture] input {\n      display: none;\n    }\n    span[filename] {\n      max-width: 8em;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    /*\n      채운 파랑 단추를 저장과 나눠 갖지 않는다.\n\n      머리줄의 저장이 이 화면의 주 동작이다. 바로 아래 줄에 같은 파랑 단추가 하나 더\n      있으면 어느 쪽이 주인지 눈이 못 고른다. 이쪽은 톤 단추로 한 단계 내린다.\n    */\n    button[go] {\n      flex: none;\n      padding: 6px 14px;\n      font: var(--label-font, inherit);\n      font-size: 0.76rem;\n      font-weight: 600;\n      color: var(--md-sys-color-on-primary-container);\n      background-color: var(--md-sys-color-primary-container);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n    }\n    button[go]:hover:not([disabled]) {\n      background-color: color-mix(in srgb, var(--md-sys-color-primary) 24%, var(--md-sys-color-primary-container));\n    }\n    button[go][disabled] {\n      opacity: 0.4;\n      cursor: default;\n    }\n\n    /* 못 만들었을 때. 사유를 삼키지 않는다 — 말을 고쳐 다시 시킬 단서다 */\n    div[failed] {\n      display: flex;\n      gap: 6px;\n      padding: 0 var(--spacing-large, 12px) var(--spacing-medium, 8px) var(--spacing-large, 12px);\n      font-size: 0.74rem;\n      line-height: 1.5;\n      color: var(--md-sys-color-error);\n    }\n    div[failed] md-icon {\n      --md-icon-size: 16px;\n      flex: none;\n    }\n  `\n\n  /** 지금 정본. 있으면 고치는 것이고 없으면 만드는 것이다. */\n  @property({ type: Object }) source?: FigureSource\n  /** 새로 만들 때 쓸 타입 이름. */\n  @property({ type: String }) type = ''\n\n  @state() private asking = false\n  @state() private failure = ''\n  @state() private picture?: File\n\n  render() {\n    const revising = !!this.source\n\n    return html`\n      <form @submit=${(e: Event) => this.submit(e)}>\n        <md-icon lead>auto_awesome</md-icon>\n        <span mode>${i18next.t(revising ? 'figure.text.ask-to-revise' : 'figure.text.ask-to-create')}</span>\n        <input\n          ask\n          ?disabled=${this.asking}\n          placeholder=${i18next.t(revising ? 'figure.text.ask-revise-example' : 'figure.text.ask-create-example')}\n        />\n        <label picture ?has=${!!this.picture} title=${i18next.t('figure.text.picture-is-for-proportions')}>\n          <md-icon>image</md-icon>\n          ${this.picture\n            ? html`<span filename>${this.picture.name}</span>`\n            : i18next.t('figure.button.attach-a-picture')}\n          <input type=\"file\" accept=\"image/*\" @change=${(e: Event) => this.pick(e)} />\n        </label>\n        <button go ?disabled=${this.asking}>\n          ${this.asking ? i18next.t('figure.text.asking') : i18next.t('figure.button.ask')}\n        </button>\n      </form>\n\n      ${this.failure\n        ? html`\n            <div failed>\n              <md-icon>error</md-icon>\n              <span>${this.failure}</span>\n            </div>\n          `\n        : nothing}\n    `\n  }\n\n  private pick(e: Event) {\n    const input = e.target as HTMLInputElement\n    this.picture = input.files?.[0]\n  }\n\n  private async submit(e: Event) {\n    e.preventDefault()\n\n    const input = this.renderRoot.querySelector('input[ask]') as HTMLInputElement\n    const prompt = input?.value?.trim()\n    if (!prompt || this.asking) {\n      return\n    }\n\n    this.asking = true\n    this.failure = ''\n\n    try {\n      const proposal = await proposeFigure({\n        prompt,\n        base: this.source ? JSON.stringify(this.source) : undefined,\n        type: this.source ? undefined : this.type,\n        // 그리는 쪽이 풀 수 있는 토큰만 보낸다. 서버는 이 목록 밖의 색을 거절한다.\n        palette: Object.keys(activePalette() as Record<string, string>),\n        image: this.picture\n      })\n\n      this.dispatchEvent(\n        new CustomEvent('proposed', { detail: { proposal }, bubbles: true, composed: true })\n      )\n      input.value = ''\n      this.picture = undefined\n    } catch (err) {\n      // 사유를 그대로 보여 준다. 「실패했습니다」로 뭉개면 말을 어떻게 고칠지 모른다.\n      this.failure = (err as Error).message\n    } finally {\n      this.asking = false\n    }\n  }\n}\n"]}
+{"version":3,"file":"figure-ask.js","sourceRoot":"","sources":["../../client/modeller/figure-ask.ts"],"names":[],"mappings":"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","sourcesContent":["import '@material/web/icon/icon.js'\n\nimport { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property, state } from 'lit/decorators.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport type { FigureSource } from '@hatiolab/figure-model'\nimport { activePalette } from '@hatiolab/things-scene'\n\nimport { proposeFigure } from '../graphql/index.js'\nimport type { FigureProposal, ProposalFeedback } from '../types.js'\n\n/**\n * 말로 시키는 줄.\n *\n * ## 무엇을 시키는지가 화면에 보여야 한다\n *\n * 정본이 있으면 **고치는 것**이고, 없으면 **만드는 것**이다. 같은 칸으로 두 가지를\n * 하면 저작자가 「이게 지금 것을 덮어쓰나」를 매번 걱정한다. 그래서 무엇을 할지\n * 칸 옆에 적어 둔다.\n *\n * ## 후보를 여기서 받지 않는다\n *\n * 이 컴포넌트는 시키고 결과를 **알릴 뿐**이다. 받을지 버릴지는 저작면이 정한다 —\n * 정본은 한 벌이고 그 한 벌을 가진 자리가 정해야 한다.\n *\n * ## 팔레트를 함께 보낸다\n *\n * 서버는 팔레트를 모른다. 그리는 쪽이 어떤 토큰을 풀 수 있는지 아는 유일한 자리다.\n */\n@customElement('figure-ask')\nexport class FigureAsk extends localize(i18next)(LitElement) {\n  static styles = css`\n    /*\n      이 부품은 **자기 줄을 갖지 않는다.**\n\n      전에는 테두리와 여백으로 스스로 한 줄이 되었다. 저작면의 머리줄 바로 아래에 놓이니\n      화면 위쪽이 두 줄이 되었고, 위 줄은 이름을 페이지 제목과 겹쳐 적고 있었다. 캔버스가\n      주인공인 화면에서 그 두 줄은 비싸다.\n\n      이제 머리줄 안에 들어가 그 줄의 남는 폭을 쓴다. 테두리·여백은 담는 줄이 갖는다.\n    */\n    :host {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      font: var(--label-font, inherit);\n      /*\n        이 줄의 글자 크기를 여기서 정한다.\n\n        안 적어 두면 브라우저 기본 크기(16px)를 물려받는다. 아래 패널들은 전부 12px\n        언저리라 위 두 줄만 커 보이고, 단추가 화면 전체와 따로 논다.\n\n        form 요소(input · button)는 글꼴을 물려받지 않으므로 각자 적어야 한다.\n      */\n      font-size: 0.76rem;\n    }\n\n    form {\n      display: flex;\n      flex: 1;\n      min-width: 0;\n      align-items: center;\n      gap: var(--spacing-medium, 8px);\n    }\n\n    md-icon[lead] {\n      --md-icon-size: 18px;\n      flex: none;\n      color: var(--md-sys-color-primary);\n    }\n\n    input[ask] {\n      flex: 1;\n      min-width: 0;\n      padding: 6px 10px;\n      font: var(--input-field-font, inherit);\n      font-size: 0.78rem;\n      color: var(--md-sys-color-on-surface);\n      background-color: var(--md-sys-color-surface-container-lowest);\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 6px;\n    }\n    input[ask]:focus {\n      outline: 2px solid var(--md-sys-color-primary);\n      outline-offset: -1px;\n    }\n    input[ask][disabled] {\n      opacity: 0.5;\n    }\n\n    /* 무엇을 시키는 것인지 — 만드나 고치나 */\n    span[mode] {\n      flex: none;\n      font-size: 0.72rem;\n      color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n    }\n\n    /* 그림 붙이기. 붙인 것이 있으면 이름을 보여 준다 */\n    label[picture] {\n      display: flex;\n      align-items: center;\n      gap: 4px;\n      flex: none;\n      padding: 5px 9px;\n      font-size: 0.74rem;\n      color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 6px;\n      cursor: pointer;\n    }\n    label[picture]:hover {\n      background-color: var(--md-sys-color-surface-container);\n    }\n    label[picture][has] {\n      color: var(--md-sys-color-on-primary-container);\n      background-color: var(--md-sys-color-primary-container);\n      border-color: transparent;\n    }\n    label[picture] md-icon {\n      --md-icon-size: 16px;\n    }\n    label[picture] input {\n      display: none;\n    }\n    span[filename] {\n      max-width: 8em;\n      overflow: hidden;\n      text-overflow: ellipsis;\n      white-space: nowrap;\n    }\n\n    /*\n      채운 파랑 단추를 저장과 나눠 갖지 않는다.\n\n      머리줄의 저장이 이 화면의 주 동작이다. 바로 아래 줄에 같은 파랑 단추가 하나 더\n      있으면 어느 쪽이 주인지 눈이 못 고른다. 이쪽은 톤 단추로 한 단계 내린다.\n    */\n    button[go] {\n      flex: none;\n      padding: 6px 14px;\n      font: var(--label-font, inherit);\n      font-size: 0.76rem;\n      font-weight: 600;\n      color: var(--md-sys-color-on-primary-container);\n      background-color: var(--md-sys-color-primary-container);\n      border: none;\n      border-radius: 6px;\n      cursor: pointer;\n    }\n    button[go]:hover:not([disabled]) {\n      background-color: color-mix(in srgb, var(--md-sys-color-primary) 24%, var(--md-sys-color-primary-container));\n    }\n    button[go][disabled] {\n      opacity: 0.4;\n      cursor: default;\n    }\n\n    /* 못 만들었을 때. 사유를 삼키지 않는다 — 말을 고쳐 다시 시킬 단서다 */\n    div[failed] {\n      display: flex;\n      gap: 6px;\n      padding: 0 var(--spacing-large, 12px) var(--spacing-medium, 8px) var(--spacing-large, 12px);\n      font-size: 0.74rem;\n      line-height: 1.5;\n      color: var(--md-sys-color-error);\n    }\n    div[failed] md-icon {\n      --md-icon-size: 16px;\n      flex: none;\n    }\n  `\n\n  /** 지금 정본. 있으면 고치는 것이고 없으면 만드는 것이다. */\n  @property({ type: Object }) source?: FigureSource\n  /** 새로 만들 때 쓸 타입 이름. */\n  @property({ type: String }) type = ''\n  /** 이 모델러 세션에서 사람이 명시적으로 남긴 이전 후보 반응. */\n  @property({ type: Array }) feedback: ProposalFeedback[] = []\n\n  @state() private asking = false\n  @state() private failure = ''\n  @state() private picture?: File\n\n  render() {\n    const revising = !!this.source\n\n    return html`\n      <form @submit=${(e: Event) => this.submit(e)}>\n        <md-icon lead>auto_awesome</md-icon>\n        <span mode>${i18next.t(revising ? 'figure.text.ask-to-revise' : 'figure.text.ask-to-create')}</span>\n        <input\n          ask\n          ?disabled=${this.asking}\n          placeholder=${i18next.t(revising ? 'figure.text.ask-revise-example' : 'figure.text.ask-create-example')}\n        />\n        <label picture ?has=${!!this.picture} title=${i18next.t('figure.text.picture-is-for-proportions')}>\n          <md-icon>image</md-icon>\n          ${this.picture\n            ? html`<span filename>${this.picture.name}</span>`\n            : i18next.t('figure.button.attach-a-picture')}\n          <input type=\"file\" accept=\"image/*\" @change=${(e: Event) => this.pick(e)} />\n        </label>\n        <button go ?disabled=${this.asking}>\n          ${this.asking ? i18next.t('figure.text.asking') : i18next.t('figure.button.ask')}\n        </button>\n      </form>\n\n      ${this.failure\n        ? html`\n            <div failed>\n              <md-icon>error</md-icon>\n              <span>${this.failure}</span>\n            </div>\n          `\n        : nothing}\n    `\n  }\n\n  private pick(e: Event) {\n    const input = e.target as HTMLInputElement\n    this.picture = input.files?.[0]\n  }\n\n  private async submit(e: Event) {\n    e.preventDefault()\n\n    const input = this.renderRoot.querySelector('input[ask]') as HTMLInputElement\n    const prompt = input?.value?.trim()\n    if (!prompt || this.asking) {\n      return\n    }\n\n    this.asking = true\n    this.failure = ''\n\n    try {\n      const proposal = await proposeFigure({\n        prompt,\n        base: this.source ? JSON.stringify(this.source) : undefined,\n        type: this.source ? undefined : this.type,\n        // 그리는 쪽이 풀 수 있는 토큰만 보낸다. 서버는 이 목록 밖의 색을 거절한다.\n        palette: Object.keys(activePalette() as Record<string, string>),\n        // 구조적으로는 맞지만 품질 근거가 남으면 한 번 더 개선 후보를 시킨다.\n        refine: true,\n        feedback: this.feedback,\n        image: this.picture\n      })\n\n      this.dispatchEvent(\n        new CustomEvent('proposed', { detail: { proposal }, bubbles: true, composed: true })\n      )\n      input.value = ''\n      this.picture = undefined\n    } catch (err) {\n      // 사유를 그대로 보여 준다. 「실패했습니다」로 뭉개면 말을 어떻게 고칠지 모른다.\n      this.failure = (err as Error).message\n    } finally {\n      this.asking = false\n    }\n  }\n}\n"]}

package/dist-client/modeller/figure-history-panel.d.ts

@@ -49,6 +49,13 @@ export declare class FigureHistoryPanel extends FigureHistoryPanel_base {
      * 준다 — 화면이 문장을 지으면 서버가 거절할 때와 다른 말을 하게 된다.
      */
     private renderFinding;
+    /**
+     * 게이트는 수정을 저장하지 않는다. 부모 모델러가 현재 정본과 이 한 수정안을 나란히 렌더하고,
+     * 저작자가 '변경 받기'를 눌렀을 때에만 자기 작업 사본에 적용한다.
+     */
+    private previewFix;
+    /** 서버가 전수 재검사해 모든 차단 split이 사라진 후보만 작업 사본에 원클릭 적용한다. 저장은 하지 않는다. */
+    private applyFix;
     private renderVersion;
     private release;
     private revert;

package/dist-client/modeller/figure-history-panel.js

@@ -257,6 +257,33 @@ let FigureHistoryPanel = class FigureHistoryPanel extends localize(i18next)(LitE
       margin-top: 1px;
     }
 
+    /* 설명으로 끝내지 않는다. 이 단추는 원본을 바꾸지 않고 모델러에 후보만 연다. */
+    li[finding] button[preview-fix] {
+      margin-top: 3px;
+      padding: 4px 7px;
+      font-weight: 700;
+      color: var(--md-sys-color-on-primary-container, var(--md-sys-color-on-surface));
+      background-color: var(--md-sys-color-primary-container, transparent);
+      border: 0;
+      border-radius: 5px;
+      cursor: pointer;
+    }
+
+    li[finding] button[preview-fix]:hover {
+      filter: brightness(1.08);
+    }
+
+    li[finding] button[apply-fix] {
+      margin-top: 3px;
+      padding: 4px 7px;
+      font-weight: 700;
+      color: var(--ui-on-accent, #fff);
+      background-color: var(--md-sys-color-primary);
+      border: 0;
+      border-radius: 5px;
+      cursor: pointer;
+    }
+
     p[quiet] {
       margin: 0;
       line-height: 1.6;
@@ -386,9 +413,32 @@ let FigureHistoryPanel = class FigureHistoryPanel extends localize(i18next)(LitE
         ${finding.at ? html `<code where>${finding.at}</code>` : nothing}
         ${finding.why ? html `<span why-line>${finding.why}</span>` : nothing}
         ${finding.how ? html `<span how-line><md-icon>build</md-icon>${finding.how}</span>` : nothing}
+        ${(finding.fixes ?? []).map(fix => html `
+          ${fix.safe ? html `
+            <button apply-fix @click=${() => this.applyFix(fix)}>
+              안전하게 수정 적용 · ${fix.part}.anchor.${fix.axis}: ${fix.from ?? 'auto'} → ${fix.to}
+            </button>
+          ` : nothing}
+          <button preview-fix @click=${() => this.previewFix(fix)}>
+            수정안 미리보기 · ${fix.part}.anchor.${fix.axis}: ${fix.from ?? 'auto'} → ${fix.to}
+          </button>
+        `)}
       </li>
     `;
     }
+    /**
+     * 게이트는 수정을 저장하지 않는다. 부모 모델러가 현재 정본과 이 한 수정안을 나란히 렌더하고,
+     * 저작자가 '변경 받기'를 눌렀을 때에만 자기 작업 사본에 적용한다.
+     */
+    previewFix(fix) {
+        this.dispatchEvent(new CustomEvent('preview-sizing-fix', { detail: fix, bubbles: true, composed: true }));
+    }
+    /** 서버가 전수 재검사해 모든 차단 split이 사라진 후보만 작업 사본에 원클릭 적용한다. 저장은 하지 않는다. */
+    applyFix(fix) {
+        if (!fix.safe)
+            return;
+        this.dispatchEvent(new CustomEvent('apply-sizing-fix', { detail: fix, bubbles: true, composed: true }));
+    }
     renderVersion(version) {
         return html `
       <li>