@operato/scene-visualizer 10.0.0-beta.1 → 10.0.0-beta.10

package/dist/editors/property-editor-stocker-location.js

@@ -0,0 +1,151 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ *
+ * Stocker Location Rule Editor
+ */
+import { __decorate } from "tslib";
+import { css, html } from 'lit';
+import { customElement, state } from 'lit/decorators.js';
+import { OxPropertyEditor } from '@operato/property-editor';
+import { DEFAULT_LOCATION_RULE, buildLocationId } from '../stocker.js';
+let StockerLocationEditor = class StockerLocationEditor extends OxPropertyEditor {
+    static styles = [
+        ...OxPropertyEditor.styles,
+        css `
+      .loc-grid { display: grid; grid-template-columns: 80px 1fr; gap: 3px 6px; font-size: 11px; align-items: center; }
+      .loc-grid label { color: #555; font-weight: 500; font-size: 10px; }
+      .loc-grid input, .loc-grid select {
+        width: 100%; box-sizing: border-box; font-size: 11px; padding: 3px 4px;
+        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #fff; color: #1c1b1f;
+      }
+      .loc-grid input[type="number"] { width: 50px; }
+      .side-labels { display: flex; gap: 4px; align-items: center; font-size: 10px; }
+      .side-labels input { width: 30px; text-align: center; }
+      .section-title { grid-column: 1 / -1; font-weight: 600; font-size: 10px; color: #6750a4; margin-top: 6px; padding-bottom: 2px; border-bottom: 1px solid rgba(0,0,0,0.08); }
+      .preview { grid-column: 1 / -1; margin-top: 6px; padding: 6px 8px; background: #f3edf7; border-radius: 6px; font-family: monospace; font-size: 11px; }
+      .preview-title { font-size: 9px; font-weight: 600; color: #555; margin-bottom: 3px; }
+      .preview-samples { display: flex; flex-wrap: wrap; gap: 4px; }
+      .preview-sample { padding: 1px 5px; background: #fff; border-radius: 3px; font-size: 10px; }
+    `
+    ];
+    _lastExternalValue = undefined;
+    constructor() {
+        super();
+        this._rule = { ...DEFAULT_LOCATION_RULE };
+    }
+    _parseValue(value) {
+        if (!value)
+            return { ...DEFAULT_LOCATION_RULE };
+        if (typeof value === 'string') {
+            try {
+                return { ...DEFAULT_LOCATION_RULE, ...JSON.parse(value) };
+            }
+            catch {
+                return { ...DEFAULT_LOCATION_RULE };
+            }
+        }
+        return { ...DEFAULT_LOCATION_RULE, ...value };
+    }
+    editorTemplate(value, _spec) {
+        const serialized = typeof value === 'string' ? value : JSON.stringify(value);
+        if (serialized !== this._lastExternalValue) {
+            this._lastExternalValue = serialized;
+            this._rule = this._parseValue(value);
+        }
+        const r = this._rule;
+        const rackConfig = { bays: 10, levels: 5, depthCount: 1 };
+        const samples = [
+            buildLocationId(r, 'L', 1, 1, 1, rackConfig),
+            buildLocationId(r, 'L', 5, 3, 1, rackConfig),
+            buildLocationId(r, 'R', 10, 5, 1, rackConfig)
+        ];
+        return html `
+      <fieldset fullwidth>
+        <div class="loc-grid">
+          <div class="section-title">Pattern</div>
+          <label>Format</label>
+          <input type="text" .value=${r.pattern} placeholder="{side}{bay}-{level}-{depth}"
+            @change=${(e) => { e.stopPropagation(); this._set('pattern', e.target.value); }} />
+
+          <label>Side labels</label>
+          <div class="side-labels">
+            L=<input type="text" .value=${r.sideLabels.L}
+              @change=${(e) => { e.stopPropagation(); this._setSideLabel('L', e.target.value); }} />
+            R=<input type="text" .value=${r.sideLabels.R}
+              @change=${(e) => { e.stopPropagation(); this._setSideLabel('R', e.target.value); }} />
+          </div>
+
+          <div class="section-title">Direction</div>
+          <label>Bay</label>
+          <select .value=${r.bayDir}
+            @change=${(e) => { e.stopPropagation(); this._set('bayDir', e.target.value); }}>
+            <option value="ltr">Left → Right</option>
+            <option value="rtl">Right → Left</option>
+          </select>
+
+          <label>Level</label>
+          <select .value=${r.levelDir}
+            @change=${(e) => { e.stopPropagation(); this._set('levelDir', e.target.value); }}>
+            <option value="btt">Bottom → Top</option>
+            <option value="ttb">Top → Bottom</option>
+          </select>
+
+          <div class="section-title">Start number</div>
+          <label>Bay start</label>
+          <input type="number" .value=${String(r.bayStart)} min="0" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('bayStart', Number(e.target.value)); }} />
+          <label>Level start</label>
+          <input type="number" .value=${String(r.levelStart)} min="0" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('levelStart', Number(e.target.value)); }} />
+          <label>Depth start</label>
+          <input type="number" .value=${String(r.depthStart)} min="0" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('depthStart', Number(e.target.value)); }} />
+
+          <div class="section-title">Digit padding</div>
+          <label>Bay digits</label>
+          <input type="number" .value=${String(r.bayDigits)} min="0" max="4" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('bayDigits', Number(e.target.value)); }} />
+          <label>Level digits</label>
+          <input type="number" .value=${String(r.levelDigits)} min="0" max="4" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('levelDigits', Number(e.target.value)); }} />
+          <label>Depth digits</label>
+          <input type="number" .value=${String(r.depthDigits)} min="0" max="4" step="1"
+            @change=${(e) => { e.stopPropagation(); this._set('depthDigits', Number(e.target.value)); }} />
+
+          <div class="preview">
+            <div class="preview-title">Preview (10 bays, 5 levels)</div>
+            <div class="preview-samples">
+              ${samples.map(s => html `<span class="preview-sample">${s}</span>`)}
+            </div>
+          </div>
+        </div>
+      </fieldset>
+    `;
+    }
+    _set(field, value) {
+        this._rule = { ...this._rule, [field]: value };
+        this._apply();
+    }
+    _setSideLabel(side, value) {
+        this._rule = { ...this._rule, sideLabels: { ...this._rule.sideLabels, [side]: value || side } };
+        this._apply();
+    }
+    _apply() {
+        const jsonValue = JSON.stringify(this._rule);
+        this.value = jsonValue;
+        this._lastExternalValue = jsonValue;
+        this.requestUpdate();
+        this.dispatchEvent(new CustomEvent('i-need-selected', {
+            bubbles: true, composed: true,
+            detail: { callback: (selected) => { selected[0]?.set('locationRule', jsonValue); } }
+        }));
+    }
+};
+__decorate([
+    state()
+], StockerLocationEditor.prototype, "_rule", void 0);
+StockerLocationEditor = __decorate([
+    customElement('property-editor-stocker-location')
+], StockerLocationEditor);
+export default StockerLocationEditor;
+//# sourceMappingURL=property-editor-stocker-location.js.map

