@red-hat-developer-hub/backstage-plugin-global-header 1.7.3 → 1.9.0

package/dist/components/HeaderDropdownComponent/ProfileDropdown.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"ProfileDropdown.esm.js","sources":["../../../src/components/HeaderDropdownComponent/ProfileDropdown.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useEffect, useMemo, useRef, useState } from 'react';\nimport { useUserProfile } from '@backstage/plugin-user-settings';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { UserEntity } from '@backstage/catalog-model';\nimport AccountCircleOutlinedIcon from '@mui/icons-material/AccountCircleOutlined';\nimport KeyboardArrowDownOutlinedIcon from '@mui/icons-material/KeyboardArrowDownOutlined';\nimport Avatar from '@mui/material/Avatar';\nimport Typography from '@mui/material/Typography';\nimport { lighten } from '@mui/material/styles';\nimport Box from '@mui/material/Box';\n\nimport { MenuSection } from './MenuSection';\nimport { HeaderDropdownComponent } from './HeaderDropdownComponent';\nimport { useProfileDropdownMountPoints } from '../../hooks/useProfileDropdownMountPoints';\nimport { useDropdownManager } from '../../hooks';\n\n/**\n * @public\n * Props for Profile Dropdown\n */\nexport interface ProfileDropdownProps {\n  layout?: React.CSSProperties;\n}\n\nexport const ProfileDropdown = ({ layout }: ProfileDropdownProps) => {\n  const { anchorEl, handleOpen, handleClose } = useDropdownManager();\n  const [user, setUser] = useState<string | null>();\n  const {\n    displayName,\n    backstageIdentity,\n    profile,\n    loading: profileLoading,\n  } = useUserProfile();\n  const catalogApi = useApi(catalogApiRef);\n\n  const profileDropdownMountPoints = useProfileDropdownMountPoints();\n\n  const headerRef = useRef<HTMLElement | null>(null);\n  const [bgColor, setBgColor] = useState('#3C3F42');\n\n  useEffect(() => {\n    if (headerRef.current) {\n      const computedStyle = window.getComputedStyle(headerRef.current);\n      const baseColor = computedStyle.backgroundColor;\n      setBgColor(lighten(baseColor, 0.2));\n    }\n  }, []);\n\n  useEffect(() => {\n    const container = document.getElementById('global-header');\n    if (container) {\n      const computedStyle = window.getComputedStyle(container);\n      const baseColor = computedStyle.backgroundColor;\n      setBgColor(lighten(baseColor, 0.2));\n    }\n  }, []);\n\n  useEffect(() => {\n    const fetchUserEntity = async () => {\n      let userProfile;\n      try {\n        if (backstageIdentity?.userEntityRef) {\n          userProfile = (await catalogApi.getEntityByRef(\n            backstageIdentity.userEntityRef,\n          )) as unknown as UserEntity;\n        }\n        setUser(\n          userProfile?.spec?.profile?.displayName ??\n            userProfile?.metadata?.title,\n        );\n      } catch (_err) {\n        setUser(null);\n      }\n    };\n\n    fetchUserEntity();\n  }, [backstageIdentity, catalogApi]);\n\n  const menuItems = useMemo(() => {\n    return (profileDropdownMountPoints ?? [])\n      .map(mp => ({\n        Component: mp.Component,\n        icon: mp.config?.props?.icon ?? '',\n        label: mp.config?.props?.title ?? '',\n        link: mp.config?.props?.link ?? '',\n        priority: mp.config?.priority ?? 0,\n      }))\n      .sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));\n  }, [profileDropdownMountPoints]);\n\n  if (menuItems.length === 0) {\n    return null;\n  }\n\n  const profileDisplayName = () => {\n    const name = user ?? displayName;\n    const regex = /^[^:/]+:[^/]+\\/[^/]+$/;\n    if (regex.test(name)) {\n      return name\n        .charAt(name.indexOf('/') + 1)\n        .toLocaleUpperCase('en-US')\n        .concat(name.substring(name.indexOf('/') + 2));\n    }\n    return name;\n  };\n\n  return (\n    <HeaderDropdownComponent\n      buttonContent={\n        <Box sx={{ display: 'flex', alignItems: 'center', ...layout }}>\n          {!profileLoading && (\n            <>\n              {profile.picture ? (\n                <Avatar\n                  src={profile.picture}\n                  sx={{ mr: 2, height: '32px', width: '32px' }}\n                  alt=\"Profile picture\"\n                />\n              ) : (\n                <AccountCircleOutlinedIcon fontSize=\"small\" sx={{ mr: 1 }} />\n              )}\n              <Typography\n                variant=\"body2\"\n                sx={{\n                  display: { xs: 'none', md: 'block' },\n                  fontWeight: 500,\n                  mr: '1rem',\n                }}\n              >\n                {profileDisplayName()}\n              </Typography>\n            </>\n          )}\n          <KeyboardArrowDownOutlinedIcon\n            sx={{\n              bgcolor: bgColor,\n              borderRadius: '25%',\n            }}\n          />\n        </Box>\n      }\n      buttonProps={{\n        color: 'inherit',\n        sx: {\n          display: 'flex',\n          alignItems: 'center',\n        },\n      }}\n      onOpen={handleOpen}\n      onClose={handleClose}\n      anchorEl={anchorEl}\n    >\n      <MenuSection hideDivider items={menuItems} handleClose={handleClose} />\n    </HeaderDropdownComponent>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"ProfileDropdown.esm.js","sources":["../../../src/components/HeaderDropdownComponent/ProfileDropdown.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useEffect, useMemo, useRef, useState } from 'react';\nimport type { CSSProperties } from 'react';\nimport { useUserProfile } from '@backstage/plugin-user-settings';\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { UserEntity } from '@backstage/catalog-model';\nimport AccountCircleOutlinedIcon from '@mui/icons-material/AccountCircleOutlined';\nimport KeyboardArrowDownOutlinedIcon from '@mui/icons-material/KeyboardArrowDownOutlined';\nimport Avatar from '@mui/material/Avatar';\nimport Typography from '@mui/material/Typography';\nimport { lighten } from '@mui/material/styles';\nimport Box from '@mui/material/Box';\n\nimport { MenuSection } from './MenuSection';\nimport { HeaderDropdownComponent } from './HeaderDropdownComponent';\nimport { useProfileDropdownMountPoints } from '../../hooks/useProfileDropdownMountPoints';\nimport { useDropdownManager } from '../../hooks';\n\n/**\n * @public\n * Props for Profile Dropdown\n */\nexport interface ProfileDropdownProps {\n  layout?: CSSProperties;\n}\n\nexport const ProfileDropdown = ({ layout }: ProfileDropdownProps) => {\n  const { anchorEl, handleOpen, handleClose } = useDropdownManager();\n  const [user, setUser] = useState<string | null>();\n  const {\n    displayName,\n    backstageIdentity,\n    profile,\n    loading: profileLoading,\n  } = useUserProfile();\n  const catalogApi = useApi(catalogApiRef);\n\n  const profileDropdownMountPoints = useProfileDropdownMountPoints();\n\n  const headerRef = useRef<HTMLElement | null>(null);\n  const [bgColor, setBgColor] = useState('#3C3F42');\n\n  useEffect(() => {\n    if (headerRef.current) {\n      const computedStyle = window.getComputedStyle(headerRef.current);\n      const baseColor = computedStyle.backgroundColor;\n      setBgColor(lighten(baseColor, 0.2));\n    }\n  }, []);\n\n  useEffect(() => {\n    const container = document.getElementById('global-header');\n    if (container) {\n      const computedStyle = window.getComputedStyle(container);\n      const baseColor = computedStyle.backgroundColor;\n      setBgColor(lighten(baseColor, 0.2));\n    }\n  }, []);\n\n  useEffect(() => {\n    const fetchUserEntity = async () => {\n      let userProfile;\n      try {\n        if (backstageIdentity?.userEntityRef) {\n          userProfile = (await catalogApi.getEntityByRef(\n            backstageIdentity.userEntityRef,\n          )) as unknown as UserEntity;\n        }\n        setUser(\n          userProfile?.spec?.profile?.displayName ??\n            userProfile?.metadata?.title,\n        );\n      } catch (_err) {\n        setUser(null);\n      }\n    };\n\n    fetchUserEntity();\n  }, [backstageIdentity, catalogApi]);\n\n  const menuItems = useMemo(() => {\n    return (profileDropdownMountPoints ?? [])\n      .map(mp => ({\n        Component: mp.Component,\n        icon: mp.config?.props?.icon ?? '',\n        label: mp.config?.props?.title ?? '',\n        link: mp.config?.props?.link ?? '',\n        priority: mp.config?.priority ?? 0,\n      }))\n      .sort((a, b) => (b.priority ?? 0) - (a.priority ?? 0));\n  }, [profileDropdownMountPoints]);\n\n  if (menuItems.length === 0) {\n    return null;\n  }\n\n  const profileDisplayName = () => {\n    const name = user ?? displayName;\n    const regex = /^[^:/]+:[^/]+\\/[^/]+$/;\n    if (regex.test(name)) {\n      return name\n        .charAt(name.indexOf('/') + 1)\n        .toLocaleUpperCase('en-US')\n        .concat(name.substring(name.indexOf('/') + 2));\n    }\n    return name;\n  };\n\n  return (\n    <HeaderDropdownComponent\n      buttonContent={\n        <Box sx={{ display: 'flex', alignItems: 'center', ...layout }}>\n          {!profileLoading && (\n            <>\n              {profile.picture ? (\n                <Avatar\n                  src={profile.picture}\n                  sx={{ mr: 2, height: '32px', width: '32px' }}\n                  alt=\"Profile picture\"\n                />\n              ) : (\n                <AccountCircleOutlinedIcon fontSize=\"small\" sx={{ mr: 1 }} />\n              )}\n              <Typography\n                variant=\"body2\"\n                sx={{\n                  display: { xs: 'none', md: 'block' },\n                  fontWeight: 500,\n                  mr: '1rem',\n                }}\n              >\n                {profileDisplayName()}\n              </Typography>\n            </>\n          )}\n          <KeyboardArrowDownOutlinedIcon\n            sx={{\n              bgcolor: bgColor,\n              borderRadius: '25%',\n            }}\n          />\n        </Box>\n      }\n      buttonProps={{\n        color: 'inherit',\n        sx: {\n          display: 'flex',\n          alignItems: 'center',\n        },\n      }}\n      onOpen={handleOpen}\n      onClose={handleClose}\n      anchorEl={anchorEl}\n    >\n      <MenuSection hideDivider items={menuItems} handleClose={handleClose} />\n    </HeaderDropdownComponent>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/HeaderDropdownComponent/RegisterAComponentSection.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { MenuSection } from './MenuSection.esm.js';
 import { MenuItemLink } from '../MenuItemLink/MenuItemLink.esm.js';
 
@@ -6,7 +6,7 @@ const RegisterAComponentSection = ({
   hideDivider,
   handleClose
 }) => {
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     MenuSection,
     {
       hideDivider,

package/dist/components/HeaderDropdownComponent/RegisterAComponentSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"RegisterAComponentSection.esm.js","sources":["../../../src/components/HeaderDropdownComponent/RegisterAComponentSection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport { MenuSection } from './MenuSection';\nimport { MenuItemLink } from '../MenuItemLink/MenuItemLink';\n\n/**\n * Register A Component Section properties\n *\n * @public\n */\nexport type RegisterAComponentSectionProps = {\n  hideDivider: boolean;\n  handleClose: () => void;\n};\n\nexport const RegisterAComponentSection = ({\n  hideDivider,\n  handleClose,\n}: RegisterAComponentSectionProps) => {\n  return (\n    <MenuSection\n      hideDivider={hideDivider}\n      items={[\n        {\n          label: 'Register a component',\n          subLabel: 'Import it to the catalog page',\n          link: '/catalog-import',\n          icon: 'category',\n          Component: MenuItemLink as React.ComponentType,\n        },\n      ]}\n      handleClose={handleClose}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;AA8BO,MAAM,4BAA4B,CAAC;AAAA,EACxC,WAAA;AAAA,EACA;AACF,CAAsC,KAAA;AACpC,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,KAAO,EAAA;AAAA,QACL;AAAA,UACE,KAAO,EAAA,sBAAA;AAAA,UACP,QAAU,EAAA,+BAAA;AAAA,UACV,IAAM,EAAA,iBAAA;AAAA,UACN,IAAM,EAAA,UAAA;AAAA,UACN,SAAW,EAAA;AAAA;AACb,OACF;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"RegisterAComponentSection.esm.js","sources":["../../../src/components/HeaderDropdownComponent/RegisterAComponentSection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport type { ComponentType } from 'react';\nimport { MenuSection } from './MenuSection';\nimport { MenuItemLink } from '../MenuItemLink/MenuItemLink';\n\n/**\n * Register A Component Section properties\n *\n * @public\n */\nexport type RegisterAComponentSectionProps = {\n  hideDivider: boolean;\n  handleClose: () => void;\n};\n\nexport const RegisterAComponentSection = ({\n  hideDivider,\n  handleClose,\n}: RegisterAComponentSectionProps) => {\n  return (\n    <MenuSection\n      hideDivider={hideDivider}\n      items={[\n        {\n          label: 'Register a component',\n          subLabel: 'Import it to the catalog page',\n          link: '/catalog-import',\n          icon: 'category',\n          Component: MenuItemLink as ComponentType,\n        },\n      ]}\n      handleClose={handleClose}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;AA6BO,MAAM,4BAA4B,CAAC;AAAA,EACxC,WAAA;AAAA,EACA;AACF,CAAsC,KAAA;AACpC,EACE,uBAAA,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,KAAO,EAAA;AAAA,QACL;AAAA,UACE,KAAO,EAAA,sBAAA;AAAA,UACP,QAAU,EAAA,+BAAA;AAAA,UACV,IAAM,EAAA,iBAAA;AAAA,UACN,IAAM,EAAA,UAAA;AAAA,UACN,SAAW,EAAA;AAAA;AACb,OACF;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/HeaderDropdownComponent/SoftwareTemplatesSection.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useEffect, useMemo } from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
+import { useState, useEffect, useMemo } from 'react';
 import { useApi } from '@backstage/core-plugin-api';
 import { catalogApiRef } from '@backstage/plugin-catalog-react';
 import Box from '@mui/material/Box';
@@ -39,19 +40,22 @@ const SoftwareTemplatesSection = ({
     }));
   }, [entities]);
   if (error) {
-    return /* @__PURE__ */ React.createElement(Box, { display: "flex", justifyContent: "center", alignItems: "center", p: 2 }, /* @__PURE__ */ React.createElement(Typography, { variant: "body1", color: "error" }, "Error fetching templates"));
+    return /* @__PURE__ */ jsx(Box, { display: "flex", justifyContent: "center", alignItems: "center", p: 2, children: /* @__PURE__ */ jsx(Typography, { variant: "body1", color: "error", children: "Error fetching templates" }) });
   }
   if (items.length === 0) {
-    return /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-      Typography,
-      {
-        variant: "body2",
-        sx: { mx: 2, my: 1, color: "text.disabled" }
-      },
-      "No templates available"
-    ), !hideDivider && /* @__PURE__ */ React.createElement(Divider, { sx: { my: 0.5 } }));
+    return /* @__PURE__ */ jsxs(Fragment, { children: [
+      /* @__PURE__ */ jsx(
+        Typography,
+        {
+          variant: "body2",
+          sx: { mx: 2, my: 1, color: "text.disabled" },
+          children: "No templates available"
+        }
+      ),
+      !hideDivider && /* @__PURE__ */ jsx(Divider, { sx: { my: 0.5 } })
+    ] });
   }
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     MenuSection,
     {
       hideDivider,

package/dist/components/HeaderDropdownComponent/SoftwareTemplatesSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SoftwareTemplatesSection.esm.js","sources":["../../../src/components/HeaderDropdownComponent/SoftwareTemplatesSection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React, { useEffect, useMemo, useState } from 'react';\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\n\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\nimport Typography from '@mui/material/Typography';\n\nimport { MenuSection } from './MenuSection';\nimport { MenuItemLink } from '../MenuItemLink/MenuItemLink';\n\n/**\n * Software Templates Section properties\n *\n * @public\n */\nexport type SoftwareTemplatesSectionProps = {\n  handleClose: () => void;\n  hideDivider?: boolean;\n};\n\nexport const SoftwareTemplatesSection = ({\n  handleClose,\n  hideDivider,\n}: SoftwareTemplatesSectionProps) => {\n  const catalogApi = useApi(catalogApiRef);\n\n  const [entities, setEntities] = useState<Entity[]>([]);\n  // TODO: handle loading\n  const [_loading, setLoading] = useState(true);\n  const [error, setError] = useState(null);\n\n  useEffect(() => {\n    const fetchEntities = async () => {\n      try {\n        const response = await catalogApi.getEntities({\n          filter: { kind: ['Template'] },\n          limit: 7,\n        });\n        setEntities(response.items);\n      } catch (err) {\n        setError(err);\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    fetchEntities();\n  }, [catalogApi]);\n\n  const items = useMemo(() => {\n    return entities\n      .filter(e => e.kind === 'Template')\n      .map(m => ({\n        Component: MenuItemLink as React.ComponentType,\n        label: m.metadata.title ?? m.metadata.name,\n        link: `/create/templates/default/${m.metadata.name}`,\n      }));\n  }, [entities]);\n\n  if (error) {\n    return (\n      <Box display=\"flex\" justifyContent=\"center\" alignItems=\"center\" p={2}>\n        <Typography variant=\"body1\" color=\"error\">\n          Error fetching templates\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <>\n        <Typography\n          variant=\"body2\"\n          sx={{ mx: 2, my: 1, color: 'text.disabled' }}\n        >\n          No templates available\n        </Typography>\n        {!hideDivider && <Divider sx={{ my: 0.5 }} />}\n      </>\n    );\n  }\n  return (\n    <MenuSection\n      hideDivider={hideDivider}\n      sectionLabel=\"Use a template\"\n      optionalLink=\"/create\"\n      optionalLinkLabel=\"All templates\"\n      items={items}\n      handleClose={handleClose}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAuCO,MAAM,2BAA2B,CAAC;AAAA,EACvC,WAAA;AAAA,EACA;AACF,CAAqC,KAAA;AACnC,EAAM,MAAA,UAAA,GAAa,OAAO,aAAa,CAAA;AAEvC,EAAA,MAAM,CAAC,QAAU,EAAA,WAAW,CAAI,GAAA,QAAA,CAAmB,EAAE,CAAA;AAErD,EAAA,MAAM,CAAC,QAAA,EAAU,UAAU,CAAA,GAAI,SAAS,IAAI,CAAA;AAC5C,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,IAAI,CAAA;AAEvC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,gBAAgB,YAAY;AAChC,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,UAAA,CAAW,WAAY,CAAA;AAAA,UAC5C,MAAQ,EAAA,EAAE,IAAM,EAAA,CAAC,UAAU,CAAE,EAAA;AAAA,UAC7B,KAAO,EAAA;AAAA,SACR,CAAA;AACD,QAAA,WAAA,CAAY,SAAS,KAAK,CAAA;AAAA,eACnB,GAAK,EAAA;AACZ,QAAA,QAAA,CAAS,GAAG,CAAA;AAAA,OACZ,SAAA;AACA,QAAA,UAAA,CAAW,KAAK,CAAA;AAAA;AAClB,KACF;AAEA,IAAc,aAAA,EAAA;AAAA,GAChB,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAM,MAAA,KAAA,GAAQ,QAAQ,MAAM;AAC1B,IAAO,OAAA,QAAA,CACJ,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CACjC,IAAI,CAAM,CAAA,MAAA;AAAA,MACT,SAAW,EAAA,YAAA;AAAA,MACX,KAAO,EAAA,CAAA,CAAE,QAAS,CAAA,KAAA,IAAS,EAAE,QAAS,CAAA,IAAA;AAAA,MACtC,IAAM,EAAA,CAAA,0BAAA,EAA6B,CAAE,CAAA,QAAA,CAAS,IAAI,CAAA;AAAA,KAClD,CAAA,CAAA;AAAA,GACN,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,2CACG,GAAI,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,cAAA,EAAe,UAAS,UAAW,EAAA,QAAA,EAAS,CAAG,EAAA,CAAA,EAAA,sCAChE,UAAW,EAAA,EAAA,OAAA,EAAQ,SAAQ,KAAM,EAAA,OAAA,EAAA,EAAQ,0BAE1C,CACF,CAAA;AAAA;AAIJ,EAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,IAAA,uBAEI,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,OAAA;AAAA,QACR,IAAI,EAAE,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAG,OAAO,eAAgB;AAAA,OAAA;AAAA,MAC5C;AAAA,KAED,EACC,CAAC,WAAA,oBAAgB,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,IAAI,EAAE,EAAA,EAAI,GAAI,EAAA,EAAG,CAC7C,CAAA;AAAA;AAGJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,YAAa,EAAA,gBAAA;AAAA,MACb,YAAa,EAAA,SAAA;AAAA,MACb,iBAAkB,EAAA,eAAA;AAAA,MAClB,KAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}
+{"version":3,"file":"SoftwareTemplatesSection.esm.js","sources":["../../../src/components/HeaderDropdownComponent/SoftwareTemplatesSection.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport { useEffect, useMemo, useState } from 'react';\nimport type { ComponentType } from 'react';\n\nimport { useApi } from '@backstage/core-plugin-api';\nimport { catalogApiRef } from '@backstage/plugin-catalog-react';\nimport { Entity } from '@backstage/catalog-model';\n\nimport Box from '@mui/material/Box';\nimport Divider from '@mui/material/Divider';\nimport Typography from '@mui/material/Typography';\n\nimport { MenuSection } from './MenuSection';\nimport { MenuItemLink } from '../MenuItemLink/MenuItemLink';\n\n/**\n * Software Templates Section properties\n *\n * @public\n */\nexport type SoftwareTemplatesSectionProps = {\n  handleClose: () => void;\n  hideDivider?: boolean;\n};\n\nexport const SoftwareTemplatesSection = ({\n  handleClose,\n  hideDivider,\n}: SoftwareTemplatesSectionProps) => {\n  const catalogApi = useApi(catalogApiRef);\n\n  const [entities, setEntities] = useState<Entity[]>([]);\n  // TODO: handle loading\n  const [_loading, setLoading] = useState(true);\n  const [error, setError] = useState(null);\n\n  useEffect(() => {\n    const fetchEntities = async () => {\n      try {\n        const response = await catalogApi.getEntities({\n          filter: { kind: ['Template'] },\n          limit: 7,\n        });\n        setEntities(response.items);\n      } catch (err) {\n        setError(err);\n      } finally {\n        setLoading(false);\n      }\n    };\n\n    fetchEntities();\n  }, [catalogApi]);\n\n  const items = useMemo(() => {\n    return entities\n      .filter(e => e.kind === 'Template')\n      .map(m => ({\n        Component: MenuItemLink as ComponentType,\n        label: m.metadata.title ?? m.metadata.name,\n        link: `/create/templates/default/${m.metadata.name}`,\n      }));\n  }, [entities]);\n\n  if (error) {\n    return (\n      <Box display=\"flex\" justifyContent=\"center\" alignItems=\"center\" p={2}>\n        <Typography variant=\"body1\" color=\"error\">\n          Error fetching templates\n        </Typography>\n      </Box>\n    );\n  }\n\n  if (items.length === 0) {\n    return (\n      <>\n        <Typography\n          variant=\"body2\"\n          sx={{ mx: 2, my: 1, color: 'text.disabled' }}\n        >\n          No templates available\n        </Typography>\n        {!hideDivider && <Divider sx={{ my: 0.5 }} />}\n      </>\n    );\n  }\n  return (\n    <MenuSection\n      hideDivider={hideDivider}\n      sectionLabel=\"Use a template\"\n      optionalLink=\"/create\"\n      optionalLinkLabel=\"All templates\"\n      items={items}\n      handleClose={handleClose}\n    />\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;AAwCO,MAAM,2BAA2B,CAAC;AAAA,EACvC,WAAA;AAAA,EACA;AACF,CAAqC,KAAA;AACnC,EAAM,MAAA,UAAA,GAAa,OAAO,aAAa,CAAA;AAEvC,EAAA,MAAM,CAAC,QAAU,EAAA,WAAW,CAAI,GAAA,QAAA,CAAmB,EAAE,CAAA;AAErD,EAAA,MAAM,CAAC,QAAA,EAAU,UAAU,CAAA,GAAI,SAAS,IAAI,CAAA;AAC5C,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAS,IAAI,CAAA;AAEvC,EAAA,SAAA,CAAU,MAAM;AACd,IAAA,MAAM,gBAAgB,YAAY;AAChC,MAAI,IAAA;AACF,QAAM,MAAA,QAAA,GAAW,MAAM,UAAA,CAAW,WAAY,CAAA;AAAA,UAC5C,MAAQ,EAAA,EAAE,IAAM,EAAA,CAAC,UAAU,CAAE,EAAA;AAAA,UAC7B,KAAO,EAAA;AAAA,SACR,CAAA;AACD,QAAA,WAAA,CAAY,SAAS,KAAK,CAAA;AAAA,eACnB,GAAK,EAAA;AACZ,QAAA,QAAA,CAAS,GAAG,CAAA;AAAA,OACZ,SAAA;AACA,QAAA,UAAA,CAAW,KAAK,CAAA;AAAA;AAClB,KACF;AAEA,IAAc,aAAA,EAAA;AAAA,GAChB,EAAG,CAAC,UAAU,CAAC,CAAA;AAEf,EAAM,MAAA,KAAA,GAAQ,QAAQ,MAAM;AAC1B,IAAO,OAAA,QAAA,CACJ,OAAO,CAAK,CAAA,KAAA,CAAA,CAAE,SAAS,UAAU,CAAA,CACjC,IAAI,CAAM,CAAA,MAAA;AAAA,MACT,SAAW,EAAA,YAAA;AAAA,MACX,KAAO,EAAA,CAAA,CAAE,QAAS,CAAA,KAAA,IAAS,EAAE,QAAS,CAAA,IAAA;AAAA,MACtC,IAAM,EAAA,CAAA,0BAAA,EAA6B,CAAE,CAAA,QAAA,CAAS,IAAI,CAAA;AAAA,KAClD,CAAA,CAAA;AAAA,GACN,EAAG,CAAC,QAAQ,CAAC,CAAA;AAEb,EAAA,IAAI,KAAO,EAAA;AACT,IAAA,2BACG,GAAI,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,cAAA,EAAe,UAAS,UAAW,EAAA,QAAA,EAAS,CAAG,EAAA,CAAA,EACjE,8BAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,SAAQ,KAAM,EAAA,OAAA,EAAQ,sCAE1C,CACF,EAAA,CAAA;AAAA;AAIJ,EAAI,IAAA,KAAA,CAAM,WAAW,CAAG,EAAA;AACtB,IAAA,uBAEI,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,sBAAA,GAAA;AAAA,QAAC,UAAA;AAAA,QAAA;AAAA,UACC,OAAQ,EAAA,OAAA;AAAA,UACR,IAAI,EAAE,EAAA,EAAI,GAAG,EAAI,EAAA,CAAA,EAAG,OAAO,eAAgB,EAAA;AAAA,UAC5C,QAAA,EAAA;AAAA;AAAA,OAED;AAAA,MACC,CAAC,+BAAgB,GAAA,CAAA,OAAA,EAAA,EAAQ,IAAI,EAAE,EAAA,EAAI,KAAO,EAAA;AAAA,KAC7C,EAAA,CAAA;AAAA;AAGJ,EACE,uBAAA,GAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,WAAA;AAAA,MACA,YAAa,EAAA,gBAAA;AAAA,MACb,YAAa,EAAA,SAAA;AAAA,MACb,iBAAkB,EAAA,eAAA;AAAA,MAClB,KAAA;AAAA,MACA;AAAA;AAAA,GACF;AAEJ;;;;"}

package/dist/components/HeaderDropdownComponent/StarredDropdown.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { useStarredEntities, useEntityPresentation } from '@backstage/plugin-catalog-react';
 import { Link } from '@backstage/core-components';
 import { parseEntityRef } from '@backstage/catalog-model';
@@ -24,73 +24,78 @@ const StarredItem = ({
   const { Icon, primaryTitle, secondaryTitle } = useEntityPresentation(entityRef);
   const { name, kind, namespace } = parseEntityRef(entityRef);
   const theme = useTheme();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     MenuItem,
     {
       component: Link,
       to: `/catalog/${namespace || "default"}/${kind}/${name}`,
       onClick: handleClose,
       disableRipple: true,
-      disableTouchRipple: true
-    },
-    Icon && /* @__PURE__ */ React.createElement(ListItemIcon, { sx: { minWidth: 36 } }, /* @__PURE__ */ React.createElement(Icon, null)),
-    /* @__PURE__ */ React.createElement(
-      ListItemText,
-      {
-        primary: /* @__PURE__ */ React.createElement(Typography, { sx: { color: theme.palette.text.primary } }, primaryTitle || secondaryTitle),
-        secondary: kind.toLocaleUpperCase(),
-        sx: { ml: 1, mr: 1 }
-      }
-    ),
-    /* @__PURE__ */ React.createElement(Tooltip, { title: "Remove from list" }, /* @__PURE__ */ React.createElement(
-      IconButton,
-      {
-        onClick: (e) => {
-          e.preventDefault();
-          e.stopPropagation();
-          toggleStarredEntity(entityRef);
-        }
-      },
-      /* @__PURE__ */ React.createElement(Star, { color: "warning" })
-    ))
+      disableTouchRipple: true,
+      children: [
+        Icon && /* @__PURE__ */ jsx(ListItemIcon, { sx: { minWidth: 36 }, children: /* @__PURE__ */ jsx(Icon, {}) }),
+        /* @__PURE__ */ jsx(
+          ListItemText,
+          {
+            primary: /* @__PURE__ */ jsx(Typography, { sx: { color: theme.palette.text.primary }, children: primaryTitle || secondaryTitle }),
+            secondary: kind.toLocaleUpperCase(),
+            sx: { ml: 1, mr: 1 }
+          }
+        ),
+        /* @__PURE__ */ jsx(Tooltip, { title: "Remove from list", children: /* @__PURE__ */ jsx(
+          IconButton,
+          {
+            onClick: (e) => {
+              e.preventDefault();
+              e.stopPropagation();
+              toggleStarredEntity(entityRef);
+            },
+            children: /* @__PURE__ */ jsx(Star, { color: "warning" })
+          }
+        ) })
+      ]
+    }
   );
 };
 const StarredDropdown = () => {
   const { anchorEl, handleOpen, handleClose } = useDropdownManager();
   const { starredEntities, toggleStarredEntity } = useStarredEntities();
   const entitiesArray = Array.from(starredEntities);
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     HeaderDropdownComponent,
     {
-      buttonContent: /* @__PURE__ */ React.createElement(StarBorderIcon, null),
+      buttonContent: /* @__PURE__ */ jsx(StarBorderIcon, {}),
       onOpen: handleOpen,
       onClose: handleClose,
       anchorEl,
       tooltip: "Your starred items",
-      isIconButton: true
-    },
-    entitiesArray.length > 0 ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(
-      ListItemText,
-      {
-        primary: "Your starred items",
-        sx: { pl: 2, mt: 1, fontWeight: "bold", color: "text.secondary" }
-      }
-    ), entitiesArray.map((enitityRef) => /* @__PURE__ */ React.createElement(
-      StarredItem,
-      {
-        key: enitityRef,
-        entityRef: enitityRef,
-        toggleStarredEntity,
-        handleClose
-      }
-    ))) : /* @__PURE__ */ React.createElement(
-      DropdownEmptyState,
-      {
-        title: "No starred items yet",
-        subTitle: "Click the star icon next to an entity's name to save it here for quick access.",
-        icon: /* @__PURE__ */ React.createElement(AutoAwesomeIcon, { sx: { fontSize: 64 }, color: "disabled" })
-      }
-    )
+      isIconButton: true,
+      children: entitiesArray.length > 0 ? /* @__PURE__ */ jsxs(Fragment, { children: [
+        /* @__PURE__ */ jsx(
+          ListItemText,
+          {
+            primary: "Your starred items",
+            sx: { pl: 2, mt: 1, fontWeight: "bold", color: "text.secondary" }
+          }
+        ),
+        entitiesArray.map((enitityRef) => /* @__PURE__ */ jsx(
+          StarredItem,
+          {
+            entityRef: enitityRef,
+            toggleStarredEntity,
+            handleClose
+          },
+          enitityRef
+        ))
+      ] }) : /* @__PURE__ */ jsx(
+        DropdownEmptyState,
+        {
+          title: "No starred items yet",
+          subTitle: "Click the star icon next to an entity's name to save it here for quick access.",
+          icon: /* @__PURE__ */ jsx(AutoAwesomeIcon, { sx: { fontSize: 64 }, color: "disabled" })
+        }
+      )
+    }
   );
 };
 

package/dist/components/HeaderDropdownComponent/StarredDropdown.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"StarredDropdown.esm.js","sources":["../../../src/components/HeaderDropdownComponent/StarredDropdown.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport {\n  useEntityPresentation,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { Link } from '@backstage/core-components';\nimport {\n  CompoundEntityRef,\n  Entity,\n  parseEntityRef,\n} from '@backstage/catalog-model';\nimport StarBorderIcon from '@mui/icons-material/StarBorder';\nimport Star from '@mui/icons-material/Star';\nimport AutoAwesomeIcon from '@mui/icons-material/AutoAwesome';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\n\nimport { useTheme } from '@mui/material/styles';\nimport MenuItem from '@mui/material/MenuItem';\nimport Typography from '@mui/material/Typography';\nimport IconButton from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\n\nimport { useDropdownManager } from '../../hooks';\nimport { HeaderDropdownComponent } from './HeaderDropdownComponent';\nimport { DropdownEmptyState } from './DropdownEmptyState';\n\n/**\n * @public\n * Props for each starred entitify item\n */\ninterface SectionComponentProps {\n  entityRef: string | CompoundEntityRef | Entity;\n  toggleStarredEntity: (\n    entityOrRef: Entity | CompoundEntityRef | string,\n  ) => void;\n  handleClose: () => void;\n}\n\nconst StarredItem: React.FC<SectionComponentProps> = ({\n  entityRef,\n  toggleStarredEntity,\n  handleClose,\n}) => {\n  const { Icon, primaryTitle, secondaryTitle } =\n    useEntityPresentation(entityRef);\n  const { name, kind, namespace } = parseEntityRef(entityRef as string);\n  const theme = useTheme();\n\n  return (\n    <MenuItem\n      component={Link}\n      to={`/catalog/${namespace || 'default'}/${kind}/${name}`}\n      onClick={handleClose}\n      disableRipple\n      disableTouchRipple\n    >\n      {Icon && (\n        <ListItemIcon sx={{ minWidth: 36 }}>\n          <Icon />\n        </ListItemIcon>\n      )}\n      <ListItemText\n        primary={\n          <Typography sx={{ color: theme.palette.text.primary }}>\n            {primaryTitle || secondaryTitle}\n          </Typography>\n        }\n        secondary={kind.toLocaleUpperCase()}\n        // inset={!Icon}\n        sx={{ ml: 1, mr: 1 }}\n      />\n      <Tooltip title=\"Remove from list\">\n        <IconButton\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            toggleStarredEntity(entityRef);\n          }}\n        >\n          <Star color=\"warning\" />\n        </IconButton>\n      </Tooltip>\n    </MenuItem>\n  );\n};\n\nexport const StarredDropdown = () => {\n  const { anchorEl, handleOpen, handleClose } = useDropdownManager();\n  const { starredEntities, toggleStarredEntity } = useStarredEntities();\n\n  const entitiesArray = Array.from(starredEntities);\n\n  return (\n    <HeaderDropdownComponent\n      buttonContent={<StarBorderIcon />}\n      onOpen={handleOpen}\n      onClose={handleClose}\n      anchorEl={anchorEl}\n      tooltip=\"Your starred items\"\n      isIconButton\n    >\n      {entitiesArray.length > 0 ? (\n        <>\n          <ListItemText\n            primary=\"Your starred items\"\n            sx={{ pl: 2, mt: 1, fontWeight: 'bold', color: 'text.secondary' }}\n          />\n          {entitiesArray.map(enitityRef => (\n            <StarredItem\n              key={enitityRef}\n              entityRef={enitityRef}\n              toggleStarredEntity={toggleStarredEntity}\n              handleClose={handleClose}\n            />\n          ))}\n        </>\n      ) : (\n        <DropdownEmptyState\n          title=\"No starred items yet\"\n          subTitle=\"Click the star icon next to an entity's name to save it here for quick access.\"\n          icon={<AutoAwesomeIcon sx={{ fontSize: 64 }} color=\"disabled\" />}\n        />\n      )}\n    </HeaderDropdownComponent>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;AAwDA,MAAM,cAA+C,CAAC;AAAA,EACpD,SAAA;AAAA,EACA,mBAAA;AAAA,EACA;AACF,CAAM,KAAA;AACJ,EAAA,MAAM,EAAE,IAAM,EAAA,YAAA,EAAc,cAAe,EAAA,GACzC,sBAAsB,SAAS,CAAA;AACjC,EAAA,MAAM,EAAE,IAAM,EAAA,IAAA,EAAM,SAAU,EAAA,GAAI,eAAe,SAAmB,CAAA;AACpE,EAAA,MAAM,QAAQ,QAAS,EAAA;AAEvB,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,MACX,IAAI,CAAY,SAAA,EAAA,SAAA,IAAa,SAAS,CAAI,CAAA,EAAA,IAAI,IAAI,IAAI,CAAA,CAAA;AAAA,MACtD,OAAS,EAAA,WAAA;AAAA,MACT,aAAa,EAAA,IAAA;AAAA,MACb,kBAAkB,EAAA;AAAA,KAAA;AAAA,IAEjB,IAAA,oBACE,KAAA,CAAA,aAAA,CAAA,YAAA,EAAA,EAAa,EAAI,EAAA,EAAE,UAAU,EAAG,EAAA,EAAA,kBAC9B,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,IAAK,CACR,CAAA;AAAA,oBAEF,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,OACE,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,EAAA,EAAI,EAAE,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA,EACzC,EAAA,EAAA,YAAA,IAAgB,cACnB,CAAA;AAAA,QAEF,SAAA,EAAW,KAAK,iBAAkB,EAAA;AAAA,QAElC,EAAI,EAAA,EAAE,EAAI,EAAA,CAAA,EAAG,IAAI,CAAE;AAAA;AAAA,KACrB;AAAA,oBACA,KAAA,CAAA,aAAA,CAAC,OAAQ,EAAA,EAAA,KAAA,EAAM,kBACb,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,SAAS,CAAK,CAAA,KAAA;AACZ,UAAA,CAAA,CAAE,cAAe,EAAA;AACjB,UAAA,CAAA,CAAE,eAAgB,EAAA;AAClB,UAAA,mBAAA,CAAoB,SAAS,CAAA;AAAA;AAC/B,OAAA;AAAA,sBAEA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,KAAA,EAAM,SAAU,EAAA;AAAA,KAE1B;AAAA,GACF;AAEJ,CAAA;AAEO,MAAM,kBAAkB,MAAM;AACnC,EAAA,MAAM,EAAE,QAAA,EAAU,UAAY,EAAA,WAAA,KAAgB,kBAAmB,EAAA;AACjE,EAAA,MAAM,EAAE,eAAA,EAAiB,mBAAoB,EAAA,GAAI,kBAAmB,EAAA;AAEpE,EAAM,MAAA,aAAA,GAAgB,KAAM,CAAA,IAAA,CAAK,eAAe,CAAA;AAEhD,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,uBAAA;AAAA,IAAA;AAAA,MACC,aAAA,sCAAgB,cAAe,EAAA,IAAA,CAAA;AAAA,MAC/B,MAAQ,EAAA,UAAA;AAAA,MACR,OAAS,EAAA,WAAA;AAAA,MACT,QAAA;AAAA,MACA,OAAQ,EAAA,oBAAA;AAAA,MACR,YAAY,EAAA;AAAA,KAAA;AAAA,IAEX,aAAA,CAAc,MAAS,GAAA,CAAA,mBAEpB,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,OAAQ,EAAA,oBAAA;AAAA,QACR,EAAA,EAAI,EAAE,EAAI,EAAA,CAAA,EAAG,IAAI,CAAG,EAAA,UAAA,EAAY,MAAQ,EAAA,KAAA,EAAO,gBAAiB;AAAA;AAAA,KAClE,EACC,aAAc,CAAA,GAAA,CAAI,CACjB,UAAA,qBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,WAAA;AAAA,MAAA;AAAA,QACC,GAAK,EAAA,UAAA;AAAA,QACL,SAAW,EAAA,UAAA;AAAA,QACX,mBAAA;AAAA,QACA;AAAA;AAAA,KAEH,CACH,CAEA,mBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,kBAAA;AAAA,MAAA;AAAA,QACC,KAAM,EAAA,sBAAA;AAAA,QACN,QAAS,EAAA,gFAAA;AAAA,QACT,IAAA,sCAAO,eAAgB,EAAA,EAAA,EAAA,EAAI,EAAE,QAAU,EAAA,EAAA,EAAM,EAAA,KAAA,EAAM,UAAW,EAAA;AAAA;AAAA;AAChE,GAEJ;AAEJ;;;;"}
+{"version":3,"file":"StarredDropdown.esm.js","sources":["../../../src/components/HeaderDropdownComponent/StarredDropdown.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { FC } from 'react';\nimport {\n  useEntityPresentation,\n  useStarredEntities,\n} from '@backstage/plugin-catalog-react';\nimport { Link } from '@backstage/core-components';\nimport {\n  CompoundEntityRef,\n  Entity,\n  parseEntityRef,\n} from '@backstage/catalog-model';\nimport StarBorderIcon from '@mui/icons-material/StarBorder';\nimport Star from '@mui/icons-material/Star';\nimport AutoAwesomeIcon from '@mui/icons-material/AutoAwesome';\nimport ListItemIcon from '@mui/material/ListItemIcon';\nimport ListItemText from '@mui/material/ListItemText';\n\nimport { useTheme } from '@mui/material/styles';\nimport MenuItem from '@mui/material/MenuItem';\nimport Typography from '@mui/material/Typography';\nimport IconButton from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\n\nimport { useDropdownManager } from '../../hooks';\nimport { HeaderDropdownComponent } from './HeaderDropdownComponent';\nimport { DropdownEmptyState } from './DropdownEmptyState';\n\n/**\n * @public\n * Props for each starred entitify item\n */\ninterface SectionComponentProps {\n  entityRef: string | CompoundEntityRef | Entity;\n  toggleStarredEntity: (\n    entityOrRef: Entity | CompoundEntityRef | string,\n  ) => void;\n  handleClose: () => void;\n}\n\nconst StarredItem: FC<SectionComponentProps> = ({\n  entityRef,\n  toggleStarredEntity,\n  handleClose,\n}) => {\n  const { Icon, primaryTitle, secondaryTitle } =\n    useEntityPresentation(entityRef);\n  const { name, kind, namespace } = parseEntityRef(entityRef as string);\n  const theme = useTheme();\n\n  return (\n    <MenuItem\n      component={Link}\n      to={`/catalog/${namespace || 'default'}/${kind}/${name}`}\n      onClick={handleClose}\n      disableRipple\n      disableTouchRipple\n    >\n      {Icon && (\n        <ListItemIcon sx={{ minWidth: 36 }}>\n          <Icon />\n        </ListItemIcon>\n      )}\n      <ListItemText\n        primary={\n          <Typography sx={{ color: theme.palette.text.primary }}>\n            {primaryTitle || secondaryTitle}\n          </Typography>\n        }\n        secondary={kind.toLocaleUpperCase()}\n        // inset={!Icon}\n        sx={{ ml: 1, mr: 1 }}\n      />\n      <Tooltip title=\"Remove from list\">\n        <IconButton\n          onClick={e => {\n            e.preventDefault();\n            e.stopPropagation();\n            toggleStarredEntity(entityRef);\n          }}\n        >\n          <Star color=\"warning\" />\n        </IconButton>\n      </Tooltip>\n    </MenuItem>\n  );\n};\n\nexport const StarredDropdown = () => {\n  const { anchorEl, handleOpen, handleClose } = useDropdownManager();\n  const { starredEntities, toggleStarredEntity } = useStarredEntities();\n\n  const entitiesArray = Array.from(starredEntities);\n\n  return (\n    <HeaderDropdownComponent\n      buttonContent={<StarBorderIcon />}\n      onOpen={handleOpen}\n      onClose={handleClose}\n      anchorEl={anchorEl}\n      tooltip=\"Your starred items\"\n      isIconButton\n    >\n      {entitiesArray.length > 0 ? (\n        <>\n          <ListItemText\n            primary=\"Your starred items\"\n            sx={{ pl: 2, mt: 1, fontWeight: 'bold', color: 'text.secondary' }}\n          />\n          {entitiesArray.map(enitityRef => (\n            <StarredItem\n              key={enitityRef}\n              entityRef={enitityRef}\n              toggleStarredEntity={toggleStarredEntity}\n              handleClose={handleClose}\n            />\n          ))}\n        </>\n      ) : (\n        <DropdownEmptyState\n          title=\"No starred items yet\"\n          subTitle=\"Click the star icon next to an entity's name to save it here for quick access.\"\n          icon={<AutoAwesomeIcon sx={{ fontSize: 64 }} color=\"disabled\" />}\n        />\n      )}\n    </HeaderDropdownComponent>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/HeaderIcon/HeaderIcon.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { useApp } from '@backstage/core-plugin-api';
 import MuiIcon from '@mui/material/Icon';
 import Box from '@mui/material/Box';
@@ -14,31 +14,31 @@ const HeaderIcon = ({
   }
   const SystemIcon = app.getSystemIcon(icon);
   if (SystemIcon) {
-    return /* @__PURE__ */ React.createElement(Box, { sx: { display: "flex", alignItems: "center", ...layout } }, /* @__PURE__ */ React.createElement(SystemIcon, { fontSize: size }));
+    return /* @__PURE__ */ jsx(Box, { sx: { display: "flex", alignItems: "center", ...layout }, children: /* @__PURE__ */ jsx(SystemIcon, { fontSize: size }) });
   }
   if (icon.startsWith("<svg")) {
     const svgDataUri = `data:image/svg+xml;base64,${btoa(icon)}`;
-    return /* @__PURE__ */ React.createElement(MuiIcon, { fontSize: size, sx: layout }, /* @__PURE__ */ React.createElement("img", { src: svgDataUri, alt: "" }));
+    return /* @__PURE__ */ jsx(MuiIcon, { fontSize: size, sx: layout, children: /* @__PURE__ */ jsx("img", { src: svgDataUri, alt: "" }) });
   }
   if (icon.startsWith("https://") || icon.startsWith("http://") || icon.startsWith("/")) {
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       MuiIcon,
       {
         fontSize: size,
         baseClassName: "material-icons-outlined",
-        sx: layout
-      },
-      /* @__PURE__ */ React.createElement("img", { src: icon, alt: "", height: "100%", width: "100%" })
+        sx: layout,
+        children: /* @__PURE__ */ jsx("img", { src: icon, alt: "", height: "100%", width: "100%" })
+      }
     );
   }
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     MuiIcon,
     {
       fontSize: size,
       baseClassName: "material-icons-outlined",
-      sx: layout
-    },
-    icon
+      sx: layout,
+      children: icon
+    }
   );
 };
 

package/dist/components/HeaderIcon/HeaderIcon.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderIcon.esm.js","sources":["../../../src/components/HeaderIcon/HeaderIcon.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport React from 'react';\nimport { useApp } from '@backstage/core-plugin-api';\nimport MuiIcon from '@mui/material/Icon';\nimport Box from '@mui/material/Box';\n\n/**\n * @public\n */\nexport interface HeaderIconProps {\n  icon: string;\n  size?: 'small' | 'medium' | 'large';\n  layout?: React.CSSProperties;\n}\n\n/**\n * @public\n */\nexport const HeaderIcon = ({\n  icon,\n  size = 'small',\n  layout,\n}: HeaderIconProps) => {\n  const app = useApp();\n  if (!icon) {\n    return null;\n  }\n\n  const SystemIcon = app.getSystemIcon(icon);\n  if (SystemIcon) {\n    return (\n      <Box sx={{ display: 'flex', alignItems: 'center', ...layout }}>\n        <SystemIcon fontSize={size} />\n      </Box>\n    );\n  }\n\n  if (icon.startsWith('<svg')) {\n    const svgDataUri = `data:image/svg+xml;base64,${btoa(icon)}`;\n    return (\n      <MuiIcon fontSize={size} sx={layout}>\n        <img src={svgDataUri} alt=\"\" />\n      </MuiIcon>\n    );\n  }\n\n  if (\n    icon.startsWith('https://') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('/')\n  ) {\n    return (\n      <MuiIcon\n        fontSize={size}\n        baseClassName=\"material-icons-outlined\"\n        sx={layout}\n      >\n        <img src={icon} alt=\"\" height=\"100%\" width=\"100%\" />\n      </MuiIcon>\n    );\n  }\n\n  return (\n    <MuiIcon\n      fontSize={size}\n      baseClassName=\"material-icons-outlined\"\n      sx={layout}\n    >\n      {icon}\n    </MuiIcon>\n  );\n};\n"],"names":[],"mappings":";;;;;AAgCO,MAAM,aAAa,CAAC;AAAA,EACzB,IAAA;AAAA,EACA,IAAO,GAAA,OAAA;AAAA,EACP;AACF,CAAuB,KAAA;AACrB,EAAA,MAAM,MAAM,MAAO,EAAA;AACnB,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAO,OAAA,IAAA;AAAA;AAGT,EAAM,MAAA,UAAA,GAAa,GAAI,CAAA,aAAA,CAAc,IAAI,CAAA;AACzC,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,uBACG,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,EAAI,EAAA,EAAE,SAAS,MAAQ,EAAA,UAAA,EAAY,QAAU,EAAA,GAAG,QACnD,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,QAAA,EAAU,MAAM,CAC9B,CAAA;AAAA;AAIJ,EAAI,IAAA,IAAA,CAAK,UAAW,CAAA,MAAM,CAAG,EAAA;AAC3B,IAAA,MAAM,UAAa,GAAA,CAAA,0BAAA,EAA6B,IAAK,CAAA,IAAI,CAAC,CAAA,CAAA;AAC1D,IAAA,uBACG,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,QAAU,EAAA,IAAA,EAAM,EAAI,EAAA,MAAA,EAAA,kBAC1B,KAAA,CAAA,aAAA,CAAA,KAAA,EAAA,EAAI,GAAK,EAAA,UAAA,EAAY,GAAI,EAAA,EAAA,EAAG,CAC/B,CAAA;AAAA;AAIJ,EACE,IAAA,IAAA,CAAK,UAAW,CAAA,UAAU,CAC1B,IAAA,IAAA,CAAK,UAAW,CAAA,SAAS,CACzB,IAAA,IAAA,CAAK,UAAW,CAAA,GAAG,CACnB,EAAA;AACA,IACE,uBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,IAAA;AAAA,QACV,aAAc,EAAA,yBAAA;AAAA,QACd,EAAI,EAAA;AAAA,OAAA;AAAA,sBAEJ,KAAA,CAAA,aAAA,CAAC,SAAI,GAAK,EAAA,IAAA,EAAM,KAAI,EAAG,EAAA,MAAA,EAAO,MAAO,EAAA,KAAA,EAAM,MAAO,EAAA;AAAA,KACpD;AAAA;AAIJ,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,QAAU,EAAA,IAAA;AAAA,MACV,aAAc,EAAA,yBAAA;AAAA,MACd,EAAI,EAAA;AAAA,KAAA;AAAA,IAEH;AAAA,GACH;AAEJ;;;;"}
+{"version":3,"file":"HeaderIcon.esm.js","sources":["../../../src/components/HeaderIcon/HeaderIcon.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\nimport type { CSSProperties } from 'react';\nimport { useApp } from '@backstage/core-plugin-api';\nimport MuiIcon from '@mui/material/Icon';\nimport Box from '@mui/material/Box';\n\n/**\n * @public\n */\nexport interface HeaderIconProps {\n  icon: string;\n  size?: 'small' | 'medium' | 'large';\n  layout?: CSSProperties;\n}\n\n/**\n * @public\n */\nexport const HeaderIcon = ({\n  icon,\n  size = 'small',\n  layout,\n}: HeaderIconProps) => {\n  const app = useApp();\n  if (!icon) {\n    return null;\n  }\n\n  const SystemIcon = app.getSystemIcon(icon);\n  if (SystemIcon) {\n    return (\n      <Box sx={{ display: 'flex', alignItems: 'center', ...layout }}>\n        <SystemIcon fontSize={size} />\n      </Box>\n    );\n  }\n\n  if (icon.startsWith('<svg')) {\n    const svgDataUri = `data:image/svg+xml;base64,${btoa(icon)}`;\n    return (\n      <MuiIcon fontSize={size} sx={layout}>\n        <img src={svgDataUri} alt=\"\" />\n      </MuiIcon>\n    );\n  }\n\n  if (\n    icon.startsWith('https://') ||\n    icon.startsWith('http://') ||\n    icon.startsWith('/')\n  ) {\n    return (\n      <MuiIcon\n        fontSize={size}\n        baseClassName=\"material-icons-outlined\"\n        sx={layout}\n      >\n        <img src={icon} alt=\"\" height=\"100%\" width=\"100%\" />\n      </MuiIcon>\n    );\n  }\n\n  return (\n    <MuiIcon\n      fontSize={size}\n      baseClassName=\"material-icons-outlined\"\n      sx={layout}\n    >\n      {icon}\n    </MuiIcon>\n  );\n};\n"],"names":[],"mappings":";;;;;AAgCO,MAAM,aAAa,CAAC;AAAA,EACzB,IAAA;AAAA,EACA,IAAO,GAAA,OAAA;AAAA,EACP;AACF,CAAuB,KAAA;AACrB,EAAA,MAAM,MAAM,MAAO,EAAA;AACnB,EAAA,IAAI,CAAC,IAAM,EAAA;AACT,IAAO,OAAA,IAAA;AAAA;AAGT,EAAM,MAAA,UAAA,GAAa,GAAI,CAAA,aAAA,CAAc,IAAI,CAAA;AACzC,EAAA,IAAI,UAAY,EAAA;AACd,IAAA,uBACG,GAAA,CAAA,GAAA,EAAA,EAAI,EAAI,EAAA,EAAE,SAAS,MAAQ,EAAA,UAAA,EAAY,QAAU,EAAA,GAAG,QACnD,EAAA,QAAA,kBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,QAAA,EAAU,MAAM,CAC9B,EAAA,CAAA;AAAA;AAIJ,EAAI,IAAA,IAAA,CAAK,UAAW,CAAA,MAAM,CAAG,EAAA;AAC3B,IAAA,MAAM,UAAa,GAAA,CAAA,0BAAA,EAA6B,IAAK,CAAA,IAAI,CAAC,CAAA,CAAA;AAC1D,IAAA,uBACG,GAAA,CAAA,OAAA,EAAA,EAAQ,QAAU,EAAA,IAAA,EAAM,EAAI,EAAA,MAAA,EAC3B,QAAC,kBAAA,GAAA,CAAA,KAAA,EAAA,EAAI,GAAK,EAAA,UAAA,EAAY,GAAI,EAAA,EAAA,EAAG,CAC/B,EAAA,CAAA;AAAA;AAIJ,EACE,IAAA,IAAA,CAAK,UAAW,CAAA,UAAU,CAC1B,IAAA,IAAA,CAAK,UAAW,CAAA,SAAS,CACzB,IAAA,IAAA,CAAK,UAAW,CAAA,GAAG,CACnB,EAAA;AACA,IACE,uBAAA,GAAA;AAAA,MAAC,OAAA;AAAA,MAAA;AAAA,QACC,QAAU,EAAA,IAAA;AAAA,QACV,aAAc,EAAA,yBAAA;AAAA,QACd,EAAI,EAAA,MAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,SAAI,GAAK,EAAA,IAAA,EAAM,KAAI,EAAG,EAAA,MAAA,EAAO,MAAO,EAAA,KAAA,EAAM,MAAO,EAAA;AAAA;AAAA,KACpD;AAAA;AAIJ,EACE,uBAAA,GAAA;AAAA,IAAC,OAAA;AAAA,IAAA;AAAA,MACC,QAAU,EAAA,IAAA;AAAA,MACV,aAAc,EAAA,yBAAA;AAAA,MACd,EAAI,EAAA,MAAA;AAAA,MAEH,QAAA,EAAA;AAAA;AAAA,GACH;AAEJ;;;;"}

package/dist/components/HeaderIconButton/HeaderIconButton.esm.js

@@ -1,11 +1,11 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { Link as Link$1 } from '@backstage/core-components';
 import Box from '@mui/material/Box';
 import IconButton from '@mui/material/IconButton';
 import Tooltip from '@mui/material/Tooltip';
 import { HeaderIcon } from '../HeaderIcon/HeaderIcon.esm.js';
 
-const Link = (props) => /* @__PURE__ */ React.createElement(Link$1, { ...props, color: "inherit", externalLinkIcon: false });
+const Link = (props) => /* @__PURE__ */ jsx(Link$1, { ...props, color: "inherit", externalLinkIcon: false });
 const HeaderIconButton = ({
   title,
   icon,
@@ -20,17 +20,17 @@ const HeaderIconButton = ({
     console.warn("HeaderIconButton has no title:", { icon, to });
   }
   const linkProps = { to };
-  return /* @__PURE__ */ React.createElement(Box, { sx: layout }, /* @__PURE__ */ React.createElement(Tooltip, { title: tooltip ?? title }, /* @__PURE__ */ React.createElement("div", null, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(Box, { sx: layout, children: /* @__PURE__ */ jsx(Tooltip, { title: tooltip ?? title, children: /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx(
     IconButton,
     {
       LinkComponent: Link,
       color,
       size,
       "aria-label": ariaLabel ?? title,
-      ...linkProps
-    },
-    /* @__PURE__ */ React.createElement(HeaderIcon, { icon, size })
-  ))));
+      ...linkProps,
+      children: /* @__PURE__ */ jsx(HeaderIcon, { icon, size })
+    }
+  ) }) }) });
 };
 
 export { HeaderIconButton };

package/dist/components/HeaderIconButton/HeaderIconButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"HeaderIconButton.esm.js","sources":["../../../src/components/HeaderIconButton/HeaderIconButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport { Link as BackstageLink } from '@backstage/core-components';\n\nimport Box from '@mui/material/Box';\nimport IconButton, { IconButtonProps } from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\n\nimport { HeaderIcon } from '../HeaderIcon/HeaderIcon';\n\n/**\n * @public\n */\nexport interface HeaderIconButtonProps {\n  title: string;\n  icon: string;\n  tooltip?: string;\n  color?: 'inherit' | 'primary' | 'secondary' | 'default';\n  size?: 'small' | 'medium' | 'large';\n  ariaLabel?: string;\n  to: string;\n  layout?: React.CSSProperties;\n}\n\n// Backstage Link automatically detects external links and emits analytic events.\nconst Link = (props: any) => (\n  <BackstageLink {...props} color=\"inherit\" externalLinkIcon={false} />\n);\n\nexport const HeaderIconButton = ({\n  title,\n  icon,\n  tooltip,\n  color = 'inherit',\n  size = 'small',\n  ariaLabel,\n  to,\n  layout,\n}: HeaderIconButtonProps) => {\n  if (!title) {\n    // eslint-disable-next-line no-console\n    console.warn('HeaderIconButton has no title:', { icon, to });\n  }\n\n  const linkProps = { to } as IconButtonProps;\n\n  return (\n    <Box sx={layout}>\n      <Tooltip title={tooltip ?? title}>\n        <div>\n          <IconButton\n            LinkComponent={Link}\n            color={color}\n            size={size}\n            aria-label={ariaLabel ?? title}\n            {...linkProps} // to={to} isn't supported\n          >\n            <HeaderIcon icon={icon} size={size} />\n          </IconButton>\n        </div>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":["BackstageLink"],"mappings":";;;;;;;AAyCA,MAAM,IAAA,GAAO,CAAC,KAAA,qBACX,KAAA,CAAA,aAAA,CAAAA,MAAA,EAAA,EAAe,GAAG,KAAO,EAAA,KAAA,EAAM,SAAU,EAAA,gBAAA,EAAkB,KAAO,EAAA,CAAA;AAG9D,MAAM,mBAAmB,CAAC;AAAA,EAC/B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAQ,GAAA,SAAA;AAAA,EACR,IAAO,GAAA,OAAA;AAAA,EACP,SAAA;AAAA,EACA,EAAA;AAAA,EACA;AACF,CAA6B,KAAA;AAC3B,EAAA,IAAI,CAAC,KAAO,EAAA;AAEV,IAAA,OAAA,CAAQ,IAAK,CAAA,gCAAA,EAAkC,EAAE,IAAA,EAAM,IAAI,CAAA;AAAA;AAG7D,EAAM,MAAA,SAAA,GAAY,EAAE,EAAG,EAAA;AAEvB,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,EAAA,EAAI,MACP,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,WAAQ,KAAO,EAAA,OAAA,IAAW,KACzB,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KACC,EAAA,IAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,aAAe,EAAA,IAAA;AAAA,MACf,KAAA;AAAA,MACA,IAAA;AAAA,MACA,cAAY,SAAa,IAAA,KAAA;AAAA,MACxB,GAAG;AAAA,KAAA;AAAA,oBAEJ,KAAA,CAAA,aAAA,CAAC,UAAW,EAAA,EAAA,IAAA,EAAY,IAAY,EAAA;AAAA,GAExC,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"HeaderIconButton.esm.js","sources":["../../../src/components/HeaderIconButton/HeaderIconButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport type { CSSProperties } from 'react';\nimport { Link as BackstageLink } from '@backstage/core-components';\n\nimport Box from '@mui/material/Box';\nimport IconButton, { IconButtonProps } from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\n\nimport { HeaderIcon } from '../HeaderIcon/HeaderIcon';\n\n/**\n * @public\n */\nexport interface HeaderIconButtonProps {\n  title: string;\n  icon: string;\n  tooltip?: string;\n  color?: 'inherit' | 'primary' | 'secondary' | 'default';\n  size?: 'small' | 'medium' | 'large';\n  ariaLabel?: string;\n  to: string;\n  layout?: CSSProperties;\n}\n\n// Backstage Link automatically detects external links and emits analytic events.\nconst Link = (props: any) => (\n  <BackstageLink {...props} color=\"inherit\" externalLinkIcon={false} />\n);\n\nexport const HeaderIconButton = ({\n  title,\n  icon,\n  tooltip,\n  color = 'inherit',\n  size = 'small',\n  ariaLabel,\n  to,\n  layout,\n}: HeaderIconButtonProps) => {\n  if (!title) {\n    // eslint-disable-next-line no-console\n    console.warn('HeaderIconButton has no title:', { icon, to });\n  }\n\n  const linkProps = { to } as IconButtonProps;\n\n  return (\n    <Box sx={layout}>\n      <Tooltip title={tooltip ?? title}>\n        <div>\n          <IconButton\n            LinkComponent={Link}\n            color={color}\n            size={size}\n            aria-label={ariaLabel ?? title}\n            {...linkProps} // to={to} isn't supported\n          >\n            <HeaderIcon icon={icon} size={size} />\n          </IconButton>\n        </div>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":["BackstageLink"],"mappings":";;;;;;;AAwCA,MAAM,IAAA,GAAO,CAAC,KAAA,qBACX,GAAA,CAAAA,MAAA,EAAA,EAAe,GAAG,KAAO,EAAA,KAAA,EAAM,SAAU,EAAA,gBAAA,EAAkB,KAAO,EAAA,CAAA;AAG9D,MAAM,mBAAmB,CAAC;AAAA,EAC/B,KAAA;AAAA,EACA,IAAA;AAAA,EACA,OAAA;AAAA,EACA,KAAQ,GAAA,SAAA;AAAA,EACR,IAAO,GAAA,OAAA;AAAA,EACP,SAAA;AAAA,EACA,EAAA;AAAA,EACA;AACF,CAA6B,KAAA;AAC3B,EAAA,IAAI,CAAC,KAAO,EAAA;AAEV,IAAA,OAAA,CAAQ,IAAK,CAAA,gCAAA,EAAkC,EAAE,IAAA,EAAM,IAAI,CAAA;AAAA;AAG7D,EAAM,MAAA,SAAA,GAAY,EAAE,EAAG,EAAA;AAEvB,EACE,uBAAA,GAAA,CAAC,GAAI,EAAA,EAAA,EAAA,EAAI,MACP,EAAA,QAAA,kBAAA,GAAA,CAAC,WAAQ,KAAO,EAAA,OAAA,IAAW,KACzB,EAAA,QAAA,kBAAA,GAAA,CAAC,KACC,EAAA,EAAA,QAAA,kBAAA,GAAA;AAAA,IAAC,UAAA;AAAA,IAAA;AAAA,MACC,aAAe,EAAA,IAAA;AAAA,MACf,KAAA;AAAA,MACA,IAAA;AAAA,MACA,cAAY,SAAa,IAAA,KAAA;AAAA,MACxB,GAAG,SAAA;AAAA,MAEJ,QAAA,kBAAA,GAAA,CAAC,UAAW,EAAA,EAAA,IAAA,EAAY,IAAY,EAAA;AAAA;AAAA,GACtC,EACF,GACF,CACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/LogoutButton/LogoutButton.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { useApi, errorApiRef, identityApiRef } from '@backstage/core-plugin-api';
 import MenuItem from '@mui/material/MenuItem';
 import { MenuItemLinkContent } from '../MenuItemLink/MenuItemLinkContent.esm.js';
@@ -9,13 +9,13 @@ const LogoutButton = () => {
   const handleLogout = () => {
     identityApi.signOut().catch((error) => errorApi.post(error));
   };
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     MenuItem,
     {
       onClick: handleLogout,
-      sx: { cursor: "pointer", width: "100%", color: "inherit" }
-    },
-    /* @__PURE__ */ React.createElement(MenuItemLinkContent, { icon: "logout", label: "Sign out" })
+      sx: { cursor: "pointer", width: "100%", color: "inherit" },
+      children: /* @__PURE__ */ jsx(MenuItemLinkContent, { icon: "logout", label: "Sign out" })
+    }
   );
 };
 

package/dist/components/LogoutButton/LogoutButton.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"LogoutButton.esm.js","sources":["../../../src/components/LogoutButton/LogoutButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\n\nimport {\n  errorApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\n\nimport MenuItem from '@mui/material/MenuItem';\n\nimport { MenuItemLinkContent } from '../MenuItemLink/MenuItemLinkContent';\n\nexport const LogoutButton = () => {\n  const errorApi = useApi(errorApiRef);\n  const identityApi = useApi(identityApiRef);\n\n  const handleLogout = () => {\n    identityApi.signOut().catch(error => errorApi.post(error));\n  };\n\n  return (\n    <MenuItem\n      onClick={handleLogout}\n      sx={{ cursor: 'pointer', width: '100%', color: 'inherit' }}\n    >\n      <MenuItemLinkContent icon=\"logout\" label=\"Sign out\" />\n    </MenuItem>\n  );\n};\n"],"names":[],"mappings":";;;;;AA4BO,MAAM,eAAe,MAAM;AAChC,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA;AACnC,EAAM,MAAA,WAAA,GAAc,OAAO,cAAc,CAAA;AAEzC,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,WAAS,QAAS,CAAA,IAAA,CAAK,KAAK,CAAC,CAAA;AAAA,GAC3D;AAEA,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,YAAA;AAAA,MACT,IAAI,EAAE,MAAA,EAAQ,WAAW,KAAO,EAAA,MAAA,EAAQ,OAAO,SAAU;AAAA,KAAA;AAAA,oBAExD,KAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,EAAoB,IAAK,EAAA,QAAA,EAAS,OAAM,UAAW,EAAA;AAAA,GACtD;AAEJ;;;;"}
+{"version":3,"file":"LogoutButton.esm.js","sources":["../../../src/components/LogoutButton/LogoutButton.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport {\n  errorApiRef,\n  identityApiRef,\n  useApi,\n} from '@backstage/core-plugin-api';\n\nimport MenuItem from '@mui/material/MenuItem';\n\nimport { MenuItemLinkContent } from '../MenuItemLink/MenuItemLinkContent';\n\nexport const LogoutButton = () => {\n  const errorApi = useApi(errorApiRef);\n  const identityApi = useApi(identityApiRef);\n\n  const handleLogout = () => {\n    identityApi.signOut().catch(error => errorApi.post(error));\n  };\n\n  return (\n    <MenuItem\n      onClick={handleLogout}\n      sx={{ cursor: 'pointer', width: '100%', color: 'inherit' }}\n    >\n      <MenuItemLinkContent icon=\"logout\" label=\"Sign out\" />\n    </MenuItem>\n  );\n};\n"],"names":[],"mappings":";;;;;AA0BO,MAAM,eAAe,MAAM;AAChC,EAAM,MAAA,QAAA,GAAW,OAAO,WAAW,CAAA;AACnC,EAAM,MAAA,WAAA,GAAc,OAAO,cAAc,CAAA;AAEzC,EAAA,MAAM,eAAe,MAAM;AACzB,IAAA,WAAA,CAAY,SAAU,CAAA,KAAA,CAAM,WAAS,QAAS,CAAA,IAAA,CAAK,KAAK,CAAC,CAAA;AAAA,GAC3D;AAEA,EACE,uBAAA,GAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,YAAA;AAAA,MACT,IAAI,EAAE,MAAA,EAAQ,WAAW,KAAO,EAAA,MAAA,EAAQ,OAAO,SAAU,EAAA;AAAA,MAEzD,QAAC,kBAAA,GAAA,CAAA,mBAAA,EAAA,EAAoB,IAAK,EAAA,QAAA,EAAS,OAAM,UAAW,EAAA;AAAA;AAAA,GACtD;AAEJ;;;;"}

