paginar 0.2.8 → 0.3.1

package/src/composables/useTextContent.js

@@ -1,113 +1,113 @@
-import { computed, reactive } from 'vue'
-import { useEventListener } from '@vueuse/core'
-
-import useReferences from './useReferences'
-import useFootnotes from './useFootnotes'
-
-const state = reactive({
-	summary: null,
-	content: null
-})
-
-const content = computed(() => state.content)
-const summary = computed(() => state.summary)
-const context = computed(() => {
-	const current = state.summary.findIndex(
-		chapter => window.location.href.includes(chapter.link)
-	)
-	return {
-		chapter: state.summary[current],
-		surround: {
-			before: current - 1 >= 0
-				? state.summary[current - 1]
-				: null,
-			after: current + 1 <= state.summary.length
-				? state.summary[current + 1]
-				: null,
-		}
-	}
-})
-
-async function initContent(contentString, contentWrapper) {
-	const { setReferences, applyReferences } = useReferences
-	const { setFootnotes } = useFootnotes
-
-	const content = contentString
-		? JSON.parse(contentString)
-		: null
-
-	if (content?.summary)
-		state.summary = content.summary
-
-	if (content?.references)
-		setReferences(content.references)
-
-	if (content?.footnotes)
-		setFootnotes(content.footnotes)
-
-	// if content comes from file, apply references to file
-	if (content?.summary?.[0]?.file) {
-		const text = await getContent(content.summary?.[0]?.file)
-		const newContent = content.applyReferences
-			? applyReferences(text)
-			: text
-		state.content = newContent
-
-	// else if content comes from slot, apply references to slot
-	} else {
-		const content = document.querySelectorAll('[slot="content"]')
-
-		if (content && content?.[0]?.innerHTML && content.applyReferences) {
-			const newContent = applyReferences(content?.[0]?.innerHTML)
-			if (newContent) {
-				content[0].innerHTML = newContent
-			}
-		}
-	}
-
-	// after applying references above, now we start to listen to its clicks
-	listenToClicks(contentWrapper)
-}
-
-async function getContent(location) {
-	try {
-		const dataRef = await fetch(location)
-		const text = await dataRef.text()
-		return text
-	} catch (err) {
-		console.log({ err })
-		state.content = 'Ops, não foi possível carregar o arquivo solicitado.'
-	}
-}
-
-function applyContent(text) {
-	const { applyReferences } = useReferences
-	const newContent = applyReferences(text)
-	state.content = newContent
-}
-
-function listenToClicks(contentWrapper) {
-	setTimeout(() => {
-		useEventListener(contentWrapper, 'click', getClickedReferenceData)
-	}, 100)
-}
-
-function getClickedReferenceData(event) {
-	if (event.target.closest('.reference')) {
-		useReferences.applyReference(event)
-	}
-
-	if (event.target.closest('.footnote')) {
-		useFootnotes.applyFootnote(event)
-	}
-}
-
-export default {
-	content,
-	summary,
-	initContent,
-	getContent,
-	applyContent,
-	listenToClicks,
-	context
-}
+import { computed, reactive } from 'vue'
+import { useEventListener } from '@vueuse/core'
+
+import useReferences from './useReferences'
+import useFootnotes from './useFootnotes'
+
+const state = reactive({
+	summary: null,
+	content: null
+})
+
+const content = computed(() => state.content)
+const summary = computed(() => state.summary)
+const context = computed(() => {
+	const current = state.summary.findIndex(
+		chapter => window.location.href.includes(chapter.link)
+	)
+	return {
+		chapter: state.summary[current],
+		surround: {
+			before: current - 1 >= 0
+				? state.summary[current - 1]
+				: null,
+			after: current + 1 <= state.summary.length
+				? state.summary[current + 1]
+				: null,
+		}
+	}
+})
+
+async function initContent(contentString, contentWrapper) {
+	const { setReferences, applyReferences } = useReferences
+	const { setFootnotes } = useFootnotes
+
+	const content = contentString
+		? JSON.parse(contentString)
+		: null
+
+	if (content?.summary)
+		state.summary = content.summary
+
+	if (content?.references)
+		setReferences(content.references)
+
+	if (content?.footnotes)
+		setFootnotes(content.footnotes)
+
+	// if content comes from file, apply references to file
+	if (content?.summary?.[0]?.file) {
+		const text = await getContent(content.summary?.[0]?.file)
+		const newContent = content.applyReferences
+			? applyReferences(text)
+			: text
+		state.content = newContent
+
+	// else if content comes from slot, apply references to slot
+	} else {
+		const content = document.querySelectorAll('[slot="content"]')
+
+		if (content && content?.[0]?.innerHTML && content.applyReferences) {
+			const newContent = applyReferences(content?.[0]?.innerHTML)
+			if (newContent) {
+				content[0].innerHTML = newContent
+			}
+		}
+	}
+
+	// after applying references above, now we start to listen to its clicks
+	listenToClicks(contentWrapper)
+}
+
+async function getContent(location) {
+	try {
+		const dataRef = await fetch(location)
+		const text = await dataRef.text()
+		return text
+	} catch (err) {
+		console.log({ err })
+		state.content = 'Ops, não foi possível carregar o arquivo solicitado.'
+	}
+}
+
+function applyContent(text) {
+	const { applyReferences } = useReferences
+	const newContent = applyReferences(text)
+	state.content = newContent
+}
+
+function listenToClicks(contentWrapper) {
+	setTimeout(() => {
+		useEventListener(contentWrapper, 'click', getClickedReferenceData)
+	}, 100)
+}
+
+function getClickedReferenceData(event) {
+	if (event.target.closest('.reference')) {
+		useReferences.applyReference(event)
+	}
+
+	if (event.target.closest('.footnote')) {
+		useFootnotes.applyFootnote(event)
+	}
+}
+
+export default {
+	content,
+	summary,
+	initContent,
+	getContent,
+	applyContent,
+	listenToClicks,
+	context
+}

