pubuilder 0.3.0 → 0.4.0

package/dist/index.js

@@ -1,79 +1,150 @@
 "use client";
-import { jsxs as b, jsx as l, Fragment as F } from "react/jsx-runtime";
-import { memo as W, useRef as L, useState as C, useEffect as k, useMemo as G, useLayoutEffect as U } from "react";
-import { createPortal as X } from "react-dom";
-import { create as q } from "zustand";
-import { Handle as T, Position as N, ReactFlow as Z } from "@xyflow/react";
-function Se(e) {
+import { jsxs as u, jsx as n, Fragment as te } from "react/jsx-runtime";
+import { createContext as ce, memo as ie, useRef as $, useState as _, useEffect as I, useMemo as G, useContext as oe, useLayoutEffect as se } from "react";
+import { createPortal as de } from "react-dom";
+import { create as ue } from "zustand";
+import { Handle as J, Position as j, ReactFlow as pe } from "@xyflow/react";
+const be = "http://localhost:4816";
+class re extends Error {
+  constructor(t, o) {
+    super(t), this.code = o, this.name = "ApiError";
+  }
+}
+class ne {
+  constructor(t = be) {
+    this.baseUrl = t;
+  }
+  async request(t, o) {
+    const r = await fetch(`${this.baseUrl}${t}`, {
+      ...o,
+      headers: { "content-type": "application/json", ...o?.headers }
+    });
+    if (!r.ok) {
+      const a = await r.json().catch(() => ({}));
+      throw new re(a.message ?? `요청 실패 (${r.status})`, a.code);
+    }
+    return r.status === 204 ? void 0 : await r.json();
+  }
+  async isAlive() {
+    try {
+      return await this.request("/api/health"), !0;
+    } catch {
+      return !1;
+    }
+  }
+  listSkills() {
+    return this.request("/api/skills");
+  }
+  toggleSkill(t, o) {
+    return this.request(`/api/skills/${encodeURIComponent(t)}`, { method: "PATCH", body: JSON.stringify({ enabled: o }) });
+  }
+  uploadSkill(t, o) {
+    return this.request("/api/skills", { method: "POST", body: JSON.stringify({ filename: t, content: o }) });
+  }
+  removeSkill(t) {
+    return this.request(`/api/skills/${encodeURIComponent(t)}`, { method: "DELETE" });
+  }
+  tokenStatus() {
+    return this.request("/api/settings/figma-token");
+  }
+  saveToken(t) {
+    return this.request("/api/settings/figma-token", { method: "PUT", body: JSON.stringify({ token: t }) });
+  }
+  deleteToken() {
+    return this.request("/api/settings/figma-token", { method: "DELETE" });
+  }
+  startPublish(t) {
+    return this.request("/api/publish", { method: "POST", body: JSON.stringify(t) });
+  }
+  cancelPublish(t) {
+    return this.request(`/api/publish/${t}`, { method: "DELETE" });
+  }
+  /** SSE 구독 — 반환값 호출로 해제 */
+  subscribePublish(t, o) {
+    const r = new EventSource(`${this.baseUrl}/api/publish/${t}/events`);
+    let a = !1;
+    return r.onmessage = (c) => {
+      const i = JSON.parse(c.data);
+      (i.type === "done" || i.type === "error") && (a = !0), o(i);
+    }, r.onerror = () => {
+      r.close(), a || (a = !0, o({ type: "error", text: "서버 연결이 끊겼어요. pubuilder serve 상태를 확인해주세요" }));
+    }, () => r.close();
+  }
+}
+const Y = ce(new ne());
+function Je(e) {
   return e;
 }
-const K = { width: 1440, height: 900 };
-function A(e, r, o) {
-  o != null && e.append(r, String(o));
+const fe = { width: 1440, height: 900 };
+function X(e, t, o) {
+  o != null && e.append(t, String(o));
 }
-function Q(e, r) {
-  const o = e.indexOf("#"), t = o >= 0 ? e.slice(o) : "", a = o >= 0 ? e.slice(0, o) : e, c = a.indexOf("?"), s = c >= 0 ? a.slice(0, c) : a, n = new URLSearchParams(c >= 0 ? a.slice(c + 1) : "");
-  for (const [d, u] of Object.entries(r.query))
-    if (n.delete(d), Array.isArray(u))
-      for (const m of u) A(n, d, m);
+function he(e, t) {
+  const o = e.indexOf("#"), r = o >= 0 ? e.slice(o) : "", a = o >= 0 ? e.slice(0, o) : e, c = a.indexOf("?"), i = c >= 0 ? a.slice(0, c) : a, l = new URLSearchParams(c >= 0 ? a.slice(c + 1) : "");
+  for (const [s, x] of Object.entries(t.query))
+    if (l.delete(s), Array.isArray(x))
+      for (const f of x) X(l, s, f);
     else
-      A(n, d, u);
-  const i = n.toString();
-  return `${s}${i ? `?${i}` : ""}${t}`;
-}
-function J(e) {
-  const r = [], o = /* @__PURE__ */ new Set(), t = (a, c, s) => {
-    for (const n of a) {
-      if (!n.path) throw new Error("[pubuilder] page.path는 필수입니다");
-      if (!n.title) throw new Error(`[pubuilder] "${n.path}"의 title이 없습니다`);
-      if (o.has(n.path)) throw new Error(`[pubuilder] 중복 path: ${n.path}`);
-      if (o.add(n.path), r.push({
-        id: n.path,
-        path: n.path,
-        title: n.title,
-        external: n.external ?? /^https?:\/\//.test(n.path),
+      X(l, s, x);
+  const p = l.toString();
+  return `${i}${p ? `?${p}` : ""}${r}`;
+}
+function ge(e) {
+  const t = [], o = /* @__PURE__ */ new Set(), r = (a, c, i) => {
+    for (const l of a) {
+      if (!l.path) throw new Error("[pubuilder] page.path는 필수입니다");
+      if (!l.title) throw new Error(`[pubuilder] "${l.path}"의 title이 없습니다`);
+      if (o.has(l.path)) throw new Error(`[pubuilder] 중복 path: ${l.path}`);
+      if (o.add(l.path), t.push({
+        id: l.path,
+        path: l.path,
+        title: l.title,
+        external: l.external ?? /^https?:\/\//.test(l.path),
         parentId: c,
-        depth: s
-      }), n.variants?.length) {
-        if (n.external ?? /^https?:\/\//.test(n.path))
-          throw new Error(`[pubuilder] 외부 페이지에는 variants를 사용할 수 없습니다: ${n.path}`);
-        for (const i of n.variants) {
-          if (!i.title) throw new Error(`[pubuilder] "${n.path}" variant의 title이 없습니다`);
-          const d = Q(n.path, i);
-          if (o.has(d)) throw new Error(`[pubuilder] 중복 path: ${d}`);
-          o.add(d), r.push({
-            id: d,
-            path: d,
-            title: i.title,
+        depth: i
+      }), l.variants?.length) {
+        if (l.external ?? /^https?:\/\//.test(l.path))
+          throw new Error(`[pubuilder] 외부 페이지에는 variants를 사용할 수 없습니다: ${l.path}`);
+        for (const p of l.variants) {
+          if (!p.title) throw new Error(`[pubuilder] "${l.path}" variant의 title이 없습니다`);
+          const s = he(l.path, p);
+          if (o.has(s)) throw new Error(`[pubuilder] 중복 path: ${s}`);
+          o.add(s), t.push({
+            id: s,
+            path: s,
+            title: p.title,
             external: !1,
-            parentId: n.path,
-            depth: s + 1
+            parentId: l.path,
+            depth: i + 1
           });
         }
       }
-      n.children?.length && t(n.children, n.path, s + 1);
+      l.children?.length && r(l.children, l.path, i + 1);
     }
   };
-  if (t(e.pages, null, 0), r.length === 0) throw new Error("[pubuilder] pages가 비어 있습니다");
-  return { nodes: r, viewport: e.viewport ?? K };
+  if (r(e.pages, null, 0), t.length === 0) throw new Error("[pubuilder] pages가 비어 있습니다");
+  return { nodes: t, viewport: e.viewport ?? fe };
 }
-function ee() {
+function xe() {
   return typeof process < "u" && process.env.NODE_ENV === "production";
 }
-const x = q((e) => ({
+const y = ue((e) => ({
   isMapOpen: !1,
   viewerPath: null,
   granularity: "section",
   inspectEnabled: !0,
   selection: null,
+  selectedOuterHTML: null,
+  skillDrawerOpen: !1,
   openMap: () => e({ isMapOpen: !0 }),
-  closeMap: () => e({ isMapOpen: !1, viewerPath: null, selection: null }),
-  openViewer: (r) => e({ viewerPath: r, selection: null }),
-  closeViewer: () => e({ viewerPath: null, selection: null }),
-  setGranularity: (r) => e({ granularity: r }),
-  setInspectEnabled: (r) => e({ inspectEnabled: r }),
-  setSelection: (r) => e({ selection: r })
-})), oe = ".react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #555;--xy-background-pattern-lines-color-default: #333;--xy-background-pattern-cross-color-default: #333;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1;touch-action:none}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}", te = "pubuilder-styles", re = "pubuilder-xyflow-styles", ne = (
+  closeMap: () => e({ isMapOpen: !1, viewerPath: null, selection: null, selectedOuterHTML: null }),
+  openViewer: (t) => e({ viewerPath: t, selection: null, selectedOuterHTML: null }),
+  closeViewer: () => e({ viewerPath: null, selection: null, selectedOuterHTML: null }),
+  setGranularity: (t) => e({ granularity: t }),
+  setInspectEnabled: (t) => e({ inspectEnabled: t }),
+  setSelectionWithHTML: (t, o) => e({ selection: t, selectedOuterHTML: o }),
+  toggleSkillDrawer: () => e((t) => ({ skillDrawerOpen: !t.skillDrawerOpen }))
+})), me = ".react-flow{direction:ltr;--xy-edge-stroke-default: #b1b1b7;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #555;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(255, 255, 255, .5);--xy-minimap-background-color-default: #fff;--xy-minimap-mask-background-color-default: rgba(240, 240, 240, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #e2e2e2;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: transparent;--xy-background-pattern-dots-color-default: #91919a;--xy-background-pattern-lines-color-default: #eee;--xy-background-pattern-cross-color-default: #e2e2e2;background-color:var(--xy-background-color, var(--xy-background-color-default));--xy-node-color-default: inherit;--xy-node-border-default: 1px solid #1a192b;--xy-node-background-color-default: #fff;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(0, 0, 0, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #1a192b;--xy-node-border-radius-default: 3px;--xy-handle-background-color-default: #1a192b;--xy-handle-border-color-default: #fff;--xy-selection-background-color-default: rgba(0, 89, 220, .08);--xy-selection-border-default: 1px dotted rgba(0, 89, 220, .8);--xy-controls-button-background-color-default: #fefefe;--xy-controls-button-background-color-hover-default: #f4f4f4;--xy-controls-button-color-default: inherit;--xy-controls-button-color-hover-default: inherit;--xy-controls-button-border-color-default: #eee;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #ffffff;--xy-edge-label-color-default: inherit;--xy-resize-background-color-default: #3367d9}.react-flow.dark{--xy-edge-stroke-default: #3e3e3e;--xy-edge-stroke-width-default: 1;--xy-edge-stroke-selected-default: #727272;--xy-connectionline-stroke-default: #b1b1b7;--xy-connectionline-stroke-width-default: 1;--xy-attribution-background-color-default: rgba(150, 150, 150, .25);--xy-minimap-background-color-default: #141414;--xy-minimap-mask-background-color-default: rgba(60, 60, 60, .6);--xy-minimap-mask-stroke-color-default: transparent;--xy-minimap-mask-stroke-width-default: 1;--xy-minimap-node-background-color-default: #2b2b2b;--xy-minimap-node-stroke-color-default: transparent;--xy-minimap-node-stroke-width-default: 2;--xy-background-color-default: #141414;--xy-background-pattern-dots-color-default: #555;--xy-background-pattern-lines-color-default: #333;--xy-background-pattern-cross-color-default: #333;--xy-node-color-default: #f8f8f8;--xy-node-border-default: 1px solid #3c3c3c;--xy-node-background-color-default: #1e1e1e;--xy-node-group-background-color-default: rgba(240, 240, 240, .25);--xy-node-boxshadow-hover-default: 0 1px 4px 1px rgba(255, 255, 255, .08);--xy-node-boxshadow-selected-default: 0 0 0 .5px #999;--xy-handle-background-color-default: #bebebe;--xy-handle-border-color-default: #1e1e1e;--xy-selection-background-color-default: rgba(200, 200, 220, .08);--xy-selection-border-default: 1px dotted rgba(200, 200, 220, .8);--xy-controls-button-background-color-default: #2b2b2b;--xy-controls-button-background-color-hover-default: #3e3e3e;--xy-controls-button-color-default: #f8f8f8;--xy-controls-button-color-hover-default: #fff;--xy-controls-button-border-color-default: #5b5b5b;--xy-controls-box-shadow-default: 0 0 2px 1px rgba(0, 0, 0, .08);--xy-edge-label-background-color-default: #141414;--xy-edge-label-color-default: #f8f8f8}.react-flow__background{background-color:var(--xy-background-color-props, var(--xy-background-color, var(--xy-background-color-default)));pointer-events:none;z-index:-1}.react-flow__container{position:absolute;width:100%;height:100%;top:0;left:0}.react-flow__pane{z-index:1;touch-action:none}.react-flow__pane.draggable{cursor:grab}.react-flow__pane.dragging{cursor:grabbing}.react-flow__pane.selection{cursor:pointer}.react-flow__viewport{transform-origin:0 0;z-index:2;pointer-events:none}.react-flow__renderer{z-index:4}.react-flow__selection{z-index:6}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible{outline:none}.react-flow__edge-path{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default));stroke-width:var(--xy-edge-stroke-width, var(--xy-edge-stroke-width-default));fill:none}.react-flow__connection-path{stroke:var(--xy-connectionline-stroke, var(--xy-connectionline-stroke-default));stroke-width:var(--xy-connectionline-stroke-width, var(--xy-connectionline-stroke-width-default));fill:none}.react-flow .react-flow__edges{position:absolute}.react-flow .react-flow__edges svg{overflow:visible;position:absolute;pointer-events:none}.react-flow__edge{pointer-events:visibleStroke}.react-flow__edge.selectable{cursor:pointer}.react-flow__edge.animated path{stroke-dasharray:5;animation:dashdraw .5s linear infinite}.react-flow__edge.animated path.react-flow__edge-interaction{stroke-dasharray:none;animation:none}.react-flow__edge.inactive{pointer-events:none}.react-flow__edge.selected,.react-flow__edge:focus,.react-flow__edge:focus-visible{outline:none}.react-flow__edge.selected .react-flow__edge-path,.react-flow__edge.selectable:focus .react-flow__edge-path,.react-flow__edge.selectable:focus-visible .react-flow__edge-path{stroke:var(--xy-edge-stroke-selected, var(--xy-edge-stroke-selected-default))}.react-flow__edge-textwrapper{pointer-events:all}.react-flow__edge .react-flow__edge-text{pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__arrowhead polyline{stroke:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__arrowhead polyline.arrowclosed{fill:var(--xy-edge-stroke, var(--xy-edge-stroke-default))}.react-flow__connection{pointer-events:none}.react-flow__connection .animated{stroke-dasharray:5;animation:dashdraw .5s linear infinite}svg.react-flow__connectionline{z-index:1001;overflow:visible;position:absolute}.react-flow__nodes{pointer-events:none;transform-origin:0 0}.react-flow__node{position:absolute;-webkit-user-select:none;-moz-user-select:none;user-select:none;pointer-events:all;transform-origin:0 0;box-sizing:border-box;cursor:default}.react-flow__node.selectable{cursor:pointer}.react-flow__node.draggable{cursor:grab;pointer-events:all}.react-flow__node.draggable.dragging{cursor:grabbing}.react-flow__nodesselection{z-index:3;transform-origin:left top;pointer-events:none}.react-flow__nodesselection-rect{position:absolute;pointer-events:all;cursor:grab}.react-flow__handle{position:absolute;pointer-events:none;min-width:5px;min-height:5px;width:6px;height:6px;background-color:var(--xy-handle-background-color, var(--xy-handle-background-color-default));border:1px solid var(--xy-handle-border-color, var(--xy-handle-border-color-default));border-radius:100%}.react-flow__handle.connectingfrom{pointer-events:all}.react-flow__handle.connectionindicator{pointer-events:all;cursor:crosshair}.react-flow__handle-bottom{top:auto;left:50%;bottom:0;transform:translate(-50%,50%)}.react-flow__handle-top{top:0;left:50%;transform:translate(-50%,-50%)}.react-flow__handle-left{top:50%;left:0;transform:translate(-50%,-50%)}.react-flow__handle-right{top:50%;right:0;transform:translate(50%,-50%)}.react-flow__edgeupdater{cursor:move;pointer-events:all}.react-flow__pane.selection .react-flow__panel{pointer-events:none}.react-flow__panel{position:absolute;z-index:5;margin:15px}.react-flow__panel.top{top:0}.react-flow__panel.bottom{bottom:0}.react-flow__panel.top.center,.react-flow__panel.bottom.center{left:50%;transform:translate(-15px) translate(-50%)}.react-flow__panel.left{left:0}.react-flow__panel.right{right:0}.react-flow__panel.left.center,.react-flow__panel.right.center{top:50%;transform:translateY(-15px) translateY(-50%)}.react-flow__attribution{font-size:10px;background:var(--xy-attribution-background-color, var(--xy-attribution-background-color-default));padding:2px 3px;margin:0}.react-flow__attribution a{text-decoration:none;color:#999}@keyframes dashdraw{0%{stroke-dashoffset:10}}.react-flow__edgelabel-renderer{position:absolute;width:100%;height:100%;pointer-events:none;-webkit-user-select:none;-moz-user-select:none;user-select:none;left:0;top:0}.react-flow__viewport-portal{position:absolute;width:100%;height:100%;left:0;top:0;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__minimap{background:var( --xy-minimap-background-color-props, var(--xy-minimap-background-color, var(--xy-minimap-background-color-default)) )}.react-flow__minimap-svg{display:block}.react-flow__minimap-mask{fill:var( --xy-minimap-mask-background-color-props, var(--xy-minimap-mask-background-color, var(--xy-minimap-mask-background-color-default)) );stroke:var( --xy-minimap-mask-stroke-color-props, var(--xy-minimap-mask-stroke-color, var(--xy-minimap-mask-stroke-color-default)) );stroke-width:var( --xy-minimap-mask-stroke-width-props, var(--xy-minimap-mask-stroke-width, var(--xy-minimap-mask-stroke-width-default)) )}.react-flow__minimap-node{fill:var( --xy-minimap-node-background-color-props, var(--xy-minimap-node-background-color, var(--xy-minimap-node-background-color-default)) );stroke:var( --xy-minimap-node-stroke-color-props, var(--xy-minimap-node-stroke-color, var(--xy-minimap-node-stroke-color-default)) );stroke-width:var( --xy-minimap-node-stroke-width-props, var(--xy-minimap-node-stroke-width, var(--xy-minimap-node-stroke-width-default)) )}.react-flow__background-pattern.dots{fill:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-dots-color-default)) )}.react-flow__background-pattern.lines{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-lines-color-default)) )}.react-flow__background-pattern.cross{stroke:var( --xy-background-pattern-color-props, var(--xy-background-pattern-color, var(--xy-background-pattern-cross-color-default)) )}.react-flow__controls{display:flex;flex-direction:column;box-shadow:var(--xy-controls-box-shadow, var(--xy-controls-box-shadow-default))}.react-flow__controls.horizontal{flex-direction:row}.react-flow__controls-button{display:flex;justify-content:center;align-items:center;height:26px;width:26px;padding:4px;border:none;background:var(--xy-controls-button-background-color, var(--xy-controls-button-background-color-default));border-bottom:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) );color:var( --xy-controls-button-color-props, var(--xy-controls-button-color, var(--xy-controls-button-color-default)) );cursor:pointer;-webkit-user-select:none;-moz-user-select:none;user-select:none}.react-flow__controls-button svg{width:100%;max-width:12px;max-height:12px;fill:currentColor}.react-flow__edge.updating .react-flow__edge-path{stroke:#777}.react-flow__edge-text{font-size:10px}.react-flow__node.selectable:focus,.react-flow__node.selectable:focus-visible{outline:none}.react-flow__node-input,.react-flow__node-default,.react-flow__node-output,.react-flow__node-group{padding:10px;border-radius:var(--xy-node-border-radius, var(--xy-node-border-radius-default));width:150px;font-size:12px;color:var(--xy-node-color, var(--xy-node-color-default));text-align:center;border:var(--xy-node-border, var(--xy-node-border-default));background-color:var(--xy-node-background-color, var(--xy-node-background-color-default))}.react-flow__node-input.selectable:hover,.react-flow__node-default.selectable:hover,.react-flow__node-output.selectable:hover,.react-flow__node-group.selectable:hover{box-shadow:var(--xy-node-boxshadow-hover, var(--xy-node-boxshadow-hover-default))}.react-flow__node-input.selectable.selected,.react-flow__node-input.selectable:focus,.react-flow__node-input.selectable:focus-visible,.react-flow__node-default.selectable.selected,.react-flow__node-default.selectable:focus,.react-flow__node-default.selectable:focus-visible,.react-flow__node-output.selectable.selected,.react-flow__node-output.selectable:focus,.react-flow__node-output.selectable:focus-visible,.react-flow__node-group.selectable.selected,.react-flow__node-group.selectable:focus,.react-flow__node-group.selectable:focus-visible{box-shadow:var(--xy-node-boxshadow-selected, var(--xy-node-boxshadow-selected-default))}.react-flow__node-group{background-color:var(--xy-node-group-background-color, var(--xy-node-group-background-color-default))}.react-flow__nodesselection-rect,.react-flow__selection{background:var(--xy-selection-background-color, var(--xy-selection-background-color-default));border:var(--xy-selection-border, var(--xy-selection-border-default))}.react-flow__nodesselection-rect:focus,.react-flow__nodesselection-rect:focus-visible,.react-flow__selection:focus,.react-flow__selection:focus-visible{outline:none}.react-flow__controls-button:hover{background:var( --xy-controls-button-background-color-hover-props, var(--xy-controls-button-background-color-hover, var(--xy-controls-button-background-color-hover-default)) );color:var( --xy-controls-button-color-hover-props, var(--xy-controls-button-color-hover, var(--xy-controls-button-color-hover-default)) )}.react-flow__controls-button:disabled{pointer-events:none}.react-flow__controls-button:disabled svg{fill-opacity:.4}.react-flow__controls-button:last-child{border-bottom:none}.react-flow__controls.horizontal .react-flow__controls-button{border-bottom:none;border-right:1px solid var( --xy-controls-button-border-color-props, var(--xy-controls-button-border-color, var(--xy-controls-button-border-color-default)) )}.react-flow__controls.horizontal .react-flow__controls-button:last-child{border-right:none}.react-flow__resize-control{position:absolute}.react-flow__resize-control.left,.react-flow__resize-control.right{cursor:ew-resize}.react-flow__resize-control.top,.react-flow__resize-control.bottom{cursor:ns-resize}.react-flow__resize-control.top.left,.react-flow__resize-control.bottom.right{cursor:nwse-resize}.react-flow__resize-control.bottom.left,.react-flow__resize-control.top.right{cursor:nesw-resize}.react-flow__resize-control.handle{width:5px;height:5px;border:1px solid #fff;border-radius:1px;background-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));translate:-50% -50%}.react-flow__resize-control.handle.left{left:0;top:50%}.react-flow__resize-control.handle.right{left:100%;top:50%}.react-flow__resize-control.handle.top{left:50%;top:0}.react-flow__resize-control.handle.bottom{left:50%;top:100%}.react-flow__resize-control.handle.top.left,.react-flow__resize-control.handle.bottom.left{left:0}.react-flow__resize-control.handle.top.right,.react-flow__resize-control.handle.bottom.right{left:100%}.react-flow__resize-control.line{border-color:var(--xy-resize-background-color, var(--xy-resize-background-color-default));border-width:0;border-style:solid}.react-flow__resize-control.line.left,.react-flow__resize-control.line.right{width:1px;transform:translate(-50%);top:0;height:100%}.react-flow__resize-control.line.left{left:0;border-left-width:1px}.react-flow__resize-control.line.right{left:100%;border-right-width:1px}.react-flow__resize-control.line.top,.react-flow__resize-control.line.bottom{height:1px;transform:translateY(-50%);left:0;width:100%}.react-flow__resize-control.line.top{top:0;border-top-width:1px}.react-flow__resize-control.line.bottom{border-bottom-width:1px;top:100%}.react-flow__edge-textbg{fill:var(--xy-edge-label-background-color, var(--xy-edge-label-background-color-default))}.react-flow__edge-text{fill:var(--xy-edge-label-color, var(--xy-edge-label-color-default))}", we = "pubuilder-styles", ye = "pubuilder-xyflow-styles", ve = (
   /* css */
   `
 .pbu-fab {
@@ -312,86 +383,183 @@ const x = q((e) => ({
   border-radius: 2px;
   margin-right: 6px;
 }
-.pbu-phase3 {
+.pbu-publish {
   margin-top: 4px;
   padding: 10px;
-  border: 1px dashed #3c3c3c;
+  border: 1px solid #3c3c3c;
   border-radius: 2px;
   display: flex;
   flex-direction: column;
   gap: 8px;
 }
-.pbu-phase3 > label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #8c8c8c; }
-.pbu-phase3 input {
+.pbu-publish > label { font-size: 10px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.06em; color: #8c8c8c; }
+.pbu-publish input {
   background: #1e1e1e;
   border: 1px solid #3c3c3c;
   border-radius: 2px;
-  color: #8c8c8c;
+  color: #cccccc;
   font-size: 11px;
   padding: 5px 8px;
 }
-.pbu-badge {
-  background: #37373d;
-  color: #d7ba7d;
-  font-size: 9px;
-  font-weight: 700;
-  padding: 1px 5px;
+.pbu-publish input:disabled { color: #8c8c8c; cursor: not-allowed; }
+.pbu-publish-log {
+  max-height: 200px;
+  overflow-y: auto;
+  background: #1e1e1e;
+  border: 1px solid #3c3c3c;
+  border-radius: 2px;
+  padding: 6px 8px;
+  font-family: ui-monospace, Menlo, monospace;
+  font-size: 11px;
+  display: flex;
+  flex-direction: column;
+  gap: 2px;
+}
+.pbu-log-line { color: #cccccc; white-space: pre-wrap; word-break: break-all; }
+.pbu-log-tool { color: #8c8c8c; }
+.pbu-log-error { color: #f2b3b3; }
+.pbu-log-done { color: #89d185; font-weight: 600; }
+
+.pbu-drawer {
+  position: fixed;
+  top: 0;
+  right: 0;
+  height: 100vh;
+  width: 360px;
+  z-index: 2147483300;
+  background: #252526;
+  border-left: 1px solid #3c3c3c;
+  padding: 12px;
+  overflow-y: auto;
+  display: flex;
+  flex-direction: column;
+  gap: 10px;
+  font-family: system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
+  font-size: 12px;
+  color: #cccccc;
+}
+.pbu-drawer-header {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  padding-bottom: 8px;
+  border-bottom: 1px solid #3c3c3c;
+}
+.pbu-drawer-group {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  font-size: 10px;
+  font-weight: 600;
+  text-transform: uppercase;
+  letter-spacing: 0.06em;
+  color: #8c8c8c;
+  margin-top: 6px;
+}
+.pbu-skill-row {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  padding: 4px 0;
+  border-bottom: 1px solid #2d2d2d;
+}
+.pbu-skill-row .pbu-hint {
+  flex: 1;
+  min-width: 0;
+  white-space: nowrap;
+  overflow: hidden;
+  text-overflow: ellipsis;
+}
+.pbu-token-masked {
+  font-family: ui-monospace, Menlo, monospace;
+  font-size: 11px;
+  color: #cccccc;
+  background: #1e1e1e;
+  border: 1px solid #3c3c3c;
   border-radius: 2px;
-  margin-left: 4px;
+  padding: 6px 8px;
+}
+.pbu-drawer-error {
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 8px;
+  background: #5a1d1d;
+  border: 1px solid #832525;
+  color: #f2b3b3;
+  font-size: 11px;
+  padding: 6px 8px;
+  border-radius: 2px;
+}
+.pbu-drawer-code {
+  display: flex;
+  align-items: center;
+  gap: 8px;
+  margin: 8px 0;
+  background: #1e1e1e;
+  border: 1px solid #3c3c3c;
+  border-radius: 2px;
+  padding: 6px 8px;
+}
+.pbu-drawer-code code {
+  flex: 1;
+  font-family: ui-monospace, Menlo, monospace;
+  font-size: 11px;
+  color: #cccccc;
 }
 `
 );
-function j(e, r) {
+function K(e, t) {
   if (document.getElementById(e)) return;
   const o = document.createElement("style");
-  o.id = e, o.textContent = r, document.head.appendChild(o);
+  o.id = e, o.textContent = t, document.head.appendChild(o);
 }
-function ae() {
-  typeof document > "u" || (j(re, oe), j(te, ne));
+function ke() {
+  typeof document > "u" || (K(ye, me), K(we, ve));
 }
-function le(e, r, o, t = 140, a = 48) {
+function _e(e, t, o, r = 140, a = 48) {
   const c = /* @__PURE__ */ new Map();
-  for (const d of e) {
-    const u = c.get(d.parentId) ?? [];
-    u.push(d), c.set(d.parentId, u);
+  for (const s of e) {
+    const x = c.get(s.parentId) ?? [];
+    x.push(s), c.set(s.parentId, x);
   }
-  const s = /* @__PURE__ */ new Map();
-  let n = 0;
-  const i = (d) => {
-    const u = c.get(d.id) ?? [], m = d.depth * (r + t);
-    let w;
-    if (u.length === 0)
-      w = n, n += o + a;
+  const i = /* @__PURE__ */ new Map();
+  let l = 0;
+  const p = (s) => {
+    const x = c.get(s.id) ?? [], f = s.depth * (t + r);
+    let v;
+    if (x.length === 0)
+      v = l, l += o + a;
     else {
-      const p = u.map(i);
-      w = (Math.min(...p) + Math.max(...p)) / 2;
+      const N = x.map(p);
+      v = (Math.min(...N) + Math.max(...N)) / 2;
     }
-    return s.set(d.id, { x: m, y: w }), w;
+    return i.set(s.id, { x: f, y: v }), v;
   };
-  for (const d of c.get(null) ?? []) i(d);
-  return e.map((d) => ({ ...d, ...s.get(d.id) }));
-}
-const ce = W(function(r) {
-  const { page: o, viewport: t, thumbWidth: a, bodyHeight: c } = r.data, s = x((w) => w.openViewer), n = L(null), [i, d] = C(!1);
-  k(() => {
-    const w = n.current;
-    if (!w || o.external) return;
-    const p = new IntersectionObserver(([v]) => {
-      v.isIntersecting && (d(!0), p.disconnect());
+  for (const s of c.get(null) ?? []) p(s);
+  return e.map((s) => ({ ...s, ...i.get(s.id) }));
+}
+const Ne = ie(function(t) {
+  const { page: o, viewport: r, thumbWidth: a, bodyHeight: c } = t.data, i = y((v) => v.openViewer), l = $(null), [p, s] = _(!1);
+  I(() => {
+    const v = l.current;
+    if (!v || o.external) return;
+    const N = new IntersectionObserver(([g]) => {
+      g.isIntersecting && (s(!0), N.disconnect());
     });
-    return p.observe(w), () => p.disconnect();
+    return N.observe(v), () => N.disconnect();
   }, [o.external]);
-  const u = a / t.width;
-  return /* @__PURE__ */ b("div", { ref: n, className: "pbu-node", style: { width: a }, onClick: () => {
-    o.external ? window.open(o.path, "_blank", "noopener") : s(o.path);
+  const x = a / r.width;
+  return /* @__PURE__ */ u("div", { ref: l, className: "pbu-node", style: { width: a }, onClick: () => {
+    o.external ? window.open(o.path, "_blank", "noopener") : i(o.path);
   }, children: [
-    /* @__PURE__ */ l(T, { type: "target", position: N.Left, className: "pbu-handle", isConnectable: !1 }),
-    /* @__PURE__ */ b("div", { className: "pbu-node-header", children: [
-      /* @__PURE__ */ l("span", { className: "pbu-node-title", children: o.title }),
-      /* @__PURE__ */ l("span", { className: "pbu-node-path", children: o.external ? "외부 ↗" : o.path })
+    /* @__PURE__ */ n(J, { type: "target", position: j.Left, className: "pbu-handle", isConnectable: !1 }),
+    /* @__PURE__ */ u("div", { className: "pbu-node-header", children: [
+      /* @__PURE__ */ n("span", { className: "pbu-node-title", children: o.title }),
+      /* @__PURE__ */ n("span", { className: "pbu-node-path", children: o.external ? "외부 ↗" : o.path })
     ] }),
-    /* @__PURE__ */ b("div", { className: "pbu-node-body", style: { height: c }, children: [
-      o.external ? /* @__PURE__ */ l("div", { className: "pbu-node-placeholder", children: "↗ 외부 링크" }) : i ? /* @__PURE__ */ l(
+    /* @__PURE__ */ u("div", { className: "pbu-node-body", style: { height: c }, children: [
+      o.external ? /* @__PURE__ */ n("div", { className: "pbu-node-placeholder", children: "↗ 외부 링크" }) : p ? /* @__PURE__ */ n(
         "iframe",
         {
           className: "pbu-node-iframe",
@@ -400,57 +568,60 @@ const ce = W(function(r) {
           loading: "lazy",
           tabIndex: -1,
           style: {
-            width: t.width,
-            height: t.height,
-            transform: `scale(${u})`
+            width: r.width,
+            height: r.height,
+            transform: `scale(${x})`
           }
         }
-      ) : /* @__PURE__ */ l("div", { className: "pbu-node-placeholder", children: "…" }),
-      /* @__PURE__ */ l("div", { className: "pbu-node-shield" })
+      ) : /* @__PURE__ */ n("div", { className: "pbu-node-placeholder", children: "…" }),
+      /* @__PURE__ */ n("div", { className: "pbu-node-shield" })
     ] }),
-    /* @__PURE__ */ l(T, { type: "source", position: N.Right, className: "pbu-handle", isConnectable: !1 })
+    /* @__PURE__ */ n(J, { type: "source", position: j.Right, className: "pbu-handle", isConnectable: !1 })
   ] });
-}), ie = { page: ce }, S = 260, se = 30;
-function de({ ia: e }) {
-  const r = x((a) => a.closeMap), { nodes: o, edges: t } = G(() => {
-    const a = S / e.viewport.width, c = Math.round(e.viewport.height * a), s = c + se, n = le(e.nodes, S, s), i = n.map((u) => ({
-      id: u.id,
+}), Ee = { page: Ne }, V = 260, ze = 30;
+function Se({ ia: e }) {
+  const t = y((c) => c.closeMap), o = y((c) => c.toggleSkillDrawer), { nodes: r, edges: a } = G(() => {
+    const c = V / e.viewport.width, i = Math.round(e.viewport.height * c), l = i + ze, p = _e(e.nodes, V, l), s = p.map((f) => ({
+      id: f.id,
       type: "page",
-      position: { x: u.x, y: u.y },
+      position: { x: f.x, y: f.y },
       data: {
-        page: u,
+        page: f,
         viewport: e.viewport,
-        thumbWidth: S,
-        bodyHeight: c
+        thumbWidth: V,
+        bodyHeight: i
       },
-      sourcePosition: N.Right,
-      targetPosition: N.Left
-    })), d = n.filter((u) => u.parentId).map((u) => ({
-      id: `${u.parentId}->${u.id}`,
-      source: u.parentId,
-      target: u.id,
+      sourcePosition: j.Right,
+      targetPosition: j.Left
+    })), x = p.filter((f) => f.parentId).map((f) => ({
+      id: `${f.parentId}->${f.id}`,
+      source: f.parentId,
+      target: f.id,
       type: "smoothstep"
     }));
-    return { nodes: i, edges: d };
+    return { nodes: s, edges: x };
   }, [e]);
-  return k(() => {
-    const a = (c) => {
-      c.key === "Escape" && (x.getState().viewerPath || r());
+  return I(() => {
+    const c = (i) => {
+      if (i.key !== "Escape") return;
+      const l = y.getState();
+      l.viewerPath || l.skillDrawerOpen || t();
     };
-    return window.addEventListener("keydown", a), () => window.removeEventListener("keydown", a);
-  }, [r]), /* @__PURE__ */ b("div", { className: "pbu-overlay", children: [
-    /* @__PURE__ */ b("div", { className: "pbu-bar", children: [
-      /* @__PURE__ */ l("span", { className: "pbu-logo", children: "pubuilder" }),
-      /* @__PURE__ */ l("span", { className: "pbu-hint", children: "노드 클릭 → 페이지 확대 · 스크롤 줌 · 드래그 팬 · Esc 닫기" }),
-      /* @__PURE__ */ l("span", { className: "pbu-spacer" }),
-      /* @__PURE__ */ l("button", { type: "button", className: "pbu-icon-btn", onClick: r, "aria-label": "닫기", children: "✕" })
+    return window.addEventListener("keydown", c), () => window.removeEventListener("keydown", c);
+  }, [t]), /* @__PURE__ */ u("div", { className: "pbu-overlay", children: [
+    /* @__PURE__ */ u("div", { className: "pbu-bar", children: [
+      /* @__PURE__ */ n("span", { className: "pbu-logo", children: "pubuilder" }),
+      /* @__PURE__ */ n("span", { className: "pbu-hint", children: "노드 클릭 → 페이지 확대 · 스크롤 줌 · 드래그 팬 · Esc 닫기" }),
+      /* @__PURE__ */ n("span", { className: "pbu-spacer" }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: o, children: "🧰 스킬함" }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-icon-btn", onClick: t, "aria-label": "닫기", children: "✕" })
     ] }),
-    /* @__PURE__ */ l("div", { className: "pbu-canvas", children: /* @__PURE__ */ l(
-      Z,
+    /* @__PURE__ */ n("div", { className: "pbu-canvas", children: /* @__PURE__ */ n(
+      pe,
       {
-        nodes: o,
-        edges: t,
-        nodeTypes: ie,
+        nodes: r,
+        edges: a,
+        nodeTypes: Ee,
         fitView: !0,
         fitViewOptions: { padding: 0.15, maxZoom: 1 },
         minZoom: 0.05,
@@ -462,25 +633,25 @@ function de({ ia: e }) {
     ) })
   ] });
 }
-function ue() {
-  const e = x((t) => t.isMapOpen), r = x((t) => t.openMap), o = x((t) => t.closeMap);
-  return /* @__PURE__ */ l(
+function Ce() {
+  const e = y((r) => r.isMapOpen), t = y((r) => r.openMap), o = y((r) => r.closeMap);
+  return /* @__PURE__ */ n(
     "button",
     {
       type: "button",
       className: "pbu-fab",
       title: "Page Map (pubuilder)",
       "aria-label": "페이지 맵 열기",
-      onClick: () => e ? o() : r(),
-      children: /* @__PURE__ */ b("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
-        /* @__PURE__ */ l("polygon", { points: "3 6 9 3 15 6 21 3 21 18 15 21 9 18 3 21" }),
-        /* @__PURE__ */ l("line", { x1: "9", y1: "3", x2: "9", y2: "18" }),
-        /* @__PURE__ */ l("line", { x1: "15", y1: "6", x2: "15", y2: "21" })
+      onClick: () => e ? o() : t(),
+      children: /* @__PURE__ */ u("svg", { width: "22", height: "22", viewBox: "0 0 24 24", fill: "none", stroke: "currentColor", strokeWidth: "2", strokeLinecap: "round", strokeLinejoin: "round", "aria-hidden": "true", children: [
+        /* @__PURE__ */ n("polygon", { points: "3 6 9 3 15 6 21 3 21 18 15 21 9 18 3 21" }),
+        /* @__PURE__ */ n("line", { x1: "9", y1: "3", x2: "9", y2: "18" }),
+        /* @__PURE__ */ n("line", { x1: "15", y1: "6", x2: "15", y2: "21" })
       ] })
     }
   );
 }
-const pe = /* @__PURE__ */ new Set([
+const Te = /* @__PURE__ */ new Set([
   "section",
   "header",
   "footer",
@@ -489,7 +660,7 @@ const pe = /* @__PURE__ */ new Set([
   "article",
   "aside",
   "form"
-]), fe = /* @__PURE__ */ new Set([
+]), Le = /* @__PURE__ */ new Set([
   "a",
   "button",
   "input",
@@ -509,82 +680,82 @@ const pe = /* @__PURE__ */ new Set([
   "p",
   "label"
 ]);
-function Y(e, r) {
+function le(e, t) {
   const o = [];
-  let t = e;
-  for (; t && t !== r.body && t !== r.documentElement; )
-    o.push(t), t = t.parentElement;
+  let r = e;
+  for (; r && r !== t.body && r !== t.documentElement; )
+    o.push(r), r = r.parentElement;
   return o;
 }
-function be(e, r) {
-  const o = Y(e, r);
+function Me(e, t) {
+  const o = le(e, t);
   if (o.length === 0) return null;
-  const t = o.find((s) => {
-    const n = s.tagName.toLowerCase();
-    return pe.has(n) && n !== "main";
+  const r = o.find((i) => {
+    const l = i.tagName.toLowerCase();
+    return Te.has(l) && l !== "main";
   });
-  if (t) return t;
-  const a = o.find((s) => s.tagName.toLowerCase() === "main");
+  if (r) return r;
+  const a = o.find((i) => i.tagName.toLowerCase() === "main");
   if (a) return a;
-  const c = r.body.scrollHeight || 1;
-  for (let s = o.length - 1; s >= 0; s--) {
-    const n = o[s].getBoundingClientRect();
-    if (n.height > 0 && n.height < c * 0.8) return o[s];
+  const c = t.body.scrollHeight || 1;
+  for (let i = o.length - 1; i >= 0; i--) {
+    const l = o[i].getBoundingClientRect();
+    if (l.height > 0 && l.height < c * 0.8) return o[i];
   }
   return o[o.length - 1];
 }
-function he(e, r) {
-  const o = Y(e, r);
-  for (const t of o) {
-    if (fe.has(t.tagName.toLowerCase())) return t;
-    const a = t.getBoundingClientRect(), c = t.children.length > 0 || (t.textContent ?? "").trim().length > 0;
-    if (a.width >= 40 && a.height >= 24 && c) return t;
+function Pe(e, t) {
+  const o = le(e, t);
+  for (const r of o) {
+    if (Le.has(r.tagName.toLowerCase())) return r;
+    const a = r.getBoundingClientRect(), c = r.children.length > 0 || (r.textContent ?? "").trim().length > 0;
+    if (a.width >= 40 && a.height >= 24 && c) return r;
   }
   return o[0] ?? null;
 }
-function ge(e, r, o) {
-  return o === "all" ? r.body : o === "section" ? be(e, r) : he(e, r);
+function Oe(e, t, o) {
+  return o === "all" ? t.body : o === "section" ? Me(e, t) : Pe(e, t);
 }
-function xe(e) {
+function Ie(e) {
   const o = e.querySelector("h1, h2, h3, h4, h5, h6")?.textContent?.trim();
-  if (o) return E(o);
-  const t = e.getAttribute("aria-label");
-  if (t) return E(t);
+  if (o) return B(o);
+  const r = e.getAttribute("aria-label");
+  if (r) return B(r);
   const a = e.getAttribute("alt");
-  if (a) return E(a);
+  if (a) return B(a);
   const c = (e.textContent ?? "").trim().replace(/\s+/g, " ");
-  return c ? E(c) : `<${e.tagName.toLowerCase()}>`;
+  return c ? B(c) : `<${e.tagName.toLowerCase()}>`;
 }
-function E(e, r = 30) {
-  return e.length > r ? `${e.slice(0, r)}…` : e;
+function B(e, t = 30) {
+  return e.length > t ? `${e.slice(0, t)}…` : e;
 }
-function we(e, r) {
+function Re(e, t) {
   if (e.id) return `#${CSS.escape(e.id)}`;
   const o = [];
-  let t = e;
-  for (; t && t !== r.body && o.length < 8; ) {
-    if (t.id)
-      return o.unshift(`#${CSS.escape(t.id)}`), o.join(" > ");
-    const a = t.tagName.toLowerCase(), c = t.parentElement;
-    let s = a;
+  let r = e;
+  for (; r && r !== t.body && o.length < 8; ) {
+    if (r.id)
+      return o.unshift(`#${CSS.escape(r.id)}`), o.join(" > ");
+    const a = r.tagName.toLowerCase(), c = r.parentElement;
+    let i = a;
     if (c) {
-      const n = Array.from(c.children).filter(
-        (i) => i.tagName === t.tagName
+      const l = Array.from(c.children).filter(
+        (p) => p.tagName === r.tagName
       );
-      n.length > 1 && (s += `:nth-of-type(${n.indexOf(t) + 1})`);
+      l.length > 1 && (i += `:nth-of-type(${l.indexOf(r) + 1})`);
     }
-    o.unshift(s), t = c;
+    o.unshift(i), r = c;
   }
   return o.join(" > ");
 }
-function H(e, r, o) {
-  const t = e.createElement("div");
-  t.setAttribute("data-pubuilder", "highlight"), Object.assign(t.style, {
+function Z(e, t, o) {
+  const r = e.createElement("div");
+  r.setAttribute("data-pubuilder", "highlight"), Object.assign(r.style, {
     position: "fixed",
     top: "0",
     left: "0",
     display: "none",
-    border: `1px solid ${r}`,
+    border: `1px solid ${t}`,
     background: o,
     borderRadius: "0",
     pointerEvents: "none",
@@ -597,283 +768,552 @@ function H(e, r, o) {
     left: "-1px",
     top: "-22px",
     padding: "2px 7px",
-    background: r,
+    background: t,
     color: "#fff",
     font: "600 10px/16px system-ui, sans-serif",
     borderRadius: "0",
     whiteSpace: "nowrap",
     pointerEvents: "none"
-  }), t.appendChild(a), { root: t, label: a };
+  }), r.appendChild(a), { root: r, label: a };
 }
-function V(e, r, o, t) {
-  const a = r.getBoundingClientRect(), c = t ?? -1 / 0, s = Math.max(a.top, c), n = a.bottom - s;
-  if (n <= 2) {
-    M(e);
+function Q(e, t, o, r) {
+  const a = t.getBoundingClientRect(), c = r ?? -1 / 0, i = Math.max(a.top, c), l = a.bottom - i;
+  if (l <= 2) {
+    W(e);
     return;
   }
-  e.root.style.display = "block", e.root.style.transform = `translate(${a.x}px, ${s}px)`, e.root.style.width = `${a.width}px`, e.root.style.height = `${n}px`, e.label.textContent = o, e.label.style.top = s < 30 || s - 24 < c ? "2px" : "-24px";
+  e.root.style.display = "block", e.root.style.transform = `translate(${a.x}px, ${i}px)`, e.root.style.width = `${a.width}px`, e.root.style.height = `${l}px`, e.label.textContent = o, e.label.style.top = i < 30 || i - 24 < c ? "2px" : "-24px";
 }
-function M(e) {
+function W(e) {
   e.root.style.display = "none";
 }
-function D(e) {
-  const r = e.getBoundingClientRect();
-  return `${e.tagName.toLowerCase()} · ${Math.round(r.width)}×${Math.round(r.height)}`;
+function ee(e) {
+  const t = e.getBoundingClientRect();
+  return `${e.tagName.toLowerCase()} · ${Math.round(t.width)}×${Math.round(t.height)}`;
 }
-function me(e, r) {
+function $e(e, t) {
   let o = null;
   try {
     o = e.contentDocument;
   } catch {
     return null;
   }
-  const t = e.contentWindow;
-  if (!o || !o.body || !t) return null;
+  const r = e.contentWindow;
+  if (!o || !o.body || !r) return null;
   const a = o;
-  let c = r.granularity, s = r.enabled, n = null, i = null;
-  const d = H(a, "rgba(14,99,156,0.95)", "rgba(14,99,156,0.10)"), u = H(a, "rgba(35,134,54,0.95)", "rgba(35,134,54,0.07)");
-  a.body.appendChild(d.root), a.body.appendChild(u.root);
-  let m = [], w = 0;
-  const p = () => {
-    m = [];
-    for (const f of Array.from(a.body.querySelectorAll("*"))) {
-      if (f === d.root || f === u.root || d.root.contains(f) || u.root.contains(f)) continue;
-      const g = t.getComputedStyle(f).position;
-      if (g !== "fixed" && g !== "sticky") continue;
-      const h = f.getBoundingClientRect();
-      h.width === 0 || h.height === 0 || h.top <= 1 && h.height < t.innerHeight * 0.5 && m.push({ el: f, rect: h });
+  let c = t.granularity, i = t.enabled, l = null, p = null;
+  const s = Z(a, "rgba(14,99,156,0.95)", "rgba(14,99,156,0.10)"), x = Z(a, "rgba(35,134,54,0.95)", "rgba(35,134,54,0.07)");
+  a.body.appendChild(s.root), a.body.appendChild(x.root);
+  let f = [], v = 0;
+  const N = () => {
+    f = [];
+    for (const b of Array.from(a.body.querySelectorAll("*"))) {
+      if (b === s.root || b === x.root || s.root.contains(b) || x.root.contains(b)) continue;
+      const k = r.getComputedStyle(b).position;
+      if (k !== "fixed" && k !== "sticky") continue;
+      const m = b.getBoundingClientRect();
+      m.width === 0 || m.height === 0 || m.top <= 1 && m.height < r.innerHeight * 0.5 && f.push({ el: b, rect: m });
     }
-  }, v = () => {
-    const f = Date.now();
-    f - w < 500 || (w = f, p());
-  }, z = (f) => {
-    const g = f.getBoundingClientRect();
-    let h = null;
-    for (const y of m)
-      y.el === f || y.el.contains(f) || f.contains(y.el) || !(g.left < y.rect.right && g.right > y.rect.left) || (h === null || y.rect.bottom > h) && (h = y.rect.bottom);
-    return h;
-  }, _ = () => {
-    n && s && n.isConnected ? V(d, n, D(n), z(n)) : M(d), i && i.isConnected ? V(u, i, `선택됨 · ${D(i)}`, z(i)) : M(u);
-  }, P = (f) => {
+  }, g = () => {
+    const b = Date.now();
+    b - v < 500 || (v = b, N());
+  }, S = (b) => {
+    const k = b.getBoundingClientRect();
+    let m = null;
+    for (const E of f)
+      E.el === b || E.el.contains(b) || b.contains(E.el) || !(k.left < E.rect.right && k.right > E.rect.left) || (m === null || E.rect.bottom > m) && (m = E.rect.bottom);
+    return m;
+  }, C = () => {
+    l && i && l.isConnected ? Q(s, l, ee(l), S(l)) : W(s), p && p.isConnected ? Q(x, p, `선택됨 · ${ee(p)}`, S(p)) : W(x);
+  }, L = (b) => {
     if (c === "all") return a.body;
-    if (i && i.isConnected && i.contains(f)) {
-      if (i === f) return i;
-      let g = f;
-      for (; g.parentElement && g.parentElement !== i; )
-        g = g.parentElement;
-      return g;
+    if (p && p.isConnected && p.contains(b)) {
+      if (p === b) return p;
+      let k = b;
+      for (; k.parentElement && k.parentElement !== p; )
+        k = k.parentElement;
+      return k;
     }
-    return ge(f, a, c);
-  }, I = (f) => {
-    if (!s) return;
-    v();
-    const g = f.target;
-    if (!g || !a.body.contains(g)) return;
-    const h = P(g);
-    h !== n && (n = h, _());
-  }, $ = (f) => {
-    if (!s) return;
-    f.preventDefault(), f.stopPropagation(), p(), w = Date.now();
-    const g = f.target;
-    if (!g) return;
-    const h = P(g);
-    if (!h) return;
-    i = h, _();
-    const y = h.getBoundingClientRect();
-    r.onSelect({
-      pagePath: r.pagePath,
-      selector: we(h, a),
-      tag: h.tagName.toLowerCase(),
-      label: xe(h),
-      rect: {
-        x: y.x + t.scrollX,
-        y: y.y + t.scrollY,
-        width: y.width,
-        height: y.height
+    return Oe(b, a, c);
+  }, R = (b) => {
+    if (!i) return;
+    g();
+    const k = b.target;
+    if (!k || !a.body.contains(k)) return;
+    const m = L(k);
+    m !== l && (l = m, C());
+  }, M = (b) => {
+    if (!i) return;
+    b.preventDefault(), b.stopPropagation(), N(), v = Date.now();
+    const k = b.target;
+    if (!k) return;
+    const m = L(k);
+    if (!m) return;
+    p = m, C();
+    const E = m.getBoundingClientRect();
+    t.onSelect(
+      {
+        pagePath: t.pagePath,
+        selector: Re(m, a),
+        tag: m.tagName.toLowerCase(),
+        label: Ie(m),
+        rect: {
+          x: E.x + r.scrollX,
+          y: E.y + r.scrollY,
+          width: E.width,
+          height: E.height
+        },
+        granularity: c
       },
-      granularity: c
-    });
-  }, B = () => {
-    n = null, _();
-  }, O = () => _(), R = () => {
-    p(), _();
+      m
+    );
+  }, T = () => {
+    l = null, C();
+  }, O = () => C(), P = () => {
+    N(), C();
   };
-  return p(), a.addEventListener("mousemove", I, !0), a.addEventListener("click", $, !0), a.documentElement.addEventListener("mouseleave", B), t.addEventListener("scroll", O, !0), t.addEventListener("resize", R), {
+  return N(), a.addEventListener("mousemove", R, !0), a.addEventListener("click", M, !0), a.documentElement.addEventListener("mouseleave", T), r.addEventListener("scroll", O, !0), r.addEventListener("resize", P), {
     destroy() {
       try {
-        a.removeEventListener("mousemove", I, !0), a.removeEventListener("click", $, !0), a.documentElement.removeEventListener("mouseleave", B), t.removeEventListener("scroll", O, !0), t.removeEventListener("resize", R), d.root.remove(), u.root.remove();
+        a.removeEventListener("mousemove", R, !0), a.removeEventListener("click", M, !0), a.documentElement.removeEventListener("mouseleave", T), r.removeEventListener("scroll", O, !0), r.removeEventListener("resize", P), s.root.remove(), x.root.remove();
       } catch {
       }
     },
-    setGranularity(f) {
-      c = f, n = null, _();
+    setGranularity(b) {
+      c = b, l = null, C();
     },
-    setEnabled(f) {
-      s = f, f || (n = null), _();
+    setEnabled(b) {
+      i = b, b || (l = null), C();
     }
   };
 }
-function ye() {
-  const e = x((a) => a.selection), [r, o] = C(!1), t = async () => {
+const De = {
+  log: "💬",
+  tool: "🔧",
+  error: "⛔",
+  done: "✅"
+};
+function Ae() {
+  const e = oe(Y), t = y((d) => d.selection), o = y((d) => d.selectedOuterHTML), r = y((d) => d.toggleSkillDrawer), [a, c] = _(""), [i, l] = _("idle"), [p, s] = _(null), [x, f] = _([]), [v, N] = _(!1), [g, S] = _(!1), [C, L] = _(null), [R, M] = _(null), [T, O] = _(!1), [P, b] = _(!1), k = $(null), m = $(null), E = $(0);
+  I(() => {
+    E.current++, m.current?.(), m.current = null, l("idle"), s(null), f([]), N(!1), S(!1), O(!1), L(null), M(null), c("");
+  }, [t?.selector]), I(() => {
+    const d = k.current;
+    d && (d.scrollTop = d.scrollHeight);
+  }, [x]), I(() => () => {
+    E.current++, m.current?.(), m.current = null;
+  }, []);
+  const A = (d) => {
+    m.current = e.subscribePublish(d, (z) => {
+      f((D) => [...D, z]), z.type === "done" ? (l("done"), s(null), O(!1), m.current?.(), m.current = null) : z.type === "error" && (l("error"), L(z.text), s(null), O(!1), m.current?.(), m.current = null);
+    });
+  }, U = async () => {
+    if (!t || i === "running" || g) return;
+    const d = E.current;
+    N(!1), L(null), M(null), S(!0);
+    try {
+      const z = await e.isAlive();
+      if (d !== E.current) return;
+      if (!z) {
+        N(!0);
+        return;
+      }
+      const { jobId: D } = await e.startPublish({
+        selection: t,
+        outerHTML: o ?? "",
+        figmaUrl: a
+      });
+      if (d !== E.current) {
+        e.cancelPublish(D).catch(() => {
+        });
+        return;
+      }
+      s(D), f([]), l("running"), A(D);
+    } catch (z) {
+      if (d !== E.current) return;
+      l("error"), L(z instanceof Error ? z.message : String(z)), M(z instanceof re ? z.code ?? null : null);
+    } finally {
+      S(!1);
+    }
+  }, F = async () => {
+    if (!(!p || T)) {
+      O(!0);
+      try {
+        await e.cancelPublish(p);
+      } catch (d) {
+        L(d instanceof Error ? d.message : String(d)), O(!1);
+      }
+    }
+  }, q = async () => {
+    await navigator.clipboard.writeText("npx pubuilder serve"), b(!0), setTimeout(() => b(!1), 1200);
+  }, H = async () => {
+    S(!0);
+    try {
+      const d = await e.isAlive();
+      N(!d);
+    } finally {
+      S(!1);
+    }
+  }, h = i === "running";
+  return /* @__PURE__ */ u("div", { className: "pbu-publish", children: [
+    /* @__PURE__ */ n("label", { children: "Figma 노드 링크" }),
+    /* @__PURE__ */ n(
+      "input",
+      {
+        value: a,
+        onChange: (d) => c(d.target.value),
+        disabled: h,
+        placeholder: "https://www.figma.com/design/..."
+      }
+    ),
+    v && /* @__PURE__ */ u("div", { className: "pbu-panel-empty", children: [
+      "컴패니언 서버가 꺼져 있어요",
+      /* @__PURE__ */ u("div", { className: "pbu-drawer-code", children: [
+        /* @__PURE__ */ n("code", { children: "npx pubuilder serve" }),
+        /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: q, children: P ? "복사됨 ✓" : "복사" })
+      ] }),
+      /* @__PURE__ */ n("div", { className: "pbu-hint", children: 'package.json의 dev 스크립트를 "pubuilder dev -- <기존 명령>"으로 감싸면 자동 실행돼요' }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", disabled: g, onClick: H, children: "다시 확인" })
+    ] }),
+    C && !v && /* @__PURE__ */ u("div", { className: "pbu-drawer-error", children: [
+      /* @__PURE__ */ n("span", { children: C }),
+      (R === "NO_FIGMA_TOKEN" || R === "FIGMA_API_ERROR") && /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: r, children: "스킬함 열기" })
+    ] }),
+    h ? /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn pbu-btn-primary", disabled: T, onClick: F, children: T ? "중단 중..." : "중단" }) : /* @__PURE__ */ n(
+      "button",
+      {
+        type: "button",
+        className: "pbu-btn pbu-btn-primary",
+        disabled: g || !t,
+        onClick: U,
+        children: "이 블록 퍼블리싱"
+      }
+    ),
+    (x.length > 0 || h) && /* @__PURE__ */ u("div", { className: "pbu-publish-log", ref: k, children: [
+      h && x.length === 0 && /* @__PURE__ */ n("div", { className: "pbu-log-line pbu-log-tool", children: "실행 중..." }),
+      x.map((d, z) => /* @__PURE__ */ u(
+        "div",
+        {
+          className: d.type === "error" ? "pbu-log-line pbu-log-error" : d.type === "done" ? "pbu-log-line pbu-log-done" : d.type === "tool" ? "pbu-log-line pbu-log-tool" : "pbu-log-line",
+          children: [
+            /* @__PURE__ */ n("span", { children: De[d.type] }),
+            " ",
+            /* @__PURE__ */ n("span", { children: d.text })
+          ]
+        },
+        z
+      ))
+    ] })
+  ] });
+}
+function He() {
+  const e = y((a) => a.selection), [t, o] = _(!1), r = async () => {
     e && (await navigator.clipboard.writeText(e.selector), o(!0), setTimeout(() => o(!1), 1200));
   };
-  return /* @__PURE__ */ b("aside", { className: "pbu-panel", children: [
-    /* @__PURE__ */ l("div", { className: "pbu-panel-title", children: "선택된 블록" }),
-    e ? /* @__PURE__ */ b(F, { children: [
-      /* @__PURE__ */ b("div", { className: "pbu-field", children: [
-        /* @__PURE__ */ l("label", { children: "페이지" }),
-        /* @__PURE__ */ l("code", { children: e.pagePath })
+  return /* @__PURE__ */ u("aside", { className: "pbu-panel", children: [
+    /* @__PURE__ */ n("div", { className: "pbu-panel-title", children: "선택된 블록" }),
+    e ? /* @__PURE__ */ u(te, { children: [
+      /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("label", { children: "페이지" }),
+        /* @__PURE__ */ n("code", { children: e.pagePath })
       ] }),
-      /* @__PURE__ */ b("div", { className: "pbu-field", children: [
-        /* @__PURE__ */ l("label", { children: "블록" }),
-        /* @__PURE__ */ b("div", { children: [
-          /* @__PURE__ */ l("span", { className: "pbu-chip", children: e.tag }),
-          /* @__PURE__ */ l("span", { children: e.label })
+      /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("label", { children: "블록" }),
+        /* @__PURE__ */ u("div", { children: [
+          /* @__PURE__ */ n("span", { className: "pbu-chip", children: e.tag }),
+          /* @__PURE__ */ n("span", { children: e.label })
         ] })
       ] }),
-      /* @__PURE__ */ b("div", { className: "pbu-field", children: [
-        /* @__PURE__ */ l("label", { children: "Selector" }),
-        /* @__PURE__ */ l("code", { className: "pbu-selector", children: e.selector }),
-        /* @__PURE__ */ l("button", { type: "button", className: "pbu-btn", onClick: t, children: r ? "복사됨 ✓" : "Selector 복사" })
+      /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("label", { children: "Selector" }),
+        /* @__PURE__ */ n("code", { className: "pbu-selector", children: e.selector }),
+        /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: r, children: t ? "복사됨 ✓" : "Selector 복사" })
       ] }),
-      /* @__PURE__ */ b("div", { className: "pbu-field", children: [
-        /* @__PURE__ */ l("label", { children: "크기" }),
-        /* @__PURE__ */ b("span", { children: [
+      /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("label", { children: "크기" }),
+        /* @__PURE__ */ u("span", { children: [
           Math.round(e.rect.width),
           " × ",
           Math.round(e.rect.height),
           "px"
         ] })
       ] }),
-      /* @__PURE__ */ b("div", { className: "pbu-field", children: [
-        /* @__PURE__ */ l("label", { children: "단위" }),
-        /* @__PURE__ */ l("span", { children: e.granularity === "all" ? "전체" : e.granularity === "section" ? "섹션" : "유닛" })
+      /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("label", { children: "단위" }),
+        /* @__PURE__ */ n("span", { children: e.granularity === "all" ? "전체" : e.granularity === "section" ? "섹션" : "유닛" })
       ] }),
-      /* @__PURE__ */ b("div", { className: "pbu-phase3", children: [
-        /* @__PURE__ */ b("label", { children: [
-          "Figma 노드 링크",
-          /* @__PURE__ */ l("span", { className: "pbu-badge", children: "PHASE 3" })
-        ] }),
-        /* @__PURE__ */ l("input", { disabled: !0, placeholder: "https://figma.com/design/..." }),
-        /* @__PURE__ */ l("button", { type: "button", disabled: !0, className: "pbu-btn pbu-btn-primary", children: "이 블록 퍼블리싱 (준비 중)" })
-      ] })
-    ] }) : /* @__PURE__ */ b("div", { className: "pbu-panel-empty", children: [
+      /* @__PURE__ */ n(Ae, {})
+    ] }) : /* @__PURE__ */ u("div", { className: "pbu-panel-empty", children: [
       "화면에서 블록에 마우스를 올리고 클릭해 선택하세요.",
-      /* @__PURE__ */ l("br", {}),
+      /* @__PURE__ */ n("br", {}),
       "상단 토글로 ",
-      /* @__PURE__ */ l("b", { children: "전체 / 섹션 / 유닛" }),
+      /* @__PURE__ */ n("b", { children: "전체 / 섹션 / 유닛" }),
       " 단위를 바꿀 수 있어요."
     ] })
   ] });
 }
-function _e({ ia: e }) {
-  const r = x((p) => p.viewerPath), o = x((p) => p.closeViewer), t = x((p) => p.granularity), a = x((p) => p.setGranularity), c = x((p) => p.inspectEnabled), s = x((p) => p.setInspectEnabled), n = L(null), i = L(null), [d, u] = C(!1), m = e.nodes.find((p) => p.path === r), w = () => {
-    i.current?.destroy(), i.current = null;
-    const p = n.current;
-    if (!p || !r) return;
-    const v = x.getState(), z = me(p, {
-      pagePath: r,
-      granularity: v.granularity,
-      enabled: v.inspectEnabled,
-      onSelect: (_) => x.getState().setSelection(_)
+function Be({ ia: e }) {
+  const t = y((g) => g.viewerPath), o = y((g) => g.closeViewer), r = y((g) => g.granularity), a = y((g) => g.setGranularity), c = y((g) => g.inspectEnabled), i = y((g) => g.setInspectEnabled), l = y((g) => g.toggleSkillDrawer), p = $(null), s = $(null), [x, f] = _(!1), v = e.nodes.find((g) => g.path === t), N = () => {
+    s.current?.destroy(), s.current = null;
+    const g = p.current;
+    if (!g || !t) return;
+    const S = y.getState(), C = $e(g, {
+      pagePath: t,
+      granularity: S.granularity,
+      enabled: S.inspectEnabled,
+      onSelect: (L, R) => (
+        // 20K 상한 — 프롬프트 비대화 방지
+        y.getState().setSelectionWithHTML(L, R.outerHTML.slice(0, 2e4))
+      )
     });
-    if (!z) {
-      u(!0);
+    if (!C) {
+      f(!0);
       return;
     }
-    u(!1), i.current = z;
+    f(!1), s.current = C;
   };
-  return k(() => () => i.current?.destroy(), []), k(() => {
-    i.current?.setGranularity(t);
-  }, [t]), k(() => {
-    i.current?.setEnabled(c);
-  }, [c]), k(() => {
-    const p = (v) => {
-      v.key === "Escape" && o();
+  return I(() => () => s.current?.destroy(), []), I(() => {
+    s.current?.setGranularity(r);
+  }, [r]), I(() => {
+    s.current?.setEnabled(c);
+  }, [c]), I(() => {
+    const g = (S) => {
+      S.key === "Escape" && (y.getState().skillDrawerOpen || o());
     };
-    return window.addEventListener("keydown", p), () => window.removeEventListener("keydown", p);
-  }, [o]), m ? /* @__PURE__ */ b("div", { className: "pbu-viewer", children: [
-    /* @__PURE__ */ b("div", { className: "pbu-bar", children: [
-      /* @__PURE__ */ l("button", { type: "button", className: "pbu-btn", onClick: o, children: "← 맵으로" }),
-      /* @__PURE__ */ b("span", { className: "pbu-viewer-title", children: [
-        m.title,
-        /* @__PURE__ */ l("code", { children: m.path })
+    return window.addEventListener("keydown", g), () => window.removeEventListener("keydown", g);
+  }, [o]), v ? /* @__PURE__ */ u("div", { className: "pbu-viewer", children: [
+    /* @__PURE__ */ u("div", { className: "pbu-bar", children: [
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: o, children: "← 맵으로" }),
+      /* @__PURE__ */ u("span", { className: "pbu-viewer-title", children: [
+        v.title,
+        /* @__PURE__ */ n("code", { children: v.path })
       ] }),
-      /* @__PURE__ */ l("span", { className: "pbu-spacer" }),
-      d && /* @__PURE__ */ l("span", { className: "pbu-hint", children: "⚠ 이 페이지는 검사할 수 없어요" }),
-      /* @__PURE__ */ b("div", { className: "pbu-seg", role: "group", "aria-label": "블록 단위", children: [
-        /* @__PURE__ */ l(
+      /* @__PURE__ */ n("span", { className: "pbu-spacer" }),
+      x && /* @__PURE__ */ n("span", { className: "pbu-hint", children: "⚠ 이 페이지는 검사할 수 없어요" }),
+      /* @__PURE__ */ u("div", { className: "pbu-seg", role: "group", "aria-label": "블록 단위", children: [
+        /* @__PURE__ */ n(
           "button",
           {
             type: "button",
-            className: t === "all" ? "pbu-on" : "",
+            className: r === "all" ? "pbu-on" : "",
             onClick: () => a("all"),
             children: "전체"
           }
         ),
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ n(
           "button",
           {
             type: "button",
-            className: t === "section" ? "pbu-on" : "",
+            className: r === "section" ? "pbu-on" : "",
             onClick: () => a("section"),
             children: "섹션"
           }
         ),
-        /* @__PURE__ */ l(
+        /* @__PURE__ */ n(
           "button",
           {
             type: "button",
-            className: t === "unit" ? "pbu-on" : "",
+            className: r === "unit" ? "pbu-on" : "",
             onClick: () => a("unit"),
             children: "유닛"
           }
         )
       ] }),
-      /* @__PURE__ */ b("label", { className: "pbu-toggle", children: [
-        /* @__PURE__ */ l(
+      /* @__PURE__ */ u("label", { className: "pbu-toggle", children: [
+        /* @__PURE__ */ n(
           "input",
           {
             type: "checkbox",
             checked: c,
-            onChange: (p) => s(p.target.checked)
+            onChange: (g) => i(g.target.checked)
           }
         ),
         "검사 모드"
       ] }),
-      /* @__PURE__ */ l("button", { type: "button", className: "pbu-icon-btn", onClick: o, "aria-label": "닫기", children: "✕" })
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: l, children: "🧰 스킬함" }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-icon-btn", onClick: o, "aria-label": "닫기", children: "✕" })
     ] }),
-    /* @__PURE__ */ b("div", { className: "pbu-viewer-body", children: [
-      /* @__PURE__ */ l("div", { className: "pbu-viewer-frame-wrap", children: /* @__PURE__ */ l(
+    /* @__PURE__ */ u("div", { className: "pbu-viewer-body", children: [
+      /* @__PURE__ */ n("div", { className: "pbu-viewer-frame-wrap", children: /* @__PURE__ */ n(
         "iframe",
         {
-          ref: n,
+          ref: p,
           className: "pbu-viewer-iframe",
-          src: m.path,
-          title: m.title,
-          onLoad: w
+          src: v.path,
+          title: v.title,
+          onLoad: N
         }
       ) }),
-      /* @__PURE__ */ l(ye, {})
+      /* @__PURE__ */ n(He, {})
     ] })
   ] }) : null;
 }
-function Le({ config: e, enabled: r = !0 }) {
-  const o = r && !ee(), [t, a] = C(!1), c = x((i) => i.isMapOpen), s = x((i) => i.viewerPath), n = G(() => J(e), [e]);
-  return U(() => {
-    o && window.self === window.top && (ae(), a(!0));
-  }, [o]), !t || !o ? null : X(
-    /* @__PURE__ */ b(F, { children: [
-      /* @__PURE__ */ l(ue, {}),
-      c && /* @__PURE__ */ l(de, { ia: n }),
-      s && /* @__PURE__ */ l(_e, { ia: n })
+const je = {
+  project: "프로젝트",
+  global: "글로벌",
+  uploaded: "업로드"
+}, Ue = ["project", "global", "uploaded"];
+function Fe() {
+  const e = y((h) => h.toggleSkillDrawer), t = oe(Y), [o, r] = _(!0), [a, c] = _(!1), [i, l] = _([]), [p, s] = _(null), [x, f] = _(""), [v, N] = _(!1), [g, S] = _(null), [C, L] = _(!1), R = $(null), M = $(0), [T, O] = _(null), P = async () => {
+    const h = ++M.current;
+    r(!0), S(null);
+    try {
+      const w = await t.isAlive();
+      if (h !== M.current || (c(w), !w)) return;
+      const [d, z] = await Promise.all([t.listSkills(), t.tokenStatus()]);
+      if (h !== M.current) return;
+      l(d), s(z), N(!z.configured);
+    } catch (w) {
+      if (h !== M.current) return;
+      S(w instanceof Error ? w.message : String(w));
+    } finally {
+      h === M.current && r(!1);
+    }
+  };
+  I(() => {
+    P();
+  }, []), I(() => {
+    const h = (w) => {
+      w.key === "Escape" && e();
+    };
+    return window.addEventListener("keydown", h), () => window.removeEventListener("keydown", h);
+  }, [e]);
+  const b = async (h, w) => {
+    if (!T) {
+      O(h);
+      try {
+        await w();
+      } catch (d) {
+        S(d instanceof Error ? d.message : String(d));
+      } finally {
+        O(null);
+      }
+    }
+  }, k = (h, w) => b(`toggle:${h}`, async () => {
+    await t.toggleSkill(h, w), await P();
+  }), m = (h, w) => {
+    window.confirm(`"${w}" 스킬을 삭제할까요?`) && b(`remove:${h}`, async () => {
+      await t.removeSkill(h), await P();
+    });
+  }, E = () => R.current?.click(), A = (h) => {
+    const w = h.target.files?.[0];
+    h.target.value = "", w && b("upload", async () => {
+      const d = new FileReader(), z = await new Promise((D, ae) => {
+        d.onload = () => D(String(d.result ?? "")), d.onerror = () => ae(d.error ?? new Error("파일을 읽을 수 없어요")), d.readAsText(w);
+      });
+      await t.uploadSkill(w.name, z), await P();
+    });
+  }, U = () => b("token:save", async () => {
+    x.trim() && (await t.saveToken(x.trim()), f(""), await P());
+  }), F = () => b("token:delete", async () => {
+    await t.deleteToken(), f(""), await P();
+  }), q = async () => {
+    await navigator.clipboard.writeText("npx pubuilder serve"), L(!0), setTimeout(() => L(!1), 1200);
+  }, H = Ue.map((h) => ({
+    source: h,
+    label: je[h],
+    items: i.filter((w) => w.source === h)
+  })).filter((h) => h.items.length > 0);
+  return /* @__PURE__ */ u("aside", { className: "pbu-drawer", children: [
+    /* @__PURE__ */ u("div", { className: "pbu-drawer-header", children: [
+      /* @__PURE__ */ n("span", { className: "pbu-panel-title", children: "스킬함" }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-icon-btn", onClick: e, "aria-label": "닫기", children: "✕" })
+    ] }),
+    g && /* @__PURE__ */ u("div", { className: "pbu-drawer-error", children: [
+      /* @__PURE__ */ n("span", { children: g }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-icon-btn", onClick: () => S(null), "aria-label": "닫기", children: "✕" })
+    ] }),
+    o ? /* @__PURE__ */ n("div", { className: "pbu-panel-empty", children: "불러오는 중..." }) : a ? /* @__PURE__ */ u(te, { children: [
+      /* @__PURE__ */ n("div", { className: "pbu-drawer-group", children: "토큰" }),
+      p?.configured && !v ? /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n("span", { className: "pbu-token-masked", children: p.masked }),
+        /* @__PURE__ */ u("div", { children: [
+          /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", disabled: T !== null, onClick: () => N(!0), children: "재입력" }),
+          /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", disabled: T !== null, onClick: F, children: "삭제" })
+        ] })
+      ] }) : /* @__PURE__ */ u("div", { className: "pbu-field", children: [
+        /* @__PURE__ */ n(
+          "input",
+          {
+            type: "password",
+            value: x,
+            onChange: (h) => f(h.target.value),
+            placeholder: "Figma 토큰"
+          }
+        ),
+        /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn pbu-btn-primary", disabled: T !== null, onClick: U, children: "저장" })
+      ] }),
+      /* @__PURE__ */ u("div", { className: "pbu-drawer-group", children: [
+        "스킬 목록",
+        /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", disabled: T !== null, onClick: E, children: "업로드" }),
+        /* @__PURE__ */ n(
+          "input",
+          {
+            ref: R,
+            type: "file",
+            accept: ".md",
+            style: { display: "none" },
+            onChange: A
+          }
+        )
+      ] }),
+      H.length === 0 ? /* @__PURE__ */ n("div", { className: "pbu-panel-empty", children: "등록된 스킬이 없어요." }) : H.map((h) => /* @__PURE__ */ u("div", { children: [
+        /* @__PURE__ */ n("div", { className: "pbu-drawer-group", children: h.label }),
+        h.items.map((w) => /* @__PURE__ */ u("div", { className: "pbu-skill-row", children: [
+          /* @__PURE__ */ u("label", { className: "pbu-toggle", children: [
+            /* @__PURE__ */ n(
+              "input",
+              {
+                type: "checkbox",
+                checked: w.enabled,
+                disabled: T !== null,
+                onChange: (d) => k(w.id, d.target.checked)
+              }
+            ),
+            w.name
+          ] }),
+          /* @__PURE__ */ n("span", { className: "pbu-hint", title: w.description, children: w.description }),
+          w.source === "uploaded" && /* @__PURE__ */ n(
+            "button",
+            {
+              type: "button",
+              className: "pbu-icon-btn",
+              disabled: T !== null,
+              onClick: () => m(w.id, w.name),
+              "aria-label": "삭제",
+              children: "🗑"
+            }
+          )
+        ] }, w.id))
+      ] }, h.source))
+    ] }) : /* @__PURE__ */ u("div", { className: "pbu-panel-empty", children: [
+      "컴패니언 서버가 꺼져 있어요",
+      /* @__PURE__ */ u("div", { className: "pbu-drawer-code", children: [
+        /* @__PURE__ */ n("code", { children: "npx pubuilder serve" }),
+        /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: q, children: C ? "복사됨 ✓" : "복사" })
+      ] }),
+      /* @__PURE__ */ n("div", { className: "pbu-hint", children: 'package.json의 dev 스크립트를 "pubuilder dev -- <기존 명령>"으로 감싸면 자동 실행돼요' }),
+      /* @__PURE__ */ n("button", { type: "button", className: "pbu-btn", onClick: P, children: "다시 확인" })
+    ] })
+  ] });
+}
+function Xe({ config: e, enabled: t = !0, serverUrl: o }) {
+  const r = t && !xe(), [a, c] = _(!1), i = y((f) => f.isMapOpen), l = y((f) => f.viewerPath), p = y((f) => f.skillDrawerOpen), s = G(() => ge(e), [e]), x = G(() => new ne(o), [o]);
+  return se(() => {
+    r && window.self === window.top && (ke(), c(!0));
+  }, [r]), !a || !r ? null : de(
+    /* @__PURE__ */ u(Y.Provider, { value: x, children: [
+      /* @__PURE__ */ n(Ce, {}),
+      i && /* @__PURE__ */ n(Se, { ia: s }),
+      l && /* @__PURE__ */ n(Be, { ia: s }),
+      p && /* @__PURE__ */ n(Fe, {})
     ] }),
     document.body
   );
 }
 export {
-  Le as PageMap,
-  Se as defineIA,
-  J as normalizeIA
+  Xe as PageMap,
+  Je as defineIA,
+  ge as normalizeIA
 };
 //# sourceMappingURL=index.js.map