isomorfeus-react 16.13.6 → 16.13.7

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (28) hide show
  1. checksums.yaml +4 -4
  2. data/lib/isomorfeus/top_level.rb +0 -7
  3. data/lib/isomorfeus_react/lucid_app/mixin.rb +7 -2
  4. data/lib/isomorfeus_react/lucid_app/native_component_constructor.rb +18 -6
  5. data/lib/isomorfeus_react/lucid_app/native_lucid_component_constructor.rb +1 -2
  6. data/lib/isomorfeus_react/lucid_component/mixin.rb +7 -2
  7. data/lib/isomorfeus_react/lucid_component/native_component_constructor.rb +3 -3
  8. data/lib/isomorfeus_react/lucid_component/native_lucid_component_constructor.rb +2 -3
  9. data/lib/isomorfeus_react/lucid_func/mixin.rb +7 -2
  10. data/lib/isomorfeus_react/lucid_func/native_component_constructor.rb +3 -4
  11. data/lib/isomorfeus_react/react/function_component/mixin.rb +5 -1
  12. data/lib/isomorfeus_react/react/function_component/native_component_constructor.rb +3 -2
  13. data/lib/isomorfeus_react/react/memo_component/mixin.rb +5 -1
  14. data/lib/isomorfeus_react/react/memo_component/native_component_constructor.rb +2 -3
  15. data/lib/isomorfeus_react_material/lucid_material/app/native_component_constructor.rb +17 -5
  16. data/lib/isomorfeus_react_material/lucid_material/component/native_component_constructor.rb +1 -1
  17. data/lib/isomorfeus_react_material/lucid_material/func/native_component_constructor.rb +3 -4
  18. data/lib/react.rb +120 -97
  19. data/lib/react/component/features.rb +1 -3
  20. data/lib/react/component/mixin.rb +5 -1
  21. data/lib/react/component/native_component_constructor.rb +2 -3
  22. data/lib/react/component/resolution.rb +47 -63
  23. data/lib/react/component/styles.rb +2 -23
  24. data/lib/react/context_wrapper.rb +3 -5
  25. data/lib/react/native_constant_wrapper.rb +0 -1
  26. data/lib/react/version.rb +1 -1
  27. metadata +4 -5
  28. data/lib/isomorfeus/vivify_module.rb +0 -43
checksums.yaml CHANGED
@@ -1,7 +1,7 @@
1
1
  ---
2
2
  SHA256:
3
- metadata.gz: e5f97bbd2f1542a8acddd67498fffd95bd2b1c9e08ca3da26010470af0b56f30
4
- data.tar.gz: aa2125291618e7a529acef65ce56e6525a35129f8fec12d847333ac5aa3412a2
3
+ metadata.gz: 00ebd90f9dcc932229cd15abf790ba5b3cdfeb793d56cb0521f98a953a3b4371
4
+ data.tar.gz: 929ac44e9f43761ce833a3c704d80d88cc9aa20bb5c47ef20d612986d5f16092
5
5
  SHA512:
6
- metadata.gz: 805bbca266c1a7426d64a154a4c1c3ae01f776f2d09942974751b9124cb941839b857569e11ed3e9343f4708afcd05ff8ae3add262329cfdf44f18903f5adb7b
7
- data.tar.gz: 601c4c263c4e50e284a54764b76debf59e35bd380d8f06082adff46a9e28411079d3bc409214e1b22c29fae6ae30f4cb6109cba46b71643948aee2ae4c5cbbaf
6
+ metadata.gz: 8b008ddea28e398f7c5d777e2f27fd99c6b0a18780d58cd7108f6f203c25d571fbd18f2268fed1fe37e6ad9b681c2cd3cfbdc938dadda831c778691fe2ba56b4
7
+ data.tar.gz: c36be091b3c641a9eefc22516895288dbaab2a335b150f06c4e0f76aaf1513350d18d73a569203fb1e22f8fc733912d78a35e732131b06cbbe07bb1bd7d799d3
@@ -72,13 +72,6 @@ module Isomorfeus
72
72
  }
73
73
  ready_fun(run);
74
74
  }
75
- # %x{
76
- # function run() { block.$call() };
77
- # function ready_fun() {
78
- # /in/.test(document.readyState) ? setTimeout(ready_fun,5) : run();
79
- # }
80
- # ready_fun();
81
- # }
82
75
  end
83
76
 
84
77
  def on_ready_mount(component, props = nil, element_query = nil)
@@ -3,9 +3,14 @@ module LucidApp
3
3
  def self.included(base)
4
4
  base.include(::Native::Wrapper)
5
5
  base.extend(::LucidApp::NativeLucidComponentConstructor)
6
- base.extend(::LucidApp::NativeComponentConstructor)
6
+ if on_browser? || on_ssr?
7
+ base.extend(::LucidApp::NativeComponentConstructor)
8
+ base.include(::React::Component::Elements)
9
+ elsif on_mobile?
10
+ base.extend(::LucidApp::ReactNativeComponentConstructor)
11
+ base.include(::ReactNative::Component::Elements)
12
+ end
7
13
  base.extend(::LucidPropDeclaration::Mixin)
8
- base.include(::React::Component::Elements)
9
14
  base.include(::React::Component::Api)
10
15
  base.include(::React::Component::Callbacks)
11
16
  base.include(::LucidComponent::Api)
@@ -14,7 +14,7 @@ module LucidApp
14
14
  let classes = null;
15
15
  let theme = opag.ReactJSS.useTheme();