package/dist/editors/property-editor-stocker-location.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"property-editor-stocker-location.js","sourceRoot":"","sources":["../../src/editors/property-editor-stocker-location.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Stocker Location Rule Editor\n */\n\nimport { css, html, TemplateResult } from 'lit'\nimport { customElement, state } from 'lit/decorators.js'\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\nimport type { LocationRule } from '../stocker.js'\nimport { DEFAULT_LOCATION_RULE, buildLocationId } from '../stocker.js'\n\n@customElement('property-editor-stocker-location')\nexport default class StockerLocationEditor extends OxPropertyEditor {\n  static styles = [\n    ...OxPropertyEditor.styles,\n    css`\n      .loc-grid { display: grid; grid-template-columns: 80px 1fr; gap: 3px 6px; font-size: 11px; align-items: center; }\n      .loc-grid label { color: #555; font-weight: 500; font-size: 10px; }\n      .loc-grid input, .loc-grid select {\n        width: 100%; box-sizing: border-box; font-size: 11px; padding: 3px 4px;\n        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #fff; color: #1c1b1f;\n      }\n      .loc-grid input[type=\"number\"] { width: 50px; }\n      .side-labels { display: flex; gap: 4px; align-items: center; font-size: 10px; }\n      .side-labels input { width: 30px; text-align: center; }\n      .section-title { grid-column: 1 / -1; font-weight: 600; font-size: 10px; color: #6750a4; margin-top: 6px; padding-bottom: 2px; border-bottom: 1px solid rgba(0,0,0,0.08); }\n      .preview { grid-column: 1 / -1; margin-top: 6px; padding: 6px 8px; background: #f3edf7; border-radius: 6px; font-family: monospace; font-size: 11px; }\n      .preview-title { font-size: 9px; font-weight: 600; color: #555; margin-bottom: 3px; }\n      .preview-samples { display: flex; flex-wrap: wrap; gap: 4px; }\n      .preview-sample { padding: 1px 5px; background: #fff; border-radius: 3px; font-size: 10px; }\n    `\n  ]\n\n  @state() private declare _rule: LocationRule\n  private _lastExternalValue: any = undefined\n\n  constructor() {\n    super()\n    this._rule = { ...DEFAULT_LOCATION_RULE }\n  }\n\n  private _parseValue(value: any): LocationRule {\n    if (!value) return { ...DEFAULT_LOCATION_RULE }\n    if (typeof value === 'string') {\n      try { return { ...DEFAULT_LOCATION_RULE, ...JSON.parse(value) } } catch { return { ...DEFAULT_LOCATION_RULE } }\n    }\n    return { ...DEFAULT_LOCATION_RULE, ...value }\n  }\n\n  editorTemplate(value: any, _spec: PropertySpec): TemplateResult {\n    const serialized = typeof value === 'string' ? value : JSON.stringify(value)\n    if (serialized !== this._lastExternalValue) {\n      this._lastExternalValue = serialized\n      this._rule = this._parseValue(value)\n    }\n\n    const r = this._rule\n    const rackConfig = { bays: 10, levels: 5, depthCount: 1 }\n    const samples = [\n      buildLocationId(r, 'L', 1, 1, 1, rackConfig),\n      buildLocationId(r, 'L', 5, 3, 1, rackConfig),\n      buildLocationId(r, 'R', 10, 5, 1, rackConfig)\n    ]\n\n    return html`\n      <fieldset fullwidth>\n        <div class=\"loc-grid\">\n          <div class=\"section-title\">Pattern</div>\n          <label>Format</label>\n          <input type=\"text\" .value=${r.pattern} placeholder=\"{side}{bay}-{level}-{depth}\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('pattern', (e.target as HTMLInputElement).value) }} />\n\n          <label>Side labels</label>\n          <div class=\"side-labels\">\n            L=<input type=\"text\" .value=${r.sideLabels.L}\n              @change=${(e: Event) => { e.stopPropagation(); this._setSideLabel('L', (e.target as HTMLInputElement).value) }} />\n            R=<input type=\"text\" .value=${r.sideLabels.R}\n              @change=${(e: Event) => { e.stopPropagation(); this._setSideLabel('R', (e.target as HTMLInputElement).value) }} />\n          </div>\n\n          <div class=\"section-title\">Direction</div>\n          <label>Bay</label>\n          <select .value=${r.bayDir}\n            @change=${(e: Event) => { e.stopPropagation(); this._set('bayDir', (e.target as HTMLSelectElement).value) }}>\n            <option value=\"ltr\">Left → Right</option>\n            <option value=\"rtl\">Right → Left</option>\n          </select>\n\n          <label>Level</label>\n          <select .value=${r.levelDir}\n            @change=${(e: Event) => { e.stopPropagation(); this._set('levelDir', (e.target as HTMLSelectElement).value) }}>\n            <option value=\"btt\">Bottom → Top</option>\n            <option value=\"ttb\">Top → Bottom</option>\n          </select>\n\n          <div class=\"section-title\">Start number</div>\n          <label>Bay start</label>\n          <input type=\"number\" .value=${String(r.bayStart)} min=\"0\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('bayStart', Number((e.target as HTMLInputElement).value)) }} />\n          <label>Level start</label>\n          <input type=\"number\" .value=${String(r.levelStart)} min=\"0\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('levelStart', Number((e.target as HTMLInputElement).value)) }} />\n          <label>Depth start</label>\n          <input type=\"number\" .value=${String(r.depthStart)} min=\"0\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('depthStart', Number((e.target as HTMLInputElement).value)) }} />\n\n          <div class=\"section-title\">Digit padding</div>\n          <label>Bay digits</label>\n          <input type=\"number\" .value=${String(r.bayDigits)} min=\"0\" max=\"4\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('bayDigits', Number((e.target as HTMLInputElement).value)) }} />\n          <label>Level digits</label>\n          <input type=\"number\" .value=${String(r.levelDigits)} min=\"0\" max=\"4\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('levelDigits', Number((e.target as HTMLInputElement).value)) }} />\n          <label>Depth digits</label>\n          <input type=\"number\" .value=${String(r.depthDigits)} min=\"0\" max=\"4\" step=\"1\"\n            @change=${(e: Event) => { e.stopPropagation(); this._set('depthDigits', Number((e.target as HTMLInputElement).value)) }} />\n\n          <div class=\"preview\">\n            <div class=\"preview-title\">Preview (10 bays, 5 levels)</div>\n            <div class=\"preview-samples\">\n              ${samples.map(s => html`<span class=\"preview-sample\">${s}</span>`)}\n            </div>\n          </div>\n        </div>\n      </fieldset>\n    `\n  }\n\n  private _set(field: string, value: any) {\n    this._rule = { ...this._rule, [field]: value }\n    this._apply()\n  }\n\n  private _setSideLabel(side: 'L' | 'R', value: string) {\n    this._rule = { ...this._rule, sideLabels: { ...this._rule.sideLabels, [side]: value || side } }\n    this._apply()\n  }\n\n  private _apply() {\n    const jsonValue = JSON.stringify(this._rule)\n    this.value = jsonValue\n    this._lastExternalValue = jsonValue\n    this.requestUpdate()\n\n    this.dispatchEvent(new CustomEvent('i-need-selected', {\n      bubbles: true, composed: true,\n      detail: { callback: (selected: any[]) => { selected[0]?.set('locationRule', jsonValue) } }\n    }))\n  }\n}\n"]}

