Menu / 'tooltip' like element inside drawer

[frankvp11]

Question

I am looking to place a menu of sorts next to a left drawer, however for some reason it either places it within the drawer or doesn't show it at all.
Ideally, it would look something like Discord's functionality when you click on a person (see attached screenshot).

Unfortunately, whenever I use code like this:

from nicegui import ui

def open_menu():
    with ui.menu() as menu:
        ui.label("Settings")
        ui.menu_item("Option 1")
        ui.menu_item("Option 2")
        ui.menu_item("Close", menu.close)
        
with ui.left_drawer().style("background-color: lightgray") as drawer:
    button = ui.button("Click", on_click=open_menu )

ui.run()

It can't place it - it outputs this in the HTML:

Using the anchor prop, I can get it to show up

however as you can see in that screenshot, it places it in the top corner, not where I want it.

Does anyone have any idea on how I can get it to spot I need it to be?

[python-and-novella]

Try this:
Popup Proxy | Quasar Framework
https://quasar.dev/vue-components/popup-proxy

from nicegui import ui
   
button = ui.button("Click")
with button:
    with ui.element('q-popup-proxy').props(":offset='[-80,-45]'"):
        with ui.card():
            ui.label("Settings")

ui.run()

[falkoschindler]

I was just about to propose something similar:

with ui.left_drawer().classes('bg-gray-100'):
    with ui.button("Click"):
        with ui.menu().props('anchor="top right" self="top left"') as menu:
            ui.item("Settings").classes("text-bold")
            ui.menu_item("Option 1")
            ui.menu_item("Option 2")
            ui.menu_item("Close", menu.close)

I'm not sure about the pros and cons of @python-and-fiction's q-popup-proxy though.

[frankvp11]

Is there a way to mark both things as an answer? Both work for me, but ultimately I think I'm going to go with @falkoschindler's answer.
Thank you both though.

[python-and-novella]

popup-proxy is a word-right way to design the element which is popuped.
you can do the same with menu .

button = ui.button("Click")
with button:
    with ui.menu().props(":offset='[-80,-45]'"):
        with ui.card():
            ui.label("Settings")