Dogfalo/materialize · error · Error

noUiSlider: 'padding' option is only supported on linear sli

Error message

noUiSlider: 'padding' option is only supported on linear sliders.

What it means

Thrown by testPadding when Spectrum.getMargin returns false, i.e. the range has more than two points and is non-linear. padding is only defined on a single linear segment, so a stepped scale cannot honor it.

Source

Thrown at extras/noUiSlider/nouislider.js:637

        if ( !parsed.limit || parsed.handles < 2 ) {
            throw new Error("noUiSlider: 'limit' option is only supported on linear sliders with 2 or more handles.");
        }
    }

    function testPadding ( parsed, entry ) {

        if ( !isNumeric(entry) ){
            throw new Error("noUiSlider: 'padding' option must be numeric.");
        }

        if ( entry === 0 ) {
            return;
        }

        parsed.padding = parsed.spectrum.getMargin(entry);

        if ( !parsed.padding ) {
            throw new Error("noUiSlider: 'padding' option is only supported on linear sliders.");
        }

        if ( parsed.padding < 0 ) {
            throw new Error("noUiSlider: 'padding' option must be a positive number.");
        }

        if ( parsed.padding >= 50 ) {
            throw new Error("noUiSlider: 'padding' option must be less than half the range.");
        }
    }

    function testDirection ( parsed, entry ) {

        // Set direction as a numerical value for easy parsing.
        // Invert connection for RTL sliders, so that the proper
        // handles get the connect/background classes.
        switch ( entry ) {
            case 'ltr':

View on GitHub (pinned to 824e78248b)

Solutions

Remove padding on non-linear ranges.
Use a linear range: { min, max } if padding is required.
Approximate the effect by adjusting min/max outward.

Example fix

// before
range: { min: 0, '50%': 50, max: 100 }, padding: 10
// after
range: { min: 0, max: 100 }, padding: 10

Defensive patterns

Strategy: validation

Validate before calling

function isLinearRange(range) { return Object.keys(range).length === 2 && 'min' in range && 'max' in range; }
if (opts.padding != null && !isLinearRange(opts.range)) {
  throw new Error('padding requires a linear range ({ min, max } only)');
}

Try / catch

try { noUiSlider.create(el, opts); }
catch (e) { if (/padding' option is only supported on linear/.test(e.message)) { delete opts.padding; /* retry */ } else throw e; }

Prevention

Keep padding exclusive to linear-range sliders.
When you add an intermediate stop, drop padding (and margin/limit).
Adjust min/max outward to approximate padding on non-linear scales.

When it happens

Trigger: range: { min: 0, '50%': 50, max: 100 } combined with padding: 10.

Common situations: Adding intermediate stops to the range while leaving a padding config in place, or reusing a config block across linear and non-linear sliders.

Related errors

AI-assisted analysis of Dogfalo/materialize@824e78248b (2026-08-13). Data as JSON: /api/errors/6bb17a91c3809f1d. Report an issue: GitHub.