quasarframework/quasar · error · TypeError

Expected offset to be between -1 and 1

Error message

Expected offset to be between -1 and 1

What it means

changeAlpha(color, offset) requires offset to be defined and within [-1, 1]; anything else (undefined, out-of-range numbers, non-numbers) throws this TypeError. The offset is a relative alpha adjustment: the resulting alpha is clamped into the valid range after adding the offset.

Source

Thrown at ui/src/utils/colors/colors.js:267

    g2 = rgb2.g / 255,
    b2 = rgb2.b / 255,
    a2 = rgb2.a !== void 0 ? rgb2.a / 100 : 1,
    a = a1 + a2 * (1 - a1),
    r = Math.round(((r1 * a1 + r2 * a2 * (1 - a1)) / a) * 255),
    g = Math.round(((g1 * a1 + g2 * a2 * (1 - a1)) / a) * 255),
    b = Math.round(((b1 * a1 + b2 * a2 * (1 - a1)) / a) * 255)

  const ret = { r, g, b, a: Math.round(a * 100) }
  return typeof fgColor === 'string' ? rgbToHex(ret) : ret
}

export function changeAlpha(color, offset) {
  if (typeof color !== 'string') {
    throw new TypeError('Expected a string as color')
  }

  if (offset === void 0 || offset < -1 || offset > 1) {
    throw new TypeError('Expected offset to be between -1 and 1')
  }

  const { r, g, b, a } = textToRgb(color)
  const alpha = a !== void 0 ? a / 100 : 0

  return rgbToHex({
    r,
    g,
    b,
    a: Math.round(Math.min(1, Math.max(0, alpha + offset)) * 100)
  })
}

export function getPaletteColor(colorName) {
  if (typeof colorName !== 'string') {
    throw new TypeError('Expected a string as color')
  }

View on GitHub (pinned to 4841521b5f)

Solutions

1. Pass a number between -1 and 1, e.g. colors.changeAlpha('#ff0000', 0.5).
2. Convert a percentage: offset = percent / 100 (e.g. 50 -> 0.5).
3. Clamp computed offsets: offset = Math.min(1, Math.max(-1, computed)).
4. Always supply the second argument; it has no default.

Example fix

// before
const c = colors.changeAlpha('#ff0000', 50) // throws
// after
const c = colors.changeAlpha('#ff0000', 0.5)

const isValidOffset = (o) => typeof o === 'number' && o >= -1 && o <= 1
if (!isValidOffset(offset)) throw new Error('offset must be a number in [-1, 1]')

const isAlphaOffset = (o) => typeof o === 'number' && Number.isFinite(o) && o >= -1 && o <= 1

let result
try {
  result = colors.changeAlpha(color, offset)
} catch (err) {
  if (err instanceof TypeError && /between -1 and 1/.test(err.message)) {
    result = colors.changeAlpha(color, Math.min(1, Math.max(-1, offset ?? 0)))
  } else throw err
}

When it happens

Trigger: colors.changeAlpha('#ff0000') with no offset; colors.changeAlpha('#ff0000', 1.5) or -2; passing a percentage like 50 instead of 0.5; passing a string '0.5' (fails comparison logic / undefined check for other invalid values).

Common situations: Misreading the API as taking an absolute 0-100 or 0-1 alpha instead of a relative -1..1 delta; forgetting the second argument; computing the offset with a formula that can exceed 1.

Related errors

• Expected 3 numbers below 256 (and optionally one below 100)
• Expected a string or a {r, g, b[, a]} object as bgColor
• Expected a string
• Expected a string as color
• Expected a numeric percent

AI-assisted analysis of quasarframework/quasar@4841521b5f (2026-08-30). Data as JSON: /api/errors/f46cde806db65fc3. Report an issue: GitHub.