@ynput/ayon-frontend-shared 0.4.7 → 0.6.0

package/dist/chunks/FilterErrorActions.es.js

@@ -7,7 +7,7 @@ import { c as B } from "./copyToClipboard.es.js";
 import "uuid";
 import "./searchTerms.es.js";
 import { useState as l, useEffect as u, useContext as k } from "react";
-import { bD as G } from "./getUris.es.js";
+import { bF as G } from "./getUris.es.js";
 import { u as J } from "./GlobalContext.es.js";
 import { F as w } from "./ColumnDropIndicator.es.js";
 const ie = ({ children: i }) => {
@@ -152,9 +152,9 @@ const ie = ({ children: i }) => {
         ...t && { articleId: t }
       }
     });
-  }, [f, b] = l(!1), h = document.getElementById("fb-messenger-root"), D = (e) => h instanceof HTMLElement && (h.style.display = e ? "block" : "none");
+  }, [f, b] = l(!1), h = document.getElementById("fb-messenger-root"), j = (e) => h instanceof HTMLElement && (h.style.display = e ? "block" : "none");
   u(() => {
-    !n || !c || D(f);
+    !n || !c || j(f);
   }, [n, c, f]), u(() => {
     if (!n || !c) return;
     const e = window;
@@ -162,7 +162,7 @@ const ie = ({ children: i }) => {
       b(!1);
     });
   }, [n, c]);
