@things-factory/figure-ui 10.1.76 → 10.1.77

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

@@ -1,787 +0,0 @@
-import { __decorate, __metadata } from "tslib";
-import '@material/web/icon/icon.js';
-import { css, html, LitElement, nothing, svg } from 'lit';
-import { customElement, property, state } from 'lit/decorators.js';
-import { i18next, localize } from '@operato/i18n';
-import { ScrollbarStyles } from '@operato/styles';
-import { LIMITS, parseV3Asset, V3_PER_INSTANCE, v3CostOf } from '@hatiolab/figure-model';
-import { inspectFigureDraft } from '../graphql/index.js';
-import { gateFindingStyles, renderGateFinding } from './gate-findings.js';
-import { MEASURED } from './scene-budget.js';
-import { SidePanelStyles } from './side-panel-styles.js';
-import { budgetOf, CURVE_SIZE, curveLayout, GRADE_SCALE, shortNumber, v3ReportOf } from './v3-maturity.js';
-/** How long an edit settles before the server is asked again. One question per pause, not one per keystroke. */
-export const VERDICT_SETTLE_MS = 400;
-/**
- * 성숙도 — the modeller's verdict while editing.
- *
- * It shows, as the author edits: how many fit on one screen with the grade beside it and the budget that
- * decided the grade, the grade scale, six maturity axes as a radar and a list, the budget bars, the drawing cost,
- * the reuse trend, and the findings. An earlier tab kept only the count and the findings (user, 2026-09-24:
- * 「분석부분도 많이 부족하고, 왜 이렇게 너프되었는지」).
- *
- * ## What is computed where
- *
- * The numbers come from `v3-maturity.ts`, which reads the evaluated asset the way the V3 renderer draws it — the
- * screen calls and shows, it does not count. The count uses the same `capacityFrom` the catalogue cards use, so the
- * tab and the card cannot disagree.
- *
- * The findings do not come from here: they come from the server's release door (`inspectFigureDraft`), the same
- * door and the same sentences as the release panel. A second judgement on the screen would say something different
- * the first time either changed. The release judgement is the server's, so that section is the server's answer.
- *
- * ## The grade
- *
- * figure-model's `v3ScoreOf`, which the catalogue uses too: headroom against placing `LIMITS.screenInstances` of the
- * figure on one screen (chief architect, 2026-09-24) -- the screen's measured groups and its triangle target shared
- * per instance -- and the rule limits for independently moved parts and transparent materials, decided by the
- * tightest. The two budgets V3 has no field for are left out and the tab says so.
- */
-/** A per-instance share of the screen is not a whole number; what an instance may draw is the whole part of it. */
-const limitOf = (use) => Math.floor(use.limit).toLocaleString();
-let FigureV3Verdict = class FigureV3Verdict extends localize(i18next)(LitElement) {
-    constructor() {
-        super(...arguments);
-        /** Bodies in the asset, drawn or hidden. With none there is nothing to fit the space to, so the button is not offered. */
-        this.bodies = 0;
-        /** Whether the trend chart is open at its own size. */
-        this.expanded = false;
-        this.failure = '';
-        this.asking = false;
-        /** Answers can come back out of order; only the newest question's answer is shown. */
-        this.asked = 0;
-        this.fit = () => {
-            this.dispatchEvent(new CustomEvent('fit-base-to-parts', { bubbles: true, composed: true }));
-        };
-    }
-    static { this.styles = [
-        ScrollbarStyles,
-        SidePanelStyles,
-        gateFindingStyles,
-        css `
-      :host {
-        display: flex;
-        flex-direction: column;
-        overflow-y: auto;
-      }
-      section p {
-        margin: 0;
-      }
-
-      /* ── How many fit ───────────────────────────────────────────────
-         The value of low poly is how many can stand on one screen, so that answer leads. The grade says whether
-         the shape keeps inside its declared limits, so it is the small badge beside it. */
-      p[lead],
-      p[basis],
-      p[quiet] {
-        font-size: 0.74rem;
-        line-height: 1.55;
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      p[basis] em {
-        font-style: normal;
-        color: var(--md-sys-color-tertiary);
-      }
-      div[verdict] {
-        display: flex;
-        align-items: baseline;
-        gap: 6px;
-      }
-      span[capacity] {
-        font-size: 2.1rem;
-        font-weight: 800;
-        line-height: 1;
-        letter-spacing: -0.01em;
-        color: var(--md-sys-color-primary);
-      }
-      span[unit] {
-        font-size: 0.9rem;
-        font-weight: 600;
-        color: var(--md-sys-color-primary);
-      }
-      /* The badge says what it measures (headroom), so its number is not read as a score out of 100. */
-      span[grade] {
-        display: flex;
-        align-items: baseline;
-        gap: 5px;
-        margin-left: auto;
-        padding: 3px 10px;
-        font-size: 0.76rem;
-        font-weight: 700;
-        color: var(--md-sys-color-on-primary-container);
-        background-color: var(--md-sys-color-primary-container);
-        border-radius: 999em;
-      }
-      span[grade] small {
-        display: inline;
-        margin: 0;
-        font-size: 0.68rem;
-        font-weight: 500;
-        color: inherit;
-      }
-      /* C keeps within the limit. Red is for over it (D) only; red on a kept limit asks for a fix nothing needs. */
-      span[grade][tight] {
-        color: var(--md-sys-color-on-tertiary-container);
-        background-color: var(--md-sys-color-tertiary-container);
-      }
-      span[grade][over] {
-        color: var(--md-sys-color-on-error-container);
-        background-color: var(--md-sys-color-error-container);
-      }
-      p[because] {
-        font-size: 0.78rem;
-        line-height: 1.6;
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      p[because] strong {
-        color: var(--md-sys-color-on-surface);
-      }
-      /* The grade scale. Not folded away: it is compared against every time, not learned once. */
-      p[scale] {
-        display: flex;
-        flex-wrap: wrap;
-        gap: 2px 10px;
-        font-size: 0.7rem;
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      p[scale] b {
-        font-weight: 700;
-      }
-      p[scale] span[now] {
-        color: var(--md-sys-color-on-surface);
-      }
-      p[scale] span[now] b {
-        color: var(--md-sys-color-primary);
-      }
-
-      /* ── Maturity radar ─────────────────────────────────────────────
-         Only the measured axes are drawn; an unmeasured one drawn as a spoke reads as a dent, which is a zero. */
-      div[radar] {
-        display: flex;
-        justify-content: center;
-        padding: 2px 0 6px 0;
-        color: var(--md-sys-color-primary);
-      }
-      div[radar] svg {
-        width: 100%;
-        max-width: 240px;
-        height: auto;
-      }
-      div[radar] polygon[web] {
-        fill: none;
-        stroke: var(--md-sys-color-outline-variant);
-        stroke-width: 0.6;
-      }
-      div[radar] line[spoke] {
-        stroke: var(--md-sys-color-outline-variant);
-        stroke-width: 0.6;
-      }
-      div[radar] polygon[shape] {
-        fill: color-mix(in srgb, var(--md-sys-color-primary) 22%, transparent);
-        stroke: var(--md-sys-color-primary);
-        stroke-width: 1.4;
-        stroke-linejoin: round;
-      }
-      div[radar] circle[dot] {
-        fill: var(--md-sys-color-primary);
-      }
-      div[radar] text {
-        font-size: 5.2px;
-        fill: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      p[unmeasured] {
-        font-size: 0.7rem;
-        line-height: 1.5;
-        color: var(--md-sys-color-tertiary);
-      }
-
-      /* ── Axes and budgets ───────────────────────────────────────────
-         Not merged into one number: merged, 「what to fix」 disappears. */
-      ul[axes],
-      ul[budgets] {
-        margin: 0;
-        padding: 0;
-        list-style: none;
-        display: flex;
-        flex-direction: column;
-        gap: 7px;
-      }
-      ul[axes] li,
-      ul[budgets] li {
-        display: grid;
-        grid-template-columns: 1fr auto;
-        gap: 2px 8px;
-        font-size: 0.75rem;
-      }
-      ul[axes] li[blocked] {
-        opacity: 0.7;
-      }
-      ul[axes] em {
-        grid-column: 1 / -1;
-        font-style: normal;
-        font-size: 0.68rem;
-        line-height: 1.5;
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      ul[axes] li[blocked] em {
-        color: var(--md-sys-color-tertiary);
-      }
-      span[reading] {
-        font-family: var(--mono-font, monospace);
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      div[bar] {
-        grid-column: 1 / -1;
-        height: 4px;
-        background-color: var(--md-sys-color-surface-container-highest);
-        border-radius: 2px;
-        overflow: hidden;
-      }
-      div[bar] > i {
-        display: block;
-        height: 100%;
-        background-color: var(--md-sys-color-primary);
-      }
-      div[bar] > i[tight] {
-        background-color: var(--md-sys-color-error);
-      }
-
-      /* ── Drawing cost ─────────────────────────────────────────────── */
-      dl[metrics] {
-        margin: 0;
-        display: grid;
-        grid-template-columns: 1fr auto;
-        gap: 4px 8px;
-        font-size: 0.78rem;
-      }
-      dl[metrics] dt {
-        color: var(--md-sys-color-on-surface-variant, var(--md-sys-color-on-surface));
-      }
-      dl[metrics] dd {
-        margin: 0;
-        text-align: right;
-        font-family: var(--mono-font, monospace);
-      }
-
-      /* ── Trend ──────────────────────────────────────────────────────
-         The chart's natural size is 680px; in a 300px side its words are 4px. The side holds a button, the chart
-         opens at its own size. */
-      button[expand] {
-        justify-self: start;
-        padding: 4px 10px;
-        font: inherit;
-        font-size: 0.74rem;
-        color: var(--md-sys-color-on-surface);
-        background: none;
-        border: 1px solid var(--md-sys-color-outline-variant);
-        border-radius: 6px;
-        cursor: pointer;
-      }
-      button[expand]:hover {
-        background-color: var(--md-sys-color-surface-container);
-      }
-      div[sheet] {
-        position: fixed;
-        inset: 0;
-        z-index: 10;
-        display: flex;
-        align-items: center;
-        justify-content: center;
-        padding: 12px;
-        background-color: color-mix(in srgb, var(--md-sys-color-scrim, black) 32%, transparent);
-      }
-      div[sheet] > figure {
-        max-width: 100%;
-        max-height: 100%;
-        margin: 0;
-        padding: 12px;
-        overflow: auto;
-        color: var(--md-sys-color-on-surface);
-        background-color: var(--md-sys-color-surface-container-lowest);
-        border-radius: 6px;
-        box-shadow: 0 8px 32px color-mix(in srgb, var(--md-sys-color-shadow, black) 28%, transparent);
-      }
-      div[sheet] svg {
-        display: block;
-        /* Not shrunk below its natural size — a narrow window scrolls instead. */
-        min-width: 680px;
-        font-family: inherit;
-        font-size: 11px;
-        fill: currentColor;
-      }
-      div[sheet] svg [grid] {
-        stroke: currentColor;
-        stroke-opacity: 0.12;
-      }
-      div[sheet] svg [muted] {
-        opacity: 0.55;
-      }
-      div[sheet] svg path[series] {
-        fill: none;
-        stroke-width: 2;
-        stroke-linejoin: round;
-      }
-      div[sheet] svg [series='triangles'] {
-        stroke: var(--md-sys-color-error);
-        fill: var(--md-sys-color-error);
-      }
-      div[sheet] svg [series='drawCalls'] {
-        stroke: var(--md-sys-color-tertiary);
-        fill: var(--md-sys-color-tertiary);
-      }
-      div[sheet] svg [series='geometries'] {
-        stroke: var(--md-sys-color-primary);
-        fill: var(--md-sys-color-primary);
-      }
-      div[sheet] svg [series='materials'] {
-        stroke: var(--md-sys-color-secondary);
-        fill: var(--md-sys-color-secondary);
-      }
-      div[sheet] svg path[series],
-      div[sheet] svg line[series] {
-        fill: none;
-      }
-      /* A legend value is written in its line's colour, not outlined in it. */
-      div[sheet] svg text[series] {
-        stroke: none;
-      }
-      div[sheet] figcaption {
-        display: flex;
-        align-items: center;
-        justify-content: flex-end;
-      }
-      div[sheet] button[close] {
-        padding: 5px 14px;
-        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;
-      }
-
-      /* ── Release verdict ───────────────────────────────────────────── */
-      p[clear] {
-        color: var(--md-sys-color-primary);
-        font-weight: 600;
-      }
-      p[failed] {
-        color: var(--md-sys-color-error);
-      }
-      button[fit] {
-        align-self: flex-start;
-        margin-top: 4px;
-        padding: 4px 10px;
-        font: inherit;
-        color: var(--md-sys-color-on-secondary-container);
-        background: var(--md-sys-color-secondary-container);
-        border: none;
-        border-radius: 999em;
-        cursor: pointer;
-      }
-    `
-    ]; }
-    disconnectedCallback() {
-        clearTimeout(this.timer);
-        super.disconnectedCallback();
-    }
-    updated(changes) {
-        if (changes.has('source'))
-            this.measure();
-        if (changes.has('source') || changes.has('figureId') || changes.has('figureType'))
-            this.schedule();
-    }
-    measure() {
-        let report;
-        let bodies = 0;
-        try {
-            const asset = this.source ? parseV3Asset(this.source) : undefined;
-            const cost = asset ? v3CostOf(asset) : undefined;
-            bodies = cost ? cost.groups + cost.hidden : 0;
-            report = asset ? v3ReportOf(asset) : undefined;
-        }
-        catch {
-            /* A source the format refuses has no report; the server's finding below says why. */
-            report = undefined;
-        }
-        this.report = report;
-        this.bodies = bodies;
-        if (!report)
-            this.expanded = false;
-        this.dispatchEvent(new CustomEvent('capacity-changed', { detail: { instances: report?.capacity.instances, budget: budgetOf(report) } }));
-    }
-    schedule() {
-        clearTimeout(this.timer);
-        if (!this.source) {
-            this.inspection = undefined;
-            return;
-        }
-        this.timer = setTimeout(() => this.ask(), VERDICT_SETTLE_MS);
-    }
-    async ask() {
-        const question = ++this.asked;
-        const source = this.source;
-        this.asking = true;
-        try {
-            const inspection = await inspectFigureDraft(source, this.figureId);
-            if (question !== this.asked)
-                return;
-            this.inspection = inspection;
-            this.failure = '';
-        }
-        catch (error) {
-            if (question !== this.asked)
-                return;
-            /* The server's reason as it gave it — the screen does not make one up. The last answer is dropped with it. */
-            this.inspection = undefined;
-            this.failure = error instanceof Error ? error.message : String(error);
-        }
-        finally {
-            if (question === this.asked)
-                this.asking = false;
-        }
-    }
-    render() {
-        /*
-          With nothing drawn the report is guidance, not a verdict: the sections below have meaning only over parts,
-          and a number drawn from nothing reads as zero, which reads as bad. The release verdict stays — a new figure
-          is already refused for its undeclared space, and the way out is offered there.
-        */
-        const report = this.report;
-        if (!report) {
-            return html `
-        <section>
-          <h3>${i18next.t('figure.label.maturity')}</h3>
-          <p quiet>${i18next.t('figure.text.report-appears-when-you-add-a-part')}</p>
-        </section>
-        ${this.renderGate()}
-      `;
-        }
-        return html `
-      ${this.renderVerdict(report)} ${this.renderAxes(report)} ${this.renderBudgets(report)} ${this.renderMetrics(report)}
-      ${this.renderCurve()} ${this.renderGate()} ${this.renderSheet(report)}
-    `;
-    }
-    /**
-     * The head — how many fit, with the grade beside it, the budget that decided it, the scale, and the basis.
-     *
-     * The count's denominator is measured (2026-09-18, Apple M5) and says so with the machine and the date; the
-     * triangle side is still the design document's target and says that.
-     */
-    renderVerdict(report) {
-        const { capacity, score } = report;
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.maturity')}</h3>
-        <p lead>${i18next.t('figure.label.axis-scale')} — ${i18next.t('figure.text.how-many-fit')}</p>
-        <div verdict>
-          <span capacity>${capacity.instances.toLocaleString()}</span>
-          <span unit>${i18next.t('figure.text.instances-unit')}</span>
-          <span
-            grade
-            ?tight=${score.grade === 'C'}
-            ?over=${score.grade === 'D'}
-            title=${i18next.t('figure.text.grade-explained', { target: LIMITS.screenInstances })}
-          >
-            ${score.grade}
-            <small>${i18next.t('figure.text.headroom-percent', { percent: score.score })}</small>
-          </span>
-        </div>
-        <p because>
-          ${i18next.t('figure.text.grade-decided-by')}
-          <strong>${i18next.t('figure.label.budget-' + score.tightest.key)}</strong>
-          — ${score.tightest.used.toLocaleString()} / ${limitOf(score.tightest)} (${Math.round(score.tightest.ratio * 100)}%)
-        </p>
-        <p basis>
-          ${i18next.t('figure.text.grade-target', {
-            target: LIMITS.screenInstances,
-            groups: Math.floor(V3_PER_INSTANCE.groups),
-            triangles: Math.floor(V3_PER_INSTANCE.triangles).toLocaleString()
-        })}
-        </p>
-        ${this.renderGradeScale(score.grade)}
-        <p basis>
-          ${i18next.t('figure.text.bound-by-' + capacity.bound, {
-            per: capacity.per.toLocaleString(),
-            budget: capacity.budget.toLocaleString()
-        })}
-          <em>
-            ${capacity.bound === 'groups'
-            ? i18next.t('figure.text.budget-measured-on', { gpu: MEASURED.gpu, on: MEASURED.on })
-            : i18next.t('figure.text.budget-not-measured-yet')}
-          </em>
-        </p>
-      </section>
-    `;
-    }
-    /** A · B · C · D and where this figure stands, drawn from the bounds the grade is computed with. */
-    renderGradeScale(now) {
-        const bounds = [...GRADE_SCALE.map(([grade, bound]) => [grade, `≤ ${bound * 100}%`]), ['D', '> 100%']];
-        return html `
-      <p scale>
-        <span>${i18next.t('figure.text.grade-scale-lead')}</span>
-        ${bounds.map(([grade, bound]) => html `<span ?now=${grade === now}><b>${grade}</b> ${bound}</span>`)}
-      </p>
-    `;
-    }
-    /**
-     * Maturity by axis — a radar of the measured axes, a line naming the unmeasured ones, and the list.
-     *
-     * Scale is left out of the list: it leads the tab, and the same number twice reads as two different things.
-     */
-    renderAxes(report) {
-        const measured = report.axes.filter(axis => axis.ratio !== undefined);
-        const unmeasured = report.axes.filter(axis => axis.ratio === undefined);
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.by-axis')}</h3>
-        <div radar>${this.renderRadar(measured)}</div>
-        ${unmeasured.length
-            ? html `<p unmeasured>
-              ${i18next.t('figure.text.axes-not-measurable-yet', {
-                axes: unmeasured.map(axis => i18next.t('figure.label.axis-' + axis.key)).join(' · ')
-            })}
-            </p>`
-            : nothing}
-        <ul axes>
-          ${report.axes.filter(axis => axis.key !== 'scale').map(axis => this.renderAxis(axis))}
-        </ul>
-      </section>
-    `;
-    }
-    /** The radar: rings at a third, two thirds and full, short names so the left edge is not cut. */
-    renderRadar(axes) {
-        const cx = 60;
-        const cy = 46;
-        const r = 28;
-        const at = (index, ratio) => {
-            const angle = -Math.PI / 2 + (index * 2 * Math.PI) / axes.length;
-            return [cx + r * ratio * Math.cos(angle), cy + r * ratio * Math.sin(angle)];
-        };
-        const clamp = (ratio) => Math.max(0.04, Math.min(1, ratio ?? 0));
-        const points = axes.map((axis, index) => at(index, clamp(axis.ratio)).map(n => n.toFixed(1)).join(',')).join(' ');
-        return svg `
-      <svg viewBox="0 0 120 96" aria-hidden="true">
-        ${[0.33, 0.66, 1].map(ring => svg `<polygon web points=${axes.map((_, i) => at(i, ring).map(n => n.toFixed(1)).join(',')).join(' ')}></polygon>`)}
-        ${axes.map((_, index) => {
-            const [x, y] = at(index, 1);
-            return svg `<line spoke x1=${cx} y1=${cy} x2=${x.toFixed(1)} y2=${y.toFixed(1)}></line>`;
-        })}
-        <polygon shape points=${points}></polygon>
-        ${axes.map((axis, index) => {
-            const [x, y] = at(index, clamp(axis.ratio));
-            return svg `<circle dot cx=${x.toFixed(1)} cy=${y.toFixed(1)} r="1.4"></circle>`;
-        })}
-        ${axes.map((axis, index) => {
-            const [x, y] = at(index, 1.28);
-            const anchor = x < cx - 3 ? 'end' : x > cx + 3 ? 'start' : 'middle';
-            return svg `<text x=${x.toFixed(1)} y=${(y + 1.8).toFixed(1)} text-anchor=${anchor}>${i18next.t('figure.label.axis-' + axis.key + '-short')}</text>`;
-        })}
-      </svg>
-    `;
-    }
-    renderAxis(axis) {
-        const name = i18next.t('figure.label.axis-' + axis.key);
-        if (axis.blocked) {
-            return html `
-        <li blocked>
-          <span>${name}</span>
-          <span reading>${i18next.t('figure.text.not-measurable-yet')}</span>
-          <em>${i18next.t(axis.blocked)}</em>
-        </li>
-      `;
-        }
-        const ratio = Math.max(0, Math.min(1, axis.ratio ?? 0));
-        return html `
-      <li>
-        <span>${name}</span>
-        <span reading>${axis.readingKey ? i18next.t(axis.readingKey) : (axis.reading ?? '')}</span>
-        <div bar><i style="width:${Math.round(ratio * 100)}%"></i></div>
-        ${axis.because ? html `<em>${i18next.t(axis.because)}</em>` : nothing}
-      </li>
-    `;
-    }
-    /** The budget bars. The one closest to its limit is coloured — it decided the grade. */
-    renderBudgets(report) {
-        const { score } = report;
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.budgets')}</h3>
-        <ul budgets>
-          ${score.budgets.map(use => html `
-              <li>
-                <span>${i18next.t('figure.label.budget-' + use.key)}</span>
-                <span>${use.used.toLocaleString()} / ${limitOf(use)}</span>
-                <div bar><i ?tight=${use.key === score.tightest.key} style="width:${Math.round(Math.min(1, use.ratio) * 100)}%"></i></div>
-              </li>
-            `)}
-        </ul>
-        <p quiet>${i18next.t('figure.text.budgets-not-in-v3')}</p>
-      </section>
-    `;
-    }
-    renderMetrics(report) {
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.weight')}</h3>
-        <dl metrics>
-          <dt>${i18next.t('figure.label.triangles')}</dt>
-          <dd>${report.cost.triangles.toLocaleString()}</dd>
-          <dt>${i18next.t('figure.label.distinct-shapes')}</dt>
-          <dd>${report.distinctShapes}</dd>
-          <dt>${i18next.t('figure.label.distinct-materials')}</dt>
-          <dd>${report.distinctMaterials}</dd>
-        </dl>
-      </section>
-    `;
-    }
-    renderCurve() {
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.reuse-trend')}</h3>
-        <button expand @click=${() => (this.expanded = true)}>${i18next.t('figure.button.see-the-trend-chart')}</button>
-      </section>
-    `;
-    }
-    /**
-     * The trend at its own size: both axes logarithmic, the growing lines against the flat ones, and a
-     * legend with each line's value at the last count.
-     */
-    renderSheet(report) {
-        if (!this.expanded)
-            return nothing;
-        const layout = curveLayout(report.curve);
-        if (!layout)
-            return nothing;
-        const { width, height, pad } = CURVE_SIZE;
-        const plotW = width - pad.left - pad.right;
-        const plotH = height - pad.top - pad.bottom;
-        const last = report.curve[report.curve.length - 1];
-        const label = (key) => i18next.t({
-            triangles: 'figure.label.triangles',
-            drawCalls: 'figure.label.draw-calls',
-            geometries: 'figure.label.vertex-buffers',
-            materials: 'figure.label.distinct-materials'
-        }[key]);
-        return html `
-      <div sheet @click=${() => (this.expanded = false)}>
-        <figure @click=${(e) => e.stopPropagation()}>
-          ${svg `
-            <svg viewBox="0 0 ${width} ${height}" width=${width} height=${height} role="img">
-              <text x=${pad.left} y="22" font-size="13" font-weight="600">${i18next.t('figure.text.trend-chart-title')}</text>
-              <text x=${pad.left} y="38" muted>${i18next.t('figure.text.trend-chart-lead')}</text>
-              ${layout.yTicks.map(tick => svg `
-                  <line grid x1=${pad.left} y1=${tick.y.toFixed(1)} x2=${(pad.left + plotW).toFixed(1)} y2=${tick.y.toFixed(1)}></line>
-                  <text muted x=${pad.left - 8} y=${(tick.y + 3.5).toFixed(1)} text-anchor="end">${tick.label}</text>
-                `)}
-              ${layout.xTicks.map(tick => svg `
-                  <line grid x1=${tick.x.toFixed(1)} y1=${pad.top} x2=${tick.x.toFixed(1)} y2=${(pad.top + plotH).toFixed(1)}></line>
-                  <text muted x=${tick.x.toFixed(1)} y=${(pad.top + plotH + 16).toFixed(1)} text-anchor="middle">${tick.label}</text>
-                `)}
-              <text muted x=${(pad.left + plotW / 2).toFixed(1)} y=${height - 8} text-anchor="middle">${i18next.t('figure.label.instance-count')}</text>
-              ${layout.lines.map(line => svg `<path series=${line.key} d=${line.d} stroke-dasharray=${line.dashed ? '3 7' : 'none'}></path>`)}
-              <g transform="translate(${width - pad.right + 14}, ${pad.top - 6})">
-                <text x="0" y="0" font-weight="600">${i18next.t('figure.text.trend-at-count', { n: shortNumber(last.instances) })}</text>
-                ${layout.lines.map((line, i) => {
-            const y = 24 + i * 34;
-            return svg `
-                    <line series=${line.key} x1="0" y1=${y - 4} x2="18" y2=${y - 4} stroke-width="2" stroke-dasharray=${line.dashed ? '3 7' : 'none'}></line>
-                    <text x="24" y=${y}>${label(line.key)}</text>
-                    <text series=${line.key} x="24" y=${y + 12} font-weight="600">
-                      ${line.last.toLocaleString()}${line.flat ? ` · ${i18next.t('figure.text.trend-stays')}` : ''}
-                    </text>
-                  `;
-        })}
-                ${layout.overlap !== undefined
-            ? svg `<text muted x="0" y=${24 + layout.lines.length * 34 + 6}>${i18next.t('figure.text.trend-flat-lines-overlap', { value: layout.overlap.toLocaleString() })}</text>`
-            : nothing}
-              </g>
-            </svg>
-          `}
-          <figcaption>
-            <button close @click=${() => (this.expanded = false)}>${i18next.t('figure.button.close')}</button>
-          </figcaption>
-        </figure>
-      </div>
-    `;
-    }
-    renderGate() {
-        const findings = this.inspection?.findings ?? [];
-        const blocking = findings.filter(finding => finding.blocking);
-        const advisory = findings.filter(finding => !finding.blocking);
-        return html `
-      <section>
-        <h3>${i18next.t('figure.label.release-verdict')}</h3>
-        ${this.failure
-            ? html `<p failed role="alert">${i18next.t('figure.text.verdict-not-received', { reason: this.failure })}</p>`
-            : !this.inspection
-                ? html `<p quiet>${i18next.t(this.asking ? 'figure.text.verdict-asking' : 'figure.text.verdict-waiting')}</p>`
-                : blocking.length
-                    ? html `<p>${i18next.t('figure.text.cannot-release-now')}</p>`
-                    : html `<p clear>${i18next.t('figure.text.nothing-blocks-release')}</p>`}
-        ${blocking.length
-            ? html `<ul gate>
-              <li head>${i18next.t('figure.text.must-fix-to-release')}</li>
-              ${blocking.map(finding => renderGateFinding(finding, true, this.actionsFor(finding.code)))}
-            </ul>`
-            : nothing}
-        ${advisory.length
-            ? html `<ul gate>
-              <li head quiet>${i18next.t('figure.text.does-not-block')}</li>
-              ${advisory.map(finding => renderGateFinding(finding, false))}
-            </ul>`
-            : nothing}
-      </section>
-    `;
-    }
-    /** The same way out the release panel offers for the same two findings — declare the space from the parts. */
-    actionsFor(code) {
-        if (code !== 'part-outside-occupancy' && code !== 'occupancy-undeclared')
-            return nothing;
-        /* A new figure with no parts is refused as undeclared too, but fitting needs parts to measure (seen 2026-09-24). */
-        if (!this.bodies)
-            return nothing;
-        return html `<button fit @click=${this.fit}>${i18next.t('figure.button.fit-base-to-parts')}</button>`;
-    }
-};
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], FigureV3Verdict.prototype, "source", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], FigureV3Verdict.prototype, "figureId", void 0);
-__decorate([
-    property({ type: String }),
-    __metadata("design:type", String)
-], FigureV3Verdict.prototype, "figureType", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "report", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "bodies", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "expanded", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "inspection", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "failure", void 0);
-__decorate([
-    state(),
-    __metadata("design:type", Object)
-], FigureV3Verdict.prototype, "asking", void 0);
-FigureV3Verdict = __decorate([
-    customElement('figure-v3-verdict')
-], FigureV3Verdict);
-export { FigureV3Verdict };
-//# sourceMappingURL=figure-v3-verdict.js.map