HSD8-1574 Display "all" option for single select fields

SU-HSDO · Feb 6, 2024 · 4b44634 · 4b44634
1 parent 18356e3
commit 4b44634
Show file tree

Hide file tree

Showing 4 changed files with 251 additions and 135 deletions.
diff --git a/...files/humsci/su_humsci_profile/js/select-lists/dist/islands/select-list-filters.island.js b/...files/humsci/su_humsci_profile/js/select-lists/dist/islands/select-list-filters.island.js
diff --git a/docroot/profiles/humsci/su_humsci_profile/js/select-lists/package.json b/docroot/profiles/humsci/su_humsci_profile/js/select-lists/package.json
@@ -16,23 +16,23 @@
   },
   "dependencies": {
     "@heroicons/react": "^2.1.1",
-    "@mui/base": "^5.0.0-beta.32",
+    "@mui/base": "^5.0.0-beta.34",
     "preact": "^10.19.3",
     "styled-components": "^6.1.8"
   },
   "devDependencies": {
-    "@babel/core": "^7.23.0",
-    "@babel/preset-env": "^7.23.8",
+    "@babel/core": "^7.23.9",
+    "@babel/preset-env": "^7.23.9",
     "@babel/preset-react": "^7.23.3",
     "@babel/preset-typescript": "^7.23.3",
     "@types/webpack": "^5.28.5",
     "babel-loader": "^9.1.3",
-    "css-loader": "^6.9.1",
+    "css-loader": "^6.10.0",
     "dotenv-webpack": "^8.0.1",
     "html-webpack-plugin": "^5.6.0",
     "preact-island": "^1.1.2",
     "terser-webpack-plugin": "^5.3.10",
-    "webpack": "^5.89.0",
+    "webpack": "^5.90.1",
     "webpack-cli": "^5.1.4",
     "webpack-dev-server": "^4.15.1"
   },

diff --git a/docroot/profiles/humsci/su_humsci_profile/js/select-lists/src/select-list.tsx b/docroot/profiles/humsci/su_humsci_profile/js/select-lists/src/select-list.tsx
@@ -87,11 +87,6 @@ function CustomOption(props: OptionProps) {
     }
   }, [rootRef, id])
 
-  if (value === '1111') {
-    console.log('selected', selected);
-    console.log('highlighted', highlighted);
-    console.log('disabled', disabled);
-  }
   return (
     <StyledOption
       {...otherProps}
@@ -193,6 +188,11 @@ const SelectList = ({options = [], label, multiple, ariaLabelledby, required, de
               {renderSelectedValue(value, options)}
             </span>
           }
+          {(!optionChosen && !multiple) &&
+            <span style={{padding: "8px 5px 8px 0", color: "#4c4740"}}>
+              {emptyLabel}
+            </span>
+          }
           {(!optionChosen && multiple) &&
             <span style={{padding: "8px 5px 8px 0", color: "#4c4740"}}>
               Choose one or more from dropdown
@@ -234,7 +234,6 @@ const SelectList = ({options = [], label, multiple, ariaLabelledby, required, de
             }
 
             {options.map(option => {
-              console.log(option);
               return (
                 <CustomOption key={option.value} value={option.value} disabled={option.disabled} rootRef={listboxRef} id={`${name}-${option.value.replace(/\W+/g, '-')}`}>
                   {option.label}