@cfpb/cfpb-atomic-component - npm Package Compare versions

Comparing version 0.4.0 to 0.5.0

package.json

 {
   "name": "@cfpb/cfpb-atomic-component",
-  "version": "0.4.0",
+  "version": "0.5.0",
   "description": "Design System atomic component micro-framework",
@@ -16,3 +16,3 @@ "less": "src/cfpb-atomic-component.less",
   ],
-  "gitHead": "17da0c08ea13edff76a9a5a60513cfa0096cc0ca"
+  "gitHead": "fccedbaea6195fc074d491c7c3a42b09f229a452"
 }

src/components/AtomicComponent.js

@@ -9,12 +9,11 @@ /* ==========================================================================
    - Backbone.js ( http://backbonejs.org/docs/backbone.html ).
-   - Marionette ( http://marionettejs.com/ ).
+   - Marionette ( http://marionettejs.com ).
 
    ========================================================================== */
 
-const assign = require( '../utilities/object-assign' ).assign;
+import { assign } from '../utilities/object-assign';
 const Delegate = require( 'ftdomdelegate' ).Delegate;
-const Events = require( '../mixins/Events' );
-const isFunction = require( '../utilities/type-checkers' ).isFunction;
+import EventObserver from '../mixins/EventObserver.js';
+import typeCheckers from '../utilities/type-checkers';
 
-
 /**
@@ -38,9 +37,11 @@ * Function as the constrcutor for the AtomicComponent.
   this.initializers.forEach( function( func ) {
-    if ( isFunction( func ) ) func.apply( this, arguments );
+    if ( typeCheckers.isFunction( func ) ) {
+      func.apply( this, arguments );
+    }
   }, this );
-  this.trigger( 'component:initialized' );
+  this.dispatchEvent( 'component:initialized' );
 }
 
 // Public instance Methods and properties.
-assign( AtomicComponent.prototype, Events, {
+assign( AtomicComponent.prototype, new EventObserver(), {
 
@@ -157,3 +158,3 @@ tagName: 'div',
     this.undelegateEvents();
-    this.trigger( 'component:destroyed' );
+    this.dispatchEvent( 'component:destroyed' );
 
@@ -194,3 +195,6 @@ return true;
     events = events || ( events = this.events );
-    if ( !events ) return this;
+    if ( !events ) {
+      return this;
+    }
+
     this.undelegateEvents();
@@ -201,3 +205,5 @@ this._delegate = new Delegate( this.element );
         method = events[key];
-        if ( isFunction( this[method] ) ) method = this[method];
+        if ( typeCheckers.isFunction( this[method] ) ) {
+          method = this[method];
+        }
         if ( method ) {
@@ -209,3 +215,3 @@ match = key.match( delegateEventSplitter );
     }
-    this.trigger( 'component:bound' );
+    this.dispatchEvent( 'component:bound' );
 
@@ -269,6 +275,5 @@ return this;
   /**
- * Function used as constructor in order to establish inheritance
- * chain.
- * @returns {AtomicComponent} An instance.
- */
+   * Function used as constructor in order to establish inheritance chain.
+   * @returns {AtomicComponent} An instance.
+   */
   function child() {
@@ -297,4 +302,4 @@ this._super = AtomicComponent.prototype;
  * atomic component on a page.
+ *
  * @param {HTMLNode} scope - Where to search for components within.
- *
  * @returns {Array} List of AtomicComponent instances.
@@ -306,4 +311,4 @@ */
   const components = [];
+
   let element;
-
   for ( let i = 0, len = elements.length; i < len; i++ ) {
@@ -319,2 +324,2 @@ element = elements[i];
 
-module.exports = AtomicComponent;
+export default AtomicComponent;

src/utilities/config.js

@@ -14,11 +14,2 @@ /* ==========================================================================
 
-// Atomic component types used for describing component hierarchy.
-const TYPES = {
-  PAGE:     1,
-  TEMPLATE: 2,
-  ORGANISM: 3,
-  MOLECULE: 4,
-  ATOM:     5
-};
-
 /*
@@ -48,8 +39,7 @@ Atomic Prefixes used for standardizing naming conventions
 
-module.exports = {
+export default {
   DIRECTIONS:     DIRECTIONS,
   NO_OP_FUNCTION: NO_OP_FUNCTION,
   PREFIXES:       PREFIXES,
-  TYPES:          TYPES,
   UNDEFINED:      UNDEFINED
 };

src/utilities/dom-closest/index.js

@@ -44,4 +44,4 @@ /* ==========================================================================
 // Expose public methods.
-module.exports = {
-  closest: closest
+export {
+  closest
 };

src/utilities/object-assign/index.js

@@ -51,2 +51,4 @@ /* ==========================================================================
 // Expose public methods.
-module.exports = { assign: assign };
+export {
+  assign
+};

src/utilities/transition/AlphaTransition.js

 // Required modules.
-const Events = require( '../../mixins/Events.js' );
-const BaseTransition = require( './BaseTransition' );
+import EventObserver from '../../mixins/EventObserver.js';
+import BaseTransition from './BaseTransition.js';
 
@@ -43,3 +43,3 @@ // Exported constants.
   function _transitionComplete() {
-    this.trigger( BaseTransition.END_EVENT, { target: this } );
+    this.dispatchEvent( BaseTransition.END_EVENT, { target: this } );
   }
@@ -68,5 +68,6 @@
   // Attach public events.
-  this.addEventListener = Events.addEventListener;
-  this.trigger = Events.trigger;
-  this.removeEventListener = Events.removeEventListener;
+  const eventObserver = new EventObserver();
+  this.addEventListener = eventObserver.addEventListener;
+  this.dispatchEvent = eventObserver.dispatchEvent;
+  this.removeEventListener = eventObserver.removeEventListener;
 
@@ -90,2 +91,2 @@ this.animateOff = _baseTransition.animateOff;
 
-module.exports = AlphaTransition;
+export default AlphaTransition;

src/utilities/transition/BaseTransition.js

 // Required modules.
-const Events = require( '../../mixins/Events.js' );
+import EventObserver from '../../mixins/EventObserver.js';
 
@@ -122,5 +122,5 @@ /* eslint-disable max-lines-per-function, max-statements */
       );
-      this.trigger( BaseTransition.BEGIN_EVENT, { target: this } );
+      this.dispatchEvent( BaseTransition.BEGIN_EVENT, { target: this } );
     } else {
-      this.trigger( BaseTransition.BEGIN_EVENT, { target: this } );
+      this.dispatchEvent( BaseTransition.BEGIN_EVENT, { target: this } );
       _transitionCompleteBinded();
@@ -142,3 +142,3 @@ }
     _removeEventListener();
