@backstage-community/plugin-cost-insights 0.15.2 → 0.17.0

package/dist/components/AlertInsights/AlertDialog.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertDialog.esm.js","sources":["../../../src/components/AlertInsights/AlertDialog.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 { capitalize } from '@material-ui/core/utils';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Divider from '@material-ui/core/Divider';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport IconButton from '@material-ui/core/IconButton';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport Typography from '@material-ui/core/Typography';\nimport { default as CloseIcon } from '@material-ui/icons/Close';\nimport { useAlertDialogStyles as useStyles } from '../../utils/styles';\nimport { Alert, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport { choose, formOf } from '../../utils/alerts';\n\nconst DEFAULT_FORM_ID = 'alert-form';\n\ntype AlertDialogProps = {\n  open: boolean;\n  group: string;\n  alert: Maybe<Alert>;\n  status: Maybe<AlertStatus>;\n  onClose: () => void;\n  onSubmit: (data: any) => void;\n};\n\nexport const AlertDialog = ({\n  open,\n  group,\n  alert,\n  status,\n  onClose,\n  onSubmit,\n}: AlertDialogProps) => {\n  const classes = useStyles();\n  const [isSubmitDisabled, setSubmitDisabled] = useState(true);\n  const formRef = useRef<Maybe<HTMLFormElement>>(null);\n\n  useEffect(() => {\n    setSubmitDisabled(open);\n  }, [open]);\n\n  function disableSubmit(isDisabled: boolean) {\n    setSubmitDisabled(isDisabled);\n  }\n\n  function onDialogClose() {\n    onClose();\n    setSubmitDisabled(true);\n  }\n\n  const [action, actioned] = choose(\n    status,\n    [\n      ['snooze', 'snoozed'],\n      ['accept', 'accepted'],\n      ['dismiss', 'dismissed'],\n    ],\n    ['', ''],\n  );\n\n  const TransitionProps = {\n    mountOnEnter: true,\n    unmountOnExit: true,\n    onEntered() {\n      if (formRef.current) {\n        formRef.current.id = DEFAULT_FORM_ID;\n      }\n    },\n  };\n\n  const Form = formOf(alert, status);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onDialogClose}\n      scroll=\"body\"\n      maxWidth=\"lg\"\n      TransitionProps={TransitionProps}\n    >\n      <Box display=\"flex\" justifyContent=\"flex-end\">\n        <IconButton\n          className={classes.icon}\n          disableRipple\n          aria-label=\"Close\"\n          onClick={onDialogClose}\n        >\n          <CloseIcon />\n        </IconButton>\n      </Box>\n      <DialogContent className={classes.content}>\n        <Box mb={1.5}>\n          <Typography variant=\"h5\">\n            <b>{capitalize(action)} this action item?</b>\n          </Typography>\n          <Typography variant=\"h6\" color=\"textSecondary\">\n            <b>\n              This action item will be {actioned} for all of {group}.\n            </b>\n          </Typography>\n        </Box>\n        <Box\n          display=\"flex\"\n          flexDirection=\"column\"\n          bgcolor=\"alertBackground\"\n          p={2}\n          mb={1.5}\n          borderRadius={4}\n        >\n          <Typography>\n            <b>{alert?.title}</b>\n          </Typography>\n          <Typography color=\"textSecondary\">{alert?.subtitle}</Typography>\n        </Box>\n        {Form && (\n          <Form\n            ref={formRef}\n            alert={alert}\n            onSubmit={onSubmit}\n            disableSubmit={disableSubmit}\n          />\n        )}\n      </DialogContent>\n      <Divider />\n      <DialogActions className={classes.actions} disableSpacing>\n        {Form ? (\n          <Button\n            type=\"submit\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            form={DEFAULT_FORM_ID}\n            disabled={isSubmitDisabled}\n          >\n            {capitalize(action)}\n          </Button>\n        ) : (\n          <Button\n            type=\"button\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            onClick={() => onSubmit(null)}\n          >\n            {capitalize(action)}\n          </Button>\n        )}\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":["useStyles"],"mappings":"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"}
+{"version":3,"file":"AlertDialog.esm.js","sources":["../../../src/components/AlertInsights/AlertDialog.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 { capitalize } from '@material-ui/core/utils';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Divider from '@material-ui/core/Divider';\nimport Dialog from '@material-ui/core/Dialog';\nimport DialogActions from '@material-ui/core/DialogActions';\nimport IconButton from '@material-ui/core/IconButton';\nimport DialogContent from '@material-ui/core/DialogContent';\nimport Typography from '@material-ui/core/Typography';\nimport { default as CloseIcon } from '@material-ui/icons/Close';\nimport { useAlertDialogStyles as useStyles } from '../../utils/styles';\nimport { Alert, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport { choose, formOf } from '../../utils/alerts';\n\nconst DEFAULT_FORM_ID = 'alert-form';\n\ntype AlertDialogProps = {\n  open: boolean;\n  group: string;\n  alert: Maybe<Alert>;\n  status: Maybe<AlertStatus>;\n  onClose: () => void;\n  onSubmit: (data: any) => void;\n};\n\nexport const AlertDialog = ({\n  open,\n  group,\n  alert,\n  status,\n  onClose,\n  onSubmit,\n}: AlertDialogProps) => {\n  const classes = useStyles();\n  const [isSubmitDisabled, setSubmitDisabled] = useState(true);\n  const formRef = useRef<Maybe<HTMLFormElement>>(null);\n\n  useEffect(() => {\n    setSubmitDisabled(open);\n  }, [open]);\n\n  function disableSubmit(isDisabled: boolean) {\n    setSubmitDisabled(isDisabled);\n  }\n\n  function onDialogClose() {\n    onClose();\n    setSubmitDisabled(true);\n  }\n\n  const [action, actioned] = choose(\n    status,\n    [\n      ['snooze', 'snoozed'],\n      ['accept', 'accepted'],\n      ['dismiss', 'dismissed'],\n    ],\n    ['', ''],\n  );\n\n  const TransitionProps = {\n    mountOnEnter: true,\n    unmountOnExit: true,\n    onEntered() {\n      if (formRef.current) {\n        formRef.current.id = DEFAULT_FORM_ID;\n      }\n    },\n  };\n\n  const Form = formOf(alert, status);\n\n  return (\n    <Dialog\n      open={open}\n      onClose={onDialogClose}\n      scroll=\"body\"\n      maxWidth=\"lg\"\n      TransitionProps={TransitionProps}\n    >\n      <Box display=\"flex\" justifyContent=\"flex-end\">\n        <IconButton\n          className={classes.icon}\n          disableRipple\n          aria-label=\"Close\"\n          onClick={onDialogClose}\n        >\n          <CloseIcon />\n        </IconButton>\n      </Box>\n      <DialogContent className={classes.content}>\n        <Box mb={1.5}>\n          <Typography variant=\"h5\">\n            <b>{capitalize(action)} this action item?</b>\n          </Typography>\n          <Typography variant=\"h6\" color=\"textSecondary\">\n            <b>\n              This action item will be {actioned} for all of {group}.\n            </b>\n          </Typography>\n        </Box>\n        <Box\n          display=\"flex\"\n          flexDirection=\"column\"\n          bgcolor=\"alertBackground\"\n          p={2}\n          mb={1.5}\n          borderRadius={4}\n        >\n          <Typography>\n            <b>{alert?.title}</b>\n          </Typography>\n          <Typography color=\"textSecondary\">{alert?.subtitle}</Typography>\n        </Box>\n        {Form && (\n          <Form\n            ref={formRef}\n            alert={alert}\n            onSubmit={onSubmit}\n            disableSubmit={disableSubmit}\n          />\n        )}\n      </DialogContent>\n      <Divider />\n      <DialogActions className={classes.actions} disableSpacing>\n        {Form ? (\n          <Button\n            type=\"submit\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            form={DEFAULT_FORM_ID}\n            disabled={isSubmitDisabled}\n          >\n            {capitalize(action)}\n          </Button>\n        ) : (\n          <Button\n            type=\"button\"\n            color=\"primary\"\n            variant=\"contained\"\n            aria-label={action}\n            onClick={() => onSubmit(null)}\n          >\n            {capitalize(action)}\n          </Button>\n        )}\n      </DialogActions>\n    </Dialog>\n  );\n};\n"],"names":["useStyles"],"mappings":"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"}

package/dist/components/AlertInsights/AlertInsights.esm.js

@@ -1,4 +1,5 @@
-import React, { useState, useEffect } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { useState, useEffect } from 'react';
 import pluralize from 'pluralize';
 import Box from '@material-ui/core/Box';
 import Grid from '@material-ui/core/Grid';
