@ynput/ayon-frontend-shared 0.2.37 → 0.2.39

package/dist/shared/src/components/Menu/MenuItem.es.js

@@ -0,0 +1,80 @@
+import { j as r } from "../../../../_virtual/jsx-runtime.es.js";
+import { Icon as i, ShortcutTag as M } from "@ynput/ayon-react-components";
+import { forwardRef as P } from "react";
+import { Item as R, Img as $ } from "./Menu.styled.es.js";
+import { isArray as b } from "lodash";
+import { Link as v } from "react-router-dom";
+import E from "clsx";
+import "../../context/RemoteModulesContext.es.js";
+import "../../context/DetailsPanelContext.es.js";
+import "../../context/ThumbnailUploaderContext.es.js";
+import "../../context/SettingsPanelContext.es.js";
+import "../../context/pip/PiPProvider.es.js";
+import "react-dom";
+import "../../context/pip/PiPWrapper.es.js";
+import "../../context/AddonProjectContext.es.js";
+import "../../context/AddonContext.es.js";
+import { usePowerpack as F } from "../../context/PowerpackContext.es.js";
+import "../../context/MoveEntityContext.es.js";
+import "../../context/MenuContext.es.js";
+import "../../context/WebsocketContext.es.js";
+import "../../context/GlobalContext.es.js";
+import "../../context/ProjectContext.es.js";
+import "../../context/ProjectFoldersContext.es.js";
+import "../../context/UriContext.es.js";
+const S = P(
+  ({
+    label: t,
+    icon: m,
+    img: e,
+    highlighted: l,
+    notification: f,
+    selected: x,
+    danger: d,
+    items: j = [],
+    className: g,
+    isLink: s,
+    isDev: u,
+    shortcut: p,
+    disabled: h,
+    powerFeature: w,
+    active: I,
+    ...n
+  }, y) => {
+    const a = b(t) ? t : [t], { powerLicense: A, isLoading: L } = F(), o = !A && w, c = /* @__PURE__ */ r.jsxs(
+      R,
+      {
+        ref: y,
+        className: E(
+          "menu-item",
+          {
+            highlighted: l,
+            selected: x,
+            notification: f,
+            danger: d,
+            dev: u,
+            disabled: h || L,
+            power: o
+          },
+          g
+        ),
+        ...n,
+        "aria-label": a.join(", "),
+        children: [
+          (m || o) && /* @__PURE__ */ r.jsx(i, { icon: o ? "bolt" : m }),
+          e && /* @__PURE__ */ r.jsx($, { src: e, alt: `${t} icon` }),
+          a.map((N, k) => /* @__PURE__ */ r.jsx("span", { children: N }, k)),
+          p && /* @__PURE__ */ r.jsx(M, { style: { minWidth: 22, textAlign: "center" }, align: "right", children: p }),
+          I && /* @__PURE__ */ r.jsx(i, { icon: "check", style: { marginLeft: "auto" } }),
+          !!j.length && /* @__PURE__ */ r.jsx(i, { icon: "arrow_right", className: "more" })
+        ]
+      }
+    );
+    return s ? /* @__PURE__ */ r.jsx(v, { to: s, target: n.target, children: c }) : c;
+  }
+);
+S.displayName = "MenuItem";
+export {
+  S as default
+};
+//# sourceMappingURL=MenuItem.es.js.map

