sag_components 1.0.661 → 1.0.663

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/BannerEventBox.js +21 -13
  2. package/dist/stories/components/BannerEventBox.style.js +6 -6
  3. package/dist/stories/components/CollapseMenuItem.js +3 -2
  4. package/package.json +1 -1
package/dist/stories/components/BannerEventBox.js CHANGED
@@ -26,7 +26,6 @@ const BannerEventBox = props => {
26
26
  viewBannerTooltip
27
27
  } = props;
28
28
  const [showTooltip, setShowTooltip] = (0, _react.useState)(false);
29
- const [showItemTooltip, setShowItemTooltip] = (0, _react.useState)(false);
30
29
  const [tooltipPos, setTooltipPos] = (0, _react.useState)({
31
30
  x: 0,
32
31
  y: 0
@@ -63,10 +62,25 @@ const BannerEventBox = props => {
63
62
  return null;
64
63
  }
65
64
  };
65
+ const [showItemTooltip, setShowItemTooltip] = (0, _react.useState)(Array(data.length).fill(false));
66
+ const handleItemMouseEnter = (index, e) => {
67
+ setShowItemTooltip(prevState => {
68
+ const newState = [...prevState];
69
+ newState[index] = true;
70
+ return newState;
71
+ });
72
+ setTooltipPos({
73
+ x: e.clientX,
74
+ y: e.clientY
75
+ });
76
+ };
77
+ const handleItemMouseLeave = () => {
78
+ setShowItemTooltip(Array(data.length).fill(false));
79
+ };
66
80
  return /*#__PURE__*/_react.default.createElement(_BannerEventBox.MainContainer, {
67
81
  height: height,
68
82
  width: width
69
- }, /*#__PURE__*/_react.default.createElement(_BannerEventBox.TitleWrapper, null, formatedBanners(banner).icon, "|", /*#__PURE__*/_react.default.createElement(_BannerEventBox.CardTitle, null, formatedBanners(banner).name)), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Block, null, /*#__PURE__*/_react.default.createElement(_BannerEventBox.Headline, null, "Event Description"), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Text, null, description)), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Block, null, /*#__PURE__*/_react.default.createElement(_BannerEventBox.Headline, null, "Event Dates:"), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Text, null, dates)), /*#__PURE__*/_react.default.createElement(_BannerEventBox.MoreInfo, {
83
+ }, /*#__PURE__*/_react.default.createElement(_BannerEventBox.TitleWrapper, null, formatedBanners(banner).icon, "|", /*#__PURE__*/_react.default.createElement(_BannerEventBox.CardTitle, null, formatedBanners(banner).name)), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Block, null, /*#__PURE__*/_react.default.createElement(_BannerEventBox.Headline, null, "Event Description"), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Text, null, description)), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Block, null, /*#__PURE__*/_react.default.createElement(_BannerEventBox.Headline, null, "Event Dates:"), /*#__PURE__*/_react.default.createElement(_BannerEventBox.Text, null, dates.join(' - '))), /*#__PURE__*/_react.default.createElement(_BannerEventBox.MoreInfo, {
70
84
  ref: moreInfo,
71
85
  onMouseEnter: () => setShowTooltip(true),
72
86
  onMouseLeave: () => setShowTooltip(false)
@@ -83,18 +97,12 @@ const BannerEventBox = props => {
83
97
  return item && /*#__PURE__*/_react.default.createElement(_react.default.Fragment, {
84
98
  key: item.name
85
99
  }, /*#__PURE__*/_react.default.createElement(_BannerEventBox.KeyBlock, null, /*#__PURE__*/_react.default.createElement(_BannerEventBox.Key, {
86
- onMouseEnter: e => {
87
- setShowItemTooltip(true);
88
- setTooltipPos({
89
- x: e.clientX,
90
- y: e.clientY
91
- });
92
- },
93
- onMouseLeave: () => setShowItemTooltip(false)
100
+ onMouseEnter: e => handleItemMouseEnter(index, e),
101
+ onMouseLeave: handleItemMouseLeave
94
102
  }, item.name, /*#__PURE__*/_react.default.createElement(_InfoIcon.default, {
95
- width: "14",
96
- height: "14"
97
- }), showItemTooltip && /*#__PURE__*/_react.default.createElement(_TspanTooltip.default, {
103
+ width: "12",
104
+ height: "12"
105
+ }), showItemTooltip[index] && /*#__PURE__*/_react.default.createElement(_TspanTooltip.default, {
98
106
  direction: "top",
99
107
  content: /*#__PURE__*/_react.default.createElement("ul", null, (_item$items = item.items) === null || _item$items === void 0 ? void 0 : _item$items.map(i => /*#__PURE__*/_react.default.createElement("li", {
100
108
  key: i
package/dist/stories/components/BannerEventBox.style.js CHANGED
@@ -10,13 +10,13 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
10
10
  var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12;
11
11
  const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n font-family: 'Poppins', sans-serif;\n color: #212121;\n background-color: white;\n padding: 20px;\n border-radius: 12px;\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.10);\n"])), props => props.width, props => props.height);
12
12
  const TitleWrapper = exports.TitleWrapper = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n margin-bottom: 20px;\n gap: 6px;\n"])));
13
- const CardTitle = exports.CardTitle = _styledComponents.default.h5(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n font-weight: 400;\n margin: 0;\n"])));
14
- const Headline = exports.Headline = _styledComponents.default.h6(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 14px;\n font-weight: 500;\n margin: 0;\n"])));
13
+ const CardTitle = exports.CardTitle = _styledComponents.default.h5(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 14px;\n font-weight: 400;\n margin: 0;\n"])));
14
+ const Headline = exports.Headline = _styledComponents.default.h6(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 12px;\n font-weight: 500;\n margin: 0;\n"])));
15
15
  const Block = exports.Block = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n margin-bottom: 12px;\n"])));
16
- const Text = exports.Text = _styledComponents.default.p(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n color: #8B8989;\n font-size: 14px;\n font-weight: 400;\n margin: 0;\n"])));
17
- const MoreInfo = exports.MoreInfo = _styledComponents.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n color: #229E38;\n font-size: 14px;\n font-weight: 400;\n text-decoration-line: underline;\n"])));
16
+ const Text = exports.Text = _styledComponents.default.p(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n color: #8B8989;\n font-size: 12px;\n font-weight: 400;\n margin: 0;\n"])));
17
+ const MoreInfo = exports.MoreInfo = _styledComponents.default.span(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n color: #229E38;\n font-size: 12px;\n font-weight: 400;\n text-decoration-line: underline;\n"])));
18
18
  const DetailsWrapper = exports.DetailsWrapper = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: space-between;\n align-items: stretch;\n margin-top: 12px;\n"])));
19
19
  const KeyBlock = exports.KeyBlock = _styledComponents.default.div(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)([""])));
20
- const Key = exports.Key = _styledComponents.default.span(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 14px;\n font-weight: 500;\n"])));
21
- const Count = exports.Count = _styledComponents.default.span(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n color: #8B8989;\n font-size: 14px;\n font-weight: 400;\n"])));
20
+ const Key = exports.Key = _styledComponents.default.span(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: inline-flex;\n align-items: center;\n gap: 4px;\n font-size: 12px;\n font-weight: 500;\n"])));
21
+ const Count = exports.Count = _styledComponents.default.span(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteral2.default)(["\n color: #8B8989;\n font-size: 12px;\n font-weight: 400;\n"])));
22
22
  const Seperator = exports.Seperator = _styledComponents.default.div(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteral2.default)(["\n border-right: 1px solid #F2F2F2;\n"])));
package/dist/stories/components/CollapseMenuItem.js CHANGED
@@ -16,14 +16,15 @@ const CollapseMenuItem = props => {
16
16
  subTitle,
17
17
  children,
18
18
  showBorder,
19
- buttonAlignment
19
+ buttonAlignment,
20
+ className
20
21
  } = props;
21
22
  const [IsItemOpen, setIsItemOpen] = (0, _react.useState)(false);
22
23
  const handleToggle = () => {
23
24
  setIsItemOpen(!IsItemOpen);
24
25
  };
25
26
  return /*#__PURE__*/_react.default.createElement(_CollapseMenuItem.CollapseMenuItemMainContainer, {
26
- id: "CollapseMenuItemMainContainer",
27
+ className: className,
27
28
  showBorder: showBorder
28
29
  }, /*#__PURE__*/_react.default.createElement(_CollapseMenuItem.CollapseMenuItemContainer, {
29
30
  id: "CollapseMenuItemContainer",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.661",
3
+ "version": "1.0.663",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {