/components/menu/menu

import { menu, menuDivider, menuItem } from "@hedia/hexui/components/menu";
import { element } from "@hedia/html";
import { lockBoldIcon, userBoldIcon } from "@hedia/iconly/bold";

export default {
  Default,
  WithIcons,
  WithFormAction,
};

export function Default() {
  return menu(
    { open: true, style: "position: static;" },
    menuItem({ href: "#" }, "Account"),
    menuDivider(),
    menuItem({ href: "#" }, "Log out"),
  );
}

export function WithIcons() {
  return menu(
    { open: true, style: "position: static;" },
    menuItem({ href: "#", icon: userBoldIcon() }, "Account"),
    menuDivider(),
    menuItem({ href: "#", icon: lockBoldIcon() }, "Log out"),
  );
}

export function WithFormAction() {
  return menu(
    { open: true, style: "position: static;" },
    menuItem({ href: "/account", icon: userBoldIcon() }, "Account"),
    menuDivider(),
    element(
      "form",
      { method: "post", action: "/logout" },
      menuItem({ type: "submit", icon: lockBoldIcon() }, "Log out"),
    ),
  );
}