Function collapsableList

src/components/collapsableList.js:31–155

(
	titleText,
	type = "indicator",
	options = {},
)

 * @returns {Collapsible}
 */
export default function collapsableList(
	titleText,
	type = "indicator",
	options = {},
) {
	let onscroll = null;
	const $ul = tag("ul", {
		className: "scroll",
		onscroll: onUlScroll,
	});
	const $collapseIndicator = tag("span", {
		className: `icon ${type}`,
	});
	const $title = tile({
		lead: $collapseIndicator,
		type: "div",
		text: options.allCaps ? titleText.toUpperCase() : titleText,
		tail: options.tail,
	});
	const $mainWrapper = tag(options.type || "div", {
		className: "list collapsible hidden",
		children: [$title, $ul],
	});

	let collapse = () => {
		$mainWrapper.classList.add("hidden");
		if ($mainWrapper.ontoggle) $mainWrapper.ontoggle.call($mainWrapper);
		delete $ul.dataset.scrollTop;
	};

	let expand = () => {
		$mainWrapper.classList.remove("hidden");
		if ($mainWrapper.ontoggle) $mainWrapper.ontoggle.call($mainWrapper);
	};

	$title.classList.add("light");
	$title.addEventListener("click", toggle);

	[$title, $mainWrapper].forEach(defineProperties);

	$mainWrapper.dataset.id = `${Math.random().toString(36).substring(2, 15)}`;

	return $mainWrapper;

	function onUlScroll() {
		if (onscroll) onscroll.call($ul);
		$ul.dataset.scrollTop = $ul.scrollTop;
	}

	function toggle() {
		if ($title.collapsed) {
			expand();
		} else {
			collapse();
		}
	}

	function defineProperties($el) {