@things-factory/figure-ui 10.1.223 → 10.1.224

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

@@ -7,14 +7,26 @@ declare const FigureCapabilityPanel_base: (new (...args: any[]) => LitElement) &
  * so the list is the only way to find one; choosing a row selects its part, where the place is edited. Whether the
  * figure is the look of an item a holder carries is said here too (ADR-0155 amendment 2): a tag, apart from the ladder,
  * since an item may hold things as well.
+ *
+ * Below the ladder, the products' capabilities this modeller has descriptors for (ADR-0167 9, 12): each put on or off,
+ * what it still needs, and its settings as its descriptor draws them -- parts picked (the part chosen here by one
+ * button), an input and a value per fixed key, never a row added or taken away -- with what its check says.
  */
 export declare class FigureCapabilityPanel extends FigureCapabilityPanel_base {
     static styles: import("lit").CSSResult[];
+    private unlisten?;
+    connectedCallback(): void;
+    disconnectedCallback(): void;
     asset?: FigureAsset;
     /** The selected part, whose places are marked. */
     selected: string;
     locked: boolean;
     render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    /** The products' capabilities: those this modeller knows, each on or off with its settings, and those it does not know. */
+    private renderConsumers;
+    /** A capability's settings as its descriptor draws them, and what its check says of them. */
+    private renderSettings;
+    private setConsumer;
     private setRung;
     private setItem;
     private pick;

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

@@ -7,12 +7,18 @@ import { figureBindingsOf } from '@hatiolab/figure-model';
 import { RUNGS, rungOf } from '@things-factory/figure-viewer/dist-client/capability-rung.js';
 import { SidePanelStyles } from '@things-factory/figure-viewer/dist-client/side-panel-styles.js';
 import { placeTerms } from '@things-factory/figure-viewer/dist-client/detail-facts.js';
+import { onFigureCapabilitiesChanged } from '@hatiolab/things-scene';
+import { consumerDescriptors, inputTableAt, namesWith, needsMissing, partsAt, settingsIssues, settingsOf, unknownConsumerNames, withInputTable, withParts } from './consumer-capabilities.js';
 /**
  * 자리·능력 — what the figure does on a board: the ladder from drawing only, to
  * holding things, to passing them on, and every place things are held, whatever part it is on. A place is not drawn,
  * so the list is the only way to find one; choosing a row selects its part, where the place is edited. Whether the
  * figure is the look of an item a holder carries is said here too (ADR-0155 amendment 2): a tag, apart from the ladder,
  * since an item may hold things as well.
+ *
+ * Below the ladder, the products' capabilities this modeller has descriptors for (ADR-0167 9, 12): each put on or off,
+ * what it still needs, and its settings as its descriptor draws them -- parts picked (the part chosen here by one
+ * button), an input and a value per fixed key, never a row added or taken away -- with what its check says.
  */
 let FigureCapabilityPanel = class FigureCapabilityPanel extends localize(i18next)(LitElement) {
     constructor() {
@@ -73,7 +79,37 @@ let FigureCapabilityPanel = class FigureCapabilityPanel extends localize(i18next
       font-size: var(--ui-t-small, 11.5px);
       color: var(--md-sys-color-on-surface-variant);
     }
+    div[chips] {
+      display: flex;
+      flex-wrap: wrap;
+      gap: 4px 10px;
+      align-items: center;
+    }
+    div[chips] label {
+      display: inline-flex;
+      gap: 4px;
+      align-items: center;
+    }
+    div[table] {
+      display: grid;
+      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
+      gap: 4px 6px;
+      align-items: center;
+    }
+    p[warn] {
+      margin: 0;
+      color: var(--md-sys-color-error);
+    }
   `]; }
+    connectedCallback() {
+        super.connectedCallback();
+        /* A product's descriptors may be registered after the panel stands. */
+        this.unlisten = onFigureCapabilitiesChanged(() => this.requestUpdate());
+    }
+    disconnectedCallback() {
+        super.disconnectedCallback();
+        this.unlisten?.();
+    }
     render() {
         const asset = this.asset;
         if (!asset)
@@ -93,6 +129,7 @@ let FigureCapabilityPanel = class FigureCapabilityPanel extends localize(i18next
       ${rung === null ? html `<p hint>${i18next.t('figure.text.capability-hand-written')}</p>` : nothing}
       ${names.length ? html `<code>${names.join(' · ')}</code>` : nothing}
       </section>
+      ${this.renderConsumers(asset)}
       <section>
       <h3>${i18next.t('figure.label.places')}</h3>
       ${places.length
@@ -118,8 +155,93 @@ let FigureCapabilityPanel = class FigureCapabilityPanel extends localize(i18next
       </section>
     `;
     }
+    /** The products' capabilities: those this modeller knows, each on or off with its settings, and those it does not know. */
+    renderConsumers(asset) {
+        const known = consumerDescriptors();
+        const unknown = unknownConsumerNames(asset);
+        if (!known.length && !unknown.length)
+            return nothing;
+        const names = asset.document.capabilities.names ?? [];
+        return html `<section>
+      <h3>${i18next.t('figure.label.product-capabilities')}</h3>
+      ${known.map(d => {
+            const on = names.includes(d.name);
+            const missing = needsMissing(d, asset);
+            return html `<label rung ?on=${on}>
+            <input type="checkbox" .checked=${live(on)} ?disabled=${this.locked || (!on && missing.length > 0)} @change=${(e) => this.setConsumer(asset, d.name, e.target.checked)} />
+            <span>
+              <strong>${d.label}</strong>
+              <em>${d.note}</em>
+              <code>${d.name} · ${d.version}</code>
+            </span>
+          </label>
+          ${missing.length ? html `<p hint>${i18next.t('figure.text.product-capability-needs', { needs: missing.map(m => (m === 'item' ? i18next.t('figure.label.is-item') : m)).join(', ') })}</p>` : nothing}
+          ${on ? this.renderSettings(asset, d) : nothing}`;
+        })}
+      ${unknown.map(name => html `<p hint>
+          ${i18next.t('figure.text.product-capability-unknown', { name })}
+          <button quiet ?disabled=${this.locked} @click=${() => this.setConsumer(asset, name, false)}>${i18next.t('figure.button.product-capability-remove')}</button>
+        </p>`)}
+    </section>`;
+    }
+    /** A capability's settings as its descriptor draws them, and what its check says of them. */
+    renderSettings(asset, d) {
+        const settings = settingsOf(asset, d.name);
+        const write = (next) => this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capability-settings', name: d.name, settings: Object.keys(next).length ? next : null } }, bubbles: true, composed: true }));
+        const parts = [...new Set(asset.appearance.map(a => a.target))];
+        const inputs = asset.document.model.inputs.filter(i => i.role === 'state');
+        const issues = settingsIssues(d, asset);
+        return html `<div form>
+        ${(d.settings ?? []).map((setting) => {
+            if (setting.kind === 'parts') {
+                const chosen = partsAt(settings, setting.key);
+                const toggle = (part, on) => write(withParts(settings, setting.key, on ? [...chosen, part] : chosen.filter(p => p !== part)));
+                return html `<span>${setting.label}</span>
+              <div chips>
+                ${parts.map(p => html `<label><input type="checkbox" .checked=${live(chosen.includes(p))} ?disabled=${this.locked} @change=${(e) => toggle(p, e.target.checked)} />${p}</label>`)}
+                ${this.selected && parts.includes(this.selected) && !chosen.includes(this.selected)
+                    ? html `<button quiet ?disabled=${this.locked} @click=${() => toggle(this.selected, true)}>${i18next.t('figure.button.data-add-selected-part', { part: this.selected })}</button>`
+                    : nothing}
+              </div>`;
+            }
+            const table = inputTableAt(settings, setting);
+            const input = inputs.find(i => i.id === table.input);
+            return html `<span>${setting.label}</span>
+            <select ?disabled=${this.locked} @change=${(e) => write(withInputTable(settings, setting, e.target.value || undefined, table.values))}>
+              <option value="" ?selected=${!table.input}>${i18next.t('figure.label.data-none')}</option>
+              ${inputs.map(i => html `<option value=${i.id} ?selected=${i.id === table.input}>${asset.stateInputs?.[i.id]?.label ?? i.id}${i.unit ? ` (${i.unit} ${i.min ?? ''}~${i.max ?? ''})` : ''}</option>`)}
+            </select>
+            ${table.input
+                ? html `<span></span>
+                  <div table>
+                    ${setting.keys.map(key => html `<span>${key}</span>
+                        <input
+                          type="number"
+                          step="any"
+                          min=${input?.min ?? ''}
+                          max=${input?.max ?? ''}
+                          .value=${String(table.values[key])}
+                          ?disabled=${this.locked}
+                          @change=${(e) => {
+                    const n = e.target.valueAsNumber;
+                    if (!Number.isFinite(n))
+                        return this.requestUpdate();
+                    write(withInputTable(settings, setting, table.input, { ...table.values, [key]: n }));
+                }}
+                        />`)}
+                  </div>`
+                : nothing}`;
+        })}
+      </div>
+      ${issues.map(reason => html `<p warn>${reason}</p>`)}`;
+    }
+    setConsumer(asset, name, on) {
+        this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: namesWith(asset, name, on) } }, bubbles: true, composed: true }));
+    }
     setRung(which) {
-        this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which]] } }, bubbles: true, composed: true }));
+        /* The ladder sets the shared names; a product's capabilities stay as they are. */
+        const consumers = (this.asset?.document.capabilities.names ?? []).filter(n => n.includes('.'));
+        this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which], ...consumers] } }, bubbles: true, composed: true }));
     }
     setItem(item) {
         this.dispatchEvent(new CustomEvent('command', { detail: { action: { kind: 'set-item', item } }, bubbles: true, composed: true }));

package/dist-client/modeller/figure-capability-panel.js.map

@@ -1 +1 @@
-{"version":3,"file":"figure-capability-panel.js","sourceRoot":"","sources":["../../client/modeller/figure-capability-panel.ts"],"names":[],"mappings":"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","sourcesContent":["import { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { figureBindingsOf } from '@hatiolab/figure-model'\nimport type { FigureAsset } from '@hatiolab/figure-model'\nimport { RUNGS, rungOf, type Rung } from '@things-factory/figure-viewer/dist-client/capability-rung.js'\nimport { SidePanelStyles } from '@things-factory/figure-viewer/dist-client/side-panel-styles.js'\nimport { placeTerms } from '@things-factory/figure-viewer/dist-client/detail-facts.js'\n\n/**\n * 자리·능력 — what the figure does on a board: the ladder from drawing only, to\n * holding things, to passing them on, and every place things are held, whatever part it is on. A place is not drawn,\n * so the list is the only way to find one; choosing a row selects its part, where the place is edited. Whether the\n * figure is the look of an item a holder carries is said here too (ADR-0155 amendment 2): a tag, apart from the ladder,\n * since an item may hold things as well.\n */\n@customElement('figure-capability-panel')\nexport class FigureCapabilityPanel extends localize(i18next)(LitElement) {\n  static styles = [SidePanelStyles, css`\n    :host {\n      display: block;\n    }\n    label[rung],\n    label[item] {\n      display: flex;\n      gap: 8px;\n      align-items: flex-start;\n      padding: 8px;\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n      cursor: pointer;\n    }\n    label[rung][on],\n    label[item][on] {\n      border-color: var(--md-sys-color-primary);\n      background: var(--md-sys-color-secondary-container);\n      color: var(--md-sys-color-on-secondary-container);\n    }\n    label[rung] span,\n    label[item] span {\n      display: grid;\n      gap: 2px;\n    }\n    label[rung] em,\n    label[item] em,\n    p[hint],\n    small {\n      font-style: normal;\n      margin: 0;\n      color: var(--md-sys-color-on-surface-variant);\n    }\n    button[place] {\n      display: grid;\n      gap: 2px;\n      text-align: left;\n      padding: 6px 8px;\n      font: inherit;\n      color: inherit;\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n      background: none;\n      cursor: pointer;\n    }\n    button[place][on] {\n      border-color: var(--md-sys-color-primary);\n    }\n    code {\n      font-size: var(--ui-t-small, 11.5px);\n      color: var(--md-sys-color-on-surface-variant);\n    }\n  `]\n\n  @property({ attribute: false }) asset?: FigureAsset\n  /** The selected part, whose places are marked. */\n  @property() selected = ''\n  @property({ type: Boolean }) locked = false\n\n  render() {\n    const asset = this.asset\n    if (!asset) return nothing\n    const names = asset.document.capabilities.names ?? []\n    const rung = rungOf(names)\n    const places = figureBindingsOf(asset)\n    return html`<section>\n      <h3>${i18next.t('figure.label.what-this-does')}</h3>\n      ${(['none', 'hold', 'flow'] as const).map(\n        which => html`<label rung ?on=${rung === which}>\n          <input type=\"radio\" name=\"rung\" .checked=${live(rung === which)} ?disabled=${this.locked} @change=${() => this.setRung(which)} />\n          <span>\n            <strong>${i18next.t(`figure.label.rung-${which}`)}</strong>\n            <em>${i18next.t(`figure.text.rung-${which}-note`)}</em>\n          </span>\n        </label>`\n      )}\n      ${rung === null ? html`<p hint>${i18next.t('figure.text.capability-hand-written')}</p>` : nothing}\n      ${names.length ? html`<code>${names.join(' · ')}</code>` : nothing}\n      </section>\n      <section>\n      <h3>${i18next.t('figure.label.places')}</h3>\n      ${places.length\n        ? places.map(\n            one => html`<button place ?on=${one.part === this.selected} @click=${() => one.part && this.pick(one.part)}>\n              <strong>${one.label}</strong>\n              <small>\n                ${one.part ?? '?'}${one.face ? ' · ' + i18next.t('figure.label.face-' + one.face) : ''} ·\n                ${placeTerms(one, (key, params) => i18next.t(key, params))}\n              </small>\n            </button>`\n          )\n        : html`<p hint>${i18next.t('figure.text.no-places')}</p>`}\n      ${places.length && rung === 'none' ? html`<p hint>${i18next.t('figure.text.place-needs-holding')}</p>` : nothing}\n      </section>\n      <section>\n      <h3>${i18next.t('figure.label.item')}</h3>\n      <label item ?on=${!!asset.item}>\n        <input type=\"checkbox\" .checked=${live(!!asset.item)} ?disabled=${this.locked} @change=${(e: Event) => this.setItem((e.target as HTMLInputElement).checked)} />\n        <span>\n          <strong>${i18next.t('figure.label.is-item')}</strong>\n          <em>${i18next.t('figure.text.is-item-note')}</em>\n        </span>\n      </label>\n      </section>\n    `\n  }\n\n  private setRung(which: Rung) {\n    this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which]] } }, bubbles: true, composed: true }))\n  }\n\n  private setItem(item: boolean) {\n    this.dispatchEvent(new CustomEvent('command', { detail: { action: { kind: 'set-item', item } }, bubbles: true, composed: true }))\n  }\n\n  private pick(part: string) {\n    this.dispatchEvent(new CustomEvent('select-part', { detail: { id: part }, bubbles: true, composed: true }))\n  }\n}\n"]}
+{"version":3,"file":"figure-capability-panel.js","sourceRoot":"","sources":["../../client/modeller/figure-capability-panel.ts"],"names":[],"mappings":";AAAA,OAAO,EAAE,GAAG,EAAE,IAAI,EAAE,UAAU,EAAE,OAAO,EAAE,MAAM,KAAK,CAAA;AACpD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,mBAAmB,CAAA;AAC3D,OAAO,EAAE,IAAI,EAAE,MAAM,wBAAwB,CAAA;AAE7C,OAAO,EAAE,OAAO,EAAE,QAAQ,EAAE,MAAM,eAAe,CAAA;AACjD,OAAO,EAAE,gBAAgB,EAAE,MAAM,wBAAwB,CAAA;AAEzD,OAAO,EAAE,KAAK,EAAE,MAAM,EAAa,MAAM,8DAA8D,CAAA;AACvG,OAAO,EAAE,eAAe,EAAE,MAAM,gEAAgE,CAAA;AAChG,OAAO,EAAE,UAAU,EAAE,MAAM,2DAA2D,CAAA;AACtF,OAAO,EAAE,2BAA2B,EAAiE,MAAM,wBAAwB,CAAA;AAEnI,OAAO,EACL,mBAAmB,EACnB,YAAY,EACZ,SAAS,EACT,YAAY,EACZ,OAAO,EACP,cAAc,EACd,UAAU,EACV,oBAAoB,EACpB,cAAc,EACd,SAAS,EACV,MAAM,4BAA4B,CAAA;AAEnC;;;;;;;;;;GAUG;AAEI,IAAM,qBAAqB,GAA3B,MAAM,qBAAsB,SAAQ,QAAQ,CAAC,OAAO,CAAC,CAAC,UAAU,CAAC;IAAjE;;QA0FL,kDAAkD;QACtC,aAAQ,GAAG,EAAE,CAAA;QACI,WAAM,GAAG,KAAK,CAAA;IAyJ7C,CAAC;aApPQ,WAAM,GAAG,CAAC,eAAe,EAAE,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAyEpC,CAAC,AAzEW,CAyEX;IAIF,iBAAiB;QACf,KAAK,CAAC,iBAAiB,EAAE,CAAA;QACzB,uEAAuE;QACvE,IAAI,CAAC,QAAQ,GAAG,2BAA2B,CAAC,GAAG,EAAE,CAAC,IAAI,CAAC,aAAa,EAAE,CAAC,CAAA;IACzE,CAAC;IAED,oBAAoB;QAClB,KAAK,CAAC,oBAAoB,EAAE,CAAA;QAC5B,IAAI,CAAC,QAAQ,EAAE,EAAE,CAAA;IACnB,CAAC;IAOD,MAAM;QACJ,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAA;QACxB,IAAI,CAAC,KAAK;YAAE,OAAO,OAAO,CAAA;QAC1B,MAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAA;QACrD,MAAM,IAAI,GAAG,MAAM,CAAC,KAAK,CAAC,CAAA;QAC1B,MAAM,MAAM,GAAG,gBAAgB,CAAC,KAAK,CAAC,CAAA;QACtC,OAAO,IAAI,CAAA;YACH,OAAO,CAAC,CAAC,CAAC,6BAA6B,CAAC;QAC3C,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAW,CAAC,GAAG,CACvC,KAAK,CAAC,EAAE,CAAC,IAAI,CAAA,mBAAmB,IAAI,KAAK,KAAK;qDACD,IAAI,CAAC,IAAI,KAAK,KAAK,CAAC,cAAc,IAAI,CAAC,MAAM,YAAY,GAAG,EAAE,CAAC,IAAI,CAAC,OAAO,CAAC,KAAK,CAAC;;sBAEjH,OAAO,CAAC,CAAC,CAAC,qBAAqB,KAAK,EAAE,CAAC;kBAC3C,OAAO,CAAC,CAAC,CAAC,oBAAoB,KAAK,OAAO,CAAC;;iBAE5C,CACV;QACC,IAAI,KAAK,IAAI,CAAC,CAAC,CAAC,IAAI,CAAA,WAAW,OAAO,CAAC,CAAC,CAAC,qCAAqC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;QAC/F,KAAK,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,SAAS,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,OAAO;;QAEhE,IAAI,CAAC,eAAe,CAAC,KAAK,CAAC;;YAEvB,OAAO,CAAC,CAAC,CAAC,qBAAqB,CAAC;QACpC,MAAM,CAAC,MAAM;YACb,CAAC,CAAC,MAAM,CAAC,GAAG,CACR,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,qBAAqB,GAAG,CAAC,IAAI,KAAK,IAAI,CAAC,QAAQ,WAAW,GAAG,EAAE,CAAC,GAAG,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,CAAC,GAAG,CAAC,IAAI,CAAC;wBAC9F,GAAG,CAAC,KAAK;;kBAEf,GAAG,CAAC,IAAI,IAAI,GAAG,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,GAAG,OAAO,CAAC,CAAC,CAAC,oBAAoB,GAAG,GAAG,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,EAAE;kBACpF,UAAU,CAAC,GAAG,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,EAAE,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,MAAM,CAAC,CAAC;;sBAEpD,CACX;YACH,CAAC,CAAC,IAAI,CAAA,WAAW,OAAO,CAAC,CAAC,CAAC,uBAAuB,CAAC,MAAM;QACzD,MAAM,CAAC,MAAM,IAAI,IAAI,KAAK,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,WAAW,OAAO,CAAC,CAAC,CAAC,iCAAiC,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;;;YAG1G,OAAO,CAAC,CAAC,CAAC,mBAAmB,CAAC;wBAClB,CAAC,CAAC,KAAK,CAAC,IAAI;0CACM,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,IAAI,CAAC,cAAc,IAAI,CAAC,MAAM,YAAY,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,OAAO,CAAE,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;oBAE/I,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC;gBACrC,OAAO,CAAC,CAAC,CAAC,0BAA0B,CAAC;;;;KAIhD,CAAA;IACH,CAAC;IAED,2HAA2H;IACnH,eAAe,CAAC,KAAkB;QACxC,MAAM,KAAK,GAAG,mBAAmB,EAAE,CAAA;QACnC,MAAM,OAAO,GAAG,oBAAoB,CAAC,KAAK,CAAC,CAAA;QAC3C,IAAI,CAAC,KAAK,CAAC,MAAM,IAAI,CAAC,OAAO,CAAC,MAAM;YAAE,OAAO,OAAO,CAAA;QACpD,MAAM,KAAK,GAAG,KAAK,CAAC,QAAQ,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAA;QACrD,OAAO,IAAI,CAAA;YACH,OAAO,CAAC,CAAC,CAAC,mCAAmC,CAAC;QAClD,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;YACd,MAAM,EAAE,GAAG,KAAK,CAAC,QAAQ,CAAC,CAAC,CAAC,IAAI,CAAC,CAAA;YACjC,MAAM,OAAO,GAAG,YAAY,CAAC,CAAC,EAAE,KAAK,CAAC,CAAA;YACtC,OAAO,IAAI,CAAA,mBAAmB,EAAE;8CACM,IAAI,CAAC,EAAE,CAAC,cAAc,IAAI,CAAC,MAAM,IAAI,CAAC,CAAC,EAAE,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,CAAC,YAAY,CAAC,CAAQ,EAAE,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,EAAG,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC;;wBAEvL,CAAC,CAAC,KAAK;oBACX,CAAC,CAAC,IAAI;sBACJ,CAAC,CAAC,IAAI,MAAM,CAAC,CAAC,OAAO;;;YAG/B,OAAO,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAA,WAAW,OAAO,CAAC,CAAC,CAAC,sCAAsC,EAAE,EAAE,KAAK,EAAE,OAAO,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,MAAM,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,sBAAsB,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,IAAI,CAAC,IAAI,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC,OAAO;YACjM,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,cAAc,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,CAAC,CAAC,OAAO,EAAE,CAAA;QACpD,CAAC,CAAC;QACA,OAAO,CAAC,GAAG,CACX,IAAI,CAAC,EAAE,CAAC,IAAI,CAAA;YACR,OAAO,CAAC,CAAC,CAAC,wCAAwC,EAAE,EAAE,IAAI,EAAE,CAAC;oCACrC,IAAI,CAAC,MAAM,WAAW,GAAG,EAAE,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,EAAE,IAAI,EAAE,KAAK,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,yCAAyC,CAAC;aAC/I,CACN;eACQ,CAAA;IACb,CAAC;IAED,6FAA6F;IACrF,cAAc,CAAC,KAAkB,EAAE,CAA6B;QACtE,MAAM,QAAQ,GAAG,UAAU,CAAC,KAAK,EAAE,CAAC,CAAC,IAAI,CAAC,CAAA;QAC1C,MAAM,KAAK,GAAG,CAAC,IAA6B,EAAE,EAAE,CAC9C,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,EAAE,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,yBAAyB,EAAE,IAAI,EAAE,CAAC,CAAC,IAAI,EAAE,QAAQ,EAAE,MAAM,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;QAC5M,MAAM,KAAK,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,UAAU,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,CAAA;QAC/D,MAAM,MAAM,GAAG,KAAK,CAAC,QAAQ,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,IAAI,KAAK,OAAO,CAAC,CAAA;QAC1E,MAAM,MAAM,GAAG,cAAc,CAAC,CAAC,EAAE,KAAK,CAAC,CAAA;QACvC,OAAO,IAAI,CAAA;UACL,CAAC,CAAC,CAAC,QAAQ,IAAI,EAAE,CAAC,CAAC,GAAG,CAAC,CAAC,OAAgC,EAAE,EAAE;YAC5D,IAAI,OAAO,CAAC,IAAI,KAAK,OAAO,EAAE,CAAC;gBAC7B,MAAM,MAAM,GAAG,OAAO,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAG,CAAC,CAAA;gBAC7C,MAAM,MAAM,GAAG,CAAC,IAAY,EAAE,EAAW,EAAE,EAAE,CAAC,KAAK,CAAC,SAAS,CAAC,QAAQ,EAAE,OAAO,CAAC,GAAG,EAAE,EAAE,CAAC,CAAC,CAAC,CAAC,GAAG,MAAM,EAAE,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,IAAI,CAAC,CAAC,CAAC,CAAA;gBAC9I,OAAO,IAAI,CAAA,SAAS,OAAO,CAAC,KAAK;;kBAE3B,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAA,0CAA0C,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAC,cAAc,IAAI,CAAC,MAAM,YAAY,CAAC,CAAQ,EAAE,EAAE,CAAC,MAAM,CAAC,CAAC,EAAG,CAAC,CAAC,MAA2B,CAAC,OAAO,CAAC,MAAM,CAAC,UAAU,CAAC;kBAC3M,IAAI,CAAC,QAAQ,IAAI,KAAK,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,IAAI,CAAC,QAAQ,CAAC;oBACjF,CAAC,CAAC,IAAI,CAAA,2BAA2B,IAAI,CAAC,MAAM,WAAW,GAAG,EAAE,CAAC,MAAM,CAAC,IAAI,CAAC,QAAQ,EAAE,IAAI,CAAC,IAAI,OAAO,CAAC,CAAC,CAAC,sCAAsC,EAAE,EAAE,IAAI,EAAE,IAAI,CAAC,QAAQ,EAAE,CAAC,WAAW;oBACjL,CAAC,CAAC,OAAO;qBACN,CAAA;YACX,CAAC;YACD,MAAM,KAAK,GAAG,YAAY,CAAC,QAAQ,EAAE,OAAO,CAAC,CAAA;YAC7C,MAAM,KAAK,GAAG,MAAM,CAAC,IAAI,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,KAAK,CAAC,CAAA;YACpD,OAAO,IAAI,CAAA,SAAS,OAAO,CAAC,KAAK;gCACX,IAAI,CAAC,MAAM,YAAY,CAAC,CAAQ,EAAE,EAAE,CAAC,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAG,CAAC,CAAC,MAA4B,CAAC,KAAK,IAAI,SAAS,EAAE,KAAK,CAAC,MAAM,CAAC,CAAC;2CACpI,CAAC,KAAK,CAAC,KAAK,IAAI,OAAO,CAAC,CAAC,CAAC,wBAAwB,CAAC;gBAC9E,MAAM,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,IAAI,CAAA,iBAAiB,CAAC,CAAC,EAAE,cAAc,CAAC,CAAC,EAAE,KAAK,KAAK,CAAC,KAAK,IAAI,KAAK,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC,CAAC,EAAE,GAAG,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,IAAI,IAAI,CAAC,CAAC,GAAG,IAAI,EAAE,IAAI,CAAC,CAAC,GAAG,IAAI,EAAE,GAAG,CAAC,CAAC,CAAC,EAAE,WAAW,CAAC;;cAElM,KAAK,CAAC,KAAK;gBACX,CAAC,CAAC,IAAI,CAAA;;sBAEE,OAAO,CAAC,IAAI,CAAC,GAAG,CAChB,GAAG,CAAC,EAAE,CAAC,IAAI,CAAA,SAAS,GAAG;;;;gCAIb,KAAK,EAAE,GAAG,IAAI,EAAE;gCAChB,KAAK,EAAE,GAAG,IAAI,EAAE;mCACb,MAAM,CAAC,KAAK,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;sCACtB,IAAI,CAAC,MAAM;oCACb,CAAC,CAAQ,EAAE,EAAE;oBACrB,MAAM,CAAC,GAAI,CAAC,CAAC,MAA2B,CAAC,aAAa,CAAA;oBACtD,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,CAAC,CAAC;wBAAE,OAAO,IAAI,CAAC,aAAa,EAAE,CAAA;oBACpD,KAAK,CAAC,cAAc,CAAC,QAAQ,EAAE,OAAO,EAAE,KAAK,CAAC,KAAK,EAAE,EAAE,GAAG,KAAK,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,EAAE,CAAC,EAAE,CAAC,CAAC,CAAA;gBACtF,CAAC;2BACA,CACN;yBACI;gBACX,CAAC,CAAC,OAAO,EAAE,CAAA;QACjB,CAAC,CAAC;;QAEF,MAAM,CAAC,GAAG,CAAC,MAAM,CAAC,EAAE,CAAC,IAAI,CAAA,WAAW,MAAM,MAAM,CAAC,EAAE,CAAA;IACzD,CAAC;IAEO,WAAW,CAAC,KAAkB,EAAE,IAAY,EAAE,EAAW;QAC/D,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,EAAE,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,SAAS,CAAC,KAAK,EAAE,IAAI,EAAE,EAAE,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IACxK,CAAC;IAEO,OAAO,CAAC,KAAW;QACzB,kFAAkF;QAClF,MAAM,SAAS,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,QAAQ,CAAC,YAAY,CAAC,KAAK,IAAI,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAA;QAC9F,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,WAAW,EAAE,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,EAAE,IAAI,EAAE,kBAAkB,EAAE,KAAK,EAAE,CAAC,GAAG,KAAK,CAAC,KAAK,CAAC,EAAE,GAAG,SAAS,CAAC,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAC7K,CAAC;IAEO,OAAO,CAAC,IAAa;QAC3B,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,SAAS,EAAE,EAAE,MAAM,EAAE,EAAE,MAAM,EAAE,EAAE,IAAI,EAAE,UAAU,EAAE,IAAI,EAAE,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IACnI,CAAC;IAEO,IAAI,CAAC,IAAY;QACvB,IAAI,CAAC,aAAa,CAAC,IAAI,WAAW,CAAC,aAAa,EAAE,EAAE,MAAM,EAAE,EAAE,EAAE,EAAE,IAAI,EAAE,EAAE,OAAO,EAAE,IAAI,EAAE,QAAQ,EAAE,IAAI,EAAE,CAAC,CAAC,CAAA;IAC7G,CAAC;;AA3J+B;IAA/B,QAAQ,CAAC,EAAE,SAAS,EAAE,KAAK,EAAE,CAAC;;oDAAoB;AAEvC;IAAX,QAAQ,EAAE;;uDAAc;AACI;IAA5B,QAAQ,CAAC,EAAE,IAAI,EAAE,OAAO,EAAE,CAAC;;qDAAe;AA5FhC,qBAAqB;IADjC,aAAa,CAAC,yBAAyB,CAAC;GAC5B,qBAAqB,CAqPjC","sourcesContent":["import { css, html, LitElement, nothing } from 'lit'\nimport { customElement, property } from 'lit/decorators.js'\nimport { live } from 'lit/directives/live.js'\n\nimport { i18next, localize } from '@operato/i18n'\nimport { figureBindingsOf } from '@hatiolab/figure-model'\nimport type { FigureAsset } from '@hatiolab/figure-model'\nimport { RUNGS, rungOf, type Rung } from '@things-factory/figure-viewer/dist-client/capability-rung.js'\nimport { SidePanelStyles } from '@things-factory/figure-viewer/dist-client/side-panel-styles.js'\nimport { placeTerms } from '@things-factory/figure-viewer/dist-client/detail-facts.js'\nimport { onFigureCapabilitiesChanged, type FigureCapabilityDescriptor, type FigureCapabilitySetting } from '@hatiolab/things-scene'\n\nimport {\n  consumerDescriptors,\n  inputTableAt,\n  namesWith,\n  needsMissing,\n  partsAt,\n  settingsIssues,\n  settingsOf,\n  unknownConsumerNames,\n  withInputTable,\n  withParts\n} from './consumer-capabilities.js'\n\n/**\n * 자리·능력 — what the figure does on a board: the ladder from drawing only, to\n * holding things, to passing them on, and every place things are held, whatever part it is on. A place is not drawn,\n * so the list is the only way to find one; choosing a row selects its part, where the place is edited. Whether the\n * figure is the look of an item a holder carries is said here too (ADR-0155 amendment 2): a tag, apart from the ladder,\n * since an item may hold things as well.\n *\n * Below the ladder, the products' capabilities this modeller has descriptors for (ADR-0167 9, 12): each put on or off,\n * what it still needs, and its settings as its descriptor draws them -- parts picked (the part chosen here by one\n * button), an input and a value per fixed key, never a row added or taken away -- with what its check says.\n */\n@customElement('figure-capability-panel')\nexport class FigureCapabilityPanel extends localize(i18next)(LitElement) {\n  static styles = [SidePanelStyles, css`\n    :host {\n      display: block;\n    }\n    label[rung],\n    label[item] {\n      display: flex;\n      gap: 8px;\n      align-items: flex-start;\n      padding: 8px;\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n      cursor: pointer;\n    }\n    label[rung][on],\n    label[item][on] {\n      border-color: var(--md-sys-color-primary);\n      background: var(--md-sys-color-secondary-container);\n      color: var(--md-sys-color-on-secondary-container);\n    }\n    label[rung] span,\n    label[item] span {\n      display: grid;\n      gap: 2px;\n    }\n    label[rung] em,\n    label[item] em,\n    p[hint],\n    small {\n      font-style: normal;\n      margin: 0;\n      color: var(--md-sys-color-on-surface-variant);\n    }\n    button[place] {\n      display: grid;\n      gap: 2px;\n      text-align: left;\n      padding: 6px 8px;\n      font: inherit;\n      color: inherit;\n      border: 1px solid var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n      background: none;\n      cursor: pointer;\n    }\n    button[place][on] {\n      border-color: var(--md-sys-color-primary);\n    }\n    code {\n      font-size: var(--ui-t-small, 11.5px);\n      color: var(--md-sys-color-on-surface-variant);\n    }\n    div[chips] {\n      display: flex;\n      flex-wrap: wrap;\n      gap: 4px 10px;\n      align-items: center;\n    }\n    div[chips] label {\n      display: inline-flex;\n      gap: 4px;\n      align-items: center;\n    }\n    div[table] {\n      display: grid;\n      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);\n      gap: 4px 6px;\n      align-items: center;\n    }\n    p[warn] {\n      margin: 0;\n      color: var(--md-sys-color-error);\n    }\n  `]\n\n  private unlisten?: () => void\n\n  connectedCallback() {\n    super.connectedCallback()\n    /* A product's descriptors may be registered after the panel stands. */\n    this.unlisten = onFigureCapabilitiesChanged(() => this.requestUpdate())\n  }\n\n  disconnectedCallback() {\n    super.disconnectedCallback()\n    this.unlisten?.()\n  }\n\n  @property({ attribute: false }) asset?: FigureAsset\n  /** The selected part, whose places are marked. */\n  @property() selected = ''\n  @property({ type: Boolean }) locked = false\n\n  render() {\n    const asset = this.asset\n    if (!asset) return nothing\n    const names = asset.document.capabilities.names ?? []\n    const rung = rungOf(names)\n    const places = figureBindingsOf(asset)\n    return html`<section>\n      <h3>${i18next.t('figure.label.what-this-does')}</h3>\n      ${(['none', 'hold', 'flow'] as const).map(\n        which => html`<label rung ?on=${rung === which}>\n          <input type=\"radio\" name=\"rung\" .checked=${live(rung === which)} ?disabled=${this.locked} @change=${() => this.setRung(which)} />\n          <span>\n            <strong>${i18next.t(`figure.label.rung-${which}`)}</strong>\n            <em>${i18next.t(`figure.text.rung-${which}-note`)}</em>\n          </span>\n        </label>`\n      )}\n      ${rung === null ? html`<p hint>${i18next.t('figure.text.capability-hand-written')}</p>` : nothing}\n      ${names.length ? html`<code>${names.join(' · ')}</code>` : nothing}\n      </section>\n      ${this.renderConsumers(asset)}\n      <section>\n      <h3>${i18next.t('figure.label.places')}</h3>\n      ${places.length\n        ? places.map(\n            one => html`<button place ?on=${one.part === this.selected} @click=${() => one.part && this.pick(one.part)}>\n              <strong>${one.label}</strong>\n              <small>\n                ${one.part ?? '?'}${one.face ? ' · ' + i18next.t('figure.label.face-' + one.face) : ''} ·\n                ${placeTerms(one, (key, params) => i18next.t(key, params))}\n              </small>\n            </button>`\n          )\n        : html`<p hint>${i18next.t('figure.text.no-places')}</p>`}\n      ${places.length && rung === 'none' ? html`<p hint>${i18next.t('figure.text.place-needs-holding')}</p>` : nothing}\n      </section>\n      <section>\n      <h3>${i18next.t('figure.label.item')}</h3>\n      <label item ?on=${!!asset.item}>\n        <input type=\"checkbox\" .checked=${live(!!asset.item)} ?disabled=${this.locked} @change=${(e: Event) => this.setItem((e.target as HTMLInputElement).checked)} />\n        <span>\n          <strong>${i18next.t('figure.label.is-item')}</strong>\n          <em>${i18next.t('figure.text.is-item-note')}</em>\n        </span>\n      </label>\n      </section>\n    `\n  }\n\n  /** The products' capabilities: those this modeller knows, each on or off with its settings, and those it does not know. */\n  private renderConsumers(asset: FigureAsset) {\n    const known = consumerDescriptors()\n    const unknown = unknownConsumerNames(asset)\n    if (!known.length && !unknown.length) return nothing\n    const names = asset.document.capabilities.names ?? []\n    return html`<section>\n      <h3>${i18next.t('figure.label.product-capabilities')}</h3>\n      ${known.map(d => {\n        const on = names.includes(d.name)\n        const missing = needsMissing(d, asset)\n        return html`<label rung ?on=${on}>\n            <input type=\"checkbox\" .checked=${live(on)} ?disabled=${this.locked || (!on && missing.length > 0)} @change=${(e: Event) => this.setConsumer(asset, d.name, (e.target as HTMLInputElement).checked)} />\n            <span>\n              <strong>${d.label}</strong>\n              <em>${d.note}</em>\n              <code>${d.name} · ${d.version}</code>\n            </span>\n          </label>\n          ${missing.length ? html`<p hint>${i18next.t('figure.text.product-capability-needs', { needs: missing.map(m => (m === 'item' ? i18next.t('figure.label.is-item') : m)).join(', ') })}</p>` : nothing}\n          ${on ? this.renderSettings(asset, d) : nothing}`\n      })}\n      ${unknown.map(\n        name => html`<p hint>\n          ${i18next.t('figure.text.product-capability-unknown', { name })}\n          <button quiet ?disabled=${this.locked} @click=${() => this.setConsumer(asset, name, false)}>${i18next.t('figure.button.product-capability-remove')}</button>\n        </p>`\n      )}\n    </section>`\n  }\n\n  /** A capability's settings as its descriptor draws them, and what its check says of them. */\n  private renderSettings(asset: FigureAsset, d: FigureCapabilityDescriptor) {\n    const settings = settingsOf(asset, d.name)\n    const write = (next: Record<string, unknown>) =>\n      this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capability-settings', name: d.name, settings: Object.keys(next).length ? next : null } }, bubbles: true, composed: true }))\n    const parts = [...new Set(asset.appearance.map(a => a.target))]\n    const inputs = asset.document.model.inputs.filter(i => i.role === 'state')\n    const issues = settingsIssues(d, asset)\n    return html`<div form>\n        ${(d.settings ?? []).map((setting: FigureCapabilitySetting) => {\n          if (setting.kind === 'parts') {\n            const chosen = partsAt(settings, setting.key)\n            const toggle = (part: string, on: boolean) => write(withParts(settings, setting.key, on ? [...chosen, part] : chosen.filter(p => p !== part)))\n            return html`<span>${setting.label}</span>\n              <div chips>\n                ${parts.map(p => html`<label><input type=\"checkbox\" .checked=${live(chosen.includes(p))} ?disabled=${this.locked} @change=${(e: Event) => toggle(p, (e.target as HTMLInputElement).checked)} />${p}</label>`)}\n                ${this.selected && parts.includes(this.selected) && !chosen.includes(this.selected)\n                  ? html`<button quiet ?disabled=${this.locked} @click=${() => toggle(this.selected, true)}>${i18next.t('figure.button.data-add-selected-part', { part: this.selected })}</button>`\n                  : nothing}\n              </div>`\n          }\n          const table = inputTableAt(settings, setting)\n          const input = inputs.find(i => i.id === table.input)\n          return html`<span>${setting.label}</span>\n            <select ?disabled=${this.locked} @change=${(e: Event) => write(withInputTable(settings, setting, (e.target as HTMLSelectElement).value || undefined, table.values))}>\n              <option value=\"\" ?selected=${!table.input}>${i18next.t('figure.label.data-none')}</option>\n              ${inputs.map(i => html`<option value=${i.id} ?selected=${i.id === table.input}>${asset.stateInputs?.[i.id]?.label ?? i.id}${i.unit ? ` (${i.unit} ${i.min ?? ''}~${i.max ?? ''})` : ''}</option>`)}\n            </select>\n            ${table.input\n              ? html`<span></span>\n                  <div table>\n                    ${setting.keys.map(\n                      key => html`<span>${key}</span>\n                        <input\n                          type=\"number\"\n                          step=\"any\"\n                          min=${input?.min ?? ''}\n                          max=${input?.max ?? ''}\n                          .value=${String(table.values[key])}\n                          ?disabled=${this.locked}\n                          @change=${(e: Event) => {\n                            const n = (e.target as HTMLInputElement).valueAsNumber\n                            if (!Number.isFinite(n)) return this.requestUpdate()\n                            write(withInputTable(settings, setting, table.input, { ...table.values, [key]: n }))\n                          }}\n                        />`\n                    )}\n                  </div>`\n              : nothing}`\n        })}\n      </div>\n      ${issues.map(reason => html`<p warn>${reason}</p>`)}`\n  }\n\n  private setConsumer(asset: FigureAsset, name: string, on: boolean) {\n    this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: namesWith(asset, name, on) } }, bubbles: true, composed: true }))\n  }\n\n  private setRung(which: Rung) {\n    /* The ladder sets the shared names; a product's capabilities stay as they are. */\n    const consumers = (this.asset?.document.capabilities.names ?? []).filter(n => n.includes('.'))\n    this.dispatchEvent(new CustomEvent('part-edit', { detail: { edit: { kind: 'set-capabilities', names: [...RUNGS[which], ...consumers] } }, bubbles: true, composed: true }))\n  }\n\n  private setItem(item: boolean) {\n    this.dispatchEvent(new CustomEvent('command', { detail: { action: { kind: 'set-item', item } }, bubbles: true, composed: true }))\n  }\n\n  private pick(part: string) {\n    this.dispatchEvent(new CustomEvent('select-part', { detail: { id: part }, bubbles: true, composed: true }))\n  }\n}\n"]}

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

@@ -5,33 +5,41 @@ declare const FigureDataPanel_base: (new (...args: any[]) => LitElement) & typeo
 /**
  * 데이터 -- the data a site sends this figure, in its own names, and what each value moves (ADR-0051 §8, data binding
  * design decision 4). The schema is free: fields the author names, a tree of objects and lists. A binding reads one place
- * of it and moves one thing the figure can do -- a control, a colour, a motion group's clip, speed or pause, a status
- * port, its position, the items in its places -- by the board's rules (value, map, range, scale). Every change is one
- * part edit, and whether it holds is the kernel's check.
+ * of it and shows it in the figure (ADR-0166): as it is or scaled, it moves one thing -- a control, a colour, a motion
+ * group's clip, speed or pause, its position, the items in its places; by a code table or a range table, each value's
+ * look goes to several targets at once -- parts' colour and effect, controls' values, a motion group. The field's kind
+ * says which methods there are. Every change is one part edit, and whether it holds is the kernel's check.
  *
  * The sample is not saved: data tried here, read the one way a placed figure reads it, and -- in the preview -- the figure
- * running on it (`data-sample`).
+ * running on it (`data-sample`); a sample legend pasted for a table's role shows it as a board's legend would
+ * (`legend-sample`).
  */
 export declare class FigureDataPanel extends FigureDataPanel_base {
     private readonly help;
     static styles: import("lit").CSSResult[];
     asset?: FigureAsset;
     locked: boolean;
+    /** The part chosen in the modeller, put among a table's parts by one button. */
+    selected: string;
     /** The schema row chosen, by its path; its field is edited under it. */
     private chosen;
     private adding;
     /** A site's data pasted to start the schema from; nothing is kept until the author says so. */
     private pasted;
+    /** A binding as it is being added: the field (or a new field's name), the method, the behavior or the table's targets. */
     private connecting;
     /** The binding opened to edit its rule, by id. */
     private opened;
-    private porting;
+    /** Sample legends by role, as JSON typed; not saved. */
+    private legendSample;
     /** The rotation card as filled in: the joint, and the fields for on, speed (and its most rpm) and direction. */
     private rotating;
     /** The sample as typed, JSON; empty until edited, the schema's example shown until then. */
     private sample;
     private sampling;
     render(): import("lit-html").TemplateResult<1> | typeof nothing;
+    /** The data a product's capability the figure wears reads itself (ADR-0167 14): said, read only. */
+    private renderCapabilityData;
     private renderSchema;
     private kindWord;
     /** The chosen field's own settings, and a field added under it when it holds fields. */
@@ -40,26 +48,62 @@ export declare class FigureDataPanel extends FigureDataPanel_base {
     /** A site's data pasted: the schema guessed from it, kept only when the author says so -- units, ranges and closed values are theirs to set. */
     private renderFromSample;
     private behaviorName;
+    /** What a table shows on, as one line: its parts, the controls it sets, its motion group. */
+    private targetsName;
     private renderBindings;
     private renderBinding;
-    private renderBindingDetail;
-    /** A result editor fitting what the behavior takes: a colour, a clip of the group, true or false, a code, a number. */
-    private renderResult;
-    /** A result per value of a closed field, and one for every other value. */
-    private renderCases;
-    /** Intervals of a number, each from (inclusive) to (exclusive), either end left open, and one result for the rest. */
-    private renderRanges;
+    /**
+     * A binding a product's capability takes over where the product registers it (ADR-0167 17): there it rests, whole or for
+     * the targets named; elsewhere (a board without the product) it works.
+     */
+    private renderResting;
+    private renderValueDetail;
+    /**
+     * A table (ADR-0166 10): what it shows on -- parts, controls, a motion group -- its rows, a code or an interval each
+     * with a cell per column, the look of every other value, and whether a board may swap it for a legend.
+     */
+    private renderTable;
+    /** Which parts, controls and motion group a table shows on: chips to tick, and the part chosen in the modeller by one button. */
+    private renderTargets;
+    /** The column heads of a table's rows, after the key's own one or two. */
+    private columnHeads;
+    /** One look's cells, a column each: a colour, an effect, a control's value, a clip, a speed, a pause -- empty leaves the target as it is. */
+    private lookCells;
+    /** The look of every other value: a row like the others, added or taken away; kept when a closed field's values are not all rows. */
+    private renderOtherwise;
+    /**
+     * A code table's rows: a code each, typed, with its look. A closed text's values follow the codes (ADR-0166 risk 3):
+     * a code added, renamed or taken away is the field's value too; true and false are both rows.
+     */
+    private renderCodeRows;
+    /**
+     * A range table's rows: from (inclusive) and to (exclusive), either end open, with a look each. Giving the last row,
+     * open above, an end starts the next row there; a row open above is the last there can be.
+     */
+    private renderRangeRows;
     /** Which field of each element is its id, its type, its place, its height in the stack, its status. */
     private renderItemFields;
+    /**
+     * 「연결 추가」 (ADR-0166 10): a field there or a new name, then a method the field's kind allows. As it is or scaled,
+     * the one thing it moves; a table, the parts, controls and motion group it shows on -- a new name makes the field.
+     */
     private renderAddBinding;
     /**
      * 「＋ 회전」: a joint that turns without end, turned by the data -- on, speed in rpm, direction -- in one step. The
      * clips, the group and the bindings it writes are ordinary ones, edited one by one afterwards.
      */
     private renderRotation;
-    private renderPorts;
     /** Data to try, read the way a placed figure reads it: what it moves, or why it is refused; in the preview, the figure running on it. */
     private renderSample;
+    /** Which row of a table the sample's value matched, and from which table: the figure's own or the sample legend of its role. */
+    private renderTableUse;
+    /** The sample legends as read: by role, those that are JSON. */
+    private sampleLegends;
+    /**
+     * A legend pasted for each table role, to see the figure as a board's legend of that role would show it -- not saved.
+     * The preview shows it too, as a scene's legend named as the role.
+     */
+    private renderSampleLegends;
     private try;
     /** The sample to the preview while it is asked for; null lets the preview's figure go back to its own values. */
     private tell;