@ynput/ayon-frontend-shared 0.3.4 → 0.3.6

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

@@ -1 +1 @@
-{"version":3,"file":"ListAttributeForm.es.js","sources":["../../../../../src/components/ListAttributeForm/ListAttributeForm.tsx"],"sourcesContent":["import { FC, useCallback, useEffect, useState, useMemo } from 'react'\nimport { AttributeField, DetailsPanelAttributesEditor } from '../DetailsPanelAttributes'\nimport { EntityListModel, useUpdateEntityListMutation, useGetAttributeListQuery } from '@shared/api'\nimport { toast } from 'react-toastify'\nimport { useProjectContext } from '@shared/context'\n\ninterface ListAttributeFormProps {\n  projectName: string\n  list?: EntityListModel\n  isLoading?: boolean\n  attributes?: AttributeField[]\n}\n\n// explicit type for the form state\ntype FormValue = string | number | boolean | any[] | Record<string, any> | Date | null | undefined\n\ninterface ListFormData {\n  label: string\n  tags: string[]\n  active: boolean\n  // index signature so the object is compatible with DetailsPanelAttributesEditor expected form shape\n  [key: string]: FormValue\n}\n\nexport const ListAttributeForm: FC<ListAttributeFormProps> = ({\n  projectName,\n  list,\n  isLoading,\n  attributes = [],\n}) => {\n  const [form, setForm] = useState<ListFormData>({\n    label: '',\n    tags: [],\n    active: false,\n  })\n\n  // You must be an admin to edit the list itself\n  const canEdit = (list?.accessLevel || 0) >= 30\n  const { tags } = useProjectContext()\n\n  // Fetch list-scoped attributes\n  const { data: allAttributes = [] } = useGetAttributeListQuery()\n  const listScopedAttributes = useMemo(\n    () =>\n      allAttributes\n        .filter((attr) => attr.scope?.includes('list'))\n        .map((attr) => ({\n          name: attr.name,\n          data: attr.data,\n        })),\n    [allAttributes],\n  )\n\n  const fields: AttributeField[] = useMemo(\n    () => [\n      { name: 'label', data: { type: 'string', title: 'Label' } },\n      {\n        name: 'tags',\n        data: {\n          type: 'list_of_strings',\n          title: 'Tags',\n          enum: tags?.map((t) => ({ value: t.name, label: t.name, color: t.color })),\n          enableCustomValues: true,\n          enableSearch: true,\n        },\n      },\n      ...listScopedAttributes,\n      { name: 'active', data: { type: 'boolean', title: 'Active' } },\n      ...attributes,\n    ],\n    [tags, listScopedAttributes, attributes],\n  )\n\n  useEffect(() => {\n    if (list) {\n      const parsedAttrib = list.attrib || {}\n\n      // get the data for all attrib fields (list-scoped and passed attributes)\n      const allAttribFields = [...listScopedAttributes, ...attributes]\n      const attribFieldValues = allAttribFields.reduce((acc, { name }) => {\n        const fieldValue = (parsedAttrib as Record<string, any>)[name]\n        // Default to empty string for all attrib fields\n        acc[name] = fieldValue || ''\n        return acc\n      }, {} as Record<string, any>)\n\n      setForm({\n        label: list?.label || '',\n        tags: list?.tags || [],\n        active: list?.active ?? false,\n        ...attribFieldValues,\n      })\n    }\n  }, [list, JSON.stringify(attributes), JSON.stringify(listScopedAttributes)])\n\n  const [updateList] = useUpdateEntityListMutation()\n\n  const isAttribField = (fieldName: string): boolean => {\n    return (\n      attributes.some((attr) => attr.name === fieldName) ||\n      listScopedAttributes.some((attr) => attr.name === fieldName)\n    )\n  }\n\n  const handleChange = useCallback(\n    async (key: string, value: any) => {\n      if (!list?.id) return console.warn('No list ID provided')\n\n      let updatePayload: any\n\n      if (isAttribField(key)) {\n        const currentAttrib = list.attrib || {}\n\n        // If the value is empty string for category, set it to null to clear it\n        if (value === '' && key === 'category') {\n          updatePayload = {\n            attrib: {\n              ...currentAttrib,\n              [key]: null,\n            },\n          }\n        } else {\n          updatePayload = {\n            attrib: {\n              ...currentAttrib,\n              [key]: value,\n            },\n          }\n        }\n\n        // Update local form state\n        setForm((prev) => ({ ...prev, [key]: value }))\n      } else {\n        // For other fields, update normally\n        const newValue = { [key]: value }\n        updatePayload = newValue\n        // Update local form state\n        setForm((prev) => ({ ...prev, ...newValue }))\n      }\n\n      // update the list in the database in the background\n      try {\n        await updateList({\n          listId: list.id,\n          projectName,\n          entityListPatchModel: updatePayload,\n        })\n      } catch (error: any) {\n        console.error(error)\n        toast.error('Failed to update list attribute: ', error.attrib.detail)\n      }\n    },\n    [list?.id, list?.attrib, projectName, updateList, listScopedAttributes, attributes],\n  )\n\n  return (\n    <DetailsPanelAttributesEditor\n      enableEditing={canEdit}\n      fields={fields}\n      form={form}\n      isLoading={isLoading}\n      onChange={handleChange}\n      title=\"Attributes\"\n    />\n  )\n}\n"],"names":["ListAttributeForm","projectName","list","isLoading","attributes","form","setForm","useState","canEdit","tags","useProjectContext","allAttributes","useGetAttributeListQuery","listScopedAttributes","useMemo","attr","fields","useEffect","parsedAttrib","attribFieldValues","acc","name","fieldValue","updateList","useUpdateEntityListMutation","isAttribField","fieldName","handleChange","useCallback","key","value","updatePayload","currentAttrib","prev","newValue","error","toast","jsx","DetailsPanelAttributesEditor"],"mappings":"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"}
+{"version":3,"file":"ListAttributeForm.es.js","sources":["../../../../../src/components/ListAttributeForm/ListAttributeForm.tsx"],"sourcesContent":["import { FC, useCallback, useEffect, useState, useMemo } from 'react'\nimport { AttributeField, DetailsPanelAttributesEditor } from '../DetailsPanelAttributes'\nimport { EntityListModel, useUpdateEntityListMutation, useGetAttributeListQuery } from '@shared/api'\nimport { toast } from 'react-toastify'\nimport { useProjectContext } from '@shared/context'\n\ninterface ListAttributeFormProps {\n  projectName: string\n  list?: EntityListModel\n  isLoading?: boolean\n  attributes?: AttributeField[]\n}\n\n// explicit type for the form state\ntype FormValue = string | number | boolean | any[] | Record<string, any> | Date | null | undefined\n\ninterface ListFormData {\n  label: string\n  tags: string[]\n  active: boolean\n  // index signature so the object is compatible with DetailsPanelAttributesEditor expected form shape\n  [key: string]: FormValue\n}\n\nexport const ListAttributeForm: FC<ListAttributeFormProps> = ({\n  projectName,\n  list,\n  isLoading,\n  attributes = [],\n}) => {\n  const [form, setForm] = useState<ListFormData>({\n    label: '',\n    tags: [],\n    active: false,\n  })\n\n  // You must be an admin to edit the list itself\n  const canEdit = (list?.accessLevel || 0) >= 30\n  const { tags } = useProjectContext()\n\n  // Fetch list-scoped attributes\n  const { data: allAttributes = [] } = useGetAttributeListQuery()\n  const listScopedAttributes = useMemo(\n    () =>\n      allAttributes\n        .filter((attr) => attr.scope?.includes('list'))\n        .map((attr) => ({\n          name: attr.name,\n          data: attr.data,\n        })),\n    [allAttributes],\n  )\n\n  const fields: AttributeField[] = useMemo(\n    () => [\n      { name: 'label', data: { type: 'string', title: 'Label' } },\n      {\n        name: 'tags',\n        data: {\n          type: 'list_of_strings',\n          title: 'Tags',\n          enum: tags?.map((t) => ({ value: t.name, label: t.name, color: t.color })),\n          enableCustomValues: true,\n          enableSearch: true,\n        },\n      },\n      ...listScopedAttributes,\n      { name: 'active', data: { type: 'boolean', title: 'Active' } },\n      ...attributes,\n    ],\n    [tags, listScopedAttributes, attributes],\n  )\n\n  useEffect(() => {\n    if (list) {\n      const parsedAttrib = list.attrib || {}\n\n      // get the data for all attrib fields (list-scoped and passed attributes)\n      const allAttribFields = [...listScopedAttributes, ...attributes]\n      const attribFieldValues = allAttribFields.reduce((acc, { name }) => {\n        const fieldValue = (parsedAttrib as Record<string, any>)[name]\n        // Default to empty string for all attrib fields\n        acc[name] = fieldValue || ''\n        return acc\n      }, {} as Record<string, any>)\n\n      setForm({\n        label: list?.label || '',\n        tags: list?.tags || [],\n        active: list?.active ?? false,\n        ...attribFieldValues,\n      })\n    }\n  }, [list, JSON.stringify(attributes), JSON.stringify(listScopedAttributes)])\n\n  const [updateList] = useUpdateEntityListMutation()\n\n  const isAttribField = (fieldName: string): boolean => {\n    return (\n      attributes.some((attr) => attr.name === fieldName) ||\n      listScopedAttributes.some((attr) => attr.name === fieldName)\n    )\n  }\n\n  const handleChange = useCallback(\n    async (key: string, value: any) => {\n      if (!list?.id) return console.warn('No list ID provided')\n\n      let updatePayload: any\n\n      if (isAttribField(key)) {\n        const currentAttrib = list.attrib || {}\n\n        // If the value is empty string for category, set it to null to clear it\n        if (value === '' && key === 'category') {\n          updatePayload = {\n            attrib: {\n              ...currentAttrib,\n              [key]: null,\n            },\n          }\n        } else {\n          updatePayload = {\n            attrib: {\n              ...currentAttrib,\n              [key]: value,\n            },\n          }\n        }\n\n        // Update local form state\n        setForm((prev) => ({ ...prev, [key]: value }))\n      } else {\n        // For other fields, update normally\n        const newValue = { [key]: value }\n        updatePayload = newValue\n        // Update local form state\n        setForm((prev) => ({ ...prev, ...newValue }))\n      }\n\n      // update the list in the database in the background\n      try {\n        await updateList({\n          listId: list.id,\n          projectName,\n          entityListPatchModel: updatePayload,\n        })\n      } catch (error: any) {\n        console.error(error)\n        toast.error('Failed to update list attribute: ', error.attrib.detail)\n      }\n    },\n    [list?.id, list?.attrib, projectName, updateList, listScopedAttributes, attributes],\n  )\n\n  return (\n    <DetailsPanelAttributesEditor\n      enableEditing={canEdit}\n      fields={fields}\n      form={form}\n      isLoading={isLoading}\n      onChange={handleChange}\n      title=\"Attributes\"\n    />\n  )\n}\n"],"names":["ListAttributeForm","projectName","list","isLoading","attributes","form","setForm","useState","canEdit","tags","useProjectContext","allAttributes","useGetAttributeListQuery","listScopedAttributes","useMemo","attr","fields","useEffect","parsedAttrib","attribFieldValues","acc","name","fieldValue","updateList","useUpdateEntityListMutation","isAttribField","fieldName","handleChange","useCallback","key","value","updatePayload","currentAttrib","prev","newValue","error","toast","jsx","DetailsPanelAttributesEditor"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../../_virtual/jsx-runtime.cjs.js"),R=require("react"),f=require("./Menu.styled.cjs.js"),j=require("./MenuList.cjs.js");require("lodash");require("react-toastify");const g=require("../../util/copyToClipboard.cjs.js");require("uuid");require("../../util/pubsub.cjs.js");const b=require("@ynput/ayon-react-components");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 C=require("../../context/PowerpackContext.cjs.js");require("../../context/MoveEntityContext.cjs.js");const m=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=({menu:v=[],onClose:u,header:c,footer:o=""})=>{const{setPowerpackDialog:d}=C.usePowerpack(),{setMenuOpen:q}=m.useMenuContext(),[i,s]=R.useState([]),p=(e,t,r,l)=>{if(r)return u?.();t?.(e),!l&&u&&u()},x=(e,t)=>{t.items.length?i.find(r=>r.id===t.id)||s([...i.filter(r=>r.level<(t.level||0)+1),{...t,id:t.id,level:(t.level||0)+1,parentRef:e.target}]):s(i.filter(r=>r.level<=(t.level||0)))},y=(e,t={})=>{const r=e.relatedTarget?.id,l=i.find(a=>a.id===r);if(e.relatedTarget?.tagName==="DIALOG")return s([]);l||s(i.filter(a=>a.level<=(t.level||0)+1))},M=(e,t)=>{e.type==="mouseenter"||e.type==="keydown"?x(e,t):e.type==="mouseleave"&&y(e,t)};return n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[n.jsxRuntimeExports.jsxs(f.Section,{children:[c&&c,n.jsxRuntimeExports.jsx(j.MenuList,{items:v,handleClick:p,onSubMenu:M,level:0,setPowerpackDialog:d,onMenuClose:()=>q(!1)}),o&&n.jsxRuntimeExports.jsxs(f.Footer,{children:[o,n.jsxRuntimeExports.jsx(b.Button,{icon:"content_copy",variant:"text",onClick:()=>g.copyToClipboard(o)})]})]}),i.map((e,t)=>n.jsxRuntimeExports.jsx(j.MenuList,{...e,parentRef:e.parentRef||null,style:e.style||{},handleClick:p,subMenu:!0,onSubMenu:M,onClose:()=>s(i.filter(r=>r.id!==e.id)),onMenuClose:()=>q(!1),onChange:x,setPowerpackDialog:d,itemClassName:void 0,itemStyle:void 0},t))]})};exports.Menu=S;
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const n=require("../../../../_virtual/jsx-runtime.cjs.js"),R=require("react"),f=require("./Menu.styled.cjs.js"),j=require("./MenuList.cjs.js");require("lodash");require("react-toastify");const g=require("../../util/copyToClipboard.cjs.js");require("uuid");require("../../util/pubsub.cjs.js");const b=require("@ynput/ayon-react-components");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/SubtasksModulesContext.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 C=require("../../context/PowerpackContext.cjs.js");require("../../context/MoveEntityContext.cjs.js");const m=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=({menu:v=[],onClose:u,header:c,footer:o=""})=>{const{setPowerpackDialog:q}=C.usePowerpack(),{setMenuOpen:d}=m.useMenuContext(),[i,s]=R.useState([]),p=(e,r,t,l)=>{if(t)return u?.();r?.(e),!l&&u&&u()},x=(e,r)=>{r.items.length?i.find(t=>t.id===r.id)||s([...i.filter(t=>t.level<(r.level||0)+1),{...r,id:r.id,level:(r.level||0)+1,parentRef:e.target}]):s(i.filter(t=>t.level<=(r.level||0)))},y=(e,r={})=>{const t=e.relatedTarget?.id,l=i.find(a=>a.id===t);if(e.relatedTarget?.tagName==="DIALOG")return s([]);l||s(i.filter(a=>a.level<=(r.level||0)+1))},M=(e,r)=>{e.type==="mouseenter"||e.type==="keydown"?x(e,r):e.type==="mouseleave"&&y(e,r)};return n.jsxRuntimeExports.jsxs(n.jsxRuntimeExports.Fragment,{children:[n.jsxRuntimeExports.jsxs(f.Section,{children:[c&&c,n.jsxRuntimeExports.jsx(j.MenuList,{items:v,handleClick:p,onSubMenu:M,level:0,setPowerpackDialog:q,onMenuClose:()=>d(!1)}),o&&n.jsxRuntimeExports.jsxs(f.Footer,{children:[o,n.jsxRuntimeExports.jsx(b.Button,{icon:"content_copy",variant:"text",onClick:()=>g.copyToClipboard(o)})]})]}),i.map((e,r)=>n.jsxRuntimeExports.jsx(j.MenuList,{...e,parentRef:e.parentRef||null,style:e.style||{},handleClick:p,subMenu:!0,onSubMenu:M,onClose:()=>s(i.filter(t=>t.id!==e.id)),onMenuClose:()=>d(!1),onChange:x,setPowerpackDialog:q,itemClassName:void 0,itemStyle:void 0},r))]})};exports.Menu=S;
 //# sourceMappingURL=Menu.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.cjs.js","sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import React, { useState, ReactNode } from 'react'\nimport * as Styled from './Menu.styled'\nimport { MenuList } from './MenuList'\nimport { copyToClipboard } from '@shared/util'\nimport { Button } from '@ynput/ayon-react-components'\nimport { PowerpackFeature, useMenuContext, usePowerpack } from '@shared/context'\n\nexport interface MenuItemType {\n  id: string\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  onClick?: (e: React.MouseEvent) => void\n  link?: string\n  disableClose?: boolean\n  disabled?: boolean\n  powerFeature?: PowerpackFeature\n  active?: boolean\n  hidden?: boolean\n  node?: ReactNode\n  [key: string]: any\n}\n\ninterface SubMenu {\n  id: string\n  items: MenuItemType[]\n  level: number\n  parentRef?: HTMLElement\n  style?: React.CSSProperties\n}\n\ninterface MenuProps {\n  menu?: MenuItemType[]\n  onClose?: () => void\n  header?: ReactNode\n  footer?: string\n}\n\nexport const Menu: React.FC<MenuProps> = ({ menu = [], onClose, header, footer = '' }) => {\n  const { setPowerpackDialog } = usePowerpack()\n  const { setMenuOpen } = useMenuContext()\n\n  const [subMenus, setSubMenus] = useState<SubMenu[]>([])\n  //   When a menu item is clicked, the following happens:\n  const handleClick = (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => {\n    // this is handled by Link component inside the MenuItem\n    if (url) return onClose?.()\n\n    onClick?.(e)\n\n    if (!disableClose && onClose) onClose()\n  }\n\n  const onMenuEnter = (e: React.MouseEvent, menu: Partial<SubMenu> & { items: MenuItemType[] }) => {\n    // check to see if we need to open a submenu\n    if (menu.items.length) {\n      // yes, there is a submenu\n      // open it if it is not already open\n      if (!subMenus.find((m) => m.id === menu.id)) {\n        // also close any other submenus on the same level\n        setSubMenus([\n          ...subMenus.filter((m) => m.level < (menu.level || 0) + 1),\n          {\n            ...menu,\n            id: menu.id!,\n            level: (menu.level || 0) + 1,\n            parentRef: e.target as HTMLElement,\n          } as SubMenu,\n        ])\n      }\n    } else {\n      // no items for this menu, so close all submenus on the higher levels\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0)))\n    }\n  }\n\n  const onMenuLeave = (e: React.MouseEvent, menu: Partial<SubMenu> = {}) => {\n    // target where we are going\n    const relatedTargetId = (e.relatedTarget as HTMLElement)?.id\n    const relatedTargetSubMenu = subMenus.find((m) => m.id === relatedTargetId)\n\n    if ((e.relatedTarget as HTMLElement)?.tagName === 'DIALOG') return setSubMenus([])\n\n    if (!relatedTargetSubMenu) {\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0) + 1))\n    }\n    //   if (menu.items.length) {\n  }\n\n  const handleSubMenu = (\n    e: React.MouseEvent,\n    menu: Partial<SubMenu> & { items: MenuItemType[] },\n  ) => {\n    if (e.type === 'mouseenter' || e.type === 'keydown') onMenuEnter(e, menu)\n    else if (e.type === 'mouseleave') onMenuLeave(e, menu)\n  }\n\n  return (\n    <>\n      <Styled.Section>\n        {header && header}\n        <MenuList\n          items={menu}\n          handleClick={handleClick}\n          onSubMenu={handleSubMenu}\n          level={0}\n          setPowerpackDialog={setPowerpackDialog}\n          onMenuClose={() => setMenuOpen(false)}\n        />\n        {footer && (\n          <Styled.Footer>\n            {footer}\n            <Button icon=\"content_copy\" variant=\"text\" onClick={() => copyToClipboard(footer)} />\n          </Styled.Footer>\n        )}\n      </Styled.Section>\n      {subMenus.map((menu, i) => (\n        <MenuList\n          key={i}\n          {...menu}\n          parentRef={menu.parentRef || null}\n          style={menu.style || {}}\n          handleClick={handleClick}\n          subMenu\n          onSubMenu={handleSubMenu}\n          onClose={() => setSubMenus(subMenus.filter((m) => m.id !== menu.id))}\n          onMenuClose={() => setMenuOpen(false)}\n          onChange={onMenuEnter}\n          setPowerpackDialog={setPowerpackDialog}\n          itemClassName={undefined}\n          itemStyle={undefined}\n        />\n      ))}\n    </>\n  )\n}\n"],"names":["Menu","menu","onClose","header","footer","setPowerpackDialog","usePowerpack","setMenuOpen","useMenuContext","subMenus","setSubMenus","useState","handleClick","onClick","url","disableClose","onMenuEnter","m","onMenuLeave","relatedTargetId","relatedTargetSubMenu","handleSubMenu","jsxs","Fragment","Styled.Section","jsx","MenuList","Styled.Footer","Button","copyToClipboard","i"],"mappings":"8tCA2CO,MAAMA,EAA4B,CAAC,CAAE,KAAAC,EAAO,CAAA,EAAI,QAAAC,EAAS,OAAAC,EAAQ,OAAAC,EAAS,MAAS,CACxF,KAAM,CAAE,mBAAAC,CAAA,EAAuBC,eAAA,EACzB,CAAE,YAAAC,CAAA,EAAgBC,iBAAA,EAElB,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAAoB,CAAA,CAAE,EAEhDC,EAAc,CAClB,EACAC,EACAC,EACAC,IACG,CAEH,GAAID,SAAYZ,IAAA,EAEhBW,IAAU,CAAC,EAEP,CAACE,GAAgBb,GAASA,EAAA,CAChC,EAEMc,EAAc,CAAC,EAAqBf,IAAuD,CAE3FA,EAAK,MAAM,OAGRQ,EAAS,KAAMQ,GAAMA,EAAE,KAAOhB,EAAK,EAAE,GAExCS,EAAY,CACV,GAAGD,EAAS,OAAQQ,GAAMA,EAAE,OAAShB,EAAK,OAAS,GAAK,CAAC,EACzD,CACE,GAAGA,EACH,GAAIA,EAAK,GACT,OAAQA,EAAK,OAAS,GAAK,EAC3B,UAAW,EAAE,MAAA,CACf,CACD,EAIHS,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,QAAUhB,EAAK,OAAS,EAAE,CAAC,CAEpE,EAEMiB,EAAc,CAAC,EAAqBjB,EAAyB,CAAA,IAAO,CAExE,MAAMkB,EAAmB,EAAE,eAA+B,GACpDC,EAAuBX,EAAS,KAAMQ,GAAMA,EAAE,KAAOE,CAAe,EAE1E,GAAK,EAAE,eAA+B,UAAY,SAAU,OAAOT,EAAY,EAAE,EAE5EU,GACHV,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,QAAUhB,EAAK,OAAS,GAAK,CAAC,CAAC,CAGxE,EAEMoB,EAAgB,CACpB,EACApB,IACG,CACC,EAAE,OAAS,cAAgB,EAAE,OAAS,UAAWe,EAAY,EAAGf,CAAI,EAC/D,EAAE,OAAS,cAAciB,EAAY,EAAGjB,CAAI,CACvD,EAEA,OACEqB,EAAAA,kBAAAA,KAAAC,6BAAA,CACE,SAAA,CAAAD,yBAACE,EAAAA,QAAA,CACE,SAAA,CAAArB,GAAUA,EACXsB,EAAAA,kBAAAA,IAACC,EAAAA,SAAA,CACC,MAAOzB,EACP,YAAAW,EACA,UAAWS,EACX,MAAO,EACP,mBAAAhB,EACA,YAAa,IAAME,EAAY,EAAK,CAAA,CAAA,EAErCH,GACCkB,EAAAA,kBAAAA,KAACK,SAAA,CACE,SAAA,CAAAvB,EACDqB,EAAAA,kBAAAA,IAACG,EAAAA,OAAA,CAAO,KAAK,eAAe,QAAQ,OAAO,QAAS,IAAMC,kBAAgBzB,CAAM,CAAA,CAAG,CAAA,CAAA,CACrF,CAAA,EAEJ,EACCK,EAAS,IAAI,CAACR,EAAM6B,IACnBL,EAAAA,kBAAAA,IAACC,EAAAA,SAAA,CAEE,GAAGzB,EACJ,UAAWA,EAAK,WAAa,KAC7B,MAAOA,EAAK,OAAS,CAAA,EACrB,YAAAW,EACA,QAAO,GACP,UAAWS,EACX,QAAS,IAAMX,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,KAAOhB,EAAK,EAAE,CAAC,EACnE,YAAa,IAAMM,EAAY,EAAK,EACpC,SAAUS,EACV,mBAAAX,EACA,cAAe,OACf,UAAW,MAAA,EAZNyB,CAAA,CAcR,CAAA,EACH,CAEJ"}
+{"version":3,"file":"Menu.cjs.js","sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import React, { useState, ReactNode } from 'react'\nimport * as Styled from './Menu.styled'\nimport { MenuList } from './MenuList'\nimport { copyToClipboard } from '@shared/util'\nimport { Button } from '@ynput/ayon-react-components'\nimport { PowerpackFeature, useMenuContext, usePowerpack } from '@shared/context'\n\nexport interface MenuItemType {\n  id: string\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  onClick?: (e: React.MouseEvent) => void\n  link?: string\n  disableClose?: boolean\n  disabled?: boolean\n  powerFeature?: PowerpackFeature\n  active?: boolean\n  hidden?: boolean\n  node?: ReactNode\n  [key: string]: any\n}\n\ninterface SubMenu {\n  id: string\n  items: MenuItemType[]\n  level: number\n  parentRef?: HTMLElement\n  style?: React.CSSProperties\n}\n\ninterface MenuProps {\n  menu?: MenuItemType[]\n  onClose?: () => void\n  header?: ReactNode\n  footer?: string\n}\n\nexport const Menu: React.FC<MenuProps> = ({ menu = [], onClose, header, footer = '' }) => {\n  const { setPowerpackDialog } = usePowerpack()\n  const { setMenuOpen } = useMenuContext()\n\n  const [subMenus, setSubMenus] = useState<SubMenu[]>([])\n  //   When a menu item is clicked, the following happens:\n  const handleClick = (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => {\n    // this is handled by Link component inside the MenuItem\n    if (url) return onClose?.()\n\n    onClick?.(e)\n\n    if (!disableClose && onClose) onClose()\n  }\n\n  const onMenuEnter = (e: React.MouseEvent, menu: Partial<SubMenu> & { items: MenuItemType[] }) => {\n    // check to see if we need to open a submenu\n    if (menu.items.length) {\n      // yes, there is a submenu\n      // open it if it is not already open\n      if (!subMenus.find((m) => m.id === menu.id)) {\n        // also close any other submenus on the same level\n        setSubMenus([\n          ...subMenus.filter((m) => m.level < (menu.level || 0) + 1),\n          {\n            ...menu,\n            id: menu.id!,\n            level: (menu.level || 0) + 1,\n            parentRef: e.target as HTMLElement,\n          } as SubMenu,\n        ])\n      }\n    } else {\n      // no items for this menu, so close all submenus on the higher levels\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0)))\n    }\n  }\n\n  const onMenuLeave = (e: React.MouseEvent, menu: Partial<SubMenu> = {}) => {\n    // target where we are going\n    const relatedTargetId = (e.relatedTarget as HTMLElement)?.id\n    const relatedTargetSubMenu = subMenus.find((m) => m.id === relatedTargetId)\n\n    if ((e.relatedTarget as HTMLElement)?.tagName === 'DIALOG') return setSubMenus([])\n\n    if (!relatedTargetSubMenu) {\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0) + 1))\n    }\n    //   if (menu.items.length) {\n  }\n\n  const handleSubMenu = (\n    e: React.MouseEvent,\n    menu: Partial<SubMenu> & { items: MenuItemType[] },\n  ) => {\n    if (e.type === 'mouseenter' || e.type === 'keydown') onMenuEnter(e, menu)\n    else if (e.type === 'mouseleave') onMenuLeave(e, menu)\n  }\n\n  return (\n    <>\n      <Styled.Section>\n        {header && header}\n        <MenuList\n          items={menu}\n          handleClick={handleClick}\n          onSubMenu={handleSubMenu}\n          level={0}\n          setPowerpackDialog={setPowerpackDialog}\n          onMenuClose={() => setMenuOpen(false)}\n        />\n        {footer && (\n          <Styled.Footer>\n            {footer}\n            <Button icon=\"content_copy\" variant=\"text\" onClick={() => copyToClipboard(footer)} />\n          </Styled.Footer>\n        )}\n      </Styled.Section>\n      {subMenus.map((menu, i) => (\n        <MenuList\n          key={i}\n          {...menu}\n          parentRef={menu.parentRef || null}\n          style={menu.style || {}}\n          handleClick={handleClick}\n          subMenu\n          onSubMenu={handleSubMenu}\n          onClose={() => setSubMenus(subMenus.filter((m) => m.id !== menu.id))}\n          onMenuClose={() => setMenuOpen(false)}\n          onChange={onMenuEnter}\n          setPowerpackDialog={setPowerpackDialog}\n          itemClassName={undefined}\n          itemStyle={undefined}\n        />\n      ))}\n    </>\n  )\n}\n"],"names":["Menu","menu","onClose","header","footer","setPowerpackDialog","usePowerpack","setMenuOpen","useMenuContext","subMenus","setSubMenus","useState","handleClick","onClick","url","disableClose","onMenuEnter","m","onMenuLeave","relatedTargetId","relatedTargetSubMenu","handleSubMenu","jsxs","Fragment","Styled.Section","jsx","MenuList","Styled.Footer","Button","copyToClipboard","i"],"mappings":"qxCA2CO,MAAMA,EAA4B,CAAC,CAAE,KAAAC,EAAO,CAAA,EAAI,QAAAC,EAAS,OAAAC,EAAQ,OAAAC,EAAS,MAAS,CACxF,KAAM,CAAE,mBAAAC,CAAA,EAAuBC,eAAA,EACzB,CAAE,YAAAC,CAAA,EAAgBC,iBAAA,EAElB,CAACC,EAAUC,CAAW,EAAIC,EAAAA,SAAoB,CAAA,CAAE,EAEhDC,EAAc,CAClB,EACAC,EACAC,EACAC,IACG,CAEH,GAAID,SAAYZ,IAAA,EAEhBW,IAAU,CAAC,EAEP,CAACE,GAAgBb,GAASA,EAAA,CAChC,EAEMc,EAAc,CAAC,EAAqBf,IAAuD,CAE3FA,EAAK,MAAM,OAGRQ,EAAS,KAAMQ,GAAMA,EAAE,KAAOhB,EAAK,EAAE,GAExCS,EAAY,CACV,GAAGD,EAAS,OAAQQ,GAAMA,EAAE,OAAShB,EAAK,OAAS,GAAK,CAAC,EACzD,CACE,GAAGA,EACH,GAAIA,EAAK,GACT,OAAQA,EAAK,OAAS,GAAK,EAC3B,UAAW,EAAE,MAAA,CACf,CACD,EAIHS,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,QAAUhB,EAAK,OAAS,EAAE,CAAC,CAEpE,EAEMiB,EAAc,CAAC,EAAqBjB,EAAyB,CAAA,IAAO,CAExE,MAAMkB,EAAmB,EAAE,eAA+B,GACpDC,EAAuBX,EAAS,KAAMQ,GAAMA,EAAE,KAAOE,CAAe,EAE1E,GAAK,EAAE,eAA+B,UAAY,SAAU,OAAOT,EAAY,EAAE,EAE5EU,GACHV,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,QAAUhB,EAAK,OAAS,GAAK,CAAC,CAAC,CAGxE,EAEMoB,EAAgB,CACpB,EACApB,IACG,CACC,EAAE,OAAS,cAAgB,EAAE,OAAS,UAAWe,EAAY,EAAGf,CAAI,EAC/D,EAAE,OAAS,cAAciB,EAAY,EAAGjB,CAAI,CACvD,EAEA,OACEqB,EAAAA,kBAAAA,KAAAC,6BAAA,CACE,SAAA,CAAAD,yBAACE,EAAAA,QAAA,CACE,SAAA,CAAArB,GAAUA,EACXsB,EAAAA,kBAAAA,IAACC,EAAAA,SAAA,CACC,MAAOzB,EACP,YAAAW,EACA,UAAWS,EACX,MAAO,EACP,mBAAAhB,EACA,YAAa,IAAME,EAAY,EAAK,CAAA,CAAA,EAErCH,GACCkB,EAAAA,kBAAAA,KAACK,SAAA,CACE,SAAA,CAAAvB,EACDqB,EAAAA,kBAAAA,IAACG,EAAAA,OAAA,CAAO,KAAK,eAAe,QAAQ,OAAO,QAAS,IAAMC,kBAAgBzB,CAAM,CAAA,CAAG,CAAA,CAAA,CACrF,CAAA,EAEJ,EACCK,EAAS,IAAI,CAACR,EAAM6B,IACnBL,EAAAA,kBAAAA,IAACC,EAAAA,SAAA,CAEE,GAAGzB,EACJ,UAAWA,EAAK,WAAa,KAC7B,MAAOA,EAAK,OAAS,CAAA,EACrB,YAAAW,EACA,QAAO,GACP,UAAWS,EACX,QAAS,IAAMX,EAAYD,EAAS,OAAQQ,GAAMA,EAAE,KAAOhB,EAAK,EAAE,CAAC,EACnE,YAAa,IAAMM,EAAY,EAAK,EACpC,SAAUS,EACV,mBAAAX,EACA,cAAe,OACf,UAAW,MAAA,EAZNyB,CAAA,CAcR,CAAA,EACH,CAEJ"}

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

@@ -10,6 +10,7 @@ import "../../util/pubsub.es.js";
 import { Button as C } from "@ynput/ayon-react-components";
 import "../../context/RemoteModulesContext.es.js";
 import "../../context/DetailsPanelContext.es.js";
+import "../../context/SubtasksModulesContext.es.js";
 import "../../context/ThumbnailUploaderContext.es.js";
 import "../../context/SettingsPanelContext.es.js";
 import "../../context/pip/PiPProvider.es.js";
@@ -25,7 +26,7 @@ import "../../context/GlobalContext.es.js";
 import "../../context/ProjectContext.es.js";
 import "../../context/ProjectFoldersContext.es.js";
 import "../../context/UriContext.es.js";
-const $ = ({ menu: x = [], onClose: l, header: a, footer: s = "" }) => {
+const ee = ({ menu: x = [], onClose: l, header: a, footer: s = "" }) => {
   const { setPowerpackDialog: f } = h(), { setMenuOpen: u } = k(), [r, n] = y([]), d = (e, t, o, p) => {
     if (o) return l?.();
     t?.(e), !p && l && l();
@@ -86,6 +87,6 @@ const $ = ({ menu: x = [], onClose: l, header: a, footer: s = "" }) => {
   ] });
 };
 export {
-  $ as Menu
+  ee as Menu
 };
 //# sourceMappingURL=Menu.es.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"Menu.es.js","sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import React, { useState, ReactNode } from 'react'\nimport * as Styled from './Menu.styled'\nimport { MenuList } from './MenuList'\nimport { copyToClipboard } from '@shared/util'\nimport { Button } from '@ynput/ayon-react-components'\nimport { PowerpackFeature, useMenuContext, usePowerpack } from '@shared/context'\n\nexport interface MenuItemType {\n  id: string\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  onClick?: (e: React.MouseEvent) => void\n  link?: string\n  disableClose?: boolean\n  disabled?: boolean\n  powerFeature?: PowerpackFeature\n  active?: boolean\n  hidden?: boolean\n  node?: ReactNode\n  [key: string]: any\n}\n\ninterface SubMenu {\n  id: string\n  items: MenuItemType[]\n  level: number\n  parentRef?: HTMLElement\n  style?: React.CSSProperties\n}\n\ninterface MenuProps {\n  menu?: MenuItemType[]\n  onClose?: () => void\n  header?: ReactNode\n  footer?: string\n}\n\nexport const Menu: React.FC<MenuProps> = ({ menu = [], onClose, header, footer = '' }) => {\n  const { setPowerpackDialog } = usePowerpack()\n  const { setMenuOpen } = useMenuContext()\n\n  const [subMenus, setSubMenus] = useState<SubMenu[]>([])\n  //   When a menu item is clicked, the following happens:\n  const handleClick = (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => {\n    // this is handled by Link component inside the MenuItem\n    if (url) return onClose?.()\n\n    onClick?.(e)\n\n    if (!disableClose && onClose) onClose()\n  }\n\n  const onMenuEnter = (e: React.MouseEvent, menu: Partial<SubMenu> & { items: MenuItemType[] }) => {\n    // check to see if we need to open a submenu\n    if (menu.items.length) {\n      // yes, there is a submenu\n      // open it if it is not already open\n      if (!subMenus.find((m) => m.id === menu.id)) {\n        // also close any other submenus on the same level\n        setSubMenus([\n          ...subMenus.filter((m) => m.level < (menu.level || 0) + 1),\n          {\n            ...menu,\n            id: menu.id!,\n            level: (menu.level || 0) + 1,\n            parentRef: e.target as HTMLElement,\n          } as SubMenu,\n        ])\n      }\n    } else {\n      // no items for this menu, so close all submenus on the higher levels\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0)))\n    }\n  }\n\n  const onMenuLeave = (e: React.MouseEvent, menu: Partial<SubMenu> = {}) => {\n    // target where we are going\n    const relatedTargetId = (e.relatedTarget as HTMLElement)?.id\n    const relatedTargetSubMenu = subMenus.find((m) => m.id === relatedTargetId)\n\n    if ((e.relatedTarget as HTMLElement)?.tagName === 'DIALOG') return setSubMenus([])\n\n    if (!relatedTargetSubMenu) {\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0) + 1))\n    }\n    //   if (menu.items.length) {\n  }\n\n  const handleSubMenu = (\n    e: React.MouseEvent,\n    menu: Partial<SubMenu> & { items: MenuItemType[] },\n  ) => {\n    if (e.type === 'mouseenter' || e.type === 'keydown') onMenuEnter(e, menu)\n    else if (e.type === 'mouseleave') onMenuLeave(e, menu)\n  }\n\n  return (\n    <>\n      <Styled.Section>\n        {header && header}\n        <MenuList\n          items={menu}\n          handleClick={handleClick}\n          onSubMenu={handleSubMenu}\n          level={0}\n          setPowerpackDialog={setPowerpackDialog}\n          onMenuClose={() => setMenuOpen(false)}\n        />\n        {footer && (\n          <Styled.Footer>\n            {footer}\n            <Button icon=\"content_copy\" variant=\"text\" onClick={() => copyToClipboard(footer)} />\n          </Styled.Footer>\n        )}\n      </Styled.Section>\n      {subMenus.map((menu, i) => (\n        <MenuList\n          key={i}\n          {...menu}\n          parentRef={menu.parentRef || null}\n          style={menu.style || {}}\n          handleClick={handleClick}\n          subMenu\n          onSubMenu={handleSubMenu}\n          onClose={() => setSubMenus(subMenus.filter((m) => m.id !== menu.id))}\n          onMenuClose={() => setMenuOpen(false)}\n          onChange={onMenuEnter}\n          setPowerpackDialog={setPowerpackDialog}\n          itemClassName={undefined}\n          itemStyle={undefined}\n        />\n      ))}\n    </>\n  )\n}\n"],"names":["Menu","menu","onClose","header","footer","setPowerpackDialog","usePowerpack","setMenuOpen","useMenuContext","subMenus","setSubMenus","useState","handleClick","onClick","url","disableClose","onMenuEnter","m","onMenuLeave","relatedTargetId","relatedTargetSubMenu","handleSubMenu","jsxs","Fragment","Styled.Section","jsx","MenuList","Styled.Footer","Button","copyToClipboard","i"],"mappings":"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"}
+{"version":3,"file":"Menu.es.js","sources":["../../../../../src/components/Menu/Menu.tsx"],"sourcesContent":["import React, { useState, ReactNode } from 'react'\nimport * as Styled from './Menu.styled'\nimport { MenuList } from './MenuList'\nimport { copyToClipboard } from '@shared/util'\nimport { Button } from '@ynput/ayon-react-components'\nimport { PowerpackFeature, useMenuContext, usePowerpack } from '@shared/context'\n\nexport interface MenuItemType {\n  id: string\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  onClick?: (e: React.MouseEvent) => void\n  link?: string\n  disableClose?: boolean\n  disabled?: boolean\n  powerFeature?: PowerpackFeature\n  active?: boolean\n  hidden?: boolean\n  node?: ReactNode\n  [key: string]: any\n}\n\ninterface SubMenu {\n  id: string\n  items: MenuItemType[]\n  level: number\n  parentRef?: HTMLElement\n  style?: React.CSSProperties\n}\n\ninterface MenuProps {\n  menu?: MenuItemType[]\n  onClose?: () => void\n  header?: ReactNode\n  footer?: string\n}\n\nexport const Menu: React.FC<MenuProps> = ({ menu = [], onClose, header, footer = '' }) => {\n  const { setPowerpackDialog } = usePowerpack()\n  const { setMenuOpen } = useMenuContext()\n\n  const [subMenus, setSubMenus] = useState<SubMenu[]>([])\n  //   When a menu item is clicked, the following happens:\n  const handleClick = (\n    e: React.MouseEvent,\n    onClick?: (e: React.MouseEvent) => void,\n    url?: string,\n    disableClose?: boolean,\n  ) => {\n    // this is handled by Link component inside the MenuItem\n    if (url) return onClose?.()\n\n    onClick?.(e)\n\n    if (!disableClose && onClose) onClose()\n  }\n\n  const onMenuEnter = (e: React.MouseEvent, menu: Partial<SubMenu> & { items: MenuItemType[] }) => {\n    // check to see if we need to open a submenu\n    if (menu.items.length) {\n      // yes, there is a submenu\n      // open it if it is not already open\n      if (!subMenus.find((m) => m.id === menu.id)) {\n        // also close any other submenus on the same level\n        setSubMenus([\n          ...subMenus.filter((m) => m.level < (menu.level || 0) + 1),\n          {\n            ...menu,\n            id: menu.id!,\n            level: (menu.level || 0) + 1,\n            parentRef: e.target as HTMLElement,\n          } as SubMenu,\n        ])\n      }\n    } else {\n      // no items for this menu, so close all submenus on the higher levels\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0)))\n    }\n  }\n\n  const onMenuLeave = (e: React.MouseEvent, menu: Partial<SubMenu> = {}) => {\n    // target where we are going\n    const relatedTargetId = (e.relatedTarget as HTMLElement)?.id\n    const relatedTargetSubMenu = subMenus.find((m) => m.id === relatedTargetId)\n\n    if ((e.relatedTarget as HTMLElement)?.tagName === 'DIALOG') return setSubMenus([])\n\n    if (!relatedTargetSubMenu) {\n      setSubMenus(subMenus.filter((m) => m.level <= (menu.level || 0) + 1))\n    }\n    //   if (menu.items.length) {\n  }\n\n  const handleSubMenu = (\n    e: React.MouseEvent,\n    menu: Partial<SubMenu> & { items: MenuItemType[] },\n  ) => {\n    if (e.type === 'mouseenter' || e.type === 'keydown') onMenuEnter(e, menu)\n    else if (e.type === 'mouseleave') onMenuLeave(e, menu)\n  }\n\n  return (\n    <>\n      <Styled.Section>\n        {header && header}\n        <MenuList\n          items={menu}\n          handleClick={handleClick}\n          onSubMenu={handleSubMenu}\n          level={0}\n          setPowerpackDialog={setPowerpackDialog}\n          onMenuClose={() => setMenuOpen(false)}\n        />\n        {footer && (\n          <Styled.Footer>\n            {footer}\n            <Button icon=\"content_copy\" variant=\"text\" onClick={() => copyToClipboard(footer)} />\n          </Styled.Footer>\n        )}\n      </Styled.Section>\n      {subMenus.map((menu, i) => (\n        <MenuList\n          key={i}\n          {...menu}\n          parentRef={menu.parentRef || null}\n          style={menu.style || {}}\n          handleClick={handleClick}\n          subMenu\n          onSubMenu={handleSubMenu}\n          onClose={() => setSubMenus(subMenus.filter((m) => m.id !== menu.id))}\n          onMenuClose={() => setMenuOpen(false)}\n          onChange={onMenuEnter}\n          setPowerpackDialog={setPowerpackDialog}\n          itemClassName={undefined}\n          itemStyle={undefined}\n        />\n      ))}\n    </>\n  )\n}\n"],"names":["Menu","menu","onClose","header","footer","setPowerpackDialog","usePowerpack","setMenuOpen","useMenuContext","subMenus","setSubMenus","useState","handleClick","onClick","url","disableClose","onMenuEnter","m","onMenuLeave","relatedTargetId","relatedTargetSubMenu","handleSubMenu","jsxs","Fragment","Styled.Section","jsx","MenuList","Styled.Footer","Button","copyToClipboard","i"],"mappings":"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"}

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

@@ -1,2 +1,2 @@
-"use strict";const e=require("../../../../_virtual/jsx-runtime.cjs.js"),t=require("@ynput/ayon-react-components"),M=require("react"),m=require("./Menu.styled.cjs.js"),N=require("lodash"),P=require("react-router-dom"),C=require("clsx");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 q=M.forwardRef(({label:r,icon:i,img:n,highlighted:j,notification:l,selected:p,danger:R,items:d=[],className:h,isLink:o,isDev:g,shortcut:u,disabled:E,powerFeature:I,active:w,...c},y)=>{const x=N.isArray(r)?r:[r],{powerLicense:f}=L.usePowerpack(),s=!f&&I,a=e.jsxRuntimeExports.jsxs(m.Item,{ref:y,className:C("menu-item",{highlighted:j,selected:p,notification:l,danger:R,dev:g,disabled:E,power:s},h),...c,"aria-label":x.join(", "),children:[(i||s)&&e.jsxRuntimeExports.jsx(t.Icon,{icon:s?"bolt":i}),n&&e.jsxRuntimeExports.jsx(m.Img,{src:n,alt:`${r} icon`}),x.map((k,A)=>e.jsxRuntimeExports.jsx("span",{children:k},A)),u&&e.jsxRuntimeExports.jsx(t.ShortcutTag,{style:{minWidth:22,textAlign:"center"},align:"right",children:u}),w&&e.jsxRuntimeExports.jsx(t.Icon,{icon:"check",style:{marginLeft:"auto"}}),!!d.length&&e.jsxRuntimeExports.jsx(t.Icon,{icon:"arrow_right",className:"more"})]});return o?e.jsxRuntimeExports.jsx(P.Link,{to:o,target:c.target,children:a}):a});q.displayName="MenuItem";module.exports=q;
+"use strict";const e=require("../../../../_virtual/jsx-runtime.cjs.js"),t=require("@ynput/ayon-react-components"),M=require("react"),q=require("./Menu.styled.cjs.js"),N=require("lodash"),P=require("react-router-dom"),C=require("clsx");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/SubtasksModulesContext.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 m=M.forwardRef(({label:r,icon:i,img:n,highlighted:j,notification:l,selected:p,danger:R,items:d=[],className:h,isLink:o,isDev:g,shortcut:u,disabled:E,powerFeature:I,active:w,...c},y)=>{const x=N.isArray(r)?r:[r],{powerLicense:f}=L.usePowerpack(),s=!f&&I,a=e.jsxRuntimeExports.jsxs(q.Item,{ref:y,className:C("menu-item",{highlighted:j,selected:p,notification:l,danger:R,dev:g,disabled:E,power:s},h),...c,"aria-label":x.join(", "),children:[(i||s)&&e.jsxRuntimeExports.jsx(t.Icon,{icon:s?"bolt":i}),n&&e.jsxRuntimeExports.jsx(q.Img,{src:n,alt:`${r} icon`}),x.map((k,A)=>e.jsxRuntimeExports.jsx("span",{children:k},A)),u&&e.jsxRuntimeExports.jsx(t.ShortcutTag,{style:{minWidth:22,textAlign:"center"},align:"right",children:u}),w&&e.jsxRuntimeExports.jsx(t.Icon,{icon:"check",style:{marginLeft:"auto"}}),!!d.length&&e.jsxRuntimeExports.jsx(t.Icon,{icon:"arrow_right",className:"more"})]});return o?e.jsxRuntimeExports.jsx(P.Link,{to:o,target:c.target,children:a}):a});m.displayName="MenuItem";module.exports=m;
 //# sourceMappingURL=MenuItem.cjs.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"MenuItem.cjs.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 } = 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,\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","usePowerpack","isPowerFeature","Item","jsxs","Styled.Item","clsx","jsx","Icon","Styled.Img","index","ShortcutTag","Link"],"mappings":"6hCA2BA,MAAMA,EAAWC,EAAAA,WACf,CACE,CACE,MAAAC,EACA,KAAAC,EACA,IAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,OAAAC,EACA,MAAAC,EAAQ,CAAA,EACR,UAAAC,EACA,OAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,aAAAC,EACA,OAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAcC,EAAAA,QAAQlB,CAAK,EAAIA,EAAQ,CAACA,CAAK,EAC7C,CAAE,aAAAmB,CAAA,EAAiBC,eAAA,EACnBC,EAAiB,CAACF,GAAgBN,EAElCS,EACJC,EAAAA,kBAAAA,KAACC,EAAAA,KAAA,CACC,IAAAR,EACA,UAAWS,EACT,YACA,CACE,YAAAtB,EACA,SAAAE,EACA,aAAAD,EACA,OAAAE,EACA,IAAKI,EACL,SAAAE,EACA,MAAOS,CAAA,EAETb,CAAA,EAED,GAAGO,EACJ,aAAYE,EAAY,KAAK,IAAI,EAE/B,SAAA,EAAAhB,GAAQoB,IAAmBK,EAAAA,kBAAAA,IAACC,EAAAA,KAAA,CAAK,KAAMN,EAAiB,OAASpB,EAAO,EACzEC,GAAOwB,EAAAA,kBAAAA,IAACE,MAAA,CAAW,IAAK1B,EAAK,IAAK,GAAGF,CAAK,QAAS,EACnDiB,EAAY,IAAI,CAACjB,EAAO6B,4BACtB,OAAA,CAAkB,SAAA7B,CAAAA,EAAR6B,CAAc,CAC1B,EACAlB,GACCe,EAAAA,kBAAAA,IAACI,EAAAA,YAAA,CAAY,MAAO,CAAE,SAAU,GAAI,UAAW,QAAA,EAAY,MAAO,QAC/D,SAAAnB,CAAA,CACH,EAEDG,2BAAWa,EAAAA,KAAA,CAAK,KAAK,QAAQ,MAAO,CAAE,WAAY,MAAA,EAAU,EAE5D,CAAC,CAACpB,EAAM,gCAAWoB,EAAAA,KAAA,CAAK,KAAK,cAAc,UAAU,MAAA,CAAO,CAAA,CAAA,CAAA,EAIjE,OAAIlB,0BAECsB,EAAAA,KAAA,CAAK,GAAItB,EAAQ,OAAQM,EAAM,OAC7B,SAAAO,EACH,EAGKA,CAEX,CACF,EAEAxB,EAAS,YAAc"}
+{"version":3,"file":"MenuItem.cjs.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 } = 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,\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","usePowerpack","isPowerFeature","Item","jsxs","Styled.Item","clsx","jsx","Icon","Styled.Img","index","ShortcutTag","Link"],"mappings":"olCA2BA,MAAMA,EAAWC,EAAAA,WACf,CACE,CACE,MAAAC,EACA,KAAAC,EACA,IAAAC,EACA,YAAAC,EACA,aAAAC,EACA,SAAAC,EACA,OAAAC,EACA,MAAAC,EAAQ,CAAA,EACR,UAAAC,EACA,OAAAC,EACA,MAAAC,EACA,SAAAC,EACA,SAAAC,EACA,aAAAC,EACA,OAAAC,EACA,GAAGC,CAAA,EAELC,IACG,CACH,MAAMC,EAAcC,EAAAA,QAAQlB,CAAK,EAAIA,EAAQ,CAACA,CAAK,EAC7C,CAAE,aAAAmB,CAAA,EAAiBC,eAAA,EACnBC,EAAiB,CAACF,GAAgBN,EAElCS,EACJC,EAAAA,kBAAAA,KAACC,EAAAA,KAAA,CACC,IAAAR,EACA,UAAWS,EACT,YACA,CACE,YAAAtB,EACA,SAAAE,EACA,aAAAD,EACA,OAAAE,EACA,IAAKI,EACL,SAAAE,EACA,MAAOS,CAAA,EAETb,CAAA,EAED,GAAGO,EACJ,aAAYE,EAAY,KAAK,IAAI,EAE/B,SAAA,EAAAhB,GAAQoB,IAAmBK,EAAAA,kBAAAA,IAACC,EAAAA,KAAA,CAAK,KAAMN,EAAiB,OAASpB,EAAO,EACzEC,GAAOwB,EAAAA,kBAAAA,IAACE,MAAA,CAAW,IAAK1B,EAAK,IAAK,GAAGF,CAAK,QAAS,EACnDiB,EAAY,IAAI,CAACjB,EAAO6B,4BACtB,OAAA,CAAkB,SAAA7B,CAAAA,EAAR6B,CAAc,CAC1B,EACAlB,GACCe,EAAAA,kBAAAA,IAACI,EAAAA,YAAA,CAAY,MAAO,CAAE,SAAU,GAAI,UAAW,QAAA,EAAY,MAAO,QAC/D,SAAAnB,CAAA,CACH,EAEDG,2BAAWa,EAAAA,KAAA,CAAK,KAAK,QAAQ,MAAO,CAAE,WAAY,MAAA,EAAU,EAE5D,CAAC,CAACpB,EAAM,gCAAWoB,EAAAA,KAAA,CAAK,KAAK,cAAc,UAAU,MAAA,CAAO,CAAA,CAAA,CAAA,EAIjE,OAAIlB,0BAECsB,EAAAA,KAAA,CAAK,GAAItB,EAAQ,OAAQM,EAAM,OAC7B,SAAAO,EACH,EAGKA,CAEX,CACF,EAEAxB,EAAS,YAAc"}

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

