2 files changed, 53 insertions, 1 deletions
diff --git a/src/webpack/common/components.ts b/src/webpack/common/components.ts
index 9554f95..97816bf 100644
--- a/src/webpack/common/components.ts
+++ b/src/webpack/common/components.ts
@@ -40,6 +40,8 @@ export let Select: t.Select;
 export let SearchableSelect: t.SearchableSelect;
 export let Slider: t.Slider;
 export let ButtonLooks: t.ButtonLooks;
+export let Popout: t.Popout;
+export let Dialog: t.Dialog;
 export let TabBar: any;
 
 export const Timestamp = waitForComponent<t.Timestamp>("Timestamp", filters.byCode(".Messages.MESSAGE_EDITED_TIMESTAMP_A11Y_LABEL.format"));
@@ -48,6 +50,6 @@ export const Flex = waitForComponent<t.Flex>("Flex", ["Justify", "Align", "Wrap"
 export const ButtonWrapperClasses = findByPropsLazy("buttonWrapper", "buttonContent") as Record<string, string>;
 
 waitFor("FormItem", m => {
-    ({ Card, Button, FormSwitch: Switch, Tooltip, TextInput, TextArea, Text, Select, SearchableSelect, Slider, ButtonLooks, TabBar } = m);
+    ({ Card, Button, FormSwitch: Switch, Tooltip, TextInput, TextArea, Text, Select, SearchableSelect, Slider, ButtonLooks, TabBar, Popout, Dialog } = m);
     Forms = m;
 });
diff --git a/src/webpack/common/types/components.d.ts b/src/webpack/common/types/components.d.ts
index 7b02ed3..835de79 100644
--- a/src/webpack/common/types/components.d.ts
+++ b/src/webpack/common/types/components.d.ts
@@ -325,3 +325,53 @@ export type Flex = ComponentType<PropsWithChildren<any>> & {
     Justify: Record<"START" | "END" | "CENTER" | "BETWEEN" | "AROUND", string>;
     Wrap: Record<"NO_WRAP" | "WRAP" | "WRAP_REVERSE", string>;
 };
+
+declare enum PopoutAnimation {
+    NONE = "1",
+    TRANSLATE = "2",
+    SCALE = "3",
+    FADE = "4"
+}
+
+export type Popout = ComponentType<{
+    children(
+        thing: {
+            "aria-controls": string;
+            "aria-expanded": boolean;
+            onClick(event: MouseEvent): void;
+            onKeyDown(event: KeyboardEvent): void;
+            onMouseDown(event: MouseEvent): void;
+        },
+        data: {
+            isShown: boolean;
+            position: string;
+        }
+    ): ReactNode;
+    shouldShow: boolean;
+    renderPopout(args: {
+        closePopout(): void;
+        isPositioned: boolean;
+        nudge: number;
+        position: string;
+        setPopoutRef(ref: any): void;
+        updatePosition(): void;
+    }): ReactNode;
+
+    onRequestOpen?(): void;
+    onRequestClose?(): void;
+
+    /** "center" and others */
+    align?: string;
+    /** Popout.Animation */
+    animation?: PopoutAnimation;
+    autoInvert?: boolean;
+    nudgeAlignIntoViewport?: boolean;
+    /** "bottom" and others */
+    position?: string;
+    positionKey?: string;
+    spacing?: number;
+}> & {
+    Animation: typeof PopoutAnimation;
+};
+
+export type Dialog = ComponentType<PropsWithChildren<any>>;