When using with zoom plugin, `clip: true` affect the labels on the edge

See this demo: https://codesandbox.io/s/chart-js-data-labels-plugin-clip-issue-mqkrgd?file=/src/App.tsx It use zoom and datalabels

When using with zoom, you have to set `clip: true` on datalabels, otherwise the label will overlap with the yAxis

But if did this, the first and the last bar label get cut.

Because it is beyond the chart area.

The [document](https://chartjs-plugin-datalabels.netlify.app/guide/positioning.html#clipping) tells me the `clip` is calling CanvasRenderingContext2D.clip(), so I then took a look at the [source code](https://github.com/chartjs/chartjs-plugin-datalabels/blob/master/src/label.js#L334-L343) here:
```
if (model.clip) {
area = model.area;
ctx.beginPath();
ctx.rect(
area.left,
area.top,
area.right - area.left,
area.bottom - area.top);
ctx.clip();
}
```
I guess maybe we can allow a paddingOffset to slightly extend the rect area, to let customer to adjust? like:
```
var paddingOffset = modal.paddingOffset;
if (model.clip) {
area = model.area;
ctx.beginPath();
ctx.rect(
area.left - paddingOffset,
area.top - paddingOffset,
area.right + paddingOffset * 2 - area.left,
area.bottom + paddingOffset * 2 - area.top);
ctx.clip();
}
```