How to hide menu on hover flutter web

I have been facing an issue with flutter web. when I hover item I show the menu but when my mouse courser out of the item then how to hide the menu

check this video

Container(
              key: menuKey,
              color: Colors.lightBlueAccent,
              constraints: const BoxConstraints(
                minWidth: 100,
                minHeight: 50,
              ),
              child: MouseRegion(
                onExit: (event) {},
                onHover: (event) {
                  final render = menuKey.currentContext!.findRenderObject()
                      as RenderBox;

                  showMenu(
                    context: context,
                    position: RelativeRect.fromLTRB(
                        render.localToGlobal(Offset.zero).dx,
                        render.localToGlobal(Offset.zero).dy + 50,
                        double.infinity,
                        double.infinity),
                    items: [
                      const PopupMenuItem(
                        child: Text("Create a website"),
                      ),
                      const PopupMenuItem(
                        child: Text("Top Ms commericial management"),
                      ),
                      const PopupMenuItem(
                        child: Text("Mobile inventory application"),
                      ),
                    ],
                  );
                },
                child: const Text('Solutions'),
              ),
            ),