feat: Add GapControl component with axis split mode - #699
Draft
SmrutiSawant wants to merge 8 commits into
Draft
Conversation
![greptile-apps[bot]](https://avatars.githubusercontent.com/in/867647?s=60&v=4){kind=small}
Contributor
Confidence Score: 3/5This PR is not safe to merge until mixed multi-selection edits preserve the untouched gap axis. The current split-edit path still converts the untouched mixed component to Files Needing Attention: frontend/src/components/GapControl.vue, frontend/src/utils/cssUtils.ts Reviews (3): Last reviewed commit: "Merge branch 'frappe:develop' into featu..." | Re-trigger Greptile |
Codecov Report✅ All modified and coverable lines are covered by tests. Additional details and impacted files@@ Coverage Diff @@
## develop #699 +/- ##
========================================
Coverage 57.59% 57.59%
========================================
Files 35 35
Lines 4271 4271
========================================
Hits 2460 2460
Misses 1811 1811 ☔ View full report in Codecov by Harness. 🚀 New features to boost your workflow:
|
stravo1
requested changes
Jul 28, 2026
SmrutiSawant
marked this pull request as draft
July 28, 2026 15:49
…horthand expansion
…ontrol SplitModeInput now owns its split mode. It turns split on when the sides differ, and the toggle only forces it on. Each variant renders its own instance, so a plain ref replaces the per-variant record that the useSplitControl composable held. This removes the composable and the getControlAttrs wiring from every caller. SplitPropertyControl wraps StylePropertyControl the same way StylePropertyControl wraps BasePropertyControl. It pins the component and the slider, and it defaults the shorthand converters, the input attributes and the unit normalizer. The normalizer now follows the first unit option instead of a hardcoded px. All current unit lists start with px, so the behavior does not change. The four split controls drop 8 to 9 repeated props each. Border radius falls from 43 lines to 28. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
expandShorthand loses three branches. The token filter now removes the "Mixed" and "unset" placeholders, so the whole-string guard is no longer necessary. The 2-value and 3-value cases differ only in the third slot, so one line covers both. collapseShorthand is the new counterpart. It walks the slots backwards and drops each trailing value that the value two slots before it implies. This works for 2 slots and for 4, so collapseBoxShorthand and collapseGapShorthand become one-liners over it. The gap version keeps the 0px fallback, because an unset axis would otherwise make the pair read as a single value. The JSDoc blocks give way to one comment per rule. A differential test over 13369 inputs shows no change in behavior. It covers both slot counts, all four-side and two-axis combinations, the placeholder values and calc() values. Also drop a stale second argument in useSpacingHandler. expandBoxShorthand takes one argument. The runtime ignored the extra one. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
stravo1
requested changes
Jul 31, 2026
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
2 participants
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 :
Adds a new GapControl.vue component that supports both uniform mode (gap) and split mode (row-gap and column-gap) for Flex and Grid layout panels.
Before :
Before.mp4
After :
After.mp4