@@ -108,49 +109,61 @@ const AlertInsights = ({
   const total = [accepted, snoozed, dismissed].reduce(sumOfAllAlerts, 0);
   const isAlertStatusSummaryDisplayed = !!total;
   const isAlertInsightSectionDisplayed = !!active.length;
-  return /* @__PURE__ */ React.createElement(Grid, { container: true, direction: "column", spacing: 2 }, /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(
-    AlertInsightsHeader,
-    {
-      title: "Your team's action items",
-      subtitle: isAlertInsightSectionDisplayed ? "This section outlines suggested action items your team can address to improve cloud costs." : "All of your team's action items are hidden. Maybe it's time to give them another look?"
-    }
-  )), isAlertInsightSectionDisplayed && /* @__PURE__ */ React.createElement(Grid, { item: true, container: true, direction: "column", spacing: 4 }, active.map((activeAlert, index) => /* @__PURE__ */ React.createElement(Grid, { item: true, key: `alert-insights-section-${index}` }, /* @__PURE__ */ React.createElement(
-    AlertInsightsSection,
-    {
-      alert: activeAlert,
-      number: index + 1,
-      onSnooze,
-      onAccept,
-      onDismiss
-    }
-  )))), isAlertStatusSummaryDisplayed && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Box, { position: "relative", display: "flex", justifyContent: "flex-end" }, /* @__PURE__ */ React.createElement(ScrollAnchor, { id: ScrollType.AlertSummary }), /* @__PURE__ */ React.createElement(AlertStatusSummaryButton, { onClick: onSummaryButtonClick }, pluralize("Hidden Action Item", total))), /* @__PURE__ */ React.createElement(
-    AlertStatusSummary,
-    {
-      open: isSummaryOpen,
-      snoozed,
-      accepted,
-      dismissed
-    }
-  )), /* @__PURE__ */ React.createElement(
-    AlertDialog,
-    {
-      group,
-      open: isDialogOpen,
-      alert,
-      status,
-      onClose: onDialogClose,
-      onSubmit: onDialogFormSubmit
-    }
-  ), /* @__PURE__ */ React.createElement(
-    Snackbar,
-    {
-      open: isSnackbarOpen,
-      autoHideDuration: 6e3,
-      anchorOrigin: { vertical: "top", horizontal: "center" },
-      onClose: onSnackbarClose
-    },
-    /* @__PURE__ */ React.createElement(Alert, { onClose: onSnackbarClose, severity: "error" }, error?.message)
-  ));
+  return /* @__PURE__ */ jsxs(Grid, { container: true, direction: "column", spacing: 2, children: [
+    /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+      AlertInsightsHeader,
+      {
+        title: "Your team's action items",
+        subtitle: isAlertInsightSectionDisplayed ? "This section outlines suggested action items your team can address to improve cloud costs." : "All of your team's action items are hidden. Maybe it's time to give them another look?"
+      }
+    ) }),
+    isAlertInsightSectionDisplayed && /* @__PURE__ */ jsx(Grid, { item: true, container: true, direction: "column", spacing: 4, children: active.map((activeAlert, index) => /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(
+      AlertInsightsSection,
+      {
+        alert: activeAlert,
+        number: index + 1,
+        onSnooze,
+        onAccept,
+        onDismiss
+      }
+    ) }, `alert-insights-section-${index}`)) }),
+    isAlertStatusSummaryDisplayed && /* @__PURE__ */ jsxs(Grid, { item: true, children: [
+      /* @__PURE__ */ jsxs(Box, { position: "relative", display: "flex", justifyContent: "flex-end", children: [
+        /* @__PURE__ */ jsx(ScrollAnchor, { id: ScrollType.AlertSummary }),
+        /* @__PURE__ */ jsx(AlertStatusSummaryButton, { onClick: onSummaryButtonClick, children: pluralize("Hidden Action Item", total) })
+      ] }),
+      /* @__PURE__ */ jsx(
+        AlertStatusSummary,
+        {
+          open: isSummaryOpen,
+          snoozed,
+          accepted,
+          dismissed
+        }
+      )
+    ] }),
+    /* @__PURE__ */ jsx(
+      AlertDialog,
+      {
+        group,
+        open: isDialogOpen,
+        alert,
+        status,
+        onClose: onDialogClose,
+        onSubmit: onDialogFormSubmit
+      }
+    ),
+    /* @__PURE__ */ jsx(
+      Snackbar,
+      {
+        open: isSnackbarOpen,
+        autoHideDuration: 6e3,
+        anchorOrigin: { vertical: "top", horizontal: "center" },
+        onClose: onSnackbarClose,
+        children: /* @__PURE__ */ jsx(Alert, { onClose: onSnackbarClose, severity: "error", children: error?.message })
+      }
+    )
+  ] });
 };
 
 export { AlertInsights };

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

