[owo-ui] Sizing extended ignores other layout components with different direction, resulting in a fill

[Zailer43]

Description

When at least 2 components are added, where one component has a horizontal direction with horizontal sizing set to extended, and another has a vertical direction with vertical sizing set to extended, it ignoring the components added before, making it behave like fill sizing (this occurs with various components such as flow-layout, scroll, etc)

<owo-ui xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
        xsi:noNamespaceSchemaLocation="../../../../../../owo-ui.xsd">
    <components>
        <flow-layout direction="vertical">
            <children>

                <flow-layout direction="horizontal" id="buttons-layout">
                    <children>
                        <button id="test-button">
                            <text>My button</text>
  
                            <sizing>
                                <horizontal method="fixed">120</horizontal>
                                <vertical method="fixed">16</vertical>
                            </sizing>
                        </button>
  
                        <button id="test2-button">
                            <text>(My button)²</text>
  
                            <sizing>
                                <horizontal method="fixed">120</horizontal>
                                <vertical method="fixed">16</vertical>
                            </sizing>
                        </button>
                    </children>
  
                    <gap>2</gap>
  
                    <sizing>
                        <horizontal method="expand">100</horizontal>
                    </sizing>
                </flow-layout>
  
                <scroll direction="vertical">
                    <flow-layout direction="vertical">
                        <children>

                            <label><text>first</text></label>

                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>
                            <item><stack>minecraft:diamond</stack></item>
                            <item><stack>minecraft:gold_ingot</stack></item>
                            <item><stack>minecraft:iron_ingot</stack></item>

                            <label><text>not the last</text></label>
                            <label><text>last</text></label>
                        </children>
                    </flow-layout>

                    <sizing>
                        <vertical method="expand">100</vertical>
                    </sizing>
                </scroll>

            </children>

            <vertical-alignment>center</vertical-alignment>
            <horizontal-alignment>center</horizontal-alignment>

            <surface>
                <vanilla-translucent/>
            </surface>
        </flow-layout>
    </components>
</owo-ui>

Alternative Solutions

<!-- ... -->
<children>

    <flow-layout direction="vertical"> <!-- Solution 1: Wrap the components with a *vertical* layout -->
        <children>
            <flow-layout direction="horizontal" id="buttons-layout">
                <children>
                    <!-- components -->
                </children>

                <gap>2</gap>

                <sizing>
                    <horizontal method="fixed">300</horizontal> <!-- Solution 2: Change the layout sizing from 'extended' to 'fixed' -->
                </sizing>
            </flow-layout>
        </children>
    </flow-layout>

    <scroll direction="vertical">
        <!-- components -->

        <sizing>
            <vertical method="expand">100</vertical>
        </sizing>
    </scroll>

</children>
<!-- ... -->

Attachments

Issue

Alternative Solution

Versions

owo-lib = 0.12.20
fabric-api = 0.111.0+1.21.4