@selfdecode/sd-component-library 4.0.118 → 4.0.119-test1

package/lib/sd-component-library320.js

@@ -1,61 +1,8 @@
-import { j as e } from "./sd-component-library198.js";
-import { useMemo as h } from "react";
-import { Flex as p, Box as j } from "rebass";
-import { SixteenRegular as l } from "./sd-component-library153.js";
-import { ThirteenRegular as i } from "./sd-component-library157.js";
-function b(o) {
-  const { synonyms: t, value: r, onSelect: c } = o, n = h(() => t[0], [t]), x = h(() => t.slice(1), [t]), a = h(() => {
-    const s = n.toLowerCase().indexOf(r.toLowerCase());
-    return /* @__PURE__ */ e.jsxs(p, { children: [
-      /* @__PURE__ */ e.jsx(l, { width: [""], cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: n.substring(0, s) }) }),
-      /* @__PURE__ */ e.jsx(l, { width: [""], color: "cl_purple", cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: n.substring(s, s + r.length) }) }),
-      /* @__PURE__ */ e.jsx(l, { width: [""], cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: n.substring(s + r.length) }) })
-    ] });
-  }, [n, r]);
-  return /* @__PURE__ */ e.jsxs(
-    j,
-    {
-      sx: {
-        p: "10px 16px",
-        cursor: "pointer"
-      },
-      onClick: (s) => c(n),
-      "data-test": "result-box",
-      children: [
-        a,
-        /* @__PURE__ */ e.jsx(p, { flexWrap: "wrap", children: x.map((s, d, u) => /* @__PURE__ */ e.jsx(
-          m,
-          {
-            value: r,
-            synonym: s,
-            appendSlash: d !== u.length - 1
-          },
-          s
-        )) })
-      ]
-    }
-  );
-}
-const m = (o) => {
-  const { value: t, synonym: r, appendSlash: c } = o, n = r.toLowerCase().indexOf(t.toLowerCase());
-  return /* @__PURE__ */ e.jsxs(p, { children: [
-    n !== -1 ? /* @__PURE__ */ e.jsxs(e.Fragment, { children: [
-      /* @__PURE__ */ e.jsx(i, { width: [""], cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: r.substring(0, n) }) }),
-      /* @__PURE__ */ e.jsx(i, { width: [""], color: "cl_purple", cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: r.substring(n, n + t.length) }) }),
-      /* @__PURE__ */ e.jsx(i, { width: [""], cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: r.substring(n + t.length) }) })
-    ] }) : /* @__PURE__ */ e.jsx(i, { width: [""], cursor: "inherit", children: /* @__PURE__ */ e.jsx("span", { style: { whiteSpace: "pre" }, children: r }) }),
-    c && /* @__PURE__ */ e.jsx(
-      i,
-      {
-        color: "cl_darkGrey",
-        width: ["12px"],
-        textAlign: "center",
-        children: "/"
-      }
-    )
-  ] }, r);
+const p = (c, r, n, t) => {
+  const o = c - (r - 1) * n, s = t / r, e = (t + 1) / r, a = (360 - c) / 2 + n * t + o * s, S = a + o * (e - s);
+  return { rangeArcStart: a, rangeArcEnd: S };
 };
 export {
-  b as AutocompleteOptionBox
+  p as getRangeProperties
 };
 //# sourceMappingURL=sd-component-library320.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library320.js","sources":["../src/components/inputs/autocomplete-input/partials/autocomplete-option-box/autocomplete-option-box.tsx"],"sourcesContent":["import React, { PropsWithChildren, useMemo } from \"react\";\n\nimport { Box, Flex } from \"rebass\";\n\nimport { SixteenRegular } from \"../../../../texts/sixteen-regular\";\nimport { ThirteenRegular } from \"../../../../texts/thirteen-regular\";\nimport { AutocompleteOptionBox as Props } from \"./interfaces\";\n\nexport function AutocompleteOptionBox<T>(props: PropsWithChildren<Props<T>>) {\n  const { synonyms, value, onSelect } = props;\n\n  /* Synonym that first matches the query */\n  const matchingSynonym = useMemo(() => synonyms[0], [synonyms]);\n  /* List of synonyms to be displayed below the matching synonym */\n  const otherSynonyms = useMemo(() => synonyms.slice(1), [synonyms]);\n\n  const renderMatchingSynonym = useMemo(() => {\n    const startIndex = matchingSynonym\n      .toLowerCase()\n      .indexOf(value.toLowerCase());\n\n    return (\n      <Flex>\n        <SixteenRegular width={[\"\"]} cursor={\"inherit\"}>\n          <span style={{ whiteSpace: \"pre\" }}>\n            {matchingSynonym.substring(0, startIndex)}\n          </span>\n        </SixteenRegular>\n        <SixteenRegular width={[\"\"]} color=\"cl_purple\" cursor={\"inherit\"}>\n          <span style={{ whiteSpace: \"pre\" }}>\n            {matchingSynonym.substring(startIndex, startIndex + value.length)}\n          </span>\n        </SixteenRegular>\n        <SixteenRegular width={[\"\"]} cursor={\"inherit\"}>\n          <span style={{ whiteSpace: \"pre\" }}>\n            {matchingSynonym.substring(startIndex + value.length)}\n          </span>\n        </SixteenRegular>\n      </Flex>\n    );\n  }, [matchingSynonym, value]);\n\n  return (\n    <Box\n      sx={{\n        p: \"10px 16px\",\n        cursor: \"pointer\",\n      }}\n      onClick={(x) => onSelect(matchingSynonym)}\n      data-test=\"result-box\"\n    >\n      {renderMatchingSynonym}\n      <Flex flexWrap=\"wrap\">\n        {otherSynonyms.map((synonym, idx, arr) => (\n          <OtherSynonym\n            key={synonym}\n            value={value}\n            synonym={synonym}\n            appendSlash={idx !== arr.length - 1}\n          />\n        ))}\n      </Flex>\n    </Box>\n  );\n}\n\nconst OtherSynonym: React.FC<{\n  value: string;\n  synonym: string;\n  appendSlash: boolean;\n}> = (props) => {\n  const { value, synonym, appendSlash } = props;\n  const matchIdx = synonym.toLowerCase().indexOf(value.toLowerCase());\n\n  return (\n    <Flex key={synonym}>\n      {matchIdx !== -1 ? (\n        <>\n          <ThirteenRegular width={[\"\"]} cursor={\"inherit\"}>\n            <span style={{ whiteSpace: \"pre\" }}>\n              {synonym.substring(0, matchIdx)}\n            </span>\n          </ThirteenRegular>\n          <ThirteenRegular width={[\"\"]} color=\"cl_purple\" cursor={\"inherit\"}>\n            <span style={{ whiteSpace: \"pre\" }}>\n              {synonym.substring(matchIdx, matchIdx + value.length)}\n            </span>\n          </ThirteenRegular>\n          <ThirteenRegular width={[\"\"]} cursor={\"inherit\"}>\n            <span style={{ whiteSpace: \"pre\" }}>\n              {synonym.substring(matchIdx + value.length)}\n            </span>\n          </ThirteenRegular>\n        </>\n      ) : (\n        <ThirteenRegular width={[\"\"]} cursor={\"inherit\"}>\n          <span style={{ whiteSpace: \"pre\" }}>{synonym}</span>\n        </ThirteenRegular>\n      )}\n\n      {appendSlash && (\n        <ThirteenRegular\n          color=\"cl_darkGrey\"\n          width={[\"12px\"]}\n          textAlign=\"center\"\n        >\n          /\n        </ThirteenRegular>\n      )}\n    </Flex>\n  );\n};\n"],"names":["AutocompleteOptionBox","props","synonyms","value","onSelect","matchingSynonym","useMemo","otherSynonyms","renderMatchingSynonym","startIndex","Flex","jsx","SixteenRegular","jsxs","Box","x","synonym","idx","arr","OtherSynonym","appendSlash","matchIdx","Fragment","ThirteenRegular"],"mappings":"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"}
