Number Editors

Number input

A standard numeric input field that appears when no specific format is requested.

Activation Conditions

• "type": "number" or "type": "integer"

Number Select

Displays a dropdown select box populated with the values from the enum array. Ideal when users need to choose from predefined numeric options.

Activation Conditions

• "type": "number" or "type": "integer"
• "enum" array defined

Optional Properties

• "x-enumTitles" - Human-readable labels that replace the numeric values in the dropdown

Number Radios

Presents all available options as individual radio buttons in a vertical list, providing immediate visibility of all choices without interaction.

Activation Conditions

• "type": "number" or "type": "integer"
• "enum" array defined
• "x-format": "radios"

Optional Properties

• "x-enumTitles" - Descriptive labels shown next to each radio button

Inline Radio Buttons

Displays radio buttons horizontally for more compact layouts while maintaining the same functionality as the vertical radio list.

Activation Conditions

• "type": "number" or "type": "integer"
• "enum" array defined
• "x-format": "radios-inline"

Optional Properties

• "x-enumTitles" - Short labels that work well in horizontal layouts

Input Number Nullable

A standard numeric input field. When empty the instance value is null

Activation Conditions

• "type": ["null", "number"] or "type": ["null", "integer"]
• "x-nullable": true

Star Rating (Raty)

Interactive star rating control that converts numeric selection into visual feedback. Supports half-star increments and custom star elements.

Activation Conditions

• "type": "number" or "type": "integer"
• "x-format": "raty" property defined
• Raty.js library loaded (window.Raty)

Plugin Options

Options can be passed to the plugin via "x-raty" keyword

• "x-raty.half" - Enables selection of half-star values when true
• "x-raty.starType" - Defines HTML tag used for star elements (default: 'i')

Number IMask

Renders a masked text input using IMask.js.

Activation Conditions

• "type": "number"
• "x-format": "imask"
• IMask.js must be available (window.IMask)

Plugin Options

Options can be passed to the plugin via "x-imask" keyword