@ynput/ayon-frontend-shared 0.6.9 → 0.7.1

package/dist/chunks/Actions.es.js

@@ -4,19 +4,20 @@ import x, { keyframes as ge } from "styled-components";
 import { useRef as fe, useMemo as f, useState as $, useEffect as me } from "react";
 import B from "clsx";
 import { toast as w } from "react-toastify";
-import { bj as he } from "./searchTerms.es.js";
-import { d3 as be, bc as ve, cS as ye, bd as xe, b8 as Ae } from "./getUris.es.js";
+import { bt as he } from "./searchTerms.es.js";
+import { da as be, bg as ve, cY as ye, bh as xe, bc as Ae } from "./getUris.es.js";
 import "primereact/confirmdialog";
 import { upperFirst as Q } from "lodash";
 import { u as we } from "./useActionTriggers.es.js";
 import { S as R } from "./SimpleFormDialog.es.js";
 import "uuid";
 import "@module-federation/enhanced/runtime";
-import { d as Ce } from "./DeleteEntitiesContextInstance.es.js";
+import { d as Ce } from "./TableExportContextInstance.es.js";
 import "semver";
 import "./ContextMenuContextInstance.es.js";
 import "react-dom";
 import "react-redux";
+import "react-router-dom";
 const Se = x.div`
   position: relative;
   width: fit-content;
@@ -188,7 +189,7 @@ const Se = x.div`
       ...c
     }
   );
