¿Cómo eliminar la barra de herramientas inferior pero no con display none?

He agregado algunos botones personalizados como se muestra a continuación, pero quiero saber cómo eliminar los botones ya agregados en la CLASE TOOLBAR:thinking:
image
Además, mi función de botón personalizado es un fragmento de código para agregar dados rápidamente, me gustaría saber cómo darle a este botón la capacidad de hacer desaparecer el texto ya agregado cuando se hace clic nuevamente, como el botón en negrita.


He buscado muchos temas pero todavía no encuentro una solución
¡Gracias por sus respuestas!

1 me gusta

Ocultar el botón de la barra de herramientas con CSS puede ser suficiente.

Y la función bold implementada por el método applySurround.

2 Me gusta

¡Gracias por tu respuesta! Pero noté que cuando hago clic en el botón NEGRITA, aparece el código ** y luego desaparece cuando vuelvo a hacer clic. Mi botón personalizado no tiene la capacidad de hacer desaparecer el código cuando se hace clic de nuevo.

¿Tienes alguna solución para esto? El código de mi botón personalizado es el siguiente:


  const currentLocale = I18n.currentLocale();
  if (!I18n.translations[currentLocale].js.composer) {
    I18n.translations[currentLocale].js.composer = {};
  }
  I18n.translations[currentLocale].js.composer.ttl_spoiler_text = "Insertar contenido oculto";
  I18n.translations[currentLocale].js.ttl_dice_title = "ttl-spoiler";
  api.onToolbarCreate(function(toolbar) {
    toolbar.addButton({
      id: "ttl-spoiler",
      icon: "ttl-spoiler-icon",
      group: "extras",
      preventFocus: true,
      trimLeading: true,
      perform: (e) => e.applySurround("[spoiler]", "[/spoiler]", "ttl_spoiler_text")
    });
  });

Prueba el argumento opts.