+{"version":3,"file":"sd-component-library320.js","sources":["../src/components/meters/multi-option-discrete-outline-meter/utils.ts"],"sourcesContent":["export const getRangeProperties = (\n  arc: number,\n  totalRanges: number,\n  distanceBetweenRanges: number,\n  idx: number\n) => {\n  const arcForRanges = arc - (totalRanges - 1) * distanceBetweenRanges;\n\n  const start = idx / totalRanges;\n  const end = (idx + 1) / totalRanges;\n\n  const arcStart = (360 - arc) / 2; // deg\n\n  const rangeArcStart =\n    arcStart + distanceBetweenRanges * idx + arcForRanges * start;\n\n  const rangeArcEnd = rangeArcStart + arcForRanges * (end - start);\n\n  return { rangeArcStart, rangeArcEnd };\n};\n"],"names":["getRangeProperties","arc","totalRanges","distanceBetweenRanges","idx","arcForRanges","start","end","rangeArcStart","rangeArcEnd"],"mappings":"AAAO,MAAMA,IAAqB,CAChCC,GACAC,GACAC,GACAC,MACG;AACG,QAAAC,IAAeJ,KAAOC,IAAc,KAAKC,GAEzCG,IAAQF,IAAMF,GACdK,KAAOH,IAAM,KAAKF,GAIlBM,KAFY,MAAMP,KAAO,IAGlBE,IAAwBC,IAAMC,IAAeC,GAEpDG,IAAcD,IAAgBH,KAAgBE,IAAMD;AAEnD,SAAA,EAAE,eAAAE,GAAe,aAAAC;AAC1B;"}

package/lib/sd-component-library321.js

@@ -1,29 +1,7 @@
-import { j as r } from "./sd-component-library198.js";
-import { ResponsiveTextV2 as s } from "./sd-component-library152.js";
-const x = (t) => {
-  const { onClick: e, title: o, height: i } = t;
-  return /* @__PURE__ */ r.jsx(
-    s,
-    {
-      fontSizeWeight: [[16, "regular"]],
-      sx: {
-        position: "relative",
-        height: `${i}px`,
-        px: "15px",
-        display: "flex",
-        justifyContent: "flex-start",
-        alignItems: "center",
-        opacity: 0.8,
-        ":hover": {
-          opacity: 1
-        }
-      },
-      onClick: e,
-      children: o
-    }
-  );
-};
+import { j as e } from "./sd-component-library198.js";
+import { LabelPointer as t } from "./sd-component-library327.js";
+const s = (r) => /* @__PURE__ */ e.jsx(t, { ...r });
 export {
-  x as SearchAutocompleteRow
+  s as DiscreteMeterLabelPointer
 };
 //# sourceMappingURL=sd-component-library321.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library321.js","sources":["../src/components/inputs/search-autocomplete-input/partials/search-autocomplete-row/search-autocomplete-row.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { ResponsiveTextV2 } from \"../../../../texts/responsive-text-v2\";\nimport { SearchAutocompleteRowProps as Props } from \"./interfaces\";\n\nexport const SearchAutocompleteRow = <\n  T extends { id: string } = { id: string }\n>(\n  props: Props<T>\n) => {\n  const { onClick, title, height } = props;\n\n  return (\n    <ResponsiveTextV2\n      fontSizeWeight={[[16, \"regular\"]]}\n      sx={{\n        position: \"relative\",\n        height: `${height}px`,\n        px: \"15px\",\n        display: \"flex\",\n        justifyContent: \"flex-start\",\n        alignItems: \"center\",\n        opacity: 0.8,\n        \":hover\": {\n          opacity: 1,\n        },\n      }}\n      onClick={onClick}\n    >\n      {title}\n    </ResponsiveTextV2>\n  );\n};\n"],"names":["SearchAutocompleteRow","props","onClick","title","height","jsx","ResponsiveTextV2"],"mappings":";;AAKa,MAAAA,IAAwB,CAGnCC,MACG;AACH,QAAM,EAAE,SAAAC,GAAS,OAAAC,GAAO,QAAAC,EAAA,IAAWH;AAGjC,SAAAI,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,gBAAgB,CAAC,CAAC,IAAI,SAAS,CAAC;AAAA,MAChC,IAAI;AAAA,QACF,UAAU;AAAA,QACV,QAAQ,GAAGF,CAAM;AAAA,QACjB,IAAI;AAAA,QACJ,SAAS;AAAA,QACT,gBAAgB;AAAA,QAChB,YAAY;AAAA,QACZ,SAAS;AAAA,QACT,UAAU;AAAA,UACR,SAAS;AAAA,QACX;AAAA,MACF;AAAA,MACA,SAAAF;AAAA,MAEC,UAAAC;AAAA,IAAA;AAAA,EAAA;AAGP;"}
