@ynput/ayon-frontend-shared 0.2.26 → 0.2.28

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumCellValue.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumCellValue.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumCellValue.tsx"],"sourcesContent":["import { AttributeEnumItem } from '@shared/api'\nimport { Icon, IconProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { EDIT_TRIGGER_CLASS } from './CellWidget'\n\nconst StyledWidget = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n\n  &.item {\n    padding: 4px 2px;\n    border-radius: 0;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-hover);\n    }\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-container-hover);\n    }\n  }\n`\n\nconst StyledValuesContainer = styled.div`\n  flex: 1;\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n`\n\nconst StyledValueWrapper = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  overflow: hidden;\n  max-width: 100%;\n  min-width: 20px;\n`\n\nconst StyledValue = styled.span`\n  overflow: hidden;\n  white-space: nowrap;\n  width: 100%;\n  text-overflow: ellipsis;\n  text-align: left;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n\n  &.placeholder {\n    color: var(--md-sys-color-outline);\n  }\n`\n\nconst StyledImg = styled.img`\n  width: 20px;\n  height: 20px;\n  object-fit: cover;\n\n  &.avatar {\n    border-radius: 50%;\n  }\n`\n\nconst StyledExpandButton = styled.div`\n  width: 32px;\n  height: 32px;\n  border-radius: var(--border-radius-m);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n\n  &.open {\n    background-color: transparent;\n  }\n`\n\nconst StyledExpandIcon = styled(Icon)`\n  transition: rotate 0.2s;\n`\n\nexport interface EnumTemplateProps extends React.HTMLAttributes<HTMLSpanElement> {\n  selectedOptions: AttributeEnumItem[]\n  placeholder?: string\n  hasMultipleValues: boolean\n  isMultiSelect: boolean\n  isOpen?: boolean\n  isItem?: boolean\n  isSelected?: boolean\n  isReadOnly?: boolean\n  pt?: {\n    icon?: Partial<IconProps>\n    img?: Partial<React.ImgHTMLAttributes<HTMLImageElement>>\n    value?: Partial<React.ImgHTMLAttributes<HTMLSpanElement>>\n    expand?: Partial<IconProps>\n    close?: Partial<IconProps>\n  }\n}\n\nexport const EnumCellValue = ({\n  selectedOptions,\n  placeholder,\n  hasMultipleValues,\n  isMultiSelect,\n  isOpen,\n  isItem,\n  isSelected,\n  isReadOnly,\n  className,\n  pt,\n  ...props\n}: EnumTemplateProps) => {\n  // Destructure pt subprops and their relevant props at the top\n  const {\n    icon: ptIcon = {},\n    img: ptImg = {},\n    value: ptValue = {},\n    expand: ptExpand = {},\n    close: ptClose = {},\n  } = pt || {}\n\n  const { style: iconStyle, className: iconClassName, ...iconRest } = ptIcon\n  const { style: imgStyle, className: imgClassName, ...imgRest } = ptImg\n  const { style: valueStyle, className: valueClassName, ...valueRest } = ptValue\n  const { style: expandStyle, className: expandClassName, ...expandRest } = ptExpand\n  const { style: closeStyle, className: closeClassName, ...closeRest } = ptClose\n\n  // Check if all options have icons\n  const allOptionsHaveIcon = selectedOptions.every((option) => option.icon)\n\n  // Determine if we should show labels based on the requirements\n  const showLabels = !hasMultipleValues || !allOptionsHaveIcon\n  // Show the colors be backgrounds instead of the text\n  const backgroundColor = !allOptionsHaveIcon && isMultiSelect && !isItem\n\n  const isPlaceholder = !selectedOptions.length && placeholder\n  if (isPlaceholder) {\n    selectedOptions = [\n      {\n        label: placeholder,\n        value: '',\n      },\n    ]\n  }\n\n  return (\n    <StyledWidget className={clsx(className, { selected: isSelected, item: isItem })} {...props}>\n      <StyledValuesContainer>\n        {selectedOptions.map((option, i) => (\n          <StyledValueWrapper key={option.value.toString() + i}>\n            {option.icon && checkForImgSrc(option.icon) ? (\n              <StyledImg\n                src={option.icon}\n                className={clsx({ avatar: checkAvatarImg(option.icon) }, imgClassName)}\n                style={imgStyle}\n                {...imgRest}\n              />\n            ) : option.icon ? (\n              <Icon\n                icon={option.icon}\n                style={{ color: option.color, ...iconStyle }}\n                className={iconClassName}\n                {...iconRest}\n              />\n            ) : null}\n\n            {(showLabels || !option.icon) && (\n              <StyledValue\n                style={{\n                  color: backgroundColor ? 'inherit' : option.color,\n                  backgroundColor: backgroundColor\n                    ? option.color || 'var(--md-sys-color-surface-container)'\n                    : 'transparent',\n                  ...valueStyle,\n                }}\n                className={clsx({ placeholder: isPlaceholder }, valueClassName)}\n                aria-label={option.label}\n                {...valueRest}\n              >\n                {option.label}\n              </StyledValue>\n            )}\n          </StyledValueWrapper>\n        ))}\n      </StyledValuesContainer>\n      {!isItem && !isReadOnly && (\n        <StyledExpandButton\n          className={clsx('expand', EDIT_TRIGGER_CLASS, { open: isOpen }, expandClassName)}\n        >\n          <StyledExpandIcon\n            icon=\"expand_more\"\n            style={{ rotate: isOpen ? '180deg' : '0', ...expandStyle }}\n            aria-label=\"Expand options\"\n            {...expandRest}\n          />\n        </StyledExpandButton>\n      )}\n      {isItem && isSelected && isMultiSelect && (\n        <Icon\n          icon=\"close\"\n          style={{ marginLeft: 'auto', marginRight: 4, ...closeStyle }}\n          aria-label=\"Deselect item\"\n          className={clsx('close', closeClassName)}\n          {...closeRest}\n        />\n      )}\n    </StyledWidget>\n  )\n}\n\n// Helper functions to check if the icon is a valid image source\nconst checkForImgSrc = (icon: string | undefined = ''): boolean => {\n  return (\n    icon.startsWith('/') ||\n    icon.startsWith('./') ||\n    icon.startsWith('../') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('https://')\n  )\n}\n\nconst checkAvatarImg = (src: string): boolean => src.includes('avatar')\n"],"names":["StyledWidget","styled","StyledValuesContainer","StyledValueWrapper","StyledValue","StyledImg","StyledExpandButton","StyledExpandIcon","Icon","EnumCellValue","selectedOptions","placeholder","hasMultipleValues","isMultiSelect","isOpen","isItem","isSelected","isReadOnly","className","pt","props","ptIcon","ptImg","ptValue","ptExpand","ptClose","iconStyle","iconClassName","iconRest","imgStyle","imgClassName","imgRest","valueStyle","valueClassName","valueRest","expandStyle","expandClassName","expandRest","closeStyle","closeClassName","closeRest","allOptionsHaveIcon","option","showLabels","backgroundColor","isPlaceholder","jsxs","clsx","jsx","i","checkForImgSrc","checkAvatarImg","EDIT_TRIGGER_CLASS","icon","src"],"mappings":"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"}
+{"version":3,"file":"EnumCellValue.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumCellValue.tsx"],"sourcesContent":["import { AttributeEnumItem } from '@shared/api'\nimport { Icon, IconProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\n// Inline the edit trigger class to avoid runtime import and circular dependency with CellWidget\nconst EDIT_TRIGGER_CLASS = 'edit-trigger'\n\nconst StyledWidget = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n\n  &.item {\n    padding: 4px 2px;\n    border-radius: 0;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-hover);\n    }\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-container-hover);\n    }\n  }\n`\n\nconst StyledValuesContainer = styled.div`\n  flex: 1;\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n`\n\nconst StyledValueWrapper = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  overflow: hidden;\n  max-width: 100%;\n  min-width: 20px;\n`\n\nconst StyledValue = styled.span`\n  overflow: hidden;\n  white-space: nowrap;\n  width: 100%;\n  text-overflow: ellipsis;\n  text-align: left;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n\n  &.placeholder {\n    color: var(--md-sys-color-outline);\n  }\n`\n\nconst StyledImg = styled.img`\n  width: 20px;\n  height: 20px;\n  object-fit: cover;\n\n  &.avatar {\n    border-radius: 50%;\n  }\n`\n\nconst StyledExpandButton = styled.div`\n  width: 32px;\n  height: 32px;\n  border-radius: var(--border-radius-m);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n\n  &.open {\n    background-color: transparent;\n  }\n`\n\nconst StyledExpandIcon = styled(Icon)`\n  transition: rotate 0.2s;\n`\n\nexport interface EnumTemplateProps extends React.HTMLAttributes<HTMLSpanElement> {\n  selectedOptions: AttributeEnumItem[]\n  placeholder?: string\n  hasMultipleValues?: boolean\n  isMultiSelect?: boolean\n  isOpen?: boolean\n  isItem?: boolean\n  isSelected?: boolean\n  isReadOnly?: boolean\n  pt?: {\n    icon?: Partial<IconProps>\n    img?: Partial<React.ImgHTMLAttributes<HTMLImageElement>>\n    value?: Partial<React.ImgHTMLAttributes<HTMLSpanElement>>\n    expand?: Partial<IconProps>\n    close?: Partial<IconProps>\n  }\n}\n\nexport const EnumCellValue = ({\n  selectedOptions,\n  placeholder,\n  hasMultipleValues,\n  isMultiSelect,\n  isOpen,\n  isItem,\n  isSelected,\n  isReadOnly,\n  className,\n  pt,\n  ...props\n}: EnumTemplateProps) => {\n  // Destructure pt subprops and their relevant props at the top\n  const {\n    icon: ptIcon = {},\n    img: ptImg = {},\n    value: ptValue = {},\n    expand: ptExpand = {},\n    close: ptClose = {},\n  } = pt || {}\n\n  const { style: iconStyle, className: iconClassName, ...iconRest } = ptIcon\n  const { style: imgStyle, className: imgClassName, ...imgRest } = ptImg\n  const { style: valueStyle, className: valueClassName, ...valueRest } = ptValue\n  const { style: expandStyle, className: expandClassName, ...expandRest } = ptExpand\n  const { style: closeStyle, className: closeClassName, ...closeRest } = ptClose\n\n  // Check if all options have icons\n  const allOptionsHaveIcon = selectedOptions.every((option) => option.icon)\n\n  // Determine if we should show labels based on the requirements\n  const showLabels = !hasMultipleValues || !allOptionsHaveIcon\n  // Show the colors be backgrounds instead of the text\n  const backgroundColor = !allOptionsHaveIcon && isMultiSelect && !isItem\n\n  const isPlaceholder = !selectedOptions.length && placeholder\n  if (isPlaceholder) {\n    selectedOptions = [\n      {\n        label: placeholder,\n        value: '',\n      },\n    ]\n  }\n\n  return (\n    <StyledWidget className={clsx(className, { selected: isSelected, item: isItem })} {...props}>\n      <StyledValuesContainer>\n        {selectedOptions.map((option, i) => (\n          <StyledValueWrapper key={option.value.toString() + i}>\n            {option.icon && checkForImgSrc(option.icon) ? (\n              <StyledImg\n                src={option.icon}\n                className={clsx({ avatar: checkAvatarImg(option.icon) }, imgClassName)}\n                style={imgStyle}\n                data-tooltip={option.label}\n                {...imgRest}\n              />\n            ) : option.icon ? (\n              <Icon\n                icon={option.icon}\n                style={{ color: option.color, ...iconStyle }}\n                className={iconClassName}\n                {...iconRest}\n              />\n            ) : null}\n\n            {(showLabels || !option.icon) && (\n              <StyledValue\n                style={{\n                  color: backgroundColor ? 'inherit' : option.color,\n                  backgroundColor: backgroundColor\n                    ? option.color || 'var(--md-sys-color-surface-container)'\n                    : 'transparent',\n                  ...valueStyle,\n                }}\n                className={clsx({ placeholder: isPlaceholder }, valueClassName)}\n                aria-label={option.label}\n                {...valueRest}\n              >\n                {option.label}\n              </StyledValue>\n            )}\n          </StyledValueWrapper>\n        ))}\n      </StyledValuesContainer>\n      {!isItem && !isReadOnly && (\n        <StyledExpandButton\n          className={clsx('expand', EDIT_TRIGGER_CLASS, { open: isOpen }, expandClassName)}\n        >\n          <StyledExpandIcon\n            icon=\"expand_more\"\n            style={{ rotate: isOpen ? '180deg' : '0', ...expandStyle }}\n            aria-label=\"Expand options\"\n            {...expandRest}\n          />\n        </StyledExpandButton>\n      )}\n      {isItem && isSelected && isMultiSelect && (\n        <Icon\n          icon=\"close\"\n          style={{ marginLeft: 'auto', marginRight: 4, ...closeStyle }}\n          aria-label=\"Deselect item\"\n          className={clsx('close', closeClassName)}\n          {...closeRest}\n        />\n      )}\n    </StyledWidget>\n  )\n}\n\n// Helper functions to check if the icon is a valid image source\nconst checkForImgSrc = (icon: string | undefined = ''): boolean => {\n  return (\n    icon.startsWith('/') ||\n    icon.startsWith('./') ||\n    icon.startsWith('../') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('https://')\n  )\n}\n\nconst checkAvatarImg = (src: string): boolean => src.includes('avatar')\n"],"names":["EDIT_TRIGGER_CLASS","StyledWidget","styled","StyledValuesContainer","StyledValueWrapper","StyledValue","StyledImg","StyledExpandButton","StyledExpandIcon","Icon","EnumCellValue","selectedOptions","placeholder","hasMultipleValues","isMultiSelect","isOpen","isItem","isSelected","isReadOnly","className","pt","props","ptIcon","ptImg","ptValue","ptExpand","ptClose","iconStyle","iconClassName","iconRest","imgStyle","imgClassName","imgRest","valueStyle","valueClassName","valueRest","expandStyle","expandClassName","expandRest","closeStyle","closeClassName","closeRest","allOptionsHaveIcon","option","showLabels","backgroundColor","isPlaceholder","jsxs","clsx","jsx","i","checkForImgSrc","checkAvatarImg","icon","src"],"mappings":"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"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumCellValue.es.js

@@ -2,8 +2,7 @@ import { j as r } from "../../../../../_virtual/jsx-runtime.es.js";
 import { Icon as o } from "@ynput/ayon-react-components";
 import l from "clsx";
 import s from "styled-components";
-import { EDIT_TRIGGER_CLASS as P } from "./CellWidget.es.js";
-const q = s.div`
+const P = "edit-trigger", q = s.div`
   display: flex;
   gap: var(--base-gap-small);
   align-items: center;
@@ -82,15 +81,15 @@ const q = s.div`
   }
 `, X = s(o)`
   transition: rotate 0.2s;
-`, re = ({
+`, ae = ({
   selectedOptions: a,
   placeholder: c,
-  hasMultipleValues: x,
+  hasMultipleValues: g,
   isMultiSelect: n,
   isOpen: i,
   isItem: t,
   isSelected: d,
-  isReadOnly: g,
+  isReadOnly: x,
   className: u,
   pt: v,
   ...y
@@ -101,7 +100,7 @@ const q = s.div`
     value: N = {},
     expand: w = {},
     close: S = {}
-  } = v || {}, { style: j, className: C, ...k } = b, { style: R, className: E, ...I } = f, { style: W, className: V, ...L } = N, { style: _, className: A, ...D } = w, { style: G, className: T, ...B } = S, m = a.every((e) => e.icon), F = !x || !m, p = !m && n && !t, h = !a.length && c;
+  } = v || {}, { style: j, className: C, ...k } = b, { style: R, className: E, ...I } = f, { style: W, className: V, ...L } = N, { style: _, className: A, ...D } = w, { style: G, className: T, ...B } = S, m = a.every((e) => e.icon), F = !g || !m, p = !m && n && !t, h = !a.length && c;
   return h && (a = [
     {
       label: c,
@@ -115,6 +114,7 @@ const q = s.div`
           src: e.icon,
           className: l({ avatar: Z(e.icon) }, E),
           style: R,
+          "data-tooltip": e.label,
           ...I
         }
       ) : e.icon ? /* @__PURE__ */ r.jsx(
@@ -141,7 +141,7 @@ const q = s.div`
         }
       )
     ] }, e.value.toString() + H)) }),