package/dist/components/MenuItemLink/MenuItemLink.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsxs, Fragment, jsx } from 'react/jsx-runtime';
 import Tooltip from '@mui/material/Tooltip';
 import { MenuItemLinkContent } from './MenuItemLinkContent.esm.js';
 
@@ -10,7 +10,7 @@ const MenuItemLink = ({
   tooltip
 }) => {
   const isExternalLink = to.startsWith("http://") || to.startsWith("https://");
-  const headerLinkContent = () => /* @__PURE__ */ React.createElement(
+  const headerLinkContent = () => /* @__PURE__ */ jsx(
     MenuItemLinkContent,
     {
       icon,
@@ -19,7 +19,10 @@ const MenuItemLink = ({
       isExternalLink
     }
   );
-  return /* @__PURE__ */ React.createElement(React.Fragment, null, tooltip && /* @__PURE__ */ React.createElement(Tooltip, { title: tooltip }, /* @__PURE__ */ React.createElement("div", null, headerLinkContent())), !tooltip && headerLinkContent());
+  return /* @__PURE__ */ jsxs(Fragment, { children: [
+    tooltip && /* @__PURE__ */ jsx(Tooltip, { title: tooltip, children: /* @__PURE__ */ jsx("div", { children: headerLinkContent() }) }),
+    !tooltip && headerLinkContent()
+  ] });
 };
 
 export { MenuItemLink };

package/dist/components/MenuItemLink/MenuItemLink.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"MenuItemLink.esm.js","sources":["../../../src/components/MenuItemLink/MenuItemLink.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport React from 'react';\nimport Tooltip from '@mui/material/Tooltip';\nimport { MenuItemLinkContent } from './MenuItemLinkContent';\n\n/**\n * Header Icon Button properties\n * @public\n */\nexport interface MenuItemLinkProps {\n  to: string;\n  title?: string;\n  subTitle?: string;\n  icon?: string;\n  tooltip?: string;\n}\n\nexport const MenuItemLink = ({\n  to,\n  title,\n  subTitle,\n  icon,\n  tooltip,\n}: MenuItemLinkProps) => {\n  const isExternalLink = to.startsWith('http://') || to.startsWith('https://');\n\n  const headerLinkContent = () => (\n    <MenuItemLinkContent\n      icon={icon}\n      label={title}\n      subLabel={subTitle}\n      isExternalLink={isExternalLink}\n    />\n  );\n\n  return (\n    <>\n      {tooltip && (\n        <Tooltip title={tooltip}>\n          <div>{headerLinkContent()}</div>\n        </Tooltip>\n      )}\n      {!tooltip && headerLinkContent()}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;AAgCO,MAAM,eAAe,CAAC;AAAA,EAC3B,EAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA;AACF,CAAyB,KAAA;AACvB,EAAA,MAAM,iBAAiB,EAAG,CAAA,UAAA,CAAW,SAAS,CAAK,IAAA,EAAA,CAAG,WAAW,UAAU,CAAA;AAE3E,EAAA,MAAM,oBAAoB,sBACxB,KAAA,CAAA,aAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,KAAO,EAAA,KAAA;AAAA,MACP,QAAU,EAAA,QAAA;AAAA,MACV;AAAA;AAAA,GACF;AAGF,EAAA,uBAEK,KAAA,CAAA,aAAA,CAAA,KAAA,CAAA,QAAA,EAAA,IAAA,EAAA,OAAA,oBACE,KAAA,CAAA,aAAA,CAAA,OAAA,EAAA,EAAQ,OAAO,OACd,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,KAAK,EAAA,IAAA,EAAA,iBAAA,EAAoB,CAC5B,CAAA,EAED,CAAC,OAAA,IAAW,mBACf,CAAA;AAEJ;;;;"}
+{"version":3,"file":"MenuItemLink.esm.js","sources":["../../../src/components/MenuItemLink/MenuItemLink.tsx"],"sourcesContent":["/*\n * Copyright Red Hat, Inc.\n *\n * Licensed under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License.\n * You may obtain a copy of the License at\n *\n *     http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software\n * distributed under the License is distributed on an \"AS IS\" BASIS,\n * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.\n * See the License for the specific language governing permissions and\n * limitations under the License.\n */\n\nimport Tooltip from '@mui/material/Tooltip';\nimport { MenuItemLinkContent } from './MenuItemLinkContent';\n\n/**\n * Header Icon Button properties\n * @public\n */\nexport interface MenuItemLinkProps {\n  to: string;\n  title?: string;\n  subTitle?: string;\n  icon?: string;\n  tooltip?: string;\n}\n\nexport const MenuItemLink = ({\n  to,\n  title,\n  subTitle,\n  icon,\n  tooltip,\n}: MenuItemLinkProps) => {\n  const isExternalLink = to.startsWith('http://') || to.startsWith('https://');\n\n  const headerLinkContent = () => (\n    <MenuItemLinkContent\n      icon={icon}\n      label={title}\n      subLabel={subTitle}\n      isExternalLink={isExternalLink}\n    />\n  );\n\n  return (\n    <>\n      {tooltip && (\n        <Tooltip title={tooltip}>\n          <div>{headerLinkContent()}</div>\n        </Tooltip>\n      )}\n      {!tooltip && headerLinkContent()}\n    </>\n  );\n};\n"],"names":[],"mappings":";;;;AA+BO,MAAM,eAAe,CAAC;AAAA,EAC3B,EAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,IAAA;AAAA,EACA;AACF,CAAyB,KAAA;AACvB,EAAA,MAAM,iBAAiB,EAAG,CAAA,UAAA,CAAW,SAAS,CAAK,IAAA,EAAA,CAAG,WAAW,UAAU,CAAA;AAE3E,EAAA,MAAM,oBAAoB,sBACxB,GAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,IAAA;AAAA,MACA,KAAO,EAAA,KAAA;AAAA,MACP,QAAU,EAAA,QAAA;AAAA,MACV;AAAA;AAAA,GACF;AAGF,EAAA,uBAEK,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,IACC,OAAA,oBAAA,GAAA,CAAC,WAAQ,KAAO,EAAA,OAAA,EACd,8BAAC,KAAK,EAAA,EAAA,QAAA,EAAA,iBAAA,IAAoB,CAC5B,EAAA,CAAA;AAAA,IAED,CAAC,WAAW,iBAAkB;AAAA,GACjC,EAAA,CAAA;AAEJ;;;;"}