Виджет для JavaScript и HTML

Привет, если я хочу добавить список ul в меню-гамбургер с подменю, которые отображаются либо при клике, либо при наведении курсора, следует ли мне поступать так или есть что-то более эффективное?

Я могу добавлять отдельные элементы в меню-гамбургер через компонент, но мне нужно указать там подэлементы, которые будут отображаться при наведении.

Можете ли вы дать совет? Спасибо.

<script type="text/discourse-plugin" version="0.1">
  api.decorateWidget('menu-links:before', helper => {
    return helper.h("li", [
    helper.h("a.google", {
        href:"https://google.com",
        title: "Google",
        }, helper.h('p', 'Google')),
    ]);
  });
</script>

РЕДАКТИРОВАНИЕ: РЕШЕНО

Но ещё один вопрос: как добавить target blank?

Возврат виджета:

Вы можете вернуть свой собственный пользовательский виджет в api.decorateWidget, что даст вам гораздо больше контроля над применением атрибутов, состояний, действий и т. д.

Например:

api.decorateWidget('menu-links:before', helper => {
   return helper.widget.attach("custom-menu-links");
});

Затем внутри javascripts/discourse/widgets/custom-menu-links.js создайте виджет с помощью вспомогательной функции createWidget:

import { createWidget } from 'discourse/widgets/widget';

createWidget('custom-menu-links', {
...
});

Ознакомьтесь с этой темой, чтобы узнать о некоторых возможностях виджетов:

Я довольно часто использовал виджеты в компоненте темы выпадающего заголовка, возможно, вам пригодится часть кода.

Добавление target=“_blank”

Добавьте его в объект атрибутов:

      return helper.h('a.google',
        {
          attributes: {
            href: "https://google.com",
            target: "_blank",
            title: "Google"
          },
        }
        ...
      );