@selfdecode/sd-component-library 4.0.73-vite13 → 4.0.73-vite15

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library249.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","current","getBoundingClientRect","height","left","undefined","right","top","jsx","Box","py","px","labelPaddingX","borderColor","borderWidth","borderStyle","borderBottomStyle","borderRadius","bg","maxWidth","labelWidth","ResponsiveTextV2"],"mappings":";;;;;;AAQO,MAAMA,IAAsCC,CAAUA,MAAA;AACrD,QAAA;AAAA,IACJC,UAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,2BAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,OAAAA;AAAAA,EACEN,IAAAA,GACEO,IAAMC,KACN,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC;AAE9CC,EAAAA,EAAU,MAAM;AACd,IAAIL,EAAIM,WAASH,EAAcH,EAAIM,QAAQC,sBAAsB,EAAEC,MAAM;AAAA,EAAA,GACxE,CAACR,CAAG,CAAC;AAER,QAAMS,IACJf,MAAa,UACR,GAAEC,IAAWE,CAA0B,OACxCH,MAAa,QACZ,GAAEC,IAAW,CAAE,OAChBe,QACAC,IACJjB,MAAa,SACR,GAAEC,IAAWE,CAA0B,OACxCa,QACAE,IACJlB,MAAa,UAAUA,MAAa,UAC/B,GAAEC,IAAW,CAAE,OACf,GAAE,CAACE,CAA0B;AAGlC,SAAA,gBAAAgB,EAACC,KAAI,IAAI;AAAA,IAAEpB,UAAU;AAAA,IAAYe,MAAAA;AAAAA,IAAMG,KAAAA;AAAAA,IAAKD,OAAAA;AAAAA,EAAM,GAChD,UAAC,gBAAAE,EAAAC,GAAA,EACC,IAAI;AAAA,IACFpB,UAAU;AAAA,IACVkB,KAAM,IAAGV,CAAW;AAAA,IACpBO,MAAMf,MAAa,QAAQ,SAASgB;AAAAA,IACpCK,IAAI;AAAA,IACJC,IAAIlB,IAAa,GAAEmB,CAAc,OAAM;AAAA,IACvCC,aAAapB,IAAYC,IAAQ;AAAA,IACjCoB,aAAarB,IAAY,QAAQ;AAAA,IACjCsB,aAAatB,IAAY,UAAU;AAAA,IACnCuB,mBACE,CAACvB,KAAaJ,MAAa,QAAQ,SAAS;AAAA,IAC9C4B,cAAcxB,IACT,GAAEmB,CAAc,MAAKA,CAAc,MAClCvB,MAAa,SAAU,GAAEuB,CAAc,OAAM,GAC9C,IAAGvB,MAAa,UAAW,GAAEuB,CAAc,OAAM,GAAI,KACtD;AAAA,IACJM,IAAI;AAAA,IACJ,WAAW;AAAA,MACTC,UAAU9B,MAAa,QAAQgB,SAAa,GAAEe,CAAW;AAAA,IAC3D;AAAA,EACF,GACA,KAAAzB,GAEA,UAAA,gBAAAa,EAACa,GACC,EAAA,OAAM,eACN,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC,GAClC,OAAO5B,KAAaC,MAAU,YAAYA,IAAQ,eAClD,eAAc,aACd,eAAc,SAEbH,UACHA,EAAA,CAAA,EACF,CAAA,EACF,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library249.js","sources":["../src/components/meters/gradient-outline-meter/utils.ts"],"sourcesContent":["import { OutlineMeterLabelPosition } from \"../outline-meter\";\n\nconst pair = <T>(a: T, b: T): [T, T] => [a, b];\n\n/**\n * Returns an array of mapped adjacent elements into pairs.\n */\nexport const mapAdjacent = function* <T>(iter: T[] = []) {\n  while (iter.length > 1) {\n    yield pair<T>(iter[0], iter[1]);\n    iter = iter.slice(1);\n  }\n};\n\n/**\n * @param fraction numerical value from 0 to 1.\n * @param lowColor initial color of the gradient.\n * @param topColor final color of the gradient.\n * @returns color of gradient at specified fraction point or empty string\n */\nexport const getFractionColor = (\n  fraction: number,\n  lowColor?: string,\n  topColor?: string\n): string => {\n  if (lowColor && !topColor) return lowColor;\n  if (!lowColor && topColor) return topColor;\n  if (lowColor && topColor) {\n    const lowRGB = hexToRGB(lowColor);\n    const topRGB = hexToRGB(topColor);\n    const resultRGB = lowRGB!.map((component, i) => {\n      return Math.round(component * (1 - fraction) + topRGB![i] * fraction);\n    });\n    return resultRGB ? rgbToHex(resultRGB[0], resultRGB[1], resultRGB[2]) : \"\";\n  }\n  return \"\";\n};\n\n/**\n * Converts rgb color representation into hex representation.\n * @param red component of color.\n * @param green component of color.\n * @param blue component of color.\n */\nconst rgbToHex = (red: number, green: number, blue: number): string => {\n  const BITS_IN_BYTE = 8;\n  return (\n    \"#\" +\n    (\n      (1 << (3 * BITS_IN_BYTE)) +\n      (red << (2 * BITS_IN_BYTE)) +\n      (green << BITS_IN_BYTE) +\n      blue\n    )\n      .toString(16)\n      .slice(1)\n  );\n};\n\n/**\n * Converts hex representation of color into rgb.\n * @param hex complete and correct representation of color\n */\nconst hexToRGB = (hex: string) => {\n  const normal = hex.match(/^#([0-9a-f]{2})([0-9a-f]{2})([0-9a-f]{2})$/i);\n  return normal ? normal.slice(1).map((e) => parseInt(e, 16)) : null;\n};\n\nexport const isLabelActive = (\n  value: number,\n  totalColors: number,\n  position: OutlineMeterLabelPosition\n) =>\n  Math.floor(value * totalColors) ===\n  (position === \"left\" ? 0 : position === \"right\" ? totalColors - 1 : 1);\n\n/**\n * Mirrors entered position for outline meter label.\n */\nexport const flipPosition = (position: OutlineMeterLabelPosition) =>\n  position === \"left\" ? \"right\" : position === \"top\" ? \"top\" : \"left\";\n"],"names":["pair","a","b","mapAdjacent","iter","length","slice","getFractionColor","fraction","lowColor","topColor","lowRGB","hexToRGB","topRGB","resultRGB","map","component","i","Math","round","rgbToHex","red","green","blue","BITS_IN_BYTE","toString","hex","normal","match","e","parseInt","isLabelActive","value","totalColors","position","floor","flipPosition"],"mappings":"AAEA,MAAMA,IAAO,CAAIC,GAAMC,MAAiB,CAACD,GAAGC,CAAC,GAKhCC,IAAc,WAAcC,IAAY,IAAI;AAChDA,SAAAA,EAAKC,SAAS;AACnB,UAAML,EAAQI,EAAK,CAAC,GAAGA,EAAK,CAAC,CAAC,GACvBA,IAAAA,EAAKE,MAAM,CAAC;AAEvB,GAQaC,IAAmBA,CAC9BC,GACAC,GACAC,MACW;AACX,MAAID,KAAY,CAACC;AAAiBD,WAAAA;AAClC,MAAI,CAACA,KAAYC;AAAiBA,WAAAA;AAClC,MAAID,KAAYC,GAAU;AAClBC,UAAAA,IAASC,EAASH,CAAQ,GAC1BI,IAASD,EAASF,CAAQ,GAC1BI,IAAYH,EAAQI,IAAI,CAACC,GAAWC,MACjCC,KAAKC,MAAMH,KAAa,IAAIR,KAAYK,EAAQI,CAAC,IAAIT,CAAQ,CACrE;AACMM,WAAAA,IAAYM,EAASN,EAAU,CAAC,GAAGA,EAAU,CAAC,GAAGA,EAAU,CAAC,CAAC,IAAI;AAAA,EAC1E;AACO,SAAA;AACT,GAQMM,IAAWA,CAACC,GAAaC,GAAeC,MAG1C,OAEG,YACAF,KAAQ,OACRC,KAASE,KACVD,GAECE,SAAS,EAAE,EACXnB,MAAM,CAAC,GAQRM,IAAWA,CAACc,MAAgB;AAC1BC,QAAAA,IAASD,EAAIE,MAAM,6CAA6C;AAC/DD,SAAAA,IAASA,EAAOrB,MAAM,CAAC,EAAES,IAAKc,CAAAA,MAAMC,SAASD,GAAG,EAAE,CAAC,IAAI;AAChE,GAEaE,IAAgBA,CAC3BC,GACAC,GACAC,MAEAhB,KAAKiB,MAAMH,IAAQC,CAAW,OAC7BC,MAAa,SAAS,IAAIA,MAAa,UAAUD,IAAc,IAAI,IAKzDG,IAAeA,CAACF,MAC3BA,MAAa,SAAS,UAAUA,MAAa,QAAQ,QAAQ;"}