-  const j = (e = "Home", t) => {
+  const D = (e = "Home", t) => {
     const a = window;
     if (typeof a.Featurebase != "function") {
       window.alert("Featurebase SDK is not loaded yet. Please try again later."), console.warn("Featurebase SDK is not loaded yet.");
@@ -200,7 +200,7 @@ const ie = ({ children: i }) => {
     w.Provider,
     {
       value: {
-        openSupport: j,
+        openSupport: D,
         openFeedback: N,
         openPortal: A,
         messengerLoaded: c,

package/dist/chunks/GlobalContext.es.js

@@ -1,52 +1,52 @@
-import { jsx as g } from "react/jsx-runtime";
+import { jsx as L } from "react/jsx-runtime";
 import { createContext as v, useContext as x, useMemo as I } from "react";
 import "./searchTerms.es.js";
-import { ce as C, bn as G, cQ as P, cz as b } from "./getUris.es.js";
+import { cg as C, bp as G, cS as P, cB as b } from "./getUris.es.js";
 import "primereact/confirmdialog";
-const a = v(void 0), A = ({ children: r, skip: e = !1 }) => {
+const a = v(void 0), A = ({ children: r, skip: t = !1 }) => {
   const {
-    data: t = {},
-    isLoading: n,
-    error: i
-  } = C({ full: !0 }, { skip: e }), { data: s, isLoading: u, error: c } = G(), {
+    data: e = {},
+    isLoading: i,
+    error: n
+  } = C({ full: !0 }, { skip: t }), { data: s, isLoading: u, error: c } = G(), {
     data: o = [],
     isLoading: l,
     error: d
-  } = P({}, { skip: e }), f = I(() => o.filter((L) => L.active), [o]), {
-    data: m,
-    isLoading: p,
-    error: j
+  } = P({}, { skip: t }), f = I(() => o.filter((j) => j.active), [o]), {
+    data: p,
+    isLoading: m,
+    error: g
   } = b(void 0, { skip: !s?.name });
-  return /* @__PURE__ */ g(
+  return /* @__PURE__ */ L(
     a.Provider,
     {
       value: {
-        siteInfo: t,
-        attributes: t?.attributes || [],
+        siteInfo: e,
+        attributes: e?.attributes || [],
         user: s,
-        cloudInfo: m,
+        cloudInfo: p,
         projects: {
           all: o,
           active: f
         },
         isLoading: {
-          siteInfo: n,
+          siteInfo: i,
           user: u,
-          cloudInfo: p,
+          cloudInfo: m,
           projects: l
         },
         error: {
-          siteInfo: i,
+          siteInfo: n,
           user: c,
-          cloudInfo: j,
+          cloudInfo: g,
           projects: d
         }
       },
       children: r
     }
   );
-}, M = () => x(a) || {};
+}, B = () => x(a) || {};
 export {
   A as G,
-  M as u
+  B as u
 };

package/dist/chunks/InfoMessage.es.js

@@ -0,0 +1,146 @@
+import { jsxs as n, jsx as c } from "react/jsx-runtime";
+import { forwardRef as g } from "react";
+import u from "styled-components";
+import m from "clsx";
+import { Icon as s, Button as b } from "@ynput/ayon-react-components";
+const v = u.div`
+  display: flex;
+  align-items: center;
+  justify-content: space-between;
+  gap: 16px;
+  padding: var(--padding-m) var(--padding-l);
+  border-radius: var(--border-radius-m);
+  font-weight: 600;
+
+  .content {
+    display: flex;
+    align-items: center;
+    gap: 16px;
+  }
+
+  .icon {
+    font-size: 24px;
+  }
+
+  &.compact {
+    gap: var(--base-gap-large);
+    padding: var(--padding-s) var(--padding-s) var(--padding-s) var(--padding-m);
+
+    .content {
+      gap: var(--base-gap-large);
+    }
+
+    .icon {
+      font-size: 20px;
+    }
+
+    button {
+      &,
+      &.hasIcon {
+        padding: 2px 6px;
+      }
+      gap: 4px;
+    }
+  }
+
+  /* default background */
+  &.info {
+    --message-background-color: var(--md-sys-color-secondary-container);
+    --message-color: var(--md-sys-color-on-secondary-container);
+    --button-background-color: var(--md-sys-color-secondary);
+    --button-background-color-hover: var(--md-sys-color-secondary-hover);
+    --button-color: var(--md-sys-color-on-secondary);
+  }
+
+  /* warning background */
+  &.warning {
+    --message-background-color: var(--md-sys-color-warning-container);
+    --message-color: var(--md-sys-color-on-warning-container);
+    --button-background-color: var(--md-sys-color-warning);
+    --button-background-color-hover: hsl(25, 100%, 80%);
+    --button-color: var(--md-sys-color-on-warning);
+  }
+
+  /* error background */
+  &.error {
+    --message-background-color: var(--md-sys-color-error-container);
+    --message-color: var(--md-sys-color-on-error-container);
+    --button-background-color: var(--md-sys-color-error);
+    --button-background-color-hover: var(--md-sys-color-error-hover);
+    --button-color: var(--md-sys-color-on-error);
+  }
+
+  /* success background */
+  &.success {
+    --message-background-color: var(--md-sys-color-tertiary-container);
+    --message-color: var(--md-sys-color-on-tertiary-container);
+    --button-background-color: var(--md-sys-color-tertiary);
+    --button-background-color-hover: var(--md-sys-color-tertiary-hover);
+    --button-color: var(--md-sys-color-on-tertiary);
+  }
+
+  background-color: var(--message-background-color);
+  &,
+  .icon {
+    color: var(--message-color);
+  }
+
+  button {
+    &,
+    &.hasIcon {
+      padding: 4px;
+    }
+    background-color: var(--button-background-color);
+    &,
+    .icon {
+      color: var(--button-color);
+    }
+    &:hover {
+      background-color: var(--button-background-color-hover);
+    }
+  }
+`, w = g(
+  ({ variant: r = "info", message: e, icon: t, action: o, compact: d, ...a }, l) => /* @__PURE__ */ n(
+    v,
+    {
+      ...a,
+      className: m("message", a.className, r, { compact: d }),
+      ref: l,
+      children: [
+        /* @__PURE__ */ n("div", { className: "content", children: [
+          /* @__PURE__ */ c(s, { icon: t || p(r) }),
+          e
+        ] }),
+        o && /* @__PURE__ */ n(
+          b,
+          {
+            icon: o.iconPosition === "right" ? void 0 : o.icon,
+            onClick: (i) => {
+              i.stopPropagation(), o.callback();
+            },
+            children: [
+              o.label,
+              o.iconPosition === "right" && /* @__PURE__ */ c(s, { icon: o.icon })
+            ]
+          }
+        )
+      ]
+    }
+  )
+), p = (r) => {
+  switch (r) {
+    case "info":
+      return "info";
+    case "warning":
+      return "warning";
+    case "error":
+      return "error";
+    case "success":
+      return "done_all";
+    default:
+      return "info";
+  }
+};
+export {
+  w as I
+};

package/dist/chunks/Menu.es.js

@@ -4,7 +4,7 @@ import { jsx as L, jsxs as Q, Fragment as yt } from "react/jsx-runtime";
 import X, { useRef as Z, useEffect as U, useLayoutEffect as st, useState as lt, useCallback as bt } from "react";
 import { M as xt, a as Et, b as Pt, c as K, D as $, d as Lt, e as Rt, S as Ct, F as St } from "./MenuItem.es.js";
 import { Icon as Tt, Button as Ot } from "@ynput/ayon-react-components";
-import { u as ct } from "./useLocalStorage.es.js";
+import { a as ct } from "./useLocalStorage.es.js";
 import { u as at } from "./MenuContext.es.js";
 import { createPortal as kt } from "react-dom";
 import Dt from "clsx";
@@ -395,10 +395,10 @@ const it = "ayon-menu-dialog", ft = "ayon-menu-content", ne = ({
 };
 export {
   te as E,
-  ft as M,
-  ee as a,
-  it as b,
-  oe as c,
-  ne as d,
+  ne as M,
+  oe as a,
+  ee as b,
+  ft as c,
+  it as d,
   ot as e
 };

package/dist/chunks/MenuContext.es.js

@@ -1,263 +1,74 @@
-import { jsx as C } from "react/jsx-runtime";
-import { createContext as N, useState as g, useEffect as T, useCallback as p, useContext as A, useRef as ae } from "react";
-import { u as ue, r as pe, w as de } from "./useLocalStorage.es.js";
+import { jsx as d } from "react/jsx-runtime";
+import { createContext as p, useState as f, useEffect as P, useCallback as v, useContext as U } from "react";
 import "lodash";
 import "primereact/confirmdialog";
 import "react-toastify";
 import "uuid";
-import { p as le, b as fe, g as ge } from "./getBundleMode.es.js";
+import { p as b, b as E } from "./uriUtils.es.js";
 import "./searchTerms.es.js";
-import { cW as Se } from "./getUris.es.js";
-const Me = "uri", V = N(void 0), Le = ({ children: e }) => {
-  const t = location.pathname, [n, s] = g(""), c = ["projects", "settings", "dashboard/tasks"];
-  T(() => {
-    c.some((v) => t.startsWith(`/${v}`)) || s("");
-  }, [t, s]);
-  const { type: u, entity: a, settings: i } = le(n), o = p(
-    ({ projectName: l, folderPath: v, taskName: x, productName: M, versionName: L }) => {
-      const m = fe({ projectName: l, folderPath: v, taskName: x, productName: M, versionName: L });
-      s(m);
+import { cY as I } from "./getUris.es.js";
+const L = "uri", x = p(void 0), N = ({ children: e }) => {
+  const r = location.pathname, [o, t] = f(""), a = ["projects", "settings", "dashboard/tasks"];
+  P(() => {
+    a.some((u) => r.startsWith(`/${u}`)) || t("");
+  }, [r, t]);
+  const { type: i, entity: l, settings: c } = b(o), s = v(
+    ({ projectName: n, folderPath: u, taskName: h, productName: C, versionName: w }) => {
+      const y = E({ projectName: n, folderPath: u, taskName: h, productName: C, versionName: w });
+      t(y);
     },
-    [s]
-  ), [S] = Se(), w = p(async () => {
-    if (u !== "entity" || !n) return [];
+    [t]
+  ), [m] = I(), g = v(async () => {
+    if (i !== "entity" || !o) return [];
     try {
-      const l = await S({ resolveRequestModel: { uris: [n] } }).unwrap();
-      return console.log("Resolved entity from URI:", l), l;
-    } catch (l) {
-      return console.warn("Failed to resolve URI:", l), [];
-    }
-  }, [S, n, u]), d = {
-    uri: n,
-    uriType: u,
-    entity: a,
-    settings: i,
-    setUri: s,
-    setEntityUri: o,
-    getUriEntities: w
-  };
-  return /* @__PURE__ */ C(V.Provider, { value: d, children: e });
-}, we = () => {
-  const e = A(V);
-  if (e === void 0)
-    throw new Error("useURIContext must be used within a URIProvider");
-  return e;
-}, U = (e, t = null) => {
-  if (!e) return t;
-  try {
-    return JSON.parse(e);
-  } catch {
-    return t;
-  }
-}, Re = (e, t) => {
-  if (typeof window > "u") return t;
-  try {
-    return U(sessionStorage.getItem(e), t);
-  } catch {
-    return t;
-  }
-}, De = (e, t) => {
-  if (!(typeof window > "u"))
-    try {
-      sessionStorage.setItem(e, JSON.stringify(t)), window.dispatchEvent(new Event("session-storage"));
+      const n = await m({ resolveRequestModel: { uris: [o] } }).unwrap();
+      return console.log("Resolved entity from URI:", n), n;
     } catch (n) {
-      console.error(n);
-    }
-};
-function Y(e, t) {
-  const n = ae(t);
-  n.current = t;
-  const [s, c] = g(() => typeof window > "u" ? t : U(sessionStorage.getItem(e), t));
-  T(() => {
-    const a = sessionStorage.getItem(e);
-    c(U(a, n.current)), a || sessionStorage.setItem(e, JSON.stringify(n.current));
-    function i(o) {
-      if ("key" in o && o.key && o.key !== e) return;
-      const S = sessionStorage.getItem(e);
-      c(U(S, n.current));
-    }
-    return window.addEventListener("session-storage", i), window.addEventListener("storage", i), () => {
-      window.removeEventListener("session-storage", i), window.removeEventListener("storage", i);
-    };
-  }, [e]);
-  const u = p(
-    (a) => {
-      try {
-        c((i) => {
-          const o = typeof a == "function" ? a(i) : a;
-          return sessionStorage.setItem(e, JSON.stringify(o)), typeof window < "u" && window.dispatchEvent(new Event("session-storage")), o;
-        });
-      } catch (i) {
-        console.error(i);
-      }
-    },
-    [e]
-  );
-  return [s, u];
-}
-const q = N(void 0), ye = ["feed", "subtasks", "details", "files"], H = (e) => typeof e == "string" && ye.includes(e), Ce = ({
-  children: e,
-  defaultTab: t = "feed",
-  hasLicense: n,
-  debug: s = {},
-  ...c
-}) => {
-  const u = c.user, a = ge(u), i = "isGuest" in s ? s.isGuest : u?.data?.isGuest, { powerLicense: o, setPowerpackDialog: S } = ue(), w = "hasLicense" in s ? s.hasLicense : !!o || n, [d, l] = g({}), [v, x] = g([]), M = p(
-    (r) => d[r] ? d[r] : !1,
-    [d]
-  ), L = p(
-    (r, y) => {
-      const f = { ...d };
-      f[r] = y, l(f);
-    },
-    [d]
-  ), [m, $] = Y(b, {}), z = p(
-    (r) => {
-      const y = m[r];
-      return H(y) ? y : t;
-    },
-    [m, t]
-  ), [B, F] = g(null), Q = p((r) => {
-    F(r);
-  }, []), j = p(() => {
-    F(null), B && D([]);
-  }, []);
-  T(() => {
-    j();
-  }, [c.useLocation().pathname]);
-  const [X, _] = g(null), Z = p((r) => {
-    _(r);
-  }, []), k = p(() => {
-    _(null);
-  }, []), [ee, R] = g(null), [te, D] = g([]), { uriType: ne, uri: se, entity: h, getUriEntities: oe } = we(), [P] = c.useSearchParams(), E = P.get("project"), O = P.get("type"), I = P.get("id"), J = P.get("activity");
-  T(() => {
-    if (!(!E && !O && !I)) {
-      if (ne === "entity" && h && h.entityType !== "product") {
-        oe().then((r) => {
-          if (r.length === 0) return;
-          const y = r.find((ce) => ce.uri === se), f = y?.entities?.[0];
-          if (!y || !f) return;
-          const G = f?.projectName || h.projectName || "", W = f.representationId || f.versionId || f.productId || f.taskId || f.folderId;
-          if (!G || !W) return;
-          const re = {
-            entityType: h.entityType,
-            entities: [
-              {
-                id: W,
-                projectName: G
-              }
-            ],
-            source: "uri"
-          };
-          R(re);
-        }).catch((r) => {
-          console.warn("Failed to get URI entities:", r);
-        });
-        return;
-      }
-      E && O && I && (R({
-        entityType: O,
-        entities: [
-          {
-            id: I,
-            projectName: E
-          }
-        ],
-        source: "url"
-      }), J && (D([J]), $({
-        ...m,
-        overview: "feed"
-      })));
+      return console.warn("Failed to resolve URI:", n), [];
     }
-  }, [E, O, I]);
-  const ie = {
-    // open state for the panel by scope
-    panelOpenByScope: d,
-    getOpenForScope: M,
-    setPanelOpen: L,
-    setPanelOpenByScope: l,
-    // tab preferences
-    tabsByScope: m,
-    getTabForScope: z,
-    // slide out state
-    slideOut: B,
-    openSlideOut: Q,
-    closeSlideOut: j,
-    // highlighted activities
-    highlightedActivities: te,
-    setHighlightedActivities: D,
-    // PiP state
-    pip: X,
-    openPip: Z,
-    closePip: k,
-    // entities state
-    entities: ee,
-    setEntities: R,
-    feedAnnotations: v,
-    setFeedAnnotations: x,
-    bundleMode: a,
-    isGuest: i,
-    hasLicense: w,
-    onPowerFeature: S,
-    ...c
+  }, [m, o, i]), R = {
+    uri: o,
+    uriType: i,
+    entity: l,
+    settings: c,
+    setUri: t,
+    setEntityUri: s,
+    getUriEntities: g
   };
-  return /* @__PURE__ */ C(q.Provider, { value: ie, children: e });
-}, me = () => {
-  const e = A(q);
+  return /* @__PURE__ */ d(x.Provider, { value: R, children: e });
+}, T = () => {
+  const e = U(x);
   if (e === void 0)
-    throw new Error("useDetailsPanel must be used within a DetailsPanelProvider");
+    throw new Error("useURIContext must be used within a URIProvider");
   return e;
-}, b = "details/tabs-by-scope", Ne = (e, t) => {
-  const n = pe(b, {});
-  de(b, { ...n, [e]: t });
-}, Ae = (e) => {
-  const { getOpenForScope: t, setPanelOpen: n, getTabForScope: s } = me(), [c, u] = Y(b, {}), a = c[e], i = H(a) ? a : s(e), o = p(
-    (w) => {
-      u((d) => ({ ...d, [e]: w }));
-    },
-    [e, u]
-  ), S = i === "feed";
-  return {
-    isOpen: t(e),
-    setOpen: (w) => n(e, w),
-    currentTab: i,
-    setTab: o,
-    isFeed: S
-  };
-}, K = N(void 0), Be = ({ children: e, useNavigate: t }) => {
-  const [n, s] = g(!1), c = t(), i = {
-    menuOpen: n,
-    setMenuOpen: (o) => {
-      s(o);
+}, V = p(void 0), M = p(void 0), W = ({ children: e, useNavigate: r }) => {
+  const [o, t] = f(!1), a = r(), c = {
+    menuOpen: o,
+    setMenuOpen: (s) => {
+      t(s);
     },
-    toggleMenuOpen: (o) => {
-      if (!o) {
-        s(!1);
+    toggleMenuOpen: (s) => {
+      if (!s) {
+        t(!1);
         return;
       }
-      s(o === n ? !1 : o);
+      t(s === o ? !1 : s);
     },
-    navigate: c
+    navigate: a
   };
-  return /* @__PURE__ */ C(K.Provider, { value: i, children: e });
-}, Fe = () => {
-  const e = A(K);
+  return /* @__PURE__ */ d(M.Provider, { value: c, children: e });
+}, Y = () => {
+  const e = U(M);
   if (e === void 0)
     throw new Error("useMenuContext must be used within a MenuProvider");
   return e;
 };
 export {
-  Ce as D,
-  Be as M,
-  Le as U,
-  K as a,
-  Me as b,
-  me as c,
-  Ae as d,
-  we as e,
-  Y as f,
-  Re as r,
-  Ne as s,
-  Fe as u,
-  De as w
+  V as D,
+  W as M,
+  N as U,
+  M as a,
+  L as b,
+  T as c,
+  Y as u
 };

package/dist/chunks/MenuItem.es.js

@@ -5,7 +5,7 @@ import r, { keyframes as z } from "styled-components";
 import { isArray as E } from "lodash";
 import { Link as L } from "react-router-dom";
 import P from "clsx";
-import { u as G } from "./useLocalStorage.es.js";
+import { a as G } from "./useLocalStorage.es.js";
 const u = 42, S = 8, Q = u + S, V = r.dialog`
   position: fixed;
   margin: 0;