@things-factory/figure-ui 10.1.69 → 10.1.70

package/client/graphql/index.ts

@@ -348,3 +348,76 @@ export async function fetchFigureRecipes(): Promise<Array<{ name: string; source
   })
   return unwrap<Array<{ name: string; source: string }> | null>(response, 'figureRecipes') ?? []
 }
+
+/** A recipe row as the management screen reads it: whose it is and whether it is released. */
+export interface FigureRecipeRow {
+  name: string
+  source: string
+  state: 'draft' | 'released'
+  updatedAt?: string
+  domain?: { id: string; subdomain?: string }
+}
+
+/** Every recipe this domain sees, drafts too (ADR-0095). */
+export async function fetchFigureRecipeRows(): Promise<FigureRecipeRow[]> {
+  const response = await client.query({
+    query: gql`
+      query {
+        figureRecipes(all: true) {
+          name
+          source
+          state
+          updatedAt
+          domain {
+            id
+            subdomain
+          }
+        }
+      }
+    `,
+    fetchPolicy: 'network-only'
+  })
+  return unwrap<FigureRecipeRow[] | null>(response, 'figureRecipes') ?? []
+}
+
+export async function saveFigureRecipe(source: string, state: 'draft' | 'released'): Promise<FigureRecipeRow> {
+  const response = await client.mutate({
+    mutation: gql`
+      mutation ($source: String!, $state: String) {
+        saveFigureRecipe(source: $source, state: $state) {
+          name
+          source
+          state
+        }
+      }
+    `,
+    variables: { source, state }
+  })
+  return unwrap<FigureRecipeRow>(response, 'saveFigureRecipe')
+}
+
+export async function setFigureRecipeState(name: string, state: 'draft' | 'released'): Promise<void> {
+  const response = await client.mutate({
+    mutation: gql`
+      mutation ($name: String!, $state: String!) {
+        setFigureRecipeState(name: $name, state: $state) {
+          name
+        }
+      }
+    `,
+    variables: { name, state }
+  })
+  unwrap(response, 'setFigureRecipeState')
+}
+
+export async function deleteFigureRecipe(name: string): Promise<void> {
+  const response = await client.mutate({
+    mutation: gql`
+      mutation ($name: String!) {
+        deleteFigureRecipe(name: $name)
+      }
+    `,
+    variables: { name }
+  })
+  unwrap(response, 'deleteFigureRecipe')
+}

package/client/modeller/figure-v3-parts.ts

@@ -242,11 +242,10 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
         border-radius: 8px;
         font-size: 0.75rem;
       }
