@ynput/ayon-frontend-shared 0.2.40 → 0.2.42

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

@@ -1 +1 @@
-{"version":3,"file":"Chips.cjs.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { FC, useRef, useState, useLayoutEffect, HTMLAttributes } from 'react'\nimport styled from 'styled-components'\n\nconst ChipsContainer = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  overflow: hidden;\n`\n\nconst Chip = styled.div`\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-m);\n  padding: 2px 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n\n  flex-shrink: 0;\n  min-width: auto;\n  &.last {\n    flex-shrink: 1;\n    min-width: 0;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OffscreenChip = styled(Chip)`\n  visibility: hidden;\n  position: absolute;\n  top: -9999px;\n  left: -9999px;\n  z-index: -100;\n`\n\nconst MoreChip = styled(Chip)`\n  flex-shrink: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`\n\nconst AddIcon = styled(Icon)`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  width: 24px;\n  height: 24px;\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-high-hover);\n  }\n`\n\nexport type ChipValue = {\n  label: string\n  tooltip: string\n}\n\ninterface ChipsProps {\n  values: ChipValue[]\n  disabled?: boolean\n  pt?: {\n    chip?: Partial<HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nexport const Chips: FC<ChipsProps> = ({ values, disabled, pt }) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [visibleValues, setVisibleValues] = useState<ChipValue[]>([])\n  const [hiddenCount, setHiddenCount] = useState(0)\n  const [offscreenChips, setOffscreenChips] = useState<ChipValue[]>([])\n\n  useLayoutEffect(() => {\n    setOffscreenChips(values)\n  }, [values])\n\n  useLayoutEffect(() => {\n    const calculateVisibleChips = () => {\n      if (!containerRef.current || offscreenChips.length === 0) return\n\n      const containerWidth = containerRef.current.offsetWidth\n      const chipElements = Array.from(containerRef.current.querySelectorAll('.offscreen-chip'))\n      const moreChipElement = containerRef.current.querySelector('.more-chip')\n\n      if (!chipElements.length) return\n\n      let totalWidth = 0\n      const newVisibleValues: ChipValue[] = []\n\n      const moreChipWidth = moreChipElement?.getBoundingClientRect().width || 60\n\n      // Always show the first chip\n      if (values.length > 0) {\n        const firstChipWidth = chipElements[0].getBoundingClientRect().width\n        newVisibleValues.push(values[0])\n        totalWidth += firstChipWidth\n      }\n\n      // Add additional chips if they fit\n      for (let i = 1; i < values.length; i++) {\n        const chipWidth = chipElements[i].getBoundingClientRect().width\n\n        // Check if the next chip can fit completely\n        if (totalWidth + chipWidth <= containerWidth) {\n          totalWidth += chipWidth\n          newVisibleValues.push(values[i])\n        } else {\n          // Check if there's room for the more chip\n          if (totalWidth + moreChipWidth <= containerWidth) {\n            // Keep current visible chips and show more chip\n            break\n          } else {\n            // Remove the last chip if we need room for the more chip\n            if (newVisibleValues.length > 1) {\n              const lastChipWidth =\n                chipElements[newVisibleValues.length - 1].getBoundingClientRect().width\n              totalWidth -= lastChipWidth\n              newVisibleValues.pop()\n            }\n            break\n          }\n        }\n      }\n\n      const finalHiddenCount = values.length - newVisibleValues.length\n      setVisibleValues(newVisibleValues)\n      setHiddenCount(finalHiddenCount)\n    }\n\n    const resizeObserver = new ResizeObserver(calculateVisibleChips)\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current)\n    }\n\n    // Initial calculation\n    calculateVisibleChips()\n\n    return () => {\n      if (containerRef.current) {\n        resizeObserver.unobserve(containerRef.current)\n      }\n    }\n  }, [values, offscreenChips])\n\n  if (disabled) return null\n\n  // for no values return plus button\n  if (!values.length) {\n    return <AddIcon icon=\"add\" className={pt?.chip?.className} />\n  }\n\n  return (\n    <ChipsContainer ref={containerRef}>\n      {visibleValues.map((chip, index) => (\n        <Chip\n          {...pt?.chip}\n          key={chip.label + index}\n          data-tooltip={chip.tooltip}\n          className={clsx(\n            'chip',\n            { last: index === visibleValues.length - 1 && hiddenCount > 0 },\n            pt?.chip?.className,\n          )}\n        >\n          {chip.label}\n        </Chip>\n      ))}\n      {hiddenCount > 0 && (\n        <MoreChip className={clsx('more-chip', pt?.chip?.className)}>+{hiddenCount}</MoreChip>\n      )}\n      {offscreenChips.map((chip, index) => (\n        <OffscreenChip key={chip.label + index} className=\"offscreen-chip\">\n          {chip.label}\n        </OffscreenChip>\n      ))}\n    </ChipsContainer>\n  )\n}\n"],"names":["ChipsContainer","styled","Chip","OffscreenChip","MoreChip","AddIcon","Icon","Chips","values","disabled","pt","containerRef","useRef","visibleValues","setVisibleValues","useState","hiddenCount","setHiddenCount","offscreenChips","setOffscreenChips","useLayoutEffect","calculateVisibleChips","containerWidth","chipElements","moreChipElement","totalWidth","newVisibleValues","moreChipWidth","firstChipWidth","i","chipWidth","lastChipWidth","finalHiddenCount","resizeObserver","jsxs","chip","index","createElement","clsx","_a","_b","jsx"],"mappings":"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"}
+{"version":3,"file":"Chips.cjs.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport React, { FC, useRef, useState, useLayoutEffect, HTMLAttributes } from 'react'\nimport styled from 'styled-components'\n\nconst ChipsContainer = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  overflow: hidden;\n`\n\nconst Chip = styled.div`\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-m);\n  padding: 2px 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  flex-shrink: 0;\n  min-width: auto;\n  &.last {\n    flex-shrink: 1;\n    min-width: 0;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OffscreenChip = styled(Chip)`\n  visibility: hidden;\n  position: absolute;\n  top: -9999px;\n  left: -9999px;\n  z-index: -100;\n`\n\nconst MoreChip = styled(Chip)`\n  flex-shrink: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`\n\nconst AddIcon = styled(Icon)`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  width: 24px;\n  height: 24px;\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-high-hover);\n  }\n`\n\nexport type ChipValue = {\n  label: string\n  tooltip: string\n  icon?: string\n}\n\ninterface ChipsProps {\n  values: ChipValue[]\n  disabled?: boolean\n  pt?: {\n    chip?: Partial<HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nexport const Chips: FC<ChipsProps> = ({ values, disabled, pt }) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [visibleValues, setVisibleValues] = useState<ChipValue[]>([])\n  const [hiddenCount, setHiddenCount] = useState(0)\n  const [offscreenChips, setOffscreenChips] = useState<ChipValue[]>([])\n\n  useLayoutEffect(() => {\n    setOffscreenChips(values)\n  }, [values])\n\n  useLayoutEffect(() => {\n    const calculateVisibleChips = () => {\n      if (!containerRef.current || offscreenChips.length === 0) return\n\n      const containerWidth = containerRef.current.offsetWidth\n      const chipElements = Array.from(containerRef.current.querySelectorAll('.offscreen-chip'))\n      const moreChipElement = containerRef.current.querySelector('.more-chip')\n\n      if (!chipElements.length) return\n\n      let totalWidth = 0\n      const newVisibleValues: ChipValue[] = []\n\n      const moreChipWidth = moreChipElement?.getBoundingClientRect().width || 60\n\n      // Always show the first chip\n      if (values.length > 0) {\n        const firstChipWidth = chipElements[0].getBoundingClientRect().width\n        newVisibleValues.push(values[0])\n        totalWidth += firstChipWidth\n      }\n\n      // Add additional chips if they fit\n      for (let i = 1; i < values.length; i++) {\n        const chipWidth = chipElements[i].getBoundingClientRect().width\n\n        // Check if the next chip can fit completely\n        if (totalWidth + chipWidth <= containerWidth) {\n          totalWidth += chipWidth\n          newVisibleValues.push(values[i])\n        } else {\n          // Check if there's room for the more chip\n          if (totalWidth + moreChipWidth <= containerWidth) {\n            // Keep current visible chips and show more chip\n            break\n          } else {\n            // Remove the last chip if we need room for the more chip\n            if (newVisibleValues.length > 1) {\n              const lastChipWidth =\n                chipElements[newVisibleValues.length - 1].getBoundingClientRect().width\n              totalWidth -= lastChipWidth\n              newVisibleValues.pop()\n            }\n            break\n          }\n        }\n      }\n\n      const finalHiddenCount = values.length - newVisibleValues.length\n      setVisibleValues(newVisibleValues)\n      setHiddenCount(finalHiddenCount)\n    }\n\n    const resizeObserver = new ResizeObserver(calculateVisibleChips)\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current)\n    }\n\n    // Initial calculation\n    calculateVisibleChips()\n\n    return () => {\n      if (containerRef.current) {\n        resizeObserver.unobserve(containerRef.current)\n      }\n    }\n  }, [values, offscreenChips])\n\n  if (disabled) return null\n\n  // for no values return plus button\n  if (!values.length) {\n    return <AddIcon icon=\"add\" className={pt?.chip?.className} />\n  }\n\n  return (\n    <ChipsContainer ref={containerRef}>\n      {visibleValues.map((chip, index) => (\n        <Chip\n          {...pt?.chip}\n          key={chip.label + index}\n          data-tooltip={chip.tooltip}\n          className={clsx(\n            'chip',\n            { last: index === visibleValues.length - 1 && hiddenCount > 0 },\n            pt?.chip?.className,\n          )}\n        >\n          {chip?.icon && <Icon icon={chip.icon}/>}  {chip.label}\n        </Chip>\n      ))}\n      {hiddenCount > 0 && (\n        <MoreChip className={clsx('more-chip', pt?.chip?.className)}>+{hiddenCount}</MoreChip>\n      )}\n      {offscreenChips.map((chip, index) => (\n        <OffscreenChip key={chip.label + index} className=\"offscreen-chip\">\n          {chip.label}\n        </OffscreenChip>\n      ))}\n    </ChipsContainer>\n  )\n}\n"],"names":["ChipsContainer","styled","Chip","OffscreenChip","MoreChip","AddIcon","Icon","Chips","values","disabled","pt","containerRef","useRef","visibleValues","setVisibleValues","useState","hiddenCount","setHiddenCount","offscreenChips","setOffscreenChips","useLayoutEffect","calculateVisibleChips","containerWidth","chipElements","moreChipElement","totalWidth","newVisibleValues","moreChipWidth","firstChipWidth","i","chipWidth","lastChipWidth","finalHiddenCount","resizeObserver","jsxs","chip","index","createElement","clsx","_a","jsx","_b"],"mappings":"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"}

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

@@ -1,15 +1,15 @@
-import { j as d } from "../../../../_virtual/jsx-runtime.es.js";
-import { useRef as O, useState as p, useLayoutEffect as w, createElement as z } from "react";
-import { Icon as A } from "@ynput/ayon-react-components";
+import { j as a } from "../../../../_virtual/jsx-runtime.es.js";
+import { useRef as z, useState as g, useLayoutEffect as w, createElement as A } from "react";
+import { Icon as k } from "@ynput/ayon-react-components";
 import v from "clsx";
-import a from "styled-components";
-const E = a.div`
+import d from "styled-components";
+const E = d.div`
   display: flex;
   gap: var(--base-gap-small);
   align-items: center;
   width: 100%;
   overflow: hidden;
-`, g = a.div`
+`, p = d.div`
   background-color: var(--md-sys-color-surface-container-high);
   border-radius: var(--border-radius-m);
   padding: 2px 4px;
@@ -18,6 +18,10 @@ const E = a.div`
   text-overflow: ellipsis;
   cursor: pointer;
 
+  display: flex;
+  align-items: center;
+  gap: 4px;
+
   flex-shrink: 0;
   min-width: auto;
   &.last {
@@ -28,18 +32,18 @@ const E = a.div`
   &:hover {
     background-color: var(--md-sys-color-surface-container-high-hover);
   }
-`, S = a(g)`
+`, S = d(p)`
   visibility: hidden;
   position: absolute;
   top: -9999px;
   left: -9999px;
   z-index: -100;
-`, q = a(g)`
+`, q = d(p)`
   flex-shrink: 0;
   display: flex;
   justify-content: center;
   align-items: center;
-`, H = a(A)`
+`, H = d(k)`
   background-color: var(--md-sys-color-surface-container);
   border-radius: var(--border-radius-m);
   width: 24px;
