glaze_oat

-module(glaze@oat@dropdown).
-compile([no_auto_import, nowarn_unused_vars, nowarn_unused_function, nowarn_nomatch, inline]).
-define(FILEPATH, "src/glaze/oat/dropdown.gleam").
-export([dropdown/2, trigger_for/1, popover_target_attrs/1, menu/3, item/2]).

-if(?OTP_RELEASE >= 27).
-define(MODULEDOC(Str), -moduledoc(Str)).
-define(DOC(Str), -doc(Str)).
-else.
-define(MODULEDOC(Str), -compile([])).
-define(DOC(Str), -compile([])).
-endif.

?MODULEDOC(
    " Oat documentation: <https://oat.ink/components/dropdown/>\n"
    "\n"
    " The [`dropdown`](#dropdown) helpers compose trigger and menu markup for\n"
    " small action lists and contextual menus.\n"
    "\n"
    " ## Anatomy\n"
    "\n"
    " A dropdown usually has a trigger control and a popover menu with one or more\n"
    " `item` actions.\n"
    "\n"
    " ## Recipes\n"
    "\n"
    " ### A basic dropdown menu\n"
    "\n"
    " ```gleam\n"
    " import glaze/oat/dropdown\n"
    " import lustre/element/html\n"
    "\n"
    " fn user_menu() {\n"
    "   dropdown.dropdown([], [\n"
    "     html.button([dropdown.trigger_for(\"user-menu\")], [html.text(\"Open\")]),\n"
    "     dropdown.menu(\"user-menu\", [], [\n"
    "       dropdown.item([], [html.text(\"Profile\")]),\n"
    "       dropdown.item([], [html.text(\"Sign out\")]),\n"
    "     ]),\n"
    "   ])\n"
    " }\n"
    " ```\n"
    "\n"
    " ## References\n"
    "\n"
    " - MDN Popover API: <https://developer.mozilla.org/en-US/docs/Web/API/Popover_API>\n"
    " - MDN `popovertarget`: <https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Elements/button#popovertarget>\n"
    " - MDN `<menu>`: <https://developer.mozilla.org/en-US/docs/Web/HTML/Element/menu>\n"
).

-file("src/glaze/oat/dropdown.gleam", 45).
?DOC(
    " Render the dropdown container element.\n"
    "\n"
    " Use this as the wrapper around the trigger and the menu.\n"
).
-spec dropdown(
    list(lustre@vdom@vattr:attribute(QBQ)),
    list(lustre@vdom@vnode:element(QBQ))
) -> lustre@vdom@vnode:element(QBQ).
dropdown(Attrs, Children) ->
    lustre@element:element(<<"ot-dropdown"/utf8>>, Attrs, Children).

-file("src/glaze/oat/dropdown.gleam", 56).
?DOC(
    " Set the popover target for a trigger control.\n"
    "\n"
    " Apply this to the element that opens the dropdown menu.\n"
).
-spec trigger_for(binary()) -> lustre@vdom@vattr:attribute(any()).
trigger_for(Name) ->
    lustre@attribute:popovertarget(Name).

-file("src/glaze/oat/dropdown.gleam", 64).
?DOC(
    " Return the base attributes needed for a dropdown popover target.\n"
    "\n"
    " This includes an `id` and an empty `popover` attribute.\n"
).
-spec popover_target_attrs(binary()) -> list(lustre@vdom@vattr:attribute(any())).
popover_target_attrs(Name) ->
    [lustre@attribute:id(Name),
        lustre@attribute:attribute(<<"popover"/utf8>>, <<""/utf8>>)].

-file("src/glaze/oat/dropdown.gleam", 72).
?DOC(
    " Render the dropdown menu.\n"
    "\n"
    " Pass the same `name` used by [`trigger_for`](#trigger_for).\n"
).
-spec menu(
    binary(),
    list(lustre@vdom@vattr:attribute(QCB)),
    list(lustre@vdom@vnode:element(QCB))
) -> lustre@vdom@vnode:element(QCB).
menu(Name, Attrs, Children) ->
    lustre@element@html:menu(
        lists:append(popover_target_attrs(Name), Attrs),
        Children
    ).

-file("src/glaze/oat/dropdown.gleam", 84).
?DOC(
    " Render an item action inside a dropdown menu.\n"
    "\n"
    " Each item is rendered as a button with `role=\"menuitem\"`.\n"
).
-spec item(
    list(lustre@vdom@vattr:attribute(QCH)),
    list(lustre@vdom@vnode:element(QCH))
) -> lustre@vdom@vnode:element(QCH).
item(Attrs, Children) ->
    lustre@element@html:button(
        [lustre@attribute:role(<<"menuitem"/utf8>>) | Attrs],
        Children
    ).