From 33b59255db6b5fa9d8c2f5d14e2c5ce59759645d Mon Sep 17 00:00:00 2001
From: ssingh <ssingh@easypost.com>
Date: Mon, 13 Nov 2023 17:16:16 -0800
Subject: [PATCH] add console warnings

---
 easy-ui-react/src/InputField/InputField.tsx |  4 ++++
 easy-ui-react/src/InputField/utilities.ts   | 10 ++++++++++
 easy-ui-react/src/Select/Select.tsx         |  4 ++++
 3 files changed, 18 insertions(+)

diff --git a/easy-ui-react/src/InputField/InputField.tsx b/easy-ui-react/src/InputField/InputField.tsx
index 07ba1f58..e81ad5a3 100644
--- a/easy-ui-react/src/InputField/InputField.tsx
+++ b/easy-ui-react/src/InputField/InputField.tsx
@@ -11,6 +11,7 @@ import { useInputField } from "./useInputField";
 import styles from "./InputField.module.scss";
 import {
   getElementType,
+  logWarningForMissingAriaLabel,
   logWarningsForInvalidPropConfiguration,
 } from "./utilities";
 
@@ -106,6 +107,7 @@ export function InputField(props: InputFieldProps) {
     validationState = "valid",
     isLabelEmphasized = false,
     autoFocus = false,
+    "aria-label": ariaLabel,
     label,
     errorText,
     helperText,
@@ -135,6 +137,8 @@ export function InputField(props: InputFieldProps) {
     definedIconsWithTextarea,
   );
 
+  logWarningForMissingAriaLabel(label, ariaLabel);
+
   const isPassword = type === "password";
   const hasError = validationState === "invalid";
   const showErrorText = hasError && errorText;
diff --git a/easy-ui-react/src/InputField/utilities.ts b/easy-ui-react/src/InputField/utilities.ts
index 9d25fc76..a2820a95 100644
--- a/easy-ui-react/src/InputField/utilities.ts
+++ b/easy-ui-react/src/InputField/utilities.ts
@@ -1,3 +1,4 @@
+import { ReactNode } from "react";
 import { InputSize } from "./InputField";
 
 /** Small fields need xs icon */
@@ -28,6 +29,15 @@ export function logWarningsForInvalidPropConfiguration(
   }
 }
 
+export function logWarningForMissingAriaLabel(
+  label: ReactNode,
+  ariaLabel: string | undefined,
+) {
+  if (!label && !ariaLabel) {
+    console.warn("An aria-label must be provided if omitting `label`");
+  }
+}
+
 export function getElementType(isMultiline: boolean) {
   return isMultiline ? "textarea" : "input";
 }
diff --git a/easy-ui-react/src/Select/Select.tsx b/easy-ui-react/src/Select/Select.tsx
index 36a746de..6504e467 100644
--- a/easy-ui-react/src/Select/Select.tsx
+++ b/easy-ui-react/src/Select/Select.tsx
@@ -8,6 +8,7 @@ import { SelectOption } from "./SelectOption";
 import { SelectSection } from "./SelectSection";
 import { SelectOverlay } from "./SelectOverlay";
 import { useTriggerWidth } from "../Menu/useTriggerWidth";
+import { logWarningForMissingAriaLabel } from "../InputField/utilities";
 
 export type BaseSelectProps<T> = {
   /** Method that is called when the open state of the select field changes. */
@@ -96,6 +97,7 @@ export function Select<T extends object>(props: SelectProps<T>) {
     validationState,
     isLabelEmphasized,
     size = "md",
+    "aria-label": ariaLabel,
     label,
     errorText,
     helperText,
@@ -106,6 +108,8 @@ export function Select<T extends object>(props: SelectProps<T>) {
   const triggerRef = React.useRef(null);
   const selectState = useSelectState(props);
 
+  logWarningForMissingAriaLabel(label, ariaLabel);
+
   const {
     labelProps,
     valueProps,