sag_components 2.0.0-beta203 → 2.0.0-beta205

package/dist/index.esm.js

@@ -1,7 +1,7 @@
 import React$1, { useState, useRef, useEffect, useMemo, useCallback, forwardRef, useImperativeHandle } from 'react';
 import styled, { keyframes, css, styled as styled$1 } from 'styled-components';
 import { jsxs, jsx } from 'react/jsx-runtime';
-import { ResponsiveContainer, PieChart as PieChart$1, Pie, Cell, Tooltip as Tooltip$4, BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Bar, LabelList, ReferenceLine, LineChart, Line, AreaChart as AreaChart$1, Legend, Area, ScatterChart, ZAxis, Scatter, Brush, ComposedChart } from 'recharts';
+import { ResponsiveContainer, PieChart as PieChart$1, Pie, Cell, Tooltip as Tooltip$3, BarChart as BarChart$1, CartesianGrid, XAxis, YAxis, Bar, LabelList, ReferenceLine, LineChart, Line, AreaChart as AreaChart$1, Legend, Area, ScatterChart, ZAxis, Scatter, Brush, ComposedChart } from 'recharts';
 import Skeleton, { SkeletonTheme } from 'react-loading-skeleton';
 import { motion, AnimatePresence } from 'framer-motion';
 import { createPortal } from 'react-dom';
@@ -2387,7 +2387,7 @@ const TooltipTip$1 = styled.div`
   }
 `;
 
