@ynput/ayon-frontend-shared 0.5.0 → 0.6.1

package/dist/chunks/ThumbnailSimple.es.js

@@ -1,63 +1,296 @@
-import { jsx as n, jsxs as y } from "react/jsx-runtime";
-import { Dialog as S, FormRow as m, InputDate as u, SaveButton as k, Icon as j } from "@ynput/ayon-react-components";
-import d from "styled-components";
-import { format as p, parse as h } from "date-fns";
-import "lodash";
+import { jsxs as m, jsx as i } from "react/jsx-runtime";
+import { createPortal as R } from "react-dom";
+import { createContext as z, useContext as L, useEffect as $ } from "react";
+import { aQ as j } from "./searchTerms.es.js";
+import { C as A } from "./getUris.es.js";
 import "primereact/confirmdialog";
+import "lodash";
+import { e as F } from "./expandRelativeDates.es.js";
+import "@module-federation/enhanced/runtime";
+import "./DeleteEntitiesContextInstance.es.js";
 import "react-toastify";
 import "uuid";
-import { g as E } from "./getThumbnailUrl.es.js";
-import "./searchTerms.es.js";
-const B = d.div`
+import "semver";
+import { Icon as w, Dialog as N, FormRow as v, InputDate as x, SaveButton as B } from "@ynput/ayon-react-components";
+import "./ContextMenuContextInstance.es.js";
+import "clsx";
+import "react-redux";
+import { U } from "./PlayableIcon.es.js";
+import p, { keyframes as O } from "styled-components";
+import { a as K } from "./EntityTooltip.es.js";
+import { format as b, parse as k } from "date-fns";
+import { g as P } from "./getThumbnailUrl.es.js";
+const Y = new Set(Object.keys(A).filter((e) => e !== "activity")), D = {
+  has_attachments: "activity_data.files",
+  // not `entity_type`: on inbox rows that column is always 'user'
+  origin_type: "activity_data.origin.type"
+}, q = (e) => !!e && "key" in e, H = (e) => {
+  const t = D[e.key] ?? e.key;
+  if (e.key === "has_attachments")
+    return e.value ? { key: t, operator: "ne", value: [] } : null;
+  if (e.key === "in_review_session")
+    return e.value ? { key: "activity_data.entityList", operator: "notnull" } : null;
+  if (e.key === "category") {
+    const o = Array.isArray(e.value) ? e.value : [], n = o.includes("__none__"), s = o.filter((a) => a !== "__none__"), l = {
+      operator: "or",
+      conditions: [
+        { key: "activity_data.category", operator: "isnull" },
+        { key: "activity_data.category", operator: "eq", value: "" }
+      ]
+    }, c = {
+      key: "activity_data.category",
+      operator: "in",
+      value: s
+    };
+    return n && s.length ? { operator: "or", conditions: [l, c] } : n ? l : s.length ? c : null;
+  }
+  return e.key === "body" && e.operator === "like" && typeof e.value == "string" ? { ...e, key: t, value: `%${e.value}%` } : e.key === "author" ? {
+    operator: "or",
+    conditions: [
+      { ...e, key: "activity_data.author" },
+      { ...e, key: "activity_data.assignee" }
+    ]
+  } : { ...e, key: t };
+}, C = (e) => {
+  if (q(e))
+    return Y.has(e.key) ? null : H(e);
+  const t = (e.conditions || []).map((o) => C(o)).filter((o) => o !== null);
+  return t.length === 0 ? null : { operator: e.operator || "and", conditions: t };
+}, Q = (e) => {
+  if (!e || !e.conditions?.length) return null;
+  const t = F(e), o = C(t);
+  return o || null;
+}, $e = (e) => {
+  const t = Q(e);
+  if (t)
+    return JSON.stringify(t);
+}, W = z(void 0), g = () => {
+  const e = L(W);
+  if (!e)
+    throw new Error("useFeedContext must be used within a FeedProvider");
+  return e;
+}, G = () => {
+  const { refTooltip: e, setRefTooltip: t } = g();
+  return [e, (n) => {
+    n && n.id !== e?.id && t(n), n || t(null);
+  }];
+}, J = p.span`
+  display: flex;
+  align-items: center;
+  gap: var(--base-gap-large);
+
+  .thumbnail {
+    width: ${({ $size: e }) => e}px;
+    height: ${({ $size: e }) => e}px;
+
+    .icon {
+      font-size: ${({ $size: e }) => Math.round(e * 0.58)}px;
+    }
+  }
+
+  span {
+    white-space: nowrap;
+  }
+`, V = p.span`
+  display: flex;
+  flex-direction: column;
+
+  .label {
+    color: var(--md-sys-color-outline);
+    font-size: 0.85em;
+  }
+`, E = ({ name: e, fullName: t, showSubtitle: o, size: n = 24 }) => /* @__PURE__ */ m(J, { $size: n, children: [
+  /* @__PURE__ */ i(U, { name: e, size: n }),
+  o ? /* @__PURE__ */ m(V, { children: [
+    /* @__PURE__ */ i("span", { children: t || e }),
+    t && /* @__PURE__ */ i("span", { className: "label", children: e })
+  ] }) : /* @__PURE__ */ i("span", { children: t || e })
+] }), X = O`
+    from {
+        opacity: 0.4;
+        scale: 0.9;
+    }
+    to {
+        opacity: 1;
+        scale: 1;
+    }
+`, M = p.span`
+  display: flex;
+  padding: 8px;
+  gap: var(--base-gap-large);
+  z-index: 100;
+  align-items: center;
+
+  background-color: var(--md-sys-color-surface-container-high);
+  border-radius: var(--border-radius-m);
+
+  position: fixed;
+  transform: translate(-50%, calc(-100% - 4px));
+  box-shadow: 0 0px 4px rgba(0, 0, 0, 0.2);
+  z-index: 9999;
+
+  .thumbnail {
+    width: 40px;
+    height: 40px;
+
+    .icon {
+      font-size: 24px;
+    }
+  }
+
+  animation: ${X} 50ms ease-out;
+  transform-origin: left bottom;
+`, Z = ({ name: e, label: t, pos: o }) => /* @__PURE__ */ i(M, { style: { ...o }, children: /* @__PURE__ */ i(E, { name: e || "", fullName: t, showSubtitle: !0, size: 32 }) }), ee = p(M)`
+  flex-direction: column;
+  align-items: flex-start;
+  gap: 8px;
+  min-width: 180px;
+`, te = p.span`
+  display: flex;
+  align-items: center;
+  gap: var(--base-gap-large);
+
+  .icon {
+    font-size: 20px;
+  }
+`, oe = p.span`
+  display: flex;
+  flex-direction: column;
+
+  span {
+    white-space: nowrap;
+  }
+
+  .label {
+    color: var(--md-sys-color-outline);
+    font-size: 0.85em;
+  }
+`, ne = p.ul`
+  list-style: none;
+  margin: 0;
+  padding: 0;
+  display: flex;
+  flex-direction: column;
+  gap: 4px;
+  width: 100%;
+`, ie = p.li`
+  display: flex;
+  align-items: center;
+`, re = p.span`
+  color: var(--md-sys-color-outline);
+  font-size: 0.85em;
+  padding-left: 32px;
+`, _ = 5, ae = ({ name: e, pos: t }) => {
+  const { projectName: o, users: n } = g(), { data: s = [] } = j.useGetTeamsQuery(
+    { projectName: o, showMembers: !0 },
+    { skip: !o || !e }
+  ), l = s.find((d) => d.name === e), c = l?.members ?? [], a = l?.memberCount ?? 0, r = c.slice(0, _), u = Math.max(0, a - _), f = new Map(n.map((d) => [d.name, d.attrib?.fullName || void 0]));
+  return /* @__PURE__ */ m(ee, { style: { ...t }, children: [
+    /* @__PURE__ */ m(te, { children: [
+      /* @__PURE__ */ i(w, { icon: "group" }),
+      /* @__PURE__ */ m(oe, { children: [
+        /* @__PURE__ */ i("span", { children: e }),
+        l && /* @__PURE__ */ m("span", { className: "label", children: [
+          a,
+          " ",
+          a === 1 ? "member" : "members"
+        ] })
+      ] })
+    ] }),
+    r.length > 0 && /* @__PURE__ */ m(ne, { children: [
+      r.map((d) => /* @__PURE__ */ i(ie, { children: /* @__PURE__ */ i(
+        E,
+        {
+          name: d.name,
+          fullName: f.get(d.name),
+          size: 20
+        }
+      ) }, d.name)),
+      u > 0 && /* @__PURE__ */ m(re, { children: [
+        "+",
+        u,
+        " more"
+      ] })
+    ] })
+  ] });
+}, se = ({ type: e, id: t, pos: o }) => {
+  const { projectInfo: n, projectName: s } = g();
+  return /* @__PURE__ */ i(
+    K,
+    {
+      entityType: e,
+      entityId: t,
+      projectName: s,
+      projectInfo: n,
+      pos: o
+    }
+  );
+}, je = () => {
+  const [e, t] = G(), { type: o, label: n, name: s, pos: l, id: c } = e || {}, a = document.querySelector(".feed ul");
+  return $(() => {
+    if (c) {
+      const r = (u) => {
+        const f = u.target, d = CSS.escape(`ref-${c.replaceAll(".", "-")}`), y = f?.closest(`#${d}`), h = f?.closest("[data-mention-value], .reference");
+        !y && !h && (t(null), document.removeEventListener("mouseover", r), a && a.removeEventListener("scroll", r));
+      };
+      return document.addEventListener("mouseover", r), a && a.addEventListener("scroll", r), () => {
+        document.removeEventListener("mouseover", r), a && a.removeEventListener("scroll", r);
+      };
+    }
+  }, [c, t, a]), c ? R(
+    o === "user" && l ? /* @__PURE__ */ i(Z, { name: s, label: n, pos: l }) : o === "team" && l ? /* @__PURE__ */ i(ae, { name: s, pos: l }) : /* @__PURE__ */ i(se, { type: o, label: n, name: s, pos: l, id: c }),
+    document.body
+  ) : null;
+}, le = p.div`
   display: flex;
   flex-direction: column;
   gap: 12px;
-`, G = ({
-  isOpen: l,
+`, Ae = ({
+  isOpen: e,
   header: t,
   startDate: o,
-  endDate: e,
-  onStartDateChange: r,
-  onEndDateChange: s,
+  endDate: n,
+  onStartDateChange: s,
+  onEndDateChange: l,
   onApply: c,
   onClose: a
-}) => /* @__PURE__ */ n(
-  S,
+}) => /* @__PURE__ */ i(
+  N,
   {
-    isOpen: l,
+    isOpen: e,
     onClose: a,
     header: t,
     size: "sm",
     hideCancelButton: !0,
-    footer: /* @__PURE__ */ n(
-      k,
+    footer: /* @__PURE__ */ i(
+      B,
       {
         label: "Confirm",
         icon: "check",
         onClick: c,
-        active: !!o && !!e && e >= o
+        active: !!o && !!n && n >= o
       }
     ),
-    children: /* @__PURE__ */ y(B, { children: [
-      /* @__PURE__ */ n(m, { label: "Start date", children: /* @__PURE__ */ n(
-        u,
+    children: /* @__PURE__ */ m(le, { children: [
+      /* @__PURE__ */ i(v, { label: "Start date", children: /* @__PURE__ */ i(
+        x,
         {
-          selected: o ? h(o, "yyyy-MM-dd", /* @__PURE__ */ new Date()) : void 0,
-          onChange: (i) => r(i ? p(i, "yyyy-MM-dd") : ""),
+          selected: o ? k(o, "yyyy-MM-dd", /* @__PURE__ */ new Date()) : void 0,
+          onChange: (r) => s(r ? b(r, "yyyy-MM-dd") : ""),
           autoFocus: !0
         }
       ) }),
-      /* @__PURE__ */ n(m, { label: "End date", children: /* @__PURE__ */ n(
-        u,
+      /* @__PURE__ */ i(v, { label: "End date", children: /* @__PURE__ */ i(
+        x,
         {
-          selected: e ? h(e, "yyyy-MM-dd", /* @__PURE__ */ new Date()) : void 0,
-          onChange: (i) => s(i ? p(i, "yyyy-MM-dd") : ""),
+          selected: n ? k(n, "yyyy-MM-dd", /* @__PURE__ */ new Date()) : void 0,
+          onChange: (r) => l(r ? b(r, "yyyy-MM-dd") : ""),
           openToDate: o ? new Date(o) : void 0
         }
       ) })
     ] })
   }
-), z = d.div`
+), ce = p.div`
   position: relative;
   width: 100%;
   max-width: 500px;
@@ -79,7 +312,7 @@ const B = d.div`
     background-color: hsl(220 20% 8%);
     color: var(--md-sys-color-outline);
   }
