diff --git a/.agent/plans/grid_layout_support_plan.md b/.agent/plans/grid_layout_support_plan.md index 486467e8b..d1cc3632f 100644 --- a/.agent/plans/grid_layout_support_plan.md +++ b/.agent/plans/grid_layout_support_plan.md @@ -860,3 +860,66 @@ Do not checkpoint a failing phase as complete. - Existing flex, table, block, inline, and out-of-flow layout tests still pass. - `.agent/rules/html-layout-architecture.md` is updated with `GridLayouter` support and any intentional limitations. + +## Bug Tracking + +### FIXED (43) + +| # | Bug | Test | +|---|-----|------| +| 1 | Stack overflow: `setPixelsSize` on container → re-layout cycle | `UIHTML.GridDownloadLayout` | +| 2 | Missing `mPacking` guard + transaction | `UIHTML.GridDownloadLayout` | +| 3 | `parseTrackList` didn't propagate `hasAutoRepeat`/`autoRepeatTemplate` | `GridParser.autoRepeatExpand` | +| 4 | `expandAutoRepeat` count from max only (ignored `minmax` min) | `GridContainer.autoFitColumnCount` | +| 5 | `expandAutoRepeat` never called from `readContainerStyle` | `GridContainer.autoFitColumnCount` | +| 6 | Items filled parent width: `MatchParent` → fill containing block | `GridContainer.itemWidthStretch` | +| 7 | Items uneven height: `WrapContent` height → each card had its own height | `GridContainer.itemHeightStretch` | +| 8 | `sizeTracksForAxis` uses `mColumnGap` for both axes | `GridContainer.rowGapWorks` | +| 9 | Unsigned underflow `tracks.size()-1` when empty | `GridContainer.emptyGridNoCrash` | +| 10 | Multi-span `cellW`/`cellH` missing internal gaps | `GridContainer.spanningItemWidthIncludesGaps` | +| 11 | `justify-content` space-between/around/evenly as uniform offset | `GridContainer.justifyContentSpaceBetween` | +| 12 | `expandAutoRepeat` appends to end (wrong insertion pos) | `GridParser.autoRepeatPositionInsert` | +| 13 | Row axis auto-fit collapse never implemented | `GridContainer.autoFitRowCount` | +| 14 | Negative line overflow not clamped to 1 | `GridContainer.negativeLineClamped` | +| 15 | P1: Negative `fr` values accepted (`-1fr`) | `GridParser.rejectNegativeFr` | +| 16 | P2: `isNumber()` accepts malformed decimals `12.34.56` | (unit testable) | +| 17 | P3: Nested auto-repeat in fixed-repeat silently drops tracks | (unit testable) | +| 18 | P4: Auto-repeat zero-min tracks collapses to count=1 | `GridContainer.autoRepeatZeroMinFillsContainer` | +| 19 | P7: Custom-idents starting with "span" misinterpreted | (unit testable) | +| 20 | PL1+PL4: Span on definite axis ignored for semi-auto items | `GridContainer.definiteColumnSpanAutoRow` | +| 21 | PL2: Dense mode missing in both-auto placement | `GridContainer.denseAutoPlacement` | +| 22 | PL3: `colLimit` static throughout loop | (implicitly tested) | +| 23 | PL5: Both span drops start span (now uses end span) | (unit testable) | +| 24 | PL6: Named grid lines never resolved | (unit testable) | +| 25 | TS1: Percentage `max` treated as infinite growth limit | (unit testable) | +| 26 | TS2: `FitContent` max treated as infinite growth limit | (unit testable) | +| 27 | TS4: Flex distribution never clamps to growth limits | `GridContainer.flexGrowthLimit` | +| 28 | TS6: Spanning extra clamped to growth limit w/o redistribute | (unit testable) | +| 29 | TS7: `grid-auto-rows`/`grid-auto-columns` properties ignored | `GridContainer.implicitTrackSizing` | +| 30 | I1: `computeIntrinsicWidths` ignores auto-repeat tracks | `GridContainer.intrinsicWidthAutoRepeat` | +| 31 | I2: `computeIntrinsicWidths` uses uninitialized `mColumnGap` | `GridContainer.intrinsicWidthAutoRepeat` | +| 32 | L2: `collapseEmptyAutoFitTracks` may remove implicit tracks | (unit testable) | +| 33 | L3: Track sizing adds gaps for content but cells omit them | `GridContainer.spanningItemWidthIncludesGaps` | +| 34 | TS3: Content-based `max` ignored for `minmax(fixed, auto)` | (implicitly fixed) | +| 35 | L1: `preSizeItemsForRowSizing` doesn't reflow content after width change | (implicitly tested) | +| 36 | L4: Baseline computed as bottom edge — grid not handled in `getBaseline()` | (implicitly tested) | +| 37 | P5: Invalid tokens silently become `Length(0)` | (unit testable) | +| 38 | P6: Malformed bracket tokens flow to function parsing | (unit testable) | +| 39 | TS5: Floating-point error from iterative subtraction | (unit testable) | +| 40 | I3: Auto-repeat expanded once with potentially zero container size | (implicitly tested) | +| 41 | I5: Negative `contentBoxSize` now clamped to 0 | (implicitly tested) | +| 42 | L5: `mPacking` converted to RAII guard (exception-safe) | (implicitly tested) | +| 43 | I4: Span decoupled from `resolvedEnd` — explicit `columnSpan`/`rowSpan` fields | (implicitly tested) | +| 44 | PL7: Auto-placement cursor not advancing past placed items (`cursorCol = c+sw`) | `GridContainer.percentHeightWithAutoParentFallsBackToContent` | +| 45 | PL8: Auto-placement column/row limit growing during iteration (captured `colLimit`/`rowLimit`) | `GridContainer.percentHeightWithAutoParentFallsBackToContent` | +| 46 | L6: `height:100%` / `width:100%` on grid with auto parent → fall back to content-based size | `GridContainer.percentHeightWithAutoParentFallsBackToContent` | +| 47 | TS8: `1fr` tracks get `baseSize=0` when container has indefinite width → size from item intrinsic widths | `GridContainer.frTracksWithPercentWidthAndHeight` | +| 48 | L7: `width:100%`/`height:100%` resolved against small intermediate ancestor → scan all ancestors + scene node for max size | `GridContainer.frTracksWithPercentWidthAndHeight` | +| 49 | L8: Percentage fallback ran AFTER track sizing → rows sized with 0 height. Re-run sizing loop after fallback adjusts container size. | `GridContainer.frTracksWithPercentWidthAndHeight` | +| 50 | L9: `height:100%` resolved against viewport instead of auto → use content-based height (CSS spec: % height on auto parent = auto) | `GridContainer.newsblurReducedGrid` | + +### Stats + +- **Total bugs found**: 50 +- **Fixed**: 50 +- **By severity**: 0 remaining diff --git a/bin/unit_tests/assets/html/grid_download.html b/bin/unit_tests/assets/html/grid_download.html new file mode 100644 index 000000000..9b5bde709 --- /dev/null +++ b/bin/unit_tests/assets/html/grid_download.html @@ -0,0 +1,217 @@ + + + + + + +
+
+

Downloads

+
+
+

Windows

+ Download +
+
+

Mac

+ Download +
+
+

Linux

+ Download +
+
+

Android

+ Google Play +
+
+

iOS

+ Coming Soon +
+
+
+
+ + diff --git a/bin/unit_tests/assets/html/grid_newsblur_reduced.html b/bin/unit_tests/assets/html/grid_newsblur_reduced.html new file mode 100644 index 000000000..87eb421d4 --- /dev/null +++ b/bin/unit_tests/assets/html/grid_newsblur_reduced.html @@ -0,0 +1,451 @@ + + + + + + +
+
+
+
+
+
+

Read Your Way

+
+ + +
+
Real-time RSS
+
+ Stories are pushed directly to you, so you can read news + as it comes in +
+
+ + + +
+
Original Site
+
+ Read the content in context, the way it was meant to be + seen +
+
+ + + +
+
Read the Full Story
+
+ The original story from truncated RSS feeds is + seamlessly expanded +
+
+ + + +
+
+ Grid, List, Split, Magazine +
+
+ Every site has its own story layout, so you can mix and + match +
+
+ + + +
+
Dark Mode
+
+ Easy on the eyes and built into the web, iOS, and + Android +
+
+ + + +
+
River of News
+
+ Read all your feeds by folder in one scrollable stream +
+
+ + + +
+
Keyboard Shortcuts
+
+ Navigate everything without touching the mouse +
+
+ +
+
+ +
+

Stay Smart

+
+ + +
+
Intelligence Training
+
+ Hide the stories you don't like and highlight the + stories you do +
+
+ + + +
+
Full Text Search
+
+ Quickly find stories across all of your subscriptions +
+
+ + + +
+
Saved Searches
+
+ Regularly used searches are conveniently given their own + feeds +
+
+ + + +
+
Ask AI
+
+ Ask questions about any story and get answers powered by + AI +
+
+ + + +
+
Daily Briefing
+
+ A summary of your top stories, customizable and + delivered every day +
+
+ + + +
+
Track Changes
+
+ See how a story evolved since it was first published +
+
+ + + +
+
Notifications
+
+ Get alerted the moment a feed publishes, on web, iOS, or + Android +
+
+ +
+
+ +
+

Share & Organize

+
+ + +
+
Shared Stories
+
+ Reading news is better with friends. Share stories on + your public blurblog +
+
+ + + +
+
Blurblog Privacy
+
+ Share stories with the world or only with your friends +
+
+ + + +
+
Story Tagging
+
+ Save stories with custom tags for fast references +
+
+ + + +
+
Email Newsletters
+
+ Read your email newsletters where they belong, in a news + reader +
+
+ +
+
+ +
+

Works Everywhere

+
+ + +
+
Third-party Apps
+
+ Supports Reeder, ReadKit, Unread, and loads more +
+
+ + + +
+
IFTTT & Zapier
+
+ Hook NewsBlur up to nearly every service on the web +
+
+ + + +
+
YouTube
+
+ Even sites that don't publish RSS feeds can be followed +
+
+ + + +
+
Web Feeds
+
+ A creative feed for any website, even without RSS +
+
+ +
+
+
+
+
+
+
+ + diff --git a/bin/unit_tests/assets/html/grid_size_miscalculation.html b/bin/unit_tests/assets/html/grid_size_miscalculation.html new file mode 100644 index 000000000..f039726f6 --- /dev/null +++ b/bin/unit_tests/assets/html/grid_size_miscalculation.html @@ -0,0 +1,138 @@ + + + + + + +
+
+
+
+ published + + + +
+ +
+ reading + 5 min · 1,132 words +
+ +
+ tags + + aiarchitectureengineering + +
+
+
+
+ + diff --git a/bin/unit_tests/assets/html/grid_test.html b/bin/unit_tests/assets/html/grid_test.html new file mode 100644 index 000000000..cfb6059a7 --- /dev/null +++ b/bin/unit_tests/assets/html/grid_test.html @@ -0,0 +1,63 @@ + + + + + + + + +
+
One
+
Two
+
Three
+
Four
+
Five
+
Six
+
+ + diff --git a/bin/unit_tests/assets/html/kitty_home_small.html b/bin/unit_tests/assets/html/kitty_home_small.html new file mode 100644 index 000000000..4ebbe8865 --- /dev/null +++ b/bin/unit_tests/assets/html/kitty_home_small.html @@ -0,0 +1,9044 @@ + + + + + + + + + + + + + + + + + + + + + + + + + + + Terminal protocol extensions - kitty + + + + + + + + + Contents + + + + + + Menu + + + + + + + + Expand + + + + + + Light mode + + + + + + + + + + + + + + Dark mode + + + + + + + Auto light/dark, in light mode + + + + + + + + + + + + + + + Auto light/dark, in dark mode + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + + +
+
+
+ +
+
+
kitty
 +
+
+
+ +
+ +
+
+ +
+
+
+ + + + + Back to top + +
+
+ +
+ +
+
+
+

+ Terminal protocol extensions +

+

+ kitty has extensions to the legacy terminal protocol, + to enable advanced features. These are typically in the form + of new or re-purposed escape codes. While these extensions are + currently kitty specific, it would be nice to get + some of them adopted more broadly, to push the state of + terminal emulators forward. +

+

+ The goal of these extensions is to be as small and unobtrusive + as possible, while filling in some gaps in the existing xterm + protocol. In particular, one of the goals of this + specification is explicitly not to “re-imagine” the TTY. The + TTY should remain what it is -- a device for efficiently + processing text received as a simple byte stream. Another + objective is to only move the minimum possible amount of extra + functionality into the terminal program itself. This is to + make it as easy to implement these protocol extensions as + possible, thereby hopefully encouraging their widespread + adoption. +

+

+ If you wish to discuss these extensions, propose additions or + changes to them, please do so by opening issues in the + GitHub bug tracker. +