-}, je = ({ action: o, onClose: s, context: a }) => {
+}, Ve = ({ action: o, onClose: s, context: a }) => {
   const u = f(() => !o || !(o.addonName && o.addonVersion) ? null : {
     addonName: o.addonName,
     addonVersion: o.addonVersion,
@@ -222,7 +223,7 @@ const Se = x.div`
       cancelIcon: "close"
     }
   );
-}, Ve = ({
+}, je = ({
   interactiveForm: o,
   onClose: s,
   onSubmit: a
@@ -251,7 +252,7 @@ const Se = x.div`
   isPlaceholder: !0,
   icon: { type: "material-symbols", name: "sync" },
   groupLabel: ""
-}, oo = ({
+}, no = ({
   entities: o,
   entityType: s,
   entitySubTypes: a,
@@ -265,7 +266,7 @@ const Se = x.div`
   align: z,
   pt: H
 }) => {
-  const { user: F } = Ce(), { handleActionPayload: J } = we({ onNavigate: m, onSetSearchParams: g, searchParams: b }), [K, O] = $(null), [W, S] = $(null), C = f(() => {
+  const { user: F } = Ce(), { handleActionPayload: J } = we({ onNavigate: m, onSetSearchParams: g, searchParams: b }), [Y, O] = $(null), [K, S] = $(null), C = f(() => {
     if (p)
       return {
         entityType: "project",
@@ -283,17 +284,17 @@ const Se = x.div`
   me(() => {
     S(null);
   }, [JSON.stringify(C)]);
-  const { data: X, isFetching: Y } = ye(
+  const { data: W, isFetching: X } = ye(
     { archived: !1 },
     { skip: d !== "developer" }
-  ), I = X?.bundles || [], j = f(() => {
+  ), I = W?.bundles || [], V = f(() => {
     if (!I?.length || d !== "developer") return null;
     const e = I.filter((t) => t.isDev);
     return e.length ? e.find((t) => t.activeUser === F?.name)?.name || e[0].name : null;
-  }, [I, d, F?.name]), V = f(() => d === "developer" ? j || "developer" : d, [d, j]), { data: Z, isFetching: M } = xe(
+  }, [I, d, F?.name]), j = f(() => d === "developer" ? V || "developer" : d, [d, V]), { data: Z, isFetching: M } = xe(
     {
       mode: "simple",
-      variant: V,
+      variant: j,
       actionContext: C
     },
     { skip: !C }
@@ -415,27 +416,27 @@ const Se = x.div`
       Oe,
       {
         options: ee,
-        isLoading: k && c > 0 || Y,
+        isLoading: k && c > 0 || X,
         onAction: D,
         onConfig: ae,
         bundleMode: d,
-        actionsVariant: V,
+        actionsVariant: j,
         align: z,
         ...H?.dropdown
       }
     ),
     /* @__PURE__ */ r(
-      je,
+      Ve,
       {
-        action: K,
+        action: Y,
         context: C,
         onClose: () => O(null)
       }
     ),
     /* @__PURE__ */ r(
-      Ve,
+      je,
       {
-        interactiveForm: W,
+        interactiveForm: K,
         onClose: () => S(null),
         onSubmit: se
       }
@@ -443,5 +444,5 @@ const Se = x.div`
   ] });
 };
 export {
-  oo as A
+  no as A
 };

package/dist/chunks/ColumnDropIndicator.es.js

@@ -3,9 +3,9 @@ import "react-toastify";
 import "lodash";
 import "primereact/confirmdialog";
 import { g as p } from "./iconUtils.es.js";
-import { bk as E } from "./searchTerms.es.js";
+import { bB as E } from "./searchTerms.es.js";
 import "uuid";
-import { jsx as k } from "react/jsx-runtime";
+import { jsx as L } from "react/jsx-runtime";
 import "clsx";
 import "./PlayableIcon.es.js";
 import "@ynput/ayon-react-components";
@@ -21,22 +21,23 @@ import "@lexical/utils";
 import "@lexical/react/LexicalBlockWithAlignableContents";
 import "@lexical/react/LexicalDecoratorBlockNode";
 import "./getUris.es.js";
-import "./DeleteEntitiesContextInstance.es.js";
-import { a as L, b as S } from "./MetaWidget.es.js";
+import "./TableExportContextInstance.es.js";
+import { a as S, b as k } from "./MetaWidget.es.js";
 import "@module-federation/enhanced/runtime";
 import "semver";
 import "./ContextMenuContextInstance.es.js";
 import { createPortal as R } from "react-dom";
 import "react-redux";
+import "react-router-dom";
 import "@tanstack/react-table";
-import { useDndContext as D } from "@dnd-kit/core";
-import { a as I } from "./ColumnDropIndicator.styled.es.js";
-const O = ["string", "integer", "float"], B = (o, s, t, n) => (t || O).includes(o.data.type || "") && (!s || o.scope?.includes(s)) ? n ? E(o.data) : !0 : !1, gt = ({
+import { useDndContext as B } from "@dnd-kit/core";
+import { a as D } from "./ColumnDropIndicator.styled.es.js";
+const I = ["string", "integer", "float"], O = (o, s, t, n) => (t || I).includes(o.data.type || "") && (!s || o.scope?.includes(s)) ? n ? E(o.data) : !0 : !1, ht = ({
   allowedTypes: o,
   enumOnly: s,
   scope: t
 }) => {
-  const { columnOrder: n } = L(), { attribFields: a } = S();
+  const { columnOrder: n } = S(), { attribFields: a } = k();
   return A(
     () => [
       {
@@ -87,7 +88,7 @@ const O = ["string", "integer", "float"], B = (o, s, t, n) => (t || O).includes(
         icon: p("tags"),
         scopes: ["task", "version", "folder", "product"]
       },
-      ...a.filter((r) => B(r, t, o, s)).map((r) => ({
+      ...a.filter((r) => O(r, t, o, s)).map((r) => ({
         value: "attrib." + r.name,
         label: r.data.title || r.name,
         icon: p(r.name)
@@ -98,7 +99,7 @@ const O = ["string", "integer", "float"], B = (o, s, t, n) => (t || O).includes(
     }),
     [a, n, o, s, t]
   );
-}, P = "data-column-dnd-container", y = 100, ht = ({
+}, P = "data-column-dnd-container", y = 100, Ct = ({
   columnPinning: o,
   columnSizing: s
 }) => {
@@ -154,8 +155,8 @@ const O = ["string", "integer", "float"], B = (o, s, t, n) => (t || O).includes(
     top: n.top,
     height: n.height
   };
-}, _ = "th[data-column-id]", Ct = () => {
-  const { active: o, over: s } = D(), t = o?.data?.current?.type === "column" ? String(o.id) : null, n = s ? String(s.id) : null, [a, r] = v(null);
+}, _ = "th[data-column-id]", bt = () => {
+  const { active: o, over: s } = B(), t = o?.data?.current?.type === "column" ? String(o.id) : null, n = s ? String(s.id) : null, [a, r] = v(null);
   return T(() => {
     if (!t || !n || t === n) {
       r(null);
@@ -175,15 +176,15 @@ const O = ["string", "integer", "float"], B = (o, s, t, n) => (t || O).includes(
       m = requestAnimationFrame(u);
     };
     return u(), () => cancelAnimationFrame(m);
-  }, [t, n]), a ? R(/* @__PURE__ */ k(I, { style: a }), document.body) : null;
+  }, [t, n]), a ? R(/* @__PURE__ */ L(D, { style: a }), document.body) : null;
 };
 export {
   _ as C,
-  Ct as T,
+  bt as T,
   P as a,
-  O as b,
-  gt as c,
+  I as b,
+  ht as c,
   F as g,
-  B as i,
-  ht as u
+  O as i,
+  Ct as u
 };

package/dist/chunks/ColumnHeaderMenuUI.es.js

@@ -6,7 +6,7 @@ import "@ynput/ayon-react-components";
 import "./searchTerms.es.js";
 import "./getUris.es.js";
 import "primereact/confirmdialog";
-import { u as f } from "./DeleteEntitiesContextInstance.es.js";
+import { u as f } from "./TableExportContextInstance.es.js";
 import "lodash";
 import "uuid";
 import "semver";
@@ -14,8 +14,8 @@ import "./ContextMenuContextInstance.es.js";
 import "clsx";
 import "react-dom";
 import "react-redux";
+import "react-router-dom";
 import { M as c, a as g } from "./Menu.es.js";
-import "./MenuItem.es.js";
 import { C } from "./ColumnDropIndicator.styled.es.js";
 const q = ({ menuItems: e, menuId: t, className: p }) => {
   const { toggleMenuOpen: r, menuOpen: m } = f(), i = u(null), s = m === t;

package/dist/chunks/ContextMenuContextInstance.es.js

@@ -1,6 +1,6 @@
 import { createContext as e, useContext as n } from "react";
-const o = e(void 0);
-function u() {
+const u = "data-context-menu-target", o = e(void 0);
+function s() {
   const t = n(o);
   if (t === void 0)
     throw new Error("useContextMenu must be used within a ContextMenuProvider");
@@ -8,5 +8,6 @@ function u() {
 }
 export {
   o as C,
-  u
+  u as a,
+  s as u
 };

package/dist/chunks/DeleteEntitiesConfirmDialog.es.js

@@ -1,7 +1,7 @@
-import { jsx as l, jsxs as d, Fragment as F } from "react/jsx-runtime";
-import { useState as A, useMemo as D } from "react";
-import { Button as $ } from "@ynput/ayon-react-components";
-import { S as V, D as x, f as E, F as O, h as T, C as P, i as M, j as R, k as I, l as _ } from "./DeleteEntitiesContextInstance.es.js";
+import { jsx as l, jsxs as d, Fragment as E } from "react/jsx-runtime";
+import { useState as F, useMemo as A } from "react";
+import { Button as D } from "@ynput/ayon-react-components";
+import { S as z, D as N, f as $, F as O, h as T, C as P, i as M, j as R, k as I, l as _ } from "./TableExportContextInstance.es.js";
 import "lodash";
 import "primereact/confirmdialog";
 import "react-toastify";
@@ -21,7 +21,9 @@ const te = [
   "listAttributes",
   "commentCategories",
   "columnSummaries",
-  "entityLinks"
+  "listValues",
+  "entityLinks",
+  "tableExport"
 ], oe = {
   annotations: {
     label: "Annotations",
@@ -83,10 +85,20 @@ const te = [
     description: "Aggregate each column totals, averages, distributions in a summary footer.",
     bullet: "Per-column summary footer"
   },
+  listValues: {
+    label: "List Values",
+    description: "Keep separate attribute values in each list and compare them with the entities or another list.",
+    bullet: "Per-list values and compare view"
+  },
   entityLinks: {
     label: "Entity Links",
     description: "Press G on any entity for a graph of everything linked to it, or L to see and edit its links in columns, including the links of everything below a folder.",
     bullet: "See and edit links of any entity"
+  },
+  tableExport: {
+    label: "Table Export",
+    description: "Export a table or the selected rows to Excel or CSV, with every row and inherited attribute, ready to import back.",
+    bullet: "Export tables to Excel and CSV"
   }
 }, C = [
   "folder",
@@ -106,7 +118,7 @@ const te = [
     (e) => u(r[e], e)
   );
   return G(a);
-}, ne = (o, r) => {
+}, ie = (o, r) => {
   const a = {}, e = (s, t) => {
     t > 0 && (a[s] = (a[s] || 0) + t);
   };
@@ -114,19 +126,19 @@ const te = [
   for (const s of r)
     e("folder", s.totalFolderCount), e("task", s.totalTaskCount), e("product", s.totalProductCount), e("version", s.totalVersionCount);
   return a;
-}, H = (o) => C.reduce((r, a) => r + (o[a] || 0), 0), g = 8, ie = (o, r) => {
+}, H = (o) => C.reduce((r, a) => r + (o[a] || 0), 0), g = 8, ne = (o, r) => {
   if (o.length === 0) return [];
   const a = new Map(r.map((t) => [t.id, t])), e = o.length > 1, s = [];
   for (const t of o) {
-    const n = a.get(t.id), f = t.label || t.name || t.id, m = e ? `"${f}" contains ` : "Contains ";
-    if (n && (n.totalFolderCount > 0 || n.totalTaskCount > 0 || n.totalProductCount > 0 || n.totalVersionCount > 0)) {
+    const i = a.get(t.id), p = t.label || t.name || t.id, m = e ? `"${p}" contains ` : "Contains ";
+    if (i && (i.totalFolderCount > 0 || i.totalTaskCount > 0 || i.totalProductCount > 0 || i.totalVersionCount > 0)) {
       const c = [];
-      n.totalFolderCount > 0 && c.push(u(n.totalFolderCount, "child folder")), n.totalTaskCount > 0 && c.push(u(n.totalTaskCount, "task")), n.totalProductCount > 0 && c.push(u(n.totalProductCount, "product")), n.totalVersionCount > 0 && c.push(u(n.totalVersionCount, "version")), s.push(`${m}${c.join(", ")}`);
+      i.totalFolderCount > 0 && c.push(u(i.totalFolderCount, "child folder")), i.totalTaskCount > 0 && c.push(u(i.totalTaskCount, "task")), i.totalProductCount > 0 && c.push(u(i.totalProductCount, "product")), i.totalVersionCount > 0 && c.push(u(i.totalVersionCount, "version")), s.push(`${m}${c.join(", ")}`);
     } else
       t.hasChildren && s.push(`${m}child folders`), t.taskNames && t.taskNames.length > 0 && s.push(`${m}${u(t.taskNames.length, "task")}`);
   }
   return s.length > g ? [...s.slice(0, g), `…and ${s.length - g} more`] : s;
-}, q = (o, r) => {
+}, K = (o, r) => {
   const a = (o ?? "").trim();
   return a !== "" && Number(a) === r;
 }, re = ({
@@ -138,30 +150,30 @@ const te = [
     entityLabel: e,
     childrenDetails: s,
     expectedCounts: t,
-    expectedName: n,
-    deleteLabel: f = "Delete forever",
+    expectedName: i,
+    deleteLabel: p = "Delete forever",
     message: m
-  } = o, [p, c] = A(""), [y, j] = A({}), v = D(
-    () => C.filter((i) => (t[i] || 0) > 0),
+  } = o, [f, c] = F(""), [v, x] = F({}), y = A(
+    () => C.filter((n) => (t[n] || 0) > 0),
     [t]
-  ), h = D(() => H(t), [t]), b = h > E, w = !!n && !b, k = b ? v.every((i) => q(y[i], t[i])) : w ? p.trim() === n : !0, S = (i) => {
-    i.key === "Enter" && k && (i.preventDefault(), r());
+  ), b = A(() => H(t), [t]), h = b > $, w = !!i && !h, k = h ? y.every((n) => K(v[n], t[n])) : w ? f.trim() === i : !0, S = (n) => {
+    n.key === "Enter" && k && (n.preventDefault(), r());
   };
   return /* @__PURE__ */ l(
-    V,
+    z,
     {
       size: "md",
       isOpen: !0,
-      header: `${f} ${e}`,
+      header: `${p} ${e}`,
       onClose: a,
       footer: (
         // keydown lives here, not on the dialog — dialog spreads rest props over its own
         // handler and would lose escape-to-close
         /* @__PURE__ */ d(O, { onKeyDown: S, children: [
-          w && /* @__PURE__ */ d(F, { children: [
+          w && /* @__PURE__ */ d(E, { children: [
             /* @__PURE__ */ d(T, { htmlFor: "delete-confirm-name-input", children: [
               "To confirm delete action, type '",
-              n,
+              i,
               "' in the box below"
             ] }),
             /* @__PURE__ */ l(
@@ -170,37 +182,37 @@ const te = [
                 id: "delete-confirm-name-input",
                 "data-testid": "delete-confirm-name-input",
                 autoFocus: !0,
-                value: p,
-                placeholder: n,
-                onChange: (i) => c(i.target.value)
+                value: f,
+                placeholder: i,
+                onChange: (n) => c(n.target.value)
               }
             )
           ] }),
-          b && /* @__PURE__ */ d(F, { children: [
+          h && /* @__PURE__ */ d(E, { children: [
             /* @__PURE__ */ l(T, { as: "p", children: "To confirm, type how many of each will be deleted, children included" }),
-            /* @__PURE__ */ l(M, { children: v.map((i, L) => /* @__PURE__ */ d(R, { children: [
-              /* @__PURE__ */ l("span", { children: `${i[0].toUpperCase()}${i.slice(1)}s - ${t[i]}` }),
+            /* @__PURE__ */ l(M, { children: y.map((n, V) => /* @__PURE__ */ d(R, { children: [
+              /* @__PURE__ */ l("span", { children: `${n[0].toUpperCase()}${n.slice(1)}s - ${t[n]}` }),
               /* @__PURE__ */ l(
                 I,
                 {
-                  "data-testid": `delete-confirm-count-${i}`,
-                  autoFocus: L === 0,
+                  "data-testid": `delete-confirm-count-${n}`,
+                  autoFocus: V === 0,
                   inputMode: "numeric",
-                  value: y[i] ?? "",
-                  placeholder: `Number of ${i}s`,
-                  onChange: (z) => j((N) => ({ ...N, [i]: z.target.value }))
+                  value: v[n] ?? "",
+                  placeholder: `Number of ${n}s`,
+                  onChange: (j) => x((L) => ({ ...L, [n]: j.target.value }))
                 }
               )
-            ] }, i)) })
+            ] }, n)) })
           ] }),
           /* @__PURE__ */ d(_, { children: [
-            /* @__PURE__ */ l($, { label: "Cancel", onClick: a }),
+            /* @__PURE__ */ l(D, { label: "Cancel", onClick: a }),
             /* @__PURE__ */ l(
-              $,
+              D,
               {
                 "data-testid": "delete-confirm-submit",
                 variant: "danger",
-                label: f,
+                label: p,
                 onClick: r,
                 disabled: !k
               }
@@ -209,14 +221,14 @@ const te = [
         ] })
       ),
       children: /* @__PURE__ */ l(
-        x,
+        N,
         {
           entityLabel: e,
           childrenDetails: s,
           message: m,
-          totalLine: h > E ? (
+          totalLine: b > $ ? (
             // versions cascaded from products are not countable, so the total is a floor
-            `This deletes ${(t.product || 0) > 0 ? "at least " : ""}${h} entities in total.`
+            `This deletes ${(t.product || 0) > 0 ? "at least " : ""}${b} entities in total.`
           ) : void 0
         }
       )
@@ -227,9 +239,9 @@ export {
   C as D,
   te as a,
   re as b,
-  ie as c,
+  ne as c,
   se as d,
-  ne as e,
+  ie as e,
   oe as p,
   H as s
 };

package/dist/chunks/DetailsDialog.es.js

@@ -1,38 +1,40 @@
 import { jsx as o } from "react/jsx-runtime";
-import { toast as d } from "react-toastify";
+import { toast as u } from "react-toastify";
 import "./searchTerms.es.js";
-import { bC as p } from "./getUris.es.js";
+import { bG as c } from "./getUris.es.js";
 import "primereact/confirmdialog";
-import { Dialog as f } from "@ynput/ayon-react-components";
-import { J as u } from "./JsonViewer.es.js";
-const A = ({
-  projectName: s,
-  entityType: e,
-  entityIds: l,
-  visible: t,
-  onHide: n
+import { Dialog as g } from "@ynput/ayon-react-components";
+import { J as h } from "./JsonViewer.es.js";
+const G = ({
+  projectName: l,
+  entityType: t,
+  entityIds: n,
+  visible: e,
+  onHide: d,
+  data: i,
+  header: m
 }) => {
   const {
-    data: r = {},
-    isLoading: i,
-    isError: a,
-    error: m
-  } = p(
-    { projectName: s, entityType: e, entityId: l?.[0] },
-    { skip: !t }
-  );
-  return a && d.error(`Unable to load detail. ${m}`), !t || Array.isArray(r) && r.length < 1 ? null : /* @__PURE__ */ o(
-    f,
+    data: f = {},
+    isLoading: a,
+    isError: s,
+    error: p
+  } = c(
+    { projectName: l, entityType: t, entityId: n?.[0] },
+    { skip: !e || i !== void 0 }
+  ), r = i ?? f;
+  return s && u.error(`Unable to load detail. ${p}`), !e || Array.isArray(r) && r.length < 1 ? null : /* @__PURE__ */ o(
+    g,
     {
       isOpen: !0,
-      onClose: n,
+      onClose: d,
       size: "lg",
       style: { width: "50vw" },
-      header: `${e} detail`,
-      children: i || a ? /* @__PURE__ */ o("pre", { children: i ? "loading..." : "error..." }) : /* @__PURE__ */ o(u, { value: r })
+      header: m ?? `${t} detail`,
+      children: a || s ? /* @__PURE__ */ o("pre", { children: a ? "loading..." : "error..." }) : /* @__PURE__ */ o(h, { value: r })
     }
   );
 };
 export {
-  A as D
+  G as D
 };

package/dist/chunks/EmptyPlaceholder.es.js

@@ -5,7 +5,7 @@ import "lodash";
 import "primereact/confirmdialog";
 import "react-toastify";
 import "uuid";
-import { bj as g } from "./searchTerms.es.js";
+import { bt as g } from "./searchTerms.es.js";
 import "react";
 import u from "styled-components";
 const l = u.div`
@@ -51,7 +51,7 @@ const l = u.div`
       margin-top: -16px;
     }
   }
-`, P = ({
+`, R = ({
   icon: d,
   message: o,
   error: n,
@@ -75,6 +75,6 @@ const l = u.div`
   t
 ] });
 export {
-  P as E,
+  R as E,
   l as P
 };

package/dist/chunks/EmptyPlaceholderFlex.styled.es.js

@@ -0,0 +1,40 @@
+import e from "styled-components";
+import { E as o } from "./EmptyPlaceholder.es.js";
+const i = e(o)`
+  display: flex;
+  flex-direction: column;
+  justify-content: center;
+  flex-grow: 1;
+  position: relative;
+  max-width: 100%;
+  overflow: hidden;
+  top: 0;
+  left: 0;
+  transform: none;
+  gap: 8px;
+  .icon {
+    font-size: 34px;
+  }
+  h3 {
+    font-size: 18px;
+  }
+`, a = e.div`
+  display: flex;
+  flex-direction: column;
+  flex-grow: 1;
+
+  position: relative;
+  height: 100%;
+  border-radius: var(--border-radius-m);
+
+  background: var(--md-sys-color-surface-container-low);
+  .header {
+    margin: 0;
+    padding: 9.4px 8px;
+    text-transform: capitalize;
+  }
+`;
+export {
+  i as E,
+  a
+};