html2canvas-pro 2.0.3 → 2.1.0

package/src/css/types/color-spaces/p3.ts

@@ -0,0 +1,92 @@
+/**
+ * Display-P3 related functions
+ */
+
+import { srgbLinear2rgb } from './srgb';
+import { multiplyMatrices, packXYZ } from '../color-utilities';
+
+/**
+ * Convert P3 Linear to xyz
+ *
+ * @param p3l
+ */
+export const p3LinearToXyz = (p3l: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            0.4865709486482162, 0.26566769316909306, 0.1982172852343625, 0.2289745640697488, 0.6917385218365064,
+            0.079286914093745, 0.0, 0.04511338185890264, 1.043944368900976
+        ],
+        p3l
+    );
+};
+/**
+ * Convert XYZ to P3 Linear
+ *
+ * @param xyz
+ */
+export const xyzToP3Linear = (xyz: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            2.493496911941425, -0.9313836179191239, -0.40271078445071684, -0.8294889695615747, 1.7626640603183463,
+            0.023624685841943577, 0.03584583024378447, -0.07617238926804182, 0.9568845240076872
+        ],
+        xyz
+    );
+};
+
+/**
+ * Convert P3 to P3 linear
+ *
+ * @param p3
+ */
+export const p32p3Linear = (p3: [number, number, number]): number[] => {
+    return p3.map((c: number) => {
+        const sign = c < 0 ? -1 : 1,
+            abs = c * sign;
+
+        if (abs <= 0.04045) {
+            return c / 12.92;
+        }
+
+        return sign * ((c + 0.055) / 1.055) ** 2.4 || 0;
+    });
+};
+
+/**
+ * Convert P3 Linear to P3
+ *
+ * @param p3l
+ */
+export const p3Linear2p3 = (p3l: [number, number, number]): number[] => {
+    return srgbLinear2rgb(p3l);
+};
+
+/**
+ * Convert P3 to XYZ
+ *
+ * @param args
+ */
+export const p3ToXYZ = (args: number[]): number[] => {
+    const p3_linear = p32p3Linear([args[0], args[1], args[2]]);
+    return p3LinearToXyz([p3_linear[0], p3_linear[1], p3_linear[2]]);
+};
+
+/**
+ * Convert XYZ to P3
+ *
+ * @param args
+ */
+export const p3FromXYZ = (args: [number, number, number, number]): [number, number, number, number] => {
+    const [r, g, b] = p3Linear2p3(xyzToP3Linear([args[0], args[1], args[2]]));
+    return [r, g, b, args[3]];
+};
+
+/**
+ * Convert P3 to SRGB and Pack
+ *
+ * @param args
+ */
+export const convertP3 = (args: number[]): number => {
+    const xyz = p3ToXYZ([args[0], args[1], args[2]]);
+    return packXYZ([xyz[0], xyz[1], xyz[2], args[3]]);
+};

package/src/css/types/color-spaces/pro-photo.ts