-    !t && !g && /* @__PURE__ */ r.jsx(
+    !t && !x && /* @__PURE__ */ r.jsx(
       U,
       {
         className: l("expand", P, { open: i }, A),
@@ -169,6 +169,6 @@ const q = s.div`
   ] });
 }, Y = (a = "") => a.startsWith("/") || a.startsWith("./") || a.startsWith("../") || a.startsWith("http://") || a.startsWith("https://"), Z = (a) => a.includes("avatar");
 export {
-  re as EnumCellValue
+  ae as EnumCellValue
 };
 //# sourceMappingURL=EnumCellValue.es.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumCellValue.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumCellValue.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumCellValue.tsx"],"sourcesContent":["import { AttributeEnumItem } from '@shared/api'\nimport { Icon, IconProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\nimport { EDIT_TRIGGER_CLASS } from './CellWidget'\n\nconst StyledWidget = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n\n  &.item {\n    padding: 4px 2px;\n    border-radius: 0;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-hover);\n    }\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-container-hover);\n    }\n  }\n`\n\nconst StyledValuesContainer = styled.div`\n  flex: 1;\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n`\n\nconst StyledValueWrapper = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  overflow: hidden;\n  max-width: 100%;\n  min-width: 20px;\n`\n\nconst StyledValue = styled.span`\n  overflow: hidden;\n  white-space: nowrap;\n  width: 100%;\n  text-overflow: ellipsis;\n  text-align: left;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n\n  &.placeholder {\n    color: var(--md-sys-color-outline);\n  }\n`\n\nconst StyledImg = styled.img`\n  width: 20px;\n  height: 20px;\n  object-fit: cover;\n\n  &.avatar {\n    border-radius: 50%;\n  }\n`\n\nconst StyledExpandButton = styled.div`\n  width: 32px;\n  height: 32px;\n  border-radius: var(--border-radius-m);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n\n  &.open {\n    background-color: transparent;\n  }\n`\n\nconst StyledExpandIcon = styled(Icon)`\n  transition: rotate 0.2s;\n`\n\nexport interface EnumTemplateProps extends React.HTMLAttributes<HTMLSpanElement> {\n  selectedOptions: AttributeEnumItem[]\n  placeholder?: string\n  hasMultipleValues: boolean\n  isMultiSelect: boolean\n  isOpen?: boolean\n  isItem?: boolean\n  isSelected?: boolean\n  isReadOnly?: boolean\n  pt?: {\n    icon?: Partial<IconProps>\n    img?: Partial<React.ImgHTMLAttributes<HTMLImageElement>>\n    value?: Partial<React.ImgHTMLAttributes<HTMLSpanElement>>\n    expand?: Partial<IconProps>\n    close?: Partial<IconProps>\n  }\n}\n\nexport const EnumCellValue = ({\n  selectedOptions,\n  placeholder,\n  hasMultipleValues,\n  isMultiSelect,\n  isOpen,\n  isItem,\n  isSelected,\n  isReadOnly,\n  className,\n  pt,\n  ...props\n}: EnumTemplateProps) => {\n  // Destructure pt subprops and their relevant props at the top\n  const {\n    icon: ptIcon = {},\n    img: ptImg = {},\n    value: ptValue = {},\n    expand: ptExpand = {},\n    close: ptClose = {},\n  } = pt || {}\n\n  const { style: iconStyle, className: iconClassName, ...iconRest } = ptIcon\n  const { style: imgStyle, className: imgClassName, ...imgRest } = ptImg\n  const { style: valueStyle, className: valueClassName, ...valueRest } = ptValue\n  const { style: expandStyle, className: expandClassName, ...expandRest } = ptExpand\n  const { style: closeStyle, className: closeClassName, ...closeRest } = ptClose\n\n  // Check if all options have icons\n  const allOptionsHaveIcon = selectedOptions.every((option) => option.icon)\n\n  // Determine if we should show labels based on the requirements\n  const showLabels = !hasMultipleValues || !allOptionsHaveIcon\n  // Show the colors be backgrounds instead of the text\n  const backgroundColor = !allOptionsHaveIcon && isMultiSelect && !isItem\n\n  const isPlaceholder = !selectedOptions.length && placeholder\n  if (isPlaceholder) {\n    selectedOptions = [\n      {\n        label: placeholder,\n        value: '',\n      },\n    ]\n  }\n\n  return (\n    <StyledWidget className={clsx(className, { selected: isSelected, item: isItem })} {...props}>\n      <StyledValuesContainer>\n        {selectedOptions.map((option, i) => (\n          <StyledValueWrapper key={option.value.toString() + i}>\n            {option.icon && checkForImgSrc(option.icon) ? (\n              <StyledImg\n                src={option.icon}\n                className={clsx({ avatar: checkAvatarImg(option.icon) }, imgClassName)}\n                style={imgStyle}\n                {...imgRest}\n              />\n            ) : option.icon ? (\n              <Icon\n                icon={option.icon}\n                style={{ color: option.color, ...iconStyle }}\n                className={iconClassName}\n                {...iconRest}\n              />\n            ) : null}\n\n            {(showLabels || !option.icon) && (\n              <StyledValue\n                style={{\n                  color: backgroundColor ? 'inherit' : option.color,\n                  backgroundColor: backgroundColor\n                    ? option.color || 'var(--md-sys-color-surface-container)'\n                    : 'transparent',\n                  ...valueStyle,\n                }}\n                className={clsx({ placeholder: isPlaceholder }, valueClassName)}\n                aria-label={option.label}\n                {...valueRest}\n              >\n                {option.label}\n              </StyledValue>\n            )}\n          </StyledValueWrapper>\n        ))}\n      </StyledValuesContainer>\n      {!isItem && !isReadOnly && (\n        <StyledExpandButton\n          className={clsx('expand', EDIT_TRIGGER_CLASS, { open: isOpen }, expandClassName)}\n        >\n          <StyledExpandIcon\n            icon=\"expand_more\"\n            style={{ rotate: isOpen ? '180deg' : '0', ...expandStyle }}\n            aria-label=\"Expand options\"\n            {...expandRest}\n          />\n        </StyledExpandButton>\n      )}\n      {isItem && isSelected && isMultiSelect && (\n        <Icon\n          icon=\"close\"\n          style={{ marginLeft: 'auto', marginRight: 4, ...closeStyle }}\n          aria-label=\"Deselect item\"\n          className={clsx('close', closeClassName)}\n          {...closeRest}\n        />\n      )}\n    </StyledWidget>\n  )\n}\n\n// Helper functions to check if the icon is a valid image source\nconst checkForImgSrc = (icon: string | undefined = ''): boolean => {\n  return (\n    icon.startsWith('/') ||\n    icon.startsWith('./') ||\n    icon.startsWith('../') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('https://')\n  )\n}\n\nconst checkAvatarImg = (src: string): boolean => src.includes('avatar')\n"],"names":["StyledWidget","styled","StyledValuesContainer","StyledValueWrapper","StyledValue","StyledImg","StyledExpandButton","StyledExpandIcon","Icon","EnumCellValue","selectedOptions","placeholder","hasMultipleValues","isMultiSelect","isOpen","isItem","isSelected","isReadOnly","className","pt","props","ptIcon","ptImg","ptValue","ptExpand","ptClose","iconStyle","iconClassName","iconRest","imgStyle","imgClassName","imgRest","valueStyle","valueClassName","valueRest","expandStyle","expandClassName","expandRest","closeStyle","closeClassName","closeRest","allOptionsHaveIcon","option","showLabels","backgroundColor","isPlaceholder","jsxs","clsx","jsx","i","checkForImgSrc","checkAvatarImg","EDIT_TRIGGER_CLASS","icon","src"],"mappings":"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"}
+{"version":3,"file":"EnumCellValue.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumCellValue.tsx"],"sourcesContent":["import { AttributeEnumItem } from '@shared/api'\nimport { Icon, IconProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport styled from 'styled-components'\n// Inline the edit trigger class to avoid runtime import and circular dependency with CellWidget\nconst EDIT_TRIGGER_CLASS = 'edit-trigger'\n\nconst StyledWidget = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  height: 100%;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n\n  &.item {\n    padding: 4px 2px;\n    border-radius: 0;\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-hover);\n    }\n  }\n\n  &.selected {\n    background-color: var(--md-sys-color-primary-container);\n\n    &:hover {\n      background-color: var(--md-sys-color-primary-container-hover);\n    }\n  }\n`\n\nconst StyledValuesContainer = styled.div`\n  flex: 1;\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  overflow: hidden;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n`\n\nconst StyledValueWrapper = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n\n  overflow: hidden;\n  max-width: 100%;\n  min-width: 20px;\n`\n\nconst StyledValue = styled.span`\n  overflow: hidden;\n  white-space: nowrap;\n  width: 100%;\n  text-overflow: ellipsis;\n  text-align: left;\n  border-radius: var(--border-radius-m);\n  padding: 0px 2px;\n\n  &.placeholder {\n    color: var(--md-sys-color-outline);\n  }\n`\n\nconst StyledImg = styled.img`\n  width: 20px;\n  height: 20px;\n  object-fit: cover;\n\n  &.avatar {\n    border-radius: 50%;\n  }\n`\n\nconst StyledExpandButton = styled.div`\n  width: 32px;\n  height: 32px;\n  border-radius: var(--border-radius-m);\n  display: flex;\n  justify-content: center;\n  align-items: center;\n  cursor: pointer;\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-highest-hover);\n  }\n\n  &.open {\n    background-color: transparent;\n  }\n`\n\nconst StyledExpandIcon = styled(Icon)`\n  transition: rotate 0.2s;\n`\n\nexport interface EnumTemplateProps extends React.HTMLAttributes<HTMLSpanElement> {\n  selectedOptions: AttributeEnumItem[]\n  placeholder?: string\n  hasMultipleValues?: boolean\n  isMultiSelect?: boolean\n  isOpen?: boolean\n  isItem?: boolean\n  isSelected?: boolean\n  isReadOnly?: boolean\n  pt?: {\n    icon?: Partial<IconProps>\n    img?: Partial<React.ImgHTMLAttributes<HTMLImageElement>>\n    value?: Partial<React.ImgHTMLAttributes<HTMLSpanElement>>\n    expand?: Partial<IconProps>\n    close?: Partial<IconProps>\n  }\n}\n\nexport const EnumCellValue = ({\n  selectedOptions,\n  placeholder,\n  hasMultipleValues,\n  isMultiSelect,\n  isOpen,\n  isItem,\n  isSelected,\n  isReadOnly,\n  className,\n  pt,\n  ...props\n}: EnumTemplateProps) => {\n  // Destructure pt subprops and their relevant props at the top\n  const {\n    icon: ptIcon = {},\n    img: ptImg = {},\n    value: ptValue = {},\n    expand: ptExpand = {},\n    close: ptClose = {},\n  } = pt || {}\n\n  const { style: iconStyle, className: iconClassName, ...iconRest } = ptIcon\n  const { style: imgStyle, className: imgClassName, ...imgRest } = ptImg\n  const { style: valueStyle, className: valueClassName, ...valueRest } = ptValue\n  const { style: expandStyle, className: expandClassName, ...expandRest } = ptExpand\n  const { style: closeStyle, className: closeClassName, ...closeRest } = ptClose\n\n  // Check if all options have icons\n  const allOptionsHaveIcon = selectedOptions.every((option) => option.icon)\n\n  // Determine if we should show labels based on the requirements\n  const showLabels = !hasMultipleValues || !allOptionsHaveIcon\n  // Show the colors be backgrounds instead of the text\n  const backgroundColor = !allOptionsHaveIcon && isMultiSelect && !isItem\n\n  const isPlaceholder = !selectedOptions.length && placeholder\n  if (isPlaceholder) {\n    selectedOptions = [\n      {\n        label: placeholder,\n        value: '',\n      },\n    ]\n  }\n\n  return (\n    <StyledWidget className={clsx(className, { selected: isSelected, item: isItem })} {...props}>\n      <StyledValuesContainer>\n        {selectedOptions.map((option, i) => (\n          <StyledValueWrapper key={option.value.toString() + i}>\n            {option.icon && checkForImgSrc(option.icon) ? (\n              <StyledImg\n                src={option.icon}\n                className={clsx({ avatar: checkAvatarImg(option.icon) }, imgClassName)}\n                style={imgStyle}\n                data-tooltip={option.label}\n                {...imgRest}\n              />\n            ) : option.icon ? (\n              <Icon\n                icon={option.icon}\n                style={{ color: option.color, ...iconStyle }}\n                className={iconClassName}\n                {...iconRest}\n              />\n            ) : null}\n\n            {(showLabels || !option.icon) && (\n              <StyledValue\n                style={{\n                  color: backgroundColor ? 'inherit' : option.color,\n                  backgroundColor: backgroundColor\n                    ? option.color || 'var(--md-sys-color-surface-container)'\n                    : 'transparent',\n                  ...valueStyle,\n                }}\n                className={clsx({ placeholder: isPlaceholder }, valueClassName)}\n                aria-label={option.label}\n                {...valueRest}\n              >\n                {option.label}\n              </StyledValue>\n            )}\n          </StyledValueWrapper>\n        ))}\n      </StyledValuesContainer>\n      {!isItem && !isReadOnly && (\n        <StyledExpandButton\n          className={clsx('expand', EDIT_TRIGGER_CLASS, { open: isOpen }, expandClassName)}\n        >\n          <StyledExpandIcon\n            icon=\"expand_more\"\n            style={{ rotate: isOpen ? '180deg' : '0', ...expandStyle }}\n            aria-label=\"Expand options\"\n            {...expandRest}\n          />\n        </StyledExpandButton>\n      )}\n      {isItem && isSelected && isMultiSelect && (\n        <Icon\n          icon=\"close\"\n          style={{ marginLeft: 'auto', marginRight: 4, ...closeStyle }}\n          aria-label=\"Deselect item\"\n          className={clsx('close', closeClassName)}\n          {...closeRest}\n        />\n      )}\n    </StyledWidget>\n  )\n}\n\n// Helper functions to check if the icon is a valid image source\nconst checkForImgSrc = (icon: string | undefined = ''): boolean => {\n  return (\n    icon.startsWith('/') ||\n    icon.startsWith('./') ||\n    icon.startsWith('../') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('https://')\n  )\n}\n\nconst checkAvatarImg = (src: string): boolean => src.includes('avatar')\n"],"names":["EDIT_TRIGGER_CLASS","StyledWidget","styled","StyledValuesContainer","StyledValueWrapper","StyledValue","StyledImg","StyledExpandButton","StyledExpandIcon","Icon","EnumCellValue","selectedOptions","placeholder","hasMultipleValues","isMultiSelect","isOpen","isItem","isSelected","isReadOnly","className","pt","props","ptIcon","ptImg","ptValue","ptExpand","ptClose","iconStyle","iconClassName","iconRest","imgStyle","imgClassName","imgRest","valueStyle","valueClassName","valueRest","expandStyle","expandClassName","expandRest","closeStyle","closeClassName","closeRest","allOptionsHaveIcon","option","showLabels","backgroundColor","isPlaceholder","jsxs","clsx","jsx","i","checkForImgSrc","checkAvatarImg","icon","src"],"mappings":";;;;AAKA,MAAMA,IAAqB,gBAErBC,IAAeC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA2BtBC,IAAwBD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAU/BE,IAAqBF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAU5BG,IAAcH,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAcrBI,IAAYJ,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAUnBK,IAAqBL,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAkB5BM,IAAmBN,EAAOO,CAAI;AAAA;AAAA,GAsBvBC,KAAgB,CAAC;AAAA,EAC5B,iBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,eAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,YAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,IAAAC;AAAA,EACA,GAAGC;AACL,MAAyB;AAEjB,QAAA;AAAA,IACJ,MAAMC,IAAS,CAAC;AAAA,IAChB,KAAKC,IAAQ,CAAC;AAAA,IACd,OAAOC,IAAU,CAAC;AAAA,IAClB,QAAQC,IAAW,CAAC;AAAA,IACpB,OAAOC,IAAU,CAAA;AAAA,EACnB,IAAIN,KAAM,CAAC,GAEL,EAAE,OAAOO,GAAW,WAAWC,GAAe,GAAGC,MAAaP,GAC9D,EAAE,OAAOQ,GAAU,WAAWC,GAAc,GAAGC,MAAYT,GAC3D,EAAE,OAAOU,GAAY,WAAWC,GAAgB,GAAGC,MAAcX,GACjE,EAAE,OAAOY,GAAa,WAAWC,GAAiB,GAAGC,MAAeb,GACpE,EAAE,OAAOc,GAAY,WAAWC,GAAgB,GAAGC,MAAcf,GAGjEgB,IAAqB/B,EAAgB,MAAM,CAACgC,MAAWA,EAAO,IAAI,GAGlEC,IAAa,CAAC/B,KAAqB,CAAC6B,GAEpCG,IAAkB,CAACH,KAAsB5B,KAAiB,CAACE,GAE3D8B,IAAgB,CAACnC,EAAgB,UAAUC;AACjD,SAAIkC,MACgBnC,IAAA;AAAA,IAChB;AAAA,MACE,OAAOC;AAAA,MACP,OAAO;AAAA,IAAA;AAAA,EAEX,IAICmC,gBAAAA,EAAA,KAAA9C,GAAA,EAAa,WAAW+C,EAAK7B,GAAW,EAAE,UAAUF,GAAY,MAAMD,EAAA,CAAQ,GAAI,GAAGK,GACpF,UAAA;AAAA,IAAA4B,gBAAAA,EAAAA,IAAC9C,KACE,UAAgBQ,EAAA,IAAI,CAACgC,GAAQO,6BAC3B9C,GACE,EAAA,UAAA;AAAA,MAAAuC,EAAO,QAAQQ,EAAeR,EAAO,IAAI,IACxCM,gBAAAA,EAAA;AAAA,QAAC3C;AAAA,QAAA;AAAA,UACC,KAAKqC,EAAO;AAAA,UACZ,WAAWK,EAAK,EAAE,QAAQI,EAAeT,EAAO,IAAI,EAAE,GAAGZ,CAAY;AAAA,UACrE,OAAOD;AAAA,UACP,gBAAca,EAAO;AAAA,UACpB,GAAGX;AAAA,QAAA;AAAA,MAAA,IAEJW,EAAO,OACTM,gBAAAA,EAAA;AAAA,QAACxC;AAAA,QAAA;AAAA,UACC,MAAMkC,EAAO;AAAA,UACb,OAAO,EAAE,OAAOA,EAAO,OAAO,GAAGhB,EAAU;AAAA,UAC3C,WAAWC;AAAA,UACV,GAAGC;AAAA,QAAA;AAAA,MAAA,IAEJ;AAAA,OAEFe,KAAc,CAACD,EAAO,SACtBM,gBAAAA,EAAA;AAAA,QAAC5C;AAAA,QAAA;AAAA,UACC,OAAO;AAAA,YACL,OAAOwC,IAAkB,YAAYF,EAAO;AAAA,YAC5C,iBAAiBE,IACbF,EAAO,SAAS,0CAChB;AAAA,YACJ,GAAGV;AAAA,UACL;AAAA,UACA,WAAWe,EAAK,EAAE,aAAaF,EAAA,GAAiBZ,CAAc;AAAA,UAC9D,cAAYS,EAAO;AAAA,UAClB,GAAGR;AAAA,UAEH,UAAOQ,EAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IACV,EAAA,GAhCqBA,EAAO,MAAM,SAAA,IAAaO,CAkCnD,CACD,GACH;AAAA,IACC,CAAClC,KAAU,CAACE,KACX+B,gBAAAA,EAAA;AAAA,MAAC1C;AAAA,MAAA;AAAA,QACC,WAAWyC,EAAK,UAAUhD,GAAoB,EAAE,MAAMe,KAAUsB,CAAe;AAAA,QAE/E,UAAAY,gBAAAA,EAAA;AAAA,UAACzC;AAAA,UAAA;AAAA,YACC,MAAK;AAAA,YACL,OAAO,EAAE,QAAQO,IAAS,WAAW,KAAK,GAAGqB,EAAY;AAAA,YACzD,cAAW;AAAA,YACV,GAAGE;AAAA,UAAA;AAAA,QAAA;AAAA,MACN;AAAA,IACF;AAAA,IAEDtB,KAAUC,KAAcH,KACvBmC,gBAAAA,EAAA;AAAA,MAACxC;AAAA,MAAA;AAAA,QACC,MAAK;AAAA,QACL,OAAO,EAAE,YAAY,QAAQ,aAAa,GAAG,GAAG8B,EAAW;AAAA,QAC3D,cAAW;AAAA,QACX,WAAWS,EAAK,SAASR,CAAc;AAAA,QACtC,GAAGC;AAAA,MAAA;AAAA,IAAA;AAAA,EACN,GAEJ;AAEJ,GAGMU,IAAiB,CAACE,IAA2B,OAE/CA,EAAK,WAAW,GAAG,KACnBA,EAAK,WAAW,IAAI,KACpBA,EAAK,WAAW,KAAK,KACrBA,EAAK,WAAW,SAAS,KACzBA,EAAK,WAAW,UAAU,GAIxBD,IAAiB,CAACE,MAAyBA,EAAI,SAAS,QAAQ;"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumWidget.cjs.js

@@ -1,5 +1,5 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const d=require("../../../../../_virtual/jsx-runtime.cjs.js"),M=require("@ynput/ayon-react-components"),E=require("clsx"),i=require("react"),b=require("styled-components"),S=require("./EnumCellValue.cjs.js"),D=b(M.Dropdown)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const h=require("../../../../../_virtual/jsx-runtime.cjs.js"),V=require("@ynput/ayon-react-components"),E=require("clsx"),i=require("react"),A=require("styled-components"),S=require("./EnumCellValue.cjs.js"),b=A(V.Dropdown)`
   height: 100%;
   width: 100%;
-`,T=i.forwardRef(({value:R,isEditing:h,options:o,type:t,autoOpen:j=!0,isReadOnly:m,enableCustomValues:x,onOpen:_,onChange:v,onCancelEdit:w,onNext:k,pt:l,...u},A)=>{var C;const g=R.map(e=>e==null?void 0:e.toString()).filter(e=>!!e);let c=o.filter(e=>g.includes(e.value.toString()));g.forEach(e=>{o.find(s=>s.value===e)||(c=[...c,{label:e,value:e,color:x?"var(--md-sys-color-surface-container)":"var(--md-sys-color-error)",icon:x?void 0:"warning"}])});const O=c.length>1,a=i.useRef(null),[N,q]=i.useState(!1);i.useEffect(()=>{var e;h&&a.current&&j?(!a.current.isOpen&&((e=a.current)==null||e.open()),q(!0)):q(!1)},[h,a.current,j]),i.useEffect(()=>{var e;if(N&&!u.search){const s=(e=a.current)==null?void 0:e.getOptions(),r=s==null?void 0:s.querySelector("li");r&&(r.focus(),r.style.outline="none")}},[N,u.search]);const f=!!(t!=null&&t.includes("list")),V=e=>{const s=x?e:e.filter(r=>o.find(n=>n.value===r));t!=null&&t.includes("list")?v(s,"Click"):v(s[0],"Click")};return h?d.jsxRuntimeExports.jsx(D,{options:o,value:g,ref:a,valueTemplate:(e,s,r)=>{var n;return d.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:c,hasMultipleValues:s.length>1,isOpen:r,isReadOnly:m,isMultiSelect:f,...l==null?void 0:l.template,placeholder:u.placeholder,className:E("enum-dropdown-value",(n=l==null?void 0:l.template)==null?void 0:n.className)})},itemTemplate:(e,s,r)=>{var n;return d.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:[e],hasMultipleValues:!1,isOpen:!1,isItem:!0,isMultiSelect:f,isSelected:r,...l==null?void 0:l.template,className:E("enum-dropdown-item",(n=l==null?void 0:l.template)==null?void 0:n.className)})},widthExpand:!0,multiSelect:f,disableOpen:m,disabled:m,sortBySelected:!0,...u,onChange:V,onClose:w}):d.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:c,hasMultipleValues:O,isMultiSelect:f,isReadOnly:m,...l==null?void 0:l.template,placeholder:u.placeholder,className:E("enum-value",(C=l==null?void 0:l.template)==null?void 0:C.className,u.className)})});exports.EnumWidget=T;
+`,D=i.forwardRef(({value:w,isEditing:x,options:o,type:t,autoOpen:j=!0,isReadOnly:m,enableCustomValues:f,onOpen:T,onChange:v,onCancelEdit:C,onNext:_,pt:l,...a},k)=>{var R;const g=w.map(e=>e==null?void 0:e.toString()).filter(e=>!!e);let c=o.filter(e=>g.includes(e.value.toString()));g.forEach(e=>{o.find(s=>s.value===e)||(c=[...c,{label:e,value:e,color:f?"var(--md-sys-color-surface-container)":"var(--md-sys-color-error)",icon:f?void 0:"warning"}])});const O=c.length>1,u=i.useRef(null),[N,q]=i.useState(!1);i.useEffect(()=>{var e;x&&u.current&&j?(!u.current.isOpen&&((e=u.current)==null||e.open()),q(!0)):q(!1)},[x,u.current,j]),i.useEffect(()=>{var e;if(N&&!a.search){const s=(e=u.current)==null?void 0:e.getOptions(),r=s==null?void 0:s.querySelector("li");r&&(r.focus(),r.style.outline="none")}},[N,a.search]);const d=!!(t!=null&&t.includes("list")),M=e=>{let s=f?e:e.filter(r=>o.find(n=>n.value===r));t!=null&&t.includes("list")||(s=Array.isArray(s)?s[0]:s),v(s,"Click")};return x?h.jsxRuntimeExports.jsx(b,{options:o,value:g,ref:u,valueTemplate:(e,s,r)=>{var n;return h.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:c,hasMultipleValues:s.length>1,isOpen:r,isReadOnly:m,isMultiSelect:d,...l==null?void 0:l.template,placeholder:a.placeholder,className:E("enum-dropdown-value",(n=l==null?void 0:l.template)==null?void 0:n.className)})},itemTemplate:(e,s,r)=>{var n;return h.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:[e],hasMultipleValues:!1,isOpen:!1,isItem:!0,isMultiSelect:d,isSelected:r,...l==null?void 0:l.template,className:E("enum-dropdown-item",(n=l==null?void 0:l.template)==null?void 0:n.className)})},widthExpand:!0,multiSelect:d,disableOpen:m,disabled:m,sortBySelected:!0,...a,onChange:M,onClose:C,editable:f}):h.jsxRuntimeExports.jsx(S.EnumCellValue,{selectedOptions:c,hasMultipleValues:O,isMultiSelect:d,isReadOnly:m,...l==null?void 0:l.template,placeholder:a.placeholder,className:E("enum-value",(R=l==null?void 0:l.template)==null?void 0:R.className,a.className)})});exports.EnumWidget=D;
 //# sourceMappingURL=EnumWidget.cjs.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport { WidgetBaseProps } from './CellWidget'\nimport { AttributeData, AttributeEnumItem } from '../types'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\n\nconst StyledDropdown = styled(Dropdown)`\n  height: 100%;\n  width: 100%;\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: AttributeEnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        selectedOptions = [\n          ...selectedOptions,\n          {\n            label: val,\n            value: val,\n            color: enableCustomValues\n              ? 'var(--md-sys-color-surface-container)'\n              : 'var(--md-sys-color-error)',\n            icon: enableCustomValues ? undefined : 'warning',\n          },\n        ]\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (value: string[]) => {\n      const filteredValue = enableCustomValues\n        ? value\n        : value.filter((v) => options.find((o) => o.value === v))\n\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // take first value as the type is not list]\n        onChange(filteredValue[0], 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={options}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          {...dropdownProps}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","val","hasMultipleValues","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","_a","optionsUlEl","firstItem","isMultiSelect","handleChange","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}
