@gjsify/canvas2d-core 0.3.13 → 0.3.14

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (10) hide show
  1. package/lib/esm/cairo-utils.js +175 -156
  2. package/lib/esm/canvas-gradient.js +26 -21
  3. package/lib/esm/canvas-path.js +160 -103
  4. package/lib/esm/canvas-pattern.js +60 -55
  5. package/lib/esm/canvas-rendering-context-2d.js +969 -989
  6. package/lib/esm/canvas-state.js +35 -34
  7. package/lib/esm/color.js +259 -234
  8. package/lib/esm/image-data.js +24 -21
  9. package/lib/esm/index.js +5 -11
  10. package/package.json +10 -10
package/lib/esm/canvas-state.js CHANGED
@@ -1,39 +1,40 @@
1
1
  import { BLACK } from "./color.js";
2
+
3
+ //#region src/canvas-state.ts
2
4
  function createDefaultState() {
3
- return {
4
- fillStyle: "#000000",
5
- fillColor: { ...BLACK },
6
- strokeStyle: "#000000",
7
- strokeColor: { ...BLACK },
8
- lineWidth: 1,
9
- lineCap: "butt",
10
- lineJoin: "miter",
11
- miterLimit: 10,
12
- lineDash: [],
13
- lineDashOffset: 0,
14
- globalAlpha: 1,
15
- globalCompositeOperation: "source-over",
16
- shadowColor: "rgba(0, 0, 0, 0)",
17
- shadowBlur: 0,
18
- shadowOffsetX: 0,
19
- shadowOffsetY: 0,
20
- font: "10px sans-serif",
21
- textAlign: "start",
22
- textBaseline: "alphabetic",
23
- direction: "ltr",
24
- imageSmoothingEnabled: true,
25
- imageSmoothingQuality: "low"
26
- };
5
+ return {
6
+ fillStyle: "#000000",
7
+ fillColor: { ...BLACK },
8
+ strokeStyle: "#000000",
9
+ strokeColor: { ...BLACK },
10
+ lineWidth: 1,
11
+ lineCap: "butt",
12
+ lineJoin: "miter",
13
+ miterLimit: 10,
14
+ lineDash: [],
15
+ lineDashOffset: 0,
16
+ globalAlpha: 1,
17
+ globalCompositeOperation: "source-over",
18
+ shadowColor: "rgba(0, 0, 0, 0)",
19
+ shadowBlur: 0,
20
+ shadowOffsetX: 0,
21
+ shadowOffsetY: 0,
22
+ font: "10px sans-serif",
23
+ textAlign: "start",
24
+ textBaseline: "alphabetic",
25
+ direction: "ltr",
26
+ imageSmoothingEnabled: true,
27
+ imageSmoothingQuality: "low"
28
+ };
27
29
  }
28
30
  function cloneState(state) {
29
- return {
30
- ...state,
31
- fillColor: { ...state.fillColor },
32
- strokeColor: { ...state.strokeColor },
33
- lineDash: [...state.lineDash]
34
- };
31
+ return {
32
+ ...state,
33
+ fillColor: { ...state.fillColor },
34
+ strokeColor: { ...state.strokeColor },
35
+ lineDash: [...state.lineDash]
36
+ };
35
37
  }
