feat(layout): block-level horizontal alignment for fixed-size flow children#183
Merged
Conversation
…ildren Fixed-size flow children (paths, images, SVG icons, barcodes) left-align by default; centring one meant wrapping it in a full-width container and hand-computing the content width (the recurring friction behind the roadmap item). - HorizontalAlign (LEFT/CENTER/RIGHT) + AlignNode: fills the available width and seats its single child via the existing stack placement engine (one anchor) — no new render handler, no hot-path change - DSL: addAligned(align, node) for any fixed node, plus the icon sugar addSvgIcon(icon, width, align) - BlockAlignExample (caption=API / body=result), registered + README row - 5 tests pinning exact placement x for LEFT/CENTER/RIGHT + the icon overload
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes the recurring "how do I centre an SVG icon?" friction (hit on the gallery, the костыль discussion, and again now) — the roadmap's block-level alignment item (#178).
What
Fixed-size flow children (paths, images, SVG icons, barcodes, shape containers) left-align by default; there was no built-in way to centre or right-align one without wrapping it in a full-width container and hand-computing
pageWidth − margins.HorizontalAlign(LEFT / CENTER / RIGHT) +AlignNode— fills the available content width and seats its single child via the existing stack placement engine (one anchor). No new render handler (emitFragmentsis empty), no hot-path change.flow.addAligned(align, node)for any fixed node, plus the icon sugarflow.addSvgIcon(icon, width, align).Verification
./mvnw verify -pl .→ BUILD SUCCESS, +5 tests pinning exact placement x for LEFT (=margin), CENTER (=margin + (content−w)/2), RIGHT (=margin + content−w), plus the icon overload — they catch any regression in the offset math, not just "it renders".BlockAlignExample(caption=API / body=result), registered in GenerateAllExamples + ShowcaseMetadata, README row + section;block-align.pdfcommitted. Proof render shows one mark left / centre / right on the page.Self-reviewed (six lanes). Architecture:
HorizontalAlignis a pure semantic enum — the LayerAlign mapping lives in the layout layer, not the public node API. Independent of any open branch — clean off develop.