update modals & text & design

app/component/element/AutoCompleteSelect.js

@@ -10,13 +10,15 @@ function AutoCompleteSelect({
   name,
   label,
   disabled = false,
+  listboxProps
 }) {
   return (
     <Autocomplete
-      value={value || null}
       disablePortal
       options={list}
       disabled={disabled}
+      value={value || null}
+      ListboxProps={listboxProps}
       className="!w-full !rounded-lg auto-complete-selector"
       onChange={(event, newValue) => {
         updateData && updateData(newValue ? newValue.label : "", name);
@@ -25,9 +27,9 @@ function AutoCompleteSelect({
         ...styleTextSelectRight,
         // Hide Icon Number
         "& input::-webkit-outer-spin-button, & input::-webkit-inner-spin-button":
-          {
-            display: "none",
-          },
+        {
+          display: "none",
+        },
         "& input[type=number]": {
           MozAppearance: "textfield",
         },
@@ -46,13 +48,13 @@ function AutoCompleteSelect({
           border: "1px solid #D7D7D7",
         },
         "& .MuiInput-underline:hover:not(.Mui-disabled):before, .MuiOutlinedInput-notchedOutline":
-          {
-            borderColor: "#D7D7D7 !important",
-          },
+        {
+          borderColor: "#D7D7D7 !important",
+        },
         "& .muirtl-1kiro5a-MuiInputBase-root-MuiOutlinedInput-root.Mui-focused .MuiOutlinedInput-notchedOutline":
-          {
-            border: "1px solid #5559CE !important",
-          },
+        {
+          border: "1px solid #5559CE !important",
+        },
         "& .MuiOutlinedInput-notchedOutline": {
           border: isError ? "1px solid red !important" : "",
         },