@@ -52,66 +56,68 @@ const E = a.div`
   &:hover {
     background-color: var(--md-sys-color-surface-container-high-hover);
   }
-`, G = ({ values: r, disabled: k, pt: e }) => {
+`, G = ({ values: n, disabled: j, pt: r }) => {
   var x, C;
-  const i = O(null), [b, j] = p([]), [f, R] = p(0), [u, N] = p([]);
+  const i = z(null), [b, R] = g([]), [f, N] = g(0), [u, W] = g([]);
   return w(() => {
-    N(r);
-  }, [r]), w(() => {
-    const n = () => {
+    W(n);
+  }, [n]), w(() => {
+    const e = () => {
       if (!i.current || u.length === 0) return;
       const c = i.current.offsetWidth, h = Array.from(i.current.querySelectorAll(".offscreen-chip")), m = i.current.querySelector(".more-chip");
       if (!h.length) return;
       let l = 0;
-      const o = [], W = (m == null ? void 0 : m.getBoundingClientRect().width) || 60;
-      if (r.length > 0) {
+      const o = [], V = (m == null ? void 0 : m.getBoundingClientRect().width) || 60;
+      if (n.length > 0) {
         const s = h[0].getBoundingClientRect().width;
-        o.push(r[0]), l += s;
+        o.push(n[0]), l += s;
       }
-      for (let s = 1; s < r.length; s++) {
+      for (let s = 1; s < n.length; s++) {
         const y = h[s].getBoundingClientRect().width;
         if (l + y <= c)
-          l += y, o.push(r[s]);
+          l += y, o.push(n[s]);
         else {
-          if (l + W <= c)
+          if (l + V <= c)
             break;
           if (o.length > 1) {
-            const B = h[o.length - 1].getBoundingClientRect().width;
-            l -= B, o.pop();
+            const O = h[o.length - 1].getBoundingClientRect().width;
+            l -= O, o.pop();
           }
           break;
         }
       }
-      const V = r.length - o.length;
-      j(o), R(V);
-    }, t = new ResizeObserver(n);
-    return i.current && t.observe(i.current), n(), () => {
+      const B = n.length - o.length;
+      R(o), N(B);
+    }, t = new ResizeObserver(e);
+    return i.current && t.observe(i.current), e(), () => {
       i.current && t.unobserve(i.current);
     };
-  }, [r, u]), k ? null : r.length ? /* @__PURE__ */ d.jsxs(E, { ref: i, children: [
-    b.map((n, t) => {
+  }, [n, u]), j ? null : n.length ? /* @__PURE__ */ a.jsxs(E, { ref: i, children: [
+    b.map((e, t) => {
       var c;
-      return /* @__PURE__ */ z(
-        g,
+      return /* @__PURE__ */ A(
+        p,
         {
-          ...e == null ? void 0 : e.chip,
-          key: n.label + t,
-          "data-tooltip": n.tooltip,
+          ...r == null ? void 0 : r.chip,
+          key: e.label + t,
+          "data-tooltip": e.tooltip,
           className: v(
             "chip",
             { last: t === b.length - 1 && f > 0 },
-            (c = e == null ? void 0 : e.chip) == null ? void 0 : c.className
+            (c = r == null ? void 0 : r.chip) == null ? void 0 : c.className
           )
         },
-        n.label
+        (e == null ? void 0 : e.icon) && /* @__PURE__ */ a.jsx(k, { icon: e.icon }),
+        "  ",
+        e.label
       );
     }),
-    f > 0 && /* @__PURE__ */ d.jsxs(q, { className: v("more-chip", (C = e == null ? void 0 : e.chip) == null ? void 0 : C.className), children: [
+    f > 0 && /* @__PURE__ */ a.jsxs(q, { className: v("more-chip", (C = r == null ? void 0 : r.chip) == null ? void 0 : C.className), children: [
       "+",
       f
     ] }),
-    u.map((n, t) => /* @__PURE__ */ d.jsx(S, { className: "offscreen-chip", children: n.label }, n.label + t))
-  ] }) : /* @__PURE__ */ d.jsx(H, { icon: "add", className: (x = e == null ? void 0 : e.chip) == null ? void 0 : x.className });
+    u.map((e, t) => /* @__PURE__ */ a.jsx(S, { className: "offscreen-chip", children: e.label }, e.label + t))
+  ] }) : /* @__PURE__ */ a.jsx(H, { icon: "add", className: (x = r == null ? void 0 : r.chip) == null ? void 0 : x.className });
 };
 export {
   G as Chips

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

@@ -1 +1 @@
-{"version":3,"file":"Chips.es.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { FC, useRef, useState, useLayoutEffect, HTMLAttributes } from 'react'\nimport styled from 'styled-components'\n\nconst ChipsContainer = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  overflow: hidden;\n`\n\nconst Chip = styled.div`\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-m);\n  padding: 2px 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n\n  flex-shrink: 0;\n  min-width: auto;\n  &.last {\n    flex-shrink: 1;\n    min-width: 0;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OffscreenChip = styled(Chip)`\n  visibility: hidden;\n  position: absolute;\n  top: -9999px;\n  left: -9999px;\n  z-index: -100;\n`\n\nconst MoreChip = styled(Chip)`\n  flex-shrink: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`\n\nconst AddIcon = styled(Icon)`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  width: 24px;\n  height: 24px;\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-high-hover);\n  }\n`\n\nexport type ChipValue = {\n  label: string\n  tooltip: string\n}\n\ninterface ChipsProps {\n  values: ChipValue[]\n  disabled?: boolean\n  pt?: {\n    chip?: Partial<HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nexport const Chips: FC<ChipsProps> = ({ values, disabled, pt }) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [visibleValues, setVisibleValues] = useState<ChipValue[]>([])\n  const [hiddenCount, setHiddenCount] = useState(0)\n  const [offscreenChips, setOffscreenChips] = useState<ChipValue[]>([])\n\n  useLayoutEffect(() => {\n    setOffscreenChips(values)\n  }, [values])\n\n  useLayoutEffect(() => {\n    const calculateVisibleChips = () => {\n      if (!containerRef.current || offscreenChips.length === 0) return\n\n      const containerWidth = containerRef.current.offsetWidth\n      const chipElements = Array.from(containerRef.current.querySelectorAll('.offscreen-chip'))\n      const moreChipElement = containerRef.current.querySelector('.more-chip')\n\n      if (!chipElements.length) return\n\n      let totalWidth = 0\n      const newVisibleValues: ChipValue[] = []\n\n      const moreChipWidth = moreChipElement?.getBoundingClientRect().width || 60\n\n      // Always show the first chip\n      if (values.length > 0) {\n        const firstChipWidth = chipElements[0].getBoundingClientRect().width\n        newVisibleValues.push(values[0])\n        totalWidth += firstChipWidth\n      }\n\n      // Add additional chips if they fit\n      for (let i = 1; i < values.length; i++) {\n        const chipWidth = chipElements[i].getBoundingClientRect().width\n\n        // Check if the next chip can fit completely\n        if (totalWidth + chipWidth <= containerWidth) {\n          totalWidth += chipWidth\n          newVisibleValues.push(values[i])\n        } else {\n          // Check if there's room for the more chip\n          if (totalWidth + moreChipWidth <= containerWidth) {\n            // Keep current visible chips and show more chip\n            break\n          } else {\n            // Remove the last chip if we need room for the more chip\n            if (newVisibleValues.length > 1) {\n              const lastChipWidth =\n                chipElements[newVisibleValues.length - 1].getBoundingClientRect().width\n              totalWidth -= lastChipWidth\n              newVisibleValues.pop()\n            }\n            break\n          }\n        }\n      }\n\n      const finalHiddenCount = values.length - newVisibleValues.length\n      setVisibleValues(newVisibleValues)\n      setHiddenCount(finalHiddenCount)\n    }\n\n    const resizeObserver = new ResizeObserver(calculateVisibleChips)\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current)\n    }\n\n    // Initial calculation\n    calculateVisibleChips()\n\n    return () => {\n      if (containerRef.current) {\n        resizeObserver.unobserve(containerRef.current)\n      }\n    }\n  }, [values, offscreenChips])\n\n  if (disabled) return null\n\n  // for no values return plus button\n  if (!values.length) {\n    return <AddIcon icon=\"add\" className={pt?.chip?.className} />\n  }\n\n  return (\n    <ChipsContainer ref={containerRef}>\n      {visibleValues.map((chip, index) => (\n        <Chip\n          {...pt?.chip}\n          key={chip.label + index}\n          data-tooltip={chip.tooltip}\n          className={clsx(\n            'chip',\n            { last: index === visibleValues.length - 1 && hiddenCount > 0 },\n            pt?.chip?.className,\n          )}\n        >\n          {chip.label}\n        </Chip>\n      ))}\n      {hiddenCount > 0 && (\n        <MoreChip className={clsx('more-chip', pt?.chip?.className)}>+{hiddenCount}</MoreChip>\n      )}\n      {offscreenChips.map((chip, index) => (\n        <OffscreenChip key={chip.label + index} className=\"offscreen-chip\">\n          {chip.label}\n        </OffscreenChip>\n      ))}\n    </ChipsContainer>\n  )\n}\n"],"names":["ChipsContainer","styled","Chip","OffscreenChip","MoreChip","AddIcon","Icon","Chips","values","disabled","pt","containerRef","useRef","visibleValues","setVisibleValues","useState","hiddenCount","setHiddenCount","offscreenChips","setOffscreenChips","useLayoutEffect","calculateVisibleChips","containerWidth","chipElements","moreChipElement","totalWidth","newVisibleValues","moreChipWidth","firstChipWidth","i","chipWidth","lastChipWidth","finalHiddenCount","resizeObserver","jsxs","chip","index","createElement","clsx","_a","_b","jsx"],"mappings":";;;;;AAKA,MAAMA,IAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQxBC,IAAOD,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAqBdE,IAAgBF,EAAOC,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAQ3BE,IAAWH,EAAOC,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA,GAOtBG,IAAUJ,EAAOK,CAAI;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA4BdC,IAAwB,CAAC,EAAE,QAAAC,GAAQ,UAAAC,GAAU,IAAAC,QAAS;;AAC3D,QAAAC,IAAeC,EAAuB,IAAI,GAC1C,CAACC,GAAeC,CAAgB,IAAIC,EAAsB,CAAA,CAAE,GAC5D,CAACC,GAAaC,CAAc,IAAIF,EAAS,CAAC,GAC1C,CAACG,GAAgBC,CAAiB,IAAIJ,EAAsB,CAAA,CAAE;AA0EpE,SAxEAK,EAAgB,MAAM;AACpB,IAAAD,EAAkBX,CAAM;AAAA,EAAA,GACvB,CAACA,CAAM,CAAC,GAEXY,EAAgB,MAAM;AACpB,UAAMC,IAAwB,MAAM;AAClC,UAAI,CAACV,EAAa,WAAWO,EAAe,WAAW,EAAG;AAEpD,YAAAI,IAAiBX,EAAa,QAAQ,aACtCY,IAAe,MAAM,KAAKZ,EAAa,QAAQ,iBAAiB,iBAAiB,CAAC,GAClFa,IAAkBb,EAAa,QAAQ,cAAc,YAAY;AAEnE,UAAA,CAACY,EAAa,OAAQ;AAE1B,UAAIE,IAAa;AACjB,YAAMC,IAAgC,CAAC,GAEjCC,KAAgBH,KAAA,gBAAAA,EAAiB,wBAAwB,UAAS;AAGpE,UAAAhB,EAAO,SAAS,GAAG;AACrB,cAAMoB,IAAiBL,EAAa,CAAC,EAAE,sBAAwB,EAAA;AAC9C,QAAAG,EAAA,KAAKlB,EAAO,CAAC,CAAC,GACjBiB,KAAAG;AAAA,MAAA;AAIhB,eAASC,IAAI,GAAGA,IAAIrB,EAAO,QAAQqB,KAAK;AACtC,cAAMC,IAAYP,EAAaM,CAAC,EAAE,sBAAwB,EAAA;AAGtD,YAAAJ,IAAaK,KAAaR;AACd,UAAAG,KAAAK,GACGJ,EAAA,KAAKlB,EAAOqB,CAAC,CAAC;AAAA,aAC1B;AAED,cAAAJ,IAAaE,KAAiBL;AAEhC;AAGI,cAAAI,EAAiB,SAAS,GAAG;AAC/B,kBAAMK,IACJR,EAAaG,EAAiB,SAAS,CAAC,EAAE,wBAAwB;AACtD,YAAAD,KAAAM,GACdL,EAAiB,IAAI;AAAA,UAAA;AAEvB;AAAA,QACF;AAAA,MACF;AAGI,YAAAM,IAAmBxB,EAAO,SAASkB,EAAiB;AAC1D,MAAAZ,EAAiBY,CAAgB,GACjCT,EAAee,CAAgB;AAAA,IACjC,GAEMC,IAAiB,IAAI,eAAeZ,CAAqB;AAC/D,WAAIV,EAAa,WACAsB,EAAA,QAAQtB,EAAa,OAAO,GAIvBU,EAAA,GAEf,MAAM;AACX,MAAIV,EAAa,WACAsB,EAAA,UAAUtB,EAAa,OAAO;AAAA,IAEjD;AAAA,EAAA,GACC,CAACH,GAAQU,CAAc,CAAC,GAEvBT,IAAiB,OAGhBD,EAAO,SAKV0B,gBAAAA,EAAA,KAAClC,GAAe,EAAA,KAAKW,GAClB,UAAA;AAAA,IAAcE,EAAA,IAAI,CAACsB,GAAMC,MACxB;;AAAA,6BAAAC;AAAA,QAACnC;AAAA,QAAA;AAAA,UACE,GAAGQ,KAAA,gBAAAA,EAAI;AAAA,UACR,KAAKyB,EAAK,QAAQC;AAAA,UAClB,gBAAcD,EAAK;AAAA,UACnB,WAAWG;AAAA,YACT;AAAA,YACA,EAAE,MAAMF,MAAUvB,EAAc,SAAS,KAAKG,IAAc,EAAE;AAAA,aAC9DuB,IAAA7B,KAAA,gBAAAA,EAAI,SAAJ,gBAAA6B,EAAU;AAAA,UAAA;AAAA,QACZ;AAAA,QAECJ,EAAK;AAAA,MAAA;AAAA,KAET;AAAA,IACAnB,IAAc,KACbkB,gBAAAA,OAAC9B,GAAS,EAAA,WAAWkC,EAAK,cAAaE,IAAA9B,KAAA,gBAAAA,EAAI,SAAJ,gBAAA8B,EAAU,SAAS,GAAG,UAAA;AAAA,MAAA;AAAA,MAAExB;AAAA,IAAA,GAAY;AAAA,IAE5EE,EAAe,IAAI,CAACiB,GAAMC,MACxBK,gBAAAA,EAAAA,IAAAtC,GAAA,EAAuC,WAAU,kBAC/C,UAAKgC,EAAA,MAAA,GADYA,EAAK,QAAQC,CAEjC,CACD;AAAA,EAAA,GACH,0BA3BQ/B,GAAQ,EAAA,MAAK,OAAM,YAAWkC,IAAA7B,KAAA,gBAAAA,EAAI,SAAJ,gBAAA6B,EAAU,WAAW;AA6B/D;"}
+{"version":3,"file":"Chips.es.js","sources":["../../../../../src/components/Chips/Chips.tsx"],"sourcesContent":["import { Icon } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport React, { FC, useRef, useState, useLayoutEffect, HTMLAttributes } from 'react'\nimport styled from 'styled-components'\n\nconst ChipsContainer = styled.div`\n  display: flex;\n  gap: var(--base-gap-small);\n  align-items: center;\n  width: 100%;\n  overflow: hidden;\n`\n\nconst Chip = styled.div`\n  background-color: var(--md-sys-color-surface-container-high);\n  border-radius: var(--border-radius-m);\n  padding: 2px 4px;\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  cursor: pointer;\n\n  display: flex;\n  align-items: center;\n  gap: 4px;\n\n  flex-shrink: 0;\n  min-width: auto;\n  &.last {\n    flex-shrink: 1;\n    min-width: 0;\n  }\n\n  &:hover {\n    background-color: var(--md-sys-color-surface-container-high-hover);\n  }\n`\n\nconst OffscreenChip = styled(Chip)`\n  visibility: hidden;\n  position: absolute;\n  top: -9999px;\n  left: -9999px;\n  z-index: -100;\n`\n\nconst MoreChip = styled(Chip)`\n  flex-shrink: 0;\n  display: flex;\n  justify-content: center;\n  align-items: center;\n`\n\nconst AddIcon = styled(Icon)`\n  background-color: var(--md-sys-color-surface-container);\n  border-radius: var(--border-radius-m);\n  width: 24px;\n  height: 24px;\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-high-hover);\n  }\n`\n\nexport type ChipValue = {\n  label: string\n  tooltip: string\n  icon?: string\n}\n\ninterface ChipsProps {\n  values: ChipValue[]\n  disabled?: boolean\n  pt?: {\n    chip?: Partial<HTMLAttributes<HTMLDivElement>>\n  }\n}\n\nexport const Chips: FC<ChipsProps> = ({ values, disabled, pt }) => {\n  const containerRef = useRef<HTMLDivElement>(null)\n  const [visibleValues, setVisibleValues] = useState<ChipValue[]>([])\n  const [hiddenCount, setHiddenCount] = useState(0)\n  const [offscreenChips, setOffscreenChips] = useState<ChipValue[]>([])\n\n  useLayoutEffect(() => {\n    setOffscreenChips(values)\n  }, [values])\n\n  useLayoutEffect(() => {\n    const calculateVisibleChips = () => {\n      if (!containerRef.current || offscreenChips.length === 0) return\n\n      const containerWidth = containerRef.current.offsetWidth\n      const chipElements = Array.from(containerRef.current.querySelectorAll('.offscreen-chip'))\n      const moreChipElement = containerRef.current.querySelector('.more-chip')\n\n      if (!chipElements.length) return\n\n      let totalWidth = 0\n      const newVisibleValues: ChipValue[] = []\n\n      const moreChipWidth = moreChipElement?.getBoundingClientRect().width || 60\n\n      // Always show the first chip\n      if (values.length > 0) {\n        const firstChipWidth = chipElements[0].getBoundingClientRect().width\n        newVisibleValues.push(values[0])\n        totalWidth += firstChipWidth\n      }\n\n      // Add additional chips if they fit\n      for (let i = 1; i < values.length; i++) {\n        const chipWidth = chipElements[i].getBoundingClientRect().width\n\n        // Check if the next chip can fit completely\n        if (totalWidth + chipWidth <= containerWidth) {\n          totalWidth += chipWidth\n          newVisibleValues.push(values[i])\n        } else {\n          // Check if there's room for the more chip\n          if (totalWidth + moreChipWidth <= containerWidth) {\n            // Keep current visible chips and show more chip\n            break\n          } else {\n            // Remove the last chip if we need room for the more chip\n            if (newVisibleValues.length > 1) {\n              const lastChipWidth =\n                chipElements[newVisibleValues.length - 1].getBoundingClientRect().width\n              totalWidth -= lastChipWidth\n              newVisibleValues.pop()\n            }\n            break\n          }\n        }\n      }\n\n      const finalHiddenCount = values.length - newVisibleValues.length\n      setVisibleValues(newVisibleValues)\n      setHiddenCount(finalHiddenCount)\n    }\n\n    const resizeObserver = new ResizeObserver(calculateVisibleChips)\n    if (containerRef.current) {\n      resizeObserver.observe(containerRef.current)\n    }\n\n    // Initial calculation\n    calculateVisibleChips()\n\n    return () => {\n      if (containerRef.current) {\n        resizeObserver.unobserve(containerRef.current)\n      }\n    }\n  }, [values, offscreenChips])\n\n  if (disabled) return null\n\n  // for no values return plus button\n  if (!values.length) {\n    return <AddIcon icon=\"add\" className={pt?.chip?.className} />\n  }\n\n  return (\n    <ChipsContainer ref={containerRef}>\n      {visibleValues.map((chip, index) => (\n        <Chip\n          {...pt?.chip}\n          key={chip.label + index}\n          data-tooltip={chip.tooltip}\n          className={clsx(\n            'chip',\n            { last: index === visibleValues.length - 1 && hiddenCount > 0 },\n            pt?.chip?.className,\n          )}\n        >\n          {chip?.icon && <Icon icon={chip.icon}/>}  {chip.label}\n        </Chip>\n      ))}\n      {hiddenCount > 0 && (\n        <MoreChip className={clsx('more-chip', pt?.chip?.className)}>+{hiddenCount}</MoreChip>\n      )}\n      {offscreenChips.map((chip, index) => (\n        <OffscreenChip key={chip.label + index} className=\"offscreen-chip\">\n          {chip.label}\n        </OffscreenChip>\n      ))}\n    </ChipsContainer>\n  )\n}\n"],"names":["ChipsContainer","styled","Chip","OffscreenChip","MoreChip","AddIcon","Icon","Chips","values","disabled","pt","containerRef","useRef","visibleValues","setVisibleValues","useState","hiddenCount","setHiddenCount","offscreenChips","setOffscreenChips","useLayoutEffect","calculateVisibleChips","containerWidth","chipElements","moreChipElement","totalWidth","newVisibleValues","moreChipWidth","firstChipWidth","i","chipWidth","lastChipWidth","finalHiddenCount","resizeObserver","jsxs","chip","index","createElement","clsx","_a","jsx","_b"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../../_virtual/jsx-runtime.cjs.js"),a=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/activities/getCategories.cjs.js");require("../../api/queries/addons/getAddons.cjs.js");require("../../api/queries/addons/updateAddons.cjs.js");require("../../api/queries/attributes/getAttributes.cjs.js");require("../../api/queries/attributes/updateAttributes.cjs.js");require("../../api/queries/authentication/getAuthentication.cjs.js");require("../../api/queries/cloud/cloud.cjs.js");const d=require("../../api/queries/entities/getEntity.cjs.js");require("../../api/queries/entities/getEntityPanel.cjs.js");require("../../api/queries/entities/updateEntity.cjs.js");require("../../api/queries/entityLists/getLists.cjs.js");require("../../api/queries/entityLists/updateLists.cjs.js");require("../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.cjs.js");require("../../api/queries/grouping/getGrouping.cjs.js");require("../../api/queries/links/updateLinks.cjs.js");require("../../api/queries/links/getLinks.cjs.js");require("../../api/queries/links/getEntityLinks.cjs.js");require("../../api/queries/overview/getOverview.cjs.js");require("../../api/queries/overview/updateOverview.cjs.js");require("../../api/queries/versions/getVersionsProducts.cjs.js");require("../../api/queries/permissions/getPermissions.cjs.js");require("../../api/queries/products/createProduct.cjs.js");require("../../api/queries/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/users/guests.cjs.js");require("../../api/queries/versions/updateVersions.cjs.js");require("../../api/queries/views/getViews.cjs.js");require("../../api/queries/views/updateViews.cjs.js");require("../../api/queries/watchers/getWatchers.cjs.js");require("../../api/queries/uris/getUris.cjs.js");const c=require("@ynput/ayon-react-components"),g=({projectName:o,entityType:i,entityIds:n,visible:u,onHide:s})=>{const{data:q={},isLoading:e,isError:r,error:l}=d.useGetEntityQuery({projectName:o,entityType:i,entityId:n[0]},{skip:!u});return e&&r&&a.toast.error(`Unable to load detail. ${l}`),!u||q.length<1?null:t.jsxRuntimeExports.jsx(c.Dialog,{isOpen:!0,onClose:s,size:"lg",style:{width:"50vw"},header:`${i} detail`,children:t.jsxRuntimeExports.jsxs("pre",{children:[!e&&!r&&JSON.stringify(q,null,2),e&&"loading...",r&&"error..."]})})};exports.DetailsDialog=g;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../../_virtual/jsx-runtime.cjs.js"),a=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/activities/getCategories.cjs.js");require("../../api/queries/addons/getAddons.cjs.js");require("../../api/queries/addons/updateAddons.cjs.js");require("../../api/queries/attributes/getAttributes.cjs.js");require("../../api/queries/attributes/updateAttributes.cjs.js");require("../../api/queries/authentication/getAuthentication.cjs.js");require("../../api/queries/cloud/cloud.cjs.js");require("../../api/queries/config/getConfig.cjs.js");require("../../api/queries/config/updateConfig.cjs.js");const d=require("../../api/queries/entities/getEntity.cjs.js");require("../../api/queries/entities/getEntityPanel.cjs.js");require("../../api/queries/entities/updateEntity.cjs.js");require("../../api/queries/entityLists/getLists.cjs.js");require("../../api/queries/entityLists/updateLists.cjs.js");require("../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.cjs.js");require("../../api/queries/grouping/getGrouping.cjs.js");require("../../api/queries/links/updateLinks.cjs.js");require("../../api/queries/links/getLinks.cjs.js");require("../../api/queries/links/getEntityLinks.cjs.js");require("../../api/queries/overview/getOverview.cjs.js");require("../../api/queries/overview/updateOverview.cjs.js");require("../../api/queries/versions/getVersionsProducts.cjs.js");require("../../api/queries/permissions/getPermissions.cjs.js");require("../../api/queries/products/createProduct.cjs.js");require("../../api/queries/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/users/guests.cjs.js");require("../../api/queries/versions/updateVersions.cjs.js");require("../../api/queries/views/getViews.cjs.js");require("../../api/queries/views/updateViews.cjs.js");require("../../api/queries/watchers/getWatchers.cjs.js");require("../../api/queries/uris/getUris.cjs.js");const c=require("@ynput/ayon-react-components"),g=({projectName:o,entityType:i,entityIds:n,visible:u,onHide:s})=>{const{data:q={},isLoading:e,isError:r,error:l}=d.useGetEntityQuery({projectName:o,entityType:i,entityId:n[0]},{skip:!u});return e&&r&&a.toast.error(`Unable to load detail. ${l}`),!u||q.length<1?null:t.jsxRuntimeExports.jsx(c.Dialog,{isOpen:!0,onClose:s,size:"lg",style:{width:"50vw"},header:`${i} detail`,children:t.jsxRuntimeExports.jsxs("pre",{children:[!e&&!r&&JSON.stringify(q,null,2),e&&"loading...",r&&"error..."]})})};exports.DetailsDialog=g;
 //# sourceMappingURL=DetailsDialog.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DetailsDialog.cjs.js","sources":["../../../../../src/components/DetailsDialog/DetailsDialog.tsx"],"sourcesContent":["import { toast } from 'react-toastify'\nimport { useGetEntityQuery } from '@shared/api'\nimport { Dialog } from '@ynput/ayon-react-components'\n\nexport interface DetailsDialogProps {\n  projectName?: string\n  entityType: string\n  entityIds: string[]\n  visible: boolean\n  onHide: () => void\n}\n\nexport const DetailsDialog = ({\n  projectName,\n  entityType,\n  entityIds,\n  visible,\n  onHide,\n}: DetailsDialogProps) => {\n  const {\n    data = {},\n    isLoading,\n    isError,\n    error,\n  } = useGetEntityQuery(\n    { projectName, entityType: entityType, entityId: entityIds[0] },\n    { skip: !visible },\n  )\n\n  if (isLoading)\n    if (isError) {\n      toast.error(`Unable to load detail. ${error}`)\n    }\n\n  if (!visible || data.length < 1) return null\n\n  return (\n    <Dialog\n      isOpen={true}\n      onClose={onHide}\n      size=\"lg\"\n      style={{ width: '50vw' }}\n      header={`${entityType} detail`}\n    >\n      <pre>\n        {!isLoading && !isError && JSON.stringify(data, null, 2)}\n        {isLoading && 'loading...'}\n        {isError && 'error...'}\n      </pre>\n    </Dialog>\n  )\n}\n"],"names":["DetailsDialog","projectName","entityType","entityIds","visible","onHide","data","isLoading","isError","error","useGetEntityQuery","toast","jsx","Dialog"],"mappings":"s/IAYaA,EAAgB,CAAC,CAC5B,YAAAC,EACA,WAAAC,EACA,UAAAC,EACA,QAAAC,EACA,OAAAC,CACF,IAA0B,CAClB,KAAA,CACJ,KAAAC,EAAO,CAAC,EACR,UAAAC,EACA,QAAAC,EACA,MAAAC,CAAA,EACEC,EAAA,kBACF,CAAE,YAAAT,EAAa,WAAAC,EAAwB,SAAUC,EAAU,CAAC,CAAE,EAC9D,CAAE,KAAM,CAACC,CAAQ,CACnB,EAOA,OALIG,GACEC,GACIG,EAAAA,MAAA,MAAM,0BAA0BF,CAAK,EAAE,EAG7C,CAACL,GAAWE,EAAK,OAAS,EAAU,KAGtCM,EAAA,kBAAA,IAACC,EAAA,OAAA,CACC,OAAQ,GACR,QAASR,EACT,KAAK,KACL,MAAO,CAAE,MAAO,MAAO,EACvB,OAAQ,GAAGH,CAAU,UAErB,kCAAC,MACE,CAAA,SAAA,CAAA,CAACK,GAAa,CAACC,GAAW,KAAK,UAAUF,EAAM,KAAM,CAAC,EACtDC,GAAa,aACbC,GAAW,UAAA,CACd,CAAA,CAAA,CACF,CAEJ"}
+{"version":3,"file":"DetailsDialog.cjs.js","sources":["../../../../../src/components/DetailsDialog/DetailsDialog.tsx"],"sourcesContent":["import { toast } from 'react-toastify'\nimport { useGetEntityQuery } from '@shared/api'\nimport { Dialog } from '@ynput/ayon-react-components'\n\nexport interface DetailsDialogProps {\n  projectName?: string\n  entityType: string\n  entityIds: string[]\n  visible: boolean\n  onHide: () => void\n}\n\nexport const DetailsDialog = ({\n  projectName,\n  entityType,\n  entityIds,\n  visible,\n  onHide,\n}: DetailsDialogProps) => {\n  const {\n    data = {},\n    isLoading,\n    isError,\n    error,\n  } = useGetEntityQuery(\n    { projectName, entityType: entityType, entityId: entityIds[0] },\n    { skip: !visible },\n  )\n\n  if (isLoading)\n    if (isError) {\n      toast.error(`Unable to load detail. ${error}`)\n    }\n\n  if (!visible || data.length < 1) return null\n\n  return (\n    <Dialog\n      isOpen={true}\n      onClose={onHide}\n      size=\"lg\"\n      style={{ width: '50vw' }}\n      header={`${entityType} detail`}\n    >\n      <pre>\n        {!isLoading && !isError && JSON.stringify(data, null, 2)}\n        {isLoading && 'loading...'}\n        {isError && 'error...'}\n      </pre>\n    </Dialog>\n  )\n}\n"],"names":["DetailsDialog","projectName","entityType","entityIds","visible","onHide","data","isLoading","isError","error","useGetEntityQuery","toast","jsx","Dialog"],"mappings":"mmJAYaA,EAAgB,CAAC,CAC5B,YAAAC,EACA,WAAAC,EACA,UAAAC,EACA,QAAAC,EACA,OAAAC,CACF,IAA0B,CAClB,KAAA,CACJ,KAAAC,EAAO,CAAC,EACR,UAAAC,EACA,QAAAC,EACA,MAAAC,CAAA,EACEC,EAAA,kBACF,CAAE,YAAAT,EAAa,WAAAC,EAAwB,SAAUC,EAAU,CAAC,CAAE,EAC9D,CAAE,KAAM,CAACC,CAAQ,CACnB,EAOA,OALIG,GACEC,GACIG,EAAAA,MAAA,MAAM,0BAA0BF,CAAK,EAAE,EAG7C,CAACL,GAAWE,EAAK,OAAS,EAAU,KAGtCM,EAAA,kBAAA,IAACC,EAAA,OAAA,CACC,OAAQ,GACR,QAASR,EACT,KAAK,KACL,MAAO,CAAE,MAAO,MAAO,EACvB,OAAQ,GAAGH,CAAU,UAErB,kCAAC,MACE,CAAA,SAAA,CAAA,CAACK,GAAa,CAACC,GAAW,KAAK,UAAUF,EAAM,KAAM,CAAC,EACtDC,GAAa,aACbC,GAAW,UAAA,CACd,CAAA,CAAA,CACF,CAEJ"}

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

@@ -50,6 +50,8 @@ import "../../api/queries/attributes/getAttributes.es.js";
 import "../../api/queries/attributes/updateAttributes.es.js";
 import "../../api/queries/authentication/getAuthentication.es.js";
 import "../../api/queries/cloud/cloud.es.js";
+import "../../api/queries/config/getConfig.es.js";
+import "../../api/queries/config/updateConfig.es.js";
 import { useGetEntityQuery as d } from "../../api/queries/entities/getEntity.es.js";
 import "../../api/queries/entities/getEntityPanel.es.js";
 import "../../api/queries/entities/updateEntity.es.js";
@@ -84,7 +86,7 @@ import "../../api/queries/views/updateViews.es.js";
 import "../../api/queries/watchers/getWatchers.es.js";
 import "../../api/queries/uris/getUris.es.js";
 import { Dialog as f } from "@ynput/ayon-react-components";
-const Mr = ({
+const Vr = ({
   projectName: e,
   entityType: o,
   entityIds: s,
@@ -117,6 +119,6 @@ const Mr = ({
   );
 };
 export {
-  Mr as DetailsDialog
+  Vr as DetailsDialog
 };
 //# sourceMappingURL=DetailsDialog.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"DetailsDialog.es.js","sources":["../../../../../src/components/DetailsDialog/DetailsDialog.tsx"],"sourcesContent":["import { toast } from 'react-toastify'\nimport { useGetEntityQuery } from '@shared/api'\nimport { Dialog } from '@ynput/ayon-react-components'\n\nexport interface DetailsDialogProps {\n  projectName?: string\n  entityType: string\n  entityIds: string[]\n  visible: boolean\n  onHide: () => void\n}\n\nexport const DetailsDialog = ({\n  projectName,\n  entityType,\n  entityIds,\n  visible,\n  onHide,\n}: DetailsDialogProps) => {\n  const {\n    data = {},\n    isLoading,\n    isError,\n    error,\n  } = useGetEntityQuery(\n    { projectName, entityType: entityType, entityId: entityIds[0] },\n    { skip: !visible },\n  )\n\n  if (isLoading)\n    if (isError) {\n      toast.error(`Unable to load detail. ${error}`)\n    }\n\n  if (!visible || data.length < 1) return null\n\n  return (\n    <Dialog\n      isOpen={true}\n      onClose={onHide}\n      size=\"lg\"\n      style={{ width: '50vw' }}\n      header={`${entityType} detail`}\n    >\n      <pre>\n        {!isLoading && !isError && JSON.stringify(data, null, 2)}\n        {isLoading && 'loading...'}\n        {isError && 'error...'}\n      </pre>\n    </Dialog>\n  )\n}\n"],"names":["DetailsDialog","projectName","entityType","entityIds","visible","onHide","data","isLoading","isError","error","useGetEntityQuery","toast","jsx","Dialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAMA,KAAgB,CAAC;AAAA,EAC5B,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AACF,MAA0B;AAClB,QAAA;AAAA,IACJ,MAAAC,IAAO,CAAC;AAAA,IACR,WAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,EAAA,IACEC;AAAA,IACF,EAAE,aAAAT,GAAa,YAAAC,GAAwB,UAAUC,EAAU,CAAC,EAAE;AAAA,IAC9D,EAAE,MAAM,CAACC,EAAQ;AAAA,EACnB;AAOA,SALIG,KACEC,KACIG,EAAA,MAAM,0BAA0BF,CAAK,EAAE,GAG7C,CAACL,KAAWE,EAAK,SAAS,IAAU,OAGtCM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQ;AAAA,MACR,SAASR;AAAA,MACT,MAAK;AAAA,MACL,OAAO,EAAE,OAAO,OAAO;AAAA,MACvB,QAAQ,GAAGH,CAAU;AAAA,MAErB,iCAAC,OACE,EAAA,UAAA;AAAA,QAAA,CAACK,KAAa,CAACC,KAAW,KAAK,UAAUF,GAAM,MAAM,CAAC;AAAA,QACtDC,KAAa;AAAA,QACbC,KAAW;AAAA,MAAA,EACd,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}
+{"version":3,"file":"DetailsDialog.es.js","sources":["../../../../../src/components/DetailsDialog/DetailsDialog.tsx"],"sourcesContent":["import { toast } from 'react-toastify'\nimport { useGetEntityQuery } from '@shared/api'\nimport { Dialog } from '@ynput/ayon-react-components'\n\nexport interface DetailsDialogProps {\n  projectName?: string\n  entityType: string\n  entityIds: string[]\n  visible: boolean\n  onHide: () => void\n}\n\nexport const DetailsDialog = ({\n  projectName,\n  entityType,\n  entityIds,\n  visible,\n  onHide,\n}: DetailsDialogProps) => {\n  const {\n    data = {},\n    isLoading,\n    isError,\n    error,\n  } = useGetEntityQuery(\n    { projectName, entityType: entityType, entityId: entityIds[0] },\n    { skip: !visible },\n  )\n\n  if (isLoading)\n    if (isError) {\n      toast.error(`Unable to load detail. ${error}`)\n    }\n\n  if (!visible || data.length < 1) return null\n\n  return (\n    <Dialog\n      isOpen={true}\n      onClose={onHide}\n      size=\"lg\"\n      style={{ width: '50vw' }}\n      header={`${entityType} detail`}\n    >\n      <pre>\n        {!isLoading && !isError && JSON.stringify(data, null, 2)}\n        {isLoading && 'loading...'}\n        {isError && 'error...'}\n      </pre>\n    </Dialog>\n  )\n}\n"],"names":["DetailsDialog","projectName","entityType","entityIds","visible","onHide","data","isLoading","isError","error","useGetEntityQuery","toast","jsx","Dialog"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYO,MAAMA,KAAgB,CAAC;AAAA,EAC5B,aAAAC;AAAA,EACA,YAAAC;AAAA,EACA,WAAAC;AAAA,EACA,SAAAC;AAAA,EACA,QAAAC;AACF,MAA0B;AAClB,QAAA;AAAA,IACJ,MAAAC,IAAO,CAAC;AAAA,IACR,WAAAC;AAAA,IACA,SAAAC;AAAA,IACA,OAAAC;AAAA,EAAA,IACEC;AAAA,IACF,EAAE,aAAAT,GAAa,YAAAC,GAAwB,UAAUC,EAAU,CAAC,EAAE;AAAA,IAC9D,EAAE,MAAM,CAACC,EAAQ;AAAA,EACnB;AAOA,SALIG,KACEC,KACIG,EAAA,MAAM,0BAA0BF,CAAK,EAAE,GAG7C,CAACL,KAAWE,EAAK,SAAS,IAAU,OAGtCM,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAQ;AAAA,MACR,SAASR;AAAA,MACT,MAAK;AAAA,MACL,OAAO,EAAE,OAAO,OAAO;AAAA,MACvB,QAAQ,GAAGH,CAAU;AAAA,MAErB,iCAAC,OACE,EAAA,UAAA;AAAA,QAAA,CAACK,KAAa,CAACC,KAAW,KAAK,UAAUF,GAAM,MAAM,CAAC;AAAA,QACtDC,KAAa;AAAA,QACbC,KAAW;AAAA,MAAA,EACd,CAAA;AAAA,IAAA;AAAA,EACF;AAEJ;"}

package/dist/shared/src/components/DetailsPanelAttributes/components/RenderFieldWidget.cjs.js

@@ -1,4 +1,4 @@
-"use strict";const s=require("../../../../../_virtual/jsx-runtime.cjs.js"),x=require("styled-components"),S=require("../../../containers/ProjectTreeTable/widgets/TextWidget.cjs.js"),W=require("../../../containers/ProjectTreeTable/widgets/BooleanWidget.cjs.js"),b=require("../../../containers/ProjectTreeTable/widgets/DateWidget.cjs.js"),w=require("../../../containers/ProjectTreeTable/widgets/EnumWidget.cjs.js");require("react");require("../../../context/RemoteModulesContext.cjs.js");require("../../../../../_virtual/runtime.cjs.js");require("../../../../../_virtual/semver.cjs.js");const y=require("../../../hooks/useScopedStatuses.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/activities/getCategories.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/entityLists/listFolders.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/versions/getVersionsProducts.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/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/users/guests.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("../../../api/queries/uris/getUris.cjs.js");require("../../../context/DetailsPanelContext.cjs.js");require("../../../context/ThumbnailUploaderContext.cjs.js");require("../../../context/SettingsPanelContext.cjs.js");require("../../../context/pip/PiPProvider.cjs.js");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("../../../context/MenuContext.cjs.js");require("../../../context/WebsocketContext.cjs.js");require("../../../context/GlobalContext.cjs.js");require("../../../context/ProjectContext.cjs.js");require("../../../context/ProjectFoldersContext.cjs.js");require("../../../context/UriContext.cjs.js");require("react-redux");require("custom-protocol-check");require("../../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");const E=x.div`
+"use strict";const s=require("../../../../../_virtual/jsx-runtime.cjs.js"),x=require("styled-components"),S=require("../../../containers/ProjectTreeTable/widgets/TextWidget.cjs.js"),W=require("../../../containers/ProjectTreeTable/widgets/BooleanWidget.cjs.js"),b=require("../../../containers/ProjectTreeTable/widgets/DateWidget.cjs.js"),w=require("../../../containers/ProjectTreeTable/widgets/EnumWidget.cjs.js");require("react");require("../../../context/RemoteModulesContext.cjs.js");require("../../../../../_virtual/runtime.cjs.js");require("../../../../../_virtual/semver.cjs.js");const y=require("../../../hooks/useScopedStatuses.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/activities/getCategories.cjs.js");require("../../../api/queries/addons/getAddons.cjs.js");require("../../../api/queries/addons/updateAddons.cjs.js");require("../../../api/queries/attributes/getAttributes.cjs.js");require("../../../api/queries/attributes/updateAttributes.cjs.js");require("../../../api/queries/authentication/getAuthentication.cjs.js");require("../../../api/queries/cloud/cloud.cjs.js");require("../../../api/queries/config/getConfig.cjs.js");require("../../../api/queries/config/updateConfig.cjs.js");require("../../../api/queries/entities/getEntity.cjs.js");require("../../../api/queries/entities/getEntityPanel.cjs.js");require("../../../api/queries/entities/updateEntity.cjs.js");require("../../../api/queries/entityLists/getLists.cjs.js");require("../../../api/queries/entityLists/updateLists.cjs.js");require("../../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../../api/queries/entityLists/listFolders.cjs.js");require("../../../api/queries/folders/getFolders.cjs.js");require("../../../api/queries/grouping/getGrouping.cjs.js");require("../../../api/queries/links/updateLinks.cjs.js");require("../../../api/queries/links/getLinks.cjs.js");require("../../../api/queries/links/getEntityLinks.cjs.js");require("../../../api/queries/overview/getOverview.cjs.js");require("../../../api/queries/overview/updateOverview.cjs.js");require("../../../api/queries/versions/getVersionsProducts.cjs.js");require("../../../api/queries/permissions/getPermissions.cjs.js");require("../../../api/queries/products/createProduct.cjs.js");require("../../../api/queries/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/users/guests.cjs.js");require("../../../api/queries/versions/updateVersions.cjs.js");require("../../../api/queries/views/getViews.cjs.js");require("../../../api/queries/views/updateViews.cjs.js");require("../../../api/queries/watchers/getWatchers.cjs.js");require("../../../api/queries/uris/getUris.cjs.js");require("../../../context/DetailsPanelContext.cjs.js");require("../../../context/ThumbnailUploaderContext.cjs.js");require("../../../context/SettingsPanelContext.cjs.js");require("../../../context/pip/PiPProvider.cjs.js");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("../../../context/MenuContext.cjs.js");require("../../../context/WebsocketContext.cjs.js");require("../../../context/GlobalContext.cjs.js");require("../../../context/ProjectContext.cjs.js");require("../../../context/ProjectFoldersContext.cjs.js");require("../../../context/UriContext.cjs.js");require("react-redux");require("custom-protocol-check");require("../../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");const E=x.div`
   width: 100%;
   overflow: hidden;
   text-overflow: ellipsis;

package/dist/shared/src/components/DetailsPanelAttributes/components/RenderFieldWidget.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderFieldWidget.cjs.js","sources":["../../../../../../src/components/DetailsPanelAttributes/components/RenderFieldWidget.tsx"],"sourcesContent":["import { FC } from 'react'\nimport styled from 'styled-components'\nimport type { CellValue } from '@shared/containers/ProjectTreeTable/widgets/CellWidget'\nimport { TextWidget } from '@shared/containers/ProjectTreeTable/widgets/TextWidget'\nimport { BooleanWidget } from '@shared/containers/ProjectTreeTable/widgets/BooleanWidget'\nimport { DateWidget } from '@shared/containers/ProjectTreeTable/widgets/DateWidget'\nimport { EnumWidget } from '@shared/containers/ProjectTreeTable/widgets/EnumWidget'\nimport { useScopedStatuses } from '@shared/hooks'\n// Import AttributeField as a type to avoid runtime circular dependency with DetailsPanelAttributesEditor\nimport type { AttributeField } from '../DetailsPanelAttributesEditor'\nimport type { DetailsPanelEntityData } from '@shared/api'\n\nconst FieldValueText = styled.div`\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n\n  input {\n    text-align: left;\n  }\n`\n\nconst StyledEnumWidget = styled(EnumWidget)`\n  .enum,\n  .edit-trigger {\n    &:hover {\n      background-color: unset;\n    }\n  }\n  &:hover {\n    background-color: unset;\n  }\n`\n\ninterface RenderFieldWidgetProps {\n  field: AttributeField\n  value: any\n  isEditing: boolean\n  isReadOnly: boolean\n  isMixed: boolean\n  onChange: (fieldName: string, value: CellValue | CellValue[]) => void\n  onCancelEdit: () => void\n  entities?: DetailsPanelEntityData[]\n  entityType?: string\n}\n\nconst RenderFieldWidget: FC<RenderFieldWidgetProps> = ({\n  field,\n  value,\n  isEditing,\n  isReadOnly,\n  isMixed,\n  onChange,\n  onCancelEdit,\n  entities = [],\n  entityType = 'task',\n}) => {\n  const { type } = field.data\n  const widgetCommonProps = {\n    isEditing: isEditing && !isReadOnly,\n    isInherited: false,\n    onChange: (newValue: CellValue | CellValue[]) => onChange(field.name, newValue),\n  }\n\n  // Format the value for display\n  let displayValue = value === null || value === undefined ? '' : value\n  const labelValue = field.data.title || field.name\n\n  // Handle different field types\n  switch (true) {\n    case type === 'boolean':\n      return (\n        <BooleanWidget\n          value={Boolean(displayValue)}\n          {...widgetCommonProps}\n          style={{ margin: 0 }}\n          isReadOnly={isReadOnly}\n        />\n      )\n\n    case type === 'datetime':\n      return (\n        <DateWidget\n          value={displayValue}\n          {...widgetCommonProps}\n          isEditing\n          onCancelEdit={onCancelEdit}\n          style={{ width: 'fit-content' }}\n          autoFocus={false}\n        />\n      )\n\n    case !!field.data.enum: {\n      const isListType = type?.includes('list')\n      let valueArray = []\n\n      if (isListType) {\n        valueArray = Array.isArray(displayValue) ? displayValue : []\n      } else if (isMixed) {\n        valueArray = []\n      } else {\n        valueArray = [displayValue]\n      }\n\n      // Use scoped statuses if the field name is 'status'\n      let enumOptions = field.data.enum || []\n      if (field.name === 'status' && entities.length > 0) {\n        const scopedStatuses = useScopedStatuses(\n          entities.map((entity) => entity.projectName),\n          [entityType],\n        )\n        if (scopedStatuses && scopedStatuses.length > 0) {\n          enumOptions = scopedStatuses.map((status) => ({\n            value: status.name,\n            label: status.name,\n            icon: status.icon,\n            color: status.color,\n          }))\n        }\n      }\n\n      if (field.allowNone && !!valueArray.length && !isListType) {\n        // Check if current field has a value (for single value fields)\n        const hasCurrentValue = displayValue && displayValue !== ''\n        if (hasCurrentValue) {\n          enumOptions = [\n            { value: '', label: `No ${field.data.title || field.name}` },\n            ...enumOptions,\n          ]\n        }\n      }\n\n      return (\n        <StyledEnumWidget\n          value={valueArray}\n          options={enumOptions}\n          type={type}\n          pt={{\n            template: {\n              style: { height: 32 },\n              className: 'enum',\n            },\n          }}\n          placeholder={isMixed ? `Mixed ${labelValue}` : `Select ${labelValue}...`}\n          onCancelEdit={onCancelEdit}\n          align=\"right\"\n          isReadOnly={isReadOnly}\n          enableCustomValues={field.enableCustomValues ?? false}\n          search={field.enableSearch ?? false}\n          sortBySelected={!enumOptions}\n          {...widgetCommonProps}\n        />\n      )\n    }\n\n    case type === 'string' || type === 'integer' || type === 'float':\n    default:\n      return (\n        <FieldValueText>\n          <TextWidget\n            value={displayValue.toString()}\n            onCancelEdit={onCancelEdit}\n            type={type as 'string' | 'integer' | 'float'}\n            {...widgetCommonProps}\n          />\n        </FieldValueText>\n      )\n  }\n}\n\nexport default RenderFieldWidget\n"],"names":["FieldValueText","styled","StyledEnumWidget","EnumWidget","RenderFieldWidget","field","value","isEditing","isReadOnly","isMixed","onChange","onCancelEdit","entities","entityType","type","widgetCommonProps","newValue","displayValue","labelValue","jsx","BooleanWidget","DateWidget","isListType","valueArray","enumOptions","scopedStatuses","useScopedStatuses","entity","status","TextWidget"],"mappings":"gmMAYA,MAAMA,EAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYxBC,EAAmBD,EAAOE,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAwBpCC,EAAgD,CAAC,CACrD,MAAAC,EACA,MAAAC,EACA,UAAAC,EACA,WAAAC,EACA,QAAAC,EACA,SAAAC,EACA,aAAAC,EACA,SAAAC,EAAW,CAAC,EACZ,WAAAC,EAAa,MACf,IAAM,CACE,KAAA,CAAE,KAAAC,GAAST,EAAM,KACjBU,EAAoB,CACxB,UAAWR,GAAa,CAACC,EACzB,YAAa,GACb,SAAWQ,GAAsCN,EAASL,EAAM,KAAMW,CAAQ,CAChF,EAGA,IAAIC,EAAeX,GAAwC,GAC3D,MAAMY,EAAab,EAAM,KAAK,OAASA,EAAM,KAG7C,OAAQ,GAAM,CACZ,KAAKS,IAAS,UAEV,OAAAK,EAAA,kBAAA,IAACC,EAAA,cAAA,CACC,MAAO,EAAQH,EACd,GAAGF,EACJ,MAAO,CAAE,OAAQ,CAAE,EACnB,WAAAP,CAAA,CACF,EAGJ,KAAKM,IAAS,WAEV,OAAAK,EAAA,kBAAA,IAACE,EAAA,WAAA,CACC,MAAOJ,EACN,GAAGF,EACJ,UAAS,GACT,aAAAJ,EACA,MAAO,CAAE,MAAO,aAAc,EAC9B,UAAW,EAAA,CACb,EAGJ,IAAK,CAAC,CAACN,EAAM,KAAK,KAAM,CAChB,MAAAiB,EAAaR,GAAA,YAAAA,EAAM,SAAS,QAClC,IAAIS,EAAa,CAAC,EAEdD,EACFC,EAAa,MAAM,QAAQN,CAAY,EAAIA,EAAe,CAAC,EAClDR,EACTc,EAAa,CAAC,EAEdA,EAAa,CAACN,CAAY,EAI5B,IAAIO,EAAcnB,EAAM,KAAK,MAAQ,CAAC,EACtC,GAAIA,EAAM,OAAS,UAAYO,EAAS,OAAS,EAAG,CAClD,MAAMa,EAAiBC,EAAA,kBACrBd,EAAS,IAAKe,GAAWA,EAAO,WAAW,EAC3C,CAACd,CAAU,CACb,EACIY,GAAkBA,EAAe,OAAS,IAC9BD,EAAAC,EAAe,IAAKG,IAAY,CAC5C,MAAOA,EAAO,KACd,MAAOA,EAAO,KACd,KAAMA,EAAO,KACb,MAAOA,EAAO,KAAA,EACd,EACJ,CAGF,OAAIvB,EAAM,WAAekB,EAAW,QAAU,CAACD,GAErBL,GAAgBA,IAAiB,KAEzCO,EAAA,CACZ,CAAE,MAAO,GAAI,MAAO,MAAMnB,EAAM,KAAK,OAASA,EAAM,IAAI,EAAG,EAC3D,GAAGmB,CACL,GAKFL,EAAA,kBAAA,IAACjB,EAAA,CACC,MAAOqB,EACP,QAASC,EACT,KAAAV,EACA,GAAI,CACF,SAAU,CACR,MAAO,CAAE,OAAQ,EAAG,EACpB,UAAW,MAAA,CAEf,EACA,YAAaL,EAAU,SAASS,CAAU,GAAK,UAAUA,CAAU,MACnE,aAAAP,EACA,MAAM,QACN,WAAAH,EACA,mBAAoBH,EAAM,oBAAsB,GAChD,OAAQA,EAAM,cAAgB,GAC9B,eAAgB,CAACmB,EAChB,GAAGT,CAAA,CACN,CAAA,CAIJ,KAAKD,IAAS,UAAYA,IAAS,WAAaA,IAAS,SACzD,QACE,+BACGd,EACC,CAAA,SAAAmB,EAAA,kBAAA,IAACU,EAAA,WAAA,CACC,MAAOZ,EAAa,SAAS,EAC7B,aAAAN,EACA,KAAAG,EACC,GAAGC,CAAA,CAAA,EAER,CAAA,CAGR"}
+{"version":3,"file":"RenderFieldWidget.cjs.js","sources":["../../../../../../src/components/DetailsPanelAttributes/components/RenderFieldWidget.tsx"],"sourcesContent":["import { FC } from 'react'\nimport styled from 'styled-components'\nimport type { CellValue } from '@shared/containers/ProjectTreeTable/widgets/CellWidget'\nimport { TextWidget } from '@shared/containers/ProjectTreeTable/widgets/TextWidget'\nimport { BooleanWidget } from '@shared/containers/ProjectTreeTable/widgets/BooleanWidget'\nimport { DateWidget } from '@shared/containers/ProjectTreeTable/widgets/DateWidget'\nimport { EnumWidget } from '@shared/containers/ProjectTreeTable/widgets/EnumWidget'\nimport { useScopedStatuses } from '@shared/hooks'\n// Import AttributeField as a type to avoid runtime circular dependency with DetailsPanelAttributesEditor\nimport type { AttributeField } from '../DetailsPanelAttributesEditor'\nimport type { DetailsPanelEntityData } from '@shared/api'\n\nconst FieldValueText = styled.div`\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n\n  input {\n    text-align: left;\n  }\n`\n\nconst StyledEnumWidget = styled(EnumWidget)`\n  .enum,\n  .edit-trigger {\n    &:hover {\n      background-color: unset;\n    }\n  }\n  &:hover {\n    background-color: unset;\n  }\n`\n\ninterface RenderFieldWidgetProps {\n  field: AttributeField\n  value: any\n  isEditing: boolean\n  isReadOnly: boolean\n  isMixed: boolean\n  onChange: (fieldName: string, value: CellValue | CellValue[]) => void\n  onCancelEdit: () => void\n  entities?: DetailsPanelEntityData[]\n  entityType?: string\n}\n\nconst RenderFieldWidget: FC<RenderFieldWidgetProps> = ({\n  field,\n  value,\n  isEditing,\n  isReadOnly,\n  isMixed,\n  onChange,\n  onCancelEdit,\n  entities = [],\n  entityType = 'task',\n}) => {\n  const { type } = field.data\n  const widgetCommonProps = {\n    isEditing: isEditing && !isReadOnly,\n    isInherited: false,\n    onChange: (newValue: CellValue | CellValue[]) => onChange(field.name, newValue),\n  }\n\n  // Format the value for display\n  let displayValue = value === null || value === undefined ? '' : value\n  const labelValue = field.data.title || field.name\n\n  // Handle different field types\n  switch (true) {\n    case type === 'boolean':\n      return (\n        <BooleanWidget\n          value={Boolean(displayValue)}\n          {...widgetCommonProps}\n          style={{ margin: 0 }}\n          isReadOnly={isReadOnly}\n        />\n      )\n\n    case type === 'datetime':\n      return (\n        <DateWidget\n          value={displayValue}\n          {...widgetCommonProps}\n          isEditing\n          onCancelEdit={onCancelEdit}\n          style={{ width: 'fit-content' }}\n          autoFocus={false}\n        />\n      )\n\n    case !!field.data.enum: {\n      const isListType = type?.includes('list')\n      let valueArray = []\n\n      if (isListType) {\n        valueArray = Array.isArray(displayValue) ? displayValue : []\n      } else if (isMixed) {\n        valueArray = []\n      } else {\n        valueArray = [displayValue]\n      }\n\n      // Use scoped statuses if the field name is 'status'\n      let enumOptions = field.data.enum || []\n      if (field.name === 'status' && entities.length > 0) {\n        const scopedStatuses = useScopedStatuses(\n          entities.map((entity) => entity.projectName),\n          [entityType],\n        )\n        if (scopedStatuses && scopedStatuses.length > 0) {\n          enumOptions = scopedStatuses.map((status) => ({\n            value: status.name,\n            label: status.name,\n            icon: status.icon,\n            color: status.color,\n          }))\n        }\n      }\n\n      if (field.allowNone && !!valueArray.length && !isListType) {\n        // Check if current field has a value (for single value fields)\n        const hasCurrentValue = displayValue && displayValue !== ''\n        if (hasCurrentValue) {\n          enumOptions = [\n            { value: '', label: `No ${field.data.title || field.name}` },\n            ...enumOptions,\n          ]\n        }\n      }\n\n      return (\n        <StyledEnumWidget\n          value={valueArray}\n          options={enumOptions}\n          type={type}\n          pt={{\n            template: {\n              style: { height: 32 },\n              className: 'enum',\n            },\n          }}\n          placeholder={isMixed ? `Mixed ${labelValue}` : `Select ${labelValue}...`}\n          onCancelEdit={onCancelEdit}\n          align=\"right\"\n          isReadOnly={isReadOnly}\n          enableCustomValues={field.enableCustomValues ?? false}\n          search={field.enableSearch ?? false}\n          sortBySelected={!enumOptions}\n          {...widgetCommonProps}\n        />\n      )\n    }\n\n    case type === 'string' || type === 'integer' || type === 'float':\n    default:\n      return (\n        <FieldValueText>\n          <TextWidget\n            value={displayValue.toString()}\n            onCancelEdit={onCancelEdit}\n            type={type as 'string' | 'integer' | 'float'}\n            {...widgetCommonProps}\n          />\n        </FieldValueText>\n      )\n  }\n}\n\nexport default RenderFieldWidget\n"],"names":["FieldValueText","styled","StyledEnumWidget","EnumWidget","RenderFieldWidget","field","value","isEditing","isReadOnly","isMixed","onChange","onCancelEdit","entities","entityType","type","widgetCommonProps","newValue","displayValue","labelValue","jsx","BooleanWidget","DateWidget","isListType","valueArray","enumOptions","scopedStatuses","useScopedStatuses","entity","status","TextWidget"],"mappings":"mtMAYA,MAAMA,EAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAYxBC,EAAmBD,EAAOE,YAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAwBpCC,EAAgD,CAAC,CACrD,MAAAC,EACA,MAAAC,EACA,UAAAC,EACA,WAAAC,EACA,QAAAC,EACA,SAAAC,EACA,aAAAC,EACA,SAAAC,EAAW,CAAC,EACZ,WAAAC,EAAa,MACf,IAAM,CACE,KAAA,CAAE,KAAAC,GAAST,EAAM,KACjBU,EAAoB,CACxB,UAAWR,GAAa,CAACC,EACzB,YAAa,GACb,SAAWQ,GAAsCN,EAASL,EAAM,KAAMW,CAAQ,CAChF,EAGA,IAAIC,EAAeX,GAAwC,GAC3D,MAAMY,EAAab,EAAM,KAAK,OAASA,EAAM,KAG7C,OAAQ,GAAM,CACZ,KAAKS,IAAS,UAEV,OAAAK,EAAA,kBAAA,IAACC,EAAA,cAAA,CACC,MAAO,EAAQH,EACd,GAAGF,EACJ,MAAO,CAAE,OAAQ,CAAE,EACnB,WAAAP,CAAA,CACF,EAGJ,KAAKM,IAAS,WAEV,OAAAK,EAAA,kBAAA,IAACE,EAAA,WAAA,CACC,MAAOJ,EACN,GAAGF,EACJ,UAAS,GACT,aAAAJ,EACA,MAAO,CAAE,MAAO,aAAc,EAC9B,UAAW,EAAA,CACb,EAGJ,IAAK,CAAC,CAACN,EAAM,KAAK,KAAM,CAChB,MAAAiB,EAAaR,GAAA,YAAAA,EAAM,SAAS,QAClC,IAAIS,EAAa,CAAC,EAEdD,EACFC,EAAa,MAAM,QAAQN,CAAY,EAAIA,EAAe,CAAC,EAClDR,EACTc,EAAa,CAAC,EAEdA,EAAa,CAACN,CAAY,EAI5B,IAAIO,EAAcnB,EAAM,KAAK,MAAQ,CAAC,EACtC,GAAIA,EAAM,OAAS,UAAYO,EAAS,OAAS,EAAG,CAClD,MAAMa,EAAiBC,EAAA,kBACrBd,EAAS,IAAKe,GAAWA,EAAO,WAAW,EAC3C,CAACd,CAAU,CACb,EACIY,GAAkBA,EAAe,OAAS,IAC9BD,EAAAC,EAAe,IAAKG,IAAY,CAC5C,MAAOA,EAAO,KACd,MAAOA,EAAO,KACd,KAAMA,EAAO,KACb,MAAOA,EAAO,KAAA,EACd,EACJ,CAGF,OAAIvB,EAAM,WAAekB,EAAW,QAAU,CAACD,GAErBL,GAAgBA,IAAiB,KAEzCO,EAAA,CACZ,CAAE,MAAO,GAAI,MAAO,MAAMnB,EAAM,KAAK,OAASA,EAAM,IAAI,EAAG,EAC3D,GAAGmB,CACL,GAKFL,EAAA,kBAAA,IAACjB,EAAA,CACC,MAAOqB,EACP,QAASC,EACT,KAAAV,EACA,GAAI,CACF,SAAU,CACR,MAAO,CAAE,OAAQ,EAAG,EACpB,UAAW,MAAA,CAEf,EACA,YAAaL,EAAU,SAASS,CAAU,GAAK,UAAUA,CAAU,MACnE,aAAAP,EACA,MAAM,QACN,WAAAH,EACA,mBAAoBH,EAAM,oBAAsB,GAChD,OAAQA,EAAM,cAAgB,GAC9B,eAAgB,CAACmB,EAChB,GAAGT,CAAA,CACN,CAAA,CAIJ,KAAKD,IAAS,UAAYA,IAAS,WAAaA,IAAS,SACzD,QACE,+BACGd,EACC,CAAA,SAAAmB,EAAA,kBAAA,IAACU,EAAA,WAAA,CACC,MAAOZ,EAAa,SAAS,EAC7B,aAAAN,EACA,KAAAG,EACC,GAAGC,CAAA,CAAA,EAER,CAAA,CAGR"}

package/dist/shared/src/components/DetailsPanelAttributes/components/RenderFieldWidget.es.js

@@ -60,6 +60,8 @@ import "../../../api/queries/attributes/getAttributes.es.js";
 import "../../../api/queries/attributes/updateAttributes.es.js";
 import "../../../api/queries/authentication/getAuthentication.es.js";
 import "../../../api/queries/cloud/cloud.es.js";
+import "../../../api/queries/config/getConfig.es.js";
+import "../../../api/queries/config/updateConfig.es.js";
 import "../../../api/queries/entities/getEntity.es.js";
 import "../../../api/queries/entities/getEntityPanel.es.js";
 import "../../../api/queries/entities/updateEntity.es.js";
@@ -132,7 +134,7 @@ const W = f.div`
   &:hover {
     background-color: unset;
   }
