microsoft / design-to-code

A system of development tools, and utilities used à la carte or as a suite to build enterprise-grade websites and applications.
MIT License
24 stars 6 forks source link

[Feature] Add an input that increments a number contained in a string #32

Closed janechu closed 3 years ago

janechu commented 5 years ago

Add an input that has advanced keyboard control and treats numbers in strings with incrementing/decrementing numbers.

This input should be created as a configurable web component in fast-tooling which can take an arbitrary modifier that can transform a number during a change event. It should use the form-associated pattern.

An accompanying React component should be added in the fast-tooling-react/src/form as a css-unit.

The units that should work are the w3 recommended units for screen:

The component should use FormItemBase.

Expect to add:

The component should accept:

Example interaction:

  1. value is "10px"
  2. multipleOf is undefined
  3. user pushed the up arrow
  4. callback is fired with the value being "11px"

A component to take a cue from for the stying is the number-field.

If the unit is 1, Shift+upArrow is x10

Next steps

janechu commented 3 years ago

Closed as duplicate of #72