Attach actual Ruby instance in ref callback

[zetachang]

Address #188

[catmando]

Hmmm... So I am not actually sure you have to go to all this trouble of distinguishing between dom-node vs .js component vs .rb component.

In the end the "thing" you get back is going to be used (i think) with Element, as in Element[node].focus.

I don't think we can just do a node.focus can we?

If this doesn't make sense perhaps we need a chat?

[catmando]

The other thing I think we should do is make this work like other callbacks as well.

DIV { "hello" }.ref { |node| Element[node].focus }

is the same as

DIV(ref: -> (node) { Element[node].focus }) { "hello" }

options for the name (instead of ref) might be:

DIV { "hello" }.after_mount { ... } or
DIV { "hello" }.on(:mount) { ... } which is pretty sweet...

[zetachang]

Given that the node received is the actual DOM node, so you need to either wrap it inside an opal-jquery element, opal-browser element , node.JS.focus or using backtick.

The reason behind this is that it should be user's decision to decide which kind of encapsulation they want for DOM.

Yeah, providing a callback like method might be helpful.

[catmando]

So bottom line is that today we can't do node.focus (like they do in the JS example) so you have to do either Element[node].focus or node.JS.focus (never used that actually), but my point is that whichever one you use, you should not have to care about what kind of thing (dom node, react.js component or react.rb component) node is. Is that your understanding?

which syntax do you like for the block attacher? on(:mount) seems very consistent...

[zetachang]

My understanding on ref is that it should give exactly the instance you are trying to attach on. This match the semantic in the original reactjs doc. I pefer ‘on(:ref)’, since the ref callback is invoked when mounted and unmounted and you usually want to use the same handler. (I think we have this disucssed in another “ref callback” issue ) Mitch VanDuyn <notifications@github.com> 於 2017年1月12日週四 下午6:16 寫道：

…

So bottom line is that today we can't do node.focus (like they do in the JS example) so you have to do either Element[node].focus or node.JS.focus (never used that actually), but my point is that whichever one you use, you should not have to care about what kind of thing (dom node, react.js component or react.rb component) node is. Is that your understanding? which syntax do you like for the block attacher? on(:mount) seems very consistent... — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub <#198 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAzRJY5njZFV_ne1j4-K_v5abV3jp6rNks5rRf2TgaJpZM4LVaFP> .

[catmando]

Sure I'm fine with that interpretation of ref, but my point is that we need to make sure it works correctly with Element, and I guess .JS (although again I don't know what that is)

Point being I can't do anything with a node in the ruby environment, since I can't directly say node.focus.

I agree with your point about on(:mount) being inappropriate, however on(:ref) does not read well. How about just .ref { ... }

[zetachang]

.JS syntax is documented here. http://opalrb.org/docs/guides/v0.10.3/compiled_ruby.html in "Calling Javascript Methods” section. I personally prefer this than using Native to wrap JS object. .ref looks great. Mitch VanDuyn <notifications@github.com> 於 2017年1月12日週四 下午6:46 寫道：

…

Sure I'm fine with that interpretation of ref, but my point is that we need to make sure it works correctly with Element, and I guess .JS (although again I don't know what that is) Point being I can't do anything with a node in the ruby environment, since I can't directly say node.focus. I agree with your point about on(:mount) being in appropriate, however on(:ref) does not read well. How about just .ref { ... } — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub <#198 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAzRJZvENyQ2c_AD4-82KJNsjjeDzP3_ks5rRgSDgaJpZM4LVaFP> .

[catmando]

So reading that makes me believe that refnode.JS.focus won't work

[catmando]

My point is that the value sent by ref should act consistently.

[zetachang]

I could make it return a Native wrapped object for DOM element (as we currently done for string refs ). And you could call `node.focus` as usual. Mitch VanDuyn <notifications@github.com> 於 2017年1月12日週四 下午9:51 寫道：

…

My point is that the value sent by ref should act consistently. — You are receiving this because you modified the open/close state. Reply to this email directly, view it on GitHub <#198 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAzRJah7XrBOKBo3cWVlXtqdh6uw4j_vks5rRi_2gaJpZM4LVaFP> .

[zetachang]

Below are the listing of possible ref attached value

1. hyper-react component, we return the actual Ruby instance
2. dom-node, we return the actual DOM node in this PR. (which is a non-ruby object)
3. react-js component, we return the actual reactjs component instance.

I think we could agree 1) is fine to user, for 2) it might be ok if we return a Native wrapped element, but if user want to use another DOM wrapper (opal-browser, or opal-jquery), they will need to unwrap it first (by calling to_n)

(3) is currently not handled carefully, return a Native wrapped element and maybe extend it with React::Component may make it fit the basic use case.