feat: v0.4.0 - SSR support, expanded selectors, DRY fixes

- Fixed SSR by using useRuntimeConfig() from #imports instead of event.context
- Fixed navigation bug by adding missing selectors (p, li, td, th, span, etc.)
- Fixed DRY violation with shared-defaults.ts as single source of truth
- Added 12 new element types for better coverage
- Added selector documentation
- Fixed nitro plugin tests with proper mocking
- All 258 tests passing

Authored by: Aaron Lippold<lippold@gmail.com>

Author: aaronlippold

.gitignore

@@ -72,3 +72,9 @@ session.md
 # Project-specific
 *.old.ts
 *.original.ts
+
+# Archive directory for recovery files
+archive/
+
+# Package tarball
+*.tgz

docs/selectors.md

@@ -0,0 +1,120 @@
+# Default Selectors
+
+This document describes which HTML elements are processed by nuxt-smartscript by default and which are excluded.
+
+## Elements Processed by Default
+
+### Container Elements
+- `main` - Main content areas
+- `article` - Article containers
+- `section` - Content sections
+- `header` - Header areas
+- `footer` - Footer areas
+- `.content` - Elements with "content" class
+- `[role="main"]` - Elements with main ARIA role
+- `.prose` - Prose content (common in documentation)
+- `.blog-post` - Blog post containers
+- `.blog-content` - Blog content areas
+
+### Heading Elements
+All heading levels are processed:
+- `h1`, `h2`, `h3`, `h4`, `h5`, `h6`
+
+### Text Content Elements
+- `p` - Paragraphs
+- `li` - List items
+- `td` - Table cells
+- `th` - Table headers
+- `blockquote` - Block quotes
+- `caption` - Table/figure captions
+- `dt` - Definition terms
+- `dd` - Definition descriptions
+- `figcaption` - Figure captions
+
+### Inline Elements
+- `span` - Generic inline containers
+- `a` - Links
+- `strong` - Strong emphasis
+- `em` - Emphasis
+- `b` - Bold text
+- `i` - Italic text
+- `small` - Small print (often legal text)
+- `cite` - Citations
+- `abbr` - Abbreviations
+
+### Interactive Elements
+- `button` - Button text
+- `label` - Form labels
+- `legend` - Fieldset legends
+- `summary` - Details/summary elements
+
+### Other Semantic Elements
+- `address` - Contact information
+
+## Elements Excluded by Default
+
+### Code Elements
+- `pre` - Preformatted code blocks
+- `code` - Inline code
+- `script` - Script tags
+- `style` - Style tags
+
+### Custom Exclusions
+- `.no-superscript` - Elements with this class
+- `[data-no-superscript]` - Elements with this data attribute
+
+### Already Processed
+These classes indicate content already transformed:
+- `sup.ss-sup` - Already superscripted elements
+- `sub.ss-sub` - Already subscripted elements
+- `.ss-tm` - Trademark symbols
+- `.ss-reg` - Registered symbols
+- `.ss-ordinal` - Ordinal numbers
+- `.ss-chemical` - Chemical formulas
+- `.ss-math` - Mathematical notation
+
+## Customizing Selectors
+
+You can customize which elements are processed in your `nuxt.config.ts`:
+
+```typescript
+export default defineNuxtConfig({
+  smartscript: {
+    selectors: {
+      // Add more selectors
+      include: [
+        ...defaultSelectors,
+        '.my-custom-class',
+        'custom-element'
+      ],
+      // Add more exclusions
+      exclude: [
+        ...defaultExclusions,
+        '.skip-this',
+        '[data-raw-text]'
+      ]
+    }
+  }
+})
+```
+
+## Best Practices
+
+1. **Performance**: More specific selectors (classes, IDs) are faster than broad element selectors
+2. **Avoid Over-Processing**: Don't include generic containers like `div` unless necessary
+3. **Test Thoroughly**: When adding new selectors, test that they don't interfere with your layout
+4. **Use Exclusions**: Use the exclusion classes/attributes to skip specific elements
+
+## Common Use Cases
+
+### Documentation Sites
+The default selectors work well for documentation with the `.prose` class and semantic HTML.
+
+### Blogs
+Blog-specific classes like `.blog-post` and `.blog-content` are included by default.
+
+### Applications
+Interactive elements like buttons and form labels are processed to handle branded UI text.
+
+### Legal Text
+The `small` element is included as it often contains copyright notices and legal text with ® and ™ symbols.

src/module.ts

@@ -1,5 +1,6 @@
 import { fileURLToPath } from 'node:url'
 import { addPlugin, addServerPlugin, createResolver, defineNuxtModule } from '@nuxt/kit'
