made button appearance options into sub-options for better typing, see …

…phetsims/chipper#1253, phetsims/sun#754, and phetsims/sun#772
phetsims · Jul 21, 2022 · 1386ffb · 1386ffb
1 parent 2110d77
commit 1386ffb
Show file tree

Hide file tree

Showing 2 changed files with 21 additions and 15 deletions.
diff --git a/js/common/view/LightModeRadioButtonGroup.ts b/js/common/view/LightModeRadioButtonGroup.ts
@@ -39,12 +39,14 @@ export default class LightModeRadioButtonGroup extends RectangularRadioButtonGro
         xMargin: 15,
         yMargin: 6,
         baseColor: MOTHAColors.lightModeRadioButtonFillProperty,
-        selectedLineWidth: 2,
-        deselectedLineWidth: 2,
-        selectedStroke: MOTHAColors.lightModeRadioButtonSelectedStrokeProperty,
-        deselectedStroke: MOTHAColors.lightModeRadioButtonDeselectedStrokeProperty,
-        overFill: MOTHAColors.lightModeRadioButtonFillProperty,
-        overStroke: MOTHAColors.lightModeRadioButtonDeselectedStrokeProperty
+        buttonAppearanceStrategyOptions: {
+          selectedLineWidth: 2,
+          deselectedLineWidth: 2,
+          selectedStroke: MOTHAColors.lightModeRadioButtonSelectedStrokeProperty,
+          deselectedStroke: MOTHAColors.lightModeRadioButtonDeselectedStrokeProperty,
+          overFill: MOTHAColors.lightModeRadioButtonFillProperty,
+          overStroke: MOTHAColors.lightModeRadioButtonDeselectedStrokeProperty
+        }
       }
     }, providedOptions );
 

diff --git a/js/common/view/PredictionPanel.ts b/js/common/view/PredictionPanel.ts
@@ -64,18 +64,22 @@ export default class PredictionPanel extends Panel {
       labelAlign: 'left',
       radioButtonOptions: {
         baseColor: options.fill,
-        selectedStroke: MOTHAColors.modelsRadioButtonSelectedStrokeProperty,
-        deselectedStroke: MOTHAColors.modelsRadioButtonFillProperty,
-        selectedLineWidth: 2,
         xMargin: 12,
         yMargin: 10,
         xAlign: 'left',
-        selectedButtonOpacity: 1,
-        deselectedButtonOpacity: 1,
-        selectedContentOpacity: 1,
-        deselectedContentOpacity: 1,
-        overButtonOpacity: 1,
-        overContentOpacity: 1
+        buttonAppearanceStrategyOptions: {
+          selectedStroke: MOTHAColors.modelsRadioButtonSelectedStrokeProperty,
+          deselectedStroke: MOTHAColors.modelsRadioButtonFillProperty,
+          selectedLineWidth: 2,
+          selectedButtonOpacity: 1,
+          deselectedButtonOpacity: 1,
+          overButtonOpacity: 1
+        },
+        contentAppearanceStrategyOptions: {
+          selectedContentOpacity: 1,
+          deselectedContentOpacity: 1,
+          overContentOpacity: 1
+        }
       },
       tandem: options.tandem.createTandem( 'modelRadioButtonGroup' )
     } );