paginar 0.3.4 → 0.3.6

package/src/components/HeaderSlot/OptionsButton/OptionsColor.vue

@@ -1,28 +0,0 @@
-<script setup>
-import IconSun from '../../icons/Sun.vue'
-import IconMoon from '../../icons/Moon.vue'
-
-import useReaderSettings from '../../../composables/useReaderSettings'
-const { mode, setMode } = useReaderSettings
-
-</script>
-
-<template>
-	<button id="lightmode-button" @click.prevent="setMode('light')"
-		title="Leitura diurna"
-		class="font-light text-base border w-full h-10 flex justify-center items-center"
-		:class="{
-			'bg-primary-extralight text-primary border-2 border-primary': mode === 'light'
-		}">
-		<IconSun class="w-5 h-5" />
-	</button>
-
-	<button id="darkmode-button" @click.prevent="setMode('dark')"
-		title="Leitura noturna"
-		class="font-light text-base border w-full h-10 flex justify-center items-center"
-		:class="{
-			'bg-primary-extralight text-primary border-2 border-primary':  mode === 'dark'
-		}">
-		<IconMoon class="w-5 h-5" />
-	</button>
-</template>

package/src/components/HeaderSlot/OptionsButton/OptionsColumns.vue

@@ -1,51 +0,0 @@
-<script setup>
-import { computed } from 'vue'
-import { useWindowSize } from '@vueuse/core'
-
-import SingleColumn from '../../icons/SingleColumn.vue'
-import DoubleColumn from '../../icons/DoubleColumn.vue'
-
-import useReaderSettings from '../../../composables/useReaderSettings'
-const { columns, setColumns } = useReaderSettings
-const { width } = useWindowSize()
-
-const isSafari = computed(() => {
-	const ua = navigator.userAgent.toLowerCase()
-	return ua.indexOf('safari') !== -1 && ua.indexOf('chrome') === -1
-})
-
-</script>
-
-<template>
-	<div id="columns-menu" class="w-full hidden md:grid grid-cols-3 gap-2 mt-3">
-		<button
-			id="single-column-button"
-			class="col-span-1 text-primary text-center cursor-pointer py-3 rounded-sm border"
-			:class="{
-				'border-gray-300': columns !== 'single',
-				'bg-primary-extralight border-2 border-primary': columns === 'single',
-				'opacity-30 cursor-default': isSafari
-			}"
-			@click.prevent="!isSafari ? setColumns('single') : null"
-			aria-label="Coluna única"
-			:title="isSafari ? 'O navegador Safari não aceita visualização de coluna única.' : 'Coluna única'"
-		>
-			<SingleColumn class="mx-auto h-10 opacity-75" />
-		</button>
-
-		<button
-			id="double-column-button"
-			class="col-span-2 text-primary text-center cursor-pointer py-3 rounded-sm border"
-			:class="{
-				'border-gray-300': columns !== 'double',
-				'bg-primary-extralight border-2 border-primary': columns === 'double',
-				'opacity-30': width < 1024
-			}"
-			@click.prevent="width >= 1024 && setColumns('double')"
-			aria-label="Coluna dupla"
-			title="Coluna dupla"
-		>
-			<DoubleColumn name="DoubleColumn" class="mx-auto h-10 divide-opacity-75" />
-		</button>
-	</div>
-</template>

package/src/components/HeaderSlot/OptionsButton/OptionsDropdown.vue

