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

@ynput/ayon-frontend-shared 0.3.21 → 0.3.23

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

Files changed (360) hide show

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EntityPanelUploaderDialog.cjs.js","sources":["../../../../../src/components/EntityPanelUploader/EntityPanelUploaderDialog.tsx"],"sourcesContent":["// A dialog to ask the user to name their new upload uploaded version (naming the product)\n// by default we can take the file name\n\nimport { Dialog, InputText, Button, FormRow } from '@ynput/ayon-react-components'\nimport { camelCase, upperFirst } from 'lodash'\nimport { FC, useState, useEffect, useRef } from 'react'\nimport { parseFilename } from '../ReviewablesList'\n\nconst prefix = 'review'\nconst buildDefaultName = (file?: File \| null) => {\n // remove file extension\n // convert to camelCase\n // first letter to uppercase\n // prefix with \"review\"\n if (!file) return ''\n const name = parseFilename(file.name).replace(/\\.[^/.]+$/, '') // remove file extension\n const camelCaseName = camelCase(name)\n const pascalCaseName = upperFirst(camelCaseName)\n return `${prefix}${pascalCaseName}`\n}\n\ninterface EntityPanelUploaderDialogProps {\n files: FileList \| null // used to determine the default product name\n isOpen: boolean\n defaultProductName?: string\n onCancel?: () => void\n onSubmit?: (productName: string) => void\n}\n\nconst EntityPanelUploaderDialog: FC<EntityPanelUploaderDialogProps> = ({\n files,\n isOpen,\n onCancel,\n onSubmit,\n}) => {\n // Build default product name from the first file\n const defaultProductName = buildDefaultName(files?.[0])\n const inputRef = useRef<HTMLInputElement>(null)\n const hasSelectedRef = useRef(false)\n\n const [product, setProduct] = useState(defaultProductName)\n\n // Update state when defaultProductName changes\n useEffect(() => {\n setProduct(defaultProductName)\n hasSelectedRef.current = false // Reset selection flag when product name changes\n }, [defaultProductName])\n\n // Select the filename part (excluding \"review\" prefix) when dialog opens - only once\n useEffect(() => {\n if (isOpen && inputRef.current && product.startsWith(prefix) && !hasSelectedRef.current) {\n // Focus the input first\n inputRef.current.focus()\n // Then select just the filename part (after \"review\")\n const selectionStart = prefix.length\n const selectionEnd = product.length\n inputRef.current.setSelectionRange(selectionStart, selectionEnd)\n hasSelectedRef.current = true // Mark as selected to prevent re-selection\n } else if (!isOpen) {\n hasSelectedRef.current = false // Reset when dialog closes\n }\n }, [isOpen, product])\n\n const handleSubmit = () => {\n if (product.trim() && onSubmit) {\n onSubmit(product.trim())\n }\n }\n\n const handleCancel = () => {\n setProduct(defaultProductName)\n if (onCancel) {\n onCancel()\n }\n }\n\n const isValidProduct = product.trim().length > 0\n\n const footer = (\n <div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>\n <Button variant=\"text\" onClick={handleCancel}>\n Cancel\n </Button>\n <Button variant=\"filled\" onClick={handleSubmit} disabled={!isValidProduct}>\n Upload\n </Button>\n </div>\n )\n\n return (\n <Dialog isOpen={isOpen} onClose={handleCancel} header=\"Upload Entity\" footer={footer} size=\"sm\">\n <div style={{ padding: '16px 0' }}>\n <FormRow label=\"Product Name\">\n <InputText\n ref={inputRef}\n placeholder=\"Enter product name...\"\n value={product}\n onChange={(e) => setProduct(e.target.value)}\n autoFocus\n onKeyDown={(e) => {\n if (e.key === 'Enter' && isValidProduct) {\n e.preventDefault()\n handleSubmit()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n }}\n />\n </FormRow>\n </div>\n </Dialog>\n )\n}\n\nexport default EntityPanelUploaderDialog\n"],"names":["prefix","buildDefaultName","file","name","parseFilename","camelCaseName","camelCase","pascalCaseName","upperFirst","EntityPanelUploaderDialog","files","isOpen","onCancel","onSubmit","defaultProductName","inputRef","useRef","hasSelectedRef","product","setProduct","useState","useEffect","selectionStart","selectionEnd","handleSubmit","handleCancel","isValidProduct","footer","jsxs","jsx","Button","Dialog","FormRow","InputText"],"mappings":"~~4ueAQMA~~,EAAS,SACTC,EAAoBC,GAAuB,CAK/C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAOC,EAAAA,cAAcF,EAAK,IAAI,EAAE,QAAQ,YAAa,EAAE,EACvDG,EAAgBC,EAAAA,UAAUH,CAAI,EAC9BI,EAAiBC,EAAAA,WAAWH,CAAa,EAC/C,MAAO,GAAGL,CAAM,GAAGO,CAAc,EACnC,EAUME,EAAgE,CAAC,CACrE,MAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,CACF,IAAM,CAEJ,MAAMC,EAAqBb,EAAiBS,IAAQ,CAAC,CAAC,EAChDK,EAAWC,EAAAA,OAAyB,IAAI,EACxCC,EAAiBD,EAAAA,OAAO,EAAK,EAE7B,CAACE,EAASC,CAAU,EAAIC,EAAAA,SAASN,CAAkB,EAGzDO,EAAAA,UAAU,IAAM,CACdF,EAAWL,CAAkB,EAC7BG,EAAe,QAAU,EAC3B,EAAG,CAACH,CAAkB,CAAC,EAGvBO,EAAAA,UAAU,IAAM,CACd,GAAIV,GAAUI,EAAS,SAAWG,EAAQ,WAAWlB,CAAM,GAAK,CAACiB,EAAe,QAAS,CAEvFF,EAAS,QAAQ,MAAA,EAEjB,MAAMO,EAAiBtB,EAAO,OACxBuB,EAAeL,EAAQ,OAC7BH,EAAS,QAAQ,kBAAkBO,EAAgBC,CAAY,EAC/DN,EAAe,QAAU,EAC3B,MAAYN,IACVM,EAAe,QAAU,GAE7B,EAAG,CAACN,EAAQO,CAAO,CAAC,EAEpB,MAAMM,EAAe,IAAM,CACrBN,EAAQ,KAAA,GAAUL,GACpBA,EAASK,EAAQ,MAAM,CAE3B,EAEMO,EAAe,IAAM,CACzBN,EAAWL,CAAkB,EACzBF,GACFA,EAAA,CAEJ,EAEMc,EAAiBR,EAAQ,KAAA,EAAO,OAAS,EAEzCS,EACJC,EAAAA,kBAAAA,KAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,IAAK,MAAO,eAAgB,UAAA,EACzD,SAAA,CAAAC,wBAACC,EAAAA,OAAA,CAAO,QAAQ,OAAO,QAASL,EAAc,SAAA,SAE9C,EACAI,EAAAA,kBAAAA,IAACC,EAAAA,QAAO,QAAQ,SAAS,QAASN,EAAc,SAAU,CAACE,EAAgB,SAAA,QAAA,CAE3E,CAAA,EACF,EAGF,OACEG,wBAACE,EAAAA,QAAO,OAAApB,EAAgB,QAASc,EAAc,OAAO,gBAAgB,OAAAE,EAAgB,KAAK,KACzF,iCAAC,MAAA,CAAI,MAAO,CAAE,QAAS,QAAA,EACrB,SAAAE,EAAAA,kBAAAA,IAACG,EAAAA,QAAA,CAAQ,MAAM,eACb,SAAAH,EAAAA,kBAAAA,IAACI,EAAAA,UAAA,CACC,IAAKlB,EACL,YAAY,wBACZ,MAAOG,EACP,SAAW,GAAMC,EAAW,EAAE,OAAO,KAAK,EAC1C,UAAS,GACT,UAAY,GAAM,CACZ,EAAE,MAAQ,SAAWO,GACvB,EAAE,eAAA,EACFF,EAAA,GACS,EAAE,MAAQ,WACnB,EAAE,eAAA,EACFC,EAAA,EAEJ,CAAA,CAAA,CACF,CACF,EACF,EACF,CAEJ"}
1	+ {"version":3,"file":"EntityPanelUploaderDialog.cjs.js","sources":["../../../../../src/components/EntityPanelUploader/EntityPanelUploaderDialog.tsx"],"sourcesContent":["// A dialog to ask the user to name their new upload uploaded version (naming the product)\n// by default we can take the file name\n\nimport { Dialog, InputText, Button, FormRow } from '@ynput/ayon-react-components'\nimport { camelCase, upperFirst } from 'lodash'\nimport { FC, useState, useEffect, useRef } from 'react'\nimport { parseFilename } from '../ReviewablesList'\n\nconst prefix = 'review'\nconst buildDefaultName = (file?: File \| null) => {\n // remove file extension\n // convert to camelCase\n // first letter to uppercase\n // prefix with \"review\"\n if (!file) return ''\n const name = parseFilename(file.name).replace(/\\.[^/.]+$/, '') // remove file extension\n const camelCaseName = camelCase(name)\n const pascalCaseName = upperFirst(camelCaseName)\n return `${prefix}${pascalCaseName}`\n}\n\ninterface EntityPanelUploaderDialogProps {\n files: FileList \| null // used to determine the default product name\n isOpen: boolean\n defaultProductName?: string\n onCancel?: () => void\n onSubmit?: (productName: string) => void\n}\n\nconst EntityPanelUploaderDialog: FC<EntityPanelUploaderDialogProps> = ({\n files,\n isOpen,\n onCancel,\n onSubmit,\n}) => {\n // Build default product name from the first file\n const defaultProductName = buildDefaultName(files?.[0])\n const inputRef = useRef<HTMLInputElement>(null)\n const hasSelectedRef = useRef(false)\n\n const [product, setProduct] = useState(defaultProductName)\n\n // Update state when defaultProductName changes\n useEffect(() => {\n setProduct(defaultProductName)\n hasSelectedRef.current = false // Reset selection flag when product name changes\n }, [defaultProductName])\n\n // Select the filename part (excluding \"review\" prefix) when dialog opens - only once\n useEffect(() => {\n if (isOpen && inputRef.current && product.startsWith(prefix) && !hasSelectedRef.current) {\n // Focus the input first\n inputRef.current.focus()\n // Then select just the filename part (after \"review\")\n const selectionStart = prefix.length\n const selectionEnd = product.length\n inputRef.current.setSelectionRange(selectionStart, selectionEnd)\n hasSelectedRef.current = true // Mark as selected to prevent re-selection\n } else if (!isOpen) {\n hasSelectedRef.current = false // Reset when dialog closes\n }\n }, [isOpen, product])\n\n const handleSubmit = () => {\n if (product.trim() && onSubmit) {\n onSubmit(product.trim())\n }\n }\n\n const handleCancel = () => {\n setProduct(defaultProductName)\n if (onCancel) {\n onCancel()\n }\n }\n\n const isValidProduct = product.trim().length > 0\n\n const footer = (\n <div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>\n <Button variant=\"text\" onClick={handleCancel}>\n Cancel\n </Button>\n <Button variant=\"filled\" onClick={handleSubmit} disabled={!isValidProduct}>\n Upload\n </Button>\n </div>\n )\n\n return (\n <Dialog isOpen={isOpen} onClose={handleCancel} header=\"Upload Entity\" footer={footer} size=\"sm\">\n <div style={{ padding: '16px 0' }}>\n <FormRow label=\"Product Name\">\n <InputText\n ref={inputRef}\n placeholder=\"Enter product name...\"\n value={product}\n onChange={(e) => setProduct(e.target.value)}\n autoFocus\n onKeyDown={(e) => {\n if (e.key === 'Enter' && isValidProduct) {\n e.preventDefault()\n handleSubmit()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n }}\n />\n </FormRow>\n </div>\n </Dialog>\n )\n}\n\nexport default EntityPanelUploaderDialog\n"],"names":["prefix","buildDefaultName","file","name","parseFilename","camelCaseName","camelCase","pascalCaseName","upperFirst","EntityPanelUploaderDialog","files","isOpen","onCancel","onSubmit","defaultProductName","inputRef","useRef","hasSelectedRef","product","setProduct","useState","useEffect","selectionStart","selectionEnd","handleSubmit","handleCancel","isValidProduct","footer","jsxs","jsx","Button","Dialog","FormRow","InputText"],"mappings":"kyeAQMA,EAAS,SACTC,EAAoBC,GAAuB,CAK/C,GAAI,CAACA,EAAM,MAAO,GAClB,MAAMC,EAAOC,EAAAA,cAAcF,EAAK,IAAI,EAAE,QAAQ,YAAa,EAAE,EACvDG,EAAgBC,EAAAA,UAAUH,CAAI,EAC9BI,EAAiBC,EAAAA,WAAWH,CAAa,EAC/C,MAAO,GAAGL,CAAM,GAAGO,CAAc,EACnC,EAUME,EAAgE,CAAC,CACrE,MAAAC,EACA,OAAAC,EACA,SAAAC,EACA,SAAAC,CACF,IAAM,CAEJ,MAAMC,EAAqBb,EAAiBS,IAAQ,CAAC,CAAC,EAChDK,EAAWC,EAAAA,OAAyB,IAAI,EACxCC,EAAiBD,EAAAA,OAAO,EAAK,EAE7B,CAACE,EAASC,CAAU,EAAIC,EAAAA,SAASN,CAAkB,EAGzDO,EAAAA,UAAU,IAAM,CACdF,EAAWL,CAAkB,EAC7BG,EAAe,QAAU,EAC3B,EAAG,CAACH,CAAkB,CAAC,EAGvBO,EAAAA,UAAU,IAAM,CACd,GAAIV,GAAUI,EAAS,SAAWG,EAAQ,WAAWlB,CAAM,GAAK,CAACiB,EAAe,QAAS,CAEvFF,EAAS,QAAQ,MAAA,EAEjB,MAAMO,EAAiBtB,EAAO,OACxBuB,EAAeL,EAAQ,OAC7BH,EAAS,QAAQ,kBAAkBO,EAAgBC,CAAY,EAC/DN,EAAe,QAAU,EAC3B,MAAYN,IACVM,EAAe,QAAU,GAE7B,EAAG,CAACN,EAAQO,CAAO,CAAC,EAEpB,MAAMM,EAAe,IAAM,CACrBN,EAAQ,KAAA,GAAUL,GACpBA,EAASK,EAAQ,MAAM,CAE3B,EAEMO,EAAe,IAAM,CACzBN,EAAWL,CAAkB,EACzBF,GACFA,EAAA,CAEJ,EAEMc,EAAiBR,EAAQ,KAAA,EAAO,OAAS,EAEzCS,EACJC,EAAAA,kBAAAA,KAAC,MAAA,CAAI,MAAO,CAAE,QAAS,OAAQ,IAAK,MAAO,eAAgB,UAAA,EACzD,SAAA,CAAAC,wBAACC,EAAAA,OAAA,CAAO,QAAQ,OAAO,QAASL,EAAc,SAAA,SAE9C,EACAI,EAAAA,kBAAAA,IAACC,EAAAA,QAAO,QAAQ,SAAS,QAASN,EAAc,SAAU,CAACE,EAAgB,SAAA,QAAA,CAE3E,CAAA,EACF,EAGF,OACEG,wBAACE,EAAAA,QAAO,OAAApB,EAAgB,QAASc,EAAc,OAAO,gBAAgB,OAAAE,EAAgB,KAAK,KACzF,iCAAC,MAAA,CAAI,MAAO,CAAE,QAAS,QAAA,EACrB,SAAAE,EAAAA,kBAAAA,IAACG,EAAAA,QAAA,CAAQ,MAAM,eACb,SAAAH,EAAAA,kBAAAA,IAACI,EAAAA,UAAA,CACC,IAAKlB,EACL,YAAY,wBACZ,MAAOG,EACP,SAAW,GAAMC,EAAW,EAAE,OAAO,KAAK,EAC1C,UAAS,GACT,UAAY,GAAM,CACZ,EAAE,MAAQ,SAAWO,GACvB,EAAE,eAAA,EACFF,EAAA,GACS,EAAE,MAAQ,WACnB,EAAE,eAAA,EACFC,EAAA,EAEJ,CAAA,CAAA,CACF,CACF,EACF,EACF,CAEJ"}

