sag_components 1.0.598 → 1.0.600
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.
- package/dist/stories/CampaignTool/PopupContent.stories.js +284 -0
- package/dist/stories/components/Dropdown.js +0 -6
- package/dist/stories/components/EventInfo.js +92 -0
- package/dist/stories/components/EventInfo.style.js +20 -0
- package/dist/stories/components/FilterButton.js +47 -0
- package/dist/stories/components/FilterButton.style.js +12 -0
- package/dist/stories/components/FilterPanel.js +103 -40
- package/dist/stories/components/RangePicker.js +1 -0
- package/package.json +1 -1
- package/dist/stories/components/TotalCostModal.js +0 -143
|
@@ -0,0 +1,284 @@
|
|
|
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
|
+
};
|
|
@@ -35,7 +35,6 @@ const Dropdown = _ref => {
|
|
|
35
35
|
size,
|
|
36
36
|
text,
|
|
37
37
|
shape,
|
|
38
|
-
autoComplete,
|
|
39
38
|
placeHolder,
|
|
40
39
|
multiSelect,
|
|
41
40
|
showPopupIcon,
|
|
@@ -167,10 +166,6 @@ const Dropdown = _ref => {
|
|
|
167
166
|
|
|
168
167
|
// --------------------------------------- DROPDOWN SINGLE --------------------------------
|
|
169
168
|
const getAutocompleteSingle = () => {
|
|
170
|
-
if (!autoComplete) {
|
|
171
|
-
// Return null or any other placeholder if autoComplete is false
|
|
172
|
-
return null;
|
|
173
|
-
}
|
|
174
169
|
return /*#__PURE__*/_react.default.createElement(_styles.ThemeProvider, {
|
|
175
170
|
theme: theme
|
|
176
171
|
}, /*#__PURE__*/_react.default.createElement(_Autocomplete.default, {
|
|
@@ -182,7 +177,6 @@ const Dropdown = _ref => {
|
|
|
182
177
|
onInputChangeHandler(event, newInputValue);
|
|
183
178
|
},
|
|
184
179
|
disabled: disabled,
|
|
185
|
-
autoComplete: autoComplete,
|
|
186
180
|
disablePortal: true,
|
|
187
181
|
disableClearable: disableClearable,
|
|
188
182
|
defaultValue: defaultValue,
|
|
@@ -0,0 +1,92 @@
|
|
|
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
|
+
};
|
|
@@ -0,0 +1,20 @@
|
|
|
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');
|
|
@@ -0,0 +1,47 @@
|
|
|
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
|
+
};
|
|
@@ -0,0 +1,12 @@
|
|
|
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"])));
|
|
@@ -8,8 +8,10 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
8
8
|
exports.default = void 0;
|
|
9
9
|
var _react = _interopRequireWildcard(require("react"));
|
|
10
10
|
var _Select = require("./Select");
|
|
11
|
-
var
|
|
11
|
+
var _DropdownMulti = require("./DropdownMulti");
|
|
12
|
+
var _Dropdown = require("./Dropdown");
|
|
12
13
|
var _SagButton = _interopRequireDefault(require("./SagButton"));
|
|
14
|
+
var _RangePicker = _interopRequireDefault(require("./RangePicker"));
|
|
13
15
|
var _FilterPanel = require("./FilterPanel.style");
|
|
14
16
|
const FilterPanel = props => {
|
|
15
17
|
const {
|
|
@@ -18,7 +20,7 @@ const FilterPanel = props => {
|
|
|
18
20
|
okButtonBackgroundColor,
|
|
19
21
|
onOkClick,
|
|
20
22
|
onResetClick,
|
|
21
|
-
|
|
23
|
+
onItemValueChanged,
|
|
22
24
|
width,
|
|
23
25
|
height
|
|
24
26
|
} = props;
|
|
@@ -42,77 +44,134 @@ const FilterPanel = props => {
|
|
|
42
44
|
}
|
|
43
45
|
return null;
|
|
44
46
|
};
|
|
47
|
+
const onChangeDatepickerEventHandler = e => {
|
|
48
|
+
console.log('onChangeDatepickerEventHandler', e);
|
|
49
|
+
// const newFieldsDataState = FieldsDataState?.map(
|
|
50
|
+
// (itemField) => (itemField.name === item.name
|
|
51
|
+
// ? {
|
|
52
|
+
// ...itemField,
|
|
53
|
+
// selectedValue: e.newValue,
|
|
54
|
+
// }
|
|
55
|
+
// : itemField),
|
|
56
|
+
// );
|
|
57
|
+
// setFieldsDataState(newFieldsDataState);
|
|
58
|
+
// onItemValueChanged({
|
|
59
|
+
// fieldsData: newFieldsDataState,
|
|
60
|
+
// changedItem: {
|
|
61
|
+
// name: item.name,
|
|
62
|
+
// inputType: item.inputType,
|
|
63
|
+
// value: e.newValue,
|
|
64
|
+
// },
|
|
65
|
+
// });
|
|
66
|
+
};
|
|
67
|
+
|
|
45
68
|
const displayField = item => {
|
|
46
69
|
let content;
|
|
47
70
|
switch (item.inputType) {
|
|
48
71
|
case 'dropdown':
|
|
49
|
-
content = /*#__PURE__*/_react.default.createElement(
|
|
50
|
-
id: "
|
|
72
|
+
content = /*#__PURE__*/_react.default.createElement(_Dropdown.Dropdown, {
|
|
73
|
+
id: "Dropdown",
|
|
51
74
|
name: item.name,
|
|
75
|
+
allowedInput: "all",
|
|
76
|
+
dropdownListfontSize: "14px",
|
|
77
|
+
labelColor: borderColor,
|
|
78
|
+
limitTagsOnMultiSelect: 2,
|
|
79
|
+
onInputChange: () => {},
|
|
80
|
+
shape: "round",
|
|
81
|
+
size: "large",
|
|
82
|
+
text: item.label,
|
|
52
83
|
value: item.selectedValue || undefined,
|
|
53
|
-
errorMessage: "",
|
|
54
|
-
label: item.label,
|
|
55
84
|
required: item.required,
|
|
85
|
+
disabled: item.disabled,
|
|
56
86
|
placeHolder: item.placeHolder,
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => {
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
87
|
+
placeHolderFontSize: "14px",
|
|
88
|
+
onChange: event => {
|
|
89
|
+
var _event$newValue;
|
|
90
|
+
const selectedValue = "".concat(event === null || event === void 0 ? void 0 : (_event$newValue = event.newValue) === null || _event$newValue === void 0 ? void 0 : _event$newValue.label);
|
|
91
|
+
const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => itemField.name === item.name ? {
|
|
92
|
+
...itemField,
|
|
93
|
+
selectedValue: "".concat(selectedValue)
|
|
94
|
+
} : itemField);
|
|
95
|
+
setFieldsDataState(newFieldsDataState);
|
|
96
|
+
onItemValueChanged({
|
|
97
|
+
fieldsData: newFieldsDataState,
|
|
98
|
+
changedItem: {
|
|
99
|
+
name: item.name,
|
|
100
|
+
inputType: item.inputType,
|
|
101
|
+
selectedValue: "".concat(selectedValue)
|
|
102
|
+
}
|
|
68
103
|
});
|
|
104
|
+
},
|
|
105
|
+
options: item.dropdownOptions && item.dropdownOptions.length > 0 ? item.dropdownOptions : [],
|
|
106
|
+
width: "100%"
|
|
107
|
+
});
|
|
108
|
+
break;
|
|
109
|
+
case 'dropdownMulti':
|
|
110
|
+
content = /*#__PURE__*/_react.default.createElement(_DropdownMulti.DropdownMulti, {
|
|
111
|
+
id: "DropdownMulti",
|
|
112
|
+
name: item.name,
|
|
113
|
+
allowedInput: "all",
|
|
114
|
+
dropdownListfontSize: "14px",
|
|
115
|
+
labelColor: borderColor,
|
|
116
|
+
limitTagsOnMultiSelect: 2,
|
|
117
|
+
onInputChange: () => {},
|
|
118
|
+
shape: "round",
|
|
119
|
+
size: "large",
|
|
120
|
+
text: item.label,
|
|
121
|
+
value: item.selectedValue || undefined,
|
|
122
|
+
required: item.required,
|
|
123
|
+
disabled: item.disabled,
|
|
124
|
+
placeHolder: item.placeHolder,
|
|
125
|
+
placeHolderFontSize: "14px",
|
|
126
|
+
onChange: onChangeEvent => {
|
|
127
|
+
var _onChangeEvent$newVal;
|
|
128
|
+
const selectedValue = "".concat(onChangeEvent === null || onChangeEvent === void 0 ? void 0 : (_onChangeEvent$newVal = onChangeEvent.newValue) === null || _onChangeEvent$newVal === void 0 ? void 0 : _onChangeEvent$newVal.map(selectedItem => "'".concat(selectedItem === null || selectedItem === void 0 ? void 0 : selectedItem.label, "'")));
|
|
129
|
+
const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => itemField.name === item.name ? {
|
|
130
|
+
...itemField,
|
|
131
|
+
selectedValue: "".concat(selectedValue)
|
|
132
|
+
} : itemField);
|
|
69
133
|
setFieldsDataState(newFieldsDataState);
|
|
70
|
-
|
|
134
|
+
onItemValueChanged({
|
|
71
135
|
fieldsData: newFieldsDataState,
|
|
72
136
|
changedItem: {
|
|
73
137
|
name: item.name,
|
|
74
138
|
inputType: item.inputType,
|
|
75
|
-
|
|
76
|
-
label: findOptionLabel(item.dropdownOptions, onChangeEvent.target.value)
|
|
139
|
+
selectedValue: "".concat(selectedValue)
|
|
77
140
|
}
|
|
78
141
|
});
|
|
79
142
|
},
|
|
80
143
|
options: item.dropdownOptions && item.dropdownOptions.length > 0 ? item.dropdownOptions : [],
|
|
81
|
-
height: "52px",
|
|
82
144
|
width: "100%"
|
|
83
145
|
});
|
|
84
146
|
break;
|
|
85
147
|
case 'datepicker':
|
|
86
148
|
content = /*#__PURE__*/_react.default.createElement(_FilterPanel.DatePickerContainer, {
|
|
87
149
|
id: "DatePickerContainer"
|
|
88
|
-
}, /*#__PURE__*/_react.default.createElement(
|
|
89
|
-
id: "Datepicker",
|
|
90
|
-
name: item.name,
|
|
91
|
-
value: item.selectedValue || undefined,
|
|
92
|
-
required: item.required,
|
|
93
|
-
placeholder: item.placeHolder,
|
|
150
|
+
}, /*#__PURE__*/_react.default.createElement(_RangePicker.default, {
|
|
94
151
|
borderColor: borderColor,
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
onChange:
|
|
152
|
+
borderRadius: "12px",
|
|
153
|
+
label: item.label,
|
|
154
|
+
onChange: onChangeEvent => {
|
|
155
|
+
console.log('DatePickerContainer', onChangeEvent);
|
|
156
|
+
const selectedValue = "".concat(onChangeEvent);
|
|
98
157
|
const newFieldsDataState = FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => itemField.name === item.name ? {
|
|
99
158
|
...itemField,
|
|
100
|
-
selectedValue:
|
|
159
|
+
selectedValue: "".concat(selectedValue)
|
|
101
160
|
} : itemField);
|
|
102
161
|
setFieldsDataState(newFieldsDataState);
|
|
103
|
-
|
|
162
|
+
onItemValueChanged({
|
|
104
163
|
fieldsData: newFieldsDataState,
|
|
105
164
|
changedItem: {
|
|
106
165
|
name: item.name,
|
|
107
166
|
inputType: item.inputType,
|
|
108
|
-
|
|
167
|
+
selectedValue: "".concat(selectedValue)
|
|
109
168
|
}
|
|
110
169
|
});
|
|
111
170
|
},
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
171
|
+
required: item.required,
|
|
172
|
+
placeholder: item.placeHolder,
|
|
173
|
+
width: "100%",
|
|
174
|
+
height: "55px"
|
|
116
175
|
}));
|
|
117
176
|
break;
|
|
118
177
|
default:
|
|
@@ -145,7 +204,7 @@ const FilterPanel = props => {
|
|
|
145
204
|
borderColor: borderColor,
|
|
146
205
|
onClickColor: "#B1B1B1",
|
|
147
206
|
radius: "12px",
|
|
148
|
-
text: "
|
|
207
|
+
text: "Go",
|
|
149
208
|
height: "45px",
|
|
150
209
|
width: "74px",
|
|
151
210
|
fontSize: "14px",
|
|
@@ -153,7 +212,11 @@ const FilterPanel = props => {
|
|
|
153
212
|
disabled: false,
|
|
154
213
|
onClick: () => onOkClick({
|
|
155
214
|
eventName: 'onOkClick',
|
|
156
|
-
fieldsData: FieldsDataState
|
|
215
|
+
fieldsData: FieldsDataState,
|
|
216
|
+
selectedValues: FieldsDataState === null || FieldsDataState === void 0 ? void 0 : FieldsDataState.map(itemField => ({
|
|
217
|
+
name: itemField.name,
|
|
218
|
+
selectedValue: itemField.selectedValue
|
|
219
|
+
}))
|
|
157
220
|
})
|
|
158
221
|
}), /*#__PURE__*/_react.default.createElement(_SagButton.default, {
|
|
159
222
|
textColor: "#212121",
|
|
@@ -179,5 +242,5 @@ FilterPanel.defaultProps = {
|
|
|
179
242
|
borderColor: '#066768',
|
|
180
243
|
onOkClick: () => {},
|
|
181
244
|
onResetClick: () => {},
|
|
182
|
-
|
|
245
|
+
onItemValueChanged: () => {}
|
|
183
246
|
};
|
|
@@ -42,6 +42,7 @@ const RangePicker = _ref => {
|
|
|
42
42
|
setIsFocused(false);
|
|
43
43
|
setStartDateValue(startDate);
|
|
44
44
|
setEndDateValue(endDate);
|
|
45
|
+
onChange("".concat((0, _moment.default)(startDate).format('DD/MM/YYYY'), " - ").concat((0, _moment.default)(endDate).format('DD/MM/YYYY')));
|
|
45
46
|
setValue("".concat((0, _moment.default)(startDate).format('DD/MM/YYYY'), " - ").concat((0, _moment.default)(endDate).format('DD/MM/YYYY')));
|
|
46
47
|
}
|
|
47
48
|
};
|
package/package.json
CHANGED
|
@@ -1,143 +0,0 @@
|
|
|
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;
|