sag_components 1.0.179 → 1.0.181

package/dist/stories/components/Benchmark.js

@@ -8,9 +8,7 @@ exports.default = exports.Benchmark = void 0;
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectWithoutProperties"));
 var _react = _interopRequireDefault(require("react"));
 var _BenchmarkStyle = require("./Benchmark.style.js");
-var _CommonFunctions = require("./CommonFunctions");
-var _Tooltip = _interopRequireDefault(require("./Tooltip"));
-var _excluded = ["totalValue", "currentValue", "benchmarkValue", "width", "height", "color", "linearGradientColor", "underAvarageColor", "linearGradientUnderAvarageColor", "backgroundColor", "tooltipLabel", "tooltipDirection"];
+var _excluded = ["totalValue", "currentValue", "benchmarkValue", "width", "height", "color", "linearGradientColor", "underAvarageColor", "linearGradientUnderAvarageColor", "backgroundColor"];
 /*Benchmark*/
 var Benchmark = function Benchmark(_ref) {
   var _ref$totalValue = _ref.totalValue,
@@ -32,10 +30,6 @@ var Benchmark = function Benchmark(_ref) {
     linearGradientUnderAvarageColor = _ref$linearGradientUn === void 0 ? "#FDB1B1" : _ref$linearGradientUn,
     _ref$backgroundColor = _ref.backgroundColor,
     backgroundColor = _ref$backgroundColor === void 0 ? "#F2F2F2" : _ref$backgroundColor,
-    _ref$tooltipLabel = _ref.tooltipLabel,
-    tooltipLabel = _ref$tooltipLabel === void 0 ? "Benchmark" : _ref$tooltipLabel,
-    _ref$tooltipDirection = _ref.tooltipDirection,
-    tooltipDirection = _ref$tooltipDirection === void 0 ? "top" : _ref$tooltipDirection,
     props = (0, _objectWithoutProperties2.default)(_ref, _excluded);
   var getCurrentValueRectangleWidth = function getCurrentValueRectangleWidth() {
     if (!totalValue) return 0;
@@ -85,18 +79,10 @@ var Benchmark = function Benchmark(_ref) {
     }
     return width * (benchmarkValue / totalValue);
   };
-  var getTooltipText = function getTooltipText() {
-    var _getFormattedValue, _getFormattedUnits;
-    return /*#__PURE__*/_react.default.createElement("h", null, tooltipLabel, tooltipLabel ? ": " : "", (_getFormattedValue = (0, _CommonFunctions.getFormattedValue)(benchmarkValue)) === null || _getFormattedValue === void 0 ? void 0 : _getFormattedValue.toString(), (_getFormattedUnits = (0, _CommonFunctions.getFormattedUnits)(benchmarkValue)) === null || _getFormattedUnits === void 0 ? void 0 : _getFormattedUnits.toString());
-  };
   return /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.ControlsContainer, {
     height: height,
     width: width
-  }, /*#__PURE__*/_react.default.createElement(_Tooltip.default, {
-    content: getTooltipText(),
-    direction: tooltipDirection
   }, /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.Controls, {
-    id: "ControlsBenchmark",
     height: height,
     width: width
   }, /*#__PURE__*/_react.default.createElement(_BenchmarkStyle.BackgroundValueRectangle, {
@@ -113,7 +99,7 @@ var Benchmark = function Benchmark(_ref) {
     width: 0,
     top: -2,
     left: getBenchmarkLeft()
-  }))));
+  })));
 };
 exports.Benchmark = Benchmark;
 var _default = Benchmark;

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

@@ -8,7 +8,7 @@ exports.IconButtonContainer = exports.ControlsSubContainer = exports.ControlsCon
 var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
 var _styledComponents = _interopRequireDefault(require("styled-components"));
 var _templateObject, _templateObject2, _templateObject3;