@@ -1,59 +0,0 @@
-<script setup>
-import IconEye from '../../icons/Eye.vue'
-import IconFootnote from '../../icons/Footnote.vue'
-
-import OptionsColumns from './OptionsColumns.vue';
-import OptionsFontFamily from './OptionsFontFamily.vue';
-import OptionsFontSize from './OptionsFontSize.vue';
-import OptionsColor from './OptionsColor.vue'
-
-import useFootnotes from '../../../composables/useFootnotes'
-
-</script>
-
-<template>
-	<div class="absolute top-14 py-4 px-3 shadow-lg w-60 md:w-104
-			text-areia -right-2 md:right-16 z-10 bg-white
-		"
-		role="Opções"
-		aria-orientation="vertical"
-		aria-labelledby="options-menu"
-	>
-		<div>
-
-			<slot name="optionsTop" />
-
-			<div id="footnotes-button">
-				<button @click.prevent="useFootnotes.setShowFootnotes(true)"
-					class="w-full flex justify-center items-center py-3 lowercase"
-				>
-					<IconFootnote class="w-6 h-6" />
-					<span class="ml-4">Notas de rodapé</span>
-				</button>
-
-				<div class="w-full border-b border-areia my-3"></div>
-			</div>
-
-
-			<div class="w-full flex justify-center items-center py-3 lowercase"
-				id="visualize-title"
-			>
-				<IconEye class="w-6 h-6" />
-				<span class="ml-4">Visualização</span>
-			</div>
-
-			<OptionsColumns />
-			<OptionsFontFamily />
-
-			<div class="w-full grid grid-cols-4 gap-2 my-3">
-
-				<OptionsFontSize />
-				<OptionsColor />
-			</div>
-
-			<div class="hidden w-full border-b border-areia my-8"></div>
-
-			<slot name="optionsBottom" />
-		</div>
-	</div>
-</template>

package/src/components/HeaderSlot/OptionsButton/OptionsFontFamily.vue

@@ -1,17 +0,0 @@
-<script setup>
-import useReaderSettings from '../../../composables/useReaderSettings'
-const { textFont, fontsOptions, setTextFont } = useReaderSettings
-
-</script>
-
-<template>
-	<div id="font-family-menu" class="w-full grid grid-cols-4 gap-2 my-3">
-		<button v-for="font in fontsOptions" :key="font.name" @click.prevent="setTextFont(font.name)"
-			class="font-light text-lg text-primary tracking-wide border border-urucum w-full h-10 flex justify-center items-center"
-			:class="{
-				'bg-primary-extralight border-2 border-primary': textFont === font.name
-			}" :style="`font-family: ${font.name}`" :title="font.label ?? font.name">
-			Ff
-		</button>
-	</div>
-</template>

package/src/components/HeaderSlot/OptionsButton/OptionsFontSize.vue

@@ -1,17 +0,0 @@
-<script setup>
-import useReaderSettings from '../../../composables/useReaderSettings'
-const { fontSize, setFontSize } = useReaderSettings
-
-</script>
-
-<template>
-	<button id="fontsize-add-button" @click.prevent="setFontSize(fontSize + 1)"
-		class="font-light text-base border border-urucum w-full h-10 flex justify-center items-center">
-		+ A
-	</button>
-
-	<button id="fontsize-subtr-button" @click.prevent="setFontSize(fontSize - 1)"
-		class="font-light text-base border border-urucum w-full h-10 flex justify-center items-center">
-		- A
-	</button>
-</template>

package/src/components/HeaderSlot/SummaryButton/SummaryButton.vue

@@ -1,74 +0,0 @@
-<script setup>
-import { ref } from 'vue'
-import { onClickOutside, onKeyStroke } from '@vueuse/core'
-
-import useReaderSettings from '../../../composables/useReaderSettings'
-
-import IconHome from '../../icons/Home.vue'
-import IconClose from '../../icons/Close.vue'
-import IconSummary from '../../icons/Summary.vue'
-import SummaryDropdown from './SummaryDropdown.vue'
-
-const show = ref(false)
-const button = ref(null)
-
-const { homeUrl } = useReaderSettings
-
-const toggleSummary = () => {
-	show.value = !show.value
-	useReaderSettings.setBlocked(show.value)
-}
-const hide = () => {
-	if (!useReaderSettings.blocked.value) {
-		show.value = false
-		useReaderSettings.setBlocked(false)
-	}
-}
-
-onClickOutside(button, () => hide())
-onKeyStroke('Escape', () => hide())
-</script>
-
-<template>
-	<div id="summary-menu" ref="button" class="relative">
-		<div class="flex">
-			<a v-if="homeUrl"
-				:href="homeUrl" title="Homepage" id="home-button"
-				class="hidden md:flex items-center border p-3 shadow mr-3
-					border-white text-white"
-			>
-				<IconHome class="w-6 h-6"/>
-			</a>
-
-			<div class="position-relative">
-				<button
-					@click.prevent="toggleSummary()"
-					class="border p-3 shadow flex items-center border-white text-white"
-					id="summary-button" aria-haspopup="true" :aria-expanded="show"
-				>
-					<IconSummary v-if="!show" />
-					<IconClose v-else class="w-6 h-6" />
-
-					<span class="block ml-3">
-						Sumário
-					</span>
-				</button>
-
-				<transition enter-active-class="transition ease-out duration-100 transform" enter-class="opacity-0 scale-95"
-					enter-to-class="opacity-100 scale-100" leave-active-class="transition ease-in duration-75 transform"
-					leave-class="opacity-100 scale-100" leave-to-class="opacity-0 scale-95"
-				>
-					<SummaryDropdown v-if="show">
-						<template #summaryTop>
-							<slot name="summaryTop"/>
-						</template>
-
-						<template #summaryBottom>
-							<slot name="summaryBottom"/>
-						</template>
-					</SummaryDropdown>
-				</transition>
-			</div>
-		</div>
-	</div>
-</template>

package/src/components/HeaderSlot/SummaryButton/SummaryDropdown.vue

@@ -1,30 +0,0 @@
-<script setup>
-import useTextContent from '../../../composables/useTextContent'
-import usePagination from '../../../composables/usePagination'
-const { summary } = useTextContent
-
-async function getChapter(item) {
-	const text = await useTextContent.getContent(item.file)
-	useTextContent.applyContent(text)
-	usePagination.set(1)
-}
-</script>
-
-<template>
-	<div id="summary-menu-dropdown" class="absolute top-14 py-4 px-3 shadow-lg w-60 md:w-104
-			text-areia z-10 bg-white" :role="Sumário" aria-orientation="vertical" aria-labelledby="summary-menu">
-		<nav>
-			<slot name="summaryTop" />
-
-			<component v-for="item in summary" :is="item.link ? 'a' : 'button'" :key="item.link" :href="item.link"
-				:title="`Navegar para capítulo ${item.title}`"
-				class="w-full text-left block text-black py-2 px-3 hover:bg-gray-100 rounded mb-2"
-				@click="item.file ? getChapter(item) : null">
-				<span class="summary-menu-dropdown-item-title">{{ item.title }}</span>
-				<span v-if="item.author" class="summary-menu-dropdown-item-author">{{ item.author }}</span>
-			</component>
-
-			<slot name="summaryBottom" />
-		</nav>
-	</div>
-</template>

package/src/components/NavigationButton.vue

@@ -1,34 +0,0 @@
-<script>
-export default {
-	name: "NavPrev",
-
-	props: {
-		target: String,
-	},
-
-	computed: {
-		type() {
-			return 'chapter'
-		},
-	}
-};
-</script>
-
-<template>
-	<button @click.prevent="$emit('clicked')" class="[ viewer-nav ]"
-		:class="type === 'cover' ? 'text-white' : 'text-gray-dark'">
-
-		<svg v-if="target === 'prev'" viewBox="0 0 20 20" fill="currentColor" class="[ viewer-nav-icon nav-prev ] arrow-narrow-left">
-			<path fill-rule="evenodd"
-				d="M12.707 5.293a1 1 0 010 1.414L9.414 10l3.293 3.293a1 1 0 01-1.414 1.414l-4-4a1 1 0 010-1.414l4-4a1 1 0 011.414 0z"
-				clip-rule="evenodd"></path>
-		</svg>
-
-		<svg v-if="target === 'next'" data-v-ef9c31bc="" viewBox="0 0 20 20" fill="currentColor"
-			class="[ viewer-nav-icon nav-next ] right-0 arrow-narrow-right">
-			<path fill-rule="evenodd"
-				d="M7.293 14.707a1 1 0 010-1.414L10.586 10 7.293 6.707a1 1 0 011.414-1.414l4 4a1 1 0 010 1.414l-4 4a1 1 0 01-1.414 0z"
-				clip-rule="evenodd"></path>
-		</svg>
-	</button>
-</template>

package/src/components/ReaderWrapper.vue

