sag_components 1.0.1068 → 1.0.1069
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/Button.test.js +10 -10
- package/dist/LinkButton.test.js +10 -10
- package/dist/SingleBar.test.js +2 -2
- package/dist/index.js +1 -1
- package/dist/setupTests.js +1 -3
- package/dist/stories/CampaignTool/PopupContent.stories.js +284 -0
- package/dist/stories/components/BannerEventBoxTest.js +42 -0
- package/dist/stories/components/BannerEventBoxTest.style.js +11 -0
- package/dist/stories/components/CampaignTool/Card.style.js +0 -2
- package/dist/stories/components/CampaignTool/MultipleCard.style.js +0 -2
- package/dist/stories/components/CampaignTool/PopupFieldsRules.js +44 -44
- package/dist/stories/components/CampaignTool/Table.style.js +0 -2
- package/dist/stories/components/FilterButton.js +53 -0
- package/dist/stories/components/FilterButton.style.js +12 -0
- package/dist/stories/components/LinnerDataBox.js +1 -0
- package/dist/stories/components/Modal.style.js +0 -2
- package/dist/stories/components/NewInput.js +33 -0
- package/dist/stories/components/NewInput.style.js +13 -0
- package/dist/stories/components/QuickFilterDropdownMultiSelection.js +1 -1
- package/dist/stories/components/QuickFilterDropdownSingle.js +1 -1
- package/dist/stories/components/QuickFilterDropdownSingle.style.js +13 -13
- package/dist/stories/components/ReportTable.js +6 -6
- package/dist/stories/components/ReportTable.style.js +2 -2
- package/dist/stories/components/SalesSplit.js +153 -0
- package/dist/stories/components/SalesSplit.style.js +150 -0
- package/dist/stories/components/SingleBarLineCharts.js +137 -56
- package/dist/stories/components/TabMenu.style.js +1 -2
- package/dist/stories/components/TotalBenchmark.style.js +0 -2
- package/dist/stories/components/icons/TheGiantCompanyIcon_old.js +1831 -0
- package/dist/stories/utils/IconsHandler.style.js +0 -1
- package/dist/vite.config.js +15 -0
- package/package.json +1 -1
package/dist/Button.test.js
CHANGED
|
@@ -10,7 +10,7 @@ require("@testing-library/jest-dom");
|
|
|
10
10
|
/* eslint-disable no-undef */
|
|
11
11
|
|
|
12
12
|
test('Button Check text', () => {
|
|
13
|
-
(0, _react2.render)(
|
|
13
|
+
(0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
14
14
|
text: "test",
|
|
15
15
|
type: "primary",
|
|
16
16
|
size: "small",
|
|
@@ -24,7 +24,7 @@ test('Button Check text', () => {
|
|
|
24
24
|
test('Button Check type functionality: when "primary" type selected then background color must be specified as "rgb(146, 207, 23)" ', () => {
|
|
25
25
|
const {
|
|
26
26
|
container
|
|
27
|
-
} = (0, _react2.render)(
|
|
27
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
28
28
|
text: "Button",
|
|
29
29
|
type: "primary",
|
|
30
30
|
size: "small",
|
|
@@ -40,7 +40,7 @@ test('Button Check type functionality: when "primary" type selected then backgro
|
|
|
40
40
|
test('Button Check type functionality: when "secondary" type selected then background color must be specified as "rgb(232, 245, 235)" ', () => {
|
|
41
41
|
const {
|
|
42
42
|
container
|
|
43
|
-
} = (0, _react2.render)(
|
|
43
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
44
44
|
text: "Button",
|
|
45
45
|
type: "secondary",
|
|
46
46
|
size: "small",
|
|
@@ -56,7 +56,7 @@ test('Button Check type functionality: when "secondary" type selected then backg
|
|
|
56
56
|
test('Button Check disabled functionality: when disabled prop is true, button textColor should be "rgb(177, 177, 177)" ', () => {
|
|
57
57
|
const {
|
|
58
58
|
container
|
|
59
|
-
} = (0, _react2.render)(
|
|
59
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
60
60
|
text: "Button",
|
|
61
61
|
type: "primary",
|
|
62
62
|
size: "small",
|
|
@@ -72,7 +72,7 @@ test('Button Check disabled functionality: when disabled prop is true, button te
|
|
|
72
72
|
test('Button Check leftIcon functionality: when "Filter" icons is specified as the leftIcon props, it should be rendered on the screen', () => {
|
|
73
73
|
const {
|
|
74
74
|
container
|
|
75
|
-
} = (0, _react2.render)(
|
|
75
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
76
76
|
text: "Button",
|
|
77
77
|
type: "primary",
|
|
78
78
|
size: "small",
|
|
@@ -86,7 +86,7 @@ test('Button Check leftIcon functionality: when "Filter" icons is specified as
|
|
|
86
86
|
test('Button Check rightIcon functionality: when "Exit" icons is specified as the rightIcon props, it should be rendered on the screen', () => {
|
|
87
87
|
const {
|
|
88
88
|
container
|
|
89
|
-
} = (0, _react2.render)(
|
|
89
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
90
90
|
text: "Button",
|
|
91
91
|
type: "primary",
|
|
92
92
|
size: "small",
|
|
@@ -100,7 +100,7 @@ test('Button Check rightIcon functionality: when "Exit" icons is specified as th
|
|
|
100
100
|
test('Button Check leftIcon and rightIcon functionality: when "Filter" and "Exit" icons is specified as the leftIcon and rightIcon props, it should be rendered on the screen', () => {
|
|
101
101
|
const {
|
|
102
102
|
container
|
|
103
|
-
} = (0, _react2.render)(
|
|
103
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
104
104
|
text: "Button",
|
|
105
105
|
type: "primary",
|
|
106
106
|
size: "small",
|
|
@@ -116,7 +116,7 @@ test('Button Check leftIcon and rightIcon functionality: when "Filter" and "Exit
|
|
|
116
116
|
test('Button Check small/medium functionality: when "small" the height must be "33px" ', () => {
|
|
117
117
|
const {
|
|
118
118
|
container
|
|
119
|
-
} = (0, _react2.render)(
|
|
119
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
120
120
|
text: "Button",
|
|
121
121
|
type: "primary",
|
|
122
122
|
size: "small",
|
|
@@ -132,7 +132,7 @@ test('Button Check small/medium functionality: when "small" the height must be "
|
|
|
132
132
|
test('Button Check small/medium functionality: when "medium" the height must be "45px" ', () => {
|
|
133
133
|
const {
|
|
134
134
|
container
|
|
135
|
-
} = (0, _react2.render)(
|
|
135
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
136
136
|
text: "Button",
|
|
137
137
|
type: "primary",
|
|
138
138
|
size: "medium",
|
|
@@ -146,7 +146,7 @@ test('Button Check small/medium functionality: when "medium" the height must be
|
|
|
146
146
|
test('Button Check specific height and width functionality: when height = 100px and width = 200px it should override small/medium functionality ', () => {
|
|
147
147
|
const {
|
|
148
148
|
container
|
|
149
|
-
} = (0, _react2.render)(
|
|
149
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_Button.default, {
|
|
150
150
|
text: "Button",
|
|
151
151
|
type: "primary",
|
|
152
152
|
size: "small",
|
package/dist/LinkButton.test.js
CHANGED
|
@@ -10,7 +10,7 @@ require("@testing-library/jest-dom");
|
|
|
10
10
|
/* eslint-disable no-undef */
|
|
11
11
|
|
|
12
12
|
test('LinkButton Check text', () => {
|
|
13
|
-
(0, _react2.render)(
|
|
13
|
+
(0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
14
14
|
text: "test",
|
|
15
15
|
type: "secondary",
|
|
16
16
|
size: "small",
|
|
@@ -22,7 +22,7 @@ test('LinkButton Check text', () => {
|
|
|
22
22
|
test('LinkButton Check type functionality: when "primary" type selected then text color must be specified as "rgb(146, 207, 23)" ', () => {
|
|
23
23
|
const {
|
|
24
24
|
container
|
|
25
|
-
} = (0, _react2.render)(
|
|
25
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
26
26
|
text: "LinkButton",
|
|
27
27
|
type: "primary",
|
|
28
28
|
size: "small",
|
|
@@ -36,7 +36,7 @@ test('LinkButton Check type functionality: when "primary" type selected then tex
|
|
|
36
36
|
test('LinkButton Check type functionality: when "secondary" type selected then background color must be specified as "rgb(232, 245, 235)" ', () => {
|
|
37
37
|
const {
|
|
38
38
|
container
|
|
39
|
-
} = (0, _react2.render)(
|
|
39
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
40
40
|
text: "LinkButton",
|
|
41
41
|
type: "secondary",
|
|
42
42
|
size: "small",
|
|
@@ -50,7 +50,7 @@ test('LinkButton Check type functionality: when "secondary" type selected then b
|
|
|
50
50
|
test('LinkButton Check disabled functionality: when disabled prop is true, button textColor should be "rgb(177, 177, 177)" ', () => {
|
|
51
51
|
const {
|
|
52
52
|
container
|
|
53
|
-
} = (0, _react2.render)(
|
|
53
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
54
54
|
text: "LinkButton",
|
|
55
55
|
type: "primary",
|
|
56
56
|
size: "small",
|
|
@@ -64,7 +64,7 @@ test('LinkButton Check disabled functionality: when disabled prop is true, butto
|
|
|
64
64
|
test('LinkButton Check leftIcon and rightIcon functionality: when "Filter" and "Exit" icons is specified as the leftIcon and rightIcon props, it should be rendered on the screen', () => {
|
|
65
65
|
const {
|
|
66
66
|
container
|
|
67
|
-
} = (0, _react2.render)(
|
|
67
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
68
68
|
text: "LinkButton",
|
|
69
69
|
type: "primary",
|
|
70
70
|
size: "small",
|
|
@@ -80,7 +80,7 @@ test('LinkButton Check leftIcon and rightIcon functionality: when "Filter" and "
|
|
|
80
80
|
test('LinkButton Check rightIcon functionality: when "Exit" icons is specified as the rightIcon props, it should be rendered on the screen', () => {
|
|
81
81
|
const {
|
|
82
82
|
container
|
|
83
|
-
} = (0, _react2.render)(
|
|
83
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
84
84
|
text: "LinkButton",
|
|
85
85
|
type: "primary",
|
|
86
86
|
size: "small",
|
|
@@ -93,7 +93,7 @@ test('LinkButton Check rightIcon functionality: when "Exit" icons is specified a
|
|
|
93
93
|
test('LinkButton Check leftIcon functionality: when "Filter" icons is specified as the leftIcon props, it should be rendered on the screen', () => {
|
|
94
94
|
const {
|
|
95
95
|
container
|
|
96
|
-
} = (0, _react2.render)(
|
|
96
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
97
97
|
text: "LinkButton",
|
|
98
98
|
type: "primary",
|
|
99
99
|
size: "small",
|
|
@@ -106,7 +106,7 @@ test('LinkButton Check leftIcon functionality: when "Filter" icons is specified
|
|
|
106
106
|
test('LinkButton Check small/medium functionality: when "small" the font-size must be "14px" ', () => {
|
|
107
107
|
const {
|
|
108
108
|
container
|
|
109
|
-
} = (0, _react2.render)(
|
|
109
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
110
110
|
text: "LinkButton",
|
|
111
111
|
type: "primary",
|
|
112
112
|
size: "small",
|
|
@@ -120,7 +120,7 @@ test('LinkButton Check small/medium functionality: when "small" the font-size mu
|
|
|
120
120
|
test('LinkButton Check small/medium functionality: when "medium" the font-size must be "16px" ', () => {
|
|
121
121
|
const {
|
|
122
122
|
container
|
|
123
|
-
} = (0, _react2.render)(
|
|
123
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
124
124
|
text: "LinkButton",
|
|
125
125
|
type: "primary",
|
|
126
126
|
size: "medium",
|
|
@@ -134,7 +134,7 @@ test('LinkButton Check small/medium functionality: when "medium" the font-size m
|
|
|
134
134
|
test('LinkButton Check specific height and width functionality: when height = 100px and width = 200px it should override small/medium functionality ', () => {
|
|
135
135
|
const {
|
|
136
136
|
container
|
|
137
|
-
} = (0, _react2.render)(
|
|
137
|
+
} = (0, _react2.render)(/*#__PURE__*/_react.default.createElement(_LinkButton.default, {
|
|
138
138
|
text: "LinkButton",
|
|
139
139
|
type: "primary",
|
|
140
140
|
size: "small",
|
package/dist/SingleBar.test.js
CHANGED
|
@@ -45,7 +45,7 @@ const legendData1 = [{
|
|
|
45
45
|
title: 'Incremental Sales ROI'
|
|
46
46
|
}];
|
|
47
47
|
test('SingleBarLineCharts Check if title data is rendered', async () => {
|
|
48
|
-
(0, _react2.render)(
|
|
48
|
+
(0, _react2.render)(/*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.default, {
|
|
49
49
|
width: "100%",
|
|
50
50
|
height: "100%",
|
|
51
51
|
title: "Total Cost Sales",
|
|
@@ -82,7 +82,7 @@ test('SingleBarLineCharts Check if title data is rendered', async () => {
|
|
|
82
82
|
expect(total2Element).toBeInTheDocument();
|
|
83
83
|
});
|
|
84
84
|
test('SingleBarLineCharts Check if legend data is rendered', async () => {
|
|
85
|
-
(0, _react2.render)(
|
|
85
|
+
(0, _react2.render)(/*#__PURE__*/_react.default.createElement(_SingleBarLineCharts.default, {
|
|
86
86
|
width: "100%",
|
|
87
87
|
height: "100%",
|
|
88
88
|
title: "Total Cost Sales",
|
package/dist/index.js
CHANGED
|
@@ -8,7 +8,7 @@ var _App = _interopRequireDefault(require("./App"));
|
|
|
8
8
|
// eslint-disable-next-line import/no-extraneous-dependencies
|
|
9
9
|
|
|
10
10
|
const root = _client.default.createRoot(document.getElementById('root'));
|
|
11
|
-
root.render(
|
|
11
|
+
root.render(/*#__PURE__*/_react.default.createElement(_react.default.StrictMode, null, /*#__PURE__*/_react.default.createElement(_App.default, null)));
|
|
12
12
|
|
|
13
13
|
// If you want to start measuring performance in your app, pass a function
|
|
14
14
|
// to log results (for example: reportWebVitals(console.log))
|
package/dist/setupTests.js
CHANGED
|
@@ -3,9 +3,7 @@
|
|
|
3
3
|
require("@testing-library/jest-dom");
|
|
4
4
|
// src/setupTests.js
|
|
5
5
|
|
|
6
|
-
|
|
7
|
-
|
|
8
|
-
global.ResizeObserver = class {
|
|
6
|
+
globalThis.ResizeObserver = class {
|
|
9
7
|
// eslint-disable-next-line class-methods-use-this
|
|
10
8
|
observe() {}
|
|
11
9
|
|
|
@@ -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
|
+
};
|
|
@@ -0,0 +1,42 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.default = void 0;
|
|
9
|
+
var _react = _interopRequireWildcard(require("react"));
|
|
10
|
+
var _BannerEventBoxTest = require("./BannerEventBoxTest.style");
|
|
11
|
+
var _BannerEventBox = _interopRequireDefault(require("./BannerEventBox"));
|
|
12
|
+
const BannerEventBoxTest = props => {
|
|
13
|
+
const {
|
|
14
|
+
width,
|
|
15
|
+
height
|
|
16
|
+
} = props;
|
|
17
|
+
return /*#__PURE__*/_react.default.createElement(_BannerEventBoxTest.MainContainer, {
|
|
18
|
+
width: width,
|
|
19
|
+
height: height
|
|
20
|
+
}, /*#__PURE__*/_react.default.createElement(_BannerEventBox.default, {
|
|
21
|
+
banner: "Stop&Shop"
|
|
22
|
+
}), /*#__PURE__*/_react.default.createElement(_BannerEventBox.default, {
|
|
23
|
+
banner: "Hannaford",
|
|
24
|
+
data: [{
|
|
25
|
+
name: 'asdf',
|
|
26
|
+
items: ['coca', 'haim']
|
|
27
|
+
}, {
|
|
28
|
+
name: 'Brazxcvnds',
|
|
29
|
+
items: ['coca', 'bola', 'spring', 'cola']
|
|
30
|
+
}, {
|
|
31
|
+
name: 'xcvb Lines',
|
|
32
|
+
items: ['spring']
|
|
33
|
+
}]
|
|
34
|
+
}), /*#__PURE__*/_react.default.createElement(_BannerEventBox.default, {
|
|
35
|
+
banner: "Giant Food"
|
|
36
|
+
}));
|
|
37
|
+
};
|
|
38
|
+
BannerEventBoxTest.defaultProps = {
|
|
39
|
+
width: 'auto',
|
|
40
|
+
height: 'auto'
|
|
41
|
+
};
|
|
42
|
+
var _default = exports.default = BannerEventBoxTest;
|
|
@@ -0,0 +1,11 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports.MainContainer = void 0;
|
|
8
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
9
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
10
|
+
var _templateObject;
|
|
11
|
+
const MainContainer = exports.MainContainer = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: ", ";\n height: ", ";\n display: flex;\n gap: 20px;\n"])), props => props.width, props => props.height);
|
|
@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.SegmentsContainer = exports.Segment = exports.CardTitle = exports.CardFrame = exports.CardDetails = exports.CardDetailText = exports.ButtonWrap = exports.Button = void 0;
|
|
8
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
/* eslint-disable import/prefer-default-export */
|
|
10
|
-
|
|
11
9
|
const CardFrame = exports.CardFrame = _styledComponents.default.div`
|
|
12
10
|
font-family: "Poppins", sans-serif;
|
|
13
11
|
background-color: white;
|
|
@@ -6,8 +6,6 @@ Object.defineProperty(exports, "__esModule", {
|
|
|
6
6
|
});
|
|
7
7
|
exports.CardsWrapper = void 0;
|
|
8
8
|
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
9
|
-
/* eslint-disable import/prefer-default-export */
|
|
10
|
-
|
|
11
9
|
const CardsWrapper = exports.CardsWrapper = _styledComponents.default.div`
|
|
12
10
|
font-family: "Poppins", sans-serif;
|
|
13
11
|
width: ${props => props.width};
|