[number field] Can Number Field be used to evaluate equations?

[woodward54]

I'd like to make a Number Field that can also evaluate equations using math.js.

"5 + 20" -> "25"

"sqrt(16)" -> "4"

Is this possible with the current Number Field? I can't seem to find a way to let the input accept special characters. I'd also need to extend the parse function to attempt to evaluate with math.js before the base-ui parse function takes over.

[mj12albert]

I can't seem to find a way to let the input accept special characters.

Generally event handlers have a preventBaseUIHandler method that you can call to skip the component's internal logic and override it with your own:

<NumberField.Input
  onKeyDown={(event) => {
    event.preventBaseUIHandler();
    // your logic instead
  }}
/>

However for this case I'm not sure if this is possible because it may skip so much that it could affect other features

Can Number Field be used to evaluate equations?

This isn't really a use-case we considered for Numberfield 😅 are you making something like a spreadsheet app? @woodward54

[woodward54]

I'm working on a 3d web editor, I was hoping to have a rich numeric text box (similar to how the Unity editor does it). But it looks like I might need to make a custom input for this case. Itd be an awesome feature for base-ui if I could pass in my own custom "preparse" function as a prop to the Number Field, but not sure if that would conflict with the existing parse system.

[mj12albert]

a rich numeric text box (similar to how the Unity editor does it

My guess we would prefer to make an actual component for this rather than adding the functionality to NumberField 🤔