16
16
  if (base.jss_styles) {
17
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
17
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
18
18
  let styles;
19
19
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
20
20
  else { styles = base.jss_styles; }
@@ -24,13 +24,25 @@ module LucidApp
24
24
  }
25
25
  let themed_classes_props = Object.assign({}, props, { classes: classes, theme: theme });
26
26
  return opag.React.createElement(base.lucid_react_component, themed_classes_props);
27
- }
27
+ };
28
28
  base.themed_react_component.displayName = #{theme_component_name};
29
- base.react_component = function(props) {
30
- let themed_component = Opal.global.React.createElement(base.themed_react_component, props);
31
- return Opal.global.React.createElement(Opal.global.ReactJSS.ThemeProvider, { theme: base.jss_theme }, themed_component);
29
+ base.react_component = class extends Opal.global.React.Component {
30
+ constructor(props) {
31
+ super(props);
32
+ if (Opal.Isomorfeus.$top_component() == nil) { Opal.Isomorfeus['$top_component='](this); }
33
+ }
34
+ static get displayName() {
35
+ return "IsomorfeusTopLevelComponent";
36
+ }
37
+ static set displayName(new_name) {
38
+ // dont do anything here except returning the set value
39
+ return new_name;
40
+ }
41
+ render() {
42
+ let themed_component = Opal.global.React.createElement(base.themed_react_component, this.props);
43
+ return Opal.global.React.createElement(Opal.global.ReactJSS.ThemeProvider, { theme: base.jss_theme }, themed_component);
44
+ }
32
45
  }
33
- base.react_component.displayName = #{component_name};
34
46
  }
35
47
  end
36
48
  end
@@ -26,7 +26,6 @@ module LucidApp
26
26
  this.state.class_state[#{component_name}] = {};
27
27
  };
28
28
  this.__ruby_instance = base.$new(this);
29
- if (Opal.Isomorfeus.$top_component() == nil) { Opal.Isomorfeus['$top_component='](this); }
30
29
  var defined_refs = #{base.defined_refs};
31
30
  for (var ref in defined_refs) {
32
31
  if (defined_refs[ref] != null) {
@@ -63,7 +62,7 @@ module LucidApp
63
62
  let block_result;
64
63
  if (base.while_loading_block && !this.state.preloaded) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
65
64
  else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
66
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
65
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
67
66
  oper.active_redux_components.pop();
68
67
  oper.active_components.pop();
69
68
  let children = oper.render_buffer.pop();
@@ -3,9 +3,14 @@ module LucidComponent
3
3
  def self.included(base)
4
4
  base.include(::Native::Wrapper)
5
5
  base.extend(::LucidComponent::NativeLucidComponentConstructor)
6
- base.extend(::LucidComponent::NativeComponentConstructor)
6
+ if on_browser? || on_ssr?
7
+ base.extend(::LucidComponent::NativeComponentConstructor)
8
+ base.include(::React::Component::Elements)
9
+ elsif on_mobile?
10
+ base.extend(::LucidComponent::ReactNativeComponentConstructor)
11
+ base.include(::ReactNative::Component::Elements)
12
+ end
7
13
  base.extend(::LucidPropDeclaration::Mixin)
8
- base.include(::React::Component::Elements)
9
14
  base.include(::React::Component::Api)
10
15
  base.include(::React::Component::Callbacks)
11
16
  base.include(::LucidComponent::Api)
@@ -9,12 +9,12 @@ module LucidComponent
9
9
  %x{
10
10
  base.react_component = function(props) {
11
11
  let opag = Opal.global;
12
- let classes = null;
12
+ let classes;
13
13
  let store;
14
14
  if (base.store_updates) { store = opag.React.useContext(opag.LucidApplicationContext); }
15
15
  let theme = opag.ReactJSS.useTheme();
16
16
  if (base.jss_styles) {
17
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
17
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
18
18
  let styles;
19
19
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
20
20
  else { styles = base.jss_styles; }
@@ -27,7 +27,7 @@ module LucidComponent
27
27
  new_props.theme = theme;
28
28
  new_props.store = store;
29
29
  return opag.React.createElement(base.lucid_react_component, new_props);
30
- }
30
+ };
31
31
  base.react_component.displayName = #{component_name};
32
32
  }
33
33
  end
@@ -51,13 +51,12 @@ module LucidComponent
51
51
  let block_result;
52
52
  if (base.while_loading_block && !this.state.preloaded) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
53
53
  else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
54
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
54
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
55
55
  oper.active_redux_components.pop();
56
56
  oper.active_components.pop();
57
57
  // console.log("lucid component popping", oper.render_buffer, oper.render_buffer.toString());
58
58
  let result = oper.render_buffer.pop();
59
- if (result.length === 1) { return result[0]; }
60
- return result;
59
+ return (result.length === 1) ? result[0] : result;
61
60
  }
62
61
  data_access() {
63
62
  return this.props.store;
@@ -1,11 +1,16 @@
1
1
  module LucidFunc
2
2
  module Mixin
3
3
  def self.included(base)
4
- base.include(::React::Component::Elements)
5
4
  base.include(::React::Component::Features)
6
5
  base.include(::LucidFunc::Initializer)
7
6
  base.include(::React::FunctionComponent::Api)
8
- base.extend(::LucidFunc::NativeComponentConstructor)
7
+ if on_browser? || on_ssr?
8
+ base.extend(::LucidFunc::NativeComponentConstructor)
9
+ base.include(::React::Component::Elements)
10
+ elsif on_mobile?
11
+ base.extend(::LucidFunc::ReactNativeComponentConstructor)
12
+ base.include(::ReactNative::Component::Elements)
13
+ end
9
14
  base.include(::LucidComponent::Api)
10
15
  end
11
16
  end
@@ -24,7 +24,7 @@ module LucidFunc
24
24
  if (base.store_updates) { store = og.React.useContext(og.LucidApplicationContext); }
25
25
  let theme = og.ReactJSS.useTheme();
26
26
  if (base.jss_styles) {
27
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
27
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
28
28
  let styles;
29
29
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
30
30
  else { styles = base.jss_styles; }
@@ -42,13 +42,12 @@ module LucidFunc
42
42
  oper.active_components.push(__ruby_instance);
43
43
  oper.active_redux_components.push(__ruby_instance);
44
44
  let block_result = #{`__ruby_instance`.instance_exec(&`base.render_block`)};
45
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
45
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
46
46
  oper.active_redux_components.pop();
47
47
  oper.active_components.pop();
48
48
  // console.log("function popping", oper.render_buffer, oper.render_buffer.toString());
49
49
  let result = oper.render_buffer.pop();
50
- if (result.length === 1) { return result[0]; }
51
- return result;
50
+ return (result.length === 1) ? result[0] : result;
52
51
  }, base.equality_checker);
53
52
  base.react_component.displayName = #{component_name};
54
53
  }
