HTML Editor API

API Reference vce-html-editor

HTML Attributes API

Name Description Type Required Default value
html Sets the html content string true ''
mode Sets the mode for CodeMirror string true
disabled Specifies that CodeMirror will not accept input. boolean false
auto-refresh Turns on the auto refresh plugin in CodeMirror boolean false
lint Turns on the link plugin in CodeMirror
You will need to create a callback function that returns an array of errors, warnings, or infos.
The callback function must be a passed to the setLintCallback method
boolean false
placeholder A description of the expected input string ''
line-wrapping Turns on line wrapping in CodeMirror boolean false
line-numbers Turns on line numbers in CodeMirror boolean false
single-line Display the editor as a single line of text similar to an input box.
When combined with the line-wrapping attribute the editor looks similar to a text area element.
boolean false
translations Sets the translations object {}
editor This attribute is required when using vce-code-editor boolean * true
* The editor attribute must exist when <vce-html-editor> is a child of <vce-code-editor>.


Translation strings


{
  title: 'String',
  lead: 'String',
  learnMore: 'String',
  learnMoreLink: 'String',
}

Method

Name Description Parameter
insertText Insert text at the current position HTML String
setLintCallback Pass a callback function Function
[{
    message: "",
    severity: "error|warning|info",
    from: {
            line: 0,
            ch: 0
          },
    to: {
            line: 0,
            ch: 10
        }
}]

Events

Event Description Returns
update Fires on change.
event.detail contains the changed content.
{
    detail: []
}

API Reference vce-html-editor-personalization-plugin

HTML Attributes API

This element has no attributes

Method

Name Description Parameter Returns
getStrategy Returns array of objects containing personalization token details void [{ position: { from: token.start, to: token.end, }, tokenName: token.data.tokenName, type: 'personalization', tokenData: token.data, }]