14146737595

Committed 29 Mar 2025 02:56PM UTC coverage: 91.632% (+0.001%) from 91.631%

Build # 14146737595

Build Type

push

github

Committed by

web-flow

Commit Message

feat(widgets): New LoadingWidget (#9485)

Co-authored-by: Chris Gervang <chrisgervang@users.noreply.github.com>

Run Details

6704 of 7352 branches covered (91.19%)

Branch coverage included in aggregate %.

2 of 4 new or added lines in 2 files covered. (50.0%)

55059 of 60051 relevant lines covered (91.69%)

14618.1 hits per line

Source File
Press 'n' to go to next uncovered line, 'b' for previous

48.86

/modules/widgets/src/widget-impl.ts

// deck.gl
// SPDX-License-Identifier: MIT
// Copyright (c) vis.gl contributors

/* global document */
import {_deepEqual, _applyStyles, _removeStyles} from '@deck.gl/core';
import type {Deck, Widget} from '@deck.gl/core';

export type WidgetImplProps = {
  id?: string;
  /** CSS inline style overrides. */
  style?: Partial<CSSStyleDeclaration>;
  /** Additional CSS class. */
  className?: string;
};
export abstract class WidgetImpl<PropsT extends WidgetImplProps> implements Widget<PropsT> {
  id: string;
  props: Required<PropsT>;

  deck?: Deck<any>;
  element?: HTMLDivElement;

  static defaultProps: Required<WidgetImplProps> = {
    id: 'widget',
    style: {},
    className: ''
  };

  abstract className: Required<string>;

  constructor(props: Required<PropsT>) {
    this.id = props.id || 'widget';
    this.props = props;
  }

  abstract onRenderHTML(): void;

  onAdd({deck}: {deck: Deck<any>}): HTMLDivElement {
    this.deck = deck;
    const {style, className} = this.props;
    const el = this._createRootElement({
      widgetClassName: this.className,
      className,
      style
    });
    this.element = el;
    this.onRenderHTML();
    return this.element;
  }

  onRemove() {
    this.deck = undefined;
    this.element = undefined;
  }

  setProps(props: Partial<PropsT>) {
    const oldProps = this.props;
    const el = this.element;
    if (el) {
      if (oldProps.className !== props.className) {
        if (oldProps.className) el.classList.remove(oldProps.className);
        if (props.className) el.classList.add(props.className);
      }

      if (!_deepEqual(oldProps.style, props.style, 1)) {
        _removeStyles(el, oldProps.style);
        _applyStyles(el, props.style);
      }
    }

    Object.assign(this.props, props);
    this.onRenderHTML();
  }

  _createRootElement(props: {
    widgetClassName: string;
    className?: string;
    style?: Partial<CSSStyleDeclaration>;
  }) {
    const element = document.createElement('div');
    ['deck-widget', props.widgetClassName, props.className]
      .filter((cls): cls is string => typeof cls === 'string' && cls.length > 0)
      .forEach(className => element.classList.add(className));
    _applyStyles(element, props.style);
    return element;
  }
}

1	// deck.gl	1✔
2	// SPDX-License-Identifier: MIT	1✔
3	// Copyright (c) vis.gl contributors	1✔
4		1✔
5	/* global document */	1✔
6	import {_deepEqual, _applyStyles, _removeStyles} from '@deck.gl/core';	1✔
7	import type {Deck, Widget} from '@deck.gl/core';	1✔
8		1✔
9	export type WidgetImplProps = {	1✔
10	id?: string;	1✔
11	/** CSS inline style overrides. */	1✔
12	style?: Partial<CSSStyleDeclaration>;	1✔
13	/** Additional CSS class. */	1✔
14	className?: string;	1✔
15	};	1✔
16	export abstract class WidgetImpl<PropsT extends WidgetImplProps> implements Widget<PropsT> {	1✔
17	id: string;	1✔
18	props: Required<PropsT>;	1✔
19		1✔
20	deck?: Deck<any>;	1✔
21	element?: HTMLDivElement;	1✔
22		1✔
23	static defaultProps: Required<WidgetImplProps> = {	1✔
24	id: 'widget',	1✔
25	style: {},	1✔
26	className: ''	1✔
27	};	1✔
28		1✔
29	abstract className: Required<string>;	1✔
30		1✔
31	constructor(props: Required<PropsT>) {	1✔
32	this.id = props.id \|\| 'widget';	×
33	this.props = props;	×
34	}	×
35		1✔
36	abstract onRenderHTML(): void;	1✔
37		1✔
38	onAdd({deck}: {deck: Deck<any>}): HTMLDivElement {	1✔
39	this.deck = deck;	×
40	const {style, className} = this.props;	×
41	const el = this._createRootElement({	×
42	widgetClassName: this.className,	×
43	className,	×
44	style	×
45	});	×
46	this.element = el;	×
47	this.onRenderHTML();	×
48	return this.element;	×
49	}	×
50		1✔
51	onRemove() {	1✔
52	this.deck = undefined;	×
53	this.element = undefined;	×
54	}	×
55		1✔
56	setProps(props: Partial<PropsT>) {	1✔
57	const oldProps = this.props;	×
58	const el = this.element;	×
59	if (el) {	×
60	if (oldProps.className !== props.className) {	×
61	if (oldProps.className) el.classList.remove(oldProps.className);	×
62	if (props.className) el.classList.add(props.className);	×
63	}	×
64		×
65	if (!_deepEqual(oldProps.style, props.style, 1)) {	×
66	_removeStyles(el, oldProps.style);	×
67	_applyStyles(el, props.style);	×
68	}	×
69	}	×
70		×
71	Object.assign(this.props, props);	×
72	this.onRenderHTML();	×
73	}	×
74		1✔
75	_createRootElement(props: {	1✔
76	widgetClassName: string;	×
77	className?: string;	×
78	style?: Partial<CSSStyleDeclaration>;	×
79	}) {	×
80	const element = document.createElement('div');	×
NEW 81	['deck-widget', props.widgetClassName, props.className]	×
82	.filter((cls): cls is string => typeof cls === 'string' && cls.length > 0)	×
83	.forEach(className => element.classList.add(className));	×
NEW 84	_applyStyles(element, props.style);	×
85	return element;	×
86	}	×
87	}	1✔

visgl / deck.gl / 14146737595

Source File Press 'n' to go to next uncovered line, 'b' for previous

Source File
Press 'n' to go to next uncovered line, 'b' for previous