sag_components 1.0.621 → 1.0.623

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.
@@ -47,7 +47,10 @@ const FilterPanel = props => {
47
47
  ...itemFieldsDataState,
48
48
  ...(itemFieldsDataState.dropdownOptions ? {
49
49
  dropdownOptions: foundItem !== null && foundItem !== void 0 && foundItem.dropdownOptions ? foundItem === null || foundItem === void 0 ? void 0 : foundItem.dropdownOptions : undefined
50
- } : '')
50
+ } : ''),
51
+ ...{
52
+ disabled: (foundItem === null || foundItem === void 0 ? void 0 : foundItem.disabled) || false
53
+ }
51
54
  };
52
55
  });
53
56
  setFieldsDataState(newFieldsDataState);
@@ -19,6 +19,8 @@ var _QuarterPopupPicker = _interopRequireDefault(require("./QuarterPopupPicker")
19
19
 
20
20
  const QuarterPicker = _ref => {
21
21
  let {
22
+ availableQuarters,
23
+ //["Q1-2024"]
22
24
  label,
23
25
  onChange,
24
26
  borderRadius,
@@ -96,7 +98,8 @@ const QuarterPicker = _ref => {
96
98
  onChangeDate: onChangeDate,
97
99
  value: value,
98
100
  setValue: setValue,
99
- startDateValue: startDateValue
101
+ startDateValue: startDateValue,
102
+ availableQuarters: availableQuarters
100
103
  }));
101
104
  };
102
105
  // Adding defaultProps
