@ynput/ayon-frontend-shared 0.3.21 → 0.3.23

package/dist/shared/src/components/ReviewablesSelector/ReviewablesSelector.cjs.js

@@ -1,2 +1,2 @@
-"use strict";const n=require("../../../../_virtual/jsx-runtime.cjs.js"),s=require("react"),l=require("./ReviewablesSelector.styled.cjs.js"),h=require("clsx");require("../AddonLoadingScreen/AddonLoadingScreen.cjs.js");require("../../../../node_modules/match-sorter/dist/match-sorter.esm.cjs.js");require("@ynput/ayon-react-components");require("../AccessSearchInput/AccessSearchInput.styled.cjs.js");require("../AccessUser/AccessUser.cjs.js");require("lodash");require("../AttributeEditor/components/MinMaxField.cjs.js");require("react-dom");require("@dnd-kit/core");require("@dnd-kit/sortable");require("../EnumEditor/EnumEditor.styled.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("react-toastify");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/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/updateActivities.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/cloud/cloud.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/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/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.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/links/getEntityLinks.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/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("../../../../_virtual/index.cjs.js");require("../../../../node_modules/refractor/lib/common.cjs.js");require("../../../../node_modules/refractor/lib/all.cjs.js");;/* empty css                                                                                */require("uuid");const k=require("../../util/isHTMLElement.cjs.js");require("../../util/pubsub.cjs.js");require("../DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../DetailsPanelDetails/DetailsPanelDetails.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("../../containers/ContextMenu/ContextMenuContext.cjs.js");;/* 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("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/SubtasksModulesContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");require("../../context/PowerpackContext.cjs.js");require("../../context/MoveEntityContext.cjs.js");require("../../context/MenuContext.cjs.js");require("../../context/WebsocketContext.cjs.js");require("../../context/GlobalContext.cjs.js");require("../../context/ProjectContext.cjs.js");require("../../context/ProjectFoldersContext.cjs.js");require("../../context/UriContext.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("../../containers/Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("react-router-dom");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/ActivityCategorySelect/CategoryTag.cjs.js");require("rehype-raw");require("../../containers/Feed/components/ActivityStatusChange/ActivityStatusChange.styled.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/DetailsPanel/components/TabHeaderAndFilters/TabHeaderAndFilters.styled.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.cjs.js");require("@tanstack/react-virtual");require("@tanstack/react-table");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/BooleanWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/CellWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ThumbnailWidget.cjs.js");require("../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.cjs.js");require("../../containers/ProjectTreeTable/context/SelectedRowsContext.cjs.js");require("../LinksManager/LinksManager.styled.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableContext.cjs.js");require("../../containers/ProjectTreeTable/widgets/EmptyWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ErrorWidget.cjs.js");require("../../containers/ProjectTreeTable/context/CellEditingContext.cjs.js");require("../SearchFilter/filterDates.cjs.js");require("short-uuid");require("../../containers/ProjectTreeTable/context/SelectionCellsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.cjs.js");require("../../containers/ProjectTreeTable/context/ClipboardContext.cjs.js");require("../../containers/ProjectTreeTable/context/ColumnSettingsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectDataContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js");require("../../containers/ProjectTreeTable/components/SelectionCell.cjs.js");require("../../containers/ProjectTreeTable/components/RowSelectionHeader.cjs.js");require("../../containers/ProjectTreeTable/widgets/LoadMoreWidget.cjs.js");require("../../containers/ProjectTreeTable/components/HeaderActionButton.cjs.js");require("../../containers/ProjectTreeTable/components/ColumnHeaderMenu.cjs.js");require("../../containers/EntityPickerDialog/EntityPickerDialog.cjs.js");require("../../containers/Slicer/components/Slicer.cjs.js");require("../../containers/Slicer/context/SlicerContext.cjs.js");require("../../containers/Slicer/hooks/useTableDataBySlice.cjs.js");require("../../containers/DetailsPanel/DetailsPanel.styled.cjs.js");require("../../containers/DetailsPanel/components/DetailsPanelTabs/DetailsPanelTabs.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/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/context/ViewsContext.cjs.js");require("../../containers/Views/Views.styled.cjs.js");require("../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../containers/Views/ViewsMenu/ViewsMenu.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/FeedbackContext.cjs.js");require("../Feedback/SupportBubble.cjs.js");const L=require("../FileThumbnail/FileThumbnail.cjs.js");require("../LegacyBadge/LegacyBadge.cjs.js");require("../Powerpack/PowerpackButton.cjs.js");require("../Powerpack/PricingLink.cjs.js");require("../Powerpack/PowerpackDialog.styled.cjs.js");require("../Powerpack/CTAButton.cjs.js");require("../Powerpack/RequiredAddonVersion.cjs.js");require("../ProjectTableSettings/ProjectTableSettings.cjs.js");require("../SizeSlider/SizeSlider.cjs.js");require("../ReviewableCard/ReviewableCard.cjs.js");require("../ReviewableProgressCard/ReviewableProgressCard.styled.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("../TableGridSwitch/TableGridSwitch.cjs.js");require("../Thumbnail/Thumbnail.styled.cjs.js");require("../Thumbnail/StackedThumbnails.cjs.js");require("../ThumbnailSimple/ThumbnailSimple.cjs.js");require("../VersionUploader/components/UploadVersionDialog.cjs.js");require("../VersionUploader/context/VersionUploadContext.cjs.js");require("../Watchers/Watchers.cjs.js");require("../Menu/Menu.styled.cjs.js");require("../Menu/MenuItem.cjs.js");const S=({reviewables:q=[],selected:a=[],projectName:g,onChange:t,onUpload:x})=>{const w=s.useRef(null),d=s.useRef(null),[R,c]=s.useState(null),[E,b]=s.useState(null),v=()=>d.current?.scrollTop||0,j=e=>{const r=d.current,i=document.getElementById("preview-"+e);if(!r||!i)return;const u=r.getBoundingClientRect(),o=i.getBoundingClientRect();o.top<u.top?r.scrollTop-=u.top-o.top:o.bottom>u.bottom&&(r.scrollTop+=o.bottom-u.bottom),w.current?.updateScroll?.()};s.useEffect(()=>{if(q.length===1)return;const e=r=>{if(["w","s","ArrowUp","ArrowDown"].includes(r.key)){if(k(r.target)&&(r.target.tagName==="INPUT"||r.target.tagName==="TEXTAREA"||r.target.isContentEditable))return;const i=q.findIndex(({fileId:f})=>a.includes(f)),u=r.key==="w"||r.key==="ArrowUp"?i-1:i+1,o=q[u<0?q.length-1:u%q.length],p=o.fileId;t&&t(p),requestAnimationFrame(()=>j(p)),c(o.label??null);const m=document.getElementById("preview-"+p);if(m){const f=m.offsetTop+m.offsetHeight/2-v();b(f)}}};return window.addEventListener("keydown",e),()=>{window.removeEventListener("keydown",e)}},[a,q,t]),s.useEffect(()=>{const e=r=>{r.target.closest(".reviewables")||c(null)};return window.addEventListener("mousemove",e),()=>{window.removeEventListener("mousemove",e)}},[]);const T=(e,{label:r})=>{const i=e.target.closest(".reviewable-card");if(!i)return;c(r??null);const u=i.offsetTop+i.offsetHeight/2-v();b(u)},y=e=>{if(e.key==="Enter"||e.key===" "){const r=e.target.closest(".reviewable-card");if(!r)return;const i=r.id.replace("preview-","");t&&t(i)}};return q.length?n.jsxRuntimeExports.jsxs(l.ReviewablesSelector,{children:[n.jsxRuntimeExports.jsxs(l.Scrollable,{className:"reviewables",ref:w,containerRef:e=>{d.current=e},children:[q.map(({fileId:e,label:r})=>n.jsxRuntimeExports.jsx(l.ReviewableCard,{id:"preview-"+e,onClick:()=>t&&t(e),className:h("reviewable-card",{selected:a.includes(e)}),onMouseOver:i=>T(i,{label:r}),onKeyDown:y,tabIndex:0,children:n.jsxRuntimeExports.jsx(L.FileThumbnail,{src:`/api/projects/${g}/files/${e}/thumbnail`})},e)),!!x&&n.jsxRuntimeExports.jsx(l.AddButton,{icon:"add",onClick:x,onMouseEnter:()=>c(null)})]}),R&&E&&n.jsxRuntimeExports.jsx(l.Label,{style:{top:E},children:R})]}):n.jsxRuntimeExports.jsx("div",{})};module.exports=S;
+"use strict";const c=require("../../../../_virtual/jsx-runtime.cjs.js"),i=require("react"),d=require("./ReviewablesSelector.styled.cjs.js");require("lodash");require("react-toastify");require("uuid");const I=require("../../util/isHTMLElement.cjs.js");require("../../util/pubsub.cjs.js");const h=require("./Card.cjs.js"),k=({reviewables:r=[],selected:a=[],projectName:y,onChange:l,onUpload:w})=>{const R=i.useRef(null),f=i.useRef(null),[E,u]=i.useState(null),[g,v]=i.useState(null),b=()=>f.current?.scrollTop||0,T=t=>{const e=f.current,o=document.getElementById("preview-"+t);if(!e||!o)return;const n=e.getBoundingClientRect(),s=o.getBoundingClientRect();s.top<n.top?e.scrollTop-=n.top-s.top:s.bottom>n.bottom&&(e.scrollTop+=s.bottom-n.bottom),R.current?.updateScroll?.()};i.useEffect(()=>{if(r.length===1)return;const t=e=>{if(["w","s","ArrowUp","ArrowDown"].includes(e.key)){if(I(e.target)&&(e.target.tagName==="INPUT"||e.target.tagName==="TEXTAREA"||e.target.isContentEditable))return;const o=r.findIndex(({fileId:x})=>a.includes(x)),n=e.key==="w"||e.key==="ArrowUp"?o-1:o+1,s=r[n<0?r.length-1:n%r.length],p=s.fileId;l&&l(p),requestAnimationFrame(()=>T(p)),u(s.label??null);const m=document.getElementById("preview-"+p);if(m){const x=m.offsetTop+m.offsetHeight/2-b();v(x)}}};return window.addEventListener("keydown",t),()=>{window.removeEventListener("keydown",t)}},[a,r,l]),i.useEffect(()=>{const t=e=>{e.target.closest(".reviewables")||u(null)};return window.addEventListener("mousemove",t),()=>{window.removeEventListener("mousemove",t)}},[]);const j=(t,{label:e})=>{const o=t.target.closest(".reviewable-card");if(!o)return;u(e??null);const n=o.offsetTop+o.offsetHeight/2-b();v(n)},q=t=>{if(t.key==="Enter"||t.key===" "){const e=t.target.closest(".reviewable-card");if(!e)return;const o=e.id.replace("preview-","");l&&l(o)}};return r.length?c.jsxRuntimeExports.jsxs(d.ReviewablesSelector,{children:[c.jsxRuntimeExports.jsxs(d.Scrollable,{className:"reviewables",ref:R,containerRef:t=>{f.current=t},children:[r.map(({fileId:t,label:e,tag:o,selectionVariant:n,contextMenuItems:s})=>c.jsxRuntimeExports.jsx(h,{projectName:y,fileId:t,label:e,selected:a.includes(t),selectionVariant:n,tag:o,contextMenuItems:s,onChange:l,onKeyDown:q,onMouseOver:j})),!!w&&c.jsxRuntimeExports.jsx(d.AddButton,{icon:"add",onClick:w,onMouseEnter:()=>u(null)})]}),E&&g&&c.jsxRuntimeExports.jsx(d.Label,{style:{top:g},children:E})]}):c.jsxRuntimeExports.jsx("div",{})};module.exports=k;
 //# sourceMappingURL=ReviewablesSelector.cjs.js.map

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

@@ -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 clsx from 'clsx'\nimport { FileThumbnail } from '@shared/components'\nimport { ReviewableModel } from '@shared/api'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\n\ntype ReviewableCard = Pick<ReviewableModel, 'fileId' | 'label' | 'fileId'>\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<ReviewableCard, '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 }) => (\n          <Styled.ReviewableCard\n            key={fileId}\n            id={'preview-' + fileId}\n            onClick={() => onChange && onChange(fileId)}\n            className={clsx('reviewable-card', { selected: selected.includes(fileId) })}\n            onMouseOver={(e) => handleMouseOver(e, { label })}\n            onKeyDown={handleKeyDown}\n            tabIndex={0}\n          >\n            <FileThumbnail src={`/api/projects/${projectName}/files/${fileId}/thumbnail`} />\n          </Styled.ReviewableCard>\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","e","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","jsx","Styled.ReviewableCard","clsx","FileThumbnail","Styled.AddButton","Styled.Label"],"mappings":"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"}
+{"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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"}

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

@@ -1,363 +1,105 @@
-import { j as n } from "../../../../_virtual/jsx-runtime.es.js";
-import { useRef as R, useState as T, useEffect as E } from "react";
-import { ReviewablesSelector as L, Scrollable as A, ReviewableCard as I, AddButton as S, Label as M } from "./ReviewablesSelector.styled.es.js";
-import B from "clsx";
-import "../AddonLoadingScreen/AddonLoadingScreen.es.js";
-import "../../../../node_modules/match-sorter/dist/match-sorter.esm.es.js";
-import "@ynput/ayon-react-components";
-import "../AccessSearchInput/AccessSearchInput.styled.es.js";
-import "../AccessUser/AccessUser.es.js";
+import { j as c } from "../../../../_virtual/jsx-runtime.es.js";
+import { useRef as b, useState as E, useEffect as T } from "react";
+import { ReviewablesSelector as k, Scrollable as L, AddButton as A, Label as S } from "./ReviewablesSelector.styled.es.js";
 import "lodash";
-import "../AttributeEditor/components/MinMaxField.es.js";
-import "react-dom";
-import "@dnd-kit/core";
-import "@dnd-kit/sortable";
-import "../EnumEditor/EnumEditor.styled.es.js";
-import "../Badge/Badge.es.js";
-import "../Chips/Chips.es.js";
-import "date-fns";
-import "../DateRangePicker/DateRangePicker.styled.es.js";
-import "../LinksManager/CellEditingDialog.es.js";
 import "react-toastify";
-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/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/updateActivities.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/cloud/cloud.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/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/updateListsAttributes.es.js";
-import "../../api/queries/entityLists/listFolders.es.js";
-import "../../api/queries/folders/getFolders.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/links/getEntityLinks.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/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 "../../../../_virtual/index.es.js";
-import "../../../../node_modules/refractor/lib/common.es.js";
-import "../../../../node_modules/refractor/lib/all.es.js";
-/* empty css                                                                              */
 import "uuid";
-import N from "../../util/isHTMLElement.es.js";
+import M from "../../util/isHTMLElement.es.js";
 import "../../util/pubsub.es.js";
-import "../DetailsPanelAttributes/DetailsPanelAttributesEditor.es.js";
-import "../DetailsPanelDetails/DetailsPanelDetails.es.js";
-import "../DetailsPanelDetails/DetailsSection.es.js";
-import "../DetailsPanelDetails/FieldLabel.es.js";
-import "../DoneCheckbox/DoneCheckbox.es.js";
-import "../EarlyPreview/EarlyPreview.es.js";
-import "../EmptyPlaceholder/EmptyPlaceholder.es.js";
-import "../EmptyPlaceholder/EmptyPlaceholderFlex.styled.es.js";
-import "../../containers/ContextMenu/ContextMenuContext.es.js";
-/* empty css                                               */
-import "../../containers/Feed/context/FeedContext.es.js";
-import "../../containers/Feed/components/Tooltips/UserTooltipItem.es.js";
-import "../../containers/Feed/components/Tooltips/UserTooltip/UserTooltip.styled.es.js";
-import "../../containers/Feed/components/Tooltips/TeamTooltip/TeamTooltip.styled.es.js";
-import "../../containers/Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.es.js";
-import "../../context/RemoteModulesContext.es.js";
-import "../../context/DetailsPanelContext.es.js";
-import "../../context/SubtasksModulesContext.es.js";
-import "../../context/ThumbnailUploaderContext.es.js";
-import "../../context/SettingsPanelContext.es.js";
-import "../../context/pip/PiPProvider.es.js";
-import "../../context/pip/PiPWrapper.es.js";
-import "../../context/AddonProjectContext.es.js";
-import "../../context/AddonContext.es.js";
-import "../../context/PowerpackContext.es.js";
-import "../../context/MoveEntityContext.es.js";
-import "../../context/MenuContext.es.js";
-import "../../context/WebsocketContext.es.js";
-import "../../context/GlobalContext.es.js";
-import "../../context/ProjectContext.es.js";
-import "../../context/ProjectFoldersContext.es.js";
-import "../../context/UriContext.es.js";
-import "../../containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.es.js";
-import "../../containers/Feed/components/FileUploadPreview/Mimes/TextMime.es.js";
-import "react-markdown";
-import "remark-emoji";
-import "remark-gfm";
-import "remark-directive";
-import "remark-directive-rehype";
-import "../../containers/Feed/components/CommentInput/CommentInput.es.js";
-import "../../containers/Feed/components/ReactionContainer/Reactions.styled.es.js";
-import "../../containers/Feed/components/FilesGrid/FilesGrid.styled.es.js";
-import "../../containers/Feed/components/FileUploadCard/FileUploadCard.styled.es.js";
-import "../../containers/Feed/components/CommentInput/quillToMarkdown.es.js";
-import "../../containers/Feed/components/ActivityComment/ActivityComment.styled.es.js";
-import "../../containers/Feed/components/ActivityCheckbox/ActivityCheckbox.styled.es.js";
-import "../../containers/Feed/components/ActivityReference/ActivityReference.styled.es.js";
-import "react-router-dom";
-import "../../containers/Feed/components/ActivityStatus/ActivityStatus.es.js";
-import "../../containers/Feed/components/ActivityHeader/ActivityHeader.styled.es.js";
-import "../../containers/Feed/components/ActivityDate.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/CategoryTag.es.js";
-import "rehype-raw";
-import "../../containers/Feed/components/ActivityStatusChange/ActivityStatusChange.styled.es.js";
-import "../../containers/Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.es.js";
-import "../../containers/Feed/components/ActivityVersions/ActivityVersions.styled.es.js";
-import "../../containers/Feed/components/ActivityGroup/ActivityGroup.styled.es.js";
-import "../../containers/Feed/Feed.styled.es.js";
-import "../../containers/DetailsPanel/components/TabHeaderAndFilters/TabHeaderAndFilters.styled.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.es.js";
-import "@tanstack/react-virtual";
-import "@tanstack/react-table";
-import "../../containers/ProjectTreeTable/widgets/CollapsedWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/DateWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EnumWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EnumCellValue.es.js";
-import "../../containers/ProjectTreeTable/widgets/TextWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/BooleanWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/CellWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EntityNameWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/ThumbnailWidget.es.js";
-import "../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.es.js";
-import "../../containers/ProjectTreeTable/context/SelectedRowsContext.es.js";
-import "../LinksManager/LinksManager.styled.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectTableContext.es.js";
-import "../../containers/ProjectTreeTable/widgets/EmptyWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/ErrorWidget.es.js";
-import "../../containers/ProjectTreeTable/context/CellEditingContext.es.js";
-import "../SearchFilter/filterDates.es.js";
-import "short-uuid";
-import "../../containers/ProjectTreeTable/context/SelectionCellsContext.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.es.js";
-import "../../containers/ProjectTreeTable/context/ClipboardContext.es.js";
-import "../../containers/ProjectTreeTable/context/ColumnSettingsContext.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectDataContext.es.js";
-import "../../../../_virtual/runtime.es.js";
-import "../../../../_virtual/semver.es.js";
-import "react-redux";
-import "custom-protocol-check";
-import "../../containers/ProjectTreeTable/components/GroupSettingsFallback.es.js";
-import "../../containers/ProjectTreeTable/ProjectTreeTable.styled.es.js";
-import "../../containers/ProjectTreeTable/components/SelectionCell.es.js";
-import "../../containers/ProjectTreeTable/components/RowSelectionHeader.es.js";
-import "../../containers/ProjectTreeTable/widgets/LoadMoreWidget.es.js";
-import "../../containers/ProjectTreeTable/components/HeaderActionButton.es.js";
-import "../../containers/ProjectTreeTable/components/ColumnHeaderMenu.es.js";
-import "../../containers/EntityPickerDialog/EntityPickerDialog.es.js";
-import "../../containers/Slicer/components/Slicer.es.js";
-import "../../containers/Slicer/context/SlicerContext.es.js";
-import "../../containers/Slicer/hooks/useTableDataBySlice.es.js";
-import "../../containers/DetailsPanel/DetailsPanel.styled.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelTabs/DetailsPanelTabs.styled.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelHeader/DetailsPanelHeader.styled.es.js";
-import "../PlayableIcon/PlayableIcon.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelFiles/DetailsPanelFiles.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelFloating/DetailsPanelFloating.styled.es.js";
-import "../../containers/Actions/Actions.styled.es.js";
-import "../../containers/Actions/ActionsDropdown/ActionsDropdown.es.js";
-import "../../containers/Actions/ActionIcon.es.js";
-import "../../containers/Views/context/ViewsContext.es.js";
-import "../../containers/Views/Views.styled.es.js";
-import "../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
-import "../../containers/Views/ViewsMenu/ViewsMenu.es.js";
-import "../EntityPanelUploader/EntityPanelUploader.styled.es.js";
-import "axios";
-import "../ReviewablesList/ReviewablesList.styled.es.js";
-import "../ReviewablesList/ReviewablesUpload.styled.es.js";
-import "../EntityPath/EntityPath.styled.es.js";
-import "../EntityPath/SegmentProvider.es.js";
-import "../FeaturedVersionOrder/FeaturedVersionOrder.es.js";
-import "../Feedback/FeedbackContext.es.js";
-import "../Feedback/SupportBubble.es.js";
-import { FileThumbnail as D } from "../FileThumbnail/FileThumbnail.es.js";
-import "../LegacyBadge/LegacyBadge.es.js";
-import "../Powerpack/PowerpackButton.es.js";
-import "../Powerpack/PricingLink.es.js";
-import "../Powerpack/PowerpackDialog.styled.es.js";
-import "../Powerpack/CTAButton.es.js";
-import "../Powerpack/RequiredAddonVersion.es.js";
-import "../ProjectTableSettings/ProjectTableSettings.es.js";
-import "../SizeSlider/SizeSlider.es.js";
-import "../ReviewableCard/ReviewableCard.es.js";
-import "../ReviewableProgressCard/ReviewableProgressCard.styled.es.js";
-import "../SettingsPanel/SettingsPanel.es.js";
-import "../SettingsPanel/SettingsPanelItemTemplate.es.js";
-import "../ShareOptionIcon/ShareOptionIcon.es.js";
-import "../SimpleFormDialog/SimpleFormDialog.es.js";
-import "../StyledLink/StyledLink.es.js";
-import "../TableGridSwitch/TableGridSwitch.es.js";
-import "../Thumbnail/Thumbnail.styled.es.js";
-import "../Thumbnail/StackedThumbnails.es.js";
-import "../ThumbnailSimple/ThumbnailSimple.es.js";
-import "../VersionUploader/components/UploadVersionDialog.es.js";
-import "../VersionUploader/context/VersionUploadContext.es.js";
-import "../Watchers/Watchers.es.js";
-import "../Menu/Menu.styled.es.js";
-import "../Menu/MenuItem.es.js";
-const Fm = ({
-  reviewables: m = [],
-  selected: s = [],
+import B from "./Card.es.js";
+const q = ({
+  reviewables: l = [],
+  selected: u = [],
   projectName: y,
-  onChange: p,
-  onUpload: f
+  onChange: s,
+  onUpload: p
 }) => {
-  const w = R(null), c = R(null), [b, l] = T(null), [v, x] = T(null), g = () => c.current?.scrollTop || 0, h = (t) => {
-    const o = c.current, r = document.getElementById("preview-" + t);
-    if (!o || !r) return;
-    const i = o.getBoundingClientRect(), e = r.getBoundingClientRect();
-    e.top < i.top ? o.scrollTop -= i.top - e.top : e.bottom > i.bottom && (o.scrollTop += e.bottom - i.bottom), w.current?.updateScroll?.();
+  const w = b(null), d = b(null), [g, i] = E(null), [v, x] = E(null), R = () => d.current?.scrollTop || 0, I = (t) => {
+    const e = d.current, o = document.getElementById("preview-" + t);
+    if (!e || !o) return;
+    const n = e.getBoundingClientRect(), r = o.getBoundingClientRect();
+    r.top < n.top ? e.scrollTop -= n.top - r.top : r.bottom > n.bottom && (e.scrollTop += r.bottom - n.bottom), w.current?.updateScroll?.();
   };
-  E(() => {
-    if (m.length === 1) return;
-    const t = (o) => {
-      if (["w", "s", "ArrowUp", "ArrowDown"].includes(o.key)) {
-        if (N(o.target) && (o.target.tagName === "INPUT" || o.target.tagName === "TEXTAREA" || o.target.isContentEditable))
+  T(() => {
+    if (l.length === 1) return;
+    const t = (e) => {
+      if (["w", "s", "ArrowUp", "ArrowDown"].includes(e.key)) {
+        if (M(e.target) && (e.target.tagName === "INPUT" || e.target.tagName === "TEXTAREA" || e.target.isContentEditable))
           return;
-        const r = m.findIndex(({ fileId: d }) => s.includes(d)), i = o.key === "w" || o.key === "ArrowUp" ? r - 1 : r + 1, e = m[i < 0 ? m.length - 1 : i % m.length], a = e.fileId;
-        p && p(a), requestAnimationFrame(() => h(a)), l(e.label ?? null);
-        const u = document.getElementById("preview-" + a);
-        if (u) {
-          const d = u.offsetTop + u.offsetHeight / 2 - g();
-          x(d);
+        const o = l.findIndex(({ fileId: m }) => u.includes(m)), n = e.key === "w" || e.key === "ArrowUp" ? o - 1 : o + 1, r = l[n < 0 ? l.length - 1 : n % l.length], a = r.fileId;
+        s && s(a), requestAnimationFrame(() => I(a)), i(r.label ?? null);
+        const f = document.getElementById("preview-" + a);
+        if (f) {
+          const m = f.offsetTop + f.offsetHeight / 2 - R();
+          x(m);
         }
       }
     };
     return window.addEventListener("keydown", t), () => {
       window.removeEventListener("keydown", t);
     };
-  }, [s, m, p]), E(() => {
-    const t = (o) => {
-      o.target.closest(".reviewables") || l(null);
+  }, [u, l, s]), T(() => {
+    const t = (e) => {
+      e.target.closest(".reviewables") || i(null);
     };
     return window.addEventListener("mousemove", t), () => {
       window.removeEventListener("mousemove", t);
     };
   }, []);
-  const j = (t, { label: o }) => {
-    const r = t.target.closest(".reviewable-card");
-    if (!r) return;
-    l(o ?? null);
-    const i = r.offsetTop + r.offsetHeight / 2 - g();
-    x(i);
-  }, k = (t) => {
+  const h = (t, { label: e }) => {
+    const o = t.target.closest(".reviewable-card");
+    if (!o) return;
+    i(e ?? null);
+    const n = o.offsetTop + o.offsetHeight / 2 - R();
+    x(n);
+  }, j = (t) => {
     if (t.key === "Enter" || t.key === " ") {
-      const o = t.target.closest(".reviewable-card");
-      if (!o) return;
-      const r = o.id.replace("preview-", "");
-      p && p(r);
+      const e = t.target.closest(".reviewable-card");
+      if (!e) return;
+      const o = e.id.replace("preview-", "");
+      s && s(o);
     }
   };
-  return m.length ? /* @__PURE__ */ n.jsxs(L, { children: [
-    /* @__PURE__ */ n.jsxs(
-      A,
+  return l.length ? /* @__PURE__ */ c.jsxs(k, { children: [
+    /* @__PURE__ */ c.jsxs(
+      L,
       {
         className: "reviewables",
         ref: w,
         containerRef: (t) => {
-          c.current = t;
+          d.current = t;
         },
         children: [
-          m.map(({ fileId: t, label: o }) => /* @__PURE__ */ n.jsx(
-            I,
+          l.map(({ fileId: t, label: e, tag: o, selectionVariant: n, contextMenuItems: r }) => /* @__PURE__ */ c.jsx(
+            B,
             {
-              id: "preview-" + t,
-              onClick: () => p && p(t),
-              className: B("reviewable-card", { selected: s.includes(t) }),
-              onMouseOver: (r) => j(r, { label: o }),
-              onKeyDown: k,
-              tabIndex: 0,
-              children: /* @__PURE__ */ n.jsx(D, { src: `/api/projects/${y}/files/${t}/thumbnail` })
-            },
-            t
+              projectName: y,
+              fileId: t,
+              label: e,
+              selected: u.includes(t),
+              selectionVariant: n,
+              tag: o,
+              contextMenuItems: r,
+              onChange: s,
+              onKeyDown: j,
+              onMouseOver: h
+            }
           )),
-          !!f && /* @__PURE__ */ n.jsx(
-            S,
+          !!p && /* @__PURE__ */ c.jsx(
+            A,
             {
               icon: "add",
-              onClick: f,
-              onMouseEnter: () => l(null)
+              onClick: p,
+              onMouseEnter: () => i(null)
             }
           )
         ]
       }
     ),
-    b && v && /* @__PURE__ */ n.jsx(M, { style: { top: v }, children: b })
-  ] }) : /* @__PURE__ */ n.jsx("div", {});
+    g && v && /* @__PURE__ */ c.jsx(S, { style: { top: v }, children: g })
+  ] }) : /* @__PURE__ */ c.jsx("div", {});
 };
 export {
-  Fm as default
+  q as default
 };
 //# sourceMappingURL=ReviewablesSelector.es.js.map

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

@@ -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 clsx from 'clsx'\nimport { FileThumbnail } from '@shared/components'\nimport { ReviewableModel } from '@shared/api'\nimport { isHTMLElement } from '@shared/util'\nimport ScrollBar from 'react-perfect-scrollbar'\n\ntype ReviewableCard = Pick<ReviewableModel, 'fileId' | 'label' | 'fileId'>\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<ReviewableCard, '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 }) => (\n          <Styled.ReviewableCard\n            key={fileId}\n            id={'preview-' + fileId}\n            onClick={() => onChange && onChange(fileId)}\n            className={clsx('reviewable-card', { selected: selected.includes(fileId) })}\n            onMouseOver={(e) => handleMouseOver(e, { label })}\n            onKeyDown={handleKeyDown}\n            tabIndex={0}\n          >\n            <FileThumbnail src={`/api/projects/${projectName}/files/${fileId}/thumbnail`} />\n          </Styled.ReviewableCard>\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","e","isHTMLElement","currentIndex","nextIndex","nextReviewable","nextFileId","top","handleMouseMove","event","handleMouseOver","label","closest","jsxs","Styled.ReviewablesSelector","Styled.Scrollable","ref","jsx","Styled.ReviewableCard","clsx","FileThumbnail","Styled.AddButton","Styled.Label"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAkBA,MAAMA,KAAoD,CAAC;AAAA,EACzD,aAAAC,IAAc,CAAA;AAAA,EACd,UAAAC,IAAW,CAAA;AAAA,EACX,aAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AACJ,QAAMC,IAAYC,EAAkB,IAAI,GAClCC,IAAqBD,EAA2B,IAAI,GACpD,CAACE,GAAcC,CAAe,IAAIC,EAAwB,IAAI,GAC9D,CAACC,GAAkBC,CAAmB,IAAIF,EAAwB,IAAI,GAEtEG,IAAe,MACZN,EAAmB,SAAS,aAAa,GAG5CO,IAA2B,CAACC,MAAmB;AACnD,UAAMC,IAAYT,EAAmB,SAC/BU,IAAK,SAAS,eAAe,aAAaF,CAAM;AACtD,QAAI,CAACC,KAAa,CAACC,EAAI;AAEvB,UAAMC,IAAgBF,EAAU,sBAAA,GAC1BG,IAAWF,EAAG,sBAAA;AAEpB,IAAIE,EAAS,MAAMD,EAAc,MAC/BF,EAAU,aAAaE,EAAc,MAAMC,EAAS,MAC3CA,EAAS,SAASD,EAAc,WACzCF,EAAU,aAAaG,EAAS,SAASD,EAAc,SAKzDb,EAAU,SAAS,eAAA;AAAA,EACrB;AAKA,EAAAe,EAAU,MAAM;AACd,QAAIpB,EAAY,WAAW,EAAG;AAE9B,UAAMqB,IAAgB,CAACC,MAAqB;AAC1C,UAAI,CAAC,KAAK,KAAK,WAAW,WAAW,EAAE,SAASA,EAAE,GAAG,GAAG;AAEtD,YAAIC,EAAcD,EAAE,MAAM,MACpBA,EAAE,OAAO,YAAY,WAAWA,EAAE,OAAO,YAAY,cACrDA,EAAE,OAAO;AAAmB;AAGlC,cAAME,IAAexB,EAAY,UAAU,CAAC,EAAE,QAAAe,QAAad,EAAS,SAASc,CAAM,CAAC,GAC9EU,IAAYH,EAAE,QAAQ,OAAOA,EAAE,QAAQ,YAAYE,IAAe,IAAIA,IAAe,GACrFE,IACJ1B,EAAYyB,IAAY,IAAIzB,EAAY,SAAS,IAAIyB,IAAYzB,EAAY,MAAM,GAC/E2B,IAAaD,EAAe;AAElC,QAAAvB,KAAYA,EAASwB,CAAU,GAC/B,sBAAsB,MAAMb,EAAyBa,CAAU,CAAC,GAEhElB,EAAgBiB,EAAe,SAAS,IAAI;AAE5C,cAAMT,IAAK,SAAS,eAAe,aAAaU,CAAU;AAE1D,YAAIV,GAAI;AACN,gBAAMW,IAAMX,EAAG,YAAYA,EAAG,eAAe,IAAIJ,EAAA;AACjD,UAAAD,EAAoBgB,CAAG;AAAA,QACzB;AAAA,MACF;AAAA,IACF;AAEA,kBAAO,iBAAiB,WAAWP,CAAa,GAEzC,MAAM;AACX,aAAO,oBAAoB,WAAWA,CAAa;AAAA,IACrD;AAAA,EACF,GAAG,CAACpB,GAAUD,GAAaG,CAAQ,CAAC,GAGpCiB,EAAU,MAAM;AACd,UAAMS,IAAkB,CAACC,MAAsB;AAG7C,MADiBA,EAAM,OAAuB,QAAQ,cAAc,KAElErB,EAAgB,IAAI;AAAA,IAExB;AAEA,kBAAO,iBAAiB,aAAaoB,CAAe,GAE7C,MAAM;AACX,aAAO,oBAAoB,aAAaA,CAAe;AAAA,IACzD;AAAA,EACF,GAAG,CAAA,CAAE;AAEL,QAAME,IAAkB,CACtBD,GACA,EAAE,OAAAE,QACC;AAEH,UAAMC,IAAWH,EAAM,OAAuB,QAAQ,kBAAkB;AACxE,QAAI,CAACG,EAAS;AACd,IAAAxB,EAAgBuB,KAAS,IAAI;AAE7B,UAAMJ,IAAMK,EAAQ,YAAYA,EAAQ,eAAe,IAAIpB,EAAA;AAC3D,IAAAD,EAAoBgB,CAAG;AAAA,EACzB,GAGMP,IAAgB,CAACS,MAA+C;AACpE,QAAIA,EAAM,QAAQ,WAAWA,EAAM,QAAQ,KAAK;AAC9C,YAAMG,IAAWH,EAAM,OAAuB,QAAQ,kBAAkB;AACxE,UAAI,CAACG,EAAS;AACd,YAAMlB,IAASkB,EAAQ,GAAG,QAAQ,YAAY,EAAE;AAChD,MAAA9B,KAAYA,EAASY,CAAM;AAAA,IAC7B;AAAA,EACF;AAGA,SAAKf,EAAY,SAGfkC,gBAAAA,EAAAA,KAACC,GAAA,EACC,UAAA;AAAA,IAAAD,gBAAAA,EAAAA;AAAAA,MAACE;AAAAA,MAAA;AAAA,QACC,WAAU;AAAA,QACV,KAAK/B;AAAA,QACL,cAAc,CAACgC,MAAQ;AACrB,UAAA9B,EAAmB,UAAU8B;AAAA,QAC/B;AAAA,QAEC,UAAA;AAAA,UAAArC,EAAY,IAAI,CAAC,EAAE,QAAAe,GAAQ,OAAAiB,QAC1BM,gBAAAA,EAAAA;AAAAA,YAACC;AAAAA,YAAA;AAAA,cAEC,IAAI,aAAaxB;AAAA,cACjB,SAAS,MAAMZ,KAAYA,EAASY,CAAM;AAAA,cAC1C,WAAWyB,EAAK,mBAAmB,EAAE,UAAUvC,EAAS,SAASc,CAAM,GAAG;AAAA,cAC1E,aAAa,CAACO,MAAMS,EAAgBT,GAAG,EAAE,OAAAU,GAAO;AAAA,cAChD,WAAWX;AAAA,cACX,UAAU;AAAA,cAEV,gCAACoB,GAAA,EAAc,KAAK,iBAAiBvC,CAAW,UAAUa,CAAM,aAAA,CAAc;AAAA,YAAA;AAAA,YARzEA;AAAA,UAAA,CAUR;AAAA,UACA,CAAC,CAACX,KACDkC,gBAAAA,EAAAA;AAAAA,YAACI;AAAAA,YAAA;AAAA,cACC,MAAK;AAAA,cACL,SAAStC;AAAA,cACT,cAAc,MAAMK,EAAgB,IAAI;AAAA,YAAA;AAAA,UAAA;AAAA,QAC1C;AAAA,MAAA;AAAA,IAAA;AAAA,IAGHD,KAAgBG,KACf2B,gBAAAA,MAACK,GAAA,EAAa,OAAO,EAAE,KAAKhC,EAAA,GAAqB,UAAAH,EAAA,CAAa;AAAA,EAAA,GAElE,0BAnC+B,OAAA,CAAA,CAAI;AAqCvC;"}
+{"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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"}