@@ -7,6 +7,7 @@ import { Link as v } from "react-router-dom";
 import E from "clsx";
 import "../../context/RemoteModulesContext.es.js";
 import "../../context/DetailsPanelContext.es.js";
+import "../../context/SubtasksModulesContext.es.js";
 import "../../context/ThumbnailUploaderContext.es.js";
 import "../../context/SettingsPanelContext.es.js";
 import "../../context/pip/PiPProvider.es.js";
@@ -33,9 +34,9 @@ const S = M(
     danger: j,
     items: u = [],
     className: d,
-    isLink: s,
+    isLink: p,
     isDev: g,
-    shortcut: p,
+    shortcut: s,
     disabled: h,
     powerFeature: w,
     active: I,
@@ -64,13 +65,13 @@ const S = M(
           (i || o) && /* @__PURE__ */ r.jsx(m, { icon: o ? "bolt" : i }),
           e && /* @__PURE__ */ r.jsx(R, { src: e, alt: `${t} icon` }),
           a.map((N, k) => /* @__PURE__ */ r.jsx("span", { children: N }, k)),
-          p && /* @__PURE__ */ r.jsx(L, { style: { minWidth: 22, textAlign: "center" }, align: "right", children: p }),
+          s && /* @__PURE__ */ r.jsx(L, { style: { minWidth: 22, textAlign: "center" }, align: "right", children: s }),
           I && /* @__PURE__ */ r.jsx(m, { icon: "check", style: { marginLeft: "auto" } }),
           !!u.length && /* @__PURE__ */ r.jsx(m, { icon: "arrow_right", className: "more" })
         ]
       }
     );
