@backstage-community/plugin-announcements 0.5.7 → 0.5.9

package/dist/components/Admin/CategoriesContent/CategoriesContent.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoriesContent.esm.js","sources":["../../../../src/components/Admin/CategoriesContent/CategoriesContent.tsx"],"sourcesContent":["/*\n * Copyright 2024 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, { useState } from 'react';\nimport {\n  ErrorPanel,\n  Progress,\n  Table,\n  TableColumn,\n} from '@backstage/core-components';\nimport {\n  CreateCategoryRequest,\n  announcementsApiRef,\n  useAnnouncementsTranslation,\n  useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport {\n  announcementCreatePermission,\n  announcementDeletePermission,\n  Category,\n} from '@backstage-community/plugin-announcements-common';\nimport { CategoriesForm } from '../../CategoriesForm';\nimport { useApi, alertApiRef } from '@backstage/core-plugin-api';\nimport {\n  RequirePermission,\n  usePermission,\n} from '@backstage/plugin-permission-react';\nimport { useDeleteCategoryDialogState } from '../../CategoriesPage/useDeleteCategoryDialogState';\nimport { ResponseError } from '@backstage/errors';\nimport { DeleteCategoryDialog } from '../../CategoriesPage/DeleteCategoryDialog';\nimport { Button, Grid, IconButton, Typography } from '@material-ui/core';\nimport DeleteIcon from '@material-ui/icons/Delete';\n\nexport const CategoriesContent = () => {\n  const [showNewCategoryForm, setShowNewCategoryForm] = useState(false);\n  const { categories, loading, error, retry: refresh } = useCategories();\n  const announcementsApi = useApi(announcementsApiRef);\n  const alertApi = useApi(alertApiRef);\n  const { t } = useAnnouncementsTranslation();\n\n  const {\n    isOpen: isDeleteDialogOpen,\n    open: openDeleteDialog,\n    close: closeDeleteDialog,\n    category: categoryToDelete,\n  } = useDeleteCategoryDialogState();\n\n  const { loading: loadingCreatePermission, allowed: canCreateCategory } =\n    usePermission({\n      permission: announcementCreatePermission,\n    });\n\n  const { loading: loadingDeletePermission, allowed: canDeleteAnnouncement } =\n    usePermission({\n      permission: announcementDeletePermission,\n    });\n\n  const onSubmit = async (request: CreateCategoryRequest) => {\n    const { title } = request;\n\n    try {\n      await announcementsApi.createCategory({\n        title,\n      });\n\n      alertApi.post({\n        message: `${title} ${t('admin.categoriesContent.createdMessage')}`,\n        severity: 'success',\n      });\n\n      refresh();\n    } catch (err) {\n      alertApi.post({ message: (err as Error).message, severity: 'error' });\n    }\n  };\n\n  const onCreateButtonClick = () => {\n    setShowNewCategoryForm(!showNewCategoryForm);\n  };\n\n  const onCancelDelete = () => {\n    closeDeleteDialog();\n  };\n\n  const onConfirmDelete = async () => {\n    closeDeleteDialog();\n\n    try {\n      await announcementsApi.deleteCategory(categoryToDelete!.slug);\n\n      alertApi.post({\n        message: t('admin.categoriesContent.table.categoryDeleted'),\n        severity: 'success',\n      });\n    } catch (err) {\n      alertApi.post({\n        message: (err as ResponseError).body.error.message,\n        severity: 'error',\n      });\n    }\n\n    refresh();\n  };\n\n  if (loading) {\n    return <Progress />;\n  }\n  if (error) {\n    return <ErrorPanel error={error} />;\n  }\n\n  const columns: TableColumn<Category>[] = [\n    {\n      title: (\n        <Typography>{t('admin.categoriesContent.table.title')}</Typography>\n      ),\n      sorting: true,\n      field: 'title',\n      render: rowData => rowData.title,\n    },\n    {\n      title: <Typography>{t('admin.categoriesContent.table.slug')}</Typography>,\n      sorting: true,\n      field: 'slug',\n      render: rowData => rowData.slug,\n    },\n    {\n      title: (\n        <Typography>{t('admin.categoriesContent.table.actions')}</Typography>\n      ),\n      render: rowData => {\n        return (\n          <IconButton\n            aria-label=\"delete\"\n            disabled={loadingDeletePermission || !canDeleteAnnouncement}\n            onClick={() => openDeleteDialog(rowData)}\n          >\n            <DeleteIcon fontSize=\"small\" data-testid=\"delete-icon\" />\n          </IconButton>\n        );\n      },\n    },\n  ];\n\n  return (\n    <RequirePermission permission={announcementCreatePermission}>\n      <Grid container>\n        <Grid item xs={12}>\n          <Button\n            disabled={loadingCreatePermission || !canCreateCategory}\n            variant=\"contained\"\n            onClick={() => onCreateButtonClick()}\n          >\n            {showNewCategoryForm\n              ? t('admin.categoriesContent.cancelButton')\n              : t('admin.categoriesContent.createButton')}\n          </Button>\n        </Grid>\n\n        {showNewCategoryForm && (\n          <Grid item xs={12}>\n            <CategoriesForm initialData={{} as Category} onSubmit={onSubmit} />\n          </Grid>\n        )}\n\n        <Grid item xs={12}>\n          <Table\n            title=\"Categories\"\n            options={{ pageSize: 20, search: true }}\n            columns={columns}\n            data={categories ?? []}\n            emptyContent={\n              <Typography style={{ padding: 2 }}>\n                {t('admin.categoriesContent.table.noCategoriesFound')}\n              </Typography>\n            }\n          />\n        </Grid>\n\n        <DeleteCategoryDialog\n          open={isDeleteDialogOpen}\n          onCancel={onCancelDelete}\n          onConfirm={onConfirmDelete}\n        />\n      </Grid>\n    </RequirePermission>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"CategoriesContent.esm.js","sources":["../../../../src/components/Admin/CategoriesContent/CategoriesContent.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { useState } from 'react';\nimport {\n  ErrorPanel,\n  Progress,\n  Table,\n  TableColumn,\n} from '@backstage/core-components';\nimport {\n  CreateCategoryRequest,\n  announcementsApiRef,\n  useAnnouncementsTranslation,\n  useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport {\n  announcementCreatePermission,\n  announcementDeletePermission,\n  Category,\n} from '@backstage-community/plugin-announcements-common';\nimport { CategoriesForm } from '../../CategoriesForm';\nimport { useApi, alertApiRef } from '@backstage/core-plugin-api';\nimport {\n  RequirePermission,\n  usePermission,\n} from '@backstage/plugin-permission-react';\nimport { useDeleteCategoryDialogState } from '../../CategoriesPage/useDeleteCategoryDialogState';\nimport { ResponseError } from '@backstage/errors';\nimport { DeleteCategoryDialog } from '../../CategoriesPage/DeleteCategoryDialog';\nimport { Button, Grid, IconButton, Typography } from '@material-ui/core';\nimport DeleteIcon from '@material-ui/icons/Delete';\n\nexport const CategoriesContent = () => {\n  const [showNewCategoryForm, setShowNewCategoryForm] = useState(false);\n  const { categories, loading, error, retry: refresh } = useCategories();\n  const announcementsApi = useApi(announcementsApiRef);\n  const alertApi = useApi(alertApiRef);\n  const { t } = useAnnouncementsTranslation();\n\n  const {\n    isOpen: isDeleteDialogOpen,\n    open: openDeleteDialog,\n    close: closeDeleteDialog,\n    category: categoryToDelete,\n  } = useDeleteCategoryDialogState();\n\n  const { loading: loadingCreatePermission, allowed: canCreateCategory } =\n    usePermission({\n      permission: announcementCreatePermission,\n    });\n\n  const { loading: loadingDeletePermission, allowed: canDeleteAnnouncement } =\n    usePermission({\n      permission: announcementDeletePermission,\n    });\n\n  const onSubmit = async (request: CreateCategoryRequest) => {\n    const { title } = request;\n\n    try {\n      await announcementsApi.createCategory({\n        title,\n      });\n\n      alertApi.post({\n        message: `${title} ${t('admin.categoriesContent.createdMessage')}`,\n        severity: 'success',\n      });\n\n      refresh();\n    } catch (err) {\n      alertApi.post({ message: (err as Error).message, severity: 'error' });\n    }\n  };\n\n  const onCreateButtonClick = () => {\n    setShowNewCategoryForm(!showNewCategoryForm);\n  };\n\n  const onCancelDelete = () => {\n    closeDeleteDialog();\n  };\n\n  const onConfirmDelete = async () => {\n    closeDeleteDialog();\n\n    try {\n      await announcementsApi.deleteCategory(categoryToDelete!.slug);\n\n      alertApi.post({\n        message: t('admin.categoriesContent.table.categoryDeleted'),\n        severity: 'success',\n      });\n    } catch (err) {\n      alertApi.post({\n        message: (err as ResponseError).body.error.message,\n        severity: 'error',\n      });\n    }\n\n    refresh();\n  };\n\n  if (loading) {\n    return <Progress />;\n  }\n  if (error) {\n    return <ErrorPanel error={error} />;\n  }\n\n  const columns: TableColumn<Category>[] = [\n    {\n      title: (\n        <Typography>{t('admin.categoriesContent.table.title')}</Typography>\n      ),\n      sorting: true,\n      field: 'title',\n      render: rowData => rowData.title,\n    },\n    {\n      title: <Typography>{t('admin.categoriesContent.table.slug')}</Typography>,\n      sorting: true,\n      field: 'slug',\n      render: rowData => rowData.slug,\n    },\n    {\n      title: (\n        <Typography>{t('admin.categoriesContent.table.actions')}</Typography>\n      ),\n      render: rowData => {\n        return (\n          <IconButton\n            aria-label=\"delete\"\n            disabled={loadingDeletePermission || !canDeleteAnnouncement}\n            onClick={() => openDeleteDialog(rowData)}\n          >\n            <DeleteIcon fontSize=\"small\" data-testid=\"delete-icon\" />\n          </IconButton>\n        );\n      },\n    },\n  ];\n\n  return (\n    <RequirePermission permission={announcementCreatePermission}>\n      <Grid container>\n        <Grid item xs={12}>\n          <Button\n            disabled={loadingCreatePermission || !canCreateCategory}\n            variant=\"contained\"\n            onClick={() => onCreateButtonClick()}\n          >\n            {showNewCategoryForm\n              ? t('admin.categoriesContent.cancelButton')\n              : t('admin.categoriesContent.createButton')}\n          </Button>\n        </Grid>\n\n        {showNewCategoryForm && (\n          <Grid item xs={12}>\n            <CategoriesForm initialData={{} as Category} onSubmit={onSubmit} />\n          </Grid>\n        )}\n\n        <Grid item xs={12}>\n          <Table\n            title=\"Categories\"\n            options={{ pageSize: 20, search: true }}\n            columns={columns}\n            data={categories ?? []}\n            emptyContent={\n              <Typography style={{ padding: 2 }}>\n                {t('admin.categoriesContent.table.noCategoriesFound')}\n              </Typography>\n            }\n          />\n        </Grid>\n\n        <DeleteCategoryDialog\n          open={isDeleteDialogOpen}\n          onCancel={onCancelDelete}\n          onConfirm={onConfirmDelete}\n        />\n      </Grid>\n    </RequirePermission>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AnnouncementForm/AnnouncementForm.esm.js

@@ -1,4 +1,5 @@
-import React__default, { useState } from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
+import { useState } from 'react';
 import MDEditor from '@uiw/react-md-editor';
 import { InfoCard } from '@backstage/core-components';
 import { useApi, identityApiRef } from '@backstage/core-plugin-api';
@@ -15,7 +16,7 @@ const AnnouncementForm = ({
   const identityApi = useApi(identityApiRef);
   const { t } = useAnnouncementsTranslation();
   const formattedStartAt = initialData.start_at ? DateTime.fromISO(initialData.start_at).toISODate() : DateTime.now().toISODate();
-  const [form, setForm] = React__default.useState({
+  const [form, setForm] = useState({
     ...initialData,
     category: initialData.category?.slug,
     start_at: formattedStartAt || ""
@@ -46,84 +47,98 @@ const AnnouncementForm = ({
     await onSubmit(createRequest);
     setLoading(false);
   };
-  return /* @__PURE__ */ React__default.createElement(InfoCard, null, /* @__PURE__ */ React__default.createElement(Box, { p: 3 }, /* @__PURE__ */ React__default.createElement(Typography, { variant: "h5", gutterBottom: true }, initialData.title ? t("announcementForm.editAnnouncement") : t("announcementForm.newAnnouncement")), /* @__PURE__ */ React__default.createElement("form", { onSubmit: handleSubmit }, /* @__PURE__ */ React__default.createElement(Grid, { container: true, spacing: 3 }, /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React__default.createElement(
-    TextField,
-    {
-      id: "title",
-      label: t("announcementForm.title"),
-      value: form.title,
-      onChange: handleChange,
-      variant: "outlined",
-      fullWidth: true,
-      required: true
-    }
-  )), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12, sm: 6 }, /* @__PURE__ */ React__default.createElement(
-    CategoryInput,
-    {
-      setForm,
-      form,
-      initialValue: initialData.category?.title ?? ""
-    }
-  )), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12, sm: 6 }, /* @__PURE__ */ React__default.createElement(
-    TextField,
-    {
-      variant: "outlined",
-      label: t("announcementForm.startAt"),
-      id: "start-at-date",
-      type: "date",
-      value: form.start_at,
-      InputLabelProps: { shrink: true },
-      required: true,
-      onChange: (e) => setForm({
-        ...form,
-        start_at: e.target.value
-      })
-    }
-  )), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React__default.createElement(
-    TextField,
-    {
-      id: "excerpt",
-      label: t("announcementForm.excerpt"),
-      value: form.excerpt,
-      onChange: handleChange,
-      variant: "outlined",
-      fullWidth: true,
-      required: true,
-      multiline: true
-    }
-  )), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React__default.createElement(
-    MDEditor,
-    {
-      value: form.body,
-      style: { minHeight: "30rem" },
-      onChange: (value) => setForm({ ...form, ...{ body: value || "" } })
-    }
-  )), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React__default.createElement(Divider, null)), /* @__PURE__ */ React__default.createElement(Grid, { item: true, xs: 12 }, /* @__PURE__ */ React__default.createElement(FormGroup, { row: true, style: { justifyContent: "flex-end" } }, /* @__PURE__ */ React__default.createElement(
-    FormControlLabel,
-    {
-      control: /* @__PURE__ */ React__default.createElement(
-        Switch,
+  return /* @__PURE__ */ jsx(InfoCard, { children: /* @__PURE__ */ jsxs(Box, { p: 3, children: [
+    /* @__PURE__ */ jsx(Typography, { variant: "h5", gutterBottom: true, children: initialData.title ? t("announcementForm.editAnnouncement") : t("announcementForm.newAnnouncement") }),
+    /* @__PURE__ */ jsx("form", { onSubmit: handleSubmit, children: /* @__PURE__ */ jsxs(Grid, { container: true, spacing: 3, children: [
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+        TextField,
         {
-          name: "active",
-          checked: form.active,
-          onChange: handleChangeActive,
-          color: "primary"
+          id: "title",
+          label: t("announcementForm.title"),
+          value: form.title,
+          onChange: handleChange,
+          variant: "outlined",
+          fullWidth: true,
+          required: true
         }
-      ),
-      label: t("announcementForm.active")
-    }
-  ), /* @__PURE__ */ React__default.createElement(
-    Button,
-    {
-      variant: "contained",
-      color: "primary",
-      type: "submit",
-      disabled: loading || !form.body,
-      size: "large",
-      startIcon: /* @__PURE__ */ React__default.createElement(SaveAltIcon, null)
-    },
-    t("announcementForm.submit")
-  )))))));
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sm: 6, children: /* @__PURE__ */ jsx(
+        CategoryInput,
+        {
+          setForm,
+          form,
+          initialValue: initialData.category?.title ?? ""
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, sm: 6, children: /* @__PURE__ */ jsx(
+        TextField,
+        {
+          variant: "outlined",
+          label: t("announcementForm.startAt"),
+          id: "start-at-date",
+          type: "date",
+          value: form.start_at,
+          InputLabelProps: { shrink: true },
+          required: true,
+          onChange: (e) => setForm({
+            ...form,
+            start_at: e.target.value
+          })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+        TextField,
+        {
+          id: "excerpt",
+          label: t("announcementForm.excerpt"),
+          value: form.excerpt,
+          onChange: handleChange,
+          variant: "outlined",
+          fullWidth: true,
+          required: true,
+          multiline: true
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(
+        MDEditor,
+        {
+          value: form.body,
+          style: { minHeight: "30rem" },
+          onChange: (value) => setForm({ ...form, ...{ body: value || "" } })
+        }
+      ) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsx(Divider, {}) }),
+      /* @__PURE__ */ jsx(Grid, { item: true, xs: 12, children: /* @__PURE__ */ jsxs(FormGroup, { row: true, style: { justifyContent: "flex-end" }, children: [
+        /* @__PURE__ */ jsx(
+          FormControlLabel,
+          {
+            control: /* @__PURE__ */ jsx(
+              Switch,
+              {
+                name: "active",
+                checked: form.active,
+                onChange: handleChangeActive,
+                color: "primary"
+              }
+            ),
+            label: t("announcementForm.active")
+          }
+        ),
+        /* @__PURE__ */ jsx(
+          Button,
+          {
+            variant: "contained",
+            color: "primary",
+            type: "submit",
+            disabled: loading || !form.body,
+            size: "large",
+            startIcon: /* @__PURE__ */ jsx(SaveAltIcon, {}),
+            children: t("announcementForm.submit")
+          }
+        )
+      ] }) })
+    ] }) })
+  ] }) });
 };
 
 export { AnnouncementForm };

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