@@ -1,37 +0,0 @@
-<script setup>
-import { ref } from 'vue'
-import { usePointerSwipe, useWindowSize } from '@vueuse/core'
-
-import usePagination from '../composables/usePagination'
-import useReaderSettings from '../composables/useReaderSettings'
-
-const { columns } = useReaderSettings
-const { currentPage } = usePagination
-
-const el = ref(null)
-
-const { width } = useWindowSize()
-const { distanceX } = usePointerSwipe(el, {
-	onSwipeEnd() {
-		if (width.value < 600) {
-			if (distanceX.value > 100) {
-				usePagination.next()
-			}
-			if (distanceX.value < -100) {
-				usePagination.prev()
-			}
-		}
-	}
-})
-
-</script>
-
-<template>
-	<div  ref="el" class="columnsArea" :style="`margin-left: -${100 * (currentPage - 1)}%`">
-		<div class="[ typeArea ] h-full relative
-			transition-opacity duration-100 opacity-100 px-2 md:px-24
-		">
-			<slot></slot>
-		</div>
-	</div>
-</template>

package/src/components/ReferencePopup.vue

@@ -1,36 +0,0 @@
-<script setup>
-import { onKeyStroke } from '@vueuse/core'
-
-import useReaderSettings from '../composables/useReaderSettings'
-import useReferences from '../composables/useReferences'
-
-const { reference, setHighlightedReference } = useReferences
-
-function closeRef() {
-	setHighlightedReference(null)
-}
-
-onKeyStroke('Escape', () => {
-	if (!useReaderSettings.blocked.value) {
-		setHighlightedReference(null)
-	}
-})
-
-</script>
-
-<template>
-	<transition enter-active-class="transition ease-out duration-200" enter-from-class="transform opacity-0 scale-95"
-		enter-to-class="transform opacity-100 scale-100" leave-active-class="transition ease-in duration-200"
-		leave-from-class="transform opacity-100 scale-100" leave-to-class="transform opacity-0 scale-95">
-		<div v-if="reference" tabindex="0" class="[ reference-popup ] bg-gray-800 text-white fixed z-40 bottom-0 md:bottom-14 right-0 md:right-3
-				rounded flex justify-between
-				p-4 shadow w-full md:w-2/5
-			">
-			<p class="w-4/5" v-html="reference.ref"></p>
-
-			<div class="mt-3 flex self-end">
-				<button @click.prevent="closeRef()" class="button button-negative">OK</button>
-			</div>
-		</div>
-	</transition>
-</template>

package/src/components/icons/Close.vue

@@ -1,6 +0,0 @@
-<script setup></script>
-<template>
-  	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M6 18L18 6M6 6l12 12"></path>
-	</svg>
-</template>

package/src/components/icons/DoubleColumn.vue

@@ -1,15 +0,0 @@
-<template>
-	<svg viewBox="0 0 653 441.2" fill="currentColor">
-		<rect x="73.2" y="143.7" width="195.2" height="20"></rect>
-		<rect x="73.2" y="82.7" width="195.2" height="20"></rect>
-		<rect x="73.2" y="203.7" width="195.2" height="20"></rect>
-		<rect x="73.2" y="263.7" width="195.2" height="20"></rect>
-		<rect x="73.2" y="319" width="195.2" height="20"></rect>
-		<rect x="384.7" y="143.7" width="195.2" height="20"></rect>
-		<rect x="384.7" y="82.7" width="195.2" height="20"></rect>
-		<rect x="384.7" y="203.7" width="195.2" height="20"></rect>
-		<rect x="384.7" y="263.7" width="195.2" height="20"></rect>
-		<rect x="384.7" y="319" width="195.2" height="20"></rect>
-		<path d="M0-0.6v7.5v7.5v411.8v14.4v0.6h653v-5v-10V14.4V2.5v-3.1H0z M638,426.2H15V14.4h623V426.2z"></path>
-	</svg>
-</template>

package/src/components/icons/Expand.vue

@@ -1,7 +0,0 @@
-<script setup></script>
-<template>
-	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-			d="M4 8V4m0 0h4M4 4l5 5m11-1V4m0 0h-4m4 0l-5 5M4 16v4m0 0h4m-4 0l5-5m11 5l-5-5m5 5v-4m0 4h-4"></path>
-	</svg>
-</template>