36
- export {
37
- cloneState,
38
- createDefaultState
39
- };
38
+
39
+ //#endregion
40
+ export { cloneState, createDefaultState };
package/lib/esm/color.js CHANGED
@@ -1,247 +1,272 @@
1
+ //#region src/color.ts
1
2
  const NAMED_COLORS = {
2
- aliceblue: "#f0f8ff",
3
- antiquewhite: "#faebd7",
4
- aqua: "#00ffff",
5
- aquamarine: "#7fffd4",
6
- azure: "#f0ffff",
7
- beige: "#f5f5dc",
8
- bisque: "#ffe4c4",
9
- black: "#000000",
10
- blanchedalmond: "#ffebcd",
11
- blue: "#0000ff",
12
- blueviolet: "#8a2be2",
13
- brown: "#a52a2a",
14
- burlywood: "#deb887",
15
- cadetblue: "#5f9ea0",
16
- chartreuse: "#7fff00",
17
- chocolate: "#d2691e",
18
- coral: "#ff7f50",
19
- cornflowerblue: "#6495ed",
20
- cornsilk: "#fff8dc",
21
- crimson: "#dc143c",
22
- cyan: "#00ffff",
23
- darkblue: "#00008b",
24
- darkcyan: "#008b8b",
25
- darkgoldenrod: "#b8860b",
26
- darkgray: "#a9a9a9",
27
- darkgreen: "#006400",
28
- darkgrey: "#a9a9a9",
29
- darkkhaki: "#bdb76b",
30
- darkmagenta: "#8b008b",
31
- darkolivegreen: "#556b2f",
32
- darkorange: "#ff8c00",
33
- darkorchid: "#9932cc",
34
- darkred: "#8b0000",
35
- darksalmon: "#e9967a",
36
- darkseagreen: "#8fbc8f",
37
- darkslateblue: "#483d8b",
38
- darkslategray: "#2f4f4f",
39
- darkslategrey: "#2f4f4f",
40
- darkturquoise: "#00ced1",
41
- darkviolet: "#9400d3",
42
- deeppink: "#ff1493",
43
- deepskyblue: "#00bfff",
44
- dimgray: "#696969",
45
- dimgrey: "#696969",
46
- dodgerblue: "#1e90ff",
47
- firebrick: "#b22222",
48
- floralwhite: "#fffaf0",
49
- forestgreen: "#228b22",
50
- fuchsia: "#ff00ff",
51
- gainsboro: "#dcdcdc",
52
- ghostwhite: "#f8f8ff",
53
- gold: "#ffd700",
54
- goldenrod: "#daa520",
55
- gray: "#808080",
56
- green: "#008000",
57
- greenyellow: "#adff2f",
58
- grey: "#808080",
59
- honeydew: "#f0fff0",
60
- hotpink: "#ff69b4",
61
- indianred: "#cd5c5c",
62
- indigo: "#4b0082",
63
- ivory: "#fffff0",
64
- khaki: "#f0e68c",
65
- lavender: "#e6e6fa",
66
- lavenderblush: "#fff0f5",
67
- lawngreen: "#7cfc00",
68
- lemonchiffon: "#fffacd",
69
- lightblue: "#add8e6",
70
- lightcoral: "#f08080",
71
- lightcyan: "#e0ffff",
72
- lightgoldenrodyellow: "#fafad2",
73
- lightgray: "#d3d3d3",
74
- lightgreen: "#90ee90",
75
- lightgrey: "#d3d3d3",
76
- lightpink: "#ffb6c1",
77
- lightsalmon: "#ffa07a",
78
- lightseagreen: "#20b2aa",
79
- lightskyblue: "#87cefa",
80
- lightslategray: "#778899",
81
- lightslategrey: "#778899",
82
- lightsteelblue: "#b0c4de",
83
- lightyellow: "#ffffe0",
84
- lime: "#00ff00",
85
- limegreen: "#32cd32",
86
- linen: "#faf0e6",
87
- magenta: "#ff00ff",
88
- maroon: "#800000",
89
- mediumaquamarine: "#66cdaa",
90
- mediumblue: "#0000cd",
91
- mediumorchid: "#ba55d3",
92
- mediumpurple: "#9370db",
93
- mediumseagreen: "#3cb371",
94
- mediumslateblue: "#7b68ee",
95
- mediumspringgreen: "#00fa9a",
96
- mediumturquoise: "#48d1cc",
97
- mediumvioletred: "#c71585",
98
- midnightblue: "#191970",
99
- mintcream: "#f5fffa",
100
- mistyrose: "#ffe4e1",
101
- moccasin: "#ffe4b5",
102
- navajowhite: "#ffdead",
103
- navy: "#000080",
104
- oldlace: "#fdf5e6",
105
- olive: "#808000",
106
- olivedrab: "#6b8e23",
107
- orange: "#ffa500",
108
- orangered: "#ff4500",
109
- orchid: "#da70d6",
110
- palegoldenrod: "#eee8aa",
111
- palegreen: "#98fb98",
112
- paleturquoise: "#afeeee",
113
- palevioletred: "#db7093",
114
- papayawhip: "#ffefd5",
115
- peachpuff: "#ffdab9",
116
- peru: "#cd853f",
117
- pink: "#ffc0cb",
118
- plum: "#dda0dd",
119
- powderblue: "#b0e0e6",
120
- purple: "#800080",
121
- rebeccapurple: "#663399",
122
- red: "#ff0000",
123
- rosybrown: "#bc8f8f",
124
- royalblue: "#4169e1",
125
- saddlebrown: "#8b4513",
126
- salmon: "#fa8072",
127
- sandybrown: "#f4a460",
128
- seagreen: "#2e8b57",
129
- seashell: "#fff5ee",
130
- sienna: "#a0522d",
131
- silver: "#c0c0c0",
132
- skyblue: "#87ceeb",
133
- slateblue: "#6a5acd",
134
- slategray: "#708090",
135
- slategrey: "#708090",
136
- snow: "#fffafa",
137
- springgreen: "#00ff7f",
138
- steelblue: "#4682b4",
139
- tan: "#d2b48c",
140
- teal: "#008080",
141
- thistle: "#d8bfd8",
142
- tomato: "#ff6347",
143
- turquoise: "#40e0d0",
144
- violet: "#ee82ee",
145
- wheat: "#f5deb3",
146
- white: "#ffffff",
147
- whitesmoke: "#f5f5f5",
148
- yellow: "#ffff00",
149
- yellowgreen: "#9acd32",
150
- transparent: "#00000000"
3
+ aliceblue: "#f0f8ff",
4
+ antiquewhite: "#faebd7",
5
+ aqua: "#00ffff",
6
+ aquamarine: "#7fffd4",
7
+ azure: "#f0ffff",
8
+ beige: "#f5f5dc",
9
+ bisque: "#ffe4c4",
10
+ black: "#000000",
11
+ blanchedalmond: "#ffebcd",
12
+ blue: "#0000ff",
13
+ blueviolet: "#8a2be2",
14
+ brown: "#a52a2a",
15
+ burlywood: "#deb887",
16
+ cadetblue: "#5f9ea0",
17
+ chartreuse: "#7fff00",
18
+ chocolate: "#d2691e",
19
+ coral: "#ff7f50",
20
+ cornflowerblue: "#6495ed",
21
+ cornsilk: "#fff8dc",
22
+ crimson: "#dc143c",
23
+ cyan: "#00ffff",
24
+ darkblue: "#00008b",
25
+ darkcyan: "#008b8b",
26
+ darkgoldenrod: "#b8860b",
27
+ darkgray: "#a9a9a9",
28
+ darkgreen: "#006400",
29
+ darkgrey: "#a9a9a9",
30
+ darkkhaki: "#bdb76b",
31
+ darkmagenta: "#8b008b",
32
+ darkolivegreen: "#556b2f",
33
+ darkorange: "#ff8c00",
34
+ darkorchid: "#9932cc",
35
+ darkred: "#8b0000",
36
+ darksalmon: "#e9967a",
37
+ darkseagreen: "#8fbc8f",
38
+ darkslateblue: "#483d8b",
39
+ darkslategray: "#2f4f4f",
40
+ darkslategrey: "#2f4f4f",
41
+ darkturquoise: "#00ced1",
42
+ darkviolet: "#9400d3",
43
+ deeppink: "#ff1493",
44
+ deepskyblue: "#00bfff",
45
+ dimgray: "#696969",
46
+ dimgrey: "#696969",
47
+ dodgerblue: "#1e90ff",
48
+ firebrick: "#b22222",
49
+ floralwhite: "#fffaf0",
50
+ forestgreen: "#228b22",
51
+ fuchsia: "#ff00ff",
52
+ gainsboro: "#dcdcdc",
53
+ ghostwhite: "#f8f8ff",
54
+ gold: "#ffd700",
55
+ goldenrod: "#daa520",
56
+ gray: "#808080",
57
+ green: "#008000",
58
+ greenyellow: "#adff2f",
59
+ grey: "#808080",
60
+ honeydew: "#f0fff0",
61
+ hotpink: "#ff69b4",
62
+ indianred: "#cd5c5c",
63
+ indigo: "#4b0082",
64
+ ivory: "#fffff0",
65
+ khaki: "#f0e68c",
66
+ lavender: "#e6e6fa",
67
+ lavenderblush: "#fff0f5",
68
+ lawngreen: "#7cfc00",
69
+ lemonchiffon: "#fffacd",
70
+ lightblue: "#add8e6",
71
+ lightcoral: "#f08080",
72
+ lightcyan: "#e0ffff",
73
+ lightgoldenrodyellow: "#fafad2",
74
+ lightgray: "#d3d3d3",
75
+ lightgreen: "#90ee90",
76
+ lightgrey: "#d3d3d3",
77
+ lightpink: "#ffb6c1",
78
+ lightsalmon: "#ffa07a",
79
+ lightseagreen: "#20b2aa",
80
+ lightskyblue: "#87cefa",
81
+ lightslategray: "#778899",
82
+ lightslategrey: "#778899",
83
+ lightsteelblue: "#b0c4de",
84
+ lightyellow: "#ffffe0",
85
+ lime: "#00ff00",
86
+ limegreen: "#32cd32",
87
+ linen: "#faf0e6",
88
+ magenta: "#ff00ff",
89
+ maroon: "#800000",
90
+ mediumaquamarine: "#66cdaa",
91
+ mediumblue: "#0000cd",
92
+ mediumorchid: "#ba55d3",
93
+ mediumpurple: "#9370db",
94
+ mediumseagreen: "#3cb371",
95
+ mediumslateblue: "#7b68ee",
96
+ mediumspringgreen: "#00fa9a",
97
+ mediumturquoise: "#48d1cc",
98
+ mediumvioletred: "#c71585",
99
+ midnightblue: "#191970",
100
+ mintcream: "#f5fffa",
101
+ mistyrose: "#ffe4e1",
102
+ moccasin: "#ffe4b5",
103
+ navajowhite: "#ffdead",
104
+ navy: "#000080",
105
+ oldlace: "#fdf5e6",
106
+ olive: "#808000",
107
+ olivedrab: "#6b8e23",
108
+ orange: "#ffa500",
109
+ orangered: "#ff4500",
110
+ orchid: "#da70d6",
111
+ palegoldenrod: "#eee8aa",
112
+ palegreen: "#98fb98",
113
+ paleturquoise: "#afeeee",
114
+ palevioletred: "#db7093",
115
+ papayawhip: "#ffefd5",
116
+ peachpuff: "#ffdab9",
117
+ peru: "#cd853f",
118
+ pink: "#ffc0cb",
119
+ plum: "#dda0dd",
120
+ powderblue: "#b0e0e6",
121
+ purple: "#800080",
122
+ rebeccapurple: "#663399",
123
+ red: "#ff0000",
124
+ rosybrown: "#bc8f8f",
125
+ royalblue: "#4169e1",
126
+ saddlebrown: "#8b4513",
127
+ salmon: "#fa8072",
128
+ sandybrown: "#f4a460",
129
+ seagreen: "#2e8b57",
130
+ seashell: "#fff5ee",
131
+ sienna: "#a0522d",
132
+ silver: "#c0c0c0",
133
+ skyblue: "#87ceeb",
134
+ slateblue: "#6a5acd",
135
+ slategray: "#708090",
136
+ slategrey: "#708090",
137
+ snow: "#fffafa",
138
+ springgreen: "#00ff7f",
139
+ steelblue: "#4682b4",
140
+ tan: "#d2b48c",
141
+ teal: "#008080",
142
+ thistle: "#d8bfd8",
143
+ tomato: "#ff6347",
144
+ turquoise: "#40e0d0",
145
+ violet: "#ee82ee",
146
+ wheat: "#f5deb3",
147
+ white: "#ffffff",
148
+ whitesmoke: "#f5f5f5",
149
+ yellow: "#ffff00",
150
+ yellowgreen: "#9acd32",
151
+ transparent: "#00000000"
151
152
  };
