convert ComboBoxItem from class to type, phetsims/sun#768

phetsims · Jun 27, 2022 · c867dc6 · c867dc6
1 parent d6eecd4
commit c867dc6
Show file tree

Hide file tree

Showing 2 changed files with 12 additions and 18 deletions.
diff --git a/js/create/view/TickMarkRangeComboBoxNode.ts b/js/create/view/TickMarkRangeComboBoxNode.ts
@@ -15,7 +15,6 @@ import StringUtils from '../../../../phetcommon/js/util/StringUtils.js';
 import PhetFont from '../../../../scenery-phet/js/PhetFont.js';
 import { Node, RichText } from '../../../../scenery/js/imports.js';
 import ComboBox from '../../../../sun/js/ComboBox.js';
-import ComboBoxItem from '../../../../sun/js/ComboBoxItem.js';
 import HSeparator from '../../../../sun/js/HSeparator.js';
 import Tandem from '../../../../tandem/js/Tandem.js';
 import ActivationUtterance from '../../../../utterance-queue/js/ActivationUtterance.js';
@@ -47,15 +46,9 @@ class TickMarkRangeComboBoxNode extends Node {
     this.tickMarkRangeProperty = tickMarkRangeProperty;
 
     const items = [
-      new ComboBoxItem( new RichText( this.tickMarkRangeMap[ 10 ], RANGE_TEXT_OPTIONS ), 10, {
-        a11yLabel: ratioAndProportionStrings.zeroToTen
-      } ),
-      new ComboBoxItem( new RichText( this.tickMarkRangeMap[ 20 ], RANGE_TEXT_OPTIONS ), 20, {
-        a11yLabel: ratioAndProportionStrings.zeroToTwenty
-      } ),
-      new ComboBoxItem( new RichText( this.tickMarkRangeMap[ 30 ], RANGE_TEXT_OPTIONS ), 30, {
-        a11yLabel: ratioAndProportionStrings.zeroToThirty
-      } )
+      { value: 10, node: new RichText( this.tickMarkRangeMap[ 10 ], RANGE_TEXT_OPTIONS ), a11yLabel: ratioAndProportionStrings.zeroToTen },
+      { value: 20, node: new RichText( this.tickMarkRangeMap[ 20 ], RANGE_TEXT_OPTIONS ), a11yLabel: ratioAndProportionStrings.zeroToTwenty },
+      { value: 30, node: new RichText( this.tickMarkRangeMap[ 30 ], RANGE_TEXT_OPTIONS ), a11yLabel: ratioAndProportionStrings.zeroToThirty }
     ];
 
     const widestItem = Math.max( ...items.map( item => item.node.width ) );
@@ -80,7 +73,7 @@ class TickMarkRangeComboBoxNode extends Node {
 
     // NOTE: The values are [ 10, true ]... so it's typed interestingly.
     this.disabledComboBox = new ComboBox<true | number>( new BooleanProperty( value ) as Property<true | number>, [
-      new ComboBoxItem( new HSeparator( widestItem, { centerY: -5 } ), value, { a11yLabel: ratioAndProportionStrings.a11y.tickMark.tickMarksHidden } ),
+      { value: value, node: new HSeparator( widestItem, { centerY: -5 } ), a11yLabel: ratioAndProportionStrings.a11y.tickMark.tickMarksHidden },
       items[ 0 ] // add this one to get the proper height of the text.
     ], new Node(), comboBoxOptions );
 

diff --git a/js/discover/view/ChallengeRatioComboBoxNode.ts b/js/discover/view/ChallengeRatioComboBoxNode.ts
@@ -5,7 +5,7 @@
  * @author Michael Kauzmann (PhET Interactive Simulations)
  */
 
-import ComboBox from '../../../../sun/js/ComboBox.js';
+import ComboBox, { ComboBoxItem } from '../../../../sun/js/ComboBox.js';
 import StrictOmit from '../../../../phet-core/js/types/StrictOmit.js';
 import SoundClip from '../../../../tambo/js/sound-generators/SoundClip.js';
 import soundManager from '../../../../tambo/js/soundManager.js';
@@ -21,7 +21,6 @@ import RatioDescriber from '../../common/view/describers/RatioDescriber.js';
 import Property from '../../../../axon/js/Property.js';
 import { Color, HBox, Node, NodeOptions, Rectangle, RichText } from '../../../../scenery/js/imports.js';
 import Tandem from '../../../../tandem/js/Tandem.js';
-import ComboBoxItem from '../../../../sun/js/ComboBoxItem.js';
 
 const SOUND_CLIP_OPTIONS = {
   initialOutputLevel: 0.4
@@ -69,23 +68,23 @@ class ChallengeRatioComboBoxNode extends Node {
       color: RAPColors.discoverChallenge1Property.value,
       soundClip: new SoundClip( selectionArpeggio001_mp3, SOUND_CLIP_OPTIONS ),
       a11yLabel: ratioAndProportionStrings.challenge1,
-      tandemName: 'challenge1Item'
+      tandemName: `challenge1${ComboBox.ITEM_TANDEM_NAME_SUFFIX}`
     } );
     this.ratioToChallengeInfoMap.set( 1 / 3, {
       capitalized: ratioAndProportionStrings.challenge2,
       lowercase: ratioAndProportionStrings.a11y.discover.challenge2Lowercase,
       color: RAPColors.discoverChallenge2Property.value,
       soundClip: new SoundClip( selectionArpeggio004_mp3, SOUND_CLIP_OPTIONS ),
       a11yLabel: ratioAndProportionStrings.challenge2,
-      tandemName: 'challenge2Item'
+      tandemName: `challenge2${ComboBox.ITEM_TANDEM_NAME_SUFFIX}`
     } );
     this.ratioToChallengeInfoMap.set( 3 / 4, {
       capitalized: ratioAndProportionStrings.challenge3,
       lowercase: ratioAndProportionStrings.a11y.discover.challenge3Lowercase,
       color: RAPColors.discoverChallenge3Property.value,
       soundClip: new SoundClip( selectionArpeggio006_mp3, SOUND_CLIP_OPTIONS ),
       a11yLabel: ratioAndProportionStrings.challenge3,
-      tandemName: 'challenge3Item'
+      tandemName: `challenge3${ComboBox.ITEM_TANDEM_NAME_SUFFIX}`
     } );
 
     // Add each soundClip to the soundManager.
@@ -148,11 +147,13 @@ function createComboBoxItem( targetRatio: number, challengeInfo: ChallengeInfo )
       new RichText( challengeInfo.capitalized ) ]
   } );
 
-  return new ComboBoxItem( node, targetRatio, {
+  return {
+    value: targetRatio,
+    node: node,
     soundPlayer: challengeInfo.soundClip,
     a11yLabel: challengeInfo.a11yLabel,
     tandemName: challengeInfo.tandemName
-  } );
+  };
 }
 
 ratioAndProportion.register( 'ChallengeRatioComboBoxNode', ChallengeRatioComboBoxNode );