├── 1.png
├── ReactModal.html
├── img
└── 001.png
├── index.html
├── index2.html
├── index3.html
├── lib
├── babel.min.js
├── react-dom.js
└── react.js
├── lifeCycle.html
├── readme.md
└── rotate.html
/1.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/JackCrysler/react-start/c6664753b178e356785733576f87ba207fa585a4/1.png
--------------------------------------------------------------------------------
/ReactModal.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | React Dialog Modal
8 |
14 |
15 |
16 |
17 |
18 |
19 |
20 |
21 |
247 |
248 |
249 |
--------------------------------------------------------------------------------
/img/001.png:
--------------------------------------------------------------------------------
https://raw.githubusercontent.com/JackCrysler/react-start/c6664753b178e356785733576f87ba207fa585a4/img/001.png
--------------------------------------------------------------------------------
/index.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Document
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
17 |
51 |
52 |
--------------------------------------------------------------------------------
/index2.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Document
8 |
9 |
10 |
11 |
12 |
13 |
14 |
79 |
80 |
--------------------------------------------------------------------------------
/index3.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | 状态提升
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
76 |
77 |
--------------------------------------------------------------------------------
/lib/react.js:
--------------------------------------------------------------------------------
1 | /**
2 | * React v15.6.1
3 | */
4 | (function(f){if(typeof exports==="object"&&typeof module!=="undefined"){module.exports=f()}else if(typeof define==="function"&&define.amd){define([],f)}else{var g;if(typeof window!=="undefined"){g=window}else if(typeof global!=="undefined"){g=global}else if(typeof self!=="undefined"){g=self}else{g=this}g.React = f()}})(function(){var define,module,exports;return (function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o 1) {
1423 | var childArray = Array(childrenLength);
1424 | for (var i = 0; i < childrenLength; i++) {
1425 | childArray[i] = arguments[i + 2];
1426 | }
1427 | if ("development" !== 'production') {
1428 | if (Object.freeze) {
1429 | Object.freeze(childArray);
1430 | }
1431 | }
1432 | props.children = childArray;
1433 | }
1434 |
1435 | // Resolve default props
1436 | if (type && type.defaultProps) {
1437 | var defaultProps = type.defaultProps;
1438 | for (propName in defaultProps) {
1439 | if (props[propName] === undefined) {
1440 | props[propName] = defaultProps[propName];
1441 | }
1442 | }
1443 | }
1444 | if ("development" !== 'production') {
1445 | if (key || ref) {
1446 | if (typeof props.$$typeof === 'undefined' || props.$$typeof !== REACT_ELEMENT_TYPE) {
1447 | var displayName = typeof type === 'function' ? type.displayName || type.name || 'Unknown' : type;
1448 | if (key) {
1449 | defineKeyPropWarningGetter(props, displayName);
1450 | }
1451 | if (ref) {
1452 | defineRefPropWarningGetter(props, displayName);
1453 | }
1454 | }
1455 | }
1456 | }
1457 | return ReactElement(type, key, ref, self, source, ReactCurrentOwner.current, props);
1458 | };
1459 |
1460 | /**
1461 | * Return a function that produces ReactElements of a given type.
1462 | * See https://facebook.github.io/react/docs/top-level-api.html#react.createfactory
1463 | */
1464 | ReactElement.createFactory = function (type) {
1465 | var factory = ReactElement.createElement.bind(null, type);
1466 | // Expose the type on the factory and the prototype so that it can be
1467 | // easily accessed on elements. E.g. `.type === Foo`.
1468 | // This should not be named `constructor` since this may not be the function
1469 | // that created the element, and it may not even be a constructor.
1470 | // Legacy hook TODO: Warn if this is accessed
1471 | factory.type = type;
1472 | return factory;
1473 | };
1474 |
1475 | ReactElement.cloneAndReplaceKey = function (oldElement, newKey) {
1476 | var newElement = ReactElement(oldElement.type, newKey, oldElement.ref, oldElement._self, oldElement._source, oldElement._owner, oldElement.props);
1477 |
1478 | return newElement;
1479 | };
1480 |
1481 | /**
1482 | * Clone and return a new ReactElement using element as the starting point.
1483 | * See https://facebook.github.io/react/docs/top-level-api.html#react.cloneelement
1484 | */
1485 | ReactElement.cloneElement = function (element, config, children) {
1486 | var propName;
1487 |
1488 | // Original props are copied
1489 | var props = _assign({}, element.props);
1490 |
1491 | // Reserved names are extracted
1492 | var key = element.key;
1493 | var ref = element.ref;
1494 | // Self is preserved since the owner is preserved.
1495 | var self = element._self;
1496 | // Source is preserved since cloneElement is unlikely to be targeted by a
1497 | // transpiler, and the original source is probably a better indicator of the
1498 | // true owner.
1499 | var source = element._source;
1500 |
1501 | // Owner will be preserved, unless ref is overridden
1502 | var owner = element._owner;
1503 |
1504 | if (config != null) {
1505 | if (hasValidRef(config)) {
1506 | // Silently steal the ref from the parent.
1507 | ref = config.ref;
1508 | owner = ReactCurrentOwner.current;
1509 | }
1510 | if (hasValidKey(config)) {
1511 | key = '' + config.key;
1512 | }
1513 |
1514 | // Remaining properties override existing props
1515 | var defaultProps;
1516 | if (element.type && element.type.defaultProps) {
1517 | defaultProps = element.type.defaultProps;
1518 | }
1519 | for (propName in config) {
1520 | if (hasOwnProperty.call(config, propName) && !RESERVED_PROPS.hasOwnProperty(propName)) {
1521 | if (config[propName] === undefined && defaultProps !== undefined) {
1522 | // Resolve default props
1523 | props[propName] = defaultProps[propName];
1524 | } else {
1525 | props[propName] = config[propName];
1526 | }
1527 | }
1528 | }
1529 | }
1530 |
1531 | // Children can be more than one argument, and those are transferred onto
1532 | // the newly allocated props object.
1533 | var childrenLength = arguments.length - 2;
1534 | if (childrenLength === 1) {
1535 | props.children = children;
1536 | } else if (childrenLength > 1) {
1537 | var childArray = Array(childrenLength);
1538 | for (var i = 0; i < childrenLength; i++) {
1539 | childArray[i] = arguments[i + 2];
1540 | }
1541 | props.children = childArray;
1542 | }
1543 |
1544 | return ReactElement(element.type, key, ref, self, source, owner, props);
1545 | };
1546 |
1547 | /**
1548 | * Verifies the object is a ReactElement.
1549 | * See https://facebook.github.io/react/docs/top-level-api.html#react.isvalidelement
1550 | * @param {?object} object
1551 | * @return {boolean} True if `object` is a valid component.
1552 | * @final
1553 | */
1554 | ReactElement.isValidElement = function (object) {
1555 | return typeof object === 'object' && object !== null && object.$$typeof === REACT_ELEMENT_TYPE;
1556 | };
1557 |
1558 | module.exports = ReactElement;
1559 | },{"10":10,"18":18,"31":31,"32":32,"7":7}],10:[function(_dereq_,module,exports){
1560 | /**
1561 | * Copyright 2014-present, Facebook, Inc.
1562 | * All rights reserved.
1563 | *
1564 | * This source code is licensed under the BSD-style license found in the
1565 | * LICENSE file in the root directory of this source tree. An additional grant
1566 | * of patent rights can be found in the PATENTS file in the same directory.
1567 | *
1568 | *
1569 | */
1570 |
1571 | 'use strict';
1572 |
1573 | // The Symbol used to tag the ReactElement type. If there is no native Symbol
1574 | // nor polyfill, then a plain number is used for performance.
1575 |
1576 | var REACT_ELEMENT_TYPE = typeof Symbol === 'function' && Symbol['for'] && Symbol['for']('react.element') || 0xeac7;
1577 |
1578 | module.exports = REACT_ELEMENT_TYPE;
1579 | },{}],11:[function(_dereq_,module,exports){
1580 | /**
1581 | * Copyright 2014-present, Facebook, Inc.
1582 | * All rights reserved.
1583 | *
1584 | * This source code is licensed under the BSD-style license found in the
1585 | * LICENSE file in the root directory of this source tree. An additional grant
1586 | * of patent rights can be found in the PATENTS file in the same directory.
1587 | *
1588 | */
1589 |
1590 | /**
1591 | * ReactElementValidator provides a wrapper around a element factory
1592 | * which validates the props passed to the element. This is intended to be
1593 | * used only in DEV and could be replaced by a static type checker for languages
1594 | * that support it.
1595 | */
1596 |
1597 | 'use strict';
1598 |
1599 | var ReactCurrentOwner = _dereq_(7);
1600 | var ReactComponentTreeHook = _dereq_(6);
1601 | var ReactElement = _dereq_(9);
1602 |
1603 | var checkReactTypeSpec = _dereq_(19);
1604 |
1605 | var canDefineProperty = _dereq_(18);
1606 | var getIteratorFn = _dereq_(21);
1607 | var warning = _dereq_(31);
1608 | var lowPriorityWarning = _dereq_(23);
1609 |
1610 | function getDeclarationErrorAddendum() {
1611 | if (ReactCurrentOwner.current) {
1612 | var name = ReactCurrentOwner.current.getName();
1613 | if (name) {
1614 | return ' Check the render method of `' + name + '`.';
1615 | }
1616 | }
1617 | return '';
1618 | }
1619 |
1620 | function getSourceInfoErrorAddendum(elementProps) {
1621 | if (elementProps !== null && elementProps !== undefined && elementProps.__source !== undefined) {
1622 | var source = elementProps.__source;
1623 | var fileName = source.fileName.replace(/^.*[\\\/]/, '');
1624 | var lineNumber = source.lineNumber;
1625 | return ' Check your code at ' + fileName + ':' + lineNumber + '.';
1626 | }
1627 | return '';
1628 | }
1629 |
1630 | /**
1631 | * Warn if there's no key explicitly set on dynamic arrays of children or
1632 | * object keys are not valid. This allows us to keep track of children between
1633 | * updates.
1634 | */
1635 | var ownerHasKeyUseWarning = {};
1636 |
1637 | function getCurrentComponentErrorInfo(parentType) {
1638 | var info = getDeclarationErrorAddendum();
1639 |
1640 | if (!info) {
1641 | var parentName = typeof parentType === 'string' ? parentType : parentType.displayName || parentType.name;
1642 | if (parentName) {
1643 | info = ' Check the top-level render call using <' + parentName + '>.';
1644 | }
1645 | }
1646 | return info;
1647 | }
1648 |
1649 | /**
1650 | * Warn if the element doesn't have an explicit key assigned to it.
1651 | * This element is in an array. The array could grow and shrink or be
1652 | * reordered. All children that haven't already been validated are required to
1653 | * have a "key" property assigned to it. Error statuses are cached so a warning
1654 | * will only be shown once.
1655 | *
1656 | * @internal
1657 | * @param {ReactElement} element Element that requires a key.
1658 | * @param {*} parentType element's parent's type.
1659 | */
1660 | function validateExplicitKey(element, parentType) {
1661 | if (!element._store || element._store.validated || element.key != null) {
1662 | return;
1663 | }
1664 | element._store.validated = true;
1665 |
1666 | var memoizer = ownerHasKeyUseWarning.uniqueKey || (ownerHasKeyUseWarning.uniqueKey = {});
1667 |
1668 | var currentComponentErrorInfo = getCurrentComponentErrorInfo(parentType);
1669 | if (memoizer[currentComponentErrorInfo]) {
1670 | return;
1671 | }
1672 | memoizer[currentComponentErrorInfo] = true;
1673 |
1674 | // Usually the current owner is the offender, but if it accepts children as a
1675 | // property, it may be the creator of the child that's responsible for
1676 | // assigning it a key.
1677 | var childOwner = '';
1678 | if (element && element._owner && element._owner !== ReactCurrentOwner.current) {
1679 | // Give the component that originally created this child.
1680 | childOwner = ' It was passed a child from ' + element._owner.getName() + '.';
1681 | }
1682 |
1683 | "development" !== 'production' ? warning(false, 'Each child in an array or iterator should have a unique "key" prop.' + '%s%s See https://fb.me/react-warning-keys for more information.%s', currentComponentErrorInfo, childOwner, ReactComponentTreeHook.getCurrentStackAddendum(element)) : void 0;
1684 | }
1685 |
1686 | /**
1687 | * Ensure that every element either is passed in a static location, in an
1688 | * array with an explicit keys property defined, or in an object literal
1689 | * with valid key property.
1690 | *
1691 | * @internal
1692 | * @param {ReactNode} node Statically passed child of any type.
1693 | * @param {*} parentType node's parent's type.
1694 | */
1695 | function validateChildKeys(node, parentType) {
1696 | if (typeof node !== 'object') {
1697 | return;
1698 | }
1699 | if (Array.isArray(node)) {
1700 | for (var i = 0; i < node.length; i++) {
1701 | var child = node[i];
1702 | if (ReactElement.isValidElement(child)) {
1703 | validateExplicitKey(child, parentType);
1704 | }
1705 | }
1706 | } else if (ReactElement.isValidElement(node)) {
1707 | // This element was passed in a valid location.
1708 | if (node._store) {
1709 | node._store.validated = true;
1710 | }
1711 | } else if (node) {
1712 | var iteratorFn = getIteratorFn(node);
1713 | // Entry iterators provide implicit keys.
1714 | if (iteratorFn) {
1715 | if (iteratorFn !== node.entries) {
1716 | var iterator = iteratorFn.call(node);
1717 | var step;
1718 | while (!(step = iterator.next()).done) {
1719 | if (ReactElement.isValidElement(step.value)) {
1720 | validateExplicitKey(step.value, parentType);
1721 | }
1722 | }
1723 | }
1724 | }
1725 | }
1726 | }
1727 |
1728 | /**
1729 | * Given an element, validate that its props follow the propTypes definition,
1730 | * provided by the type.
1731 | *
1732 | * @param {ReactElement} element
1733 | */
1734 | function validatePropTypes(element) {
1735 | var componentClass = element.type;
1736 | if (typeof componentClass !== 'function') {
1737 | return;
1738 | }
1739 | var name = componentClass.displayName || componentClass.name;
1740 | if (componentClass.propTypes) {
1741 | checkReactTypeSpec(componentClass.propTypes, element.props, 'prop', name, element, null);
1742 | }
1743 | if (typeof componentClass.getDefaultProps === 'function') {
1744 | "development" !== 'production' ? warning(componentClass.getDefaultProps.isReactClassApproved, 'getDefaultProps is only used on classic React.createClass ' + 'definitions. Use a static property named `defaultProps` instead.') : void 0;
1745 | }
1746 | }
1747 |
1748 | var ReactElementValidator = {
1749 | createElement: function (type, props, children) {
1750 | var validType = typeof type === 'string' || typeof type === 'function';
1751 | // We warn in this case but don't throw. We expect the element creation to
1752 | // succeed and there will likely be errors in render.
1753 | if (!validType) {
1754 | if (typeof type !== 'function' && typeof type !== 'string') {
1755 | var info = '';
1756 | if (type === undefined || typeof type === 'object' && type !== null && Object.keys(type).length === 0) {
1757 | info += ' You likely forgot to export your component from the file ' + "it's defined in.";
1758 | }
1759 |
1760 | var sourceInfo = getSourceInfoErrorAddendum(props);
1761 | if (sourceInfo) {
1762 | info += sourceInfo;
1763 | } else {
1764 | info += getDeclarationErrorAddendum();
1765 | }
1766 |
1767 | info += ReactComponentTreeHook.getCurrentStackAddendum();
1768 |
1769 | var currentSource = props !== null && props !== undefined && props.__source !== undefined ? props.__source : null;
1770 | ReactComponentTreeHook.pushNonStandardWarningStack(true, currentSource);
1771 | "development" !== 'production' ? warning(false, 'React.createElement: type is invalid -- expected a string (for ' + 'built-in components) or a class/function (for composite ' + 'components) but got: %s.%s', type == null ? type : typeof type, info) : void 0;
1772 | ReactComponentTreeHook.popNonStandardWarningStack();
1773 | }
1774 | }
1775 |
1776 | var element = ReactElement.createElement.apply(this, arguments);
1777 |
1778 | // The result can be nullish if a mock or a custom function is used.
1779 | // TODO: Drop this when these are no longer allowed as the type argument.
1780 | if (element == null) {
1781 | return element;
1782 | }
1783 |
1784 | // Skip key warning if the type isn't valid since our key validation logic
1785 | // doesn't expect a non-string/function type and can throw confusing errors.
1786 | // We don't want exception behavior to differ between dev and prod.
1787 | // (Rendering will throw with a helpful message and as soon as the type is
1788 | // fixed, the key warnings will appear.)
1789 | if (validType) {
1790 | for (var i = 2; i < arguments.length; i++) {
1791 | validateChildKeys(arguments[i], type);
1792 | }
1793 | }
1794 |
1795 | validatePropTypes(element);
1796 |
1797 | return element;
1798 | },
1799 |
1800 | createFactory: function (type) {
1801 | var validatedFactory = ReactElementValidator.createElement.bind(null, type);
1802 | // Legacy hook TODO: Warn if this is accessed
1803 | validatedFactory.type = type;
1804 |
1805 | if ("development" !== 'production') {
1806 | if (canDefineProperty) {
1807 | Object.defineProperty(validatedFactory, 'type', {
1808 | enumerable: false,
1809 | get: function () {
1810 | lowPriorityWarning(false, 'Factory.type is deprecated. Access the class directly ' + 'before passing it to createFactory.');
1811 | Object.defineProperty(this, 'type', {
1812 | value: type
1813 | });
1814 | return type;
1815 | }
1816 | });
1817 | }
1818 | }
1819 |
1820 | return validatedFactory;
1821 | },
1822 |
1823 | cloneElement: function (element, props, children) {
1824 | var newElement = ReactElement.cloneElement.apply(this, arguments);
1825 | for (var i = 2; i < arguments.length; i++) {
1826 | validateChildKeys(arguments[i], newElement.type);
1827 | }
1828 | validatePropTypes(newElement);
1829 | return newElement;
1830 | }
1831 | };
1832 |
1833 | module.exports = ReactElementValidator;
1834 | },{"18":18,"19":19,"21":21,"23":23,"31":31,"6":6,"7":7,"9":9}],12:[function(_dereq_,module,exports){
1835 | /**
1836 | * Copyright 2015-present, Facebook, Inc.
1837 | * All rights reserved.
1838 | *
1839 | * This source code is licensed under the BSD-style license found in the
1840 | * LICENSE file in the root directory of this source tree. An additional grant
1841 | * of patent rights can be found in the PATENTS file in the same directory.
1842 | *
1843 | */
1844 |
1845 | 'use strict';
1846 |
1847 | var warning = _dereq_(31);
1848 |
1849 | function warnNoop(publicInstance, callerName) {
1850 | if ("development" !== 'production') {
1851 | var constructor = publicInstance.constructor;
1852 | "development" !== 'production' ? warning(false, '%s(...): Can only update a mounted or mounting component. ' + 'This usually means you called %s() on an unmounted component. ' + 'This is a no-op. Please check the code for the %s component.', callerName, callerName, constructor && (constructor.displayName || constructor.name) || 'ReactClass') : void 0;
1853 | }
1854 | }
1855 |
1856 | /**
1857 | * This is the abstract API for an update queue.
1858 | */
1859 | var ReactNoopUpdateQueue = {
1860 | /**
1861 | * Checks whether or not this composite component is mounted.
1862 | * @param {ReactClass} publicInstance The instance we want to test.
1863 | * @return {boolean} True if mounted, false otherwise.
1864 | * @protected
1865 | * @final
1866 | */
1867 | isMounted: function (publicInstance) {
1868 | return false;
1869 | },
1870 |
1871 | /**
1872 | * Enqueue a callback that will be executed after all the pending updates
1873 | * have processed.
1874 | *
1875 | * @param {ReactClass} publicInstance The instance to use as `this` context.
1876 | * @param {?function} callback Called after state is updated.
1877 | * @internal
1878 | */
1879 | enqueueCallback: function (publicInstance, callback) {},
1880 |
1881 | /**
1882 | * Forces an update. This should only be invoked when it is known with
1883 | * certainty that we are **not** in a DOM transaction.
1884 | *
1885 | * You may want to call this when you know that some deeper aspect of the
1886 | * component's state has changed but `setState` was not called.
1887 | *
1888 | * This will not invoke `shouldComponentUpdate`, but it will invoke
1889 | * `componentWillUpdate` and `componentDidUpdate`.
1890 | *
1891 | * @param {ReactClass} publicInstance The instance that should rerender.
1892 | * @internal
1893 | */
1894 | enqueueForceUpdate: function (publicInstance) {
1895 | warnNoop(publicInstance, 'forceUpdate');
1896 | },
1897 |
1898 | /**
1899 | * Replaces all of the state. Always use this or `setState` to mutate state.
1900 | * You should treat `this.state` as immutable.
1901 | *
1902 | * There is no guarantee that `this.state` will be immediately updated, so
1903 | * accessing `this.state` after calling this method may return the old value.
1904 | *
1905 | * @param {ReactClass} publicInstance The instance that should rerender.
1906 | * @param {object} completeState Next state.
1907 | * @internal
1908 | */
1909 | enqueueReplaceState: function (publicInstance, completeState) {
1910 | warnNoop(publicInstance, 'replaceState');
1911 | },
1912 |
1913 | /**
1914 | * Sets a subset of the state. This only exists because _pendingState is
1915 | * internal. This provides a merging strategy that is not available to deep
1916 | * properties which is confusing. TODO: Expose pendingState or don't use it
1917 | * during the merge.
1918 | *
1919 | * @param {ReactClass} publicInstance The instance that should rerender.
1920 | * @param {object} partialState Next partial state to be merged with state.
1921 | * @internal
1922 | */
1923 | enqueueSetState: function (publicInstance, partialState) {
1924 | warnNoop(publicInstance, 'setState');
1925 | }
1926 | };
1927 |
1928 | module.exports = ReactNoopUpdateQueue;
1929 | },{"31":31}],13:[function(_dereq_,module,exports){
1930 | /**
1931 | * Copyright 2013-present, Facebook, Inc.
1932 | * All rights reserved.
1933 | *
1934 | * This source code is licensed under the BSD-style license found in the
1935 | * LICENSE file in the root directory of this source tree. An additional grant
1936 | * of patent rights can be found in the PATENTS file in the same directory.
1937 | *
1938 | *
1939 | */
1940 |
1941 | 'use strict';
1942 |
1943 | var ReactPropTypeLocationNames = {};
1944 |
1945 | if ("development" !== 'production') {
1946 | ReactPropTypeLocationNames = {
1947 | prop: 'prop',
1948 | context: 'context',
1949 | childContext: 'child context'
1950 | };
1951 | }
1952 |
1953 | module.exports = ReactPropTypeLocationNames;
1954 | },{}],14:[function(_dereq_,module,exports){
1955 | /**
1956 | * Copyright 2013-present, Facebook, Inc.
1957 | * All rights reserved.
1958 | *
1959 | * This source code is licensed under the BSD-style license found in the
1960 | * LICENSE file in the root directory of this source tree. An additional grant
1961 | * of patent rights can be found in the PATENTS file in the same directory.
1962 | *
1963 | */
1964 |
1965 | 'use strict';
1966 |
1967 | var _require = _dereq_(9),
1968 | isValidElement = _require.isValidElement;
1969 |
1970 | var factory = _dereq_(34);
1971 |
1972 | module.exports = factory(isValidElement);
1973 | },{"34":34,"9":9}],15:[function(_dereq_,module,exports){
1974 | /**
1975 | * Copyright 2013-present, Facebook, Inc.
1976 | * All rights reserved.
1977 | *
1978 | * This source code is licensed under the BSD-style license found in the
1979 | * LICENSE file in the root directory of this source tree. An additional grant
1980 | * of patent rights can be found in the PATENTS file in the same directory.
1981 | *
1982 | *
1983 | */
1984 |
1985 | 'use strict';
1986 |
1987 | var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
1988 |
1989 | module.exports = ReactPropTypesSecret;
1990 | },{}],16:[function(_dereq_,module,exports){
1991 | /**
1992 | * Copyright 2013-present, Facebook, Inc.
1993 | * All rights reserved.
1994 | *
1995 | * This source code is licensed under the BSD-style license found in the
1996 | * LICENSE file in the root directory of this source tree. An additional grant
1997 | * of patent rights can be found in the PATENTS file in the same directory.
1998 | *
1999 | */
2000 |
2001 | 'use strict';
2002 |
2003 | var _assign = _dereq_(32);
2004 |
2005 | var React = _dereq_(3);
2006 |
2007 | // `version` will be added here by the React module.
2008 | var ReactUMDEntry = _assign(React, {
2009 | __SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED: {
2010 | ReactCurrentOwner: _dereq_(7)
2011 | }
2012 | });
2013 |
2014 | if ("development" !== 'production') {
2015 | _assign(ReactUMDEntry.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED, {
2016 | // ReactComponentTreeHook should not be included in production.
2017 | ReactComponentTreeHook: _dereq_(6),
2018 | getNextDebugID: _dereq_(22)
2019 | });
2020 | }
2021 |
2022 | module.exports = ReactUMDEntry;
2023 | },{"22":22,"3":3,"32":32,"6":6,"7":7}],17:[function(_dereq_,module,exports){
2024 | /**
2025 | * Copyright 2013-present, Facebook, Inc.
2026 | * All rights reserved.
2027 | *
2028 | * This source code is licensed under the BSD-style license found in the
2029 | * LICENSE file in the root directory of this source tree. An additional grant
2030 | * of patent rights can be found in the PATENTS file in the same directory.
2031 | *
2032 | */
2033 |
2034 | 'use strict';
2035 |
2036 | module.exports = '15.6.1';
2037 | },{}],18:[function(_dereq_,module,exports){
2038 | /**
2039 | * Copyright 2013-present, Facebook, Inc.
2040 | * All rights reserved.
2041 | *
2042 | * This source code is licensed under the BSD-style license found in the
2043 | * LICENSE file in the root directory of this source tree. An additional grant
2044 | * of patent rights can be found in the PATENTS file in the same directory.
2045 | *
2046 | *
2047 | */
2048 |
2049 | 'use strict';
2050 |
2051 | var canDefineProperty = false;
2052 | if ("development" !== 'production') {
2053 | try {
2054 | // $FlowFixMe https://github.com/facebook/flow/issues/285
2055 | Object.defineProperty({}, 'x', { get: function () {} });
2056 | canDefineProperty = true;
2057 | } catch (x) {
2058 | // IE will fail on defineProperty
2059 | }
2060 | }
2061 |
2062 | module.exports = canDefineProperty;
2063 | },{}],19:[function(_dereq_,module,exports){
2064 | (function (process){
2065 | /**
2066 | * Copyright 2013-present, Facebook, Inc.
2067 | * All rights reserved.
2068 | *
2069 | * This source code is licensed under the BSD-style license found in the
2070 | * LICENSE file in the root directory of this source tree. An additional grant
2071 | * of patent rights can be found in the PATENTS file in the same directory.
2072 | *
2073 | */
2074 |
2075 | 'use strict';
2076 |
2077 | var _prodInvariant = _dereq_(25);
2078 |
2079 | var ReactPropTypeLocationNames = _dereq_(13);
2080 | var ReactPropTypesSecret = _dereq_(15);
2081 |
2082 | var invariant = _dereq_(30);
2083 | var warning = _dereq_(31);
2084 |
2085 | var ReactComponentTreeHook;
2086 |
2087 | if (typeof process !== 'undefined' && process.env && "development" === 'test') {
2088 | // Temporary hack.
2089 | // Inline requires don't work well with Jest:
2090 | // https://github.com/facebook/react/issues/7240
2091 | // Remove the inline requires when we don't need them anymore:
2092 | // https://github.com/facebook/react/pull/7178
2093 | ReactComponentTreeHook = _dereq_(6);
2094 | }
2095 |
2096 | var loggedTypeFailures = {};
2097 |
2098 | /**
2099 | * Assert that the values match with the type specs.
2100 | * Error messages are memorized and will only be shown once.
2101 | *
2102 | * @param {object} typeSpecs Map of name to a ReactPropType
2103 | * @param {object} values Runtime values that need to be type-checked
2104 | * @param {string} location e.g. "prop", "context", "child context"
2105 | * @param {string} componentName Name of the component for error messages.
2106 | * @param {?object} element The React element that is being type-checked
2107 | * @param {?number} debugID The React component instance that is being type-checked
2108 | * @private
2109 | */
2110 | function checkReactTypeSpec(typeSpecs, values, location, componentName, element, debugID) {
2111 | for (var typeSpecName in typeSpecs) {
2112 | if (typeSpecs.hasOwnProperty(typeSpecName)) {
2113 | var error;
2114 | // Prop type validation may throw. In case they do, we don't want to
2115 | // fail the render phase where it didn't fail before. So we log it.
2116 | // After these have been cleaned up, we'll let them throw.
2117 | try {
2118 | // This is intentionally an invariant that gets caught. It's the same
2119 | // behavior as without this statement except with a better message.
2120 | !(typeof typeSpecs[typeSpecName] === 'function') ? "development" !== 'production' ? invariant(false, '%s: %s type `%s` is invalid; it must be a function, usually from React.PropTypes.', componentName || 'React class', ReactPropTypeLocationNames[location], typeSpecName) : _prodInvariant('84', componentName || 'React class', ReactPropTypeLocationNames[location], typeSpecName) : void 0;
2121 | error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);
2122 | } catch (ex) {
2123 | error = ex;
2124 | }
2125 | "development" !== 'production' ? warning(!error || error instanceof Error, '%s: type specification of %s `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', ReactPropTypeLocationNames[location], typeSpecName, typeof error) : void 0;
2126 | if (error instanceof Error && !(error.message in loggedTypeFailures)) {
2127 | // Only monitor this failure once because there tends to be a lot of the
2128 | // same error.
2129 | loggedTypeFailures[error.message] = true;
2130 |
2131 | var componentStackInfo = '';
2132 |
2133 | if ("development" !== 'production') {
2134 | if (!ReactComponentTreeHook) {
2135 | ReactComponentTreeHook = _dereq_(6);
2136 | }
2137 | if (debugID !== null) {
2138 | componentStackInfo = ReactComponentTreeHook.getStackAddendumByID(debugID);
2139 | } else if (element !== null) {
2140 | componentStackInfo = ReactComponentTreeHook.getCurrentStackAddendum(element);
2141 | }
2142 | }
2143 |
2144 | "development" !== 'production' ? warning(false, 'Failed %s type: %s%s', location, error.message, componentStackInfo) : void 0;
2145 | }
2146 | }
2147 | }
2148 | }
2149 |
2150 | module.exports = checkReactTypeSpec;
2151 | }).call(this,undefined)
2152 | },{"13":13,"15":15,"25":25,"30":30,"31":31,"6":6}],20:[function(_dereq_,module,exports){
2153 | /**
2154 | * Copyright 2013-present, Facebook, Inc.
2155 | * All rights reserved.
2156 | *
2157 | * This source code is licensed under the BSD-style license found in the
2158 | * LICENSE file in the root directory of this source tree. An additional grant
2159 | * of patent rights can be found in the PATENTS file in the same directory.
2160 | *
2161 | */
2162 |
2163 | 'use strict';
2164 |
2165 | var _require = _dereq_(4),
2166 | Component = _require.Component;
2167 |
2168 | var _require2 = _dereq_(9),
2169 | isValidElement = _require2.isValidElement;
2170 |
2171 | var ReactNoopUpdateQueue = _dereq_(12);
2172 | var factory = _dereq_(27);
2173 |
2174 | module.exports = factory(Component, isValidElement, ReactNoopUpdateQueue);
2175 | },{"12":12,"27":27,"4":4,"9":9}],21:[function(_dereq_,module,exports){
2176 | /**
2177 | * Copyright 2013-present, Facebook, Inc.
2178 | * All rights reserved.
2179 | *
2180 | * This source code is licensed under the BSD-style license found in the
2181 | * LICENSE file in the root directory of this source tree. An additional grant
2182 | * of patent rights can be found in the PATENTS file in the same directory.
2183 | *
2184 | *
2185 | */
2186 |
2187 | 'use strict';
2188 |
2189 | /* global Symbol */
2190 |
2191 | var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
2192 | var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
2193 |
2194 | /**
2195 | * Returns the iterator method function contained on the iterable object.
2196 | *
2197 | * Be sure to invoke the function with the iterable as context:
2198 | *
2199 | * var iteratorFn = getIteratorFn(myIterable);
2200 | * if (iteratorFn) {
2201 | * var iterator = iteratorFn.call(myIterable);
2202 | * ...
2203 | * }
2204 | *
2205 | * @param {?object} maybeIterable
2206 | * @return {?function}
2207 | */
2208 | function getIteratorFn(maybeIterable) {
2209 | var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
2210 | if (typeof iteratorFn === 'function') {
2211 | return iteratorFn;
2212 | }
2213 | }
2214 |
2215 | module.exports = getIteratorFn;
2216 | },{}],22:[function(_dereq_,module,exports){
2217 | /**
2218 | * Copyright 2013-present, Facebook, Inc.
2219 | * All rights reserved.
2220 | *
2221 | * This source code is licensed under the BSD-style license found in the
2222 | * LICENSE file in the root directory of this source tree. An additional grant
2223 | * of patent rights can be found in the PATENTS file in the same directory.
2224 | *
2225 | *
2226 | */
2227 |
2228 | 'use strict';
2229 |
2230 | var nextDebugID = 1;
2231 |
2232 | function getNextDebugID() {
2233 | return nextDebugID++;
2234 | }
2235 |
2236 | module.exports = getNextDebugID;
2237 | },{}],23:[function(_dereq_,module,exports){
2238 | /**
2239 | * Copyright 2014-2015, Facebook, Inc.
2240 | * All rights reserved.
2241 | *
2242 | * This source code is licensed under the BSD-style license found in the
2243 | * LICENSE file in the root directory of this source tree. An additional grant
2244 | * of patent rights can be found in the PATENTS file in the same directory.
2245 | *
2246 | */
2247 |
2248 | 'use strict';
2249 |
2250 | /**
2251 | * Forked from fbjs/warning:
2252 | * https://github.com/facebook/fbjs/blob/e66ba20ad5be433eb54423f2b097d829324d9de6/packages/fbjs/src/__forks__/warning.js
2253 | *
2254 | * Only change is we use console.warn instead of console.error,
2255 | * and do nothing when 'console' is not supported.
2256 | * This really simplifies the code.
2257 | * ---
2258 | * Similar to invariant but only logs a warning if the condition is not met.
2259 | * This can be used to log issues in development environments in critical
2260 | * paths. Removing the logging code for production environments will keep the
2261 | * same logic and follow the same code paths.
2262 | */
2263 |
2264 | var lowPriorityWarning = function () {};
2265 |
2266 | if ("development" !== 'production') {
2267 | var printWarning = function (format) {
2268 | for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
2269 | args[_key - 1] = arguments[_key];
2270 | }
2271 |
2272 | var argIndex = 0;
2273 | var message = 'Warning: ' + format.replace(/%s/g, function () {
2274 | return args[argIndex++];
2275 | });
2276 | if (typeof console !== 'undefined') {
2277 | console.warn(message);
2278 | }
2279 | try {
2280 | // --- Welcome to debugging React ---
2281 | // This error was thrown as a convenience so that you can use this stack
2282 | // to find the callsite that caused this warning to fire.
2283 | throw new Error(message);
2284 | } catch (x) {}
2285 | };
2286 |
2287 | lowPriorityWarning = function (condition, format) {
2288 | if (format === undefined) {
2289 | throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument');
2290 | }
2291 | if (!condition) {
2292 | for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
2293 | args[_key2 - 2] = arguments[_key2];
2294 | }
2295 |
2296 | printWarning.apply(undefined, [format].concat(args));
2297 | }
2298 | };
2299 | }
2300 |
2301 | module.exports = lowPriorityWarning;
2302 | },{}],24:[function(_dereq_,module,exports){
2303 | /**
2304 | * Copyright 2013-present, Facebook, Inc.
2305 | * All rights reserved.
2306 | *
2307 | * This source code is licensed under the BSD-style license found in the
2308 | * LICENSE file in the root directory of this source tree. An additional grant
2309 | * of patent rights can be found in the PATENTS file in the same directory.
2310 | *
2311 | */
2312 | 'use strict';
2313 |
2314 | var _prodInvariant = _dereq_(25);
2315 |
2316 | var ReactElement = _dereq_(9);
2317 |
2318 | var invariant = _dereq_(30);
2319 |
2320 | /**
2321 | * Returns the first child in a collection of children and verifies that there
2322 | * is only one child in the collection.
2323 | *
2324 | * See https://facebook.github.io/react/docs/top-level-api.html#react.children.only
2325 | *
2326 | * The current implementation of this function assumes that a single child gets
2327 | * passed without a wrapper, but the purpose of this helper function is to
2328 | * abstract away the particular structure of children.
2329 | *
2330 | * @param {?object} children Child collection structure.
2331 | * @return {ReactElement} The first and only `ReactElement` contained in the
2332 | * structure.
2333 | */
2334 | function onlyChild(children) {
2335 | !ReactElement.isValidElement(children) ? "development" !== 'production' ? invariant(false, 'React.Children.only expected to receive a single React element child.') : _prodInvariant('143') : void 0;
2336 | return children;
2337 | }
2338 |
2339 | module.exports = onlyChild;
2340 | },{"25":25,"30":30,"9":9}],25:[function(_dereq_,module,exports){
2341 | /**
2342 | * Copyright (c) 2013-present, Facebook, Inc.
2343 | * All rights reserved.
2344 | *
2345 | * This source code is licensed under the BSD-style license found in the
2346 | * LICENSE file in the root directory of this source tree. An additional grant
2347 | * of patent rights can be found in the PATENTS file in the same directory.
2348 | *
2349 | *
2350 | */
2351 | 'use strict';
2352 |
2353 | /**
2354 | * WARNING: DO NOT manually require this module.
2355 | * This is a replacement for `invariant(...)` used by the error code system
2356 | * and will _only_ be required by the corresponding babel pass.
2357 | * It always throws.
2358 | */
2359 |
2360 | function reactProdInvariant(code) {
2361 | var argCount = arguments.length - 1;
2362 |
2363 | var message = 'Minified React error #' + code + '; visit ' + 'http://facebook.github.io/react/docs/error-decoder.html?invariant=' + code;
2364 |
2365 | for (var argIdx = 0; argIdx < argCount; argIdx++) {
2366 | message += '&args[]=' + encodeURIComponent(arguments[argIdx + 1]);
2367 | }
2368 |
2369 | message += ' for the full message or use the non-minified dev environment' + ' for full errors and additional helpful warnings.';
2370 |
2371 | var error = new Error(message);
2372 | error.name = 'Invariant Violation';
2373 | error.framesToPop = 1; // we don't care about reactProdInvariant's own frame
2374 |
2375 | throw error;
2376 | }
2377 |
2378 | module.exports = reactProdInvariant;
2379 | },{}],26:[function(_dereq_,module,exports){
2380 | /**
2381 | * Copyright 2013-present, Facebook, Inc.
2382 | * All rights reserved.
2383 | *
2384 | * This source code is licensed under the BSD-style license found in the
2385 | * LICENSE file in the root directory of this source tree. An additional grant
2386 | * of patent rights can be found in the PATENTS file in the same directory.
2387 | *
2388 | */
2389 |
2390 | 'use strict';
2391 |
2392 | var _prodInvariant = _dereq_(25);
2393 |
2394 | var ReactCurrentOwner = _dereq_(7);
2395 | var REACT_ELEMENT_TYPE = _dereq_(10);
2396 |
2397 | var getIteratorFn = _dereq_(21);
2398 | var invariant = _dereq_(30);
2399 | var KeyEscapeUtils = _dereq_(1);
2400 | var warning = _dereq_(31);
2401 |
2402 | var SEPARATOR = '.';
2403 | var SUBSEPARATOR = ':';
2404 |
2405 | /**
2406 | * This is inlined from ReactElement since this file is shared between
2407 | * isomorphic and renderers. We could extract this to a
2408 | *
2409 | */
2410 |
2411 | /**
2412 | * TODO: Test that a single child and an array with one item have the same key
2413 | * pattern.
2414 | */
2415 |
2416 | var didWarnAboutMaps = false;
2417 |
2418 | /**
2419 | * Generate a key string that identifies a component within a set.
2420 | *
2421 | * @param {*} component A component that could contain a manual key.
2422 | * @param {number} index Index that is used if a manual key is not provided.
2423 | * @return {string}
2424 | */
2425 | function getComponentKey(component, index) {
2426 | // Do some typechecking here since we call this blindly. We want to ensure
2427 | // that we don't block potential future ES APIs.
2428 | if (component && typeof component === 'object' && component.key != null) {
2429 | // Explicit key
2430 | return KeyEscapeUtils.escape(component.key);
2431 | }
2432 | // Implicit key determined by the index in the set
2433 | return index.toString(36);
2434 | }
2435 |
2436 | /**
2437 | * @param {?*} children Children tree container.
2438 | * @param {!string} nameSoFar Name of the key path so far.
2439 | * @param {!function} callback Callback to invoke with each child found.
2440 | * @param {?*} traverseContext Used to pass information throughout the traversal
2441 | * process.
2442 | * @return {!number} The number of children in this subtree.
2443 | */
2444 | function traverseAllChildrenImpl(children, nameSoFar, callback, traverseContext) {
2445 | var type = typeof children;
2446 |
2447 | if (type === 'undefined' || type === 'boolean') {
2448 | // All of the above are perceived as null.
2449 | children = null;
2450 | }
2451 |
2452 | if (children === null || type === 'string' || type === 'number' ||
2453 | // The following is inlined from ReactElement. This means we can optimize
2454 | // some checks. React Fiber also inlines this logic for similar purposes.
2455 | type === 'object' && children.$$typeof === REACT_ELEMENT_TYPE) {
2456 | callback(traverseContext, children,
2457 | // If it's the only child, treat the name as if it was wrapped in an array
2458 | // so that it's consistent if the number of children grows.
2459 | nameSoFar === '' ? SEPARATOR + getComponentKey(children, 0) : nameSoFar);
2460 | return 1;
2461 | }
2462 |
2463 | var child;
2464 | var nextName;
2465 | var subtreeCount = 0; // Count of children found in the current subtree.
2466 | var nextNamePrefix = nameSoFar === '' ? SEPARATOR : nameSoFar + SUBSEPARATOR;
2467 |
2468 | if (Array.isArray(children)) {
2469 | for (var i = 0; i < children.length; i++) {
2470 | child = children[i];
2471 | nextName = nextNamePrefix + getComponentKey(child, i);
2472 | subtreeCount += traverseAllChildrenImpl(child, nextName, callback, traverseContext);
2473 | }
2474 | } else {
2475 | var iteratorFn = getIteratorFn(children);
2476 | if (iteratorFn) {
2477 | var iterator = iteratorFn.call(children);
2478 | var step;
2479 | if (iteratorFn !== children.entries) {
2480 | var ii = 0;
2481 | while (!(step = iterator.next()).done) {
2482 | child = step.value;
2483 | nextName = nextNamePrefix + getComponentKey(child, ii++);
2484 | subtreeCount += traverseAllChildrenImpl(child, nextName, callback, traverseContext);
2485 | }
2486 | } else {
2487 | if ("development" !== 'production') {
2488 | var mapsAsChildrenAddendum = '';
2489 | if (ReactCurrentOwner.current) {
2490 | var mapsAsChildrenOwnerName = ReactCurrentOwner.current.getName();
2491 | if (mapsAsChildrenOwnerName) {
2492 | mapsAsChildrenAddendum = ' Check the render method of `' + mapsAsChildrenOwnerName + '`.';
2493 | }
2494 | }
2495 | "development" !== 'production' ? warning(didWarnAboutMaps, 'Using Maps as children is not yet fully supported. It is an ' + 'experimental feature that might be removed. Convert it to a ' + 'sequence / iterable of keyed ReactElements instead.%s', mapsAsChildrenAddendum) : void 0;
2496 | didWarnAboutMaps = true;
2497 | }
2498 | // Iterator will provide entry [k,v] tuples rather than values.
2499 | while (!(step = iterator.next()).done) {
2500 | var entry = step.value;
2501 | if (entry) {
2502 | child = entry[1];
2503 | nextName = nextNamePrefix + KeyEscapeUtils.escape(entry[0]) + SUBSEPARATOR + getComponentKey(child, 0);
2504 | subtreeCount += traverseAllChildrenImpl(child, nextName, callback, traverseContext);
2505 | }
2506 | }
2507 | }
2508 | } else if (type === 'object') {
2509 | var addendum = '';
2510 | if ("development" !== 'production') {
2511 | addendum = ' If you meant to render a collection of children, use an array ' + 'instead or wrap the object using createFragment(object) from the ' + 'React add-ons.';
2512 | if (children._isReactElement) {
2513 | addendum = " It looks like you're using an element created by a different " + 'version of React. Make sure to use only one copy of React.';
2514 | }
2515 | if (ReactCurrentOwner.current) {
2516 | var name = ReactCurrentOwner.current.getName();
2517 | if (name) {
2518 | addendum += ' Check the render method of `' + name + '`.';
2519 | }
2520 | }
2521 | }
2522 | var childrenString = String(children);
2523 | !false ? "development" !== 'production' ? invariant(false, 'Objects are not valid as a React child (found: %s).%s', childrenString === '[object Object]' ? 'object with keys {' + Object.keys(children).join(', ') + '}' : childrenString, addendum) : _prodInvariant('31', childrenString === '[object Object]' ? 'object with keys {' + Object.keys(children).join(', ') + '}' : childrenString, addendum) : void 0;
2524 | }
2525 | }
2526 |
2527 | return subtreeCount;
2528 | }
2529 |
2530 | /**
2531 | * Traverses children that are typically specified as `props.children`, but
2532 | * might also be specified through attributes:
2533 | *
2534 | * - `traverseAllChildren(this.props.children, ...)`
2535 | * - `traverseAllChildren(this.props.leftPanelChildren, ...)`
2536 | *
2537 | * The `traverseContext` is an optional argument that is passed through the
2538 | * entire traversal. It can be used to store accumulations or anything else that
2539 | * the callback might find relevant.
2540 | *
2541 | * @param {?*} children Children tree object.
2542 | * @param {!function} callback To invoke upon traversing each child.
2543 | * @param {?*} traverseContext Context for traversal.
2544 | * @return {!number} The number of children in this subtree.
2545 | */
2546 | function traverseAllChildren(children, callback, traverseContext) {
2547 | if (children == null) {
2548 | return 0;
2549 | }
2550 |
2551 | return traverseAllChildrenImpl(children, '', callback, traverseContext);
2552 | }
2553 |
2554 | module.exports = traverseAllChildren;
2555 | },{"1":1,"10":10,"21":21,"25":25,"30":30,"31":31,"7":7}],27:[function(_dereq_,module,exports){
2556 | /**
2557 | * Copyright 2013-present, Facebook, Inc.
2558 | * All rights reserved.
2559 | *
2560 | * This source code is licensed under the BSD-style license found in the
2561 | * LICENSE file in the root directory of this source tree. An additional grant
2562 | * of patent rights can be found in the PATENTS file in the same directory.
2563 | *
2564 | */
2565 |
2566 | 'use strict';
2567 |
2568 | var _assign = _dereq_(32);
2569 |
2570 | var emptyObject = _dereq_(29);
2571 | var _invariant = _dereq_(30);
2572 |
2573 | if ("development" !== 'production') {
2574 | var warning = _dereq_(31);
2575 | }
2576 |
2577 | var MIXINS_KEY = 'mixins';
2578 |
2579 | // Helper function to allow the creation of anonymous functions which do not
2580 | // have .name set to the name of the variable being assigned to.
2581 | function identity(fn) {
2582 | return fn;
2583 | }
2584 |
2585 | var ReactPropTypeLocationNames;
2586 | if ("development" !== 'production') {
2587 | ReactPropTypeLocationNames = {
2588 | prop: 'prop',
2589 | context: 'context',
2590 | childContext: 'child context'
2591 | };
2592 | } else {
2593 | ReactPropTypeLocationNames = {};
2594 | }
2595 |
2596 | function factory(ReactComponent, isValidElement, ReactNoopUpdateQueue) {
2597 | /**
2598 | * Policies that describe methods in `ReactClassInterface`.
2599 | */
2600 |
2601 | var injectedMixins = [];
2602 |
2603 | /**
2604 | * Composite components are higher-level components that compose other composite
2605 | * or host components.
2606 | *
2607 | * To create a new type of `ReactClass`, pass a specification of
2608 | * your new class to `React.createClass`. The only requirement of your class
2609 | * specification is that you implement a `render` method.
2610 | *
2611 | * var MyComponent = React.createClass({
2612 | * render: function() {
2613 | * return Hello World
;
2614 | * }
2615 | * });
2616 | *
2617 | * The class specification supports a specific protocol of methods that have
2618 | * special meaning (e.g. `render`). See `ReactClassInterface` for
2619 | * more the comprehensive protocol. Any other properties and methods in the
2620 | * class specification will be available on the prototype.
2621 | *
2622 | * @interface ReactClassInterface
2623 | * @internal
2624 | */
2625 | var ReactClassInterface = {
2626 | /**
2627 | * An array of Mixin objects to include when defining your component.
2628 | *
2629 | * @type {array}
2630 | * @optional
2631 | */
2632 | mixins: 'DEFINE_MANY',
2633 |
2634 | /**
2635 | * An object containing properties and methods that should be defined on
2636 | * the component's constructor instead of its prototype (static methods).
2637 | *
2638 | * @type {object}
2639 | * @optional
2640 | */
2641 | statics: 'DEFINE_MANY',
2642 |
2643 | /**
2644 | * Definition of prop types for this component.
2645 | *
2646 | * @type {object}
2647 | * @optional
2648 | */
2649 | propTypes: 'DEFINE_MANY',
2650 |
2651 | /**
2652 | * Definition of context types for this component.
2653 | *
2654 | * @type {object}
2655 | * @optional
2656 | */
2657 | contextTypes: 'DEFINE_MANY',
2658 |
2659 | /**
2660 | * Definition of context types this component sets for its children.
2661 | *
2662 | * @type {object}
2663 | * @optional
2664 | */
2665 | childContextTypes: 'DEFINE_MANY',
2666 |
2667 | // ==== Definition methods ====
2668 |
2669 | /**
2670 | * Invoked when the component is mounted. Values in the mapping will be set on
2671 | * `this.props` if that prop is not specified (i.e. using an `in` check).
2672 | *
2673 | * This method is invoked before `getInitialState` and therefore cannot rely
2674 | * on `this.state` or use `this.setState`.
2675 | *
2676 | * @return {object}
2677 | * @optional
2678 | */
2679 | getDefaultProps: 'DEFINE_MANY_MERGED',
2680 |
2681 | /**
2682 | * Invoked once before the component is mounted. The return value will be used
2683 | * as the initial value of `this.state`.
2684 | *
2685 | * getInitialState: function() {
2686 | * return {
2687 | * isOn: false,
2688 | * fooBaz: new BazFoo()
2689 | * }
2690 | * }
2691 | *
2692 | * @return {object}
2693 | * @optional
2694 | */
2695 | getInitialState: 'DEFINE_MANY_MERGED',
2696 |
2697 | /**
2698 | * @return {object}
2699 | * @optional
2700 | */
2701 | getChildContext: 'DEFINE_MANY_MERGED',
2702 |
2703 | /**
2704 | * Uses props from `this.props` and state from `this.state` to render the
2705 | * structure of the component.
2706 | *
2707 | * No guarantees are made about when or how often this method is invoked, so
2708 | * it must not have side effects.
2709 | *
2710 | * render: function() {
2711 | * var name = this.props.name;
2712 | * return Hello, {name}!
;
2713 | * }
2714 | *
2715 | * @return {ReactComponent}
2716 | * @required
2717 | */
2718 | render: 'DEFINE_ONCE',
2719 |
2720 | // ==== Delegate methods ====
2721 |
2722 | /**
2723 | * Invoked when the component is initially created and about to be mounted.
2724 | * This may have side effects, but any external subscriptions or data created
2725 | * by this method must be cleaned up in `componentWillUnmount`.
2726 | *
2727 | * @optional
2728 | */
2729 | componentWillMount: 'DEFINE_MANY',
2730 |
2731 | /**
2732 | * Invoked when the component has been mounted and has a DOM representation.
2733 | * However, there is no guarantee that the DOM node is in the document.
2734 | *
2735 | * Use this as an opportunity to operate on the DOM when the component has
2736 | * been mounted (initialized and rendered) for the first time.
2737 | *
2738 | * @param {DOMElement} rootNode DOM element representing the component.
2739 | * @optional
2740 | */
2741 | componentDidMount: 'DEFINE_MANY',
2742 |
2743 | /**
2744 | * Invoked before the component receives new props.
2745 | *
2746 | * Use this as an opportunity to react to a prop transition by updating the
2747 | * state using `this.setState`. Current props are accessed via `this.props`.
2748 | *
2749 | * componentWillReceiveProps: function(nextProps, nextContext) {
2750 | * this.setState({
2751 | * likesIncreasing: nextProps.likeCount > this.props.likeCount
2752 | * });
2753 | * }
2754 | *
2755 | * NOTE: There is no equivalent `componentWillReceiveState`. An incoming prop
2756 | * transition may cause a state change, but the opposite is not true. If you
2757 | * need it, you are probably looking for `componentWillUpdate`.
2758 | *
2759 | * @param {object} nextProps
2760 | * @optional
2761 | */
2762 | componentWillReceiveProps: 'DEFINE_MANY',
2763 |
2764 | /**
2765 | * Invoked while deciding if the component should be updated as a result of
2766 | * receiving new props, state and/or context.
2767 | *
2768 | * Use this as an opportunity to `return false` when you're certain that the
2769 | * transition to the new props/state/context will not require a component
2770 | * update.
2771 | *
2772 | * shouldComponentUpdate: function(nextProps, nextState, nextContext) {
2773 | * return !equal(nextProps, this.props) ||
2774 | * !equal(nextState, this.state) ||
2775 | * !equal(nextContext, this.context);
2776 | * }
2777 | *
2778 | * @param {object} nextProps
2779 | * @param {?object} nextState
2780 | * @param {?object} nextContext
2781 | * @return {boolean} True if the component should update.
2782 | * @optional
2783 | */
2784 | shouldComponentUpdate: 'DEFINE_ONCE',
2785 |
2786 | /**
2787 | * Invoked when the component is about to update due to a transition from
2788 | * `this.props`, `this.state` and `this.context` to `nextProps`, `nextState`
2789 | * and `nextContext`.
2790 | *
2791 | * Use this as an opportunity to perform preparation before an update occurs.
2792 | *
2793 | * NOTE: You **cannot** use `this.setState()` in this method.
2794 | *
2795 | * @param {object} nextProps
2796 | * @param {?object} nextState
2797 | * @param {?object} nextContext
2798 | * @param {ReactReconcileTransaction} transaction
2799 | * @optional
2800 | */
2801 | componentWillUpdate: 'DEFINE_MANY',
2802 |
2803 | /**
2804 | * Invoked when the component's DOM representation has been updated.
2805 | *
2806 | * Use this as an opportunity to operate on the DOM when the component has
2807 | * been updated.
2808 | *
2809 | * @param {object} prevProps
2810 | * @param {?object} prevState
2811 | * @param {?object} prevContext
2812 | * @param {DOMElement} rootNode DOM element representing the component.
2813 | * @optional
2814 | */
2815 | componentDidUpdate: 'DEFINE_MANY',
2816 |
2817 | /**
2818 | * Invoked when the component is about to be removed from its parent and have
2819 | * its DOM representation destroyed.
2820 | *
2821 | * Use this as an opportunity to deallocate any external resources.
2822 | *
2823 | * NOTE: There is no `componentDidUnmount` since your component will have been
2824 | * destroyed by that point.
2825 | *
2826 | * @optional
2827 | */
2828 | componentWillUnmount: 'DEFINE_MANY',
2829 |
2830 | // ==== Advanced methods ====
2831 |
2832 | /**
2833 | * Updates the component's currently mounted DOM representation.
2834 | *
2835 | * By default, this implements React's rendering and reconciliation algorithm.
2836 | * Sophisticated clients may wish to override this.
2837 | *
2838 | * @param {ReactReconcileTransaction} transaction
2839 | * @internal
2840 | * @overridable
2841 | */
2842 | updateComponent: 'OVERRIDE_BASE'
2843 | };
2844 |
2845 | /**
2846 | * Mapping from class specification keys to special processing functions.
2847 | *
2848 | * Although these are declared like instance properties in the specification
2849 | * when defining classes using `React.createClass`, they are actually static
2850 | * and are accessible on the constructor instead of the prototype. Despite
2851 | * being static, they must be defined outside of the "statics" key under
2852 | * which all other static methods are defined.
2853 | */
2854 | var RESERVED_SPEC_KEYS = {
2855 | displayName: function(Constructor, displayName) {
2856 | Constructor.displayName = displayName;
2857 | },
2858 | mixins: function(Constructor, mixins) {
2859 | if (mixins) {
2860 | for (var i = 0; i < mixins.length; i++) {
2861 | mixSpecIntoComponent(Constructor, mixins[i]);
2862 | }
2863 | }
2864 | },
2865 | childContextTypes: function(Constructor, childContextTypes) {
2866 | if ("development" !== 'production') {
2867 | validateTypeDef(Constructor, childContextTypes, 'childContext');
2868 | }
2869 | Constructor.childContextTypes = _assign(
2870 | {},
2871 | Constructor.childContextTypes,
2872 | childContextTypes
2873 | );
2874 | },
2875 | contextTypes: function(Constructor, contextTypes) {
2876 | if ("development" !== 'production') {
2877 | validateTypeDef(Constructor, contextTypes, 'context');
2878 | }
2879 | Constructor.contextTypes = _assign(
2880 | {},
2881 | Constructor.contextTypes,
2882 | contextTypes
2883 | );
2884 | },
2885 | /**
2886 | * Special case getDefaultProps which should move into statics but requires
2887 | * automatic merging.
2888 | */
2889 | getDefaultProps: function(Constructor, getDefaultProps) {
2890 | if (Constructor.getDefaultProps) {
2891 | Constructor.getDefaultProps = createMergedResultFunction(
2892 | Constructor.getDefaultProps,
2893 | getDefaultProps
2894 | );
2895 | } else {
2896 | Constructor.getDefaultProps = getDefaultProps;
2897 | }
2898 | },
2899 | propTypes: function(Constructor, propTypes) {
2900 | if ("development" !== 'production') {
2901 | validateTypeDef(Constructor, propTypes, 'prop');
2902 | }
2903 | Constructor.propTypes = _assign({}, Constructor.propTypes, propTypes);
2904 | },
2905 | statics: function(Constructor, statics) {
2906 | mixStaticSpecIntoComponent(Constructor, statics);
2907 | },
2908 | autobind: function() {}
2909 | };
2910 |
2911 | function validateTypeDef(Constructor, typeDef, location) {
2912 | for (var propName in typeDef) {
2913 | if (typeDef.hasOwnProperty(propName)) {
2914 | // use a warning instead of an _invariant so components
2915 | // don't show up in prod but only in __DEV__
2916 | if ("development" !== 'production') {
2917 | warning(
2918 | typeof typeDef[propName] === 'function',
2919 | '%s: %s type `%s` is invalid; it must be a function, usually from ' +
2920 | 'React.PropTypes.',
2921 | Constructor.displayName || 'ReactClass',
2922 | ReactPropTypeLocationNames[location],
2923 | propName
2924 | );
2925 | }
2926 | }
2927 | }
2928 | }
2929 |
2930 | function validateMethodOverride(isAlreadyDefined, name) {
2931 | var specPolicy = ReactClassInterface.hasOwnProperty(name)
2932 | ? ReactClassInterface[name]
2933 | : null;
2934 |
2935 | // Disallow overriding of base class methods unless explicitly allowed.
2936 | if (ReactClassMixin.hasOwnProperty(name)) {
2937 | _invariant(
2938 | specPolicy === 'OVERRIDE_BASE',
2939 | 'ReactClassInterface: You are attempting to override ' +
2940 | '`%s` from your class specification. Ensure that your method names ' +
2941 | 'do not overlap with React methods.',
2942 | name
2943 | );
2944 | }
2945 |
2946 | // Disallow defining methods more than once unless explicitly allowed.
2947 | if (isAlreadyDefined) {
2948 | _invariant(
2949 | specPolicy === 'DEFINE_MANY' || specPolicy === 'DEFINE_MANY_MERGED',
2950 | 'ReactClassInterface: You are attempting to define ' +
2951 | '`%s` on your component more than once. This conflict may be due ' +
2952 | 'to a mixin.',
2953 | name
2954 | );
2955 | }
2956 | }
2957 |
2958 | /**
2959 | * Mixin helper which handles policy validation and reserved
2960 | * specification keys when building React classes.
2961 | */
2962 | function mixSpecIntoComponent(Constructor, spec) {
2963 | if (!spec) {
2964 | if ("development" !== 'production') {
2965 | var typeofSpec = typeof spec;
2966 | var isMixinValid = typeofSpec === 'object' && spec !== null;
2967 |
2968 | if ("development" !== 'production') {
2969 | warning(
2970 | isMixinValid,
2971 | "%s: You're attempting to include a mixin that is either null " +
2972 | 'or not an object. Check the mixins included by the component, ' +
2973 | 'as well as any mixins they include themselves. ' +
2974 | 'Expected object but got %s.',
2975 | Constructor.displayName || 'ReactClass',
2976 | spec === null ? null : typeofSpec
2977 | );
2978 | }
2979 | }
2980 |
2981 | return;
2982 | }
2983 |
2984 | _invariant(
2985 | typeof spec !== 'function',
2986 | "ReactClass: You're attempting to " +
2987 | 'use a component class or function as a mixin. Instead, just use a ' +
2988 | 'regular object.'
2989 | );
2990 | _invariant(
2991 | !isValidElement(spec),
2992 | "ReactClass: You're attempting to " +
2993 | 'use a component as a mixin. Instead, just use a regular object.'
2994 | );
2995 |
2996 | var proto = Constructor.prototype;
2997 | var autoBindPairs = proto.__reactAutoBindPairs;
2998 |
2999 | // By handling mixins before any other properties, we ensure the same
3000 | // chaining order is applied to methods with DEFINE_MANY policy, whether
3001 | // mixins are listed before or after these methods in the spec.
3002 | if (spec.hasOwnProperty(MIXINS_KEY)) {
3003 | RESERVED_SPEC_KEYS.mixins(Constructor, spec.mixins);
3004 | }
3005 |
3006 | for (var name in spec) {
3007 | if (!spec.hasOwnProperty(name)) {
3008 | continue;
3009 | }
3010 |
3011 | if (name === MIXINS_KEY) {
3012 | // We have already handled mixins in a special case above.
3013 | continue;
3014 | }
3015 |
3016 | var property = spec[name];
3017 | var isAlreadyDefined = proto.hasOwnProperty(name);
3018 | validateMethodOverride(isAlreadyDefined, name);
3019 |
3020 | if (RESERVED_SPEC_KEYS.hasOwnProperty(name)) {
3021 | RESERVED_SPEC_KEYS[name](Constructor, property);
3022 | } else {
3023 | // Setup methods on prototype:
3024 | // The following member methods should not be automatically bound:
3025 | // 1. Expected ReactClass methods (in the "interface").
3026 | // 2. Overridden methods (that were mixed in).
3027 | var isReactClassMethod = ReactClassInterface.hasOwnProperty(name);
3028 | var isFunction = typeof property === 'function';
3029 | var shouldAutoBind =
3030 | isFunction &&
3031 | !isReactClassMethod &&
3032 | !isAlreadyDefined &&
3033 | spec.autobind !== false;
3034 |
3035 | if (shouldAutoBind) {
3036 | autoBindPairs.push(name, property);
3037 | proto[name] = property;
3038 | } else {
3039 | if (isAlreadyDefined) {
3040 | var specPolicy = ReactClassInterface[name];
3041 |
3042 | // These cases should already be caught by validateMethodOverride.
3043 | _invariant(
3044 | isReactClassMethod &&
3045 | (specPolicy === 'DEFINE_MANY_MERGED' ||
3046 | specPolicy === 'DEFINE_MANY'),
3047 | 'ReactClass: Unexpected spec policy %s for key %s ' +
3048 | 'when mixing in component specs.',
3049 | specPolicy,
3050 | name
3051 | );
3052 |
3053 | // For methods which are defined more than once, call the existing
3054 | // methods before calling the new property, merging if appropriate.
3055 | if (specPolicy === 'DEFINE_MANY_MERGED') {
3056 | proto[name] = createMergedResultFunction(proto[name], property);
3057 | } else if (specPolicy === 'DEFINE_MANY') {
3058 | proto[name] = createChainedFunction(proto[name], property);
3059 | }
3060 | } else {
3061 | proto[name] = property;
3062 | if ("development" !== 'production') {
3063 | // Add verbose displayName to the function, which helps when looking
3064 | // at profiling tools.
3065 | if (typeof property === 'function' && spec.displayName) {
3066 | proto[name].displayName = spec.displayName + '_' + name;
3067 | }
3068 | }
3069 | }
3070 | }
3071 | }
3072 | }
3073 | }
3074 |
3075 | function mixStaticSpecIntoComponent(Constructor, statics) {
3076 | if (!statics) {
3077 | return;
3078 | }
3079 | for (var name in statics) {
3080 | var property = statics[name];
3081 | if (!statics.hasOwnProperty(name)) {
3082 | continue;
3083 | }
3084 |
3085 | var isReserved = name in RESERVED_SPEC_KEYS;
3086 | _invariant(
3087 | !isReserved,
3088 | 'ReactClass: You are attempting to define a reserved ' +
3089 | 'property, `%s`, that shouldn\'t be on the "statics" key. Define it ' +
3090 | 'as an instance property instead; it will still be accessible on the ' +
3091 | 'constructor.',
3092 | name
3093 | );
3094 |
3095 | var isInherited = name in Constructor;
3096 | _invariant(
3097 | !isInherited,
3098 | 'ReactClass: You are attempting to define ' +
3099 | '`%s` on your component more than once. This conflict may be ' +
3100 | 'due to a mixin.',
3101 | name
3102 | );
3103 | Constructor[name] = property;
3104 | }
3105 | }
3106 |
3107 | /**
3108 | * Merge two objects, but throw if both contain the same key.
3109 | *
3110 | * @param {object} one The first object, which is mutated.
3111 | * @param {object} two The second object
3112 | * @return {object} one after it has been mutated to contain everything in two.
3113 | */
3114 | function mergeIntoWithNoDuplicateKeys(one, two) {
3115 | _invariant(
3116 | one && two && typeof one === 'object' && typeof two === 'object',
3117 | 'mergeIntoWithNoDuplicateKeys(): Cannot merge non-objects.'
3118 | );
3119 |
3120 | for (var key in two) {
3121 | if (two.hasOwnProperty(key)) {
3122 | _invariant(
3123 | one[key] === undefined,
3124 | 'mergeIntoWithNoDuplicateKeys(): ' +
3125 | 'Tried to merge two objects with the same key: `%s`. This conflict ' +
3126 | 'may be due to a mixin; in particular, this may be caused by two ' +
3127 | 'getInitialState() or getDefaultProps() methods returning objects ' +
3128 | 'with clashing keys.',
3129 | key
3130 | );
3131 | one[key] = two[key];
3132 | }
3133 | }
3134 | return one;
3135 | }
3136 |
3137 | /**
3138 | * Creates a function that invokes two functions and merges their return values.
3139 | *
3140 | * @param {function} one Function to invoke first.
3141 | * @param {function} two Function to invoke second.
3142 | * @return {function} Function that invokes the two argument functions.
3143 | * @private
3144 | */
3145 | function createMergedResultFunction(one, two) {
3146 | return function mergedResult() {
3147 | var a = one.apply(this, arguments);
3148 | var b = two.apply(this, arguments);
3149 | if (a == null) {
3150 | return b;
3151 | } else if (b == null) {
3152 | return a;
3153 | }
3154 | var c = {};
3155 | mergeIntoWithNoDuplicateKeys(c, a);
3156 | mergeIntoWithNoDuplicateKeys(c, b);
3157 | return c;
3158 | };
3159 | }
3160 |
3161 | /**
3162 | * Creates a function that invokes two functions and ignores their return vales.
3163 | *
3164 | * @param {function} one Function to invoke first.
3165 | * @param {function} two Function to invoke second.
3166 | * @return {function} Function that invokes the two argument functions.
3167 | * @private
3168 | */
3169 | function createChainedFunction(one, two) {
3170 | return function chainedFunction() {
3171 | one.apply(this, arguments);
3172 | two.apply(this, arguments);
3173 | };
3174 | }
3175 |
3176 | /**
3177 | * Binds a method to the component.
3178 | *
3179 | * @param {object} component Component whose method is going to be bound.
3180 | * @param {function} method Method to be bound.
3181 | * @return {function} The bound method.
3182 | */
3183 | function bindAutoBindMethod(component, method) {
3184 | var boundMethod = method.bind(component);
3185 | if ("development" !== 'production') {
3186 | boundMethod.__reactBoundContext = component;
3187 | boundMethod.__reactBoundMethod = method;
3188 | boundMethod.__reactBoundArguments = null;
3189 | var componentName = component.constructor.displayName;
3190 | var _bind = boundMethod.bind;
3191 | boundMethod.bind = function(newThis) {
3192 | for (
3193 | var _len = arguments.length,
3194 | args = Array(_len > 1 ? _len - 1 : 0),
3195 | _key = 1;
3196 | _key < _len;
3197 | _key++
3198 | ) {
3199 | args[_key - 1] = arguments[_key];
3200 | }
3201 |
3202 | // User is trying to bind() an autobound method; we effectively will
3203 | // ignore the value of "this" that the user is trying to use, so
3204 | // let's warn.
3205 | if (newThis !== component && newThis !== null) {
3206 | if ("development" !== 'production') {
3207 | warning(
3208 | false,
3209 | 'bind(): React component methods may only be bound to the ' +
3210 | 'component instance. See %s',
3211 | componentName
3212 | );
3213 | }
3214 | } else if (!args.length) {
3215 | if ("development" !== 'production') {
3216 | warning(
3217 | false,
3218 | 'bind(): You are binding a component method to the component. ' +
3219 | 'React does this for you automatically in a high-performance ' +
3220 | 'way, so you can safely remove this call. See %s',
3221 | componentName
3222 | );
3223 | }
3224 | return boundMethod;
3225 | }
3226 | var reboundMethod = _bind.apply(boundMethod, arguments);
3227 | reboundMethod.__reactBoundContext = component;
3228 | reboundMethod.__reactBoundMethod = method;
3229 | reboundMethod.__reactBoundArguments = args;
3230 | return reboundMethod;
3231 | };
3232 | }
3233 | return boundMethod;
3234 | }
3235 |
3236 | /**
3237 | * Binds all auto-bound methods in a component.
3238 | *
3239 | * @param {object} component Component whose method is going to be bound.
3240 | */
3241 | function bindAutoBindMethods(component) {
3242 | var pairs = component.__reactAutoBindPairs;
3243 | for (var i = 0; i < pairs.length; i += 2) {
3244 | var autoBindKey = pairs[i];
3245 | var method = pairs[i + 1];
3246 | component[autoBindKey] = bindAutoBindMethod(component, method);
3247 | }
3248 | }
3249 |
3250 | var IsMountedPreMixin = {
3251 | componentDidMount: function() {
3252 | this.__isMounted = true;
3253 | }
3254 | };
3255 |
3256 | var IsMountedPostMixin = {
3257 | componentWillUnmount: function() {
3258 | this.__isMounted = false;
3259 | }
3260 | };
3261 |
3262 | /**
3263 | * Add more to the ReactClass base class. These are all legacy features and
3264 | * therefore not already part of the modern ReactComponent.
3265 | */
3266 | var ReactClassMixin = {
3267 | /**
3268 | * TODO: This will be deprecated because state should always keep a consistent
3269 | * type signature and the only use case for this, is to avoid that.
3270 | */
3271 | replaceState: function(newState, callback) {
3272 | this.updater.enqueueReplaceState(this, newState, callback);
3273 | },
3274 |
3275 | /**
3276 | * Checks whether or not this composite component is mounted.
3277 | * @return {boolean} True if mounted, false otherwise.
3278 | * @protected
3279 | * @final
3280 | */
3281 | isMounted: function() {
3282 | if ("development" !== 'production') {
3283 | warning(
3284 | this.__didWarnIsMounted,
3285 | '%s: isMounted is deprecated. Instead, make sure to clean up ' +
3286 | 'subscriptions and pending requests in componentWillUnmount to ' +
3287 | 'prevent memory leaks.',
3288 | (this.constructor && this.constructor.displayName) ||
3289 | this.name ||
3290 | 'Component'
3291 | );
3292 | this.__didWarnIsMounted = true;
3293 | }
3294 | return !!this.__isMounted;
3295 | }
3296 | };
3297 |
3298 | var ReactClassComponent = function() {};
3299 | _assign(
3300 | ReactClassComponent.prototype,
3301 | ReactComponent.prototype,
3302 | ReactClassMixin
3303 | );
3304 |
3305 | /**
3306 | * Creates a composite component class given a class specification.
3307 | * See https://facebook.github.io/react/docs/top-level-api.html#react.createclass
3308 | *
3309 | * @param {object} spec Class specification (which must define `render`).
3310 | * @return {function} Component constructor function.
3311 | * @public
3312 | */
3313 | function createClass(spec) {
3314 | // To keep our warnings more understandable, we'll use a little hack here to
3315 | // ensure that Constructor.name !== 'Constructor'. This makes sure we don't
3316 | // unnecessarily identify a class without displayName as 'Constructor'.
3317 | var Constructor = identity(function(props, context, updater) {
3318 | // This constructor gets overridden by mocks. The argument is used
3319 | // by mocks to assert on what gets mounted.
3320 |
3321 | if ("development" !== 'production') {
3322 | warning(
3323 | this instanceof Constructor,
3324 | 'Something is calling a React component directly. Use a factory or ' +
3325 | 'JSX instead. See: https://fb.me/react-legacyfactory'
3326 | );
3327 | }
3328 |
3329 | // Wire up auto-binding
3330 | if (this.__reactAutoBindPairs.length) {
3331 | bindAutoBindMethods(this);
3332 | }
3333 |
3334 | this.props = props;
3335 | this.context = context;
3336 | this.refs = emptyObject;
3337 | this.updater = updater || ReactNoopUpdateQueue;
3338 |
3339 | this.state = null;
3340 |
3341 | // ReactClasses doesn't have constructors. Instead, they use the
3342 | // getInitialState and componentWillMount methods for initialization.
3343 |
3344 | var initialState = this.getInitialState ? this.getInitialState() : null;
3345 | if ("development" !== 'production') {
3346 | // We allow auto-mocks to proceed as if they're returning null.
3347 | if (
3348 | initialState === undefined &&
3349 | this.getInitialState._isMockFunction
3350 | ) {
3351 | // This is probably bad practice. Consider warning here and
3352 | // deprecating this convenience.
3353 | initialState = null;
3354 | }
3355 | }
3356 | _invariant(
3357 | typeof initialState === 'object' && !Array.isArray(initialState),
3358 | '%s.getInitialState(): must return an object or null',
3359 | Constructor.displayName || 'ReactCompositeComponent'
3360 | );
3361 |
3362 | this.state = initialState;
3363 | });
3364 | Constructor.prototype = new ReactClassComponent();
3365 | Constructor.prototype.constructor = Constructor;
3366 | Constructor.prototype.__reactAutoBindPairs = [];
3367 |
3368 | injectedMixins.forEach(mixSpecIntoComponent.bind(null, Constructor));
3369 |
3370 | mixSpecIntoComponent(Constructor, IsMountedPreMixin);
3371 | mixSpecIntoComponent(Constructor, spec);
3372 | mixSpecIntoComponent(Constructor, IsMountedPostMixin);
3373 |
3374 | // Initialize the defaultProps property after all mixins have been merged.
3375 | if (Constructor.getDefaultProps) {
3376 | Constructor.defaultProps = Constructor.getDefaultProps();
3377 | }
3378 |
3379 | if ("development" !== 'production') {
3380 | // This is a tag to indicate that the use of these method names is ok,
3381 | // since it's used with createClass. If it's not, then it's likely a
3382 | // mistake so we'll warn you to use the static property, property
3383 | // initializer or constructor respectively.
3384 | if (Constructor.getDefaultProps) {
3385 | Constructor.getDefaultProps.isReactClassApproved = {};
3386 | }
3387 | if (Constructor.prototype.getInitialState) {
3388 | Constructor.prototype.getInitialState.isReactClassApproved = {};
3389 | }
3390 | }
3391 |
3392 | _invariant(
3393 | Constructor.prototype.render,
3394 | 'createClass(...): Class specification must implement a `render` method.'
3395 | );
3396 |
3397 | if ("development" !== 'production') {
3398 | warning(
3399 | !Constructor.prototype.componentShouldUpdate,
3400 | '%s has a method called ' +
3401 | 'componentShouldUpdate(). Did you mean shouldComponentUpdate()? ' +
3402 | 'The name is phrased as a question because the function is ' +
3403 | 'expected to return a value.',
3404 | spec.displayName || 'A component'
3405 | );
3406 | warning(
3407 | !Constructor.prototype.componentWillRecieveProps,
3408 | '%s has a method called ' +
3409 | 'componentWillRecieveProps(). Did you mean componentWillReceiveProps()?',
3410 | spec.displayName || 'A component'
3411 | );
3412 | }
3413 |
3414 | // Reduce time spent doing lookups by setting these on the prototype.
3415 | for (var methodName in ReactClassInterface) {
3416 | if (!Constructor.prototype[methodName]) {
3417 | Constructor.prototype[methodName] = null;
3418 | }
3419 | }
3420 |
3421 | return Constructor;
3422 | }
3423 |
3424 | return createClass;
3425 | }
3426 |
3427 | module.exports = factory;
3428 |
3429 | },{"29":29,"30":30,"31":31,"32":32}],28:[function(_dereq_,module,exports){
3430 | "use strict";
3431 |
3432 | /**
3433 | * Copyright (c) 2013-present, Facebook, Inc.
3434 | * All rights reserved.
3435 | *
3436 | * This source code is licensed under the BSD-style license found in the
3437 | * LICENSE file in the root directory of this source tree. An additional grant
3438 | * of patent rights can be found in the PATENTS file in the same directory.
3439 | *
3440 | *
3441 | */
3442 |
3443 | function makeEmptyFunction(arg) {
3444 | return function () {
3445 | return arg;
3446 | };
3447 | }
3448 |
3449 | /**
3450 | * This function accepts and discards inputs; it has no side effects. This is
3451 | * primarily useful idiomatically for overridable function endpoints which
3452 | * always need to be callable, since JS lacks a null-call idiom ala Cocoa.
3453 | */
3454 | var emptyFunction = function emptyFunction() {};
3455 |
3456 | emptyFunction.thatReturns = makeEmptyFunction;
3457 | emptyFunction.thatReturnsFalse = makeEmptyFunction(false);
3458 | emptyFunction.thatReturnsTrue = makeEmptyFunction(true);
3459 | emptyFunction.thatReturnsNull = makeEmptyFunction(null);
3460 | emptyFunction.thatReturnsThis = function () {
3461 | return this;
3462 | };
3463 | emptyFunction.thatReturnsArgument = function (arg) {
3464 | return arg;
3465 | };
3466 |
3467 | module.exports = emptyFunction;
3468 | },{}],29:[function(_dereq_,module,exports){
3469 | /**
3470 | * Copyright (c) 2013-present, Facebook, Inc.
3471 | * All rights reserved.
3472 | *
3473 | * This source code is licensed under the BSD-style license found in the
3474 | * LICENSE file in the root directory of this source tree. An additional grant
3475 | * of patent rights can be found in the PATENTS file in the same directory.
3476 | *
3477 | */
3478 |
3479 | 'use strict';
3480 |
3481 | var emptyObject = {};
3482 |
3483 | if ("development" !== 'production') {
3484 | Object.freeze(emptyObject);
3485 | }
3486 |
3487 | module.exports = emptyObject;
3488 | },{}],30:[function(_dereq_,module,exports){
3489 | /**
3490 | * Copyright (c) 2013-present, Facebook, Inc.
3491 | * All rights reserved.
3492 | *
3493 | * This source code is licensed under the BSD-style license found in the
3494 | * LICENSE file in the root directory of this source tree. An additional grant
3495 | * of patent rights can be found in the PATENTS file in the same directory.
3496 | *
3497 | */
3498 |
3499 | 'use strict';
3500 |
3501 | /**
3502 | * Use invariant() to assert state which your program assumes to be true.
3503 | *
3504 | * Provide sprintf-style format (only %s is supported) and arguments
3505 | * to provide information about what broke and what you were
3506 | * expecting.
3507 | *
3508 | * The invariant message will be stripped in production, but the invariant
3509 | * will remain to ensure logic does not differ in production.
3510 | */
3511 |
3512 | var validateFormat = function validateFormat(format) {};
3513 |
3514 | if ("development" !== 'production') {
3515 | validateFormat = function validateFormat(format) {
3516 | if (format === undefined) {
3517 | throw new Error('invariant requires an error message argument');
3518 | }
3519 | };
3520 | }
3521 |
3522 | function invariant(condition, format, a, b, c, d, e, f) {
3523 | validateFormat(format);
3524 |
3525 | if (!condition) {
3526 | var error;
3527 | if (format === undefined) {
3528 | error = new Error('Minified exception occurred; use the non-minified dev environment ' + 'for the full error message and additional helpful warnings.');
3529 | } else {
3530 | var args = [a, b, c, d, e, f];
3531 | var argIndex = 0;
3532 | error = new Error(format.replace(/%s/g, function () {
3533 | return args[argIndex++];
3534 | }));
3535 | error.name = 'Invariant Violation';
3536 | }
3537 |
3538 | error.framesToPop = 1; // we don't care about invariant's own frame
3539 | throw error;
3540 | }
3541 | }
3542 |
3543 | module.exports = invariant;
3544 | },{}],31:[function(_dereq_,module,exports){
3545 | /**
3546 | * Copyright 2014-2015, Facebook, Inc.
3547 | * All rights reserved.
3548 | *
3549 | * This source code is licensed under the BSD-style license found in the
3550 | * LICENSE file in the root directory of this source tree. An additional grant
3551 | * of patent rights can be found in the PATENTS file in the same directory.
3552 | *
3553 | */
3554 |
3555 | 'use strict';
3556 |
3557 | var emptyFunction = _dereq_(28);
3558 |
3559 | /**
3560 | * Similar to invariant but only logs a warning if the condition is not met.
3561 | * This can be used to log issues in development environments in critical
3562 | * paths. Removing the logging code for production environments will keep the
3563 | * same logic and follow the same code paths.
3564 | */
3565 |
3566 | var warning = emptyFunction;
3567 |
3568 | if ("development" !== 'production') {
3569 | (function () {
3570 | var printWarning = function printWarning(format) {
3571 | for (var _len = arguments.length, args = Array(_len > 1 ? _len - 1 : 0), _key = 1; _key < _len; _key++) {
3572 | args[_key - 1] = arguments[_key];
3573 | }
3574 |
3575 | var argIndex = 0;
3576 | var message = 'Warning: ' + format.replace(/%s/g, function () {
3577 | return args[argIndex++];
3578 | });
3579 | if (typeof console !== 'undefined') {
3580 | console.error(message);
3581 | }
3582 | try {
3583 | // --- Welcome to debugging React ---
3584 | // This error was thrown as a convenience so that you can use this stack
3585 | // to find the callsite that caused this warning to fire.
3586 | throw new Error(message);
3587 | } catch (x) {}
3588 | };
3589 |
3590 | warning = function warning(condition, format) {
3591 | if (format === undefined) {
3592 | throw new Error('`warning(condition, format, ...args)` requires a warning ' + 'message argument');
3593 | }
3594 |
3595 | if (format.indexOf('Failed Composite propType: ') === 0) {
3596 | return; // Ignore CompositeComponent proptype check.
3597 | }
3598 |
3599 | if (!condition) {
3600 | for (var _len2 = arguments.length, args = Array(_len2 > 2 ? _len2 - 2 : 0), _key2 = 2; _key2 < _len2; _key2++) {
3601 | args[_key2 - 2] = arguments[_key2];
3602 | }
3603 |
3604 | printWarning.apply(undefined, [format].concat(args));
3605 | }
3606 | };
3607 | })();
3608 | }
3609 |
3610 | module.exports = warning;
3611 | },{"28":28}],32:[function(_dereq_,module,exports){
3612 | /*
3613 | object-assign
3614 | (c) Sindre Sorhus
3615 | @license MIT
3616 | */
3617 |
3618 | 'use strict';
3619 | /* eslint-disable no-unused-vars */
3620 | var getOwnPropertySymbols = Object.getOwnPropertySymbols;
3621 | var hasOwnProperty = Object.prototype.hasOwnProperty;
3622 | var propIsEnumerable = Object.prototype.propertyIsEnumerable;
3623 |
3624 | function toObject(val) {
3625 | if (val === null || val === undefined) {
3626 | throw new TypeError('Object.assign cannot be called with null or undefined');
3627 | }
3628 |
3629 | return Object(val);
3630 | }
3631 |
3632 | function shouldUseNative() {
3633 | try {
3634 | if (!Object.assign) {
3635 | return false;
3636 | }
3637 |
3638 | // Detect buggy property enumeration order in older V8 versions.
3639 |
3640 | // https://bugs.chromium.org/p/v8/issues/detail?id=4118
3641 | var test1 = new String('abc'); // eslint-disable-line no-new-wrappers
3642 | test1[5] = 'de';
3643 | if (Object.getOwnPropertyNames(test1)[0] === '5') {
3644 | return false;
3645 | }
3646 |
3647 | // https://bugs.chromium.org/p/v8/issues/detail?id=3056
3648 | var test2 = {};
3649 | for (var i = 0; i < 10; i++) {
3650 | test2['_' + String.fromCharCode(i)] = i;
3651 | }
3652 | var order2 = Object.getOwnPropertyNames(test2).map(function (n) {
3653 | return test2[n];
3654 | });
3655 | if (order2.join('') !== '0123456789') {
3656 | return false;
3657 | }
3658 |
3659 | // https://bugs.chromium.org/p/v8/issues/detail?id=3056
3660 | var test3 = {};
3661 | 'abcdefghijklmnopqrst'.split('').forEach(function (letter) {
3662 | test3[letter] = letter;
3663 | });
3664 | if (Object.keys(Object.assign({}, test3)).join('') !==
3665 | 'abcdefghijklmnopqrst') {
3666 | return false;
3667 | }
3668 |
3669 | return true;
3670 | } catch (err) {
3671 | // We don't expect any of the above to throw, but better to be safe.
3672 | return false;
3673 | }
3674 | }
3675 |
3676 | module.exports = shouldUseNative() ? Object.assign : function (target, source) {
3677 | var from;
3678 | var to = toObject(target);
3679 | var symbols;
3680 |
3681 | for (var s = 1; s < arguments.length; s++) {
3682 | from = Object(arguments[s]);
3683 |
3684 | for (var key in from) {
3685 | if (hasOwnProperty.call(from, key)) {
3686 | to[key] = from[key];
3687 | }
3688 | }
3689 |
3690 | if (getOwnPropertySymbols) {
3691 | symbols = getOwnPropertySymbols(from);
3692 | for (var i = 0; i < symbols.length; i++) {
3693 | if (propIsEnumerable.call(from, symbols[i])) {
3694 | to[symbols[i]] = from[symbols[i]];
3695 | }
3696 | }
3697 | }
3698 | }
3699 |
3700 | return to;
3701 | };
3702 |
3703 | },{}],33:[function(_dereq_,module,exports){
3704 | /**
3705 | * Copyright 2013-present, Facebook, Inc.
3706 | * All rights reserved.
3707 | *
3708 | * This source code is licensed under the BSD-style license found in the
3709 | * LICENSE file in the root directory of this source tree. An additional grant
3710 | * of patent rights can be found in the PATENTS file in the same directory.
3711 | */
3712 |
3713 | 'use strict';
3714 |
3715 | if ("development" !== 'production') {
3716 | var invariant = _dereq_(30);
3717 | var warning = _dereq_(31);
3718 | var ReactPropTypesSecret = _dereq_(36);
3719 | var loggedTypeFailures = {};
3720 | }
3721 |
3722 | /**
3723 | * Assert that the values match with the type specs.
3724 | * Error messages are memorized and will only be shown once.
3725 | *
3726 | * @param {object} typeSpecs Map of name to a ReactPropType
3727 | * @param {object} values Runtime values that need to be type-checked
3728 | * @param {string} location e.g. "prop", "context", "child context"
3729 | * @param {string} componentName Name of the component for error messages.
3730 | * @param {?Function} getStack Returns the component stack.
3731 | * @private
3732 | */
3733 | function checkPropTypes(typeSpecs, values, location, componentName, getStack) {
3734 | if ("development" !== 'production') {
3735 | for (var typeSpecName in typeSpecs) {
3736 | if (typeSpecs.hasOwnProperty(typeSpecName)) {
3737 | var error;
3738 | // Prop type validation may throw. In case they do, we don't want to
3739 | // fail the render phase where it didn't fail before. So we log it.
3740 | // After these have been cleaned up, we'll let them throw.
3741 | try {
3742 | // This is intentionally an invariant that gets caught. It's the same
3743 | // behavior as without this statement except with a better message.
3744 | invariant(typeof typeSpecs[typeSpecName] === 'function', '%s: %s type `%s` is invalid; it must be a function, usually from ' + 'React.PropTypes.', componentName || 'React class', location, typeSpecName);
3745 | error = typeSpecs[typeSpecName](values, typeSpecName, componentName, location, null, ReactPropTypesSecret);
3746 | } catch (ex) {
3747 | error = ex;
3748 | }
3749 | warning(!error || error instanceof Error, '%s: type specification of %s `%s` is invalid; the type checker ' + 'function must return `null` or an `Error` but returned a %s. ' + 'You may have forgotten to pass an argument to the type checker ' + 'creator (arrayOf, instanceOf, objectOf, oneOf, oneOfType, and ' + 'shape all require an argument).', componentName || 'React class', location, typeSpecName, typeof error);
3750 | if (error instanceof Error && !(error.message in loggedTypeFailures)) {
3751 | // Only monitor this failure once because there tends to be a lot of the
3752 | // same error.
3753 | loggedTypeFailures[error.message] = true;
3754 |
3755 | var stack = getStack ? getStack() : '';
3756 |
3757 | warning(false, 'Failed %s type: %s%s', location, error.message, stack != null ? stack : '');
3758 | }
3759 | }
3760 | }
3761 | }
3762 | }
3763 |
3764 | module.exports = checkPropTypes;
3765 |
3766 | },{"30":30,"31":31,"36":36}],34:[function(_dereq_,module,exports){
3767 | /**
3768 | * Copyright 2013-present, Facebook, Inc.
3769 | * All rights reserved.
3770 | *
3771 | * This source code is licensed under the BSD-style license found in the
3772 | * LICENSE file in the root directory of this source tree. An additional grant
3773 | * of patent rights can be found in the PATENTS file in the same directory.
3774 | */
3775 |
3776 | 'use strict';
3777 |
3778 | // React 15.5 references this module, and assumes PropTypes are still callable in production.
3779 | // Therefore we re-export development-only version with all the PropTypes checks here.
3780 | // However if one is migrating to the `prop-types` npm library, they will go through the
3781 | // `index.js` entry point, and it will branch depending on the environment.
3782 | var factory = _dereq_(35);
3783 | module.exports = function(isValidElement) {
3784 | // It is still allowed in 15.5.
3785 | var throwOnDirectAccess = false;
3786 | return factory(isValidElement, throwOnDirectAccess);
3787 | };
3788 |
3789 | },{"35":35}],35:[function(_dereq_,module,exports){
3790 | /**
3791 | * Copyright 2013-present, Facebook, Inc.
3792 | * All rights reserved.
3793 | *
3794 | * This source code is licensed under the BSD-style license found in the
3795 | * LICENSE file in the root directory of this source tree. An additional grant
3796 | * of patent rights can be found in the PATENTS file in the same directory.
3797 | */
3798 |
3799 | 'use strict';
3800 |
3801 | var emptyFunction = _dereq_(28);
3802 | var invariant = _dereq_(30);
3803 | var warning = _dereq_(31);
3804 |
3805 | var ReactPropTypesSecret = _dereq_(36);
3806 | var checkPropTypes = _dereq_(33);
3807 |
3808 | module.exports = function(isValidElement, throwOnDirectAccess) {
3809 | /* global Symbol */
3810 | var ITERATOR_SYMBOL = typeof Symbol === 'function' && Symbol.iterator;
3811 | var FAUX_ITERATOR_SYMBOL = '@@iterator'; // Before Symbol spec.
3812 |
3813 | /**
3814 | * Returns the iterator method function contained on the iterable object.
3815 | *
3816 | * Be sure to invoke the function with the iterable as context:
3817 | *
3818 | * var iteratorFn = getIteratorFn(myIterable);
3819 | * if (iteratorFn) {
3820 | * var iterator = iteratorFn.call(myIterable);
3821 | * ...
3822 | * }
3823 | *
3824 | * @param {?object} maybeIterable
3825 | * @return {?function}
3826 | */
3827 | function getIteratorFn(maybeIterable) {
3828 | var iteratorFn = maybeIterable && (ITERATOR_SYMBOL && maybeIterable[ITERATOR_SYMBOL] || maybeIterable[FAUX_ITERATOR_SYMBOL]);
3829 | if (typeof iteratorFn === 'function') {
3830 | return iteratorFn;
3831 | }
3832 | }
3833 |
3834 | /**
3835 | * Collection of methods that allow declaration and validation of props that are
3836 | * supplied to React components. Example usage:
3837 | *
3838 | * var Props = require('ReactPropTypes');
3839 | * var MyArticle = React.createClass({
3840 | * propTypes: {
3841 | * // An optional string prop named "description".
3842 | * description: Props.string,
3843 | *
3844 | * // A required enum prop named "category".
3845 | * category: Props.oneOf(['News','Photos']).isRequired,
3846 | *
3847 | * // A prop named "dialog" that requires an instance of Dialog.
3848 | * dialog: Props.instanceOf(Dialog).isRequired
3849 | * },
3850 | * render: function() { ... }
3851 | * });
3852 | *
3853 | * A more formal specification of how these methods are used:
3854 | *
3855 | * type := array|bool|func|object|number|string|oneOf([...])|instanceOf(...)
3856 | * decl := ReactPropTypes.{type}(.isRequired)?
3857 | *
3858 | * Each and every declaration produces a function with the same signature. This
3859 | * allows the creation of custom validation functions. For example:
3860 | *
3861 | * var MyLink = React.createClass({
3862 | * propTypes: {
3863 | * // An optional string or URI prop named "href".
3864 | * href: function(props, propName, componentName) {
3865 | * var propValue = props[propName];
3866 | * if (propValue != null && typeof propValue !== 'string' &&
3867 | * !(propValue instanceof URI)) {
3868 | * return new Error(
3869 | * 'Expected a string or an URI for ' + propName + ' in ' +
3870 | * componentName
3871 | * );
3872 | * }
3873 | * }
3874 | * },
3875 | * render: function() {...}
3876 | * });
3877 | *
3878 | * @internal
3879 | */
3880 |
3881 | var ANONYMOUS = '<>';
3882 |
3883 | // Important!
3884 | // Keep this list in sync with production version in `./factoryWithThrowingShims.js`.
3885 | var ReactPropTypes = {
3886 | array: createPrimitiveTypeChecker('array'),
3887 | bool: createPrimitiveTypeChecker('boolean'),
3888 | func: createPrimitiveTypeChecker('function'),
3889 | number: createPrimitiveTypeChecker('number'),
3890 | object: createPrimitiveTypeChecker('object'),
3891 | string: createPrimitiveTypeChecker('string'),
3892 | symbol: createPrimitiveTypeChecker('symbol'),
3893 |
3894 | any: createAnyTypeChecker(),
3895 | arrayOf: createArrayOfTypeChecker,
3896 | element: createElementTypeChecker(),
3897 | instanceOf: createInstanceTypeChecker,
3898 | node: createNodeChecker(),
3899 | objectOf: createObjectOfTypeChecker,
3900 | oneOf: createEnumTypeChecker,
3901 | oneOfType: createUnionTypeChecker,
3902 | shape: createShapeTypeChecker
3903 | };
3904 |
3905 | /**
3906 | * inlined Object.is polyfill to avoid requiring consumers ship their own
3907 | * https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Object/is
3908 | */
3909 | /*eslint-disable no-self-compare*/
3910 | function is(x, y) {
3911 | // SameValue algorithm
3912 | if (x === y) {
3913 | // Steps 1-5, 7-10
3914 | // Steps 6.b-6.e: +0 != -0
3915 | return x !== 0 || 1 / x === 1 / y;
3916 | } else {
3917 | // Step 6.a: NaN == NaN
3918 | return x !== x && y !== y;
3919 | }
3920 | }
3921 | /*eslint-enable no-self-compare*/
3922 |
3923 | /**
3924 | * We use an Error-like object for backward compatibility as people may call
3925 | * PropTypes directly and inspect their output. However, we don't use real
3926 | * Errors anymore. We don't inspect their stack anyway, and creating them
3927 | * is prohibitively expensive if they are created too often, such as what
3928 | * happens in oneOfType() for any type before the one that matched.
3929 | */
3930 | function PropTypeError(message) {
3931 | this.message = message;
3932 | this.stack = '';
3933 | }
3934 | // Make `instanceof Error` still work for returned errors.
3935 | PropTypeError.prototype = Error.prototype;
3936 |
3937 | function createChainableTypeChecker(validate) {
3938 | if ("development" !== 'production') {
3939 | var manualPropTypeCallCache = {};
3940 | var manualPropTypeWarningCount = 0;
3941 | }
3942 | function checkType(isRequired, props, propName, componentName, location, propFullName, secret) {
3943 | componentName = componentName || ANONYMOUS;
3944 | propFullName = propFullName || propName;
3945 |
3946 | if (secret !== ReactPropTypesSecret) {
3947 | if (throwOnDirectAccess) {
3948 | // New behavior only for users of `prop-types` package
3949 | invariant(
3950 | false,
3951 | 'Calling PropTypes validators directly is not supported by the `prop-types` package. ' +
3952 | 'Use `PropTypes.checkPropTypes()` to call them. ' +
3953 | 'Read more at http://fb.me/use-check-prop-types'
3954 | );
3955 | } else if ("development" !== 'production' && typeof console !== 'undefined') {
3956 | // Old behavior for people using React.PropTypes
3957 | var cacheKey = componentName + ':' + propName;
3958 | if (
3959 | !manualPropTypeCallCache[cacheKey] &&
3960 | // Avoid spamming the console because they are often not actionable except for lib authors
3961 | manualPropTypeWarningCount < 3
3962 | ) {
3963 | warning(
3964 | false,
3965 | 'You are manually calling a React.PropTypes validation ' +
3966 | 'function for the `%s` prop on `%s`. This is deprecated ' +
3967 | 'and will throw in the standalone `prop-types` package. ' +
3968 | 'You may be seeing this warning due to a third-party PropTypes ' +
3969 | 'library. See https://fb.me/react-warning-dont-call-proptypes ' + 'for details.',
3970 | propFullName,
3971 | componentName
3972 | );
3973 | manualPropTypeCallCache[cacheKey] = true;
3974 | manualPropTypeWarningCount++;
3975 | }
3976 | }
3977 | }
3978 | if (props[propName] == null) {
3979 | if (isRequired) {
3980 | if (props[propName] === null) {
3981 | return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required ' + ('in `' + componentName + '`, but its value is `null`.'));
3982 | }
3983 | return new PropTypeError('The ' + location + ' `' + propFullName + '` is marked as required in ' + ('`' + componentName + '`, but its value is `undefined`.'));
3984 | }
3985 | return null;
3986 | } else {
3987 | return validate(props, propName, componentName, location, propFullName);
3988 | }
3989 | }
3990 |
3991 | var chainedCheckType = checkType.bind(null, false);
3992 | chainedCheckType.isRequired = checkType.bind(null, true);
3993 |
3994 | return chainedCheckType;
3995 | }
3996 |
3997 | function createPrimitiveTypeChecker(expectedType) {
3998 | function validate(props, propName, componentName, location, propFullName, secret) {
3999 | var propValue = props[propName];
4000 | var propType = getPropType(propValue);
4001 | if (propType !== expectedType) {
4002 | // `propValue` being instance of, say, date/regexp, pass the 'object'
4003 | // check, but we can offer a more precise error message here rather than
4004 | // 'of type `object`'.
4005 | var preciseType = getPreciseType(propValue);
4006 |
4007 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + preciseType + '` supplied to `' + componentName + '`, expected ') + ('`' + expectedType + '`.'));
4008 | }
4009 | return null;
4010 | }
4011 | return createChainableTypeChecker(validate);
4012 | }
4013 |
4014 | function createAnyTypeChecker() {
4015 | return createChainableTypeChecker(emptyFunction.thatReturnsNull);
4016 | }
4017 |
4018 | function createArrayOfTypeChecker(typeChecker) {
4019 | function validate(props, propName, componentName, location, propFullName) {
4020 | if (typeof typeChecker !== 'function') {
4021 | return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside arrayOf.');
4022 | }
4023 | var propValue = props[propName];
4024 | if (!Array.isArray(propValue)) {
4025 | var propType = getPropType(propValue);
4026 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an array.'));
4027 | }
4028 | for (var i = 0; i < propValue.length; i++) {
4029 | var error = typeChecker(propValue, i, componentName, location, propFullName + '[' + i + ']', ReactPropTypesSecret);
4030 | if (error instanceof Error) {
4031 | return error;
4032 | }
4033 | }
4034 | return null;
4035 | }
4036 | return createChainableTypeChecker(validate);
4037 | }
4038 |
4039 | function createElementTypeChecker() {
4040 | function validate(props, propName, componentName, location, propFullName) {
4041 | var propValue = props[propName];
4042 | if (!isValidElement(propValue)) {
4043 | var propType = getPropType(propValue);
4044 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected a single ReactElement.'));
4045 | }
4046 | return null;
4047 | }
4048 | return createChainableTypeChecker(validate);
4049 | }
4050 |
4051 | function createInstanceTypeChecker(expectedClass) {
4052 | function validate(props, propName, componentName, location, propFullName) {
4053 | if (!(props[propName] instanceof expectedClass)) {
4054 | var expectedClassName = expectedClass.name || ANONYMOUS;
4055 | var actualClassName = getClassName(props[propName]);
4056 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + actualClassName + '` supplied to `' + componentName + '`, expected ') + ('instance of `' + expectedClassName + '`.'));
4057 | }
4058 | return null;
4059 | }
4060 | return createChainableTypeChecker(validate);
4061 | }
4062 |
4063 | function createEnumTypeChecker(expectedValues) {
4064 | if (!Array.isArray(expectedValues)) {
4065 | "development" !== 'production' ? warning(false, 'Invalid argument supplied to oneOf, expected an instance of array.') : void 0;
4066 | return emptyFunction.thatReturnsNull;
4067 | }
4068 |
4069 | function validate(props, propName, componentName, location, propFullName) {
4070 | var propValue = props[propName];
4071 | for (var i = 0; i < expectedValues.length; i++) {
4072 | if (is(propValue, expectedValues[i])) {
4073 | return null;
4074 | }
4075 | }
4076 |
4077 | var valuesString = JSON.stringify(expectedValues);
4078 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of value `' + propValue + '` ' + ('supplied to `' + componentName + '`, expected one of ' + valuesString + '.'));
4079 | }
4080 | return createChainableTypeChecker(validate);
4081 | }
4082 |
4083 | function createObjectOfTypeChecker(typeChecker) {
4084 | function validate(props, propName, componentName, location, propFullName) {
4085 | if (typeof typeChecker !== 'function') {
4086 | return new PropTypeError('Property `' + propFullName + '` of component `' + componentName + '` has invalid PropType notation inside objectOf.');
4087 | }
4088 | var propValue = props[propName];
4089 | var propType = getPropType(propValue);
4090 | if (propType !== 'object') {
4091 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type ' + ('`' + propType + '` supplied to `' + componentName + '`, expected an object.'));
4092 | }
4093 | for (var key in propValue) {
4094 | if (propValue.hasOwnProperty(key)) {
4095 | var error = typeChecker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret);
4096 | if (error instanceof Error) {
4097 | return error;
4098 | }
4099 | }
4100 | }
4101 | return null;
4102 | }
4103 | return createChainableTypeChecker(validate);
4104 | }
4105 |
4106 | function createUnionTypeChecker(arrayOfTypeCheckers) {
4107 | if (!Array.isArray(arrayOfTypeCheckers)) {
4108 | "development" !== 'production' ? warning(false, 'Invalid argument supplied to oneOfType, expected an instance of array.') : void 0;
4109 | return emptyFunction.thatReturnsNull;
4110 | }
4111 |
4112 | for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
4113 | var checker = arrayOfTypeCheckers[i];
4114 | if (typeof checker !== 'function') {
4115 | warning(
4116 | false,
4117 | 'Invalid argument supplid to oneOfType. Expected an array of check functions, but ' +
4118 | 'received %s at index %s.',
4119 | getPostfixForTypeWarning(checker),
4120 | i
4121 | );
4122 | return emptyFunction.thatReturnsNull;
4123 | }
4124 | }
4125 |
4126 | function validate(props, propName, componentName, location, propFullName) {
4127 | for (var i = 0; i < arrayOfTypeCheckers.length; i++) {
4128 | var checker = arrayOfTypeCheckers[i];
4129 | if (checker(props, propName, componentName, location, propFullName, ReactPropTypesSecret) == null) {
4130 | return null;
4131 | }
4132 | }
4133 |
4134 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`.'));
4135 | }
4136 | return createChainableTypeChecker(validate);
4137 | }
4138 |
4139 | function createNodeChecker() {
4140 | function validate(props, propName, componentName, location, propFullName) {
4141 | if (!isNode(props[propName])) {
4142 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` supplied to ' + ('`' + componentName + '`, expected a ReactNode.'));
4143 | }
4144 | return null;
4145 | }
4146 | return createChainableTypeChecker(validate);
4147 | }
4148 |
4149 | function createShapeTypeChecker(shapeTypes) {
4150 | function validate(props, propName, componentName, location, propFullName) {
4151 | var propValue = props[propName];
4152 | var propType = getPropType(propValue);
4153 | if (propType !== 'object') {
4154 | return new PropTypeError('Invalid ' + location + ' `' + propFullName + '` of type `' + propType + '` ' + ('supplied to `' + componentName + '`, expected `object`.'));
4155 | }
4156 | for (var key in shapeTypes) {
4157 | var checker = shapeTypes[key];
4158 | if (!checker) {
4159 | continue;
4160 | }
4161 | var error = checker(propValue, key, componentName, location, propFullName + '.' + key, ReactPropTypesSecret);
4162 | if (error) {
4163 | return error;
4164 | }
4165 | }
4166 | return null;
4167 | }
4168 | return createChainableTypeChecker(validate);
4169 | }
4170 |
4171 | function isNode(propValue) {
4172 | switch (typeof propValue) {
4173 | case 'number':
4174 | case 'string':
4175 | case 'undefined':
4176 | return true;
4177 | case 'boolean':
4178 | return !propValue;
4179 | case 'object':
4180 | if (Array.isArray(propValue)) {
4181 | return propValue.every(isNode);
4182 | }
4183 | if (propValue === null || isValidElement(propValue)) {
4184 | return true;
4185 | }
4186 |
4187 | var iteratorFn = getIteratorFn(propValue);
4188 | if (iteratorFn) {
4189 | var iterator = iteratorFn.call(propValue);
4190 | var step;
4191 | if (iteratorFn !== propValue.entries) {
4192 | while (!(step = iterator.next()).done) {
4193 | if (!isNode(step.value)) {
4194 | return false;
4195 | }
4196 | }
4197 | } else {
4198 | // Iterator will provide entry [k,v] tuples rather than values.
4199 | while (!(step = iterator.next()).done) {
4200 | var entry = step.value;
4201 | if (entry) {
4202 | if (!isNode(entry[1])) {
4203 | return false;
4204 | }
4205 | }
4206 | }
4207 | }
4208 | } else {
4209 | return false;
4210 | }
4211 |
4212 | return true;
4213 | default:
4214 | return false;
4215 | }
4216 | }
4217 |
4218 | function isSymbol(propType, propValue) {
4219 | // Native Symbol.
4220 | if (propType === 'symbol') {
4221 | return true;
4222 | }
4223 |
4224 | // 19.4.3.5 Symbol.prototype[@@toStringTag] === 'Symbol'
4225 | if (propValue['@@toStringTag'] === 'Symbol') {
4226 | return true;
4227 | }
4228 |
4229 | // Fallback for non-spec compliant Symbols which are polyfilled.
4230 | if (typeof Symbol === 'function' && propValue instanceof Symbol) {
4231 | return true;
4232 | }
4233 |
4234 | return false;
4235 | }
4236 |
4237 | // Equivalent of `typeof` but with special handling for array and regexp.
4238 | function getPropType(propValue) {
4239 | var propType = typeof propValue;
4240 | if (Array.isArray(propValue)) {
4241 | return 'array';
4242 | }
4243 | if (propValue instanceof RegExp) {
4244 | // Old webkits (at least until Android 4.0) return 'function' rather than
4245 | // 'object' for typeof a RegExp. We'll normalize this here so that /bla/
4246 | // passes PropTypes.object.
4247 | return 'object';
4248 | }
4249 | if (isSymbol(propType, propValue)) {
4250 | return 'symbol';
4251 | }
4252 | return propType;
4253 | }
4254 |
4255 | // This handles more types than `getPropType`. Only used for error messages.
4256 | // See `createPrimitiveTypeChecker`.
4257 | function getPreciseType(propValue) {
4258 | if (typeof propValue === 'undefined' || propValue === null) {
4259 | return '' + propValue;
4260 | }
4261 | var propType = getPropType(propValue);
4262 | if (propType === 'object') {
4263 | if (propValue instanceof Date) {
4264 | return 'date';
4265 | } else if (propValue instanceof RegExp) {
4266 | return 'regexp';
4267 | }
4268 | }
4269 | return propType;
4270 | }
4271 |
4272 | // Returns a string that is postfixed to a warning about an invalid type.
4273 | // For example, "undefined" or "of type array"
4274 | function getPostfixForTypeWarning(value) {
4275 | var type = getPreciseType(value);
4276 | switch (type) {
4277 | case 'array':
4278 | case 'object':
4279 | return 'an ' + type;
4280 | case 'boolean':
4281 | case 'date':
4282 | case 'regexp':
4283 | return 'a ' + type;
4284 | default:
4285 | return type;
4286 | }
4287 | }
4288 |
4289 | // Returns class name of the object, if any.
4290 | function getClassName(propValue) {
4291 | if (!propValue.constructor || !propValue.constructor.name) {
4292 | return ANONYMOUS;
4293 | }
4294 | return propValue.constructor.name;
4295 | }
4296 |
4297 | ReactPropTypes.checkPropTypes = checkPropTypes;
4298 | ReactPropTypes.PropTypes = ReactPropTypes;
4299 |
4300 | return ReactPropTypes;
4301 | };
4302 |
4303 | },{"28":28,"30":30,"31":31,"33":33,"36":36}],36:[function(_dereq_,module,exports){
4304 | /**
4305 | * Copyright 2013-present, Facebook, Inc.
4306 | * All rights reserved.
4307 | *
4308 | * This source code is licensed under the BSD-style license found in the
4309 | * LICENSE file in the root directory of this source tree. An additional grant
4310 | * of patent rights can be found in the PATENTS file in the same directory.
4311 | */
4312 |
4313 | 'use strict';
4314 |
4315 | var ReactPropTypesSecret = 'SECRET_DO_NOT_PASS_THIS_OR_YOU_WILL_BE_FIRED';
4316 |
4317 | module.exports = ReactPropTypesSecret;
4318 |
4319 | },{}]},{},[16])(16)
4320 | });
--------------------------------------------------------------------------------
/lifeCycle.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Document
8 |
9 |
10 |
11 |
12 |
13 |
14 |
15 |
16 |
95 |
96 |
--------------------------------------------------------------------------------
/readme.md:
--------------------------------------------------------------------------------
1 | # react 核心知识
2 |
3 | 1. jsx语法，类似于html。它的实质是：React.createElement(type,attr,children)的语法糖。
4 |
5 | 2. 创建react component的方式：function 或者 class（ES6）。推荐使用class方式。
6 |
7 | * 如果不用es6的class可以使用：
8 |
9 | React.createClass({
10 |
11 | render(){
12 |
13 | }
14 |
15 | })
16 |
17 | * this问题
18 |
19 | 使用ES6的class去创建组件，需要把在jsx上调用的函数bind(this)，或者直接使用箭头函数。
20 |
21 | 3. ReactDOM.render()：用于把react创建的虚拟dom渲染到浏览器中。
22 |
23 | 4. props是由组件外界传到组件内部的属性或者方法，在组建内部不建议修改props的值。属性props值可以是字符串、变量、表达式、函数，放在插值表达式{}中;
24 |
25 | state是组件本身所具有的属性或者方法, 改变state使用setState(),只有通过setState才能触发react视图更新,这个方法和其他生命周期一样都继承自React.component;
26 |
27 | * *已经有props为何还要state？ react理念，保持数据流的单一性，在组件内部不能直接修改传入的props，为构建大型项目做基础*
28 |
29 | 纯函数和非纯函数：
30 |
31 | function test(a,b){//纯：入参是只读的
32 | return a+b
33 | }
34 |
35 | function test(a,b){//非纯：函数内部修改了入参
36 | a = 1;
37 | return a+b
38 | }
39 |
40 | + *当你想要实现继承时，不妨试试组件拼装。使用props.children实现组件拼装，类似于vue的slot插槽*
41 |
42 | 5. 事件绑定要用驼峰写法 onClick onInput ...
43 |
44 | 6. 样式设置，在react中以对象的形式设置样式，驼峰命名法，赋值给组件元素的style属性即可
45 |
46 | 7. 生命周期
47 |
48 | * ES6 Class创建的component
49 |
50 | 创建期
51 |
52 | componentWillMount
53 | componentDidMount
54 |
55 | 存在期
56 |
57 | componentWillReceiveProps
58 | shouldComponentUpdate(必须返回值),
59 | componentWillUpdate,
60 | dom rerender,
61 | componentDidUpdate
62 |
63 | 销毁期
64 |
65 | componentWillUnmount
66 |
67 | * React.createClass({})创建的component
68 |
69 | 创建期
70 |
71 | getDefaultProps
72 | getInitialState
73 | componentWillMount
74 | componentDidMount
75 |
76 | 存在期
77 |
78 | componentWillReceiveProps
79 | shouldComponentUpdate
80 | componentWillUpdate
81 | componentDidUpdate
82 |
83 | 销毁期
84 |
85 | componentWillUnmount
86 |
87 | * *注意：一定不要在componentWillUpdate或者componentDidUpdate这样的生命周期中去执行setState()操作，会导致闭环。*
88 |
89 | * **React生命周期图示( *This image was created by liqin ci.* )：**
90 |
91 | 
92 |
93 |
94 |
95 | 8.
96 | 列表循环：在插值表达式{}中放数组，数组中放子组件即可;
97 |
98 | 数据请求：在componentDidMount生命周期钩子中进行ajax请求；也可以在外面完成数据请求之后调用ReactDOM.render()
99 |
100 | 9.
101 | 父=>子： props 单项数据流
102 |
103 | 子=>子： 状态提升 子组件的状态提升到共有父state中
104 |
105 | 10. ref属性存放指定的实际dom元素，在componentDidMount时执行，也就是说在组件mount之前ref是拿不到的。如果ref属性定义在实例组件上，它将会存放组件的实例，一般可以通过this.refs.[ref属性值].[方法名]来调用实例的方法。另外ref的值也可以是function(target){}，target存放实际dom或者组件实例。
106 |
107 | 11. react中将字符串作为innerHTML的值输出使用dangerouslySetInnerHTML属性，它的值是一个拥有'__html'属性的对象：
108 |
109 | {
110 | __html:'html字符串'
111 | }
112 |
113 | __html用来配置将要输出的具体内容
114 |
115 | 12. 类型检查typechecking
116 |
117 | 传入react组件的参数，在定义的时候可以指定类型，如果使用者未传入指定类型react会抛出warning（注意warning不是报错），这个类似于vue组件传值props为object时的用法，不过react更强大更全面。参考文档
118 |
119 | 下面列举几个较为基本的类型检查：
120 |
121 |
122 | import PropTypes from 'prop-types'（react15.5版本以后propTypes从react中提出来成为单独的包，通过npm下载）;
123 |
124 | MyComponent.propTypes = {
125 |
126 | optionalArray: PropTypes.array,//限制类型为数组
127 | optionalBool: PropTypes.bool,//限制类型为布尔值
128 | optionalFunc: PropTypes.func,//限制类型为function
129 | optionalNumber: PropTypes.number,//限制类型为数字
130 | optionalObject: PropTypes.object,//限制类型为对象
131 | optionalString: PropTypes.string,//限制类型为字符串
132 | optionalNode: PropTypes.node,//限制类型为DOM元素
133 | optionalElement: PropTypes.element,//限制类型为react组件元素
134 | optionalEnum: PropTypes.oneOf(['News', 'Photos'])//限制值为'News'或'Photos'
135 | }
136 |
137 |
138 | ##### 今朝有酒今朝醉
139 |
--------------------------------------------------------------------------------
/rotate.html:
--------------------------------------------------------------------------------
1 |
2 |
3 |
4 |
5 |
6 |
7 | Document
8 |
44 |
45 |
46 |
47 |
48 |
49 |
50 |
51 |
52 |
163 |
164 |
--------------------------------------------------------------------------------