refactor(web_core): centralize layout mapping logic#1258
Open
ppazosp wants to merge 6 commits intogoogle:mainfrom
Open
refactor(web_core): centralize layout mapping logic#1258ppazosp wants to merge 6 commits intogoogle:mainfrom
ppazosp wants to merge 6 commits intogoogle:mainfrom
Conversation
…eview Moved mapJustify/mapAlign from common/ to basic_catalog/styles/ since they are specific to basic catalog widgets (Row, Column, List), not protocol-level. Updated consumer imports in react, lit, and angular to use @a2ui/web_core/v0_9/basic_catalog.
Resolves conflicts introduced by: - google#1079 (Lit) and google#1205 (React) — deleted the minimal catalog entirely, so our edits to minimal/{Row,Column} files are dropped. - google#1166 (Angular) — introduced a new local JUSTIFY_MAP/ALIGN_MAP in angular/catalog/basic/utils.ts and used them inline in row.component.ts / column.component.ts. Since google#840's goal is to eliminate these duplicates, utils.ts is removed and the components now import mapJustify/mapAlign from @a2ui/web_core/v0_9/basic_catalog. - web_core/basic_catalog/index.ts now re-exports both the new layout helpers and the injectBasicCatalogStyles helper from upstream.
…mappers mapJustify/mapAlign previously coerced both undefined input and unknown enum values into hardcoded defaults (flex-start / stretch). This caused two silent regressions: - Undefined props produced a concrete CSS value, overriding inherited styles and CSS-variable theming (breaks the --a2ui-*-gap pattern introduced in google#1166). - Unknown enum values were swallowed, masking future spec additions or malformed agent output from the browser's styling pipeline. Return undefined on nullish input so consumers leave the style unset. Pass unknown values through unchanged so they stay visible. Matches the pre-google#1030 Angular behavior documented in row.component.spec.ts (align: 'baseline') and column.component.spec.ts ('missing justify and align' case). Tests updated in layout.test.ts; full suites still pass (web_core 273, angular 229, react 443, lit 70).
- Use Map instead of Record<string, string> so prototype keys such as 'toString' no longer resolve to inherited functions. - Accept null alongside undefined in the parameter type; both return undefined so consumers leave the CSS property unset. - Add 'baseline' as an explicit entry in alignMap (previously worked via passthrough). Documents it as a supported alignment value. - Add tests for null input and the 'toString' prototype collision.
6 tasks
![gemini-code-assist[bot]](https://avatars.githubusercontent.com/in/956858?s=60&v=4){kind=small}
Contributor
There was a problem hiding this comment.
Code Review
This pull request centralizes the layout mapping logic for justify-content and align-items by moving mapJustify and mapAlign into a shared web_core package. This change unifies the behavior across Angular and React renderers and includes new unit tests. Feedback suggests using ReadonlyMap for the internal mapping constants to enhance type safety.
Comment on lines
+33
to
+41
| const justifyMap = new Map<string, string>([ | ||
| ['center', 'center'], | ||
| ['end', 'flex-end'], | ||
| ['spaceAround', 'space-around'], | ||
| ['spaceBetween', 'space-between'], | ||
| ['spaceEvenly', 'space-evenly'], | ||
| ['start', 'flex-start'], | ||
| ['stretch', 'stretch'], | ||
| ]); |
Contributor
There was a problem hiding this comment.
Using a Map is a good choice to avoid prototype chain lookups. To further improve type safety and prevent accidental mutations, consider marking the maps as ReadonlyMap and potentially using a union type for the keys if the A2UI layout enums are defined elsewhere in the codebase.
Suggested change
| const justifyMap = new Map<string, string>([ | |
| ['center', 'center'], | |
| ['end', 'flex-end'], | |
| ['spaceAround', 'space-around'], | |
| ['spaceBetween', 'space-between'], | |
| ['spaceEvenly', 'space-evenly'], | |
| ['start', 'flex-start'], | |
| ['stretch', 'stretch'], | |
| ]); | |
| const justifyMap: ReadonlyMap<string, string> = new Map<string, string>([ | |
| ['center', 'center'], | |
| ['end', 'flex-end'], | |
| ['spaceAround', 'space-around'], | |
| ['spaceBetween', 'space-between'], | |
| ['spaceEvenly', 'space-evenly'], | |
| ['start', 'flex-start'], | |
| ['stretch', 'stretch'], | |
| ]); |
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.
Description
Creates
mapJustify()andmapAlign()functions inrenderers/web_core/src/v0_9/common/layout.tsas the single source of truth for layout enum-to-CSS mapping.spaceBetween) were passed directly to CSS instead of being mapped to valid values (space-between)Fixes #840
Pre-launch Checklist