Function DropdownMenuContent

primitives/src/dropdown_menu.rs:334–361

(props: DropdownMenuContentProps)

/// - `data-state`: Indicates the current state of the dropdown menu. values are `open` or `closed`.
#[component]
pub fn DropdownMenuContent(props: DropdownMenuContentProps) -> Element {
    let ctx: DropdownMenuContext = use_context();

    let unique_id = use_unique_id();
    let id = use_id_or(unique_id, props.id);
    let render = use_animated_open(id, ctx.open);

    rsx! {
        if render() {
            div {
                id,
                role: "listbox",
                aria_labelledby: "{ctx.trigger_id}",
                "data-state": if (ctx.open)() { "open" } else { "closed" },
                onpointerdown: move |event| {
                    // The user is starting a click inside the dropdown menu.
                    // Prevent the blur event from occurring during pointerdown,
                    // to keep the dropdown menu open until pointerup happens,
                    // thus enabling onclick/onselect events to fire.
                    event.prevent_default();
                    event.stop_propagation();
                },
                ..props.attributes,
                {props.children}
            }
        }
    }
}

/// The props for the [`DropdownMenuItem`] component
#[derive(Props, Clone, PartialEq)]