@ynput/ayon-frontend-shared 0.6.0 → 0.6.1

package/dist/chunks/Actions.es.js

@@ -4,14 +4,19 @@ 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 { be as he } from "./searchTerms.es.js";
+import { bi as he } from "./searchTerms.es.js";
 import { d0 as be, bb as ve, cP as ye, bc as xe, b7 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 { u as Ce } from "./GlobalContext.es.js";
+import "@module-federation/enhanced/runtime";
+import { d as Ce } from "./DeleteEntitiesContextInstance.es.js";
+import "semver";
+import "./ContextMenuContextInstance.es.js";
+import "react-dom";
+import "react-redux";
 const Se = x.div`
   position: relative;
   width: fit-content;
@@ -246,7 +251,7 @@ const Se = x.div`
   isPlaceholder: !0,
   icon: { type: "material-symbols", name: "sync" },
   groupLabel: ""
-}, Xe = ({
+}, oo = ({
   entities: o,
   entityType: s,
   entitySubTypes: a,
@@ -438,5 +443,5 @@ const Se = x.div`
   ] });
 };
 export {
-  Xe as A
+  oo as A
 };

package/dist/chunks/ColumnDropIndicator.es.js

@@ -1,344 +1,190 @@
-import { createContext as I, forwardRef as S, useRef as _, useState as M, useEffect as R } from "react";
-import { jsxs as g, jsx as i, Fragment as y } from "react/jsx-runtime";
-import { Button as v, Icon as D } from "@ynput/ayon-react-components";
-import h from "clsx";
-import c from "styled-components";
-import { u as O } from "./MenuContext.es.js";
-import { M as P, a as z } from "./Menu.es.js";
-import "./MenuItem.es.js";
-import "./useLocalStorage.es.js";
-import "@module-federation/enhanced/runtime";
-import "semver";
-import { R as C, D as w } from "./realtimeUpdatesUtils.es.js";
+import { useMemo as A, useRef as x, useCallback as h, useState as v, useEffect as T } from "react";
+import "react-toastify";
 import "lodash";
 import "primereact/confirmdialog";
-import "react-toastify";
-import { c as A } from "./copyToClipboard.es.js";
+import { g as p } from "./parseHtmlToPlainTextWithLinks.es.js";
+import { bj as E } from "./searchTerms.es.js";
 import "uuid";
-import "./searchTerms.es.js";
-import { createPortal as E } from "react-dom";
-import { useDndContext as N } from "@dnd-kit/core";
-const F = (t) => {
-  const o = t.getIsPinned(), n = t.id !== C && t.id !== w ? -30 : 0;
-  return {
-    left: o === "left" ? `${t.getStart("left") + n}px` : void 0,
-    right: o === "right" ? `${t.getAfter("right")}px` : void 0,
-    position: o ? "sticky" : "relative",
-    width: t.getSize(),
-    zIndex: o ? 100 : 0
-  };
-}, B = (t) => `calc(var(--col-${t}-size) * 1px)`, ht = I(void 0), gt = S(({ ...t }, o) => /* @__PURE__ */ g(
-  "svg",
-  {
-    width: "25",
-    height: "22",
-    viewBox: "0 0 25 22",
-    fill: "none",
-    xmlns: "http://www.w3.org/2000/svg",
-    ...t,
-    ref: o,
-    children: [
-      /* @__PURE__ */ i(
-        "path",
-        {
-          d: "M0.938178 10.6543C0.816721 5.48877 5.1207 1.23771 10.4975 1.11128C15.8743 0.98486 20.3734 5.02894 20.4948 10.1945C20.6163 15.36 16.3122 19.6111 10.9354 19.7376C9.75118 19.7654 8.61022 19.5914 7.5495 19.2479C7.33438 19.1783 7.0983 19.1794 6.88174 19.2638L5.242 19.9017C4.31715 20.2614 3.35776 19.4629 3.54364 18.4881L3.72118 17.557C3.78241 17.2359 3.67515 16.9129 3.45681 16.6832C1.94083 15.0885 0.992941 12.9834 0.938178 10.6543Z",
-          stroke: "white",
-          strokeWidth: "1.5"
-        }
-      ),
-      /* @__PURE__ */ i(
-        "path",
-        {
-          d: "M15.3853 4.70168C19.9873 4.59348 23.892 8.06066 23.9977 12.5556C24.0445 14.5475 23.3301 16.3832 22.121 17.8111C22.0428 17.9034 22.0185 18.0146 22.041 18.108L22.2908 19.1496C22.5495 20.2281 21.5204 21.1699 20.469 20.8169L18.8159 20.2617C18.7509 20.2398 18.6726 20.2401 18.5934 20.2693C17.7115 20.5946 16.7586 20.7823 15.764 20.8057C11.1621 20.9139 7.2573 17.4467 7.1516 12.9517C7.04592 8.45675 10.7834 4.80988 15.3853 4.70168Z",
-          fill: "white",
-          stroke: "#1C2026",
-          strokeWidth: "1.5"
-        }
-      ),
-      /* @__PURE__ */ i(
-        "path",
-        {
-          d: "M20.1373 12.6133C19.942 15.1992 17.8037 17.2074 15.2107 17.2402L14.7621 17.2459",
-          stroke: "#232323",
-          strokeWidth: "1.5",
-          strokeLinecap: "round"
-        }
-      )
-    ]
-  }
-)), T = c(v)`
-  width: 24px;
-  height: 24px;
-  padding: 2px;
-
-  &.action {
-    padding: 0px;
-    display: flex;
-    background-color: unset;
-  }
-
-  &:hover {
-    background-color: var(--md-sys-color-surface-container-hover) !important;
-  }
-
-  &.pin-button .material-symbols-outlined.icon {
-    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 10;
-  }
-
-  &.selected {
-    display: flex !important;
-  }
-`, xt = ({ selected: t, style: o, ...n }) => /* @__PURE__ */ i(
-  T,
-  {
-    ...n,
-    selected: t,
-    className: h(n.className, "action", { selected: t }),
-    variant: "text",
-    style: { ...o }
-  }
-), H = c(v)`
-  background-color: unset !important;
-  z-index: 110;
-  position: relative;
-  padding: 2px;
-  width: 24px;
-  height: 24px;
-
-  &.hasIcon {
-    padding: 2px;
-  }
-
-  &:hover,
-  &.active {
-    background-color: var(--md-sys-color-surface-container-hover) !important;
-  }
-
-  ${({ $isOpen: t }) => t && `
-    background-color: var(--md-sys-color-surface-container-hover) !important;
-  `}
-`, Ct = ({ menuItems: t, menuId: o, className: n }) => {
-  const { toggleMenuOpen: r, menuOpen: d } = O(), a = _(null), p = d === o;
-  return t.length === 0 ? null : /* @__PURE__ */ g(y, { children: [
-    /* @__PURE__ */ i(
-      H,
+import { jsx as L } from "react/jsx-runtime";
+import "clsx";
+import "./PlayableIcon.es.js";
+import "@ynput/ayon-react-components";
+import "lexical";
+import "@lexical/markdown";
+import "@lexical/react/LexicalBlockWithAlignableContents";
+import "@lexical/react/LexicalDecoratorBlockNode";
+import "match-sorter";
+import "date-fns";
+import "@lexical/code";
+import "@lexical/list";
+import "@lexical/rich-text";
+import "@lexical/selection";
+import "@lexical/utils";
+import "./getUris.es.js";
+import "react-router-dom";
+import { a as S, b as k } from "./MetaWidget.es.js";
+import "@module-federation/enhanced/runtime";
+import "./DeleteEntitiesContextInstance.es.js";
+import "semver";
+import "./ContextMenuContextInstance.es.js";
+import { createPortal as R } from "react-dom";
+import "react-redux";
+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, ht = ({
+  allowedTypes: o,
+  enumOnly: s,
+  scope: t
+}) => {
+  const { columnOrder: n } = S(), { attribFields: a } = k();
+  return A(
+    () => [
       {
-        ref: a,
-        className: n,
-        onClick: (s) => {
-          s.stopPropagation(), r(o);
-        },
-        onPointerDown: (s) => s.stopPropagation(),
-        icon: "more_horiz",
-        $isOpen: p
-      }
-    ),
-    /* @__PURE__ */ i(
-      P,
+        value: "folderType",
+        label: "Folder type",
+        icon: p("folder"),
+        scopes: ["folder", "task"]
+      },
       {
-        target: a.current,
-        id: o,
-        align: "left",
-        onClose: (s) => {
-          s.stopPropagation(), r(!1);
-        },
-        children: /* @__PURE__ */ i(z, { menu: t, onClose: () => r(!1) })
-      }
-    )
-  ] });
-}, U = c.tfoot`
-  display: grid !important;
-  position: sticky;
-  bottom: 0;
-  z-index: 10;
-  background-color: var(--md-sys-color-surface-container-lowest);
-`, W = c.tr`
-  display: flex;
-  background-color: var(--md-sys-color-surface-container-low);
-
-  &.clickable {
-    cursor: pointer;
-  }
-`, $ = c.td`
-  position: relative;
-  box-shadow: inset 1px 1px 0 0 var(--md-sys-color-surface-container);
-  background-color: var(--md-sys-color-surface-container-lowest);
-  display: flex;
-  align-items: center;
-  height: 34px !important;
-  padding: 0 !important;
-  overflow: visible;
-
-  &.last-pinned-left {
-    box-shadow: inset 1px 1px 0 0 var(--md-sys-color-surface-container),
-      inset -2px 0 0 0 var(--md-sys-color-surface-container);
-  }
-
-  /* match the special fixed widths used by header/body cells */
-  &.__row_selection__ {
-    width: 20px !important;
-    min-width: unset;
-  }
-  &.drag-handle {
-    width: 24px !important;
-    min-width: unset;
-  }
-`, V = c.div`
-  display: flex;
-  align-items: center;
-  gap: var(--base-gap-small);
-  width: 100%;
-  height: 100%;
-  padding: 0 8px;
-  overflow: hidden;
-  white-space: nowrap;
-  font-size: 14px;
-  color: var(--md-sys-color-on-surface-variant);
-
-  .label {
-    color: var(--md-sys-color-outline);
-  }
-  .value {
-    font-weight: 600;
-    color: var(--md-sys-color-on-surface);
-  }
-`, b = c.div`
-  width: calc(100% - 1px);
-  height: calc(100% - 3px);
-  margin-left: 1px;
-
-  &.selection {
-    width: calc(100% - 3px);
-    margin-left: 1px;
-  }
-`, j = c(b)`
-  position: absolute;
-  inset: 1px 0 2px 1px;
-  width: auto;
-  height: auto;
-  margin: 0;
-  pointer-events: none;
-`, vt = ({
-  columnVirtualizer: t,
-  table: o,
-  virtualPaddingLeft: n,
-  virtualPaddingRight: r,
-  renderCellContent: d,
-  onClick: a,
-  isLoading: p,
-  statsLoading: s,
-  error: l
+        value: "taskType",
+        label: "Task type",
+        icon: p("task"),
+        scopes: ["task", "version"]
+      },
+      {
+        value: "productType",
+        label: "Product type",
+        icon: p("product"),
+        scopes: ["product", "version"]
+      },
+      // {
+      //   value: 'version',
+      //   label: 'Version',
+      //   icon: getAttributeIcon('version'),
+      //   scopes: ['version'],
+      // },
+      // {
+      //   value: 'author',
+      //   label: 'Author',
+      //   icon: getAttributeIcon('author'),
+      //   scopes: ['version'],
+      // },
+      {
+        value: "assignees",
+        label: "Assignee",
+        icon: p("assignees"),
+        scopes: ["task"]
+      },
+      {
+        value: "status",
+        label: "Status",
+        icon: p("status"),
+        scopes: ["task", "version", "folder", "product"]
+      },
+      {
+        value: "tags",
+        label: "Tags",
+        icon: p("tags"),
+        scopes: ["task", "version", "folder", "product"]
+      },
+      ...a.filter((r) => B(r, t, o, s)).map((r) => ({
+        value: "attrib." + r.name,
+        label: r.data.title || r.name,
+        icon: p(r.name)
+      }))
+    ].filter((r) => !t || ("scopes" in r ? r.scopes.includes(t) : !0)).sort((r, m) => {
+      const u = n.indexOf(r.value), c = n.indexOf(m.value);
+      return u === -1 && c === -1 ? 0 : u === -1 ? 1 : c === -1 ? -1 : u - c;
+    }),
+    [a, n, o, s, t]
+  );
+}, P = "data-column-dnd-container", y = 100, Ct = ({
+  columnPinning: o,
+  columnSizing: s
 }) => {
-  const u = [
-    ...o.getLeftVisibleLeafColumns(),
-    ...o.getCenterVisibleLeafColumns(),
-    ...o.getRightVisibleLeafColumns()
-  ], f = t.getVirtualItems(), x = l instanceof Error ? l.message : typeof l == "string" ? l : "";
-  return /* @__PURE__ */ i(U, { children: /* @__PURE__ */ g(
-    W,
-    {
-      className: h({ clickable: !!a }),
-      onClick: a,
-      "data-tooltip": a ? "Power feature" : void 0,
-      children: [
-        n ? /* @__PURE__ */ i("td", { style: { display: "flex", width: n } }) : null,
-        f.map((m) => {
-          const e = u[m.index];
-          if (!e) return null;
-          const k = e.id === w || e.id === C, L = e.getIsPinned() === "left" && e.getIsLastColumn("left");
-          return /* @__PURE__ */ i(
-            $,
-            {
-              className: h(e.id, { "last-pinned-left": L }),
-              style: { ...F(e), width: B(e.id) },
-              children: p ? /* @__PURE__ */ i(
-                b,
-                {
-                  className: h("loading", "shimmer-dark", {
-                    selection: e.id === C
-                  })
-                }
-              ) : l ? e.id === "name" ? /* @__PURE__ */ g(V, { style: { color: "var(--md-sys-color-error)" }, children: [
-                "Error loading stats",
-                /* @__PURE__ */ i(
-                  D,
-                  {
-                    icon: "info",
-                    style: { fontSize: 16, cursor: "help" },
-                    "data-tooltip": x,
-                    "data-tooltip-as": "markdown"
-                  }
-                ),
-                /* @__PURE__ */ i(
-                  v,
-                  {
-                    icon: "content_copy",
-                    "data-tooltip": "Copy error message",
-                    onClick: () => A(x),
-                    iconProps: { style: { fontSize: 16 } },
-                    style: { padding: 2 },
-                    variant: "text"
-                  }
-                )
-              ] }) : null : !k && /* @__PURE__ */ g(y, { children: [
-                d?.(e.id),
-                s && /* @__PURE__ */ i(j, { className: h("loading", "shimmer-dark") })
-              ] })
-            },
-            e.id
-          );
-        }),
-        r ? /* @__PURE__ */ i("td", { style: { display: "flex", width: r } }) : null
-      ]
-    }
-  ) });
-}, q = "th[data-column-id]", G = c.div`
-  position: fixed;
-  z-index: 2000;
-  pointer-events: none;
-  width: 2px;
-  background-color: var(--md-sys-color-primary);
-`, Z = (t, o) => {
-  const n = t.getBoundingClientRect(), r = t.closest("table")?.getBoundingClientRect() ?? n;
+  const t = x(null), n = x(null), a = h(() => {
+    const e = o.left || [];
+    let l = 24;
+    return e.forEach((g) => {
+      l += s[g] || 150;
+    }), l;
+  }, [o.left, s]), r = h(
+    ({ transform: e, activeNodeRect: l, draggingNodeRect: g, active: d }) => {
+      if (t.current === null || !l || d?.data.current?.type && d.data.current.type !== "column") return e;
+      let i = n.current;
+      i === null && (i = (document.querySelector(`[${P}]`)?.getBoundingClientRect().left ?? 0) + a());
+      const C = g?.left ?? l.left;
+      if (t.current) {
+        const b = C + l.width + e.x, f = i + y;
+        if (b > f)
+          return { ...e, x: f - C - l.width };
+      } else {
+        const b = C + e.x, f = i - y;
+        if (b < f)
+          return { ...e, x: f - C };
+      }
+      return e;
+    },
+    [a]
+  ), m = h(
+    (e) => {
+      if (e === null) {
+        t.current = null;
+        return;
+      }
+      t.current = o.left?.includes(e) || !1;
+    },
+    [o.left]
+  ), u = h(() => {
+    t.current = null, n.current = null;
+  }, []), c = h((e) => {
+    n.current = e;
+  }, []);
+  return {
+    restrictToSection: r,
+    setDragPinnedState: m,
+    clearDragPinnedState: u,
+    activePinnedState: t,
+    setCachedBoundary: c
+  };
+}, F = (o, s) => {
+  const t = o.getBoundingClientRect(), n = o.closest("table")?.getBoundingClientRect() ?? t;
   return {
-    left: o === "left" ? n.left - 1 : n.right - 1,
-    top: r.top,
-    height: r.height
+    left: s === "left" ? t.left - 1 : t.right - 1,
+    top: n.top,
+    height: n.height
   };
-}, yt = () => {
-  const { active: t, over: o } = N(), n = t?.data?.current?.type === "column" ? String(t.id) : null, r = o ? String(o.id) : null, [d, a] = M(null);
-  return R(() => {
-    if (!n || !r || n === r) {
-      a(null);
+}, _ = "th[data-column-id]", bt = () => {
+  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);
+  return T(() => {
+    if (!t || !n || t === n) {
+      r(null);
       return;
     }
-    let p = 0;
-    const s = () => {
-      const l = Array.from(
-        document.querySelectorAll(q)
-      ), u = l.find((f) => f.dataset.columnId === r);
-      if (u) {
-        const f = l.findIndex((e) => e.dataset.columnId === n), x = l.indexOf(u), m = Z(u, f < x ? "right" : "left");
-        a(
-          (e) => e && e.left === m.left && e.top === m.top && e.height === m.height ? e : m
+    let m = 0;
+    const u = () => {
+      const c = Array.from(
+        document.querySelectorAll(_)
+      ), e = c.find((l) => l.dataset.columnId === n);
+      if (e) {
+        const l = c.findIndex((i) => i.dataset.columnId === t), g = c.indexOf(e), d = F(e, l < g ? "right" : "left");
+        r(
+          (i) => i && i.left === d.left && i.top === d.top && i.height === d.height ? i : d
         );
       }
-      p = requestAnimationFrame(s);
+      m = requestAnimationFrame(u);
     };
-    return s(), () => cancelAnimationFrame(p);
-  }, [n, r]), d ? E(/* @__PURE__ */ i(G, { style: d }), document.body) : null;
+    return u(), () => cancelAnimationFrame(m);
+  }, [t, n]), a ? R(/* @__PURE__ */ L(I, { style: a }), document.body) : null;
 };
 export {
-  Ct as C,
-  ht as F,
-  xt as H,
-  gt as S,
-  vt as T,
-  H as a,
-  F as b,
-  yt as c,
-  G as d,
-  q as e,
-  Z as f,
-  B as g
+  _ as C,
+  bt as T,
+  P as a,
+  O as b,
+  ht as c,
+  F as g,
+  B as i,
+  Ct as u
 };