How build a composable wrapper that wraps another composable unit with Binding.scala

Question

I am experimenting making composable components using binding.scala. I would like to be able to have a component that can be used to wrap other components that are passed in. For example: a card component that wraps a styled box around any other arbitrary @dom function. I have attempted several approaches but have realized that because of the @dom macro, types seem to be more complicated than they appear.

Below, I have included an approach that doesn't work, but shows the intent. I want to be able to call wrapperMarkup and pass it contentMarkup.

I have found many examples where a data is passed into a @dom function and rendered, but no examples that show how to pass in another @dom function or the results from a @dom call.

Is there a good way to accomplish this?

type MarkupFun = ()=>Binding[Div]

@dom
def contentMarkup():Binding[Div] = {
  <div>card Content</div>
}

@dom
def wrapperMarkup(f:MarkupFun):Binding[Div] = {
  //<div>card wrapper {f.bind}</div> // What I want that doesn't work 
  <div>card wrapper {contentMarkup().bind}</div> // works but not what I want.
}

Answer 1

Soon after I posted the question, I found the obvious answer. I was failing to invoke the function before invoking bind.

@dom
def wrapperMarkup(f:MarkupFun):Binding[Div] = {
  <div>card wrapper {f().bind}</div>
}

But, any other best practice suggestions would be great.