sag_components 1.0.184 → 1.0.186

package/dist/stories/components/Benchmark.style.js

@@ -8,7 +8,7 @@ exports.CurrentValueRectangle = exports.ControlsContainer = exports.Controls = e
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  margin: 0px 0 0px;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  width: ", ";\n  height: ", ";\n  //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n  border-radius: 100px;\n  //border: 1px solid red;\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  margin: 0px 0 0px;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  width: ", ";\n  height: ", ";\n  //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n  border-radius: 100px;\n  //border: 1px solid red;\n"])), function (props) {
   return props.width.toString().concat("", "px");
 }, function (props) {
   return props.height.toString().concat("", "px");

package/dist/stories/components/Datepicker.js

@@ -53,7 +53,7 @@ var Datepicker = function Datepicker(_ref) {
       return {
         "& .MuiOutlinedInput-root": {
           borderRadius: "12px",
-          fontFamily: "Lato",
+          fontFamily: "Poppins",
           fontSize: "14px",
           fontWidth: 400,
           width: width,
@@ -62,7 +62,7 @@ var Datepicker = function Datepicker(_ref) {
           }
         },
         "& .MuiAutocomplete-inputRoot": {
-          fontFamily: "Lato",
+          fontFamily: "Poppins",
           fontSize: "14px",
           fontWidth: 400,
           paddingLeft: "10px !important",
@@ -70,13 +70,13 @@ var Datepicker = function Datepicker(_ref) {
           width: width
         },
         "& .MuiInputLabel-outlined": {
-          fontFamily: "Lato",
+          fontFamily: "Poppins",
           fontSize: "14px",
           fontWidth: 400,
           paddingLeft: "10px"
         },
         "& .MuiInputLabel-shrink": {
-          fontFamily: "Lato",
+          fontFamily: "Poppins",
           fontSize: "14px",
           fontWidth: 400,
           marginLeft: "1px",

package/dist/stories/components/Datepicker.style.js

@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject;
 //import './font.css';
 
-var DatepickerContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Lato;  \n  font-size: \"14px\";\n"])), function (props) {
+var DatepickerContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Poppins;  \n  font-size: \"14px\";\n"])), function (props) {
   return props.width;
 });
 exports.DatepickerContainer = DatepickerContainer;

package/dist/stories/components/Dropdown.js

@@ -32,7 +32,7 @@ var checkedIcon = /*#__PURE__*/_react.default.createElement(_CheckBox.default, {
   fontSize: "small"
 });
 
-// import './fonts/Lato-Regular.ttf';
+// import './fonts/Poppins-Regular.ttf';
 
 /**
  *  SAG Dropdown
@@ -221,7 +221,7 @@ var Dropdown = function Dropdown(_ref) {
           InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
             style: {
               fontSize: "14px",
-              fontFamily: "Lato"
+              fontFamily: "Poppins"
             },
             startAdornment: showSearchIcon ? /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
               position: "start"
@@ -233,7 +233,7 @@ var Dropdown = function Dropdown(_ref) {
             style: {
               //color: labelColor,
               fontSize: "14px",
-              fontFamily: "Lato"
+              fontFamily: "Poppins"
             }
           }
         }));
@@ -241,7 +241,7 @@ var Dropdown = function Dropdown(_ref) {
       ListboxProps: {
         style: {
           fontSize: "14px",
-          fontFamily: "Lato"
+          fontFamily: "Poppins"
         }
       }
     }));
@@ -282,7 +282,7 @@ var Dropdown = function Dropdown(_ref) {
           style: {
             marginRight: 8,
             fontSize: "14px",
-            fontFamily: "Lato"
+            fontFamily: "Poppins"
           },
           checked: selected
         }), option.label);
@@ -303,7 +303,7 @@ var Dropdown = function Dropdown(_ref) {
           InputProps: (0, _objectSpread2.default)((0, _objectSpread2.default)({}, params.InputProps), {}, {
             style: {
               fontSize: "14px",
-              fontFamily: "Lato"
+              fontFamily: "Poppins"
             },
             startAdornment: /*#__PURE__*/_react.default.createElement(_InputAdornment.default, {
               position: "start"
@@ -315,7 +315,7 @@ var Dropdown = function Dropdown(_ref) {
             style: {
               //color: labelColor,
               fontSize: "16px",
-              fontFamily: "Lato"
+              fontFamily: "Poppins"
             }
           }
         })) : /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, params, {
@@ -334,7 +334,7 @@ var Dropdown = function Dropdown(_ref) {
             style: {
               //color: labelColor,
               fontSize: "16px",
-              fontFamily: "Lato"
+              fontFamily: "Poppins"
             }
           }
         }));
@@ -342,7 +342,7 @@ var Dropdown = function Dropdown(_ref) {
       ListboxProps: {
         style: {
           fontSize: "14px",
-          fontFamily: "Lato"
+          fontFamily: "Poppins"
         }
       }
     }));

package/dist/stories/components/Dropdown.style.js

@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject;
 //import './font.css';
 
-var DropdownContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Lato;  \n  font-size: \"14px\";\n"])), function (props) {
+var DropdownContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Poppins;  \n  font-size: \"14px\";\n"])), function (props) {
   return props.width;
 });
 exports.DropdownContainer = DropdownContainer;

package/dist/stories/components/OneColumnContainer.style.js

@@ -14,7 +14,7 @@ var StyledContainer = _styledComponents.default.div(_templateObject || (_templat
   return props.height;
 });
 exports.StyledContainer = StyledContainer;
-var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  font-family: \"Lato\", sans-serif;\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  background: white;\n  margin: 0px 30px 0px 30px;\n"])), function (props) {
+var InfoTextContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  font-family: \"Poppins\", sans-serif;\n  width: ", ";\n  height: ", ";\n  display: flex;\n  flex-direction: column;\n  justify-content: center;\n  background: white;\n  margin: 0px 30px 0px 30px;\n"])), function (props) {
   return props.width;
 }, function (props) {
   return props.height;

package/dist/stories/components/SegmentedButton.style.js

@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5;
 var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex; \n  font: ", "; \n  margin: 0;\n  --highlight-width: auto;\n  --highlight-x-pos: 0;\n  -webkit-font-smoothing: antialiased;\n  -moz-osx-font-smoothing: grayscale;\n"])), function (props) {
   var _props$fontSize;
-  return (_props$fontSize = props.fontSize) === null || _props$fontSize === void 0 ? void 0 : _props$fontSize.toString().concat("", "px Lato, sans-serif");
+  return (_props$fontSize = props.fontSize) === null || _props$fontSize === void 0 ? void 0 : _props$fontSize.toString().concat("", "px Poppins, sans-serif");
 });
 exports.ControlsContainer = ControlsContainer;
 var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-flex;\n  justify-content: space-between;  \n  background: ", ";\n  box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n  border-radius:  ", "; //12px\n  // max-width: 500px; //use this to limit max lenght of the control \n  padding: 6px;  \n  margin: auto;\n  overflow: hidden;\n  position: relative;\n  &.controls::before {\n    content: \"\";\n    background:  ", "; /* #3a9df9;  #5465ff;*/\n    box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);\n    border-radius:  ", "; //12px\n    width: var(--highlight-width);\n    transform: translateX(var(--highlight-x-pos));\n    position: absolute;\n    top: 3px;\n    bottom: 3px;\n    left: 0; \n    z-index: 0;\n  }\n  &.controls.ready::before {\n    transition: transform 0.3s ease, width 0.3s ease;\n  }\n"])), function (props) {

package/dist/stories/components/TextField.style.js

@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject;
 //import './font.css';
 
-var TextFieldContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Lato;  \n  font-size: \"14px\";\n"])), function (props) {
+var TextFieldContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  width: ", ";  \n  text-align: left;  \n  position: relative; \n  align-items: center;\n  justify-content: center;\n  font-family: Poppins;  \n  font-size: \"14px\";\n"])), function (props) {
   return props.width;
 });
 exports.TextFieldContainer = TextFieldContainer;

package/dist/stories/components/TitleDescription.style.js

@@ -8,7 +8,7 @@ exports.ViewCreativeTextField = exports.ViewCreativeContainer = exports.SubLineC
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19, _templateObject20, _templateObject21, _templateObject22, _templateObject23, _templateObject24;
-var MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: 1rem;\n\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n"])), function (props) {
+var MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: row;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: 1rem;\n\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n"])), function (props) {
   return props.textColor ? props.textColor : "#000";
 }, function (props) {
   return props.width;

package/dist/stories/components/TotalBenchmark.style.js

@@ -10,7 +10,7 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
 var MIN_HEIGHT = 300;
 var MIN_WIDTH = 260;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  //justify-content: center;\n  place-content: space-between;\n  align-items: center;\n  background: #ffffff;\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column; \n  place-content: space-between;\n  align-items: flex-start; \n  background: #ffffff;  \n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;
@@ -20,7 +20,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
   return props.height;
 });
 exports.ControlsContainer = ControlsContainer;
-var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  //display: flex;\n  border-radius: 12px;\n  /* width: 90%;\n  height: 40%; */\n  //justify-content: center;  \n  //align-items: flex-start;\n  background: #ffffff;\n  margin-bottom: 1rem;\n"])));
+var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  //display: flex;\n  border-radius: 12px;\n  /* width: 90%;\n  height: 40%; */\n  //justify-content: center;  \n  //align-items: flex-start;\n  background: #ffffff;\n  margin-bottom: 1rem;\n  padding: 0px 0.8rem;\n"])));
 exports.Controls = Controls;
 var TitleAndValueContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  //display: flex;\n  //flex-direction: column;\n  width: 100%;\n"])));
 exports.TitleAndValueContainer = TitleAndValueContainer;
