Fix compass-crud to adopt LG modal v20

Author: kraenhansen

packages/compass-crud/src/components/bulk-delete-modal.tsx

@@ -94,12 +94,7 @@ const BulkDeleteModal: React.FunctionComponent<BulkDeleteModalProps> = ({
 
   const exportButtonId = useId();
   return (
-    <Modal
-      initialFocus={`#${exportButtonId}`}
-      setOpen={onCancel}
-      open={open}
-      data-testid="bulk-delete-modal"
-    >
+    <Modal setOpen={onCancel} open={open} data-testid="bulk-delete-modal">
       <ModalHeader
         title={`Delete ${documentCount ?? ''} document${
           documentCount === 1 ? '' : 's'
@@ -118,6 +113,7 @@ const BulkDeleteModal: React.FunctionComponent<BulkDeleteModalProps> = ({
             onClick={onExportToLanguage}
             data-testid="export-button"
             id={exportButtonId}
+            autoFocus
           >
             Export
           </Button>

packages/compass-crud/src/components/bulk-update-modal.tsx

@@ -405,8 +405,7 @@ export default function BulkUpdateModal({
       open={isOpen}
       setOpen={closeBulkUpdateModal}
       data-testid="bulk-update-modal"
-      contentClassName={enablePreview ? modalContentStyles : undefined}
-      initialFocus={`#${bulkUpdateUpdateId} .cm-content`}
+      className={enablePreview ? modalContentStyles : undefined}
     >
       <ModalHeader title={modalTitleAndButtonText} subtitle={ns} />
       <ModalBody>
@@ -441,6 +440,7 @@ export default function BulkUpdateModal({
                   onBlur={() => ({})}
                   annotations={annotations}
                   minLines={12}
+                  autoFocus
                 />
 
                 <div className={bannerContainerStyles}>