From 545ce687a3521a9e5f267fb23a4574d22f79b0af Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Mehmet=20Mall=C4=B1?= <mehmet.malli@trendyol.com>
Date: Thu, 28 Apr 2022 23:56:03 +0300
Subject: [PATCH] changed alignment props to anchorOrigin and fixed
 api-report.md
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Signed-off-by: Mehmet Mallı <mehmet.malli@trendyol.com>
---
 .changeset/lovely-houses-argue.md                     |  2 +-
 packages/core-components/api-report.md                | 11 ++++++++---
 .../src/components/AlertDisplay/AlertDisplay.tsx      | 11 +++++++----
 .../src/components/AlertDisplay/index.ts              |  2 +-
 4 files changed, 17 insertions(+), 9 deletions(-)

diff --git a/.changeset/lovely-houses-argue.md b/.changeset/lovely-houses-argue.md
index ab105970a2..cfd902a958 100644
--- a/.changeset/lovely-houses-argue.md
+++ b/.changeset/lovely-houses-argue.md
@@ -2,4 +2,4 @@
 '@backstage/core-components': patch
 ---
 
-Added optional vertical and horizontal alignment props to AlertDisplay
+Added optional anchorOrigin alignment prop to AlertDisplay
diff --git a/packages/core-components/api-report.md b/packages/core-components/api-report.md
index a54219af56..a195d62496 100644
--- a/packages/core-components/api-report.md
+++ b/packages/core-components/api-report.md
@@ -51,12 +51,17 @@ import { Theme } from '@material-ui/core/styles';
 import { TooltipProps } from '@material-ui/core/Tooltip';
 import { WithStyles } from '@material-ui/core/styles';
 
-// Warning: (ae-forgotten-export) The symbol "AlertDisplayProps" needs to be exported by the entry point index.d.ts
-// Warning: (ae-missing-release-tag) "AlertDisplay" is exported by the package, but it is missing a release tag (@alpha, @beta, @public, or @internal)
-//
 // @public (undocumented)
 export function AlertDisplay(props: AlertDisplayProps): JSX.Element | null;
 
+// @public
+export type AlertDisplayProps = {
+  anchorOrigin?: {
+    vertical: 'top' | 'bottom';
+    horizontal: 'left' | 'center' | 'right';
+  };
+};
+
 // @public
 enum Alignment {
   DOWN_LEFT = 'DL',
diff --git a/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx b/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
index a2a809bae6..3af261da23 100644
--- a/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
+++ b/packages/core-components/src/components/AlertDisplay/AlertDisplay.tsx
@@ -34,15 +34,18 @@ import pluralize from 'pluralize';
 // TODO: improve on this and promote to a shared component for use by all apps.
 
 export type AlertDisplayProps = {
-  vertical?: 'top' | 'bottom';
-  horizontal?: 'left' | 'center' | 'right';
+  anchorOrigin?: {
+    vertical: 'top' | 'bottom';
+    horizontal: 'left' | 'center' | 'right';
+  };
 };
 
+/** @public */
 export function AlertDisplay(props: AlertDisplayProps) {
   const [messages, setMessages] = useState<Array<AlertMessage>>([]);
   const alertApi = useApi(alertApiRef);
 
-  const { vertical = 'top', horizontal = 'center' } = props;
+  const { anchorOrigin = { vertical: 'top', horizontal: 'center' } } = props;
 
   useEffect(() => {
     const subscription = alertApi
@@ -65,7 +68,7 @@ export function AlertDisplay(props: AlertDisplayProps) {
   };
 
   return (
-    <Snackbar open anchorOrigin={{ vertical, horizontal }}>
+    <Snackbar open anchorOrigin={anchorOrigin}>
       <Alert
         action={
           <IconButton
diff --git a/packages/core-components/src/components/AlertDisplay/index.ts b/packages/core-components/src/components/AlertDisplay/index.ts
index 34b2dfaabf..ad15130374 100644
--- a/packages/core-components/src/components/AlertDisplay/index.ts
+++ b/packages/core-components/src/components/AlertDisplay/index.ts
@@ -14,4 +14,4 @@
  * limitations under the License.
  */
 
-export { AlertDisplay } from './AlertDisplay';
+export * from './AlertDisplay';