-
Notifications
You must be signed in to change notification settings - Fork 13
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
New package alfa-painting-order
#1756
Conversation
🦋 Changeset detectedLatest commit: 38bae09 The changes in this PR will be included in the next version bump. This PR includes changesets to release 80 packages
Not sure what this means? Click here to learn what changesets are. Click here if you're a maintainer who wants to add another changeset to this PR |
There was a problem hiding this comment.
Choose a reason for hiding this comment
The reason will be displayed to describe this comment to others. Learn more.
Looks good. Some code organisation comments.
packages/alfa-painting-order/src/predicate/is-flex-or-grid-child.ts
Outdated
Show resolved
Hide resolved
packages/alfa-painting-order/src/predicate/creates-stacking-context.ts
Outdated
Show resolved
Hide resolved
packages/alfa-painting-order/src/predicate/creates-stacking-context.ts
Outdated
Show resolved
Hide resolved
packages/alfa-painting-order/src/predicate/creates-stacking-context.ts
Outdated
Show resolved
Hide resolved
packages/alfa-painting-order/src/predicate/creates-stacking-context.ts
Outdated
Show resolved
Hide resolved
packages/alfa-painting-order/test/predicate/creates-stacking-context.spec.tsx
Outdated
Show resolved
Hide resolved
!pr extract |
!pr extract |
80231f8
to
36171a3
Compare
@Jym77 I addressed most of the comments, except two that I would like to look into in a follow up PR, but after the other work that depend on this one (using it to compute clickable area). |
Co-authored-by: Jean-Yves Moyen <[email protected]>
Co-authored-by: Jean-Yves Moyen <[email protected]>
Co-authored-by: Jean-Yves Moyen <[email protected]>
!pr extract |
This PR introduces a new package which contains functionality for computing the painting order of HTML elements based on the specification: https://drafts.csswg.org/css2/#painting-order.
The process for computing the painting order is fairly complex and that reflects in the implementation. This is the first step to make something that works in most common use cases. There are possibly room for caching some computations and other optimizations as well as making the algorithm easier to follow and less error-prone.
The current implementation does not consider scrolling frames, but that could be a logical next step if needed.
The painting order can be used for e.g. detecting if elements are fully or partially covered by other elements, which is relevant when determining the clickable area of an element. More on that in future PRs.