diff --git a/src/vs/base/browser/ui/positronComponents/button/button.css b/src/vs/base/browser/ui/positronComponents/button/button.css
index 415d1e04d62..3fc256a2d0b 100644
--- a/src/vs/base/browser/ui/positronComponents/button/button.css
+++ b/src/vs/base/browser/ui/positronComponents/button/button.css
@@ -6,7 +6,10 @@
 	border: none;
 	cursor: pointer;
 	background-color: transparent;
+
+	/* Unset user agent stylesheet styles. */
 	font-family: unset !important;
+	text-align: unset !important;
 }
 
 .positron-button:focus {
diff --git a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.css b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.css
index fbca2b23cd7..53c9eea95c3 100644
--- a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.css
+++ b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.css
@@ -18,9 +18,7 @@
 
 .drop-down-list-box
 .title {
-	display: flex;
 	padding-left: 6px;
-	align-items: center;
 	grid-column: title / chevron;
 	color: var(--vscode-positronContextMenu-foreground);
 }
@@ -33,10 +31,6 @@
 	grid-column: chevron / end;
 }
 
-.drop-down-list-box
-.chevron.disabled {
-}
-
 .drop-down-list-box-items {
 	width: 100%;
 	margin: 4px;
diff --git a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.tsx b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.tsx
index 95702891a0b..1a6ec30cefd 100644
--- a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.tsx
+++ b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox.tsx
@@ -20,29 +20,35 @@ import { PositronModalPopup } from 'vs/workbench/browser/positronComponents/posi
 import { PositronModalReactRenderer } from 'vs/workbench/browser/positronModalReactRenderer/positronModalReactRenderer';
 import { DropDownListBoxSeparator } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxSeparator';
 
+/**
+ * DropDownListBoxEntry type.
+ */
+export type DropDownListBoxEntry<T extends NonNullable<any>, V extends NonNullable<any>> = DropDownListBoxItem<T, V> | DropDownListBoxSeparator;
+
 /**
  * DropDownListBoxProps interface.
  */
-interface DropDownListBoxProps {
+interface DropDownListBoxProps<T extends NonNullable<any>, V extends NonNullable<any>> {
 	keybindingService: IKeybindingService;
 	layoutService: ILayoutService;
 	className?: string;
 	disabled?: boolean;
 	title: string;
-	entries: (DropDownListBoxItem | DropDownListBoxSeparator)[];
-	selectedIdentifier?: string;
-	onSelectionChanged: (identifier: string) => void;
+	entries: DropDownListBoxEntry<T, V>[];
+	createItem?: (dropDownListBoxItem: DropDownListBoxItem<T, V>) => JSX.Element;
+	selectedIdentifier?: T;
+	onSelectionChanged: (dropDownListBoxItem: DropDownListBoxItem<T, V>) => void;
 }
 
 /**
  * Finds a drop down list box item by identifier.
- * @param identifier The identifier of the drop down list box item to find.
  * @param entries The set of drop down list box entries.
+ * @param identifier The identifier of the drop down list box item to find.
  * @returns The drop down list box item, if it was found; otherwise, undefined.
  */
-const findDropDownListBoxItem = (
-	identifier: string | undefined,
-	entries: (DropDownListBoxItem | DropDownListBoxSeparator)[]
+const findDropDownListBoxItem = <T extends NonNullable<any>, V>(
+	entries: DropDownListBoxEntry<T, V>[],
+	identifier?: T | undefined
 ) => {
 	// Find the drop down list box item.
 	for (let i = 0; i < entries.length; i++) {
@@ -61,23 +67,23 @@ const findDropDownListBoxItem = (
  * @param props The component properties.
  * @returns The rendered component.
  */
-export const DropDownListBox = (props: DropDownListBoxProps) => {
+export const DropDownListBox = <T extends NonNullable<any>, V,>(props: DropDownListBoxProps<T, V>) => {
 	// Reference hooks.
 	const ref = useRef<HTMLButtonElement>(undefined!);
 
 	// State hooks.
 	const [selectedDropDownListBoxItem, setSelectedDropDownListBoxItem] =
-		useState<DropDownListBoxItem | undefined>(
-			findDropDownListBoxItem(props.selectedIdentifier, props.entries)
+		useState<DropDownListBoxItem<T, V> | undefined>(
+			findDropDownListBoxItem(props.entries, props.selectedIdentifier)
 		);
 	const [highlightedDropDownListBoxItem, setHighlightedDropDownListBoxItem] =
-		useState<DropDownListBoxItem | undefined>(undefined);
+		useState<DropDownListBoxItem<T, V> | undefined>(undefined);
 
 	// Updates the selected drop down list box item.
 	useEffect(() => {
 		setSelectedDropDownListBoxItem(findDropDownListBoxItem(
+			props.entries,
 			props.selectedIdentifier,
-			props.entries
 		));
 	}, [props.entries, props.selectedIdentifier]);
 
@@ -85,14 +91,22 @@ export const DropDownListBox = (props: DropDownListBoxProps) => {
 	 * Gets the title to display.
 	 * @returns The title to display.
 	 */
-	const titleToDisplay = () => {
-		if (highlightedDropDownListBoxItem) {
-			return highlightedDropDownListBoxItem.options.title;
-		} else if (selectedDropDownListBoxItem) {
-			return selectedDropDownListBoxItem.options.title;
+	const Title = () => {
+		if (!props.createItem) {
+			if (highlightedDropDownListBoxItem) {
+				return <span>{highlightedDropDownListBoxItem.options.title}</span>;
+			} else if (selectedDropDownListBoxItem) {
+				return <span>{selectedDropDownListBoxItem.options.title}</span>;
+			}
 		} else {
-			return props.title;
+			if (highlightedDropDownListBoxItem) {
+				return props.createItem(highlightedDropDownListBoxItem);
+			} else if (selectedDropDownListBoxItem) {
+				return props.createItem(selectedDropDownListBoxItem);
+			}
 		}
+
+		return <span>{props.title}</span>;
 	};
 
 	// Render.
@@ -115,23 +129,26 @@ export const DropDownListBox = (props: DropDownListBoxProps) => {
 
 				// Show the drop down list box modal popup.
 				renderer.render(
-					<DropDownListBoxModalPopup
+					<DropDownListBoxModalPopup<T, V>
 						renderer={renderer}
 						anchor={ref.current}
 						entries={props.entries}
+						createItem={props.createItem}
 						onItemHighlighted={dropDownListBoxItem =>
 							setHighlightedDropDownListBoxItem(dropDownListBoxItem)
 						}
 						onItemSelected={dropDownListBoxItem => {
 							setSelectedDropDownListBoxItem(dropDownListBoxItem);
-							props.onSelectionChanged(dropDownListBoxItem.options.identifier);
+							props.onSelectionChanged(dropDownListBoxItem);
 						}}
 					/>
 				);
 			}}
 		>
-			<div className='title'>{titleToDisplay()}</div>
-			<div className={positronClassNames('chevron', { 'disabled': props.disabled })} aria-hidden='true'>
+			<div className='title'>
+				<Title />
+			</div>
+			<div className='chevron' aria-hidden='true'>
 				<div className='codicon codicon-chevron-down' />
 			</div>
 		</Button>
@@ -141,12 +158,13 @@ export const DropDownListBox = (props: DropDownListBoxProps) => {
 /**
  * DropDownListBoxModalPopupProps interface.
  */
-interface DropDownListBoxModalPopupProps {
+interface DropDownListBoxModalPopupProps<T, V> {
 	renderer: PositronModalReactRenderer;
 	anchor: HTMLElement;
-	entries: (DropDownListBoxItem | DropDownListBoxSeparator)[];
-	onItemHighlighted: (dropdownListBoxItem: DropDownListBoxItem) => void;
-	onItemSelected: (dropdownListBoxItem: DropDownListBoxItem) => void;
+	entries: DropDownListBoxEntry<T, V>[];
+	createItem?: (dropDownListBoxItem: DropDownListBoxItem<T, V>) => JSX.Element;
+	onItemHighlighted: (dropdownListBoxItem: DropDownListBoxItem<T, V>) => void;
+	onItemSelected: (dropdownListBoxItem: DropDownListBoxItem<T, V>) => void;
 }
 
 /**
@@ -154,7 +172,7 @@ interface DropDownListBoxModalPopupProps {
  * @param props The component properties.
  * @returns The rendered component.
  */
-const DropDownListBoxModalPopup = (props: DropDownListBoxModalPopupProps) => {
+const DropDownListBoxModalPopup = <T, V,>(props: DropDownListBoxModalPopupProps<T, V>) => {
 	// Render.
 	return (
 		<PositronModalPopup
@@ -181,24 +199,30 @@ const DropDownListBoxModalPopup = (props: DropDownListBoxModalPopupProps) => {
 									props.onItemSelected(entry);
 								}}
 							>
-								<div
-									className={positronClassNames(
-										'title',
-										{ 'disabled': entry.options.disabled }
-									)}
-								>
-									{entry.options.title}
-								</div>
-								{entry.options.icon &&
-									<div
-										className={positronClassNames(
-											'icon',
-											'codicon',
-											`codicon-${entry.options.icon}`,
-											{ 'disabled': entry.options.disabled }
-										)}
-										title={entry.options.title}
-									/>
+								{props.createItem && props.createItem(entry)}
+								{!props.createItem && (
+									<>
+										<div
+											className={positronClassNames(
+												'title',
+												{ 'disabled': entry.options.disabled }
+											)}
+										>
+											{entry.options.title}
+										</div>
+										{entry.options.icon &&
+											<div
+												className={positronClassNames(
+													'icon',
+													'codicon',
+													`codicon-${entry.options.icon}`,
+													{ 'disabled': entry.options.disabled }
+												)}
+												title={entry.options.title}
+											/>
+										}
+									</>
+								)
 								}
 							</Button>
 						);
diff --git a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem.ts b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem.ts
index 9834a8f8d55..dd9f318e808 100644
--- a/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem.ts
+++ b/src/vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem.ts
@@ -5,20 +5,21 @@
 /**
  * DropDownListBoxItemOptions interface.
  */
-export interface DropDownListBoxItemOptions {
-	readonly identifier: string;
-	readonly title: string;
+export interface DropDownListBoxItemOptions<T extends NonNullable<any>, V extends NonNullable<any>> {
+	readonly identifier: T;
+	readonly title?: string;
 	readonly icon?: string;
 	readonly disabled?: boolean;
+	value: V;
 }
 
 /**
  * DropDownListBoxItem class.
  */
-export class DropDownListBoxItem {
+export class DropDownListBoxItem<T extends NonNullable<any>, V extends NonNullable<any>> {
 	/**
 	 * Constructor.
 	 * @param options A DropDownListBoxItemOptions that contains the down list box item options.
 	 */
-	constructor(readonly options: DropDownListBoxItemOptions) { }
+	constructor(readonly options: DropDownListBoxItemOptions<T, V>) { }
 }
diff --git a/src/vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/addEditRowFilterModalPopup.tsx b/src/vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/addEditRowFilterModalPopup.tsx
index 7f8fdb2cfb8..0d30ee59b15 100644
--- a/src/vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/addEditRowFilterModalPopup.tsx
+++ b/src/vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/addEditRowFilterModalPopup.tsx
@@ -12,13 +12,13 @@ import { useEffect, useRef, useState } from 'react'; // eslint-disable-line no-d
 // Other dependencies.
 import { localize } from 'vs/nls';
 import { Button } from 'vs/base/browser/ui/positronComponents/button/button';
-import { DropDownListBox } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox';
 import { DropDownListBoxItem } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem';
 import { PositronModalPopup } from 'vs/workbench/browser/positronComponents/positronModalPopup/positronModalPopup';
+import { ColumnSchema, ColumnDisplayType } from 'vs/workbench/services/languageRuntime/common/positronDataExplorerComm';
 import { PositronModalReactRenderer } from 'vs/workbench/browser/positronModalReactRenderer/positronModalReactRenderer';
 import { DropDownListBoxSeparator } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxSeparator';
 import { DataExplorerClientInstance } from 'vs/workbench/services/languageRuntime/common/languageRuntimeDataExplorerClient';
-import { ColumnSchema, ColumnDisplayType } from 'vs/workbench/services/languageRuntime/common/positronDataExplorerComm';
+import { DropDownListBox, DropDownListBoxEntry } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox';
 import { RowFilterParameter } from 'vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/components/rowFilterParameter';
 import { DropDownColumnSelector } from 'vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/components/dropDownColumnSelector';
 import { RangeRowFilter, RowFilter, RowFilterCondition, RowFilterIsBetween, RowFilterIsEmpty, RowFilterIsEqualTo, RowFilterIsGreaterThan, RowFilterIsLessThan, RowFilterIsNotBetween, RowFilterIsNotEmpty, SingleValueRowFilter } from 'vs/workbench/browser/positronDataExplorer/components/dataExplorerPanel/components/addEditRowFilterModalPopup/rowFilter';
@@ -99,7 +99,7 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 	const [selectedColumnSchema, setSelectedColumnSchema] = useState<ColumnSchema | undefined>(
 		props.editRowFilter?.columnSchema
 	);
-	const [selectedCondition, setSelectedCondition] = useState<string | undefined>(
+	const [selectedCondition, setSelectedCondition] = useState<RowFilterCondition | undefined>(
 		props.editRowFilter?.rowFilterCondition
 	);
 	const [firstRowFilterValue, setFirstRowFilterValue] = useState<string>(() => {
@@ -139,7 +139,7 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 		}
 
 		// Build the condition entries.
-		const conditionEntries: (DropDownListBoxItem | DropDownListBoxSeparator)[] = [];
+		const conditionEntries: DropDownListBoxEntry<RowFilterCondition, void>[] = [];
 
 		// Every type allows is empty and is not empty conditions.
 		conditionEntries.push(new DropDownListBoxItem({
@@ -147,14 +147,16 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 			title: localize(
 				'positron.addEditRowFilter.conditionIsEmpty',
 				"is empty"
-			)
+			),
+			value: RowFilterCondition.CONDITION_IS_EMPTY
 		}));
 		conditionEntries.push(new DropDownListBoxItem({
 			identifier: RowFilterCondition.CONDITION_IS_NOT_EMPTY,
 			title: localize(
 				'positron.addEditRowFilter.conditionIsNotEmpty',
 				"is not empty"
-			)
+			),
+			value: RowFilterCondition.CONDITION_IS_NOT_EMPTY
 		}));
 		conditionEntries.push(new DropDownListBoxSeparator());
 
@@ -169,14 +171,16 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 					title: localize(
 						'positron.addEditRowFilter.conditionIsLessThan',
 						"is less than"
-					)
+					),
+					value: RowFilterCondition.CONDITION_IS_LESS_THAN
 				}));
 				conditionEntries.push(new DropDownListBoxItem({
 					identifier: RowFilterCondition.CONDITION_IS_GREATER_THAN,
 					title: localize(
 						'positron.addEditRowFilter.conditionIsGreaterThan',
 						"is greater than"
-					)
+					),
+					value: RowFilterCondition.CONDITION_IS_GREATER_THAN
 				}));
 				break;
 		}
@@ -194,7 +198,8 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 					title: localize(
 						'positron.addEditRowFilter.conditionIsEqualTo',
 						"is equal to"
-					)
+					),
+					value: RowFilterCondition.CONDITION_IS_EQUAL_TO
 				}));
 				break;
 		}
@@ -211,14 +216,16 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 					title: localize(
 						'positron.addEditRowFilter.conditionIsBetween',
 						"is between"
-					)
+					),
+					value: RowFilterCondition.CONDITION_IS_BETWEEN
 				}));
 				conditionEntries.push(new DropDownListBoxItem({
 					identifier: RowFilterCondition.CONDITION_IS_NOT_BETWEEN,
 					title: localize(
 						'positron.addEditRowFilter.conditionIsNotBetween',
 						"is not between"
-					)
+					),
+					value: RowFilterCondition.CONDITION_IS_NOT_BETWEEN
 				}));
 				break;
 		}
