Fix issues with nullable properties in Bokeh 2.3

panel/layout/tabs.py

@@ -151,7 +151,7 @@ def _get_objects(self, model, old_objects, doc, root, comm=None):
                 continue
             elif self.dynamic and i != self.active:
                 child = BkSpacer(**{k: v for k, v in pane.param.get_param_values()
-                                    if k in Layoutable.param})
+                                    if k in Layoutable.param and v is not None})
             else:
                 try:
                     child = pane._get_model(doc, root, model, comm)

panel/models/ace.ts

@@ -135,15 +135,15 @@ export class AcePlot extends HTMLBox {
   static init_AcePlot(): void {
     this.prototype.default_view = AcePlotView
 
-    this.define<AcePlot.Props>({
-      code:         [ p.String            ],
-      filename:     [ p.String            ],
-      language:     [ p.String            ],
-      theme:        [ p.String,  'chrome' ],
-      annotations:  [ p.Array,   []       ],
-      readonly:     [ p.Boolean, false    ],
-      print_margin: [ p.Boolean, false    ]
-    })
+    this.define<AcePlot.Props>(({Any, Array, Boolean, String}) => ({
+      code:         [ String,       '' ],
+      filename:     [ String           ],
+      language:     [ String           ],
+      theme:        [ String, 'chrome' ],
+      annotations:  [ Array(Any),   [] ],
+      readonly:     [ Boolean,   false ],
+      print_margin: [ Boolean,   false ]
+    }))
 
     this.override<AcePlot.Props>({
       height: 300,

panel/models/audio.ts

@@ -130,13 +130,13 @@ export class Audio extends HTMLBox {
   static init_Audio(): void {
     this.prototype.default_view = AudioView
 
-    this.define<Audio.Props>({
-      loop:     [ p.Boolean,   false ],
-      paused:   [ p.Boolean,   true  ],
-      time:     [ p.Number, 0     ],
-      throttle: [ p.Number, 250   ],
-      value:    [ p.Any,    ''    ],
-      volume:   [ p.Number, null  ],
-    })
+    this.define<Audio.Props>(({Any, Boolean, Int, Number}) => ({
+      loop:     [ Boolean, false ],
+      paused:   [ Boolean,  true ],
+      time:     [ Number,      0 ],
+      throttle: [ Number,    250 ],
+      value:    [ Any,        '' ],
+      volume:   [ Int            ],
+    }))
   }
 }

panel/models/card.ts

@@ -130,16 +130,16 @@ export class Card extends Column {
   static init_Card(): void {
     this.prototype.default_view = CardView
 
-    this.define<Card.Props>({
-      active_header_background:  [ p.String,  null  ],
-      button_css_classes: [ p.Array,   []    ],
-      collapsed:          [ p.Boolean, true  ],
-      collapsible:        [ p.Boolean, true  ],
-      header_background:  [ p.String,  null  ],
-      header_color:       [ p.String,  null  ],
-      header_css_classes: [ p.Array,   []    ],
-      header_tag:         [ p.String,  "div" ],
-      tag:                [ p.String,  "div" ],
-    })
+    this.define<Card.Props>(({Array, Boolean, Nullable, String}) => ({
+      active_header_background: [ Nullable(String), null ],
+      button_css_classes:       [ Array(String),      [] ],
+      collapsed:                [ Boolean,          true ],
+      collapsible:              [ Boolean,          true ],
+      header_background:        [ Nullable(String), null ],
+      header_color:             [ Nullable(String), null ],
+      header_css_classes:       [ Array(String),      [] ],
+      header_tag:               [ String,          "div" ],
+      tag:                      [ String,          "div" ],
+    }))
   }
 }

panel/models/comm_manager.ts

@@ -135,12 +135,12 @@ export class CommManager extends Model {
   static init_CommManager(): void {
     this.prototype.default_view = CommManagerView
 
-    this.define<CommManager.Props>({
-      plot_id: [ p.String, null ],
-      comm_id: [ p.String, null ],
-      client_comm_id: [ p.String, null],
-      timeout: [ p.Number, 5000 ],
-      debounce: [ p.Number, 50],
-    })
+    this.define<CommManager.Props>(({Int, String}) => ({
+      plot_id:        [ String    ],
+      comm_id:        [ String    ],
+      client_comm_id: [ String    ],
+      timeout:        [ Int, 5000 ],
+      debounce:       [ Int,   50 ],
+    }))
   }
 }

panel/models/deckgl.ts

@@ -1,6 +1,7 @@
 import {div} from "@bokehjs/core/dom"
 import * as p from "@bokehjs/core/properties"
 import {HTMLBox} from "@bokehjs/models/layouts/html_box"
+import {ColumnDataSource} from "@bokehjs/models/sources/column_data_source"
 
 import {transform_cds_to_records} from "./data"
 import {PanelHTMLBoxView, set_size} from "./layout"
@@ -190,7 +191,7 @@ export namespace DeckGLPlot {
   export type Attrs = p.AttrsOf<Props>
   export type Props = HTMLBox.Props & {
     data: p.Property<any>
-    data_sources: p.Property<any[]>
+    data_sources: p.Property<ColumnDataSource[]>
     initialViewState: p.Property<any>
     layers: p.Property<any[]>
     mapbox_api_key: p.Property<string>
@@ -215,17 +216,17 @@ export class DeckGLPlot extends HTMLBox {
   static init_DeckGLPlot(): void {
     this.prototype.default_view = DeckGLPlotView;      
 
-    this.define<DeckGLPlot.Props>({
-      data: [p.Any],
-      data_sources: [ p.Array, [] ],
-      clickState: [ p.Any ],
-      hoverState: [ p.Any ],
-      initialViewState: [p.Any],
-      layers: [ p.Array, [] ],
-      mapbox_api_key: [p.String],
-      tooltip: [ p.Any ],
-      viewState: [ p.Any ],
-    })
+    this.define<DeckGLPlot.Props>(({Any, Array, String, Ref}) => ({
+      data:             [ Any                              ],
+      data_sources:     [ Array(Ref(ColumnDataSource)), [] ],
+      clickState:       [ Any,                          {} ],
+      hoverState:       [ Any,                          {} ],
+      initialViewState: [ Any,                          {} ],
+      layers:           [ Array(Any),                   [] ],
+      mapbox_api_key:   [ String,                       '' ],
+      tooltip:          [ Any,                          {} ],
+      viewState:        [ Any,                          {} ],
+    }))
 
     this.override<DeckGLPlot.Props>({
       height: 400,

panel/models/echarts.ts

@@ -61,10 +61,10 @@ export class ECharts extends HTMLBox {
   static init_ECharts(): void {
     this.prototype.default_view = EChartsView
 
-    this.define<ECharts.Props>({
-      data:  [ p.Any               ],
-      theme: [ p.String, "default" ],
-      renderer: [ p.String, "canvas"]
-    })
+    this.define<ECharts.Props>(({Any, String}) => ({
+      data:     [ Any,           {} ],
+      theme:    [ String, "default" ],
+      renderer: [ String,  "canvas" ]
+    }))
   }
 }

panel/models/file_download.ts

@@ -217,15 +217,15 @@ export class FileDownload extends InputWidget {
   static init_FileDownload(): void {
     this.prototype.default_view = FileDownloadView
 
-    this.define<FileDownload.Props>({
-      auto:         [ p.Boolean,        false ],
-      clicks:       [ p.Number,         0     ],
-      data:         [ p.NullString,     null  ],
-      label:        [ p.String,   "Download"  ],
-      filename:     [ p.String,         null  ],
-      button_type:  [ p.ButtonType, "default" ], // TODO (bev)
-      _transfers:   [ p.Number,          0    ],
-    })
+    this.define<FileDownload.Props>(({Boolean, Int, Nullable, String}) => ({
+      auto:         [ Boolean,          false ],
+      clicks:       [ Int,                  0 ],
+      data:         [ Nullable(String),  null ],
+      label:        [ String,      "Download" ],
+      filename:     [ Nullable(String),  null ],
+      button_type:  [ ButtonType,   "default" ], // TODO (bev)
+      _transfers:   [ Int,                  0 ],
+    }))
 
     this.override<FileDownload.Props>({
       title: "",

panel/models/ipywidget.ts

@@ -74,8 +74,8 @@ export class IPyWidget extends HTMLBox {
   static init_IPyWidget(): void {
     this.prototype.default_view = IPyWidgetView
 
-    this.define<IPyWidget.Props>({
-      bundle: [ p.Any, {} ],
-    })
+    this.define<IPyWidget.Props>(({Any}) => ({
+      bundle: [ Any, {} ],
+    }))
   }
 }

panel/models/json.ts

@@ -1,3 +1,4 @@
+import {Enum} from "@bokehjs/core/kinds"
 import * as p from "@bokehjs/core/properties"
 import {Markup} from "@bokehjs/models/widgets/markup"
 import JSONFormatter from "json-formatter-js"
@@ -35,15 +36,14 @@ export class JSONView extends PanelMarkupView {
   }
 }
 
-type Theme = "light" | "dark"
-const Theme: Theme[] = ["dark", "light"]
+export const JSONTheme = Enum("dark", "light")
 
 export namespace JSON {
   export type Attrs = p.AttrsOf<Props>
   export type Props = Markup.Props & {
-    depth: p.Property<number>
+    depth: p.Property<number | null>
     hover_preview: p.Property<boolean> 
-    theme: p.Property<"light" | "dark">
+    theme: p.Property<typeof JSONTheme["__type__"]>
   }
 }
 
@@ -60,10 +60,10 @@ export class JSON extends Markup {
 
   static init_JSON(): void {
     this.prototype.default_view = JSONView
-    this.define<JSON.Props>({
-      depth: [p.Number, 1],
-      hover_preview: [p.Boolean, false],
-      theme: [p.Enum(Theme), "dark"],
-    })
+    this.define<JSON.Props>(({Boolean, Int, Nullable}) => ({
+      depth:         [ Nullable(Int),  1 ],
+      hover_preview: [ Boolean,    false ],
+      theme:         [ JSONTheme, "dark" ],
+    }))
   }
 }

panel/models/layout.py

@@ -1,20 +1,20 @@
-from bokeh.core.properties import String, List, Bool
+from bokeh.core.properties import Bool, List, Nullable, String
 
 from bokeh.models import Column
 
 class Card(Column):
 
-    active_header_background = String(help="Background color of active Card header.")
+    active_header_background = Nullable(String, help="Background color of active Card header.")
 
     button_css_classes = List(String, help="CSS classes to add to the Card collapse button.")
 
     collapsed = Bool(True, help="Whether the Card is collapsed.")
 
     collapsible = Bool(True, help="Whether the Card should have a button to collapse it.")
 
-    header_background = String(help="Background color of the Card header.")
+    header_background = Nullable(String, help="Background color of the Card header.")
 
-    header_color = String(help="Color of the header text and butotn.")
+    header_color = Nullable(String, help="Color of the header text and button.")
 
     header_css_classes = List(String, help="CSS classes to add to the Card header.")
 

panel/models/location.ts

@@ -77,15 +77,15 @@ export class Location extends Model {
   static init_Location(): void {
     this.prototype.default_view = LocationView;
 
-    this.define<Location.Props>({
-      href: [p.String, ''],
-      hostname: [p.String, ''],
-      pathname: [p.String, ''],
-      protocol: [p.String, ''],
-      port: [p.String, ''],
-      search: [p.String, ''],
-      hash: [p.String, ''],
-      reload: [p.Boolean, false],
-    })
+    this.define<Location.Props>(({Boolean, String}) => ({
+      href:     [ String,     "" ],
+      hostname: [ String,     "" ],
+      pathname: [ String,     "" ],
+      protocol: [ String,     "" ],
+      port:     [ String,     "" ],
+      search:   [ String,     "" ],
+      hash:     [ String,     "" ],
+      reload:   [ Boolean, false ],
+    }))
   }
 }

panel/models/markup.py

@@ -3,7 +3,7 @@
 """
 from __future__ import absolute_import, division, unicode_literals
 
-from bokeh.core.properties import Bool, Either, Int, Float, String
+from bokeh.core.properties import Bool, Either, Int, Float, Nullable, String
 from bokeh.models.widgets import Markup
 
 
@@ -18,7 +18,7 @@ class JSON(Markup):
     A bokeh model that renders JSON as tree.
     """
 
-    depth = Either(Int, Float, default=1, help="Depth to which the JSON tree is expanded.")
+    depth = Either(Nullable(Int), Float, default=1, help="Depth to which the JSON tree is expanded.")
 
     hover_preview = Bool(default=False, help="Whether to show a hover preview for collapsed nodes.")
 

panel/models/player.ts

@@ -1,3 +1,4 @@
+import {Enum} from "@bokehjs/core/kinds"
 import * as p from "@bokehjs/core/properties"
 import {div} from "@bokehjs/core/dom"
 import {Widget, WidgetView} from "@bokehjs/models/widgets/widget"
@@ -182,8 +183,6 @@ export class PlayerView extends WidgetView {
     this.loop_state.appendChild(reflect)
     this.loop_state.appendChild(reflect_label)
 
-
-
     this.groupEl.appendChild(this.sliderEl)
     this.groupEl.appendChild(button_div)
     if (this.model.show_loop_controls)
@@ -309,6 +308,8 @@ export class PlayerView extends WidgetView {
   }
 }
 
+export const LoopPolicy = Enum("once", "loop", "reflect")
+
 export namespace Player {
   export type Attrs = p.AttrsOf<Props>
   export type Props = Widget.Props & {
@@ -317,12 +318,13 @@ export namespace Player {
     start: p.Property<number>
     end: p.Property<number>
     step: p.Property<number>
-    loop_policy: p.Property<any>
+    loop_policy: p.Property<typeof LoopPolicy["__type__"]>
     value: p.Property<any>
     show_loop_controls: p.Property<boolean>
   }
 }
 
+
 export interface Player extends Player.Attrs {}
 
 export class Player extends Widget {
@@ -338,16 +340,16 @@ export class Player extends Widget {
   static init_Player(): void {
     this.prototype.default_view = PlayerView
 
-    this.define<Player.Props>({
-      direction:          [ p.Number,      0            ],
-      interval:           [ p.Number,      500          ],
-      start:              [ p.Number,                   ],
-      end:                [ p.Number,                   ],
-      step:               [ p.Number,      1            ],
-      loop_policy:        [ p.Any,         "once"       ],
-      value:              [ p.Any,         0            ],
-      show_loop_controls: [ p.Boolean,     true         ],
-    })
+    this.define<Player.Props>(({Boolean, Int}) => ({
+      direction:          [ Int,             0 ],
+      interval:           [ Int,           500 ],
+      start:              [ Int                ],
+      end:                [ Int                ],
+      step:               [ Int,             1 ],
+      loop_policy:        [ LoopPolicy, "once" ],
+      value:              [ Int,             0 ],
+      show_loop_controls: [ Boolean,      true ],
+    }))
 
     this.override<Player.Props>({width: 400})
   }

panel/models/singleselect.ts

@@ -106,10 +106,10 @@ export class SingleSelect extends InputWidget {
   static init_SingleSelect(): void {
     this.prototype.default_view = SingleSelectView
 
-    this.define<SingleSelect.Props>({
-      value:   [ p.String, "" ],
-      options: [ p.Array, [] ],
-      size:    [ p.Number, 4 ], // 4 is the HTML default
-    })
+    this.define<SingleSelect.Props>(({Any, Array, Int, String}) => ({
+      value:   [ String,     "" ],
+      options: [ Array(Any), [] ],
+      size:    [ Int,         4 ], // 4 is the HTML default
+    }))
   }
 }