Files
yoga/javascript
Nick Gerleman 568718242d Remove legacy absolute positioning path (#1725)
Summary:
X-link: https://github.com/facebook/react-native/pull/46984

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

The legacy (wrong) absolute positioning path positions in two places, including work that is definitely always overwritten in the new absolute layout path.

This came up before for position: static, but we didn't clean this up at the time. This code is also now leading display: contents impl being more annoying.

This diff tries to converge to the more spec correct implementation of positioning here, that also only happens in one place.

Previous path would potentially also incorrectly justify when `justify-content` was non-default, but not handled in the previous few cases? We don't have access to the flexLine at this point later, and apart from the existing tests now passing I reused the new correct logic for justification (spec says we should position child as if its the only child in the container https://www.w3.org/TR/css-flexbox-1/#abspos-items).

I added a new, more scoped errata `AbsolutePositionWithoutInsetsExcludesPadding` to preserve some of the legacy behavior that showed as very breaking.

I also did not try removing `AbsolutePercentAgainstInnerSize` which I suspect would be more breaking than this change.

Changelog:
[General][Breaking] - More spec compliant absolute positioning

Reviewed By: joevilches

Differential Revision: D64244949

fbshipit-source-id: ca97570e0de82e8f0424a0912adfd0b05254559e
2024-10-17 22:40:16 -07:00
..

yoga-layout

This package provides prebuilt WebAssembly bindings for the Yoga layout engine.

See more at https://yogalayout.dev

Usage

import {Yoga, Align} from 'yoga-layout';

const node = Yoga.Node.create();
node.setAlignContent(Align.Center);

Objects created by Yoga.<>.create() are not automatically garbage collected and should be freed once they are no longer in use.

// Free a config
config.free();

// Free a tree of Nodes
node.freeRecursive();

// Free a single Node
node.free();

Requirements

yoga-layout requires a toolchain that supports ES Modules and top-level await.

If top-level-await is not supported, use the yoga-layout/load entry point instead. This requires to load yoga manually:

import {loadYoga, Align} from 'yoga-layout/load';

const node = (await loadYoga).Node.create();
node.setAlignContent(Align.Center);