open-grid 1.1.0 → 1.1.1

package/dist/open-grid.js

@@ -1,54 +1,54 @@
-import { b as E } from "./OpenGrid-5flQwc3W.js";
-import { O as L } from "./OpenGrid-5flQwc3W.js";
+import { b as E } from "./OpenGrid-yg4mw6Ge.js";
+import { D as $, I as S, O, S as D, i as k, r as M, s as B } from "./OpenGrid-yg4mw6Ge.js";
 class C {
-  constructor(t, e, r, i = {}) {
+  constructor(t, e, o, i = {}) {
     this._left = t, this._right = e;
-    const o = document.createElement("div");
-    o.className = "og-shuttle", o.style.cssText = `display:flex;gap:6px;align-items:center;justify-content:center;flex-direction:${i.layout === "horizontal" ? "row" : "column"};`;
-    const c = (m, g, u) => {
-      const a = document.createElement("button");
-      return a.type = "button", a.className = "og-shuttle-btn", a.textContent = m, a.title = g, a.style.cssText = "min-width:34px;height:30px;padding:0 8px;border:1px solid #bbb;border-radius:7px;background:#fff;cursor:pointer;font-size:14px;color:#444;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,0.06);", a.addEventListener("mouseover", () => {
-        a.style.background = "#f0f6ff", a.style.borderColor = "#1976d2";
-      }), a.addEventListener("mouseout", () => {
-        a.style.background = "#fff", a.style.borderColor = "#bbb";
-      }), a.addEventListener("click", u), a;
+    const r = document.createElement("div");
+    r.className = "og-shuttle", r.style.cssText = `display:flex;gap:6px;align-items:center;justify-content:center;flex-direction:${i.layout === "horizontal" ? "row" : "column"};`;
+    const a = (m, f, u) => {
+      const c = document.createElement("button");
+      return c.type = "button", c.className = "og-shuttle-btn", c.textContent = m, c.title = f, c.style.cssText = "min-width:34px;height:30px;padding:0 8px;border:1px solid #bbb;border-radius:7px;background:#fff;cursor:pointer;font-size:14px;color:#444;line-height:1;box-shadow:0 1px 2px rgba(0,0,0,0.06);", c.addEventListener("mouseover", () => {
+        c.style.background = "#f0f6ff", c.style.borderColor = "#1976d2";
+      }), c.addEventListener("mouseout", () => {
+        c.style.background = "#fff", c.style.borderColor = "#bbb";
+      }), c.addEventListener("click", u), c;
     }, _ = i.labels ?? {};
-    o.appendChild(c(
+    r.appendChild(a(
       _.toRight ?? "▶",
       "체크한 행을 오른쪽 그리드로 이동",
       () => {
         this._left.moveCheckedTo(this._right);
       }
-    )), o.appendChild(c(
+    )), r.appendChild(a(
       _.toLeft ?? "◀",
       "체크한 행을 왼쪽 그리드로 이동",
       () => {
         this._right.moveCheckedTo(this._left);
       }
-    )), i.includeAll && (o.appendChild(c(
+    )), i.includeAll && (r.appendChild(a(
       _.allRight ?? "⏩",
       "왼쪽 전체를 오른쪽으로 이동",
       () => {
         this._moveAll(this._left, this._right);
       }
-    )), o.appendChild(c(
+    )), r.appendChild(a(
       _.allLeft ?? "⏪",
       "오른쪽 전체를 왼쪽으로 이동",
       () => {
         this._moveAll(this._right, this._left);
       }
-    ))), r.appendChild(o), this._el = o;
+    ))), o.appendChild(r), this._el = r;
   }
   _moveAll(t, e) {
-    const r = t.getData().length;
-    r > 0 && t.moveRowsTo(e, Array.from({ length: r }, (i, o) => o));
+    const o = t.getData().length;
+    o > 0 && t.moveRowsTo(e, Array.from({ length: o }, (i, r) => r));
   }
   destroy() {
     this._el.remove();
   }
 }
-function v(b, t, e, r) {
-  return new C(b, t, e, r);
+function v(A, t, e, o) {
+  return new C(A, t, e, o);
 }
 class N {
   constructor(t, e) {
@@ -65,16 +65,20 @@ class N {
   }
   setData(t) {
     this._data = t;
-    const { idField: e, parentIdField: r, expandOnLoad: i } = this._opts;
-    i && this._expandedKeys.size === 0 && t.forEach((o) => this._expandedKeys.add(o[e])), this._roots = E(t, { idField: e, parentIdField: r }, this._expandedKeys), this._render();
+    const { idField: e, parentIdField: o, expandOnLoad: i } = this._opts;
+    i && this._expandedKeys.size === 0 && t.forEach((r) => this._expandedKeys.add(r[e])), this._roots = E(t, { idField: e, parentIdField: o }, this._expandedKeys), this._render();
   }
   setTheme(t) {
     this._container.setAttribute("data-og-theme", t);
   }
+  /** R12b: FORM(스킨) 축 — data-og-skin 을 자기 컨테이너에 설정(setTheme 과 동형, 색과 직교). */
+  setSkin(t) {
+    this._container.setAttribute("data-og-skin", t);
+  }
   expandAll() {
     const t = (e) => {
-      for (const r of e)
-        this._expandedKeys.add(r._treeId), r.children.length && t(r.children);
+      for (const o of e)
+        this._expandedKeys.add(o._treeId), o.children.length && t(o.children);
     };
     t(this._roots), this._rebuild();
   }
@@ -90,65 +94,65 @@ class N {
   }
   // ── 레이아웃 계산 (post-order: 리프부터 배치, 부모는 자식 중앙) ──
   _calcLayout() {
-    const { nodeWidth: t, nodeHeight: e, levelGap: r, siblingGap: i } = this._opts, o = /* @__PURE__ */ new Map();
-    let c = 0;
+    const { nodeWidth: t, nodeHeight: e, levelGap: o, siblingGap: i } = this._opts, r = /* @__PURE__ */ new Map();
+    let a = 0;
     const _ = (u) => {
-      const a = u._depth * (e + r), p = u._expanded ? u.children : [];
+      const c = u._depth * (e + o), p = u._expanded ? u.children : [];
       if (!p.length) {
-        const f = c;
-        return c += t + i, o.set(u._treeId, { x: f, y: a }), { minX: f, maxX: f };
+        const g = a;
+        return a += t + i, r.set(u._treeId, { x: g, y: c }), { minX: g, maxX: g };
       }
       let n = 1 / 0, l = -1 / 0;
-      for (const f of p) {
-        const { minX: s, maxX: h } = _(f);
+      for (const g of p) {
+        const { minX: s, maxX: h } = _(g);
         s < n && (n = s), h > l && (l = h);
       }
       const d = n + (l - n + t) / 2 - t / 2;
-      return o.set(u._treeId, { x: d, y: a }), { minX: n, maxX: l };
+      return r.set(u._treeId, { x: d, y: c }), { minX: n, maxX: l };
     };
     for (const u of this._roots) _(u);
-    let m = 0, g = 0;
-    for (const { x: u, y: a } of o.values())
-      u + t > m && (m = u + t), a + e > g && (g = a + e);
-    return { layout: o, totalW: m + i, totalH: g + r + 16 };
+    let m = 0, f = 0;
+    for (const { x: u, y: c } of r.values())
+      u + t > m && (m = u + t), c + e > f && (f = c + e);
+    return { layout: r, totalW: m + i, totalH: f + o + 16 };
   }
   // ── SVG 직선 헬퍼 ──
-  _line(t, e, r, i, o) {
-    const c = document.createElementNS("http://www.w3.org/2000/svg", "line");
-    c.setAttribute("x1", String(e)), c.setAttribute("y1", String(r)), c.setAttribute("x2", String(i)), c.setAttribute("y2", String(o)), c.setAttribute("class", "og-orgchart-line"), t.appendChild(c);
+  _line(t, e, o, i, r) {
+    const a = document.createElementNS("http://www.w3.org/2000/svg", "line");
+    a.setAttribute("x1", String(e)), a.setAttribute("y1", String(o)), a.setAttribute("x2", String(i)), a.setAttribute("y2", String(r)), a.setAttribute("class", "og-orgchart-line"), t.appendChild(a);
   }
   // ── 렌더 ──
   _render() {
-    const { nodeWidth: t, nodeHeight: e, levelGap: r, columns: i } = this._opts, { layout: o, totalW: c, totalH: _ } = this._calcLayout();
+    const { nodeWidth: t, nodeHeight: e, levelGap: o, columns: i } = this._opts, { layout: r, totalW: a, totalH: _ } = this._calcLayout();
     this._container.innerHTML = "";
     const m = document.createElement("div");
-    m.className = "og-orgchart-wrap", m.style.cssText = `width:${c}px;height:${_}px;`;
-    const g = document.createElementNS("http://www.w3.org/2000/svg", "svg");
-    g.setAttribute("width", String(c)), g.setAttribute("height", String(_)), g.style.cssText = "position:absolute;top:0;left:0;pointer-events:none;overflow:visible;";
+    m.className = "og-orgchart-wrap", m.style.cssText = `width:${a}px;height:${_}px;`;
+    const f = document.createElementNS("http://www.w3.org/2000/svg", "svg");
+    f.setAttribute("width", String(a)), f.setAttribute("height", String(_)), f.style.cssText = "position:absolute;top:0;left:0;pointer-events:none;overflow:visible;";
     const u = (p) => {
       for (const n of p) {
         if (!n._expanded || !n.children.length) continue;
-        const l = o.get(n._treeId), d = l.x + t / 2, f = l.y + e, s = f + r / 2, h = n.children;
-        if (this._line(g, d, f, d, s), h.length > 1) {
-          const x = o.get(h[0]._treeId), y = o.get(h[h.length - 1]._treeId);
-          this._line(g, x.x + t / 2, s, y.x + t / 2, s);
+        const l = r.get(n._treeId), d = l.x + t / 2, g = l.y + e, s = g + o / 2, h = n.children;
+        if (this._line(f, d, g, d, s), h.length > 1) {
+          const x = r.get(h[0]._treeId), y = r.get(h[h.length - 1]._treeId);
+          this._line(f, x.x + t / 2, s, y.x + t / 2, s);
         }
         for (const x of h) {
-          const y = o.get(x._treeId), A = y.x + t / 2;
-          this._line(g, A, s, A, y.y);
+          const y = r.get(x._treeId), b = y.x + t / 2;
+          this._line(f, b, s, b, y.y);
         }
         u(h);
       }
     };
-    u(this._roots), m.appendChild(g);
-    const a = (p) => {
+    u(this._roots), m.appendChild(f);
+    const c = (p) => {
       for (const n of p) {
-        const l = o.get(n._treeId);
+        const l = r.get(n._treeId);
         if (!l) continue;
         const d = document.createElement("div");
         d.className = "og-orgchart-node", n._hasChildren && d.classList.add("og-orgchart-node--branch"), n._expanded && d.classList.add("og-orgchart-node--expanded"), this._selectedId === n._treeId && d.classList.add("og-orgchart-node--selected"), d.style.cssText = `left:${l.x}px;top:${l.y}px;width:${t}px;height:${e}px;`;
-        const f = document.createElement("div");
-        f.className = "og-orgchart-node-content";
+        const g = document.createElement("div");
+        g.className = "og-orgchart-node-content";
         for (const s of i) {
           const h = n.data[s.field], x = document.createElement("div");
           if (x.className = "og-orgchart-col" + (s.className ? " " + s.className : ""), s.style) {
@@ -160,9 +164,9 @@ class N {
             typeof y == "string" ? x.innerHTML = y : x.appendChild(y);
           } else
             x.textContent = h ?? "";
-          f.appendChild(x);
+          g.appendChild(x);
         }
-        if (d.appendChild(f), n._hasChildren) {
+        if (d.appendChild(g), n._hasChildren) {
           const s = document.createElement("button");
           s.type = "button", s.className = "og-orgchart-toggle", s.setAttribute("aria-expanded", n._expanded ? "true" : "false"), s.setAttribute("aria-label", n._expanded ? "접기" : "펼치기");
           const h = document.createElement("i");
@@ -172,13 +176,13 @@ class N {
         }
         d.addEventListener("click", () => {
           this._selectedId = n._treeId, this._opts.onNodeClick(n._treeId, n.data), this._container.querySelectorAll(".og-orgchart-node--selected").forEach((s) => s.classList.remove("og-orgchart-node--selected")), d.classList.add("og-orgchart-node--selected");
-        }), m.appendChild(d), n._expanded && n.children.length && a(n.children);
+        }), m.appendChild(d), n._expanded && n.children.length && c(n.children);
       }
     };
-    a(this._roots), this._container.appendChild(m);
+    c(this._roots), this._container.appendChild(m);
   }
 }
-class w {
+class I {
   // ── 1. XML → 데이터 배열 ────────────────────────────────────
   /**
    * XML 문자열을 파싱하여 그리드 데이터 배열로 변환.
@@ -188,28 +192,28 @@ class w {
    */
   static parse(t, e = {}) {
     var p, n;
-    const { fieldMap: r = {}, trim: i = !0 } = e, c = new DOMParser().parseFromString(t.trim(), "text/xml"), _ = c.querySelector("parsererror");
+    const { fieldMap: o = {}, trim: i = !0 } = e, a = new DOMParser().parseFromString(t.trim(), "text/xml"), _ = a.querySelector("parsererror");
     if (_) throw new Error(`XML 파싱 오류: ${(p = _.textContent) == null ? void 0 : p.trim()}`);
-    const m = c.documentElement;
-    let g = e.rowTag;
-    if (!g) {
-      const l = e.rootTag ? c.querySelector(e.rootTag) : m;
-      g = ((n = l == null ? void 0 : l.children[0]) == null ? void 0 : n.tagName) ?? "row";
+    const m = a.documentElement;
+    let f = e.rowTag;
+    if (!f) {
+      const l = e.rootTag ? a.querySelector(e.rootTag) : m;
+      f = ((n = l == null ? void 0 : l.children[0]) == null ? void 0 : n.tagName) ?? "row";
     }
-    const u = c.getElementsByTagName(g), a = [];
+    const u = a.getElementsByTagName(f), c = [];
     for (let l = 0; l < u.length; l++) {
-      const d = u[l], f = {};
+      const d = u[l], g = {};
       for (const s of Array.from(d.attributes)) {
-        const h = r[s.name] ?? s.name;
-        f[h] = i ? s.value.trim() : s.value;
+        const h = o[s.name] ?? s.name;
+        g[h] = i ? s.value.trim() : s.value;
       }
       for (const s of Array.from(d.children)) {
-        const h = r[s.tagName] ?? s.tagName, x = s.textContent ?? "";
-        f[h] = i ? x.trim() : x;
+        const h = o[s.tagName] ?? s.tagName, x = s.textContent ?? "";
+        g[h] = i ? x.trim() : x;
       }
-      a.push(f);
+      c.push(g);
     }
-    return a;
+    return c;
   }
   // ── 2. 데이터 배열 → XML ─────────────────────────────────────
   /**
@@ -217,34 +221,34 @@ class w {
    */
   static stringify(t, e = {}) {
     const {
-      rootTag: r = "rows",
+      rootTag: o = "rows",
       rowTag: i = "row",
-      mode: o = "element",
-      fieldMap: c = {},
+      mode: r = "element",
+      fieldMap: a = {},
       declaration: _ = !0,
       indent: m = 2,
-      nullAs: g = "",
+      nullAs: f = "",
       excludeFields: u = []
-    } = e, a = " ".repeat(m), p = [];
-    _ && p.push('<?xml version="1.0" encoding="UTF-8"?>'), p.push(`<${r}>`);
+    } = e, c = " ".repeat(m), p = [];
+    _ && p.push('<?xml version="1.0" encoding="UTF-8"?>'), p.push(`<${o}>`);
     for (const n of t) {
       const l = Object.entries(n).filter(([d]) => !u.includes(d));
-      if (o === "attribute") {
-        const d = l.map(([f, s]) => {
-          const h = c[f] ?? f, x = s == null ? g : String(s);
+      if (r === "attribute") {
+        const d = l.map(([g, s]) => {
+          const h = a[g] ?? g, x = s == null ? f : String(s);
           return `${h}="${this._escAttr(x)}"`;
         }).join(" ");
-        p.push(`${a}<${i}${d ? " " + d : ""} />`);
+        p.push(`${c}<${i}${d ? " " + d : ""} />`);
       } else {
-        p.push(`${a}<${i}>`);
-        for (const [d, f] of l) {
-          const s = c[d] ?? d, h = f == null ? g : String(f);
-          p.push(`${a}${a}<${s}>${this._escText(h)}</${s}>`);
+        p.push(`${c}<${i}>`);
+        for (const [d, g] of l) {
+          const s = a[d] ?? d, h = g == null ? f : String(g);
+          p.push(`${c}${c}<${s}>${this._escText(h)}</${s}>`);
         }
-        p.push(`${a}</${i}>`);
+        p.push(`${c}</${i}>`);
       }
     }
-    return p.push(`</${r}>`), p.join(`
+    return p.push(`</${o}>`), p.join(`
 `);
   }
   // ── 3. SAP BAPI XML 응답 파싱 ────────────────────────────────
@@ -257,38 +261,38 @@ class w {
    *   <RETURN><TYPE>S</TYPE><MESSAGE>...</MESSAGE></RETURN>
    */
   static parseSap(t) {
-    var m, g, u, a;
-    const r = new DOMParser().parseFromString(t.trim(), "text/xml"), i = { header: {}, items: [], returns: [], raw: r }, o = r.getElementsByTagName("DOCUMENTHEADER")[0];
-    if (o)
-      for (const p of Array.from(o.children))
+    var m, f, u, c;
+    const o = new DOMParser().parseFromString(t.trim(), "text/xml"), i = { header: {}, items: [], returns: [], raw: o }, r = o.getElementsByTagName("DOCUMENTHEADER")[0];
+    if (r)
+      for (const p of Array.from(r.children))
         i.header[p.tagName] = ((m = p.textContent) == null ? void 0 : m.trim()) ?? "";
-    const c = r.getElementsByTagName("RETURN");
-    for (const p of Array.from(c)) {
+    const a = o.getElementsByTagName("RETURN");
+    for (const p of Array.from(a)) {
       const n = {};
       for (const l of Array.from(p.children))
-        n[l.tagName] = ((g = l.textContent) == null ? void 0 : g.trim()) ?? "";
+        n[l.tagName] = ((f = l.textContent) == null ? void 0 : f.trim()) ?? "";
       i.returns.push(n);
     }
     const _ = ["ACCOUNTGL", "ACCOUNTRECEIVABLE", "ACCOUNTPAYABLE", "ITEMS"];
     for (const p of _) {
-      const n = r.getElementsByTagName(p)[0];
+      const n = o.getElementsByTagName(p)[0];
       if (!n) continue;
       const l = n.getElementsByTagName("ITEM"), d = l.length > 0 ? Array.from(l) : [n];
-      for (const f of d) {
+      for (const g of d) {
         const s = {};
-        for (const h of Array.from(f.children))
+        for (const h of Array.from(g.children))
           s[h.tagName] = ((u = h.textContent) == null ? void 0 : u.trim()) ?? "";
         i.items.push(s);
       }
       break;
     }
     if (i.items.length === 0) {
-      const p = r.documentElement, n = Array.from(p.children).filter((l) => l.hasAttribute("SEGMENT"));
+      const p = o.documentElement, n = Array.from(p.children).filter((l) => l.hasAttribute("SEGMENT"));
       for (const l of n) {
         if (l.tagName === "EDI_DC40") continue;
         const d = {};
-        for (const f of Array.from(l.children))
-          d[f.tagName] = ((a = f.textContent) == null ? void 0 : a.trim()) ?? "";
+        for (const g of Array.from(l.children))
+          d[g.tagName] = ((c = g.textContent) == null ? void 0 : c.trim()) ?? "";
         Object.keys(d).length > 0 && i.items.push(d);
       }
     }
@@ -306,22 +310,22 @@ class w {
     ];
     if (t.BAPI_FUNCTION && e.push(`  <FUNCTION>${this._escText(t.BAPI_FUNCTION)}</FUNCTION>`), t.DOCUMENTHEADER && typeof t.DOCUMENTHEADER == "object") {
       e.push("  <DOCUMENTHEADER>");
-      for (const [i, o] of Object.entries(t.DOCUMENTHEADER))
-        o != null && o !== "" && e.push(`    <${i}>${this._escText(String(o))}</${i}>`);
+      for (const [i, r] of Object.entries(t.DOCUMENTHEADER))
+        r != null && r !== "" && e.push(`    <${i}>${this._escText(String(r))}</${i}>`);
       e.push("  </DOCUMENTHEADER>");
     }
-    const r = Object.keys(t).find(
+    const o = Object.keys(t).find(
       (i) => Array.isArray(t[i]) && !i.startsWith("_")
     );
-    if (r) {
-      e.push(`  <${r}>`);
-      for (const i of t[r]) {
+    if (o) {
+      e.push(`  <${o}>`);
+      for (const i of t[o]) {
         e.push("    <ITEM>");
-        for (const [o, c] of Object.entries(i))
-          c != null && c !== "" && !o.startsWith("_") && e.push(`      <${o}>${this._escText(String(c))}</${o}>`);
+        for (const [r, a] of Object.entries(i))
+          a != null && a !== "" && !r.startsWith("_") && e.push(`      <${r}>${this._escText(String(a))}</${r}>`);
         e.push("    </ITEM>");
       }
-      e.push(`  </${r}>`);
+      e.push(`  </${o}>`);
     }
     return e.push("</BAPI_CALL>"), e.join(`
 `);
@@ -336,12 +340,12 @@ class w {
       '<?xml version="1.0" encoding="UTF-8"?>',
       `<BAPI_BATCH total="${t.documents.length}">`
     ];
-    return t.documents.forEach((r, i) => {
+    return t.documents.forEach((o, i) => {
       e.push(`  <BAPI_CALL seq="${i + 1}">`);
-      const o = this.stringifySap(r).split(`
-`).filter((c) => !c.startsWith("<?xml")).map((c) => "    " + c).join(`
+      const r = this.stringifySap(o).split(`
+`).filter((a) => !a.startsWith("<?xml")).map((a) => "    " + a).join(`
 `);
-      e.push(o), e.push("  </BAPI_CALL>");
+      e.push(r), e.push("  </BAPI_CALL>");
     }), e.push("</BAPI_BATCH>"), e.join(`
 `);
   }
@@ -354,10 +358,16 @@ class w {
   }
 }
 export {
+  $ as DEFAULT_ICON_ROLES,
   C as GridShuttle,
-  L as OpenGrid,
+  S as IconRegistry,
+  O as OpenGrid,
   N as OrgChart,
-  w as XmlConverter,
-  v as createGridShuttle
+  D as SkinRegistry,
+  I as XmlConverter,
+  v as createGridShuttle,
+  k as iconRegistry,
+  M as renderIcon,
+  B as skinRegistry
 };
 //# sourceMappingURL=open-grid.js.map

package/dist/types/core/AppearanceResolver.d.ts

@@ -0,0 +1,100 @@
+/**
+ * ThemeContext — DOM-free 값 객체. 활성 색 테마(및 미래의 스킨) 식별자를 운반한다.
+ * R12a 에서 resolver 메서드는 아직 이 컨텍스트로 분기하지 않는다(반환은 항상 `var()` 문자열이라
+ * 브라우저가 런타임에 테마별로 재계산 → 오늘의 zero-rerender 테마 전환을 보존, 현상맵 §1.3).
+ * R12b(스킨)에서 `skin` 을 읽어 FORM 토큰을 해결하는 자리를 여기 마련해 둔다.
+ */
+export declare class ThemeContext {
+    readonly theme: string;
+    readonly skin: string;
+    constructor(theme?: string, skin?: string);
+}
+/**
+ * propagateAppearance — 분리(portal-ed) UI 로 외관 축을 함께 복사(item3 §4.3, HANMS Q8).
+ * 두 속성(`data-og-theme` COLOR · `data-og-skin` FORM)을 **한 번에** 복사해, 컴포넌트마다
+ * 두 번째 속성을 잊어 스킨만 안 먹는 조용한 사고(§6-9)를 구조적으로 막는다.
+ * `fromEl` 에서 가장 가까운 속성 보유 조상을 찾아 `toEl` 에 복사한다.
+ */
+export declare function propagateAppearance(fromEl: Element | null, toEl: Element): void;
+/** border()/focusRing() 형태 옵션(미래 스킨용). 미지정 시 오늘의 기본값 = byte-identical. */
+export interface BorderOptions {
+    /** 보더 스타일 키워드(기본 'solid'). */
+    style?: string;
+    /** true 면 상태(added/edited/removed·selection·range) 보더 — HANMS G-ST2: 항상 solid 강제. */
+    state?: boolean;
+}
+export interface FocusRingOptions {
+    width?: number;
+    style?: string;
+    color?: string;
+}
+export type ElevationLevel = 'sm' | 'md' | 'lg';
+/**
+ * AppearanceResolver — 렌더 레이어가 "형태 값"을 물어보는 단일 지점.
+ * R12a 는 **결정을 객체화**할 뿐 값은 오늘과 동일하다(회귀 0). 상태 없음(순수) — 반환은
+ * `var()` 기반 문자열 또는 px 패스스루라, 인스턴스 공유가 안전하다(멀티그리드 격리 무해).
+ */
+export declare class AppearanceResolver {
+    private _ctx;
+    constructor(_ctx?: ThemeContext);
+    /** 활성 테마/스킨 컨텍스트(R12b 스킨 해결의 진입점). */
+    get context(): ThemeContext;
+    /** 스킨이 활성(비-default)인가. default 면 오늘의 리터럴을 그대로 반환(byte-identical). */
+    private _skinActive;
+    /**
+     * R12b: 스킨 컨텍스트 교체(테마는 유지). 파사드 setSkin 이 호출한 뒤 재렌더하면 인라인 form 사이트가
+     * 이 컨텍스트로 재해석된다. default → named 전환 시 border/divider 가 리터럴 → var() 로 승격.
+     */
+    setSkin(skin: string): void;
+    /** border-color 토큰 참조(폴백 포함) — 렌더 코드가 오늘 쓰는 문자열과 동일. */
+    private _borderColorVar;
+    /**
+     * 셀/헤더 가장자리 보더. 오늘의 리터럴 `1px solid var(--og-border-color,#e0e0e0)` 과
+     * **문자 단위 동일**. HANMS G-ST2: state 보더는 스타일을 solid 로 강제(현재 호출은 state 미지정 → no-op).
+     */
+    border(opts?: BorderOptions): string;
+    /**
+     * 행/섹션 구획선(가로 separator). 오늘은 border() 와 동일 문자열(=`1px solid var(--og-border-color,#e0e0e0)`).
+     * 별도 메서드로 둔 이유: R12b 스킨에서 divider-style 이 border-style 과 갈라질 수 있어(§1.2)
+     * 결정 지점을 미리 분리해 둔다. 현재 출력은 border() 와 byte-identical.
+     */
+    divider(): string;
+    /**
+     * G-ST1(코어 불변식, HANMS §2): 텍스처 존 제한. 텍스처는 컨테이너 배경·헤더 여백·빈 상태·온보딩
+     * 오버레이에만 렌더되고, **데이터/상태/범위/병합/포커스 셀 배경 뒤에는 절대 렌더 금지**(스킨이 끌 수 없음).
+     * 렌더 레이어가 셀 배경 텍스처를 바를 때 이 메서드로 zone 을 물어본다.
+     *   - 금지 zone → 항상 `'none'`(스킨과 무관).
+     *   - 허용 zone → `var(--og-texture-bg, none)`(스킨 미설정 시 none = byte-identical).
+     */
+    texture(zone: 'container' | 'header-pad' | 'empty' | 'onboarding' | 'data' | 'status' | 'range' | 'merge' | 'focus'): string;
+    /**
+     * 반경 값 → CSS 길이 문자열. R12a 는 패스스루(`${px}px`)로 오늘의 리터럴을 그대로 보존한다.
+     * 반경 리터럴이 흩어져 있던 결정 지점(이미지/프로그레스/스위치/뱃지/마스킹/상태뱃지)을 이 한 곳으로 모은다.
+     * R12b 에서 `--og-radius-*` 스케일 토큰으로 승격할 착지점.
+     */
+    radius(px: number): string;
+    /**
+     * 데이터/그룹 셀의 인라인 패딩. 오늘의 그룹 셀 리터럴 `2px 8px` 과 동일.
+     * R12b `--og-cell-padding-*` 승격 자리.
+     */
+    cellPadding(): string;
+    /**
+     * 엘리베이션(box-shadow) — R12b 스킨 축의 형태/잉크 분리 seam(§1.4)을 미리 표기한다.
+     * R12a 에서는 어떤 인라인 사이트도 이 메서드를 경유하지 않는다(현재 그림자 결정이 인라인에 없음).
+     * 값은 미래 토큰 + 오늘과 무해한 기본 geometry/alpha 로, 라우팅 0 이라 출력에 영향 없음.
+     */
+    elevation(level?: ElevationLevel): string;
+    /**
+     * 포커스 링. HANMS 하드 계약(불변식): 가시 포커스는 비협상 —
+     * `width < 2px` 또는 `style: 'none'` 은 최소 `2px solid` 로 **클램프**한다(스킨이 끌 수 없음).
+     * R12a 에서 라우팅되는 인라인 포커스 사이트는 없다(포커스 표시는 CSS 클래스 `.og-cell-focused`).
+     * 기본 반환은 현 프라이머리 색 기반의 AA-safe 링 — 미래 스킨/오버라이드가 이 초크포인트를 경유한다.
+     */
+    focusRing(opts?: FocusRingOptions): string;
+}
+/**
+ * 프로세스 공유 기본 resolver. CellRenderer(팩토리로 생성돼 per-instance 컨텍스트를 받지 않음)가
+ * 반경 결정을 이 초크포인트로 보낼 때 사용한다. R12a 반환은 상태 없는 순수값이라 공유가 안전하다.
+ * per-instance(테마 컨텍스트) 주입은 R12b 스킨에서 확장한다.
+ */
+export declare const defaultAppearance: AppearanceResolver;

package/dist/types/core/CrossGridController.d.ts

@@ -0,0 +1,70 @@
+import { DataLayer } from './DataLayer.js';
+import { ColumnLayout } from './ColumnLayout.js';
+import { GridOptions, OpenGridInstance, Position, GridDropEvent } from './types.js';
+/**
+ * R7(§3.1 C8, §6-R7): 그리드 간 이동·매핑·drop 표면(`moveRowsTo`/`moveCheckedTo`/크로스변환 해석/
+ * 3단계 드롭 이벤트 발화)을 `OpenGrid` God object 에서 **동작 불변**으로 옮긴 것. `OpenGrid` 는
+ * 얇은 위임 공개 메서드만 남긴다(공개 API 불변 — R0 `public_api_surface.txt` 동결).
+ *
+ * 스트랭글러 원칙(A2): `crossGridRegistry`(프로세스 스코프 싱글턴, `CrossGridRegistry.ts`)는 지금은
+ * **AS-IS 유지**한다 — 주입 `GridRegistry` 로의 승격(C8, R-6c)은 R8 컴포지션 루트로 이연한다.
+ *
+ * cross-grid 이동은 **두 그리드**(source=this, target)를 동시에 다룬다. 각 `OpenGrid` 는 자신의
+ * CrossGridController 를 소유하므로, target 측 연산(insert/rowCount/컬럼/3단계 발화)은
+ * `getPeerController(target)` 로 얻은 상대 컨트롤러의 동명 메서드로 수행한다 — `this`(source) 와
+ * peer(target) 로 갈라 원본의 `this._x` / `targetGrid._x` 접근을 1:1 재현한다(회귀 0).
+ * **3단계 drop emit 순서(before→후 이동→after→complete, 각 source→target)는 정확히 보존한다.**
+ */
+export interface CrossGridControllerDeps<T extends Record<string, any> = any> {
+    /** GridDropEvent 의 sourceGrid/targetGrid 식별자 + 자기동일성 비교에 쓰는 소유 그리드. */
+    getSelf: () => OpenGridInstance<T>;
+    getData: () => DataLayer<T>;
+    getColLayout: () => ColumnLayout<T>;
+    getOptions: () => Required<GridOptions<T>>;
+    /** EventEmitter fan(this.emit) — 'gridDropBefore/After/Complete'/'gridDropMapping'. */
+    emit: (event: string, payload?: any) => void;
+    /** 공개 insertRow 위임(MutationService 경유) — target 삽입에 쓰인다. */
+    insertRow: (item: Partial<T>, position?: Position) => void;
+    /** 공개 deleteRow 위임(MutationService 경유) — source 제거에 쓰인다. */
+    deleteRow: (rowIndex: number | number[]) => void;
+    /** rowMgr.getChecked() — moveCheckedTo. */
+    getChecked: () => Array<{
+        rowIndex: number;
+    }>;
+    /** rowMgr.uncheckAll()(+재렌더) 공개 위임 — moveCheckedTo. */
+    uncheckAll: () => void;
+    /** 드래그 선택 집합 해석(_dragRowSet). OpenGrid 가 소유(RowDragDrop 배선과 공유). */
+    dragRowSet: (fromIndex: number) => number[];
+    /** 상대 그리드의 CrossGridController 획득(피어 연산 위임). 비 OpenGrid 대상은 undefined. */
+    getPeerController: (grid: OpenGridInstance<T>) => CrossGridController<T> | undefined;
+}
+export declare class CrossGridController<T extends Record<string, any> = any> {
+    private _deps;
+    constructor(deps: CrossGridControllerDeps<T>);
+    /** 이 그리드의 소유 인스턴스(GridDropEvent 식별자). */
+    getSelf(): OpenGridInstance<T>;
+    private _rowCount;
+    private _insertRow;
+    private _visibleLeafInfos;
+    /** 드래그 드롭 어댑터 → 공개 moveRowsTo 로 위임 */
+    handleCrossGridDrop(fromIndex: number, targetBodyEl: HTMLElement, targetIndex: number): void;
+    /**
+     * 이 그리드의 행들을 다른 그리드로 이동(move)한다. 드래그·화살표 셔틀 공통 경로.
+     * 3단계 이벤트(before→after→complete)와 crossGridMapping(필드 매핑)을 적용한다.
+     * @param target  대상 그리드
+     * @param sourceIndexes 이동할 (표시)행 인덱스들
+     * @param targetIndex 대상에서 삽입 위치 (생략 시 맨 끝에 추가)
+     * @returns 이동 성공 true, 취소/무효 false
+     */
+    moveRowsTo(target: OpenGridInstance<T>, sourceIndexes: number[], targetIndex?: number): Promise<boolean>;
+    /** 체크된 행을 다른 그리드로 이동 (화살표 셔틀용). 체크 없으면 무시. */
+    moveCheckedTo(target: OpenGridInstance<T>): Promise<boolean>;
+    /**
+     * 크로스그리드 이동의 행 변환 함수를 결정한다.
+     * 반환: null=변환 불필요(그대로) / 함수=변환 적용 / false=매핑 모달 취소(이동 중단)
+     */
+    private _resolveCrossTransform;
+    fireGridDropBefore(e: GridDropEvent<T>): boolean | void;
+    fireGridDropAfter(e: GridDropEvent<T>): void;
+    fireGridDropComplete(e: GridDropEvent<T>): void;
+}