Width AND height are required for (nested) Block Type

[valentindiehl]

When creating a Block in a typescript setting, it seems the typings are created in a way that require both width and height to be set at creation time.

While looking through the documentation, examples and issues, it seems that is not the way it shuold be, as nested blocks should be able to compute their own measurements if given one dimension. (This is especially needed for e. g. headlines with text below (two fonts needed) inside a card, where height is limited.

This codeblock does not work in my IDE setting:

textContainer.add(
        new Block({
          fontFamily: XXX,
          fontTexture: XXX,
          width: 1
        })
      )

ESLint throws the following error:

Argument of type '{ fontFamily: string; fontTexture: string; width: number; }' is not assignable to parameter of type 'BlockOptions'.
Property 'height' is missing in type '{ fontFamily: string; fontTexture: string; width: number; }' but required in type 'BlockOptions'.

Have I just completely misunderstood the references I was looking at or is this an error in the typings?

[michal-repo]

@valentindiehl As you said Block can calculate it's dimension but it will be based on child Objects. So you need to add height to child Block or set it in top most Block (textContainer in your example).

Edit: Actually :) just tested this and if you set fontSize: 0.15 it works without height.

textContainer.add(
	new Block({
		fontFamily: XXX,
		fontTexture: XXX,
		width: 1,
		fontSize: 0.15
	}).add(
		new Text({ content: 'Test' })
	)
);

[swingingtom]

I use this occasion to promote 7.x.x update.

• Blocks have their height and width default values set to 'auto'. Which means they will fit their children.
• Texts have their height default value set to 'auto'. Its text content define its height.
• Texts have their width default value set to '100%'. Percent means relative to parent. By defaults, texts will try to take all the width of the its parent container, such as h1,p, in html.