Range Field

The range field stores a numeric value intended for a bounded slider-style input inside a repeater row.

Best For

• score dimensions
• comparison sliders
• weighted settings
• visual progress values

Schema Example

{ "name": "score", "label": "Score", "type": "range" }

Template Usage

{{#each ratings as="item"}}
  <div class="rating-bar">
    <span>{{ item.label }}</span>
    <strong>{{ item.score }}</strong>
  </div>
{{/each}}

Progress example:

{{#each metrics as="item"}}
  <div class="metric-row">
    <span>{{ item.label }}</span>
    <progress value="{{ item.score }}" max="100"></progress>
  </div>
{{/each}}

Use It When

Use range when repeated rows need a bounded numeric input rather than a free-form number.

Do Not Use It When

Do not use range when:

• the number has no natural min/max behavior
• the value is money, quantity, or another domain-specific number

Use number instead.

Technical Notes

• use range when the number is meaningful only inside a bounded scale
• keep the interpretation of the scale obvious in surrounding labels or UI
• prefer number when the value is a business quantity rather than a score-like dimension
• use it inside structured repeated rows where each item follows the same scoring contract

Related

• Repeater
• Number
• Color