docs: enhance component documentation with usage and reference tracking

- Add comprehensive JSDoc comments to HomeView and InfiniteScroll components
- Document method visibility (@public/@internal) and usage contexts
- Add clear references to where methods are called from (template, components, lifecycle)
- Include file-level documentation with component descriptions
- Document component dependencies and template usage
- Add parameter and return type documentation
- Clarify method call chains and dependencies
- Document event emissions and component interactions

This commit improves code maintainability by making method usage and
component relationships more explicit in the documentation.

src/components/InfiniteScroll.vue

@@ -1,3 +1,13 @@
+/**
+ * @file InfiniteScroll.vue
+ * @description A Vue component that implements infinite scrolling functionality using the Intersection Observer API.
+ * This component emits a 'reached-bottom' event when the user scrolls near the bottom of the content.
+ * It includes debouncing to prevent multiple rapid triggers and loading state management.
+ * 
+ * @author Matthew Raymer
+ * @version 1.0.0
+ */
+
 <template>
   <div ref="scrollContainer">
     <slot />
@@ -8,15 +18,51 @@
 <script lang="ts">
 import { Component, Emit, Prop, Vue } from "vue-facing-decorator";
 
+/**
+ * InfiniteScroll Component
+ * 
+ * This component implements infinite scrolling functionality by observing when a user
+ * scrolls near the bottom of the content. It uses the Intersection Observer API for
+ * efficient scroll detection and includes debouncing to prevent multiple rapid triggers.
+ * 
+ * Usage in template:
+ * ```vue
+ * <InfiniteScroll @reached-bottom="loadMore">
+ *   <div>Content goes here</div>
+ * </InfiniteScroll>
+ * ```
+ * 
+ * Props:
+ * - distance: number (default: 200) - Distance in pixels from the bottom at which to trigger the event
+ * 
+ * Events:
+ * - reached-bottom: Emitted when the user scrolls near the bottom of the content
+ */
 @Component
 export default class InfiniteScroll extends Vue {
+  /** Distance in pixels from the bottom at which to trigger the reached-bottom event */
   @Prop({ default: 200 })
   readonly distance!: number;
+
+  /** Intersection Observer instance for detecting scroll position */
   private observer!: IntersectionObserver;
+
+  /** Flag to track initial render state */
   private isInitialRender = true;
+
+  /** Flag to prevent multiple simultaneous loading states */
   private isLoading = false;
+
+  /** Timeout ID for debouncing scroll events */
   private debounceTimeout: number | null = null;
 
+  /**
+   * Vue lifecycle hook that runs after component updates.
+   * Initializes the Intersection Observer if not already set up.
+   * 
+   * @internal
+   * Used internally by Vue's lifecycle system
+   */
   updated() {
     if (!this.observer) {
       const options = {
@@ -32,7 +78,13 @@ export default class InfiniteScroll extends Vue {
     }
   }
 
-  // 'beforeUnmount' hook runs before unmounting the component
+  /**
+   * Vue lifecycle hook that runs before component unmounting.
+   * Cleans up the Intersection Observer and any pending timeouts.
+   * 
+   * @internal
+   * Used internally by Vue's lifecycle system
+   */
   beforeUnmount() {
     if (this.observer) {
       this.observer.disconnect();
@@ -42,6 +94,17 @@ export default class InfiniteScroll extends Vue {
     }
   }
 
+  /**
+   * Handles intersection observer callbacks when the sentinel element becomes visible.
+   * Implements debouncing to prevent multiple rapid triggers and manages loading state.
+   * 
+   * @param entries - Array of IntersectionObserverEntry objects
+   * @returns false (required by @Emit decorator)
+   * 
+   * @internal
+   * Used internally by the Intersection Observer
+   * @emits reached-bottom - Emitted when the user scrolls near the bottom
+   */
   @Emit("reached-bottom")
   handleIntersection(entries: IntersectionObserverEntry[]) {
     const entry = entries[0];