@sarmal/core 0.22.0 → 0.23.0

package/dist/auto-init.js

@@ -538,9 +538,9 @@ function warnIfTrailColorMismatch(trailColor, trailStyle) {
     );
   }
 }
-var getHeadDotRadius = (w, h) => Math.max(1, 3 * Math.sqrt(Math.min(w, h) / 160));
 
 // src/renderer.ts
+var getHeadDotRadius = (w, h) => Math.max(1, 3 * Math.sqrt(Math.min(w, h) / 160));
 var WHITE_HEX = "#ffffff";
 function hexToRgbComponents(hex) {
   const n = parseInt(hex.slice(1), 16);
@@ -844,6 +844,8 @@ function createRenderer(options) {
 
 // src/renderer-svg.ts
 var EMPTY_PARAMS2 = {};
+var SVG_DEFAULT_HEAD_RADIUS = 0.5;
+var SKELETON_STROKE_WIDTH_PX = 1.5;
 var HIGH_TRAIL_LENGTH_THRESHOLD = 5e3;
 function pointsToPathString(pts, scale, offsetX, offsetY) {
   if (pts.length < 2) {
@@ -883,15 +885,21 @@ function createSVGRenderer(options) {
   let skeletonColor = options.skeletonColor ?? "#ffffff";
   let userHeadColor = options.headColor ?? null;
   let headColor = userHeadColor ?? resolveHeadColor(trailColor, trailStyle);
-  let headRadius = options.headRadius ?? 1.5;
+  let headRadius;
   let trailSolid = resolveTrailMainColor(trailColor);
   let trailPalette = resolveTrailPalette(trailColor);
   const ariaLabel = options.ariaLabel ?? "Loading";
   warnIfTrailColorMismatch(trailColor, trailStyle);
   const viewSize = 100;
-  const svgTrailMinWidth = 0.25;
-  const svgTrailMaxWidth = 1.25;
-  const svgSkeletonStrokeWidth = "0.75";
+  function getContainerPixelSize() {
+    const rect = container.getBoundingClientRect();
+    return rect.width && rect.height ? Math.min(rect.width, rect.height) : 200;
+  }
+  const containerPx = getContainerPixelSize();
+  const svgTrailMinWidth = (TRAIL_MIN_WIDTH * viewSize) / containerPx;
+  const svgTrailMaxWidth = (TRAIL_MAX_WIDTH * viewSize) / containerPx;
+  const svgSkeletonStrokeWidth = String((SKELETON_STROKE_WIDTH_PX * viewSize) / containerPx);
+  headRadius = options.headRadius ?? SVG_DEFAULT_HEAD_RADIUS;
   container.setAttribute("viewBox", `0 0 ${viewSize} ${viewSize}`);
   container.setAttribute("role", "img");
   container.setAttribute("aria-label", ariaLabel);