This code:
<View
maxBlockSize={{
default: "fill",
conditionals: [
{ conditions: { viewportInlineSize: { min: "extraSmall" } }, value: 300 },
{ conditions: { viewportInlineSize: { min: "small" } }, value: "40%" },
{ conditions: { viewportInlineSize: { min: "medium" } }, value: 300 },
{ conditions: { viewportInlineSize: { min: "large" } }, value: "fill" },
],
}}
>
<View maxBlockSize={80}>
Max Block size responsive
<View minBlockSize={800} background="subdued">
hey
</View>
</View>
</View>
Produces this:
No effect in the max-height property what soever. Whereas the maxInlineSize
property does work as expected