@ynput/ayon-frontend-shared 0.4.1 → 0.4.3

package/dist/shared/src/components/EntityPath/SegmentProvider.es.js

@@ -2,318 +2,23 @@ import { j as f } from "../../../../_virtual/jsx-runtime.es.js";
 import { forwardRef as x } from "react";
 import { ActiveSegment as C } from "./EntityPath.styled.es.js";
 import { classNames as y } from "../../../node_modules/primereact/utils/utils.esm.es.js";
-import "../../containers/ContextMenu/ContextMenuContext.es.js";
-import "@ynput/ayon-react-components";
-/* empty css                                               */
-import "clsx";
 import { useCreateContextMenu as j } from "../../containers/ContextMenu/useCreateContextMenu.es.js";
 import "lodash";
 import "react-toastify";
 import { copyToClipboard as b } from "../../util/copyToClipboard.es.js";
 import "uuid";
-import "../../api/base/client.es.js";
-import "../../api/generated/graphql.es.js";
-import "../../api/generated/graphqlLinks.es.js";
-import "../../api/generated/access.es.js";
-import "../../api/generated/actions.es.js";
-import "../../api/generated/activityFeed.es.js";
-import "../../api/generated/addons.es.js";
-import "../../api/generated/anatomy.es.js";
-import "../../api/generated/attributes.es.js";
-import "../../api/generated/authentication.es.js";
-import "../../api/generated/bundles.es.js";
-import "../../api/generated/configuration.es.js";
-import "../../api/generated/dataImport.es.js";
-import "../../api/generated/desktop.es.js";
-import "../../api/generated/entityLists.es.js";
-import "../../api/generated/events.es.js";
-import "../../api/generated/files.es.js";
-import "../../api/generated/folders.es.js";
-import "../../api/generated/inbox.es.js";
-import "../../api/generated/links.es.js";
-import "../../api/generated/market.es.js";
-import "../../api/generated/onboarding.es.js";
-import "../../api/generated/operations.es.js";
-import "../../api/generated/products.es.js";
-import "../../api/generated/projectDashboard.es.js";
-import "../../api/generated/projects.es.js";
-import "../../api/generated/projectFolders.es.js";
-import "../../api/generated/reviewables.es.js";
-import "../../api/generated/services.es.js";
-import "../../api/generated/system.es.js";
-import "../../api/generated/tasks.es.js";
-import "../../api/generated/teams.es.js";
-import "../../api/generated/thumbnails.es.js";
-import "../../api/generated/uRIs.es.js";
-import "../../api/generated/users.es.js";
-import "../../api/generated/versions.es.js";
-import "../../api/generated/workfiles.es.js";
-import "../../api/generated/ynputCloud.es.js";
-import "../../api/generated/grouping.es.js";
-import "../../api/generated/views.es.js";
-import "../../api/queries/actions/getActions.es.js";
-import "../../api/queries/activities/getActivities.es.js";
-import "../../api/queries/activities/updateReaction.es.js";
-import "../../api/queries/activities/getMentions.es.js";
-import "../../api/queries/activities/getCategories.es.js";
-import "../../api/queries/addons/getAddons.es.js";
-import "../../api/queries/addons/updateAddons.es.js";
-import "../../api/queries/attributes/getAttributes.es.js";
-import "../../api/queries/attributes/updateAttributes.es.js";
-import "../../api/queries/authentication/getAuthentication.es.js";
-import "../../api/queries/bundles/getBundles.es.js";
-import "../../api/queries/bundles/updateBundles.es.js";
-import "../../api/queries/cloud/cloud.es.js";
-import "../../api/queries/columnStats/metricTargets.es.js";
-import "../../api/queries/columnStats/groupCounts.es.js";
-import "../../api/queries/config/getConfig.es.js";
-import "../../api/queries/config/updateConfig.es.js";
-import "../../api/queries/entities/getEntity.es.js";
-import "../../api/queries/entities/getEntityPanel.es.js";
-import "../../api/queries/overview/getOverview.es.js";
-import "../../api/queries/overview/updateOverview.es.js";
-import "../../api/queries/versions/getVersionsProducts.es.js";
-import "../../api/queries/links/getEntityLinks.es.js";
-import "../../api/queries/entities/updateEntity.es.js";
-import "../../api/queries/entityLists/getLists.es.js";
-import "../../api/queries/entityLists/updateLists.es.js";
-import "../../api/queries/entityLists/getListsAttributes.es.js";
-import "../../api/queries/entityLists/listItemsColumnStats.es.js";
-import "../../api/queries/entityLists/updateListsAttributes.es.js";
-import "../../api/queries/entityLists/listFolders.es.js";
-import "../../api/queries/folders/getFolders.es.js";
-import "../../api/queries/folders/getFolderDeleteInfo.es.js";
-import "../../api/queries/grouping/getGrouping.es.js";
-import "../../api/queries/links/updateLinks.es.js";
-import "../../api/queries/links/getLinks.es.js";
-import "../../api/queries/permissions/getPermissions.es.js";
-import "../../api/queries/products/createProduct.es.js";
-import "../../api/queries/products/getFolderProducts.es.js";
-import "../../api/queries/project/getProject.es.js";
-import "../../api/queries/project/updateProject.es.js";
-import "../../api/queries/projectFolders/projectFolders.es.js";
-import "../../api/queries/review/getReview.es.js";
-import "../../api/queries/review/updateReview.es.js";
-import "../../api/queries/share/share.es.js";
-import "../../api/queries/system/getSystem.es.js";
-import "../../api/queries/tasks/getTasks.es.js";
-import "../../api/queries/tasks/updateTasks.es.js";
-import "../../api/queries/teams/getTeams.es.js";
-import "../../api/queries/userDashboard/getUserDashboard.es.js";
-import "../../api/queries/users/getUsers.es.js";
 import "../../api/queries/users/updateUsers.es.js";
-import "../../api/queries/users/guests.es.js";
-import "../../api/queries/versions/updateVersions.es.js";
-import "../../api/queries/views/getViews.es.js";
-import "../../api/queries/views/updateViews.es.js";
-import "../../api/queries/watchers/getWatchers.es.js";
-import "../../api/queries/uris/getUris.es.js";
 import "../../util/pubsub.es.js";
-import "../../context/RemoteModulesContext.es.js";
 import { useDetailsPanelContext as k } from "../../context/DetailsPanelContext.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 "../../context/PowerpackContextInstance.es.js";
