From 6de51abcc0a711bdff6155cddc574c962d939e59 Mon Sep 17 00:00:00 2001
From: Alireza <alireza.mirian@gmail.com>
Date: Fri, 25 Oct 2024 23:05:38 +0200
Subject: [PATCH] website: fix a build error

---
 packages/example-app/package.json               |  3 ++-
 packages/example-app/src/ProjectInitializer.tsx |  2 +-
 packages/jui/src/Popup/Popup.tsx                | 15 +++------------
 packages/jui/src/Popup/StyledPopupContainer.tsx | 12 ++++++++++++
 packages/jui/src/Toolbar/Toolbar.tsx            |  2 +-
 5 files changed, 19 insertions(+), 15 deletions(-)
 create mode 100644 packages/jui/src/Popup/StyledPopupContainer.tsx

diff --git a/packages/example-app/package.json b/packages/example-app/package.json
index f3af5f57..e7a01ec4 100644
--- a/packages/example-app/package.json
+++ b/packages/example-app/package.json
@@ -17,7 +17,8 @@
     "@intellij-platform/core/utils/array-utils": "@intellij-platform/core/src/utils/array-utils",
     "@intellij-platform/core/utils/useEventCallback": "@intellij-platform/core/src/utils/useEventCallback",
     "@intellij-platform/core/StyledSeparator": "@intellij-platform/core/src/StyledSeparator",
-    "@intellij-platform/core/List/StyledListItem": "@intellij-platform/core/src/List/StyledListItem"
+    "@intellij-platform/core/List/StyledListItem": "@intellij-platform/core/src/List/StyledListItem",
+    "@intellij-platform/core/Popup/StyledPopupContainer": "@intellij-platform/core/src/Popup/StyledPopupContainer"
   },
   "dependencies": {
     "@intellij-platform/core": "workspace:^",
diff --git a/packages/example-app/src/ProjectInitializer.tsx b/packages/example-app/src/ProjectInitializer.tsx
index 084c11ca..fd599fb7 100644
--- a/packages/example-app/src/ProjectInitializer.tsx
+++ b/packages/example-app/src/ProjectInitializer.tsx
@@ -12,7 +12,7 @@ import {
   ProgressBar,
   styled,
 } from "@intellij-platform/core";
-import { StyledPopupContainer } from "@intellij-platform/core/Popup/Popup";
+import { StyledPopupContainer } from "@intellij-platform/core/Popup/StyledPopupContainer";
 
 const defaultWorkspaceFiles = {
   ".idea/vcs.xml": `<?xml version="1.0" encoding="UTF-8"?>
diff --git a/packages/jui/src/Popup/Popup.tsx b/packages/jui/src/Popup/Popup.tsx
index 5ccb5f45..71593073 100644
--- a/packages/jui/src/Popup/Popup.tsx
+++ b/packages/jui/src/Popup/Popup.tsx
@@ -7,7 +7,9 @@ import { filterDOMProps, useObjectRef } from "@react-aria/utils";
 import { pipe } from "ramda";
 
 import {
+  areInNestedOverlays,
   ensureInViewport,
+  Overlay,
   OverlayInteractionHandler,
   OverlayResizeHandles,
   position,
@@ -15,8 +17,6 @@ import {
   useResizableMovableOverlay,
 } from "@intellij-platform/core/Overlay";
 import { styled } from "@intellij-platform/core/styled";
-import { WINDOW_SHADOW } from "@intellij-platform/core/style-constants";
-import { areInNestedOverlays, Overlay } from "@intellij-platform/core/Overlay";
 import { mergeNonNullProps } from "@intellij-platform/core/utils/mergeNonNullProps";
 import { useFocusForwarder } from "@intellij-platform/core/utils/useFocusForwarder";
 
@@ -25,16 +25,7 @@ import { PopupHeader } from "./PopupHeader";
 import { PopupContext, PopupControllerContext } from "./PopupContext";
 import { PopupLayout } from "./PopupLayout";
 import { StyledPopupHint } from "./StyledPopupHint";
-
-export const StyledPopupContainer = styled.div`
-  position: fixed;
-  box-sizing: border-box;
-  // not checked if there should be a better substitute for * in the following colors. Maybe "Component"?
-  background-color: ${({ theme }) => theme.color("*.background")};
-  color: ${({ theme }) => theme.color("*.foreground")};
-  outline: none; // Focus will be reflected in header. No need for outline or any other focus style on the container
-  ${WINDOW_SHADOW}; // FIXME: OS-dependant style?
-`;
+import { StyledPopupContainer } from "@intellij-platform/core/Popup/StyledPopupContainer";
 
 /**
  * only needed for setting overflow to hidden to make sure nothing will overflow a window under any circumstances.
diff --git a/packages/jui/src/Popup/StyledPopupContainer.tsx b/packages/jui/src/Popup/StyledPopupContainer.tsx
new file mode 100644
index 00000000..6c54b980
--- /dev/null
+++ b/packages/jui/src/Popup/StyledPopupContainer.tsx
@@ -0,0 +1,12 @@
+import { WINDOW_SHADOW } from "@intellij-platform/core/style-constants";
+import { styled } from "@intellij-platform/core/styled";
+
+export const StyledPopupContainer = styled.div`
+  position: fixed;
+  box-sizing: border-box;
+  // not checked if there should be a better substitute for * in the following colors. Maybe "Component"?
+  background-color: ${({ theme }) => theme.color("*.background")};
+  color: ${({ theme }) => theme.color("*.foreground")};
+  outline: none; // Focus will be reflected in header. No need for outline or any other focus style on the container
+  ${WINDOW_SHADOW}; // FIXME: OS-dependant style?
+`;
diff --git a/packages/jui/src/Toolbar/Toolbar.tsx b/packages/jui/src/Toolbar/Toolbar.tsx
index 97ee6813..98963a81 100644
--- a/packages/jui/src/Toolbar/Toolbar.tsx
+++ b/packages/jui/src/Toolbar/Toolbar.tsx
@@ -16,8 +16,8 @@ import {
 import { useOverflowObserver } from "@intellij-platform/core/utils/overflow-utils/useOverflowObserver";
 import { PlatformIcon } from "@intellij-platform/core/Icon";
 import { Overlay, useOverlayPosition } from "@react-aria/overlays";
-import { StyledPopupContainer } from "@intellij-platform/core/Popup/Popup";
 import { mergeProps } from "@react-aria/utils";
+import { StyledPopupContainer } from "@intellij-platform/core/Popup/StyledPopupContainer";
 
 type ToolbarBorderProp =
   | true