isomorfeus-react 16.10.11 → 16.10.12
Sign up to get free protection for your applications and to get access to all the features.
- checksums.yaml +4 -4
- data/lib/isomorfeus-react.rb +5 -6
- data/lib/isomorfeus/react_view_helper.rb +26 -5
- data/lib/lucid_app/mixin.rb +4 -1
- data/lib/lucid_app/native_component_constructor.rb +9 -6
- data/lib/lucid_component/environment_support.rb +11 -0
- data/lib/lucid_component/mixin.rb +4 -1
- data/lib/lucid_component/native_component_constructor.rb +9 -6
- data/lib/lucid_component/preloading_support.rb +16 -0
- data/lib/lucid_material/app/mixin.rb +4 -1
- data/lib/lucid_material/app/native_component_constructor.rb +9 -6
- data/lib/lucid_material/component/mixin.rb +5 -2
- data/lib/lucid_material/component/native_component_constructor.rb +9 -6
- data/lib/react.rb +29 -31
- data/lib/react/component/callbacks.rb +12 -3
- data/lib/react/component/event_handler.rb +3 -1
- data/lib/react/component/props.rb +5 -3
- data/lib/react/component/styles.rb +19 -6
- data/lib/react/version.rb +1 -1
- metadata +12 -4
- data/lib/lucid_component/event_handler.rb +0 -21
checksums.yaml
CHANGED
@@ -1,7 +1,7 @@
|
|
1
1
|
---
|
2
2
|
SHA256:
|
3
|
-
metadata.gz:
|
4
|
-
data.tar.gz:
|
3
|
+
metadata.gz: 212995320dc44b1d0044e78018b806842eac6f3a9e9de729276cfdece8678547
|
4
|
+
data.tar.gz: c1b472d9c8e77c452d2f6ebdd479afe798e1a4a6b51e3e7d544066331369be4f
|
5
5
|
SHA512:
|
6
|
-
metadata.gz:
|
7
|
-
data.tar.gz:
|
6
|
+
metadata.gz: '00188bcb28282e7ad13198b3b0e3bf2d1faa28895df3a4488e51cb068adbcc27a033fa41c20243f6278b74cd31bdb885b31c793d022c5db841945031d14cd36d'
|
7
|
+
data.tar.gz: 56313a58b6a58c0c76e01f0e9844555842ce22c28db06f778615ee6d7c38b0326bfa2c57d71171f2a4d0c43447b64971b93e20fc738bc0df15c47fe92fec7318
|
data/lib/isomorfeus-react.rb
CHANGED
@@ -85,6 +85,7 @@ if RUBY_ENGINE == 'opal'
|
|
85
85
|
LucidApp::Context.create_application_context
|
86
86
|
|
87
87
|
# LucidComponent
|
88
|
+
require 'lucid_component/environment_support'
|
88
89
|
require 'lucid_component/styles_support'
|
89
90
|
require 'lucid_component/store_api'
|
90
91
|
require 'lucid_component/app_store_defaults'
|
@@ -95,7 +96,7 @@ if RUBY_ENGINE == 'opal'
|
|
95
96
|
require 'lucid_component/instance_store_proxy'
|
96
97
|
require 'lucid_component/initializer'
|
97
98
|
require 'lucid_component/native_component_constructor'
|
98
|
-
require 'lucid_component/
|
99
|
+
require 'lucid_component/preloading_support'
|
99
100
|
require 'lucid_component/mixin'
|
100
101
|
require 'lucid_component/base'
|
101
102
|
|
@@ -123,11 +124,9 @@ else
|
|
123
124
|
|
124
125
|
Isomorfeus.env = ENV['RACK_ENV']
|
125
126
|
|
126
|
-
|
127
|
-
|
128
|
-
|
129
|
-
Isomorfeus.server_side_rendering = false
|
130
|
-
end
|
127
|
+
require 'net/http' if Isomorfeus.development?
|
128
|
+
|
129
|
+
Isomorfeus.server_side_rendering = true
|
131
130
|
|
132
131
|
require 'isomorfeus/react_view_helper'
|
133
132
|
|
@@ -7,15 +7,32 @@ module Isomorfeus
|
|
7
7
|
render_result = "<div data-iso-env=\"#{Isomorfeus.env}\" data-iso-root=\"#{component_name}\" data-iso-props='#{Oj.dump(props, mode: :strict)}'"
|
8
8
|
if Isomorfeus.server_side_rendering
|
9
9
|
|
10
|
-
|
11
|
-
|
12
|
-
|
13
|
-
|
14
|
-
|
10
|
+
if Isomorfeus.development?
|
11
|
+
# always create a new context, effectively reloading code
|
12
|
+
# delete the existing context first, saves memory
|
13
|
+
if Isomorfeus.ssr_contexts.key?(thread_id_asset)
|
14
|
+
uuid = Isomorfeus.ssr_contexts[thread_id_asset].instance_variable_get(:@uuid)
|
15
|
+
runtime = Isomorfeus.ssr_contexts[thread_id_asset].instance_variable_get(:@runtime)
|
16
|
+
runtime.vm.delete_context(uuid)
|
17
|
+
end
|
18
|
+
asset_path = "#{OpalWebpackLoader.client_asset_path}#{asset}"
|
19
|
+
asset = Net::HTTP.get(URI(asset_path))
|
20
|
+
Isomorfeus.ssr_contexts[thread_id_asset] = ExecJS.permissive_compile(asset)
|
21
|
+
else
|
22
|
+
# initialize speednode context
|
23
|
+
unless Isomorfeus.ssr_contexts.key?(thread_id_asset)
|
24
|
+
asset_file_name = OpalWebpackLoader::Manifest.lookup_path_for(asset)
|
25
|
+
asset_path = File.join('public', asset_file_name)
|
26
|
+
Isomorfeus.ssr_contexts[thread_id_asset] = ExecJS.permissive_compile(File.read(asset_path))
|
27
|
+
end
|
15
28
|
end
|
16
29
|
|
17
30
|
# build javascript for rendering first pass
|
31
|
+
# it will initialize buffers to guard against leaks, maybe caused by previous exceptions
|
18
32
|
javascript = <<~JAVASCRIPT
|
33
|
+
global.Opal.React.render_buffer = [];
|
34
|
+
global.Opal.React.active_components = [];
|
35
|
+
global.Opal.React.active_redux_components = [];
|
19
36
|
global.FirstPassFinished = false;
|
20
37
|
global.Opal.Isomorfeus['$env=']('#{Isomorfeus.env}');
|
21
38
|
if (typeof global.Opal.Isomorfeus.$negotiated_locale === 'function') {
|
@@ -74,7 +91,11 @@ module Isomorfeus
|
|
74
91
|
end
|
75
92
|
|
76
93
|
# build javascript for second render pass
|
94
|
+
# guard against leaks from first pass, maybe because of a exception
|
77
95
|
javascript = <<~JAVASCRIPT
|
96
|
+
global.Opal.React.render_buffer = [];
|
97
|
+
global.Opal.React.active_components = [];
|
98
|
+
global.Opal.React.active_redux_components = [];
|
78
99
|
let rendered_tree;
|
79
100
|
let ssr_styles;
|
80
101
|
let component;
|
data/lib/lucid_app/mixin.rb
CHANGED
@@ -4,7 +4,10 @@ module LucidApp
|
|
4
4
|
base.include(::Native::Wrapper)
|
5
5
|
base.extend(::LucidApp::NativeComponentConstructor)
|
6
6
|
base.extend(::LucidPropDeclaration::Mixin)
|
7
|
-
base.extend(::
|
7
|
+
base.extend(::React::Component::EventHandler)
|
8
|
+
base.extend(::LucidComponent::PreloadingSupport)
|
9
|
+
base.extend(::LucidComponent::EnvironmentSupport)
|
10
|
+
base.include(::LucidComponent::EnvironmentSupport)
|
8
11
|
base.include(::React::Component::Elements)
|
9
12
|
base.include(::React::Component::API)
|
10
13
|
base.include(::React::Component::Callbacks)
|
@@ -63,7 +63,9 @@ module LucidApp
|
|
63
63
|
// console.log("lucid app pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
64
64
|
Opal.React.active_components.push(this);
|
65
65
|
Opal.React.active_redux_components.push(this.__ruby_instance);
|
66
|
-
let block_result
|
66
|
+
let block_result;
|
67
|
+
if (base.preload_block && !this.state.preloaded && base.while_loading_block) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
|
68
|
+
else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
|
67
69
|
if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result); }
|
68
70
|
Opal.React.active_redux_components.pop();
|
69
71
|
Opal.React.active_components.pop();
|
@@ -87,18 +89,19 @@ module LucidApp
|
|
87
89
|
return null;
|
88
90
|
}
|
89
91
|
}
|
92
|
+
base.preload_block = null;
|
93
|
+
base.while_loading_block = null;
|
90
94
|
base.jss_styles = null;
|
91
|
-
base.jss_styles_used = null;
|
92
95
|
base.jss_theme = {};
|
93
96
|
base.use_styles = null;
|
94
97
|
base.themed_react_component = function(props) {
|
95
98
|
let classes = null;
|
96
99
|
let theme = Opal.global.ReactJSS.useTheme();
|
97
100
|
if (base.jss_styles) {
|
98
|
-
if (!base.use_styles || (Opal.Isomorfeus.development &&
|
99
|
-
|
100
|
-
|
101
|
-
|
101
|
+
if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
|
102
|
+
let styles;
|
103
|
+
if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
|
104
|
+
else { styles = base.jss_styles; }
|
102
105
|
base.use_styles = Opal.global.ReactJSS.createUseStyles(styles);
|
103
106
|
}
|
104
107
|
classes = base.use_styles();
|
@@ -4,7 +4,10 @@ module LucidComponent
|
|
4
4
|
base.include(::Native::Wrapper)
|
5
5
|
base.extend(::LucidComponent::NativeComponentConstructor)
|
6
6
|
base.extend(::LucidPropDeclaration::Mixin)
|
7
|
-
base.extend(::
|
7
|
+
base.extend(::React::Component::EventHandler)
|
8
|
+
base.extend(::LucidComponent::PreloadingSupport)
|
9
|
+
base.extend(::LucidComponent::EnvironmentSupport)
|
10
|
+
base.include(::LucidComponent::EnvironmentSupport)
|
8
11
|
base.include(::React::Component::Elements)
|
9
12
|
base.include(::React::Component::API)
|
10
13
|
base.include(::React::Component::Callbacks)
|
@@ -50,7 +50,9 @@ module LucidComponent
|
|
50
50
|
// console.log("lucid component pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
51
51
|
Opal.React.active_components.push(this);
|
52
52
|
Opal.React.active_redux_components.push(this);
|
53
|
-
let block_result
|
53
|
+
let block_result;
|
54
|
+
if (base.preload_block && !this.state.preloaded && base.while_loading_block) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
|
55
|
+
else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
|
54
56
|
if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result); }
|
55
57
|
Opal.React.active_redux_components.pop();
|
56
58
|
Opal.React.active_components.pop();
|
@@ -94,8 +96,9 @@ module LucidComponent
|
|
94
96
|
return null;
|
95
97
|
}
|
96
98
|
}
|
99
|
+
base.preload_block = null;
|
100
|
+
base.while_loading_block = null;
|
97
101
|
base.jss_styles = null;
|
98
|
-
base.jss_styles_used = null;
|
99
102
|
base.use_styles = null;
|
100
103
|
base.store_updates = true;
|
101
104
|
base.react_component = function(props) {
|
@@ -104,10 +107,10 @@ module LucidComponent
|
|
104
107
|
if (base.store_updates) { store = Opal.global.React.useContext(Opal.global.LucidApplicationContext); }
|
105
108
|
let theme = Opal.global.ReactJSS.useTheme();
|
106
109
|
if (base.jss_styles) {
|
107
|
-
if (!base.use_styles || (Opal.Isomorfeus.development &&
|
108
|
-
|
109
|
-
|
110
|
-
|
110
|
+
if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
|
111
|
+
let styles;
|
112
|
+
if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
|
113
|
+
else { styles = base.jss_styles; }
|
111
114
|
base.use_styles = Opal.global.ReactJSS.createUseStyles(styles);
|
112
115
|
}
|
113
116
|
classes = base.use_styles();
|
@@ -0,0 +1,16 @@
|
|
1
|
+
module LucidComponent
|
2
|
+
module PreloadingSupport
|
3
|
+
def preload(&block)
|
4
|
+
`self.preload_block = block`
|
5
|
+
component_did_mount do
|
6
|
+
instance_exec(&self.class().JS[:preload_block]).then do
|
7
|
+
set_state({preloaded: true})
|
8
|
+
end
|
9
|
+
end
|
10
|
+
end
|
11
|
+
|
12
|
+
def while_loading(&block)
|
13
|
+
`self.while_loading_block = block`
|
14
|
+
end
|
15
|
+
end
|
16
|
+
end
|
@@ -5,7 +5,10 @@ module LucidMaterial
|
|
5
5
|
base.include(::Native::Wrapper)
|
6
6
|
base.extend(::LucidMaterial::App::NativeComponentConstructor)
|
7
7
|
base.extend(::LucidPropDeclaration::Mixin)
|
8
|
-
base.extend(::
|
8
|
+
base.extend(::React::Component::EventHandler)
|
9
|
+
base.extend(::LucidComponent::PreloadingSupport)
|
10
|
+
base.extend(::LucidComponent::EnvironmentSupport)
|
11
|
+
base.include(::LucidComponent::EnvironmentSupport)
|
9
12
|
base.include(::React::Component::Elements)
|
10
13
|
base.include(::React::Component::API)
|
11
14
|
base.include(::React::Component::Callbacks)
|
@@ -64,7 +64,9 @@ module LucidMaterial
|
|
64
64
|
// console.log("material app pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
65
65
|
Opal.React.active_components.push(this);
|
66
66
|
Opal.React.active_redux_components.push(this.__ruby_instance);
|
67
|
-
let block_result
|
67
|
+
let block_result;
|
68
|
+
if (base.preload_block && !this.state.preloaded && base.while_loading_block) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
|
69
|
+
else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
|
68
70
|
if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result); }
|
69
71
|
Opal.React.active_redux_components.pop();
|
70
72
|
Opal.React.active_components.pop();
|
@@ -88,18 +90,19 @@ module LucidMaterial
|
|
88
90
|
return null;
|
89
91
|
}
|
90
92
|
}
|
93
|
+
base.preload_block = null;
|
94
|
+
base.while_loading_block = null;
|
91
95
|
base.jss_styles = null;
|
92
|
-
base.jss_styles_used = null;
|
93
96
|
base.jss_theme = Opal.global.Mui.createMuiTheme();
|
94
97
|
base.use_styles = null;
|
95
98
|
base.themed_react_component = function(props) {
|
96
99
|
let classes = null;
|
97
100
|
let theme = Opal.global.MuiStyles.useTheme();
|
98
101
|
if (base.jss_styles) {
|
99
|
-
if (!base.use_styles || (Opal.Isomorfeus.development &&
|
100
|
-
|
101
|
-
|
102
|
-
|
102
|
+
if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
|
103
|
+
let styles;
|
104
|
+
if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
|
105
|
+
else { styles = base.jss_styles; }
|
103
106
|
base.use_styles = Opal.global.MuiStyles.makeStyles(styles);
|
104
107
|
}
|
105
108
|
classes = base.use_styles();
|
@@ -5,7 +5,10 @@ module LucidMaterial
|
|
5
5
|
base.include(::Native::Wrapper)
|
6
6
|
base.extend(::LucidMaterial::Component::NativeComponentConstructor)
|
7
7
|
base.extend(::LucidPropDeclaration::Mixin)
|
8
|
-
base.extend(::
|
8
|
+
base.extend(::React::Component::EventHandler)
|
9
|
+
base.extend(::LucidComponent::PreloadingSupport)
|
10
|
+
base.extend(::LucidComponent::EnvironmentSupport)
|
11
|
+
base.include(::LucidComponent::EnvironmentSupport)
|
9
12
|
base.include(::React::Component::Elements)
|
10
13
|
base.include(::React::Component::API)
|
11
14
|
base.include(::React::Component::Callbacks)
|
@@ -17,4 +20,4 @@ module LucidMaterial
|
|
17
20
|
end
|
18
21
|
end
|
19
22
|
end
|
20
|
-
end
|
23
|
+
end
|
@@ -51,7 +51,9 @@ module LucidMaterial
|
|
51
51
|
// console.log("material component pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
52
52
|
Opal.React.active_components.push(this);
|
53
53
|
Opal.React.active_redux_components.push(this);
|
54
|
-
let block_result
|
54
|
+
let block_result;
|
55
|
+
if (base.preload_block && !this.state.preloaded && base.while_loading_block) { block_result = #{`this.__ruby_instance`.instance_exec(&`base.while_loading_block`)}; }
|
56
|
+
else { block_result = #{`this.__ruby_instance`.instance_exec(&`base.render_block`)}; }
|
55
57
|
if (block_result && (block_result.constructor === String || block_result.constructor === Number)) { Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result); }
|
56
58
|
Opal.React.active_redux_components.pop();
|
57
59
|
Opal.React.active_components.pop();
|
@@ -95,8 +97,9 @@ module LucidMaterial
|
|
95
97
|
return null;
|
96
98
|
}
|
97
99
|
};
|
100
|
+
base.preload_block = null;
|
101
|
+
base.while_loading_block = null;
|
98
102
|
base.jss_styles = null;
|
99
|
-
base.jss_styles_used = null;
|
100
103
|
base.use_styles = null;
|
101
104
|
base.store_updates = true;
|
102
105
|
base.react_component = function(props) {
|
@@ -105,10 +108,10 @@ module LucidMaterial
|
|
105
108
|
if (base.store_updates) { store = Opal.global.React.useContext(Opal.global.LucidApplicationContext); }
|
106
109
|
let theme = Opal.global.MuiStyles.useTheme();
|
107
110
|
if (base.jss_styles) {
|
108
|
-
if (!base.use_styles || (Opal.Isomorfeus.development &&
|
109
|
-
|
110
|
-
|
111
|
-
|
111
|
+
if (!base.use_styles || (Opal.Isomorfeus.development && Opal.Isomorfeus.development !== nil)) {
|
112
|
+
let styles;
|
113
|
+
if (typeof base.jss_styles === 'function') { styles = base.jss_styles(theme); }
|
114
|
+
else { styles = base.jss_styles; }
|
112
115
|
base.use_styles = Opal.global.MuiStyles.makeStyles(styles);
|
113
116
|
}
|
114
117
|
classes = base.use_styles();
|
data/lib/react.rb
CHANGED
@@ -1,6 +1,4 @@
|
|
1
1
|
module React
|
2
|
-
# to_native_react_props: the native_component params is used for event handlers, it keeps the event handlers
|
3
|
-
# it does not need to be compone nt, can be a object with the event handlers
|
4
2
|
# language=JS
|
5
3
|
%x{
|
6
4
|
self.render_buffer = [];
|
@@ -15,10 +13,10 @@ module React
|
|
15
13
|
};
|
16
14
|
|
17
15
|
self.lower_camelize = function(snake_cased_word) {
|
18
|
-
|
19
|
-
|
20
|
-
for (
|
21
|
-
|
16
|
+
let parts = snake_cased_word.split('_');
|
17
|
+
let res = parts[0];
|
18
|
+
for (let i = 1; i < parts.length; i++) {
|
19
|
+
res += parts[i][0].toUpperCase() + parts[i].slice(1);
|
22
20
|
}
|
23
21
|
return res;
|
24
22
|
};
|
@@ -30,36 +28,36 @@ module React
|
|
30
28
|
};
|
31
29
|
|
32
30
|
self.to_native_react_props = function(ruby_style_props) {
|
33
|
-
|
34
|
-
|
35
|
-
|
36
|
-
|
37
|
-
|
38
|
-
|
39
|
-
|
40
|
-
|
41
|
-
|
42
|
-
|
43
|
-
} else {
|
44
|
-
var active_component = Opal.React.active_component();
|
45
|
-
result[Opal.React.lower_camelize(key)] = active_component[handler];
|
46
|
-
}
|
47
|
-
} else if (key[0] === 'a' && key.startsWith("aria_")) {
|
48
|
-
result[key.replace("_", "-")] = ruby_style_props['$[]'](key);
|
49
|
-
} else if (key === "style") {
|
50
|
-
var val = ruby_style_props['$[]'](key);
|
51
|
-
if (typeof val.$to_n === "function") { val = val.$to_n() }
|
52
|
-
result["style"] = val;
|
31
|
+
let result = {};
|
32
|
+
let keys = ruby_style_props.$keys();
|
33
|
+
let keys_length = keys.length;
|
34
|
+
let key = '';
|
35
|
+
for (let i = 0; i < keys_length; i++) {
|
36
|
+
key = keys[i];
|
37
|
+
if (key[0] === 'o' && key[1] === 'n' && key[2] === '_') {
|
38
|
+
let handler = ruby_style_props['$[]'](key);
|
39
|
+
if (typeof handler === "function") {
|
40
|
+
result[Opal.React.lower_camelize(key)] = handler;
|
53
41
|
} else {
|
54
|
-
|
42
|
+
let active_component = Opal.React.active_component();
|
43
|
+
result[Opal.React.lower_camelize(key)] = active_component[handler];
|
55
44
|
}
|
45
|
+
} else if (key[0] === 'a' && key.startsWith("aria_")) {
|
46
|
+
result[key.replace("_", "-")] = ruby_style_props['$[]'](key);
|
47
|
+
} else if (key === "style") {
|
48
|
+
let val = ruby_style_props['$[]'](key);
|
49
|
+
if (typeof val.$to_n === "function") { val = val.$to_n() }
|
50
|
+
result["style"] = val;
|
51
|
+
} else {
|
52
|
+
result[key.indexOf('_') > 0 ? Opal.React.lower_camelize(key) : key] = ruby_style_props['$[]'](key);
|
56
53
|
}
|
57
|
-
|
54
|
+
}
|
55
|
+
return result;
|
58
56
|
};
|
59
57
|
|
60
58
|
self.internal_prepare_args_and_render = function(component, args, block) {
|
61
59
|
if (args.length > 0) {
|
62
|
-
|
60
|
+
let last_arg = args[args.length - 1];
|
63
61
|
if (last_arg && last_arg.constructor === String) {
|
64
62
|
if (args.length === 1) { return Opal.React.internal_render(component, null, last_arg, null); }
|
65
63
|
else { Opal.React.internal_render(component, args[0], last_arg, null); }
|
@@ -94,7 +92,7 @@ module React
|
|
94
92
|
self.active_components = [];
|
95
93
|
|
96
94
|
self.active_component = function() {
|
97
|
-
|
95
|
+
let length = Opal.React.active_components.length;
|
98
96
|
if (length === 0) { return null; };
|
99
97
|
return Opal.React.active_components[length-1];
|
100
98
|
};
|
@@ -102,7 +100,7 @@ module React
|
|
102
100
|
self.active_redux_components = [];
|
103
101
|
|
104
102
|
self.active_redux_component = function() {
|
105
|
-
|
103
|
+
let length = Opal.React.active_redux_components.length;
|
106
104
|
if (length === 0) { return null; };
|
107
105
|
return Opal.React.active_redux_components[length-1];
|
108
106
|
};
|
@@ -18,13 +18,22 @@ module React
|
|
18
18
|
|
19
19
|
def component_did_mount(&block)
|
20
20
|
%x{
|
21
|
-
|
21
|
+
let fun = function() {
|
22
22
|
Opal.React.active_redux_components.push(this.__ruby_instance);
|
23
23
|
#{`this.__ruby_instance`.instance_exec(&block)};
|
24
24
|
Opal.React.active_redux_components.pop();
|
25
25
|
}
|
26
|
-
if (self.lucid_react_component) {
|
27
|
-
|
26
|
+
if (self.lucid_react_component) {
|
27
|
+
if (self.lucid_react_component.prototype.componentDidMount) {
|
28
|
+
let fun_one = self.lucid_react_component.prototype.componentDidMount;
|
29
|
+
let fun_two = fun;
|
30
|
+
fun = function() {
|
31
|
+
fun_one();
|
32
|
+
fun_two();
|
33
|
+
}
|
34
|
+
}
|
35
|
+
self.lucid_react_component.prototype.componentDidMount = fun;
|
36
|
+
} else { self.react_component.prototype.componentDidMount = fun; }
|
28
37
|
}
|
29
38
|
end
|
30
39
|
|
@@ -8,7 +8,7 @@ module React
|
|
8
8
|
def event_handler(name, &block)
|
9
9
|
event_handlers << name
|
10
10
|
%x{
|
11
|
-
|
11
|
+
var fun = function(event, info) {
|
12
12
|
if (typeof event === "object") {
|
13
13
|
#{ruby_event = ::React::SyntheticEvent.new(`event`)};
|
14
14
|
} else {
|
@@ -16,6 +16,8 @@ module React
|
|
16
16
|
}
|
17
17
|
#{`this.__ruby_instance`.instance_exec(ruby_event, `info`, &block)};
|
18
18
|
}
|
19
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype[name] = fun; }
|
20
|
+
else { self.react_component.prototype[name] = fun; }
|
19
21
|
}
|
20
22
|
end
|
21
23
|
end
|
@@ -1,7 +1,9 @@
|
|
1
1
|
module React
|
2
2
|
module Component
|
3
3
|
class Props
|
4
|
-
|
4
|
+
def initialize(native)
|
5
|
+
@native = native
|
6
|
+
end
|
5
7
|
|
6
8
|
def method_missing(prop, *args, &block)
|
7
9
|
%x{
|
@@ -14,11 +16,11 @@ module React
|
|
14
16
|
end
|
15
17
|
|
16
18
|
def classes
|
17
|
-
@classes ||= `Opal.React.Component.Styles.$new(#@native
|
19
|
+
@classes ||= `Opal.React.Component.Styles.$new(#@native, 'classes')`
|
18
20
|
end
|
19
21
|
|
20
22
|
def theme
|
21
|
-
@theme ||= `Opal.React.Component.Styles.$new(#@native
|
23
|
+
@theme ||= `Opal.React.Component.Styles.$new(#@native, 'theme')`
|
22
24
|
end
|
23
25
|
|
24
26
|
def isomorfeus_store
|
@@ -1,14 +1,21 @@
|
|
1
1
|
module React
|
2
2
|
module Component
|
3
3
|
class Styles
|
4
|
-
def initialize(native)
|
4
|
+
def initialize(native, props_prop = false)
|
5
5
|
@native = native
|
6
|
+
@props_prop = props_prop
|
6
7
|
end
|
7
8
|
|
8
9
|
def method_missing(prop, *args, &block)
|
9
10
|
%x{
|
10
|
-
|
11
|
-
|
11
|
+
let value;
|
12
|
+
if (#@props_prop) {
|
13
|
+
if (!#@native.props[#@props_prop] || typeof #@native.props[#@props_prop][prop] === 'undefined') { return #{nil}; }
|
14
|
+
value = #@native.props[#@props_prop][prop];
|
15
|
+
} else {
|
16
|
+
if (!#@native || typeof #@native[prop] === 'undefined') { return #{nil}; }
|
17
|
+
value = #@native[prop];
|
18
|
+
}
|
12
19
|
if (typeof value === 'string' || typeof value === 'number' || Array.isArray(value)) { return value; }
|
13
20
|
if (typeof value === 'function') { return #{Proc.new { `value()` }} }
|
14
21
|
return Opal.React.Component.Styles.$new(value);
|
@@ -16,12 +23,18 @@ module React
|
|
16
23
|
end
|
17
24
|
|
18
25
|
def to_h
|
19
|
-
|
26
|
+
%x{
|
27
|
+
if (#@props_prop) { return Opal.Hash.$new(#@native.props[#@props_prop]); }
|
28
|
+
else { return Opal.Hash.$new(#@native); }
|
29
|
+
}
|
20
30
|
end
|
21
31
|
|
22
32
|
def to_n
|
23
|
-
|
33
|
+
%x{
|
34
|
+
if (#@props_prop) { return #@native.props[#@props_prop]; }
|
35
|
+
else { return #@native; }
|
36
|
+
}
|
24
37
|
end
|
25
38
|
end
|
26
39
|
end
|
27
|
-
end
|
40
|
+
end
|
data/lib/react/version.rb
CHANGED
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.10.
|
4
|
+
version: 16.10.12
|
5
5
|
platform: ruby
|
6
6
|
authors:
|
7
7
|
- Jan Biedermann
|
8
8
|
autorequire:
|
9
9
|
bindir: bin
|
10
10
|
cert_chain: []
|
11
|
-
date: 2019-10-
|
11
|
+
date: 2019-10-18 00:00:00.000000000 Z
|
12
12
|
dependencies:
|
13
13
|
- !ruby/object:Gem::Dependency
|
14
14
|
name: oj
|
@@ -185,11 +185,12 @@ files:
|
|
185
185
|
- lib/lucid_component/class_store_proxy.rb
|
186
186
|
- lib/lucid_component/component_class_store_defaults.rb
|
187
187
|
- lib/lucid_component/component_instance_store_defaults.rb
|
188
|
-
- lib/lucid_component/
|
188
|
+
- lib/lucid_component/environment_support.rb
|
189
189
|
- lib/lucid_component/initializer.rb
|
190
190
|
- lib/lucid_component/instance_store_proxy.rb
|
191
191
|
- lib/lucid_component/mixin.rb
|
192
192
|
- lib/lucid_component/native_component_constructor.rb
|
193
|
+
- lib/lucid_component/preloading_support.rb
|
193
194
|
- lib/lucid_component/reducers.rb
|
194
195
|
- lib/lucid_component/store_api.rb
|
195
196
|
- lib/lucid_component/styles_support.rb
|
@@ -240,7 +241,14 @@ homepage: http://isomorfeus.com
|
|
240
241
|
licenses:
|
241
242
|
- MIT
|
242
243
|
metadata: {}
|
243
|
-
post_install_message:
|
244
|
+
post_install_message: |2+
|
245
|
+
|
246
|
+
isomorfeus-react 16.10.12:
|
247
|
+
Breaking changes:
|
248
|
+
Server Side Rendering is on by default in the development environment.
|
249
|
+
Please enable SSR asset builds in the webpack config of your app or turn SSR off with:
|
250
|
+
Isomorfeus.server_side_rendering = false
|
251
|
+
|
244
252
|
rdoc_options: []
|
245
253
|
require_paths:
|
246
254
|
- lib
|
@@ -1,21 +0,0 @@
|
|
1
|
-
module LucidComponent
|
2
|
-
module EventHandler
|
3
|
-
def event_handlers
|
4
|
-
@event_handlers ||= []
|
5
|
-
end
|
6
|
-
|
7
|
-
def event_handler(name, &block)
|
8
|
-
event_handlers << name
|
9
|
-
%x{
|
10
|
-
self.lucid_react_component.prototype[name] = function(event, info) {
|
11
|
-
if (typeof event === "object") {
|
12
|
-
#{ruby_event = ::React::SyntheticEvent.new(`event`)};
|
13
|
-
} else {
|
14
|
-
#{ruby_event = `event`};
|
15
|
-
}
|
16
|
-
#{`this.__ruby_instance`.instance_exec(ruby_event, `info`, &block)};
|
17
|
-
}
|
18
|
-
}
|
19
|
-
end
|
20
|
-
end
|
21
|
-
end
|