@ynput/ayon-frontend-shared 0.3.41 → 0.3.43

package/dist/shared/src/containers/Actions/Actions.es.js

@@ -1,7 +1,7 @@
 import { j as c } from "../../../../_virtual/jsx-runtime.es.js";
 import { Actions as X, FeaturedAction as Y } from "./Actions.styled.es.js";
-import { useState as F, useMemo as d, useEffect as Z } from "react";
-import N from "clsx";
+import { useState as N, useMemo as d, useEffect as Z } from "react";
+import S from "clsx";
 import { toast as f } from "react-toastify";
 import "../../api/base/client.es.js";
 import "../../api/generated/graphql.es.js";
@@ -45,7 +45,6 @@ import "../../api/generated/grouping.es.js";
 import "../../api/generated/views.es.js";
 import { useGetActionsFromContextQuery as oo, useExecuteActionMutation as to } from "../../api/queries/actions/getActions.es.js";
 import "../../api/queries/activities/getActivities.es.js";
-import "../../api/queries/activities/updateActivities.es.js";
 import "../../api/queries/activities/updateReaction.es.js";
 import "../../api/queries/activities/getMentions.es.js";
 import "../../api/queries/activities/getCategories.es.js";
@@ -107,6 +106,8 @@ import "lodash";
 import "../../context/PowerpackContextInstance.es.js";
 import "../../context/UriContext.es.js";
 import "../../context/DetailsPanelContextInstance.es.js";
+import "uuid";
+import "../../util/pubsub.es.js";
 import "../../context/SubtasksModulesContextInstance.es.js";
 import "../../context/ThumbnailUploaderContext.es.js";
 import "../../context/SettingsPanelContext.es.js";
@@ -123,8 +124,6 @@ import "../../context/ProjectContext.es.js";
 import "../../context/ProjectFoldersContext.es.js";
 import { useActionTriggers as eo } from "../../hooks/useActionTriggers.es.js";
 import "../ProjectTreeTable/components/GroupSettingsFallback.es.js";