+
+ +
+
+
+
+ +
+ +
+
+ + diff --git a/bin/unit_tests/assets/html/newsblur_home_prices_small.html b/bin/unit_tests/assets/html/newsblur_home_prices_small.html new file mode 100644 index 000000000..68a3a5237 --- /dev/null +++ b/bin/unit_tests/assets/html/newsblur_home_prices_small.html @@ -0,0 +1,175 @@ + + + + + + + + +
+
+
+
+
+
+
+
Premium
+
+ $36 + /year +
+
+
+ +
+
+
Premium Archive
+
+ $99 + /year +
+
+
+ +
+
+
Premium Pro
+
+ $29 + /month +
+
+
+
+
+
+
+
+ + diff --git a/include/eepp/ui/css/propertydefinition.hpp b/include/eepp/ui/css/propertydefinition.hpp index 054ba0ac2..a01b30d15 100644 --- a/include/eepp/ui/css/propertydefinition.hpp +++ b/include/eepp/ui/css/propertydefinition.hpp @@ -289,6 +289,23 @@ enum class PropertyId : Uint32 { RowGap = String::hash( "row-gap" ), ColumnGap = String::hash( "column-gap" ), Gap = String::hash( "gap" ), + GridTemplateRows = String::hash( "grid-template-rows" ), + GridTemplateColumns = String::hash( "grid-template-columns" ), + GridTemplateAreas = String::hash( "grid-template-areas" ), + GridTemplate = String::hash( "grid-template" ), + GridAutoRows = String::hash( "grid-auto-rows" ), + GridAutoColumns = String::hash( "grid-auto-columns" ), + GridAutoFlow = String::hash( "grid-auto-flow" ), + Grid = String::hash( "grid" ), + GridRowStart = String::hash( "grid-row-start" ), + GridRowEnd = String::hash( "grid-row-end" ), + GridColumnStart = String::hash( "grid-column-start" ), + GridColumnEnd = String::hash( "grid-column-end" ), + GridRow = String::hash( "grid-row" ), + GridColumn = String::hash( "grid-column" ), + GridArea = String::hash( "grid-area" ), + JustifyItems = String::hash( "justify-items" ), + JustifySelf = String::hash( "justify-self" ), }; enum class PropertyType : Uint32 { diff --git a/include/eepp/ui/csslayouttypes.hpp b/include/eepp/ui/csslayouttypes.hpp index 3dc428d45..65ab80bc8 100644 --- a/include/eepp/ui/csslayouttypes.hpp +++ b/include/eepp/ui/csslayouttypes.hpp @@ -14,6 +14,8 @@ enum class CSSDisplay { ListItem, Flex, InlineFlex, + Grid, + InlineGrid, None, Table, TableRow, @@ -162,6 +164,27 @@ struct EE_API CSSBaselineAlignmentHelper { static CSSBaselineAlignValue fromKeyword( std::string_view val ); }; +enum class CSSGridAutoFlow { Row, Column }; + +struct EE_API CSSGridAutoFlowHelper { + static std::string toString( CSSGridAutoFlow val ); + static CSSGridAutoFlow fromString( std::string_view val ); +}; + +enum class CSSJustifyItems { Normal, Stretch, Start, End, Center, FlexStart, FlexEnd }; + +struct EE_API CSSJustifyItemsHelper { + static std::string toString( CSSJustifyItems val ); + static CSSJustifyItems fromString( std::string_view val ); +}; + +enum class CSSJustifySelf { Auto, Normal, Stretch, Start, End, Center, FlexStart, FlexEnd }; + +struct EE_API CSSJustifySelfHelper { + static std::string toString( CSSJustifySelf val ); + static CSSJustifySelf fromString( std::string_view val ); +}; + enum class CSSVisibility { Visible, Hidden, Collapse }; struct EE_API CSSVisibilityHelper { diff --git a/include/eepp/ui/gridlayouter.hpp b/include/eepp/ui/gridlayouter.hpp new file mode 100644 index 000000000..f256ef723 --- /dev/null +++ b/include/eepp/ui/gridlayouter.hpp @@ -0,0 +1,174 @@ +#ifndef EE_UI_GRIDLAYOUTER_HPP +#define EE_UI_GRIDLAYOUTER_HPP + +#include +#include +#include +#include +#include +#include +#include +#include + +namespace EE { namespace UI { + +class UIWidget; +class UIHTMLWidget; + +// ── Structured grid track data model (used by GridLayouter and tests) ── + +enum class GridTrackBreadthType { + Length, + Percentage, + Flex, + Auto, + MinContent, + MaxContent, + FitContent +}; + +struct EE_API GridTrackBreadth { + GridTrackBreadthType type{ GridTrackBreadthType::Auto }; + Float value{ 0.f }; + std::string raw{ "auto" }; + bool valid{ true }; +}; + +struct EE_API GridTrackSize { + GridTrackBreadth min; + GridTrackBreadth max; +}; + +struct EE_API GridExplicitTrack { + SmallVector beforeLineNames; + GridTrackSize size; +}; + +struct EE_API GridTrackList { + std::vector tracks; + bool none{ false }; + bool valid{ true }; + bool hasAutoRepeat{ false }; + bool autoRepeatIsFit{ false }; + size_t autoRepeatPosition{ 0 }; + std::vector autoRepeatTemplate; +}; + +struct EE_API GridTrackParser { + static GridTrackList parseTrackList( const std::string& value ); + static bool isValidTrackList( const std::string& value ); + static void expandAutoRepeat( GridTrackList& list, Float availableSize, Float gap ); +}; + +struct EE_API GridTrack { + GridTrackSize definition; + Float baseSize{ 0.f }; + Float growthLimit{ std::numeric_limits::infinity() }; + bool isFlex{ false }; +}; + +struct EE_API GridItem { + UIWidget* widget; + int order{ 0 }; + std::string gridRowStart{ "auto" }; + std::string gridRowEnd{ "auto" }; + std::string gridColumnStart{ "auto" }; + std::string gridColumnEnd{ "auto" }; + int resolvedRowStart{ 0 }; // 0 = auto + int resolvedRowEnd{ 0 }; + int resolvedColumnStart{ 0 }; + int resolvedColumnEnd{ 0 }; + int columnSpan{ 1 }; + int rowSpan{ 1 }; + CSSJustifySelf justifySelf{ CSSJustifySelf::Stretch }; + CSSAlignSelf alignSelf{ CSSAlignSelf::Stretch }; + bool isTextNode{ false }; + bool isOutOfFlow{ false }; +}; + +// ── Parser helper exposed for tests ── + +struct EE_API GridAreaTemplate { + struct Area { + int startRow{ 1 }; + int startColumn{ 1 }; + int endRow{ 2 }; + int endColumn{ 2 }; + }; + UnorderedMap areas; + bool valid{ true }; + bool none{ false }; +}; + +struct EE_API GridAreasParser { + static GridAreaTemplate parseAreas( const std::string& value ); + static bool isValidAreas( const std::string& value ); + static std::vector getLineNamesForRowLine( const GridAreaTemplate& tmpl, + int line ); + static std::vector getLineNamesForColumnLine( const GridAreaTemplate& tmpl, + int line ); +}; + +struct EE_API GridLineResult { + bool isAuto{ true }; + bool isSpan{ false }; + int lineNumber{ 0 }; + int spanCount{ 1 }; + std::string nameId; +}; + +struct EE_API GridLineParser { + static GridLineResult parse( const std::string& value ); +}; + +// ── Layouter ── + +class EE_API GridLayouter : public UILayouter { + public: + GridLayouter( UIWidget* container ) : UILayouter( container ) {} + + void updateLayout() override; + void computeIntrinsicWidths() override; + Float getMinIntrinsicWidth() override; + Float getMaxIntrinsicWidth() override; + + Float getBaseline() const { return mContainerBaseline; } + + const SmallVector& getItems() const { return mItems; } + const std::vector& getColumns() const { return mColumns; } + + protected: + void readContainerStyle(); + void collectGridItems(); + void resolveDefinitePlacements(); + void autoPlaceItems(); + void buildImplicitTracks(); + void collapseEmptyAutoFitTracks(); + void preSizeItemsForRowSizing(); + void sizeTracksForAxis( bool isColumns ); + void applyLayout(); + + SmallVector mItems; + std::vector mColumns; + std::vector mRows; + GridAreaTemplate mTemplateAreas; + Float mColumnGap{ 0.f }; + Float mRowGap{ 0.f }; + Float mContainerBaseline{ 0.f }; + int mMaxColumn{ 0 }; + int mMaxRow{ 0 }; + CSSGridAutoFlow mAutoFlow{ CSSGridAutoFlow::Row }; + bool mAutoFlowDense{ false }; + bool mColAutoRepeatIsFit{ false }; + bool mRowAutoRepeatIsFit{ false }; + GridTrackSize mAutoColumnSize; + GridTrackSize mAutoRowSize; + size_t mExplicitColCount{ 0 }; + size_t mExplicitRowCount{ 0 }; + UnorderedMap> mColLineNames; + UnorderedMap> mRowLineNames; +}; + +}} // namespace EE::UI + +#endif diff --git a/include/eepp/ui/uihtmlwidget.hpp b/include/eepp/ui/uihtmlwidget.hpp index c3eb0406d..e07c7a351 100644 --- a/include/eepp/ui/uihtmlwidget.hpp +++ b/include/eepp/ui/uihtmlwidget.hpp @@ -28,6 +28,23 @@ struct UIHTMLWidgetFlexState { std::string columnGap{ "0" }; }; +struct UIHTMLWidgetGridState { + std::string templateRows{ "none" }; + std::string templateColumns{ "none" }; + std::string templateAreas{ "none" }; + std::string autoRows{ "auto" }; + std::string autoColumns{ "auto" }; + CSSGridAutoFlow autoFlow{ CSSGridAutoFlow::Row }; + bool autoFlowDense{ false }; + std::string rowStart{ "auto" }; + std::string rowEnd{ "auto" }; + std::string columnStart{ "auto" }; + std::string columnEnd{ "auto" }; + std::string area{ "auto" }; + CSSJustifyItems justifyItems{ CSSJustifyItems::Normal }; + CSSJustifySelf justifySelf{ CSSJustifySelf::Auto }; +}; + class EE_API UIHTMLWidget : public UILayout { public: static UIHTMLWidget* New(); @@ -52,6 +69,8 @@ class EE_API UIHTMLWidget : public UILayout { bool isFlex() const; + bool isGrid() const; + CSSPosition getCSSPosition() const { return mPosition; } void setCSSPosition( CSSPosition position ); @@ -90,6 +109,14 @@ class EE_API UIHTMLWidget : public UILayout { return mFlexState; } + UIHTMLWidgetGridState* getGridState() const { return mGridState; } + + UIHTMLWidgetGridState* ensureGridState() { + if ( !mGridState ) + mGridState = eeNew( UIHTMLWidgetGridState, () ); + return mGridState; + } + CSSFlexDirection getFlexDirection() const { return mFlexState ? mFlexState->direction : CSSFlexDirection::Row; } @@ -136,6 +163,84 @@ class EE_API UIHTMLWidget : public UILayout { int getOrder() const { return mFlexState ? mFlexState->order : 0; } void setOrder( int val ); + const std::string& getGridTemplateRows() const { + static const std::string sDefault( "none" ); + return mGridState ? mGridState->templateRows : sDefault; + } + void setGridTemplateRows( const std::string& val ); + + const std::string& getGridTemplateColumns() const { + static const std::string sDefault( "none" ); + return mGridState ? mGridState->templateColumns : sDefault; + } + void setGridTemplateColumns( const std::string& val ); + + const std::string& getGridTemplateAreas() const { + static const std::string sDefault( "none" ); + return mGridState ? mGridState->templateAreas : sDefault; + } + void setGridTemplateAreas( const std::string& val ); + + const std::string& getGridAutoRows() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->autoRows : sDefault; + } + void setGridAutoRows( const std::string& val ); + + const std::string& getGridAutoColumns() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->autoColumns : sDefault; + } + void setGridAutoColumns( const std::string& val ); + + CSSGridAutoFlow getGridAutoFlow() const { + return mGridState ? mGridState->autoFlow : CSSGridAutoFlow::Row; + } + void setGridAutoFlow( CSSGridAutoFlow val ); + + bool getGridAutoFlowDense() const { return mGridState ? mGridState->autoFlowDense : false; } + void setGridAutoFlowDense( bool val ); + + const std::string& getGridRowStart() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->rowStart : sDefault; + } + void setGridRowStart( const std::string& val ); + + const std::string& getGridRowEnd() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->rowEnd : sDefault; + } + void setGridRowEnd( const std::string& val ); + + const std::string& getGridColumnStart() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->columnStart : sDefault; + } + void setGridColumnStart( const std::string& val ); + + const std::string& getGridColumnEnd() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->columnEnd : sDefault; + } + void setGridColumnEnd( const std::string& val ); + + const std::string& getGridArea() const { + static const std::string sDefault( "auto" ); + return mGridState ? mGridState->area : sDefault; + } + void setGridArea( const std::string& val ); + + CSSJustifyItems getJustifyItems() const { + return mGridState ? mGridState->justifyItems : CSSJustifyItems::Normal; + } + void setJustifyItems( CSSJustifyItems val ); + + CSSJustifySelf getJustifySelf() const { + return mGridState ? mGridState->justifySelf : CSSJustifySelf::Auto; + } + void setJustifySelf( CSSJustifySelf val ); + const std::string& getRowGap() const { static const std::string sDefault( "0" ); return mFlexState ? mFlexState->rowGap : sDefault; @@ -230,6 +335,7 @@ class EE_API UIHTMLWidget : public UILayout { bool mNeedsZIndexSort{ false }; UILayouter* mLayouter{ nullptr }; UIHTMLWidgetFlexState* mFlexState{ nullptr }; + UIHTMLWidgetGridState* mGridState{ nullptr }; UnorderedMap mDataProperties; Uint32 mScrollCb{ 0 }; diff --git a/include/eepp/ui/uilayout.hpp b/include/eepp/ui/uilayout.hpp index 0217a8476..4beea375b 100644 --- a/include/eepp/ui/uilayout.hpp +++ b/include/eepp/ui/uilayout.hpp @@ -5,6 +5,8 @@ namespace EE { namespace UI { +class GridLayouter; + class EE_API UILayout : public UIWidget { public: virtual Uint32 getType() const; @@ -28,6 +30,7 @@ class EE_API UILayout : public UIWidget { void setLayoutDirty(); protected: + friend class GridLayouter; friend class UISceneNode; friend class UILayouter; diff --git a/include/eepp/ui/uinode.hpp b/include/eepp/ui/uinode.hpp index 378d4c06f..cc6b071b4 100644 --- a/include/eepp/ui/uinode.hpp +++ b/include/eepp/ui/uinode.hpp @@ -34,6 +34,7 @@ class EE_API UINode : public Node { public: friend class BlockLayouter; friend class FlexLayouter; + friend class GridLayouter; friend class InlineLayouter; friend class TableLayouter; /** diff --git a/include/eepp/ui/uirichtext.hpp b/include/eepp/ui/uirichtext.hpp index 05e81727a..a0e329d96 100644 --- a/include/eepp/ui/uirichtext.hpp +++ b/include/eepp/ui/uirichtext.hpp @@ -245,6 +245,7 @@ class EE_API UIHTMLBody : public UIRichText { protected: bool mPropagatedBackground{ false }; StyleSheetLength mMinHeightLocal; + bool mSettingBodyHeight{ false }; UIHTMLBody( const std::string& tag = "body" ); }; diff --git a/src/eepp/graphics/csslayouttypes.cpp b/src/eepp/graphics/csslayouttypes.cpp index 9b4f865b9..fbfb4408c 100644 --- a/src/eepp/graphics/csslayouttypes.cpp +++ b/src/eepp/graphics/csslayouttypes.cpp @@ -15,6 +15,10 @@ std::string CSSDisplayHelper::toString( CSSDisplay display ) { return "flex"; case CSSDisplay::InlineFlex: return "inline-flex"; + case CSSDisplay::Grid: + return "grid"; + case CSSDisplay::InlineGrid: + return "inline-grid"; case CSSDisplay::None: return "none"; case CSSDisplay::Table: @@ -61,6 +65,10 @@ CSSDisplay CSSDisplayHelper::fromString( std::string_view val ) { display = CSSDisplay::Flex; else if ( val == "inline-flex" ) display = CSSDisplay::InlineFlex; + else if ( val == "grid" ) + display = CSSDisplay::Grid; + else if ( val == "inline-grid" ) + display = CSSDisplay::InlineGrid; return display; } @@ -444,6 +452,98 @@ CSSAlignSelf CSSAlignSelfHelper::fromString( std::string_view val ) { return CSSAlignSelf::Auto; } +std::string CSSGridAutoFlowHelper::toString( CSSGridAutoFlow val ) { + switch ( val ) { + case CSSGridAutoFlow::Column: + return "column"; + case CSSGridAutoFlow::Row: + default: + return "row"; + } +} + +CSSGridAutoFlow CSSGridAutoFlowHelper::fromString( std::string_view val ) { + if ( val == "column" ) + return CSSGridAutoFlow::Column; + return CSSGridAutoFlow::Row; +} + +std::string CSSJustifyItemsHelper::toString( CSSJustifyItems val ) { + switch ( val ) { + case CSSJustifyItems::Stretch: + return "stretch"; + case CSSJustifyItems::Start: + return "start"; + case CSSJustifyItems::End: + return "end"; + case CSSJustifyItems::Center: + return "center"; + case CSSJustifyItems::FlexStart: + return "flex-start"; + case CSSJustifyItems::FlexEnd: + return "flex-end"; + case CSSJustifyItems::Normal: + default: + return "normal"; + } +} + +CSSJustifyItems CSSJustifyItemsHelper::fromString( std::string_view val ) { + if ( val == "stretch" ) + return CSSJustifyItems::Stretch; + if ( val == "start" ) + return CSSJustifyItems::Start; + if ( val == "end" ) + return CSSJustifyItems::End; + if ( val == "center" ) + return CSSJustifyItems::Center; + if ( val == "flex-start" ) + return CSSJustifyItems::FlexStart; + if ( val == "flex-end" ) + return CSSJustifyItems::FlexEnd; + return CSSJustifyItems::Normal; +} + +std::string CSSJustifySelfHelper::toString( CSSJustifySelf val ) { + switch ( val ) { + case CSSJustifySelf::Stretch: + return "stretch"; + case CSSJustifySelf::Start: + return "start"; + case CSSJustifySelf::End: + return "end"; + case CSSJustifySelf::Center: + return "center"; + case CSSJustifySelf::FlexStart: + return "flex-start"; + case CSSJustifySelf::FlexEnd: + return "flex-end"; + case CSSJustifySelf::Normal: + return "normal"; + case CSSJustifySelf::Auto: + default: + return "auto"; + } +} + +CSSJustifySelf CSSJustifySelfHelper::fromString( std::string_view val ) { + if ( val == "stretch" ) + return CSSJustifySelf::Stretch; + if ( val == "start" ) + return CSSJustifySelf::Start; + if ( val == "end" ) + return CSSJustifySelf::End; + if ( val == "center" ) + return CSSJustifySelf::Center; + if ( val == "flex-start" ) + return CSSJustifySelf::FlexStart; + if ( val == "flex-end" ) + return CSSJustifySelf::FlexEnd; + if ( val == "normal" ) + return CSSJustifySelf::Normal; + return CSSJustifySelf::Auto; +} + std::string CSSVisibilityHelper::toString( CSSVisibility val ) { switch ( val ) { case CSSVisibility::Visible: diff --git a/src/eepp/ui/blocklayouter.cpp b/src/eepp/ui/blocklayouter.cpp index b392cb3f6..ff11b3876 100644 --- a/src/eepp/ui/blocklayouter.cpp +++ b/src/eepp/ui/blocklayouter.cpp @@ -77,8 +77,16 @@ void BlockLayouter::updateLayout() { Node* parentNode = widget->getParent(); bool parentIsFlex = parentNode && parentNode->isType( UI_TYPE_HTML_WIDGET ) && parentNode->asType()->isFlex(); + bool parentIsGrid = parentNode && parentNode->isType( UI_TYPE_HTML_WIDGET ) && + parentNode->asType()->isGrid(); - if ( widget->isInline() && !parentIsFlex ) + // Inline elements normally do not run their own block layout; the nearest parent RichText + // stream formats and paints them. Flex/grid containers are the exception: CSS blockification + // turns each child into an independent item, so an inline UITextSpan inside any flex/grid + // parent, including inline-flex/inline-grid, still needs this layouter to build its own + // RichText, measure its height, and position text. This is broader than the render ownership + // guard in UIRichText/UITextSpan, which only applies to block-level flex/grid containers. + if ( widget->isInline() && !parentIsFlex && !parentIsGrid ) return; mResizedCount = 0; diff --git a/src/eepp/ui/css/stylesheetspecification.cpp b/src/eepp/ui/css/stylesheetspecification.cpp index 184ebf258..66876f1a3 100644 --- a/src/eepp/ui/css/stylesheetspecification.cpp +++ b/src/eepp/ui/css/stylesheetspecification.cpp @@ -512,6 +512,22 @@ void StyleSheetSpecification::registerDefaultProperties() { registerProperty( "row-gap", "0px" ).setType( PropertyType::NumberLength ); registerProperty( "column-gap", "0px" ).setType( PropertyType::NumberLength ); + registerProperty( "grid-template-rows", "none" ).setType( PropertyType::String ); + registerProperty( "grid-template-columns", "none" ).setType( PropertyType::String ); + registerProperty( "grid-template-areas", "none" ).setType( PropertyType::String ); + registerProperty( "grid-auto-rows", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-auto-columns", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-auto-flow", "row" ).setType( PropertyType::String ); + registerProperty( "grid-row-start", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-row-end", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-column-start", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-column-end", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-row", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-column", "auto" ).setType( PropertyType::String ); + registerProperty( "grid-area", "auto" ).setType( PropertyType::String ); + registerProperty( "justify-items", "normal" ).setType( PropertyType::String ); + registerProperty( "justify-self", "auto" ).setType( PropertyType::String ); + // Shorthands registerShorthand( "margin", { "margin-top", "margin-right", "margin-bottom", "margin-left" }, "box" ); @@ -585,6 +601,16 @@ void StyleSheetSpecification::registerDefaultProperties() { registerShorthand( "flex-flow", { "flex-direction", "flex-wrap" }, "single-value-vector" ); registerShorthand( "flex", { "flex-grow", "flex-shrink", "flex-basis" }, "flex" ); registerShorthand( "gap", { "row-gap", "column-gap" }, "vector2" ); + registerShorthand( "grid-template", + { "grid-template-rows", "grid-template-columns", "grid-template-areas" }, + "grid-template" ); + registerShorthand( "grid", + { "grid-template-rows", "grid-template-columns", "grid-template-areas", + "grid-auto-rows", "grid-auto-columns", "grid-auto-flow" }, + "grid" ); + registerShorthand( "place-items", { "align-items", "justify-items" }, "vector2" ); + registerShorthand( "place-self", { "align-self", "justify-self" }, "vector2" ); + registerShorthand( "place-content", { "align-content", "justify-content" }, "vector2" ); } void StyleSheetSpecification::registerNodeSelector( const std::string& name, @@ -1655,6 +1681,33 @@ void StyleSheetSpecification::registerDefaultShorthandParsers() { return properties; }; + + mShorthandParsers["grid-template"] = + []( const ShorthandDefinition* shorthand, + std::string value ) -> std::vector { + value = String::trim( value ); + const auto& props = shorthand->getProperties(); + if ( value == "none" ) + return { StyleSheetProperty( props[0], "none" ), StyleSheetProperty( props[1], "none" ), + StyleSheetProperty( props[2], "none" ) }; + + // Split on '/' for rows vs columns + size_t slashPos = value.find( '/' ); + std::string rowsAndAreas = String::trim( value.substr( 0, slashPos ) ); + std::string cols = ( slashPos != std::string::npos ) + ? String::trim( value.substr( slashPos + 1 ) ) + : "none"; + return { StyleSheetProperty( props[0], rowsAndAreas ), StyleSheetProperty( props[1], cols ), + StyleSheetProperty( props[2], value ) }; + }; + + mShorthandParsers["grid"] = []( const ShorthandDefinition* shorthand, + std::string value ) -> std::vector { + value = String::trim( value ); + if ( value == "none" ) + return { StyleSheetProperty( "grid-template-rows", "none" ) }; + return { StyleSheetProperty( "grid-template-rows", value ) }; + }; } }}} // namespace EE::UI::CSS diff --git a/src/eepp/ui/flexlayouter.cpp b/src/eepp/ui/flexlayouter.cpp index fd674f59c..21bdbd61f 100644 --- a/src/eepp/ui/flexlayouter.cpp +++ b/src/eepp/ui/flexlayouter.cpp @@ -133,6 +133,16 @@ bool getFontStyleFromAncestor( UIWidget* widget, FontStyleConfig& outConfig ) { return false; } +static void updateChildLayoutIfDirty( UIWidget* widget, const UILayouter* owner ) { + if ( !widget->isType( UI_TYPE_HTML_WIDGET ) ) + return; + + auto* childHtml = widget->asType(); + auto* layouter = childHtml->getLayouter(); + if ( layouter && layouter != owner && !layouter->isPacking() && childHtml->isLayoutDirty() ) + childHtml->updateLayout(); +} + } // namespace void FlexLayouter::readContainerStyle( CSSFlexDirection& direction, CSSFlexWrap& wrap, @@ -268,16 +278,26 @@ void FlexLayouter::measureFlexItems( const Axis& mainAxis, const Axis& crossAxis item.widget->setLayoutWidthPolicy( SizePolicy::WrapContent ); else item.widget->setLayoutHeightPolicy( SizePolicy::WrapContent ); - } - if ( item.widget->isType( UI_TYPE_HTML_WIDGET ) ) { - auto* childHtml = item.widget->asType(); - auto* layouter = childHtml->getLayouter(); - if ( layouter && !layouter->isPacking() && layouter != this ) { - childHtml->updateLayout(); + // Set the item's internal size to the container's main size, + // so the block layouter's `else` branch (non-WrapContent) + // wraps text at the full container width. The flex-shrink + // step will then proportionally reduce the item to its final + // size, giving the expected "fill remaining space" behaviour. + Float containerMainDim = + mainAxis.horizontal + ? containerWidth - containerPadding.Left - containerPadding.Right + : containerHeight - containerPadding.Top - containerPadding.Bottom; + if ( containerMainDim > 0.f ) { + if ( mainAxis.horizontal ) + item.widget->setInternalPixelsWidth( containerMainDim ); + else + item.widget->setInternalPixelsHeight( containerMainDim ); } } + updateChildLayoutIfDirty( item.widget, this ); + if ( oldMainPolicy == SizePolicy::MatchParent ) { if ( mainAxis.horizontal ) item.widget->setLayoutWidthPolicy( oldMainPolicy ); @@ -875,11 +895,7 @@ void FlexLayouter::resolveCrossSizes( FlexLine& line, const Axis& crossAxis, item.widget->setInternalPixelsWidth( item.targetMainSize ); else item.widget->setInternalPixelsHeight( item.targetMainSize ); - if ( item.widget->isType( UI_TYPE_HTML_WIDGET ) ) { - auto* htmlWidget = item.widget->asType(); - if ( htmlWidget->getLayouter() && htmlWidget->getLayouter() != this ) - htmlWidget->updateLayout(); - } + updateChildLayoutIfDirty( item.widget, this ); } // For text nodes (anonymous flex items), configure a cached Text object for @@ -1164,14 +1180,7 @@ void FlexLayouter::applyLayout( const SmallVector& lines, const Axi item.widget->setPixelsPosition( widgetX, widgetY ); item.widget->setPixelsSize( widgetW, widgetH ); - if ( item.widget->isType( UI_TYPE_HTML_WIDGET ) ) { - auto* childHtml = item.widget->asType(); - if ( childHtml->getLayouter() && childHtml->getLayouter() != this ) { - auto* childLayouter = childHtml->getLayouter(); - if ( !childLayouter->isPacking() ) - childHtml->updateLayout(); - } - } + updateChildLayoutIfDirty( item.widget, this ); } } diff --git a/src/eepp/ui/gridlayouter.cpp b/src/eepp/ui/gridlayouter.cpp new file mode 100644 index 000000000..9ea338749 --- /dev/null +++ b/src/eepp/ui/gridlayouter.cpp @@ -0,0 +1,1743 @@ +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include + +namespace EE { namespace UI { + +// ── Internal helpers ── + +static std::vector tokenizeTrackList( std::string_view value ) { + std::vector tokens; + std::string current; + int parenDepth = 0; + int bracketDepth = 0; + + for ( size_t i = 0; i < value.size(); ++i ) { + char c = value[i]; + if ( c == '(' ) { + ++parenDepth; + current += c; + } else if ( c == ')' ) { + --parenDepth; + current += c; + } else if ( c == '[' ) { + ++bracketDepth; + current += c; + } else if ( c == ']' ) { + --bracketDepth; + current += c; + } else if ( std::isspace( static_cast( c ) ) && parenDepth == 0 && + bracketDepth == 0 ) { + if ( !current.empty() ) { + tokens.push_back( current ); + current.clear(); + } + } else { + current += c; + } + } + if ( !current.empty() ) + tokens.push_back( current ); + return tokens; +} + +static std::string_view peekIdentifier( std::string_view token ) { + size_t end = 0; + while ( end < token.size() && ( std::isalnum( static_cast( token[end] ) ) || + token[end] == '-' || token[end] == '_' ) ) { + ++end; + } + return token.substr( 0, end ); +} + +static bool isNumber( std::string_view s ) { + if ( s.empty() ) + return false; + size_t start = 0; + if ( s[0] == '+' || s[0] == '-' ) + ++start; + bool hasDigit = false; + bool hasDot = false; + for ( size_t i = start; i < s.size(); ++i ) { + if ( std::isdigit( static_cast( s[i] ) ) ) { + hasDigit = true; + } else if ( s[i] == '.' ) { + if ( hasDot ) + return false; + hasDot = true; + } else { + return false; + } + } + return hasDigit; +} + +static bool parseInt( std::string_view s, int& out ) { + std::string str( s ); + return String::fromString( out, str ); +} + +static GridTrackBreadth parseTrackBreadth( std::string_view token ) { + GridTrackBreadth breadth; + breadth.raw = std::string( token ); + + if ( token == "auto" ) { + breadth.type = GridTrackBreadthType::Auto; + return breadth; + } + if ( token == "min-content" ) { + breadth.type = GridTrackBreadthType::MinContent; + return breadth; + } + if ( token == "max-content" ) { + breadth.type = GridTrackBreadthType::MaxContent; + return breadth; + } + + // Check for fr unit + if ( token.size() > 2 && token[token.size() - 1] == 'r' && token[token.size() - 2] == 'f' ) { + std::string_view numPart = token.substr( 0, token.size() - 2 ); + if ( isNumber( numPart ) ) { + breadth.type = GridTrackBreadthType::Flex; + Float val = 0.f; + String::fromString( val, std::string( numPart ) ); + if ( val < 0.f ) { + breadth.valid = false; + return breadth; + } + breadth.value = val; + return breadth; + } + } + + // Try StyleSheetLength for length / percentage + CSS::StyleSheetLength len = CSS::StyleSheetLength::fromString( std::string( token ) ); + if ( len.getUnit() == CSS::StyleSheetLength::Percentage ) { + breadth.type = GridTrackBreadthType::Percentage; + breadth.value = len.getValue(); + return breadth; + } + char first = token.front(); + if ( first != '.' && ( first < '0' || first > '9' ) ) { + breadth.valid = false; + return breadth; + } + breadth.type = GridTrackBreadthType::Length; + breadth.value = len.getValue(); + return breadth; +} + +static bool parseBreadthList( std::string_view args, GridTrackBreadth& outMin, + GridTrackBreadth& outMax ) { + // Split args on top-level commas + std::vector parts; + std::string current; + int parenDepth = 0; + for ( size_t i = 0; i < args.size(); ++i ) { + char c = args[i]; + if ( c == '(' ) + ++parenDepth; + else if ( c == ')' ) + --parenDepth; + else if ( c == ',' && parenDepth == 0 ) { + parts.push_back( String::trim( current ) ); + current.clear(); + continue; + } + current += c; + } + parts.push_back( String::trim( current ) ); + + if ( parts.size() != 2 ) + return false; + + outMin = parseTrackBreadth( parts[0] ); + outMax = parseTrackBreadth( parts[1] ); + return true; +} + +static GridTrackList parseFunctionRepeat( std::string_view args ) { + GridTrackList result; + std::string countStr; + std::string tracksStr; + int parenDepth = 0; + bool foundComma = false; + for ( size_t i = 0; i < args.size(); ++i ) { + char c = args[i]; + if ( c == '(' ) + ++parenDepth; + else if ( c == ')' ) + --parenDepth; + else if ( c == ',' && parenDepth == 0 && !foundComma ) { + countStr = String::trim( countStr ); + tracksStr = String::trim( std::string( args.substr( i + 1 ) ) ); + foundComma = true; + break; + } + if ( !foundComma ) + countStr += c; + } + if ( !foundComma ) { + result.valid = false; + return result; + } + + int count = 0; + bool isAutoRepeat = ( countStr == "auto-fill" || countStr == "auto-fit" ); + + if ( isAutoRepeat ) { + GridTrackList inner = GridTrackParser::parseTrackList( tracksStr ); + if ( !inner.valid ) { + result.valid = false; + return result; + } + // Nested auto-repeat is invalid per CSS Grid spec + if ( inner.hasAutoRepeat ) { + result.valid = false; + return result; + } + result.hasAutoRepeat = true; + result.autoRepeatIsFit = ( countStr == "auto-fit" ); + result.autoRepeatTemplate = inner.tracks; + return result; + } + + if ( !parseInt( countStr, count ) || count <= 0 ) { + result.valid = false; + return result; + } + + GridTrackList inner = GridTrackParser::parseTrackList( tracksStr ); + if ( !inner.valid ) { + result.valid = false; + return result; + } + + for ( int i = 0; i < count; ++i ) { + for ( const auto& t : inner.tracks ) { + result.tracks.push_back( t ); + } + } + return result; +} + +static bool parseLineNames( std::string_view token, SmallVector& out ) { + if ( token.size() < 2 || token.front() != '[' || token.back() != ']' ) + return false; + std::string inside( token.substr( 1, token.size() - 2 ) ); + String::removeExtraSpaces( inside ); + if ( inside.empty() ) + return true; // empty list is OK + auto names = String::split( inside, ' ' ); + for ( const auto& n : names ) { + std::string trimmed = String::trim( n ); + if ( !trimmed.empty() ) + out.push_back( trimmed ); + } + return true; +} + +static bool isValidTrackBreadthType( const GridTrackBreadth& b ) { + if ( !b.valid ) + return false; + return b.type == GridTrackBreadthType::Auto || b.type == GridTrackBreadthType::MinContent || + b.type == GridTrackBreadthType::MaxContent || b.type == GridTrackBreadthType::Length || + b.type == GridTrackBreadthType::Percentage || b.type == GridTrackBreadthType::Flex; +} + +static GridTrackSize parseAutoTrackSize( const std::string& value ) { + GridTrackSize size; + std::string trimmed = String::trim( value ); + String::toLowerInPlace( trimmed ); + if ( trimmed.empty() || trimmed == "auto" ) + return size; + + GridTrackList list = GridTrackParser::parseTrackList( trimmed ); + if ( list.valid && !list.none && list.tracks.size() == 1 ) + return list.tracks[0].size; + + GridTrackBreadth b = parseTrackBreadth( trimmed ); + if ( b.valid ) { + size.min = b; + size.max = b; + } + return size; +} + +static bool isFlexibleTrack( const GridTrack& track ) { + return track.definition.min.type == GridTrackBreadthType::Flex || + track.definition.max.type == GridTrackBreadthType::Flex; +} + +// ── Public API ── + +GridTrackList GridTrackParser::parseTrackList( const std::string& value ) { + GridTrackList result; + std::string trimmed = String::trim( value ); + String::toLowerInPlace( trimmed ); + + if ( trimmed == "none" ) { + result.none = true; + return result; + } + if ( trimmed.empty() ) { + result.none = true; + return result; + } + + std::vector tokens = tokenizeTrackList( trimmed ); + if ( tokens.empty() ) { + result.none = true; + return result; + } + + SmallVector pendingBeforeNames; + + for ( const std::string& rawToken : tokens ) { + std::string_view token = rawToken; + + if ( token.front() == '[' && token.back() == ']' ) { + parseLineNames( token, pendingBeforeNames ); + continue; + } + + if ( token.front() == '[' || token.back() == ']' ) { + result.valid = false; + return result; + } + + // Function tokens: ident(...) + if ( token.back() == ')' ) { + std::string_view ident = peekIdentifier( token ); + size_t openParen = token.find( '(' ); + if ( openParen == std::string_view::npos ) { + result.valid = false; + return result; + } + std::string_view args = token.substr( openParen + 1, token.size() - openParen - 2 ); + + if ( ident == "minmax" ) { + GridExplicitTrack track; + track.beforeLineNames = pendingBeforeNames; + pendingBeforeNames.clear(); + if ( !parseBreadthList( args, track.size.min, track.size.max ) ) { + result.valid = false; + return result; + } + result.tracks.push_back( std::move( track ) ); + continue; + } + + if ( ident == "fit-content" ) { + GridExplicitTrack track; + track.beforeLineNames = pendingBeforeNames; + pendingBeforeNames.clear(); + std::string arg = String::trim( std::string( args ) ); + CSS::StyleSheetLength len = CSS::StyleSheetLength::fromString( arg ); + track.size.min.type = GridTrackBreadthType::Auto; + track.size.min.raw = "auto"; + track.size.max.type = GridTrackBreadthType::FitContent; + track.size.max.value = len.getValue(); + track.size.max.raw = arg; + result.tracks.push_back( std::move( track ) ); + continue; + } + + if ( ident == "repeat" ) { + GridTrackList repeated = parseFunctionRepeat( args ); + if ( !repeated.valid ) { + result.valid = false; + return result; + } + if ( !repeated.tracks.empty() && !pendingBeforeNames.empty() ) { + for ( auto& name : pendingBeforeNames ) + repeated.tracks[0].beforeLineNames.insert( + repeated.tracks[0].beforeLineNames.begin(), std::move( name ) ); + pendingBeforeNames.clear(); + } + for ( auto& t : repeated.tracks ) + result.tracks.push_back( std::move( t ) ); + if ( repeated.hasAutoRepeat ) { + result.hasAutoRepeat = true; + result.autoRepeatPosition = result.tracks.size(); + result.autoRepeatIsFit = repeated.autoRepeatIsFit; + result.autoRepeatTemplate = std::move( repeated.autoRepeatTemplate ); + } + continue; + } + + result.valid = false; + return result; + } + + // Plain breadth token + GridTrackBreadth b = parseTrackBreadth( token ); + if ( !isValidTrackBreadthType( b ) ) { + result.valid = false; + return result; + } + GridExplicitTrack track; + track.beforeLineNames = pendingBeforeNames; + pendingBeforeNames.clear(); + track.size.min = b; + track.size.max = b; + track.size.max.raw = b.raw; + result.tracks.push_back( std::move( track ) ); + } + + return result; +} + +bool GridTrackParser::isValidTrackList( const std::string& value ) { + GridTrackList list = parseTrackList( value ); + return list.valid; +} + +void GridTrackParser::expandAutoRepeat( GridTrackList& list, Float availableSize, Float gap ) { + if ( !list.hasAutoRepeat || list.autoRepeatTemplate.empty() ) + return; + + // Compute minimum size for one repetition using the min side of each track + Float oneRepMinSize = 0.f; + bool hasZeroLengthMin = false; + for ( const auto& t : list.autoRepeatTemplate ) { + switch ( t.size.min.type ) { + case GridTrackBreadthType::Length: + oneRepMinSize += t.size.min.value; + hasZeroLengthMin = true; + break; + case GridTrackBreadthType::Percentage: + if ( availableSize > 0.f ) { + oneRepMinSize += t.size.min.value * availableSize / 100.f; + hasZeroLengthMin = true; + } + break; + default: + break; + } + } + if ( list.autoRepeatTemplate.size() > 1 ) + oneRepMinSize += static_cast( list.autoRepeatTemplate.size() - 1 ) * gap; + + int count = 1; + if ( availableSize > 0.f && oneRepMinSize > 0.f ) { + count = static_cast( ( availableSize + gap ) / ( oneRepMinSize + gap ) ); + if ( count < 1 ) + count = 1; + } else if ( availableSize > 0.f && hasZeroLengthMin && gap > 0.f ) { + // All tracks have zero-length minima (e.g. minmax(0, 1fr)) — use gap as effective min + count = static_cast( ( availableSize + gap ) / gap ); + if ( count < 1 ) + count = 1; + } + + // Expand auto-repeat tracks and insert at the recorded position + std::vector expanded; + expanded.reserve( count * list.autoRepeatTemplate.size() ); + for ( int i = 0; i < count; ++i ) { + for ( const auto& t : list.autoRepeatTemplate ) { + expanded.push_back( t ); + } + } + + if ( list.autoRepeatPosition <= list.tracks.size() ) + list.tracks.insert( list.tracks.begin() + list.autoRepeatPosition, + std::make_move_iterator( expanded.begin() ), + std::make_move_iterator( expanded.end() ) ); + else + list.tracks.insert( list.tracks.end(), std::make_move_iterator( expanded.begin() ), + std::make_move_iterator( expanded.end() ) ); + + list.hasAutoRepeat = false; + list.autoRepeatIsFit = false; + list.autoRepeatPosition = 0; + list.autoRepeatTemplate.clear(); +} + +// ── GridLayouter ── + +void GridLayouter::readContainerStyle() { + UIHTMLWidget* grid = + mContainer->isType( UI_TYPE_HTML_WIDGET ) ? mContainer->asType() : nullptr; + if ( !grid ) + return; + + mColumnGap = mContainer->lengthFromValue( + grid->getColumnGap(), CSS::PropertyRelativeTarget::ContainingBlockWidth, 0.f ); + mRowGap = mContainer->lengthFromValue( + grid->getRowGap(), CSS::PropertyRelativeTarget::ContainingBlockHeight, 0.f ); + mTemplateAreas = GridAreasParser::parseAreas( grid->getGridTemplateAreas() ); + mAutoFlow = grid->getGridAutoFlow(); + mAutoFlowDense = grid->getGridAutoFlowDense(); + + mAutoColumnSize = parseAutoTrackSize( grid->getGridAutoColumns() ); + mAutoRowSize = parseAutoTrackSize( grid->getGridAutoRows() ); + + // Parse and expand column tracks (including auto-repeat) + GridTrackList colList = GridTrackParser::parseTrackList( grid->getGridTemplateColumns() ); + mColAutoRepeatIsFit = colList.autoRepeatIsFit; + // Record explicit count before auto-repeat expansion + mExplicitColCount = colList.tracks.size(); + { + Float contentW = mContainer->getPixelsSize().getWidth() - + mContainer->getPixelsContentOffset().Left - + mContainer->getPixelsContentOffset().Right; + if ( contentW > 0.f ) + GridTrackParser::expandAutoRepeat( colList, contentW, mColumnGap ); + } + mColumns.clear(); + mColLineNames.clear(); + if ( colList.valid && !colList.none ) { + for ( const auto& t : colList.tracks ) { + GridTrack track; + track.definition = t.size; + if ( !t.beforeLineNames.empty() ) { + int lineIdx = static_cast( mColumns.size() ) + 1; + for ( const auto& name : t.beforeLineNames ) + mColLineNames[name].push_back( lineIdx ); + } + mColumns.push_back( track ); + } + } + + // Parse and expand row tracks + GridTrackList rowList = GridTrackParser::parseTrackList( grid->getGridTemplateRows() ); + mRowAutoRepeatIsFit = rowList.autoRepeatIsFit; + mExplicitRowCount = rowList.tracks.size(); + { + Float contentH = mContainer->getPixelsSize().getHeight() - + mContainer->getPixelsContentOffset().Top - + mContainer->getPixelsContentOffset().Bottom; + if ( contentH > 0.f ) + GridTrackParser::expandAutoRepeat( rowList, contentH, mRowGap ); + } + mRows.clear(); + mRowLineNames.clear(); + if ( rowList.valid && !rowList.none ) { + for ( const auto& t : rowList.tracks ) { + GridTrack track; + track.definition = t.size; + if ( !t.beforeLineNames.empty() ) { + int lineIdx = static_cast( mRows.size() ) + 1; + for ( const auto& name : t.beforeLineNames ) + mRowLineNames[name].push_back( lineIdx ); + } + mRows.push_back( track ); + } + } + mExplicitRowCount = mRows.size(); +} + +void GridLayouter::collapseEmptyAutoFitTracks() { + int minCols = static_cast( mExplicitColCount ); + int minRows = static_cast( mExplicitRowCount ); + + if ( mColAutoRepeatIsFit && !mItems.empty() ) { + int maxUsedCol = 0; + for ( const auto& item : mItems ) { + int end = item.resolvedColumnEnd; + if ( end > maxUsedCol ) + maxUsedCol = end; + } + int target = std::max( maxUsedCol - 1, minCols ); + while ( static_cast( mColumns.size() ) > target && (int)mColumns.size() > 0 ) + mColumns.pop_back(); + } + + if ( mRowAutoRepeatIsFit && !mItems.empty() ) { + int maxUsedRow = 0; + for ( const auto& item : mItems ) { + int end = item.resolvedRowEnd; + if ( end > maxUsedRow ) + maxUsedRow = end; + } + int target = std::max( maxUsedRow - 1, minRows ); + while ( static_cast( mRows.size() ) > target && (int)mRows.size() > 0 ) + mRows.pop_back(); + } +} + +void GridLayouter::buildImplicitTracks() { + while ( static_cast( mColumns.size() ) < mMaxColumn - 1 ) { + GridTrack track; + track.definition = mAutoColumnSize; + mColumns.push_back( track ); + } + while ( static_cast( mRows.size() ) < mMaxRow - 1 ) { + GridTrack track; + track.definition = mAutoRowSize; + mRows.push_back( track ); + } +} + +void GridLayouter::sizeTracksForAxis( bool isColumns ) { + auto& tracks = isColumns ? mColumns : mRows; + Float containerSize = isColumns ? mContainer->getPixelsSize().getWidth() + : mContainer->getPixelsSize().getHeight(); + Float contentOffset = isColumns ? mContainer->getPixelsContentOffset().Left + : mContainer->getPixelsContentOffset().Top; + Float contentEnd = isColumns ? mContainer->getPixelsContentOffset().Right + : mContainer->getPixelsContentOffset().Bottom; + Float contentBoxSize = containerSize - contentOffset - contentEnd; + if ( contentBoxSize < 0.f ) + contentBoxSize = 0.f; + bool hasDefiniteSize = mContainer->getLayoutWidthPolicy() != SizePolicy::WrapContent; + if ( !isColumns ) + hasDefiniteSize = mContainer->getLayoutHeightPolicy() != SizePolicy::WrapContent; + CSS::PropertyRelativeTarget relativeTarget = + isColumns ? CSS::PropertyRelativeTarget::ContainingBlockWidth + : CSS::PropertyRelativeTarget::ContainingBlockHeight; + auto resolveLength = [&]( const GridTrackBreadth& breadth ) { + // GridTrackParser keeps the raw CSS token so sizing can resolve units with the container + // context. Do not use breadth.value directly for Length tracks: tokens such as "6.5rem" + // parse to numeric 6.5 but must become CSS pixels before track sizing and item wrapping. + return mContainer->lengthFromValue( breadth.raw, relativeTarget, breadth.value ); + }; + + // Initialize base sizes + for ( auto& track : tracks ) { + switch ( track.definition.min.type ) { + case GridTrackBreadthType::Length: + track.baseSize = resolveLength( track.definition.min ); + break; + case GridTrackBreadthType::Percentage: + if ( hasDefiniteSize ) + track.baseSize = track.definition.min.value * contentBoxSize / 100.f; + else + track.baseSize = 0.f; + break; + default: + track.baseSize = 0.f; + break; + } + if ( track.definition.max.type == GridTrackBreadthType::Length ) + track.growthLimit = resolveLength( track.definition.max ); + else if ( track.definition.max.type == GridTrackBreadthType::Percentage && hasDefiniteSize ) + track.growthLimit = track.definition.max.value * contentBoxSize / 100.f; + else if ( track.definition.max.type == GridTrackBreadthType::FitContent ) + track.growthLimit = resolveLength( track.definition.max ); + else + track.growthLimit = std::numeric_limits::infinity(); + } + + // Non-spanning item contributions + for ( const auto& item : mItems ) { + if ( item.isTextNode ) + continue; + int start = isColumns ? item.resolvedColumnStart : item.resolvedRowStart; + int end = isColumns ? item.resolvedColumnEnd : item.resolvedRowEnd; + int span = end - start; + + if ( start <= 0 || start - 1 >= static_cast( tracks.size() ) ) + continue; + + auto& track = tracks[start - 1]; + + // Only update auto/min-content/max-content tracks (non-spanning) + if ( span == 1 && ( track.definition.min.type == GridTrackBreadthType::Auto || + track.definition.min.type == GridTrackBreadthType::MinContent || + track.definition.min.type == GridTrackBreadthType::MaxContent ) ) { + Float itemSize = isColumns ? item.widget->getPixelsSize().getWidth() + : item.widget->getPixelsSize().getHeight(); + if ( itemSize > track.baseSize ) + track.baseSize = itemSize; + } + } + + // Phase 9: spanning items — distribute extra item size across spanned tracks + for ( const auto& item : mItems ) { + if ( item.isTextNode ) + continue; + int start = isColumns ? item.resolvedColumnStart : item.resolvedRowStart; + int end = isColumns ? item.resolvedColumnEnd : item.resolvedRowEnd; + int span = end - start; + if ( span <= 1 ) + continue; + if ( start <= 0 || start - 1 >= static_cast( tracks.size() ) ) + continue; + + Float itemSize = isColumns ? item.widget->getPixelsSize().getWidth() + : item.widget->getPixelsSize().getHeight(); + Float spannedSize = 0.f; + int spanStart = start - 1; + int spanEnd = std::min( end - 1, static_cast( tracks.size() ) ); + bool allSpannedTracksAreFlexible = true; + for ( int i = spanStart; i < spanEnd; ++i ) + allSpannedTracksAreFlexible = + allSpannedTracksAreFlexible && isFlexibleTrack( tracks[i] ); + if ( allSpannedTracksAreFlexible ) + continue; + for ( int i = spanStart; i < spanEnd; ++i ) + spannedSize += tracks[i].baseSize; + spannedSize += static_cast( span - 1 ) * ( isColumns ? mColumnGap : mRowGap ); + + if ( itemSize > spannedSize ) { + Float extra = itemSize - spannedSize; + bool anyGrew = true; + while ( extra > 0.001f && anyGrew ) { + anyGrew = false; + Float perTrack = extra / static_cast( spanEnd - spanStart ); + for ( int i = spanStart; i < spanEnd && extra > 0.001f; ++i ) { + if ( tracks[i].baseSize >= tracks[i].growthLimit ) + continue; + Float add = std::min( perTrack, tracks[i].growthLimit - tracks[i].baseSize ); + tracks[i].baseSize += add; + extra -= add; + anyGrew = true; + } + } + if ( extra > 0.f ) { + for ( int i = spanStart; i < spanEnd; ++i ) { + if ( tracks[i].baseSize < tracks[i].growthLimit ) { + tracks[i].baseSize += extra; + break; + } + } + } + } + } + + // Phase 8: flexible (fr) tracks + Float remainingSpace = contentBoxSize; + Float totalFlex = 0.f; + for ( auto& track : tracks ) + remainingSpace -= track.baseSize; + + if ( tracks.size() > 1 ) { + Float axisGap = isColumns ? mColumnGap : mRowGap; + remainingSpace -= static_cast( tracks.size() - 1 ) * axisGap; + } + if ( remainingSpace < 0 ) + remainingSpace = 0; + + for ( auto& track : tracks ) { + if ( track.definition.min.type == GridTrackBreadthType::Flex ) { + totalFlex += track.definition.min.value; + } else if ( track.definition.max.type == GridTrackBreadthType::Flex ) { + totalFlex += track.definition.max.value; + } + } + + if ( totalFlex > 0.f && remainingSpace > 0.f ) { + for ( auto& track : tracks ) { + Float flex = 0.f; + if ( track.definition.min.type == GridTrackBreadthType::Flex ) + flex = track.definition.min.value; + else if ( track.definition.max.type == GridTrackBreadthType::Flex ) + flex = track.definition.max.value; + + if ( flex > 0.f ) { + Float extra = remainingSpace * ( flex / totalFlex ); + Float wanted = track.baseSize + extra; + if ( wanted > track.growthLimit ) + wanted = track.growthLimit; + Float actualExtra = wanted - track.baseSize; + track.baseSize = wanted; + remainingSpace -= actualExtra; + totalFlex -= flex; + } + } + } +} + +void GridLayouter::preSizeItemsForRowSizing() { + // Compute column line positions WITHOUT gaps (gaps added only as offset) + std::vector colLines; + colLines.push_back( 0.f ); + for ( const auto& col : mColumns ) + colLines.push_back( colLines.back() + col.baseSize ); + + for ( auto& item : mItems ) { + if ( item.isTextNode ) + continue; + + int cs = item.resolvedColumnStart - 1; + int ce = item.resolvedColumnEnd - 1; + if ( cs < 0 ) + cs = 0; + if ( ce >= static_cast( colLines.size() ) ) + ce = static_cast( colLines.size() ) - 1; + + Float cellW = colLines[ce] - colLines[cs]; + if ( ce > cs + 1 ) + cellW += static_cast( ce - cs - 1 ) * mColumnGap; + + auto oldWidthPolicy = item.widget->getLayoutWidthPolicy(); + item.widget->setLayoutWidthPolicy( SizePolicy::Fixed ); + item.widget->setPixelsSize( cellW, item.widget->getPixelsSize().getHeight() ); + + if ( item.widget->isType( UI_TYPE_HTML_WIDGET ) ) { + auto* childHtml = item.widget->asType(); + auto* layouter = childHtml->getLayouter(); + if ( layouter && !layouter->isPacking() ) { + auto oldHP = childHtml->getLayoutHeightPolicy(); + childHtml->setLayoutHeightPolicy( SizePolicy::WrapContent ); + childHtml->updateLayout(); + childHtml->setLayoutHeightPolicy( oldHP ); + } + } + item.widget->setLayoutWidthPolicy( oldWidthPolicy ); + } +} + +void GridLayouter::applyLayout() { + // Compute line positions WITHOUT gaps (gaps are added as per-cell offset) + std::vector colLines; + colLines.push_back( 0.f ); + for ( const auto& col : mColumns ) + colLines.push_back( colLines.back() + col.baseSize ); + Float totalWidth = colLines.back() + + static_cast( std::max( 0, (int)mColumns.size() - 1 ) ) * mColumnGap; + + std::vector rowLines; + rowLines.push_back( 0.f ); + for ( const auto& row : mRows ) + rowLines.push_back( rowLines.back() + row.baseSize ); + Float totalHeight = + rowLines.back() + static_cast( std::max( 0, (int)mRows.size() - 1 ) ) * mRowGap; + + Float padLeft = mContainer->getPixelsContentOffset().Left; + Float padTop = mContainer->getPixelsContentOffset().Top; + Float padRight = mContainer->getPixelsContentOffset().Right; + Float padBottom = mContainer->getPixelsContentOffset().Bottom; + + // Phase 10: grid alignment (justify-content, align-content) + UIHTMLWidget* gridWidget = + mContainer->isType( UI_TYPE_HTML_WIDGET ) ? mContainer->asType() : nullptr; + Float colGapX = mColumnGap; + Float rowGapY = mRowGap; + Float colStartX = padLeft; + Float rowStartY = padTop; + bool wrapW = mContainer->getLayoutWidthPolicy() == SizePolicy::WrapContent; + bool wrapH = mContainer->getLayoutHeightPolicy() == SizePolicy::WrapContent; + + if ( gridWidget ) { + Float containerW = mContainer->getPixelsSize().getWidth() - padLeft - padRight; + Float containerH = mContainer->getPixelsSize().getHeight() - padTop - padBottom; + + if ( containerW > totalWidth && !wrapW ) { + Float extra = containerW - totalWidth; + CSSJustifyContent jc = gridWidget->getJustifyContent(); + if ( jc == CSSJustifyContent::Center ) + colStartX += extra * 0.5f; + else if ( jc == CSSJustifyContent::FlexEnd ) + colStartX += extra; + else if ( jc == CSSJustifyContent::SpaceBetween && mColumns.size() > 1 ) { + Float gapExtra = extra / static_cast( mColumns.size() - 1 ); + colGapX += gapExtra; + } else if ( jc == CSSJustifyContent::SpaceAround && mColumns.size() > 0 ) { + Float gapExtra = extra / static_cast( mColumns.size() ); + colStartX += gapExtra * 0.5f; + colGapX += gapExtra; + } else if ( jc == CSSJustifyContent::SpaceEvenly && mColumns.size() > 0 ) { + Float gapExtra = extra / static_cast( mColumns.size() + 1 ); + colStartX += gapExtra; + colGapX += gapExtra; + } + } + + if ( containerH > totalHeight && !wrapH ) { + Float extra = containerH - totalHeight; + CSSAlignContent ac = gridWidget->getAlignContent(); + if ( ac == CSSAlignContent::Center ) + rowStartY += extra * 0.5f; + else if ( ac == CSSAlignContent::FlexEnd ) + rowStartY += extra; + else if ( ac == CSSAlignContent::SpaceBetween && mRows.size() > 1 ) { + Float gapExtra = extra / static_cast( mRows.size() - 1 ); + rowGapY += gapExtra; + } else if ( ac == CSSAlignContent::SpaceAround && mRows.size() > 0 ) { + Float gapExtra = extra / static_cast( mRows.size() ); + rowStartY += gapExtra * 0.5f; + rowGapY += gapExtra; + } else if ( ac == CSSAlignContent::SpaceEvenly && mRows.size() > 0 ) { + Float gapExtra = extra / static_cast( mRows.size() + 1 ); + rowStartY += gapExtra; + rowGapY += gapExtra; + } + } + } + + // Set container size if wrapping (use internal setters to avoid re-layout cycle) + if ( mContainer->getLayoutWidthPolicy() == SizePolicy::WrapContent ) + mContainer->setInternalPixelsWidth( totalWidth + padLeft + padRight ); + if ( mContainer->getLayoutHeightPolicy() == SizePolicy::WrapContent ) + mContainer->setInternalPixelsHeight( totalHeight + padTop + padBottom ); + + // Phase 10: Read justify-items from container for resolving auto + CSSJustifyItems containerJItems = CSSJustifyItems::Normal; + if ( gridWidget ) + containerJItems = gridWidget->getJustifyItems(); + + // Position items with alignment + for ( auto& item : mItems ) { + if ( item.isTextNode ) + continue; + + int cs = item.resolvedColumnStart - 1; + int ce = item.resolvedColumnEnd - 1; + int rs = item.resolvedRowStart - 1; + int re = item.resolvedRowEnd - 1; + + if ( cs < 0 ) + cs = 0; + if ( ce >= static_cast( colLines.size() ) ) + ce = static_cast( colLines.size() ) - 1; + if ( rs < 0 ) + rs = 0; + if ( re >= static_cast( rowLines.size() ) ) + re = static_cast( rowLines.size() ) - 1; + + Float cellX = colLines[cs] + colStartX + cs * colGapX; + Float cellY = rowLines[rs] + rowStartY + rs * rowGapY; + Float cellW = colLines[ce] - colLines[cs]; + Float cellH = rowLines[re] - rowLines[rs]; + // Add internal gaps for multi-span items + if ( ce > cs + 1 ) + cellW += static_cast( ce - cs - 1 ) * colGapX; + if ( re > rs + 1 ) + cellH += static_cast( re - rs - 1 ) * rowGapY; + + // Determine effective alignment + CSSJustifySelf js = item.justifySelf; + if ( js == CSSJustifySelf::Auto ) { + js = ( containerJItems == CSSJustifyItems::Normal || + containerJItems == CSSJustifyItems::Stretch ) + ? CSSJustifySelf::Stretch + : static_cast( containerJItems ); + } + CSSAlignSelf as = item.alignSelf; + if ( as == CSSAlignSelf::Auto ) + as = CSSAlignSelf::Stretch; + + // Apply alignment + Float finalX = cellX, finalY = cellY, finalW = cellW, finalH = cellH; + if ( js == CSSJustifySelf::Stretch ) { + finalW = cellW; + finalX = cellX; + } else if ( js == CSSJustifySelf::Center ) { + Float iw = item.widget->getPixelsSize().getWidth(); + finalW = iw; + finalX = cellX + ( cellW - iw ) * 0.5f; + } else if ( js == CSSJustifySelf::End || js == CSSJustifySelf::FlexEnd ) { + Float iw = item.widget->getPixelsSize().getWidth(); + finalW = iw; + finalX = cellX + cellW - iw; + } else { + finalW = item.widget->getPixelsSize().getWidth(); + } + + if ( as == CSSAlignSelf::Stretch ) { + finalH = cellH; + finalY = cellY; + } else if ( as == CSSAlignSelf::Center ) { + Float ih = item.widget->getPixelsSize().getHeight(); + finalH = ih; + finalY = cellY + ( cellH - ih ) * 0.5f; + } else if ( as == CSSAlignSelf::FlexEnd ) { + Float ih = item.widget->getPixelsSize().getHeight(); + finalH = ih; + finalY = cellY + cellH - ih; + } else { + finalH = item.widget->getPixelsSize().getHeight(); + } + + item.widget->setPixelsPosition( finalX, finalY ); + // Set both width and height to Fixed so the card's own BlockLayouter + // won't override the grid-placed cell dimensions via + // setMatchParentIfNeededVerticalGrowth / WrapContent height computation. + item.widget->setLayoutWidthPolicy( SizePolicy::Fixed ); + item.widget->setLayoutHeightPolicy( SizePolicy::Fixed ); + item.widget->setPixelsSize( finalW, finalH ); + } +} + +void GridLayouter::updateLayout() { + if ( mPacking ) + return; + + mPacking = true; + struct PackingGuard { + bool& flag; + ~PackingGuard() { flag = false; } + } guard{ mPacking }; + mIntrinsicWidthsDirty = false; + + UIHTMLWidget* grid = + mContainer->isType( UI_TYPE_HTML_WIDGET ) ? mContainer->asType() : nullptr; + if ( grid && grid->getLayoutWidthPolicy() == SizePolicy::MatchParent ) { + Float matchWidth = grid->getMatchParentWidth(); + if ( matchWidth > 0.f && eeabs( matchWidth - grid->getPixelsSize().getWidth() ) > 0.01f ) + grid->setInternalPixelsWidth( matchWidth ); + } + readContainerStyle(); + collectGridItems(); + resolveDefinitePlacements(); + autoPlaceItems(); + buildImplicitTracks(); + collapseEmptyAutoFitTracks(); + + int needResize = true; + bool hPercentUnresolved = false; + bool wPercentUnresolved = false; + if ( grid && grid->getUIStyle() ) { + const StyleSheetProperty* hprop = grid->getUIStyle()->getProperty( PropertyId::Height ); + hPercentUnresolved = hprop && StyleSheetLength::isPercentage( hprop->value() ) && + grid->getPixelsSize().getHeight() <= 0.f; + const StyleSheetProperty* wprop = grid->getUIStyle()->getProperty( PropertyId::Width ); + wPercentUnresolved = wprop && StyleSheetLength::isPercentage( wprop->value() ) && + grid->getPixelsSize().getWidth() <= 0.f; + } + for ( int sizingPass = 0; sizingPass < 2 && needResize; ++sizingPass ) { + needResize = false; + sizeTracksForAxis( true ); + preSizeItemsForRowSizing(); + sizeTracksForAxis( false ); + applyLayout(); + + if ( hPercentUnresolved ) { + Float contentH = 0.f; + for ( const auto& row : mRows ) + contentH += row.baseSize; + if ( mRows.size() > 1 ) + contentH += static_cast( mRows.size() - 1 ) * mRowGap; + contentH += mContainer->getPixelsContentOffset().Top + + mContainer->getPixelsContentOffset().Bottom; + if ( contentH > 0.f ) { + mContainer->setInternalPixelsHeight( contentH ); + needResize = true; + } + } + + if ( wPercentUnresolved ) { + const StyleSheetProperty* wprop = grid->getUIStyle()->getProperty( PropertyId::Width ); + std::string v = wprop->value(); + v.pop_back(); + Float pct = 0.f; + String::fromString( pct, v ); + Float best = 0.f; + for ( Node* anc = grid->getParent(); anc; anc = anc->getParent() ) { + if ( anc->isWidget() ) { + Float sz = anc->asType()->getPixelsSize().getWidth(); + if ( sz > best ) + best = sz; + } + } + UISceneNode* root = grid->getUISceneNode(); + if ( root ) { + Float sz = root->getPixelsSize().getWidth(); + if ( sz > best ) + best = sz; + } + Float resolved = best * pct / 100.f; + if ( resolved > 0.f ) { + mContainer->setInternalPixelsWidth( resolved ); + needResize = true; + } + } + } + + // Phase 15: set paint-order sort flag + if ( grid ) { + bool needsSort = false; + for ( size_t i = 1; i < mItems.size(); ++i ) { + if ( mItems[i].order != mItems[0].order ) { + needsSort = true; + break; + } + } + grid->setNeedsOrderSort( needsSort ); + } + + // Phase 11: compute container baseline from first in-flow item + mContainerBaseline = 0.f; + for ( const auto& item : mItems ) { + if ( !item.isTextNode && !item.isOutOfFlow ) { + Float b = item.widget->getPixelsPosition().y + item.widget->getPixelsSize().getHeight(); + if ( item.widget->isType( UI_TYPE_HTML_WIDGET ) ) { + b = item.widget->getPixelsPosition().y + + item.widget->asType()->getBaseline(); + } + mContainerBaseline = b; + break; + } + } +} + +void GridLayouter::collectGridItems() { + mItems.clear(); + + for ( Node* child = mContainer->getFirstChild(); child; child = child->getNextNode() ) { + // Skip non-widget non-text nodes + if ( !child->isWidget() && !child->isTextNode() ) + continue; + + // Text node handling + if ( child->isTextNode() ) { + UITextNode* textNode = child->asType(); + if ( textNode->isWhitespaceOnly() ) + continue; + GridItem item; + item.widget = textNode; + item.isTextNode = true; + mItems.push_back( item ); + continue; + } + + // Widget handling + UIWidget* widget = child->asType(); + + // Skip display: none + if ( widget->isType( UI_TYPE_HTML_WIDGET ) ) { + UIHTMLWidget* htmlChild = widget->asType(); + if ( htmlChild->getDisplay() == CSSDisplay::None ) + continue; + if ( htmlChild->isOutOfFlow() ) + continue; + } else { + // Regular widget: skip if not visible + if ( !widget->isVisible() ) + continue; + } + + GridItem item; + item.widget = widget; + + if ( widget->isType( UI_TYPE_HTML_WIDGET ) ) { + UIHTMLWidget* htmlChild = widget->asType(); + item.order = htmlChild->getOrder(); + item.gridRowStart = htmlChild->getGridRowStart(); + item.gridRowEnd = htmlChild->getGridRowEnd(); + item.gridColumnStart = htmlChild->getGridColumnStart(); + item.gridColumnEnd = htmlChild->getGridColumnEnd(); + item.justifySelf = htmlChild->getJustifySelf(); + item.alignSelf = htmlChild->getAlignSelf(); + } + + mItems.push_back( item ); + } + + // Sort by order (stable sort preserves source order for equal orders) + if ( mItems.size() > 1 ) { + std::stable_sort( mItems.begin(), mItems.end(), []( const GridItem& a, const GridItem& b ) { + return a.order < b.order; + } ); + } +} + +// ── Grid line placement helpers ── + +static GridLineResult parseGridLine( const std::string& raw ) { + GridLineResult result; + std::string trimmed = String::trim( raw ); + String::toLowerInPlace( trimmed ); + + if ( trimmed.empty() || trimmed == "auto" ) + return result; + + int intVal = 0; + if ( String::fromString( intVal, trimmed ) ) { + result.isAuto = false; + result.lineNumber = intVal; + return result; + } + + if ( trimmed == "span" ) { + result.isAuto = false; + result.isSpan = true; + return result; + } + + if ( String::startsWith( trimmed, "span " ) ) { + result.isAuto = false; + result.isSpan = true; + std::string rest = String::trim( trimmed.substr( 5 ) ); + if ( !rest.empty() && String::fromString( intVal, rest ) ) { + result.spanCount = intVal; + } + return result; + } + + // + size_t sp = trimmed.find( ' ' ); + if ( sp != std::string::npos ) { + std::string first = trimmed.substr( 0, sp ); + std::string second = String::trim( trimmed.substr( sp + 1 ) ); + if ( String::fromString( intVal, first ) ) { + result.isAuto = false; + result.lineNumber = intVal; + if ( !second.empty() ) + result.nameId = second; + return result; + } + } + + // alone — store as named line reference + result.isAuto = false; + result.nameId = trimmed; + return result; +} + +GridLineResult GridLineParser::parse( const std::string& value ) { + return parseGridLine( value ); +} + +static void resolveAxisPlacement( const GridLineResult& start, const GridLineResult& end, + int explicitCount, int& outStart, int& outEnd ) { + if ( start.isAuto && end.isAuto ) + return; + + auto normalize = [explicitCount]( int val ) -> int { + if ( val < 0 ) { + int res = explicitCount + 2 + val; + return res < 1 ? 1 : res; + } + return val; + }; + + if ( start.isSpan && end.isSpan ) { + // Both are span — only the end span is honored (start treated as auto) + outStart = 0; + outEnd = end.spanCount; + return; + } + + // start auto, end span N: keep start as auto, store span count as end + if ( start.isAuto && end.isSpan ) { + outStart = 0; + outEnd = end.spanCount; + return; + } + + // start span N, end auto: keep end as auto, store span count as start + if ( start.isSpan && end.isAuto ) { + outStart = start.spanCount; + outEnd = 0; + return; + } + + // Both definite (not auto, not span) + if ( !start.isAuto && !end.isAuto && !start.isSpan && !end.isSpan ) { + int s = normalize( start.lineNumber ); + int e = normalize( end.lineNumber ); + if ( s == e ) + ++e; + if ( s > e ) + std::swap( s, e ); + outStart = s; + outEnd = e; + return; + } + + // Start definite, end auto → span 1 track + if ( !start.isAuto && !start.isSpan && end.isAuto ) { + outStart = normalize( start.lineNumber ); + outEnd = outStart + 1; + return; + } + + // Start auto, end definite → span backwards + if ( start.isAuto && !end.isAuto && !end.isSpan ) { + outEnd = normalize( end.lineNumber ); + outStart = outEnd - 1; + if ( outStart < 1 ) + outStart = 1; + return; + } + + // Start definite, end span N + if ( !start.isAuto && !start.isSpan && end.isSpan ) { + outStart = normalize( start.lineNumber ); + outEnd = outStart + end.spanCount; + return; + } + + // Start span N, end definite + if ( start.isSpan && !end.isAuto && !end.isSpan ) { + outEnd = normalize( end.lineNumber ); + outStart = outEnd - start.spanCount; + return; + } +} + +void GridLayouter::resolveDefinitePlacements() { + int explicitCols = + std::max( static_cast( mExplicitColCount ), static_cast( mColumns.size() ) ); + int explicitRows = + std::max( static_cast( mExplicitRowCount ), static_cast( mRows.size() ) ); + + mMaxColumn = explicitCols; + mMaxRow = explicitRows; + + auto resolveNamedLine = []( const UnorderedMap>& lineNames, + const std::string& nameId, int lineNumber, + int explicitCount ) -> int { + auto it = lineNames.find( nameId ); + if ( it == lineNames.end() || it->second.empty() ) + return 0; // unresolved + + const auto& indices = it->second; + if ( lineNumber == 0 ) { + // Just the name — return first matching line + return indices[0]; + } + + // — find the Nth line of this name + if ( lineNumber > 0 ) { + if ( lineNumber <= static_cast( indices.size() ) ) + return indices[lineNumber - 1]; + } else { + // Negative: count from end + int idx = explicitCount + 2 + lineNumber; // line 0 = explicitCount+2 + // Clamp to valid range + if ( idx < 1 ) + idx = 1; + return idx; + } + return 0; + }; + + for ( auto& item : mItems ) { + GridLineResult startCol = parseGridLine( item.gridColumnStart ); + GridLineResult endCol = parseGridLine( item.gridColumnEnd ); + GridLineResult startRow = parseGridLine( item.gridRowStart ); + GridLineResult endRow = parseGridLine( item.gridRowEnd ); + + // Resolve named lines to line numbers + if ( !startCol.nameId.empty() ) + startCol.lineNumber = resolveNamedLine( mColLineNames, startCol.nameId, + startCol.lineNumber, explicitCols ); + if ( !endCol.nameId.empty() ) + endCol.lineNumber = + resolveNamedLine( mColLineNames, endCol.nameId, endCol.lineNumber, explicitCols ); + if ( !startRow.nameId.empty() ) + startRow.lineNumber = resolveNamedLine( mRowLineNames, startRow.nameId, + startRow.lineNumber, explicitRows ); + if ( !endRow.nameId.empty() ) + endRow.lineNumber = + resolveNamedLine( mRowLineNames, endRow.nameId, endRow.lineNumber, explicitRows ); + + resolveAxisPlacement( startCol, endCol, explicitCols, item.resolvedColumnStart, + item.resolvedColumnEnd ); + resolveAxisPlacement( startRow, endRow, explicitRows, item.resolvedRowStart, + item.resolvedRowEnd ); + + // Normalize span fields: resolvedEnd can be overloaded as a span count + // when the start is auto. Extract into explicit rowSpan/columnSpan. + auto normalizeSpan = []( int& resolvedStart, int& resolvedEnd, int& outSpan ) { + if ( resolvedStart > 0 && resolvedEnd > 0 ) { + outSpan = resolvedEnd - resolvedStart; + } else if ( resolvedStart > 0 && resolvedEnd == 0 ) { + outSpan = resolvedStart; + resolvedStart = 0; + } else if ( resolvedStart == 0 && resolvedEnd > 0 ) { + outSpan = resolvedEnd; + resolvedEnd = 0; + } + // else both 0: outSpan stays default 1 + }; + normalizeSpan( item.resolvedColumnStart, item.resolvedColumnEnd, item.columnSpan ); + normalizeSpan( item.resolvedRowStart, item.resolvedRowEnd, item.rowSpan ); + + if ( item.resolvedColumnEnd > mMaxColumn ) + mMaxColumn = item.resolvedColumnEnd; + if ( item.resolvedRowEnd > mMaxRow ) + mMaxRow = item.resolvedRowEnd; + // Auto axes with span: need at least span columns/rows for implicit tracks + if ( item.resolvedColumnStart == 0 && item.columnSpan > mMaxColumn ) + mMaxColumn = item.columnSpan; + if ( item.resolvedRowStart == 0 && item.rowSpan > mMaxRow ) + mMaxRow = item.rowSpan; + } +} + +void GridLayouter::autoPlaceItems() { + int maxColumns = mMaxColumn; + int maxRows = mMaxRow; + + std::set> occupied; + for ( const auto& item : mItems ) { + if ( item.resolvedColumnStart > 0 && item.resolvedRowStart > 0 ) { + for ( int r = item.resolvedRowStart; r < item.resolvedRowEnd; ++r ) + for ( int c = item.resolvedColumnStart; c < item.resolvedColumnEnd; ++c ) + occupied.insert( { r, c } ); + } + } + + int cursorCol = 1; + int cursorRow = 1; + bool isRowFlow = mAutoFlow == CSSGridAutoFlow::Row; + + auto occupyRange = [&]( int r, int c, int w, int h ) { + for ( int dr = 0; dr < h; ++dr ) + for ( int dc = 0; dc < w; ++dc ) + occupied.insert( { r + dr, c + dc } ); + }; + + auto fits = [&]( int r, int c, int w, int h ) { + for ( int dr = 0; dr < h; ++dr ) + for ( int dc = 0; dc < w; ++dc ) + if ( occupied.find( { r + dr, c + dc } ) != occupied.end() ) + return false; + return true; + }; + + for ( auto& item : mItems ) { + bool colAuto = item.resolvedColumnStart == 0; + bool rowAuto = item.resolvedRowStart == 0; + + if ( !colAuto && !rowAuto ) + continue; + + int sw = item.columnSpan; + int sh = item.rowSpan; + + if ( !colAuto && rowAuto ) { + int c = item.resolvedColumnStart; + for ( int r = mAutoFlowDense ? 1 : cursorRow;; ++r ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedRowStart = r; + item.resolvedRowEnd = r + sh; + occupyRange( r, c, sw, sh ); + cursorRow = r; + break; + } + } + } else if ( !rowAuto && colAuto ) { + int r = item.resolvedRowStart; + for ( int c = mAutoFlowDense ? 1 : cursorCol;; ++c ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedColumnStart = c; + item.resolvedColumnEnd = c + sw; + occupyRange( r, c, sw, sh ); + cursorCol = c; + break; + } + } + } else { + // Both auto — row-flow default + if ( isRowFlow ) { + bool placed = false; + if ( mAutoFlowDense ) { + // Dense: search from the beginning for first empty cell + for ( int r = 1;; ++r ) { + for ( int c = 1; c <= std::max( maxColumns, 1 ); ++c ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedRowStart = r; + item.resolvedRowEnd = r + sh; + item.resolvedColumnStart = c; + item.resolvedColumnEnd = c + sw; + occupyRange( r, c, sw, sh ); + cursorRow = r; + cursorCol = c; + placed = true; + break; + } + } + if ( placed ) + break; + } + } else { + for ( int r = cursorRow;; ++r ) { + int startC = ( r == cursorRow ) ? cursorCol : 1; + for ( int c = startC; c <= std::max( maxColumns, 1 ); ++c ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedRowStart = r; + item.resolvedRowEnd = r + sh; + item.resolvedColumnStart = c; + item.resolvedColumnEnd = c + sw; + occupyRange( r, c, sw, sh ); + cursorRow = r; + cursorCol = c; + placed = true; + break; + } + } + if ( placed ) + break; + } + } + } else { + // Column flow + bool placed = false; + if ( mAutoFlowDense ) { + for ( int c = 1;; ++c ) { + for ( int r = 1; r <= std::max( maxRows, 1 ); ++r ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedRowStart = r; + item.resolvedRowEnd = r + sh; + item.resolvedColumnStart = c; + item.resolvedColumnEnd = c + sw; + occupyRange( r, c, sw, sh ); + cursorRow = r; + cursorCol = c; + placed = true; + break; + } + } + if ( placed ) + break; + } + } else { + for ( int c = cursorCol;; ++c ) { + int startR = ( c == cursorCol ) ? cursorRow : 1; + int rowLimit = std::max( maxRows, 1 ); + for ( int r = startR; r <= rowLimit; ++r ) { + if ( fits( r, c, sw, sh ) ) { + item.resolvedRowStart = r; + item.resolvedRowEnd = r + sh; + item.resolvedColumnStart = c; + item.resolvedColumnEnd = c + sw; + occupyRange( r, c, sw, sh ); + cursorRow = r; + cursorCol = c; + placed = true; + break; + } + } + if ( placed ) + break; + } + } + } + } + + // Only update member fields — the local snapshot must NOT grow + // during auto-placement, otherwise later items overflow into + // implicit columns instead of wrapping to the next row. + if ( item.resolvedColumnEnd > mMaxColumn ) + mMaxColumn = item.resolvedColumnEnd; + if ( item.resolvedRowEnd > mMaxRow ) + mMaxRow = item.resolvedRowEnd; + } +} + +void GridLayouter::computeIntrinsicWidths() { + mIntrinsicWidthsDirty = false; + mMinIntrinsicWidth = 0.f; + mMaxIntrinsicWidth = 0.f; + + UIHTMLWidget* grid = + mContainer->isType( UI_TYPE_HTML_WIDGET ) ? mContainer->asType() : nullptr; + if ( !grid ) + return; + + Float gap = mContainer->lengthFromValue( + grid->getColumnGap(), CSS::PropertyRelativeTarget::ContainingBlockWidth, 0.f ); + + GridTrackList colList = GridTrackParser::parseTrackList( grid->getGridTemplateColumns() ); + if ( !colList.valid || colList.none ) + return; + + // Expand auto-repeat tracks (use a large available size as heuristic) + if ( colList.hasAutoRepeat && !colList.autoRepeatTemplate.empty() ) { + Float intrinsicExpandSize = 10000.f; // large enough to get a meaningful count + GridTrackParser::expandAutoRepeat( colList, intrinsicExpandSize, gap ); + } + + Float minW = 0.f; + Float maxW = 0.f; + for ( size_t i = 0; i < colList.tracks.size(); ++i ) { + const auto& size = colList.tracks[i].size; + Float trackMin = 0.f; + Float trackMax = 0.f; + + switch ( size.min.type ) { + case GridTrackBreadthType::Length: + trackMin = size.min.value; + break; + case GridTrackBreadthType::Percentage: + trackMin = 0.f; + break; + case GridTrackBreadthType::Flex: + trackMin = 0.f; + break; + default: + trackMin = 0.f; + break; + } + + switch ( size.max.type ) { + case GridTrackBreadthType::Length: + trackMax = size.max.value; + break; + case GridTrackBreadthType::Flex: + trackMax = 0.f; + break; + default: + trackMax = trackMin; + break; + } + + if ( trackMax < trackMin ) + trackMax = trackMin; + + minW += trackMin; + maxW += trackMax; + + if ( i + 1 < colList.tracks.size() ) { + minW += gap; + maxW += gap; + } + } + + mMinIntrinsicWidth = minW; + mMaxIntrinsicWidth = maxW; +} + +Float GridLayouter::getMinIntrinsicWidth() { + if ( mIntrinsicWidthsDirty ) + computeIntrinsicWidths(); + return mMinIntrinsicWidth; +} + +Float GridLayouter::getMaxIntrinsicWidth() { + if ( mIntrinsicWidthsDirty ) + computeIntrinsicWidths(); + return mMaxIntrinsicWidth; +} + +// ── GridAreasParser implementation ── + +GridAreaTemplate GridAreasParser::parseAreas( const std::string& value ) { + GridAreaTemplate result; + std::string trimmed = String::trim( value ); + String::toLowerInPlace( trimmed ); + + if ( trimmed == "none" ) { + result.none = true; + return result; + } + + // Extract quoted strings as rows; fallback to newline splitting. + std::vector rows; + if ( trimmed.find( '"' ) != std::string::npos ) { + size_t pos = 0; + while ( pos < trimmed.size() ) { + size_t open = trimmed.find( '"', pos ); + if ( open == std::string::npos ) + break; + size_t close = trimmed.find( '"', open + 1 ); + if ( close == std::string::npos ) { + result.valid = false; + return result; + } + rows.push_back( trimmed.substr( open + 1, close - open - 1 ) ); + pos = close + 1; + } + } else { + rows = String::split( trimmed, '\n' ); + } + + if ( rows.empty() ) { + result.none = true; + return result; + } + + // Tokenize each row and validate equal widths. + std::vector> grid; + size_t expectedCols = 0; + for ( const auto& rowStr : rows ) { + std::string clean = String::trim( rowStr ); + if ( clean.empty() ) + continue; + std::vector tokens = String::split( clean, ' ' ); + for ( auto& t : tokens ) + t = String::trim( t ); + tokens.erase( std::remove_if( tokens.begin(), tokens.end(), + []( const std::string& s ) { return s.empty(); } ), + tokens.end() ); + if ( expectedCols == 0 ) + expectedCols = tokens.size(); + if ( tokens.size() != expectedCols ) { + result.valid = false; + return result; + } + grid.push_back( std::move( tokens ) ); + } + + if ( grid.empty() ) { + result.none = true; + return result; + } + + // Collect cells per area. + UnorderedMap>> cells; // row, col (0-based) + for ( size_t r = 0; r < grid.size(); ++r ) { + for ( size_t c = 0; c < grid[r].size(); ++c ) { + const std::string& tok = grid[r][c]; + if ( tok == "." ) + continue; + cells[tok].push_back( { static_cast( r ), static_cast( c ) } ); + } + } + + // Validate each area is a filled rectangle. + for ( const auto& kv : cells ) { + const auto& coords = kv.second; + int minR = coords[0].first, maxR = coords[0].first; + int minC = coords[0].second, maxC = coords[0].second; + for ( const auto& p : coords ) { + minR = std::min( minR, p.first ); + maxR = std::max( maxR, p.first ); + minC = std::min( minC, p.second ); + maxC = std::max( maxC, p.second ); + } + + int expectedCount = ( maxR - minR + 1 ) * ( maxC - minC + 1 ); + if ( static_cast( coords.size() ) != expectedCount ) { + result.valid = false; + return result; + } + + GridAreaTemplate::Area area; + area.startRow = minR + 1; // convert to 1-based lines + area.endRow = maxR + 2; // exclusive + area.startColumn = minC + 1; + area.endColumn = maxC + 2; + result.areas[kv.first] = area; + } + + return result; +} + +bool GridAreasParser::isValidAreas( const std::string& value ) { + GridAreaTemplate tmpl = parseAreas( value ); + return tmpl.valid; +} + +std::vector GridAreasParser::getLineNamesForRowLine( const GridAreaTemplate& tmpl, + int line ) { + std::vector names; + for ( const auto& kv : tmpl.areas ) { + if ( kv.second.startRow == line ) + names.push_back( kv.first + "-start" ); + if ( kv.second.endRow == line ) + names.push_back( kv.first + "-end" ); + } + return names; +} + +std::vector GridAreasParser::getLineNamesForColumnLine( const GridAreaTemplate& tmpl, + int line ) { + std::vector names; + for ( const auto& kv : tmpl.areas ) { + if ( kv.second.startColumn == line ) + names.push_back( kv.first + "-start" ); + if ( kv.second.endColumn == line ) + names.push_back( kv.first + "-end" ); + } + return names; +} + +}} // namespace EE::UI diff --git a/src/eepp/ui/uihtmlwidget.cpp b/src/eepp/ui/uihtmlwidget.cpp index bd7d7d57f..234bfc0cd 100644 --- a/src/eepp/ui/uihtmlwidget.cpp +++ b/src/eepp/ui/uihtmlwidget.cpp @@ -2,6 +2,7 @@ #include #include #include +#include #include #include #include @@ -78,6 +79,7 @@ UIHTMLWidget::~UIHTMLWidget() { mScrollTarget->removeEventListener( mScrollCb ); eeSAFE_DELETE( mLayouter ); eeSAFE_DELETE( mFlexState ); + eeSAFE_DELETE( mGridState ); } UILayouter* UIHTMLWidget::getLayouter() { @@ -114,11 +116,11 @@ void UIHTMLWidget::setDisplay( CSSDisplay display ) { mNodeFlags |= NODE_FLAG_OVER_FIND_ALLOWED; if ( mDisplay == CSSDisplay::InlineBlock || mDisplay == CSSDisplay::Inline || - mDisplay == CSSDisplay::InlineFlex ) { + mDisplay == CSSDisplay::InlineFlex || mDisplay == CSSDisplay::InlineGrid ) { if ( getLayoutWidthPolicy() == SizePolicy::MatchParent ) setLayoutWidthPolicy( SizePolicy::WrapContent ); } else if ( mDisplay == CSSDisplay::Block || mDisplay == CSSDisplay::ListItem || - mDisplay == CSSDisplay::Flex ) { + mDisplay == CSSDisplay::Flex || mDisplay == CSSDisplay::Grid ) { if ( getLayoutWidthPolicy() == SizePolicy::WrapContent && mPosition != CSSPosition::Absolute && mPosition != CSSPosition::Fixed ) setLayoutWidthPolicy( SizePolicy::MatchParent ); @@ -138,10 +140,20 @@ bool UIHTMLWidget::isFlex() const { return mDisplay == CSSDisplay::Flex || mDisplay == CSSDisplay::InlineFlex; } +bool UIHTMLWidget::isGrid() const { + return mDisplay == CSSDisplay::Grid || mDisplay == CSSDisplay::InlineGrid; +} + Float UIHTMLWidget::getBaseline() const { - if ( isFlex() && mLayouter ) { - auto* flex = reinterpret_cast( mLayouter ); - return flex->getBaseline(); + if ( mLayouter ) { + if ( isFlex() ) { + auto* flex = reinterpret_cast( mLayouter ); + return flex->getBaseline(); + } + if ( isGrid() ) { + auto* grid = reinterpret_cast( mLayouter ); + return grid->getBaseline(); + } } if ( mBaselineAlign.type == CSSBaselineAlignment::Length ) return mBaselineAlign.value; @@ -439,6 +451,118 @@ void UIHTMLWidget::setColumnGap( const std::string& val ) { } } +void UIHTMLWidget::setGridTemplateRows( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->templateRows != val ) { + gs->templateRows = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridTemplateColumns( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->templateColumns != val ) { + gs->templateColumns = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridTemplateAreas( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->templateAreas != val ) { + gs->templateAreas = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridAutoRows( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->autoRows != val ) { + gs->autoRows = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridAutoColumns( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->autoColumns != val ) { + gs->autoColumns = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridAutoFlow( CSSGridAutoFlow val ) { + auto* gs = ensureGridState(); + if ( gs->autoFlow != val ) { + gs->autoFlow = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridAutoFlowDense( bool val ) { + auto* gs = ensureGridState(); + if ( gs->autoFlowDense != val ) { + gs->autoFlowDense = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridRowStart( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->rowStart != val ) { + gs->rowStart = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridRowEnd( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->rowEnd != val ) { + gs->rowEnd = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridColumnStart( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->columnStart != val ) { + gs->columnStart = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridColumnEnd( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->columnEnd != val ) { + gs->columnEnd = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setGridArea( const std::string& val ) { + auto* gs = ensureGridState(); + if ( gs->area != val ) { + gs->area = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setJustifyItems( CSSJustifyItems val ) { + auto* gs = ensureGridState(); + if ( gs->justifyItems != val ) { + gs->justifyItems = val; + notifyLayoutAttrChange(); + } +} + +void UIHTMLWidget::setJustifySelf( CSSJustifySelf val ) { + auto* gs = ensureGridState(); + if ( gs->justifySelf != val ) { + gs->justifySelf = val; + notifyLayoutAttrChange(); + } +} + std::vector UIHTMLWidget::getPropertiesImplemented() const { auto props = UILayout::getPropertiesImplemented(); auto local = { PropertyId::Display, @@ -465,7 +589,24 @@ std::vector UIHTMLWidget::getPropertiesImplemented() const { PropertyId::Order, PropertyId::ColumnGap, PropertyId::RowGap, - PropertyId::Gap }; + PropertyId::Gap, + PropertyId::GridTemplateRows, + PropertyId::GridTemplateColumns, + PropertyId::GridTemplateAreas, + PropertyId::GridTemplate, + PropertyId::GridAutoRows, + PropertyId::GridAutoColumns, + PropertyId::GridAutoFlow, + PropertyId::Grid, + PropertyId::GridRowStart, + PropertyId::GridRowEnd, + PropertyId::GridColumnStart, + PropertyId::GridColumnEnd, + PropertyId::GridRow, + PropertyId::GridColumn, + PropertyId::GridArea, + PropertyId::JustifyItems, + PropertyId::JustifySelf }; props.insert( props.end(), local.begin(), local.end() ); return props; } @@ -520,6 +661,32 @@ std::string UIHTMLWidget::getPropertyString( const PropertyDefinition* propertyD return getRowGap(); case PropertyId::ColumnGap: return getColumnGap(); + case PropertyId::GridTemplateRows: + return getGridTemplateRows(); + case PropertyId::GridTemplateColumns: + return getGridTemplateColumns(); + case PropertyId::GridTemplateAreas: + return getGridTemplateAreas(); + case PropertyId::GridAutoRows: + return getGridAutoRows(); + case PropertyId::GridAutoColumns: + return getGridAutoColumns(); + case PropertyId::GridAutoFlow: + return CSSGridAutoFlowHelper::toString( getGridAutoFlow() ); + case PropertyId::GridRowStart: + return getGridRowStart(); + case PropertyId::GridRowEnd: + return getGridRowEnd(); + case PropertyId::GridColumnStart: + return getGridColumnStart(); + case PropertyId::GridColumnEnd: + return getGridColumnEnd(); + case PropertyId::GridArea: + return getGridArea(); + case PropertyId::JustifyItems: + return CSSJustifyItemsHelper::toString( getJustifyItems() ); + case PropertyId::JustifySelf: + return CSSJustifySelfHelper::toString( getJustifySelf() ); default: return UILayout::getPropertyString( propertyDef ); } @@ -529,6 +696,17 @@ bool UIHTMLWidget::applyProperty( const StyleSheetProperty& attribute ) { if ( !checkPropertyDefinition( attribute ) ) return false; + auto applyGridLineShorthand = []( const std::string& value, auto setStart, auto setEnd ) { + size_t slash = value.find( '/' ); + if ( slash == std::string::npos ) { + setStart( String::trim( value ) ); + setEnd( "auto" ); + } else { + setStart( String::trim( value.substr( 0, slash ) ) ); + setEnd( String::trim( value.substr( slash + 1 ) ) ); + } + }; + switch ( attribute.getPropertyDefinition()->getPropertyId() ) { case PropertyId::Display: { setDisplay( CSSDisplayHelper::fromString( attribute.asString() ) ); @@ -632,6 +810,78 @@ bool UIHTMLWidget::applyProperty( const StyleSheetProperty& attribute ) { setColumnGap( attribute.asString() ); return true; } + case PropertyId::GridTemplateRows: { + setGridTemplateRows( attribute.asString() ); + return true; + } + case PropertyId::GridTemplateColumns: { + setGridTemplateColumns( attribute.asString() ); + return true; + } + case PropertyId::GridTemplateAreas: { + setGridTemplateAreas( attribute.asString() ); + return true; + } + case PropertyId::GridAutoRows: { + setGridAutoRows( attribute.asString() ); + return true; + } + case PropertyId::GridAutoColumns: { + setGridAutoColumns( attribute.asString() ); + return true; + } + case PropertyId::GridAutoFlow: { + std::string val = attribute.asString(); + String::toLowerInPlace( val ); + setGridAutoFlowDense( val.find( "dense" ) != std::string::npos ); + if ( val.find( "column" ) != std::string::npos ) + setGridAutoFlow( CSSGridAutoFlow::Column ); + else + setGridAutoFlow( CSSGridAutoFlow::Row ); + return true; + } + case PropertyId::GridRowStart: { + setGridRowStart( attribute.asString() ); + return true; + } + case PropertyId::GridRowEnd: { + setGridRowEnd( attribute.asString() ); + return true; + } + case PropertyId::GridColumnStart: { + setGridColumnStart( attribute.asString() ); + return true; + } + case PropertyId::GridColumnEnd: { + setGridColumnEnd( attribute.asString() ); + return true; + } + case PropertyId::GridRow: { + applyGridLineShorthand( + attribute.asString(), + [this]( const std::string& value ) { setGridRowStart( value ); }, + [this]( const std::string& value ) { setGridRowEnd( value ); } ); + return true; + } + case PropertyId::GridColumn: { + applyGridLineShorthand( + attribute.asString(), + [this]( const std::string& value ) { setGridColumnStart( value ); }, + [this]( const std::string& value ) { setGridColumnEnd( value ); } ); + return true; + } + case PropertyId::GridArea: { + setGridArea( attribute.asString() ); + return true; + } + case PropertyId::JustifyItems: { + setJustifyItems( CSSJustifyItemsHelper::fromString( attribute.asString() ) ); + return true; + } + case PropertyId::JustifySelf: { + setJustifySelf( CSSJustifySelfHelper::fromString( attribute.asString() ) ); + return true; + } default: break; } @@ -732,6 +982,29 @@ void UIHTMLWidget::updateOutOfFlowPosition() { bool useLeft = mLeftEq != "auto"; bool useRight = mRightEq != "auto"; + // Per CSS §10.1: for absolutely positioned elements, percentage top/bottom + // resolves against the containing block's height. If the containing block + // does not have a definite height, the percentage computes to auto to + // prevent circular dependencies. + auto cbHasDefiniteHeight = [&]() { + if ( !cb->isLayout() ) + return true; + auto* cbLayout = cb->asType(); + if ( cbLayout->getLayoutHeightPolicy() != SizePolicy::Fixed ) + return false; + if ( cb->getUIStyle() ) { + const auto* hprop = cb->getUIStyle()->getProperty( PropertyId::Height ); + if ( hprop && StyleSheetLength::isPercentage( hprop->value() ) ) + return false; + } + return true; + }; + + if ( useTop && StyleSheetLength::isPercentage( mTopEq ) && !cbHasDefiniteHeight() ) + useTop = false; + if ( useBottom && StyleSheetLength::isPercentage( mBottomEq ) && !cbHasDefiniteHeight() ) + useBottom = false; + if ( useLeft ) left = lengthFromValue( mLeftEq, CSS::PropertyRelativeTarget::ContainingBlockWidth, 0 ); if ( useRight ) diff --git a/src/eepp/ui/uilayoutermanager.cpp b/src/eepp/ui/uilayoutermanager.cpp index 46ed94c7e..3e1d8934c 100644 --- a/src/eepp/ui/uilayoutermanager.cpp +++ b/src/eepp/ui/uilayoutermanager.cpp @@ -1,6 +1,7 @@ #include #include #include +#include #include #include #include @@ -16,12 +17,22 @@ static bool parentIsFlexContainer( UIWidget* widget ) { parent->asType()->isFlex(); } +static bool parentIsGridContainer( UIWidget* widget ) { + Node* parent = widget->getParent(); + return parent && parent->isType( UI_TYPE_HTML_WIDGET ) && + parent->asType()->isGrid(); +} + UILayouter* UILayouterManager::create( CSSDisplay display, UIWidget* container ) { - // Blockification per CSS Flexbox §4: children of flex containers are block-level - if ( parentIsFlexContainer( container ) ) { - // But a child that is itself a flex container still needs FlexLayouter + // Blockification per CSS Flexbox §4 and CSS Grid §6: children of flex / grid containers + // are block-level + if ( parentIsFlexContainer( container ) || parentIsGridContainer( container ) ) { + // But a child that is itself a flex container still needs FlexLayouter, + // and a child that is itself a grid container still needs GridLayouter. if ( display == CSSDisplay::Flex || display == CSSDisplay::InlineFlex ) return eeNew( FlexLayouter, ( container ) ); + if ( display == CSSDisplay::Grid || display == CSSDisplay::InlineGrid ) + return eeNew( GridLayouter, ( container ) ); return eeNew( BlockLayouter, ( container ) ); } @@ -34,6 +45,9 @@ UILayouter* UILayouterManager::create( CSSDisplay display, UIWidget* container ) case CSSDisplay::Flex: case CSSDisplay::InlineFlex: return eeNew( FlexLayouter, ( container ) ); + case CSSDisplay::Grid: + case CSSDisplay::InlineGrid: + return eeNew( GridLayouter, ( container ) ); case CSSDisplay::Inline: if ( container->isType( UI_TYPE_TEXTSPAN ) ) return eeNew( InlineLayouter, ( container ) ); diff --git a/src/eepp/ui/uirichtext.cpp b/src/eepp/ui/uirichtext.cpp index 527d08e51..1ccb97437 100644 --- a/src/eepp/ui/uirichtext.cpp +++ b/src/eepp/ui/uirichtext.cpp @@ -248,7 +248,9 @@ bool UIHTMLBody::applyProperty( const StyleSheetProperty& attribute ) { void UIHTMLBody::updateLayout() { UIRichText::updateLayout(); - if ( mChild && mChild->isWidget() ) { + if ( mChild && mChild->isWidget() && !mSettingBodyHeight ) { + mSettingBodyHeight = true; + Float maxH = 0; Node* child = mChild; Float minHeight = std::max( @@ -279,6 +281,8 @@ void UIHTMLBody::updateLayout() { if ( dpH != minHeight ) setMinHeight( dpH ); } + + mSettingBodyHeight = false; } } @@ -371,6 +375,18 @@ void UIRichText::draw() { if ( mVisible && 0.f != mAlpha ) { UIWidget::draw(); + // Block-level flex and grid containers do not own text painting for their item children. + // Their children are blockified and laid out/drawn as independent nodes. A container + // can still have a stale mRichText from a previous display state or an intermediate + // layout pass, so bail out here too; otherwise grid/flex items are painted twice: once by + // this parent stream and once by the child UITextSpan::draw(). + // + // Do not use isFlex()/isGrid() here: those also include inline-flex/inline-grid. Inline + // flex/grid containers are atomic inline-level boxes in their parent formatting context + // and must not be treated like block-level containers for this paint-ownership shortcut. + if ( getDisplay() == CSSDisplay::Flex || getDisplay() == CSSDisplay::Grid ) + return; + if ( mRichText.getSize().getWidth() > 0.f ) { Rectf contentOffset = getPixelsContentOffset(); if ( isClipped() ) { @@ -1592,11 +1608,19 @@ void UIRichText::rebuildRichText( UILayout* container, RichText& richText, Intri Float maxWidth = 0; bool isInlineBlockTextSpan = container->isType( UI_TYPE_TEXTSPAN ) && container->asType()->isInlineBlock(); + Node* parentNode = container->getParent(); + bool parentIsFlexOrGrid = parentNode && parentNode->isType( UI_TYPE_HTML_WIDGET ) && + ( parentNode->asType()->isFlex() || + parentNode->asType()->isGrid() ); if ( isInlineBlockTextSpan && mode == IntrinsicMode::None && container->getPixelsSize().getWidth() > 0 ) { maxWidth = container->getPixelsSize().getWidth() - container->getPixelsContentOffset().Left - container->getPixelsContentOffset().Right; + } else if ( parentIsFlexOrGrid && + container->getLayoutWidthPolicy() == SizePolicy::WrapContent && + mode == IntrinsicMode::None ) { + maxWidth = 0; } else if ( container->getLayoutWidthPolicy() == SizePolicy::WrapContent ) { maxWidth = container->getMatchParentWidth() - container->getPixelsContentOffset().Left - container->getPixelsContentOffset().Right; @@ -1641,10 +1665,12 @@ void UIRichText::rebuildRichText( UILayout* container, RichText& richText, Intri if ( container->isType( UI_TYPE_TEXTSPAN ) ) { UITextSpan* selfSpan = container->asType(); - Node* parentNode = container->getParent(); - bool parentIsFlex = parentNode->isType( UI_TYPE_HTML_WIDGET ) && + bool parentIsFlex = parentNode && parentNode->isType( UI_TYPE_HTML_WIDGET ) && parentNode->asType()->isFlex(); - if ( !selfSpan->getText().empty() && ( !selfSpan->isInline() || parentIsFlex ) && + bool parentIsGrid = parentNode && parentNode->isType( UI_TYPE_HTML_WIDGET ) && + parentNode->asType()->isGrid(); + if ( !selfSpan->getText().empty() && + ( !selfSpan->isInline() || parentIsFlex || parentIsGrid ) && NULL != selfSpan->getFontStyleConfig().Font ) { auto collapse = getEffectiveWhiteSpaceCollapse( selfSpan, containerRichText ); richText.setWhiteSpaceWrapMode( toRichTextWhiteSpaceWrapMode( collapse ) ); @@ -2018,6 +2044,22 @@ void UIRichText::rebuildRichText( UILayout* container, RichText& richText, Intri } }; + if ( container->isType( UI_TYPE_HTML_WIDGET ) ) { + auto* htmlContainer = container->asType(); + // RichText is the inline-formatting stream for normal block containers. Block-level + // flex/grid containers are different: every in-flow child becomes a flex/grid item and + // must not be folded into the parent's text stream. Keeping the parent stream empty + // prevents duplicate paint and keeps item geometry sourced from the layouter, not from + // inline fragments. + // + // Inline-flex/inline-grid are intentionally excluded here for the same reason as in + // UIRichText::draw(): isFlex()/isGrid() includes inline display variants, but these + // ownership exits are only valid for block-level flex/grid containers. + CSSDisplay display = htmlContainer->getDisplay(); + if ( display == CSSDisplay::Flex || display == CSSDisplay::Grid ) + return; + } + Node* child = container->getFirstChild(); while ( NULL != child ) { bool isOutOfFlow = diff --git a/src/eepp/ui/uitextspan.cpp b/src/eepp/ui/uitextspan.cpp index f27fd5b2b..acd2b2a01 100644 --- a/src/eepp/ui/uitextspan.cpp +++ b/src/eepp/ui/uitextspan.cpp @@ -90,12 +90,24 @@ void UITextSpan::onDisplayChange() { } void UITextSpan::draw() { - // When a UITextSpan is a flex item it is laid out independently by the - // flex container (blockification per CSS Flexbox §4). In that case the - // parent flex container does NOT render its text via rebuildRichText(), - // so the span must draw itself. - if ( !isInline() || ( getParent() && getParent()->isType( UI_TYPE_HTML_WIDGET ) && - getParent()->asType()->isFlex() ) ) { + bool parentIsBlockFlexOrGrid = false; + if ( getParent() && getParent()->isType( UI_TYPE_HTML_WIDGET ) ) { + CSSDisplay parentDisplay = getParent()->asType()->getDisplay(); + parentIsBlockFlexOrGrid = + parentDisplay == CSSDisplay::Flex || parentDisplay == CSSDisplay::Grid; + } + + // When a UITextSpan is an item in a block-level flex/grid container, it is laid out + // independently by the container (blockification per CSS Flexbox §4 / CSS Grid §6). In that + // case the parent container must not render its text via rebuildRichText(), so the span must + // draw itself. This must stay in sync with UIRichText::draw() and + // UIRichText::rebuildRichText(): block-level parent flex/grid containers skip their own text + // stream, and item spans are the single paint owner for their text. + // + // Do not use UIHTMLWidget::isFlex()/isGrid() for the parent test. Those include inline-flex + // and inline-grid, which are atomic inline-level boxes and do not use this self-paint ownership + // rule. + if ( !isInline() || parentIsBlockFlexOrGrid ) { UIRichText::draw(); } } diff --git a/src/tests/unit_tests/uihtml_grid_test.cpp b/src/tests/unit_tests/uihtml_grid_test.cpp new file mode 100644 index 000000000..d91805472 --- /dev/null +++ b/src/tests/unit_tests/uihtml_grid_test.cpp @@ -0,0 +1,1961 @@ +#include "utest.h" + +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include +#include + +using namespace EE; +using namespace EE::UI; +using namespace EE::UI::Tools; +using namespace EE::Window; +using namespace EE::Graphics; + +static void init_grid_test() { + FileSystem::changeWorkingDirectory( Sys::getProcessPath() ); + FontTrueType* font = FontTrueType::New( "NotoSans-Regular" ); + font->loadFromFile( "../assets/fonts/NotoSans-Regular.ttf" ); + FontFamily::loadFromRegular( font ); + UISceneNode* sceneNode = UISceneNode::New(); + SceneManager::instance()->add( sceneNode ); + SceneManager::instance()->setCurrentUISceneNode( sceneNode ); + UIThemeManager* themeManager = sceneNode->getUIThemeManager(); + themeManager->setDefaultFont( font ); + themeManager->applyDefaultTheme( sceneNode->getRoot() ); +} + +static size_t countBrightPixelsInRect( Image& image, const Rectf& rect ) { + int left = eeclamp( static_cast( rect.Left ), 0, static_cast( image.getWidth() ) ); + int top = eeclamp( static_cast( rect.Top ), 0, static_cast( image.getHeight() ) ); + int right = eeclamp( static_cast( rect.Right ), 0, static_cast( image.getWidth() ) ); + int bottom = + eeclamp( static_cast( rect.Bottom ), 0, static_cast( image.getHeight() ) ); + size_t count = 0; + for ( int y = top; y < bottom; ++y ) { + for ( int x = left; x < right; ++x ) { + Color color = image.getPixel( x, y ); + if ( static_cast( color.r ) + static_cast( color.g ) + + static_cast( color.b ) > + 560 ) + count++; + } + } + return count; +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 0: Display routing and property defaults +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridProperties, displayGridEnumConversions ) { + EXPECT_TRUE( CSSDisplayHelper::toString( CSSDisplay::Grid ) == "grid" ); + EXPECT_TRUE( CSSDisplayHelper::toString( CSSDisplay::InlineGrid ) == "inline-grid" ); + EXPECT_TRUE( CSSDisplayHelper::fromString( "grid" ) == CSSDisplay::Grid ); + EXPECT_TRUE( CSSDisplayHelper::fromString( "inline-grid" ) == CSSDisplay::InlineGrid ); +} + +UTEST( GridProperties, longhandDefaults ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + + EXPECT_TRUE( grid->getGridTemplateRows() == "none" ); + EXPECT_TRUE( grid->getGridTemplateColumns() == "none" ); + EXPECT_TRUE( grid->getGridTemplateAreas() == "none" ); + EXPECT_TRUE( grid->getGridAutoRows() == "auto" ); + EXPECT_TRUE( grid->getGridAutoColumns() == "auto" ); + EXPECT_EQ( grid->getGridAutoFlow(), CSSGridAutoFlow::Row ); + EXPECT_EQ( grid->getGridAutoFlowDense(), false ); + EXPECT_TRUE( grid->getGridRowStart() == "auto" ); + EXPECT_TRUE( grid->getGridRowEnd() == "auto" ); + EXPECT_TRUE( grid->getGridColumnStart() == "auto" ); + EXPECT_TRUE( grid->getGridColumnEnd() == "auto" ); + EXPECT_TRUE( grid->getGridArea() == "auto" ); + EXPECT_EQ( grid->getJustifyItems(), CSSJustifyItems::Normal ); + EXPECT_EQ( grid->getJustifySelf(), CSSJustifySelf::Auto ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 4: Definite Placement (GridLineParser) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridLineParser, parseAuto ) { + GridLineResult r = GridLineParser::parse( "auto" ); + EXPECT_TRUE( r.isAuto ); + EXPECT_FALSE( r.isSpan ); +} + +UTEST( GridLineParser, parseInteger ) { + GridLineResult r = GridLineParser::parse( "3" ); + EXPECT_FALSE( r.isAuto ); + EXPECT_EQ( r.lineNumber, 3 ); +} + +UTEST( GridLineParser, parseNegativeInteger ) { + GridLineResult r = GridLineParser::parse( "-1" ); + EXPECT_FALSE( r.isAuto ); + EXPECT_EQ( r.lineNumber, -1 ); +} + +UTEST( GridLineParser, parseSpanCount ) { + GridLineResult r = GridLineParser::parse( "span 2" ); + EXPECT_TRUE( r.isSpan ); + EXPECT_EQ( r.spanCount, 2 ); +} + +UTEST( GridLineParser, parseEmpty ) { + GridLineResult r = GridLineParser::parse( "" ); + EXPECT_TRUE( r.isAuto ); +} + +UTEST( GridPlacement, columnExplicitLines ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* item = UIHTMLWidget::New(); + item->setParent( grid ); + item->setGridColumnStart( "1" ); + item->setGridColumnEnd( "3" ); + item->setGridRowStart( "1" ); + item->setGridRowEnd( "2" ); + + sceneNode->updateDirtyLayouts(); + EXPECT_TRUE( item->getParent() == grid ); + Engine::destroySingleton(); +} + +UTEST( GridPlacement, usesSpanKeyword ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* item = UIHTMLWidget::New(); + item->setParent( grid ); + item->setGridColumnStart( "1" ); + item->setGridColumnEnd( "span 2" ); + + sceneNode->updateDirtyLayouts(); + EXPECT_TRUE( item->getParent() == grid ); + Engine::destroySingleton(); +} + +UTEST( GridPlacement, negativeEndLine ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* item = UIHTMLWidget::New(); + item->setParent( grid ); + item->setGridColumnStart( "1" ); + item->setGridColumnEnd( "-1" ); + + sceneNode->updateDirtyLayouts(); + EXPECT_TRUE( item->getParent() == grid ); + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 5-6: Auto-Placement +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridAutoPlacement, rowFlowFillsColumnsThenRows ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + UIHTMLWidget* i2 = UIHTMLWidget::New(); + i2->setParent( grid ); + UIHTMLWidget* i3 = UIHTMLWidget::New(); + i3->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_EQ( items.size(), 3u ); + + // All items should be placed (non-zero positions) + EXPECT_NE( items[0].resolvedRowStart, 0 ); + EXPECT_NE( items[1].resolvedRowStart, 0 ); + EXPECT_NE( items[2].resolvedRowStart, 0 ); + EXPECT_NE( items[0].resolvedColumnStart, 0 ); + EXPECT_NE( items[1].resolvedColumnStart, 0 ); + EXPECT_NE( items[2].resolvedColumnStart, 0 ); + + // No overlapping positions + for ( size_t a = 0; a < items.size(); ++a ) + for ( size_t b = a + 1; b < items.size(); ++b ) + EXPECT_FALSE( items[a].resolvedRowStart == items[b].resolvedRowStart && + items[a].resolvedColumnStart == items[b].resolvedColumnStart ); + + Engine::destroySingleton(); +} + +UTEST( GridAutoPlacement, columnFlowFillsRowsThenColumns ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateRows( "50px 50px" ); + grid->setGridAutoFlow( CSSGridAutoFlow::Column ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + UIHTMLWidget* i2 = UIHTMLWidget::New(); + i2->setParent( grid ); + UIHTMLWidget* i3 = UIHTMLWidget::New(); + i3->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_EQ( items.size(), 3u ); + EXPECT_EQ( items[0].resolvedRowStart, 1 ); + EXPECT_EQ( items[0].resolvedColumnStart, 1 ); + EXPECT_EQ( items[1].resolvedRowStart, 2 ); + EXPECT_EQ( items[1].resolvedColumnStart, 1 ); + EXPECT_EQ( items[2].resolvedRowStart, 1 ); + EXPECT_EQ( items[2].resolvedColumnStart, 2 ); + + Engine::destroySingleton(); +} + +UTEST( GridAutoPlacement, definiteLeavesHoleForSparse ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Place item at (1,1) + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + i1->setGridColumnStart( "1" ); + i1->setGridRowStart( "1" ); + + UIHTMLWidget* i2 = UIHTMLWidget::New(); + i2->setParent( grid ); + UIHTMLWidget* i3 = UIHTMLWidget::New(); + i3->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_EQ( items.size(), 3u ); + + // i1 definitely at (1,1) + EXPECT_EQ( items[0].resolvedRowStart, 1 ); + EXPECT_EQ( items[0].resolvedColumnStart, 1 ); + + // i2 and i3 should not overlap with i1 or each other + for ( size_t a = 0; a < items.size(); ++a ) + for ( size_t b = a + 1; b < items.size(); ++b ) + EXPECT_FALSE( items[a].resolvedRowStart == items[b].resolvedRowStart && + items[a].resolvedColumnStart == items[b].resolvedColumnStart ); + + Engine::destroySingleton(); +} + +UTEST( GridAutoPlacement, sparseSkipsOccupiedCells ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Definite placement takes (1,1) and (2,2) + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + i1->setGridColumnStart( "1" ); + i1->setGridRowStart( "1" ); + + UIHTMLWidget* i2 = UIHTMLWidget::New(); + i2->setParent( grid ); + i2->setGridColumnStart( "2" ); + i2->setGridRowStart( "2" ); + + // Auto items: should fill available cells in order + UIHTMLWidget* a1 = UIHTMLWidget::New(); + a1->setParent( grid ); + UIHTMLWidget* a2 = UIHTMLWidget::New(); + a2->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_EQ( items.size(), 4u ); + + // a1: (1,1) is taken by i1, so (1,2) is first available + EXPECT_EQ( items[2].resolvedRowStart, 1 ); + EXPECT_EQ( items[2].resolvedColumnStart, 2 ); + + // a2: sparse → continues from cursor. After a1 at (1,2), next is (1,3) or (2,1) + // Since a1 took (1,2), and (1,3) is free, a2 should go to (1,3) + EXPECT_EQ( items[3].resolvedRowStart, 1 ); + EXPECT_EQ( items[3].resolvedColumnStart, 3 ); + + Engine::destroySingleton(); +} + +UTEST( GridAutoPlacement, honorsOrder ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + i1->setOrder( 1 ); + UIHTMLWidget* i2 = UIHTMLWidget::New(); + i2->setParent( grid ); + i2->setOrder( 0 ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_EQ( items.size(), 2u ); + + // i2 has order 0, should be placed first: (1,1) + EXPECT_EQ( items[0].resolvedRowStart, 1 ); + EXPECT_EQ( items[0].resolvedColumnStart, 1 ); + + // i1 has order 1, should be placed second: (1,2) + EXPECT_EQ( items[1].resolvedRowStart, 1 ); + EXPECT_EQ( items[1].resolvedColumnStart, 2 ); + + Engine::destroySingleton(); +} + +UTEST( GridAutoPlacement, spanSkipsTooSmallHoles ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + grid->setPixelsSize( 500, 200 ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px" ); + + UIHTMLWidget* i1 = UIHTMLWidget::New(); + i1->setParent( grid ); + i1->setGridColumnStart( "1" ); + i1->setGridRowStart( "1" ); + + UIHTMLWidget* spanItem = UIHTMLWidget::New(); + spanItem->setParent( grid ); + spanItem->setGridColumnEnd( "span 2" ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + ASSERT_EQ( items.size(), 2u ); + + EXPECT_EQ( items[1].resolvedRowStart, 1 ); + EXPECT_EQ( items[1].resolvedColumnStart, 2 ); + EXPECT_EQ( items[1].resolvedColumnEnd, 4 ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 7: Basic Track Sizing and Layout +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridLayout, fixedTracksPositionCorrectly ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 200px" ); + grid->setGridTemplateRows( "50px 80px" ); + grid->setPixelsSize( 500, 300 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Child 1: column 1 / span 1, row 1 / span 1 (default) + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + + // Child 2: column 2 / span 1, row 1 / span 2 + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + c2->setGridColumnStart( "2" ); + c2->setGridRowStart( "1" ); + c2->setGridRowEnd( "span 2" ); + + sceneNode->updateDirtyLayouts(); + + // c1: column 1, row 1 → x=0, y=0, w=100, h=50 + EXPECT_NEAR( c1->getPixelsPosition().x, -500.f, 500.f ); // relative position within parent + // Use data from item resolution + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + ASSERT_EQ( items.size(), 2u ); + + // c1: column 1-2, row 1-2 + EXPECT_EQ( items[0].resolvedColumnStart, 1 ); + EXPECT_EQ( items[0].resolvedColumnEnd, 2 ); + EXPECT_EQ( items[0].resolvedRowStart, 1 ); + EXPECT_EQ( items[0].resolvedRowEnd, 2 ); + + // c2: column 2-3, row 1-3 + EXPECT_EQ( items[1].resolvedColumnStart, 2 ); + EXPECT_EQ( items[1].resolvedColumnEnd, 3 ); + EXPECT_EQ( items[1].resolvedRowStart, 1 ); + EXPECT_EQ( items[1].resolvedRowEnd, 3 ); + + Engine::destroySingleton(); +} + +UTEST( GridAreasParser, noneIsNone ) { + GridAreaTemplate tmpl = GridAreasParser::parseAreas( "none" ); + EXPECT_TRUE( tmpl.none ); + EXPECT_TRUE( tmpl.valid ); + EXPECT_EQ( tmpl.areas.size(), 0u ); +} + +UTEST( GridAreasParser, dotNullCellsAreAccepted ) { + GridAreaTemplate tmpl = GridAreasParser::parseAreas( "\"header header\" \". content\"" ); + EXPECT_TRUE( tmpl.valid ); + EXPECT_TRUE( tmpl.areas.find( "header" ) != tmpl.areas.end() ); + EXPECT_TRUE( tmpl.areas.find( "." ) == tmpl.areas.end() ); + EXPECT_TRUE( tmpl.areas.find( "content" ) != tmpl.areas.end() ); +} + +UTEST( GridAreasParser, unevenRowWidthsInvalidate ) { + GridAreaTemplate tmpl = GridAreasParser::parseAreas( "\"a a\" \"a\"" ); + EXPECT_FALSE( tmpl.valid ); +} + +UTEST( GridAreasParser, disconnectedAreaTokensInvalidate ) { + // "a . a" means area "a" is split into two separate regions + GridAreaTemplate tmpl = GridAreasParser::parseAreas( "\"a . a\"" ); + EXPECT_FALSE( tmpl.valid ); +} + +UTEST( GridAreasParser, implicitLineNamesFromAreas ) { + GridAreaTemplate tmpl = GridAreasParser::parseAreas( "\"head head\" \"nav main\"" ); + EXPECT_TRUE( tmpl.valid ); + + // Row line 1: head-start + std::vector rowLine1 = GridAreasParser::getLineNamesForRowLine( tmpl, 1 ); + EXPECT_EQ( rowLine1.size(), 1u ); + EXPECT_TRUE( rowLine1[0] == "head-start" ); + + // Row line 2: head-end, nav-start, main-start + std::vector rowLine2 = GridAreasParser::getLineNamesForRowLine( tmpl, 2 ); + // head ends at row 2, nav and main start at row 2 + EXPECT_EQ( rowLine2.size(), 3u ); + + // Column line 1: head-start, nav-start + std::vector colLine1 = GridAreasParser::getLineNamesForColumnLine( tmpl, 1 ); + EXPECT_EQ( colLine1.size(), 2u ); + + // Column line 3: head-end, main-end + std::vector colLine3 = GridAreasParser::getLineNamesForColumnLine( tmpl, 3 ); + EXPECT_EQ( colLine3.size(), 2u ); + EXPECT_TRUE( colLine3[0] == "head-end" || colLine3[1] == "head-end" ); + EXPECT_TRUE( colLine3[0] == "main-end" || colLine3[1] == "main-end" ); +} + +UTEST( GridParser, fixedTracks ) { + GridTrackList list = GridTrackParser::parseTrackList( "100px 1fr auto" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 3u ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( list.tracks[0].size.min.value, 100.f ); + EXPECT_EQ( list.tracks[1].size.min.type, GridTrackBreadthType::Flex ); + EXPECT_EQ( list.tracks[1].size.min.value, 1.f ); + EXPECT_EQ( list.tracks[2].size.min.type, GridTrackBreadthType::Auto ); +} + +UTEST( GridParser, lineNames ) { + GridTrackList list = GridTrackParser::parseTrackList( "[start] 1fr [mid a] 2fr [end]" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 2u ); + EXPECT_EQ( list.tracks[0].beforeLineNames.size(), 1u ); + EXPECT_TRUE( list.tracks[0].beforeLineNames[0] == "start" ); + EXPECT_EQ( list.tracks[1].beforeLineNames.size(), 2u ); + EXPECT_TRUE( list.tracks[1].beforeLineNames[0] == "mid" ); + EXPECT_TRUE( list.tracks[1].beforeLineNames[1] == "a" ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Flex ); + EXPECT_EQ( list.tracks[1].size.min.type, GridTrackBreadthType::Flex ); + EXPECT_EQ( list.tracks[1].size.min.value, 2.f ); +} + +UTEST( GridParser, repeatExpands ) { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(3, 10px [x] 1fr)" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 6u ); + EXPECT_EQ( list.tracks[0].beforeLineNames.size(), 0u ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( list.tracks[0].size.min.value, 10.f ); + EXPECT_EQ( list.tracks[1].beforeLineNames.size(), 1u ); + EXPECT_TRUE( list.tracks[1].beforeLineNames[0] == "x" ); + EXPECT_EQ( list.tracks[1].size.min.type, GridTrackBreadthType::Flex ); + EXPECT_EQ( list.tracks[1].size.min.value, 1.f ); +} + +UTEST( GridParser, invalidRepeatCount ) { + { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(-1, 1fr)" ); + EXPECT_FALSE( list.valid ); + } + { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(abc, 1fr)" ); + EXPECT_FALSE( list.valid ); + } +} + +UTEST( GridParser, minmax ) { + GridTrackList list = GridTrackParser::parseTrackList( "minmax(100px, 1fr)" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 1u ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( list.tracks[0].size.min.value, 100.f ); + EXPECT_EQ( list.tracks[0].size.max.type, GridTrackBreadthType::Flex ); + EXPECT_EQ( list.tracks[0].size.max.value, 1.f ); +} + +UTEST( GridParser, fitContent ) { + GridTrackList list = GridTrackParser::parseTrackList( "fit-content(200px)" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 1u ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Auto ); + EXPECT_EQ( list.tracks[0].size.max.type, GridTrackBreadthType::FitContent ); + EXPECT_EQ( list.tracks[0].size.max.value, 200.f ); +} + +UTEST( GridParser, percentageRemainsPercentage ) { + GridTrackList list = GridTrackParser::parseTrackList( "50% 100px" ); + EXPECT_TRUE( list.valid ); + EXPECT_EQ( list.tracks.size(), 2u ); + EXPECT_EQ( list.tracks[0].size.min.type, GridTrackBreadthType::Percentage ); + EXPECT_EQ( list.tracks[0].size.min.value, 50.f ); + EXPECT_EQ( list.tracks[1].size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( list.tracks[1].size.min.value, 100.f ); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 0: Display routing and property defaults +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, inlineGridSetsWrapContentWidth ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setLayoutWidthPolicy( SizePolicy::MatchParent ); + grid->setDisplay( CSSDisplay::InlineGrid ); + + EXPECT_EQ( grid->getLayoutWidthPolicy(), SizePolicy::WrapContent ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Phase 3: Grid Item Collection +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, collectsInFlowChildren ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* child1 = UIHTMLWidget::New(); + child1->setParent( grid ); + child1->setPixelsSize( 100, 50 ); + child1->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* child2 = UIHTMLWidget::New(); + child2->setParent( grid ); + child2->setPixelsSize( 100, 50 ); + child2->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Layout should not crash and children should remain valid + sceneNode->updateDirtyLayouts(); + + EXPECT_TRUE( child1->getParent() == grid ); + EXPECT_TRUE( child2->getParent() == grid ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, skipsOutOfFlowChildren ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* normalChild = UIHTMLWidget::New(); + normalChild->setParent( grid ); + normalChild->setPixelsSize( 100, 50 ); + normalChild->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* absoluteChild = UIHTMLWidget::New(); + absoluteChild->setParent( grid ); + absoluteChild->setCSSPosition( CSSPosition::Absolute ); + absoluteChild->setPixelsSize( 100, 50 ); + absoluteChild->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + absoluteChild->setPixelsPosition( 0, 0 ); + + sceneNode->updateDirtyLayouts(); + + // Normal child stays; absolute child should not be disrupted by grid layout + EXPECT_TRUE( normalChild->getParent() == grid ); + EXPECT_EQ( absoluteChild->getPixelsPosition().x, 0.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, skipsDisplayNoneChildren ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* visibleChild = UIHTMLWidget::New(); + visibleChild->setParent( grid ); + visibleChild->setPixelsSize( 100, 50 ); + visibleChild->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* hiddenChild = UIHTMLWidget::New(); + hiddenChild->setParent( grid ); + hiddenChild->setDisplay( CSSDisplay::None ); + hiddenChild->setPixelsSize( 100, 50 ); + hiddenChild->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + sceneNode->updateDirtyLayouts(); + + EXPECT_TRUE( visibleChild->getParent() == grid ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, ignoresWhitespaceTextNodes ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* child = UIHTMLWidget::New(); + child->setParent( grid ); + child->setPixelsSize( 100, 50 ); + child->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Node with only whitespace should not disrupt grid layout + UITextNode* wsNode = UITextNode::New(); + wsNode->setParent( grid ); + wsNode->setText( " " ); + + sceneNode->updateDirtyLayouts(); + EXPECT_TRUE( child->getParent() == grid ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, anonymousTextNodeItem ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UITextNode* textNode = UITextNode::New(); + textNode->setParent( grid ); + textNode->setText( "Hello" ); + + // Non-whitespace text node should be collected as anonymous item (no crash) + sceneNode->updateDirtyLayouts(); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, blockifiesInlineChildren ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + // Inline-block child inside a grid container should be blockified (not be inline) + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* inlineChild = UIHTMLWidget::New(); + inlineChild->setParent( grid ); + inlineChild->setDisplay( CSSDisplay::InlineBlock ); + inlineChild->setPixelsSize( 100, 50 ); + inlineChild->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // UILayouterManager creates a BlockLayouter for the child because parent is grid + sceneNode->updateDirtyLayouts(); + + EXPECT_TRUE( inlineChild->getParent() == grid ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, floatDoesNotAffectGridItemPlacement ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* floatLeft = UIHTMLWidget::New(); + floatLeft->setParent( grid ); + floatLeft->setCSSFloat( CSSFloat::Left ); + floatLeft->setPixelsSize( 100, 50 ); + floatLeft->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* floatRight = UIHTMLWidget::New(); + floatRight->setParent( grid ); + floatRight->setCSSFloat( CSSFloat::Right ); + floatRight->setPixelsSize( 100, 50 ); + floatRight->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Floats inside grid should not cause issues + sceneNode->updateDirtyLayouts(); + + EXPECT_TRUE( floatLeft->getParent() == grid ); + EXPECT_TRUE( floatRight->getParent() == grid ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Auto-repeat parsing & expansion (fixed bug: propagated metadata) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridParser, autoRepeatFillsStored ) { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(auto-fill, minmax(100px, 1fr))" ); + EXPECT_TRUE( list.valid ); + EXPECT_TRUE( list.hasAutoRepeat ); + EXPECT_EQ( list.autoRepeatTemplate.size(), 1u ); + EXPECT_FALSE( list.autoRepeatIsFit ); +} + +UTEST( GridParser, autoFitFillsStored ) { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(auto-fit, 100px)" ); + EXPECT_TRUE( list.valid ); + EXPECT_TRUE( list.hasAutoRepeat ); + EXPECT_TRUE( list.autoRepeatIsFit ); + EXPECT_EQ( list.autoRepeatTemplate.size(), 1u ); + EXPECT_EQ( list.autoRepeatTemplate[0].size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( list.autoRepeatTemplate[0].size.min.value, 100.f ); +} + +// ───────────────────────────────────────────────────────────────────────────── +// expandAutoRepeat count computation (fixed bug: used max instead of min) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridParser, expandAutoRepeatWithMinmax ) { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(auto-fill, minmax(140px, 1fr))" ); + EXPECT_TRUE( list.valid ); + EXPECT_TRUE( list.hasAutoRepeat ); + // The template track should have min=140px length, max=1fr flex + const auto& t = list.autoRepeatTemplate[0]; + EXPECT_EQ( t.size.min.type, GridTrackBreadthType::Length ); + EXPECT_EQ( t.size.min.value, 140.f ); + EXPECT_EQ( t.size.max.type, GridTrackBreadthType::Flex ); + + // expandAutoRepeat should use min (140px) for count computation, not max (1fr) + GridTrackParser::expandAutoRepeat( list, 1000.f, 10.f ); + EXPECT_FALSE( list.hasAutoRepeat ); + // Count = floor((1000 + 10) / (140 + 10)) = floor(6.73) = 6 + EXPECT_EQ( list.tracks.size(), 6u ); +} + +UTEST( GridParser, expandAutoRepeatZeroAvailable ) { + GridTrackList list = GridTrackParser::parseTrackList( "repeat(auto-fill, 100px)" ); + // With 0 available size, should default to 1 repetition + GridTrackParser::expandAutoRepeat( list, 0.f, 10.f ); + EXPECT_EQ( list.tracks.size(), 1u ); +} + +// ───────────────────────────────────────────────────────────────────────────── +// expandAutoRepeat insertion position (fixed bug: pushed to end) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridParser, autoRepeatPositionInsert ) { + // "100px repeat(auto-fill, 1fr) 200px" → 100px goes before repeat, 200px after + GridTrackList list = GridTrackParser::parseTrackList( "100px repeat(auto-fill, 1fr) 200px" ); + EXPECT_TRUE( list.valid ); + EXPECT_TRUE( list.hasAutoRepeat ); + // Before expansion: tracks should be [100px, 200px], autoRepeatPosition=1 + EXPECT_EQ( list.tracks.size(), 2u ); + EXPECT_EQ( list.tracks[0].size.min.value, 100.f ); + EXPECT_EQ( list.tracks[1].size.min.value, 200.f ); + EXPECT_EQ( list.autoRepeatPosition, 1u ); + + GridTrackParser::expandAutoRepeat( list, 1000.f, 10.f ); + // After expansion: tracks should be [100px, 1fr, 200px] (count=1 since 1fr has no min size) + EXPECT_EQ( list.tracks.size(), 3u ); + EXPECT_EQ( list.tracks[0].size.min.value, 100.f ); + EXPECT_EQ( list.tracks[2].size.min.value, 200.f ); + EXPECT_EQ( list.tracks[1].size.min.type, GridTrackBreadthType::Flex ); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Column count and sizing with auto-fit (fixed bug: expandAutoRepeat + collapse) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, autoFitColumnCount ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "repeat(auto-fit, minmax(140px, 1fr))" ); + grid->setColumnGap( "10px" ); + grid->setPixelsSize( 1000, 300 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // 5 items + for ( int i = 0; i < 5; ++i ) { + UIHTMLWidget* card = UIHTMLWidget::New(); + card->setParent( grid ); + card->setPixelsSize( 100, 50 ); + card->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + } + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& cols = layouter->getColumns(); + const auto& items = layouter->getItems(); + + // auto-fit should create ~6 columns but collapse down to 5 used columns + EXPECT_EQ( cols.size(), 5u ); + EXPECT_EQ( items.size(), 5u ); + // Each column should be (1000 - 4*10) / 5 = 192 + EXPECT_NEAR( cols[0].baseSize, 192.f, 2.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Item width and height stretch (fixed bugs: Fixed policy + preSizeItems) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, itemWidthStretch ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "200px 300px" ); + grid->setPixelsSize( 600, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // c1: column 1 → width 200px + EXPECT_NEAR( c1->getPixelsSize().getWidth(), 200.f, 1.f ); + // c2: column 2 → width 300px + EXPECT_NEAR( c2->getPixelsSize().getWidth(), 300.f, 1.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, itemHeightStretch ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "200px 300px" ); + grid->setGridTemplateRows( "100px" ); + grid->setPixelsSize( 600, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Two items in the same row, different content heights + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + c1->setPixelsSize( 200, 40 ); + c1->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + c2->setPixelsSize( 300, 60 ); + c2->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + sceneNode->updateDirtyLayouts(); + + // Both items should stretch to 100px row height + EXPECT_NEAR( c1->getPixelsSize().getHeight(), 100.f, 2.f ); + EXPECT_NEAR( c2->getPixelsSize().getHeight(), 100.f, 2.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Gaps between items (fixed bug: cells included gaps, no visible separation) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, gapBetweenItems ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px" ); + grid->setColumnGap( "20px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + UIHTMLWidget* c3 = UIHTMLWidget::New(); + c3->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // c1 at x=0, width=100 + EXPECT_NEAR( c1->getPixelsPosition().x, 0.f, 1.f ); + EXPECT_NEAR( c1->getPixelsSize().getWidth(), 100.f, 1.f ); + // c2 at x=120 (= 100 + 20 gap), width=100 + EXPECT_NEAR( c2->getPixelsPosition().x, 120.f, 1.f ); + EXPECT_NEAR( c2->getPixelsSize().getWidth(), 100.f, 1.f ); + // c3 at x=240 (= 100 + 20 + 100 + 20), width=100 + EXPECT_NEAR( c3->getPixelsPosition().x, 240.f, 1.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Multi-span internal gaps (fixed bug: spanning items missed internal gaps) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, spanningItemWidthIncludesGaps ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px" ); + grid->setColumnGap( "10px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* spanItem = UIHTMLWidget::New(); + spanItem->setParent( grid ); + spanItem->setGridColumnStart( "1" ); + spanItem->setGridColumnEnd( "span 3" ); + + UIHTMLWidget* filler = UIHTMLWidget::New(); + filler->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // Span-3 item: 100 + 10 + 100 + 10 + 100 = 320 + EXPECT_NEAR( spanItem->getPixelsSize().getWidth(), 320.f, 1.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, spanningItemTwoColumns ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 200px" ); + grid->setColumnGap( "15px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* spanItem = UIHTMLWidget::New(); + spanItem->setParent( grid ); + spanItem->setGridColumnStart( "1" ); + spanItem->setGridColumnEnd( "span 2" ); + + sceneNode->updateDirtyLayouts(); + + // Span-2 item: 100 + 15 + 200 = 315 + EXPECT_NEAR( spanItem->getPixelsSize().getWidth(), 315.f, 1.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Justify-content alignment (fixed bug: space-between etc. just shifted grid) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, justifyContentCenter ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setJustifyContent( CSSJustifyContentHelper::fromString( "center" ) ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // Total content: 100 + 100 = 200 (no gaps by default) + // Extra: 500 - 200 = 300 → center at 150 + EXPECT_NEAR( c1->getPixelsPosition().x, 150.f, 2.f ); + EXPECT_NEAR( c2->getPixelsPosition().x, 250.f, 2.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, justifyContentSpaceBetween ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px" ); + grid->setJustifyContent( CSSJustifyContentHelper::fromString( "space-between" ) ); + grid->setPixelsSize( 600, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + UIHTMLWidget* c3 = UIHTMLWidget::New(); + c3->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // c2 should be positioned farther right than c1 + its width (gap present) + EXPECT_GT( c2->getPixelsPosition().x, c1->getPixelsPosition().x + 100.f ); + // c3 should be at or beyond c2 + c2's width + EXPECT_GT( c3->getPixelsPosition().x, c2->getPixelsPosition().x + 100.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, justifyContentSpaceAround ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setJustifyContent( CSSJustifyContentHelper::fromString( "space-around" ) ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // Total: 200, extra: 300, 2 items → extra/2 = 150 per gap between + // half-gap before c1 = 150/2 = 75, gap between = 150, half-gap after c2 = 75 + // c1 x = 75, c2 x = 75 + 100 + 150 = 325 + EXPECT_NEAR( c1->getPixelsPosition().x, 75.f, 2.f ); + EXPECT_NEAR( c2->getPixelsPosition().x, 325.f, 2.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, justifyContentSpaceEvenly ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setJustifyContent( CSSJustifyContentHelper::fromString( "space-evenly" ) ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + + sceneNode->updateDirtyLayouts(); + + // Total: 200, extra: 300, 2 cols + 1 = 3 slots → extra/3 = 100 each + // c1 x = 100, c2 x = 100 + 100 + 100 = 300 + EXPECT_NEAR( c1->getPixelsPosition().x, 100.f, 2.f ); + EXPECT_NEAR( c2->getPixelsPosition().x, 300.f, 2.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Axis-correct gap in track sizing (fixed bug: mColumnGap used for rows too) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, rowGapWorks ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px" ); + grid->setGridTemplateRows( "50px 50px" ); + grid->setRowGap( "10px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Place items explicitly in different rows + UIHTMLWidget* c1 = UIHTMLWidget::New(); + c1->setParent( grid ); + c1->setGridColumnStart( "1" ); + c1->setGridRowStart( "1" ); + + UIHTMLWidget* c2 = UIHTMLWidget::New(); + c2->setParent( grid ); + c2->setGridColumnStart( "1" ); + c2->setGridRowStart( "2" ); + + sceneNode->updateDirtyLayouts(); + + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + ASSERT_EQ( items.size(), 2u ); + // Explicitly placed: item 0 at row 1, item 1 at row 2 + EXPECT_EQ( items[0].resolvedRowStart, 1 ); + EXPECT_EQ( items[1].resolvedRowStart, 2 ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Negative line number clamping (fixed bug: no clamp, could go ≤0) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, negativeLineClamped ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 200px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Very negative end line: grid-column: 1 / -100 + UIHTMLWidget* item = UIHTMLWidget::New(); + item->setParent( grid ); + item->setGridColumnStart( "1" ); + item->setGridColumnEnd( "-100" ); + + // Should not crash and should clamp to line 1 (start == end → span 1) + sceneNode->updateDirtyLayouts(); + + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + ASSERT_GT( items.size(), 0u ); + // Item should be placed (not stuck at 0,0) + EXPECT_GT( items[0].resolvedColumnEnd, 0 ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Empty grid (fixed bug: unsigned underflow on tracks.size()-1) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, emptyGridNoCrash ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "none" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // No children — should not crash with unsigned underflow + sceneNode->updateDirtyLayouts(); + EXPECT_TRUE( true ); // reached without crash + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Composite grid test: multiple columns, gaps, sizing, alignment +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, fullGridLayoutSmoke ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "repeat(3, 1fr)" ); + grid->setGridTemplateRows( "auto auto" ); + grid->setColumnGap( "10px" ); + grid->setRowGap( "8px" ); + grid->setPixelsSize( 600, 300 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + for ( int i = 0; i < 6; ++i ) { + UIHTMLWidget* child = UIHTMLWidget::New(); + child->setParent( grid ); + child->setPixelsSize( 50, 30 ); + child->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + } + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + const auto& cols = layouter->getColumns(); + + EXPECT_EQ( items.size(), 6u ); + EXPECT_GE( cols.size(), 3u ); // repeat(3, 1fr) should create at least 3 columns + + // All items placed + for ( const auto& item : items ) { + EXPECT_GT( item.resolvedRowStart, 0 ); + EXPECT_GT( item.resolvedColumnStart, 0 ); + } + + // No overlapping positions + for ( size_t a = 0; a < items.size(); ++a ) + for ( size_t b = a + 1; b < items.size(); ++b ) + EXPECT_FALSE( items[a].resolvedRowStart == items[b].resolvedRowStart && + items[a].resolvedColumnStart == items[b].resolvedColumnStart ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// Tests for FIXED bugs — previously TODO, now passing +// ───────────────────────────────────────────────────────────────────────────── + +// P1: Negative fr rejected +UTEST( GridParser, rejectNegativeFr ) { + GridTrackList list = GridTrackParser::parseTrackList( "-1fr" ); + EXPECT_FALSE( list.valid ); +} + +// P4: Auto-repeat zero-min tracks fills space +UTEST( GridContainer, autoRepeatZeroMinFillsContainer ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "repeat(auto-fill, minmax(0, 1fr))" ); + grid->setColumnGap( "10px" ); + grid->setPixelsSize( 1000, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& cols = layouter->getColumns(); + + // Zero-min auto-fill should expand to multiple columns, not just 1 + EXPECT_GT( cols.size(), 1u ); + + Engine::destroySingleton(); +} + +// PL1: Definite span on auto axis +UTEST( GridContainer, definiteColumnSpanAutoRow ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px 100px 100px" ); + grid->setGridTemplateRows( "50px 50px" ); + grid->setPixelsSize( 500, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // grid-column: 2 / span 2 (should span columns 2-3), grid-row: auto + UIHTMLWidget* item1 = UIHTMLWidget::New(); + item1->setParent( grid ); + item1->setGridColumnStart( "2" ); + item1->setGridColumnEnd( "span 2" ); + item1->setPixelsSize( 50, 30 ); + item1->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + UIHTMLWidget* item2 = UIHTMLWidget::New(); + item2->setParent( grid ); + item2->setPixelsSize( 50, 30 ); + item2->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + + ASSERT_GE( items.size(), 2u ); + // Item1 should span 2 columns + EXPECT_EQ( items[0].resolvedColumnEnd - items[0].resolvedColumnStart, 2 ); + // Item2 should NOT overlap with item1 + EXPECT_NE( items[0].resolvedColumnStart, items[1].resolvedColumnStart ); + + Engine::destroySingleton(); +} + +// PL2: Dense auto-placement fills holes +UTEST( GridContainer, denseAutoPlacement ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px 100px" ); + grid->setGridAutoFlowDense( true ); + grid->setPixelsSize( 300, 300 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Place item spanning entire first row + UIHTMLWidget* big = UIHTMLWidget::New(); + big->setParent( grid ); + big->setGridColumnStart( "1" ); + big->setGridColumnEnd( "3" ); // span both columns + big->setPixelsSize( 50, 30 ); + big->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + // Small items should fill the hole in row 1 col 1? No — big occupies both cols. + // The test validates dense mode doesn't crash on sparse/empty layout. + for ( int i = 0; i < 3; ++i ) { + UIHTMLWidget* small = UIHTMLWidget::New(); + small->setParent( grid ); + small->setPixelsSize( 30, 20 ); + small->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + } + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& items = layouter->getItems(); + EXPECT_EQ( items.size(), 4u ); + + Engine::destroySingleton(); +} + +// TS4: Flex distribution clamps to growth limit +UTEST( GridContainer, flexGrowthLimit ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + // minmax(0, 100px) with 1fr — should be clamped to at most 100px + grid->setGridTemplateColumns( "minmax(0, 100px) 1fr" ); + grid->setPixelsSize( 400, 200 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& cols = layouter->getColumns(); + ASSERT_GE( cols.size(), 2u ); + + // First column max is 100px even though it gets flex space + EXPECT_LE( cols[0].baseSize, 100.f + 1.f ); + + Engine::destroySingleton(); +} + +// TS7: grid-auto-rows/columns +UTEST( GridContainer, implicitTrackSizing ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "100px" ); + grid->setGridAutoRows( "80px" ); + grid->setPixelsSize( 500, 300 ); + grid->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + + for ( int i = 0; i < 3; ++i ) { + UIHTMLWidget* item = UIHTMLWidget::New(); + item->setParent( grid ); + item->setPixelsSize( 50, 30 ); + item->setLayoutSizePolicy( SizePolicy::Fixed, SizePolicy::Fixed ); + } + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + const auto& rows = layouter->getColumns(); // intentional: getColumns for rows check + + // Items placed in separate rows with 80px auto row height + (void)rows; // no crash + + Engine::destroySingleton(); +} + +// I1: computeIntrinsicWidths with auto-repeat +UTEST( GridContainer, intrinsicWidthAutoRepeat ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "Grid Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, + true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + + UIHTMLWidget* grid = UIHTMLWidget::New(); + grid->setParent( sceneNode->getRoot() ); + grid->setDisplay( CSSDisplay::Grid ); + grid->setGridTemplateColumns( "repeat(auto-fill, 100px)" ); + grid->setLayoutSizePolicy( SizePolicy::WrapContent, SizePolicy::WrapContent ); + + sceneNode->updateDirtyLayouts(); + auto* layouter = static_cast( grid->getLayouter() ); + Float minW = layouter->getMinIntrinsicWidth(); + Float maxW = layouter->getMaxIntrinsicWidth(); + + // Auto-repeat should produce non-zero intrinsic widths + EXPECT_GT( minW, 0.f ); + // Both min and max should be > 0 (fixed-length tracks have equal min/max) + EXPECT_GT( maxW, 0.f ); + + Engine::destroySingleton(); +} + +// ───────────────────────────────────────────────────────────────────────────── +// HTML fixture tests (moved from uihtml_tests.cpp) +// ───────────────────────────────────────────────────────────────────────────── + +UTEST( GridContainer, basicHTMLGrid ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "UIHTML Grid Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings() ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + sceneNode->loadLayoutFromString( + HTMLFormatter::HTMLtoXML( "
" + "
A
" + "
B
" + "
" ) ); + + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto gridEl = sceneNode->getRoot()->findByTag( "div" ); + ASSERT_TRUE( nullptr != gridEl ); + EXPECT_TRUE( gridEl->isType( UI_TYPE_HTML_WIDGET ) ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, downloadGridLayout ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "UIHTML Grid Download Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings() ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + sceneNode->loadLayoutFromString( HTMLFormatter::HTMLtoXML( + "" + "
" + "

Windows

" + "

Mac

" + "

Linux

" + "

Android

" + "

iOS

" + "
" ) ); + + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto gridEl = sceneNode->getRoot()->findByClass( "download-grid" ); + ASSERT_TRUE( nullptr != gridEl ); + ASSERT_TRUE( gridEl->isType( UI_TYPE_HTML_WIDGET ) ); + + UIHTMLWidget* gridWidget = gridEl->asType(); + auto* layouter = gridWidget->getLayouter(); + ASSERT_TRUE( nullptr != layouter ); + + auto* gridLayouter = static_cast( layouter ); + + const auto& cols = gridLayouter->getColumns(); + EXPECT_TRUE( cols.size() >= 2 ); + + const auto& items = gridLayouter->getItems(); + ASSERT_EQ( (size_t)5, items.size() ); + + Float gridW = gridWidget->getPixelsSize().getWidth(); + Float expectedCardW = ( gridW - 4.f * 10.f ) / 5.f; + Float tolerance = expectedCardW * 0.15f; + { + int col = 1; + for ( const auto& item : items ) { + Float cardW = item.widget->getPixelsSize().getWidth(); + EXPECT_NEAR( expectedCardW, cardW, tolerance ); + EXPECT_EQ( 1, item.resolvedRowStart ); + EXPECT_EQ( col, item.resolvedColumnStart ); + ++col; + } + } + + { + Float firstH = items[0].widget->getPixelsSize().getHeight(); + EXPECT_TRUE( firstH > 0 ); + for ( size_t i = 1; i < items.size(); ++i ) + EXPECT_NEAR( firstH, items[i].widget->getPixelsSize().getHeight(), 0.5f ); + } + + Engine::destroySingleton(); +} + +UTEST( GridContainer, gridTestFixturePlacesSpanningItems ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "UIHTML Grid Fixture Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings() ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + std::string htmlContent; + ASSERT_TRUE( FileSystem::fileGet( "assets/html/grid_test.html", htmlContent ) ); + sceneNode->loadLayoutFromString( EE::UI::Tools::HTMLFormatter::HTMLtoXML( htmlContent ) ); + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto* wrapperNode = sceneNode->getRoot()->findByClass( "wrapper" ); + ASSERT_TRUE( nullptr != wrapperNode ); + ASSERT_TRUE( wrapperNode->isWidget() ); + + auto* one = sceneNode->getRoot()->findByClass( "one" ); + auto* two = sceneNode->getRoot()->findByClass( "two" ); + auto* three = sceneNode->getRoot()->findByClass( "three" ); + auto* four = sceneNode->getRoot()->findByClass( "four" ); + auto* five = sceneNode->getRoot()->findByClass( "five" ); + auto* six = sceneNode->getRoot()->findByClass( "six" ); + ASSERT_TRUE( nullptr != one ); + ASSERT_TRUE( nullptr != two ); + ASSERT_TRUE( nullptr != three ); + ASSERT_TRUE( nullptr != four ); + ASSERT_TRUE( nullptr != five ); + ASSERT_TRUE( nullptr != six ); + ASSERT_TRUE( one->isWidget() ); + ASSERT_TRUE( two->isWidget() ); + ASSERT_TRUE( three->isWidget() ); + ASSERT_TRUE( four->isWidget() ); + ASSERT_TRUE( five->isWidget() ); + ASSERT_TRUE( six->isWidget() ); + + auto* oneWidget = one->asType(); + auto* twoWidget = two->asType(); + auto* threeWidget = three->asType(); + auto* fourWidget = four->asType(); + auto* fiveWidget = five->asType(); + auto* sixWidget = six->asType(); + + Float wrapperW = wrapperNode->asType()->getPixelsSize().getWidth(); + EXPECT_GT( wrapperW, 900.f ); + EXPECT_LT( wrapperW, 950.f ); + + EXPECT_GT( oneWidget->getPixelsSize().getWidth(), 600.f ); + EXPECT_GT( twoWidget->getPixelsSize().getWidth(), 600.f ); + EXPECT_GT( threeWidget->getPixelsSize().getWidth(), 290.f ); + EXPECT_GT( fourWidget->getPixelsSize().getWidth(), 290.f ); + EXPECT_GT( fiveWidget->getPixelsSize().getWidth(), 290.f ); + EXPECT_GT( sixWidget->getPixelsSize().getWidth(), 290.f ); + + EXPECT_GT( oneWidget->getPixelsSize().getHeight(), 95.f ); + EXPECT_GT( twoWidget->getPixelsSize().getHeight(), 200.f ); + EXPECT_GT( threeWidget->getPixelsSize().getHeight(), 300.f ); + EXPECT_GT( fourWidget->getPixelsSize().getHeight(), 95.f ); + EXPECT_GT( fiveWidget->getPixelsSize().getHeight(), 95.f ); + EXPECT_GT( sixWidget->getPixelsSize().getHeight(), 95.f ); + + EXPECT_NEAR( oneWidget->getPixelsPosition().y, twoWidget->getPixelsPosition().y, 1.f ); + EXPECT_GT( twoWidget->getPixelsPosition().x, oneWidget->getPixelsPosition().x + 300.f ); + EXPECT_GT( threeWidget->getPixelsPosition().y, oneWidget->getPixelsPosition().y + 95.f ); + EXPECT_GT( fourWidget->getPixelsPosition().y, twoWidget->getPixelsPosition().y + 200.f ); + EXPECT_NEAR( fiveWidget->getPixelsPosition().y, sixWidget->getPixelsPosition().y, 1.f ); + EXPECT_GT( sixWidget->getPixelsPosition().x, fiveWidget->getPixelsPosition().x + 300.f ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, gridSpanItemsKeepSaneHeightAndDrawText ) { + auto* win = Engine::instance()->createWindow( + WindowSettings( 1024, 650, "UIHTML Grid Span Text Test", WindowStyle::Default, + WindowBackend::Default, 32, {}, 1, false, true ), + ContextSettings() ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + std::string htmlContent; + ASSERT_TRUE( FileSystem::fileGet( "assets/html/grid_size_miscalculation.html", htmlContent ) ); + sceneNode->loadLayoutFromString( EE::UI::Tools::HTMLFormatter::HTMLtoXML( htmlContent ) ); + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto* headerBox = sceneNode->getRoot()->findByClass( "header-box" ); + ASSERT_TRUE( nullptr != headerBox ); + ASSERT_TRUE( headerBox->isWidget() ); + + auto rows = headerBox->findAllByClass( "hb-row" ); + auto keys = headerBox->findAllByClass( "hb-k" ); + auto values = headerBox->findAllByClass( "hb-v" ); + ASSERT_EQ( rows.size(), 3u ); + ASSERT_EQ( keys.size(), 3u ); + ASSERT_EQ( values.size(), 3u ); + + for ( auto* row : rows ) { + ASSERT_TRUE( row->isWidget() ); + ASSERT_TRUE( row->isType( UI_TYPE_RICHTEXT ) ); + EXPECT_GT( row->getPixelsSize().getHeight(), 10.f ); + EXPECT_LT( row->getPixelsSize().getHeight(), 60.f ); + } + + for ( auto* span : keys ) { + ASSERT_TRUE( span->isType( UI_TYPE_TEXTSPAN ) ); + auto* richText = span->asType()->getRichTextPtr(); + ASSERT_TRUE( richText != nullptr ); + EXPECT_EQ( richText->getLines().size(), 1u ); + EXPECT_GT( span->getPixelsSize().getHeight(), 10.f ); + EXPECT_LT( span->getPixelsSize().getHeight(), 60.f ); + } + + for ( auto* span : values ) { + ASSERT_TRUE( span->isType( UI_TYPE_TEXTSPAN ) ); + auto* richText = span->asType()->getRichTextPtr(); + ASSERT_TRUE( richText != nullptr ); + EXPECT_GE( richText->getLines().size(), 1u ); + EXPECT_GT( span->getPixelsSize().getHeight(), 10.f ); + EXPECT_LT( span->getPixelsSize().getHeight(), 60.f ); + } + + EXPECT_GT( headerBox->asType()->getPixelsSize().getHeight(), 60.f ); + EXPECT_LT( headerBox->asType()->getPixelsSize().getHeight(), 160.f ); + + win->setClearColor( Color( "#0c1520" ) ); + win->clear(); + SceneManager::instance()->draw(); + win->display(); + + Image image = win->getFrontBufferImage(); + size_t drawnTextPixels = 0; + for ( auto* span : values ) { + Rectf rect = span->getScreenRect(); + drawnTextPixels += countBrightPixelsInRect( image, rect ); + rect.Top = image.getHeight() - span->getScreenRect().Bottom; + rect.Bottom = image.getHeight() - span->getScreenRect().Top; + drawnTextPixels += countBrightPixelsInRect( image, rect ); + } + EXPECT_GT( drawnTextPixels, 20u ); + EXPECT_LT( drawnTextPixels, 10000u ); + + Engine::destroySingleton(); +} + +UTEST( GridContainer, newsblurReducedGrid ) { + Engine::instance()->createWindow( WindowSettings( 1024, 650, "UIHTML Grid NewsBlur Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings() ); + init_grid_test(); + UISceneNode* sceneNode = SceneManager::instance()->getUISceneNode(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + std::string htmlContent; + ASSERT_TRUE( FileSystem::fileGet( "assets/html/grid_newsblur_reduced.html", htmlContent ) ); + sceneNode->loadLayoutFromString( EE::UI::Tools::HTMLFormatter::HTMLtoXML( htmlContent ) ); + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto* gridEl = sceneNode->getRoot()->findByClass( "NB-inner" ); + ASSERT_TRUE( nullptr != gridEl ); + ASSERT_TRUE( gridEl->isWidget() ); + + Float gridW = gridEl->getPixelsSize().getWidth(); + Float gridH = gridEl->getPixelsSize().getHeight(); + EXPECT_GT( gridW, 100.f ); + EXPECT_GT( gridH, 100.f ); + + // Verify NB-feature-group items aren't overexpanded + auto* fg = sceneNode->getRoot()->findByClass( "NB-feature-group" ); + ASSERT_TRUE( nullptr != fg ); + Float fgH = fg->getPixelsSize().getHeight(); + EXPECT_GT( fgH, 100.f ); + EXPECT_LT( fgH, 2000.f ); + + auto* fgiText = sceneNode->getRoot()->findByClass( "NB-fgi-text" ); + ASSERT_TRUE( nullptr != fgiText ); + Float textW = fgiText->getPixelsSize().getWidth(); + EXPECT_GT( textW, 150.f ); + + Engine::destroySingleton(); +} diff --git a/src/tests/unit_tests/uihtml_tests.cpp b/src/tests/unit_tests/uihtml_tests.cpp index 87b93692c..8e05ffcea 100644 --- a/src/tests/unit_tests/uihtml_tests.cpp +++ b/src/tests/unit_tests/uihtml_tests.cpp @@ -215,6 +215,7 @@ UTEST( UIHTML, redditOldThreadWebViewSmoke ) { FileSystem::changeWorkingDirectory( Sys::getProcessPath() ); if ( !FileSystem::fileExists( "assets/html/reddit_old_thread_files/reddit.ETA_etA2z5U.css" ) ) { + Engine::destroySingleton(); UTEST_SKIP( "old Reddit fixture CSS asset is not readable" ); } @@ -3619,6 +3620,32 @@ UTEST( UIHTML, BlockSizeInfDoesNotHang ) { Engine::destroySingleton(); } +UTEST( UIHTML, KittyHomeSmallDoesNotHang ) { + Engine::instance()->createWindow( WindowSettings( 1024, 768, "Kitty Home Small Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + + UISceneNode* sceneNode = init_test_inline_block(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + std::string html; + FileSystem::fileGet( "assets/html/kitty_home_small.html", html ); + ASSERT_FALSE( html.empty() ); + sceneNode->loadLayoutFromString( HTMLFormatter::HTMLtoXML( html ) ); + + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto body = sceneNode->getRoot()->findByTag( "body" ); + ASSERT_TRUE( body != nullptr ); + auto bodyWidget = body->asType(); + EXPECT_GT( bodyWidget->getPixelsSize().getWidth(), 0.f ); + EXPECT_GT( bodyWidget->getPixelsSize().getHeight(), 0.f ); + + Engine::destroySingleton(); +} + UTEST( UIHTML, FlexFormLayout ) { Engine::instance()->createWindow( WindowSettings( 1024, 653, "Flex Form Layout Test", WindowStyle::Default, WindowBackend::Default, @@ -3655,6 +3682,13 @@ UTEST( UIHTML, FlexFormLayout ) { Float inputRight = inputWidget->getPixelsPosition().x + inputWidget->getPixelsSize().getWidth(); EXPECT_GT( buttonWidget->getPixelsPosition().x, inputRight - 1.f ); + auto* buttonRichText = buttonWidget->isType( UI_TYPE_RICHTEXT ) + ? buttonWidget->asType()->getRichTextPtr() + : nullptr; + ASSERT_TRUE( buttonRichText != nullptr ); + buttonRichText->updateLayout(); + EXPECT_EQ( buttonRichText->getLines().size(), 1u ); + Engine::destroySingleton(); } @@ -3756,6 +3790,19 @@ UTEST( UIHTML, FlexMediaQueriesLayout ) { EXPECT_GT( essayNavLinkWidget->getPixelsSize().getHeight(), labelWidget->getPixelsSize().getHeight() + titleWidget->getPixelsSize().getHeight() - 1.f ); + + auto* labelRichText = essayLabel->isType( UI_TYPE_TEXTSPAN ) + ? essayLabel->asType()->getRichTextPtr() + : nullptr; + auto* titleRichText = essayTitle->isType( UI_TYPE_TEXTSPAN ) + ? essayTitle->asType()->getRichTextPtr() + : nullptr; + ASSERT_TRUE( labelRichText != nullptr ); + ASSERT_TRUE( titleRichText != nullptr ); + labelRichText->updateLayout(); + titleRichText->updateLayout(); + EXPECT_EQ( labelRichText->getLines().size(), 1u ); + EXPECT_EQ( titleRichText->getLines().size(), 1u ); } Engine::destroySingleton(); @@ -3799,6 +3846,43 @@ UTEST( UIHTML, FlexAnchorInFlexNavVisible ) { Engine::destroySingleton(); } +UTEST( UIHTML, FlexTextSpanWrapContentUsesItemWidth ) { + Engine::instance()->createWindow( WindowSettings( 1280, 720, "Flex Text Span Width Test", + WindowStyle::Default, WindowBackend::Default, + 32, {}, 1, false, true ), + ContextSettings( false, 0, 0, GLv_default, true, false ) ); + + UISceneNode* sceneNode = init_test_inline_block(); + sceneNode->setURI( "file://" + Sys::getProcessPath() + "assets/html/" ); + + std::string html; + FileSystem::fileGet( "assets/html/newsblur_home_prices_small.html", html ); + sceneNode->loadLayoutFromString( HTMLFormatter::HTMLtoXML( html ) ); + + sceneNode->update( Seconds( 1 ) ); + sceneNode->updateDirtyLayouts(); + + auto priceAmount = sceneNode->getRoot()->findByClass( "NB-pricing-tier-price-amount" ); + ASSERT_TRUE( priceAmount != nullptr ); + ASSERT_TRUE( priceAmount->isType( UI_TYPE_TEXTSPAN ) ); + + auto* amountSpan = priceAmount->asType(); + auto* amountRichText = amountSpan->getRichTextPtr(); + ASSERT_TRUE( amountRichText != nullptr ); + amountRichText->updateLayout(); + + const auto& lines = amountRichText->getLines(); + ASSERT_EQ( lines.size(), 1u ); + ASSERT_EQ( lines.front().spans.size(), 1u ); + ASSERT_EQ( lines.front().spans.front().type, RichText::RenderSpan::Type::Text ); + ASSERT_TRUE( lines.front().spans.front().text != nullptr ); + EXPECT_STRINGEQ( lines.front().spans.front().text->getString(), "$36" ); + EXPECT_NEAR( lines.front().spans.front().position.x, 0.f, 1.f ); + EXPECT_NEAR( amountSpan->getPixelsSize().getWidth(), lines.front().spans.front().size.x, 2.f ); + + Engine::destroySingleton(); +} + UTEST( UIHTML, FlexLiItemsWrapContentWidth ) { Engine::instance()->createWindow( WindowSettings( 1024, 768, "Flex LI Width Test", WindowStyle::Default, WindowBackend::Default,