@ynput/ayon-frontend-shared 0.4.1 → 0.4.3

package/dist/shared/src/components/SyncButton/SyncButton.es.js

@@ -1,136 +1,23 @@
-import { j as d } from "../../../../_virtual/jsx-runtime.es.js";
+import { j as m } from "../../../../_virtual/jsx-runtime.es.js";
 import { Button as R } from "@ynput/ayon-react-components";
 import { forwardRef as A, useState as C, useRef as x, useId as O, useEffect as b, useImperativeHandle as U } from "react";
 import $ from "styled-components";
+import { useAutoSyncSettings as B, useSyncUpdates as I, FORCE_AUTO_SYNC as v } from "../../context/EntityUpdatesContext.es.js";
+import "../Menu/Menu.styled.es.js";
+import "../Menu/MenuItem.es.js";
 import "../../context/RemoteModulesContext.es.js";
 import "../../../../_virtual/runtime.es.js";
 import "../../../../_virtual/semver.es.js";
-import "../../api/base/client.es.js";
-import "../../api/generated/graphql.es.js";
-import "../../api/generated/graphqlLinks.es.js";
-import "../../api/generated/access.es.js";
-import "../../api/generated/actions.es.js";
-import "../../api/generated/activityFeed.es.js";
-import "../../api/generated/addons.es.js";
-import "../../api/generated/anatomy.es.js";
-import "../../api/generated/attributes.es.js";
-import "../../api/generated/authentication.es.js";
-import "../../api/generated/bundles.es.js";
-import "../../api/generated/configuration.es.js";
-import "../../api/generated/dataImport.es.js";
-import "../../api/generated/desktop.es.js";
-import "../../api/generated/entityLists.es.js";
-import "../../api/generated/events.es.js";
-import "../../api/generated/files.es.js";
-import "../../api/generated/folders.es.js";
-import "../../api/generated/inbox.es.js";
-import "../../api/generated/links.es.js";
-import "../../api/generated/market.es.js";
-import "../../api/generated/onboarding.es.js";
-import "../../api/generated/operations.es.js";
-import "../../api/generated/products.es.js";
-import "../../api/generated/projectDashboard.es.js";
-import "../../api/generated/projects.es.js";
-import "../../api/generated/projectFolders.es.js";
-import "../../api/generated/reviewables.es.js";
-import "../../api/generated/services.es.js";
-import "../../api/generated/system.es.js";
-import "../../api/generated/tasks.es.js";
-import "../../api/generated/teams.es.js";
-import "../../api/generated/thumbnails.es.js";
-import "../../api/generated/uRIs.es.js";
-import "../../api/generated/users.es.js";
-import "../../api/generated/versions.es.js";
-import "../../api/generated/workfiles.es.js";
-import "../../api/generated/ynputCloud.es.js";
-import "../../api/generated/grouping.es.js";
-import "../../api/generated/views.es.js";
-import "../../api/queries/actions/getActions.es.js";
-import "../../api/queries/activities/getActivities.es.js";
-import "../../api/queries/activities/updateReaction.es.js";
-import "../../api/queries/activities/getMentions.es.js";
-import "../../api/queries/activities/getCategories.es.js";
-import "../../api/queries/addons/getAddons.es.js";
-import "../../api/queries/addons/updateAddons.es.js";
-import "../../api/queries/attributes/getAttributes.es.js";
-import "../../api/queries/attributes/updateAttributes.es.js";
-import "../../api/queries/authentication/getAuthentication.es.js";
-import "../../api/queries/bundles/getBundles.es.js";
-import "../../api/queries/bundles/updateBundles.es.js";
-import "../../api/queries/cloud/cloud.es.js";
-import "../../api/queries/columnStats/metricTargets.es.js";
-import "../../api/queries/columnStats/groupCounts.es.js";
-import "../../api/queries/config/getConfig.es.js";
-import "../../api/queries/config/updateConfig.es.js";
-import "../../api/queries/entities/getEntity.es.js";
-import "../../api/queries/entities/getEntityPanel.es.js";
-import "../../api/queries/overview/getOverview.es.js";
-import "../../api/queries/overview/updateOverview.es.js";
-import "../../api/queries/versions/getVersionsProducts.es.js";
-import "../../api/queries/links/getEntityLinks.es.js";
-import "../../api/queries/entities/updateEntity.es.js";
-import "../../api/queries/entityLists/getLists.es.js";
-import "../../api/queries/entityLists/updateLists.es.js";
-import "../../api/queries/entityLists/getListsAttributes.es.js";
-import "../../api/queries/entityLists/listItemsColumnStats.es.js";
-import "../../api/queries/entityLists/updateListsAttributes.es.js";
-import "../../api/queries/entityLists/listFolders.es.js";
-import "../../api/queries/folders/getFolders.es.js";
-import "../../api/queries/folders/getFolderDeleteInfo.es.js";
-import "../../api/queries/grouping/getGrouping.es.js";
-import "../../api/queries/links/updateLinks.es.js";
-import "../../api/queries/links/getLinks.es.js";
-import "../../api/queries/permissions/getPermissions.es.js";
-import "../../api/queries/products/createProduct.es.js";
-import "../../api/queries/products/getFolderProducts.es.js";
-import "../../api/queries/project/getProject.es.js";
-import "../../api/queries/project/updateProject.es.js";
-import "../../api/queries/projectFolders/projectFolders.es.js";
-import "../../api/queries/review/getReview.es.js";
-import "../../api/queries/review/updateReview.es.js";
-import "../../api/queries/share/share.es.js";
-import "../../api/queries/system/getSystem.es.js";
-import "../../api/queries/tasks/getTasks.es.js";
-import "../../api/queries/tasks/updateTasks.es.js";
-import "../../api/queries/teams/getTeams.es.js";
-import "../../api/queries/userDashboard/getUserDashboard.es.js";
-import "../../api/queries/users/getUsers.es.js";
-import "../../api/queries/users/updateUsers.es.js";
-import "../../api/queries/users/guests.es.js";
-import "../../api/queries/versions/updateVersions.es.js";
-import "../../api/queries/views/getViews.es.js";
-import "../../api/queries/views/updateViews.es.js";
-import "../../api/queries/watchers/getWatchers.es.js";
-import "../../api/queries/uris/getUris.es.js";
+import "../../context/PowerpackContextInstance.es.js";
+import { useMenuContext as L } from "../../context/MenuContext.es.js";
+import "react-dom";
+import K from "clsx";
 import "lodash";
 import "react-toastify";
-import "react-redux";
-import "custom-protocol-check";
-import "../../containers/ProjectTreeTable/components/GroupSettingsFallback.es.js";
 import "uuid";
-import { shouldBlockShortcuts as B } from "../../util/keyboardShortcuts.es.js";
+import { shouldBlockShortcuts as N } from "../../util/keyboardShortcuts.es.js";
+import "../../api/queries/users/updateUsers.es.js";
 import "../../util/pubsub.es.js";
