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 · 1884792 · 1884792
1 parent f23722a
commit 1884792
Show file tree

Hide file tree

Showing 3 changed files with 14 additions and 8 deletions.
diff --git a/js/common/view/DisturbanceTypeRadioButtonGroup.js b/js/common/view/DisturbanceTypeRadioButtonGroup.js
@@ -28,12 +28,14 @@ class DisturbanceTypeRadioButtonGroup extends RectangularRadioButtonGroup {
     } ], merge( {
       orientation: 'vertical',
       radioButtonOptions: {
+        baseColor: 'white',
         xMargin: 1,
         yMargin: 8,
-        selectedLineWidth: 2,
-        baseColor: 'white',
-        selectedStroke: 'blue',
-        deselectedContentOpacity: 0.4
+        buttonAppearanceStrategyOptions: {
+          selectedLineWidth: 2,
+          selectedStroke: 'blue',
+          deselectedContentOpacity: 0.4
+        }
       }
     }, options ) );
   }

diff --git a/js/common/view/SceneRadioButtonGroup.js b/js/common/view/SceneRadioButtonGroup.js
@@ -30,9 +30,11 @@ class SceneRadioButtonGroup extends RectangularRadioButtonGroup {
       orientation: 'horizontal',
       spacing: 15,
       radioButtonOptions: {
-        selectedStroke: '#73bce1',
         baseColor: 'white',
-        selectedLineWidth: 2
+        buttonAppearanceStrategyOptions: {
+          selectedStroke: '#73bce1',
+          selectedLineWidth: 2
+        }
       }
     } );
   }

diff --git a/js/diffraction/view/DiffractionScreenView.js b/js/diffraction/view/DiffractionScreenView.js
@@ -143,8 +143,10 @@ class DiffractionScreenView extends ScreenView {
     const sceneRadioButtonGroup = new RectangularRadioButtonGroup( model.sceneProperty, sceneRadioButtonContent, {
       radioButtonOptions: {
         baseColor: 'white',
-        selectedStroke: '#419ac9',
-        selectedLineWidth: 2
+        buttonAppearanceStrategyOptions: {
+          selectedStroke: '#419ac9',
+          selectedLineWidth: 2
+        }
       },
       right: this.apertureNode.left - 20,
       bottom: this.apertureNode.bottom