+      /* The side pane is narrow (200 px, 160 under 860): the name above its field, not beside it. */
       div[recipe-form] label[field] {
         display: grid;
-        grid-template-columns: 1fr 5.5em;
-        align-items: center;
-        gap: 6px;
+        gap: 2px;
       }
       div[recipe-form] input[type='number'],
       div[recipe-form] select {
@@ -270,6 +269,7 @@ export class FigureV3Parts extends localize(i18next)(LitElement) {
         gap: 6px;
       }
       div[recipe-actions] button {
+        white-space: nowrap;
         display: inline-flex;
         align-items: center;
         gap: 4px;

package/client/modeller/v3-recipes.ts

@@ -49,3 +49,21 @@ export function recipeFieldOf(param: V3RecipeParam, value: V3RecipeValue): strin
   if (param.kind === 'ratio' && typeof value === 'number') return String(Math.round(value * 1e6) / 1e4)
   return String(value)
 }
+
+/** The domain on screen, from the address (`/domain/<subdomain>/…`); '' when the address names none. */
+export function subdomainOf(pathname: string): string {
+  return /^\/domain\/([^/]+)/.exec(pathname)?.[1] ?? ''
+}
+
+/** Whose a recipe row is: this domain's own (it may change it) or a parent's (copied in to be changed). */
+export function recipeIsOwn(row: { domain?: { subdomain?: string } }, subdomain: string): boolean {
+  return !!subdomain && row.domain?.subdomain === subdomain
+}
+
+/** What a parameter takes, in a few words: a range, a percentage range, or its options. */
+export function paramRangeOf(param: V3RecipeParam): string {
+  if (param.kind === 'ratio') return `${recipeFieldOf(param, param.min ?? 0)} – ${recipeFieldOf(param, param.max ?? 1)} %`
+  if (param.kind === 'mm') return `${param.min ?? ''} – ${param.max ?? ''} mm`
+  if (param.kind === 'flag') return ''
+  return (param.options ?? []).join(' / ')
+}

package/client/pages/figure-recipe-page.ts

@@ -0,0 +1,338 @@
+import '@material/web/icon/icon.js'
+import '../modeller/figure-v3-preview.js'
+
+import { css, html, nothing } from 'lit'
+import { customElement, state } from 'lit/decorators.js'
+
+import { i18next, localize } from '@operato/i18n'
+import { PageView } from '@operato/shell'
+import { OxPrompt } from '@operato/popup'
+import { ScrollbarStyles, WorkSurfacePageStyles } from '@operato/styles'
+import { applyV3Recipe, parseV3Recipe, v3RecipeTestRoom } from '@hatiolab/figure-model'
+import type { V3Asset, V3Recipe } from '@hatiolab/figure-model'
+
+import { deleteFigureRecipe, fetchFigureRecipeRows, saveFigureRecipe, setFigureRecipeState, type FigureRecipeRow } from '../graphql/index.js'
+import { paramRangeOf, recipeFieldOf, recipeIsOwn, recipesOf, recipeWord, subdomainOf } from '../modeller/v3-recipes.js'
+
+/**
+ * The recipes (ADR-0095): what each one puts in, shown put into a room at several sizes, and whose it is.
+ *
+ * A recipe of this domain's own can be released, taken back to draft, changed or deleted. A parent's -- the ones the
+ * system domain ships -- is copied in under its name to be changed, and the copy stands in for it. Figures a recipe was
+ * put into keep their parts whatever happens here.
+ */
+@customElement('figure-recipe-page')
+export class FigureRecipePage extends localize(i18next)(PageView) {
+  static styles = [
+    WorkSurfacePageStyles,
+    ScrollbarStyles,
+    css`
+      :host {
+        display: grid;
+        grid-template-columns: minmax(220px, 280px) 1fr;
+        background-color: var(--md-sys-color-surface);
+        color: var(--md-sys-color-on-surface);
+        font-size: 0.85rem;
+      }
+      @container (max-width: 640px) {
+        :host {
+          grid-template-columns: 1fr;
+        }
+      }
+      nav {
+        overflow: auto;
+        border-right: 1px solid var(--md-sys-color-outline-variant);
+        padding: 8px;
+      }
+      nav p[intro] {
+        margin: 4px 4px 10px;
+        color: var(--md-sys-color-on-surface-variant);
+        line-height: 1.5;
+      }
+      button[row] {
+        display: grid;
+        gap: 2px;
+        width: 100%;
+        padding: 8px 10px;
+        text-align: left;
+        font: inherit;
+        color: inherit;
+        background: none;
+        border: none;
+        border-radius: 8px;
+        cursor: pointer;
+      }
+      button[row][on] {
+        background: var(--md-sys-color-secondary-container);
+        color: var(--md-sys-color-on-secondary-container);
+      }
+      button[row] small {
+        display: flex;
+        gap: 6px;
+        color: var(--md-sys-color-on-surface-variant);
+      }
+      span[chip] {
+        padding: 0 6px;
+        border-radius: 999em;
+        border: 1px solid var(--md-sys-color-outline-variant);
+        font-size: 0.7rem;
+      }
+      span[chip][draft] {
+        color: var(--md-sys-color-tertiary);
+        border-color: var(--md-sys-color-tertiary);
+      }
+      main {
+        overflow: auto;
+        padding: 12px 16px;
+        display: grid;
+        gap: 12px;
+        align-content: start;
+      }
+      main h2 {
+        margin: 0;
+        font-size: var(--ui-t-title, 16px);
+      }
+      main p {
+        margin: 0;
+        line-height: 1.5;
+      }
+      p[muted] {
+        color: var(--md-sys-color-on-surface-variant);
+      }
+      table {
+        border-collapse: collapse;
+        width: 100%;
+        max-width: 720px;
+      }
+      th,
+      td {
+        text-align: left;
+        padding: 4px 8px;
+        border-bottom: 1px solid var(--md-sys-color-outline-variant);
+      }
+      figure-v3-preview {
+        height: 420px;
+        border: 1px solid var(--md-sys-color-outline-variant);
+        border-radius: 8px;
+        overflow: hidden;
+      }
+      div[actions] {
+        display: flex;
+        flex-wrap: wrap;
+        gap: 8px;
+      }
+      div[actions] button {
+        display: inline-flex;
+        align-items: center;
+        gap: 4px;
+        padding: 6px 12px;
+        font: inherit;
+        color: var(--md-sys-color-on-surface);
+        background: none;
+        border: 1px solid var(--md-sys-color-outline-variant);
+        border-radius: 999em;
+        cursor: pointer;
+      }
+      div[actions] button[primary] {
+        color: var(--md-sys-color-on-primary);
+        background: var(--md-sys-color-primary);
+        border-color: transparent;
+      }
+      div[actions] button[danger] {
+        color: var(--md-sys-color-error);
+        border-color: var(--md-sys-color-error);
+      }
+      p[role='alert'] {
+        padding: 8px;
+        white-space: pre-wrap;
+        color: var(--md-sys-color-on-error-container);
+        background: var(--md-sys-color-error-container);
+        border-radius: 8px;
+      }
+      textarea {
+        width: 100%;
+        min-height: 320px;
+        font: 0.78rem/1.4 monospace;
+        box-sizing: border-box;
+      }
+    `
+  ]
+
+  @state() private rows: FigureRecipeRow[] = []
+  @state() private chosen = ''
+  @state() private error = ''
+  @state() private editing = false
+  @state() private text = ''
+
+  get context() {
+    return { title: i18next.t('figure.title.recipes') }
+  }
+
+  async pageUpdated(_changes: Record<string, unknown>, _lifecycle: unknown, before: { active?: boolean }) {
+    if (this.active && !before?.active) await this.read()
+  }
+
+  private async read() {
+    try {
+      this.rows = await fetchFigureRecipeRows()
+      if (!this.rows.some(r => r.name === this.chosen)) this.chosen = this.rows[0]?.name ?? ''
+      this.error = ''
+    } catch (error) {
+      this.error = error instanceof Error ? error.message : String(error)
+    }
+  }
+
+  private get subdomain() {
+    return subdomainOf(location.pathname)
+  }
+
+  render() {
+    const language = i18next.language || 'en'
+    const recipes = recipesOf(this.rows)
+    const row = this.rows.find(r => r.name === this.chosen)
+    const recipe = recipes.find(r => r.name === this.chosen)
+    return html`
+      <nav>
+        <p intro>${i18next.t('figure.text.recipes-intro')}</p>
+        ${this.rows.map(one => {
+          const r = recipes.find(x => x.name === one.name)
+          return html`<button row ?on=${one.name === this.chosen} @click=${() => this.choose(one.name)}>
+            <span>${r ? recipeWord(r.title, language) : one.name}</span>
+            <small>
+              <span>${one.name}</span>
+              ${one.state === 'draft' ? html`<span chip draft>${i18next.t('figure.label.recipe-draft')}</span>` : nothing}
+              ${recipeIsOwn(one, this.subdomain) ? nothing : html`<span chip>${i18next.t('figure.label.recipe-inherited')}</span>`}
+            </small>
+          </button>`
+        })}
+      </nav>
+      <main>
+        ${this.error ? html`<p role="alert">${this.error}</p>` : nothing}
+        ${row && recipe ? this.renderRecipe(row, recipe, language) : html`<p muted>${i18next.t('figure.text.recipes-empty')}</p>`}
+      </main>
+    `
+  }
+
+  private renderRecipe(row: FigureRecipeRow, recipe: V3Recipe, language: string) {
+    const own = recipeIsOwn(row, this.subdomain)
+    return html`
+      <h2>${recipeWord(recipe.title, language)}</h2>
+      <p>${recipeWord(recipe.description, language)}</p>
+      <p muted>
+        ${i18next.t(recipe.target === 'part' ? 'figure.text.recipe-target-part' : 'figure.text.recipe-target-figure')} ·
+        ${i18next.t(own ? 'figure.text.recipe-own' : 'figure.text.recipe-inherited', { domain: row.domain?.subdomain ?? '' })}
+      </p>
+      <table>
+        <thead>
+          <tr>
+            <th>${i18next.t('figure.label.recipe-param')}</th>
+            <th>${i18next.t('figure.label.recipe-default')}</th>
+            <th>${i18next.t('figure.label.recipe-range')}</th>
+          </tr>
+        </thead>
+        <tbody>
+          ${recipe.params.map(
+            p => html`<tr>
+              <td>${recipeWord(p.label, language) || p.name}</td>
+              <td>${p.kind === 'flag' ? i18next.t(p.default ? 'figure.label.yes' : 'figure.label.no') : recipeFieldOf(p, p.default)}${p.kind === 'ratio' ? ' %' : ''}</td>
+              <td>${paramRangeOf(p)}</td>
+            </tr>`
+          )}
+        </tbody>
+      </table>
+      ${this.renderPreview(recipe)}
+      <div actions>
+        ${own
+          ? html`${row.state === 'draft'
+                ? html`<button primary @click=${() => this.setState(row.name, 'released')}>${i18next.t('figure.button.recipe-release')}</button>`
+                : html`<button @click=${() => this.setState(row.name, 'draft')}>${i18next.t('figure.button.recipe-to-draft')}</button>`}
+              <button danger @click=${() => this.deleteRecipe(row.name)}><md-icon>delete</md-icon>${i18next.t('figure.button.recipe-delete')}</button>`
+          : html`<button primary @click=${() => this.copyIn(row)}>${i18next.t('figure.button.recipe-copy-in')}</button>`}
+        <button @click=${() => this.edit(row)}><md-icon>data_object</md-icon>${i18next.t('figure.button.recipe-edit-source')}</button>
+      </div>
+      ${this.editing
+        ? html`<p muted>${i18next.t('figure.text.recipe-edit-source')}</p>
+            <textarea .value=${this.text} @input=${(e: Event) => (this.text = (e.target as HTMLTextAreaElement).value)}></textarea>
+            <div actions>
+              <button primary @click=${() => this.saveText(own ? row.state : 'draft')}>${i18next.t('figure.button.save')}</button>
+              <button @click=${() => (this.editing = false)}>${i18next.t('figure.button.close')}</button>
+            </div>`
+        : nothing}
+    `
+  }
+
+  /** The recipe put into the room it is checked in, with its defaults: what it makes, at several sizes. */
+  private renderPreview(recipe: V3Recipe) {
+    let asset: V3Asset
+    try {
+      const room = v3RecipeTestRoom()
+      asset = applyV3Recipe(room.asset, parseV3Recipe(recipe), recipe.target === 'part' ? { target: room.target } : {}).asset
+    } catch (error) {
+      return html`<p role="alert">${error instanceof Error ? error.message : String(error)}</p>`
+    }
+    return html`<p muted>${i18next.t('figure.text.recipe-preview')}</p>
+      <figure-v3-preview .asset=${asset} .context=${`recipe:${recipe.name}`}></figure-v3-preview>`
+  }
+
+  private choose(name: string) {
+    this.chosen = name
+    this.editing = false
+    this.error = ''
+  }
+
+  private edit(row: FigureRecipeRow) {
+    this.editing = !this.editing
+    try {
+      this.text = JSON.stringify(JSON.parse(row.source), null, 2)
+    } catch {
+      this.text = row.source
+    }
+  }
+
+  private async run(action: () => Promise<unknown>) {
+    try {
+      await action()
+      this.error = ''
+      await this.read()
+    } catch (error) {
+      this.error = error instanceof Error ? error.message : String(error)
+    }
+  }
+
+  private setState(name: string, state: 'draft' | 'released') {
+    return this.run(() => setFigureRecipeState(name, state))
+  }
+
+  /* The app's own prompt, as every operato screen asks -- not the browser's confirm box (user, 2026-09-24). */
+  private async deleteRecipe(name: string) {
+    const sure = await OxPrompt.open({
+      type: 'warning',
+      title: i18next.t('figure.button.recipe-delete'),
+      text: i18next.t('figure.text.recipe-delete-confirm', { name }),
+      confirmButton: { text: i18next.t('figure.button.recipe-delete') },
+      cancelButton: { text: i18next.t('figure.button.close') }
+    })
+    if (sure) await this.run(() => deleteFigureRecipe(name))
+  }
+
+  /** A parent's recipe copied into this domain as a draft, to be changed here. */
+  private copyIn(row: FigureRecipeRow) {
+    return this.run(() => saveFigureRecipe(row.source, 'draft'))
+  }
+
+  /** The source as typed: checked by the server in the test room; a new name is a new recipe. */
+  private async saveText(state: 'draft' | 'released') {
+    let name = ''
+    try {
+      name = JSON.parse(this.text).name ?? ''
+    } catch (error) {
+      this.error = error instanceof Error ? error.message : String(error)
+      return
+    }
+    await this.run(async () => {
+      await saveFigureRecipe(this.text, state)
+      this.chosen = name
+      this.editing = false
+    })
+  }
+}

package/client/route.ts

@@ -4,6 +4,10 @@ export default function route(page: string) {
       import('./pages/figure-list-page')
       return page
 
+    case 'figure-recipes':
+      import('./pages/figure-recipe-page')
+      return page
+
     /*
       One modeller since ADR-0087 step 5. `figure-v3-modeller` is kept as an alias for links made before the switch.
     */

package/dist-client/graphql/index.d.ts

@@ -70,3 +70,19 @@ export declare function fetchFigureRecipes(): Promise<Array<{
     name: string;
     source: string;
 }>>;
+/** A recipe row as the management screen reads it: whose it is and whether it is released. */
+export interface FigureRecipeRow {
+    name: string;
+    source: string;
+    state: 'draft' | 'released';
+    updatedAt?: string;
+    domain?: {
+        id: string;
+        subdomain?: string;
+    };
+}
+/** Every recipe this domain sees, drafts too (ADR-0095). */
+export declare function fetchFigureRecipeRows(): Promise<FigureRecipeRow[]>;
+export declare function saveFigureRecipe(source: string, state: 'draft' | 'released'): Promise<FigureRecipeRow>;
+export declare function setFigureRecipeState(name: string, state: 'draft' | 'released'): Promise<void>;
+export declare function deleteFigureRecipe(name: string): Promise<void>;

package/dist-client/graphql/index.js

@@ -298,4 +298,64 @@ export async function fetchFigureRecipes() {
     });
     return unwrap(response, 'figureRecipes') ?? [];
 }
+/** Every recipe this domain sees, drafts too (ADR-0095). */
+export async function fetchFigureRecipeRows() {
+    const response = await client.query({
+        query: gql `
+      query {
+        figureRecipes(all: true) {
+          name
+          source
+          state
+          updatedAt
+          domain {
+            id
+            subdomain
+          }
+        }
+      }
+    `,
+        fetchPolicy: 'network-only'
+    });
+    return unwrap(response, 'figureRecipes') ?? [];
+}
+export async function saveFigureRecipe(source, state) {
+    const response = await client.mutate({
+        mutation: gql `
+      mutation ($source: String!, $state: String) {
+        saveFigureRecipe(source: $source, state: $state) {
+          name
+          source
+          state
+        }
+      }
+    `,
+        variables: { source, state }
+    });
+    return unwrap(response, 'saveFigureRecipe');
+}
+export async function setFigureRecipeState(name, state) {
+    const response = await client.mutate({
+        mutation: gql `
+      mutation ($name: String!, $state: String!) {
+        setFigureRecipeState(name: $name, state: $state) {
+          name
+        }
+      }
+    `,
+        variables: { name, state }
+    });
+    unwrap(response, 'setFigureRecipeState');
+}
+export async function deleteFigureRecipe(name) {
+    const response = await client.mutate({
+        mutation: gql `
+      mutation ($name: String!) {
+        deleteFigureRecipe(name: $name)
+      }
+    `,
+        variables: { name }
+    });
+    unwrap(response, 'deleteFigureRecipe');
+}
 //# sourceMappingURL=index.js.map