package/lib/sd-component-library25.js

@@ -1,30 +1,30 @@
-import { jsxs as s, jsx as r } from "./sd-component-library195.js";
-import { Label as d } from "./sd-component-library213.js";
+import { j as r } from "./sd-component-library195.js";
+import { Label as m } from "./sd-component-library213.js";
 import "./sd-component-library198.js";
-import { Button as c } from "./sd-component-library28.js";
-import { ThirteenBold as m } from "./sd-component-library151.js";
-import { Box as p } from "./sd-component-library199.js";
-const g = (i) => {
+import { Button as p } from "./sd-component-library28.js";
+import { Box as x } from "./sd-component-library199.js";
+import { ThirteenBold as b } from "./sd-component-library151.js";
+const O = (o) => {
   const {
-    children: n,
-    label: o,
+    children: i,
+    label: t,
     color: e = "cl_blue",
-    reverseOrder: t,
+    reverseOrder: n,
     hideLabelOnMobile: l,
-    disabled: a
-  } = i;
-  return /* @__PURE__ */ s(c, { ...i, variant: "_icon", color: e, fill: e, "data-test": "icon-button", children: [
-    o && /* @__PURE__ */ r(p, { sx: {
-      order: t ? 1 : 0,
-      marginLeft: t ? "10px" : "0",
-      display: [l ? "none" : "inline", "inline"]
-    }, children: /* @__PURE__ */ r(m, { color: e, textTransform: "uppercase", letterSpacing: ["1.3px"], children: /* @__PURE__ */ r(d, { variant: "_labels.iconButton", sx: {
-      cursor: a ? "default" : "pointer"
-    }, children: o }) }) }),
-    n
+    disabled: s
+  } = o, a = n ? 1 : 0, c = l ? "none" : "inline", d = n ? "10px" : "0";
+  return /* @__PURE__ */ r.jsxs(p, { ...o, variant: "_icon", color: e, fill: e, "data-test": "icon-button", children: [
+    t && /* @__PURE__ */ r.jsx(x, { sx: {
+      order: a,
+      marginLeft: d,
+      display: [c, "inline"]
+    }, children: /* @__PURE__ */ r.jsx(b, { color: e, textTransform: "uppercase", letterSpacing: ["1.3px"], children: /* @__PURE__ */ r.jsx(m, { variant: "_labels.iconButton", sx: {
+      cursor: s ? "default" : "pointer"
+    }, children: t }) }) }),
+    i
   ] });
 };
 export {
-  g as IconButton
+  O as IconButton
 };
 //# sourceMappingURL=sd-component-library25.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library25.js","sources":["../src/components/buttons/partials/icon-button/icon-button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Label } from \"@rebass/forms\";\nimport { Box } from \"rebass\";\n\nimport { ThirteenBold } from \"../../../texts/thirteen-bold\";\nimport { Button } from \"../../button\";\nimport { IconButtonProps } from \"./interfaces\";\n\n/**\n * The icon button.\n */\nexport const IconButton: React.FC<IconButtonProps> = (props) => {\n  const {\n    children,\n    label,\n    color = \"cl_blue\",\n    reverseOrder,\n    hideLabelOnMobile,\n    disabled,\n  } = props;\n\n  const itemsOrder = reverseOrder ? 1 : 0;\n  const labelMobileDisplay = hideLabelOnMobile ? \"none\" : \"inline\";\n\n  // margin between icon and label disappears when order is reversed\n  const reversedOrderMargin = reverseOrder ? \"10px\" : \"0\";\n  return (\n    <Button\n      {...props}\n      variant=\"_icon\"\n      color={color}\n      fill={color}\n      data-test=\"icon-button\"\n    >\n      {label && (\n        <Box\n          sx={{\n            order: itemsOrder,\n            marginLeft: reversedOrderMargin,\n            display: [labelMobileDisplay, \"inline\"],\n          }}\n        >\n          <ThirteenBold\n            color={color}\n            textTransform=\"uppercase\"\n            letterSpacing={[\"1.3px\"]}\n          >\n            <Label\n              variant={\"_labels.iconButton\"}\n              sx={{ cursor: disabled ? \"default\" : \"pointer\" }}\n            >\n              {label}\n            </Label>\n          </ThirteenBold>\n        </Box>\n      )}\n      {children}\n    </Button>\n  );\n};\n"],"names":["IconButton","props","children","label","color","reverseOrder","hideLabelOnMobile","disabled","jsxs","Button","jsx","Box","order","marginLeft","display","ThirteenBold","Label","cursor"],"mappings":";;;;;;AAYO,MAAMA,IAAyCC,CAAUA,MAAA;AACxD,QAAA;AAAA,IACJC,UAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,OAAAA,IAAQ;AAAA,IACRC,cAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,UAAAA;AAAAA,EACEN,IAAAA;AAQF,SAAA,gBAAAO,EAACC,GACKR,EAAAA,GAAAA,GACJ,SAAQ,SACR,OAAAG,GACA,MAAMA,GACN,aAAU,eAETD,UAAAA;AAAAA,IACCA,KAAA,gBAAAO,EAACC,KACC,IAAI;AAAA,MACFC,OAhBSP,IAAe,IAAI;AAAA,MAiB5BQ,YAbkBR,IAAe,SAAS;AAAA,MAc1CS,SAAS,CAjBQR,IAAoB,SAAS,UAiBhB,QAAQ;AAAA,IAAA,GAGxC,UAAA,gBAAAI,EAACK,GACC,EAAA,OAAAX,GACA,eAAc,aACd,eAAe,CAAC,OAAO,GAEvB,UAAA,gBAAAM,EAACM,GACC,EAAA,SAAS,sBACT,IAAI;AAAA,MAAEC,QAAQV,IAAW,YAAY;AAAA,IAAU,GAE9CJ,UACHA,GAAA,EAAA,CACF,EACF,CAAA;AAAA,IAEDD;AAAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library25.js","sources":["../src/components/buttons/partials/icon-button/icon-button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Label } from \"@rebass/forms\";\nimport { Box } from \"rebass\";\n\nimport { ThirteenBold } from \"../../../texts/thirteen-bold\";\nimport { Button } from \"../../button\";\nimport { IconButtonProps } from \"./interfaces\";\n\n/**\n * The icon button.\n */\nexport const IconButton: React.FC<IconButtonProps> = (props) => {\n  const {\n    children,\n    label,\n    color = \"cl_blue\",\n    reverseOrder,\n    hideLabelOnMobile,\n    disabled,\n  } = props;\n\n  const itemsOrder = reverseOrder ? 1 : 0;\n  const labelMobileDisplay = hideLabelOnMobile ? \"none\" : \"inline\";\n\n  // margin between icon and label disappears when order is reversed\n  const reversedOrderMargin = reverseOrder ? \"10px\" : \"0\";\n  return (\n    <Button\n      {...props}\n      variant=\"_icon\"\n      color={color}\n      fill={color}\n      data-test=\"icon-button\"\n    >\n      {label && (\n        <Box\n          sx={{\n            order: itemsOrder,\n            marginLeft: reversedOrderMargin,\n            display: [labelMobileDisplay, \"inline\"],\n          }}\n        >\n          <ThirteenBold\n            color={color}\n            textTransform=\"uppercase\"\n            letterSpacing={[\"1.3px\"]}\n          >\n            <Label\n              variant={\"_labels.iconButton\"}\n              sx={{ cursor: disabled ? \"default\" : \"pointer\" }}\n            >\n              {label}\n            </Label>\n          </ThirteenBold>\n        </Box>\n      )}\n      {children}\n    </Button>\n  );\n};\n"],"names":["IconButton","props","children","label","color","reverseOrder","hideLabelOnMobile","disabled","itemsOrder","labelMobileDisplay","reversedOrderMargin","jsxs","Button","jsx","Box","order","marginLeft","display","ThirteenBold","Label","cursor"],"mappings":";;;;;;AAYO,MAAMA,IAAyCC,CAAUA,MAAA;AACxD,QAAA;AAAA,IACJC,UAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,OAAAA,IAAQ;AAAA,IACRC,cAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,UAAAA;AAAAA,EACEN,IAAAA,GAEEO,IAAaH,IAAe,IAAI,GAChCI,IAAqBH,IAAoB,SAAS,UAGlDI,IAAsBL,IAAe,SAAS;AAElD,SAAAM,gBAAAA,EAAA,KAACC,GACKX,EAAAA,GAAAA,GACJ,SAAQ,SACR,OAAAG,GACA,MAAMA,GACN,aAAU,eAETD,UAAAA;AAAAA,IACCA,KAAAU,gBAAAA,EAAA,IAACC,KACC,IAAI;AAAA,MACFC,OAAOP;AAAAA,MACPQ,YAAYN;AAAAA,MACZO,SAAS,CAACR,GAAoB,QAAQ;AAAA,IAAA,GAGxC,UAAAI,gBAAAA,EAAAA,IAACK,GACC,EAAA,OAAAd,GACA,eAAc,aACd,eAAe,CAAC,OAAO,GAEvB,UAAAS,gBAAAA,MAACM,GACC,EAAA,SAAS,sBACT,IAAI;AAAA,MAAEC,QAAQb,IAAW,YAAY;AAAA,IAAU,GAE9CJ,UACHA,GAAA,EAAA,CACF,EACF,CAAA;AAAA,IAEDD;AAAAA,EACH,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library250.js

@@ -1,32 +1,62 @@
-import { jsx as j } from "./sd-component-library195.js";
-import { getInnerX as k, degToRad as s, getInnerY as B, getCoordinateForArc as i } from "./sd-component-library89.js";
-import { getFractionColor as b } from "./sd-component-library246.js";
-import { BaseNeedle as q } from "./sd-component-library672.js";
-const O = (X) => {
+import { j as t } from "./sd-component-library195.js";
+import { getCoordinateForArc as A, getInnerX as H, getInnerY as M, degToRad as E } from "./sd-component-library89.js";
+import { getFractionColor as O } from "./sd-component-library249.js";
+import { BaseOutlineArc as X } from "./sd-component-library655.js";
+const w = "#CCD0DB", q = (G) => {
   const {
-    ranges: r,
-    distanceFromRange: d,
-    innerCircleRadius: Y,
-    innerCircleStrokeWidth: v,
-    needleWidth: n,
-    arc: a,
-    value: l,
-    gaugeWidth: g,
-    diameter: R,
-    needleColor: S
-  } = X, c = R / 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, M = u + a * (t + 1) / e, p = t / e, E = (t + 1) / e, {
-    x: h,
-    y: x
-  } = i(c, m), {
-    x: F,
-    y: G
-  } = i(c, M), o = m + (l - p) / (E - p) * a / r.length, {
-    x: C,
-    y: f
-  } = i(c, o), I = k(C, s(o), d + g + n / 2), T = B(f, s(o), d + g + n / 2), W = n / 2 * Math.cos(s(o)), z = n / 2 * Math.sin(s(o)), H = t + 1 === e / 2 + 0.5 ? (C - h) / (F - h) : (f - x) / (G - x), N = b(H, y, A);
-  return /* @__PURE__ */ j(q, { radius: c, innerCircleRadius: Y, innerCircleStrokeWidth: v, needleWidth: n, color: S || N, dx: W, dy: z, tipX: I, tipY: T });
+    diameter: I,
+    idx: d,
+    endColor: Y,
+    startColor: f,
+    segmented: v,
+    totalRanges: n,
+    value: i,
+    arc: l,
+    innerPointRadius: W,
+    pointStrokeWidth: C,
+    gaugeWidth: e,
+    pointColor: $
+  } = G, c = d / n, x = (d + 1) / n, k = i >= c && i <= x, R = (360 - l) / 2, r = I / 2, g = R + l * c, j = R + l * x, {
+    x: u,
+    y: h
+  } = A(r, g), {
+    x: m,
+    y
+  } = A(r, j);
+  if (v || !k)
+    return /* @__PURE__ */ t.jsx(X, { startX: u, startY: h, endX: m, endY: y, startAlpha: g, endAlpha: j, color: v || i > x ? `url(#gradient-${f}-${Y})` : w, radius: r, width: e });
+  const o = g + (i - c) / (x - c) * l / n, {
+    x: a,
+    y: s
+  } = A(r, o), F = H(a, E(o), e), B = M(s, E(o), e), D = d >= n / 2, S = d + 1 === n / 2 + 0.5, z = S ? (a - u) / (m - u) : (s - h) / (y - h), p = O(z, f, Y);
+  return /* @__PURE__ */ t.jsxs(t.Fragment, { children: [
+    /* @__PURE__ */ t.jsx("defs", { children: /* @__PURE__ */ t.jsxs("linearGradient", { id: `value-gradient-${p}`, ...D ? {
+      x1: 0,
+      y1: 0,
+      x2: 0,
+      y2: 1
+    } : S ? {
+      x1: 0,
+      y1: 0,
+      x2: 1,
+      y2: 0
+    } : {
+      x1: 0,
+      y1: 1,
+      x2: 0,
+      y2: 0
+    }, children: [
+      /* @__PURE__ */ t.jsx("stop", { stopColor: f, offset: "0%" }),
+      /* @__PURE__ */ t.jsx("stop", { stopColor: p, offset: "100%" })
+    ] }) }),
+    /* @__PURE__ */ t.jsxs("g", { children: [
+      /* @__PURE__ */ t.jsx(X, { startX: u, startY: h, endX: a, endY: s, startAlpha: g, endAlpha: o, color: `url(#value-gradient-${p})`, radius: r, width: e, roundEnd: !1 }),
+      /* @__PURE__ */ t.jsx(X, { startX: a, startY: s, endX: m, endY: y, startAlpha: o, endAlpha: j, color: w, radius: r, width: e, roundStart: !1 }),
+      /* @__PURE__ */ t.jsx("circle", { cx: (a + F) / 2, cy: (s + B) / 2, r: C + W, strokeWidth: C, stroke: $ || p, fill: "white" })
+    ] })
+  ] });
 };
 export {
-  O as GradientMeterNeedle
+  q as GradientMeterRange
 };
 //# sourceMappingURL=sd-component-library250.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library250.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","length","valueRangeIndex","Math","floor","startColor","endColor","arcStart","rangeArcStart","rangeArcEnd","start","end","x","rangeStartX","y","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","valueAlpha","valueX","valueY","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","cos","dy","sin","fraction","color","getFractionColor","jsx","BaseNeedle"],"mappings":";;;;AAYO,MAAMA,IAAwCC,CAAUA,MAAA;AACvD,QAAA;AAAA,IACJC,QAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,wBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,aAAAA;AAAAA,EACEV,IAAAA,GACEW,IAASF,IAAW,GACpBG,IAAcX,EAAOY,QACrBC,IAAkBC,KAAKC,MAAMT,IAAQK,CAAW,GAChDK,IAAahB,EAAOa,CAAe,EAAE,CAAC,GACtCI,IAAWjB,EAAOa,CAAe,EAAE,CAAC,GAEpCK,KAAY,MAAMb,KAAO,GAEzBc,IAAgBD,IAAYb,IAAMQ,IAAmBF,GACrDS,IAAcF,IAAYb,KAAOQ,IAAkB,KAAMF,GACzDU,IAAQR,IAAkBF,GAC1BW,KAAOT,IAAkB,KAAKF,GAE9B;AAAA,IAAEY,GAAGC;AAAAA,IAAaC,GAAGC;AAAAA,EAAAA,IAAgBC,EACzCjB,GACAS,CACF,GACM;AAAA,IAAEI,GAAGK;AAAAA,IAAWH,GAAGI;AAAAA,EAAAA,IAAcF,EACrCjB,GACAU,CACF,GAEMU,IACJX,KAAmBb,IAAQe,MAAUC,IAAMD,KAAUhB,IAAOL,EAAOY,QAC/D;AAAA,IAAEW,GAAGQ;AAAAA,IAAQN,GAAGO;AAAAA,EAAAA,IAAWL,EAAoBjB,GAAQoB,CAAU,GACjEG,IAAaC,EACjBH,GACAI,EAASL,CAAU,GACnB7B,IAAoBM,IAAaH,IAAc,CACjD,GACMgC,IAAaC,EACjBL,GACAG,EAASL,CAAU,GACnB7B,IAAoBM,IAAaH,IAAc,CACjD,GAEMkC,IAAMlC,IAAc,IAAKU,KAAKyB,IAAIJ,EAASL,CAAU,CAAC,GACtDU,IAAMpC,IAAc,IAAKU,KAAK2B,IAAIN,EAASL,CAAU,CAAC,GAItDY,IAFwB7B,IAAkB,MAAMF,IAAc,IAAI,OAGnEoB,IAASP,MAAgBI,IAAYJ,MACrCQ,IAASN,MAAgBG,IAAYH,IACpCiB,IAAQC,EAAiBF,GAAU1B,GAAYC,CAAQ;AAE7D,SACG,gBAAA4B,EAAAC,GAAA,EACC,QAAApC,GACA,mBAAAR,GACA,wBAAAC,GACA,aAAAC,GACA,OAAOK,KAAekC,GACtB,IAAAL,GACA,IAAAE,GACA,MAAMP,GACN,MAAMG,EACN,CAAA;AAEN;"}
+{"version":3,"file":"sd-component-library250.js","sources":["../src/components/meters/gradient-outline-meter/partials/gradient-meter-range/gradient-meter-range.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { BaseOutlineArc } from \"../../../outline-meter/partials/base-outline-arc\";\nimport {\n  degToRad,\n  getCoordinateForArc,\n  getInnerX,\n  getInnerY,\n} from \"../../../outline-meter/utils\";\nimport { getFractionColor } from \"../../utils\";\nimport { GradientMeterRangeProps as Props } from \"./interfaces\";\n\nconst grey = \"#CCD0DB\";\nexport const GradientMeterRange: React.FC<Props> = (props) => {\n  const {\n    diameter,\n    idx,\n    endColor,\n    startColor,\n    segmented,\n    totalRanges,\n    value,\n    arc,\n    innerPointRadius,\n    pointStrokeWidth,\n    gaugeWidth,\n    pointColor,\n  } = props;\n\n  const start = idx / totalRanges;\n  const end = (idx + 1) / totalRanges;\n\n  const valueWithinRange = value >= start && value <= end;\n\n  const arcStart = (360 - arc) / 2; // deg\n\n  const radius = diameter / 2;\n\n  const rangeArcStart = arcStart + arc * start;\n  const rangeArcEnd = arcStart + arc * end;\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  if (segmented || !valueWithinRange)\n    return (\n      <BaseOutlineArc\n        startX={rangeStartX}\n        startY={rangeStartY}\n        endX={rangeEndX}\n        endY={rangeEndY}\n        startAlpha={rangeArcStart}\n        endAlpha={rangeArcEnd}\n        color={\n          segmented || value > end\n            ? `url(#gradient-${startColor}-${endColor})`\n            : grey\n        }\n        radius={radius}\n        width={gaugeWidth}\n      />\n    );\n\n  const valueAlpha =\n    rangeArcStart + (((value - start) / (end - start)) * arc) / totalRanges;\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  const useVerticalGradient = idx >= totalRanges / 2;\n  const useHorizontalGradient = idx + 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    <>\n      <defs>\n        <linearGradient\n          id={`value-gradient-${color}`}\n          {...(useVerticalGradient\n            ? {\n                x1: 0,\n                y1: 0,\n                x2: 0,\n                y2: 1,\n              }\n            : useHorizontalGradient\n            ? { x1: 0, y1: 0, x2: 1, y2: 0 }\n            : {\n                x1: 0,\n                y1: 1,\n                x2: 0,\n                y2: 0,\n              })}\n        >\n          <stop stopColor={startColor} offset=\"0%\" />\n          <stop stopColor={color} offset=\"100%\" />\n        </linearGradient>\n      </defs>\n      <g>\n        <BaseOutlineArc\n          startX={rangeStartX}\n          startY={rangeStartY}\n          endX={valueX}\n          endY={valueY}\n          startAlpha={rangeArcStart}\n          endAlpha={valueAlpha}\n          color={`url(#value-gradient-${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={pointColor || color}\n          fill=\"white\"\n        />\n      </g>\n    </>\n  );\n};\n"],"names":["grey","GradientMeterRange","props","diameter","idx","endColor","startColor","segmented","totalRanges","value","arc","innerPointRadius","pointStrokeWidth","gaugeWidth","pointColor","start","end","valueWithinRange","arcStart","radius","rangeArcStart","rangeArcEnd","x","rangeStartX","y","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","jsx","BaseOutlineArc","valueAlpha","valueX","valueY","valueInnerX","getInnerX","degToRad","valueInnerY","getInnerY","useVerticalGradient","useHorizontalGradient","fraction","color","getFractionColor","jsxs","Fragment","x1","y1","x2","y2"],"mappings":";;;;AAYA,MAAMA,IAAO,WACAC,IAAuCC,CAAUA,MAAA;AACtD,QAAA;AAAA,IACJC,UAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,kBAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,YAAAA;AAAAA,EACEZ,IAAAA,GAEEa,IAAQX,IAAMI,GACdQ,KAAOZ,IAAM,KAAKI,GAElBS,IAAmBR,KAASM,KAASN,KAASO,GAE9CE,KAAY,MAAMR,KAAO,GAEzBS,IAAShB,IAAW,GAEpBiB,IAAgBF,IAAWR,IAAMK,GACjCM,IAAcH,IAAWR,IAAMM,GAE/B;AAAA,IAAEM,GAAGC;AAAAA,IAAaC,GAAGC;AAAAA,EAAAA,IAAgBC,EACzCP,GACAC,CACF,GACM;AAAA,IAAEE,GAAGK;AAAAA,IAAWH;AAAAA,EAAGI,IAAcF,EACrCP,GACAE,CACF;AAEA,MAAId,KAAa,CAACU;AAEd,WAAAY,gBAAAA,EAAA,IAACC,GACC,EAAA,QAAQP,GACR,QAAQE,GACR,MAAME,GACN,MAAMC,GACN,YAAYR,GACZ,UAAUC,GACV,OACEd,KAAaE,IAAQO,IAChB,iBAAgBV,CAAW,IAAGD,CAAS,MACxCL,GAEN,QAAAmB,GACA,OAAON,EACP,CAAA;AAGN,QAAMkB,IACJX,KAAmBX,IAAQM,MAAUC,IAAMD,KAAUL,IAAOF,GACxD;AAAA,IAAEc,GAAGU;AAAAA,IAAQR,GAAGS;AAAAA,EAAAA,IAAWP,EAAoBP,GAAQY,CAAU,GACjEG,IAAcC,EAAUH,GAAQI,EAASL,CAAU,GAAGlB,CAAU,GAChEwB,IAAcC,EAAUL,GAAQG,EAASL,CAAU,GAAGlB,CAAU,GAEhE0B,IAAsBnC,KAAOI,IAAc,GAC3CgC,IAAwBpC,IAAM,MAAMI,IAAc,IAAI,KAEtDiC,IAAWD,KACZR,IAAST,MAAgBI,IAAYJ,MACrCU,IAASR,MAAgBG,IAAYH,IACpCiB,IAAQC,EAAiBF,GAAUnC,GAAYD,CAAQ;AAE7D,SAEIuC,gBAAAA,EAAA,KAAAC,YAAA,EAAA,UAAA;AAAA,IAAChB,gBAAAA,EAAAA,IAAA,QAAA,EACC,iCAAC,kBACC,EAAA,IAAK,kBAAiBa,CAAM,IAC5B,GAAKH,IACD;AAAA,MACEO,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,QAENT,IACA;AAAA,MAAEM,IAAI;AAAA,MAAGC,IAAI;AAAA,MAAGC,IAAI;AAAA,MAAGC,IAAI;AAAA,IAAA,IAC3B;AAAA,MACEH,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,MACJC,IAAI;AAAA,IAGV,GAAA,UAAA;AAAA,MAAApB,gBAAAA,EAAA,IAAC,QAAK,EAAA,WAAWvB,GAAY,QAAO,MAAI;AAAA,MACvCuB,gBAAAA,EAAA,IAAA,QAAA,EAAK,WAAWa,GAAO,QAAO,QAAM;AAAA,IAAA,EAAA,CACvC,EACF,CAAA;AAAA,2BACC,KACC,EAAA,UAAA;AAAA,MAACb,gBAAAA,EAAAA,IAAAC,GAAA,EACC,QAAQP,GACR,QAAQE,GACR,MAAMO,GACN,MAAMC,GACN,YAAYb,GACZ,UAAUW,GACV,OAAQ,uBAAsBW,CAAM,KACpC,QAAAvB,GACA,OAAON,GACP,UAAU,GAAM,CAAA;AAAA,MAElBgB,gBAAAA,MAACC,KACC,QAAQE,GACR,QAAQC,GACR,MAAMN,GACN,MAAMC,GACN,YAAYG,GACZ,UAAUV,GACV,OAAOrB,GACP,QAAAmB,GACA,OAAON,GACP,YAAY,IAAM;AAAA,4BAEnB,UACC,EAAA,KAAKmB,IAASE,KAAe,GAC7B,KAAKD,IAASI,KAAe,GAC7B,GAAGzB,IAAmBD,GACtB,aAAaC,GACb,QAAQE,KAAc4B,GACtB,MAAK,SAAO;AAAA,IAAA,GAEhB;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library251.js

@@ -1,40 +1,32 @@
-import { jsxs as b, jsx as o } from "./sd-component-library195.js";
-import { getCoordinateForArc as i } from "./sd-component-library89.js";
-import { defaultTextBottomMargin as w } from "./sd-component-library235.js";
-import { getRangeProperties as E } from "./sd-component-library674.js";
-import { BaseOutlineArc as L } from "./sd-component-library673.js";
-import { DiscreteMeterLabelPointer as S } from "./sd-component-library675.js";
-function C(s) {
+import { j as N } from "./sd-component-library195.js";
+import { getInnerX as k, getInnerY as B, degToRad as c, getCoordinateForArc as i } from "./sd-component-library89.js";
+import { getFractionColor as b } from "./sd-component-library249.js";
+import { BaseNeedle as q } from "./sd-component-library656.js";
+const O = (R) => {
   const {
-    color: a,
-    idx: c,
-    gaugeWidth: d,
-    diameter: g,
-    arc: m,
-    distanceBetweenRanges: l,
-    totalRanges: p,
-    showLabel: h,
-    label: n,
-    isMatchedRange: f,
-    pointerWidth: x,
-    pointerLength: A,
-    horizontal: u
-  } = s, t = g / 2, {
-    rangeArcStart: r,
-    rangeArcEnd: e
-  } = E(m, p, l, c), {
-    x: R,
-    y: B
-  } = i(t, r), {
-    x: M,
-    y: X
-  } = i(t, e), Y = (r + e) / 2;
-  return /* @__PURE__ */ b("g", { children: [
-    /* @__PURE__ */ o(L, { startX: R, startY: B, endX: M, endY: X, startAlpha: r, endAlpha: e, color: a, radius: t, width: d }),
-    h && n && !f && /* @__PURE__ */ o(S, { alpha: Y, pointerLength: A, pointerWidth: x, radius: t, color: a, textBottomMargin: w, label: n, horizontal: u })
-  ] });
-}
+    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 });
+};
 export {
-  C as DiscreteRange
+  O as GradientMeterNeedle
 };
 //# sourceMappingURL=sd-component-library251.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library251.js","sources":["../src/components/meters/multi-option-discrete-outline-meter/partials/discrete-range/discrete-range.tsx"],"sourcesContent":["import React, { PropsWithChildren } from \"react\";\n\nimport { BaseOutlineArc } from \"../../../outline-meter/partials/base-outline-arc\";\nimport { getCoordinateForArc } from \"../../../outline-meter/utils\";\nimport { defaultTextBottomMargin } from \"../../constants\";\nimport { getRangeProperties } from \"../../utils\";\nimport { DiscreteMeterLabelPointer } from \"../discrete-meter-label-pointer\";\nimport { DiscreteRangeProps as Props } from \"./interfaces\";\n\nexport function DiscreteRange<T>(props: PropsWithChildren<Props<T>>) {\n  const {\n    color,\n    idx,\n    gaugeWidth,\n    diameter,\n    arc,\n    distanceBetweenRanges,\n    totalRanges,\n    showLabel,\n    label,\n    isMatchedRange,\n    pointerWidth,\n    pointerLength,\n    horizontal,\n  } = props;\n\n  const radius = diameter / 2;\n\n  const { rangeArcStart, rangeArcEnd } = getRangeProperties(\n    arc,\n    totalRanges,\n    distanceBetweenRanges,\n    idx\n  );\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 middleArcAlpha = (rangeArcStart + rangeArcEnd) / 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={color}\n        radius={radius}\n        width={gaugeWidth}\n      />\n\n      {showLabel && label && !isMatchedRange && (\n        <DiscreteMeterLabelPointer\n          alpha={middleArcAlpha}\n          pointerLength={pointerLength}\n          pointerWidth={pointerWidth}\n          radius={radius}\n          color={color}\n          textBottomMargin={defaultTextBottomMargin}\n          label={label}\n          horizontal={horizontal}\n        />\n      )}\n    </g>\n  );\n}\n"],"names":["DiscreteRange","props","color","idx","gaugeWidth","diameter","arc","distanceBetweenRanges","totalRanges","showLabel","label","isMatchedRange","pointerWidth","pointerLength","horizontal","radius","rangeArcStart","rangeArcEnd","getRangeProperties","x","rangeStartX","y","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","middleArcAlpha","jsx","BaseOutlineArc","DiscreteMeterLabelPointer","defaultTextBottomMargin"],"mappings":";;;;;;AASO,SAASA,EAAiBC,GAAoC;AAC7D,QAAA;AAAA,IACJC,OAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,uBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,gBAAAA;AAAAA,IACAC,cAAAA;AAAAA,IACAC,eAAAA;AAAAA,IACAC,YAAAA;AAAAA,EACEb,IAAAA,GAEEc,IAASV,IAAW,GAEpB;AAAA,IAAEW,eAAAA;AAAAA,IAAeC,aAAAA;AAAAA,EAAgBC,IAAAA,EACrCZ,GACAE,GACAD,GACAJ,CACF,GAEM;AAAA,IAAEgB,GAAGC;AAAAA,IAAaC,GAAGC;AAAAA,EAAAA,IAAgBC,EACzCR,GACAC,CACF,GACM;AAAA,IAAEG,GAAGK;AAAAA,IAAWH,GAAGI;AAAAA,EAAAA,IAAcF,EACrCR,GACAE,CACF,GAEMS,KAAkBV,IAAgBC,KAAe;AAEvD,2BACG,KACC,EAAA,UAAA;AAAA,IAAA,gBAAAU,EAACC,KACC,QAAQR,GACR,QAAQE,GACR,MAAME,GACN,MAAMC,GACN,YAAYT,GACZ,UAAUC,GACV,OAAAf,GACA,QAAAa,GACA,OAAOX,GAAW;AAAA,IAGnBK,KAAaC,KAAS,CAACC,uBACrBkB,GACC,EAAA,OAAOH,GACP,eAAAb,GACA,cAAAD,GACA,QAAAG,GACA,OAAAb,GACA,kBAAkB4B,GAClB,OAAApB,GACA,YAAAI,GAEH;AAAA,EACH,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library251.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","length","valueRangeIndex","Math","floor","startColor","endColor","arcStart","rangeArcStart","rangeArcEnd","start","end","x","rangeStartX","y","rangeStartY","getCoordinateForArc","rangeEndX","rangeEndY","valueAlpha","valueX","valueY","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","cos","dy","sin","fraction","color","getFractionColor","jsx","BaseNeedle"],"mappings":";;;;AAYO,MAAMA,IAAwCC,CAAUA,MAAA;AACvD,QAAA;AAAA,IACJC,QAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,wBAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,YAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,aAAAA;AAAAA,EACEV,IAAAA,GACEW,IAASF,IAAW,GACpBG,IAAcX,EAAOY,QACrBC,IAAkBC,KAAKC,MAAMT,IAAQK,CAAW,GAChDK,IAAahB,EAAOa,CAAe,EAAE,CAAC,GACtCI,IAAWjB,EAAOa,CAAe,EAAE,CAAC,GAEpCK,KAAY,MAAMb,KAAO,GAEzBc,IAAgBD,IAAYb,IAAMQ,IAAmBF,GACrDS,IAAcF,IAAYb,KAAOQ,IAAkB,KAAMF,GACzDU,IAAQR,IAAkBF,GAC1BW,KAAOT,IAAkB,KAAKF,GAE9B;AAAA,IAAEY,GAAGC;AAAAA,IAAaC,GAAGC;AAAAA,EAAAA,IAAgBC,EACzCjB,GACAS,CACF,GACM;AAAA,IAAEI,GAAGK;AAAAA,IAAWH,GAAGI;AAAAA,EAAAA,IAAcF,EACrCjB,GACAU,CACF,GAEMU,IACJX,KAAmBb,IAAQe,MAAUC,IAAMD,KAAUhB,IAAOL,EAAOY,QAC/D;AAAA,IAAEW,GAAGQ;AAAAA,IAAQN,GAAGO;AAAAA,EAAAA,IAAWL,EAAoBjB,GAAQoB,CAAU,GACjEG,IAAaC,EACjBH,GACAI,EAASL,CAAU,GACnB7B,IAAoBM,IAAaH,IAAc,CACjD,GACMgC,IAAaC,EACjBL,GACAG,EAASL,CAAU,GACnB7B,IAAoBM,IAAaH,IAAc,CACjD,GAEMkC,IAAMlC,IAAc,IAAKU,KAAKyB,IAAIJ,EAASL,CAAU,CAAC,GACtDU,IAAMpC,IAAc,IAAKU,KAAK2B,IAAIN,EAASL,CAAU,CAAC,GAItDY,IAFwB7B,IAAkB,MAAMF,IAAc,IAAI,OAGnEoB,IAASP,MAAgBI,IAAYJ,MACrCQ,IAASN,MAAgBG,IAAYH,IACpCiB,IAAQC,EAAiBF,GAAU1B,GAAYC,CAAQ;AAE7D,SACG4B,gBAAAA,EAAAA,IAAAC,GAAA,EACC,QAAApC,GACA,mBAAAR,GACA,wBAAAC,GACA,aAAAC,GACA,OAAOK,KAAekC,GACtB,IAAAL,GACA,IAAAE,GACA,MAAMP,GACN,MAAMG,EACN,CAAA;AAEN;"}

package/lib/sd-component-library252.js

@@ -1,26 +1,39 @@
-import { jsx as T } from "./sd-component-library195.js";
-import { getInnerX as W, getInnerY as y, degToRad as r, getCoordinateForArc as B } from "./sd-component-library89.js";
-import { BaseNeedle as N } from "./sd-component-library672.js";
-function b(h) {
+import { j as p } from "./sd-component-library195.js";
+const m = (a) => {
   const {
-    needleColor: p,
-    options: n,
-    value: u,
-    needleWidth: e,
-    innerCircleRadius: m,
-    innerCircleStrokeWidth: x,
-    diameter: R,
-    arc: a,
-    distanceBetweenRanges: c,
-    distanceFromRange: s,
-    gaugeWidth: i
-  } = h, o = n.findIndex((M) => u === M.value), d = R / 2, f = (360 - a) / 2, l = a - (n.length - 1) * c, g = o / n.length, v = (o + 1) / n.length, A = l * (v - g), t = f + c * o + l * g + A / 2, {
-    x: C,
-    y: I
-  } = B(d, t), S = W(C, r(t), s + i + e / 2), X = y(I, r(t), s + i + e / 2), Y = e / 2 * Math.cos(r(t)), F = e / 2 * Math.sin(r(t));
-  return /* @__PURE__ */ T(N, { dx: Y, dy: F, color: p, radius: d, tipX: S, tipY: X, innerCircleStrokeWidth: x, innerCircleRadius: m, needleWidth: e });
-}
+    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 {
-  b as DiscreteMeterNeedle
+  m as OutlineMeterLabelPointer
 };
 //# sourceMappingURL=sd-component-library252.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library252.js","sources":["../src/components/meters/multi-option-discrete-outline-meter/partials/discrete-meter-needle/discrete-meter-needle.tsx"],"sourcesContent":["import React, { PropsWithChildren } 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 { DiscreteMeterNeedleProps as Props } from \"./interfaces\";\n\nexport function DiscreteMeterNeedle<T>(props: PropsWithChildren<Props<T>>) {\n  const {\n    needleColor,\n    options,\n    value,\n    needleWidth,\n    innerCircleRadius,\n    innerCircleStrokeWidth,\n    diameter,\n    arc,\n    distanceBetweenRanges,\n    distanceFromRange,\n    gaugeWidth,\n  } = props;\n\n  const matchingRangeIndex = options.findIndex(\n    (option) => value === option.value\n  );\n\n  const radius = diameter / 2;\n\n  const arcStart = (360 - arc) / 2;\n  const arcForRanges = arc - (options.length - 1) * distanceBetweenRanges;\n\n  const start = matchingRangeIndex / options.length;\n  const end = (matchingRangeIndex + 1) / options.length;\n\n  const rangeArc = arcForRanges * (end - start);\n\n  const rangeArcStart =\n    arcStart +\n    distanceBetweenRanges * matchingRangeIndex +\n    arcForRanges * start;\n\n  const valueAlpha = rangeArcStart + rangeArc / 2;\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}\n      radius={radius}\n      tipX={needleTipX}\n      tipY={needleTipY}\n      innerCircleStrokeWidth={innerCircleStrokeWidth}\n      innerCircleRadius={innerCircleRadius}\n      needleWidth={needleWidth}\n    />\n  );\n}\n"],"names":["DiscreteMeterNeedle","props","needleColor","options","value","needleWidth","innerCircleRadius","innerCircleStrokeWidth","diameter","arc","distanceBetweenRanges","distanceFromRange","gaugeWidth","matchingRangeIndex","findIndex","option","radius","arcStart","arcForRanges","length","start","end","rangeArc","valueAlpha","x","valueX","y","valueY","getCoordinateForArc","needleTipX","getInnerX","degToRad","needleTipY","getInnerY","dx","Math","cos","dy","sin","jsx","BaseNeedle"],"mappings":";;;AAWO,SAASA,EAAuBC,GAAoC;AACnE,QAAA;AAAA,IACJC,aAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,wBAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,uBAAAA;AAAAA,IACAC,mBAAAA;AAAAA,IACAC,YAAAA;AAAAA,EACEX,IAAAA,GAEEY,IAAqBV,EAAQW,UAChCC,CAAWX,MAAAA,MAAUW,EAAOX,KAC/B,GAEMY,IAASR,IAAW,GAEpBS,KAAY,MAAMR,KAAO,GACzBS,IAAeT,KAAON,EAAQgB,SAAS,KAAKT,GAE5CU,IAAQP,IAAqBV,EAAQgB,QACrCE,KAAOR,IAAqB,KAAKV,EAAQgB,QAEzCG,IAAWJ,KAAgBG,IAAMD,IAOjCG,IAJJN,IACAP,IAAwBG,IACxBK,IAAeE,IAEkBE,IAAW,GACxC;AAAA,IAAEE,GAAGC;AAAAA,IAAQC,GAAGC;AAAAA,EAAAA,IAAWC,EAAoBZ,GAAQO,CAAU,GAEjEM,IAAaC,EACjBL,GACAM,EAASR,CAAU,GACnBZ,IAAoBC,IAAaP,IAAc,CACjD,GACM2B,IAAaC,EACjBN,GACAI,EAASR,CAAU,GACnBZ,IAAoBC,IAAaP,IAAc,CACjD,GAEM6B,IAAM7B,IAAc,IAAK8B,KAAKC,IAAIL,EAASR,CAAU,CAAC,GACtDc,IAAMhC,IAAc,IAAK8B,KAAKG,IAAIP,EAASR,CAAU,CAAC;AAE5D,SACG,gBAAAgB,EAAAC,GAAA,EACC,IAAAN,GACA,IAAAG,GACA,OAAOnC,GACP,QAAAc,GACA,MAAMa,GACN,MAAMG,GACN,wBAAAzB,GACA,mBAAAD,GACA,aAAAD,EACA,CAAA;AAEN;"}
+{"version":3,"file":"sd-component-library252.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":";AAIO,MAAMA,IAA6CC,CAAUA,MAAA;AAC5D,QAAA;AAAA,IAAEC,UAAAA;AAAAA,IAAUC,UAAAA;AAAAA,IAAUC,QAAAA;AAAAA,IAAQC,QAAAA;AAAAA,IAAQC,oBAAAA;AAAAA,IAAoBC,WAAAA;AAAAA,EAC9DN,IAAAA;AAEEM,MAAAA;AAAkB,WAAA;AAEhB,QAAA;AAAA,IAAEC,QAAAA;AAAAA,IAAQC,QAAAA;AAAAA,IAAQC,MAAAA;AAAAA,IAAMC,MAAAA;AAAAA,EAAAA,IAC5BT,MAAa,SACT;AAAA,IACEM,QAAQH,KAAU;AAAA,IAClBI,QAAQL,KAAUD,IAAW,IAAI;AAAA,IACjCO,MAAM,CAACJ;AAAAA,IACPK,MAAMR,IAAW,IAAI;AAAA,EAAA,IAEvBD,MAAa,QACb;AAAA,IACEM,QAAQH,KAAUF,IAAW;AAAA,IAC7BM,QAAQL,KAAU;AAAA,IAClBM,MAAMP,IAAW;AAAA,IACjBQ,MAAM,CAACL;AAAAA,EAAAA,IAET;AAAA,IACEE,QAAQH,KAAUF;AAAAA,IAClBM,QAAQL,KAAUD,IAAW,IAAI;AAAA,IACjCO,MAAMP,IAAWG;AAAAA,IACjBK,MAAMR,IAAW,IAAI;AAAA,EAAA;AAG7B,SACGS,gBAAAA,EAAAA,IAAA,QAAA,EAAK,GAAI,IAAGJ,CAAO,IAAGC,CAAO,KAAIC,CAAK,IAAGC,CAAK,IAAG,QAAQ,UAAa,CAAA;AAE3E;"}

package/lib/sd-component-library253.js

@@ -1,19 +1,45 @@
-import { jsx as s } from "./sd-component-library195.js";
-import { getRangeProperties as d } from "./sd-component-library674.js";
-import { MatchedRangeLabelBox as i } from "./sd-component-library645.js";
-const h = (e) => {
+import { j as n } from "./sd-component-library195.js";
+import { useRef as g, useState as $, useEffect as b } from "react";
+import "./sd-component-library198.js";
+import { labelPaddingX as o, labelWidth as u } from "./sd-component-library236.js";
+import { Box as x } from "./sd-component-library199.js";
+import { ResponsiveTextV2 as v } from "./sd-component-library147.js";
+const T = (l) => {
   const {
-    idx: a,
-    totalRanges: t,
-    distanceBetweenRanges: r,
-    arc: n
-  } = e, {
-    rangeArcStart: o,
-    rangeArcEnd: c
-  } = d(n, t, r, a), g = Math.round((o + c) / 2);
-  return /* @__PURE__ */ s(i, { ...e, alpha: g, round: !0 });
+    position: t,
+    diameter: r,
+    label: d,
+    distanceFromLabelToRanges: p,
+    isInRange: e,
+    color: s
+  } = l, i = g(), [a, c] = $(0);
+  b(() => {
+    i.current && c(i.current.getBoundingClientRect().height);
+  }, [i]);
+  const m = t === "right" ? `${r + p}px` : t === "top" ? `${r / 2}px` : void 0, h = t === "left" ? `${r + p}px` : void 0, f = t === "left" || t === "right" ? `${r / 2}px` : `${-p}px`;
+  return /* @__PURE__ */ n.jsx(x, { sx: {
+    position: "absolute",
+    left: m,
+    top: f,
+    right: h
+  }, children: /* @__PURE__ */ n.jsx(x, { sx: {
+    position: "relative",
+    top: `-${a}px`,
+    left: t === "top" ? "-50%" : void 0,
+    py: "7px",
+    px: e ? `${o}px` : "0",
+    borderColor: e ? s : "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__ */ n.jsx(v, { width: "max-content", fontSizeWeight: [[12, "semi-bold"]], color: e && s !== "#CCD0DB" ? s : "cl_darkGrey", textTransform: "uppercase", letterSpacing: "1.8px", children: d }) }) });
 };
 export {
-  h as MatchedRangeLabelBox
+  T as BaseMeterLabelBox
 };
 //# sourceMappingURL=sd-component-library253.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library253.js","sources":["../src/components/meters/multi-option-discrete-outline-meter/partials/matched-range-label-box/matched-range-label-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { MatchedRangeLabelBox as LabelBox } from \"../../../common-outline-meter-partials\";\nimport { getRangeProperties } from \"../../utils\";\nimport { MatchedRangeLabelBoxProps as Props } from \"./interfaces\";\n\nexport const MatchedRangeLabelBox: React.FC<Props> = (props) => {\n  const { idx, totalRanges, distanceBetweenRanges, arc } = props;\n\n  const { rangeArcStart, rangeArcEnd } = getRangeProperties(\n    arc,\n    totalRanges,\n    distanceBetweenRanges,\n    idx\n  );\n\n  const alpha = Math.round((rangeArcStart + rangeArcEnd) / 2);\n\n  return <LabelBox {...props} alpha={alpha} round />;\n};\n"],"names":["MatchedRangeLabelBox","props","idx","totalRanges","distanceBetweenRanges","arc","rangeArcStart","rangeArcEnd","getRangeProperties","alpha","Math","round","LabelBox"],"mappings":";;;AAMO,MAAMA,IAAyCC,CAAUA,MAAA;AACxD,QAAA;AAAA,IAAEC,KAAAA;AAAAA,IAAKC,aAAAA;AAAAA,IAAaC,uBAAAA;AAAAA,IAAuBC,KAAAA;AAAAA,EAAQJ,IAAAA,GAEnD;AAAA,IAAEK,eAAAA;AAAAA,IAAeC,aAAAA;AAAAA,EAAgBC,IAAAA,EACrCH,GACAF,GACAC,GACAF,CACF,GAEMO,IAAQC,KAAKC,OAAOL,IAAgBC,KAAe,CAAC;AAE1D,2BAAQK,GAAS,EAAA,GAAIX,GAAO,OAAAQ,GAAc,OAAK,GAAG,CAAA;AACpD;"}
+{"version":3,"file":"sd-component-library253.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","current","getBoundingClientRect","height","left","undefined","right","top","jsx","Box","py","px","labelPaddingX","borderColor","borderWidth","borderStyle","borderBottomStyle","borderRadius","bg","maxWidth","labelWidth","ResponsiveTextV2"],"mappings":";;;;;;AAQO,MAAMA,IAAsCC,CAAUA,MAAA;AACrD,QAAA;AAAA,IACJC,UAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,OAAAA;AAAAA,IACAC,2BAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,OAAAA;AAAAA,EACEN,IAAAA,GACEO,IAAMC,KACN,CAACC,GAAYC,CAAa,IAAIC,EAAS,CAAC;AAE9CC,EAAAA,EAAU,MAAM;AACd,IAAIL,EAAIM,WAASH,EAAcH,EAAIM,QAAQC,sBAAsB,EAAEC,MAAM;AAAA,EAAA,GACxE,CAACR,CAAG,CAAC;AAER,QAAMS,IACJf,MAAa,UACR,GAAEC,IAAWE,CAA0B,OACxCH,MAAa,QACZ,GAAEC,IAAW,CAAE,OAChBe,QACAC,IACJjB,MAAa,SACR,GAAEC,IAAWE,CAA0B,OACxCa,QACAE,IACJlB,MAAa,UAAUA,MAAa,UAC/B,GAAEC,IAAW,CAAE,OACf,GAAE,CAACE,CAA0B;AAGlC,SAAAgB,gBAAAA,EAAA,IAACC,KAAI,IAAI;AAAA,IAAEpB,UAAU;AAAA,IAAYe,MAAAA;AAAAA,IAAMG,KAAAA;AAAAA,IAAKD,OAAAA;AAAAA,EAAM,GAChD,UAACE,gBAAAA,EAAAA,IAAAC,GAAA,EACC,IAAI;AAAA,IACFpB,UAAU;AAAA,IACVkB,KAAM,IAAGV,CAAW;AAAA,IACpBO,MAAMf,MAAa,QAAQ,SAASgB;AAAAA,IACpCK,IAAI;AAAA,IACJC,IAAIlB,IAAa,GAAEmB,CAAc,OAAM;AAAA,IACvCC,aAAapB,IAAYC,IAAQ;AAAA,IACjCoB,aAAarB,IAAY,QAAQ;AAAA,IACjCsB,aAAatB,IAAY,UAAU;AAAA,IACnCuB,mBACE,CAACvB,KAAaJ,MAAa,QAAQ,SAAS;AAAA,IAC9C4B,cAAcxB,IACT,GAAEmB,CAAc,MAAKA,CAAc,MAClCvB,MAAa,SAAU,GAAEuB,CAAc,OAAM,GAC9C,IAAGvB,MAAa,UAAW,GAAEuB,CAAc,OAAM,GAAI,KACtD;AAAA,IACJM,IAAI;AAAA,IACJ,WAAW;AAAA,MACTC,UAAU9B,MAAa,QAAQgB,SAAa,GAAEe,CAAW;AAAA,IAC3D;AAAA,EACF,GACA,KAAAzB,GAEA,UAAAa,gBAAAA,MAACa,GACC,EAAA,OAAM,eACN,gBAAgB,CAAC,CAAC,IAAI,WAAW,CAAC,GAClC,OAAO5B,KAAaC,MAAU,YAAYA,IAAQ,eAClD,eAAc,aACd,eAAc,SAEbH,UACHA,EAAA,CAAA,EACF,CAAA,EACF,CAAA;AAEJ;"}