hyper-react 0.99.6 → 1.0.0.lap21

data/lib/react/server.rb

@@ -0,0 +1,19 @@
+module React
+  module Server
+    def self.render_to_string(element)
+      if !(`typeof ReactDOMServer === 'undefined'`)
+        React::RenderingContext.build { `ReactDOMServer.renderToString(#{element.to_n})` } # v0.15+
+      else
+        raise "renderToString is not defined.  In React >= v15 you must import it with ReactDOMServer"
+      end
+    end
+
+    def self.render_to_static_markup(element)
+      if !(`typeof ReactDOMServer === 'undefined'`)
+        React::RenderingContext.build { `ReactDOMServer.renderToStaticMarkup(#{element.to_n})` } # v0.15+
+      else
+        raise "renderToStaticMarkup is not defined.  In React >= v15 you must import it with ReactDOMServer"
+      end
+    end
+  end
+end

data/lib/react/state_wrapper.rb

@@ -0,0 +1,23 @@
+module HyperStore
+  class StateWrapper < BaseStoreClass # < BasicObject
+
+    def [](state)
+      `#{__from__.instance_variable_get('@native')}.state[#{state}] || #{nil}`
+    end
+
+    def []=(state, new_value)
+      `#{__from__.instance_variable_get('@native')}.state[#{state}] = new_value`
+    end
+
+    alias pre_component_method_missing method_missing
+
+    def method_missing(method, *args)
+      if method.end_with?('!') && __from__.respond_to?(:deprecation_warning)
+        __from__.deprecation_warning("The mutator 'state.#{method}' has been deprecated.  Use 'mutate.#{method.sub(/\!$/,'')}' instead.")
+        __from__.mutate.__send__(method.chop, *args)
+      else
+        pre_component_method_missing(method, *args)
+      end
+    end
+  end
+end

data/lib/react/test.rb

@@ -0,0 +1,16 @@
+require 'react/test/session'
+require 'react/test/dsl'
+
+module React
+  module Test
+    class << self
+      def current_session
+        @current_session ||= Session.new
+      end
+
+      def reset_session!
+        @current_session = nil
+      end
+    end
+  end
+end

data/lib/react/test/dsl.rb

@@ -0,0 +1,17 @@
+require 'react/test'
+
+module React
+  module Test
+    module DSL
+      def component
+        React::Test.current_session
+      end
+
+      Session::DSL_METHODS.each do |method|
+        define_method method do |*args, &block|
+          component.public_send(method, *args, &block)
+        end
+      end
+    end
+  end
+end

data/lib/react/test/matchers/render_html_matcher.rb

@@ -0,0 +1,56 @@
+module React
+  module Test
+    module Matchers
+      class RenderHTMLMatcher
+        def initialize(expected)
+          @expected = expected
+          @params = {}
+        end
+
+        def with_params(params)
+          @params = params
+          self
+        end
+
+        def matches?(component)
+          @component = component
+          @actual = render_to_html
+          @expected == @actual
+        end
+
+        def failure_message
+          failure_string
+        end
+
+        def failure_message_when_negated
+          failure_string(:negative)
+        end
+
+        alias negative_failure_message failure_message_when_negated
+
+        private
+
+        def render_to_html
+          element = React.create_element(@component, @params)
+          React::Server.render_to_static_markup(element)
+        end
+
+        def failure_string(negative = false)
+          str = "expected '#{@component.name}' with params '#{@params}' to "
+          str = str + "not " if negative
+          str = str + "render '#{@expected}', but '#{@actual}' was rendered."
+          str
+        end
+      end
+
+      def render_static_html(*args)
+        RenderHTMLMatcher.new(*args)
+      end
+
+      def render(*args)
+        %x{ console.error("Warning: `render` matcher is deprecated in favor of `render_static_html`."); }
+        RenderHTMLMatcher.new(*args)
+      end
+    end
+  end
+end

data/lib/react/test/rspec.rb

@@ -0,0 +1,15 @@
+require 'react/test/dsl'
+require 'react/test/matchers/render_html_matcher'
+
+RSpec.configure do |config|
+  config.include React::Test::DSL, type: :component
+  config.include React::Test::Matchers, type: :component
+
+  config.after do
+    React::Test.reset_session!
+  end
+
+  config.before do
+    # nothing yet
+  end
+end

data/lib/react/test/session.rb

