isomorfeus-react 16.8.9 → 16.9.0

data/lib/lucid_component/class_store_proxy.rb

@@ -0,0 +1,43 @@
+module LucidComponent
+  class ClassStoreProxy
+    def initialize(component_instance, access_key = 'state')
+      @native_component_instance = component_instance.to_n
+      @component_instance = component_instance
+      @component_name = component_instance.class.to_s
+      @access_key = access_key
+    end
+
+    def method_missing(key, *args, &block)
+      @native_component_instance.JS.register_used_store_path(['component_class_state', @component_name, key])
+      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[@access_key].JS[:isomorfeus_store].JS[:component_class_state].JS[@component_name] &&
+          @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_class_state].JS[@component_name].JS.hasOwnProperty(key)
+          return @native_component_instance.JS[@access_key].JS[:isomorfeus_store].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

@@ -0,0 +1,38 @@
+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

data/lib/lucid_component/component_instance_store_defaults.rb

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

data/lib/lucid_component/initializer.rb

@@ -2,11 +2,11 @@ module LucidComponent
   module Initializer
     def initialize(native_component)
       @native = native_component
-      @app_store = `Opal.React.ReduxComponent.AppStoreProxy.$new(#{self}, 'props')`
-      @class_store = `Opal.React.ReduxComponent.ClassStoreProxy.$new(#{self}, 'props')`
+      @app_store = `Opal.LucidComponent.AppStoreProxy.$new(#{self}, 'props')`
+      @class_store = `Opal.LucidComponent.ClassStoreProxy.$new(#{self}, 'props')`
       @props = `Opal.React.Component.Props.$new(#@native)`
       @state = `Opal.React.Component.State.$new(#@native)`
-      @store = `Opal.React.ReduxComponent.InstanceStoreProxy.$new(#{self}, 'props')`
+      @store = `Opal.LucidComponent.InstanceStoreProxy.$new(#{self}, 'props')`
     end
   end
 end

data/lib/lucid_component/instance_store_proxy.rb

@@ -0,0 +1,47 @@
+module LucidComponent
+  class InstanceStoreProxy
+    def initialize(component_instance, access_key = 'state')
+      @native_component_instance = component_instance.to_n
+      @component_instance = component_instance
+      @component_object_id = component_instance.object_id.to_s
+      @access_key = access_key
+    end
+
+    def method_missing(key, *args, &block)
+      @native_component_instance.JS.register_used_store_path(['component_state', @component_object_id, key])
+      if `args.length > 0`
+        # set instance state, simply a dispatch
+
+        action = { type: 'COMPONENT_STATE', object_id: @component_object_id, name: (`key.endsWith('=')` ? key.chop : key), value: args[0] }
+        Isomorfeus.store.dispatch(action)
+
+      else
+        # get instance state
+
+        if @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id] &&
+          @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id].JS.hasOwnProperty(key)
+          # check if we have a component local state value
+          return @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id].JS[key]
+        elsif @component_instance.class.default_instance_store_defined && @component_instance.class.store.to_h.key?(key)
+          # check if a default value was given
+          return @component_instance.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/mixin.rb

@@ -8,7 +8,7 @@ module LucidComponent
       base.include(::React::Component::Elements)
       base.include(::React::Component::API)
       base.include(::React::Component::Callbacks)
-      base.include(::React::ReduxComponent::API)
+      base.include(::LucidComponent::StoreAPI)
       base.include(::LucidComponent::API)
       base.include(::LucidComponent::Initializer)
       base.include(::React::Component::Features)

data/lib/lucid_component/reducers.rb

@@ -0,0 +1,46 @@
+module LucidComponent
+  module Reducers
+    class << self
+      attr_reader :component_reducers_added
+
+      def add_component_reducers_to_store
+        unless component_reducers_added
+          @_component_reducers_added = true
+          component_reducer = Redux.create_reducer do |prev_state, action|
+            case action[:type]
+            when 'COMPONENT_STATE'
+              if action.key?(:set_state)
+                action[:set_state]
+              else
+                new_state = {}.merge!(prev_state) # make a copy of state
+                new_state[action[:object_id]] = {} unless new_state.key?(action[:object_id])
+                new_state[action[:object_id]].merge!(action[:name] => action[:value])
+                new_state
+              end
+            else
+              prev_state
+            end
+          end
+
+          component_class_reducer = Redux.create_reducer do |prev_state, action|
+            case action[:type]
+            when 'COMPONENT_CLASS_STATE'
+              if action.key?(:set_state)
+                action[:set_state]
+              else
+                new_state = {}.merge!(prev_state) # make a copy of state
+                new_state[action[:class]] = {} unless new_state.key?(action[:class])
+                new_state[action[:class]].merge!(action[:name] => action[:value])
+                new_state
+              end
+            else
+              prev_state
+            end
+          end
+
+          Redux::Store.add_reducers(component_state: component_reducer, component_class_state: component_class_reducer)
+        end
+      end
+    end
+  end
+end

data/lib/lucid_component/store_api.rb

@@ -0,0 +1,38 @@
+module LucidComponent
+  module StoreAPI
+    def self.included(base)
+      base.instance_exec do
+        attr_accessor :app_store
+        attr_accessor :class_store
+        attr_accessor :store
+
+        def default_app_store_defined
+          @default_app_store_defined
+        end
+
+        def default_class_store_defined
+          @default_class_store_defined
+        end
+
+        def default_instance_store_defined
+          @default_instance_store_defined
+        end
+
+        def app_store
+          @default_app_store_defined = true
+          @default_app_store ||= ::LucidComponent::AppStoreDefaults.new(state, self.to_s)
+        end
+
+        def class_store
+          @default_class_store_defined = true
+          @default_class_store ||= ::LucidComponent::ComponentClassStoreDefaults.new(state, self.to_s)
+        end
+
+        def store
+          @default_instance_store_defined = true
+          @default_instance_store ||= ::LucidComponent::ComponentInstanceStoreDefaults.new(state, self.to_s)
+        end
+      end
+    end
+  end
+end

