isomorfeus-react 16.13.9 → 16.13.12

data/lib/react/component/features.rb

@@ -1,48 +1,48 @@
-module React
-  module Component
-    module Features
-      def Fragment(*args, &block)
-        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Fragment, args, block)`
-      end
-
-      def Portal(element_or_query, &block)
-        if `(typeof element_or_query === 'string')` || (`(typeof element_or_query.$class === 'function')` && element_or_query.class == String)
-          element = `document.body.querySelector(element_or_query)`
-        elsif `(typeof element_or_query.$is_a === 'function')` && element_or_query.is_a?(Browser::Element)
-          element = element_or_query.to_n
-        else
-          element = element_or_query
-        end
-        %x{
-          let operabu = Opal.React.render_buffer;
-          operabu.push([]);
-          // console.log("portal pushed", operabu, operabu.toString());
-          if (block !== nil) {
-            let block_result = block.$call()
-            let last_buffer_length = operabu[operabu.length - 1].length;
-            let last_buffer_element = operabu[operabu.length - 1][last_buffer_length - 1];
-            if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
-          }
-          // console.log("portal popping", operabu, operabu.toString());
-          let result = operabu.pop();
-          if (result.length === 1) { result = result[0]; }
-          var react_element = Opal.global.React.createPortal(result, element);
-          operabu[operabu.length - 1].push(react_element);
-          // console.log("portal pushed", operabu, operabu.toString());
-        }
-      end
-
-      def Profiler(*args, &block)
-        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Profiler, args, block)`
-      end
-
-      def StrictMode(*args, &block)
-        `Opal.React.internal_prepare_args_and_render(Opal.global.React.StrictMode, args, block)`
-      end
-
-      def Suspense(*args, &block)
-        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Suspense, args, block)`
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Features
+      def Fragment(*args, &block)
+        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Fragment, args, block)`
+      end
+
+      def Portal(element_or_query, &block)
+        if `(typeof element_or_query === 'string')` || (`(typeof element_or_query.$class === 'function')` && element_or_query.class == String)
+          element = `document.body.querySelector(element_or_query)`
+        elsif `(typeof element_or_query.$is_a === 'function')` && element_or_query.is_a?(Browser::Element)
+          element = element_or_query.to_n
+        else
+          element = element_or_query
+        end
+        %x{
+          let operabu = Opal.React.render_buffer;
+          operabu.push([]);
+          // console.log("portal pushed", operabu, operabu.toString());
+          if (block !== nil) {
+            let block_result = block.$call()
+            let last_buffer_length = operabu[operabu.length - 1].length;
+            let last_buffer_element = operabu[operabu.length - 1][last_buffer_length - 1];
+            if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
+          }
+          // console.log("portal popping", operabu, operabu.toString());
+          let result = operabu.pop();
+          if (result.length === 1) { result = result[0]; }
+          var react_element = Opal.global.React.createPortal(result, element);
+          operabu[operabu.length - 1].push(react_element);
+          // console.log("portal pushed", operabu, operabu.toString());
+        }
+      end
+
+      def Profiler(*args, &block)
+        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Profiler, args, block)`
+      end
+
+      def StrictMode(*args, &block)
+        `Opal.React.internal_prepare_args_and_render(Opal.global.React.StrictMode, args, block)`
+      end
+
+      def Suspense(*args, &block)
+        `Opal.React.internal_prepare_args_and_render(Opal.global.React.Suspense, args, block)`
+      end
+    end
+  end
+end

data/lib/react/component/history.rb

@@ -1,65 +1,69 @@
-module React
-  module Component
-    class History
-      include ::Native::Wrapper
-
-      def block(prompt)
-        @native.JS[:props].JS[:history].JS.block(prompt)
-      end
-
-      def create_href(location)
-        @native.JS[:props].JS[:history].JS.createHref(location)
-      end
-
-      def go(n)
-        @native.JS[:props].JS[:history].JS.go(n)
-      end
-
-      def go_back
-        @native.JS[:props].JS[:history].JS.goBack()
-      end
-
-      def go_forward
-        @native.JS[:props].JS[:history].JS.goForward()
-      end
-
-      def push(*args)
-        @native.JS[:props].JS[:history].JS.push(*args)
-      end
-
-      def replace(*args)
-        @native.JS[:props].JS[:history].JS.replace(*args)
-      end
-
-      def method_missing(prop, *args, &block)
-        @native.JS[:props].JS[:history].JS[prop]
-      end
-
-      def listen(&block)
-        fun = nil
-        %x{
-          fun = function(location, action) {
-            let ruby_location = #{React::Component::Location.new(`{ props: { location: location }}`)}
-            block.$call(ruby_location, action);
-          }
-        }
-        unlisten = @native.JS[:props].JS[:history].JS.listen(fun)
-        -> { unlisten.JS.call() }
-      end
-
-      def location
-        return @location if @location
-        return nil unless @native.JS[:props].JS[:history].JS[:location]
-        if @native.JS[:props].JS[:history].JS[:location].JS[:pathname]
-          @location = React::Component::Location.new(@native)
-        else
-          @native.JS[:props].JS[:history].JS[:location]
-        end
-      end
-
-      def to_n
-        @native.JS[:props].JS[:history]
-      end
-    end
-  end
-end
+module React
+  module Component
+    class History
+      include ::Native::Wrapper
+
+      def initialize(native)
+        @native = native
+      end
+      
+      def block(prompt)
+        @native.JS[:props].JS[:history].JS.block(prompt)
+      end
+
+      def create_href(location)
+        @native.JS[:props].JS[:history].JS.createHref(location)
+      end
+
+      def go(n)
+        @native.JS[:props].JS[:history].JS.go(n)
+      end
+
+      def go_back
+        @native.JS[:props].JS[:history].JS.goBack()
+      end
+
+      def go_forward
+        @native.JS[:props].JS[:history].JS.goForward()
+      end
+
+      def push(*args)
+        @native.JS[:props].JS[:history].JS.push(*args)
+      end
+
+      def replace(*args)
+        @native.JS[:props].JS[:history].JS.replace(*args)
+      end
+
+      def method_missing(prop, *args, &block)
+        @native.JS[:props].JS[:history].JS[prop]
+      end
+
+      def listen(&block)
+        fun = nil
+        %x{
+          fun = function(location, action) {
+            let ruby_location = #{React::Component::Location.new(`{ props: { location: location }}`)}
+            block.$call(ruby_location, action);
+          }
+        }
+        unlisten = @native.JS[:props].JS[:history].JS.listen(fun)
+        -> { unlisten.JS.call() }
+      end
+
+      def location
+        return @location if @location
+        return nil unless @native.JS[:props].JS[:history].JS[:location]
+        if @native.JS[:props].JS[:history].JS[:location].JS[:pathname]
+          @location = React::Component::Location.new(@native)
+        else
+          @native.JS[:props].JS[:history].JS[:location]
+        end
+      end
+
+      def to_n
+        @native.JS[:props].JS[:history]
+      end
+    end
+  end
+end

data/lib/react/component/initializer.rb

@@ -1,11 +1,11 @@
-module React
-  module Component
-    module Initializer
-      def initialize(native_component)
-        @native = native_component
-        @props = `Opal.React.Component.Props.$new(#@native)`
-        @state = `Opal.React.Component.State.$new(#@native)`
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Initializer
+      def initialize(native_component)
+        @native = native_component
+        @props = `Opal.React.Component.Props.$new(#@native)`
+        @state = `Opal.React.Component.State.$new(#@native)`
+      end
+    end
+  end
+end

data/lib/react/component/location.rb

@@ -1,15 +1,19 @@
-module React
-  module Component
-    class Location
-      include ::Native::Wrapper
-
-      def method_missing(prop, *args, &block)
-        @native.JS[:props].JS[:location].JS[prop]
-      end
-
-      def to_n
-        @native
-      end
-    end
-  end
-end
+module React
+  module Component
+    class Location
+      include ::Native::Wrapper
+
+      def initialize(native)
+        @native = native
+      end
+      
+      def method_missing(prop, *args, &block)
+        @native.JS[:props].JS[:location].JS[prop]
+      end
+
+      def to_n
+        @native
+      end
+    end
+  end
+end

data/lib/react/component/match.rb

@@ -1,31 +1,35 @@
-module React
-  module Component
-    class Match
-      include ::Native::Wrapper
-
-      def method_missing(prop, *args, &block)
-        @native.JS[:props].JS[:match].JS[:params].JS[prop]
-      end
-
-      def is_exact
-        @native.JS[:props].JS[:match].JS[:isExact]
-      end
-
-      def params
-        self
-      end
-
-      def path
-        @native.JS[:props].JS[:match].JS[:path]
-      end
-
-      def url
-        @native.JS[:props].JS[:match].JS[:url]
-      end
-
-      def to_n
-        @native.JS[:props].JS[:match]
-      end
-    end
-  end
-end
+module React
+  module Component
+    class Match
+      include ::Native::Wrapper
+
+      def initialize(native)
+        @native = native
+      end
+
+      def method_missing(prop, *args, &block)
+        @native.JS[:props].JS[:match].JS[:params].JS[prop]
+      end
+
+      def is_exact
+        @native.JS[:props].JS[:match].JS[:isExact]
+      end
+
+      def params
+        self
+      end
+
+      def path
+        @native.JS[:props].JS[:match].JS[:path]
+      end
+
+      def url
+        @native.JS[:props].JS[:match].JS[:url]
+      end
+
+      def to_n
+        @native.JS[:props].JS[:match]
+      end
+    end
+  end
+end

data/lib/react/component/mixin.rb

@@ -1,20 +1,20 @@
-module React
-  module Component
-    module Mixin
-      def self.included(base)
-        base.include(::Native::Wrapper)
-        base.extend(::React::Component::NativeComponentConstructor)
-        base.extend(::LucidPropDeclaration::Mixin)
-        if on_browser? || on_ssr?
-          base.include(::React::Component::Elements)
-        elsif on_mobile?
-          base.include(::ReactNative::Component::Elements)
-        end
-        base.include(::React::Component::Api)
-        base.include(::React::Component::Callbacks)
-        base.include(::React::Component::Initializer)
-        base.include(::React::Component::Features)
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Mixin
+      def self.included(base)
+        base.include(::Native::Wrapper)
+        base.extend(::React::Component::NativeComponentConstructor)
+        base.extend(::LucidPropDeclaration::Mixin)
+        if on_browser? || on_ssr?
+          base.include(::React::Component::Elements)
+        elsif on_mobile?
+          base.include(::ReactNative::Component::Elements)
+        end
+        base.include(::React::Component::Api)
+        base.include(::React::Component::Callbacks)
+        base.include(::React::Component::Initializer)
+        base.include(::React::Component::Features)
+      end
+    end
+  end
+end

data/lib/react/component/native_component_constructor.rb

@@ -1,95 +1,69 @@
-module React
-  module Component
-    module NativeComponentConstructor
-      # for should_component_update we apply ruby semantics for comparing props
-      # to do so, we convert the props to ruby hashes and then compare
-      # this makes sure, that for example rubys Nil object gets handled properly
-      def self.extended(base)
-        component_name = base.to_s
-        # language=JS
-        %x{
-          base.react_component = class extends Opal.global.React.Component {
-            constructor(props) {
-              super(props);
-              if (base.$default_state_defined()) {
-                this.state = base.$state().$to_n();
-              } else {
-                this.state = {};
-              };
-              this.__ruby_instance = base.$new(this);
-              var defined_refs = #{base.defined_refs};
-              for (var ref in defined_refs) {
-                if (defined_refs[ref] != null) {
-                  this[ref] = function(element) {
-                    element = Opal.React.native_element_or_component_to_ruby(element);
-                    #{`this.__ruby_instance`.instance_exec(`element`, &`defined_refs[ref]`)}
-                  }
-                  this[ref] = this[ref].bind(this);
-                } else {
-                  this[ref] = Opal.global.React.createRef();
-                }
-              }
-            }
-            static get displayName() {
-              return #{component_name};
-            }
-            static set displayName(new_name) {
-              // dont do anything here except returning the set value
-              return new_name;
-            }
-            render() {
-              const oper = Opal.React;
-              oper.render_buffer.push([]);
-              // console.log("react component pushed", oper.render_buffer, oper.render_buffer.toString());
-              oper.active_components.push(this);
-              let block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)};
-              if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
-              // console.log("react component popping", oper.render_buffer, oper.render_buffer.toString());
-              oper.active_components.pop();
-              let result = oper.render_buffer.pop();
-              return (result.length === 1) ? result[0] : result;
-            }
-            shouldComponentUpdate(next_props, next_state) {
-              if (base.should_component_update_block) {
-                return #{!!`this.__ruby_instance`.instance_exec(React::Component::Props.new(`{props: next_props}`), React::Component::State.new(`{state: next_state }`), &`base.should_component_update_block`)};
-              }
-              let counter = 0;
-              const this_props = this.props;
-              for (var property in next_props) {
-                counter++;
-                if (next_props.hasOwnProperty(property)) {
-                  if (!this_props.hasOwnProperty(property)) { return true; };
-                  if (property === "children") { if (next_props.children !== this_props.children) { return true; }}
-                  else if (typeof next_props[property] === "object" && next_props[property] !== null && typeof next_props[property]['$!='] === "function" &&
-                           typeof this_props[property] !== "undefined" && this_props[property] !== null ) {
-                    if (#{ !! (`next_props[property]` != `this_props[property]`) }) { return true; }
-                  } else if (next_props[property] !== this_props[property]) { return true; }
-                }
-              }
-              if (counter !== Object.keys(this_props).length) { return true; }
-              counter = 0;
-              const this_state = this.state;
-              for (var property in next_state) {
-                counter++;
-                if (next_state.hasOwnProperty(property)) {
-                  if (!this_state.hasOwnProperty(property)) { return true; };
-                  if (typeof next_state[property] === "object" && next_state[property] !== null && typeof next_state[property]['$!='] === "function" &&
-                      typeof this_state[property] !== "undefined" && this_state[property] !== null) {
-                    if (#{ !! (`next_state[property]` != `this_state[property]`) }) { return true }
-                  } else if (next_state[property] !== this_state[property]) { return true }
-                }
-              }
-              if (counter !== Object.keys(this_state).length) { return true; }
-              return false;
-            }
-            validateProp(props, propName, componentName) {
-              try { base.$validate_prop(propName, props[propName]) }
-              catch (e) { return new Error(componentName + " Error: prop validation failed: " + e.message); }
-              return null;
-            }
-          }
-        }
-      end
-    end
-  end
-end
+module React
+  module Component
+    module NativeComponentConstructor
+      # for should_component_update we apply ruby semantics for comparing props
+      # to do so, we convert the props to ruby hashes and then compare
+      # this makes sure, that for example rubys Nil object gets handled properly
+      def self.extended(base)
+        component_name = base.to_s
+        %x{
+          base.react_component = class extends Opal.global.React.Component {
+            constructor(props) {
+              super(props);
+              if (base.$default_state_defined()) {
+                this.state = base.$state().$to_n();
+              } else {
+                this.state = {};
+              };
+              this.__ruby_instance = base.$new(this);
+              var defined_refs = #{base.defined_refs};
+              for (var ref in defined_refs) {
+                if (defined_refs[ref] != null) {
+                  this[ref] = function(element) {
+                    element = Opal.React.native_element_or_component_to_ruby(element);
+                    #{`this.__ruby_instance`.instance_exec(`element`, &`defined_refs[ref]`)}
+                  }
+                  this[ref] = this[ref].bind(this);
+                } else {
+                  this[ref] = Opal.global.React.createRef();
+                }
+              }
+            }
+            static get displayName() {
+              return #{component_name};
+            }
+            static set displayName(new_name) {
+              // dont do anything here except returning the set value
+              return new_name;
+            }
+            render() {
+              const oper = Opal.React;
+              oper.render_buffer.push([]);
+              // console.log("react component pushed", oper.render_buffer, oper.render_buffer.toString());
+              oper.active_components.push(this);
+              let block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)};
+              if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
+              // console.log("react component popping", oper.render_buffer, oper.render_buffer.toString());
+              oper.active_components.pop();
+              let result = oper.render_buffer.pop();
+              return (result.length === 1) ? result[0] : result;
+            }
+            shouldComponentUpdate(next_props, next_state) {
+              if (base.should_component_update_block) {
+                return #{!!`this.__ruby_instance`.instance_exec(React::Component::Props.new(`{props: next_props}`), React::Component::State.new(`{state: next_state }`), &`base.should_component_update_block`)};
+              }
+              if (!Opal.React.props_are_equal(this.props, next_props)) { return true; }
+              if (Opal.React.state_is_not_equal(this.state, next_state)) { return true; }
+              return false;
+            }
+            validateProp(props, propName, componentName) {
+              try { base.$validate_prop(propName, props[propName]) }
+              catch (e) { return new Error(componentName + " Error: prop validation failed: " + e.message); }
+              return null;
+            }
+          }
+        }
+      end
+    end
+  end
+end