react 0.14.0-beta1 → 0.14.0

package/lib/SyntheticClipboardEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticEvent = require("./SyntheticEvent");
+var SyntheticEvent = require('./SyntheticEvent');
 
 /**
  * @interface Event

package/lib/SyntheticCompositionEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticEvent = require("./SyntheticEvent");
+var SyntheticEvent = require('./SyntheticEvent');
 
 /**
  * @interface Event

package/lib/SyntheticDragEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticMouseEvent = require("./SyntheticMouseEvent");
+var SyntheticMouseEvent = require('./SyntheticMouseEvent');
 
 /**
  * @interface DragEvent

package/lib/SyntheticEvent.js

@@ -12,17 +12,17 @@
 
 'use strict';
 
-var PooledClass = require("./PooledClass");
+var PooledClass = require('./PooledClass');
 
-var assign = require("./Object.assign");
-var emptyFunction = require("./emptyFunction");
+var assign = require('./Object.assign');
+var emptyFunction = require('fbjs/lib/emptyFunction');
+var warning = require('fbjs/lib/warning');
 
 /**
  * @interface Event
  * @see http://www.w3.org/TR/DOM-Level-3-Events/
  */
 var EventInterface = {
-  path: null,
   type: null,
   // currentTarget is set when dispatching; no use in copying it here
   currentTarget: emptyFunction.thatReturnsNull,
@@ -87,6 +87,13 @@ assign(SyntheticEvent.prototype, {
   preventDefault: function () {
     this.defaultPrevented = true;
     var event = this.nativeEvent;
+    if (process.env.NODE_ENV !== 'production') {
+      process.env.NODE_ENV !== 'production' ? warning(event, 'This synthetic event is reused for performance reasons. If you\'re ' + 'seeing this, you\'re calling `preventDefault` on a ' + 'released/nullified synthetic event. This is a no-op. See ' + 'https://fb.me/react-event-pooling for more information.') : undefined;
+    }
+    if (!event) {
+      return;
+    }
+
     if (event.preventDefault) {
       event.preventDefault();
     } else {
@@ -97,6 +104,13 @@ assign(SyntheticEvent.prototype, {
 
   stopPropagation: function () {
     var event = this.nativeEvent;
+    if (process.env.NODE_ENV !== 'production') {
+      process.env.NODE_ENV !== 'production' ? warning(event, 'This synthetic event is reused for performance reasons. If you\'re ' + 'seeing this, you\'re calling `stopPropagation` on a ' + 'released/nullified synthetic event. This is a no-op. See ' + 'https://fb.me/react-event-pooling for more information.') : undefined;
+    }
+    if (!event) {
+      return;
+    }
+
     if (event.stopPropagation) {
       event.stopPropagation();
     } else {

package/lib/SyntheticFocusEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticUIEvent = require("./SyntheticUIEvent");
+var SyntheticUIEvent = require('./SyntheticUIEvent');
 
 /**
  * @interface FocusEvent

package/lib/SyntheticInputEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticEvent = require("./SyntheticEvent");
+var SyntheticEvent = require('./SyntheticEvent');
 
 /**
  * @interface Event

package/lib/SyntheticKeyboardEvent.js

@@ -12,11 +12,11 @@
 
 'use strict';
 
-var SyntheticUIEvent = require("./SyntheticUIEvent");
+var SyntheticUIEvent = require('./SyntheticUIEvent');
 
-var getEventCharCode = require("./getEventCharCode");
-var getEventKey = require("./getEventKey");
-var getEventModifierState = require("./getEventModifierState");
+var getEventCharCode = require('./getEventCharCode');
+var getEventKey = require('./getEventKey');
+var getEventModifierState = require('./getEventModifierState');
 
 /**
  * @interface KeyboardEvent

package/lib/SyntheticMouseEvent.js

@@ -12,10 +12,10 @@
 
 'use strict';
 
-var SyntheticUIEvent = require("./SyntheticUIEvent");
-var ViewportMetrics = require("./ViewportMetrics");
+var SyntheticUIEvent = require('./SyntheticUIEvent');
+var ViewportMetrics = require('./ViewportMetrics');
 
-var getEventModifierState = require("./getEventModifierState");
+var getEventModifierState = require('./getEventModifierState');
 
 /**
  * @interface MouseEvent

package/lib/SyntheticTouchEvent.js

@@ -12,9 +12,9 @@
 
 'use strict';
 
-var SyntheticUIEvent = require("./SyntheticUIEvent");
+var SyntheticUIEvent = require('./SyntheticUIEvent');
 
-var getEventModifierState = require("./getEventModifierState");
+var getEventModifierState = require('./getEventModifierState');
 
 /**
  * @interface TouchEvent

package/lib/SyntheticUIEvent.js

@@ -12,9 +12,9 @@
 
 'use strict';
 
-var SyntheticEvent = require("./SyntheticEvent");
+var SyntheticEvent = require('./SyntheticEvent');
 
-var getEventTarget = require("./getEventTarget");
+var getEventTarget = require('./getEventTarget');
 
 /**
  * @interface UIEvent

package/lib/SyntheticWheelEvent.js

@@ -12,7 +12,7 @@
 
 'use strict';
 
-var SyntheticMouseEvent = require("./SyntheticMouseEvent");
+var SyntheticMouseEvent = require('./SyntheticMouseEvent');
 
 /**
  * @interface WheelEvent

package/lib/TapEventPlugin.js

@@ -0,0 +1,119 @@
+/**
+ * Copyright 2013-2015, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule TapEventPlugin
+ * @typechecks static-only
+ */
+
+'use strict';
+
+var EventConstants = require('./EventConstants');
+var EventPluginUtils = require('./EventPluginUtils');
+var EventPropagators = require('./EventPropagators');
+var SyntheticUIEvent = require('./SyntheticUIEvent');
+var TouchEventUtils = require('fbjs/lib/TouchEventUtils');
+var ViewportMetrics = require('./ViewportMetrics');
+
+var keyOf = require('fbjs/lib/keyOf');
+var topLevelTypes = EventConstants.topLevelTypes;
+
+var isStartish = EventPluginUtils.isStartish;
+var isEndish = EventPluginUtils.isEndish;
+
+/**
+ * Number of pixels that are tolerated in between a `touchStart` and `touchEnd`
+ * in order to still be considered a 'tap' event.
+ */
+var tapMoveThreshold = 10;
+var startCoords = { x: null, y: null };
+
+var Axis = {
+  x: { page: 'pageX', client: 'clientX', envScroll: 'currentPageScrollLeft' },
+  y: { page: 'pageY', client: 'clientY', envScroll: 'currentPageScrollTop' }
+};
+
+function getAxisCoordOfEvent(axis, nativeEvent) {
+  var singleTouch = TouchEventUtils.extractSingleTouch(nativeEvent);
+  if (singleTouch) {
+    return singleTouch[axis.page];
+  }
+  return axis.page in nativeEvent ? nativeEvent[axis.page] : nativeEvent[axis.client] + ViewportMetrics[axis.envScroll];
+}
+
+function getDistance(coords, nativeEvent) {
+  var pageX = getAxisCoordOfEvent(Axis.x, nativeEvent);
+  var pageY = getAxisCoordOfEvent(Axis.y, nativeEvent);
+  return Math.pow(Math.pow(pageX - coords.x, 2) + Math.pow(pageY - coords.y, 2), 0.5);
+}
+
+var touchEvents = [topLevelTypes.topTouchStart, topLevelTypes.topTouchCancel, topLevelTypes.topTouchEnd, topLevelTypes.topTouchMove];
+
+var dependencies = [topLevelTypes.topMouseDown, topLevelTypes.topMouseMove, topLevelTypes.topMouseUp].concat(touchEvents);
+
+var eventTypes = {
+  touchTap: {
+    phasedRegistrationNames: {
+      bubbled: keyOf({ onTouchTap: null }),
+      captured: keyOf({ onTouchTapCapture: null })
+    },
+    dependencies: dependencies
+  }
+};
+
+var usedTouch = false;
+var usedTouchTime = 0;
+var TOUCH_DELAY = 1000;
+
+var TapEventPlugin = {
+
+  tapMoveThreshold: tapMoveThreshold,
+
+  eventTypes: eventTypes,
+
+  /**
+   * @param {string} topLevelType Record from `EventConstants`.
+   * @param {DOMEventTarget} topLevelTarget The listening component root node.
+   * @param {string} topLevelTargetID ID of `topLevelTarget`.
+   * @param {object} nativeEvent Native browser event.
+   * @return {*} An accumulation of synthetic events.
+   * @see {EventPluginHub.extractEvents}
+   */
+  extractEvents: function (topLevelType, topLevelTarget, topLevelTargetID, nativeEvent, nativeEventTarget) {
+    if (!isStartish(topLevelType) && !isEndish(topLevelType)) {
+      return null;
+    }
+    // on ios, there is a delay after touch event and synthetic
+    // mouse events, so that user can perform double tap
+    // solution: ignore mouse events following touchevent within small timeframe
+    if (touchEvents.indexOf(topLevelType) !== -1) {
+      usedTouch = true;
+      usedTouchTime = Date.now();
+    } else {
+      if (usedTouch && Date.now() - usedTouchTime < TOUCH_DELAY) {
+        return null;
+      }
+    }
+    var event = null;
+    var distance = getDistance(startCoords, nativeEvent);
+    if (isEndish(topLevelType) && distance < tapMoveThreshold) {
+      event = SyntheticUIEvent.getPooled(eventTypes.touchTap, topLevelTargetID, nativeEvent, nativeEventTarget);
+    }
+    if (isStartish(topLevelType)) {
+      startCoords.x = getAxisCoordOfEvent(Axis.x, nativeEvent);
+      startCoords.y = getAxisCoordOfEvent(Axis.y, nativeEvent);
+    } else if (isEndish(topLevelType)) {
+      startCoords.x = 0;
+      startCoords.y = 0;
+    }
+    EventPropagators.accumulateTwoPhaseDispatches(event);
+    return event;
+  }
+
+};
+
+module.exports = TapEventPlugin;

package/lib/Transaction.js

@@ -11,7 +11,7 @@
 
 'use strict';
 
-var invariant = require("./invariant");
+var invariant = require('fbjs/lib/invariant');
 
 /**
  * `Transaction` creates a black box that is able to wrap any method such that
@@ -84,10 +84,10 @@ var Mixin = {
    */
   reinitializeTransaction: function () {
     this.transactionWrappers = this.getTransactionWrappers();
-    if (!this.wrapperInitData) {
-      this.wrapperInitData = [];
-    } else {
+    if (this.wrapperInitData) {
       this.wrapperInitData.length = 0;
+    } else {
+      this.wrapperInitData = [];
     }
     this._isInTransaction = false;
   },
@@ -122,7 +122,7 @@ var Mixin = {
    * @return {*} Return value from `method`.
    */
   perform: function (method, scope, a, b, c, d, e, f) {
-    !!this.isInTransaction() ? 'production' !== process.env.NODE_ENV ? invariant(false, 'Transaction.perform(...): Cannot initialize a transaction when there ' + 'is already an outstanding transaction.') : invariant(false) : undefined;
+    !!this.isInTransaction() ? process.env.NODE_ENV !== 'production' ? invariant(false, 'Transaction.perform(...): Cannot initialize a transaction when there ' + 'is already an outstanding transaction.') : invariant(false) : undefined;
     var errorThrown;
     var ret;
     try {
@@ -186,7 +186,7 @@ var Mixin = {
    * invoked).
    */
   closeAll: function (startIndex) {
-    !this.isInTransaction() ? 'production' !== process.env.NODE_ENV ? invariant(false, 'Transaction.closeAll(): Cannot close transaction when none are open.') : invariant(false) : undefined;
+    !this.isInTransaction() ? process.env.NODE_ENV !== 'production' ? invariant(false, 'Transaction.closeAll(): Cannot close transaction when none are open.') : invariant(false) : undefined;
     var transactionWrappers = this.transactionWrappers;
     for (var i = startIndex; i < transactionWrappers.length; i++) {
       var wrapper = transactionWrappers[i];
@@ -222,7 +222,7 @@ var Transaction = {
   Mixin: Mixin,
 
   /**
-   * Token to look for to determine if an error occured.
+   * Token to look for to determine if an error occurred.
    */
   OBSERVED_ERROR: {}
 

package/lib/accumulate.js

@@ -0,0 +1,44 @@
+/**
+ * Copyright 2013-2015, Facebook, Inc.
+ * All rights reserved.
+ *
+ * This source code is licensed under the BSD-style license found in the
+ * LICENSE file in the root directory of this source tree. An additional grant
+ * of patent rights can be found in the PATENTS file in the same directory.
+ *
+ * @providesModule accumulate
+ */
+
+'use strict';
+
+var invariant = require('fbjs/lib/invariant');
+
+/**
+ * Accumulates items that must not be null or undefined.
+ *
+ * This is used to conserve memory by avoiding array allocations.
+ *
+ * @return {*|array<*>} An accumulation of items.
+ */
+function accumulate(current, next) {
+  !(next != null) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'accumulate(...): Accumulated items must be not be null or undefined.') : invariant(false) : undefined;
+  if (current == null) {
+    return next;
+  } else {
+    // Both are not empty. Warning: Never call x.concat(y) when you are not
+    // certain that x is an Array (x could be a string with concat method).
+    var currentIsArray = Array.isArray(current);
+    var nextIsArray = Array.isArray(next);
+    if (currentIsArray) {
+      return current.concat(next);
+    } else {
+      if (nextIsArray) {
+        return [current].concat(next);
+      } else {
+        return [current, next];
+      }
+    }
+  }
+}
+
+module.exports = accumulate;

package/lib/accumulateInto.js

@@ -11,7 +11,7 @@
 
 'use strict';
 
-var invariant = require("./invariant");
+var invariant = require('fbjs/lib/invariant');
 
 /**
  *
@@ -28,7 +28,7 @@ var invariant = require("./invariant");
  */
 
 function accumulateInto(current, next) {
-  !(next != null) ? 'production' !== process.env.NODE_ENV ? invariant(false, 'accumulateInto(...): Accumulated items must not be null or undefined.') : invariant(false) : undefined;
+  !(next != null) ? process.env.NODE_ENV !== 'production' ? invariant(false, 'accumulateInto(...): Accumulated items must not be null or undefined.') : invariant(false) : undefined;
   if (current == null) {
     return next;
   }

package/lib/adler32.js

@@ -13,17 +13,29 @@
 
 var MOD = 65521;
 
-// This is a clean-room implementation of adler32 designed for detecting
-// if markup is not what we expect it to be. It does not need to be
-// cryptographically strong, only reasonably good at detecting if markup
-// generated on the server is different than that on the client.
+// adler32 is not cryptographically strong, and is only used to sanity check that
+// markup generated on the server matches the markup generated on the client.
+// This implementation (a modified version of the SheetJS version) has been optimized
+// for our use case, at the expense of conforming to the adler32 specification
+// for non-ascii inputs.
 function adler32(data) {
   var a = 1;
   var b = 0;
-  for (var i = 0; i < data.length; i++) {
-    a = (a + data.charCodeAt(i)) % MOD;
-    b = (b + a) % MOD;
+  var i = 0;
+  var l = data.length;
+  var m = l & ~0x3;
+  while (i < m) {
+    for (; i < Math.min(i + 4096, m); i += 4) {
+      b += (a += data.charCodeAt(i)) + (a += data.charCodeAt(i + 1)) + (a += data.charCodeAt(i + 2)) + (a += data.charCodeAt(i + 3));
+    }
+    a %= MOD;
+    b %= MOD;
   }
+  for (; i < l; i++) {
+    b += a += data.charCodeAt(i);
+  }
+  a %= MOD;
+  b %= MOD;
   return a | b << 16;
 }
 

package/lib/cloneWithProps.js

@@ -12,14 +12,16 @@
 
 'use strict';
 
-var ReactElement = require("./ReactElement");
-var ReactPropTransferer = require("./ReactPropTransferer");
+var ReactElement = require('./ReactElement');
+var ReactPropTransferer = require('./ReactPropTransferer');
 
-var keyOf = require("./keyOf");
-var warning = require("./warning");
+var keyOf = require('fbjs/lib/keyOf');
+var warning = require('fbjs/lib/warning');
 
 var CHILDREN_PROP = keyOf({ children: null });
 
+var didDeprecatedWarn = false;
+
 /**
  * Sometimes you want to change the props of a child passed to you. Usually
  * this is to add a CSS class.
@@ -28,10 +30,13 @@ var CHILDREN_PROP = keyOf({ children: null });
  * @param {object} props props you'd like to modify. className and style will be
  * merged automatically.
  * @return {ReactElement} a clone of child with props merged in.
+ * @deprecated
  */
 function cloneWithProps(child, props) {
-  if ('production' !== process.env.NODE_ENV) {
-    'production' !== process.env.NODE_ENV ? warning(!child.ref, 'You are calling cloneWithProps() on a child with a ref. This is ' + 'dangerous because you\'re creating a new child which will not be ' + 'added as a ref to its parent.') : undefined;
+  if (process.env.NODE_ENV !== 'production') {
+    process.env.NODE_ENV !== 'production' ? warning(didDeprecatedWarn, 'cloneWithProps(...) is deprecated. ' + 'Please use React.cloneElement instead.') : undefined;
+    didDeprecatedWarn = true;
+    process.env.NODE_ENV !== 'production' ? warning(!child.ref, 'You are calling cloneWithProps() on a child with a ref. This is ' + 'dangerous because you\'re creating a new child which will not be ' + 'added as a ref to its parent.') : undefined;
   }
 
   var newProps = ReactPropTransferer.mergeProps(props, child.props);