@vidispine/vdt-mui 23.3.0-pre.4 → 23.3.0-pre.6

package/dist/es/item/ItemTable/ItemTable.js

@@ -1,101 +1,99 @@
-import { jsxs as k, jsx as c, Fragment as V } from "react/jsx-runtime";
-import { useMemo as D, useState as G } from "react";
-import J from "@mui/material/Table";
-import K from "@mui/material/TableBody";
-import O from "@mui/material/TableRow";
-import Q from "@mui/material/TableCell";
-import "clsx";
-import "@mui/material/styles";
-import { showSlot as U } from "../../_utils/showSlot.js";
+import { jsxs as k, jsx as c, Fragment as D } from "react/jsx-runtime";
+import { useMemo as G, useState as J } from "react";
+import K from "@mui/material/Table";
+import O from "@mui/material/TableBody";
+import Q from "@mui/material/TableRow";
+import U from "@mui/material/TableCell";
 import W from "../ItemTableRow/index.js";
 import X from "./components/ItemTableHead.js";
-const Y = ({
-  rows: n,
+import { showSlot as Y } from "../../_utils/showSlot.js";
+const Z = ({
+  rows: r,
   onCheck: d
-}) => /* @__PURE__ */ c(O, { children: /* @__PURE__ */ c(Q, { colSpan: n.length + (d ? 1 : 0), sx: {
+}) => /* @__PURE__ */ c(Q, { children: /* @__PURE__ */ c(U, { colSpan: r.length + (d ? 1 : 0), sx: {
   borderBottom: "none"
-}, children: "No items found..." }) }), Z = {
-  Root: J,
+}, children: "No items found..." }) }), _ = {
+  Root: K,
   TableHead: X,
-  TableBody: K,
+  TableBody: O,
   TableRow: W
-}, _ = ({
-  itemListType: n,
+}, w = ({
+  itemListType: r,
   rows: d,
   size: C,
-  avatarVariant: w,
-  stickyHeader: R,
+  avatarVariant: R,
+  stickyHeader: x,
   showAvatar: h,
-  onRowClick: x,
+  onRowClick: g,
   checked: m,
   onCheck: l,
   isLoading: i,
-  amountLoading: S,
-  emptySlot: g,
-  components: M,
+  amountLoading: I,
+  emptySlot: M,
+  components: S,
   componentsProps: A
 }) => {
   const {
     Root: B,
     TableHead: H,
-    TableBody: I,
+    TableBody: V,
     TableRow: j
-  } = M, p = [...Array(Math.max(S, 0)).keys()].map((r) => ({
-    key: r
-  })), u = D(() => {
-    var r;
-    return ((r = n == null ? void 0 : n.item) == null ? void 0 : r.map((o) => ({
+  } = S, P = [...Array(Math.max(I, 0)).keys()].map((n) => ({
+    key: n
+  })), u = G(() => {
+    var n;
+    return ((n = r == null ? void 0 : r.item) == null ? void 0 : n.map((o) => ({
       key: o == null ? void 0 : o.id,
       itemType: o
     }))) || [];
-  }, [n]), [P, b] = G([]), e = m === void 0 ? P : m, q = l ? (r, {
+  }, [r]), [q, b] = J([]), e = m === void 0 ? q : m, z = l ? (n, {
     value: o
   }) => {
     const {
       item: a = []
-    } = n || {}, t = o === !0 ? [...e, ...a].filter(
+    } = r || {}, t = o === !0 ? [...e, ...a].filter(
       // Remove duplicates
-      (s, f, F) => f === F.findIndex(({
-        id: N
-      }) => s.id === N)
+      (s, f, N) => f === N.findIndex(({
+        id: p
+      }) => s.id === p)
     ) : e.filter(({
       id: s
     }) => !a.some((f) => f.id === s));
-    m === void 0 && b(() => t), l(r, {
+    m === void 0 && b(() => t), l(n, {
       itemListType: {
         item: t
       }
     });
-  } : void 0, z = l ? (r, {
+  } : void 0, E = l ? (n, {
     value: o,
     itemType: a
   }) => {
     const t = o === !0 ? [...e, a] : e.filter(({
       id: s
     }) => a.id !== s);
-    m === void 0 && b(() => t), l(r, {
+    m === void 0 && b(() => t), l(n, {
       itemListType: {
         item: t
       }
     });
-  } : void 0, v = (e == null ? void 0 : e.length) > 0 && ((n == null ? void 0 : n.item) || []).every((r) => e.some((o) => r.id === o.id)), E = !v && (e == null ? void 0 : e.length) > 0 && ((n == null ? void 0 : n.item) || []).some((r) => e.some((o) => r.id === o.id));
-  return /* @__PURE__ */ k(B, { size: C, stickyHeader: R, ...A.root, children: [
-    /* @__PURE__ */ c(H, { rows: d, isLoading: i, checked: v, showAvatar: h, indeterminate: E, onCheck: q }),
-    /* @__PURE__ */ c(I, { children: /* @__PURE__ */ k(V, { children: [
-      !i && u.length === 0 && U(g, {
+  } : void 0, v = (e == null ? void 0 : e.length) > 0 && ((r == null ? void 0 : r.item) || []).every((n) => e.some((o) => n.id === o.id)), F = !v && (e == null ? void 0 : e.length) > 0 && ((r == null ? void 0 : r.item) || []).some((n) => e.some((o) => n.id === o.id));
+  return /* @__PURE__ */ k(B, { size: C, stickyHeader: x, ...A.root, children: [
+    /* @__PURE__ */ c(H, { rows: d, isLoading: i, checked: v, showAvatar: h, indeterminate: F, onCheck: z }),
+    /* @__PURE__ */ c(V, { children: /* @__PURE__ */ k(D, { children: [
+      !i && u.length === 0 && Y(M, {
         onCheck: l,
         rows: d
       }),
-      (i ? p : u).map(({
-        key: r,
+      (i ? P : u).map(({
+        key: n,
         itemType: o
-      }) => /* @__PURE__ */ c(j, { itemType: o, rows: d, isLoading: i, onClick: x, showAvatar: h, avatarVariant: w, checked: Array.isArray(e) && e.some(({
+      }) => /* @__PURE__ */ c(j, { itemType: o, rows: d, isLoading: i, onClick: g, showAvatar: h, avatarVariant: R, checked: Array.isArray(e) && e.some(({
         id: a
-      }) => a === (o == null ? void 0 : o.id)), onCheck: z }, r))
+      }) => a === (o == null ? void 0 : o.id)), onCheck: E }, n))
     ] }) })
   ] });
 };
-_.defaultProps = {
+w.defaultProps = {
   itemListType: void 0,
   rows: [],
   size: "medium",
@@ -107,10 +105,11 @@ _.defaultProps = {
   amountLoading: 3,
   onCheck: void 0,
   onRowClick: void 0,
-  emptySlot: Y,
-  components: Z,
+  emptySlot: Z,
+  components: _,
   componentsProps: void 0
 };
+const lo = w;
 export {
-  _ as default
+  lo as default
 };

package/dist/es/item/ItemTable/components/ItemTableHead.js

@@ -1,34 +1,35 @@
-import { jsx as r, jsxs as l } from "react/jsx-runtime";
+import { jsx as e, jsxs as n } from "react/jsx-runtime";
 import f from "@mui/material/Checkbox";
-import n from "@mui/material/Skeleton";
+import s from "@mui/material/Skeleton";
 import t from "@mui/material/TableCell";
 import x from "@mui/material/TableHead";
-import s from "@mui/material/TableRow";
-const g = ({
-  rows: d,
-  isLoading: m,
+import g from "@mui/material/TableRow";
+const i = ({
+  rows: m,
+  isLoading: c,
   checked: p,
-  showAvatar: c,
-  indeterminate: i,
-  onCheck: a,
-  ...h
-}) => /* @__PURE__ */ r(x, { ...h, children: /* @__PURE__ */ l(s, { children: [
-  a && /* @__PURE__ */ r(t, { padding: "checkbox", children: m ? /* @__PURE__ */ r(n, { sx: {
+  showAvatar: h,
+  indeterminate: a,
+  onCheck: d,
+  ...l
+}) => /* @__PURE__ */ e(x, { ...l, children: /* @__PURE__ */ n(g, { children: [
+  d && /* @__PURE__ */ e(t, { padding: "checkbox", children: c ? /* @__PURE__ */ e(s, { sx: {
     width: "18px",
     height: "36px",
     margin: "auto"
-  } }) : /* @__PURE__ */ r(f, { checked: p || i, indeterminate: i, onChange: (o) => {
-    var e;
-    return a(o, {
-      value: (e = o == null ? void 0 : o.target) == null ? void 0 : e.checked
+  } }) : /* @__PURE__ */ e(f, { checked: p || a, indeterminate: a, onChange: (o) => {
+    var r;
+    return d(o, {
+      value: (r = o == null ? void 0 : o.target) == null ? void 0 : r.checked
     });
   } }) }),
-  c && /* @__PURE__ */ r(t, { padding: "checkbox" }),
-  d.map(({
+  h && /* @__PURE__ */ e(t, { padding: "checkbox" }),
+  m.map(({
     label: o
-  }, e) => /* @__PURE__ */ r(t, { children: o }, typeof o == "string" ? o : e))
+  }, r) => /* @__PURE__ */ e(t, { children: o }, typeof o == "string" ? o : r))
 ] }) });
-g.defaultProps = {};
+i.defaultProps = {};
+const w = i;
 export {
-  g as default
+  w as default
 };

package/dist/es/item/ItemTable/index.js

@@ -1,11 +1,12 @@
-import { styled as r } from "@mui/material/styles";
-import { withOverrides as m } from "../../_utils/withOverrides.js";
-import n from "./ItemTable.js";
-const e = "ItemTable", o = `Vdt${e}`, s = m(o)(n), i = r(s, {
-  name: o,
-  overridesResolver: (a, t) => t.root
+import { styled as m } from "@mui/material/styles";
+import r from "./ItemTable.js";
+import { withOverrides as s } from "../../_utils/withOverrides.js";
+const o = "ItemTable", e = `Vdt${o}`, p = s(e)(r), t = m(p, {
+  name: e,
+  overridesResolver: (d, n) => n.root
 })({});
-i.displayName = e;
+t.displayName = o;
+const c = t;
 export {
-  i as default
+  c as default
 };

package/dist/es/item/ItemTableRow/ItemTableRow.js

@@ -1,68 +1,67 @@
 import { jsxs as y, jsx as l } from "react/jsx-runtime";
-import { useMemo as A, useState as g } from "react";
-import E from "@mui/material/TableRow";
-import M from "@mui/material/TableCell";
-import S from "@mui/material/Skeleton";
+import { useMemo as E, useState as M } from "react";
+import g from "@mui/material/TableRow";
+import S from "@mui/material/TableCell";
+import V from "@mui/material/Skeleton";
 import j from "@mui/material/Checkbox";
 import { styled as I } from "@mui/material/styles";
-import { uuidv4 as q } from "../../_utils/uuidv4.js";
-import "clsx";
-import { getEntityText as H } from "../../entity/_utils/getEntityText.js";
-import V from "../../entity/EntityTableRow/components/EntityTableCellAvatar.js";
+import { getEntityText as q } from "../../entity/_utils/getEntityText.js";
+import H from "../../entity/EntityTableRow/components/EntityTableCellAvatar.js";
 import z from "../../entity/EntityTableRow/components/EntityTableCellCheckbox.js";
-const B = I(E)(({
+import { uuidv4 as B } from "../../_utils/uuidv4.js";
+const D = I(g)(({
   onClick: o
 }) => ({
   ...o ? {
     cursor: "pointer"
   } : {}
-})), D = {
-  Root: B,
-  TableCell: M,
-  TableCellAvatar: V,
+})), F = {
+  Root: D,
+  TableCell: S,
+  TableCellAvatar: H,
   TableCellCheckbox: z,
   Checkbox: j
-}, F = ({
+}, s = ({
   itemType: o,
-  rows: c,
+  rows: i,
   defaultValue: n,
   checked: a,
-  showAvatar: s,
-  avatarVariant: m,
+  showAvatar: m,
+  avatarVariant: h,
   isLoading: r,
-  onClick: f,
+  onClick: d,
   onCheck: C,
-  components: h,
+  components: u,
   componentsProps: t
 }) => {
   const {
-    Root: u,
-    TableCell: v,
-    TableCellAvatar: k,
-    TableCellCheckbox: p,
-    Checkbox: x
-  } = h, T = A(() => c.map(({
+    Root: v,
+    TableCell: k,
+    TableCellAvatar: p,
+    TableCellCheckbox: x,
+    Checkbox: T
+  } = u, R = E(() => i.map(({
     value: e
-  } = {}) => typeof e == "string" ? H(e, {
+  } = {}) => q(e, {
     itemType: o
-  }) : e ?? n), [o, n, c]), [R, w] = g(!1), i = a === void 0 ? R : a, b = typeof C != "function" ? void 0 : (e) => {
-    const d = !i;
+  }) ?? n), [o, n, i]), [w, A] = M(!1), c = a === void 0 ? w : a, b = typeof C != "function" ? void 0 : (e) => {
+    const f = !c;
     C(e, {
-      value: d,
+      value: f,
       itemType: o
-    }), a === void 0 && w(d);
+    }), a === void 0 && A(f);
   };
-  return /* @__PURE__ */ y(u, { hover: !0, selected: i, onClick: typeof f != "function" ? void 0 : (e) => {
-    e.target instanceof HTMLInputElement || f(e, {
+  return /* @__PURE__ */ y(v, { hover: !0, selected: c, onClick: typeof d != "function" ? void 0 : (e) => {
+    e.target instanceof HTMLInputElement || d(e, {
       itemType: o
     });
   }, ...t.root, children: [
-    b && /* @__PURE__ */ l(p, { itemType: o, isLoading: r, ...t.tableCellCheckbox, children: /* @__PURE__ */ l(x, { checked: i, onChange: b, ...t.checkbox }) }),
-    s && /* @__PURE__ */ l(k, { itemType: o, isLoading: r, avatarVariant: m, ...t.tableCellAvatar }),
-    T.map((e) => /* @__PURE__ */ l(v, { ...t.tableCell, children: r ? /* @__PURE__ */ l(S, {}) : typeof e == "string" && e || "" }, q()))
+    b && /* @__PURE__ */ l(x, { itemType: o, isLoading: r, ...t.tableCellCheckbox, children: /* @__PURE__ */ l(T, { checked: c, onChange: b, ...t.checkbox }) }),
+    m && /* @__PURE__ */ l(p, { itemType: o, isLoading: r, avatarVariant: h, ...t.tableCellAvatar }),
+    R.map((e) => /* @__PURE__ */ l(k, { ...t.tableCell, children: r ? /* @__PURE__ */ l(V, {}) : typeof e == "string" && e || "" }, B()))
   ] });
 };
-F.defaultProps = {
+s.defaultProps = {
   itemType: void 0,
   defaultValue: void 0,
   rows: [],
@@ -72,9 +71,10 @@ F.defaultProps = {
   isLoading: !1,
   onClick: void 0,
   onCheck: void 0,
-  components: D,
+  components: F,
   componentsProps: void 0
 };
+const _ = s;
 export {
-  F as default
+  _ as default
 };

package/dist/es/item/ItemTableRow/index.js

@@ -1,11 +1,12 @@
 import { styled as r } from "@mui/material/styles";
-import { withOverrides as m } from "../../_utils/withOverrides.js";
 import n from "./ItemTableRow.js";
-const o = "ItemTableRow", e = `Vdt${o}`, s = m(e)(n), i = r(s, {
+import { withOverrides as s } from "../../_utils/withOverrides.js";
+const o = "ItemTableRow", e = `Vdt${o}`, d = s(e)(n), t = r(d, {
   name: e,
-  overridesResolver: (a, t) => t.root
+  overridesResolver: (i, m) => m.root
 })({});
-i.displayName = o;
+t.displayName = o;
+const c = t;
 export {
-  i as default
+  c as default
 };

package/dist/es/item/ItemThumbnail/ItemThumbnail.js

@@ -1,22 +1,10 @@
-import { jsx as i, jsxs as w } from "react/jsx-runtime";
+import { jsx as i, jsxs as M } from "react/jsx-runtime";
 import c from "@mui/material/Box";
-import { styled as t } from "@mui/material/styles";
-import "../../general/AvatarMenu/index.js";
-import M from "../../general/BlurredBackground/index.js";
-import "../../general/CalendarPicker/index.js";
-import "../../general/CompactBadge/index.js";
-import "../../general/CompactLabel/index.js";
-import z from "../../general/CornerLabelPlacer/index.js";
-import "../../general/ExpandButton/index.js";
-import "../../general/ImageCollage/index.js";
-import "../../general/MediaIcon/index.js";
-import "../../general/MenuItem/index.js";
-import P from "../../general/ScrubLine/index.js";
-import "../../general/Sort/index.js";
-import "../../general/TablePagination/index.js";
-import "../../general/Form/index.js";
-import "../../general/ThemeContext/ThemeContext.js";
-const R = t(c)(({
+import { styled as r } from "@mui/material/styles";
+import z from "../../general/ScrubLine/index.js";
+import P from "../../general/CornerLabelPlacer/index.js";
+import V from "../../general/BlurredBackground/index.js";
+const R = r(c)(({
   onClick: o
 }) => ({
   height: "100%",
@@ -24,26 +12,26 @@ const R = t(c)(({
   ...o && {
     cursor: "pointer"
   }
-})), V = t(P)(() => ({
+})), j = r(z)(() => ({
   position: "relative",
   zIndex: 10
-})), $ = t(z)(() => ({
+})), E = r(P)(() => ({
   height: "100%",
   width: "100%",
   position: "absolute",
   zIndex: 15,
   top: 0
-})), j = t(M)(() => ({
+})), F = r(V)(() => ({
   height: "100%",
   width: "100%",
   position: "absolute",
   zIndex: 0,
   top: 0
-})), E = t(c, {
+})), T = r(c, {
   shouldForwardProp: (o) => !["image", "cover"].includes(o)
 })(({
   image: o,
-  cover: r
+  cover: t
 }) => ({
   height: "inherit",
   width: "inherit",
@@ -53,56 +41,56 @@ const R = t(c)(({
   background: o ? `url(${o})` : "none",
   backgroundPosition: "center",
   backgroundRepeat: "no-repeat",
-  ...r ? {
+  ...t ? {
     backgroundSize: "cover"
   } : {
     backgroundSize: "contain"
   }
-})), F = {
+})), $ = {
   Root: R,
-  ScrubLine: V,
-  CornerLabelPlacer: $,
-  BlurredBackground: j,
-  ImageBox: E
-}, T = ({
+  ScrubLine: j,
+  CornerLabelPlacer: E,
+  BlurredBackground: F,
+  ImageBox: T
+}, u = ({
   itemType: o,
-  thumbnailIndex: r,
-  placeholderImage: u,
-  showBlurredBackground: s,
-  label: m,
-  cover: p,
-  showScrub: h,
-  scrubLabel: b,
-  scrubPosition: g,
+  thumbnailIndex: t,
+  placeholderImage: s,
+  showBlurredBackground: b,
+  label: h,
+  cover: g,
+  showScrub: m,
+  scrubLabel: p,
+  scrubPosition: B,
   onClick: d,
   onMouseMove: v,
-  onMouseEnter: B,
-  onMouseLeave: f,
+  onMouseEnter: f,
+  onMouseLeave: k,
   components: x,
   componentsProps: e
 }) => {
-  var a;
+  var l;
   const {
-    Root: S,
-    ScrubLine: k,
-    BlurredBackground: y,
-    ImageBox: C,
-    CornerLabelPlacer: L
+    Root: L,
+    ScrubLine: S,
+    BlurredBackground: C,
+    ImageBox: I,
+    CornerLabelPlacer: w
   } = x, {
     thumbnails: n
-  } = o || {}, l = ((a = n == null ? void 0 : n.uri) == null ? void 0 : a[r]) || u;
-  return /* @__PURE__ */ i(S, { onClick: typeof d != "function" ? void 0 : (I) => {
-    d(I, {
+  } = o || {}, a = ((l = n == null ? void 0 : n.uri) == null ? void 0 : l[t]) || s;
+  return /* @__PURE__ */ i(L, { onClick: typeof d != "function" ? void 0 : (y) => {
+    d(y, {
       itemType: o,
-      thumbnailIndex: r
+      thumbnailIndex: t
     });
-  }, ...e.root, children: /* @__PURE__ */ w(k, { show: h, label: b, position: g, onMouseMove: v, onMouseEnter: B, onMouseLeave: f, ...e.scrubLine, children: [
-    s && /* @__PURE__ */ i(y, { image: l, ...e.blurredBackground }),
-    /* @__PURE__ */ i(C, { component: "div", image: l, cover: p, ...e.imageBox }),
-    /* @__PURE__ */ i(L, { labelBottomRight: m, ...e.cornerLabelPlacer })
+  }, ...e.root, children: /* @__PURE__ */ M(S, { show: m, label: p, position: B, onMouseMove: v, onMouseEnter: f, onMouseLeave: k, ...e.scrubLine, children: [
+    b && /* @__PURE__ */ i(C, { image: a, ...e.blurredBackground }),
+    /* @__PURE__ */ i(I, { component: "div", image: a, cover: g, ...e.imageBox }),
+    /* @__PURE__ */ i(w, { labelBottomRight: h, ...e.cornerLabelPlacer })
   ] }) });
 };
-T.defaultProps = {
+u.defaultProps = {
   itemType: void 0,
   thumbnailIndex: 0,
   label: void 0,
@@ -116,9 +104,10 @@ T.defaultProps = {
   onMouseMove: void 0,
   onMouseEnter: void 0,
   onMouseLeave: void 0,
-  components: F,
+  components: $,
   componentsProps: void 0
 };
+const N = u;
 export {
-  T as default
+  N as default
 };

package/dist/es/item/ItemThumbnail/index.js

@@ -1,11 +1,12 @@
-import { styled as m } from "@mui/material/styles";
-import { withOverrides as r } from "../../_utils/withOverrides.js";
-import n from "./ItemThumbnail.js";
-const o = "ItemThumbnail", e = `Vdt${o}`, i = r(e)(n), s = m(i, {
-  name: e,
-  overridesResolver: (a, t) => t.root
+import { styled as n } from "@mui/material/styles";
+import r from "./ItemThumbnail.js";
+import { withOverrides as s } from "../../_utils/withOverrides.js";
+const o = "ItemThumbnail", t = `Vdt${o}`, i = s(t)(r), e = n(i, {
+  name: t,
+  overridesResolver: (p, m) => m.root
 })({});
-s.displayName = o;
+e.displayName = o;
+const c = e;
 export {
-  s as default
+  c as default
 };

package/dist/es/metadata/MetadataGroupTreeView/MetadataGroupTreeView.d.ts

@@ -0,0 +1,16 @@
+/// <reference types="react" />
+import type { MetadataGroupValueType } from '@vidispine/types';
+import { WithOverrideProps } from '../../_types';
+declare const defaultComponents: {
+    Root: any;
+    GroupTreeItem: any;
+    FieldTreeItem: any;
+};
+export interface MetadataGroupTreeViewProps extends WithOverrideProps<typeof defaultComponents> {
+    /**
+     * Root group to display in tree view
+     */
+    group?: MetadataGroupValueType;
+}
+declare const MetadataGroupTreeView: React.FC<MetadataGroupTreeViewProps>;
+export default MetadataGroupTreeView;

package/dist/es/metadata/MetadataGroupTreeView/MetadataGroupTreeView.js

@@ -0,0 +1,63 @@
+import { jsx as t, jsxs as a, Fragment as M } from "react/jsx-runtime";
+import x from "@mui/icons-material/esm/ChevronRight";
+import b from "@mui/icons-material/esm/ExpandMore";
+import g from "@mui/lab/TreeItem";
+import C from "@mui/lab/TreeView";
+import { styled as i } from "@mui/material/styles";
+import { parseFieldList as F } from "@vidispine/vdt-js";
+const m = i(g)(() => ({
+  userSelect: "all",
+  "&:focus, &:hover, &.Mui-selected": {
+    "& > .MuiTreeItem-content, .MuiTreeItem-label": {
+      backgroundColor: "unset",
+      cursor: "default"
+    }
+  },
+  "& .Mui-selected": {
+    backgroundColor: "unset !important"
+  }
+})), v = {
+  Root: C,
+  GroupTreeItem: m,
+  FieldTreeItem: m
+}, s = i("span")(() => ({
+  fontWeight: 600,
+  fontSize: ".75rem"
+})), S = i("span")(() => ({
+  fontSize: ".75rem"
+})), c = ({
+  group: n,
+  components: f,
+  componentsProps: r
+}) => {
+  const {
+    Root: p,
+    GroupTreeItem: I,
+    FieldTreeItem: h
+  } = f, T = (e = {}) => /* @__PURE__ */ t(h, { nodeId: e.uuid, label: /* @__PURE__ */ a(M, { children: [
+    /* @__PURE__ */ t(s, { children: `${e.name}: ` }),
+    /* @__PURE__ */ t(S, { children: e.value.join(", ") })
+  ] }), ...r.fieldTreeItem }, e.uuid), l = (e = {}) => {
+    var d, u;
+    return /* @__PURE__ */ a(I, { nodeId: e.uuid, label: /* @__PURE__ */ t(s, { children: e.name }), ...r.groupTreeItem, children: [
+      ((d = e.field) == null ? void 0 : d.length) > 0 ? F(e.field, {
+        includeFieldAttributes: !0,
+        fieldAsList: !0,
+        arrayOnSingleValue: !0
+      }).map((o) => T(o)) : null,
+      ((u = e.group) == null ? void 0 : u.length) > 0 ? e.group.map((o) => l(o)) : null
+    ] }, e.uuid);
+  };
+  return /* @__PURE__ */ t(p, { defaultCollapseIcon: /* @__PURE__ */ t(b, {}), defaultExpanded: [n == null ? void 0 : n.uuid], defaultExpandIcon: /* @__PURE__ */ t(x, {}), sx: {
+    maxWidth: 400
+  }, ...r.root, children: l(n) });
+};
+c.defaultProps = {
+  group: void 0,
+  components: v,
+  componentsProps: void 0
+};
+const k = c;
+export {
+  k as default
+};

package/dist/es/metadata/MetadataGroupTreeView/index.d.ts

@@ -0,0 +1,2 @@
+declare const StyledComponent: any;
+export default StyledComponent;

package/dist/es/metadata/MetadataGroupTreeView/index.js

@@ -0,0 +1,12 @@
+import { styled as n } from "@mui/material/styles";
+import m from "./MetadataGroupTreeView.js";
+import { withOverrides as a } from "../../_utils/withOverrides.js";
+const e = "MetadataGroupTreeView", o = `Vdt${e}`, s = a(o)(m), t = n(s, {
+  name: o,
+  overridesResolver: (d, r) => r.root
+})(() => ({}));
+t.displayName = e;
+const l = t;
+export {
+  l as default
+};