<commit_before><template>
  <div
    v-scroll="onScroll"
    class="mb-4"
    v-on="$listeners"
  >
    <slot name="top" />

    <ul class="app-table-of-contents">
      <li
        v-for="(item, i) in list"
        :key="i"
      >
        <a
          :href="item.id"
          :class="{
            'primary--text': activeIndex === i,
            'grey--text text--darken-1': activeIndex !== i
          }"
          :style="{
            borderColor: activeIndex === i ? 'inherit' : null
          }"
          class="mb-3 d-block"
          @click.stop.prevent="goTo(item.target)"
          v-text="item.text"
        />
      </li>
    </ul>

    <slot />
  </div>
</template>
<script>
  // Utilities
  import {
    mapState
  } from 'vuex'
  import { goTo } from '@/util/helpers'

  export default {
    data: () => ({
      activeIndex: 0,
      currentOffset: 0,
      list: [],
      timeout: null
    }),

    computed: {
      ...mapState('app', ['isLoading'])
    },

    watch: {
      isLoading: {
        immediate: true,
        handler (val) {
          !val && requestAnimationFrame(this.genList)
        }
      }
    },

    methods: {
      goTo,
      async genList () {
        const list = []

        const items = document.querySelectorAll('#page [id]')

        for (const item of items) {
          if (
            // Not a top level heading
            !['H1', 'H2'].includes(item.tagName) ||
            // From previous list
            this.list.find(l => l.item === item)
          ) continue

          list.push({
            item,<commit_msg>docs(Toc): round #14, fight<commit_after><template>
  <div
    v-scroll="onScroll"
    class="mb-4"
    v-on="$listeners"
  >
    <slot name="top" />

    <ul class="app-table-of-contents">
      <li
        v-for="(item, i) in list"
        :key="i"
      >
        <a
          :href="item.id"
          :class="{
            'primary--text': activeIndex === i,
            'grey--text text--darken-1': activeIndex !== i
          }"
          :style="{
            borderColor: activeIndex === i ? 'inherit' : null
          }"
          class="mb-3 d-block"
          @click.stop.prevent="goTo(item.target)"
          v-text="item.text"
        />
      </li>
    </ul>

    <slot />
  </div>
</template>
<script>
  // Utilities
  import {
    mapState
  } from 'vuex'
  import { goTo } from '@/util/helpers'

  export default {
    data: () => ({
      activeIndex: 0,
      currentOffset: 0,
      list: [],
      timeout: null
    }),

    computed: {
      ...mapState('app', ['isLoading'])
    },

    watch: {
      isLoading: {
        immediate: true,
        handler (val) {
          !val && setTimeout(this.genList, 50)
        }
      }
    },

    methods: {
      goTo,
      async genList () {
        const list = []

        const items = document.querySelectorAll('#page [id]')

        for (const item of items) {
          if (
            // Not a top level heading
            !['H1', 'H2'].includes(item.tagName) ||
            // From previous list
            this.list.find(l => l.item === item)
          ) continue

          list.push({
            item,
{'fraction_non_alphanumeric': 0.16229870539943164, 'fraction_numerical': 0.005683612251341964, 'mean_word_length': 1.4313123561013046, 'pattern_counts': {'":': 0, '<': 27, '<?xml version=': 0, '>': 31, 'https://': 0, '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': '3948929', 'n_tokens_mistral': 1027, 'n_tokens_neox': 1000, 'n_words': 209}