Conversation
- Add 'grid' and 'inline-grid' to display dropdown options - Implement GridVisual component showing grid structure (2×2 default) - Visual grid preview with Figma-style bordered cells - Color-coded by style source (local/remote/overwritten) - Accessible with keyboard navigation and ARIA labels - Performance optimized with useMemo for grid cells - Parse grid-template-columns/rows to show accurate track counts
…mprove alignment icons
…mprove alignment icons
…oning modes - Add Position mode toggle with Auto/Area/Manual options - Auto mode: Column/Row span inputs using SpanInput component - Area mode: Named grid area selection from parent grid - Manual mode: Grid line position inputs with validation - Automatic property conversion when switching between modes - Use useLocalValue for proper state management in Manual mode - Add Select min-width CSS to match trigger width
…f, justify-self, order
## Description 1. What is this PR about (link the issue and add a short description) ## Steps for reproduction 1. click button 2. expect xyz ## Code Review - [ ] hi @kof, I need you to do - conceptual review (architecture, feature-correctness) - detailed review (read every line) - test it on preview ## Before requesting a review - [ ] made a self-review - [ ] added inline comments where things may be not obvious (the "why", not "what") ## Before merging - [ ] tested locally and on preview environment (preview dev login: 0000) - [ ] updated [test cases](https://github.com/webstudio-is/webstudio/blob/main/apps/builder/docs/test-cases.md) document - [ ] added tests - [ ] if any new env variables are added, added them to `.env` file
|
The latest updates on your projects. Learn more about Vercel for GitHub.
|
The position tab (Auto/Area/Manual) now correctly reflects the actual grid positioning of each instance when switching between them, rather than always defaulting to 'Auto'. - Add derivePositionMode function to analyze CSS values - Detect manual mode when numeric line values exist - Detect area mode when named grid areas are used - Detect auto mode when values are 'auto' or span tuples - Add comprehensive tests for derivePositionMode
Remove the ref indirection and inline the swap logic directly in the onSort callback, matching the pattern used in repeated-style.tsx
Replace titleCase conversions with explicit singular/plural labels map for better clarity and i18n readiness
…arser - Add parseGridTemplateTrackList/serializeGridTemplateTrackList to @webstudio-is/css-data - Supports minmax(), fit-content(), repeat() expansion, line names - 23 comprehensive test cases - Rename components for clarity: - FlexVisual → FlexAlignment - GridVisual → GridGenerator + GridAlignment (split) - GridSizePicker → GridGenerator - Consolidate grid-areas.utils.ts into grid-areas.tsx - Improve state management in LayoutSectionGrid: - Single openPanel state prevents multiple panels open simultaneously - Fix CssValueListItem label truncation with overflow: hidden - Update imports in grid-child.tsx for new file structure
- Add parseMinmax/serializeMinmax functions to @webstudio-is/css-data - TrackItem editor shows checkbox to toggle between single value and min/max mode - When minmax is enabled, displays two inputs for min and max values - Auto-detects existing minmax() values and parses them into the inputs - Syncs state when track prop changes (supports undo/redo, external edits)
- Add checkGridTemplateSupport() to detect unsupported grid features - Support CSS variables (resolved via computedValue) - Show disabled state with tooltips for subgrid, masonry, line-names - Allow auto-fit/auto-fill in grid generator with DOM-based counts - Fix grid outlines to use computed style for track counts - Rename grid-overlay to grid-outlines for consistency - Add columnCount/rowCount to GridCellData for grid generator
- Add GridAxisMode type and getGridAxisMode() to analyze grid values - Add isImplicitGridMode() to detect modes needing DOM probing - Add isEditableGridMode() to detect modes editable in visual UI - Add getGridAxisLabel() for consistent label generation - Refactor grid-generator.tsx to use new pure functions - Refactor grid-settings.tsx to use new pure functions - Fix grid-areas.tsx to use parseGridTemplateTrackList - Update tests to match correct parser behavior
Show '?' for unknown track counts instead of blocking the UI. Users can still override with explicit grid values.
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Description
Steps for reproduction
Code Review
Before requesting a review
Before merging
.envfile