Support linearGradient/radialGradient when using fillStyle

[Holybasil]

Currently, we can only pass solid colors, but it would be great to have the ability to apply gradient colors directly to paths when transforming them on the canvas.

const gradient = ctx.createLinearGradient(x1, y1, x2, y2);
gradient.addColorStop(0, 'red');
gradient.addColorStop(1, 'blue');

ctx.fillStyle = gradient;

At present, #80 (comment) works for me.

[shibozhou]

Hello,

The simplest approach would be to add a customFill property that gives you direct control over the fill style:

confetti({
  shapes: [myPath],
  customFill: (context, fetti, x1, y1, x2, y2) => {
    const gradient = context.createLinearGradient(x1, y1, x2, y2);
    gradient.addColorStop(0, 'red');
    gradient.addColorStop(1, 'blue');
    return gradient;
  }
});

Alternatively, add explicit gradient support:

confetti({
  colorType: 'linearGradient',
  colors: [
    { stop: 0, color: '#ff0000' },
    { stop: 1, color: '#0000ff' }
  ],
  gradientAngle: 45 //  optional
});

I'd happy to create a PR if there's interest.