feat(client): add onContentUpdated hooks

packages/client/src/components/Content.ts

@@ -1,5 +1,5 @@
 import { computed, defineAsyncComponent, defineComponent, h } from 'vue'
-import { usePageComponent } from '../composables/index.js'
+import { runCallbacks, usePageComponent } from '../composables/index.js'
 import { resolveRoute } from '../router/index.js'
 
 /**
@@ -26,6 +26,11 @@ export const Content = defineComponent({
       )
     })
 
-    return () => h(ContentComponent.value)
+    return () =>
+      h(ContentComponent.value, {
+        onVnodeMounted: runCallbacks,
+        onVnodeUpdated: runCallbacks,
+        onVnodeBeforeUnmount: runCallbacks,
+      })
   },
 })

packages/client/src/composables/contentUpdated.ts

@@ -0,0 +1,21 @@
+import { onUnmounted } from 'vue'
+
+let contentUpdatedCallbacks: (() => unknown)[] = []
+
+/**
+ * Register callback that is called every time the markdown content is updated
+ * in the DOM.
+ */
+export const onContentUpdated = (fn: () => unknown): void => {
+  contentUpdatedCallbacks.push(fn)
+  onUnmounted(() => {
+    contentUpdatedCallbacks = contentUpdatedCallbacks.filter((f) => f !== fn)
+  })
+}
+
+/**
+ * Call all registered callbacks
+ */
+export const runCallbacks = (): void => {
+  contentUpdatedCallbacks.forEach((fn) => fn())
+}

packages/client/src/composables/index.ts

@@ -1,3 +1,4 @@
 export * from './clientData.js'
 export * from './clientDataUtils.js'
 export * from './updateHead.js'
+export * from './contentUpdated.js'