json-renderers 1.18.4 → 1.18.7

package/docs/dist/min.js

@@ -1,240 +1,240 @@
-const et = {
+const ct = {
   version: "v18.0.0",
   description: "build table from store data and render to DOM uses json-to-spec, json-to-dom under the hood"
-}, rt = (t) => {
-  const e = t;
-  typeof globalThis > "u" || !e || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks.jsonRenderers = {
-    meta: et,
-    render: e
+}, ut = (t) => {
+  const a = t;
+  typeof globalThis > "u" || !a || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks.jsonRenderers = {
+    meta: ct,
+    render: a
   });
-}, st = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, dt = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.type;
-  if (r === void 0)
+  const e = a.type;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "type"');
-  if (typeof r != "string")
+  if (typeof e != "string")
     throw new TypeError("type must be a string");
   return !0;
-}, nt = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, bt = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.data;
-  if (r === void 0)
+  const e = a.data;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "data"');
-  if (!Array.isArray(r))
+  if (!Array.isArray(e))
     throw new TypeError("data must be an Array");
   return !0;
-}, ot = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, pt = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.columns;
-  if (r === void 0)
+  const e = a.columns;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "columns"');
-  if (!Array.isArray(r))
+  if (!Array.isArray(e))
     throw new TypeError("columns must be an Array");
   return !0;
-}, at = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, mt = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.showLog;
-  if (r !== void 0 && typeof r != "boolean")
+  const e = a.showLog;
+  if (e !== void 0 && typeof e != "boolean")
     throw new TypeError("showLog must be a boolean");
   return !0;
-}, I = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object" || Array.isArray(e))
+}, T = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object" || Array.isArray(a))
     throw new TypeError("Config must be an object");
-  return st(e), nt(e), ot(e), at(e), !0;
-}, lt = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+  return dt(a), bt(a), pt(a), mt(a), !0;
+}, ft = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.targetHtmlId;
-  if (r === void 0)
+  const e = a.targetHtmlId;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "targetHtmlId"');
-  if (typeof r != "string")
+  if (typeof e != "string")
     throw new TypeError("targetHtmlId must be a string");
-  if (r.trim().length === 0)
+  if (e.trim().length === 0)
     throw new Error("targetHtmlId must be a non-empty string");
   return !0;
-}, it = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, ht = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.appendPosition;
-  if (r === void 0)
+  const e = a.appendPosition;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "appendPosition"');
-  if (typeof r != "string")
+  if (typeof e != "string")
     throw new TypeError("appendPosition must be a string");
   return !0;
-}, ct = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object")
+}, yt = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object")
     throw new TypeError("Config must be an object");
-  const r = e.classToApply;
-  if (r === void 0)
+  const e = a.classToApply;
+  if (e === void 0)
     throw new Error('Missing compulsory key: "classToApply"');
-  if (typeof r != "string")
+  if (typeof e != "string")
     throw new TypeError("classToApply must be a string");
   return !0;
-}, K = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object" || Array.isArray(e))
-    throw new TypeError("Config must be an object");
-  return lt(e), it(e), ct(e), !0;
-}, ut = "table", dt = "", bt = [], pt = [], ft = "", ht = "replace", yt = !1, w = {
-  type: ut,
-  targetHtmlId: dt,
-  data: bt,
-  columns: pt,
-  classToApply: ft,
-  appendPosition: ht,
-  showLog: yt
 }, z = (t) => {
-  const e = typeof t == "object" && t !== null ? t.inKey ?? t.key : t;
-  return e && e in w ? w[e] : { ...w };
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object" || Array.isArray(a))
+    throw new TypeError("Config must be an object");
+  return ft(a), ht(a), yt(a), !0;
+}, Ct = "table", $t = "", gt = [], wt = [], Nt = "", xt = "replace", Tt = !1, $ = {
+  type: Ct,
+  targetHtmlId: $t,
+  data: gt,
+  columns: wt,
+  classToApply: Nt,
+  appendPosition: xt,
+  showLog: Tt
+}, G = (t) => {
+  const a = typeof t == "object" && t !== null ? t.inKey ?? t.key : t;
+  return a && a in $ ? $[a] : { ...$ };
 };