data/lib/lucid_material/app/mixin.rb

@@ -9,7 +9,7 @@ module LucidMaterial
         base.include(::React::Component::Elements)
         base.include(::React::Component::API)
         base.include(::React::Component::Callbacks)
-        base.include(::React::ReduxComponent::API)
+        base.include(::LucidComponent::StoreAPI)
         base.include(::LucidMaterial::Component::API)
         base.include(::LucidApp::API)
         base.include(::LucidComponent::Initializer)

data/lib/lucid_material/component/mixin.rb

@@ -9,7 +9,7 @@ module LucidMaterial
         base.include(::React::Component::Elements)
         base.include(::React::Component::API)
         base.include(::React::Component::Callbacks)
-        base.include(::React::ReduxComponent::API)
+        base.include(::LucidComponent::StoreAPI)
         base.include(::LucidComponent::API)
         base.include(::LucidMaterial::Component::API)
         base.include(::LucidComponent::Initializer)

data/lib/react.rb

@@ -26,8 +26,7 @@ module React
 
     self.native_element_or_component_to_ruby = function (element) {
       if (typeof element.__ruby_instance !== 'undefined') { return element.__ruby_instance }
-      if (element instanceof Element) { return #{Browser::DOM::Element.new(`element`)} }
-      if (element instanceof Node) { return #{Browser::DOM::Node.new(`element`)} }
+      if (element instanceof Element || element instanceof Node) { return #{Browser::Element.new(`element`)} }
       return element;
     };
 

data/lib/react/component/api.rb

@@ -101,6 +101,10 @@ module React
         end
       end
 
+      def display_name
+        @native.JS[:displayName]
+      end
+
       def force_update(&block)
         if block_given?
           # this maybe needs instance_exec too

data/lib/react/component/features.rb

@@ -8,7 +8,7 @@ module React
       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::DOM::Node)
+        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
@@ -30,6 +30,10 @@ module React
         }
       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

data/lib/react/component/mixin.rb

@@ -10,7 +10,7 @@ module React
         base.include(::React::Component::Elements)
         base.include(::React::Component::API)
         base.include(::React::Component::Callbacks)
-        base.include(::React::Component::UnsafeAPI)
+        # base.include(::React::Component::UnsafeAPI)
         base.include(::React::Component::Initializer)
         base.include(::React::Component::Features)
         base.include(::React::Component::Resolution)

data/lib/react/component/props.rb

@@ -55,4 +55,4 @@ module React
       end
     end
   end
-end
+end

data/lib/react/function_component/api.rb

@@ -8,11 +8,7 @@ module React
       end
 
       def use_callback(deps, &block)
-        %x{
-          Opal.global.React.useCallback(function() {
-            #{block.call}
-          }, deps);
-        }
+        `Opal.global.React.useCallback(function() { #{block.call} }, deps)`
       end
 
       def use_context(context)
@@ -25,36 +21,20 @@ module React
       end
 
       def use_effect(&block)
-        %x{
-          Opal.global.React.useEffect(function() {
-            #{block.call}
-          });
-        }
+        `Opal.global.React.useEffect(function() { #{block.call} })`
       end
 
       def use_imperative_handle(ref, *deps, &block)
         native_ref = `(typeof ref.$is_wrapped_ref !== 'undefined')` ? ref.to_n : ref
-        %x{
-          Opal.global.React.useImperativeHandle(native_ref, function() {
-            #{block.call}
-          }, deps);
-        }
+        `Opal.global.React.useImperativeHandle(native_ref, function() { #{block.call} }, deps)`
       end
 
       def use_layout_effect(&block)
-        %x{
-          Opal.global.React.useLayoutEffect(function() {
-            #{block.call}
-          });
-        }
+        `Opal.global.React.useLayoutEffect(function() { #{block.call} })`
       end
 
       def use_memo(*deps, &block)
-        %x{
-          Opal.global.React.useMemo(function() {
-            #{block.call}
-          }, deps);
-        }
+        `Opal.global.React.useMemo(function() { #{block.call} }, deps)`
       end
 
       def use_reducer(inital_state, &block)

data/lib/react/pure_component/mixin.rb

@@ -9,7 +9,7 @@ module React
         base.include(::React::Component::Elements)
         base.include(::React::Component::API)
         base.include(::React::Component::Callbacks)
-        base.include(::React::Component::UnsafeAPI)
+        # base.include(::React::Component::UnsafeAPI)
         base.include(::React::Component::Initializer)
         base.include(::React::Component::Features)
         base.include(::React::Component::Resolution)

data/lib/react/synthetic_event.rb

@@ -35,7 +35,7 @@ module React
     native_boolean_accessors :altKey, :bubbles, :cancelable, :ctrlKey, :defaultPrevented, :isPrimary, :isTrusted, :metaKey, :repeat, :shiftKey
 
     def current_target
-      Browser::Event::Target.convert(@native.JS[:currentTarget])
+      Browser::Element.new(@native.JS[:currentTarget])
     end
 
     def native_event
@@ -43,11 +43,11 @@ module React
     end
 
     def related_target
-      Browser::Event::Target.convert(@native.JS[:relatedTarget])
+      Browser::Element.new(@native.JS[:relatedTarget])
     end
 
     def target
-      Browser::Event::Target.convert(@native.JS[:target])
+      Browser::Element.new(@native.JS[:target])
     end
   end
 end