rm getInputStylePalette as its not actually needed;

src/components/PresentationContext.tsx

@@ -30,6 +30,7 @@ export interface PresentationFieldProps {
 }
 
 export type PresentationContextProps = {
+  /** `inputStylePalette` omitted because it is too dependent on the individual field use case to be controlled at this level  */
   fieldProps?: Omit<PresentationFieldProps, "inputStylePalette">;
   gridTableStyle?: GridStyle;
   // Defines whether content should be allowed to wrap or not. `undefined` is treated as true.

src/inputs/SelectField.stories.tsx

@@ -3,6 +3,7 @@ import { Meta } from "@storybook/react";
 import { within } from "@storybook/test";
 import { useState } from "react";
 import { GridColumn, GridTable, Icon, IconKey, simpleHeader, SimpleHeaderAndData } from "src/components";
+import { InputStylePalette } from "src/components/PresentationContext";
 import { Css } from "src/Css";
 import { SelectField, SelectFieldProps } from "src/inputs/SelectField";
 import { Value } from "src/inputs/Value";
@@ -233,36 +234,30 @@ export const Contrast = Template.bind({});
 Contrast.args = { compact: true, contrast: true };
 
 // @ts-ignore
-function getInputStylePalette(v) {
+function getInputStylePalette(v): InputStylePalette | undefined {
   if (v?.includes(1) || v?.includes("1")) return "success";
   if (v?.includes(2) || v?.includes("2")) return "caution";
   if (v?.includes(3) || v?.includes("3")) return "warning";
   if (v?.includes(4) || v?.includes("4")) return "info";
   return undefined;
 }
 
-const standardColoredSelectArgs = {
-  options: coloredOptions,
-  // @ts-ignore
-  getInputStylePalette,
-};
-
 export const Colored = Template.bind({});
 // @ts-ignore
-Colored.args = standardColoredSelectArgs;
+Colored.args = { options: coloredOptions };
 
 export const ColoredContrast = Template.bind({});
 // @ts-ignore
 ColoredContrast.args = {
   contrast: true,
-  ...standardColoredSelectArgs,
+  options: coloredOptions,
 };
 
 export const ColoredCompact = Template.bind({});
 // @ts-ignore
 ColoredCompact.args = {
   compact: true,
-  ...standardColoredSelectArgs,
+  options: coloredOptions,
 };
 
 const loadTestOptions: TestOption[] = zeroTo(1000).map((i) => ({ id: String(i), name: `Project ${i}` }));
@@ -413,15 +408,23 @@ function TestSelectField<T extends object, V extends Value>(
   props: Optional<Omit<SelectFieldProps<T, V>, "onSelect">, "getOptionValue" | "getOptionLabel">,
 ): JSX.Element {
   const [selectedOption, setSelectedOption] = useState<V | undefined>(props.value);
+  const [inputStylePalette, setInputStylePalette] = useState<InputStylePalette | undefined>();
+
+  // @ts-ignore: Hacking around type props within the testSelectField instead of the SB Template
+  const shouldUseStylePalette: boolean = !!props.options?.some((o) => o.name.includes("style palette when selected"));
 
   return (
     <div css={Css.df.$}>
       <SelectField<T, V>
         // The `as any` is due to something related to https://github.com/emotion-js/emotion/issues/2169
         // We may have to redo the conditional getOptionValue/getOptionLabel
         {...(props as any)}
+        inputStylePalette={shouldUseStylePalette ? inputStylePalette : undefined}
         value={selectedOption}
-        onSelect={setSelectedOption}
+        onSelect={(v, opt) => {
+          setSelectedOption(v);
+          setInputStylePalette(getInputStylePalette(v));
+        }}
         errorMsg={
           selectedOption !== undefined || props.disabled
             ? ""

src/inputs/internal/ComboBoxBase.tsx

@@ -5,7 +5,7 @@ import { useButton, useComboBox, useFilter, useOverlayPosition } from "react-ari
 import { Item, useComboBoxState, useMultipleSelectionState } from "react-stately";
 import { resolveTooltip } from "src/components";
 import { Popover } from "src/components/internal";
-import { InputStylePalette, PresentationFieldProps, usePresentationContext } from "src/components/PresentationContext";
+import { PresentationFieldProps, usePresentationContext } from "src/components/PresentationContext";
 import { Css } from "src/Css";
 import { ComboBoxInput } from "src/inputs/internal/ComboBoxInput";
 import { ListBox } from "src/inputs/internal/ListBox";
@@ -20,8 +20,6 @@ export interface ComboBoxBaseProps<O, V extends Value> extends BeamFocusableProp
   getOptionMenuLabel?: (opt: O, isUnsetOpt?: boolean, isAddNewOption?: boolean) => string | ReactNode;
   getOptionValue: (opt: O) => V;
   getOptionLabel: (opt: O) => string;
-  /** Sets an input style based on the option(s) selected if `inputStylePalette` is not set */
-  getInputStylePalette?: (values: V[] | undefined) => InputStylePalette | undefined;
   /** The current value; it can be `undefined`, even if `V` cannot be. */
   values: V[] | undefined;
   onSelect: (values: V[], opts: O[]) => void;
@@ -95,7 +93,6 @@ export function ComboBoxBase<O, V extends Value>(props: ComboBoxBaseProps<O, V>)
     borderless,
     unsetLabel,
     inputStylePalette: propsInputStylePalette,
-    getInputStylePalette,
     getOptionLabel: propOptionLabel,
     getOptionValue: propOptionValue,
     getOptionMenuLabel: propOptionMenuLabel,
@@ -151,14 +148,7 @@ export function ComboBoxBase<O, V extends Value>(props: ComboBoxBaseProps<O, V>)
   );
 
   const values = useMemo(() => propValues ?? [], [propValues]);
-  const inputStylePalette = useMemo(() => {
-    if (propsInputStylePalette) {
-      return propsInputStylePalette;
-    } else if (getInputStylePalette) {
-      return getInputStylePalette(values);
-    }
-    return undefined;
-  }, [propsInputStylePalette, getInputStylePalette, values]);
+  const inputStylePalette = useMemo(() => propsInputStylePalette, [propsInputStylePalette]);
 
   const selectedOptionsRef = useRef(options.filter((o) => values.includes(getOptionValue(o))));
   const selectedOptions = useMemo(() => {