-    return s ? /* @__PURE__ */ r.jsx(v, { to: s, target: n.target, children: c }) : c;
+    return p ? /* @__PURE__ */ r.jsx(v, { to: p, target: n.target, children: c }) : c;
   }
 );
 S.displayName = "MenuItem";

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

@@ -1 +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 } = 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,\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","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,CAAA;AAAA,IACR,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,QAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAcC,EAAQlB,CAAK,IAAIA,IAAQ,CAACA,CAAK,GAC7C,EAAE,cAAAmB,EAAA,IAAiBC,EAAA,GACnBC,IAAiB,CAACF,KAAgBN,GAElCS,IACJC,gBAAAA,EAAAA;AAAAA,MAACC;AAAAA,MAAA;AAAA,QACC,KAAAR;AAAA,QACA,WAAWS;AAAA,UACT;AAAA,UACA;AAAA,YACE,aAAAtB;AAAA,YACA,UAAAE;AAAA,YACA,cAAAD;AAAA,YACA,QAAAE;AAAA,YACA,KAAKI;AAAA,YACL,UAAAE;AAAA,YACA,OAAOS;AAAA,UAAA;AAAA,UAETb;AAAA,QAAA;AAAA,QAED,GAAGO;AAAA,QACJ,cAAYE,EAAY,KAAK,IAAI;AAAA,QAE/B,UAAA;AAAA,WAAAhB,KAAQoB,MAAmBK,gBAAAA,EAAAA,IAACC,GAAA,EAAK,MAAMN,IAAiB,SAASpB,GAAO;AAAA,UACzEC,KAAOwB,gBAAAA,EAAAA,IAACE,GAAA,EAAW,KAAK1B,GAAK,KAAK,GAAGF,CAAK,SAAS;AAAA,UACnDiB,EAAY,IAAI,CAACjB,GAAO6B,4BACtB,QAAA,EAAkB,UAAA7B,EAAAA,GAAR6B,CAAc,CAC1B;AAAA,UACAlB,KACCe,gBAAAA,EAAAA,IAACI,GAAA,EAAY,OAAO,EAAE,UAAU,IAAI,WAAW,SAAA,GAAY,OAAO,SAC/D,UAAAnB,EAAA,CACH;AAAA,UAEDG,2BAAWa,GAAA,EAAK,MAAK,SAAQ,OAAO,EAAE,YAAY,OAAA,GAAU;AAAA,UAE5D,CAAC,CAACpB,EAAM,gCAAWoB,GAAA,EAAK,MAAK,eAAc,WAAU,OAAA,CAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAIjE,WAAIlB,0BAECsB,GAAA,EAAK,IAAItB,GAAQ,QAAQM,EAAM,QAC7B,UAAAO,GACH,IAGKA;AAAAA,EAEX;AACF;AAEAxB,EAAS,cAAc;"}
+{"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 } = 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,\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","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,CAAA;AAAA,IACR,WAAAC;AAAA,IACA,QAAAC;AAAA,IACA,OAAAC;AAAA,IACA,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,cAAAC;AAAA,IACA,QAAAC;AAAA,IACA,GAAGC;AAAA,EAAA,GAELC,MACG;AACH,UAAMC,IAAcC,EAAQlB,CAAK,IAAIA,IAAQ,CAACA,CAAK,GAC7C,EAAE,cAAAmB,EAAA,IAAiBC,EAAA,GACnBC,IAAiB,CAACF,KAAgBN,GAElCS,IACJC,gBAAAA,EAAAA;AAAAA,MAACC;AAAAA,MAAA;AAAA,QACC,KAAAR;AAAA,QACA,WAAWS;AAAA,UACT;AAAA,UACA;AAAA,YACE,aAAAtB;AAAA,YACA,UAAAE;AAAA,YACA,cAAAD;AAAA,YACA,QAAAE;AAAA,YACA,KAAKI;AAAA,YACL,UAAAE;AAAA,YACA,OAAOS;AAAA,UAAA;AAAA,UAETb;AAAA,QAAA;AAAA,QAED,GAAGO;AAAA,QACJ,cAAYE,EAAY,KAAK,IAAI;AAAA,QAE/B,UAAA;AAAA,WAAAhB,KAAQoB,MAAmBK,gBAAAA,EAAAA,IAACC,GAAA,EAAK,MAAMN,IAAiB,SAASpB,GAAO;AAAA,UACzEC,KAAOwB,gBAAAA,EAAAA,IAACE,GAAA,EAAW,KAAK1B,GAAK,KAAK,GAAGF,CAAK,SAAS;AAAA,UACnDiB,EAAY,IAAI,CAACjB,GAAO6B,4BACtB,QAAA,EAAkB,UAAA7B,EAAAA,GAAR6B,CAAc,CAC1B;AAAA,UACAlB,KACCe,gBAAAA,EAAAA,IAACI,GAAA,EAAY,OAAO,EAAE,UAAU,IAAI,WAAW,SAAA,GAAY,OAAO,SAC/D,UAAAnB,EAAA,CACH;AAAA,UAEDG,2BAAWa,GAAA,EAAK,MAAK,SAAQ,OAAO,EAAE,YAAY,OAAA,GAAU;AAAA,UAE5D,CAAC,CAACpB,EAAM,gCAAWoB,GAAA,EAAK,MAAK,eAAc,WAAU,OAAA,CAAO;AAAA,QAAA;AAAA,MAAA;AAAA,IAAA;AAIjE,WAAIlB,0BAECsB,GAAA,EAAK,IAAItB,GAAQ,QAAQM,EAAM,QAC7B,UAAAO,GACH,IAGKA;AAAAA,EAEX;AACF;AAEAxB,EAAS,cAAc;"}

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

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

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

