@canvas-harness/core 0.1.3 → 0.1.4
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 +23 -24
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.cts +21 -3
- package/dist/index.d.ts +21 -3
- package/dist/index.js +23 -24
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -857,23 +857,12 @@ var darkenHex = (hex) => {
|
|
|
857
857
|
|
|
858
858
|
// src/render/shapes/path-helpers.ts
|
|
859
859
|
var buildRectPath = (ctx, w, h, radius) => {
|
|
860
|
+
ctx.beginPath();
|
|
860
861
|
if (radius <= 0) {
|
|
861
|
-
ctx.beginPath();
|
|
862
862
|
ctx.rect(0, 0, w, h);
|
|
863
863
|
return;
|
|
864
864
|
}
|
|
865
|
-
|
|
866
|
-
ctx.beginPath();
|
|
867
|
-
ctx.moveTo(r, 0);
|
|
868
|
-
ctx.lineTo(w - r, 0);
|
|
869
|
-
ctx.quadraticCurveTo(w, 0, w, r);
|
|
870
|
-
ctx.lineTo(w, h - r);
|
|
871
|
-
ctx.quadraticCurveTo(w, h, w - r, h);
|
|
872
|
-
ctx.lineTo(r, h);
|
|
873
|
-
ctx.quadraticCurveTo(0, h, 0, h - r);
|
|
874
|
-
ctx.lineTo(0, r);
|
|
875
|
-
ctx.quadraticCurveTo(0, 0, r, 0);
|
|
876
|
-
ctx.closePath();
|
|
865
|
+
ctx.roundRect(0, 0, w, h, radius);
|
|
877
866
|
};
|
|
878
867
|
var buildEllipsePath = (ctx, w, h) => {
|
|
879
868
|
const rx = w / 2;
|
|
@@ -4255,13 +4244,21 @@ var storeToJSON = (store) => ({
|
|
|
4255
4244
|
});
|
|
4256
4245
|
|
|
4257
4246
|
// src/render/canvas-setup.ts
|
|
4258
|
-
var
|
|
4259
|
-
var
|
|
4247
|
+
var HARD_MAX_DPR = 3;
|
|
4248
|
+
var defaultMaxDprForSize = (cssW, cssH) => {
|
|
4249
|
+
const cssPx = cssW * cssH;
|
|
4250
|
+
if (cssPx >= 25e5) return 1;
|
|
4251
|
+
if (cssPx >= 15e5) return 1.5;
|
|
4252
|
+
return 2;
|
|
4253
|
+
};
|
|
4254
|
+
var getDpr = (maxDpr, cssW = 0, cssH = 0) => {
|
|
4260
4255
|
if (typeof window === "undefined") return 1;
|
|
4261
4256
|
const raw = window.devicePixelRatio || 1;
|
|
4262
|
-
|
|
4257
|
+
const resolvedMax = maxDpr === void 0 && cssW > 0 && cssH > 0 ? defaultMaxDprForSize(cssW, cssH) : maxDpr ?? 1;
|
|
4258
|
+
const cap = Math.max(1, Math.min(HARD_MAX_DPR, resolvedMax));
|
|
4259
|
+
return Math.max(1, Math.min(cap, raw));
|
|
4263
4260
|
};
|
|
4264
|
-
var setupSurface = (canvas) => {
|
|
4261
|
+
var setupSurface = (canvas, _maxDpr) => {
|
|
4265
4262
|
const ctx = canvas.getContext("2d");
|
|
4266
4263
|
if (!ctx) throw new Error("Canvas 2d context unavailable");
|
|
4267
4264
|
return {
|
|
@@ -4269,11 +4266,12 @@ var setupSurface = (canvas) => {
|
|
|
4269
4266
|
ctx,
|
|
4270
4267
|
cssWidth: 0,
|
|
4271
4268
|
cssHeight: 0,
|
|
4272
|
-
dpr:
|
|
4269
|
+
dpr: 1
|
|
4270
|
+
// placeholder; `sizeSurface` writes the real value
|
|
4273
4271
|
};
|
|
4274
4272
|
};
|
|
4275
|
-
var sizeSurface = (surface, cssW, cssH) => {
|
|
4276
|
-
const dpr = getDpr();
|
|
4273
|
+
var sizeSurface = (surface, cssW, cssH, maxDpr) => {
|
|
4274
|
+
const dpr = getDpr(maxDpr, cssW, cssH);
|
|
4277
4275
|
if (surface.cssWidth === cssW && surface.cssHeight === cssH && surface.dpr === dpr) {
|
|
4278
4276
|
return false;
|
|
4279
4277
|
}
|
|
@@ -4893,13 +4891,14 @@ var MIN_ON_SCREEN_SIZE_PX = 1.5;
|
|
|
4893
4891
|
var MIN_READABLE_FONT_PX = 3;
|
|
4894
4892
|
var createRenderer = (opts) => {
|
|
4895
4893
|
const { store, theme, onOverlayChange } = opts;
|
|
4894
|
+
const maxDpr = opts.maxDpr;
|
|
4896
4895
|
const staticSurface = setupSurface(opts.staticCanvas);
|
|
4897
4896
|
const interactiveSurface = setupSurface(opts.interactiveCanvas);
|
|
4898
4897
|
let background = opts.background;
|
|
4899
4898
|
let selectionColor = opts.selectionColor ?? DEFAULT_SELECTION_COLOR;
|
|
4900
4899
|
let hideFrames = false;
|
|
4901
|
-
sizeSurface(staticSurface, opts.width, opts.height);
|
|
4902
|
-
sizeSurface(interactiveSurface, opts.width, opts.height);
|
|
4900
|
+
sizeSurface(staticSurface, opts.width, opts.height, maxDpr);
|
|
4901
|
+
sizeSurface(interactiveSurface, opts.width, opts.height, maxDpr);
|
|
4903
4902
|
let staticDirty = true;
|
|
4904
4903
|
let interactiveDirty = false;
|
|
4905
4904
|
let overlaySet = /* @__PURE__ */ new Set();
|
|
@@ -5390,8 +5389,8 @@ var createRenderer = (opts) => {
|
|
|
5390
5389
|
loop.requestFrame();
|
|
5391
5390
|
},
|
|
5392
5391
|
setSize(cssW, cssH) {
|
|
5393
|
-
const a = sizeSurface(staticSurface, cssW, cssH);
|
|
5394
|
-
const b = sizeSurface(interactiveSurface, cssW, cssH);
|
|
5392
|
+
const a = sizeSurface(staticSurface, cssW, cssH, maxDpr);
|
|
5393
|
+
const b = sizeSurface(interactiveSurface, cssW, cssH, maxDpr);
|
|
5395
5394
|
if (a || b) {
|
|
5396
5395
|
staticDirty = true;
|
|
5397
5396
|
interactiveDirty = true;
|