sag_components 1.0.579 → 1.0.581

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (4) hide show
  1. package/dist/stories/components/SalesAndROI.js +8 -8
  2. package/dist/stories/components/TabMenu.js +14 -5
  3. package/dist/stories/components/TabMenu.style.js +6 -5
  4. package/package.json +1 -1
package/dist/stories/components/SalesAndROI.js CHANGED
@@ -34,7 +34,7 @@ const SalesAndROI = props => {
34
34
  id: "FormattedValue"
35
35
  }, /*#__PURE__*/_react.default.createElement(_SalesAndROI.TextBeforeAndAfterValue, {
36
36
  id: "TextBeforeAndAfterValue"
37
- }, dataItem.textBefore ? dataItem.textBefore : currencySign ? (0, _CommonFunctions.getCurrencySign)(currencyType, dataItem.value) : ""), dotCut ? (0, _CommonFunctions.getFormattedValue)(dataItem.value && Math.abs(dataItem.value) > 0 && dataItem.value % 1 !== 0 ? (_dataItem$value = dataItem.value) === null || _dataItem$value === void 0 ? void 0 : _dataItem$value.toFixed(2) : dataItem.value) : (0, _CommonFunctions.getNumberWithCommas)(dataItem.value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(dataItem.value) : "", /*#__PURE__*/_react.default.createElement(_SalesAndROI.TextBeforeAndAfterValue, null, dataItem.textAfter)));
37
+ }, dataItem.textBefore ? dataItem.textBefore : currencySign ? (0, _CommonFunctions.getCurrencySign)(currencyType, dataItem.value) : ''), dotCut ? (0, _CommonFunctions.getFormattedValue)(dataItem.value && Math.abs(dataItem.value) > 0 && dataItem.value % 1 !== 0 ? (_dataItem$value = dataItem.value) === null || _dataItem$value === void 0 ? void 0 : _dataItem$value.toFixed(2) : dataItem.value) : (0, _CommonFunctions.getNumberWithCommas)(dataItem.value), dotCut ? (0, _CommonFunctions.getFormattedUnits)(dataItem.value) : '', /*#__PURE__*/_react.default.createElement(_SalesAndROI.TextBeforeAndAfterValue, null, dataItem.textAfter)));
38
38
  };
