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

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

@@ -1,112 +0,0 @@
-/*
- * 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

@@ -1 +0,0 @@
-{"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"]}