-`, F = d.img`
+`, de = p.img`
   width: 100%;
   height: 100%;
   object-fit: contain;
@@ -88,41 +321,46 @@ const B = d.div`
   display: block;
   position: absolute;
   inset: 0;
-`, H = ({
-  projectName: l,
+`, Fe = ({
+  projectName: e,
   entityType: t,
   entityId: o,
-  icon: e,
-  thumbnailHash: r,
-  isLoading: s,
+  icon: n,
+  thumbnailHash: s,
+  isLoading: l,
   className: c,
   disabled: a,
-  src: i,
-  onLoad: g,
+  src: r,
+  onLoad: u,
   onError: f,
-  iconOnly: b,
-  ...v
+  iconOnly: d,
+  ...y
 }) => {
-  const w = E({
-    projectName: l,
+  const h = P({
+    projectName: e,
     entityType: t,
     entityId: o,
-    thumbnailHash: r ? String(r) : void 0
-  }), x = t === "project", M = ["product"].includes(t), C = x ? !!l : !!o;
-  return /* @__PURE__ */ y(z, { className: c + " thumbnail", ...v, children: [
-    !s && !a && /* @__PURE__ */ n(j, { icon: e || "image" }),
-    (t && !M && C || i) && !b && /* @__PURE__ */ n(
-      F,
+    thumbnailHash: s ? String(s) : void 0
+  }), T = t === "project", S = ["product"].includes(t), I = T ? !!e : !!o;
+  return /* @__PURE__ */ m(ce, { className: c + " thumbnail", ...y, children: [
+    !l && !a && /* @__PURE__ */ i(w, { icon: n || "image" }),
+    (t && !S && I || r) && !d && /* @__PURE__ */ i(
+      de,
       {
-        alt: `Entity thumbnail ${o || l}`,
-        src: i || w || void 0,
-        onLoad: g,
+        alt: `Entity thumbnail ${o || e}`,
+        src: r || h || void 0,
+        onLoad: u,
         onError: f
       }
     )
   ] });
 };
 export {
-  G as C,
-  H as T
+  je as A,
+  Ae as C,
+  W as F,
+  Fe as T,
+  G as a,
+  $e as b,
+  g as u
 };

package/dist/chunks/VersionUploadContextInstance.es.js

@@ -0,0 +1,12 @@
+import { createContext as n, useContext as t } from "react";
+const e = n(void 0), s = () => {
+  const o = t(e);
+  if (o === void 0)
+    throw new Error("useVersionUploadContext must be used within a VersionUploadProvider");
+  return o;
+}, i = () => t(e) ?? null;
+export {
+  e as V,
+  s as a,
+  i as u
+};

package/dist/chunks/VideoPlayer.es.js

@@ -4,23 +4,19 @@ import { useSearchParams as I, useParams as P, useNavigate as b, useLocation as
 import { toast as A } from "react-toastify";
 import { clearMemoizedPlayables as c, Player as h, compactPlayerControls as E } from "@ynput/ayon-player";
 import { ClipType as F } from "@ynput/ayon-player/model";
-import "./useLocalStorage.es.js";
 import "@module-federation/enhanced/runtime";
-import "semver";
-import "./MenuContext.es.js";
-import "lodash";
+import "./searchTerms.es.js";
+import "./getUris.es.js";
 import "primereact/confirmdialog";
+import { d as D } from "./DeleteEntitiesContextInstance.es.js";
+import "lodash";
 import "uuid";
-import "./searchTerms.es.js";
-import "./DeleteEntitiesContext.es.js";
+import "semver";
+import "@ynput/ayon-react-components";
+import "./ContextMenuContextInstance.es.js";
+import "clsx";
 import "react-dom";
-import { u as D } from "./GlobalContext.es.js";
-import "./ProjectContext.es.js";
-import "./getUris.es.js";
-import "./ProjectFoldersContextInstance.es.js";
 import "react-redux";
-import "./ViewsContext.es.js";
-import "@ynput/ayon-react-components";
 import { P as N } from "./Feed.es.js";
 const R = { loop: !0, audio: !0 }, S = 24, T = "h264", L = {
   activityId: "",
@@ -38,15 +34,15 @@ const R = { loop: !0, audio: !0 }, S = 24, T = "h264", L = {
   productAttributes: {},
   taskAttributes: {},
   path: ""
-}, rt = ({
+}, Z = ({
   id: t,
   name: o,
-  url: r,
-  projectName: e,
-  duration: i,
-  width: s,
-  height: p,
-  fps: a,
+  url: e,
+  projectName: r,
+  duration: s,
+  width: i,
+  height: a,
+  fps: p,
   codec: m
 }) => {
   const { user: f } = D(), n = v(null);
@@ -58,24 +54,24 @@ const R = { loop: !0, audio: !0 }, S = 24, T = "h264", L = {
         fileId: t,
         label: o,
         type: F.VIDEO,
-        url: r,
+        url: e,
         position: 0,
-        fps: a || S,
+        fps: p || S,
         codec: m || T,
-        duration: i,
-        width: s,
-        height: p,
+        duration: s,
+        width: i,
+        height: a,
         context: L
       }
     ],
-    [t, o, r, i, s, p, a, m]
+    [t, o, e, s, i, a, p, m]
   ), y = u(
     () => ({
       router: { useLocation: x, useNavigate: b, useParams: P, useSearchParams: I },
       toast: A,
-      projectName: e
+      projectName: r
     }),
-    [e]
+    [r]
   );
   return /* @__PURE__ */ l(N, { ref: n, children: /* @__PURE__ */ l(
     h,
@@ -92,5 +88,5 @@ const R = { loop: !0, audio: !0 }, S = 24, T = "h264", L = {
   ) });
 };
 export {
-  rt as default
+  Z as default
 };