39
39
  return /*#__PURE__*/_react.default.createElement(_SalesAndROI.ControlsContainer, {
40
40
  id: "ControlsContainer",
@@ -48,7 +48,7 @@ const SalesAndROI = props => {
48
48
  }, title), showOutgoingBanner && /*#__PURE__*/_react.default.createElement(_SalesAndROI.OutBanner, {
49
49
  id: "OutBanner",
50
50
  onClick: () => onBannerClick({
51
- eventName: "onBannerClick"
51
+ eventName: 'onBannerClick'
52
52
  })
53
53
  }, /*#__PURE__*/_react.default.createElement(_ExportIcon.default, {
54
54
  color: textColor
@@ -61,15 +61,15 @@ const SalesAndROI = props => {
61
61
  exports.SalesAndROI = SalesAndROI;
62
62
  var _default = exports.default = SalesAndROI;
63
63
  SalesAndROI.defaultProps = {
64
- title: "SALES",
64
+ title: 'SALES',
65
65
  dotCut: false,
66
66
  currencySign: false,
67
- currencyType: "USD",
67
+ currencyType: 'USD',
68
68
  salesData: [],
69
- width: "100%",
70
- height: "100%",
71
- textColor: "#212121",
69
+ width: '100%',
70
+ height: '100%',
71
+ textColor: '#212121',
72
72
  showOutgoingBanner: true,
73
- noDataText: "No Data",
73
+ noDataText: 'No Data',
74
74
  onBannerClick: () => {}
75
75
  };
package/dist/stories/components/TabMenu.js CHANGED
@@ -15,29 +15,37 @@ const TabMenu = props => {
15
15
  tabs,
16
16
  color,
17
17
  showActions,
18
+ showLabel,
18
19
  inputWidth,
19
20
  onTabChange,
20
21
  panelIsOpen,
21
22
  activeColor,
22
23
  onFilterButtonClick
23
24
  } = props;
24
- const [activeTab, setActiveTab] = (0, _react.useState)(1);
25
+ const [activeTab, setActiveTab] = (0, _react.useState)(0);
25
26
  const handleTabChange = index => {
26
27
  onTabChange(index);
27
28
  setActiveTab(index);
28
29
  };
29
- return /*#__PURE__*/_react.default.createElement(_TabMenu.TabMenuContainer, null, /*#__PURE__*/_react.default.createElement(_TabMenu.Nav, null, /*#__PURE__*/_react.default.createElement(_TabMenu.Tabs, null, tabs.map((tab, index) => /*#__PURE__*/_react.default.createElement(_TabMenu.Tab, {
30
+ return /*#__PURE__*/_react.default.createElement(_TabMenu.TabMenuContainer, null, /*#__PURE__*/_react.default.createElement(_TabMenu.Nav, null, /*#__PURE__*/_react.default.createElement(_TabMenu.Tabs, null, tabs.length > 1 ? tabs.map((tab, index) => /*#__PURE__*/_react.default.createElement(_TabMenu.Tab, {
30
31
  key: index,
31
32
  isActive: index === activeTab,
32
33
  className: "tab ".concat(index === activeTab ? 'active' : ''),
33
34
  color: color,
34
35
  onClick: () => handleTabChange(index)
35
- }, tab.title)), /*#__PURE__*/_react.default.createElement(_TabMenu.PresentationSlider, {
36
+ }, tab.title)) : /*#__PURE__*/_react.default.createElement(_TabMenu.Tab, {
37
+ isActive: activeTab === 0,
38
+ className: "tab ".concat(activeTab === 0 ? 'active' : ''),
39
+ color: color,
40
+ onClick: () => handleTabChange(0)
41
+ }, tabs[0].title), /*#__PURE__*/_react.default.createElement(_TabMenu.PresentationSlider, {
36
42
  activeTab: activeTab,
37
43
  color: color,
38
44
  width: "".concat(100 / tabs.length, "%"),
39
45
  role: "presentation"
40
- }))), showActions && /*#__PURE__*/_react.default.createElement(_TabMenu.ActionsWrapper, null, /*#__PURE__*/_react.default.createElement(_SagIconButton.default, {
46
+ }))), showLabel && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, null, /*#__PURE__*/_react.default.createElement(_TabMenu.Label, null, /*#__PURE__*/_react.default.createElement("span", null, "Platform: "), "Total"), /*#__PURE__*/_react.default.createElement("span", {
47
+ className: "separator"
48
+ }, "|")), showActions && /*#__PURE__*/_react.default.createElement(_TabMenu.ActionsWrapper, null, /*#__PURE__*/_react.default.createElement(_SagIconButton.default, {
41
49
  id: "filterButton",
42
50
  iconName: "Filter",
43
51
  buttonText: "Filter",
@@ -52,11 +60,12 @@ const TabMenu = props => {
52
60
  width: inputWidth
53
61
  })), /*#__PURE__*/_react.default.createElement(_TabMenu.Body, {
54
62
  id: "tabsBody"
55
- }, tabs[activeTab].content));
63
+ }, tabs[activeTab] && tabs[activeTab].content));
56
64
  };
57
65
  TabMenu.defaultProps = {
58
66
  color: '#229E38',
59
67
  showActions: true,
68
+ showLabel: true,
60
69
  inputWidth: '100%',
61
70
  tabs: [
62
71
  // { title: 'Tab 1', content: <ReportTable /> },
package/dist/stories/components/TabMenu.style.js CHANGED
@@ -4,14 +4,15 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.Tabs = exports.TabMenuContainer = exports.Tab = exports.PresentationSlider = exports.Nav = exports.Body = exports.ActionsWrapper = void 0;
7
+ exports.Tabs = exports.TabMenuContainer = exports.Tab = exports.PresentationSlider = exports.Nav = exports.Label = exports.Body = exports.ActionsWrapper = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7;
11
- const TabMenuContainer = exports.TabMenuContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n font-family: 'Poppins', sans-serif;\n display: flex;\n justify-content: space-between;\n flex-wrap: wrap;\n"])));
12
- const Nav = exports.Nav = _styledComponents.default.nav(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)([" \n display: inline-block;\n"])));
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8;
11
+ const TabMenuContainer = exports.TabMenuContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n font-family: 'Poppins', sans-serif;\n display: flex;\n flex-wrap: wrap;\n align-items: center;\n justify-content: space-between;\n"])));
12
+ const Nav = exports.Nav = _styledComponents.default.nav(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)([" \n display: inline-block;\n margin-right: auto;\n"])));
13
13
  const Tabs = exports.Tabs = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n display: flex;\n align-items: center;\n width: 100%;\n"])));
14
14
  const Tab = exports.Tab = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n cursor: pointer;\n position: relative;\n text-align: center;\n flex: 1;\n padding: 8px 12px;\n font-size: 16px;\n color: #000000;\n &.active {\n font-weight: 600;\n color: ", ";\n }\n"])), props => props.color);
15
15
  const PresentationSlider = exports.PresentationSlider = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n position: absolute;\n bottom: 0;\n left: 0;\n width: 100%;\n height: 2px;\n background-color: #EAEAEA;\n &::before {\n content: '';\n position: absolute;\n left: 0;\n z-index: 1;\n width: ", ";\n height: 2px;\n background-color: ", ";\n transform: translateX(calc(100% * ", "));\n transition: transform .35s ease;\n }\n"])), props => props.width, props => props.color, props => props.activeTab);
16
16
  const Body = exports.Body = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n padding: 24px 0;\n width: 100%;\n"])));
17
- const ActionsWrapper = exports.ActionsWrapper = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n gap: 10px;\n"])));
17
+ const Label = exports.Label = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 12px;\n font-weight: 400;\n padding: 8px;\n color: #5a5a5a;\n background-color: #E7E7E7;\n border-radius: 4px;\n > span {\n font-weight: 500;\n }\n ~ span {\n margin: 0 24px;\n font-weight: 400;\n }\n"])));
18
+ const ActionsWrapper = exports.ActionsWrapper = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n gap: 10px;\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.579",
3
+ "version": "1.0.581",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {