@holoviz/panel 0.13.0-a.1 → 0.13.0-a.13

package/dist/panel.js

@@ -31,7 +31,7 @@
 (function(root, factory) {
   factory(root["Bokeh"], undefined);
 })(this, function(Bokeh, version) {
-  var define;
+  let define;
   return (function(modules, entry, aliases, externals) {
     const bokeh = typeof Bokeh !== "undefined" && (version != null ? Bokeh[version] : Bokeh);
     if (bokeh != null) {
@@ -44,15 +44,15 @@
 "4e90918c0a": /* index.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const Panel = tslib_1.__importStar(require("7898617fc4") /* ./models */);
+    const Panel = (0, tslib_1.__importStar)(require("1abe9b6912") /* ./models */);
     exports.Panel = Panel;
     const base_1 = require("@bokehjs/base");
-    base_1.register_models(Panel);
+    (0, base_1.register_models)(Panel);
 },
-"7898617fc4": /* models/index.js */ function _(require, module, exports, __esModule, __esExport) {
+"1abe9b6912": /* models/index.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    var ace_1 = require("be520eff91") /* ./ace */;
+    var ace_1 = require("9fecc8d0f9") /* ./ace */;
     __esExport("AcePlot", ace_1.AcePlot);
     var audio_1 = require("339f84d639") /* ./audio */;
     __esExport("Audio", audio_1.Audio);
@@ -60,7 +60,7 @@
     __esExport("Card", card_1.Card);
     var comm_manager_1 = require("e552778259") /* ./comm_manager */;
     __esExport("CommManager", comm_manager_1.CommManager);
-    var tabulator_1 = require("32011d40fa") /* ./tabulator */;
+    var tabulator_1 = require("8e41f17634") /* ./tabulator */;
     __esExport("DataTabulator", tabulator_1.DataTabulator);
     var datetime_picker_1 = require("6e11b2cfe2") /* ./datetime_picker */;
     __esExport("DatetimePicker", datetime_picker_1.DatetimePicker);
@@ -68,7 +68,7 @@
     __esExport("DeckGLPlot", deckgl_1.DeckGLPlot);
     var echarts_1 = require("9d046c4720") /* ./echarts */;
     __esExport("ECharts", echarts_1.ECharts);
-    var html_1 = require("2839081043") /* ./html */;
+    var html_1 = require("c424a3bd17") /* ./html */;
     __esExport("HTML", html_1.HTML);
     var idom_1 = require("7d45bd3bc4") /* ./idom */;
     __esExport("IDOM", idom_1.IDOM);
@@ -88,33 +88,35 @@
     __esExport("Perspective", perspective_1.Perspective);
     var player_1 = require("2e8044c920") /* ./player */;
     __esExport("Player", player_1.Player);
-    var plotly_1 = require("c23bb1717d") /* ./plotly */;
+    var plotly_1 = require("a2080c6bc8") /* ./plotly */;
     __esExport("PlotlyPlot", plotly_1.PlotlyPlot);
-    var progress_1 = require("9f787650b9") /* ./progress */;
+    var progress_1 = require("fd3806082d") /* ./progress */;
     __esExport("Progress", progress_1.Progress);
-    var reactive_html_1 = require("d536149aaa") /* ./reactive_html */;
+    var quill_1 = require("6895629dfc") /* ./quill */;
+    __esExport("QuillInput", quill_1.QuillInput);
+    var reactive_html_1 = require("eb3a49319b") /* ./reactive_html */;
     __esExport("ReactiveHTML", reactive_html_1.ReactiveHTML);
-    var singleselect_1 = require("3b85956787") /* ./singleselect */;
+    var singleselect_1 = require("5ed2116e26") /* ./singleselect */;
     __esExport("SingleSelect", singleselect_1.SingleSelect);
     var speech_to_text_1 = require("aaa48703af") /* ./speech_to_text */;
     __esExport("SpeechToText", speech_to_text_1.SpeechToText);
     var state_1 = require("bfa46a5f19") /* ./state */;
     __esExport("State", state_1.State);
-    var terminal_1 = require("91fe88c277") /* ./terminal */;
+    var terminal_1 = require("edf66f5228") /* ./terminal */;
     __esExport("Terminal", terminal_1.Terminal);
     var text_to_speech_1 = require("33cd2c254e") /* ./text_to_speech */;
     __esExport("TextToSpeech", text_to_speech_1.TextToSpeech);
-    var trend_1 = require("ded3463d6c") /* ./trend */;
+    var trend_1 = require("effe070807") /* ./trend */;
     __esExport("TrendIndicator", trend_1.TrendIndicator);
-    var vega_1 = require("4feb5fa522") /* ./vega */;
+    var vega_1 = require("04fd346566") /* ./vega */;
     __esExport("VegaPlot", vega_1.VegaPlot);
     var video_1 = require("ffe54b53c3") /* ./video */;
     __esExport("Video", video_1.Video);
     var videostream_1 = require("e3e9b8e495") /* ./videostream */;
     __esExport("VideoStream", videostream_1.VideoStream);
-    tslib_1.__exportStar(require("c51f25e2a7") /* ./vtk */, exports);
+    (0, tslib_1.__exportStar)(require("c51f25e2a7") /* ./vtk */, exports);
 },
-"be520eff91": /* models/ace.js */ function _(require, module, exports, __esModule, __esExport) {
+"9fecc8d0f9": /* models/ace.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const dom_1 = require("@bokehjs/core/dom");
@@ -129,7 +131,7 @@
         initialize() {
             super.initialize();
             this._ace = window.ace;
-            this._container = dom_1.div({
+            this._container = (0, dom_1.div)({
                 id: ID(),
                 style: {
                     width: "100%",
@@ -161,7 +163,7 @@
             this._editor.setOptions({
                 enableBasicAutocompletion: true,
                 enableSnippets: true,
-                fontFamily: "monospace",
+                fontFamily: "monospace", //hack for cursor position
             });
             this._update_theme();
             this._update_filename();
@@ -311,9 +313,9 @@
                 return cached;
             }
             const bounded = new types_1.Sizeable(viewport).bounded_to(this.sizing.size);
-            const size = dom_1.sized(this.el, bounded, () => {
-                const content = new types_1.Sizeable(dom_1.content_size(this.el));
-                const { border, padding } = dom_1.extents(this.el);
+            const size = (0, dom_1.sized)(this.el, bounded, () => {
+                const content = new types_1.Sizeable((0, dom_1.content_size)(this.el));
+                const { border, padding } = (0, dom_1.extents)(this.el);
                 return content.grow_by(border).grow_by(padding).map(Math.ceil);
             });
             this._cache.set(key_str, size);
@@ -472,7 +474,7 @@
     const tslib_1 = require("tslib");
     const column_1 = require("@bokehjs/models/layouts/column");
     const bbox_1 = require("@bokehjs/core/util/bbox");
-    const DOM = tslib_1.__importStar(require("@bokehjs/core/dom"));
+    const DOM = (0, tslib_1.__importStar)(require("@bokehjs/core/dom"));
     const dom_1 = require("@bokehjs/core/dom");
     const grid_1 = require("@bokehjs/core/layout/grid");
     const color_1 = require("@bokehjs/core/util/color");
@@ -507,10 +509,10 @@
             super.update_position();
         }
         render() {
-            dom_1.empty(this.el);
+            (0, dom_1.empty)(this.el);
             const { background, button_css_classes, header_color, header_tag, header_css_classes } = this.model;
-            this.el.style.backgroundColor = background != null ? color_1.color2css(background) : "";
-            dom_1.classes(this.el).clear().add(...this.css_classes());
+            this.el.style.backgroundColor = background != null ? (0, color_1.color2css)(background) : "";
+            (0, dom_1.classes)(this.el).clear().add(...this.css_classes());
             let header_background = this.model.header_background;
             if (!this.model.collapsed && this.model.active_header_background)
                 header_background = this.model.active_header_background;
@@ -693,16 +695,32 @@
     CommManager.__module__ = "panel.models.comm_manager";
     CommManager.init_CommManager();
 },
-"32011d40fa": /* models/tabulator.js */ function _(require, module, exports, __esModule, __esExport) {
+"8e41f17634": /* models/tabulator.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const types_1 = require("@bokehjs/core/util/types");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
+    const build_views_1 = require("@bokehjs/core/build_views");
+    const bokeh_events_1 = require("@bokehjs/core/bokeh_events");
     const dom_1 = require("@bokehjs/core/dom");
     const kinds_1 = require("@bokehjs/core/kinds");
     const column_data_source_1 = require("@bokehjs/models/sources/column_data_source");
     const tables_1 = require("@bokehjs/models/widgets/tables");
+    const debounce_1 = require("99a25e6992") /* debounce */;
     const data_1 = require("f1971f81bf") /* ./data */;
     const layout_1 = require("4c755983eb") /* ./layout */;
+    class TableEditEvent extends bokeh_events_1.ModelEvent {
+        constructor(column, row) {
+            super();
+            this.column = column;
+            this.row = row;
+            this.event_name = "table-edit";
+        }
+        _to_json() {
+            return { model: this.origin, column: this.column, row: this.row };
+        }
+    }
+    exports.TableEditEvent = TableEditEvent;
+    TableEditEvent.__name__ = "TableEditEvent";
     function find_group(key, value, records) {
         for (const record of records) {
             if (record[key] == value)
@@ -718,7 +736,7 @@
         for (const group of grouped) {
             const subsummary = summarize(group._children, columns, aggregators, depth + 1);
             for (const col in subsummary) {
-                if (types_1.isArray(subsummary[col]))
+                if ((0, types_1.isArray)(subsummary[col]))
                     group[col] = subsummary[col].reduce((a, b) => a + b, 0) / subsummary[col].length;
                 else
                     group[col] = subsummary[col];
@@ -734,7 +752,7 @@
                     else if (agg === 'sum')
                         summary[column.field] = val + old_val;
                     else if (agg === 'mean') {
-                        if (types_1.isArray(summary[column.field]))
+                        if ((0, types_1.isArray)(summary[column.field]))
                             summary[column.field].push(val);
                         else
                             summary[column.field] = [old_val, val];
@@ -799,6 +817,15 @@
                 const ftype = this.model.filename.endsWith('.json') ? "json" : "csv";
                 this.tabulator.download(ftype, this.model.filename);
             });
+            this.connect(this.model.properties.children.change, () => {
+                this._render_children();
+            });
+            this.connect(this.model.properties.expanded.change, () => {
+                for (const row of this.tabulator.rowManager.getRows()) {
+                    if (row.cells.length > 0)
+                        row.cells[0].layoutElement();
+                }
+            });
             this.connect(this.model.properties.hidden_columns.change, () => {
                 this.hideColumns();
             });
@@ -815,6 +842,7 @@
                 this.freezeRows();
             });
             this.connect(this.model.properties.styles.change, () => {
+                this._styles = this.model.styles;
                 this.updateStyles();
             });
             this.connect(this.model.source.properties.data.change, () => {
@@ -838,10 +866,12 @@
             if (wait)
                 return;
             this._initializing = true;
-            const container = dom_1.div({ class: "pnx-tabulator" });
-            layout_1.set_size(container, this.model);
+            this._styles = this.model.styles;
+            const container = (0, dom_1.div)({ class: "pnx-tabulator" });
+            (0, layout_1.set_size)(container, this.model);
             let configuration = this.getConfiguration();
             this.tabulator = new Tabulator(container, configuration);
+            this._render_children();
             // Swap pagination mode
             if (this.model.pagination === 'remote') {
                 this.tabulator.options.pagination = this.model.pagination;
@@ -915,13 +945,19 @@
         }
         getConfiguration() {
             const pagination = this.model.pagination == 'remote' ? 'local' : (this.model.pagination || false);
-            let selectable = !(typeof this.model.select_mode === 'boolean');
+            // Only use selectable mode if explicitly requested otherwise manually handle selections
+            let selectable = this.model.select_mode === 'toggle' ? true : NaN;
             const that = this;
             let configuration = Object.assign(Object.assign({}, this.model.configuration), { index: "_index", nestedFieldSeparator: false, selectable: selectable, tableBuilding: function () { that.tableInit(that, this); }, renderComplete: () => this.renderComplete(), rowSelectionChanged: (data, rows) => this.rowSelectionChanged(data, rows), rowClick: (e, row) => this.rowClicked(e, row), cellEdited: (cell) => this.cellEdited(cell), columns: this.getColumns(), layout: this.getLayout(), pagination: pagination, paginationSize: this.model.page_size, paginationInitialPage: 1, selectableCheck: (row) => {
                     const selectable = this.model.selectable_rows;
                     return (selectable == null) || (selectable.indexOf(row._row.data._index) >= 0);
                 }, tooltips: (cell) => {
                     return cell.getColumn().getField() + ": " + cell.getValue();
+                }, scrollVertical: (0, debounce_1.debounce)(() => {
+                    this.updateStyles();
+                }, 50, false), rowFormatter: (row) => this._render_row(row), dataFiltering: () => {
+                    if (this.tabulator != null)
+                        this.model.filters = this.tabulator.getHeaderFilters();
                 } });
             if (pagination) {
                 configuration['ajaxURL'] = "http://panel.pyviz.org";
@@ -932,11 +968,72 @@
             if (cds === null || (cds.columns().length === 0))
                 data = [];
             else
-                data = data_1.transform_cds_to_records(cds, true);
+                data = (0, data_1.transform_cds_to_records)(cds, true);
             if (configuration.dataTree)
                 data = group_data(data, this.model.columns, this.model.indexes, this.model.aggregators);
             return Object.assign(Object.assign({}, configuration), { "data": data });
         }
+        _render_children() {
+            new Promise(async (resolve) => {
+                const children = [];
+                for (const idx of this.model.expanded) {
+                    if (idx in this.model.children)
+                        children.push(this.model.children[idx]);
+                }
+                await (0, build_views_1.build_views)(this._child_views, children, { parent: null });
+                resolve(null);
+            }).then(() => {
+                for (const r of this.model.expanded) {
+                    const row = this.tabulator.getRow(r);
+                    this._render_row(row);
+                }
+            });
+        }
+        _render_row(row) {
+            const index = row._row.data._index;
+            if (this.model.expanded.indexOf(index) < 0 || !(index in this.model.children))
+                return;
+            const model = this.model.children[index];
+            const view = this._child_views.get(model);
+            if (view == null)
+                return;
+            const rowEl = row.getElement();
+            const viewEl = rowEl.children[rowEl.children.length - 1];
+            if ((viewEl.className === 'bk') && viewEl.children.length)
+                return;
+            const style = getComputedStyle(this.tabulator.element.children[1].children[0]);
+            const bg = style.backgroundColor;
+            const neg_margin = "-" + rowEl.style.paddingLeft;
+            const row_view = (0, dom_1.div)({ style: "background-color: " + bg + "; margin-left:" + neg_margin });
+            view.renderTo(row_view);
+            row.getElement().appendChild(row_view);
+        }
+        _expand_render(cell) {
+            const index = cell._cell.row.data._index;
+            const icon = this.model.expanded.indexOf(index) < 0 ? "\u25ba" : "\u25bc";
+            return "<i>" + icon + "</i>";
+        }
+        _update_expand(cell) {
+            const index = cell._cell.row.data._index;
+            const expanded = [...this.model.expanded];
+            const exp_index = expanded.indexOf(index);
+            if (exp_index < 0)
+                expanded.push(index);
+            else
+                expanded.splice(exp_index, 1);
+            this.model.expanded = expanded;
+            if (expanded.indexOf(index) < 0)
+                return;
+            let ready = true;
+            for (const idx of this.model.expanded) {
+                if (!(idx in this.model.children)) {
+                    ready = false;
+                    break;
+                }
+            }
+            if (ready)
+                this._render_children();
+        }
         getColumns() {
             var _a;
             const config_columns = (_a = this.model.configuration) === null || _a === void 0 ? void 0 : _a.columns;
@@ -949,8 +1046,24 @@
                             group_columns.push(Object.assign({}, col));
                         columns.push(Object.assign(Object.assign({}, column), { columns: group_columns }));
                     }
-                    else
+                    else if (column.formatter === "expand") {
+                        const expand = {
+                            hozAlign: "center",
+                            cellClick: (_, cell) => { this._update_expand(cell); },
+                            formatter: (cell) => { return this._expand_render(cell); },
+                            width: 40,
+                            frozen: true
+                        };
+                        columns.push(expand);
+                    }
+                    else {
+                        if (column.formatter === "rowSelection") {
+                            column.cellClick = (_, cell) => {
+                                cell.getRow().toggleSelect();
+                            };
+                        }
                         columns.push(Object.assign({}, column));
+                    }
             }
             for (const column of this.model.columns) {
                 let tab_column = null;
@@ -986,7 +1099,9 @@
                     else {
                         tab_column.formatter = (cell) => {
                             const formatted = column.formatter.doFormat(cell.getRow(), cell, cell.getValue(), null, null);
-                            const node = dom_1.div();
+                            if (column.formatter.type === 'HTMLTemplateFormatter')
+                                return formatted;
+                            const node = (0, dom_1.div)();
                             node.innerHTML = formatted;
                             return node.children[0].innerHTML;
                         };
@@ -1021,6 +1136,13 @@
                     tab_column.editor = (cell, onRendered, success, cancel) => this.renderEditor(column, cell, onRendered, success, cancel);
                 }
                 tab_column.editable = () => (this.model.editable && (editor.default_view != null));
+                if (tab_column.headerFilter) {
+                    if ((typeof tab_column.headerFilter) === 'boolean' &&
+                        (typeof tab_column.editor) === 'string') {
+                        tab_column.headerFilter = tab_column.editor;
+                        tab_column.headerFilterParams = tab_column.editorParams;
+                    }
+                }
                 if (config_columns == null)
                     columns.push(tab_column);
             }
@@ -1055,7 +1177,7 @@
         }
         // Update table
         setData() {
-            let data = data_1.transform_cds_to_records(this.model.source, true);
+            let data = (0, data_1.transform_cds_to_records)(this.model.source, true);
             if (this.model.configuration.dataTree)
                 data = group_data(data, this.model.columns, this.model.indexes, this.model.aggregators);
             this._data_updating = true;
@@ -1125,10 +1247,10 @@
             for (const cell_el of this._styled_cells)
                 cell_el.cssText = "";
             this._styled_cells = [];
-            if (this.model.styles == null || this.tabulator == null || this.tabulator.getDataCount() == 0)
+            if (this._styles == null || this.tabulator == null || this.tabulator.getDataCount() == 0)
                 return;
-            for (const r in this.model.styles) {
-                const row_style = this.model.styles[r];
+            for (const r in this._styles) {
+                const row_style = this._styles[r];
                 const row = this.tabulator.getRow(r);
                 if (!row)
                     continue;
@@ -1143,7 +1265,7 @@
                     element.cssText = "";
                     for (const s of style) {
                         let prop, value;
-                        if (types_1.isArray(s))
+                        if ((0, types_1.isArray)(s))
                             [prop, value] = s;
                         else if (!s.includes(':'))
                             continue;
@@ -1153,12 +1275,14 @@
                     }
                 }
             }
+            const styles = this._styles;
             this.model.styles = {};
+            this._styles = styles;
         }
         addData() {
             const rows = this.tabulator.rowManager.getRows();
             const last_row = rows[rows.length - 1];
-            let data = data_1.transform_cds_to_records(this.model.source, true);
+            let data = (0, data_1.transform_cds_to_records)(this.model.source, true);
             this.tabulator.setData(data);
             if (this.model.follow) {
                 this.tabulator.scrollToRow((last_row.data._index || 0), "top", false);
@@ -1170,7 +1294,7 @@
             // To avoid double updating the tabulator data
             if (this._tabulator_cell_updating)
                 return;
-            let data = data_1.transform_cds_to_records(this.model.source, true);
+            let data = (0, data_1.transform_cds_to_records)(this.model.source, true);
             this.tabulator.setData(data);
             this.freezeRows();
             this.updateSelection();
@@ -1209,7 +1333,7 @@
         }
         // Update model
         rowClicked(e, row) {
-            if (this._selection_updating || this._initializing || this.model.select_mode !== true)
+            if (this._selection_updating || this._initializing || (typeof this.model.select_mode) === 'string' || this.model.select_mode === false)
                 return;
             let indices = [];
             const selected = this.model.source.selected;
@@ -1232,6 +1356,12 @@
                 indices.push(index);
             else
                 indices.splice(indices.indexOf(index), 1);
+            // Remove the first selected indices when selectable is an int.
+            if (typeof this.model.select_mode === 'number') {
+                while (indices.length > this.model.select_mode) {
+                    indices.shift();
+                }
+            }
             const filtered = this._filter_selected(indices);
             this.tabulator.deselectRow();
             this.tabulator.selectRow(filtered);
@@ -1249,7 +1379,7 @@
             return filtered;
         }
         rowSelectionChanged(data, _) {
-            if (this._selection_updating || this._initializing || (typeof this.model.select_mode) === 'boolean')
+            if (this._selection_updating || this._initializing || (typeof this.model.select_mode) === 'boolean' || (this.model.select_mode.startsWith('checkbox')))
                 return;
             const indices = data.map((row) => row._index);
             const filtered = this._filter_selected(indices);
@@ -1264,11 +1394,12 @@
             this._tabulator_cell_updating = true;
             this.model.source.patch({ [field]: [[index, value]] });
             this._tabulator_cell_updating = false;
+            this.model.trigger_event(new TableEditEvent(field, index));
         }
     }
     exports.DataTabulatorView = DataTabulatorView;
     DataTabulatorView.__name__ = "DataTabulatorView";
-    exports.TableLayout = kinds_1.Enum("fit_data", "fit_data_fill", "fit_data_stretch", "fit_data_table", "fit_columns");
+    exports.TableLayout = (0, kinds_1.Enum)("fit_data", "fit_data_fill", "fit_data_stretch", "fit_data_table", "fit_columns");
     // The Bokeh .ts model corresponding to the Bokeh .py model
     class DataTabulator extends html_box_1.HTMLBox {
         constructor(attrs) {
@@ -1278,11 +1409,14 @@
             this.prototype.default_view = DataTabulatorView;
             this.define(({ Any, Array, Boolean, Nullable, Number, Ref, String }) => ({
                 aggregators: [Any, {}],
+                children: [Any, {}],
                 configuration: [Any, {}],
                 columns: [Array(Ref(tables_1.TableColumn)), []],
                 download: [Boolean, true],
                 editable: [Boolean, true],
+                expanded: [Array(Number), []],
                 filename: [String, "table.csv"],
+                filters: [Array(Any), []],
                 follow: [Boolean, true],
                 frozen_rows: [Array(Number), []],
                 groupby: [Array(String), []],
@@ -1308,6 +1442,73 @@
     DataTabulator.__module__ = "panel.models.tabulator";
     DataTabulator.init_DataTabulator();
 },
+"99a25e6992": /* debounce/index.js */ function _(require, module, exports, __esModule, __esExport) {
+    /**
+     * Returns a function, that, as long as it continues to be invoked, will not
+     * be triggered. The function will be called after it stops being called for
+     * N milliseconds. If `immediate` is passed, trigger the function on the
+     * leading edge, instead of the trailing. The function also has a property 'clear'
+     * that is a function which will clear the timer to prevent previously scheduled executions.
+     *
+     * @source underscore.js
+     * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/
+     * @param {Function} function to wrap
+     * @param {Number} timeout in ms (`100`)
+     * @param {Boolean} whether to execute at the beginning (`false`)
+     * @api public
+     */
+    function debounce(func, wait, immediate) {
+        var timeout, args, context, timestamp, result;
+        if (null == wait)
+            wait = 100;
+        function later() {
+            var last = Date.now() - timestamp;
+            if (last < wait && last >= 0) {
+                timeout = setTimeout(later, wait - last);
+            }
+            else {
+                timeout = null;
+                if (!immediate) {
+                    result = func.apply(context, args);
+                    context = args = null;
+                }
+            }
+        }
+        ;
+        var debounced = function () {
+            context = this;
+            args = arguments;
+            timestamp = Date.now();
+            var callNow = immediate && !timeout;
+            if (!timeout)
+                timeout = setTimeout(later, wait);
+            if (callNow) {
+                result = func.apply(context, args);
+                context = args = null;
+            }
+            return result;
+        };
+        debounced.clear = function () {
+            if (timeout) {
+                clearTimeout(timeout);
+                timeout = null;
+            }
+        };
+        debounced.flush = function () {
+            if (timeout) {
+                result = func.apply(context, args);
+                context = args = null;
+                clearTimeout(timeout);
+                timeout = null;
+            }
+        };
+        return debounced;
+    }
+    ;
+    // Adds compatibility for ES modules
+    debounce.debounce = debounce;
+    module.exports = debounce;
+},
 "f1971f81bf": /* models/data.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     function transform_cds_to_records(cds, addId = false) {
@@ -1350,17 +1551,17 @@
 "6e11b2cfe2": /* models/datetime_picker.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const flatpickr_1 = tslib_1.__importDefault(require("50d3473f3f") /* flatpickr */);
+    const flatpickr_1 = (0, tslib_1.__importDefault)(require("50d3473f3f") /* flatpickr */);
     const input_widget_1 = require("@bokehjs/models/widgets/input_widget");
     const dom_1 = require("@bokehjs/core/dom");
     const enums_1 = require("@bokehjs/core/enums");
     const types_1 = require("@bokehjs/core/util/types");
-    const inputs = tslib_1.__importStar(require("@bokehjs/styles/widgets/inputs.css"));
-    const flatpickr_css_1 = tslib_1.__importDefault(require("@bokehjs/styles/widgets/flatpickr.css"));
+    const inputs = (0, tslib_1.__importStar)(require("@bokehjs/styles/widgets/inputs.css"));
+    const flatpickr_css_1 = (0, tslib_1.__importDefault)(require("@bokehjs/styles/widgets/flatpickr.css"));
     function _convert_date_list(value) {
         const result = [];
         for (const item of value) {
-            if (types_1.isString(item))
+            if ((0, types_1.isString)(item))
                 result.push(item);
             else {
                 const [from, to] = item;
@@ -1399,9 +1600,9 @@
             if (this._picker != null)
                 return;
             super.render();
-            this.input_el = dom_1.input({ type: "text", class: inputs.input, disabled: this.model.disabled });
+            this.input_el = (0, dom_1.input)({ type: "text", class: inputs.input, disabled: this.model.disabled });
             this.group_el.appendChild(this.input_el);
-            this._picker = flatpickr_1.default(this.input_el, {
+            this._picker = (0, flatpickr_1.default)(this.input_el, {
                 defaultDate: this.model.value,
                 minDate: (_a = this.model.min_date) !== null && _a !== void 0 ? _a : undefined,
                 maxDate: (_b = this.model.max_date) !== null && _b !== void 0 ? _b : undefined,
@@ -4145,7 +4346,7 @@
     const data_1 = require("f1971f81bf") /* ./data */;
     const layout_1 = require("4c755983eb") /* ./layout */;
     const tooltips_1 = require("6e04fbe567") /* ./tooltips */;
-    const constants_1 = tslib_1.__importDefault(require("093eb75864") /* @luma.gl/constants */);
+    const constants_1 = (0, tslib_1.__importDefault)(require("093eb75864") /* @luma.gl/constants */);
     function extractClasses() {
         // Get classes for registration from standalone deck.gl
         const classesDict = {};
@@ -4217,7 +4418,7 @@
                     this._layer_map[n - 1] = layer.data;
                     cds = this.model.data_sources[layer.data];
                 }
-                layer.data = data_1.transform_cds_to_records(cds);
+                layer.data = (0, data_1.transform_cds_to_records)(cds);
             }
             if (render)
                 this.updateDeck();
@@ -4265,7 +4466,7 @@
             let deckgl;
             try {
                 const props = this.jsonConverter.convert(jsonInput);
-                const getTooltip = tooltips_1.makeTooltip(tooltip, props.layers);
+                const getTooltip = (0, tooltips_1.makeTooltip)(tooltip, props.layers);
                 deckgl = new window.deck.DeckGL(Object.assign(Object.assign({}, props), { map: window.mapboxgl, mapboxApiAccessToken: mapboxApiKey, container,
                     getTooltip }));
             }
@@ -4276,8 +4477,8 @@
         }
         render() {
             super.render();
-            const container = dom_1.div({ class: "deckgl" });
-            layout_1.set_size(container, this.model);
+            const container = (0, dom_1.div)({ class: "deckgl" });
+            (0, layout_1.set_size)(container, this.model);
             const MAPBOX_API_KEY = this.model.mapbox_api_key;
             const tooltip = this.model.tooltip;
             const data = this.getData();
@@ -5293,7 +5494,7 @@
     ECharts.__module__ = "panel.models.echarts";
     ECharts.init_ECharts();
 },
-"2839081043": /* models/html.js */ function _(require, module, exports, __esModule, __esExport) {
+"c424a3bd17": /* models/html.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const markup_1 = require("@bokehjs/models/widgets/markup");
     const bokeh_events_1 = require("@bokehjs/core/bokeh_events");
@@ -5342,8 +5543,7 @@
         }
         render() {
             super.render();
-            const decoded = htmlDecode(this.model.text);
-            const html = decoded || this.model.text;
+            const html = this.process_tex();
             if (!html) {
                 this.markup_el.innerHTML = '';
                 return;
@@ -5352,6 +5552,29 @@
             runScripts(this.markup_el);
             this._setup_event_listeners();
         }
+        process_tex() {
+            const decoded = htmlDecode(this.model.text);
+            const text = decoded || this.model.text;
+            if (this.model.disable_math || !this.contains_tex(text))
+                return text;
+            const tex_parts = this.provider.MathJax.find_tex(text);
+            const processed_text = [];
+            let last_index = 0;
+            for (const part of tex_parts) {
+                processed_text.push(text.slice(last_index, part.start.n));
+                processed_text.push(this.provider.MathJax.tex2svg(part.math, { display: part.display }).outerHTML);
+                last_index = part.end.n;
+            }
+            if (last_index < text.length)
+                processed_text.push(text.slice(last_index));
+            return processed_text.join("");
+        }
+        contains_tex(html) {
+            if (!this.provider.MathJax)
+                return false;
+            return this.provider.MathJax.find_tex(html).length > 0;
+        }
+        ;
         _remove_event_listeners() {
             for (const node in this._event_listeners) {
                 const el = document.getElementById(node);
@@ -5375,7 +5598,7 @@
                 }
                 for (const event_name of this.model.events[node]) {
                     const callback = (event) => {
-                        this.model.trigger_event(new DOMEvent(node, event_to_object_1.serializeEvent(event)));
+                        this.model.trigger_event(new DOMEvent(node, (0, event_to_object_1.serializeEvent)(event)));
                     };
                     el.addEventListener(event_name, callback);
                     if (!(node in this._event_listeners))
@@ -5546,9 +5769,9 @@
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const layout_1 = require("4c755983eb") /* ./layout */;
     const event_to_object_1 = require("3329d4aa5b") /* ./event-to-object */;
-    const LayoutConfigContext = preact_1.createContext({});
+    const LayoutConfigContext = (0, preact_1.createContext)({});
     function mountLayout(mountElement, saveUpdateHook, sendEvent, importSourceUrl) {
-        preact_1.render(preact_2.html `
+        (0, preact_1.render)((0, preact_2.html) `
       <${Layout}
         saveUpdateHook=${saveUpdateHook}
         sendEvent=${sendEvent}
@@ -5559,9 +5782,9 @@
     exports.mountLayout = mountLayout;
     function Layout({ saveUpdateHook, sendEvent, importSourceUrl }) {
         const [model, patchModel] = useInplaceJsonPatch({});
-        hooks_1.useEffect(() => saveUpdateHook(patchModel), [patchModel]);
+        (0, hooks_1.useEffect)(() => saveUpdateHook(patchModel), [patchModel]);
         if (model.tagName) {
-            return preact_2.html `
+            return (0, preact_2.html) `
       <${LayoutConfigContext.Provider}
         value=${{
                 sendEvent: sendEvent,
@@ -5573,46 +5796,46 @@
     `;
         }
         else
-            return preact_2.html `<div />`;
+            return (0, preact_2.html) `<div />`;
     }
     exports.default = Layout;
     function Element({ model }) {
         if (model.importSource)
-            return preact_2.html `<${ImportedElement} model=${model} />`;
+            return (0, preact_2.html) `<${ImportedElement} model=${model} />`;
         else
-            return preact_2.html `<${StandardElement} model=${model} />`;
+            return (0, preact_2.html) `<${StandardElement} model=${model} />`;
     }
     function ImportedElement({ model }) {
-        const config = hooks_1.useContext(LayoutConfigContext);
+        const config = (0, hooks_1.useContext)(LayoutConfigContext);
         const module = useLazyModule(model.importSource.source, config.importSourceUrl);
         if (module) {
             const cmpt = getPathProperty(module, model.tagName);
             const children = elementChildren(model);
             const attributes = elementAttributes(model, config.sendEvent);
-            return preact_2.html `<${cmpt} ...${attributes}>${children}<//>`;
+            return (0, preact_2.html) `<${cmpt} ...${attributes}>${children}<//>`;
         }
         else {
             const fallback = model.importSource.fallback;
             if (!fallback)
-                return preact_2.html `<div />`;
+                return (0, preact_2.html) `<div />`;
             switch (typeof fallback) {
                 case "object":
-                    return preact_2.html `<${Element} model=${fallback} />`;
+                    return (0, preact_2.html) `<${Element} model=${fallback} />`;
                 case "string":
-                    return preact_2.html `<div>${fallback}</div>`;
+                    return (0, preact_2.html) `<div>${fallback}</div>`;
                 default:
                     return null;
             }
         }
     }
     function StandardElement({ model }) {
-        const config = hooks_1.useContext(LayoutConfigContext);
+        const config = (0, hooks_1.useContext)(LayoutConfigContext);
         const children = elementChildren(model);
         const attributes = elementAttributes(model, config.sendEvent);
         if (model.children && model.children.length)
-            return preact_2.html `<${model.tagName} ...${attributes}>${children}<//>`;
+            return (0, preact_2.html) `<${model.tagName} ...${attributes}>${children}<//>`;
         else
-            return preact_2.html `<${model.tagName} ...${attributes} />`;
+            return (0, preact_2.html) `<${model.tagName} ...${attributes} />`;
     }
     function elementChildren(model) {
         if (!model.children)
@@ -5621,7 +5844,7 @@
             return model.children.map((child) => {
                 switch (typeof child) {
                     case "object":
-                        return preact_2.html `<${Element} model=${child} />`;
+                        return (0, preact_2.html) `<${Element} model=${child} />`;
                     case "string":
                         return child;
                     default:
@@ -5648,7 +5871,7 @@
                         value.preventDefault();
                     if (eventSpec["stopPropagation"])
                         value.stopPropagation();
-                    return event_to_object_1.serializeEvent(value);
+                    return (0, event_to_object_1.serializeEvent)(value);
                 }
                 else
                     return value;
@@ -5664,7 +5887,7 @@
         };
     }
     function useLazyModule(source, sourceUrlBase = "") {
-        const [module, setModule] = hooks_1.useState(null);
+        const [module, setModule] = (0, hooks_1.useState)(null);
         // use eval() to avoid weird build behavior by bundlers like Webpack
         if (!module)
             eval(`import('${joinUrl(sourceUrlBase, source)}')`).then(setModule);
@@ -5680,9 +5903,9 @@
         return value;
     }
     function useInplaceJsonPatch(doc) {
-        const ref = hooks_1.useRef(doc);
+        const ref = (0, hooks_1.useRef)(doc);
         const forceUpdate = useForceUpdate();
-        const applyPatch = hooks_1.useCallback((path, patch) => {
+        const applyPatch = (0, hooks_1.useCallback)((path, patch) => {
             applyPatchInplace(ref.current, path, patch);
             forceUpdate();
         }, [ref, forceUpdate]);
@@ -5690,20 +5913,20 @@
     }
     function applyPatchInplace(doc, path, patch) {
         if (!path)
-            fast_json_patch_1.applyPatch(doc, patch);
+            (0, fast_json_patch_1.applyPatch)(doc, patch);
         else {
-            fast_json_patch_1.applyPatch(doc, [
+            (0, fast_json_patch_1.applyPatch)(doc, [
                 {
                     op: "replace",
                     path: path,
-                    value: fast_json_patch_1.applyPatch(fast_json_patch_1.getValueByPointer(doc, path), patch, false, false).newDocument,
+                    value: (0, fast_json_patch_1.applyPatch)((0, fast_json_patch_1.getValueByPointer)(doc, path), patch, false, false).newDocument,
                 },
             ]);
         }
     }
     function useForceUpdate() {
-        const [, updateState] = hooks_1.useState({});
-        return hooks_1.useCallback(() => updateState({}), []);
+        const [, updateState] = (0, hooks_1.useState)({});
+        return (0, hooks_1.useCallback)(() => updateState({}), []);
     }
     function joinUrl(base, tail) {
         return tail.startsWith("./")
@@ -5722,7 +5945,7 @@
             this.update_layout();
             this.compute_layout();
             this.invalidate_layout();
-            layout_1.set_size(this.el, this.model);
+            (0, layout_1.set_size)(this.el, this.model);
         }
         initialize() {
             super.initialize();
@@ -6114,7 +6337,7 @@
     __esExport("h", preact_2.h);
     __esExport("render", preact_2.render);
     __esExport("Component", preact_2.Component);
-    const htm_1 = tslib_1.__importDefault(require("ab33dd3f38") /* htm */);
+    const htm_1 = (0, tslib_1.__importDefault)(require("ab33dd3f38") /* htm */);
     var m = htm_1.default.bind(preact_1.h);
     exports.html = m;
 },
@@ -7086,7 +7309,7 @@
     const tslib_1 = require("tslib");
     const kinds_1 = require("@bokehjs/core/kinds");
     const markup_1 = require("@bokehjs/models/widgets/markup");
-    const json_formatter_js_1 = tslib_1.__importDefault(require("18bba7b7e1") /* json-formatter-js */);
+    const json_formatter_js_1 = (0, tslib_1.__importDefault)(require("18bba7b7e1") /* json-formatter-js */);
     const layout_1 = require("4c755983eb") /* ./layout */;
     class JSONView extends layout_1.PanelMarkupView {
         connect_signals() {
@@ -7119,7 +7342,7 @@
     }
     exports.JSONView = JSONView;
     JSONView.__name__ = "JSONView";
-    exports.JSONTheme = kinds_1.Enum("dark", "light");
+    exports.JSONTheme = (0, kinds_1.Enum)("dark", "light");
     class JSON extends markup_1.Markup {
         constructor(attrs) {
             super(attrs);
@@ -7226,7 +7449,7 @@
     __esModule();
     const tslib_1 = require("tslib");
     const input_widget_1 = require("@bokehjs/models/widgets/input_widget");
-    const buttons_css_1 = tslib_1.__importStar(require("@bokehjs/styles/buttons.css")), buttons = buttons_css_1;
+    const buttons_css_1 = (0, tslib_1.__importStar)(require("@bokehjs/styles/buttons.css")), buttons = buttons_css_1;
     const dom_1 = require("@bokehjs/core/dom");
     const enums_1 = require("@bokehjs/core/enums");
     function dataURItoBlob(dataURI) {
@@ -7316,7 +7539,7 @@
             // "Uncaught TypeError: t is undefined"
             // This seems to be related to button do not have a value
             // property.
-            this.input_el = dom_1.input({
+            this.input_el = (0, dom_1.input)({
                 type: "bk_btn, bk_btn_type",
             });
             this.input_el.addEventListener("change", () => this.change_input());
@@ -7653,16 +7876,16 @@
             this.worker = window.perspective.worker();
             this.table = this.worker.table(this.model.schema);
             this.table.update(this.data);
-            const container = dom_1.div({
+            const container = (0, dom_1.div)({
                 class: "pnx-perspective-viewer",
                 style: {
                     zIndex: 0,
                 }
             });
-            layout_1.set_size(container, this.model);
+            (0, layout_1.set_size)(container, this.model);
             container.innerHTML = this.getInnerHTML();
             this.perspective_element = container.children[0];
-            layout_1.set_size(this.perspective_element, this.model);
+            (0, layout_1.set_size)(this.perspective_element, this.model);
             this.el.appendChild(container);
             this.perspective_element.load(this.table).then(() => {
                 this.update_config();
@@ -7865,7 +8088,7 @@
                 return;
             }
             // Layout to group the elements
-            this.groupEl = dom_1.div();
+            this.groupEl = (0, dom_1.div)();
             this.groupEl.style.display = "flex";
             this.groupEl.style.flexDirection = "column";
             this.groupEl.style.alignItems = "center";
@@ -7878,7 +8101,7 @@
             this.sliderEl.max = String(this.model.end);
             this.sliderEl.onchange = (ev) => this.set_frame(parseInt(ev.target.value));
             // Buttons
-            const button_div = dom_1.div();
+            const button_div = (0, dom_1.div)();
             this.buttonEl = button_div;
             button_div.style.cssText = "margin: 0 auto; display: flex; padding: 5px; align-items: stretch; width: 100%;";
             const button_style_small = "text-align: center; min-width: 20px; flex-grow: 1; margin: 2px";
@@ -8097,7 +8320,7 @@
     }
     exports.PlayerView = PlayerView;
     PlayerView.__name__ = "PlayerView";
-    exports.LoopPolicy = kinds_1.Enum("once", "loop", "reflect");
+    exports.LoopPolicy = (0, kinds_1.Enum)("once", "loop", "reflect");
     class Player extends widget_1.Widget {
         constructor(attrs) {
             super(attrs);
@@ -8122,7 +8345,7 @@
     Player.__module__ = "panel.models.widgets";
     Player.init_Player();
 },
-"c23bb1717d": /* models/plotly.js */ function _(require, module, exports, __esModule, __esExport) {
+"a2080c6bc8": /* models/plotly.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const dom_1 = require("@bokehjs/core/dom");
     const object_1 = require("@bokehjs/core/util/object");
@@ -8155,7 +8378,7 @@
                 for (let property in fullPoint) {
                     const val = fullPoint[property];
                     if (fullPoint.hasOwnProperty(property) &&
-                        !Array.isArray(val) && !util_1.isPlainObject(val)) {
+                        !Array.isArray(val) && !(0, util_1.isPlainObject)(val)) {
                         pointData[property] = val;
                     }
                 }
@@ -8207,10 +8430,14 @@
             this._plotInitialized = false;
             this._reacting = false;
             this._relayouting = false;
-            this._end_relayouting = debounce_1.debounce(() => {
+            this._end_relayouting = (0, debounce_1.debounce)(() => {
                 this._relayouting = false;
             }, 2000, false);
         }
+        initialize() {
+            super.initialize();
+            this._layout_wrapper = (0, dom_1.div)({ style: "height: 100%; width: 100%;" });
+        }
         connect_signals() {
             super.connect_signals();
             const { data, data_sources, layout, relayout, restyle } = this.model.properties;
@@ -8239,27 +8466,25 @@
             this.connect(this.model.properties.viewport_update_throttle.change, () => {
                 this._updateSetViewportFunction();
             });
-            this.connect(this.model.properties._render_count.change, () => this.plot());
+            this.connect(this.model.properties._render_count.change, () => {
+                this.plot();
+            });
             this.connect(this.model.properties.viewport.change, () => this._updateViewportFromProperty());
         }
-        render() {
+        async render() {
             super.render();
-            this._layout_wrapper = dom_1.div({ style: "height: 100%; width: 100%" });
             this.el.appendChild(this._layout_wrapper);
-            if (!window.Plotly) {
-                return;
-            }
-            this.plot();
+            await this.plot();
+            window.Plotly.relayout(this._layout_wrapper, this.model.relayout);
         }
         _trace_data() {
             const data = [];
-            for (let i = 0; i < this.model.data.length; i++) {
+            for (let i = 0; i < this.model.data.length; i++)
                 data.push(this._get_trace(i, false));
-            }
             return data;
         }
         _layout_data() {
-            const newLayout = util_1.deepCopy(this.model.layout);
+            const newLayout = (0, util_1.deepCopy)(this.model.layout);
             if (this._relayouting) {
                 const { layout } = this._layout_wrapper;
                 // For each xaxis* and yaxis* property of layout, if the value has a 'range'
@@ -8320,26 +8545,30 @@
                 this.model.hover_data = null;
             });
         }
-        plot() {
-            if (!window.Plotly) {
+        async plot() {
+            if (!window.Plotly)
                 return;
-            }
             const data = this._trace_data();
             const newLayout = this._layout_data();
             this._reacting = true;
-            window.Plotly.react(this._layout_wrapper, data, newLayout, this.model.config).then(() => {
-                this._updateSetViewportFunction();
-                this._updateViewportProperty();
-                if (!this._plotInitialized)
-                    this._install_callbacks();
-                this._plotInitialized = true;
-                this._reacting = false;
-                if (!_isHidden(this._layout_wrapper))
-                    window.Plotly.Plots.resize(this._layout_wrapper);
-            });
+            await window.Plotly.react(this._layout_wrapper, data, newLayout, this.model.config);
+            this._updateSetViewportFunction();
+            this._updateViewportProperty();
+            if (!this._plotInitialized)
+                this._install_callbacks();
+            else if (!_isHidden(this._layout_wrapper))
+                window.Plotly.Plots.resize(this._layout_wrapper);
+            this._reacting = false;
+            this._plotInitialized = true;
+        }
+        after_layout() {
+            super.after_layout();
+            (0, layout_1.set_size)(this.el, this.model);
+            if (window.Plotly && this._plotInitialized)
+                window.Plotly.Plots.resize(this._layout_wrapper);
         }
         _get_trace(index, update) {
-            const trace = object_1.clone(this.model.data[index]);
+            const trace = (0, object_1.clone)(this.model.data[index]);
             const cds = this.model.data_sources[index];
             for (const column of cds.columns()) {
                 let array = cds.get_array(column)[0];
@@ -8373,10 +8602,13 @@
             const fullLayout = this._layout_wrapper._fullLayout;
             // Call relayout if viewport differs from fullLayout
             Object.keys(this.model.viewport).reduce((value, key) => {
-                if (!eq_1.isEqual(util_1.get(fullLayout, key), value)) {
-                    let clonedViewport = util_1.deepCopy(this.model.viewport);
+                if (!(0, eq_1.isEqual)((0, util_1.get)(fullLayout, key), value)) {
+                    let clonedViewport = (0, util_1.deepCopy)(this.model.viewport);
                     clonedViewport['_update_from_property'] = true;
-                    window.Plotly.relayout(this.el, clonedViewport);
+                    this._settingViewport = true;
+                    window.Plotly.relayout(this.el, clonedViewport).then(() => {
+                        this._settingViewport = false;
+                    });
                     return false;
                 }
                 else {
@@ -8389,17 +8621,14 @@
             let viewport = {};
             // Get range for all xaxis and yaxis properties
             for (let prop in fullLayout) {
-                if (!fullLayout.hasOwnProperty(prop)) {
+                if (!fullLayout.hasOwnProperty(prop))
                     continue;
-                }
                 let maybe_axis = prop.slice(0, 5);
-                if (maybe_axis === 'xaxis' || maybe_axis === 'yaxis') {
-                    viewport[prop + '.range'] = util_1.deepCopy(fullLayout[prop].range);
-                }
+                if (maybe_axis === 'xaxis' || maybe_axis === 'yaxis')
+                    viewport[prop + '.range'] = (0, util_1.deepCopy)(fullLayout[prop].range);
             }
-            if (!eq_1.isEqual(viewport, this.model.viewport)) {
+            if (!(0, eq_1.isEqual)(viewport, this.model.viewport))
                 this._setViewport(viewport);
-            }
         }
         _updateSetViewportFunction() {
             if (this.model.viewport_update_policy === "continuous" ||
@@ -8413,7 +8642,7 @@
                 };
             }
             else {
-                this._setViewport = util_1.throttle((viewport) => {
+                this._setViewport = (0, util_1.throttle)((viewport) => {
                     if (!this._settingViewport) {
                         this._settingViewport = true;
                         this.model.viewport = viewport;
@@ -8456,73 +8685,6 @@
     PlotlyPlot.__module__ = "panel.models.plotly";
     PlotlyPlot.init_PlotlyPlot();
 },
-"99a25e6992": /* debounce/index.js */ function _(require, module, exports, __esModule, __esExport) {
-    /**
-     * Returns a function, that, as long as it continues to be invoked, will not
-     * be triggered. The function will be called after it stops being called for
-     * N milliseconds. If `immediate` is passed, trigger the function on the
-     * leading edge, instead of the trailing. The function also has a property 'clear'
-     * that is a function which will clear the timer to prevent previously scheduled executions.
-     *
-     * @source underscore.js
-     * @see http://unscriptable.com/2009/03/20/debouncing-javascript-methods/
-     * @param {Function} function to wrap
-     * @param {Number} timeout in ms (`100`)
-     * @param {Boolean} whether to execute at the beginning (`false`)
-     * @api public
-     */
-    function debounce(func, wait, immediate) {
-        var timeout, args, context, timestamp, result;
-        if (null == wait)
-            wait = 100;
-        function later() {
-            var last = Date.now() - timestamp;
-            if (last < wait && last >= 0) {
-                timeout = setTimeout(later, wait - last);
-            }
-            else {
-                timeout = null;
-                if (!immediate) {
-                    result = func.apply(context, args);
-                    context = args = null;
-                }
-            }
-        }
-        ;
-        var debounced = function () {
-            context = this;
-            args = arguments;
-            timestamp = Date.now();
-            var callNow = immediate && !timeout;
-            if (!timeout)
-                timeout = setTimeout(later, wait);
-            if (callNow) {
-                result = func.apply(context, args);
-                context = args = null;
-            }
-            return result;
-        };
-        debounced.clear = function () {
-            if (timeout) {
-                clearTimeout(timeout);
-                timeout = null;
-            }
-        };
-        debounced.flush = function () {
-            if (timeout) {
-                result = func.apply(context, args);
-                context = args = null;
-                clearTimeout(timeout);
-                timeout = null;
-            }
-        };
-        return debounced;
-    }
-    ;
-    // Adds compatibility for ES modules
-    debounce.debounce = debounce;
-    module.exports = debounce;
-},
 "990b5dd5c7": /* models/util.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const get = (obj, path, defaultValue = undefined) => {
@@ -8576,10 +8738,10 @@
     }
     exports.isPlainObject = isPlainObject;
 },
-"9f787650b9": /* models/progress.js */ function _(require, module, exports, __esModule, __esExport) {
+"fd3806082d": /* models/progress.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const p = tslib_1.__importStar(require("@bokehjs/core/properties"));
+    const p = (0, tslib_1.__importStar)(require("@bokehjs/core/properties"));
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const layout_1 = require("4c755983eb") /* ./layout */;
     class ProgressView extends html_box_1.HTMLBoxView {
@@ -8606,7 +8768,7 @@
             this.progressEl = document.createElement('progress');
             this.setValue();
             this.setMax();
-            layout_1.set_size(this.progressEl, this.model);
+            (0, layout_1.set_size)(this.progressEl, this.model);
             // Set styling
             this.setCSS();
             for (const prop in style)
@@ -8620,8 +8782,13 @@
             this.progressEl.className = css;
         }
         setValue() {
-            if (this.model.value != null)
+            if (this.model.value == null)
+                this.progressEl.value = 0;
+            else if (this.model.value >= 0)
                 this.progressEl.value = this.model.value;
+            else if (this.model.value < 0)
+                this.progressEl.removeAttribute("value");
+            console.log(this.progressEl);
         }
         setMax() {
             if (this.model.max != null)
@@ -8657,7 +8824,96 @@
     Progress.__module__ = "panel.models.widgets";
     Progress.init_Progress();
 },
-"d536149aaa": /* models/reactive_html.js */ function _(require, module, exports, __esModule, __esExport) {
+"6895629dfc": /* models/quill.js */ function _(require, module, exports, __esModule, __esExport) {
+    __esModule();
+    const dom_1 = require("@bokehjs/core/dom");
+    const html_box_1 = require("@bokehjs/models/layouts/html_box");
+    const layout_1 = require("4c755983eb") /* ./layout */;
+    class QuillInputView extends layout_1.PanelHTMLBoxView {
+        initialize() {
+            super.initialize();
+            this._container = (0, dom_1.div)({});
+        }
+        connect_signals() {
+            super.connect_signals();
+            this.connect(this.model.properties.disabled.change, () => this.quill.enable(!this.model.disabled));
+            this.connect(this.model.properties.text.change, () => {
+                if (this._editing)
+                    return;
+                this._editing = true;
+                this.quill.setContents([]);
+                this.quill.clipboard.dangerouslyPasteHTML(this.model.text);
+                this._editing = false;
+            });
+            const { mode, toolbar } = this.model.properties;
+            this.on_change([mode, toolbar], () => {
+                this.render();
+                this._layout_toolbar();
+            });
+        }
+        _layout_toolbar() {
+            if (this._toolbar == null) {
+                this.el.style.removeProperty('padding-top');
+            }
+            else {
+                const height = this._toolbar.getBoundingClientRect().height + 1;
+                this.el.style.paddingTop = height + "px";
+                this._toolbar.style.marginTop = -height + "px";
+            }
+        }
+        render() {
+            super.render();
+            this.el.appendChild(this._container);
+            const theme = (this.model.mode === 'bubble') ? 'bubble' : 'snow';
+            this.quill = new window.Quill(this._container, {
+                modules: {
+                    toolbar: this.model.toolbar
+                },
+                placeholder: this.model.placeholder,
+                theme: theme
+            });
+            this._editor = this.el.querySelector('.ql-editor');
+            this._toolbar = this.el.querySelector('.ql-toolbar');
+            this.quill.clipboard.dangerouslyPasteHTML(this.model.text);
+            this.quill.on('text-change', () => {
+                if (this._editing)
+                    return;
+                this._editing = true;
+                this.model.text = this._editor.innerHTML;
+                this._editing = false;
+            });
+        }
+        after_layout() {
+            super.after_layout();
+            this._layout_toolbar();
+        }
+    }
+    exports.QuillInputView = QuillInputView;
+    QuillInputView.__name__ = "QuillInputView";
+    class QuillInput extends html_box_1.HTMLBox {
+        constructor(attrs) {
+            super(attrs);
+        }
+        static init_QuillInput() {
+            this.prototype.default_view = QuillInputView;
+            this.define(({ Any, Boolean, String }) => ({
+                mode: [String, 'toolbar'],
+                placeholder: [String, ''],
+                readonly: [Boolean, false],
+                text: [String, ''],
+                toolbar: [Any, null],
+            }));
+            this.override({
+                height: 300
+            });
+        }
+    }
+    exports.QuillInput = QuillInput;
+    QuillInput.__name__ = "QuillInput";
+    QuillInput.__module__ = "panel.models.quill";
+    QuillInput.init_QuillInput();
+},
+"eb3a49319b": /* models/reactive_html.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const preact_1 = require("6f11f2ef27") /* preact */;
     const hooks_1 = require("4c02a9b43f") /* preact/hooks */;
@@ -8669,7 +8925,7 @@
     const color_1 = require("@bokehjs/core/util/color");
     const data_1 = require("f1971f81bf") /* ./data */;
     const event_to_object_1 = require("3329d4aa5b") /* ./event-to-object */;
-    const html_1 = require("2839081043") /* ./html */;
+    const html_1 = require("c424a3bd17") /* ./html */;
     const layout_1 = require("4c755983eb") /* ./layout */;
     function serialize_attrs(attrs) {
         const serialized = {};
@@ -8737,7 +8993,7 @@
         }
         initialize() {
             super.initialize();
-            this.html = html_1.htmlDecode(this.model.html) || this.model.html;
+            this.html = (0, html_1.htmlDecode)(this.model.html) || this.model.html;
         }
         _recursive_connect(model, update_children, path) {
             for (const prop in model.properties) {
@@ -8747,6 +9003,8 @@
                 else
                     subpath = prop;
                 const obj = model[prop];
+                if (obj == null)
+                    continue;
                 if (obj.properties != null)
                     this._recursive_connect(obj, true, subpath);
                 this.connect(model.properties[prop].change, () => {
@@ -8754,7 +9012,7 @@
                         for (const node in this.model.children) {
                             if (this.model.children[node] == prop) {
                                 let children = model[prop];
-                                if (!types_1.isArray(children))
+                                if (!(0, types_1.isArray)(children))
                                     children = [children];
                                 this._render_node(node, children);
                                 this.invalidate_layout();
@@ -8772,7 +9030,7 @@
         connect_signals() {
             super.connect_signals();
             this.connect(this.model.properties.children.change, async () => {
-                this.html = html_1.htmlDecode(this.model.html) || this.model.html;
+                this.html = (0, html_1.htmlDecode)(this.model.html) || this.model.html;
                 await this.rebuild();
                 this.invalidate_layout();
             });
@@ -8799,7 +9057,7 @@
                     attr = prop;
                 }
                 for (const script of scripts) {
-                    const decoded_script = html_1.htmlDecode(script) || script;
+                    const decoded_script = (0, html_1.htmlDecode)(script) || script;
                     const script_fn = this._render_script(decoded_script, id);
                     this._script_fns[prop] = script_fn;
                     const property = data_model.properties[attr];
@@ -8827,7 +9085,7 @@
             return script_fn(this.model, this.model.data, this._state, this, (s) => this.run_script(s), this_obj);
         }
         get_records(property, index = true) {
-            return data_1.dict_to_records(this.model.data[property], index);
+            return (0, data_1.dict_to_records)(this.model.data[property], index);
         }
         disconnect_signals() {
             super.disconnect_signals();
@@ -8845,7 +9103,7 @@
             return models;
         }
         async build_child_views() {
-            await build_views_1.build_views(this._child_views, this.child_models, { parent: null });
+            await (0, build_views_1.build_views)(this._child_views, this.child_models, { parent: null });
         }
         compute_layout() {
             if (this.root != this)
@@ -8875,7 +9133,7 @@
         _align_view(view) {
             const { align } = view.model;
             let halign, valign;
-            if (types_1.isArray(align))
+            if ((0, types_1.isArray)(align))
                 [halign, valign] = align;
             else
                 halign = valign = align;
@@ -8893,10 +9151,10 @@
                 view.el.style.marginTop = 'auto';
         }
         render() {
-            dom_1.empty(this.el);
+            (0, dom_1.empty)(this.el);
             const { background } = this.model;
-            this.el.style.backgroundColor = background != null ? color_1.color2css(background) : "";
-            dom_1.classes(this.el).clear().add(...this.css_classes());
+            this.el.style.backgroundColor = background != null ? (0, color_1.color2css)(background) : "";
+            (0, dom_1.classes)(this.el).clear().add(...this.css_classes());
             this._update();
             this._render_children();
             this._setup_mutation_observers();
@@ -8904,14 +9162,14 @@
             this.run_script('render', true);
         }
         _send_event(elname, attr, event) {
-            let serialized = event_to_object_1.serializeEvent(event);
+            let serialized = (0, event_to_object_1.serializeEvent)(event);
             serialized.type = attr;
             this.model.trigger_event(new html_1.DOMEvent(elname, serialized));
         }
         _render_child(model, el) {
             const view = this._child_views.get(model);
             if (view == null)
-                el.innerHTML = model;
+                el.innerHTML = (0, html_1.htmlDecode)(model) || model;
             else {
                 view._parent = this;
                 view.renderTo(el);
@@ -8935,13 +9193,13 @@
                 return;
             }
             this.el.style.display = this.model.visible ? "block" : "none";
-            layout_1.set_size(this.el, this.model);
+            (0, layout_1.set_size)(this.el, this.model);
             let { margin } = this.model;
             let margin_spec = null;
             if (margin == null)
                 this.el.style.margin = "";
             else {
-                if (types_1.isNumber(margin))
+                if ((0, types_1.isNumber)(margin))
                     margin_spec = { top: margin, right: margin, bottom: margin, left: margin };
                 else if (margin.length == 2) {
                     const [vertical, horizontal] = margin;
@@ -8984,7 +9242,7 @@
                 let children = this.model.children[node];
                 if (typeof children == "string") {
                     children = this.model.data[children];
-                    if (!types_1.isArray(children))
+                    if (!(0, types_1.isArray)(children))
                         children = [children];
                 }
                 this._render_node(node, children);
@@ -9120,7 +9378,7 @@
                 const rendered = this._render_html(this.html);
                 try {
                     this._changing = true;
-                    preact_1.render(rendered, this.el);
+                    (0, preact_1.render)(rendered, this.el);
                 }
                 finally {
                     this._changing = false;
@@ -9188,13 +9446,13 @@
     ReactiveHTML.__module__ = "panel.models.reactive_html";
     ReactiveHTML.init_ReactiveHTML();
 },
-"3b85956787": /* models/singleselect.js */ function _(require, module, exports, __esModule, __esExport) {
+"5ed2116e26": /* models/singleselect.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
     const dom_1 = require("@bokehjs/core/dom");
     const types_1 = require("@bokehjs/core/util/types");
     const input_widget_1 = require("@bokehjs/models/widgets/input_widget");
-    const inputs = tslib_1.__importStar(require("@bokehjs/styles/widgets/inputs.css"));
+    const inputs = (0, tslib_1.__importStar)(require("@bokehjs/styles/widgets/inputs.css"));
     class SingleSelectView extends input_widget_1.InputWidgetView {
         connect_signals() {
             super.connect_signals();
@@ -9209,13 +9467,13 @@
             super.render();
             const options = this.model.options.map((opt) => {
                 let value, _label;
-                if (types_1.isString(opt))
+                if ((0, types_1.isString)(opt))
                     value = _label = opt;
                 else
                     [value, _label] = opt;
-                return dom_1.option({ value }, _label);
+                return (0, dom_1.option)({ value }, _label);
             });
-            this.select_el = dom_1.select({
+            this.select_el = (0, dom_1.select)({
                 multiple: false,
                 class: inputs.input,
                 name: this.model.name,
@@ -9265,7 +9523,7 @@
             this.define(({ Any, Array, Int, String }) => ({
                 value: [String, ""],
                 options: [Array(Any), []],
-                size: [Int, 4],
+                size: [Int, 4], // 4 is the HTML default
             }));
         }
     }
@@ -9277,7 +9535,7 @@
 "aaa48703af": /* models/speech_to_text.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const p = tslib_1.__importStar(require("@bokehjs/core/properties"));
+    const p = (0, tslib_1.__importStar)(require("@bokehjs/core/properties"));
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const iconStarted = `<svg xmlns="http://www.w3.org/2000/svg" height="22px" style="vertical-align: middle;" fill="currentColor" class="bi bi-mic" viewBox="0 0 16 16">
   <path fill-rule="evenodd" d="M3.5 6.5A.5.5 0 0 1 4 7v1a4 4 0 0 0 8 0V7a.5.5 0 0 1 1 0v1a5 5 0 0 1-4.5 4.975V15h3a.5.5 0 0 1 0 1h-7a.5.5 0 0 1 0-1h3v-2.025A5 5 0 0 1 3 8V7a.5.5 0 0 1 .5-.5z"/>
@@ -9510,7 +9768,7 @@
                 this.apply_state(this._cache[current]);
         }
         set_state(widget, value) {
-            let values = array_1.copy(this.values);
+            let values = (0, array_1.copy)(this.values);
             const index = this.widgets[widget.id];
             values[index] = value;
             let state = this.state;
@@ -9545,11 +9803,24 @@
     State.__module__ = "panel.models.state";
     State.init_State();
 },
-"91fe88c277": /* models/terminal.js */ function _(require, module, exports, __esModule, __esExport) {
+"edf66f5228": /* models/terminal.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const dom_1 = require("@bokehjs/core/dom");
+    const bokeh_events_1 = require("@bokehjs/core/bokeh_events");
     const layout_1 = require("4c755983eb") /* ./layout */;
+    class KeystrokeEvent extends bokeh_events_1.ModelEvent {
+        constructor(key) {
+            super();
+            this.key = key;
+            this.event_name = "keystroke";
+        }
+        _to_json() {
+            return { model: this.origin, key: this.key };
+        }
+    }
+    exports.KeystrokeEvent = KeystrokeEvent;
+    KeystrokeEvent.__name__ = "KeystrokeEvent";
     class TerminalView extends layout_1.PanelHTMLBoxView {
         connect_signals() {
             super.connect_signals();
@@ -9558,8 +9829,8 @@
         }
         render() {
             super.render();
-            this.container = dom_1.div({ class: "terminal-container" });
-            layout_1.set_size(this.container, this.model);
+            this.container = (0, dom_1.div)({ class: "terminal-container" });
+            (0, layout_1.set_size)(this.container, this.model);
             this.term = this.getNewTerminal();
             this.term.onData((value) => {
                 this.handleOnData(value);
@@ -9568,9 +9839,8 @@
             this.term.loadAddon(this.webLinksAddon);
             this.term.open(this.container);
             this.term.onRender(() => {
-                if (!this._rendered) {
+                if (!this._rendered)
                     this.fit();
-                }
             });
             this.write();
             this.el.appendChild(this.container);
@@ -9587,11 +9857,7 @@
             return new wn.WebLinksAddon.WebLinksAddon();
         }
         handleOnData(value) {
-            // Hack to handle repeating keyboard inputs
-            if (this.model.input === value)
-                this.model._value_repeats += 1;
-            else
-                this.model.input = value;
+            this.model.trigger_event(new KeystrokeEvent(value));
         }
         write() {
             const text = this.model.output;
@@ -9603,7 +9869,6 @@
             this.term.write(cleaned);
         }
         clear() {
-            // https://stackoverflow.com/questions/65367607/how-to-handle-new-line-in-xterm-js-while-writing-data-into-the-terminal
             this.term.clear();
         }
         fit() {
@@ -9616,10 +9881,10 @@
                 return;
             const cols = Math.max(2, Math.floor(width / cell_width));
             const rows = Math.max(1, Math.floor(height / cell_height));
-            if (this.term.rows !== rows || this.term.cols !== cols) {
-                renderer.clear();
+            if (this.term.rows !== rows || this.term.cols !== cols)
                 this.term.resize(cols, rows);
-            }
+            this.model.ncols = cols;
+            this.model.nrows = rows;
             this._rendered = true;
         }
         after_layout() {
@@ -9641,11 +9906,11 @@
         static init_Terminal() {
             this.prototype.default_view = TerminalView;
             this.define(({ Any, Int, String }) => ({
+                _clears: [Int, 0],
                 options: [Any, {}],
                 output: [String,],
-                input: [String,],
-                _clears: [Int, 0],
-                _value_repeats: [Int, 0],
+                ncols: [Int],
+                nrows: [Int],
             }));
         }
     }
@@ -9784,7 +10049,7 @@
     TextToSpeech.__module__ = "panel.models.text_to_speech";
     TextToSpeech.init_TextToSpeech();
 },
-"ded3463d6c": /* models/trend.js */ function _(require, module, exports, __esModule, __esExport) {
+"effe070807": /* models/trend.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const build_views_1 = require("@bokehjs/core/build_views");
@@ -9799,19 +10064,19 @@
     class TrendIndicatorView extends html_box_1.HTMLBoxView {
         initialize() {
             super.initialize();
-            this.containerDiv = dom_1.div({ style: "height:100%; width:100%;" });
-            this.titleDiv = dom_1.div({ style: "font-size: 1em; word-wrap: break-word;" });
-            this.valueDiv = dom_1.div({ style: "font-size: 2em" });
-            this.value2Div = dom_1.div({ style: "font-size: 1em; opacity: 0.5; display: inline" });
-            this.changeDiv = dom_1.div({ style: "font-size: 1em; opacity: 0.5; display: inline" });
-            this.textDiv = dom_1.div({}, this.titleDiv, this.valueDiv, dom_1.div({}, this.changeDiv, this.value2Div));
+            this.containerDiv = (0, dom_1.div)({ style: "height:100%; width:100%;" });
+            this.titleDiv = (0, dom_1.div)({ style: "font-size: 1em; word-wrap: break-word;" });
+            this.valueDiv = (0, dom_1.div)({ style: "font-size: 2em" });
+            this.value2Div = (0, dom_1.div)({ style: "font-size: 1em; opacity: 0.5; display: inline" });
+            this.changeDiv = (0, dom_1.div)({ style: "font-size: 1em; opacity: 0.5; display: inline" });
+            this.textDiv = (0, dom_1.div)({}, this.titleDiv, this.valueDiv, (0, dom_1.div)({}, this.changeDiv, this.value2Div));
             this.updateTitle();
             this.updateValue();
             this.updateValue2();
             this.updateValueChange();
             this.updateTextFontSize();
-            this.plotDiv = dom_1.div({});
-            this.containerDiv = dom_1.div({ style: "height:100%; width:100%" }, this.textDiv, this.plotDiv);
+            this.plotDiv = (0, dom_1.div)({});
+            this.containerDiv = (0, dom_1.div)({ style: "height:100%; width:100%" }, this.textDiv, this.plotDiv);
             this.updateLayout();
         }
         connect_signals() {
@@ -9885,7 +10150,7 @@
                 });
                 this.plot.add_glyph(vbar, source);
             }
-            const view = await build_views_1.build_view(this.plot);
+            const view = await (0, build_views_1.build_view)(this.plot);
             this.plotDiv.innerHTML = "";
             view.renderTo(this.plotDiv);
         }
@@ -9963,7 +10228,8 @@
                 this.textDiv.style.flex = "1";
                 this.plotDiv.style.flex = "1";
             }
-            this.invalidate_layout();
+            if (this._has_finished)
+                this.invalidate_layout();
         }
     }
     exports.TrendIndicatorView = TrendIndicatorView;
@@ -9997,14 +10263,17 @@
     TrendIndicator.__module__ = "panel.models.trend";
     TrendIndicator.init_TrendIndicator();
 },
-"4feb5fa522": /* models/vega.js */ function _(require, module, exports, __esModule, __esExport) {
+"04fd346566": /* models/vega.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const types_1 = require("@bokehjs/core/util/types");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     class VegaPlotView extends html_box_1.HTMLBoxView {
         connect_signals() {
             super.connect_signals();
-            this.connect(this.model.properties.data.change, this._plot);
+            const { data, show_actions, theme } = this.model.properties;
+            this.on_change([data, show_actions, theme], () => {
+                this._plot();
+            });
             this.connect(this.model.properties.data_sources.change, () => this._connect_sources());
             this._connected = [];
             this._connect_sources();
@@ -10050,7 +10319,7 @@
                     delete datasets['data'];
                 }
                 if (data.data != null) {
-                    const data_objs = types_1.isArray(data.data) ? data.data : [data.data];
+                    const data_objs = (0, types_1.isArray)(data.data) ? data.data : [data.data];
                     for (const d of data_objs) {
                         if (d.name in datasets) {
                             d['values'] = datasets[d.name];
@@ -10060,7 +10329,8 @@
                 }
                 this.model.data['datasets'] = datasets;
             }
-            window.vegaEmbed(this.el, this.model.data, { actions: false });
+            const config = { actions: this.model.show_actions, theme: this.model.theme };
+            window.vegaEmbed(this.el, this.model.data, config);
         }
     }
     exports.VegaPlotView = VegaPlotView;
@@ -10071,9 +10341,11 @@
         }
         static init_VegaPlot() {
             this.prototype.default_view = VegaPlotView;
-            this.define(({ Any }) => ({
+            this.define(({ Any, Boolean, String }) => ({
                 data: [Any, {}],
                 data_sources: [Any, {}],
+                show_actions: [Boolean, false],
+                theme: [String,]
             }));
         }
     }
@@ -10315,19 +10587,19 @@
 },
 "c51f25e2a7": /* models/vtk/index.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
-    var vtkjs_1 = require("34fc7779c7") /* ./vtkjs */;
+    var vtkjs_1 = require("b6d9199d03") /* ./vtkjs */;
     __esExport("VTKJSPlot", vtkjs_1.VTKJSPlot);
-    var vtkvolume_1 = require("89262e43a1") /* ./vtkvolume */;
+    var vtkvolume_1 = require("7785475bdd") /* ./vtkvolume */;
     __esExport("VTKVolumePlot", vtkvolume_1.VTKVolumePlot);
-    var vtkaxes_1 = require("db7a0079c0") /* ./vtkaxes */;
+    var vtkaxes_1 = require("204e2f98bd") /* ./vtkaxes */;
     __esExport("VTKAxes", vtkaxes_1.VTKAxes);
-    var vtksynchronized_1 = require("4baab0b7ce") /* ./vtksynchronized */;
+    var vtksynchronized_1 = require("0a57062475") /* ./vtksynchronized */;
     __esExport("VTKSynchronizedPlot", vtksynchronized_1.VTKSynchronizedPlot);
 },
-"34fc7779c7": /* models/vtk/vtkjs.js */ function _(require, module, exports, __esModule, __esExport) {
+"b6d9199d03": /* models/vtk/vtkjs.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
-    const vtklayout_1 = require("46fdad9667") /* ./vtklayout */;
-    const util_1 = require("4eb45e35aa") /* ./util */;
+    const vtklayout_1 = require("e13c143c7d") /* ./vtklayout */;
+    const util_1 = require("993f3118b2") /* ./util */;
     class VTKJSPlotView extends vtklayout_1.AbstractVTKView {
         connect_signals() {
             super.connect_signals();
@@ -10362,7 +10634,7 @@
                         renderer: this._vtk_renwin.getRenderer(),
                         dataAccessHelper,
                     });
-                    const fn = util_1.vtk.macro.debounce(() => setTimeout(() => {
+                    const fn = window.vtk.macro.debounce(() => setTimeout(() => {
                         if (this._axes == null && this.model.axes)
                             this._set_axes();
                         this._set_camera_state();
@@ -10389,7 +10661,7 @@
     VTKJSPlot.__name__ = "VTKJSPlot";
     VTKJSPlot.init_VTKJSPlot();
 },
-"46fdad9667": /* models/vtk/vtklayout.js */ function _(require, module, exports, __esModule, __esExport) {
+"e13c143c7d": /* models/vtk/vtklayout.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const dom_1 = require("@bokehjs/core/dom");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
@@ -10397,9 +10669,9 @@
     const color_mapper_1 = require("@bokehjs/models/mappers/color_mapper");
     const kinds_1 = require("@bokehjs/core/kinds");
     const layout_1 = require("4c755983eb") /* ../layout */;
-    const util_1 = require("4eb45e35aa") /* ./util */;
+    const util_1 = require("993f3118b2") /* ./util */;
     const vtkcolorbar_1 = require("c010237f8b") /* ./vtkcolorbar */;
-    const vtkaxes_1 = require("db7a0079c0") /* ./vtkaxes */;
+    const vtkaxes_1 = require("204e2f98bd") /* ./vtkaxes */;
     const INFO_DIV_STYLE = {
         padding: "0px 2px 0px 2px",
         maxHeight: "150px",
@@ -10414,7 +10686,7 @@
         bottom: "0px",
         position: "absolute",
     };
-    const textPositions = kinds_1.Enum("LowerLeft", "LowerRight", "UpperLeft", "UpperRight", "LowerEdge", "RightEdge", "LeftEdge", "UpperEdge");
+    const textPositions = (0, kinds_1.Enum)("LowerLeft", "LowerRight", "UpperLeft", "UpperRight", "LowerEdge", "RightEdge", "LeftEdge", "UpperEdge");
     class AbstractVTKView extends layout_1.PanelHTMLBoxView {
         initialize() {
             super.initialize();
@@ -10433,8 +10705,8 @@
             const expand_width = "350px";
             const collapsed_width = "30px";
             info_div.classList.add('vtk_info');
-            util_1.applyStyle(info_div, INFO_DIV_STYLE);
-            util_1.applyStyle(info_div, { width: expand_width });
+            (0, util_1.applyStyle)(info_div, INFO_DIV_STYLE);
+            (0, util_1.applyStyle)(info_div, { width: expand_width });
             this.el.appendChild(info_div);
             //construct colorbars
             const colorbars = [];
@@ -10444,17 +10716,17 @@
             });
             //content when collapsed
             const dots = document.createElement('div');
-            util_1.applyStyle(dots, { textAlign: "center", fontSize: "20px" });
+            (0, util_1.applyStyle)(dots, { textAlign: "center", fontSize: "20px" });
             dots.innerText = "...";
             info_div.addEventListener('click', () => {
                 if (info_div.style.width === collapsed_width) {
                     info_div.removeChild(dots);
-                    util_1.applyStyle(info_div, { height: "auto", width: expand_width });
+                    (0, util_1.applyStyle)(info_div, { height: "auto", width: expand_width });
                     colorbars.forEach((cb) => info_div.appendChild(cb.canvas));
                 }
                 else {
                     colorbars.forEach((cb) => info_div.removeChild(cb.canvas));
-                    util_1.applyStyle(info_div, { height: collapsed_width, width: collapsed_width });
+                    (0, util_1.applyStyle)(info_div, { height: collapsed_width, width: collapsed_width });
                     info_div.appendChild(dots);
                 }
             });
@@ -10537,7 +10809,6 @@
                     });
                 }
             }
-            console.log(this.model.annotations);
         }
         connect_signals() {
             super.connect_signals();
@@ -10559,10 +10830,10 @@
             if (!this._vtk_renwin || !this._vtk_container) {
                 this._orientationWidget = null;
                 this._axes = null;
-                this._vtk_container = dom_1.div();
+                this._vtk_container = (0, dom_1.div)();
                 this.init_vtk_renwin();
                 this._init_annotations_container();
-                layout_1.set_size(this._vtk_container, this.model);
+                (0, layout_1.set_size)(this._vtk_container, this.model);
                 this.el.appendChild(this._vtk_container);
                 // update camera model state only at the end of the interaction
                 // with the scene (avoid bouncing events and large amount of events)
@@ -10575,7 +10846,7 @@
                 this.model.renderer_el = this._vtk_renwin;
             }
             else {
-                layout_1.set_size(this._vtk_container, this.model);
+                (0, layout_1.set_size)(this._vtk_container, this.model);
                 // warning if _vtk_renwin contain controllers or other elements
                 // we must attach them to the new el
                 this.el.appendChild(this._vtk_container);
@@ -10601,6 +10872,9 @@
         remove() {
             this._unsubscribe_camera_cb();
             window.removeEventListener("resize", this._vtk_renwin.resize);
+            if (this._orientationWidget != null)
+                this._orientationWidget.delete();
+            this._vtk_renwin.getRenderWindow().getInteractor().delete();
             this._vtk_renwin.delete();
             super.remove();
         }
@@ -10608,7 +10882,7 @@
             const vtk_camera = this._vtk_renwin.getRenderer().getActiveCamera();
             let state;
             if (vtk_camera) {
-                state = object_1.clone(vtk_camera.get());
+                state = (0, object_1.clone)(vtk_camera.get());
                 delete state.classHierarchy;
                 delete state.vtkObject;
                 delete state.vtkCamera;
@@ -10622,7 +10896,7 @@
         get _axes_canvas() {
             let axes_canvas = this._vtk_container.querySelector(".axes-canvas");
             if (!axes_canvas) {
-                axes_canvas = dom_1.canvas({
+                axes_canvas = (0, dom_1.canvas)({
                     style: {
                         position: "absolute",
                         top: "0",
@@ -10709,11 +10983,11 @@
                     Math.pow(position[2] - focalPoint[2], 2));
                 camera.setPosition(focalPoint[0] + direction[0] * distance, focalPoint[1] + direction[1] * distance, focalPoint[2] + direction[2] * distance);
                 if (direction[0])
-                    camera.setViewUp(util_1.majorAxis(viewUp, 1, 2));
+                    camera.setViewUp((0, util_1.majorAxis)(viewUp, 1, 2));
                 if (direction[1])
-                    camera.setViewUp(util_1.majorAxis(viewUp, 0, 2));
+                    camera.setViewUp((0, util_1.majorAxis)(viewUp, 0, 2));
                 if (direction[2])
-                    camera.setViewUp(util_1.majorAxis(viewUp, 0, 1));
+                    camera.setViewUp((0, util_1.majorAxis)(viewUp, 0, 1));
                 this._vtk_renwin.getRenderer().resetCameraClippingRange();
                 this._vtk_render();
                 this._get_camera_state();
@@ -10800,6 +11074,7 @@
     AbstractVTKView.__name__ = "AbstractVTKView";
     class AbstractVTKPlot extends html_box_1.HTMLBox {
         constructor(attrs) {
+            (0, util_1.setup_vtkns)();
             super(attrs);
         }
         getActors() {
@@ -10825,7 +11100,7 @@
     AbstractVTKPlot.__module__ = "panel.models.vtk";
     AbstractVTKPlot.init_AbstractVTKPlot();
 },
-"4eb45e35aa": /* models/vtk/util.js */ function _(require, module, exports, __esModule, __esExport) {
+"993f3118b2": /* models/vtk/util.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const array_1 = require("@bokehjs/core/util/array");
     const kinds_1 = require("@bokehjs/core/kinds");
@@ -10839,66 +11114,71 @@
         float32: Float32Array,
         float64: Float64Array,
     };
-    exports.vtk = window.vtk;
     exports.vtkns = {};
-    if (exports.vtk) {
-        exports.vtkns["Actor"] = exports.vtk.Rendering.Core.vtkActor;
-        exports.vtkns["AxesActor"] = exports.vtk.Rendering.Core.vtkAxesActor;
-        exports.vtkns["Base64"] = exports.vtk.Common.Core.vtkBase64;
-        exports.vtkns["BoundingBox"] = exports.vtk.Common.DataModel.vtkBoundingBox;
-        exports.vtkns["Camera"] = exports.vtk.Rendering.Core.vtkCamera;
-        exports.vtkns["ColorTransferFunction"] = exports.vtk.Rendering.Core.vtkColorTransferFunction;
-        exports.vtkns["CubeSource"] = exports.vtk.Filters.Sources.vtkCubeSource;
-        exports.vtkns["DataAccessHelper"] = exports.vtk.IO.Core.DataAccessHelper;
-        exports.vtkns["DataArray"] = exports.vtk.Common.Core.vtkDataArray;
-        exports.vtkns["Follower"] = exports.vtk.Rendering.Core.vtkFollower;
-        exports.vtkns["FullScreenRenderWindow"] = exports.vtk.Rendering.Misc.vtkFullScreenRenderWindow;
-        exports.vtkns["Glyph3DMapper"] = exports.vtk.Rendering.Core.vtkGlyph3DMapper;
-        exports.vtkns["HttpSceneLoader"] = exports.vtk.IO.Core.vtkHttpSceneLoader;
-        exports.vtkns["ImageData"] = exports.vtk.Common.DataModel.vtkImageData;
-        exports.vtkns["ImageMapper"] = exports.vtk.Rendering.Core.vtkImageMapper;
-        exports.vtkns["ImageProperty"] = exports.vtk.Rendering.Core.vtkImageProperty;
-        exports.vtkns["ImageSlice"] = exports.vtk.Rendering.Core.vtkImageSlice;
+    function setup_vtkns() {
+        if (exports.vtkns.Actor != null)
+            return;
+        const vtk = window.vtk;
+        exports.vtkns["Actor"] = vtk.Rendering.Core.vtkActor;
+        exports.vtkns["AxesActor"] = vtk.Rendering.Core.vtkAxesActor;
+        exports.vtkns["Base64"] = vtk.Common.Core.vtkBase64;
+        exports.vtkns["BoundingBox"] = vtk.Common.DataModel.vtkBoundingBox;
+        exports.vtkns["Camera"] = vtk.Rendering.Core.vtkCamera;
+        exports.vtkns["ColorTransferFunction"] = vtk.Rendering.Core.vtkColorTransferFunction;
+        exports.vtkns["CubeSource"] = vtk.Filters.Sources.vtkCubeSource;
+        exports.vtkns["DataAccessHelper"] = vtk.IO.Core.DataAccessHelper;
+        exports.vtkns["DataArray"] = vtk.Common.Core.vtkDataArray;
+        exports.vtkns["Follower"] = vtk.Rendering.Core.vtkFollower;
+        exports.vtkns["FullScreenRenderWindow"] = vtk.Rendering.Misc.vtkFullScreenRenderWindow;
+        exports.vtkns["Glyph3DMapper"] = vtk.Rendering.Core.vtkGlyph3DMapper;
+        exports.vtkns["HttpSceneLoader"] = vtk.IO.Core.vtkHttpSceneLoader;
+        exports.vtkns["ImageData"] = vtk.Common.DataModel.vtkImageData;
+        exports.vtkns["ImageMapper"] = vtk.Rendering.Core.vtkImageMapper;
+        exports.vtkns["ImageProperty"] = vtk.Rendering.Core.vtkImageProperty;
+        exports.vtkns["ImageSlice"] = vtk.Rendering.Core.vtkImageSlice;
         exports.vtkns["InteractiveOrientationWidget"] =
-            exports.vtk.Widgets.Widgets3D.vtkInteractiveOrientationWidget;
+            vtk.Widgets.Widgets3D.vtkInteractiveOrientationWidget;
         exports.vtkns["InteractorStyleTrackballCamera"] =
-            exports.vtk.Interaction.Style.vtkInteractorStyleTrackballCamera;
-        exports.vtkns["Light"] = exports.vtk.Rendering.Core.vtkLight;
-        exports.vtkns["LineSource"] = exports.vtk.Filters.Sources.vtkLineSource;
-        exports.vtkns["LookupTable"] = exports.vtk.Common.Core.vtkLookupTable;
-        exports.vtkns["macro"] = exports.vtk.macro;
-        exports.vtkns["Mapper"] = exports.vtk.Rendering.Core.vtkMapper;
-        exports.vtkns["OpenGLRenderWindow"] = exports.vtk.Rendering.OpenGL.vtkRenderWindow;
+            vtk.Interaction.Style.vtkInteractorStyleTrackballCamera;
+        exports.vtkns["Light"] = vtk.Rendering.Core.vtkLight;
+        exports.vtkns["LineSource"] = vtk.Filters.Sources.vtkLineSource;
+        exports.vtkns["LookupTable"] = vtk.Common.Core.vtkLookupTable;
+        exports.vtkns["macro"] = vtk.macro;
+        exports.vtkns["Mapper"] = vtk.Rendering.Core.vtkMapper;
+        exports.vtkns["OpenGLRenderWindow"] = vtk.Rendering.OpenGL.vtkRenderWindow;
         exports.vtkns["OrientationMarkerWidget"] =
-            exports.vtk.Interaction.Widgets.vtkOrientationMarkerWidget;
-        exports.vtkns["OutlineFilter"] = exports.vtk.Filters.General.vtkOutlineFilter;
-        exports.vtkns["PiecewiseFunction"] = exports.vtk.Common.DataModel.vtkPiecewiseFunction;
+            vtk.Interaction.Widgets.vtkOrientationMarkerWidget;
+        exports.vtkns["OutlineFilter"] = vtk.Filters.General.vtkOutlineFilter;
+        exports.vtkns["PiecewiseFunction"] = vtk.Common.DataModel.vtkPiecewiseFunction;
         exports.vtkns["PixelSpaceCallbackMapper"] =
-            exports.vtk.Rendering.Core.vtkPixelSpaceCallbackMapper;
-        exports.vtkns["PlaneSource"] = exports.vtk.Filters.Sources.vtkPlaneSource;
-        exports.vtkns["PointSource"] = exports.vtk.Filters.Sources.vtkPointSource;
-        exports.vtkns["PolyData"] = exports.vtk.Common.DataModel.vtkPolyData;
-        exports.vtkns["Property"] = exports.vtk.Rendering.Core.vtkProperty;
-        exports.vtkns["Renderer"] = exports.vtk.Rendering.Core.vtkRenderer;
-        exports.vtkns["RenderWindow"] = exports.vtk.Rendering.Core.vtkRenderWindow;
-        exports.vtkns["RenderWindowInteractor"] = exports.vtk.Rendering.Core.vtkRenderWindowInteractor;
-        exports.vtkns["SphereMapper"] = exports.vtk.Rendering.Core.vtkSphereMapper;
+            vtk.Rendering.Core.vtkPixelSpaceCallbackMapper;
+        exports.vtkns["PlaneSource"] = vtk.Filters.Sources.vtkPlaneSource;
+        exports.vtkns["PointSource"] = vtk.Filters.Sources.vtkPointSource;
+        exports.vtkns["PolyData"] = vtk.Common.DataModel.vtkPolyData;
+        exports.vtkns["Property"] = vtk.Rendering.Core.vtkProperty;
+        exports.vtkns["Renderer"] = vtk.Rendering.Core.vtkRenderer;
+        exports.vtkns["RenderWindow"] = vtk.Rendering.Core.vtkRenderWindow;
+        exports.vtkns["RenderWindowInteractor"] = vtk.Rendering.Core.vtkRenderWindowInteractor;
+        exports.vtkns["SphereMapper"] = vtk.Rendering.Core.vtkSphereMapper;
         exports.vtkns["SynchronizableRenderWindow"] =
-            exports.vtk.Rendering.Misc.vtkSynchronizableRenderWindow;
-        exports.vtkns["ThirdParty"] = exports.vtk.ThirdParty;
-        exports.vtkns["Texture"] = exports.vtk.Rendering.Core.vtkTexture;
-        exports.vtkns["Volume"] = exports.vtk.Rendering.Core.vtkVolume;
-        exports.vtkns["VolumeController"] = exports.vtk.Interaction.UI.vtkVolumeController;
-        exports.vtkns["VolumeMapper"] = exports.vtk.Rendering.Core.vtkVolumeMapper;
-        exports.vtkns["VolumeProperty"] = exports.vtk.Rendering.Core.vtkVolumeProperty;
-        exports.vtkns["WidgetManager"] = exports.vtk.Widgets.Core.vtkWidgetManager;
+            vtk.Rendering.Misc.vtkSynchronizableRenderWindow;
+        exports.vtkns["ThirdParty"] = vtk.ThirdParty;
+        exports.vtkns["Texture"] = vtk.Rendering.Core.vtkTexture;
+        exports.vtkns["Volume"] = vtk.Rendering.Core.vtkVolume;
+        exports.vtkns["VolumeController"] = vtk.Interaction.UI.vtkVolumeController;
+        exports.vtkns["VolumeMapper"] = vtk.Rendering.Core.vtkVolumeMapper;
+        exports.vtkns["VolumeProperty"] = vtk.Rendering.Core.vtkVolumeProperty;
+        exports.vtkns["WidgetManager"] = vtk.Widgets.Core.vtkWidgetManager;
         const { vtkObjectManager } = exports.vtkns.SynchronizableRenderWindow;
         vtkObjectManager.setTypeMapping("vtkVolumeMapper", exports.vtkns.VolumeMapper.newInstance, vtkObjectManager.oneTimeGenericUpdater);
         vtkObjectManager.setTypeMapping("vtkSmartVolumeMapper", exports.vtkns.VolumeMapper.newInstance, vtkObjectManager.oneTimeGenericUpdater);
         vtkObjectManager.setTypeMapping("vtkFollower", exports.vtkns.Follower.newInstance, vtkObjectManager.genericUpdater);
         vtkObjectManager.setTypeMapping("vtkOpenGLGlyph3DMapper", exports.vtkns.Glyph3DMapper.newInstance, vtkObjectManager.genericUpdater);
     }
-    exports.Interpolation = kinds_1.Enum("fast_linear", "linear", "nearest");
+    exports.setup_vtkns = setup_vtkns;
+    if (window.vtk)
+        setup_vtkns();
+    exports.Interpolation = (0, kinds_1.Enum)("fast_linear", "linear", "nearest");
     function applyStyle(el, style) {
         Object.keys(style).forEach((key) => {
             el.style[key] = style[key];
@@ -10929,7 +11209,7 @@
         const x = nodes.map((a) => a.x);
         const low = Math.min(...x);
         const high = Math.max(...x);
-        const vals = array_1.linspace(low, high, 255);
+        const vals = (0, array_1.linspace)(low, high, 255);
         const rgb = [0, 0, 0];
         const palette = vals.map((val) => {
             vtk_lut.getColor(val, rgb);
@@ -11004,7 +11284,7 @@
         }
         get values() {
             const { min, max } = this.mapper.metrics;
-            return array_1.linspace(min, max, this.options.ticksNum);
+            return (0, array_1.linspace)(min, max, this.options.ticksNum);
         }
         get ticks() {
             return this.values.map((v) => v.toExponential(3));
@@ -11038,7 +11318,7 @@
             const image_ctx = image.getContext("2d");
             const image_data = image_ctx.getImageData(0, 0, w, h);
             const cmap = new mappers_1.LinearColorMapper({ palette }).rgba_mapper;
-            const buf8 = cmap.v_compute(array_1.range(0, palette.length));
+            const buf8 = cmap.v_compute((0, array_1.range)(0, palette.length));
             image_data.data.set(buf8);
             image_ctx.putImageData(image_data, 0, 0);
             this.ctx.drawImage(image, 0, 2 * (this.font_height + 1) + 1, this.canvas.width, this.canvas.height);
@@ -11050,7 +11330,7 @@
             this.ctx.restore();
             this.ctx.save();
             //ticks
-            const tick_x_positions = array_1.linspace(0, this.canvas.width, 5);
+            const tick_x_positions = (0, array_1.linspace)(0, this.canvas.width, 5);
             tick_x_positions.forEach((xpos, idx) => {
                 let xpos_tick = xpos;
                 if (idx == 0) {
@@ -11075,13 +11355,13 @@
     exports.VTKColorBar = VTKColorBar;
     VTKColorBar.__name__ = "VTKColorBar";
 },
-"db7a0079c0": /* models/vtk/vtkaxes.js */ function _(require, module, exports, __esModule, __esExport) {
+"204e2f98bd": /* models/vtk/vtkaxes.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const p = tslib_1.__importStar(require("@bokehjs/core/properties"));
+    const p = (0, tslib_1.__importStar)(require("@bokehjs/core/properties"));
     const model_1 = require("@bokehjs/model");
     const gl_matrix_1 = require("2f3fd5db07") /* gl-matrix */;
-    const util_1 = require("4eb45e35aa") /* ./util */;
+    const util_1 = require("993f3118b2") /* ./util */;
     class VTKAxes extends model_1.Model {
         constructor(attrs) {
             super(attrs);
@@ -11148,9 +11428,9 @@
         }
         _create_grid_axes() {
             const pts = [];
-            pts.push(util_1.cartesian_product(this.xticks, this.yticks, [this.origin[2]])); //xy
-            pts.push(util_1.cartesian_product([this.origin[0]], this.yticks, this.zticks)); //yz
-            pts.push(util_1.cartesian_product(this.xticks, [this.origin[1]], this.zticks)); //xz
+            pts.push((0, util_1.cartesian_product)(this.xticks, this.yticks, [this.origin[2]])); //xy
+            pts.push((0, util_1.cartesian_product)([this.origin[0]], this.yticks, this.zticks)); //yz
+            pts.push((0, util_1.cartesian_product)(this.xticks, [this.origin[1]], this.zticks)); //xz
             const polys = [];
             let offset = 0;
             polys.push(this._make_grid_lines(this.xticks.length, this.yticks.length, offset)); //xy
@@ -11158,7 +11438,7 @@
             polys.push(this._make_grid_lines(this.yticks.length, this.zticks.length, offset)); //yz
             offset += this.yticks.length * this.zticks.length;
             polys.push(this._make_grid_lines(this.xticks.length, this.zticks.length, offset)); //xz
-            const gridPolyData = util_1.vtk({
+            const gridPolyData = window.vtk({
                 vtkClass: "vtkPolyData",
                 points: {
                     vtkClass: "vtkPoints",
@@ -11187,18 +11467,18 @@
                 let coords = null;
                 switch (axis) {
                     case 0:
-                        coords = util_1.cartesian_product(arr, [this.origin[1]], [this.origin[2]]);
+                        coords = (0, util_1.cartesian_product)(arr, [this.origin[1]], [this.origin[2]]);
                         break;
                     case 1:
-                        coords = util_1.cartesian_product([this.origin[0]], arr, [this.origin[2]]);
+                        coords = (0, util_1.cartesian_product)([this.origin[0]], arr, [this.origin[2]]);
                         break;
                     case 2:
-                        coords = util_1.cartesian_product([this.origin[0]], [this.origin[1]], arr);
+                        coords = (0, util_1.cartesian_product)([this.origin[0]], [this.origin[1]], arr);
                         break;
                 }
                 return coords;
             }).flat(2);
-            const axesPolyData = util_1.vtk({
+            const axesPolyData = window.vtk({
                 vtkClass: "vtkPolyData",
                 points: {
                     vtkClass: "vtkPoints",
@@ -11284,25 +11564,25 @@
 "2f3fd5db07": /* gl-matrix/esm/index.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     exports.glMatrix = glMatrix;
-    const mat2 = tslib_1.__importStar(require("7c0b8e6048") /* ./mat2.js */);
+    const mat2 = (0, tslib_1.__importStar)(require("7c0b8e6048") /* ./mat2.js */);
     exports.mat2 = mat2;
-    const mat2d = tslib_1.__importStar(require("dc03f0a621") /* ./mat2d.js */);
+    const mat2d = (0, tslib_1.__importStar)(require("dc03f0a621") /* ./mat2d.js */);
     exports.mat2d = mat2d;
-    const mat3 = tslib_1.__importStar(require("0285c50a7e") /* ./mat3.js */);
+    const mat3 = (0, tslib_1.__importStar)(require("0285c50a7e") /* ./mat3.js */);
     exports.mat3 = mat3;
-    const mat4 = tslib_1.__importStar(require("a427635f32") /* ./mat4.js */);
+    const mat4 = (0, tslib_1.__importStar)(require("a427635f32") /* ./mat4.js */);
     exports.mat4 = mat4;
-    const quat = tslib_1.__importStar(require("eb06fc032a") /* ./quat.js */);
+    const quat = (0, tslib_1.__importStar)(require("eb06fc032a") /* ./quat.js */);
     exports.quat = quat;
-    const quat2 = tslib_1.__importStar(require("277615c682") /* ./quat2.js */);
+    const quat2 = (0, tslib_1.__importStar)(require("277615c682") /* ./quat2.js */);
     exports.quat2 = quat2;
-    const vec2 = tslib_1.__importStar(require("c56d9ff837") /* ./vec2.js */);
+    const vec2 = (0, tslib_1.__importStar)(require("c56d9ff837") /* ./vec2.js */);
     exports.vec2 = vec2;
-    const vec3 = tslib_1.__importStar(require("2c5eb22089") /* ./vec3.js */);
+    const vec3 = (0, tslib_1.__importStar)(require("2c5eb22089") /* ./vec3.js */);
     exports.vec3 = vec3;
-    const vec4 = tslib_1.__importStar(require("c1aa33d719") /* ./vec4.js */);
+    const vec4 = (0, tslib_1.__importStar)(require("c1aa33d719") /* ./vec4.js */);
     exports.vec4 = vec4;
 },
 "68ca94c15c": /* gl-matrix/esm/common.js */ function _(require, module, exports, __esModule, __esExport) {
@@ -11359,7 +11639,7 @@
 "7c0b8e6048": /* gl-matrix/esm/mat2.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 2x2 Matrix
      * @module mat2
@@ -11765,7 +12045,7 @@
 "dc03f0a621": /* gl-matrix/esm/mat2d.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 2x3 Matrix
      * @module mat2d
@@ -12206,7 +12486,7 @@
 "0285c50a7e": /* gl-matrix/esm/mat3.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 3x3 Matrix
      * @module mat3
@@ -12892,7 +13172,7 @@
 "a427635f32": /* gl-matrix/esm/mat4.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 4x4 Matrix<br>Format: column-major, when typed out it looks like row-major<br>The matrices are being post multiplied.
      * @module mat4
@@ -14554,10 +14834,10 @@
 "eb06fc032a": /* gl-matrix/esm/quat.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
-    const mat3 = tslib_1.__importStar(require("0285c50a7e") /* ./mat3.js */);
-    const vec3 = tslib_1.__importStar(require("2c5eb22089") /* ./vec3.js */);
-    const vec4 = tslib_1.__importStar(require("c1aa33d719") /* ./vec4.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
+    const mat3 = (0, tslib_1.__importStar)(require("0285c50a7e") /* ./mat3.js */);
+    const vec3 = (0, tslib_1.__importStar)(require("2c5eb22089") /* ./vec3.js */);
+    const vec4 = (0, tslib_1.__importStar)(require("c1aa33d719") /* ./vec4.js */);
     /**
      * Quaternion
      * @module quat
@@ -14649,7 +14929,7 @@
      * @return {Number}     Angle, in radians, between the two quaternions
      */
     function getAngle(a, b) {
-        var dotproduct = exports.dot(a, b);
+        var dotproduct = (0, exports.dot)(a, b);
         return Math.acos(2 * dotproduct * dotproduct - 1);
     }
     exports.getAngle = getAngle;
@@ -14793,7 +15073,7 @@
      */
     function pow(out, a, b) {
         ln(out, a);
-        exports.scale(out, out, b);
+        (0, exports.scale)(out, out, b);
         exp(out, out);
         return out;
     }
@@ -15151,7 +15431,7 @@
                 out[1] = tmpvec3[1];
                 out[2] = tmpvec3[2];
                 out[3] = 1 + dot;
-                return exports.normalize(out, out);
+                return (0, exports.normalize)(out, out);
             }
         };
     }();
@@ -15198,14 +15478,14 @@
             matr[2] = -view[0];
             matr[5] = -view[1];
             matr[8] = -view[2];
-            return exports.normalize(out, fromMat3(out, matr));
+            return (0, exports.normalize)(out, fromMat3(out, matr));
         };
     }();
 },
 "2c5eb22089": /* gl-matrix/esm/vec3.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 3 Dimensional Vector
      * @module vec3
@@ -15932,7 +16212,7 @@
 "c1aa33d719": /* gl-matrix/esm/vec4.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 4 Dimensional Vector
      * @module vec4
@@ -16557,9 +16837,9 @@
 "277615c682": /* gl-matrix/esm/quat2.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
-    const quat = tslib_1.__importStar(require("eb06fc032a") /* ./quat.js */);
-    const mat4 = tslib_1.__importStar(require("a427635f32") /* ./mat4.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
+    const quat = (0, tslib_1.__importStar)(require("eb06fc032a") /* ./quat.js */);
+    const mat4 = (0, tslib_1.__importStar)(require("a427635f32") /* ./mat4.js */);
     /**
      * Dual Quaternion<br>
      * Format: [real, dual]<br>
@@ -17126,7 +17406,7 @@
      */
     function lerp(out, a, b, t) {
         var mt = 1 - t;
-        if (exports.dot(a, b) < 0)
+        if ((0, exports.dot)(a, b) < 0)
             t = -t;
         out[0] = a[0] * mt + b[0] * t;
         out[1] = a[1] * mt + b[1] * t;
@@ -17147,7 +17427,7 @@
      * @returns {quat2} out
      */
     function invert(out, a) {
-        var sqlen = exports.squaredLength(a);
+        var sqlen = (0, exports.squaredLength)(a);
         out[0] = -a[0] / sqlen;
         out[1] = -a[1] / sqlen;
         out[2] = -a[2] / sqlen;
@@ -17214,7 +17494,7 @@
      * @function
      */
     function normalize(out, a) {
-        var magnitude = exports.squaredLength(a);
+        var magnitude = (0, exports.squaredLength)(a);
         if (magnitude > 0) {
             magnitude = Math.sqrt(magnitude);
             var a0 = a[0] / magnitude;
@@ -17276,7 +17556,7 @@
 "c56d9ff837": /* gl-matrix/esm/vec2.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const tslib_1 = require("tslib");
-    const glMatrix = tslib_1.__importStar(require("68ca94c15c") /* ./common.js */);
+    const glMatrix = (0, tslib_1.__importStar)(require("68ca94c15c") /* ./common.js */);
     /**
      * 2 Dimensional Vector
      * @module vec2
@@ -17865,15 +18145,15 @@
         };
     }();
 },
-"89262e43a1": /* models/vtk/vtkvolume.js */ function _(require, module, exports, __esModule, __esExport) {
+"7785475bdd": /* models/vtk/vtkvolume.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
-    const vtklayout_1 = require("46fdad9667") /* ./vtklayout */;
-    const util_1 = require("4eb45e35aa") /* ./util */;
+    const vtklayout_1 = require("e13c143c7d") /* ./vtklayout */;
+    const util_1 = require("993f3118b2") /* ./util */;
     class VTKVolumePlotView extends vtklayout_1.AbstractVTKView {
         connect_signals() {
             super.connect_signals();
             this.connect(this.model.properties.data.change, () => {
-                this._vtk_image_data = util_1.data2VTKImageData(this.model.data);
+                this._vtk_image_data = (0, util_1.data2VTKImageData)(this.model.data);
                 this.invalidate_render();
             });
             this.connect(this.model.properties.colormap.change, () => {
@@ -17945,7 +18225,7 @@
             this.connect(this.model.properties.render_background.change, () => {
                 this._vtk_renwin
                     .getRenderer()
-                    .setBackground(...util_1.hexToRGB(this.model.render_background));
+                    .setBackground(...(0, util_1.hexToRGB)(this.model.render_background));
                 this._vtk_renwin.getRenderWindow().render();
             });
             this.connect(this.model.properties.interpolation.change, () => {
@@ -17956,6 +18236,12 @@
                 if (this._controllerWidget != null)
                     this._controllerWidget.setExpanded(this.model.controller_expanded);
             });
+            this.connect(this.model.properties.nan_opacity.change, () => {
+                const scalar_opacity = this.image_actor_i.getProperty().getScalarOpacity();
+                scalar_opacity.get(["nodes"]).nodes[0].y = this.model.nan_opacity;
+                scalar_opacity.modified();
+                this._vtk_renwin.getRenderWindow().render();
+            });
         }
         render() {
             this._vtk_renwin = null;
@@ -17997,13 +18283,13 @@
             this._set_slices_visibility(this.model.display_slices);
             this._vtk_renwin
                 .getRenderer()
-                .setBackground(...util_1.hexToRGB(this.model.render_background));
+                .setBackground(...(0, util_1.hexToRGB)(this.model.render_background));
             this._set_interpolation(this.model.interpolation);
             this._set_camera_state();
         }
         get vtk_image_data() {
             if (!this._vtk_image_data)
-                this._vtk_image_data = util_1.data2VTKImageData(this.model.data);
+                this._vtk_image_data = (0, util_1.data2VTKImageData)(this.model.data);
             return this._vtk_image_data;
         }
         get volume() {
@@ -18086,9 +18372,12 @@
             image_actor_k.setMapper(image_mapper_k);
             // set_color and opacity
             const piecewiseFunction = util_1.vtkns.PiecewiseFunction.newInstance();
-            piecewiseFunction.removeAllPoints();
-            piecewiseFunction.addPoint(0, 1);
             const lookupTable = this.volume.getProperty().getRGBTransferFunction(0);
+            const range = this.volume.getMapper().getInputData().getPointData().getScalars().getRange();
+            piecewiseFunction.removeAllPoints();
+            piecewiseFunction.addPoint(range[0] - 1, this.model.nan_opacity);
+            piecewiseFunction.addPoint(range[0], 1);
+            piecewiseFunction.addPoint(range[1], 1);
             const property = image_actor_i.getProperty();
             image_actor_j.setProperty(property);
             image_actor_k.setProperty(property);
@@ -18109,7 +18398,7 @@
             const dataArray = source.getPointData().getScalars() || source.getPointData().getArrays()[0];
             const dataRange = dataArray.getRange();
             const lookupTable = util_1.vtkns.ColorTransferFunction.newInstance();
-            lookupTable.onModified(() => (this.model.mapper = util_1.vtkLutToMapper(lookupTable)));
+            lookupTable.onModified(() => (this.model.mapper = (0, util_1.vtkLutToMapper)(lookupTable)));
             const piecewiseFunction = util_1.vtkns.PiecewiseFunction.newInstance();
             const sampleDistance = 0.7 *
                 Math.sqrt(source
@@ -18165,10 +18454,9 @@
             }
         }
         _set_slices_visibility(visibility) {
-            this._vtk_renwin
-                .getRenderer()
-                .getActors()
-                .map((actor) => actor.setVisibility(visibility));
+            this.image_actor_i.setVisibility(visibility);
+            this.image_actor_j.setVisibility(visibility);
+            this.image_actor_k.setVisibility(visibility);
         }
         _set_volume_visibility(visibility) {
             this.volume.setVisibility(visibility);
@@ -18192,6 +18480,7 @@
                 edge_gradient: [Number, 0.2],
                 interpolation: [util_1.Interpolation, 'fast_linear'],
                 mapper: [Struct({ palette: Array(String), low: Number, high: Number })],
+                nan_opacity: [Number, 1],
                 render_background: [String, '#52576e'],
                 rescale: [Boolean, false],
                 sampling: [Number, 0.4],
@@ -18209,14 +18498,12 @@
     VTKVolumePlot.__name__ = "VTKVolumePlot";
     VTKVolumePlot.init_VTKVolumePlot();
 },
-"4baab0b7ce": /* models/vtk/vtksynchronized.js */ function _(require, module, exports, __esModule, __esExport) {
+"0a57062475": /* models/vtk/vtksynchronized.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
-    const tslib_1 = require("tslib");
-    const p = tslib_1.__importStar(require("@bokehjs/core/properties"));
     const object_1 = require("@bokehjs/core/util/object");
-    const vtklayout_1 = require("46fdad9667") /* ./vtklayout */;
-    const util_1 = require("4eb45e35aa") /* ./util */;
-    const panel_fullscreen_renwin_sync_1 = require("11e0707a8f") /* ./panel_fullscreen_renwin_sync */;
+    const vtklayout_1 = require("e13c143c7d") /* ./vtklayout */;
+    const panel_fullscreen_renwin_sync_1 = require("877619fe71") /* ./panel_fullscreen_renwin_sync */;
+    const util_1 = require("993f3118b2") /* ./util */;
     const CONTEXT_NAME = "panel";
     class VTKSynchronizedPlotView extends vtklayout_1.AbstractVTKView {
         initialize() {
@@ -18226,15 +18513,6 @@
             this._arrays = {};
             this._decoded_arrays = {};
             this._pending_arrays = {};
-            // Internal closures
-            this.getArray = (hash) => {
-                if (this._arrays[hash]) {
-                    return Promise.resolve(this._arrays[hash]);
-                }
-                return new Promise((resolve, reject) => {
-                    this._pending_arrays[hash] = { resolve, reject };
-                });
-            };
             this.registerArray = (hash, array) => {
                 this._arrays[hash] = array;
                 if (this._pending_arrays[hash]) {
@@ -18254,7 +18532,7 @@
                     this.invalidate_render();
                 }
                 else {
-                    const state = object_1.clone(this.model.scene);
+                    const state = (0, object_1.clone)(this.model.scene);
                     Promise.all(this._promises).then(() => {
                         this._sync_plot(state, () => {
                             this._on_scene_ready();
@@ -18267,7 +18545,7 @@
             });
         }
         init_vtk_renwin() {
-            this._vtk_renwin = panel_fullscreen_renwin_sync_1.FullScreenRenderWindowSynchronized.newInstance({
+            this._vtk_renwin = util_1.vtkns.FullScreenRenderWindowSynchronized.newInstance({
                 rootContainer: this.el,
                 container: this._vtk_container,
                 synchronizerContext: this._synchronizer_context,
@@ -18276,7 +18554,7 @@
         plot() {
             this._vtk_renwin.getRenderWindow().clearOneTimeUpdaters();
             this._decode_arrays();
-            const state = object_1.clone(this.model.scene);
+            const state = (0, object_1.clone)(this.model.scene);
             Promise.all(this._promises).then(() => {
                 this._sync_plot(state, () => this._on_scene_ready()).then(() => {
                     this._set_camera_state();
@@ -18344,6 +18622,7 @@
     class VTKSynchronizedPlot extends vtklayout_1.AbstractVTKPlot {
         constructor(attrs) {
             super(attrs);
+            (0, panel_fullscreen_renwin_sync_1.initialize_fullscreen_render)();
             this.outline = util_1.vtkns.OutlineFilter.newInstance(); //use to display bouding box of a selected actor
             const mapper = util_1.vtkns.Mapper.newInstance();
             mapper.setInputConnection(this.outline.getOutputPort());
@@ -18363,14 +18642,14 @@
         }
         static init_VTKSynchronizedPlot() {
             this.prototype.default_view = VTKSynchronizedPlotView;
-            this.define({
-                arrays: [p.Any, {}],
-                arrays_processed: [p.Array, []],
-                enable_keybindings: [p.Boolean, false],
-                one_time_reset: [p.Boolean],
-                rebuild: [p.Boolean, false],
-                scene: [p.Any, {}],
-            });
+            this.define(({ Any, Array, Boolean, String }) => ({
+                arrays: [Any, {}],
+                arrays_processed: [Array(String), []],
+                enable_keybindings: [Boolean, false],
+                one_time_reset: [Boolean],
+                rebuild: [Boolean, false],
+                scene: [Any, {}],
+            }));
             this.override({
                 height: 300,
                 width: 300,
@@ -18382,108 +18661,111 @@
     VTKSynchronizedPlot.__module__ = "panel.models.vtk";
     VTKSynchronizedPlot.init_VTKSynchronizedPlot();
 },
-"11e0707a8f": /* models/vtk/panel_fullscreen_renwin_sync.js */ function _(require, module, exports, __esModule, __esExport) {
+"877619fe71": /* models/vtk/panel_fullscreen_renwin_sync.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
-    const util_1 = require("4eb45e35aa") /* ./util */;
-    if (util_1.vtk) {
-        const DEFAULT_VALUES = {
-            containerStyle: null,
-            controlPanelStyle: null,
-            listenWindowResize: true,
-            resizeCallback: null,
-            controllerVisibility: true,
-            synchronizerContextName: "default",
-        };
-        const STYLE_CONTROL_PANEL = {
-            position: "absolute",
-            left: "25px",
-            top: "25px",
-            backgroundColor: "white",
-            borderRadius: "5px",
-            listStyle: "none",
-            padding: "5px 10px",
-            margin: "0",
-            display: "block",
-            border: "solid 1px black",
-            maxWidth: "calc(100vw - 70px)",
-            maxHeight: "calc(100vh - 60px)",
-            overflow: "auto",
+    const util_1 = require("993f3118b2") /* ./util */;
+    //------------------------//
+    //Custom Extended Classes
+    //------------------------//
+    const DEFAULT_VALUES = {
+        containerStyle: null,
+        controlPanelStyle: null,
+        listenWindowResize: true,
+        resizeCallback: null,
+        controllerVisibility: true,
+        synchronizerContextName: "default",
+    };
+    const STYLE_CONTROL_PANEL = {
+        position: "absolute",
+        left: "25px",
+        top: "25px",
+        backgroundColor: "white",
+        borderRadius: "5px",
+        listStyle: "none",
+        padding: "5px 10px",
+        margin: "0",
+        display: "block",
+        border: "solid 1px black",
+        maxWidth: "calc(100vw - 70px)",
+        maxHeight: "calc(100vh - 60px)",
+        overflow: "auto",
+    };
+    function panelFullScreenRenderWindowSynchronized(publicAPI, model) {
+        // Panel (modification) synchronizable renderWindow
+        model.renderWindow = util_1.vtkns.SynchronizableRenderWindow.newInstance({
+            synchronizerContext: model.synchronizerContext,
+        });
+        // OpenGlRenderWindow
+        model.openGLRenderWindow = util_1.vtkns.OpenGLRenderWindow.newInstance();
+        model.openGLRenderWindow.setContainer(model.container);
+        model.renderWindow.addView(model.openGLRenderWindow);
+        // Interactor
+        model.interactor = util_1.vtkns.RenderWindowInteractor.newInstance();
+        model.interactor.setInteractorStyle(util_1.vtkns.InteractorStyleTrackballCamera.newInstance());
+        model.interactor.setView(model.openGLRenderWindow);
+        model.interactor.initialize();
+        model.interactor.bindEvents(model.container);
+        publicAPI.getRenderer = () => model.renderWindow.getRenderers()[0];
+        publicAPI.removeController = () => {
+            const el = model.controlContainer;
+            if (el) {
+                el.parentNode.removeChild(el);
+            }
         };
-        function panelFullScreenRenderWindowSynchronized(publicAPI, model) {
-            // Panel (modification) synchronizable renderWindow
-            model.renderWindow = util_1.vtkns.SynchronizableRenderWindow.newInstance({
-                synchronizerContext: model.synchronizerContext,
-            });
-            // OpenGlRenderWindow
-            model.openGLRenderWindow = util_1.vtkns.OpenGLRenderWindow.newInstance();
-            model.openGLRenderWindow.setContainer(model.container);
-            model.renderWindow.addView(model.openGLRenderWindow);
-            // Interactor
-            model.interactor = util_1.vtkns.RenderWindowInteractor.newInstance();
-            model.interactor.setInteractorStyle(util_1.vtkns.InteractorStyleTrackballCamera.newInstance());
-            model.interactor.setView(model.openGLRenderWindow);
-            model.interactor.initialize();
-            model.interactor.bindEvents(model.container);
-            publicAPI.getRenderer = () => model.renderWindow.getRenderers()[0];
-            publicAPI.removeController = () => {
-                const el = model.controlContainer;
-                if (el) {
-                    el.parentNode.removeChild(el);
+        publicAPI.setControllerVisibility = (visible) => {
+            model.controllerVisibility = visible;
+            if (model.controlContainer) {
+                if (visible) {
+                    model.controlContainer.style.display = "block";
                 }
-            };
-            publicAPI.setControllerVisibility = (visible) => {
-                model.controllerVisibility = visible;
-                if (model.controlContainer) {
-                    if (visible) {
-                        model.controlContainer.style.display = "block";
-                    }
-                    else {
-                        model.controlContainer.style.display = "none";
-                    }
+                else {
+                    model.controlContainer.style.display = "none";
                 }
-            };
-            publicAPI.toggleControllerVisibility = () => {
-                publicAPI.setControllerVisibility(!model.controllerVisibility);
-            };
-            publicAPI.addController = (html) => {
-                model.controlContainer = document.createElement("div");
-                util_1.applyStyle(model.controlContainer, model.controlPanelStyle || STYLE_CONTROL_PANEL);
-                model.rootContainer.appendChild(model.controlContainer);
-                model.controlContainer.innerHTML = html;
-                publicAPI.setControllerVisibility(model.controllerVisibility);
-                model.rootContainer.addEventListener("keypress", (e) => {
-                    if (String.fromCharCode(e.charCode) === "c") {
-                        publicAPI.toggleControllerVisibility();
-                    }
-                });
-            };
-            // Properly release GL context
-            publicAPI.delete = util_1.vtk.macro.chain(publicAPI.setContainer, model.openGLRenderWindow.delete, publicAPI.delete);
-            // Handle window resize
-            publicAPI.resize = () => {
-                const dims = model.container.getBoundingClientRect();
-                const devicePixelRatio = window.devicePixelRatio || 1;
-                model.openGLRenderWindow.setSize(Math.floor(dims.width * devicePixelRatio), Math.floor(dims.height * devicePixelRatio));
-                if (model.resizeCallback) {
-                    model.resizeCallback(dims);
-                }
-                model.renderWindow.render();
-            };
-            publicAPI.setResizeCallback = (cb) => {
-                model.resizeCallback = cb;
-                publicAPI.resize();
-            };
-            if (model.listenWindowResize) {
-                window.addEventListener("resize", publicAPI.resize);
             }
+        };
+        publicAPI.toggleControllerVisibility = () => {
+            publicAPI.setControllerVisibility(!model.controllerVisibility);
+        };
+        publicAPI.addController = (html) => {
+            model.controlContainer = document.createElement("div");
+            (0, util_1.applyStyle)(model.controlContainer, model.controlPanelStyle || STYLE_CONTROL_PANEL);
+            model.rootContainer.appendChild(model.controlContainer);
+            model.controlContainer.innerHTML = html;
+            publicAPI.setControllerVisibility(model.controllerVisibility);
+            model.rootContainer.addEventListener("keypress", (e) => {
+                if (String.fromCharCode(e.charCode) === "c") {
+                    publicAPI.toggleControllerVisibility();
+                }
+            });
+        };
+        // Properly release GL context
+        publicAPI.delete = window.vtk.macro.chain(publicAPI.setContainer, model.openGLRenderWindow.delete, publicAPI.delete);
+        // Handle window resize
+        publicAPI.resize = () => {
+            const dims = model.container.getBoundingClientRect();
+            const devicePixelRatio = window.devicePixelRatio || 1;
+            model.openGLRenderWindow.setSize(Math.floor(dims.width * devicePixelRatio), Math.floor(dims.height * devicePixelRatio));
+            if (model.resizeCallback) {
+                model.resizeCallback(dims);
+            }
+            model.renderWindow.render();
+        };
+        publicAPI.setResizeCallback = (cb) => {
+            model.resizeCallback = cb;
             publicAPI.resize();
+        };
+        if (model.listenWindowResize) {
+            window.addEventListener("resize", publicAPI.resize);
         }
-        exports.FullScreenRenderWindowSynchronized = {
-            newInstance: util_1.vtk.macro.newInstance((publicAPI, model, initialValues = {}) => {
+        publicAPI.resize();
+    }
+    function initialize_fullscreen_render() {
+        let FullScreenRenderWindowSynchronized = {
+            newInstance: window.vtk.macro.newInstance((publicAPI, model, initialValues = {}) => {
                 Object.assign(model, DEFAULT_VALUES, initialValues);
                 // Object methods
-                util_1.vtk.macro.obj(publicAPI, model);
-                util_1.vtk.macro.get(publicAPI, model, [
+                window.vtk.macro.obj(publicAPI, model);
+                window.vtk.macro.get(publicAPI, model, [
                     "renderWindow",
                     "openGLRenderWindow",
                     "interactor",
@@ -18496,7 +18778,9 @@
                 panelFullScreenRenderWindowSynchronized(publicAPI, model);
             }),
         };
+        util_1.vtkns.FullScreenRenderWindowSynchronized = FullScreenRenderWindowSynchronized;
     }
+    exports.initialize_fullscreen_render = initialize_fullscreen_render;
 },
-}, "4e90918c0a", {"index":"4e90918c0a","models/index":"7898617fc4","models/ace":"be520eff91","models/layout":"4c755983eb","models/audio":"339f84d639","models/card":"c816112d20","models/comm_manager":"e552778259","models/tabulator":"32011d40fa","models/data":"f1971f81bf","models/datetime_picker":"6e11b2cfe2","models/deckgl":"df2378664f","models/tooltips":"6e04fbe567","models/echarts":"9d046c4720","models/html":"2839081043","models/event-to-object":"3329d4aa5b","models/idom":"7d45bd3bc4","models/ipywidget":"0eae77d68f","models/json":"0d30bea0c8","models/file_download":"1767172ffa","models/katex":"7b859fb3cf","models/location":"642aa56b24","models/mathjax":"0c21036737","models/perspective":"84a772681d","models/player":"2e8044c920","models/plotly":"c23bb1717d","models/util":"990b5dd5c7","models/progress":"9f787650b9","models/reactive_html":"d536149aaa","models/singleselect":"3b85956787","models/speech_to_text":"aaa48703af","models/state":"bfa46a5f19","models/terminal":"91fe88c277","models/text_to_speech":"33cd2c254e","models/trend":"ded3463d6c","models/vega":"4feb5fa522","models/video":"ffe54b53c3","models/videostream":"e3e9b8e495","models/vtk/index":"c51f25e2a7","models/vtk/vtkjs":"34fc7779c7","models/vtk/vtklayout":"46fdad9667","models/vtk/util":"4eb45e35aa","models/vtk/vtkcolorbar":"c010237f8b","models/vtk/vtkaxes":"db7a0079c0","models/vtk/vtkvolume":"89262e43a1","models/vtk/vtksynchronized":"4baab0b7ce","models/vtk/panel_fullscreen_renwin_sync":"11e0707a8f"}, {});});
+}, "4e90918c0a", {"index":"4e90918c0a","models/index":"1abe9b6912","models/ace":"9fecc8d0f9","models/layout":"4c755983eb","models/audio":"339f84d639","models/card":"c816112d20","models/comm_manager":"e552778259","models/tabulator":"8e41f17634","models/data":"f1971f81bf","models/datetime_picker":"6e11b2cfe2","models/deckgl":"df2378664f","models/tooltips":"6e04fbe567","models/echarts":"9d046c4720","models/html":"c424a3bd17","models/event-to-object":"3329d4aa5b","models/idom":"7d45bd3bc4","models/ipywidget":"0eae77d68f","models/json":"0d30bea0c8","models/file_download":"1767172ffa","models/katex":"7b859fb3cf","models/location":"642aa56b24","models/mathjax":"0c21036737","models/perspective":"84a772681d","models/player":"2e8044c920","models/plotly":"a2080c6bc8","models/util":"990b5dd5c7","models/progress":"fd3806082d","models/quill":"6895629dfc","models/reactive_html":"eb3a49319b","models/singleselect":"5ed2116e26","models/speech_to_text":"aaa48703af","models/state":"bfa46a5f19","models/terminal":"edf66f5228","models/text_to_speech":"33cd2c254e","models/trend":"effe070807","models/vega":"04fd346566","models/video":"ffe54b53c3","models/videostream":"e3e9b8e495","models/vtk/index":"c51f25e2a7","models/vtk/vtkjs":"b6d9199d03","models/vtk/vtklayout":"e13c143c7d","models/vtk/util":"993f3118b2","models/vtk/vtkcolorbar":"c010237f8b","models/vtk/vtkaxes":"204e2f98bd","models/vtk/vtkvolume":"7785475bdd","models/vtk/vtksynchronized":"0a57062475","models/vtk/panel_fullscreen_renwin_sync":"877619fe71"}, {});});
 //# sourceMappingURL=panel.js.map