package/dist-client/graphql/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../../client/graphql/index.ts"],"names":[],"mappings":"AAAA,OAAO,GAAG,MAAM,aAAa,CAAA;AAC7B,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,MAAM,EAAE,MAAM,kBAAkB,CAAA;AAYzC;;;;;;;;;;GAUG;AACH,SAAS,MAAM,CAAI,QAAqF,EAAE,KAAa;IACrH,MAAM,IAAI,GAAG,QAAQ,CAAC,MAAM,EAAE,CAAC,CAAC,CAAC,EAAE,OAAO,CAAA;IAC1C,IAAI,IAAI;QAAE,MAAM,IAAI,KAAK,CAAC,IAAI,CAAC,CAAA;IAE/B,IAAI,CAAC,QAAQ,CAAC,IAAI,EAAE,CAAC;QACnB,oGAAoG;QACpG,OAAO,CAAC,KAAK,CAAC,+CAA+C,KAAK,EAAE,CAAC,CAAA;QACrE,MAAM,IAAI,KAAK,CAAC,OAAO,CAAC,CAAC,CAAC,qCAAqC,CAAC,CAAC,CAAA;IACnE,CAAC;IAED,OAAO,QAAQ,CAAC,IAAI,CAAC,KAAK,CAAM,CAAA;AAClC,CAAC;AAGD;;;;;;;GAOG;AACH,MAAM,kBAAkB,GAAG;;;;;;;;;;;;;;;CAe1B,CAAA;AAED;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,eAAe,CAAC,MAKrC;IACC,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;oBAGM,kBAAkB;;;;KAIjC;QACD,SAAS,EAAE;YACT,OAAO,EAAE,MAAM,CAAC,OAAO,IAAI,EAAE;YAC7B,UAAU,EAAE,EAAE,IAAI,EAAE,MAAM,CAAC,IAAI,IAAI,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,KAAK,IAAI,EAAE,EAAE;YACjE,QAAQ,EAAE,MAAM,CAAC,QAAQ,EAAE,MAAM,CAAC,CAAC,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,EAAE,IAAI,EAAE,WAAW,EAAE,IAAI,EAAE,IAAI,EAAE,CAAC;SAC1F;QACD,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAmB,QAAQ,EAAE,SAAS,CAAC,CAAA;AACtD,CAAC;AAED,qCAAqC;AACrC,MAAM,CAAC,KAAK,UAAU,WAAW,CAAC,EAAU;IAC1C,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;YAGF,kBAAkB;;;;;KAKzB;QACD,SAAS,EAAE,EAAE,EAAE,EAAE;QACjB,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAS,QAAQ,EAAE,QAAQ,CAAC,CAAA;AAC3C,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,oBAAoB;IACxC,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;KAIT;QACD,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAkB,QAAQ,EAAE,iBAAiB,CAAC,IAAI,EAAE,CAAA;AACnE,CAAC;AAQD,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,MAAiB;IAClD,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;QACnC,QAAQ,EAAE,GAAG,CAAA;;;qBAGI,kBAAkB;;;;KAIlC;QACD,SAAS,EAAE,EAAE,MAAM,EAAE;KACtB,CAAC,CAAA;IAEF,OAAO,MAAM,CAAa,QAAQ,EAAE,cAAc,CAAC,CAAA;AACrD,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,EAAU,EAAE,KAAkB;IAC/D,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;QACnC,QAAQ,EAAE,GAAG,CAAA;;;qBAGI,kBAAkB;;;;KAIlC;QACD,SAAS,EAAE,EAAE,EAAE,EAAE,KAAK,EAAE;KACzB,CAAC,CAAA;IAEF,OAAO,MAAM,CAAa,QAAQ,EAAE,cAAc,CAAC,CAAA;AACrD,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,EAAU;IAC3C,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;QACnC,QAAQ,EAAE,GAAG,CAAA;;;;KAIZ;QACD,SAAS,EAAE,EAAE,EAAE,EAAE;KAClB,CAAC,CAAA;IAEF,OAAO,MAAM,CAAU,QAAQ,EAAE,cAAc,CAAC,CAAA;AAClD,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,aAAa,CAAC,EAAU,EAAE,OAAgB;IAC9D,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;QACnC,QAAQ,EAAE,GAAG,CAAA;;;;;;;;;KASZ;QACD,SAAS,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE;KAC3B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAS,QAAQ,EAAE,eAAe,CAAC,CAAA;AAClD,CAAC;AAED,kDAAkD;AAClD,MAAM,CAAC,KAAK,UAAU,mBAAmB,CAAC,EAAU,EAAE,OAAe;IACnE,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,MAAM,CAAC;QACnC,QAAQ,EAAE,GAAG,CAAA;;;qBAGI,kBAAkB;;;;KAIlC;QACD,SAAS,EAAE,EAAE,EAAE,EAAE,OAAO,EAAE;KAC3B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAa,QAAQ,EAAE,qBAAqB,CAAC,CAAA;AAC5D,CAAC;AAED;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,aAAa,CAAC,EAAU;IAC5C,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;KAcT;QACD,SAAS,EAAE,EAAE,EAAE,EAAE;QACjB,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAmB,QAAQ,EAAE,eAAe,CAAC,CAAA;AAC5D,CAAC;AAED;;;;;;GAMG;AACH,MAAM,CAAC,KAAK,UAAU,kBAAkB,CAAC,MAAc,EAAE,EAAW;IAClE,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;;KAcT;QACD,SAAS,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE;QACzB,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAmB,QAAQ,EAAE,oBAAoB,CAAC,CAAA;AACjE,CAAC;AAED,2BAA2B;AAC3B;;;;;GAKG;AACH,MAAM,CAAC,KAAK,UAAU,mBAAmB,CAAC,EAAU;IAClD,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;KAOT;QACD,SAAS,EAAE,EAAE,EAAE,EAAE;QACjB,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAsB,QAAQ,EAAE,gBAAgB,CAAC,EAAE,MAAM,IAAI,SAAS,CAAA;AACrF,CAAC;AAED,MAAM,CAAC,KAAK,UAAU,mBAAmB,CAAC,EAAU;IAClD,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;;;;;;;KAaT;QACD,SAAS,EAAE,EAAE,EAAE,EAAE;QACjB,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IAEF,OAAO,MAAM,CAAkB,QAAQ,EAAE,gBAAgB,CAAC,IAAI,EAAE,CAAA;AAClE,CAAC;AAED,yHAAyH;AACzH,MAAM,CAAC,KAAK,UAAU,kBAAkB;IACtC,MAAM,QAAQ,GAAG,MAAM,MAAM,CAAC,KAAK,CAAC;QAClC,KAAK,EAAE,GAAG,CAAA;;;;;;;KAOT;QACD,WAAW,EAAE,cAAc;KAC5B,CAAC,CAAA;IACF,OAAO,MAAM,CAAiD,QAAQ,EAAE,eAAe,CAAC,IAAI,EAAE,CAAA;AAChG,CAAC","sourcesContent":["import gql from 'graphql-tag'\nimport { i18next } from '@operato/i18n'\nimport { client } from '@operato/graphql'\n\nimport type {\n  Figure,\n  FigureFinding,\n  FigureInspection,\n  FigureListResult,\n  FigurePatch,\n  FigureVersion,\n  NewFigure\n} from '../types.js'\n\n/**\n * 응답에서 값을 꺼낸다. **서버가 말한 사유를 그대로 올린다.**\n *\n * 전에는 `response.data.figures` 처럼 바로 꺼냈다. 서버가 오류를 돌려주면 `data` 가\n * 없으므로 `Cannot read properties of undefined (reading 'figures')` 가 났고, 화면에는\n * 그 문장이 그대로 떴다. 사용자는 자기가 무엇을 잘못했는지 알 수 없다 — 실제로 AI\n * 요청에서 그렇게 났다.\n *\n * 값이 `null` 인 것은 오류가 아니다. 지운 것을 물었을 때처럼 없는 것이 답인 경우가 있다.\n * 여기서 막는 것은 **`data` 자체가 없는 것**이다.\n */\nfunction unwrap<T>(response: { data?: Record<string, unknown>; errors?: readonly { message: string }[] }, field: string): T {\n  const said = response.errors?.[0]?.message\n  if (said) throw new Error(said)\n\n  if (!response.data) {\n    /* The field name stays off the screen because the user cannot act on it; it goes to the console. */\n    console.error(`[figure-ui] the server returned no data for ${field}`)\n    throw new Error(i18next.t('figure.text.server-returned-no-data'))\n  }\n\n  return response.data[field] as T\n}\n\n\n/**\n * 목록에 필요한 필드만 가져온다 — `source` 는 무겁고 목록에서 쓰지 않는다.\n *\n * **`thumbnail` 도 여기 없다.** base64 문자열이라 목록 응답에 실으면 카탈로그를 열 때마다 그림\n * 전부가 다시 오고(표본 14개 227KB), data URL 은 브라우저가 캐시하지 못한다. 그림은 주소로\n * 부른다(`figure-thumbnail` 라우트). 대신 `thumbnailUpdatedAt` 을 받는다 — 그림이 있나 없나를\n * 그것으로 알고, 판을 가리는 값으로도 쓴다.\n */\nconst FIGURE_LIST_FIELDS = `\n  id\n  type\n  name\n  description\n  category\n  tags\n  state\n  version\n  score\n  triangles\n  groups\n  thumbnailUpdatedAt\n  updatedAt\n  updater { id name }\n`\n\n/**\n * 목록을 가져온다.\n *\n * 걸러 보기·정렬·쪽 나누기를 **그대로 넘긴다.** 화면이 `search`·`state` 같은 이름을 따로 만들어\n * filter 로 옮기던 것을 그만두었다 — 그 이름들은 격자(ox-grist)가 이미 컬럼 설정에서 만들어 주고,\n * 중간에 한 벌 더 두면 격자가 아는 조건과 서버에 가는 조건이 어긋난다.\n */\nexport async function fetchFigureList(params: {\n  page?: number\n  limit?: number\n  filters?: unknown[]\n  sortings?: { name: string; desc?: boolean }[]\n}): Promise<FigureListResult> {\n  const response = await client.query({\n    query: gql`\n      query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n        figures(filters: $filters, pagination: $pagination, sortings: $sortings) {\n          items { ${FIGURE_LIST_FIELDS} }\n          total\n        }\n      }\n    `,\n    variables: {\n      filters: params.filters ?? [],\n      pagination: { page: params.page ?? 1, limit: params.limit ?? 30 },\n      sortings: params.sortings?.length ? params.sortings : [{ name: 'updatedAt', desc: true }]\n    },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureListResult>(response, 'figures')\n}\n\n/** 저작면에 필요한 전부 — `source` 를 포함한다. */\nexport async function fetchFigure(id: string): Promise<Figure> {\n  const response = await client.query({\n    query: gql`\n      query ($id: String!) {\n        figure(id: $id) {\n          ${FIGURE_LIST_FIELDS}\n          source\n          properties\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<Figure>(response, 'figure')\n}\n\n/**\n * 이미 쓰이고 있는 타입 이름.\n *\n * `type` 은 만든 뒤에 고칠 수 없으므로 **만들기 전에** 알려 줘야 한다. 저장을 눌러\n * 거절당하고 나서 아는 것은 늦다.\n */\nexport async function fetchFigureTypeNames(): Promise<string[]> {\n  const response = await client.query({\n    query: gql`\n      query {\n        figureTypeNames\n      }\n    `,\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<string[] | null>(response, 'figureTypeNames') ?? []\n}\n\nexport interface SaveResult {\n  figure: Figure\n  /** 막지 않는 발견. 저장은 됐지만 화면이 보여 줘야 한다. */\n  violations: FigureFinding[]\n}\n\nexport async function createFigure(figure: NewFigure): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($figure: NewFigure!) {\n        createFigure(figure: $figure) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { figure }\n  })\n\n  return unwrap<SaveResult>(response, 'createFigure')\n}\n\nexport async function updateFigure(id: string, patch: FigurePatch): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($id: String!, $patch: FigurePatch!) {\n        updateFigure(id: $id, patch: $patch) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { id, patch }\n  })\n\n  return unwrap<SaveResult>(response, 'updateFigure')\n}\n\nexport async function deleteFigure(id: string): Promise<boolean> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($id: String!) {\n        deleteFigure(id: $id)\n      }\n    `,\n    variables: { id }\n  })\n\n  return unwrap<boolean>(response, 'deleteFigure')\n}\n\n/**\n * 발행한다 — 판 번호가 오르고, 그 순간이 판본으로 남는다.\n *\n * 이미 발행된 것을 다시 발행하면 서버가 거절한다. 고쳐서 다시 내려면 저장이 먼저이고, 저장은\n * 발행을 푼다(초안으로 돌아온다).\n */\nexport async function releaseFigure(id: string, comment?: string): Promise<Figure> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ReleaseFigure($id: String!, $comment: String) {\n        releaseFigure(id: $id, comment: $comment) {\n          id\n          version\n          state\n          updatedAt\n        }\n      }\n    `,\n    variables: { id, comment }\n  })\n\n  return unwrap<Figure>(response, 'releaseFigure')\n}\n\n/** 옛 판을 초안으로 되살린다. 정본·속성·그림이 돌아오고 이름·설명은 그대로다. */\nexport async function revertFigureVersion(id: string, version: number): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation RevertFigureVersion($id: String!, $version: Float!) {\n        revertFigureVersion(id: $id, version: $version) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { id, version }\n  })\n\n  return unwrap<SaveResult>(response, 'revertFigureVersion')\n}\n\n/**\n * 발행해도 되나 — **누르기 전에** 묻는다.\n *\n * 막는 것은 서버의 `releaseFigure` 이고 이것은 이유를 미리 보여 주기 위한 것이다. 허가증이\n * 아니므로 이 답이 통과라 해도 발행은 다시 판정을 받는다.\n */\nexport async function inspectFigure(id: string): Promise<FigureInspection> {\n  const response = await client.query({\n    query: gql`\n      query InspectFigure($id: String!) {\n        inspectFigure(id: $id) {\n          blocked\n          findings {\n            code\n            message\n            why\n            how\n            at\n            blocking\n          }\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureInspection>(response, 'inspectFigure')\n}\n\n/**\n * 편집 중인 원본의 발행 판정 — 저장하지 않은 것을 잰다.\n *\n * 발행 패널의 `inspectFigure` 는 저장된 원본을 재므로 고친 결과를 저장한 뒤에야 보여 준다. 편집하면서 막히는\n * 것을 보려면 편집 중인 원본을 보내야 한다. 판정은 서버의 같은 문(`inspectAnySource`)이 하고 문장도 같다 —\n * 화면이 제 판정을 따로 가지면 두 자리가 다른 말을 한다. `id` 가 있으면 서버가 그 행의 타입과 직전 발행판을 읽는다.\n */\nexport async function inspectFigureDraft(source: string, id?: string): Promise<FigureInspection> {\n  const response = await client.query({\n    query: gql`\n      query InspectFigureDraft($source: String!, $id: String) {\n        inspectFigureDraft(source: $source, id: $id) {\n          blocked\n          findings {\n            code\n            message\n            why\n            how\n            at\n            blocking\n          }\n        }\n      }\n    `,\n    variables: { source, id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureInspection>(response, 'inspectFigureDraft')\n}\n\n/** 발행된 판들 — 최근 것부터 열 개. */\n/**\n * 직전 발행판의 정본. 한 번도 발행 안 했으면 `undefined`.\n *\n * 저작 중에 「이 고침이 이미 놓인 것을 깨나」를 그 자리에서 보여 주려면 견줄 것이 필요하다. 저장\n * 전 초안은 서버가 모르므로 판정도 화면에서 한다 — 형식의 `contractChanges` 를 같이 쓴다.\n */\nexport async function fetchReleasedSource(id: string): Promise<string | undefined> {\n  const response = await client.query({\n    query: gql`\n      query FigureReleased($id: String!) {\n        figureReleased(id: $id) {\n          version\n          source\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<{ source?: string }>(response, 'figureReleased')?.source ?? undefined\n}\n\nexport async function fetchFigureVersions(id: string): Promise<FigureVersion[]> {\n  const response = await client.query({\n    query: gql`\n      query FigureVersions($id: String!) {\n        figureVersions(id: $id) {\n          version\n          comment\n          state\n          updatedAt\n          updater { id name }\n          score\n          triangles\n          groups\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureVersion[]>(response, 'figureVersions') ?? []\n}\n\n/** The recipes this domain sees (ADR-0095): released ones, its own and its parent's. Each is a figure-model V3Recipe. */\nexport async function fetchFigureRecipes(): Promise<Array<{ name: string; source: string }>> {\n  const response = await client.query({\n    query: gql`\n      query {\n        figureRecipes {\n          name\n          source\n        }\n      }\n    `,\n    fetchPolicy: 'network-only'\n  })\n  return unwrap<Array<{ name: string; source: string }> | null>(response, 'figureRecipes') ?? []\n}\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../client/graphql/index.ts"],"names":[],"mappings":"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","sourcesContent":["import gql from 'graphql-tag'\nimport { i18next } from '@operato/i18n'\nimport { client } from '@operato/graphql'\n\nimport type {\n  Figure,\n  FigureFinding,\n  FigureInspection,\n  FigureListResult,\n  FigurePatch,\n  FigureVersion,\n  NewFigure\n} from '../types.js'\n\n/**\n * 응답에서 값을 꺼낸다. **서버가 말한 사유를 그대로 올린다.**\n *\n * 전에는 `response.data.figures` 처럼 바로 꺼냈다. 서버가 오류를 돌려주면 `data` 가\n * 없으므로 `Cannot read properties of undefined (reading 'figures')` 가 났고, 화면에는\n * 그 문장이 그대로 떴다. 사용자는 자기가 무엇을 잘못했는지 알 수 없다 — 실제로 AI\n * 요청에서 그렇게 났다.\n *\n * 값이 `null` 인 것은 오류가 아니다. 지운 것을 물었을 때처럼 없는 것이 답인 경우가 있다.\n * 여기서 막는 것은 **`data` 자체가 없는 것**이다.\n */\nfunction unwrap<T>(response: { data?: Record<string, unknown>; errors?: readonly { message: string }[] }, field: string): T {\n  const said = response.errors?.[0]?.message\n  if (said) throw new Error(said)\n\n  if (!response.data) {\n    /* The field name stays off the screen because the user cannot act on it; it goes to the console. */\n    console.error(`[figure-ui] the server returned no data for ${field}`)\n    throw new Error(i18next.t('figure.text.server-returned-no-data'))\n  }\n\n  return response.data[field] as T\n}\n\n\n/**\n * 목록에 필요한 필드만 가져온다 — `source` 는 무겁고 목록에서 쓰지 않는다.\n *\n * **`thumbnail` 도 여기 없다.** base64 문자열이라 목록 응답에 실으면 카탈로그를 열 때마다 그림\n * 전부가 다시 오고(표본 14개 227KB), data URL 은 브라우저가 캐시하지 못한다. 그림은 주소로\n * 부른다(`figure-thumbnail` 라우트). 대신 `thumbnailUpdatedAt` 을 받는다 — 그림이 있나 없나를\n * 그것으로 알고, 판을 가리는 값으로도 쓴다.\n */\nconst FIGURE_LIST_FIELDS = `\n  id\n  type\n  name\n  description\n  category\n  tags\n  state\n  version\n  score\n  triangles\n  groups\n  thumbnailUpdatedAt\n  updatedAt\n  updater { id name }\n`\n\n/**\n * 목록을 가져온다.\n *\n * 걸러 보기·정렬·쪽 나누기를 **그대로 넘긴다.** 화면이 `search`·`state` 같은 이름을 따로 만들어\n * filter 로 옮기던 것을 그만두었다 — 그 이름들은 격자(ox-grist)가 이미 컬럼 설정에서 만들어 주고,\n * 중간에 한 벌 더 두면 격자가 아는 조건과 서버에 가는 조건이 어긋난다.\n */\nexport async function fetchFigureList(params: {\n  page?: number\n  limit?: number\n  filters?: unknown[]\n  sortings?: { name: string; desc?: boolean }[]\n}): Promise<FigureListResult> {\n  const response = await client.query({\n    query: gql`\n      query ($filters: [Filter!], $pagination: Pagination, $sortings: [Sorting!]) {\n        figures(filters: $filters, pagination: $pagination, sortings: $sortings) {\n          items { ${FIGURE_LIST_FIELDS} }\n          total\n        }\n      }\n    `,\n    variables: {\n      filters: params.filters ?? [],\n      pagination: { page: params.page ?? 1, limit: params.limit ?? 30 },\n      sortings: params.sortings?.length ? params.sortings : [{ name: 'updatedAt', desc: true }]\n    },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureListResult>(response, 'figures')\n}\n\n/** 저작면에 필요한 전부 — `source` 를 포함한다. */\nexport async function fetchFigure(id: string): Promise<Figure> {\n  const response = await client.query({\n    query: gql`\n      query ($id: String!) {\n        figure(id: $id) {\n          ${FIGURE_LIST_FIELDS}\n          source\n          properties\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<Figure>(response, 'figure')\n}\n\n/**\n * 이미 쓰이고 있는 타입 이름.\n *\n * `type` 은 만든 뒤에 고칠 수 없으므로 **만들기 전에** 알려 줘야 한다. 저장을 눌러\n * 거절당하고 나서 아는 것은 늦다.\n */\nexport async function fetchFigureTypeNames(): Promise<string[]> {\n  const response = await client.query({\n    query: gql`\n      query {\n        figureTypeNames\n      }\n    `,\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<string[] | null>(response, 'figureTypeNames') ?? []\n}\n\nexport interface SaveResult {\n  figure: Figure\n  /** 막지 않는 발견. 저장은 됐지만 화면이 보여 줘야 한다. */\n  violations: FigureFinding[]\n}\n\nexport async function createFigure(figure: NewFigure): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($figure: NewFigure!) {\n        createFigure(figure: $figure) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { figure }\n  })\n\n  return unwrap<SaveResult>(response, 'createFigure')\n}\n\nexport async function updateFigure(id: string, patch: FigurePatch): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($id: String!, $patch: FigurePatch!) {\n        updateFigure(id: $id, patch: $patch) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { id, patch }\n  })\n\n  return unwrap<SaveResult>(response, 'updateFigure')\n}\n\nexport async function deleteFigure(id: string): Promise<boolean> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($id: String!) {\n        deleteFigure(id: $id)\n      }\n    `,\n    variables: { id }\n  })\n\n  return unwrap<boolean>(response, 'deleteFigure')\n}\n\n/**\n * 발행한다 — 판 번호가 오르고, 그 순간이 판본으로 남는다.\n *\n * 이미 발행된 것을 다시 발행하면 서버가 거절한다. 고쳐서 다시 내려면 저장이 먼저이고, 저장은\n * 발행을 푼다(초안으로 돌아온다).\n */\nexport async function releaseFigure(id: string, comment?: string): Promise<Figure> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ReleaseFigure($id: String!, $comment: String) {\n        releaseFigure(id: $id, comment: $comment) {\n          id\n          version\n          state\n          updatedAt\n        }\n      }\n    `,\n    variables: { id, comment }\n  })\n\n  return unwrap<Figure>(response, 'releaseFigure')\n}\n\n/** 옛 판을 초안으로 되살린다. 정본·속성·그림이 돌아오고 이름·설명은 그대로다. */\nexport async function revertFigureVersion(id: string, version: number): Promise<SaveResult> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation RevertFigureVersion($id: String!, $version: Float!) {\n        revertFigureVersion(id: $id, version: $version) {\n          figure { ${FIGURE_LIST_FIELDS} source }\n          violations { code message at }\n        }\n      }\n    `,\n    variables: { id, version }\n  })\n\n  return unwrap<SaveResult>(response, 'revertFigureVersion')\n}\n\n/**\n * 발행해도 되나 — **누르기 전에** 묻는다.\n *\n * 막는 것은 서버의 `releaseFigure` 이고 이것은 이유를 미리 보여 주기 위한 것이다. 허가증이\n * 아니므로 이 답이 통과라 해도 발행은 다시 판정을 받는다.\n */\nexport async function inspectFigure(id: string): Promise<FigureInspection> {\n  const response = await client.query({\n    query: gql`\n      query InspectFigure($id: String!) {\n        inspectFigure(id: $id) {\n          blocked\n          findings {\n            code\n            message\n            why\n            how\n            at\n            blocking\n          }\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureInspection>(response, 'inspectFigure')\n}\n\n/**\n * 편집 중인 원본의 발행 판정 — 저장하지 않은 것을 잰다.\n *\n * 발행 패널의 `inspectFigure` 는 저장된 원본을 재므로 고친 결과를 저장한 뒤에야 보여 준다. 편집하면서 막히는\n * 것을 보려면 편집 중인 원본을 보내야 한다. 판정은 서버의 같은 문(`inspectAnySource`)이 하고 문장도 같다 —\n * 화면이 제 판정을 따로 가지면 두 자리가 다른 말을 한다. `id` 가 있으면 서버가 그 행의 타입과 직전 발행판을 읽는다.\n */\nexport async function inspectFigureDraft(source: string, id?: string): Promise<FigureInspection> {\n  const response = await client.query({\n    query: gql`\n      query InspectFigureDraft($source: String!, $id: String) {\n        inspectFigureDraft(source: $source, id: $id) {\n          blocked\n          findings {\n            code\n            message\n            why\n            how\n            at\n            blocking\n          }\n        }\n      }\n    `,\n    variables: { source, id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureInspection>(response, 'inspectFigureDraft')\n}\n\n/** 발행된 판들 — 최근 것부터 열 개. */\n/**\n * 직전 발행판의 정본. 한 번도 발행 안 했으면 `undefined`.\n *\n * 저작 중에 「이 고침이 이미 놓인 것을 깨나」를 그 자리에서 보여 주려면 견줄 것이 필요하다. 저장\n * 전 초안은 서버가 모르므로 판정도 화면에서 한다 — 형식의 `contractChanges` 를 같이 쓴다.\n */\nexport async function fetchReleasedSource(id: string): Promise<string | undefined> {\n  const response = await client.query({\n    query: gql`\n      query FigureReleased($id: String!) {\n        figureReleased(id: $id) {\n          version\n          source\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<{ source?: string }>(response, 'figureReleased')?.source ?? undefined\n}\n\nexport async function fetchFigureVersions(id: string): Promise<FigureVersion[]> {\n  const response = await client.query({\n    query: gql`\n      query FigureVersions($id: String!) {\n        figureVersions(id: $id) {\n          version\n          comment\n          state\n          updatedAt\n          updater { id name }\n          score\n          triangles\n          groups\n        }\n      }\n    `,\n    variables: { id },\n    fetchPolicy: 'network-only'\n  })\n\n  return unwrap<FigureVersion[]>(response, 'figureVersions') ?? []\n}\n\n/** The recipes this domain sees (ADR-0095): released ones, its own and its parent's. Each is a figure-model V3Recipe. */\nexport async function fetchFigureRecipes(): Promise<Array<{ name: string; source: string }>> {\n  const response = await client.query({\n    query: gql`\n      query {\n        figureRecipes {\n          name\n          source\n        }\n      }\n    `,\n    fetchPolicy: 'network-only'\n  })\n  return unwrap<Array<{ name: string; source: string }> | null>(response, 'figureRecipes') ?? []\n}\n\n/** A recipe row as the management screen reads it: whose it is and whether it is released. */\nexport interface FigureRecipeRow {\n  name: string\n  source: string\n  state: 'draft' | 'released'\n  updatedAt?: string\n  domain?: { id: string; subdomain?: string }\n}\n\n/** Every recipe this domain sees, drafts too (ADR-0095). */\nexport async function fetchFigureRecipeRows(): Promise<FigureRecipeRow[]> {\n  const response = await client.query({\n    query: gql`\n      query {\n        figureRecipes(all: true) {\n          name\n          source\n          state\n          updatedAt\n          domain {\n            id\n            subdomain\n          }\n        }\n      }\n    `,\n    fetchPolicy: 'network-only'\n  })\n  return unwrap<FigureRecipeRow[] | null>(response, 'figureRecipes') ?? []\n}\n\nexport async function saveFigureRecipe(source: string, state: 'draft' | 'released'): Promise<FigureRecipeRow> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($source: String!, $state: String) {\n        saveFigureRecipe(source: $source, state: $state) {\n          name\n          source\n          state\n        }\n      }\n    `,\n    variables: { source, state }\n  })\n  return unwrap<FigureRecipeRow>(response, 'saveFigureRecipe')\n}\n\nexport async function setFigureRecipeState(name: string, state: 'draft' | 'released'): Promise<void> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($name: String!, $state: String!) {\n        setFigureRecipeState(name: $name, state: $state) {\n          name\n        }\n      }\n    `,\n    variables: { name, state }\n  })\n  unwrap(response, 'setFigureRecipeState')\n}\n\nexport async function deleteFigureRecipe(name: string): Promise<void> {\n  const response = await client.mutate({\n    mutation: gql`\n      mutation ($name: String!) {\n        deleteFigureRecipe(name: $name)\n      }\n    `,\n    variables: { name }\n  })\n  unwrap(response, 'deleteFigureRecipe')\n}\n"]}

package/dist-client/modeller/figure-v3-parts.js

@@ -224,11 +224,10 @@ let FigureV3Parts = class FigureV3Parts extends localize(i18next)(LitElement) {
         border-radius: 8px;
         font-size: 0.75rem;
       }
+      /* The side pane is narrow (200 px, 160 under 860): the name above its field, not beside it. */
       div[recipe-form] label[field] {
         display: grid;
-        grid-template-columns: 1fr 5.5em;
-        align-items: center;
-        gap: 6px;
+        gap: 2px;
       }
       div[recipe-form] input[type='number'],
       div[recipe-form] select {
@@ -252,6 +251,7 @@ let FigureV3Parts = class FigureV3Parts extends localize(i18next)(LitElement) {
         gap: 6px;
       }
       div[recipe-actions] button {
+        white-space: nowrap;
         display: inline-flex;
         align-items: center;
         gap: 4px;