isomorfeus-react 16.9.24 → 16.10.0

data/lib/isomorfeus/top_level.rb

@@ -1,86 +0,0 @@
-module Isomorfeus
-  class TopLevel
-    class << self
-      def mount!
-        Isomorfeus.init
-        Isomorfeus::TopLevel.on_ready do
-          root_element = `document.querySelector('div[data-iso-root]')`
-          component_name = root_element.JS.getAttribute('data-iso-root')
-          Isomorfeus.env = root_element.JS.getAttribute('data-iso-env')
-          component = nil
-          begin
-            component = component_name.constantize
-          rescue Exception
-            @timeout_start = Time.now unless @timeout_start
-            if (Time.now - @timeout_start) < 10
-              `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 100)`
-            else
-              `console.error("Unable to mount '" + #{component_name} + "'!")`
-            end
-          end
-          if component
-            props_json = root_element.JS.getAttribute('data-iso-props')
-            props = `Opal.Hash.$new(JSON.parse(props_json))`
-            hydrated = root_element.JS.getAttribute('data-iso-hydrated')
-            state_json = root_element.JS.getAttribute('data-iso-state')
-            if state_json
-              %x{
-                var state = JSON.parse(state_json);
-                var keys = Object.keys(state);
-                for(var i=0; i < keys.length; i++) {
-                  global.Opal.Isomorfeus.store.native.dispatch({ type: keys[i].toUpperCase(), set_state: state[keys[i]] });
-                }
-              }
-            end
-            begin
-              Isomorfeus::TopLevel.mount_component(component, props, root_element, hydrated)
-            rescue Exception
-              @timeout_start = Time.now unless @timeout_start
-              if (Time.now - @timeout_start) < 10
-                `setTimeout(Opal.Isomorfeus.TopLevel['$mount!'], 100)`
-              else
-                `console.error("Unable to mount '" + #{component_name} + "'!")`
-              end
-            end
-          end
-        end
-      end
-
-      def on_ready(&block)
-        # this looks a bit odd but works across _all_ browsers, and no event handler mess
-        %x{
-          function run() { block.$call() };
-          function ready_fun() {
-            /in/.test(document.readyState) ? setTimeout(ready_fun,5) : run();
-          }
-          ready_fun();
-        }
-      end
-
-      def on_ready_mount(component, props = nil, element_query = nil)
-        # init in case it hasn't been run yet
-        Isomorfeus.init
-        on_ready do
-          Isomorfeus::TopLevel.mount_component(component, props, element_query)
-        end
-      end
-
-      def mount_component(component, props, element_or_query, hydrated = false)
-        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
-
-        top = if hydrated
-                ReactDOM.hydrate(React.create_element(component, props), element)
-              else
-                ReactDOM.render(React.create_element(component, props), element)
-              end
-        Isomorfeus.top_component = top if top
-      end
-    end
-  end
-end

data/lib/isomorfeus/top_level_ssr.rb

@@ -1,28 +0,0 @@
-module Isomorfeus
-  class TopLevel
-    class << self
-      attr_accessor :ssr_route_path
-      attr_accessor :transport_ws_url
-
-      def mount!
-        # nothing, but keep it for compatibility with browser
-      end
-
-      def render_component_to_string(component_name, props)
-        component = nil
-        %x{
-          if (typeof component_name === 'string' || component_name instanceof String) {
-            component = component_name.split(".").reduce(function(o, x) {
-              return (o !== null && typeof o[x] !== "undefined" && o[x] !== null) ? o[x] : null;
-            }, Opal.global)
-          } else {
-            component = component_name;
-          }
-        }
-        component = Isomorfeus.cached_component_class(component_name) unless component
-
-        ReactDOMServer.render_to_string(React.create_element(component, `Opal.Hash.$new(props)`))
-      end
-    end
-  end
-end

data/lib/lucid_app/api.rb

@@ -1,30 +0,0 @@
-module LucidApp
-  module API
-    def self.included(base)
-      base.instance_exec do
-        def theme(theme_hash = nil, &block)
-          if block_given?
-            %x{
-              let result = block.$call(Opal.Hash.$new(base.jss_theme));
-              if (typeof result.$to_n === 'function') { base.jss_theme = result.$to_n(); }
-              else { base.jss_theme = result; }
-              return result;
-            }
-          elsif theme_hash
-            `base.jss_theme = #{theme_hash.to_n}` if theme_hash
-            theme_hash
-          elsif `typeof base.jss_theme === 'object'`
-            `Opal.Hash.$new(base.jss_theme)`
-          else
-            nil
-          end
-        end
-        alias_method :theme=, :theme
-      end
-
-      def context
-        @native.JS[:context]
-      end
-    end
-  end
-end

data/lib/lucid_app/base.rb

@@ -1,7 +0,0 @@
-module LucidApp
-  class Base
-    def self.inherited(base)
-      base.include(::LucidApp::Mixin)
-    end
-  end
-end

data/lib/lucid_app/context.rb

@@ -1,7 +0,0 @@
-module LucidApp
-  module Context
-    def self.create_application_context
-      React.create_context('LucidApplicationContext', Isomorfeus.store)
-    end
-  end
-end