@@ -0,0 +1,87 @@
+/**
+ * Pro Photo related functions
+ */
+
+import { d50toD65, d65toD50, multiplyMatrices, packXYZ } from '../color-utilities';
+
+/**
+ * Convert linear-light display-p3 to XYZ D65
+ *
+ * @param p3
+ */
+export const proPhotoLinearToXyz = (p3: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            0.7977666449006423, 0.13518129740053308, 0.0313477341283922, 0.2880748288194013, 0.711835234241873,
+            0.00008993693872564, 0.0, 0.0, 0.8251046025104602
+        ],
+        p3
+    );
+};
+
+/**
+ * Convert XYZ D65 to linear-light display-p3
+ *
+ * @param xyz
+ */
+export const xyzToProPhotoLinear = (xyz: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            1.3457868816471583, -0.25557208737979464, -0.05110186497554526, -0.5446307051249019, 1.5082477428451468,
+            0.02052744743642139, 0.0, 0.0, 1.2119675456389452
+        ],
+        xyz
+    );
+};
+
+/**
+ * Convert Pro-Photo to Pro-Photo Linear
+ *
+ * @param p3
+ */
+export const proPhotoToProPhotoLinear = (p3: [number, number, number]): number[] => {
+    return p3.map((c: number) => {
+        return c < 16 / 512 ? c / 16 : c ** 1.8;
+    });
+};
+
+/**
+ * Convert Pro-Photo Linear to Pro-Photo
+ *
+ * @param p3
+ */
+export const proPhotoLinearToProPhoto = (p3: [number, number, number]): number[] => {
+    return p3.map((c: number) => {
+        return c > 1 / 512 ? c ** (1 / 1.8) : c * 16;
+    });
+};
+
+/**
+ * Convert Pro-Photo to XYZ
+ *
+ * @param args
+ */
+export const proPhotoToXYZ = (args: number[]): [number, number, number] => {
+    const prophoto_linear = proPhotoToProPhotoLinear([args[0], args[1], args[2]]);
+    return d50toD65(proPhotoLinearToXyz([prophoto_linear[0], prophoto_linear[1], prophoto_linear[2]]));
+};
+
+/**
+ * Convert XYZ to Pro-Photo
+ *
+ * @param args
+ */
+export const proPhotoFromXYZ = (args: [number, number, number, number]): [number, number, number, number] => {
+    const [r, g, b] = proPhotoLinearToProPhoto(xyzToProPhotoLinear(d65toD50([args[0], args[1], args[2]])));
+    return [r, g, b, args[3]];
+};
+
+/**
+ * Convert Pro-Photo to XYZ and Pack
+ *
+ * @param args
+ */
+export const convertProPhoto = (args: number[]): number => {
+    const xyz = proPhotoToXYZ([args[0], args[1], args[2]]);
+    return packXYZ([xyz[0], xyz[1], xyz[2], args[3]]);
+};

package/src/css/types/color-spaces/rec2020.ts

@@ -0,0 +1,90 @@
+/**
+ * REC2020 related functions
+ */
+
+import { multiplyMatrices, packXYZ } from '../color-utilities';
+
+const _a = 1.09929682680944;
+const _b = 0.018053968510807;
+
+/**
+ * Convert rec2020 to rec2020 linear
+ *
+ * @param rgb
+ */
+export const rec20202rec2020Linear = (rgb: [number, number, number]): number[] => {
+    return rgb.map(function (c) {
+        return c < _b * 4.5 ? c / 4.5 : Math.pow((c + _a - 1) / _a, 1 / 0.45);
+    });
+};
+
+/**
+ * Convert rec2020 linear to rec2020
+ *
+ * @param rgb
+ */
+export const rec2020Linear2rec2020 = (rgb: [number, number, number]): number[] => {
+    return rgb.map(function (c) {
+        return c >= _b ? _a * Math.pow(c, 0.45) - (_a - 1) : 4.5 * c;
+    });
+};
+
+/**
+ * Convert rec2020 linear to XYZ D65
+ *
+ * @param rec
+ */
+export const rec2020LinearToXyz = (rec: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            0.6369580483012914, 0.14461690358620832, 0.1688809751641721, 0.2627002120112671, 0.6779980715188708,
+            0.05930171646986196, 0.0, 0.028072693049087428, 1.060985057710791
+        ],
+        rec
+    );
+};
+
+/**
+ * Convert XYZ D65 to rec2020 linear
+ *
+ * @param xyz
+ */
+export const xyzToRec2020Linear = (xyz: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            1.716651187971268, -0.355670783776392, -0.25336628137366, -0.666684351832489, 1.616481236634939,
+            0.0157685458139111, 0.017639857445311, -0.042770613257809, 0.942103121235474
+        ],
+        xyz
+    );
+};
+
+/**
+ * Convert Rec2020 to XYZ
+ *
+ * @param args
+ */
+export const rec2020ToXYZ = (args: number[]): [number, number, number] => {
+    const rec2020_linear = rec20202rec2020Linear([args[0], args[1], args[2]]);
+    return rec2020LinearToXyz([rec2020_linear[0], rec2020_linear[1], rec2020_linear[2]]);
+};
+
+/**
+ * Convert XYZ to Rec2020
+ *
+ * @param args
+ */
+export const rec2020FromXYZ = (args: [number, number, number, number]): [number, number, number, number] => {
+    const [r, g, b] = rec2020Linear2rec2020(xyzToRec2020Linear([args[0], args[1], args[2]]));
+    return [r, g, b, args[3]];
+};
+
+/**
+ * Convert Rec2020 to SRGB and Pack
+ *
+ * @param args
+ */
+export const convertRec2020 = (args: number[]): number => {
+    const xyz = rec2020ToXYZ([args[0], args[1], args[2]]);
+    return packXYZ([xyz[0], xyz[1], xyz[2], args[3]]);
+};