@@ -1 +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","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","MenuItem","isLastChild","Icon"],"mappings":"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"}
+{"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","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","MenuItem","isLastChild","Icon"],"mappings":"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"}

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

@@ -5,6 +5,7 @@ import { Icon as z } from "@ynput/ayon-react-components";
 import { MenuWrapper as G, Menu as H } from "./Menu.styled.es.js";
 import "../../context/RemoteModulesContext.es.js";
 import "../../context/DetailsPanelContext.es.js";
+import "../../context/SubtasksModulesContext.es.js";
 import "../../context/ThumbnailUploaderContext.es.js";
 import "../../context/SettingsPanelContext.es.js";
 import "../../context/pip/PiPProvider.es.js";
@@ -20,7 +21,7 @@ import "../../context/GlobalContext.es.js";
 import "../../context/ProjectContext.es.js";
 import "../../context/ProjectFoldersContext.es.js";
 import "../../context/UriContext.es.js";
-const ht = ({
+const xt = ({
   items: L,
   handleClick: d,
   onSubMenu: g,
@@ -28,7 +29,7 @@ const ht = ({
   level: j,
   id: P = "root-menu",
   parentRef: h,
-  style: m,
+  style: c,
   onClose: R,
   onMenuClose: C,
   itemClassName: E,
@@ -40,8 +41,8 @@ const ht = ({
     !a.current[s] || !n.current || g?.(e, {
       id: s,
       style: {
-        top: a.current[s].offsetTop + (m?.top || 0) - 4,
-        right: n.current.getBoundingClientRect().width + (m?.right || 0) - 12
+        top: a.current[s].offsetTop + (c?.top || 0) - 4,
+        right: n.current.getBoundingClientRect().width + (c?.right || 0) - 12
       },
       items: f,
       level: j
@@ -54,7 +55,7 @@ const ht = ({
   }, [i]), /* @__PURE__ */ p.jsx(
     G,
     {
-      style: { paddingRight: i ? 16 : 0, ...m },
+      style: { paddingRight: i ? 16 : 0, ...c },
       className: i ? "sub-menu" : "menu-list",
       id: P,
       onMouseLeave: F,
@@ -76,11 +77,11 @@ const ht = ({
           disableClose: S,
           selected: q,
           disabled: A,
-          powerFeature: c,
+          powerFeature: m,
           active: K,
           ...y
-        } = e, { powerLicense: T } = J(), k = !T && c, v = (t) => {
-          t.preventDefault(), t.stopPropagation(), c && D?.(c), C?.();
+        } = e, { powerLicense: T } = J(), k = !T && m, v = (t) => {
+          t.preventDefault(), t.stopPropagation(), m && D?.(m), C?.();
         };
         return /* @__PURE__ */ p.jsx(
           _,
@@ -93,7 +94,7 @@ const ht = ({
             items: r,
             selected: q,
             disabled: A,
-            powerFeature: c,
+            powerFeature: m,
             active: K,
             isLink: u,
             onClick: (t) => k ? v(t) : r.length ? l(t, o, r) : d(t, x, u, S),
@@ -117,6 +118,6 @@ const ht = ({
   );
 };
 export {
-  ht as MenuList
+  xt as MenuList
 };
 //# sourceMappingURL=MenuList.es.js.map

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

@@ -1 +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","handleMouseLeave","useEffect","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","e","MenuItem","isLastChild","Icon"],"mappings":"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"}
+{"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","handleMouseLeave","useEffect","jsx","Styled.MenuWrapper","Styled.Menu","item","i","label","icon","img","highlighted","onClick","link","disableClose","selected","disabled","powerFeature","active","powerLicense","usePowerpack","isPowerFeature","handleClickPowerFeature","e","MenuItem","isLastChild","Icon"],"mappings":"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"}

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

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=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 u=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"),l=require("clsx"),d=require("react"),q=require("styled-components"),y=q(s.Button)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const c=require("../../../../_virtual/jsx-runtime.cjs.js");require("../../context/RemoteModulesContext.cjs.js");require("../../context/DetailsPanelContext.cjs.js");require("../../context/SubtasksModulesContext.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 u=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"),l=require("clsx"),d=require("react"),q=require("styled-components"),y=q(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","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,EAAAA,WAC7B,CAAC,CAAE,QAAAC,EAAS,OAAAC,EAAQ,GAAGC,CAAA,EAASC,IAAQ,CACtC,KAAM,CAAE,mBAAAC,CAAA,EAAuBC,eAAA,EAEzBC,EAAiBC,GAAqC,CAE1DH,EAAmBJ,CAAO,EAE1BE,EAAM,UAAUK,CAAC,CACnB,EAEA,OACEC,EAAAA,kBAAAA,IAACb,EAAA,CACC,QAASO,EAAM,SAAW,WAC1B,KAAMA,EAAM,MAAQ,OACnB,GAAGA,EACJ,IAAAC,EACA,QAASG,EACT,UAAWG,EAAK,eAAgBP,EAAM,WAAa,GAAI,CACrD,OAAQ,CAAC,CAACA,EAAM,SAChB,OAAAD,CAAA,CACD,EACD,eAAc,gBACd,qBAAoB,EAEnB,SAAAC,EAAM,QAAA,CAAA,CAGb,CACF"}
+{"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","jsx","clsx"],"mappings":"wmCAMMA,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,EAAAA,WAC7B,CAAC,CAAE,QAAAC,EAAS,OAAAC,EAAQ,GAAGC,CAAA,EAASC,IAAQ,CACtC,KAAM,CAAE,mBAAAC,CAAA,EAAuBC,eAAA,EAEzBC,EAAiBC,GAAqC,CAE1DH,EAAmBJ,CAAO,EAE1BE,EAAM,UAAUK,CAAC,CACnB,EAEA,OACEC,EAAAA,kBAAAA,IAACb,EAAA,CACC,QAASO,EAAM,SAAW,WAC1B,KAAMA,EAAM,MAAQ,OACnB,GAAGA,EACJ,IAAAC,EACA,QAASG,EACT,UAAWG,EAAK,eAAgBP,EAAM,WAAa,GAAI,CACrD,OAAQ,CAAC,CAACA,EAAM,SAChB,OAAAD,CAAA,CACD,EACD,eAAc,gBACd,qBAAoB,EAEnB,SAAAC,EAAM,QAAA,CAAA,CAGb,CACF"}

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

@@ -1,6 +1,7 @@
 import { j as e } from "../../../../_virtual/jsx-runtime.es.js";
 import "../../context/RemoteModulesContext.es.js";
 import "../../context/DetailsPanelContext.es.js";
+import "../../context/SubtasksModulesContext.es.js";
 import "../../context/ThumbnailUploaderContext.es.js";
 import "../../context/SettingsPanelContext.es.js";
 import "../../context/pip/PiPProvider.es.js";
@@ -42,7 +43,7 @@ const u = p(l)`
   .icon {
     font-variation-settings: 'FILL' 1, 'wght' 200, 'GRAD' 200, 'opsz' 20;
   }
-`, I = d(
+`, O = d(
   ({ feature: r, filled: t, ...o }, i) => {
     const { setPowerpackDialog: a } = n(), m = (c) => {
       a(r), o.onClick?.(c);
@@ -67,6 +68,6 @@ const u = p(l)`
   }
 );
 export {
-  I 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","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;AACtC,UAAM,EAAE,oBAAAC,EAAA,IAAuBC,EAAA,GAEzBC,IAAgB,CAACC,MAAqC;AAE1D,MAAAH,EAAmBJ,CAAO,GAE1BE,EAAM,UAAUK,CAAC;AAAA,IACnB;AAEA,WACEC,gBAAAA,EAAAA;AAAAA,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,UAAAC,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAGb;AACF;"}
+{"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","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;AACtC,UAAM,EAAE,oBAAAC,EAAA,IAAuBC,EAAA,GAEzBC,IAAgB,CAACC,MAAqC;AAE1D,MAAAH,EAAmBJ,CAAO,GAE1BE,EAAM,UAAUK,CAAC;AAAA,IACnB;AAEA,WACEC,gBAAAA,EAAAA;AAAAA,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,UAAAC,EAAM;AAAA,MAAA;AAAA,IAAA;AAAA,EAGb;AACF;"}