Nishan ba27f9d1ec fix: remove gap if its last element in line (fix flex gap extra spacing when children determine parents main axis size) (#1188)
Summary:
Fixes - https://github.com/facebook/react-native/issues/35553

## Approach
We're using `betweenMainDim` to add [gap between](bbeede82d3/yoga/Yoga.cpp (L2495)) items in main axis. This is resulting in increased [main axis](bbeede82d3/yoga/Yoga.cpp (L2598)) dimension of the container as it gets added even for the last element. One solution is to keep using it and subtract the gap when last element is reached.

## Aside
Mutating this value feels weird, but I think `betweenMainDim` gets initialized for every line so should be fine? I did some manual tests to verify. I tried running tests but I'll have to downgrade the java version. Let me know if anything fails. Thanks! 🙏

Pull Request resolved: https://github.com/facebook/yoga/pull/1188

Test Plan: Added fixtures which previously failed but now pass.

Reviewed By: necolas

Differential Revision: D42078162

Pulled By: NickGerleman

fbshipit-source-id: 0e535618350422e001141a8786a83fc81651afe9
2022-12-15 16:30:37 -08:00
2022-10-10 21:40:08 -07:00
2019-01-08 12:50:41 -08:00
2017-05-27 09:12:22 -07:00
2022-10-10 21:40:08 -07:00
2016-11-16 16:36:36 +01:00
2021-08-13 08:24:14 -07:00
2022-10-17 23:35:01 -07:00
2017-04-19 10:56:48 -07:00
2022-10-04 13:59:32 -07:00
2016-12-07 17:41:50 +00:00
2022-10-17 23:35:01 -07:00

Yoga Support Ukraine CocoaPods npm bintray NuGet

Building

Yoga builds with buck. Make sure you install buck before contributing to Yoga. Yoga's main implementation is in C++, with bindings to supported languages and frameworks. When making changes to Yoga please ensure the changes are also propagated to these bindings when applicable.

Alternatively, you can build and install Yoga using vcpkg dependency manager:

git clone https://github.com/Microsoft/vcpkg.git
cd vcpkg
./bootstrap-vcpkg.sh
./vcpkg integrate install
./vcpkg install yoga

The Yoga port in vcpkg is kept up to date by Microsoft team members and community contributors.

If the version is out of date, please create an issue or pull request on the vcpkg repository.

Testing

For testing we rely on gtest as a submodule. After cloning Yoga run git submodule init followed by git submodule update.

For any changes you make you should ensure that all the tests are passing. In case you make any fixes or additions to the library please also add tests for that change to ensure we don't break anything in the future. Tests are located in the tests directory. Run the tests by executing buck test //:yoga.

Instead of manually writing a test which ensures parity with web implementations of Flexbox you can run gentest/gentest.rb to generate a test for you. You can write html which you want to verify in Yoga, in gentest/fixtures folder, such as the following.

<div id="my_test" style="width: 100px; height: 100px; align-items: center;">
  <div style="width: 50px; height: 50px;"></div>
</div>

Run gentest/gentest.rb to generate test code and re-run buck test //:yoga to validate the behavior. One test case will be generated for every root div in the input html.

You should run bundle install in the gentest directory to install dependencies for the gentest/gentest.rb Ruby script.

.NET

.NET testing is not integrated in buck yet, you might need to set up .NET testing environment. We have a script which to launch C# test on macOS, csharp/tests/Facebook.Yoga/test_macos.sh.

Benchmarks

Benchmarks are located in benchmark/YGBenchmark.c and can be run with buck run //benchmark:benchmark. If you think your change has affected performance please run this before and after your change to validate that nothing has regressed. Benchmarks are run on every commit in CI.

JavaScript

Installing through NPM

npm install yoga-layout

By default this will install the library and try to build for all platforms (node, browser asm, and standalone webpack). You may receive errors if you do not have the required platform development tools already installed. To preset the platform you'd like to build for you can set a .npmrc property first.

npm config set yoga-layout:platform standalone

This will now only run the standalone webpack build upon install.

Build Platforms

name description
all (default) Builds all of these platforms.
browser Builds asm js browser version.
node Builds node js version.
standalone Runs webpack.
none Does nothing. You can use the prepackaged libs.

Maintainer Release Guide

Release artifacts are published automatically when a new GitHub release is created. The publishing workflows may also be executed manually, given a Git Tag, to re-attempt publish.

NPM and NuGet packages are not currently published.

Description
Yoga is an embeddable layout engine targeting web standards.
Readme MIT 37 MiB
Yoga 3.2.1 Latest
2024-12-12 17:41:47 -08:00
Languages
C++ 46.4%
Java 25.2%
TypeScript 23.1%
HTML 2.6%
JavaScript 1%
Other 1.6%