fix: radio-dialog conformance

microsoft · Dec 7, 2021 · 356d301 · 356d301
1 parent da2d61c
commit 356d301
Show file tree

Hide file tree

Showing 3 changed files with 15 additions and 2 deletions.
diff --git a/packages/react-dialog/src/components/Dialog/Dialog.tsx b/packages/react-dialog/src/components/Dialog/Dialog.tsx
@@ -6,7 +6,7 @@ import type { DialogProps } from './Dialog.types';
 import type { ForwardRefComponent } from '@fluentui/react-utilities';
 
 /**
- * Dialog component
+ * A Dialog is an elevated Card triggered by a user’s action.
  */
 export const Dialog: ForwardRefComponent<DialogProps> = React.forwardRef((props, ref) => {
   const state = useDialog(props, ref);

diff --git a/packages/react-dialog/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap b/packages/react-dialog/src/components/Dialog/__snapshots__/Dialog.test.tsx.snap
@@ -0,0 +1,11 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`Dialog renders a default state 1`] = `
+<div>
+  <div
+    class="fui-Dialog"
+  >
+    Default Dialog
+  </div>
+</div>
+`;
diff --git a/packages/react-dialog/src/components/Dialog/useDialogStyles.ts b/packages/react-dialog/src/components/Dialog/useDialogStyles.ts
@@ -1,6 +1,8 @@
 import { makeStyles, mergeClasses } from '@fluentui/react-make-styles';
 import type { DialogState } from './Dialog.types';
 
+export const dialogClassName = 'fui-Dialog';
+
 /**
  * Styles for the root slot
  */
@@ -17,7 +19,7 @@ const useStyles = makeStyles({
  */
 export const useDialogStyles = (state: DialogState): DialogState => {
   const styles = useStyles();
-  state.root.className = mergeClasses(styles.root, state.root.className);
+  state.root.className = mergeClasses(dialogClassName, styles.root, state.root.className);
 
   // TODO Add class names to slots, for example:
   // state.mySlot.className = mergeClasses(styles.mySlot, state.mySlot.className);