BoxManager

The BoxManager interface provides methods to manage a collection of BoxComponent objects.

Note

The constructor is not directly accessible. Instead, you can access its methods via the Editor.box object.

Example:

import { query, Editor } from 'lakelib';

const hrBox = {
  type: 'block',
  name: 'hr',
  render: box => {
    const editor = box.getEditor();
    const boxContainer = box.getContainer();
    const rootNode = query('<div class="lake-hr"><hr /></div>');
    boxContainer.empty();
    boxContainer.append(rootNode);
    rootNode.on('click', () => {
      editor.selection.selectBox(box);
    });
  },
  html: () => '<hr />',
};

Editor.box.add(hrBox);

Instance methods

add()

Adds a BoxComponent to the collection.

• Parameters:

  component

  An object representing the box component to be added. It must include a name property (used as the unique identifier) and other properties defined in the BoxComponent type.

• Return value:

  None.

Example:

Editor.box.add('testBox', {
  type: 'inline',
  name: 'testBox',
  render: box => {
    const boxContainer = box.getContainer();
    boxContainer.empty();
    boxContainer.append('<div class="lake-test-box">foo</div>');
  },
});

remove()

Removes a box component from the collection by its name.

• Parameters:

  name

  A string that specifies the name of the box component to be removed.

• Return value:

  None.

Example:

Editor.box.remove('testBox');

getNames()

Returns a list of all box component names in the collection.

• Parameters:

  None.

• Return value:

  An Array object containing the names of all box components.

Example:

const names = Editor.box.getNames();