@@ -0,0 +1,37 @@
+module React
+  module Test
+    class Session
+      DSL_METHODS = %i[mount instance update_params html].freeze
+
+      def mount(component_klass, params = {})
+        @element = React.create_element(component_klass, params)
+        instance
+      end
+
+      def instance
+        unless @instance
+          @container = `document.createElement('div')`
+          @instance = React.render(@element, @container)
+        end
+        @instance
+      end
+
+      def update_params(params, &block)
+        cloned_element = React::Element.new(`React.cloneElement(#{@element.to_n}, #{params.to_n})`)
+        React.render(cloned_element, @container, &block)
+        nil
+      end
+
+      def html
+        html = `#@container.innerHTML`
+        %x{
+            var REGEX_REMOVE_ROOT_IDS = /\s?data-reactroot="[^"]*"/g;
+            var REGEX_REMOVE_IDS = /\s?data-reactid="[^"]+"/g;
+            html = html.replace(REGEX_REMOVE_ROOT_IDS, '');
+            html = html.replace(REGEX_REMOVE_IDS, '');
+        }
+        return html
+      end
+    end
+  end
+end

data/lib/react/test/utils.rb

@@ -0,0 +1,71 @@
+module React
+  module Test
+    class Utils
+      def self.render_component_into_document(component, args = {})
+        element = React.create_element(component, args)
+        render_into_document(element)
+      end
+
+      def self.render_into_document(element)
+        raise "You should pass a valid React::Element" unless React.is_valid_element?(element)
+        dom_el = `document.body.querySelector('div[data-react-class="React.TopLevelRailsComponent"]').appendChild(document.createElement('div'))`
+        React.render(element, dom_el)
+      end
+
+      def self.simulate_click(element)
+        # element must be a component or a dom node or a element
+        el =  if `typeof element.nodeType !== "undefined"`
+                element
+              elsif element.is_a? React::Component
+                element.dom_node
+              elsif element.is_a? React::Element
+                `ReactDOM.findDOMNode(#{element.to_n}.native)`
+              else
+                element
+              end
+        %x{
+          var evob = new MouseEvent('click', {
+            view: window,
+            bubbles: true,
+            cancelable: true
+          });
+          el.dispatchEvent(evob);
+        }
+      end
+
+      def self.simulate_keydown(element, key_name = "Enter")
+        # element must be a component or a dom node or a element
+        el =  if `typeof element.nodeType !== "undefined"`
+                element
+              elsif element.is_a? React::Component
+                element.dom_node
+              elsif element.is_a? React::Element
+                `ReactDOM.findDOMNode(#{element.to_n}.native)`
+              else
+                element
+              end
+        %x{
+          var evob = new KeyboardEvent('keydown', { key: key_name, bubbles: true, cancelable: true });
+          el.dispatchEvent(evob);
+        }
+      end
+
+      def self.simulate_submit(element)
+        # element must be a component or a dom node or a element
+        el =  if `typeof element.nodeType !== "undefined"`
+                element
+              elsif element.is_a? React::Component
+                element.dom_node
+              elsif element.is_a? React::Element
+                `ReactDOM.findDOMNode(#{element.to_n}.native)`
+              else
+                element
+              end
+        %x{
+          var evob = new Event('submit', { bubbles: true, cancelable: true });
+          el.dispatchEvent(evob);
+        }
+      end
+    end
+  end
+end

data/lib/react/top_level.rb

@@ -0,0 +1,110 @@
+require "native"
+require 'active_support/core_ext/object/try'
+require 'react/component/tags'
+require 'react/component/base'
+
+module React
+
+  ATTRIBUTES = %w(accept acceptCharset accessKey action allowFullScreen allowTransparency alt
+                async autoComplete autoPlay cellPadding cellSpacing charSet checked classID
+                className cols colSpan content contentEditable contextMenu controls coords
+                crossOrigin data dateTime defer dir disabled download draggable encType form
+                formAction formEncType formMethod formNoValidate formTarget frameBorder height
+                hidden href hrefLang htmlFor httpEquiv icon id label lang list loop manifest
+                marginHeight marginWidth max maxLength media mediaGroup method min multiple
+                muted name noValidate open pattern placeholder poster preload radioGroup
+                readOnly rel required role rows rowSpan sandbox scope scrolling seamless
+                selected shape size sizes span spellCheck src srcDoc srcSet start step style
+                tabIndex target title type useMap value width wmode dangerouslySetInnerHTML) +
+                #SVG ATTRIBUTES
+                %w(clipPath cx cy d dx dy fill fillOpacity fontFamily
+                fontSize fx fy gradientTransform gradientUnits markerEnd
+                markerMid markerStart offset opacity patternContentUnits
+                patternUnits points preserveAspectRatio r rx ry spreadMethod
+                stopColor stopOpacity stroke  strokeDasharray strokeLinecap
+                strokeOpacity strokeWidth textAnchor transform version
+                viewBox x1 x2 x xlinkActuate xlinkArcrole xlinkHref xlinkRole
+                xlinkShow xlinkTitle xlinkType xmlBase xmlLang xmlSpace y1 y2 y)
+  HASH_ATTRIBUTES = %w(data aria)
+  HTML_TAGS = React::Component::Tags::HTML_TAGS
+
+  def self.html_tag?(name)
+    tags = HTML_TAGS
+    %x{
+      for(var i = 0; i < tags.length; i++) {
+        if(tags[i] === name)
+          return true;
+      }
+      return false;
+    }
+  end
+
+  def self.html_attr?(name)
+    attrs = ATTRIBUTES
+    %x{
+      for(var i = 0; i < attrs.length; i++) {
+        if(attrs[i] === name)
+          return true;
+      }
+      return false;
+    }
+  end
+
+  def self.create_element(type, properties = {}, &block)
+    React::API.create_element(type, properties, &block)
+  end
+
+  def self.render(element, container)
+    %x{
+        console.error(
+          "Warning: Using deprecated behavior of `React.render`,",
+          "require \"react/top_level_render\" to get the correct behavior."
+        );
+    }
+    container = `container.$$class ? container[0] : container`
+    if !(`typeof ReactDOM === 'undefined'`)
+      component = Native(`ReactDOM.render(#{element.to_n}, container, function(){#{yield if block_given?}})`) # v0.15+
+    else
+      raise "render is not defined.  In React >= v15 you must import it with ReactDOM"
+    end
+
+    component.class.include(React::Component::API)
+    component
+  end
+
+  def self.is_valid_element(element)
+    %x{ console.error("Warning: `is_valid_element` is deprecated in favor of `is_valid_element?`."); }
+    element.kind_of?(React::Element) && `React.isValidElement(#{element.to_n})`
+  end
+
+  def self.is_valid_element?(element)
+    element.kind_of?(React::Element) && `React.isValidElement(#{element.to_n})`
+  end
+
+  def self.render_to_string(element)
+    %x{ console.error("Warning: `React.render_to_string` is deprecated in favor of `React::Server.render_to_string`."); }
+    if !(`typeof ReactDOMServer === 'undefined'`)
+      React::RenderingContext.build { `ReactDOMServer.renderToString(#{element.to_n})` } # v0.15+
+    else
+      raise "renderToString is not defined.  In React >= v15 you must import it with ReactDOMServer"
+    end
+  end
+
+  def self.render_to_static_markup(element)
+    %x{ console.error("Warning: `React.render_to_static_markup` is deprecated in favor of `React::Server.render_to_static_markup`."); }
+    if !(`typeof ReactDOMServer === 'undefined'`)
+      React::RenderingContext.build { `ReactDOMServer.renderToStaticMarkup(#{element.to_n})` } # v0.15+
+    else
+      raise "renderToStaticMarkup is not defined.  In React >= v15 you must import it with ReactDOMServer"
+    end
+  end
+
+  def self.unmount_component_at_node(node)
+    if !(`typeof ReactDOM === 'undefined'`)
+      `ReactDOM.unmountComponentAtNode(node.$$class ? node[0] : node)` # v0.15+
+    else
+      raise "unmountComponentAtNode is not defined.  In React >= v15 you must import it with ReactDOM"
+    end
+  end
+
+end

data/lib/react/top_level_render.rb

@@ -0,0 +1,28 @@
+module React
+  def self.render(element, container)
+    raise "ReactDOM.render is not defined.  In React >= v15 you must import it with ReactDOM" if (`typeof ReactDOM === 'undefined'`)
+
+    container = `container.$$class ? container[0] : container`
+
+    if block_given?
+      cb = %x{
+        function(){
+          setTimeout(function(){
+            #{yield}
+          }, 0)
+        }
+      }
+      native = `ReactDOM.render(#{element.to_n}, container, cb)`
+    else
+      native = `ReactDOM.render(#{element.to_n}, container)`
+    end
+    
+    if `#{native}.__opalInstance !== undefined && #{native}.__opalInstance !== null`
+      `#{native}.__opalInstance`
+    elsif `ReactDOM.findDOMNode !== undefined && #{native}.nodeType === undefined`
+      `ReactDOM.findDOMNode(#{native})`
+    else
+      native
+    end
+  end
+end

