How to use string variable as function name when binding externally

Hey there!

Is it possible to get the following code to function? I’m getting the error that an external definition should have at least one primitive, but I thought for a silly moment I could solve that by using a functor. Is there anything I can do to get this to work without typing out code for each element?

module ElementType = {
  type t = [#div | #span | #section | #main | #p | #aside] // ...

module Layout = (
  LayoutType: {
    let element: ElementType.t
) => {
  @module("framer-motion") @scope("motion") @react.component
  external make: (~layout: bool, ~layoutId: string=?) => React.element = ElementType.tToJs(LayoutType.element)
1 Like

You can only use string literals in bindings.

If you explain what you’re actually trying to achieve here we could maybe help further.


Hey, thanks for taking the time to answer :slight_smile:

You can only use string literals in bindings.

Yeah, that’s what I was sort of hoping to get around here. Framer Motion provides wrapper components for elements, such as <motion.div />, <motion.span /> … etc. So my idea was to provide the functor with the element (with ElementType.t) and use that for the bindings. I guess I’ll just have to type them out as I go? No biggie, I was just wondering if I could make this a tad easier :slight_smile:

oh no indeed, you can use functors for the types of the externals, but not for the name of the binding. I have no idea how arbitrary this limitation is.

1 Like

Yes, exactly, I was thinking for the name of the function only in this case :ok_hand: Thanks :slight_smile:

1 Like