Adjust classname

Author: rebeccaalpert

packages/module/src/ChatbotModal/ChatbotModal.scss

@@ -89,7 +89,10 @@
   position: absolute;
 }
 
-.pf-chatbot__chatbot-modal-compact {
+// ============================================================================
+// Compact
+// ============================================================================
+.pf-chatbot__chatbot-modal.pf-m-compact {
   .pf-v6-c-modal-box__header {
     padding-block-end: 0;
   }

packages/module/src/ChatbotModal/ChatbotModal.test.tsx

@@ -54,6 +54,6 @@ describe('ChatbotModal', () => {
         </ModalBody>
       </ChatbotModal>
     );
-    expect(screen.getByTestId('modal')).toHaveClass('pf-chatbot__chatbot-modal-compact');
+    expect(screen.getByTestId('modal')).toHaveClass('pf-m-compact');
   });
 });

packages/module/src/ChatbotModal/ChatbotModal.tsx

@@ -30,7 +30,7 @@ export const ChatbotModal: React.FunctionComponent<ChatbotModalProps> = ({
       ouiaId="ChatbotModal"
       aria-labelledby="chatbot-modal-title"
       aria-describedby="chatbot-modal"
-      className={`pf-chatbot__chatbot-modal pf-chatbot__chatbot-modal--${displayMode} ${isCompact ? 'pf-chatbot__chatbot-modal-compact' : ''} ${className}`}
+      className={`pf-chatbot__chatbot-modal pf-chatbot__chatbot-modal--${displayMode} ${isCompact ? 'pf-m-compact' : ''} ${className}`}
       backdropClassName="pf-chatbot__chatbot-modal-backdrop"
       {...props}
     >

packages/module/src/CodeModal/CodeModal.scss

@@ -88,7 +88,7 @@
   height: inherit !important; // override shared modal so code editor works in full screen
 }
 
-.pf-chatbot__code-modal.pf-chatbot__code-modal-compact {
+.pf-chatbot__code-modal.pf-m-compact {
   .pf-chatbot__code-modal-body {
     gap: var(--pf-t--global--spacer--md);
   }

packages/module/src/CodeModal/CodeModal.test.tsx

@@ -19,6 +19,6 @@ describe('ChatbotModal', () => {
         secondaryActionBtn="Cancel"
       ></CodeModal>
     );
-    expect(screen.getByRole('dialog')).toHaveClass('pf-chatbot__chatbot-modal-compact');
+    expect(screen.getByRole('dialog')).toHaveClass('pf-m-compact');
   });
 });

packages/module/src/CodeModal/CodeModal.tsx

@@ -97,7 +97,7 @@ export const CodeModal: React.FunctionComponent<CodeModalProps> = ({
       ouiaId="CodeModal"
       aria-labelledby="code-modal-title"
       aria-describedby="code-modal"
-      className={`pf-chatbot__code-modal ${isCompact ? 'pf-chatbot__code-modal-compact' : ''} pf-chatbot__code-modal--${displayMode}`}
+      className={`pf-chatbot__code-modal ${isCompact ? 'pf-m-compact' : ''} pf-chatbot__code-modal--${displayMode}`}
       displayMode={displayMode}
       isCompact={isCompact}
     >