synapse-react-client 4.0.23 → 4.0.24

package/dist/components/entity/page/action_menu/EntityActionMenu.js

@@ -3,14 +3,15 @@ import { ComplexMenu as t } from "../../../menu/ComplexMenu.js";
 import { Box as n } from "@mui/material";
 import { jsx as r } from "react/jsx-runtime";
 //#region src/components/entity/page/action_menu/EntityActionMenu.tsx
-function i(e, t) {
+var i = "rgba(0, 0, 0, 0.01)";
+function a(e, t) {
 	return Object.fromEntries(Object.entries(e).filter(([e, n]) => !n || !n.visible ? !1 : ![
 		...t.buttonActions,
 		...t.primaryMenuActions.flat(),
 		...t.downloadMenuActions.flat()
 	].some((t) => t.action === e)));
 }
-function a(e, t) {
+function o(e, t) {
 	return e.reduce((e, n) => {
 		let r = t[n.action];
 		return r && r.visible && e.push({
@@ -25,17 +26,17 @@ function a(e, t) {
 		}), e;
 	}, []);
 }
-function o(e, t) {
+function s(e, t) {
 	return e.reduce((e, n) => {
-		let r = a(n, t);
+		let r = o(n, t);
 		return r.length > 0 && e.push(r), e;
 	}, []);
 }
-function s(a) {
-	let { actionConfiguration: s, menuConfiguration: c, layout: l } = a, u = i(s, l);
-	Object.entries(u).length > 0 && (console.warn("Actions are visible but have not been configured in the layout:", Object.entries(u).map((e) => e[0])), l.primaryMenuActions.unshift(Object.entries(u).map((e) => ({ action: e[0] }))));
-	let d = l.buttonActions.reduce((e, t) => {
-		let n = s[t.action];
+function c(o) {
+	let { actionConfiguration: c, menuConfiguration: l, layout: u } = o, d = a(c, u);
+	Object.entries(d).length > 0 && (console.warn("Actions are visible but have not been configured in the layout:", Object.entries(d).map((e) => e[0])), u.primaryMenuActions.unshift(Object.entries(d).map((e) => ({ action: e[0] }))));
+	let f = u.buttonActions.reduce((e, t) => {
+		let n = c[t.action];
 		if (n && n.visible) {
 			let r = n.onClick;
 			r == null && !n.href && (console.warn(`No handler registered for ${t.action}`), r = () => {
@@ -52,51 +53,69 @@ function s(a) {
 			});
 		}
 		return e;
-	}, []), f = {
+	}, []), p = {
 		dropdownButtonText: "Download Options",
 		convertSingleItemToButton: !0,
 		renderMenuIfNoItems: !1,
-		buttonTooltip: c.DOWNLOAD.tooltipText,
+		variant: u.downloadMenuVariant,
+		buttonTooltip: l.DOWNLOAD.tooltipText,
 		buttonProps: {
-			disabled: c.DOWNLOAD.disabled,
+			disabled: l.DOWNLOAD.disabled,
 			endIcon: /* @__PURE__ */ r(e, {
 				icon: "expandMore",
 				wrap: !1
 			})
 		},
-		items: o(l.downloadMenuActions, s)
-	}, p = {
-		dropdownButtonText: l.primaryMenuText,
+		items: s(u.downloadMenuActions, c)
+	}, m = {
+		dropdownButtonText: u.primaryMenuText,
 		convertSingleItemToButton: !0,
 		renderMenuIfNoItems: !1,
+		variant: u.primaryMenuVariant,
 		buttonProps: { endIcon: /* @__PURE__ */ r(e, {
-			icon: l.primaryMenuEndIcon,
+			icon: u.primaryMenuEndIcon,
 			wrap: !1,
-			sx: l.primaryMenuEndIconSx
+			sx: u.primaryMenuEndIconSx
 		}) },
-		items: o(l.primaryMenuActions, s)
-	};
+		items: s(u.primaryMenuActions, c)
+	}, h = u.menuButtonSx ?? {};
 	return /* @__PURE__ */ r(n, {
 		sx: {
 			"& .MuiButton-root": {
 				borderRadius: "6px",
 				fontWeight: 540,
-				...l.menuButtonSx ?? {}
+				padding: "10px 12px"
+			},
+			"& .MuiButton-outlined": {
+				...h,
+				"&:hover": {
+					...h,
+					backgroundColor: i
+				}
+			},
+			"& .MuiButton-text": {
+				...h,
+				backgroundColor: "transparent",
+				"&:hover": {
+					...h,
+					backgroundColor: i,
+					textDecoration: "none"
+				}
 			},
 			"& .MuiButton-root .MuiTypography-root": { fontWeight: 540 }
 		},
 		children: /* @__PURE__ */ r(t, {
-			iconButtons: d,
-			dropdownMenus: [p, f]
+			iconButtons: f,
+			dropdownMenus: [m, p]
 		})
 	});
 }
-var c = {
-	getUnmappedActions: i,
-	mapAndFilterItemsInMenuGroup: a,
-	mapAndFilterMenuGroups: o
+var l = {
+	getUnmappedActions: a,
+	mapAndFilterItemsInMenuGroup: o,
+	mapAndFilterMenuGroups: s
 };
 //#endregion
-export { c as EXPORTED_FOR_UNIT_TESTING, s as default };
+export { l as EXPORTED_FOR_UNIT_TESTING, c as default };
 
 //# sourceMappingURL=EntityActionMenu.js.map

package/dist/components/entity/page/action_menu/EntityActionMenu.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityActionMenu.js","names":[],"sources":["../../../../../src/components/entity/page/action_menu/EntityActionMenu.tsx"],"sourcesContent":["import { Box, ButtonProps, SxProps, Theme } from '@mui/material'\nimport { ComplexMenu, ComplexMenuButtonProps } from '../../../menu/ComplexMenu'\nimport IconSvg, { IconName } from '../../../IconSvg/IconSvg'\nimport { DropdownMenuItem, DropdownMenuProps } from '../../../menu/DropdownMenu'\nimport { MouseEvent } from 'react'\nimport { SystemStyleObject } from '@mui/system'\n\n// Represents the two types of dropdown menus that will be displayed on the entity page\ntype EntityActionMenuDropdownMenuType = 'DOWNLOAD' | 'PRIMARY'\n\ntype EntityActionMenuDropdownMenuConfiguration = {\n  visible: boolean\n  tooltipText?: string\n  disabled?: boolean\n}\n\nexport type ActionConfiguration = {\n  visible: boolean\n  text: string\n  disabled?: boolean\n  tooltipText?: string\n  onClick?: (e: MouseEvent) => void\n  href?: string\n}\n\nexport type ActionConfigurationMap = Record<string, ActionConfiguration>\n\nexport type MenuConfigurationMap = Record<\n  EntityActionMenuDropdownMenuType,\n  EntityActionMenuDropdownMenuConfiguration\n>\n\nexport type ActionViewProps = {\n  action: string\n  icon?: IconName\n  textSx?: SxProps\n  iconSx?: SxProps\n  variant?: ButtonProps['variant']\n}\n\nexport type EntityActionMenuLayout = {\n  buttonActions: ActionViewProps[]\n  downloadMenuActions: ActionViewProps[][]\n  primaryMenuActions: ActionViewProps[][]\n  primaryMenuText: string\n  primaryMenuEndIcon: IconName\n  primaryMenuEndIconSx?: SxProps\n  menuButtonSx?: SystemStyleObject<Theme>\n}\n\nexport type EntityActionMenuProps = {\n  /* Maps a unique action string to a dynamic configuration for that particular action */\n  actionConfiguration: ActionConfigurationMap\n  /* Maps each dropdown menu to a dynamic configuration for that particular menu */\n  menuConfiguration: MenuConfigurationMap\n  /* Defines the layout of the actions. Typically depends on just the entity type and area. */\n  layout: EntityActionMenuLayout\n}\n\n/*\n * All visible actions should be specified in the layout, but this is not guaranteed at compile time.\n * Find all visible actions in the action configuration that are not in the layout.\n */\nfunction getUnmappedActions(\n  actionConfiguration: ActionConfigurationMap,\n  layout: EntityActionMenuLayout,\n): ActionConfigurationMap {\n  return Object.fromEntries(\n    Object.entries(actionConfiguration).filter(([action, config]) => {\n      // We don't care about actions that are not configured or should not be visible\n      if (!config || !config.visible) {\n        return false\n      }\n\n      const allLayoutActions: ActionViewProps[] = [\n        ...layout.buttonActions,\n        ...layout.primaryMenuActions.flat(),\n        ...layout.downloadMenuActions.flat(),\n      ]\n      // Action is unmapped if it's visible and the layout doesn't have it\n      return !allLayoutActions.some(\n        layoutAction => layoutAction.action === action,\n      )\n    }),\n  )\n}\n\n/**\n * Given a group of dropdown menu items and an action configuration,\n * return a list of dropdown menu items with non-visible and non-configured actions removed.\n * @param group\n * @param actionConfiguration\n */\nfunction mapAndFilterItemsInMenuGroup(\n  group: ActionViewProps[],\n  actionConfiguration: ActionConfigurationMap,\n): DropdownMenuItem[] {\n  return group.reduce(\n    (itemAcc: DropdownMenuItem[], actionViewProps: ActionViewProps) => {\n      const configForAction = actionConfiguration[actionViewProps.action]\n      // Only show the item if it's configured + visible\n      if (configForAction && configForAction.visible) {\n        itemAcc.push({\n          text: configForAction.text ?? actionViewProps.action,\n          onClick: configForAction.onClick,\n          href: configForAction.href,\n          tooltipText: configForAction.tooltipText,\n          disabled: configForAction.disabled,\n          icon: actionViewProps.icon,\n          textSx: actionViewProps.textSx,\n          iconSx: actionViewProps.iconSx,\n        })\n      }\n      return itemAcc\n    },\n    [],\n  )\n}\n\n/**\n * Given a list of groups of dropdown menu actions, returns a list of dropdown menu item\n * groups where non-visible actions have been removed, and groups with no visible actions\n * have been removed.\n * @param menuActions\n * @param actionConfiguration\n */\nfunction mapAndFilterMenuGroups(\n  menuActions: ActionViewProps[][],\n  actionConfiguration: ActionConfigurationMap,\n): DropdownMenuItem[][] {\n  return menuActions.reduce(\n    (groupAcc: DropdownMenuItem[][], group: ActionViewProps[]) => {\n      const itemGroup = mapAndFilterItemsInMenuGroup(group, actionConfiguration)\n      // Only show the group if it contains visible items\n      if (itemGroup.length > 0) {\n        groupAcc.push(itemGroup)\n      }\n      return groupAcc\n    },\n    [],\n  )\n}\n\n/**\n * The EntityActionMenu renders a menu that displays the actions that can be invoked on an Entity page.\n */\nexport default function EntityActionMenu(props: EntityActionMenuProps) {\n  const { actionConfiguration, menuConfiguration, layout } = props\n\n  /*\n   * All actions should be specified in the layout, but this is not guaranteed at compile time.\n   * Find all visible actions in the action configuration that are not in the layout.\n   */\n  const unmappedActions = getUnmappedActions(actionConfiguration, layout)\n  // Warn if unmapped actions were found and push them on to the layout.\n  if (Object.entries(unmappedActions).length > 0) {\n    console.warn(\n      'Actions are visible but have not been configured in the layout:',\n      Object.entries(unmappedActions).map(entry => entry[0]),\n    )\n    // Modify the layout: put the unmapped actions in their own group at the top of the menu\n    layout.primaryMenuActions.unshift(\n      Object.entries(unmappedActions).map(\n        (entry): ActionViewProps => ({\n          action: entry[0],\n        }),\n      ),\n    )\n  }\n\n  // Map button actions to a button configuration and omit non-visible actions\n  const iconButtonConfigs: ComplexMenuButtonProps[] =\n    layout.buttonActions.reduce(\n      (acc: ComplexMenuButtonProps[], buttonViewProps: ActionViewProps) => {\n        const configForAction = actionConfiguration[buttonViewProps.action]\n        if (configForAction && configForAction.visible) {\n          let onClick = configForAction.onClick\n          if (onClick == null && !configForAction.href) {\n            console.warn(`No handler registered for ${buttonViewProps.action}`)\n            onClick = () => {\n              console.warn(\n                `No handler registered for ${buttonViewProps.action}`,\n              )\n            }\n          }\n          acc.push({\n            icon: buttonViewProps.icon as IconName,\n            onClick: onClick,\n            tooltipText: configForAction.text,\n            text: configForAction.text,\n            variant: buttonViewProps.variant,\n            iconSx: buttonViewProps.iconSx,\n            disabled: configForAction.disabled,\n            href: configForAction.href,\n          })\n        }\n        return acc\n      },\n      [],\n    )\n\n  const downloadMenuConfig: DropdownMenuProps = {\n    dropdownButtonText: 'Download Options',\n    convertSingleItemToButton: true,\n    renderMenuIfNoItems: false,\n    buttonTooltip: menuConfiguration.DOWNLOAD.tooltipText,\n    buttonProps: {\n      disabled: menuConfiguration.DOWNLOAD.disabled,\n      endIcon: <IconSvg icon={'expandMore'} wrap={false} />,\n    },\n    items: mapAndFilterMenuGroups(\n      layout.downloadMenuActions,\n      actionConfiguration,\n    ),\n  }\n\n  const primaryMenuConfig: DropdownMenuProps = {\n    dropdownButtonText: layout.primaryMenuText,\n    convertSingleItemToButton: true,\n    renderMenuIfNoItems: false,\n    buttonProps: {\n      endIcon: (\n        <IconSvg\n          icon={layout.primaryMenuEndIcon}\n          wrap={false}\n          sx={layout.primaryMenuEndIconSx}\n        />\n      ),\n    },\n    items: mapAndFilterMenuGroups(\n      layout.primaryMenuActions,\n      actionConfiguration,\n    ),\n  }\n\n  return (\n    <Box\n      sx={{\n        '& .MuiButton-root': {\n          borderRadius: '6px',\n          fontWeight: 540,\n          // Optional per-layout overrides (e.g. a different border color for\n          // entity pages vs the project header).\n          ...(layout.menuButtonSx ?? {}),\n        },\n        '& .MuiButton-root .MuiTypography-root': {\n          fontWeight: 540,\n        },\n      }}\n    >\n      <ComplexMenu\n        iconButtons={iconButtonConfigs}\n        dropdownMenus={[primaryMenuConfig, downloadMenuConfig]}\n      />\n    </Box>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = {\n  getUnmappedActions,\n  mapAndFilterItemsInMenuGroup,\n  mapAndFilterMenuGroups,\n}\n"],"mappings":"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"}
+{"version":3,"file":"EntityActionMenu.js","names":[],"sources":["../../../../../src/components/entity/page/action_menu/EntityActionMenu.tsx"],"sourcesContent":["import { Box, ButtonProps, SxProps, Theme } from '@mui/material'\nimport { ComplexMenu, ComplexMenuButtonProps } from '../../../menu/ComplexMenu'\nimport IconSvg, { IconName } from '../../../IconSvg/IconSvg'\nimport { DropdownMenuItem, DropdownMenuProps } from '../../../menu/DropdownMenu'\nimport { MouseEvent } from 'react'\nimport { SystemStyleObject } from '@mui/system'\n\nconst outlinedButtonHoverBackgroundColor = 'rgba(0, 0, 0, 0.01)'\n\n// Represents the two types of dropdown menus that will be displayed on the entity page\ntype EntityActionMenuDropdownMenuType = 'DOWNLOAD' | 'PRIMARY'\n\ntype EntityActionMenuDropdownMenuConfiguration = {\n  visible: boolean\n  tooltipText?: string\n  disabled?: boolean\n}\n\nexport type ActionConfiguration = {\n  visible: boolean\n  text: string\n  disabled?: boolean\n  tooltipText?: string\n  onClick?: (e: MouseEvent) => void\n  href?: string\n}\n\nexport type ActionConfigurationMap = Record<string, ActionConfiguration>\n\nexport type MenuConfigurationMap = Record<\n  EntityActionMenuDropdownMenuType,\n  EntityActionMenuDropdownMenuConfiguration\n>\n\nexport type ActionViewProps = {\n  action: string\n  icon?: IconName\n  textSx?: SxProps\n  iconSx?: SxProps\n  variant?: ButtonProps['variant']\n}\n\nexport type EntityActionMenuLayout = {\n  buttonActions: ActionViewProps[]\n  downloadMenuActions: ActionViewProps[][]\n  primaryMenuActions: ActionViewProps[][]\n  primaryMenuText: string\n  primaryMenuEndIcon: IconName\n  primaryMenuEndIconSx?: SxProps\n  menuButtonSx?: SystemStyleObject<Theme>\n  downloadMenuVariant?: ButtonProps['variant']\n  primaryMenuVariant?: ButtonProps['variant']\n}\n\nexport type EntityActionMenuProps = {\n  /* Maps a unique action string to a dynamic configuration for that particular action */\n  actionConfiguration: ActionConfigurationMap\n  /* Maps each dropdown menu to a dynamic configuration for that particular menu */\n  menuConfiguration: MenuConfigurationMap\n  /* Defines the layout of the actions. Typically depends on just the entity type and area. */\n  layout: EntityActionMenuLayout\n}\n\n/*\n * All visible actions should be specified in the layout, but this is not guaranteed at compile time.\n * Find all visible actions in the action configuration that are not in the layout.\n */\nfunction getUnmappedActions(\n  actionConfiguration: ActionConfigurationMap,\n  layout: EntityActionMenuLayout,\n): ActionConfigurationMap {\n  return Object.fromEntries(\n    Object.entries(actionConfiguration).filter(([action, config]) => {\n      // We don't care about actions that are not configured or should not be visible\n      if (!config || !config.visible) {\n        return false\n      }\n\n      const allLayoutActions: ActionViewProps[] = [\n        ...layout.buttonActions,\n        ...layout.primaryMenuActions.flat(),\n        ...layout.downloadMenuActions.flat(),\n      ]\n      // Action is unmapped if it's visible and the layout doesn't have it\n      return !allLayoutActions.some(\n        layoutAction => layoutAction.action === action,\n      )\n    }),\n  )\n}\n\n/**\n * Given a group of dropdown menu items and an action configuration,\n * return a list of dropdown menu items with non-visible and non-configured actions removed.\n * @param group\n * @param actionConfiguration\n */\nfunction mapAndFilterItemsInMenuGroup(\n  group: ActionViewProps[],\n  actionConfiguration: ActionConfigurationMap,\n): DropdownMenuItem[] {\n  return group.reduce(\n    (itemAcc: DropdownMenuItem[], actionViewProps: ActionViewProps) => {\n      const configForAction = actionConfiguration[actionViewProps.action]\n      // Only show the item if it's configured + visible\n      if (configForAction && configForAction.visible) {\n        itemAcc.push({\n          text: configForAction.text ?? actionViewProps.action,\n          onClick: configForAction.onClick,\n          href: configForAction.href,\n          tooltipText: configForAction.tooltipText,\n          disabled: configForAction.disabled,\n          icon: actionViewProps.icon,\n          textSx: actionViewProps.textSx,\n          iconSx: actionViewProps.iconSx,\n        })\n      }\n      return itemAcc\n    },\n    [],\n  )\n}\n\n/**\n * Given a list of groups of dropdown menu actions, returns a list of dropdown menu item\n * groups where non-visible actions have been removed, and groups with no visible actions\n * have been removed.\n * @param menuActions\n * @param actionConfiguration\n */\nfunction mapAndFilterMenuGroups(\n  menuActions: ActionViewProps[][],\n  actionConfiguration: ActionConfigurationMap,\n): DropdownMenuItem[][] {\n  return menuActions.reduce(\n    (groupAcc: DropdownMenuItem[][], group: ActionViewProps[]) => {\n      const itemGroup = mapAndFilterItemsInMenuGroup(group, actionConfiguration)\n      // Only show the group if it contains visible items\n      if (itemGroup.length > 0) {\n        groupAcc.push(itemGroup)\n      }\n      return groupAcc\n    },\n    [],\n  )\n}\n\n/**\n * The EntityActionMenu renders a menu that displays the actions that can be invoked on an Entity page.\n */\nexport default function EntityActionMenu(props: EntityActionMenuProps) {\n  const { actionConfiguration, menuConfiguration, layout } = props\n\n  /*\n   * All actions should be specified in the layout, but this is not guaranteed at compile time.\n   * Find all visible actions in the action configuration that are not in the layout.\n   */\n  const unmappedActions = getUnmappedActions(actionConfiguration, layout)\n  // Warn if unmapped actions were found and push them on to the layout.\n  if (Object.entries(unmappedActions).length > 0) {\n    console.warn(\n      'Actions are visible but have not been configured in the layout:',\n      Object.entries(unmappedActions).map(entry => entry[0]),\n    )\n    // Modify the layout: put the unmapped actions in their own group at the top of the menu\n    layout.primaryMenuActions.unshift(\n      Object.entries(unmappedActions).map(\n        (entry): ActionViewProps => ({\n          action: entry[0],\n        }),\n      ),\n    )\n  }\n\n  // Map button actions to a button configuration and omit non-visible actions\n  const iconButtonConfigs: ComplexMenuButtonProps[] =\n    layout.buttonActions.reduce(\n      (acc: ComplexMenuButtonProps[], buttonViewProps: ActionViewProps) => {\n        const configForAction = actionConfiguration[buttonViewProps.action]\n        if (configForAction && configForAction.visible) {\n          let onClick = configForAction.onClick\n          if (onClick == null && !configForAction.href) {\n            console.warn(`No handler registered for ${buttonViewProps.action}`)\n            onClick = () => {\n              console.warn(\n                `No handler registered for ${buttonViewProps.action}`,\n              )\n            }\n          }\n          acc.push({\n            icon: buttonViewProps.icon as IconName,\n            onClick: onClick,\n            tooltipText: configForAction.text,\n            text: configForAction.text,\n            variant: buttonViewProps.variant,\n            iconSx: buttonViewProps.iconSx,\n            disabled: configForAction.disabled,\n            href: configForAction.href,\n          })\n        }\n        return acc\n      },\n      [],\n    )\n\n  const downloadMenuConfig: DropdownMenuProps = {\n    dropdownButtonText: 'Download Options',\n    convertSingleItemToButton: true,\n    renderMenuIfNoItems: false,\n    variant: layout.downloadMenuVariant,\n    buttonTooltip: menuConfiguration.DOWNLOAD.tooltipText,\n    buttonProps: {\n      disabled: menuConfiguration.DOWNLOAD.disabled,\n      endIcon: <IconSvg icon={'expandMore'} wrap={false} />,\n    },\n    items: mapAndFilterMenuGroups(\n      layout.downloadMenuActions,\n      actionConfiguration,\n    ),\n  }\n\n  const primaryMenuConfig: DropdownMenuProps = {\n    dropdownButtonText: layout.primaryMenuText,\n    convertSingleItemToButton: true,\n    renderMenuIfNoItems: false,\n    variant: layout.primaryMenuVariant,\n    buttonProps: {\n      endIcon: (\n        <IconSvg\n          icon={layout.primaryMenuEndIcon}\n          wrap={false}\n          sx={layout.primaryMenuEndIconSx}\n        />\n      ),\n    },\n    items: mapAndFilterMenuGroups(\n      layout.primaryMenuActions,\n      actionConfiguration,\n    ),\n  }\n\n  const menuButtonSx = layout.menuButtonSx ?? {}\n\n  return (\n    <Box\n      sx={{\n        '& .MuiButton-root': {\n          borderRadius: '6px',\n          fontWeight: 540,\n          padding: '10px 12px',\n        },\n        // Optional per-layout overrides (e.g. background/border color for entity\n        // menu buttons).\n        '& .MuiButton-outlined': {\n          ...menuButtonSx,\n\n          '&:hover': {\n            ...menuButtonSx,\n            backgroundColor: outlinedButtonHoverBackgroundColor,\n          },\n        },\n        '& .MuiButton-text': {\n          ...menuButtonSx,\n          backgroundColor: 'transparent',\n\n          '&:hover': {\n            ...menuButtonSx,\n            backgroundColor: outlinedButtonHoverBackgroundColor,\n            textDecoration: 'none',\n          },\n        },\n        '& .MuiButton-root .MuiTypography-root': {\n          fontWeight: 540,\n        },\n      }}\n    >\n      <ComplexMenu\n        iconButtons={iconButtonConfigs}\n        dropdownMenus={[primaryMenuConfig, downloadMenuConfig]}\n      />\n    </Box>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = {\n  getUnmappedActions,\n  mapAndFilterItemsInMenuGroup,\n  mapAndFilterMenuGroups,\n}\n"],"mappings":"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"}

package/dist/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPageBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEzC,KAAK,cAAc,GAAG;IAEpB,IAAI,EAAE,MAAM,CAAA;IAEZ,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,OAAO,CAAC,EAAE,iBAAiB,CAAA;CAC5B,CAAA;AAED,KAAK,0BAA0B,GAAG;IAChC,KAAK,EAAE,cAAc,EAAE,CAAA;IACvB,EAAE,CAAC,EAAE,OAAO,CAAA;CACb,CAAA;AAoBD,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAC3C,KAAK,EAAE,0BAA0B,2CAUlC"}
+{"version":3,"file":"EntityPageBreadcrumbs.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.tsx"],"names":[],"mappings":"AACA,OAAO,EAAE,OAAO,EAAE,MAAM,eAAe,CAAA;AACvC,OAAO,EAAE,iBAAiB,EAAE,MAAM,OAAO,CAAA;AAEzC,KAAK,cAAc,GAAG;IAEpB,IAAI,EAAE,MAAM,CAAA;IAEZ,OAAO,CAAC,EAAE,OAAO,CAAA;IAEjB,EAAE,CAAC,EAAE,MAAM,CAAA;IAEX,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,OAAO,CAAC,EAAE,iBAAiB,CAAA;CAC5B,CAAA;AAED,KAAK,0BAA0B,GAAG;IAChC,KAAK,EAAE,cAAc,EAAE,CAAA;IACvB,EAAE,CAAC,EAAE,OAAO,CAAA;CACb,CAAA;AAmBD,MAAM,CAAC,OAAO,UAAU,qBAAqB,CAC3C,KAAK,EAAE,0BAA0B,2CAUlC"}

package/dist/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.js

@@ -4,7 +4,6 @@ import { jsx as t } from "react/jsx-runtime";
 var n = 32, r = {
 	marginTop: "0px",
 	padding: "10px 40px",
-	backgroundColor: "grey.200",
 	"& .MuiLink-root": {
 		color: "text.secondary",
 		letterSpacing: 0,

package/dist/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPageBreadcrumbs.js","names":[],"sources":["../../../../../src/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.tsx"],"sourcesContent":["import { Breadcrumbs } from '@/components/Breadcrumbs/Breadcrumbs'\nimport { SxProps } from '@mui/material'\nimport { MouseEventHandler } from 'react'\n\ntype BreadcrumbItem = {\n  /* The text to show in the breadcrumb item. Strings > 25 characters will be truncated */\n  text: string\n  /* Whether this item represents the current page. If true, this item will not have a link. Default false */\n  current?: boolean\n  /* Link for the item, if using react-router */\n  to?: string\n  /* Link for the item, if it should be a normal anchor */\n  href?: string\n  /* Event handler fired when the link is clicked */\n  onClick?: MouseEventHandler\n}\n\ntype EntityPageBreadcrumbsProps = {\n  items: BreadcrumbItem[]\n  sx?: SxProps\n}\n\nconst ENTITY_PAGE_MAX_BREADCRUMB_LENGTH = 32\n\nconst entityPageBreadcrumbStyle: SxProps = {\n  marginTop: '0px',\n  padding: '10px 40px',\n  backgroundColor: 'grey.200',\n  ['& .MuiLink-root']: {\n    color: 'text.secondary',\n    letterSpacing: 0,\n    '&:visited': {\n      color: 'text.secondary',\n    },\n  },\n  '& .MuiSvgIcon-root': {\n    color: 'grey.500',\n  },\n}\n\nexport default function EntityPageBreadcrumbs(\n  props: EntityPageBreadcrumbsProps,\n) {\n  const { items } = props\n  return (\n    <Breadcrumbs\n      items={items}\n      sx={entityPageBreadcrumbStyle}\n      maxBreadcrumbLength={ENTITY_PAGE_MAX_BREADCRUMB_LENGTH}\n    />\n  )\n}\n"],"mappings":";;;AAsBA,IAAM,IAAoC,IAEpC,IAAqC;CACzC,WAAW;CACX,SAAS;CACT,iBAAiB;CAChB,mBAAoB;EACnB,OAAO;EACP,eAAe;EACf,aAAa,EACX,OAAO,iBACT;CACF;CACA,sBAAsB,EACpB,OAAO,WACT;AACF;AAEA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,aAAU;CAClB,OACE,kBAAC,GAAD;EACS;EACP,IAAI;EACJ,qBAAqB;CACtB,CAAA;AAEL"}
+{"version":3,"file":"EntityPageBreadcrumbs.js","names":[],"sources":["../../../../../src/components/entity/page/breadcrumbs/EntityPageBreadcrumbs.tsx"],"sourcesContent":["import { Breadcrumbs } from '@/components/Breadcrumbs/Breadcrumbs'\nimport { SxProps } from '@mui/material'\nimport { MouseEventHandler } from 'react'\n\ntype BreadcrumbItem = {\n  /* The text to show in the breadcrumb item. Strings > 25 characters will be truncated */\n  text: string\n  /* Whether this item represents the current page. If true, this item will not have a link. Default false */\n  current?: boolean\n  /* Link for the item, if using react-router */\n  to?: string\n  /* Link for the item, if it should be a normal anchor */\n  href?: string\n  /* Event handler fired when the link is clicked */\n  onClick?: MouseEventHandler\n}\n\ntype EntityPageBreadcrumbsProps = {\n  items: BreadcrumbItem[]\n  sx?: SxProps\n}\n\nconst ENTITY_PAGE_MAX_BREADCRUMB_LENGTH = 32\n\nconst entityPageBreadcrumbStyle: SxProps = {\n  marginTop: '0px',\n  padding: '10px 40px',\n  ['& .MuiLink-root']: {\n    color: 'text.secondary',\n    letterSpacing: 0,\n    '&:visited': {\n      color: 'text.secondary',\n    },\n  },\n  '& .MuiSvgIcon-root': {\n    color: 'grey.500',\n  },\n}\n\nexport default function EntityPageBreadcrumbs(\n  props: EntityPageBreadcrumbsProps,\n) {\n  const { items } = props\n  return (\n    <Breadcrumbs\n      items={items}\n      sx={entityPageBreadcrumbStyle}\n      maxBreadcrumbLength={ENTITY_PAGE_MAX_BREADCRUMB_LENGTH}\n    />\n  )\n}\n"],"mappings":";;;AAsBA,IAAM,IAAoC,IAEpC,IAAqC;CACzC,WAAW;CACX,SAAS;CACR,mBAAoB;EACnB,OAAO;EACP,eAAe;EACf,aAAa,EACX,OAAO,iBACT;CACF;CACA,sBAAsB,EACpB,OAAO,WACT;AACF;AAEA,SAAwB,EACtB,GACA;CACA,IAAM,EAAE,aAAU;CAClB,OACE,kBAAC,GAAD;EACS;EACP,IAAI;EACJ,qBAAqB;CACtB,CAAA;AAEL"}

package/dist/components/entity/page/title_bar/EntityPageTitleBar.d.ts

@@ -5,6 +5,7 @@ export type EntityPageTitleBarProps = {
     entityActionMenuProps?: EntityActionMenuProps;
     onActMemberClickAddConditionsForUse: () => void;
 };
+export declare const FAVORITE_BUTTON_ICON_COLOR = "#9EAAB7";
 /**
  * The EntityPageTitleBar component is shown on every Entity page in Synapse, and shows an Entity's metadata and
  * provides controls to view and manipulate the Entity.

package/dist/components/entity/page/title_bar/EntityPageTitleBar.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPageTitleBar.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/title_bar/EntityPageTitleBar.tsx"],"names":[],"mappings":"AAMA,OAAyB,EACvB,qBAAqB,EACtB,MAAM,iCAAiC,CAAA;AAIxC,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,qBAAqB,CAAC,EAAE,qBAAqB,CAAA;IAE7C,mCAAmC,EAAE,MAAM,IAAI,CAAA;CAChD,CAAA;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAyFxE"}
+{"version":3,"file":"EntityPageTitleBar.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/title_bar/EntityPageTitleBar.tsx"],"names":[],"mappings":"AAMA,OAAyB,EACvB,qBAAqB,EACtB,MAAM,iCAAiC,CAAA;AAIxC,MAAM,MAAM,uBAAuB,GAAG;IACpC,QAAQ,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,qBAAqB,CAAC,EAAE,qBAAqB,CAAA;IAE7C,mCAAmC,EAAE,MAAM,IAAI,CAAA;CAChD,CAAA;AAED,eAAO,MAAM,0BAA0B,YAAY,CAAA;AAInD;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,kBAAkB,CAAC,KAAK,EAAE,uBAAuB,2CAqGxE"}

package/dist/components/entity/page/title_bar/EntityPageTitleBar.js

@@ -10,18 +10,23 @@ import c from "./TitleBarProperties.js";
 import { Avatar as l, Box as u, Skeleton as d, Stack as f, Typography as p } from "@mui/material";
 import { jsx as m, jsxs as h } from "react/jsx-runtime";
 //#region src/components/entity/page/title_bar/EntityPageTitleBar.tsx
-function g(g) {
-	let { entityId: _, versionNumber: v, entityActionMenuProps: y } = g, b = y?.actionConfiguration.SHOW_VERSION_HISTORY?.onClick, { data: x, isLoading: S } = t(_, v), C = x?.entity && e(x.entity) ? x.entity.repositoryName : x?.entity?.name;
+var g = "#9EAAB7", _ = "#EAF0F5", v = "#497097";
+function y(g) {
+	let { entityId: y, versionNumber: b, entityActionMenuProps: x } = g, S = x?.actionConfiguration.SHOW_VERSION_HISTORY?.onClick, { data: C, isLoading: w } = t(y, b), T = C?.entity && e(C.entity) ? C.entity.repositoryName : C?.entity?.name;
 	return /* @__PURE__ */ h("div", { children: [/* @__PURE__ */ m(u, {
 		sx: {
 			padding: "20px 40px",
-			backgroundColor: "grey.100"
+			backgroundColor: _,
+			borderRadius: "5px"
 		},
 		children: /* @__PURE__ */ h(f, {
-			sx: { flexDirection: {
-				xs: "column",
-				sm: "row"
-			} },
+			sx: {
+				flexDirection: {
+					xs: "column",
+					sm: "row"
+				},
+				alignItems: "center"
+			},
 			children: [/* @__PURE__ */ h(f, {
 				direction: "row",
 				sx: {
@@ -29,19 +34,20 @@ function g(g) {
 					flexGrow: 1
 				},
 				children: [/* @__PURE__ */ m(i, {
-					condition: S,
+					condition: w,
 					wrapper: d,
 					wrapperProps: { variant: "circular" },
 					children: /* @__PURE__ */ m(l, {
 						sx: {
-							bgcolor: "grey.300",
+							bgcolor: v,
 							height: 48,
-							width: 48
+							width: 48,
+							borderRadius: "3px"
 						},
-						children: x?.entityType && /* @__PURE__ */ m(n, {
-							icon: x?.entityType ? r[x.entityType] : "file",
-							wrap: !1,
-							sx: { color: "grey.700" }
+						variant: "square",
+						children: C?.entityType && /* @__PURE__ */ m(n, {
+							icon: C?.entityType ? r[C.entityType] : "file",
+							wrap: !1
 						})
 					})
 				}), /* @__PURE__ */ h(u, {
@@ -56,24 +62,27 @@ function g(g) {
 							gap: "3px"
 						},
 						children: [/* @__PURE__ */ m(i, {
-							condition: S,
+							condition: w,
 							wrapper: d,
 							children: /* @__PURE__ */ m(p, {
 								variant: "headline2",
-								children: C ?? "Name not set"
+								children: T ?? "Name not set"
 							})
-						}), x?.entity?.id && /* @__PURE__ */ m(a, { entityId: x.entity.id })]
+						}), C?.entity?.id && /* @__PURE__ */ m(a, {
+							entityId: C.entity.id,
+							iconColor: "#9EAAB7"
+						})]
 					}), /* @__PURE__ */ m(s, {
-						entityId: _,
-						versionNumber: v,
-						toggleShowVersionHistory: b
+						entityId: y,
+						versionNumber: b,
+						toggleShowVersionHistory: S
 					})]
 				})]
-			}), y && /* @__PURE__ */ m(o, { ...y })]
+			}), x && /* @__PURE__ */ m(o, { ...x })]
 		})
 	}), /* @__PURE__ */ m(c, { ...g })] });
 }
 //#endregion
-export { g as default };
+export { g as FAVORITE_BUTTON_ICON_COLOR, y as default };
 
 //# sourceMappingURL=EntityPageTitleBar.js.map

package/dist/components/entity/page/title_bar/EntityPageTitleBar.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityPageTitleBar.js","names":[],"sources":["../../../../../src/components/entity/page/title_bar/EntityPageTitleBar.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport { useGetEntityBundle } from '@/synapse-queries'\nimport { isDockerRepository } from '@/utils/types/IsType'\nimport { Avatar, Box, Skeleton, Stack, Typography } from '@mui/material'\nimport FavoriteButton from '../../../favorites/FavoriteButton'\nimport IconSvg, { type2SvgIconName } from '../../../IconSvg/IconSvg'\nimport EntityActionMenu, {\n  EntityActionMenuProps,\n} from '../action_menu/EntityActionMenu'\nimport { EntityTitleBarVersionInfo } from './EntityTitleBarVersionInfo'\nimport TitleBarProperties from './TitleBarProperties'\n\nexport type EntityPageTitleBarProps = {\n  entityId: string\n  versionNumber?: number\n  /* Props that will be passed through to an EntityActionMenu component */\n  entityActionMenuProps?: EntityActionMenuProps\n  /* Callback invoked when an ACT member clicks \"Add Conditions for Use\". */\n  onActMemberClickAddConditionsForUse: () => void\n}\n\n/**\n * The EntityPageTitleBar component is shown on every Entity page in Synapse, and shows an Entity's metadata and\n * provides controls to view and manipulate the Entity.\n */\nexport default function EntityPageTitleBar(props: EntityPageTitleBarProps) {\n  const { entityId, versionNumber, entityActionMenuProps } = props\n\n  const toggleShowVersionHistory =\n    entityActionMenuProps?.actionConfiguration['SHOW_VERSION_HISTORY']?.onClick\n\n  const { data: bundle, isLoading } = useGetEntityBundle(\n    entityId,\n    versionNumber,\n  )\n\n  const name =\n    bundle?.entity && isDockerRepository(bundle.entity)\n      ? bundle.entity.repositoryName\n      : bundle?.entity?.name\n\n  return (\n    <div>\n      <Box\n        sx={{\n          padding: '20px 40px',\n          backgroundColor: 'grey.100',\n        }}\n      >\n        <Stack\n          sx={{\n            flexDirection: { xs: 'column', sm: 'row' },\n          }}\n        >\n          <Stack\n            direction={'row'}\n            sx={{\n              alignItems: 'center',\n              flexGrow: 1,\n            }}\n          >\n            <ConditionalWrapper\n              condition={isLoading}\n              wrapper={Skeleton}\n              wrapperProps={{\n                variant: 'circular',\n              }}\n            >\n              <Avatar sx={{ bgcolor: 'grey.300', height: 48, width: 48 }}>\n                {bundle?.entityType && (\n                  <IconSvg\n                    icon={\n                      bundle?.entityType\n                        ? type2SvgIconName[bundle.entityType]\n                        : 'file'\n                    }\n                    wrap={false}\n                    sx={{ color: 'grey.700' }}\n                  />\n                )}\n              </Avatar>\n            </ConditionalWrapper>\n            <Box sx={{ marginLeft: '10px', flexGrow: 1 }}>\n              <Stack\n                direction={'row'}\n                sx={{\n                  alignItems: 'center',\n                  gap: '3px',\n                }}\n              >\n                <ConditionalWrapper condition={isLoading} wrapper={Skeleton}>\n                  <Typography variant={'headline2'}>\n                    {name ?? 'Name not set'}\n                  </Typography>\n                </ConditionalWrapper>\n                {bundle?.entity?.id && (\n                  <FavoriteButton entityId={bundle.entity.id} />\n                )}\n              </Stack>\n              <EntityTitleBarVersionInfo\n                entityId={entityId}\n                versionNumber={versionNumber}\n                toggleShowVersionHistory={toggleShowVersionHistory}\n              />\n            </Box>\n          </Stack>\n          {entityActionMenuProps && (\n            <EntityActionMenu {...entityActionMenuProps} />\n          )}\n        </Stack>\n      </Box>\n      <TitleBarProperties {...props} />\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAyBA,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EAAE,aAAU,kBAAe,6BAA0B,GAErD,IACJ,GAAuB,oBAAoB,sBAAyB,SAEhE,EAAE,MAAM,GAAQ,iBAAc,EAClC,GACA,CACF,GAEM,IACJ,GAAQ,UAAU,EAAmB,EAAO,MAAM,IAC9C,EAAO,OAAO,iBACd,GAAQ,QAAQ;CAEtB,OACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,iBAAiB;EACnB;YAEA,kBAAC,GAAD;GACE,IAAI,EACF,eAAe;IAAE,IAAI;IAAU,IAAI;GAAM,EAC3C;aAHF,CAKE,kBAAC,GAAD;IACE,WAAW;IACX,IAAI;KACF,YAAY;KACZ,UAAU;IACZ;cALF,CAOE,kBAAC,GAAD;KACE,WAAW;KACX,SAAS;KACT,cAAc,EACZ,SAAS,WACX;eAEA,kBAAC,GAAD;MAAQ,IAAI;OAAE,SAAS;OAAY,QAAQ;OAAI,OAAO;MAAG;gBACtD,GAAQ,cACP,kBAAC,GAAD;OACE,MACE,GAAQ,aACJ,EAAiB,EAAO,cACxB;OAEN,MAAM;OACN,IAAI,EAAE,OAAO,WAAW;MACzB,CAAA;KAEG,CAAA;IACU,CAAA,GACpB,kBAAC,GAAD;KAAK,IAAI;MAAE,YAAY;MAAQ,UAAU;KAAE;eAA3C,CACE,kBAAC,GAAD;MACE,WAAW;MACX,IAAI;OACF,YAAY;OACZ,KAAK;MACP;gBALF,CAOE,kBAAC,GAAD;OAAoB,WAAW;OAAW,SAAS;iBACjD,kBAAC,GAAD;QAAY,SAAS;kBAClB,KAAQ;OACC,CAAA;MACM,CAAA,GACnB,GAAQ,QAAQ,MACf,kBAAC,GAAD,EAAgB,UAAU,EAAO,OAAO,GAAK,CAAA,CAE1C;SACP,kBAAC,GAAD;MACY;MACK;MACW;KAC3B,CAAA,CACE;MACA;OACN,KACC,kBAAC,GAAD,EAAkB,GAAI,EAAwB,CAAA,CAE3C;;CACJ,CAAA,GACL,kBAAC,GAAD,EAAoB,GAAI,EAAQ,CAAA,CAC7B,EAAA,CAAA;AAET"}
+{"version":3,"file":"EntityPageTitleBar.js","names":[],"sources":["../../../../../src/components/entity/page/title_bar/EntityPageTitleBar.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport { useGetEntityBundle } from '@/synapse-queries'\nimport { isDockerRepository } from '@/utils/types/IsType'\nimport { Avatar, Box, Skeleton, Stack, Typography } from '@mui/material'\nimport FavoriteButton from '../../../favorites/FavoriteButton'\nimport IconSvg, { type2SvgIconName } from '../../../IconSvg/IconSvg'\nimport EntityActionMenu, {\n  EntityActionMenuProps,\n} from '../action_menu/EntityActionMenu'\nimport { EntityTitleBarVersionInfo } from './EntityTitleBarVersionInfo'\nimport TitleBarProperties from './TitleBarProperties'\n\nexport type EntityPageTitleBarProps = {\n  entityId: string\n  versionNumber?: number\n  /* Props that will be passed through to an EntityActionMenu component */\n  entityActionMenuProps?: EntityActionMenuProps\n  /* Callback invoked when an ACT member clicks \"Add Conditions for Use\". */\n  onActMemberClickAddConditionsForUse: () => void\n}\n\nexport const FAVORITE_BUTTON_ICON_COLOR = '#9EAAB7'\nconst TITLE_BAR_BACKGROUND_COLOR = '#EAF0F5'\nconst AVATAR_BACKGROUND_COLOR = '#497097'\n\n/**\n * The EntityPageTitleBar component is shown on every Entity page in Synapse, and shows an Entity's metadata and\n * provides controls to view and manipulate the Entity.\n */\nexport default function EntityPageTitleBar(props: EntityPageTitleBarProps) {\n  const { entityId, versionNumber, entityActionMenuProps } = props\n\n  const toggleShowVersionHistory =\n    entityActionMenuProps?.actionConfiguration['SHOW_VERSION_HISTORY']?.onClick\n\n  const { data: bundle, isLoading } = useGetEntityBundle(\n    entityId,\n    versionNumber,\n  )\n\n  const name =\n    bundle?.entity && isDockerRepository(bundle.entity)\n      ? bundle.entity.repositoryName\n      : bundle?.entity?.name\n\n  return (\n    <div>\n      <Box\n        sx={{\n          padding: '20px 40px',\n          backgroundColor: TITLE_BAR_BACKGROUND_COLOR,\n          borderRadius: '5px',\n        }}\n      >\n        <Stack\n          sx={{\n            flexDirection: { xs: 'column', sm: 'row' },\n            alignItems: 'center',\n          }}\n        >\n          <Stack\n            direction={'row'}\n            sx={{\n              alignItems: 'center',\n              flexGrow: 1,\n            }}\n          >\n            <ConditionalWrapper\n              condition={isLoading}\n              wrapper={Skeleton}\n              wrapperProps={{\n                variant: 'circular',\n              }}\n            >\n              <Avatar\n                sx={{\n                  bgcolor: AVATAR_BACKGROUND_COLOR,\n                  height: 48,\n                  width: 48,\n                  borderRadius: '3px',\n                }}\n                variant={'square'}\n              >\n                {bundle?.entityType && (\n                  <IconSvg\n                    icon={\n                      bundle?.entityType\n                        ? type2SvgIconName[bundle.entityType]\n                        : 'file'\n                    }\n                    wrap={false}\n                  />\n                )}\n              </Avatar>\n            </ConditionalWrapper>\n            <Box sx={{ marginLeft: '10px', flexGrow: 1 }}>\n              <Stack\n                direction={'row'}\n                sx={{\n                  alignItems: 'center',\n                  gap: '3px',\n                }}\n              >\n                <ConditionalWrapper condition={isLoading} wrapper={Skeleton}>\n                  <Typography variant={'headline2'}>\n                    {name ?? 'Name not set'}\n                  </Typography>\n                </ConditionalWrapper>\n                {bundle?.entity?.id && (\n                  <FavoriteButton\n                    entityId={bundle.entity.id}\n                    iconColor={FAVORITE_BUTTON_ICON_COLOR}\n                  />\n                )}\n              </Stack>\n              <EntityTitleBarVersionInfo\n                entityId={entityId}\n                versionNumber={versionNumber}\n                toggleShowVersionHistory={toggleShowVersionHistory}\n              />\n            </Box>\n          </Stack>\n          {entityActionMenuProps && (\n            <EntityActionMenu {...entityActionMenuProps} />\n          )}\n        </Stack>\n      </Box>\n      <TitleBarProperties {...props} />\n    </div>\n  )\n}\n"],"mappings":";;;;;;;;;;;;AAqBA,IAAa,IAA6B,WACpC,IAA6B,WAC7B,IAA0B;AAMhC,SAAwB,EAAmB,GAAgC;CACzE,IAAM,EAAE,aAAU,kBAAe,6BAA0B,GAErD,IACJ,GAAuB,oBAAoB,sBAAyB,SAEhE,EAAE,MAAM,GAAQ,iBAAc,EAClC,GACA,CACF,GAEM,IACJ,GAAQ,UAAU,EAAmB,EAAO,MAAM,IAC9C,EAAO,OAAO,iBACd,GAAQ,QAAQ;CAEtB,OACE,kBAAC,OAAD,EAAA,UAAA,CACE,kBAAC,GAAD;EACE,IAAI;GACF,SAAS;GACT,iBAAiB;GACjB,cAAc;EAChB;YAEA,kBAAC,GAAD;GACE,IAAI;IACF,eAAe;KAAE,IAAI;KAAU,IAAI;IAAM;IACzC,YAAY;GACd;aAJF,CAME,kBAAC,GAAD;IACE,WAAW;IACX,IAAI;KACF,YAAY;KACZ,UAAU;IACZ;cALF,CAOE,kBAAC,GAAD;KACE,WAAW;KACX,SAAS;KACT,cAAc,EACZ,SAAS,WACX;eAEA,kBAAC,GAAD;MACE,IAAI;OACF,SAAS;OACT,QAAQ;OACR,OAAO;OACP,cAAc;MAChB;MACA,SAAS;gBAER,GAAQ,cACP,kBAAC,GAAD;OACE,MACE,GAAQ,aACJ,EAAiB,EAAO,cACxB;OAEN,MAAM;MACP,CAAA;KAEG,CAAA;IACU,CAAA,GACpB,kBAAC,GAAD;KAAK,IAAI;MAAE,YAAY;MAAQ,UAAU;KAAE;eAA3C,CACE,kBAAC,GAAD;MACE,WAAW;MACX,IAAI;OACF,YAAY;OACZ,KAAK;MACP;gBALF,CAOE,kBAAC,GAAD;OAAoB,WAAW;OAAW,SAAS;iBACjD,kBAAC,GAAD;QAAY,SAAS;kBAClB,KAAQ;OACC,CAAA;MACM,CAAA,GACnB,GAAQ,QAAQ,MACf,kBAAC,GAAD;OACE,UAAU,EAAO,OAAO;OACxB,WAAA;MACD,CAAA,CAEE;SACP,kBAAC,GAAD;MACY;MACK;MACW;KAC3B,CAAA,CACE;MACA;OACN,KACC,kBAAC,GAAD,EAAkB,GAAI,EAAwB,CAAA,CAE3C;;CACJ,CAAA,GACL,kBAAC,GAAD,EAAoB,GAAI,EAAQ,CAAA,CAC7B,EAAA,CAAA;AAET"}

package/dist/components/entity/page/title_bar/EntityTitleBarVersionInfo.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"EntityTitleBarVersionInfo.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/title_bar/EntityTitleBarVersionInfo.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAA;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAA;AAGrE,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,wBAAwB,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAA;CACzD,CAAA;AAED,iBAAS,wBAAwB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAQ/D;AAED,iBAAS,yBAAyB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAWhE;AAED,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,8BAA8B,kDA2DtC;AAED,eAAO,MAAM,yBAAyB;;;CAGrC,CAAA"}
+{"version":3,"file":"EntityTitleBarVersionInfo.d.ts","sourceRoot":"","sources":["../../../../../src/components/entity/page/title_bar/EntityTitleBarVersionInfo.tsx"],"names":[],"mappings":"AAQA,OAAO,EAAE,MAAM,EAAE,MAAM,iCAAiC,CAAA;AACxD,OAAO,EAAE,mBAAmB,EAAE,MAAM,iCAAiC,CAAA;AAGrE,MAAM,MAAM,8BAA8B,GAAG;IAC3C,QAAQ,EAAE,MAAM,CAAA;IAChB,aAAa,CAAC,EAAE,MAAM,CAAA;IACtB,wBAAwB,EAAE,mBAAmB,CAAC,SAAS,CAAC,CAAA;CACzD,CAAA;AAED,iBAAS,wBAAwB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAQ/D;AAED,iBAAS,yBAAyB,CAAC,MAAM,EAAE,MAAM,GAAG,MAAM,GAAG,IAAI,CAWhE;AAuBD,wBAAgB,yBAAyB,CACvC,KAAK,EAAE,8BAA8B,kDA4DtC;AAED,eAAO,MAAM,yBAAyB;;;CAGrC,CAAA"}

package/dist/components/entity/page/title_bar/EntityTitleBarVersionInfo.js

@@ -13,12 +13,36 @@ function p(r) {
 	return n(r) ? t(r) && r.isLatestVersion ? e(r) ? "Draft Version" : "Current Version" : `V${r.versionNumber}${r.isLatestVersion ? " (Current)" : ""}` : null;
 }
 function m(e) {
-	let { entityId: t, versionNumber: m, toggleShowVersionHistory: h } = e, { data: g } = i(t, m), _ = g?.entity && n(g.entity), v = g?.entity && f(g.entity), y = v ? r(v, d) : void 0, b = g?.entity && p(g.entity);
-	return _ ? /* @__PURE__ */ u(a, {
+	return n(e) ? e.versionComment ?? null : null;
+}
+var h = /* @__PURE__ */ l(c, {
+	component: "span",
+	variant: "smallText1",
+	sx: {
+		color: "grey.700",
+		marginLeft: "5px",
+		marginRight: "5px"
+	},
+	children: "/"
+});
+function g(e) {
+	let { entityId: t, versionNumber: g, toggleShowVersionHistory: _ } = e, { data: v } = i(t, g), y = v?.entity && n(v.entity), b = v?.entity && f(v.entity), x = b ? r(b, d) : void 0, S = v?.entity && p(v.entity), C = v?.entity && m(v.entity);
+	return y ? /* @__PURE__ */ u(a, {
 		sx: { marginTop: "3px" },
 		children: [
 			/* @__PURE__ */ l(s, {
-				title: v,
+				title: "Click to show version history",
+				placement: "top",
+				children: /* @__PURE__ */ l(o, {
+					onClick: _,
+					variant: "smallText1",
+					sx: { fontWeight: 400 },
+					children: S
+				})
+			}),
+			b && S && h,
+			/* @__PURE__ */ l(s, {
+				title: b,
 				placement: "bottom",
 				children: /* @__PURE__ */ l(c, {
 					component: "span",
@@ -27,37 +51,27 @@ function m(e) {
 						color: "grey.700",
 						fontStyle: "italic"
 					},
-					children: y
+					children: x
 				})
 			}),
-			v && b && /* @__PURE__ */ l(c, {
+			C && h,
+			/* @__PURE__ */ l(c, {
 				component: "span",
 				variant: "smallText1",
 				sx: {
 					color: "grey.700",
-					marginLeft: "5px",
-					marginRight: "5px"
+					fontStyle: "italic"
 				},
-				children: "/"
-			}),
-			/* @__PURE__ */ l(s, {
-				title: "Click to show version history",
-				placement: "top",
-				children: /* @__PURE__ */ l(o, {
-					onClick: h,
-					variant: "smallText1",
-					sx: { fontWeight: 400 },
-					children: b
-				})
+				children: C
 			})
 		]
 	}) : null;
 }
-var h = {
+var _ = {
 	getDisplayedVersionLabel: f,
 	getDisplayedVersionNumber: p
 };
 //#endregion
-export { h as EXPORTED_FOR_UNIT_TESTING, m as EntityTitleBarVersionInfo };
+export { _ as EXPORTED_FOR_UNIT_TESTING, g as EntityTitleBarVersionInfo };
 
 //# sourceMappingURL=EntityTitleBarVersionInfo.js.map

package/dist/components/entity/page/title_bar/EntityTitleBarVersionInfo.js.map

@@ -1 +1 @@
-{"version":3,"file":"EntityTitleBarVersionInfo.js","names":[],"sources":["../../../../../src/components/entity/page/title_bar/EntityTitleBarVersionInfo.tsx"],"sourcesContent":["import { useGetEntityBundle } from '@/synapse-queries'\nimport {\n  isEntityRefCollectionView,\n  isTable,\n  isVersionableEntity,\n} from '@/utils/functions/EntityTypeUtils'\nimport { truncateString } from '@/utils/functions/StringUtils'\nimport { Box, Link, Tooltip, Typography } from '@mui/material'\nimport { Entity } from '@sage-bionetworks/synapse-types'\nimport { ActionConfiguration } from '../action_menu/EntityActionMenu'\n\nconst MAX_VERSION_LABEL_LENGTH = 50\nexport type EntityTitleBarVersionInfoProps = {\n  entityId: string\n  versionNumber?: number\n  toggleShowVersionHistory: ActionConfiguration['onClick']\n}\n\nfunction getDisplayedVersionLabel(entity: Entity): string | null {\n  if (!isVersionableEntity(entity)) {\n    return null\n  }\n  if (isTable(entity) && entity.isLatestVersion) {\n    return null\n  }\n  return entity.versionLabel ?? null\n}\n\nfunction getDisplayedVersionNumber(entity: Entity): string | null {\n  if (!isVersionableEntity(entity)) {\n    return null\n  }\n  if (isTable(entity) && entity.isLatestVersion) {\n    if (isEntityRefCollectionView(entity)) {\n      return 'Draft Version'\n    }\n    return 'Current Version'\n  }\n  return `V${entity.versionNumber}${entity.isLatestVersion ? ' (Current)' : ''}`\n}\n\nexport function EntityTitleBarVersionInfo(\n  props: EntityTitleBarVersionInfoProps,\n) {\n  const { entityId, versionNumber, toggleShowVersionHistory } = props\n\n  const { data: bundle } = useGetEntityBundle(entityId, versionNumber)\n\n  const isVersionable = bundle?.entity && isVersionableEntity(bundle.entity)\n\n  const fullVersionLabel =\n    bundle?.entity && getDisplayedVersionLabel(bundle.entity)\n  const truncatedVersionLabel = fullVersionLabel\n    ? truncateString(fullVersionLabel, MAX_VERSION_LABEL_LENGTH)\n    : undefined\n\n  const versionNumberDisplay =\n    bundle?.entity && getDisplayedVersionNumber(bundle.entity)\n\n  if (!isVersionable) {\n    return null\n  }\n\n  return (\n    <Box sx={{ marginTop: '3px' }}>\n      <Tooltip title={fullVersionLabel} placement={'bottom'}>\n        <Typography\n          component={'span'}\n          variant=\"smallText1\"\n          sx={{\n            color: 'grey.700',\n            fontStyle: 'italic',\n          }}\n        >\n          {truncatedVersionLabel}\n        </Typography>\n      </Tooltip>\n      {fullVersionLabel && versionNumberDisplay && (\n        <Typography\n          component={'span'}\n          variant=\"smallText1\"\n          sx={{\n            color: 'grey.700',\n            marginLeft: '5px',\n            marginRight: '5px',\n          }}\n        >\n          /\n        </Typography>\n      )}\n      <Tooltip title={'Click to show version history'} placement={'top'}>\n        <Link\n          onClick={toggleShowVersionHistory}\n          variant=\"smallText1\"\n          sx={{ fontWeight: 400 }}\n        >\n          {versionNumberDisplay}\n        </Link>\n      </Tooltip>\n    </Box>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = {\n  getDisplayedVersionLabel,\n  getDisplayedVersionNumber,\n}\n"],"mappings":";;;;;;;AAWA,IAAM,IAA2B;AAOjC,SAAS,EAAyB,GAA+B;CAO/D,OANI,CAAC,EAAoB,CAAM,KAG3B,EAAQ,CAAM,KAAK,EAAO,kBACrB,OAEF,EAAO,gBAAgB;AAChC;AAEA,SAAS,EAA0B,GAA+B;CAUhE,OATK,EAAoB,CAAM,IAG3B,EAAQ,CAAM,KAAK,EAAO,kBACxB,EAA0B,CAAM,IAC3B,kBAEF,oBAEF,IAAI,EAAO,gBAAgB,EAAO,kBAAkB,eAAe,OARjE;AASX;AAEA,SAAgB,EACd,GACA;CACA,IAAM,EAAE,aAAU,kBAAe,gCAA6B,GAExD,EAAE,MAAM,MAAW,EAAmB,GAAU,CAAa,GAE7D,IAAgB,GAAQ,UAAU,EAAoB,EAAO,MAAM,GAEnE,IACJ,GAAQ,UAAU,EAAyB,EAAO,MAAM,GACpD,IAAwB,IAC1B,EAAe,GAAkB,CAAwB,IACzD,KAAA,GAEE,IACJ,GAAQ,UAAU,EAA0B,EAAO,MAAM;CAM3D,OAJK,IAKH,kBAAC,GAAD;EAAK,IAAI,EAAE,WAAW,MAAM;YAA5B;GACE,kBAAC,GAAD;IAAS,OAAO;IAAkB,WAAW;cAC3C,kBAAC,GAAD;KACE,WAAW;KACX,SAAQ;KACR,IAAI;MACF,OAAO;MACP,WAAW;KACb;eAEC;IACS,CAAA;GACL,CAAA;GACR,KAAoB,KACnB,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,IAAI;KACF,OAAO;KACP,YAAY;KACZ,aAAa;IACf;cACD;GAEW,CAAA;GAEd,kBAAC,GAAD;IAAS,OAAO;IAAiC,WAAW;cAC1D,kBAAC,GAAD;KACE,SAAS;KACT,SAAQ;KACR,IAAI,EAAE,YAAY,IAAI;eAErB;IACG,CAAA;GACC,CAAA;EACN;MAvCE;AAyCX;AAEA,IAAa,IAA4B;CACvC;CACA;AACF"}
+{"version":3,"file":"EntityTitleBarVersionInfo.js","names":[],"sources":["../../../../../src/components/entity/page/title_bar/EntityTitleBarVersionInfo.tsx"],"sourcesContent":["import { useGetEntityBundle } from '@/synapse-queries'\nimport {\n  isEntityRefCollectionView,\n  isTable,\n  isVersionableEntity,\n} from '@/utils/functions/EntityTypeUtils'\nimport { truncateString } from '@/utils/functions/StringUtils'\nimport { Box, Link, Tooltip, Typography } from '@mui/material'\nimport { Entity } from '@sage-bionetworks/synapse-types'\nimport { ActionConfiguration } from '../action_menu/EntityActionMenu'\n\nconst MAX_VERSION_LABEL_LENGTH = 50\nexport type EntityTitleBarVersionInfoProps = {\n  entityId: string\n  versionNumber?: number\n  toggleShowVersionHistory: ActionConfiguration['onClick']\n}\n\nfunction getDisplayedVersionLabel(entity: Entity): string | null {\n  if (!isVersionableEntity(entity)) {\n    return null\n  }\n  if (isTable(entity) && entity.isLatestVersion) {\n    return null\n  }\n  return entity.versionLabel ?? null\n}\n\nfunction getDisplayedVersionNumber(entity: Entity): string | null {\n  if (!isVersionableEntity(entity)) {\n    return null\n  }\n  if (isTable(entity) && entity.isLatestVersion) {\n    if (isEntityRefCollectionView(entity)) {\n      return 'Draft Version'\n    }\n    return 'Current Version'\n  }\n  return `V${entity.versionNumber}${entity.isLatestVersion ? ' (Current)' : ''}`\n}\n\nfunction getDisplayedVersionComment(entity: Entity): string | null {\n  if (!isVersionableEntity(entity)) {\n    return null\n  }\n  return entity.versionComment ?? null\n}\n\nconst forwardSlash = (\n  <Typography\n    component={'span'}\n    variant=\"smallText1\"\n    sx={{\n      color: 'grey.700',\n      marginLeft: '5px',\n      marginRight: '5px',\n    }}\n  >\n    /\n  </Typography>\n)\n\nexport function EntityTitleBarVersionInfo(\n  props: EntityTitleBarVersionInfoProps,\n) {\n  const { entityId, versionNumber, toggleShowVersionHistory } = props\n\n  const { data: bundle } = useGetEntityBundle(entityId, versionNumber)\n\n  const isVersionable = bundle?.entity && isVersionableEntity(bundle.entity)\n\n  const fullVersionLabel =\n    bundle?.entity && getDisplayedVersionLabel(bundle.entity)\n  const truncatedVersionLabel = fullVersionLabel\n    ? truncateString(fullVersionLabel, MAX_VERSION_LABEL_LENGTH)\n    : undefined\n\n  const versionNumberDisplay =\n    bundle?.entity && getDisplayedVersionNumber(bundle.entity)\n\n  const versionComment =\n    bundle?.entity && getDisplayedVersionComment(bundle.entity)\n\n  if (!isVersionable) {\n    return null\n  }\n  return (\n    <Box sx={{ marginTop: '3px' }}>\n      <Tooltip title={'Click to show version history'} placement={'top'}>\n        <Link\n          onClick={toggleShowVersionHistory}\n          variant=\"smallText1\"\n          sx={{ fontWeight: 400 }}\n        >\n          {versionNumberDisplay}\n        </Link>\n      </Tooltip>\n      {fullVersionLabel && versionNumberDisplay && forwardSlash}\n      <Tooltip title={fullVersionLabel} placement={'bottom'}>\n        <Typography\n          component={'span'}\n          variant=\"smallText1\"\n          sx={{\n            color: 'grey.700',\n            fontStyle: 'italic',\n          }}\n        >\n          {truncatedVersionLabel}\n        </Typography>\n      </Tooltip>\n      {versionComment && forwardSlash}\n      <Typography\n        component={'span'}\n        variant=\"smallText1\"\n        sx={{\n          color: 'grey.700',\n          fontStyle: 'italic',\n        }}\n      >\n        {versionComment}\n      </Typography>\n    </Box>\n  )\n}\n\nexport const EXPORTED_FOR_UNIT_TESTING = {\n  getDisplayedVersionLabel,\n  getDisplayedVersionNumber,\n}\n"],"mappings":";;;;;;;AAWA,IAAM,IAA2B;AAOjC,SAAS,EAAyB,GAA+B;CAO/D,OANI,CAAC,EAAoB,CAAM,KAG3B,EAAQ,CAAM,KAAK,EAAO,kBACrB,OAEF,EAAO,gBAAgB;AAChC;AAEA,SAAS,EAA0B,GAA+B;CAUhE,OATK,EAAoB,CAAM,IAG3B,EAAQ,CAAM,KAAK,EAAO,kBACxB,EAA0B,CAAM,IAC3B,kBAEF,oBAEF,IAAI,EAAO,gBAAgB,EAAO,kBAAkB,eAAe,OARjE;AASX;AAEA,SAAS,EAA2B,GAA+B;CAIjE,OAHK,EAAoB,CAAM,IAGxB,EAAO,kBAAkB,OAFvB;AAGX;AAEA,IAAM,IACJ,kBAAC,GAAD;CACE,WAAW;CACX,SAAQ;CACR,IAAI;EACF,OAAO;EACP,YAAY;EACZ,aAAa;CACf;WACD;AAEW,CAAA;AAGd,SAAgB,EACd,GACA;CACA,IAAM,EAAE,aAAU,kBAAe,gCAA6B,GAExD,EAAE,MAAM,MAAW,EAAmB,GAAU,CAAa,GAE7D,IAAgB,GAAQ,UAAU,EAAoB,EAAO,MAAM,GAEnE,IACJ,GAAQ,UAAU,EAAyB,EAAO,MAAM,GACpD,IAAwB,IAC1B,EAAe,GAAkB,CAAwB,IACzD,KAAA,GAEE,IACJ,GAAQ,UAAU,EAA0B,EAAO,MAAM,GAErD,IACJ,GAAQ,UAAU,EAA2B,EAAO,MAAM;CAK5D,OAHK,IAIH,kBAAC,GAAD;EAAK,IAAI,EAAE,WAAW,MAAM;YAA5B;GACE,kBAAC,GAAD;IAAS,OAAO;IAAiC,WAAW;cAC1D,kBAAC,GAAD;KACE,SAAS;KACT,SAAQ;KACR,IAAI,EAAE,YAAY,IAAI;eAErB;IACG,CAAA;GACC,CAAA;GACR,KAAoB,KAAwB;GAC7C,kBAAC,GAAD;IAAS,OAAO;IAAkB,WAAW;cAC3C,kBAAC,GAAD;KACE,WAAW;KACX,SAAQ;KACR,IAAI;MACF,OAAO;MACP,WAAW;KACb;eAEC;IACS,CAAA;GACL,CAAA;GACR,KAAkB;GACnB,kBAAC,GAAD;IACE,WAAW;IACX,SAAQ;IACR,IAAI;KACF,OAAO;KACP,WAAW;IACb;cAEC;GACS,CAAA;EACT;MArCE;AAuCX;AAEA,IAAa,IAA4B;CACvC;CACA;AACF"}

package/dist/components/favorites/FavoriteButton.d.ts

@@ -1,5 +1,6 @@
 export type FavoriteButtonProps = {
     entityId: string;
+    iconColor?: string;
 };
 /**
  * Renders a button that indicates if an entity is favorited by the logged-in user. When clicked, the entity is

package/dist/components/favorites/FavoriteButton.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"FavoriteButton.d.ts","sourceRoot":"","sources":["../../../src/components/favorites/FavoriteButton.tsx"],"names":[],"mappings":"AAUA,MAAM,MAAM,mBAAmB,GAAG;IAEhC,QAAQ,EAAE,MAAM,CAAA;CACjB,CAAA;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAgDhE"}
+{"version":3,"file":"FavoriteButton.d.ts","sourceRoot":"","sources":["../../../src/components/favorites/FavoriteButton.tsx"],"names":[],"mappings":"AAUA,MAAM,MAAM,mBAAmB,GAAG;IAEhC,QAAQ,EAAE,MAAM,CAAA;IAChB,SAAS,CAAC,EAAE,MAAM,CAAA;CACnB,CAAA;AAED;;;GAGG;AACH,MAAM,CAAC,OAAO,UAAU,cAAc,CAAC,KAAK,EAAE,mBAAmB,2CAkDhE"}

package/dist/components/favorites/FavoriteButton.js

@@ -7,24 +7,24 @@ import { IconButton as o, Skeleton as s, Tooltip as c } from "@mui/material";
 import { jsx as l } from "react/jsx-runtime";
 //#region src/components/favorites/FavoriteButton.tsx
 function u(u) {
-	let { entityId: d } = u, { isAuthenticated: f } = e(), { isFavorite: p, isLoading: m } = n(d), { mutate: h, isPending: g } = t(), { mutate: _, isPending: v } = r(), y = m || g || v || !f, b = "Add to Favorites";
-	return f ? p && (b = "Remove from Favorites") : b = "Sign in to add this to your favorites", /* @__PURE__ */ l(a, {
-		condition: m,
+	let { entityId: d, iconColor: f } = u, { isAuthenticated: p } = e(), { isFavorite: m, isLoading: h } = n(d), { mutate: g, isPending: _ } = t(), { mutate: v, isPending: y } = r(), b = h || _ || y || !p, x = "Add to Favorites";
+	return p ? m && (x = "Remove from Favorites") : x = "Sign in to add this to your favorites", /* @__PURE__ */ l(a, {
+		condition: h,
 		wrapper: s,
 		children: /* @__PURE__ */ l(c, {
-			title: b,
+			title: x,
 			placement: "top",
 			children: /* @__PURE__ */ l("span", { children: /* @__PURE__ */ l(o, {
 				size: "small",
-				disabled: y,
+				disabled: b,
 				onClick: () => {
-					p ? _(d) : h(d);
+					m ? v(d) : g(d);
 				},
 				sx: { padding: "2px" },
 				children: /* @__PURE__ */ l(i, {
-					icon: p ? "fav" : "favOutline",
+					icon: m ? "fav" : "favOutline",
 					sx: {
-						color: "tertiary.main",
+						color: m ? "tertiary.main" : f ?? "tertiary.main",
 						width: "21px",
 						height: "21px"
 					},

package/dist/components/favorites/FavoriteButton.js.map

@@ -1 +1 @@
-{"version":3,"file":"FavoriteButton.js","names":[],"sources":["../../../src/components/favorites/FavoriteButton.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport {\n  useAddFavorite,\n  useIsFavorite,\n  useRemoveFavorite,\n} from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { IconButton, Skeleton, Tooltip } from '@mui/material'\nimport IconSvg from '../IconSvg/IconSvg'\n\nexport type FavoriteButtonProps = {\n  /* The entity for which to show a favorite button */\n  entityId: string\n}\n\n/**\n * Renders a button that indicates if an entity is favorited by the logged-in user. When clicked, the entity is\n * added to/removed from their favorites\n */\nexport default function FavoriteButton(props: FavoriteButtonProps) {\n  const { entityId } = props\n  const { isAuthenticated } = useSynapseContext()\n  const { isFavorite, isLoading } = useIsFavorite(entityId)\n  const { mutate: onAddFavorite, isPending: isAddingFavorite } =\n    useAddFavorite()\n  const { mutate: onRemoveFavorite, isPending: isRemovingFavorite } =\n    useRemoveFavorite()\n\n  const disableButton =\n    isLoading || isAddingFavorite || isRemovingFavorite || !isAuthenticated\n\n  let tooltipText = 'Add to Favorites'\n  if (!isAuthenticated) {\n    tooltipText = 'Sign in to add this to your favorites'\n  } else if (isFavorite) {\n    tooltipText = 'Remove from Favorites'\n  }\n  return (\n    <ConditionalWrapper condition={isLoading} wrapper={Skeleton}>\n      <Tooltip title={tooltipText} placement={'top'}>\n        <span>\n          <IconButton\n            size={'small'}\n            disabled={disableButton}\n            onClick={() => {\n              if (isFavorite) {\n                onRemoveFavorite(entityId)\n              } else {\n                onAddFavorite(entityId)\n              }\n            }}\n            sx={{ padding: '2px' }}\n          >\n            <IconSvg\n              icon={isFavorite ? 'fav' : 'favOutline'}\n              sx={{\n                color: 'tertiary.main',\n                width: '21px',\n                height: '21px',\n              }}\n              wrap={false}\n            />\n          </IconButton>\n        </span>\n      </Tooltip>\n    </ConditionalWrapper>\n  )\n}\n"],"mappings":";;;;;;;;AAmBA,SAAwB,EAAe,GAA4B;CACjE,IAAM,EAAE,gBAAa,GACf,EAAE,uBAAoB,EAAkB,GACxC,EAAE,eAAY,iBAAc,EAAc,CAAQ,GAClD,EAAE,QAAQ,GAAe,WAAW,MACxC,EAAe,GACX,EAAE,QAAQ,GAAkB,WAAW,MAC3C,EAAkB,GAEd,IACJ,KAAa,KAAoB,KAAsB,CAAC,GAEtD,IAAc;CAMlB,OALK,IAEM,MACT,IAAc,2BAFd,IAAc,yCAKd,kBAAC,GAAD;EAAoB,WAAW;EAAW,SAAS;YACjD,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAW;aACtC,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IACE,MAAM;IACN,UAAU;IACV,eAAe;KACb,AAAI,IACF,EAAiB,CAAQ,IAEzB,EAAc,CAAQ;IAE1B;IACA,IAAI,EAAE,SAAS,MAAM;cAErB,kBAAC,GAAD;KACE,MAAM,IAAa,QAAQ;KAC3B,IAAI;MACF,OAAO;MACP,OAAO;MACP,QAAQ;KACV;KACA,MAAM;IACP,CAAA;GACS,CAAA,EACR,CAAA;EACC,CAAA;CACS,CAAA;AAExB"}
+{"version":3,"file":"FavoriteButton.js","names":[],"sources":["../../../src/components/favorites/FavoriteButton.tsx"],"sourcesContent":["import ConditionalWrapper from '@/components/utils/ConditionalWrapper'\nimport {\n  useAddFavorite,\n  useIsFavorite,\n  useRemoveFavorite,\n} from '@/synapse-queries'\nimport { useSynapseContext } from '@/utils/context/SynapseContext'\nimport { IconButton, Skeleton, Tooltip } from '@mui/material'\nimport IconSvg from '../IconSvg/IconSvg'\n\nexport type FavoriteButtonProps = {\n  /* The entity for which to show a favorite button */\n  entityId: string\n  iconColor?: string\n}\n\n/**\n * Renders a button that indicates if an entity is favorited by the logged-in user. When clicked, the entity is\n * added to/removed from their favorites\n */\nexport default function FavoriteButton(props: FavoriteButtonProps) {\n  const { entityId, iconColor } = props\n  const { isAuthenticated } = useSynapseContext()\n  const { isFavorite, isLoading } = useIsFavorite(entityId)\n  const { mutate: onAddFavorite, isPending: isAddingFavorite } =\n    useAddFavorite()\n  const { mutate: onRemoveFavorite, isPending: isRemovingFavorite } =\n    useRemoveFavorite()\n\n  const disableButton =\n    isLoading || isAddingFavorite || isRemovingFavorite || !isAuthenticated\n\n  let tooltipText = 'Add to Favorites'\n  if (!isAuthenticated) {\n    tooltipText = 'Sign in to add this to your favorites'\n  } else if (isFavorite) {\n    tooltipText = 'Remove from Favorites'\n  }\n  return (\n    <ConditionalWrapper condition={isLoading} wrapper={Skeleton}>\n      <Tooltip title={tooltipText} placement={'top'}>\n        <span>\n          <IconButton\n            size={'small'}\n            disabled={disableButton}\n            onClick={() => {\n              if (isFavorite) {\n                onRemoveFavorite(entityId)\n              } else {\n                onAddFavorite(entityId)\n              }\n            }}\n            sx={{ padding: '2px' }}\n          >\n            <IconSvg\n              icon={isFavorite ? 'fav' : 'favOutline'}\n              sx={{\n                color: isFavorite\n                  ? 'tertiary.main'\n                  : (iconColor ?? 'tertiary.main'),\n                width: '21px',\n                height: '21px',\n              }}\n              wrap={false}\n            />\n          </IconButton>\n        </span>\n      </Tooltip>\n    </ConditionalWrapper>\n  )\n}\n"],"mappings":";;;;;;;;AAoBA,SAAwB,EAAe,GAA4B;CACjE,IAAM,EAAE,aAAU,iBAAc,GAC1B,EAAE,uBAAoB,EAAkB,GACxC,EAAE,eAAY,iBAAc,EAAc,CAAQ,GAClD,EAAE,QAAQ,GAAe,WAAW,MACxC,EAAe,GACX,EAAE,QAAQ,GAAkB,WAAW,MAC3C,EAAkB,GAEd,IACJ,KAAa,KAAoB,KAAsB,CAAC,GAEtD,IAAc;CAMlB,OALK,IAEM,MACT,IAAc,2BAFd,IAAc,yCAKd,kBAAC,GAAD;EAAoB,WAAW;EAAW,SAAS;YACjD,kBAAC,GAAD;GAAS,OAAO;GAAa,WAAW;aACtC,kBAAC,QAAD,EAAA,UACE,kBAAC,GAAD;IACE,MAAM;IACN,UAAU;IACV,eAAe;KACb,AAAI,IACF,EAAiB,CAAQ,IAEzB,EAAc,CAAQ;IAE1B;IACA,IAAI,EAAE,SAAS,MAAM;cAErB,kBAAC,GAAD;KACE,MAAM,IAAa,QAAQ;KAC3B,IAAI;MACF,OAAO,IACH,kBACC,KAAa;MAClB,OAAO;MACP,QAAQ;KACV;KACA,MAAM;IACP,CAAA;GACS,CAAA,EACR,CAAA;EACC,CAAA;CACS,CAAA;AAExB"}

package/dist/components/menu/DropdownMenu.d.ts

@@ -19,6 +19,7 @@ export type DropdownMenuProps = {
     dropdownButtonText: string;
     buttonTooltip?: string;
     buttonProps?: ButtonProps;
+    variant?: ButtonProps['variant'];
     convertSingleItemToButton?: boolean;
     renderMenuIfNoItems?: boolean;
 };

package/dist/components/menu/DropdownMenu.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/menu/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,WAAW,EAUX,OAAO,EAGR,MAAM,eAAe,CAAA;AACtB,OAAO,EAEL,UAAU,EAKX,MAAM,OAAO,CAAA;AACd,OAAgB,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAEtD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAE7B,IAAI,EAAE,MAAM,CAAA;IAEZ,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;IAEjC,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAE9B,KAAK,EAAE,gBAAgB,EAAE,EAAE,CAAA;IAE3B,kBAAkB,EAAE,MAAM,CAAA;IAE1B,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,WAAW,CAAC,EAAE,WAAW,CAAA;IAEzB,yBAAyB,CAAC,EAAE,OAAO,CAAA;IAEnC,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,CAAA;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDA2MpD"}
+{"version":3,"file":"DropdownMenu.d.ts","sourceRoot":"","sources":["../../../src/components/menu/DropdownMenu.tsx"],"names":[],"mappings":"AAAA,OAAO,EAEL,WAAW,EAUX,OAAO,EAGR,MAAM,eAAe,CAAA;AACtB,OAAO,EAEL,UAAU,EAKX,MAAM,OAAO,CAAA;AACd,OAAgB,EAAE,QAAQ,EAAE,MAAM,oBAAoB,CAAA;AAEtD;;GAEG;AACH,MAAM,MAAM,gBAAgB,GAAG;IAE7B,IAAI,EAAE,MAAM,CAAA;IAEZ,IAAI,CAAC,EAAE,QAAQ,CAAA;IAEf,OAAO,CAAC,EAAE,CAAC,CAAC,EAAE,UAAU,KAAK,IAAI,CAAA;IAEjC,IAAI,CAAC,EAAE,MAAM,CAAA;IAEb,WAAW,CAAC,EAAE,MAAM,CAAA;IAEpB,QAAQ,CAAC,EAAE,OAAO,CAAA;IAElB,MAAM,CAAC,EAAE,OAAO,CAAA;IAEhB,MAAM,CAAC,EAAE,OAAO,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,iBAAiB,GAAG;IAE9B,KAAK,EAAE,gBAAgB,EAAE,EAAE,CAAA;IAE3B,kBAAkB,EAAE,MAAM,CAAA;IAE1B,aAAa,CAAC,EAAE,MAAM,CAAA;IAEtB,WAAW,CAAC,EAAE,WAAW,CAAA;IAEzB,OAAO,CAAC,EAAE,WAAW,CAAC,SAAS,CAAC,CAAA;IAEhC,yBAAyB,CAAC,EAAE,OAAO,CAAA;IAEnC,mBAAmB,CAAC,EAAE,OAAO,CAAA;CAC9B,CAAA;AAED;;GAEG;AACH,wBAAgB,YAAY,CAAC,KAAK,EAAE,iBAAiB,kDA4MpD"}