package/src/main.js

@@ -1,19 +1,19 @@
-// https://maximomussini.com/posts/vue-custom-elements
-import { defineCustomElement } from 'vue'
-
-import App from './App.ce.vue'
-
-import tailwindStyles from  './tailwind.css'
-
-const styles = [
-	...[tailwindStyles],
-	...App.styles
-]
-
-customElements.define(
-	'paginate-content',
-	defineCustomElement({
-		...App,
-		styles
-	})
-)
+// https://maximomussini.com/posts/vue-custom-elements
+import { defineCustomElement } from 'vue'
+
+import App from './App.ce.vue'
+
+import tailwindStyles from  './tailwind.css'
+
+const styles = [
+	...[tailwindStyles],
+	...App.styles
+]
+
+customElements.define(
+	'paginate-content',
+	defineCustomElement({
+		...App,
+		styles
+	})
+)

package/src/tailwind.css

@@ -591,10 +591,6 @@ video {
   right: -0.5rem;
 }
 
-.-left-2 {
-  left: -0.5rem;
-}
-
 .z-20 {
   z-index: 20;
 }
@@ -900,6 +896,11 @@ video {
   text-align: center;
 }
 
+.text-sm {
+  font-size: 0.875rem;
+  line-height: 1.25rem;
+}
+
 .text-xs {
   font-size: 0.75rem;
   line-height: 1rem;
@@ -1055,10 +1056,6 @@ video {
     right: 4rem;
   }
 
-  .md\:left-16 {
-    left: 4rem;
-  }
-
   .md\:flex {
     display: flex;
   }

package/tailwind.config.js

@@ -1,16 +1,16 @@
-/** @type {import('tailwindcss').Config} */
-module.exports = {
-	content: [
-		// Example content paths...
-		'./public/**/*.html',
-		'./src/**/*.{js,jsx,ts,tsx,vue}',
-	],
-	theme: {
-		extend: {
-			transitionProperty: {
-				'spacing': 'margin'
-			}
-		},
-	},
-	plugins: [],
-}
+/** @type {import('tailwindcss').Config} */
+module.exports = {
+	content: [
+		// Example content paths...
+		'./public/**/*.html',
+		'./src/**/*.{js,jsx,ts,tsx,vue}',
+	],
+	theme: {
+		extend: {
+			transitionProperty: {
+				'spacing': 'margin'
+			}
+		},
+	},
+	plugins: [],
+}

package/vite.config.js

@@ -1,36 +1,36 @@
-import { fileURLToPath, URL } from 'node:url'
-
-import { defineConfig } from 'vite'
-import vue from '@vitejs/plugin-vue'
-
-// https://vitejs.dev/config/
-export default defineConfig({
-	plugins: [vue()],
-	resolve: {
-		alias: {
-			'@': fileURLToPath(new URL('./src', import.meta.url))
-		}
-	},
-
-	define: {
-		'process.env': {}
-	},
-
-	server: {
-		host: true
-	},
-
-	build: {
-		lib: {
-			entry: 'src/main.js',
-			formats: ['es'],
-			name: 'PaginateContent',
-			fileName: format => `index.${format}.js`
-		},
-		sourcemap: true,
-		// Reduce bloat from legacy polyfills.
-		target: 'esnext',
-		// Leave minification up to applications.
-		minify: false,
-	}
-})
+import { fileURLToPath, URL } from 'node:url'
+
+import { defineConfig } from 'vite'
+import vue from '@vitejs/plugin-vue'
+
+// https://vitejs.dev/config/
+export default defineConfig({
+	plugins: [vue()],
+	resolve: {
+		alias: {
+			'@': fileURLToPath(new URL('./src', import.meta.url))
+		}
+	},
+
+	define: {
+		'process.env': {}
+	},
+
+	server: {
+		host: true
+	},
+
+	build: {
+		lib: {
+			entry: 'src/main.js',
+			formats: ['es'],
+			name: 'PaginateContent',
+			fileName: format => `index.${format}.js`
+		},
+		sourcemap: true,
+		// Reduce bloat from legacy polyfills.
+		target: 'esnext',
+		// Leave minification up to applications.
+		minify: false,
+	}
+})