# 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.
currently if you do this:
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.
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.