@@ -2,7 +2,11 @@ module React
2
2
  module FunctionComponent
3
3
  module Mixin
4
4
  def self.included(base)
5
- base.include(::React::Component::Elements)
5
+ if on_browser? || on_ssr?
6
+ base.include(::React::Component::Elements)
7
+ elsif on_mobile?
8
+ base.include(::ReactNative::Component::Elements)
9
+ end
6
10
  base.include(::React::Component::Features)
7
11
  base.include(::React::FunctionComponent::Initializer)
8
12
  base.include(::React::FunctionComponent::Api)
@@ -19,10 +19,11 @@ module React
19
19
  __ruby_instance.props = props;
20
20
  oper.active_components.push(__ruby_instance);
21
21
  let block_result = #{`__ruby_instance`.instance_exec(&`base.render_block`)};
22
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
22
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
23
23
  oper.active_components.pop();
24
24
  // console.log("function popping", oper.render_buffer, oper.render_buffer.toString());
25
- return oper.render_buffer.pop();
25
+ let result = oper.render_buffer.pop();
26
+ return (result.length === 1) ? result[0] : result;
26
27
  }
27
28
  base.react_component.displayName = #{component_name};
28
29
  }
@@ -2,7 +2,11 @@ module React
2
2
  module MemoComponent
3
3
  module Mixin
4
4
  def self.included(base)
5
- base.include(::React::Component::Elements)
5
+ if on_browser? || on_ssr?
6
+ base.include(::React::Component::Elements)
7
+ elsif on_mobile?
8
+ base.include(::ReactNative::Component::Elements)
9
+ end
6
10
  base.include(::React::Component::Features)
7
11
  base.include(::React::FunctionComponent::Initializer)
8
12
  base.include(::React::FunctionComponent::Api)
@@ -20,12 +20,11 @@ module React
20
20
  __ruby_instance.props = props;
21
21
  oper.active_components.push(__ruby_instance);
22
22
  let block_result = #{`__ruby_instance`.instance_exec(&`base.render_block`)};
23
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
23
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
24
24
  oper.active_components.pop();
25
25
  // console.log("memo popping", oper.render_buffer, oper.render_buffer.toString());
26
26
  let result = oper.render_buffer.pop();
27
- if (result.length === 1) { return result[0]; }
28
- return result;
27
+ return (result.length === 1) ? result[0] : result;
29
28
  }, base.equality_checker);
30
29
  base.react_component.displayName = #{component_name};
31
30
  }
@@ -15,7 +15,7 @@ module LucidMaterial
15
15
  let classes = null;
16
16
  let theme = opag.MuiStyles.useTheme();
17
17
  if (base.jss_styles) {
18
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
18
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
19
19
  let styles;
20
20
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
21
21
  else { styles = base.jss_styles; }
@@ -27,11 +27,23 @@ module LucidMaterial
27
27
  return opag.React.createElement(base.lucid_react_component, themed_classes_props);
28
28
  }
29
29
  base.themed_react_component.displayName = #{theme_component_name};
30
- base.react_component = function(props) {
31
- let themed_component = Opal.global.React.createElement(base.themed_react_component, props);
32
- return Opal.global.React.createElement(Opal.global.MuiStyles.ThemeProvider, { theme: base.jss_theme }, themed_component);
30
+ base.react_component = class extends Opal.global.React.Component {
31
+ constructor(props) {
32
+ super(props);
33
+ if (Opal.Isomorfeus.$top_component() == nil) { Opal.Isomorfeus['$top_component='](this); }
34
+ }
35
+ static get displayName() {
36
+ return "IsomorfeusTopLevelComponent";
37
+ }
38
+ static set displayName(new_name) {
39
+ // dont do anything here except returning the set value
40
+ return new_name;
41
+ }
42
+ render() {
43
+ let themed_component = Opal.global.React.createElement(base.themed_react_component, this.props);
44
+ return Opal.global.React.createElement(Opal.global.MuiStyles.ThemeProvider, { theme: base.jss_theme }, themed_component);
45
+ }
33
46
  }
34
- base.react_component.displayName = #{component_name};
35
47
  }
36
48
  end
37
49
  end
@@ -14,7 +14,7 @@ module LucidMaterial
14
14
  if (base.store_updates) { store = Opal.global.React.useContext(Opal.global.LucidApplicationContext); }
15
15
  let theme = Opal.global.MuiStyles.useTheme();