+{"version":3,"file":"sd-component-library321.js","sources":["../src/components/meters/multi-option-discrete-outline-meter/partials/discrete-meter-label-pointer/discrete-meter-label-pointer.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { LabelPointer } from \"../../../common-outline-meter-partials\";\nimport { DiscreteMeterLabelPointerProps as Props } from \"./interfaces\";\n\nexport const DiscreteMeterLabelPointer: React.FC<Props> = (props) => {\n  return <LabelPointer {...props} />;\n};\n"],"names":["DiscreteMeterLabelPointer","props","jsx","LabelPointer"],"mappings":";;AAKa,MAAAA,IAA6C,CAACC,MAClDC,gBAAAA,EAAA,IAACC,GAAc,EAAA,GAAGF,EAAO,CAAA;"}

package/lib/sd-component-library323.js

@@ -1,93 +1,32 @@
-import { j as o } from "./sd-component-library198.js";
-import { useState as L, useCallback as M } from "react";
-import V from "./sd-component-library197.js";
-import { getCoordinateForArc as f } from "./sd-component-library93.js";
-import { GridContainerV2 as X } from "./sd-component-library40.js";
-import { ResponsiveTextV2 as g } from "./sd-component-library152.js";
-const y = "21.5px", w = 10, j = `${w}px`, J = ({
-  segment: $,
-  isHover: r,
-  animationDuration: S,
-  labelOffset: i,
-  labelPointerOffset: k,
-  radius: c,
-  mobile: e,
-  labelOffsetMobile: u
-}) => {
-  const { start: p, end: a, text: R, color: z, secondaryText: C } = $, d = c * 2, t = (p + a) / 2, h = Math.round(t * 360), { x: _, y: x } = f(c, h), [n, A] = L(), G = M((m) => {
-    m && A(m.getBoundingClientRect());
-  }, []), l = `all ${S}ms`, s = t > 0.5 ? "right" : "left", I = d + i, { x: T, y: W } = f(
-    c + u,
-    h,
-    c
-  ), b = t < 0.5, B = t < 0.15 || t > 0.85, F = t > 0.35 || t < 0.65;
-  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
-    !e && /* @__PURE__ */ o.jsx(
-      "line",
-      {
-        x1: _ + (s === "left" ? -1 : 1) * k,
-        x2: s === "left" ? -i : d + i,
-        y1: x,
-        y2: x,
-        stroke: V.colors.cl_lightGrey,
-        strokeWidth: 1
-      }
-    ),
-    /* @__PURE__ */ o.jsx(
-      "foreignObject",
-      {
-        x: e ? T : s === "left" ? -i : I - ((n == null ? void 0 : n.width) ?? 0),
-        y: e ? W : x,
-        width: ((n == null ? void 0 : n.width) ?? 0) + w,
-        height: 50,
-        style: { overflow: "visible" },
-        children: /* @__PURE__ */ o.jsxs(
-          X,
-          {
-            width: "fit-content",
-            justifyItems: "flex-start",
-            gap: r ? "1px" : "4px",
-            sx: {
-              transform: e ? `translate(${b ? -100 : 0}%, calc(${y} * ${B ? 0 : F ? -1 : -0.5}))` : `translateY(calc(${y} / -2)) scale(${r ? 1.3 : 1})`,
-              transition: l,
-              transformOrigin: s,
-              ...e ? {
-                borderRadius: "4px",
-                boxShadow: "0px 3px 6px #00000029",
-                px: "5px",
-                py: "3px"
-              } : s === "left" ? { pr: j } : { pl: j }
-            },
-            bg: "cl_white",
-            children: [
-              /* @__PURE__ */ o.jsx(
-                g,
-                {
-                  width: "fit-content",
-                  fontSizeWeight: [18, "bold"],
-                  color: z,
-                  sx: { transition: l },
-                  ref: G,
-                  children: R
-                }
-              ),
-              /* @__PURE__ */ o.jsx(
-                g,
-                {
-                  fontSizeWeight: [r ? 13 : 14, "bold"],
-                  color: r ? "cl_darkGrey" : "cl_grey",
-                  sx: { transition: l },
-                  children: C ?? `${Math.round((a - p) * 100)}%`
-                }
-              )
-            ]
-          }
-        )
-      }
-    )
-  ] });
+import { j as e } from "./sd-component-library198.js";
+import { getSelectedRangeText as l } from "./sd-component-library284.js";
+import { FourteenRegular as n } from "./sd-component-library146.js";
+import { FourteenSb as p } from "./sd-component-library147.js";
+import { BaseGridContainer as i } from "./sd-component-library37.js";
+const a = (r) => {
+  const { isMobile: o, selectedRange: t } = r;
+  return /* @__PURE__ */ e.jsxs(
+    i,
+    {
+      ...o ? {
+        p: "10px 20px",
+        gap: "3px",
+        borderWidth: "1px 0",
+        borderStyle: "solid",
+        borderColor: "#CCD0DB"
+      } : {
+        gap: "10px",
+        m: "auto 0",
+        justifyContent: "flex-end"
+      },
+      children: [
+        /* @__PURE__ */ e.jsx(n, { color: "cl_grey", children: "Selected:" }),
+        /* @__PURE__ */ e.jsx(p, { color: "cl_purple", children: l(t) })
+      ]
+    }
+  );
 };
 export {
-  J as SegmentLabel
+  a as SelectedRangeText
 };
 //# sourceMappingURL=sd-component-library323.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library323.js","sources":["../src/components/meters/donut-diagram/partials/segment-label/segment-label.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\n\nimport theme from \"../../../../../core/theme\";\nimport { Grid } from \"../../../../containers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { getCoordinateForArc } from \"../../../outline-meter/utils\";\nimport { DonutSegmentLabelPosition } from \"../../interfaces\";\nimport { SegmentLabelProps as Props } from \"./interfaces\";\n\nconst rowHeight = \"21.5px\";\nconst maskSize = 10;\nconst maskSizePx = `${maskSize}px`;\n\nexport const SegmentLabel: React.FC<Props> = ({\n  segment,\n  isHover,\n  animationDuration,\n  labelOffset,\n  labelPointerOffset,\n  radius,\n  mobile,\n  labelOffsetMobile,\n}) => {\n  const { start, end, text, color, secondaryText } = segment;\n  const diameter = radius * 2;\n  const middle = (start + end) / 2;\n  const middleAlpha = Math.round(middle * 360);\n  const { x, y } = getCoordinateForArc(radius, middleAlpha);\n\n  const [rect, setRect] = useState<DOMRect>();\n  const ref = useCallback((node: HTMLDivElement) => {\n    if (node) {\n      setRect(node.getBoundingClientRect());\n    }\n  }, []);\n\n  const transition = `all ${animationDuration}ms`;\n\n  const position: DonutSegmentLabelPosition = middle > 0.5 ? \"right\" : \"left\";\n  const maxX = diameter + labelOffset;\n\n  const { x: pointerX, y: pointerY } = getCoordinateForArc(\n    radius + labelOffsetMobile,\n    middleAlpha,\n    radius\n  );\n\n  const isAtLeft = middle < 0.5;\n  const isInBottom = middle < 0.15 || middle > 0.85;\n  const isInTop = middle > 0.35 || middle < 0.65;\n\n  return (\n    <>\n      {!mobile && (\n        <line\n          x1={x + (position === \"left\" ? -1 : 1) * labelPointerOffset}\n          x2={position === \"left\" ? -labelOffset : diameter + labelOffset}\n          y1={y}\n          y2={y}\n          stroke={theme.colors[\"cl_lightGrey\"]}\n          strokeWidth={1}\n        />\n      )}\n\n      <foreignObject\n        x={\n          mobile\n            ? pointerX\n            : position === \"left\"\n            ? -labelOffset\n            : maxX - (rect?.width ?? 0)\n        }\n        y={mobile ? pointerY : y}\n        width={(rect?.width ?? 0) + maskSize}\n        height={50}\n        style={{ overflow: \"visible\" }}\n      >\n        <Grid\n          width=\"fit-content\"\n          justifyItems=\"flex-start\"\n          gap={isHover ? \"1px\" : \"4px\"}\n          sx={{\n            transform: mobile\n              ? `translate(${isAtLeft ? -100 : 0}%, calc(${rowHeight} * ${\n                  isInBottom ? 0 : isInTop ? -1 : -0.5\n                }))`\n              : `translateY(calc(${rowHeight} / -2)) scale(${\n                  isHover ? 1.3 : 1\n                })`,\n            transition,\n            transformOrigin: position,\n            ...(mobile\n              ? {\n                  borderRadius: \"4px\",\n                  boxShadow: \"0px 3px 6px #00000029\",\n                  px: \"5px\",\n                  py: \"3px\",\n                }\n              : position === \"left\"\n              ? { pr: maskSizePx }\n              : { pl: maskSizePx }),\n          }}\n          bg=\"cl_white\"\n        >\n          <ResponsiveTextV2\n            width=\"fit-content\"\n            fontSizeWeight={[18, \"bold\"]}\n            color={color}\n            sx={{ transition }}\n            ref={ref}\n          >\n            {text}\n          </ResponsiveTextV2>\n\n          <ResponsiveTextV2\n            fontSizeWeight={[isHover ? 13 : 14, \"bold\"]}\n            color={isHover ? \"cl_darkGrey\" : \"cl_grey\"}\n            sx={{ transition }}\n          >\n            {secondaryText ?? `${Math.round((end - start) * 100)}%`}\n          </ResponsiveTextV2>\n        </Grid>\n      </foreignObject>\n    </>\n  );\n};\n"],"names":["rowHeight","maskSize","maskSizePx","SegmentLabel","segment","isHover","animationDuration","labelOffset","labelPointerOffset","radius","mobile","labelOffsetMobile","start","end","text","color","secondaryText","diameter","middle","middleAlpha","x","y","getCoordinateForArc","rect","setRect","useState","ref","useCallback","node","transition","position","maxX","pointerX","pointerY","isAtLeft","isInBottom","isInTop","jsxs","Fragment","jsx","theme","Grid","ResponsiveTextV2"],"mappings":";;;;;;AASA,MAAMA,IAAY,UACZC,IAAW,IACXC,IAAa,GAAGD,CAAQ,MAEjBE,IAAgC,CAAC;AAAA,EAC5C,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,mBAAAC;AAAA,EACA,aAAAC;AAAA,EACA,oBAAAC;AAAA,EACA,QAAAC;AAAA,EACA,QAAAC;AAAA,EACA,mBAAAC;AACF,MAAM;AACJ,QAAM,EAAE,OAAAC,GAAO,KAAAC,GAAK,MAAAC,GAAM,OAAAC,GAAO,eAAAC,EAAkB,IAAAZ,GAC7Ca,IAAWR,IAAS,GACpBS,KAAUN,IAAQC,KAAO,GACzBM,IAAc,KAAK,MAAMD,IAAS,GAAG,GACrC,EAAE,GAAAE,GAAG,GAAAC,EAAA,IAAMC,EAAoBb,GAAQU,CAAW,GAElD,CAACI,GAAMC,CAAO,IAAIC,EAAkB,GACpCC,IAAMC,EAAY,CAACC,MAAyB;AAChD,IAAIA,KACMJ,EAAAI,EAAK,uBAAuB;AAAA,EAExC,GAAG,CAAE,CAAA,GAECC,IAAa,OAAOvB,CAAiB,MAErCwB,IAAsCZ,IAAS,MAAM,UAAU,QAC/Da,IAAOd,IAAWV,GAElB,EAAE,GAAGyB,GAAU,GAAGC,EAAa,IAAAX;AAAA,IACnCb,IAASE;AAAA,IACTQ;AAAA,IACAV;AAAA,EAAA,GAGIyB,IAAWhB,IAAS,KACpBiB,IAAajB,IAAS,QAAQA,IAAS,MACvCkB,IAAUlB,IAAS,QAAQA,IAAS;AAE1C,SAEKmB,gBAAAA,EAAA,KAAAC,YAAA,EAAA,UAAA;AAAA,IAAA,CAAC5B,KACA6B,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,IAAInB,KAAKU,MAAa,SAAS,KAAK,KAAKtB;AAAA,QACzC,IAAIsB,MAAa,SAAS,CAACvB,IAAcU,IAAWV;AAAA,QACpD,IAAIc;AAAA,QACJ,IAAIA;AAAA,QACJ,QAAQmB,EAAM,OAAO;AAAA,QACrB,aAAa;AAAA,MAAA;AAAA,IACf;AAAA,IAGFD,gBAAAA,EAAA;AAAA,MAAC;AAAA,MAAA;AAAA,QACC,GACE7B,IACIsB,IACAF,MAAa,SACb,CAACvB,IACDwB,MAAQR,KAAA,gBAAAA,EAAM,UAAS;AAAA,QAE7B,GAAGb,IAASuB,IAAWZ;AAAA,QACvB,SAAQE,KAAA,gBAAAA,EAAM,UAAS,KAAKtB;AAAA,QAC5B,QAAQ;AAAA,QACR,OAAO,EAAE,UAAU,UAAU;AAAA,QAE7B,UAAAoC,gBAAAA,EAAA;AAAA,UAACI;AAAAA,UAAA;AAAA,YACC,OAAM;AAAA,YACN,cAAa;AAAA,YACb,KAAKpC,IAAU,QAAQ;AAAA,YACvB,IAAI;AAAA,cACF,WAAWK,IACP,aAAawB,IAAW,OAAO,CAAC,WAAWlC,CAAS,MAClDmC,IAAa,IAAIC,IAAU,KAAK,IAClC,OACA,mBAAmBpC,CAAS,iBAC1BK,IAAU,MAAM,CAClB;AAAA,cACJ,YAAAwB;AAAA,cACA,iBAAiBC;AAAA,cACjB,GAAIpB,IACA;AAAA,gBACE,cAAc;AAAA,gBACd,WAAW;AAAA,gBACX,IAAI;AAAA,gBACJ,IAAI;AAAA,cAAA,IAENoB,MAAa,SACb,EAAE,IAAI5B,MACN,EAAE,IAAIA,EAAW;AAAA,YACvB;AAAA,YACA,IAAG;AAAA,YAEH,UAAA;AAAA,cAAAqC,gBAAAA,EAAA;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,OAAM;AAAA,kBACN,gBAAgB,CAAC,IAAI,MAAM;AAAA,kBAC3B,OAAA3B;AAAA,kBACA,IAAI,EAAE,YAAAc,EAAW;AAAA,kBACjB,KAAAH;AAAA,kBAEC,UAAAZ;AAAA,gBAAA;AAAA,cACH;AAAA,cAEAyB,gBAAAA,EAAA;AAAA,gBAACG;AAAA,gBAAA;AAAA,kBACC,gBAAgB,CAACrC,IAAU,KAAK,IAAI,MAAM;AAAA,kBAC1C,OAAOA,IAAU,gBAAgB;AAAA,kBACjC,IAAI,EAAE,YAAAwB,EAAW;AAAA,kBAEhB,eAAiB,GAAG,KAAK,OAAOhB,IAAMD,KAAS,GAAG,CAAC;AAAA,gBAAA;AAAA,cACtD;AAAA,YAAA;AAAA,UAAA;AAAA,QACF;AAAA,MAAA;AAAA,IACF;AAAA,EACF,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library323.js","sources":["../src/components/inputs/date-inputs/base-date-range-input/partials/selected-range-text/selected-range-text.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { BaseGridContainer } from \"../../../../../containers\";\nimport { FourteenRegular } from \"../../../../../texts/fourteen-regular\";\nimport { FourteenSb } from \"../../../../../texts/fourteen-sb\";\nimport { getSelectedRangeText } from \"../../utils\";\nimport { SelectedRangeTextProps as Props } from \"./interfaces\";\n\nexport const SelectedRangeText: React.FC<Props> = (props) => {\n  const { isMobile, selectedRange } = props;\n\n  return (\n    <BaseGridContainer\n      {...(isMobile\n        ? {\n            p: \"10px 20px\",\n            gap: \"3px\",\n            borderWidth: \"1px 0\",\n            borderStyle: \"solid\",\n            borderColor: \"#CCD0DB\",\n          }\n        : {\n            gap: \"10px\",\n            m: \"auto 0\",\n            justifyContent: \"flex-end\",\n          })}\n    >\n      <FourteenRegular color=\"cl_grey\">Selected:</FourteenRegular>\n\n      <FourteenSb color=\"cl_purple\">\n        {getSelectedRangeText(selectedRange)}\n      </FourteenSb>\n    </BaseGridContainer>\n  );\n};\n"],"names":["SelectedRangeText","props","isMobile","selectedRange","jsxs","BaseGridContainer","jsx","FourteenRegular","FourteenSb","getSelectedRangeText"],"mappings":";;;;;AAQa,MAAAA,IAAqC,CAACC,MAAU;AACrD,QAAA,EAAE,UAAAC,GAAU,eAAAC,EAAkB,IAAAF;AAGlC,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAIH,IACD;AAAA,QACE,GAAG;AAAA,QACH,KAAK;AAAA,QACL,aAAa;AAAA,QACb,aAAa;AAAA,QACb,aAAa;AAAA,MAAA,IAEf;AAAA,QACE,KAAK;AAAA,QACL,GAAG;AAAA,QACH,gBAAgB;AAAA,MAClB;AAAA,MAEJ,UAAA;AAAA,QAACI,gBAAAA,EAAA,IAAAC,GAAA,EAAgB,OAAM,WAAU,UAAS,aAAA;AAAA,8BAEzCC,GAAW,EAAA,OAAM,aACf,UAAAC,EAAqBN,CAAa,GACrC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}

