<commit_before>// forked from https://github.com/github/tab-container-element/blob/master/index.js
// altered to not use a custom element for wider browser support without needing a polyfill

// expects the following markup:
// <div class="tab-container js-tab-container">
//   <div role="tablist">
//     <button type="button" role="tab" aria-selected="true">Tab 1</button>
//     <button type="button" role="tab">Tab 2</button>
//     <button type="button" role="tab">Tab 3</button>
//   </div>
//   <div role="tabpanel">
//     content here
//   </div>
//   <div role="tabpanel" hidden>
//     content here
//   </div>
//   <div role="tabpanel" hidden>
//     content here
//   </div>
// </div>

function nodeListToArray(arr) {
  return Array.prototype.slice.call(arr);
}

const tabs = {
  init() {
    const tabContainerNodeList = document.querySelectorAll(".js-tab-container");
    const tabContainerEls = nodeListToArray(tabContainerNodeList);
    // bind event listeners for each tab container
    tabContainerEls.forEach(el => {
      el.addEventListener("keydown", e => this.handleKeyDown(e, el));
      el.addEventListener("click", e => this.handleClick(e, el));
    });
  },

  handleKeyDown(event, tabContainer) {
    const target = event.target;

    if (!(target instanceof HTMLElement)) return;

    if (target.getAttribute("role") !== "tab" &&
        !target.closest("[role='tablist']")) {
      return;
    }

    const tabsNodeList = tabContainer.querySelectorAll('[role="tablist"] [role="tab"]');
    const tabs = nodeListToArray(tabsNodeList);

    const currentIndex = tabs.indexOf(
      tabs.find(tab => tab.matches('[aria-selected="true"]'))
    );

    if (event.code === "ArrowRight") {
      let index = currentIndex + 1;
      if (index >= tabs.length) index = 0;
      this.selectTab(index, tabContainer);
    } else if (event.code === "ArrowLeft") {
      let index = currentIndex - 1;
      if (index < 0) index = tabs.length - 1;
      this.selectTab(index, tabContainer);
    } else if (event.code === "Home") {
      this.selectTab(0, tabContainer);
      event.preventDefault();
    } else if (event.code === "End") {
      this.selectTab(tabs.length - 1, tabContainer);
      event.preventDefault();
    }
  },

  handleClick(event, tabContainer) {
    const target = event.target;
    if (!(event.target instanceof Element)) return;

    const tabButton = target.closest('[role="tab"]');
    const tabPanel = tabButton.closest('[role="tablist"]');
    if (!tabButton || !tabPanel) return;

    const tabsNodeList = tabPanel.querySelectorAll('[role="tab"]');
    const tabs = nodeListToArray(tabsNodeList);

    const index = tabs.indexOf(tabButton);

    this.selectTab(index, tabContainer);
  },

  selectTab(index, tabContainer) {
    const tabs = nodeListToArray(tabContainer.querySelectorAll('[role="tab"]'));
    const panels = nodeListToArray(tabContainer.querySelectorAll('[role="tabpanel"]'));

    tabs.forEach(tab => {
      tab.setAttribute("aria-selected", "false");
      tab.setAttribute("tabindex", "-1");
    });
    panels.forEach(panel => {
      panel.hidden = true;
      panel.setAttribute("tabindex", "0");<commit_msg>fix undefined bug<commit_after>// forked from https://github.com/github/tab-container-element/blob/master/index.js
// altered to not use a custom element for wider browser support without needing a polyfill

// expects the following markup:
// <div class="tab-container js-tab-container">
//   <div role="tablist">
//     <button type="button" role="tab" aria-selected="true">Tab 1</button>
//     <button type="button" role="tab">Tab 2</button>
//     <button type="button" role="tab">Tab 3</button>
//   </div>
//   <div role="tabpanel">
//     content here
//   </div>
//   <div role="tabpanel" hidden>
//     content here
//   </div>
//   <div role="tabpanel" hidden>
//     content here
//   </div>
// </div>

function nodeListToArray(arr) {
  return Array.prototype.slice.call(arr);
}

const tabs = {
  init() {
    const tabContainerNodeList = document.querySelectorAll(".js-tab-container");
    const tabContainerEls = nodeListToArray(tabContainerNodeList);
    // bind event listeners for each tab container
    tabContainerEls.forEach(el => {
      el.addEventListener("keydown", e => this.handleKeyDown(e, el));
      el.addEventListener("click", e => this.handleClick(e, el));
    });
  },

  handleKeyDown(event, tabContainer) {
    const target = event.target;

    if (!(target instanceof HTMLElement)) return;

    if (target.getAttribute("role") !== "tab" &&
        !target.closest("[role='tablist']")) {
      return;
    }

    const tabsNodeList = tabContainer.querySelectorAll('[role="tablist"] [role="tab"]');
    const tabs = nodeListToArray(tabsNodeList);

    const currentIndex = tabs.indexOf(
      tabs.find(tab => tab.matches('[aria-selected="true"]'))
    );

    if (event.code === "ArrowRight") {
      let index = currentIndex + 1;
      if (index >= tabs.length) index = 0;
      this.selectTab(index, tabContainer);
    } else if (event.code === "ArrowLeft") {
      let index = currentIndex - 1;
      if (index < 0) index = tabs.length - 1;
      this.selectTab(index, tabContainer);
    } else if (event.code === "Home") {
      this.selectTab(0, tabContainer);
      event.preventDefault();
    } else if (event.code === "End") {
      this.selectTab(tabs.length - 1, tabContainer);
      event.preventDefault();
    }
  },

  handleClick(event, tabContainer) {
    const target = event.target;
    if (!(event.target instanceof Element)) return;

    const tabButton = target.closest('[role="tab"]');

    if (!tabButton) return;

    const tabPanel = tabButton.closest('[role="tablist"]');

    if (!tabPanel) return;

    const tabsNodeList = tabPanel.querySelectorAll('[role="tab"]');
    const tabs = nodeListToArray(tabsNodeList);

    const index = tabs.indexOf(tabButton);

    this.selectTab(index, tabContainer);
  },

  selectTab(index, tabContainer) {
    const tabs = nodeListToArray(tabContainer.querySelectorAll('[role="tab"]'));
    const panels = nodeListToArray(tabContainer.querySelectorAll('[role="tabpanel"]'));

    tabs.forEach(tab => {
      tab.setAttribute("aria-selected", "false");
      tab.setAttribute("tabindex", "-1");
    });
    panels.forEach(panel => {
      panel.hidden = true;
      panel.setAttribute("tabindex", "0");
{'fraction_non_alphanumeric': 0.16512466677120904, 'fraction_numerical': 0.0037635251685745647, 'mean_word_length': 3.3655030800821355, 'pattern_counts': {'":': 0, '<': 37, '<?xml version=': 0, '>': 49, 'https://': 2, 'lorem ipsum': 0, 'www.': 0, 'xml': 0}, 'pii_count': 0, 'substrings_counts': 0, 'word_list_counts': {'cursed_substrings.json': 0, 'profanity_word_list.json': 0, 'sexual_word_list.json': 0, 'zh_pornsignals.json': 0}}
{'dir': 'git-commits-cleaned', 'id': '5785970', 'n_tokens_mistral': 1971, 'n_tokens_neox': 1937, 'n_words': 423}