16
16
  if (base.jss_styles) {
17
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
17
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
18
18
  let styles;
19
19
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
20
20
  else { styles = base.jss_styles; }
@@ -25,7 +25,7 @@ module LucidMaterial
25
25
  if (base.store_updates) { store = og.React.useContext(og.LucidApplicationContext); }
26
26
  let theme = og.MuiStyles.useTheme();
27
27
  if (base.jss_styles) {
28
- if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
28
+ if (!base.use_styles || (Opal.Isomorfeus.development === true)) {
29
29
  let styles;
30
30
  if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
31
31
  else { styles = base.jss_styles; }
@@ -43,13 +43,12 @@ module LucidMaterial
43
43
  oper.active_components.push(__ruby_instance);
44
44
  oper.active_redux_components.push(__ruby_instance);
45
45
  let block_result = #{`__ruby_instance`.instance_exec(&`base.render_block`)};
46
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
46
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
47
47
  oper.active_redux_components.pop();
48
48
  oper.active_components.pop();
49
49
  // console.log("function popping", oper.render_buffer, oper.render_buffer.toString());
50
50
  let result = oper.render_buffer.pop();
51
- if (result.length === 1) { return result[0]; }
52
- return result;
51
+ return (result.length === 1) ? result[0] : result;
53
52
  }, base.equality_checker);
54
53
  base.react_component.displayName = #{component_name};
55
54
  }
data/lib/react.rb CHANGED
@@ -1,5 +1,4 @@
1
1
  module React
2
- # language=JS
3
2
  %x{
4
3
  self.render_buffer = [];
5
4
 
@@ -34,79 +33,6 @@ module React
34
33
  else { return Opal.Hash.$new(event); }
35
34
  };
36
35
 
37
- self.to_native_react_props = function(ruby_style_props) {
38
- let result = {};
39
- let keys = ruby_style_props.$keys();
40
- let keys_length = keys.length;
41
- let key = '';
42
- for (let i = 0; i < keys_length; i++) {
43
- key = keys[i];
44
- if (key[0] === 'o' && key[1] === 'n' && key[2] === '_') {
45
- let handler = ruby_style_props['$[]'](key);
46
- let type = typeof handler;
47
- if (type === "function") {
48
- let active_c = self.active_component();
49
- result[self.lower_camelize(key)] = function(event, info) {
50
- let ruby_event = self.native_to_ruby_event(event);
51
- #{`active_c.__ruby_instance`.instance_exec(`ruby_event`, `info`, &`handler`)};
52
- }
53
- } else if (type === "object" && typeof handler.$call === "function" ) {
54
- if (!handler.react_event_handler_function) {
55
- handler.react_event_handler_function = function(event, info) {
56
- let ruby_event = self.native_to_ruby_event(event);
57
- handler.$call(ruby_event, info)
58
- };
59
- }
60
- result[self.lower_camelize(key)] = handler.react_event_handler_function;
61
- } else if (type === "string" ) {
62
- let active_component = self.active_component();
63
- let method_ref;
64
- let method_name = '$' + handler;
65
- if (typeof active_component[method_name] === "function") {
66
- // got a ruby instance
67
- if (active_component.native && active_component.native.method_refs && active_component.native.method_refs[handler]) { method_ref = active_component.native.method_refs[handler]; } // ruby instance with native
68
- else if (active_component.method_refs && active_component.method_refs[handler]) { method_ref = active_component.method_refs[handler]; } // ruby function component
69
- else { method_ref = active_component.$method_ref(handler); } // create the ref
70
- } else if (typeof active_component.__ruby_instance[method_name] === "function") {
71
- // got a native instance
72
- if (active_component.method_refs && active_component.method_refs[handler]) { method_ref = active_component.method_refs[handler]; }
73
- else { method_ref = active_component.__ruby_instance.$method_ref(handler); } // create ref for native
74
- }
75
- if (method_ref) {
76
- if (!method_ref.react_event_handler_function) {
77
- method_ref.react_event_handler_function = function(event, info) {
78
- let ruby_event = self.native_to_ruby_event(event);
79
- method_ref.$call(ruby_event, info)
80
- };
81
- }
82
- result[self.lower_camelize(key)] = method_ref.react_event_handler_function;
83
- } else {
84
- let component_name;
85
- if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
86
- else { component_name = active_component.$to_s(); }
87
- #{Isomorfeus.raise_error(message: "Is #{`handler`} a valid method of #{`component_name`}? If so then please use: #{`key`}: method_ref(:#{`handler`}) within component: #{`component_name`}")}
88
- }
89
- } else {
90
- let active_component = self.active_component();
91
- let component_name;
92
- if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
93
- else { component_name = active_component.$to_s(); }
94
- #{Isomorfeus.raise_error(message: "Received invalid value for #{`key`} with #{`handler`} within component: #{`component_name`}")}
95
- console.error( + key + " event handler:", handler, " within component:", self.active_component());
96
- }
97
- } else if (key[0] === 'a' && key.startsWith("aria_")) {
98
- result[key.replace("_", "-")] = ruby_style_props['$[]'](key);
99
- } else if (key === "style") {
100
- let val = ruby_style_props['$[]'](key);
101
- if (typeof val.$to_n === "function") { val = val.$to_n() }
102
- result["style"] = val;
103
- } else {
104
- result[key.indexOf('_') > 0 ? self.lower_camelize(key) : key] = ruby_style_props['$[]'](key);
105
- }
106
- }
107
- return result;
108
- };
109
-
110
36
  self.internal_prepare_args_and_render = function(component, args, block) {
111
37
  const operain = self.internal_render;
112
38
  if (args.length > 0) {
@@ -118,26 +44,6 @@ module React
118
44
  } else { operain(component, null, null, block); }
119
45
  };
