Only allow numbers for input field


I have an input field (inside a custom property panel) and want to allow only numbers. Can I somehow validate or set the data type to float so that only numbers and no strings are allowed for the input?

I got a CustomPropertiesProvider.js:

export default function CustomPropertiesProvider(propertiesPanel, translate) {
    return function(groups) {
    function createCustomProperty(element, translate) {
    return {
        id: 'customProp',
        label: translate('Custom Property'),
        entries: Props(element)

as well as a Props.js:

export default function(element, propsType) {
    return [
            id: 'customProp',
            element: element,
            component: Props,
            isEdited: isTextFieldEntryEdited

export function Props(props) {
    const {element, id} = props;

    const modeling = useService('modeling');
    const translate = useService('translate');
    const debounce = useService('debounceInput');

    const getValue = () => {
        return customPropValue;

    const setValue = function(value) {
        return modeling.updateProperties(element, {
            customPropName: name,
            customPropValue: value

    return <TextFieldEntry
        description={translate('Add a value to the property')}
        label={translate('Label for Property)}

Can you tell me where I have to add the validation / set the data type so only numbers are allowed for the input field?

Thanks in advance!

1 Like