@@ -575,14 +582,15 @@ export const AddEditRowFilterModalPopup = (props: AddEditRowFilterModalPopupProp
 					))()}
 					entries={conditionEntries()}
 					selectedIdentifier={selectedCondition}
-					onSelectionChanged={identifier => {
+					onSelectionChanged={dropDownListBoxItem => {
 						// Set the selected condition.
-						setSelectedCondition(identifier);
+						setSelectedCondition(dropDownListBoxItem.options.identifier);
 
 						// Clear the filter values and error text.
 						clearFilterValuesAndErrorText();
 					}}
 				/>
+
 				{firstRowFilterParameterComponent}
 				{secondRowFilterParameterComponent}
 				{errorText && (
diff --git a/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonEnvironmentStep.tsx b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonEnvironmentStep.tsx
index 4a66b2ecbe2..c0f1646a185 100644
--- a/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonEnvironmentStep.tsx
+++ b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonEnvironmentStep.tsx
@@ -2,8 +2,11 @@
  *  Copyright (C) 2024 Posit Software, PBC. All rights reserved.
  *--------------------------------------------------------------------------------------------*/
 
+// React.
 import * as React from 'react';
 import { PropsWithChildren, useEffect, useState } from 'react';  // eslint-disable-line no-duplicate-imports
+
+// Other dependencies.
 import { useNewProjectWizardContext } from 'vs/workbench/browser/positronNewProjectWizard/newProjectWizardContext';
 import { NewProjectWizardStepProps } from 'vs/workbench/browser/positronNewProjectWizard/interfaces/newProjectWizardStepProps';
 import { localize } from 'vs/nls';
@@ -17,6 +20,7 @@ import { DropDownListBox } from 'vs/workbench/browser/positronComponents/dropDow
 import { RadioButtonItem } from 'vs/workbench/browser/positronComponents/positronModalDialog/components/radioButton';
 import { RadioGroup } from 'vs/workbench/browser/positronComponents/positronModalDialog/components/radioGroup';
 import { EnvironmentSetupType } from 'vs/workbench/browser/positronNewProjectWizard/interfaces/newProjectWizardEnums';
+import { PythonInterpreterEntry } from 'vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry';
 
 /**
  * The PythonEnvironmentStep component is specific to Python projects in the new project wizard.
@@ -54,8 +58,8 @@ export const PythonEnvironmentStep = (props: PropsWithChildren<NewProjectWizardS
 	// TODO: retrieve the python environment types from the language runtime service somehow?
 	// TODO: localize these entries
 	const envTypeEntries = [
-		new DropDownListBoxItem({ identifier: 'Venv', title: 'Venv' + ' Creates a `.venv` virtual environment for your project' }),
-		new DropDownListBoxItem({ identifier: 'Conda', title: 'Conda' + ' Creates a `.conda` Conda environment for your project' })
+		new DropDownListBoxItem({ identifier: 'Venv', title: 'Venv' + ' Creates a `.venv` virtual environment for your project', value: 'Venv' }),
+		new DropDownListBoxItem({ identifier: 'Conda', title: 'Conda' + ' Creates a `.conda` Conda environment for your project', value: 'Conda' })
 	];
 
 	const envSetupRadioButtons: RadioButtonItem[] = [
@@ -205,7 +209,7 @@ export const PythonEnvironmentStep = (props: PropsWithChildren<NewProjectWizardS
 							'Select an environment type'
 						))()}
 						entries={envTypeEntries}
-						onSelectionChanged={identifier => onEnvTypeSelected(identifier)}
+						onSelectionChanged={dropDownListBoxItem => onEnvTypeSelected(dropDownListBoxItem.options.identifier)}
 					/>
 				</PositronWizardSubStep> : null
 			}
@@ -222,34 +226,31 @@ export const PythonEnvironmentStep = (props: PropsWithChildren<NewProjectWizardS
 					'Select a Python installation for your project. You can modify this later if you change your mind.'
 				))()}
 			>
-				{startupPhase !== RuntimeStartupPhase.Complete ?
-					// TODO: how to disable clicking on the combo box while loading?
-					<DropDownListBox
-						keybindingService={keybindingService}
-						layoutService={layoutService}
-						title={(() => localize(
+				<DropDownListBox
+					keybindingService={keybindingService}
+					layoutService={layoutService}
+					disabled={startupPhase !== RuntimeStartupPhase.Complete}
+					title={(() => startupPhase !== RuntimeStartupPhase.Complete ?
+						localize(
 							'pythonInterpreterSubStep.dropDown.title.loading',
 							'Loading interpreters...'
-						))()}
-						entries={[]}
-						onSelectionChanged={() => { }}
-					/> : null
-				}
-				{startupPhase === RuntimeStartupPhase.Complete ?
-					// TODO: how to pre-select an option?
-					<DropDownListBox
-						keybindingService={keybindingService}
-						layoutService={layoutService}
-						title={(() => localize(
+						) :
+						localize(
 							'pythonInterpreterSubStep.dropDown.title',
 							'Select a Python interpreter'
-						))()}
-						// TODO: if the runtime startup phase is complete, but there are no suitable interpreters, show a message
-						// that no suitable interpreters were found and the user should install an interpreter with minimum version
-						entries={interpreterEntries}
-						onSelectionChanged={identifier => onInterpreterSelected(identifier)}
-					/> : null
-				}
+						)
+					)()}
+					// TODO: if the runtime startup phase is complete, but there are no suitable
+					// interpreters, show a message that no suitable interpreters were found and the
+					// user should install an interpreter with minimum version
+					entries={startupPhase !== RuntimeStartupPhase.Complete ? [] : interpreterEntries}
+					createItem={dropDownListBoxItem =>
+						<PythonInterpreterEntry pythonInterpreterInfo={dropDownListBoxItem.options.value} />
+					}
+					onSelectionChanged={dropDownListBoxItem =>
+						onInterpreterSelected(dropDownListBoxItem.options.identifier)
+					}
+				/>
 			</PositronWizardSubStep>
 		</PositronWizardStep>
 	);
diff --git a/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.css b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.css
new file mode 100644
index 00000000000..927f939c04b
--- /dev/null
+++ b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.css
@@ -0,0 +1,16 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (C) 2024 Posit Software, PBC. All rights reserved.
+ *--------------------------------------------------------------------------------------------*/
+
+.python-interpreter-entry {
+	display: grid;
+	grid-template-columns: [left] max-content [middle] 1fr [right] max-content [end];
+}
+
+.python-interpreter-entry > .interpreter-title {
+	grid-column: left / middle;
+}
+
+.python-interpreter-entry > .interpreter-source {
+	grid-column: right / end;
+}
diff --git a/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.tsx b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.tsx
new file mode 100644
index 00000000000..125f3792087
--- /dev/null
+++ b/src/vs/workbench/browser/positronNewProjectWizard/components/steps/pythonInterpreterEntry.tsx
@@ -0,0 +1,39 @@
+/*---------------------------------------------------------------------------------------------
+ *  Copyright (C) 2024 Posit Software, PBC. All rights reserved.
+ *--------------------------------------------------------------------------------------------*/
+
+// CSS.
+import 'vs/css!./pythonInterpreterEntry';
+
+// React.
+import * as React from 'react';
+
+// Other dependencies.
+import { PythonInterpreterInfo } from 'vs/workbench/browser/positronNewProjectWizard/utilities/pythonInterpreterListUtils';
+
+/**
+ * PythonInterpreterEntryProps interface.
+ */
+interface PythonInterpreterEntryProps {
+	pythonInterpreterInfo: PythonInterpreterInfo;
+}
+
+/**
+ * PythonInterpreterEntry component.
+ * @param pythonInterpreterInfo The Python interpreter info.
+ * @returns The rendered component
+ */
+export const PythonInterpreterEntry = ({ pythonInterpreterInfo }: PythonInterpreterEntryProps) => {
+	// Render.
+	return (
+		<div className='python-interpreter-entry'>
+			<div className='interpreter-title'>
+				{/* allow-any-unicode-next-line */}
+				{`${pythonInterpreterInfo.preferred ? '★ ' : ''}${pythonInterpreterInfo.languageName} ${pythonInterpreterInfo.languageVersion} ${pythonInterpreterInfo.runtimePath}`}
+			</div>
+			<div className='interpreter-source'>
+				{pythonInterpreterInfo.runtimeSource}
+			</div>
+		</div>
+	);
+};
diff --git a/src/vs/workbench/browser/positronNewProjectWizard/utilities/pythonInterpreterListUtils.ts b/src/vs/workbench/browser/positronNewProjectWizard/utilities/pythonInterpreterListUtils.ts
index 06f1c9a9c5a..6bf0f6f1c47 100644
--- a/src/vs/workbench/browser/positronNewProjectWizard/utilities/pythonInterpreterListUtils.ts
+++ b/src/vs/workbench/browser/positronNewProjectWizard/utilities/pythonInterpreterListUtils.ts
@@ -2,6 +2,7 @@
  *  Copyright (C) 2024 Posit Software, PBC. All rights reserved.
  *--------------------------------------------------------------------------------------------*/
 
+import { DropDownListBoxEntry } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBox';
 import { DropDownListBoxItem } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxItem';
 import { DropDownListBoxSeparator } from 'vs/workbench/browser/positronComponents/dropDownListBox/dropDownListBoxSeparator';
 import { ILanguageRuntimeService } from 'vs/workbench/services/languageRuntime/common/languageRuntimeService';
@@ -12,51 +13,66 @@ export enum PythonRuntimeFilter {
 	Global = 'Global',  // Include only global runtimes. This is when a new Venv environment is being created.
 }
 
+/**
+ * PythonInterpreterInfo interface.
+ */
+export interface PythonInterpreterInfo {
+	preferred: boolean;
+	runtimeId: string;
+	languageName: string;
+	languageVersion: string;
+	runtimePath: string;
+	runtimeSource: string;
+}
+
 /**
  * Retrieves the detected Python interpreters as DropDownListBoxItems, filtering and grouping the
  * list by runtime source if requested.
  * @param runtimeStartupService The runtime startup service.
  * @param languageRuntimeService The language runtime service.
  * @param pythonRuntimeFilter The PythonRuntimeFilter to apply to the Python runtimes.
- * @returns An array of DropDownListBoxItem and DropDownListBoxSeparator for Python interpreters.
+ * @returns An array of DropDownListBoxEntry for Python interpreters.
  */
-const getPythonInterpreterDropDownItems = (runtimeStartupService: IRuntimeStartupService, languageRuntimeService: ILanguageRuntimeService, pythonRuntimeFilter = PythonRuntimeFilter.All): (DropDownListBoxItem | DropDownListBoxSeparator)[] => {
+const getPythonInterpreterDropDownItems = (
+	runtimeStartupService: IRuntimeStartupService,
+	languageRuntimeService: ILanguageRuntimeService,
+	pythonRuntimeFilter = PythonRuntimeFilter.All
+) => {
 	// See ILanguageRuntimeMetadata in src/vs/workbench/services/languageRuntime/common/languageRuntimeService.ts
 	// for the properties of the runtime metadata object
 	const languageId = 'python';
 	const preferredRuntime = runtimeStartupService.getPreferredRuntime(languageId);
-	const discoveredRuntimes = languageRuntimeService.registeredRuntimes;
-	const pythonRuntimes = discoveredRuntimes.filter(runtime => runtime.languageId === languageId);
+	const all = pythonRuntimeFilter === PythonRuntimeFilter.All;
 
-	// Group the runtimes by runtimeSource.
-	const runtimeSourceMap = new Map<string, DropDownListBoxItem[]>();
-	pythonRuntimes.forEach((runtime) => {
-		const runtimeSource = runtime.runtimeSource;
-		// Only include runtimes that match the filter
-		if (pythonRuntimeFilter === PythonRuntimeFilter.All || runtimeSource === pythonRuntimeFilter) {
-			if (!runtimeSourceMap.has(runtimeSource)) {
-				runtimeSourceMap.set(runtimeSource, []);
-			}
-			runtimeSourceMap.get(runtimeSource)?.push(new DropDownListBoxItem({
-				identifier: runtime.runtimeId,
-				// TODO: remove this eslint comment once the label is being constructed properly
-				// allow-any-unicode-next-line
-				title: `${runtime.runtimeId === preferredRuntime.runtimeId ? '★ ' : ''}${runtime.languageName} ${runtime.languageVersion} ---- ${runtime.runtimePath} ---- ${runtime.runtimeSource}`
-			}));
-		}
-	});
+	// Return the DropDownListBoxEntry array.
+	return languageRuntimeService.registeredRuntimes.
+		filter(runtime => runtime.languageId === languageId &&
+			(all || runtime.runtimeSource === pythonRuntimeFilter)
+		).
+		sort((left, right) => left.runtimeSource.localeCompare(right.runtimeSource)).
+		reduce<DropDownListBoxEntry<string, PythonInterpreterInfo>[]>(
+			(entries, runtime, index, runtimes) => {
+				// Perform break processing when the runtime source changes.
+				if (index && runtimes[index].runtimeSource !== runtimes[index - 1].runtimeSource) {
+					entries.push(new DropDownListBoxSeparator());
+				}
 
-	// Creates an array of DropDownListBoxItem and DropDownListBoxSeparator.
-	// The DropDownListBoxSeparator is used to separate the runtimes by runtimeSource.
-	const comboBoxItems: DropDownListBoxItem | DropDownListBoxSeparator[] = [];
-	runtimeSourceMap.forEach((runtimeItems) => {
-		if (comboBoxItems.length > 0) {
-			comboBoxItems.push(new DropDownListBoxSeparator());
-		}
-		comboBoxItems.push(...runtimeItems);
-	});
+				// Push the DropDownListBoxItem.
+				entries.push(new DropDownListBoxItem<string, PythonInterpreterInfo>({
+					identifier: runtime.runtimeId,
+					value: {
+						preferred: runtime.runtimeId === preferredRuntime.runtimeId,
+						runtimeId: runtime.runtimeId,
+						languageName: runtime.languageName,
+						languageVersion: runtime.languageVersion,
+						runtimePath: runtime.runtimePath,
+						runtimeSource: runtime.runtimeSource
+					}
+				}));
 
-	return comboBoxItems;
+				// Return the entries for the next iteration.
+				return entries;
+			}, []);
 };
 
 /**
@@ -67,11 +83,12 @@ const getPythonInterpreterDropDownItems = (runtimeStartupService: IRuntimeStartu
 export const createCondaInterpreterDropDownItems = () => {
 	// TODO: we should get the list of Python versions from the Conda service
 	const pythonVersions = ['3.12', '3.11', '3.10', '3.9', '3.8'];
-	const condaRuntimes: DropDownListBoxItem[] = [];
+	const condaRuntimes: DropDownListBoxItem<string, string>[] = [];
 	pythonVersions.forEach(version => {
 		condaRuntimes.push(new DropDownListBoxItem({
 			identifier: `conda-python-${version}`,
-			title: `Python ${version}`
+			title: `Python ${version}`,
+			value: `conda-python-${version}`
 		}));
 	});
 	return condaRuntimes;