-import "../../context/SubtasksModulesContextInstance.es.js";
-import "../../context/ThumbnailUploaderContext.es.js";
-import "../../context/SettingsPanelContext.es.js";
-import "../../context/pip/PiPProvider.es.js";
-import "react-dom";
-import "../../context/pip/PiPWrapper.es.js";
-import "../../context/AddonProjectContext.es.js";
-import "../../context/AddonContext.es.js";
-import "../../context/MenuContext.es.js";
-import "../../context/WebsocketContext.es.js";
-import "../../context/GlobalContext.es.js";
-import "../../context/ProjectContext.es.js";
-import "../../context/ProjectFoldersContextInstance.es.js";
-import "../../context/EntityUpdatesContextInstance.es.js";
-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 "../../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 "../AddonLoadingScreen/AddonLoadingScreen.es.js";
-import "../../../../node_modules/match-sorter/dist/match-sorter.esm.es.js";
-import "../AccessSearchInput/AccessSearchInput.styled.es.js";
-import "../AccessUser/AccessUser.es.js";
-import "../AttributeEditor/AttributeEditor.es.js";
-import "../AttributeEditor/attributeTypeMap.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 "../DeleteEntitiesConfirm/DeleteConfirmContent.es.js";
-import "../DeleteEntitiesConfirm/DeleteEntitiesConfirmDialog.styled.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 "../DetailsPanelAttributes/DetailsPanelAttributesEditor.es.js";
-import "../DetailsPanelDetails/DetailsPanelDetails.es.js";
-import "react-quill-ayon";
-import "../DetailsPanelDetails/BorderedSection.es.js";
-import "../QuillListStyles/QuillListStyles.es.js";
-import "../DetailsPanelDetails/DescriptionSection.styles.es.js";
-import "rehype-raw";
-import "../DetailsPanelDetails/hooks/useMentionSystem.es.js";
-import "../../containers/Feed/components/CommentInput/modules/index.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 "../InfoMessage/InfoMessage.es.js";
-import "@dnd-kit/core";
-import "@dnd-kit/sortable";
-import "../EnumEditor/EnumEditor.styled.es.js";
-import "../EntityPanelUploader/EntityPanelUploader.styled.es.js";
-import "axios";
-import "../ReviewablesList/ReviewablesList.styled.es.js";
-import "../ReviewablesList/ReviewablesUpload.styled.es.js";
-import "../FeaturedVersionOrder/FeaturedVersionOrder.es.js";
-import "../Feedback/FeedbackContextInstance.es.js";
-import "../Feedback/SupportBubble.es.js";
-import "../FileThumbnail/FileThumbnail.es.js";
-import "../LegacyBadge/LegacyBadge.es.js";
-import "../LinksManager/LinksManager.styled.es.js";
-import "../../containers/EntityPickerDialog/EntityPickerDialog.es.js";
-import "../Powerpack/PowerpackButton.es.js";
-import "../Powerpack/FreeTrialLink.es.js";
-import "../Powerpack/PowerpackDialog.styled.es.js";
-import "../Powerpack/CTAButton.es.js";
-import "../Powerpack/RequiredAddonVersion.es.js";
-import "../ProjectTableSettings/ProjectTableSettings.es.js";
-import "../ProjectTableSettings/ColumnsSettings.es.js";
-import "../SizeSlider/SizeSlider.es.js";
-import "react-router-dom";
-import "../../containers/Slicer/components/Slicer.es.js";
-import "../../containers/Slicer/context/SlicerContextInstance.es.js";
-import "../../containers/Slicer/components/SlicerDropdownFallback.es.js";
-import "../../containers/NewEntity/components/NewEntity.es.js";
-import "@tanstack/react-virtual";
-import "@tanstack/react-table";
-import "../../containers/ProjectTreeTable/buildTreeTableColumns.es.js";
-import "../../containers/ProjectTreeTable/ProjectTreeTable.styled.es.js";
-import "../../containers/ProjectTreeTable/components/HeaderActionButton.es.js";
-import "../../containers/ProjectTreeTable/components/RowSelectionHeader.es.js";
-import "../../containers/ProjectTreeTable/components/SelectionCell.es.js";
-import "../../containers/ProjectTreeTable/context/CellEditingContext.es.js";
-import "../SearchFilter/filterDates.es.js";
-import "short-uuid";
-import "../../containers/ProjectTreeTable/utils/columnIds.es.js";
-import "../../containers/ProjectTreeTable/context/SelectionCellsContext.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.es.js";
-import "../../containers/ProjectTreeTable/context/ColumnSettingsContext.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectTableContextInstance.es.js";
-import "../../containers/ProjectTreeTable/context/ClipboardContext.es.js";
-import "../../containers/ProjectTreeTable/context/SelectedRowsContext.es.js";
-import "../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.es.js";
-import "../../containers/ProjectTreeTable/context/ProjectDataContextInstance.es.js";
-import "../../containers/ProjectTreeTable/components/TableFooterRow.es.js";
-import "../../containers/ProjectTreeTable/widgets/CellWidget.es.js";
-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/MarkdownWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/BooleanWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EntityNameWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EntityWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/ThumbnailWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/LinksWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/EmptyWidget.es.js";
-import "../../containers/ProjectTreeTable/widgets/ErrorWidget.es.js";
-import "../../containers/NewEntity/context/NewEntityContextInstance.es.js";
-import "../../containers/NewEntity/components/NewEntityForm.es.js";
-import "../../containers/Slicer/hooks/useTableDataBySlice.es.js";
-import "../ReviewableCard/ReviewableCard.es.js";
-import "../ReviewableProgressCard/ReviewableProgressCard.styled.es.js";
-import "../SearchFilter/CustomDateRangeDialog.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 "../SyncButton/SyncButton.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/VersionUploadContextInstance.es.js";
-import "../Watchers/Watchers.es.js";
-import "../Menu/Menu.styled.es.js";
-import "../Menu/MenuItem.es.js";
-import "../ReviewablesSelector/ReviewablesSelector.es.js";
-import "../ColumnHeaderMenuUI.es.js";
-import "../../containers/Feed/components/ActivityReference/ActivityReference.styled.es.js";
-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/ActivityVersionReview/ActivityVersionReview.styled.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.es.js";
-import "../../containers/Feed/components/ActivityCategorySelect/CategoryTag.es.js";
-import "../../containers/Feed/components/ActivityFieldChange/ActivityFieldChange.styled.es.js";
-import "../../containers/Feed/components/ActivityFieldChange/FieldValue.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/Feed/components/FeedSearchFilter.es.js";
-import "../../containers/DetailsPanel/DetailsPanel.styled.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelTabs/DetailsPanelTabs.styled.es.js";
-import "../../containers/DetailsPanel/components/DetailsPanelHeader/LinkedTaskRow.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/DetailsPanelMoreMenu/components/ShareDialog.es.js";
-import "../../containers/DetailsPanel/components/TabHeaderAndFilters/TabHeaderAndFilters.styled.es.js";
-import "../../containers/DetailsPanel/components/SubtasksSearchFilter/SubtasksSearchFilter.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/ViewsMenu/ViewsMenu.es.js";
-import "../../containers/Views/context/ViewsContextInstance.es.js";
-import "../../containers/Views/Views.styled.es.js";
-import "../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.es.js";
-import "../../containers/ListTable/ListTableRow.es.js";
-import "../../containers/ListTable/ListTable.styled.es.js";
-import "../../context/UriContext.es.js";
-import "../../context/DeleteEntitiesContext.es.js";
-const em = x(
-  ({ children: p, segment: o, isOpen: m, scope: M, projectName: e, ...n }, c) => {
-    const { openSlideOut: s } = k(), i = o?.type !== "product" && o?.type !== "project", a = () => {
-      if (!i) return;
-      const { type: t, id: r } = o || {};
-      !t || t === "project" || t === "product" || !r || s({
+const E = x(
+  ({ children: r, segment: o, isOpen: i, scope: M, projectName: p, ...c }, m) => {
+    const { openSlideOut: s } = k(), n = o?.type !== "product" && o?.type !== "project", a = () => {
+      if (!n) return;
+      const { type: t, id: e } = o || {};
+      !t || t === "project" || t === "product" || !e || s({
         entityType: t,
-        entityId: r,
-        projectName: e
+        entityId: e,
+        projectName: p
       });
     }, u = (t) => [
       {
@@ -323,23 +28,23 @@ const em = x(
       }
     ], [l] = j(), d = (t) => {
       if (!o) return;
-      const r = u(o.id);
-      l(t, r);
+      const e = u(o.id);
+      l(t, e);
     };
     return /* @__PURE__ */ f.jsx(
       C,
       {
         onClick: a,
         onContextMenu: d,
-        className: y({ link: i, open: m }),
-        ...n,
-        ref: c,
-        children: p
+        className: y({ link: n, open: i }),
+        ...c,
+        ref: m,
+        children: r
       }
     );
   }
 );
 export {
-  em as default
+  E as default
 };
 //# sourceMappingURL=SegmentProvider.es.js.map

package/dist/shared/src/components/EntityPath/SegmentProvider.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"SegmentProvider.es.js","sources":["../../../../../src/components/EntityPath/SegmentProvider.tsx"],"sourcesContent":["import { forwardRef, MouseEvent } from 'react'\nimport { ActiveSegment } from './EntityPath.styled'\nimport { classNames } from 'primereact/utils'\nimport { PathSegment } from './EntityPath'\nimport { useCreateContextMenu } from '@shared/containers/ContextMenu'\nimport { copyToClipboard } from '@shared/util'\nimport { useDetailsPanelContext } from '@shared/context'\n\ninterface SegmentProviderProps extends React.HTMLAttributes<HTMLDivElement> {\n  segment?: PathSegment\n  isOpen?: boolean\n  scope: string\n  projectName: string\n}\n\nconst SegmentProvider = forwardRef<HTMLDivElement, SegmentProviderProps>(\n  ({ children, segment, isOpen, scope, projectName, ...props }, ref) => {\n    const { openSlideOut } = useDetailsPanelContext()\n    // is the segment NOT a product || project?\n    const isLinkable = segment?.type !== 'product' && segment?.type !== 'project'\n\n    const handleClick = () => {\n      if (!isLinkable) return\n\n      const { type: entityType, id: entityId } = segment || {}\n\n      if (!entityType || entityType === 'project' || entityType === 'product' || !entityId) return\n\n      openSlideOut({\n        entityType,\n        entityId,\n        projectName,\n      })\n    }\n\n    const buildContextMenu = (id: string) => [\n      {\n        label: `ID: ${id}`,\n        icon: 'content_copy',\n        command: () => copyToClipboard(id),\n      },\n    ]\n\n    const [contextMenuShow] = useCreateContextMenu()\n\n    const handleOnContext = (e: MouseEvent<HTMLDivElement>) => {\n      if (!segment) return\n      const menu = buildContextMenu(segment.id)\n\n      contextMenuShow(e, menu)\n    }\n\n    return (\n      <ActiveSegment\n        onClick={handleClick}\n        onContextMenu={handleOnContext}\n        className={classNames({ link: isLinkable, open: isOpen })}\n        {...props}\n        ref={ref}\n      >\n        {children}\n      </ActiveSegment>\n    )\n  },\n)\n\nexport default SegmentProvider\n"],"names":["SegmentProvider","forwardRef","children","segment","isOpen","scope","projectName","props","ref","openSlideOut","useDetailsPanelContext","isLinkable","handleClick","entityType","entityId","buildContextMenu","id","copyToClipboard","contextMenuShow","useCreateContextMenu","handleOnContext","e","menu","jsx","ActiveSegment","classNames"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAeA,MAAMA,KAAkBC;AAAA,EACtB,CAAC,EAAE,UAAAC,GAAU,SAAAC,GAAS,QAAAC,GAAQ,OAAAC,GAAO,aAAAC,GAAa,GAAGC,EAAA,GAASC,MAAQ;AACpE,UAAM,EAAE,cAAAC,EAAA,IAAiBC,EAAA,GAEnBC,IAAaR,GAAS,SAAS,aAAaA,GAAS,SAAS,WAE9DS,IAAc,MAAM;AACxB,UAAI,CAACD,EAAY;AAEjB,YAAM,EAAE,MAAME,GAAY,IAAIC,EAAA,IAAaX,KAAW,CAAA;AAEtD,MAAI,CAACU,KAAcA,MAAe,aAAaA,MAAe,aAAa,CAACC,KAE5EL,EAAa;AAAA,QACX,YAAAI;AAAA,QACA,UAAAC;AAAA,QACA,aAAAR;AAAA,MAAA,CACD;AAAA,IACH,GAEMS,IAAmB,CAACC,MAAe;AAAA,MACvC;AAAA,QACE,OAAO,OAAOA,CAAE;AAAA,QAChB,MAAM;AAAA,QACN,SAAS,MAAMC,EAAgBD,CAAE;AAAA,MAAA;AAAA,IACnC,GAGI,CAACE,CAAe,IAAIC,EAAA,GAEpBC,IAAkB,CAACC,MAAkC;AACzD,UAAI,CAAClB,EAAS;AACd,YAAMmB,IAAOP,EAAiBZ,EAAQ,EAAE;AAExC,MAAAe,EAAgBG,GAAGC,CAAI;AAAA,IACzB;AAEA,WACEC,gBAAAA,EAAAA;AAAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASZ;AAAA,QACT,eAAeQ;AAAA,QACf,WAAWK,EAAW,EAAE,MAAMd,GAAY,MAAMP,GAAQ;AAAA,QACvD,GAAGG;AAAA,QACJ,KAAAC;AAAA,QAEC,UAAAN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}
+{"version":3,"file":"SegmentProvider.es.js","sources":["../../../../../src/components/EntityPath/SegmentProvider.tsx"],"sourcesContent":["import { forwardRef, MouseEvent } from 'react'\nimport { ActiveSegment } from './EntityPath.styled'\nimport { classNames } from 'primereact/utils'\nimport { PathSegment } from './EntityPath'\nimport { useCreateContextMenu } from '@shared/containers/ContextMenu/useCreateContextMenu'\nimport { copyToClipboard } from '@shared/util'\nimport { useDetailsPanelContext } from '@shared/context/DetailsPanelContext'\n\ninterface SegmentProviderProps extends React.HTMLAttributes<HTMLDivElement> {\n  segment?: PathSegment\n  isOpen?: boolean\n  scope: string\n  projectName: string\n}\n\nconst SegmentProvider = forwardRef<HTMLDivElement, SegmentProviderProps>(\n  ({ children, segment, isOpen, scope, projectName, ...props }, ref) => {\n    const { openSlideOut } = useDetailsPanelContext()\n    // is the segment NOT a product || project?\n    const isLinkable = segment?.type !== 'product' && segment?.type !== 'project'\n\n    const handleClick = () => {\n      if (!isLinkable) return\n\n      const { type: entityType, id: entityId } = segment || {}\n\n      if (!entityType || entityType === 'project' || entityType === 'product' || !entityId) return\n\n      openSlideOut({\n        entityType,\n        entityId,\n        projectName,\n      })\n    }\n\n    const buildContextMenu = (id: string) => [\n      {\n        label: `ID: ${id}`,\n        icon: 'content_copy',\n        command: () => copyToClipboard(id),\n      },\n    ]\n\n    const [contextMenuShow] = useCreateContextMenu()\n\n    const handleOnContext = (e: MouseEvent<HTMLDivElement>) => {\n      if (!segment) return\n      const menu = buildContextMenu(segment.id)\n\n      contextMenuShow(e, menu)\n    }\n\n    return (\n      <ActiveSegment\n        onClick={handleClick}\n        onContextMenu={handleOnContext}\n        className={classNames({ link: isLinkable, open: isOpen })}\n        {...props}\n        ref={ref}\n      >\n        {children}\n      </ActiveSegment>\n    )\n  },\n)\n\nexport default SegmentProvider\n"],"names":["SegmentProvider","forwardRef","children","segment","isOpen","scope","projectName","props","ref","openSlideOut","useDetailsPanelContext","isLinkable","handleClick","entityType","entityId","buildContextMenu","id","copyToClipboard","contextMenuShow","useCreateContextMenu","handleOnContext","e","menu","jsx","ActiveSegment","classNames"],"mappings":";;;;;;;;;;;;AAeA,MAAMA,IAAkBC;AAAA,EACtB,CAAC,EAAE,UAAAC,GAAU,SAAAC,GAAS,QAAAC,GAAQ,OAAAC,GAAO,aAAAC,GAAa,GAAGC,EAAA,GAASC,MAAQ;AACpE,UAAM,EAAE,cAAAC,EAAA,IAAiBC,EAAA,GAEnBC,IAAaR,GAAS,SAAS,aAAaA,GAAS,SAAS,WAE9DS,IAAc,MAAM;AACxB,UAAI,CAACD,EAAY;AAEjB,YAAM,EAAE,MAAME,GAAY,IAAIC,EAAA,IAAaX,KAAW,CAAA;AAEtD,MAAI,CAACU,KAAcA,MAAe,aAAaA,MAAe,aAAa,CAACC,KAE5EL,EAAa;AAAA,QACX,YAAAI;AAAA,QACA,UAAAC;AAAA,QACA,aAAAR;AAAA,MAAA,CACD;AAAA,IACH,GAEMS,IAAmB,CAACC,MAAe;AAAA,MACvC;AAAA,QACE,OAAO,OAAOA,CAAE;AAAA,QAChB,MAAM;AAAA,QACN,SAAS,MAAMC,EAAgBD,CAAE;AAAA,MAAA;AAAA,IACnC,GAGI,CAACE,CAAe,IAAIC,EAAA,GAEpBC,IAAkB,CAACC,MAAkC;AACzD,UAAI,CAAClB,EAAS;AACd,YAAMmB,IAAOP,EAAiBZ,EAAQ,EAAE;AAExC,MAAAe,EAAgBG,GAAGC,CAAI;AAAA,IACzB;AAEA,WACEC,gBAAAA,EAAAA;AAAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASZ;AAAA,QACT,eAAeQ;AAAA,QACf,WAAWK,EAAW,EAAE,MAAMd,GAAY,MAAMP,GAAQ;AAAA,QACvD,GAAGG;AAAA,QACJ,KAAAC;AAAA,QAEC,UAAAN;AAAA,MAAA;AAAA,IAAA;AAAA,EAGP;AACF;"}

package/dist/shared/src/components/EnumEditor/DraggableEnumEditorItem.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableEnumEditorItem.cjs.js","sources":["../../../../../src/components/EnumEditor/DraggableEnumEditorItem.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { CSS } from '@dnd-kit/utilities'\n\nimport { Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport { AttributeData } from './EnumEditor'\nimport EnumEditorItem, { EnumEditorItemProps } from './EnumEditorItem'\nimport React from 'react'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\nexport interface DraggableEnumEditorItemPt {\n  wrapper?: DivPt\n  header?: DivPt\n  item?: EnumEditorItemProps\n}\n\nexport interface DraggableEnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  isBeingDragged?: boolean\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n  item,\n  isBeingDragged,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  pt,\n  ...props\n}: DraggableEnumEditorItemProps) => {\n  const { id, label, icon, color, isExpanded } = item\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({\n    id: id,\n    animateLayoutChanges: () => false,\n  })\n\n  const style = {\n    transition,\n    transform: CSS.Translate.toString(transform),\n  }\n\n  return (\n    <Styled.EnumItemWrapper\n      ref={setNodeRef}\n      style={style}\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(props.className, pt?.wrapper?.className, { dragged: isBeingDragged })}\n    >\n      <Styled.EnumItemHeader\n        {...pt?.header}\n        onClick={() => {\n          onChange && onChange(['isExpanded'], [!isExpanded])\n        }}\n        className={clsx(pt?.header?.className, { expanded: isExpanded })}\n      >\n        {color && <Styled.LabelColor style={{ backgroundColor: color }} />}\n        {icon && <Icon className=\"icon\" icon={icon} />}\n        <span> {label} </span>\n        <span className=\"spacer\" />\n\n        <Icon className=\"icon toggle-expand\" icon={isExpanded ? 'collapse_all' : 'expand_all'} />\n        <Icon\n          {...listeners}\n          {...attributes}\n          className=\"icon draggable\"\n          icon=\"drag_indicator\"\n          id=\"icon\"\n        />\n      </Styled.EnumItemHeader>\n\n      <Styled.EnumItemBodyExpander className={clsx({ expanded: isExpanded })}>\n        <EnumEditorItem\n          item={item}\n          onChange={onChange}\n          onCommit={onCommit}\n          onRemove={onRemove}\n          onDuplicate={onDuplicate}\n          showRemoveButton={true}\n          showDuplicateButton={true}\n          autoFocus={false}\n          isExpanded={isExpanded}\n          {...pt?.item}\n        />\n      </Styled.EnumItemBodyExpander>\n    </Styled.EnumItemWrapper>\n  )\n}\n\nexport default DraggableEnumEditorItem\n"],"names":["DraggableEnumEditorItem","item","isBeingDragged","onChange","onCommit","onRemove","onDuplicate","pt","props","id","label","icon","color","isExpanded","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","jsxs","Styled.EnumItemWrapper","clsx","Styled.EnumItemHeader","jsx","Styled.LabelColor","Icon","Styled.EnumItemBodyExpander","EnumEditorItem"],"mappings":"mUA8BMA,EAA0B,CAAC,CAC/B,KAAAC,EACA,eAAAC,EACA,SAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,GAAAC,EACA,GAAGC,CACL,IAAoC,CAClC,KAAM,CAAE,GAAAC,EAAI,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,WAAAC,GAAeZ,EAEzC,CAAE,WAAAa,EAAY,UAAAC,EAAW,WAAAC,EAAY,UAAAC,EAAW,WAAAC,CAAA,EAAeC,cAAY,CAC/E,GAAAV,EACA,qBAAsB,IAAM,EAAA,CAC7B,EAEKW,EAAQ,CACZ,WAAAF,EACA,UAAWG,EAAAA,IAAI,UAAU,SAASJ,CAAS,CAAA,EAG7C,OACEK,EAAAA,kBAAAA,KAACC,EAAAA,gBAAA,CACC,IAAKP,EACL,MAAAI,EACC,GAAGb,GAAI,QACP,GAAGC,EACJ,UAAWgB,EAAKhB,EAAM,UAAWD,GAAI,SAAS,UAAW,CAAE,QAASL,EAAgB,EAEpF,SAAA,CAAAoB,EAAAA,kBAAAA,KAACG,EAAAA,eAAA,CACE,GAAGlB,GAAI,OACR,QAAS,IAAM,CACbJ,GAAYA,EAAS,CAAC,YAAY,EAAG,CAAC,CAACU,CAAU,CAAC,CACpD,EACA,UAAWW,EAAKjB,GAAI,QAAQ,UAAW,CAAE,SAAUM,EAAY,EAE9D,SAAA,CAAAD,GAASc,EAAAA,kBAAAA,IAACC,aAAA,CAAkB,MAAO,CAAE,gBAAiBf,GAAS,EAC/DD,GAAQe,EAAAA,kBAAAA,IAACE,EAAAA,KAAA,CAAK,UAAU,OAAO,KAAAjB,EAAY,2BAC3C,OAAA,CAAK,SAAA,CAAA,IAAED,EAAM,GAAA,EAAC,EACfgB,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,QAAA,CAAS,0BAExBE,EAAAA,KAAA,CAAK,UAAU,qBAAqB,KAAMf,EAAa,eAAiB,aAAc,EACvFa,EAAAA,kBAAAA,IAACE,EAAAA,KAAA,CACE,GAAGb,EACH,GAAGD,EACJ,UAAU,iBACV,KAAK,iBACL,GAAG,MAAA,CAAA,CACL,CAAA,CAAA,EAGFY,wBAACG,EAAAA,qBAAA,CAA4B,UAAWL,EAAK,CAAE,SAAUX,CAAA,CAAY,EACnE,SAAAa,EAAAA,kBAAAA,IAACI,EAAA,CACC,KAAA7B,EACA,SAAAE,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,iBAAkB,GAClB,oBAAqB,GACrB,UAAW,GACX,WAAAO,EACC,GAAGN,GAAI,IAAA,CAAA,CACV,CACF,CAAA,CAAA,CAAA,CAGN"}
+{"version":3,"file":"DraggableEnumEditorItem.cjs.js","sources":["../../../../../src/components/EnumEditor/DraggableEnumEditorItem.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { CSS } from '@dnd-kit/utilities'\n\nimport { Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport type { AttributeData } from './EnumEditor'\nimport EnumEditorItem, { EnumEditorItemProps } from './EnumEditorItem'\nimport React from 'react'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\nexport interface DraggableEnumEditorItemPt {\n  wrapper?: DivPt\n  header?: DivPt\n  item?: EnumEditorItemProps\n}\n\nexport interface DraggableEnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  isBeingDragged?: boolean\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n  item,\n  isBeingDragged,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  pt,\n  ...props\n}: DraggableEnumEditorItemProps) => {\n  const { id, label, icon, color, isExpanded } = item\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({\n    id: id,\n    animateLayoutChanges: () => false,\n  })\n\n  const style = {\n    transition,\n    transform: CSS.Translate.toString(transform),\n  }\n\n  return (\n    <Styled.EnumItemWrapper\n      ref={setNodeRef}\n      style={style}\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(props.className, pt?.wrapper?.className, { dragged: isBeingDragged })}\n    >\n      <Styled.EnumItemHeader\n        {...pt?.header}\n        onClick={() => {\n          onChange && onChange(['isExpanded'], [!isExpanded])\n        }}\n        className={clsx(pt?.header?.className, { expanded: isExpanded })}\n      >\n        {color && <Styled.LabelColor style={{ backgroundColor: color }} />}\n        {icon && <Icon className=\"icon\" icon={icon} />}\n        <span> {label} </span>\n        <span className=\"spacer\" />\n\n        <Icon className=\"icon toggle-expand\" icon={isExpanded ? 'collapse_all' : 'expand_all'} />\n        <Icon\n          {...listeners}\n          {...attributes}\n          className=\"icon draggable\"\n          icon=\"drag_indicator\"\n          id=\"icon\"\n        />\n      </Styled.EnumItemHeader>\n\n      <Styled.EnumItemBodyExpander className={clsx({ expanded: isExpanded })}>\n        <EnumEditorItem\n          item={item}\n          onChange={onChange}\n          onCommit={onCommit}\n          onRemove={onRemove}\n          onDuplicate={onDuplicate}\n          showRemoveButton={true}\n          showDuplicateButton={true}\n          autoFocus={false}\n          isExpanded={isExpanded}\n          {...pt?.item}\n        />\n      </Styled.EnumItemBodyExpander>\n    </Styled.EnumItemWrapper>\n  )\n}\n\nexport default DraggableEnumEditorItem\n"],"names":["DraggableEnumEditorItem","item","isBeingDragged","onChange","onCommit","onRemove","onDuplicate","pt","props","id","label","icon","color","isExpanded","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","jsxs","Styled.EnumItemWrapper","clsx","Styled.EnumItemHeader","jsx","Styled.LabelColor","Icon","Styled.EnumItemBodyExpander","EnumEditorItem"],"mappings":"mUA8BMA,EAA0B,CAAC,CAC/B,KAAAC,EACA,eAAAC,EACA,SAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,GAAAC,EACA,GAAGC,CACL,IAAoC,CAClC,KAAM,CAAE,GAAAC,EAAI,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,WAAAC,GAAeZ,EAEzC,CAAE,WAAAa,EAAY,UAAAC,EAAW,WAAAC,EAAY,UAAAC,EAAW,WAAAC,CAAA,EAAeC,cAAY,CAC/E,GAAAV,EACA,qBAAsB,IAAM,EAAA,CAC7B,EAEKW,EAAQ,CACZ,WAAAF,EACA,UAAWG,EAAAA,IAAI,UAAU,SAASJ,CAAS,CAAA,EAG7C,OACEK,EAAAA,kBAAAA,KAACC,EAAAA,gBAAA,CACC,IAAKP,EACL,MAAAI,EACC,GAAGb,GAAI,QACP,GAAGC,EACJ,UAAWgB,EAAKhB,EAAM,UAAWD,GAAI,SAAS,UAAW,CAAE,QAASL,EAAgB,EAEpF,SAAA,CAAAoB,EAAAA,kBAAAA,KAACG,EAAAA,eAAA,CACE,GAAGlB,GAAI,OACR,QAAS,IAAM,CACbJ,GAAYA,EAAS,CAAC,YAAY,EAAG,CAAC,CAACU,CAAU,CAAC,CACpD,EACA,UAAWW,EAAKjB,GAAI,QAAQ,UAAW,CAAE,SAAUM,EAAY,EAE9D,SAAA,CAAAD,GAASc,EAAAA,kBAAAA,IAACC,aAAA,CAAkB,MAAO,CAAE,gBAAiBf,GAAS,EAC/DD,GAAQe,EAAAA,kBAAAA,IAACE,EAAAA,KAAA,CAAK,UAAU,OAAO,KAAAjB,EAAY,2BAC3C,OAAA,CAAK,SAAA,CAAA,IAAED,EAAM,GAAA,EAAC,EACfgB,EAAAA,kBAAAA,IAAC,OAAA,CAAK,UAAU,QAAA,CAAS,0BAExBE,EAAAA,KAAA,CAAK,UAAU,qBAAqB,KAAMf,EAAa,eAAiB,aAAc,EACvFa,EAAAA,kBAAAA,IAACE,EAAAA,KAAA,CACE,GAAGb,EACH,GAAGD,EACJ,UAAU,iBACV,KAAK,iBACL,GAAG,MAAA,CAAA,CACL,CAAA,CAAA,EAGFY,wBAACG,EAAAA,qBAAA,CAA4B,UAAWL,EAAK,CAAE,SAAUX,CAAA,CAAY,EACnE,SAAAa,EAAAA,kBAAAA,IAACI,EAAA,CACC,KAAA7B,EACA,SAAAE,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,iBAAkB,GAClB,oBAAqB,GACrB,UAAW,GACX,WAAAO,EACC,GAAGN,GAAI,IAAA,CAAA,CACV,CACF,CAAA,CAAA,CAAA,CAGN"}

package/dist/shared/src/components/EnumEditor/DraggableEnumEditorItem.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"DraggableEnumEditorItem.es.js","sources":["../../../../../src/components/EnumEditor/DraggableEnumEditorItem.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { CSS } from '@dnd-kit/utilities'\n\nimport { Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport { AttributeData } from './EnumEditor'\nimport EnumEditorItem, { EnumEditorItemProps } from './EnumEditorItem'\nimport React from 'react'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\nexport interface DraggableEnumEditorItemPt {\n  wrapper?: DivPt\n  header?: DivPt\n  item?: EnumEditorItemProps\n}\n\nexport interface DraggableEnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  isBeingDragged?: boolean\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n  item,\n  isBeingDragged,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  pt,\n  ...props\n}: DraggableEnumEditorItemProps) => {\n  const { id, label, icon, color, isExpanded } = item\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({\n    id: id,\n    animateLayoutChanges: () => false,\n  })\n\n  const style = {\n    transition,\n    transform: CSS.Translate.toString(transform),\n  }\n\n  return (\n    <Styled.EnumItemWrapper\n      ref={setNodeRef}\n      style={style}\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(props.className, pt?.wrapper?.className, { dragged: isBeingDragged })}\n    >\n      <Styled.EnumItemHeader\n        {...pt?.header}\n        onClick={() => {\n          onChange && onChange(['isExpanded'], [!isExpanded])\n        }}\n        className={clsx(pt?.header?.className, { expanded: isExpanded })}\n      >\n        {color && <Styled.LabelColor style={{ backgroundColor: color }} />}\n        {icon && <Icon className=\"icon\" icon={icon} />}\n        <span> {label} </span>\n        <span className=\"spacer\" />\n\n        <Icon className=\"icon toggle-expand\" icon={isExpanded ? 'collapse_all' : 'expand_all'} />\n        <Icon\n          {...listeners}\n          {...attributes}\n          className=\"icon draggable\"\n          icon=\"drag_indicator\"\n          id=\"icon\"\n        />\n      </Styled.EnumItemHeader>\n\n      <Styled.EnumItemBodyExpander className={clsx({ expanded: isExpanded })}>\n        <EnumEditorItem\n          item={item}\n          onChange={onChange}\n          onCommit={onCommit}\n          onRemove={onRemove}\n          onDuplicate={onDuplicate}\n          showRemoveButton={true}\n          showDuplicateButton={true}\n          autoFocus={false}\n          isExpanded={isExpanded}\n          {...pt?.item}\n        />\n      </Styled.EnumItemBodyExpander>\n    </Styled.EnumItemWrapper>\n  )\n}\n\nexport default DraggableEnumEditorItem\n"],"names":["DraggableEnumEditorItem","item","isBeingDragged","onChange","onCommit","onRemove","onDuplicate","pt","props","id","label","icon","color","isExpanded","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","jsxs","Styled.EnumItemWrapper","clsx","Styled.EnumItemHeader","jsx","Styled.LabelColor","Icon","Styled.EnumItemBodyExpander","EnumEditorItem"],"mappings":";;;;;;;AA8BA,MAAMA,IAA0B,CAAC;AAAA,EAC/B,MAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,IAAAC;AAAA,EACA,GAAGC;AACL,MAAoC;AAClC,QAAM,EAAE,IAAAC,GAAI,OAAAC,GAAO,MAAAC,GAAM,OAAAC,GAAO,YAAAC,MAAeZ,GAEzC,EAAE,YAAAa,GAAY,WAAAC,GAAW,YAAAC,GAAY,WAAAC,GAAW,YAAAC,EAAA,IAAeC,EAAY;AAAA,IAC/E,IAAAV;AAAA,IACA,sBAAsB,MAAM;AAAA,EAAA,CAC7B,GAEKW,IAAQ;AAAA,IACZ,YAAAF;AAAA,IACA,WAAWG,EAAI,UAAU,SAASJ,CAAS;AAAA,EAAA;AAG7C,SACEK,gBAAAA,EAAAA;AAAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAKP;AAAA,MACL,OAAAI;AAAA,MACC,GAAGb,GAAI;AAAA,MACP,GAAGC;AAAA,MACJ,WAAWgB,EAAKhB,EAAM,WAAWD,GAAI,SAAS,WAAW,EAAE,SAASL,GAAgB;AAAA,MAEpF,UAAA;AAAA,QAAAoB,gBAAAA,EAAAA;AAAAA,UAACG;AAAAA,UAAA;AAAA,YACE,GAAGlB,GAAI;AAAA,YACR,SAAS,MAAM;AACb,cAAAJ,KAAYA,EAAS,CAAC,YAAY,GAAG,CAAC,CAACU,CAAU,CAAC;AAAA,YACpD;AAAA,YACA,WAAWW,EAAKjB,GAAI,QAAQ,WAAW,EAAE,UAAUM,GAAY;AAAA,YAE9D,UAAA;AAAA,cAAAD,KAASc,gBAAAA,EAAAA,IAACC,GAAA,EAAkB,OAAO,EAAE,iBAAiBf,KAAS;AAAA,cAC/DD,KAAQe,gBAAAA,EAAAA,IAACE,GAAA,EAAK,WAAU,QAAO,MAAAjB,GAAY;AAAA,qCAC3C,QAAA,EAAK,UAAA;AAAA,gBAAA;AAAA,gBAAED;AAAA,gBAAM;AAAA,cAAA,GAAC;AAAA,cACfgB,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAU,SAAA,CAAS;AAAA,oCAExBE,GAAA,EAAK,WAAU,sBAAqB,MAAMf,IAAa,iBAAiB,cAAc;AAAA,cACvFa,gBAAAA,EAAAA;AAAAA,gBAACE;AAAA,gBAAA;AAAA,kBACE,GAAGb;AAAA,kBACH,GAAGD;AAAA,kBACJ,WAAU;AAAA,kBACV,MAAK;AAAA,kBACL,IAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,YACL;AAAA,UAAA;AAAA,QAAA;AAAA,QAGFY,gBAAAA,MAACG,GAAA,EAA4B,WAAWL,EAAK,EAAE,UAAUX,EAAA,CAAY,GACnE,UAAAa,gBAAAA,EAAAA;AAAAA,UAACI;AAAA,UAAA;AAAA,YACC,MAAA7B;AAAA,YACA,UAAAE;AAAA,YACA,UAAAC;AAAA,YACA,UAAAC;AAAA,YACA,aAAAC;AAAA,YACA,kBAAkB;AAAA,YAClB,qBAAqB;AAAA,YACrB,WAAW;AAAA,YACX,YAAAO;AAAA,YACC,GAAGN,GAAI;AAAA,UAAA;AAAA,QAAA,EACV,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"DraggableEnumEditorItem.es.js","sources":["../../../../../src/components/EnumEditor/DraggableEnumEditorItem.tsx"],"sourcesContent":["import clsx from 'clsx'\nimport { useSortable } from '@dnd-kit/sortable'\nimport { CSS } from '@dnd-kit/utilities'\n\nimport { Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport type { AttributeData } from './EnumEditor'\nimport EnumEditorItem, { EnumEditorItemProps } from './EnumEditorItem'\nimport React from 'react'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\nexport interface DraggableEnumEditorItemPt {\n  wrapper?: DivPt\n  header?: DivPt\n  item?: EnumEditorItemProps\n}\n\nexport interface DraggableEnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  isBeingDragged?: boolean\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n  item,\n  isBeingDragged,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  pt,\n  ...props\n}: DraggableEnumEditorItemProps) => {\n  const { id, label, icon, color, isExpanded } = item\n\n  const { attributes, listeners, setNodeRef, transform, transition } = useSortable({\n    id: id,\n    animateLayoutChanges: () => false,\n  })\n\n  const style = {\n    transition,\n    transform: CSS.Translate.toString(transform),\n  }\n\n  return (\n    <Styled.EnumItemWrapper\n      ref={setNodeRef}\n      style={style}\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(props.className, pt?.wrapper?.className, { dragged: isBeingDragged })}\n    >\n      <Styled.EnumItemHeader\n        {...pt?.header}\n        onClick={() => {\n          onChange && onChange(['isExpanded'], [!isExpanded])\n        }}\n        className={clsx(pt?.header?.className, { expanded: isExpanded })}\n      >\n        {color && <Styled.LabelColor style={{ backgroundColor: color }} />}\n        {icon && <Icon className=\"icon\" icon={icon} />}\n        <span> {label} </span>\n        <span className=\"spacer\" />\n\n        <Icon className=\"icon toggle-expand\" icon={isExpanded ? 'collapse_all' : 'expand_all'} />\n        <Icon\n          {...listeners}\n          {...attributes}\n          className=\"icon draggable\"\n          icon=\"drag_indicator\"\n          id=\"icon\"\n        />\n      </Styled.EnumItemHeader>\n\n      <Styled.EnumItemBodyExpander className={clsx({ expanded: isExpanded })}>\n        <EnumEditorItem\n          item={item}\n          onChange={onChange}\n          onCommit={onCommit}\n          onRemove={onRemove}\n          onDuplicate={onDuplicate}\n          showRemoveButton={true}\n          showDuplicateButton={true}\n          autoFocus={false}\n          isExpanded={isExpanded}\n          {...pt?.item}\n        />\n      </Styled.EnumItemBodyExpander>\n    </Styled.EnumItemWrapper>\n  )\n}\n\nexport default DraggableEnumEditorItem\n"],"names":["DraggableEnumEditorItem","item","isBeingDragged","onChange","onCommit","onRemove","onDuplicate","pt","props","id","label","icon","color","isExpanded","attributes","listeners","setNodeRef","transform","transition","useSortable","style","CSS","jsxs","Styled.EnumItemWrapper","clsx","Styled.EnumItemHeader","jsx","Styled.LabelColor","Icon","Styled.EnumItemBodyExpander","EnumEditorItem"],"mappings":";;;;;;;AA8BA,MAAMA,IAA0B,CAAC;AAAA,EAC/B,MAAAC;AAAA,EACA,gBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AAAA,EACA,aAAAC;AAAA,EACA,IAAAC;AAAA,EACA,GAAGC;AACL,MAAoC;AAClC,QAAM,EAAE,IAAAC,GAAI,OAAAC,GAAO,MAAAC,GAAM,OAAAC,GAAO,YAAAC,MAAeZ,GAEzC,EAAE,YAAAa,GAAY,WAAAC,GAAW,YAAAC,GAAY,WAAAC,GAAW,YAAAC,EAAA,IAAeC,EAAY;AAAA,IAC/E,IAAAV;AAAA,IACA,sBAAsB,MAAM;AAAA,EAAA,CAC7B,GAEKW,IAAQ;AAAA,IACZ,YAAAF;AAAA,IACA,WAAWG,EAAI,UAAU,SAASJ,CAAS;AAAA,EAAA;AAG7C,SACEK,gBAAAA,EAAAA;AAAAA,IAACC;AAAAA,IAAA;AAAA,MACC,KAAKP;AAAA,MACL,OAAAI;AAAA,MACC,GAAGb,GAAI;AAAA,MACP,GAAGC;AAAA,MACJ,WAAWgB,EAAKhB,EAAM,WAAWD,GAAI,SAAS,WAAW,EAAE,SAASL,GAAgB;AAAA,MAEpF,UAAA;AAAA,QAAAoB,gBAAAA,EAAAA;AAAAA,UAACG;AAAAA,UAAA;AAAA,YACE,GAAGlB,GAAI;AAAA,YACR,SAAS,MAAM;AACb,cAAAJ,KAAYA,EAAS,CAAC,YAAY,GAAG,CAAC,CAACU,CAAU,CAAC;AAAA,YACpD;AAAA,YACA,WAAWW,EAAKjB,GAAI,QAAQ,WAAW,EAAE,UAAUM,GAAY;AAAA,YAE9D,UAAA;AAAA,cAAAD,KAASc,gBAAAA,EAAAA,IAACC,GAAA,EAAkB,OAAO,EAAE,iBAAiBf,KAAS;AAAA,cAC/DD,KAAQe,gBAAAA,EAAAA,IAACE,GAAA,EAAK,WAAU,QAAO,MAAAjB,GAAY;AAAA,qCAC3C,QAAA,EAAK,UAAA;AAAA,gBAAA;AAAA,gBAAED;AAAA,gBAAM;AAAA,cAAA,GAAC;AAAA,cACfgB,gBAAAA,EAAAA,IAAC,QAAA,EAAK,WAAU,SAAA,CAAS;AAAA,oCAExBE,GAAA,EAAK,WAAU,sBAAqB,MAAMf,IAAa,iBAAiB,cAAc;AAAA,cACvFa,gBAAAA,EAAAA;AAAAA,gBAACE;AAAA,gBAAA;AAAA,kBACE,GAAGb;AAAA,kBACH,GAAGD;AAAA,kBACJ,WAAU;AAAA,kBACV,MAAK;AAAA,kBACL,IAAG;AAAA,gBAAA;AAAA,cAAA;AAAA,YACL;AAAA,UAAA;AAAA,QAAA;AAAA,QAGFY,gBAAAA,MAACG,GAAA,EAA4B,WAAWL,EAAK,EAAE,UAAUX,EAAA,CAAY,GACnE,UAAAa,gBAAAA,EAAAA;AAAAA,UAACI;AAAA,UAAA;AAAA,YACC,MAAA7B;AAAA,YACA,UAAAE;AAAA,YACA,UAAAC;AAAA,YACA,UAAAC;AAAA,YACA,aAAAC;AAAA,YACA,kBAAkB;AAAA,YAClB,qBAAqB;AAAA,YACrB,WAAW;AAAA,YACX,YAAAO;AAAA,YACC,GAAGN,GAAI;AAAA,UAAA;AAAA,QAAA,EACV,CACF;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/dist/shared/src/components/EnumEditor/EnumEditorItem.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumEditorItem.cjs.js","sources":["../../../../../src/components/EnumEditor/EnumEditorItem.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { kebabCase } from 'lodash'\n\nimport { DropdownRef, Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport { AttributeData } from './EnumEditor'\nimport clsx from 'clsx'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\ntype TextInputPt = Partial<React.ComponentProps<typeof Styled.InputText>>\ntype IconInputPt = Partial<React.ComponentProps<typeof Styled.IconSelect>>\ntype ColorInputPt = Partial<React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface EnumEditorFieldPt<TInput> {\n  wrapper?: DivPt\n  label?: DivPt\n  input?: Partial<TInput>\n}\n\nexport interface EnumEditorItemPt {\n  wrapper?: DivPt\n  label?: EnumEditorFieldPt<TextInputPt>\n  value?: EnumEditorFieldPt<TextInputPt>\n  icon?: EnumEditorFieldPt<IconInputPt>\n  color?: EnumEditorFieldPt<ColorInputPt>\n  footer?: DivPt\n}\n\nexport interface EnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  showRemoveButton?: boolean\n  showDuplicateButton?: boolean\n  autoFocus?: boolean\n  isExpanded?: boolean\n  pt?: EnumEditorItemPt\n}\n\nconst EnumEditorItem = ({\n  item,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  showRemoveButton = true,\n  showDuplicateButton = true,\n  autoFocus = false,\n  isExpanded = true,\n  className,\n  pt,\n  ...props\n}: EnumEditorItemProps) => {\n  const { label, value, icon, color, isNewAttribute } = item\n  const labelRef = useRef<HTMLInputElement>(null)\n  const valueRef = useRef<HTMLInputElement>(null)\n  const colorPickerRef = useRef<HTMLInputElement>(null)\n  const iconSelectRef = useRef<DropdownRef>(null)\n\n  useEffect(() => {\n    if (autoFocus || item.isNewAttribute) {\n      labelRef.current?.select()\n    }\n  }, [autoFocus, item.isNewAttribute])\n\n  // Handle focus when item becomes expanded\n  useEffect(() => {\n    if (isExpanded && !autoFocus && !item.isNewAttribute) {\n      // Avoids jittery expand animation\n      setTimeout(() => labelRef.current?.focus(), 250)\n    }\n  }, [isExpanded, autoFocus, item.isNewAttribute])\n\n  return (\n    <Styled.EnumItemBody\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(className, pt?.wrapper?.className, {\n        expanded: isExpanded,\n        collapsed: !isExpanded,\n      })}\n    >\n      <Styled.Row key=\"label\" {...pt?.label?.wrapper}>\n        <Styled.Label {...pt?.label?.label}>Label</Styled.Label>\n        <Styled.InputText\n          ref={labelRef}\n          value={label}\n          autoFocus={autoFocus || isNewAttribute}\n          {...pt?.label?.input}\n          className={clsx(pt?.label?.input?.className)}\n          onChange={(event) => {\n            if (!isNewAttribute) {\n              return onChange && onChange(['label'], [event.target.value])\n            }\n            if (valueRef.current) {\n              valueRef.current.value = kebabCase(event.target.value)\n            }\n            onChange &&\n              onChange(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n          }}\n          onBlur={(event) => {\n            if (!isNewAttribute) {\n              onCommit && onCommit(['label'], [event.target.value])\n            } else {\n              onCommit &&\n                onCommit(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n            }\n          }}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              if (!isNewAttribute) {\n                onCommit && onCommit(['label'], [(event.target as HTMLInputElement).value])\n              } else {\n                onCommit &&\n                  onCommit(\n                    ['label', 'value'],\n                    [\n                      (event.target as HTMLInputElement).value,\n                      kebabCase((event.target as HTMLInputElement).value),\n                    ],\n                  )\n              }\n            }\n          }}\n          placeholder=\"Enter label\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"value\" {...pt?.value?.wrapper}>\n        <Styled.Label {...pt?.value?.label}>Value</Styled.Label>\n        <Styled.InputText\n          ref={valueRef}\n          value={valueRef.current?.value || value}\n          {...pt?.value?.input}\n          className={clsx(pt?.value?.input?.className)}\n          onChange={(event) => onChange && onChange(['value'], [event.target.value])}\n          onBlur={(event) => onCommit && onCommit(['value'], [event.target.value])}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              onCommit && onCommit(['value'], [(event.target as HTMLInputElement).value])\n            }\n          }}\n          placeholder=\"Enter value\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"icon\" {...pt?.icon?.wrapper}>\n        <Styled.Label {...pt?.icon?.label}>Icon</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.Placeholder\n            style={{ display: icon ? 'none' : 'flex' }}\n            onClick={() => {\n              iconSelectRef.current?.open()\n            }}\n          >\n            Pick an icon...\n          </Styled.Placeholder>\n\n          <Styled.IconSelect\n            ref={iconSelectRef}\n            value={[icon || 'question_mark']}\n            widthExpand\n            {...pt?.icon?.input}\n            className={clsx(pt?.icon?.input?.className)}\n            style={{\n              position: icon ? 'relative' : 'absolute',\n              visibility: icon ? 'visible' : 'hidden',\n              ...pt?.icon?.input?.style,\n            }}\n            onChange={(value) => {\n              onChange && onChange(['icon'], [value[0]])\n              onCommit && onCommit(['icon'], [value[0]])\n            }}\n          />\n          {icon && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['icon'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      <Styled.Row key=\"color\" {...pt?.color?.wrapper}>\n        <Styled.Label {...pt?.color?.label}>Color</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.ColorPicker\n            className={color ? 'active' : ''}\n            style={{ backgroundColor: color || undefined }}\n            onClick={() => colorPickerRef.current?.click()}\n          >\n            {!color ? 'Pick a color...' : ''}\n            <input\n              type=\"color\"\n              ref={colorPickerRef}\n              value={color || '#000000'}\n              {...pt?.color?.input}\n              className={clsx(pt?.color?.input?.className)}\n              onChange={(event) => {\n                onChange && onChange(['color'], [event?.target.value.toString()])\n                onCommit && onCommit(['color'], [event?.target.value.toString()])\n              }}\n            />\n          </Styled.ColorPicker>\n          {color && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['color'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      {(showRemoveButton || showDuplicateButton) && (\n        <Styled.Row {...pt?.footer} className={clsx('footer', pt?.footer?.className)}>\n          {showRemoveButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"close\" variant=\"text\" onClick={onRemove}>\n                Remove\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n          {showDuplicateButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"content_copy\" variant=\"text\" onClick={onDuplicate}>\n                Duplicate\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n        </Styled.Row>\n      )}\n    </Styled.EnumItemBody>\n  )\n}\n\nexport default EnumEditorItem\n"],"names":["EnumEditorItem","item","onChange","onCommit","onRemove","onDuplicate","showRemoveButton","showDuplicateButton","autoFocus","isExpanded","className","pt","props","label","value","icon","color","isNewAttribute","labelRef","useRef","valueRef","colorPickerRef","iconSelectRef","useEffect","jsxs","Styled.EnumItemBody","clsx","Styled.Row","jsx","Styled.Label","Styled.InputText","event","kebabCase","Styled.PlaceholderWrapper","Styled.Placeholder","Styled.IconSelect","Styled.Button","Styled.ColorPicker","Styled.ActionWrapper"],"mappings":"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"}
+{"version":3,"file":"EnumEditorItem.cjs.js","sources":["../../../../../src/components/EnumEditor/EnumEditorItem.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { kebabCase } from 'lodash'\n\nimport { DropdownRef, Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport type { AttributeData } from './EnumEditor'\nimport clsx from 'clsx'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\ntype TextInputPt = Partial<React.ComponentProps<typeof Styled.InputText>>\ntype IconInputPt = Partial<React.ComponentProps<typeof Styled.IconSelect>>\ntype ColorInputPt = Partial<React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface EnumEditorFieldPt<TInput> {\n  wrapper?: DivPt\n  label?: DivPt\n  input?: Partial<TInput>\n}\n\nexport interface EnumEditorItemPt {\n  wrapper?: DivPt\n  label?: EnumEditorFieldPt<TextInputPt>\n  value?: EnumEditorFieldPt<TextInputPt>\n  icon?: EnumEditorFieldPt<IconInputPt>\n  color?: EnumEditorFieldPt<ColorInputPt>\n  footer?: DivPt\n}\n\nexport interface EnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  showRemoveButton?: boolean\n  showDuplicateButton?: boolean\n  autoFocus?: boolean\n  isExpanded?: boolean\n  pt?: EnumEditorItemPt\n}\n\nconst EnumEditorItem = ({\n  item,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  showRemoveButton = true,\n  showDuplicateButton = true,\n  autoFocus = false,\n  isExpanded = true,\n  className,\n  pt,\n  ...props\n}: EnumEditorItemProps) => {\n  const { label, value, icon, color, isNewAttribute } = item\n  const labelRef = useRef<HTMLInputElement>(null)\n  const valueRef = useRef<HTMLInputElement>(null)\n  const colorPickerRef = useRef<HTMLInputElement>(null)\n  const iconSelectRef = useRef<DropdownRef>(null)\n\n  useEffect(() => {\n    if (autoFocus || item.isNewAttribute) {\n      labelRef.current?.select()\n    }\n  }, [autoFocus, item.isNewAttribute])\n\n  // Handle focus when item becomes expanded\n  useEffect(() => {\n    if (isExpanded && !autoFocus && !item.isNewAttribute) {\n      // Avoids jittery expand animation\n      setTimeout(() => labelRef.current?.focus(), 250)\n    }\n  }, [isExpanded, autoFocus, item.isNewAttribute])\n\n  return (\n    <Styled.EnumItemBody\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(className, pt?.wrapper?.className, {\n        expanded: isExpanded,\n        collapsed: !isExpanded,\n      })}\n    >\n      <Styled.Row key=\"label\" {...pt?.label?.wrapper}>\n        <Styled.Label {...pt?.label?.label}>Label</Styled.Label>\n        <Styled.InputText\n          ref={labelRef}\n          value={label}\n          autoFocus={autoFocus || isNewAttribute}\n          {...pt?.label?.input}\n          className={clsx(pt?.label?.input?.className)}\n          onChange={(event) => {\n            if (!isNewAttribute) {\n              return onChange && onChange(['label'], [event.target.value])\n            }\n            if (valueRef.current) {\n              valueRef.current.value = kebabCase(event.target.value)\n            }\n            onChange &&\n              onChange(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n          }}\n          onBlur={(event) => {\n            if (!isNewAttribute) {\n              onCommit && onCommit(['label'], [event.target.value])\n            } else {\n              onCommit &&\n                onCommit(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n            }\n          }}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              if (!isNewAttribute) {\n                onCommit && onCommit(['label'], [(event.target as HTMLInputElement).value])\n              } else {\n                onCommit &&\n                  onCommit(\n                    ['label', 'value'],\n                    [\n                      (event.target as HTMLInputElement).value,\n                      kebabCase((event.target as HTMLInputElement).value),\n                    ],\n                  )\n              }\n            }\n          }}\n          placeholder=\"Enter label\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"value\" {...pt?.value?.wrapper}>\n        <Styled.Label {...pt?.value?.label}>Value</Styled.Label>\n        <Styled.InputText\n          ref={valueRef}\n          value={valueRef.current?.value || value}\n          {...pt?.value?.input}\n          className={clsx(pt?.value?.input?.className)}\n          onChange={(event) => onChange && onChange(['value'], [event.target.value])}\n          onBlur={(event) => onCommit && onCommit(['value'], [event.target.value])}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              onCommit && onCommit(['value'], [(event.target as HTMLInputElement).value])\n            }\n          }}\n          placeholder=\"Enter value\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"icon\" {...pt?.icon?.wrapper}>\n        <Styled.Label {...pt?.icon?.label}>Icon</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.Placeholder\n            style={{ display: icon ? 'none' : 'flex' }}\n            onClick={() => {\n              iconSelectRef.current?.open()\n            }}\n          >\n            Pick an icon...\n          </Styled.Placeholder>\n\n          <Styled.IconSelect\n            ref={iconSelectRef}\n            value={[icon || 'question_mark']}\n            widthExpand\n            {...pt?.icon?.input}\n            className={clsx(pt?.icon?.input?.className)}\n            style={{\n              position: icon ? 'relative' : 'absolute',\n              visibility: icon ? 'visible' : 'hidden',\n              ...pt?.icon?.input?.style,\n            }}\n            onChange={(value) => {\n              onChange && onChange(['icon'], [value[0]])\n              onCommit && onCommit(['icon'], [value[0]])\n            }}\n          />\n          {icon && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['icon'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      <Styled.Row key=\"color\" {...pt?.color?.wrapper}>\n        <Styled.Label {...pt?.color?.label}>Color</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.ColorPicker\n            className={color ? 'active' : ''}\n            style={{ backgroundColor: color || undefined }}\n            onClick={() => colorPickerRef.current?.click()}\n          >\n            {!color ? 'Pick a color...' : ''}\n            <input\n              type=\"color\"\n              ref={colorPickerRef}\n              value={color || '#000000'}\n              {...pt?.color?.input}\n              className={clsx(pt?.color?.input?.className)}\n              onChange={(event) => {\n                onChange && onChange(['color'], [event?.target.value.toString()])\n                onCommit && onCommit(['color'], [event?.target.value.toString()])\n              }}\n            />\n          </Styled.ColorPicker>\n          {color && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['color'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      {(showRemoveButton || showDuplicateButton) && (\n        <Styled.Row {...pt?.footer} className={clsx('footer', pt?.footer?.className)}>\n          {showRemoveButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"close\" variant=\"text\" onClick={onRemove}>\n                Remove\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n          {showDuplicateButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"content_copy\" variant=\"text\" onClick={onDuplicate}>\n                Duplicate\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n        </Styled.Row>\n      )}\n    </Styled.EnumItemBody>\n  )\n}\n\nexport default EnumEditorItem\n"],"names":["EnumEditorItem","item","onChange","onCommit","onRemove","onDuplicate","showRemoveButton","showDuplicateButton","autoFocus","isExpanded","className","pt","props","label","value","icon","color","isNewAttribute","labelRef","useRef","valueRef","colorPickerRef","iconSelectRef","useEffect","jsxs","Styled.EnumItemBody","clsx","Styled.Row","jsx","Styled.Label","Styled.InputText","event","kebabCase","Styled.PlaceholderWrapper","Styled.Placeholder","Styled.IconSelect","Styled.Button","Styled.ColorPicker","Styled.ActionWrapper"],"mappings":"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"}

package/dist/shared/src/components/EnumEditor/EnumEditorItem.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumEditorItem.es.js","sources":["../../../../../src/components/EnumEditor/EnumEditorItem.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { kebabCase } from 'lodash'\n\nimport { DropdownRef, Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport { AttributeData } from './EnumEditor'\nimport clsx from 'clsx'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\ntype TextInputPt = Partial<React.ComponentProps<typeof Styled.InputText>>\ntype IconInputPt = Partial<React.ComponentProps<typeof Styled.IconSelect>>\ntype ColorInputPt = Partial<React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface EnumEditorFieldPt<TInput> {\n  wrapper?: DivPt\n  label?: DivPt\n  input?: Partial<TInput>\n}\n\nexport interface EnumEditorItemPt {\n  wrapper?: DivPt\n  label?: EnumEditorFieldPt<TextInputPt>\n  value?: EnumEditorFieldPt<TextInputPt>\n  icon?: EnumEditorFieldPt<IconInputPt>\n  color?: EnumEditorFieldPt<ColorInputPt>\n  footer?: DivPt\n}\n\nexport interface EnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  showRemoveButton?: boolean\n  showDuplicateButton?: boolean\n  autoFocus?: boolean\n  isExpanded?: boolean\n  pt?: EnumEditorItemPt\n}\n\nconst EnumEditorItem = ({\n  item,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  showRemoveButton = true,\n  showDuplicateButton = true,\n  autoFocus = false,\n  isExpanded = true,\n  className,\n  pt,\n  ...props\n}: EnumEditorItemProps) => {\n  const { label, value, icon, color, isNewAttribute } = item\n  const labelRef = useRef<HTMLInputElement>(null)\n  const valueRef = useRef<HTMLInputElement>(null)\n  const colorPickerRef = useRef<HTMLInputElement>(null)\n  const iconSelectRef = useRef<DropdownRef>(null)\n\n  useEffect(() => {\n    if (autoFocus || item.isNewAttribute) {\n      labelRef.current?.select()\n    }\n  }, [autoFocus, item.isNewAttribute])\n\n  // Handle focus when item becomes expanded\n  useEffect(() => {\n    if (isExpanded && !autoFocus && !item.isNewAttribute) {\n      // Avoids jittery expand animation\n      setTimeout(() => labelRef.current?.focus(), 250)\n    }\n  }, [isExpanded, autoFocus, item.isNewAttribute])\n\n  return (\n    <Styled.EnumItemBody\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(className, pt?.wrapper?.className, {\n        expanded: isExpanded,\n        collapsed: !isExpanded,\n      })}\n    >\n      <Styled.Row key=\"label\" {...pt?.label?.wrapper}>\n        <Styled.Label {...pt?.label?.label}>Label</Styled.Label>\n        <Styled.InputText\n          ref={labelRef}\n          value={label}\n          autoFocus={autoFocus || isNewAttribute}\n          {...pt?.label?.input}\n          className={clsx(pt?.label?.input?.className)}\n          onChange={(event) => {\n            if (!isNewAttribute) {\n              return onChange && onChange(['label'], [event.target.value])\n            }\n            if (valueRef.current) {\n              valueRef.current.value = kebabCase(event.target.value)\n            }\n            onChange &&\n              onChange(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n          }}\n          onBlur={(event) => {\n            if (!isNewAttribute) {\n              onCommit && onCommit(['label'], [event.target.value])\n            } else {\n              onCommit &&\n                onCommit(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n            }\n          }}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              if (!isNewAttribute) {\n                onCommit && onCommit(['label'], [(event.target as HTMLInputElement).value])\n              } else {\n                onCommit &&\n                  onCommit(\n                    ['label', 'value'],\n                    [\n                      (event.target as HTMLInputElement).value,\n                      kebabCase((event.target as HTMLInputElement).value),\n                    ],\n                  )\n              }\n            }\n          }}\n          placeholder=\"Enter label\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"value\" {...pt?.value?.wrapper}>\n        <Styled.Label {...pt?.value?.label}>Value</Styled.Label>\n        <Styled.InputText\n          ref={valueRef}\n          value={valueRef.current?.value || value}\n          {...pt?.value?.input}\n          className={clsx(pt?.value?.input?.className)}\n          onChange={(event) => onChange && onChange(['value'], [event.target.value])}\n          onBlur={(event) => onCommit && onCommit(['value'], [event.target.value])}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              onCommit && onCommit(['value'], [(event.target as HTMLInputElement).value])\n            }\n          }}\n          placeholder=\"Enter value\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"icon\" {...pt?.icon?.wrapper}>\n        <Styled.Label {...pt?.icon?.label}>Icon</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.Placeholder\n            style={{ display: icon ? 'none' : 'flex' }}\n            onClick={() => {\n              iconSelectRef.current?.open()\n            }}\n          >\n            Pick an icon...\n          </Styled.Placeholder>\n\n          <Styled.IconSelect\n            ref={iconSelectRef}\n            value={[icon || 'question_mark']}\n            widthExpand\n            {...pt?.icon?.input}\n            className={clsx(pt?.icon?.input?.className)}\n            style={{\n              position: icon ? 'relative' : 'absolute',\n              visibility: icon ? 'visible' : 'hidden',\n              ...pt?.icon?.input?.style,\n            }}\n            onChange={(value) => {\n              onChange && onChange(['icon'], [value[0]])\n              onCommit && onCommit(['icon'], [value[0]])\n            }}\n          />\n          {icon && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['icon'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      <Styled.Row key=\"color\" {...pt?.color?.wrapper}>\n        <Styled.Label {...pt?.color?.label}>Color</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.ColorPicker\n            className={color ? 'active' : ''}\n            style={{ backgroundColor: color || undefined }}\n            onClick={() => colorPickerRef.current?.click()}\n          >\n            {!color ? 'Pick a color...' : ''}\n            <input\n              type=\"color\"\n              ref={colorPickerRef}\n              value={color || '#000000'}\n              {...pt?.color?.input}\n              className={clsx(pt?.color?.input?.className)}\n              onChange={(event) => {\n                onChange && onChange(['color'], [event?.target.value.toString()])\n                onCommit && onCommit(['color'], [event?.target.value.toString()])\n              }}\n            />\n          </Styled.ColorPicker>\n          {color && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['color'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      {(showRemoveButton || showDuplicateButton) && (\n        <Styled.Row {...pt?.footer} className={clsx('footer', pt?.footer?.className)}>\n          {showRemoveButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"close\" variant=\"text\" onClick={onRemove}>\n                Remove\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n          {showDuplicateButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"content_copy\" variant=\"text\" onClick={onDuplicate}>\n                Duplicate\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n        </Styled.Row>\n      )}\n    </Styled.EnumItemBody>\n  )\n}\n\nexport default EnumEditorItem\n"],"names":["EnumEditorItem","item","onChange","onCommit","onRemove","onDuplicate","showRemoveButton","showDuplicateButton","autoFocus","isExpanded","className","pt","props","label","value","icon","color","isNewAttribute","labelRef","useRef","valueRef","colorPickerRef","iconSelectRef","useEffect","jsxs","Styled.EnumItemBody","clsx","Styled.Row","jsx","Styled.Label","Styled.InputText","event","kebabCase","Styled.PlaceholderWrapper","Styled.Placeholder","Styled.IconSelect","Styled.Button","Styled.ColorPicker","Styled.ActionWrapper"],"mappings":"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"}
+{"version":3,"file":"EnumEditorItem.es.js","sources":["../../../../../src/components/EnumEditor/EnumEditorItem.tsx"],"sourcesContent":["import { useEffect, useRef } from 'react'\nimport { kebabCase } from 'lodash'\n\nimport { DropdownRef, Icon } from '@ynput/ayon-react-components'\n\nimport * as Styled from './EnumEditor.styled'\nimport type { AttributeData } from './EnumEditor'\nimport clsx from 'clsx'\n\ntype DivPt = Partial<React.HTMLAttributes<HTMLDivElement>>\n\ntype TextInputPt = Partial<React.ComponentProps<typeof Styled.InputText>>\ntype IconInputPt = Partial<React.ComponentProps<typeof Styled.IconSelect>>\ntype ColorInputPt = Partial<React.InputHTMLAttributes<HTMLInputElement>>\n\nexport interface EnumEditorFieldPt<TInput> {\n  wrapper?: DivPt\n  label?: DivPt\n  input?: Partial<TInput>\n}\n\nexport interface EnumEditorItemPt {\n  wrapper?: DivPt\n  label?: EnumEditorFieldPt<TextInputPt>\n  value?: EnumEditorFieldPt<TextInputPt>\n  icon?: EnumEditorFieldPt<IconInputPt>\n  color?: EnumEditorFieldPt<ColorInputPt>\n  footer?: DivPt\n}\n\nexport interface EnumEditorItemProps\n  extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n  item: AttributeData\n  onChange?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onCommit?: (attr: (keyof AttributeData)[], value: (boolean | string | undefined)[]) => void\n  onRemove?: () => void\n  onDuplicate?: () => void\n  showRemoveButton?: boolean\n  showDuplicateButton?: boolean\n  autoFocus?: boolean\n  isExpanded?: boolean\n  pt?: EnumEditorItemPt\n}\n\nconst EnumEditorItem = ({\n  item,\n  onChange,\n  onCommit,\n  onRemove,\n  onDuplicate,\n  showRemoveButton = true,\n  showDuplicateButton = true,\n  autoFocus = false,\n  isExpanded = true,\n  className,\n  pt,\n  ...props\n}: EnumEditorItemProps) => {\n  const { label, value, icon, color, isNewAttribute } = item\n  const labelRef = useRef<HTMLInputElement>(null)\n  const valueRef = useRef<HTMLInputElement>(null)\n  const colorPickerRef = useRef<HTMLInputElement>(null)\n  const iconSelectRef = useRef<DropdownRef>(null)\n\n  useEffect(() => {\n    if (autoFocus || item.isNewAttribute) {\n      labelRef.current?.select()\n    }\n  }, [autoFocus, item.isNewAttribute])\n\n  // Handle focus when item becomes expanded\n  useEffect(() => {\n    if (isExpanded && !autoFocus && !item.isNewAttribute) {\n      // Avoids jittery expand animation\n      setTimeout(() => labelRef.current?.focus(), 250)\n    }\n  }, [isExpanded, autoFocus, item.isNewAttribute])\n\n  return (\n    <Styled.EnumItemBody\n      {...pt?.wrapper}\n      {...props}\n      className={clsx(className, pt?.wrapper?.className, {\n        expanded: isExpanded,\n        collapsed: !isExpanded,\n      })}\n    >\n      <Styled.Row key=\"label\" {...pt?.label?.wrapper}>\n        <Styled.Label {...pt?.label?.label}>Label</Styled.Label>\n        <Styled.InputText\n          ref={labelRef}\n          value={label}\n          autoFocus={autoFocus || isNewAttribute}\n          {...pt?.label?.input}\n          className={clsx(pt?.label?.input?.className)}\n          onChange={(event) => {\n            if (!isNewAttribute) {\n              return onChange && onChange(['label'], [event.target.value])\n            }\n            if (valueRef.current) {\n              valueRef.current.value = kebabCase(event.target.value)\n            }\n            onChange &&\n              onChange(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n          }}\n          onBlur={(event) => {\n            if (!isNewAttribute) {\n              onCommit && onCommit(['label'], [event.target.value])\n            } else {\n              onCommit &&\n                onCommit(['label', 'value'], [event.target.value, kebabCase(event.target.value)])\n            }\n          }}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              if (!isNewAttribute) {\n                onCommit && onCommit(['label'], [(event.target as HTMLInputElement).value])\n              } else {\n                onCommit &&\n                  onCommit(\n                    ['label', 'value'],\n                    [\n                      (event.target as HTMLInputElement).value,\n                      kebabCase((event.target as HTMLInputElement).value),\n                    ],\n                  )\n              }\n            }\n          }}\n          placeholder=\"Enter label\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"value\" {...pt?.value?.wrapper}>\n        <Styled.Label {...pt?.value?.label}>Value</Styled.Label>\n        <Styled.InputText\n          ref={valueRef}\n          value={valueRef.current?.value || value}\n          {...pt?.value?.input}\n          className={clsx(pt?.value?.input?.className)}\n          onChange={(event) => onChange && onChange(['value'], [event.target.value])}\n          onBlur={(event) => onCommit && onCommit(['value'], [event.target.value])}\n          onKeyDown={(event) => {\n            if (event.key === 'Enter') {\n              event.stopPropagation()\n              onCommit && onCommit(['value'], [(event.target as HTMLInputElement).value])\n            }\n          }}\n          placeholder=\"Enter value\"\n        />\n      </Styled.Row>\n\n      <Styled.Row key=\"icon\" {...pt?.icon?.wrapper}>\n        <Styled.Label {...pt?.icon?.label}>Icon</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.Placeholder\n            style={{ display: icon ? 'none' : 'flex' }}\n            onClick={() => {\n              iconSelectRef.current?.open()\n            }}\n          >\n            Pick an icon...\n          </Styled.Placeholder>\n\n          <Styled.IconSelect\n            ref={iconSelectRef}\n            value={[icon || 'question_mark']}\n            widthExpand\n            {...pt?.icon?.input}\n            className={clsx(pt?.icon?.input?.className)}\n            style={{\n              position: icon ? 'relative' : 'absolute',\n              visibility: icon ? 'visible' : 'hidden',\n              ...pt?.icon?.input?.style,\n            }}\n            onChange={(value) => {\n              onChange && onChange(['icon'], [value[0]])\n              onCommit && onCommit(['icon'], [value[0]])\n            }}\n          />\n          {icon && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['icon'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      <Styled.Row key=\"color\" {...pt?.color?.wrapper}>\n        <Styled.Label {...pt?.color?.label}>Color</Styled.Label>\n\n        <Styled.PlaceholderWrapper style={{ position: 'relative' }}>\n          <Styled.ColorPicker\n            className={color ? 'active' : ''}\n            style={{ backgroundColor: color || undefined }}\n            onClick={() => colorPickerRef.current?.click()}\n          >\n            {!color ? 'Pick a color...' : ''}\n            <input\n              type=\"color\"\n              ref={colorPickerRef}\n              value={color || '#000000'}\n              {...pt?.color?.input}\n              className={clsx(pt?.color?.input?.className)}\n              onChange={(event) => {\n                onChange && onChange(['color'], [event?.target.value.toString()])\n                onCommit && onCommit(['color'], [event?.target.value.toString()])\n              }}\n            />\n          </Styled.ColorPicker>\n          {color && (\n            <Styled.Button\n              icon=\"close\"\n              variant=\"text\"\n              onClick={() => {\n                onChange && onChange(['color'], [undefined])\n              }}\n            />\n          )}\n        </Styled.PlaceholderWrapper>\n      </Styled.Row>\n\n      {(showRemoveButton || showDuplicateButton) && (\n        <Styled.Row {...pt?.footer} className={clsx('footer', pt?.footer?.className)}>\n          {showRemoveButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"close\" variant=\"text\" onClick={onRemove}>\n                Remove\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n          {showDuplicateButton && (\n            <Styled.ActionWrapper>\n              <Styled.Button icon=\"content_copy\" variant=\"text\" onClick={onDuplicate}>\n                Duplicate\n              </Styled.Button>\n            </Styled.ActionWrapper>\n          )}\n        </Styled.Row>\n      )}\n    </Styled.EnumItemBody>\n  )\n}\n\nexport default EnumEditorItem\n"],"names":["EnumEditorItem","item","onChange","onCommit","onRemove","onDuplicate","showRemoveButton","showDuplicateButton","autoFocus","isExpanded","className","pt","props","label","value","icon","color","isNewAttribute","labelRef","useRef","valueRef","colorPickerRef","iconSelectRef","useEffect","jsxs","Styled.EnumItemBody","clsx","Styled.Row","jsx","Styled.Label","Styled.InputText","event","kebabCase","Styled.PlaceholderWrapper","Styled.Placeholder","Styled.IconSelect","Styled.Button","Styled.ColorPicker","Styled.ActionWrapper"],"mappings":"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"}