Skip to content

feat: added per-corner control for spacing and border-radius - #666

Merged
surajshetty3416 merged 31 commits into
frappe:developfrom
stravo1:border-radius-corner-control
Jul 17, 2026
Merged

feat: added per-corner control for spacing and border-radius#666
surajshetty3416 merged 31 commits into
frappe:developfrom
stravo1:border-radius-corner-control

Conversation

@stravo1

@stravo1 stravo1 commented Jul 12, 2026

Copy link
Copy Markdown
Member
Screen.Recording.2026-07-15.at.5.42.05.PM.mp4

Summary

  • Added reusable split/uniform inputs for spacing and border-radius controls.
  • Added default-unit normalization while keeping default units hidden in the UI.
  • Added label dragging to adjust individual split values.
  • Added overflow fades on Input.
  • Improved border-radius preview sizing and scaling.

@stravo1
stravo1 requested a review from surajshetty3416 July 12, 2026 06:11
@codecov

codecov Bot commented Jul 12, 2026

Copy link
Copy Markdown

Codecov Report

✅ All modified and coverable lines are covered by tests.
✅ Project coverage is 56.54%. Comparing base (5fa6ca8) to head (bd35e7d).
⚠️ Report is 1 commits behind head on develop.

Additional details and impacted files
@@           Coverage Diff            @@
##           develop     #666   +/-   ##
========================================
  Coverage    56.54%   56.54%           
========================================
  Files           34       34           
  Lines         4119     4119           
========================================
  Hits          2329     2329           
  Misses        1790     1790           

☔ View full report in Codecov by Harness.
📢 Have feedback on the report? Share it here.

🚀 New features to boost your workflow:
  • ❄️ Test Analytics: Detect flaky tests, report on failures, and find test suite problems.
  • 📦 JS Bundle Analysis: Save yourself from yourself by tracking and limiting bundle sizes in JS merges.

@greptile-apps

greptile-apps Bot commented Jul 12, 2026

Copy link
Copy Markdown
Contributor

Confidence Score: 4/5

Safe to merge after fixing the null-coalescing gap in SpacingControl.readValue and the setUniformValue early-return that prevents closing the split panel.

SpacingControl.readValue calls String(getBaseValue()) without a null guard — when no margin/padding is set the block returns null and the literal string "null" appears in the input. The setUniformValue guard in SplitModeInput also exits early when the typed value equals the displayed value, leaving the split panel open with no way to close it by typing.

frontend/src/components/SpacingControl.vue (readValue null guard) and frontend/src/components/Controls/SplitModeInput.vue (setUniformValue early-return logic)

Reviews (12): Last reviewed commit: "fix: reset split mode when block selecti..." | Re-trigger Greptile

Comment thread frontend/src/components/BorderRadiusControl.vue Outdated
stravo1 and others added 5 commits July 15, 2026 12:39
when only numbers are used then we attach the default unit in the backend, we do not show the unit in the input box
SpacingControl and BorderRadiusControl were near-identical copies with
their own CSS shorthand parsing and split/link state. Extract the shared
pieces so each component only declares how it reads/writes its value:

- Add expandBoxShorthand() to cssUtils, replacing the three copies of the
  1/2/3/4-value box expansion (spacing, radius, SplitModeInput display).
- Add useSplitBoxControl composable holding the linked/split state, active
  variant, value sync and combine/normalize handlers.
- Add useInputOverflow composable for the shared scrollWidth overflow-fade
  check duplicated in Input and Autocomplete.

Also drops dead state-selection code in BorderRadiusControl and routes its
uniform edits through setModelValue, so clearing/setting the single radius
now clips overflow and syncs corners like the split mode already did.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Comment thread frontend/src/utils/useSplitBoxControl.ts Outdated
Comment thread frontend/src/components/SpacingControl.vue Outdated
stravo1 and others added 5 commits July 15, 2026 18:04
Dragging a single padding/margin handle sets only that side with no
shorthand base, so unset sides fell back to an empty base and produced
malformed shorthands (e.g. "5px  10px") that the split input misread as
a two-value shorthand. Fill unset sides with 0 when reconstructing the
multi-value shorthand.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Comment thread frontend/src/components/BlockPropertySections/StyleSection.ts
@stravo1 stravo1 changed the title feat: added per-corner border radius control feat: added per-corner control for spacing and border-radius Jul 15, 2026
Comment thread frontend/src/components/Controls/SplitModeInput.vue
stravo1 and others added 8 commits July 16, 2026 16:03
Replaces the required `labels` array with `splits: number | (string | Split)[]`,
so a split count can be defined without labels. The array length is now the only
source of truth for the count, and per-split `attrs` merge over the shared
`inputAttrs` — which drops the `(index) => attrs` function form.

Labels remain the slider handles, so `enableSlider` is inert when splits are
defined by count alone.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Comment thread frontend/src/components/SpacingControl.vue
Comment thread frontend/src/components/SpacingControl.vue
@surajshetty3416
surajshetty3416 merged commit ea6eaa1 into frappe:develop Jul 17, 2026
10 of 11 checks passed
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

2 participants