isomorfeus-react 16.13.9 → 16.13.12

data/lib/react/component/api.rb

@@ -1,133 +1,134 @@
-module React
-  module Component
-    module Api
-      def self.included(base)
-        base.instance_exec do
-          base_module = base.to_s.deconstantize
-          if base_module != ''
-            base_module.constantize.define_singleton_method(base.to_s.demodulize) do |*args, &block|
-              `Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
-            end
-          else
-            Object.define_method(base.to_s) do |*args, &block|
-              `Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
-            end
-          end
-
-          attr_accessor :props
-          attr_accessor :state
-
-          def ref(ref_name, &block)
-            defined_refs.JS[ref_name] = block_given? ? block : `null`
-          end
-
-          def defined_refs
-            @defined_ref ||= `{}`
-          end
-
-          def default_state_defined
-            @default_state_defined
-          end
-
-          def state
-            return @default_state if @default_state
-            @default_state_defined = true
-            %x{
-              var native_state = {state: {}};
-              native_state.setState = function(new_state, callback) {
-                for (var key in new_state) {
-                  this.state[key] = new_state[key];
-                }
-                if (callback) { callback.call(); }
-              }
-            }
-            @default_state = React::Component::State.new(`native_state`)
-          end
-
-          def render(&block)
-            `base.render_block = block`
-          end
-
-          def should_component_update?(&block)
-            `base.should_component_update_block = block`
-          end
-        end
-      end
-
-      def display_name
-        @native.JS[:displayName]
-      end
-
-      def force_update(&block)
-        if block_given?
-          # this maybe needs instance_exec too
-          @native.JS.forceUpdate(`function() { block.$call(); }`)
-        else
-          @native.JS.forceUpdate
-        end
-      end
-
-      def component_fun(class_name, **ruby_props)
-        %x{
-          return function(props) {
-            let outer_props = Opal.React.to_native_react_props(#{ruby_props});
-            let new_props = Object.assign({}, props, outer_props);
-            return Opal.global.React.createElement(#{class_name.constantize}.react_component, new_props)
-          }
-        }
-      end
-
-      def get_react_element(arg, &block)
-        if block_given?
-          # execute block, fetch last element from buffer
-          %x{
-            let last_buffer_length = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].length;
-            let last_buffer_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1][last_buffer_length - 1];
-            block.$call();
-            // console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())
-            let new_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop();
-            if (last_buffer_element === new_element) { #{Isomorfeus.raise_error(message: "Block did not create any React element!")} }
-            return new_element;
-          }
-        else
-          # element was rendered before being passed as arg
-          # fetch last element from buffer
-          # `console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())`
-          `Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop()`
-        end
-      end
-      alias gre get_react_element
-
-      def method_ref(method_symbol)
-        %x{
-          if (#@native.method_refs && #@native.method_refs[#{method_symbol}]) { return #@native.method_refs[#{method_symbol}]; }
-          if (!#@native.method_refs) { #@native.method_refs = {}; }
-          #@native.method_refs[#{method_symbol}] = #{method(method_symbol)};
-          return #@native.method_refs[#{method_symbol}];
-        }
-      end
-      alias m_ref method_ref
-
-      def render_react_element(el)
-        # push el to buffer
-        `Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(el)`
-        # `console.log("render_react_element pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString())`
-        nil
-      end
-      alias rre render_react_element
-
-      def ref(name)
-        `#@native[name]`
-      end
-
-      def ruby_ref(name)
-        return `#@native[name]` if `(typeof #@native[name] === 'function')`
-        React::Ref::new(`#@native[name]`)
-      end
-
-      def set_state(updater, &callback)
-        @state.set_state(updater, &callback)
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Api
+      def self.included(base)
+        base.instance_exec do
+          base_module = base.to_s.deconstantize
+          if base_module != ''
+            base_module.constantize.define_singleton_method(base.to_s.demodulize) do |*args, &block|
+              `Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
+            end
+          else
+            Object.define_method(base.to_s) do |*args, &block|
+              `Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
+            end
+          end
+
+          attr_accessor :props
+          attr_accessor :state
+
+          def ref(ref_name, &block)
+            defined_refs.JS[ref_name] = block_given? ? block : `null`
+          end
+
+          def defined_refs
+            @defined_ref ||= `{}`
+          end
+
+          def default_state_defined
+            @default_state_defined
+          end
+
+          def state
+            return @default_state if @default_state
+            @default_state_defined = true
+            %x{
+              var native_state = {state: {}};
+              native_state.setState = function(new_state, callback) {
+                for (var key in new_state) {
+                  this.state[key] = new_state[key];
+                }
+                if (callback) { callback.call(); }
+              }
+            }
+            @default_state = React::Component::State.new(`native_state`)
+          end
+
+          def render(&block)
+            `base.render_block = #{block}`
+          end
+
+          def should_component_update?(&block)
+            `base.should_component_update_block = block`
+          end
+        end
+      end
+
+      def display_name
+        @native.JS[:displayName]
+      end
+
+      def force_update(&block)
+        if block_given?
+          # this maybe needs instance_exec too
+          @native.JS.forceUpdate(`function() { block.$call(); }`)
+        else
+          @native.JS.forceUpdate
+        end
+      end
+
+      def component_fun(class_name, **ruby_props)
+        %x{
+          return function(props) {
+            let outer_props = Opal.React.to_native_react_props(#{ruby_props});
+            let new_props = Object.assign({}, props, outer_props);
+            return Opal.global.React.createElement(#{class_name.constantize}.react_component, new_props)
+          }
+        }
+      end
+
+      def get_react_element(arg, &block)
+        if block_given?
+          # execute block, fetch last element from buffer
+          %x{
+            let last_buffer_length = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].length;
+            let last_buffer_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1][last_buffer_length - 1];
+            block.$call();
+            // console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())
+            let new_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop();
+            if (last_buffer_element === new_element) { #{Isomorfeus.raise_error(message: "Block did not create any React element!")} }
+            return new_element;
+          }
+        else
+          # element was rendered before being passed as arg
+          # fetch last element from buffer
+          # `console.log("get_react_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString())`
+          `Opal.React.render_buffer[Opal.React.render_buffer.length - 1].pop()`
+        end
+      end
+      alias gre get_react_element
+
+      def method_ref(method_symbol, *args)
+        method_key = "#{method_symbol}#{args}"
+        %x{
+          if (#@native.method_refs && #@native.method_refs[#{method_key}]) { return #@native.method_refs[#{method_key}]; }
+          if (!#@native.method_refs) { #@native.method_refs = {}; }
+          #@native.method_refs[#{method_key}] = { m: #{method(method_symbol)}, a: args };
+          return #@native.method_refs[#{method_key}];
+        }
+      end
+      alias m_ref method_ref
+
+      def render_react_element(el)
+        # push el to buffer
+        `Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(el)`
+        # `console.log("render_react_element pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString())`
+        nil
+      end
+      alias rre render_react_element
+
+      def ref(name)
+        `#@native[name]`
+      end
+
+      def ruby_ref(name)
+        return `#@native[name]` if `(typeof #@native[name] === 'function')`
+        React::Ref::new(`#@native[name]`)
+      end
+
+      def set_state(updater, &callback)
+        @state.set_state(updater, &callback)
+      end
+    end
+  end
+end

data/lib/react/component/base.rb

@@ -1,9 +1,9 @@
-module React
-  module Component
-    class Base
-      def self.inherited(base)
-        base.include(::React::Component::Mixin)
-      end
-    end
-  end
+module React
+  module Component
+    class Base
+      def self.inherited(base)
+        base.include(::React::Component::Mixin)
+      end
+    end
+  end
 end

data/lib/react/component/callbacks.rb

@@ -1,115 +1,115 @@
-module React
-  module Component
-    module Callbacks
-      def self.included(base)
-        base.instance_exec do
-          def component_did_catch(&block)
-            # TODO convert error and info
-            %x{
-              var fun = function(error, info) {
-                Opal.React.active_redux_components.push(this);
-                #{`this.__ruby_instance`.instance_exec(`error`, `info`, &block)};
-                Opal.React.active_redux_components.pop();
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidCatch = fun; }
-              else { self.react_component.prototype.componentDidCatch = fun; }
-            }
-          end
-
-          def component_did_mount(&block)
-            %x{
-              let fun = function() {
-                Opal.React.active_redux_components.push(this);
-                #{`this.__ruby_instance`.instance_exec(&block)};
-                Opal.React.active_redux_components.pop();
-              }
-              if (self.lucid_react_component) {
-                if (self.lucid_react_component.prototype.componentDidMount) {
-                  let fun_one = self.lucid_react_component.prototype.componentDidMount;
-                  let fun_two = fun;
-                  fun = function() {
-                    fun_one();
-                    fun_two();
-                  }
-                }
-                self.lucid_react_component.prototype.componentDidMount = fun;
-              } else { self.react_component.prototype.componentDidMount = fun; }
-            }
-          end
-
-          def component_did_update(&block)
-            %x{
-              var fun = function(prev_props, prev_state, snapshot) {
-                Opal.React.active_redux_components.push(this);
-                #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
-                                                       `Opal.React.Component.State.$new({state: prev_state})`,
-                                                       `snapshot`, &block)};
-                Opal.React.active_redux_components.pop();
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidUpdate = fun; }
-              else { self.react_component.prototype.componentDidUpdate = fun; }
-            }
-          end
-
-          def component_will_unmount(&block)
-            %x{
-              var fun = function() {
-                if (typeof this.unsubscriber === "function") { this.unsubscriber(); };
-                Opal.React.active_redux_components.push(this);
-                #{`this.__ruby_instance`.instance_exec(&block)};
-                Opal.React.active_redux_components.pop();
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentWillUnmount = fun; }
-              else { self.react_component.prototype.componentWillUnmount = fun; }
-            }
-          end
-
-          def get_derived_state_from_error(&block)
-            # TODO convert error
-            %x{
-               var fun = function(error) {
-                var result = #{`this.__ruby_instance`.instance_exec(`error`, &block)};
-                if (typeof result.$to_n === 'function') { result = result.$to_n() }
-                if (result === Opal.nil) { return null; }
-                return result;
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromError = fun; }
-              else { self.react_component.prototype.getDerivedStateFromError = fun; }
-            }
-          end
-
-          def get_derived_state_from_props(&block)
-            %x{
-              var fun = function(props, state) {
-                Opal.React.active_redux_components.push(this);
-                var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: props})`,
-                                                                     `Opal.React.Component.State.$new({state: state})`, &block)};
-                Opal.React.active_redux_components.pop();
-                if (typeof result.$to_n === 'function') { result = result.$to_n() }
-                if (result === Opal.nil) { return null; }
-                return result;
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromProps = fun; }
-              else { self.react_component.prototype.getDerivedStateFromProps = fun; }
-            }
-          end
-
-          def get_snapshot_before_update(&block)
-            %x{
-              var fun = function(prev_props, prev_state) {
-                Opal.React.active_redux_components.push(this);
-                var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
-                                                                    `Opal.React.Component.State.$new({state: prev_state})`, &block)};
-                Opal.React.active_redux_components.pop();
-                if (result === Opal.nil) { return null; }
-                return result;
-              }
-              if (self.lucid_react_component) { self.lucid_react_component.prototype.getSnapshotBeforeUpdate = fun; }
-              else { self.react_component.prototype.getSnapshotBeforeUpdate = fun; }
-            }
-          end
-        end
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Callbacks
+      def self.included(base)
+        base.instance_exec do
+          def component_did_catch(&block)
+            # TODO convert error and info
+            %x{
+              var fun = function(error, info) {
+                Opal.React.active_redux_components.push(this);
+                #{`this.__ruby_instance`.instance_exec(`error`, `info`, &block)};
+                Opal.React.active_redux_components.pop();
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidCatch = fun; }
+              else { self.react_component.prototype.componentDidCatch = fun; }
+            }
+          end
+
+          def component_did_mount(&block)
+            %x{
+              let fun = function() {
+                Opal.React.active_redux_components.push(this);
+                #{`this.__ruby_instance`.instance_exec(&block)};
+                Opal.React.active_redux_components.pop();
+              }
+              if (self.lucid_react_component) {
+                if (self.lucid_react_component.prototype.componentDidMount) {
+                  let fun_one = self.lucid_react_component.prototype.componentDidMount;
+                  let fun_two = fun;
+                  fun = function() {
+                    fun_one();
+                    fun_two();
+                  }
+                }
+                self.lucid_react_component.prototype.componentDidMount = fun;
+              } else { self.react_component.prototype.componentDidMount = fun; }
+            }
+          end
+
+          def component_did_update(&block)
+            %x{
+              var fun = function(prev_props, prev_state, snapshot) {
+                Opal.React.active_redux_components.push(this);
+                #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
+                                                       `Opal.React.Component.State.$new({state: prev_state})`,
+                                                       `snapshot`, &block)};
+                Opal.React.active_redux_components.pop();
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidUpdate = fun; }
+              else { self.react_component.prototype.componentDidUpdate = fun; }
+            }
+          end
+
+          def component_will_unmount(&block)
+            %x{
+              var fun = function() {
+                if (typeof this.unsubscriber === "function") { this.unsubscriber(); };
+                Opal.React.active_redux_components.push(this);
+                #{`this.__ruby_instance`.instance_exec(&block)};
+                Opal.React.active_redux_components.pop();
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.componentWillUnmount = fun; }
+              else { self.react_component.prototype.componentWillUnmount = fun; }
+            }
+          end
+
+          def get_derived_state_from_error(&block)
+            # TODO convert error
+            %x{
+               var fun = function(error) {
+                var result = #{`this.__ruby_instance`.instance_exec(`error`, &block)};
+                if (typeof result.$to_n === 'function') { result = result.$to_n() }
+                if (result === Opal.nil) { return null; }
+                return result;
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromError = fun; }
+              else { self.react_component.prototype.getDerivedStateFromError = fun; }
+            }
+          end
+
+          def get_derived_state_from_props(&block)
+            %x{
+              var fun = function(props, state) {
+                Opal.React.active_redux_components.push(this);
+                var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: props})`,
+                                                                     `Opal.React.Component.State.$new({state: state})`, &block)};
+                Opal.React.active_redux_components.pop();
+                if (typeof result.$to_n === 'function') { result = result.$to_n() }
+                if (result === Opal.nil) { return null; }
+                return result;
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromProps = fun; }
+              else { self.react_component.prototype.getDerivedStateFromProps = fun; }
+            }
+          end
+
+          def get_snapshot_before_update(&block)
+            %x{
+              var fun = function(prev_props, prev_state) {
+                Opal.React.active_redux_components.push(this);
+                var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
+                                                                    `Opal.React.Component.State.$new({state: prev_state})`, &block)};
+                Opal.React.active_redux_components.pop();
+                if (result === Opal.nil) { return null; }
+                return result;
+              }
+              if (self.lucid_react_component) { self.lucid_react_component.prototype.getSnapshotBeforeUpdate = fun; }
+              else { self.react_component.prototype.getSnapshotBeforeUpdate = fun; }
+            }
+          end
+        end
+      end
+    end
+  end
+end

