Vagner Wentz
Vagner Wentz

Reputation: 566

Problem to use a component as children of MenuTrigger

I have a component called AvatarMenu and inside of this component his built like this.

AvatarMenu component

export function AvatarMenu() {
  return (
    <IconButton>
      <ProfileContainer>
        <Avatar />
        <Icon
          name="caret-down"
          width={RFValue(8)}
          height={RFValue(4)}
          style={{ marginLeft: 8 }}
        />
      </ProfileContainer>
    </IconButton>
  )
}

And I would like to use this component with the MenuTrigger wrapper, but it does not work, like something this

<MenuTrigger>
   {/* <Icon name="trash" width={RFValue(18)} height={RFValue(20)} /> */}
   <AvatarMenu />
</MenuTrigger>

But if I comment the AvatarMenu and uncomment the Icon it works. Because I would like to do something like this enter image description here

Upvotes: 0

Views: 170

Answers (0)

Related Questions