153
+ /**
154
+ * Parse a CSS color string into RGBA components (0-1 range).
155
+ * Supports: #rgb, #rrggbb, #rgba, #rrggbbaa, rgb(), rgba(), hsl(), hsla(), named colors, 'transparent'.
156
+ *
157
+ * Also handles Excalibur's non-standard HSL format where h/s/l are all in 0-1 range (not degrees/%).
158
+ * Excalibur's Color.toString() returns `hsla(h, s, l, a)` with values in 0-1 normalized form
159
+ * (e.g. Color.White → "hsla(0, 0, 1, 1)", Color.Black → "hsla(0, 0, 0, 1)").
160
+ */
152
161
  function parseColor(color) {
153
- if (!color || typeof color !== "string") return null;
154
- const trimmed = color.trim().toLowerCase();
155
- const named = NAMED_COLORS[trimmed];
156
- if (named) return parseHex(named);
157
- if (trimmed.startsWith("#")) return parseHex(trimmed);
158
- const rgbMatch = trimmed.match(
159
- /^rgba?\(\s*(\d+(?:\.\d+)?%?)\s*[,\s]\s*(\d+(?:\.\d+)?%?)\s*[,\s]\s*(\d+(?:\.\d+)?%?)\s*(?:[,/]\s*(\d+(?:\.\d+)?%?))?\s*\)$/
160
- );
161
- if (rgbMatch) {
162
- return {
163
- r: parseComponent(rgbMatch[1], 255) / 255,
164
- g: parseComponent(rgbMatch[2], 255) / 255,
165
- b: parseComponent(rgbMatch[3], 255) / 255,
166
- a: rgbMatch[4] !== void 0 ? parseComponent(rgbMatch[4], 1) : 1
167
- };
168
- }
169
- const hslMatch = trimmed.match(
170
- /^hsla?\(\s*(\d+(?:\.\d+)?)\s*[,\s]\s*(\d+(?:\.\d+)?)(%)?\s*[,\s]\s*(\d+(?:\.\d+)?)(%)?\s*(?:[,/]\s*(\d+(?:\.\d+)?%?))?\s*\)$/
171
- );
172
- if (hslMatch) {
173
- let h = parseFloat(hslMatch[1]);
174
- let s = parseFloat(hslMatch[2]);
175
- const sPct = hslMatch[3] === "%";
176
- let l = parseFloat(hslMatch[4]);
177
- const lPct = hslMatch[5] === "%";
178
- const a = hslMatch[6] !== void 0 ? parseComponent(hslMatch[6], 1) : 1;
179
- if (h > 1) h /= 360;
180
- if (sPct) s /= 100;
181
- else if (s > 1) s /= 100;
182
- if (lPct) l /= 100;
183
- else if (l > 1) l /= 100;
184
- return hslToRGBA(h, s, l, Math.max(0, Math.min(1, a)));
185
- }
186
- return null;
162
+ if (!color || typeof color !== "string") return null;
163
+ const trimmed = color.trim().toLowerCase();
164
+ const named = NAMED_COLORS[trimmed];
165
+ if (named) return parseHex(named);
166
+ if (trimmed.startsWith("#")) return parseHex(trimmed);
167
+ const rgbMatch = trimmed.match(/^rgba?\(\s*(\d+(?:\.\d+)?%?)\s*[,\s]\s*(\d+(?:\.\d+)?%?)\s*[,\s]\s*(\d+(?:\.\d+)?%?)\s*(?:[,/]\s*(\d+(?:\.\d+)?%?))?\s*\)$/);
168
+ if (rgbMatch) {
169
+ return {
170
+ r: parseComponent(rgbMatch[1], 255) / 255,
171
+ g: parseComponent(rgbMatch[2], 255) / 255,
172
+ b: parseComponent(rgbMatch[3], 255) / 255,
173
+ a: rgbMatch[4] !== undefined ? parseComponent(rgbMatch[4], 1) : 1
174
+ };
175
+ }
176
+ const hslMatch = trimmed.match(/^hsla?\(\s*(\d+(?:\.\d+)?)\s*[,\s]\s*(\d+(?:\.\d+)?)(%)?\s*[,\s]\s*(\d+(?:\.\d+)?)(%)?\s*(?:[,/]\s*(\d+(?:\.\d+)?%?))?\s*\)$/);
177
+ if (hslMatch) {
178
+ let h = parseFloat(hslMatch[1]);
179
+ let s = parseFloat(hslMatch[2]);
180
+ const sPct = hslMatch[3] === "%";
181
+ let l = parseFloat(hslMatch[4]);
182
+ const lPct = hslMatch[5] === "%";
183
+ const a = hslMatch[6] !== undefined ? parseComponent(hslMatch[6], 1) : 1;
184
+ if (h > 1) h /= 360;
185
+ if (sPct) s /= 100;
186
+ else if (s > 1) s /= 100;
187
+ if (lPct) l /= 100;
188
+ else if (l > 1) l /= 100;
189
+ return hslToRGBA(h, s, l, Math.max(0, Math.min(1, a)));
190
+ }
191
+ return null;
187
192
  }