package/dist/editors/property-editor-stocker-ports.d.ts

@@ -0,0 +1,8 @@
+import { TemplateResult } from 'lit';
+import { OxPropertyEditor, PropertySpec } from '@operato/property-editor';
+export default class StockerPortsEditor extends OxPropertyEditor {
+    static styles: import("lit").CSSResult[];
+    editorTemplate(value: any, _spec: PropertySpec): TemplateResult;
+    private _set;
+    private _applyPorts;
+}

package/dist/editors/property-editor-stocker-ports.js

@@ -0,0 +1,112 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ *
+ * Stocker Port Configuration Editor
+ *
+ * 주의: OxPropertyEditor base class가 모든 change 이벤트를 잡아서
+ * this.value를 덮어쓰므로, 내부 input/select의 change 이벤트 버블링을 차단해야 함.
+ */
+import { __decorate } from "tslib";
+import { css, html } from 'lit';
+import { customElement } from 'lit/decorators.js';
+import { OxPropertyEditor } from '@operato/property-editor';
+function parsePorts(value) {
+    if (!value)
+        return [];
+    if (Array.isArray(value))
+        return value;
+    if (typeof value === 'string') {
+        try {
+            const parsed = JSON.parse(value);
+            return Array.isArray(parsed) ? parsed : [];
+        }
+        catch {
+            return [];
+        }
+    }
+    return [];
+}
+let StockerPortsEditor = class StockerPortsEditor extends OxPropertyEditor {
+    static styles = [
+        ...OxPropertyEditor.styles,
+        css `
+      .port-table { width: 100%; font-size: 11px; border-collapse: collapse; }
+      .port-table th { text-align: left; padding: 3px 4px; font-weight: 600; color: #555; border-bottom: 1px solid rgba(0,0,0,0.12); font-size: 10px; }
+      .port-table td { padding: 2px 3px; vertical-align: middle; }
+      .port-table select, .port-table input {
+        width: 100%; box-sizing: border-box; font-size: 11px; padding: 3px 4px;
+        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #fff; color: #1c1b1f;
+      }
+      .port-table input[type="number"] { width: 50px; }
+      .port-table input[type="text"] { width: 60px; }
+      .btn-row { display: flex; gap: 4px; margin-top: 4px; }
+      .btn {
+        padding: 3px 8px; font-size: 10px; cursor: pointer;
+        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #f3edf7; color: #1c1b1f;
+      }
+      .btn:hover { background: #ece6f0; }
+      .btn-remove { color: #b3261e; cursor: pointer; font-size: 14px; padding: 0 4px; background: none; border: none; }
+    `
+    ];
+    editorTemplate(value, _spec) {
+        const ports = Array.isArray(this.value) ? this.value : parsePorts(value);
+        return html `
+      <fieldset fullwidth>
+        ${ports.length > 0 ? html `
+          <table class="port-table">
+            <thead><tr><th>Type</th><th>Side</th><th>Pos</th><th>Label</th><th></th></tr></thead>
+            <tbody>
+              ${ports.map((port, i) => html `
+                <tr>
+                  <td><select @change=${(e) => { e.stopPropagation(); this._set(ports, i, 'type', e.target.value); }}>
+                    <option value="in" ?selected=${port.type === 'in'}>IN</option>
+                    <option value="out" ?selected=${port.type === 'out'}>OUT</option>
+                  </select></td>
+                  <td><select @change=${(e) => { e.stopPropagation(); this._set(ports, i, 'side', e.target.value); }}>
+                    <option value="front" ?selected=${port.side === 'front'}>Front</option>
+                    <option value="back" ?selected=${port.side === 'back'}>Back</option>
+                  </select></td>
+                  <td><input type="number" .value=${String(port.position)} min="1" step="1"
+                    @change=${(e) => { e.stopPropagation(); this._set(ports, i, 'position', Number(e.target.value)); }} /></td>
+                  <td><input type="text" .value=${port.label || ''} placeholder="auto"
+                    @change=${(e) => { e.stopPropagation(); this._set(ports, i, 'label', e.target.value || undefined); }} /></td>
+                  <td><button class="btn-remove" @click=${() => this._applyPorts(ports.filter((_, j) => j !== i))}>&times;</button></td>
+                </tr>
+              `)}
+            </tbody>
+          </table>
+        ` : html `<div style="font-size:11px;color:#888;padding:4px">No ports</div>`}
+        <div class="btn-row">
+          <button class="btn" @click=${() => {
+            const maxPos = ports.length > 0 ? Math.max(...ports.map(p => p.position)) : 0;
+            this._applyPorts([...ports, { type: 'in', side: 'front', position: maxPos + 1 }]);
+        }}>+ IN</button>
+          <button class="btn" @click=${() => {
+            const maxPos = ports.length > 0 ? Math.max(...ports.map(p => p.position)) : 0;
+            this._applyPorts([...ports, { type: 'out', side: 'front', position: maxPos + 1 }]);
+        }}>+ OUT</button>
+        </div>
+      </fieldset>
+    `;
+    }
+    _set(ports, index, field, val) {
+        this._applyPorts(ports.map((p, i) => i === index ? { ...p, [field]: val } : p));
+    }
+    _applyPorts(ports) {
+        this.value = ports;
+        this.requestUpdate();
+        this.dispatchEvent(new CustomEvent('i-need-selected', {
+            bubbles: true, composed: true,
+            detail: {
+                callback: (selected) => {
+                    selected[0]?.set('ports', JSON.stringify(ports));
+                }
+            }
+        }));
+    }
+};
+StockerPortsEditor = __decorate([
+    customElement('property-editor-stocker-ports')
+], StockerPortsEditor);
+export default StockerPortsEditor;
+//# sourceMappingURL=property-editor-stocker-ports.js.map