@@ -1 +1 @@
-{"version":3,"file":"AlertInsights.esm.js","sources":["../../../src/components/AlertInsights/AlertInsights.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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, useState } from 'react';\nimport pluralize from 'pluralize';\nimport Box from '@material-ui/core/Box';\nimport Grid from '@material-ui/core/Grid';\nimport Snackbar from '@material-ui/core/Snackbar';\nimport { default as MuiAlert } from '@material-ui/lab/Alert';\nimport { AlertDialog } from './AlertDialog';\nimport { AlertStatusSummary } from './AlertStatusSummary';\nimport { AlertStatusSummaryButton } from './AlertStatusSummaryButton';\nimport { AlertInsightsHeader } from './AlertInsightsHeader';\nimport { AlertInsightsSection } from './AlertInsightsSection';\nimport {\n  useScroll,\n  useLoading,\n  ScrollType,\n  MapLoadingToProps,\n} from '../../hooks';\nimport { DefaultLoadingAction } from '../../utils/loading';\nimport { Alert, AlertOptions, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport {\n  isStatusSnoozed,\n  isStatusAccepted,\n  isStatusDismissed,\n  sumOfAllAlerts,\n} from '../../utils/alerts';\nimport { ScrollAnchor } from '../../utils/scroll';\n\ntype MapLoadingtoAlerts = (isLoading: boolean) => void;\n\nconst mapLoadingToAlerts: MapLoadingToProps<MapLoadingtoAlerts> =\n  ({ dispatch }) =>\n  (isLoading: boolean) =>\n    dispatch({ [DefaultLoadingAction.CostInsightsAlerts]: isLoading });\n\ntype AlertInsightsProps = {\n  group: string;\n  active: Alert[];\n  snoozed: Alert[];\n  accepted: Alert[];\n  dismissed: Alert[];\n  onChange: (alerts: Alert[]) => void;\n};\n\nexport const AlertInsights = ({\n  group,\n  active,\n  snoozed,\n  accepted,\n  dismissed,\n  onChange,\n}: AlertInsightsProps) => {\n  const [scroll] = useScroll();\n  const [alert, setAlert] = useState<Maybe<Alert>>(null);\n  const dispatchLoadingAlerts = useLoading(mapLoadingToAlerts);\n  const [status, setStatus] = useState<Maybe<AlertStatus>>(null);\n  // Allow users to pass null values for data.\n  const [data, setData] = useState<Maybe<any>>(undefined);\n  const [error, setError] = useState<Maybe<Error>>(null);\n  const [isDialogOpen, setDialogOpen] = useState(false);\n  const [isSummaryOpen, setSummaryOpen] = useState(false);\n  const [isSnackbarOpen, setSnackbarOpen] = useState(false);\n\n  useEffect(() => {\n    async function callAlertHook(\n      options: AlertOptions,\n      callback: (options: AlertOptions) => Promise<Alert[]>,\n    ) {\n      setAlert(null);\n      setStatus(null);\n      setData(undefined);\n      setDialogOpen(false);\n      dispatchLoadingAlerts(true);\n      try {\n        const alerts: Alert[] = await callback(options);\n        onChange(alerts);\n      } catch (e) {\n        setError(e);\n      } finally {\n        dispatchLoadingAlerts(false);\n      }\n    }\n\n    const options: AlertOptions = { data, group };\n    const onSnoozed = alert?.onSnoozed?.bind(alert);\n    const onAccepted = alert?.onAccepted?.bind(alert);\n    const onDismissed = alert?.onDismissed?.bind(alert);\n\n    if (data !== undefined) {\n      if (isStatusSnoozed(status) && onSnoozed) {\n        callAlertHook(options, onSnoozed);\n      } else if (isStatusAccepted(status) && onAccepted) {\n        callAlertHook(options, onAccepted);\n      } else if (isStatusDismissed(status) && onDismissed) {\n        callAlertHook(options, onDismissed);\n      }\n    }\n  }, [group, data, alert, status, onChange, dispatchLoadingAlerts]);\n\n  useEffect(() => {\n    if (scroll === ScrollType.AlertSummary) {\n      setSummaryOpen(true);\n    }\n  }, [scroll]);\n\n  useEffect(() => {\n    setDialogOpen(!!status);\n  }, [status]);\n\n  useEffect(() => {\n    setSnackbarOpen(!!error);\n  }, [error]);\n\n  function onSnooze(alertToSnooze: Alert) {\n    setAlert(alertToSnooze);\n    setStatus(AlertStatus.Snoozed);\n  }\n\n  function onAccept(alertToAccept: Alert) {\n    setAlert(alertToAccept);\n    setStatus(AlertStatus.Accepted);\n  }\n\n  function onDismiss(alertToDismiss: Alert) {\n    setAlert(alertToDismiss);\n    setStatus(AlertStatus.Dismissed);\n  }\n\n  function onSnackbarClose() {\n    setError(null);\n  }\n\n  function onDialogClose() {\n    setAlert(null);\n    setStatus(null);\n  }\n\n  function onDialogFormSubmit(formData: any) {\n    setData(formData);\n  }\n\n  function onSummaryButtonClick() {\n    setSummaryOpen(prevOpen => !prevOpen);\n  }\n\n  const total = [accepted, snoozed, dismissed].reduce(sumOfAllAlerts, 0);\n\n  const isAlertStatusSummaryDisplayed = !!total;\n  const isAlertInsightSectionDisplayed = !!active.length;\n\n  return (\n    <Grid container direction=\"column\" spacing={2}>\n      <Grid item>\n        <AlertInsightsHeader\n          title=\"Your team's action items\"\n          subtitle={\n            isAlertInsightSectionDisplayed\n              ? 'This section outlines suggested action items your team can address to improve cloud costs.'\n              : \"All of your team's action items are hidden. Maybe it's time to give them another look?\"\n          }\n        />\n      </Grid>\n      {isAlertInsightSectionDisplayed && (\n        <Grid item container direction=\"column\" spacing={4}>\n          {active.map((activeAlert, index) => (\n            <Grid item key={`alert-insights-section-${index}`}>\n              <AlertInsightsSection\n                alert={activeAlert}\n                number={index + 1}\n                onSnooze={onSnooze}\n                onAccept={onAccept}\n                onDismiss={onDismiss}\n              />\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      {isAlertStatusSummaryDisplayed && (\n        <Grid item>\n          <Box position=\"relative\" display=\"flex\" justifyContent=\"flex-end\">\n            <ScrollAnchor id={ScrollType.AlertSummary} />\n            <AlertStatusSummaryButton onClick={onSummaryButtonClick}>\n              {pluralize('Hidden Action Item', total)}\n            </AlertStatusSummaryButton>\n          </Box>\n          <AlertStatusSummary\n            open={isSummaryOpen}\n            snoozed={snoozed}\n            accepted={accepted}\n            dismissed={dismissed}\n          />\n        </Grid>\n      )}\n      <AlertDialog\n        group={group}\n        open={isDialogOpen}\n        alert={alert}\n        status={status}\n        onClose={onDialogClose}\n        onSubmit={onDialogFormSubmit}\n      />\n      <Snackbar\n        open={isSnackbarOpen}\n        autoHideDuration={6_000}\n        anchorOrigin={{ vertical: 'top', horizontal: 'center' }}\n        onClose={onSnackbarClose}\n      >\n        <MuiAlert onClose={onSnackbarClose} severity=\"error\">\n          {error?.message}\n        </MuiAlert>\n      </Snackbar>\n    </Grid>\n  );\n};\n"],"names":["options","MuiAlert"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;AA8CA,MAAM,kBACJ,GAAA,CAAC,EAAE,QAAA,OACH,CAAC,SAAA,KACC,QAAS,CAAA,EAAE,CAAC,oBAAA,CAAqB,kBAAkB,GAAG,WAAW,CAAA;AAW9D,MAAM,gBAAgB,CAAC;AAAA,EAC5B,KAAA;AAAA,EACA,MAAA;AAAA,EACA,OAAA;AAAA,EACA,QAAA;AAAA,EACA,SAAA;AAAA,EACA;AACF,CAA0B,KAAA;AACxB,EAAM,MAAA,CAAC,MAAM,CAAA,GAAI,SAAU,EAAA;AAC3B,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAuB,IAAI,CAAA;AACrD,EAAM,MAAA,qBAAA,GAAwB,WAAW,kBAAkB,CAAA;AAC3D,EAAA,MAAM,CAAC,MAAA,EAAQ,SAAS,CAAA,GAAI,SAA6B,IAAI,CAAA;AAE7D,EAAA,MAAM,CAAC,IAAA,EAAM,OAAO,CAAA,GAAI,SAAqB,KAAS,CAAA,CAAA;AACtD,EAAA,MAAM,CAAC,KAAA,EAAO,QAAQ,CAAA,GAAI,SAAuB,IAAI,CAAA;AACrD,EAAA,MAAM,CAAC,YAAA,EAAc,aAAa,CAAA,GAAI,SAAS,KAAK,CAAA;AACpD,EAAA,MAAM,CAAC,aAAA,EAAe,cAAc,CAAA,GAAI,SAAS,KAAK,CAAA;AACtD,EAAA,MAAM,CAAC,cAAA,EAAgB,eAAe,CAAA,GAAI,SAAS,KAAK,CAAA;AAExD,EAAA,SAAA,CAAU,MAAM;AACd,IAAe,eAAA,aAAA,CACbA,UACA,QACA,EAAA;AACA,MAAA,QAAA,CAAS,IAAI,CAAA;AACb,MAAA,SAAA,CAAU,IAAI,CAAA;AACd,MAAA,OAAA,CAAQ,KAAS,CAAA,CAAA;AACjB,MAAA,aAAA,CAAc,KAAK,CAAA;AACnB,MAAA,qBAAA,CAAsB,IAAI,CAAA;AAC1B,MAAI,IAAA;AACF,QAAM,MAAA,MAAA,GAAkB,MAAM,QAAA,CAASA,QAAO,CAAA;AAC9C,QAAA,QAAA,CAAS,MAAM,CAAA;AAAA,eACR,CAAG,EAAA;AACV,QAAA,QAAA,CAAS,CAAC,CAAA;AAAA,OACV,SAAA;AACA,QAAA,qBAAA,CAAsB,KAAK,CAAA;AAAA;AAC7B;AAGF,IAAM,MAAA,OAAA,GAAwB,EAAE,IAAA,EAAM,KAAM,EAAA;AAC5C,IAAA,MAAM,SAAY,GAAA,KAAA,EAAO,SAAW,EAAA,IAAA,CAAK,KAAK,CAAA;AAC9C,IAAA,MAAM,UAAa,GAAA,KAAA,EAAO,UAAY,EAAA,IAAA,CAAK,KAAK,CAAA;AAChD,IAAA,MAAM,WAAc,GAAA,KAAA,EAAO,WAAa,EAAA,IAAA,CAAK,KAAK,CAAA;AAElD,IAAA,IAAI,SAAS,KAAW,CAAA,EAAA;AACtB,MAAI,IAAA,eAAA,CAAgB,MAAM,CAAA,IAAK,SAAW,EAAA;AACxC,QAAA,aAAA,CAAc,SAAS,SAAS,CAAA;AAAA,OACvB,MAAA,IAAA,gBAAA,CAAiB,MAAM,CAAA,IAAK,UAAY,EAAA;AACjD,QAAA,aAAA,CAAc,SAAS,UAAU,CAAA;AAAA,OACxB,MAAA,IAAA,iBAAA,CAAkB,MAAM,CAAA,IAAK,WAAa,EAAA;AACnD,QAAA,aAAA,CAAc,SAAS,WAAW,CAAA;AAAA;AACpC;AACF,GACF,EAAG,CAAC,KAAO,EAAA,IAAA,EAAM,OAAO,MAAQ,EAAA,QAAA,EAAU,qBAAqB,CAAC,CAAA;AAEhE,EAAA,SAAA,CAAU,MAAM;AACd,IAAI,IAAA,MAAA,KAAW,WAAW,YAAc,EAAA;AACtC,MAAA,cAAA,CAAe,IAAI,CAAA;AAAA;AACrB,GACF,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,SAAA,CAAU,MAAM;AACd,IAAc,aAAA,CAAA,CAAC,CAAC,MAAM,CAAA;AAAA,GACxB,EAAG,CAAC,MAAM,CAAC,CAAA;AAEX,EAAA,SAAA,CAAU,MAAM;AACd,IAAgB,eAAA,CAAA,CAAC,CAAC,KAAK,CAAA;AAAA,GACzB,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,SAAS,SAAS,aAAsB,EAAA;AACtC,IAAA,QAAA,CAAS,aAAa,CAAA;AACtB,IAAA,SAAA,CAAU,YAAY,OAAO,CAAA;AAAA;AAG/B,EAAA,SAAS,SAAS,aAAsB,EAAA;AACtC,IAAA,QAAA,CAAS,aAAa,CAAA;AACtB,IAAA,SAAA,CAAU,YAAY,QAAQ,CAAA;AAAA;AAGhC,EAAA,SAAS,UAAU,cAAuB,EAAA;AACxC,IAAA,QAAA,CAAS,cAAc,CAAA;AACvB,IAAA,SAAA,CAAU,YAAY,SAAS,CAAA;AAAA;AAGjC,EAAA,SAAS,eAAkB,GAAA;AACzB,IAAA,QAAA,CAAS,IAAI,CAAA;AAAA;AAGf,EAAA,SAAS,aAAgB,GAAA;AACvB,IAAA,QAAA,CAAS,IAAI,CAAA;AACb,IAAA,SAAA,CAAU,IAAI,CAAA;AAAA;AAGhB,EAAA,SAAS,mBAAmB,QAAe,EAAA;AACzC,IAAA,OAAA,CAAQ,QAAQ,CAAA;AAAA;AAGlB,EAAA,SAAS,oBAAuB,GAAA;AAC9B,IAAe,cAAA,CAAA,CAAA,QAAA,KAAY,CAAC,QAAQ,CAAA;AAAA;AAGtC,EAAM,MAAA,KAAA,GAAQ,CAAC,QAAU,EAAA,OAAA,EAAS,SAAS,CAAE,CAAA,MAAA,CAAO,gBAAgB,CAAC,CAAA;AAErE,EAAM,MAAA,6BAAA,GAAgC,CAAC,CAAC,KAAA;AACxC,EAAM,MAAA,8BAAA,GAAiC,CAAC,CAAC,MAAO,CAAA,MAAA;AAEhD,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,SAAA,EAAS,IAAC,EAAA,SAAA,EAAU,QAAS,EAAA,OAAA,EAAS,CAC1C,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IACR,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,mBAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,0BAAA;AAAA,MACN,QAAA,EACE,iCACI,4FACA,GAAA;AAAA;AAAA,GAGV,CACC,EAAA,8BAAA,oBACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IAAC,EAAA,SAAA,EAAS,IAAC,EAAA,SAAA,EAAU,QAAS,EAAA,OAAA,EAAS,KAC9C,MAAO,CAAA,GAAA,CAAI,CAAC,WAAA,EAAa,KACxB,qBAAA,KAAA,CAAA,aAAA,CAAC,IAAK,EAAA,EAAA,IAAA,EAAI,IAAC,EAAA,GAAA,EAAK,CAA0B,uBAAA,EAAA,KAAK,CAC7C,CAAA,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,oBAAA;AAAA,IAAA;AAAA,MACC,KAAO,EAAA,WAAA;AAAA,MACP,QAAQ,KAAQ,GAAA,CAAA;AAAA,MAChB,QAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GAEJ,CACD,CACH,CAAA,EAED,iDACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAI,EAAA,IAAA,EAAA,kBACP,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,QAAS,EAAA,UAAA,EAAW,SAAQ,MAAO,EAAA,cAAA,EAAe,UACrD,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,YAAa,EAAA,EAAA,EAAA,EAAI,UAAW,CAAA,YAAA,EAAc,mBAC1C,KAAA,CAAA,aAAA,CAAA,wBAAA,EAAA,EAAyB,OAAS,EAAA,oBAAA,EAAA,EAChC,SAAU,CAAA,oBAAA,EAAsB,KAAK,CACxC,CACF,CACA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,IAAM,EAAA,aAAA;AAAA,MACN,OAAA;AAAA,MACA,QAAA;AAAA,MACA;AAAA;AAAA,GAEJ,CAEF,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,WAAA;AAAA,IAAA;AAAA,MACC,KAAA;AAAA,MACA,IAAM,EAAA,YAAA;AAAA,MACN,KAAA;AAAA,MACA,MAAA;AAAA,MACA,OAAS,EAAA,aAAA;AAAA,MACT,QAAU,EAAA;AAAA;AAAA,GAEZ,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,QAAA;AAAA,IAAA;AAAA,MACC,IAAM,EAAA,cAAA;AAAA,MACN,gBAAkB,EAAA,GAAA;AAAA,MAClB,YAAc,EAAA,EAAE,QAAU,EAAA,KAAA,EAAO,YAAY,QAAS,EAAA;AAAA,MACtD,OAAS,EAAA;AAAA,KAAA;AAAA,wCAERC,KAAS,EAAA,EAAA,OAAA,EAAS,iBAAiB,QAAS,EAAA,OAAA,EAAA,EAC1C,OAAO,OACV;AAAA,GAEJ,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AlertInsights.esm.js","sources":["../../../src/components/AlertInsights/AlertInsights.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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, useState } from 'react';\nimport pluralize from 'pluralize';\nimport Box from '@material-ui/core/Box';\nimport Grid from '@material-ui/core/Grid';\nimport Snackbar from '@material-ui/core/Snackbar';\nimport { default as MuiAlert } from '@material-ui/lab/Alert';\nimport { AlertDialog } from './AlertDialog';\nimport { AlertStatusSummary } from './AlertStatusSummary';\nimport { AlertStatusSummaryButton } from './AlertStatusSummaryButton';\nimport { AlertInsightsHeader } from './AlertInsightsHeader';\nimport { AlertInsightsSection } from './AlertInsightsSection';\nimport {\n  useScroll,\n  useLoading,\n  ScrollType,\n  MapLoadingToProps,\n} from '../../hooks';\nimport { DefaultLoadingAction } from '../../utils/loading';\nimport { Alert, AlertOptions, AlertStatus } from '../../types';\nimport { Maybe } from '@backstage-community/plugin-cost-insights-common';\nimport {\n  isStatusSnoozed,\n  isStatusAccepted,\n  isStatusDismissed,\n  sumOfAllAlerts,\n} from '../../utils/alerts';\nimport { ScrollAnchor } from '../../utils/scroll';\n\ntype MapLoadingtoAlerts = (isLoading: boolean) => void;\n\nconst mapLoadingToAlerts: MapLoadingToProps<MapLoadingtoAlerts> =\n  ({ dispatch }) =>\n  (isLoading: boolean) =>\n    dispatch({ [DefaultLoadingAction.CostInsightsAlerts]: isLoading });\n\ntype AlertInsightsProps = {\n  group: string;\n  active: Alert[];\n  snoozed: Alert[];\n  accepted: Alert[];\n  dismissed: Alert[];\n  onChange: (alerts: Alert[]) => void;\n};\n\nexport const AlertInsights = ({\n  group,\n  active,\n  snoozed,\n  accepted,\n  dismissed,\n  onChange,\n}: AlertInsightsProps) => {\n  const [scroll] = useScroll();\n  const [alert, setAlert] = useState<Maybe<Alert>>(null);\n  const dispatchLoadingAlerts = useLoading(mapLoadingToAlerts);\n  const [status, setStatus] = useState<Maybe<AlertStatus>>(null);\n  // Allow users to pass null values for data.\n  const [data, setData] = useState<Maybe<any>>(undefined);\n  const [error, setError] = useState<Maybe<Error>>(null);\n  const [isDialogOpen, setDialogOpen] = useState(false);\n  const [isSummaryOpen, setSummaryOpen] = useState(false);\n  const [isSnackbarOpen, setSnackbarOpen] = useState(false);\n\n  useEffect(() => {\n    async function callAlertHook(\n      options: AlertOptions,\n      callback: (options: AlertOptions) => Promise<Alert[]>,\n    ) {\n      setAlert(null);\n      setStatus(null);\n      setData(undefined);\n      setDialogOpen(false);\n      dispatchLoadingAlerts(true);\n      try {\n        const alerts: Alert[] = await callback(options);\n        onChange(alerts);\n      } catch (e) {\n        setError(e);\n      } finally {\n        dispatchLoadingAlerts(false);\n      }\n    }\n\n    const options: AlertOptions = { data, group };\n    const onSnoozed = alert?.onSnoozed?.bind(alert);\n    const onAccepted = alert?.onAccepted?.bind(alert);\n    const onDismissed = alert?.onDismissed?.bind(alert);\n\n    if (data !== undefined) {\n      if (isStatusSnoozed(status) && onSnoozed) {\n        callAlertHook(options, onSnoozed);\n      } else if (isStatusAccepted(status) && onAccepted) {\n        callAlertHook(options, onAccepted);\n      } else if (isStatusDismissed(status) && onDismissed) {\n        callAlertHook(options, onDismissed);\n      }\n    }\n  }, [group, data, alert, status, onChange, dispatchLoadingAlerts]);\n\n  useEffect(() => {\n    if (scroll === ScrollType.AlertSummary) {\n      setSummaryOpen(true);\n    }\n  }, [scroll]);\n\n  useEffect(() => {\n    setDialogOpen(!!status);\n  }, [status]);\n\n  useEffect(() => {\n    setSnackbarOpen(!!error);\n  }, [error]);\n\n  function onSnooze(alertToSnooze: Alert) {\n    setAlert(alertToSnooze);\n    setStatus(AlertStatus.Snoozed);\n  }\n\n  function onAccept(alertToAccept: Alert) {\n    setAlert(alertToAccept);\n    setStatus(AlertStatus.Accepted);\n  }\n\n  function onDismiss(alertToDismiss: Alert) {\n    setAlert(alertToDismiss);\n    setStatus(AlertStatus.Dismissed);\n  }\n\n  function onSnackbarClose() {\n    setError(null);\n  }\n\n  function onDialogClose() {\n    setAlert(null);\n    setStatus(null);\n  }\n\n  function onDialogFormSubmit(formData: any) {\n    setData(formData);\n  }\n\n  function onSummaryButtonClick() {\n    setSummaryOpen(prevOpen => !prevOpen);\n  }\n\n  const total = [accepted, snoozed, dismissed].reduce(sumOfAllAlerts, 0);\n\n  const isAlertStatusSummaryDisplayed = !!total;\n  const isAlertInsightSectionDisplayed = !!active.length;\n\n  return (\n    <Grid container direction=\"column\" spacing={2}>\n      <Grid item>\n        <AlertInsightsHeader\n          title=\"Your team's action items\"\n          subtitle={\n            isAlertInsightSectionDisplayed\n              ? 'This section outlines suggested action items your team can address to improve cloud costs.'\n              : \"All of your team's action items are hidden. Maybe it's time to give them another look?\"\n          }\n        />\n      </Grid>\n      {isAlertInsightSectionDisplayed && (\n        <Grid item container direction=\"column\" spacing={4}>\n          {active.map((activeAlert, index) => (\n            <Grid item key={`alert-insights-section-${index}`}>\n              <AlertInsightsSection\n                alert={activeAlert}\n                number={index + 1}\n                onSnooze={onSnooze}\n                onAccept={onAccept}\n                onDismiss={onDismiss}\n              />\n            </Grid>\n          ))}\n        </Grid>\n      )}\n      {isAlertStatusSummaryDisplayed && (\n        <Grid item>\n          <Box position=\"relative\" display=\"flex\" justifyContent=\"flex-end\">\n            <ScrollAnchor id={ScrollType.AlertSummary} />\n            <AlertStatusSummaryButton onClick={onSummaryButtonClick}>\n              {pluralize('Hidden Action Item', total)}\n            </AlertStatusSummaryButton>\n          </Box>\n          <AlertStatusSummary\n            open={isSummaryOpen}\n            snoozed={snoozed}\n            accepted={accepted}\n            dismissed={dismissed}\n          />\n        </Grid>\n      )}\n      <AlertDialog\n        group={group}\n        open={isDialogOpen}\n        alert={alert}\n        status={status}\n        onClose={onDialogClose}\n        onSubmit={onDialogFormSubmit}\n      />\n      <Snackbar\n        open={isSnackbarOpen}\n        autoHideDuration={6_000}\n        anchorOrigin={{ vertical: 'top', horizontal: 'center' }}\n        onClose={onSnackbarClose}\n      >\n        <MuiAlert onClose={onSnackbarClose} severity=\"error\">\n          {error?.message}\n        </MuiAlert>\n      </Snackbar>\n    </Grid>\n  );\n};\n"],"names":["options","MuiAlert"],"mappings":"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"}

package/dist/components/AlertInsights/AlertInsightsHeader.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Box from '@material-ui/core/Box';
 import Typography from '@material-ui/core/Typography';
 import { useCostInsightsStyles } from '../../utils/styles.esm.js';
@@ -10,7 +10,15 @@ const AlertInsightsHeader = ({
   subtitle
 }) => {
   const classes = useCostInsightsStyles();
-  return /* @__PURE__ */ React.createElement(Box, { mb: 6, position: "relative" }, /* @__PURE__ */ React.createElement(ScrollAnchor, { id: DefaultNavigation.AlertInsightsHeader }), /* @__PURE__ */ React.createElement(Typography, { variant: "h4", align: "center" }, title, " ", /* @__PURE__ */ React.createElement(Typography, { component: "span", role: "img", "aria-label": "direct-hit" }, "\u{1F3AF}")), /* @__PURE__ */ React.createElement(Typography, { className: classes.h6Subtle, align: "center", gutterBottom: true }, subtitle));
+  return /* @__PURE__ */ jsxs(Box, { mb: 6, position: "relative", children: [
+    /* @__PURE__ */ jsx(ScrollAnchor, { id: DefaultNavigation.AlertInsightsHeader }),
+    /* @__PURE__ */ jsxs(Typography, { variant: "h4", align: "center", children: [
+      title,
+      " ",
+      /* @__PURE__ */ jsx(Typography, { component: "span", role: "img", "aria-label": "direct-hit", children: "\u{1F3AF}" })
+    ] }),
+    /* @__PURE__ */ jsx(Typography, { className: classes.h6Subtle, align: "center", gutterBottom: true, children: subtitle })
+  ] });
 };
 
 export { AlertInsightsHeader };

package/dist/components/AlertInsights/AlertInsightsHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertInsightsHeader.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsHeader.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport Typography from '@material-ui/core/Typography';\nimport { useCostInsightsStyles as useStyles } from '../../utils/styles';\nimport { ScrollAnchor } from '../../utils/scroll';\nimport { DefaultNavigation } from '../../utils/navigation';\n\ntype AlertInsightsHeaderProps = {\n  title: string;\n  subtitle: string;\n};\n\nexport const AlertInsightsHeader = ({\n  title,\n  subtitle,\n}: AlertInsightsHeaderProps) => {\n  const classes = useStyles();\n\n  return (\n    <Box mb={6} position=\"relative\">\n      <ScrollAnchor id={DefaultNavigation.AlertInsightsHeader} />\n      <Typography variant=\"h4\" align=\"center\">\n        {title}{' '}\n        <Typography component=\"span\" role=\"img\" aria-label=\"direct-hit\">\n          🎯\n        </Typography>\n      </Typography>\n      <Typography className={classes.h6Subtle} align=\"center\" gutterBottom>\n        {subtitle}\n      </Typography>\n    </Box>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;AA4BO,MAAM,sBAAsB,CAAC;AAAA,EAClC,KAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAA,MAAM,UAAUA,qBAAU,EAAA;AAE1B,EAAA,2CACG,GAAI,EAAA,EAAA,EAAA,EAAI,GAAG,QAAS,EAAA,UAAA,EAAA,sCAClB,YAAa,EAAA,EAAA,EAAA,EAAI,iBAAkB,CAAA,mBAAA,EAAqB,mBACxD,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,SAAQ,IAAK,EAAA,KAAA,EAAM,YAC5B,KAAO,EAAA,GAAA,kBACP,KAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,WAAU,MAAO,EAAA,IAAA,EAAK,OAAM,YAAW,EAAA,YAAA,EAAA,EAAa,WAEhE,CACF,CAAA,sCACC,UAAW,EAAA,EAAA,SAAA,EAAW,QAAQ,QAAU,EAAA,KAAA,EAAM,UAAS,YAAY,EAAA,IAAA,EAAA,EACjE,QACH,CACF,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AlertInsightsHeader.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsHeader.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport Typography from '@material-ui/core/Typography';\nimport { useCostInsightsStyles as useStyles } from '../../utils/styles';\nimport { ScrollAnchor } from '../../utils/scroll';\nimport { DefaultNavigation } from '../../utils/navigation';\n\ntype AlertInsightsHeaderProps = {\n  title: string;\n  subtitle: string;\n};\n\nexport const AlertInsightsHeader = ({\n  title,\n  subtitle,\n}: AlertInsightsHeaderProps) => {\n  const classes = useStyles();\n\n  return (\n    <Box mb={6} position=\"relative\">\n      <ScrollAnchor id={DefaultNavigation.AlertInsightsHeader} />\n      <Typography variant=\"h4\" align=\"center\">\n        {title}{' '}\n        <Typography component=\"span\" role=\"img\" aria-label=\"direct-hit\">\n          🎯\n        </Typography>\n      </Typography>\n      <Typography className={classes.h6Subtle} align=\"center\" gutterBottom>\n        {subtitle}\n      </Typography>\n    </Box>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;AA2BO,MAAM,sBAAsB,CAAC;AAAA,EAClC,KAAA;AAAA,EACA;AACF,CAAgC,KAAA;AAC9B,EAAA,MAAM,UAAUA,qBAAU,EAAA;AAE1B,EAAA,uBACG,IAAA,CAAA,GAAA,EAAA,EAAI,EAAI,EAAA,CAAA,EAAG,UAAS,UACnB,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,YAAA,EAAA,EAAa,EAAI,EAAA,iBAAA,CAAkB,mBAAqB,EAAA,CAAA;AAAA,oBACxD,IAAA,CAAA,UAAA,EAAA,EAAW,OAAQ,EAAA,IAAA,EAAK,OAAM,QAC5B,EAAA,QAAA,EAAA;AAAA,MAAA,KAAA;AAAA,MAAO,GAAA;AAAA,sBACR,GAAA,CAAC,cAAW,SAAU,EAAA,MAAA,EAAO,MAAK,KAAM,EAAA,YAAA,EAAW,cAAa,QAEhE,EAAA,WAAA,EAAA;AAAA,KACF,EAAA,CAAA;AAAA,oBACA,GAAA,CAAC,cAAW,SAAW,EAAA,OAAA,CAAQ,UAAU,KAAM,EAAA,QAAA,EAAS,YAAY,EAAA,IAAA,EACjE,QACH,EAAA,QAAA,EAAA;AAAA,GACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/AlertInsights/AlertInsightsSection.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Box from '@material-ui/core/Box';
 import Button from '@material-ui/core/Button';
 import SnoozeIcon from '@material-ui/icons/AccessTime';
@@ -18,39 +18,47 @@ const AlertInsightsSection = ({
   const isAcceptButtonDisplayed = isAcceptEnabled(alert);
   const isDismissButtonDisplayed = isDismissEnabled(alert);
   const isButtonGroupDisplayed = isSnoozeButtonDisplayed || isAcceptButtonDisplayed || isDismissButtonDisplayed;
-  return /* @__PURE__ */ React.createElement(Box, { display: "flex", flexDirection: "column", mb: 6 }, /* @__PURE__ */ React.createElement(AlertInsightsSectionHeader, { alert, number }), isButtonGroupDisplayed && /* @__PURE__ */ React.createElement(Box, { display: "flex", alignItems: "center", mb: 4 }, isAcceptButtonDisplayed && /* @__PURE__ */ React.createElement(Box, { mr: 1 }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      color: "primary",
-      variant: "contained",
-      "aria-label": "accept",
-      onClick: () => onAccept(alert),
-      startIcon: /* @__PURE__ */ React.createElement(AcceptIcon, null)
-    },
-    "Accept"
-  )), isSnoozeButtonDisplayed && /* @__PURE__ */ React.createElement(Box, { mr: 1 }, /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      color: "default",
-      variant: "outlined",
-      "aria-label": "snooze",
-      disableElevation: true,
-      onClick: () => onSnooze(alert),
-      startIcon: /* @__PURE__ */ React.createElement(SnoozeIcon, null)
-    },
-    "Snooze"
-  )), isDismissButtonDisplayed && /* @__PURE__ */ React.createElement(
-    Button,
-    {
-      color: "secondary",
-      variant: "outlined",
-      "aria-label": "dismiss",
-      disableElevation: true,
-      onClick: () => onDismiss(alert),
-      startIcon: /* @__PURE__ */ React.createElement(DismissIcon, null)
-    },
-    "Dismiss"
-  )), alert.element);
+  return /* @__PURE__ */ jsxs(Box, { display: "flex", flexDirection: "column", mb: 6, children: [
+    /* @__PURE__ */ jsx(AlertInsightsSectionHeader, { alert, number }),
+    isButtonGroupDisplayed && /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", mb: 4, children: [
+      isAcceptButtonDisplayed && /* @__PURE__ */ jsx(Box, { mr: 1, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "primary",
+          variant: "contained",
+          "aria-label": "accept",
+          onClick: () => onAccept(alert),
+          startIcon: /* @__PURE__ */ jsx(AcceptIcon, {}),
+          children: "Accept"
+        }
+      ) }),
+      isSnoozeButtonDisplayed && /* @__PURE__ */ jsx(Box, { mr: 1, children: /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "default",
+          variant: "outlined",
+          "aria-label": "snooze",
+          disableElevation: true,
+          onClick: () => onSnooze(alert),
+          startIcon: /* @__PURE__ */ jsx(SnoozeIcon, {}),
+          children: "Snooze"
+        }
+      ) }),
+      isDismissButtonDisplayed && /* @__PURE__ */ jsx(
+        Button,
+        {
+          color: "secondary",
+          variant: "outlined",
+          "aria-label": "dismiss",
+          disableElevation: true,
+          onClick: () => onDismiss(alert),
+          startIcon: /* @__PURE__ */ jsx(DismissIcon, {}),
+          children: "Dismiss"
+        }
+      )
+    ] }),
+    alert.element
+  ] });
 };
 
 export { AlertInsightsSection };