-var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n \n  display: flex;\n  //border: 1px solid green;\n  border-radius: 100px;\n  width: ", ";\n  height: ", ";\n\n"])), function (props) {
+var ControlsContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  id: \"ControlsContainer\";\n  display: flex;\n  //border: 1px solid green;\n  border-radius: 100px;\n  width: ", ";\n  height: ", ";\n\n"])), function (props) {
   return props.width.toString().concat("", "px");
 }, function (props) {
   return props.height.toString().concat("", "px");

package/dist/stories/components/TitleDescription.js

@@ -15,7 +15,7 @@ var _HannafordIcon = require("./icons/HannafordIcon");
 var _StopAndShopIcon = require("./icons/StopAndShopIcon");
 var _TheGiantCompanyIcon = require("./icons/TheGiantCompanyIcon");
 var _TitleDescriptionStyle = require("./TitleDescription.style.js");
-var _excluded = ["showRetailerIcon", "data", "infoButtonOnClick", "objectivesShowMoreOnClick", "downloadButtonOnClick", "width", "height", "textColor"];
+var _excluded = ["showRetailerIcon", "data", "infoButtonOnClick", "objectivesShowMoreOnClick", "viewCreativeOnClick", "downloadButtonOnClick", "width", "height", "textColor"];
 /*TitleDescription*/
 var TitleDescription = function TitleDescription(_ref) {
   var _ref$showRetailerIcon = _ref.showRetailerIcon,
@@ -23,6 +23,7 @@ var TitleDescription = function TitleDescription(_ref) {
     data = _ref.data,
     infoButtonOnClick = _ref.infoButtonOnClick,
     objectivesShowMoreOnClick = _ref.objectivesShowMoreOnClick,
+    viewCreativeOnClick = _ref.viewCreativeOnClick,
     downloadButtonOnClick = _ref.downloadButtonOnClick,
     _ref$width = _ref.width,
     width = _ref$width === void 0 ? "100%" : _ref$width,
@@ -88,6 +89,7 @@ var TitleDescription = function TitleDescription(_ref) {
   }, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.EventNameViewCreativeSubContainer, null, /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.EventName, {
     id: "EventName"
   }, data.eventName, "   "), /*#__PURE__*/_react.default.createElement(_TitleDescriptionStyle.ViewCreativeContainer, {
+    onClick: viewCreativeOnClick,
     id: "ViewCreativeContainer"
   }, /*#__PURE__*/_react.default.createElement(_EyeIcon.EyeIcon, {
     width: "12",

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

@@ -20,9 +20,9 @@ var ControlsContainer = _styledComponents.default.div(_templateObject || (_templ
 exports.ControlsContainer = ControlsContainer;
 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  align-items: center;\n  flex-direction: column;\n  justify-content: space-between;\n"])));
 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"])));
+var TooltipDiv = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  border-radius: 5px;\n  background: #fff;\n  padding: 8px 12px;\n  display: flex;\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.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n  color: #212121;\n  font-family: Lato;\n  font-size: 14px;\n  font-style: normal;\n  width: fit-content;\n  font-weight: 600;\n  line-height: normal;\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.179",
+  "version": "1.0.181",
   "description": "",
   "main": "dist/index.js",
   "scripts": {

package/dist/stories/components/InfoIcon.js

@@ -1,38 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = exports.InfoIcon = void 0;
-var _react = _interopRequireDefault(require("react"));
-var InfoIcon = function InfoIcon(_ref) {
-  var clicked = _ref.clicked;
-  return /*#__PURE__*/_react.default.createElement("svg", {
-    xmlns: "http://www.w3.org/2000/svg",
-    viewBox: "0 0 24 24",
-    fill: "none",
-    stroke: clicked ? "white" : "black",
-    strokeWidth: "2",
-    strokeLinecap: "round",
-    strokeLinejoin: "round",
-    className: "feather feather-info"
-  }, /*#__PURE__*/_react.default.createElement("circle", {
-    cx: "12",
-    cy: "12",
-    r: "10"
-  }), /*#__PURE__*/_react.default.createElement("line", {
-    x1: "12",
-    y1: "16",
-    x2: "12",
-    y2: "12"
-  }), /*#__PURE__*/_react.default.createElement("line", {
-    x1: "12",
-    y1: "8",
-    x2: "12",
-    y2: "8"
-  }));
-};
-exports.InfoIcon = InfoIcon;
-var _default = InfoIcon;
-exports.default = _default;

package/dist/stories/components/Tooltip.js

@@ -1,37 +0,0 @@
-"use strict";
-
-var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.default = void 0;
-var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
-var _react = _interopRequireWildcard(require("react"));
-var _Tooltip = require("./Tooltip.style");
-var Tooltip = function Tooltip(props) {
-  var timeout;
-  var _useState = (0, _react.useState)(false),
-    _useState2 = (0, _slicedToArray2.default)(_useState, 2),
-    active = _useState2[0],
-    setActive = _useState2[1];
-  var showTip = function showTip() {
-    timeout = setTimeout(function () {
-      setActive(true);
-    }, props.delay || 400);
-  };
-  var hideTip = function hideTip() {
-    clearInterval(timeout);
-    setActive(false);
-  };
-  return /*#__PURE__*/_react.default.createElement(_Tooltip.TooltipContainer, null, /*#__PURE__*/_react.default.createElement(_Tooltip.TooltipWrapper
-  // When to show the tooltip
-  , {
-    onMouseEnter: showTip,
-    onMouseLeave: hideTip
-  }, props.children, active && /*#__PURE__*/_react.default.createElement(_Tooltip.TooltipTip, {
-    className: "controls ".concat(props.direction || "top")
-  }, props.content)));
-};
-var _default = Tooltip;
-exports.default = _default;

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

@@ -1,21 +0,0 @@
-"use strict";
-
-var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-exports.TooltipWrapper = exports.TooltipTip = exports.TooltipContainer = void 0;
-var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
-var _styledComponents = _interopRequireDefault(require("styled-components"));
-var _templateObject, _templateObject2, _templateObject3;
-/* Custom properties */
-var TooltipContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n  --tooltip-text-color: black;\n  --tooltip-background-color: white;\n  --tooltip-margin: 40px;\n  --tooltip-arrow-size: 10px;\n"])));
-
-/* Wrapping */
-exports.TooltipContainer = TooltipContainer;
-var TooltipWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n  display: inline-block;\n  position: relative;\n"])));
-
-/* Absolute positioning */
-exports.TooltipWrapper = TooltipWrapper;
-var TooltipTip = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n  position: absolute;\n  border-radius: 4px;\n  left: 50%;\n  transform: translateX(-50%);\n  padding: 8px 12px;\n  color: var(--tooltip-text-color);\n  background: var(--tooltip-background-color);\n  font-size: 12px;\n  font-family: sans-serif;\n  line-height: 1;\n  z-index: 100;\n  white-space: nowrap;\n \n  /* CSS border triangles */\n  &.controls::before {\n    content: \" \";\n    left: 50%;\n    border: solid transparent;\n    height: 0;\n    width: 0;\n    position: absolute;\n    pointer-events: none;\n    border-width: var(--tooltip-arrow-size);\n    margin-left: calc(var(--tooltip-arrow-size) * -1);\n  }\n\n  /* Absolute positioning */\n  &.controls.top {\n    top: calc(var(--tooltip-margin) * -1);\n  }\n\n  /* CSS border triangles */\n  &.controls.top::before {\n    top: 100%;\n    border-top-color: var(--tooltip-background-color);\n  }\n\n  /* Absolute positioning */\n  &.controls.right {\n    left: calc(70% + var(--tooltip-margin));\n    top: 50%;\n    transform: translateX(0) translateY(-50%);\n  }\n\n  /* CSS border triangles */\n  &.controls.right::before {\n    left: calc(var(--tooltip-arrow-size) * -1);\n    top: 50%;\n    transform: translateX(0) translateY(-50%);\n    border-right-color: var(--tooltip-background-color);\n  }\n\n  /* Absolute positioning */\n  &.controls.bottom {\n    bottom: calc(var(--tooltip-margin) * -1);\n  }\n  /* CSS border triangles */\n  &.controls.bottom::before {\n    bottom: 100%;\n    border-bottom-color: var(--tooltip-background-color);\n  }\n\n  /* Absolute positioning */\n  &.controls.left {\n    left: auto;\n    right: calc(70% + var(--tooltip-margin));\n    top: 50%;\n    transform: translateX(0) translateY(-50%);\n  }\n  /* CSS border triangles */\n  &.controls.left::before {\n    left: auto;\n    right: calc(var(--tooltip-arrow-size) * -2);\n    top: 50%;\n    transform: translateX(0) translateY(-50%);\n    border-left-color: var(--tooltip-background-color);\n  }\n"])));
-exports.TooltipTip = TooltipTip;