-Object.assign(z, w);
-const T = (t) => {
-  const e = (t == null ? void 0 : t.inConfig) ?? t;
-  if (!e || typeof e != "object" || Array.isArray(e))
+Object.assign(G, $);
+const g = (t) => {
+  const a = (t == null ? void 0 : t.inConfig) ?? t;
+  if (!a || typeof a != "object" || Array.isArray(a))
     throw new TypeError("Config must be an object");
-  return I(e), K(e), !0;
+  return T(a), z(a), !0;
 };
-T.getSpec = z;
-T.configSpec = w;
-T.guardSpec = I;
-T.guardMount = K;
-const mt = {
+g.getSpec = G;
+g.configSpec = $;
+g.guardSpec = T;
+g.guardMount = z;
+const At = {
   version: "1.22.0",
   name: "json-renderers-build"
-}, wt = (t) => {
+}, kt = (t) => {
   t && (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks.jsonRenderersBuild = {
-    meta: mt,
+    meta: At,
     render: t
   });
-}, gt = (t) => typeof t == "object" && t !== null && !Array.isArray(t), Tt = (t, e) => {
-  if (!gt(t)) return;
-  let r = {};
-  for (const [s, a] of Object.entries(t))
-    r[s] = C(e, a);
-  return r;
-}, Ct = (t, e) => {
-  const r = structuredClone(t);
-  return Array.isArray(r) ? r.map((a) => C(e, a)) : void 0;
-}, W = (t, e, r) => {
-  if (t === "${agg:count}" && "rowData" in e) {
-    if (Array.isArray(e == null ? void 0 : e.rowData))
-      return e == null ? void 0 : e.rowData.length;
+}, It = (t) => typeof t == "object" && t !== null && !Array.isArray(t), Ft = (t, a) => {
+  if (!It(t)) return;
+  let e = {};
+  for (const [o, n] of Object.entries(t))
+    e[o] = h(a, n);
+  return e;
+}, Pt = (t, a) => {
+  const e = structuredClone(t);
+  return Array.isArray(e) ? e.map((n) => h(a, n)) : void 0;
+}, M = (t, a, e) => {
+  if (t === "${agg:count}" && "rowData" in a) {
+    if (Array.isArray(a == null ? void 0 : a.rowData))
+      return a == null ? void 0 : a.rowData.length;
   } else
-    return t === "${rowValue}" && "rowData" in e ? e == null ? void 0 : e.rowData : t.replace(/\$\{(\w+)\}/g, (s, a) => e[a] !== void 0 ? e[a] : s);
-}, At = (t, e) => W(t, e), xt = (t, e, r) => {
-  if (e == null)
+    return t === "${rowValue}" && "rowData" in a ? a == null ? void 0 : a.rowData : t.replace(/\$\{(\w+)\}/g, (o, n) => a[n] !== void 0 ? a[n] : o);
+}, jt = (t, a) => M(t, a), Bt = (t, a, e) => {
+  if (e && console.log("inElement : ", t), e && console.log("inTemplate : ", a), a == null)
     throw new TypeError("inTemplate is required");
-  if (typeof e != "object" && typeof e != "string")
+  if (typeof a != "object" && typeof a != "string")
     throw new TypeError("inTemplate must be an object or string");
   if (!t || typeof t != "object" || Array.isArray(t))
     throw new TypeError("inElement must be an object");
   return !0;
-}, C = (t, e, r) => {
-  const s = t, a = e;
-  xt(s, a);
-  const n = structuredClone(a);
-  return typeof n == "string" ? W(n, s) : (n === null || typeof n != "object" || ("textContent" in n && (n.textContent = At(n == null ? void 0 : n.textContent, s)), "attributes" in n && (n.attributes = Tt(n == null ? void 0 : n.attributes, s)), "children" in n && (n.children = Ct(n == null ? void 0 : n.children, s))), n);
-}, Nt = (t, e) => {
+}, vt = {
+  name: "json-transformer-funcs-primitive",
+  version: "1.9.0"
+}, St = (t) => {
+  var a, e;
+  typeof globalThis > "u" || !t || (globalThis.ks ?? (globalThis.ks = {}), (a = globalThis.ks).applyTemplate ?? (a.applyTemplate = t), (e = globalThis.ks).transformerFuncs ?? (e.transformerFuncs = {}), globalThis.ks.transformerFuncs.primitive = {
+    meta: vt,
+    applyTemplate: t
+  });
+}, h = (t, a, e) => {
+  const o = t, n = a;
+  Bt(o, n, e);
+  const r = structuredClone(n);
+  return typeof r == "string" ? M(r, o) : (r === null || typeof r != "object" || ("textContent" in r && (r.textContent = jt(r == null ? void 0 : r.textContent, o)), "attributes" in r && (r.attributes = Ft(r == null ? void 0 : r.attributes, o)), "children" in r && (r.children = Pt(r == null ? void 0 : r.children, o))), r);
+};
+St(h);
+const Rt = (t, a) => {
   if (!Array.isArray(t))
     throw new TypeError("inSource must be an Array");
   if (t.length === 0)
     throw new Error("inSource cannot be empty");
-  for (let r = 0; r < t.length; r++)
-    if (!t[r] || typeof t[r] != "object")
-      throw new TypeError(`inSource[${r}] must be an object`);
-  if (!e || typeof e != "object" && typeof e != "string")
+  for (let e = 0; e < t.length; e++)
+    if (!t[e] || typeof t[e] != "object")
+      throw new TypeError(`inSource[${e}] must be an object`);
+  if (!a || typeof a != "object" && typeof a != "string")
     throw new TypeError("inTemplate must be an object or string");
   return !0;
-}, L = (t, e) => {
-  const r = t, s = e;
-  return Nt(r, s), r.map((a) => C(a, s));
-}, $t = (t, e) => t.map((s) => ({
-  ...s,
-  rowData: e[s.columnName]
-})), St = (t, e, r) => {
-  var a, n, i, d, o, u;
+}, p = (t, a) => {
+  const e = t, o = a;
+  return Rt(e, o), e.map((n) => h(n, o));
+}, Et = (t, a) => t.map((o) => ({
+  ...o,
+  rowData: a[o.columnName]
+})), Lt = (t, a, e) => {
+  var n, r, s, l, i, u;
   if (!Array.isArray(t))
     throw new TypeError("inColumns must be an Array");
   if (t.length === 0)
     throw new Error("inColumns cannot be empty");
-  for (let l = 0; l < t.length; l++) {
-    const c = t[l];
-    if (!c || typeof c != "object")
-      throw new TypeError(`inColumns[${l}] must be an object`);
-    if (typeof c.columnName != "string" || !c.columnName.trim())
-      throw new TypeError(`inColumns[${l}].columnName must be a non-empty string`);
+  for (let c = 0; c < t.length; c++) {
+    const d = t[c];
+    if (!d || typeof d != "object")
+      throw new TypeError(`inColumns[${c}] must be an object`);
+    if (typeof d.columnName != "string" || !d.columnName.trim())
+      throw new TypeError(`inColumns[${c}].columnName must be a non-empty string`);
   }
-  if (!Array.isArray(e))
+  if (!Array.isArray(a))
     throw new TypeError("inData must be an Array");
-  for (let l = 0; l < e.length; l++) {
-    const c = e[l];
-    if (!c || typeof c != "object")
-      throw new TypeError(`inData[${l}] must be an object`);
+  for (let c = 0; c < a.length; c++) {
+    const d = a[c];
+    if (!d || typeof d != "object")
+      throw new TypeError(`inData[${c}] must be an object`);
   }
-  if (!r || typeof r != "object" || Array.isArray(r))
+  if (!e || typeof e != "object" || Array.isArray(e))
     throw new TypeError("inSpec must be an object");
-  const s = ((i = (n = (a = t[0]) == null ? void 0 : a.template) == null ? void 0 : n.body) == null ? void 0 : i.tr) || "buildBodyTr";
-  if (!(s in r))
-    throw new Error(`Row template "${s}" not found in inSpec`);
-  for (let l = 0; l < t.length; l++) {
-    const c = t[l], b = ((o = (d = c.template) == null ? void 0 : d.body) == null ? void 0 : o.cell) || ((u = c.template) == null ? void 0 : u.bodyCell) || "buildBodyCell";
-    if (!(b in r))
-      throw new Error(`Cell template "${b}" for column "${c.columnName}" not found in inSpec`);
+  const o = ((s = (r = (n = t[0]) == null ? void 0 : n.template) == null ? void 0 : r.body) == null ? void 0 : s.tr) || "buildBodyTr";
+  if (!(o in e))
+    throw new Error(`Row template "${o}" not found in inSpec`);
+  for (let c = 0; c < t.length; c++) {
+    const d = t[c], m = ((i = (l = d.template) == null ? void 0 : l.body) == null ? void 0 : i.cell) || ((u = d.template) == null ? void 0 : u.bodyCell) || "buildBodyCell";
+    if (!(m in e))
+      throw new Error(`Cell template "${m}" for column "${d.columnName}" not found in inSpec`);
   }
   return !0;
-}, jt = (t, e) => t.map((s) => {
-  var d, o, u;
-  const a = ((o = (d = s.template) == null ? void 0 : d.body) == null ? void 0 : o.cell) || ((u = s.template) == null ? void 0 : u.bodyCell) || "buildBodyCell", n = e[a];
-  return C(s, n);
-}), It = (t, e, r) => {
-  var u, l, c;
-  St(t, e, r);
-  const s = t, a = e, n = r, i = ((c = (l = (u = s[0]) == null ? void 0 : u.template) == null ? void 0 : l.body) == null ? void 0 : c.tr) || "buildBodyTr", d = n[i];
-  return a.map((b) => {
-    const f = C(b, d), x = $t(s, b), N = jt(x, n);
-    return f.children = N, f;
+}, Dt = (t, a) => t.map((o) => {
+  var l, i, u;
+  const n = ((i = (l = o.template) == null ? void 0 : l.body) == null ? void 0 : i.cell) || ((u = o.template) == null ? void 0 : u.bodyCell) || "buildBodyCell", r = a[n];
+  return h(o, r);
+}), w = (t, a, e) => {
+  var u, c, d;
+  Lt(t, a, e);
+  const o = t, n = a, r = e, s = ((d = (c = (u = o[0]) == null ? void 0 : u.template) == null ? void 0 : c.body) == null ? void 0 : d.tr) || "buildBodyTr", l = r[s];
+  return n.map((m) => {
+    const C = h(m, l), lt = Et(o, m), it = Dt(lt, r);
+    return C.children = it, C;
   });
-}, B = (t, e) => {
-  var r;
-  if (((r = t == null ? void 0 : t.attributes) == null ? void 0 : r["data-role"]) === e) return t;
-  for (const s of (t == null ? void 0 : t.children) ?? []) {
-    const a = B(s, e);
-    if (a) return a;
-  }
-  return null;
-}, Lt = (t, e) => {
-  const r = t[e.fileName], s = e.dataRole ? B(r, e.dataRole) : r;
-  return (e.filePath ?? []).reduce((a, n) => a[n], s);
-}, vt = {
+}, Ot = {
   tagName: "tr",
   attributes: {
     class: "align-middle"
   },
   children: []
-}, kt = {
+}, Kt = {
   tagName: "col",
   attributes: {
     width: "${width}"
   }
-}, Et = {
+}, Vt = {
   tagName: "th",
   textContent: "${columnName}",
   attributes: {
     class: "py-3 px-3 fw-semibold text-uppercase small"
   }
-}, Bt = {
+}, Wt = {
   tagName: "td",
   children: [
     {
@@ -243,23 +243,25 @@ const mt = {
         type: "text",
         placeholder: "enter ${columnName}",
         name: "${columnName}",
+        id: "${columnName}",
+        list: "${columnName}",
         class: "form-control"
       }
     }
   ]
-}, Pt = {
+}, qt = {
   tagName: "td",
   textContent: "${rowValue}",
   attributes: {
     class: "py-3 px-3 text-secondary"
   }
-}, Dt = {
+}, Ht = {
   tagName: "button",
   textContent: "${columnName}",
   attributes: {
     class: "btn btn-primary btn-sm"
   }
-}, Rt = {
+}, zt = {
   tagName: "td",
   attributes: {
     class: "py-2 px-3 text-center"
@@ -273,7 +275,7 @@ const mt = {
       }
     }
   ]
-}, Ft = {
+}, Gt = {
   tagName: "option",
   textContent: "${rowValue}",
   attributes: {
@@ -285,26 +287,26 @@ const mt = {
     id: "LedgerName"
   },
   children: []
-}, Ht = {
+}, Ut = {
   tagName: "datalist",
   attributes: {
     "data-name": "${columnName}"
   },
   children: []
-}, P = {
-  buildBodyTr: vt,
-  buildColGroup: kt,
-  buildHeader: Et,
-  buildFooter: Bt,
-  buildBodyCell: Pt,
-  button: Dt,
-  buttonCell: Rt,
-  buildOption: Ft,
+}, b = {
+  buildBodyTr: Ot,
+  buildColGroup: Kt,
+  buildHeader: Vt,
+  buildFooter: Wt,
+  buildBodyCell: qt,
+  button: Ht,
+  buttonCell: zt,
+  buildOption: Gt,
   buildSelect: Mt,
-  buildDataList: Ht
-}, Vt = "table", Gt = {
+  buildDataList: Ut
+}, Jt = "table", _t = {
   class: "table table-hover table-striped align-middle border mb-0"
-}, Kt = [
+}, Xt = [
   {
     tagName: "colgroup",
     attributes: {
@@ -350,11 +352,11 @@ const mt = {
       }
     ]
   }
-], _ = {
-  tagName: Vt,
-  attributes: Gt,
-  children: Kt
-}, zt = [
+], U = {
+  tagName: Jt,
+  attributes: _t,
+  children: Xt
+}, Qt = [
   {
     narration: "Build the column widths for the table using the configured columns.",
     destinationPath: {
@@ -391,7 +393,7 @@ const mt = {
     templateKey: "buildHeader",
     func: "fromCollection"
   }
-], Wt = [
+], Yt = [
   {
     narration: "Build the table body rows for the table using the configured columns and data.",
     destinationPath: {
@@ -409,129 +411,461 @@ const mt = {
     },
     func: "twoDimensional"
   }
-], $ = (t) => Array.isArray(t) ? t : [t], R = {
-  set: (t, e, r) => {
-    t[e] = r;
+], y = (t, a) => {
+  var e;
+  if (((e = t == null ? void 0 : t.attributes) == null ? void 0 : e["data-role"]) === a) return t;
+  for (const o of (t == null ? void 0 : t.children) ?? []) {
+    const n = y(o, a);
+    if (n) return n;
+  }
+  return null;
+}, Zt = (t, a) => {
+  const e = t[a.fileName], o = a.dataRole ? y(e, a.dataRole) : e;
+  return (a.filePath ?? []).reduce((n, r) => n[r], o);
+}, A = (t) => Array.isArray(t) ? t : [t], J = (t, a, e) => {
+  t[a] = e;
+}, te = (t, a, e) => {
+  t[a].push(...A(e));
+}, ee = (t, a, e) => {
+  t[a].unshift(...A(e));
+}, ae = (t, a, e) => {
+  t[a].forEach((o) => {
+    o.children.push(...structuredClone(A(e)));
+  });
+}, oe = (t, a, e) => {
+  t[a].forEach((o) => {
+    o.children.unshift(...structuredClone(A(e)));
+  });
+}, ne = (t, a, e) => {
+  t[a].forEach((o, n) => {
+    const r = structuredClone(e);
+    r.textContent = n + 1, o.children.unshift(r);
+  });
+}, re = {
+  set: J,
+  push: te,
+  unshift: ee,
+  pushToRows: ae,
+  unshiftToRows: oe,
+  unshiftSerialToRows: ne
+}, se = (t, a) => {
+  const e = a.dataRole ? y(t[a.fileName], a.dataRole) : t[a.fileName], o = [...a.filePath ?? []], n = o.pop();
+  return { parent: o.reduce((s, l) => s[l], e), key: n };
+}, _ = (t, a, e) => {
+  const { parent: o, key: n } = se(t, a);
+  (re[a.action] || J)(o, n, e);
+}, le = (t, a, e) => {
+  var r, s;
+  const o = !!((r = t.sourcePath) != null && r.fileName && Array.isArray((s = t.sourcePath) == null ? void 0 : s.filePath)), n = `structure/sourcePath: ${o ? "passed" : "failed"}`;
+  return e.push(n), a && console.log(n), o;
+}, ie = (t, a, e) => {
+  var r, s;
+  const o = !!((r = t.destinationPath) != null && r.fileName && Array.isArray((s = t.destinationPath) == null ? void 0 : s.filePath)), n = `structure/destinationPath: ${o ? "passed" : "failed"}`;
+  return e.push(n), a && console.log(n), o;
+}, ce = (t, a, e) => {
+  const o = t.templateKey === void 0 || typeof t.templateKey == "string" && t.templateKey.length > 0, n = `structure/templateKey: ${o ? "passed" : "failed"}`;
+  return e.push(n), a && console.log(n), o;
+}, ue = (t, a, e) => {
+  const o = typeof t.func == "string" && t.func.length > 0, n = `structure/func: ${o ? "passed" : "failed"}`;
+  return e.push(n), a && console.log(n), o;
+}, de = (t, a, e) => [
+  le(t, a, e),
+  ie(t, a, e),
+  ce(t, a, e),
+  ue(t, a, e)
+].every(Boolean), be = (t, a, e, o) => {
+  const n = typeof a[t.func] == "function", r = `references/func (${t.func}): ${n ? "passed" : "failed"}`;
+  return o.push(r), e && console.log(r), n;
+}, pe = (t, a, e, o) => {
+  const n = t.templateKey === void 0 || Object.hasOwn(a, t.templateKey), r = `references/templateKey${t.templateKey === void 0 ? " (not used)" : ` (${t.templateKey})`}: ${n ? "passed" : "failed"}`;
+  return o.push(r), e && console.log(r), n;
+}, me = (t, a, e, o, n) => {
+  const r = be(t, a, o, n), s = pe(t, e, o, n);
+  return r && s;
+}, X = (t, a, e, o, n) => de(t, o, n) ? me(t, a, e, o, n) : !1, fe = (t, a, e, o, n, r) => {
+  if (!X(t, e, o, n, r)) return;
+  const s = o, l = t.templateKey, i = s[l];
+  console.log("templateKey ; ", l), console.log("localSpecKey ; ", i);
+  const u = Zt(a, t.sourcePath), c = e[t.func](u, i);
+  l === "buildFooter" && console.log("result ; ", c), _(a, t.destinationPath, c);
+}, k = (t, a, e, o, n, r) => {
+  t.forEach((s) => {
+    fe(s, a, e, o, n, r);
+  });
+}, he = (t, a, e, o, n, r) => {
+  if (!X(t, e, o, n, r)) return;
+  const s = e[t.func](
+    a.data.columns,
+    a.data.data,
+    o
+  );
+  _(a, t.destinationPath, s);
+}, S = (t, a, e, o, n, r) => {
+  t.forEach((s) => {
+    he(s, a, e, o, n, r);
+  });
+}, F = { data: {}, base: U, spec: b }, E = { fromCollection: p, twoDimensional: w }, ye = (t, a = !1, e = []) => (F.data = t, k(Qt, F, E, b, a, e), S(Yt, F, E, b, a, e), U), Ce = "table", $e = {
+  class: "table table-hover table-striped align-middle border mb-0"
+}, ge = [
+  {
+    tagName: "colgroup",
+    attributes: {
+      "data-role": "table-colgroup"
+    },
+    children: []
+  },
+  {
+    tagName: "thead",
+    attributes: {
+      class: "table-dark",
+      "data-role": "table-header"
+    },
+    children: [
+      {
+        tagName: "tr",
+        attributes: {
+          "data-role": "table-header-row"
+        },
+        children: []
+      }
+    ]
+  },
+  {
+    tagName: "tbody",
+    attributes: {
+      "data-role": "table-body"
+    },
+    children: []
+  },
+  {
+    tagName: "tfoot",
+    attributes: {
+      "data-role": "table-footer"
+    },
+    children: [
+      {
+        tagName: "tr",
+        attributes: {
+          "data-role": "table-footer-row"
+        },
+        children: []
+      }
+    ]
+  }
+], Q = {
+  tagName: Ce,
+  attributes: $e,
+  children: ge
+}, we = [
+  {
+    narration: "Build the column widths for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-colgroup",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildColGroup",
+    func: "fromCollection"
+  },
+  {
+    narration: "Build the header row for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-header-row",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildHeader",
+    func: "fromCollection"
+  }
+], L = { data: {}, base: Q, spec: b }, Ne = { fromCollection: p }, xe = (t, a = !1, e = []) => (L.data = t, k(we, L, Ne, b, a, e), Q), Te = [], Y = {
+  children: Te
+}, Ae = [
+  {
+    narration: "Build the table body rows for the table using the configured columns and data.",
+    destinationPath: {
+      fileName: "base",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    func: "twoDimensional"
+  }
+], D = { data: {}, base: Y, spec: b }, ke = { twoDimensional: w }, Ie = (t, a = !1, e = []) => (D.data = t, S(Ae, D, ke, b, a, e), Y.children), Fe = "table", Pe = {
+  class: "table table-hover table-striped align-middle border mb-0"
+}, je = [
+  {
+    tagName: "colgroup",
+    attributes: {
+      "data-role": "table-colgroup"
+    },
+    children: []
   },
-  push: (t, e, r) => {
-    t[e].push(...$(r));
+  {
+    tagName: "thead",
+    attributes: {
+      class: "table-dark",
+      "data-role": "table-header"
+    },
+    children: [
+      {
+        tagName: "tr",
+        attributes: {
+          "data-role": "table-header-row"
+        },
+        children: []
+      }
+    ]
   },
-  unshift: (t, e, r) => {
-    t[e].unshift(...$(r));
+  {
+    tagName: "tbody",
+    attributes: {
+      "data-role": "table-body"
+    },
+    children: []
   },
-  pushToRows: (t, e, r) => {
-    t[e].forEach((s) => {
-      s.children.push(...structuredClone($(r)));
-    });
+  {
+    tagName: "tfoot",
+    attributes: {
+      "data-role": "table-footer"
+    },
+    children: [
+      {
+        tagName: "tr",
+        attributes: {
+          "data-role": "table-footer-row"
+        },
+        children: []
+      }
+    ]
+  }
+], Z = {
+  tagName: Fe,
+  attributes: Pe,
+  children: je
+}, Be = [
+  {
+    narration: "Build the column widths for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-colgroup",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildColGroup",
+    func: "fromCollection"
   },
-  unshiftToRows: (t, e, r) => {
-    t[e].forEach((s) => {
-      s.children.unshift(...structuredClone($(r)));
-    });
+  {
+    narration: "Build the header row for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-header-row",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildHeader",
+    func: "fromCollection"
   },
-  unshiftSerialToRows: (t, e, r) => {
-    t[e].forEach((s, a) => {
-      const n = structuredClone(r);
-      n.textContent = a + 1, s.children.unshift(n);
-    });
+  {
+    narration: "Build the footer row for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-footer-row",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildFooter",
+    func: "fromCollection"
   }
-}, q = (t, e, r) => {
-  const s = e.dataRole ? B(t[e.fileName], e.dataRole) : t[e.fileName], a = [...e.filePath ?? []], n = a.pop(), i = a.reduce((o, u) => o[u], s);
-  (R[e.action] || R.set)(i, n, r);
-}, m = { data: {}, base: _, spec: P }, O = {
-  fromCollection: L,
-  twoDimensional: It
-}, _t = (t) => {
-  t.forEach((e) => {
-    const r = Lt(m, e.sourcePath);
-    if (r) {
-      const s = O[e.func](r, P[e.templateKey]);
-      q(m, e.destinationPath, s);
-    } else
-      console.log("   !instruction : ", e), console.log("   !source : ", r);
-  });
-}, qt = (t) => {
-  t.forEach((e) => {
-    const r = O[e.func](
-      m.data.columns,
-      m.data.data,
-      P
-    );
-    q(m, e.destinationPath, r);
-  });
-}, Ot = (t) => (m.data = t, _t(zt), qt(Wt), _), F = ({
+], ve = [
+  {
+    narration: "Build the table body rows for the table using the configured columns and data.",
+    destinationPath: {
+      fileName: "base",
+      dataRole: "table-body",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    func: "twoDimensional"
+  }
+], P = { data: {}, base: Z, spec: b }, O = { fromCollection: p, twoDimensional: w }, Se = (t, a = !1, e = []) => (P.data = t, k(Be, P, O, b, a, e), S(ve, P, O, b, a, e), Z), Re = [], N = {
+  children: Re
+}, Ee = [
+  {
+    narration: "Build the footer row for the table using the configured columns.",
+    destinationPath: {
+      fileName: "base",
+      filePath: [
+        "children"
+      ]
+    },
+    sourcePath: {
+      fileName: "data",
+      filePath: [
+        "columns"
+      ]
+    },
+    templateKey: "buildFooter",
+    func: "fromCollection"
+  }
+], K = { data: {}, base: N, spec: b }, Le = { fromCollection: p, twoDimensional: w }, De = (t, a = !1, e = []) => (K.data = t, k(Ee, K, Le, b, a, e), N == null ? void 0 : N.children), Oe = {
+  simple: ye,
+  headerOnly: xe,
+  bodyOnly: Ie,
+  withFooter: Se,
+  footerOnly: De
+}, V = ({
   inData: t,
-  inColumns: e,
-  inType: r,
-  footer: s = [],
-  options: a
-} = {}) => Ot({
-  columns: e,
-  data: t
-}), Jt = {
+  inColumns: a,
+  inType: e,
+  footer: o = [],
+  options: n,
+  inShowLog: r
+} = {}) => {
+  const l = Oe[e];
+  return l({
+    columns: a,
+    data: t,
+    showLog: r
+  });
+}, Ke = ({ inData: t = [], inColumns: a = [] } = {}) => ({
+  data: t,
+  columns: a
+}), Ve = {
   tagName: "option",
   textContent: "${rowValue}",
   attributes: {
     value: "${rowValue}"
   }
-}, Ut = {
+}, We = {
   tagName: "select",
   attributes: {
     id: "LedgerName"
   },
   children: []
-}, Xt = {
+}, qe = {
   tagName: "datalist",
   attributes: {
     "data-name": "${columnName}"
   },
   children: []
-}, g = {
-  buildOption: Jt,
-  buildSelect: Ut,
-  buildDataList: Xt
-}, Qt = ({ inData: t = [] } = {}) => {
-  const e = (t ?? []).map(
-    (s) => typeof s == "object" && s !== null ? s : { rowValue: s }
-  ), r = structuredClone(g.buildSelect);
-  return r.children = L(e, g.buildOption), r;
-}, Yt = ({ inData: t = [], inColumns: e = [] } = {}) => e.map((s) => {
-  const a = structuredClone(g.buildOption);
-  a.textContent = a.textContent.replace("rowValue", s.columnName), a.attributes.value = a.attributes.value.replace("rowValue", s.columnName);
-  const n = L(t, a);
-  return console.log("createdArray : ", n[0], a), n;
-}), M = ({ inData: t = [] } = {}) => {
-  const e = (t ?? []).map(
-    (s) => typeof s == "object" && s !== null ? s : { rowValue: s }
-  ), r = structuredClone(g.buildDataList);
-  return r.children = L(e, g.buildOption), r;
-}, Zt = {
+}, f = {
+  buildOption: Ve,
+  buildSelect: We,
+  buildDataList: qe
+}, He = (t, a = f.buildOption) => {
+  const e = structuredClone(a);
+  return e.textContent = e.textContent.replace("rowValue", t), e.attributes.value = e.attributes.value.replace("rowValue", t), e;
+}, ze = (t, a) => {
+  const e = a == null ? void 0 : a.columnName, o = structuredClone(f.buildSelect);
+  o.attributes.id = e, o.attributes["data-name"] = e;
+  const n = He(e, f.buildOption);
+  return o.children = p(t, n), o;
+}, Ge = ({ data: t, columns: a }) => a.map((e) => ze(t, e)), Me = (t = {}) => {
+  const { data: a, columns: e } = Ke(t);
+  return Ge({ data: a, columns: e });
+}, Ue = ({ inData: t = [], inColumns: a = [] } = {}) => ({
+  data: t,
+  columns: a
+}), Je = (t, a = f.buildOption) => {
+  const e = structuredClone(a);
+  return e.textContent = e.textContent.replace("rowValue", t), e.attributes.value = e.attributes.value.replace("rowValue", t), e;
+}, _e = (t, a) => {
+  const e = a == null ? void 0 : a.columnName, o = Je(e, f.buildOption);
+  return p(t, o);
+}, Xe = ({ data: t, columns: a }) => a.map((e) => _e(t, e)), Qe = (t = {}) => {
+  const { data: a, columns: e } = Ue(t);
+  return Xe({ data: a, columns: e });
+}, Ye = ({ inData: t = [], inColumns: a = [] } = {}) => ({
+  data: t,
+  columns: a
+}), Ze = (t, a = f.buildOption) => {
+  const e = structuredClone(a);
+  return e.textContent = e.textContent.replace("rowValue", t), e.attributes.value = e.attributes.value.replace("rowValue", t), e;
+}, ta = (t, a) => {
+  const e = a == null ? void 0 : a.columnName, o = structuredClone(f.buildDataList);
+  o.attributes.id = e, o.attributes["data-name"] = e;
+  const n = Ze(e, f.buildOption);
+  return o.children = p(t, n), o;
+}, ea = ({ data: t, columns: a }) => a.map((e) => ta(t, e)), W = (t = {}) => {
+  const { data: a, columns: e } = Ye(t);
+  return ea({ data: a, columns: e });
+}, aa = {
   version: "1.2.0",
   name: "json-renderers-build-input-row"
-}, te = (t) => {
-  const e = t;
-  if (typeof globalThis > "u" || !e) return;
+}, oa = (t) => {
+  const a = t;
+  if (typeof globalThis > "u" || !a) return;
   globalThis.ks ?? (globalThis.ks = {});
-  const r = typeof e == "function" ? e : e.render;
+  const e = typeof a == "function" ? a : a.render;
   globalThis.ks.jsonRenderersBuildInputRow = {
-    meta: Zt,
-    render: r,
-    ...typeof e == "object" ? e : {}
+    meta: aa,
+    render: e,
+    ...typeof a == "object" ? a : {}
   };
-}, ee = "input", re = {
+}, na = "input", ra = {
   type: "search",
   placeholder: "Search...",
   class: "form-control",
   id: "searchInputId"
-}, se = {
-  tagName: ee,
-  attributes: re
-}, S = ({ inOptions: t = {}, options: e = {} } = {}) => {
-  const r = t && Object.keys(t).length > 0 ? t : e, s = structuredClone(se);
-  return r.placeholder && (s.attributes.placeholder = r.placeholder), r.class && (s.attributes.class = r.class), r.id && (s.attributes.id = r.id), r.name && (s.attributes.name = r.name), r.type && (s.attributes.type = r.type), r.value && (s.attributes.value = r.value), s;
-}, ne = "div", oe = {
+}, sa = {
+  tagName: na,
+  attributes: ra
+}, x = ({ inOptions: t = {}, options: a = {} } = {}) => {
+  const e = t && Object.keys(t).length > 0 ? t : a, o = structuredClone(sa);
+  return e.placeholder && (o.attributes.placeholder = e.placeholder), e.class && (o.attributes.class = e.class), e.id && (o.attributes.id = e.id), e.name && (o.attributes.name = e.name), e.type && (o.attributes.type = e.type), e.value && (o.attributes.value = e.value), o;
+}, la = "div", ia = {
   class: "d-flex align-items-center gap-2"
-}, ae = [
+}, ca = [
   {
     tagName: "label",
     textContent: "Search:",
@@ -549,16 +883,16 @@ const mt = {
       id: "searchInputId"
     }
   }
-], le = {
-  tagName: ne,
-  attributes: oe,
-  children: ae
-}, A = ({ inOptions: t = {}, options: e = {} } = {}) => {
-  const r = t && Object.keys(t).length > 0 ? t : e, s = structuredClone(le), a = s.children[0], n = s.children[1];
-  return r.label && (a.textContent = r.label), r.id && (a.attributes.for = r.id, n.attributes.id = r.id), r.placeholder && (n.attributes.placeholder = r.placeholder), r.class && (n.attributes.class = r.class), r.name && (n.attributes.name = r.name), r.type && (n.attributes.type = r.type), r.wrapperClass && (s.attributes.class = r.wrapperClass), r.labelClass && (a.attributes.class = r.labelClass), s;
-}, ie = "div", ce = {
+], ua = {
+  tagName: la,
+  attributes: ia,
+  children: ca
+}, I = ({ inOptions: t = {}, options: a = {} } = {}) => {
+  const e = t && Object.keys(t).length > 0 ? t : a, o = structuredClone(ua), n = o.children[0], r = o.children[1];
+  return e.label && (n.textContent = e.label), e.id && (n.attributes.for = e.id, r.attributes.id = e.id), e.placeholder && (r.attributes.placeholder = e.placeholder), e.class && (r.attributes.class = e.class), e.name && (r.attributes.name = e.name), e.type && (r.attributes.type = e.type), e.wrapperClass && (o.attributes.class = e.wrapperClass), e.labelClass && (n.attributes.class = e.labelClass), o;
+}, da = "div", ba = {
   class: "d-flex align-items-center gap-2"
-}, ue = [
+}, pa = [
   {
     tagName: "label",
     textContent: "Search:",
@@ -585,323 +919,763 @@ const mt = {
       id: "searchButtonId"
     }
   }
-], de = {
-  tagName: ie,
-  attributes: ce,
-  children: ue
-}, v = ({ inOptions: t = {}, options: e = {} } = {}) => {
-  const r = t && Object.keys(t).length > 0 ? t : e, s = structuredClone(de), a = s.children[0], n = s.children[1], i = s.children[2];
-  return r.label && (a.textContent = r.label), r.id && (a.attributes.for = r.id, n.attributes.id = r.id), r.placeholder && (n.attributes.placeholder = r.placeholder), r.class && (n.attributes.class = r.class), r.name && (n.attributes.name = r.name), r.type && (n.attributes.type = r.type), r.buttonText && (i.textContent = r.buttonText), r.buttonClass && (i.attributes.class = r.buttonClass), r.buttonId && (i.attributes.id = r.buttonId), r.wrapperClass && (s.attributes.class = r.wrapperClass), r.labelClass && (a.attributes.class = r.labelClass), s;
-}, be = {
-  input: S,
-  inputOnly: S,
-  inputWithLabel: A,
-  inputWithLabelButton: v
-}, pe = ({
+], ma = {
+  tagName: da,
+  attributes: ba,
+  children: pa
+}, R = ({ inOptions: t = {}, options: a = {} } = {}) => {
+  const e = t && Object.keys(t).length > 0 ? t : a, o = structuredClone(ma), n = o.children[0], r = o.children[1], s = o.children[2];
+  return e.label && (n.textContent = e.label), e.id && (n.attributes.for = e.id, r.attributes.id = e.id), e.placeholder && (r.attributes.placeholder = e.placeholder), e.class && (r.attributes.class = e.class), e.name && (r.attributes.name = e.name), e.type && (r.attributes.type = e.type), e.buttonText && (s.textContent = e.buttonText), e.buttonClass && (s.attributes.class = e.buttonClass), e.buttonId && (s.attributes.id = e.buttonId), e.wrapperClass && (o.attributes.class = e.wrapperClass), e.labelClass && (n.attributes.class = e.labelClass), o;
+}, fa = {
+  input: x,
+  inputOnly: x,
+  inputWithLabel: I,
+  inputWithLabelButton: R
+}, ha = ({
   type: t = "inputWithLabel",
-  options: e = {},
-  inType: r,
-  inOptions: s
+  options: a = {},
+  inType: e,
+  inOptions: o
 } = {}) => {
-  const a = r ?? t, n = s ?? e;
-  return (be[a] || A)({ inOptions: n, options: n });
+  const n = e ?? t, r = o ?? a;
+  return (fa[n] || I)({ inOptions: r, options: r });
 };
-te({
-  render: pe,
-  inputOnly: S,
-  inputWithLabel: A,
-  inputWithLabelButton: v
+oa({
+  render: ha,
+  inputOnly: x,
+  inputWithLabel: I,
+  inputWithLabelButton: R
 });
-const k = ({ inOptions: t = {}, options: e = {} } = {}) => {
-  const r = t && Object.keys(t).length > 0 ? t : e;
-  return (r == null ? void 0 : r.label) === !1 || (r == null ? void 0 : r.flavour) === "inputOnly" ? S({ inOptions: r }) : (r == null ? void 0 : r.flavour) === "inputWithLabelButton" || r != null && r.button || r != null && r.buttonText ? v({ inOptions: r }) : A({ inOptions: r });
-}, fe = {
+const j = ({ inOptions: t = {}, options: a = {} } = {}) => {
+  const e = t && Object.keys(t).length > 0 ? t : a;
+  return (e == null ? void 0 : e.label) === !1 || (e == null ? void 0 : e.flavour) === "inputOnly" ? x({ inOptions: e }) : (e == null ? void 0 : e.flavour) === "inputWithLabelButton" || e != null && e.button || e != null && e.buttonText ? R({ inOptions: e }) : I({ inOptions: e });
+}, ya = {
   version: "1.2.0",
   name: "json-renderers-build-form"
-}, he = (t) => {
-  const e = t;
-  typeof globalThis > "u" || !e || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks.jsonRenderersBuildForm = {
-    meta: fe,
-    render: e
-  });
-}, ye = {
-  tagName: "form",
-  attributes: {
-    class: "vstack gap-3",
-    id: "appFormId"
+}, Ca = (t) => {
+  typeof globalThis > "u" || !t || (globalThis.ks ?? (globalThis.ks = {}), globalThis.ks.jsonRenderersBuildForm = { meta: ya, render: t });
+}, $a = "div", ga = {
+  class: "${cardClass}",
+  "data-role": "form-card"
+}, wa = [
+  {
+    tagName: "header",
+    attributes: {
+      class: "${headerClass}",
+      "data-role": "form-header"
+    },
+    children: [
+      {
+        tagName: "div",
+        attributes: {
+          class: "${headingClass}"
+        },
+        children: [
+          {
+            tagName: "h2",
+            textContent: "${title}",
+            attributes: {
+              class: "${titleClass}"
+            }
+          },
+          {
+            tagName: "p",
+            textContent: "${description}",
+            attributes: {
+              class: "${descriptionClass}"
+            }
+          }
+        ]
+      },
+      {
+        tagName: "span",
+        textContent: "${recordId}",
+        attributes: {
+          class: "${recordIdClass}",
+          "data-role": "record-id"
+        }
+      },
+      {
+        tagName: "div",
+        attributes: {
+          class: "${headerActionsClass}",
+          "data-role": "header-actions"
+        },
+        children: []
+      }
+    ]
   },
-  children: []
-}, me = {
+  {
+    tagName: "div",
+    attributes: {
+      class: "${cardBodyClass}"
+    },
+    children: [
+      {
+        tagName: "form",
+        attributes: {
+          id: "${formId}",
+          "data-role": "form-body"
+        },
+        children: []
+      }
+    ]
+  },
+  {
+    tagName: "footer",
+    attributes: {
+      class: "${footerClass}",
+      "data-role": "form-footer"
+    },
+    children: [
+      {
+        tagName: "div",
+        attributes: {
+          class: "${footerActionsClass}",
+          "data-role": "footer-actions"
+        },
+        children: []
+      }
+    ]
+  }
+], Na = {
+  tagName: $a,
+  attributes: ga,
+  children: wa
+}, xa = () => structuredClone(Na), Ta = "header-actions", Aa = "button", q = {
+  destinationRole: Ta,
+  template: Aa
+}, ka = {
+  tagName: "button",
+  textContent: "${label}",
+  attributes: {
+    type: "${type}",
+    form: "${formId}",
+    class: "${buttonClass} ${buttonSizeClass} ${buttonPaddingClass}"
+  }
+}, Ia = {
+  button: ka
+}, Fa = (t, a) => {
+  const e = structuredClone(t), o = p(a.header.actions, Ia[q.template]);
+  return y(e, q.destinationRole).children.push(...o), e;
+}, Pa = "form-body", ja = {
+  destinationRole: Pa
+}, Ba = {
   tagName: "div",
   attributes: {
-    class: "mb-3"
+    class: "${rowClass}"
   },
   children: []
-}, we = {
-  tagName: "label",
-  textContent: "Label",
+}, va = {
+  tagName: "div",
   attributes: {
-    class: "form-label fw-semibold",
-    for: "fieldId"
-  }
-}, ge = {
-  tagName: "input",
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${labelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}"
+      }
+    }
+  ]
+}, Sa = {
+  tagName: "div",
   attributes: {
-    type: "text",
-    placeholder: "",
-    class: "form-control",
-    id: "fieldId",
-    name: "fieldName"
-  }
-}, Te = {
-  tagName: "button",
-  textContent: "Submit",
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${labelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}",
+        required: "required"
+      }
+    }
+  ]
+}, Ra = {
+  tagName: "div",
   attributes: {
-    type: "submit",
-    class: "btn btn-primary align-self-start",
-    id: "formSubmitBtnId"
-  }
-}, y = {
-  form: ye,
-  fieldWrapper: me,
-  label: we,
-  input: ge,
-  submitButton: Te
-}, Ce = ({ inColumn: t, inRow: e = {}, inIndex: r = 0 } = {}) => {
-  var x, N;
-  const s = t, a = e, n = r, i = (s == null ? void 0 : s.columnName) ?? `field_${n}`, d = (s == null ? void 0 : s.type) ?? "text", o = (s == null ? void 0 : s.label) ?? (s == null ? void 0 : s.title) ?? i, u = (s == null ? void 0 : s.id) ?? `form-${n}-${i.toLowerCase()}`, l = a[i] ?? (s == null ? void 0 : s.value), c = structuredClone(y.fieldWrapper), b = structuredClone(y.label);
-  if (b.textContent = o, b.attributes.for = u, d === "checkbox") {
-    c.attributes.class = "form-check mb-3";
-    const p = structuredClone(y.input);
-    return p.attributes.type = "checkbox", p.attributes.class = "form-check-input", p.attributes.id = u, p.attributes.name = i, p.attributes.value = "true", p.properties = { checked: !!(l ?? (s == null ? void 0 : s.checked) ?? !1) }, b.attributes.class = "form-check-label", c.children = [p, b], c;
-  }
-  if (d === "textarea") {
-    const p = {
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${labelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
       tagName: "textarea",
-      textContent: l ? String(l) : "",
+      textContent: "${rowValue}",
       attributes: {
-        class: (s == null ? void 0 : s.class) ?? "form-control",
-        rows: String((s == null ? void 0 : s.rows) ?? 3),
-        id: u,
-        name: i,
-        placeholder: (s == null ? void 0 : s.placeholder) ?? ""
+        class: "${inputClass} ${inputSizeClass}",
+        rows: "3",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}"
       }
-    };
-    return c.children = [b, p], c;
-  }
-  if (d === "select") {
-    const p = {
-      tagName: "select",
+    }
+  ]
+}, Ea = {
+  tagName: "div",
+  attributes: {
+    class: "${checkboxWrapperClass} ${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "input",
       attributes: {
-        class: (s == null ? void 0 : s.class) ?? "form-select",
-        id: u,
-        name: i
-      },
-      children: ((s == null ? void 0 : s.options) ?? []).map((h) => {
-        const D = String(typeof h == "object" ? h.value : h), Z = typeof h == "object" ? h.label ?? h.value : String(h), tt = l != null && String(l) === D;
-        return {
-          tagName: "option",
-          textContent: Z,
-          attributes: {
-            value: D,
-            ...tt ? { selected: !0 } : {}
-          }
-        };
-      })
-    };
-    return c.children = [b, p], c;
-  }
-  const f = structuredClone(y.input);
-  if (f.attributes.type = d, f.attributes.id = u, f.attributes.name = i, s != null && s.placeholder && (f.attributes.placeholder = s.placeholder), s != null && s.class && (f.attributes.class = s.class), l != null && (f.attributes.value = String(l)), s != null && s.buttonText || s != null && s.button) {
-    const p = {
-      tagName: "button",
-      textContent: s.buttonText ?? ((x = s.button) == null ? void 0 : x.text) ?? "Action",
+        type: "checkbox",
+        class: "${checkboxInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        value: "true"
+      }
+    },
+    {
+      tagName: "label",
+      textContent: "${label}",
       attributes: {
-        type: "button",
-        class: s.buttonClass ?? ((N = s.button) == null ? void 0 : N.class) ?? "btn btn-success",
-        id: s.buttonId ?? `${u}-btn`
+        class: "${checkboxLabelClass}",
+        for: "${columnName}"
       }
-    };
-    return c.children = [b, f, p], c;
-  }
-  return c.children = [b, f], c;
-}, j = ({ inColumns: t = [], inData: e = [], inOptions: r = {}, columns: s, data: a, options: n } = {}) => {
-  const i = Array.isArray(t) && t.length > 0 ? t : Array.isArray(s) ? s : [], d = Array.isArray(e) && e.length > 0 ? e : Array.isArray(a) ? a : [], o = r && Object.keys(r).length > 0 ? r : n ?? {}, u = d[0] ?? {}, l = structuredClone(y.form);
-  if (o != null && o.formId && (l.attributes.id = o.formId), o != null && o.className && (l.attributes.class = o.className), l.children = i.map(
-    (c, b) => Ce({ inColumn: c, inRow: u, inIndex: b })
-  ), (o == null ? void 0 : o.showSubmit) !== !1 && (o == null ? void 0 : o.submitButton) !== !1) {
-    const c = structuredClone(y.submitButton);
-    o != null && o.submitLabel && (c.textContent = o.submitLabel), o != null && o.submitClass && (c.attributes.class = o.submitClass), l.children.push(c);
-  }
-  return l;
-}, Ae = {
-  tagName: "form",
+    }
+  ]
+}, La = {
+  tagName: "div",
   attributes: {
-    class: "vstack gap-3",
-    id: "inlineFormId"
+    class: "${fieldClass}"
   },
-  children: []
-}, xe = {
-  tagName: "button",
-  textContent: "Submit",
-  attributes: {
-    type: "submit",
-    class: "btn btn-primary align-self-start",
-    id: "formSubmitBtnId"
-  }
-}, H = {
-  form: Ae,
-  submitButton: xe
-}, Ne = ({ inColumn: t, inRow: e = {}, inIndex: r = 0 } = {}) => {
-  var c, b;
-  const s = t, a = e, n = r, i = (s == null ? void 0 : s.columnName) ?? `field_${n}`, d = (s == null ? void 0 : s.type) ?? "text", o = (s == null ? void 0 : s.label) ?? (s == null ? void 0 : s.title) ?? i, u = (s == null ? void 0 : s.id) ?? `form-${n}-${i.toLowerCase()}`, l = a[i] ?? (s == null ? void 0 : s.value);
-  return s != null && s.buttonText || s != null && s.button ? v({
-    inOptions: {
-      label: o,
-      type: d,
-      id: u,
-      name: i,
-      placeholder: (s == null ? void 0 : s.placeholder) ?? "",
-      class: (s == null ? void 0 : s.class) ?? "form-control",
-      value: l != null ? String(l) : void 0,
-      buttonText: s.buttonText ?? ((c = s.button) == null ? void 0 : c.text) ?? "Action",
-      buttonClass: s.buttonClass ?? ((b = s.button) == null ? void 0 : b.class) ?? "btn btn-outline-primary",
-      buttonId: s.buttonId ?? `${u}-btn`,
-      wrapperClass: "d-flex align-items-center gap-2 mb-3",
-      labelClass: "form-label mb-0 text-nowrap fw-semibold"
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${inlineLabelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass} ${inlineInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}"
+      }
     }
-  }) : A({
-    inOptions: {
-      label: o,
-      type: d,
-      id: u,
-      name: i,
-      placeholder: (s == null ? void 0 : s.placeholder) ?? "",
-      class: (s == null ? void 0 : s.class) ?? "form-control",
-      value: l != null ? String(l) : void 0,
-      wrapperClass: "d-flex align-items-center gap-2 mb-3",
-      labelClass: "form-label mb-0 text-nowrap fw-semibold"
+  ]
+}, Da = {
+  tagName: "div",
+  attributes: {
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${inlineLabelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass} ${inlineInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}",
+        required: "required"
+      }
     }
-  });
-}, V = ({ inColumns: t = [], inData: e = [], inOptions: r = {}, columns: s, data: a, options: n } = {}) => {
-  const i = Array.isArray(t) && t.length > 0 ? t : Array.isArray(s) ? s : [], d = Array.isArray(e) && e.length > 0 ? e : Array.isArray(a) ? a : [], o = r && Object.keys(r).length > 0 ? r : n ?? {}, u = d[0] ?? {}, l = structuredClone(H.form);
-  if (o != null && o.formId && (l.attributes.id = o.formId), o != null && o.className && (l.attributes.class = o.className), l.children = i.map(
-    (c, b) => Ne({ inColumn: c, inRow: u, inIndex: b })
-  ), (o == null ? void 0 : o.showSubmit) !== !1 && (o == null ? void 0 : o.submitButton) !== !1) {
-    const c = structuredClone(H.submitButton);
-    o != null && o.submitLabel && (c.textContent = o.submitLabel), o != null && o.submitClass && (c.attributes.class = o.submitClass), l.children.push(c);
-  }
-  return l;
-}, $e = {
+  ]
+}, Oa = {
   tagName: "div",
   attributes: {
-    class: "d-flex align-items-center gap-2 mt-3"
+    class: "${fieldClass}"
   },
   children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${inlineLabelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass} ${inlineInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}"
+      }
+    },
     {
       tagName: "button",
-      textContent: "Submit",
+      textContent: "${buttonText}",
+      attributes: {
+        type: "${buttonType}",
+        class: "${inlineButtonClass}"
+      }
+    }
+  ]
+}, Ka = {
+  tagName: "div",
+  attributes: {
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
       attributes: {
-        type: "submit",
-        class: "btn btn-primary",
-        id: "submitBtnId"
+        class: "${inlineLabelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "input",
+      attributes: {
+        type: "${type}",
+        class: "${inputClass} ${inputSizeClass} ${inlineInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}",
+        value: "${rowValue}",
+        required: "required"
       }
     },
     {
       tagName: "button",
-      textContent: "Cancel",
+      textContent: "${buttonText}",
+      attributes: {
+        type: "${buttonType}",
+        class: "${inlineButtonClass}"
+      }
+    }
+  ]
+}, Va = {
+  tagName: "div",
+  attributes: {
+    class: "${fieldClass}"
+  },
+  children: [
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${inlineLabelClass}",
+        for: "${columnName}"
+      }
+    },
+    {
+      tagName: "textarea",
+      textContent: "${rowValue}",
       attributes: {
-        type: "button",
-        class: "btn btn-secondary",
-        id: "cancelBtnId"
+        class: "${inputClass} ${inputSizeClass} ${inlineInputClass}",
+        rows: "3",
+        id: "${columnName}",
+        name: "${columnName}",
+        placeholder: "${placeholder}"
       }
     }
   ]
-}, Se = {
-  buttonBar: $e
-}, G = ({ inColumns: t = [], inData: e = [], inOptions: r = {}, columns: s, data: a, options: n } = {}) => {
-  const i = Array.isArray(t) && t.length > 0 ? t : Array.isArray(s) ? s : [], d = Array.isArray(e) && e.length > 0 ? e : Array.isArray(a) ? a : [], o = r && Object.keys(r).length > 0 ? r : n ?? {}, u = j({
-    inColumns: i,
-    inData: d,
-    inOptions: { ...o, submitButton: !1, showSubmit: !1 }
-  }), l = structuredClone(Se.buttonBar);
-  return o.submitLabel && (l.children[0].textContent = o.submitLabel), o.cancelLabel && (l.children[1].textContent = o.cancelLabel), u.children.push(l), u;
-}, je = {
-  stacked: j,
-  vertical: j,
-  inline: V,
-  horizontal: V,
-  withButtons: G,
-  buttons: G
-}, J = (t = {}) => (t.type ?? (t.type = "stacked"), I(t), (je[t.type] || j)({
-  inColumns: t.columns,
-  inData: t.data,
-  inOptions: t.options
-}));
-he(J);
-const Ie = ({
+}, Wa = {
+  tagName: "div",
+  attributes: {
+    class: "${inlineCheckboxWrapperClass}"
+  },
+  children: [
+    {
+      tagName: "input",
+      attributes: {
+        type: "checkbox",
+        class: "${checkboxInputClass}",
+        id: "${columnName}",
+        name: "${columnName}",
+        value: "true"
+      }
+    },
+    {
+      tagName: "label",
+      textContent: "${label}",
+      attributes: {
+        class: "${checkboxLabelClass}",
+        for: "${columnName}"
+      }
+    }
+  ]
+}, qa = {
+  buildBodyTr: Ba,
+  buildBodyCell: va,
+  buildRequiredField: Sa,
+  buildTextareaField: Ra,
+  buildCheckboxField: Ea,
+  buildInlineField: La,
+  buildInlineRequiredField: Da,
+  buildInlineFieldWithButton: Oa,
+  buildInlineRequiredFieldWithButton: Ka,
+  buildInlineTextareaField: Va,
+  buildInlineCheckboxField: Wa
+}, Ha = (t, a, e) => {
+  const o = t.map((s) => {
+    var u, c, d, m, C;
+    const l = ((c = (u = s.template) == null ? void 0 : u.body) == null ? void 0 : c.cell) ?? (s.required ? "buildRequiredField" : "buildBodyCell");
+    let i = ((d = e.fieldTemplates) == null ? void 0 : d[l]) ?? l;
+    return s.buttonText && (i = ((m = e.buttonFieldTemplates) == null ? void 0 : m[i]) ?? i), {
+      ...s,
+      label: s.label ?? s.title ?? s.columnName,
+      type: s.type ?? "text",
+      placeholder: s.placeholder ?? "",
+      buttonType: s.buttonType ?? "button",
+      template: { ...s.template, body: { ...(C = s.template) == null ? void 0 : C.body, cell: i } }
+    };
+  }), n = a[0] ?? {}, r = Object.fromEntries(o.map((s) => [
+    s.columnName,
+    n[s.columnName] ?? s.value ?? ""
+  ]));
+  return { columns: o, rows: [r] };
+}, za = (t, a, e) => {
+  const o = Ha(a.columns, a.records, e.body), n = w(o.columns, o.rows, qa), r = structuredClone(t);
+  return y(r, ja.destinationRole).children.push(...Array.isArray(n) ? n : [n]), r;
+}, Ga = "footer-actions", Ma = "button", H = {
+  destinationRole: Ga,
+  template: Ma
+}, Ua = {
+  tagName: "button",
+  textContent: "${label}",
+  attributes: {
+    type: "${type}",
+    form: "${formId}",
+    class: "${buttonClass} ${buttonSizeClass} ${buttonPaddingClass}"
+  }
+}, Ja = {
+  button: Ua
+}, _a = (t, a) => {
+  const e = structuredClone(t), o = p(a.footer.actions, Ja[H.template]);
+  return y(e, H.destinationRole).children.push(...o), e;
+}, tt = ({ inColumns: t, inData: a, inOptions: e, columns: o, data: n, options: r } = {}) => ({
+  columns: Array.isArray(t) && t.length > 0 ? t : Array.isArray(o) ? o : [],
+  records: Array.isArray(a) && a.length > 0 ? a : Array.isArray(n) ? n : [],
+  options: e && Object.keys(e).length > 0 ? e : r ?? {}
+}), Xa = "bigButtonsForm", Qa = "Account details", Ya = "Update your profile information.", Za = "", to = "label", eo = "stacked", ao = "saveCancel", oo = {
+  formId: Xa,
+  title: Qa,
+  description: Ya,
+  recordId: Za,
+  header: to,
+  body: eo,
+  footer: ao
+}, no = {
+  actions: []
+}, ro = {
+  actions: []
+}, so = {
+  actions: [
+    {
+      label: "Refresh",
+      type: "button",
+      buttonClass: "${headerButtonClass}"
+    }
+  ]
+}, lo = {
+  actions: []
+}, io = {
+  none: no,
+  label: ro,
+  labelWithRefresh: so,
+  labelWithId: lo
+}, co = {
+  fieldTemplates: {
+    buildBodyCell: "buildInlineField",
+    buildRequiredField: "buildInlineRequiredField",
+    buildTextareaField: "buildInlineTextareaField",
+    buildCheckboxField: "buildInlineCheckboxField"
+  },
+  buttonFieldTemplates: {
+    buildInlineField: "buildInlineFieldWithButton",
+    buildInlineRequiredField: "buildInlineRequiredFieldWithButton"
+  }
+}, uo = {
+  fieldTemplates: {},
+  buttonFieldTemplates: {}
+}, bo = {
+  fieldTemplates: {},
+  buttonFieldTemplates: {}
+}, po = {
+  inline: co,
+  stacked: uo,
+  threeColumns: bo
+}, mo = {
+  actions: []
+}, fo = {
+  actions: [
+    {
+      label: "Save",
+      type: "submit",
+      buttonClass: "${primaryButtonClass}"
+    },
+    {
+      label: "Cancel",
+      type: "reset",
+      buttonClass: "${secondaryButtonClass}"
+    }
+  ]
+}, ho = {
+  actions: [
+    {
+      label: "Edit",
+      type: "button",
+      buttonClass: "${infoButtonClass}"
+    }
+  ]
+}, yo = {
+  none: mo,
+  saveCancel: fo,
+  edit: ho
+}, B = (t, a, e) => {
+  const o = t[a];
+  if (!o) throw new RangeError("Unknown bigButtons " + e + ": " + a);
+  return o;
+}, et = (t) => {
+  if (typeof t != "object" || t === null || Array.isArray(t))
+    throw new TypeError("bigButtons options must be an object keyed by renderer type");
+  const a = t["form.bigButtons"] ?? {};
+  if (typeof a != "object" || a === null || Array.isArray(a))
+    throw new TypeError('options["form.bigButtons"] must be an object');
+  const e = { ...oo, ...a };
+  return {
+    options: e,
+    header: B(io, e.header, "header"),
+    body: B(po, e.body, "body"),
+    footer: B(yo, e.footer, "footer")
+  };
+}, Co = (t, a = {}) => {
+  const e = tt(a), o = et(e.options), n = Fa(t, o), r = za(n, e, o);
+  return _a(r, o);
+}, $o = {
+  none: {
+    headerClass: "d-none",
+    headerActionsClass: "d-none"
+  },
+  label: {
+    headerClass: "card-header d-flex align-items-center justify-content-between gap-3",
+    headingClass: "me-auto",
+    titleClass: "h4 fw-semibold mb-1",
+    descriptionClass: "text-muted mb-0",
+    recordIdClass: "d-none",
+    headerActionsClass: "d-none",
+    headerButtonClass: "btn btn-outline-secondary text-nowrap"
+  },
+  labelWithRefresh: {
+    headerClass: "card-header d-flex align-items-center justify-content-between gap-3",
+    headingClass: "me-auto",
+    titleClass: "h4 fw-semibold mb-1",
+    descriptionClass: "text-muted mb-0",
+    recordIdClass: "d-none",
+    headerActionsClass: "d-flex align-items-center gap-2",
+    headerButtonClass: "btn btn-outline-secondary text-nowrap"
+  },
+  labelWithId: {
+    headerClass: "card-header d-flex align-items-center justify-content-between gap-3",
+    headingClass: "me-auto",
+    titleClass: "h4 fw-semibold mb-1",
+    descriptionClass: "text-muted mb-0",
+    recordIdClass: "badge text-bg-light border text-secondary",
+    headerActionsClass: "d-none",
+    headerButtonClass: "btn btn-outline-secondary text-nowrap"
+  }
+}, go = {
+  bootstrap: $o
+}, wo = (t, a) => {
+  var o;
+  const e = (o = go[a]) == null ? void 0 : o[t.header];
+  if (!e) throw new RangeError("Unknown bigButtons header: " + t.header);
+  return e;
+}, No = "bootstrap", xo = {
+  bootstrap: {
+    base: {
+      cardClass: "card border-0 shadow-sm w-100",
+      cardBodyClass: "card-body p-4 p-lg-5",
+      labelClass: "form-label fw-semibold",
+      inputClass: "form-control",
+      inputSizeClass: "form-control-lg",
+      checkboxWrapperClass: "form-check mb-3",
+      checkboxInputClass: "form-check-input",
+      checkboxLabelClass: "form-check-label"
+    },
+    bodies: {
+      inline: {
+        rowClass: "vstack gap-3",
+        fieldClass: "d-flex align-items-center gap-3",
+        inlineLabelClass: "form-label fw-semibold mb-0 text-nowrap",
+        inlineInputClass: "flex-grow-1",
+        inlineCheckboxWrapperClass: "form-check d-flex align-items-center gap-2"
+      },
+      stacked: {
+        rowClass: "vstack gap-3",
+        fieldClass: "w-100"
+      },
+      threeColumns: {
+        rowClass: "row g-3",
+        fieldClass: "col-md-4"
+      }
+    }
+  }
+}, v = {
+  defaultFramework: No,
+  frameworks: xo
+}, To = (t, a) => {
+  const e = v.frameworks[a];
+  if (!e) throw new RangeError("Unknown bigButtons framework: " + a);
+  const o = e.bodies[t.body];
+  if (!o) throw new RangeError("Unknown bigButtons body: " + t.body);
+  return { ...e.base, ...o };
+}, Ao = {
+  base: {
+    footerClass: "card-footer bg-transparent",
+    footerActionsClass: "d-flex flex-wrap justify-content-end gap-2",
+    buttonSizeClass: "btn-lg",
+    buttonPaddingClass: "px-4 py-2",
+    primaryButtonClass: "btn btn-primary text-nowrap",
+    secondaryButtonClass: "btn btn-outline-secondary text-nowrap",
+    infoButtonClass: "btn btn-outline-info text-nowrap",
+    inlineButtonClass: "btn btn-outline-secondary text-nowrap"
+  },
+  footers: {
+    none: {
+      footerClass: "d-none"
+    },
+    saveCancel: {},
+    edit: {}
+  }
+}, ko = {
+  bootstrap: Ao
+}, Io = (t, a) => {
+  const e = ko[a], o = e == null ? void 0 : e.footers[t.footer];
+  if (!e) throw new RangeError("Unknown bigButtons framework: " + a);
+  if (!o) throw new RangeError("Unknown bigButtons footer: " + t.footer);
+  return { ...e.base, ...o };
+}, Fo = (t, a = {}) => {
+  const e = et(tt(a).options), { options: o } = e, n = o.framework ?? v.defaultFramework;
+  if (!v.frameworks[n]) throw new RangeError("Unknown bigButtons framework: " + n);
+  const s = Object.assign(
+    {},
+    o,
+    To(o, n),
+    wo(o, n),
+    Io(o, n)
+  );
+  return h(s, structuredClone(t));
+}, Po = (t = {}) => {
+  const a = xa(), e = Co(a, t);
+  return Fo(e, t);
+}, at = (t = {}) => {
+  const a = { ...t, type: t.type ?? "form.bigButtons" };
+  return T(a), Po(a);
+};
+Ca(at);
+const jo = ({
   inType: t = "stacked",
-  inData: e,
-  inColumns: r
-} = {}) => J({
+  inData: a,
+  inColumns: e
+} = {}) => at({
   type: t,
-  columns: r,
-  data: e
-}), Le = {
-  table: F,
-  tableFromSpec: F,
-  select: Qt,
-  selectOptionsOnly: Yt,
-  dataList: M,
-  datalist: M,
-  searchInput: k,
-  search: k,
-  inputRow: k,
-  form: Ie
-}, U = (t = {}) => {
-  I(t);
-  const e = t == null ? void 0 : t.showLog, r = t.type;
-  let s = r, a = r;
-  if (r.includes(".")) {
-    const d = r.split(".");
-    s = d[0], a = d[1];
+  columns: e,
+  data: a
+}), Bo = {
+  table: V,
+  tableFromSpec: V,
+  select: Me,
+  selectOptionsOnly: Qe,
+  dataList: W,
+  datalist: W,
+  searchInput: j,
+  search: j,
+  inputRow: j,
+  form: jo
+}, ot = (t = {}) => {
+  T(t);
+  const a = t == null ? void 0 : t.showLog, e = t.type;
+  let o = e, n = e;
+  if (e.includes(".")) {
+    const l = e.split(".");
+    o = l[0], n = l[1];
   }
-  const n = Le[s];
-  if (!n)
-    throw new Error(`Renderer for type "${s}" not found.`);
-  const i = n({
-    inType: a,
+  const r = Bo[o];
+  if (!r)
+    throw new Error(`Renderer for type "${o}" not found.`);
+  const s = r({
+    inType: n,
     inColumns: t.columns,
     inData: t.data,
     inOptions: t.options,
-    options: t.options
+    options: t.options,
+    inShowLog: a
   });
-  return e && console.log("json-renderers-build output:", i), i;
+  return a && console.log("json-renderers-build output:", s), s;
 };
-wt(U);
-const ve = ({
+kt(ot);
+const vo = ({
   inColumns: t,
-  inType: e = "table",
-  inData: r,
-  inShowLog: s = !1
-} = {}) => U({
-  type: e,
-  data: r ?? [],
+  inType: a = "table",
+  inData: e,
+  inShowLog: o = !1
+} = {}) => ot({
+  type: a,
+  data: e ?? [],
   columns: t,
-  showLog: s
-}), ke = {
+  showLog: o
+}), So = {
   version: "v9",
   description: "JSON-to-DOM engine with SVG namespace support, mixed text content, and centralized traversal"
-}, Ee = ({ inFuncDefinition: t, inReviewSpec: e } = {}) => {
+}, Ro = (t) => {
   if (typeof globalThis > "u" || !t) return;
   globalThis.ks ?? (globalThis.ks = {});
-  const r = {
-    meta: ke,
-    buildSpecElement: t,
-    reviewSpec: e
+  const a = {
+    meta: So,
+    buildSpecElement: t
   };
-  globalThis.ks["json-to-tag"] = r, globalThis.ks.jsonToTag = r;
-}, Be = (t) => t == null ? null : typeof Node < "u" && t instanceof Node ? t : typeof t == "string" || typeof t == "number" ? document.createTextNode(String(t)) : typeof t == "object" && (t.nodeType === 3 || t.tagName === "#text" || !t.tagName && (t.textContent !== void 0 || t.text !== void 0)) ? document.createTextNode(t.textContent ?? t.text ?? "") : Q(t), X = (t) => Array.isArray(t) ? t.map(Be).flat(1 / 0).filter(Boolean) : [], Pe = (t) => (t == null, t), De = "http://www.w3.org/2000/svg", Re = /* @__PURE__ */ new Set([
+  globalThis.ks["json-to-tag"] = a, globalThis.ks.jsonToTag = a;
+}, Eo = (t) => t == null ? null : typeof Node < "u" && t instanceof Node ? t : typeof t == "string" || typeof t == "number" ? document.createTextNode(String(t)) : typeof t == "object" && (t.nodeType === 3 || t.tagName === "#text" || !t.tagName && (t.textContent !== void 0 || t.text !== void 0)) ? document.createTextNode(t.textContent ?? t.text ?? "") : rt(t), nt = (t) => Array.isArray(t) ? t.map(Eo).flat(1 / 0).filter(Boolean) : [], Lo = (t) => (t == null, t), Do = "http://www.w3.org/2000/svg", Oo = /* @__PURE__ */ new Set([
   "svg",
   "path",
   "symbol",
@@ -928,425 +1702,100 @@ const ve = ({
   "fegaussianblur",
   "femerge",
   "femergenode"
-]), Fe = ({ inTagName: t }) => {
-  const e = t == null ? void 0 : t.toLowerCase();
-  if (!e) return null;
-  if (e === "checkbox") {
-    const r = document.createElement("input");
-    return r.type = "checkbox", r;
+]), Ko = ({ inTagName: t }) => {
+  const a = t == null ? void 0 : t.toLowerCase();
+  if (!a) return null;
+  if (a === "checkbox") {
+    const e = document.createElement("input");
+    return e.type = "checkbox", e;
   }
-  return Re.has(e) ? document.createElementNS(De, e) : document.createElement(e);
-}, Me = ({ inElement: t, inTextContent: e }) => (!t || e === void 0 || e === null || (t.textContent = e), t), He = ({ inElement: t, inProperties: e }) => (t && e && typeof e == "object" && Object.assign(t, e), t), Ve = "http://www.w3.org/1999/xlink", Ge = ({ inElement: t, inAttributes: e }) => {
-  const r = t, s = e;
-  if (!r || !s || typeof s != "object")
-    return r;
-  const a = typeof SVGElement < "u" ? r instanceof SVGElement : r.namespaceURI === "http://www.w3.org/2000/svg";
-  return Object.entries(s).forEach(([n, i]) => {
-    if (n === "class") {
-      a ? r.setAttribute("class", String(i)) : r.className = i;
+  return Oo.has(a) ? document.createElementNS(Do, a) : document.createElement(a);
+}, Vo = ({ inElement: t, inTextContent: a }) => (!t || a === void 0 || a === null || (t.textContent = a), t), Wo = ({ inElement: t, inProperties: a }) => (t && a && typeof a == "object" && Object.assign(t, a), t), qo = "http://www.w3.org/1999/xlink", Ho = ({ inElement: t, inAttributes: a }) => {
+  const e = t, o = a;
+  if (!e || !o || typeof o != "object")
+    return e;
+  const n = typeof SVGElement < "u" ? e instanceof SVGElement : e.namespaceURI === "http://www.w3.org/2000/svg";
+  return Object.entries(o).forEach(([r, s]) => {
+    if (r === "class") {
+      n ? e.setAttribute("class", String(s)) : e.className = s;
       return;
     }
-    if (n === "xlink:href" || n === "href") {
-      if (i != null) {
-        const d = String(i);
-        if (a)
+    if (r === "xlink:href" || r === "href") {
+      if (s != null) {
+        const l = String(s);
+        if (n)
           try {
-            r.setAttributeNS(Ve, "href", d);
+            e.setAttributeNS(qo, "href", l);
           } catch {
           }
-        r.setAttribute("href", d), r.setAttribute("xlink:href", d);
+        e.setAttribute("href", l), e.setAttribute("xlink:href", l);
       }
       return;
     }
-    if (typeof i == "boolean") {
-      i ? r.setAttribute(n, "") : r.removeAttribute(n);
+    if (typeof s == "boolean") {
+      s ? e.setAttribute(r, "") : e.removeAttribute(r);
       return;
     }
-    i != null && r.setAttribute(n, String(i));
-  }), r;
-}, Ke = ({ inElement: t, inClassList: e }) => {
-  if (!t || !e) return t;
-  const r = typeof e == "string" ? e.split(/\s+/).filter(Boolean) : Array.isArray(e) ? e.filter((s) => typeof s == "string" && s.trim()) : [];
-  return r.length && t.classList.add(...r), t;
-}, ze = (t) => {
+    s != null && e.setAttribute(r, String(s));
+  }), e;
+}, zo = ({ inElement: t, inClassList: a }) => {
+  if (!t || !a) return t;
+  const e = typeof a == "string" ? a.split(/\s+/).filter(Boolean) : Array.isArray(a) ? a.filter((o) => typeof o == "string" && o.trim()) : [];
+  return e.length && t.classList.add(...e), t;
+}, Go = (t) => {
   if (!t || typeof t != "object" || Array.isArray(t) || !t.tagName) return null;
-  const e = Fe({ inTagName: t.tagName });
-  if (!e) return null;
-  if (Me({
-    inElement: e,
-    inTextContent: Pe(t.textContent),
+  const a = Ko({ inTagName: t.tagName });
+  if (!a) return null;
+  if (Vo({
+    inElement: a,
+    inTextContent: Lo(t.textContent),
     inTagName: t.tagName
-  }), He({
-    inElement: e,
+  }), Wo({
+    inElement: a,
     inProperties: t.properties
-  }), Ge({
-    inElement: e,
+  }), Ho({
+    inElement: a,
     inAttributes: t.attributes
-  }), Ke({
-    inElement: e,
+  }), zo({
+    inElement: a,
     inClassList: t.classList
   }), Array.isArray(t.children)) {
-    const r = X(t.children);
-    r.length && e.append(...r);
+    const e = nt(t.children);
+    e.length && a.append(...e);
   }
-  return e;
-}, Q = (t) => t == null ? null : typeof Node < "u" && t instanceof Node ? t : Array.isArray(t) ? X(t) : typeof t == "object" ? ze(t) : typeof t == "string" || typeof t == "number" ? document.createTextNode(String(t)) : null, We = "./tags.schema.json", _e = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "title",
-    "role"
-  ],
-  childTags: []
-}, qe = {
-  allowsTextContent: !1,
-  allowsChildren: !1,
-  allowedAttributes: [
-    "type",
-    "placeholder",
-    "value",
-    "name",
-    "disabled",
-    "readonly",
-    "required",
-    "list"
-  ]
-}, Oe = {
-  allowsTextContent: !1,
-  allowsChildren: !1,
-  allowedAttributes: [
-    "type",
-    "checked",
-    "name",
-    "value",
-    "disabled",
-    "required"
-  ]
-}, Je = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "span"
-  ],
-  childTags: [
-    "col"
-  ]
-}, Ue = {
-  allowsTextContent: !1,
-  allowsChildren: !1,
-  allowedAttributes: [
-    "span",
-    "style",
-    "width"
-  ]
-}, Xe = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "for"
-  ],
-  childTags: []
-}, Qe = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "action",
-    "method",
-    "autocomplete",
-    "enctype",
-    "name",
-    "novalidate",
-    "target"
-  ],
-  childTags: []
-}, Ye = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "name",
-    "disabled",
-    "required",
-    "multiple",
-    "size"
-  ],
-  childTags: [
-    "option"
-  ]
-}, Ze = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: []
-}, tr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: []
-}, er = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: []
-}, rr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: []
-}, sr = {
-  allowsTextContent: !1,
-  allowsChildren: !1,
-  allowedAttributes: [
-    "src",
-    "alt",
-    "width",
-    "height",
-    "loading"
-  ]
-}, nr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "type",
-    "disabled",
-    "name",
-    "value"
-  ],
-  childTags: []
-}, or = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "border",
-    "cellpadding",
-    "cellspacing"
-  ],
-  childTags: [
-    "caption",
-    "colgroup",
-    "thead",
-    "tbody",
-    "tfoot",
-    "tr"
-  ]
-}, ar = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: [
-    "tr"
-  ]
-}, lr = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: [
-    "tr"
-  ]
-}, ir = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: [
-    "tr"
-  ]
-}, cr = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: [
-    "td",
-    "th"
-  ]
-}, ur = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "scope",
-    "colspan",
-    "rowspan"
-  ],
-  childTags: []
-}, dr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "colspan",
-    "rowspan"
-  ],
-  childTags: []
-}, br = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: [
-    "option"
-  ]
-}, pr = {
-  allowsTextContent: !0,
-  allowsChildren: !1,
-  allowedAttributes: [
-    "value",
-    "label",
-    "selected",
-    "disabled"
-  ]
-}, fr = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "role"
-  ],
-  childTags: []
-}, hr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "href",
-    "target",
-    "rel",
-    "title",
-    "download"
-  ],
-  childTags: []
-}, yr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "aria-hidden"
-  ],
-  childTags: []
-}, mr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [],
-  childTags: []
-}, wr = {
-  allowsTextContent: !1,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "type"
-  ],
-  childTags: [
-    "li"
-  ]
-}, gr = {
-  allowsTextContent: !0,
-  allowsChildren: !0,
-  allowedAttributes: [
-    "value"
-  ],
-  childTags: []
-}, Tr = {
-  allowsTextContent: !1,
-  allowsChildren: !1,
-  allowedAttributes: []
-}, Cr = {
-  $schema: We,
-  div: _e,
-  input: qe,
-  checkbox: Oe,
-  colgroup: Je,
-  col: Ue,
-  label: Xe,
-  form: Qe,
-  select: Ye,
-  p: Ze,
-  h1: tr,
-  h2: er,
-  span: rr,
-  img: sr,
-  button: nr,
-  table: or,
-  thead: ar,
-  tbody: lr,
-  tfoot: ir,
-  tr: cr,
-  th: ur,
-  td: dr,
-  datalist: br,
-  option: pr,
-  header: fr,
-  a: hr,
-  i: yr,
-  small: mr,
-  ul: wr,
-  li: gr,
-  hr: Tr
-}, E = ({ inSpec: t }) => {
-  const e = t;
-  if (!e) return [];
-  if (Array.isArray(e))
-    return e.flatMap((s) => E({ inSpec: s }));
-  if (typeof e != "object") return [];
-  const r = [];
-  return typeof e.tagName == "string" && e.tagName.trim().length > 0 && r.push(e.tagName.toLowerCase()), Array.isArray(e.children) && e.children.length > 0 && e.children.forEach((s) => {
-    const a = E({ inSpec: s });
-    r.push(...a);
-  }), r;
-}, Ar = ({ inTagsFound: t, inAllowedTags: e }) => {
-  const r = t ?? [], s = e ?? {}, a = new Set(
-    Object.keys(s).filter((l) => l !== "$schema").map((l) => l.toLowerCase())
-  ), n = {}, i = [], d = [];
-  r.forEach((l) => {
-    n[l] = (n[l] || 0) + 1, a.has(l) ? i.includes(l) || i.push(l) : d.includes(l) || d.push(l);
-  });
-  const o = r.length, u = d.length === 0;
-  return {
-    totalTags: o,
-    tagCounts: n,
-    uniqueTags: Object.keys(n),
-    recognizedTags: i,
-    unrecognizedTags: d,
-    areAllTagsPresent: u
-  };
-}, xr = ({ inSpec: t, inTags: e = Cr } = {}) => {
-  const r = t, s = e, a = E({ inSpec: r }), n = Ar({
-    inTagsFound: a,
-    inAllowedTags: s
-  });
-  return {
-    areAllTagsPresent: n.areAllTagsPresent,
-    totalTags: n.totalTags,
-    tagCounts: n.tagCounts,
-    uniqueTags: n.uniqueTags,
-    recognizedTags: n.recognizedTags,
-    unrecognizedTags: n.unrecognizedTags
-  };
-}, Y = (t = {}) => {
-  const e = (t == null ? void 0 : t.spec) ?? (t == null ? void 0 : t.inSpec) ?? t;
-  return Q(e);
+  return a;
+}, rt = (t) => t == null ? null : typeof Node < "u" && t instanceof Node ? t : Array.isArray(t) ? nt(t) : typeof t == "object" ? Go(t) : typeof t == "string" || typeof t == "number" ? document.createTextNode(String(t)) : null, st = (t = {}) => {
+  const a = (t == null ? void 0 : t.spec) ?? (t == null ? void 0 : t.inSpec) ?? t;
+  return rt(a);
 };