package/dist/components/AlertInsights/AlertInsightsSection.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertInsightsSection.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsSection.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { default as SnoozeIcon } from '@material-ui/icons/AccessTime';\nimport { default as AcceptIcon } from '@material-ui/icons/Check';\nimport { default as DismissIcon } from '@material-ui/icons/Delete';\nimport { AlertInsightsSectionHeader } from './AlertInsightsSectionHeader';\nimport { Alert } from '../../types';\nimport {\n  isSnoozeEnabled,\n  isAcceptEnabled,\n  isDismissEnabled,\n} from '../../utils/alerts';\n\ntype AlertInsightsSectionProps = {\n  alert: Alert;\n  number: number;\n  onSnooze: (alert: Alert) => void;\n  onAccept: (alert: Alert) => void;\n  onDismiss: (alert: Alert) => void;\n};\n\nexport const AlertInsightsSection = ({\n  alert,\n  number,\n  onSnooze,\n  onAccept,\n  onDismiss,\n}: AlertInsightsSectionProps) => {\n  const isSnoozeButtonDisplayed = isSnoozeEnabled(alert);\n  const isAcceptButtonDisplayed = isAcceptEnabled(alert);\n  const isDismissButtonDisplayed = isDismissEnabled(alert);\n  const isButtonGroupDisplayed =\n    isSnoozeButtonDisplayed ||\n    isAcceptButtonDisplayed ||\n    isDismissButtonDisplayed;\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" mb={6}>\n      <AlertInsightsSectionHeader alert={alert} number={number} />\n      {isButtonGroupDisplayed && (\n        <Box display=\"flex\" alignItems=\"center\" mb={4}>\n          {isAcceptButtonDisplayed && (\n            <Box mr={1}>\n              <Button\n                color=\"primary\"\n                variant=\"contained\"\n                aria-label=\"accept\"\n                onClick={() => onAccept(alert)}\n                startIcon={<AcceptIcon />}\n              >\n                Accept\n              </Button>\n            </Box>\n          )}\n          {isSnoozeButtonDisplayed && (\n            <Box mr={1}>\n              <Button\n                color=\"default\"\n                variant=\"outlined\"\n                aria-label=\"snooze\"\n                disableElevation\n                onClick={() => onSnooze(alert)}\n                startIcon={<SnoozeIcon />}\n              >\n                Snooze\n              </Button>\n            </Box>\n          )}\n          {isDismissButtonDisplayed && (\n            <Button\n              color=\"secondary\"\n              variant=\"outlined\"\n              aria-label=\"dismiss\"\n              disableElevation\n              onClick={() => onDismiss(alert)}\n              startIcon={<DismissIcon />}\n            >\n              Dismiss\n            </Button>\n          )}\n        </Box>\n      )}\n      {alert.element}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAqCO,MAAM,uBAAuB,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAiC,KAAA;AAC/B,EAAM,MAAA,uBAAA,GAA0B,gBAAgB,KAAK,CAAA;AACrD,EAAM,MAAA,uBAAA,GAA0B,gBAAgB,KAAK,CAAA;AACrD,EAAM,MAAA,wBAAA,GAA2B,iBAAiB,KAAK,CAAA;AACvD,EAAM,MAAA,sBAAA,GACJ,2BACA,uBACA,IAAA,wBAAA;AAEF,EACE,uBAAA,KAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,aAAA,EAAc,QAAS,EAAA,EAAA,EAAI,CAC7C,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,0BAA2B,EAAA,EAAA,KAAA,EAAc,MAAgB,EAAA,CAAA,EACzD,0CACE,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,OAAQ,EAAA,MAAA,EAAO,UAAW,EAAA,QAAA,EAAS,EAAI,EAAA,CAAA,EAAA,EACzC,uBACC,oBAAA,KAAA,CAAA,aAAA,CAAC,GAAI,EAAA,EAAA,EAAA,EAAI,CACP,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,OAAQ,EAAA,WAAA;AAAA,MACR,YAAW,EAAA,QAAA;AAAA,MACX,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,MAC7B,SAAA,sCAAY,UAAW,EAAA,IAAA;AAAA,KAAA;AAAA,IACxB;AAAA,GAGH,CAED,EAAA,uBAAA,oBACE,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,IAAI,CACP,EAAA,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,SAAA;AAAA,MACN,OAAQ,EAAA,UAAA;AAAA,MACR,YAAW,EAAA,QAAA;AAAA,MACX,gBAAgB,EAAA,IAAA;AAAA,MAChB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,MAC7B,SAAA,sCAAY,UAAW,EAAA,IAAA;AAAA,KAAA;AAAA,IACxB;AAAA,GAGH,GAED,wBACC,oBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,MAAA;AAAA,IAAA;AAAA,MACC,KAAM,EAAA,WAAA;AAAA,MACN,OAAQ,EAAA,UAAA;AAAA,MACR,YAAW,EAAA,SAAA;AAAA,MACX,gBAAgB,EAAA,IAAA;AAAA,MAChB,OAAA,EAAS,MAAM,SAAA,CAAU,KAAK,CAAA;AAAA,MAC9B,SAAA,sCAAY,WAAY,EAAA,IAAA;AAAA,KAAA;AAAA,IACzB;AAAA,GAIL,CAED,EAAA,KAAA,CAAM,OACT,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AlertInsightsSection.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsSection.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport { default as SnoozeIcon } from '@material-ui/icons/AccessTime';\nimport { default as AcceptIcon } from '@material-ui/icons/Check';\nimport { default as DismissIcon } from '@material-ui/icons/Delete';\nimport { AlertInsightsSectionHeader } from './AlertInsightsSectionHeader';\nimport { Alert } from '../../types';\nimport {\n  isSnoozeEnabled,\n  isAcceptEnabled,\n  isDismissEnabled,\n} from '../../utils/alerts';\n\ntype AlertInsightsSectionProps = {\n  alert: Alert;\n  number: number;\n  onSnooze: (alert: Alert) => void;\n  onAccept: (alert: Alert) => void;\n  onDismiss: (alert: Alert) => void;\n};\n\nexport const AlertInsightsSection = ({\n  alert,\n  number,\n  onSnooze,\n  onAccept,\n  onDismiss,\n}: AlertInsightsSectionProps) => {\n  const isSnoozeButtonDisplayed = isSnoozeEnabled(alert);\n  const isAcceptButtonDisplayed = isAcceptEnabled(alert);\n  const isDismissButtonDisplayed = isDismissEnabled(alert);\n  const isButtonGroupDisplayed =\n    isSnoozeButtonDisplayed ||\n    isAcceptButtonDisplayed ||\n    isDismissButtonDisplayed;\n\n  return (\n    <Box display=\"flex\" flexDirection=\"column\" mb={6}>\n      <AlertInsightsSectionHeader alert={alert} number={number} />\n      {isButtonGroupDisplayed && (\n        <Box display=\"flex\" alignItems=\"center\" mb={4}>\n          {isAcceptButtonDisplayed && (\n            <Box mr={1}>\n              <Button\n                color=\"primary\"\n                variant=\"contained\"\n                aria-label=\"accept\"\n                onClick={() => onAccept(alert)}\n                startIcon={<AcceptIcon />}\n              >\n                Accept\n              </Button>\n            </Box>\n          )}\n          {isSnoozeButtonDisplayed && (\n            <Box mr={1}>\n              <Button\n                color=\"default\"\n                variant=\"outlined\"\n                aria-label=\"snooze\"\n                disableElevation\n                onClick={() => onSnooze(alert)}\n                startIcon={<SnoozeIcon />}\n              >\n                Snooze\n              </Button>\n            </Box>\n          )}\n          {isDismissButtonDisplayed && (\n            <Button\n              color=\"secondary\"\n              variant=\"outlined\"\n              aria-label=\"dismiss\"\n              disableElevation\n              onClick={() => onDismiss(alert)}\n              startIcon={<DismissIcon />}\n            >\n              Dismiss\n            </Button>\n          )}\n        </Box>\n      )}\n      {alert.element}\n    </Box>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;;AAoCO,MAAM,uBAAuB,CAAC;AAAA,EACnC,KAAA;AAAA,EACA,MAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAA;AAAA,EACA;AACF,CAAiC,KAAA;AAC/B,EAAM,MAAA,uBAAA,GAA0B,gBAAgB,KAAK,CAAA;AACrD,EAAM,MAAA,uBAAA,GAA0B,gBAAgB,KAAK,CAAA;AACrD,EAAM,MAAA,wBAAA,GAA2B,iBAAiB,KAAK,CAAA;AACvD,EAAM,MAAA,sBAAA,GACJ,2BACA,uBACA,IAAA,wBAAA;AAEF,EAAA,4BACG,GAAI,EAAA,EAAA,OAAA,EAAQ,QAAO,aAAc,EAAA,QAAA,EAAS,IAAI,CAC7C,EAAA,QAAA,EAAA;AAAA,oBAAC,GAAA,CAAA,0BAAA,EAAA,EAA2B,OAAc,MAAgB,EAAA,CAAA;AAAA,IACzD,sBAAA,yBACE,GAAI,EAAA,EAAA,OAAA,EAAQ,QAAO,UAAW,EAAA,QAAA,EAAS,IAAI,CACzC,EAAA,QAAA,EAAA;AAAA,MACC,uBAAA,oBAAA,GAAA,CAAC,GAAI,EAAA,EAAA,EAAA,EAAI,CACP,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,OAAQ,EAAA,WAAA;AAAA,UACR,YAAW,EAAA,QAAA;AAAA,UACX,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,UAC7B,SAAA,sBAAY,UAAW,EAAA,EAAA,CAAA;AAAA,UACxB,QAAA,EAAA;AAAA;AAAA,OAGH,EAAA,CAAA;AAAA,MAED,uBACC,oBAAA,GAAA,CAAC,GAAI,EAAA,EAAA,EAAA,EAAI,CACP,EAAA,QAAA,kBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,SAAA;AAAA,UACN,OAAQ,EAAA,UAAA;AAAA,UACR,YAAW,EAAA,QAAA;AAAA,UACX,gBAAgB,EAAA,IAAA;AAAA,UAChB,OAAA,EAAS,MAAM,QAAA,CAAS,KAAK,CAAA;AAAA,UAC7B,SAAA,sBAAY,UAAW,EAAA,EAAA,CAAA;AAAA,UACxB,QAAA,EAAA;AAAA;AAAA,OAGH,EAAA,CAAA;AAAA,MAED,wBACC,oBAAA,GAAA;AAAA,QAAC,MAAA;AAAA,QAAA;AAAA,UACC,KAAM,EAAA,WAAA;AAAA,UACN,OAAQ,EAAA,UAAA;AAAA,UACR,YAAW,EAAA,SAAA;AAAA,UACX,gBAAgB,EAAA,IAAA;AAAA,UAChB,OAAA,EAAS,MAAM,SAAA,CAAU,KAAK,CAAA;AAAA,UAC9B,SAAA,sBAAY,WAAY,EAAA,EAAA,CAAA;AAAA,UACzB,QAAA,EAAA;AAAA;AAAA;AAED,KAEJ,EAAA,CAAA;AAAA,IAED,KAAM,CAAA;AAAA,GACT,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/AlertInsights/AlertInsightsSectionHeader.esm.js

@@ -1,4 +1,4 @@
-import React from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
 import Avatar from '@material-ui/core/Avatar';
 import Box from '@material-ui/core/Box';
 import Button from '@material-ui/core/Button';
@@ -13,17 +13,28 @@ const AlertInsightsSectionHeader = ({
 }) => {
   const classes = useAlertInsightsSectionStyles();
   const isViewInstructionsButtonDisplayed = !!alert.url;
-  return /* @__PURE__ */ React.createElement(Box, { position: "relative", mb: 3, textAlign: "left" }, /* @__PURE__ */ React.createElement(ScrollAnchor, { id: `alert-${number}` }), /* @__PURE__ */ React.createElement(
-    Grid,
-    {
-      container: true,
-      spacing: 2,
-      justifyContent: "space-between",
-      alignItems: "center"
-    },
-    /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Box, { display: "flex", alignItems: "center" }, /* @__PURE__ */ React.createElement(Box, { mr: 2 }, /* @__PURE__ */ React.createElement(Avatar, { className: classes.button }, number)), /* @__PURE__ */ React.createElement(Box, null, /* @__PURE__ */ React.createElement(Typography, { variant: "h5" }, alert.title), /* @__PURE__ */ React.createElement(Typography, { gutterBottom: true }, alert.subtitle)))),
-    isViewInstructionsButtonDisplayed && /* @__PURE__ */ React.createElement(Grid, { item: true }, /* @__PURE__ */ React.createElement(Button, { variant: "text", color: "primary", href: alert.url }, alert.buttonText || "View Instructions"))
-  ));
+  return /* @__PURE__ */ jsxs(Box, { position: "relative", mb: 3, textAlign: "left", children: [
+    /* @__PURE__ */ jsx(ScrollAnchor, { id: `alert-${number}` }),
+    /* @__PURE__ */ jsxs(
+      Grid,
+      {
+        container: true,
+        spacing: 2,
+        justifyContent: "space-between",
+        alignItems: "center",
+        children: [
+          /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsxs(Box, { display: "flex", alignItems: "center", children: [
+            /* @__PURE__ */ jsx(Box, { mr: 2, children: /* @__PURE__ */ jsx(Avatar, { className: classes.button, children: number }) }),
+            /* @__PURE__ */ jsxs(Box, { children: [
+              /* @__PURE__ */ jsx(Typography, { variant: "h5", children: alert.title }),
+              /* @__PURE__ */ jsx(Typography, { gutterBottom: true, children: alert.subtitle })
+            ] })
+          ] }) }),
+          isViewInstructionsButtonDisplayed && /* @__PURE__ */ jsx(Grid, { item: true, children: /* @__PURE__ */ jsx(Button, { variant: "text", color: "primary", href: alert.url, children: alert.buttonText || "View Instructions" }) })
+        ]
+      }
+    )
+  ] });
 };
 
 export { AlertInsightsSectionHeader };

