typescript: Add overrides where necessary for stricter environments.

js/basemap_selector.ts

@@ -23,7 +23,7 @@ export class BasemapSelector extends LitWidget<
         return `basemap-selector`;
     }
 
-    static styles = [
+    static override styles = [
         flexStyles,
         legacyStyles,
         materialStyles,
@@ -57,7 +57,7 @@ export class BasemapSelector extends LitWidget<
     @property({ type: String }) provider: string = "";
     @property({ type: String }) resource: string = "";
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <widget-container
                 icon="map"

js/color_picker.ts

@@ -8,7 +8,7 @@ export class ColorPicker extends LitElement {
         return `color-picker`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         css`
             .color-swatch {
@@ -34,7 +34,7 @@ export class ColorPicker extends LitElement {
 
     @property({ type: String }) value: string = "#000000";
 
-    render() {
+    override render() {
         return html`
             <div class="widget-inline-hbox">
                 <input

js/container.ts

@@ -19,7 +19,7 @@ export class Container extends LitWidget<ContainerModel, Container> {
         return `widget-container`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -75,7 +75,7 @@ export class Container extends LitWidget<ContainerModel, Container> {
     ];
 
     @property({ type: String }) icon: string = "";
-    @property({ type: String }) title: string = "";
+    @property({ type: String }) override title: string = "";
     @property({ type: Boolean }) collapsed: boolean = false;
     @property({ type: Boolean }) hideCloseButton: boolean = false;
     @property({ type: Boolean }) compactMode: boolean = false;
@@ -91,7 +91,7 @@ export class Container extends LitWidget<ContainerModel, Container> {
         ]);
     }
 
-    render() {
+    override render() {
         return html`
             <div class="container">
                 ${this.noHeader ? nothing : this.renderHeader()}

js/inspector.ts

@@ -24,7 +24,7 @@ export class Inspector extends LitWidget<InspectorModel, Inspector> {
         return `inspector-widget`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         css`
             .checkbox-container {
@@ -70,7 +70,7 @@ export class Inspector extends LitWidget<InspectorModel, Inspector> {
         ]);
     }
 
-    render() {
+    override render() {
         return html`
             <widget-container
                 icon="point_scan"

js/layer_editor.ts

@@ -29,7 +29,7 @@ export class LayerEditor extends LitWidget<LayerEditorModel, LayerEditor> {
         return `layer-editor`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         css`
             .confirm-button {
@@ -71,7 +71,7 @@ export class LayerEditor extends LitWidget<LayerEditorModel, LayerEditor> {
         ]);
     }
 
-    onCustomMessage(msg: any): void {
+    override onCustomMessage(msg: any): void {
         const msgId = msg.id;
         const response = msg.response;
 
@@ -86,7 +86,7 @@ export class LayerEditor extends LitWidget<LayerEditorModel, LayerEditor> {
         }
     }
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <widget-container
                 .title="${this.layerName}"

js/layer_manager.ts

@@ -18,7 +18,7 @@ export class LayerManager extends LitWidget<LayerManagerModel, LayerManager> {
         return `layer-manager`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         css`
             .row {
@@ -54,7 +54,7 @@ export class LayerManager extends LitWidget<LayerManagerModel, LayerManager> {
         ]);
     }
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <widget-container
                 icon="layers"

js/layer_manager_row.ts

@@ -23,7 +23,7 @@ export class LayerManagerRow extends LitWidget<
         return `layer-manager-row`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -128,7 +128,7 @@ export class LayerManagerRow extends LitWidget<
     @property() isLoading: boolean = false;
     @property() isConfirmDialogVisible: boolean = false;
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <div class="row">
                 <input

js/legend.ts

@@ -32,7 +32,7 @@ export class Legend extends LitWidget<LegendModel, Legend> {
         return `legend-widget`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -82,7 +82,7 @@ export class Legend extends LitWidget<LegendModel, Legend> {
             }`
     ];
 
-    @property({ type: String }) title = "";
+    @property({ type: String }) override title = "";
     @property({ type: Array }) legendKeys: string[] = [];
     @property({ type: Array }) legendColors: string[] = [];
     @property({ type: Boolean }) addHeader: boolean = true;
@@ -98,7 +98,7 @@ export class Legend extends LitWidget<LegendModel, Legend> {
         ]);
     }
 
-    render() {
+    override render() {
         return this.addHeader ? html`
             <widget-container
                 .title="${this.title}"

js/legend_customization.ts

@@ -22,7 +22,7 @@ export class LegendCustomization extends LitElement {
         return `legend-customization`;
     }
 
-    static styles = [
+    static override styles = [
         flexStyles,
         legacyStyles,
         css`
@@ -43,10 +43,10 @@ export class LegendCustomization extends LitElement {
 
     @property({ type: Boolean }) showLegend: boolean = false;
     @property({ type: String }) legendType: string = "linear";
-    @property({ type: String }) title: string = "Legend";
+    @property({ type: String }) override title: string = "Legend";
     @property({ type: String }) labels: Array<string> = [];
 
-    render() {
+    override render() {
         return html`
             <div class="vertical-flex">
                 <div class="horizontal-flex">

js/lit_widget.ts

@@ -13,7 +13,7 @@ export abstract class LitWidget<
         keyof SubclassType | null
     >;
 
-    onCustomMessage?(_msg: any): void {}
+    override onCustomMessage?(_msg: any): void {}
 
     viewNameToModelName(): Map<keyof SubclassType | null, keyof ModelType> {
         return reverseMap(this.modelNameToViewName());
@@ -44,7 +44,7 @@ export abstract class LitWidget<
         return this._model;
     }
 
-    updated(changedProperties: PropertyValues<SubclassType>): void {
+    override updated(changedProperties: PropertyValues<SubclassType>): void {
         // Update the model properties so they're reflected in Python.
         const viewToModelMap = this.viewNameToModelName();
         for (const [viewProp, _] of changedProperties) {

js/palette_editor.ts

@@ -13,7 +13,7 @@ export class PaletteEditor extends LitElement {
         return `palette-editor`;
     }
 
-    static styles = [
+    static override styles = [
         flexStyles,
         legacyStyles,
         materialStyles,
@@ -42,7 +42,7 @@ export class PaletteEditor extends LitElement {
 
     paletteTokens: Array<string> = [];
 
-    render() {
+    override render() {
         return html`
             <div class="vertical-flex">
                 <div class="horizontal-flex">
@@ -98,7 +98,7 @@ export class PaletteEditor extends LitElement {
         `;
     }
 
-    updated(changedProperties: PropertyValues<PaletteEditor>): void {
+    override updated(changedProperties: PropertyValues<PaletteEditor>): void {
         super.updated(changedProperties);
         if (changedProperties.has("palette")) {
             if (this.palette === "") {

js/raster_layer_editor.ts

@@ -32,7 +32,7 @@ export class RasterLayerEditor extends LitElement {
         return `raster-layer-editor`;
     }
 
-    static styles = [
+    static override styles = [
         flexStyles,
         legacyStyles,
         materialStyles,
@@ -78,7 +78,7 @@ export class RasterLayerEditor extends LitElement {
     @query("legend-customization") legendCustomization?: LegendCustomization;
     @queryAll("#band-selection select") bandSelects!: NodeListOf<HTMLInputElement>;
 
-    connectedCallback() {
+    override connectedCallback() {
         super.connectedCallback();
         this.colorModel =
             this.bandNames.length > 1 ? ColorModel.RGB : ColorModel.Gray;
@@ -106,7 +106,7 @@ export class RasterLayerEditor extends LitElement {
         return visOptions;
     }
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <div class="vertical-flex">
                 <div class="horizontal-flex">
@@ -331,7 +331,7 @@ export class RasterLayerEditor extends LitElement {
         this.colorModel = (event.target as HTMLInputElement).value;
     }
 
-    updated(changedProperties: PropertyValues<RasterLayerEditor>): void {
+    override updated(changedProperties: PropertyValues<RasterLayerEditor>): void {
         super.updated(changedProperties);
 
         if (changedProperties.has("colorModel")) {

js/search_bar.ts

@@ -34,7 +34,7 @@ export class SearchBar extends LitWidget<
         return `search-bar`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -132,7 +132,7 @@ export class SearchBar extends LitWidget<
     @query(".dataset-search")
     datasetSearch!: HTMLInputElement;
 
-    render() {
+    override render() {
         return html`
             <widget-container
                 icon="search"

js/tab_panel.ts

@@ -44,7 +44,7 @@ export class TabPanel extends LitElement {
         return `tab-panel`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -121,7 +121,7 @@ export class TabPanel extends LitElement {
      */
     @queryAssignedElements() tabContentElements!: HTMLElement[];
 
-    render() {
+    override render() {
         return html`
             <div class="container">
                 <div

js/toolbar.ts

@@ -22,7 +22,7 @@ export class Toolbar extends LitWidget<ToolbarModel, Toolbar> {
         return `toolbar-panel`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -60,7 +60,7 @@ export class Toolbar extends LitWidget<ToolbarModel, Toolbar> {
     @property()
     expanded: boolean = false;
 
-    render() {
+    override render() {
         return html`
             <widget-container
                 icon="build"

js/toolbar_item.ts

@@ -21,7 +21,7 @@ export class ToolbarItem extends LitWidget<ToolbarItemModel, ToolbarItem> {
         return `tool-button`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -55,7 +55,7 @@ export class ToolbarItem extends LitWidget<ToolbarItemModel, ToolbarItem> {
     @property({ type: String })
     tooltip_text: string = '';
 
-    render() {
+    override render() {
         return html`
             <button
                 class=${classMap({

js/tree_node.ts

@@ -22,7 +22,7 @@ export class TreeNode extends LitElement {
         return `tree-node`;
     }
 
-    static styles = [
+    static override styles = [
         legacyStyles,
         materialStyles,
         css`
@@ -59,7 +59,7 @@ export class TreeNode extends LitElement {
     @property() node: Node = {};
     @property({ type: Boolean, reflect: true }) expanded: boolean = false;
 
-    updated(changedProperties: PropertyValues<TreeNode>): void {
+    override updated(changedProperties: PropertyValues<TreeNode>): void {
         super.updated(changedProperties);
         if (changedProperties.has("node") && this.node) {
             if ("expanded" in this.node) {
@@ -68,7 +68,7 @@ export class TreeNode extends LitElement {
         }
     }
 
-    render(): TemplateResult {
+    override render(): TemplateResult {
         return html`
             <div
                 class="node ${this.expanded ? "expanded" : ""}"

js/vector_layer_editor.ts

@@ -15,7 +15,7 @@ export class VectorLayerEditor extends LitElement {
         return `vector-layer-editor`;
     }
 
-    static styles = [
+    static override styles = [
         flexStyles,
         legacyStyles,
         css`
@@ -92,7 +92,7 @@ export class VectorLayerEditor extends LitElement {
         return visParams;
     }
 
-    render() {
+    override render() {
         return html`
             <div class="vertical-flex">
                 <div class="horizontal-flex">