120
46
 
121
- self.internal_render = function(component, props, string_child, block) {
122
- const operabu = self.render_buffer;
123
- let children;
124
- let native_props = null;
125
- if (string_child) {
126
- children = [string_child];
127
- } else if (block && block !== nil) {
128
- operabu.push([]);
129
- // console.log("internal_render pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
130
- let block_result = block.$call();
131
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) {
132
- operabu[operabu.length - 1].push(block_result);
133
- }
134
- // console.log("internal_render popping", Opal.React.render_buffer, Opal.React.render_buffer.toString());
135
- children = operabu.pop();
136
- }
137
- if (props && props !== nil) { native_props = self.to_native_react_props(props); }
138
- operabu[operabu.length - 1].push(Opal.global.React.createElement.apply(this, [component, native_props].concat(children)));
139
- };
140
-
141
47
  self.active_components = [];
142
48
 
143
49
  self.active_component = function() {
@@ -153,8 +59,127 @@ module React
153
59
  if (length === 0) { return null; };
154
60
  return self.active_redux_components[length-1];
155
61
  };
62
+
63
+ function isObject(obj) { return (obj && typeof obj === 'object'); }
64
+
65
+ self.merge_deep = function(one, two) {
66
+ return [one, two].reduce(function(pre, obj) {
67
+ Object.keys(obj).forEach(function(key){
68
+ let pVal = pre[key];
69
+ let oVal = obj[key];
70
+ if (Array.isArray(pVal) && Array.isArray(oVal)) {
71
+ pre[key] = pVal.concat.apply(this, oVal);
72
+ } else if (isObject(pVal) && isObject(oVal)) {
73
+ pre[key] = self.merge_deep(pVal, oVal);
74
+ } else {
75
+ pre[key] = oVal;
76
+ }
77
+ });
78
+ return pre;
79
+ }, {});
80
+ };
156
81
  }
157
82
 
83
+ if on_browser? || on_ssr?
84
+ %x{
85
+ self.to_native_react_props = function(ruby_style_props) {
86
+ let result = {};
87
+ let keys = ruby_style_props.$$keys;
88
+ let keys_length = keys.length;
89
+ let key = '';
90
+ for (let i = 0; i < keys_length; i++) {
91
+ key = keys[i];
92
+ let value = ruby_style_props.$$smap[key];
93
+ if (key[0] === 'o' && key[1] === 'n' && key[2] === '_') {
94
+ let type = typeof value;
95
+ if (type === "function") {
96
+ let active_c = self.active_component();
97
+ result[self.lower_camelize(key)] = function(event, info) {
98
+ let ruby_event = self.native_to_ruby_event(event);
99
+ #{`active_c.__ruby_instance`.instance_exec(`ruby_event`, `info`, &`value`)};
100
+ }
101
+ } else if (type === "object" && typeof value.$call === "function" ) {
102
+ if (!value.react_event_handler_function) {
103
+ value.react_event_handler_function = function(event, info) {
104
+ let ruby_event = self.native_to_ruby_event(event);
105
+ value.$call(ruby_event, info)
106
+ };
107
+ }
108
+ result[self.lower_camelize(key)] = value.react_event_handler_function;
109
+ } else if (type === "string" ) {
110
+ let active_component = self.active_component();
111
+ let method_ref;
112
+ let method_name = '$' + value;
113
+ if (typeof active_component[method_name] === "function") {
114
+ // got a ruby instance
115
+ if (active_component.native && active_component.native.method_refs && active_component.native.method_refs[value]) { method_ref = active_component.native.method_refs[value]; } // ruby instance with native
116
+ else if (active_component.method_refs && active_component.method_refs[value]) { method_ref = active_component.method_refs[value]; } // ruby function component
117
+ else { method_ref = active_component.$method_ref(value); } // create the ref
118
+ } else if (typeof active_component.__ruby_instance[method_name] === "function") {
119
+ // got a native instance
120
+ if (active_component.method_refs && active_component.method_refs[value]) { method_ref = active_component.method_refs[value]; }
121
+ else { method_ref = active_component.__ruby_instance.$method_ref(value); } // create ref for native
122
+ }
123
+ if (method_ref) {
124
+ if (!method_ref.react_event_handler_function) {
125
+ method_ref.react_event_handler_function = function(event, info) {
126
+ let ruby_event = self.native_to_ruby_event(event);
127
+ method_ref.$call(ruby_event, info)
128
+ };
129
+ }
130
+ result[self.lower_camelize(key)] = method_ref.react_event_handler_function;
131
+ } else {
132
+ let component_name;
133
+ if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
134
+ else { component_name = active_component.$to_s(); }
135
+ #{Isomorfeus.raise_error(message: "Is #{`value`} a valid method of #{`component_name`}? If so then please use: #{`key`}: method_ref(:#{`value`}) within component: #{`component_name`}")}
136
+ }
137
+ } else {
138
+ let active_component = self.active_component();
139
+ let component_name;
140
+ if (active_component.__ruby_instance) { component_name = active_component.__ruby_instance.$to_s(); }
141
+ else { component_name = active_component.$to_s(); }
142
+ #{Isomorfeus.raise_error(message: "Received invalid value for #{`key`} with #{`value`} within component: #{`component_name`}")}
143
+ console.error( + key + " event handler:", value, " within component:", self.active_component());
144
+ }
145
+ } else if (key[0] === 'a' && key.startsWith("aria_")) {
146
+ result[key.replace("_", "-")] = value;
147
+ } else if (key === "style") {
148
+ if (typeof value.$to_n === "function") { value = value.$to_n() }
149
+ result["style"] = value;
150
+ } else {
151
+ result[key.indexOf('_') > 0 ? self.lower_camelize(key) : key] = value;
152
+ }
153
+ }
154
+ return result;
155
+ };
156
+
157
+ self.render_block_result = function(block_result) {
158
+ if (block_result.constructor === String || block_result.constructor === Number) {
159
+ Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result);
160
+ }
161
+ };
162
+
163
+ self.internal_render = function(component, props, string_child, block) {
164
+ const operabu = self.render_buffer;
165
+ let children;
166
+ let native_props = null;
167
+ if (string_child) {
168
+ children = [string_child];
169
+ } else if (block && block !== nil) {
170
+ operabu.push([]);
171
+ // console.log("internal_render pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
172
+ let block_result = block.$call();
173
+ if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
174
+ // console.log("internal_render popping", Opal.React.render_buffer, Opal.React.render_buffer.toString());
175
+ children = operabu.pop();
176
+ }
177
+ if (props && props !== nil) { native_props = self.to_native_react_props(props); }
178
+ operabu[operabu.length - 1].push(Opal.global.React.createElement.apply(this, [component, native_props].concat(children)));
179
+ };
180
+ }
181
+ end
182
+
158
183
  def self.clone_element(ruby_react_element, props = nil, children = nil, &block)
