Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

fix(number-field): add support for scrubbing #4476

Open
wants to merge 4 commits into
base: main
Choose a base branch
from
Open

fix(number-field): add support for scrubbing #4476

wants to merge 4 commits into from
+229 −17

Conversation

Westbrook
Copy link
Contributor

Description

This had been bopping around in a branch for a long while thanks to the work of @bengfarrell and I wanted to get it into a PR in case people were interested in adopting it.

Allow click and drag on the input of a Number Field to scrub the value.

Related issue(s)

How has this been tested?

  • Test case 1
    1. Go here
    2. Click and drag across the input field to change the value

Types of changes

  • New feature (non-breaking change which adds functionality)

Checklist

  • I have signed the Adobe Open Source CLA.
  • My code follows the code style of this project.
  • If my change required a change to the documentation, I have updated the documentation in this pull request.
  • I have read the CONTRIBUTING document.
  • I have added tests to cover my changes.
  • All new and existing tests passed.

@Westbrook Westbrook requested a review from a team May 21, 2024 18:43
@Westbrook Westbrook force-pushed the number-field/scrubber branch from 5db4275 to a6280d7 Compare May 21, 2024 18:48
@github-actions GitHub Actions
Copy link

github-actions bot commented May 21, 2024 •
edited
Loading

Branch preview

Review the following VRT differences

When a visual regression test fails (or has previously failed while working on this branch), its results can be found in the following URLs:

If the changes are expected, update the current_golden_images_cache hash in the circleci config to accept the new images. Instructions are included in that file.
If the changes are unexpected, you can investigate the cause of the differences and update the code accordingly.

@github-actions GitHub Actions
Copy link

github-actions bot commented May 21, 2024 •
edited
Loading

Lighthouse scores

Category Latest (report) Main (report) Branch (report)
Performance 0.99 0.98 0.98
Accessibility 1 1 1
Best Practices 1 1 1
SEO 1 0.92 0.92
PWA 1 1 1
What is this?

Lighthouse scores comparing the documentation site built from the PR ("Branch") to that of the production documentation site ("Latest") and the build currently on main ("Main"). Higher scores are better, but note that the SEO scores on Netlify URLs are artifically constrained to 0.92.

Transfer Size

Category Latest Main Branch
Total 243.855 kB 230.917 kB 🏆 230.968 kB
Scripts 60.298 kB 54.216 kB 🏆 54.463 kB
Stylesheet 47.464 kB 42.117 kB 42.013 kB 🏆
Document 6.238 kB 5.491 kB 5.486 kB 🏆
Font 127.011 kB 126.745 kB 126.632 kB 🏆

Request Count

Category Latest Main Branch
Total 52 52 52
Scripts 41 41 41
Stylesheet 5 5 5
Document 1 1 1
Font 2 2 2

@Westbrook Westbrook force-pushed the number-field/scrubber branch from a6280d7 to f123cbe Compare May 21, 2024 19:00
@github-actions GitHub Actions
Copy link

github-actions bot commented May 21, 2024 •
edited
Loading

Tachometer results

Currently, no packages are changed by this PR...

@Westbrook Westbrook force-pushed the number-field/scrubber branch from f123cbe to 3034755 Compare May 22, 2024 11:36
@bengfarrell
fix(number-field): add support for scrubbing (#1535)
8fc67cc 
* feat(number-field): added features required for internal Adobe project
- scrubbable (drag left/right for increment decrementing)
- allow per pixel amount for scrubbing (defaults to using existing step)
- shift modifier step multiplier for fast keyboard increment/decrement

* feat(number-field): add shift modifier to multiply key input

* feat(number-field): put stepper buttons in shift modifier path

* fix(number-field): fix issue with PR where there are runtime errors when buttons are hidden

* fix(number-field): add property to indicate that the user is scrubbing

* fix(number-field): delay scrub input by 250ms in case user clicked/dragged a bit meaning to focus

* fix(number-field): issue with scrubbing off component lights up focus ring without having focus

* fix(number-field): issues with intermittent inner focus-visible and misfiring on negative distance
@Westbrook Westbrook force-pushed the number-field/scrubber branch from 3034755 to 8fc67cc Compare May 24, 2024 13:21
@changeset-bot changeset-bot
Copy link

changeset-bot bot commented Jan 7, 2025 •
edited
Loading

⚠️ No Changeset found

Latest commit: 370b99b

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

@coveralls
Copy link
Collaborator

coveralls commented Feb 26, 2025 •
edited
Loading

Pull Request Test Coverage Report for Build 13554524637

Details

  • 84 of 109 (77.06%) changed or added relevant lines in 1 file are covered.
  • No unchanged relevant lines lost coverage.
  • Overall coverage decreased (-0.06%) to 97.906%
Changes Missing Coverage Covered Lines Changed/Added Lines %
packages/number-field/src/NumberField.ts 84 109 77.06%
Totals Coverage Status
Change from base Build 13553587344: -0.06%
Covered Lines: 33741
Relevant Lines: 34268
💛 - Coveralls

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Reviewers
No reviews
Assignees
No one assigned
Labels
Component: Number Field enhancement New feature or request WIP
Projects
None yet
Milestone
No milestone
Development

Successfully merging this pull request may close these issues.

Scrubbable Numeric Input
6 participants
@Westbrook @coveralls @caseyisonit @bengfarrell @nikkimk @rubencarvalho