@ynput/ayon-frontend-shared 0.6.0 → 0.6.1

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

@@ -0,0 +1,281 @@
+import { createContext as _, useContext as u, forwardRef as I } from "react";
+import { jsxs as l, jsx as i, Fragment as S } from "react/jsx-runtime";
+import { Button as p, Icon as z } from "@ynput/ayon-react-components";
+import a from "clsx";
+import n from "styled-components";
+import { R as d, D as f } from "./realtimeUpdatesUtils.es.js";
+import "lodash";
+import "primereact/confirmdialog";
+import "react-toastify";
+import { c as N } from "./copyToClipboard.es.js";
+import "uuid";
+import "./searchTerms.es.js";
+const D = (t) => {
+  const o = t.getIsPinned(), s = t.id !== d && t.id !== f ? -30 : 0;
+  return {
+    left: o === "left" ? `${t.getStart("left") + s}px` : void 0,
+    right: o === "right" ? `${t.getAfter("right")}px` : void 0,
+    position: o ? "sticky" : "relative",
+    width: t.getSize(),
+    zIndex: o ? 100 : 0
+  };
+}, E = (t) => `calc(var(--col-${t}-size) * 1px)`, g = _(void 0), Q = () => {
+  const t = u(g);
+  if (!t)
+    throw new Error("useFeedback must be used within a FeedbackProvider");
+  return t;
+}, X = () => u(g), Y = I(({ ...t }, o) => /* @__PURE__ */ l(
+  "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"
+        }
+      )
+    ]
+  }
+)), M = n(p)`
+  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;
+  }
+`, tt = ({ selected: t, style: o, ...s }) => /* @__PURE__ */ i(
+  M,
+  {
+    ...s,
+    selected: t,
+    className: a(s.className, "action", { selected: t }),
+    variant: "text",
+    style: { ...o }
+  }
+), ot = n(p)`
+  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;
+  `}
+`, R = n.tfoot`
+  display: grid !important;
+  position: sticky;
+  bottom: 0;
+  z-index: 10;
+  background-color: var(--md-sys-color-surface-container-lowest);
+`, A = n.tr`
+  display: flex;
+  background-color: var(--md-sys-color-surface-container-low);
+
+  &.clickable {
+    cursor: pointer;
+  }
+`, B = n.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;
+  }
+`, P = n.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);
+  }
+`, x = n.div`
+  width: calc(100% - 1px);
+  height: calc(100% - 3px);
+  margin-left: 1px;
+
+  &.selection {
+    width: calc(100% - 3px);
+    margin-left: 1px;
+  }
+`, O = n(x)`
+  position: absolute;
+  inset: 1px 0 2px 1px;
+  width: auto;
+  height: auto;
+  margin: 0;
+  pointer-events: none;
+`, et = ({
+  columnVirtualizer: t,
+  table: o,
+  virtualPaddingLeft: s,
+  virtualPaddingRight: m,
+  renderCellContent: v,
+  onClick: c,
+  isLoading: w,
+  statsLoading: y,
+  error: r
+}) => {
+  const C = [
+    ...o.getLeftVisibleLeafColumns(),
+    ...o.getCenterVisibleLeafColumns(),
+    ...o.getRightVisibleLeafColumns()
+  ], b = t.getVirtualItems(), h = r instanceof Error ? r.message : typeof r == "string" ? r : "";
+  return /* @__PURE__ */ i(R, { children: /* @__PURE__ */ l(
+    A,
+    {
+      className: a({ clickable: !!c }),
+      onClick: c,
+      "data-tooltip": c ? "Power feature" : void 0,
+      children: [
+        s ? /* @__PURE__ */ i("td", { style: { display: "flex", width: s } }) : null,
+        b.map((k) => {
+          const e = C[k.index];
+          if (!e) return null;
+          const L = e.id === f || e.id === d, F = e.getIsPinned() === "left" && e.getIsLastColumn("left");
+          return /* @__PURE__ */ i(
+            B,
+            {
+              className: a(e.id, { "last-pinned-left": F }),
+              style: { ...D(e), width: E(e.id) },
+              children: w ? /* @__PURE__ */ i(
+                x,
+                {
+                  className: a("loading", "shimmer-dark", {
+                    selection: e.id === d
+                  })
+                }
+              ) : r ? e.id === "name" ? /* @__PURE__ */ l(P, { style: { color: "var(--md-sys-color-error)" }, children: [
+                "Error loading stats",
+                /* @__PURE__ */ i(
+                  z,
+                  {
+                    icon: "info",
+                    style: { fontSize: 16, cursor: "help" },
+                    "data-tooltip": h,
+                    "data-tooltip-as": "markdown"
+                  }
+                ),
+                /* @__PURE__ */ i(
+                  p,
+                  {
+                    icon: "content_copy",
+                    "data-tooltip": "Copy error message",
+                    onClick: () => N(h),
+                    iconProps: { style: { fontSize: 16 } },
+                    style: { padding: 2 },
+                    variant: "text"
+                  }
+                )
+              ] }) : null : !L && /* @__PURE__ */ l(S, { children: [
+                v?.(e.id),
+                y && /* @__PURE__ */ i(O, { className: a("loading", "shimmer-dark") })
+              ] })
+            },
+            e.id
+          );
+        }),
+        m ? /* @__PURE__ */ i("td", { style: { display: "flex", width: m } }) : null
+      ]
+    }
+  ) });
+}, it = n.div`
+  position: fixed;
+  z-index: 2000;
+  pointer-events: none;
+  width: 2px;
+  background-color: var(--md-sys-color-primary);
+`;
+export {
+  ot as C,
+  g as F,
+  tt as H,
+  Y as S,
+  et as T,
+  it as a,
+  Q as b,
+  D as c,
+  E as g,
+  X as u
+};

package/dist/chunks/ColumnHeaderMenuUI.es.js

@@ -0,0 +1,52 @@
+import { jsxs as a, Fragment as l, jsx as n } from "react/jsx-runtime";
+import { useRef as u } from "react";
+import "@module-federation/enhanced/runtime";
+import "./searchTerms.es.js";
+import "./getUris.es.js";
+import "primereact/confirmdialog";
+import { u as f } from "./DeleteEntitiesContextInstance.es.js";
+import "lodash";
+import "react-toastify";
+import "uuid";
+import "semver";
+import "@ynput/ayon-react-components";
+import "./ContextMenuContextInstance.es.js";
+import "clsx";
+import "react-dom";
+import "react-redux";
+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;
+  return e.length === 0 ? null : /* @__PURE__ */ a(l, { children: [
+    /* @__PURE__ */ n(
+      C,
+      {
+        ref: i,
+        className: p,
+        onClick: (o) => {
+          o.stopPropagation(), r(t);
+        },
+        onPointerDown: (o) => o.stopPropagation(),
+        icon: "more_horiz",
+        $isOpen: s
+      }
+    ),
+    /* @__PURE__ */ n(
+      c,
+      {
+        target: i.current,
+        id: t,
+        align: "left",
+        onClose: (o) => {
+          o.stopPropagation(), r(!1);
+        },
+        children: /* @__PURE__ */ n(g, { menu: e, onClose: () => r(!1) })
+      }
+    )
+  ] });
+};
+export {
+  q as C
+};

package/dist/chunks/ContextMenuContextInstance.es.js

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

package/dist/chunks/DeleteEntitiesConfirmDialog.es.js

@@ -0,0 +1,229 @@
+import { jsx as l, jsxs as d, Fragment as k } from "react/jsx-runtime";
+import { useState as A, useMemo as D } from "react";
+import { Button as $ } from "@ynput/ayon-react-components";
+import { S as x, D as O, f as T, F as L, h as E, C as P, i as M, j as R, k as I, l as _ } from "./DeleteEntitiesContextInstance.es.js";
+import "lodash";
+import "primereact/confirmdialog";
+import "react-toastify";
+import "uuid";
+import { p as u } from "./pluralize.es.js";
+import "./searchTerms.es.js";
+const te = [
+  "annotations",
+  "sharedViews",
+  "listFolders",
+  "groupAttributes",
+  "listAccess",
+  "slicer",
+  "projectFolders",
+  "releases",
+  "advancedFilters",
+  "listAttributes",
+  "commentCategories",
+  "columnSummaries"
+], oe = {
+  annotations: {
+    label: "Annotations",
+    description: "Create detailed visual feedback directly on media files.",
+    bullet: "Advanced media review tools"
+  },
+  projectFolders: {
+    label: "Project Folders",
+    description: "Organize your projects into folders for a cleaner and more structured view.",
+    bullet: "Organize projects into folders"
+  },
+  sharedViews: {
+    label: "Shared Views",
+    description: "Save custom views and share them with team members for better collaboration.",
+    bullet: "Save and share custom views"
+  },
+  listFolders: {
+    label: "List Folders",
+    description: "Organize your lists into folders for a cleaner and more structured view.",
+    bullet: "Organize lists into folders"
+  },
+  groupAttributes: {
+    label: "Group Attributes",
+    description: "Group tasks by assignees, status, or other attributes for better organization.",
+    bullet: "Group tasks by attributes"
+  },
+  commentCategories: {
+    label: "Comment Categories",
+    description: "Organize comments with categories, assign permissions, and use colors for better distinction. Set visibility rules to control who can view specific comments.",
+    bullet: "Enhanced comment organization, permissions, and visibility"
+  },
+  slicer: {
+    label: "Slicer",
+    description: "Advanced filtering system for project organization.",
+    bullet: "Powerful project filtering tools"
+  },
+  releases: {
+    label: "Release History",
+    description: "Access and download the complete archive of releases",
+    bullet: "Full release archive access"
+  },
+  advancedFilters: {
+    label: "Advanced Filters",
+    description: "Customize your view and find your data with powerful filtering options",
+    bullet: "Advanced filtering options"
+  },
+  listAttributes: {
+    label: "List Attributes",
+    description: "Add custom attributes to your lists for better collaboration and organization.",
+    bullet: "Custom attributes for lists"
+  },
+  listAccess: {
+    label: "List Access",
+    description: "Manage and control access to your lists with advanced sharing options.",
+    bullet: "Advanced list sharing options"
+  },
+  columnSummaries: {
+    label: "Column Summaries",
+    description: "Aggregate each column totals, averages, distributions in a summary footer.",
+    bullet: "Per-column summary footer"
+  }
+}, g = [
+  "folder",
+  "task",
+  "product",
+  "version",
+  "representation",
+  "workfile"
+], G = (o) => o.length <= 1 ? o.join("") : `${o.slice(0, -1).join(", ")} and ${o[o.length - 1]}`, se = (o) => {
+  if (o.length === 1) {
+    const e = o[0];
+    return `${e.entityType} "${e.label || e.name || e.id}"`;
+  }
+  const r = {};
+  for (const e of o) r[e.entityType] = (r[e.entityType] || 0) + 1;
+  const a = g.filter((e) => r[e] > 0).map(
+    (e) => u(r[e], e)
+  );
+  return G(a);
+}, ne = (o, r) => {
+  const a = {}, e = (s, t) => {
+    t > 0 && (a[s] = (a[s] || 0) + t);
+  };
+  for (const s of o) e(s.entityType, 1);
+  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) => g.reduce((r, a) => r + (o[a] || 0), 0), C = 8, ie = (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 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(", ")}`);
+    } 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 > C ? [...s.slice(0, C), `…and ${s.length - C} more`] : s;
+}, q = (o, r) => {
+  const a = (o ?? "").trim();
+  return a !== "" && Number(a) === r;
+}, re = ({
+  payload: o,
+  onConfirm: r,
+  onCancel: a
+}) => {
+  const {
+    entityLabel: e,
+    childrenDetails: s,
+    expectedCounts: t,
+    expectedName: n,
+    deleteLabel: f = "Delete forever",
+    message: m
+  } = o, [p, c] = A(""), [v, j] = A({}), w = D(
+    () => g.filter((i) => (t[i] || 0) > 0),
+    [t]
+  ), h = D(() => H(t), [t]), b = h > T, y = !!n && !b, F = b ? w.every((i) => q(v[i], t[i])) : y ? p.trim() === n : !0, S = (i) => {
+    i.key === "Enter" && F && (i.preventDefault(), r());
+  };
+  return /* @__PURE__ */ l(
+    x,
+    {
+      size: "md",
+      isOpen: !0,
+      header: `${f} ${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(L, { onKeyDown: S, children: [
+          y && /* @__PURE__ */ d(k, { children: [
+            /* @__PURE__ */ d(E, { htmlFor: "delete-confirm-name-input", children: [
+              "To confirm delete action, type '",
+              n,
+              "' in the box below"
+            ] }),
+            /* @__PURE__ */ l(
+              P,
+              {
+                id: "delete-confirm-name-input",
+                "data-testid": "delete-confirm-name-input",
+                autoFocus: !0,
+                value: p,
+                placeholder: n,
+                onChange: (i) => c(i.target.value)
+              }
+            )
+          ] }),
+          b && /* @__PURE__ */ d(k, { children: [
+            /* @__PURE__ */ l(E, { as: "p", children: "To confirm, type how many of each will be deleted, children included" }),
+            /* @__PURE__ */ l(M, { children: w.map((i, z) => /* @__PURE__ */ d(R, { children: [
+              /* @__PURE__ */ l("span", { children: `${i[0].toUpperCase()}${i.slice(1)}s - ${t[i]}` }),
+              /* @__PURE__ */ l(
+                I,
+                {
+                  "data-testid": `delete-confirm-count-${i}`,
+                  autoFocus: z === 0,
+                  inputMode: "numeric",
+                  value: v[i] ?? "",
+                  placeholder: `Number of ${i}s`,
+                  onChange: (N) => j((V) => ({ ...V, [i]: N.target.value }))
+                }
+              )
+            ] }, i)) })
+          ] }),
+          /* @__PURE__ */ d(_, { children: [
+            /* @__PURE__ */ l($, { label: "Cancel", onClick: a }),
+            /* @__PURE__ */ l(
+              $,
+              {
+                "data-testid": "delete-confirm-submit",
+                variant: "danger",
+                label: f,
+                onClick: r,
+                disabled: !F
+              }
+            )
+          ] })
+        ] })
+      ),
+      children: /* @__PURE__ */ l(
+        O,
+        {
+          entityLabel: e,
+          childrenDetails: s,
+          message: m,
+          totalLine: h > T ? (
+            // 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.`
+          ) : void 0
+        }
+      )
+    }
+  );
+};
+export {
+  g as D,
+  te as a,
+  re as b,
+  ie as c,
+  se as d,
+  ne as e,
+  oe as p,
+  H as s
+};