188
193
  function parseHex(hex) {
189
- const h = hex.slice(1);
190
- let r, g, b, a = 1;
191
- if (h.length === 3) {
192
- r = parseInt(h[0] + h[0], 16) / 255;
193
- g = parseInt(h[1] + h[1], 16) / 255;
194
- b = parseInt(h[2] + h[2], 16) / 255;
195
- } else if (h.length === 4) {
196
- r = parseInt(h[0] + h[0], 16) / 255;
197
- g = parseInt(h[1] + h[1], 16) / 255;
198
- b = parseInt(h[2] + h[2], 16) / 255;
199
- a = parseInt(h[3] + h[3], 16) / 255;
200
- } else if (h.length === 6) {
201
- r = parseInt(h.slice(0, 2), 16) / 255;
202
- g = parseInt(h.slice(2, 4), 16) / 255;
203
- b = parseInt(h.slice(4, 6), 16) / 255;
204
- } else if (h.length === 8) {
205
- r = parseInt(h.slice(0, 2), 16) / 255;
206
- g = parseInt(h.slice(2, 4), 16) / 255;
207
- b = parseInt(h.slice(4, 6), 16) / 255;
208
- a = parseInt(h.slice(6, 8), 16) / 255;
209
- } else {
210
- return null;
211
- }
212
- return { r, g, b, a };
194
+ const h = hex.slice(1);
195
+ let r, g, b, a = 1;
196
+ if (h.length === 3) {
197
+ r = parseInt(h[0] + h[0], 16) / 255;
198
+ g = parseInt(h[1] + h[1], 16) / 255;
199
+ b = parseInt(h[2] + h[2], 16) / 255;
200
+ } else if (h.length === 4) {
201
+ r = parseInt(h[0] + h[0], 16) / 255;
202
+ g = parseInt(h[1] + h[1], 16) / 255;
203
+ b = parseInt(h[2] + h[2], 16) / 255;
204
+ a = parseInt(h[3] + h[3], 16) / 255;
205
+ } else if (h.length === 6) {
206
+ r = parseInt(h.slice(0, 2), 16) / 255;
207
+ g = parseInt(h.slice(2, 4), 16) / 255;
208
+ b = parseInt(h.slice(4, 6), 16) / 255;
209
+ } else if (h.length === 8) {
210
+ r = parseInt(h.slice(0, 2), 16) / 255;
211
+ g = parseInt(h.slice(2, 4), 16) / 255;
212
+ b = parseInt(h.slice(4, 6), 16) / 255;
213
+ a = parseInt(h.slice(6, 8), 16) / 255;
214
+ } else {
215
+ return null;
216
+ }
217
+ return {
218
+ r,
219
+ g,
220
+ b,
221
+ a
222
+ };
213
223
  }