package/dist/editors/property-editor-stocker-ports.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"property-editor-stocker-ports.js","sourceRoot":"","sources":["../../src/editors/property-editor-stocker-ports.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Stocker Port Configuration Editor\n *\n * 주의: OxPropertyEditor base class가 모든 change 이벤트를 잡아서\n * this.value를 덮어쓰므로, 내부 input/select의 change 이벤트 버블링을 차단해야 함.\n */\n\nimport { css, html, TemplateResult } from 'lit'\nimport { customElement } from 'lit/decorators.js'\nimport { OxPropertyEditor, PropertySpec } from '@operato/property-editor'\n\ninterface PortEntry {\n  type: 'in' | 'out'\n  side: 'front' | 'back'\n  position: number\n  label?: string\n}\n\nfunction parsePorts(value: any): PortEntry[] {\n  if (!value) return []\n  if (Array.isArray(value)) return value\n  if (typeof value === 'string') {\n    try {\n      const parsed = JSON.parse(value)\n      return Array.isArray(parsed) ? parsed : []\n    } catch { return [] }\n  }\n  return []\n}\n\n@customElement('property-editor-stocker-ports')\nexport default class StockerPortsEditor extends OxPropertyEditor {\n  static styles = [\n    ...OxPropertyEditor.styles,\n    css`\n      .port-table { width: 100%; font-size: 11px; border-collapse: collapse; }\n      .port-table th { text-align: left; padding: 3px 4px; font-weight: 600; color: #555; border-bottom: 1px solid rgba(0,0,0,0.12); font-size: 10px; }\n      .port-table td { padding: 2px 3px; vertical-align: middle; }\n      .port-table select, .port-table input {\n        width: 100%; box-sizing: border-box; font-size: 11px; padding: 3px 4px;\n        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #fff; color: #1c1b1f;\n      }\n      .port-table input[type=\"number\"] { width: 50px; }\n      .port-table input[type=\"text\"] { width: 60px; }\n      .btn-row { display: flex; gap: 4px; margin-top: 4px; }\n      .btn {\n        padding: 3px 8px; font-size: 10px; cursor: pointer;\n        border: 1px solid rgba(0,0,0,0.15); border-radius: 4px; background: #f3edf7; color: #1c1b1f;\n      }\n      .btn:hover { background: #ece6f0; }\n      .btn-remove { color: #b3261e; cursor: pointer; font-size: 14px; padding: 0 4px; background: none; border: none; }\n    `\n  ]\n\n  editorTemplate(value: any, _spec: PropertySpec): TemplateResult {\n    const ports: PortEntry[] = Array.isArray(this.value) ? this.value : parsePorts(value)\n\n    return html`\n      <fieldset fullwidth>\n        ${ports.length > 0 ? html`\n          <table class=\"port-table\">\n            <thead><tr><th>Type</th><th>Side</th><th>Pos</th><th>Label</th><th></th></tr></thead>\n            <tbody>\n              ${ports.map((port, i) => html`\n                <tr>\n                  <td><select @change=${(e: Event) => { e.stopPropagation(); this._set(ports, i, 'type', (e.target as HTMLSelectElement).value) }}>\n                    <option value=\"in\" ?selected=${port.type === 'in'}>IN</option>\n                    <option value=\"out\" ?selected=${port.type === 'out'}>OUT</option>\n                  </select></td>\n                  <td><select @change=${(e: Event) => { e.stopPropagation(); this._set(ports, i, 'side', (e.target as HTMLSelectElement).value) }}>\n                    <option value=\"front\" ?selected=${port.side === 'front'}>Front</option>\n                    <option value=\"back\" ?selected=${port.side === 'back'}>Back</option>\n                  </select></td>\n                  <td><input type=\"number\" .value=${String(port.position)} min=\"1\" step=\"1\"\n                    @change=${(e: Event) => { e.stopPropagation(); this._set(ports, i, 'position', Number((e.target as HTMLInputElement).value)) }} /></td>\n                  <td><input type=\"text\" .value=${port.label || ''} placeholder=\"auto\"\n                    @change=${(e: Event) => { e.stopPropagation(); this._set(ports, i, 'label', (e.target as HTMLInputElement).value || undefined) }} /></td>\n                  <td><button class=\"btn-remove\" @click=${() => this._applyPorts(ports.filter((_, j) => j !== i))}>&times;</button></td>\n                </tr>\n              `)}\n            </tbody>\n          </table>\n        ` : html`<div style=\"font-size:11px;color:#888;padding:4px\">No ports</div>`}\n        <div class=\"btn-row\">\n          <button class=\"btn\" @click=${() => {\n            const maxPos = ports.length > 0 ? Math.max(...ports.map(p => p.position)) : 0\n            this._applyPorts([...ports, { type: 'in' as const, side: 'front' as const, position: maxPos + 1 }])\n          }}>+ IN</button>\n          <button class=\"btn\" @click=${() => {\n            const maxPos = ports.length > 0 ? Math.max(...ports.map(p => p.position)) : 0\n            this._applyPorts([...ports, { type: 'out' as const, side: 'front' as const, position: maxPos + 1 }])\n          }}>+ OUT</button>\n        </div>\n      </fieldset>\n    `\n  }\n\n  private _set(ports: PortEntry[], index: number, field: string, val: any) {\n    this._applyPorts(ports.map((p, i) => i === index ? { ...p, [field]: val } : p))\n  }\n\n  private _applyPorts(ports: PortEntry[]) {\n    this.value = ports\n    this.requestUpdate()\n\n    this.dispatchEvent(new CustomEvent('i-need-selected', {\n      bubbles: true, composed: true,\n      detail: {\n        callback: (selected: any[]) => {\n          selected[0]?.set('ports', JSON.stringify(ports))\n        }\n      }\n    }))\n  }\n}\n"]}