@@ -1 +1 @@
-{"version":3,"file":"AnnouncementForm.esm.js","sources":["../../../src/components/AnnouncementForm/AnnouncementForm.tsx"],"sourcesContent":["/*\n * Copyright 2024 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, { useState } from 'react';\nimport MDEditor from '@uiw/react-md-editor';\nimport { InfoCard } from '@backstage/core-components';\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\nimport {\n  CreateAnnouncementRequest,\n  useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport { Announcement } from '@backstage-community/plugin-announcements-common';\nimport CategoryInput from './CategoryInput';\nimport {\n  TextField,\n  FormGroup,\n  FormControlLabel,\n  Switch,\n  Button,\n  Box,\n  Grid,\n  Typography,\n  Divider,\n} from '@material-ui/core';\nimport SaveAltIcon from '@material-ui/icons/SaveAlt';\nimport { DateTime } from 'luxon';\n\ntype AnnouncementFormProps = {\n  initialData: Announcement;\n  onSubmit: (data: CreateAnnouncementRequest) => Promise<void>;\n};\n\nexport const AnnouncementForm = ({\n  initialData,\n  onSubmit,\n}: AnnouncementFormProps) => {\n  const identityApi = useApi(identityApiRef);\n  const { t } = useAnnouncementsTranslation();\n\n  // Ensure `start_at` is properly formatted as an ISO date string\n  const formattedStartAt = initialData.start_at\n    ? DateTime.fromISO(initialData.start_at).toISODate()\n    : DateTime.now().toISODate();\n\n  const [form, setForm] = React.useState({\n    ...initialData,\n    category: initialData.category?.slug,\n    start_at: formattedStartAt || '',\n  });\n  const [loading, setLoading] = useState(false);\n\n  const handleChange = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setForm({\n      ...form,\n      [event.target.id]: event.target.value,\n    });\n  };\n\n  const handleChangeActive = (event: React.ChangeEvent<HTMLInputElement>) => {\n    setForm({\n      ...form,\n      [event.target.name]: event.target.checked,\n    });\n  };\n\n  const handleSubmit = async (event: React.FormEvent<HTMLFormElement>) => {\n    setLoading(true);\n    event.preventDefault();\n\n    const userIdentity = await identityApi.getBackstageIdentity();\n    const createRequest = {\n      ...form,\n      ...{\n        publisher: userIdentity.userEntityRef,\n      },\n    };\n\n    await onSubmit(createRequest);\n    setLoading(false);\n  };\n\n  return (\n    <InfoCard>\n      <Box p={3}>\n        <Typography variant=\"h5\" gutterBottom>\n          {initialData.title\n            ? t('announcementForm.editAnnouncement')\n            : t('announcementForm.newAnnouncement')}\n        </Typography>\n        <form onSubmit={handleSubmit}>\n          <Grid container spacing={3}>\n            <Grid item xs={12}>\n              <TextField\n                id=\"title\"\n                label={t('announcementForm.title')}\n                value={form.title}\n                onChange={handleChange}\n                variant=\"outlined\"\n                fullWidth\n                required\n              />\n            </Grid>\n\n            <Grid item xs={12} sm={6}>\n              <CategoryInput\n                setForm={setForm}\n                form={form}\n                initialValue={initialData.category?.title ?? ''}\n              />\n            </Grid>\n\n            <Grid item xs={12} sm={6}>\n              <TextField\n                variant=\"outlined\"\n                label={t('announcementForm.startAt')}\n                id=\"start-at-date\"\n                type=\"date\"\n                value={form.start_at}\n                InputLabelProps={{ shrink: true }}\n                required\n                onChange={e =>\n                  setForm({\n                    ...form,\n                    start_at: e.target.value,\n                  })\n                }\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <TextField\n                id=\"excerpt\"\n                label={t('announcementForm.excerpt')}\n                value={form.excerpt}\n                onChange={handleChange}\n                variant=\"outlined\"\n                fullWidth\n                required\n                multiline\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <MDEditor\n                value={form.body}\n                style={{ minHeight: '30rem' }}\n                onChange={value =>\n                  setForm({ ...form, ...{ body: value || '' } })\n                }\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <Divider />\n            </Grid>\n\n            <Grid item xs={12}>\n              <FormGroup row style={{ justifyContent: 'flex-end' }}>\n                <FormControlLabel\n                  control={\n                    <Switch\n                      name=\"active\"\n                      checked={form.active}\n                      onChange={handleChangeActive}\n                      color=\"primary\"\n                    />\n                  }\n                  label={t('announcementForm.active')}\n                />\n                <Button\n                  variant=\"contained\"\n                  color=\"primary\"\n                  type=\"submit\"\n                  disabled={loading || !form.body}\n                  size=\"large\"\n                  startIcon={<SaveAltIcon />}\n                >\n                  {t('announcementForm.submit')}\n                </Button>\n              </FormGroup>\n            </Grid>\n          </Grid>\n        </form>\n      </Box>\n    </InfoCard>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"AnnouncementForm.esm.js","sources":["../../../src/components/AnnouncementForm/AnnouncementForm.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { useState, type ChangeEvent, type FormEvent } from 'react';\nimport MDEditor from '@uiw/react-md-editor';\nimport { InfoCard } from '@backstage/core-components';\nimport { identityApiRef, useApi } from '@backstage/core-plugin-api';\nimport {\n  CreateAnnouncementRequest,\n  useAnnouncementsTranslation,\n} from '@backstage-community/plugin-announcements-react';\nimport { Announcement } from '@backstage-community/plugin-announcements-common';\nimport CategoryInput from './CategoryInput';\nimport {\n  TextField,\n  FormGroup,\n  FormControlLabel,\n  Switch,\n  Button,\n  Box,\n  Grid,\n  Typography,\n  Divider,\n} from '@material-ui/core';\nimport SaveAltIcon from '@material-ui/icons/SaveAlt';\nimport { DateTime } from 'luxon';\n\ntype AnnouncementFormProps = {\n  initialData: Announcement;\n  onSubmit: (data: CreateAnnouncementRequest) => Promise<void>;\n};\n\nexport const AnnouncementForm = ({\n  initialData,\n  onSubmit,\n}: AnnouncementFormProps) => {\n  const identityApi = useApi(identityApiRef);\n  const { t } = useAnnouncementsTranslation();\n\n  // Ensure `start_at` is properly formatted as an ISO date string\n  const formattedStartAt = initialData.start_at\n    ? DateTime.fromISO(initialData.start_at).toISODate()\n    : DateTime.now().toISODate();\n\n  const [form, setForm] = useState({\n    ...initialData,\n    category: initialData.category?.slug,\n    start_at: formattedStartAt || '',\n  });\n  const [loading, setLoading] = useState(false);\n\n  const handleChange = (event: ChangeEvent<HTMLInputElement>) => {\n    setForm({\n      ...form,\n      [event.target.id]: event.target.value,\n    });\n  };\n\n  const handleChangeActive = (event: ChangeEvent<HTMLInputElement>) => {\n    setForm({\n      ...form,\n      [event.target.name]: event.target.checked,\n    });\n  };\n\n  const handleSubmit = async (event: FormEvent<HTMLFormElement>) => {\n    setLoading(true);\n    event.preventDefault();\n\n    const userIdentity = await identityApi.getBackstageIdentity();\n    const createRequest = {\n      ...form,\n      ...{\n        publisher: userIdentity.userEntityRef,\n      },\n    };\n\n    await onSubmit(createRequest);\n    setLoading(false);\n  };\n\n  return (\n    <InfoCard>\n      <Box p={3}>\n        <Typography variant=\"h5\" gutterBottom>\n          {initialData.title\n            ? t('announcementForm.editAnnouncement')\n            : t('announcementForm.newAnnouncement')}\n        </Typography>\n        <form onSubmit={handleSubmit}>\n          <Grid container spacing={3}>\n            <Grid item xs={12}>\n              <TextField\n                id=\"title\"\n                label={t('announcementForm.title')}\n                value={form.title}\n                onChange={handleChange}\n                variant=\"outlined\"\n                fullWidth\n                required\n              />\n            </Grid>\n\n            <Grid item xs={12} sm={6}>\n              <CategoryInput\n                setForm={setForm}\n                form={form}\n                initialValue={initialData.category?.title ?? ''}\n              />\n            </Grid>\n\n            <Grid item xs={12} sm={6}>\n              <TextField\n                variant=\"outlined\"\n                label={t('announcementForm.startAt')}\n                id=\"start-at-date\"\n                type=\"date\"\n                value={form.start_at}\n                InputLabelProps={{ shrink: true }}\n                required\n                onChange={e =>\n                  setForm({\n                    ...form,\n                    start_at: e.target.value,\n                  })\n                }\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <TextField\n                id=\"excerpt\"\n                label={t('announcementForm.excerpt')}\n                value={form.excerpt}\n                onChange={handleChange}\n                variant=\"outlined\"\n                fullWidth\n                required\n                multiline\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <MDEditor\n                value={form.body}\n                style={{ minHeight: '30rem' }}\n                onChange={value =>\n                  setForm({ ...form, ...{ body: value || '' } })\n                }\n              />\n            </Grid>\n\n            <Grid item xs={12}>\n              <Divider />\n            </Grid>\n\n            <Grid item xs={12}>\n              <FormGroup row style={{ justifyContent: 'flex-end' }}>\n                <FormControlLabel\n                  control={\n                    <Switch\n                      name=\"active\"\n                      checked={form.active}\n                      onChange={handleChangeActive}\n                      color=\"primary\"\n                    />\n                  }\n                  label={t('announcementForm.active')}\n                />\n                <Button\n                  variant=\"contained\"\n                  color=\"primary\"\n                  type=\"submit\"\n                  disabled={loading || !form.body}\n                  size=\"large\"\n                  startIcon={<SaveAltIcon />}\n                >\n                  {t('announcementForm.submit')}\n                </Button>\n              </FormGroup>\n            </Grid>\n          </Grid>\n        </form>\n      </Box>\n    </InfoCard>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AnnouncementForm/CategoryInput.esm.js

@@ -1,4 +1,4 @@
-import * as React from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import TextField from '@mui/material/TextField';
 import Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';
 import { useCategories, useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';
@@ -15,7 +15,7 @@ function CategoryInput({
 }) {
   const { categories, loading: categoriesLoading } = useCategories();
   const { t } = useAnnouncementsTranslation();
-  return /* @__PURE__ */ React.createElement(
+  return /* @__PURE__ */ jsx(
     Autocomplete,
     {
       fullWidth: true,
@@ -55,9 +55,9 @@ function CategoryInput({
       getOptionLabel: (option) => {
         return prepareCategoryFromInput(option);
       },
-      renderOption: (props, option) => /* @__PURE__ */ React.createElement("li", { ...props }, option.title),
+      renderOption: (props, option) => /* @__PURE__ */ jsx("li", { ...props, children: option.title }),
       freeSolo: true,
-      renderInput: (params) => /* @__PURE__ */ React.createElement(
+      renderInput: (params) => /* @__PURE__ */ jsx(
         TextField,
         {
           ...params,
@@ -67,7 +67,10 @@ function CategoryInput({
           fullWidth: true,
           InputProps: {
             ...params.InputProps,
-            endAdornment: /* @__PURE__ */ React.createElement(React.Fragment, null, categoriesLoading ? /* @__PURE__ */ React.createElement(CircularProgress, { color: "inherit", size: 20 }) : null, params.InputProps.endAdornment)
+            endAdornment: /* @__PURE__ */ jsxs(Fragment, { children: [
+              categoriesLoading ? /* @__PURE__ */ jsx(CircularProgress, { color: "inherit", size: 20 }) : null,
+              params.InputProps.endAdornment
+            ] })
           }
         }
       )

package/dist/components/AnnouncementForm/CategoryInput.esm.js.map

@@ -1 +1 @@
-{"version":3,"file":"CategoryInput.esm.js","sources":["../../../src/components/AnnouncementForm/CategoryInput.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 * as React from 'react';\nimport TextField from '@mui/material/TextField';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport { Category } from '@backstage-community/plugin-announcements-common';\nimport {\n  useAnnouncementsTranslation,\n  useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport CircularProgress from '@mui/material/CircularProgress';\n\ntype CategoryInputProps = {\n  setForm: (\n    value: React.SetStateAction<{\n      category: string | undefined;\n      id: string;\n      publisher: string;\n      title: string;\n      excerpt: string;\n      body: string;\n      created_at: string;\n      active: boolean;\n      start_at: string;\n    }>,\n  ) => void;\n  form: {\n    category: string | undefined;\n    id: string;\n    publisher: string;\n    title: string;\n    excerpt: string;\n    body: string;\n    created_at: string;\n    active: boolean;\n    start_at: string;\n  };\n  initialValue: string;\n};\n\nconst filter = createFilterOptions<Category>();\n\nfunction prepareCategoryFromInput(\n  inputCategory: Category | string,\n  localizedCreate?: string,\n): string {\n  return (\n    typeof inputCategory === 'string' ? inputCategory : inputCategory.title\n  )\n    .replace(localizedCreate ? `${localizedCreate} ` : 'Create ', '')\n    .replaceAll('\"', '');\n}\n\nexport default function CategoryInput({\n  setForm,\n  form,\n  initialValue,\n}: CategoryInputProps) {\n  const { categories, loading: categoriesLoading } = useCategories();\n  const { t } = useAnnouncementsTranslation();\n\n  return (\n    <Autocomplete\n      fullWidth\n      value={initialValue ?? ''}\n      onChange={async (_, newValue) => {\n        if (!newValue) {\n          setForm({ ...form, category: undefined });\n          return;\n        }\n\n        const newCategory = prepareCategoryFromInput(\n          newValue,\n          t('announcementForm.categoryInput.create'),\n        );\n        setForm({ ...form, category: newCategory });\n      }}\n      filterOptions={(options, params) => {\n        const filtered = filter(options, params);\n        const { inputValue } = params;\n\n        /*\n          Suggest the creation of a new category. This adds the new value to the list of options\n          and creates the new category when the form is submitted.\n        */\n        const isExisting = options.some(\n          option =>\n            inputValue.toLocaleLowerCase('en-US') ===\n            option.title.toLocaleLowerCase('en-US'),\n        );\n        if (inputValue !== '' && !isExisting) {\n          filtered.push({\n            title: `${t(\n              'announcementForm.categoryInput.create',\n            )} \"${inputValue}\"`,\n            slug: inputValue.toLocaleLowerCase('en-US'),\n          });\n        }\n\n        return filtered;\n      }}\n      selectOnFocus\n      handleHomeEndKeys\n      loading={categoriesLoading}\n      id=\"category-input-field\"\n      options={categories || []}\n      getOptionLabel={option => {\n        // Value selected with enter, right from the input\n        return prepareCategoryFromInput(option);\n      }}\n      renderOption={(props, option) => <li {...props}>{option.title}</li>}\n      freeSolo\n      renderInput={params => (\n        <TextField\n          {...params}\n          id=\"category\"\n          label={t('announcementForm.categoryInput.label')}\n          variant=\"outlined\"\n          fullWidth\n          InputProps={{\n            ...params.InputProps,\n            endAdornment: (\n              <>\n                {categoriesLoading ? (\n                  <CircularProgress color=\"inherit\" size={20} />\n                ) : null}\n                {params.InputProps.endAdornment}\n              </>\n            ),\n          }}\n        />\n      )}\n    />\n  );\n}\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"CategoryInput.esm.js","sources":["../../../src/components/AnnouncementForm/CategoryInput.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { SetStateAction } from 'react';\nimport TextField from '@mui/material/TextField';\nimport Autocomplete, { createFilterOptions } from '@mui/material/Autocomplete';\nimport { Category } from '@backstage-community/plugin-announcements-common';\nimport {\n  useAnnouncementsTranslation,\n  useCategories,\n} from '@backstage-community/plugin-announcements-react';\nimport CircularProgress from '@mui/material/CircularProgress';\n\ntype CategoryInputProps = {\n  setForm: (\n    value: SetStateAction<{\n      category: string | undefined;\n      id: string;\n      publisher: string;\n      title: string;\n      excerpt: string;\n      body: string;\n      created_at: string;\n      active: boolean;\n      start_at: string;\n    }>,\n  ) => void;\n  form: {\n    category: string | undefined;\n    id: string;\n    publisher: string;\n    title: string;\n    excerpt: string;\n    body: string;\n    created_at: string;\n    active: boolean;\n    start_at: string;\n  };\n  initialValue: string;\n};\n\nconst filter = createFilterOptions<Category>();\n\nfunction prepareCategoryFromInput(\n  inputCategory: Category | string,\n  localizedCreate?: string,\n): string {\n  return (\n    typeof inputCategory === 'string' ? inputCategory : inputCategory.title\n  )\n    .replace(localizedCreate ? `${localizedCreate} ` : 'Create ', '')\n    .replaceAll('\"', '');\n}\n\nexport default function CategoryInput({\n  setForm,\n  form,\n  initialValue,\n}: CategoryInputProps) {\n  const { categories, loading: categoriesLoading } = useCategories();\n  const { t } = useAnnouncementsTranslation();\n\n  return (\n    <Autocomplete\n      fullWidth\n      value={initialValue ?? ''}\n      onChange={async (_, newValue) => {\n        if (!newValue) {\n          setForm({ ...form, category: undefined });\n          return;\n        }\n\n        const newCategory = prepareCategoryFromInput(\n          newValue,\n          t('announcementForm.categoryInput.create'),\n        );\n        setForm({ ...form, category: newCategory });\n      }}\n      filterOptions={(options, params) => {\n        const filtered = filter(options, params);\n        const { inputValue } = params;\n\n        /*\n          Suggest the creation of a new category. This adds the new value to the list of options\n          and creates the new category when the form is submitted.\n        */\n        const isExisting = options.some(\n          option =>\n            inputValue.toLocaleLowerCase('en-US') ===\n            option.title.toLocaleLowerCase('en-US'),\n        );\n        if (inputValue !== '' && !isExisting) {\n          filtered.push({\n            title: `${t(\n              'announcementForm.categoryInput.create',\n            )} \"${inputValue}\"`,\n            slug: inputValue.toLocaleLowerCase('en-US'),\n          });\n        }\n\n        return filtered;\n      }}\n      selectOnFocus\n      handleHomeEndKeys\n      loading={categoriesLoading}\n      id=\"category-input-field\"\n      options={categories || []}\n      getOptionLabel={option => {\n        // Value selected with enter, right from the input\n        return prepareCategoryFromInput(option);\n      }}\n      renderOption={(props, option) => <li {...props}>{option.title}</li>}\n      freeSolo\n      renderInput={params => (\n        <TextField\n          {...params}\n          id=\"category\"\n          label={t('announcementForm.categoryInput.label')}\n          variant=\"outlined\"\n          fullWidth\n          InputProps={{\n            ...params.InputProps,\n            endAdornment: (\n              <>\n                {categoriesLoading ? (\n                  <CircularProgress color=\"inherit\" size={20} />\n                ) : null}\n                {params.InputProps.endAdornment}\n              </>\n            ),\n          }}\n        />\n      )}\n    />\n  );\n}\n"],"names":[],"mappings":"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"}

package/dist/components/AnnouncementPage/AnnouncementPage.esm.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx, jsxs } from 'react/jsx-runtime';
 import useAsync from 'react-use/lib/useAsync';
 import { DateTime } from 'luxon';
 import { Page, Header, Content, Progress, Link, InfoCard, MarkdownContent } from '@backstage/core-components';
@@ -20,15 +20,21 @@ const AnnouncementDetails = ({
     title: "Back to announcements"
   };
   const publisherRef = parseEntityRef(announcement.publisher);
-  const subHeader = /* @__PURE__ */ React__default.createElement(Typography, null, "By", " ", /* @__PURE__ */ React__default.createElement(EntityPeekAheadPopover, { entityRef: announcement.publisher }, /* @__PURE__ */ React__default.createElement(Link, { to: entityLink(publisherRef) }, /* @__PURE__ */ React__default.createElement(EntityDisplayName, { entityRef: announcement.publisher, hideIcon: true }))), ", ", DateTime.fromISO(announcement.created_at).toRelative());
-  return /* @__PURE__ */ React__default.createElement(
+  const subHeader = /* @__PURE__ */ jsxs(Typography, { children: [
+    "By",
+    " ",
+    /* @__PURE__ */ jsx(EntityPeekAheadPopover, { entityRef: announcement.publisher, children: /* @__PURE__ */ jsx(Link, { to: entityLink(publisherRef), children: /* @__PURE__ */ jsx(EntityDisplayName, { entityRef: announcement.publisher, hideIcon: true }) }) }),
+    ", ",
+    DateTime.fromISO(announcement.created_at).toRelative()
+  ] });
+  return /* @__PURE__ */ jsx(
     InfoCard,
     {
       title: announcement.title,
       subheader: subHeader,
-      deepLink
-    },
-    /* @__PURE__ */ React__default.createElement(MarkdownContent, { content: announcement.body })
+      deepLink,
+      children: /* @__PURE__ */ jsx(MarkdownContent, { content: announcement.body })
+    }
   );
 };
 const AnnouncementPage = (props) => {
@@ -41,19 +47,22 @@ const AnnouncementPage = (props) => {
   let title = props.title;
   let content;
   if (loading) {
-    content = /* @__PURE__ */ React__default.createElement(Progress, null);
+    content = /* @__PURE__ */ jsx(Progress, {});
   } else if (error) {
-    content = /* @__PURE__ */ React__default.createElement(Alert, { severity: "error" }, error.message);
+    content = /* @__PURE__ */ jsx(Alert, { severity: "error", children: error.message });
   } else {
     title = `${value.title} \u2013 ${title}`;
-    content = /* @__PURE__ */ React__default.createElement(AnnouncementDetails, { announcement: value });
+    content = /* @__PURE__ */ jsx(AnnouncementDetails, { announcement: value });
     const lastSeen = announcementsApi.lastSeenDate();
     const announcementCreatedAt = DateTime.fromISO(value.created_at);
     if (announcementCreatedAt > lastSeen) {
       announcementsApi.markLastSeenDate(announcementCreatedAt);
     }
   }
-  return /* @__PURE__ */ React__default.createElement(Page, { themeId: props.themeId }, /* @__PURE__ */ React__default.createElement(Header, { title, subtitle: props.subtitle }), /* @__PURE__ */ React__default.createElement(Content, null, /* @__PURE__ */ React__default.createElement(Grid, { container: true, justifyContent: "center", alignItems: "center" }, /* @__PURE__ */ React__default.createElement(Grid, { item: true, sm: 6 }, content))));
+  return /* @__PURE__ */ jsxs(Page, { themeId: props.themeId, children: [
+    /* @__PURE__ */ jsx(Header, { title, subtitle: props.subtitle }),
+    /* @__PURE__ */ jsx(Content, { children: /* @__PURE__ */ jsx(Grid, { container: true, justifyContent: "center", alignItems: "center", children: /* @__PURE__ */ jsx(Grid, { item: true, sm: 6, children: content }) }) })
+  ] });
 };
 
 export { AnnouncementPage };

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

@@ -1 +1 @@
-{"version":3,"file":"AnnouncementPage.esm.js","sources":["../../../src/components/AnnouncementPage/AnnouncementPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 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, { ReactNode } from 'react';\nimport useAsync from 'react-use/lib/useAsync';\nimport { DateTime } from 'luxon';\nimport {\n  Progress,\n  Page,\n  Header,\n  Content,\n  MarkdownContent,\n  InfoCard,\n  Link,\n} from '@backstage/core-components';\nimport {\n  useApi,\n  useRouteRef,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport {\n  EntityDisplayName,\n  EntityPeekAheadPopover,\n  entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { announcementViewRouteRef, rootRouteRef } from '../../routes';\nimport { announcementsApiRef } from '@backstage-community/plugin-announcements-react';\nimport { Announcement } from '@backstage-community/plugin-announcements-common';\nimport { Grid, Typography } from '@material-ui/core';\nimport { Alert } from '@material-ui/lab';\n\nconst AnnouncementDetails = ({\n  announcement,\n}: {\n  announcement: Announcement;\n}) => {\n  const announcementsLink = useRouteRef(rootRouteRef);\n  const entityLink = useRouteRef(entityRouteRef);\n  const deepLink = {\n    link: announcementsLink(),\n    title: 'Back to announcements',\n  };\n\n  const publisherRef = parseEntityRef(announcement.publisher);\n  const subHeader = (\n    <Typography>\n      By{' '}\n      <EntityPeekAheadPopover entityRef={announcement.publisher}>\n        <Link to={entityLink(publisherRef)}>\n          <EntityDisplayName entityRef={announcement.publisher} hideIcon />\n        </Link>\n      </EntityPeekAheadPopover>\n      , {DateTime.fromISO(announcement.created_at).toRelative()}\n    </Typography>\n  );\n\n  return (\n    <InfoCard\n      title={announcement.title}\n      subheader={subHeader}\n      deepLink={deepLink}\n    >\n      <MarkdownContent content={announcement.body} />\n    </InfoCard>\n  );\n};\n\ntype AnnouncementPageProps = {\n  themeId: string;\n  title: string;\n  subtitle?: ReactNode;\n};\n\nexport const AnnouncementPage = (props: AnnouncementPageProps) => {\n  const announcementsApi = useApi(announcementsApiRef);\n  const { id } = useRouteRefParams(announcementViewRouteRef);\n  const { value, loading, error } = useAsync(\n    async () => announcementsApi.announcementByID(id),\n    [id],\n  );\n\n  let title = props.title;\n  let content: React.ReactNode;\n\n  if (loading) {\n    content = <Progress />;\n  } else if (error) {\n    content = <Alert severity=\"error\">{error.message}</Alert>;\n  } else {\n    title = `${value!.title} – ${title}`;\n    content = <AnnouncementDetails announcement={value!} />;\n\n    const lastSeen = announcementsApi.lastSeenDate();\n    const announcementCreatedAt = DateTime.fromISO(value!.created_at);\n\n    if (announcementCreatedAt > lastSeen) {\n      announcementsApi.markLastSeenDate(announcementCreatedAt);\n    }\n  }\n\n  return (\n    <Page themeId={props.themeId}>\n      <Header title={title} subtitle={props.subtitle} />\n\n      <Content>\n        <Grid container justifyContent=\"center\" alignItems=\"center\">\n          <Grid item sm={6}>\n            {content}\n          </Grid>\n        </Grid>\n      </Content>\n    </Page>\n  );\n};\n"],"names":["React"],"mappings":"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"}
+{"version":3,"file":"AnnouncementPage.esm.js","sources":["../../../src/components/AnnouncementPage/AnnouncementPage.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { ReactNode } from 'react';\nimport useAsync from 'react-use/lib/useAsync';\nimport { DateTime } from 'luxon';\nimport {\n  Progress,\n  Page,\n  Header,\n  Content,\n  MarkdownContent,\n  InfoCard,\n  Link,\n} from '@backstage/core-components';\nimport {\n  useApi,\n  useRouteRef,\n  useRouteRefParams,\n} from '@backstage/core-plugin-api';\nimport { parseEntityRef } from '@backstage/catalog-model';\nimport {\n  EntityDisplayName,\n  EntityPeekAheadPopover,\n  entityRouteRef,\n} from '@backstage/plugin-catalog-react';\nimport { announcementViewRouteRef, rootRouteRef } from '../../routes';\nimport { announcementsApiRef } from '@backstage-community/plugin-announcements-react';\nimport { Announcement } from '@backstage-community/plugin-announcements-common';\nimport { Grid, Typography } from '@material-ui/core';\nimport { Alert } from '@material-ui/lab';\n\nconst AnnouncementDetails = ({\n  announcement,\n}: {\n  announcement: Announcement;\n}) => {\n  const announcementsLink = useRouteRef(rootRouteRef);\n  const entityLink = useRouteRef(entityRouteRef);\n  const deepLink = {\n    link: announcementsLink(),\n    title: 'Back to announcements',\n  };\n\n  const publisherRef = parseEntityRef(announcement.publisher);\n  const subHeader = (\n    <Typography>\n      By{' '}\n      <EntityPeekAheadPopover entityRef={announcement.publisher}>\n        <Link to={entityLink(publisherRef)}>\n          <EntityDisplayName entityRef={announcement.publisher} hideIcon />\n        </Link>\n      </EntityPeekAheadPopover>\n      , {DateTime.fromISO(announcement.created_at).toRelative()}\n    </Typography>\n  );\n\n  return (\n    <InfoCard\n      title={announcement.title}\n      subheader={subHeader}\n      deepLink={deepLink}\n    >\n      <MarkdownContent content={announcement.body} />\n    </InfoCard>\n  );\n};\n\ntype AnnouncementPageProps = {\n  themeId: string;\n  title: string;\n  subtitle?: ReactNode;\n};\n\nexport const AnnouncementPage = (props: AnnouncementPageProps) => {\n  const announcementsApi = useApi(announcementsApiRef);\n  const { id } = useRouteRefParams(announcementViewRouteRef);\n  const { value, loading, error } = useAsync(\n    async () => announcementsApi.announcementByID(id),\n    [id],\n  );\n\n  let title = props.title;\n  let content: ReactNode;\n\n  if (loading) {\n    content = <Progress />;\n  } else if (error) {\n    content = <Alert severity=\"error\">{error.message}</Alert>;\n  } else {\n    title = `${value!.title} – ${title}`;\n    content = <AnnouncementDetails announcement={value!} />;\n\n    const lastSeen = announcementsApi.lastSeenDate();\n    const announcementCreatedAt = DateTime.fromISO(value!.created_at);\n\n    if (announcementCreatedAt > lastSeen) {\n      announcementsApi.markLastSeenDate(announcementCreatedAt);\n    }\n  }\n\n  return (\n    <Page themeId={props.themeId}>\n      <Header title={title} subtitle={props.subtitle} />\n\n      <Content>\n        <Grid container justifyContent=\"center\" alignItems=\"center\">\n          <Grid item sm={6}>\n            {content}\n          </Grid>\n        </Grid>\n      </Content>\n    </Page>\n  );\n};\n"],"names":[],"mappings":"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"}

package/dist/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.esm.js

@@ -1,4 +1,4 @@
-import React__default from 'react';
+import { jsx, jsxs, Fragment } from 'react/jsx-runtime';
 import { DateTime } from 'luxon';
 import { Link } from '@backstage/core-components';
 import { HighlightedSearchResultText } from '@backstage/plugin-search-react';
@@ -30,31 +30,40 @@ const AnnouncementSearchResultListItem = ({
     return null;
   }
   const document = result;
-  const title = /* @__PURE__ */ React__default.createElement(Link, { noTrack: true, to: result.location }, highlight?.fields.title ? /* @__PURE__ */ React__default.createElement(
+  const title = /* @__PURE__ */ jsx(Link, { noTrack: true, to: result.location, children: highlight?.fields.title ? /* @__PURE__ */ jsx(
     HighlightedSearchResultText,
     {
       text: highlight.fields.title,
       preTag: highlight.preTag,
       postTag: highlight.postTag
     }
-  ) : result.title);
-  const excerpt = /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, /* @__PURE__ */ React__default.createElement(Typography, { component: "span", className: classes.createdAt }, `${t("announcementSearchResultListItem.published")} `, /* @__PURE__ */ React__default.createElement(Typography, { component: "span", title: document.createdAt }, DateTime.fromISO(document.createdAt).toRelative())), /* @__PURE__ */ React__default.createElement(React__default.Fragment, null, highlight?.fields.text ? /* @__PURE__ */ React__default.createElement(
-    HighlightedSearchResultText,
-    {
-      text: highlight.fields.text,
-      preTag: highlight.preTag,
-      postTag: highlight.postTag
-    }
-  ) : result.text));
-  return /* @__PURE__ */ React__default.createElement(ListItem, { alignItems: "center" }, /* @__PURE__ */ React__default.createElement(ListItemIcon, { title: t("announcementSearchResultListItem.announcement") }, /* @__PURE__ */ React__default.createElement(RecordVoiceOverIcon, null)), /* @__PURE__ */ React__default.createElement(
-    ListItemText,
-    {
-      primary: title,
-      secondary: excerpt,
-      className: classes.itemText,
-      primaryTypographyProps: { variant: "h6" }
-    }
-  ));
+  ) : result.title });
+  const excerpt = /* @__PURE__ */ jsxs(Fragment, { children: [
+    /* @__PURE__ */ jsxs(Typography, { component: "span", className: classes.createdAt, children: [
+      `${t("announcementSearchResultListItem.published")} `,
+      /* @__PURE__ */ jsx(Typography, { component: "span", title: document.createdAt, children: DateTime.fromISO(document.createdAt).toRelative() })
+    ] }),
+    /* @__PURE__ */ jsx(Fragment, { children: highlight?.fields.text ? /* @__PURE__ */ jsx(
+      HighlightedSearchResultText,
+      {
+        text: highlight.fields.text,
+        preTag: highlight.preTag,
+        postTag: highlight.postTag
+      }
+    ) : result.text })
+  ] });
+  return /* @__PURE__ */ jsxs(ListItem, { alignItems: "center", children: [
+    /* @__PURE__ */ jsx(ListItemIcon, { title: t("announcementSearchResultListItem.announcement"), children: /* @__PURE__ */ jsx(RecordVoiceOverIcon, {}) }),
+    /* @__PURE__ */ jsx(
+      ListItemText,
+      {
+        primary: title,
+        secondary: excerpt,
+        className: classes.itemText,
+        primaryTypographyProps: { variant: "h6" }
+      }
+    )
+  ] });
 };
 
 export { AnnouncementSearchResultListItem };

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

@@ -1 +1 @@
-{"version":3,"file":"AnnouncementSearchResultListItem.esm.js","sources":["../../../src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { DateTime } from 'luxon';\nimport { Link } from '@backstage/core-components';\nimport {\n  IndexableDocument,\n  ResultHighlight,\n} from '@backstage/plugin-search-common';\nimport { HighlightedSearchResultText } from '@backstage/plugin-search-react';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport {\n  makeStyles,\n  ListItem,\n  ListItemIcon,\n  ListItemText,\n  Typography,\n} from '@material-ui/core';\nimport RecordVoiceOverIcon from '@material-ui/icons/RecordVoiceOver';\n\nconst useStyles = makeStyles({\n  createdAt: {\n    display: 'block',\n    marginTop: '0.2rem',\n    marginBottom: '0.8rem',\n    fontSize: '0.8rem',\n  },\n  excerpt: {\n    lineHeight: '1.55',\n  },\n  itemText: {\n    wordBreak: 'break-all',\n  },\n});\n\ntype IndexableAnnouncement = IndexableDocument & {\n  createdAt: string;\n};\n\n/** @public */\nexport interface AnnouncementSearchResultProps {\n  result?: IndexableDocument;\n  highlight?: ResultHighlight;\n  rank?: number;\n}\n\nexport const AnnouncementSearchResultListItem = ({\n  result,\n  highlight,\n}: AnnouncementSearchResultProps) => {\n  const classes = useStyles();\n  const { t } = useAnnouncementsTranslation();\n\n  if (!result) {\n    return null;\n  }\n\n  const document = result as IndexableAnnouncement;\n\n  const title = (\n    <Link noTrack to={result.location}>\n      {highlight?.fields.title ? (\n        <HighlightedSearchResultText\n          text={highlight.fields.title}\n          preTag={highlight.preTag}\n          postTag={highlight.postTag}\n        />\n      ) : (\n        result.title\n      )}\n    </Link>\n  );\n\n  const excerpt = (\n    <>\n      <Typography component=\"span\" className={classes.createdAt}>\n        {`${t('announcementSearchResultListItem.published')} `}\n        <Typography component=\"span\" title={document.createdAt}>\n          {DateTime.fromISO(document.createdAt).toRelative()}\n        </Typography>\n      </Typography>\n      <>\n        {highlight?.fields.text ? (\n          <HighlightedSearchResultText\n            text={highlight.fields.text}\n            preTag={highlight.preTag}\n            postTag={highlight.postTag}\n          />\n        ) : (\n          result.text\n        )}\n      </>\n    </>\n  );\n\n  return (\n    <ListItem alignItems=\"center\">\n      <ListItemIcon title={t('announcementSearchResultListItem.announcement')}>\n        <RecordVoiceOverIcon />\n      </ListItemIcon>\n      <ListItemText\n        primary={title}\n        secondary={excerpt}\n        className={classes.itemText}\n        primaryTypographyProps={{ variant: 'h6' }}\n      />\n    </ListItem>\n  );\n};\n"],"names":["React"],"mappings":";;;;;;;;AAiCA,MAAM,YAAY,UAAW,CAAA;AAAA,EAC3B,SAAW,EAAA;AAAA,IACT,OAAS,EAAA,OAAA;AAAA,IACT,SAAW,EAAA,QAAA;AAAA,IACX,YAAc,EAAA,QAAA;AAAA,IACd,QAAU,EAAA;AAAA,GACZ;AAAA,EACA,OAAS,EAAA;AAAA,IACP,UAAY,EAAA;AAAA,GACd;AAAA,EACA,QAAU,EAAA;AAAA,IACR,SAAW,EAAA;AAAA;AAEf,CAAC,CAAA;AAaM,MAAM,mCAAmC,CAAC;AAAA,EAC/C,MAAA;AAAA,EACA;AACF,CAAqC,KAAA;AACnC,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAA,IAAI,CAAC,MAAQ,EAAA;AACX,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,MAAM,QAAW,GAAA,MAAA;AAEjB,EAAM,MAAA,KAAA,mBACHA,cAAA,CAAA,aAAA,CAAA,IAAA,EAAA,EAAK,OAAO,EAAA,IAAA,EAAC,IAAI,MAAO,CAAA,QAAA,EAAA,EACtB,SAAW,EAAA,MAAA,CAAO,KACjB,mBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,2BAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAM,UAAU,MAAO,CAAA,KAAA;AAAA,MACvB,QAAQ,SAAU,CAAA,MAAA;AAAA,MAClB,SAAS,SAAU,CAAA;AAAA;AAAA,GACrB,GAEA,OAAO,KAEX,CAAA;AAGF,EAAA,MAAM,OACJ,mBAAAA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,kBACGA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,WAAU,MAAO,EAAA,SAAA,EAAW,OAAQ,CAAA,SAAA,EAAA,EAC7C,CAAG,EAAA,CAAA,CAAE,4CAA4C,CAAC,qBAClDA,cAAA,CAAA,aAAA,CAAA,UAAA,EAAA,EAAW,SAAU,EAAA,MAAA,EAAO,KAAO,EAAA,QAAA,CAAS,SAC1C,EAAA,EAAA,QAAA,CAAS,QAAQ,QAAS,CAAA,SAAS,CAAE,CAAA,UAAA,EACxC,CACF,CAAA,kBAEGA,cAAA,CAAA,aAAA,CAAAA,cAAA,CAAA,QAAA,EAAA,IAAA,EAAA,SAAA,EAAW,OAAO,IACjB,mBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,2BAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAM,UAAU,MAAO,CAAA,IAAA;AAAA,MACvB,QAAQ,SAAU,CAAA,MAAA;AAAA,MAClB,SAAS,SAAU,CAAA;AAAA;AAAA,GACrB,GAEA,MAAO,CAAA,IAEX,CACF,CAAA;AAGF,EAAA,uBACGA,cAAA,CAAA,aAAA,CAAA,QAAA,EAAA,EAAS,UAAW,EAAA,QAAA,EAAA,kBAClBA,cAAA,CAAA,aAAA,CAAA,YAAA,EAAA,EAAa,KAAO,EAAA,CAAA,CAAE,+CAA+C,CAAA,EAAA,kBACnEA,cAAA,CAAA,aAAA,CAAA,mBAAA,EAAA,IAAoB,CACvB,CACA,kBAAAA,cAAA,CAAA,aAAA;AAAA,IAAC,YAAA;AAAA,IAAA;AAAA,MACC,OAAS,EAAA,KAAA;AAAA,MACT,SAAW,EAAA,OAAA;AAAA,MACX,WAAW,OAAQ,CAAA,QAAA;AAAA,MACnB,sBAAA,EAAwB,EAAE,OAAA,EAAS,IAAK;AAAA;AAAA,GAE5C,CAAA;AAEJ;;;;"}
+{"version":3,"file":"AnnouncementSearchResultListItem.esm.js","sources":["../../../src/components/AnnouncementSearchResultListItem/AnnouncementSearchResultListItem.tsx"],"sourcesContent":["/*\n * Copyright 2024 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 { DateTime } from 'luxon';\nimport { Link } from '@backstage/core-components';\nimport {\n  IndexableDocument,\n  ResultHighlight,\n} from '@backstage/plugin-search-common';\nimport { HighlightedSearchResultText } from '@backstage/plugin-search-react';\nimport { useAnnouncementsTranslation } from '@backstage-community/plugin-announcements-react';\nimport {\n  makeStyles,\n  ListItem,\n  ListItemIcon,\n  ListItemText,\n  Typography,\n} from '@material-ui/core';\nimport RecordVoiceOverIcon from '@material-ui/icons/RecordVoiceOver';\n\nconst useStyles = makeStyles({\n  createdAt: {\n    display: 'block',\n    marginTop: '0.2rem',\n    marginBottom: '0.8rem',\n    fontSize: '0.8rem',\n  },\n  excerpt: {\n    lineHeight: '1.55',\n  },\n  itemText: {\n    wordBreak: 'break-all',\n  },\n});\n\ntype IndexableAnnouncement = IndexableDocument & {\n  createdAt: string;\n};\n\n/** @public */\nexport interface AnnouncementSearchResultProps {\n  result?: IndexableDocument;\n  highlight?: ResultHighlight;\n  rank?: number;\n}\n\nexport const AnnouncementSearchResultListItem = ({\n  result,\n  highlight,\n}: AnnouncementSearchResultProps) => {\n  const classes = useStyles();\n  const { t } = useAnnouncementsTranslation();\n\n  if (!result) {\n    return null;\n  }\n\n  const document = result as IndexableAnnouncement;\n\n  const title = (\n    <Link noTrack to={result.location}>\n      {highlight?.fields.title ? (\n        <HighlightedSearchResultText\n          text={highlight.fields.title}\n          preTag={highlight.preTag}\n          postTag={highlight.postTag}\n        />\n      ) : (\n        result.title\n      )}\n    </Link>\n  );\n\n  const excerpt = (\n    <>\n      <Typography component=\"span\" className={classes.createdAt}>\n        {`${t('announcementSearchResultListItem.published')} `}\n        <Typography component=\"span\" title={document.createdAt}>\n          {DateTime.fromISO(document.createdAt).toRelative()}\n        </Typography>\n      </Typography>\n      <>\n        {highlight?.fields.text ? (\n          <HighlightedSearchResultText\n            text={highlight.fields.text}\n            preTag={highlight.preTag}\n            postTag={highlight.postTag}\n          />\n        ) : (\n          result.text\n        )}\n      </>\n    </>\n  );\n\n  return (\n    <ListItem alignItems=\"center\">\n      <ListItemIcon title={t('announcementSearchResultListItem.announcement')}>\n        <RecordVoiceOverIcon />\n      </ListItemIcon>\n      <ListItemText\n        primary={title}\n        secondary={excerpt}\n        className={classes.itemText}\n        primaryTypographyProps={{ variant: 'h6' }}\n      />\n    </ListItem>\n  );\n};\n"],"names":[],"mappings":";;;;;;;;AAgCA,MAAM,YAAY,UAAW,CAAA;AAAA,EAC3B,SAAW,EAAA;AAAA,IACT,OAAS,EAAA,OAAA;AAAA,IACT,SAAW,EAAA,QAAA;AAAA,IACX,YAAc,EAAA,QAAA;AAAA,IACd,QAAU,EAAA;AAAA,GACZ;AAAA,EACA,OAAS,EAAA;AAAA,IACP,UAAY,EAAA;AAAA,GACd;AAAA,EACA,QAAU,EAAA;AAAA,IACR,SAAW,EAAA;AAAA;AAEf,CAAC,CAAA;AAaM,MAAM,mCAAmC,CAAC;AAAA,EAC/C,MAAA;AAAA,EACA;AACF,CAAqC,KAAA;AACnC,EAAA,MAAM,UAAU,SAAU,EAAA;AAC1B,EAAM,MAAA,EAAE,CAAE,EAAA,GAAI,2BAA4B,EAAA;AAE1C,EAAA,IAAI,CAAC,MAAQ,EAAA;AACX,IAAO,OAAA,IAAA;AAAA;AAGT,EAAA,MAAM,QAAW,GAAA,MAAA;AAEjB,EAAM,MAAA,KAAA,mBACH,GAAA,CAAA,IAAA,EAAA,EAAK,OAAO,EAAA,IAAA,EAAC,IAAI,MAAO,CAAA,QAAA,EACtB,QAAW,EAAA,SAAA,EAAA,MAAA,CAAO,KACjB,mBAAA,GAAA;AAAA,IAAC,2BAAA;AAAA,IAAA;AAAA,MACC,IAAA,EAAM,UAAU,MAAO,CAAA,KAAA;AAAA,MACvB,QAAQ,SAAU,CAAA,MAAA;AAAA,MAClB,SAAS,SAAU,CAAA;AAAA;AAAA,GACrB,GAEA,OAAO,KAEX,EAAA,CAAA;AAGF,EAAA,MAAM,0BAEF,IAAA,CAAA,QAAA,EAAA,EAAA,QAAA,EAAA;AAAA,oBAAA,IAAA,CAAC,UAAW,EAAA,EAAA,SAAA,EAAU,MAAO,EAAA,SAAA,EAAW,QAAQ,SAC7C,EAAA,QAAA,EAAA;AAAA,MAAG,CAAA,EAAA,CAAA,CAAE,4CAA4C,CAAC,CAAA,CAAA,CAAA;AAAA,sBAClD,GAAA,CAAA,UAAA,EAAA,EAAW,SAAU,EAAA,MAAA,EAAO,KAAO,EAAA,QAAA,CAAS,SAC1C,EAAA,QAAA,EAAA,QAAA,CAAS,OAAQ,CAAA,QAAA,CAAS,SAAS,CAAA,CAAE,YACxC,EAAA;AAAA,KACF,EAAA,CAAA;AAAA,oBACA,GAAA,CAAA,QAAA,EAAA,EACG,QAAW,EAAA,SAAA,EAAA,MAAA,CAAO,IACjB,mBAAA,GAAA;AAAA,MAAC,2BAAA;AAAA,MAAA;AAAA,QACC,IAAA,EAAM,UAAU,MAAO,CAAA,IAAA;AAAA,QACvB,QAAQ,SAAU,CAAA,MAAA;AAAA,QAClB,SAAS,SAAU,CAAA;AAAA;AAAA,KACrB,GAEA,OAAO,IAEX,EAAA;AAAA,GACF,EAAA,CAAA;AAGF,EACE,uBAAA,IAAA,CAAC,QAAS,EAAA,EAAA,UAAA,EAAW,QACnB,EAAA,QAAA,EAAA;AAAA,oBAAA,GAAA,CAAC,gBAAa,KAAO,EAAA,CAAA,CAAE,+CAA+C,CACpE,EAAA,QAAA,kBAAA,GAAA,CAAC,uBAAoB,CACvB,EAAA,CAAA;AAAA,oBACA,GAAA;AAAA,MAAC,YAAA;AAAA,MAAA;AAAA,QACC,OAAS,EAAA,KAAA;AAAA,QACT,SAAW,EAAA,OAAA;AAAA,QACX,WAAW,OAAQ,CAAA,QAAA;AAAA,QACnB,sBAAA,EAAwB,EAAE,OAAA,EAAS,IAAK;AAAA;AAAA;AAC1C,GACF,EAAA,CAAA;AAEJ;;;;"}