@selfdecode/sd-component-library 4.0.150 → 4.0.151

package/lib/sd-component-library208.js

@@ -1,132 +1,50 @@
-import { j as e } from "./sd-component-library169.js";
-import U from "react";
-import { isValueInRange as Z, inValueHigherThanRange as F, getCoordinateForArc as d, getInnerX as $, getInnerY as tt, degToRad as L } from "./sd-component-library86.js";
-import { BaseOutlineArc as X } from "./sd-component-library271.js";
-import { OutlineMeterLabelPointer as O } from "./sd-component-library218.js";
-const st = U.forwardRef(
-  (D, M) => {
-    const {
-      start: n,
-      end: r,
-      color: x,
-      bounds: R,
-      diameter: o,
-      arc: v,
-      distanceBetweenRanges: l,
-      totalRanges: y,
-      value: g,
-      gaugeWidth: s,
-      segmented: f,
-      idx: m,
-      pointStrokeWidth: I,
-      innerPointRadius: T,
-      distanceFromRanges: b,
-      label: w,
-      labelPosition: V,
-      hideLabels: E,
-      connected: _
-    } = D, S = "#CCD0DB", A = v - (y - 1) * l, H = A * (r - n), Y = Z(g, n, r, R), q = (360 - v) / 2, t = o / 2, a = q + l * m + A * n, C = _ && F(g, r, R), i = a + A * (r - n) + (C ? l : 0), { x: P, y: j } = d(
-      t,
-      a
-    ), { x: W, y: k } = d(
-      t,
-      i
-    ), u = V || m === 0 ? "left" : m === y - 1 ? "right" : "top";
-    if (f || !Y) {
-      const J = f && Y || !f && F(g, r, R) ? x : S, B = C ? i - l : i, { y: K } = d(
-        t,
-        B
-      ), { x: N, y: Q } = d(
-        t,
-        (a + B) / 2
-      );
-      return /* @__PURE__ */ e.jsxs("g", { children: [
-        /* @__PURE__ */ e.jsx(
-          X,
-          {
-            startX: P,
-            startY: j,
-            endX: W,
-            endY: k,
-            startAlpha: a,
-            endAlpha: i,
-            color: J,
-            radius: t,
-            width: s
-          }
-        ),
-        !E && w && /* @__PURE__ */ e.jsx(
-          O,
-          {
-            diameter: o,
-            position: u,
-            distanceFromRanges: b,
-            isInRange: Y,
-            ...u === "right" && j > o / 2 || u === "left" && K > o / 2 ? {
-              rangeX: N,
-              rangeY: Q
-            } : void 0
-          }
-        )
-      ] });
+import { j as N } from "./sd-component-library169.js";
+import { getInnerX as k, getInnerY as B, degToRad as c, getCoordinateForArc as i } from "./sd-component-library86.js";
+import { getFractionColor as b } from "./sd-component-library206.js";
+import { BaseNeedle as q } from "./sd-component-library265.js";
+const O = (R) => {
+  const {
+    ranges: r,
+    distanceFromRange: d,
+    innerCircleRadius: X,
+    innerCircleStrokeWidth: Y,
+    needleWidth: n,
+    arc: a,
+    value: l,
+    gaugeWidth: g,
+    diameter: v,
+    needleColor: S
+  } = R, s = v / 2, e = r.length, t = Math.floor(l * e), y = r[t][0], A = r[t][1], u = (360 - a) / 2, m = u + a * t / e, E = u + a * (t + 1) / e, p = t / e, M = (t + 1) / e, { x: h, y: x } = i(
+    s,
+    m
+  ), { x: j, y: F } = i(
+    s,
+    E
+  ), o = m + (l - p) / (M - p) * a / r.length, { x: C, y: f } = i(s, o), G = k(
+    C,
+    c(o),
+    d + g + n / 2
+  ), I = B(
+    f,
+    c(o),
+    d + g + n / 2
+  ), T = n / 2 * Math.cos(c(o)), W = n / 2 * Math.sin(c(o)), z = t + 1 === e / 2 + 0.5 ? (C - h) / (j - h) : (f - x) / (F - x), H = b(z, y, A);
+  return /* @__PURE__ */ N.jsx(
+    q,
+    {
+      radius: s,
+      innerCircleRadius: X,
+      innerCircleStrokeWidth: Y,
+      needleWidth: n,
+      color: S || H,
+      dx: T,
+      dy: W,
+      tipX: G,
+      tipY: I
     }
-    const c = a + (g - n) / (r - n) * H, { x: h, y: p } = d(t, c), z = $(h, L(c), s), G = tt(p, L(c), s);
-    return /* @__PURE__ */ e.jsxs("g", { children: [
-      /* @__PURE__ */ e.jsx(
-        X,
-        {
-          startX: P,
-          startY: j,
-          endX: h,
-          endY: p,
-          startAlpha: a,
-          endAlpha: c,
-          color: x,
-          radius: t,
-          width: s,
-          roundEnd: !1
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        X,
-        {
-          startX: h,
-          startY: p,
-          endX: W,
-          endY: k,
-          startAlpha: c,
-          endAlpha: i,
-          color: S,
-          radius: t,
-          width: s,
-          roundStart: !1
-        }
-      ),
-      /* @__PURE__ */ e.jsx(
-        "circle",
-        {
-          cx: (h + z) / 2,
-          cy: (p + G) / 2,
-          r: I + T,
-          strokeWidth: I,
-          stroke: x,
-          fill: "white",
-          ref: M
-        }
-      ),
-      !E && w && /* @__PURE__ */ e.jsx(
-        O,
-        {
-          diameter: o,
-          isInRange: !0,
-          position: u,
-          distanceFromRanges: b
-        }
-      )
-    ] });
-  }
-);
+  );
+};
 export {
-  st as OutlineMeterRange
+  O as GradientMeterNeedle
 };
 //# sourceMappingURL=sd-component-library208.js.map

package/lib/sd-component-library208.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library208.js","sources":["../src/components/meters/outline-meter/partials/outline-meter-range/outline-meter-range.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n  degToRad,\n  getCoordinateForArc,\n  getInnerX,\n  getInnerY,\n  inValueHigherThanRange,\n  isValueInRange,\n} from \"../../utils\";\nimport { BaseOutlineArc } from \"../base-outline-arc\";\nimport { OutlineMeterLabelPointer } from \"../outline-meter-label-pointer\";\nimport { OutlineMeterRangeProps as Props } from \"./interfaces\";\n\nexport const OutlineMeterRange = React.forwardRef<SVGCircleElement, Props>(\n  (props, pointRef) => {\n    const {\n      start,\n      end,\n      color,\n      bounds,\n      diameter,\n      arc,\n      distanceBetweenRanges,\n      totalRanges,\n      value,\n      gaugeWidth,\n      segmented,\n      idx,\n      pointStrokeWidth,\n      innerPointRadius,\n      distanceFromRanges,\n      label,\n      labelPosition,\n      hideLabels,\n      connected,\n    } = props;\n\n    const grey = \"#CCD0DB\";\n\n    /* Arc value (in degrees) used for all ranges. */\n    const arcForRanges = arc - (totalRanges - 1) * distanceBetweenRanges;\n\n    /* Arc value for the current range. */\n    const rangeArc = arcForRanges * (end - start);\n    const valueWithinRange = isValueInRange(value, start, end, bounds);\n\n    const arcStart = (360 - arc) / 2; // deg\n\n    const radius = diameter / 2;\n\n    const rangeArcStart =\n      arcStart + distanceBetweenRanges * idx + arcForRanges * start;\n    const needConnection =\n      connected && inValueHigherThanRange(value, end, bounds);\n    const rangeArcEnd =\n      rangeArcStart +\n      arcForRanges * (end - start) +\n      (needConnection ? distanceBetweenRanges : 0);\n\n    const { x: rangeStartX, y: rangeStartY } = getCoordinateForArc(\n      radius,\n      rangeArcStart\n    );\n    const { x: rangeEndX, y: rangeEndY } = getCoordinateForArc(\n      radius,\n      rangeArcEnd\n    );\n\n    const calculatedLabelPosition =\n      labelPosition || idx === 0\n        ? \"left\"\n        : idx === totalRanges - 1\n        ? \"right\"\n        : \"top\";\n\n    /* When range will be filled completely. */\n    if (segmented || !valueWithinRange) {\n      const fillColor =\n        (segmented && valueWithinRange) ||\n        (!segmented && inValueHigherThanRange(value, end, bounds))\n          ? color\n          : grey;\n\n      const adjustedRangeArcEnd = needConnection\n        ? rangeArcEnd - distanceBetweenRanges\n        : rangeArcEnd;\n      const { y: adjustedRangeY } = getCoordinateForArc(\n        radius,\n        adjustedRangeArcEnd\n      );\n      const { x: rangeX, y: rangeY } = getCoordinateForArc(\n        radius,\n        (rangeArcStart + adjustedRangeArcEnd) / 2\n      );\n      return (\n        <g>\n          <BaseOutlineArc\n            startX={rangeStartX}\n            startY={rangeStartY}\n            endX={rangeEndX}\n            endY={rangeEndY}\n            startAlpha={rangeArcStart}\n            endAlpha={rangeArcEnd}\n            color={fillColor}\n            radius={radius}\n            width={gaugeWidth}\n          />\n          {!hideLabels && label && (\n            <OutlineMeterLabelPointer\n              diameter={diameter}\n              position={calculatedLabelPosition}\n              distanceFromRanges={distanceFromRanges}\n              isInRange={valueWithinRange}\n              {...((calculatedLabelPosition === \"right\" &&\n                rangeStartY > diameter / 2) ||\n              (calculatedLabelPosition === \"left\" &&\n                adjustedRangeY > diameter / 2)\n                ? {\n                    rangeX,\n                    rangeY,\n                  }\n                : undefined)}\n            />\n          )}\n        </g>\n      );\n    }\n\n    const valueAlpha =\n      rangeArcStart + ((value - start) / (end - start)) * rangeArc;\n\n    const { x: valueX, y: valueY } = getCoordinateForArc(radius, valueAlpha);\n    const valueInnerX = getInnerX(valueX, degToRad(valueAlpha), gaugeWidth);\n    const valueInnerY = getInnerY(valueY, degToRad(valueAlpha), gaugeWidth);\n\n    return (\n      <g>\n        <BaseOutlineArc\n          startX={rangeStartX}\n          startY={rangeStartY}\n          endX={valueX}\n          endY={valueY}\n          startAlpha={rangeArcStart}\n          endAlpha={valueAlpha}\n          color={color}\n          radius={radius}\n          width={gaugeWidth}\n          roundEnd={false}\n        />\n        <BaseOutlineArc\n          startX={valueX}\n          startY={valueY}\n          endX={rangeEndX}\n          endY={rangeEndY}\n          startAlpha={valueAlpha}\n          endAlpha={rangeArcEnd}\n          color={grey}\n          radius={radius}\n          width={gaugeWidth}\n          roundStart={false}\n        />\n        <circle\n          cx={(valueX + valueInnerX) / 2}\n          cy={(valueY + valueInnerY) / 2}\n          r={pointStrokeWidth + innerPointRadius}\n          strokeWidth={pointStrokeWidth}\n          stroke={color}\n          fill=\"white\"\n          ref={pointRef}\n        />\n        {!hideLabels && label && (\n          <OutlineMeterLabelPointer\n            diameter={diameter}\n            isInRange\n            position={calculatedLabelPosition}\n            distanceFromRanges={distanceFromRanges}\n          />\n        )}\n      </g>\n    );\n  }\n);\n"],"names":["OutlineMeterRange","React","props","pointRef","start","end","color","bounds","diameter","arc","distanceBetweenRanges","totalRanges","value","gaugeWidth","segmented","idx","pointStrokeWidth","innerPointRadius","distanceFromRanges","label","labelPosition","hideLabels","connected","grey","arcForRanges","rangeArc","valueWithinRange","isValueInRange","arcStart","radius","rangeArcStart","needConnection","inValueHigherThanRange","rangeArcEnd","rangeStartX","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","calculatedLabelPosition","fillColor","adjustedRangeArcEnd","adjustedRangeY","rangeX","rangeY","jsx","BaseOutlineArc","OutlineMeterLabelPointer","valueAlpha","valueX","valueY","valueInnerX","getInnerX","degToRad","valueInnerY","getInnerY"],"mappings":"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"}
+{"version":3,"file":"sd-component-library208.js","sources":["../src/components/meters/gradient-outline-meter/partials/gradient-meter-needle/gradient-meter-needle.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { BaseNeedle } from \"../../../outline-meter/partials/base-needle\";\nimport {\n  degToRad,\n  getCoordinateForArc,\n  getInnerX,\n  getInnerY,\n} from \"../../../outline-meter/utils\";\nimport { getFractionColor } from \"../../utils\";\nimport { GradientMeterNeedleProps as Props } from \"./interfaces\";\n\nexport const GradientMeterNeedle: React.FC<Props> = (props) => {\n  const {\n    ranges,\n    distanceFromRange,\n    innerCircleRadius,\n    innerCircleStrokeWidth,\n    needleWidth,\n    arc,\n    value,\n    gaugeWidth,\n    diameter,\n    needleColor,\n  } = props;\n  const radius = diameter / 2;\n  const totalRanges = ranges.length;\n  const valueRangeIndex = Math.floor(value * totalRanges);\n  const startColor = ranges[valueRangeIndex][0];\n  const endColor = ranges[valueRangeIndex][1];\n\n  const arcStart = (360 - arc) / 2; // deg\n\n  const rangeArcStart = arcStart + (arc * valueRangeIndex) / totalRanges;\n  const rangeArcEnd = arcStart + (arc * (valueRangeIndex + 1)) / totalRanges;\n  const start = valueRangeIndex / totalRanges;\n  const end = (valueRangeIndex + 1) / totalRanges;\n\n  const { x: rangeStartX, y: rangeStartY } = getCoordinateForArc(\n    radius,\n    rangeArcStart\n  );\n  const { x: rangeEndX, y: rangeEndY } = getCoordinateForArc(\n    radius,\n    rangeArcEnd\n  );\n\n  const valueAlpha =\n    rangeArcStart + (((value - start) / (end - start)) * arc) / ranges.length;\n  const { x: valueX, y: valueY } = getCoordinateForArc(radius, valueAlpha);\n  const needleTipX = getInnerX(\n    valueX,\n    degToRad(valueAlpha),\n    distanceFromRange + gaugeWidth + needleWidth / 2\n  );\n  const needleTipY = getInnerY(\n    valueY,\n    degToRad(valueAlpha),\n    distanceFromRange + gaugeWidth + needleWidth / 2\n  );\n\n  const dx = (needleWidth / 2) * Math.cos(degToRad(valueAlpha));\n  const dy = (needleWidth / 2) * Math.sin(degToRad(valueAlpha));\n\n  const useHorizontalGradient = valueRangeIndex + 1 === totalRanges / 2 + 0.5;\n\n  const fraction = useHorizontalGradient\n    ? (valueX - rangeStartX) / (rangeEndX - rangeStartX)\n    : (valueY - rangeStartY) / (rangeEndY - rangeStartY);\n  const color = getFractionColor(fraction, startColor, endColor);\n\n  return (\n    <BaseNeedle\n      radius={radius}\n      innerCircleRadius={innerCircleRadius}\n      innerCircleStrokeWidth={innerCircleStrokeWidth}\n      needleWidth={needleWidth}\n      color={needleColor || color}\n      dx={dx}\n      dy={dy}\n      tipX={needleTipX}\n      tipY={needleTipY}\n    />\n  );\n};\n"],"names":["GradientMeterNeedle","props","ranges","distanceFromRange","innerCircleRadius","innerCircleStrokeWidth","needleWidth","arc","value","gaugeWidth","diameter","needleColor","radius","totalRanges","valueRangeIndex","startColor","endColor","arcStart","rangeArcStart","rangeArcEnd","start","end","rangeStartX","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","valueAlpha","valueX","valueY","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","dy","fraction","color","getFractionColor","jsx","BaseNeedle"],"mappings":";;;;AAYa,MAAAA,IAAuC,CAACC,MAAU;AACvD,QAAA;AAAA,IACJ,QAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC;AAAA,IACA,YAAAC;AAAA,IACA,UAAAC;AAAA,IACA,aAAAC;AAAA,EACE,IAAAV,GACEW,IAASF,IAAW,GACpBG,IAAcX,EAAO,QACrBY,IAAkB,KAAK,MAAMN,IAAQK,CAAW,GAChDE,IAAab,EAAOY,CAAe,EAAE,CAAC,GACtCE,IAAWd,EAAOY,CAAe,EAAE,CAAC,GAEpCG,KAAY,MAAMV,KAAO,GAEzBW,IAAgBD,IAAYV,IAAMO,IAAmBD,GACrDM,IAAcF,IAAYV,KAAOO,IAAkB,KAAMD,GACzDO,IAAQN,IAAkBD,GAC1BQ,KAAOP,IAAkB,KAAKD,GAE9B,EAAE,GAAGS,GAAa,GAAGC,EAAgB,IAAAC;AAAA,IACzCZ;AAAA,IACAM;AAAA,EAAA,GAEI,EAAE,GAAGO,GAAW,GAAGC,EAAc,IAAAF;AAAA,IACrCZ;AAAA,IACAO;AAAA,EAAA,GAGIQ,IACJT,KAAmBV,IAAQY,MAAUC,IAAMD,KAAUb,IAAOL,EAAO,QAC/D,EAAE,GAAG0B,GAAQ,GAAGC,MAAWL,EAAoBZ,GAAQe,CAAU,GACjEG,IAAaC;AAAA,IACjBH;AAAA,IACAI,EAASL,CAAU;AAAA,IACnBxB,IAAoBM,IAAaH,IAAc;AAAA,EAAA,GAE3C2B,IAAaC;AAAA,IACjBL;AAAA,IACAG,EAASL,CAAU;AAAA,IACnBxB,IAAoBM,IAAaH,IAAc;AAAA,EAAA,GAG3C6B,IAAM7B,IAAc,IAAK,KAAK,IAAI0B,EAASL,CAAU,CAAC,GACtDS,IAAM9B,IAAc,IAAK,KAAK,IAAI0B,EAASL,CAAU,CAAC,GAItDU,IAFwBvB,IAAkB,MAAMD,IAAc,IAAI,OAGnEe,IAASN,MAAgBG,IAAYH,MACrCO,IAASN,MAAgBG,IAAYH,IACpCe,IAAQC,EAAiBF,GAAUtB,GAAYC,CAAQ;AAG3D,SAAAwB,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,QAAA7B;AAAA,MACA,mBAAAR;AAAA,MACA,wBAAAC;AAAA,MACA,aAAAC;AAAA,MACA,OAAOK,KAAe2B;AAAA,MACtB,IAAAH;AAAA,MACA,IAAAC;AAAA,MACA,MAAMN;AAAA,MACN,MAAMG;AAAA,IAAA;AAAA,EAAA;AAGZ;"}