package/dist/index.d.ts

@@ -5,6 +5,9 @@ export * from './rack-table-cell.js';
 export * from './visualizer.js';
 export * from './stock.js';
 export * from './signal-tower.js';
+export * from './stock-hub.js';
 export * from './tank.js';
 export * from './vehicle.js';
 export * from './carrier.js';
+export * from './stocker.js';
+export * from './stocker-port.js';

package/dist/index.js

@@ -10,7 +10,10 @@ export * from './rack-table-cell.js';
 export * from './visualizer.js';
 export * from './stock.js';
 export * from './signal-tower.js';
+export * from './stock-hub.js';
 export * from './tank.js';
 export * from './vehicle.js';
 export * from './carrier.js';
+export * from './stocker.js';
+export * from './stocker-port.js';
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,6CAA6C;AAC7C,2BAA2B;AAE3B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,sBAAsB,CAAA;AACpC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,YAAY,CAAA;AAC1B,cAAc,mBAAmB,CAAA;AACjC,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n// threed 인프라 + 범용 3D 컴포넌트는 things-scene에서 제공\n// 여기서는 도메인 특화 컴포넌트만 export\n\nexport * from './desk.js'\nexport * from './rack.js'\nexport * from './rack-table.js'\nexport * from './rack-table-cell.js'\nexport * from './visualizer.js'\nexport * from './stock.js'\nexport * from './signal-tower.js'\nexport * from './tank.js'\nexport * from './vehicle.js'\nexport * from './carrier.js'\n"]}
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,6CAA6C;AAC7C,2BAA2B;AAE3B,cAAc,WAAW,CAAA;AACzB,cAAc,WAAW,CAAA;AACzB,cAAc,iBAAiB,CAAA;AAC/B,cAAc,sBAAsB,CAAA;AACpC,cAAc,iBAAiB,CAAA;AAC/B,cAAc,YAAY,CAAA;AAC1B,cAAc,mBAAmB,CAAA;AACjC,cAAc,gBAAgB,CAAA;AAC9B,cAAc,WAAW,CAAA;AACzB,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,cAAc,CAAA;AAC5B,cAAc,mBAAmB,CAAA","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\n// threed 인프라 + 범용 3D 컴포넌트는 things-scene에서 제공\n// 여기서는 도메인 특화 컴포넌트만 export\n\nexport * from './desk.js'\nexport * from './rack.js'\nexport * from './rack-table.js'\nexport * from './rack-table-cell.js'\nexport * from './visualizer.js'\nexport * from './stock.js'\nexport * from './signal-tower.js'\nexport * from './stock-hub.js'\nexport * from './tank.js'\nexport * from './vehicle.js'\nexport * from './carrier.js'\nexport * from './stocker.js'\nexport * from './stocker-port.js'\n"]}

