jpuri · jpuri · 6 hours ago · 12 days ago
diff --git a/docs/src/components/Docs/index.js b/docs/src/components/Docs/index.js
@@ -319,6 +319,7 @@ export default class Demo2 extends Component {
               &nbsp;&nbsp;&nbsp;&nbsp;uploadEnabled: true,<br />
               &nbsp;&nbsp;&nbsp;&nbsp;alignmentEnabled: false,<br />
               &nbsp;&nbsp;&nbsp;&nbsp;uploadCallback: undefined,<br />
+              &nbsp;&nbsp;&nbsp;&nbsp;defaultSize: {"{ height: 'auto',  width: '100%' }"}, <br />
               &nbsp;&nbsp;{'}'}, <br />
               &nbsp;&nbsp;remove: {'{ icon: eraser, className: undefined }'}, <br />
               &nbsp;&nbsp;history: {'{'} <br />
@@ -353,6 +354,9 @@ export default class Demo2 extends Component {
         </div>
         <div className="docs-section">
           <div className="docs-label">
+            Image
+          </div>
+          <div className="docs-sub-label">
             Uploading Image
           </div>
           <div className="docs-desc">
@@ -374,6 +378,12 @@ export default class Demo2 extends Component {
           <div className="docs-desc top-margined">
             PLEASE NOTE: Property uploadCallback of editor component has been deprecated and will be removed in release 2.0. Its  now recommended to pass uploadCallback inside toolbar property.
           </div>
+          <div className="docs-sub-label">
+            Set DefaultSize for images
+          </div>
+          <div className="docs-desc">
+            Override default image size (height : auto, width : 100%).
+          </div>
         </div>
         <div className="docs-section">
           <div className="docs-label">
diff --git a/docs/static/main.css b/docs/static/main.css
@@ -1117,10 +1117,11 @@ textarea {
   background: #ece9e9;
 }
 .rdw-embedded-modal-size {
+  align-items: center;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
-  margin: 5px 0 10px;
+  margin: 8px 0 ;
   -webkit-box-pack: justify;
       -ms-flex-pack: justify;
           justify-content: space-between;
diff --git a/js/src/components/Controls/Embedded/styles.css b/js/src/components/Controls/Embedded/styles.css
@@ -82,8 +82,9 @@
   background: #ece9e9;
 }
 .rdw-embedded-modal-size {
+  align-items: center;
   display: flex;
-  margin: 5px 0 10px;
+  margin: 8px 0;
   justify-content: space-between;
 }
 .rdw-embedded-modal-size-input {
diff --git a/js/src/components/Controls/Image/index.js b/js/src/components/Controls/Image/index.js
@@ -7,6 +7,8 @@ import Option from '../../Option';
 import Spinner from '../../Spinner';
 import styles from './styles.css'; // eslint-disable-line no-unused-vars
 
+const lengthRegex = new RegExp(/^auto$|^[+-]?[0-9]+\.?([0-9]+)?(px|em|ex|%|in|cm|mm|pt|pc)?$/);
+
 export default class ImageControl extends Component {
 
   static propTypes: Object = {
@@ -16,14 +18,15 @@ export default class ImageControl extends Component {
     config: PropTypes.object,
   };
 
+
   state: Object = {
     imgSrc: '',
     showModal: false,
     dragEnter: false,
     uploadHighlighted: this.props.config.uploadEnabled && !!this.props.config.uploadCallback,
     showImageLoading: false,
-    height: 'auto',
-    width: '100%',
+    height: lengthRegex.test(this.props.config.defaultSize.height) ? this.props.config.defaultSize.height : 'auto',
+    width: lengthRegex.test(this.props.config.defaultSize.width) ? this.props.config.defaultSize.width : '100%',
   };
 
   componentWillMount(): void {
@@ -261,6 +264,7 @@ export default class ImageControl extends Component {
               </div>
         }
         <div className="rdw-embedded-modal-size">
+          &#8597;&nbsp;
           <input
             ref={this.setHeightInputReference}
             onChange={this.updateHeight}
@@ -269,6 +273,7 @@ export default class ImageControl extends Component {
             className="rdw-embedded-modal-size-input"
             placeholder="Height"
           />
+          &nbsp;&#8596;&nbsp;
           <input
             ref={this.setWidthInputReference}
             onChange={this.updateWidth}
diff --git a/js/src/config/defaultToolbar.js b/js/src/config/defaultToolbar.js
@@ -124,6 +124,10 @@ export default {
     uploadEnabled: true,
     alignmentEnabled: true,
     uploadCallback: undefined,
+    defaultSize: {
+      height: 'auto',
+      width: '100%',
+    },
   },
   remove: { icon: eraser, className: undefined },
   history: {