Add native lazy loading callback

[plcossette]

No description provided.

[mcaskill]

Respect the existing quotation style and prioritize single quotes.

Suggested change

	IMAGE: "c-image",
	IMAGE_LAZY_LOADED: "-lazy-loaded",
	IMAGE_LAZY_LOADING: "-lazy-loading",
	IMAGE_LAZY_ERROR: "-lazy-error",
	IMAGE: 'c-image',
	IMAGE_LAZY_LOADED: '-lazy-loaded',
	IMAGE_LAZY_LOADING: '-lazy-loading',
	IMAGE_LAZY_ERROR: '-lazy-error',

[mcaskill]

Superfluous comment given the called function name.

Suggested change

	/**
	* Trigger lazyload
	*/

[mcaskill]

Superfluous comment given the called function name.

Suggested change

	/**
	* Trigger lazyload
	*/

[mcaskill]

Respect the existing quotation style and prioritize single quotes.

Suggested change

	this.load.on("loading", () => {
	this.load.on('loading', () => {

[mcaskill]

Superfluous comment given the called function name.

Suggested change

	/**
	* Remove previous lazyload callbacks
	*/

[mcaskill]

Misaligned block comment syntax and invalid parameter tags.

Suggested change

	/**
	* Observe new scroll elements
	*
	* @param $newContainer (HTMLElement)
	*/
	addScrollElements($newContainer) {
	this.scroll?.addScrollElements($newContainer)
	}
	/**
	* Unobserve scroll elements
	*
	* @param $oldContainer (HTMLElement)
	*/
	removeScrollElements($oldContainer) {
	this.scroll?.removeScrollElements($oldContainer)
	}
	/**
	* Observe new scroll elements
	*
	* @param {HTMLElement} $newContainer
	*/
	addScrollElements($newContainer) {
	this.scroll?.addScrollElements($newContainer)
	}
	/**
	* Unobserve scroll elements
	*
	* @param {HTMLElement} $oldContainer
	*/
	removeScrollElements($oldContainer) {
	this.scroll?.removeScrollElements($oldContainer)
	}

[mcaskill]

Out of scope coding style corrections. Ideally, these corrections should be their own commit either in a different pull request or directly on the main branch.

Respect the existing quotation style and prioritize single quotes.

[mcaskill]

Unnecessary polyfill removed in f527488 (2022-06) and replaced in 082f3b5 (2021-10) with Element.prototype.closest.

Suggested change

	// https://gomakethings.com/how-to-get-the-closest-parent-element-with-a-matching-selector-using-vanilla-javascript/
	const queryClosestParent = ($el, selector) => {
	// Element.matches() polyfill
	if (!Element.prototype.matches) {
	Element.prototype.matches =
	Element.prototype.matchesSelector ||
	Element.prototype.mozMatchesSelector ||
	Element.prototype.msMatchesSelector ||
	Element.prototype.oMatchesSelector ||
	Element.prototype.webkitMatchesSelector ||
	function (s) {
	var matches = (
	this.document || this.ownerDocument
	).querySelectorAll(s),
	i = matches.length;
	while (--i >= 0 && matches.item(i) !== this) {}
	return i > -1;
	};
	}
	// Get the closest matching element
	for (; $el && $el !== document; $el = $el.parentNode) {
	if ($el.matches(selector)) return $el;
	}
	return null;
	};

[mcaskill]

Use Element.prototype.closest instead of the queryClosestParent polyfill. See comment in html.js

Respect the existing quotation style and prioritize single quotes.