-import "uuid";
-import "../../util/pubsub.es.js";
 import { ActionConfigDialog as no } from "./ActionConfigDialog.es.js";
 import { InteractiveActionDialog as po } from "./InteractiveActionDialog.es.js";
 const x = {
@@ -133,54 +132,54 @@ const x = {
   isPlaceholder: !0,
   icon: { type: "material-symbols", name: "sync" },
   groupLabel: ""
-}, Sr = ({
-  entities: l,
+}, Nr = ({
+  entities: a,
   entityType: g,
   entitySubTypes: j,
-  isLoadingEntity: S,
-  projectActionsProjectName: E,
-  searchParams: I,
+  isLoadingEntity: I,
+  projectActionsProjectName: v,
+  searchParams: k,
   featuredCount: m = 2,
-  isDeveloperMode: k,
+  bundleMode: E,
   onNavigate: D,
   onSetSearchParams: O,
   align: P,
   pt: _
 }) => {
-  const { handleActionPayload: T } = eo({ onNavigate: D, onSetSearchParams: O, searchParams: I }), [B, L] = F(null), [M, b] = F(null), u = d(() => {
-    if (E)
+  const { handleActionPayload: T } = eo({ onNavigate: D, onSetSearchParams: O, searchParams: k }), [B, L] = N(null), [V, h] = N(null), u = d(() => {
+    if (v)
       return {
         entityType: "project",
-        projectName: E
+        projectName: v
       };
-    if (!l.length || !l[0].projectName) return null;
-    const o = l.filter((r) => r.entitySubType).map((r) => r.entitySubType).filter((r, i, s) => s.indexOf(r) === i && r), t = j?.length ? j : o;
+    if (!a.length || !a[0].projectName) return null;
+    const o = a.filter((r) => r.entitySubType).map((r) => r.entitySubType).filter((r, i, s) => s.indexOf(r) === i && r), t = j?.length ? j : o;
     return !t?.length && g !== "version" && g !== "representation" ? (console.warn("No entity subtypes found"), null) : {
-      projectName: l[0].projectName,
+      projectName: a[0].projectName,
       entityType: g,
-      entityIds: l.map((r) => r.id),
+      entityIds: a.map((r) => r.id),
       entitySubtypes: t
     };
-  }, [l, g]);
+  }, [a, g]);
   Z(() => {
-    b(null);
+    h(null);
   }, [u]);
-  const { data: V, isFetching: z } = oo(
-    { mode: "simple", actionContext: u },
+  const { data: z, isFetching: G } = oo(
+    { mode: "simple", variant: E, actionContext: u },
     { skip: !u }
-  ), a = V?.actions || [], h = ["application", "admin", "workflow"], n = d(() => a.reduce((t, r) => {
+  ), l = z?.actions || [], b = ["application", "admin", "workflow"], n = d(() => l.reduce((t, r) => {
     const i = r.category || "uncategorized";
     return t[i] || (t[i] = []), t[i].push(r), t;
-  }, {}), [a]), v = d(
+  }, {}), [l]), w = d(
     () => [
       ...new Set(
-        Object.keys(n).filter((o) => !h.includes(o)).sort((o, t) => o.localeCompare(t))
+        Object.keys(n).filter((o) => !b.includes(o)).sort((o, t) => o.localeCompare(t))
       )
     ],
     [n]
-  ), w = [...h, ...v], G = d(() => {
+  ), C = [...b, ...w], M = d(() => {
     const o = [];
-    return w.forEach((t) => {
+    return C.forEach((t) => {
       if (!n[t] || !n[t].length) return;
       o.push({
         label: t,
@@ -202,9 +201,9 @@ const x = {
       disabled: !0,
       header: !0
     }), o;
-  }, [n, v, h]), Q = d(() => {
-    let o = a.filter((t) => t.featured).sort((t, r) => (t.order || 0) - (r.order || 0)).slice(0, m);
-    return o.length < m && w.forEach((t) => {
+  }, [n, w, b]), Q = d(() => {
+    let o = l.filter((t) => t.featured).sort((t, r) => (t.order || 0) - (r.order || 0)).slice(0, m);
+    return o.length < m && C.forEach((t) => {
       if (o.length >= m) return;
       const r = n[t];
       if (!(!r || !r.length))
@@ -214,9 +213,9 @@ const x = {
           s.icon && o.push(s);
         }
     }), o;
-  }, [a, n, x]), [R, { isLoading: U, originalArgs: $ }] = to(), q = U && $?.identifier, y = async (o, t, r) => {
+  }, [l, n, x]), [R, { isLoading: U, originalArgs: $ }] = to(), q = U && $?.identifier, y = async (o, t, r) => {
     t?.preventDefault();
-    const i = a.find((p) => p.identifier === o);
+    const i = l.find((p) => p.identifier === o);
     if (!i) {
       f.error("Action not found"), console.warn("Action not found", o);
       return;
@@ -226,11 +225,11 @@ const x = {
       addonVersion: i.addonVersion,
       variant: i.variant,
       identifier: i.identifier
-    }, C = { ...u };
-    r && (C.formData = r);
+    }, F = { ...u };
+    r && (F.formData = r);
     let e = null;
     try {
-      e = await R({ actionContext: C, ...s }).unwrap();
+      e = await R({ actionContext: F, ...s }).unwrap();
     } catch (p) {
       console.error("Error executing action", p), f.error(p?.data?.detail || "Error executing action");
       return;
@@ -253,26 +252,26 @@ const x = {
             // @ts-expect-error
             cancelIcon: e.payload.cancel_icon
           };
-          b(p);
+          h(p);
         } else
           T(e.type, e.payload);
     } catch (p) {
       console.warn("Error during action response processing", p), f.error("Error occured during action processing");
     }
   }, H = (o) => {
-    const t = a.find((r) => r.identifier === o);
+    const t = l.find((r) => r.identifier === o);
     t && L(t);
   }, J = async (o, t) => {
     y(o, null, t);
   }, K = d(
     () => Array(m).fill(x),
     [m, x]
-  ), A = z || S, W = A ? K : Q;
-  return /* @__PURE__ */ c.jsxs(X, { className: N("actions", { loading: A }), children: [
+  ), A = G || I, W = A ? K : Q;
+  return /* @__PURE__ */ c.jsxs(X, { className: S("actions", { loading: A }), children: [
     W.map((o, t) => /* @__PURE__ */ c.jsx(
       Y,
       {
-        className: N("action", {
+        className: S("action", {
           isPlaceholder: o.isPlaceholder
         }),
         "data-tooltip": o.groupLabel ? o.groupLabel + " " + o.label : o.label,
@@ -285,11 +284,11 @@ const x = {
     /* @__PURE__ */ c.jsx(
       ro,
       {
-        options: G,
+        options: M,
         isLoading: A && m > 0,
         onAction: y,
         onConfig: H,
-        isDeveloperMode: k,
+        bundleMode: E,
         align: P,
         ..._?.dropdown
       }
@@ -305,14 +304,14 @@ const x = {
     /* @__PURE__ */ c.jsx(
       po,
       {
-        interactiveForm: M,
-        onClose: () => b(null),
+        interactiveForm: V,
+        onClose: () => h(null),
         onSubmit: J
       }
     )
   ] });
 };
 export {
-  Sr as Actions
+  Nr as Actions
 };
 //# sourceMappingURL=Actions.es.js.map

package/dist/shared/src/containers/Actions/Actions.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"Actions.es.js","sources":["../../../../../src/containers/Actions/Actions.tsx"],"sourcesContent":["import * as Styled from './Actions.styled'\nimport { MouseEvent, useState } from 'react'\nimport clsx from 'clsx'\nimport { toast } from 'react-toastify'\nimport { useMemo, useEffect } from 'react'\nimport { ActionContext, useExecuteActionMutation, useGetActionsFromContextQuery } from '@shared/api'\nimport { ActionsDropdown, ActionsDropdownProps } from './ActionsDropdown'\nimport ActionIcon from './ActionIcon'\nimport { ActionTriggersProps, useActionTriggers } from '@shared/hooks'\nimport { ActionConfigDialog } from './ActionConfigDialog'\nimport { InteractiveActionDialog, InteractiveForm } from './InteractiveActionDialog'\n\nconst placeholder = {\n  identifier: 'placeholder',\n  label: 'Featured action slot',\n  isPlaceholder: true,\n  icon: { type: 'material-symbols', name: 'sync' },\n  groupLabel: '',\n}\n\ninterface ActionsProps extends ActionTriggersProps {\n  entities: { id: string; projectName: string; entitySubType?: string }[]\n  entityType: ActionContext['entityType']\n  entitySubTypes?: string[]\n  isLoadingEntity: boolean\n  projectActionsProjectName?: string\n  featuredCount?: number\n  isDeveloperMode: boolean\n  align?: ActionsDropdownProps['align']\n  pt?: {\n    dropdown?: Partial<ActionsDropdownProps>\n  }\n}\n\nexport const Actions = ({\n  entities,\n  entityType,\n  entitySubTypes,\n  isLoadingEntity,\n  projectActionsProjectName,\n  searchParams,\n  featuredCount = 2,\n  isDeveloperMode,\n  onNavigate,\n  onSetSearchParams,\n  align,\n  pt,\n}: ActionsProps) => {\n  // special triggers the actions can make to perform stuff on the client\n  const { handleActionPayload } = useActionTriggers({ onNavigate, onSetSearchParams, searchParams })\n  const [actionBeingConfigured, setActionBeingConfigured] = useState<any>(null)\n  const [interactiveForm, setInteractiveForm] = useState<any>(null)\n\n  const context: ActionContext | null = useMemo(() => {\n    if (projectActionsProjectName) {\n      return {\n        entityType: 'project',\n        projectName: projectActionsProjectName,\n      }\n    }\n    if (!entities.length) return null\n    if (!entities[0].projectName) return null\n\n    // get a list of unique entity subtypes from loaded data\n    const entitySubtypesLoaded = entities\n      .filter((entity) => entity.entitySubType)\n      .map((entity) => entity.entitySubType as string)\n      .filter((value, index, self) => self.indexOf(value) === index && value)\n\n    // try and use the passed in entitySubTypes, if not use the loaded ones\n    const entitySubTypesToUse = entitySubTypes?.length ? entitySubTypes : entitySubtypesLoaded\n\n    // all types except version/representation should have subtypes\n    if (\n      !entitySubTypesToUse?.length &&\n      entityType !== 'version' &&\n      entityType !== 'representation'\n    ) {\n      console.warn('No entity subtypes found')\n      return null\n    }\n\n    return {\n      projectName: entities[0].projectName,\n      entityType: entityType,\n      entityIds: entities.map((entity) => entity.id),\n      entitySubtypes: entitySubTypesToUse,\n    }\n  }, [entities, entityType])\n\n  useEffect(() => {\n    setInteractiveForm(null)\n  }, [context])\n\n  const { data, isFetching: isFetchingActions } = useGetActionsFromContextQuery(\n    { mode: 'simple', actionContext: context as ActionContext },\n    { skip: !context },\n  )\n\n  const actions = data?.actions || []\n\n  const categoryOrder = ['application', 'admin', 'workflow']\n  // group actions by category\n  // sort by hardcoded category, this will changing the future\n  const groupedActions = useMemo(() => {\n    // Step 1: Group actions by category\n    const grouped = actions.reduce((acc: { [key: string]: any[] }, action) => {\n      const category = action.category || 'uncategorized'\n      if (!acc[category]) {\n        acc[category] = []\n      }\n      acc[category].push(action)\n      return acc\n    }, {})\n\n    // Step 5: Return the ordered groups\n    return grouped\n  }, [actions])\n\n  // get categories that don't have a specific order (not in categoryOrder)\n  // then sort them alphabetically\n  const unorderedCategories = useMemo(\n    () => [\n      ...new Set(\n        Object.keys(groupedActions)\n          .filter((category) => !categoryOrder.includes(category))\n          .sort((a, b) => a.localeCompare(b)),\n      ),\n    ],\n    [groupedActions],\n  )\n\n  const categories = [...categoryOrder, ...unorderedCategories]\n\n  // create the options for the dropdown, each category is separated by a divider and a title\n  // for the divider we will use a custom dropdown item template\n  const dropdownOptions = useMemo(() => {\n    const options = []\n\n    categories.forEach((category) => {\n      if (!groupedActions[category] || !groupedActions[category].length) return\n\n      options.push({\n        label: category,\n        header: true,\n        value: category,\n        disabled: true,\n      })\n\n      const groupOptions = groupedActions[category].map((action) => ({\n        value: action.identifier,\n        label: action.groupLabel ? action.groupLabel + ' ' + action.label : action.label,\n        icon: action.icon,\n        hasConfig: !!action.configFields,\n        description: action.description,\n      }))\n\n      options.push(...groupOptions)\n    })\n\n    // if no actions, add placeholder\n    if (!options.length) {\n      options.push({\n        label: 'No actions available',\n        value: 'no-actions',\n        disabled: true,\n        header: true,\n      })\n    }\n\n    return options\n  }, [groupedActions, unorderedCategories, categoryOrder])\n\n  const featuredActions = useMemo(() => {\n    // Filter and sort to get initial featured actions\n    let tempFeaturedActions = actions\n      .filter((action) => action.featured)\n      .sort((a, b) => (a.order || 0) - (b.order || 0))\n      .slice(0, featuredCount)\n\n    // Check if we need to add more actions to reach featuredCount\n    if (tempFeaturedActions.length < featuredCount) {\n      categories.forEach((category) => {\n        if (tempFeaturedActions.length >= featuredCount) return\n        const actions = groupedActions[category]\n        if (!actions || !actions.length) return\n\n        for (let i = tempFeaturedActions.length; i < featuredCount; i++) {\n          const action = actions[i]\n          if (!action) break\n          if (!action.icon) continue\n          tempFeaturedActions.push(action)\n        }\n      })\n    }\n\n    return tempFeaturedActions\n  }, [actions, groupedActions, placeholder])\n\n  const [executeAction, { isLoading: isLoadingExecution, originalArgs }] =\n    useExecuteActionMutation()\n  const executingAction = isLoadingExecution && originalArgs?.identifier\n\n  const handleExecuteAction = async (\n    identifier: string,\n    e?: MouseEvent<HTMLElement> | null,\n    formData?: InteractiveForm,\n  ) => {\n    e?.preventDefault()\n    const action = actions.find((option) => option.identifier === identifier)\n\n    if (!action) {\n      toast.error('Action not found')\n      console.warn('Action not found', identifier)\n      return\n    }\n\n    const params = {\n      addonName: action.addonName as string,\n      addonVersion: action.addonVersion as string,\n      variant: action.variant,\n      identifier: action.identifier,\n    }\n\n    const actionContext = { ...context }\n    if (formData) {\n      actionContext.formData = formData\n    }\n\n    let response = null\n\n    try {\n      response = await executeAction({ actionContext, ...params }).unwrap()\n    } catch (error: any) {\n      console.error('Error executing action', error)\n      toast.error(error?.data?.detail || 'Error executing action')\n      return\n    }\n\n    try {\n      // Toast the message if it is available\n      if (response?.message) {\n        if (response?.success) {\n          toast.success(response.message, { autoClose: 2000 })\n        } else {\n          toast.error(response.message, { autoClose: 2000 })\n        }\n      }\n\n      // Even if response?.success is false, we still want to handle the payload\n      // as it may contain useful information - complex error messages in form,\n      // redirect to another page etc. If the action just needs to abort,\n      // it raises exception instead of returning a response with success: false\n\n      // Use the new hook to handle payload\n      if (response?.payload) {\n        if (response.type === 'form') {\n          // action requests additional information from the user.\n          // we show a dialog with the form and when the user submits it we call the action again\n\n          // It probably does not make sense to move to the useActionTriggers hook\n          // as it need contexts and the dialog\n          const intf = {\n            identifier,\n            // @ts-expect-error\n            title: response.payload['title'],\n            // @ts-expect-error\n            fields: response.payload['fields'],\n            // @ts-expect-error\n            submitLabel: response.payload['submit_label'],\n            // @ts-expect-error\n            cancelLabel: response.payload['cancel_label'],\n            // @ts-expect-error\n            submitIcon: response.payload['submit_icon'],\n            // @ts-expect-error\n            cancelIcon: response.payload['cancel_icon'],\n          }\n          setInteractiveForm(intf)\n        } else {\n          handleActionPayload(response.type as string, response.payload)\n        }\n      }\n    } catch (error) {\n      // got response, but failed to process it\n      console.warn('Error during action response processing', error)\n      toast.error('Error occured during action processing')\n    }\n  }\n\n  const handleConfigureAction = (identifier: string) => {\n    const action = actions.find((data) => data.identifier === identifier)\n    if (!action) return\n    setActionBeingConfigured(action)\n  }\n\n  const handleSubmitInteractiveForm = async (identifier: string, formData: InteractiveForm) => {\n    handleExecuteAction(identifier, null, formData)\n  }\n\n  const loadingActions = useMemo(\n    () => Array(featuredCount).fill(placeholder),\n    [featuredCount, placeholder],\n  )\n\n  const isLoading = isFetchingActions || isLoadingEntity\n  const featuredActionsToDisplay = isLoading ? loadingActions : featuredActions\n\n  return (\n    <Styled.Actions className={clsx('actions', { loading: isLoading })}>\n      {featuredActionsToDisplay.map((action, i) => (\n        <Styled.FeaturedAction\n          key={action.identifier + '-' + i}\n          className={clsx('action', {\n            isPlaceholder: action.isPlaceholder,\n          })}\n          data-tooltip={action.groupLabel ? action.groupLabel + ' ' + action.label : action.label}\n          disabled={action.isPlaceholder}\n          onClick={(e) => handleExecuteAction(action.identifier, e)}\n        >\n          {/* @ts-ignore */}\n          <ActionIcon icon={action.icon} isExecuting={executingAction === action.identifier} />\n        </Styled.FeaturedAction>\n      ))}\n      <ActionsDropdown\n        options={dropdownOptions}\n        isLoading={isLoading && featuredCount > 0}\n        onAction={handleExecuteAction}\n        onConfig={handleConfigureAction}\n        isDeveloperMode={isDeveloperMode}\n        align={align}\n        {...pt?.dropdown}\n      />\n      <ActionConfigDialog\n        action={actionBeingConfigured}\n        // @ts-expect-error\n        context={context}\n        onClose={() => setActionBeingConfigured(null)}\n      />\n      <InteractiveActionDialog\n        interactiveForm={interactiveForm}\n        onClose={() => setInteractiveForm(null)}\n        // @ts-expect-error\n        onSubmit={handleSubmitInteractiveForm}\n      />\n    </Styled.Actions>\n  )\n}\n"],"names":["placeholder","Actions","entities","entityType","entitySubTypes","isLoadingEntity","projectActionsProjectName","searchParams","featuredCount","isDeveloperMode","onNavigate","onSetSearchParams","align","pt","handleActionPayload","useActionTriggers","actionBeingConfigured","setActionBeingConfigured","useState","interactiveForm","setInteractiveForm","context","useMemo","entitySubtypesLoaded","entity","value","index","self","entitySubTypesToUse","useEffect","data","isFetchingActions","useGetActionsFromContextQuery","actions","categoryOrder","groupedActions","acc","action","category","unorderedCategories","a","b","categories","dropdownOptions","options","groupOptions","featuredActions","tempFeaturedActions","executeAction","isLoadingExecution","originalArgs","useExecuteActionMutation","executingAction","handleExecuteAction","identifier","e","formData","option","toast","params","actionContext","response","error","intf","handleConfigureAction","handleSubmitInteractiveForm","loadingActions","isLoading","featuredActionsToDisplay","jsxs","Styled.Actions","clsx","i","jsx","Styled.FeaturedAction","ActionIcon","ActionsDropdown","ActionConfigDialog","InteractiveActionDialog"],"mappings":"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"}
+{"version":3,"file":"Actions.es.js","sources":["../../../../../src/containers/Actions/Actions.tsx"],"sourcesContent":["import * as Styled from './Actions.styled'\nimport { MouseEvent, useState } from 'react'\nimport clsx from 'clsx'\nimport { toast } from 'react-toastify'\nimport { useMemo, useEffect } from 'react'\nimport { ActionContext, useExecuteActionMutation, useGetActionsFromContextQuery } from '@shared/api'\nimport { ActionsDropdown, ActionsDropdownProps } from './ActionsDropdown'\nimport ActionIcon from './ActionIcon'\nimport { ActionTriggersProps, useActionTriggers } from '@shared/hooks'\nimport { ActionConfigDialog } from './ActionConfigDialog'\nimport { InteractiveActionDialog, InteractiveForm } from './InteractiveActionDialog'\nimport { BundleMode } from '@shared/util'\n\nconst placeholder = {\n  identifier: 'placeholder',\n  label: 'Featured action slot',\n  isPlaceholder: true,\n  icon: { type: 'material-symbols', name: 'sync' },\n  groupLabel: '',\n}\n\ninterface ActionsProps extends ActionTriggersProps {\n  entities: { id: string; projectName: string; entitySubType?: string }[]\n  entityType: ActionContext['entityType']\n  entitySubTypes?: string[]\n  isLoadingEntity: boolean\n  projectActionsProjectName?: string\n  featuredCount?: number\n  bundleMode: BundleMode\n  align?: ActionsDropdownProps['align']\n  pt?: {\n    dropdown?: Partial<ActionsDropdownProps>\n  }\n}\n\nexport const Actions = ({\n  entities,\n  entityType,\n  entitySubTypes,\n  isLoadingEntity,\n  projectActionsProjectName,\n  searchParams,\n  featuredCount = 2,\n  bundleMode,\n  onNavigate,\n  onSetSearchParams,\n  align,\n  pt,\n}: ActionsProps) => {\n  // special triggers the actions can make to perform stuff on the client\n  const { handleActionPayload } = useActionTriggers({ onNavigate, onSetSearchParams, searchParams })\n  const [actionBeingConfigured, setActionBeingConfigured] = useState<any>(null)\n  const [interactiveForm, setInteractiveForm] = useState<any>(null)\n\n  const context: ActionContext | null = useMemo(() => {\n    if (projectActionsProjectName) {\n      return {\n        entityType: 'project',\n        projectName: projectActionsProjectName,\n      }\n    }\n    if (!entities.length) return null\n    if (!entities[0].projectName) return null\n\n    // get a list of unique entity subtypes from loaded data\n    const entitySubtypesLoaded = entities\n      .filter((entity) => entity.entitySubType)\n      .map((entity) => entity.entitySubType as string)\n      .filter((value, index, self) => self.indexOf(value) === index && value)\n\n    // try and use the passed in entitySubTypes, if not use the loaded ones\n    const entitySubTypesToUse = entitySubTypes?.length ? entitySubTypes : entitySubtypesLoaded\n\n    // all types except version/representation should have subtypes\n    if (\n      !entitySubTypesToUse?.length &&\n      entityType !== 'version' &&\n      entityType !== 'representation'\n    ) {\n      console.warn('No entity subtypes found')\n      return null\n    }\n\n    return {\n      projectName: entities[0].projectName,\n      entityType: entityType,\n      entityIds: entities.map((entity) => entity.id),\n      entitySubtypes: entitySubTypesToUse,\n    }\n  }, [entities, entityType])\n\n  useEffect(() => {\n    setInteractiveForm(null)\n  }, [context])\n\n  const { data, isFetching: isFetchingActions } = useGetActionsFromContextQuery(\n    { mode: 'simple', variant: bundleMode, actionContext: context as ActionContext },\n    { skip: !context },\n  )\n\n  const actions = data?.actions || []\n\n  const categoryOrder = ['application', 'admin', 'workflow']\n  // group actions by category\n  // sort by hardcoded category, this will changing the future\n  const groupedActions = useMemo(() => {\n    // Step 1: Group actions by category\n    const grouped = actions.reduce((acc: { [key: string]: any[] }, action) => {\n      const category = action.category || 'uncategorized'\n      if (!acc[category]) {\n        acc[category] = []\n      }\n      acc[category].push(action)\n      return acc\n    }, {})\n\n    // Step 5: Return the ordered groups\n    return grouped\n  }, [actions])\n\n  // get categories that don't have a specific order (not in categoryOrder)\n  // then sort them alphabetically\n  const unorderedCategories = useMemo(\n    () => [\n      ...new Set(\n        Object.keys(groupedActions)\n          .filter((category) => !categoryOrder.includes(category))\n          .sort((a, b) => a.localeCompare(b)),\n      ),\n    ],\n    [groupedActions],\n  )\n\n  const categories = [...categoryOrder, ...unorderedCategories]\n\n  // create the options for the dropdown, each category is separated by a divider and a title\n  // for the divider we will use a custom dropdown item template\n  const dropdownOptions = useMemo(() => {\n    const options = []\n\n    categories.forEach((category) => {\n      if (!groupedActions[category] || !groupedActions[category].length) return\n\n      options.push({\n        label: category,\n        header: true,\n        value: category,\n        disabled: true,\n      })\n\n      const groupOptions = groupedActions[category].map((action) => ({\n        value: action.identifier,\n        label: action.groupLabel ? action.groupLabel + ' ' + action.label : action.label,\n        icon: action.icon,\n        hasConfig: !!action.configFields,\n        description: action.description,\n      }))\n\n      options.push(...groupOptions)\n    })\n\n    // if no actions, add placeholder\n    if (!options.length) {\n      options.push({\n        label: 'No actions available',\n        value: 'no-actions',\n        disabled: true,\n        header: true,\n      })\n    }\n\n    return options\n  }, [groupedActions, unorderedCategories, categoryOrder])\n\n  const featuredActions = useMemo(() => {\n    // Filter and sort to get initial featured actions\n    let tempFeaturedActions = actions\n      .filter((action) => action.featured)\n      .sort((a, b) => (a.order || 0) - (b.order || 0))\n      .slice(0, featuredCount)\n\n    // Check if we need to add more actions to reach featuredCount\n    if (tempFeaturedActions.length < featuredCount) {\n      categories.forEach((category) => {\n        if (tempFeaturedActions.length >= featuredCount) return\n        const actions = groupedActions[category]\n        if (!actions || !actions.length) return\n\n        for (let i = tempFeaturedActions.length; i < featuredCount; i++) {\n          const action = actions[i]\n          if (!action) break\n          if (!action.icon) continue\n          tempFeaturedActions.push(action)\n        }\n      })\n    }\n\n    return tempFeaturedActions\n  }, [actions, groupedActions, placeholder])\n\n  const [executeAction, { isLoading: isLoadingExecution, originalArgs }] =\n    useExecuteActionMutation()\n  const executingAction = isLoadingExecution && originalArgs?.identifier\n\n  const handleExecuteAction = async (\n    identifier: string,\n    e?: MouseEvent<HTMLElement> | null,\n    formData?: InteractiveForm,\n  ) => {\n    e?.preventDefault()\n    const action = actions.find((option) => option.identifier === identifier)\n\n    if (!action) {\n      toast.error('Action not found')\n      console.warn('Action not found', identifier)\n      return\n    }\n\n    const params = {\n      addonName: action.addonName as string,\n      addonVersion: action.addonVersion as string,\n      variant: action.variant,\n      identifier: action.identifier,\n    }\n\n    const actionContext = { ...context }\n    if (formData) {\n      actionContext.formData = formData\n    }\n\n    let response = null\n\n    try {\n      response = await executeAction({ actionContext, ...params }).unwrap()\n    } catch (error: any) {\n      console.error('Error executing action', error)\n      toast.error(error?.data?.detail || 'Error executing action')\n      return\n    }\n\n    try {\n      // Toast the message if it is available\n      if (response?.message) {\n        if (response?.success) {\n          toast.success(response.message, { autoClose: 2000 })\n        } else {\n          toast.error(response.message, { autoClose: 2000 })\n        }\n      }\n\n      // Even if response?.success is false, we still want to handle the payload\n      // as it may contain useful information - complex error messages in form,\n      // redirect to another page etc. If the action just needs to abort,\n      // it raises exception instead of returning a response with success: false\n\n      // Use the new hook to handle payload\n      if (response?.payload) {\n        if (response.type === 'form') {\n          // action requests additional information from the user.\n          // we show a dialog with the form and when the user submits it we call the action again\n\n          // It probably does not make sense to move to the useActionTriggers hook\n          // as it need contexts and the dialog\n          const intf = {\n            identifier,\n            // @ts-expect-error\n            title: response.payload['title'],\n            // @ts-expect-error\n            fields: response.payload['fields'],\n            // @ts-expect-error\n            submitLabel: response.payload['submit_label'],\n            // @ts-expect-error\n            cancelLabel: response.payload['cancel_label'],\n            // @ts-expect-error\n            submitIcon: response.payload['submit_icon'],\n            // @ts-expect-error\n            cancelIcon: response.payload['cancel_icon'],\n          }\n          setInteractiveForm(intf)\n        } else {\n          handleActionPayload(response.type as string, response.payload)\n        }\n      }\n    } catch (error) {\n      // got response, but failed to process it\n      console.warn('Error during action response processing', error)\n      toast.error('Error occured during action processing')\n    }\n  }\n\n  const handleConfigureAction = (identifier: string) => {\n    const action = actions.find((data) => data.identifier === identifier)\n    if (!action) return\n    setActionBeingConfigured(action)\n  }\n\n  const handleSubmitInteractiveForm = async (identifier: string, formData: InteractiveForm) => {\n    handleExecuteAction(identifier, null, formData)\n  }\n\n  const loadingActions = useMemo(\n    () => Array(featuredCount).fill(placeholder),\n    [featuredCount, placeholder],\n  )\n\n  const isLoading = isFetchingActions || isLoadingEntity\n  const featuredActionsToDisplay = isLoading ? loadingActions : featuredActions\n\n  return (\n    <Styled.Actions className={clsx('actions', { loading: isLoading })}>\n      {featuredActionsToDisplay.map((action, i) => (\n        <Styled.FeaturedAction\n          key={action.identifier + '-' + i}\n          className={clsx('action', {\n            isPlaceholder: action.isPlaceholder,\n          })}\n          data-tooltip={action.groupLabel ? action.groupLabel + ' ' + action.label : action.label}\n          disabled={action.isPlaceholder}\n          onClick={(e) => handleExecuteAction(action.identifier, e)}\n        >\n          {/* @ts-ignore */}\n          <ActionIcon icon={action.icon} isExecuting={executingAction === action.identifier} />\n        </Styled.FeaturedAction>\n      ))}\n      <ActionsDropdown\n        options={dropdownOptions}\n        isLoading={isLoading && featuredCount > 0}\n        onAction={handleExecuteAction}\n        onConfig={handleConfigureAction}\n        bundleMode={bundleMode}\n        align={align}\n        {...pt?.dropdown}\n      />\n      <ActionConfigDialog\n        action={actionBeingConfigured}\n        // @ts-expect-error\n        context={context}\n        onClose={() => setActionBeingConfigured(null)}\n      />\n      <InteractiveActionDialog\n        interactiveForm={interactiveForm}\n        onClose={() => setInteractiveForm(null)}\n        // @ts-expect-error\n        onSubmit={handleSubmitInteractiveForm}\n      />\n    </Styled.Actions>\n  )\n}\n"],"names":["placeholder","Actions","entities","entityType","entitySubTypes","isLoadingEntity","projectActionsProjectName","searchParams","featuredCount","bundleMode","onNavigate","onSetSearchParams","align","pt","handleActionPayload","useActionTriggers","actionBeingConfigured","setActionBeingConfigured","useState","interactiveForm","setInteractiveForm","context","useMemo","entitySubtypesLoaded","entity","value","index","self","entitySubTypesToUse","useEffect","data","isFetchingActions","useGetActionsFromContextQuery","actions","categoryOrder","groupedActions","acc","action","category","unorderedCategories","a","b","categories","dropdownOptions","options","groupOptions","featuredActions","tempFeaturedActions","executeAction","isLoadingExecution","originalArgs","useExecuteActionMutation","executingAction","handleExecuteAction","identifier","e","formData","option","toast","params","actionContext","response","error","intf","handleConfigureAction","handleSubmitInteractiveForm","loadingActions","isLoading","featuredActionsToDisplay","jsxs","Styled.Actions","clsx","i","jsx","Styled.FeaturedAction","ActionIcon","ActionsDropdown","ActionConfigDialog","InteractiveActionDialog"],"mappings":"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"}

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js

@@ -1,4 +1,4 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../../../_virtual/jsx-runtime.cjs.js"),c=require("@ynput/ayon-react-components"),p=require("./ActionsDropdown.styled.cjs.js"),x=require("clsx"),m=require("react"),j=require("lodash"),h=require("../ActionIcon.cjs.js"),y=require("styled-components"),f=y.div`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("../../../../../_virtual/jsx-runtime.cjs.js"),d=require("@ynput/ayon-react-components"),l=require("./ActionsDropdown.styled.cjs.js"),m=require("clsx"),j=require("react"),u=require("lodash"),h=require("../ActionIcon.cjs.js"),y=require("styled-components"),f=y.div`
   display: flex;
   flex-direction: row;
   width: 100%;
@@ -16,5 +16,5 @@
       visibility: visible;
     }
   }
-`,u=({value:i,label:e,icon:n,header:r,hasConfig:d,description:a,onConfig:s})=>{if(r)return t.jsxRuntimeExports.jsx(p.DropdownHeader,{children:j.upperFirst(e)});const l=o=>{s?.(i),o.stopPropagation(),o.preventDefault()};return t.jsxRuntimeExports.jsx(p.DropdownItem,{children:t.jsxRuntimeExports.jsxs(f,{"data-tooltip":a||"","data-tooltip-delay":0,children:[t.jsxRuntimeExports.jsx(h,{icon:n}),t.jsxRuntimeExports.jsx("span",{children:e}),t.jsxRuntimeExports.jsx(c.Spacer,{}),d&&t.jsxRuntimeExports.jsx(c.Button,{onClick:l,icon:"settings_applications",tabIndex:-1,style:{background:"none",padding:0}})]})})},w=({options:i,isLoading:e,isDeveloperMode:n,onAction:r,onConfig:d,...a})=>{const s=m.useRef(null),l=o=>{s.current?.close(),d(o)};return t.jsxRuntimeExports.jsx(p.StyledDropdown,{ref:s,disabled:e,className:x("more",{dev:n}),options:i,maxOptionsShown:100,value:[],placeholder:"",itemTemplate:o=>t.jsxRuntimeExports.jsx(u,{...o,onConfig:l}),valueTemplate:()=>t.jsxRuntimeExports.jsx(c.DefaultValueTemplate,{placeholder:"",value:[],dropIcon:"category"}),onChange:o=>r(o[0]),buttonProps:{"data-tooltip":n?"Actions (dev bundle)":"Actions","data-tooltip-delay":0},...a})};exports.ActionsDropdown=w;exports.ActionsDropdownItem=u;
+`,x=({value:i,label:n,icon:e,header:r,hasConfig:p,description:a,onConfig:s})=>{if(r)return t.jsxRuntimeExports.jsx(l.DropdownHeader,{children:u.upperFirst(n)});const c=o=>{s?.(i),o.stopPropagation(),o.preventDefault()};return t.jsxRuntimeExports.jsx(l.DropdownItem,{children:t.jsxRuntimeExports.jsxs(f,{"data-tooltip":a||"","data-tooltip-delay":0,children:[t.jsxRuntimeExports.jsx(h,{icon:e}),t.jsxRuntimeExports.jsx("span",{children:n}),t.jsxRuntimeExports.jsx(d.Spacer,{}),p&&t.jsxRuntimeExports.jsx(d.Button,{onClick:c,icon:"settings_applications",tabIndex:-1,style:{background:"none",padding:0}})]})})},w=({options:i,isLoading:n,bundleMode:e,onAction:r,onConfig:p,...a})=>{const s=j.useRef(null),c=o=>{s.current?.close(),p(o)};return t.jsxRuntimeExports.jsx(l.StyledDropdown,{ref:s,disabled:n,className:m("more",e),options:i,maxOptionsShown:100,value:[],placeholder:"",itemTemplate:o=>t.jsxRuntimeExports.jsx(x,{...o,onConfig:c}),valueTemplate:()=>t.jsxRuntimeExports.jsx(d.DefaultValueTemplate,{placeholder:"",value:[],dropIcon:"category"}),onChange:o=>r(o[0]),buttonProps:{"data-tooltip":e==="production"?"Actions":`${u.upperFirst(e)} Actions`,"data-tooltip-delay":0},...a})};exports.ActionsDropdown=w;exports.ActionsDropdownItem=x;
 //# sourceMappingURL=ActionsDropdown.cjs.js.map

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsDropdown.cjs.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.tsx"],"sourcesContent":["import {\n  DefaultValueTemplate,\n  Button,\n  Spacer,\n  DropdownRef,\n  DropdownProps,\n} from '@ynput/ayon-react-components'\nimport { DropdownHeader, DropdownItem, StyledDropdown } from './ActionsDropdown.styled'\nimport clsx from 'clsx'\nimport { useRef } from 'react'\nimport { upperFirst } from 'lodash'\nimport ActionIcon from '../ActionIcon'\nimport styled from 'styled-components'\nimport { IconModel } from '@shared/api'\n\nconst ActionItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  gap: 4px;\n\n  // use visibility instead of display, so dropdown adjusts its width\n  button {\n    display: flex;\n    visibility: hidden;\n  }\n\n  &:hover,\n  &:focus-within {\n    button {\n      visibility: visible;\n    }\n  }\n`\n\ntype ActionsDropdownItemProps = {\n  value: string\n  label: string\n  icon?: IconModel\n  header?: boolean\n  hasConfig?: boolean\n  description?: string\n  onConfig?: (value: string) => void\n}\n\nexport const ActionsDropdownItem = ({\n  value,\n  label,\n  icon,\n  header,\n  hasConfig,\n  description,\n  onConfig,\n}: ActionsDropdownItemProps) => {\n  if (header) return <DropdownHeader>{upperFirst(label)}</DropdownHeader>\n\n  const handleConfig = (e: any) => {\n    onConfig?.(value)\n    e.stopPropagation()\n    e.preventDefault()\n  }\n\n  return (\n    <DropdownItem>\n      <ActionItemContainer data-tooltip={description || ''} data-tooltip-delay={0}>\n        <ActionIcon icon={icon} />\n        <span>{label}</span>\n        <Spacer />\n        {hasConfig && (\n          <Button\n            onClick={handleConfig}\n            icon=\"settings_applications\"\n            tabIndex={-1}\n            style={{ background: 'none', padding: 0 }}\n          />\n        )}\n      </ActionItemContainer>\n    </DropdownItem>\n  )\n}\n\nexport interface ActionsDropdownProps extends Omit<DropdownProps, 'value'> {\n  options: ActionsDropdownItemProps[]\n  isLoading?: boolean\n  isDeveloperMode: boolean\n  onAction: (value: string) => void\n  onConfig: (e: any) => void\n}\n\nexport const ActionsDropdown = ({\n  options,\n  isLoading,\n  isDeveloperMode,\n  onAction,\n  onConfig,\n  ...props\n}: ActionsDropdownProps) => {\n  const dropdownRef = useRef<DropdownRef>(null)\n\n  const handleConfigClick = (e: any) => {\n    dropdownRef.current?.close()\n    onConfig(e)\n  }\n  return (\n    <StyledDropdown\n      ref={dropdownRef}\n      disabled={isLoading}\n      className={clsx('more', { dev: isDeveloperMode })}\n      options={options}\n      maxOptionsShown={100}\n      value={[]}\n      placeholder=\"\"\n      itemTemplate={(option) => <ActionsDropdownItem {...option} onConfig={handleConfigClick} />}\n      valueTemplate={() => <DefaultValueTemplate placeholder=\"\" value={[]} dropIcon={'category'} />}\n      onChange={(v) => onAction(v[0])}\n      buttonProps={{\n        // @ts-expect-error\n        ['data-tooltip']: isDeveloperMode ? 'Actions (dev bundle)' : 'Actions',\n        ['data-tooltip-delay']: 0,\n      }}\n      {...props}\n    />\n  )\n}\n"],"names":["ActionItemContainer","styled","ActionsDropdownItem","value","label","icon","header","hasConfig","description","onConfig","jsx","DropdownHeader","upperFirst","handleConfig","e","DropdownItem","jsxs","ActionIcon","Spacer","Button","ActionsDropdown","options","isLoading","isDeveloperMode","onAction","props","dropdownRef","useRef","handleConfigClick","StyledDropdown","clsx","option","DefaultValueTemplate","v"],"mappings":"+VAeMA,EAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA8BtBC,EAAsB,CAAC,CAClC,MAAAC,EACA,MAAAC,EACA,KAAAC,EACA,OAAAC,EACA,UAAAC,EACA,YAAAC,EACA,SAAAC,CACF,IAAgC,CAC9B,GAAIH,EAAQ,OAAOI,EAAAA,kBAAAA,IAACC,EAAAA,eAAA,CAAgB,SAAAC,EAAAA,WAAWR,CAAK,EAAE,EAEtD,MAAMS,EAAgBC,GAAW,CAC/BL,IAAWN,CAAK,EAChBW,EAAE,gBAAA,EACFA,EAAE,eAAA,CACJ,EAEA,OACEJ,EAAAA,kBAAAA,IAACK,EAAAA,cACC,SAAAC,EAAAA,kBAAAA,KAAChB,EAAA,CAAoB,eAAcQ,GAAe,GAAI,qBAAoB,EACxE,SAAA,CAAAE,wBAACO,GAAW,KAAAZ,EAAY,EACxBK,EAAAA,kBAAAA,IAAC,QAAM,SAAAN,CAAA,CAAM,0BACZc,EAAAA,OAAA,EAAO,EACPX,GACCG,EAAAA,kBAAAA,IAACS,EAAAA,OAAA,CACC,QAASN,EACT,KAAK,wBACL,SAAU,GACV,MAAO,CAAE,WAAY,OAAQ,QAAS,CAAA,CAAE,CAAA,CAC1C,CAAA,CAEJ,CAAA,CACF,CAEJ,EAUaO,EAAkB,CAAC,CAC9B,QAAAC,EACA,UAAAC,EACA,gBAAAC,EACA,SAAAC,EACA,SAAAf,EACA,GAAGgB,CACL,IAA4B,CAC1B,MAAMC,EAAcC,EAAAA,OAAoB,IAAI,EAEtCC,EAAqBd,GAAW,CACpCY,EAAY,SAAS,MAAA,EACrBjB,EAASK,CAAC,CACZ,EACA,OACEJ,EAAAA,kBAAAA,IAACmB,EAAAA,eAAA,CACC,IAAKH,EACL,SAAUJ,EACV,UAAWQ,EAAK,OAAQ,CAAE,IAAKP,EAAiB,EAChD,QAAAF,EACA,gBAAiB,IACjB,MAAO,CAAA,EACP,YAAY,GACZ,aAAeU,GAAWrB,wBAACR,GAAqB,GAAG6B,EAAQ,SAAUH,EAAmB,EACxF,cAAe,IAAMlB,EAAAA,kBAAAA,IAACsB,EAAAA,qBAAA,CAAqB,YAAY,GAAG,MAAO,CAAA,EAAI,SAAU,WAAY,EAC3F,SAAWC,GAAMT,EAASS,EAAE,CAAC,CAAC,EAC9B,YAAa,CAEV,eAAiBV,EAAkB,uBAAyB,UAC5D,qBAAuB,CAAA,EAEzB,GAAGE,CAAA,CAAA,CAGV"}
+{"version":3,"file":"ActionsDropdown.cjs.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.tsx"],"sourcesContent":["import {\n  DefaultValueTemplate,\n  Button,\n  Spacer,\n  DropdownRef,\n  DropdownProps,\n} from '@ynput/ayon-react-components'\nimport { DropdownHeader, DropdownItem, StyledDropdown } from './ActionsDropdown.styled'\nimport clsx from 'clsx'\nimport { useRef } from 'react'\nimport { upperFirst } from 'lodash'\nimport ActionIcon from '../ActionIcon'\nimport styled from 'styled-components'\nimport { IconModel } from '@shared/api'\nimport { BundleMode } from '@shared/util'\n\nconst ActionItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  gap: 4px;\n\n  // use visibility instead of display, so dropdown adjusts its width\n  button {\n    display: flex;\n    visibility: hidden;\n  }\n\n  &:hover,\n  &:focus-within {\n    button {\n      visibility: visible;\n    }\n  }\n`\n\ntype ActionsDropdownItemProps = {\n  value: string\n  label: string\n  icon?: IconModel\n  header?: boolean\n  hasConfig?: boolean\n  description?: string\n  onConfig?: (value: string) => void\n}\n\nexport const ActionsDropdownItem = ({\n  value,\n  label,\n  icon,\n  header,\n  hasConfig,\n  description,\n  onConfig,\n}: ActionsDropdownItemProps) => {\n  if (header) return <DropdownHeader>{upperFirst(label)}</DropdownHeader>\n\n  const handleConfig = (e: any) => {\n    onConfig?.(value)\n    e.stopPropagation()\n    e.preventDefault()\n  }\n\n  return (\n    <DropdownItem>\n      <ActionItemContainer data-tooltip={description || ''} data-tooltip-delay={0}>\n        <ActionIcon icon={icon} />\n        <span>{label}</span>\n        <Spacer />\n        {hasConfig && (\n          <Button\n            onClick={handleConfig}\n            icon=\"settings_applications\"\n            tabIndex={-1}\n            style={{ background: 'none', padding: 0 }}\n          />\n        )}\n      </ActionItemContainer>\n    </DropdownItem>\n  )\n}\n\nexport interface ActionsDropdownProps extends Omit<DropdownProps, 'value'> {\n  options: ActionsDropdownItemProps[]\n  isLoading?: boolean\n  bundleMode: BundleMode\n  onAction: (value: string) => void\n  onConfig: (e: any) => void\n}\n\nexport const ActionsDropdown = ({\n  options,\n  isLoading,\n  bundleMode,\n  onAction,\n  onConfig,\n  ...props\n}: ActionsDropdownProps) => {\n  const dropdownRef = useRef<DropdownRef>(null)\n\n  const handleConfigClick = (e: any) => {\n    dropdownRef.current?.close()\n    onConfig(e)\n  }\n  return (\n    <StyledDropdown\n      ref={dropdownRef}\n      disabled={isLoading}\n      className={clsx('more', bundleMode)}\n      options={options}\n      maxOptionsShown={100}\n      value={[]}\n      placeholder=\"\"\n      itemTemplate={(option) => <ActionsDropdownItem {...option} onConfig={handleConfigClick} />}\n      valueTemplate={() => <DefaultValueTemplate placeholder=\"\" value={[]} dropIcon={'category'} />}\n      onChange={(v) => onAction(v[0])}\n      buttonProps={{\n        // @ts-expect-error\n        ['data-tooltip']:\n          bundleMode === 'production' ? 'Actions' : `${upperFirst(bundleMode)} Actions`,\n        ['data-tooltip-delay']: 0,\n      }}\n      {...props}\n    />\n  )\n}\n"],"names":["ActionItemContainer","styled","ActionsDropdownItem","value","label","icon","header","hasConfig","description","onConfig","jsx","DropdownHeader","upperFirst","handleConfig","e","DropdownItem","jsxs","ActionIcon","Spacer","Button","ActionsDropdown","options","isLoading","bundleMode","onAction","props","dropdownRef","useRef","handleConfigClick","StyledDropdown","clsx","option","DefaultValueTemplate","v"],"mappings":"+VAgBMA,EAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA8BtBC,EAAsB,CAAC,CAClC,MAAAC,EACA,MAAAC,EACA,KAAAC,EACA,OAAAC,EACA,UAAAC,EACA,YAAAC,EACA,SAAAC,CACF,IAAgC,CAC9B,GAAIH,EAAQ,OAAOI,EAAAA,kBAAAA,IAACC,EAAAA,eAAA,CAAgB,SAAAC,EAAAA,WAAWR,CAAK,EAAE,EAEtD,MAAMS,EAAgBC,GAAW,CAC/BL,IAAWN,CAAK,EAChBW,EAAE,gBAAA,EACFA,EAAE,eAAA,CACJ,EAEA,OACEJ,EAAAA,kBAAAA,IAACK,EAAAA,cACC,SAAAC,EAAAA,kBAAAA,KAAChB,EAAA,CAAoB,eAAcQ,GAAe,GAAI,qBAAoB,EACxE,SAAA,CAAAE,wBAACO,GAAW,KAAAZ,EAAY,EACxBK,EAAAA,kBAAAA,IAAC,QAAM,SAAAN,CAAA,CAAM,0BACZc,EAAAA,OAAA,EAAO,EACPX,GACCG,EAAAA,kBAAAA,IAACS,EAAAA,OAAA,CACC,QAASN,EACT,KAAK,wBACL,SAAU,GACV,MAAO,CAAE,WAAY,OAAQ,QAAS,CAAA,CAAE,CAAA,CAC1C,CAAA,CAEJ,CAAA,CACF,CAEJ,EAUaO,EAAkB,CAAC,CAC9B,QAAAC,EACA,UAAAC,EACA,WAAAC,EACA,SAAAC,EACA,SAAAf,EACA,GAAGgB,CACL,IAA4B,CAC1B,MAAMC,EAAcC,EAAAA,OAAoB,IAAI,EAEtCC,EAAqBd,GAAW,CACpCY,EAAY,SAAS,MAAA,EACrBjB,EAASK,CAAC,CACZ,EACA,OACEJ,EAAAA,kBAAAA,IAACmB,EAAAA,eAAA,CACC,IAAKH,EACL,SAAUJ,EACV,UAAWQ,EAAK,OAAQP,CAAU,EAClC,QAAAF,EACA,gBAAiB,IACjB,MAAO,CAAA,EACP,YAAY,GACZ,aAAeU,GAAWrB,wBAACR,GAAqB,GAAG6B,EAAQ,SAAUH,EAAmB,EACxF,cAAe,IAAMlB,EAAAA,kBAAAA,IAACsB,EAAAA,qBAAA,CAAqB,YAAY,GAAG,MAAO,CAAA,EAAI,SAAU,WAAY,EAC3F,SAAWC,GAAMT,EAASS,EAAE,CAAC,CAAC,EAC9B,YAAa,CAEV,eACCV,IAAe,aAAe,UAAY,GAAGX,EAAAA,WAAWW,CAAU,CAAC,WACpE,qBAAuB,CAAA,EAEzB,GAAGE,CAAA,CAAA,CAGV"}

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.es.js

@@ -1,12 +1,12 @@
 import { j as o } from "../../../../../_virtual/jsx-runtime.es.js";
-import { DefaultValueTemplate as p, Spacer as c, Button as m } from "@ynput/ayon-react-components";
-import { StyledDropdown as u, DropdownHeader as f, DropdownItem as x } from "./ActionsDropdown.styled.es.js";
-import h from "clsx";
-import { useRef as j } from "react";
-import { upperFirst as w } from "lodash";
+import { DefaultValueTemplate as c, Spacer as m, Button as f } from "@ynput/ayon-react-components";
+import { StyledDropdown as u, DropdownHeader as x, DropdownItem as h } from "./ActionsDropdown.styled.es.js";
+import j from "clsx";
+import { useRef as w } from "react";
+import { upperFirst as d } from "lodash";
 import y from "../ActionIcon.es.js";
-import v from "styled-components";
-const b = v.div`
+import g from "styled-components";
+const v = g.div`
   display: flex;
   flex-direction: row;
   width: 100%;
@@ -24,25 +24,25 @@ const b = v.div`
       visibility: visible;
     }
   }
-`, g = ({
+`, b = ({
   value: r,
-  label: i,
-  icon: n,
+  label: n,
+  icon: i,
   header: s,
   hasConfig: a,
-  description: d,
+  description: p,
   onConfig: e
 }) => {
-  if (s) return /* @__PURE__ */ o.jsx(f, { children: w(i) });
+  if (s) return /* @__PURE__ */ o.jsx(x, { children: d(n) });
   const l = (t) => {
     e?.(r), t.stopPropagation(), t.preventDefault();
   };
-  return /* @__PURE__ */ o.jsx(x, { children: /* @__PURE__ */ o.jsxs(b, { "data-tooltip": d || "", "data-tooltip-delay": 0, children: [
-    /* @__PURE__ */ o.jsx(y, { icon: n }),
-    /* @__PURE__ */ o.jsx("span", { children: i }),
-    /* @__PURE__ */ o.jsx(c, {}),
+  return /* @__PURE__ */ o.jsx(h, { children: /* @__PURE__ */ o.jsxs(v, { "data-tooltip": p || "", "data-tooltip-delay": 0, children: [
+    /* @__PURE__ */ o.jsx(y, { icon: i }),
+    /* @__PURE__ */ o.jsx("span", { children: n }),
+    /* @__PURE__ */ o.jsx(m, {}),
     a && /* @__PURE__ */ o.jsx(
-      m,
+      f,
       {
         onClick: l,
         icon: "settings_applications",
@@ -53,39 +53,39 @@ const b = v.div`
   ] }) });
 }, P = ({
   options: r,
-  isLoading: i,
-  isDeveloperMode: n,
+  isLoading: n,
+  bundleMode: i,
   onAction: s,
   onConfig: a,
-  ...d
+  ...p
 }) => {
-  const e = j(null), l = (t) => {
+  const e = w(null), l = (t) => {
     e.current?.close(), a(t);
   };
   return /* @__PURE__ */ o.jsx(
     u,
     {
       ref: e,
-      disabled: i,
-      className: h("more", { dev: n }),
+      disabled: n,
+      className: j("more", i),
       options: r,
       maxOptionsShown: 100,
       value: [],
       placeholder: "",
-      itemTemplate: (t) => /* @__PURE__ */ o.jsx(g, { ...t, onConfig: l }),
-      valueTemplate: () => /* @__PURE__ */ o.jsx(p, { placeholder: "", value: [], dropIcon: "category" }),
+      itemTemplate: (t) => /* @__PURE__ */ o.jsx(b, { ...t, onConfig: l }),
+      valueTemplate: () => /* @__PURE__ */ o.jsx(c, { placeholder: "", value: [], dropIcon: "category" }),
       onChange: (t) => s(t[0]),
       buttonProps: {
         // @ts-expect-error
-        "data-tooltip": n ? "Actions (dev bundle)" : "Actions",
+        "data-tooltip": i === "production" ? "Actions" : `${d(i)} Actions`,
         "data-tooltip-delay": 0
       },
-      ...d
+      ...p
     }
   );
 };
 export {
   P as ActionsDropdown,
-  g as ActionsDropdownItem
+  b as ActionsDropdownItem
 };
 //# sourceMappingURL=ActionsDropdown.es.js.map

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.es.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsDropdown.es.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.tsx"],"sourcesContent":["import {\n  DefaultValueTemplate,\n  Button,\n  Spacer,\n  DropdownRef,\n  DropdownProps,\n} from '@ynput/ayon-react-components'\nimport { DropdownHeader, DropdownItem, StyledDropdown } from './ActionsDropdown.styled'\nimport clsx from 'clsx'\nimport { useRef } from 'react'\nimport { upperFirst } from 'lodash'\nimport ActionIcon from '../ActionIcon'\nimport styled from 'styled-components'\nimport { IconModel } from '@shared/api'\n\nconst ActionItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  gap: 4px;\n\n  // use visibility instead of display, so dropdown adjusts its width\n  button {\n    display: flex;\n    visibility: hidden;\n  }\n\n  &:hover,\n  &:focus-within {\n    button {\n      visibility: visible;\n    }\n  }\n`\n\ntype ActionsDropdownItemProps = {\n  value: string\n  label: string\n  icon?: IconModel\n  header?: boolean\n  hasConfig?: boolean\n  description?: string\n  onConfig?: (value: string) => void\n}\n\nexport const ActionsDropdownItem = ({\n  value,\n  label,\n  icon,\n  header,\n  hasConfig,\n  description,\n  onConfig,\n}: ActionsDropdownItemProps) => {\n  if (header) return <DropdownHeader>{upperFirst(label)}</DropdownHeader>\n\n  const handleConfig = (e: any) => {\n    onConfig?.(value)\n    e.stopPropagation()\n    e.preventDefault()\n  }\n\n  return (\n    <DropdownItem>\n      <ActionItemContainer data-tooltip={description || ''} data-tooltip-delay={0}>\n        <ActionIcon icon={icon} />\n        <span>{label}</span>\n        <Spacer />\n        {hasConfig && (\n          <Button\n            onClick={handleConfig}\n            icon=\"settings_applications\"\n            tabIndex={-1}\n            style={{ background: 'none', padding: 0 }}\n          />\n        )}\n      </ActionItemContainer>\n    </DropdownItem>\n  )\n}\n\nexport interface ActionsDropdownProps extends Omit<DropdownProps, 'value'> {\n  options: ActionsDropdownItemProps[]\n  isLoading?: boolean\n  isDeveloperMode: boolean\n  onAction: (value: string) => void\n  onConfig: (e: any) => void\n}\n\nexport const ActionsDropdown = ({\n  options,\n  isLoading,\n  isDeveloperMode,\n  onAction,\n  onConfig,\n  ...props\n}: ActionsDropdownProps) => {\n  const dropdownRef = useRef<DropdownRef>(null)\n\n  const handleConfigClick = (e: any) => {\n    dropdownRef.current?.close()\n    onConfig(e)\n  }\n  return (\n    <StyledDropdown\n      ref={dropdownRef}\n      disabled={isLoading}\n      className={clsx('more', { dev: isDeveloperMode })}\n      options={options}\n      maxOptionsShown={100}\n      value={[]}\n      placeholder=\"\"\n      itemTemplate={(option) => <ActionsDropdownItem {...option} onConfig={handleConfigClick} />}\n      valueTemplate={() => <DefaultValueTemplate placeholder=\"\" value={[]} dropIcon={'category'} />}\n      onChange={(v) => onAction(v[0])}\n      buttonProps={{\n        // @ts-expect-error\n        ['data-tooltip']: isDeveloperMode ? 'Actions (dev bundle)' : 'Actions',\n        ['data-tooltip-delay']: 0,\n      }}\n      {...props}\n    />\n  )\n}\n"],"names":["ActionItemContainer","styled","ActionsDropdownItem","value","label","icon","header","hasConfig","description","onConfig","jsx","DropdownHeader","upperFirst","handleConfig","e","DropdownItem","jsxs","ActionIcon","Spacer","Button","ActionsDropdown","options","isLoading","isDeveloperMode","onAction","props","dropdownRef","useRef","handleConfigClick","StyledDropdown","clsx","option","DefaultValueTemplate","v"],"mappings":";;;;;;;;AAeA,MAAMA,IAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA8BtBC,IAAsB,CAAC;AAAA,EAClC,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AACF,MAAgC;AAC9B,MAAIH,EAAQ,QAAOI,gBAAAA,EAAAA,IAACC,GAAA,EAAgB,UAAAC,EAAWR,CAAK,GAAE;AAEtD,QAAMS,IAAe,CAACC,MAAW;AAC/B,IAAAL,IAAWN,CAAK,GAChBW,EAAE,gBAAA,GACFA,EAAE,eAAA;AAAA,EACJ;AAEA,SACEJ,gBAAAA,EAAAA,IAACK,KACC,UAAAC,gBAAAA,EAAAA,KAAChB,GAAA,EAAoB,gBAAcQ,KAAe,IAAI,sBAAoB,GACxE,UAAA;AAAA,IAAAE,gBAAAA,MAACO,KAAW,MAAAZ,GAAY;AAAA,IACxBK,gBAAAA,EAAAA,IAAC,UAAM,UAAAN,EAAA,CAAM;AAAA,0BACZc,GAAA,EAAO;AAAA,IACPX,KACCG,gBAAAA,EAAAA;AAAAA,MAACS;AAAA,MAAA;AAAA,QACC,SAASN;AAAA,QACT,MAAK;AAAA,QACL,UAAU;AAAA,QACV,OAAO,EAAE,YAAY,QAAQ,SAAS,EAAA;AAAA,MAAE;AAAA,IAAA;AAAA,EAC1C,EAAA,CAEJ,EAAA,CACF;AAEJ,GAUaO,IAAkB,CAAC;AAAA,EAC9B,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAf;AAAA,EACA,GAAGgB;AACL,MAA4B;AAC1B,QAAMC,IAAcC,EAAoB,IAAI,GAEtCC,IAAoB,CAACd,MAAW;AACpC,IAAAY,EAAY,SAAS,MAAA,GACrBjB,EAASK,CAAC;AAAA,EACZ;AACA,SACEJ,gBAAAA,EAAAA;AAAAA,IAACmB;AAAA,IAAA;AAAA,MACC,KAAKH;AAAA,MACL,UAAUJ;AAAA,MACV,WAAWQ,EAAK,QAAQ,EAAE,KAAKP,GAAiB;AAAA,MAChD,SAAAF;AAAA,MACA,iBAAiB;AAAA,MACjB,OAAO,CAAA;AAAA,MACP,aAAY;AAAA,MACZ,cAAc,CAACU,MAAWrB,gBAAAA,MAACR,KAAqB,GAAG6B,GAAQ,UAAUH,GAAmB;AAAA,MACxF,eAAe,MAAMlB,gBAAAA,EAAAA,IAACsB,GAAA,EAAqB,aAAY,IAAG,OAAO,CAAA,GAAI,UAAU,YAAY;AAAA,MAC3F,UAAU,CAACC,MAAMT,EAASS,EAAE,CAAC,CAAC;AAAA,MAC9B,aAAa;AAAA;AAAA,QAEV,gBAAiBV,IAAkB,yBAAyB;AAAA,QAC5D,sBAAuB;AAAA,MAAA;AAAA,MAEzB,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}
+{"version":3,"file":"ActionsDropdown.es.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.tsx"],"sourcesContent":["import {\n  DefaultValueTemplate,\n  Button,\n  Spacer,\n  DropdownRef,\n  DropdownProps,\n} from '@ynput/ayon-react-components'\nimport { DropdownHeader, DropdownItem, StyledDropdown } from './ActionsDropdown.styled'\nimport clsx from 'clsx'\nimport { useRef } from 'react'\nimport { upperFirst } from 'lodash'\nimport ActionIcon from '../ActionIcon'\nimport styled from 'styled-components'\nimport { IconModel } from '@shared/api'\nimport { BundleMode } from '@shared/util'\n\nconst ActionItemContainer = styled.div`\n  display: flex;\n  flex-direction: row;\n  width: 100%;\n  gap: 4px;\n\n  // use visibility instead of display, so dropdown adjusts its width\n  button {\n    display: flex;\n    visibility: hidden;\n  }\n\n  &:hover,\n  &:focus-within {\n    button {\n      visibility: visible;\n    }\n  }\n`\n\ntype ActionsDropdownItemProps = {\n  value: string\n  label: string\n  icon?: IconModel\n  header?: boolean\n  hasConfig?: boolean\n  description?: string\n  onConfig?: (value: string) => void\n}\n\nexport const ActionsDropdownItem = ({\n  value,\n  label,\n  icon,\n  header,\n  hasConfig,\n  description,\n  onConfig,\n}: ActionsDropdownItemProps) => {\n  if (header) return <DropdownHeader>{upperFirst(label)}</DropdownHeader>\n\n  const handleConfig = (e: any) => {\n    onConfig?.(value)\n    e.stopPropagation()\n    e.preventDefault()\n  }\n\n  return (\n    <DropdownItem>\n      <ActionItemContainer data-tooltip={description || ''} data-tooltip-delay={0}>\n        <ActionIcon icon={icon} />\n        <span>{label}</span>\n        <Spacer />\n        {hasConfig && (\n          <Button\n            onClick={handleConfig}\n            icon=\"settings_applications\"\n            tabIndex={-1}\n            style={{ background: 'none', padding: 0 }}\n          />\n        )}\n      </ActionItemContainer>\n    </DropdownItem>\n  )\n}\n\nexport interface ActionsDropdownProps extends Omit<DropdownProps, 'value'> {\n  options: ActionsDropdownItemProps[]\n  isLoading?: boolean\n  bundleMode: BundleMode\n  onAction: (value: string) => void\n  onConfig: (e: any) => void\n}\n\nexport const ActionsDropdown = ({\n  options,\n  isLoading,\n  bundleMode,\n  onAction,\n  onConfig,\n  ...props\n}: ActionsDropdownProps) => {\n  const dropdownRef = useRef<DropdownRef>(null)\n\n  const handleConfigClick = (e: any) => {\n    dropdownRef.current?.close()\n    onConfig(e)\n  }\n  return (\n    <StyledDropdown\n      ref={dropdownRef}\n      disabled={isLoading}\n      className={clsx('more', bundleMode)}\n      options={options}\n      maxOptionsShown={100}\n      value={[]}\n      placeholder=\"\"\n      itemTemplate={(option) => <ActionsDropdownItem {...option} onConfig={handleConfigClick} />}\n      valueTemplate={() => <DefaultValueTemplate placeholder=\"\" value={[]} dropIcon={'category'} />}\n      onChange={(v) => onAction(v[0])}\n      buttonProps={{\n        // @ts-expect-error\n        ['data-tooltip']:\n          bundleMode === 'production' ? 'Actions' : `${upperFirst(bundleMode)} Actions`,\n        ['data-tooltip-delay']: 0,\n      }}\n      {...props}\n    />\n  )\n}\n"],"names":["ActionItemContainer","styled","ActionsDropdownItem","value","label","icon","header","hasConfig","description","onConfig","jsx","DropdownHeader","upperFirst","handleConfig","e","DropdownItem","jsxs","ActionIcon","Spacer","Button","ActionsDropdown","options","isLoading","bundleMode","onAction","props","dropdownRef","useRef","handleConfigClick","StyledDropdown","clsx","option","DefaultValueTemplate","v"],"mappings":";;;;;;;;AAgBA,MAAMA,IAAsBC,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,GA8BtBC,IAAsB,CAAC;AAAA,EAClC,OAAAC;AAAA,EACA,OAAAC;AAAA,EACA,MAAAC;AAAA,EACA,QAAAC;AAAA,EACA,WAAAC;AAAA,EACA,aAAAC;AAAA,EACA,UAAAC;AACF,MAAgC;AAC9B,MAAIH,EAAQ,QAAOI,gBAAAA,EAAAA,IAACC,GAAA,EAAgB,UAAAC,EAAWR,CAAK,GAAE;AAEtD,QAAMS,IAAe,CAACC,MAAW;AAC/B,IAAAL,IAAWN,CAAK,GAChBW,EAAE,gBAAA,GACFA,EAAE,eAAA;AAAA,EACJ;AAEA,SACEJ,gBAAAA,EAAAA,IAACK,KACC,UAAAC,gBAAAA,EAAAA,KAAChB,GAAA,EAAoB,gBAAcQ,KAAe,IAAI,sBAAoB,GACxE,UAAA;AAAA,IAAAE,gBAAAA,MAACO,KAAW,MAAAZ,GAAY;AAAA,IACxBK,gBAAAA,EAAAA,IAAC,UAAM,UAAAN,EAAA,CAAM;AAAA,0BACZc,GAAA,EAAO;AAAA,IACPX,KACCG,gBAAAA,EAAAA;AAAAA,MAACS;AAAA,MAAA;AAAA,QACC,SAASN;AAAA,QACT,MAAK;AAAA,QACL,UAAU;AAAA,QACV,OAAO,EAAE,YAAY,QAAQ,SAAS,EAAA;AAAA,MAAE;AAAA,IAAA;AAAA,EAC1C,EAAA,CAEJ,EAAA,CACF;AAEJ,GAUaO,IAAkB,CAAC;AAAA,EAC9B,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,YAAAC;AAAA,EACA,UAAAC;AAAA,EACA,UAAAf;AAAA,EACA,GAAGgB;AACL,MAA4B;AAC1B,QAAMC,IAAcC,EAAoB,IAAI,GAEtCC,IAAoB,CAACd,MAAW;AACpC,IAAAY,EAAY,SAAS,MAAA,GACrBjB,EAASK,CAAC;AAAA,EACZ;AACA,SACEJ,gBAAAA,EAAAA;AAAAA,IAACmB;AAAA,IAAA;AAAA,MACC,KAAKH;AAAA,MACL,UAAUJ;AAAA,MACV,WAAWQ,EAAK,QAAQP,CAAU;AAAA,MAClC,SAAAF;AAAA,MACA,iBAAiB;AAAA,MACjB,OAAO,CAAA;AAAA,MACP,aAAY;AAAA,MACZ,cAAc,CAACU,MAAWrB,gBAAAA,MAACR,KAAqB,GAAG6B,GAAQ,UAAUH,GAAmB;AAAA,MACxF,eAAe,MAAMlB,gBAAAA,EAAAA,IAACsB,GAAA,EAAqB,aAAY,IAAG,OAAO,CAAA,GAAI,UAAU,YAAY;AAAA,MAC3F,UAAU,CAACC,MAAMT,EAASS,EAAE,CAAC,CAAC;AAAA,MAC9B,aAAa;AAAA;AAAA,QAEV,gBACCV,MAAe,eAAe,YAAY,GAAGX,EAAWW,CAAU,CAAC;AAAA,QACpE,sBAAuB;AAAA,MAAA;AAAA,MAEzB,GAAGE;AAAA,IAAA;AAAA,EAAA;AAGV;"}

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.styled.cjs.js

@@ -1,7 +1,23 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const e=require("@ynput/ayon-react-components"),o=require("styled-components"),r=o(e.Dropdown)`
+"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const r=require("@ynput/ayon-react-components"),o=require("styled-components"),e=o(r.Dropdown)`
+  --button-bg: unset;
+  --button-bg-hover: var(--md-sys-color-surface-container-highest-hover);
+  --icon-color: var(--md-sys-color-on-surface);
+
+  &.developer {
+    --button-bg: var(--color-hl-developer-container);
+    --button-bg-hover: var(--color-hl-developer-container-hover);
+    --icon-color: var(--color-hl-developer);
+  }
+
+  &.staging {
+    --button-bg: var(--color-hl-staging-container);
+    --button-bg-hover: var(--color-hl-staging-container-hover);
+    --icon-color: var(--color-hl-staging);
+  }
+
   height: unset;
   button {
-    background-color: unset;
+    background-color: var(--button-bg);
     max-height: 28px;
     max-width: 28px;
     min-height: 28px;
@@ -18,31 +34,18 @@
 
     .icon {
       vertical-align: middle;
+      color: var(--icon-color);
     }
 
     &:hover {
-      background-color: var(--md-sys-color-surface-container-highest-hover);
-    }
-  }
-
-  /* developer mode */
-  &.dev {
-    button {
-      background-color: var(--color-hl-developer-container);
-      .icon {
-        color: var(--color-hl-developer);
-      }
-
-      &:hover {
-        background-color: var(--color-hl-developer-container-hover);
-      }
+      background-color: var(--button-bg-hover);
     }
   }
 
   &.loading {
     border-radius: 4px;
   }
-`,d=o.div`
+`,t=o.div`
   display: flex;
   gap: var(--base-gap-large);
 
@@ -57,5 +60,5 @@
 `,n=o.div`
   color: var(--md-sys-color-outline);
   padding: 4px 6px;
-`;exports.DropdownHeader=n;exports.DropdownItem=d;exports.StyledDropdown=r;
+`;exports.DropdownHeader=n;exports.DropdownItem=t;exports.StyledDropdown=e;
 //# sourceMappingURL=ActionsDropdown.styled.cjs.js.map

package/dist/shared/src/containers/Actions/ActionsDropdown/ActionsDropdown.styled.cjs.js.map

@@ -1 +1 @@
-{"version":3,"file":"ActionsDropdown.styled.cjs.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.styled.ts"],"sourcesContent":["import { Dropdown } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const StyledDropdown = styled(Dropdown)`\n  height: unset;\n  button {\n    background-color: unset;\n    max-height: 28px;\n    max-width: 28px;\n    min-height: 28px;\n    min-width: 28px;\n    & > div {\n      padding: 0;\n      border: 0;\n      padding: 0 4px;\n      gap: 0;\n    }\n    * {\n      opacity: 1 !important;\n    }\n\n    .icon {\n      vertical-align: middle;\n    }\n\n    &:hover {\n      background-color: var(--md-sys-color-surface-container-highest-hover);\n    }\n  }\n\n  /* developer mode */\n  &.dev {\n    button {\n      background-color: var(--color-hl-developer-container);\n      .icon {\n        color: var(--color-hl-developer);\n      }\n\n      &:hover {\n        background-color: var(--color-hl-developer-container-hover);\n      }\n    }\n  }\n\n  &.loading {\n    border-radius: 4px;\n  }\n`\n\nexport const DropdownItem = styled.div`\n  display: flex;\n  gap: var(--base-gap-large);\n\n  padding: 6px;\n  padding-right: 12px;\n\n  img {\n    width: 20px;\n    height: 20px;\n    object-fit: contain;\n  }\n`\n\nexport const DropdownHeader = styled.div`\n  color: var(--md-sys-color-outline);\n  padding: 4px 6px;\n`\n"],"names":["StyledDropdown","styled","Dropdown","DropdownItem","DropdownHeader"],"mappings":"+JAGaA,EAAiBC,EAAOC,UAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EA8ChCC,EAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EActBG,EAAiBH,EAAO;AAAA;AAAA;AAAA"}
+{"version":3,"file":"ActionsDropdown.styled.cjs.js","sources":["../../../../../../src/containers/Actions/ActionsDropdown/ActionsDropdown.styled.ts"],"sourcesContent":["import { Dropdown } from '@ynput/ayon-react-components'\nimport styled from 'styled-components'\n\nexport const StyledDropdown = styled(Dropdown)`\n  --button-bg: unset;\n  --button-bg-hover: var(--md-sys-color-surface-container-highest-hover);\n  --icon-color: var(--md-sys-color-on-surface);\n\n  &.developer {\n    --button-bg: var(--color-hl-developer-container);\n    --button-bg-hover: var(--color-hl-developer-container-hover);\n    --icon-color: var(--color-hl-developer);\n  }\n\n  &.staging {\n    --button-bg: var(--color-hl-staging-container);\n    --button-bg-hover: var(--color-hl-staging-container-hover);\n    --icon-color: var(--color-hl-staging);\n  }\n\n  height: unset;\n  button {\n    background-color: var(--button-bg);\n    max-height: 28px;\n    max-width: 28px;\n    min-height: 28px;\n    min-width: 28px;\n    & > div {\n      padding: 0;\n      border: 0;\n      padding: 0 4px;\n      gap: 0;\n    }\n    * {\n      opacity: 1 !important;\n    }\n\n    .icon {\n      vertical-align: middle;\n      color: var(--icon-color);\n    }\n\n    &:hover {\n      background-color: var(--button-bg-hover);\n    }\n  }\n\n  &.loading {\n    border-radius: 4px;\n  }\n`\n\nexport const DropdownItem = styled.div`\n  display: flex;\n  gap: var(--base-gap-large);\n\n  padding: 6px;\n  padding-right: 12px;\n\n  img {\n    width: 20px;\n    height: 20px;\n    object-fit: contain;\n  }\n`\n\nexport const DropdownHeader = styled.div`\n  color: var(--md-sys-color-outline);\n  padding: 4px 6px;\n`\n"],"names":["StyledDropdown","styled","Dropdown","DropdownItem","DropdownHeader"],"mappings":"+JAGaA,EAAiBC,EAAOC,UAAQ;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EAiDhCC,EAAeF,EAAO;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,EActBG,EAAiBH,EAAO;AAAA;AAAA;AAAA"}