Adding text within a screenIcon image (and a question about kite)

[dave-english]

I have been playing with ScreenIcon feature, to learn more about creating complex shapes, color designs, and eventually animated icons.

1)I am puzzled by why I am not able to add a Text type to the HBox instance in the code below.
In every other context, I would be able to include Text type as children of an HBox instance.
but when Text style is added as a child in this particular instance, the Text:icontext is disallowed as child type

Error:Type 'Text' is missing the following properties from type 'Node': _id, _instances, _rootedDisplays, _drawables, and 740 more.ts(2740)

2. I've been playing around with constructs like this one:
   var myShape = new phet.kite.Shape().moveTo(-30, 80).bezierCurveTo(0, 50, 30, 80);
   sadly to learn that kite does not share the same functions as Canvas. Is there a bezierCurve function accessible to kite?

import {HBox} from '../../../scenery/js/imports.js';

  function createScreenIcon(): ScreenIcon {

        const iconRect=new Rectangle( 0,0,50,50, {
            
            fill: new phet.scenery.LinearGradient( 0, 0, 0, 128 )
            .addColorStop( 0, '#00F' )
            .addColorStop( 0.5, '#808' )
            .addColorStop( 1, '#F00' )

        } );

        const iconRect2=new Rectangle(40,40,20,20,{fill:'brown'});

        const icontext=new Text('myTitle');

      const iconNode = new HBox({
        children:[
          iconRect,
          iconRect2,
    //      icontext
        ]
      } );
       
      return new ScreenIcon( iconNode, {
        maxIconWidthProportion: 1,
        maxIconHeightProportion: 1
      } );

};

[samreid]

You may need to import Text, like so:

import {HBox, Text} from '../../../scenery/js/imports.js';

Here are some of the curves supported by kite:
https://github.com/phetsims/kite/blob/1bc9bc19457993fb9f45ed9994da220e6b5bccf4/js/Shape.ts#L384-L572

[dave-english]

Thank you. That was very helpful.