Makeswift Docs

New Slider control

The Slider control adds a draggable slider to the Makeswift builder, letting content teams set a number prop within a range you define instead of typing a raw value.

A Slider panel in the Makeswift builder with a draggable track and a numeric input — A Slider panel on a component to set a numeric value

Bounded range — min, max, and step constrain the values a content editor can set.
Optional numeric input — Set showInput to true to display an input field alongside the slider for precise values.
Plain number prop — Your component receives a number, or undefined when no value is set and no defaultValue is provided.

Example

import { Slider } from "@makeswift/runtime/controls";
runtime.registerComponent(Banner, {
  type: "banner",
  label: "Banner",
  props: {
    opacity: Slider({
      label: "Opacity",
      defaultValue: 100,
      min: 0,
      max: 100,
      step: 1,
    }),
  },
});

For full documentation, see the Slider control reference.