data/lib/react/component/elements.rb

@@ -1,60 +1,60 @@
-module React
-  module Component
-    module Elements
-      # https://www.w3.org/TR/html52/fullindex.html#index-elements
-      # https://www.w3.org/TR/SVG11/eltindex.html
-      SUPPORTED_HTML_AND_SVG_ELEMENTS = %w[
-        a abbr address area article aside audio
-        b base bdi bdo blockquote body br button
-        canvas caption cite code col colgroup
-        data datalist dd del details dfn dialog div dl dt
-        em embed
-        fieldset figcaption figure footer form
-        h1 h2 h3 h4 h5 h6 head header hr html
-        i iframe img input ins
-        kbd
-        label legend li link
-        main map mark meta meter
-        nav noscript
-        object ol optgroup option output
-        p param picture pre progress
-        q
-        rp rt rtc ruby
-        s samp script section select small source span strong style sub summary sup
-        table tbody td template textarea tfoot th thead time title tr track
-        u ul
-        var video
-        wbr
-        altGlyph altGlyphDef altGlyphItem animate animateColor animateMotion animateTransform
-        circle clipPath color-profile cursor
-        defs desc
-        ellipse
-        feBlend feColorMatrix feComponentTransfer feComposite feConvolveMatrix feDiffuseLighting
-        feDisplacementMap feDistantLight feFlood feFuncA feFuncB feFuncG feFuncR feGaussianBlur
-        feImage feMerge feMergeNode feMorphology feOffset fePointLight feSpecularLighting
-        feSpotLight feTile feTurbulence
-        filter font font-face font-face-format font-face-name font-face-src font-face-uri foreignObject
-        g glyph glyphRef
-        hkern
-        image
-        line linearGradient
-        marker mask metadata missing-glyph mpath
-        path pattern polygon polyline
-        radialGradient rect
-        script set stop style svg switch symbol
-        text textPath tref tspan
-        use
-        view vkern
-      ]
-
-      SUPPORTED_HTML_AND_SVG_ELEMENTS.each do |element|
-        define_method(element) do |*args, &block|
-          `Opal.React.internal_prepare_args_and_render(element, args, block)`
-        end
-        define_method(`element.toUpperCase()`) do |*args, &block|
-          `Opal.React.internal_prepare_args_and_render(element, args, block)`
-        end
-      end
-    end
-  end
-end
+module React
+  module Component
+    module Elements
+      # https://www.w3.org/TR/html52/fullindex.html#index-elements
+      # https://www.w3.org/TR/SVG11/eltindex.html
+      SUPPORTED_HTML_AND_SVG_ELEMENTS = %w[
+        a abbr address area article aside audio
+        b base bdi bdo blockquote body br button
+        canvas caption cite code col colgroup
+        data datalist dd del details dfn dialog div dl dt
+        em embed
+        fieldset figcaption figure footer form
+        h1 h2 h3 h4 h5 h6 head header hr html
+        i iframe img input ins
+        kbd
+        label legend li link
+        main map mark meta meter
+        nav noscript
+        object ol optgroup option output
+        p param picture pre progress
+        q
+        rp rt rtc ruby
+        s samp script section select small source span strong style sub summary sup
+        table tbody td template textarea tfoot th thead time title tr track
+        u ul
+        var video
+        wbr
+        altGlyph altGlyphDef altGlyphItem animate animateColor animateMotion animateTransform
+        circle clipPath color-profile cursor
+        defs desc
+        ellipse
+        feBlend feColorMatrix feComponentTransfer feComposite feConvolveMatrix feDiffuseLighting
+        feDisplacementMap feDistantLight feFlood feFuncA feFuncB feFuncG feFuncR feGaussianBlur
+        feImage feMerge feMergeNode feMorphology feOffset fePointLight feSpecularLighting
+        feSpotLight feTile feTurbulence
+        filter font font-face font-face-format font-face-name font-face-src font-face-uri foreignObject
+        g glyph glyphRef
+        hkern
+        image
+        line linearGradient
+        marker mask metadata missing-glyph mpath
+        path pattern polygon polyline
+        radialGradient rect
+        script set stop style svg switch symbol
+        text textPath tref tspan
+        use
+        view vkern
+      ]
+
+      SUPPORTED_HTML_AND_SVG_ELEMENTS.each do |element|
+        define_method(element) do |*args, &block|
+          `Opal.React.internal_prepare_args_and_render(element, args, block)`
+        end
+        define_method(`element.toUpperCase()`) do |*args, &block|
+          `Opal.React.internal_prepare_args_and_render(element, args, block)`
+        end
+      end
+    end
+  end
+end