package/src/components/icons/Eye.vue

@@ -1,9 +0,0 @@
-<script setup></script>
-<template>
-	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M15 12a3 3 0 11-6 0 3 3 0 016 0z"></path>
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-			d="M2.458 12C3.732 7.943 7.523 5 12 5c4.478 0 8.268 2.943 9.542 7-1.274 4.057-5.064 7-9.542 7-4.477 0-8.268-2.943-9.542-7z">
-		</path>
-	</svg>
-</template>

package/src/components/icons/Footnote.vue

@@ -1,5 +0,0 @@
-<template>
-	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M9 12h6m-6 4h6m2 5H7a2 2 0 01-2-2V5a2 2 0 012-2h5.586a1 1 0 01.707.293l5.414 5.414a1 1 0 01.293.707V19a2 2 0 01-2 2z" />
-	</svg>
-</template>

package/src/components/icons/Home.vue

@@ -1,6 +0,0 @@
-<template>
-	<svg fill="none" stroke="currentColor" viewBox="0 0 20 22" xmlns="http://www.w3.org/2000/svg">
-		<path d="M1 8L10 1L19 8V19C19 19.5304 18.7893 20.0391 18.4142 20.4142C18.0391 20.7893 17.5304 21 17 21H3C2.46957 21 1.96086 20.7893 1.58579 20.4142C1.21071 20.0391 1 19.5304 1 19V8Z" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-		<path d="M7 21V11H13V21" stroke-width="2" stroke-linecap="round" stroke-linejoin="round"/>
-	</svg>
-</template>

package/src/components/icons/Moon.vue

@@ -1,5 +0,0 @@
-<template>
-  	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20.354 15.354A9 9 0 018.646 3.646 9.003 9.003 0 0012 21a9.003 9.003 0 008.354-5.646z"></path>
-	</svg>
-</template>

package/src/components/icons/Notes.vue

@@ -1,5 +0,0 @@
-<template>
-	<svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M8 12h.01M12 12h.01M16 12h.01M21 12c0 4.418-4.03 8-9 8a9.863 9.863 0 01-4.255-.949L3 20l1.395-3.72C3.512 15.042 3 13.574 3 12c0-4.418 4.03-8 9-8s9 3.582 9 8z" />
-	</svg>
-</template>

package/src/components/icons/SingleColumn.vue

@@ -1,3 +0,0 @@
-<template>
-	<svg viewBox="0 0 341.5 441.2" fill="currentColor"><rect data-v-acadaaca="" x="73.2" y="143.7" width="195.2" height="20"></rect><rect data-v-acadaaca="" x="73.2" y="82.7" width="195.2" height="20"></rect><rect data-v-acadaaca="" x="73.2" y="203.7" width="195.2" height="20"></rect><rect data-v-acadaaca="" x="73.2" y="263.7" width="195.2" height="20"></rect><rect data-v-acadaaca="" x="73.2" y="319" width="195.2" height="20"></rect><rect data-v-acadaaca="" x="0" y="-0.6" width="332.3" height="15"></rect><rect data-v-acadaaca="" x="0" y="426.2" width="332.3" height="15"></rect><rect data-v-acadaaca="" x="-209.4" y="216.2" transform="matrix(6.123234e-17 -1 1 6.123234e-17 -216.2339 231.2339)" width="433.7" height="15"></rect><rect data-v-acadaaca="" x="108" y="211.9" transform="matrix(6.123234e-17 -1 1 6.123234e-17 105.4808 544.1859)" width="433.7" height="15"></rect></svg>
-</template>

package/src/components/icons/Summary.vue

@@ -1,10 +0,0 @@
-<template>
-	<svg width="24" height="19" viewBox="0 0 24 19" fill="none" stroke="currentColor" xmlns="http://www.w3.org/2000/svg">
-		<line x1="5" y1="1.08447" x2="1" y2="1.08447" stroke-width="2" stroke-linecap="round"/>
-		<line x1="23" y1="1.04248" x2="11" y2="1.04248" stroke-width="2" stroke-linecap="round"/>
-		<line x1="23" y1="9.08447" x2="14" y2="9.08447" stroke-width="2" stroke-linecap="round"/>
-		<line x1="8" y1="9.14905" x2="4" y2="9.14905" stroke-width="2" stroke-linecap="round"/>
-		<line x1="23" y1="17.149" x2="10.9993" y2="17.149" stroke-width="2" stroke-linecap="round"/>
-		<line x1="5" y1="17.2429" x2="1" y2="17.2429" stroke-width="2" stroke-linecap="round"/>
-	</svg>
-</template>

