contentoh-components-library 21.4.125 → 21.4.127
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/components/atoms/GeneralInput/index.js +5 -2
- package/dist/components/atoms/GeneralInput/style.js +29 -0
- package/dist/components/molecules/GalleryElement/index.js +17 -0
- package/dist/components/molecules/GalleryHeader/index.js +3 -0
- package/dist/components/molecules/GridItem/index.js +11 -12
- package/dist/components/molecules/GridItem/styles.js +24 -3
- package/dist/components/molecules/TagAndInput/index.js +4 -0
- package/dist/components/organisms/GridProducts/GridProducts.stories.js +834 -5
- package/dist/components/organisms/InputGroup/index.js +180 -54
- package/dist/components/organisms/InputGroup/styles.js +1 -1
- package/dist/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +73 -58
- package/dist/components/pages/ProviderProductEdition/index.js +108 -77
- package/package.json +1 -1
- package/src/components/atoms/GeneralInput/index.js +3 -0
- package/src/components/molecules/GalleryElement/index.js +13 -1
- package/src/components/molecules/GalleryHeader/index.js +1 -0
- package/src/components/molecules/GridItem/index.js +10 -11
- package/src/components/molecules/GridItem/styles.js +25 -0
- package/src/components/molecules/TagAndInput/index.js +2 -1
- package/src/components/organisms/GridProducts/GridProducts.stories.js +955 -12
- package/src/components/organisms/InputGroup/index.js +189 -63
- package/src/components/organisms/InputGroup/styles.js +31 -0
- package/src/components/organisms/Table/index.js +1 -3
- package/src/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +94 -75
- package/src/components/pages/ProviderProductEdition/index.js +30 -4
|
@@ -140,6 +140,7 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
140
140
|
return onHandleChange(e);
|
|
141
141
|
},
|
|
142
142
|
defaultValue: textValue.value,
|
|
143
|
+
disabled: disabled,
|
|
143
144
|
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("option", {
|
|
144
145
|
value: "",
|
|
145
146
|
children: description
|
|
@@ -154,7 +155,8 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
154
155
|
onChange: function onChange(e) {
|
|
155
156
|
return onHandleChange(e);
|
|
156
157
|
},
|
|
157
|
-
defaultChecked: textValue.value === "true" ? true : false
|
|
158
|
+
defaultChecked: textValue.value === "true" ? true : false,
|
|
159
|
+
disabled: disabled
|
|
158
160
|
}) : inputType !== "textarea" ? /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
159
161
|
type: inputType,
|
|
160
162
|
disabled: disabled,
|
|
@@ -180,7 +182,8 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
180
182
|
updatedDescriptions: updatedDescriptions,
|
|
181
183
|
setUpdatedDescriptions: setUpdatedDescriptions,
|
|
182
184
|
maxChar: maxChar,
|
|
183
|
-
isRequired: isRequired
|
|
185
|
+
isRequired: isRequired,
|
|
186
|
+
disabled: disabled
|
|
184
187
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
|
|
185
188
|
children: description
|
|
186
189
|
})]
|
|
@@ -0,0 +1,29 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;
|
|
4
|
+
|
|
5
|
+
Object.defineProperty(exports, "__esModule", {
|
|
6
|
+
value: true
|
|
7
|
+
});
|
|
8
|
+
exports.Container = void 0;
|
|
9
|
+
|
|
10
|
+
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
11
|
+
|
|
12
|
+
var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
13
|
+
|
|
14
|
+
var _variables = require("../../../global-files/variables");
|
|
15
|
+
|
|
16
|
+
var _templateObject;
|
|
17
|
+
|
|
18
|
+
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n\n > div {\n label {\n &:before {\n outline: 1px solid ", ";\n }\n }\n }\n\n input,\n textarea {\n width: 100%;\n border: 1px solid\n ", ";\n\n font-family: ", ";\n color: ", ";\n font-weight: normal;\n font-size: 12px;\n line-height: 15px;\n padding: 10px;\n outline: none;\n border-radius: 2px;\n resize: none;\n\n &:focus {\n border: 1px solid ", ";\n }\n }\n\n select {\n background: #fafafa;\n outline: none;\n border: 1px solid\n ", ";\n width: 100%;\n cursor: pointer;\n font-family: ", ";\n color: ", ";\n font-size: 12px;\n line-height: 21px;\n padding: 10px;\n border-right: 2px solid #e33aa9;\n\n &:focus {\n border: 1px solid ", ";\n }\n }\n\n p {\n font-family: ", ";\n font-size: 12px;\n color: ", ";\n }\n\n &.audit-class {\n input,\n .quill {\n border: 1px solid #8a6caa;\n background-color: #ededfc;\n }\n }\n"])), function (_ref) {
|
|
19
|
+
var isRequired = _ref.isRequired;
|
|
20
|
+
return isRequired ? "red" : "none";
|
|
21
|
+
}, function (_ref2) {
|
|
22
|
+
var isRequired = _ref2.isRequired;
|
|
23
|
+
return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
|
|
24
|
+
}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, function (_ref3) {
|
|
25
|
+
var isRequired = _ref3.isRequired;
|
|
26
|
+
return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
|
|
27
|
+
}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.deep_gray, _variables.GlobalColors.magenta_s2, _variables.FontFamily.Raleway, _variables.GlobalColors.deep_gray);
|
|
28
|
+
|
|
29
|
+
exports.Container = Container;
|
|
@@ -23,6 +23,10 @@ var _react = require("react");
|
|
|
23
23
|
|
|
24
24
|
var _Select = _interopRequireDefault(require("../../atoms/Select"));
|
|
25
25
|
|
|
26
|
+
var _rejectIcon = _interopRequireDefault(require("../../../assets/images/generalButton/rejectIcon.svg"));
|
|
27
|
+
|
|
28
|
+
var _acceptIcon = _interopRequireDefault(require("../../../assets/images/generalButton/acceptIcon.svg"));
|
|
29
|
+
|
|
26
30
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
27
31
|
|
|
28
32
|
var GalleryElement = function GalleryElement(_ref) {
|
|
@@ -162,6 +166,19 @@ var GalleryElement = function GalleryElement(_ref) {
|
|
|
162
166
|
index: number
|
|
163
167
|
});
|
|
164
168
|
}
|
|
169
|
+
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
|
|
170
|
+
style: {
|
|
171
|
+
width: "10px"
|
|
172
|
+
},
|
|
173
|
+
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
174
|
+
style: {
|
|
175
|
+
height: 15,
|
|
176
|
+
width: 15,
|
|
177
|
+
objectFit: "scale-down"
|
|
178
|
+
},
|
|
179
|
+
src: _rejectIcon.default,
|
|
180
|
+
alt: ""
|
|
181
|
+
})
|
|
165
182
|
})]
|
|
166
183
|
})]
|
|
167
184
|
})]
|
|
@@ -36,21 +36,17 @@ var GridItem = function GridItem(_ref) {
|
|
|
36
36
|
gridElement = _ref$gridElement === void 0 ? {} : _ref$gridElement,
|
|
37
37
|
product = _ref.product,
|
|
38
38
|
id = _ref.id,
|
|
39
|
-
isMerchans = _ref.isMerchans,
|
|
39
|
+
_ref$isMerchans = _ref.isMerchans,
|
|
40
|
+
isMerchans = _ref$isMerchans === void 0 ? false : _ref$isMerchans,
|
|
40
41
|
chkOnChange = _ref.chkOnChange,
|
|
41
42
|
onGridClick = _ref.onGridClick,
|
|
42
43
|
chkChecked = _ref.chkChecked,
|
|
43
44
|
index = _ref.index;
|
|
44
|
-
var
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
status = _gridElement$status === void 0 ? [] : _gridElement$status,
|
|
50
|
-
_gridElement$catalogs = gridElement.catalogs,
|
|
51
|
-
catalogs = _gridElement$catalogs === void 0 ? {} : _gridElement$catalogs,
|
|
52
|
-
_gridElement$observat = gridElement.observations,
|
|
53
|
-
observations = _gridElement$observat === void 0 ? [] : _gridElement$observat;
|
|
45
|
+
var images = gridElement.images,
|
|
46
|
+
info = gridElement.info,
|
|
47
|
+
status = gridElement.status,
|
|
48
|
+
catalogs = gridElement.catalogs,
|
|
49
|
+
observations = gridElement.observations;
|
|
54
50
|
|
|
55
51
|
var getSrvName = function getSrvName(srv) {
|
|
56
52
|
switch (srv) {
|
|
@@ -102,7 +98,7 @@ var GridItem = function GridItem(_ref) {
|
|
|
102
98
|
})
|
|
103
99
|
}), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
|
|
104
100
|
className: "status-slider",
|
|
105
|
-
children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("figure", {
|
|
101
|
+
children: [product.observations && /*#__PURE__*/(0, _jsxRuntime.jsx)("figure", {
|
|
106
102
|
children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
107
103
|
style: {
|
|
108
104
|
height: 15,
|
|
@@ -112,6 +108,9 @@ var GridItem = function GridItem(_ref) {
|
|
|
112
108
|
src: product.observations !== null && product.observations !== "" ? _highPriority.default : _lowPriority.default,
|
|
113
109
|
alt: ""
|
|
114
110
|
})
|
|
111
|
+
}), product.reviewState && /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.StateReview, {
|
|
112
|
+
backgroundColor: "".concat(product.reviewState),
|
|
113
|
+
children: product.reviewState
|
|
115
114
|
}), status === null || status === void 0 ? void 0 : status.map(function (_ref2) {
|
|
116
115
|
var title = _ref2.title,
|
|
117
116
|
value = _ref2.value,
|
|
@@ -5,7 +5,7 @@ var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefau
|
|
|
5
5
|
Object.defineProperty(exports, "__esModule", {
|
|
6
6
|
value: true
|
|
7
7
|
});
|
|
8
|
-
exports.Container = void 0;
|
|
8
|
+
exports.StateReview = exports.Container = void 0;
|
|
9
9
|
|
|
10
10
|
var _taggedTemplateLiteral2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/taggedTemplateLiteral"));
|
|
11
11
|
|
|
@@ -13,8 +13,29 @@ var _styledComponents = _interopRequireDefault(require("styled-components"));
|
|
|
13
13
|
|
|
14
14
|
var _variables = require("../../../global-files/variables");
|
|
15
15
|
|
|
16
|
-
var _templateObject;
|
|
16
|
+
var _templateObject, _templateObject2;
|
|
17
17
|
|
|
18
18
|
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 175px;\n border: 1px solid #f0f0f0;\n position: relative;\n height: fit-content;\n\n .chk-container {\n position: absolute;\n top: 5px;\n left: 5px;\n z-index: 5;\n height: 16px;\n }\n\n .data-body {\n padding: 10px;\n border-bottom: 1px solid #f0f0f0;\n\n & > h3,\n & > p {\n color: #262626;\n font-family: ", ";\n font-size: 12px;\n line-height: 16px;\n overflow: hidden;\n white-space: nowrap;\n text-overflow: ellipsis;\n\n & + p {\n margin-top: 5px;\n }\n }\n p {\n font-size: 10px;\n line-height: 12px;\n color: #808080;\n }\n }\n\n .status-slider {\n display: flex;\n padding: 5px 10px;\n overflow: auto;\n border-bottom: 1px solid #f0f0f0;\n flex-wrap: nowrap;\n\n .status-element {\n display: flex;\n\n .srv-name {\n background-color: #808080;\n padding: 0 10px;\n border-radius: 5px;\n p {\n font-family: ", ";\n font-size: 12px;\n line-height: 20px;\n font-weight: 700;\n color: #fff;\n }\n }\n }\n\n * + * {\n margin-left: 10px;\n }\n }\n\n .cart-and-raiting,\n .retailers-and-user {\n display: flex;\n align-items: center;\n justify-content: space-between;\n padding: 5px 10px;\n .star-button {\n button {\n padding: 3px;\n color: transparent;\n -webkit-text-stroke: 1px #808080;\n }\n }\n }\n\n .retailers-and-user {\n padding: 0;\n > * {\n flex: 1 0 50%;\n display: flex;\n padding: 5px;\n height: 36px;\n }\n .retailers-container {\n border-right: 1px solid #f0f0f0;\n }\n }\n\n &:hover {\n cursor: pointer;\n box-shadow: 1px 2px 5px black;\n }\n"])), _variables.FontFamily.Lato, _variables.FontFamily.AvenirNext);
|
|
19
19
|
|
|
20
|
-
exports.Container = Container;
|
|
20
|
+
exports.Container = Container;
|
|
21
|
+
|
|
22
|
+
var StateReview = _styledComponents.default.div(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteral2.default)(["\n background: ", ";\n display: inline-block;\n padding: 0 10px;\n border-radius: 5px;\n font-family: ", ";\n font-weight: 600;\n font-size: 12px;\n line-height: 20px;\n color: white;\n"])), function (props) {
|
|
23
|
+
switch (props.backgroundColor) {
|
|
24
|
+
case "rejected_to_provider":
|
|
25
|
+
return "#d90202";
|
|
26
|
+
|
|
27
|
+
case "approved":
|
|
28
|
+
return "#28e602";
|
|
29
|
+
|
|
30
|
+
case "in_progress":
|
|
31
|
+
return "rgb(24, 160, 251)";
|
|
32
|
+
|
|
33
|
+
case "onboarding_flow":
|
|
34
|
+
return "#e6b802";
|
|
35
|
+
|
|
36
|
+
default:
|
|
37
|
+
return "gray";
|
|
38
|
+
}
|
|
39
|
+
}, _variables.FontFamily.Lato);
|
|
40
|
+
|
|
41
|
+
exports.StateReview = StateReview;
|
|
@@ -19,6 +19,10 @@ var _index2 = require("../../atoms/GeneralInput/index");
|
|
|
19
19
|
|
|
20
20
|
var _react = require("react");
|
|
21
21
|
|
|
22
|
+
var _acceptIcon = _interopRequireDefault(require("../../../assets/images/generalButton/acceptIcon.svg"));
|
|
23
|
+
|
|
24
|
+
var _rejectIcon = _interopRequireDefault(require("../../../assets/images/generalButton/rejectIcon.svg"));
|
|
25
|
+
|
|
22
26
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
23
27
|
|
|
24
28
|
var TagAndInput = function TagAndInput(_ref) {
|