@red-hat-developer-hub/backstage-plugin-global-header 1.8.0 → 1.10.1

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;;;;"}

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

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Typography from '@mui/material/Typography';
 import Box from '@mui/material/Box';
 import { HeaderIcon } from '../HeaderIcon/HeaderIcon.esm.js';
@@ -12,7 +12,7 @@ const MenuItemLinkContent = ({
   isExternalLink = false
 }) => {
   const theme = useTheme();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsxs(
     Box,
     {
       sx: {
@@ -22,44 +22,51 @@ const MenuItemLinkContent = ({
         margin: "8px 0",
         color: "inherit",
         width: "100%"
-      }
-    },
-    /* @__PURE__ */ React.createElement(Box, { sx: { display: "flex", alignItems: "center" } }, icon && /* @__PURE__ */ React.createElement(
-      HeaderIcon,
-      {
-        icon,
-        size: "small",
-        layout: label ? {
-          marginRight: "0.5rem",
-          flexShrink: 0,
-          display: "flex",
-          alignItems: "center",
-          // Ensure the icon is centered
-          color: theme.palette.mode === "dark" ? theme.palette.text.primary : theme.palette.text.disabled
-        } : {}
-      }
-    ), /* @__PURE__ */ React.createElement(
-      Box,
-      {
-        sx: {
-          display: "flex",
-          flexDirection: "column",
-          justifyContent: "center"
-        }
       },
-      label && /* @__PURE__ */ React.createElement(Typography, { variant: "body2", color: theme.palette.text.primary }, label),
-      subLabel && /* @__PURE__ */ React.createElement(Typography, { variant: "caption", color: theme.palette.text.secondary }, subLabel)
-    )),
-    isExternalLink && /* @__PURE__ */ React.createElement(
-      LaunchIcon,
-      {
-        sx: {
-          fontSize: 16,
-          color: theme.palette.text.secondary,
-          ml: 1
-        }
-      }
-    )
+      children: [
+        /* @__PURE__ */ jsxs(Box, { sx: { display: "flex", alignItems: "center" }, children: [
+          icon && /* @__PURE__ */ jsx(
+            HeaderIcon,
+            {
+              icon,
+              size: "small",
+              layout: label ? {
+                marginRight: "0.5rem",
+                flexShrink: 0,
+                display: "flex",
+                alignItems: "center",
+                // Ensure the icon is centered
+                color: theme.palette.mode === "dark" ? theme.palette.text.primary : theme.palette.text.disabled
+              } : {}
+            }
+          ),
+          /* @__PURE__ */ jsxs(
+            Box,
+            {
+              sx: {
+                display: "flex",
+                flexDirection: "column",
+                justifyContent: "center"
+              },
+              children: [
+                label && /* @__PURE__ */ jsx(Typography, { variant: "body2", color: theme.palette.text.primary, children: label }),
+                subLabel && /* @__PURE__ */ jsx(Typography, { variant: "caption", color: theme.palette.text.secondary, children: subLabel })
+              ]
+            }
+          )
+        ] }),
+        isExternalLink && /* @__PURE__ */ jsx(
+          LaunchIcon,
+          {
+            sx: {
+              fontSize: 16,
+              color: theme.palette.text.secondary,
+              ml: 1
+            }
+          }
+        )
+      ]
+    }
   );
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"MenuItemLinkContent.esm.js","sources":["../../../src/components/MenuItemLink/MenuItemLinkContent.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 Typography from '@mui/material/Typography';\nimport Box from '@mui/material/Box';\nimport { HeaderIcon } from '../HeaderIcon/HeaderIcon';\nimport { useTheme } from '@mui/material/styles';\nimport LaunchIcon from '@mui/icons-material/Launch';\n\ninterface MenuItemLinkContentProps {\n  icon?: string;\n  label?: string;\n  subLabel?: string;\n  isExternalLink?: boolean;\n}\n\nexport const MenuItemLinkContent: React.FC<MenuItemLinkContentProps> = ({\n  icon,\n  label,\n  subLabel,\n  isExternalLink = false,\n}) => {\n  const theme = useTheme();\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        margin: '8px 0',\n        color: 'inherit',\n        width: '100%',\n      }}\n    >\n      <Box sx={{ display: 'flex', alignItems: 'center' }}>\n        {icon && (\n          <HeaderIcon\n            icon={icon}\n            size=\"small\"\n            layout={\n              label\n                ? {\n                    marginRight: '0.5rem',\n                    flexShrink: 0,\n                    display: 'flex',\n                    alignItems: 'center', // Ensure the icon is centered\n                    color:\n                      theme.palette.mode === 'dark'\n                        ? theme.palette.text.primary\n                        : theme.palette.text.disabled,\n                  }\n                : {}\n            }\n          />\n        )}\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            justifyContent: 'center',\n          }}\n        >\n          {label && (\n            <Typography variant=\"body2\" color={theme.palette.text.primary}>\n              {label}\n            </Typography>\n          )}\n          {subLabel && (\n            <Typography variant=\"caption\" color={theme.palette.text.secondary}>\n              {subLabel}\n            </Typography>\n          )}\n        </Box>\n      </Box>\n      {isExternalLink && (\n        <LaunchIcon\n          sx={{\n            fontSize: 16,\n            color: theme.palette.text.secondary,\n            ml: 1,\n          }}\n        />\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AA6BO,MAAM,sBAA0D,CAAC;AAAA,EACtE,IAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,cAAiB,GAAA;AACnB,CAAM,KAAA;AACJ,EAAA,MAAM,QAAQ,QAAS,EAAA;AACvB,EACE,uBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,MAAA;AAAA,QACT,UAAY,EAAA,QAAA;AAAA,QACZ,cAAgB,EAAA,eAAA;AAAA,QAChB,MAAQ,EAAA,OAAA;AAAA,QACR,KAAO,EAAA,SAAA;AAAA,QACP,KAAO,EAAA;AAAA;AACT,KAAA;AAAA,oBAEA,KAAA,CAAA,aAAA,CAAC,OAAI,EAAI,EAAA,EAAE,SAAS,MAAQ,EAAA,UAAA,EAAY,QAAS,EAAA,EAAA,EAC9C,IACC,oBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,IAAA;AAAA,QACA,IAAK,EAAA,OAAA;AAAA,QACL,QACE,KACI,GAAA;AAAA,UACE,WAAa,EAAA,QAAA;AAAA,UACb,UAAY,EAAA,CAAA;AAAA,UACZ,OAAS,EAAA,MAAA;AAAA,UACT,UAAY,EAAA,QAAA;AAAA;AAAA,UACZ,KAAA,EACE,KAAM,CAAA,OAAA,CAAQ,IAAS,KAAA,MAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA;AAAA,YAE3B;AAAC;AAAA,KAIX,kBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,GAAA;AAAA,MAAA;AAAA,QACC,EAAI,EAAA;AAAA,UACF,OAAS,EAAA,MAAA;AAAA,UACT,aAAe,EAAA,QAAA;AAAA,UACf,cAAgB,EAAA;AAAA;AAClB,OAAA;AAAA,MAEC,KAAA,oBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,OAAA,EAAQ,OAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA,EAAA,EACnD,KACH,CAAA;AAAA,MAED,QAAA,oBACE,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,SAAA,EAAU,OAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,SAAA,EAAA,EACrD,QACH;AAAA,KAGN,CAAA;AAAA,IACC,cACC,oBAAA,KAAA,CAAA,aAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,EAAI,EAAA;AAAA,UACF,QAAU,EAAA,EAAA;AAAA,UACV,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,SAAA;AAAA,UAC1B,EAAI,EAAA;AAAA;AACN;AAAA;AACF,GAEJ;AAEJ;;;;"}
+{"version":3,"file":"MenuItemLinkContent.esm.js","sources":["../../../src/components/MenuItemLink/MenuItemLinkContent.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 { FC } from 'react';\nimport Typography from '@mui/material/Typography';\nimport Box from '@mui/material/Box';\nimport { HeaderIcon } from '../HeaderIcon/HeaderIcon';\nimport { useTheme } from '@mui/material/styles';\nimport LaunchIcon from '@mui/icons-material/Launch';\n\ninterface MenuItemLinkContentProps {\n  icon?: string;\n  label?: string;\n  subLabel?: string;\n  isExternalLink?: boolean;\n}\n\nexport const MenuItemLinkContent: FC<MenuItemLinkContentProps> = ({\n  icon,\n  label,\n  subLabel,\n  isExternalLink = false,\n}) => {\n  const theme = useTheme();\n  return (\n    <Box\n      sx={{\n        display: 'flex',\n        alignItems: 'center',\n        justifyContent: 'space-between',\n        margin: '8px 0',\n        color: 'inherit',\n        width: '100%',\n      }}\n    >\n      <Box sx={{ display: 'flex', alignItems: 'center' }}>\n        {icon && (\n          <HeaderIcon\n            icon={icon}\n            size=\"small\"\n            layout={\n              label\n                ? {\n                    marginRight: '0.5rem',\n                    flexShrink: 0,\n                    display: 'flex',\n                    alignItems: 'center', // Ensure the icon is centered\n                    color:\n                      theme.palette.mode === 'dark'\n                        ? theme.palette.text.primary\n                        : theme.palette.text.disabled,\n                  }\n                : {}\n            }\n          />\n        )}\n        <Box\n          sx={{\n            display: 'flex',\n            flexDirection: 'column',\n            justifyContent: 'center',\n          }}\n        >\n          {label && (\n            <Typography variant=\"body2\" color={theme.palette.text.primary}>\n              {label}\n            </Typography>\n          )}\n          {subLabel && (\n            <Typography variant=\"caption\" color={theme.palette.text.secondary}>\n              {subLabel}\n            </Typography>\n          )}\n        </Box>\n      </Box>\n      {isExternalLink && (\n        <LaunchIcon\n          sx={{\n            fontSize: 16,\n            color: theme.palette.text.secondary,\n            ml: 1,\n          }}\n        />\n      )}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;AA6BO,MAAM,sBAAoD,CAAC;AAAA,EAChE,IAAA;AAAA,EACA,KAAA;AAAA,EACA,QAAA;AAAA,EACA,cAAiB,GAAA;AACnB,CAAM,KAAA;AACJ,EAAA,MAAM,QAAQ,QAAS,EAAA;AACvB,EACE,uBAAA,IAAA;AAAA,IAAC,GAAA;AAAA,IAAA;AAAA,MACC,EAAI,EAAA;AAAA,QACF,OAAS,EAAA,MAAA;AAAA,QACT,UAAY,EAAA,QAAA;AAAA,QACZ,cAAgB,EAAA,eAAA;AAAA,QAChB,MAAQ,EAAA,OAAA;AAAA,QACR,KAAO,EAAA,SAAA;AAAA,QACP,KAAO,EAAA;AAAA,OACT;AAAA,MAEA,QAAA,EAAA;AAAA,wBAAA,IAAA,CAAC,OAAI,EAAI,EAAA,EAAE,SAAS,MAAQ,EAAA,UAAA,EAAY,UACrC,EAAA,QAAA,EAAA;AAAA,UACC,IAAA,oBAAA,GAAA;AAAA,YAAC,UAAA;AAAA,YAAA;AAAA,cACC,IAAA;AAAA,cACA,IAAK,EAAA,OAAA;AAAA,cACL,QACE,KACI,GAAA;AAAA,gBACE,WAAa,EAAA,QAAA;AAAA,gBACb,UAAY,EAAA,CAAA;AAAA,gBACZ,OAAS,EAAA,MAAA;AAAA,gBACT,UAAY,EAAA,QAAA;AAAA;AAAA,gBACZ,KAAA,EACE,KAAM,CAAA,OAAA,CAAQ,IAAS,KAAA,MAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA,GACnB,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA;AAAA,kBAE3B;AAAC;AAAA,WAET;AAAA,0BAEF,IAAA;AAAA,YAAC,GAAA;AAAA,YAAA;AAAA,cACC,EAAI,EAAA;AAAA,gBACF,OAAS,EAAA,MAAA;AAAA,gBACT,aAAe,EAAA,QAAA;AAAA,gBACf,cAAgB,EAAA;AAAA,eAClB;AAAA,cAEC,QAAA,EAAA;AAAA,gBACC,KAAA,oBAAA,GAAA,CAAC,cAAW,OAAQ,EAAA,OAAA,EAAQ,OAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,OAAA,EACnD,QACH,EAAA,KAAA,EAAA,CAAA;AAAA,gBAED,QAAA,oBACE,GAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,SAAA,EAAU,OAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,SAAA,EACrD,QACH,EAAA,QAAA,EAAA;AAAA;AAAA;AAAA;AAEJ,SACF,EAAA,CAAA;AAAA,QACC,cACC,oBAAA,GAAA;AAAA,UAAC,UAAA;AAAA,UAAA;AAAA,YACC,EAAI,EAAA;AAAA,cACF,QAAU,EAAA,EAAA;AAAA,cACV,KAAA,EAAO,KAAM,CAAA,OAAA,CAAQ,IAAK,CAAA,SAAA;AAAA,cAC1B,EAAI,EAAA;AAAA;AACN;AAAA;AACF;AAAA;AAAA,GAEJ;AAEJ;;;;"}

package/dist/components/NotificationBanner.esm.js

@@ -1,10 +1,11 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useMemo } from 'react';
 import { MarkdownContent } from '@backstage/core-components';
 import Alert from '@mui/material/Alert';
 import { HeaderIcon } from './HeaderIcon/HeaderIcon.esm.js';
 
 const NotificationBanner = (props) => {
-  const [dismissed, setDismissed] = React.useState(() => {
+  const [dismissed, setDismissed] = useState(() => {
     if (props.dismiss === "localstorage") {
       try {
         const dismissedString = localStorage.getItem("global-header/NotificationBanner") ?? "{}";
@@ -17,7 +18,7 @@ const NotificationBanner = (props) => {
       return false;
     }
   });
-  const onClose = React.useMemo(() => {
+  const onClose = useMemo(() => {
     if (!props.dismiss || props.dismiss === "none") {
       return void 0;
     } else if (props.dismiss === "session") {
@@ -45,11 +46,11 @@ const NotificationBanner = (props) => {
   if (dismissed || !props.title) {
     return null;
   }
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Alert,
     {
       color: "warning",
-      icon: props.icon ? /* @__PURE__ */ React.createElement(HeaderIcon, { icon: props.icon }) : false,
+      icon: props.icon ? /* @__PURE__ */ jsx(HeaderIcon, { icon: props.icon }) : false,
       onClose,
       sx: {
         color: props.textColor,
@@ -61,9 +62,9 @@ const NotificationBanner = (props) => {
         justifyContent: "center",
         textAlign: "center",
         ...props.layout
-      }
-    },
-    props.markdown ? /* @__PURE__ */ React.createElement(MarkdownContent, { content: props.title, dialect: "gfm" }) : props.title
+      },
+      children: props.markdown ? /* @__PURE__ */ jsx(MarkdownContent, { content: props.title, dialect: "gfm" }) : props.title
+    }
   );
 };
 

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationBanner.esm.js","sources":["../../src/components/NotificationBanner.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 { MarkdownContent } from '@backstage/core-components';\n\nimport Alert from '@mui/material/Alert';\n\nimport { HeaderIcon } from './HeaderIcon/HeaderIcon';\n\n/**\n * @public\n */\nexport type NotificationBannerDismiss = 'none' | 'session' | 'localstorage';\n\n/**\n * @public\n */\nexport interface NotificationBannerProps {\n  id?: string;\n  title: string;\n  markdown?: boolean;\n  icon?: string;\n\n  textColor?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n  layout?: React.CSSProperties;\n\n  dismiss?: NotificationBannerDismiss;\n}\n\nexport const NotificationBanner = (props: NotificationBannerProps) => {\n  const [dismissed, setDismissed] = React.useState<boolean>(() => {\n    if (props.dismiss === 'localstorage') {\n      try {\n        const dismissedString =\n          localStorage.getItem('global-header/NotificationBanner') ?? '{}';\n        const dismissedObject = JSON.parse(dismissedString);\n        return dismissedObject[props.id ?? props.title] === 'dismissed';\n      } catch (error) {\n        // nothing\n        return false;\n      }\n    } else {\n      return false;\n    }\n  });\n\n  const onClose = React.useMemo<(() => void) | undefined>(() => {\n    if (!props.dismiss || props.dismiss === 'none') {\n      return undefined;\n    } else if (props.dismiss === 'session') {\n      return () => setDismissed(true);\n    } else if (props.dismiss === 'localstorage') {\n      return () => {\n        try {\n          const dismissedString =\n            localStorage.getItem('global-header/NotificationBanner') ?? '{}';\n          const dismissedObject = JSON.parse(dismissedString);\n          dismissedObject[props.id ?? props.title] = 'dismissed';\n          localStorage.setItem(\n            'global-header/NotificationBanner',\n            JSON.stringify(dismissedObject),\n          );\n        } catch (error) {\n          // nothing\n        }\n        setDismissed(true);\n      };\n    }\n    // eslint-disable-next-line no-console\n    console.warn(\n      `Unsupported dismiss option \"${props.dismiss}\", currently supported \"none\", \"session\" or \"localstorage\"!`,\n    );\n    return undefined;\n  }, [props.id, props.title, props.dismiss]);\n\n  if (dismissed || !props.title) {\n    return null;\n  }\n\n  return (\n    <Alert\n      color=\"warning\"\n      icon={props.icon ? <HeaderIcon icon={props.icon} /> : false}\n      onClose={onClose}\n      sx={{\n        color: props.textColor,\n        backgroundColor: props.backgroundColor,\n        borderColor: props.borderColor,\n        borderStyle: 'solid',\n        borderWidth: 2,\n        borderRadius: 0,\n        justifyContent: 'center',\n        textAlign: 'center',\n        ...props.layout,\n      }}\n    >\n      {props.markdown ? (\n        <MarkdownContent content={props.title} dialect=\"gfm\" />\n      ) : (\n        props.title\n      )}\n    </Alert>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"NotificationBanner.esm.js","sources":["../../src/components/NotificationBanner.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 { useState, useMemo } from 'react';\nimport type { CSSProperties } from 'react';\n\nimport { MarkdownContent } from '@backstage/core-components';\n\nimport Alert from '@mui/material/Alert';\n\nimport { HeaderIcon } from './HeaderIcon/HeaderIcon';\n\n/**\n * @public\n */\nexport type NotificationBannerDismiss = 'none' | 'session' | 'localstorage';\n\n/**\n * @public\n */\nexport interface NotificationBannerProps {\n  id?: string;\n  title: string;\n  markdown?: boolean;\n  icon?: string;\n\n  textColor?: string;\n  backgroundColor?: string;\n  borderColor?: string;\n  layout?: CSSProperties;\n\n  dismiss?: NotificationBannerDismiss;\n}\n\nexport const NotificationBanner = (props: NotificationBannerProps) => {\n  const [dismissed, setDismissed] = useState<boolean>(() => {\n    if (props.dismiss === 'localstorage') {\n      try {\n        const dismissedString =\n          localStorage.getItem('global-header/NotificationBanner') ?? '{}';\n        const dismissedObject = JSON.parse(dismissedString);\n        return dismissedObject[props.id ?? props.title] === 'dismissed';\n      } catch (error) {\n        // nothing\n        return false;\n      }\n    } else {\n      return false;\n    }\n  });\n\n  const onClose = useMemo<(() => void) | undefined>(() => {\n    if (!props.dismiss || props.dismiss === 'none') {\n      return undefined;\n    } else if (props.dismiss === 'session') {\n      return () => setDismissed(true);\n    } else if (props.dismiss === 'localstorage') {\n      return () => {\n        try {\n          const dismissedString =\n            localStorage.getItem('global-header/NotificationBanner') ?? '{}';\n          const dismissedObject = JSON.parse(dismissedString);\n          dismissedObject[props.id ?? props.title] = 'dismissed';\n          localStorage.setItem(\n            'global-header/NotificationBanner',\n            JSON.stringify(dismissedObject),\n          );\n        } catch (error) {\n          // nothing\n        }\n        setDismissed(true);\n      };\n    }\n    // eslint-disable-next-line no-console\n    console.warn(\n      `Unsupported dismiss option \"${props.dismiss}\", currently supported \"none\", \"session\" or \"localstorage\"!`,\n    );\n    return undefined;\n  }, [props.id, props.title, props.dismiss]);\n\n  if (dismissed || !props.title) {\n    return null;\n  }\n\n  return (\n    <Alert\n      color=\"warning\"\n      icon={props.icon ? <HeaderIcon icon={props.icon} /> : false}\n      onClose={onClose}\n      sx={{\n        color: props.textColor,\n        backgroundColor: props.backgroundColor,\n        borderColor: props.borderColor,\n        borderStyle: 'solid',\n        borderWidth: 2,\n        borderRadius: 0,\n        justifyContent: 'center',\n        textAlign: 'center',\n        ...props.layout,\n      }}\n    >\n      {props.markdown ? (\n        <MarkdownContent content={props.title} dialect=\"gfm\" />\n      ) : (\n        props.title\n      )}\n    </Alert>\n  );\n};\n"],"names":[],"mappings":";;;;;;AA+Ca,MAAA,kBAAA,GAAqB,CAAC,KAAmC,KAAA;AACpE,EAAA,MAAM,CAAC,SAAA,EAAW,YAAY,CAAA,GAAI,SAAkB,MAAM;AACxD,IAAI,IAAA,KAAA,CAAM,YAAY,cAAgB,EAAA;AACpC,MAAI,IAAA;AACF,QAAA,MAAM,eACJ,GAAA,YAAA,CAAa,OAAQ,CAAA,kCAAkC,CAAK,IAAA,IAAA;AAC9D,QAAM,MAAA,eAAA,GAAkB,IAAK,CAAA,KAAA,CAAM,eAAe,CAAA;AAClD,QAAA,OAAO,eAAgB,CAAA,KAAA,CAAM,EAAM,IAAA,KAAA,CAAM,KAAK,CAAM,KAAA,WAAA;AAAA,eAC7C,KAAO,EAAA;AAEd,QAAO,OAAA,KAAA;AAAA;AACT,KACK,MAAA;AACL,MAAO,OAAA,KAAA;AAAA;AACT,GACD,CAAA;AAED,EAAM,MAAA,OAAA,GAAU,QAAkC,MAAM;AACtD,IAAA,IAAI,CAAC,KAAA,CAAM,OAAW,IAAA,KAAA,CAAM,YAAY,MAAQ,EAAA;AAC9C,MAAO,OAAA,KAAA,CAAA;AAAA,KACT,MAAA,IAAW,KAAM,CAAA,OAAA,KAAY,SAAW,EAAA;AACtC,MAAO,OAAA,MAAM,aAAa,IAAI,CAAA;AAAA,KAChC,MAAA,IAAW,KAAM,CAAA,OAAA,KAAY,cAAgB,EAAA;AAC3C,MAAA,OAAO,MAAM;AACX,QAAI,IAAA;AACF,UAAA,MAAM,eACJ,GAAA,YAAA,CAAa,OAAQ,CAAA,kCAAkC,CAAK,IAAA,IAAA;AAC9D,UAAM,MAAA,eAAA,GAAkB,IAAK,CAAA,KAAA,CAAM,eAAe,CAAA;AAClD,UAAA,eAAA,CAAgB,KAAM,CAAA,EAAA,IAAM,KAAM,CAAA,KAAK,CAAI,GAAA,WAAA;AAC3C,UAAa,YAAA,CAAA,OAAA;AAAA,YACX,kCAAA;AAAA,YACA,IAAA,CAAK,UAAU,eAAe;AAAA,WAChC;AAAA,iBACO,KAAO,EAAA;AAAA;AAGhB,QAAA,YAAA,CAAa,IAAI,CAAA;AAAA,OACnB;AAAA;AAGF,IAAQ,OAAA,CAAA,IAAA;AAAA,MACN,CAAA,4BAAA,EAA+B,MAAM,OAAO,CAAA,2DAAA;AAAA,KAC9C;AACA,IAAO,OAAA,KAAA,CAAA;AAAA,GACT,EAAG,CAAC,KAAM,CAAA,EAAA,EAAI,MAAM,KAAO,EAAA,KAAA,CAAM,OAAO,CAAC,CAAA;AAEzC,EAAI,IAAA,SAAA,IAAa,CAAC,KAAA,CAAM,KAAO,EAAA;AAC7B,IAAO,OAAA,IAAA;AAAA;AAGT,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,IAAA,EAAM,MAAM,IAAO,mBAAA,GAAA,CAAC,cAAW,IAAM,EAAA,KAAA,CAAM,MAAM,CAAK,GAAA,KAAA;AAAA,MACtD,OAAA;AAAA,MACA,EAAI,EAAA;AAAA,QACF,OAAO,KAAM,CAAA,SAAA;AAAA,QACb,iBAAiB,KAAM,CAAA,eAAA;AAAA,QACvB,aAAa,KAAM,CAAA,WAAA;AAAA,QACnB,WAAa,EAAA,OAAA;AAAA,QACb,WAAa,EAAA,CAAA;AAAA,QACb,YAAc,EAAA,CAAA;AAAA,QACd,cAAgB,EAAA,QAAA;AAAA,QAChB,SAAW,EAAA,QAAA;AAAA,QACX,GAAG,KAAM,CAAA;AAAA,OACX;AAAA,MAEC,QAAA,EAAA,KAAA,CAAM,QACL,mBAAA,GAAA,CAAC,eAAgB,EAAA,EAAA,OAAA,EAAS,MAAM,KAAO,EAAA,OAAA,EAAQ,KAAM,EAAA,CAAA,GAErD,KAAM,CAAA;AAAA;AAAA,GAEV;AAEJ;;;;"}

package/dist/components/NotificationButton/NotificationButton.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsx } from 'react/jsx-runtime';
 import { Link as Link$1 } from '@backstage/core-components';
 import Badge from '@mui/material/Badge';
 import Box from '@mui/material/Box';
@@ -7,7 +7,7 @@ import Tooltip from '@mui/material/Tooltip';
 import NotificationIcon from '@mui/icons-material/NotificationsOutlined';
 import { useNotificationCount } from '../../hooks/useNotificationCount.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 NotificationButton = ({
   title = "Notifications",
   tooltip,
@@ -21,17 +21,17 @@ const NotificationButton = ({
   if (!available) {
     return null;
   }
-  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,
     {
       component: Link,
       color,
       size,
       to,
-      "aria-label": title
-    },
-    unreadCount > 0 ? /* @__PURE__ */ React.createElement(Badge, { badgeContent: unreadCount, color: badgeColor, max: 999 }, /* @__PURE__ */ React.createElement(NotificationIcon, { fontSize: size })) : /* @__PURE__ */ React.createElement(NotificationIcon, { fontSize: size })
-  ))));
+      "aria-label": title,
+      children: unreadCount > 0 ? /* @__PURE__ */ jsx(Badge, { badgeContent: unreadCount, color: badgeColor, max: 999, children: /* @__PURE__ */ jsx(NotificationIcon, { fontSize: size }) }) : /* @__PURE__ */ jsx(NotificationIcon, { fontSize: size })
+    }
+  ) }) }) });
 };
 
 export { NotificationButton };

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

@@ -1 +1 @@
-{"version":3,"file":"NotificationButton.esm.js","sources":["../../../src/components/NotificationButton/NotificationButton.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 Badge from '@mui/material/Badge';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\nimport NotificationIcon from '@mui/icons-material/NotificationsOutlined';\n\nimport { useNotificationCount } from '../../hooks/useNotificationCount';\n\n/**\n * @public\n */\nexport interface NotificationButtonProps {\n  title?: string;\n  tooltip?: string;\n  color?:\n    | 'inherit'\n    | 'default'\n    | 'primary'\n    | 'secondary'\n    | 'error'\n    | 'info'\n    | 'success'\n    | 'warning';\n  size?: 'small' | 'medium' | 'large';\n  badgeColor?:\n    | 'primary'\n    | 'secondary'\n    | 'default'\n    | 'error'\n    | 'info'\n    | 'success'\n    | 'warning';\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\n/**\n * @public\n */\nexport const NotificationButton = ({\n  title = 'Notifications',\n  tooltip,\n  color = 'inherit',\n  size = 'small',\n  badgeColor = 'error',\n  to = '/notifications',\n  layout,\n}: NotificationButtonProps) => {\n  const { available, unreadCount } = useNotificationCount();\n\n  if (!available) {\n    return null;\n  }\n\n  return (\n    <Box sx={layout}>\n      <Tooltip title={tooltip ?? title}>\n        <div>\n          <IconButton\n            component={Link}\n            color={color}\n            size={size}\n            to={to}\n            aria-label={title}\n          >\n            {unreadCount > 0 ? (\n              <Badge badgeContent={unreadCount} color={badgeColor} max={999}>\n                <NotificationIcon fontSize={size} />\n              </Badge>\n            ) : (\n              <NotificationIcon fontSize={size} />\n            )}\n          </IconButton>\n        </div>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":["BackstageLink"],"mappings":";;;;;;;;;AAyDA,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;AAM9D,MAAM,qBAAqB,CAAC;AAAA,EACjC,KAAQ,GAAA,eAAA;AAAA,EACR,OAAA;AAAA,EACA,KAAQ,GAAA,SAAA;AAAA,EACR,IAAO,GAAA,OAAA;AAAA,EACP,UAAa,GAAA,OAAA;AAAA,EACb,EAAK,GAAA,gBAAA;AAAA,EACL;AACF,CAA+B,KAAA;AAC7B,EAAA,MAAM,EAAE,SAAA,EAAW,WAAY,EAAA,GAAI,oBAAqB,EAAA;AAExD,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAO,OAAA,IAAA;AAAA;AAGT,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,SAAW,EAAA,IAAA;AAAA,MACX,KAAA;AAAA,MACA,IAAA;AAAA,MACA,EAAA;AAAA,MACA,YAAY,EAAA;AAAA,KAAA;AAAA,IAEX,cAAc,CACb,mBAAA,KAAA,CAAA,aAAA,CAAC,SAAM,YAAc,EAAA,WAAA,EAAa,OAAO,UAAY,EAAA,GAAA,EAAK,uBACvD,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA,EAAiB,UAAU,IAAM,EAAA,CACpC,oBAEC,KAAA,CAAA,aAAA,CAAA,gBAAA,EAAA,EAAiB,UAAU,IAAM,EAAA;AAAA,GAGxC,CACF,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"NotificationButton.esm.js","sources":["../../../src/components/NotificationButton/NotificationButton.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 Badge from '@mui/material/Badge';\nimport Box from '@mui/material/Box';\nimport IconButton from '@mui/material/IconButton';\nimport Tooltip from '@mui/material/Tooltip';\nimport NotificationIcon from '@mui/icons-material/NotificationsOutlined';\n\nimport { useNotificationCount } from '../../hooks/useNotificationCount';\n\n/**\n * @public\n */\nexport interface NotificationButtonProps {\n  title?: string;\n  tooltip?: string;\n  color?:\n    | 'inherit'\n    | 'default'\n    | 'primary'\n    | 'secondary'\n    | 'error'\n    | 'info'\n    | 'success'\n    | 'warning';\n  size?: 'small' | 'medium' | 'large';\n  badgeColor?:\n    | 'primary'\n    | 'secondary'\n    | 'default'\n    | 'error'\n    | 'info'\n    | 'success'\n    | 'warning';\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\n/**\n * @public\n */\nexport const NotificationButton = ({\n  title = 'Notifications',\n  tooltip,\n  color = 'inherit',\n  size = 'small',\n  badgeColor = 'error',\n  to = '/notifications',\n  layout,\n}: NotificationButtonProps) => {\n  const { available, unreadCount } = useNotificationCount();\n\n  if (!available) {\n    return null;\n  }\n\n  return (\n    <Box sx={layout}>\n      <Tooltip title={tooltip ?? title}>\n        <div>\n          <IconButton\n            component={Link}\n            color={color}\n            size={size}\n            to={to}\n            aria-label={title}\n          >\n            {unreadCount > 0 ? (\n              <Badge badgeContent={unreadCount} color={badgeColor} max={999}>\n                <NotificationIcon fontSize={size} />\n              </Badge>\n            ) : (\n              <NotificationIcon fontSize={size} />\n            )}\n          </IconButton>\n        </div>\n      </Tooltip>\n    </Box>\n  );\n};\n"],"names":["BackstageLink"],"mappings":";;;;;;;;;AAwDA,MAAM,IAAA,GAAO,CAAC,KAAA,qBACX,GAAA,CAAAA,MAAA,EAAA,EAAe,GAAG,KAAO,EAAA,KAAA,EAAM,SAAU,EAAA,gBAAA,EAAkB,KAAO,EAAA,CAAA;AAM9D,MAAM,qBAAqB,CAAC;AAAA,EACjC,KAAQ,GAAA,eAAA;AAAA,EACR,OAAA;AAAA,EACA,KAAQ,GAAA,SAAA;AAAA,EACR,IAAO,GAAA,OAAA;AAAA,EACP,UAAa,GAAA,OAAA;AAAA,EACb,EAAK,GAAA,gBAAA;AAAA,EACL;AACF,CAA+B,KAAA;AAC7B,EAAA,MAAM,EAAE,SAAA,EAAW,WAAY,EAAA,GAAI,oBAAqB,EAAA;AAExD,EAAA,IAAI,CAAC,SAAW,EAAA;AACd,IAAO,OAAA,IAAA;AAAA;AAGT,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,SAAW,EAAA,IAAA;AAAA,MACX,KAAA;AAAA,MACA,IAAA;AAAA,MACA,EAAA;AAAA,MACA,YAAY,EAAA,KAAA;AAAA,MAEX,wBAAc,CACb,mBAAA,GAAA,CAAC,SAAM,YAAc,EAAA,WAAA,EAAa,OAAO,UAAY,EAAA,GAAA,EAAK,KACxD,QAAC,kBAAA,GAAA,CAAA,gBAAA,EAAA,EAAiB,UAAU,IAAM,EAAA,CAAA,EACpC,oBAEC,GAAA,CAAA,gBAAA,EAAA,EAAiB,UAAU,IAAM,EAAA;AAAA;AAAA,GAEtC,EACF,GACF,CACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/SearchComponent/SearchBar.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useRef, useEffect } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useState, useRef, useEffect } from 'react';
 import { useSearch, SearchResultState } from '@backstage/plugin-search-react';
 import Autocomplete from '@mui/material/Autocomplete';
 import { createSearchLink } from '../../utils/stringUtils.esm.js';
@@ -22,7 +23,7 @@ const SearchBar = (props) => {
   useEffect(() => {
     highlightedIndexRef.current = highlightedIndex;
   }, [highlightedIndex]);
-  return /* @__PURE__ */ React.createElement(SearchResultState, { ...props }, ({ loading, error, value }) => {
+  return /* @__PURE__ */ jsx(SearchResultState, { ...props, children: ({ loading, error, value }) => {
     const results = query?.term ? value?.results ?? [] : [];
     let options = [];
     if (query?.term && results.length === 0) {
@@ -35,7 +36,7 @@ const SearchBar = (props) => {
       ];
     }
     const searchLink = createSearchLink(query?.term ?? "");
-    return /* @__PURE__ */ React.createElement(
+    return /* @__PURE__ */ jsx(
       Autocomplete,
       {
         freeSolo: true,
@@ -48,6 +49,8 @@ const SearchBar = (props) => {
         componentsProps: {
           paper: {
             sx: {
+              "&:empty": { visibility: "hidden" },
+              // Removes underline-like effect
               borderRadius: "4px",
               outline: "unset",
               boxShadow: theme.palette.mode === "dark" ? `0 2px 6px 2px rgba(0, 0, 0, 0.50), 0 1px 2px 0 rgba(0, 0, 0, 0.50)` : "0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.30)"
@@ -75,7 +78,7 @@ const SearchBar = (props) => {
             setHighlightedIndex(-1);
           }
         },
-        renderInput: (params) => /* @__PURE__ */ React.createElement(
+        renderInput: (params) => /* @__PURE__ */ jsx(
           SearchInput,
           {
             params,
@@ -83,7 +86,7 @@ const SearchBar = (props) => {
             helperText: error ? "Error fetching results" : ""
           }
         ),
-        renderOption: (renderProps, option, { index }) => /* @__PURE__ */ React.createElement(
+        renderOption: (renderProps, option, { index }) => /* @__PURE__ */ jsx(
           SearchOption,
           {
             option,
@@ -100,7 +103,7 @@ const SearchBar = (props) => {
         }
       }
     );
-  });
+  } });
 };
 
 export { SearchBar };

package/dist/components/SearchComponent/SearchBar.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchComponent/SearchBar.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, useRef, useState } from 'react';\nimport {\n  SearchResultState,\n  SearchResultProps,\n  useSearch,\n} from '@backstage/plugin-search-react';\nimport Autocomplete from '@mui/material/Autocomplete';\nimport { createSearchLink } from '../../utils/stringUtils';\nimport { useNavigate } from 'react-router-dom';\nimport { SearchInput } from './SearchInput';\nimport { SearchOption } from './SearchOption';\nimport { useTheme } from '@mui/material/styles';\nimport { useDebouncedCallback } from '../../hooks/useDebouncedCallback';\n\ninterface SearchBarProps {\n  query: SearchResultProps['query'];\n  setSearchTerm: (term: string) => void;\n}\nexport const SearchBar = (props: SearchBarProps) => {\n  const { query, setSearchTerm } = props;\n  const navigate = useNavigate();\n  const theme = useTheme();\n  const [highlightedIndex, setHighlightedIndex] = useState(-1);\n  const highlightedIndexRef = useRef(highlightedIndex);\n  const { setTerm } = useSearch();\n\n  const onInputChange = useDebouncedCallback((_, inputValue) => {\n    setSearchTerm(inputValue);\n    setTerm(inputValue);\n  }, 300);\n\n  useEffect(() => {\n    highlightedIndexRef.current = highlightedIndex;\n  }, [highlightedIndex]);\n\n  return (\n    <SearchResultState {...props}>\n      {({ loading, error, value }) => {\n        const results = query?.term ? value?.results ?? [] : [];\n        let options: string[] = [];\n        if (query?.term && results.length === 0) {\n          options = ['No results found'];\n        }\n        if (results.length > 0) {\n          options = [\n            ...results.map(result => result.document.title),\n            `${query?.term}`,\n          ];\n        }\n        const searchLink = createSearchLink(query?.term ?? '');\n\n        return (\n          <Autocomplete\n            freeSolo\n            options={options}\n            loading={loading}\n            value={query?.term ?? ''}\n            getOptionLabel={option => option ?? ''}\n            onInputChange={onInputChange}\n            onHighlightChange={(_, option) =>\n              setHighlightedIndex(options.indexOf(option ?? ''))\n            }\n            componentsProps={{\n              paper: {\n                sx: {\n                  borderRadius: '4px',\n                  outline: 'unset',\n                  boxShadow:\n                    theme.palette.mode === 'dark'\n                      ? `0 2px 6px 2px rgba(0, 0, 0, 0.50), 0 1px 2px 0 rgba(0, 0, 0, 0.50)`\n                      : '0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.30)',\n                },\n              },\n            }}\n            sx={{\n              width: '100%',\n              '& [class*=\"MuiAutocomplete-clearIndicator\"]': {\n                visibility: query?.term ? 'visible' : 'hidden',\n              },\n            }}\n            filterOptions={x => x}\n            onKeyDown={event => {\n              const currentHighlight = highlightedIndexRef.current;\n              if (event.key === 'Enter') {\n                event.preventDefault();\n                if (currentHighlight === -1 && query?.term) {\n                  navigate(searchLink);\n                } else if (currentHighlight !== -1) {\n                  navigate(\n                    results[highlightedIndex]?.document?.location ?? searchLink,\n                  );\n                }\n                setHighlightedIndex(-1);\n              }\n            }}\n            renderInput={params => (\n              <SearchInput\n                params={params}\n                error={!!error}\n                helperText={error ? 'Error fetching results' : ''}\n              />\n            )}\n            renderOption={(renderProps, option, { index }) => (\n              <SearchOption\n                option={option}\n                index={index}\n                options={options}\n                query={query}\n                results={results}\n                renderProps={renderProps}\n                searchLink={searchLink}\n              />\n            )}\n            ListboxProps={{\n              sx: { maxHeight: '60vh' },\n            }}\n          />\n        );\n      }}\n    </SearchResultState>\n  );\n};\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"SearchBar.esm.js","sources":["../../../src/components/SearchComponent/SearchBar.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, useRef, useState } from 'react';\nimport {\n  SearchResultState,\n  SearchResultProps,\n  useSearch,\n} from '@backstage/plugin-search-react';\nimport Autocomplete from '@mui/material/Autocomplete';\nimport { createSearchLink } from '../../utils/stringUtils';\nimport { useNavigate } from 'react-router-dom';\nimport { SearchInput } from './SearchInput';\nimport { SearchOption } from './SearchOption';\nimport { useTheme } from '@mui/material/styles';\nimport { useDebouncedCallback } from '../../hooks/useDebouncedCallback';\n\ninterface SearchBarProps {\n  query: SearchResultProps['query'];\n  setSearchTerm: (term: string) => void;\n}\nexport const SearchBar = (props: SearchBarProps) => {\n  const { query, setSearchTerm } = props;\n  const navigate = useNavigate();\n  const theme = useTheme();\n  const [highlightedIndex, setHighlightedIndex] = useState(-1);\n  const highlightedIndexRef = useRef(highlightedIndex);\n  const { setTerm } = useSearch();\n\n  const onInputChange = useDebouncedCallback((_, inputValue) => {\n    setSearchTerm(inputValue);\n    setTerm(inputValue);\n  }, 300);\n\n  useEffect(() => {\n    highlightedIndexRef.current = highlightedIndex;\n  }, [highlightedIndex]);\n\n  return (\n    <SearchResultState {...props}>\n      {({ loading, error, value }) => {\n        const results = query?.term ? value?.results ?? [] : [];\n        let options: string[] = [];\n        if (query?.term && results.length === 0) {\n          options = ['No results found'];\n        }\n        if (results.length > 0) {\n          options = [\n            ...results.map(result => result.document.title),\n            `${query?.term}`,\n          ];\n        }\n        const searchLink = createSearchLink(query?.term ?? '');\n\n        return (\n          <Autocomplete\n            freeSolo\n            options={options}\n            loading={loading}\n            value={query?.term ?? ''}\n            getOptionLabel={option => option ?? ''}\n            onInputChange={onInputChange}\n            onHighlightChange={(_, option) =>\n              setHighlightedIndex(options.indexOf(option ?? ''))\n            }\n            componentsProps={{\n              paper: {\n                sx: {\n                  '&:empty': { visibility: 'hidden' }, // Removes underline-like effect\n                  borderRadius: '4px',\n                  outline: 'unset',\n                  boxShadow:\n                    theme.palette.mode === 'dark'\n                      ? `0 2px 6px 2px rgba(0, 0, 0, 0.50), 0 1px 2px 0 rgba(0, 0, 0, 0.50)`\n                      : '0 2px 6px 2px rgba(0, 0, 0, 0.15), 0 1px 2px 0 rgba(0, 0, 0, 0.30)',\n                },\n              },\n            }}\n            sx={{\n              width: '100%',\n              '& [class*=\"MuiAutocomplete-clearIndicator\"]': {\n                visibility: query?.term ? 'visible' : 'hidden',\n              },\n            }}\n            filterOptions={x => x}\n            onKeyDown={event => {\n              const currentHighlight = highlightedIndexRef.current;\n              if (event.key === 'Enter') {\n                event.preventDefault();\n                if (currentHighlight === -1 && query?.term) {\n                  navigate(searchLink);\n                } else if (currentHighlight !== -1) {\n                  navigate(\n                    results[highlightedIndex]?.document?.location ?? searchLink,\n                  );\n                }\n                setHighlightedIndex(-1);\n              }\n            }}\n            renderInput={params => (\n              <SearchInput\n                params={params}\n                error={!!error}\n                helperText={error ? 'Error fetching results' : ''}\n              />\n            )}\n            renderOption={(renderProps, option, { index }) => (\n              <SearchOption\n                option={option}\n                index={index}\n                options={options}\n                query={query}\n                results={results}\n                renderProps={renderProps}\n                searchLink={searchLink}\n              />\n            )}\n            ListboxProps={{\n              sx: { maxHeight: '60vh' },\n            }}\n          />\n        );\n      }}\n    </SearchResultState>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/SearchComponent/SearchComponent.esm.js

@@ -1,11 +1,12 @@
-import React, { useState } from 'react';
+import { jsx } from 'react/jsx-runtime';
+import { useState } from 'react';
 import Box from '@mui/material/Box';
 import { SearchBar } from './SearchBar.esm.js';
 import { SearchContextProvider } from '@backstage/plugin-search-react';
 
 const SearchComponent = () => {
   const [searchTerm, setSearchTerm] = useState("");
-  return /* @__PURE__ */ React.createElement(SearchContextProvider, null, /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(SearchContextProvider, { children: /* @__PURE__ */ jsx(
     Box,
     {
       sx: {
@@ -15,10 +16,10 @@ const SearchComponent = () => {
         flexDirection: "row",
         justifyContent: "start",
         direction: "ltr"
-      }
-    },
-    /* @__PURE__ */ React.createElement(SearchBar, { query: { term: searchTerm }, setSearchTerm })
-  ));
+      },
+      children: /* @__PURE__ */ jsx(SearchBar, { query: { term: searchTerm }, setSearchTerm })
+    }
+  ) });
 };
 
 export { SearchComponent };