package/src/css/types/color-spaces/srgb.ts

@@ -0,0 +1,87 @@
+/**
+ * SRGB related functions
+ */
+
+import { clamp, multiplyMatrices } from '../color-math';
+
+/**
+ * Convert XYZ to linear-light sRGB
+ *
+ * @param xyz
+ */
+export const xyz2rgbLinear = (xyz: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            3.2409699419045226, -1.537383177570094, -0.4986107602930034, -0.9692436362808796, 1.8759675015077202,
+            0.04155505740717559, 0.05563007969699366, -0.20397695888897652, 1.0569715142428786
+        ],
+        xyz
+    );
+};
+
+/**
+ * Convert XYZ to linear-light sRGB
+ *
+ * @param xyz
+ */
+export const rgbLinear2xyz = (xyz: [number, number, number]): [number, number, number] => {
+    return multiplyMatrices(
+        [
+            0.41239079926595934, 0.357584339383878, 0.1804807884018343, 0.21263900587151027, 0.715168678767756,
+            0.07219231536073371, 0.01933081871559182, 0.11919477979462598, 0.9505321522496607
+        ],
+        xyz
+    );
+};
+
+/**
+ * Convert sRGB to RGB
+ *
+ * @param rgb
+ */
+export const srgbLinear2rgb = (rgb: [number, number, number]): number[] => {
+    return rgb.map((c: number) => {
+        const sign = c < 0 ? -1 : 1,
+            abs = Math.abs(c);
+
+        return abs > 0.0031308 ? sign * (1.055 * abs ** (1 / 2.4) - 0.055) : 12.92 * c;
+    });
+};
+
+/**
+ * Convert RGB to sRGB
+ *
+ * @param rgb
+ */
+export const rgb2rgbLinear = (rgb: [number, number, number]): number[] => {
+    return rgb.map((c: number) => {
+        const sign = c < 0 ? -1 : 1,
+            abs = Math.abs(c);
+
+        return abs <= 0.04045 ? c / 12.92 : sign * ((abs + 0.055) / 1.055) ** 2.4;
+    });
+};
+
+/**
+ * XYZ to SRGB
+ *
+ * @param args
+ */
+export const srgbFromXYZ = (args: [number, number, number, number]): [number, number, number, number] => {
+    const [r, g, b] = srgbLinear2rgb(xyz2rgbLinear([args[0], args[1], args[2]]));
+    return [r, g, b, args[3]];
+};
+
+/**
+ * XYZ to SRGB-Linear
+ * @param args
+ */
+export const srgbLinearFromXYZ = (args: [number, number, number, number]): [number, number, number, number] => {
+    const [r, g, b] = xyz2rgbLinear([args[0], args[1], args[2]]);
+    return [
+        clamp(Math.round(r * 255), 0, 255),
+        clamp(Math.round(g * 255), 0, 255),
+        clamp(Math.round(b * 255), 0, 255),
+        args[3]
+    ];
+};