From bef0d42631894bbf6e72fe5a011674e4ec019177 Mon Sep 17 00:00:00 2001
From: Christian Pillsbury <cpillsbury@mux.com>
Date: Tue, 9 Sep 2025 07:18:51 -0700
Subject: [PATCH] chore: Add todo code comments.

---
 packages/html/html/src/components/media-time-range.ts   | 5 ++++-
 packages/html/html/src/components/media-volume-range.ts | 5 ++++-
 packages/react/react/src/components/TimeRange.tsx       | 3 +++
 packages/react/react/src/components/VolumeRange.tsx     | 3 +++
 4 files changed, 14 insertions(+), 2 deletions(-)

diff --git a/packages/html/html/src/components/media-time-range.ts b/packages/html/html/src/components/media-time-range.ts
index 9cb679fe..366e9f9b 100644
--- a/packages/html/html/src/components/media-time-range.ts
+++ b/packages/html/html/src/components/media-time-range.ts
@@ -21,7 +21,7 @@ export class TimeRangeBase extends HTMLElement {
   constructor() {
     super();
     /**
-     * @TODO This is just a simple render function to demonstrate functionality.
+     * @TODO This is just a simple placeholder input to demonstrate functionality.
      * A full implementation will need to implement a "compound component" architecture and likely should use templates. (CJP)
      **/
     this._input = document.createElement('input');
@@ -115,6 +115,9 @@ export const useTimeRangeProps: PropsHook<{
   return baseProps;
 };
 
+/**
+ * @TODO When implementing compound components, this function may need to be swapped out, modified, or augmented in some way or another. (CJP)
+ */
 /**
  * Connected TimeRange component using hook-style architecture
  * Equivalent to React's TimeRange = toConnectedComponent(...)
diff --git a/packages/html/html/src/components/media-volume-range.ts b/packages/html/html/src/components/media-volume-range.ts
index bb3b9d5b..7bebfa75 100644
--- a/packages/html/html/src/components/media-volume-range.ts
+++ b/packages/html/html/src/components/media-volume-range.ts
@@ -19,7 +19,7 @@ export class VolumeRangeBase extends HTMLElement {
   constructor() {
     super();
     /**
-     * @TODO This is just a simple render function to demonstrate functionality.
+     * @TODO This is just a simple placeholder input to demonstrate functionality.
      * A full implementation will need to implement a "compound component" architecture and likely should use templates. (CJP)
      **/
     this._input = document.createElement('input');
@@ -108,6 +108,9 @@ export const useVolumeRangeProps: PropsHook<{
   return baseProps;
 };
 
+/**
+ * @TODO When implementing compound components, this function may need to be swapped out, modified, or augmented in some way or another. (CJP)
+ */
 /**
  * Connected VolumeRange component using hook-style architecture
  * Equivalent to React's VolumeRange = toConnectedComponent(...)
diff --git a/packages/react/react/src/components/TimeRange.tsx b/packages/react/react/src/components/TimeRange.tsx
index fe597d9c..8fa7732b 100644
--- a/packages/react/react/src/components/TimeRange.tsx
+++ b/packages/react/react/src/components/TimeRange.tsx
@@ -93,6 +93,9 @@ export const renderTimeRange = (
 
 export type renderTimeRange = typeof renderTimeRange;
 
+/**
+ * @TODO When implementing compound components, this function may need to be swapped out, modified, or augmented in some way or another. (CJP)
+ */
 export const TimeRange = toConnectedComponent(
   useTimeRangeState,
   useTimeRangeProps,
diff --git a/packages/react/react/src/components/VolumeRange.tsx b/packages/react/react/src/components/VolumeRange.tsx
index cd5d54ea..809bc0bc 100644
--- a/packages/react/react/src/components/VolumeRange.tsx
+++ b/packages/react/react/src/components/VolumeRange.tsx
@@ -83,6 +83,9 @@ export const renderVolumeRange = (
 
 export type renderVolumeRange = typeof renderVolumeRange;
 
+/**
+ * @TODO When implementing compound components, this function may need to be swapped out, modified, or augmented in some way or another. (CJP)
+ */
 export const VolumeRange = toConnectedComponent(
   useVolumeRangeState,
   useVolumeRangeProps,