-const Tooltip$3 = props => {
+const Tooltip$2 = props => {
   const {
     children,
     content = "Tooltip content",
@@ -2399,7 +2399,7 @@ const Tooltip$3 = props => {
     className
   } = props;
   let timeout;
-  const [active, setActive] = useState(showTooltip);
+  const [active, setActive] = useState(false);
   const showTip = () => {
     timeout = setTimeout(() => {
       setActive(true);
@@ -2498,7 +2498,7 @@ const Benchmark = props => {
     id: "ControlsContainer",
     height: height,
     width: width
-  }, /*#__PURE__*/React$1.createElement(Tooltip$3, {
+  }, /*#__PURE__*/React$1.createElement(Tooltip$2, {
     id: "Tooltip",
     content: getTooltipText(),
     direction: tooltipDirection
@@ -2656,7 +2656,7 @@ const PieChart = props => {
   }, legendData.map(row => /*#__PURE__*/React$1.createElement(Cell, {
     key: `cell-${row.name}`,
     fill: row.color
-  }))), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }))), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   })))), /*#__PURE__*/React$1.createElement(LegendContainer$5, null, legendData.map(row => /*#__PURE__*/React$1.createElement(LegendControlsContainer$1, {
     key: row.name
@@ -11654,7 +11654,7 @@ const FilterPanel = props => {
         });
         break;
       default:
-        content = /*#__PURE__*/React$1.createElement(Tooltip$3, {
+        content = /*#__PURE__*/React$1.createElement(Tooltip$2, {
           className: "Tooltip",
           content: getTooltipTextDates(),
           direction: "top",
@@ -11798,7 +11798,7 @@ const FilterPanel = props => {
   const displayGoButton = () => {
     let content;
     if (tooltipTextGoButton) {
-      content = /*#__PURE__*/React$1.createElement(Tooltip$3, {
+      content = /*#__PURE__*/React$1.createElement(Tooltip$2, {
         className: "Tooltip",
         content: getTooltipTextGoButton(),
         direction: "top",
@@ -12562,7 +12562,7 @@ const ReportTable = props => {
   }, displaySelectButton(rowData)) : /*#__PURE__*/React$1.createElement(Td$1, {
     className: "cell",
     key: dataIndex
-  }, value && value.length > 30 ? /*#__PURE__*/React$1.createElement(Tooltip$3, {
+  }, value && value.length > 30 ? /*#__PURE__*/React$1.createElement(Tooltip$2, {
     content: getTooltipText(value),
     direction: "top",
     topFactor: value !== null ? -getTopFactor(Math.ceil(value.length / 50)) : -getTopFactor(1)
@@ -25941,9 +25941,9 @@ const BarChartsByWeeks = props => {
     fontSize: "12px",
     tickLine: false,
     tickFormatter: value => `${displayFormattedValue(value)}`
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null), !showTwoBars ? /*#__PURE__*/React$1.createElement(Bar, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null), !showTwoBars ? /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "value",
     name: "title",
     maxBarSize: 30,
@@ -26367,12 +26367,12 @@ const TotalDoughnutChart = props => {
   }, legendData.map(row => /*#__PURE__*/React$1.createElement(Cell, {
     key: `cell-${row.name}`,
     fill: row.color
-  }))), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }))), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip$2, {
       value: value,
       isPercent: isPercent
     })
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null)))), /*#__PURE__*/React$1.createElement(LegendContainer$4, null, legendData.map(row => /*#__PURE__*/React$1.createElement(LegendControlsContainer, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null)))), /*#__PURE__*/React$1.createElement(LegendContainer$4, null, legendData.map(row => /*#__PURE__*/React$1.createElement(LegendControlsContainer, {
     key: row.name
   }, /*#__PURE__*/React$1.createElement(LegendColorRectangle, {
     color: row.color
@@ -26565,7 +26565,7 @@ const TooltipTip = styled.div`
   }
 `;
 
-const Tooltip$2 = props => {
+const Tooltip$1 = props => {
   const {
     className,
     top,
@@ -26581,14 +26581,14 @@ const Tooltip$2 = props => {
     className: `controls ${direction || 'top'}`
   }, content)));
 };
-Tooltip$2.propTypes = {
+Tooltip$1.propTypes = {
   className: PropTypes.string,
   top: PropTypes.number,
   left: PropTypes.number,
   direction: PropTypes.string,
   content: PropTypes.string
 };
-Tooltip$2.defaultProps = {
+Tooltip$1.defaultProps = {
   className: '',
   top: 0,
   left: 0,
@@ -26862,7 +26862,7 @@ const TotalHorizontalCharts = props => {
   React$1.createElement(Cell, {
     key: `cell-${index}`,
     fill: barBackgrounds[index % 20]
-  }))), showLegendTooltip && /*#__PURE__*/React$1.createElement(Tooltip$2, {
+  }))), showLegendTooltip && /*#__PURE__*/React$1.createElement(Tooltip$1, {
     direction: "top",
     content: tooltipText.content,
     top: tooltipText.clientY,
@@ -28815,9 +28815,9 @@ const BarChart = props => {
     stroke: "#D0D0D0",
     domain: [0, 'auto'],
     interval: 0
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null), /*#__PURE__*/React$1.createElement(Bar, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "value",
     fill: barChartColor,
     minPointSize: 5,
@@ -29265,7 +29265,7 @@ const DoubleBarSingleLine = props => {
       ...syncCharts.margin,
       bottom: 120
     }
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), showBackgroundGrid && /*#__PURE__*/React$1.createElement(CartesianGrid, {
     vertical: false,
@@ -29716,7 +29716,7 @@ const AreaChart = props => {
     strokeDasharray: "4 3",
     vertical: false,
     horizontal: true
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), /*#__PURE__*/React$1.createElement(Legend, {
     layout: "horizontal",
@@ -31163,7 +31163,7 @@ const BubbleChart = _ref => {
         direction: "right"
       });
     }
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null),
     cursor: false,
     wrapperStyle: {
@@ -31959,7 +31959,7 @@ const BarLine = props => {
     type: "number",
     domain: [0, dataMax => dataMax * 1.3],
     hide: true
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null),
     cursor: brushAreaBarData.length > 80
   }), /*#__PURE__*/React$1.createElement(Bar, {
@@ -32123,7 +32123,7 @@ const SingleChart = props => {
     type: "number",
     domain: [0, dataMax => dataMax * 1.3],
     hide: true
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     cursor: barData.length > 80,
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), /*#__PURE__*/React$1.createElement(Bar, {
@@ -32319,7 +32319,7 @@ const InnerBar = props => {
     type: "number",
     domain: [0, dataMax => dataMax * 1.3],
     hide: true
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     cursor: brushInnerBarData.length > 80,
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), /*#__PURE__*/React$1.createElement(Bar, {
@@ -32727,7 +32727,7 @@ const SingleBarLineCharts = _ref => {
     stroke: legendData.find(item => item.iconType === 'LegendUnionIcon')?.iconColor
   }, /*#__PURE__*/React$1.createElement(LabelList, {
     content: /*#__PURE__*/React$1.createElement(CustomizedLabelROI, null)
-  })), setLineChartTooltip && /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  })), setLineChartTooltip && /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: CustomTooltipLineChart
   }))), /*#__PURE__*/React$1.createElement(BarsGapper, {
     margin: !showLineChart ? lineChartHeight : 'inherit'
@@ -32766,9 +32766,9 @@ const SingleBarLineCharts = _ref => {
   }), /*#__PURE__*/React$1.createElement(ReferenceLine, {
     y: 0,
     stroke: "#D0D0D0"
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: CustomTooltipBarChart
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null), /*#__PURE__*/React$1.createElement(Bar, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "barValue",
     barSize: barSize ?? 60,
     fill: legendData.filter(item => item.iconType === 'Square')[0]?.iconColor,
@@ -33189,9 +33189,9 @@ const BarChartWithAreaChart = props => {
     allowDataOverflow: true,
     width: 700,
     interval: 0
-  }), isAreaChartDisplayed && /*#__PURE__*/React$1.createElement(React$1.Fragment, null, /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), isAreaChartDisplayed && /*#__PURE__*/React$1.createElement(React$1.Fragment, null, /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null)), /*#__PURE__*/React$1.createElement(Bar, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null)), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "value",
     fill: barChartColor,
     minPointSize: 0,
@@ -33416,9 +33416,9 @@ const BarChartTwoRows = props => {
     height: 80,
     interval: 0,
     stroke: "#D0D0D0"
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
-  }), /*#__PURE__*/React$1.createElement(Tooltip$4, null), /*#__PURE__*/React$1.createElement(Bar, {
+  }), /*#__PURE__*/React$1.createElement(Tooltip$3, null), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "lowerValue",
     fill: barChartColorFirst,
     minPointSize: 5,
@@ -33618,7 +33618,7 @@ const TwoBarCharts = props => {
     interval: 0,
     height: 120,
     stroke: "#D0D0D0"
-  }), showTooltip && /*#__PURE__*/React$1.createElement(Tooltip$4, {
+  }), showTooltip && /*#__PURE__*/React$1.createElement(Tooltip$3, {
     content: /*#__PURE__*/React$1.createElement(CustomTooltip, null)
   }), /*#__PURE__*/React$1.createElement(Bar, {
     dataKey: "valueOne",
@@ -34688,7 +34688,7 @@ const ModalWithOverlay = props => {
     hoverTextColor: "#212121",
     hoverBackgroundColor: "#E6F0F0",
     hoverBorderColor: "#D3D3D3"
-  }), showOkButton && (disableOkButton && tooltipContent !== '' ? /*#__PURE__*/React$1.createElement(Tooltip$3, {
+  }), showOkButton && (disableOkButton && tooltipContent !== '' ? /*#__PURE__*/React$1.createElement(Tooltip$2, {
     direction: "top",
     topFactor: -0.85,
     content: /*#__PURE__*/React$1.createElement(TooltipContent$1, {
@@ -39634,7 +39634,7 @@ const MessageBox = _ref => {
     width: "auto",
     minWidth: "60px",
     onClick: onClose
-  }), tooltipContent !== "" && /*#__PURE__*/React$1.createElement(Tooltip, {
+  }), tooltipContent !== "" && /*#__PURE__*/React$1.createElement(Tooltip$2, {
     direction: "top",
     showTooltip: isDisabled,
     topFactor: -0.85,
@@ -44521,7 +44521,7 @@ const ButtonContainer = styled$1.div`
     }
   }
 `;
-const CustomTooltip$1 = styled$1(Tooltip$3)`
+const CustomTooltip$1 = styled$1(Tooltip$2)`
   .controls {
     padding: 12px 16px;
     font-size: 14px;
@@ -45016,7 +45016,7 @@ styled.div`
     }
   }
 `;
-const CustomTooltip = styled(Tooltip$3)`
+const CustomTooltip = styled(Tooltip$2)`
   .controls {
     padding: 12px 16px;
     font-size: 14px;
@@ -45688,7 +45688,7 @@ const DividerLine = styled.div`
   background: #BEE3C7;
   margin: 0 auto;
 `;
-const Tooltip$1 = styled.div`
+const Tooltip = styled.div`
   visibility: hidden;
   background: #ffffff;
   color: #212121;
@@ -45725,8 +45725,8 @@ const ExpandButtonWrapper = styled.div`
   display: flex;
   justify-content: center;
   align-items: center;
-  &:hover ${Tooltip$1},
-  &:focus-within ${Tooltip$1} {
+  &:hover ${Tooltip},
+  &:focus-within ${Tooltip} {
     visibility: visible;
     opacity: 1;
   }
@@ -54113,7 +54113,7 @@ const SuccessScreen = ({
     key: idx
   }, vendor))), hiddenVendors.length > 0 && /*#__PURE__*/React$1.createElement(ExpandButtonWrapper, null, /*#__PURE__*/React$1.createElement(ExpandButton, {
     tabIndex: 0
-  }, "\u2022\u2022\u2022"), /*#__PURE__*/React$1.createElement(Tooltip$1, null, vendors.map((vendor, idx) => /*#__PURE__*/React$1.createElement(React$1.Fragment, {
+  }, "\u2022\u2022\u2022"), /*#__PURE__*/React$1.createElement(Tooltip, null, vendors.map((vendor, idx) => /*#__PURE__*/React$1.createElement(React$1.Fragment, {
     key: idx
   }, vendor, /*#__PURE__*/React$1.createElement("br", null)))))));
 };
@@ -55561,5 +55561,5 @@ const Tag = props => {
   }, /*#__PURE__*/React$1.createElement("span", null, text || template?.text));
 };
 
-export { AdvancedThresholds, Analytics, AreaChart, BannerEventBoxList, BarChart, BarChartTwoRows, BarChartWithAreaChart, BarChartsByWeeks, BatteryChart, BreakdownPanel, BrushChart, BubbleChart, Budgets, Build, Button$1 as Button, Campaigns, CheckBox, CollapseData, CollapseHeader, ContainerTable, Coupons, CustomerSegments, Dashboard, DialogOverlay$1 as DialogOverlay, DoubleBarSingleLine, DoublePanelDataRow, DownloadProgress, DropdownNew, EventDetailsCard, EventList, Execute, FilterPanel, FilterPop, GroupBuilder, Heatmap, IconButton$1 as IconButton, Input$2 as Input, InsightsCarousel, ItemManagerPanel, ItemsStores, LinkButton, LinnerDataBox, MarketShareDescription, MenuRoute, MessageBox, ModalDrawer, ModalWithOverlay, OneColumnContainer, OverlayDropdown, PerformanceAnalyticsLegend, PieChart, PopupCharts, PreTestWhatIf, QuickFilter, QuickFilterCards, RangePicker, RangePop, ReportTable, RulesEngine, SampleRunEngine, SearchInput$1 as SearchInput, SingleBarLineCharts, SortPop, TabMenu, Table, Tag, ToasterMessageBox, ToggleSwitch, Tooltip$3 as Tooltip, TopToggleList, TotalDoughnutChart, TotalHorizontalCharts, Track, TwoBarCharts, WeeksPicker };
+export { AdvancedThresholds, Analytics, AreaChart, BannerEventBoxList, BarChart, BarChartTwoRows, BarChartWithAreaChart, BarChartsByWeeks, BatteryChart, BreakdownPanel, BrushChart, BubbleChart, Budgets, Build, Button$1 as Button, Campaigns, CheckBox, CollapseData, CollapseHeader, ContainerTable, Coupons, CustomerSegments, Dashboard, DialogOverlay$1 as DialogOverlay, DoubleBarSingleLine, DoublePanelDataRow, DownloadProgress, DropdownNew, EventDetailsCard, EventList, Execute, FilterPanel, FilterPop, GroupBuilder, Heatmap, IconButton$1 as IconButton, Input$2 as Input, InsightsCarousel, ItemManagerPanel, ItemsStores, LinkButton, LinnerDataBox, MarketShareDescription, MenuRoute, MessageBox, ModalDrawer, ModalWithOverlay, OneColumnContainer, OverlayDropdown, PerformanceAnalyticsLegend, PieChart, PopupCharts, PreTestWhatIf, QuickFilter, QuickFilterCards, RangePicker, RangePop, ReportTable, RulesEngine, SampleRunEngine, SearchInput$1 as SearchInput, SingleBarLineCharts, SortPop, TabMenu, Table, Tag, ToasterMessageBox, ToggleSwitch, Tooltip$2 as Tooltip, TopToggleList, TotalDoughnutChart, TotalHorizontalCharts, Track, TwoBarCharts, WeeksPicker };
 //# sourceMappingURL=index.esm.js.map