Use createNode/tandemName in GroupItemOptions, see phetsims/sun#794

phetsims · Sep 27, 2022 · 194b825 · 194b825
1 parent 3b9ce7a
commit 194b825
Show file tree

Hide file tree

Showing 2 changed files with 17 additions and 16 deletions.
diff --git a/js/common/view/BottomRepresentationCheckboxGroup.ts b/js/common/view/BottomRepresentationCheckboxGroup.ts
@@ -14,7 +14,7 @@ import Property from '../../../../axon/js/Property.js';
 import Tandem from '../../../../tandem/js/Tandem.js';
 import ArrowNode from '../../../../scenery-phet/js/ArrowNode.js';
 import centerAndVariability from '../../centerAndVariability.js';
-import VerticalCheckboxGroup, { VerticalCheckboxGroupOptions } from '../../../../sun/js/VerticalCheckboxGroup.js';
+import VerticalCheckboxGroup, { VerticalCheckboxGroupItem, VerticalCheckboxGroupOptions } from '../../../../sun/js/VerticalCheckboxGroup.js';
 import { HBox, TColor, Text } from '../../../../scenery/js/imports.js';
 import CAVModel from '../model/CAVModel.js';
 import CAVConstants from '../CAVConstants.js';
@@ -50,12 +50,12 @@ class BottomRepresentationCheckboxGroup extends VerticalCheckboxGroup {
       includePredictMedian: true
     }, providedOptions );
 
-    const items = [];
+    const items: VerticalCheckboxGroupItem[] = [];
 
     const createPredictionItem = ( property: Property<boolean>, string: string, color: TColor, spacing: number,
                                    tandemName: string ) => {
       return {
-        node: new HBox( {
+        createNode: ( tandem: Tandem ) => new HBox( {
           spacing: spacing,
           children: [
 
@@ -71,7 +71,7 @@ class BottomRepresentationCheckboxGroup extends VerticalCheckboxGroup {
           ]
         } ),
         property: property,
-        tandem: options.tandem.createTandem( tandemName )
+        tandemName: tandemName
       };
     };
 
@@ -85,20 +85,20 @@ class BottomRepresentationCheckboxGroup extends VerticalCheckboxGroup {
     options.includeMean && items.push( {
 
       // TODO: Align group to center align the icons
-      node: new HBox( {
+      createNode: ( tandem: Tandem ) => new HBox( {
         spacing: 24.5,
         children: [
           new Text( CenterAndVariabilityStrings.mean, TEXT_OPTIONS ),
           NumberLineNode.createMeanIndicatorNode( true )
         ]
       } ),
       property: model.isShowingPlayAreaMeanProperty,
-      tandem: options.tandem.createTandem( 'meanCheckbox' )
+      tandemName: 'meanCheckbox'
     } );
     options.includeMedian && items.push( {
 
       // TODO: Align group to center align the icons
-      node: new HBox( {
+      createNode: ( tandem: Tandem ) => new HBox( {
         spacing: 14,
         children: [
           new Text( CenterAndVariabilityStrings.median, TEXT_OPTIONS ),
@@ -115,7 +115,7 @@ class BottomRepresentationCheckboxGroup extends VerticalCheckboxGroup {
         ]
       } ),
       property: model.isShowingPlayAreaMedianProperty,
-      tandem: options.tandem.createTandem( 'medianCheckbox' )
+      tandemName: 'medianCheckbox'
     } );
 
     super( items, options );

diff --git a/js/common/view/TopRepresentationCheckboxGroup.ts b/js/common/view/TopRepresentationCheckboxGroup.ts
@@ -9,7 +9,7 @@
 
 import optionize from '../../../../phet-core/js/optionize.js';
 import centerAndVariability from '../../centerAndVariability.js';
-import VerticalCheckboxGroup, { VerticalCheckboxGroupOptions } from '../../../../sun/js/VerticalCheckboxGroup.js';
+import VerticalCheckboxGroup, { VerticalCheckboxGroupItem, VerticalCheckboxGroupOptions } from '../../../../sun/js/VerticalCheckboxGroup.js';
 import { HBox, Line, Node, Text } from '../../../../scenery/js/imports.js';
 import CAVModel from '../model/CAVModel.js';
 import CenterAndVariabilityStrings from '../../CenterAndVariabilityStrings.js';
@@ -18,6 +18,7 @@ import NumberLineNode from './NumberLineNode.js';
 import MedianBarNode, { MedianBarNodeOptions } from './MedianBarNode.js';
 import CAVColors from '../CAVColors.js';
 import PickRequired from '../../../../phet-core/js/types/PickRequired.js';
+import Tandem from '../../../../tandem/js/Tandem.js';
 
 type SelfOptions = {
   includeSortData?: boolean;
@@ -49,14 +50,14 @@ class TopRepresentationCheckboxGroup extends VerticalCheckboxGroup {
       includeMedian: true
     }, providedOptions );
 
-    const items = [];
+    const items: VerticalCheckboxGroupItem[] = [];
     options.includeSortData && items.push( {
-      node: new Text( CenterAndVariabilityStrings.sortData, TEXT_OPTIONS ),
+      createNode: ( tandem: Tandem ) => new Text( CenterAndVariabilityStrings.sortData, TEXT_OPTIONS ),
       property: model.isSortingDataProperty,
-      tandem: options.tandem.createTandem( 'sortDataCheckbox' )
+      tandemName: 'sortDataCheckbox'
     } );
     options.includeMean && items.push( {
-      node: new HBox( {
+      createNode: ( tandem: Tandem ) => new HBox( {
 
         // TODO: align icons
         spacing: 24.5,
@@ -78,10 +79,10 @@ class TopRepresentationCheckboxGroup extends VerticalCheckboxGroup {
         ]
       } ),
       property: model.isShowingTopMeanProperty,
-      tandem: options.tandem.createTandem( 'meanCheckbox' )
+      tandemName: 'meanCheckbox'
     } );
     options.includeMedian && items.push( {
-      node: new HBox( {
+      createNode: ( tandem: Tandem ) => new HBox( {
         spacing: 12,
         children: [
           new Text( CenterAndVariabilityStrings.median, TEXT_OPTIONS ),
@@ -92,7 +93,7 @@ class TopRepresentationCheckboxGroup extends VerticalCheckboxGroup {
         ]
       } ),
       property: model.isShowingTopMedianProperty,
-      tandem: options.tandem.createTandem( 'medianCheckbox' )
+      tandemName: 'medianCheckbox'
     } );
     super( items, options );
   }