Package io.jmix.messagetemplatesflowui.kit.component

Class GrapesJs

java.lang.Object
com.vaadin.flow.component.Component
io.jmix.messagetemplatesflowui.kit.component.GrapesJs
All Implemented Interfaces:
com.vaadin.flow.component.AttachNotifier, com.vaadin.flow.component.DetachNotifier, com.vaadin.flow.component.HasElement, com.vaadin.flow.component.HasSize, com.vaadin.flow.component.HasStyle, Serializable
@Tag("jmix-grapes-js") @NpmPackage(value="grapesjs",version="0.21.13") @NpmPackage(value="grapesjs-blocks-basic",version="1.0.2") @NpmPackage(value="grapesjs-custom-code",version="1.0.2") @NpmPackage(value="grapesjs-blocks-flexbox",version="1.0.1") @NpmPackage(value="grapesjs-plugin-forms",version="2.0.6") @NpmPackage(value="grapesjs-preset-newsletter",version="1.0.2") @NpmPackage(value="grapesjs-parser-postcss",version="1.0.3") @NpmPackage(value="grapesjs-style-filter",version="1.0.2") @NpmPackage(value="grapesjs-tabs",version="1.0.6") @NpmPackage(value="grapesjs-tooltip",version="0.1.8") @NpmPackage(value="grapesjs-tui-image-editor",version="1.0.2") @NpmPackage(value="grapesjs-preset-webpage",version="1.0.3") @JsModule("./src/grapesjs/jmix-grapes-js.js") @CssImport("grapesjs/dist/css/grapes.min.css") @CssImport("./src/grapesjs/jmix-grapes-js.css") public class GrapesJs extends com.vaadin.flow.component.Component implements com.vaadin.flow.component.HasSize, com.vaadin.flow.component.HasStyle
GrapesJS component is used to create HTML templates using a web editor. This implementation is based on GrapesJS JavaScript library.
The component uses GrapesJsBlocks to build a template that can be reused.
The component supports GrapesJsPlugins that can provide additional functionality such as additional settings, visual appearance or blocks.
See Also:

  • Field Details

    • serializer

      protected GrapesJsSerializer serializer

    • plugins

      protected List<GrapesJsPlugin> plugins

    • blocks

      protected List<GrapesJsBlock> blocks

    • synchronizeBlocksUpdateExecution

      protected com.vaadin.flow.internal.StateTree.ExecutionRegistration synchronizeBlocksUpdateExecution

    • synchronizeValueUpdateExecution

      protected com.vaadin.flow.internal.StateTree.ExecutionRegistration synchronizeValueUpdateExecution

    • internalValue

      protected String internalValue

  • Constructor Details

    • GrapesJs

      public GrapesJs()
      Creates new instance of GrapesJS editor.

  • Method Details

    • initComponent

      protected void initComponent()

    • getPlugins

      public List<GrapesJsPlugin> getPlugins()
      Returns:
      list of added plugins

    • addPlugin

      public void addPlugin(GrapesJsPlugin plugin)
      Adds a plugin to the GrapesJS editor. Plugins can only be modified before the client-side of the component is initialized.
      Parameters:
      plugin - plugin to add

    • addPlugins

      public void addPlugins(Collection<GrapesJsPlugin> plugins)
      Adds collection of plugins to the GrapesJS editor.
      Parameters:
      plugins - collection of plugins to add

    • addPlugins

      public void addPlugins(GrapesJsPlugin... plugins)
      Adds array of the plugins to the GrapesJS editor.
      Parameters:
      plugins - array of plugins to add

    • getBlocks

      public List<GrapesJsBlock> getBlocks()
      Returns:
      list of added blocks

    • addBlock

      public void addBlock(GrapesJsBlock block)
      Adds a block to the GrapesJS editor.
      Parameters:
      block - block to add

    • addBlocks

      public void addBlocks(Collection<GrapesJsBlock> blocks)
      Add collection of blocks to the GrapesJS editor.
      Parameters:
      blocks - collection of blocks to add

    • addBlocks

      public void addBlocks(GrapesJsBlock... blocks)
      Add array of blocks to the GrapesJS editor.
      Parameters:
      blocks - array of blocks to add

    • removeBlock

      public void removeBlock(String blockId)
      Removes the block with passed ID from the GrapesJS editor.
      Parameters:
      blockId - ID of the block to remove

    • removeBlocks

      public void removeBlocks(Collection<String> blockIds)
      Removes the collection of blocks with passed IDs from the GrapesJS editor.
      Parameters:
      blockIds - collection of IDs of the blocks to remove

    • removeBlocks

      public void removeBlocks(String... blockIds)
      Removes the collection of blocks with passed IDs from the GrapesJS editor.
      Parameters:
      blockIds - array of IDs of the blocks to remove

    • setValue

      public void setValue(@Nullable String value)
      Sets the passed HTML string as template value for the GrapesJS editor.
      Note: null value will be converted to an empty HTML string (see getEmptyValue()).
      Parameters:
      value - HTML string to set

    • getValue

      public String getValue()
      Returns:
      HTML string from GrapesJS template

    • addValueChangeEventListener

      public com.vaadin.flow.shared.Registration addValueChangeEventListener(com.vaadin.flow.component.ComponentEventListener<GrapesJs.GrapesJsValueChangedEvent> listener)
      Adds a value change listener. The listener is called when the value of GrapesJS is changed either by the user on the client-side or programmatically.
      Parameters:
      listener - the value change listener, not null
      Returns:
      a registration for the listener

    • runCommand

      public void runCommand(String command)
      Execute command for GrapesJS editor.
      Parameters:
      command - command to execute
      See Also:

    • runCommand

      public void runCommand(String command, String parameters)
      Execute command for GrapesJS editor.
      Parameters:
      command - command to execute
      parameters - parameters for command as a JSON string
      See Also:

    • stopCommand

      public void stopCommand(String command)
      Stop the command for GrapesJS editor if stop method was provided.
      Parameters:
      command - command to stop
      See Also:

    • stopCommand

      public void stopCommand(String command, String parameters)
      Stop the command for GrapesJS editor if stop method was provided.
      Parameters:
      command - command to stop
      parameters - parameters for command as a JSON string
      See Also:

    • setReadOnly

      public void setReadOnly(boolean readOnly)
      Sets the read-only mode of this GrapesJs to given mode. The user can't change the value when in read-only mode.

      A GrapesJs with a visual component in read-only mode typically looks visually different to signal to the user that the value cannot be edited.

      Parameters:
      readOnly - a boolean value specifying whether the component is put read-only mode or not

    • isReadOnly

      public boolean isReadOnly()
      Returns whether this GrapesJs is in read-only mode or not.
      Returns:
      false if the user can modify the value, true if not.

    • requestPlugins

      @ClientCallable protected elemental.json.JsonValue requestPlugins()

    • setValueInternal

      protected void setValueInternal(@Nullable String value, boolean fromClient)

    • onValueChangedDomEvent

      protected void onValueChangedDomEvent(GrapesJsValueChangedDomEvent event)

    • updateBlocksOnClientSide

      protected void updateBlocksOnClientSide()

    • updateClientSideBlocks

      protected void updateClientSideBlocks(com.vaadin.flow.internal.ExecutionContext context)

    • updateValueOnClientSide

      protected void updateValueOnClientSide()

    • updateClientSideValue

      protected void updateClientSideValue(com.vaadin.flow.internal.ExecutionContext context)

    • callJsFunction

      protected void callJsFunction(String functionName, Serializable... arguments)

    • createValueChangedEvent

      protected GrapesJs.GrapesJsValueChangedEvent createValueChangedEvent(@Nullable String oldValue, boolean fromClient)

    • createSerializer

      protected GrapesJsSerializer createSerializer()

    • nullToEmptyValue

      protected String nullToEmptyValue(@Nullable String value)

    • getEmptyValue

      protected String getEmptyValue()