Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

automate .as_node.to_n should be applied when elements are passed to native components. #122

Open
catmando opened this issue Jan 21, 2016 · 1 comment

Comments

@catmando
Copy link
Collaborator

currently if you do this:

  # Rb is native ReactBootstrap 
  class TooltipExample < React::Component::Base
    def render
      tip = Rb.Tooltip(id: 'foo'){'a tooltip'}.
      div {
        h2 { 'Tooltip Example'}
        Rb.ButtonToolbar {
          MyComponent(placement: :top, overlay: tip) {
            Rb.Button { 'has tooltip' }
          }
          Rb.Button { 'no tooltip' }
        }
      }
    end
  end

It works fine: I.e the tip Element is automatically removed from the rendering buffer when it is passed to MyComponent.

But if you change MyComponent to a native component, you have to remember to remove the node, and convert it to a native JS object.

  class TooltipExample < React::Component::Base
    def render
      tip = Rb.Tooltip(id: 'foo'){'a tooltip'}.as_node.to_n
      div {
        h2 { 'Tooltip Example'}
        Rb.ButtonToolbar {
          Rb.OverlayTrigger(placement: :top, overlay: tip) {
            Rb.Button { 'has tooltip' }
          }
          Rb.Button { 'no tooltip' }
        }
      }
    end
  end

This is because the React::RenderingContext.remove_nodes_from_args method is called at the beginning of React::RenderingContext.render. Instead we should do this processing when args are PASSED, and during the check do the .to_n processing if the component is native.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants