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

package/lib/sd-component-library229.js

@@ -1,6 +1,42 @@
-import * as t from "react";
-const h = (e) => /* @__PURE__ */ t.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", width: 24, height: 24, viewBox: "0 0 24 24", ...e }, /* @__PURE__ */ t.createElement("path", { fill: "#4B71F7", d: "M24 9h-9v-9h-6v9h-9v6h9v9h6v-9h9z" }));
+import { j as o } from "./sd-component-library195.js";
+import n from "react";
+import "./sd-component-library198.js";
+import { Box as t } from "./sd-component-library199.js";
+import { HorizontalDivider as i } from "./sd-component-library51.js";
+import { SearchAutocompleteRow as a } from "./sd-component-library628.js";
+const j = (l) => {
+  const {
+    results: p,
+    onSelect: s,
+    rowHeight: e,
+    rowsDisplayed: x
+  } = l, c = (r) => () => s(r);
+  return /* @__PURE__ */ o.jsxs(t, { sx: {
+    top: "calc(100% - 2px)",
+    left: 0,
+    position: "absolute",
+    width: "100%",
+    cursor: "pointer",
+    zIndex: 1
+  }, children: [
+    /* @__PURE__ */ o.jsx(i, { color: "cl_purple", height: "2px" }),
+    /* @__PURE__ */ o.jsx(t, { sx: {
+      overflowY: "auto",
+      maxHeight: `${x * (e + 1) - 1}px`,
+      borderWidth: "1px",
+      borderStyle: "solid",
+      borderColor: "cl_lightGrey",
+      borderRadius: "0 0 3px 3px",
+      borderTopStyle: "none",
+      boxShadow: "2px 3px 10px rgba(211,223,255,0.25)",
+      bg: "cl_white"
+    }, children: p.map((r, d) => /* @__PURE__ */ o.jsxs(n.Fragment, { children: [
+      d !== 0 && /* @__PURE__ */ o.jsx(i, { color: "cl_headerLine" }),
+      /* @__PURE__ */ o.jsx(a, { ...r, onClick: c(r), height: e })
+    ] }, r.id)) })
+  ] });
+};
 export {
-  h as ReactComponent
+  j as SearchAutocompleteResultsBox
 };
 //# sourceMappingURL=sd-component-library229.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library229.js","sources":["../src/components/inputs/primary-number-input/assets/plus-active.svg"],"sourcesContent":["export default \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIyNCIgaGVpZ2h0PSIyNCIgdmlld0JveD0iMCAwIDI0IDI0Ij48cGF0aCBmaWxsPSIjNEI3MUY3IiBkPSJNMjQgOWgtOXYtOWgtNnY5aC05djZoOXY5aDZ2LTloOXoiLz48L3N2Zz4=\""],"names":["SvgPlusActive","props","React"],"mappings":";AACK,MAACA,IAAgB,CAACC,MAA0B,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,8BAA8B,OAAO,IAAI,QAAQ,IAAI,SAAS,aAAa,GAAGD,EAAO,GAAkB,gBAAAC,EAAM,cAAc,QAAQ,EAAE,MAAM,WAAW,GAAG,oCAAmC,CAAE,CAAC;"}
+{"version":3,"file":"sd-component-library229.js","sources":["../src/components/inputs/search-autocomplete-input/partials/search-autocomplete-results-box/search-autocomplete-results-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { HorizontalDivider } from \"../../../../dividers/horizontal-divider\";\nimport { SearchAutocompleteOption } from \"../../interfaces\";\nimport { SearchAutocompleteRow } from \"../search-autocomplete-row\";\nimport { SearchAutocompleteResultsBoxProps as Props } from \"./interfaces\";\n\nexport const SearchAutocompleteResultsBox = <\n  T extends { id: string } = { id: string }\n>(\n  props: Props<T>\n) => {\n  const { results, onSelect, rowHeight, rowsDisplayed } = props;\n\n  const onClick = (result: SearchAutocompleteOption<T>) => () =>\n    onSelect(result);\n\n  return (\n    <Box\n      sx={{\n        top: \"calc(100% - 2px)\",\n        left: 0,\n        position: \"absolute\",\n        width: \"100%\",\n        cursor: \"pointer\",\n        zIndex: 1,\n      }}\n    >\n      <HorizontalDivider color=\"cl_purple\" height=\"2px\" />\n\n      <Box\n        sx={{\n          overflowY: \"auto\",\n          maxHeight: `${rowsDisplayed * (rowHeight + 1) - 1}px`,\n          borderWidth: \"1px\",\n          borderStyle: \"solid\",\n          borderColor: \"cl_lightGrey\",\n          borderRadius: \"0 0 3px 3px\",\n          borderTopStyle: \"none\",\n          boxShadow: \"2px 3px 10px rgba(211,223,255,0.25)\",\n          bg: \"cl_white\",\n        }}\n      >\n        {results.map((result, idx) => (\n          <React.Fragment key={result.id}>\n            {idx !== 0 && <HorizontalDivider color=\"cl_headerLine\" />}\n\n            <SearchAutocompleteRow\n              {...result}\n              onClick={onClick(result)}\n              height={rowHeight}\n            />\n          </React.Fragment>\n        ))}\n      </Box>\n    </Box>\n  );\n};\n"],"names":["SearchAutocompleteResultsBox","props","results","onSelect","rowHeight","rowsDisplayed","onClick","result","jsxs","Box","top","left","position","width","cursor","zIndex","jsx","HorizontalDivider","overflowY","maxHeight","borderWidth","borderStyle","borderColor","borderRadius","borderTopStyle","boxShadow","bg","map","idx","React","SearchAutocompleteRow","id"],"mappings":";;;;;;AASaA,MAAAA,IAA+B,CAG1CC,MACG;AACG,QAAA;AAAA,IAAEC,SAAAA;AAAAA,IAASC,UAAAA;AAAAA,IAAUC,WAAAA;AAAAA,IAAWC,eAAAA;AAAAA,EAAkBJ,IAAAA,GAElDK,IAAUA,CAACC,MAAwC,MACvDJ,EAASI,CAAM;AAGf,SAAAC,gBAAAA,EAAA,KAACC,KACC,IAAI;AAAA,IACFC,KAAK;AAAA,IACLC,MAAM;AAAA,IACNC,UAAU;AAAA,IACVC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQ;AAAA,EAGV,GAAA,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACC,GAAkB,EAAA,OAAM,aAAY,QAAO,OAAK;AAAA,IAEjDD,gBAAAA,MAACP,KACC,IAAI;AAAA,MACFS,WAAW;AAAA,MACXC,WAAY,GAAEd,KAAiBD,IAAY,KAAK,CAAE;AAAA,MAClDgB,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,cAAc;AAAA,MACdC,gBAAgB;AAAA,MAChBC,WAAW;AAAA,MACXC,IAAI;AAAA,IACN,GAECxB,YAAQyB,IAAI,CAACpB,GAAQqB,MACpBpB,gBAAAA,EAAAA,KAACqB,EAAM,UAAN,EACED,UAAAA;AAAAA,MAAAA,MAAQ,KAAKZ,gBAAAA,EAAA,IAACC,GAAkB,EAAA,OAAM,iBAAkB;AAAA,MAEzDD,gBAAAA,MAACc,KACC,GAAIvB,GACJ,SAASD,EAAQC,CAAM,GACvB,QAAQH,GAAU;AAAA,IANDG,EAAAA,GAAAA,EAAOwB,EAQ5B,CACD,GACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library230.js

@@ -1,6 +1,33 @@
-import * as t from "react";
-const a = (e) => /* @__PURE__ */ t.createElement("svg", { xmlns: "http://www.w3.org/2000/svg", viewBox: "0 0 22 22.94", ...e }, /* @__PURE__ */ t.createElement("path", { d: "M2494.01,1419.91l-5.42-5.67a9.187,9.187,0,1,0-7.04,3.3,9.042,9.042,0,0,0,5.27-1.67l5.46,5.71a1.2,1.2,0,0,0,.87.37A1.2,1.2,0,0,0,2494.01,1419.91Zm-12.46-18.46a6.84,6.84,0,1,1-6.8,6.84A6.829,6.829,0,0,1,2481.55,1401.45Z", transform: "translate(-2472.34 -1399.03)" }));
+import { j as r } from "./sd-component-library195.js";
+import "./sd-component-library198.js";
+import { Flex as x } from "./sd-component-library199.js";
+import { BaseTextV2 as c } from "./sd-component-library135.js";
+import { ResponsiveTextV2 as m } from "./sd-component-library147.js";
+const u = (t) => {
+  const {
+    label: o,
+    errorMessage: l,
+    labelMargin: s,
+    secondLabel: e,
+    secondLabelTextTransform: n,
+    labelSx: a,
+    labelColor: i = "cl_darkGrey"
+  } = t;
+  return o ? /* @__PURE__ */ r.jsxs(x, { sx: {
+    cursor: "default"
+  }, children: [
+    /* @__PURE__ */ r.jsx(c, { color: l ? "cl_red" : i, sx: {
+      fontSize: 12,
+      fontWeight: 600,
+      m: s,
+      letterSpacing: "1px",
+      textTransform: "uppercase",
+      ...a
+    }, children: o }),
+    e && /* @__PURE__ */ r.jsx(m, { letterSpacing: "1px", ml: e.ml || "3px", color: e.color || "cl_grey", fontSizeWeight: e.fontSizeWeight || [[10, "semi-bold"]], textTransform: n, ...e, children: e.text })
+  ] }) : null;
+};
 export {
-  a as ReactComponent
+  u as SecondaryInputLabels
 };
 //# sourceMappingURL=sd-component-library230.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library230.js","sources":["../src/components/inputs/search-input/presentational/assets/search.svg"],"sourcesContent":["export default \"data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHZpZXdCb3g9IjAgMCAyMiAyMi45NCI+CiAgPHBhdGggZD0iTTI0OTQuMDEsMTQxOS45MWwtNS40Mi01LjY3YTkuMTg3LDkuMTg3LDAsMSwwLTcuMDQsMy4zLDkuMDQyLDkuMDQyLDAsMCwwLDUuMjctMS42N2w1LjQ2LDUuNzFhMS4yLDEuMiwwLDAsMCwuODcuMzdBMS4yLDEuMiwwLDAsMCwyNDk0LjAxLDE0MTkuOTFabS0xMi40Ni0xOC40NmE2Ljg0LDYuODQsMCwxLDEtNi44LDYuODRBNi44MjksNi44MjksMCwwLDEsMjQ4MS41NSwxNDAxLjQ1WiIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTI0NzIuMzQgLTEzOTkuMDMpIi8+Cjwvc3ZnPgo=\""],"names":["SvgSearch","props","React"],"mappings":";AACK,MAACA,IAAY,CAACC,MAA0B,gBAAAC,EAAM,cAAc,OAAO,EAAE,OAAO,8BAA8B,SAAS,gBAAgB,GAAGD,EAAO,GAAkB,gBAAAC,EAAM,cAAc,QAAQ,EAAE,GAAG,6NAA6N,WAAW,gCAAgC,CAAC;"}
+{"version":3,"file":"sd-component-library230.js","sources":["../src/components/inputs/secondary-text-input/partials/secondary-input-labels/secondary-input-labels.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Flex } from \"rebass\";\n\nimport { BaseTextV2, ResponsiveTextV2 } from \"../../../../texts\";\nimport { SecondaryInputLabelsProps as Props } from \"./interfaces\";\n\nexport const SecondaryInputLabels: React.FC<Props> = (props) => {\n  const {\n    label,\n    errorMessage,\n    labelMargin,\n    secondLabel,\n    secondLabelTextTransform,\n    labelSx,\n    labelColor = \"cl_darkGrey\",\n  } = props;\n\n  if (!label) return null;\n\n  return (\n    <Flex sx={{ cursor: \"default\" }}>\n      <BaseTextV2\n        color={errorMessage ? \"cl_red\" : labelColor}\n        sx={{\n          fontSize: 12,\n          fontWeight: 600,\n          m: labelMargin,\n          letterSpacing: \"1px\",\n          textTransform: \"uppercase\",\n          ...labelSx,\n        }}\n      >\n        {label}\n      </BaseTextV2>\n\n      {secondLabel && (\n        <ResponsiveTextV2\n          letterSpacing=\"1px\"\n          ml={secondLabel.ml || \"3px\"}\n          color={secondLabel.color || \"cl_grey\"}\n          fontSizeWeight={secondLabel.fontSizeWeight || [[10, \"semi-bold\"]]}\n          textTransform={secondLabelTextTransform}\n          {...secondLabel}\n        >\n          {secondLabel.text}\n        </ResponsiveTextV2>\n      )}\n    </Flex>\n  );\n};\n"],"names":["SecondaryInputLabels","props","label","errorMessage","labelMargin","secondLabel","secondLabelTextTransform","labelSx","labelColor","jsxs","Flex","cursor","jsx","BaseTextV2","fontSize","fontWeight","m","letterSpacing","textTransform","ResponsiveTextV2","ml","color","fontSizeWeight","text"],"mappings":";;;;;AAOO,MAAMA,IAAyCC,CAAUA,MAAA;AACxD,QAAA;AAAA,IACJC,OAAAA;AAAAA,IACAC,cAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,0BAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,YAAAA,IAAa;AAAA,EACXP,IAAAA;AAEJ,SAAKC,IAGHO,gBAAAA,EAAA,KAACC,KAAK,IAAI;AAAA,IAAEC,QAAQ;AAAA,EAClB,GAAA,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACC,GACC,EAAA,OAAOV,IAAe,WAAWK,GACjC,IAAI;AAAA,MACFM,UAAU;AAAA,MACVC,YAAY;AAAA,MACZC,GAAGZ;AAAAA,MACHa,eAAe;AAAA,MACfC,eAAe;AAAA,MACf,GAAGX;AAAAA,IAAAA,GAGJL,UACHA,GAAA;AAAA,IAECG,KACEO,gBAAAA,EAAAA,IAAAO,GAAA,EACC,eAAc,OACd,IAAId,EAAYe,MAAM,OACtB,OAAOf,EAAYgB,SAAS,WAC5B,gBAAgBhB,EAAYiB,kBAAkB,CAAC,CAAC,IAAI,WAAW,CAAC,GAChE,eAAehB,GACXD,GAAAA,GAEHA,UAAAA,EAAYkB,KACf,CAAA;AAAA,EAEJ,EAAA,CAAA,IA9BiB;AAgCrB;"}

package/lib/sd-component-library231.js

@@ -1,42 +1,15 @@
-import { j as o } from "./sd-component-library195.js";
-import n from "react";
-import "./sd-component-library198.js";
-import { Box as t } from "./sd-component-library199.js";
-import { HorizontalDivider as i } from "./sd-component-library51.js";
-import { SearchAutocompleteRow as a } from "./sd-component-library628.js";
-const j = (l) => {
+import { j as r } from "./sd-component-library195.js";
+import { Label as l } from "./sd-component-library213.js";
+const n = (a) => {
   const {
-    results: p,
-    onSelect: s,
-    rowHeight: e,
-    rowsDisplayed: x
-  } = l, c = (r) => () => s(r);
-  return /* @__PURE__ */ o.jsxs(t, { sx: {
-    top: "calc(100% - 2px)",
-    left: 0,
-    position: "absolute",
-    width: "100%",
-    cursor: "pointer",
-    zIndex: 1
-  }, children: [
-    /* @__PURE__ */ o.jsx(i, { color: "cl_purple", height: "2px" }),
-    /* @__PURE__ */ o.jsx(t, { sx: {
-      overflowY: "auto",
-      maxHeight: `${x * (e + 1) - 1}px`,
-      borderWidth: "1px",
-      borderStyle: "solid",
-      borderColor: "cl_lightGrey",
-      borderRadius: "0 0 3px 3px",
-      borderTopStyle: "none",
-      boxShadow: "2px 3px 10px rgba(211,223,255,0.25)",
-      bg: "cl_white"
-    }, children: p.map((r, d) => /* @__PURE__ */ o.jsxs(n.Fragment, { children: [
-      d !== 0 && /* @__PURE__ */ o.jsx(i, { color: "cl_headerLine" }),
-      /* @__PURE__ */ o.jsx(a, { ...r, onClick: c(r), height: e })
-    ] }, r.id)) })
-  ] });
+    variant: t,
+    label: e
+  } = a;
+  return /* @__PURE__ */ r.jsx(l, { ...a, sx: {
+    fontFamily: "proxima-nova"
+  }, variant: `_labels.${t}`, "data-test": "base-label", children: e });
 };
 export {
-  j as SearchAutocompleteResultsBox
+  n as BaseLabel
 };
 //# sourceMappingURL=sd-component-library231.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library231.js","sources":["../src/components/inputs/search-autocomplete-input/partials/search-autocomplete-results-box/search-autocomplete-results-box.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { HorizontalDivider } from \"../../../../dividers/horizontal-divider\";\nimport { SearchAutocompleteOption } from \"../../interfaces\";\nimport { SearchAutocompleteRow } from \"../search-autocomplete-row\";\nimport { SearchAutocompleteResultsBoxProps as Props } from \"./interfaces\";\n\nexport const SearchAutocompleteResultsBox = <\n  T extends { id: string } = { id: string }\n>(\n  props: Props<T>\n) => {\n  const { results, onSelect, rowHeight, rowsDisplayed } = props;\n\n  const onClick = (result: SearchAutocompleteOption<T>) => () =>\n    onSelect(result);\n\n  return (\n    <Box\n      sx={{\n        top: \"calc(100% - 2px)\",\n        left: 0,\n        position: \"absolute\",\n        width: \"100%\",\n        cursor: \"pointer\",\n        zIndex: 1,\n      }}\n    >\n      <HorizontalDivider color=\"cl_purple\" height=\"2px\" />\n\n      <Box\n        sx={{\n          overflowY: \"auto\",\n          maxHeight: `${rowsDisplayed * (rowHeight + 1) - 1}px`,\n          borderWidth: \"1px\",\n          borderStyle: \"solid\",\n          borderColor: \"cl_lightGrey\",\n          borderRadius: \"0 0 3px 3px\",\n          borderTopStyle: \"none\",\n          boxShadow: \"2px 3px 10px rgba(211,223,255,0.25)\",\n          bg: \"cl_white\",\n        }}\n      >\n        {results.map((result, idx) => (\n          <React.Fragment key={result.id}>\n            {idx !== 0 && <HorizontalDivider color=\"cl_headerLine\" />}\n\n            <SearchAutocompleteRow\n              {...result}\n              onClick={onClick(result)}\n              height={rowHeight}\n            />\n          </React.Fragment>\n        ))}\n      </Box>\n    </Box>\n  );\n};\n"],"names":["SearchAutocompleteResultsBox","props","results","onSelect","rowHeight","rowsDisplayed","onClick","result","jsxs","Box","top","left","position","width","cursor","zIndex","jsx","HorizontalDivider","overflowY","maxHeight","borderWidth","borderStyle","borderColor","borderRadius","borderTopStyle","boxShadow","bg","map","idx","React","SearchAutocompleteRow","id"],"mappings":";;;;;;AASaA,MAAAA,IAA+B,CAG1CC,MACG;AACG,QAAA;AAAA,IAAEC,SAAAA;AAAAA,IAASC,UAAAA;AAAAA,IAAUC,WAAAA;AAAAA,IAAWC,eAAAA;AAAAA,EAAkBJ,IAAAA,GAElDK,IAAUA,CAACC,MAAwC,MACvDJ,EAASI,CAAM;AAGf,SAAAC,gBAAAA,EAAA,KAACC,KACC,IAAI;AAAA,IACFC,KAAK;AAAA,IACLC,MAAM;AAAA,IACNC,UAAU;AAAA,IACVC,OAAO;AAAA,IACPC,QAAQ;AAAA,IACRC,QAAQ;AAAA,EAGV,GAAA,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACC,GAAkB,EAAA,OAAM,aAAY,QAAO,OAAK;AAAA,IAEjDD,gBAAAA,MAACP,KACC,IAAI;AAAA,MACFS,WAAW;AAAA,MACXC,WAAY,GAAEd,KAAiBD,IAAY,KAAK,CAAE;AAAA,MAClDgB,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,aAAa;AAAA,MACbC,cAAc;AAAA,MACdC,gBAAgB;AAAA,MAChBC,WAAW;AAAA,MACXC,IAAI;AAAA,IACN,GAECxB,YAAQyB,IAAI,CAACpB,GAAQqB,MACpBpB,gBAAAA,EAAAA,KAACqB,EAAM,UAAN,EACED,UAAAA;AAAAA,MAAAA,MAAQ,KAAKZ,gBAAAA,EAAA,IAACC,GAAkB,EAAA,OAAM,iBAAkB;AAAA,MAEzDD,gBAAAA,MAACc,KACC,GAAIvB,GACJ,SAASD,EAAQC,CAAM,GACvB,QAAQH,GAAU;AAAA,IANDG,EAAAA,GAAAA,EAAOwB,EAQ5B,CACD,GACH;AAAA,EACF,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library231.js","sources":["../src/components/labels/base-label/base-label.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Label } from \"@rebass/forms\";\n\nimport { BaseLabelProps } from \"./interfaces\";\n\nexport const BaseLabel = (props: BaseLabelProps) => {\n  const { variant, label } = props;\n\n  return (\n    <Label\n      {...props}\n      sx={{ fontFamily: \"proxima-nova\" }}\n      variant={`_labels.${variant}`}\n      data-test=\"base-label\"\n    >\n      {label}\n    </Label>\n  );\n};\n"],"names":["BaseLabel","props","variant","label","jsx","Label","fontFamily"],"mappings":";;AAMaA,MAAAA,IAAYA,CAACC,MAA0B;AAC5C,QAAA;AAAA,IAAEC,SAAAA;AAAAA,IAASC,OAAAA;AAAAA,EAAUF,IAAAA;AAE3B,SACGG,gBAAAA,EAAA,IAAAC,GAAA,EACC,GAAIJ,GACJ,IAAI;AAAA,IAAEK,YAAY;AAAA,EAAA,GAClB,SAAU,WAAUJ,CAAQ,IAC5B,aAAU,cAETC,UACHA,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library232.js

@@ -1,33 +1,45 @@
-import { j as r } from "./sd-component-library195.js";
+import { j as o } from "./sd-component-library195.js";
 import "./sd-component-library198.js";
-import { Flex as x } from "./sd-component-library199.js";
-import { BaseTextV2 as c } from "./sd-component-library135.js";
-import { ResponsiveTextV2 as m } from "./sd-component-library147.js";
-const u = (t) => {
+import { Box as d } from "./sd-component-library199.js";
+import { BoldText as t } from "./sd-component-library160.js";
+import { FlexCenter as m } from "./sd-component-library37.js";
+const h = "80px", j = (i) => {
   const {
-    label: o,
-    errorMessage: l,
-    labelMargin: s,
-    secondLabel: e,
-    secondLabelTextTransform: n,
-    labelSx: a,
-    labelColor: i = "cl_darkGrey"
-  } = t;
-  return o ? /* @__PURE__ */ r.jsxs(x, { sx: {
-    cursor: "default"
-  }, children: [
-    /* @__PURE__ */ r.jsx(c, { color: l ? "cl_red" : i, sx: {
-      fontSize: 12,
-      fontWeight: 600,
-      m: s,
-      letterSpacing: "1px",
-      textTransform: "uppercase",
-      ...a
-    }, children: o }),
-    e && /* @__PURE__ */ r.jsx(m, { letterSpacing: "1px", ml: e.ml || "3px", color: e.color || "cl_grey", fontSizeWeight: e.fontSizeWeight || [[10, "semi-bold"]], textTransform: n, ...e, children: e.text })
-  ] }) : null;
+    questionText: n,
+    children: r,
+    containerSx: x,
+    iconContainerSx: p,
+    questionTextFontSize: s = 24,
+    iconFontSize: a = 40,
+    questionMarginBottom: c = "30px",
+    showIcon: e = !1,
+    ...l
+  } = i;
+  return /* @__PURE__ */ o.jsxs(d, { sx: {
+    width: "270px",
+    position: "relative",
+    borderRadius: "5px",
+    boxShadow: "0px 0px 10px #9BA2B433",
+    px: "40px",
+    pb: "40px",
+    pt: e ? "70px" : "40px",
+    bg: "cl_white",
+    ...x
+  }, ...l, children: [
+    /* @__PURE__ */ o.jsx(t, { fontSize: s, textAlign: "center", mb: c, children: n }),
+    r,
+    e && /* @__PURE__ */ o.jsx(m, { size: h, bg: "white", sx: {
+      position: "absolute",
+      left: "50%",
+      top: 0,
+      boxShadow: "0px 0px 10px #9BA2B433",
+      borderRadius: "50%",
+      transform: "translate(-50%, -50%)",
+      ...p
+    }, children: /* @__PURE__ */ o.jsx(t, { fontSize: a, color: "cl_purple", children: "?" }) })
+  ] });
 };
 export {
-  u as SecondaryInputLabels
+  j as BaseFeedbackContainer
 };
 //# sourceMappingURL=sd-component-library232.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library232.js","sources":["../src/components/inputs/secondary-text-input/partials/secondary-input-labels/secondary-input-labels.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Flex } from \"rebass\";\n\nimport { BaseTextV2, ResponsiveTextV2 } from \"../../../../texts\";\nimport { SecondaryInputLabelsProps as Props } from \"./interfaces\";\n\nexport const SecondaryInputLabels: React.FC<Props> = (props) => {\n  const {\n    label,\n    errorMessage,\n    labelMargin,\n    secondLabel,\n    secondLabelTextTransform,\n    labelSx,\n    labelColor = \"cl_darkGrey\",\n  } = props;\n\n  if (!label) return null;\n\n  return (\n    <Flex sx={{ cursor: \"default\" }}>\n      <BaseTextV2\n        color={errorMessage ? \"cl_red\" : labelColor}\n        sx={{\n          fontSize: 12,\n          fontWeight: 600,\n          m: labelMargin,\n          letterSpacing: \"1px\",\n          textTransform: \"uppercase\",\n          ...labelSx,\n        }}\n      >\n        {label}\n      </BaseTextV2>\n\n      {secondLabel && (\n        <ResponsiveTextV2\n          letterSpacing=\"1px\"\n          ml={secondLabel.ml || \"3px\"}\n          color={secondLabel.color || \"cl_grey\"}\n          fontSizeWeight={secondLabel.fontSizeWeight || [[10, \"semi-bold\"]]}\n          textTransform={secondLabelTextTransform}\n          {...secondLabel}\n        >\n          {secondLabel.text}\n        </ResponsiveTextV2>\n      )}\n    </Flex>\n  );\n};\n"],"names":["SecondaryInputLabels","props","label","errorMessage","labelMargin","secondLabel","secondLabelTextTransform","labelSx","labelColor","jsxs","Flex","cursor","jsx","BaseTextV2","fontSize","fontWeight","m","letterSpacing","textTransform","ResponsiveTextV2","ml","color","fontSizeWeight","text"],"mappings":";;;;;AAOO,MAAMA,IAAyCC,CAAUA,MAAA;AACxD,QAAA;AAAA,IACJC,OAAAA;AAAAA,IACAC,cAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,0BAAAA;AAAAA,IACAC,SAAAA;AAAAA,IACAC,YAAAA,IAAa;AAAA,EACXP,IAAAA;AAEJ,SAAKC,IAGHO,gBAAAA,EAAA,KAACC,KAAK,IAAI;AAAA,IAAEC,QAAQ;AAAA,EAClB,GAAA,UAAA;AAAA,IAAAC,gBAAAA,EAAA,IAACC,GACC,EAAA,OAAOV,IAAe,WAAWK,GACjC,IAAI;AAAA,MACFM,UAAU;AAAA,MACVC,YAAY;AAAA,MACZC,GAAGZ;AAAAA,MACHa,eAAe;AAAA,MACfC,eAAe;AAAA,MACf,GAAGX;AAAAA,IAAAA,GAGJL,UACHA,GAAA;AAAA,IAECG,KACEO,gBAAAA,EAAAA,IAAAO,GAAA,EACC,eAAc,OACd,IAAId,EAAYe,MAAM,OACtB,OAAOf,EAAYgB,SAAS,WAC5B,gBAAgBhB,EAAYiB,kBAAkB,CAAC,CAAC,IAAI,WAAW,CAAC,GAChE,eAAehB,GACXD,GAAAA,GAEHA,UAAAA,EAAYkB,KACf,CAAA;AAAA,EAEJ,EAAA,CAAA,IA9BiB;AAgCrB;"}
+{"version":3,"file":"sd-component-library232.js","sources":["../src/components/feedback/base-feedback-container/base-feedback-container.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Box } from \"rebass\";\n\nimport { FlexCenter } from \"../../containers\";\nimport { BoldText } from \"../../texts\";\nimport { BaseFeedbackBlockProps as Props } from \"./interfaces\";\n\nconst iconSize = \"80px\";\n\nexport const BaseFeedbackContainer: React.FC<Props> = (props) => {\n  const {\n    questionText,\n    children,\n    containerSx,\n    iconContainerSx,\n    questionTextFontSize = 24,\n    iconFontSize = 40,\n    questionMarginBottom = \"30px\",\n    showIcon = false,\n    ...hoverCallbacks\n  } = props;\n\n  return (\n    <Box\n      sx={{\n        width: \"270px\",\n        position: \"relative\",\n        borderRadius: \"5px\",\n        boxShadow: \"0px 0px 10px #9BA2B433\",\n        px: \"40px\",\n        pb: \"40px\",\n        pt: showIcon ? \"70px\" : \"40px\",\n        bg: \"cl_white\",\n        ...containerSx,\n      }}\n      {...hoverCallbacks}\n    >\n      <BoldText\n        fontSize={questionTextFontSize}\n        textAlign=\"center\"\n        mb={questionMarginBottom}\n      >\n        {questionText}\n      </BoldText>\n\n      {children}\n\n      {showIcon && (\n        <FlexCenter\n          size={iconSize}\n          bg=\"white\"\n          sx={{\n            position: \"absolute\",\n            left: \"50%\",\n            top: 0,\n            boxShadow: \"0px 0px 10px #9BA2B433\",\n            borderRadius: \"50%\",\n            transform: \"translate(-50%, -50%)\",\n            ...iconContainerSx,\n          }}\n        >\n          <BoldText fontSize={iconFontSize} color=\"cl_purple\">\n            ?\n          </BoldText>\n        </FlexCenter>\n      )}\n    </Box>\n  );\n};\n"],"names":["iconSize","BaseFeedbackContainer","props","questionText","children","containerSx","iconContainerSx","questionTextFontSize","iconFontSize","questionMarginBottom","showIcon","hoverCallbacks","jsxs","Box","width","position","borderRadius","boxShadow","px","pb","pt","bg","jsx","BoldText","FlexCenter","left","top","transform"],"mappings":";;;;;AAQA,MAAMA,IAAW,QAEJC,IAA0CC,CAAUA,MAAA;AACzD,QAAA;AAAA,IACJC,cAAAA;AAAAA,IACAC,UAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,iBAAAA;AAAAA,IACAC,sBAAAA,IAAuB;AAAA,IACvBC,cAAAA,IAAe;AAAA,IACfC,sBAAAA,IAAuB;AAAA,IACvBC,UAAAA,IAAW;AAAA,IACX,GAAGC;AAAAA,EACDT,IAAAA;AAGF,SAAAU,gBAAAA,EAAA,KAACC,KACC,IAAI;AAAA,IACFC,OAAO;AAAA,IACPC,UAAU;AAAA,IACVC,cAAc;AAAA,IACdC,WAAW;AAAA,IACXC,IAAI;AAAA,IACJC,IAAI;AAAA,IACJC,IAAIV,IAAW,SAAS;AAAA,IACxBW,IAAI;AAAA,IACJ,GAAGhB;AAAAA,EAAAA,GAEDM,GAAAA,GAEJ,UAAA;AAAA,IAAAW,gBAAAA,EAAAA,IAACC,KACC,UAAUhB,GACV,WAAU,UACV,IAAIE,GAEHN,UACHA,EAAA,CAAA;AAAA,IAECC;AAAAA,IAEAM,KACEY,gBAAAA,EAAAA,IAAAE,GAAA,EACC,MAAMxB,GACN,IAAG,SACH,IAAI;AAAA,MACFe,UAAU;AAAA,MACVU,MAAM;AAAA,MACNC,KAAK;AAAA,MACLT,WAAW;AAAA,MACXD,cAAc;AAAA,MACdW,WAAW;AAAA,MACX,GAAGrB;AAAAA,IACL,GAEA,gCAACiB,GAAS,EAAA,UAAUf,GAAc,OAAM,aAAW,eAEnD,EACF,CAAA;AAAA,EAEJ,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library233.js

@@ -1,15 +1,13 @@
 import { j as r } from "./sd-component-library195.js";
-import { Label as l } from "./sd-component-library213.js";
-const n = (a) => {
+import { Button as c } from "./sd-component-library28.js";
+const _ = (o) => {
   const {
-    variant: t,
-    label: e
-  } = a;
-  return /* @__PURE__ */ r.jsx(l, { ...a, sx: {
-    fontFamily: "proxima-nova"
-  }, variant: `_labels.${t}`, "data-test": "base-label", children: e });
+    active: e,
+    disabled: l
+  } = o;
+  return /* @__PURE__ */ r.jsx(c, { width: ["100%"], variant: "_booleanAction", bg: e ? "cl_purple" : void 0, color: e ? "cl_white" : l ? "cl_grey" : void 0, hoverBg: l ? e ? "cl_purple" : "cl_white" : "cl_blue", borderColor: l ? "cl_grey" : e ? "cl_purple" : void 0, hoverBorderColor: e ? "cl_blue" : void 0, hoverColor: l && !e ? "cl_grey" : "cl_white", fill: e ? "cl_white" : l ? "cl_grey" : "cl_blue", hoverFill: l && !e ? "cl_grey" : "cl_white", borderWidth: "2px", ...o });
 };
 export {
-  n as BaseLabel
+  _ as BaseFeedbackButton
 };
 //# sourceMappingURL=sd-component-library233.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library233.js","sources":["../src/components/labels/base-label/base-label.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Label } from \"@rebass/forms\";\n\nimport { BaseLabelProps } from \"./interfaces\";\n\nexport const BaseLabel = (props: BaseLabelProps) => {\n  const { variant, label } = props;\n\n  return (\n    <Label\n      {...props}\n      sx={{ fontFamily: \"proxima-nova\" }}\n      variant={`_labels.${variant}`}\n      data-test=\"base-label\"\n    >\n      {label}\n    </Label>\n  );\n};\n"],"names":["BaseLabel","props","variant","label","jsx","Label","fontFamily"],"mappings":";;AAMaA,MAAAA,IAAYA,CAACC,MAA0B;AAC5C,QAAA;AAAA,IAAEC,SAAAA;AAAAA,IAASC,OAAAA;AAAAA,EAAUF,IAAAA;AAE3B,SACGG,gBAAAA,EAAA,IAAAC,GAAA,EACC,GAAIJ,GACJ,IAAI;AAAA,IAAEK,YAAY;AAAA,EAAA,GAClB,SAAU,WAAUJ,CAAQ,IAC5B,aAAU,cAETC,UACHA,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library233.js","sources":["../src/components/feedback/base-feedback-button/base-feedback-button.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { Button } from \"../../buttons\";\nimport { BaseFeedbackButtonProps as Props } from \"./interfaces\";\n\nexport const BaseFeedbackButton: React.FC<Props> = (props) => {\n  const { active, disabled } = props;\n  return (\n    <Button\n      width={[\"100%\"]}\n      variant=\"_booleanAction\"\n      bg={active ? \"cl_purple\" : undefined}\n      color={active ? \"cl_white\" : disabled ? \"cl_grey\" : undefined}\n      hoverBg={disabled ? (active ? \"cl_purple\" : \"cl_white\") : \"cl_blue\"}\n      borderColor={disabled ? \"cl_grey\" : active ? \"cl_purple\" : undefined}\n      hoverBorderColor={active ? \"cl_blue\" : undefined}\n      hoverColor={disabled && !active ? \"cl_grey\" : \"cl_white\"}\n      fill={active ? \"cl_white\" : disabled ? \"cl_grey\" : \"cl_blue\"}\n      hoverFill={disabled && !active ? \"cl_grey\" : \"cl_white\"}\n      borderWidth=\"2px\"\n      {...props}\n    />\n  );\n};\n"],"names":["BaseFeedbackButton","props","active","disabled","jsx","Button","undefined"],"mappings":";;AAKO,MAAMA,IAAuCC,CAAUA,MAAA;AACtD,QAAA;AAAA,IAAEC,QAAAA;AAAAA,IAAQC,UAAAA;AAAAA,EAAaF,IAAAA;AAE3B,SAAAG,gBAAAA,EAAA,IAACC,GACC,EAAA,OAAO,CAAC,MAAM,GACd,SAAQ,kBACR,IAAIH,IAAS,cAAcI,QAC3B,OAAOJ,IAAS,aAAaC,IAAW,YAAYG,QACpD,SAASH,IAAYD,IAAS,cAAc,aAAc,WAC1D,aAAaC,IAAW,YAAYD,IAAS,cAAcI,QAC3D,kBAAkBJ,IAAS,YAAYI,QACvC,YAAYH,KAAY,CAACD,IAAS,YAAY,YAC9C,MAAMA,IAAS,aAAaC,IAAW,YAAY,WACnD,WAAWA,KAAY,CAACD,IAAS,YAAY,YAC7C,aAAY,OACZ,GAAID,EACJ,CAAA;AAEN;"}

package/lib/sd-component-library237.js

@@ -1,8 +1,8 @@
 import { j as t } from "./sd-component-library195.js";
 import { SmileyGaugeColor as e } from "./sd-component-library238.js";
-import { ReactComponent as o } from "./sd-component-library341.js";
-import { ReactComponent as m } from "./sd-component-library342.js";
-import { ReactComponent as i } from "./sd-component-library343.js";
+import { ReactComponent as o } from "./sd-component-library324.js";
+import { ReactComponent as m } from "./sd-component-library325.js";
+import { ReactComponent as i } from "./sd-component-library326.js";
 const S = 10, c = 80, p = 100, y = 87, R = 30, d = 3, f = 2, g = 4, u = /* @__PURE__ */ new Map([[e.GREEN, /* @__PURE__ */ t.jsx(o, {})], [e.ORANGE, /* @__PURE__ */ t.jsx(m, {})], [e.RED, /* @__PURE__ */ t.jsx(i, {})]]);
 export {
   u as COLOR_TO_ICON_MAP,

package/lib/sd-component-library239.js

@@ -1,7 +1,7 @@
 import { j as a } from "./sd-component-library195.js";
 import R, { createElement as g } from "react";
 import { isValueInRange as f } from "./sd-component-library89.js";
-import { SmileyMeterRange as d } from "./sd-component-library646.js";
+import { SmileyMeterRange as d } from "./sd-component-library629.js";
 const j = R.forwardRef((r, m) => {
   const {
     value: s,

package/lib/sd-component-library240.js

@@ -1,6 +1,6 @@
 import { j as h } from "./sd-component-library195.js";
 import { getRangeProperties as p } from "./sd-component-library238.js";
-import { MatchedRangeLabelBox as u } from "./sd-component-library645.js";
+import { MatchedRangeLabelBox as u } from "./sd-component-library630.js";
 const b = (e) => {
   const {
     range: a,

package/lib/sd-component-library242.js

@@ -1,7 +1,7 @@
 import { j as e } from "./sd-component-library195.js";
 import U from "react";
 import { isValueInRange as Z, inValueHigherThanRange as F, getCoordinateForArc as d, getInnerX as $, getInnerY as tt, degToRad as L } from "./sd-component-library89.js";
-import { BaseOutlineArc as X } from "./sd-component-library647.js";
+import { BaseOutlineArc as X } from "./sd-component-library655.js";
 import { OutlineMeterLabelPointer as O } from "./sd-component-library252.js";
 const st = U.forwardRef((D, M) => {
   const {

package/lib/sd-component-library244.js

@@ -1,6 +1,6 @@
 import { j as k } from "./sd-component-library195.js";
 import { isValueInRange as w, getInnerX as E, getInnerY as O, degToRad as r, getCoordinateForArc as V } from "./sd-component-library89.js";
-import { BaseNeedle as b } from "./sd-component-library648.js";
+import { BaseNeedle as b } from "./sd-component-library656.js";
 const G = (x) => {
   const {
     diameter: f,

package/lib/sd-component-library246.js

@@ -1,9 +1,9 @@
 import { j as a } from "./sd-component-library195.js";
 import { getCoordinateForArc as i } from "./sd-component-library89.js";
 import { defaultTextBottomMargin as X } from "./sd-component-library235.js";
-import { getRangeProperties as Y } from "./sd-component-library649.js";
-import { BaseOutlineArc as b } from "./sd-component-library647.js";
-import { DiscreteMeterLabelPointer as w } from "./sd-component-library650.js";
+import { getRangeProperties as Y } from "./sd-component-library657.js";
+import { BaseOutlineArc as b } from "./sd-component-library655.js";
+import { DiscreteMeterLabelPointer as w } from "./sd-component-library658.js";
 function z(s) {
   const {
     color: n,

package/lib/sd-component-library247.js

@@ -1,6 +1,6 @@
 import { j as M } from "./sd-component-library195.js";
 import { getInnerX as T, getInnerY as W, degToRad as r, getCoordinateForArc as y } from "./sd-component-library89.js";
-import { BaseNeedle as B } from "./sd-component-library648.js";
+import { BaseNeedle as B } from "./sd-component-library656.js";
 function E(p) {
   const {
     needleColor: u,

package/lib/sd-component-library248.js

@@ -1,6 +1,6 @@
 import { j as g } from "./sd-component-library195.js";
-import { getRangeProperties as d } from "./sd-component-library649.js";
-import { MatchedRangeLabelBox as x } from "./sd-component-library645.js";
+import { getRangeProperties as d } from "./sd-component-library657.js";
+import { MatchedRangeLabelBox as x } from "./sd-component-library630.js";
 const h = (e) => {
   const {
     idx: t,

package/lib/sd-component-library250.js

@@ -1,7 +1,7 @@
 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-library647.js";
+import { BaseOutlineArc as X } from "./sd-component-library655.js";
 const w = "#CCD0DB", q = (G) => {
   const {
     diameter: I,

package/lib/sd-component-library251.js

@@ -1,7 +1,7 @@
 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-library648.js";
+import { BaseNeedle as q } from "./sd-component-library656.js";
 const O = (R) => {
   const {
     ranges: r,

package/lib/sd-component-library255.js

@@ -1,54 +1,32 @@
 import { j as n } from "./sd-component-library195.js";
-import { useHover as Z } from "./sd-component-library3.js";
-import { getCoordinateForArc as l } from "./sd-component-library89.js";
-import { getSegmentCoordinates as O } from "./sd-component-library254.js";
-import { SegmentLabel as q } from "./sd-component-library708.js";
-const h = 300, G = ({
-  segment: o,
-  segmentWidth: $,
-  outlineWidth: f,
-  size: i,
-  mobile: a,
-  ...c
+import g from "./sd-component-library194.js";
+import { getSegmentCoordinates as I } from "./sd-component-library254.js";
+const w = ({
+  segment: e,
+  size: o,
+  segmentWidth: s,
+  outlineWidth: c,
+  isMatching: a
 }) => {
   const {
-    start: p,
-    end: x,
-    color: u
-  } = o, {
-    labelOffset: j
-  } = c, t = i / 2, d = t - $, {
-    startInnerX: k,
-    startInnerY: A,
-    endInnerX: M,
-    endInnerY: X,
-    endX: Y,
-    endY: v,
-    startY: S,
-    startX: g,
-    arc: e
-  } = O(o, t, $), r = i / 2, H = Math.round(p * 360), I = Math.round(x * 360), {
-    isHover: L,
-    hoverCallbacks: w
-  } = Z(), m = L && !a, s = Math.sqrt(2) * (t + j), {
-    x: y,
-    y: C
-  } = l(s, H, t), {
-    x: E,
-    y: R
-  } = l(s, I, t);
-  return /* @__PURE__ */ n.jsxs("g", { ...a ? {} : w, children: [
-    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${y},${C} A${s},${s} 0 ${e > 180 ? "1" : "0"},1 ${E},${R}Z`, fill: "transparent" }),
-    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${g},${S} A${t},${t} 0 ${e > 180 ? "1" : "0"},1 ${Y},${v}Z`, fill: u, strokeWidth: f, stroke: "white" }),
-    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${k},${A} A${d},${d} 0 ${e > 180 ? "1" : "0"},1 ${M},${X}Z`, fill: "white", style: {
-      transform: `scale(${m ? 0.8 : 1}`,
-      transformOrigin: "center",
-      transition: `all ${h}ms`
-    } }),
-    /* @__PURE__ */ n.jsx(q, { segment: o, radius: t, animationDuration: h, isHover: m, mobile: a, ...c })
+    color: d
+  } = e, t = o / 2, $ = t - s, {
+    startX: l,
+    startY: m,
+    arc: i,
+    startInnerY: p,
+    startInnerX: h,
+    endInnerY: u,
+    endInnerX: x,
+    endX: f,
+    endY: j
+  } = I(e, t, s), r = o / 2;
+  return /* @__PURE__ */ n.jsxs("g", { children: [
+    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${l},${m} A${t},${t} 0 ${i > 180 ? "1" : "0"},1 ${f},${j}Z`, fill: a ? d : g.colors.cl_lightGrey, strokeWidth: c, stroke: "white" }),
+    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${h},${p} A${$},${$} 0 ${i > 180 ? "1" : "0"},1 ${x},${u}Z`, fill: "white" })
   ] });
 };
 export {
-  G as Segment
+  w as CompactDonutGaugeSegment
 };
 //# sourceMappingURL=sd-component-library255.js.map

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

@@ -1 +1 @@
-{"version":3,"file":"sd-component-library255.js","sources":["../src/components/meters/donut-diagram/partials/segment/segment.tsx"],"sourcesContent":["import React from \"react\";\n\nimport { useHover } from \"../../../../../core/custom-hooks\";\nimport { getCoordinateForArc } from \"../../../outline-meter/utils\";\nimport { getSegmentCoordinates } from \"../../utils\";\nimport { SegmentLabel } from \"../segment-label\";\nimport { SegmentProps as Props } from \"./interfaces\";\n\nconst animationDuration = 300;\n\nexport const Segment: React.FC<Props> = ({\n  segment,\n  segmentWidth,\n  outlineWidth,\n  size: diameter,\n  mobile,\n  ...labelProps\n}) => {\n  const { start, end, color } = segment;\n  const { labelOffset } = labelProps;\n\n  const radius = diameter / 2;\n  const innerRadius = radius - segmentWidth;\n\n  const {\n    startInnerX,\n    startInnerY,\n    endInnerX,\n    endInnerY,\n    endX,\n    endY,\n    startY,\n    startX,\n    arc,\n  } = getSegmentCoordinates(segment, radius, segmentWidth);\n\n  const center = diameter / 2;\n\n  const startAlpha = Math.round(start * 360);\n  const endAlpha = Math.round(end * 360);\n\n  const { isHover, hoverCallbacks } = useHover();\n  const showHover = isHover && !mobile;\n\n  const maxRadius = Math.sqrt(2) * (radius + labelOffset);\n\n  const { x: maskStartX, y: maskStartY } = getCoordinateForArc(\n    maxRadius,\n    startAlpha,\n    radius\n  );\n\n  const { x: maskEndX, y: maskEndY } = getCoordinateForArc(\n    maxRadius,\n    endAlpha,\n    radius\n  );\n\n  return (\n    <g {...(mobile ? {} : hoverCallbacks)}>\n      {/* mask */}\n      <path\n        d={`M${center},${center} L${maskStartX},${maskStartY} A${maxRadius},${maxRadius} 0 ${\n          arc > 180 ? \"1\" : \"0\"\n        },1 ${maskEndX},${maskEndY}Z`}\n        fill=\"transparent\"\n      />\n\n      {/* colored sector */}\n      <path\n        d={`M${center},${center} L${startX},${startY} A${radius},${radius} 0 ${\n          arc > 180 ? \"1\" : \"0\"\n        },1 ${endX},${endY}Z`}\n        fill={color}\n        strokeWidth={outlineWidth}\n        stroke=\"white\"\n      />\n\n      {/* white inner sector */}\n      <path\n        d={`M${center},${center} L${startInnerX},${startInnerY} A${innerRadius},${innerRadius} 0 ${\n          arc > 180 ? \"1\" : \"0\"\n        },1 ${endInnerX},${endInnerY}Z`}\n        fill=\"white\"\n        style={{\n          transform: `scale(${showHover ? 0.8 : 1}`,\n          transformOrigin: \"center\",\n          transition: `all ${animationDuration}ms`,\n        }}\n      />\n\n      <SegmentLabel\n        segment={segment}\n        radius={radius}\n        animationDuration={animationDuration}\n        isHover={showHover}\n        mobile={mobile}\n        {...labelProps}\n      />\n    </g>\n  );\n};\n"],"names":["animationDuration","Segment","segment","segmentWidth","outlineWidth","size","diameter","mobile","labelProps","start","end","color","labelOffset","radius","innerRadius","startInnerX","startInnerY","endInnerX","endInnerY","endX","endY","startY","startX","arc","getSegmentCoordinates","center","startAlpha","Math","round","endAlpha","isHover","hoverCallbacks","useHover","showHover","maxRadius","sqrt","x","maskStartX","y","maskStartY","getCoordinateForArc","maskEndX","maskEndY","jsx","transform","transformOrigin","transition","SegmentLabel"],"mappings":";;;;;AAQA,MAAMA,IAAoB,KAEbC,IAA2BA,CAAC;AAAA,EACvCC,SAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,MAAMC;AAAAA,EACNC,QAAAA;AAAAA,EACA,GAAGC;AACL,MAAM;AACE,QAAA;AAAA,IAAEC,OAAAA;AAAAA,IAAOC,KAAAA;AAAAA,IAAKC,OAAAA;AAAAA,EAAUT,IAAAA,GACxB;AAAA,IAAEU,aAAAA;AAAAA,EAAgBJ,IAAAA,GAElBK,IAASP,IAAW,GACpBQ,IAAcD,IAASV,GAEvB;AAAA,IACJY,aAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,MAAAA;AAAAA,IACAC,MAAAA;AAAAA,IACAC,QAAAA;AAAAA,IACAC,QAAAA;AAAAA,IACAC,KAAAA;AAAAA,EACEC,IAAAA,EAAsBtB,GAASW,GAAQV,CAAY,GAEjDsB,IAASnB,IAAW,GAEpBoB,IAAaC,KAAKC,MAAMnB,IAAQ,GAAG,GACnCoB,IAAWF,KAAKC,MAAMlB,IAAM,GAAG,GAE/B;AAAA,IAAEoB,SAAAA;AAAAA,IAASC,gBAAAA;AAAAA,MAAmBC,EAAS,GACvCC,IAAYH,KAAW,CAACvB,GAExB2B,IAAYP,KAAKQ,KAAK,CAAC,KAAKtB,IAASD,IAErC;AAAA,IAAEwB,GAAGC;AAAAA,IAAYC,GAAGC;AAAAA,EAAeC,IAAAA,EACvCN,GACAR,GACAb,CACF,GAEM;AAAA,IAAEuB,GAAGK;AAAAA,IAAUH,GAAGI;AAAAA,EAAaF,IAAAA,EACnCN,GACAL,GACAhB,CACF;AAEA,gCACG,KAAON,EAAAA,GAAAA,IAAS,KAAKwB,GAEpB,UAAA;AAAA,IAACY,gBAAAA,EAAAA,IAAA,QAAA,EACC,GAAI,IAAGlB,CAAO,IAAGA,CAAO,KAAIY,CAAW,IAAGE,CAAW,KAAIL,CAAU,IAAGA,CAAU,MAC9EX,IAAM,MAAM,MAAM,GACnB,MAAKkB,CAAS,IAAGC,CAAS,KAC3B,MAAK,cAAa,CAAA;AAAA,IAInBC,gBAAAA,EAAA,IAAA,QAAA,EACC,GAAI,IAAGlB,CAAO,IAAGA,CAAO,KAAIH,CAAO,IAAGD,CAAO,KAAIR,CAAO,IAAGA,CAAO,MAChEU,IAAM,MAAM,MAAM,GACnB,MAAKJ,CAAK,IAAGC,CAAK,KACnB,MAAMT,GACN,aAAaP,GACb,QAAO,SAAO;AAAA,IAIhBuC,gBAAAA,EAAAA,IAAC,QACC,EAAA,GAAI,IAAGlB,CAAO,IAAGA,CAAO,KAAIV,CAAY,IAAGC,CAAY,KAAIF,CAAY,IAAGA,CAAY,MACpFS,IAAM,MAAM,MAAM,GACnB,MAAKN,CAAU,IAAGC,CAAU,KAC7B,MAAK,SACL,OAAO;AAAA,MACL0B,WAAY,SAAQX,IAAY,MAAM,CAAE;AAAA,MACxCY,iBAAiB;AAAA,MACjBC,YAAa,OAAM9C,CAAkB;AAAA,IAAA,GACrC;AAAA,IAGJ2C,gBAAAA,EAAAA,IAACI,KACC,SAAA7C,GACA,QAAAW,GACA,mBAAAb,GACA,SAASiC,GACT,QAAA1B,GACA,GAAIC,GAAW;AAAA,EAEnB,EAAA,CAAA;AAEJ;"}
+{"version":3,"file":"sd-component-library255.js","sources":["../src/components/meters/compact-donut-gauge/partials/compact-donut-gauge-segment/compact-donut-gauge-segment.tsx"],"sourcesContent":["import React from \"react\";\n\nimport theme from \"../../../../../core/theme\";\nimport { getSegmentCoordinates } from \"../../../donut-diagram/utils\";\nimport { CompactDonutGaugeSegmentProps as Props } from \"./interfaces\";\n\nexport const CompactDonutGaugeSegment: React.FC<Props> = ({\n  segment,\n  size: diameter,\n  segmentWidth,\n  outlineWidth,\n  isMatching,\n}) => {\n  const { color } = segment;\n\n  const radius = diameter / 2;\n  const innerRadius = radius - segmentWidth;\n\n  const {\n    startX,\n    startY,\n    arc,\n    startInnerY,\n    startInnerX,\n    endInnerY,\n    endInnerX,\n    endX,\n    endY,\n  } = getSegmentCoordinates(segment, radius, segmentWidth);\n\n  const center = diameter / 2;\n\n  return (\n    <g>\n      {/* colored sector */}\n      <path\n        d={`M${center},${center} L${startX},${startY} A${radius},${radius} 0 ${\n          arc > 180 ? \"1\" : \"0\"\n        },1 ${endX},${endY}Z`}\n        fill={isMatching ? color : theme.colors[\"cl_lightGrey\"]}\n        strokeWidth={outlineWidth}\n        stroke=\"white\"\n      />\n\n      {/* white inner sector */}\n      <path\n        d={`M${center},${center} L${startInnerX},${startInnerY} A${innerRadius},${innerRadius} 0 ${\n          arc > 180 ? \"1\" : \"0\"\n        },1 ${endInnerX},${endInnerY}Z`}\n        fill=\"white\"\n      />\n    </g>\n  );\n};\n"],"names":["CompactDonutGaugeSegment","segment","size","diameter","segmentWidth","outlineWidth","isMatching","color","radius","innerRadius","startX","startY","arc","startInnerY","startInnerX","endInnerY","endInnerX","endX","endY","getSegmentCoordinates","center","jsx","theme","colors"],"mappings":";;;AAMO,MAAMA,IAA4CA,CAAC;AAAA,EACxDC,SAAAA;AAAAA,EACAC,MAAMC;AAAAA,EACNC,cAAAA;AAAAA,EACAC,cAAAA;AAAAA,EACAC,YAAAA;AACF,MAAM;AACE,QAAA;AAAA,IAAEC,OAAAA;AAAAA,EAAUN,IAAAA,GAEZO,IAASL,IAAW,GACpBM,IAAcD,IAASJ,GAEvB;AAAA,IACJM,QAAAA;AAAAA,IACAC,QAAAA;AAAAA,IACAC,KAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,aAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,WAAAA;AAAAA,IACAC,MAAAA;AAAAA,IACAC,MAAAA;AAAAA,EACEC,IAAAA,EAAsBlB,GAASO,GAAQJ,CAAY,GAEjDgB,IAASjB,IAAW;AAE1B,gCACG,KAEC,EAAA,UAAA;AAAA,IAAAkB,gBAAAA,EAAA,IAAC,QACC,EAAA,GAAI,IAAGD,CAAO,IAAGA,CAAO,KAAIV,CAAO,IAAGC,CAAO,KAAIH,CAAO,IAAGA,CAAO,MAChEI,IAAM,MAAM,MAAM,GACnB,MAAKK,CAAK,IAAGC,CAAK,KACnB,MAAMZ,IAAaC,IAAQe,EAAMC,OAAO,cACxC,aAAalB,GACb,QAAO,SAAO;AAAA,IAIhBgB,gBAAAA,EAAAA,IAAC,QACC,EAAA,GAAI,IAAGD,CAAO,IAAGA,CAAO,KAAIN,CAAY,IAAGD,CAAY,KAAIJ,CAAY,IAAGA,CAAY,MACpFG,IAAM,MAAM,MAAM,GACnB,MAAKI,CAAU,IAAGD,CAAU,KAC7B,MAAK,QAAO,CAAA;AAAA,EAEhB,EAAA,CAAA;AAEJ;"}

package/lib/sd-component-library256.js

@@ -1,32 +1,24 @@
-import { j as n } from "./sd-component-library195.js";
-import g from "./sd-component-library194.js";
-import { getSegmentCoordinates as I } from "./sd-component-library254.js";
-const w = ({
-  segment: e,
-  size: o,
-  segmentWidth: s,
-  outlineWidth: c,
-  isMatching: a
-}) => {
-  const {
-    color: d
-  } = e, t = o / 2, $ = t - s, {
-    startX: l,
-    startY: m,
-    arc: i,
-    startInnerY: p,
-    startInnerX: h,
-    endInnerY: u,
-    endInnerX: x,
-    endX: f,
-    endY: j
-  } = I(e, t, s), r = o / 2;
-  return /* @__PURE__ */ n.jsxs("g", { children: [
-    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${l},${m} A${t},${t} 0 ${i > 180 ? "1" : "0"},1 ${f},${j}Z`, fill: a ? d : g.colors.cl_lightGrey, strokeWidth: c, stroke: "white" }),
-    /* @__PURE__ */ n.jsx("path", { d: `M${r},${r} L${h},${p} A${$},${$} 0 ${i > 180 ? "1" : "0"},1 ${x},${u}Z`, fill: "white" })
-  ] });
-};
+import { j as t } from "./sd-component-library195.js";
+import { FlexCenter as s } from "./sd-component-library37.js";
+import { ResponsiveTextV2 as i } from "./sd-component-library147.js";
+const l = ({
+  segment: {
+    start: n,
+    end: r,
+    color: e
+  },
+  size: o
+}) => /* @__PURE__ */ t.jsx("foreignObject", { x: 0, y: 0, width: o, height: o, children: /* @__PURE__ */ t.jsx(s, { height: "100%", children: /* @__PURE__ */ t.jsxs(i, { fontSizeWeight: [20, "bold"], color: e, sx: {
+  position: "relative"
+}, children: [
+  Math.round((r - n) * 100),
+  /* @__PURE__ */ t.jsx(i, { fontSizeWeight: [10, "bold"], color: e, sx: {
+    position: "absolute",
+    top: "4px",
+    left: "100%"
+  }, children: "%" })
+] }) }) });
 export {
-  w as CompactDonutGaugeSegment
+  l as CompactDonutGaugeValueIndicator
 };
 //# sourceMappingURL=sd-component-library256.js.map