@progress/kendo-react-orgchart 7.2.4-develop.3 → 7.3.0-develop.1

package/index.mjs

@@ -1,1149 +1,20 @@
-/**-----------------------------------------------------------------------------------------
-* Copyright © 2024 Progress Software Corporation. All rights reserved.
-* Licensed under commercial license. See LICENSE.md in the package root for more information
-*-------------------------------------------------------------------------------------------*/
+/**
+ * @license
+ *-------------------------------------------------------------------------------------------
+ * Copyright © 2024 Progress Software Corporation. All rights reserved.
+ * Licensed under commercial license. See LICENSE.md in the package root for more information
+ *-------------------------------------------------------------------------------------------
+ */
 "use client";
-import * as l from "react";
-import { Navigation as ue, classNames as _, kendoThemeMaps as te, useId as je, validatePackage as qe, isArray as ce, resolveItemsIds as Ve, updateItem as Xe, getNestedValue as ve } from "@progress/kendo-react-common";
-import { Card as Ze, CardBody as Je, Avatar as Qe, CardTitle as Ye, CardSubtitle as et } from "@progress/kendo-react-layout";
-import { Button as tt } from "@progress/kendo-react-buttons";
-import { minusIcon as nt, plusIcon as it } from "@progress/kendo-svg-icons";
-import h from "prop-types";
-import { groupBy as ot } from "@progress/kendo-data-query";
-const me = (s) => window.getComputedStyle(s).backgroundColor, st = (s) => s.toLowerCase().charCodeAt(0) - "a".charCodeAt(0), rt = (s) => {
-  const t = s.match(/series-([a-z])$/);
-  if (t !== null)
-    return st(t[1]);
-  const o = s.split("--series-")[1];
-  return parseInt(o, 10) - 1;
-}, at = 30, lt = () => {
-  let s = `
-      <div class="k-var--series-a"></div>
-      <div class="k-var--series-b"></div>
-      <div class="k-var--series-c"></div>
-      <div class="k-var--series-d"></div>
-      <div class="k-var--series-e"></div>
-      <div class="k-var--series-f"></div>
-`;
-  for (let t = 0; t < at; t++)
-    s += `
-      <div class="k-var--series-${t + 1}"></div>`;
-  return s;
-}, ct = `
-    <div class="k-var--series-unset"></div>
-    <div class="k-var--series">
-      ${lt()}
-    </div>
-`;
-class dt {
-  getSeriesColors() {
-    const t = this.element, o = [].slice.call(t.querySelectorAll(".k-var--series div")), i = me(t.querySelector(".k-var--series-unset"));
-    return o.reduce(
-      (n, r) => {
-        const a = rt(r.className), c = me(r);
-        return c !== i && (n[a] = c), n;
-      },
-      []
-      // Will populate the series colors in this array
-    );
-  }
-}
-const ht = (s, t) => {
-  const o = new dt(), i = o.element = t.createElement("div");
-  i.style.display = "none", i.innerHTML = ct, t.body.appendChild(i);
-  let e;
-  try {
-    e = o.getSeriesColors();
-  } finally {
-    t.body.removeChild(o.element), delete o.element, s(e);
-  }
-}, ut = "expanded", mt = "items", gt = "selected", pe = "checked", ft = "checkIndeterminate", vt = "k-orgchart", q = 80, Ce = 300, T = 25, R = 40, ne = 20, ie = 20, ke = 82, Y = l.createContext({
-  cardColors: void 0,
-  onExpandChange: void 0,
-  onKeyDown: void 0,
-  onItemAction: void 0,
-  onItemContextMenu: void 0,
-  onItemDoubleClick: void 0,
-  onGroupAction: void 0,
-  onGroupBlur: void 0,
-  onGroupFocus: void 0
-}), de = (s) => {
-  const t = {
-    tabIndex: 0,
-    navigatable: !0,
-    expandField: "expanded",
-    ariaLabel: "Org Chart",
-    idField: "id",
-    childrenField: "items",
-    avatarField: "avatar",
-    titleField: "title",
-    subtitleField: "subtitle",
-    ...s
-  }, {
-    navigatable: o,
-    id: i,
-    tabIndex: e,
-    className: n,
-    style: r,
-    data: a,
-    groupField: c,
-    cardWidth: m,
-    cardHeight: d,
-    groupTitleHeight: g,
-    groupSubtitleHeight: f,
-    verticalLine: u,
-    idField: k,
-    childrenField: b,
-    expandField: I,
-    hasChildrenField: H,
-    avatarField: D,
-    titleField: E,
-    subtitleField: G,
-    onExpandChange: y,
-    onItemAction: x,
-    onItemDoubleClick: B,
-    onItemContextMenu: O,
-    onKeyDown: z,
-    onGroupAction: C,
-    onGroupBlur: L,
-    onGroupFocus: W,
-    cardsColors: $,
-    ariaLabel: V,
-    itemRender: U,
-    groupTitleRender: X,
-    groupSubtitleRender: A,
-    height: ee,
-    children: j,
-    ...oe
-  } = t, Z = l.useRef(null), w = l.useRef(new ue({
-    tabIndex: e,
-    root: Z,
-    selectors: [t.groupField ? ".k-orgchart-node-group-container" : ".k-orgchart-card"],
-    focusOptions: {}
-  })), [se, Te] = l.useState([]), P = l.useRef(null), Ae = (v, p, N) => {
-    N.preventDefault(), p.focusNext(v);
-  }, He = (v, p, N) => {
-    N.preventDefault(), p.focusPrevious(v);
-  }, Se = (v, p, N, F) => {
-    var M;
-    if (N.preventDefault(), (t.groupField ? F.items.some((J) => J[t.expandField]) : F.item[t.expandField]) && t.onExpandChange)
-      t.onExpandChange.call(void 0, F);
-    else {
-      const J = ".k-orgchart-group", re = (M = v.closest(J)) == null ? void 0 : M.getAttribute("id"), Q = document.querySelector(`[aria-owns="${re}"]`);
-      Q ? p.focusElement(Q, v) : p.focusPrevious(v);
-    }
-  }, De = (v, p, N, F) => {
-    var Q;
-    N.preventDefault();
-    const S = t.groupField ? F.items.some((K) => K[t.expandField]) : F.item[t.expandField], M = t.groupField ? F.items.find((K) => K[t.childrenField]) : F.item[t.childrenField], J = t.groupField ? F.items.some((K) => t.hasChildrenField && K[t.hasChildrenField]) : t.hasChildrenField && F.item[t.hasChildrenField], re = t.groupField ? M && M[t.childrenField] && M[t.childrenField].length : M && M.length;
-    if ((J || re) && !S && t.onExpandChange)
-      t.onExpandChange.call(void 0, F);
-    else {
-      const K = t.groupField ? ".k-orgchart-node-group-container" : ".k-orgchart-card", Ue = v.getAttribute("aria-owns"), he = (Q = document.getElementById(Ue)) == null ? void 0 : Q.querySelector(K);
-      he ? p.focusElement(he, v) : p.focusNext(v);
-    }
-  }, Oe = (v, p, N) => {
-    N.preventDefault(), p.focusElement(p.first, null);
-  }, Re = (v, p, N) => {
-    N.preventDefault(), p.focusElement(p.last, null);
-  }, Ge = (v, p, N, F) => {
-    N.stopPropagation();
-    const S = v.className.indexOf("k-orgchart-node-group-container") !== -1;
-    if (s.groupField && S) {
-      P.current && P.current.first && P.current.focusElement(P.current.first, null);
-      return;
-    }
-    t.onItemAction && t.onItemAction({
-      event: N,
-      item: F.item
-    });
-  }, We = (v) => {
-    if (s.groupField) {
-      const p = v.closest(".k-orgchart-node-group-container");
-      p && w.current.focusElement(p, null);
-    }
-  };
-  l.useEffect(() => {
-    if (o && w.current.first && w.current.first.setAttribute("tabindex", String(e)), !$) {
-      const v = Z.current.ownerDocument || document;
-      ht((p) => {
-        Te(p);
-      }, v);
-    }
-  }, [o, e]);
-  const _e = (v) => {
-    if (t.navigatable) {
-      const p = v.event, N = p.key === " " ? "Space" : p.key, F = s.groupField && p.target.className.indexOf("k-orgchart-card") !== -1 && P.current || w.current, S = p.target.closest(F.selectors.join(","));
-      switch (N) {
-        case "ArrowUp":
-          Se(S, F, p, v);
-          break;
-        case "ArrowDown":
-          De(S, F, p, v);
-          break;
-        case "ArrowLeft":
-          He(S, F, p);
-          break;
-        case "ArrowRight":
-          Ae(S, F, p);
-          break;
-        case "End":
-          Re(S, F, p);
-          break;
-        case "Home":
-          Oe(S, F, p);
-          break;
-        case "Enter":
-          Ge(S, F, p, v);
-          break;
-        case "Escape":
-          We(S);
-          break;
-      }
-    }
-  }, Me = (v) => {
-    if (v.event.stopPropagation(), x && x.call(void 0, v), t.navigatable) {
-      const p = v.event.target.closest(".k-orgchart-card");
-      p && w.current.focusElement(p, null);
-    }
-  }, Pe = (v) => {
-    v.event.stopPropagation(), x && x.call(void 0, v);
-  }, Ke = (v) => {
-    v.event.stopPropagation(), x && x.call(void 0, v);
-  }, Be = (v) => {
-    if (C && C.call(void 0, v), t.navigatable) {
-      const p = v.event.target.closest(".k-orgchart-node-group-container");
-      p && w.current.focusElement(p, null);
-    }
-  }, ze = (v) => {
-    P.current = null;
-  }, $e = (v) => {
-    P.current = new ue({
-      tabIndex: 0,
-      root: v.containerRef,
-      selectors: [".k-orgchart-card"],
-      focusOptions: {}
-    });
-  };
-  return /* @__PURE__ */ l.createElement(
-    "div",
-    {
-      style: r,
-      ref: Z,
-      className: _(
-        n,
-        vt
-      )
-    },
-    /* @__PURE__ */ l.createElement(Y.Provider, { value: {
-      cardColors: $ || se,
-      onExpandChange: s.onExpandChange,
-      onKeyDown: _e,
-      onItemAction: Me,
-      onItemDoubleClick: Ke,
-      onItemContextMenu: Pe,
-      onGroupAction: Be,
-      onGroupBlur: ze,
-      onGroupFocus: $e
-    }, ...oe }, s.children)
-  );
-};
-de.propTypes = {
-  className: h.string,
-  style: h.object,
-  id: h.string,
-  ariaLabel: h.string,
-  idField: h.string,
-  childrenField: h.string,
-  expandField: h.string,
-  titleField: h.string,
-  hasChildrenField: h.string,
-  subtitleField: h.string,
-  avatarField: h.string,
-  cardsColors: h.array,
-  data: h.array,
-  groupField: h.string,
-  cardHeight: h.number,
-  cardWidth: h.number,
-  groupTitleHeight: h.number,
-  groupSubtitleHeight: h.number,
-  verticalLine: h.number,
-  height: h.oneOfType([h.string, h.number]),
-  onExpandChange: h.func,
-  onItemAction: h.func,
-  onItemDoubleClick: h.func,
-  onItemContextMenu: h.func,
-  onGroupAction: h.func
-};
-de.displayName = "KendoClientOrgChart";
-const Ee = (s) => {
-  const { expanded: t, node: o, nodes: i } = s, e = l.useContext(Y), n = (r) => {
-    e.onExpandChange && e.onExpandChange.call(void 0, {
-      event: r,
-      expand: !t,
-      item: o,
-      items: i
-    });
-  };
-  return /* @__PURE__ */ l.createElement(
-    tt,
-    {
-      className: "k-orgchart-button",
-      icon: t ? "minus" : "plus",
-      tabIndex: -1,
-      svgIcon: t ? nt : it,
-      "aria-label": t ? "collapse" : "expand",
-      onClick: n
-    }
-  );
-}, pt = (s) => {
-  const { node: t, children: o, style: i, ...e } = s, [n, r] = l.useState(!1), a = l.useContext(Y), c = (f) => {
-    a.onKeyDown && a.onKeyDown.call(void 0, {
-      event: f,
-      item: t
-    });
-  }, m = (f) => {
-    a.onItemAction && a.onItemAction.call(void 0, {
-      event: f,
-      item: t
-    });
-  }, d = (f) => {
-    a.onItemContextMenu && a.onItemContextMenu.call(void 0, {
-      event: f,
-      item: t
-    });
-  }, g = (f) => {
-    a.onItemDoubleClick && a.onItemDoubleClick.call(void 0, {
-      event: f,
-      item: t
-    });
-  };
-  return /* @__PURE__ */ l.createElement(
-    Ze,
-    {
-      role: "treeitem",
-      className: _(
-        "k-orgchart-card",
-        { "k-focus": n }
-      ),
-      onClick: m,
-      onKeyDown: c,
-      onContextMenu: d,
-      onDoubleClick: g,
-      style: i,
-      "aria-selected": n,
-      "aria-keyshortcuts": "Enter",
-      onFocus: () => r(!0),
-      onBlur: () => r(!1),
-      ...e
-    },
-    o
-  );
-}, Ct = (s) => {
-  const { level: t, children: o } = s, i = l.useContext(Y), e = i.cardColors && i.cardColors[t] || "green";
-  return /* @__PURE__ */ l.createElement(Je, { className: "k-hstack", style: { borderTopColor: e } }, o);
-}, kt = "k-orgchart-node", xe = (s) => {
-  const t = {
-    avatarType: "image"
-  }, {
-    id: o,
-    title: i,
-    subtitle: e,
-    level: n,
-    childLineWidth: r,
-    cardWidth: a,
-    cardHeight: c,
-    verticalLine: m,
-    color: d,
-    line: g,
-    plus: f,
-    expanded: u,
-    node: k,
-    avatar: b,
-    avatarType: I,
-    itemRender: H,
-    ...D
-  } = { ...s, ...t }, E = H;
-  return /* @__PURE__ */ l.createElement(
-    "div",
-    {
-      ...D,
-      className: _(
-        s.className,
-        kt,
-        "k-vstack",
-        "k-align-items-center"
-      )
-    },
-    n !== 0 && /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        className: "k-orgchart-line k-orgchart-line-v k-orgchart-line-v-top",
-        style: { height: m }
-      }
-    ),
-    /* @__PURE__ */ l.createElement(
-      pt,
-      {
-        node: k,
-        style: { width: a, height: c },
-        "aria-level": n + 1,
-        "aria-expanded": !!u,
-        "aria-owns": o
-      },
-      /* @__PURE__ */ l.createElement(Ct, { level: n }, E ? /* @__PURE__ */ l.createElement(
-        E,
-        {
-          item: k,
-          title: i,
-          subtitle: e,
-          level: n,
-          expanded: u,
-          color: d
-        }
-      ) : /* @__PURE__ */ l.createElement(l.Fragment, null, /* @__PURE__ */ l.createElement(Qe, { type: I, themeColor: "secondary" }, I === "image" ? /* @__PURE__ */ l.createElement(
-        "img",
-        {
-          src: b,
-          alt: "KendoReact Avatar Customer Image"
-        }
-      ) : b), /* @__PURE__ */ l.createElement("div", { className: "k-card-title-wrap k-vstack" }, /* @__PURE__ */ l.createElement(Ye, { className: "k-text-ellipsis" }, i), /* @__PURE__ */ l.createElement("span", { className: "k-spacer" }), /* @__PURE__ */ l.createElement(et, { className: "k-text-ellipsis" }, e)), /* @__PURE__ */ l.createElement("span", { className: "k-spacer" })))
-    ),
-    g && /* @__PURE__ */ l.createElement("div", { className: "k-orgchart-line k-orgchart-line-v" }),
-    f && /* @__PURE__ */ l.createElement(Ee, { expanded: u, node: k }),
-    f && !!r && /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        className: "k-orgchart-line k-orgchart-line-h",
-        style: { width: r, marginTop: -15 }
-      }
-    )
-  );
-}, be = ({
-  dataByGroups: s,
-  data: t = [],
-  cardWidth: o,
-  childrenField: i,
-  idField: e,
-  expandField: n,
-  hasChildrenField: r,
-  groupField: a,
-  level: c = 1,
-  parentId: m = 0
-}) => {
-  t.forEach((d) => {
-    const g = d[i];
-    if (d[n] && g && g.length) {
-      const u = g.some((I) => I[i] && I[i].length || r && I[r]), k = u ? "horizontal" : "vertical", b = u ? null : o;
-      s.push({
-        ids: [d[e]],
-        items: g,
-        level: c,
-        parentId: m,
-        hasChildren: u,
-        orientation: k,
-        width: b
-      }), be({
-        dataByGroups: s,
-        data: d[i],
-        childrenField: i,
-        cardWidth: o,
-        idField: e,
-        expandField: n,
-        hasChildrenField: r,
-        groupField: a,
-        level: c + 1,
-        parentId: d[e]
-      });
-    }
-  });
-}, Et = (s, t) => {
-  const o = t || Ce, i = s.sort((e, n) => n.level - e.level);
-  i.forEach((e) => {
-    if (!e.width) {
-      const n = i.filter((m) => e.ids.includes(m.parentId)), r = n.length ? Math.max(...n.map((m) => m.width || 0)) : o, a = e.orientation === "horizontal" ? e.items.length : 1, c = r * a + T * (a - 1);
-      e.width = c;
-    }
-  });
-}, xt = (s, t, o) => {
-  const i = s.sort((e, n) => e.level - n.level);
-  i.forEach((e) => {
-    if (e.level === 0)
-      return;
-    const n = i.find((u) => u.ids.includes(e.parentId)), r = (n == null ? void 0 : n.items.findIndex((u) => e.ids.includes(u[o]))) || 0, a = (n == null ? void 0 : n.items) || [], c = n.width ? (n.width - (a.length - 1) * T) / a.length : 0;
-    if (!e.left) {
-      let u = (n == null ? void 0 : n.left) || 0;
-      a.forEach((k, b) => {
-        b < r && (u += c + T);
-      }), e.left = u;
-    }
-    const m = (n == null ? void 0 : n.width) || 0, d = (n == null ? void 0 : n.items.length) || 1, g = (m - (d - 1) * T) / d;
-    e.width = g;
-    const f = n == null ? void 0 : n.items.map((u) => {
-      const k = u[t] ? u[t].length : 0, b = i.find((H) => H.ids.includes(u[o])), I = (b == null ? void 0 : b.width) || 0;
-      return (b == null ? void 0 : b.orientation) === "vertical" || k === 0 || !u.expanded ? 0 : I - (I - (k - 1) * T) / k;
-    });
-    n && (n.childLineWidths = f);
-  });
-}, bt = (s, t, o) => {
-  const i = t || q, e = o || R;
-  s.forEach((n) => {
-    const r = n.level, a = (i + e) * r + R * (r ? r - 1 : 0) - (e - R) * (r ? 1 : 0);
-    n.top = a;
-  });
-}, It = (s, t, o) => {
-  const i = t || q, e = o || R;
-  return Math.max(...s.map((r) => {
-    const a = r.top || 0, c = r.items.length, m = r.orientation === "horizontal" ? i + e + e : c * (i + e);
-    return a + m;
-  }));
-}, Ie = (s) => {
-  const t = {
-    width: "100%",
-    data: [],
-    ariaLabel: "Org Chart",
-    idField: "id",
-    childrenField: "items",
-    avatarField: "avatar",
-    titleField: "title",
-    subtitleField: "subtitle",
-    expandField: "expanded"
-  }, {
-    id: o,
-    width: i,
-    data: e,
-    groupField: n,
-    cardWidth: r,
-    cardHeight: a,
-    verticalLine: c,
-    idField: m,
-    childrenField: d,
-    hasChildrenField: g,
-    expandField: f,
-    avatarField: u,
-    titleField: k,
-    subtitleField: b,
-    ariaLabel: I,
-    itemRender: H,
-    height: D
-  } = { ...t, ...s }, E = [{
-    items: e,
-    level: 0,
-    hasChildren: !0,
-    orientation: "horizontal",
-    ids: [0],
-    parentId: null,
-    width: null
-  }];
-  be({
-    dataByGroups: E,
-    data: e,
-    cardWidth: r,
-    expandField: f,
-    hasChildrenField: g,
-    childrenField: d,
-    idField: m,
-    groupField: n
-  }), Et(E, r), xt(E, d, m), bt(E, a, c);
-  const G = It(E, a, c);
-  return /* @__PURE__ */ l.createElement("div", { className: "k-orgchart-container", style: { width: i, height: D || G } }, E.map((y) => {
-    const x = y.level, B = y.items, O = x === 0 ? "center" : "around", z = y.orientation;
-    return /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        role: x === 0 ? "tree" : "group",
-        id: o + "-" + x + "-" + y.ids[0],
-        "aria-label": x === 0 ? I : void 0,
-        "aria-orientation": x === 0 ? z : void 0,
-        key: y.ids[0] + "_" + x,
-        className: _(
-          "k-orgchart-group",
-          `k-orgchart-level-${x}`,
-          "k-pos-absolute",
-          {
-            [`k-${te.orientationMap[z]}`]: z,
-            [`k-justify-content-${O}`]: O
-          }
-        ),
-        style: {
-          width: y.width || "100%",
-          left: y.left,
-          top: y.top
-        }
-      },
-      B.length > 0 && /* @__PURE__ */ l.createElement(
-        "div",
-        {
-          role: "group",
-          style: { width: "100%" },
-          className: _(
-            "k-orgchart-node-container",
-            "k-justify-content-around",
-            {
-              [`k-${te.orientationMap[y.orientation]}`]: y.orientation
-            }
-          )
-        },
-        B.map((C, L) => {
-          const W = C[d] && C[d].length || g && C[g], $ = W || y.orientation === "vertical" && L !== B.length - 1, V = y.orientation === "vertical" && L !== 0 ? 0 : c || R, U = y.childLineWidths ? Math.max(...y.childLineWidths) : void 0, X = C[f];
-          return /* @__PURE__ */ l.createElement(
-            xe,
-            {
-              id: o + "-" + (x + 1) + "-" + C[m],
-              style: { width: U },
-              itemRender: H,
-              cardHeight: a,
-              cardWidth: r,
-              verticalLine: V,
-              key: L,
-              level: x,
-              avatar: C[u],
-              title: C[k],
-              subtitle: C[b],
-              line: $,
-              expanded: X,
-              node: C,
-              childLineWidth: W && X && y.orientation === "horizontal" ? y.childLineWidths[L] : 0,
-              plus: W
-            },
-            C.text
-          );
-        })
-      )
-    );
-  }));
-};
-Ie.displayName = "KendoServerOrgChart";
-const yt = {
-  name: "@progress/kendo-react-orgchart",
-  productName: "KendoReact",
-  productCodes: ["KENDOUIREACT", "KENDOUICOMPLETE"],
-  publishDate: 1709632292,
-  version: "",
-  licensingDocsUrl: "https://www.telerik.com/kendo-react-ui/my-license/?utm_medium=product&utm_source=kendoreact&utm_campaign=kendo-ui-react-purchase-license-keys-warning"
-}, Ft = (s) => {
-  const { nodes: t, children: o, style: i, ...e } = s, [n, r] = l.useState(!1), a = l.useContext(Y), c = l.useRef(null), m = (u) => {
-    a.onKeyDown && a.onKeyDown({
-      event: u,
-      items: t
-    });
-  }, d = (u) => {
-    a.onGroupAction && a.onGroupAction({
-      event: u,
-      items: t
-    });
-  }, g = (u) => {
-    r(!0), a.onGroupFocus && a.onGroupFocus({
-      event: u,
-      items: t,
-      containerRef: c
-    });
-  }, f = (u) => {
-    r(!1), a.onGroupBlur && a.onGroupBlur({
-      event: u,
-      items: t
-    });
-  };
-  return /* @__PURE__ */ l.createElement(
-    "div",
-    {
-      role: "treeitem",
-      "aria-selected": n,
-      ref: c,
-      className: _(
-        "k-orgchart-node-group-container",
-        "k-vstack",
-        { "k-focus": n }
-      ),
-      style: i,
-      onKeyDown: m,
-      onClick: d,
-      onFocus: g,
-      onBlur: f,
-      ...e
-    },
-    o
-  );
-}, wt = "k-orgchart-node-group", ge = "k-orgchart-node-group-title", fe = "k-orgchart-node-group-subtitle", Lt = (s) => {
-  const t = {
-    orientation: "horizontal"
-  }, {
-    id: o,
-    title: i,
-    subtitle: e,
-    line: n,
-    plus: r,
-    focus: a,
-    level: c,
-    verticalLine: m,
-    childLineWidth: d,
-    orientation: g,
-    expanded: f,
-    nodes: u,
-    groupTitleHeight: k,
-    groupSubtitleHeight: b,
-    groupTitleRender: I,
-    groupSubtitleRender: H,
-    ...D
-  } = { ...t, ...s }, E = I, G = H, y = { height: k || ne }, x = { height: b || ie };
-  return /* @__PURE__ */ l.createElement(
-    "div",
-    {
-      ...D,
-      className: _(
-        s.className,
-        wt,
-        "k-vstack",
-        "k-align-items-center"
-      )
-    },
-    c !== 0 && /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        className: "k-orgchart-line k-orgchart-line-v k-orgchart-line-v-top",
-        style: { height: m }
-      }
-    ),
-    /* @__PURE__ */ l.createElement(
-      Ft,
-      {
-        nodes: u,
-        "aria-expanded": !!f,
-        "aria-keyshortcuts": "Enter",
-        "aria-level": c + 1,
-        "aria-owns": o
-      },
-      E ? /* @__PURE__ */ l.createElement(
-        E,
-        {
-          style: y,
-          className: ge,
-          title: i,
-          items: u,
-          level: c,
-          expanded: f
-        }
-      ) : /* @__PURE__ */ l.createElement("div", { className: ge, style: y }, i),
-      G ? /* @__PURE__ */ l.createElement(
-        G,
-        {
-          style: x,
-          className: fe,
-          subtitle: e,
-          items: u,
-          level: c,
-          expanded: f
-        }
-      ) : /* @__PURE__ */ l.createElement("div", { className: fe, style: x }, e),
-      /* @__PURE__ */ l.createElement(
-        "div",
-        {
-          role: "group",
-          style: { width: "100%" },
-          className: _(
-            "k-orgchart-node-container",
-            "k-justify-content-around",
-            {
-              [`k-${te.orientationMap[g] || g}`]: g
-            }
-          )
-        },
-        s.children
-      )
-    ),
-    n && /* @__PURE__ */ l.createElement("div", { className: "k-orgchart-line k-orgchart-line-v" }),
-    r && /* @__PURE__ */ l.createElement(Ee, { expanded: f, nodes: u }),
-    r && !!d && /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        className: "k-orgchart-line k-orgchart-line-h",
-        style: { width: d, marginTop: -15 }
-      }
-    )
-  );
-}, ye = ({
-  dataByGroups: s,
-  data: t = [],
-  cardWidth: o,
-  childrenField: i,
-  idField: e,
-  expandField: n,
-  hasChildrenField: r,
-  groupField: a,
-  level: c = 1,
-  parentId: m = 0
-}) => {
-  t.forEach((d) => {
-    const g = d[i];
-    if (d[n] && g && g.length) {
-      const u = g.some((E) => E[i] && E[i].length || r && E[r]), k = u ? "horizontal" : "vertical", b = u ? null : o + 2 * T, I = s.find((E) => E.parentId === m), H = s.find((E) => E.ids.includes(m));
-      let D = !1;
-      if (I) {
-        const E = I.ids[0], G = H.items.find((x) => x[e] === E), y = H.items.find((x) => x[e] === d[e]);
-        D = G[a] === y[a];
-      }
-      I && D ? (I.ids.push(d[e]), I.items = I.items.concat(g)) : s.push({
-        ids: [d[e]],
-        items: g,
-        level: c,
-        parentId: m,
-        hasChildren: u,
-        orientation: k,
-        width: b
-      }), ye({
-        dataByGroups: s,
-        data: d[i],
-        childrenField: i,
-        cardWidth: o,
-        idField: e,
-        expandField: n,
-        hasChildrenField: r,
-        groupField: a,
-        level: c + 1,
-        parentId: d[e]
-      });
-    }
-  });
-}, Nt = (s, t) => {
-  const o = t || Ce, i = s.sort((e, n) => n.level - e.level);
-  i.forEach((e) => {
-    if (!e.width) {
-      const n = i.filter((r) => e.ids.includes(r.parentId));
-      if (n.length) {
-        const r = Math.max(...n.map((d) => d.width || 0)), a = Math.max(...n.map((d) => d.groupedItems.length || 0)), c = Math.max(...e.groupedItems.map((d) => {
-          const g = e.orientation === "horizontal" ? d.items.length : 1;
-          return g * (o + 2 * T) + T * (g - 1);
-        })), m = r * a + T * (a - 1);
-        e.width = Math.max(m, c);
-      } else {
-        const r = Math.max(...e.groupedItems.map((a) => {
-          const c = e.orientation === "horizontal" ? a.items.length : 1;
-          return c * (o + 2 * T) + T * (c - 1);
-        }));
-        e.width = r;
-      }
-    }
-  });
-}, Tt = (s, t) => {
-  const o = s.sort((i, e) => i.level - e.level);
-  o.forEach((i) => {
-    var g;
-    if (i.level === 0)
-      return;
-    const e = o.find((f) => f.ids.includes(i.parentId)), n = (e == null ? void 0 : e.groupedItems.findIndex((f) => f.items.some((u) => i.ids.includes(u[t])))) || 0, r = (e == null ? void 0 : e.groupedItems) || [], a = e.width ? (e.width - (r.length - 1) * T) / r.length : 0;
-    if (!i.left) {
-      let f = (e == null ? void 0 : e.left) || 0;
-      r.forEach((u, k) => {
-        k < n && (f += a + T);
-      }), i.left = f;
-    }
-    const c = (e == null ? void 0 : e.width) || 0, m = (e == null ? void 0 : e.groupedItems.length) || 1, d = (c - (m - 1) * T) / m;
-    if (i.width = d, e) {
-      const f = i.width - (i.width - (i.groupedItems.length - 1) * T) / i.groupedItems.length;
-      e.childLineWidths ? (g = e.childLineWidths) == null || g.push(f) : e.childLineWidths = [f];
-    }
-  });
-}, At = (s, t, o, i, e) => {
-  const n = t || q, r = e || R, a = o + i + ke;
-  s.forEach((c) => {
-    const m = c.level, d = (n + r + a) * m + R * (m ? m - 1 : 0) - (r - R) * (m ? 1 : 0);
-    c.top = d;
-  });
-}, Ht = (s, t, o, i, e) => {
-  const n = t || q, r = o || R, c = (i || ne) + (e || ie) + ke;
-  return Math.max(...s.map((d) => {
-    const g = d.top || 0, f = Math.max(...d.groupedItems.map((b) => b.items.length)), u = d.hasChildren ? R : 0, k = d.orientation === "horizontal" ? n + r + c + r + u : f * (n + r) + c + r;
-    return g + k;
-  }));
-}, Fe = (s) => {
-  const t = {
-    width: "100%",
-    data: [],
-    ariaLabel: "Org Chart",
-    idField: "id",
-    childrenField: "items",
-    avatarField: "avatar",
-    titleField: "title",
-    subtitleField: "subtitle",
-    expandField: "expanded",
-    orientation: "horizontal"
-  }, {
-    id: o,
-    width: i,
-    data: e,
-    groupField: n,
-    cardWidth: r,
-    cardHeight: a,
-    groupTitleHeight: c,
-    groupSubtitleHeight: m,
-    verticalLine: d,
-    idField: g,
-    childrenField: f,
-    expandField: u,
-    hasChildrenField: k,
-    avatarField: b,
-    titleField: I,
-    subtitleField: H,
-    cardsColors: D,
-    ariaLabel: E,
-    itemRender: G,
-    groupTitleRender: y,
-    groupSubtitleRender: x,
-    height: B
-  } = { ...t, ...s }, O = [{
-    items: e,
-    level: 0,
-    hasChildren: !0,
-    orientation: "horizontal",
-    ids: [0],
-    parentId: null,
-    width: null
-  }];
-  ye({
-    dataByGroups: O,
-    data: e,
-    cardWidth: r,
-    expandField: u,
-    hasChildrenField: k,
-    childrenField: f,
-    idField: g,
-    groupField: n
-  }), O.map((C) => {
-    C.groupedItems = ot(C.items, [{ field: n }]);
-  }), Nt(O, r), Tt(O, g), At(
-    O,
-    a || q,
-    c || ne,
-    m || ie,
-    d
-  );
-  const z = Ht(
-    O,
-    a || q,
-    c || ne,
-    m || ie
-  );
-  return /* @__PURE__ */ l.createElement("div", { className: "k-orgchart-container", style: { width: i, height: B || z } }, O.map((C) => {
-    const L = C.level, W = C.groupedItems.map((A) => {
-      const ee = A.items.some((j) => j[u]);
-      return {
-        ...A,
-        expanded: ee
-      };
-    }), $ = W.filter((A) => A.expanded), V = L === 0 ? "center" : "around", U = "horizontal", X = D && D[L] || "green";
-    return /* @__PURE__ */ l.createElement(
-      "div",
-      {
-        role: L === 0 ? "tree" : "group",
-        id: o + "-" + L + "-" + C.ids[0],
-        "aria-label": L === 0 ? E : void 0,
-        "aria-orientation": L === 0 ? U : void 0,
-        key: C.ids[0] + "_" + L,
-        className: _(
-          "k-orgchart-group",
-          `k-orgchart-level-${L}`,
-          "k-pos-absolute",
-          {
-            [`k-${te.orientationMap[U]}`]: U,
-            [`k-justify-content-${V}`]: V,
-            "k-orgchart-group-h": s.groupField
-          }
-        ),
-        style: {
-          width: C.width || "100%",
-          left: C.left,
-          top: C.top
-        }
-      },
-      e.length > 0 && W.map((A, ee) => {
-        const j = A.items.some((w) => w[f] && w[f].length || k && w[k]), oe = C.width ? (C.width - (W.length - 1) * T) / W.length : void 0, Z = $.findIndex((w) => w === A);
-        return /* @__PURE__ */ l.createElement(
-          Lt,
-          {
-            id: o + "-" + (L + 1) + "-" + A.items[0][g],
-            style: { width: oe },
-            groupTitleHeight: c,
-            groupSubtitleHeight: m,
-            groupTitleRender: y,
-            groupSubtitleRender: x,
-            key: ee,
-            level: L,
-            verticalLine: d || R,
-            title: A.items[0][n || I],
-            subtitle: n,
-            orientation: C.orientation,
-            childLineWidth: j && A.expanded && C.orientation === "horizontal" ? C.childLineWidths[Z] : 0,
-            line: j,
-            nodes: A.items,
-            expanded: A.expanded,
-            plus: j
-          },
-          A.items.map((w, se) => /* @__PURE__ */ l.createElement(
-            xe,
-            {
-              cardHeight: a,
-              cardWidth: r,
-              itemRender: G,
-              color: X,
-              key: se,
-              level: L,
-              avatar: w[b],
-              title: w[I],
-              subtitle: w[H],
-              verticalLine: 0,
-              line: !1,
-              node: w,
-              childLineWidth: 0,
-              plus: !1
-            },
-            w.text
-          ))
-        );
-      })
-    );
-  }));
-};
-Fe.displayName = "KendoServerGroupedOrgChart";
-const we = (s) => {
-  const t = {
-    tabIndex: 0,
-    navigatable: !0,
-    expandField: "expanded",
-    ariaLabel: "Org Chart",
-    idField: "id",
-    childrenField: "items",
-    avatarField: "avatar",
-    titleField: "title",
-    subtitleField: "subtitle",
-    ...s
-  }, {
-    cardsColors: o,
-    onExpandChange: i,
-    onKeyDown: e,
-    onItemAction: n,
-    onGroupAction: r,
-    onGroupBlur: a,
-    onGroupFocus: c,
-    id: m,
-    ...d
-  } = t, g = l.useRef(je());
-  return qe(yt), /* @__PURE__ */ l.createElement(de, { ...t }, s.groupField ? /* @__PURE__ */ l.createElement(
-    Fe,
-    {
-      id: m || g.current,
-      ...d
-    },
-    s.children
-  ) : /* @__PURE__ */ l.createElement(
-    Ie,
-    {
-      id: m || g.current,
-      ...d
-    },
-    s.children
-  ));
-};
-we.propTypes = {
-  className: h.string,
-  style: h.object,
-  id: h.string,
-  ariaLabel: h.string,
-  idField: h.string,
-  childrenField: h.string,
-  expandField: h.string,
-  titleField: h.string,
-  hasChildrenField: h.string,
-  subtitleField: h.string,
-  avatarField: h.string,
-  cardsColors: h.array,
-  data: h.array,
-  groupField: h.string,
-  cardHeight: h.number,
-  cardWidth: h.number,
-  groupTitleHeight: h.number,
-  groupSubtitleHeight: h.number,
-  verticalLine: h.number,
-  height: h.oneOfType([h.string, h.number]),
-  onExpandChange: h.func,
-  onItemAction: h.func,
-  onGroupAction: h.func
-};
-we.displayName = "KendoOrgChart";
-function Pt(s, t) {
-  if (!s || !s.length)
-    return [];
-  let o = s;
-  const i = t.cloneField || "cloned", e = t.expandField || ut, n = t.selectField || gt, r = t.checkField || pe, a = t.childrenField || mt;
-  return o = ae(o, e, t.expand, i, a), o = ae(o, n, t.select, i, a), o = ae(o, r, t.check, i, a), Dt(o, a, t.check), o;
-}
-function ae(s, t, o, i, e) {
-  if (o) {
-    const { ids: n, field: r } = Le(o, t), a = !ce(o) && o.idField ? Ve(n, o.idField, s, e) : n;
-    return St(s, a, r, i, e);
-  } else
-    return s;
-}
-function Le(s, t) {
-  let o, i;
-  return ce(s) ? (o = s, i = t) : (o = s.ids || [], i = s.operationField || t), { ids: o, field: i };
-}
-function St(s, t, o, i, e) {
-  let n = s;
-  return t.forEach((r) => {
-    n = Xe(n, r, (a) => Ne(o, a), i, e);
-  }), n;
-}
-function Ne(s, t) {
-  const o = (s || "").split(".");
-  let i = t;
-  for (let e = 0; e < o.length; e++) {
-    const n = o[e];
-    if (e === o.length - 1)
-      i[n] = !0;
-    else if (i[n] !== void 0)
-      i[n] = { ...i[n] }, i = i[n];
-    else
-      return;
-  }
-}
-function Dt(s, t, o) {
-  if (o && !ce(o) && o.applyCheckIndeterminate) {
-    const { field: i } = Le(o, pe), e = o.checkIndeterminateField || ft;
-    for (let n = 0; n < s.length; n++) {
-      const r = s[n], a = r[t];
-      a && le(
-        a,
-        ve(i, r) ? [] : [r],
-        t,
-        i,
-        e
-      );
-    }
-  }
-}
-function le(s, t, o, i, e) {
-  let n = !1;
-  for (let r = 0; r < s.length; r++) {
-    const a = s[r];
-    if (ve(i, a)) {
-      if (!n)
-        for (let c = 0; c < t.length; c++)
-          Ne(e, t[c]);
-      n = !0, a[o] && le(a[o], [], o, i, e);
-    } else
-      a[o] && le(
-        a[o],
-        n ? [a] : t.concat([a]),
-        o,
-        i,
-        e
-      );
-  }
-}
+import { ServerOrgChart as o } from "./server/ServerOrgChart.mjs";
+import { OrgChart as p } from "./OrgChart.mjs";
+import { processOrgChartItems as a } from "./processOrgChartItems.mjs";
+import { ServerOrgChartNode as g } from "./server/ServerOrgChartNode.mjs";
+import { ServerOrgChartGroup as x } from "./server/ServerOrgChartGroup.mjs";
 export {
-  we as OrgChart,
-  Ie as ServerOrgChart,
-  Lt as ServerOrgChartGroup,
-  xe as ServerOrgChartNode,
-  Pt as processOrgChartItems
+  p as OrgChart,
+  o as ServerOrgChart,
+  x as ServerOrgChartGroup,
+  g as ServerOrgChartNode,
+  a as processOrgChartItems
 };