data/lib/lucid_app/mixin.rb

@@ -1,20 +0,0 @@
-module LucidApp
-  module Mixin
-    def self.included(base)
-      base.include(::Native::Wrapper)
-      base.extend(::LucidApp::NativeComponentConstructor)
-      base.extend(::LucidPropDeclaration::Mixin)
-      base.extend(::React::Component::ShouldComponentUpdate)
-      base.extend(::LucidComponent::EventHandler)
-      base.include(::React::Component::Elements)
-      base.include(::React::Component::API)
-      base.include(::React::Component::Callbacks)
-      base.include(::LucidComponent::StoreAPI)
-      base.include(::LucidComponent::StylesSupport)
-      base.include(::LucidApp::API)
-      base.include(::LucidComponent::Initializer)
-      base.include(::React::Component::Features)
-      base.include(::React::Component::Resolution)
-    end
-  end
-end

data/lib/lucid_app/native_component_constructor.rb

@@ -1,105 +0,0 @@
-module LucidApp
-  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.lucid_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.state.isomorfeus_store_state = Opal.Isomorfeus.store.native.getState();
-            var current_store_state = this.state.isomorfeus_store_state;
-            if (typeof current_store_state.component_class_state[#{component_name}] !== "undefined") {
-              this.state.component_class_state = {};
-              this.state.component_class_state[#{component_name}] = current_store_state.component_class_state[#{component_name}];
-            } else {
-              this.state.component_class_state = {};
-              this.state.component_class_state[#{component_name}] = {};
-            };
-            this.__ruby_instance = base.$new(this);
-            this.__object_id = this.__ruby_instance.$object_id().$to_s();
-            if (Opal.Isomorfeus.$top_component() == nil) { Opal.Isomorfeus['$top_component='](this); }
-            if (!this.state.component_state) {
-              this.state.component_state = {};
-              this.state.component_state[this.__object_id] = {};
-            };
-            var event_handlers = #{base.event_handlers};
-            for (var i = 0; i < event_handlers.length; i++) {
-              this[event_handlers[i]] = this[event_handlers[i]].bind(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();
-              }
-            }
-            this.listener = this.listener.bind(this);
-            this.unsubscriber = Opal.Isomorfeus.store.native.subscribe(this.listener);
-          }
-          static get displayName() {
-            return #{component_name};
-          }
-          render() {
-            Opal.React.render_buffer.push([]);
-            Opal.React.active_components.push(this);
-            Opal.React.active_redux_components.push(this.__ruby_instance);
-            #{`this.__ruby_instance`.instance_exec(&`base.render_block`)};
-            Opal.React.active_redux_components.pop();
-            Opal.React.active_components.pop();
-            let children = Opal.React.render_buffer.pop();
-            return Opal.global.React.createElement(Opal.global.LucidApplicationContext.Provider, { value: this.state.isomorfeus_store_state }, children);
-          }
-          listener() {
-            let next_state = Opal.Isomorfeus.store.native.getState();
-            this.setState({ isomorfeus_store_state: next_state });
-          }
-          componentWillUnmount() {
-            if (typeof this.unsubscriber === "function") { this.unsubscriber(); };
-          }
-          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;
-          }
-        }
-        base.jss_styles = null;
-        base.jss_styles_used = null;
-        base.jss_theme = {};
-        base.use_styles = null;
-        base.themed_react_component = function(props) {
-          let classes = null;
-          let theme = Opal.global.ReactJSS.useTheme();
-          if (base.jss_styles) {
-            if (!base.use_styles || (Opal.Isomorfeus["$development?"]() && !Object.is(base.jss_styles, base.jss_styles_used))) {
-              base.jss_styles_used = base.jss_styles;
-              let styles = base.jss_styles
-              if (typeof styles === 'function') { styles = styles(theme); }
-              base.use_styles = Opal.global.ReactJSS.createUseStyles(styles);
-            }
-            classes = base.use_styles();
-          }
-          let themed_classes_props = Object.assign({}, props, { classes: classes, theme: theme });
-          return Opal.global.React.createElement(base.lucid_react_component, themed_classes_props);
-        }
-        base.react_component = function(props) {
-          let themed_component = Opal.global.React.createElement(base.themed_react_component, props);
-          return Opal.global.React.createElement(Opal.global.ReactJSS.ThemeProvider, { theme: base.jss_theme }, themed_component);
-        }
-      }
-    end
-  end
-end

data/lib/lucid_component/app_store_defaults.rb

@@ -1,36 +0,0 @@
-module LucidComponent
-  class AppStoreDefaults
-    def initialize(state, component_name)
-      @state = state
-      if @state.isomorfeus_store
-        @state.isomorfeus_store.merge!(application_state: {})
-      else
-        @state.isomorfeus_store = { application_state: {}}
-      end
-    end
-
-    def method_missing(key, *args, &block)
-      if `args.length > 0`
-        # set initial class state
-        key = key.chop if `key.endsWith('=')`
-        @state.isomorfeus_store[:application_state][key] = args[0]
-        current_state = Isomorfeus.store.get_state
-        if !(current_state[:application_state].key?(key))
-          Isomorfeus.store.dispatch(type: 'APPLICATION_STATE', name: key, value: args[0])
-        end
-      else
-        # get class state
-
-        # check if we have a component local state value
-        if @state.isomorfeus_store[:application_state].key?(key)
-          return @state.isomorfeus_store[:application_state][key]
-        end
-      end
-      nil
-    end
-
-    def to_h
-      @state.isomorfeus_store[:application_state]
-    end
-  end
-end

