@pixldocs/canvas-renderer 0.5.103 → 0.5.104
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 +1 -21
- package/dist/index.cjs.map +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +1 -21
- package/dist/index.js.map +1 -1
- package/package.json +1 -1
package/dist/index.cjs
CHANGED
|
@@ -6269,7 +6269,6 @@ function bakeEdgeFade(source, fade) {
|
|
|
6269
6269
|
let x = 0, y = 0, rectW = mask.width, rectH = mask.height;
|
|
6270
6270
|
const STOPS = 64;
|
|
6271
6271
|
const gamma = 1 / hardness;
|
|
6272
|
-
const seamGuardPx = 2;
|
|
6273
6272
|
const innerAlpha = (t) => {
|
|
6274
6273
|
const keepProgress = Math.pow(t, gamma);
|
|
6275
6274
|
const erase = (1 - amount) * (1 - keepProgress);
|
|
@@ -6307,16 +6306,6 @@ function bakeEdgeFade(source, fade) {
|
|
|
6307
6306
|
}
|
|
6308
6307
|
mctx.fillStyle = g;
|
|
6309
6308
|
mctx.fillRect(x, y, rectW, rectH);
|
|
6310
|
-
{
|
|
6311
|
-
const edgePx = Math.min(seamGuardPx, side === "top" || side === "bottom" ? rectH : rectW);
|
|
6312
|
-
mctx.fillStyle = "rgba(0,0,0,0)";
|
|
6313
|
-
mctx.globalCompositeOperation = "copy";
|
|
6314
|
-
if (side === "top") mctx.fillRect(0, 0, mask.width, edgePx);
|
|
6315
|
-
if (side === "bottom") mctx.fillRect(0, mask.height - edgePx, mask.width, edgePx);
|
|
6316
|
-
if (side === "left") mctx.fillRect(0, 0, edgePx, mask.height);
|
|
6317
|
-
if (side === "right") mctx.fillRect(mask.width - edgePx, 0, edgePx, mask.height);
|
|
6318
|
-
mctx.globalCompositeOperation = "source-over";
|
|
6319
|
-
}
|
|
6320
6309
|
ctx.globalCompositeOperation = "destination-in";
|
|
6321
6310
|
ctx.drawImage(mask, 0, 0);
|
|
6322
6311
|
ctx.globalCompositeOperation = "source-over";
|
|
@@ -9733,7 +9722,6 @@ const PageCanvas = react.forwardRef(
|
|
|
9733
9722
|
const eraseAtEdge = 1 - amount;
|
|
9734
9723
|
const STOPS = 64;
|
|
9735
9724
|
const gamma = 1 / hardness;
|
|
9736
|
-
const seamGuardPx = 2;
|
|
9737
9725
|
const addStops = (g) => {
|
|
9738
9726
|
for (let i = 0; i <= STOPS; i++) {
|
|
9739
9727
|
const t = i / STOPS;
|
|
@@ -9748,32 +9736,24 @@ const PageCanvas = react.forwardRef(
|
|
|
9748
9736
|
addStops(gradient);
|
|
9749
9737
|
ctx.fillStyle = gradient;
|
|
9750
9738
|
ctx.fillRect(x, y, w, band);
|
|
9751
|
-
ctx.fillStyle = "rgba(0,0,0,1)";
|
|
9752
|
-
ctx.fillRect(x, y, w, Math.min(seamGuardPx, band));
|
|
9753
9739
|
} else if (side === "bottom") {
|
|
9754
9740
|
const band = Math.max(1, h * size);
|
|
9755
9741
|
gradient = ctx.createLinearGradient(0, y + h, 0, y + h - band);
|
|
9756
9742
|
addStops(gradient);
|
|
9757
9743
|
ctx.fillStyle = gradient;
|
|
9758
9744
|
ctx.fillRect(x, y + h - band, w, band);
|
|
9759
|
-
ctx.fillStyle = "rgba(0,0,0,1)";
|
|
9760
|
-
ctx.fillRect(x, y + h - Math.min(seamGuardPx, band), w, Math.min(seamGuardPx, band));
|
|
9761
9745
|
} else if (side === "left") {
|
|
9762
9746
|
const band = Math.max(1, w * size);
|
|
9763
9747
|
gradient = ctx.createLinearGradient(x, 0, x + band, 0);
|
|
9764
9748
|
addStops(gradient);
|
|
9765
9749
|
ctx.fillStyle = gradient;
|
|
9766
9750
|
ctx.fillRect(x, y, band, h);
|
|
9767
|
-
ctx.fillStyle = "rgba(0,0,0,1)";
|
|
9768
|
-
ctx.fillRect(x, y, Math.min(seamGuardPx, band), h);
|
|
9769
9751
|
} else {
|
|
9770
9752
|
const band = Math.max(1, w * size);
|
|
9771
9753
|
gradient = ctx.createLinearGradient(x + w, 0, x + w - band, 0);
|
|
9772
9754
|
addStops(gradient);
|
|
9773
9755
|
ctx.fillStyle = gradient;
|
|
9774
9756
|
ctx.fillRect(x + w - band, y, band, h);
|
|
9775
|
-
ctx.fillStyle = "rgba(0,0,0,1)";
|
|
9776
|
-
ctx.fillRect(x + w - Math.min(seamGuardPx, band), y, Math.min(seamGuardPx, band), h);
|
|
9777
9757
|
}
|
|
9778
9758
|
ctx.restore();
|
|
9779
9759
|
};
|
|
@@ -13443,7 +13423,7 @@ function PixldocsPreview(props) {
|
|
|
13443
13423
|
!canvasSettled && /* @__PURE__ */ jsxRuntime.jsx("div", { style: { position: "absolute", inset: 0, display: "flex", alignItems: "center", justifyContent: "center", minHeight: 200 }, children: /* @__PURE__ */ jsxRuntime.jsx("div", { style: { color: "#888", fontSize: 14 }, children: "Loading preview..." }) })
|
|
13444
13424
|
] });
|
|
13445
13425
|
}
|
|
13446
|
-
const PACKAGE_VERSION = "0.5.
|
|
13426
|
+
const PACKAGE_VERSION = "0.5.104";
|
|
13447
13427
|
const roundParityValue = (value) => {
|
|
13448
13428
|
if (typeof value !== "number") return value;
|
|
13449
13429
|
return Number.isFinite(value) ? Number(value.toFixed(3)) : value;
|