@tsdraw/core 0.5.0 → 0.5.1
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.
- package/dist/index.cjs +19 -98
- package/dist/index.cjs.map +1 -1
- package/dist/index.js +19 -98
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -255,105 +255,26 @@ function zoomViewport(viewport, factor, centerX, centerY) {
|
|
|
255
255
|
}
|
|
256
256
|
|
|
257
257
|
// src/utils/colors.ts
|
|
258
|
+
var DARK_COLORS = {
|
|
259
|
+
black: "#f0f0f0",
|
|
260
|
+
grey: "#aeb8c2",
|
|
261
|
+
"light-violet": "#cf6ef5",
|
|
262
|
+
violet: "#a83ce0",
|
|
263
|
+
blue: "#5b7dff",
|
|
264
|
+
"light-blue": "#4fb3ff",
|
|
265
|
+
yellow: "#f4b13a",
|
|
266
|
+
orange: "#ef7a24",
|
|
267
|
+
green: "#1fb27a",
|
|
268
|
+
"light-green": "#4ecb66",
|
|
269
|
+
"light-red": "#ff6f78",
|
|
270
|
+
red: "#f24343",
|
|
271
|
+
white: "#ffffff"
|
|
272
|
+
};
|
|
258
273
|
function resolveThemeColor(colorStyle, theme) {
|
|
259
|
-
const
|
|
260
|
-
if (!
|
|
261
|
-
if (theme === "light") return
|
|
262
|
-
return
|
|
263
|
-
}
|
|
264
|
-
function invertAndHueRotate180(color) {
|
|
265
|
-
const rgb = parseHexColor(color);
|
|
266
|
-
if (!rgb) return color;
|
|
267
|
-
const inverted = {
|
|
268
|
-
r: 255 - rgb.r,
|
|
269
|
-
g: 255 - rgb.g,
|
|
270
|
-
b: 255 - rgb.b
|
|
271
|
-
};
|
|
272
|
-
const hsl = rgbToHsl(inverted.r, inverted.g, inverted.b);
|
|
273
|
-
const rotated = hslToRgb((hsl.h + 180) % 360, hsl.s, hsl.l);
|
|
274
|
-
return rgbToHex(rotated.r, rotated.g, rotated.b);
|
|
275
|
-
}
|
|
276
|
-
function parseHexColor(color) {
|
|
277
|
-
const normalized = color.trim().toLowerCase();
|
|
278
|
-
if (!normalized.startsWith("#")) return null;
|
|
279
|
-
if (normalized.length === 4) {
|
|
280
|
-
return {
|
|
281
|
-
r: parseInt(normalized[1] + normalized[1], 16),
|
|
282
|
-
g: parseInt(normalized[2] + normalized[2], 16),
|
|
283
|
-
b: parseInt(normalized[3] + normalized[3], 16)
|
|
284
|
-
};
|
|
285
|
-
}
|
|
286
|
-
if (normalized.length !== 7) return null;
|
|
287
|
-
return {
|
|
288
|
-
r: parseInt(normalized.slice(1, 3), 16),
|
|
289
|
-
g: parseInt(normalized.slice(3, 5), 16),
|
|
290
|
-
b: parseInt(normalized.slice(5, 7), 16)
|
|
291
|
-
};
|
|
292
|
-
}
|
|
293
|
-
function rgbToHex(r, g, b) {
|
|
294
|
-
return `#${toHex(r)}${toHex(g)}${toHex(b)}`;
|
|
295
|
-
}
|
|
296
|
-
function toHex(value) {
|
|
297
|
-
return Math.round(Math.max(0, Math.min(255, value))).toString(16).padStart(2, "0");
|
|
298
|
-
}
|
|
299
|
-
function rgbToHsl(r, g, b) {
|
|
300
|
-
const red = r / 255;
|
|
301
|
-
const green = g / 255;
|
|
302
|
-
const blue = b / 255;
|
|
303
|
-
const maxChannel = Math.max(red, green, blue);
|
|
304
|
-
const minChannel = Math.min(red, green, blue);
|
|
305
|
-
const delta = maxChannel - minChannel;
|
|
306
|
-
const lightness = (maxChannel + minChannel) / 2;
|
|
307
|
-
if (delta === 0) {
|
|
308
|
-
return { h: 0, s: 0, l: lightness };
|
|
309
|
-
}
|
|
310
|
-
const saturation = lightness > 0.5 ? delta / (2 - maxChannel - minChannel) : delta / (maxChannel + minChannel);
|
|
311
|
-
let hue = 0;
|
|
312
|
-
if (maxChannel === red) {
|
|
313
|
-
hue = ((green - blue) / delta + (green < blue ? 6 : 0)) * 60;
|
|
314
|
-
} else if (maxChannel === green) {
|
|
315
|
-
hue = ((blue - red) / delta + 2) * 60;
|
|
316
|
-
} else {
|
|
317
|
-
hue = ((red - green) / delta + 4) * 60;
|
|
318
|
-
}
|
|
319
|
-
return { h: hue, s: saturation, l: lightness };
|
|
320
|
-
}
|
|
321
|
-
function hslToRgb(h, s, l) {
|
|
322
|
-
if (s === 0) {
|
|
323
|
-
const channel = l * 255;
|
|
324
|
-
return { r: channel, g: channel, b: channel };
|
|
325
|
-
}
|
|
326
|
-
const chroma = (1 - Math.abs(2 * l - 1)) * s;
|
|
327
|
-
const hueSegment = h / 60;
|
|
328
|
-
const x = chroma * (1 - Math.abs(hueSegment % 2 - 1));
|
|
329
|
-
let red = 0;
|
|
330
|
-
let green = 0;
|
|
331
|
-
let blue = 0;
|
|
332
|
-
if (hueSegment >= 0 && hueSegment < 1) {
|
|
333
|
-
red = chroma;
|
|
334
|
-
green = x;
|
|
335
|
-
} else if (hueSegment < 2) {
|
|
336
|
-
red = x;
|
|
337
|
-
green = chroma;
|
|
338
|
-
} else if (hueSegment < 3) {
|
|
339
|
-
green = chroma;
|
|
340
|
-
blue = x;
|
|
341
|
-
} else if (hueSegment < 4) {
|
|
342
|
-
green = x;
|
|
343
|
-
blue = chroma;
|
|
344
|
-
} else if (hueSegment < 5) {
|
|
345
|
-
red = x;
|
|
346
|
-
blue = chroma;
|
|
347
|
-
} else {
|
|
348
|
-
red = chroma;
|
|
349
|
-
blue = x;
|
|
350
|
-
}
|
|
351
|
-
const match = l - chroma / 2;
|
|
352
|
-
return {
|
|
353
|
-
r: (red + match) * 255,
|
|
354
|
-
g: (green + match) * 255,
|
|
355
|
-
b: (blue + match) * 255
|
|
356
|
-
};
|
|
274
|
+
const lightThemeColor = DEFAULT_COLORS[colorStyle];
|
|
275
|
+
if (!lightThemeColor) return colorStyle;
|
|
276
|
+
if (theme === "light") return lightThemeColor;
|
|
277
|
+
return DARK_COLORS[colorStyle] ?? lightThemeColor;
|
|
357
278
|
}
|
|
358
279
|
var CanvasRenderer = class {
|
|
359
280
|
theme = "light";
|