-import "../../context/PowerpackContextInstance.es.js";
-import "../../context/UriContext.es.js";
-import "../../context/DetailsPanelContextInstance.es.js";
-import "../../context/SubtasksModulesContextInstance.es.js";
-import "../../context/ThumbnailUploaderContext.es.js";
-import "../../context/SettingsPanelContext.es.js";
-import "../../context/pip/PiPProvider.es.js";
-import "react-dom";
-import "../../context/pip/PiPWrapper.es.js";
-import "../../context/AddonProjectContext.es.js";
-import "../../context/AddonContext.es.js";
-import { useMenuContext as I } from "../../context/MenuContext.es.js";
-import "../../context/WebsocketContext.es.js";
-import "../../context/GlobalContext.es.js";
-import "../../context/ProjectContext.es.js";
-import "../../context/ProjectFoldersContextInstance.es.js";
-import { useAutoSyncSettings as L, useSyncUpdates as K, FORCE_AUTO_SYNC as v } from "../../context/EntityUpdatesContext.es.js";
-import "../../context/DeleteEntitiesContext.es.js";
-import "../Menu/Menu.styled.es.js";
-import "../Menu/MenuItem.es.js";
-import N from "clsx";
 const _ = $(R)`
   /* put above the menu so it's still clickable */
   /* NOTE: this will need fixing as this also puts it above dialogs */
@@ -184,76 +71,76 @@ $.div`
     font-weight: 600;
   }
 `;
-const z = (i, p, m) => {
-  const t = `${p}${m === 1 ? "" : "s"}`;
-  return i === "created" ? `new ${t}` : i === "deleted" ? `${t} deleted` : `${m} ${t} ${i.replaceAll("_", " ")}`;
-}, D = (i) => {
-  const p = /* @__PURE__ */ new Map();
-  return i.forEach((t) => {
-    const [, e, o] = t.topic.split(".");
-    if (!e || !o) return;
-    const c = `${e}.${o}`, n = p.get(c) || {
-      entityType: e,
-      updateType: o,
+const z = (n, s, i) => {
+  const t = `${s}${i === 1 ? "" : "s"}`;
+  return n === "created" ? `new ${t}` : n === "deleted" ? `${t} deleted` : `${i} ${t} ${n.replaceAll("_", " ")}`;
+}, D = (n) => {
+  const s = /* @__PURE__ */ new Map();
+  return n.forEach((t) => {
+    const [, r, e] = t.topic.split(".");
+    if (!r || !e) return;
+    const p = `${r}.${e}`, a = s.get(p) || {
+      entityType: r,
+      updateType: e,
       ids: /* @__PURE__ */ new Set()
     };
-    n.ids.add(t.entityId || String(t.id)), p.set(c, n);
-  }), `${Array.from(p.values()).map(
-    ({ entityType: t, updateType: e, ids: o }) => z(e, t, o.size)
+    a.ids.add(t.entityId || String(t.id)), s.set(p, a);
+  }), `${Array.from(s.values()).map(
+    ({ entityType: t, updateType: r, ids: e }) => z(r, t, e.size)
   ).join(", ")} since last sync`;