@@ -30,5 +30,5 @@ var FormattedValue = _styledComponents.default.div(_templateObject5 || (_templat
 exports.FormattedValue = FormattedValue;
 var BenchmarkContainerParent = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  align-items: center;\n  width: 100%;\n  height: 100%;\n"])));
 exports.BenchmarkContainerParent = BenchmarkContainerParent;
-var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  margin-top: 0.7rem;\n  margin-left: 1rem;\n  height: 0.9rem;\n"])));
+var BenchmarkContainer = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n  width: 100%;\n  margin-top: 0;\n  margin-left: 1rem;\n  height: 0.9rem;\n"])));
 exports.BenchmarkContainer = BenchmarkContainer;

package/dist/stories/components/TotalBenchmarkAreachart.style.js

@@ -8,7 +8,7 @@ exports.ValueAndBenchmarkContainer = exports.TitleAndValueContainer = exports.Ti
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  /* min-height: 280px;\n  min-width: 250px;\n  max-height: 380px;\n  max-width: 350px; */\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  /* min-height: 280px;\n  min-width: 250px;\n  max-height: 380px;\n  max-width: 350px; */\n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;

package/dist/stories/components/TotalBenchmarkArrows.style.js

@@ -8,7 +8,7 @@ exports.ValueAndBenchmarkContainer = exports.Title = exports.FormattedValue = ex
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;
@@ -18,7 +18,7 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
   return props.height;
 });
 exports.ControlsContainer = ControlsContainer;
-var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  border-radius: 12px;\n  background: #ffffff;\n  justify-content: center;  \n  flex-direction: column;\n  flex-basis: 100%;\n  //padding: 16px ;\n"])));
+var Controls = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  border-radius: 12px;\n  width: 100%;\n  height: 100%;\n  background: #ffffff;  \n  flex-direction: column;\n  flex-basis: 100%;\n  align-items: center;\n  justify-content: space-between;\n"])));
 exports.Controls = Controls;
 var Title = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  width: 14rem;\n  font-weight: 600;\n  font-size: 1rem;\n   margin-bottom: 1rem;\n"])));
 exports.Title = Title;

package/dist/stories/components/TotalBenchmarkBarchart.style.js

@@ -8,7 +8,7 @@ exports.ValueAndBenchmarkContainer = exports.TitleAndValueContainer = exports.Ti
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background: #ffffff;\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n  background: #ffffff;\n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;

package/dist/stories/components/TotalDoughnutChart.style.js

@@ -8,7 +8,7 @@ exports.TooltipLabel = exports.TooltipDiv = exports.TitleAndValueContainer = exp
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15, _templateObject16, _templateObject17, _templateObject18, _templateObject19;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Lato\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  //box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  position: relative;\n  font-family: \"Poppins\", sans-serif;\n  font-style: normal;\n  font-size: ", ";\n  color: ", ";\n  width: ", ";\n  height: ", ";\n  border-radius: 12px;\n  align-content: center;\n  flex-direction: column;\n  justify-content: center;\n  align-items: center;\n"])), function (props) {
   return props.rootFont;
 }, function (props) {
   return props.textColor;
@@ -22,7 +22,7 @@ var Controls = _styledComponents.default.div(_templateObject2 || (_templateObjec
 exports.Controls = Controls;
 var TooltipDiv = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n  border-radius: 5px;\n  background: #fff;\n  padding: 6px 10px;\n  display: flex;\n  flex-direction: row;\n  margin:0;\n"])));
 exports.TooltipDiv = TooltipDiv;
-var TooltipLabel = _styledComponents.default.p(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  color: #212121;\n  font-family: \"Lato\", sans-serif;\n  font-size: 12px;\n  font-weight: 400;\n  font-style: normal;\n  width: max-content; // fit-content;  \n  line-height: normal;\n  margin:0;\n"])));
+var TooltipLabel = _styledComponents.default.p(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  color: #212121;\n  font-family: \"Poppins\", sans-serif;\n  font-size: 12px;\n  font-weight: 400;\n  font-style: normal;\n  width: max-content; // fit-content;  \n  line-height: normal;\n  margin:0;\n"])));
 exports.TooltipLabel = TooltipLabel;
 var TitleAndValueContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n  display: flex;\n  flex-direction: column;\n  width: 90%;\n  //margin-top: 6%;\n"])));
 exports.TitleAndValueContainer = TitleAndValueContainer;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "sag_components",
-  "version": "1.0.184",
+  "version": "1.0.186",
   "description": "",
   "main": "dist/index.js",
   "scripts": {