@operato/property-panel 10.0.0-beta.7 → 10.0.0

package/dist/src/property-panel/inspector/inspector-controller.js

@@ -0,0 +1,288 @@
+import { buildInspectorIndex, matchesQuery } from './inspector-model.js';
+export class InspectorController {
+    constructor() {
+        this._extendedMap = new WeakMap();
+        /** 타입 그룹 뷰의 펼침 상태 — 그룹 키(type)는 안정적이라 Set 으로 관리. 기본 전부 접힘. */
+        this._expandedGroups = new Set();
+        /**
+         * 모델링 포커스 dim 처리된 그룹(타입) 집합.
+         * scene 에 보존(scene._inspectorDimmedTypes)하여 인스펙터 탭을 벗어났다 돌아와도 유지된다.
+         * (보드를 다시 열면 새 scene 이라 자연 초기화 — transient.) bind 에서 scene 것으로 재취득.
+         */
+        this._dimmedTypes = new Set();
+        this._invalidateAndRefresh = () => {
+            this._index = undefined;
+            this._refresh();
+        };
+        /** 선택된 컴포넌트의 조상을 펼치고 재렌더 요청. */
+        this._refresh = () => {
+            var _a, _b;
+            const selected = ((_a = this._scene) === null || _a === void 0 ? void 0 : _a.selected) || [];
+            selected.forEach((component) => {
+                let parent = component.parent;
+                while (parent && !this._extendedMap.get(parent)) {
+                    this._extendedMap.set(parent, true);
+                    parent = parent.parent;
+                }
+            });
+            (_b = this._onChange) === null || _b === void 0 ? void 0 : _b.call(this);
+        };
+    }
+    /** scene 에 바인딩 — 이전 바인딩은 해제한다. onChange 는 재렌더 요청 콜백. */
+    bind(scene, onChange) {
+        this.unbind();
+        this._scene = scene;
+        this._onChange = onChange;
+        this._index = undefined;
+        if (scene && scene.root) {
+            // dim 상태는 scene 에 보존 — 인스펙터 탭을 벗어났다 돌아와도(재마운트) 유지된다.
+            const anyScene = scene;
+            if (!anyScene._inspectorDimmedTypes)
+                anyScene._inspectorDimmedTypes = new Set();
+            this._dimmedTypes = anyScene._inspectorDimmedTypes;
+            this._applyFocusFilter(); // 보존된 dim 을 캔버스에 재적용 (idempotent)
+            scene.on('selected', this._refresh, this);
+            scene.on('execute', this._invalidateAndRefresh, this);
+            scene.on('undo', this._invalidateAndRefresh, this);
+            scene.on('redo', this._invalidateAndRefresh, this);
+            this._refresh();
+        }
+    }
+    unbind() {
+        const scene = this._scene;
+        if (scene) {
+            // dim(포커스 필터)은 편집 세션 동안 유지 — 인스펙터 탭을 벗어나도 해제하지 않는다.
+            // scene.focusFilter 와 scene._inspectorDimmedTypes 는 그대로 두고, 이벤트 구독만 해제.
+            // (보드를 다시 열면 새 scene 이라 자연 초기화된다.)
+            scene.off('selected', undefined, this);
+            scene.off('execute', undefined, this);
+            scene.off('undo', undefined, this);
+            scene.off('redo', undefined, this);
+        }
+        this._scene = undefined;
+        this._index = undefined;
+        this._extendedMap = new WeakMap();
+        // _dimmedTypes 는 scene 에 보존되므로 지우지 않는다. 로컬 참조만 분리(다음 bind 에서 재취득).
+        this._dimmedTypes = new Set();
+    }
+    get scene() {
+        return this._scene;
+    }
+    get selected() {
+        var _a;
+        return ((_a = this._scene) === null || _a === void 0 ? void 0 : _a.selected) || [];
+    }
+    /** 캐시된 모델 인덱스 — 없으면 build. execute/undo/redo 시 무효화. */
+    get index() {
+        var _a;
+        if (!((_a = this._scene) === null || _a === void 0 ? void 0 : _a.root))
+            return undefined;
+        if (!this._index)
+            this._index = buildInspectorIndex(this._scene.root);
+        return this._index;
+    }
+    isExtended(component) {
+        return !!this._extendedMap.get(component);
+    }
+    toggleExtended(component) {
+        var _a;
+        if (this.isExtended(component)) {
+            this._extendedMap.delete(component);
+        }
+        else {
+            this._extendedMap.set(component, true);
+        }
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 트리 노드 핸들(펼침/접힘/공백) 클래스. */
+    nodeHandleClass(component) {
+        if (component.isContainer() && component.components.length > 0) {
+            return this.isExtended(component) ? 'extended' : 'collapsed';
+        }
+        return 'collapsespace';
+    }
+    // ── 타입 그룹 뷰 확장 상태 ──
+    isGroupExpanded(type) {
+        return this._expandedGroups.has(type);
+    }
+    toggleGroup(type) {
+        var _a;
+        if (this._expandedGroups.has(type)) {
+            this._expandedGroups.delete(type);
+        }
+        else {
+            this._expandedGroups.add(type);
+        }
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 모든 그룹 접기 — "그룹 레벨까지만 펼침"(헤더만 표시). */
+    collapseAllGroups() {
+        var _a;
+        if (this._expandedGroups.size === 0)
+            return;
+        this._expandedGroups.clear();
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 모든 그룹 펼치기. */
+    expandAllGroups(types) {
+        var _a;
+        types.forEach(t => this._expandedGroups.add(t));
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    // ── 모델링 포커스 dim (그룹 단위, transient) ──
+    isTypeDimmed(type) {
+        return this._dimmedTypes.has(type);
+    }
+    /** 그룹(타입) dim-out 토글 → scene.focusFilter 재설정(편집 모드에서 캔버스 dim + pick 제외). */
+    toggleTypeDim(type) {
+        var _a;
+        if (this._dimmedTypes.has(type))
+            this._dimmedTypes.delete(type);
+        else
+            this._dimmedTypes.add(type);
+        this._applyFocusFilter();
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    _applyFocusFilter() {
+        if (!this._scene)
+            return;
+        if (this._dimmedTypes.size === 0) {
+            this._scene.focusFilter = undefined;
+        }
+        else {
+            const dimmed = this._dimmedTypes;
+            // focus(정상) = dim 집합에 없는 타입. 불일치(=dim 그룹)만 캔버스에서 흐림 + pick 제외.
+            this._scene.focusFilter = (component) => !dimmed.has(component.state.type);
+        }
+    }
+    // ── 그룹(타입) 단위 hidden 토글 (개별 hidden 의 집계 — dim 과 달리 영구 모델 속성) ──
+    /** 그룹 전원이 hidden 이면 true(집계). 멤버/트리 eye 규약과 동일한 아이콘 판정에 사용. */
+    isTypeHidden(type) {
+        var _a;
+        const entries = (_a = this._index) === null || _a === void 0 ? void 0 : _a.byType.get(type);
+        return !!entries && entries.length > 0 && entries.every(e => !!e.component.get('hidden'));
+    }
+    /** 그룹(타입) hidden 토글 → 하나라도 보이면 전원 숨김, 전원 숨김이면 전원 표시. */
+    toggleTypeHidden(type) {
+        var _a, _b;
+        const entries = (_a = this._index) === null || _a === void 0 ? void 0 : _a.byType.get(type);
+        if (!entries || entries.length === 0)
+            return;
+        const target = !entries.every(e => !!e.component.get('hidden'));
+        for (const e of entries)
+            e.component.set('hidden', target);
+        (_b = this._onChange) === null || _b === void 0 ? void 0 : _b.call(this);
+    }
+    /** 개별 컴포넌트 hidden(영구 모델 속성) 토글 — 기존 eye 동작. */
+    toggleHidden(component) {
+        var _a;
+        component.set('hidden', !component.get('hidden'));
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 개별 컴포넌트 locked(영구 모델 속성) 토글. */
+    toggleLocked(component) {
+        var _a;
+        component.set('locked', !component.get('locked'));
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 캔버스를 해당 컴포넌트로 센터 이동. */
+    centerTo(component) {
+        var _a, _b;
+        ;
+        (_b = (_a = this._scene) === null || _a === void 0 ? void 0 : _a.centerTo) === null || _b === void 0 ? void 0 : _b.call(_a, component, true);
+    }
+    /** 선택 — append(ctrl/cmd) 시 토글식 다중 선택. anchor 를 갱신한다. */
+    select(component, append = false) {
+        var _a;
+        const scene = this._scene;
+        if (!scene)
+            return;
+        const selected = scene.selected;
+        if (append) {
+            const idx = selected.findIndex((s) => s === component);
+            if (idx != -1) {
+                selected.splice(idx, 1);
+                scene.selected = [...selected];
+            }
+            else {
+                scene.selected = [...selected, component];
+            }
+        }
+        else {
+            scene.selected = [component];
+        }
+        this._anchor = component;
+        this._decorate(component);
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /**
+     * shift+click 범위(볼륨) 선택 — anchor↔target 사이의 **보이는 트리 행**을 블록 선택한다.
+     * target 이 이미 선택돼 있으면 그 범위를 블록 **해제**(additive/subtractive). anchor 는 유지.
+     */
+    selectRange(target, terms) {
+        var _a;
+        const scene = this._scene;
+        if (!scene)
+            return;
+        const order = this._visibleOrder(terms);
+        const ti = order.indexOf(target);
+        if (ti < 0)
+            return;
+        const ai = this._anchor ? order.indexOf(this._anchor) : -1;
+        if (ai < 0) {
+            // anchor 없음/보이지 않음 → 단일 토글로 폴백(+ anchor 설정)
+            this.select(target, true);
+            return;
+        }
+        const [lo, hi] = ai <= ti ? [ai, ti] : [ti, ai];
+        const range = order.slice(lo, hi + 1);
+        const rangeSet = new Set(range);
+        // target 이 이미 선택 상태면 블록 해제, 아니면 블록 선택.
+        if (scene.selected.indexOf(target) > -1) {
+            scene.selected = scene.selected.filter((c) => !rangeSet.has(c));
+            range.forEach(c => c.trigger('reactionreset'));
+        }
+        else {
+            const cur = new Set(scene.selected);
+            const next = [...scene.selected];
+            range.forEach(c => {
+                if (!cur.has(c))
+                    next.push(c);
+                this._decorate(c);
+            });
+            scene.selected = next;
+        }
+        // anchor 는 유지 — 연속 shift+click 으로 범위 확장/축소.
+        (_a = this._onChange) === null || _a === void 0 ? void 0 : _a.call(this);
+    }
+    /** 선택 강조. */
+    _decorate(component) {
+        component.trigger('reactionreset');
+        component.trigger('reaction');
+    }
+    /**
+     * 현재 트리 뷰에 보이는 컴포넌트를 렌더 순서대로 반환 — 범위 선택의 기준.
+     * renderNode 와 동일 규칙(shouldBeShown = 자신/자손 매치, isExtended 자식만 전개).
+     */
+    _visibleOrder(terms) {
+        var _a;
+        const root = (_a = this._scene) === null || _a === void 0 ? void 0 : _a.root;
+        if (!root)
+            return [];
+        const shown = (c) => matchesQuery(c, terms) ||
+            (c.isContainer() && c.components.some((child) => shown(child)));
+        const out = [];
+        const walk = (c) => {
+            if (!shown(c))
+                return;
+            out.push(c);
+            if (this.isExtended(c) && c.isContainer()) {
+                for (const child of c.components)
+                    walk(child);
+            }
+        };
+        walk(root);
+        return out;
+    }
+}
+//# sourceMappingURL=inspector-controller.js.map

package/dist/src/property-panel/inspector/inspector-controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspector-controller.js","sourceRoot":"","sources":["../../../../src/property-panel/inspector/inspector-controller.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Scene Inspector 컨트롤러.\n *\n * scene 과의 상호작용(구독·선택·가시성·확장 상태)과 모델 인덱스 캐시를 한 곳에 응집한다.\n * DOM 을 직접 다루지 않으며, 뷰 렌더러(트리/그룹)가 공유한다. 상태 변경 시 onChange 로\n * 호스트(LitElement)의 재렌더를 요청한다.\n */\nimport { Component, Container, Scene } from '@hatiolab/things-scene'\n\nimport { buildInspectorIndex, InspectorIndex, matchesQuery, SearchTerm } from './inspector-model.js'\n\nexport class InspectorController {\n  private _scene?: Scene\n  private _extendedMap = new WeakMap<Component, boolean>()\n  /** 타입 그룹 뷰의 펼침 상태 — 그룹 키(type)는 안정적이라 Set 으로 관리. 기본 전부 접힘. */\n  private _expandedGroups = new Set<string>()\n  /**\n   * 모델링 포커스 dim 처리된 그룹(타입) 집합.\n   * scene 에 보존(scene._inspectorDimmedTypes)하여 인스펙터 탭을 벗어났다 돌아와도 유지된다.\n   * (보드를 다시 열면 새 scene 이라 자연 초기화 — transient.) bind 에서 scene 것으로 재취득.\n   */\n  private _dimmedTypes = new Set<string>()\n  /** shift+click 범위(볼륨) 선택의 기준점 — 마지막 단일/토글 클릭. */\n  private _anchor?: Component\n  private _index?: InspectorIndex\n  private _onChange?: () => void\n\n  /** scene 에 바인딩 — 이전 바인딩은 해제한다. onChange 는 재렌더 요청 콜백. */\n  bind(scene: Scene | undefined, onChange: () => void): void {\n    this.unbind()\n    this._scene = scene\n    this._onChange = onChange\n    this._index = undefined\n\n    if (scene && scene.root) {\n      // dim 상태는 scene 에 보존 — 인스펙터 탭을 벗어났다 돌아와도(재마운트) 유지된다.\n      const anyScene = scene as any\n      if (!anyScene._inspectorDimmedTypes) anyScene._inspectorDimmedTypes = new Set<string>()\n      this._dimmedTypes = anyScene._inspectorDimmedTypes\n      this._applyFocusFilter() // 보존된 dim 을 캔버스에 재적용 (idempotent)\n\n      scene.on('selected', this._refresh, this)\n      scene.on('execute', this._invalidateAndRefresh, this)\n      scene.on('undo', this._invalidateAndRefresh, this)\n      scene.on('redo', this._invalidateAndRefresh, this)\n      this._refresh()\n    }\n  }\n\n  unbind(): void {\n    const scene = this._scene\n    if (scene) {\n      // dim(포커스 필터)은 편집 세션 동안 유지 — 인스펙터 탭을 벗어나도 해제하지 않는다.\n      // scene.focusFilter 와 scene._inspectorDimmedTypes 는 그대로 두고, 이벤트 구독만 해제.\n      // (보드를 다시 열면 새 scene 이라 자연 초기화된다.)\n      scene.off('selected', undefined, this)\n      scene.off('execute', undefined, this)\n      scene.off('undo', undefined, this)\n      scene.off('redo', undefined, this)\n    }\n    this._scene = undefined\n    this._index = undefined\n    this._extendedMap = new WeakMap()\n    // _dimmedTypes 는 scene 에 보존되므로 지우지 않는다. 로컬 참조만 분리(다음 bind 에서 재취득).\n    this._dimmedTypes = new Set<string>()\n  }\n\n  get scene(): Scene | undefined {\n    return this._scene\n  }\n\n  get selected(): Component[] {\n    return this._scene?.selected || []\n  }\n\n  /** 캐시된 모델 인덱스 — 없으면 build. execute/undo/redo 시 무효화. */\n  get index(): InspectorIndex | undefined {\n    if (!this._scene?.root) return undefined\n    if (!this._index) this._index = buildInspectorIndex(this._scene.root)\n    return this._index\n  }\n\n  private _invalidateAndRefresh = (): void => {\n    this._index = undefined\n    this._refresh()\n  }\n\n  /** 선택된 컴포넌트의 조상을 펼치고 재렌더 요청. */\n  private _refresh = (): void => {\n    const selected = this._scene?.selected || []\n    selected.forEach((component: Component) => {\n      let parent = component.parent\n      while (parent && !this._extendedMap.get(parent)) {\n        this._extendedMap.set(parent, true)\n        parent = parent.parent\n      }\n    })\n    this._onChange?.()\n  }\n\n  isExtended(component: Component): boolean {\n    return !!this._extendedMap.get(component)\n  }\n\n  toggleExtended(component: Component): void {\n    if (this.isExtended(component)) {\n      this._extendedMap.delete(component)\n    } else {\n      this._extendedMap.set(component, true)\n    }\n    this._onChange?.()\n  }\n\n  /** 트리 노드 핸들(펼침/접힘/공백) 클래스. */\n  nodeHandleClass(component: Component): string {\n    if (component.isContainer() && (component as Container).components.length > 0) {\n      return this.isExtended(component) ? 'extended' : 'collapsed'\n    }\n    return 'collapsespace'\n  }\n\n  // ── 타입 그룹 뷰 확장 상태 ──\n\n  isGroupExpanded(type: string): boolean {\n    return this._expandedGroups.has(type)\n  }\n\n  toggleGroup(type: string): void {\n    if (this._expandedGroups.has(type)) {\n      this._expandedGroups.delete(type)\n    } else {\n      this._expandedGroups.add(type)\n    }\n    this._onChange?.()\n  }\n\n  /** 모든 그룹 접기 — \"그룹 레벨까지만 펼침\"(헤더만 표시). */\n  collapseAllGroups(): void {\n    if (this._expandedGroups.size === 0) return\n    this._expandedGroups.clear()\n    this._onChange?.()\n  }\n\n  /** 모든 그룹 펼치기. */\n  expandAllGroups(types: string[]): void {\n    types.forEach(t => this._expandedGroups.add(t))\n    this._onChange?.()\n  }\n\n  // ── 모델링 포커스 dim (그룹 단위, transient) ──\n\n  isTypeDimmed(type: string): boolean {\n    return this._dimmedTypes.has(type)\n  }\n\n  /** 그룹(타입) dim-out 토글 → scene.focusFilter 재설정(편집 모드에서 캔버스 dim + pick 제외). */\n  toggleTypeDim(type: string): void {\n    if (this._dimmedTypes.has(type)) this._dimmedTypes.delete(type)\n    else this._dimmedTypes.add(type)\n    this._applyFocusFilter()\n    this._onChange?.()\n  }\n\n  private _applyFocusFilter(): void {\n    if (!this._scene) return\n    if (this._dimmedTypes.size === 0) {\n      this._scene.focusFilter = undefined\n    } else {\n      const dimmed = this._dimmedTypes\n      // focus(정상) = dim 집합에 없는 타입. 불일치(=dim 그룹)만 캔버스에서 흐림 + pick 제외.\n      this._scene.focusFilter = (component: Component) => !dimmed.has(component.state.type)\n    }\n  }\n\n  // ── 그룹(타입) 단위 hidden 토글 (개별 hidden 의 집계 — dim 과 달리 영구 모델 속성) ──\n\n  /** 그룹 전원이 hidden 이면 true(집계). 멤버/트리 eye 규약과 동일한 아이콘 판정에 사용. */\n  isTypeHidden(type: string): boolean {\n    const entries = this._index?.byType.get(type)\n    return !!entries && entries.length > 0 && entries.every(e => !!e.component.get('hidden'))\n  }\n\n  /** 그룹(타입) hidden 토글 → 하나라도 보이면 전원 숨김, 전원 숨김이면 전원 표시. */\n  toggleTypeHidden(type: string): void {\n    const entries = this._index?.byType.get(type)\n    if (!entries || entries.length === 0) return\n    const target = !entries.every(e => !!e.component.get('hidden'))\n    for (const e of entries) e.component.set('hidden', target)\n    this._onChange?.()\n  }\n\n  /** 개별 컴포넌트 hidden(영구 모델 속성) 토글 — 기존 eye 동작. */\n  toggleHidden(component: Component): void {\n    component.set('hidden', !component.get('hidden'))\n    this._onChange?.()\n  }\n\n  /** 개별 컴포넌트 locked(영구 모델 속성) 토글. */\n  toggleLocked(component: Component): void {\n    component.set('locked', !component.get('locked'))\n    this._onChange?.()\n  }\n\n  /** 캔버스를 해당 컴포넌트로 센터 이동. */\n  centerTo(component: Component): void {\n    ;(this._scene as unknown as { centerTo?: (c: Component, animated?: boolean) => void })?.centerTo?.(component, true)\n  }\n\n  /** 선택 — append(ctrl/cmd) 시 토글식 다중 선택. anchor 를 갱신한다. */\n  select(component: Component, append = false): void {\n    const scene = this._scene\n    if (!scene) return\n\n    const selected = scene.selected\n    if (append) {\n      const idx = selected.findIndex((s: Component) => s === component)\n      if (idx != -1) {\n        selected.splice(idx, 1)\n        scene.selected = [...selected]\n      } else {\n        scene.selected = [...selected, component]\n      }\n    } else {\n      scene.selected = [component]\n    }\n\n    this._anchor = component\n    this._decorate(component)\n    this._onChange?.()\n  }\n\n  /**\n   * shift+click 범위(볼륨) 선택 — anchor↔target 사이의 **보이는 트리 행**을 블록 선택한다.\n   * target 이 이미 선택돼 있으면 그 범위를 블록 **해제**(additive/subtractive). anchor 는 유지.\n   */\n  selectRange(target: Component, terms: SearchTerm[]): void {\n    const scene = this._scene\n    if (!scene) return\n\n    const order = this._visibleOrder(terms)\n    const ti = order.indexOf(target)\n    if (ti < 0) return\n\n    const ai = this._anchor ? order.indexOf(this._anchor) : -1\n    if (ai < 0) {\n      // anchor 없음/보이지 않음 → 단일 토글로 폴백(+ anchor 설정)\n      this.select(target, true)\n      return\n    }\n\n    const [lo, hi] = ai <= ti ? [ai, ti] : [ti, ai]\n    const range = order.slice(lo, hi + 1)\n    const rangeSet = new Set(range)\n\n    // target 이 이미 선택 상태면 블록 해제, 아니면 블록 선택.\n    if (scene.selected.indexOf(target) > -1) {\n      scene.selected = scene.selected.filter((c: Component) => !rangeSet.has(c))\n      range.forEach(c => c.trigger('reactionreset'))\n    } else {\n      const cur = new Set(scene.selected)\n      const next = [...scene.selected]\n      range.forEach(c => {\n        if (!cur.has(c)) next.push(c)\n        this._decorate(c)\n      })\n      scene.selected = next\n    }\n    // anchor 는 유지 — 연속 shift+click 으로 범위 확장/축소.\n    this._onChange?.()\n  }\n\n  /** 선택 강조. */\n  private _decorate(component: Component): void {\n    component.trigger('reactionreset')\n    component.trigger('reaction')\n  }\n\n  /**\n   * 현재 트리 뷰에 보이는 컴포넌트를 렌더 순서대로 반환 — 범위 선택의 기준.\n   * renderNode 와 동일 규칙(shouldBeShown = 자신/자손 매치, isExtended 자식만 전개).\n   */\n  private _visibleOrder(terms: SearchTerm[]): Component[] {\n    const root = this._scene?.root\n    if (!root) return []\n\n    const shown = (c: Component): boolean =>\n      matchesQuery(c, terms) ||\n      (c.isContainer() && (c as Container).components.some((child: Component) => shown(child)))\n\n    const out: Component[] = []\n    const walk = (c: Component) => {\n      if (!shown(c)) return\n      out.push(c)\n      if (this.isExtended(c) && c.isContainer()) {\n        for (const child of (c as Container).components) walk(child)\n      }\n    }\n    walk(root)\n    return out\n  }\n}\n"]}

package/dist/src/property-panel/inspector/inspector-group-view.d.ts

@@ -0,0 +1,15 @@
+import { Component } from '@hatiolab/things-scene';
+import { TemplateResult } from 'lit';
+import { InspectorIndex, SearchTerm } from './inspector-model.js';
+export interface GroupViewContext {
+    selected: Component[];
+    /** 파싱된 전역 검색어(AND). */
+    terms: SearchTerm[];
+    isGroupExpanded: (type: string) => boolean;
+    /** 그룹(타입)이 모델링 포커스 dim 처리됐는지. */
+    isTypeDimmed: (type: string) => boolean;
+    /** 그룹(타입) 전원이 hidden(숨김)인지 — 그룹 hidden 토글 아이콘 판정. */
+    isTypeHidden: (type: string) => boolean;
+}
+/** 타입 그룹 뷰 전체 렌더 — 타입명 오름차순. */
+export declare function renderInspectorGroupView(index: InspectorIndex | undefined, ctx: GroupViewContext): TemplateResult;

package/dist/src/property-panel/inspector/inspector-group-view.js

@@ -0,0 +1,59 @@
+import { html, nothing } from 'lit';
+import { matchesQuery } from './inspector-model.js';
+import { highlight } from './inspector-highlight.js';
+function renderMember(entry, terms, selected) {
+    const component = entry.component;
+    return html `
+    <div class="component group-member" ?selected=${selected.indexOf(component) > -1} .component=${component}>
+      <span>
+        <md-icon class="eye">${component.get('hidden') ? 'visibility_off' : 'visibility'}</md-icon>
+        <md-icon class="lock" ?locked=${!!component.get('locked')}
+          >${component.get('locked') ? 'lock' : 'lock_open'}</md-icon
+        >
+        <pre>${'  '}</pre>
+        ${entry.label
+        ? html `<span class="name">${highlight(entry.label, terms)}</span>`
+        : html `<span class="muted">(no id)</span>`}
+      </span>
+    </div>
+  `;
+}
+function renderGroup(type, entries, ctx) {
+    // 전역 검색으로 멤버를 좁히고, 매치 없는 그룹은 숨긴다.
+    const members = ctx.terms.length ? entries.filter(e => matchesQuery(e.component, ctx.terms)) : entries;
+    if (ctx.terms.length && members.length === 0)
+        return html ``;
+    const expanded = ctx.isGroupExpanded(type);
+    return html `
+    <div class="group">
+      <div
+        class="group-header"
+        data-group-type=${type}
+        ?dimmed=${ctx.isTypeDimmed(type)}
+        ?hidden-group=${ctx.isTypeHidden(type)}
+      >
+        <span class=${expanded ? 'extended' : 'collapsed'}> </span>
+        <span class="group-type">${highlight(type, ctx.terms)}</span>
+        <span class="group-count">${members.length}</span>
+        <md-icon class="group-hidden" title="Show/hide this group"
+          >${ctx.isTypeHidden(type) ? 'visibility_off' : 'visibility'}</md-icon
+        >
+        ${type === 'group'
+        ? // 'group'(순수 컨테이너)은 dim 이 무의미 — 자식이 각자 다른 type 이라 캔버스에서 안 흐려짐.
+            nothing
+        : html `<md-icon class="group-dim" title="Dim this group in canvas (modeling focus)"
+              >${ctx.isTypeDimmed(type) ? 'blur_on' : 'blur_off'}</md-icon
+            >`}
+      </div>
+      ${expanded ? members.map(entry => renderMember(entry, ctx.terms, ctx.selected)) : nothing}
+    </div>
+  `;
+}
+/** 타입 그룹 뷰 전체 렌더 — 타입명 오름차순. */
+export function renderInspectorGroupView(index, ctx) {
+    if (!index)
+        return html ``;
+    const types = [...index.byType.keys()].sort((a, b) => a.localeCompare(b));
+    return html `${types.map(type => renderGroup(type, index.byType.get(type), ctx))}`;
+}
+//# sourceMappingURL=inspector-group-view.js.map

package/dist/src/property-panel/inspector/inspector-group-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspector-group-view.js","sourceRoot":"","sources":["../../../../src/property-panel/inspector/inspector-group-view.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Scene Inspector 타입 그룹 뷰 렌더러.\n *\n * 계층을 무시하고 `state.type` 기준 **논리 버킷**(= \"컴포넌트 그룹\")으로 재편성해 렌더한다.\n * 그룹 헤더(타입 + 개수 + 펼침/접힘 + dim-out 토글)와 멤버 행(개별 컴포넌트)으로 구성.\n * SceneInspector shadow root 에 직접 렌더 — 멤버 행은 트리 뷰와 동일한 `.component`/eye 규약을\n * 재사용해 기존 클릭 위임(선택·hidden·lock 토글)을 그대로 쓴다. 그룹 헤더 토글은 `data-group-type` 로 처리.\n *\n * (그룹별 필터는 전역 검색의 필드 토큰 `type:...` 과 중복이라 제거됨.)\n */\nimport { Component } from '@hatiolab/things-scene'\nimport { html, nothing, TemplateResult } from 'lit'\n\nimport { IndexEntry, InspectorIndex, matchesQuery, SearchTerm } from './inspector-model.js'\nimport { highlight } from './inspector-highlight.js'\n\nexport interface GroupViewContext {\n  selected: Component[]\n  /** 파싱된 전역 검색어(AND). */\n  terms: SearchTerm[]\n  isGroupExpanded: (type: string) => boolean\n  /** 그룹(타입)이 모델링 포커스 dim 처리됐는지. */\n  isTypeDimmed: (type: string) => boolean\n  /** 그룹(타입) 전원이 hidden(숨김)인지 — 그룹 hidden 토글 아이콘 판정. */\n  isTypeHidden: (type: string) => boolean\n}\n\nfunction renderMember(entry: IndexEntry, terms: SearchTerm[], selected: Component[]): TemplateResult {\n  const component = entry.component\n  return html`\n    <div class=\"component group-member\" ?selected=${selected.indexOf(component) > -1} .component=${component}>\n      <span>\n        <md-icon class=\"eye\">${component.get('hidden') ? 'visibility_off' : 'visibility'}</md-icon>\n        <md-icon class=\"lock\" ?locked=${!!component.get('locked')}\n          >${component.get('locked') ? 'lock' : 'lock_open'}</md-icon\n        >\n        <pre>${'  '}</pre>\n        ${entry.label\n          ? html`<span class=\"name\">${highlight(entry.label, terms)}</span>`\n          : html`<span class=\"muted\">(no id)</span>`}\n      </span>\n    </div>\n  `\n}\n\nfunction renderGroup(type: string, entries: IndexEntry[], ctx: GroupViewContext): TemplateResult {\n  // 전역 검색으로 멤버를 좁히고, 매치 없는 그룹은 숨긴다.\n  const members = ctx.terms.length ? entries.filter(e => matchesQuery(e.component, ctx.terms)) : entries\n  if (ctx.terms.length && members.length === 0) return html``\n\n  const expanded = ctx.isGroupExpanded(type)\n\n  return html`\n    <div class=\"group\">\n      <div\n        class=\"group-header\"\n        data-group-type=${type}\n        ?dimmed=${ctx.isTypeDimmed(type)}\n        ?hidden-group=${ctx.isTypeHidden(type)}\n      >\n        <span class=${expanded ? 'extended' : 'collapsed'}> </span>\n        <span class=\"group-type\">${highlight(type, ctx.terms)}</span>\n        <span class=\"group-count\">${members.length}</span>\n        <md-icon class=\"group-hidden\" title=\"Show/hide this group\"\n          >${ctx.isTypeHidden(type) ? 'visibility_off' : 'visibility'}</md-icon\n        >\n        ${type === 'group'\n          ? // 'group'(순수 컨테이너)은 dim 이 무의미 — 자식이 각자 다른 type 이라 캔버스에서 안 흐려짐.\n            nothing\n          : html`<md-icon class=\"group-dim\" title=\"Dim this group in canvas (modeling focus)\"\n              >${ctx.isTypeDimmed(type) ? 'blur_on' : 'blur_off'}</md-icon\n            >`}\n      </div>\n      ${expanded ? members.map(entry => renderMember(entry, ctx.terms, ctx.selected)) : nothing}\n    </div>\n  `\n}\n\n/** 타입 그룹 뷰 전체 렌더 — 타입명 오름차순. */\nexport function renderInspectorGroupView(index: InspectorIndex | undefined, ctx: GroupViewContext): TemplateResult {\n  if (!index) return html``\n  const types = [...index.byType.keys()].sort((a, b) => a.localeCompare(b))\n  return html`${types.map(type => renderGroup(type, index.byType.get(type)!, ctx))}`\n}\n"]}

package/dist/src/property-panel/inspector/inspector-highlight.d.ts

@@ -0,0 +1,7 @@
+import { TemplateResult } from 'lit';
+import { SearchTerm } from './inspector-model.js';
+/**
+ * text 안에서 terms 의 값(field 무관, 시각 표시용)에 일치하는 부분을 하이라이트.
+ * 매치가 없거나 terms 가 비면 원본 문자열을 그대로 반환.
+ */
+export declare function highlight(text: string | undefined, terms: SearchTerm[]): TemplateResult | string;

package/dist/src/property-panel/inspector/inspector-highlight.js

@@ -0,0 +1,25 @@
+/*
+ * Copyright © HatioLab Inc. All rights reserved.
+ *
+ * 검색 매치 하이라이트 — 표시 텍스트에서 검색어 값과 일치하는 부분을 <mark> 로 감싼다.
+ */
+import { html } from 'lit';
+function escapeRegExp(s) {
+    return s.replace(/[.*+?^${}()|[\]\\]/g, '\\$&');
+}
+/**
+ * text 안에서 terms 의 값(field 무관, 시각 표시용)에 일치하는 부분을 하이라이트.
+ * 매치가 없거나 terms 가 비면 원본 문자열을 그대로 반환.
+ */
+export function highlight(text, terms) {
+    if (!text)
+        return text || '';
+    const values = [...new Set(terms.map(t => t.value).filter(Boolean))];
+    if (!values.length)
+        return text;
+    const re = new RegExp(`(${values.map(escapeRegExp).join('|')})`, 'ig');
+    const parts = text.split(re).filter(p => p !== '');
+    const valueSet = new Set(values);
+    return html `${parts.map(part => (valueSet.has(part.toLowerCase()) ? html `<mark>${part}</mark>` : part))}`;
+}
+//# sourceMappingURL=inspector-highlight.js.map

package/dist/src/property-panel/inspector/inspector-highlight.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspector-highlight.js","sourceRoot":"","sources":["../../../../src/property-panel/inspector/inspector-highlight.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,OAAO,EAAE,IAAI,EAAkB,MAAM,KAAK,CAAA;AAI1C,SAAS,YAAY,CAAC,CAAS;IAC7B,OAAO,CAAC,CAAC,OAAO,CAAC,qBAAqB,EAAE,MAAM,CAAC,CAAA;AACjD,CAAC;AAED;;;GAGG;AACH,MAAM,UAAU,SAAS,CAAC,IAAwB,EAAE,KAAmB;IACrE,IAAI,CAAC,IAAI;QAAE,OAAO,IAAI,IAAI,EAAE,CAAA;IAC5B,MAAM,MAAM,GAAG,CAAC,GAAG,IAAI,GAAG,CAAC,KAAK,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,MAAM,CAAC,OAAO,CAAC,CAAC,CAAC,CAAA;IACpE,IAAI,CAAC,MAAM,CAAC,MAAM;QAAE,OAAO,IAAI,CAAA;IAE/B,MAAM,EAAE,GAAG,IAAI,MAAM,CAAC,IAAI,MAAM,CAAC,GAAG,CAAC,YAAY,CAAC,CAAC,IAAI,CAAC,GAAG,CAAC,GAAG,EAAE,IAAI,CAAC,CAAA;IACtE,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,EAAE,CAAC,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,CAAC,CAAC,KAAK,EAAE,CAAC,CAAA;IAClD,MAAM,QAAQ,GAAG,IAAI,GAAG,CAAC,MAAM,CAAC,CAAA;IAEhC,OAAO,IAAI,CAAA,GAAG,KAAK,CAAC,GAAG,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC,QAAQ,CAAC,GAAG,CAAC,IAAI,CAAC,WAAW,EAAE,CAAC,CAAC,CAAC,CAAC,IAAI,CAAA,SAAS,IAAI,SAAS,CAAC,CAAC,CAAC,IAAI,CAAC,CAAC,EAAE,CAAA;AAC3G,CAAC","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * 검색 매치 하이라이트 — 표시 텍스트에서 검색어 값과 일치하는 부분을 <mark> 로 감싼다.\n */\nimport { html, TemplateResult } from 'lit'\n\nimport { SearchTerm } from './inspector-model.js'\n\nfunction escapeRegExp(s: string): string {\n  return s.replace(/[.*+?^${}()|[\\]\\\\]/g, '\\\\$&')\n}\n\n/**\n * text 안에서 terms 의 값(field 무관, 시각 표시용)에 일치하는 부분을 하이라이트.\n * 매치가 없거나 terms 가 비면 원본 문자열을 그대로 반환.\n */\nexport function highlight(text: string | undefined, terms: SearchTerm[]): TemplateResult | string {\n  if (!text) return text || ''\n  const values = [...new Set(terms.map(t => t.value).filter(Boolean))]\n  if (!values.length) return text\n\n  const re = new RegExp(`(${values.map(escapeRegExp).join('|')})`, 'ig')\n  const parts = text.split(re).filter(p => p !== '')\n  const valueSet = new Set(values)\n\n  return html`${parts.map(part => (valueSet.has(part.toLowerCase()) ? html`<mark>${part}</mark>` : part))}`\n}\n"]}

package/dist/src/property-panel/inspector/inspector-model.d.ts

@@ -0,0 +1,44 @@
+import { Component } from '@hatiolab/things-scene';
+/** 인덱스 1건 — 한 컴포넌트의 인스펙터 표시/조작에 필요한 메타. */
+export interface IndexEntry {
+    component: Component;
+    /** 등록 타입(@sceneComponent 이름) — 그룹 키. */
+    type: string;
+    id?: string;
+    tag?: string;
+    clazz?: string;
+    /** state.name (검색 대상). */
+    name?: string;
+    /** 표시용 라벨: #id @tag .(class) — 없으면 undefined. */
+    label?: string;
+    hidden: boolean;
+    locked: boolean;
+    /** root(=0) 기준 깊이. flat 에는 depth>0 만 담긴다. */
+    depth: number;
+    parent?: Component;
+    isContainer: boolean;
+}
+export interface InspectorIndex {
+    root: Component;
+    /** 루트 제외, depth-first 순서의 전체 컴포넌트. */
+    flat: IndexEntry[];
+    /** 타입(state.type) → 해당 타입 엔트리 목록 (= "컴포넌트 그룹"). */
+    byType: Map<string, IndexEntry[]>;
+}
+/** scene root 를 순회해 flat 목록 + 타입 그룹 맵을 만든다. root 자신은 제외. */
+export declare function buildInspectorIndex(root: Component): InspectorIndex;
+export type SearchField = 'type' | 'id' | 'tag' | 'name' | 'class';
+/** 검색어 1개 — field 지정 시 그 필드만, 없으면 전 필드 통합 부분일치. */
+export interface SearchTerm {
+    field?: SearchField;
+    value: string;
+}
+/** 검색 문자열을 공백 토큰화해 SearchTerm[] 로 파싱. `field:value` 는 필드 스코프. 소문자화. */
+export declare function parseQuery(raw: string): SearchTerm[];
+/**
+ * 파싱된 검색어(AND)로 컴포넌트 매치 판정.
+ * - field 지정 term → 해당 필드 부분일치
+ * - bare term → type/name/id/tag/class 통합 부분일치
+ * 빈 terms 는 항상 매치.
+ */
+export declare function matchesQuery(component: Component, terms: SearchTerm[]): boolean;

package/dist/src/property-panel/inspector/inspector-model.js

@@ -0,0 +1,72 @@
+function toEntry(component, depth, parent) {
+    const { type, id, tag, name, class: clazz } = component.state;
+    const label = (id ? `#${id}` : '') + (tag ? `@${tag}` : '') + (clazz ? `.(${clazz})` : '');
+    return {
+        component,
+        type,
+        id,
+        tag,
+        clazz,
+        name,
+        label: label || undefined,
+        hidden: !!component.get('hidden'),
+        locked: !!component.get('locked'),
+        depth,
+        parent,
+        isContainer: component.isContainer()
+    };
+}
+/** scene root 를 순회해 flat 목록 + 타입 그룹 맵을 만든다. root 자신은 제외. */
+export function buildInspectorIndex(root) {
+    const flat = [];
+    const byType = new Map();
+    const visit = (component, depth, parent) => {
+        if (depth > 0) {
+            const entry = toEntry(component, depth, parent);
+            flat.push(entry);
+            const list = byType.get(entry.type);
+            if (list)
+                list.push(entry);
+            else
+                byType.set(entry.type, [entry]);
+        }
+        if (component.isContainer()) {
+            for (const child of component.components)
+                visit(child, depth + 1, component);
+        }
+    };
+    visit(root, 0);
+    return { root, flat, byType };
+}
+const SEARCH_FIELDS = ['type', 'id', 'tag', 'name', 'class'];
+const FIELD_TOKEN_RE = /^(type|id|tag|name|class):(.*)$/;
+/** 검색 문자열을 공백 토큰화해 SearchTerm[] 로 파싱. `field:value` 는 필드 스코프. 소문자화. */
+export function parseQuery(raw) {
+    return (raw || '')
+        .toLowerCase()
+        .trim()
+        .split(/\s+/)
+        .filter(Boolean)
+        .map((token) => {
+        const m = token.match(FIELD_TOKEN_RE);
+        return m && m[2] ? { field: m[1], value: m[2] } : { value: token };
+    })
+        .filter(term => term.value);
+}
+function fieldValue(component, field) {
+    const v = component.state[field];
+    return v == null ? '' : String(v).toLowerCase();
+}
+/**
+ * 파싱된 검색어(AND)로 컴포넌트 매치 판정.
+ * - field 지정 term → 해당 필드 부분일치
+ * - bare term → type/name/id/tag/class 통합 부분일치
+ * 빈 terms 는 항상 매치.
+ */
+export function matchesQuery(component, terms) {
+    if (!terms.length)
+        return true;
+    const combined = SEARCH_FIELDS.map(f => fieldValue(component, f)).join(' ');
+    return terms.every(term => term.field ? fieldValue(component, term.field).indexOf(term.value) > -1 : combined.indexOf(term.value) > -1);
+}
+//# sourceMappingURL=inspector-model.js.map

package/dist/src/property-panel/inspector/inspector-model.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"inspector-model.js","sourceRoot":"","sources":["../../../../src/property-panel/inspector/inspector-model.ts"],"names":[],"mappings":"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","sourcesContent":["/*\n * Copyright © HatioLab Inc. All rights reserved.\n *\n * Scene Inspector 모델 인덱스.\n *\n * scene 컴포넌트 트리를 순회해, 뷰(트리 / 타입 그룹)와 focus 필터가 공유하는 데이터 구조로 만든다.\n * 순수 함수(DOM 비의존) — 테스트 가능하며, 향후 타입 그룹 뷰(P1)·포커스 dim 필터(P2.5)의 토대.\n *\n * 여기서 말하는 \"컴포넌트 그룹\"은 `state.type` 기준의 **논리 버킷**이다\n * (things-scene 의 실제 Group/Container 계층과 무관 — 계획서 §4.0 참조).\n */\nimport { Component, Container } from '@hatiolab/things-scene'\n\n/** 인덱스 1건 — 한 컴포넌트의 인스펙터 표시/조작에 필요한 메타. */\nexport interface IndexEntry {\n  component: Component\n  /** 등록 타입(@sceneComponent 이름) — 그룹 키. */\n  type: string\n  id?: string\n  tag?: string\n  clazz?: string\n  /** state.name (검색 대상). */\n  name?: string\n  /** 표시용 라벨: #id @tag .(class) — 없으면 undefined. */\n  label?: string\n  hidden: boolean\n  locked: boolean\n  /** root(=0) 기준 깊이. flat 에는 depth>0 만 담긴다. */\n  depth: number\n  parent?: Component\n  isContainer: boolean\n}\n\nexport interface InspectorIndex {\n  root: Component\n  /** 루트 제외, depth-first 순서의 전체 컴포넌트. */\n  flat: IndexEntry[]\n  /** 타입(state.type) → 해당 타입 엔트리 목록 (= \"컴포넌트 그룹\"). */\n  byType: Map<string, IndexEntry[]>\n}\n\nfunction toEntry(component: Component, depth: number, parent?: Component): IndexEntry {\n  const { type, id, tag, name, class: clazz } = component.state\n  const label = (id ? `#${id}` : '') + (tag ? `@${tag}` : '') + (clazz ? `.(${clazz})` : '')\n  return {\n    component,\n    type,\n    id,\n    tag,\n    clazz,\n    name,\n    label: label || undefined,\n    hidden: !!component.get('hidden'),\n    locked: !!component.get('locked'),\n    depth,\n    parent,\n    isContainer: component.isContainer()\n  }\n}\n\n/** scene root 를 순회해 flat 목록 + 타입 그룹 맵을 만든다. root 자신은 제외. */\nexport function buildInspectorIndex(root: Component): InspectorIndex {\n  const flat: IndexEntry[] = []\n  const byType = new Map<string, IndexEntry[]>()\n\n  const visit = (component: Component, depth: number, parent?: Component) => {\n    if (depth > 0) {\n      const entry = toEntry(component, depth, parent)\n      flat.push(entry)\n      const list = byType.get(entry.type)\n      if (list) list.push(entry)\n      else byType.set(entry.type, [entry])\n    }\n    if (component.isContainer()) {\n      for (const child of (component as Container).components) visit(child, depth + 1, component)\n    }\n  }\n\n  visit(root, 0)\n  return { root, flat, byType }\n}\n\n// ── 검색 쿼리 (필드 토큰) ──\n\nexport type SearchField = 'type' | 'id' | 'tag' | 'name' | 'class'\nconst SEARCH_FIELDS: readonly SearchField[] = ['type', 'id', 'tag', 'name', 'class']\n\n/** 검색어 1개 — field 지정 시 그 필드만, 없으면 전 필드 통합 부분일치. */\nexport interface SearchTerm {\n  field?: SearchField\n  value: string\n}\n\nconst FIELD_TOKEN_RE = /^(type|id|tag|name|class):(.*)$/\n\n/** 검색 문자열을 공백 토큰화해 SearchTerm[] 로 파싱. `field:value` 는 필드 스코프. 소문자화. */\nexport function parseQuery(raw: string): SearchTerm[] {\n  return (raw || '')\n    .toLowerCase()\n    .trim()\n    .split(/\\s+/)\n    .filter(Boolean)\n    .map((token): SearchTerm => {\n      const m = token.match(FIELD_TOKEN_RE)\n      return m && m[2] ? { field: m[1] as SearchField, value: m[2] } : { value: token }\n    })\n    .filter(term => term.value)\n}\n\nfunction fieldValue(component: Component, field: SearchField): string {\n  const v = (component.state as Record<string, unknown>)[field]\n  return v == null ? '' : String(v).toLowerCase()\n}\n\n/**\n * 파싱된 검색어(AND)로 컴포넌트 매치 판정.\n * - field 지정 term → 해당 필드 부분일치\n * - bare term → type/name/id/tag/class 통합 부분일치\n * 빈 terms 는 항상 매치.\n */\nexport function matchesQuery(component: Component, terms: SearchTerm[]): boolean {\n  if (!terms.length) return true\n  const combined = SEARCH_FIELDS.map(f => fieldValue(component, f)).join(' ')\n  return terms.every(term =>\n    term.field ? fieldValue(component, term.field).indexOf(term.value) > -1 : combined.indexOf(term.value) > -1\n  )\n}\n"]}

package/dist/src/property-panel/inspector/inspector-tree-view.d.ts

@@ -0,0 +1,18 @@
+import { Component } from '@hatiolab/things-scene';
+import { TemplateResult } from 'lit';
+import { SearchTerm } from './inspector-model.js';
+/** 트리 렌더에 필요한 컨텍스트(호스트/컨트롤러가 주입). */
+export interface TreeViewContext {
+    /** 현재 선택 컴포넌트 목록. */
+    selected: Component[];
+    /** 파싱된 검색어(AND). */
+    terms: SearchTerm[];
+    /** ROOT 노드에 표시할 매치 개수. */
+    count: number;
+    isExtended: (c: Component) => boolean;
+    nodeHandleClass: (c: Component) => string;
+}
+/** 검색 매치 개수(루트 포함, 전체 트리) — ROOT 노드 count 표시용. */
+export declare function countMatches(component: Component, terms: SearchTerm[]): number;
+/** scene.root 부터 트리를 렌더한다. */
+export declare function renderInspectorTree(root: Component | undefined, ctx: TreeViewContext): TemplateResult;