react-rails 2.6.1 → 2.7.0.rc.0

data/lib/assets/javascripts/react_ujs.js

@@ -1,13 +1,13 @@
 (function webpackUniversalModuleDefinition(root, factory) {
 	if(typeof exports === 'object' && typeof module === 'object')
-		module.exports = factory(require("react"), require("react-dom"), require("react-dom/server"));
+		module.exports = factory(require("react-dom"), require("react"), require("react-dom/server"));
 	else if(typeof define === 'function' && define.amd)
-		define(["react", "react-dom", "react-dom/server"], factory);
+		define(["react-dom", "react", "react-dom/server"], factory);
 	else if(typeof exports === 'object')
-		exports["ReactRailsUJS"] = factory(require("react"), require("react-dom"), require("react-dom/server"));
+		exports["ReactRailsUJS"] = factory(require("react-dom"), require("react"), require("react-dom/server"));
 	else
-		root["ReactRailsUJS"] = factory(root["React"], root["ReactDOM"], root["ReactDOMServer"]);
-})(this, function(__WEBPACK_EXTERNAL_MODULE_3__, __WEBPACK_EXTERNAL_MODULE_4__, __WEBPACK_EXTERNAL_MODULE_5__) {
+		root["ReactRailsUJS"] = factory(root["ReactDOM"], root["React"], root["ReactDOMServer"]);
+})(this, function(__WEBPACK_EXTERNAL_MODULE_2__, __WEBPACK_EXTERNAL_MODULE_6__, __WEBPACK_EXTERNAL_MODULE_7__) {
 return /******/ (function(modules) { // webpackBootstrap
 /******/ 	// The module cache
 /******/ 	var installedModules = {};
@@ -73,7 +73,7 @@ return /******/ (function(modules) { // webpackBootstrap
 /******/ 	__webpack_require__.p = "";
 /******/
 /******/ 	// Load entry module and return exports
-/******/ 	return __webpack_require__(__webpack_require__.s = 6);
+/******/ 	return __webpack_require__(__webpack_require__.s = 8);
 /******/ })
 /************************************************************************/
 /******/ ([
@@ -106,13 +106,49 @@ module.exports = function(className) {
 
 /***/ }),
 /* 1 */
+/***/ (function(module, exports) {
+
+// Load React components by requiring them from "components/", for example:
+//
+// - "pages/index" -> `require("components/pages/index")`
+// - "pages/show.Header" -> `require("components/pages/show").Header`
+// - "pages/show.Body.Content" -> `require("components/pages/show").Body.Content`
+//
+module.exports = function(reqctx) {
+  return function(className) {
+    var parts = className.split(".")
+    var filename = parts.shift()
+    var keys = parts
+    // Load the module:
+    var component = reqctx("./" + filename)
+    // Then access each key:
+    keys.forEach(function(k) {
+      component = component[k]
+    })
+    // support `export default`
+    if (component.__esModule) {
+      component = component["default"]
+    }
+    return component
+  }
+}
+
+
+/***/ }),
+/* 2 */
+/***/ (function(module, exports) {
+
+module.exports = __WEBPACK_EXTERNAL_MODULE_2__;
+
+/***/ }),
+/* 3 */
 /***/ (function(module, exports, __webpack_require__) {
 
-var nativeEvents = __webpack_require__(7)
-var pjaxEvents = __webpack_require__(8)
-var turbolinksEvents = __webpack_require__(9)
-var turbolinksClassicDeprecatedEvents = __webpack_require__(11)
-var turbolinksClassicEvents = __webpack_require__(10)
+var nativeEvents = __webpack_require__(9)
+var pjaxEvents = __webpack_require__(10)
+var turbolinksEvents = __webpack_require__(11)
+var turbolinksClassicDeprecatedEvents = __webpack_require__(13)
+var turbolinksClassicEvents = __webpack_require__(12)
 
 // see what things are globally available
 // and setup event handlers to those things
@@ -164,14 +200,14 @@ module.exports = function(ujs) {
 
 
 /***/ }),
-/* 2 */
+/* 4 */
 /***/ (function(module, exports, __webpack_require__) {
 
 // Make a function which:
 // - First tries to require the name
 // - Then falls back to global lookup
 var fromGlobal = __webpack_require__(0)
-var fromRequireContext = __webpack_require__(12)
+var fromRequireContext = __webpack_require__(1)
 
 module.exports = function(reqctx) {
   var fromCtx = fromRequireContext(reqctx)
@@ -195,34 +231,67 @@ module.exports = function(reqctx) {
 
 
 /***/ }),
-/* 3 */
-/***/ (function(module, exports) {
+/* 5 */
+/***/ (function(module, __webpack_exports__, __webpack_require__) {
+
+"use strict";
+Object.defineProperty(__webpack_exports__, "__esModule", { value: true });
+/* harmony export (immutable) */ __webpack_exports__["supportsHydration"] = supportsHydration;
+/* harmony export (immutable) */ __webpack_exports__["reactHydrate"] = reactHydrate;
+/* harmony export (immutable) */ __webpack_exports__["createReactRootLike"] = createReactRootLike;
+const ReactDOM = __webpack_require__(2)
+
+function supportsHydration() {
+  return typeof ReactDOM.hydrate === "function" || typeof ReactDOM.hydrateRoot === "function"
+}
+
+function reactHydrate(node, component) {
+  if (typeof ReactDOM.hydrateRoot === "function") {
+    return ReactDOM.hydrateRoot(node, component)
+  } else {
+    return ReactDOM.hydrate(component, node)
+  }
+}
+
+function createReactRootLike(node) {
+  return ReactDOM.createRoot ? ReactDOM.createRoot(node) : legacyReactRootLike(node)
+}
+
+function legacyReactRootLike(node) {
+  const root = {
+    render(component) {
+      return ReactDOM.render(component, node)
+    }
+  }
+  return root
+}
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_3__;
 
 /***/ }),
-/* 4 */
+/* 6 */
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_4__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_6__;
 
 /***/ }),
-/* 5 */
+/* 7 */
 /***/ (function(module, exports) {
 
-module.exports = __WEBPACK_EXTERNAL_MODULE_5__;
+module.exports = __WEBPACK_EXTERNAL_MODULE_7__;
 
 /***/ }),
-/* 6 */
+/* 8 */
 /***/ (function(module, exports, __webpack_require__) {
 
-var React = __webpack_require__(3)
-var ReactDOM = __webpack_require__(4)
-var ReactDOMServer = __webpack_require__(5)
+var React = __webpack_require__(6)
+var ReactDOM = __webpack_require__(2)
+var ReactDOMServer = __webpack_require__(7)
 
-var detectEvents = __webpack_require__(1)
+var detectEvents = __webpack_require__(3)
 var constructorFromGlobal = __webpack_require__(0)
-var constructorFromRequireContextWithGlobalFallback = __webpack_require__(2)
+var constructorFromRequireContext = __webpack_require__(1)
+var constructorFromRequireContextWithGlobalFallback = __webpack_require__(4)
+const { supportsHydration, reactHydrate, createReactRootLike } = __webpack_require__(5)
 
 var ReactRailsUJS = {
   // This attribute holds the name of component which should be mounted
@@ -283,6 +352,11 @@ var ReactRailsUJS = {
   // the default is ReactRailsUJS.ComponentGlobal
   getConstructor: constructorFromGlobal,
 
+  // Available for customizing `getConstructor`
+  constructorFromGlobal: constructorFromGlobal,
+  constructorFromRequireContext: constructorFromRequireContext,
+  constructorFromRequireContextWithGlobalFallback: constructorFromRequireContextWithGlobalFallback,
+
   // Given a Webpack `require.context`,
   // try finding components with `require`,
   // then falling back to global lookup.
@@ -329,13 +403,14 @@ var ReactRailsUJS = {
           }
         }
 
-        if (hydrate && typeof ReactDOM.hydrate === "function") {
-          component = ReactDOM.hydrate(component, node);
+        if (hydrate && supportsHydration()) {
+          component = reactHydrate(node, component);
         } else {
-          component = ReactDOM.render(component, node);
+          const root = createReactRootLike(node)
+          component = root.render(component);
         }
       }
-    } 
+    }
   },
 
   // Within `searchSelector`, find nodes which have React components
@@ -356,6 +431,7 @@ var ReactRailsUJS = {
   detectEvents: function() {
     detectEvents(this)
   },
+
 }
 
 // These stable references are so that handlers can be added and removed:
@@ -390,7 +466,7 @@ module.exports = ReactRailsUJS
 
 
 /***/ }),
-/* 7 */
+/* 9 */
 /***/ (function(module, exports) {
 
 module.exports = {
@@ -413,7 +489,7 @@ module.exports = {
 
 
 /***/ }),
-/* 8 */
+/* 10 */
 /***/ (function(module, exports) {
 
 module.exports = {
@@ -433,25 +509,23 @@ module.exports = {
 
 
 /***/ }),
-/* 9 */
+/* 11 */
 /***/ (function(module, exports) {
 
 module.exports = {
   // Turbolinks 5+ got rid of named events (?!)
   setup: function(ujs) {
   	ujs.handleEvent('turbolinks:load', ujs.handleMount);
-    ujs.handleEvent('turbolinks:before-render', ujs.handleUnmount);
   },
 
   teardown: function(ujs) {
   	ujs.removeEvent('turbolinks:load', ujs.handleMount);
-    ujs.removeEvent('turbolinks:before-render', ujs.handleUnmount);
   },
 }
 
 
 /***/ }),
-/* 10 */
+/* 12 */
 /***/ (function(module, exports) {
 
 module.exports = {
@@ -469,7 +543,7 @@ module.exports = {
 
 
 /***/ }),
-/* 11 */
+/* 13 */
 /***/ (function(module, exports) {
 
 module.exports = {
@@ -489,36 +563,6 @@ module.exports = {
 }
 
 
-/***/ }),
-/* 12 */
-/***/ (function(module, exports) {
-
-// Load React components by requiring them from "components/", for example:
-//
-// - "pages/index" -> `require("components/pages/index")`
-// - "pages/show.Header" -> `require("components/pages/show").Header`
-// - "pages/show.Body.Content" -> `require("components/pages/show").Body.Content`
-//
-module.exports = function(reqctx) {
-  return function(className) {
-    var parts = className.split(".")
-    var filename = parts.shift()
-    var keys = parts
-    // Load the module:
-    var component = reqctx("./" + filename)
-    // Then access each key:
-    keys.forEach(function(k) {
-      component = component[k]
-    })
-    // support `export default`
-    if (component.__esModule) {
-      component = component["default"]
-    }
-    return component
-  }
-}
-
-
 /***/ })
 /******/ ]);
 });