switch default to true

CHANGELOG.md

@@ -1,5 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
+- Added `maxWidth` prop to `EuiModal` ([#1165](https://github.com/elastic/eui/pull/1165))
 - Added `infraApp` icon ([#1161](https://github.com/elastic/eui/pull/1161))
 - Added sizes to `EuiButtonIcon` ([#1145](https://github.com/elastic/eui/pull/1145))
 - Added `singleSelection.asPlainText` prop to `EuiComboBox` ([#1139](https://github.com/elastic/eui/pull/1139))

src-docs/src/views/modal/modal.js

@@ -87,7 +87,7 @@ export class Modal extends Component {
         <EuiOverlayMask>
           <EuiModal
             onClose={this.closeModal}
-            style={{ width: '800px' }}
+            style={{ width: '400px' }}
           >
             <EuiModalHeader>
               <EuiModalHeaderTitle >

src-docs/src/views/modal/modal_example.js

@@ -72,7 +72,7 @@ export const ModalExample = {
     }],
     text: (
       <p>
-          This demo is to test long overflowing body content. It also demonstrates the <EuiCode>maxWidth</EuiCode> property.
+          This demo is to test long overflowing body content.
       </p>
     ),
     props: { EuiConfirmModal },

src-docs/src/views/modal/overflow_test.js

@@ -50,7 +50,6 @@ export class OverflowTest extends Component {
         <EuiOverlayMask>
           <EuiModal
             onClose={this.closeModal}
-            maxWidth
           >
             <EuiModalHeader>
               <EuiModalHeaderTitle >

src/components/modal/__snapshots__/confirm_modal.test.js.snap

@@ -4,7 +4,7 @@ exports[`renders EuiConfirmModal 1`] = `
 <div>
   <div
     aria-label="aria-label"
-    class="euiModal euiModal--confirmation testClass1 testClass2"
+    class="euiModal euiModal--maxWidth-default euiModal--confirmation testClass1 testClass2"
     data-test-subj="test subject string"
     tabindex="0"
   >

src/components/modal/__snapshots__/modal.test.js.snap

@@ -4,7 +4,7 @@ exports[`renders EuiModal 1`] = `
 <div>
   <div
     aria-label="aria-label"
-    class="euiModal testClass1 testClass2"
+    class="euiModal euiModal--maxWidth-default testClass1 testClass2"
     data-test-subj="test subject string"
     tabindex="0"
   >

src/components/modal/modal.js

@@ -79,8 +79,8 @@ EuiModal.propTypes = {
   onClose: PropTypes.func.isRequired,
   /**
    * Sets the max-width of the modal.
-   * Set to `false` to not restrict the width,
-   * set to `true` to use the default (`euiBreakpoints 'm'`),
+   * Set to `true` to use the default (`euiBreakpoints 'm'`),
+   * set to `false` to not restrict the width,
    * set to a number for a custom width in px,
    * set to a string for a custom width in custom measurement.
    */
@@ -92,5 +92,5 @@ EuiModal.propTypes = {
 };
 
 EuiModal.defaultProps = {
-  maxWidth: false,
+  maxWidth: true,
 };