data/lib/react/validator.rb

@@ -0,0 +1,136 @@
+module React
+  class Validator
+    attr_accessor :errors
+    attr_reader :props_wrapper
+    private :errors, :props_wrapper
+
+    def initialize(props_wrapper = Class.new(Component::PropsWrapper))
+      @props_wrapper = props_wrapper
+    end
+
+    def self.build(&block)
+      self.new.build(&block)
+    end
+
+    def build(&block)
+      instance_eval(&block)
+      self
+    end
+
+    def requires(name, options = {})
+      options[:required] = true
+      define_rule(name, options)
+    end
+
+    def optional(name, options = {})
+      options[:required] = false
+      define_rule(name, options)
+    end
+
+    def allow_undefined_props=(allow)
+      @allow_undefined_props = allow
+    end
+
+    def undefined_props(props)
+      self.allow_undefined_props = true
+      props.reject { |name, value| rules[name] }
+    end
+
+    def validate(props)
+      self.errors = []
+      validate_undefined(props) unless allow_undefined_props?
+      props = coerce_native_hash_values(defined_props(props))
+      validate_required(props)
+      props.each do |name, value|
+        validate_types(name, value)
+        validate_allowed(name, value)
+      end
+      errors
+    end
+
+    def default_props
+      rules
+        .select {|key, value| value.keys.include?("default") }
+        .inject({}) {|memo, (k,v)| memo[k] = v[:default]; memo}
+    end
+
+    private
+
+    def defined_props(props)
+      props.select { |name| rules.keys.include?(name) }
+    end
+
+    def allow_undefined_props?
+      !!@allow_undefined_props
+    end
+
+    def rules
+      @rules ||= { children: { required: false } }
+    end
+
+    def define_rule(name, options = {})
+      rules[name] = coerce_native_hash_values(options)
+      props_wrapper.define_param(name, options[:type])
+    end
+
+    def errors
+      @errors ||= []
+    end
+
+    def validate_types(prop_name, value)
+      return unless klass = rules[prop_name][:type]
+      if !klass.is_a?(Array)
+        allow_nil = !!rules[prop_name][:allow_nil]
+        type_check("`#{prop_name}`", value, klass, allow_nil)
+      elsif klass.length > 0
+        validate_value_array(prop_name, value)
+      else
+        allow_nil = !!rules[prop_name][:allow_nil]
+        type_check("`#{prop_name}`", value, Array, allow_nil)
+      end
+    end
+
+    def type_check(prop_name, value, klass, allow_nil)
+      return if allow_nil && value.nil?
+      return if value.is_a?(klass)
+      return if klass.respond_to?(:_react_param_conversion) &&
+        klass._react_param_conversion(value, :validate_only)
+      errors << "Provided prop #{prop_name} could not be converted to #{klass}"
+    end
+
+    def validate_allowed(prop_name, value)
+      return unless values = rules[prop_name][:values]
+      return if values.include?(value)
+      errors << "Value `#{value}` for prop `#{prop_name}` is not an allowed value"
+    end
+
+    def validate_required(props)
+      (rules.keys - props.keys).each do |name|
+        next unless rules[name][:required]
+        errors << "Required prop `#{name}` was not specified"
+      end
+    end
+
+    def validate_undefined(props)
+      (props.keys - rules.keys).each do |prop_name|
+        errors <<  "Provided prop `#{prop_name}` not specified in spec"
+      end
+    end
+
+    def validate_value_array(name, value)
+      klass = rules[name][:type]
+      allow_nil = !!rules[name][:allow_nil]
+      value.each_with_index do |item, index|
+        type_check("`#{name}`[#{index}]", Native(item), klass[0], allow_nil)
+      end
+    rescue NoMethodError
+      errors << "Provided prop `#{name}` was not an Array"
+    end
+
+    def coerce_native_hash_values(hash)
+      hash.each do |key, value|
+        hash[key] = Native(value)
+      end
+    end
+  end
+end