package/dist/shared/src/components/EntityPanelUploader/EntityPanelUploaderDialog.es.js CHANGED Viewed

@@ -103,6 +103,7 @@ import "clsx";
 import "../AttributeEditor/components/MinMaxField.es.js";
 import "react-dom";
 import "../EnumEditor/EnumEditor.styled.es.js";
+import "../AttributeEditor/attributeTypeMap.es.js";
 import "../Badge/Badge.es.js";
 import "../Chips/Chips.es.js";
 import "date-fns";
@@ -271,7 +272,7 @@ const u = "review", k = (m) => {
   if (!m) return "";
   const i = P(m.name).replace(/\.[^/.]+$/, ""), p = D(i), e = R(p);
   return `${u}${e}`;
-}, Fm = ({
+}, Sm = ({
   files: m,
   isOpen: i,
   onCancel: p,
@@ -310,6 +311,6 @@ const u = "review", k = (m) => {
   ) }) }) });
 };
 export {
-  Fm as default
+  Sm as default
 };
 //# sourceMappingURL=EntityPanelUploaderDialog.es.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EntityPanelUploaderDialog.es.js","sources":["../../../../../src/components/EntityPanelUploader/EntityPanelUploaderDialog.tsx"],"sourcesContent":["// A dialog to ask the user to name their new upload uploaded version (naming the product)\n// by default we can take the file name\n\nimport { Dialog, InputText, Button, FormRow } from '@ynput/ayon-react-components'\nimport { camelCase, upperFirst } from 'lodash'\nimport { FC, useState, useEffect, useRef } from 'react'\nimport { parseFilename } from '../ReviewablesList'\n\nconst prefix = 'review'\nconst buildDefaultName = (file?: File \| null) => {\n // remove file extension\n // convert to camelCase\n // first letter to uppercase\n // prefix with \"review\"\n if (!file) return ''\n const name = parseFilename(file.name).replace(/\\.[^/.]+$/, '') // remove file extension\n const camelCaseName = camelCase(name)\n const pascalCaseName = upperFirst(camelCaseName)\n return `${prefix}${pascalCaseName}`\n}\n\ninterface EntityPanelUploaderDialogProps {\n files: FileList \| null // used to determine the default product name\n isOpen: boolean\n defaultProductName?: string\n onCancel?: () => void\n onSubmit?: (productName: string) => void\n}\n\nconst EntityPanelUploaderDialog: FC<EntityPanelUploaderDialogProps> = ({\n files,\n isOpen,\n onCancel,\n onSubmit,\n}) => {\n // Build default product name from the first file\n const defaultProductName = buildDefaultName(files?.[0])\n const inputRef = useRef<HTMLInputElement>(null)\n const hasSelectedRef = useRef(false)\n\n const [product, setProduct] = useState(defaultProductName)\n\n // Update state when defaultProductName changes\n useEffect(() => {\n setProduct(defaultProductName)\n hasSelectedRef.current = false // Reset selection flag when product name changes\n }, [defaultProductName])\n\n // Select the filename part (excluding \"review\" prefix) when dialog opens - only once\n useEffect(() => {\n if (isOpen && inputRef.current && product.startsWith(prefix) && !hasSelectedRef.current) {\n // Focus the input first\n inputRef.current.focus()\n // Then select just the filename part (after \"review\")\n const selectionStart = prefix.length\n const selectionEnd = product.length\n inputRef.current.setSelectionRange(selectionStart, selectionEnd)\n hasSelectedRef.current = true // Mark as selected to prevent re-selection\n } else if (!isOpen) {\n hasSelectedRef.current = false // Reset when dialog closes\n }\n }, [isOpen, product])\n\n const handleSubmit = () => {\n if (product.trim() && onSubmit) {\n onSubmit(product.trim())\n }\n }\n\n const handleCancel = () => {\n setProduct(defaultProductName)\n if (onCancel) {\n onCancel()\n }\n }\n\n const isValidProduct = product.trim().length > 0\n\n const footer = (\n <div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>\n <Button variant=\"text\" onClick={handleCancel}>\n Cancel\n </Button>\n <Button variant=\"filled\" onClick={handleSubmit} disabled={!isValidProduct}>\n Upload\n </Button>\n </div>\n )\n\n return (\n <Dialog isOpen={isOpen} onClose={handleCancel} header=\"Upload Entity\" footer={footer} size=\"sm\">\n <div style={{ padding: '16px 0' }}>\n <FormRow label=\"Product Name\">\n <InputText\n ref={inputRef}\n placeholder=\"Enter product name...\"\n value={product}\n onChange={(e) => setProduct(e.target.value)}\n autoFocus\n onKeyDown={(e) => {\n if (e.key === 'Enter' && isValidProduct) {\n e.preventDefault()\n handleSubmit()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n }}\n />\n </FormRow>\n </div>\n </Dialog>\n )\n}\n\nexport default EntityPanelUploaderDialog\n"],"names":["prefix","buildDefaultName","file","name","parseFilename","camelCaseName","camelCase","pascalCaseName","upperFirst","EntityPanelUploaderDialog","files","isOpen","onCancel","onSubmit","defaultProductName","inputRef","useRef","hasSelectedRef","product","setProduct","useState","useEffect","selectionStart","selectionEnd","handleSubmit","handleCancel","isValidProduct","footer","jsxs","jsx","Button","Dialog","FormRow","InputText","e"],"mappings":"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"}