-Ee({
-  inFuncDefinition: Y,
-  inReviewSpec: xr
-});
-const Nr = ({
+Ro(st);
+const Mo = ({
   inSpec: t,
-  inTargetHtmlId: e,
-  inAppendPosition: r,
-  inShowLog: s = !1
+  inTargetHtmlId: a,
+  inAppendPosition: e,
+  inShowLog: o = !1
 } = {}) => {
-  const a = t, n = e, i = r, d = s, o = Y(a);
-  d && console.log("renderToDom 1 (content):", o);
-  const u = document.getElementById(n);
-  return u ? (Array.isArray(o) || o instanceof NodeList || o instanceof HTMLCollection ? i === "prepend" ? u.prepend(...o) : u.append(...o) : i === "prepend" ? u.prepend(o) : (u.innerHTML = "", u.append(o)), d && console.log("renderToDom 2 (mounted):", u), u) : null;
-}, $r = (t = {}) => {
-  T(t), (t == null ? void 0 : t.showLog) && console.log("first : ", t == null ? void 0 : t.columns, t == null ? void 0 : t.data, t == null ? void 0 : t.appendPosition);
-  const r = ve({
+  const n = t, r = a, s = e, l = o, i = st(n);
+  l && console.log("renderToDom 1 (content):", i);
+  const u = document.getElementById(r);
+  return u ? (Array.isArray(i) || i instanceof NodeList || i instanceof HTMLCollection ? s === "prepend" ? u.prepend(...i) : u.append(...i) : s === "prepend" ? u.prepend(i) : (u.innerHTML = "", u.append(i)), l && console.log("renderToDom 2 (mounted):", u), u) : null;
+}, Uo = (t = {}) => {
+  g(t), (t == null ? void 0 : t.showLog) && console.log("first : ", t == null ? void 0 : t.columns, t == null ? void 0 : t.data, t == null ? void 0 : t.appendPosition);
+  const e = vo({
     inColumns: t.columns,
     inData: t.data,
     inType: t.type,
     inShowLog: t.showLog
   });
-  return Nr({
-    inSpec: r,
+  return Mo({
+    inSpec: e,
     inTargetHtmlId: t.targetHtmlId,
     inAppendPosition: t.appendPosition,
     inShowLog: t.showLog
   });
 };
-rt($r);
+ut(Uo);
 export {
-  $r as default,
-  $r as render
+  Uo as default,
+  Uo as render
 };