-    this.trigger( BaseTransition.END_EVENT, { target: this } );
+    this.dispatchEvent( BaseTransition.END_EVENT, { target: this } );
     _isAnimating = false;
@@ -241,5 +241,6 @@ }
   // Attach public events.
-  this.addEventListener = Events.on;
-  this.trigger = Events.trigger;
-  this.removeEventListener = Events.off;
+  const eventObserver = new EventObserver();
+  this.addEventListener = eventObserver.addEventListener;
+  this.dispatchEvent = eventObserver.dispatchEvent;
+  this.removeEventListener = eventObserver.removeEventListener;
 
@@ -264,2 +265,2 @@ this.animateOff = animateOff;
 
-module.exports = BaseTransition;
+export default BaseTransition;

src/utilities/transition/MoveTransition.js

 // Required modules.
-const Events = require( '../../mixins/Events.js' );
-const BaseTransition = require( './BaseTransition' );
+import EventObserver from '../../mixins/EventObserver.js';
+import BaseTransition from './BaseTransition.js';
 
@@ -48,3 +48,3 @@ // Exported constants.
   function _transitionComplete() {
-    this.trigger( BaseTransition.END_EVENT, { target: this } );
+    this.dispatchEvent( BaseTransition.END_EVENT, { target: this } );
   }
@@ -106,5 +106,6 @@
   // Attach public events.
-  this.addEventListener = Events.on;
-  this.trigger = Events.trigger;
-  this.removeEventListener = Events.off;
+  const eventObserver = new EventObserver();
+  this.addEventListener = eventObserver.addEventListener;
+  this.dispatchEvent = eventObserver.dispatchEvent;
+  this.removeEventListener = eventObserver.removeEventListener;
 
@@ -131,2 +132,2 @@ this.animateOff = _baseTransition.animateOff;
 
-module.exports = MoveTransition;
+export default MoveTransition;

src/utilities/type-checkers/index.js

@@ -166,12 +166,12 @@ /* ==========================================================================
 // Expose public methods.
-module.exports = {
+export default {
   isUndefined: isUndefined,
-  isDefined:   isDefined,
-  isObject:    isObject,
-  isString:    isString,
-  isNumber:    isNumber,
-  isDate:      isDate,
-  isArray:     isArray,
-  isFunction:  isFunction,
-  isEmpty:     isEmpty
+  isDefined: isDefined,
+  isObject: isObject,
+  isString: isString,
+  isNumber: isNumber,
+  isDate: isDate,
+  isArray: isArray,
+  isFunction: isFunction,
+  isEmpty: isEmpty
 };

No alert changes

Improved metrics

Total package byte prevSize

54244

increased by2.09%

Lines of code

1165

increased by5.33%

Worsened metrics

Number of package files

25

decreased by-10.71%

No dependency changes