WarpView Editor Elements

Usage no npm install needed!

<script type="module">
  import senxWarpviewEditor from 'https://cdn.skypack.dev/@senx/warpview-editor';


Warp View Editor

npm version

This web components embed a WarpScript editor dedicated to Warp 10™.

Warp 10

Demo: https://senx.github.io/warpview-editor

Getting started

npm i @senx/warpview-editor --save

yarn add @senx/warpview-editor


<html dir="ltr" lang="en">
    <script src="https://unpkg.com/@senx/warpview-editor@x.x.x/elements/warpview-editor.js"></script>
    <warp-view-editor url="https://warp.senx.io/api/v0/exec" height-line=18 width-px=600 theme="dark" id="editor" show-dataviz="true" horizontal-layout="false" config='{"quickSuggestionsDelay":3000, "suggestOnTriggerCharacters": false}'>
      2 2 +

CSS vars


Name Type Default Description
url string Warp 10 url, eg: https://warp.senx.io/api/v0/exec
theme string 'light' Editor theme (light or dark)
warpscript string '' WarpScript to edit (optional, could be inside HTML tag)
showDataviz boolean false Display the "Show dataviz" button
showExecute boolean true Display the "Execute" button
horizontalLayout boolean false Horizontal or vertical layout
config object default config Configuration
displayMessages boolean true Displays messages from WarpScript execution
widthPx number Fixed width
heightPx number Fixed height
heightLine number Fixed number of lines
imageTab boolean false Display the tab for image results

Data format

Default config

  "buttons" : {
    "class": ""
  "execButton" : {
    "class": "",
    "label": "Execute"
  "datavizButton" : {
    "class": "",
    "label": "Visualize"
  "hover" : true,
  "readOnly" : false,
  "messageClass" : "",
  "errorClass" : "",
  "editor": {
    "quickSuggestionsDelay": 10,
    "quickSuggestions": true,
    "tabSize": 2,
    "minLineNumber": 10,
    "enableDebug": false



String execution status :

Your script execution took 527.749 ms serverside, fetched 138156 datapoints and performed 21 WarpScript operations.


String execution error :

ERROR line #4 in section '[TOP]': Unknown symbol 'TOKEN2'


String representation of the WarpScript typed in the editor.


Json of the the WarpScript execution result triggered by a click on the execute button.


Json of the the WarpScript execution result triggered by a click on the dataViz button