ARIAtabs = function (inst, options) {
		var _options = Object.assign(ARIAaccOptions, options);
		var el = inst;
		var tablist = el.querySelector("[data-tablist]");
		var tabs = Array.from(el.querySelectorAll("[data-tab]"));
		var tabpanels = Array.from(el.querySelectorAll("[data-tabpanel]"));
		var tabsID = util.generateID("ps__tabs-");
		var orientation = el.getAttribute("data-tabs-orientation");
		var currentIndex = _options.open;
		var selectedTab = currentIndex;
		var manual = _options.manual;

		el.setAttribute("id", tabsID);

		var init = function () {
			el.classList.add("js-tabs");
			tablist.removeAttribute("hidden");
			setupTabList();
			setupTabs();
			setupTabPanels();
		};

		var setupTabList = function () {
			tablist.setAttribute("role", "tablist");
			if (orientation == "vertical")
				tablist.setAttribute("aria-orientation", "vertical");
		};

		var setupTabs = function () {
			tabs.forEach((tab, index) => {
				tab.setAttribute("role", "tab");
				// each tab needs an ID that will be used to label its corresponding panel
				tab.setAttribute("id", tabsID + "__tab-" + index);
				tab.setAttribute(
					"data-controls",
					tabpanels[index].getAttribute("id"),
				);

				// first tab is initially active
				if (index === currentIndex) {
					selectTab(tab);
					//   updateUrlHash();
				}

				if (tab.getAttribute("data-controls") === util.getUrlHash()) {
					currentIndex = index;
					selectedTab = index;
					selectTab(tab);
				}

				tab.addEventListener(
					"click",
					e => {
						e.preventDefault();
						currentIndex = index;
						selectedTab = index;
						focusCurrentTab();
						selectTab(tab);
						//   updateUrlHash();
					},
					false,
				);

				tab.addEventListener(
					"keydown",
					e => {
						tabKeyboardRespond(e, tab);
					},
					false,
				);
			});
		};

		var focusCurrentTab = function () {
			tabs[currentIndex].focus();
		};

		var updateUrlHash = function () {
			var active = tabs[selectedTab];
			util.setUrlHash(active.getAttribute("data-controls"));
		};

		var selectTab = function (tab) {
			// unactivate all other tabs
			tabs.forEach(tab => {
				tab.setAttribute("aria-selected", "false");
				tab.setAttribute("tabindex", "-1");
			});
			//activate current tab
			tab.setAttribute("aria-selected", "true");
			tab.setAttribute("tabindex", "0");

			// activate corresponding panel
			showTabpanel(tab);
		};

		var setupTabPanels = function () {
			tabpanels.forEach((tabpanel, index) => {
				tabpanel.setAttribute("role", "tabpanel");
				tabpanel.setAttribute("tabindex", "-1");
				tabpanel.setAttribute("hidden", "");

				if (index == currentIndex) {
					tabpanel.removeAttribute("hidden");
				}

				tabpanel.addEventListener(
					"keydown",
					e => {
						panelKeyboardRespond(e);
					},
					false,
				);

				tabpanel.addEventListener(
					"blur",
					() => {
						tabpanel.setAttribute("tabindex", "-1");
					},
					false,
				);
			});
		};

		var panelKeyboardRespond = function (e) {
			var keyCode = e.keyCode || e.which;

			switch (keyCode) {
				case util.keyCodes.TAB:
					tabpanels[currentIndex].setAttribute("tabindex", "-1");
					break;

				default:
					break;
			}
		};

		var showTabpanel = function (tab) {
			tabpanels.forEach((tabpanel, index) => {
				tabpanel.setAttribute("hidden", "");
				tabpanel.removeAttribute("tabindex");

				if (index == currentIndex) {
					tabpanel.removeAttribute("hidden");
					tabpanel.setAttribute(
						"aria-labelledby",
						tabs[currentIndex].getAttribute("id"),
					);
					tabpanel.setAttribute("tabindex", "0");
				}
			});
		};

		var incrementcurrentIndex = function () {
			if (currentIndex < tabs.length - 1) {
				return ++currentIndex;
			} else {
				currentIndex = 0;
				return currentIndex;
			}
		};

		var decrementcurrentIndex = function () {
			if (currentIndex > 0) {
				return --currentIndex;
			} else {
				currentIndex = tabs.length - 1;
				return currentIndex;
			}
		};

		var tabKeyboardRespond = function (e, tab) {
			var firstTab = tabs[0];
			var lastTab = tabs[tabs.length - 1];

			var keyCode = e.keyCode || e.which;

			switch (keyCode) {
				case util.keyCodes.UP:
				case util.keyCodes.LEFT:
					e.preventDefault();
					decrementcurrentIndex();
					focusCurrentTab();

					if (!manual) {
						selectedTab = currentIndex;
						selectTab(tabs[selectedTab]);
						// updateUrlHash();
					}

					break;

				case util.keyCodes.DOWN:
				case util.keyCodes.RIGHT:
					e.preventDefault();
					incrementcurrentIndex();
					focusCurrentTab();

					if (!manual) {
						selectedTab = currentIndex;
						selectTab(tabs[selectedTab]);
						// updateUrlHash();
					}

					break;

				case util.keyCodes.ENTER:
				case util.keyCodes.SPACE:
					e.preventDefault();
					selectedTab = currentIndex;
					selectTab(tabs[selectedTab]);
					//   updateUrlHash();

					break;

				case util.keyCodes.TAB:
					tabpanels[selectedTab].setAttribute("tabindex", "0");
					currentIndex = selectedTab;

					break;

				case util.keyCodes.HOME:
					e.preventDefault();
					firstTab.focus();
					//   updateUrlHash();

					break;

				case util.keyCodes.END:
					e.preventDefault();
					lastTab.focus();
					//   updateUrlHash();

					break;
			}
		};

		init.call(this);
		return this;
	}
Use history.replaceState so clicking through Tabs
does not create dozens of new history entries.
Browser back should navigate to the previous page
regardless of how many Tabs were activated.

@param {string} hash