isomorfeus-react 16.13.8 → 16.13.9
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.
- checksums.yaml +4 -4
- data/lib/isomorfeus_react/lucid_component/native_component_constructor.rb +2 -2
- data/lib/isomorfeus_react/lucid_component/native_lucid_component_constructor.rb +15 -13
- data/lib/isomorfeus_react_material/lucid_material/component/native_component_constructor.rb +2 -2
- data/lib/react.rb +12 -7
- data/lib/react/component/native_component_constructor.rb +15 -13
- data/lib/react/component/props.rb +4 -3
- data/lib/react/component/state.rb +4 -2
- data/lib/react/version.rb +1 -1
- metadata +2 -2
checksums.yaml
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
---
|
|
2
2
|
SHA256:
|
|
3
|
-
metadata.gz:
|
|
4
|
-
data.tar.gz:
|
|
3
|
+
metadata.gz: 6e035ee0fa52630bee7cabe9a6e42043807ab3214aff268c94ab3d11a18c1bf5
|
|
4
|
+
data.tar.gz: 941bd2452ff4ca38292dd60e6a74cc89bb6b5e378152e2dfe3b9dcfcae10867c
|
|
5
5
|
SHA512:
|
|
6
|
-
metadata.gz:
|
|
7
|
-
data.tar.gz:
|
|
6
|
+
metadata.gz: 254fb5ad51c52ff2521494614bedbe215dd2980daed1300c00f98032d34460d798487c8dd5ccfebd26a823d63064e232be46030f1f22d793b6a42ccd6404aa4f
|
|
7
|
+
data.tar.gz: 1a4b829bba24df5e78ebbff63cf6e688b8083d5349b41f08bf05234bc4ae7c5f4fb8726e5f20d1b94463a33aa0e74f47125bc5e3e98e7c23736fb6ef5eade765
|
|
@@ -7,7 +7,7 @@ module LucidComponent
|
|
|
7
7
|
component_name = base.to_s + 'Wrapper'
|
|
8
8
|
# language=JS
|
|
9
9
|
%x{
|
|
10
|
-
base.react_component = function(props) {
|
|
10
|
+
base.react_component = Opal.global.React.memo(function(props) {
|
|
11
11
|
let opag = Opal.global;
|
|
12
12
|
let classes;
|
|
13
13
|
let store;
|
|
@@ -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
|
+
}, null);
|
|
31
31
|
base.react_component.displayName = #{component_name};
|
|
32
32
|
}
|
|
33
33
|
end
|
|
@@ -63,30 +63,32 @@ module LucidComponent
|
|
|
63
63
|
}
|
|
64
64
|
shouldComponentUpdate(next_props, next_state) {
|
|
65
65
|
let counter = 0;
|
|
66
|
+
const this_props = this.props;
|
|
66
67
|
for (var property in next_props) {
|
|
67
68
|
counter++;
|
|
68
69
|
if (next_props.hasOwnProperty(property)) {
|
|
69
|
-
if (!
|
|
70
|
-
if (property === "children") { if (next_props.children !==
|
|
71
|
-
else if (typeof next_props[property]
|
|
72
|
-
typeof
|
|
73
|
-
if (#{ !! (`next_props[property]` != `
|
|
74
|
-
} else if (next_props[property] !==
|
|
70
|
+
if (!this_props.hasOwnProperty(property)) { return true; };
|
|
71
|
+
if (property === "children") { if (next_props.children !== this_props.children) { return true; }}
|
|
72
|
+
else if (typeof next_props[property] === "object" && next_props[property] !== null && typeof next_props[property]['$!='] === "function" &&
|
|
73
|
+
typeof this_props[property] !== "undefined" && this_props[property] !== null ) {
|
|
74
|
+
if (#{ !! (`next_props[property]` != `this_props[property]`) }) { return true; }
|
|
75
|
+
} else if (next_props[property] !== this_props[property]) { return true; }
|
|
75
76
|
}
|
|
76
77
|
}
|
|
77
|
-
if (counter !== Object.keys(
|
|
78
|
+
if (counter !== Object.keys(this_props).length) { return true; }
|
|
78
79
|
counter = 0;
|
|
80
|
+
const this_state = this.state;
|
|
79
81
|
for (var property in next_state) {
|
|
80
82
|
counter++;
|
|
81
83
|
if (next_state.hasOwnProperty(property)) {
|
|
82
|
-
if (!
|
|
83
|
-
if (typeof next_state[property]
|
|
84
|
-
typeof
|
|
85
|
-
if (#{ !! (`next_state[property]` != `
|
|
86
|
-
} else if (next_state[property] !==
|
|
84
|
+
if (!this_state.hasOwnProperty(property)) { return true; };
|
|
85
|
+
if (typeof next_state[property] === "object" && next_state[property] !== null && typeof next_state[property]['$!='] === "function" &&
|
|
86
|
+
typeof this_state[property] !== "undefined" && this_state[property] !== null) {
|
|
87
|
+
if (#{ !! (`next_state[property]` != `this_state[property]`) }) { return true }
|
|
88
|
+
} else if (next_state[property] !== this_state[property]) { return true }
|
|
87
89
|
}
|
|
88
90
|
}
|
|
89
|
-
if (counter !== Object.keys(
|
|
91
|
+
if (counter !== Object.keys(this_state).length) { return true; }
|
|
90
92
|
return false;
|
|
91
93
|
}
|
|
92
94
|
validateProp(props, propName, componentName) {
|
|
@@ -8,7 +8,7 @@ module LucidMaterial
|
|
|
8
8
|
component_name = base.to_s + 'Wrapper'
|
|
9
9
|
# language=JS
|
|
10
10
|
%x{
|
|
11
|
-
base.react_component = function(props) {
|
|
11
|
+
base.react_component = Opal.global.React.memo(function(props) {
|
|
12
12
|
let classes = null;
|
|
13
13
|
let store;
|
|
14
14
|
if (base.store_updates) { store = Opal.global.React.useContext(Opal.global.LucidApplicationContext); }
|
|
@@ -27,7 +27,7 @@ module LucidMaterial
|
|
|
27
27
|
new_props.theme = theme;
|
|
28
28
|
new_props.store = store;
|
|
29
29
|
return Opal.global.React.createElement(base.lucid_react_component, new_props);
|
|
30
|
-
}
|
|
30
|
+
}, null);
|
|
31
31
|
base.react_component.displayName = #{component_name};
|
|
32
32
|
}
|
|
33
33
|
end
|
data/lib/react.rb
CHANGED
|
@@ -13,11 +13,13 @@ module React
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
self.lower_camelize = function(snake_cased_word) {
|
|
16
|
+
if (self.prop_dictionary[snake_cased_word]) { return self.prop_dictionary[snake_cased_word]; }
|
|
16
17
|
let parts = snake_cased_word.split('_');
|
|
17
18
|
let res = parts[0];
|
|
18
19
|
for (let i = 1; i < parts.length; i++) {
|
|
19
20
|
res += parts[i][0].toUpperCase() + parts[i].slice(1);
|
|
20
21
|
}
|
|
22
|
+
self.prop_dictionary[snake_cased_word] = res;
|
|
21
23
|
return res;
|
|
22
24
|
};
|
|
23
25
|
|
|
@@ -82,6 +84,8 @@ module React
|
|
|
82
84
|
|
|
83
85
|
if on_browser? || on_ssr?
|
|
84
86
|
%x{
|
|
87
|
+
self.prop_dictionary = {};
|
|
88
|
+
|
|
85
89
|
self.to_native_react_props = function(ruby_style_props) {
|
|
86
90
|
let result = {};
|
|
87
91
|
let keys = ruby_style_props.$$keys;
|
|
@@ -148,7 +152,7 @@ module React
|
|
|
148
152
|
if (typeof value.$to_n === "function") { value = value.$to_n() }
|
|
149
153
|
result["style"] = value;
|
|
150
154
|
} else {
|
|
151
|
-
result[
|
|
155
|
+
result[self.lower_camelize(key)] = value;
|
|
152
156
|
}
|
|
153
157
|
}
|
|
154
158
|
return result;
|
|
@@ -162,20 +166,21 @@ module React
|
|
|
162
166
|
|
|
163
167
|
self.internal_render = function(component, props, string_child, block) {
|
|
164
168
|
const operabu = self.render_buffer;
|
|
165
|
-
let
|
|
166
|
-
|
|
169
|
+
let native_props;
|
|
170
|
+
if (props && props !== nil) { native_props = self.to_native_react_props(props); }
|
|
167
171
|
if (string_child) {
|
|
168
|
-
|
|
172
|
+
operabu[operabu.length - 1].push(Opal.global.React.createElement(component, native_props, string_child));
|
|
169
173
|
} else if (block && block !== nil) {
|
|
170
174
|
operabu.push([]);
|
|
171
175
|
// console.log("internal_render pushed", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
|
172
176
|
let block_result = block.$call();
|
|
173
177
|
if (block_result && block_result !== nil) { Opal.React.render_block_result(block_result); }
|
|
174
178
|
// console.log("internal_render popping", Opal.React.render_buffer, Opal.React.render_buffer.toString());
|
|
175
|
-
children = operabu.pop();
|
|
179
|
+
let children = operabu.pop();
|
|
180
|
+
operabu[operabu.length - 1].push(Opal.global.React.createElement.apply(this, [component, native_props].concat(children)));
|
|
181
|
+
} else {
|
|
182
|
+
operabu[operabu.length - 1].push(Opal.global.React.createElement(component, native_props));
|
|
176
183
|
}
|
|
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
184
|
};
|
|
180
185
|
}
|
|
181
186
|
end
|
|
@@ -54,30 +54,32 @@ module React
|
|
|
54
54
|
return #{!!`this.__ruby_instance`.instance_exec(React::Component::Props.new(`{props: next_props}`), React::Component::State.new(`{state: next_state }`), &`base.should_component_update_block`)};
|
|
55
55
|
}
|
|
56
56
|
let counter = 0;
|
|
57
|
+
const this_props = this.props;
|
|
57
58
|
for (var property in next_props) {
|
|
58
59
|
counter++;
|
|
59
60
|
if (next_props.hasOwnProperty(property)) {
|
|
60
|
-
if (!
|
|
61
|
-
if (property === "children") { if (next_props.children !==
|
|
62
|
-
else if (typeof next_props[property]
|
|
63
|
-
typeof
|
|
64
|
-
if (#{ !! (`next_props[property]` != `
|
|
65
|
-
} else if (next_props[property] !==
|
|
61
|
+
if (!this_props.hasOwnProperty(property)) { return true; };
|
|
62
|
+
if (property === "children") { if (next_props.children !== this_props.children) { return true; }}
|
|
63
|
+
else if (typeof next_props[property] === "object" && next_props[property] !== null && typeof next_props[property]['$!='] === "function" &&
|
|
64
|
+
typeof this_props[property] !== "undefined" && this_props[property] !== null ) {
|
|
65
|
+
if (#{ !! (`next_props[property]` != `this_props[property]`) }) { return true; }
|
|
66
|
+
} else if (next_props[property] !== this_props[property]) { return true; }
|
|
66
67
|
}
|
|
67
68
|
}
|
|
68
|
-
if (counter !== Object.keys(
|
|
69
|
+
if (counter !== Object.keys(this_props).length) { return true; }
|
|
69
70
|
counter = 0;
|
|
71
|
+
const this_state = this.state;
|
|
70
72
|
for (var property in next_state) {
|
|
71
73
|
counter++;
|
|
72
74
|
if (next_state.hasOwnProperty(property)) {
|
|
73
|
-
if (!
|
|
74
|
-
if (typeof next_state[property]
|
|
75
|
-
typeof
|
|
76
|
-
if (#{ !! (`next_state[property]` != `
|
|
77
|
-
} else if (next_state[property] !==
|
|
75
|
+
if (!this_state.hasOwnProperty(property)) { return true; };
|
|
76
|
+
if (typeof next_state[property] === "object" && next_state[property] !== null && typeof next_state[property]['$!='] === "function" &&
|
|
77
|
+
typeof this_state[property] !== "undefined" && this_state[property] !== null) {
|
|
78
|
+
if (#{ !! (`next_state[property]` != `this_state[property]`) }) { return true }
|
|
79
|
+
} else if (next_state[property] !== this_state[property]) { return true }
|
|
78
80
|
}
|
|
79
81
|
}
|
|
80
|
-
if (counter !== Object.keys(
|
|
82
|
+
if (counter !== Object.keys(this_state).length) { return true; }
|
|
81
83
|
return false;
|
|
82
84
|
}
|
|
83
85
|
validateProp(props, propName, componentName) {
|
|
@@ -7,11 +7,12 @@ module React
|
|
|
7
7
|
|
|
8
8
|
def method_missing(prop, *args, &block)
|
|
9
9
|
%x{
|
|
10
|
-
|
|
10
|
+
const p = #@native.props;
|
|
11
|
+
if (typeof p[prop] === 'undefined') {
|
|
11
12
|
prop = Opal.React.lower_camelize(prop);
|
|
12
|
-
if (typeof
|
|
13
|
+
if (typeof p[prop] === 'undefined') { return nil; }
|
|
13
14
|
}
|
|
14
|
-
return
|
|
15
|
+
return p[prop];
|
|
15
16
|
}
|
|
16
17
|
end
|
|
17
18
|
|
|
@@ -13,8 +13,10 @@ module React
|
|
|
13
13
|
@native.JS.setState(new_state, `null`)
|
|
14
14
|
end
|
|
15
15
|
else
|
|
16
|
-
|
|
17
|
-
|
|
16
|
+
%x{
|
|
17
|
+
if (typeof #@native.state[key] === 'undefined') { return nil; }
|
|
18
|
+
return #@native.state[key];
|
|
19
|
+
}
|
|
18
20
|
end
|
|
19
21
|
end
|
|
20
22
|
|
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.13.
|
|
4
|
+
version: 16.13.9
|
|
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-
|
|
11
|
+
date: 2020-03-16 00:00:00.000000000 Z
|
|
12
12
|
dependencies:
|
|
13
13
|
- !ruby/object:Gem::Dependency
|
|
14
14
|
name: concurrent-ruby
|