2024-04-12 09:52:36 -05:00
|
|
|
import { rgbToHex } from '@plugin/utils';
|
2024-04-15 02:48:03 -05:00
|
|
|
import { calculateLinearGradient } from '@plugin/utils/calculateLinearGradient';
|
2024-04-12 09:52:36 -05:00
|
|
|
|
|
|
|
import { Fill } from '@ui/lib/types/utils/fill';
|
2024-04-08 10:50:01 -05:00
|
|
|
|
|
|
|
export const translateGradientLinearFill = (
|
2024-04-10 06:43:44 -05:00
|
|
|
fill: GradientPaint,
|
|
|
|
width: number,
|
|
|
|
height: number
|
|
|
|
): Fill => {
|
2024-04-15 02:48:03 -05:00
|
|
|
const points = calculateLinearGradient(width, height, fill.gradientTransform);
|
2024-04-12 06:55:42 -05:00
|
|
|
|
2024-04-08 10:50:01 -05:00
|
|
|
return {
|
|
|
|
fillColorGradient: {
|
2024-04-12 06:55:42 -05:00
|
|
|
type: 'linear',
|
2024-04-10 06:43:44 -05:00
|
|
|
startX: points.start[0] / width,
|
|
|
|
startY: points.start[1] / height,
|
|
|
|
endX: points.end[0] / width,
|
|
|
|
endY: points.end[1] / height,
|
2024-04-08 10:50:01 -05:00
|
|
|
width: 1,
|
|
|
|
stops: [
|
|
|
|
{
|
|
|
|
color: rgbToHex(fill.gradientStops[0].color),
|
|
|
|
offset: fill.gradientStops[0].position,
|
|
|
|
opacity: fill.gradientStops[0].color.a * (fill.opacity ?? 1)
|
|
|
|
},
|
|
|
|
{
|
|
|
|
color: rgbToHex(fill.gradientStops[1].color),
|
|
|
|
offset: fill.gradientStops[1].position,
|
|
|
|
opacity: fill.gradientStops[1].color.a * (fill.opacity ?? 1)
|
|
|
|
}
|
|
|
|
]
|
|
|
|
},
|
|
|
|
fillOpacity: fill.visible === false ? 0 : undefined
|
|
|
|
};
|
|
|
|
};
|