-}, yr = A(
-  ({ projectNames: i, topics: p, onSync: m, shouldSyncOnUpdate: t, hideWhenNoUpdates: e = !1, ...o }, c) => {
-    const [n, f] = C(!1), [y, F] = L(), { setMenuOpen: g } = I(), S = x(null), s = x(), E = O();
+}, lt = A(
+  ({ projectNames: n, topics: s, onSync: i, shouldSyncOnUpdate: t, hideWhenNoUpdates: r = !1, ...e }, p) => {
+    const [a, f] = C(!1), [y, F] = B(), { setMenuOpen: g } = L(), S = x(null), c = x(), E = O();
     b(() => () => {
-      const a = s.current;
-      s.current = void 0, a !== void 0 && clearTimeout(a);
-    }, []), U(c, () => S.current, []);
-    const u = async () => {
+      const l = c.current;
+      c.current = void 0, l !== void 0 && clearTimeout(l);
+    }, []), U(p, () => S.current, []);
+    const d = async () => {
       f(!0);
       try {
-        await m?.(h);
+        await i?.(h);
       } finally {
         f(!1);
       }
-    }, { updates: h, hasUpdates: l } = K({
-      projectNames: i,
-      topics: p,
-      isSyncing: n,
+    }, { updates: h, hasUpdates: u } = I({
+      projectNames: n,
+      topics: s,
+      isSyncing: a,
       shouldSyncOnUpdate: t
     });
     if (b(() => {
-      const a = (r) => {
-        r.repeat || !r.shiftKey || r.ctrlKey || r.metaKey || r.key.toLowerCase() !== "r" || B(r) || (r.preventDefault(), r.stopPropagation(), u());
+      const l = (o) => {
+        o.repeat || !o.shiftKey || o.ctrlKey || o.metaKey || o.key.toLowerCase() !== "r" || N(o) || (o.preventDefault(), o.stopPropagation(), d());
       };
-      return window.addEventListener("keydown", a), () => window.removeEventListener("keydown", a);
-    }, [u]), e && !l) return null;
+      return window.addEventListener("keydown", l), () => window.removeEventListener("keydown", l);
+    }, [d]), r && !u) return null;
     const T = D(h), j = Object.values(y).some(Boolean);
     Object.values(y).every(Boolean);
     const w = () => {
-      s.current && clearTimeout(s.current);
+      c.current && clearTimeout(c.current);
     }, k = () => {
       w(), g(E);
     }, M = () => {
-      w(), s.current = setTimeout(() => g(!1), 100);
+      w(), c.current = setTimeout(() => g(!1), 100);
     };
-    return /* @__PURE__ */ d.jsxs(d.Fragment, { children: [
-      /* @__PURE__ */ d.jsx(
+    return /* @__PURE__ */ m.jsxs(m.Fragment, { children: [
+      /* @__PURE__ */ m.jsx(
         _,
         {
-          ...o,
+          ...e,
           icon: "sync",
           ref: S,
-          onClick: u,
+          onClick: d,
           onMouseEnter: k,
           onMouseLeave: M,
-          className: N(o.className, {
-            syncing: n,
-            "has-updates": l,
+          className: K(e.className, {
+            syncing: a,
+            "has-updates": u,
             "auto-sync": j && !v
           }),
           "data-shortcut": "Shift+R",
-          "data-tooltip": l ? T : "Refresh data",
-          variant: l ? "filled" : "surface"
+          "data-tooltip": u ? T : "Refresh data",
+          variant: u ? "filled" : "surface"
         }
       ),
       !v
@@ -261,6 +148,6 @@ const z = (i, p, m) => {
   }
 );
 export {
-  yr as SyncButton
+  lt as SyncButton
 };
 //# sourceMappingURL=SyncButton.es.js.map

package/dist/shared/src/components/SyncButton/SyncButton.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SyncButton.es.js","sources":["../../../../../src/components/SyncButton/SyncButton.tsx"],"sourcesContent":["import { Button, ButtonProps, InputSwitch } from '@ynput/ayon-react-components'\nimport { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport {\n  FORCE_AUTO_SYNC,\n  OnSyncDataCallback,\n  RTEntityUpdate,\n  TopicUpdateType,\n  useAutoSyncSettings,\n  useSyncUpdates,\n} from '@shared/context'\nimport { Menu, MenuContainer } from '../Menu'\nimport { useMenuContext } from '@shared/context'\nimport clsx from 'clsx'\nimport { shouldBlockShortcuts } from '@shared/util'\n\nconst UPDATE_TYPES: { updateTypes: TopicUpdateType[]; label: string; tooltip?: string }[] = [\n  {\n    updateTypes: ['created'],\n    label: 'Creations',\n    tooltip: 'Automatically add newly created entities',\n  },\n  {\n    updateTypes: ['attrib_changed'],\n    label: 'Attribute Changes',\n    tooltip: 'Automatically update existing entities',\n  },\n  {\n    updateTypes: ['deleted'],\n    label: 'Deletions',\n    tooltip: 'Automatically remove deleted entities',\n  },\n  // all other update types are grouped together\n  {\n    updateTypes: ['label_changed', 'renamed', 'type_changed', 'status_changed', 'tags_changed'],\n    label: 'Other Changes',\n    tooltip: 'Automatically update other changes to existing entities',\n  },\n]\n\nconst StyledSync = styled(Button)`\n  /* put above the menu so it's still clickable */\n  /* NOTE: this will need fixing as this also puts it above dialogs */\n  /* z-index: 1001;  */\n\n  /* spin icon */\n  &.syncing {\n    .icon {\n      animation: spin 1s linear infinite;\n    }\n  }\n  .icon {\n    /* flip */\n    scale: -1 1;\n    @keyframes spin {\n      0% {\n        transform: rotate(360deg);\n      }\n      100% {\n        transform: rotate(0deg);\n      }\n    }\n  }\n\n  &.auto-sync:not(.has-updates) {\n    &,\n    .icon {\n      color: var(--md-sys-color-primary);\n    }\n  }\n`\n\nconst SyncSettings = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: 12px 16px;\n  min-width: 180px;\n\n  .setting {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 24px;\n    color: var(--md-sys-color-on-surface);\n    white-space: nowrap;\n  }\n\n  .global {\n    padding-bottom: 8px;\n    border-bottom: 1px solid var(--md-sys-color-surface-container-highest);\n    font-weight: 600;\n  }\n`\n\ninterface SyncButtonProps extends Omit<ButtonProps, 'onClick'> {\n  projectNames?: string[]\n  topics: string[]\n  onSync?: OnSyncDataCallback\n  shouldSyncOnUpdate?: (update: RTEntityUpdate) => boolean\n  hideWhenNoUpdates?: boolean\n}\n\nconst formatUpdateType = (updateType: string, entityType: string, count: number) => {\n  const entityLabel = `${entityType}${count === 1 ? '' : 's'}`\n  if (updateType === 'created') return `new ${entityLabel}`\n  if (updateType === 'deleted') return `${entityLabel} deleted`\n  return `${count} ${entityLabel} ${updateType.replaceAll('_', ' ')}`\n}\n\nconst getUpdatesTooltip = (updates: RTEntityUpdate[]) => {\n  const groupedUpdates = new Map<\n    string,\n    { entityType: string; updateType: string; ids: Set<string> }\n  >()\n\n  updates.forEach((update) => {\n    const [, entityType, updateType] = update.topic.split('.')\n    if (!entityType || !updateType) return\n\n    const key = `${entityType}.${updateType}`\n    const group = groupedUpdates.get(key) || {\n      entityType,\n      updateType,\n      ids: new Set<string>(),\n    }\n    group.ids.add(update.entityId || String(update.id))\n    groupedUpdates.set(key, group)\n  })\n\n  const labels = Array.from(groupedUpdates.values()).map(({ entityType, updateType, ids }) =>\n    formatUpdateType(updateType, entityType, ids.size),\n  )\n\n  return `${labels.join(', ')} since last sync`\n}\n\nexport const SyncButton = forwardRef<HTMLButtonElement, SyncButtonProps>(\n  (\n    { projectNames, topics, onSync, shouldSyncOnUpdate, hideWhenNoUpdates = false, ...props },\n    ref,\n  ) => {\n    const [isSyncing, setIsSyncing] = useState(false)\n    const [autoSyncSettings, updateAutoSyncSettings] = useAutoSyncSettings()\n    const { setMenuOpen } = useMenuContext()\n    const buttonRef = useRef<HTMLButtonElement | null>(null)\n    const closeTimeout = useRef<ReturnType<typeof setTimeout>>()\n    const menuId = useId()\n\n    useEffect(() => {\n      return () => {\n        const timeout = closeTimeout.current\n        closeTimeout.current = undefined\n        if (timeout !== undefined) {\n          clearTimeout(timeout)\n        }\n      }\n    }, [])\n    useImperativeHandle(ref, () => buttonRef.current as HTMLButtonElement, [])\n\n    const handleSync = async () => {\n      setIsSyncing(true)\n      try {\n        await onSync?.(updates)\n      } finally {\n        setIsSyncing(false)\n      }\n    }\n\n    const { updates, hasUpdates } = useSyncUpdates({\n      projectNames,\n      topics,\n      isSyncing,\n      shouldSyncOnUpdate,\n    })\n\n    useEffect(() => {\n      const handleKeyDown = (event: KeyboardEvent) => {\n        if (\n          event.repeat ||\n          !event.shiftKey ||\n          event.ctrlKey ||\n          event.metaKey ||\n          event.key.toLowerCase() !== 'r' ||\n          shouldBlockShortcuts(event)\n        ) {\n          return\n        }\n\n        event.preventDefault()\n        event.stopPropagation()\n        handleSync()\n      }\n\n      window.addEventListener('keydown', handleKeyDown)\n      return () => window.removeEventListener('keydown', handleKeyDown)\n    }, [handleSync])\n\n    if (hideWhenNoUpdates && !hasUpdates) return null\n\n    const updatesTooltip = getUpdatesTooltip(updates)\n    const isAutoSyncEnabled = Object.values(autoSyncSettings).some(Boolean)\n    const isGlobalAutoSyncEnabled = Object.values(autoSyncSettings).every(Boolean)\n\n    const cancelMenuClose = () => {\n      if (closeTimeout.current) clearTimeout(closeTimeout.current)\n    }\n\n    const openSettingsMenu = () => {\n      cancelMenuClose()\n      setMenuOpen(menuId)\n    }\n\n    const closeSettingsMenu = () => {\n      cancelMenuClose()\n      closeTimeout.current = setTimeout(() => setMenuOpen(false), 100)\n    }\n\n    return (\n      <>\n        <StyledSync\n          {...props}\n          icon=\"sync\"\n          ref={buttonRef}\n          onClick={handleSync}\n          onMouseEnter={openSettingsMenu}\n          onMouseLeave={closeSettingsMenu}\n          className={clsx(props.className, {\n            syncing: isSyncing,\n            'has-updates': hasUpdates,\n            'auto-sync': isAutoSyncEnabled && !FORCE_AUTO_SYNC,\n          })}\n          data-shortcut=\"Shift+R\"\n          data-tooltip={hasUpdates ? updatesTooltip : 'Refresh data'}\n          variant={hasUpdates ? 'filled' : 'surface'}\n        />\n        {!FORCE_AUTO_SYNC && (\n          <MenuContainer\n            id={menuId}\n            target={buttonRef.current}\n            align=\"right\"\n            onMouseEnter={cancelMenuClose}\n            onMouseLeave={closeSettingsMenu}\n          >\n            <Menu\n              menu={[\n                {\n                  id: 'sync-settings',\n                  node: (\n                    <SyncSettings\n                      key=\"sync-settings\"\n                      onClick={(e) => e.stopPropagation()}\n                      onMouseEnter={cancelMenuClose}\n                      onMouseLeave={closeSettingsMenu}\n                    >\n                      <div\n                        className=\"setting global\"\n                        data-tooltip={\n                          isGlobalAutoSyncEnabled\n                            ? 'New entities and updates will be automatically synced'\n                            : 'Auto updates are disabled. Click the sync button to manually refresh data.'\n                        }\n                      >\n                        <span>Auto updates</span>\n                        <InputSwitch\n                          checked={isGlobalAutoSyncEnabled}\n                          onChange={() =>\n                            updateAutoSyncSettings({ global: !isGlobalAutoSyncEnabled })\n                          }\n                        />\n                      </div>\n                      {UPDATE_TYPES.map((setting) => (\n                        <div className=\"setting\" key={setting.updateTypes.join(',')}>\n                          <span>{setting.label}</span>\n                          <InputSwitch\n                            checked={setting.updateTypes.every((type) => autoSyncSettings[type])}\n                            onChange={() =>\n                              updateAutoSyncSettings({\n                                settings: setting.updateTypes.reduce(\n                                  (acc, type) => ({\n                                    ...acc,\n                                    [type]: !autoSyncSettings[type],\n                                  }),\n                                  {},\n                                ),\n                              })\n                            }\n                            data-tooltip={setting.tooltip}\n                          />\n                        </div>\n                      ))}\n                    </SyncSettings>\n                  ),\n                },\n              ]}\n            />\n          </MenuContainer>\n        )}\n      </>\n    )\n  },\n)\n"],"names":["StyledSync","styled","Button","formatUpdateType","updateType","entityType","count","entityLabel","getUpdatesTooltip","updates","groupedUpdates","update","key","group","ids","SyncButton","forwardRef","projectNames","topics","onSync","shouldSyncOnUpdate","hideWhenNoUpdates","props","ref","isSyncing","setIsSyncing","useState","autoSyncSettings","updateAutoSyncSettings","useAutoSyncSettings","setMenuOpen","useMenuContext","buttonRef","useRef","closeTimeout","menuId","useId","useEffect","timeout","useImperativeHandle","handleSync","hasUpdates","useSyncUpdates","handleKeyDown","event","shouldBlockShortcuts","updatesTooltip","isAutoSyncEnabled","cancelMenuClose","openSettingsMenu","closeSettingsMenu","jsxs","Fragment","jsx","clsx","FORCE_AUTO_SYNC"],"mappings":"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"}
+{"version":3,"file":"SyncButton.es.js","sources":["../../../../../src/components/SyncButton/SyncButton.tsx"],"sourcesContent":["import { Button, ButtonProps, InputSwitch } from '@ynput/ayon-react-components'\nimport { forwardRef, useEffect, useId, useImperativeHandle, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport {\n  FORCE_AUTO_SYNC,\n  OnSyncDataCallback,\n  RTEntityUpdate,\n  TopicUpdateType,\n  useAutoSyncSettings,\n  useSyncUpdates,\n} from '@shared/context/EntityUpdatesContext'\nimport { Menu, MenuContainer } from '../Menu'\nimport { useMenuContext } from '@shared/context/MenuContext'\nimport clsx from 'clsx'\nimport { shouldBlockShortcuts } from '@shared/util'\n\nconst UPDATE_TYPES: { updateTypes: TopicUpdateType[]; label: string; tooltip?: string }[] = [\n  {\n    updateTypes: ['created'],\n    label: 'Creations',\n    tooltip: 'Automatically add newly created entities',\n  },\n  {\n    updateTypes: ['attrib_changed'],\n    label: 'Attribute Changes',\n    tooltip: 'Automatically update existing entities',\n  },\n  {\n    updateTypes: ['deleted'],\n    label: 'Deletions',\n    tooltip: 'Automatically remove deleted entities',\n  },\n  // all other update types are grouped together\n  {\n    updateTypes: ['label_changed', 'renamed', 'type_changed', 'status_changed', 'tags_changed'],\n    label: 'Other Changes',\n    tooltip: 'Automatically update other changes to existing entities',\n  },\n]\n\nconst StyledSync = styled(Button)`\n  /* put above the menu so it's still clickable */\n  /* NOTE: this will need fixing as this also puts it above dialogs */\n  /* z-index: 1001;  */\n\n  /* spin icon */\n  &.syncing {\n    .icon {\n      animation: spin 1s linear infinite;\n    }\n  }\n  .icon {\n    /* flip */\n    scale: -1 1;\n    @keyframes spin {\n      0% {\n        transform: rotate(360deg);\n      }\n      100% {\n        transform: rotate(0deg);\n      }\n    }\n  }\n\n  &.auto-sync:not(.has-updates) {\n    &,\n    .icon {\n      color: var(--md-sys-color-primary);\n    }\n  }\n`\n\nconst SyncSettings = styled.div`\n  display: flex;\n  flex-direction: column;\n  gap: var(--base-gap-large);\n  padding: 12px 16px;\n  min-width: 180px;\n\n  .setting {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    gap: 24px;\n    color: var(--md-sys-color-on-surface);\n    white-space: nowrap;\n  }\n\n  .global {\n    padding-bottom: 8px;\n    border-bottom: 1px solid var(--md-sys-color-surface-container-highest);\n    font-weight: 600;\n  }\n`\n\ninterface SyncButtonProps extends Omit<ButtonProps, 'onClick'> {\n  projectNames?: string[]\n  topics: string[]\n  onSync?: OnSyncDataCallback\n  shouldSyncOnUpdate?: (update: RTEntityUpdate) => boolean\n  hideWhenNoUpdates?: boolean\n}\n\nconst formatUpdateType = (updateType: string, entityType: string, count: number) => {\n  const entityLabel = `${entityType}${count === 1 ? '' : 's'}`\n  if (updateType === 'created') return `new ${entityLabel}`\n  if (updateType === 'deleted') return `${entityLabel} deleted`\n  return `${count} ${entityLabel} ${updateType.replaceAll('_', ' ')}`\n}\n\nconst getUpdatesTooltip = (updates: RTEntityUpdate[]) => {\n  const groupedUpdates = new Map<\n    string,\n    { entityType: string; updateType: string; ids: Set<string> }\n  >()\n\n  updates.forEach((update) => {\n    const [, entityType, updateType] = update.topic.split('.')\n    if (!entityType || !updateType) return\n\n    const key = `${entityType}.${updateType}`\n    const group = groupedUpdates.get(key) || {\n      entityType,\n      updateType,\n      ids: new Set<string>(),\n    }\n    group.ids.add(update.entityId || String(update.id))\n    groupedUpdates.set(key, group)\n  })\n\n  const labels = Array.from(groupedUpdates.values()).map(({ entityType, updateType, ids }) =>\n    formatUpdateType(updateType, entityType, ids.size),\n  )\n\n  return `${labels.join(', ')} since last sync`\n}\n\nexport const SyncButton = forwardRef<HTMLButtonElement, SyncButtonProps>(\n  (\n    { projectNames, topics, onSync, shouldSyncOnUpdate, hideWhenNoUpdates = false, ...props },\n    ref,\n  ) => {\n    const [isSyncing, setIsSyncing] = useState(false)\n    const [autoSyncSettings, updateAutoSyncSettings] = useAutoSyncSettings()\n    const { setMenuOpen } = useMenuContext()\n    const buttonRef = useRef<HTMLButtonElement | null>(null)\n    const closeTimeout = useRef<ReturnType<typeof setTimeout>>()\n    const menuId = useId()\n\n    useEffect(() => {\n      return () => {\n        const timeout = closeTimeout.current\n        closeTimeout.current = undefined\n        if (timeout !== undefined) {\n          clearTimeout(timeout)\n        }\n      }\n    }, [])\n    useImperativeHandle(ref, () => buttonRef.current as HTMLButtonElement, [])\n\n    const handleSync = async () => {\n      setIsSyncing(true)\n      try {\n        await onSync?.(updates)\n      } finally {\n        setIsSyncing(false)\n      }\n    }\n\n    const { updates, hasUpdates } = useSyncUpdates({\n      projectNames,\n      topics,\n      isSyncing,\n      shouldSyncOnUpdate,\n    })\n\n    useEffect(() => {\n      const handleKeyDown = (event: KeyboardEvent) => {\n        if (\n          event.repeat ||\n          !event.shiftKey ||\n          event.ctrlKey ||\n          event.metaKey ||\n          event.key.toLowerCase() !== 'r' ||\n          shouldBlockShortcuts(event)\n        ) {\n          return\n        }\n\n        event.preventDefault()\n        event.stopPropagation()\n        handleSync()\n      }\n\n      window.addEventListener('keydown', handleKeyDown)\n      return () => window.removeEventListener('keydown', handleKeyDown)\n    }, [handleSync])\n\n    if (hideWhenNoUpdates && !hasUpdates) return null\n\n    const updatesTooltip = getUpdatesTooltip(updates)\n    const isAutoSyncEnabled = Object.values(autoSyncSettings).some(Boolean)\n    const isGlobalAutoSyncEnabled = Object.values(autoSyncSettings).every(Boolean)\n\n    const cancelMenuClose = () => {\n      if (closeTimeout.current) clearTimeout(closeTimeout.current)\n    }\n\n    const openSettingsMenu = () => {\n      cancelMenuClose()\n      setMenuOpen(menuId)\n    }\n\n    const closeSettingsMenu = () => {\n      cancelMenuClose()\n      closeTimeout.current = setTimeout(() => setMenuOpen(false), 100)\n    }\n\n    return (\n      <>\n        <StyledSync\n          {...props}\n          icon=\"sync\"\n          ref={buttonRef}\n          onClick={handleSync}\n          onMouseEnter={openSettingsMenu}\n          onMouseLeave={closeSettingsMenu}\n          className={clsx(props.className, {\n            syncing: isSyncing,\n            'has-updates': hasUpdates,\n            'auto-sync': isAutoSyncEnabled && !FORCE_AUTO_SYNC,\n          })}\n          data-shortcut=\"Shift+R\"\n          data-tooltip={hasUpdates ? updatesTooltip : 'Refresh data'}\n          variant={hasUpdates ? 'filled' : 'surface'}\n        />\n        {!FORCE_AUTO_SYNC && (\n          <MenuContainer\n            id={menuId}\n            target={buttonRef.current}\n            align=\"right\"\n            onMouseEnter={cancelMenuClose}\n            onMouseLeave={closeSettingsMenu}\n          >\n            <Menu\n              menu={[\n                {\n                  id: 'sync-settings',\n                  node: (\n                    <SyncSettings\n                      key=\"sync-settings\"\n                      onClick={(e) => e.stopPropagation()}\n                      onMouseEnter={cancelMenuClose}\n                      onMouseLeave={closeSettingsMenu}\n                    >\n                      <div\n                        className=\"setting global\"\n                        data-tooltip={\n                          isGlobalAutoSyncEnabled\n                            ? 'New entities and updates will be automatically synced'\n                            : 'Auto updates are disabled. Click the sync button to manually refresh data.'\n                        }\n                      >\n                        <span>Auto updates</span>\n                        <InputSwitch\n                          checked={isGlobalAutoSyncEnabled}\n                          onChange={() =>\n                            updateAutoSyncSettings({ global: !isGlobalAutoSyncEnabled })\n                          }\n                        />\n                      </div>\n                      {UPDATE_TYPES.map((setting) => (\n                        <div className=\"setting\" key={setting.updateTypes.join(',')}>\n                          <span>{setting.label}</span>\n                          <InputSwitch\n                            checked={setting.updateTypes.every((type) => autoSyncSettings[type])}\n                            onChange={() =>\n                              updateAutoSyncSettings({\n                                settings: setting.updateTypes.reduce(\n                                  (acc, type) => ({\n                                    ...acc,\n                                    [type]: !autoSyncSettings[type],\n                                  }),\n                                  {},\n                                ),\n                              })\n                            }\n                            data-tooltip={setting.tooltip}\n                          />\n                        </div>\n                      ))}\n                    </SyncSettings>\n                  ),\n                },\n              ]}\n            />\n          </MenuContainer>\n        )}\n      </>\n    )\n  },\n)\n"],"names":["StyledSync","styled","Button","formatUpdateType","updateType","entityType","count","entityLabel","getUpdatesTooltip","updates","groupedUpdates","update","key","group","ids","SyncButton","forwardRef","projectNames","topics","onSync","shouldSyncOnUpdate","hideWhenNoUpdates","props","ref","isSyncing","setIsSyncing","useState","autoSyncSettings","updateAutoSyncSettings","useAutoSyncSettings","setMenuOpen","useMenuContext","buttonRef","useRef","closeTimeout","menuId","useId","useEffect","timeout","useImperativeHandle","handleSync","hasUpdates","useSyncUpdates","handleKeyDown","event","shouldBlockShortcuts","updatesTooltip","isAutoSyncEnabled","cancelMenuClose","openSettingsMenu","closeSettingsMenu","jsxs","Fragment","jsx","clsx","FORCE_AUTO_SYNC"],"mappings":"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"}

package/dist/shared/src/components/Thumbnail/StackedThumbnails.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../_virtual/jsx-runtime.cjs.js"),l=require("react"),q=require("styled-components"),d=require("./Thumbnail.cjs.js"),x=require("clsx");require("../../context/RemoteModulesContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");require("../../api/base/client.cjs.js");require("../../api/generated/graphql.cjs.js");require("../../api/generated/graphqlLinks.cjs.js");require("../../api/generated/access.cjs.js");require("../../api/generated/actions.cjs.js");require("../../api/generated/activityFeed.cjs.js");require("../../api/generated/addons.cjs.js");require("../../api/generated/anatomy.cjs.js");require("../../api/generated/attributes.cjs.js");require("../../api/generated/authentication.cjs.js");require("../../api/generated/bundles.cjs.js");require("../../api/generated/configuration.cjs.js");require("../../api/generated/dataImport.cjs.js");require("../../api/generated/desktop.cjs.js");require("../../api/generated/entityLists.cjs.js");require("../../api/generated/events.cjs.js");require("../../api/generated/files.cjs.js");require("../../api/generated/folders.cjs.js");require("../../api/generated/inbox.cjs.js");require("../../api/generated/links.cjs.js");require("../../api/generated/market.cjs.js");require("../../api/generated/onboarding.cjs.js");require("../../api/generated/operations.cjs.js");require("../../api/generated/products.cjs.js");require("../../api/generated/projectDashboard.cjs.js");require("../../api/generated/projects.cjs.js");require("../../api/generated/projectFolders.cjs.js");require("../../api/generated/reviewables.cjs.js");require("../../api/generated/services.cjs.js");require("../../api/generated/system.cjs.js");require("../../api/generated/tasks.cjs.js");require("../../api/generated/teams.cjs.js");require("../../api/generated/thumbnails.cjs.js");require("../../api/generated/uRIs.cjs.js");require("../../api/generated/users.cjs.js");require("../../api/generated/versions.cjs.js");require("../../api/generated/workfiles.cjs.js");require("../../api/generated/ynputCloud.cjs.js");require("../../api/generated/grouping.cjs.js");require("../../api/generated/views.cjs.js");require("../../api/queries/actions/getActions.cjs.js");require("../../api/queries/activities/getActivities.cjs.js");require("../../api/queries/activities/updateReaction.cjs.js");require("../../api/queries/activities/getMentions.cjs.js");require("../../api/queries/activities/getCategories.cjs.js");require("../../api/queries/addons/getAddons.cjs.js");require("../../api/queries/addons/updateAddons.cjs.js");require("../../api/queries/attributes/getAttributes.cjs.js");require("../../api/queries/attributes/updateAttributes.cjs.js");require("../../api/queries/authentication/getAuthentication.cjs.js");require("../../api/queries/bundles/getBundles.cjs.js");require("../../api/queries/bundles/updateBundles.cjs.js");require("../../api/queries/cloud/cloud.cjs.js");require("../../api/queries/columnStats/metricTargets.cjs.js");require("../../api/queries/columnStats/groupCounts.cjs.js");require("../../api/queries/config/getConfig.cjs.js");require("../../api/queries/config/updateConfig.cjs.js");require("../../api/queries/entities/getEntity.cjs.js");require("../../api/queries/entities/getEntityPanel.cjs.js");require("../../api/queries/overview/getOverview.cjs.js");require("../../api/queries/overview/updateOverview.cjs.js");require("../../api/queries/versions/getVersionsProducts.cjs.js");require("../../api/queries/links/getEntityLinks.cjs.js");require("../../api/queries/entities/updateEntity.cjs.js");require("../../api/queries/entityLists/getLists.cjs.js");require("../../api/queries/entityLists/updateLists.cjs.js");require("../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../api/queries/entityLists/listItemsColumnStats.cjs.js");require("../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.cjs.js");require("../../api/queries/folders/getFolderDeleteInfo.cjs.js");require("../../api/queries/grouping/getGrouping.cjs.js");require("../../api/queries/links/updateLinks.cjs.js");require("../../api/queries/links/getLinks.cjs.js");require("../../api/queries/permissions/getPermissions.cjs.js");require("../../api/queries/products/createProduct.cjs.js");require("../../api/queries/products/getFolderProducts.cjs.js");require("../../api/queries/project/getProject.cjs.js");require("../../api/queries/project/updateProject.cjs.js");require("../../api/queries/projectFolders/projectFolders.cjs.js");require("../../api/queries/review/getReview.cjs.js");require("../../api/queries/review/updateReview.cjs.js");require("../../api/queries/share/share.cjs.js");require("../../api/queries/system/getSystem.cjs.js");require("../../api/queries/tasks/getTasks.cjs.js");require("../../api/queries/tasks/updateTasks.cjs.js");require("../../api/queries/teams/getTeams.cjs.js");require("../../api/queries/userDashboard/getUserDashboard.cjs.js");require("../../api/queries/users/getUsers.cjs.js");require("../../api/queries/users/updateUsers.cjs.js");require("../../api/queries/users/guests.cjs.js");require("../../api/queries/versions/updateVersions.cjs.js");require("../../api/queries/views/getViews.cjs.js");require("../../api/queries/views/updateViews.cjs.js");require("../../api/queries/watchers/getWatchers.cjs.js");require("../../api/queries/uris/getUris.cjs.js");require("lodash");require("react-toastify");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");require("uuid");require("../../util/pubsub.cjs.js");require("../../context/PowerpackContextInstance.cjs.js");require("../../context/UriContext.cjs.js");require("../../context/DetailsPanelContextInstance.cjs.js");require("../../context/SubtasksModulesContextInstance.cjs.js");const p=require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");require("../../context/MenuContext.cjs.js");require("../../context/WebsocketContext.cjs.js");require("../../context/GlobalContext.cjs.js");require("../../context/ProjectContext.cjs.js");require("../../context/ProjectFoldersContextInstance.cjs.js");require("../../context/EntityUpdatesContextInstance.cjs.js");require("../../containers/ContextMenu/ContextMenuContext.cjs.js");require("@ynput/ayon-react-components");;/* empty css                                                 */require("../../containers/Feed/context/FeedContext.cjs.js");require("../../containers/Feed/components/Tooltips/UserTooltipItem.cjs.js");require("../../containers/Feed/components/Tooltips/UserTooltip/UserTooltip.styled.cjs.js");require("../../containers/Feed/components/Tooltips/TeamTooltip/TeamTooltip.styled.cjs.js");require("../../containers/Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/Mimes/TextMime.cjs.js");require("react-markdown");require("remark-emoji");require("remark-gfm");require("remark-directive");require("remark-directive-rehype");require("../../containers/Feed/components/CommentInput/CommentInput.cjs.js");require("../../containers/Feed/components/ReactionContainer/Reactions.styled.cjs.js");require("../../containers/Feed/components/FilesGrid/FilesGrid.styled.cjs.js");require("../../containers/Feed/components/FileUploadCard/FileUploadCard.styled.cjs.js");require("../../containers/Feed/components/CommentInput/quillToMarkdown.cjs.js");require("../../containers/Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("../../containers/Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../AddonLoadingScreen/AddonLoadingScreen.cjs.js");require("../../../../node_modules/match-sorter/dist/match-sorter.esm.cjs.js");require("../AccessSearchInput/AccessSearchInput.styled.cjs.js");require("../AccessUser/AccessUser.cjs.js");require("../AttributeEditor/AttributeEditor.cjs.js");require("../AttributeEditor/attributeTypeMap.cjs.js");require("../Badge/Badge.cjs.js");require("../Chips/Chips.cjs.js");require("date-fns");require("../DateRangePicker/DateRangePicker.styled.cjs.js");require("../LinksManager/CellEditingDialog.cjs.js");require("../DeleteEntitiesConfirm/DeleteConfirmContent.cjs.js");require("../DeleteEntitiesConfirm/DeleteEntitiesConfirmDialog.styled.cjs.js");require("../../../../_virtual/index.cjs.js");require("../../../../node_modules/refractor/lib/common.cjs.js");require("../../../../node_modules/refractor/lib/all.cjs.js");;/* empty css                                                                                */require("../DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../DetailsPanelDetails/DetailsPanelDetails.cjs.js");require("react-quill-ayon");require("../DetailsPanelDetails/BorderedSection.cjs.js");require("../QuillListStyles/QuillListStyles.cjs.js");require("../DetailsPanelDetails/DescriptionSection.styles.cjs.js");require("rehype-raw");require("../DetailsPanelDetails/hooks/useMentionSystem.cjs.js");require("../../containers/Feed/components/CommentInput/modules/index.cjs.js");require("../DetailsPanelDetails/DetailsSection.cjs.js");require("../DetailsPanelDetails/FieldLabel.cjs.js");require("../DoneCheckbox/DoneCheckbox.cjs.js");require("../EarlyPreview/EarlyPreview.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholder.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholderFlex.styled.cjs.js");require("../InfoMessage/InfoMessage.cjs.js");require("@dnd-kit/core");require("@dnd-kit/sortable");require("../EnumEditor/EnumEditor.styled.cjs.js");require("../EntityPanelUploader/EntityPanelUploader.styled.cjs.js");require("axios");require("../ReviewablesList/ReviewablesList.styled.cjs.js");require("../ReviewablesList/ReviewablesUpload.styled.cjs.js");require("../EntityPath/EntityPath.styled.cjs.js");require("../EntityPath/SegmentProvider.cjs.js");require("../FeaturedVersionOrder/FeaturedVersionOrder.cjs.js");require("../Feedback/FeedbackContextInstance.cjs.js");require("../Feedback/SupportBubble.cjs.js");require("../FileThumbnail/FileThumbnail.cjs.js");require("../LegacyBadge/LegacyBadge.cjs.js");require("../LinksManager/LinksManager.styled.cjs.js");require("../../containers/EntityPickerDialog/EntityPickerDialog.cjs.js");require("../Powerpack/PowerpackButton.cjs.js");require("../Powerpack/FreeTrialLink.cjs.js");require("../Powerpack/PowerpackDialog.styled.cjs.js");require("../Powerpack/CTAButton.cjs.js");require("../Powerpack/RequiredAddonVersion.cjs.js");require("../ProjectTableSettings/ProjectTableSettings.cjs.js");require("../ProjectTableSettings/ColumnsSettings.cjs.js");require("../SizeSlider/SizeSlider.cjs.js");require("react-router-dom");require("../../containers/Slicer/components/Slicer.cjs.js");require("../../containers/Slicer/context/SlicerContextInstance.cjs.js");require("../../containers/Slicer/components/SlicerDropdownFallback.cjs.js");require("../../containers/NewEntity/components/NewEntity.cjs.js");require("@tanstack/react-virtual");require("@tanstack/react-table");require("../../containers/ProjectTreeTable/buildTreeTableColumns.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js");require("../../containers/ProjectTreeTable/components/HeaderActionButton.cjs.js");require("../../containers/ProjectTreeTable/components/RowSelectionHeader.cjs.js");require("../../containers/ProjectTreeTable/components/SelectionCell.cjs.js");require("../../containers/ProjectTreeTable/context/CellEditingContext.cjs.js");require("../SearchFilter/filterDates.cjs.js");require("short-uuid");require("../../containers/ProjectTreeTable/utils/columnIds.cjs.js");require("../../containers/ProjectTreeTable/context/SelectionCellsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.cjs.js");require("../../containers/ProjectTreeTable/context/ColumnSettingsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableContextInstance.cjs.js");require("../../containers/ProjectTreeTable/context/ClipboardContext.cjs.js");require("../../containers/ProjectTreeTable/context/SelectedRowsContext.cjs.js");require("../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectDataContextInstance.cjs.js");require("../../containers/ProjectTreeTable/components/TableFooterRow.cjs.js");require("../../containers/ProjectTreeTable/widgets/CellWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/CollapsedWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/DateWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EnumWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EnumCellValue.cjs.js");require("../../containers/ProjectTreeTable/widgets/TextWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/MarkdownWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/BooleanWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EntityWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ThumbnailWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/LinksWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EmptyWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ErrorWidget.cjs.js");require("../../containers/NewEntity/context/NewEntityContextInstance.cjs.js");require("../../containers/NewEntity/components/NewEntityForm.cjs.js");require("../../containers/Slicer/hooks/useTableDataBySlice.cjs.js");require("../ReviewableCard/ReviewableCard.cjs.js");require("../ReviewableProgressCard/ReviewableProgressCard.styled.cjs.js");require("../SearchFilter/CustomDateRangeDialog.cjs.js");require("../SettingsPanel/SettingsPanel.cjs.js");require("../SettingsPanel/SettingsPanelItemTemplate.cjs.js");require("../ShareOptionIcon/ShareOptionIcon.cjs.js");require("../SimpleFormDialog/SimpleFormDialog.cjs.js");require("../StyledLink/StyledLink.cjs.js");require("../SyncButton/SyncButton.cjs.js");require("../TableGridSwitch/TableGridSwitch.cjs.js");require("../ThumbnailSimple/ThumbnailSimple.cjs.js");require("../VersionUploader/components/UploadVersionDialog.cjs.js");require("../VersionUploader/context/VersionUploadContextInstance.cjs.js");require("../Watchers/Watchers.cjs.js");require("../Menu/Menu.styled.cjs.js");require("../Menu/MenuItem.cjs.js");require("../ReviewablesSelector/ReviewablesSelector.cjs.js");require("../ColumnHeaderMenuUI.cjs.js");require("../../containers/Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("../../containers/Feed/components/ActivityStatus/ActivityStatus.cjs.js");require("../../containers/Feed/components/ActivityHeader/ActivityHeader.styled.cjs.js");require("../../containers/Feed/components/ActivityDate.cjs.js");require("../../containers/Feed/components/ActivityVersionReview/ActivityVersionReview.styled.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryTag.cjs.js");require("../../containers/Feed/components/ActivityFieldChange/ActivityFieldChange.styled.cjs.js");require("../../containers/Feed/components/ActivityFieldChange/FieldValue.cjs.js");require("../../containers/Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.cjs.js");require("../../containers/Feed/components/ActivityVersions/ActivityVersions.styled.cjs.js");require("../../containers/Feed/components/ActivityGroup/ActivityGroup.styled.cjs.js");require("../../containers/Feed/Feed.styled.cjs.js");require("../../containers/Feed/components/FeedSearchFilter.cjs.js");require("../../containers/DetailsPanel/DetailsPanel.styled.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelTabs/DetailsPanelTabs.styled.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelHeader/LinkedTaskRow.styled.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelHeader/DetailsPanelHeader.styled.cjs.js");require("../PlayableIcon/PlayableIcon.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelFiles/DetailsPanelFiles.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelMoreMenu/components/ShareDialog.cjs.js");require("../../containers/DetailsPanel/components/TabHeaderAndFilters/TabHeaderAndFilters.styled.cjs.js");require("../../containers/DetailsPanel/components/SubtasksSearchFilter/SubtasksSearchFilter.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");require("../../containers/Actions/Actions.styled.cjs.js");require("../../containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js");require("../../containers/Actions/ActionIcon.cjs.js");require("../../containers/Views/ViewsMenu/ViewsMenu.cjs.js");require("../../containers/Views/context/ViewsContextInstance.cjs.js");require("../../containers/Views/Views.styled.cjs.js");require("../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../containers/ListTable/ListTableRow.cjs.js");require("../../containers/ListTable/ListTable.styled.cjs.js");require("../../context/DeleteEntitiesContext.cjs.js");const g=q.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const i=require("../../../../_virtual/jsx-runtime.cjs.js"),x=require("react"),o=require("styled-components"),p=require("./Thumbnail.cjs.js"),u=require("clsx"),g=require("../../context/ThumbnailUploaderContext.cjs.js"),m=o.div`
   display: flex;
   z-index: 10;
   height: 100%;
@@ -19,7 +19,7 @@
         font-size: 24px;
       }
 
-      ${({$length:e})=>e>1&&q.css`
+      ${({$length:e})=>e>1&&o.css`
           :not(:last-child) {
             box-shadow: 0 0 4px 0px black;
           }
@@ -35,5 +35,5 @@
       object-fit: cover;
     }
   }
-`,m=({thumbnails:e=[],isLoading:t,className:n,style:o,...s})=>{const{onContextMenu:c}=l.useContext(p.ThumbnailUploadContext);e=e.slice(0,5);const a=e.length>1;return e.length?u.jsxRuntimeExports.jsx(g,{$length:e.length,className:x("stacked-thumbnails",n,{stacking:a}),children:e.map((r,i)=>r?u.jsxRuntimeExports.jsx(d.Thumbnail,{projectName:r.projectName,entityType:r.type,entityId:r.id,icon:r.icon,color:r.color,style:{...o,zIndex:-i},thumbnailHash:r.thumbnailHash,isLoading:t,src:r.src,onContextMenu:c,...s},r.id||r.src||i):null)}):null};exports.StackedThumbnails=m;
+`,y=({thumbnails:e=[],isLoading:r,className:s,style:c,...a})=>{const{onContextMenu:l}=x.useContext(g.ThumbnailUploadContext);e=e.slice(0,5);const d=e.length>1;return e.length?i.jsxRuntimeExports.jsx(m,{$length:e.length,className:u("stacked-thumbnails",s,{stacking:d}),children:e.map((t,n)=>t?i.jsxRuntimeExports.jsx(p.Thumbnail,{projectName:t.projectName,entityType:t.type,entityId:t.id,icon:t.icon,color:t.color,style:{...c,zIndex:-n},thumbnailHash:t.thumbnailHash,isLoading:r,src:t.src,onContextMenu:l,...a},t.id||t.src||n):null)}):null};exports.StackedThumbnails=y;
 //# sourceMappingURL=StackedThumbnails.cjs.js.map

package/dist/shared/src/components/Thumbnail/StackedThumbnails.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"StackedThumbnails.cjs.js","sources":["../../../../../src/components/Thumbnail/StackedThumbnails.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport styled, { css } from 'styled-components'\nimport { Thumbnail } from './Thumbnail'\nimport clsx from 'clsx'\nimport { ThumbnailUploadContext } from '@shared/context'\nimport { ThumbnailProps } from '@shared/components'\n\ntype StackedStyledProps = {\n  $length: number\n}\n\nconst StackedStyled = styled.div<StackedStyledProps>`\n  display: flex;\n  z-index: 10;\n  height: 100%;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  min-width: min-content;\n  cursor: pointer;\n\n  &.stacking {\n    & > * {\n      margin: unset;\n      aspect-ratio: 1;\n      border: solid 2px var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n\n      span {\n        font-size: 24px;\n      }\n\n      ${({ $length }) =>\n        $length > 1 &&\n        css`\n          :not(:last-child) {\n            box-shadow: 0 0 4px 0px black;\n          }\n        `}\n    }\n\n    /* create stacked effect */\n    & > * + * {\n      margin-left: ${({ $length }) => `${Math.max(-20, -$length * 1.5 - 8)}px`};\n    }\n\n    .thumbnail img {\n      object-fit: cover;\n    }\n  }\n`\n\ntype Thumbnail = {\n  id?: string\n  type?: string\n  projectName?: string\n  icon?: string\n  color?: string\n  thumbnailHash?: string\n  src?: string\n}\n\nexport interface StackedThumbnailsProps\n  extends Omit<ThumbnailProps, 'entityType' | 'entityId' | 'projectName' | 'thumbnailHash'> {\n  thumbnails?: Thumbnail[]\n  isLoading?: boolean\n  className?: string\n  style?: React.CSSProperties\n}\n\nexport const StackedThumbnails = ({\n  thumbnails = [],\n  isLoading,\n  className,\n  style,\n  ...props\n}: StackedThumbnailsProps) => {\n  const { onContextMenu } = useContext(ThumbnailUploadContext)\n  // limit to 5 users\n  thumbnails = thumbnails.slice(0, 5)\n  const isStacking = thumbnails.length > 1\n\n  if (!thumbnails.length) return null\n\n  return (\n    <StackedStyled\n      $length={thumbnails.length}\n      className={clsx('stacked-thumbnails', className, { stacking: isStacking })}\n    >\n      {thumbnails.map((thumb, i) =>\n        thumb ? (\n          <Thumbnail\n            projectName={thumb.projectName}\n            entityType={thumb.type}\n            entityId={thumb.id}\n            icon={thumb.icon}\n            color={thumb.color}\n            key={thumb.id || thumb.src || i}\n            style={{ ...style, zIndex: -i }}\n            thumbnailHash={thumb.thumbnailHash}\n            isLoading={isLoading}\n            src={thumb.src}\n            // @ts-ignore — Thumbnail forwards onContextMenu to its root element\n            onContextMenu={onContextMenu}\n            {...props}\n          />\n        ) : null,\n      )}\n    </StackedStyled>\n  )\n}\n"],"names":["StackedStyled","styled","$length","css","StackedThumbnails","thumbnails","isLoading","className","style","props","onContextMenu","useContext","ThumbnailUploadContext","isStacking","jsx","clsx","thumb","Thumbnail"],"mappings":"6rjBAWA,MAAMA,EAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAqBrB,CAAC,CAAE,QAAAC,CAAA,IACHA,EAAU,GACVC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,SAIC;AAAA;AAAA;AAAA;AAAA;AAAA,qBAKY,CAAC,CAAE,QAAAD,CAAA,IAAc,GAAG,KAAK,IAAI,IAAK,CAACA,EAAU,IAAM,CAAC,CAAC,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA2BjEE,EAAoB,CAAC,CAChC,WAAAC,EAAa,CAAA,EACb,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IAA8B,CAC5B,KAAM,CAAE,cAAAC,CAAA,EAAkBC,EAAAA,WAAWC,wBAAsB,EAE3DP,EAAaA,EAAW,MAAM,EAAG,CAAC,EAClC,MAAMQ,EAAaR,EAAW,OAAS,EAEvC,OAAKA,EAAW,OAGdS,EAAAA,kBAAAA,IAACd,EAAA,CACC,QAASK,EAAW,OACpB,UAAWU,EAAK,qBAAsBR,EAAW,CAAE,SAAUM,EAAY,EAExE,SAAAR,EAAW,IAAI,CAACW,EAAO,IACtBA,EACEF,EAAAA,kBAAAA,IAACG,EAAAA,UAAA,CACC,YAAaD,EAAM,YACnB,WAAYA,EAAM,KAClB,SAAUA,EAAM,GAChB,KAAMA,EAAM,KACZ,MAAOA,EAAM,MAEb,MAAO,CAAE,GAAGR,EAAO,OAAQ,CAAC,CAAA,EAC5B,cAAeQ,EAAM,cACrB,UAAAV,EACA,IAAKU,EAAM,IAEX,cAAAN,EACC,GAAGD,CAAA,EAPCO,EAAM,IAAMA,EAAM,KAAO,CAAA,EAS9B,IAAA,CACN,CAAA,EAzB2B,IA4BjC"}
+{"version":3,"file":"StackedThumbnails.cjs.js","sources":["../../../../../src/components/Thumbnail/StackedThumbnails.tsx"],"sourcesContent":["import React, { useContext } from 'react'\nimport styled, { css } from 'styled-components'\nimport { Thumbnail } from './Thumbnail'\nimport clsx from 'clsx'\nimport { ThumbnailUploadContext } from '@shared/context/ThumbnailUploaderContext'\nimport type { ThumbnailProps } from './Thumbnail'\n\ntype StackedStyledProps = {\n  $length: number\n}\n\nconst StackedStyled = styled.div<StackedStyledProps>`\n  display: flex;\n  z-index: 10;\n  height: 100%;\n  position: relative;\n  overflow: hidden;\n  border-radius: 8px;\n  min-width: min-content;\n  cursor: pointer;\n\n  &.stacking {\n    & > * {\n      margin: unset;\n      aspect-ratio: 1;\n      border: solid 2px var(--md-sys-color-outline-variant);\n      border-radius: 8px;\n\n      span {\n        font-size: 24px;\n      }\n\n      ${({ $length }) =>\n        $length > 1 &&\n        css`\n          :not(:last-child) {\n            box-shadow: 0 0 4px 0px black;\n          }\n        `}\n    }\n\n    /* create stacked effect */\n    & > * + * {\n      margin-left: ${({ $length }) => `${Math.max(-20, -$length * 1.5 - 8)}px`};\n    }\n\n    .thumbnail img {\n      object-fit: cover;\n    }\n  }\n`\n\ntype Thumbnail = {\n  id?: string\n  type?: string\n  projectName?: string\n  icon?: string\n  color?: string\n  thumbnailHash?: string\n  src?: string\n}\n\nexport interface StackedThumbnailsProps\n  extends Omit<ThumbnailProps, 'entityType' | 'entityId' | 'projectName' | 'thumbnailHash'> {\n  thumbnails?: Thumbnail[]\n  isLoading?: boolean\n  className?: string\n  style?: React.CSSProperties\n}\n\nexport const StackedThumbnails = ({\n  thumbnails = [],\n  isLoading,\n  className,\n  style,\n  ...props\n}: StackedThumbnailsProps) => {\n  const { onContextMenu } = useContext(ThumbnailUploadContext)\n  // limit to 5 users\n  thumbnails = thumbnails.slice(0, 5)\n  const isStacking = thumbnails.length > 1\n\n  if (!thumbnails.length) return null\n\n  return (\n    <StackedStyled\n      $length={thumbnails.length}\n      className={clsx('stacked-thumbnails', className, { stacking: isStacking })}\n    >\n      {thumbnails.map((thumb, i) =>\n        thumb ? (\n          <Thumbnail\n            projectName={thumb.projectName}\n            entityType={thumb.type}\n            entityId={thumb.id}\n            icon={thumb.icon}\n            color={thumb.color}\n            key={thumb.id || thumb.src || i}\n            style={{ ...style, zIndex: -i }}\n            thumbnailHash={thumb.thumbnailHash}\n            isLoading={isLoading}\n            src={thumb.src}\n            // @ts-ignore — Thumbnail forwards onContextMenu to its root element\n            onContextMenu={onContextMenu}\n            {...props}\n          />\n        ) : null,\n      )}\n    </StackedStyled>\n  )\n}\n"],"names":["StackedStyled","styled","$length","css","StackedThumbnails","thumbnails","isLoading","className","style","props","onContextMenu","useContext","ThumbnailUploadContext","isStacking","jsx","clsx","thumb","i","Thumbnail"],"mappings":"0SAWMA,EAAgBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,QAqBrB,CAAC,CAAE,QAAAC,CAAA,IACHA,EAAU,GACVC,EAAAA;AAAAA;AAAAA;AAAAA;AAAAA,SAIC;AAAA;AAAA;AAAA;AAAA;AAAA,qBAKY,CAAC,CAAE,QAAAD,CAAA,IAAc,GAAG,KAAK,IAAI,IAAK,CAACA,EAAU,IAAM,CAAC,CAAC,IAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA2BjEE,EAAoB,CAAC,CAChC,WAAAC,EAAa,CAAA,EACb,UAAAC,EACA,UAAAC,EACA,MAAAC,EACA,GAAGC,CACL,IAA8B,CAC5B,KAAM,CAAE,cAAAC,CAAA,EAAkBC,EAAAA,WAAWC,wBAAsB,EAE3DP,EAAaA,EAAW,MAAM,EAAG,CAAC,EAClC,MAAMQ,EAAaR,EAAW,OAAS,EAEvC,OAAKA,EAAW,OAGdS,EAAAA,kBAAAA,IAACd,EAAA,CACC,QAASK,EAAW,OACpB,UAAWU,EAAK,qBAAsBR,EAAW,CAAE,SAAUM,EAAY,EAExE,SAAAR,EAAW,IAAI,CAACW,EAAOC,IACtBD,EACEF,EAAAA,kBAAAA,IAACI,EAAAA,UAAA,CACC,YAAaF,EAAM,YACnB,WAAYA,EAAM,KAClB,SAAUA,EAAM,GAChB,KAAMA,EAAM,KACZ,MAAOA,EAAM,MAEb,MAAO,CAAE,GAAGR,EAAO,OAAQ,CAACS,CAAA,EAC5B,cAAeD,EAAM,cACrB,UAAAV,EACA,IAAKU,EAAM,IAEX,cAAAN,EACC,GAAGD,CAAA,EAPCO,EAAM,IAAMA,EAAM,KAAOC,CAAA,EAS9B,IAAA,CACN,CAAA,EAzB2B,IA4BjC"}