@@ -22,7 +22,7 @@ const DatePickerHeader = _styledComponents.default.div(_templateObject3 || (_tem
22
22
  const NavDiv = _styledComponents.default.div(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n width: 80px;\n height: 30px;\n display: flex;\n padding: 5px;\n justify-content: space-around;\n"])));
23
23
  const DatePickerSelect = _styledComponents.default.select(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n padding: 4px;\n border: none;\n font-family: Poppins;\n font-size: 12px; \n font-style: normal;\n font-weight: 400;\n cursor: pointer;\n\n &:focus {\n border: none;\n }\n"])));
24
24
  const DatePickerCalendar = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n display: grid;\n width: 220px;\n height: 150px;\n row-gap: 30px;\n margin: 20px;\n column-gap: 30px;\n grid-template-columns: repeat(4, 1fr);\n grid-template-rows: repeat(4, 1fr);\n"])));
25
- const DateCell = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n aspect-ratio: 1 / 1;\n /* height: 32px; */\n font-family: Poppins;\n border-radius: 4px;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n transition: background-color 0.3s ease;\n\n &:hover {\n background: #f4faf5;\n }\n\n &.selected {\n background-color: #229e38;\n color: #fff;\n }\n &.startselected {\n border: 1px solid #229e38;\n }\n &.inrange {\n border-radius: 0px;\n background-color: #effef2;\n }\n"])));
25
+ const DateCell = _styledComponents.default.div(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n aspect-ratio: 1 / 1;\n /* height: 32px; */\n font-family: Poppins;\n border-radius: 4px;\n font-size: 12px;\n font-style: normal;\n font-weight: 400;\n display: flex;\n justify-content: center;\n align-items: center;\n cursor: pointer;\n transition: background-color 0.3s ease;\n\n &:hover {\n background: #f4faf5;\n }\n\n &.selected {\n background-color: #229e38;\n color: #fff;\n }\n &.startselected {\n border: 1px solid #229e38;\n }\n &.inrange {\n border-radius: 0px;\n background-color: #effef2;\n }\n\n &.disable {\n pointer-events: none;\n color: #ccc;\n }\n"])));
26
26
  const years = [2022, 2023, 2024];
27
27
  const QuarterPopupPicker = _ref => {
28
28
  let {
@@ -30,11 +30,13 @@ const QuarterPopupPicker = _ref => {
30
30
  onChangeDate,
31
31
  value,
32
32
  setValue,
33
- startDateValue
33
+ startDateValue,
34
+ availableQuarters
34
35
  } = _ref;
35
36
  const [selectedQuarter, setSelectedQuarter] = (0, _react.useState)(null);
36
37
  const [currentStartDate, setCurrentStartDate] = (0, _react.useState)(new Date(new Date().getFullYear(), 0, 1));
37
38
  const handleDateSelect = date => {
39
+ console.log('handleDateSelect date', date);
38
40
  setSelectedQuarter(date);
39
41
  onChangeDate(date);
40
42
  };
@@ -52,7 +54,7 @@ const QuarterPopupPicker = _ref => {
52
54
  if (value === '' || value === undefined) {
53
55
  setSelectedQuarter(null);
54
56
  } else {
55
- setSelectedQuarter(new Date(startDateValue));
57
+ setSelectedQuarter(value);
56
58
  }
57
59
  }, [value, isOpen]);
58
60
  const renderDatePicker = () => {
@@ -75,13 +77,20 @@ const QuarterPopupPicker = _ref => {
75
77
  }, /*#__PURE__*/_react.default.createElement(_ChervronLeftIcon.default, null)), /*#__PURE__*/_react.default.createElement("div", {
76
78
  onClick: handleNextMonth
77
79
  }, /*#__PURE__*/_react.default.createElement(_ChervronRightIcon.default, null)))), /*#__PURE__*/_react.default.createElement(DatePickerCalendar, null, dates.map(date => {
78
- if (selectedQuarter) {
80
+ console.log('date', date, selectedQuarter);
81
+ if (selectedQuarter === date) {
79
82
  return /*#__PURE__*/_react.default.createElement(DateCell, {
80
83
  key: date,
81
84
  className: "selected",
82
85
  onClick: () => handleDateSelect(date)
83
86
  }, date);
84
87
  }
88
+ if (!availableQuarters.includes("".concat(date, "-").concat(currentDate.getFullYear()))) {
89
+ return /*#__PURE__*/_react.default.createElement(DateCell, {
90
+ className: "disable",
91
+ key: date
92
+ }, date);
93
+ }
85
94
  return /*#__PURE__*/_react.default.createElement(DateCell, {
86
95
  key: date,
87
96
  onClick: () => handleDateSelect(date)
@@ -0,0 +1,143 @@
1
+ "use strict";
2
+
3
+ var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
+ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
5
+ Object.defineProperty(exports, "__esModule", {
6
+ value: true
7
+ });
8
+ exports.default = void 0;
9
+ var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
10
+ var _react = _interopRequireWildcard(require("react"));
11
+ var _Modal = _interopRequireDefault(require("./Modal"));
12
+ var _CodeEditor = _interopRequireDefault(require("./CodeEditor"));
13
+ var _TextField = _interopRequireDefault(require("./TextField"));
14
+ var _Dropdown = _interopRequireDefault(require("./Dropdown"));
15
+ var _reactHookForm = require("react-hook-form");
16
+ var _Modal2 = require("./Modal.style");
17
+ var TotalCostModal = function TotalCostModal(_ref) {
18
+ var title = _ref.title,
19
+ isModalOpen = _ref.isModalOpen,
20
+ setModalOpen = _ref.setModalOpen,
21
+ setResult = _ref.setResult;
22
+ var _useState = (0, _react.useState)([{
23
+ id: "title",
24
+ label: "Title",
25
+ type: "text"
26
+ }, {
27
+ id: "dotCut",
28
+ label: "Do Cut",
29
+ type: "select",
30
+ options: ["true", "false"]
31
+ }, {
32
+ id: "currency",
33
+ label: "Currency",
34
+ type: "select",
35
+ options: ["true", "false"]
36
+ }, {
37
+ id: "currencyType",
38
+ label: "Currency Type",
39
+ type: "select",
40
+ options: ["USD", "EUR", "ILS", "GBP", "JPY"]
41
+ }, {
42
+ id: "width",
43
+ label: "Width",
44
+ type: "text"
45
+ }, {
46
+ id: "height",
47
+ label: "Height",
48
+ type: "text"
49
+ }, {
50
+ id: "textColor",
51
+ label: "Text Color",
52
+ type: "text"
53
+ }, {
54
+ id: "noDataText",
55
+ label: "No Data Text",
56
+ type: "text"
57
+ }]),
58
+ _useState2 = (0, _slicedToArray2.default)(_useState, 2),
59
+ params = _useState2[0],
60
+ setParams = _useState2[1];
61
+ var _useState3 = (0, _react.useState)("Select PACKAGE_COST,REDEMPTION_COST,(PACKAGE_COST+REDEMPTION_COST) AS TOTAL_COST,from FACT_EVENT_MEASURES A INNER JOIN DIM_EVENTS B ON A.EVENT_CODE = B.EVENT_CODE"),
62
+ _useState4 = (0, _slicedToArray2.default)(_useState3, 2),
63
+ code = _useState4[0],
64
+ setCode = _useState4[1];
65
+ var _useForm = (0, _reactHookForm.useForm)(),
66
+ register = _useForm.register,
67
+ handleSubmit = _useForm.handleSubmit,
68
+ watch = _useForm.watch,
69
+ control = _useForm.control,
70
+ errors = _useForm.formState.errors;
71
+ var onSubmit = function onSubmit(data) {
72
+ return setResult(data);
73
+ };
74
+ return /*#__PURE__*/_react.default.createElement("form", {
75
+ onSubmit: handleSubmit(onSubmit)
76
+ }, /*#__PURE__*/_react.default.createElement(_Modal.default, {
77
+ isOpen: isModalOpen,
78
+ onClose: function onClose() {
79
+ return setModalOpen(false);
80
+ }
81
+ }, /*#__PURE__*/_react.default.createElement("h2", null, title), /*#__PURE__*/_react.default.createElement("div", {
82
+ style: {
83
+ gap: "10px",
84
+ display: "grid"
85
+ }
86
+ }, /*#__PURE__*/_react.default.createElement(_CodeEditor.default, {
87
+ value: code,
88
+ onChange: setCode
89
+ }), /*#__PURE__*/_react.default.createElement("div", {
90
+ style: {
91
+ gap: "10px",
92
+ display: "grid",
93
+ gridTemplateColumns: "auto auto auto"
94
+ }
95
+ }, params.map(function (item) {
96
+ if (item.type === "text") {
97
+ return /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
98
+ control: control,
99
+ name: item.id,
100
+ render: function render(_ref2) {
101
+ var field = _ref2.field;
102
+ return /*#__PURE__*/_react.default.createElement(_TextField.default, Object.assign({}, field, {
103
+ allowedInput: "all",
104
+ height: "100%",
105
+ label: item.label,
106
+ multiline: true,
107
+ placeHolder: "Type...",
108
+ shape: "round",
109
+ size: "small",
110
+ width: "300px"
111
+ }));
112
+ }
113
+ });
114
+ } else {
115
+ return /*#__PURE__*/_react.default.createElement(_reactHookForm.Controller, {
116
+ control: control,
117
+ name: item.id,
118
+ render: function render(_ref3) {
119
+ var field = _ref3.field;
120
+ return /*#__PURE__*/_react.default.createElement(_Dropdown.default, Object.assign({}, field, {
121
+ allowedInput: "all",
122
+ labelColor: "#1B30AA",
123
+ limitTagsOnMultiSelect: 0,
124
+ onInputChange: function onInputChange(e) {
125
+ var _e$inputValue;
126
+ console.log("e", e);
127
+ field.onChange((_e$inputValue = e === null || e === void 0 ? void 0 : e.inputValue) !== null && _e$inputValue !== void 0 ? _e$inputValue : "");
128
+ },
129
+ options: item.options,
130
+ placeHolder: "Type...",
131
+ shape: "round",
132
+ size: "small",
133
+ text: item.label,
134
+ width: "300px"
135
+ }));
136
+ }
137
+ });
138
+ }
139
+ }))), /*#__PURE__*/_react.default.createElement(_Modal2.SubmitButton, {
140
+ type: "submit"
141
+ })));
142
+ };
143
+ var _default = exports.default = TotalCostModal;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "sag_components",
3
- "version": "1.0.621",
3
+ "version": "1.0.623",
4
4
  "description": "",
5
5
  "main": "dist/index.js",
6
6
  "scripts": {
@@ -1,284 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.ExamplePopupContent = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _PopupContent = _interopRequireDefault(require("../components/CampaignTool/PopupContent"));
10
- const FieldsDataRow1 = [{
11
- name: "FundationSource",
12
- label: "Fundation Source",
13
- disabled: false,
14
- required: false,
15
- inputType: "dropdown",
16
- //aviliable values: textbox | dropdown | checkBox | datepicker
17
- showInfo: true,
18
- infoText: "This is one of the Popup content's fields",
19
- placeHolder: "Select Source",
20
- dropdownOptions: [{
21
- value: 1,
22
- label: "Source 1"
23
- }, {
24
- value: 2,
25
- label: "Source 2"
26
- }, {
27
- value: 3,
28
- label: "Source 3"
29
- }],
30
- dropdownDefaultValue: null
31
- }, {
32
- name: "Category",
33
- label: "Category",
34
- disabled: false,
35
- required: false,
36
- inputType: "dropdown",
37
- //aviliable values: textbox | dropdown | checkBox | datepicker
38
- showInfo: true,
39
- infoText: "This is one of the Popup content's fields",
40
- placeHolder: "Select Category",
41
- dropdownOptions: [{
42
- value: 1,
43
- label: "Category 1"
44
- }, {
45
- value: 2,
46
- label: "Category 2"
47
- }, {
48
- value: 3,
49
- label: "Category 3"
50
- }],
51
- dropdownDefaultValue: null
52
- }, {
53
- name: "Supplier",
54
- label: "Supplier",
55
- disabled: false,
56
- required: false,
57
- inputType: "dropdown",
58
- //aviliable values: textbox | dropdown | checkBox | datepicker
59
- showInfo: true,
60
- infoText: "This is one of the Popup content's fields",
61
- placeHolder: "Select Supplier",
62
- dropdownOptions: [{
63
- value: 1,
64
- label: "Supplier 1"
65
- }, {
66
- value: 2,
67
- label: "Supplier 2"
68
- }, {
69
- value: 3,
70
- label: "Supplier 3"
71
- }],
72
- dropdownDefaultValue: null
73
- }, {
74
- name: "ContactName",
75
- label: "Contact Name",
76
- disabled: false,
77
- required: false,
78
- inputType: "textbox",
79
- //aviliable values: textbox | dropdown | checkBox | datepicker
80
- showInfo: true,
81
- infoText: "This is one of the Popup content's fields",
82
- placeHolder: "Enter Contact Name",
83
- dropdownOptions: null,
84
- dropdownDefaultValue: null
85
- }];
86
- const FieldsDataRow2 = [{
87
- name: "BrandName",
88
- label: "Brand Name",
89
- disabled: false,
90
- required: false,
91
- inputType: "dropdown",
92
- //aviliable values: textbox | dropdown | checkBox | datepicker
93
- showInfo: true,
94
- infoText: "This is one of the Popup content's fields",
95
- placeHolder: "Select Brand",
96
- dropdownOptions: [{
97
- value: 1,
98
- label: "Brand 1"
99
- }, {
100
- value: 2,
101
- label: "Brand 2"
102
- }, {
103
- value: 3,
104
- label: "Brand 3"
105
- }],
106
- dropdownDefaultValue: null
107
- }, {
108
- name: "Budget",
109
- label: "Budget",
110
- disabled: false,
111
- required: false,
112
- inputType: "dropdown",
113
- //aviliable values: textbox | dropdown | checkBox | datepicker
114
- showInfo: true,
115
- infoText: "This is one of the Popup content's fields",
116
- placeHolder: "Select Budget",
117
- dropdownOptions: [{
118
- value: 1,
119
- label: "Budget 1"
120
- }, {
121
- value: 2,
122
- label: "Budget 2"
123
- }, {
124
- value: 3,
125
- label: "Budget 3"
126
- }],
127
- dropdownDefaultValue: {
128
- value: 1,
129
- label: "Budget 1"
130
- }
131
- }, {
132
- name: "CategoryManager",
133
- label: "Category Manager",
134
- disabled: false,
135
- required: false,
136
- inputType: "dropdown",
137
- //aviliable values: textbox | dropdown | checkBox | datepicker
138
- showInfo: true,
139
- infoText: "This is one of the Popup content's fields",
140
- placeHolder: "Select Category Manager",
141
- dropdownOptions: [{
142
- value: 1,
143
- label: "Category Manager 1"
144
- }, {
145
- value: 2,
146
- label: "Category Manager 2"
147
- }, {
148
- value: 3,
149
- label: "Category Manager 3"
150
- }],
151
- dropdownDefaultValue: {
152
- value: 3,
153
- label: "Category Manager 3"
154
- }
155
- }, {
156
- name: "ContactEmail",
157
- label: "Contact Email",
158
- disabled: false,
159
- required: false,
160
- inputType: "textbox",
161
- //aviliable values: textbox | dropdown | checkBox | datepicker
162
- showInfo: true,
163
- infoText: "This is one of the Popup content's fields",
164
- placeHolder: "Enter Contact Email",
165
- dropdownOptions: null,
166
- dropdownDefaultValue: null
167
- }];
168
- const FieldsDataRow3 = [{
169
- name: "Broker",
170
- label: "Broker",
171
- disabled: false,
172
- required: false,
173
- inputType: "dropdown",
174
- //aviliable values: textbox | dropdown | checkBox | datepicker
175
- showInfo: true,
176
- infoText: "This is one of the Popup content's fields",
177
- placeHolder: "Select Broker",
178
- dropdownOptions: [{
179
- value: 1,
180
- label: "Broker 1"
181
- }, {
182
- value: 2,
183
- label: "Broker 2"
184
- }, {
185
- value: 3,
186
- label: "Broker 3"
187
- }],
188
- dropdownDefaultValue: null
189
- }, {
190
- name: "SupplierOfferID",
191
- label: "Supplier Offer ID",
192
- disabled: false,
193
- required: false,
194
- inputType: "textbox",
195
- //aviliable values: textbox | dropdown | checkBox | datepicker
196
- showInfo: true,
197
- infoText: "This is one of the Popup content's fields",
198
- placeHolder: "Enter Supplier Offer ID",
199
- dropdownOptions: null,
200
- dropdownDefaultValue: null
201
- }, {
202
- name: "VendorID",
203
- label: "Vendor ID",
204
- disabled: false,
205
- required: false,
206
- inputType: "textbox",
207
- //aviliable values: textbox | dropdown | checkBox | datepicker
208
- showInfo: true,
209
- infoText: "This is one of the Popup content's fields",
210
- placeHolder: "Enter Vendor ID",
211
- dropdownOptions: null,
212
- dropdownDefaultValue: null
213
- }, {
214
- name: "ContactPhone",
215
- label: "Contact Phone",
216
- disabled: false,
217
- required: true,
218
- inputType: "textbox",
219
- //aviliable values: textbox | dropdown | checkBox | datepicker
220
- showInfo: true,
221
- infoText: "This is one of the Popup content's fields",
222
- placeHolder: "Enter Contact Phone",
223
- dropdownOptions: null,
224
- dropdownDefaultValue: null
225
- }];
226
- const RowsData1 = [{
227
- fieldsArray: FieldsDataRow1
228
- }, {
229
- fieldsArray: FieldsDataRow2
230
- }, {
231
- fieldsArray: FieldsDataRow3
232
- }];
233
- var _default = exports.default = {
234
- title: "Campaign Tool/PopupContent",
235
- component: _PopupContent.default,
236
- tags: ["autodocs"],
237
- argTypes: {
238
- FieldsData: {
239
- name: "FieldsData",
240
- control: {
241
- type: "object"
242
- },
243
- description: " object: to fill kpi columns and buttons "
244
- },
245
- width: {
246
- name: "width",
247
- control: {
248
- type: "text"
249
- },
250
- description: "width of the control (in px / %)"
251
- },
252
- height: {
253
- name: "height",
254
- control: {
255
- type: "text"
256
- },
257
- description: "height of the control (in px / % )"
258
- },
259
- onClick: {
260
- action: "onClick",
261
- description: "onClick event - returns an object of check box {true/false} "
262
- },
263
- onChange: {
264
- action: "onChange",
265
- description: "onChange event "
266
- },
267
- borderColor: {
268
- name: "borderColor",
269
- description: "Sets the border color",
270
- control: {
271
- type: "color",
272
- presetColors: ["#ffffff", "#ff0000", "#00ff00", "#0000ff"]
273
- }
274
- }
275
- }
276
- };
277
- const Template = args => /*#__PURE__*/_react.default.createElement(_PopupContent.default, args);
278
- const ExamplePopupContent = exports.ExamplePopupContent = Template.bind({});
279
- ExamplePopupContent.args = {
280
- rowsData: RowsData1,
281
- borderColor: "#066768",
282
- width: "100%",
283
- height: "100%"
284
- };
@@ -1,92 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = void 0;
8
- var _react = _interopRequireWildcard(require("react"));
9
- var _MenuItemOpenIcon = require("./icons/MenuItemOpenIcon");
10
- var _MenuItemUpIcon = require("./icons/MenuItemUpIcon");
11
- var _SpotlightProductIcon = require("./icons/SpotlightProductIcon");
12
- var _BannersDropdown = require("./BannersDropdown");
13
- var _EventInfo = require("./EventInfo.style");
14
- const EventInfo = props => {
15
- const {
16
- title,
17
- subTitle,
18
- productsData,
19
- onSpotlightProductClick,
20
- onClickBannersDropdown
21
- } = props;
22
- const [IsProductsListOpen, setIsProductsListOpen] = (0, _react.useState)(false);
23
- const displayBannersDropdown = () => /*#__PURE__*/_react.default.createElement(_BannersDropdown.BannersDropdown, {
24
- banners: [{
25
- checked: true,
26
- name: 'StopAndShop'
27
- }, {
28
- checked: true,
29
- name: 'FoodLion'
30
- }, {
31
- checked: true,
32
- name: 'GiantFood'
33
- }, {
34
- checked: true,
35
- name: 'TheGiantCompany'
36
- }, {
37
- checked: true,
38
- name: 'Hannaford'
39
- }],
40
- onClick: banners => {
41
- onClickBannersDropdown({
42
- banners
43
- });
44
- }
45
- });
46
- return /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoMainContainer, {
47
- id: "EventInfoMainContainer"
48
- }, /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoContainer, {
49
- id: "EventInfoContainer"
50
- }, /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoTitleContainer, {
51
- id: "EventInfoTitleContainer"
52
- }, /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoTitle, {
53
- id: "EventInfoTitle"
54
- }, title), /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoSubTitle, {
55
- id: "EventInfoSubTitle"
56
- }, "|"), /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoSubTitle, {
57
- id: "EventInfoSubTitle"
58
- }, productsData ? productsData === null || productsData === void 0 ? void 0 : productsData.length : ''), displayBannersDropdown()), /*#__PURE__*/_react.default.createElement(_EventInfo.ProductButtonContainer, {
59
- id: "ProductButtonContainer",
60
- onClick: () => {
61
- setIsProductsListOpen(!IsProductsListOpen);
62
- }
63
- }, IsProductsListOpen ? /*#__PURE__*/_react.default.createElement(_MenuItemUpIcon.MenuItemUpIcon, {
64
- color: "#212121"
65
- }) : /*#__PURE__*/_react.default.createElement(_MenuItemOpenIcon.MenuItemOpenIcon, {
66
- color: "#212121"
67
- }))), IsProductsListOpen && /*#__PURE__*/_react.default.createElement(_EventInfo.EventInfoContentContainer, {
68
- id: "EventInfoContentContainer"
69
- }, /*#__PURE__*/_react.default.createElement(_EventInfo.ProductsTitle, {
70
- id: "ProductsTitle"
71
- }, subTitle), productsData === null || productsData === void 0 ? void 0 : productsData.map(item => /*#__PURE__*/_react.default.createElement(_EventInfo.ProductContainer, {
72
- id: "ProductContainer"
73
- }, /*#__PURE__*/_react.default.createElement(_EventInfo.Product, {
74
- id: "Product"
75
- }, item.label), item.ShowSpotlightProductButton ? /*#__PURE__*/_react.default.createElement(_EventInfo.ProductButtonContainer, {
76
- id: "ProductButtonContainer",
77
- background: "#F8CD00",
78
- onClick: () => {
79
- onSpotlightProductClick({
80
- value: item.value,
81
- label: item.label
82
- });
83
- }
84
- }, /*#__PURE__*/_react.default.createElement(_SpotlightProductIcon.SpotlightProductIcon, null)) : ''))));
85
- };
86
- var _default = exports.default = EventInfo;
87
- EventInfo.defaultProps = {
88
- title: 'Products Variety',
89
- subTitle: 'Product Name',
90
- onSpotlightProductClick: () => {},
91
- onClickBannersDropdown: () => {}
92
- };
@@ -1,20 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.ProductsTitle = exports.ProductContainer = exports.ProductButtonContainer = exports.Product = exports.EventInfoTitleContainer = exports.EventInfoTitle = exports.EventInfoSubTitle = exports.EventInfoMainContainer = exports.EventInfoContentContainer = exports.EventInfoContainer = void 0;
8
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
- var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
11
- const EventInfoMainContainer = exports.EventInfoMainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n position: relative;\n margin: 0;\n padding: 10px;\n border-radius: 12px;\n box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);\n"])));
12
- const EventInfoContainer = exports.EventInfoContainer = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n margin: 0 10px;\n"])));
13
- const EventInfoTitleContainer = exports.EventInfoTitleContainer = _styledComponents.default.div(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n font-size: 20px;\n line-height: 25px;\n display: flex;\n justify-content: flex-start;\n align-items: center;\n margin: 10px;\n gap: 15px;\n"])));
14
- const EventInfoTitle = exports.EventInfoTitle = _styledComponents.default.h3(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 500;\n font-size: 20px;\n\n margin: 0;\n"])));
15
- const EventInfoSubTitle = exports.EventInfoSubTitle = _styledComponents.default.h3(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteral2.default)(["\n color: #757171;\n font-weight: 500;\n font-size: 20px;\n margin: 0;\n"])));
16
- const EventInfoContentContainer = exports.EventInfoContentContainer = _styledComponents.default.div(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteral2.default)(["\n font-family: \"Poppins\", sans-serif;\n font-style: normal;\n font-size: 20px;\n line-height: 25px;\n display: flex;\n justify-content: flex-start;\n flex-direction: column;\n align-items: flex-start;\n margin: 10px;\n padding: 10px 20px 20px 50px;\n"])));
17
- const ProductsTitle = exports.ProductsTitle = _styledComponents.default.h3(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 600;\n font-size: 14px;\n margin: 10px 0;\n"])));
18
- const ProductContainer = exports.ProductContainer = _styledComponents.default.div(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: flex-start;\n align-items: center;\n border-bottom: 1px solid #00000010;\n width: 100%;\n gap: 20px;\n"])));
19
- const Product = exports.Product = _styledComponents.default.h3(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteral2.default)(["\n font-weight: 400;\n font-size: 14px;\n border-radius: 12px;\n"])));
20
- const ProductButtonContainer = exports.ProductButtonContainer = _styledComponents.default.div(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteral2.default)(["\n display: flex;\n justify-content: space-between;\n align-items: center;\n background: ", ";\n border-radius: 12px;\n height: 25px;\n padding: 0 15px;\n user-select: none;\n &:hover {\n background-color: #f0f0f0;\n cursor: pointer;\n }\n gap: 10px;\n"])), props => props.background || '#ffffff');
@@ -1,47 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.default = exports.FilterButton = void 0;
8
- var _react = _interopRequireDefault(require("react"));
9
- var _FilterButton = require("./FilterButton.style");
10
- var _FilterIcon = require("./icons/FilterIcon");
11
- const FilterButton = props => {
12
- const {
13
- color,
14
- height,
15
- buttonText,
16
- iconWidth,
17
- iconHeight,
18
- disabled,
19
- onButtonClick
20
- } = props;
21
- const onClickHandler = event => {
22
- onButtonClick(event);
23
- };
24
- return /*#__PURE__*/_react.default.createElement(_FilterButton.FilterButtonWrapper, {
25
- height: height,
26
- color: color,
27
- disabled: disabled,
28
- onClick: event => {
29
- onClickHandler(event);
30
- }
31
- }, /*#__PURE__*/_react.default.createElement(_FilterIcon.FilterIcon, {
32
- width: iconWidth,
33
- height: iconHeight,
34
- color: color
35
- }), /*#__PURE__*/_react.default.createElement(_FilterButton.SpanText, null, buttonText));
36
- };
37
- exports.FilterButton = FilterButton;
38
- var _default = exports.default = FilterButton;
39
- FilterButton.defaultProps = {
40
- buttonText: 'Filter',
41
- height: '40px',
42
- color: '#212121',
43
- iconHeight: 12,
44
- iconWidth: 12,
45
- disabled: false,
46
- onButtonClick: () => {}
47
- };
@@ -1,12 +0,0 @@
1
- "use strict";
2
-
3
- var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
4
- Object.defineProperty(exports, "__esModule", {
5
- value: true
6
- });
7
- exports.SpanText = exports.FilterButtonWrapper = void 0;
8
- var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
9
- var _styledComponents = _interopRequireDefault(require("styled-components"));
10
- var _templateObject, _templateObject2;
11
- const FilterButtonWrapper = exports.FilterButtonWrapper = _styledComponents.default.button(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n height: ", ";\n font-size: 14px;\n font-weight: 400;\n display: flex;\n gap: 8px;\n align-items: center;\n justify-content: center;\n padding: 8px 18px;\n color: ", ";\n border-radius: 8px;\n border: 1px solid #B1B1B1;\n background: transparent;\n transition: box-shadow 0.3s ease;\n &:hover, &:focus {\n cursor: pointer;\n box-shadow: 5px 5px 10px 0px rgba(0, 0, 0, 0.1);\n }\n"])), props => props.height, props => props.color);
12
- const SpanText = exports.SpanText = _styledComponents.default.span(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n"])));