+{"version":3,"file":"EnumWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport type { WidgetBaseProps } from './CellWidget'\nimport { AttributeData, AttributeEnumItem } from '../types'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\n\nconst StyledDropdown = styled(Dropdown)`\n  height: 100%;\n  width: 100%;\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: AttributeEnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        selectedOptions = [\n          ...selectedOptions,\n          {\n            label: val,\n            value: val,\n            color: enableCustomValues\n              ? 'var(--md-sys-color-surface-container)'\n              : 'var(--md-sys-color-error)',\n            icon: enableCustomValues ? undefined : 'warning',\n          },\n        ]\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (value: string[]) => {\n      let filteredValue: string | string[] = enableCustomValues\n        ? value\n        : value.filter((v) => options.find((o) => o.value === v))\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // check if the value is an array or a string and for arrays take the first value only\n        filteredValue = Array.isArray(filteredValue) ? filteredValue[0] : filteredValue\n\n        // take first value as the type is not list]\n        onChange(filteredValue, 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={options}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          {...dropdownProps}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n          editable={enableCustomValues}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","val","hasMultipleValues","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","_a","optionsUlEl","firstItem","isMultiSelect","handleChange","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumWidget.es.js

@@ -1,91 +1,91 @@
-import { j as f } from "../../../../../_virtual/jsx-runtime.es.js";
-import { Dropdown as _ } from "@ynput/ayon-react-components";
+import { j as d } from "../../../../../_virtual/jsx-runtime.es.js";
+import { Dropdown as k } from "@ynput/ayon-react-components";
 import S from "clsx";
-import { forwardRef as k, useRef as A, useState as I, useEffect as M } from "react";
-import T from "styled-components";
+import { forwardRef as C, useRef as I, useState as T, useEffect as A } from "react";
+import V from "styled-components";
 import { EnumCellValue as g } from "./EnumCellValue.es.js";
-const b = T(_)`
+const b = V(k)`
   height: 100%;
   width: 100%;
-`, K = k(
+`, K = C(
   ({
-    value: C,
-    isEditing: d,
+    value: M,
+    isEditing: h,
     options: o,
     type: c,
     autoOpen: N = !0,
     isReadOnly: u,
-    enableCustomValues: h,
+    enableCustomValues: m,
     onOpen: q,
     onChange: v,
     onCancelEdit: D,
     onNext: B,
     pt: l,
-    ...n
+    ...t
   }, R) => {
     var O;
-    const x = C.map((e) => e == null ? void 0 : e.toString()).filter((e) => !!e);
-    let i = o.filter(
+    const x = M.map((e) => e == null ? void 0 : e.toString()).filter((e) => !!e);
+    let n = o.filter(
       (e) => x.includes(e.value.toString())
     );
     x.forEach((e) => {
-      o.find((r) => r.value === e) || (i = [
-        ...i,
+      o.find((r) => r.value === e) || (n = [
+        ...n,
         {
           label: e,
           value: e,
-          color: h ? "var(--md-sys-color-surface-container)" : "var(--md-sys-color-error)",
-          icon: h ? void 0 : "warning"
+          color: m ? "var(--md-sys-color-surface-container)" : "var(--md-sys-color-error)",
+          icon: m ? void 0 : "warning"
         }
       ]);
     });
-    const E = i.length > 1, t = A(null), [j, w] = I(!1);
-    M(() => {
+    const E = n.length > 1, i = I(null), [j, w] = T(!1);
+    A(() => {
       var e;
-      d && t.current && N ? (!t.current.isOpen && ((e = t.current) == null || e.open()), w(!0)) : w(!1);
-    }, [d, t.current, N]), M(() => {
+      h && i.current && N ? (!i.current.isOpen && ((e = i.current) == null || e.open()), w(!0)) : w(!1);
+    }, [h, i.current, N]), A(() => {
       var e;
-      if (j && !n.search) {
-        const r = (e = t.current) == null ? void 0 : e.getOptions(), s = r == null ? void 0 : r.querySelector("li");
+      if (j && !t.search) {
+        const r = (e = i.current) == null ? void 0 : e.getOptions(), s = r == null ? void 0 : r.querySelector("li");
         s && (s.focus(), s.style.outline = "none");
       }
-    }, [j, n.search]);
-    const m = !!(c != null && c.includes("list")), V = (e) => {
-      const r = h ? e : e.filter((s) => o.find((a) => a.value === s));
-      c != null && c.includes("list") ? v(r, "Click") : v(r[0], "Click");
+    }, [j, t.search]);
+    const f = !!(c != null && c.includes("list")), _ = (e) => {
+      let r = m ? e : e.filter((s) => o.find((a) => a.value === s));
+      c != null && c.includes("list") || (r = Array.isArray(r) ? r[0] : r), v(r, "Click");
     };
-    return d ? /* @__PURE__ */ f.jsx(
+    return h ? /* @__PURE__ */ d.jsx(
       b,
       {
         options: o,
         value: x,
-        ref: t,
+        ref: i,
         valueTemplate: (e, r, s) => {
           var a;
-          return /* @__PURE__ */ f.jsx(
+          return /* @__PURE__ */ d.jsx(
             g,
             {
-              selectedOptions: i,
+              selectedOptions: n,
               hasMultipleValues: r.length > 1,
               isOpen: s,
               isReadOnly: u,
-              isMultiSelect: m,
+              isMultiSelect: f,
               ...l == null ? void 0 : l.template,
-              placeholder: n.placeholder,
+              placeholder: t.placeholder,
               className: S("enum-dropdown-value", (a = l == null ? void 0 : l.template) == null ? void 0 : a.className)
             }
           );
         },
         itemTemplate: (e, r, s) => {
           var a;
-          return /* @__PURE__ */ f.jsx(
+          return /* @__PURE__ */ d.jsx(
             g,
             {
               selectedOptions: [e],
               hasMultipleValues: !1,
               isOpen: !1,
               isItem: !0,
-              isMultiSelect: m,
+              isMultiSelect: f,
               isSelected: s,
               ...l == null ? void 0 : l.template,
               className: S("enum-dropdown-item", (a = l == null ? void 0 : l.template) == null ? void 0 : a.className)
@@ -93,24 +93,25 @@ const b = T(_)`
           );
         },
         widthExpand: !0,
-        multiSelect: m,
+        multiSelect: f,
         disableOpen: u,
         disabled: u,
         sortBySelected: !0,
-        ...n,
-        onChange: V,
-        onClose: D
+        ...t,
+        onChange: _,
+        onClose: D,
+        editable: m
       }
-    ) : /* @__PURE__ */ f.jsx(
+    ) : /* @__PURE__ */ d.jsx(
       g,
       {
-        selectedOptions: i,
+        selectedOptions: n,
         hasMultipleValues: E,
-        isMultiSelect: m,
+        isMultiSelect: f,
         isReadOnly: u,
         ...l == null ? void 0 : l.template,
-        placeholder: n.placeholder,
-        className: S("enum-value", (O = l == null ? void 0 : l.template) == null ? void 0 : O.className, n.className)
+        placeholder: t.placeholder,
+        className: S("enum-value", (O = l == null ? void 0 : l.template) == null ? void 0 : O.className, t.className)
       }
     );
   }

package/dist/shared/src/containers/ProjectTreeTable/widgets/EnumWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"EnumWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport { WidgetBaseProps } from './CellWidget'\nimport { AttributeData, AttributeEnumItem } from '../types'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\n\nconst StyledDropdown = styled(Dropdown)`\n  height: 100%;\n  width: 100%;\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: AttributeEnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        selectedOptions = [\n          ...selectedOptions,\n          {\n            label: val,\n            value: val,\n            color: enableCustomValues\n              ? 'var(--md-sys-color-surface-container)'\n              : 'var(--md-sys-color-error)',\n            icon: enableCustomValues ? undefined : 'warning',\n          },\n        ]\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (value: string[]) => {\n      const filteredValue = enableCustomValues\n        ? value\n        : value.filter((v) => options.find((o) => o.value === v))\n\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // take first value as the type is not list]\n        onChange(filteredValue[0], 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={options}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          {...dropdownProps}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","val","hasMultipleValues","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","_a","optionsUlEl","firstItem","isMultiSelect","handleChange","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}
+{"version":3,"file":"EnumWidget.es.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/EnumWidget.tsx"],"sourcesContent":["import { Dropdown, DropdownProps, DropdownRef } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, useEffect, useRef, useState } from 'react'\nimport styled from 'styled-components'\nimport type { WidgetBaseProps } from './CellWidget'\nimport { AttributeData, AttributeEnumItem } from '../types'\nimport { EnumCellValue, EnumTemplateProps } from './EnumCellValue'\n\nconst StyledDropdown = styled(Dropdown)`\n  height: 100%;\n  width: 100%;\n`\n\nexport interface EnumWidgetProps\n  extends Omit<DropdownProps, 'onChange' | 'value'>,\n    WidgetBaseProps {\n  value: (string | number | boolean)[]\n  options: AttributeEnumItem[]\n  type?: AttributeData['type']\n  autoOpen?: boolean\n  isReadOnly?: boolean\n  enableCustomValues?: boolean\n  pt?: {\n    template?: Partial<EnumTemplateProps>\n  }\n  onOpen?: () => void\n  onNext?: () => void\n}\n\nexport const EnumWidget = forwardRef<HTMLDivElement, EnumWidgetProps>(\n  (\n    {\n      value,\n      isEditing,\n      options,\n      type,\n      autoOpen = true,\n      isReadOnly,\n      enableCustomValues,\n      onOpen,\n      onChange,\n      onCancelEdit,\n      onNext,\n      pt,\n      ...dropdownProps\n    },\n    _ref,\n  ) => {\n    // convert value to string array\n    const valueAsStrings = value.map((v) => v?.toString()).filter((v) => !!v)\n    let selectedOptions = options.filter((option) =>\n      valueAsStrings.includes(option.value.toString()),\n    )\n\n    // Check if all values are present in options, if not, add a warning\n    valueAsStrings.forEach((val) => {\n      if (!options.find((option) => option.value === val)) {\n        selectedOptions = [\n          ...selectedOptions,\n          {\n            label: val,\n            value: val,\n            color: enableCustomValues\n              ? 'var(--md-sys-color-surface-container)'\n              : 'var(--md-sys-color-error)',\n            icon: enableCustomValues ? undefined : 'warning',\n          },\n        ]\n      }\n    })\n    const hasMultipleValues = selectedOptions.length > 1\n\n    const dropdownRef = useRef<DropdownRef>(null)\n\n    const [dropdownOpen, setDropdownOpen] = useState(false)\n    useEffect(() => {\n      if (isEditing && dropdownRef.current && autoOpen) {\n        !dropdownRef.current.isOpen && dropdownRef.current?.open()\n        setDropdownOpen(true)\n      } else {\n        setDropdownOpen(false)\n      }\n    }, [isEditing, dropdownRef.current, autoOpen])\n\n    // when the dropdown is open, focus the first item\n    useEffect(() => {\n      if (dropdownOpen && !dropdownProps.search) {\n        const optionsUlEl = dropdownRef.current?.getOptions() as HTMLUListElement\n        const firstItem = optionsUlEl?.querySelector('li')\n        if (firstItem) {\n          firstItem.focus()\n          // set style of li to have no outline (no focus ring)\n          firstItem.style.outline = 'none'\n        }\n      }\n    }, [dropdownOpen, dropdownProps.search])\n\n    const isMultiSelect = !!type?.includes('list')\n\n    const handleChange = (value: string[]) => {\n      let filteredValue: string | string[] = enableCustomValues\n        ? value\n        : value.filter((v) => options.find((o) => o.value === v))\n      if (type?.includes('list')) {\n        onChange(filteredValue, 'Click')\n      } else {\n        // check if the value is an array or a string and for arrays take the first value only\n        filteredValue = Array.isArray(filteredValue) ? filteredValue[0] : filteredValue\n\n        // take first value as the type is not list]\n        onChange(filteredValue, 'Click')\n      }\n    }\n\n    if (isEditing) {\n      return (\n        <StyledDropdown\n          options={options}\n          value={valueAsStrings}\n          ref={dropdownRef}\n          valueTemplate={(_value, selected, isOpen) => (\n            <EnumCellValue\n              selectedOptions={selectedOptions}\n              hasMultipleValues={selected.length > 1}\n              isOpen={isOpen}\n              isReadOnly={isReadOnly}\n              isMultiSelect={isMultiSelect}\n              {...pt?.template}\n              placeholder={dropdownProps.placeholder}\n              className={clsx('enum-dropdown-value', pt?.template?.className)}\n            />\n          )}\n          itemTemplate={(option, _isActive, isSelected) => (\n            <EnumCellValue\n              selectedOptions={[option]}\n              hasMultipleValues={false}\n              isOpen={false}\n              isItem\n              isMultiSelect={isMultiSelect}\n              isSelected={isSelected}\n              {...pt?.template}\n              className={clsx('enum-dropdown-item', pt?.template?.className)}\n            />\n          )}\n          widthExpand\n          multiSelect={isMultiSelect}\n          disableOpen={isReadOnly}\n          disabled={isReadOnly}\n          sortBySelected\n          {...dropdownProps}\n          onChange={handleChange}\n          onClose={onCancelEdit}\n          editable={enableCustomValues}\n        />\n      )\n    }\n\n    return (\n      <EnumCellValue\n        selectedOptions={selectedOptions}\n        hasMultipleValues={hasMultipleValues}\n        isMultiSelect={isMultiSelect}\n        isReadOnly={isReadOnly}\n        {...pt?.template}\n        placeholder={dropdownProps.placeholder}\n        className={clsx('enum-value', pt?.template?.className, dropdownProps.className)}\n      />\n    )\n  },\n)\n"],"names":["StyledDropdown","styled","Dropdown","EnumWidget","forwardRef","value","isEditing","options","type","autoOpen","isReadOnly","enableCustomValues","onOpen","onChange","onCancelEdit","onNext","pt","dropdownProps","_ref","valueAsStrings","v","selectedOptions","option","val","hasMultipleValues","dropdownRef","useRef","dropdownOpen","setDropdownOpen","useState","useEffect","_a","optionsUlEl","firstItem","isMultiSelect","handleChange","filteredValue","o","jsx","_value","selected","isOpen","EnumCellValue","clsx","_isActive","isSelected"],"mappings":"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"}

package/dist/shared/src/containers/ProjectTreeTable/widgets/LinksWidget.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("../../../../../_virtual/jsx-runtime.cjs.js");require("@ynput/ayon-react-components");require("clsx");require("../../../components/ThumbnailSimple/ThumbnailSimple.cjs.js");require("../../../components/EmptyPlaceholder/EmptyPlaceholder.cjs.js");require("../../../components/EmptyPlaceholder/EmptyPlaceholderFlex.styled.cjs.js");require("react-toastify");require("../../../api/base/client.cjs.js");require("../../../api/generated/graphql.cjs.js");require("../../../api/generated/graphqlLinks.cjs.js");require("../../../api/generated/access.cjs.js");require("../../../api/generated/actions.cjs.js");require("../../../api/generated/activityFeed.cjs.js");require("../../../api/generated/addons.cjs.js");require("../../../api/generated/anatomy.cjs.js");require("../../../api/generated/attributes.cjs.js");require("../../../api/generated/authentication.cjs.js");require("../../../api/generated/bundles.cjs.js");require("../../../api/generated/configuration.cjs.js");require("../../../api/generated/desktop.cjs.js");require("../../../api/generated/entityLists.cjs.js");require("../../../api/generated/events.cjs.js");require("../../../api/generated/files.cjs.js");require("../../../api/generated/folders.cjs.js");require("../../../api/generated/inbox.cjs.js");require("../../../api/generated/links.cjs.js");require("../../../api/generated/market.cjs.js");require("../../../api/generated/onboarding.cjs.js");require("../../../api/generated/operations.cjs.js");require("../../../api/generated/products.cjs.js");require("../../../api/generated/projectDashboard.cjs.js");require("../../../api/generated/projects.cjs.js");require("../../../api/generated/reviewables.cjs.js");require("../../../api/generated/services.cjs.js");require("../../../api/generated/system.cjs.js");require("../../../api/generated/tasks.cjs.js");require("../../../api/generated/teams.cjs.js");require("../../../api/generated/thumbnails.cjs.js");require("../../../api/generated/uRIs.cjs.js");require("../../../api/generated/users.cjs.js");require("../../../api/generated/versions.cjs.js");require("../../../api/generated/workfiles.cjs.js");require("../../../api/generated/ynputCloud.cjs.js");require("../../../api/generated/grouping.cjs.js");require("../../../api/generated/views.cjs.js");require("../../../api/queries/actions/getActions.cjs.js");require("../../../api/queries/activities/getActivities.cjs.js");require("../../../api/queries/activities/updateActivities.cjs.js");require("../../../api/queries/activities/updateReaction.cjs.js");require("../../../api/queries/activities/getMentions.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/project/getProject.cjs.js");require("../../../api/queries/project/updateProject.cjs.js");require("../../../api/queries/review/getReview.cjs.js");require("../../../api/queries/review/updateReview.cjs.js");require("../../../api/queries/share/share.cjs.js");require("../../../api/queries/system/getSystem.cjs.js");require("../../../api/queries/userDashboard/getUserDashboard.cjs.js");require("../../../api/queries/users/getUsers.cjs.js");require("../../../api/queries/users/updateUsers.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("react");require("@dnd-kit/core");require("@dnd-kit/sortable");require("../../../components/ReviewablesList/ReviewablesList.styled.cjs.js");require("../../ContextMenu/ContextMenuContext.cjs.js");;/* empty css                                      */require("lodash");require("uuid");require("../../../util/pubsub.cjs.js");require("../../../components/ReviewablesList/ReviewablesUpload.styled.cjs.js");require("axios");require("../../../context/RemoteModulesContext.cjs.js");require("../../../context/DetailsPanelContext.cjs.js");require("../../../context/ThumbnailUploaderContext.cjs.js");require("../../../context/SettingsPanelContext.cjs.js");require("../../../context/pip/PiPProvider.cjs.js");const x=require("react-dom");require("../../../context/pip/PiPWrapper.cjs.js");require("../../../context/AddonProjectContext.cjs.js");require("../../../context/AddonContext.cjs.js");require("../../../context/PowerpackContext.cjs.js");require("../../../context/MoveEntityContext.cjs.js");require("../../../components/ReviewableCard/ReviewableCard.cjs.js");require("../../../components/ReviewableProgressCard/ReviewableProgressCard.styled.cjs.js");require("../../../components/FileThumbnail/FileThumbnail.cjs.js");require("../../../components/Thumbnail/Thumbnail.styled.cjs.js");require("../../../components/Thumbnail/StackedThumbnails.cjs.js");require("../../Feed/context/FeedContext.cjs.js");require("../../Feed/components/Tooltips/UserTooltip/UserTooltip.styled.cjs.js");require("../../Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.cjs.js");require("../../Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js");require("../../Feed/components/FileUploadPreview/Mimes/TextMime.cjs.js");require("react-markdown");require("remark-emoji");require("remark-gfm");require("remark-directive");require("remark-directive-rehype");require("../../Feed/components/CommentInput/CommentInput.cjs.js");require("../../Feed/components/ReactionContainer/Reactions.styled.cjs.js");require("../../Feed/components/FilesGrid/FilesGrid.styled.cjs.js");require("../../Feed/components/FileUploadCard/FileUploadCard.styled.cjs.js");require("../../Feed/components/CommentInput/quillToMarkdown.cjs.js");require("../../Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("../../Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("react-router-dom");require("../../Feed/components/ActivityStatus/ActivityStatus.cjs.js");require("../../Feed/components/ActivityHeader/ActivityHeader.styled.cjs.js");require("../../Feed/components/ActivityDate.cjs.js");require("../../Feed/components/ActivityStatusChange/ActivityStatusChange.styled.cjs.js");require("../../Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.cjs.js");require("../../Feed/components/ActivityVersions/ActivityVersions.styled.cjs.js");require("../../Feed/components/ActivityGroup/ActivityGroup.styled.cjs.js");require("../../Feed/Feed.styled.cjs.js");require("date-fns");require("../ProjectTreeTable.cjs.js");require("../context/CellEditingContext.cjs.js");require("@tanstack/react-table");require("./CollapsedWidget.cjs.js");require("./DateWidget.cjs.js");require("./EnumWidget.cjs.js");require("./TextWidget.cjs.js");require("./BooleanWidget.cjs.js");const E=require("./CellWidget.cjs.js");require("./EntityNameWidget.cjs.js");require("./GroupHeaderWidget.cjs.js");require("./ThumbnailWidget.cjs.js");const C=require("../../../components/LinksManager/LinksManagerDialog.cjs.js"),g=require("../context/DetailsPanelEntityContext.cjs.js"),R=require("../context/SelectedRowsContext.cjs.js");require("../ProjectTreeTable.styled.cjs.js");require("../components/SelectionCell.cjs.js");require("../components/RowSelectionHeader.cjs.js");require("../context/SelectionCellsContext.cjs.js");require("./LoadMoreWidget.cjs.js");require("../context/ProjectTableQueriesContext.cjs.js");require("../context/ProjectTableContext.cjs.js");require("../context/ClipboardContext.cjs.js");require("../context/ColumnSettingsContext.cjs.js");require("../../../../../_virtual/runtime.cjs.js");require("../../../../../_virtual/semver.cjs.js");require("react-redux");require("custom-protocol-check");require("../components/GroupSettingsFallback.cjs.js");require("../context/ProjectDataContext.cjs.js");require("../components/HeaderActionButton.cjs.js");require("../components/ColumnHeaderMenu.cjs.js");require("../../DetailsPanel/DetailsPanel.styled.cjs.js");require("../../DetailsPanel/FeedFilters/FeedFilters.styled.cjs.js");require("../../DetailsPanel/DetailsPanelHeader/DetailsPanelHeader.styled.cjs.js");require("../../../components/PlayableIcon/PlayableIcon.cjs.js");require("../../DetailsPanel/DetailsPanelFiles/DetailsPanelFiles.cjs.js");require("../../DetailsPanel/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.cjs.js");require("../../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");require("../../Actions/Actions.styled.cjs.js");require("../../Actions/ActionsDropdown/ActionsDropdown.cjs.js");require("../../Actions/ActionIcon.cjs.js");require("../../Views/context/ViewsContext.cjs.js");require("../../Views/Views.styled.cjs.js");require("../../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../Views/ViewsMenu/ViewsMenu.cjs.js");require("../../../components/EntityPanelUploader/EntityPanelUploader.styled.cjs.js");require("../../../components/SimpleFormDialog/SimpleFormDialog.cjs.js");require("../../../components/EntityPath/EntityPath.styled.cjs.js");require("../../../components/EntityPath/SegmentProvider.cjs.js");require("../../../components/DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../../../components/Watchers/Watchers.cjs.js");require("../../../components/ProjectTableSettings/ProjectTableSettings.cjs.js");require("../../../components/Powerpack/PowerpackButton.cjs.js");require("../../../components/Powerpack/PricingLink.cjs.js");require("../../../components/Powerpack/PowerpackDialog.styled.cjs.js");require("../../../components/Powerpack/CTAButton.cjs.js");require("../../../components/SettingsPanel/SettingsPanel.cjs.js");require("../../../components/SettingsPanel/SettingsPanelItemTemplate.cjs.js");require("../../../components/AttributeEditor/components/MinMaxField.cjs.js");require("../../../components/EnumEditor/EnumEditor.styled.cjs.js");require("../../../components/SearchFilter/filterDates.cjs.js");require("../../../components/Badge/Badge.cjs.js");require("../../../components/VersionUploader/components/UploadVersionDialog.cjs.js");require("../../../components/VersionUploader/context/VersionUploadContext.cjs.js");require("../../../components/Feedback/FeedbackContext.cjs.js");require("../../../components/Feedback/SupportBubble.cjs.js");const h=require("../../../components/Chips/Chips.cjs.js");require("../../../components/LinksManager/LinksManager.styled.cjs.js");require("../../EntityPickerDialog/EntityPickerDialog.cjs.js");const m=(e,i,u)=>{const t=i.split("|"),[n,s,c]=t;return e==="in"?u===c:u===s},T=({value:e,isEditing:i,cellId:u,projectName:t,disabled:n,folderId:s,onChange:c,onCancelEdit:p})=>{var a;let o,l;const y=[];try{const r=g.useDetailsPanelEntityContext();o=r.setSelectedEntity,r.selectedEntity&&y.push(r.selectedEntity.entityId)}catch{}try{l=R.useSelectedRowsContext().clearRowsSelection}catch{}const k=(r,d)=>{l&&l(),o?o({entityId:r,entityType:d}):console.log("Entity clicked:",r,d)};return q.jsxRuntimeExports.jsxs(q.jsxRuntimeExports.Fragment,{children:[q.jsxRuntimeExports.jsx(h.Chips,{values:((a=e==null?void 0:e.links)==null?void 0:a.map(r=>({label:r.label,tooltip:r.parents.join("/")+"/"+r.label})))||[],pt:{chip:{className:E.EDIT_TRIGGER_CLASS}},disabled:n}),i&&e&&x.createPortal(q.jsxRuntimeExports.jsx(C.LinksManagerDialog,{isEditing:i,anchorId:u,projectName:t,linkTypeLabel:e.link.label||"",links:e.links,direction:e.direction,entityId:e.entityId,entityType:e.entityType,targetEntityType:e.link.targetEntityType,linkType:e.link.linkType,selectedEntityIds:y,onClose:p,onEntityClick:k,disabled:n,folderId:s}),document.body)]})};exports.LinksWidget=T;exports.isLinkEditable=m;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const q=require("../../../../../_virtual/jsx-runtime.cjs.js");require("@ynput/ayon-react-components");require("clsx");require("../../../components/ThumbnailSimple/ThumbnailSimple.cjs.js");require("../../../components/EmptyPlaceholder/EmptyPlaceholder.cjs.js");require("../../../components/EmptyPlaceholder/EmptyPlaceholderFlex.styled.cjs.js");require("react-toastify");require("../../../api/base/client.cjs.js");require("../../../api/generated/graphql.cjs.js");require("../../../api/generated/graphqlLinks.cjs.js");require("../../../api/generated/access.cjs.js");require("../../../api/generated/actions.cjs.js");require("../../../api/generated/activityFeed.cjs.js");require("../../../api/generated/addons.cjs.js");require("../../../api/generated/anatomy.cjs.js");require("../../../api/generated/attributes.cjs.js");require("../../../api/generated/authentication.cjs.js");require("../../../api/generated/bundles.cjs.js");require("../../../api/generated/configuration.cjs.js");require("../../../api/generated/desktop.cjs.js");require("../../../api/generated/entityLists.cjs.js");require("../../../api/generated/events.cjs.js");require("../../../api/generated/files.cjs.js");require("../../../api/generated/folders.cjs.js");require("../../../api/generated/inbox.cjs.js");require("../../../api/generated/links.cjs.js");require("../../../api/generated/market.cjs.js");require("../../../api/generated/onboarding.cjs.js");require("../../../api/generated/operations.cjs.js");require("../../../api/generated/products.cjs.js");require("../../../api/generated/projectDashboard.cjs.js");require("../../../api/generated/projects.cjs.js");require("../../../api/generated/reviewables.cjs.js");require("../../../api/generated/services.cjs.js");require("../../../api/generated/system.cjs.js");require("../../../api/generated/tasks.cjs.js");require("../../../api/generated/teams.cjs.js");require("../../../api/generated/thumbnails.cjs.js");require("../../../api/generated/uRIs.cjs.js");require("../../../api/generated/users.cjs.js");require("../../../api/generated/versions.cjs.js");require("../../../api/generated/workfiles.cjs.js");require("../../../api/generated/ynputCloud.cjs.js");require("../../../api/generated/grouping.cjs.js");require("../../../api/generated/views.cjs.js");require("../../../api/queries/actions/getActions.cjs.js");require("../../../api/queries/activities/getActivities.cjs.js");require("../../../api/queries/activities/updateActivities.cjs.js");require("../../../api/queries/activities/updateReaction.cjs.js");require("../../../api/queries/activities/getMentions.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/project/getProject.cjs.js");require("../../../api/queries/project/updateProject.cjs.js");require("../../../api/queries/review/getReview.cjs.js");require("../../../api/queries/review/updateReview.cjs.js");require("../../../api/queries/share/share.cjs.js");require("../../../api/queries/system/getSystem.cjs.js");require("../../../api/queries/userDashboard/getUserDashboard.cjs.js");require("../../../api/queries/users/getUsers.cjs.js");require("../../../api/queries/users/updateUsers.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("react");require("@dnd-kit/core");require("@dnd-kit/sortable");require("../../../components/ReviewablesList/ReviewablesList.styled.cjs.js");require("../../ContextMenu/ContextMenuContext.cjs.js");;/* empty css                                      */require("lodash");require("uuid");require("../../../util/pubsub.cjs.js");require("../../../components/ReviewablesList/ReviewablesUpload.styled.cjs.js");require("axios");require("../../../context/RemoteModulesContext.cjs.js");require("../../../context/DetailsPanelContext.cjs.js");require("../../../context/ThumbnailUploaderContext.cjs.js");require("../../../context/SettingsPanelContext.cjs.js");require("../../../context/pip/PiPProvider.cjs.js");const x=require("react-dom");require("../../../context/pip/PiPWrapper.cjs.js");require("../../../context/AddonProjectContext.cjs.js");require("../../../context/AddonContext.cjs.js");require("../../../context/PowerpackContext.cjs.js");require("../../../context/MoveEntityContext.cjs.js");require("../../../components/ReviewableCard/ReviewableCard.cjs.js");require("../../../components/ReviewableProgressCard/ReviewableProgressCard.styled.cjs.js");require("../../../components/FileThumbnail/FileThumbnail.cjs.js");require("../../../components/Thumbnail/Thumbnail.styled.cjs.js");require("../../../components/Thumbnail/StackedThumbnails.cjs.js");require("../../Feed/context/FeedContext.cjs.js");require("../../Feed/components/Tooltips/UserTooltip/UserTooltip.styled.cjs.js");require("../../Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.cjs.js");require("../../Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js");require("../../Feed/components/FileUploadPreview/Mimes/TextMime.cjs.js");require("react-markdown");require("remark-emoji");require("remark-gfm");require("remark-directive");require("remark-directive-rehype");require("../../Feed/components/CommentInput/CommentInput.cjs.js");require("../../Feed/components/ReactionContainer/Reactions.styled.cjs.js");require("../../Feed/components/FilesGrid/FilesGrid.styled.cjs.js");require("../../Feed/components/FileUploadCard/FileUploadCard.styled.cjs.js");require("../../Feed/components/CommentInput/quillToMarkdown.cjs.js");require("../../Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("../../Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("react-router-dom");require("../../Feed/components/ActivityStatus/ActivityStatus.cjs.js");require("../../Feed/components/ActivityHeader/ActivityHeader.styled.cjs.js");require("../../Feed/components/ActivityDate.cjs.js");require("../../Feed/components/ActivityStatusChange/ActivityStatusChange.styled.cjs.js");require("../../Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.cjs.js");require("../../Feed/components/ActivityVersions/ActivityVersions.styled.cjs.js");require("../../Feed/components/ActivityGroup/ActivityGroup.styled.cjs.js");require("../../Feed/Feed.styled.cjs.js");require("date-fns");require("../ProjectTreeTable.cjs.js");require("../context/CellEditingContext.cjs.js");require("@tanstack/react-table");require("./CollapsedWidget.cjs.js");require("./DateWidget.cjs.js");require("./EnumWidget.cjs.js");require("./TextWidget.cjs.js");require("./BooleanWidget.cjs.js");const E=require("./CellWidget.cjs.js");require("./EntityNameWidget.cjs.js");require("./GroupHeaderWidget.cjs.js");require("./ThumbnailWidget.cjs.js");const C=require("../../../components/LinksManager/LinksManagerDialog.cjs.js"),g=require("../context/DetailsPanelEntityContext.cjs.js"),R=require("../context/SelectedRowsContext.cjs.js");require("../ProjectTreeTable.styled.cjs.js");require("../components/SelectionCell.cjs.js");require("../components/RowSelectionHeader.cjs.js");require("../context/SelectionCellsContext.cjs.js");require("./LoadMoreWidget.cjs.js");require("../context/ProjectTableQueriesContext.cjs.js");require("../context/ProjectTableContext.cjs.js");require("../context/ClipboardContext.cjs.js");require("../context/ColumnSettingsContext.cjs.js");require("../../../../../_virtual/runtime.cjs.js");require("../../../../../_virtual/semver.cjs.js");require("react-redux");require("custom-protocol-check");require("../components/GroupSettingsFallback.cjs.js");require("../context/ProjectDataContext.cjs.js");require("../components/HeaderActionButton.cjs.js");require("../components/ColumnHeaderMenu.cjs.js");require("../../DetailsPanel/DetailsPanel.styled.cjs.js");require("../../DetailsPanel/FeedFilters/FeedFilters.styled.cjs.js");require("../../DetailsPanel/DetailsPanelHeader/DetailsPanelHeader.styled.cjs.js");require("../../../components/PlayableIcon/PlayableIcon.cjs.js");require("../../DetailsPanel/DetailsPanelFiles/DetailsPanelFiles.cjs.js");require("../../DetailsPanel/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.cjs.js");require("../../DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");require("../../Actions/Actions.styled.cjs.js");require("../../Actions/ActionsDropdown/ActionsDropdown.cjs.js");require("../../Actions/ActionIcon.cjs.js");require("../../Views/context/ViewsContext.cjs.js");require("../../Views/Views.styled.cjs.js");require("../../Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../Views/ViewsMenu/ViewsMenu.cjs.js");require("../../../components/EntityPanelUploader/EntityPanelUploader.styled.cjs.js");require("../../../components/SimpleFormDialog/SimpleFormDialog.cjs.js");require("../../../components/EntityPath/EntityPath.styled.cjs.js");require("../../../components/EntityPath/SegmentProvider.cjs.js");require("../../../components/DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../../../components/Watchers/Watchers.cjs.js");require("../../../components/ProjectTableSettings/ProjectTableSettings.cjs.js");require("../../../components/Powerpack/PowerpackButton.cjs.js");require("../../../components/Powerpack/PricingLink.cjs.js");require("../../../components/Powerpack/PowerpackDialog.styled.cjs.js");require("../../../components/Powerpack/CTAButton.cjs.js");require("../../../components/Powerpack/RequiredPowerpackVersion.cjs.js");require("../../../components/SettingsPanel/SettingsPanel.cjs.js");require("../../../components/SettingsPanel/SettingsPanelItemTemplate.cjs.js");require("../../../components/AttributeEditor/components/MinMaxField.cjs.js");require("../../../components/EnumEditor/EnumEditor.styled.cjs.js");require("../../../components/SearchFilter/filterDates.cjs.js");require("../../../components/Badge/Badge.cjs.js");require("../../../components/VersionUploader/components/UploadVersionDialog.cjs.js");require("../../../components/VersionUploader/context/VersionUploadContext.cjs.js");require("../../../components/Feedback/FeedbackContext.cjs.js");require("../../../components/Feedback/SupportBubble.cjs.js");const h=require("../../../components/Chips/Chips.cjs.js");require("../../../components/LinksManager/LinksManager.styled.cjs.js");require("../../EntityPickerDialog/EntityPickerDialog.cjs.js");require("../../../components/DetailsMetaData/DetailsMetaData.cjs.js");require("../../../components/AccessUser/AccessUser.cjs.js");const m=(e,i,u)=>{const t=i.split("|"),[n,s,c]=t;return e==="in"?u===c:u===s},T=({value:e,isEditing:i,cellId:u,projectName:t,disabled:n,folderId:s,onChange:c,onCancelEdit:p})=>{var a;let o,l;const y=[];try{const r=g.useDetailsPanelEntityContext();o=r.setSelectedEntity,r.selectedEntity&&y.push(r.selectedEntity.entityId)}catch{}try{l=R.useSelectedRowsContext().clearRowsSelection}catch{}const k=(r,d)=>{l&&l(),o?o({entityId:r,entityType:d}):console.log("Entity clicked:",r,d)};return q.jsxRuntimeExports.jsxs(q.jsxRuntimeExports.Fragment,{children:[q.jsxRuntimeExports.jsx(h.Chips,{values:((a=e==null?void 0:e.links)==null?void 0:a.map(r=>({label:r.label,tooltip:r.parents.join("/")+"/"+r.label})))||[],pt:{chip:{className:E.EDIT_TRIGGER_CLASS}},disabled:n}),i&&e&&x.createPortal(q.jsxRuntimeExports.jsx(C.LinksManagerDialog,{isEditing:i,anchorId:u,projectName:t,linkTypeLabel:e.link.label||"",links:e.links,direction:e.direction,entityId:e.entityId,entityType:e.entityType,targetEntityType:e.link.targetEntityType,linkType:e.link.linkType,selectedEntityIds:y,onClose:p,onEntityClick:k,disabled:n,folderId:s}),document.body)]})};exports.LinksWidget=T;exports.isLinkEditable=m;
 //# sourceMappingURL=LinksWidget.cjs.js.map

package/dist/shared/src/containers/ProjectTreeTable/widgets/LinksWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"LinksWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/LinksWidget.tsx"],"sourcesContent":["import { Chips, ChipValue, LinkEntity } from '@shared/components'\nimport { LinksManagerDialog } from '@shared/components/LinksManager/LinksManagerDialog'\nimport { FC } from 'react'\nimport { EDIT_TRIGGER_CLASS, WidgetBaseProps } from './CellWidget'\nimport { createPortal } from 'react-dom'\nimport { useDetailsPanelEntityContext } from '../context/DetailsPanelEntityContext'\nimport { useSelectedRowsContext } from '../context/SelectedRowsContext'\n\nexport const isLinkEditable = (\n  direction: 'in' | 'out',\n  linkType: string,\n  entityType: string,\n): boolean => {\n  const linkTypeParts = linkType.split('|')\n  const [_name, outType, inType] = linkTypeParts\n  if (direction === 'in') {\n    return entityType === inType\n  } else {\n    return entityType === outType\n  }\n}\n\nexport type LinkWidgetData = {\n  direction: 'in' | 'out'\n  entityId: string\n  entityType: string\n  link: {\n    linkType: string\n    label: string\n    targetEntityType: string\n  }\n  links: LinkEntity[]\n}\n\nexport interface LinksWidgetProps extends WidgetBaseProps {\n  value?: LinkWidgetData\n  projectName: string\n  cellId: string\n  disabled?: boolean\n  folderId?: string | null // the folder selected or the parent folder of the selected (used in EntityPickerDialog)\n}\n\nexport const LinksWidget: FC<LinksWidgetProps> = ({\n  value,\n  isEditing,\n  cellId,\n  projectName,\n  disabled,\n  folderId,\n  onChange: _onChange, // not used in this widget\n  onCancelEdit,\n}) => {\n  // Try to get the contexts, but they might not exist in all environments\n  let setSelectedEntity:\n    | ((entity: { entityId: string; entityType: 'folder' | 'task' }) => void)\n    | undefined\n  let clearRowsSelection: (() => void) | undefined\n\n  const selectedEntityIds: string[] = []\n  try {\n    const entityContext = useDetailsPanelEntityContext()\n    setSelectedEntity = entityContext.setSelectedEntity\n    if (entityContext.selectedEntity) {\n      selectedEntityIds.push(entityContext.selectedEntity.entityId)\n    }\n  } catch {\n    // Context not available\n  }\n\n  try {\n    const rowsContext = useSelectedRowsContext()\n    clearRowsSelection = rowsContext.clearRowsSelection\n  } catch {\n    // Context not available\n  }\n\n  const handleEntityClick = (entityId: string, entityType: string) => {\n    // Clear any row selection first if context is available\n    if (clearRowsSelection) {\n      clearRowsSelection()\n    }\n    // Set the selected entity if context is available\n    if (setSelectedEntity) {\n      setSelectedEntity({\n        entityId,\n        entityType: entityType as 'folder' | 'task',\n      })\n    } else {\n      // Fallback to console.log if contexts are not available\n      console.log('Entity clicked:', entityId, entityType)\n    }\n  }\n  return (\n    <>\n      <Chips\n        values={\n          value?.links?.map((v) => ({\n            label: v.label,\n            tooltip: v.parents.join('/') + '/' + v.label,\n          })) || []\n        }\n        pt={{ chip: { className: EDIT_TRIGGER_CLASS } }}\n        disabled={disabled}\n      />\n      {isEditing &&\n        value &&\n        createPortal(\n          <LinksManagerDialog\n            isEditing={isEditing}\n            anchorId={cellId}\n            projectName={projectName}\n            linkTypeLabel={value.link.label || ''}\n            links={value.links}\n            direction={value.direction}\n            entityId={value.entityId}\n            entityType={value.entityType}\n            targetEntityType={value.link.targetEntityType}\n            linkType={value.link.linkType}\n            selectedEntityIds={selectedEntityIds}\n            onClose={onCancelEdit}\n            onEntityClick={handleEntityClick}\n            disabled={disabled}\n            folderId={folderId}\n          />,\n          document.body,\n        )}\n    </>\n  )\n}\n"],"names":["isLinkEditable","direction","linkType","entityType","linkTypeParts","_name","outType","inType","LinksWidget","value","isEditing","cellId","projectName","disabled","folderId","_onChange","onCancelEdit","setSelectedEntity","clearRowsSelection","selectedEntityIds","entityContext","useDetailsPanelEntityContext","useSelectedRowsContext","handleEntityClick","entityId","jsxs","Fragment","jsx","Chips","_a","v","EDIT_TRIGGER_CLASS","createPortal","LinksManagerDialog"],"mappings":"2gXAQO,MAAMA,EAAiB,CAC5BC,EACAC,EACAC,IACY,CACN,MAAAC,EAAgBF,EAAS,MAAM,GAAG,EAClC,CAACG,EAAOC,EAASC,CAAM,EAAIH,EACjC,OAAIH,IAAc,KACTE,IAAeI,EAEfJ,IAAeG,CAE1B,EAsBaE,EAAoC,CAAC,CAChD,MAAAC,EACA,UAAAC,EACA,OAAAC,EACA,YAAAC,EACA,SAAAC,EACA,SAAAC,EACA,SAAUC,EACV,aAAAC,CACF,IAAM,OAEA,IAAAC,EAGAC,EAEJ,MAAMC,EAA8B,CAAC,EACjC,GAAA,CACF,MAAMC,EAAgBC,EAAAA,6BAA6B,EACnDJ,EAAoBG,EAAc,kBAC9BA,EAAc,gBACED,EAAA,KAAKC,EAAc,eAAe,QAAQ,CAC9D,MACM,CAAA,CAIJ,GAAA,CAEFF,EADoBI,EAAAA,uBAAuB,EACV,kBAAA,MAC3B,CAAA,CAIF,MAAAC,EAAoB,CAACC,EAAkBrB,IAAuB,CAE9De,GACiBA,EAAA,EAGjBD,EACgBA,EAAA,CAChB,SAAAO,EACA,WAAArB,CAAA,CACD,EAGO,QAAA,IAAI,kBAAmBqB,EAAUrB,CAAU,CAEvD,EACA,OAEIsB,EAAA,kBAAA,KAAAC,6BAAA,CAAA,SAAA,CAAAC,EAAA,kBAAA,IAACC,EAAA,MAAA,CACC,SACEC,EAAApB,GAAA,YAAAA,EAAO,QAAP,YAAAoB,EAAc,IAAKC,IAAO,CACxB,MAAOA,EAAE,MACT,QAASA,EAAE,QAAQ,KAAK,GAAG,EAAI,IAAMA,EAAE,KACzC,MAAO,CAAC,EAEV,GAAI,CAAE,KAAM,CAAE,UAAWC,qBAAqB,EAC9C,SAAAlB,CAAA,CACF,EACCH,GACCD,GACAuB,EAAA,aACEL,EAAA,kBAAA,IAACM,EAAA,mBAAA,CACC,UAAAvB,EACA,SAAUC,EACV,YAAAC,EACA,cAAeH,EAAM,KAAK,OAAS,GACnC,MAAOA,EAAM,MACb,UAAWA,EAAM,UACjB,SAAUA,EAAM,SAChB,WAAYA,EAAM,WAClB,iBAAkBA,EAAM,KAAK,iBAC7B,SAAUA,EAAM,KAAK,SACrB,kBAAAU,EACA,QAASH,EACT,cAAeO,EACf,SAAAV,EACA,SAAAC,CAAA,CACF,EACA,SAAS,IAAA,CACX,EACJ,CAEJ"}
+{"version":3,"file":"LinksWidget.cjs.js","sources":["../../../../../../src/containers/ProjectTreeTable/widgets/LinksWidget.tsx"],"sourcesContent":["import { Chips, ChipValue, LinkEntity } from '@shared/components'\nimport { LinksManagerDialog } from '@shared/components/LinksManager/LinksManagerDialog'\nimport { FC } from 'react'\nimport { EDIT_TRIGGER_CLASS, WidgetBaseProps } from './CellWidget'\nimport { createPortal } from 'react-dom'\nimport { useDetailsPanelEntityContext } from '../context/DetailsPanelEntityContext'\nimport { useSelectedRowsContext } from '../context/SelectedRowsContext'\n\nexport const isLinkEditable = (\n  direction: 'in' | 'out',\n  linkType: string,\n  entityType: string,\n): boolean => {\n  const linkTypeParts = linkType.split('|')\n  const [_name, outType, inType] = linkTypeParts\n  if (direction === 'in') {\n    return entityType === inType\n  } else {\n    return entityType === outType\n  }\n}\n\nexport type LinkWidgetData = {\n  direction: 'in' | 'out'\n  entityId: string\n  entityType: string\n  link: {\n    linkType: string\n    label: string\n    targetEntityType: string\n  }\n  links: LinkEntity[]\n}\n\nexport interface LinksWidgetProps extends WidgetBaseProps {\n  value?: LinkWidgetData\n  projectName: string\n  cellId: string\n  disabled?: boolean\n  folderId?: string | null // the folder selected or the parent folder of the selected (used in EntityPickerDialog)\n}\n\nexport const LinksWidget: FC<LinksWidgetProps> = ({\n  value,\n  isEditing,\n  cellId,\n  projectName,\n  disabled,\n  folderId,\n  onChange: _onChange, // not used in this widget\n  onCancelEdit,\n}) => {\n  // Try to get the contexts, but they might not exist in all environments\n  let setSelectedEntity:\n    | ((entity: { entityId: string; entityType: 'folder' | 'task' }) => void)\n    | undefined\n  let clearRowsSelection: (() => void) | undefined\n\n  const selectedEntityIds: string[] = []\n  try {\n    const entityContext = useDetailsPanelEntityContext()\n    setSelectedEntity = entityContext.setSelectedEntity\n    if (entityContext.selectedEntity) {\n      selectedEntityIds.push(entityContext.selectedEntity.entityId)\n    }\n  } catch {\n    // Context not available\n  }\n\n  try {\n    const rowsContext = useSelectedRowsContext()\n    clearRowsSelection = rowsContext.clearRowsSelection\n  } catch {\n    // Context not available\n  }\n\n  const handleEntityClick = (entityId: string, entityType: string) => {\n    // Clear any row selection first if context is available\n    if (clearRowsSelection) {\n      clearRowsSelection()\n    }\n    // Set the selected entity if context is available\n    if (setSelectedEntity) {\n      setSelectedEntity({\n        entityId,\n        entityType: entityType as 'folder' | 'task',\n      })\n    } else {\n      // Fallback to console.log if contexts are not available\n      console.log('Entity clicked:', entityId, entityType)\n    }\n  }\n  return (\n    <>\n      <Chips\n        values={\n          value?.links?.map((v) => ({\n            label: v.label,\n            tooltip: v.parents.join('/') + '/' + v.label,\n          })) || []\n        }\n        pt={{ chip: { className: EDIT_TRIGGER_CLASS } }}\n        disabled={disabled}\n      />\n      {isEditing &&\n        value &&\n        createPortal(\n          <LinksManagerDialog\n            isEditing={isEditing}\n            anchorId={cellId}\n            projectName={projectName}\n            linkTypeLabel={value.link.label || ''}\n            links={value.links}\n            direction={value.direction}\n            entityId={value.entityId}\n            entityType={value.entityType}\n            targetEntityType={value.link.targetEntityType}\n            linkType={value.link.linkType}\n            selectedEntityIds={selectedEntityIds}\n            onClose={onCancelEdit}\n            onEntityClick={handleEntityClick}\n            disabled={disabled}\n            folderId={folderId}\n          />,\n          document.body,\n        )}\n    </>\n  )\n}\n"],"names":["isLinkEditable","direction","linkType","entityType","linkTypeParts","_name","outType","inType","LinksWidget","value","isEditing","cellId","projectName","disabled","folderId","_onChange","onCancelEdit","setSelectedEntity","clearRowsSelection","selectedEntityIds","entityContext","useDetailsPanelEntityContext","useSelectedRowsContext","handleEntityClick","entityId","jsxs","Fragment","jsx","Chips","_a","v","EDIT_TRIGGER_CLASS","createPortal","LinksManagerDialog"],"mappings":"stXAQO,MAAMA,EAAiB,CAC5BC,EACAC,EACAC,IACY,CACN,MAAAC,EAAgBF,EAAS,MAAM,GAAG,EAClC,CAACG,EAAOC,EAASC,CAAM,EAAIH,EACjC,OAAIH,IAAc,KACTE,IAAeI,EAEfJ,IAAeG,CAE1B,EAsBaE,EAAoC,CAAC,CAChD,MAAAC,EACA,UAAAC,EACA,OAAAC,EACA,YAAAC,EACA,SAAAC,EACA,SAAAC,EACA,SAAUC,EACV,aAAAC,CACF,IAAM,OAEA,IAAAC,EAGAC,EAEJ,MAAMC,EAA8B,CAAC,EACjC,GAAA,CACF,MAAMC,EAAgBC,EAAAA,6BAA6B,EACnDJ,EAAoBG,EAAc,kBAC9BA,EAAc,gBACED,EAAA,KAAKC,EAAc,eAAe,QAAQ,CAC9D,MACM,CAAA,CAIJ,GAAA,CAEFF,EADoBI,EAAAA,uBAAuB,EACV,kBAAA,MAC3B,CAAA,CAIF,MAAAC,EAAoB,CAACC,EAAkBrB,IAAuB,CAE9De,GACiBA,EAAA,EAGjBD,EACgBA,EAAA,CAChB,SAAAO,EACA,WAAArB,CAAA,CACD,EAGO,QAAA,IAAI,kBAAmBqB,EAAUrB,CAAU,CAEvD,EACA,OAEIsB,EAAA,kBAAA,KAAAC,6BAAA,CAAA,SAAA,CAAAC,EAAA,kBAAA,IAACC,EAAA,MAAA,CACC,SACEC,EAAApB,GAAA,YAAAA,EAAO,QAAP,YAAAoB,EAAc,IAAKC,IAAO,CACxB,MAAOA,EAAE,MACT,QAASA,EAAE,QAAQ,KAAK,GAAG,EAAI,IAAMA,EAAE,KACzC,MAAO,CAAC,EAEV,GAAI,CAAE,KAAM,CAAE,UAAWC,qBAAqB,EAC9C,SAAAlB,CAAA,CACF,EACCH,GACCD,GACAuB,EAAA,aACEL,EAAA,kBAAA,IAACM,EAAA,mBAAA,CACC,UAAAvB,EACA,SAAUC,EACV,YAAAC,EACA,cAAeH,EAAM,KAAK,OAAS,GACnC,MAAOA,EAAM,MACb,UAAWA,EAAM,UACjB,SAAUA,EAAM,SAChB,WAAYA,EAAM,WAClB,iBAAkBA,EAAM,KAAK,iBAC7B,SAAUA,EAAM,KAAK,SACrB,kBAAAU,EACA,QAASH,EACT,cAAeO,EACf,SAAAV,EACA,SAAAC,CAAA,CACF,EACA,SAAS,IAAA,CACX,EACJ,CAEJ"}