package/dist/components/AlertInsights/AlertInsightsSectionHeader.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"AlertInsightsSectionHeader.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsSectionHeader.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Avatar from '@material-ui/core/Avatar';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Grid from '@material-ui/core/Grid';\nimport Typography from '@material-ui/core/Typography';\nimport { useAlertInsightsSectionStyles as useStyles } from '../../utils/styles';\nimport { ScrollAnchor } from '../../utils/scroll';\nimport { Alert } from '../../types';\n\ntype AlertInsightsSectionHeaderProps = {\n  alert: Alert;\n  number: number;\n};\n\nexport const AlertInsightsSectionHeader = ({\n  alert,\n  number,\n}: AlertInsightsSectionHeaderProps) => {\n  const classes = useStyles();\n\n  const isViewInstructionsButtonDisplayed = !!alert.url;\n\n  return (\n    <Box position=\"relative\" mb={3} textAlign=\"left\">\n      <ScrollAnchor id={`alert-${number}`} />\n      <Grid\n        container\n        spacing={2}\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n      >\n        <Grid item>\n          <Box display=\"flex\" alignItems=\"center\">\n            <Box mr={2}>\n              <Avatar className={classes.button}>{number}</Avatar>\n            </Box>\n            <Box>\n              <Typography variant=\"h5\">{alert.title}</Typography>\n              <Typography gutterBottom>{alert.subtitle}</Typography>\n            </Box>\n          </Box>\n        </Grid>\n        {isViewInstructionsButtonDisplayed && (\n          <Grid item>\n            <Button variant=\"text\" color=\"primary\" href={alert.url}>\n              {alert.buttonText || 'View Instructions'}\n            </Button>\n          </Grid>\n        )}\n      </Grid>\n    </Box>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;;;AA+BO,MAAM,6BAA6B,CAAC;AAAA,EACzC,KAAA;AAAA,EACA;AACF,CAAuC,KAAA;AACrC,EAAA,MAAM,UAAUA,6BAAU,EAAA;AAE1B,EAAM,MAAA,iCAAA,GAAoC,CAAC,CAAC,KAAM,CAAA,GAAA;AAElD,EAAA,uBACG,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,EAAI,QAAS,EAAA,UAAA,EAAW,IAAI,CAAG,EAAA,SAAA,EAAU,MACxC,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,YAAa,EAAA,EAAA,EAAA,EAAI,CAAS,MAAA,EAAA,MAAM,IAAI,CACrC,kBAAA,KAAA,CAAA,aAAA;AAAA,IAAC,IAAA;AAAA,IAAA;AAAA,MACC,SAAS,EAAA,IAAA;AAAA,MACT,OAAS,EAAA,CAAA;AAAA,MACT,cAAe,EAAA,eAAA;AAAA,MACf,UAAW,EAAA;AAAA,KAAA;AAAA,wCAEV,IAAK,EAAA,EAAA,IAAA,EAAI,IACR,EAAA,kBAAA,KAAA,CAAA,aAAA,CAAC,OAAI,OAAQ,EAAA,MAAA,EAAO,UAAW,EAAA,QAAA,EAAA,sCAC5B,GAAI,EAAA,EAAA,EAAA,EAAI,qBACN,KAAA,CAAA,aAAA,CAAA,MAAA,EAAA,EAAO,WAAW,OAAQ,CAAA,MAAA,EAAA,EAAS,MAAO,CAC7C,mBACC,KAAA,CAAA,aAAA,CAAA,GAAA,EAAA,IAAA,sCACE,UAAW,EAAA,EAAA,OAAA,EAAQ,QAAM,KAAM,CAAA,KAAM,CACtC,kBAAA,KAAA,CAAA,aAAA,CAAC,cAAW,YAAY,EAAA,IAAA,EAAA,EAAE,MAAM,QAAS,CAC3C,CACF,CACF,CAAA;AAAA,IACC,qDACE,KAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,IAAI,EAAA,IAAA,EAAA,sCACP,MAAO,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,KAAA,EAAM,WAAU,IAAM,EAAA,KAAA,CAAM,OAChD,KAAM,CAAA,UAAA,IAAc,mBACvB,CACF;AAAA,GAGN,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AlertInsightsSectionHeader.esm.js","sources":["../../../src/components/AlertInsights/AlertInsightsSectionHeader.tsx"],"sourcesContent":["/*\n * Copyright 2020 The Backstage Authors\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 Avatar from '@material-ui/core/Avatar';\nimport Box from '@material-ui/core/Box';\nimport Button from '@material-ui/core/Button';\nimport Grid from '@material-ui/core/Grid';\nimport Typography from '@material-ui/core/Typography';\nimport { useAlertInsightsSectionStyles as useStyles } from '../../utils/styles';\nimport { ScrollAnchor } from '../../utils/scroll';\nimport { Alert } from '../../types';\n\ntype AlertInsightsSectionHeaderProps = {\n  alert: Alert;\n  number: number;\n};\n\nexport const AlertInsightsSectionHeader = ({\n  alert,\n  number,\n}: AlertInsightsSectionHeaderProps) => {\n  const classes = useStyles();\n\n  const isViewInstructionsButtonDisplayed = !!alert.url;\n\n  return (\n    <Box position=\"relative\" mb={3} textAlign=\"left\">\n      <ScrollAnchor id={`alert-${number}`} />\n      <Grid\n        container\n        spacing={2}\n        justifyContent=\"space-between\"\n        alignItems=\"center\"\n      >\n        <Grid item>\n          <Box display=\"flex\" alignItems=\"center\">\n            <Box mr={2}>\n              <Avatar className={classes.button}>{number}</Avatar>\n            </Box>\n            <Box>\n              <Typography variant=\"h5\">{alert.title}</Typography>\n              <Typography gutterBottom>{alert.subtitle}</Typography>\n            </Box>\n          </Box>\n        </Grid>\n        {isViewInstructionsButtonDisplayed && (\n          <Grid item>\n            <Button variant=\"text\" color=\"primary\" href={alert.url}>\n              {alert.buttonText || 'View Instructions'}\n            </Button>\n          </Grid>\n        )}\n      </Grid>\n    </Box>\n  );\n};\n"],"names":["useStyles"],"mappings":";;;;;;;;;AA8BO,MAAM,6BAA6B,CAAC;AAAA,EACzC,KAAA;AAAA,EACA;AACF,CAAuC,KAAA;AACrC,EAAA,MAAM,UAAUA,6BAAU,EAAA;AAE1B,EAAM,MAAA,iCAAA,GAAoC,CAAC,CAAC,KAAM,CAAA,GAAA;AAElD,EAAA,4BACG,GAAI,EAAA,EAAA,QAAA,EAAS,YAAW,EAAI,EAAA,CAAA,EAAG,WAAU,MACxC,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,YAAa,EAAA,EAAA,EAAA,EAAI,CAAS,MAAA,EAAA,MAAM,CAAI,CAAA,EAAA,CAAA;AAAA,oBACrC,IAAA;AAAA,MAAC,IAAA;AAAA,MAAA;AAAA,QACC,SAAS,EAAA,IAAA;AAAA,QACT,OAAS,EAAA,CAAA;AAAA,QACT,cAAe,EAAA,eAAA;AAAA,QACf,UAAW,EAAA,QAAA;AAAA,QAEX,QAAA,EAAA;AAAA,0BAAC,GAAA,CAAA,IAAA,EAAA,EAAK,MAAI,IACR,EAAA,QAAA,kBAAA,IAAA,CAAC,OAAI,OAAQ,EAAA,MAAA,EAAO,YAAW,QAC7B,EAAA,QAAA,EAAA;AAAA,4BAAC,GAAA,CAAA,GAAA,EAAA,EAAI,IAAI,CACP,EAAA,QAAA,kBAAA,GAAA,CAAC,UAAO,SAAW,EAAA,OAAA,CAAQ,MAAS,EAAA,QAAA,EAAA,MAAA,EAAO,CAC7C,EAAA,CAAA;AAAA,iCACC,GACC,EAAA,EAAA,QAAA,EAAA;AAAA,8BAAA,GAAA,CAAC,UAAW,EAAA,EAAA,OAAA,EAAQ,IAAM,EAAA,QAAA,EAAA,KAAA,CAAM,KAAM,EAAA,CAAA;AAAA,8BACrC,GAAA,CAAA,UAAA,EAAA,EAAW,YAAY,EAAA,IAAA,EAAE,gBAAM,QAAS,EAAA;AAAA,aAC3C,EAAA;AAAA,WAAA,EACF,CACF,EAAA,CAAA;AAAA,UACC,qDACE,GAAA,CAAA,IAAA,EAAA,EAAK,IAAI,EAAA,IAAA,EACR,8BAAC,MAAO,EAAA,EAAA,OAAA,EAAQ,MAAO,EAAA,KAAA,EAAM,WAAU,IAAM,EAAA,KAAA,CAAM,KAChD,QAAM,EAAA,KAAA,CAAA,UAAA,IAAc,qBACvB,CACF,EAAA;AAAA;AAAA;AAAA;AAEJ,GACF,EAAA,CAAA;AAEJ;;;;"}

