@homebound/beam 2.405.0 → 2.406.0

package/dist/index.cjs

@@ -10593,6 +10593,7 @@ function ComboBoxBase(props) {
     fullWidth = fieldProps?.fullWidth ?? false,
     onSearch,
     onAddNew,
+    autoSort = true,
     ...otherProps
   } = props;
   const labelStyle = otherProps.labelStyle ?? fieldProps?.labelStyle ?? "above";
@@ -10615,11 +10616,11 @@ function ComboBoxBase(props) {
     [unsetLabel, getOptionLabel]
   );
   const options = (0, import_react46.useMemo)(
-    () => initializeOptions(propOptions, getOptionValue, unsetLabel, !!onAddNew),
+    () => initializeOptions(propOptions, getOptionValue, getOptionLabel, unsetLabel, !!onAddNew, autoSort),
     // If the caller is using { current, load, options }, memoize on only `current` and `options` values.
     // ...and don't bother on memoizing on getOptionValue b/c it's basically always a lambda
     // eslint-disable-next-line react-hooks/exhaustive-deps
-    Array.isArray(propOptions) ? [propOptions, unsetLabel, onAddNew] : [propOptions.current, propOptions.options, unsetLabel, onAddNew]
+    Array.isArray(propOptions) ? [propOptions, unsetLabel, onAddNew, autoSort] : [propOptions.current, propOptions.options, unsetLabel, onAddNew, autoSort]
   );
   const values = (0, import_react46.useMemo)(() => propValues ?? [], [propValues]);
   const inputStylePalette = (0, import_react46.useMemo)(() => propsInputStylePalette, [propsInputStylePalette]);
@@ -10839,17 +10840,18 @@ function ComboBoxBase(props) {
 function getInputValue(selectedOptions, getOptionLabel, multiselect, nothingSelectedText, readOnly) {
   return selectedOptions.length === 1 ? getOptionLabel(selectedOptions[0]) : readOnly && selectedOptions.length > 0 ? selectedOptions.map(getOptionLabel).join(", ") : multiselect && selectedOptions.length === 0 ? nothingSelectedText : "";
 }
-function initializeOptions(optionsOrLoad, getOptionValue, unsetLabel, addNew) {
-  const opts = [];
+function initializeOptions(optionsOrLoad, getOptionValue, getOptionLabel, unsetLabel, addNew, autoSort) {
+  const result = [];
   if (unsetLabel) {
-    opts.push(unsetOption);
+    result.push(unsetOption);
   }
+  const userOptions = [];
   if (Array.isArray(optionsOrLoad)) {
-    opts.push(...optionsOrLoad);
+    userOptions.push(...optionsOrLoad);
   } else {
     const { options, current } = optionsOrLoad;
     if (options) {
-      opts.push(...options);
+      userOptions.push(...options);
     }
     if (current) {
       const toCheck = Array.isArray(current) ? current : [current];
@@ -10857,15 +10859,23 @@ function initializeOptions(optionsOrLoad, getOptionValue, unsetLabel, addNew) {
         const value = getOptionValue(current2);
         const found = options && options.find((o) => getOptionValue(o) === value);
         if (!found) {
-          opts.push(current2);
+          userOptions.push(current2);
         }
       });
     }
   }
+  result.push(...autoSort ? sortOptions(userOptions, getOptionLabel) : userOptions);
   if (addNew) {
-    opts.push(addNewOption);
+    result.push(addNewOption);
   }
-  return opts;
+  return result;
+}
+function sortOptions(options, getOptionLabel) {
+  return [...options].sort((a, b) => {
+    const labelA = getOptionLabel(a).toLowerCase();
+    const labelB = getOptionLabel(b).toLowerCase();
+    return labelA.localeCompare(labelB);
+  });
 }
 var unsetOption = {};
 var addNewOption = { id: "new", name: "Add New" };
@@ -17611,6 +17621,7 @@ function Pagination(props) {
         options: pageOptions,
         value: pageSize,
         onSelect: (val) => set({ pageNumber: 1, pageSize: val }),
+        autoSort: false,
         ...tid.pageSize
       }
     ) }),