159
184
  block_result = `null`
160
185
  if block_given?
@@ -185,9 +210,7 @@ module React
185
210
  operabu.push([]);
186
211
  // console.log("create_element pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
187
212
  let block_result = block.$call();
188
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) {
189
- operabu[operabu.length - 1].push(block_result);
190
- }
213
+ if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
191
214
  // console.log("create_element popping", Opal.React.render_buffer, Opal.React.render_buffer.toString());
192
215
  children = operabu.pop();
193
216
  } else if (children === nil) { children = []; }
@@ -21,9 +21,7 @@ module React
21
21
  let block_result = block.$call()
22
22
  let last_buffer_length = operabu[operabu.length - 1].length;
23
23
  let last_buffer_element = operabu[operabu.length - 1][last_buffer_length - 1];
24
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) {
25
- operabu[operabu.length - 1].push(block_result);
26
- }
24
+ if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
27
25
  }
28
26
  // console.log("portal popping", operabu, operabu.toString());
29
27
  let result = operabu.pop();
@@ -5,7 +5,11 @@ module React
5
5
  base.include(::Native::Wrapper)
6
6
  base.extend(::React::Component::NativeComponentConstructor)
7
7
  base.extend(::LucidPropDeclaration::Mixin)
8
- base.include(::React::Component::Elements)
8
+ if on_browser? || on_ssr?
9
+ base.include(::React::Component::Elements)
10
+ elsif on_mobile?
11
+ base.include(::ReactNative::Component::Elements)
12
+ end
9
13
  base.include(::React::Component::Api)
10
14
  base.include(::React::Component::Callbacks)
11
15
  base.include(::React::Component::Initializer)
@@ -43,12 +43,11 @@ module React
43
43
  // console.log("react component pushed", oper.render_buffer, oper.render_buffer.toString());
44
44
  oper.active_components.push(this);
45
45
  let block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)};
46
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { oper.render_buffer[oper.render_buffer.length - 1].push(block_result); }
46
+ if (block_result && block_result !== nil) { oper.render_block_result(block_result); }
47
47
  // console.log("react component popping", oper.render_buffer, oper.render_buffer.toString());
48
48
  oper.active_components.pop();
49
49
  let result = oper.render_buffer.pop();
50
- if (result.length === 1) { return result[0]; }
51
- return result;
50
+ return (result.length === 1) ? result[0] : result;
52
51
  }