1	+ {"version":3,"file":"EntityPanelUploaderDialog.es.js","sources":["../../../../../src/components/EntityPanelUploader/EntityPanelUploaderDialog.tsx"],"sourcesContent":["// A dialog to ask the user to name their new upload uploaded version (naming the product)\n// by default we can take the file name\n\nimport { Dialog, InputText, Button, FormRow } from '@ynput/ayon-react-components'\nimport { camelCase, upperFirst } from 'lodash'\nimport { FC, useState, useEffect, useRef } from 'react'\nimport { parseFilename } from '../ReviewablesList'\n\nconst prefix = 'review'\nconst buildDefaultName = (file?: File \| null) => {\n // remove file extension\n // convert to camelCase\n // first letter to uppercase\n // prefix with \"review\"\n if (!file) return ''\n const name = parseFilename(file.name).replace(/\\.[^/.]+$/, '') // remove file extension\n const camelCaseName = camelCase(name)\n const pascalCaseName = upperFirst(camelCaseName)\n return `${prefix}${pascalCaseName}`\n}\n\ninterface EntityPanelUploaderDialogProps {\n files: FileList \| null // used to determine the default product name\n isOpen: boolean\n defaultProductName?: string\n onCancel?: () => void\n onSubmit?: (productName: string) => void\n}\n\nconst EntityPanelUploaderDialog: FC<EntityPanelUploaderDialogProps> = ({\n files,\n isOpen,\n onCancel,\n onSubmit,\n}) => {\n // Build default product name from the first file\n const defaultProductName = buildDefaultName(files?.[0])\n const inputRef = useRef<HTMLInputElement>(null)\n const hasSelectedRef = useRef(false)\n\n const [product, setProduct] = useState(defaultProductName)\n\n // Update state when defaultProductName changes\n useEffect(() => {\n setProduct(defaultProductName)\n hasSelectedRef.current = false // Reset selection flag when product name changes\n }, [defaultProductName])\n\n // Select the filename part (excluding \"review\" prefix) when dialog opens - only once\n useEffect(() => {\n if (isOpen && inputRef.current && product.startsWith(prefix) && !hasSelectedRef.current) {\n // Focus the input first\n inputRef.current.focus()\n // Then select just the filename part (after \"review\")\n const selectionStart = prefix.length\n const selectionEnd = product.length\n inputRef.current.setSelectionRange(selectionStart, selectionEnd)\n hasSelectedRef.current = true // Mark as selected to prevent re-selection\n } else if (!isOpen) {\n hasSelectedRef.current = false // Reset when dialog closes\n }\n }, [isOpen, product])\n\n const handleSubmit = () => {\n if (product.trim() && onSubmit) {\n onSubmit(product.trim())\n }\n }\n\n const handleCancel = () => {\n setProduct(defaultProductName)\n if (onCancel) {\n onCancel()\n }\n }\n\n const isValidProduct = product.trim().length > 0\n\n const footer = (\n <div style={{ display: 'flex', gap: '8px', justifyContent: 'flex-end' }}>\n <Button variant=\"text\" onClick={handleCancel}>\n Cancel\n </Button>\n <Button variant=\"filled\" onClick={handleSubmit} disabled={!isValidProduct}>\n Upload\n </Button>\n </div>\n )\n\n return (\n <Dialog isOpen={isOpen} onClose={handleCancel} header=\"Upload Entity\" footer={footer} size=\"sm\">\n <div style={{ padding: '16px 0' }}>\n <FormRow label=\"Product Name\">\n <InputText\n ref={inputRef}\n placeholder=\"Enter product name...\"\n value={product}\n onChange={(e) => setProduct(e.target.value)}\n autoFocus\n onKeyDown={(e) => {\n if (e.key === 'Enter' && isValidProduct) {\n e.preventDefault()\n handleSubmit()\n } else if (e.key === 'Escape') {\n e.preventDefault()\n handleCancel()\n }\n }}\n />\n </FormRow>\n </div>\n </Dialog>\n )\n}\n\nexport default EntityPanelUploaderDialog\n"],"names":["prefix","buildDefaultName","file","name","parseFilename","camelCaseName","camelCase","pascalCaseName","upperFirst","EntityPanelUploaderDialog","files","isOpen","onCancel","onSubmit","defaultProductName","inputRef","useRef","hasSelectedRef","product","setProduct","useState","useEffect","selectionStart","selectionEnd","handleSubmit","handleCancel","isValidProduct","footer","jsxs","jsx","Button","Dialog","FormRow","InputText","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAQA,MAAMA,IAAS,UACTC,IAAmB,CAACC,MAAuB;AAK/C,MAAI,CAACA,EAAM,QAAO;AAClB,QAAMC,IAAOC,EAAcF,EAAK,IAAI,EAAE,QAAQ,aAAa,EAAE,GACvDG,IAAgBC,EAAUH,CAAI,GAC9BI,IAAiBC,EAAWH,CAAa;AAC/C,SAAO,GAAGL,CAAM,GAAGO,CAAc;AACnC,GAUME,KAAgE,CAAC;AAAA,EACrE,OAAAC;AAAA,EACA,QAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAC;AACF,MAAM;AAEJ,QAAMC,IAAqBb,EAAiBS,IAAQ,CAAC,CAAC,GAChDK,IAAWC,EAAyB,IAAI,GACxCC,IAAiBD,EAAO,EAAK,GAE7B,CAACE,GAASC,CAAU,IAAIC,EAASN,CAAkB;AAGzD,EAAAO,EAAU,MAAM;AACd,IAAAF,EAAWL,CAAkB,GAC7BG,EAAe,UAAU;AAAA,EAC3B,GAAG,CAACH,CAAkB,CAAC,GAGvBO,EAAU,MAAM;AACd,QAAIV,KAAUI,EAAS,WAAWG,EAAQ,WAAWlB,CAAM,KAAK,CAACiB,EAAe,SAAS;AAEvF,MAAAF,EAAS,QAAQ,MAAA;AAEjB,YAAMO,IAAiBtB,EAAO,QACxBuB,IAAeL,EAAQ;AAC7B,MAAAH,EAAS,QAAQ,kBAAkBO,GAAgBC,CAAY,GAC/DN,EAAe,UAAU;AAAA,IAC3B,MAAA,CAAYN,MACVM,EAAe,UAAU;AAAA,EAE7B,GAAG,CAACN,GAAQO,CAAO,CAAC;AAEpB,QAAMM,IAAe,MAAM;AACzB,IAAIN,EAAQ,KAAA,KAAUL,KACpBA,EAASK,EAAQ,MAAM;AAAA,EAE3B,GAEMO,IAAe,MAAM;AACzB,IAAAN,EAAWL,CAAkB,GACzBF,KACFA,EAAA;AAAA,EAEJ,GAEMc,IAAiBR,EAAQ,KAAA,EAAO,SAAS,GAEzCS,IACJC,gBAAAA,EAAAA,KAAC,OAAA,EAAI,OAAO,EAAE,SAAS,QAAQ,KAAK,OAAO,gBAAgB,WAAA,GACzD,UAAA;AAAA,IAAAC,gBAAAA,MAACC,GAAA,EAAO,SAAQ,QAAO,SAASL,GAAc,UAAA,UAE9C;AAAA,IACAI,gBAAAA,EAAAA,IAACC,KAAO,SAAQ,UAAS,SAASN,GAAc,UAAU,CAACE,GAAgB,UAAA,SAAA,CAE3E;AAAA,EAAA,GACF;AAGF,SACEG,gBAAAA,MAACE,KAAO,QAAApB,GAAgB,SAASc,GAAc,QAAO,iBAAgB,QAAAE,GAAgB,MAAK,MACzF,gCAAC,OAAA,EAAI,OAAO,EAAE,SAAS,SAAA,GACrB,UAAAE,gBAAAA,EAAAA,IAACG,GAAA,EAAQ,OAAM,gBACb,UAAAH,gBAAAA,EAAAA;AAAAA,IAACI;AAAA,IAAA;AAAA,MACC,KAAKlB;AAAA,MACL,aAAY;AAAA,MACZ,OAAOG;AAAA,MACP,UAAU,CAACgB,MAAMf,EAAWe,EAAE,OAAO,KAAK;AAAA,MAC1C,WAAS;AAAA,MACT,WAAW,CAACA,MAAM;AAChB,QAAIA,EAAE,QAAQ,WAAWR,KACvBQ,EAAE,eAAA,GACFV,EAAA,KACSU,EAAE,QAAQ,aACnBA,EAAE,eAAA,GACFT,EAAA;AAAA,MAEJ;AAAA,IAAA;AAAA,EAAA,EACF,CACF,GACF,GACF;AAEJ;"}

package/dist/shared/src/components/EnumEditor/DraggableEnumEditorItem.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";const e=require("../../../../_virtual/jsx-runtime.cjs.js"),n=require("clsx"),h=require("@dnd-kit/sortable"),q=require("../../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.cjs.js"),o=require("@ynput/ayon-react-components"),r=require("./EnumEditor.styled.cjs.js"),f=require("./EnumEditorItem.cjs.js"),y=({item:i,isBeingDragged:m,onChange:a,onRemove:u,onDuplicate:d,pt:s,...c})=>{const{id:p,label:E,icon:l,color:x,isExpanded:t}=i,{attributes:j,listeners:R,setNodeRef:N,transform:g,transition:b}=h.useSortable({id:p,animateLayoutChanges:()=>!1}),I={transition:b,transform:q.CSS.Translate.toString(g)};return e.jsxRuntimeExports.jsxs(r.EnumItemWrapper,{ref:N,style:I,...s?.wrapper,...c,className:n(c.className,s?.wrapper?.className,{dragged:m}),children:[e.jsxRuntimeExports.jsxs(r.EnumItemHeader,{...s?.header,onClick:()=>{a&&a(["isExpanded"],[!t])},className:n(s?.header?.className,{expanded:t}),children:[x&&e.jsxRuntimeExports.jsx(r.LabelColor,{style:{backgroundColor:x}}),l&&e.jsxRuntimeExports.jsx(o.Icon,{className:"icon",icon:l}),e.jsxRuntimeExports.jsxs("span",{children:[" ",E," "]}),e.jsxRuntimeExports.jsx("span",{className:"spacer"}),e.jsxRuntimeExports.jsx(o.Icon,{className:"icon toggle-expand",icon:t?"collapse_all":"expand_all"}),e.jsxRuntimeExports.jsx(o.Icon,{...R,...j,className:"icon draggable",icon:"drag_indicator",id:"icon"})]}),e.jsxRuntimeExports.jsx(r.EnumItemBodyExpander,{className:n({expanded:t}),children:e.jsxRuntimeExports.jsx(f,{item:i,onChange:a,onRemove:u,onDuplicate:d,showRemoveButton:!0,showDuplicateButton:!0,autoFocus:!1,isExpanded:t,...s?.item})})]})};module.exports=y;
+"use strict";const e=require("../../../../_virtual/jsx-runtime.cjs.js"),n=require("clsx"),q=require("@dnd-kit/sortable"),f=require("../../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.cjs.js"),o=require("@ynput/ayon-react-components"),r=require("./EnumEditor.styled.cjs.js"),y=require("./EnumEditorItem.cjs.js"),_=({item:i,isBeingDragged:m,onChange:a,onCommit:u,onRemove:d,onDuplicate:p,pt:s,...c})=>{const{id:E,label:j,icon:l,color:x,isExpanded:t}=i,{attributes:R,listeners:N,setNodeRef:g,transform:b,transition:I}=q.useSortable({id:E,animateLayoutChanges:()=>!1}),h={transition:I,transform:f.CSS.Translate.toString(b)};return e.jsxRuntimeExports.jsxs(r.EnumItemWrapper,{ref:g,style:h,...s?.wrapper,...c,className:n(c.className,s?.wrapper?.className,{dragged:m}),children:[e.jsxRuntimeExports.jsxs(r.EnumItemHeader,{...s?.header,onClick:()=>{a&&a(["isExpanded"],[!t])},className:n(s?.header?.className,{expanded:t}),children:[x&&e.jsxRuntimeExports.jsx(r.LabelColor,{style:{backgroundColor:x}}),l&&e.jsxRuntimeExports.jsx(o.Icon,{className:"icon",icon:l}),e.jsxRuntimeExports.jsxs("span",{children:[" ",j," "]}),e.jsxRuntimeExports.jsx("span",{className:"spacer"}),e.jsxRuntimeExports.jsx(o.Icon,{className:"icon toggle-expand",icon:t?"collapse_all":"expand_all"}),e.jsxRuntimeExports.jsx(o.Icon,{...N,...R,className:"icon draggable",icon:"drag_indicator",id:"icon"})]}),e.jsxRuntimeExports.jsx(r.EnumItemBodyExpander,{className:n({expanded:t}),children:e.jsxRuntimeExports.jsx(y,{item:i,onChange:a,onCommit:u,onRemove:d,onDuplicate:p,showRemoveButton:!0,showDuplicateButton:!0,autoFocus:!1,isExpanded:t,...s?.item})})]})};module.exports=_;
 //# sourceMappingURL=DraggableEnumEditorItem.cjs.js.map

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

	@@ -1 +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 onRemove?: () => void\n onDuplicate?: () => void\n pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n item,\n isBeingDragged,\n onChange,\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 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","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":"~~mUA6BMA~~,EAA0B,CAAC,CAC/B,KAAAC,EACA,eAAAC,EACA,SAAAC,EACA,SAAAC,EACA,YAAAC,EACA,GAAAC,EACA,GAAGC,CACL,IAAoC,CAClC,KAAM,CAAE,GAAAC,EAAI,MAAAC,EAAO,KAAAC,EAAM,MAAAC,EAAO,WAAAC,~~GAAeX~~,EAEzC,CAAE,~~WAAAY~~,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,~~QAASJ~~,EAAgB,EAEpF,SAAA,~~CAAAmB~~,EAAAA,kBAAAA,KAACG,EAAAA,eAAA,CACE,GAAGlB,GAAI,OACR,QAAS,IAAM,~~CACbH~~,GAAYA,EAAS,CAAC,YAAY,EAAG,CAAC,~~CAACS~~,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,~~KAAA5B~~,EACA,SAAAE,EACA,SAAAC,EACA,YAAAC,EACA,iBAAkB,GAClB,oBAAqB,GACrB,UAAW,GACX,WAAAO,EACC,GAAGN,GAAI,IAAA,CAAA,CACV,CACF,CAAA,CAAA,CAAA,CAGN"}
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"}

package/dist/shared/src/components/EnumEditor/DraggableEnumEditorItem.es.js CHANGED Viewed

@@ -1,37 +1,38 @@
 import { j as e } from "../../../../_virtual/jsx-runtime.es.js";
 import o from "clsx";
-import { useSortable as h } from "@dnd-kit/sortable";
-import { CSS as I } from "../../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.es.js";
+import { useSortable as I } from "@dnd-kit/sortable";
+import { CSS as w } from "../../../../node_modules/@dnd-kit/utilities/dist/utilities.esm.es.js";
 import { Icon as t } from "@ynput/ayon-react-components";
-import { EnumItemWrapper as w, EnumItemHeader as y, LabelColor as S, EnumItemBodyExpander as B } from "./EnumEditor.styled.es.js";
-import C from "./EnumEditorItem.es.js";
-const H = ({
+import { EnumItemWrapper as y, EnumItemHeader as S, LabelColor as B, EnumItemBodyExpander as C } from "./EnumEditor.styled.es.js";
+import R from "./EnumEditorItem.es.js";
+const T = ({
   item: n,
   isBeingDragged: i,
   onChange: r,
-  onRemove: d,
-  onDuplicate: p,
+  onCommit: d,
+  onRemove: p,
+  onDuplicate: x,
   pt: a,
   ...l
 }) => {
-  const { id: x, label: u, icon: m, color: c, isExpanded: s } = n, { attributes: f, listeners: j, setNodeRef: E, transform: N, transition: g } = h({
-    id: x,
+  const { id: u, label: f, icon: m, color: c, isExpanded: s } = n, { attributes: j, listeners: E, setNodeRef: N, transform: g, transition: b } = I({
+    id: u,
     animateLayoutChanges: () => !1
-  }), b = {
-    transition: g,
-    transform: I.Translate.toString(N)
+  }), h = {
+    transition: b,
+    transform: w.Translate.toString(g)
   };
   return /* @__PURE__ */ e.jsxs(
-    w,
+    y,
     {
-      ref: E,
-      style: b,
+      ref: N,
+      style: h,
       ...a?.wrapper,
       ...l,
       className: o(l.className, a?.wrapper?.className, { dragged: i }),
       children: [
         /* @__PURE__ */ e.jsxs(
-          y,
+          S,
           {
             ...a?.header,
             onClick: () => {
@@ -39,11 +40,11 @@ const H = ({
             },
             className: o(a?.header?.className, { expanded: s }),
             children: [
-              c && /* @__PURE__ */ e.jsx(S, { style: { backgroundColor: c } }),
+              c && /* @__PURE__ */ e.jsx(B, { style: { backgroundColor: c } }),
               m && /* @__PURE__ */ e.jsx(t, { className: "icon", icon: m }),
               /* @__PURE__ */ e.jsxs("span", { children: [
                 " ",
-                u,
+                f,
                 " "
               ] }),
               /* @__PURE__ */ e.jsx("span", { className: "spacer" }),
@@ -51,8 +52,8 @@ const H = ({
               /* @__PURE__ */ e.jsx(
                 t,
                 {
+                  ...E,
                   ...j,
-                  ...f,
                   className: "icon draggable",
                   icon: "drag_indicator",
                   id: "icon"
@@ -61,13 +62,14 @@ const H = ({
             ]
           }
         ),
-        /* @__PURE__ */ e.jsx(B, { className: o({ expanded: s }), children: /* @__PURE__ */ e.jsx(
-          C,
+        /* @__PURE__ */ e.jsx(C, { className: o({ expanded: s }), children: /* @__PURE__ */ e.jsx(
+          R,
           {
             item: n,
             onChange: r,
-            onRemove: d,
-            onDuplicate: p,
+            onCommit: d,
+            onRemove: p,
+            onDuplicate: x,
             showRemoveButton: !0,
             showDuplicateButton: !0,
             autoFocus: !1,
@@ -80,6 +82,6 @@ const H = ({
   );
 };
 export {
-  H as default
+  T as default
 };
 //# sourceMappingURL=DraggableEnumEditorItem.es.js.map

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

	@@ -1 +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 onRemove?: () => void\n onDuplicate?: () => void\n pt?: DraggableEnumEditorItemPt\n}\n\nconst DraggableEnumEditorItem = ({\n item,\n isBeingDragged,\n onChange,\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 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","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":";;;;;;;~~AA6BA~~,MAAMA,IAA0B,CAAC;AAAA,EAC/B,MAAAC;AAAA,EACA,gBAAAC;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,~~MAAeX~~,GAEzC,EAAE,~~YAAAY~~,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,~~SAASJ~~,GAAgB;AAAA,MAEpF,UAAA;AAAA,~~QAAAmB~~,gBAAAA,EAAAA;AAAAA,UAACG;AAAAA,UAAA;AAAA,YACE,GAAGlB,GAAI;AAAA,YACR,SAAS,MAAM;AACb,~~cAAAH~~,KAAYA,EAAS,CAAC,YAAY,GAAG,CAAC,~~CAACS~~,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,~~MAAA5B~~;AAAA,YACA,UAAAE;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;"}
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;"}

package/dist/shared/src/components/EnumEditor/EnumEditor.cjs.js CHANGED Viewed

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../../_virtual/jsx-runtime.cjs.js"),R=require("react"),q=require("react-dom"),E=require("lodash"),c=require("@dnd-kit/core"),x=require("@dnd-kit/sortable"),y=require("@ynput/ayon-react-components"),p=require("./DraggableEnumEditorItem.cjs.js"),S=require("./EnumEditor.styled.cjs.js"),N=require("./hooks/useDraggable.cjs.js"),b=require("./util/index.cjs.js"),A=()=>({id:E.uniqueId(),isExpanded:!0,label:"",value:"",isLabelFocused:!0,isNewAttribute:!1}),C=i=>i.filter(r=>r.label!==""&&r.value!=="").map(({label:r,value:t,icon:s,color:e})=>({label:r,value:t,icon:s||void 0,color:e||void 0})),w=i=>i.map(({label:r,value:t,icon:s,color:e})=>({id:E.uniqueId(),isExpanded:!1,label:r,value:t.toString(),icon:s,color:e,isLabelFocused:!1,isNewAttribute:!1})),L=(i,r)=>r.map((t,s)=>{const e=i[s];return e?{...t,id:e.id,isExpanded:e.isExpanded,isLabelFocused:e.isLabelFocused,isNewAttribute:e.isNewAttribute}:t}),F=({values:i,onChange:r,pt:t,...s})=>{if(!i)return null;const{items:e,handleAddItem:m,handleRemoveItem:j,handleChangeItem:D,handleDuplicateItem:f,handleDraggableEnd:h}=N({creator:A,initialData:w(i),onChange:r,normalizer:C,mergeIncomingData:L}),v=n=>{g(n.active.id)},I=n=>{g(null),h(n)},[u,g]=R.useState();let l;return u&&(l=e.find(n=>n.id===u)),a.jsxRuntimeExports.jsx(a.jsxRuntimeExports.Fragment,{children:a.jsxRuntimeExports.jsxs(S.EnumListWrapper,{...s,children:[a.jsxRuntimeExports.jsxs(c.DndContext,{collisionDetection:c.closestCenter,onDragStart:v,onDragEnd:I,children:[a.jsxRuntimeExports.jsx(x.SortableContext,{items:e,strategy:x.verticalListSortingStrategy,children:e.map((n,o)=>a.jsxRuntimeExports.jsx(p,{item:n,isBeingDragged:n.id===u,onChange:D(o),onRemove:j(o),onDuplicate:()=>f(o,{isLabelFocused:!0,isNewAttribute:!0,label:b.appendOrUpdateNumericSuffix(e[o].label,e.map(d=>d.label)," "),value:b.appendOrUpdateNumericSuffix(e[o].value,e.map(d=>d.value),"-")}),...t?.item},`DraggableAttributeEnum_${n.id}`))}),q.createPortal(a.jsxRuntimeExports.jsx(c.DragOverlay,{style:{},children:l&&a.jsxRuntimeExports.jsx(p,{item:l,...t?.item})}),document.body)]}),a.jsxRuntimeExports.jsx(y.Button,{...t?.addButton,icon:"add",variant:"text",onClick:()=>m({isNewAttribute:!0}),className:t?.addButton?.className,style:{display:"flex",justifyContent:"start"},children:"Add new item"})]})})};exports.EnumEditor=F;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../../_virtual/jsx-runtime.cjs.js"),y=require("react"),S=require("react-dom"),E=require("lodash"),m=require("@dnd-kit/core"),x=require("@dnd-kit/sortable"),C=require("@ynput/ayon-react-components"),p=require("./DraggableEnumEditorItem.cjs.js"),N=require("./EnumEditor.styled.cjs.js"),A=require("./hooks/useDraggable.cjs.js"),b=require("./util/index.cjs.js"),w=()=>({id:E.uniqueId(),isExpanded:!0,label:"",value:"",isLabelFocused:!0,isNewAttribute:!1}),L=i=>i.filter(t=>t.label!==""&&t.value!=="").map(({label:t,value:s,icon:r,color:e})=>({label:t,value:s,icon:r||void 0,color:e||void 0})),F=i=>i.map(({label:t,value:s,icon:r,color:e})=>({id:E.uniqueId(),isExpanded:!1,label:t,value:s.toString(),icon:r,color:e,isLabelFocused:!1,isNewAttribute:!1})),z=(i,t)=>t.map((s,r)=>{const e=i[r];return e?{...s,id:e.id,isExpanded:e.isExpanded,isLabelFocused:e.isLabelFocused,isNewAttribute:e.isNewAttribute}:s}),O=({values:i,onChange:t,onCommit:s,pt:r,...e})=>{if(!i)return null;const{items:o,handleAddItem:j,handleRemoveItem:D,handleChangeItem:h,handleCommitItem:f,handleDuplicateItem:I,handleDraggableEnd:v}=A({creator:w,initialData:F(i),onChange:t,onCommit:s,normalizer:L,mergeIncomingData:z}),R=n=>{g(n.active.id)},q=n=>{g(null),v(n)},[l,g]=y.useState();let d;return l&&(d=o.find(n=>n.id===l)),a.jsxRuntimeExports.jsx(a.jsxRuntimeExports.Fragment,{children:a.jsxRuntimeExports.jsxs(N.EnumListWrapper,{...e,children:[a.jsxRuntimeExports.jsxs(m.DndContext,{collisionDetection:m.closestCenter,onDragStart:R,onDragEnd:q,children:[a.jsxRuntimeExports.jsx(x.SortableContext,{items:o,strategy:x.verticalListSortingStrategy,children:o.map((n,u)=>a.jsxRuntimeExports.jsx(p,{item:n,isBeingDragged:n.id===l,onChange:h(u),onCommit:f(u),onRemove:D(u),onDuplicate:()=>I(u,{isLabelFocused:!0,isNewAttribute:!0,label:b.appendOrUpdateNumericSuffix(o[u].label,o.map(c=>c.label)," "),value:b.appendOrUpdateNumericSuffix(o[u].value,o.map(c=>c.value),"-")}),...r?.item},`DraggableAttributeEnum_${n.id}`))}),S.createPortal(a.jsxRuntimeExports.jsx(m.DragOverlay,{style:{},children:d&&a.jsxRuntimeExports.jsx(p,{item:d,...r?.item})}),document.body)]}),a.jsxRuntimeExports.jsx(C.Button,{...r?.addButton,icon:"add",variant:"text",onClick:()=>j({isNewAttribute:!0}),className:r?.addButton?.className,style:{display:"flex",justifyContent:"start"},children:"Add new item"})]})})};exports.EnumEditor=O;
 //# sourceMappingURL=EnumEditor.cjs.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EnumEditor.cjs.js","sources":["../../../../../src/components/EnumEditor/EnumEditor.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { uniqueId } from 'lodash'\nimport { closestCenter, DndContext, DragEndEvent, DragOverlay, DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'\n\nimport { Button } from '@ynput/ayon-react-components'\n\nimport DraggableEnumEditorItem, { DraggableEnumEditorItemProps } from './DraggableEnumEditorItem'\nimport * as Styled from './EnumEditor.styled'\nimport useDraggable from './hooks/useDraggable'\nimport { appendOrUpdateNumericSuffix } from './util'\n\nexport interface EnumEditorPt {\n item?: DraggableEnumEditorItemProps\n addButton?: Partial<React.ComponentProps<typeof Button>>\n}\n\nexport type AttributeData = {\n id: string\n isExpanded: boolean\n label: string\n value: string\n color?: string\n icon?: string\n isLabelFocused: boolean\n isNewAttribute: boolean\n}\n\nexport type NormalizedData = {\n label: string\n value: string \| number \| boolean\n color?: string\n icon?: string\n}\n\nconst creator = (): AttributeData => ({\n id: uniqueId(),\n isExpanded: true,\n label: '',\n value: '',\n isLabelFocused: true,\n isNewAttribute: false,\n})\n\nconst normalize = (data: AttributeData[]): NormalizedData[] => {\n return data\n .filter((item) => item.label !== '' && item.value !== '')\n .map(({ label, value, icon, color }) => {\n let normalizedValue = value\n return {\n label,\n value: normalizedValue,\n icon: icon \|\| undefined,\n color: color \|\| undefined,\n }\n })\n}\n\nconst denormalize = (data: NormalizedData[]): AttributeData[] => {\n return data.map(({ label, value, icon, color }) => {\n return {\n id: uniqueId(),\n isExpanded: false,\n label,\n value: value.toString(),\n icon: icon,\n color: color,\n isLabelFocused: false,\n isNewAttribute: false,\n }\n })\n}\n\nconst mergeIncomingItems = (\n currentItems: AttributeData[],\n incomingItems: AttributeData[],\n): AttributeData[] => {\n return incomingItems.map((incomingItem, index) => {\n const currentItem = currentItems[index]\n\n if (!currentItem) {\n return incomingItem\n }\n\n return {\n ...incomingItem,\n id: currentItem.id,\n isExpanded: currentItem.isExpanded,\n isLabelFocused: currentItem.isLabelFocused,\n isNewAttribute: currentItem.isNewAttribute,\n }\n })\n}\n\ninterface EnumEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n values: NormalizedData[]\n onChange: (data: NormalizedData[]) => void\n pt?: EnumEditorPt\n}\nexport const EnumEditor = ({ values, onChange, pt, ...props }: EnumEditorProps) => {\n if (!values) {\n return null\n }\n\n const {\n items,\n handleAddItem,\n handleRemoveItem,\n handleChangeItem,\n handleDuplicateItem,\n handleDraggableEnd,\n } = useDraggable<AttributeData, NormalizedData>({\n creator,\n initialData: denormalize(values),\n onChange,\n normalizer: normalize,\n mergeIncomingData: mergeIncomingItems,\n })\n\n const handleDragStart = (event: DragStartEvent) => {\n setDraggedItemId(event.active.id as string)\n }\n\n const handleDragEnd = (event: DragEndEvent) => {\n setDraggedItemId(null)\n handleDraggableEnd(event)\n }\n\n const [draggedItemId, setDraggedItemId] = useState<string \| null>()\n let draggedItem\n if (draggedItemId) {\n draggedItem = items.find((item) => item.id === draggedItemId)\n }\n\n return (\n <>\n <Styled.EnumListWrapper {...props}>\n <DndContext\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {items.map((item, idx) => (\n <DraggableEnumEditorItem\n key={`DraggableAttributeEnum_${item.id}`}\n item={item}\n isBeingDragged={item.id === draggedItemId}\n onChange={handleChangeItem(idx)}\n onRemove={handleRemoveItem(idx)}\n onDuplicate={() =>\n handleDuplicateItem(idx, {\n isLabelFocused: true,\n isNewAttribute: true,\n label: appendOrUpdateNumericSuffix(\n items[idx].label,\n items.map((e) => e.label),\n ' ',\n ),\n value: appendOrUpdateNumericSuffix(\n items[idx].value,\n items.map((el) => el.value),\n '-',\n ),\n })\n }\n {...pt?.item}\n />\n ))}\n </SortableContext>\n\n {createPortal(\n <DragOverlay style={{}}>\n {draggedItem && <DraggableEnumEditorItem item={draggedItem} {...pt?.item} />}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n\n <Button\n {...pt?.addButton}\n icon=\"add\"\n variant=\"text\"\n onClick={() => handleAddItem({ isNewAttribute: true })}\n className={pt?.addButton?.className}\n style={{ display: 'flex', justifyContent: 'start' }}\n >\n Add new item\n </Button>\n </Styled.EnumListWrapper>\n </>\n )\n}\n"],"names":["creator","uniqueId","normalize","data","item","label","value","icon","color","denormalize","mergeIncomingItems","currentItems","incomingItems","incomingItem","index","currentItem","EnumEditor","values","onChange","pt","props","items","handleAddItem","handleRemoveItem","handleChangeItem","handleDuplicateItem","handleDraggableEnd","useDraggable","handleDragStart","event","setDraggedItemId","handleDragEnd","draggedItemId","useState","draggedItem","jsxs","Styled.EnumListWrapper","DndContext","closestCenter","jsx","SortableContext","verticalListSortingStrategy","idx","DraggableEnumEditorItem","appendOrUpdateNumericSuffix","e","el","createPortal","DragOverlay","Button"],"mappings":"6cAoCMA,EAAU,KAAsB,CACpC,GAAIC,EAAAA,SAAA,EACJ,WAAY,GACZ,MAAO,GACP,MAAO,GACP,eAAgB,GAChB,eAAgB,EAClB,GAEMC,EAAaC,GACVA,EACJ,OAAQC,GAASA,EAAK,QAAU,IAAMA,EAAK,QAAU,EAAE,EACvD,IAAI,CAAC,CAAE,MAAAC,EAAO,MAAAC,EAAO,KAAAC,EAAM,MAAAC,MAEnB,CACL,MAAAH,EACA,MAHoBC,EAIpB,KAAMC,GAAQ,OACd,MAAOC,GAAS,MAAA,EAEnB,EAGCC,EAAeN,GACZA,EAAK,IAAI,CAAC,CAAE,MAAAE,EAAO,MAAAC,EAAO,KAAAC,EAAM,MAAAC,MAC9B,CACL,GAAIP,EAAAA,SAAA,EACJ,WAAY,GACZ,MAAAI,EACA,MAAOC,EAAM,SAAA,EACb,KAAAC,EACA,MAAAC,EACA,eAAgB,GAChB,eAAgB,EAAA,EAEnB,EAGGE,EAAqB,CACzBC,EACAC,IAEOA,EAAc,IAAI,CAACC,EAAcC,IAAU,CAChD,MAAMC,EAAcJ,EAAaG,CAAK,EAEtC,OAAKC,EAIE,CACL,GAAGF,EACH,GAAIE,EAAY,GAChB,WAAYA,EAAY,WACxB,eAAgBA,EAAY,eAC5B,eAAgBA,EAAY,cAAA,EARrBF,CAUX,CAAC,~~EAQUG~~,EAAa,CAAC,CAAE,OAAAC,EAAQ,SAAAC,EAAU,GAAAC,EAAI,GAAGC,KAA6B,~~CACjF~~,GAAI,~~CAACH~~,EACH,OAAO,KAGT,KAAM,CACJ,~~MAAAI~~,EACA,cAAAC,EACA,iBAAAC,EACA,iBAAAC,EACA,oBAAAC,EACA,mBAAAC,CAAA,EACEC,EAA4C,CAC9C,~~QAAA3B~~,EACA,YAAaS,EAAYQ,CAAM,EAC/B,SAAAC,EACA,~~WAAYhB~~,EACZ,kBAAmBQ,CAAA,CACpB,~~EAEKkB~~,EAAmBC,GAA0B,CACjDC,EAAiBD,EAAM,OAAO,EAAY,CAC5C,EAEME,EAAiBF,GAAwB,CAC7CC,EAAiB,IAAI,EACrBJ,EAAmBG,CAAK,CAC1B,EAEM,CAACG,EAAeF,CAAgB,EAAIG,WAAA,EAC1C,IAAIC,EACJ,OAAIF,IACFE,~~EAAcb~~,EAAM,~~KAAMjB~~,GAASA,EAAK,~~KAAO4B~~,CAAa,yDAK1D,SAAAG,EAAAA,kBAAAA,KAACC,kBAAA,CAAwB,~~GAAGhB~~,EAC1B,SAAA,~~CAAAe~~,EAAAA,kBAAAA,KAACE,EAAAA,WAAA,CACC,mBAAoBC,EAAAA,cACpB,YAAaV,EACb,UAAWG,EAEX,SAAA,CAAAQ,EAAAA,kBAAAA,IAACC,EAAAA,gBAAA,CAAgB,~~MAAAnB~~,EAAc,~~SAAUoB~~,EAAAA,4BACtC,WAAM,IAAI,~~CAACrC~~,~~EAAMsC~~,IAChBH,EAAAA,kBAAAA,IAACI,EAAA,CAEC,~~KAAAvC~~,EACA,eAAgBA,EAAK,~~KAAO4B~~,EAC5B,~~SAAUR~~,EAAiBkB,CAAG,EAC9B,~~SAAUnB~~,~~EAAiBmB~~,CAAG,EAC9B,YAAa,IACXjB,EAAoBiB,EAAK,CACvB,eAAgB,GAChB,eAAgB,GAChB,MAAOE,EAAAA,~~4BACLvB~~,~~EAAMqB~~,CAAG,EAAE,~~MACXrB~~,EAAM,~~IAAKwB~~,GAAMA,EAAE,KAAK,EACxB,GAAA,EAEF,MAAOD,EAAAA,~~4BACLvB~~,~~EAAMqB~~,CAAG,EAAE,~~MACXrB~~,EAAM,~~IAAKyB~~,GAAOA,EAAG,KAAK,EAC1B,GAAA,CACF,CACD,EAEF,~~GAAG3B~~,GAAI,IAAA,~~EArBH~~,~~0BAA0Bf~~,EAAK,EAAE,EAAA,~~CAuBzC~~,EACH,~~EAEC2C~~,EAAAA,aACCR,EAAAA,kBAAAA,IAACS,EAAAA,YAAA,CAAY,MAAO,CAAA,EACjB,SAAAd,GAAeK,EAAAA,kBAAAA,IAACI,EAAA,CAAwB,KAAMT,EAAc,~~GAAGf~~,GAAI,KAAM,EAC5E,EACA,SAAS,IAAA,CACX,CAAA,CAAA,~~EAGFoB~~,EAAAA,kBAAAA,IAACU,EAAAA,OAAA,CACE,~~GAAG9B~~,GAAI,UACR,KAAK,MACL,QAAQ,OACR,QAAS,IAAMG,EAAc,CAAE,eAAgB,GAAM,EACrD,UAAWH,GAAI,WAAW,UAC1B,MAAO,CAAE,QAAS,OAAQ,eAAgB,OAAA,EAC3C,SAAA,cAAA,CAAA,CAED,CAAA,CACF,CAAA,CACF,CAEJ"}
1	+ {"version":3,"file":"EnumEditor.cjs.js","sources":["../../../../../src/components/EnumEditor/EnumEditor.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { uniqueId } from 'lodash'\nimport { closestCenter, DndContext, DragEndEvent, DragOverlay, DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'\n\nimport { Button } from '@ynput/ayon-react-components'\n\nimport DraggableEnumEditorItem, { DraggableEnumEditorItemProps } from './DraggableEnumEditorItem'\nimport * as Styled from './EnumEditor.styled'\nimport useDraggable from './hooks/useDraggable'\nimport { appendOrUpdateNumericSuffix } from './util'\n\nexport interface EnumEditorPt {\n item?: DraggableEnumEditorItemProps\n addButton?: Partial<React.ComponentProps<typeof Button>>\n}\n\nexport type AttributeData = {\n id: string\n isExpanded: boolean\n label: string\n value: string\n color?: string\n icon?: string\n isLabelFocused: boolean\n isNewAttribute: boolean\n}\n\nexport type NormalizedData = {\n label: string\n value: string \| number \| boolean\n color?: string\n icon?: string\n}\n\nconst creator = (): AttributeData => ({\n id: uniqueId(),\n isExpanded: true,\n label: '',\n value: '',\n isLabelFocused: true,\n isNewAttribute: false,\n})\n\nconst normalize = (data: AttributeData[]): NormalizedData[] => {\n return data\n .filter((item) => item.label !== '' && item.value !== '')\n .map(({ label, value, icon, color }) => {\n let normalizedValue = value\n return {\n label,\n value: normalizedValue,\n icon: icon \|\| undefined,\n color: color \|\| undefined,\n }\n })\n}\n\nconst denormalize = (data: NormalizedData[]): AttributeData[] => {\n return data.map(({ label, value, icon, color }) => {\n return {\n id: uniqueId(),\n isExpanded: false,\n label,\n value: value.toString(),\n icon: icon,\n color: color,\n isLabelFocused: false,\n isNewAttribute: false,\n }\n })\n}\n\nconst mergeIncomingItems = (\n currentItems: AttributeData[],\n incomingItems: AttributeData[],\n): AttributeData[] => {\n return incomingItems.map((incomingItem, index) => {\n const currentItem = currentItems[index]\n\n if (!currentItem) {\n return incomingItem\n }\n\n return {\n ...incomingItem,\n id: currentItem.id,\n isExpanded: currentItem.isExpanded,\n isLabelFocused: currentItem.isLabelFocused,\n isNewAttribute: currentItem.isNewAttribute,\n }\n })\n}\n\ninterface EnumEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n values: NormalizedData[]\n onChange: (data: NormalizedData[]) => void\n onCommit?: (data: NormalizedData[]) => void\n pt?: EnumEditorPt\n}\nexport const EnumEditor = ({ values, onChange, onCommit, pt, ...props }: EnumEditorProps) => {\n if (!values) {\n return null\n }\n\n const {\n items,\n handleAddItem,\n handleRemoveItem,\n handleChangeItem,\n handleCommitItem,\n handleDuplicateItem,\n handleDraggableEnd,\n } = useDraggable<AttributeData, NormalizedData>({\n creator,\n initialData: denormalize(values),\n onChange,\n onCommit,\n normalizer: normalize,\n mergeIncomingData: mergeIncomingItems,\n })\n\n const handleDragStart = (event: DragStartEvent) => {\n setDraggedItemId(event.active.id as string)\n }\n\n const handleDragEnd = (event: DragEndEvent) => {\n setDraggedItemId(null)\n handleDraggableEnd(event)\n }\n\n const [draggedItemId, setDraggedItemId] = useState<string \| null>()\n let draggedItem\n if (draggedItemId) {\n draggedItem = items.find((item) => item.id === draggedItemId)\n }\n\n return (\n <>\n <Styled.EnumListWrapper {...props}>\n <DndContext\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {items.map((item, idx) => (\n <DraggableEnumEditorItem\n key={`DraggableAttributeEnum_${item.id}`}\n item={item}\n isBeingDragged={item.id === draggedItemId}\n onChange={handleChangeItem(idx)}\n onCommit={handleCommitItem(idx)}\n onRemove={handleRemoveItem(idx)}\n onDuplicate={() =>\n handleDuplicateItem(idx, {\n isLabelFocused: true,\n isNewAttribute: true,\n label: appendOrUpdateNumericSuffix(\n items[idx].label,\n items.map((e) => e.label),\n ' ',\n ),\n value: appendOrUpdateNumericSuffix(\n items[idx].value,\n items.map((el) => el.value),\n '-',\n ),\n })\n }\n {...pt?.item}\n />\n ))}\n </SortableContext>\n\n {createPortal(\n <DragOverlay style={{}}>\n {draggedItem && <DraggableEnumEditorItem item={draggedItem} {...pt?.item} />}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n\n <Button\n {...pt?.addButton}\n icon=\"add\"\n variant=\"text\"\n onClick={() => handleAddItem({ isNewAttribute: true })}\n className={pt?.addButton?.className}\n style={{ display: 'flex', justifyContent: 'start' }}\n >\n Add new item\n </Button>\n </Styled.EnumListWrapper>\n </>\n )\n}\n"],"names":["creator","uniqueId","normalize","data","item","label","value","icon","color","denormalize","mergeIncomingItems","currentItems","incomingItems","incomingItem","index","currentItem","EnumEditor","values","onChange","onCommit","pt","props","items","handleAddItem","handleRemoveItem","handleChangeItem","handleCommitItem","handleDuplicateItem","handleDraggableEnd","useDraggable","handleDragStart","event","setDraggedItemId","handleDragEnd","draggedItemId","useState","draggedItem","jsxs","Styled.EnumListWrapper","DndContext","closestCenter","jsx","SortableContext","verticalListSortingStrategy","idx","DraggableEnumEditorItem","appendOrUpdateNumericSuffix","e","el","createPortal","DragOverlay","Button"],"mappings":"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"}

package/dist/shared/src/components/EnumEditor/EnumEditor.es.js CHANGED Viewed

@@ -1,114 +1,117 @@
 import { j as n } from "../../../../_virtual/jsx-runtime.es.js";
-import { useState as I } from "react";
-import { createPortal as j } from "react-dom";
+import { useState as A } from "react";
+import { createPortal as C } from "react-dom";
 import { uniqueId as f } from "lodash";
-import { DndContext as A, closestCenter as N, DragOverlay as y } from "@dnd-kit/core";
-import { SortableContext as S, verticalListSortingStrategy as w } from "@dnd-kit/sortable";
-import { Button as C } from "@ynput/ayon-react-components";
+import { DndContext as N, closestCenter as y, DragOverlay as S } from "@dnd-kit/core";
+import { SortableContext as w, verticalListSortingStrategy as L } from "@dnd-kit/sortable";
+import { Button as F } from "@ynput/ayon-react-components";
 import g from "./DraggableEnumEditorItem.es.js";
-import { EnumListWrapper as L } from "./EnumEditor.styled.es.js";
-import F from "./hooks/useDraggable.es.js";
+import { EnumListWrapper as z } from "./EnumEditor.styled.es.js";
+import B from "./hooks/useDraggable.es.js";
 import { appendOrUpdateNumericSuffix as p } from "./util/index.es.js";
-const z = () => ({
+const R = () => ({
   id: f(),
   isExpanded: !0,
   label: "",
   value: "",
   isLabelFocused: !0,
   isNewAttribute: !1
-}), B = (i) => i.filter((r) => r.label !== "" && r.value !== "").map(({ label: r, value: t, icon: o, color: e }) => ({
-  label: r,
-  value: t,
-  icon: o || void 0,
+}), O = (i) => i.filter((t) => t.label !== "" && t.value !== "").map(({ label: t, value: o, icon: r, color: e }) => ({
+  label: t,
+  value: o,
+  icon: r || void 0,
   color: e || void 0
-})), R = (i) => i.map(({ label: r, value: t, icon: o, color: e }) => ({
+})), V = (i) => i.map(({ label: t, value: o, icon: r, color: e }) => ({
   id: f(),
   isExpanded: !1,
-  label: r,
-  value: t.toString(),
-  icon: o,
+  label: t,
+  value: o.toString(),
+  icon: r,
   color: e,
   isLabelFocused: !1,
   isNewAttribute: !1
-})), O = (i, r) => r.map((t, o) => {
-  const e = i[o];
+})), k = (i, t) => t.map((o, r) => {
+  const e = i[r];
   return e ? {
-    ...t,
+    ...o,
     id: e.id,
     isExpanded: e.isExpanded,
     isLabelFocused: e.isLabelFocused,
     isNewAttribute: e.isNewAttribute
-  } : t;
-}), K = ({ values: i, onChange: r, pt: t, ...o }) => {
+  } : o;
+}), Q = ({ values: i, onChange: t, onCommit: o, pt: r, ...e }) => {
   if (!i)
     return null;
   const {
-    items: e,
-    handleAddItem: u,
-    handleRemoveItem: b,
-    handleChangeItem: D,
-    handleDuplicateItem: x,
-    handleDraggableEnd: h
-  } = F({
-    creator: z,
-    initialData: R(i),
-    onChange: r,
-    normalizer: B,
-    mergeIncomingData: O
-  }), v = (a) => {
+    items: l,
+    handleAddItem: b,
+    handleRemoveItem: D,
+    handleChangeItem: h,
+    handleCommitItem: x,
+    handleDuplicateItem: I,
+    handleDraggableEnd: v
+  } = B({
+    creator: R,
+    initialData: V(i),
+    onChange: t,
+    onCommit: o,
+    normalizer: O,
+    mergeIncomingData: k
+  }), E = (a) => {
     c(a.active.id);
-  }, E = (a) => {
-    c(null), h(a);
-  }, [s, c] = I();
-  let d;
-  return s && (d = e.find((a) => a.id === s)), /* @__PURE__ */ n.jsx(n.Fragment, { children: /* @__PURE__ */ n.jsxs(L, { ...o, children: [
+  }, j = (a) => {
+    c(null), v(a);
+  }, [d, c] = A();
+  let m;
+  return d && (m = l.find((a) => a.id === d)), /* @__PURE__ */ n.jsx(n.Fragment, { children: /* @__PURE__ */ n.jsxs(z, { ...e, children: [
     /* @__PURE__ */ n.jsxs(
-      A,
+      N,
       {
-        collisionDetection: N,
-        onDragStart: v,
-        onDragEnd: E,
+        collisionDetection: y,
+        onDragStart: E,
+        onDragEnd: j,
         children: [
-          /* @__PURE__ */ n.jsx(S, { items: e, strategy: w, children: e.map((a, l) => /* @__PURE__ */ n.jsx(
+          /* @__PURE__ */ n.jsx(w, { items: l, strategy: L, children: l.map((a, s) => /* @__PURE__ */ n.jsx(
             g,
             {
               item: a,
-              isBeingDragged: a.id === s,
-              onChange: D(l),
-              onRemove: b(l),
-              onDuplicate: () => x(l, {
+              isBeingDragged: a.id === d,
+              onChange: h(s),
+              onCommit: x(s),
+              onRemove: D(s),
+              onDuplicate: () => I(s, {
                 isLabelFocused: !0,
                 isNewAttribute: !0,
                 label: p(
-                  e[l].label,
-                  e.map((m) => m.label),
+                  l[s].label,
+                  l.map((u) => u.label),
                   " "
                 ),
                 value: p(
-                  e[l].value,
-                  e.map((m) => m.value),
+                  l[s].value,
+                  l.map((u) => u.value),
                   "-"
                 )
               }),
-              ...t?.item
+              ...r?.item
             },
             `DraggableAttributeEnum_${a.id}`
           )) }),
-          j(
-            /* @__PURE__ */ n.jsx(y, { style: {}, children: d && /* @__PURE__ */ n.jsx(g, { item: d, ...t?.item }) }),
+          C(
+            /* @__PURE__ */ n.jsx(S, { style: {}, children: m && /* @__PURE__ */ n.jsx(g, { item: m, ...r?.item }) }),
             document.body
           )
         ]
       }
     ),
     /* @__PURE__ */ n.jsx(
-      C,
+      F,
       {
-        ...t?.addButton,
+        ...r?.addButton,
         icon: "add",
         variant: "text",
-        onClick: () => u({ isNewAttribute: !0 }),
-        className: t?.addButton?.className,
+        onClick: () => b({ isNewAttribute: !0 }),
+        className: r?.addButton?.className,
         style: { display: "flex", justifyContent: "start" },
         children: "Add new item"
       }
@@ -116,6 +119,6 @@ const z = () => ({
   ] }) });
 };
 export {
-  K as EnumEditor
+  Q as EnumEditor
 };
 //# sourceMappingURL=EnumEditor.es.js.map

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

	@@ -1 +1 @@
1	- {"version":3,"file":"EnumEditor.es.js","sources":["../../../../../src/components/EnumEditor/EnumEditor.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { uniqueId } from 'lodash'\nimport { closestCenter, DndContext, DragEndEvent, DragOverlay, DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'\n\nimport { Button } from '@ynput/ayon-react-components'\n\nimport DraggableEnumEditorItem, { DraggableEnumEditorItemProps } from './DraggableEnumEditorItem'\nimport * as Styled from './EnumEditor.styled'\nimport useDraggable from './hooks/useDraggable'\nimport { appendOrUpdateNumericSuffix } from './util'\n\nexport interface EnumEditorPt {\n item?: DraggableEnumEditorItemProps\n addButton?: Partial<React.ComponentProps<typeof Button>>\n}\n\nexport type AttributeData = {\n id: string\n isExpanded: boolean\n label: string\n value: string\n color?: string\n icon?: string\n isLabelFocused: boolean\n isNewAttribute: boolean\n}\n\nexport type NormalizedData = {\n label: string\n value: string \| number \| boolean\n color?: string\n icon?: string\n}\n\nconst creator = (): AttributeData => ({\n id: uniqueId(),\n isExpanded: true,\n label: '',\n value: '',\n isLabelFocused: true,\n isNewAttribute: false,\n})\n\nconst normalize = (data: AttributeData[]): NormalizedData[] => {\n return data\n .filter((item) => item.label !== '' && item.value !== '')\n .map(({ label, value, icon, color }) => {\n let normalizedValue = value\n return {\n label,\n value: normalizedValue,\n icon: icon \|\| undefined,\n color: color \|\| undefined,\n }\n })\n}\n\nconst denormalize = (data: NormalizedData[]): AttributeData[] => {\n return data.map(({ label, value, icon, color }) => {\n return {\n id: uniqueId(),\n isExpanded: false,\n label,\n value: value.toString(),\n icon: icon,\n color: color,\n isLabelFocused: false,\n isNewAttribute: false,\n }\n })\n}\n\nconst mergeIncomingItems = (\n currentItems: AttributeData[],\n incomingItems: AttributeData[],\n): AttributeData[] => {\n return incomingItems.map((incomingItem, index) => {\n const currentItem = currentItems[index]\n\n if (!currentItem) {\n return incomingItem\n }\n\n return {\n ...incomingItem,\n id: currentItem.id,\n isExpanded: currentItem.isExpanded,\n isLabelFocused: currentItem.isLabelFocused,\n isNewAttribute: currentItem.isNewAttribute,\n }\n })\n}\n\ninterface EnumEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n values: NormalizedData[]\n onChange: (data: NormalizedData[]) => void\n pt?: EnumEditorPt\n}\nexport const EnumEditor = ({ values, onChange, pt, ...props }: EnumEditorProps) => {\n if (!values) {\n return null\n }\n\n const {\n items,\n handleAddItem,\n handleRemoveItem,\n handleChangeItem,\n handleDuplicateItem,\n handleDraggableEnd,\n } = useDraggable<AttributeData, NormalizedData>({\n creator,\n initialData: denormalize(values),\n onChange,\n normalizer: normalize,\n mergeIncomingData: mergeIncomingItems,\n })\n\n const handleDragStart = (event: DragStartEvent) => {\n setDraggedItemId(event.active.id as string)\n }\n\n const handleDragEnd = (event: DragEndEvent) => {\n setDraggedItemId(null)\n handleDraggableEnd(event)\n }\n\n const [draggedItemId, setDraggedItemId] = useState<string \| null>()\n let draggedItem\n if (draggedItemId) {\n draggedItem = items.find((item) => item.id === draggedItemId)\n }\n\n return (\n <>\n <Styled.EnumListWrapper {...props}>\n <DndContext\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {items.map((item, idx) => (\n <DraggableEnumEditorItem\n key={`DraggableAttributeEnum_${item.id}`}\n item={item}\n isBeingDragged={item.id === draggedItemId}\n onChange={handleChangeItem(idx)}\n onRemove={handleRemoveItem(idx)}\n onDuplicate={() =>\n handleDuplicateItem(idx, {\n isLabelFocused: true,\n isNewAttribute: true,\n label: appendOrUpdateNumericSuffix(\n items[idx].label,\n items.map((e) => e.label),\n ' ',\n ),\n value: appendOrUpdateNumericSuffix(\n items[idx].value,\n items.map((el) => el.value),\n '-',\n ),\n })\n }\n {...pt?.item}\n />\n ))}\n </SortableContext>\n\n {createPortal(\n <DragOverlay style={{}}>\n {draggedItem && <DraggableEnumEditorItem item={draggedItem} {...pt?.item} />}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n\n <Button\n {...pt?.addButton}\n icon=\"add\"\n variant=\"text\"\n onClick={() => handleAddItem({ isNewAttribute: true })}\n className={pt?.addButton?.className}\n style={{ display: 'flex', justifyContent: 'start' }}\n >\n Add new item\n </Button>\n </Styled.EnumListWrapper>\n </>\n )\n}\n"],"names":["creator","uniqueId","normalize","data","item","label","value","icon","color","denormalize","mergeIncomingItems","currentItems","incomingItems","incomingItem","index","currentItem","EnumEditor","values","onChange","pt","props","items","handleAddItem","handleRemoveItem","handleChangeItem","handleDuplicateItem","handleDraggableEnd","useDraggable","handleDragStart","event","setDraggedItemId","handleDragEnd","draggedItemId","useState","draggedItem","jsxs","Styled.EnumListWrapper","DndContext","closestCenter","jsx","SortableContext","verticalListSortingStrategy","idx","DraggableEnumEditorItem","appendOrUpdateNumericSuffix","e","el","createPortal","DragOverlay","Button"],"mappings":";;;;;;;;;;;AAoCA,MAAMA,IAAU,OAAsB;AAAA,EACpC,IAAIC,EAAA;AAAA,EACJ,YAAY;AAAA,EACZ,OAAO;AAAA,EACP,OAAO;AAAA,EACP,gBAAgB;AAAA,EAChB,gBAAgB;AAClB,IAEMC,IAAY,CAACC,MACVA,EACJ,OAAO,CAACC,MAASA,EAAK,UAAU,MAAMA,EAAK,UAAU,EAAE,EACvD,IAAI,CAAC,EAAE,OAAAC,GAAO,OAAAC,GAAO,MAAAC,GAAM,OAAAC,SAEnB;AAAA,EACL,OAAAH;AAAA,EACA,OAHoBC;AAAA,EAIpB,MAAMC,KAAQ;AAAA,EACd,OAAOC,KAAS;AAAA,EAEnB,GAGCC,IAAc,CAACN,MACZA,EAAK,IAAI,CAAC,EAAE,OAAAE,GAAO,OAAAC,GAAO,MAAAC,GAAM,OAAAC,SAC9B;AAAA,EACL,IAAIP,EAAA;AAAA,EACJ,YAAY;AAAA,EACZ,OAAAI;AAAA,EACA,OAAOC,EAAM,SAAA;AAAA,EACb,MAAAC;AAAA,EACA,OAAAC;AAAA,EACA,gBAAgB;AAAA,EAChB,gBAAgB;AAAA,EAEnB,GAGGE,IAAqB,CACzBC,GACAC,MAEOA,EAAc,IAAI,CAACC,GAAcC,MAAU;AAChD,QAAMC,IAAcJ,EAAaG,CAAK;AAEtC,SAAKC,IAIE;AAAA,IACL,GAAGF;AAAA,IACH,IAAIE,EAAY;AAAA,IAChB,YAAYA,EAAY;AAAA,IACxB,gBAAgBA,EAAY;AAAA,IAC5B,gBAAgBA,EAAY;AAAA,EAAA,IARrBF;AAUX,CAAC,~~GAQUG~~,IAAa,CAAC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,IAAAC,GAAI,GAAGC,QAA6B;~~AACjF~~,MAAI,~~CAACH~~;AACH,WAAO;AAGT,QAAM;AAAA,IACJ,~~OAAAI~~;AAAA,IACA,eAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,kBAAAC;AAAA,IACA,qBAAAC;AAAA,IACA,oBAAAC;AAAA,EAAA,IACEC,EAA4C;AAAA,IAC9C,~~SAAA3B~~;AAAA,IACA,aAAaS,EAAYQ,CAAM;AAAA,IAC/B,UAAAC;AAAA,IACA,~~YAAYhB~~;AAAA,IACZ,mBAAmBQ;AAAA,EAAA,CACpB,~~GAEKkB~~,IAAkB,CAACC,MAA0B;AACjD,IAAAC,EAAiBD,EAAM,OAAO,EAAY;AAAA,EAC5C,GAEME,IAAgB,CAACF,MAAwB;AAC7C,IAAAC,EAAiB,IAAI,GACrBJ,EAAmBG,CAAK;AAAA,EAC1B,GAEM,CAACG,GAAeF,CAAgB,IAAIG,EAAA;AAC1C,MAAIC;AACJ,SAAIF,MACFE,~~IAAcb~~,EAAM,KAAK,~~CAACjB~~,MAASA,EAAK,~~OAAO4B~~,CAAa,wCAK1D,UAAAG,gBAAAA,EAAAA,KAACC,GAAA,EAAwB,~~GAAGhB~~,GAC1B,UAAA;AAAA,~~IAAAe~~,gBAAAA,EAAAA;AAAAA,MAACE;AAAA,MAAA;AAAA,QACC,oBAAoBC;AAAA,QACpB,aAAaV;AAAA,QACb,WAAWG;AAAA,QAEX,UAAA;AAAA,UAAAQ,gBAAAA,EAAAA,IAACC,GAAA,EAAgB,~~OAAAnB~~,GAAc,~~UAAUoB~~,GACtC,YAAM,IAAI,~~CAACrC~~,~~GAAMsC~~,MAChBH,gBAAAA,EAAAA;AAAAA,YAACI;AAAA,YAAA;AAAA,cAEC,~~MAAAvC~~;AAAA,cACA,gBAAgBA,EAAK,~~OAAO4B~~;AAAA,cAC5B,~~UAAUR~~,EAAiBkB,CAAG;AAAA,cAC9B,~~UAAUnB~~,~~EAAiBmB~~,CAAG;AAAA,cAC9B,aAAa,MACXjB,EAAoBiB,GAAK;AAAA,gBACvB,gBAAgB;AAAA,gBAChB,gBAAgB;AAAA,gBAChB,OAAOE;AAAA,~~kBACLvB~~,~~EAAMqB~~,CAAG,EAAE;AAAA,~~kBACXrB~~,EAAM,IAAI,~~CAACwB~~,MAAMA,EAAE,KAAK;AAAA,kBACxB;AAAA,gBAAA;AAAA,gBAEF,OAAOD;AAAA,~~kBACLvB~~,~~EAAMqB~~,CAAG,EAAE;AAAA,~~kBACXrB~~,EAAM,IAAI,~~CAACyB~~,MAAOA,EAAG,KAAK;AAAA,kBAC1B;AAAA,gBAAA;AAAA,cACF,CACD;AAAA,cAEF,~~GAAG3B~~,GAAI;AAAA,YAAA;AAAA,~~YArBH~~,~~0BAA0Bf~~,EAAK,EAAE;AAAA,UAAA,~~CAuBzC~~,GACH;AAAA,~~UAEC2C~~;AAAA,YACCR,gBAAAA,EAAAA,IAACS,GAAA,EAAY,OAAO,CAAA,GACjB,UAAAd,KAAeK,gBAAAA,EAAAA,IAACI,GAAA,EAAwB,MAAMT,GAAc,~~GAAGf~~,GAAI,MAAM,GAC5E;AAAA,YACA,SAAS;AAAA,UAAA;AAAA,QACX;AAAA,MAAA;AAAA,IAAA;AAAA,~~IAGFoB~~,gBAAAA,EAAAA;AAAAA,MAACU;AAAA,MAAA;AAAA,QACE,~~GAAG9B~~,GAAI;AAAA,QACR,MAAK;AAAA,QACL,SAAQ;AAAA,QACR,SAAS,MAAMG,EAAc,EAAE,gBAAgB,IAAM;AAAA,QACrD,WAAWH,GAAI,WAAW;AAAA,QAC1B,OAAO,EAAE,SAAS,QAAQ,gBAAgB,QAAA;AAAA,QAC3C,UAAA;AAAA,MAAA;AAAA,IAAA;AAAA,EAED,EAAA,CACF,EAAA,CACF;AAEJ;"}
1	+ {"version":3,"file":"EnumEditor.es.js","sources":["../../../../../src/components/EnumEditor/EnumEditor.tsx"],"sourcesContent":["import { useState } from 'react'\nimport { createPortal } from 'react-dom'\nimport { uniqueId } from 'lodash'\nimport { closestCenter, DndContext, DragEndEvent, DragOverlay, DragStartEvent } from '@dnd-kit/core'\nimport { SortableContext, verticalListSortingStrategy } from '@dnd-kit/sortable'\n\nimport { Button } from '@ynput/ayon-react-components'\n\nimport DraggableEnumEditorItem, { DraggableEnumEditorItemProps } from './DraggableEnumEditorItem'\nimport * as Styled from './EnumEditor.styled'\nimport useDraggable from './hooks/useDraggable'\nimport { appendOrUpdateNumericSuffix } from './util'\n\nexport interface EnumEditorPt {\n item?: DraggableEnumEditorItemProps\n addButton?: Partial<React.ComponentProps<typeof Button>>\n}\n\nexport type AttributeData = {\n id: string\n isExpanded: boolean\n label: string\n value: string\n color?: string\n icon?: string\n isLabelFocused: boolean\n isNewAttribute: boolean\n}\n\nexport type NormalizedData = {\n label: string\n value: string \| number \| boolean\n color?: string\n icon?: string\n}\n\nconst creator = (): AttributeData => ({\n id: uniqueId(),\n isExpanded: true,\n label: '',\n value: '',\n isLabelFocused: true,\n isNewAttribute: false,\n})\n\nconst normalize = (data: AttributeData[]): NormalizedData[] => {\n return data\n .filter((item) => item.label !== '' && item.value !== '')\n .map(({ label, value, icon, color }) => {\n let normalizedValue = value\n return {\n label,\n value: normalizedValue,\n icon: icon \|\| undefined,\n color: color \|\| undefined,\n }\n })\n}\n\nconst denormalize = (data: NormalizedData[]): AttributeData[] => {\n return data.map(({ label, value, icon, color }) => {\n return {\n id: uniqueId(),\n isExpanded: false,\n label,\n value: value.toString(),\n icon: icon,\n color: color,\n isLabelFocused: false,\n isNewAttribute: false,\n }\n })\n}\n\nconst mergeIncomingItems = (\n currentItems: AttributeData[],\n incomingItems: AttributeData[],\n): AttributeData[] => {\n return incomingItems.map((incomingItem, index) => {\n const currentItem = currentItems[index]\n\n if (!currentItem) {\n return incomingItem\n }\n\n return {\n ...incomingItem,\n id: currentItem.id,\n isExpanded: currentItem.isExpanded,\n isLabelFocused: currentItem.isLabelFocused,\n isNewAttribute: currentItem.isNewAttribute,\n }\n })\n}\n\ninterface EnumEditorProps extends Omit<React.HTMLAttributes<HTMLDivElement>, 'onChange'> {\n values: NormalizedData[]\n onChange: (data: NormalizedData[]) => void\n onCommit?: (data: NormalizedData[]) => void\n pt?: EnumEditorPt\n}\nexport const EnumEditor = ({ values, onChange, onCommit, pt, ...props }: EnumEditorProps) => {\n if (!values) {\n return null\n }\n\n const {\n items,\n handleAddItem,\n handleRemoveItem,\n handleChangeItem,\n handleCommitItem,\n handleDuplicateItem,\n handleDraggableEnd,\n } = useDraggable<AttributeData, NormalizedData>({\n creator,\n initialData: denormalize(values),\n onChange,\n onCommit,\n normalizer: normalize,\n mergeIncomingData: mergeIncomingItems,\n })\n\n const handleDragStart = (event: DragStartEvent) => {\n setDraggedItemId(event.active.id as string)\n }\n\n const handleDragEnd = (event: DragEndEvent) => {\n setDraggedItemId(null)\n handleDraggableEnd(event)\n }\n\n const [draggedItemId, setDraggedItemId] = useState<string \| null>()\n let draggedItem\n if (draggedItemId) {\n draggedItem = items.find((item) => item.id === draggedItemId)\n }\n\n return (\n <>\n <Styled.EnumListWrapper {...props}>\n <DndContext\n collisionDetection={closestCenter}\n onDragStart={handleDragStart}\n onDragEnd={handleDragEnd}\n >\n <SortableContext items={items} strategy={verticalListSortingStrategy}>\n {items.map((item, idx) => (\n <DraggableEnumEditorItem\n key={`DraggableAttributeEnum_${item.id}`}\n item={item}\n isBeingDragged={item.id === draggedItemId}\n onChange={handleChangeItem(idx)}\n onCommit={handleCommitItem(idx)}\n onRemove={handleRemoveItem(idx)}\n onDuplicate={() =>\n handleDuplicateItem(idx, {\n isLabelFocused: true,\n isNewAttribute: true,\n label: appendOrUpdateNumericSuffix(\n items[idx].label,\n items.map((e) => e.label),\n ' ',\n ),\n value: appendOrUpdateNumericSuffix(\n items[idx].value,\n items.map((el) => el.value),\n '-',\n ),\n })\n }\n {...pt?.item}\n />\n ))}\n </SortableContext>\n\n {createPortal(\n <DragOverlay style={{}}>\n {draggedItem && <DraggableEnumEditorItem item={draggedItem} {...pt?.item} />}\n </DragOverlay>,\n document.body,\n )}\n </DndContext>\n\n <Button\n {...pt?.addButton}\n icon=\"add\"\n variant=\"text\"\n onClick={() => handleAddItem({ isNewAttribute: true })}\n className={pt?.addButton?.className}\n style={{ display: 'flex', justifyContent: 'start' }}\n >\n Add new item\n </Button>\n </Styled.EnumListWrapper>\n </>\n )\n}\n"],"names":["creator","uniqueId","normalize","data","item","label","value","icon","color","denormalize","mergeIncomingItems","currentItems","incomingItems","incomingItem","index","currentItem","EnumEditor","values","onChange","onCommit","pt","props","items","handleAddItem","handleRemoveItem","handleChangeItem","handleCommitItem","handleDuplicateItem","handleDraggableEnd","useDraggable","handleDragStart","event","setDraggedItemId","handleDragEnd","draggedItemId","useState","draggedItem","jsxs","Styled.EnumListWrapper","DndContext","closestCenter","jsx","SortableContext","verticalListSortingStrategy","idx","DraggableEnumEditorItem","appendOrUpdateNumericSuffix","e","el","createPortal","DragOverlay","Button"],"mappings":"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"}