From bc463802d975e7218ef8bdb5edf022d55f9ed3d0 Mon Sep 17 00:00:00 2001
From: Alex Holliday <ajhollid@gmail.com>
Date: Tue, 7 May 2024 14:30:00 -0700
Subject: [PATCH] Updated JSdocs

---
 Client/src/Components/Button/index.jsx       | 12 ++++++++----
 Client/src/Components/Label/BaseLabel.jsx    |  2 +-
 Client/src/Components/Label/ColoredLabel.jsx |  5 ++++-
 Client/src/Components/Label/StautsLabel.jsx  |  3 +++
 4 files changed, 16 insertions(+), 6 deletions(-)

diff --git a/Client/src/Components/Button/index.jsx b/Client/src/Components/Button/index.jsx
index 4d479495e..66a345746 100644
--- a/Client/src/Components/Button/index.jsx
+++ b/Client/src/Components/Button/index.jsx
@@ -21,10 +21,14 @@ const levelConfig = {
 };
 
 /**
- * @param {Object} Props
- * @param {'primary' | 'secondary' | 'tertiary' | 'error'} level - The level of the button
- * @param {string} label - The label of the button
- * @param {boolean} [disabled] - Whether the button is disabled
+ * @param {Object} props
+ * @param {'primary' | 'secondary' | 'tertiary' | 'error'} props.level - The level of the button
+ * @param {string} props.label - The label of the button
+ * @param {boolean} [props.disabled] - Whether the button is disabled
+ * @returns {JSX.Element}
+ * @example
+ * // Render an error button
+ * <Button level="error" label="Error" disabled />
  */
 
 const Button = ({ level, label, disabled }) => {
diff --git a/Client/src/Components/Label/BaseLabel.jsx b/Client/src/Components/Label/BaseLabel.jsx
index d44104e80..aa23aeab3 100644
--- a/Client/src/Components/Label/BaseLabel.jsx
+++ b/Client/src/Components/Label/BaseLabel.jsx
@@ -14,7 +14,7 @@ import { useTheme } from "@mui/material";
  * @param {Object} props
  * @param {string} props.label - The label of the label
  * @param {Styles} props.styles - CSS Styles passed from parent component
- * @param {React.ReactNode} children - CSS Styles passed from parent component
+ * @param {React.ReactNode} children - Children passed from parent component
  * @returns {JSX.Element}
  */
 
diff --git a/Client/src/Components/Label/ColoredLabel.jsx b/Client/src/Components/Label/ColoredLabel.jsx
index 86c3059ca..744652050 100644
--- a/Client/src/Components/Label/ColoredLabel.jsx
+++ b/Client/src/Components/Label/ColoredLabel.jsx
@@ -26,8 +26,11 @@ const lightenColor = (color, percent) => {
  * @component
  * @param {Object} props
  * @param {string} props.label - The label of the label
- * @param {string} props.color - The color of the label
+ * @param {string} props.color - The color of the label, specified in #RRGGBB format
  * @returns {JSX.Element}
+ * @example
+ * // Render a red label
+ * <ColoredLabel label="Label" color="#FF0000" />
  */
 
 const ColoredLabel = ({ label, color }) => {
diff --git a/Client/src/Components/Label/StautsLabel.jsx b/Client/src/Components/Label/StautsLabel.jsx
index b82167e14..19423d838 100644
--- a/Client/src/Components/Label/StautsLabel.jsx
+++ b/Client/src/Components/Label/StautsLabel.jsx
@@ -8,6 +8,9 @@ import { useTheme } from "@mui/material";
  * @param {Object} props
  * @param {'Seen' | 'Waiting' | 'New' | 'Active'} props.status - The status for the label
  * @returns {JSX.Element}
+ * @example
+ * // Render an active label
+ * <StatusLabel status="Active" />
  */
 
 const StatusLabel = ({ status }) => {