package/dist/rack-table-3d.js

@@ -40,6 +40,7 @@ export class RackTable3d extends RealObjectGroup {
             if (!isEmpty) {
                 cell.setState('shelfLocations', shelfLoc);
                 const rack = new Rack(cell);
+                cell._realObject = rack; // 중복 생성 방지: addObject 재귀에서 skip
                 rack.update();
                 this.object3d.add(rack.object3d);
                 return rack;

package/dist/rack-table-3d.js.map

@@ -1 +1 @@
-{"version":3,"file":"rack-table-3d.js","sourceRoot":"","sources":["../src/rack-table-3d.ts"],"names":[],"mappings":"AAAA;;GAEG;AAEH,OAAO,KAAK,KAAK,MAAM,OAAO,CAAA;AAC9B,OAAO,KAAK,mBAAmB,MAAM,iDAAiD,CAAA;AACtF,OAAO,EAAa,eAAe,EAAE,MAAM,wBAAwB,CAAA;AAEnE,OAAO,EAAE,IAAI,EAAE,MAAM,WAAW,CAAA;AAGhC,MAAM,mBAAmB,GAAG,QAAQ,CAAA;AAEpC,MAAM,OAAO,WAAY,SAAQ,eAAe;IACtC,cAAc,CAA6B;IAEnD,KAAK;QACH,KAAK,CAAC,KAAK,EAAE,CAAA;QAEb,IAAI,CAAC,WAAW,EAAE,CAAA;IACpB,CAAC;IAED,IAAI,QAAQ;QACV,MAAM,EAAE,IAAI,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAEzC,OAAO;YACL,CAAC,EAAE,IAAI,CAAC,EAAE,IAAI,CAAC;YACf,CAAC,EAAE,IAAI;YACP,CAAC,EAAE,IAAI,CAAC,EAAE,IAAI,CAAC;SAChB,CAAA;IACH,CAAC;IAEO,mBAAmB;QACzB,IAAI,CAAC,cAAc,EAAE,OAAO,EAAE,CAAA;QAE9B,MAAM,EAAE,WAAW,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAC5C,MAAM,KAAK,GAAG,WAAW,IAAI,OAAO,WAAW,KAAK,QAAQ,CAAC,CAAC,CAAC,WAAW,CAAC,CAAC,CAAC,mBAAmB,CAAA;QAEhG,IAAI,CAAC,cAAc,GAAG,IAAI,KAAK,CAAC,oBAAoB,CAAC;YACnD,KAAK;YACL,SAAS,EAAE,IAAI;YACf,SAAS,EAAE,IAAI;SAChB,CAAC,CAAA;QAEF,OAAO,IAAI,CAAC,cAAc,CAAA;IAC5B,CAAC;IAED,WAAW;QACT,MAAM,EAAE,QAAQ,GAAG,CAAC,EAAE,cAAc,EAAE,OAAO,GAAG,CAAC,EAAE,GAAG,IAAI,CAAC,SAAS,CAAC,KAAK,CAAA;QAE1E,IAAI,CAAC,QAAQ,CAAC,QAAQ,CAAC,CAAC,GAAG,CAAC,QAAQ,CAAA;QAEpC,MAAM,KAAK,GAAI,IAAI,CAAC,SAAkC,CAAC,UAAU;aAC9D,GAAG,CAAC,CAAC,IAAe,EAAE,EAAE;YACvB,MAAM,EAAE,cAAc,EAAE,QAAQ,GAAG,cAAc,EAAE,OAAO,EAAE,GAAG,IAAI,CAAC,KAAK,CAAA;YAEzE,IAAI,CAAC,OAAO,EAAE,CAAC;gBACb,IAAI,CAAC,QAAQ,CAAC,gBAAgB,EAAE,QAAQ,CAAC,CAAA;gBAEzC,MAAM,IAAI,GAAG,IAAI,IAAI,CAAC,IAAI,CAAC,CAAA;gBAE3B,IAAI,CAAC,MAAM,EAAE,CAAA;gBACb,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;gBAEhC,OAAO,IAAI,CAAA;YACb,CAAC;YACD,OAAM;QACR,CAAC,CAAC;aACD,MAAM,CAAC,CAAC,IAAI,EAAgB,EAAE,CAAC,CAAC,CAAC,IAAI,CAAC,CAAA;QAEzC,IAAI,CAAC,4BAA4B,CAAC,KAAK,CAAC,CAAA;IAC1C,CAAC;IAED,4BAA4B,CAAC,KAAa;QACxC,MAAM,gBAAgB,GAA2B,EAAE,CAAA;QACnD,MAAM,gBAAgB,GAA2B,EAAE,CAAA;QAEnD,IAAI,KAAK,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;YACrB,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAA;gBAE3B,IAAI,CAAC,QAAQ,EAAE,CAAC;oBACd,OAAM;gBACR,CAAC;gBAED,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;gBACrE,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;gBACxD,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;YACjC,CAAC,CAAC,CAAA;YAEF,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAChC,MAAM,SAAS,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,eAAe,CAAC,gBAAgB,CAAC,EAAE,IAAI,CAAC,mBAAmB,EAAE,CAAC,CAAA;gBACnH,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;YAC9B,CAAC;YAED,KAAK,CAAC,OAAO,CAAC,IAAI,CAAC,EAAE;gBACnB,MAAM,QAAQ,GAAG,IAAI,CAAC,KAAK,CAAA;gBAE3B,IAAI,CAAC,QAAQ,EAAE,CAAC;oBACd,OAAM;gBACR,CAAC;gBAED,QAAQ,CAAC,SAAS,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC,CAAC,CAAA;gBACrE,QAAQ,CAAC,KAAK,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,EAAE,IAAI,CAAC,KAAK,CAAC,CAAC,CAAC,CAAA;gBACxD,gBAAgB,CAAC,IAAI,CAAC,QAAQ,CAAC,CAAA;YACjC,CAAC,CAAC,CAAA;YAEF,IAAI,gBAAgB,CAAC,MAAM,GAAG,CAAC,EAAE,CAAC;gBAChC,MAAM,QAAQ,GAAG,IAAI,CAAC,aAAa,CAAA;gBACnC,QAAQ,CAAC,OAAO,GAAG,GAAG,CAAA;gBACtB,QAAQ,CAAC,WAAW,GAAG,IAAI,CAAA;gBAE3B,MAAM,SAAS,GAAG,IAAI,KAAK,CAAC,IAAI,CAAC,mBAAmB,CAAC,eAAe,CAAC,gBAAgB,CAAC,EAAE,QAAQ,CAAC,CAAA;gBAEjG,IAAI,CAAC,QAAQ,CAAC,GAAG,CAAC,SAAS,CAAC,CAAA;YAC9B,CAAC;QACH,CAAC;IACH,CAAC;IAED,OAAO;QACL,IAAI,CAAC,cAAc,EAAE,OAAO,EAAE,CAAA;QAC9B,IAAI,CAAC,cAAc,GAAG,SAAS,CAAA;QAE/B,KAAK,CAAC,OAAO,EAAE,CAAA;IACjB,CAAC;IAED,WAAW,KAAI,CAAC;CACjB","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'\nimport { Component, RealObjectGroup } from '@hatiolab/things-scene'\n\nimport { Rack } from './rack.js'\nimport type { RackTable } from './rack-table.js'\n\nconst DEFAULT_FRAME_COLOR = 0x8a8a8a\n\nexport class RackTable3d extends RealObjectGroup {\n  private _frameMaterial?: THREE.MeshStandardMaterial\n\n  build() {\n    super.build()\n\n    this.createRacks()\n  }\n\n  get position() {\n    const { zPos = 0 } = this.component.state\n\n    return {\n      x: this.cx || 0,\n      y: zPos,\n      z: this.cy || 0\n    }\n  }\n\n  private createFrameMaterial(): THREE.MeshStandardMaterial {\n    this._frameMaterial?.dispose()\n\n    const { strokeStyle } = this.component.state\n    const color = strokeStyle && typeof strokeStyle === 'string' ? strokeStyle : DEFAULT_FRAME_COLOR\n\n    this._frameMaterial = new THREE.MeshStandardMaterial({\n      color,\n      roughness: 0.35,\n      metalness: 0.85\n    })\n\n    return this._frameMaterial\n  }\n\n  createRacks() {\n    const { rotation = 0, shelfLocations, shelves = 1 } = this.component.state\n\n    this.object3d.rotation.y = -rotation\n\n    const racks = (this.component as unknown as RackTable).components\n      .map((cell: Component) => {\n        const { shelfLocations: shelfLoc = shelfLocations, isEmpty } = cell.state\n\n        if (!isEmpty) {\n          cell.setState('shelfLocations', shelfLoc)\n\n          const rack = new Rack(cell)\n\n          rack.update()\n          this.object3d.add(rack.object3d)\n\n          return rack\n        }\n        return\n      })\n      .filter((rack): rack is Rack => !!rack)\n\n    this.mergeAndAddRackCommonObjects(racks)\n  }\n\n  mergeAndAddRackCommonObjects(racks: Rack[]) {\n    const framesGeometries: THREE.BufferGeometry[] = []\n    const boardsGeometries: THREE.BufferGeometry[] = []\n\n    if (racks.length > 0) {\n      racks.forEach(rack => {\n        const geometry = rack.frame\n\n        if (!geometry) {\n          return\n        }\n\n        geometry.translate(rack.position.x, rack.position.y, rack.position.z)\n        geometry.scale(rack.scale.x, rack.scale.y, rack.scale.z)\n        framesGeometries.push(geometry)\n      })\n\n      if (framesGeometries.length > 0) {\n        const frameMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(framesGeometries), this.createFrameMaterial())\n        this.object3d.add(frameMesh)\n      }\n\n      racks.forEach(rack => {\n        const geometry = rack.board\n\n        if (!geometry) {\n          return\n        }\n\n        geometry.translate(rack.position.x, rack.position.y, rack.position.z)\n        geometry.scale(rack.scale.x, rack.scale.y, rack.scale.z)\n        boardsGeometries.push(geometry)\n      })\n\n      if (boardsGeometries.length > 0) {\n        const material = Rack.boardMaterial\n        material.opacity = 0.5\n        material.transparent = true\n\n        const boardMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(boardsGeometries), material)\n\n        this.object3d.add(boardMesh)\n      }\n    }\n  }\n\n  dispose() {\n    this._frameMaterial?.dispose()\n    this._frameMaterial = undefined\n\n    super.dispose()\n  }\n\n  updateAlpha() {}\n}\n"]}
+{"version":3,"file":"rack-table-3d.js","sourceRoot":"","sources":["../src/rack-table-3d.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n */\n\nimport * as THREE from 'three'\nimport * as BufferGeometryUtils from 'three/examples/jsm/utils/BufferGeometryUtils.js'\nimport { Component, RealObjectGroup } from '@hatiolab/things-scene'\n\nimport { Rack } from './rack.js'\nimport type { RackTable } from './rack-table.js'\n\nconst DEFAULT_FRAME_COLOR = 0x8a8a8a\n\nexport class RackTable3d extends RealObjectGroup {\n  private _frameMaterial?: THREE.MeshStandardMaterial\n\n  build() {\n    super.build()\n\n    this.createRacks()\n  }\n\n  get position() {\n    const { zPos = 0 } = this.component.state\n\n    return {\n      x: this.cx || 0,\n      y: zPos,\n      z: this.cy || 0\n    }\n  }\n\n  private createFrameMaterial(): THREE.MeshStandardMaterial {\n    this._frameMaterial?.dispose()\n\n    const { strokeStyle } = this.component.state\n    const color = strokeStyle && typeof strokeStyle === 'string' ? strokeStyle : DEFAULT_FRAME_COLOR\n\n    this._frameMaterial = new THREE.MeshStandardMaterial({\n      color,\n      roughness: 0.35,\n      metalness: 0.85\n    })\n\n    return this._frameMaterial\n  }\n\n  createRacks() {\n    const { rotation = 0, shelfLocations, shelves = 1 } = this.component.state\n\n    this.object3d.rotation.y = -rotation\n\n    const racks = (this.component as unknown as RackTable).components\n      .map((cell: Component) => {\n        const { shelfLocations: shelfLoc = shelfLocations, isEmpty } = cell.state\n\n        if (!isEmpty) {\n          cell.setState('shelfLocations', shelfLoc)\n\n          const rack = new Rack(cell)\n          cell._realObject = rack // 중복 생성 방지: addObject 재귀에서 skip\n\n          rack.update()\n          this.object3d.add(rack.object3d)\n\n          return rack\n        }\n        return\n      })\n      .filter((rack): rack is Rack => !!rack)\n\n    this.mergeAndAddRackCommonObjects(racks)\n  }\n\n  mergeAndAddRackCommonObjects(racks: Rack[]) {\n    const framesGeometries: THREE.BufferGeometry[] = []\n    const boardsGeometries: THREE.BufferGeometry[] = []\n\n    if (racks.length > 0) {\n      racks.forEach(rack => {\n        const geometry = rack.frame\n\n        if (!geometry) {\n          return\n        }\n\n        geometry.translate(rack.position.x, rack.position.y, rack.position.z)\n        geometry.scale(rack.scale.x, rack.scale.y, rack.scale.z)\n        framesGeometries.push(geometry)\n      })\n\n      if (framesGeometries.length > 0) {\n        const frameMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(framesGeometries), this.createFrameMaterial())\n        this.object3d.add(frameMesh)\n      }\n\n      racks.forEach(rack => {\n        const geometry = rack.board\n\n        if (!geometry) {\n          return\n        }\n\n        geometry.translate(rack.position.x, rack.position.y, rack.position.z)\n        geometry.scale(rack.scale.x, rack.scale.y, rack.scale.z)\n        boardsGeometries.push(geometry)\n      })\n\n      if (boardsGeometries.length > 0) {\n        const material = Rack.boardMaterial\n        material.opacity = 0.5\n        material.transparent = true\n\n        const boardMesh = new THREE.Mesh(BufferGeometryUtils.mergeGeometries(boardsGeometries), material)\n\n        this.object3d.add(boardMesh)\n      }\n    }\n  }\n\n  dispose() {\n    this._frameMaterial?.dispose()\n    this._frameMaterial = undefined\n\n    super.dispose()\n  }\n\n  updateAlpha() {}\n}\n"]}

package/dist/rack-table.js

@@ -245,6 +245,19 @@ let RackTable = class RackTable extends ContainerAbstract {
             this._legendTarget = this.root.findById?.(legendTarget);
             this._legendTarget?.on('change', this._onLegendChanged, this);
         }
+        // 하위호환: 자체 legendTarget이 없으면 부모(Visualizer)의 legendTarget 폴백
+        if (!this._legendTarget) {
+            let ancestor = this.parent;
+            while (ancestor) {
+                if (ancestor.legendTarget)
+                    return ancestor.legendTarget;
+                ancestor = ancestor.parent;
+            }
+            // 서비스 레지스트리 폴백: stock-hub의 legendTarget
+            const stockHub = this.root?.getService?.('stock');
+            if (stockHub?.legendTarget)
+                return stockHub.legendTarget;
+        }
         return this._legendTarget;
     }
     get hideEmptyStock() {