BookStack Code Mirror - bookstack/blob - resources/js/wysiwyg/ui/framework/blocks/button-with-menu.ts

   1 import {EditorContainerUiElement, EditorUiElement} from "../core";
   2 import {el} from "../../../utils/dom";
   3 import {EditorButton} from "../buttons";
   4 import {EditorDropdownButton} from "./dropdown-button";
   5 import caretDownIcon from "@icons/caret-down-large.svg";
   6
   7 export class EditorButtonWithMenu extends EditorContainerUiElement {
   8     protected button: EditorButton;
   9     protected dropdownButton: EditorDropdownButton;
  10
  11     constructor(button: EditorButton, menuItems: EditorUiElement[]) {
  12         super([button]);
  13
  14         this.button = button;
  15         this.dropdownButton = new EditorDropdownButton({
  16             button: {label: 'Menu', icon: caretDownIcon},
  17             showOnHover: false,
  18             direction: 'vertical',
  19             showAside: false,
  20         }, menuItems);
  21         this.addChildren(this.dropdownButton);
  22     }
  23
  24     buildDOM(): HTMLElement {
  25         return el('div', {
  26             class: 'editor-button-with-menu-container',
  27         }, [
  28             this.button.getDOMElement(),
  29             this.dropdownButton.getDOMElement()
  30         ]);
  31     }
  32 }