@holoviz/panel 0.13.1 → 0.14.0-a.1

package/dist/panel.js

@@ -62,7 +62,7 @@
     __esExport("CommManager", comm_manager_1.CommManager);
     var customselect_1 = require("e258e515be") /* ./customselect */;
     __esExport("CustomSelect", customselect_1.CustomSelect);
-    var tabulator_1 = require("6e8a14b34f") /* ./tabulator */;
+    var tabulator_1 = require("5e94fc93b9") /* ./tabulator */;
     __esExport("DataTabulator", tabulator_1.DataTabulator);
     var datetime_picker_1 = require("6e11b2cfe2") /* ./datetime_picker */;
     __esExport("DatetimePicker", datetime_picker_1.DatetimePicker);
@@ -126,7 +126,7 @@
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const dom_1 = require("@bokehjs/core/dom");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     function ID() {
         // Math.random should be unique because of its seeding algorithm.
         // Convert it to base 36 (numbers + letters), and grab the first 9 characters
@@ -239,11 +239,12 @@
     AcePlot.__module__ = "panel.models.ace";
     AcePlot.init_AcePlot();
 },
-"4c755983eb": /* models/layout.js */ function _(require, module, exports, __esModule, __esExport) {
+"80a6464b1f": /* models/layout.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
+    const dom_1 = require("@bokehjs/core/dom");
+    const color_1 = require("@bokehjs/core/util/color");
     const html_1 = require("@bokehjs/core/layout/html");
     const types_1 = require("@bokehjs/core/layout/types");
-    const dom_1 = require("@bokehjs/core/dom");
     const markup_1 = require("@bokehjs/models/widgets/markup");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     function set_size(el, model) {
@@ -348,6 +349,46 @@
     exports.PanelMarkupView = PanelMarkupView;
     PanelMarkupView.__name__ = "PanelMarkupView";
     class PanelHTMLBoxView extends html_box_1.HTMLBoxView {
+        connect_signals() {
+            super.connect_signals();
+            // Note due to on_change hack properties must be defined in this order.
+            const { css_classes, background } = this.model.properties;
+            this._prev_css_classes = this.model.css_classes;
+            this.on_change([css_classes, background], () => {
+                // Note: This ensures that changes in the background and changes
+                // to the loading parameter in Panel do NOT trigger a full re-render
+                const css = [];
+                let skip = false;
+                for (const cls of this.model.css_classes) {
+                    if (cls === 'pn-loading')
+                        skip = true;
+                    else if (skip)
+                        skip = false;
+                    else
+                        css.push(cls);
+                }
+                const prev = this._prev_css_classes;
+                if (JSON.stringify(css) === JSON.stringify(prev)) {
+                    const { background } = this.model;
+                    this.el.style.backgroundColor = background != null ? (0, color_1.color2css)(background) : "";
+                    (0, dom_1.classes)(this.el).clear().add(...this.css_classes());
+                }
+                else {
+                    this.invalidate_render();
+                }
+                this._prev_css_classes = css;
+            });
+        }
+        on_change(properties, fn) {
+            // HACKALERT: LayoutDOMView triggers re-renders whenever css_classes change
+            // which is very expensive so we do not connect this signal and handle it
+            // ourself
+            const p = this.model.properties;
+            if (properties.length === 2 && properties[0] === p.background && properties[1] === p.css_classes) {
+                return;
+            }
+            super.on_change(properties, fn);
+        }
         _update_layout() {
             let changed = ((this._prev_sizing_mode !== undefined) &&
                 (this._prev_sizing_mode !== this.model.sizing_mode));
@@ -366,7 +407,7 @@
 "33955cfa6f": /* models/audio.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class AudioView extends layout_1.PanelHTMLBoxView {
         initialize() {
             super.initialize();
@@ -780,7 +821,7 @@
         });
     })();
 },
-"6e8a14b34f": /* models/tabulator.js */ function _(require, module, exports, __esModule, __esExport) {
+"5e94fc93b9": /* models/tabulator.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const dom_1 = require("@bokehjs/core/dom");
     const types_1 = require("@bokehjs/core/util/types");
@@ -794,7 +835,7 @@
     const debounce_1 = require("99a25e6992") /* debounce */;
     const comm_manager_1 = require("f34032fb47") /* ./comm_manager */;
     const data_1 = require("7f7d9e0c6b") /* ./data */;
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class TableEditEvent extends bokeh_events_1.ModelEvent {
         constructor(column, row) {
             super();
@@ -993,34 +1034,35 @@
         }
         connect_signals() {
             super.connect_signals();
-            const { configuration, layout, columns, theme, groupby } = this.model.properties;
+            const p = this.model.properties;
+            const { configuration, layout, columns, theme, groupby } = p;
             this.on_change([configuration, layout, columns, groupby], (0, debounce_1.debounce)(() => this.invalidate_render(), 20, false));
             this.on_change([theme], () => this.setCSS());
-            this.connect(this.model.properties.download.change, () => {
+            this.connect(p.download.change, () => {
                 const ftype = this.model.filename.endsWith('.json') ? "json" : "csv";
                 this.tabulator.download(ftype, this.model.filename);
             });
-            this.connect(this.model.properties.children.change, () => this.renderChildren());
-            this.connect(this.model.properties.expanded.change, () => {
+            this.connect(p.children.change, () => this.renderChildren());
+            this.connect(p.expanded.change, () => {
                 for (const row of this.tabulator.rowManager.getRows()) {
                     if (row.cells.length > 0)
                         row.cells[0].layoutElement();
                 }
             });
-            this.connect(this.model.properties.styles.change, () => {
+            this.connect(p.styles.change, () => {
                 if (this._applied_styles)
                     this.tabulator.redraw(true);
                 this.setStyles();
             });
-            this.connect(this.model.properties.hidden_columns.change, () => this.setHidden());
-            this.connect(this.model.properties.page_size.change, () => this.setPageSize());
-            this.connect(this.model.properties.page.change, () => {
+            this.connect(p.hidden_columns.change, () => this.setHidden());
+            this.connect(p.page_size.change, () => this.setPageSize());
+            this.connect(p.page.change, () => {
                 if (!this._updating_page)
                     this.setPage();
             });
-            this.connect(this.model.properties.max_page.change, () => this.setMaxPage());
-            this.connect(this.model.properties.frozen_rows.change, () => this.setFrozen());
-            this.connect(this.model.properties.sorters.change, () => this.setSorters());
+            this.connect(p.max_page.change, () => this.setMaxPage());
+            this.connect(p.frozen_rows.change, () => this.setFrozen());
+            this.connect(p.sorters.change, () => this.setSorters());
             this.connect(this.model.source.properties.data.change, () => this.setData());
             this.connect(this.model.source.streaming, () => this.addData());
             this.connect(this.model.source.patching, () => {
@@ -4742,7 +4784,7 @@
     const column_data_source_1 = require("@bokehjs/models/sources/column_data_source");
     const debounce_1 = require("99a25e6992") /* debounce */;
     const data_1 = require("7f7d9e0c6b") /* ./data */;
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const tooltips_1 = require("6e04fbe567") /* ./tooltips */;
     const constants_1 = (0, tslib_1.__importDefault)(require("093eb75864") /* @luma.gl/constants */);
     function extractClasses() {
@@ -5914,7 +5956,7 @@
     __esModule();
     const markup_1 = require("@bokehjs/models/widgets/markup");
     const bokeh_events_1 = require("@bokehjs/core/bokeh_events");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const event_to_object_1 = require("c4ee233e58") /* ./event-to-object */;
     class DOMEvent extends bokeh_events_1.ModelEvent {
         constructor(node, data) {
@@ -6285,7 +6327,7 @@
     const preact_2 = require("b3f51db71c") /* htm/preact */;
     const fast_json_patch_1 = require("cbecfde9cd") /* fast-json-patch */;
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const event_to_object_1 = require("c4ee233e58") /* ./event-to-object */;
     const LayoutConfigContext = (0, preact_1.createContext)({});
     function mountLayout(mountElement, saveUpdateHook, sendEvent, importSourceUrl) {
@@ -7757,7 +7799,7 @@
 "0eae77d68f": /* models/ipywidget.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const Jupyter = window.Jupyter;
     class IPyWidgetView extends layout_1.PanelHTMLBoxView {
         constructor() {
@@ -7828,7 +7870,7 @@
     const kinds_1 = require("@bokehjs/core/kinds");
     const markup_1 = require("@bokehjs/models/widgets/markup");
     const json_formatter_js_1 = (0, tslib_1.__importDefault)(require("18bba7b7e1") /* json-formatter-js */);
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class JSONView extends layout_1.PanelMarkupView {
         connect_signals() {
             super.connect_signals();
@@ -7967,7 +8009,7 @@
     __esModule();
     const bokeh_events_1 = require("@bokehjs/core/bokeh_events");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class JSONEditEvent extends bokeh_events_1.ModelEvent {
         constructor(data) {
             super();
@@ -8247,7 +8289,7 @@
 "7b859fb3cf": /* models/katex.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const markup_1 = require("@bokehjs/models/widgets/markup");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class KaTeXView extends layout_1.PanelMarkupView {
         render() {
             super.render();
@@ -8356,7 +8398,7 @@
 "0c21036737": /* models/mathjax.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const markup_1 = require("@bokehjs/models/widgets/markup");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class MathJaxView extends layout_1.PanelMarkupView {
         initialize() {
             super.initialize();
@@ -8394,7 +8436,7 @@
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
     const dom_1 = require("@bokehjs/core/dom");
     const column_data_source_1 = require("@bokehjs/models/sources/column_data_source");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const THEMES = {
         'material-dark': 'Material Dark',
         'material': 'Material Light',
@@ -8961,7 +9003,7 @@
     const column_data_source_1 = require("@bokehjs/models/sources/column_data_source");
     const debounce_1 = require("99a25e6992") /* debounce */;
     const util_1 = require("990b5dd5c7") /* ./util */;
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     const filterEventData = (gd, eventData, event) => {
         // Ported from dash-core-components/src/components/Graph.react.js
         let filteredEventData = Array.isArray(eventData) ? [] : {};
@@ -9365,7 +9407,7 @@
 "979633320f": /* models/progress.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class ProgressView extends html_box_1.HTMLBoxView {
         connect_signals() {
             super.connect_signals();
@@ -9450,7 +9492,7 @@
     __esModule();
     const dom_1 = require("@bokehjs/core/dom");
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class QuillInputView extends layout_1.PanelHTMLBoxView {
         initialize() {
             super.initialize();
@@ -9555,7 +9597,7 @@
     const data_1 = require("7f7d9e0c6b") /* ./data */;
     const event_to_object_1 = require("c4ee233e58") /* ./event-to-object */;
     const html_1 = require("c424a3bd17") /* ./html */;
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     function serialize_attrs(attrs) {
         const serialized = {};
         for (const attr in attrs) {
@@ -10674,7 +10716,7 @@
     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 */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class KeystrokeEvent extends bokeh_events_1.ModelEvent {
         constructor(key) {
             super();
@@ -11292,7 +11334,7 @@
 "1b46fd56a8": /* models/video.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class VideoView extends layout_1.PanelHTMLBoxView {
         initialize() {
             super.initialize();
@@ -11423,7 +11465,7 @@
 "e3e9b8e495": /* models/videostream.js */ function _(require, module, exports, __esModule, __esExport) {
     __esModule();
     const html_box_1 = require("@bokehjs/models/layouts/html_box");
-    const layout_1 = require("4c755983eb") /* ./layout */;
+    const layout_1 = require("80a6464b1f") /* ./layout */;
     class VideoStreamView extends layout_1.PanelHTMLBoxView {
         constructor() {
             super(...arguments);
@@ -11615,7 +11657,7 @@
     const object_1 = require("@bokehjs/core/util/object");
     const color_mapper_1 = require("@bokehjs/models/mappers/color_mapper");
     const kinds_1 = require("@bokehjs/core/kinds");
-    const layout_1 = require("4c755983eb") /* ../layout */;
+    const layout_1 = require("80a6464b1f") /* ../layout */;
     const util_1 = require("993f3118b2") /* ./util */;
     const vtkcolorbar_1 = require("c010237f8b") /* ./vtkcolorbar */;
     const vtkaxes_1 = require("ab478186ba") /* ./vtkaxes */;
@@ -19727,5 +19769,5 @@
     }
     exports.initialize_fullscreen_render = initialize_fullscreen_render;
 },
-}, "4e90918c0a", {"index":"4e90918c0a","models/index":"eed113197d","models/ace":"2e12ebdb23","models/layout":"4c755983eb","models/audio":"33955cfa6f","models/card":"0972f6e77b","models/comm_manager":"f34032fb47","models/customselect":"e258e515be","models/tabulator":"6e8a14b34f","models/data":"7f7d9e0c6b","models/datetime_picker":"6e11b2cfe2","models/deckgl":"0155f7af4d","models/tooltips":"6e04fbe567","models/echarts":"9d046c4720","models/html":"c424a3bd17","models/event-to-object":"c4ee233e58","models/idom":"7d45bd3bc4","models/ipywidget":"0eae77d68f","models/json":"0d30bea0c8","models/json_editor":"be9f51fc39","models/file_download":"1767172ffa","models/katex":"7b859fb3cf","models/location":"0c52a301f3","models/mathjax":"0c21036737","models/perspective":"4ae96bd77b","models/player":"27b8bb6d20","models/plotly":"42de27e56c","models/util":"990b5dd5c7","models/progress":"979633320f","models/quill":"d51a79a0a3","models/reactive_html":"5fad190ca1","models/singleselect":"ab54efe08a","models/speech_to_text":"a96be0bcc9","models/state":"bfa46a5f19","models/tabs":"f693d9aa84","models/terminal":"3ea011fa55","models/text_to_speech":"33cd2c254e","models/trend":"effe070807","models/vega":"fea356270f","models/video":"1b46fd56a8","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":"ab478186ba","models/vtk/vtkvolume":"7785475bdd","models/vtk/vtksynchronized":"0a57062475","models/vtk/panel_fullscreen_renwin_sync":"877619fe71"}, {});});
+}, "4e90918c0a", {"index":"4e90918c0a","models/index":"eed113197d","models/ace":"2e12ebdb23","models/layout":"80a6464b1f","models/audio":"33955cfa6f","models/card":"0972f6e77b","models/comm_manager":"f34032fb47","models/customselect":"e258e515be","models/tabulator":"5e94fc93b9","models/data":"7f7d9e0c6b","models/datetime_picker":"6e11b2cfe2","models/deckgl":"0155f7af4d","models/tooltips":"6e04fbe567","models/echarts":"9d046c4720","models/html":"c424a3bd17","models/event-to-object":"c4ee233e58","models/idom":"7d45bd3bc4","models/ipywidget":"0eae77d68f","models/json":"0d30bea0c8","models/json_editor":"be9f51fc39","models/file_download":"1767172ffa","models/katex":"7b859fb3cf","models/location":"0c52a301f3","models/mathjax":"0c21036737","models/perspective":"4ae96bd77b","models/player":"27b8bb6d20","models/plotly":"42de27e56c","models/util":"990b5dd5c7","models/progress":"979633320f","models/quill":"d51a79a0a3","models/reactive_html":"5fad190ca1","models/singleselect":"ab54efe08a","models/speech_to_text":"a96be0bcc9","models/state":"bfa46a5f19","models/tabs":"f693d9aa84","models/terminal":"3ea011fa55","models/text_to_speech":"33cd2c254e","models/trend":"effe070807","models/vega":"fea356270f","models/video":"1b46fd56a8","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":"ab478186ba","models/vtk/vtkvolume":"7785475bdd","models/vtk/vtksynchronized":"0a57062475","models/vtk/panel_fullscreen_renwin_sync":"877619fe71"}, {});});
 //# sourceMappingURL=panel.js.map