npm - @ynput/ayon-frontend-shared - Versions diffs - 0.3.23 → 0.3.24 - Mend

@ynput/ayon-frontend-shared 0.3.23 → 0.3.24

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (45) hide show

package/dist/shared/src/components/ReviewablesSelector/Card.es.js CHANGED Viewed

@@ -267,38 +267,38 @@ import "../VersionUploader/context/VersionUploadContext.es.js";
 import "../Watchers/Watchers.es.js";
 import "../Menu/Menu.styled.es.js";
 import "../Menu/MenuItem.es.js";
-import { ReviewableCard as b, Tag as d } from "./ReviewablesSelector.styled.es.js";
+import { ReviewableCard as C, Tag as b } from "./ReviewablesSelector.styled.es.js";
 function hm({
-  fileId: r,
-  label: e,
-  selected: a,
-  projectName: n,
-  onKeyDown: s,
-  onMouseOver: u,
-  onChange: i,
-  tag: m,
-  contextMenuItems: p,
+  fileId: o,
+  label: p,
+  selected: e,
+  projectName: a,
+  onKeyDown: n,
+  onMouseOver: s,
+  onChange: u,
+  tag: i,
+  contextMenuItems: m,
   selectionVariant: c = "primary"
 }) {
   const [l] = f();
   return /* @__PURE__ */ t.jsxs(
-    b,
+    C,
     {
-      id: "preview-" + r,
-      onClick: () => i && i(r),
-      className: x("reviewable-card", { selected: a }, c),
-      onMouseOver: (o) => u(o, { label: e }),
-      onKeyDown: s,
-      onContextMenu: (o) => {
-        p && (o.preventDefault(), l(o, p));
+      id: "preview-" + o,
+      onClick: (r) => u?.(o, r.metaKey || r.ctrlKey),
+      className: x("reviewable-card", { selected: e }, c),
+      onMouseOver: (r) => s(r, { label: p }),
+      onKeyDown: n,
+      onContextMenu: (r) => {
+        m && (r.preventDefault(), l(r, m));
       },
       tabIndex: 0,
       children: [
-        /* @__PURE__ */ t.jsx(j, { src: `/api/projects/${n}/files/${r}/thumbnail` }),
-        m && /* @__PURE__ */ t.jsx(d, { children: m })
+        /* @__PURE__ */ t.jsx(j, { src: `/api/projects/${a}/files/${o}/thumbnail` }),
+        i && /* @__PURE__ */ t.jsx(b, { children: i })
       ]
     },
-    r
+    o
   );
 }
 export {

package/dist/shared/src/components/ReviewablesSelector/Card.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Card.es.js","sources":["../../../../../src/components/ReviewablesSelector/Card.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { FileThumbnail } from '@shared/components'\nimport { ReviewableModel } from '@shared/api'\nimport { ContextMenuItemType, useCreateContextMenu } from '@shared/containers'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { KeyboardEvent, MouseEvent } from 'react'\n\nexport type ReviewableCard = Pick<ReviewableModel, 'fileId' \| 'label'> & {\n tag?: JSX.Element,\n contextMenuItems?: ContextMenuItemType[],\n selectionVariant?: 'primary' \| 'tertiary',\n}\n\nexport type ReviewableCardProps = ReviewableCard & {\n projectName: string \| null,\n selected: boolean,\n onChange?: (fileId: string) => void,\n onKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void,\n onMouseOver: (event: MouseEvent<HTMLDivElement>, { label }: { label?: string }) => void,\n}\n\nexport default function Card({\n fileId,\n label,\n selected,\n projectName,\n onKeyDown,\n onMouseOver,\n onChange,\n tag,\n contextMenuItems,\n selectionVariant = 'primary',\n}: ReviewableCardProps) {\n const [contextMenuShow] = useCreateContextMenu()\n\n return (\n <Styled.ReviewableCard\n key={fileId}\n id={'preview-' + fileId}\n onClick={() => onChange && ~~onChange(fileId~~)}\n className={clsx('reviewable-card', { selected }, selectionVariant)}\n onMouseOver={(e) => onMouseOver(e, { label })}\n onKeyDown={onKeyDown}\n onContextMenu={(event) => {\n if (!contextMenuItems) return\n\n event.preventDefault()\n contextMenuShow(event, contextMenuItems)\n }}\n tabIndex={0}\n >\n <FileThumbnail src={`/api/projects/${projectName}/files/${fileId}/thumbnail`} />\n {\n tag && <Styled.Tag>{tag}</Styled.Tag>\n }\n </Styled.ReviewableCard>\n )\n}\n"],"names":["Card","fileId","label","selected","projectName","onKeyDown","onMouseOver","onChange","tag","contextMenuItems","selectionVariant","contextMenuShow","useCreateContextMenu","jsxs","Styled.ReviewableCard","~~clsx~~","e","~~event~~","jsx","FileThumbnail","Styled.Tag"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,SAAwBA,GAAK;AAAA,EAC3B,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,KAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC,IAAmB;AACrB,GAAwB;AACtB,QAAM,CAACC,CAAe,IAAIC,EAAA;AAE1B,SACEC,gBAAAA,EAAAA;AAAAA,IAACC;AAAAA,IAAA;AAAA,MAEC,IAAI,aAAab;AAAA,MACjB,SAAS,~~MAAMM~~,~~KAAYA~~,~~EAASN~~,~~CAAM~~;AAAA,~~MAC1C~~,~~WAAWc~~,EAAK,mBAAmB,EAAE,~~UAAAZ~~,EAAA,GAAYO,CAAgB;AAAA,MACjE,aAAa,~~CAACM~~,~~MAAMV~~,~~EAAYU~~,GAAG,EAAE,~~OAAAd~~,GAAO;AAAA,MAC5C,WAAAG;AAAA,MACA,eAAe,~~CAACY~~,MAAU;AACxB,~~QAAKR~~,~~MAELQ~~,EAAM,eAAA,~~GACNN~~,~~EAAgBM~~,~~GAAOR~~,CAAgB;AAAA,MACzC;AAAA,MACA,UAAU;AAAA,MAEV,UAAA;AAAA,QAAAS,gBAAAA,MAACC,KAAc,KAAK,iBAAiBf,CAAW,UAAUH,CAAM,cAAc;AAAA,QAE5EO,KAAOU,gBAAAA,EAAAA,IAACE,GAAA,EAAY,UAAAZ,EAAA,CAAI;AAAA,MAAA;AAAA,IAAA;AAAA,IAhBrBP;AAAA,EAAA;AAoBX;"}
1	+ {"version":3,"file":"Card.es.js","sources":["../../../../../src/components/ReviewablesSelector/Card.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { FileThumbnail } from '@shared/components'\nimport { ReviewableModel } from '@shared/api'\nimport { ContextMenuItemType, useCreateContextMenu } from '@shared/containers'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { KeyboardEvent, MouseEvent } from 'react'\n\nexport type ReviewableCard = Pick<ReviewableModel, 'fileId' \| 'label'> & {\n tag?: JSX.Element,\n contextMenuItems?: ContextMenuItemType[],\n selectionVariant?: 'primary' \| 'tertiary',\n}\n\nexport type ReviewableCardProps = ReviewableCard & {\n projectName: string \| null,\n selected: boolean,\n onChange?: (fileId: string, modifier?: boolean) => void,\n onKeyDown: (event: KeyboardEvent<HTMLDivElement>) => void,\n onMouseOver: (event: MouseEvent<HTMLDivElement>, { label }: { label?: string }) => void,\n}\n\nexport default function Card({\n fileId,\n label,\n selected,\n projectName,\n onKeyDown,\n onMouseOver,\n onChange,\n tag,\n contextMenuItems,\n selectionVariant = 'primary',\n}: ReviewableCardProps) {\n const [contextMenuShow] = useCreateContextMenu()\n\n return (\n <Styled.ReviewableCard\n key={fileId}\n id={'preview-' + fileId}\n onClick={(event) => onChange?.(fileId, event.metaKey \|\| event.ctrlKey)}\n className={clsx('reviewable-card', { selected }, selectionVariant)}\n onMouseOver={(e) => onMouseOver(e, { label })}\n onKeyDown={onKeyDown}\n onContextMenu={(event) => {\n if (!contextMenuItems) return\n\n event.preventDefault()\n contextMenuShow(event, contextMenuItems)\n }}\n tabIndex={0}\n >\n <FileThumbnail src={`/api/projects/${projectName}/files/${fileId}/thumbnail`} />\n {\n tag && <Styled.Tag>{tag}</Styled.Tag>\n }\n </Styled.ReviewableCard>\n )\n}\n"],"names":["Card","fileId","label","selected","projectName","onKeyDown","onMouseOver","onChange","tag","contextMenuItems","selectionVariant","contextMenuShow","useCreateContextMenu","jsxs","Styled.ReviewableCard","event","clsx","e","jsx","FileThumbnail","Styled.Tag"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAqBA,SAAwBA,GAAK;AAAA,EAC3B,QAAAC;AAAA,EACA,OAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,KAAAC;AAAA,EACA,kBAAAC;AAAA,EACA,kBAAAC,IAAmB;AACrB,GAAwB;AACtB,QAAM,CAACC,CAAe,IAAIC,EAAA;AAE1B,SACEC,gBAAAA,EAAAA;AAAAA,IAACC;AAAAA,IAAA;AAAA,MAEC,IAAI,aAAab;AAAA,MACjB,SAAS,CAACc,MAAUR,IAAWN,GAAQc,EAAM,WAAWA,EAAM,OAAO;AAAA,MACrE,WAAWC,EAAK,mBAAmB,EAAE,UAAAb,EAAA,GAAYO,CAAgB;AAAA,MACjE,aAAa,CAACO,MAAMX,EAAYW,GAAG,EAAE,OAAAf,GAAO;AAAA,MAC5C,WAAAG;AAAA,MACA,eAAe,CAACU,MAAU;AACxB,QAAKN,MAELM,EAAM,eAAA,GACNJ,EAAgBI,GAAON,CAAgB;AAAA,MACzC;AAAA,MACA,UAAU;AAAA,MAEV,UAAA;AAAA,QAAAS,gBAAAA,MAACC,KAAc,KAAK,iBAAiBf,CAAW,UAAUH,CAAM,cAAc;AAAA,QAE5EO,KAAOU,gBAAAA,EAAAA,IAACE,GAAA,EAAY,UAAAZ,EAAA,CAAI;AAAA,MAAA;AAAA,IAAA;AAAA,IAhBrBP;AAAA,EAAA;AAoBX;"}

package/dist/shared/src/components/ReviewablesSelector/ReviewablesSelector.cjs.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReviewablesSelector.cjs.js","sources":["../../../../../src/components/ReviewablesSelector/ReviewablesSelector.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\nimport Card, { ReviewableCard, ReviewableCardProps } from './Card'\n\ninterface ReviewablesSelectorProps {\n reviewables: ReviewableCard[]\n selected: string[]\n projectName: string \| null\n onChange?: (fileId: string) => void\n onUpload?: () => void\n}\n\nconst ReviewablesSelector: FC<ReviewablesSelectorProps> = ({\n reviewables = [],\n selected = [],\n projectName,\n onChange,\n onUpload,\n}) => {\n const scrollRef = useRef<ScrollBar>(null)\n const scrollContainerRef = useRef<HTMLElement \| null>(null)\n const [labelTooltip, setLabelTooltip] = useState<null \| string>(null)\n const [labelTooltipYPos, setLabelTooltipYPos] = useState<null \| number>(null)\n\n const getScrollTop = (): number => {\n return scrollContainerRef.current?.scrollTop \|\| 0\n }\n\n const scrollReviewableIntoView = (fileId: string) => {\n const container = scrollContainerRef.current\n const el = document.getElementById('preview-' + fileId)\n if (!container \|\| !el) return\n\n const containerRect = container.getBoundingClientRect()\n const itemRect = el.getBoundingClientRect()\n\n if (itemRect.top < containerRect.top) {\n container.scrollTop -= containerRect.top - itemRect.top\n } else if (itemRect.bottom > containerRect.bottom) {\n container.scrollTop += itemRect.bottom - containerRect.bottom\n }\n\n // keep the custom scrollbar thumb in sync with manual scrollTop updates\n // @ts-ignore\n scrollRef.current?.updateScroll?.()\n }\n\n // add keyboard support\n // use up and down arrow keys to navigate through the reviewables\n // if at top and press up, go to bottom, if at bottom and press down, go to top\n useEffect(() => {\n if (reviewables.length === 1) return\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (['w', 's', 'ArrowUp', 'ArrowDown'].includes(e.key)) {\n // Check if e.target is an HTMLElement before accessing tagName or isContentEditable\n if (isHTMLElement(e.target)) {\n if (e.target.tagName === 'INPUT' \|\| e.target.tagName === 'TEXTAREA') return\n if (e.target.isContentEditable) return\n }\n\n const currentIndex = reviewables.findIndex(({ fileId }) => selected.includes(fileId))\n const nextIndex = e.key === 'w' \|\| e.key === 'ArrowUp' ? currentIndex - 1 : currentIndex + 1\n const nextReviewable =\n reviewables[nextIndex < 0 ? reviewables.length - 1 : nextIndex % reviewables.length]\n const nextFileId = nextReviewable.fileId\n\n onChange && onChange(nextFileId)\n requestAnimationFrame(() => scrollReviewableIntoView(nextFileId))\n // also set new label for the tooltip\n setLabelTooltip(nextReviewable.label ?? null)\n // set label tooltip position\n const el = document.getElementById('preview-' + nextFileId)\n\n if (el) {\n const top = el.offsetTop + el.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n }\n }\n\n window.addEventListener('keydown', handleKeyDown)\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown)\n }\n }, [selected, reviewables, onChange])\n\n // keep track of when NOT hovering over the reviewable cards\n useEffect(() => {\n const handleMouseMove = (event: MouseEvent) => {\n // check if the mouse is over a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewables')\n if (!closest) {\n setLabelTooltip(null)\n }\n }\n\n window.addEventListener('mousemove', handleMouseMove)\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove)\n }\n }, [])\n\n const handleMouseOver = (\n event: React.MouseEvent<HTMLDivElement>,\n { label }: Pick<ReviewableCardProps, 'label'>,\n ) => {\n // check event is coming from a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n setLabelTooltip(label ?? null)\n // set label tooltip position\n const top = closest.offsetTop + closest.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n\n // select with enter or space key when focused on a reviewable card\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n const fileId = closest.id.replace('preview-', '')\n onChange && onChange(fileId)\n }\n }\n\n // if no reviewables, return null\n if (!reviewables.length) return <div />\n\n return (\n <Styled.ReviewablesSelector>\n <Styled.Scrollable\n className=\"reviewables\"\n ref={scrollRef}\n containerRef={(ref) => {\n scrollContainerRef.current = ref\n }}\n >\n {reviewables.map(({ fileId, label, tag, selectionVariant, contextMenuItems }) => (\n <Card\n projectName={projectName}\n fileId={fileId}\n label={label}\n selected={selected.includes(fileId)}\n selectionVariant={selectionVariant}\n tag={tag}\n contextMenuItems={contextMenuItems}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n onMouseOver={handleMouseOver}\n />\n ))}\n {!!onUpload && (\n <Styled.AddButton\n icon=\"add\"\n onClick={onUpload}\n onMouseEnter={() => setLabelTooltip(null)}\n />\n )}\n </Styled.Scrollable>\n {labelTooltip && labelTooltipYPos && (\n <Styled.Label style={{ top: labelTooltipYPos }}>{labelTooltip}</Styled.Label>\n )}\n </Styled.ReviewablesSelector>\n )\n}\n\nexport default ReviewablesSelector\n"],"names":["ReviewablesSelector","reviewables","selected","projectName","onChange","onUpload","scrollRef","useRef","scrollContainerRef","labelTooltip","setLabelTooltip","useState","labelTooltipYPos","setLabelTooltipYPos","getScrollTop","scrollReviewableIntoView","fileId","container","el","containerRect","itemRect","useEffect","handleKeyDown","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","tag","selectionVariant","contextMenuItems","jsx","Card","Styled.AddButton","Styled.Label"],"mappings":"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"}
1	+ {"version":3,"file":"ReviewablesSelector.cjs.js","sources":["../../../../../src/components/ReviewablesSelector/ReviewablesSelector.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\nimport Card, { ReviewableCard, ReviewableCardProps } from './Card'\n\ninterface ReviewablesSelectorProps {\n reviewables: ReviewableCard[]\n selected: string[]\n projectName: string \| null\n onChange?: (fileId: string, modifier?: boolean) => void\n onUpload?: () => void\n}\n\nconst ReviewablesSelector: FC<ReviewablesSelectorProps> = ({\n reviewables = [],\n selected = [],\n projectName,\n onChange,\n onUpload,\n}) => {\n const scrollRef = useRef<ScrollBar>(null)\n const scrollContainerRef = useRef<HTMLElement \| null>(null)\n const [labelTooltip, setLabelTooltip] = useState<null \| string>(null)\n const [labelTooltipYPos, setLabelTooltipYPos] = useState<null \| number>(null)\n\n const getScrollTop = (): number => {\n return scrollContainerRef.current?.scrollTop \|\| 0\n }\n\n const scrollReviewableIntoView = (fileId: string) => {\n const container = scrollContainerRef.current\n const el = document.getElementById('preview-' + fileId)\n if (!container \|\| !el) return\n\n const containerRect = container.getBoundingClientRect()\n const itemRect = el.getBoundingClientRect()\n\n if (itemRect.top < containerRect.top) {\n container.scrollTop -= containerRect.top - itemRect.top\n } else if (itemRect.bottom > containerRect.bottom) {\n container.scrollTop += itemRect.bottom - containerRect.bottom\n }\n\n // keep the custom scrollbar thumb in sync with manual scrollTop updates\n // @ts-ignore\n scrollRef.current?.updateScroll?.()\n }\n\n // add keyboard support\n // use up and down arrow keys to navigate through the reviewables\n // if at top and press up, go to bottom, if at bottom and press down, go to top\n useEffect(() => {\n if (reviewables.length === 1) return\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (['w', 's', 'ArrowUp', 'ArrowDown'].includes(e.key)) {\n // Check if e.target is an HTMLElement before accessing tagName or isContentEditable\n if (isHTMLElement(e.target)) {\n if (e.target.tagName === 'INPUT' \|\| e.target.tagName === 'TEXTAREA') return\n if (e.target.isContentEditable) return\n }\n\n const currentIndex = reviewables.findIndex(({ fileId }) => selected.includes(fileId))\n const nextIndex = e.key === 'w' \|\| e.key === 'ArrowUp' ? currentIndex - 1 : currentIndex + 1\n const nextReviewable =\n reviewables[nextIndex < 0 ? reviewables.length - 1 : nextIndex % reviewables.length]\n const nextFileId = nextReviewable.fileId\n\n onChange && onChange(nextFileId)\n requestAnimationFrame(() => scrollReviewableIntoView(nextFileId))\n // also set new label for the tooltip\n setLabelTooltip(nextReviewable.label ?? null)\n // set label tooltip position\n const el = document.getElementById('preview-' + nextFileId)\n\n if (el) {\n const top = el.offsetTop + el.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n }\n }\n\n window.addEventListener('keydown', handleKeyDown)\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown)\n }\n }, [selected, reviewables, onChange])\n\n // keep track of when NOT hovering over the reviewable cards\n useEffect(() => {\n const handleMouseMove = (event: MouseEvent) => {\n // check if the mouse is over a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewables')\n if (!closest) {\n setLabelTooltip(null)\n }\n }\n\n window.addEventListener('mousemove', handleMouseMove)\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove)\n }\n }, [])\n\n const handleMouseOver = (\n event: React.MouseEvent<HTMLDivElement>,\n { label }: Pick<ReviewableCardProps, 'label'>,\n ) => {\n // check event is coming from a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n setLabelTooltip(label ?? null)\n // set label tooltip position\n const top = closest.offsetTop + closest.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n\n // select with enter or space key when focused on a reviewable card\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n const fileId = closest.id.replace('preview-', '')\n onChange && onChange(fileId)\n }\n }\n\n // if no reviewables, return null\n if (!reviewables.length) return <div />\n\n return (\n <Styled.ReviewablesSelector>\n <Styled.Scrollable\n className=\"reviewables\"\n ref={scrollRef}\n containerRef={(ref) => {\n scrollContainerRef.current = ref\n }}\n >\n {reviewables.map(({ fileId, label, tag, selectionVariant, contextMenuItems }) => (\n <Card\n projectName={projectName}\n fileId={fileId}\n label={label}\n selected={selected.includes(fileId)}\n selectionVariant={selectionVariant}\n tag={tag}\n contextMenuItems={contextMenuItems}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n onMouseOver={handleMouseOver}\n />\n ))}\n {!!onUpload && (\n <Styled.AddButton\n icon=\"add\"\n onClick={onUpload}\n onMouseEnter={() => setLabelTooltip(null)}\n />\n )}\n </Styled.Scrollable>\n {labelTooltip && labelTooltipYPos && (\n <Styled.Label style={{ top: labelTooltipYPos }}>{labelTooltip}</Styled.Label>\n )}\n </Styled.ReviewablesSelector>\n )\n}\n\nexport default ReviewablesSelector\n"],"names":["ReviewablesSelector","reviewables","selected","projectName","onChange","onUpload","scrollRef","useRef","scrollContainerRef","labelTooltip","setLabelTooltip","useState","labelTooltipYPos","setLabelTooltipYPos","getScrollTop","scrollReviewableIntoView","fileId","container","el","containerRect","itemRect","useEffect","handleKeyDown","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","tag","selectionVariant","contextMenuItems","jsx","Card","Styled.AddButton","Styled.Label"],"mappings":"gUAcMA,EAAoD,CAAC,CACzD,YAAAC,EAAc,CAAA,EACd,SAAAC,EAAW,CAAA,EACX,YAAAC,EACA,SAAAC,EACA,SAAAC,CACF,IAAM,CACJ,MAAMC,EAAYC,EAAAA,OAAkB,IAAI,EAClCC,EAAqBD,EAAAA,OAA2B,IAAI,EACpD,CAACE,EAAcC,CAAe,EAAIC,EAAAA,SAAwB,IAAI,EAC9D,CAACC,EAAkBC,CAAmB,EAAIF,EAAAA,SAAwB,IAAI,EAEtEG,EAAe,IACZN,EAAmB,SAAS,WAAa,EAG5CO,EAA4BC,GAAmB,CACnD,MAAMC,EAAYT,EAAmB,QAC/BU,EAAK,SAAS,eAAe,WAAaF,CAAM,EACtD,GAAI,CAACC,GAAa,CAACC,EAAI,OAEvB,MAAMC,EAAgBF,EAAU,sBAAA,EAC1BG,EAAWF,EAAG,sBAAA,EAEhBE,EAAS,IAAMD,EAAc,IAC/BF,EAAU,WAAaE,EAAc,IAAMC,EAAS,IAC3CA,EAAS,OAASD,EAAc,SACzCF,EAAU,WAAaG,EAAS,OAASD,EAAc,QAKzDb,EAAU,SAAS,eAAA,CACrB,EAKAe,EAAAA,UAAU,IAAM,CACd,GAAIpB,EAAY,SAAW,EAAG,OAE9B,MAAMqB,EAAiB,GAAqB,CAC1C,GAAI,CAAC,IAAK,IAAK,UAAW,WAAW,EAAE,SAAS,EAAE,GAAG,EAAG,CAEtD,GAAIC,EAAc,EAAE,MAAM,IACpB,EAAE,OAAO,UAAY,SAAW,EAAE,OAAO,UAAY,YACrD,EAAE,OAAO,mBAAmB,OAGlC,MAAMC,EAAevB,EAAY,UAAU,CAAC,CAAE,OAAAe,KAAad,EAAS,SAASc,CAAM,CAAC,EAC9ES,EAAY,EAAE,MAAQ,KAAO,EAAE,MAAQ,UAAYD,EAAe,EAAIA,EAAe,EACrFE,EACJzB,EAAYwB,EAAY,EAAIxB,EAAY,OAAS,EAAIwB,EAAYxB,EAAY,MAAM,EAC/E0B,EAAaD,EAAe,OAElCtB,GAAYA,EAASuB,CAAU,EAC/B,sBAAsB,IAAMZ,EAAyBY,CAAU,CAAC,EAEhEjB,EAAgBgB,EAAe,OAAS,IAAI,EAE5C,MAAMR,EAAK,SAAS,eAAe,WAAaS,CAAU,EAE1D,GAAIT,EAAI,CACN,MAAMU,EAAMV,EAAG,UAAYA,EAAG,aAAe,EAAIJ,EAAA,EACjDD,EAAoBe,CAAG,CACzB,CACF,CACF,EAEA,cAAO,iBAAiB,UAAWN,CAAa,EAEzC,IAAM,CACX,OAAO,oBAAoB,UAAWA,CAAa,CACrD,CACF,EAAG,CAACpB,EAAUD,EAAaG,CAAQ,CAAC,EAGpCiB,EAAAA,UAAU,IAAM,CACd,MAAMQ,EAAmBC,GAAsB,CAE5BA,EAAM,OAAuB,QAAQ,cAAc,GAElEpB,EAAgB,IAAI,CAExB,EAEA,cAAO,iBAAiB,YAAamB,CAAe,EAE7C,IAAM,CACX,OAAO,oBAAoB,YAAaA,CAAe,CACzD,CACF,EAAG,CAAA,CAAE,EAEL,MAAME,EAAkB,CACtBD,EACA,CAAE,MAAAE,KACC,CAEH,MAAMC,EAAWH,EAAM,OAAuB,QAAQ,kBAAkB,EACxE,GAAI,CAACG,EAAS,OACdvB,EAAgBsB,GAAS,IAAI,EAE7B,MAAMJ,EAAMK,EAAQ,UAAYA,EAAQ,aAAe,EAAInB,EAAA,EAC3DD,EAAoBe,CAAG,CACzB,EAGMN,EAAiBQ,GAA+C,CACpE,GAAIA,EAAM,MAAQ,SAAWA,EAAM,MAAQ,IAAK,CAC9C,MAAMG,EAAWH,EAAM,OAAuB,QAAQ,kBAAkB,EACxE,GAAI,CAACG,EAAS,OACd,MAAMjB,EAASiB,EAAQ,GAAG,QAAQ,WAAY,EAAE,EAChD7B,GAAYA,EAASY,CAAM,CAC7B,CACF,EAGA,OAAKf,EAAY,OAGfiC,EAAAA,kBAAAA,KAACC,sBAAA,CACC,SAAA,CAAAD,EAAAA,kBAAAA,KAACE,EAAAA,WAAA,CACC,UAAU,cACV,IAAK9B,EACL,aAAe+B,GAAQ,CACrB7B,EAAmB,QAAU6B,CAC/B,EAEC,SAAA,CAAApC,EAAY,IAAI,CAAC,CAAE,OAAAe,EAAQ,MAAAgB,EAAO,IAAAM,EAAK,iBAAAC,EAAkB,iBAAAC,KACxDC,EAAAA,kBAAAA,IAACC,EAAA,CACC,YAAAvC,EACA,OAAAa,EACA,MAAAgB,EACA,SAAU9B,EAAS,SAASc,CAAM,EAClC,iBAAAuB,EACA,IAAAD,EACA,iBAAAE,EACA,SAAApC,EACA,UAAWkB,EACX,YAAaS,CAAA,CAAA,CAEhB,EACA,CAAC,CAAC1B,GACDoC,EAAAA,kBAAAA,IAACE,EAAAA,UAAA,CACC,KAAK,MACL,QAAStC,EACT,aAAc,IAAMK,EAAgB,IAAI,CAAA,CAAA,CAC1C,CAAA,CAAA,EAGHD,GAAgBG,GACf6B,wBAACG,EAAAA,MAAA,CAAa,MAAO,CAAE,IAAKhC,CAAA,EAAqB,SAAAH,CAAA,CAAa,CAAA,EAElE,0BApC+B,MAAA,CAAA,CAAI,CAsCvC"}

package/dist/shared/src/components/ReviewablesSelector/ReviewablesSelector.es.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"ReviewablesSelector.es.js","sources":["../../../../../src/components/ReviewablesSelector/ReviewablesSelector.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\nimport Card, { ReviewableCard, ReviewableCardProps } from './Card'\n\ninterface ReviewablesSelectorProps {\n reviewables: ReviewableCard[]\n selected: string[]\n projectName: string \| null\n onChange?: (fileId: string) => void\n onUpload?: () => void\n}\n\nconst ReviewablesSelector: FC<ReviewablesSelectorProps> = ({\n reviewables = [],\n selected = [],\n projectName,\n onChange,\n onUpload,\n}) => {\n const scrollRef = useRef<ScrollBar>(null)\n const scrollContainerRef = useRef<HTMLElement \| null>(null)\n const [labelTooltip, setLabelTooltip] = useState<null \| string>(null)\n const [labelTooltipYPos, setLabelTooltipYPos] = useState<null \| number>(null)\n\n const getScrollTop = (): number => {\n return scrollContainerRef.current?.scrollTop \|\| 0\n }\n\n const scrollReviewableIntoView = (fileId: string) => {\n const container = scrollContainerRef.current\n const el = document.getElementById('preview-' + fileId)\n if (!container \|\| !el) return\n\n const containerRect = container.getBoundingClientRect()\n const itemRect = el.getBoundingClientRect()\n\n if (itemRect.top < containerRect.top) {\n container.scrollTop -= containerRect.top - itemRect.top\n } else if (itemRect.bottom > containerRect.bottom) {\n container.scrollTop += itemRect.bottom - containerRect.bottom\n }\n\n // keep the custom scrollbar thumb in sync with manual scrollTop updates\n // @ts-ignore\n scrollRef.current?.updateScroll?.()\n }\n\n // add keyboard support\n // use up and down arrow keys to navigate through the reviewables\n // if at top and press up, go to bottom, if at bottom and press down, go to top\n useEffect(() => {\n if (reviewables.length === 1) return\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (['w', 's', 'ArrowUp', 'ArrowDown'].includes(e.key)) {\n // Check if e.target is an HTMLElement before accessing tagName or isContentEditable\n if (isHTMLElement(e.target)) {\n if (e.target.tagName === 'INPUT' \|\| e.target.tagName === 'TEXTAREA') return\n if (e.target.isContentEditable) return\n }\n\n const currentIndex = reviewables.findIndex(({ fileId }) => selected.includes(fileId))\n const nextIndex = e.key === 'w' \|\| e.key === 'ArrowUp' ? currentIndex - 1 : currentIndex + 1\n const nextReviewable =\n reviewables[nextIndex < 0 ? reviewables.length - 1 : nextIndex % reviewables.length]\n const nextFileId = nextReviewable.fileId\n\n onChange && onChange(nextFileId)\n requestAnimationFrame(() => scrollReviewableIntoView(nextFileId))\n // also set new label for the tooltip\n setLabelTooltip(nextReviewable.label ?? null)\n // set label tooltip position\n const el = document.getElementById('preview-' + nextFileId)\n\n if (el) {\n const top = el.offsetTop + el.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n }\n }\n\n window.addEventListener('keydown', handleKeyDown)\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown)\n }\n }, [selected, reviewables, onChange])\n\n // keep track of when NOT hovering over the reviewable cards\n useEffect(() => {\n const handleMouseMove = (event: MouseEvent) => {\n // check if the mouse is over a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewables')\n if (!closest) {\n setLabelTooltip(null)\n }\n }\n\n window.addEventListener('mousemove', handleMouseMove)\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove)\n }\n }, [])\n\n const handleMouseOver = (\n event: React.MouseEvent<HTMLDivElement>,\n { label }: Pick<ReviewableCardProps, 'label'>,\n ) => {\n // check event is coming from a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n setLabelTooltip(label ?? null)\n // set label tooltip position\n const top = closest.offsetTop + closest.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n\n // select with enter or space key when focused on a reviewable card\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n const fileId = closest.id.replace('preview-', '')\n onChange && onChange(fileId)\n }\n }\n\n // if no reviewables, return null\n if (!reviewables.length) return <div />\n\n return (\n <Styled.ReviewablesSelector>\n <Styled.Scrollable\n className=\"reviewables\"\n ref={scrollRef}\n containerRef={(ref) => {\n scrollContainerRef.current = ref\n }}\n >\n {reviewables.map(({ fileId, label, tag, selectionVariant, contextMenuItems }) => (\n <Card\n projectName={projectName}\n fileId={fileId}\n label={label}\n selected={selected.includes(fileId)}\n selectionVariant={selectionVariant}\n tag={tag}\n contextMenuItems={contextMenuItems}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n onMouseOver={handleMouseOver}\n />\n ))}\n {!!onUpload && (\n <Styled.AddButton\n icon=\"add\"\n onClick={onUpload}\n onMouseEnter={() => setLabelTooltip(null)}\n />\n )}\n </Styled.Scrollable>\n {labelTooltip && labelTooltipYPos && (\n <Styled.Label style={{ top: labelTooltipYPos }}>{labelTooltip}</Styled.Label>\n )}\n </Styled.ReviewablesSelector>\n )\n}\n\nexport default ReviewablesSelector\n"],"names":["ReviewablesSelector","reviewables","selected","projectName","onChange","onUpload","scrollRef","useRef","scrollContainerRef","labelTooltip","setLabelTooltip","useState","labelTooltipYPos","setLabelTooltipYPos","getScrollTop","scrollReviewableIntoView","fileId","container","el","containerRect","itemRect","useEffect","handleKeyDown","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","tag","selectionVariant","contextMenuItems","jsx","Card","Styled.AddButton","Styled.Label"],"mappings":"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"}
1	+ {"version":3,"file":"ReviewablesSelector.es.js","sources":["../../../../../src/components/ReviewablesSelector/ReviewablesSelector.tsx"],"sourcesContent":["import { FC, useEffect, useRef, useState } from 'react'\nimport * as Styled from './ReviewablesSelector.styled'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\nimport Card, { ReviewableCard, ReviewableCardProps } from './Card'\n\ninterface ReviewablesSelectorProps {\n reviewables: ReviewableCard[]\n selected: string[]\n projectName: string \| null\n onChange?: (fileId: string, modifier?: boolean) => void\n onUpload?: () => void\n}\n\nconst ReviewablesSelector: FC<ReviewablesSelectorProps> = ({\n reviewables = [],\n selected = [],\n projectName,\n onChange,\n onUpload,\n}) => {\n const scrollRef = useRef<ScrollBar>(null)\n const scrollContainerRef = useRef<HTMLElement \| null>(null)\n const [labelTooltip, setLabelTooltip] = useState<null \| string>(null)\n const [labelTooltipYPos, setLabelTooltipYPos] = useState<null \| number>(null)\n\n const getScrollTop = (): number => {\n return scrollContainerRef.current?.scrollTop \|\| 0\n }\n\n const scrollReviewableIntoView = (fileId: string) => {\n const container = scrollContainerRef.current\n const el = document.getElementById('preview-' + fileId)\n if (!container \|\| !el) return\n\n const containerRect = container.getBoundingClientRect()\n const itemRect = el.getBoundingClientRect()\n\n if (itemRect.top < containerRect.top) {\n container.scrollTop -= containerRect.top - itemRect.top\n } else if (itemRect.bottom > containerRect.bottom) {\n container.scrollTop += itemRect.bottom - containerRect.bottom\n }\n\n // keep the custom scrollbar thumb in sync with manual scrollTop updates\n // @ts-ignore\n scrollRef.current?.updateScroll?.()\n }\n\n // add keyboard support\n // use up and down arrow keys to navigate through the reviewables\n // if at top and press up, go to bottom, if at bottom and press down, go to top\n useEffect(() => {\n if (reviewables.length === 1) return\n\n const handleKeyDown = (e: KeyboardEvent) => {\n if (['w', 's', 'ArrowUp', 'ArrowDown'].includes(e.key)) {\n // Check if e.target is an HTMLElement before accessing tagName or isContentEditable\n if (isHTMLElement(e.target)) {\n if (e.target.tagName === 'INPUT' \|\| e.target.tagName === 'TEXTAREA') return\n if (e.target.isContentEditable) return\n }\n\n const currentIndex = reviewables.findIndex(({ fileId }) => selected.includes(fileId))\n const nextIndex = e.key === 'w' \|\| e.key === 'ArrowUp' ? currentIndex - 1 : currentIndex + 1\n const nextReviewable =\n reviewables[nextIndex < 0 ? reviewables.length - 1 : nextIndex % reviewables.length]\n const nextFileId = nextReviewable.fileId\n\n onChange && onChange(nextFileId)\n requestAnimationFrame(() => scrollReviewableIntoView(nextFileId))\n // also set new label for the tooltip\n setLabelTooltip(nextReviewable.label ?? null)\n // set label tooltip position\n const el = document.getElementById('preview-' + nextFileId)\n\n if (el) {\n const top = el.offsetTop + el.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n }\n }\n\n window.addEventListener('keydown', handleKeyDown)\n\n return () => {\n window.removeEventListener('keydown', handleKeyDown)\n }\n }, [selected, reviewables, onChange])\n\n // keep track of when NOT hovering over the reviewable cards\n useEffect(() => {\n const handleMouseMove = (event: MouseEvent) => {\n // check if the mouse is over a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewables')\n if (!closest) {\n setLabelTooltip(null)\n }\n }\n\n window.addEventListener('mousemove', handleMouseMove)\n\n return () => {\n window.removeEventListener('mousemove', handleMouseMove)\n }\n }, [])\n\n const handleMouseOver = (\n event: React.MouseEvent<HTMLDivElement>,\n { label }: Pick<ReviewableCardProps, 'label'>,\n ) => {\n // check event is coming from a reviewable card\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n setLabelTooltip(label ?? null)\n // set label tooltip position\n const top = closest.offsetTop + closest.offsetHeight / 2 - getScrollTop()\n setLabelTooltipYPos(top)\n }\n\n // select with enter or space key when focused on a reviewable card\n const handleKeyDown = (event: React.KeyboardEvent<HTMLDivElement>) => {\n if (event.key === 'Enter' \|\| event.key === ' ') {\n const closest = (event.target as HTMLElement).closest('.reviewable-card') as HTMLElement\n if (!closest) return\n const fileId = closest.id.replace('preview-', '')\n onChange && onChange(fileId)\n }\n }\n\n // if no reviewables, return null\n if (!reviewables.length) return <div />\n\n return (\n <Styled.ReviewablesSelector>\n <Styled.Scrollable\n className=\"reviewables\"\n ref={scrollRef}\n containerRef={(ref) => {\n scrollContainerRef.current = ref\n }}\n >\n {reviewables.map(({ fileId, label, tag, selectionVariant, contextMenuItems }) => (\n <Card\n projectName={projectName}\n fileId={fileId}\n label={label}\n selected={selected.includes(fileId)}\n selectionVariant={selectionVariant}\n tag={tag}\n contextMenuItems={contextMenuItems}\n onChange={onChange}\n onKeyDown={handleKeyDown}\n onMouseOver={handleMouseOver}\n />\n ))}\n {!!onUpload && (\n <Styled.AddButton\n icon=\"add\"\n onClick={onUpload}\n onMouseEnter={() => setLabelTooltip(null)}\n />\n )}\n </Styled.Scrollable>\n {labelTooltip && labelTooltipYPos && (\n <Styled.Label style={{ top: labelTooltipYPos }}>{labelTooltip}</Styled.Label>\n )}\n </Styled.ReviewablesSelector>\n )\n}\n\nexport default ReviewablesSelector\n"],"names":["ReviewablesSelector","reviewables","selected","projectName","onChange","onUpload","scrollRef","useRef","scrollContainerRef","labelTooltip","setLabelTooltip","useState","labelTooltipYPos","setLabelTooltipYPos","getScrollTop","scrollReviewableIntoView","fileId","container","el","containerRect","itemRect","useEffect","handleKeyDown","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","tag","selectionVariant","contextMenuItems","jsx","Card","Styled.AddButton","Styled.Label"],"mappings":"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"}

package/dist/types/api/generated/projects.d.ts CHANGED Viewed

@@ -16,7 +16,7 @@ declare const injectedRtkApi: import('@reduxjs/toolkit/query').Api<import('@redu
     deleteProjectFolder: import('@reduxjs/toolkit/query').MutationDefinition<DeleteProjectFolderApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
     updateProjectFolder: import('@reduxjs/toolkit/query').MutationDefinition<UpdateProjectFolderApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
     getProjectAnatomy: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectAnatomyApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, Anatomy, "restApi", unknown>;
-    setProjectAnatomy: import('@reduxjs/toolkit/query').MutationDefinition<SetProjectAnatomyApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, unknown, "restApi", unknown>;
+    setProjectAnatomy: import('@reduxjs/toolkit/query').MutationDefinition<SetProjectAnatomyApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
     setProjectBundles: import('@reduxjs/toolkit/query').MutationDefinition<SetProjectBundlesApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, unknown, "restApi", unknown>;
     getProjectBundleInfo: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectBundleInfoApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, ProjectBundle, "restApi", unknown>;
     setProjectBundle: import('@reduxjs/toolkit/query').MutationDefinition<SetProjectBundleApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
@@ -32,12 +32,15 @@ declare const injectedRtkApi: import('@reduxjs/toolkit/query').Api<import('@redu
     deleteProject: import('@reduxjs/toolkit/query').MutationDefinition<DeleteProjectApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, unknown, "restApi", unknown>;
     updateProject: import('@reduxjs/toolkit/query').MutationDefinition<UpdateProjectApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, unknown, "restApi", unknown>;
     getProjectStats: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectStatsApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
+    changeProjectName: import('@reduxjs/toolkit/query').MutationDefinition<ChangeProjectNameApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, unknown, "restApi", unknown>;
     getProjectRootsOverrides: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectRootsOverridesApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, GetProjectRootsOverridesApiResponse, "restApi", unknown>;
     setProjectRootsOverrides: import('@reduxjs/toolkit/query').MutationDefinition<SetProjectRootsOverridesApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
     getProjectSiteRoots: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectSiteRootsApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, GetProjectSiteRootsApiResponse, "restApi", unknown>;
     getProjectTags: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectTagsApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, ProjectTagsModel, "restApi", unknown>;
     getProjectUsers: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectUsersApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, GetProjectUsersApiResponse, "restApi", unknown>;
     updateProjectUser: import('@reduxjs/toolkit/query').MutationDefinition<UpdateProjectUserApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, UpdateProjectUserApiResponse, "restApi", unknown>;
+    getProjectThumbnail: import('@reduxjs/toolkit/query').QueryDefinition<GetProjectThumbnailApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, any, "restApi", unknown>;
+    createProjectThumbnail: import('@reduxjs/toolkit/query').MutationDefinition<CreateProjectThumbnailApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, CreateThumbnailResponseModel, "restApi", unknown>;
     getProjectEntityUris: import('@reduxjs/toolkit/query').MutationDefinition<GetProjectEntityUrisApiArg, import('@reduxjs/toolkit/query').BaseQueryFn<string | import('@reduxjs/toolkit/query').FetchArgs, unknown, import('@reduxjs/toolkit/query').FetchBaseQueryError>, string, GetUrisResponse, "restApi", unknown>;
 }, "restApi", string, typeof import('@reduxjs/toolkit/query').coreModuleName | typeof import('@reduxjs/toolkit/dist/query/react').reactHooksModuleName>;
 export { injectedRtkApi as api };
@@ -45,8 +48,6 @@ export type DeleteProjectActivityApiResponse = any;
 export type DeleteProjectActivityApiArg = {
     projectName: string;
     activityId: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
 };
 export type GetProjectFileApiResponse = any;
 export type GetProjectFileApiArg = {
@@ -124,18 +125,14 @@ export type GetProjectAnatomyApiResponse = Anatomy;
 export type GetProjectAnatomyApiArg = {
     projectName: string;
 };
-export type SetProjectAnatomyApiResponse = unknown;
+export type SetProjectAnatomyApiResponse = any;
 export type SetProjectAnatomyApiArg = {
     projectName: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
     anatomy: Anatomy;
 };
 export type SetProjectBundlesApiResponse = unknown;
 export type SetProjectBundlesApiArg = {
     projectName: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
     projectBundleModel: ProjectBundleModel;
 };
 export type GetProjectBundleInfoApiResponse = ProjectBundle;
@@ -147,16 +144,12 @@ export type SetProjectBundleApiResponse = any;
 export type SetProjectBundleApiArg = {
     projectName: string;
     variant?: 'production' | 'staging';
-    'x-sender'?: string;
-    'x-sender-type'?: string;
     projectBundle: ProjectBundle;
 };
 export type UnsetProjectBundleApiResponse = unknown;
 export type UnsetProjectBundleApiArg = {
     projectName: string;
     variant?: 'production' | 'staging';
-    'x-sender'?: string;
-    'x-sender-type'?: string;
 };
 export type ListProjectsApiResponse =
 /** status 200 Successful Response */ ListProjectsResponseModel;
@@ -169,6 +162,7 @@ export type ListProjectsApiArg = {
     library?: boolean;
     /** If not provided, return projects regardless the flag */
     active?: boolean;
+    skeleton?: boolean;
     /** Attribute to order the list by */
     order?: 'name' | 'createdAt' | 'updatedAt';
     desc?: boolean;
@@ -205,27 +199,26 @@ export type GetProjectApiArg = {
 export type CreateProjectApiResponse = any;
 export type CreateProjectApiArg = {
     projectName: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
     projectPostModel: ProjectPostModel;
 };
 export type DeleteProjectApiResponse = unknown;
 export type DeleteProjectApiArg = {
     projectName: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
 };
 export type UpdateProjectApiResponse = unknown;
 export type UpdateProjectApiArg = {
     projectName: string;
-    'x-sender'?: string;
-    'x-sender-type'?: string;
     projectPatchModel: ProjectPatchModel;
 };
 export type GetProjectStatsApiResponse = any;
 export type GetProjectStatsApiArg = {
     projectName: string;
 };
+export type ChangeProjectNameApiResponse = unknown;
+export type ChangeProjectNameApiArg = {
+    projectName: string;
+    renameProjectRequestModel: RenameProjectRequestModel;
+};
 export type GetProjectRootsOverridesApiResponse = {
     [key: string]: {
         [key: string]: string;
@@ -269,6 +262,18 @@ export type UpdateProjectUserApiArg = {
     userName: string;
     accessGroups: string[];
 };
+export type GetProjectThumbnailApiResponse = any;
+export type GetProjectThumbnailApiArg = {
+    projectName: string;
+    placeholder?: 'empty' | 'none';
+    original?: boolean;
+};
+export type CreateProjectThumbnailApiResponse =
+/** status 201 Successful Response */ CreateThumbnailResponseModel;
+export type CreateProjectThumbnailApiArg = {
+    projectName: string;
+    'content-type'?: string;
+};
 export type GetProjectEntityUrisApiResponse = GetUrisResponse;
 export type GetProjectEntityUrisApiArg = {
     projectName: string;
@@ -579,8 +584,10 @@ export type ProjectBundle = {
 export type ListProjectsItemModel = {
     name: string;
     code: string;
+    label?: string;
     active?: boolean;
     library?: boolean;
+    skeleton?: boolean;
     pinned?: boolean;
     projectFolder?: string;
     createdAt: string;
@@ -594,16 +601,16 @@ export type ListProjectsResponseModel = {
     projects?: ListProjectsItemModel[];
 };
 export type DeployProjectRequestModel = {
-    /** Project name */
     name: string;
-    /** Project code */
     code: string;
-    /** Project anatomy */
-    anatomy: Anatomy;
-    /** Library project */
+    anatomy?: Anatomy;
+    /** Anatomy preset to use instead of providing anatomy */
+    anatomyPreset?: string;
     library?: boolean;
     /** Assign default users to the project */
     assignUsers?: boolean;
+    /** Create a project skeleton instead of a full project */
+    skeleton?: boolean;
 };
 export type GuestUserModel = {
     email: string;
@@ -669,6 +676,7 @@ export type ProjectModel = {
     /** Name is an unique id of the {entity_name} */
     name: string;
     code: string;
+    label?: string;
     library?: boolean;
     folderTypes?: FolderType[];
     taskTypes?: TaskType[];
@@ -676,6 +684,7 @@ export type ProjectModel = {
     statuses?: Status[];
     tags?: Tag[];
     config?: object;
+    skeleton?: boolean;
     attrib?: ProjectAttribModel2;
     data?: Record<string, any>;
     /** Whether the project is active */
@@ -688,6 +697,7 @@ export type ProjectModel = {
 };
 export type ProjectPostModel = {
     code: string;
+    label?: string;
     library?: boolean;
     folderTypes?: FolderType[];
     taskTypes?: TaskType[];
@@ -702,6 +712,7 @@ export type ProjectPostModel = {
 };
 export type ProjectPatchModel = {
     code?: string;
+    label?: string;
     library?: boolean;
     folderTypes?: FolderType[];
     taskTypes?: TaskType[];
@@ -714,6 +725,10 @@ export type ProjectPatchModel = {
     /** Whether the project is active */
     active?: boolean;
 };
+export type RenameProjectRequestModel = {
+    /** New project name */
+    newName: string;
+};
 export type ProjectTagsModel = {
     folders?: string[];
     tasks?: string[];
@@ -722,6 +737,9 @@ export type ProjectTagsModel = {
     representations?: string[];
     workfiles?: string[];
 };
+export type CreateThumbnailResponseModel = {
+    id: string;
+};
 export type UriResponseItem = {
     id: string;
     uri: string;