214
224
  function parseComponent(value, max) {
215
- if (value.endsWith("%")) {
216
- return parseFloat(value) / 100 * max;
217
- }
218
- return parseFloat(value);
225
+ if (value.endsWith("%")) {
226
+ return parseFloat(value) / 100 * max;
227
+ }
228
+ return parseFloat(value);
219
229
  }
220
230
  function hue2rgb(p, q, t) {
221
- if (t < 0) t += 1;
222
- if (t > 1) t -= 1;
223
- if (t < 1 / 6) return p + (q - p) * 6 * t;
224
- if (t < 1 / 2) return q;
225
- if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
226
- return p;
231
+ if (t < 0) t += 1;
232
+ if (t > 1) t -= 1;
233
+ if (t < 1 / 6) return p + (q - p) * 6 * t;
234
+ if (t < 1 / 2) return q;
235
+ if (t < 2 / 3) return p + (q - p) * (2 / 3 - t) * 6;
236
+ return p;
227
237
  }
228
238
  function hslToRGBA(h, s, l, a) {
229
- let r, g, b;
230
- if (s === 0) {
231
- r = g = b = l;
232
- } else {
233
- const q = l < 0.5 ? l * (1 + s) : l + s - l * s;
234
- const p = 2 * l - q;
235
- r = hue2rgb(p, q, h + 1 / 3);
236
- g = hue2rgb(p, q, h);
237
- b = hue2rgb(p, q, h - 1 / 3);
238
- }
239
- return { r, g, b, a };
239
+ let r, g, b;
240
+ if (s === 0) {
241
+ r = g = b = l;
242
+ } else {
243
+ const q = l < .5 ? l * (1 + s) : l + s - l * s;
244
+ const p = 2 * l - q;
245
+ r = hue2rgb(p, q, h + 1 / 3);
246
+ g = hue2rgb(p, q, h);
247
+ b = hue2rgb(p, q, h - 1 / 3);
248
+ }
249
+ return {
250
+ r,
251
+ g,
252
+ b,
253
+ a
254
+ };
240
255
  }