53
52
  shouldComponentUpdate(next_props, next_state) {
54
53
  if (base.should_component_update_block) {
@@ -3,13 +3,15 @@ module React
3
3
  module Resolution
4
4
  def self.included(base)
5
5
  base.instance_exec do
6
- alias _react_component_class_resolution_original_const_missing const_missing
6
+ unless method_defined?(:_react_component_class_resolution_original_const_missing)
7
+ alias _react_component_class_resolution_original_const_missing const_missing
8
+ end
7
9
 
8
10
  def const_missing(const_name)
9
- # language=JS
10
11
  %x{
11
12
  if (typeof Opal.global[const_name] !== "undefined" && (const_name[0] === const_name[0].toUpperCase())) {
12
13
  var new_const = #{React::NativeConstantWrapper.new(`Opal.global[const_name]`, const_name)};
14
+ new_const.react_component = Opal.global[const_name];
13
15
  #{Object.const_set(const_name, `new_const`)};
14
16
  return new_const;
15
17
  } else {
@@ -20,7 +22,6 @@ module React
20
22
 
21
23
  # this is required for autoloading support, as the component may not be loaded and so its method is not registered.
22
24
  # must load it first, done by const_get, and next time the method will be there.
23
-
24
25
  unless method_defined?(:_react_component_class_resolution_original_method_missing)
25
26
  alias _react_component_class_resolution_original_method_missing method_missing
26
27
  end
@@ -28,36 +29,21 @@ module React
28
29
  def method_missing(component_name, *args, &block)
29
30
  # check for ruby component and render it
30
31
  # otherwise pass on method missing
31
- # language=JS
32
32
  %x{
33
- var modules = self.$to_s().split("::");
34
- var modules_length = modules.length;
35
- var module;
36
33
  var constant;
37
- var component;
38
- for (var i = modules_length; i > 0; i--) {
39
- try {
40
- module = modules.slice(0, i).join('::');
41
- constant = self.$const_get(module).$const_get(component_name, false);
42
- if (typeof constant.react_component !== 'undefined') {
43
- component = constant.react_component;
44
- break;
45
- }
46
- } catch(err) { component = null; }
47
- }
48
- if (!component) {
49
- try {
50
- constant = Opal.Object.$const_get(component_name);
51
- if (typeof constant.react_component !== 'undefined') {
52
- component = constant.react_component;
53
- }
54
- } catch(err) { component = null; }
55
- }
56
- if (component) {
57
- return Opal.React.internal_prepare_args_and_render(component, args, block);
58
- } else {
59
- return #{_react_component_class_resolution_original_method_missing(component_name, *args, block)};
60
- }
34
+ if (typeof self.iso_react_const_cache === 'undefined') { self.iso_react_const_cache = {}; }
35
+ try {
36
+ if (typeof self.iso_react_const_cache[component_name] !== 'undefined') {
37
+ constant = self.iso_react_const_cache[component_name]
38
+ } else {
39
+ constant = self.$const_get(component_name);
40
+ self.iso_react_const_cache[component_name] = constant;
41
+ }
42
+ if (typeof constant.react_component !== 'undefined') {
43
+ return Opal.React.internal_prepare_args_and_render(constant.react_component, args, block);
44
+ }
45
+ } catch(err) { }
46
+ return #{_react_component_class_resolution_original_method_missing(component_name, *args, block)};
61
47
  }
62
48
  end
63
49
  end
@@ -68,44 +54,42 @@ module React
68
54
  end
69
55
 
70
56
  def method_missing(component_name, *args, &block)
71
- # html tags are defined as methods, so they will not end up here.
72
- # first check for native component and render it, we want to be fast for native components
73
- # second check for ruby component and render it, they are a bit slower anyway
74
- # third pass on method missing
75
- # language=JS
57
+ # Further on it must check for modules, because $const_get does not take
58
+ # the full nesting into account, as usually its called via $$ with the
59
+ # nesting provided by the compiler.
76
60
  %x{
77
- var component = null;
78
- if (typeof Opal.global[component_name] !== "undefined" && (component_name[0] === component_name[0].toUpperCase())) {
79
- component = Opal.global[component_name];
61
+ var constant;
62
+ if (typeof self.iso_react_const_cache === 'undefined') { self.iso_react_const_cache = {}; }
63
+
64
+ if (typeof self.iso_react_const_cache[component_name] !== 'undefined') {
65
+ constant = self.iso_react_const_cache[component_name]
66
+ } else if (typeof self.$$is_a_module !== 'undefined') {
67
+ try {
68
+ constant = self.$const_get(component_name);
69
+ self.iso_react_const_cache[component_name] = constant;
70
+ } catch(err) { }
80
71
  } else {
81
- var modules = self.$to_s().split("::");
82
- var modules_length = modules.length;
83
- var module;
84
- var constant;
85
- for (var i = modules_length; i > 0; i--) {
86
- try {
87
- module = modules.slice(0, i).join('::');
88
- constant = self.$class().$const_get(module).$const_get(component_name, false);
89
- if (typeof constant.react_component !== 'undefined') {
90
- component = constant.react_component;
72
+ let sc = self.$class();
73
+ try {
74
+ constant = sc.$const_get(component_name);
75
+ self.iso_react_const_cache[component_name] = constant;
76
+ } catch(err) {
77
+ var module_names = sc.$to_s().split("::");
78
+ var module_name;
79
+ for (var i = module_names.length - 1; i > 0; i--) {
80
+ module_name = module_names.slice(0, i).join('::');
81
+ try {
82
+ constant = sc.$const_get(module_name).$const_get(component_name, false);
83
+ self.iso_react_const_cache[component_name] = constant;
91
84
  break;
92
- }
93
- } catch(err) { component = null; }
94
- }
95
- if (!component) {
96
- try {
97
- constant = Opal.Object.$const_get(component_name);
98
- if (typeof constant.react_component !== 'undefined') {
99
- component = constant.react_component;
100
- }
101
- } catch(err) { component = null; }
85
+ } catch(err) { }
86
+ }
102
87
  }
103
88
  }
104
- if (component) {
105
- return Opal.React.internal_prepare_args_and_render(component, args, block);
106
- } else {
107
- return #{_react_component_resolution_original_method_missing(component_name, *args, block)};
89
+ if (constant && typeof constant.react_component !== 'undefined') {
90
+ return Opal.React.internal_prepare_args_and_render(constant.react_component, args, block);
108
91
  }
92
+ return #{_react_component_resolution_original_method_missing(component_name, *args, block)};
109
93
  }
110
94
  end
111
95
  end
@@ -15,35 +15,14 @@ module React
15
15
  method_missing(prop, val)
16
16
  end
17
17
 
18
- %x{
19
- function isObject(obj) { return (obj && typeof obj === 'object'); }
20
-
21
- function mergeDeep(one, two) {
22
- return [one, two].reduce(function(pre, obj) {
23
- Object.keys(obj).forEach(function(key){
24
- let pVal = pre[key];
25
- let oVal = obj[key];
26
- if (Array.isArray(pVal) && Array.isArray(oVal)) {
27
- pre[key] = pVal.concat.apply(this, oVal);
28
- } else if (isObject(pVal) && isObject(oVal)) {
29
- pre[key] = mergeDeep(pVal, oVal);
30
- } else {
31
- pre[key] = oVal;
32
- }
33
- });
34
- return pre;
35
- }, {});
36
- }
37
- }
38
-
39
18
  def deep_merge(a_hash)
40
19
  native_hash = a_hash.to_n
41
- React::Component::Styles.new(`mergeDeep(#@native, native_hash)`)
20
+ React::Component::Styles.new(`Opal.React.merge_deep(#@native, native_hash)`)
42
21
  end
43
22
 
44
23
  def deep_merge!(a_hash)
45
24
  native_hash = a_hash.to_n
46
- `#@native = mergeDeep(#@native, native_hash)`
25
+ `#@native = Opal.React.merge_deep(#@native, native_hash)`
47
26
  self
48
27
  end
49
28
 
@@ -20,13 +20,11 @@ module React
20
20
  operabu.push([]);
21
21
  // console.log("consumer pushed", operabu, operabu.toString());
22
22
  let block_result = block.$call();
23
- if (block_result && (block_result.constructor === String || block_result.constructor === Number)) {
24
- operabu[operabu.length - 1].push(block_result);
25
- }
23
+ if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
26
24
  // console.log("consumer popping", operabu, operabu.toString());
27
25
  children = operabu.pop();
28
- if (children.length == 1) { children = children[0]; }
29
- else if (children.length == 0) { children = null; }
26
+ if (children.length === 1) { children = children[0]; }
27
+ else if (children.length === 0) { children = null; }
30
28
  }
31
29
  return children;
32
30
  });
@@ -8,7 +8,6 @@ module React
8
8
  end
9
9
 
10
10
  def method_missing(name, *args, &block)
11
- # language=JS
12
11
  %x{
13
12
  if (name[0] === 'u' && name[1] === 's' && name[2] === 'e') {
14
13
  if (name.indexOf('_') > 0) { name = Opal.React.lower_camelize(name); }
data/lib/react/version.rb CHANGED
@@ -1,3 +1,3 @@
1
1
  module React
2
- VERSION = '16.13.6'
2
+ VERSION = '16.13.7'
3
3
  end
metadata CHANGED
@@ -1,14 +1,14 @@
1
1
  --- !ruby/object:Gem::Specification
2
2
  name: isomorfeus-react
3
3
  version: !ruby/object:Gem::Version
4
- version: 16.13.6
4
+ version: 16.13.7
5
5
  platform: ruby
6
6
  authors:
7
7
  - Jan Biedermann
8
8
  autorequire:
9
9
  bindir: bin
10
10
  cert_chain: []
11
- date: 2020-03-08 00:00:00.000000000 Z
11
+ date: 2020-03-14 00:00:00.000000000 Z
12
12
  dependencies:
13
13
  - !ruby/object:Gem::Dependency
14
14
  name: concurrent-ruby
@@ -100,14 +100,14 @@ dependencies:
100
100
  requirements:
101
101
  - - "~>"
102
102
  - !ruby/object:Gem::Version
103
- version: 4.0.22
103
+ version: 4.0.23
104
104
  type: :runtime
105
105
  prerelease: false
106
106
  version_requirements: !ruby/object:Gem::Requirement
107
107
  requirements:
108
108
  - - "~>"
109
109
  - !ruby/object:Gem::Version
110
- version: 4.0.22
110
+ version: 4.0.23
111
111
  - !ruby/object:Gem::Dependency
112
112
  name: isomorfeus-speednode
113
113
  requirement: !ruby/object:Gem::Requirement
@@ -203,7 +203,6 @@ files:
203
203
  - lib/isomorfeus/thread_local_component_cache.rb
204
204
  - lib/isomorfeus/top_level.rb
205
205
  - lib/isomorfeus/top_level_ssr.rb
206
- - lib/isomorfeus/vivify_module.rb
207
206
  - lib/isomorfeus_react/lucid_app/api.rb
208
207
  - lib/isomorfeus_react/lucid_app/base.rb
209
208
  - lib/isomorfeus_react/lucid_app/mixin.rb
@@ -1,43 +0,0 @@
1
- module Isomorfeus
2
- class VivifyModule < ::Module
3
- # this is required for autoloading support, as the component may not be loaded and so its method is not registered.
4
- # must load it first, done by const_get, and next time the method will be there.
5
- alias _react_component_class_resolution_original_method_missing method_missing
6
-
7
- def method_missing(component_name, *args, &block)
8
- # check for ruby component and render it
9
- # otherwise pass on method missing
10
- # language=JS
11
- %x{
12
- var constant;
13
- var component = null;
14
- var modules = self.$to_s().split("::");
15
- var modules_length = modules.length;
16
- var module;
17
- for (var i = modules_length; i > 0; i--) {
18
- try {
19
- module = modules.slice(0, i).join('::');
20
- constant = self.$const_get(module).$const_get(component_name, false);
21
- if (typeof constant.react_component !== 'undefined') {
22
- component = constant.react_component;
23
- break;
24
- }
25
- } catch(err) { component = null; }
26
- }
27
- if (!component) {
28
- try {
29
- constant = Opal.Object.$const_get(component_name);
30
- if (typeof constant.react_component !== 'undefined') {
31
- component = constant.react_component;
32
- }
33
- } catch(err) { component = null; }
34
- }
35
- if (component) {
36
- return Opal.React.internal_prepare_args_and_render(component, args, block);
37
- } else {
38
- return #{_react_component_class_resolution_original_method_missing(component_name, *args, block)};
39
- }
40
- }
41
- end
42
- end
43
- end