package/dist/shared/src/components/Menu/MenuItem.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuItem.es.js","sources":["../../../../../src/components/Menu/MenuItem.tsx"],"sourcesContent":["import { Icon, ShortcutTag } from '@ynput/ayon-react-components'\nimport React, { forwardRef } from 'react'\nimport * as Styled from './Menu.styled'\nimport { isArray } from 'lodash'\nimport { Link } from 'react-router-dom'\nimport clsx from 'clsx'\nimport { usePowerpack } from '@shared/context'\nimport { MenuItemType } from './Menu'\n\nexport interface MenuItemProps extends Omit<React.HTMLAttributes<HTMLElement>, 'label'> {\n  label?: string | string[]\n  icon?: string\n  img?: string\n  highlighted?: boolean\n  notification?: boolean\n  selected?: boolean\n  danger?: boolean\n  items?: MenuItemType[]\n  isLink?: string\n  isDev?: boolean\n  shortcut?: string\n  disabled?: boolean\n  powerFeature?: string\n  active?: boolean\n  target?: string\n}\n\nconst MenuItem = forwardRef<HTMLLIElement, MenuItemProps>(\n  (\n    {\n      label,\n      icon,\n      img,\n      highlighted,\n      notification,\n      selected,\n      danger,\n      items = [],\n      className,\n      isLink,\n      isDev,\n      shortcut,\n      disabled,\n      powerFeature,\n      active,\n      ...props\n    },\n    ref,\n  ) => {\n    const labelsArray = isArray(label) ? label : [label]\n    const { powerLicense, isLoading } = usePowerpack()\n    const isPowerFeature = !powerLicense && powerFeature\n\n    const Item = (\n      <Styled.Item\n        ref={ref}\n        className={clsx(\n          'menu-item',\n          {\n            highlighted: highlighted,\n            selected: selected,\n            notification: notification,\n            danger: danger,\n            dev: isDev,\n            disabled: disabled || isLoading,\n            power: isPowerFeature,\n          },\n          className,\n        )}\n        {...props}\n        aria-label={labelsArray.join(', ')}\n      >\n        {(icon || isPowerFeature) && <Icon icon={isPowerFeature ? 'bolt' : icon!} />}\n        {img && <Styled.Img src={img} alt={`${label} icon`} />}\n        {labelsArray.map((label, index) => (\n          <span key={index}>{label}</span>\n        ))}\n        {shortcut && (\n          <ShortcutTag style={{ minWidth: 22, textAlign: 'center' }} align={'right'}>\n            {shortcut}\n          </ShortcutTag>\n        )}\n        {active && <Icon icon=\"check\" style={{ marginLeft: 'auto' }} />}\n\n        {!!items.length && <Icon icon=\"arrow_right\" className=\"more\" />}\n      </Styled.Item>\n    )\n\n    if (isLink) {\n      return (\n        <Link to={isLink} target={props.target}>\n          {Item}\n        </Link>\n      )\n    } else {\n      return Item\n    }\n  },\n)\n\nMenuItem.displayName = 'MenuItem'\n\nexport default MenuItem\n"],"names":["MenuItem","forwardRef","label","icon","img","highlighted","notification","selected","danger","items","className","isLink","isDev","shortcut","disabled","powerFeature","active","props","ref","labelsArray","isArray","powerLicense","isLoading","usePowerpack","isPowerFeature","Item","jsxs","Styled.Item","clsx","jsx","Icon","Styled.Img","index","ShortcutTag","Link"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;AA2BA,MAAMA,IAAWC;AAAA,EACf,CACE;AAAA,IACE,OAAAC;AAAA,IACA,MAAAC;AAAA,IACA,KAAAC;AAAA,IACA,aAAAC;AAAA,IACA,cAAAC;AAAA,IACA,UAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC,IAAQ,CAAC;AAAA,IACT,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,QAAAC;AAAA,IACA,GAAGC;AAAA,KAELC,MACG;AACH,UAAMC,IAAcC,EAAQlB,CAAK,IAAIA,IAAQ,CAACA,CAAK,GAC7C,EAAE,cAAAmB,GAAc,WAAAC,EAAU,IAAIC,EAAa,GAC3CC,IAAiB,CAACH,KAAgBN,GAElCU,IACJC,gBAAAA,EAAA;AAAA,MAACC;AAAAA,MAAA;AAAA,QACC,KAAAT;AAAA,QACA,WAAWU;AAAA,UACT;AAAA,UACA;AAAA,YACE,aAAAvB;AAAA,YACA,UAAAE;AAAA,YACA,cAAAD;AAAA,YACA,QAAAE;AAAA,YACA,KAAKI;AAAA,YACL,UAAUE,KAAYQ;AAAA,YACtB,OAAOE;AAAA,UACT;AAAA,UACAd;AAAA,QACF;AAAA,QACC,GAAGO;AAAA,QACJ,cAAYE,EAAY,KAAK,IAAI;AAAA,QAE/B,UAAA;AAAA,WAAAhB,KAAQqB,MAAoBK,gBAAAA,EAAAA,IAAAC,GAAA,EAAK,MAAMN,IAAiB,SAASrB,GAAO;AAAA,UACzEC,KAAQyB,gBAAAA,EAAA,IAAAE,GAAA,EAAW,KAAK3B,GAAK,KAAK,GAAGF,CAAK,SAAS;AAAA,UACnDiB,EAAY,IAAI,CAACjB,GAAO8B,4BACtB,QAAkB,EAAA,UAAA9B,EAAR,GAAA8B,CAAc,CAC1B;AAAA,UACAnB,KACCgB,gBAAAA,EAAAA,IAACI,GAAY,EAAA,OAAO,EAAE,UAAU,IAAI,WAAW,SAAS,GAAG,OAAO,SAC/D,UACHpB,EAAA,CAAA;AAAA,UAEDG,2BAAWc,GAAK,EAAA,MAAK,SAAQ,OAAO,EAAE,YAAY,OAAA,GAAU;AAAA,UAE5D,CAAC,CAACrB,EAAM,gCAAWqB,GAAK,EAAA,MAAK,eAAc,WAAU,OAAO,CAAA;AAAA,QAAA;AAAA,MAAA;AAAA,IAC/D;AAGF,WAAInB,0BAECuB,GAAK,EAAA,IAAIvB,GAAQ,QAAQM,EAAM,QAC7B,UACHQ,GAAA,IAGKA;AAAAA,EACT;AAEJ;AAEAzB,EAAS,cAAc;"}

package/dist/shared/src/components/Menu/MenuList.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const a=require("../../../../_virtual/jsx-runtime.cjs.js"),R=require("react"),Q=require("./MenuItem.cjs.js"),U=require("@ynput/ayon-react-components"),P=require("./Menu.styled.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");const V=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");const X=({items:$,handleClick:j,onSubMenu:s,subMenu:c,level:F,id:I="root-menu",parentRef:v,style:i,onClose:l,onMenuClose:p,itemClassName:N,itemStyle:T,setPowerpackDialog:q,...A})=>{const h=R.useRef({}),u=R.useRef(null),d=(r,o,g)=>{!h.current[o]||!u.current||s==null||s(r,{id:o,style:{top:h.current[o].offsetTop+((i==null?void 0:i.top)||0)-4,right:u.current.getBoundingClientRect().width+((i==null?void 0:i.right)||0)-12},items:g,level:F})},K=r=>{c&&(s==null||s(r,{id:"parent",items:[]}))};return R.useEffect(()=>{if(c&&u.current){const r=u.current.querySelectorAll("li, button")[0];r==null||r.focus()}},[c]),a.jsxRuntimeExports.jsx(P.MenuWrapper,{style:{paddingRight:c?16:0,...i},className:c?"sub-menu":"menu-list",id:I,onMouseLeave:K,...A,ref:u,children:a.jsxRuntimeExports.jsx(P.Menu,{children:$.filter(r=>!r.hidden).map((r,o)=>{if(r.node)return r.node;if((r==null?void 0:r.id)==="divider")return a.jsxRuntimeExports.jsx("hr",{},o);const{label:g,icon:_,img:B,highlighted:O,onClick:E,link:x,items:t=[],id:n,disableClose:W,selected:z,disabled:D,powerFeature:f,active:G,...L}=r,{powerLicense:H}=V.usePowerpack(),k=!H&&f,w=e=>{e.preventDefault(),e.stopPropagation(),f&&(q==null||q(f)),p==null||p()};return a.jsxRuntimeExports.jsx(Q,{tabIndex:0,label:g,icon:_,img:B,highlighted:O,items:t,selected:z,disabled:D,powerFeature:f,active:G,isLink:x,onClick:e=>k?w(e):t.length?d(e,n,t):j(e,E,x,W),onKeyDown:e=>{var y;e.key==="Enter"&&(k?w(e):t.length?d(e,n,t):j(e,E,x));const J=!e.target.nextSibling;if(e.key==="Tab"&&J&&!e.shiftKey){e.preventDefault(),e.stopPropagation();const m=(y=u.current)==null?void 0:y.querySelectorAll("li, button")[0];m==null||m.focus()}e.key==="Escape"&&c&&v&&(e.preventDefault(),e.stopPropagation(),v.focus(),l==null||l(n))},style:{paddingRight:t.length?"0":"16px",...T},ref:e=>h.current[n]=e,onMouseEnter:e=>d(e,n,t),onMouseLeave:e=>d(e,n,[]),className:`${N} ${L.className||""}`,...L,children:!!t.length&&a.jsxRuntimeExports.jsx(U.Icon,{icon:"arrow_right",style:{marginLeft:"auto"}})},`${n}-${o}`)})})})};exports.MenuList=X;
+//# sourceMappingURL=MenuList.cjs.js.map

package/dist/shared/src/components/Menu/MenuList.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.cjs.js","sources":["../../../../../src/components/Menu/MenuList.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react'\nimport MenuItem from './MenuItem'\nimport { Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './Menu.styled'\nimport { PowerpackFeature, usePowerpack } from '@shared/context'\nimport type { MenuItemType } from './Menu'\n\ninterface MenuListProps {\n  items: MenuItemType[]\n  handleClick: (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => void\n  onSubMenu?: (e: React.MouseEvent, menu: any) => void\n  subMenu?: boolean\n  level: number\n  id?: string\n  parentRef?: HTMLElement | null\n  style?: React.CSSProperties\n  onClose?: (id?: string) => void\n  onMenuClose?: () => void\n  itemClassName?: string\n  itemStyle?: React.CSSProperties\n  setPowerpackDialog?: (feature: PowerpackFeature) => void\n  [key: string]: any\n}\n\nexport const MenuList: React.FC<MenuListProps> = ({\n  items,\n  handleClick,\n  onSubMenu,\n  subMenu,\n  level,\n  id = 'root-menu',\n  parentRef,\n  style,\n  onClose,\n  onMenuClose,\n  itemClassName,\n  itemStyle,\n  setPowerpackDialog,\n  ...props\n}) => {\n  const itemRefs = useRef<{ [key: string]: HTMLElement | null }>({})\n  const menuRef = useRef<HTMLDivElement>(null)\n\n  const handleSubMenu = (e: React.MouseEvent, id: string, items: MenuItemType[]) => {\n    if (!itemRefs.current[id] || !menuRef.current) return\n    onSubMenu?.(e, {\n      id,\n      style: {\n        top: itemRefs.current[id]!.offsetTop + ((style?.top as number) || 0) - 4,\n        right: menuRef.current.getBoundingClientRect().width + ((style?.right as number) || 0) - 12,\n      },\n      items,\n      level: level,\n    })\n  }\n\n  const handleMouseLeave = (e: React.MouseEvent) => {\n    if (subMenu) {\n      onSubMenu?.(e, { id: 'parent', items: [] })\n    }\n  }\n\n  //   when a subMenu open, set focus on the first item\n  useEffect(() => {\n    if (subMenu && menuRef.current) {\n      const first = menuRef.current.querySelectorAll('li, button')[0] as HTMLElement\n      first?.focus()\n    }\n  }, [subMenu])\n\n  return (\n    <Styled.MenuWrapper\n      style={{ paddingRight: subMenu ? 16 : 0, ...style }}\n      className={subMenu ? 'sub-menu' : 'menu-list'}\n      id={id}\n      onMouseLeave={handleMouseLeave}\n      {...props}\n      ref={menuRef}\n    >\n      <Styled.Menu>\n        {items\n          .filter((item) => !item.hidden)\n          .map((item, i) => {\n            // if item is a node, return it\n            if (item.node) {\n              return item.node\n            }\n\n            if (item?.id === 'divider') return <hr key={i} />\n\n            const {\n              label,\n              icon,\n              img,\n              highlighted,\n              onClick,\n              link,\n              items = [],\n              id,\n              disableClose,\n              selected,\n              disabled,\n              powerFeature,\n              active,\n              ...props\n            } = item\n\n            const { powerLicense } = usePowerpack()\n            const isPowerFeature = !powerLicense && powerFeature\n\n            const handleClickPowerFeature = (e: React.MouseEvent) => {\n              e.preventDefault()\n              e.stopPropagation()\n              if (powerFeature) {\n                setPowerpackDialog?.(powerFeature)\n              }\n\n              // close the menu\n              onMenuClose?.()\n            }\n\n            return (\n              <MenuItem\n                tabIndex={0}\n                key={`${id}-${i}`}\n                {...{\n                  label,\n                  icon,\n                  img,\n                  highlighted,\n                  items,\n                  selected,\n                  disabled,\n                  powerFeature,\n                  active,\n                }}\n                isLink={link}\n                onClick={(e) =>\n                  isPowerFeature\n                    ? handleClickPowerFeature(e)\n                    : items.length\n                    ? handleSubMenu(e, id, items)\n                    : handleClick(e, onClick, link, disableClose)\n                }\n                onKeyDown={(e: React.KeyboardEvent<HTMLElement>) => {\n                  if (e.key === 'Enter') {\n                    if (isPowerFeature) {\n                      handleClickPowerFeature(e as any)\n                    } else if (items.length) {\n                      handleSubMenu(e as any, id, items)\n                    } else {\n                      handleClick(e as any, onClick, link)\n                    }\n                  }\n                  const isLastChild = !(e.target as HTMLElement).nextSibling\n                  if (e.key === 'Tab' && isLastChild && !e.shiftKey) {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    //   when at bottom of list, tab goes to top\n                    const first = menuRef.current?.querySelectorAll('li, button')[0] as HTMLElement\n                    first?.focus()\n                  }\n                  //   when a submenu is open, esc closes it and sets focus on the parent\n                  if (e.key === 'Escape' && subMenu && parentRef) {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    parentRef.focus()\n                    onClose?.(id)\n                  }\n                }}\n                style={{ paddingRight: items.length ? '0' : '16px', ...itemStyle }}\n                ref={(e) => (itemRefs.current[id] = e)}\n                onMouseEnter={(e) => handleSubMenu(e, id, items)}\n                onMouseLeave={(e) => handleSubMenu(e, id, [])}\n                className={`${itemClassName} ${props.className || ''}`}\n                {...props}\n              >\n                {!!items.length && <Icon icon=\"arrow_right\" style={{ marginLeft: 'auto' }} />}\n              </MenuItem>\n            )\n          })}\n      </Styled.Menu>\n    </Styled.MenuWrapper>\n  )\n}\n"],"names":["MenuList","items","handleClick","onSubMenu","subMenu","level","id","parentRef","style","onClose","onMenuClose","itemClassName","itemStyle","setPowerpackDialog","props","itemRefs","useRef","menuRef","handleSubMenu","e","handleMouseLeave","useEffect","first","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","MenuItem","isLastChild","_a","Icon"],"mappings":"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"}

package/dist/shared/src/components/Menu/MenuList.es.js

@@ -0,0 +1,131 @@
+import { j as s } from "../../../../_virtual/jsx-runtime.es.js";
+import { useRef as F, useEffect as O } from "react";
+import Q from "./MenuItem.es.js";
+import { Icon as U } from "@ynput/ayon-react-components";
+import { MenuWrapper as V, Menu as X } from "./Menu.styled.es.js";
+import "../../context/RemoteModulesContext.es.js";
+import "../../context/DetailsPanelContext.es.js";
+import "../../context/ThumbnailUploaderContext.es.js";
+import "../../context/SettingsPanelContext.es.js";
+import "../../context/pip/PiPProvider.es.js";
+import "react-dom";
+import "../../context/pip/PiPWrapper.es.js";
+import "../../context/AddonProjectContext.es.js";
+import "../../context/AddonContext.es.js";
+import { usePowerpack as Y } from "../../context/PowerpackContext.es.js";
+import "../../context/MoveEntityContext.es.js";
+import "../../context/MenuContext.es.js";
+import "../../context/WebsocketContext.es.js";
+import "../../context/GlobalContext.es.js";
+import "../../context/ProjectContext.es.js";
+import "../../context/ProjectFoldersContext.es.js";
+import "../../context/UriContext.es.js";
+const xt = ({
+  items: I,
+  handleClick: L,
+  onSubMenu: n,
+  subMenu: p,
+  level: N,
+  id: q = "root-menu",
+  parentRef: j,
+  style: e,
+  onClose: d,
+  onMenuClose: l,
+  itemClassName: A,
+  itemStyle: K,
+  setPowerpackDialog: h,
+  ...P
+}) => {
+  const g = F({}), c = F(null), a = (r, m, u) => {
+    !g.current[m] || !c.current || n == null || n(r, {
+      id: m,
+      style: {
+        top: g.current[m].offsetTop + ((e == null ? void 0 : e.top) || 0) - 4,
+        right: c.current.getBoundingClientRect().width + ((e == null ? void 0 : e.right) || 0) - 12
+      },
+      items: u,
+      level: N
+    });
+  }, T = (r) => {
+    p && (n == null || n(r, { id: "parent", items: [] }));
+  };
+  return O(() => {
+    if (p && c.current) {
+      const r = c.current.querySelectorAll("li, button")[0];
+      r == null || r.focus();
+    }
+  }, [p]), /* @__PURE__ */ s.jsx(
+    V,
+    {
+      style: { paddingRight: p ? 16 : 0, ...e },
+      className: p ? "sub-menu" : "menu-list",
+      id: q,
+      onMouseLeave: T,
+      ...P,
+      ref: c,
+      children: /* @__PURE__ */ s.jsx(X, { children: I.filter((r) => !r.hidden).map((r, m) => {
+        if (r.node)
+          return r.node;
+        if ((r == null ? void 0 : r.id) === "divider") return /* @__PURE__ */ s.jsx("hr", {}, m);
+        const {
+          label: u,
+          icon: y,
+          img: B,
+          highlighted: W,
+          onClick: R,
+          link: x,
+          items: i = [],
+          id: o,
+          disableClose: _,
+          selected: z,
+          disabled: D,
+          powerFeature: f,
+          active: G,
+          ...E
+        } = r, { powerLicense: H } = Y(), k = !H && f, w = (t) => {
+          t.preventDefault(), t.stopPropagation(), f && (h == null || h(f)), l == null || l();
+        };
+        return /* @__PURE__ */ s.jsx(
+          Q,
+          {
+            tabIndex: 0,
+            label: u,
+            icon: y,
+            img: B,
+            highlighted: W,
+            items: i,
+            selected: z,
+            disabled: D,
+            powerFeature: f,
+            active: G,
+            isLink: x,
+            onClick: (t) => k ? w(t) : i.length ? a(t, o, i) : L(t, R, x, _),
+            onKeyDown: (t) => {
+              var $;
+              t.key === "Enter" && (k ? w(t) : i.length ? a(t, o, i) : L(t, R, x));
+              const J = !t.target.nextSibling;
+              if (t.key === "Tab" && J && !t.shiftKey) {
+                t.preventDefault(), t.stopPropagation();
+                const v = ($ = c.current) == null ? void 0 : $.querySelectorAll("li, button")[0];
+                v == null || v.focus();
+              }
+              t.key === "Escape" && p && j && (t.preventDefault(), t.stopPropagation(), j.focus(), d == null || d(o));
+            },
+            style: { paddingRight: i.length ? "0" : "16px", ...K },
+            ref: (t) => g.current[o] = t,
+            onMouseEnter: (t) => a(t, o, i),
+            onMouseLeave: (t) => a(t, o, []),
+            className: `${A} ${E.className || ""}`,
+            ...E,
+            children: !!i.length && /* @__PURE__ */ s.jsx(U, { icon: "arrow_right", style: { marginLeft: "auto" } })
+          },
+          `${o}-${m}`
+        );
+      }) })
+    }
+  );
+};
+export {
+  xt as MenuList
+};
+//# sourceMappingURL=MenuList.es.js.map

package/dist/shared/src/components/Menu/MenuList.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"MenuList.es.js","sources":["../../../../../src/components/Menu/MenuList.tsx"],"sourcesContent":["import React, { useEffect, useRef } from 'react'\nimport MenuItem from './MenuItem'\nimport { Icon } from '@ynput/ayon-react-components'\nimport * as Styled from './Menu.styled'\nimport { PowerpackFeature, usePowerpack } from '@shared/context'\nimport type { MenuItemType } from './Menu'\n\ninterface MenuListProps {\n  items: MenuItemType[]\n  handleClick: (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => void\n  onSubMenu?: (e: React.MouseEvent, menu: any) => void\n  subMenu?: boolean\n  level: number\n  id?: string\n  parentRef?: HTMLElement | null\n  style?: React.CSSProperties\n  onClose?: (id?: string) => void\n  onMenuClose?: () => void\n  itemClassName?: string\n  itemStyle?: React.CSSProperties\n  setPowerpackDialog?: (feature: PowerpackFeature) => void\n  [key: string]: any\n}\n\nexport const MenuList: React.FC<MenuListProps> = ({\n  items,\n  handleClick,\n  onSubMenu,\n  subMenu,\n  level,\n  id = 'root-menu',\n  parentRef,\n  style,\n  onClose,\n  onMenuClose,\n  itemClassName,\n  itemStyle,\n  setPowerpackDialog,\n  ...props\n}) => {\n  const itemRefs = useRef<{ [key: string]: HTMLElement | null }>({})\n  const menuRef = useRef<HTMLDivElement>(null)\n\n  const handleSubMenu = (e: React.MouseEvent, id: string, items: MenuItemType[]) => {\n    if (!itemRefs.current[id] || !menuRef.current) return\n    onSubMenu?.(e, {\n      id,\n      style: {\n        top: itemRefs.current[id]!.offsetTop + ((style?.top as number) || 0) - 4,\n        right: menuRef.current.getBoundingClientRect().width + ((style?.right as number) || 0) - 12,\n      },\n      items,\n      level: level,\n    })\n  }\n\n  const handleMouseLeave = (e: React.MouseEvent) => {\n    if (subMenu) {\n      onSubMenu?.(e, { id: 'parent', items: [] })\n    }\n  }\n\n  //   when a subMenu open, set focus on the first item\n  useEffect(() => {\n    if (subMenu && menuRef.current) {\n      const first = menuRef.current.querySelectorAll('li, button')[0] as HTMLElement\n      first?.focus()\n    }\n  }, [subMenu])\n\n  return (\n    <Styled.MenuWrapper\n      style={{ paddingRight: subMenu ? 16 : 0, ...style }}\n      className={subMenu ? 'sub-menu' : 'menu-list'}\n      id={id}\n      onMouseLeave={handleMouseLeave}\n      {...props}\n      ref={menuRef}\n    >\n      <Styled.Menu>\n        {items\n          .filter((item) => !item.hidden)\n          .map((item, i) => {\n            // if item is a node, return it\n            if (item.node) {\n              return item.node\n            }\n\n            if (item?.id === 'divider') return <hr key={i} />\n\n            const {\n              label,\n              icon,\n              img,\n              highlighted,\n              onClick,\n              link,\n              items = [],\n              id,\n              disableClose,\n              selected,\n              disabled,\n              powerFeature,\n              active,\n              ...props\n            } = item\n\n            const { powerLicense } = usePowerpack()\n            const isPowerFeature = !powerLicense && powerFeature\n\n            const handleClickPowerFeature = (e: React.MouseEvent) => {\n              e.preventDefault()\n              e.stopPropagation()\n              if (powerFeature) {\n                setPowerpackDialog?.(powerFeature)\n              }\n\n              // close the menu\n              onMenuClose?.()\n            }\n\n            return (\n              <MenuItem\n                tabIndex={0}\n                key={`${id}-${i}`}\n                {...{\n                  label,\n                  icon,\n                  img,\n                  highlighted,\n                  items,\n                  selected,\n                  disabled,\n                  powerFeature,\n                  active,\n                }}\n                isLink={link}\n                onClick={(e) =>\n                  isPowerFeature\n                    ? handleClickPowerFeature(e)\n                    : items.length\n                    ? handleSubMenu(e, id, items)\n                    : handleClick(e, onClick, link, disableClose)\n                }\n                onKeyDown={(e: React.KeyboardEvent<HTMLElement>) => {\n                  if (e.key === 'Enter') {\n                    if (isPowerFeature) {\n                      handleClickPowerFeature(e as any)\n                    } else if (items.length) {\n                      handleSubMenu(e as any, id, items)\n                    } else {\n                      handleClick(e as any, onClick, link)\n                    }\n                  }\n                  const isLastChild = !(e.target as HTMLElement).nextSibling\n                  if (e.key === 'Tab' && isLastChild && !e.shiftKey) {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    //   when at bottom of list, tab goes to top\n                    const first = menuRef.current?.querySelectorAll('li, button')[0] as HTMLElement\n                    first?.focus()\n                  }\n                  //   when a submenu is open, esc closes it and sets focus on the parent\n                  if (e.key === 'Escape' && subMenu && parentRef) {\n                    e.preventDefault()\n                    e.stopPropagation()\n                    parentRef.focus()\n                    onClose?.(id)\n                  }\n                }}\n                style={{ paddingRight: items.length ? '0' : '16px', ...itemStyle }}\n                ref={(e) => (itemRefs.current[id] = e)}\n                onMouseEnter={(e) => handleSubMenu(e, id, items)}\n                onMouseLeave={(e) => handleSubMenu(e, id, [])}\n                className={`${itemClassName} ${props.className || ''}`}\n                {...props}\n              >\n                {!!items.length && <Icon icon=\"arrow_right\" style={{ marginLeft: 'auto' }} />}\n              </MenuItem>\n            )\n          })}\n      </Styled.Menu>\n    </Styled.MenuWrapper>\n  )\n}\n"],"names":["MenuList","items","handleClick","onSubMenu","subMenu","level","id","parentRef","style","onClose","onMenuClose","itemClassName","itemStyle","setPowerpackDialog","props","itemRefs","useRef","menuRef","handleSubMenu","e","handleMouseLeave","useEffect","first","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","MenuItem","isLastChild","_a","Icon"],"mappings":"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"}

package/dist/shared/src/components/Menu/useMenuPosition.cjs.js

@@ -0,0 +1,2 @@
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("react");function w(f,i,a="right"){if(!f)return null;const o=f.getBoundingClientRect(),s=i==null?void 0:i.getBoundingClientRect(),t=(s==null?void 0:s.width)||200,n=(s==null?void 0:s.height)||300,e=8,l=window.innerWidth,h=window.innerHeight;let d=o.bottom+8-42,r;if(d+n>h-e){const c=o.top-8-n;c>=e?d=c:d=Math.min(d,h-n-e)}if(a==="right"){const c=o.right-t;c>=e?r=c:r=o.left}else{const c=o.left;c+t<=l-e?r=c:r=o.right-t}return r!==void 0&&(r=Math.max(e,Math.min(r,l-t-e))),{top:d,left:r}}function v(f,i,a="right"){const[o,s]=u.useState(null),t=u.useRef(null),n=u.useCallback(()=>{let e=f;if(!e&&i&&(e=document.getElementById(i)),!e){i&&console.warn(`Target element with id '${i}' not found`);return}if(!t.current)return;const l=w(e,t.current,a);l&&s(l)},[f,i,a]);return u.useLayoutEffect(()=>{n()},[n]),u.useEffect(()=>{const e=()=>requestAnimationFrame(n);return window.addEventListener("resize",e,{passive:!0}),window.addEventListener("scroll",e,{passive:!0}),()=>{window.removeEventListener("resize",e),window.removeEventListener("scroll",e)}},[n]),u.useEffect(()=>{if(!t.current)return;const e=new ResizeObserver(()=>{n()});return e.observe(t.current),()=>{e.disconnect()}},[n]),{position:o,menuRef:t}}exports.useMenuPosition=v;
+//# sourceMappingURL=useMenuPosition.cjs.js.map

package/dist/shared/src/components/Menu/useMenuPosition.cjs.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuPosition.cjs.js","sources":["../../../../../src/components/Menu/useMenuPosition.ts"],"sourcesContent":["import { useEffect, useRef, useState, useCallback, useLayoutEffect } from 'react'\n\ninterface MenuPosition {\n  top: number\n  left?: number\n  right?: number\n  bottom?: number\n}\n\nfunction calculateMenuPosition(\n  targetElement: HTMLElement | null,\n  menuElement: HTMLElement | null,\n  align: 'left' | 'right' = 'right',\n): MenuPosition | null {\n  if (!targetElement) return null\n\n  const targetRect = targetElement.getBoundingClientRect()\n  const menuRect = menuElement?.getBoundingClientRect()\n  const menuWidth = menuRect?.width || 200\n  const menuHeight = menuRect?.height || 300\n  const padding = 8 // Minimum distance from screen edges\n  const viewportWidth = window.innerWidth\n  const viewportHeight = window.innerHeight\n\n  // Default position (below the target)\n  let top = targetRect.bottom + 8 - 42\n  let left: number | undefined\n  let right: number | undefined\n  let bottom: number | undefined\n\n  // Check if menu fits below, otherwise flip to above\n  if (top + menuHeight > viewportHeight - padding) {\n    // If it doesn't fit below, check if it fits above\n    const topAbove = targetRect.top - 8 - menuHeight\n    if (topAbove >= padding) {\n      top = topAbove\n    } else {\n      // If it fits neither, prefer the side with more space or clamp\n      // For now, let's clamp to bottom of viewport\n      top = Math.min(top, viewportHeight - menuHeight - padding)\n      // Or if we want to stick to bottom edge:\n      // bottom = padding\n      // top = undefined\n    }\n  }\n\n  // Horizontal positioning\n  if (align === 'right') {\n    // Align right edge of menu with right edge of target\n    // left position would be: targetRect.right - menuWidth\n    const potentialLeft = targetRect.right - menuWidth\n\n    if (potentialLeft >= padding) {\n      // Fits on the left side\n      left = potentialLeft\n    } else {\n      // Doesn't fit, try aligning left edge with target left\n      left = targetRect.left\n    }\n  } else {\n    // Align left edge of menu with left edge of target\n    const potentialLeft = targetRect.left\n    if (potentialLeft + menuWidth <= viewportWidth - padding) {\n      left = potentialLeft\n    } else {\n      // Doesn't fit, try aligning right edge with target right\n      left = targetRect.right - menuWidth\n    }\n  }\n\n  // Final clamp for horizontal to ensure it doesn't overflow viewport\n  if (left !== undefined) {\n    left = Math.max(padding, Math.min(left, viewportWidth - menuWidth - padding))\n  }\n\n  // Convert to CSS properties.\n  // Note: We are using fixed positioning relative to viewport usually,\n  // but if the dialog is in a portal, top/left are relative to the window.\n  // If we want to support 'right' CSS property for better resizing behavior:\n  if (align === 'right' && left !== undefined) {\n    // If we aligned to right, maybe we want to set 'right' property instead of 'left'?\n    // But 'left' is easier to clamp. Let's stick to 'left' and 'top' for simplicity unless 'right' is explicitly needed.\n  }\n\n  return { top, left }\n}\n\ninterface UseMenuPositionReturn {\n  position: MenuPosition | null\n  menuRef: React.RefObject<HTMLDivElement>\n}\n\nexport function useMenuPosition(\n  target: HTMLElement | null,\n  targetId: string,\n  align: 'left' | 'right' = 'right',\n): UseMenuPositionReturn {\n  const [position, setPosition] = useState<MenuPosition | null>(null)\n  const menuRef = useRef<HTMLDivElement>(null)\n\n  const updatePosition = useCallback(() => {\n    let targetElement: HTMLElement | null = target\n\n    if (!targetElement && targetId) {\n      targetElement = document.getElementById(targetId)\n    }\n\n    if (!targetElement) {\n      // Only warn if we expected a target but didn't find one\n      if (targetId) console.warn(`Target element with id '${targetId}' not found`)\n      return\n    }\n\n    // We need the menu element to calculate its dimensions\n    if (!menuRef.current) return\n\n    const newPosition = calculateMenuPosition(targetElement, menuRef.current, align)\n    if (newPosition) {\n      setPosition(newPosition)\n    }\n  }, [target, targetId, align])\n\n  // Initial position update\n  useLayoutEffect(() => {\n    updatePosition()\n  }, [updatePosition])\n\n  // Update on resize and scroll\n  useEffect(() => {\n    const handleEvent = () => requestAnimationFrame(updatePosition)\n\n    window.addEventListener('resize', handleEvent, { passive: true })\n    window.addEventListener('scroll', handleEvent, { passive: true })\n\n    return () => {\n      window.removeEventListener('resize', handleEvent)\n      window.removeEventListener('scroll', handleEvent)\n    }\n  }, [updatePosition])\n\n  // Observe menu size changes\n  useEffect(() => {\n    if (!menuRef.current) return\n\n    const resizeObserver = new ResizeObserver(() => {\n      updatePosition()\n    })\n\n    resizeObserver.observe(menuRef.current)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [updatePosition])\n\n  return { position, menuRef }\n}\n"],"names":["calculateMenuPosition","targetElement","menuElement","align","targetRect","menuRect","menuWidth","menuHeight","padding","viewportWidth","viewportHeight","top","left","topAbove","potentialLeft","useMenuPosition","target","targetId","position","setPosition","useState","menuRef","useRef","updatePosition","useCallback","newPosition","useLayoutEffect","useEffect","handleEvent","resizeObserver"],"mappings":"yGASA,SAASA,EACPC,EACAC,EACAC,EAA0B,QACL,CACjB,GAAA,CAACF,EAAsB,OAAA,KAErB,MAAAG,EAAaH,EAAc,sBAAsB,EACjDI,EAAWH,GAAA,YAAAA,EAAa,wBACxBI,GAAYD,GAAA,YAAAA,EAAU,QAAS,IAC/BE,GAAaF,GAAA,YAAAA,EAAU,SAAU,IACjCG,EAAU,EACVC,EAAgB,OAAO,WACvBC,EAAiB,OAAO,YAG1B,IAAAC,EAAMP,EAAW,OAAS,EAAI,GAC9BQ,EAKA,GAAAD,EAAMJ,EAAaG,EAAiBF,EAAS,CAEzC,MAAAK,EAAWT,EAAW,IAAM,EAAIG,EAClCM,GAAYL,EACRG,EAAAE,EAINF,EAAM,KAAK,IAAIA,EAAKD,EAAiBH,EAAaC,CAAO,CAI3D,CAIF,GAAIL,IAAU,QAAS,CAGf,MAAAW,EAAgBV,EAAW,MAAQE,EAErCQ,GAAiBN,EAEZI,EAAAE,EAGPF,EAAOR,EAAW,IACpB,KACK,CAEL,MAAMU,EAAgBV,EAAW,KAC7BU,EAAgBR,GAAaG,EAAgBD,EACxCI,EAAAE,EAGPF,EAAOR,EAAW,MAAQE,CAC5B,CAIF,OAAIM,IAAS,SACJA,EAAA,KAAK,IAAIJ,EAAS,KAAK,IAAII,EAAMH,EAAgBH,EAAYE,CAAO,CAAC,GAYvE,CAAE,IAAAG,EAAK,KAAAC,CAAK,CACrB,CAOO,SAASG,EACdC,EACAC,EACAd,EAA0B,QACH,CACvB,KAAM,CAACe,EAAUC,CAAW,EAAIC,EAAAA,SAA8B,IAAI,EAC5DC,EAAUC,SAAuB,IAAI,EAErCC,EAAiBC,EAAAA,YAAY,IAAM,CACvC,IAAIvB,EAAoCe,EAMxC,GAJI,CAACf,GAAiBgB,IACJhB,EAAA,SAAS,eAAegB,CAAQ,GAG9C,CAAChB,EAAe,CAEdgB,GAAU,QAAQ,KAAK,2BAA2BA,CAAQ,aAAa,EAC3E,MAAA,CAIE,GAAA,CAACI,EAAQ,QAAS,OAEtB,MAAMI,EAAczB,EAAsBC,EAAeoB,EAAQ,QAASlB,CAAK,EAC3EsB,GACFN,EAAYM,CAAW,CAExB,EAAA,CAACT,EAAQC,EAAUd,CAAK,CAAC,EAG5BuB,OAAAA,EAAAA,gBAAgB,IAAM,CACLH,EAAA,CAAA,EACd,CAACA,CAAc,CAAC,EAGnBI,EAAAA,UAAU,IAAM,CACR,MAAAC,EAAc,IAAM,sBAAsBL,CAAc,EAE9D,cAAO,iBAAiB,SAAUK,EAAa,CAAE,QAAS,GAAM,EAChE,OAAO,iBAAiB,SAAUA,EAAa,CAAE,QAAS,GAAM,EAEzD,IAAM,CACJ,OAAA,oBAAoB,SAAUA,CAAW,EACzC,OAAA,oBAAoB,SAAUA,CAAW,CAClD,CAAA,EACC,CAACL,CAAc,CAAC,EAGnBI,EAAAA,UAAU,IAAM,CACV,GAAA,CAACN,EAAQ,QAAS,OAEhB,MAAAQ,EAAiB,IAAI,eAAe,IAAM,CAC/BN,EAAA,CAAA,CAChB,EAEc,OAAAM,EAAA,QAAQR,EAAQ,OAAO,EAE/B,IAAM,CACXQ,EAAe,WAAW,CAC5B,CAAA,EACC,CAACN,CAAc,CAAC,EAEZ,CAAE,SAAAL,EAAU,QAAAG,CAAQ,CAC7B"}

package/dist/shared/src/components/Menu/useMenuPosition.es.js

@@ -0,0 +1,50 @@
+import { useState as a, useRef as v, useCallback as p, useLayoutEffect as g, useEffect as w } from "react";
+function L(u, i, d = "right") {
+  if (!u) return null;
+  const o = u.getBoundingClientRect(), r = i == null ? void 0 : i.getBoundingClientRect(), t = (r == null ? void 0 : r.width) || 200, n = (r == null ? void 0 : r.height) || 300, e = 8, f = window.innerWidth, h = window.innerHeight;
+  let l = o.bottom + 8 - 42, s;
+  if (l + n > h - e) {
+    const c = o.top - 8 - n;
+    c >= e ? l = c : l = Math.min(l, h - n - e);
+  }
+  if (d === "right") {
+    const c = o.right - t;
+    c >= e ? s = c : s = o.left;
+  } else {
+    const c = o.left;
+    c + t <= f - e ? s = c : s = o.right - t;
+  }
+  return s !== void 0 && (s = Math.max(e, Math.min(s, f - t - e))), { top: l, left: s };
+}
+function m(u, i, d = "right") {
+  const [o, r] = a(null), t = v(null), n = p(() => {
+    let e = u;
+    if (!e && i && (e = document.getElementById(i)), !e) {
+      i && console.warn(`Target element with id '${i}' not found`);
+      return;
+    }
+    if (!t.current) return;
+    const f = L(e, t.current, d);
+    f && r(f);
+  }, [u, i, d]);
+  return g(() => {
+    n();
+  }, [n]), w(() => {
+    const e = () => requestAnimationFrame(n);
+    return window.addEventListener("resize", e, { passive: !0 }), window.addEventListener("scroll", e, { passive: !0 }), () => {
+      window.removeEventListener("resize", e), window.removeEventListener("scroll", e);
+    };
+  }, [n]), w(() => {
+    if (!t.current) return;
+    const e = new ResizeObserver(() => {
+      n();
+    });
+    return e.observe(t.current), () => {
+      e.disconnect();
+    };
+  }, [n]), { position: o, menuRef: t };
+}
+export {
+  m as useMenuPosition
+};
+//# sourceMappingURL=useMenuPosition.es.js.map

package/dist/shared/src/components/Menu/useMenuPosition.es.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useMenuPosition.es.js","sources":["../../../../../src/components/Menu/useMenuPosition.ts"],"sourcesContent":["import { useEffect, useRef, useState, useCallback, useLayoutEffect } from 'react'\n\ninterface MenuPosition {\n  top: number\n  left?: number\n  right?: number\n  bottom?: number\n}\n\nfunction calculateMenuPosition(\n  targetElement: HTMLElement | null,\n  menuElement: HTMLElement | null,\n  align: 'left' | 'right' = 'right',\n): MenuPosition | null {\n  if (!targetElement) return null\n\n  const targetRect = targetElement.getBoundingClientRect()\n  const menuRect = menuElement?.getBoundingClientRect()\n  const menuWidth = menuRect?.width || 200\n  const menuHeight = menuRect?.height || 300\n  const padding = 8 // Minimum distance from screen edges\n  const viewportWidth = window.innerWidth\n  const viewportHeight = window.innerHeight\n\n  // Default position (below the target)\n  let top = targetRect.bottom + 8 - 42\n  let left: number | undefined\n  let right: number | undefined\n  let bottom: number | undefined\n\n  // Check if menu fits below, otherwise flip to above\n  if (top + menuHeight > viewportHeight - padding) {\n    // If it doesn't fit below, check if it fits above\n    const topAbove = targetRect.top - 8 - menuHeight\n    if (topAbove >= padding) {\n      top = topAbove\n    } else {\n      // If it fits neither, prefer the side with more space or clamp\n      // For now, let's clamp to bottom of viewport\n      top = Math.min(top, viewportHeight - menuHeight - padding)\n      // Or if we want to stick to bottom edge:\n      // bottom = padding\n      // top = undefined\n    }\n  }\n\n  // Horizontal positioning\n  if (align === 'right') {\n    // Align right edge of menu with right edge of target\n    // left position would be: targetRect.right - menuWidth\n    const potentialLeft = targetRect.right - menuWidth\n\n    if (potentialLeft >= padding) {\n      // Fits on the left side\n      left = potentialLeft\n    } else {\n      // Doesn't fit, try aligning left edge with target left\n      left = targetRect.left\n    }\n  } else {\n    // Align left edge of menu with left edge of target\n    const potentialLeft = targetRect.left\n    if (potentialLeft + menuWidth <= viewportWidth - padding) {\n      left = potentialLeft\n    } else {\n      // Doesn't fit, try aligning right edge with target right\n      left = targetRect.right - menuWidth\n    }\n  }\n\n  // Final clamp for horizontal to ensure it doesn't overflow viewport\n  if (left !== undefined) {\n    left = Math.max(padding, Math.min(left, viewportWidth - menuWidth - padding))\n  }\n\n  // Convert to CSS properties.\n  // Note: We are using fixed positioning relative to viewport usually,\n  // but if the dialog is in a portal, top/left are relative to the window.\n  // If we want to support 'right' CSS property for better resizing behavior:\n  if (align === 'right' && left !== undefined) {\n    // If we aligned to right, maybe we want to set 'right' property instead of 'left'?\n    // But 'left' is easier to clamp. Let's stick to 'left' and 'top' for simplicity unless 'right' is explicitly needed.\n  }\n\n  return { top, left }\n}\n\ninterface UseMenuPositionReturn {\n  position: MenuPosition | null\n  menuRef: React.RefObject<HTMLDivElement>\n}\n\nexport function useMenuPosition(\n  target: HTMLElement | null,\n  targetId: string,\n  align: 'left' | 'right' = 'right',\n): UseMenuPositionReturn {\n  const [position, setPosition] = useState<MenuPosition | null>(null)\n  const menuRef = useRef<HTMLDivElement>(null)\n\n  const updatePosition = useCallback(() => {\n    let targetElement: HTMLElement | null = target\n\n    if (!targetElement && targetId) {\n      targetElement = document.getElementById(targetId)\n    }\n\n    if (!targetElement) {\n      // Only warn if we expected a target but didn't find one\n      if (targetId) console.warn(`Target element with id '${targetId}' not found`)\n      return\n    }\n\n    // We need the menu element to calculate its dimensions\n    if (!menuRef.current) return\n\n    const newPosition = calculateMenuPosition(targetElement, menuRef.current, align)\n    if (newPosition) {\n      setPosition(newPosition)\n    }\n  }, [target, targetId, align])\n\n  // Initial position update\n  useLayoutEffect(() => {\n    updatePosition()\n  }, [updatePosition])\n\n  // Update on resize and scroll\n  useEffect(() => {\n    const handleEvent = () => requestAnimationFrame(updatePosition)\n\n    window.addEventListener('resize', handleEvent, { passive: true })\n    window.addEventListener('scroll', handleEvent, { passive: true })\n\n    return () => {\n      window.removeEventListener('resize', handleEvent)\n      window.removeEventListener('scroll', handleEvent)\n    }\n  }, [updatePosition])\n\n  // Observe menu size changes\n  useEffect(() => {\n    if (!menuRef.current) return\n\n    const resizeObserver = new ResizeObserver(() => {\n      updatePosition()\n    })\n\n    resizeObserver.observe(menuRef.current)\n\n    return () => {\n      resizeObserver.disconnect()\n    }\n  }, [updatePosition])\n\n  return { position, menuRef }\n}\n"],"names":["calculateMenuPosition","targetElement","menuElement","align","targetRect","menuRect","menuWidth","menuHeight","padding","viewportWidth","viewportHeight","top","left","topAbove","potentialLeft","useMenuPosition","target","targetId","position","setPosition","useState","menuRef","useRef","updatePosition","useCallback","newPosition","useLayoutEffect","useEffect","handleEvent","resizeObserver"],"mappings":";AASA,SAASA,EACPC,GACAC,GACAC,IAA0B,SACL;AACjB,MAAA,CAACF,EAAsB,QAAA;AAErB,QAAAG,IAAaH,EAAc,sBAAsB,GACjDI,IAAWH,KAAA,gBAAAA,EAAa,yBACxBI,KAAYD,KAAA,gBAAAA,EAAU,UAAS,KAC/BE,KAAaF,KAAA,gBAAAA,EAAU,WAAU,KACjCG,IAAU,GACVC,IAAgB,OAAO,YACvBC,IAAiB,OAAO;AAG1B,MAAAC,IAAMP,EAAW,SAAS,IAAI,IAC9BQ;AAKA,MAAAD,IAAMJ,IAAaG,IAAiBF,GAAS;AAEzC,UAAAK,IAAWT,EAAW,MAAM,IAAIG;AACtC,IAAIM,KAAYL,IACRG,IAAAE,IAINF,IAAM,KAAK,IAAIA,GAAKD,IAAiBH,IAAaC,CAAO;AAAA,EAI3D;AAIF,MAAIL,MAAU,SAAS;AAGf,UAAAW,IAAgBV,EAAW,QAAQE;AAEzC,IAAIQ,KAAiBN,IAEZI,IAAAE,IAGPF,IAAOR,EAAW;AAAA,EACpB,OACK;AAEL,UAAMU,IAAgBV,EAAW;AAC7B,IAAAU,IAAgBR,KAAaG,IAAgBD,IACxCI,IAAAE,IAGPF,IAAOR,EAAW,QAAQE;AAAA,EAC5B;AAIF,SAAIM,MAAS,WACJA,IAAA,KAAK,IAAIJ,GAAS,KAAK,IAAII,GAAMH,IAAgBH,IAAYE,CAAO,CAAC,IAYvE,EAAE,KAAAG,GAAK,MAAAC,EAAK;AACrB;AAOO,SAASG,EACdC,GACAC,GACAd,IAA0B,SACH;AACvB,QAAM,CAACe,GAAUC,CAAW,IAAIC,EAA8B,IAAI,GAC5DC,IAAUC,EAAuB,IAAI,GAErCC,IAAiBC,EAAY,MAAM;AACvC,QAAIvB,IAAoCe;AAMxC,QAJI,CAACf,KAAiBgB,MACJhB,IAAA,SAAS,eAAegB,CAAQ,IAG9C,CAAChB,GAAe;AAElB,MAAIgB,KAAU,QAAQ,KAAK,2BAA2BA,CAAQ,aAAa;AAC3E;AAAA,IAAA;AAIE,QAAA,CAACI,EAAQ,QAAS;AAEtB,UAAMI,IAAczB,EAAsBC,GAAeoB,EAAQ,SAASlB,CAAK;AAC/E,IAAIsB,KACFN,EAAYM,CAAW;AAAA,EAExB,GAAA,CAACT,GAAQC,GAAUd,CAAK,CAAC;AAG5B,SAAAuB,EAAgB,MAAM;AACL,IAAAH,EAAA;AAAA,EAAA,GACd,CAACA,CAAc,CAAC,GAGnBI,EAAU,MAAM;AACR,UAAAC,IAAc,MAAM,sBAAsBL,CAAc;AAE9D,kBAAO,iBAAiB,UAAUK,GAAa,EAAE,SAAS,IAAM,GAChE,OAAO,iBAAiB,UAAUA,GAAa,EAAE,SAAS,IAAM,GAEzD,MAAM;AACJ,aAAA,oBAAoB,UAAUA,CAAW,GACzC,OAAA,oBAAoB,UAAUA,CAAW;AAAA,IAClD;AAAA,EAAA,GACC,CAACL,CAAc,CAAC,GAGnBI,EAAU,MAAM;AACV,QAAA,CAACN,EAAQ,QAAS;AAEhB,UAAAQ,IAAiB,IAAI,eAAe,MAAM;AAC/B,MAAAN,EAAA;AAAA,IAAA,CAChB;AAEc,WAAAM,EAAA,QAAQR,EAAQ,OAAO,GAE/B,MAAM;AACX,MAAAQ,EAAe,WAAW;AAAA,IAC5B;AAAA,EAAA,GACC,CAACN,CAAc,CAAC,GAEZ,EAAE,UAAAL,GAAU,SAAAG,EAAQ;AAC7B;"}

package/dist/shared/src/components/Powerpack/PowerpackButton.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../_virtual/jsx-runtime.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");const l=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");const s=require("@ynput/ayon-react-components"),d=require("clsx"),q=require("react"),y=require("styled-components"),m=y(s.Button)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const u=require("../../../../_virtual/jsx-runtime.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");const l=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");const s=require("@ynput/ayon-react-components"),d=require("clsx"),q=require("react"),y=require("styled-components"),m=y(s.Button)`
   background-color: unset !important;
   color: var(--md-sys-color-tertiary);
   transition: color 0.2s, background-color 0.2s, opacity 0.2s;

package/dist/shared/src/components/Powerpack/PowerpackButton.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"PowerpackButton.cjs.js","sources":["../../../../../src/components/Powerpack/PowerpackButton.tsx"],"sourcesContent":["import { PowerpackFeature, usePowerpack } from '@shared/context'\nimport { Button, ButtonProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, MouseEvent } from 'react'\nimport styled from 'styled-components'\n\nconst StyledButton = styled(Button)`\n  background-color: unset !important;\n  color: var(--md-sys-color-tertiary);\n  transition: color 0.2s, background-color 0.2s, opacity 0.2s;\n  border-radius: var(--border-radius-xl);\n\n  &.filled {\n    background-color: var(--md-sys-color-tertiary) !important;\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  &.border {\n    border: 1px solid var(--md-sys-color-tertiary);\n  }\n\n  &:hover {\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n`\n\nexport interface PowerpackButtonProps extends ButtonProps {\n  feature: PowerpackFeature\n  filled?: boolean\n}\n\nexport const PowerpackButton = forwardRef<HTMLButtonElement, PowerpackButtonProps>(\n  ({ feature, filled, ...props }, ref) => {\n    const { setPowerpackDialog } = usePowerpack()\n\n    const handleOnClick = (e: MouseEvent<HTMLButtonElement>) => {\n      // open a dialog to subscribe to Ynput Cloud\n      setPowerpackDialog(feature)\n      // Call the original onClick handler\n      props.onClick?.(e)\n    }\n\n    return (\n      <StyledButton\n        variant={props.variant || 'tertiary'}\n        icon={props.icon || 'bolt'}\n        {...props}\n        ref={ref}\n        onClick={handleOnClick}\n        className={clsx('cloud-button', props.className || '', {\n          border: !!props.children,\n          filled,\n        })}\n        data-tooltip={`Power feature`}\n        data-tooltip-delay={0}\n      >\n        {props.children}\n      </StyledButton>\n    )\n  },\n)\n"],"names":["StyledButton","styled","Button","PowerpackButton","forwardRef","feature","filled","props","ref","setPowerpackDialog","usePowerpack","handleOnClick","e","_a","jsx","clsx"],"mappings":"i6BAMMA,EAAeC,EAAOC,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BrBC,EAAkBC,EAAA,WAC7B,CAAC,CAAE,QAAAC,EAAS,OAAAC,EAAQ,GAAGC,CAAA,EAASC,IAAQ,CAChC,KAAA,CAAE,mBAAAC,CAAmB,EAAIC,eAAa,EAEtCC,EAAiBC,GAAqC,OAE1DH,EAAmBJ,CAAO,GAE1BQ,EAAAN,EAAM,UAAN,MAAAM,EAAA,KAAAN,EAAgBK,EAClB,EAGE,OAAAE,EAAA,kBAAA,IAACd,EAAA,CACC,QAASO,EAAM,SAAW,WAC1B,KAAMA,EAAM,MAAQ,OACnB,GAAGA,EACJ,IAAAC,EACA,QAASG,EACT,UAAWI,EAAK,eAAgBR,EAAM,WAAa,GAAI,CACrD,OAAQ,CAAC,CAACA,EAAM,SAChB,OAAAD,CAAA,CACD,EACD,eAAc,gBACd,qBAAoB,EAEnB,SAAMC,EAAA,QAAA,CACT,CAAA,CAGN"}
+{"version":3,"file":"PowerpackButton.cjs.js","sources":["../../../../../src/components/Powerpack/PowerpackButton.tsx"],"sourcesContent":["import { PowerpackFeature, usePowerpack } from '@shared/context'\nimport { Button, ButtonProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, MouseEvent } from 'react'\nimport styled from 'styled-components'\n\nconst StyledButton = styled(Button)`\n  background-color: unset !important;\n  color: var(--md-sys-color-tertiary);\n  transition: color 0.2s, background-color 0.2s, opacity 0.2s;\n  border-radius: var(--border-radius-xl);\n\n  &.filled {\n    background-color: var(--md-sys-color-tertiary) !important;\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  &.border {\n    border: 1px solid var(--md-sys-color-tertiary);\n  }\n\n  &:hover {\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n`\n\nexport interface PowerpackButtonProps extends ButtonProps {\n  feature: PowerpackFeature\n  filled?: boolean\n}\n\nexport const PowerpackButton = forwardRef<HTMLButtonElement, PowerpackButtonProps>(\n  ({ feature, filled, ...props }, ref) => {\n    const { setPowerpackDialog } = usePowerpack()\n\n    const handleOnClick = (e: MouseEvent<HTMLButtonElement>) => {\n      // open a dialog to subscribe to Ynput Cloud\n      setPowerpackDialog(feature)\n      // Call the original onClick handler\n      props.onClick?.(e)\n    }\n\n    return (\n      <StyledButton\n        variant={props.variant || 'tertiary'}\n        icon={props.icon || 'bolt'}\n        {...props}\n        ref={ref}\n        onClick={handleOnClick}\n        className={clsx('cloud-button', props.className || '', {\n          border: !!props.children,\n          filled,\n        })}\n        data-tooltip={`Power feature`}\n        data-tooltip-delay={0}\n      >\n        {props.children}\n      </StyledButton>\n    )\n  },\n)\n"],"names":["StyledButton","styled","Button","PowerpackButton","forwardRef","feature","filled","props","ref","setPowerpackDialog","usePowerpack","handleOnClick","e","_a","jsx","clsx"],"mappings":"ijCAMMA,EAAeC,EAAOC,QAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA6BrBC,EAAkBC,EAAA,WAC7B,CAAC,CAAE,QAAAC,EAAS,OAAAC,EAAQ,GAAGC,CAAA,EAASC,IAAQ,CAChC,KAAA,CAAE,mBAAAC,CAAmB,EAAIC,eAAa,EAEtCC,EAAiBC,GAAqC,OAE1DH,EAAmBJ,CAAO,GAE1BQ,EAAAN,EAAM,UAAN,MAAAM,EAAA,KAAAN,EAAgBK,EAClB,EAGE,OAAAE,EAAA,kBAAA,IAACd,EAAA,CACC,QAASO,EAAM,SAAW,WAC1B,KAAMA,EAAM,MAAQ,OACnB,GAAGA,EACJ,IAAAC,EACA,QAASG,EACT,UAAWI,EAAK,eAAgBR,EAAM,WAAa,GAAI,CACrD,OAAQ,CAAC,CAACA,EAAM,SAChB,OAAAD,CAAA,CACD,EACD,eAAc,gBACd,qBAAoB,EAEnB,SAAMC,EAAA,QAAA,CACT,CAAA,CAGN"}

package/dist/shared/src/components/Powerpack/PowerpackButton.es.js

@@ -13,11 +13,14 @@ import "../../context/MoveEntityContext.es.js";
 import "../../context/MenuContext.es.js";
 import "../../context/WebsocketContext.es.js";
 import "../../context/GlobalContext.es.js";
+import "../../context/ProjectContext.es.js";
+import "../../context/ProjectFoldersContext.es.js";
+import "../../context/UriContext.es.js";
 import { Button as d } from "@ynput/ayon-react-components";
 import s from "clsx";
 import { forwardRef as u } from "react";
 import y from "styled-components";
-const f = y(d)`
+const p = y(d)`
   background-color: unset !important;
   color: var(--md-sys-color-tertiary);
   transition: color 0.2s, background-color 0.2s, opacity 0.2s;
@@ -39,20 +42,20 @@ const f = y(d)`
   .icon {
     font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
   }
-`, F = u(
+`, O = u(
   ({ feature: t, filled: i, ...o }, a) => {
-    const { setPowerpackDialog: c } = l(), e = (m) => {
+    const { setPowerpackDialog: m } = l(), c = (e) => {
       var r;
-      c(t), (r = o.onClick) == null || r.call(o, m);
+      m(t), (r = o.onClick) == null || r.call(o, e);
     };
     return /* @__PURE__ */ n.jsx(
-      f,
+      p,
       {
         variant: o.variant || "tertiary",
         icon: o.icon || "bolt",
         ...o,
         ref: a,
-        onClick: e,
+        onClick: c,
         className: s("cloud-button", o.className || "", {
           border: !!o.children,
           filled: i
@@ -65,6 +68,6 @@ const f = y(d)`
   }
 );
 export {
-  F as PowerpackButton
+  O as PowerpackButton
 };
 //# sourceMappingURL=PowerpackButton.es.js.map

package/dist/shared/src/components/Powerpack/PowerpackButton.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"PowerpackButton.es.js","sources":["../../../../../src/components/Powerpack/PowerpackButton.tsx"],"sourcesContent":["import { PowerpackFeature, usePowerpack } from '@shared/context'\nimport { Button, ButtonProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, MouseEvent } from 'react'\nimport styled from 'styled-components'\n\nconst StyledButton = styled(Button)`\n  background-color: unset !important;\n  color: var(--md-sys-color-tertiary);\n  transition: color 0.2s, background-color 0.2s, opacity 0.2s;\n  border-radius: var(--border-radius-xl);\n\n  &.filled {\n    background-color: var(--md-sys-color-tertiary) !important;\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  &.border {\n    border: 1px solid var(--md-sys-color-tertiary);\n  }\n\n  &:hover {\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n`\n\nexport interface PowerpackButtonProps extends ButtonProps {\n  feature: PowerpackFeature\n  filled?: boolean\n}\n\nexport const PowerpackButton = forwardRef<HTMLButtonElement, PowerpackButtonProps>(\n  ({ feature, filled, ...props }, ref) => {\n    const { setPowerpackDialog } = usePowerpack()\n\n    const handleOnClick = (e: MouseEvent<HTMLButtonElement>) => {\n      // open a dialog to subscribe to Ynput Cloud\n      setPowerpackDialog(feature)\n      // Call the original onClick handler\n      props.onClick?.(e)\n    }\n\n    return (\n      <StyledButton\n        variant={props.variant || 'tertiary'}\n        icon={props.icon || 'bolt'}\n        {...props}\n        ref={ref}\n        onClick={handleOnClick}\n        className={clsx('cloud-button', props.className || '', {\n          border: !!props.children,\n          filled,\n        })}\n        data-tooltip={`Power feature`}\n        data-tooltip-delay={0}\n      >\n        {props.children}\n      </StyledButton>\n    )\n  },\n)\n"],"names":["StyledButton","styled","Button","PowerpackButton","forwardRef","feature","filled","props","ref","setPowerpackDialog","usePowerpack","handleOnClick","e","_a","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;AAMA,MAAMA,IAAeC,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6BrBC,IAAkBC;AAAA,EAC7B,CAAC,EAAE,SAAAC,GAAS,QAAAC,GAAQ,GAAGC,EAAA,GAASC,MAAQ;AAChC,UAAA,EAAE,oBAAAC,EAAmB,IAAIC,EAAa,GAEtCC,IAAgB,CAACC,MAAqC;;AAE1D,MAAAH,EAAmBJ,CAAO,IAE1BQ,IAAAN,EAAM,YAAN,QAAAM,EAAA,KAAAN,GAAgBK;AAAA,IAClB;AAGE,WAAAE,gBAAAA,EAAA;AAAA,MAACd;AAAA,MAAA;AAAA,QACC,SAASO,EAAM,WAAW;AAAA,QAC1B,MAAMA,EAAM,QAAQ;AAAA,QACnB,GAAGA;AAAA,QACJ,KAAAC;AAAA,QACA,SAASG;AAAA,QACT,WAAWI,EAAK,gBAAgBR,EAAM,aAAa,IAAI;AAAA,UACrD,QAAQ,CAAC,CAACA,EAAM;AAAA,UAChB,QAAAD;AAAA,QAAA,CACD;AAAA,QACD,gBAAc;AAAA,QACd,sBAAoB;AAAA,QAEnB,UAAMC,EAAA;AAAA,MAAA;AAAA,IACT;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"PowerpackButton.es.js","sources":["../../../../../src/components/Powerpack/PowerpackButton.tsx"],"sourcesContent":["import { PowerpackFeature, usePowerpack } from '@shared/context'\nimport { Button, ButtonProps } from '@ynput/ayon-react-components'\nimport clsx from 'clsx'\nimport { forwardRef, MouseEvent } from 'react'\nimport styled from 'styled-components'\n\nconst StyledButton = styled(Button)`\n  background-color: unset !important;\n  color: var(--md-sys-color-tertiary);\n  transition: color 0.2s, background-color 0.2s, opacity 0.2s;\n  border-radius: var(--border-radius-xl);\n\n  &.filled {\n    background-color: var(--md-sys-color-tertiary) !important;\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  &.border {\n    border: 1px solid var(--md-sys-color-tertiary);\n  }\n\n  &:hover {\n    color: var(--md-sys-color-on-tertiary);\n  }\n\n  .icon {\n    font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;\n  }\n`\n\nexport interface PowerpackButtonProps extends ButtonProps {\n  feature: PowerpackFeature\n  filled?: boolean\n}\n\nexport const PowerpackButton = forwardRef<HTMLButtonElement, PowerpackButtonProps>(\n  ({ feature, filled, ...props }, ref) => {\n    const { setPowerpackDialog } = usePowerpack()\n\n    const handleOnClick = (e: MouseEvent<HTMLButtonElement>) => {\n      // open a dialog to subscribe to Ynput Cloud\n      setPowerpackDialog(feature)\n      // Call the original onClick handler\n      props.onClick?.(e)\n    }\n\n    return (\n      <StyledButton\n        variant={props.variant || 'tertiary'}\n        icon={props.icon || 'bolt'}\n        {...props}\n        ref={ref}\n        onClick={handleOnClick}\n        className={clsx('cloud-button', props.className || '', {\n          border: !!props.children,\n          filled,\n        })}\n        data-tooltip={`Power feature`}\n        data-tooltip-delay={0}\n      >\n        {props.children}\n      </StyledButton>\n    )\n  },\n)\n"],"names":["StyledButton","styled","Button","PowerpackButton","forwardRef","feature","filled","props","ref","setPowerpackDialog","usePowerpack","handleOnClick","_a","jsx","clsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;AAMA,MAAMA,IAAeC,EAAOC,CAAM;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA6BrBC,IAAkBC;AAAA,EAC7B,CAAC,EAAE,SAAAC,GAAS,QAAAC,GAAQ,GAAGC,EAAA,GAASC,MAAQ;AAChC,UAAA,EAAE,oBAAAC,EAAmB,IAAIC,EAAa,GAEtCC,IAAgB,CAAC,MAAqC;;AAE1D,MAAAF,EAAmBJ,CAAO,IAE1BO,IAAAL,EAAM,YAAN,QAAAK,EAAA,KAAAL,GAAgB;AAAA,IAClB;AAGE,WAAAM,gBAAAA,EAAA;AAAA,MAACb;AAAA,MAAA;AAAA,QACC,SAASO,EAAM,WAAW;AAAA,QAC1B,MAAMA,EAAM,QAAQ;AAAA,QACnB,GAAGA;AAAA,QACJ,KAAAC;AAAA,QACA,SAASG;AAAA,QACT,WAAWG,EAAK,gBAAgBP,EAAM,aAAa,IAAI;AAAA,UACrD,QAAQ,CAAC,CAACA,EAAM;AAAA,UAChB,QAAAD;AAAA,QAAA,CACD;AAAA,QACD,gBAAc;AAAA,QACd,sBAAoB;AAAA,QAEnB,UAAMC,EAAA;AAAA,MAAA;AAAA,IACT;AAAA,EAAA;AAGN;"}

package/dist/shared/src/components/Powerpack/PowerpackDialog.cjs.js

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../_virtual/jsx-runtime.cjs.js"),t=require("./PowerpackDialog.styled.cjs.js"),g=require("react"),l=require("@ynput/ayon-react-components"),A=require("./PricingLink.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");const s=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("clsx");require("../ThumbnailSimple/ThumbnailSimple.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholder.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholderFlex.styled.cjs.js");require("react-toastify");require("../../api/base/client.cjs.js");require("../../api/generated/graphql.cjs.js");require("../../api/generated/graphqlLinks.cjs.js");require("../../api/generated/access.cjs.js");require("../../api/generated/actions.cjs.js");require("../../api/generated/activityFeed.cjs.js");require("../../api/generated/addons.cjs.js");require("../../api/generated/anatomy.cjs.js");require("../../api/generated/attributes.cjs.js");require("../../api/generated/authentication.cjs.js");require("../../api/generated/bundles.cjs.js");require("../../api/generated/configuration.cjs.js");require("../../api/generated/desktop.cjs.js");require("../../api/generated/entityLists.cjs.js");require("../../api/generated/events.cjs.js");require("../../api/generated/files.cjs.js");require("../../api/generated/folders.cjs.js");require("../../api/generated/inbox.cjs.js");require("../../api/generated/links.cjs.js");require("../../api/generated/market.cjs.js");require("../../api/generated/onboarding.cjs.js");require("../../api/generated/operations.cjs.js");require("../../api/generated/products.cjs.js");require("../../api/generated/projectDashboard.cjs.js");require("../../api/generated/projects.cjs.js");require("../../api/generated/reviewables.cjs.js");require("../../api/generated/services.cjs.js");require("../../api/generated/system.cjs.js");require("../../api/generated/tasks.cjs.js");require("../../api/generated/teams.cjs.js");require("../../api/generated/thumbnails.cjs.js");require("../../api/generated/uRIs.cjs.js");require("../../api/generated/users.cjs.js");require("../../api/generated/versions.cjs.js");require("../../api/generated/workfiles.cjs.js");require("../../api/generated/ynputCloud.cjs.js");require("../../api/generated/grouping.cjs.js");require("../../api/generated/views.cjs.js");require("../../api/queries/actions/getActions.cjs.js");require("../../api/queries/activities/getActivities.cjs.js");require("../../api/queries/activities/updateActivities.cjs.js");require("../../api/queries/activities/updateReaction.cjs.js");require("../../api/queries/activities/getMentions.cjs.js");require("../../api/queries/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("@dnd-kit/core");require("@dnd-kit/sortable");require("../ReviewablesList/ReviewablesList.styled.cjs.js");require("../../containers/ContextMenu/ContextMenuContext.cjs.js");;/* empty css                                                 */require("lodash");require("uuid");require("../../util/pubsub.cjs.js");require("../ReviewablesList/ReviewablesUpload.styled.cjs.js");require("axios");require("../ReviewableCard/ReviewableCard.cjs.js");require("../ReviewableProgressCard/ReviewableProgressCard.styled.cjs.js");require("../FileThumbnail/FileThumbnail.cjs.js");require("../Thumbnail/Thumbnail.styled.cjs.js");require("../Thumbnail/StackedThumbnails.cjs.js");require("../../containers/Feed/context/FeedContext.cjs.js");require("../../containers/Feed/components/Tooltips/UserTooltip/UserTooltip.styled.cjs.js");require("../../containers/Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/Mimes/TextMime.cjs.js");require("react-markdown");require("remark-emoji");require("remark-gfm");require("remark-directive");require("remark-directive-rehype");require("../../containers/Feed/components/CommentInput/CommentInput.cjs.js");require("../../containers/Feed/components/ReactionContainer/Reactions.styled.cjs.js");require("../../containers/Feed/components/FilesGrid/FilesGrid.styled.cjs.js");require("../../containers/Feed/components/FileUploadCard/FileUploadCard.styled.cjs.js");require("../../containers/Feed/components/CommentInput/quillToMarkdown.cjs.js");require("../../containers/Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("../../containers/Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../containers/Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("react-router-dom");require("../../containers/Feed/components/ActivityStatus/ActivityStatus.cjs.js");require("../../containers/Feed/components/ActivityHeader/ActivityHeader.styled.cjs.js");require("../../containers/Feed/components/ActivityDate.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryTag.cjs.js");require("../../containers/Feed/components/ActivityStatusChange/ActivityStatusChange.styled.cjs.js");require("../../containers/Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.cjs.js");require("../../containers/Feed/components/ActivityVersions/ActivityVersions.styled.cjs.js");require("../../containers/Feed/components/ActivityGroup/ActivityGroup.styled.cjs.js");require("../../containers/Feed/Feed.styled.cjs.js");require("date-fns");require("../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.cjs.js");require("../../containers/ProjectTreeTable/context/CellEditingContext.cjs.js");require("short-uuid");require("@tanstack/react-table");require("../../containers/ProjectTreeTable/widgets/CollapsedWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/DateWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EnumWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/TextWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/BooleanWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/CellWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ThumbnailWidget.cjs.js");require("../LinksManager/CellEditingDialog.cjs.js");require("../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.cjs.js");require("../../containers/ProjectTreeTable/context/SelectedRowsContext.cjs.js");require("../LinksManager/LinksManager.styled.cjs.js");require("../../containers/ProjectTreeTable/widgets/EmptyWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ErrorWidget.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js");require("../../containers/ProjectTreeTable/components/SelectionCell.cjs.js");require("../../containers/ProjectTreeTable/components/RowSelectionHeader.cjs.js");require("../../containers/ProjectTreeTable/context/SelectionCellsContext.cjs.js");require("../../containers/ProjectTreeTable/widgets/LoadMoreWidget.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableContext.cjs.js");require("../../containers/ProjectTreeTable/context/ClipboardContext.cjs.js");require("../../containers/ProjectTreeTable/context/ColumnSettingsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectDataContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");require("../../containers/ProjectTreeTable/components/HeaderActionButton.cjs.js");require("../../containers/ProjectTreeTable/components/ColumnHeaderMenu.cjs.js");require("../../containers/DetailsPanel/DetailsPanel.styled.cjs.js");require("../../containers/DetailsPanel/FeedFilters/FeedFilters.styled.cjs.js");require("../../containers/DetailsPanel/DetailsPanelHeader/DetailsPanelHeader.styled.cjs.js");require("../PlayableIcon/PlayableIcon.cjs.js");require("../../containers/DetailsPanel/DetailsPanelFiles/DetailsPanelFiles.cjs.js");require("../../containers/DetailsPanel/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.cjs.js");require("../../containers/DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");require("../../containers/Actions/Actions.styled.cjs.js");require("../../containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js");require("../../containers/Actions/ActionIcon.cjs.js");require("../../containers/Views/context/ViewsContext.cjs.js");require("../../containers/Views/Views.styled.cjs.js");require("../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../containers/Views/ViewsMenu/ViewsMenu.cjs.js");require("../EntityPanelUploader/EntityPanelUploader.styled.cjs.js");require("../SimpleFormDialog/SimpleFormDialog.cjs.js");require("../EntityPath/EntityPath.styled.cjs.js");require("../EntityPath/SegmentProvider.cjs.js");require("../DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../DetailsPanelDetails/DetailsPanelDetails.cjs.js");require("../DetailsPanelDetails/DetailsSection.cjs.js");require("../DetailsPanelDetails/FieldLabel.cjs.js");require("../Watchers/Watchers.cjs.js");require("../ProjectTableSettings/ProjectTableSettings.cjs.js");require("./PowerpackButton.cjs.js");const R=require("./CTAButton.cjs.js");require("./RequiredAddonVersion.cjs.js");require("../SizeSlider/SizeSlider.cjs.js");require("../SettingsPanel/SettingsPanel.cjs.js");require("../SettingsPanel/SettingsPanelItemTemplate.cjs.js");require("../AttributeEditor/components/MinMaxField.cjs.js");require("../EnumEditor/EnumEditor.styled.cjs.js");require("../SearchFilter/filterDates.cjs.js");require("../FeaturedVersionOrder/FeaturedVersionOrder.cjs.js");require("../Badge/Badge.cjs.js");require("../VersionUploader/components/UploadVersionDialog.cjs.js");require("../VersionUploader/context/VersionUploadContext.cjs.js");const O=require("../Feedback/FeedbackContext.cjs.js");require("../Feedback/SupportBubble.cjs.js");require("../Chips/Chips.cjs.js");require("../../containers/EntityPickerDialog/EntityPickerDialog.cjs.js");require("../StyledLink/StyledLink.cjs.js");require("../ShareOptionIcon/ShareOptionIcon.cjs.js");require("../AccessUser/AccessUser.cjs.js");require("../../../../node_modules/match-sorter/dist/match-sorter.esm.cjs.js");require("../AccessSearchInput/AccessSearchInput.styled.cjs.js");require("../TableGridSwitch/TableGridSwitch.cjs.js");require("../SortingSetting/SortingSetting.styled.cjs.js");require("../EarlyPreview/EarlyPreview.cjs.js");require("../LegacyBadge/LegacyBadge.cjs.js");const b=({label:n,description:j,features:w,isCloseable:o=!0,addon:i})=>{const[a,p]=g.useState(!1),{setPowerpackDialog:E,selectedPowerPack:h,powerpackDialog:r}=s.usePowerpack(),{openSupport:k,messengerLoaded:P}=O.useFeedback();if(!r&&(!n||!j))return null;const m=n??(r==null?void 0:r.label)??(i?"this addon":"this feature"),f=i?`I would like to know how I can try out the "${m}" addon?`:`I would like to know how I can try out the "${m}" power feature?`,d=Object.entries(w??s.powerpackFeatures).sort(([q],[u])=>{if(q===h)return-1;if(u===h)return 1;const c=s.powerpackFeatureOrder.indexOf(q),x=s.powerpackFeatureOrder.indexOf(u);return c>-1&&x>-1?c-x:c>-1?-1:x>-1?1:0}),S=()=>{o&&(E(null),p(!1))};return e.jsxRuntimeExports.jsxs(t.PowerpackDialog,{isOpen:!0,onClose:S,size:"lg",hideCancelButton:!o,hideBackdrop:!o,children:[e.jsxRuntimeExports.jsxs(t.MainFeature,{children:[e.jsxRuntimeExports.jsxs("h1",{children:[e.jsxRuntimeExports.jsx(l.Icon,{icon:i!=null&&i.icon?i.icon:"bolt"}),n??(r==null?void 0:r.label)]}),e.jsxRuntimeExports.jsx("h2",{children:j??(r==null?void 0:r.description)})]}),e.jsxRuntimeExports.jsxs(t.FeaturesList,{children:[i?e.jsxRuntimeExports.jsxs("h3",{children:["Unlock all ",e.jsxRuntimeExports.jsx("span",{className:"green",children:"Premium Addons"})," with an AYON Studio subscription."]}):e.jsxRuntimeExports.jsxs("h3",{children:["Unlock all ",e.jsxRuntimeExports.jsx(l.Icon,{icon:"bolt"})," ",e.jsxRuntimeExports.jsx("span",{className:"green",children:"Power Features"})," with an AYON subscription."]}),e.jsxRuntimeExports.jsx("ul",{children:d.slice(0,a?void 0:5).map(([q,u])=>e.jsxRuntimeExports.jsxs("li",{children:[e.jsxRuntimeExports.jsx(l.Icon,{icon:u.icon??"check"}),e.jsxRuntimeExports.jsx("span",{children:u.bullet})]},q))}),!a&&d.length>5&&e.jsxRuntimeExports.jsx(t.ShowAll,{onClick:()=>p(!0),children:"Show all"})]}),P?e.jsxRuntimeExports.jsx(R.CTAButton,{onClick:()=>k("NewMessage",f)}):e.jsxRuntimeExports.jsx(A.PricingLink,{children:e.jsxRuntimeExports.jsx(R.CTAButton,{})})]})};exports.PowerpackDialog=b;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("../../../../_virtual/jsx-runtime.cjs.js"),t=require("./PowerpackDialog.styled.cjs.js"),g=require("react"),l=require("@ynput/ayon-react-components"),A=require("./PricingLink.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/ThumbnailUploaderContext.cjs.js");require("../../context/SettingsPanelContext.cjs.js");require("../../context/pip/PiPProvider.cjs.js");require("react-dom");require("../../context/pip/PiPWrapper.cjs.js");require("../../context/AddonProjectContext.cjs.js");require("../../context/AddonContext.cjs.js");const s=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("../AddonLoadingScreen/AddonLoadingScreen.cjs.js");require("clsx");require("../ThumbnailSimple/ThumbnailSimple.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholder.cjs.js");require("../EmptyPlaceholder/EmptyPlaceholderFlex.styled.cjs.js");require("react-toastify");require("../../api/base/client.cjs.js");require("../../api/generated/graphql.cjs.js");require("../../api/generated/graphqlLinks.cjs.js");require("../../api/generated/access.cjs.js");require("../../api/generated/actions.cjs.js");require("../../api/generated/activityFeed.cjs.js");require("../../api/generated/addons.cjs.js");require("../../api/generated/anatomy.cjs.js");require("../../api/generated/attributes.cjs.js");require("../../api/generated/authentication.cjs.js");require("../../api/generated/bundles.cjs.js");require("../../api/generated/configuration.cjs.js");require("../../api/generated/desktop.cjs.js");require("../../api/generated/entityLists.cjs.js");require("../../api/generated/events.cjs.js");require("../../api/generated/files.cjs.js");require("../../api/generated/folders.cjs.js");require("../../api/generated/inbox.cjs.js");require("../../api/generated/links.cjs.js");require("../../api/generated/market.cjs.js");require("../../api/generated/onboarding.cjs.js");require("../../api/generated/operations.cjs.js");require("../../api/generated/products.cjs.js");require("../../api/generated/projectDashboard.cjs.js");require("../../api/generated/projects.cjs.js");require("../../api/generated/reviewables.cjs.js");require("../../api/generated/services.cjs.js");require("../../api/generated/system.cjs.js");require("../../api/generated/tasks.cjs.js");require("../../api/generated/teams.cjs.js");require("../../api/generated/thumbnails.cjs.js");require("../../api/generated/uRIs.cjs.js");require("../../api/generated/users.cjs.js");require("../../api/generated/versions.cjs.js");require("../../api/generated/workfiles.cjs.js");require("../../api/generated/ynputCloud.cjs.js");require("../../api/generated/grouping.cjs.js");require("../../api/generated/views.cjs.js");require("../../api/queries/actions/getActions.cjs.js");require("../../api/queries/activities/getActivities.cjs.js");require("../../api/queries/activities/updateActivities.cjs.js");require("../../api/queries/activities/updateReaction.cjs.js");require("../../api/queries/activities/getMentions.cjs.js");require("../../api/queries/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("@dnd-kit/core");require("@dnd-kit/sortable");require("../ReviewablesList/ReviewablesList.styled.cjs.js");require("../../containers/ContextMenu/ContextMenuContext.cjs.js");;/* empty css                                                 */require("lodash");require("uuid");require("../../util/pubsub.cjs.js");require("../ReviewablesList/ReviewablesUpload.styled.cjs.js");require("axios");require("../ReviewableCard/ReviewableCard.cjs.js");require("../ReviewableProgressCard/ReviewableProgressCard.styled.cjs.js");require("../FileThumbnail/FileThumbnail.cjs.js");require("../Thumbnail/Thumbnail.styled.cjs.js");require("../Thumbnail/StackedThumbnails.cjs.js");require("../../containers/Feed/context/FeedContext.cjs.js");require("../../containers/Feed/components/Tooltips/UserTooltip/UserTooltip.styled.cjs.js");require("../../containers/Feed/components/Tooltips/EntityTooltip/EntityTooltip.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/FileUploadPreview.styled.cjs.js");require("../../containers/Feed/components/FileUploadPreview/Mimes/TextMime.cjs.js");require("react-markdown");require("remark-emoji");require("remark-gfm");require("remark-directive");require("remark-directive-rehype");require("../../containers/Feed/components/CommentInput/CommentInput.cjs.js");require("../../containers/Feed/components/ReactionContainer/Reactions.styled.cjs.js");require("../../containers/Feed/components/FilesGrid/FilesGrid.styled.cjs.js");require("../../containers/Feed/components/FileUploadCard/FileUploadCard.styled.cjs.js");require("../../containers/Feed/components/CommentInput/quillToMarkdown.cjs.js");require("../../containers/Feed/components/ActivityComment/ActivityComment.styled.cjs.js");require("../../containers/Feed/components/ActivityCheckbox/ActivityCheckbox.styled.cjs.js");require("../../containers/Feed/components/ActivityReference/ActivityReference.styled.cjs.js");require("react-router-dom");require("../../containers/Feed/components/ActivityStatus/ActivityStatus.cjs.js");require("../../containers/Feed/components/ActivityHeader/ActivityHeader.styled.cjs.js");require("../../containers/Feed/components/ActivityDate.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryTag.cjs.js");require("../../containers/Feed/components/ActivityStatusChange/ActivityStatusChange.styled.cjs.js");require("../../containers/Feed/components/ActivityAssigneeChange/ActivityAssigneeChange.styled.cjs.js");require("../../containers/Feed/components/ActivityVersions/ActivityVersions.styled.cjs.js");require("../../containers/Feed/components/ActivityGroup/ActivityGroup.styled.cjs.js");require("../../containers/Feed/Feed.styled.cjs.js");require("date-fns");require("../../containers/Feed/components/ActivityCategorySelect/ActivityCategorySelect.cjs.js");require("../../containers/Feed/components/ActivityCategorySelect/CategoryDropdownItem.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.cjs.js");require("../../containers/ProjectTreeTable/context/CellEditingContext.cjs.js");require("short-uuid");require("@tanstack/react-table");require("../../containers/ProjectTreeTable/widgets/CollapsedWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/DateWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EnumWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/TextWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/BooleanWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/CellWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/EntityNameWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/GroupHeaderWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ThumbnailWidget.cjs.js");require("../LinksManager/CellEditingDialog.cjs.js");require("../../containers/ProjectTreeTable/context/DetailsPanelEntityContext.cjs.js");require("../../containers/ProjectTreeTable/context/SelectedRowsContext.cjs.js");require("../LinksManager/LinksManager.styled.cjs.js");require("../../containers/ProjectTreeTable/widgets/EmptyWidget.cjs.js");require("../../containers/ProjectTreeTable/widgets/ErrorWidget.cjs.js");require("../../containers/ProjectTreeTable/ProjectTreeTable.styled.cjs.js");require("../../containers/ProjectTreeTable/components/SelectionCell.cjs.js");require("../../containers/ProjectTreeTable/components/RowSelectionHeader.cjs.js");require("../../containers/ProjectTreeTable/context/SelectionCellsContext.cjs.js");require("../../containers/ProjectTreeTable/widgets/LoadMoreWidget.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableQueriesContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectTableContext.cjs.js");require("../../containers/ProjectTreeTable/context/ClipboardContext.cjs.js");require("../../containers/ProjectTreeTable/context/ColumnSettingsContext.cjs.js");require("../../containers/ProjectTreeTable/context/ProjectDataContext.cjs.js");require("../../../../_virtual/runtime.cjs.js");require("../../../../_virtual/semver.cjs.js");require("react-redux");require("custom-protocol-check");require("../../containers/ProjectTreeTable/components/GroupSettingsFallback.cjs.js");require("../../containers/ProjectTreeTable/components/HeaderActionButton.cjs.js");require("../../containers/ProjectTreeTable/components/ColumnHeaderMenu.cjs.js");require("../../containers/DetailsPanel/DetailsPanel.styled.cjs.js");require("../../containers/DetailsPanel/FeedFilters/FeedFilters.styled.cjs.js");require("../../containers/DetailsPanel/DetailsPanelHeader/DetailsPanelHeader.styled.cjs.js");require("../PlayableIcon/PlayableIcon.cjs.js");require("../../containers/DetailsPanel/DetailsPanelFiles/DetailsPanelFiles.cjs.js");require("../../containers/DetailsPanel/DetailsPanelSlideOut/DetailsPanelSlideOut.styled.cjs.js");require("../../containers/DetailsPanel/DetailsPanelFloating/DetailsPanelFloating.styled.cjs.js");require("../../containers/Actions/Actions.styled.cjs.js");require("../../containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js");require("../../containers/Actions/ActionIcon.cjs.js");require("../../containers/Views/context/ViewsContext.cjs.js");require("../../containers/Views/Views.styled.cjs.js");require("../../containers/Views/ViewsMenuContainer/ViewsMenuContainer.cjs.js");require("../../containers/Views/ViewsMenu/ViewsMenu.cjs.js");require("../EntityPanelUploader/EntityPanelUploader.styled.cjs.js");require("../SimpleFormDialog/SimpleFormDialog.cjs.js");require("../EntityPath/EntityPath.styled.cjs.js");require("../EntityPath/SegmentProvider.cjs.js");require("../DetailsPanelAttributes/DetailsPanelAttributesEditor.cjs.js");require("../DetailsPanelDetails/DetailsPanelDetails.cjs.js");require("../DetailsPanelDetails/DetailsSection.cjs.js");require("../DetailsPanelDetails/FieldLabel.cjs.js");require("../Watchers/Watchers.cjs.js");require("../ProjectTableSettings/ProjectTableSettings.cjs.js");require("./PowerpackButton.cjs.js");const R=require("./CTAButton.cjs.js");require("./RequiredAddonVersion.cjs.js");require("../SizeSlider/SizeSlider.cjs.js");require("../SettingsPanel/SettingsPanel.cjs.js");require("../SettingsPanel/SettingsPanelItemTemplate.cjs.js");require("../AttributeEditor/components/MinMaxField.cjs.js");require("../EnumEditor/EnumEditor.styled.cjs.js");require("../SearchFilter/filterDates.cjs.js");require("../FeaturedVersionOrder/FeaturedVersionOrder.cjs.js");require("../Badge/Badge.cjs.js");require("../VersionUploader/components/UploadVersionDialog.cjs.js");require("../VersionUploader/context/VersionUploadContext.cjs.js");const O=require("../Feedback/FeedbackContext.cjs.js");require("../Feedback/SupportBubble.cjs.js");require("../Chips/Chips.cjs.js");require("../../containers/EntityPickerDialog/EntityPickerDialog.cjs.js");require("../StyledLink/StyledLink.cjs.js");require("../ShareOptionIcon/ShareOptionIcon.cjs.js");require("../AccessUser/AccessUser.cjs.js");require("../../../../node_modules/match-sorter/dist/match-sorter.esm.cjs.js");require("../AccessSearchInput/AccessSearchInput.styled.cjs.js");require("../TableGridSwitch/TableGridSwitch.cjs.js");require("../SortingSetting/SortingSetting.styled.cjs.js");require("../EarlyPreview/EarlyPreview.cjs.js");require("../LegacyBadge/LegacyBadge.cjs.js");require("../Menu/Menu.styled.cjs.js");require("../Menu/MenuItem.cjs.js");const b=({label:n,description:j,features:w,isCloseable:o=!0,addon:i})=>{const[a,p]=g.useState(!1),{setPowerpackDialog:E,selectedPowerPack:h,powerpackDialog:r}=s.usePowerpack(),{openSupport:k,messengerLoaded:P}=O.useFeedback();if(!r&&(!n||!j))return null;const m=n??(r==null?void 0:r.label)??(i?"this addon":"this feature"),f=i?`I would like to know how I can try out the "${m}" addon?`:`I would like to know how I can try out the "${m}" power feature?`,d=Object.entries(w??s.powerpackFeatures).sort(([q],[u])=>{if(q===h)return-1;if(u===h)return 1;const c=s.powerpackFeatureOrder.indexOf(q),x=s.powerpackFeatureOrder.indexOf(u);return c>-1&&x>-1?c-x:c>-1?-1:x>-1?1:0}),S=()=>{o&&(E(null),p(!1))};return e.jsxRuntimeExports.jsxs(t.PowerpackDialog,{isOpen:!0,onClose:S,size:"lg",hideCancelButton:!o,hideBackdrop:!o,children:[e.jsxRuntimeExports.jsxs(t.MainFeature,{children:[e.jsxRuntimeExports.jsxs("h1",{children:[e.jsxRuntimeExports.jsx(l.Icon,{icon:i!=null&&i.icon?i.icon:"bolt"}),n??(r==null?void 0:r.label)]}),e.jsxRuntimeExports.jsx("h2",{children:j??(r==null?void 0:r.description)})]}),e.jsxRuntimeExports.jsxs(t.FeaturesList,{children:[i?e.jsxRuntimeExports.jsxs("h3",{children:["Unlock all ",e.jsxRuntimeExports.jsx("span",{className:"green",children:"Premium Addons"})," with an AYON Studio subscription."]}):e.jsxRuntimeExports.jsxs("h3",{children:["Unlock all ",e.jsxRuntimeExports.jsx(l.Icon,{icon:"bolt"})," ",e.jsxRuntimeExports.jsx("span",{className:"green",children:"Power Features"})," with an AYON subscription."]}),e.jsxRuntimeExports.jsx("ul",{children:d.slice(0,a?void 0:5).map(([q,u])=>e.jsxRuntimeExports.jsxs("li",{children:[e.jsxRuntimeExports.jsx(l.Icon,{icon:u.icon??"check"}),e.jsxRuntimeExports.jsx("span",{children:u.bullet})]},q))}),!a&&d.length>5&&e.jsxRuntimeExports.jsx(t.ShowAll,{onClick:()=>p(!0),children:"Show all"})]}),P?e.jsxRuntimeExports.jsx(R.CTAButton,{onClick:()=>k("NewMessage",f)}):e.jsxRuntimeExports.jsx(A.PricingLink,{children:e.jsxRuntimeExports.jsx(R.CTAButton,{})})]})};exports.PowerpackDialog=b;
 //# sourceMappingURL=PowerpackDialog.cjs.js.map