sag_components 1.0.675 → 1.0.677

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 (3) hide show
  1. package/dist/stories/components/BannerEventBoxList.js +31 -3
  2. package/dist/stories/components/BannerEventBoxList.style.js +11 -3
  3. package/package.json +1 -1
package/dist/stories/components/BannerEventBoxList.js CHANGED
@@ -1,24 +1,48 @@
1
1
  "use strict";
2
2
 
3
3
  var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
5
  Object.defineProperty(exports, "__esModule", {
5
6
  value: true
6
7
  });
7
8
  exports.default = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
+ var _react = _interopRequireWildcard(require("react"));
10
+ var _MenuItemOpenIcon = require("./icons/MenuItemOpenIcon");
11
+ var _MenuItemUpIcon = require("./icons/MenuItemUpIcon");
9
12
  var _BannerEventBoxList = require("./BannerEventBoxList.style");
10
13
  var _BannerEventBox = _interopRequireDefault(require("./BannerEventBox"));
11
14
  const BannerEventBoxList = props => {
12
15
  const {
16
+ title,
17
+ className,
18
+ eventName,
19
+ eventType,
13
20
  width,
14
21
  height,
15
22
  data,
16
23
  retailerFile
17
24
  } = props;
18
- return /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.MainContainer, {
25
+ const [IsItemOpen, setIsItemOpen] = (0, _react.useState)(false);
26
+ const handleToggle = () => {
27
+ setIsItemOpen(!IsItemOpen);
28
+ };
29
+ return /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.CollapseMenuItemMainContainer, {
30
+ className: className
31
+ }, /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.CollapseMenuItemContainer, {
32
+ onClick: () => handleToggle()
33
+ }, /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.CollapseMenuItemTitle, {
34
+ id: "CollapseMenuItemTitle"
35
+ }, title), /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.RightIconContainer, null, IsItemOpen ? /*#__PURE__*/_react.default.createElement(_MenuItemUpIcon.MenuItemUpIcon, {
36
+ color: "#212121"
37
+ }) : /*#__PURE__*/_react.default.createElement(_MenuItemOpenIcon.MenuItemOpenIcon, {
38
+ color: "#212121"
39
+ }))), IsItemOpen && /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.CollapseMenuItemContentContainer, {
40
+ id: "CollapseMenuItemContentContainer"
41
+ }, /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.EventType, null, eventType), /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.EventName, null, "Event Name |", ' ', /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.EventNameSpan, null, eventName)), /*#__PURE__*/_react.default.createElement(_BannerEventBoxList.MainContainer, {
19
42
  width: width,
20
43
  height: height
21
44
  }, data.map(item => /*#__PURE__*/_react.default.createElement(_BannerEventBox.default, {
45
+ key: item.banner,
22
46
  height: "100%",
23
47
  width: "100%",
24
48
  banner: item.banner,
@@ -26,11 +50,15 @@ const BannerEventBoxList = props => {
26
50
  dates: item.dates,
27
51
  data: item.data,
28
52
  onInfoClick: retailerFile(item.banner)
29
- })));
53
+ })))));
30
54
  };
31
55
  BannerEventBoxList.defaultProps = {
56
+ title: 'Title',
57
+ className: '',
32
58
  width: 'auto',
33
59
  height: 'auto',
60
+ eventType: 'Event Type',
61
+ eventName: 'Event Name',
34
62
  data: [{
35
63
  banner: 'Stop&Shop',
36
64
  description: 'description',
package/dist/stories/components/BannerEventBoxList.style.js CHANGED
@@ -4,8 +4,16 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
4
4
  Object.defineProperty(exports, "__esModule", {
5
5
  value: true
6
6
  });
7
- exports.MainContainer = void 0;
7
+ exports.RightIconContainer = exports.MainContainer = exports.EventType = exports.EventNameSpan = exports.EventName = exports.CollapseMenuItemTitle = exports.CollapseMenuItemMainContainer = exports.CollapseMenuItemContentContainer = exports.CollapseMenuItemContainer = void 0;
8
8
  var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
9
  var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _templateObject;
11
- const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n width: ", ";\n height: ", ";\n display: flex;\n gap: 20px;\n"])), props => props.width, props => props.height);
10
+ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9;
11
+ const CollapseMenuItemMainContainer = exports.CollapseMenuItemMainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Poppins\", sans-serif;\n background: white;\n padding: 20px;\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n border-radius: 12px;\n"])));
12
+ const CollapseMenuItemContainer = exports.CollapseMenuItemContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n align-items: center;\n justify-content: flex-start;\n cursor: 'pointer';\n"])));
13
+ const CollapseMenuItemTitle = exports.CollapseMenuItemTitle = _styledComponents.default.h3(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 18px;\n margin: 0;\n @media (max-width: 1536px) {\n font-size: 16px;\n }\n @media (max-width: 1366px) {\n font-size: 14px;\n }\n"])));
14
+ const CollapseMenuItemContentContainer = exports.CollapseMenuItemContentContainer = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 14px;\n @media (max-width: 1536px) {\n font-size: 12px;\n }\n"])));
15
+ const RightIconContainer = exports.RightIconContainer = _styledComponents.default.div(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n width: 20px;\n height: 20px;\n margin-left: auto;\n"])));
16
+ const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n width: ", ";\n height: ", ";\n display: flex;\n gap: 20px;\n padding-bottom: 25px;\n"])), props => props.width, props => props.height);
17
+ const EventType = exports.EventType = _styledComponents.default.h3(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n font-weight: 500;\n margin: 16px 0 20px;\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n"])));
18
+ const EventName = exports.EventName = _styledComponents.default.h3(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n font-size: 16px;\n font-weight: 500;\n margin: 0 0 20px;\n @media (max-width: 1536px) {\n font-size: 14px;\n }\n @media (max-width: 1366px) {\n font-size: 12px;\n }\n"])));
19
+ const EventNameSpan = exports.EventNameSpan = _styledComponents.default.span(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n"])));
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.675",
3
+ "version": "1.0.677",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {