isomorfeus-react 16.10.0 → 16.10.1
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/README.md +64 -0
- data/lib/browser/delegate_native.rb +70 -0
- data/lib/browser/element.rb +176 -0
- data/lib/browser/element/canvas.rb +17 -0
- data/lib/browser/element/media.rb +78 -0
- data/lib/browser/event.rb +92 -0
- data/lib/browser/event_target.rb +39 -0
- data/lib/browser/file_list.rb +125 -0
- data/lib/browser/iterable.rb +15 -0
- data/lib/isomorfeus-react-material-ui.rb +10 -0
- data/lib/isomorfeus-react.rb +145 -0
- data/lib/isomorfeus/config.rb +130 -0
- data/lib/isomorfeus/props/validate_hash_proxy.rb +178 -0
- data/lib/isomorfeus/props/validator.rb +131 -0
- data/lib/isomorfeus/react_view_helper.rb +130 -0
- data/lib/isomorfeus/top_level.rb +86 -0
- data/lib/isomorfeus/top_level_ssr.rb +28 -0
- data/lib/lucid_app/api.rb +30 -0
- data/lib/lucid_app/base.rb +7 -0
- data/lib/lucid_app/context.rb +7 -0
- data/lib/lucid_app/mixin.rb +20 -0
- data/lib/lucid_app/native_component_constructor.rb +105 -0
- data/lib/lucid_component/app_store_defaults.rb +36 -0
- data/lib/lucid_component/app_store_proxy.rb +38 -0
- data/lib/lucid_component/base.rb +7 -0
- data/lib/lucid_component/class_store_proxy.rb +41 -0
- data/lib/lucid_component/component_class_store_defaults.rb +38 -0
- data/lib/lucid_component/component_instance_store_defaults.rb +35 -0
- data/lib/lucid_component/event_handler.rb +17 -0
- data/lib/lucid_component/initializer.rb +12 -0
- data/lib/lucid_component/instance_store_proxy.rb +45 -0
- data/lib/lucid_component/mixin.rb +18 -0
- data/lib/lucid_component/native_component_constructor.rb +116 -0
- data/lib/lucid_component/reducers.rb +48 -0
- data/lib/lucid_component/store_api.rb +38 -0
- data/lib/lucid_component/styles_support.rb +37 -0
- data/lib/lucid_material/app/base.rb +9 -0
- data/lib/lucid_material/app/mixin.rb +22 -0
- data/lib/lucid_material/app/native_component_constructor.rb +107 -0
- data/lib/lucid_material/component/base.rb +9 -0
- data/lib/lucid_material/component/mixin.rb +20 -0
- data/lib/lucid_material/component/native_component_constructor.rb +118 -0
- data/lib/lucid_prop_declaration/mixin.rb +91 -0
- data/lib/react.rb +195 -0
- data/lib/react/active_support_support.rb +13 -0
- data/lib/react/children.rb +35 -0
- data/lib/react/component/api.rb +80 -0
- data/lib/react/component/base.rb +9 -0
- data/lib/react/component/callbacks.rb +106 -0
- data/lib/react/component/elements.rb +60 -0
- data/lib/react/component/event_handler.rb +19 -0
- data/lib/react/component/features.rb +47 -0
- data/lib/react/component/history.rb +36 -0
- data/lib/react/component/initializer.rb +11 -0
- data/lib/react/component/location.rb +15 -0
- data/lib/react/component/match.rb +31 -0
- data/lib/react/component/mixin.rb +19 -0
- data/lib/react/component/native_component_constructor.rb +93 -0
- data/lib/react/component/props.rb +59 -0
- data/lib/react/component/resolution.rb +70 -0
- data/lib/react/component/should_component_update.rb +14 -0
- data/lib/react/component/state.rb +52 -0
- data/lib/react/component/styles.rb +27 -0
- data/lib/react/component/unsafe_api.rb +33 -0
- data/lib/react/context_wrapper.rb +46 -0
- data/lib/react/function_component/api.rb +63 -0
- data/lib/react/function_component/base.rb +9 -0
- data/lib/react/function_component/creator.rb +32 -0
- data/lib/react/function_component/event_handler.rb +13 -0
- data/lib/react/function_component/mixin.rb +14 -0
- data/lib/react/function_component/resolution.rb +62 -0
- data/lib/react/memo_component/base.rb +9 -0
- data/lib/react/memo_component/creator.rb +32 -0
- data/lib/react/memo_component/mixin.rb +14 -0
- data/lib/react/native_constant_wrapper.rb +26 -0
- data/lib/react/pure_component/base.rb +9 -0
- data/lib/react/pure_component/mixin.rb +18 -0
- data/lib/react/ref.rb +13 -0
- data/lib/react/synthetic_event.rb +53 -0
- data/lib/react/version.rb +3 -0
- data/lib/react_dom.rb +47 -0
- data/lib/react_dom_server.rb +19 -0
- metadata +84 -2
@@ -0,0 +1,91 @@
|
|
1
|
+
module LucidPropDeclaration
|
2
|
+
module Mixin
|
3
|
+
if RUBY_ENGINE == 'opal'
|
4
|
+
def self.extended(base)
|
5
|
+
|
6
|
+
def prop(prop_name, validate_hash = { required: true })
|
7
|
+
validate_hash = validate_hash.to_h if validate_hash.class == Isomorfeus::Props::ValidateHashProxy
|
8
|
+
if validate_hash.key?(:default)
|
9
|
+
%x{
|
10
|
+
if (base.lucid_react_component) {
|
11
|
+
let react_prop_name = Opal.React.lower_camelize(prop_name);
|
12
|
+
#{value = validate_hash[:default]}
|
13
|
+
if (!base.lucid_react_component.defaultProps) { base.lucid_react_component.defaultProps = {}; }
|
14
|
+
base.lucid_react_component.defaultProps[react_prop_name] = value;
|
15
|
+
if (!base.lucid_react_component.propTypes) { base.lucid_react_component.propTypes = {}; }
|
16
|
+
base.lucid_react_component.propTypes[react_prop_name] = base.lucid_react_component.prototype.validateProp;
|
17
|
+
} else if (base.react_component) {
|
18
|
+
let react_prop_name = Opal.React.lower_camelize(prop_name);
|
19
|
+
#{value = validate_hash[:default]}
|
20
|
+
if (!base.react_component.defaultProps) { base.react_component.defaultProps = {}; }
|
21
|
+
base.react_component.defaultProps[react_prop_name] = value;
|
22
|
+
if (!base.react_component.propTypes) { base.react_component.propTypes = {}; }
|
23
|
+
base.react_component.propTypes[react_prop_name] = base.react_component.prototype.validateProp;
|
24
|
+
}
|
25
|
+
}
|
26
|
+
end
|
27
|
+
declared_props[prop_name.to_sym] = validate_hash
|
28
|
+
end
|
29
|
+
end
|
30
|
+
|
31
|
+
def validate_function
|
32
|
+
%x{
|
33
|
+
if (typeof self.validate_function === 'undefined') {
|
34
|
+
self.validate_function = function(props_object) {
|
35
|
+
try { self.$validate_props(Opal.Hash.$new(props_object)) }
|
36
|
+
catch (e) { return e.message; }
|
37
|
+
}
|
38
|
+
}
|
39
|
+
return self.validate_function;
|
40
|
+
}
|
41
|
+
end
|
42
|
+
|
43
|
+
def validate_prop_function(prop)
|
44
|
+
function_name = "validate_#{prop}_function"
|
45
|
+
%x{
|
46
|
+
if (typeof self[function_name] === 'undefined') {
|
47
|
+
self[function_name] = function(value) {
|
48
|
+
try { self.$validate_prop(prop, value); }
|
49
|
+
catch (e) { return e.message; }
|
50
|
+
}
|
51
|
+
}
|
52
|
+
return self[function_name];
|
53
|
+
}
|
54
|
+
end
|
55
|
+
else
|
56
|
+
def prop(prop_name, validate_hash = { required: true })
|
57
|
+
validate_hash = validate_hash.to_h if validate_hash.class == Isomorfeus::Props::ValidateHashProxy
|
58
|
+
declared_props[prop_name.to_sym] = validate_hash
|
59
|
+
end
|
60
|
+
end
|
61
|
+
|
62
|
+
def declared_props
|
63
|
+
@declared_props ||= {}
|
64
|
+
end
|
65
|
+
|
66
|
+
def validate
|
67
|
+
Isomorfeus::Props::ValidateHashProxy.new
|
68
|
+
end
|
69
|
+
|
70
|
+
def validate_prop(prop, value)
|
71
|
+
return false unless declared_props.key?(prop)
|
72
|
+
validator = Isomorfeus::Props::Validator.new(self, prop, value, declared_props[prop])
|
73
|
+
validator.validate!
|
74
|
+
true
|
75
|
+
end
|
76
|
+
|
77
|
+
def validate_props(props)
|
78
|
+
declared_props.each_key do |prop|
|
79
|
+
if declared_props[prop].key?(:required) && declared_props[prop][:required] && !props.key?(prop)
|
80
|
+
raise "Required prop #{prop} not given!"
|
81
|
+
end
|
82
|
+
end
|
83
|
+
result = true
|
84
|
+
props.each do |p, v|
|
85
|
+
r = validate_prop(p, v)
|
86
|
+
result = false unless r
|
87
|
+
end
|
88
|
+
result
|
89
|
+
end
|
90
|
+
end
|
91
|
+
end
|
data/lib/react.rb
ADDED
@@ -0,0 +1,195 @@
|
|
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
|
+
# language=JS
|
5
|
+
%x{
|
6
|
+
self.render_buffer = [];
|
7
|
+
|
8
|
+
self.set_validate_prop = function(component, prop_name) {
|
9
|
+
if (typeof component.react_component.propTypes == "undefined") {
|
10
|
+
component.react_component.propTypes = {};
|
11
|
+
component.react_component.propValidations = {};
|
12
|
+
component.react_component.propValidations[prop_name] = {};
|
13
|
+
}
|
14
|
+
component.react_component.propTypes[prop_name] = component.react_component.prototype.validateProp;
|
15
|
+
};
|
16
|
+
|
17
|
+
self.lower_camelize = function(snake_cased_word) {
|
18
|
+
var parts = snake_cased_word.split('_');
|
19
|
+
var res = parts[0];
|
20
|
+
|
21
|
+
for (var i = 1; i < parts.length; i++) {
|
22
|
+
res += parts[i][0].toUpperCase() + parts[i].slice(1);
|
23
|
+
}
|
24
|
+
return res;
|
25
|
+
};
|
26
|
+
|
27
|
+
self.native_element_or_component_to_ruby = function (element) {
|
28
|
+
if (typeof element.__ruby_instance !== 'undefined') { return element.__ruby_instance }
|
29
|
+
if (element instanceof Element || element instanceof Node) { return #{Browser::Element.new(`element`)} }
|
30
|
+
return element;
|
31
|
+
};
|
32
|
+
|
33
|
+
self.to_native_react_props = function(ruby_style_props) {
|
34
|
+
var result = {};
|
35
|
+
var keys = ruby_style_props.$keys();
|
36
|
+
var keys_length = keys.length;
|
37
|
+
for (var i = 0; i < keys_length; i++) {
|
38
|
+
if (keys[i].startsWith("on_")) {
|
39
|
+
var handler = ruby_style_props['$[]'](keys[i]);
|
40
|
+
if (typeof handler === "function") {
|
41
|
+
result[Opal.React.lower_camelize(keys[i])] = handler;
|
42
|
+
} else {
|
43
|
+
var active_component = Opal.React.active_component();
|
44
|
+
result[Opal.React.lower_camelize(keys[i])] = active_component[handler];
|
45
|
+
}
|
46
|
+
} else if (keys[i].startsWith("aria_")) {
|
47
|
+
result[keys[i].replace("_", "-")] = ruby_style_props['$[]'](keys[i]);
|
48
|
+
} else if (keys[i] === "style") {
|
49
|
+
var val = ruby_style_props['$[]'](keys[i]);
|
50
|
+
if (typeof val.$$is_hash !== "undefined") { val = val.$to_n() }
|
51
|
+
result["style"] = val;
|
52
|
+
} else {
|
53
|
+
result[Opal.React.lower_camelize(keys[i])] = ruby_style_props['$[]'](keys[i]);
|
54
|
+
}
|
55
|
+
}
|
56
|
+
return result;
|
57
|
+
};
|
58
|
+
|
59
|
+
self.internal_prepare_args_and_render = function(component, args, block) {
|
60
|
+
if (args.length > 0) {
|
61
|
+
var last_arg = args[args.length - 1];
|
62
|
+
if (typeof last_arg === 'string' || last_arg instanceof String) {
|
63
|
+
if (args.length === 1) { return Opal.React.internal_render(component, null, last_arg, null); }
|
64
|
+
else { return Opal.React.internal_render(component, args[0], last_arg, null); }
|
65
|
+
} else { return Opal.React.internal_render(component, args[0], null, block); }
|
66
|
+
} else { return Opal.React.internal_render(component, null, null, block); }
|
67
|
+
};
|
68
|
+
|
69
|
+
self.internal_render = function(component, props, string_child, block) {
|
70
|
+
let children;
|
71
|
+
let react_element;
|
72
|
+
let native_props = null;
|
73
|
+
|
74
|
+
if (string_child) {
|
75
|
+
children = string_child;
|
76
|
+
} else if (block && block !== nil) {
|
77
|
+
Opal.React.render_buffer.push([]);
|
78
|
+
let block_result = block.$call();
|
79
|
+
let last_buffer_length = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].length;
|
80
|
+
let last_buffer_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1][last_buffer_length - 1];
|
81
|
+
if (block_result && block_result !== last_buffer_element && (block_result !== nil && (typeof block_result === "string" || typeof block_result.$$typeof === "symbol" ||
|
82
|
+
(typeof block_result.constructor !== "undefined" && block_result.constructor === Array && block_result[0] && typeof block_result[0].$$typeof === "symbol")
|
83
|
+
))) {
|
84
|
+
Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result);
|
85
|
+
}
|
86
|
+
children = Opal.React.render_buffer.pop();
|
87
|
+
if (children.length == 1) { children = children[0]; }
|
88
|
+
else if (children.length == 0) { children = null; }
|
89
|
+
}
|
90
|
+
if (props && props !== nil) { native_props = Opal.React.to_native_react_props(props); }
|
91
|
+
react_element = Opal.global.React.createElement(component, native_props, children);
|
92
|
+
Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(react_element);
|
93
|
+
return react_element;
|
94
|
+
};
|
95
|
+
|
96
|
+
self.active_components = [];
|
97
|
+
|
98
|
+
self.active_component = function() {
|
99
|
+
var length = Opal.React.active_components.length;
|
100
|
+
if (length === 0) { return null; };
|
101
|
+
return Opal.React.active_components[length-1];
|
102
|
+
};
|
103
|
+
|
104
|
+
self.active_redux_components = [];
|
105
|
+
|
106
|
+
self.active_redux_component = function() {
|
107
|
+
var length = Opal.React.active_redux_components.length;
|
108
|
+
if (length === 0) { return null; };
|
109
|
+
return Opal.React.active_redux_components[length-1];
|
110
|
+
};
|
111
|
+
}
|
112
|
+
|
113
|
+
def self.clone_element(ruby_react_element, props = nil, children = nil, &block)
|
114
|
+
block_result = `null`
|
115
|
+
if block_given?
|
116
|
+
block_result = block.call
|
117
|
+
block_result = `null` unless block_result
|
118
|
+
end
|
119
|
+
native_props = props ? `Opal.React.to_native_react_props(props)` : `null`
|
120
|
+
`Opal.global.React.cloneElement(ruby_react_element.$to_n(), native_props, block_result)`
|
121
|
+
end
|
122
|
+
|
123
|
+
def self.create_context(const_name, default_value)
|
124
|
+
%x{
|
125
|
+
Opal.global[const_name] = Opal.global.React.createContext(default_value);
|
126
|
+
var new_const = #{React::ContextWrapper.new(`Opal.global[const_name]`)};
|
127
|
+
#{Object.const_set(const_name, `new_const`)};
|
128
|
+
return new_const;
|
129
|
+
}
|
130
|
+
end
|
131
|
+
|
132
|
+
def self.create_element(type, props = nil, children = nil, &block)
|
133
|
+
%x{
|
134
|
+
let component = null;
|
135
|
+
let native_props = null;
|
136
|
+
if (typeof type.react_component !== 'undefined') {
|
137
|
+
component = type.react_component;
|
138
|
+
} else {
|
139
|
+
component = type;
|
140
|
+
}
|
141
|
+
|
142
|
+
Opal.React.render_buffer.push([]);
|
143
|
+
if (block !== nil) {
|
144
|
+
let block_result = block.$call()
|
145
|
+
let last_buffer_length = Opal.React.render_buffer[Opal.React.render_buffer.length - 1].length;
|
146
|
+
let last_buffer_element = Opal.React.render_buffer[Opal.React.render_buffer.length - 1][last_buffer_length - 1];
|
147
|
+
if (block_result && block_result !== last_buffer_element && (block_result !== nil && (typeof block_result === "string" || typeof block_result.$$typeof === "symbol" ||
|
148
|
+
(typeof block_result.constructor !== "undefined" && block_result.constructor === Array && block_result[0] && typeof block_result[0].$$typeof === "symbol")
|
149
|
+
))) {
|
150
|
+
Opal.React.render_buffer[Opal.React.render_buffer.length - 1].push(block_result);
|
151
|
+
}
|
152
|
+
children = Opal.React.render_buffer.pop()
|
153
|
+
if (children.length == 1) { children = children[0]; }
|
154
|
+
else if (children.length == 0) { children = null; }
|
155
|
+
}
|
156
|
+
if (props && props !== nil) { native_props = Opal.React.to_native_react_props(props); }
|
157
|
+
return Opal.global.React.createElement(component, native_props, children);
|
158
|
+
}
|
159
|
+
end
|
160
|
+
|
161
|
+
def self.create_factory(type)
|
162
|
+
native_function = `Opal.global.React.createFactory(type)`
|
163
|
+
proc { `native_function.call()` }
|
164
|
+
end
|
165
|
+
|
166
|
+
def self.create_ref
|
167
|
+
React::Ref.new(`Opal.global.React.createRef()`)
|
168
|
+
end
|
169
|
+
|
170
|
+
def self.forwardRef(&block)
|
171
|
+
# TODO whats the return here? A React:Element?, doc says a React node, whats that?
|
172
|
+
`Opal.global.React.forwardRef( function(props, ref) { return block.$call().$to_n(); })`
|
173
|
+
end
|
174
|
+
|
175
|
+
def self.is_valid_element(react_element)
|
176
|
+
`Opal.global.React.isValidElement(react_element)`
|
177
|
+
end
|
178
|
+
|
179
|
+
def self.lazy(import_statement_function)
|
180
|
+
`Opal.global.React.lazy(import_statement_function)`
|
181
|
+
end
|
182
|
+
|
183
|
+
def self.memo(function_component, &block)
|
184
|
+
if block_given?
|
185
|
+
%x{
|
186
|
+
var fun = function(prev_props, next_props) {
|
187
|
+
return #{block.call(::React::Component::Props.new(`{props: prev_props}`), ::React::Component::Props.new(`{props: next_props}`))};
|
188
|
+
}
|
189
|
+
return Opal.global.React.memo(function_component, fun);
|
190
|
+
}
|
191
|
+
else
|
192
|
+
`Opal.global.React.memo(function_component)`
|
193
|
+
end
|
194
|
+
end
|
195
|
+
end
|
@@ -0,0 +1,35 @@
|
|
1
|
+
module React
|
2
|
+
module Children
|
3
|
+
class << self
|
4
|
+
def count(children)
|
5
|
+
`Opal.global.React.Children.count(children)`
|
6
|
+
end
|
7
|
+
|
8
|
+
def for_each(children, &block)
|
9
|
+
%x{
|
10
|
+
var fun = function(child) {
|
11
|
+
#{block.call(child)};
|
12
|
+
}
|
13
|
+
Opal.global.React.Children.forEach(children, fun);
|
14
|
+
}
|
15
|
+
end
|
16
|
+
|
17
|
+
def map(children, &block)
|
18
|
+
%x{
|
19
|
+
var fun = function(child) {
|
20
|
+
return #{block.call(child)};
|
21
|
+
}
|
22
|
+
return Opal.global.React.Children.map(children, fun);
|
23
|
+
}
|
24
|
+
end
|
25
|
+
|
26
|
+
def only(children)
|
27
|
+
`Opal.global.React.Children.only(children)`
|
28
|
+
end
|
29
|
+
|
30
|
+
def to_array(children)
|
31
|
+
`Opal.global.React.Children.toArray(children)`
|
32
|
+
end
|
33
|
+
end
|
34
|
+
end
|
35
|
+
end
|
@@ -0,0 +1,80 @@
|
|
1
|
+
module React
|
2
|
+
module Component
|
3
|
+
module API
|
4
|
+
def self.included(base)
|
5
|
+
base.instance_exec do
|
6
|
+
base_module = base.to_s.deconstantize
|
7
|
+
if base_module != ''
|
8
|
+
base_module.constantize.define_singleton_method(base.to_s.demodulize) do |*args, &block|
|
9
|
+
`Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
|
10
|
+
end
|
11
|
+
else
|
12
|
+
Object.define_method(base.to_s) do |*args, &block|
|
13
|
+
`Opal.React.internal_prepare_args_and_render(#{base}.react_component, args, block)`
|
14
|
+
end
|
15
|
+
end
|
16
|
+
|
17
|
+
attr_accessor :props
|
18
|
+
attr_accessor :state
|
19
|
+
|
20
|
+
def ref(ref_name, &block)
|
21
|
+
defined_refs.JS[ref_name] = block_given? ? block : `null`
|
22
|
+
end
|
23
|
+
|
24
|
+
def defined_refs
|
25
|
+
@defined_ref ||= `{}`
|
26
|
+
end
|
27
|
+
|
28
|
+
def default_state_defined
|
29
|
+
@default_state_defined
|
30
|
+
end
|
31
|
+
|
32
|
+
def state
|
33
|
+
return @default_state if @default_state
|
34
|
+
@default_state_defined = true
|
35
|
+
%x{
|
36
|
+
var native_state = {state: {}};
|
37
|
+
native_state.setState = function(new_state, callback) {
|
38
|
+
for (var key in new_state) {
|
39
|
+
this.state[key] = new_state[key];
|
40
|
+
}
|
41
|
+
if (callback) { callback.call(); }
|
42
|
+
}
|
43
|
+
}
|
44
|
+
@default_state = React::Component::State.new(`native_state`)
|
45
|
+
end
|
46
|
+
|
47
|
+
def render(&block)
|
48
|
+
`base.render_block = block`
|
49
|
+
end
|
50
|
+
end
|
51
|
+
end
|
52
|
+
|
53
|
+
def display_name
|
54
|
+
@native.JS[:displayName]
|
55
|
+
end
|
56
|
+
|
57
|
+
def force_update(&block)
|
58
|
+
if block_given?
|
59
|
+
# this maybe needs instance_exec too
|
60
|
+
@native.JS.forceUpdate(`function() { block.$call(); }`)
|
61
|
+
else
|
62
|
+
@native.JS.forceUpdate
|
63
|
+
end
|
64
|
+
end
|
65
|
+
|
66
|
+
def ref(name)
|
67
|
+
`#@native[name]`
|
68
|
+
end
|
69
|
+
|
70
|
+
def ruby_ref(name)
|
71
|
+
return `#@native[name]` if `(typeof #@native[name] === 'function')`
|
72
|
+
React::Ref::new(`#@native[name]`)
|
73
|
+
end
|
74
|
+
|
75
|
+
def set_state(updater, &callback)
|
76
|
+
@state.set_state(updater, &callback)
|
77
|
+
end
|
78
|
+
end
|
79
|
+
end
|
80
|
+
end
|
@@ -0,0 +1,106 @@
|
|
1
|
+
module React
|
2
|
+
module Component
|
3
|
+
module Callbacks
|
4
|
+
def self.included(base)
|
5
|
+
base.instance_exec do
|
6
|
+
def component_did_catch(&block)
|
7
|
+
# TODO convert error and info
|
8
|
+
%x{
|
9
|
+
var fun = function(error, info) {
|
10
|
+
Opal.React.active_redux_components.push(this.__ruby_instance);
|
11
|
+
#{`this.__ruby_instance`.instance_exec(`error`, `info`, &block)};
|
12
|
+
Opal.React.active_redux_components.pop();
|
13
|
+
}
|
14
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidCatch = fun; }
|
15
|
+
else { self.react_component.prototype.componentDidCatch = fun; }
|
16
|
+
}
|
17
|
+
end
|
18
|
+
|
19
|
+
def component_did_mount(&block)
|
20
|
+
%x{
|
21
|
+
var fun = function() {
|
22
|
+
Opal.React.active_redux_components.push(this.__ruby_instance);
|
23
|
+
#{`this.__ruby_instance`.instance_exec(&block)};
|
24
|
+
Opal.React.active_redux_components.pop();
|
25
|
+
}
|
26
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidMount = fun; }
|
27
|
+
else { self.react_component.prototype.componentDidMount = fun; }
|
28
|
+
}
|
29
|
+
end
|
30
|
+
|
31
|
+
def component_did_update(&block)
|
32
|
+
%x{
|
33
|
+
var fun = function(prev_props, prev_state, snapshot) {
|
34
|
+
Opal.React.active_redux_components.push(this.__ruby_instance);
|
35
|
+
#{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
|
36
|
+
`Opal.React.Component.State.$new({state: prev_state})`,
|
37
|
+
`snapshot`, &block)};
|
38
|
+
Opal.React.active_redux_components.pop();
|
39
|
+
}
|
40
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.componentDidUpdate = fun; }
|
41
|
+
else { self.react_component.prototype.componentDidUpdate = fun; }
|
42
|
+
}
|
43
|
+
end
|
44
|
+
|
45
|
+
def component_will_unmount(&block)
|
46
|
+
%x{
|
47
|
+
var fun = function() {
|
48
|
+
if (typeof this.unsubscriber === "function") { this.unsubscriber(); };
|
49
|
+
Opal.React.active_redux_components.push(this.__ruby_instance);
|
50
|
+
#{`this.__ruby_instance`.instance_exec(&block)};
|
51
|
+
Opal.React.active_redux_components.pop();
|
52
|
+
}
|
53
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.componentWillUnmount = fun; }
|
54
|
+
else { self.react_component.prototype.componentWillUnmount = fun; }
|
55
|
+
}
|
56
|
+
end
|
57
|
+
|
58
|
+
def get_derived_state_from_error(&block)
|
59
|
+
# TODO convert error
|
60
|
+
%x{
|
61
|
+
var fun = function(error) {
|
62
|
+
var result = #{`this.__ruby_instance`.instance_exec(`error`, &block)};
|
63
|
+
if (typeof result.$to_n === 'function') { result = result.$to_n() }
|
64
|
+
if (result === Opal.nil) { return null; }
|
65
|
+
return result;
|
66
|
+
}
|
67
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromError = fun; }
|
68
|
+
else { self.react_component.prototype.getDerivedStateFromError = fun; }
|
69
|
+
}
|
70
|
+
end
|
71
|
+
|
72
|
+
def get_derived_state_from_props(&block)
|
73
|
+
%x{
|
74
|
+
var fun = function(props, state) {
|
75
|
+
Opal.React.active_redux_components.push(this.__ruby_instance);
|
76
|
+
var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: props})`,
|
77
|
+
`Opal.React.Component.State.$new({state: state})`, &block)};
|
78
|
+
Opal.React.active_redux_components.pop();
|
79
|
+
if (typeof result.$to_n === 'function') { result = result.$to_n() }
|
80
|
+
if (result === Opal.nil) { return null; }
|
81
|
+
return result;
|
82
|
+
}
|
83
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.getDerivedStateFromProps = fun; }
|
84
|
+
else { self.react_component.prototype.getDerivedStateFromProps = fun; }
|
85
|
+
}
|
86
|
+
end
|
87
|
+
|
88
|
+
def get_snapshot_before_update(&block)
|
89
|
+
%x{
|
90
|
+
var fun = function(prev_props, prev_state) {
|
91
|
+
|
92
|
+
var result = #{`this.__ruby_instance`.instance_exec(`Opal.React.Component.Props.$new({props: prev_props})`,
|
93
|
+
`Opal.React.Component.State.$new({state: prev_state})`, &block)};
|
94
|
+
Opal.React.active_redux_components.pop();
|
95
|
+
if (result === Opal.nil) { return null; }
|
96
|
+
return result;
|
97
|
+
}
|
98
|
+
if (self.lucid_react_component) { self.lucid_react_component.prototype.getSnapshotBeforeUpdate = fun; }
|
99
|
+
else { self.react_component.prototype.getSnapshotBeforeUpdate = fun; }
|
100
|
+
}
|
101
|
+
end
|
102
|
+
end
|
103
|
+
end
|
104
|
+
end
|
105
|
+
end
|
106
|
+
end
|