refactor(component): className instead of _className (#438)

* refactor(component): className instead of _className

* docs(readme): missing className

* fix(component): default to _className for backwards compat

* fix(component): missing ===

README.md

@@ -620,6 +620,8 @@ import Form from 'mson/lib/form';
 import { TextField, Email } from 'mson/lib/fields';
 
 class MyAccount extends Form {
+  className = 'MyAccount';
+
   create(props) {
     super.create(props);
     this.set({

src/compiler/compiler.test.js

@@ -586,7 +586,7 @@ it('should define className for all core components', () => {
       component: name,
     });
 
-    expect(c._className).toEqual(name);
+    expect(c.getClassName()).toEqual(name);
   });
 });
 

src/compiler/prop-filler.js

@@ -109,7 +109,7 @@ export default class PropFiller {
       let performDefaultClone = false;
       let clonedObject = undefined;
 
-      if (item && item._className) {
+      if (item && (item._className || item.className)) {
         // The item is a component, therefore we should not clone it. TODO: is there a better way to
         // determine this?
         clonedObject = item;

src/component/base-component.js

@@ -20,7 +20,7 @@ const getNextKey = () => {
 // - We attempted to require all access to all props via get() and set(), but this can cause
 //   infinite recursion, e.g. when a get() calls itself either directly or via some inherited logic.
 export default class BaseComponent extends events.EventEmitter {
-  _className = 'Component';
+  className = 'Component';
 
   _getBaseComponentSchema() {
     return {
@@ -692,7 +692,9 @@ export default class BaseComponent extends events.EventEmitter {
     //   return this.constructor.name;
     // }
     //
-    return this._className;
+    // _className has been deprecated, use className instead.
+    //
+    return this._className === undefined ? this.className : this._className;
   }
 
   getParentClassName() {