Presto

FloatWidget

Source
import { FloatWidget } from "@prestojs/ui-antd";
FloatWidget(props)
Source

Form widget for string values that renders as a InputNumber.

This is the default widget used for FloatField

Usage

See the widget guide for more details on how widgets work within a form.

Most usages of a widget are selected using getWidgetForField or by passing it to FormField or FormItem
More Details

Using FormField

<Form.Field
  field={ExampleModel.fields.exampleField}
  component={FloatWidget} 
/>
<Form.Field
  field={ExampleModel.fields.exampleField}
  render={widgetProps => <FloatWidget {...fieldProps} />}
/>

or to FormItem

<Form.Item
  field={ExampleModel.fields.exampleField}
  fieldProps={{ component: FloatWidget}}
/>
<Form.Item
  field={ExampleModel.fields.exampleField}
  fieldProps={{ render: widgetProps => <FloatWidget {...fieldProps} /> }}
/>

To use outside of a form where state is manually tracked:

function FloatWidgetExample() {
  const [value, setValue] = useState(null)
  return (
    <FloatNumberWidget
      input={{
        onChange(nextValue) {
          setValue(nextValue)
        },
        value,
      }}
    />
  )
}

Component Props:

PropTypeDescription
*
props
An object with the properties below
*props.inputInputProps

The input props for the widget. This is typically passed by the form (eg. Form when using @prestojs/final-form) but can be passed directly if used standalone.

props.refReact.RefObject
...any
Any properties from InputNumber except for these:
  • onChange
  • value

Examples

Basic Usage

Any extra props are passed through to InputNumber.