package/src/components/icons/Sun.vue

@@ -1,5 +0,0 @@
-<template>
-  	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 3v1m0 16v1m9-9h-1M4 12H3m15.364 6.364l-.707-.707M6.343 6.343l-.707-.707m12.728 0l-.707.707M6.343 17.657l-.707.707M16 12a4 4 0 11-8 0 4 4 0 018 0z"></path>
-	</svg>
-</template>

package/src/components/icons/ThreeDots.vue

@@ -1,8 +0,0 @@
-<script setup></script>
-<template>
-	<svg fill="none" stroke="currentColor" viewBox="0 0 24 24" xmlns="http://www.w3.org/2000/svg">
-		<path stroke-linecap="round" stroke-linejoin="round" stroke-width="2"
-			d="M5 12h.01M12 12h.01M19 12h.01M6 12a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0zm7 0a1 1 0 11-2 0 1 1 0 012 0z">
-		</path>
-	</svg>
-</template>

package/src/composables/useBrowser.js

@@ -1,16 +0,0 @@
-const isSafari = [
-	'iPad Simulator',
-	'iPhone Simulator',
-	'iPod Simulator',
-	'iPad',
-	'iPhone',
-	'iPod'
-].includes(navigator.platform)
-	|| (navigator.userAgent.includes("Mac") && "ontouchend" in document)
-
-const isApple = /(Mac|iPhone|iPod|iPad)/i.test(navigator.platform);
-
-export default {
-	isSafari,
-	isApple
-}

package/src/composables/useEstimatePages.js

@@ -1,31 +0,0 @@
-import { computed, reactive } from 'vue'
-
-const state = reactive({
-	totalPages: 1
-})
-
-function estimate(viewport, content) {
-	if (viewport && content) {
-		const { width: viewportWidth } = viewport.value.getBoundingClientRect()
-		const { width: contentWidth } = content.value.getBoundingClientRect()
-
-		if (contentWidth > viewportWidth) {
-			state.totalPages = Math.ceil(contentWidth / viewportWidth)
-			return Math.ceil(contentWidth / viewportWidth)
-
-		} else {
-			state.totalPages = 1
-			return 1
-		}
-	} else {
-		state.totalPages = 1
-		return 1
-	}
-}
-
-const totalPages = computed(() => state.totalPages)
-
-export default {
-	totalPages,
-	estimate
-}

package/src/composables/useFootnotes.js

@@ -1,50 +0,0 @@
-import { computed, reactive } from 'vue'
-
-const state = reactive({
-	footnotes: [],
-	showFootnotes: false,
-	footnote: null
-})
-
-const footnotes = computed(() => state.footnotes)
-function setFootnotes(footnotes) {
-	state.footnotes = footnotes
-}
-
-const showFootnotes = computed(() => state.showFootnotes)
-function setShowFootnotes(value) {
-	state.showFootnotes = value
-}
-
-const footnote = computed(() => state.footnote)
-function setHighlightedFootnote(footnote) {
-	state.footnote = footnote
-}
-
-function applyFootnote(event) {
-	const classList = event.target.closest('.footnote')?.classList.value.split(' ')
-
-	if (classList.length === 0)
-		return
-
-	const footnoteTarget = classList.find(
-		item => item.includes('footnote') && item !== 'footnote'
-	)
-
-	if (footnoteTarget) {
-		const ref = state.footnotes.find(item => item.id === footnoteTarget)
-		if (ref) {
-			state.footnote = ref
-		}
-	}
-}
-
-export default {
-	footnotes,
-	footnote,
-	setFootnotes,
-	applyFootnote,
-	setHighlightedFootnote,
-	setShowFootnotes,
-	showFootnotes
-}