package/lib/sd-component-library209.js

@@ -1,46 +1,27 @@
-import { j as i } from "./sd-component-library169.js";
-import { getInnerX as m, getInnerY as g, getCoordinateForArc as C, degToRad as F } from "./sd-component-library86.js";
-const X = (p) => {
-  const {
-    diameter: l,
-    arc: a,
-    color: u = "#CCD0DB",
-    dashHeight: e,
-    dashWidth: x,
-    numberOfDashes: r,
-    distanceFromRangesToScale: t,
-    gaugeWidth: o
-  } = p, R = l / 2, j = (360 - a) / 2, D = a / (r - 1);
-  return /* @__PURE__ */ i.jsx("g", { children: [...Array(r)].map((I, n) => {
-    const c = j + n * D, { x: d, y: h } = C(R, c), s = F(c), T = m(
-      d,
-      s,
-      o + t
-    ), $ = g(
-      h,
-      s,
-      o + t
-    ), f = m(
-      d,
-      s,
-      o + t + e
-    ), B = g(
-      h,
-      s,
-      o + t + e
-    );
-    return /* @__PURE__ */ i.jsx(
-      "path",
-      {
-        d: `M${T},${$} L${f},${B}`,
-        stroke: u,
-        strokeWidth: x
-      },
-      n
-    );
-  }) });
+import { j as p } from "./sd-component-library169.js";
+const m = (a) => {
+  const { position: s, diameter: t, rangeY: e, rangeX: n, distanceFromRanges: r, isInRange: o } = a;
+  if (o)
+    return null;
+  const { startX: d, startY: i, endX: X, endY: Y } = s === "left" ? {
+    startX: n || 0,
+    startY: e || t / 2 - 0.5,
+    endX: -r,
+    endY: t / 2 - 0.5
+  } : s === "top" ? {
+    startX: n || t / 2,
+    startY: e || 0,
+    endX: t / 2,
+    endY: -r
+  } : {
+    startX: n || t,
+    startY: e || t / 2 - 0.5,
+    endX: t + r,
+    endY: t / 2 - 0.5
+  };
+  return /* @__PURE__ */ p.jsx("path", { d: `M${d},${i} L${X},${Y}`, stroke: "#CCD0DB" });
 };
 export {
-  X as OutlineMeterScale
+  m as OutlineMeterLabelPointer
 };
 //# sourceMappingURL=sd-component-library209.js.map

package/lib/sd-component-library209.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library209.js","sources":["../src/components/meters/outline-meter/partials/outline-meter-scale/outline-meter-scale.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n  degToRad,\n  getCoordinateForArc,\n  getInnerX,\n  getInnerY,\n} from \"../../utils\";\nimport { OutlineMeterScaleProps as Props } from \"./interfaces\";\n\nexport const OutlineMeterScale: React.FC<Props> = (props) => {\n  const {\n    diameter,\n    arc,\n    color = \"#CCD0DB\",\n    dashHeight,\n    dashWidth,\n    numberOfDashes,\n    distanceFromRangesToScale: distanceFromRanges,\n    gaugeWidth,\n  } = props;\n  const radius = diameter / 2;\n\n  const arcStart = (360 - arc) / 2; // deg\n  const degPerDash = arc / (numberOfDashes - 1);\n\n  return (\n    <g>\n      {[...Array(numberOfDashes)].map((_, idx) => {\n        const alpha = arcStart + idx * degPerDash;\n        const { x, y } = getCoordinateForArc(radius, alpha);\n        const alphaInRad = degToRad(alpha);\n        const dashTopX = getInnerX(\n          x,\n          alphaInRad,\n          gaugeWidth + distanceFromRanges\n        );\n        const dashTopY = getInnerY(\n          y,\n          alphaInRad,\n          gaugeWidth + distanceFromRanges\n        );\n        const dashBottomX = getInnerX(\n          x,\n          alphaInRad,\n          gaugeWidth + distanceFromRanges + dashHeight\n        );\n        const dashBottomY = getInnerY(\n          y,\n          alphaInRad,\n          gaugeWidth + distanceFromRanges + dashHeight\n        );\n        return (\n          <path\n            key={idx}\n            d={`M${dashTopX},${dashTopY} L${dashBottomX},${dashBottomY}`}\n            stroke={color}\n            strokeWidth={dashWidth}\n          />\n        );\n      })}\n    </g>\n  );\n};\n"],"names":["OutlineMeterScale","props","diameter","arc","color","dashHeight","dashWidth","numberOfDashes","distanceFromRanges","gaugeWidth","radius","arcStart","degPerDash","jsx","_","idx","alpha","x","y","getCoordinateForArc","alphaInRad","degToRad","dashTopX","getInnerX","dashTopY","getInnerY","dashBottomX","dashBottomY"],"mappings":";;AAUa,MAAAA,IAAqC,CAACC,MAAU;AACrD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,KAAAC;AAAA,IACA,OAAAC,IAAQ;AAAA,IACR,YAAAC;AAAA,IACA,WAAAC;AAAA,IACA,gBAAAC;AAAA,IACA,2BAA2BC;AAAA,IAC3B,YAAAC;AAAA,EACE,IAAAR,GACES,IAASR,IAAW,GAEpBS,KAAY,MAAMR,KAAO,GACzBS,IAAaT,KAAOI,IAAiB;AAGzC,SAAAM,gBAAAA,MAAC,KACE,EAAA,UAAA,CAAC,GAAG,MAAMN,CAAc,CAAC,EAAE,IAAI,CAACO,GAAGC,MAAQ;AACpC,UAAAC,IAAQL,IAAWI,IAAMH,GACzB,EAAE,GAAAK,GAAG,GAAAC,EAAA,IAAMC,EAAoBT,GAAQM,CAAK,GAC5CI,IAAaC,EAASL,CAAK,GAC3BM,IAAWC;AAAA,MACfN;AAAA,MACAG;AAAA,MACAX,IAAaD;AAAA,IAAA,GAETgB,IAAWC;AAAA,MACfP;AAAA,MACAE;AAAA,MACAX,IAAaD;AAAA,IAAA,GAETkB,IAAcH;AAAA,MAClBN;AAAA,MACAG;AAAA,MACAX,IAAaD,IAAqBH;AAAA,IAAA,GAE9BsB,IAAcF;AAAA,MAClBP;AAAA,MACAE;AAAA,MACAX,IAAaD,IAAqBH;AAAA,IAAA;AAGlC,WAAAQ,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QAEC,GAAG,IAAIS,CAAQ,IAAIE,CAAQ,KAAKE,CAAW,IAAIC,CAAW;AAAA,QAC1D,QAAQvB;AAAA,QACR,aAAaE;AAAA,MAAA;AAAA,MAHRS;AAAA,IAAA;AAAA,EAMV,CAAA,EACH,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library209.js","sources":["../src/components/meters/outline-meter/partials/outline-meter-label-pointer/outline-meter-label-pointer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { OutlineMeterLabelPointerProps as Props } from \"./interfaces\";\n\nexport const OutlineMeterLabelPointer: React.FC<Props> = (props) => {\n  const { position, diameter, rangeY, rangeX, distanceFromRanges, isInRange } =\n    props;\n\n  if (isInRange) return null;\n\n  const { startX, startY, endX, endY } =\n    position === \"left\"\n      ? {\n          startX: rangeX || 0,\n          startY: rangeY || diameter / 2 - 0.5,\n          endX: -distanceFromRanges,\n          endY: diameter / 2 - 0.5,\n        }\n      : position === \"top\"\n      ? {\n          startX: rangeX || diameter / 2,\n          startY: rangeY || 0,\n          endX: diameter / 2,\n          endY: -distanceFromRanges,\n        }\n      : {\n          startX: rangeX || diameter,\n          startY: rangeY || diameter / 2 - 0.5,\n          endX: diameter + distanceFromRanges,\n          endY: diameter / 2 - 0.5,\n        };\n\n  return (\n    <path d={`M${startX},${startY} L${endX},${endY}`} stroke={\"#CCD0DB\"} />\n  );\n};\n"],"names":["OutlineMeterLabelPointer","props","position","diameter","rangeY","rangeX","distanceFromRanges","isInRange","startX","startY","endX","endY","jsx"],"mappings":";AAIa,MAAAA,IAA4C,CAACC,MAAU;AAClE,QAAM,EAAE,UAAAC,GAAU,UAAAC,GAAU,QAAAC,GAAQ,QAAAC,GAAQ,oBAAAC,GAAoB,WAAAC,EAC9D,IAAAN;AAEE,MAAAM;AAAkB,WAAA;AAEtB,QAAM,EAAE,QAAAC,GAAQ,QAAAC,GAAQ,MAAAC,GAAM,MAAAC,EAAK,IACjCT,MAAa,SACT;AAAA,IACE,QAAQG,KAAU;AAAA,IAClB,QAAQD,KAAUD,IAAW,IAAI;AAAA,IACjC,MAAM,CAACG;AAAA,IACP,MAAMH,IAAW,IAAI;AAAA,EAAA,IAEvBD,MAAa,QACb;AAAA,IACE,QAAQG,KAAUF,IAAW;AAAA,IAC7B,QAAQC,KAAU;AAAA,IAClB,MAAMD,IAAW;AAAA,IACjB,MAAM,CAACG;AAAA,EAAA,IAET;AAAA,IACE,QAAQD,KAAUF;AAAA,IAClB,QAAQC,KAAUD,IAAW,IAAI;AAAA,IACjC,MAAMA,IAAWG;AAAA,IACjB,MAAMH,IAAW,IAAI;AAAA,EAAA;AAG7B,SACGS,gBAAAA,EAAAA,IAAA,QAAA,EAAK,GAAG,IAAIJ,CAAM,IAAIC,CAAM,KAAKC,CAAI,IAAIC,CAAI,IAAI,QAAQ,UAAW,CAAA;AAEzE;"}

