New source found from dndbeyond.com

ddb_main/tools/js/Shared/containers/DetailChoice/DetailChoice.tsx

@@ -1,3 +1,4 @@
+import clsx from "clsx";
 import { FC, ReactNode } from "react";
 
 import {
@@ -18,6 +19,7 @@ import Collapsible from "~/tools/js/smartComponents/Collapsible";
 import { Select } from "~/tools/js/smartComponents/legacy";
 
 // TODO this needs to not extend builder contract and options typing needs to be fixed
+// TODO scss to styles.module.css
 interface Props extends Omit<BuilderChoiceContract, "options"> {
   choice: Choice;
   description?: string;
@@ -31,7 +33,6 @@ interface Props extends Omit<BuilderChoiceContract, "options"> {
   onChange?: (
     id: string,
     type: number,
-    subType: number | null,
     value: any,
     parentChoiceId: string | null
   ) => void;
@@ -61,12 +62,17 @@ export const DetailChoice: FC<Props> = ({
   const { entityRestrictionData, ruleData } = useCharacterEngine();
   const { languages } = useRuleData();
 
+  const hasTodo =
+    (ChoiceUtils.isInfinite(choice) && !ChoiceUtils.isOptionSelected(choice)) ||
+    ChoiceUtils.isTodo(choice);
+
   const handleChoiceChange = (value: string): void => {
     if (onChange && id !== null) {
-      onChange(id, type, subType, value, parentChoiceId);
+      onChange(id, type, value, parentChoiceId);
     }
   };
 
+  //Don't render the choice if hideWhenOnlyDefaultSelected is true and the choice is only default selected.
   if (
     hideWhenOnlyDefaultSelected &&
     ChoiceUtils.isOnlyDefaultSelected(choice)
@@ -74,14 +80,6 @@ export const DetailChoice: FC<Props> = ({
     return null;
   }
 
-  let classNames: Array<string> = ["detail-choice", className];
-  if (
-    (ChoiceUtils.isInfinite(choice) && !ChoiceUtils.isOptionSelected(choice)) ||
-    ChoiceUtils.isTodo(choice)
-  ) {
-    classNames.push("detail-choice--todo");
-  }
-
   // Use the description prop or, if a chosenOption is found and a description wasn't passed in, use the chosenOption description instead.
   let choiceDescription = description;
 
@@ -94,10 +92,6 @@ export const DetailChoice: FC<Props> = ({
     choiceDescription = description || chosenOption["description"];
   }
 
-  if (parentChoiceId !== null) {
-    classNames.push("detail-choice--child");
-  }
-
   let choiceNode: ReactNode;
   if (choiceDescription) {
     switch (type) {
@@ -142,7 +136,14 @@ export const DetailChoice: FC<Props> = ({
   }
 
   return (
-    <div className={classNames.join(" ")}>
+    <div
+      className={clsx([
+        "detail-choice",
+        hasTodo && "detail-choice--todo",
+        parentChoiceId !== null && "detail-choice--child",
+        className,
+      ])}
+    >
       <Select
         className="detail-choice-input"
         options={ChoiceUtils.getSortedRenderOptions(