241
- const BLACK = { r: 0, g: 0, b: 0, a: 1 };
242
- const TRANSPARENT = { r: 0, g: 0, b: 0, a: 0 };
243
- export {
244
- BLACK,
245
- TRANSPARENT,
246
- parseColor
256
+ /** Default color: opaque black */
257
+ const BLACK = {
258
+ r: 0,
259
+ g: 0,
260
+ b: 0,
261
+ a: 1
247
262
  };
263
+ /** Transparent black */
264
+ const TRANSPARENT = {
265
+ r: 0,
266
+ g: 0,
267
+ b: 0,
268
+ a: 0
269
+ };
270
+
271
+ //#endregion
272
+ export { BLACK, TRANSPARENT, parseColor };
package/lib/esm/image-data.js CHANGED
@@ -1,22 +1,25 @@
1
- class OurImageData {
2
- constructor(swOrData, sh, maybeHeight) {
3
- this.colorSpace = "srgb";
4
- if (typeof swOrData === "number") {
5
- this.width = swOrData;
6
- this.height = sh;
7
- this.data = new Uint8ClampedArray(this.width * this.height * 4);
8
- } else {
9
- this.data = swOrData;
10
- this.width = sh;
11
- this.height = maybeHeight ?? this.data.length / (4 * this.width);
12
- if (this.data.length !== this.width * this.height * 4) {
13
- throw new RangeError(
14
- `Source data length ${this.data.length} is not a multiple of (4 * width=${this.width})`
15
- );
16
- }
17
- }
18
- }
19
- }
20
- export {
21
- OurImageData
1
+ //#region src/image-data.ts
2
+ /**
3
+ * ImageData represents the pixel data of a canvas area.
4
+ * Each pixel is 4 bytes: R, G, B, A (0-255 each).
5
+ */
6
+ var OurImageData = class {
7
+ constructor(swOrData, sh, maybeHeight) {
8
+ this.colorSpace = "srgb";
9
+ if (typeof swOrData === "number") {
10
+ this.width = swOrData;
11
+ this.height = sh;
12
+ this.data = new Uint8ClampedArray(this.width * this.height * 4);
13
+ } else {
14
+ this.data = swOrData;
15
+ this.width = sh;
16
+ this.height = maybeHeight ?? this.data.length / (4 * this.width);
17
+ if (this.data.length !== this.width * this.height * 4) {
18
+ throw new RangeError(`Source data length ${this.data.length} is not a multiple of (4 * width=${this.width})`);
19
+ }
20
+ }
21
+ }
22
22
  };
23
+
24
+ //#endregion
25
+ export { OurImageData };
package/lib/esm/index.js CHANGED
@@ -1,14 +1,8 @@
1
- import { CanvasRenderingContext2D } from "./canvas-rendering-context-2d.js";
1
+ import { parseColor } from "./color.js";
2
2
  import { CanvasGradient } from "./canvas-gradient.js";
3
- import { CanvasPattern } from "./canvas-pattern.js";
4
3
  import { Path2D } from "./canvas-path.js";
4
+ import { CanvasPattern } from "./canvas-pattern.js";
5
5
  import { OurImageData } from "./image-data.js";
6
- import { parseColor } from "./color.js";
7
- export {
8
- CanvasGradient,
9
- CanvasPattern,
10
- CanvasRenderingContext2D,
11
- OurImageData as ImageData,
12
- Path2D,
13
- parseColor
14
- };
6
+ import { CanvasRenderingContext2D } from "./canvas-rendering-context-2d.js";
7
+
8
+ export { CanvasGradient, CanvasPattern, CanvasRenderingContext2D, OurImageData as ImageData, Path2D, parseColor };