-`, $o = ({
+`, Io = ({
   field: t,
   value: l,
   isEditing: x,
@@ -230,6 +232,6 @@ const W = f.div`
   }
 };
 export {
-  $o as default
+  Io as default
 };
 //# sourceMappingURL=RenderFieldWidget.es.js.map

package/dist/shared/src/components/DetailsPanelAttributes/components/RenderFieldWidget.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"RenderFieldWidget.es.js","sources":["../../../../../../src/components/DetailsPanelAttributes/components/RenderFieldWidget.tsx"],"sourcesContent":["import { FC } from 'react'\nimport styled from 'styled-components'\nimport type { CellValue } from '@shared/containers/ProjectTreeTable/widgets/CellWidget'\nimport { TextWidget } from '@shared/containers/ProjectTreeTable/widgets/TextWidget'\nimport { BooleanWidget } from '@shared/containers/ProjectTreeTable/widgets/BooleanWidget'\nimport { DateWidget } from '@shared/containers/ProjectTreeTable/widgets/DateWidget'\nimport { EnumWidget } from '@shared/containers/ProjectTreeTable/widgets/EnumWidget'\nimport { useScopedStatuses } from '@shared/hooks'\n// Import AttributeField as a type to avoid runtime circular dependency with DetailsPanelAttributesEditor\nimport type { AttributeField } from '../DetailsPanelAttributesEditor'\nimport type { DetailsPanelEntityData } from '@shared/api'\n\nconst FieldValueText = styled.div`\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n\n  input {\n    text-align: left;\n  }\n`\n\nconst StyledEnumWidget = styled(EnumWidget)`\n  .enum,\n  .edit-trigger {\n    &:hover {\n      background-color: unset;\n    }\n  }\n  &:hover {\n    background-color: unset;\n  }\n`\n\ninterface RenderFieldWidgetProps {\n  field: AttributeField\n  value: any\n  isEditing: boolean\n  isReadOnly: boolean\n  isMixed: boolean\n  onChange: (fieldName: string, value: CellValue | CellValue[]) => void\n  onCancelEdit: () => void\n  entities?: DetailsPanelEntityData[]\n  entityType?: string\n}\n\nconst RenderFieldWidget: FC<RenderFieldWidgetProps> = ({\n  field,\n  value,\n  isEditing,\n  isReadOnly,\n  isMixed,\n  onChange,\n  onCancelEdit,\n  entities = [],\n  entityType = 'task',\n}) => {\n  const { type } = field.data\n  const widgetCommonProps = {\n    isEditing: isEditing && !isReadOnly,\n    isInherited: false,\n    onChange: (newValue: CellValue | CellValue[]) => onChange(field.name, newValue),\n  }\n\n  // Format the value for display\n  let displayValue = value === null || value === undefined ? '' : value\n  const labelValue = field.data.title || field.name\n\n  // Handle different field types\n  switch (true) {\n    case type === 'boolean':\n      return (\n        <BooleanWidget\n          value={Boolean(displayValue)}\n          {...widgetCommonProps}\n          style={{ margin: 0 }}\n          isReadOnly={isReadOnly}\n        />\n      )\n\n    case type === 'datetime':\n      return (\n        <DateWidget\n          value={displayValue}\n          {...widgetCommonProps}\n          isEditing\n          onCancelEdit={onCancelEdit}\n          style={{ width: 'fit-content' }}\n          autoFocus={false}\n        />\n      )\n\n    case !!field.data.enum: {\n      const isListType = type?.includes('list')\n      let valueArray = []\n\n      if (isListType) {\n        valueArray = Array.isArray(displayValue) ? displayValue : []\n      } else if (isMixed) {\n        valueArray = []\n      } else {\n        valueArray = [displayValue]\n      }\n\n      // Use scoped statuses if the field name is 'status'\n      let enumOptions = field.data.enum || []\n      if (field.name === 'status' && entities.length > 0) {\n        const scopedStatuses = useScopedStatuses(\n          entities.map((entity) => entity.projectName),\n          [entityType],\n        )\n        if (scopedStatuses && scopedStatuses.length > 0) {\n          enumOptions = scopedStatuses.map((status) => ({\n            value: status.name,\n            label: status.name,\n            icon: status.icon,\n            color: status.color,\n          }))\n        }\n      }\n\n      if (field.allowNone && !!valueArray.length && !isListType) {\n        // Check if current field has a value (for single value fields)\n        const hasCurrentValue = displayValue && displayValue !== ''\n        if (hasCurrentValue) {\n          enumOptions = [\n            { value: '', label: `No ${field.data.title || field.name}` },\n            ...enumOptions,\n          ]\n        }\n      }\n\n      return (\n        <StyledEnumWidget\n          value={valueArray}\n          options={enumOptions}\n          type={type}\n          pt={{\n            template: {\n              style: { height: 32 },\n              className: 'enum',\n            },\n          }}\n          placeholder={isMixed ? `Mixed ${labelValue}` : `Select ${labelValue}...`}\n          onCancelEdit={onCancelEdit}\n          align=\"right\"\n          isReadOnly={isReadOnly}\n          enableCustomValues={field.enableCustomValues ?? false}\n          search={field.enableSearch ?? false}\n          sortBySelected={!enumOptions}\n          {...widgetCommonProps}\n        />\n      )\n    }\n\n    case type === 'string' || type === 'integer' || type === 'float':\n    default:\n      return (\n        <FieldValueText>\n          <TextWidget\n            value={displayValue.toString()}\n            onCancelEdit={onCancelEdit}\n            type={type as 'string' | 'integer' | 'float'}\n            {...widgetCommonProps}\n          />\n        </FieldValueText>\n      )\n  }\n}\n\nexport default RenderFieldWidget\n"],"names":["FieldValueText","styled","StyledEnumWidget","EnumWidget","RenderFieldWidget","field","value","isEditing","isReadOnly","isMixed","onChange","onCancelEdit","entities","entityType","type","widgetCommonProps","newValue","displayValue","labelValue","jsx","BooleanWidget","DateWidget","isListType","valueArray","enumOptions","scopedStatuses","useScopedStatuses","entity","status","TextWidget"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAYA,MAAMA,IAAiBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAYxBC,IAAmBD,EAAOE,CAAU;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GAwBpCC,KAAgD,CAAC;AAAA,EACrD,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,SAAAC;AAAA,EACA,UAAAC;AAAA,EACA,cAAAC;AAAA,EACA,UAAAC,IAAW,CAAC;AAAA,EACZ,YAAAC,IAAa;AACf,MAAM;AACE,QAAA,EAAE,MAAAC,MAAST,EAAM,MACjBU,IAAoB;AAAA,IACxB,WAAWR,KAAa,CAACC;AAAA,IACzB,aAAa;AAAA,IACb,UAAU,CAACQ,MAAsCN,EAASL,EAAM,MAAMW,CAAQ;AAAA,EAChF;AAGA,MAAIC,IAAeX,KAAwC;AAC3D,QAAMY,IAAab,EAAM,KAAK,SAASA,EAAM;AAG7C,UAAQ,IAAM;AAAA,IACZ,KAAKS,MAAS;AAEV,aAAAK,gBAAAA,EAAA;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,OAAO,EAAQH;AAAA,UACd,GAAGF;AAAA,UACJ,OAAO,EAAE,QAAQ,EAAE;AAAA,UACnB,YAAAP;AAAA,QAAA;AAAA,MACF;AAAA,IAGJ,KAAKM,MAAS;AAEV,aAAAK,gBAAAA,EAAA;AAAA,QAACE;AAAA,QAAA;AAAA,UACC,OAAOJ;AAAA,UACN,GAAGF;AAAA,UACJ,WAAS;AAAA,UACT,cAAAJ;AAAA,UACA,OAAO,EAAE,OAAO,cAAc;AAAA,UAC9B,WAAW;AAAA,QAAA;AAAA,MACb;AAAA,IAGJ,KAAK,CAAC,CAACN,EAAM,KAAK,MAAM;AAChB,YAAAiB,IAAaR,KAAA,gBAAAA,EAAM,SAAS;AAClC,UAAIS,IAAa,CAAC;AAElB,MAAID,IACFC,IAAa,MAAM,QAAQN,CAAY,IAAIA,IAAe,CAAC,IAClDR,IACTc,IAAa,CAAC,IAEdA,IAAa,CAACN,CAAY;AAI5B,UAAIO,IAAcnB,EAAM,KAAK,QAAQ,CAAC;AACtC,UAAIA,EAAM,SAAS,YAAYO,EAAS,SAAS,GAAG;AAClD,cAAMa,IAAiBC;AAAA,UACrBd,EAAS,IAAI,CAACe,MAAWA,EAAO,WAAW;AAAA,UAC3C,CAACd,CAAU;AAAA,QACb;AACI,QAAAY,KAAkBA,EAAe,SAAS,MAC9BD,IAAAC,EAAe,IAAI,CAACG,OAAY;AAAA,UAC5C,OAAOA,EAAO;AAAA,UACd,OAAOA,EAAO;AAAA,UACd,MAAMA,EAAO;AAAA,UACb,OAAOA,EAAO;AAAA,QAAA,EACd;AAAA,MACJ;AAGF,aAAIvB,EAAM,aAAekB,EAAW,UAAU,CAACD,KAErBL,KAAgBA,MAAiB,OAEzCO,IAAA;AAAA,QACZ,EAAE,OAAO,IAAI,OAAO,MAAMnB,EAAM,KAAK,SAASA,EAAM,IAAI,GAAG;AAAA,QAC3D,GAAGmB;AAAA,MACL,IAKFL,gBAAAA,EAAA;AAAA,QAACjB;AAAA,QAAA;AAAA,UACC,OAAOqB;AAAA,UACP,SAASC;AAAA,UACT,MAAAV;AAAA,UACA,IAAI;AAAA,YACF,UAAU;AAAA,cACR,OAAO,EAAE,QAAQ,GAAG;AAAA,cACpB,WAAW;AAAA,YAAA;AAAA,UAEf;AAAA,UACA,aAAaL,IAAU,SAASS,CAAU,KAAK,UAAUA,CAAU;AAAA,UACnE,cAAAP;AAAA,UACA,OAAM;AAAA,UACN,YAAAH;AAAA,UACA,oBAAoBH,EAAM,sBAAsB;AAAA,UAChD,QAAQA,EAAM,gBAAgB;AAAA,UAC9B,gBAAgB,CAACmB;AAAA,UAChB,GAAGT;AAAA,QAAA;AAAA,MACN;AAAA,IAAA;AAAA,IAIJ,MAAKD,MAAS,YAAYA,MAAS,aAAaA,MAAS;AAAA,IACzD;AACE,mCACGd,GACC,EAAA,UAAAmB,gBAAAA,EAAA;AAAA,QAACU;AAAA,QAAA;AAAA,UACC,OAAOZ,EAAa,SAAS;AAAA,UAC7B,cAAAN;AAAA,UACA,MAAAG;AAAA,UACC,GAAGC;AAAA,QAAA;AAAA,MAAA,GAER;AAAA,EAAA;AAGR;"}
+{"version":3,"file":"RenderFieldWidget.es.js","sources":["../../../../../../src/components/DetailsPanelAttributes/components/RenderFieldWidget.tsx"],"sourcesContent":["import { FC } from 'react'\nimport styled from 'styled-components'\nimport type { CellValue } from '@shared/containers/ProjectTreeTable/widgets/CellWidget'\nimport { TextWidget } from '@shared/containers/ProjectTreeTable/widgets/TextWidget'\nimport { BooleanWidget } from '@shared/containers/ProjectTreeTable/widgets/BooleanWidget'\nimport { DateWidget } from '@shared/containers/ProjectTreeTable/widgets/DateWidget'\nimport { EnumWidget } from '@shared/containers/ProjectTreeTable/widgets/EnumWidget'\nimport { useScopedStatuses } from '@shared/hooks'\n// Import AttributeField as a type to avoid runtime circular dependency with DetailsPanelAttributesEditor\nimport type { AttributeField } from '../DetailsPanelAttributesEditor'\nimport type { DetailsPanelEntityData } from '@shared/api'\n\nconst FieldValueText = styled.div`\n  width: 100%;\n  overflow: hidden;\n  text-overflow: ellipsis;\n  white-space: nowrap;\n  text-align: right;\n\n  input {\n    text-align: left;\n  }\n`\n\nconst StyledEnumWidget = styled(EnumWidget)`\n  .enum,\n  .edit-trigger {\n    &:hover {\n      background-color: unset;\n    }\n  }\n  &:hover {\n    background-color: unset;\n  }\n`\n\ninterface RenderFieldWidgetProps {\n  field: AttributeField\n  value: any\n  isEditing: boolean\n  isReadOnly: boolean\n  isMixed: boolean\n  onChange: (fieldName: string, value: CellValue | CellValue[]) => void\n  onCancelEdit: () => void\n  entities?: DetailsPanelEntityData[]\n  entityType?: string\n}\n\nconst RenderFieldWidget: FC<RenderFieldWidgetProps> = ({\n  field,\n  value,\n  isEditing,\n  isReadOnly,\n  isMixed,\n  onChange,\n  onCancelEdit,\n  entities = [],\n  entityType = 'task',\n}) => {\n  const { type } = field.data\n  const widgetCommonProps = {\n    isEditing: isEditing && !isReadOnly,\n    isInherited: false,\n    onChange: (newValue: CellValue | CellValue[]) => onChange(field.name, newValue),\n  }\n\n  // Format the value for display\n  let displayValue = value === null || value === undefined ? '' : value\n  const labelValue = field.data.title || field.name\n\n  // Handle different field types\n  switch (true) {\n    case type === 'boolean':\n      return (\n        <BooleanWidget\n          value={Boolean(displayValue)}\n          {...widgetCommonProps}\n          style={{ margin: 0 }}\n          isReadOnly={isReadOnly}\n        />\n      )\n\n    case type === 'datetime':\n      return (\n        <DateWidget\n          value={displayValue}\n          {...widgetCommonProps}\n          isEditing\n          onCancelEdit={onCancelEdit}\n          style={{ width: 'fit-content' }}\n          autoFocus={false}\n        />\n      )\n\n    case !!field.data.enum: {\n      const isListType = type?.includes('list')\n      let valueArray = []\n\n      if (isListType) {\n        valueArray = Array.isArray(displayValue) ? displayValue : []\n      } else if (isMixed) {\n        valueArray = []\n      } else {\n        valueArray = [displayValue]\n      }\n\n      // Use scoped statuses if the field name is 'status'\n      let enumOptions = field.data.enum || []\n      if (field.name === 'status' && entities.length > 0) {\n        const scopedStatuses = useScopedStatuses(\n          entities.map((entity) => entity.projectName),\n          [entityType],\n        )\n        if (scopedStatuses && scopedStatuses.length > 0) {\n          enumOptions = scopedStatuses.map((status) => ({\n            value: status.name,\n            label: status.name,\n            icon: status.icon,\n            color: status.color,\n          }))\n        }\n      }\n\n      if (field.allowNone && !!valueArray.length && !isListType) {\n        // Check if current field has a value (for single value fields)\n        const hasCurrentValue = displayValue && displayValue !== ''\n        if (hasCurrentValue) {\n          enumOptions = [\n            { value: '', label: `No ${field.data.title || field.name}` },\n            ...enumOptions,\n          ]\n        }\n      }\n\n      return (\n        <StyledEnumWidget\n          value={valueArray}\n          options={enumOptions}\n          type={type}\n          pt={{\n            template: {\n              style: { height: 32 },\n              className: 'enum',\n            },\n          }}\n          placeholder={isMixed ? `Mixed ${labelValue}` : `Select ${labelValue}...`}\n          onCancelEdit={onCancelEdit}\n          align=\"right\"\n          isReadOnly={isReadOnly}\n          enableCustomValues={field.enableCustomValues ?? false}\n          search={field.enableSearch ?? false}\n          sortBySelected={!enumOptions}\n          {...widgetCommonProps}\n        />\n      )\n    }\n\n    case type === 'string' || type === 'integer' || type === 'float':\n    default:\n      return (\n        <FieldValueText>\n          <TextWidget\n            value={displayValue.toString()}\n            onCancelEdit={onCancelEdit}\n            type={type as 'string' | 'integer' | 'float'}\n            {...widgetCommonProps}\n          />\n        </FieldValueText>\n      )\n  }\n}\n\nexport default RenderFieldWidget\n"],"names":["FieldValueText","styled","StyledEnumWidget","EnumWidget","RenderFieldWidget","field","value","isEditing","isReadOnly","isMixed","onChange","onCancelEdit","entities","entityType","type","widgetCommonProps","newValue","displayValue","labelValue","jsx","BooleanWidget","DateWidget","isListType","valueArray","enumOptions","scopedStatuses","useScopedStatuses","entity","status","TextWidget"],"mappings":"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"}

package/dist/shared/src/components/DetailsPanelDetails/DescriptionSection.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../_virtual/jsx-runtime.cjs.js"),q=require("react"),d=require("@ynput/ayon-react-components"),C=require("react-quill-ayon"),b=require("clsx"),x=require("./BorderedSection.cjs.js"),D=require("../QuillListStyles/QuillListStyles.cjs.js"),u=require("./DescriptionSection.styles.cjs.js"),v=require("../../containers/Feed/components/CommentInput/InputMarkdownConvert.cjs.js"),w=require("./hooks/useDescriptionEditor.cjs.js"),B=require("./hooks/useMentionSystem.cjs.js"),H=require("./hooks/useQuillFormats.cjs.js");require("lodash");require("react-toastify");require("uuid");require("../../util/pubsub.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");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/activities/getCategories.cjs.js");require("../../api/queries/addons/getAddons.cjs.js");require("../../api/queries/addons/updateAddons.cjs.js");require("../../api/queries/attributes/getAttributes.cjs.js");require("../../api/queries/attributes/updateAttributes.cjs.js");require("../../api/queries/authentication/getAuthentication.cjs.js");require("../../api/queries/cloud/cloud.cjs.js");require("../../api/queries/entities/getEntity.cjs.js");require("../../api/queries/entities/getEntityPanel.cjs.js");require("../../api/queries/entities/updateEntity.cjs.js");require("../../api/queries/entityLists/getLists.cjs.js");require("../../api/queries/entityLists/updateLists.cjs.js");require("../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.cjs.js");require("../../api/queries/grouping/getGrouping.cjs.js");require("../../api/queries/links/updateLinks.cjs.js");require("../../api/queries/links/getLinks.cjs.js");require("../../api/queries/links/getEntityLinks.cjs.js");require("../../api/queries/overview/getOverview.cjs.js");require("../../api/queries/overview/updateOverview.cjs.js");require("../../api/queries/versions/getVersionsProducts.cjs.js");require("../../api/queries/permissions/getPermissions.cjs.js");require("../../api/queries/products/createProduct.cjs.js");require("../../api/queries/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/users/guests.cjs.js");require("../../api/queries/versions/updateVersions.cjs.js");require("../../api/queries/views/getViews.cjs.js");require("../../api/queries/views/updateViews.cjs.js");require("../../api/queries/watchers/getWatchers.cjs.js");require("../../api/queries/uris/getUris.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");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("../../context/MenuContext.cjs.js");require("../../context/WebsocketContext.cjs.js");require("../../context/GlobalContext.cjs.js");require("../../context/ProjectContext.cjs.js");require("../../context/ProjectFoldersContext.cjs.js");require("../../context/UriContext.cjs.js");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");const M=({imageUploader:i,disableImageUpload:o=!1})=>{const t=[[{header:2},"bold","italic","link","code-block"],[{list:"ordered"},{list:"bullet"}]];return o||t.push(["image"]),{toolbar:t,imageUploader:i,magicUrl:!0}},Q=({description:i,isMixed:o,enableEditing:t,onChange:m,isLoading:p})=>{const s=q.useRef(null),[l,c]=q.useState("");q.useEffect(()=>{if(!(i!=null&&i.trim())){c("");return}if(!s.current)return;const n=s.current.innerHTML;c(n)},[i]);const{isEditing:r,editorValue:j,setEditorValue:S,editorRef:h,handleStartEditing:a,handleSave:E,handleCancel:R,handleKeyDown:f}=w.useDescriptionEditor({descriptionHtml:l,enableEditing:t,isMixed:o,onChange:m}),y=H.useQuillFormats();if(p)return e.jsxRuntimeExports.jsx(x.BorderedSection,{title:"Description",children:e.jsxRuntimeExports.jsx(u.StyledLoadingSkeleton,{})});const g=n=>{if(r)return;if(n.target.closest("a")){n.stopPropagation();return}r||a()},k=r?j:l;return e.jsxRuntimeExports.jsxs(x.BorderedSection,{title:"Description",showHeader:!r,enableHover:!r,onClick:r?void 0:a,children:[e.jsxRuntimeExports.jsxs(u.StyledContent,{className:b({editing:r}),onClick:g,children:[e.jsxRuntimeExports.jsx(u.StyledEditor,{className:"block-shortcuts",children:e.jsxRuntimeExports.jsx(D.QuillListStyles,{children:e.jsxRuntimeExports.jsx(u.StyledQuillContainer,{children:e.jsxRuntimeExports.jsx(C,{theme:"snow",ref:h,value:k,onChange:S,placeholder:"Add a description...",modules:r?M({imageUploader:null,disableImageUpload:!0}):{toolbar:!1},formats:y,onKeyDown:f,readOnly:!r},`description-editor-${r}`)})})}),r&&e.jsxRuntimeExports.jsx(u.StyledFooter,{children:e.jsxRuntimeExports.jsxs(u.StyledButtonContainer,{children:[e.jsxRuntimeExports.jsx(d.Button,{variant:"text",label:"Cancel",onClick:R}),e.jsxRuntimeExports.jsx(d.Button,{variant:"filled",label:"Save",onClick:E})]})})]}),e.jsxRuntimeExports.jsx(u.StyledHiddenMarkdown,{ref:s,children:e.jsxRuntimeExports.jsx(v,{typeOptions:B.mentionTypeOptions,initValue:i||""})})]})};exports.DescriptionSection=Q;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../_virtual/jsx-runtime.cjs.js"),s=require("react"),d=require("@ynput/ayon-react-components"),C=require("react-quill-ayon"),b=require("clsx"),x=require("./BorderedSection.cjs.js"),D=require("../QuillListStyles/QuillListStyles.cjs.js"),u=require("./DescriptionSection.styles.cjs.js"),v=require("../../containers/Feed/components/CommentInput/InputMarkdownConvert.cjs.js"),w=require("./hooks/useDescriptionEditor.cjs.js"),B=require("./hooks/useMentionSystem.cjs.js"),H=require("./hooks/useQuillFormats.cjs.js");require("lodash");require("react-toastify");require("uuid");require("../../util/pubsub.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");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/activities/getCategories.cjs.js");require("../../api/queries/addons/getAddons.cjs.js");require("../../api/queries/addons/updateAddons.cjs.js");require("../../api/queries/attributes/getAttributes.cjs.js");require("../../api/queries/attributes/updateAttributes.cjs.js");require("../../api/queries/authentication/getAuthentication.cjs.js");require("../../api/queries/cloud/cloud.cjs.js");require("../../api/queries/config/getConfig.cjs.js");require("../../api/queries/config/updateConfig.cjs.js");require("../../api/queries/entities/getEntity.cjs.js");require("../../api/queries/entities/getEntityPanel.cjs.js");require("../../api/queries/entities/updateEntity.cjs.js");require("../../api/queries/entityLists/getLists.cjs.js");require("../../api/queries/entityLists/updateLists.cjs.js");require("../../api/queries/entityLists/getListsAttributes.cjs.js");require("../../api/queries/entityLists/updateListsAttributes.cjs.js");require("../../api/queries/entityLists/listFolders.cjs.js");require("../../api/queries/folders/getFolders.cjs.js");require("../../api/queries/grouping/getGrouping.cjs.js");require("../../api/queries/links/updateLinks.cjs.js");require("../../api/queries/links/getLinks.cjs.js");require("../../api/queries/links/getEntityLinks.cjs.js");require("../../api/queries/overview/getOverview.cjs.js");require("../../api/queries/overview/updateOverview.cjs.js");require("../../api/queries/versions/getVersionsProducts.cjs.js");require("../../api/queries/permissions/getPermissions.cjs.js");require("../../api/queries/products/createProduct.cjs.js");require("../../api/queries/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/users/guests.cjs.js");require("../../api/queries/versions/updateVersions.cjs.js");require("../../api/queries/views/getViews.cjs.js");require("../../api/queries/views/updateViews.cjs.js");require("../../api/queries/watchers/getWatchers.cjs.js");require("../../api/queries/uris/getUris.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");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("../../context/MenuContext.cjs.js");require("../../context/WebsocketContext.cjs.js");require("../../context/GlobalContext.cjs.js");require("../../context/ProjectContext.cjs.js");require("../../context/ProjectFoldersContext.cjs.js");require("../../context/UriContext.cjs.js");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");const M=({imageUploader:i,disableImageUpload:q=!1})=>{const t=[[{header:2},"bold","italic","link","code-block"],[{list:"ordered"},{list:"bullet"}]];return q||t.push(["image"]),{toolbar:t,imageUploader:i,magicUrl:!0}},Q=({description:i,isMixed:q,enableEditing:t,onChange:m,isLoading:p})=>{const o=s.useRef(null),[l,c]=s.useState("");s.useEffect(()=>{if(!(i!=null&&i.trim())){c("");return}if(!o.current)return;const n=o.current.innerHTML;c(n)},[i]);const{isEditing:r,editorValue:j,setEditorValue:S,editorRef:h,handleStartEditing:a,handleSave:E,handleCancel:R,handleKeyDown:f}=w.useDescriptionEditor({descriptionHtml:l,enableEditing:t,isMixed:q,onChange:m}),y=H.useQuillFormats();if(p)return e.jsxRuntimeExports.jsx(x.BorderedSection,{title:"Description",children:e.jsxRuntimeExports.jsx(u.StyledLoadingSkeleton,{})});const g=n=>{if(r)return;if(n.target.closest("a")){n.stopPropagation();return}r||a()},k=r?j:l;return e.jsxRuntimeExports.jsxs(x.BorderedSection,{title:"Description",showHeader:!r,enableHover:!r,onClick:r?void 0:a,children:[e.jsxRuntimeExports.jsxs(u.StyledContent,{className:b({editing:r}),onClick:g,children:[e.jsxRuntimeExports.jsx(u.StyledEditor,{className:"block-shortcuts",children:e.jsxRuntimeExports.jsx(D.QuillListStyles,{children:e.jsxRuntimeExports.jsx(u.StyledQuillContainer,{children:e.jsxRuntimeExports.jsx(C,{theme:"snow",ref:h,value:k,onChange:S,placeholder:"Add a description...",modules:r?M({imageUploader:null,disableImageUpload:!0}):{toolbar:!1},formats:y,onKeyDown:f,readOnly:!r},`description-editor-${r}`)})})}),r&&e.jsxRuntimeExports.jsx(u.StyledFooter,{children:e.jsxRuntimeExports.jsxs(u.StyledButtonContainer,{children:[e.jsxRuntimeExports.jsx(d.Button,{variant:"text",label:"Cancel",onClick:R}),e.jsxRuntimeExports.jsx(d.Button,{variant:"filled",label:"Save",onClick:E})]})})]}),e.jsxRuntimeExports.jsx(u.StyledHiddenMarkdown,{ref:o,children:e.jsxRuntimeExports.jsx(v,{typeOptions:B.mentionTypeOptions,initValue:i||""})})]})};exports.DescriptionSection=Q;
 //# sourceMappingURL=DescriptionSection.cjs.js.map