How to change the font in the SpTextPresenter?

Question

Pharo 9, Spec 2 -- I have a Spec 2 presenter with a text widget:

initializePresenters
    text := self newText.
    super initializePresenters

As I understand its type is SpTextPresenter. How to change the font of this text? Font face, size of the all shown text in this widget... For example, to "Courier New", 9.

EDIT 1:

Also I tried:

    text addStyle: { SpStyleSTONReader fromString:
'
Font {
#name: "Source Sans Pro",
#size: 12,
#bold: false,
#italic: true
}' }.

but it does not work, the error is: Improper store into indexable object.

EDIT 2:

Also I found this documentation. It seems that the scenario must be:

1. Read styles as STON
2. Set styles somwhere (where?) for the all application. They are described under its names in the STON so they can be referred under its names in the application.
3. Call addStyle: 'the-name' so the widget with a name the-name will refer own styles from the loaded STON.

The problem is in 2. - I have not application, just one presenter which I open with openWithSpec.

Answer 1

I didn't notice this 'till now.
Spec "styles" cannot be added directly to the component but they need to be part of a stylesheet.
Stylesheets are defined in your application (in particular in your application configuration).
You can take a look at StPharoApplication>>resetConfiguration, StPharoMorphicConfiguration>>styleSheet and StPharoMorphicConfiguration>>styleSheetCommon as examples (you will also see there than using STON to declare your styles is just a convenience way, not mandatory).

Here a simplified version of what you will find there:

StPharoApplication >> resetConfiguration

    self useBackend: #Morphic with: StPharoMorphicConfiguration new

StPharoMorphicConfiguration >> styleSheet

    ^ SpStyle defaultStyleSheet, self styleSheetCommon

StPharoMorphicConfiguration >> styleSheetCommon
    "Just an example on how to build styles programatically ;)"

    ^ SpStyleSTONReader fromString: '
.application [
    .searchInputField [
        Font { #size: 12 }
    ]
]
'

Then you can add the style to your component:

text addStyle: 'searchInputField'