+import { SHARED_DEFAULTS } from './runtime/shared-defaults'
 
 // Module options TypeScript interface definition
 export interface ModuleOptions {
@@ -117,72 +118,8 @@ export default defineNuxtModule<ModuleOptions>({
     },
   },
 
-  // Default configuration options
-  defaults: {
-    enabled: true,
-    positioning: {
-      trademark: {
-        body: '-0.5em',
-        headers: '-0.7em',
-        fontSize: '0.8em',
-      },
-      registered: {
-        body: '-0.25em',
-        headers: '-0.45em',
-        fontSize: '0.8em',
-      },
-      ordinals: {
-        fontSize: '0.75em',
-      },
-      chemicals: {
-        fontSize: '0.75em',
-      },
-    },
-    selectors: {
-      include: [
-        'main',
-        'article',
-        '.content',
-        '[role="main"]',
-        '.prose',
-        '.blog-post',
-        '.blog-content',
-        'section',
-        'h1',
-        'h2',
-        'h3',
-        'h4',
-        'h5',
-        'h6',
-        'header',
-      ],
-      exclude: [
-        'pre',
-        'code',
-        'script',
-        'style',
-        '.no-superscript',
-        '[data-no-superscript]',
-      ],
-    },
-    performance: {
-      debounce: 100,
-      batchSize: 50,
-      delay: 1500,
-    },
-    transformations: {
-      trademark: true,
-      registered: true,
-      copyright: true,
-      ordinals: true,
-      chemicals: true,
-      mathSuper: true,
-      mathSub: true,
-    },
-    ssr: true,
-    client: true,
-    debug: false,
-  },
+  // Default configuration options - SINGLE SOURCE OF TRUTH
+  defaults: SHARED_DEFAULTS,
 
   setup(options, nuxt) {
     if (!options.enabled) {

src/runtime/nitro/plugin.ts

@@ -5,6 +5,7 @@
 
 import type { NitroAppPlugin } from 'nitropack'
 import type { SuperscriptConfig } from '../smartscript/types'
+import { useRuntimeConfig } from '#imports'
 import { JSDOM } from 'jsdom'
 import { mergeConfig } from '../smartscript/config'
 import { processElement } from '../smartscript/engine'
@@ -14,9 +15,10 @@ import { createCombinedPattern, createPatterns } from '../smartscript/patterns'
 export default <NitroAppPlugin> function (nitro) {
   // Hook into the render:html event for both SSR and SSG
   // @ts-expect-error - render:html hook exists but not typed in nitropack
-  nitro.hooks.hook('render:html', (html: Record<string, string[]>, { event }: { event: { context: { $config?: { public?: { smartscript?: SuperscriptConfig } } } } }) => {
-    // Get configuration from runtime config
-    const config = event.context.$config?.public?.smartscript
+  nitro.hooks.hook('render:html', (html: Record<string, string[]>, { event: _event }: { event: any }) => {
+    // Get runtime config using useRuntimeConfig
+    const runtimeConfig = useRuntimeConfig()
+    const config = runtimeConfig.public?.smartscript as SuperscriptConfig
 
     // Skip if no config or SSR processing is disabled
     if (!config || config.ssr === false) {

src/runtime/plugin.ts

@@ -4,7 +4,7 @@
  */
 
 import type { SuperscriptConfig } from './smartscript'
-import { defineNuxtPlugin } from '#imports'
+import { defineNuxtPlugin, nextTick } from '#imports'
 import {
   createCombinedPattern,
   createContentObserver,
@@ -153,18 +153,52 @@ export default defineNuxtPlugin((nuxtApp) => {
     }
   })
 
-  // Handle navigation
-  nuxtApp.hook('page:finish', () => {
+  // Handle navigation - use multiple hooks to ensure we catch all navigation scenarios
+  nuxtApp.hook('page:finish', async () => {
+    logger.debug('page:finish hook - navigation detected')
+
     initializeForNavigation()
-    setTimeout(process, 100)
+
+    // Recreate patterns in case something changed
+    patterns = createPatterns(config)
+    combinedPattern = createCombinedPattern(patterns, config)
+
+    // Wait for Vue to finish its virtual DOM reconciliation
+    await nextTick()
+
+    // Add a small delay to ensure all Vue updates are complete
+    setTimeout(() => {
+      logger.debug('Processing after navigation and Vue reconciliation')
+      process()
+    }, 50)
+  })
+
+  // Also hook into page:transition:finish for when transitions are used
+  nuxtApp.hook('page:transition:finish', () => {
+    logger.debug('page:transition:finish hook - processing after transition')
+    // Process immediately since transition is complete
+    process()
   })
 
   // Also hook into router if available
   if (nuxtApp.$router && typeof nuxtApp.$router === 'object' && 'afterEach' in nuxtApp.$router) {
     const router = nuxtApp.$router as { afterEach: (cb: () => void) => void }
-    router.afterEach(() => {
+    router.afterEach(async () => {
+      logger.debug('Router afterEach - navigation detected')
+
       initializeForNavigation()
-      setTimeout(process, 150)
+
+      // Recreate patterns here too
+      patterns = createPatterns(config)
+      combinedPattern = createCombinedPattern(patterns, config)
+
+      // Wait for Vue's virtual DOM to finish updating
+      await nextTick()
+
+      setTimeout(() => {
+        logger.debug('Processing after router navigation and Vue reconciliation')
+        process()
+      }, 100)
     })
   }