@docsector/docsector-reader 0.5.6 → 0.5.8

package/bin/docsector.js

@@ -11,9 +11,9 @@
  *   docsector help         — Show help information
  */
 
-import { execSync, spawn } from 'child_process'
+import { spawn } from 'child_process'
 import { existsSync, mkdirSync, writeFileSync, copyFileSync } from 'fs'
-import { resolve, dirname, basename } from 'path'
+import { resolve, dirname } from 'path'
 import { fileURLToPath } from 'url'
 
 const __filename = fileURLToPath(import.meta.url)
@@ -23,7 +23,7 @@ const packageRoot = resolve(__dirname, '..')
 const args = process.argv.slice(2)
 const command = args[0]
 
-const VERSION = '0.5.4'
+const VERSION = '0.5.8'
 
 const HELP = `
   Docsector Reader v${VERSION}
@@ -71,7 +71,7 @@ function getTemplatePackageJson (name) {
       serve: 'docsector serve'
     },
     dependencies: {
-      '@docsector/docsector-reader': '^0.5.4',
+      '@docsector/docsector-reader': '^0.5.8',
       '@quasar/extras': '^1.16.12',
       'quasar': '^2.16.6',
       'vue': '^3.5.13',

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@docsector/docsector-reader",
-  "version": "0.5.6",
+  "version": "0.5.8",
   "description": "A documentation rendering engine built with Vue 3, Quasar v2 and Vite. Transform Markdown into beautiful, navigable documentation sites.",
   "productName": "Docsector Reader",
   "author": "Rodrigo de Araujo Vieira",

package/src/components/DMenuItem.vue

@@ -78,6 +78,19 @@ const getPageStatusTooltip = (status) => {
     return t('menu.status.empty.tooltip')
   }
 }
+
+const normalizePath = (path) => {
+  if (!path) {
+    return '/'
+  }
+
+  const normalized = String(path).replace(/\/+$/, '')
+  return normalized === '' ? '/' : normalized
+}
+
+const isMenuItemActive = (path) => {
+  return normalizePath(path) === normalizePath($route.path)
+}
 </script>
 
 <template>
@@ -90,7 +103,7 @@ const getPageStatusTooltip = (status) => {
 
 <q-item
   :to="subitem.path + '/overview'"
-  :active="subitem.path + subpage === $route.path"
+  :active="isMenuItemActive(subitem.path + subpage)"
   v-show="founds[subitem.path] || !founds"
 >
   <q-item-section side>

package/src/components/DPage.vue

@@ -1,5 +1,5 @@
 <script setup>
-import { ref, computed, onMounted } from 'vue'
+import { ref, computed, onMounted, onBeforeUnmount } from 'vue'
 import { useStore } from 'vuex'
 import { useRoute, useRouter } from 'vue-router'
 import { useQuasar } from 'quasar'
@@ -89,7 +89,75 @@ const resetPageScroll = () => {
   }
 }
 
+const getPageScrollContainer = () => {
+  return pageScrollArea.value?.$el?.querySelector('.q-scrollarea__container') || null
+}
+
+const isEditableTarget = (target) => {
+  if (!(target instanceof HTMLElement)) {
+    return false
+  }
+
+  if (target.isContentEditable) {
+    return true
+  }
+
+  return ['INPUT', 'TEXTAREA', 'SELECT'].includes(target.tagName)
+}
+
+const handleMainScrollKeys = (event) => {
+  const handledKeys = ['Home', 'End', 'PageUp', 'PageDown']
+
+  if (!handledKeys.includes(event.key)) {
+    return
+  }
+
+  if (event.defaultPrevented || event.altKey || event.ctrlKey || event.metaKey) {
+    return
+  }
+
+  if (isEditableTarget(event.target)) {
+    return
+  }
+
+  const container = getPageScrollContainer()
+  if (!container) {
+    return
+  }
+
+  const currentTop = container.scrollTop
+  const maxTop = Math.max(0, container.scrollHeight - container.clientHeight)
+  const pageStep = Math.max(120, Math.floor(container.clientHeight * 0.9))
+
+  let nextTop = currentTop
+  switch (event.key) {
+    case 'Home':
+      nextTop = 0
+      break
+    case 'End':
+      nextTop = maxTop
+      break
+    case 'PageUp':
+      nextTop = Math.max(0, currentTop - pageStep)
+      break
+    case 'PageDown':
+      nextTop = Math.min(maxTop, currentTop + pageStep)
+      break
+  }
+
+  event.preventDefault()
+
+  if (pageScrollArea.value?.setScrollPosition) {
+    pageScrollArea.value.setScrollPosition('vertical', nextTop, 0)
+    return
+  }
+
+  container.scrollTop = nextTop
+}
+
 onMounted(() => {
+  window.addEventListener('keydown', handleMainScrollKeys)
+
   router.beforeEach((to, from, next) => {
     resetPageScroll()
 
@@ -102,6 +170,10 @@ onMounted(() => {
     next()
   })
 })
+
+onBeforeUnmount(() => {
+  window.removeEventListener('keydown', handleMainScrollKeys)
+})
 </script>
 
 <template>

package/src/store/App.js

@@ -18,14 +18,18 @@ export default {
       const base = firstRoutePath.substr(1)
       let relative = secondRoutePath.substr(firstRoutePath.length)
 
-      commit('page/setBase', base, { root: true })
-      commit('page/setRelative', relative, { root: true })
-      commit('page/setAbsolute', base + relative, { root: true })
+      if (relative !== '/') {
+        relative = relative.replace(/\/+$/, '')
+      }
 
       if (relative === '/' || relative === '') {
         relative = '/overview'
       }
 
+      commit('page/setBase', base, { root: true })
+      commit('page/setRelative', relative, { root: true })
+      commit('page/setAbsolute', base + relative, { root: true })
+
       if (firstRoutePath) {
         const i18nBase = base.replace(/_$/, '').replace(/\//g, '.')
         const i18nRelative = relative.replace(/_$/, '').replace(/\//g, '.')