data/lib/lucid_component/app_store_proxy.rb

@@ -1,38 +0,0 @@
-module LucidComponent
-  class AppStoreProxy
-    def initialize(component_instance)
-      @native_component_instance = component_instance.to_n
-      @component_instance = component_instance
-    end
-
-    def method_missing(key, *args, &block)
-      if `args.length > 0`
-        # set class state, simply a dispatch
-        action = { type: 'APPLICATION_STATE', name: (`key.endsWith('=')` ? key.chop : key), value: args[0] }
-        Isomorfeus.store.dispatch(action)
-      else
-        # check if we have a component local state value
-        if `this.native_component_instance.context.application_state.hasOwnProperty(key)`
-          return @native_component_instance.JS['context'].JS[:application_state].JS[key]
-        elsif @component_instance.class.default_app_store_defined && @component_instance.class.app_store.to_h.key?(key)
-          # check if a default value was given
-          return @component_instance.class.app_store.to_h[key]
-        end
-        # otherwise return nil
-        return nil
-      end
-    end
-
-    def dispatch(action)
-      Isomorfeus.store.dispatch(action)
-    end
-
-    def subscribe(&block)
-      Isomorfeus.store.subscribe(&block)
-    end
-
-    def unsubscribe(unsubscriber)
-      `unsubscriber()`
-    end
-  end
-end

data/lib/lucid_component/base.rb

@@ -1,7 +0,0 @@
-module LucidComponent
-  class Base
-    def self.inherited(base)
-      base.include(::LucidComponent::Mixin)
-    end
-  end
-end

data/lib/lucid_component/class_store_proxy.rb

@@ -1,41 +0,0 @@
-module LucidComponent
-  class ClassStoreProxy
-    def initialize(component_instance)
-      @native_component_instance = component_instance.to_n
-      @component_instance = component_instance
-      @component_name = component_instance.class.to_s
-    end
-
-    def method_missing(key, *args, &block)
-      if `args.length > 0`
-        # set class state, simply a dispatch
-        action = { type: 'COMPONENT_CLASS_STATE', class: @component_name, name: (`key.endsWith('=')` ? key.chop : key), value: args[0] }
-        Isomorfeus.store.dispatch(action)
-      else
-        # get class state
-        # check if we have a component local state value
-        if @native_component_instance.JS['context'].JS[:component_class_state].JS[@component_name] &&
-          @native_component_instance.JS['context'].JS[:component_class_state].JS[@component_name].JS.hasOwnProperty(key)
-          return @native_component_instance.JS['context'].JS[:component_class_state].JS[@component_name].JS[key]
-        elsif @component_instance.class.default_class_store_defined && @component_instance.class.class_store.to_h.key?(key)
-          # check if a default value was given
-          return @component_instance.class.class_store.to_h[key]
-        end
-        # otherwise return nil
-        return nil
-      end
-    end
-
-    def dispatch(action)
-      Isomorfeus.store.dispatch(action)
-    end
-
-    def subscribe(&block)
-      Isomorfeus.store.subscribe(&block)
-    end
-
-    def unsubscribe(unsubscriber)
-      `unsubscriber()`
-    end
-  end
-end

data/lib/lucid_component/component_class_store_defaults.rb

@@ -1,38 +0,0 @@
-module LucidComponent
-  class ComponentClassStoreDefaults
-    def initialize(state, component_name)
-      @state = state
-      @component_name = component_name
-      if @state.isomorfeus_store
-        @state.isomorfeus_store.merge!(component_class_state: { @component_name => {} })
-      else
-        @state.isomorfeus_store = { component_class_state: { @component_name => {} } }
-      end
-    end
-
-    def method_missing(key, *args, &block)
-      if `args.length > 0`
-        # set initial class state
-        key = key.chop if `key.endsWith('=')`
-        @state.isomorfeus_store[:component_class_state][@component_name][key] = args[0]
-        current_state = Isomorfeus.store.get_state
-        if !(current_state[:component_class_state].key?(@component_name) && current_state[:component_class_state][@component_name].key?(key))
-          Isomorfeus.store.dispatch(type: 'COMPONENT_CLASS_STATE', class: @component_name, name: key, value: args[0])
-        end
-      else
-        # get class state
-
-        # check if we have a component local state value
-
-        if @state.isomorfeus_store[:component_class_state][@component_name].key?(key)
-          return @state.isomorfeus_store[:component_class_state][@component_name][key]
-        end
-      end
-      nil
-    end
-
-    def to_h
-      @state.isomorfeus_store[:component_class_state][@component_name]
-    end
-  end
-end