isomorfeus-react 16.8.9 → 16.9.0
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 +0 -1
- 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 +1 -31
- data/lib/isomorfeus-react.rb +112 -5
- data/lib/isomorfeus/execution_environment.rb +8 -2
- data/lib/isomorfeus/top_level_browser.rb +1 -1
- data/lib/lucid_app/mixin.rb +1 -1
- data/lib/lucid_component/app_store_defaults.rb +36 -0
- data/lib/lucid_component/app_store_proxy.rb +40 -0
- data/lib/lucid_component/class_store_proxy.rb +43 -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/initializer.rb +3 -3
- data/lib/lucid_component/instance_store_proxy.rb +47 -0
- data/lib/lucid_component/mixin.rb +1 -1
- data/lib/lucid_component/reducers.rb +46 -0
- data/lib/lucid_component/store_api.rb +38 -0
- data/lib/lucid_material/app/mixin.rb +1 -1
- data/lib/lucid_material/component/mixin.rb +1 -1
- data/lib/react.rb +1 -2
- data/lib/react/component/api.rb +4 -0
- data/lib/react/component/features.rb +5 -1
- data/lib/react/component/mixin.rb +1 -1
- data/lib/react/component/props.rb +1 -1
- data/lib/react/function_component/api.rb +5 -25
- data/lib/react/pure_component/mixin.rb +1 -1
- data/lib/react/synthetic_event.rb +3 -3
- data/lib/react/version.rb +1 -1
- data/lib/react_dom.rb +1 -1
- metadata +22 -36
- data/lib/isomorfeus-react-base.rb +0 -57
- data/lib/isomorfeus-react-component.rb +0 -20
- data/lib/isomorfeus-react-lucid.rb +0 -39
- data/lib/isomorfeus-react-redux-component.rb +0 -25
- data/lib/react/redux_component/api.rb +0 -40
- data/lib/react/redux_component/app_store_defaults.rb +0 -38
- data/lib/react/redux_component/app_store_proxy.rb +0 -43
- data/lib/react/redux_component/base.rb +0 -9
- data/lib/react/redux_component/class_store_proxy.rb +0 -46
- data/lib/react/redux_component/component_class_store_defaults.rb +0 -40
- data/lib/react/redux_component/component_instance_store_defaults.rb +0 -37
- data/lib/react/redux_component/initializer.rb +0 -14
- data/lib/react/redux_component/instance_store_proxy.rb +0 -50
- data/lib/react/redux_component/mixin.rb +0 -19
- data/lib/react/redux_component/native_component_constructor.rb +0 -144
- data/lib/react/redux_component/reducers.rb +0 -48
@@ -1,40 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
class ComponentClassStoreDefaults
|
4
|
-
def initialize(state, component_name)
|
5
|
-
@state = state
|
6
|
-
@component_name = component_name
|
7
|
-
if @state.isomorfeus_store
|
8
|
-
@state.isomorfeus_store.merge!(component_class_state: { @component_name => {} })
|
9
|
-
else
|
10
|
-
@state.isomorfeus_store = { component_class_state: { @component_name => {} } }
|
11
|
-
end
|
12
|
-
end
|
13
|
-
|
14
|
-
def method_missing(key, *args, &block)
|
15
|
-
if `args.length > 0`
|
16
|
-
# set initial class state
|
17
|
-
key = key.chop if `key.endsWith('=')`
|
18
|
-
@state.isomorfeus_store[:component_class_state][@component_name][key] = args[0]
|
19
|
-
current_state = Isomorfeus.store.get_state
|
20
|
-
if !(current_state[:component_class_state].key?(@component_name) && current_state[:component_class_state][@component_name].key?(key))
|
21
|
-
Isomorfeus.store.dispatch(type: 'COMPONENT_CLASS_STATE', class: @component_name, name: key, value: args[0])
|
22
|
-
end
|
23
|
-
else
|
24
|
-
# get class state
|
25
|
-
|
26
|
-
# check if we have a component local state value
|
27
|
-
|
28
|
-
if @state.isomorfeus_store[:component_class_state][@component_name].key?(key)
|
29
|
-
return @state.isomorfeus_store[:component_class_state][@component_name][key]
|
30
|
-
end
|
31
|
-
end
|
32
|
-
nil
|
33
|
-
end
|
34
|
-
|
35
|
-
def to_h
|
36
|
-
@state.isomorfeus_store[:component_class_state][@component_name]
|
37
|
-
end
|
38
|
-
end
|
39
|
-
end
|
40
|
-
end
|
@@ -1,37 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
class ComponentInstanceStoreDefaults
|
4
|
-
def initialize(state, component_name)
|
5
|
-
@state = {}
|
6
|
-
@component_name = component_name
|
7
|
-
end
|
8
|
-
|
9
|
-
def method_missing(key, *args, &block)
|
10
|
-
if `args.length > 0`
|
11
|
-
# set initial class state
|
12
|
-
key = key.chop if `key.endsWith('=')`
|
13
|
-
@state[key] = args[0]
|
14
|
-
current_state = Isomorfeus.store.get_state
|
15
|
-
if !(current_state[:component_state].key?(@component_name) &&
|
16
|
-
current_state[:component_state][@component_name].key?(:instance_defaults) &&
|
17
|
-
current_state[:component_state][@component_name][:instance_defaults].key?(key))
|
18
|
-
Isomorfeus.store.dispatch(type: 'COMPONENT_CLASS_STATE', class: @component_name, name: :instance_defaults, value: { key => args[0]})
|
19
|
-
end
|
20
|
-
else
|
21
|
-
# get class state
|
22
|
-
|
23
|
-
# check if we have a component local state value
|
24
|
-
|
25
|
-
if @state.key?(key)
|
26
|
-
return @state[key]
|
27
|
-
end
|
28
|
-
end
|
29
|
-
nil
|
30
|
-
end
|
31
|
-
|
32
|
-
def to_h
|
33
|
-
@state
|
34
|
-
end
|
35
|
-
end
|
36
|
-
end
|
37
|
-
end
|
@@ -1,14 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
module Initializer
|
4
|
-
def initialize(native_component)
|
5
|
-
@native = native_component
|
6
|
-
@app_store = `Opal.React.ReduxComponent.AppStoreProxy.$new(#{self})`
|
7
|
-
@class_store = `Opal.React.ReduxComponent.ClassStoreProxy.$new(#{self})`
|
8
|
-
@props = `Opal.React.Component.Props.$new(#@native)`
|
9
|
-
@state = `Opal.React.Component.State.$new(#@native)`
|
10
|
-
@store = `Opal.React.ReduxComponent.InstanceStoreProxy.$new(#{self})`
|
11
|
-
end
|
12
|
-
end
|
13
|
-
end
|
14
|
-
end
|
@@ -1,50 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
class InstanceStoreProxy
|
4
|
-
|
5
|
-
def initialize(component_instance, access_key = 'state')
|
6
|
-
@native_component_instance = component_instance.to_n
|
7
|
-
@component_instance = component_instance
|
8
|
-
@component_object_id = component_instance.object_id.to_s
|
9
|
-
@access_key = access_key
|
10
|
-
end
|
11
|
-
|
12
|
-
def method_missing(key, *args, &block)
|
13
|
-
@native_component_instance.JS.register_used_store_path(['component_state', @component_object_id, key])
|
14
|
-
if `args.length > 0`
|
15
|
-
# set instance state, simply a dispatch
|
16
|
-
|
17
|
-
action = { type: 'COMPONENT_STATE', object_id: @component_object_id, name: (`key.endsWith('=')` ? key.chop : key), value: args[0] }
|
18
|
-
Isomorfeus.store.dispatch(action)
|
19
|
-
|
20
|
-
else
|
21
|
-
# get instance state
|
22
|
-
|
23
|
-
if @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id] &&
|
24
|
-
@native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id].JS.hasOwnProperty(key)
|
25
|
-
# check if we have a component local state value
|
26
|
-
return @native_component_instance.JS[@access_key].JS[:isomorfeus_store].JS[:component_state].JS[@component_object_id].JS[key]
|
27
|
-
elsif @component_instance.class.default_instance_store_defined && @component_instance.class.store.to_h.key?(key)
|
28
|
-
# check if a default value was given
|
29
|
-
return @component_instance.class.store.to_h[key]
|
30
|
-
end
|
31
|
-
|
32
|
-
# otherwise return nil
|
33
|
-
return nil
|
34
|
-
end
|
35
|
-
end
|
36
|
-
|
37
|
-
def dispatch(action)
|
38
|
-
Isomorfeus.store.dispatch(action)
|
39
|
-
end
|
40
|
-
|
41
|
-
def subscribe(&block)
|
42
|
-
Isomorfeus.store.subscribe(&block)
|
43
|
-
end
|
44
|
-
|
45
|
-
def unsubscribe(unsubscriber)
|
46
|
-
`unsubscriber()`
|
47
|
-
end
|
48
|
-
end
|
49
|
-
end
|
50
|
-
end
|
@@ -1,19 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
module Mixin
|
4
|
-
def self.included(base)
|
5
|
-
base.include(::Native::Wrapper)
|
6
|
-
base.extend(::React::ReduxComponent::NativeComponentConstructor)
|
7
|
-
base.extend(::React::Component::NativeComponentValidateProp)
|
8
|
-
base.extend(::React::Component::EventHandler)
|
9
|
-
base.include(::React::Component::Elements)
|
10
|
-
base.include(::React::Component::API)
|
11
|
-
base.include(::React::Component::Callbacks)
|
12
|
-
base.include(::React::ReduxComponent::API)
|
13
|
-
base.include(::React::ReduxComponent::Initializer)
|
14
|
-
base.include(::React::Component::Features)
|
15
|
-
base.include(::React::Component::Resolution)
|
16
|
-
end
|
17
|
-
end
|
18
|
-
end
|
19
|
-
end
|
@@ -1,144 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
module NativeComponentConstructor
|
4
|
-
# for should_component_update we apply ruby semantics for comparing props
|
5
|
-
# to do so, we convert the props to ruby hashes and then compare
|
6
|
-
# this makes sure, that for example rubys Nil object gets handled properly
|
7
|
-
def self.extended(base)
|
8
|
-
component_name = base.to_s
|
9
|
-
# language=JS
|
10
|
-
%x{
|
11
|
-
base.react_component = class extends Opal.global.React.Component {
|
12
|
-
constructor(props) {
|
13
|
-
super(props);
|
14
|
-
if (base.$default_state_defined()) {
|
15
|
-
this.state = Object.assign({}, base.$state().$to_n(), { isomorfeus_store: Opal.Isomorfeus.store.native.getState() });
|
16
|
-
} else {
|
17
|
-
this.state = { isomorfeus_store: Opal.Isomorfeus.store.native.getState() };
|
18
|
-
};
|
19
|
-
if (typeof this.state.isomorfeus_store.component_class_state[#{component_name}] === "undefined") {
|
20
|
-
this.state.isomorfeus_store.component_class_state[#{component_name}] = {};
|
21
|
-
};
|
22
|
-
this.__ruby_instance = base.$new(this);
|
23
|
-
this.__object_id = this.__ruby_instance.$object_id().$to_s();
|
24
|
-
if (!this.state.isomorfeus_store.component_state) {
|
25
|
-
this.state.isomorfeus_store.component_state = {};
|
26
|
-
if (base.$default_instance_store_defined()) {
|
27
|
-
this.state.isomorfeus_store.component_state[this.__object_id] = base.$store.$to_n();
|
28
|
-
} else {
|
29
|
-
this.state.isomorfeus_store.component_state[this.__object_id] = {};
|
30
|
-
}
|
31
|
-
};
|
32
|
-
var event_handlers = #{base.event_handlers};
|
33
|
-
for (var i = 0; i < event_handlers.length; i++) {
|
34
|
-
this[event_handlers[i]] = this[event_handlers[i]].bind(this);
|
35
|
-
}
|
36
|
-
var defined_refs = #{base.defined_refs};
|
37
|
-
for (var ref in defined_refs) {
|
38
|
-
if (defined_refs[ref] != null) {
|
39
|
-
this[ref] = function(element) {
|
40
|
-
element = Opal.React.native_element_or_component_to_ruby(element);
|
41
|
-
#{`this.__ruby_instance`.instance_exec(`element`, &`defined_refs[ref]`)}
|
42
|
-
}
|
43
|
-
this[ref] = this[ref].bind(this);
|
44
|
-
} else {
|
45
|
-
this[ref] = Opal.global.React.createRef();
|
46
|
-
}
|
47
|
-
}
|
48
|
-
this.listener = this.listener.bind(this);
|
49
|
-
this.unsubscriber = Opal.Isomorfeus.store.native.subscribe(this.listener);
|
50
|
-
}
|
51
|
-
static get displayName() {
|
52
|
-
return #{component_name};
|
53
|
-
}
|
54
|
-
render() {
|
55
|
-
Opal.React.render_buffer.push([]);
|
56
|
-
Opal.React.active_components.push(this);
|
57
|
-
Opal.React.active_redux_components.push(this);
|
58
|
-
this.used_store_paths = [];
|
59
|
-
#{`this.__ruby_instance`.instance_exec(&`base.render_block`)};
|
60
|
-
Opal.React.active_redux_components.pop();
|
61
|
-
Opal.React.active_components.pop();
|
62
|
-
return Opal.React.render_buffer.pop();
|
63
|
-
}
|
64
|
-
data_access() {
|
65
|
-
return this.state.isomorfeus_store
|
66
|
-
}
|
67
|
-
listener() {
|
68
|
-
var next_state = Object.assign({}, this.state, { isomorfeus_store: Opal.Isomorfeus.store.native.getState() });
|
69
|
-
if (this.scu_for_used_store_paths(this, this.state.isomorfeus_store, next_state.isomorfeus_store)) {
|
70
|
-
var self = this;
|
71
|
-
/* setTimeout(function() { */ self.setState(next_state); /* }, 0); */
|
72
|
-
}
|
73
|
-
}
|
74
|
-
register_used_store_path(path) {
|
75
|
-
this.used_store_paths.push(path);
|
76
|
-
}
|
77
|
-
componentWillUnmount() {
|
78
|
-
if (typeof this.unsubscriber === "function") { this.unsubscriber(); };
|
79
|
-
}
|
80
|
-
shouldComponentUpdate(next_props, next_state) {
|
81
|
-
var next_props_keys = Object.keys(next_props);
|
82
|
-
var this_props_keys = Object.keys(this.props);
|
83
|
-
if (next_props_keys.length !== this_props_keys.length) { return true; }
|
84
|
-
|
85
|
-
var next_state_keys = Object.keys(next_state);
|
86
|
-
var this_state_keys = Object.keys(this.state);
|
87
|
-
if (next_state_keys.length !== this_state_keys.length) { return true; }
|
88
|
-
|
89
|
-
for (var property in next_props) {
|
90
|
-
if (next_props.hasOwnProperty(property)) {
|
91
|
-
if (!this.props.hasOwnProperty(property)) { return true; };
|
92
|
-
if (property == "children") { if (next_props.children !== this.props.children) { return true; }}
|
93
|
-
else if (typeof next_props[property] !== "undefined" && next_props[property] !== null &&
|
94
|
-
typeof next_props[property]['$!='] !== "undefined" &&
|
95
|
-
typeof this.props[property] !== "undefined" && this.props[property] !== null &&
|
96
|
-
typeof this.props[property]['$!='] !== "undefined") {
|
97
|
-
if (#{ !! (`next_props[property]` != `this.props[property]`) }) { return true; };
|
98
|
-
} else if (next_props[property] !== this.props[property]) { return true; };
|
99
|
-
}
|
100
|
-
}
|
101
|
-
var used_store_result;
|
102
|
-
for (var property in next_state) {
|
103
|
-
if (property === "isomorfeus_store") {
|
104
|
-
used_store_result = this.scu_for_used_store_paths(this, this.state.isomorfeus_store, next_state.isomorfeus_store);
|
105
|
-
if (used_store_result) {
|
106
|
-
return true;
|
107
|
-
}
|
108
|
-
} else if (next_state.hasOwnProperty(property)) {
|
109
|
-
if (!this.state.hasOwnProperty(property)) { return true; };
|
110
|
-
if (next_state[property] !== null && typeof next_state[property]['$!='] !== "undefined" &&
|
111
|
-
this.state[property] !== null && typeof this.state[property]['$!='] !== "undefined") {
|
112
|
-
if (#{ !! (`next_state[property]` != `this.state[property]`) }) { return true };
|
113
|
-
} else if (next_state[property] !== this.state[property]) { return true };
|
114
|
-
}
|
115
|
-
}
|
116
|
-
return false;
|
117
|
-
}
|
118
|
-
scu_for_used_store_paths(self, current_state, next_state) {
|
119
|
-
var unique_used_store_paths = self.used_store_paths.filter(function(elem, pos, paths) {
|
120
|
-
return (paths.indexOf(elem) === pos);
|
121
|
-
});
|
122
|
-
var used_length = unique_used_store_paths.length;
|
123
|
-
var store_path;
|
124
|
-
var current_value;
|
125
|
-
var next_value;
|
126
|
-
var store_path_last;
|
127
|
-
for (var i = 0; i < used_length; i++) {
|
128
|
-
store_path = unique_used_store_paths[i];
|
129
|
-
store_path_last = store_path.length - 1;
|
130
|
-
if (store_path[store_path_last].constructor === Array) {
|
131
|
-
store_path[store_path_last] = JSON.stringify(store_path[store_path_last]);
|
132
|
-
}
|
133
|
-
current_value = store_path.reduce(function(prev, curr) { return prev && prev[curr]; }, current_state);
|
134
|
-
next_value = store_path.reduce(function(prev, curr) { return prev && prev[curr]; }, next_state);
|
135
|
-
if (current_value !== next_value) { return true; };
|
136
|
-
}
|
137
|
-
return false;
|
138
|
-
}
|
139
|
-
}
|
140
|
-
}
|
141
|
-
end
|
142
|
-
end
|
143
|
-
end
|
144
|
-
end
|
@@ -1,48 +0,0 @@
|
|
1
|
-
module React
|
2
|
-
module ReduxComponent
|
3
|
-
module Reducers
|
4
|
-
class << self
|
5
|
-
attr_reader :component_reducers_added
|
6
|
-
|
7
|
-
def add_component_reducers_to_store
|
8
|
-
unless component_reducers_added
|
9
|
-
@_component_reducers_added = true
|
10
|
-
component_reducer = Redux.create_reducer do |prev_state, action|
|
11
|
-
case action[:type]
|
12
|
-
when 'COMPONENT_STATE'
|
13
|
-
if action.key?(:set_state)
|
14
|
-
action[:set_state]
|
15
|
-
else
|
16
|
-
new_state = {}.merge!(prev_state) # make a copy of state
|
17
|
-
new_state[action[:object_id]] = {} unless new_state.key?(action[:object_id])
|
18
|
-
new_state[action[:object_id]].merge!(action[:name] => action[:value])
|
19
|
-
new_state
|
20
|
-
end
|
21
|
-
else
|
22
|
-
prev_state
|
23
|
-
end
|
24
|
-
end
|
25
|
-
|
26
|
-
component_class_reducer = Redux.create_reducer do |prev_state, action|
|
27
|
-
case action[:type]
|
28
|
-
when 'COMPONENT_CLASS_STATE'
|
29
|
-
if action.key?(:set_state)
|
30
|
-
action[:set_state]
|
31
|
-
else
|
32
|
-
new_state = {}.merge!(prev_state) # make a copy of state
|
33
|
-
new_state[action[:class]] = {} unless new_state.key?(action[:class])
|
34
|
-
new_state[action[:class]].merge!(action[:name] => action[:value])
|
35
|
-
new_state
|
36
|
-
end
|
37
|
-
else
|
38
|
-
prev_state
|
39
|
-
end
|
40
|
-
end
|
41
|
-
|
42
|
-
Redux::Store.add_reducers(component_state: component_reducer, component_class_state: component_class_reducer)
|
43
|
-
end
|
44
|
-
end
|
45
|
-
end
|
46
|
-
end
|
47
|
-
end
|
48
|
-
end
|