diff --git a/src/deck-components/Button.tsx b/src/deck-components/Button.tsx
index 11cf75e..9fee9c6 100644
--- a/src/deck-components/Button.tsx
+++ b/src/deck-components/Button.tsx
@@ -1,22 +1,8 @@
-import { CSSProperties, FC, RefAttributes } from 'react';
+import { FC } from 'react';
+import { DialogButton, DialogButtonProps } from "./Dialog";
 
-import { CommonUIModule } from '../webpack';
-import { FooterLegendProps } from './FooterLegend';
-
-export interface DialogButtonProps extends RefAttributes<HTMLDivElement>, FooterLegendProps {
-  label?: string;
-  style?: CSSProperties;
-  className?: string;
-  noFocusRing?: boolean;
-  description?: string;
-  layout?: 'below';
-  onClick?(e: MouseEvent): void;
-  disabled?: boolean;
-  bottomSeparator?: boolean;
+export interface ButtonProps extends DialogButtonProps {
 }
 
-export const DialogButton = Object.values(CommonUIModule).find(
-  (mod: any) =>
-    mod?.render?.toString()?.includes('Object.assign({type:"button"') &&
-    mod?.render?.toString()?.includes('DialogButton'),
-) as FC<DialogButtonProps>;
\ No newline at end of file
+// Button isn't exported, so call DialogButton to grab it
+export const Button = (DialogButton as any)?.render({}).type as FC<ButtonProps>;
diff --git a/src/deck-components/Dialog.tsx b/src/deck-components/Dialog.tsx
new file mode 100644
index 0000000..87d4edb
--- /dev/null
+++ b/src/deck-components/Dialog.tsx
@@ -0,0 +1,63 @@
+import { CommonUIModule } from "../webpack";
+import { CSSProperties, FC, RefAttributes } from "react";
+import { FooterLegendProps } from './FooterLegend';
+
+export interface DialogCommonProps extends RefAttributes<HTMLDivElement> {
+  style?: CSSProperties;
+  className?: string;
+}
+
+export interface DialogButtonProps extends DialogCommonProps, FooterLegendProps {
+  noFocusRing?: boolean;
+  disabled?: boolean;
+  onClick?(e: MouseEvent): void;
+  onPointerDown?(e: PointerEvent): void;
+  onPointerUp?(e: PointerEvent): void;
+  onPointerCancel?(e: PointerEvent): void;
+  onMouseDown?(e: MouseEvent): void;
+  onMouseUp?(e: MouseEvent): void;
+  onTouchStart?(e: TouchEvent): void;
+  onTouchEnd?(e: TouchEvent): void;
+  onTouchCancel?(e: TouchEvent): void;
+  onSubmit?(e: SubmitEvent): void;
+}
+
+const CommonDialogDivs = Object.values(CommonUIModule).filter((m: any) => typeof m === "object" && m?.render?.toString().includes('"div",Object.assign({},'));
+const MappedDialogDivs = new Map(Object.values(CommonDialogDivs).map((m: any) => {
+  const renderedDiv = m.render({});
+  // Take only the first class name segment as it identifies the element we want
+  return [renderedDiv.props.className.split(" ")[0], m]
+}));
+
+export const DialogHeader = MappedDialogDivs.get("DialogHeader") as FC<DialogCommonProps>;
+export const DialogSubHeader = MappedDialogDivs.get("DialogSubHeader") as FC<DialogCommonProps>;
+export const DialogFooter = MappedDialogDivs.get("DialogFooter") as FC<DialogCommonProps>;
+export const DialogLabel = MappedDialogDivs.get("DialogLabel") as FC<DialogCommonProps>;
+export const DialogBodyText = MappedDialogDivs.get("DialogBodyText") as FC<DialogCommonProps>;
+export const DialogBody = MappedDialogDivs.get("DialogBody") as FC<DialogCommonProps>;
+export const DialogControlsSection = MappedDialogDivs.get("DialogControlsSection") as FC<DialogCommonProps>;
+export const DialogControlsSectionHeader = MappedDialogDivs.get("DialogControlsSectionHeader") as FC<DialogCommonProps>;
+
+export const DialogButtonPrimary = Object.values(CommonUIModule).find(
+  (mod: any) =>
+    mod?.render?.toString()?.includes('DialogButton') &&
+    mod?.render?.toString()?.includes('Primary')
+) as FC<DialogButtonProps>;
+
+export const DialogButtonSecondary = Object.values(CommonUIModule).find(
+  (mod: any) =>
+    mod?.render?.toString()?.includes('Object.assign({type:"button"') &&
+    mod?.render?.toString()?.includes('DialogButton') &&
+    mod?.render?.toString()?.includes('Secondary')
+) as FC<DialogButtonProps>;
+
+export const DialogButtonSmall = Object.values(CommonUIModule).find(
+  (mod: any) =>
+    mod?.render?.toString()?.includes('Object.assign({type:"button"') &&
+    mod?.render?.toString()?.includes('DialogButton') &&
+    mod?.render?.toString()?.includes('Small')
+) as FC<DialogButtonProps>;
+
+// This is the "main" button. The Primary can act as a submit button, 
+// therefore secondary is chosen (also for backwards comp. reasons)
+export const DialogButton = DialogButtonSecondary;
diff --git a/src/deck-components/index.ts b/src/deck-components/index.ts
index 2eb94af..c44446d 100755
--- a/src/deck-components/index.ts
+++ b/src/deck-components/index.ts
@@ -1,6 +1,7 @@
 export * from './Button';
 export * from './ButtonItem';
 export * from './Carousel';
+export * from './Dialog';
 export * from './Dropdown';
 export * from './Field';
 export * from './Focusable';