package/dist/components/AlertInsights/AlertStatusSummary.esm.js

@@ -1,4 +1,5 @@
-import React, { Fragment } from 'react';
+import { jsxs, jsx } from 'react/jsx-runtime';
+import { Fragment } from 'react';
 import Avatar from '@material-ui/core/Avatar';
 import Box from '@material-ui/core/Box';
 import Collapse from '@material-ui/core/Collapse';
@@ -23,14 +24,17 @@ import { useActionItemCardStyles } from '../../utils/styles.esm.js';
 
 const AlertGroup = ({ alerts, status, title, icon }) => {
   const classes = useActionItemCardStyles();
-  return /* @__PURE__ */ React.createElement(Box, { p: 1 }, alerts.map((alert, index) => /* @__PURE__ */ React.createElement(Fragment, { key: `alert-${status}-${index}` }, /* @__PURE__ */ React.createElement(
-    ActionItemCard,
-    {
-      disableScroll: true,
-      alert,
-      avatar: /* @__PURE__ */ React.createElement(Tooltip, { title }, /* @__PURE__ */ React.createElement(Avatar, { className: classes.avatar }, icon))
-    }
-  ), index < alerts.length - 1 && /* @__PURE__ */ React.createElement(Divider, null))));
+  return /* @__PURE__ */ jsx(Box, { p: 1, children: alerts.map((alert, index) => /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsx(
+      ActionItemCard,
+      {
+        disableScroll: true,
+        alert,
+        avatar: /* @__PURE__ */ jsx(Tooltip, { title, children: /* @__PURE__ */ jsx(Avatar, { className: classes.avatar, children: icon }) })
+      }
+    ),
+    index < alerts.length - 1 && /* @__PURE__ */ jsx(Divider, {})
+  ] }, `alert-${status}-${index}`)) });
 };
 const AlertStatusSummary = ({
   open,
@@ -41,52 +45,56 @@ const AlertStatusSummary = ({
   const isSnoozedListDisplayed = !!snoozed.length;
   const isAcceptedListDisplayed = !!accepted.length;
   const isDismissedListDisplayed = !!dismissed.length;
-  return /* @__PURE__ */ React.createElement(Collapse, { in: open }, isAcceptedListDisplayed && /* @__PURE__ */ React.createElement(
-    AlertGroup,
-    {
-      title: "Accepted",
-      alerts: accepted,
-      status: AlertStatus.Accepted,
-      icon: /* @__PURE__ */ React.createElement(
-        AcceptIcon,
-        {
-          role: "img",
-          "aria-hidden": false,
-          "aria-label": AlertStatus.Accepted
-        }
-      )
-    }
-  ), isSnoozedListDisplayed && /* @__PURE__ */ React.createElement(
-    AlertGroup,
-    {
-      title: "Snoozed",
-      alerts: snoozed,
-      status: AlertStatus.Snoozed,
-      icon: /* @__PURE__ */ React.createElement(
-        SnoozeIcon,
-        {
-          role: "img",
-          "aria-hidden": false,
-          "aria-label": AlertStatus.Snoozed
-        }
-      )
-    }
-  ), isDismissedListDisplayed && /* @__PURE__ */ React.createElement(
-    AlertGroup,
-    {
-      title: "Dismissed",
-      alerts: dismissed,
-      status: AlertStatus.Dismissed,
-      icon: /* @__PURE__ */ React.createElement(
-        DismissIcon,
-        {
-          role: "img",
-          "aria-hidden": false,
-          "aria-label": AlertStatus.Dismissed
-        }
-      )
-    }
-  ));
+  return /* @__PURE__ */ jsxs(Collapse, { in: open, children: [
+    isAcceptedListDisplayed && /* @__PURE__ */ jsx(
+      AlertGroup,
+      {
+        title: "Accepted",
+        alerts: accepted,
+        status: AlertStatus.Accepted,
+        icon: /* @__PURE__ */ jsx(
+          AcceptIcon,
+          {
+            role: "img",
+            "aria-hidden": false,
+            "aria-label": AlertStatus.Accepted
+          }
+        )
+      }
+    ),
+    isSnoozedListDisplayed && /* @__PURE__ */ jsx(
+      AlertGroup,
+      {
+        title: "Snoozed",
+        alerts: snoozed,
+        status: AlertStatus.Snoozed,
+        icon: /* @__PURE__ */ jsx(
+          SnoozeIcon,
+          {
+            role: "img",
+            "aria-hidden": false,
+            "aria-label": AlertStatus.Snoozed
+          }
+        )
+      }
+    ),
+    isDismissedListDisplayed && /* @__PURE__ */ jsx(
+      AlertGroup,
+      {
+        title: "Dismissed",
+        alerts: dismissed,
+        status: AlertStatus.Dismissed,
+        icon: /* @__PURE__ */ jsx(
+          DismissIcon,
+          {
+            role: "img",
+            "aria-hidden": false,
+            "aria-label": AlertStatus.Dismissed
+          }
+        )
+      }
+    )
+  ] });
 };
 
 export { AlertStatusSummary };