package/lib/sd-component-library324.js

@@ -1,32 +1,24 @@
-import { j as e } from "./sd-component-library198.js";
-import { getSelectedRangeText as l } from "./sd-component-library289.js";
-import { FourteenRegular as n } from "./sd-component-library146.js";
-import { FourteenSb as p } from "./sd-component-library147.js";
-import { BaseGridContainer as i } from "./sd-component-library37.js";
-const a = (r) => {
-  const { isMobile: o, selectedRange: t } = r;
-  return /* @__PURE__ */ e.jsxs(
-    i,
+import { j as r } from "./sd-component-library198.js";
+import { endOfDay as s } from "date-fns";
+import { SecondaryBlueButton as p } from "./sd-component-library20.js";
+const c = (e) => {
+  const { onClose: n, onSelect: o, selectedRange: t } = e, a = () => {
+    t && o({
+      startDate: t.startDate ?? /* @__PURE__ */ new Date(),
+      endDate: s(t.endDate ?? /* @__PURE__ */ new Date())
+    }), n();
+  };
+  return /* @__PURE__ */ r.jsx(
+    p,
     {
-      ...o ? {
-        p: "10px 20px",
-        gap: "3px",
-        borderWidth: "1px 0",
-        borderStyle: "solid",
-        borderColor: "#CCD0DB"
-      } : {
-        gap: "10px",
-        m: "auto 0",
-        justifyContent: "flex-end"
-      },
-      children: [
-        /* @__PURE__ */ e.jsx(n, { color: "cl_grey", children: "Selected:" }),
-        /* @__PURE__ */ e.jsx(p, { color: "cl_purple", children: l(t) })
-      ]
+      width: "140px",
+      onClick: a,
+      disabled: !t || !t.startDate || !t.endDate,
+      children: "Apply"
     }
   );
 };
 export {
-  a as SelectedRangeText
+  c as ApplyButton
 };
 //# sourceMappingURL=sd-component-library324.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library324.js","sources":["../src/components/inputs/date-inputs/base-date-range-input/partials/selected-range-text/selected-range-text.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { BaseGridContainer } from \"../../../../../containers\";\nimport { FourteenRegular } from \"../../../../../texts/fourteen-regular\";\nimport { FourteenSb } from \"../../../../../texts/fourteen-sb\";\nimport { getSelectedRangeText } from \"../../utils\";\nimport { SelectedRangeTextProps as Props } from \"./interfaces\";\n\nexport const SelectedRangeText: React.FC<Props> = (props) => {\n  const { isMobile, selectedRange } = props;\n\n  return (\n    <BaseGridContainer\n      {...(isMobile\n        ? {\n            p: \"10px 20px\",\n            gap: \"3px\",\n            borderWidth: \"1px 0\",\n            borderStyle: \"solid\",\n            borderColor: \"#CCD0DB\",\n          }\n        : {\n            gap: \"10px\",\n            m: \"auto 0\",\n            justifyContent: \"flex-end\",\n          })}\n    >\n      <FourteenRegular color=\"cl_grey\">Selected:</FourteenRegular>\n\n      <FourteenSb color=\"cl_purple\">\n        {getSelectedRangeText(selectedRange)}\n      </FourteenSb>\n    </BaseGridContainer>\n  );\n};\n"],"names":["SelectedRangeText","props","isMobile","selectedRange","jsxs","BaseGridContainer","jsx","FourteenRegular","FourteenSb","getSelectedRangeText"],"mappings":";;;;;AAQa,MAAAA,IAAqC,CAACC,MAAU;AACrD,QAAA,EAAE,UAAAC,GAAU,eAAAC,EAAkB,IAAAF;AAGlC,SAAAG,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACE,GAAIH,IACD;AAAA,QACE,GAAG;AAAA,QACH,KAAK;AAAA,QACL,aAAa;AAAA,QACb,aAAa;AAAA,QACb,aAAa;AAAA,MAAA,IAEf;AAAA,QACE,KAAK;AAAA,QACL,GAAG;AAAA,QACH,gBAAgB;AAAA,MAClB;AAAA,MAEJ,UAAA;AAAA,QAACI,gBAAAA,EAAA,IAAAC,GAAA,EAAgB,OAAM,WAAU,UAAS,aAAA;AAAA,8BAEzCC,GAAW,EAAA,OAAM,aACf,UAAAC,EAAqBN,CAAa,GACrC;AAAA,MAAA;AAAA,IAAA;AAAA,EAAA;AAGN;"}
+{"version":3,"file":"sd-component-library324.js","sources":["../src/components/inputs/date-inputs/base-date-range-input/partials/apply-button/apply-button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { endOfDay } from \"date-fns\";\n\nimport { SecondaryBlueButton } from \"../../../../../buttons\";\nimport { ApplyButtonProps as Props } from \"./interfaces\";\n\nexport const ApplyButton: React.FC<Props> = (props) => {\n  const { onClose, onSelect, selectedRange } = props;\n\n  const handleApply = () => {\n    selectedRange &&\n      onSelect({\n        startDate: selectedRange.startDate ?? new Date(),\n        endDate: endOfDay(selectedRange.endDate ?? new Date()),\n      });\n    onClose();\n  };\n\n  return (\n    <SecondaryBlueButton\n      width=\"140px\"\n      onClick={handleApply}\n      disabled={\n        !selectedRange || !selectedRange.startDate || !selectedRange.endDate\n      }\n    >\n      Apply\n    </SecondaryBlueButton>\n  );\n};\n"],"names":["ApplyButton","props","onClose","onSelect","selectedRange","handleApply","endOfDay","jsx","SecondaryBlueButton"],"mappings":";;;AAOa,MAAAA,IAA+B,CAACC,MAAU;AACrD,QAAM,EAAE,SAAAC,GAAS,UAAAC,GAAU,eAAAC,EAAA,IAAkBH,GAEvCI,IAAc,MAAM;AACxB,IAAAD,KACED,EAAS;AAAA,MACP,WAAWC,EAAc,aAAa,oBAAI,KAAK;AAAA,MAC/C,SAASE,EAASF,EAAc,WAAW,oBAAI,MAAM;AAAA,IAAA,CACtD,GACKF;EAAA;AAIR,SAAAK,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,SAASH;AAAA,MACT,UACE,CAACD,KAAiB,CAACA,EAAc,aAAa,CAACA,EAAc;AAAA,MAEhE,UAAA;AAAA,IAAA;AAAA,EAAA;AAIL;"}

package/lib/sd-component-library325.js

@@ -1,24 +1,93 @@
-import { j as r } from "./sd-component-library198.js";
-import { endOfDay as s } from "date-fns";
-import { SecondaryBlueButton as p } from "./sd-component-library20.js";
-const c = (e) => {
-  const { onClose: n, onSelect: o, selectedRange: t } = e, a = () => {
-    t && o({
-      startDate: t.startDate ?? /* @__PURE__ */ new Date(),
-      endDate: s(t.endDate ?? /* @__PURE__ */ new Date())
-    }), n();
-  };
-  return /* @__PURE__ */ r.jsx(
-    p,
-    {
-      width: "140px",
-      onClick: a,
-      disabled: !t || !t.startDate || !t.endDate,
-      children: "Apply"
-    }
-  );
+import { j as o } from "./sd-component-library198.js";
+import { useState as L, useCallback as M } from "react";
+import V from "./sd-component-library197.js";
+import { getCoordinateForArc as f } from "./sd-component-library93.js";
+import { GridContainerV2 as X } from "./sd-component-library40.js";
+import { ResponsiveTextV2 as g } from "./sd-component-library152.js";
+const y = "21.5px", w = 10, j = `${w}px`, J = ({
+  segment: $,
+  isHover: r,
+  animationDuration: S,
+  labelOffset: i,
+  labelPointerOffset: k,
+  radius: c,
+  mobile: e,
+  labelOffsetMobile: u
+}) => {
+  const { start: p, end: a, text: R, color: z, secondaryText: C } = $, d = c * 2, t = (p + a) / 2, h = Math.round(t * 360), { x: _, y: x } = f(c, h), [n, A] = L(), G = M((m) => {
+    m && A(m.getBoundingClientRect());
+  }, []), l = `all ${S}ms`, s = t > 0.5 ? "right" : "left", I = d + i, { x: T, y: W } = f(
+    c + u,
+    h,
+    c
+  ), b = t < 0.5, B = t < 0.15 || t > 0.85, F = t > 0.35 || t < 0.65;
+  return /* @__PURE__ */ o.jsxs(o.Fragment, { children: [
+    !e && /* @__PURE__ */ o.jsx(
+      "line",
+      {
+        x1: _ + (s === "left" ? -1 : 1) * k,
+        x2: s === "left" ? -i : d + i,
+        y1: x,
+        y2: x,
+        stroke: V.colors.cl_lightGrey,
+        strokeWidth: 1
+      }
+    ),
+    /* @__PURE__ */ o.jsx(
+      "foreignObject",
+      {
+        x: e ? T : s === "left" ? -i : I - ((n == null ? void 0 : n.width) ?? 0),
+        y: e ? W : x,
+        width: ((n == null ? void 0 : n.width) ?? 0) + w,
+        height: 50,
+        style: { overflow: "visible" },
+        children: /* @__PURE__ */ o.jsxs(
+          X,
+          {
+            width: "fit-content",
+            justifyItems: "flex-start",
+            gap: r ? "1px" : "4px",
+            sx: {
+              transform: e ? `translate(${b ? -100 : 0}%, calc(${y} * ${B ? 0 : F ? -1 : -0.5}))` : `translateY(calc(${y} / -2)) scale(${r ? 1.3 : 1})`,
+              transition: l,
+              transformOrigin: s,
+              ...e ? {
+                borderRadius: "4px",
+                boxShadow: "0px 3px 6px #00000029",
+                px: "5px",
+                py: "3px"
+              } : s === "left" ? { pr: j } : { pl: j }
+            },
+            bg: "cl_white",
+            children: [
+              /* @__PURE__ */ o.jsx(
+                g,
+                {
+                  width: "fit-content",
+                  fontSizeWeight: [18, "bold"],
+                  color: z,
+                  sx: { transition: l },
+                  ref: G,
+                  children: R
+                }
+              ),
+              /* @__PURE__ */ o.jsx(
+                g,
+                {
+                  fontSizeWeight: [r ? 13 : 14, "bold"],
+                  color: r ? "cl_darkGrey" : "cl_grey",
+                  sx: { transition: l },
+                  children: C ?? `${Math.round((a - p) * 100)}%`
+                }
+              )
+            ]
+          }
+        )
+      }
+    )
+  ] });
 };
 export {
-  c as ApplyButton
+  J as SegmentLabel
 };
 //# sourceMappingURL=sd-component-library325.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library325.js","sources":["../src/components/inputs/date-inputs/base-date-range-input/partials/apply-button/apply-button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { endOfDay } from \"date-fns\";\n\nimport { SecondaryBlueButton } from \"../../../../../buttons\";\nimport { ApplyButtonProps as Props } from \"./interfaces\";\n\nexport const ApplyButton: React.FC<Props> = (props) => {\n  const { onClose, onSelect, selectedRange } = props;\n\n  const handleApply = () => {\n    selectedRange &&\n      onSelect({\n        startDate: selectedRange.startDate ?? new Date(),\n        endDate: endOfDay(selectedRange.endDate ?? new Date()),\n      });\n    onClose();\n  };\n\n  return (\n    <SecondaryBlueButton\n      width=\"140px\"\n      onClick={handleApply}\n      disabled={\n        !selectedRange || !selectedRange.startDate || !selectedRange.endDate\n      }\n    >\n      Apply\n    </SecondaryBlueButton>\n  );\n};\n"],"names":["ApplyButton","props","onClose","onSelect","selectedRange","handleApply","endOfDay","jsx","SecondaryBlueButton"],"mappings":";;;AAOa,MAAAA,IAA+B,CAACC,MAAU;AACrD,QAAM,EAAE,SAAAC,GAAS,UAAAC,GAAU,eAAAC,EAAA,IAAkBH,GAEvCI,IAAc,MAAM;AACxB,IAAAD,KACED,EAAS;AAAA,MACP,WAAWC,EAAc,aAAa,oBAAI,KAAK;AAAA,MAC/C,SAASE,EAASF,EAAc,WAAW,oBAAI,MAAM;AAAA,IAAA,CACtD,GACKF;EAAA;AAIR,SAAAK,gBAAAA,EAAA;AAAA,IAACC;AAAA,IAAA;AAAA,MACC,OAAM;AAAA,MACN,SAASH;AAAA,MACT,UACE,CAACD,KAAiB,CAACA,EAAc,aAAa,CAACA,EAAc;AAAA,MAEhE,UAAA;AAAA,IAAA;AAAA,EAAA;AAIL;"}
+{"version":3,"file":"sd-component-library325.js","sources":["../src/components/meters/donut-diagram/partials/segment-label/segment-label.tsx"],"sourcesContent":["import React, { useCallback, useState } from \"react\";\n\nimport theme from \"../../../../../core/theme\";\nimport { Grid } from \"../../../../containers\";\nimport { ResponsiveTextV2 } from \"../../../../texts\";\nimport { getCoordinateForArc } from \"../../../outline-meter/utils\";\nimport { DonutSegmentLabelPosition } from \"../../interfaces\";\nimport { SegmentLabelProps as Props } from \"./interfaces\";\n\nconst rowHeight = \"21.5px\";\nconst maskSize = 10;\nconst maskSizePx = `${maskSize}px`;\n\nexport const SegmentLabel: React.FC<Props> = ({\n  segment,\n  isHover,\n  animationDuration,\n  labelOffset,\n  labelPointerOffset,\n  radius,\n  mobile,\n  labelOffsetMobile,\n}) => {\n  const { start, end, text, color, secondaryText } = segment;\n  const diameter = radius * 2;\n  const middle = (start + end) / 2;\n  const middleAlpha = Math.round(middle * 360);\n  const { x, y } = getCoordinateForArc(radius, middleAlpha);\n\n  const [rect, setRect] = useState<DOMRect>();\n  const ref = useCallback((node: HTMLDivElement) => {\n    if (node) {\n      setRect(node.getBoundingClientRect());\n    }\n  }, []);\n\n  const transition = `all ${animationDuration}ms`;\n\n  const position: DonutSegmentLabelPosition = middle > 0.5 ? \"right\" : \"left\";\n  const maxX = diameter + labelOffset;\n\n  const { x: pointerX, y: pointerY } = getCoordinateForArc(\n    radius + labelOffsetMobile,\n    middleAlpha,\n    radius\n  );\n\n  const isAtLeft = middle < 0.5;\n  const isInBottom = middle < 0.15 || middle > 0.85;\n  const isInTop = middle > 0.35 || middle < 0.65;\n\n  return (\n    <>\n      {!mobile && (\n        <line\n          x1={x + (position === \"left\" ? -1 : 1) * labelPointerOffset}\n          x2={position === \"left\" ? -labelOffset : diameter + labelOffset}\n          y1={y}\n          y2={y}\n          stroke={theme.colors[\"cl_lightGrey\"]}\n          strokeWidth={1}\n        />\n      )}\n\n      <foreignObject\n        x={\n          mobile\n            ? pointerX\n            : position === \"left\"\n            ? -labelOffset\n            : maxX - (rect?.width ?? 0)\n        }\n        y={mobile ? pointerY : y}\n        width={(rect?.width ?? 0) + maskSize}\n        height={50}\n        style={{ overflow: \"visible\" }}\n      >\n        <Grid\n          width=\"fit-content\"\n          justifyItems=\"flex-start\"\n          gap={isHover ? \"1px\" : \"4px\"}\n          sx={{\n            transform: mobile\n              ? `translate(${isAtLeft ? -100 : 0}%, calc(${rowHeight} * ${\n                  isInBottom ? 0 : isInTop ? -1 : -0.5\n                }))`\n              : `translateY(calc(${rowHeight} / -2)) scale(${\n                  isHover ? 1.3 : 1\n                })`,\n            transition,\n            transformOrigin: position,\n            ...(mobile\n              ? {\n                  borderRadius: \"4px\",\n                  boxShadow: \"0px 3px 6px #00000029\",\n                  px: \"5px\",\n                  py: \"3px\",\n                }\n              : position === \"left\"\n              ? { pr: maskSizePx }\n              : { pl: maskSizePx }),\n          }}\n          bg=\"cl_white\"\n        >\n          <ResponsiveTextV2\n            width=\"fit-content\"\n            fontSizeWeight={[18, \"bold\"]}\n            color={color}\n            sx={{ transition }}\n            ref={ref}\n          >\n            {text}\n          </ResponsiveTextV2>\n\n          <ResponsiveTextV2\n            fontSizeWeight={[isHover ? 13 : 14, \"bold\"]}\n            color={isHover ? \"cl_darkGrey\" : \"cl_grey\"}\n            sx={{ transition }}\n          >\n            {secondaryText ?? `${Math.round((end - start) * 100)}%`}\n          </ResponsiveTextV2>\n        </Grid>\n      </foreignObject>\n    </>\n  );\n};\n"],"names":["rowHeight","maskSize","maskSizePx","SegmentLabel","segment","isHover","animationDuration","labelOffset","labelPointerOffset","radius","mobile","labelOffsetMobile","start","end","text","color","secondaryText","diameter","middle","middleAlpha","x","y","getCoordinateForArc","rect","setRect","useState","ref","useCallback","node","transition","position","maxX","pointerX","pointerY","isAtLeft","isInBottom","isInTop","jsxs","Fragment","jsx","theme","Grid","ResponsiveTextV2"],"mappings":"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"}

package/lib/sd-component-library53.js

@@ -1,8 +1,8 @@
 import { j as t } from "./sd-component-library198.js";
-import { BaseBooleanFeedback as m } from "./sd-component-library214.js";
+import { BaseBooleanFeedback as m } from "./sd-component-library212.js";
 import { IconButton as n } from "./sd-component-library23.js";
-import { ReactComponent as c } from "./sd-component-library215.js";
-import { ReactComponent as u } from "./sd-component-library216.js";
+import { ReactComponent as c } from "./sd-component-library213.js";
+import { ReactComponent as u } from "./sd-component-library214.js";
 const f = (i) => {
   const { title: s, onPositiveFeedback: r, onNegativeFeedback: d, optionSelected: e } = i, a = (o) => /* @__PURE__ */ t.jsx(n, { onClick: o, "data-testid": "thumbs-up-button", children: /* @__PURE__ */ t.jsx(
     c,

package/lib/sd-component-library54.js

@@ -1,8 +1,8 @@
 import { j as e } from "./sd-component-library198.js";
 import { useHover as x } from "./sd-component-library3.js";
-import { BaseFeedbackContainer as f } from "./sd-component-library212.js";
+import { BaseFeedbackContainer as f } from "./sd-component-library215.js";
 import { BaseGridContainer as j } from "./sd-component-library37.js";
-import { BaseFeedbackButton as k } from "./sd-component-library213.js";
+import { BaseFeedbackButton as k } from "./sd-component-library216.js";
 const C = ({
   questionText: t,
   options: a,

package/lib/sd-component-library55.js

@@ -2,9 +2,9 @@ import { j as o } from "./sd-component-library198.js";
 import { Box as l } from "rebass";
 import { useHover as k, useBreakPoints as g } from "./sd-component-library3.js";
 import { isTouchScreen as C } from "./sd-component-library4.js";
-import { BaseFeedbackContainer as S } from "./sd-component-library212.js";
+import { BaseFeedbackContainer as S } from "./sd-component-library215.js";
 import { GridContainerV2 as y } from "./sd-component-library40.js";
-import { BaseFeedbackButton as a } from "./sd-component-library213.js";
+import { BaseFeedbackButton as a } from "./sd-component-library216.js";
 import { FrMaxContainer as x } from "./sd-component-library39.js";
 import { ReactComponent as B } from "./sd-component-library178.js";
 const D = ({