package/lib/sd-component-library21.js

@@ -2,7 +2,7 @@ import { j as r } from "./sd-component-library169.js";
 import { Link as Y } from "react-router-dom";
 import { Button as Z, Flex as tt } from "rebass";
 import { generateTestLocator as ot } from "./sd-component-library4.js";
-import { LoadingSpinner as et } from "./sd-component-library177.js";
+import { LoadingSpinner as et } from "./sd-component-library178.js";
 function rt(t, o, e) {
   return (n) => {
     t == null || t(n), o && (`#${o}` !== window.location.hash && (e != null && e.replace(

package/lib/sd-component-library210.js

@@ -1,50 +1,56 @@
-import { j as k } from "./sd-component-library169.js";
-import { isValueInRange as w, getInnerX as E, getInnerY as O, degToRad as r, getCoordinateForArc as V } from "./sd-component-library86.js";
-import { BaseNeedle as b } from "./sd-component-library270.js";
-const G = (x) => {
+import { j as s } from "./sd-component-library169.js";
+import { useRef as g, useState as $, useEffect as b } from "react";
+import { Box as l } from "rebass";
+import { labelPaddingX as o, labelWidth as u } from "./sd-component-library195.js";
+import { ResponsiveTextV2 as v } from "./sd-component-library135.js";
+const C = (x) => {
   const {
-    diameter: f,
-    value: c,
-    arc: i,
-    ranges: o,
-    useSegmentedBehavior: v,
-    innerCircleRadius: I,
-    innerCircleStrokeWidth: A,
-    distanceFromRange: d,
-    needleWidth: e,
-    needleColor: C,
-    distanceBetweenRanges: l,
-    gaugeWidth: g
-  } = x, a = o.find(
-    ({ start: s, end: y, bounds: N }) => w(c, s, y, N)
-  );
-  if (!a)
-    return null;
-  const u = f / 2, S = (360 - i) / 2, m = i - (o.length - 1) * l, { start: t, end: h, color: X } = a, Y = o.findIndex((s) => s === a), p = m * (h - t), R = S + l * Y + m * t, n = v ? R + p / 2 : R + (c - t) / (h - t) * p, { x: j, y: B } = V(u, n), F = E(
-    j,
-    r(n),
-    d + g + e / 2
-  ), M = O(
-    B,
-    r(n),
-    d + g + e / 2
-  ), T = e / 2 * Math.cos(r(n)), W = e / 2 * Math.sin(r(n));
-  return /* @__PURE__ */ k.jsx(
-    b,
+    position: t,
+    diameter: r,
+    label: d,
+    distanceFromLabelToRanges: p,
+    isInRange: e,
+    color: n
+  } = x, i = g(), [c, a] = $(0);
+  b(() => {
+    i.current && a(i.current.getBoundingClientRect().height);
+  }, [i]);
+  const h = t === "right" ? `${r + p}px` : t === "top" ? `${r / 2}px` : void 0, m = t === "left" ? `${r + p}px` : void 0, f = t === "left" || t === "right" ? `${r / 2}px` : `${-p}px`;
+  return /* @__PURE__ */ s.jsx(l, { sx: { position: "absolute", left: h, top: f, right: m }, children: /* @__PURE__ */ s.jsx(
+    l,
     {
-      dx: T,
-      dy: W,
-      color: C || X,
-      radius: u,
-      tipX: F,
-      tipY: M,
-      innerCircleStrokeWidth: A,
-      innerCircleRadius: I,
-      needleWidth: e
+      sx: {
+        position: "relative",
+        top: `-${c}px`,
+        left: t === "top" ? "-50%" : void 0,
+        py: "7px",
+        px: e ? `${o}px` : "0",
+        borderColor: e ? n : "cl_lightGrey",
+        borderWidth: e ? "2px" : "1pt",
+        borderStyle: e ? "solid" : "none",
+        borderBottomStyle: !e && t === "top" ? "none" : "solid",
+        borderRadius: e ? `${o}px ${o}px ${t !== "left" ? `${o}px` : "0"} ${t !== "right" ? `${o}px` : "0"}` : "0",
+        bg: "cl_white",
+        "& > div": {
+          maxWidth: t === "top" ? void 0 : `${u}px`
+        }
+      },
+      ref: i,
+      children: /* @__PURE__ */ s.jsx(
+        v,
+        {
+          width: "max-content",
+          fontSizeWeight: [[12, "semi-bold"]],
+          color: e && n !== "#CCD0DB" ? n : "cl_darkGrey",
+          textTransform: "uppercase",
+          letterSpacing: "1.8px",
+          children: d
+        }
+      )
     }
-  );
+  ) });
 };
 export {
-  G as OutlineMeterNeedle
+  C as BaseMeterLabelBox
 };
 //# sourceMappingURL=sd-component-library210.js.map

package/lib/sd-component-library210.js.map

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library210.js","sources":["../src/components/meters/outline-meter/partials/outline-meter-needle/outline-meter-needle.tsx"],"sourcesContent":["import React from \"react\";\n\nimport {\n  degToRad,\n  getCoordinateForArc,\n  getInnerX,\n  getInnerY,\n  isValueInRange,\n} from \"../../utils\";\nimport { BaseNeedle } from \"../base-needle\";\nimport { OutlineMeterNeedleProps as Props } from \"./interfaces\";\n\nexport const OutlineMeterNeedle: React.FC<Props> = (props) => {\n  const {\n    diameter,\n    value,\n    arc,\n    ranges,\n    useSegmentedBehavior,\n    innerCircleRadius,\n    innerCircleStrokeWidth,\n    distanceFromRange,\n    needleWidth,\n    needleColor,\n    distanceBetweenRanges,\n    gaugeWidth,\n  } = props;\n\n  const matchingRange = ranges.find(({ start, end, bounds }) =>\n    isValueInRange(value, start, end, bounds)\n  );\n\n  if (!matchingRange) return null;\n\n  const radius = diameter / 2;\n\n  const arcStart = (360 - arc) / 2;\n  const arcForRanges = arc - (ranges.length - 1) * distanceBetweenRanges;\n  const { start, end, color } = matchingRange;\n  const matchingRangeIndex = ranges.findIndex((r) => r === matchingRange);\n  const rangeArc = arcForRanges * (end - start);\n\n  const rangeArcStart =\n    arcStart +\n    distanceBetweenRanges * matchingRangeIndex +\n    arcForRanges * start;\n\n  const valueAlpha = useSegmentedBehavior\n    ? rangeArcStart + rangeArc / 2\n    : rangeArcStart + ((value - start) / (end - start)) * rangeArc;\n  const { x: valueX, y: valueY } = getCoordinateForArc(radius, valueAlpha);\n\n  const needleTipX = getInnerX(\n    valueX,\n    degToRad(valueAlpha),\n    distanceFromRange + gaugeWidth + needleWidth / 2\n  );\n  const needleTipY = getInnerY(\n    valueY,\n    degToRad(valueAlpha),\n    distanceFromRange + gaugeWidth + needleWidth / 2\n  );\n\n  const dx = (needleWidth / 2) * Math.cos(degToRad(valueAlpha));\n  const dy = (needleWidth / 2) * Math.sin(degToRad(valueAlpha));\n\n  return (\n    <BaseNeedle\n      dx={dx}\n      dy={dy}\n      color={needleColor || color}\n      radius={radius}\n      tipX={needleTipX}\n      tipY={needleTipY}\n      innerCircleStrokeWidth={innerCircleStrokeWidth}\n      innerCircleRadius={innerCircleRadius}\n      needleWidth={needleWidth}\n    />\n  );\n};\n"],"names":["OutlineMeterNeedle","props","diameter","value","arc","ranges","useSegmentedBehavior","innerCircleRadius","innerCircleStrokeWidth","distanceFromRange","needleWidth","needleColor","distanceBetweenRanges","gaugeWidth","matchingRange","start","end","bounds","isValueInRange","radius","arcStart","arcForRanges","color","matchingRangeIndex","r","rangeArc","rangeArcStart","valueAlpha","valueX","valueY","getCoordinateForArc","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","dy","jsx","BaseNeedle"],"mappings":";;;AAYa,MAAAA,IAAsC,CAACC,MAAU;AACtD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,KAAAC;AAAA,IACA,QAAAC;AAAA,IACA,sBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,wBAAAC;AAAA,IACA,mBAAAC;AAAA,IACA,aAAAC;AAAA,IACA,aAAAC;AAAA,IACA,uBAAAC;AAAA,IACA,YAAAC;AAAA,EACE,IAAAZ,GAEEa,IAAgBT,EAAO;AAAA,IAAK,CAAC,EAAE,OAAAU,GAAO,KAAAC,GAAK,QAAAC,QAC/CC,EAAef,GAAOY,GAAOC,GAAKC,CAAM;AAAA,EAAA;AAG1C,MAAI,CAACH;AAAsB,WAAA;AAE3B,QAAMK,IAASjB,IAAW,GAEpBkB,KAAY,MAAMhB,KAAO,GACzBiB,IAAejB,KAAOC,EAAO,SAAS,KAAKO,GAC3C,EAAE,OAAAG,GAAO,KAAAC,GAAK,OAAAM,EAAA,IAAUR,GACxBS,IAAqBlB,EAAO,UAAU,CAACmB,MAAMA,MAAMV,CAAa,GAChEW,IAAWJ,KAAgBL,IAAMD,IAEjCW,IACJN,IACAR,IAAwBW,IACxBF,IAAeN,GAEXY,IAAarB,IACfoB,IAAgBD,IAAW,IAC3BC,KAAkBvB,IAAQY,MAAUC,IAAMD,KAAUU,GAClD,EAAE,GAAGG,GAAQ,GAAGC,MAAWC,EAAoBX,GAAQQ,CAAU,GAEjEI,IAAaC;AAAA,IACjBJ;AAAA,IACAK,EAASN,CAAU;AAAA,IACnBlB,IAAoBI,IAAaH,IAAc;AAAA,EAAA,GAE3CwB,IAAaC;AAAA,IACjBN;AAAA,IACAI,EAASN,CAAU;AAAA,IACnBlB,IAAoBI,IAAaH,IAAc;AAAA,EAAA,GAG3C0B,IAAM1B,IAAc,IAAK,KAAK,IAAIuB,EAASN,CAAU,CAAC,GACtDU,IAAM3B,IAAc,IAAK,KAAK,IAAIuB,EAASN,CAAU,CAAC;AAG1D,SAAAW,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAAH;AAAA,MACA,IAAAC;AAAA,MACA,OAAO1B,KAAeW;AAAA,MACtB,QAAAH;AAAA,MACA,MAAMY;AAAA,MACN,MAAMG;AAAA,MACN,wBAAA1B;AAAA,MACA,mBAAAD;AAAA,MACA,aAAAG;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"sd-component-library210.js","sources":["../src/components/meters/outline-meter/partials/base-meter-label-box/base-meter-label-box.tsx"],"sourcesContent":["import React, { useEffect, useRef, useState } from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { ResponsiveTextV2 } from \"../../../../texts/responsive-text-v2\";\nimport { labelPaddingX, labelWidth } from \"../../contants\";\nimport { BaseMeterLabelBoxProps as Props } from \"./interfaces\";\n\nexport const BaseMeterLabelBox: React.FC<Props> = (props) => {\n  const {\n    position,\n    diameter,\n    label,\n    distanceFromLabelToRanges,\n    isInRange,\n    color,\n  } = props;\n  const ref = useRef<HTMLElement>();\n  const [textHeight, setTextHeight] = useState(0);\n\n  useEffect(() => {\n    if (ref.current) setTextHeight(ref.current.getBoundingClientRect().height);\n  }, [ref]);\n\n  const left =\n    position === \"right\"\n      ? `${diameter + distanceFromLabelToRanges}px`\n      : position === \"top\"\n      ? `${diameter / 2}px`\n      : undefined;\n  const right =\n    position === \"left\"\n      ? `${diameter + distanceFromLabelToRanges}px`\n      : undefined;\n  const top =\n    position === \"left\" || position === \"right\"\n      ? `${diameter / 2}px`\n      : `${-distanceFromLabelToRanges}px`;\n\n  return (\n    <Box sx={{ position: \"absolute\", left, top, right }}>\n      <Box\n        sx={{\n          position: \"relative\",\n          top: `-${textHeight}px`,\n          left: position === \"top\" ? \"-50%\" : undefined,\n          py: \"7px\",\n          px: isInRange ? `${labelPaddingX}px` : \"0\",\n          borderColor: isInRange ? color : \"cl_lightGrey\",\n          borderWidth: isInRange ? \"2px\" : \"1pt\",\n          borderStyle: isInRange ? \"solid\" : \"none\",\n          borderBottomStyle:\n            !isInRange && position === \"top\" ? \"none\" : \"solid\",\n          borderRadius: isInRange\n            ? `${labelPaddingX}px ${labelPaddingX}px ${\n                position !== \"left\" ? `${labelPaddingX}px` : \"0\"\n              } ${position !== \"right\" ? `${labelPaddingX}px` : \"0\"}`\n            : \"0\",\n          bg: \"cl_white\",\n          \"& > div\": {\n            maxWidth: position === \"top\" ? undefined : `${labelWidth}px`,\n          },\n        }}\n        ref={ref}\n      >\n        <ResponsiveTextV2\n          width=\"max-content\"\n          fontSizeWeight={[[12, \"semi-bold\"]]}\n          color={isInRange && color !== \"#CCD0DB\" ? color : \"cl_darkGrey\"}\n          textTransform=\"uppercase\"\n          letterSpacing=\"1.8px\"\n        >\n          {label}\n        </ResponsiveTextV2>\n      </Box>\n    </Box>\n  );\n};\n"],"names":["BaseMeterLabelBox","props","position","diameter","label","distanceFromLabelToRanges","isInRange","color","ref","useRef","textHeight","setTextHeight","useState","useEffect","left","right","top","jsx","Box","labelPaddingX","labelWidth","ResponsiveTextV2"],"mappings":";;;;;AAQa,MAAAA,IAAqC,CAACC,MAAU;AACrD,QAAA;AAAA,IACJ,UAAAC;AAAA,IACA,UAAAC;AAAA,IACA,OAAAC;AAAA,IACA,2BAAAC;AAAA,IACA,WAAAC;AAAA,IACA,OAAAC;AAAA,EACE,IAAAN,GACEO,IAAMC,KACN,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC;AAE9C,EAAAC,EAAU,MAAM;AACd,IAAIL,EAAI,WAASG,EAAcH,EAAI,QAAQ,sBAAsB,EAAE,MAAM;AAAA,EAAA,GACxE,CAACA,CAAG,CAAC;AAER,QAAMM,IACJZ,MAAa,UACT,GAAGC,IAAWE,CAAyB,OACvCH,MAAa,QACb,GAAGC,IAAW,CAAC,OACf,QACAY,IACJb,MAAa,SACT,GAAGC,IAAWE,CAAyB,OACvC,QACAW,IACJd,MAAa,UAAUA,MAAa,UAChC,GAAGC,IAAW,CAAC,OACf,GAAG,CAACE,CAAyB;AAGjC,SAAAY,gBAAAA,MAACC,KAAI,IAAI,EAAE,UAAU,YAAY,MAAAJ,GAAM,KAAAE,GAAK,OAAAD,EAC1C,GAAA,UAAAE,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,IAAI;AAAA,QACF,UAAU;AAAA,QACV,KAAK,IAAIR,CAAU;AAAA,QACnB,MAAMR,MAAa,QAAQ,SAAS;AAAA,QACpC,IAAI;AAAA,QACJ,IAAII,IAAY,GAAGa,CAAa,OAAO;AAAA,QACvC,aAAab,IAAYC,IAAQ;AAAA,QACjC,aAAaD,IAAY,QAAQ;AAAA,QACjC,aAAaA,IAAY,UAAU;AAAA,QACnC,mBACE,CAACA,KAAaJ,MAAa,QAAQ,SAAS;AAAA,QAC9C,cAAcI,IACV,GAAGa,CAAa,MAAMA,CAAa,MACjCjB,MAAa,SAAS,GAAGiB,CAAa,OAAO,GAC/C,IAAIjB,MAAa,UAAU,GAAGiB,CAAa,OAAO,GAAG,KACrD;AAAA,QACJ,IAAI;AAAA,QACJ,WAAW;AAAA,UACT,UAAUjB,MAAa,QAAQ,SAAY,GAAGkB,CAAU;AAAA,QAC1D;AAAA,MACF;AAAA,MACA,KAAAZ;AAAA,MAEA,UAAAS,gBAAAA,EAAA;AAAA,QAACI;AAAA,QAAA;AAAA,UACC,OAAM;AAAA,UACN,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC;AAAA,UAClC,OAAOf,KAAaC,MAAU,YAAYA,IAAQ;AAAA,UAClD,eAAc;AAAA,UACd,eAAc;AAAA,UAEb,UAAAH;AAAA,QAAA;AAAA,MACH;AAAA,IAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library211.js

@@ -1,11 +1,132 @@
-import { j as m } from "./sd-component-library169.js";
-import { isValueInRange as x } from "./sd-component-library86.js";
-import { BaseMeterLabelBox as u } from "./sd-component-library219.js";
-const g = (t) => {
-  const { value: o, idx: e, totalRanges: n, start: s, end: r, bounds: a } = t, i = x(o, s, r, a), l = e === 0 ? "left" : e === n - 1 ? "right" : "top";
-  return /* @__PURE__ */ m.jsx(u, { isInRange: i, position: l, ...t });
-};
+import { j as e } from "./sd-component-library169.js";
+import U from "react";
+import { isValueInRange as Z, inValueHigherThanRange as F, getCoordinateForArc as d, getInnerX as $, getInnerY as tt, degToRad as L } from "./sd-component-library86.js";
+import { BaseOutlineArc as X } from "./sd-component-library267.js";
+import { OutlineMeterLabelPointer as O } from "./sd-component-library209.js";
+const st = U.forwardRef(
+  (D, M) => {
+    const {
+      start: n,
+      end: r,
+      color: x,
+      bounds: R,
+      diameter: o,
+      arc: v,
+      distanceBetweenRanges: l,
+      totalRanges: y,
+      value: g,
+      gaugeWidth: s,
+      segmented: f,
+      idx: m,
+      pointStrokeWidth: I,
+      innerPointRadius: T,
+      distanceFromRanges: b,
+      label: w,
+      labelPosition: V,
+      hideLabels: E,
+      connected: _
+    } = D, S = "#CCD0DB", A = v - (y - 1) * l, H = A * (r - n), Y = Z(g, n, r, R), q = (360 - v) / 2, t = o / 2, a = q + l * m + A * n, C = _ && F(g, r, R), i = a + A * (r - n) + (C ? l : 0), { x: P, y: j } = d(
+      t,
+      a
+    ), { x: W, y: k } = d(
+      t,
+      i
+    ), u = V || m === 0 ? "left" : m === y - 1 ? "right" : "top";
+    if (f || !Y) {
+      const J = f && Y || !f && F(g, r, R) ? x : S, B = C ? i - l : i, { y: K } = d(
+        t,
+        B
+      ), { x: N, y: Q } = d(
+        t,
+        (a + B) / 2
+      );
+      return /* @__PURE__ */ e.jsxs("g", { children: [
+        /* @__PURE__ */ e.jsx(
+          X,
+          {
+            startX: P,
+            startY: j,
+            endX: W,
+            endY: k,
+            startAlpha: a,
+            endAlpha: i,
+            color: J,
+            radius: t,
+            width: s
+          }
+        ),
+        !E && w && /* @__PURE__ */ e.jsx(
+          O,
+          {
+            diameter: o,
+            position: u,
+            distanceFromRanges: b,
+            isInRange: Y,
+            ...u === "right" && j > o / 2 || u === "left" && K > o / 2 ? {
+              rangeX: N,
+              rangeY: Q
+            } : void 0
+          }
+        )
+      ] });
+    }
+    const c = a + (g - n) / (r - n) * H, { x: h, y: p } = d(t, c), z = $(h, L(c), s), G = tt(p, L(c), s);
+    return /* @__PURE__ */ e.jsxs("g", { children: [
+      /* @__PURE__ */ e.jsx(
+        X,
+        {
+          startX: P,
+          startY: j,
+          endX: h,
+          endY: p,
+          startAlpha: a,
+          endAlpha: c,
+          color: x,
+          radius: t,
+          width: s,
+          roundEnd: !1
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        X,
+        {
+          startX: h,
+          startY: p,
+          endX: W,
+          endY: k,
+          startAlpha: c,
+          endAlpha: i,
+          color: S,
+          radius: t,
+          width: s,
+          roundStart: !1
+        }
+      ),
+      /* @__PURE__ */ e.jsx(
+        "circle",
+        {
+          cx: (h + z) / 2,
+          cy: (p + G) / 2,
+          r: I + T,
+          strokeWidth: I,
+          stroke: x,
+          fill: "white",
+          ref: M
+        }
+      ),
+      !E && w && /* @__PURE__ */ e.jsx(
+        O,
+        {
+          diameter: o,
+          isInRange: !0,
+          position: u,
+          distanceFromRanges: b
+        }
+      )
+    ] });
+  }
+);
 export {
-  g as OutlineMeterLabelBox
+  st as OutlineMeterRange
 };
 //# sourceMappingURL=sd-component-library211.js.map