contentoh-components-library 21.0.6 → 21.0.9
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 +14 -6
- package/dist/components/atoms/GeneralInput/styles.js +4 -1
- package/dist/components/atoms/InputFormatter/index.js +15 -11
- package/dist/components/atoms/Select/style.js +1 -1
- package/dist/components/organisms/FullTabsMenu/index.js +1 -1
- package/dist/components/organisms/InputGroup/index.js +8 -8
- package/dist/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +29 -29
- package/dist/components/pages/RetailerProductEdition/index.js +136 -62
- package/package.json +1 -1
- package/src/components/atoms/GeneralInput/index.js +21 -6
- package/src/components/atoms/GeneralInput/styles.js +9 -0
- package/src/components/atoms/InputFormatter/index.js +13 -7
- package/src/components/atoms/Select/style.js +0 -1
- package/src/components/organisms/FullTabsMenu/index.js +1 -1
- package/src/components/organisms/InputGroup/index.js +7 -1
- package/src/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +29 -30
- package/src/components/pages/RetailerProductEdition/index.js +114 -46
|
@@ -15,6 +15,8 @@ var _styles = require("./styles");
|
|
|
15
15
|
|
|
16
16
|
var _InputFormatter = require("../InputFormatter");
|
|
17
17
|
|
|
18
|
+
var _CheckBox = require("../CheckBox");
|
|
19
|
+
|
|
18
20
|
var _jsxRuntime = require("react/jsx-runtime");
|
|
19
21
|
|
|
20
22
|
var GeneralInput = function GeneralInput(_ref) {
|
|
@@ -55,20 +57,20 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
55
57
|
});
|
|
56
58
|
} else {
|
|
57
59
|
setTextValue({
|
|
58
|
-
value: evt.target.value
|
|
60
|
+
value: inputType === "checkbox" ? evt.target.checked : evt.target.value
|
|
59
61
|
});
|
|
60
62
|
var dataSave = updatedDatasheets.slice();
|
|
61
63
|
if (dataSave.length === 0) dataSave.push({
|
|
62
64
|
articleId: articleId,
|
|
63
65
|
versionId: version,
|
|
64
66
|
attributeId: inputId,
|
|
65
|
-
value: evt.target.value
|
|
67
|
+
value: inputType === "checkbox" ? evt.target.checked : evt.target.value
|
|
66
68
|
});else if (dataSave.some(function (e) {
|
|
67
69
|
return e.attributeId === inputId;
|
|
68
70
|
})) {
|
|
69
71
|
dataSave.forEach(function (e) {
|
|
70
72
|
if (e.attributeId === inputId) {
|
|
71
|
-
e.value = evt.target.value;
|
|
73
|
+
e.value = inputType === "checkbox" ? evt.target.checked : evt.target.value;
|
|
72
74
|
}
|
|
73
75
|
});
|
|
74
76
|
} else {
|
|
@@ -76,7 +78,7 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
76
78
|
articleId: articleId,
|
|
77
79
|
versionId: version,
|
|
78
80
|
attributeId: inputId,
|
|
79
|
-
value: evt.target.value
|
|
81
|
+
value: inputType === "checkbox" ? evt.target.checked : evt.target.value
|
|
80
82
|
});
|
|
81
83
|
}
|
|
82
84
|
setUpdatedDatasheets(dataSave);
|
|
@@ -86,11 +88,17 @@ var GeneralInput = function GeneralInput(_ref) {
|
|
|
86
88
|
(0, _react.useEffect)(function () {
|
|
87
89
|
var _textValue$value;
|
|
88
90
|
|
|
89
|
-
setRequiredEmpty(isRequired && ((_textValue$value = textValue.value) === null || _textValue$value === void 0 ? void 0 : _textValue$value.length) === 0);
|
|
91
|
+
setRequiredEmpty(isRequired && (((_textValue$value = textValue.value) === null || _textValue$value === void 0 ? void 0 : _textValue$value.length) === 0 || textValue.value === undefined));
|
|
90
92
|
}, [textValue]);
|
|
91
93
|
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
|
|
92
94
|
isRequired: requiredEmpty,
|
|
93
|
-
children: inputType
|
|
95
|
+
children: inputType === "checkbox" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_CheckBox.CheckBox, {
|
|
96
|
+
id: inputId,
|
|
97
|
+
onChange: function onChange(e) {
|
|
98
|
+
return onHandleChange(e);
|
|
99
|
+
},
|
|
100
|
+
defaultChecked: textValue.value === "true" ? true : false
|
|
101
|
+
}) : inputType !== "textarea" ? /*#__PURE__*/(0, _jsxRuntime.jsx)("input", {
|
|
94
102
|
type: inputType,
|
|
95
103
|
id: inputId,
|
|
96
104
|
size: inputSize,
|
|
@@ -15,8 +15,11 @@ var _variables = require("../../../global-files/variables");
|
|
|
15
15
|
|
|
16
16
|
var _templateObject;
|
|
17
17
|
|
|
18
|
-
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 100%;\n\n input,\n textarea {\n width: 100%;\n border: 1px solid\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"])), function (_ref) {
|
|
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"])), function (_ref) {
|
|
19
19
|
var isRequired = _ref.isRequired;
|
|
20
|
+
return isRequired ? "red" : "none";
|
|
21
|
+
}, function (_ref2) {
|
|
22
|
+
var isRequired = _ref2.isRequired;
|
|
20
23
|
return isRequired ? "red" : "".concat(_variables.GlobalColors.s2);
|
|
21
24
|
}, _variables.FontFamily.AvenirNext, _variables.GlobalColors.s4, _variables.GlobalColors.magenta_s2);
|
|
22
25
|
|
|
@@ -80,17 +80,21 @@ var InputFormatter = function InputFormatter(_ref) {
|
|
|
80
80
|
var _onChange = function onChange(valueInput, delta, user, h) {
|
|
81
81
|
var value = "";
|
|
82
82
|
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
83
|
+
try {
|
|
84
|
+
if (h.getLength() - 1 <= maxLength) {
|
|
85
|
+
setInputValue(function (val) {
|
|
86
|
+
return val = valueInput.replace(/<\/?span.*?>/gm, "");
|
|
87
|
+
});
|
|
88
|
+
value = valueInput;
|
|
89
|
+
} else {
|
|
90
|
+
quillState.deleteText(maxLength, quillState.getLength());
|
|
91
|
+
setInputValue(function (val) {
|
|
92
|
+
return val = quillState.getText();
|
|
93
|
+
});
|
|
94
|
+
value = quillState.getText();
|
|
95
|
+
}
|
|
96
|
+
} catch (error) {
|
|
97
|
+
console.log(error);
|
|
94
98
|
}
|
|
95
99
|
|
|
96
100
|
setCharsCounter(h.getLength() - 1);
|
|
@@ -24,7 +24,7 @@ var BackgroundEnd = _styledComponents.default.div(_templateObject2 || (_template
|
|
|
24
24
|
|
|
25
25
|
exports.BackgroundEnd = BackgroundEnd;
|
|
26
26
|
|
|
27
|
-
var SelectCustom = _styledComponents.default.select(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n background: #fafafa;\n -webkit-appearance: none;\n -moz-appearance: none;\n -ms-appearance: none;\n appearance: none;\n outline: 0;\n box-shadow: none;\n border: 0 !important;\n background-image: none;\n width: ", ";\n cursor: pointer;\n height: 21px;\n font-family: Avenir Next;\n font-style: normal;\n font-weight: normal;\n font-size: 12px;\n line-height: 21px;\n padding: 0 5px;\n box-sizing: border-box;\n &::-ms-expand {\n display: none;\n }\n option {\n
|
|
27
|
+
var SelectCustom = _styledComponents.default.select(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteral2.default)(["\n background: #fafafa;\n -webkit-appearance: none;\n -moz-appearance: none;\n -ms-appearance: none;\n appearance: none;\n outline: 0;\n box-shadow: none;\n border: 0 !important;\n background-image: none;\n width: ", ";\n cursor: pointer;\n height: 21px;\n font-family: Avenir Next;\n font-style: normal;\n font-weight: normal;\n font-size: 12px;\n line-height: 21px;\n padding: 0 5px;\n box-sizing: border-box;\n &::-ms-expand {\n display: none;\n }\n option {\n &:disabled {\n color: #d4d1d7;\n }\n &:invalid {\n color: gray;\n }\n }\n"])), function (_ref2) {
|
|
28
28
|
var width = _ref2.width;
|
|
29
29
|
return width || "100%";
|
|
30
30
|
});
|
|
@@ -44,7 +44,7 @@ var FullTabsMenu = function FullTabsMenu(_ref) {
|
|
|
44
44
|
setImagesSection: setImagesSection,
|
|
45
45
|
setActiveTab: setActiveTab
|
|
46
46
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)(_index2.StatusAsignationInfo, {
|
|
47
|
-
status: status
|
|
47
|
+
status: status(),
|
|
48
48
|
activeTab: activeTab,
|
|
49
49
|
setImageLayout: setImageLayout,
|
|
50
50
|
imagesSection: imagesSection,
|
|
@@ -50,21 +50,21 @@ var InputGroup = function InputGroup(_ref) {
|
|
|
50
50
|
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
51
51
|
className: "inputs-container",
|
|
52
52
|
children: inputGroup === null || inputGroup === void 0 ? void 0 : (_inputGroup$inputs = inputGroup.inputs) === null || _inputGroup$inputs === void 0 ? void 0 : _inputGroup$inputs.map(function (input, index) {
|
|
53
|
-
var _dataInputs$input, _dataInputs$input2, _dataInputs$input3, _dataInputs$input4, _dataInputs$input5, _dataInputs$input6, _dataInputs$input7, _dataInputs$input8, _dataInputs$input9;
|
|
53
|
+
var _dataInputs$input, _dataInputs$input2, _dataInputs$input3, _dataInputs$input4, _dataInputs$input5, _dataInputs$input6, _dataInputs$input7, _dataInputs$input8, _dataInputs$input9, _dataInputs$input10;
|
|
54
54
|
|
|
55
55
|
return activeSection === "Ficha técnica" ? /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
|
|
56
|
-
inputId: (_dataInputs$
|
|
56
|
+
inputId: (_dataInputs$input3 = dataInputs[input]) === null || _dataInputs$input3 === void 0 ? void 0 : _dataInputs$input3.id,
|
|
57
57
|
version: version,
|
|
58
|
-
inputType: inputTypeValue((_dataInputs$
|
|
59
|
-
label: ((_dataInputs$
|
|
60
|
-
value: (_dataInputs$
|
|
58
|
+
inputType: inputTypeValue((_dataInputs$input4 = dataInputs[input]) === null || _dataInputs$input4 === void 0 ? void 0 : _dataInputs$input4.type),
|
|
59
|
+
label: ((_dataInputs$input5 = dataInputs[input]) === null || _dataInputs$input5 === void 0 ? void 0 : _dataInputs$input5.name) + ((_dataInputs$input6 = dataInputs[input]) !== null && _dataInputs$input6 !== void 0 && _dataInputs$input6.required ? "*" : ""),
|
|
60
|
+
value: (_dataInputs$input7 = dataInputs[input]) === null || _dataInputs$input7 === void 0 ? void 0 : _dataInputs$input7.value,
|
|
61
61
|
inputPlaceHolder: input === null || input === void 0 ? void 0 : input.placeholder,
|
|
62
62
|
articleId: articleId,
|
|
63
|
-
isRequired: (_dataInputs$
|
|
63
|
+
isRequired: (_dataInputs$input8 = dataInputs[input]) === null || _dataInputs$input8 === void 0 ? void 0 : _dataInputs$input8.required,
|
|
64
64
|
updatedDatasheets: updatedDatasheets,
|
|
65
65
|
setUpdatedDatasheets: setUpdatedDatasheets,
|
|
66
|
-
maxChar: (_dataInputs$
|
|
67
|
-
}, index + "-" + ((_dataInputs$input = dataInputs[input]) === null || _dataInputs$input === void 0 ? void 0 : _dataInputs$input.value)) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
|
|
66
|
+
maxChar: (_dataInputs$input9 = dataInputs[input]) !== null && _dataInputs$input9 !== void 0 && _dataInputs$input9.max_chars ? (_dataInputs$input10 = dataInputs[input]) === null || _dataInputs$input10 === void 0 ? void 0 : _dataInputs$input10.max_chars : 999
|
|
67
|
+
}, index + "-" + ((_dataInputs$input = dataInputs[input]) === null || _dataInputs$input === void 0 ? void 0 : _dataInputs$input.value) + "-" + ((_dataInputs$input2 = dataInputs[input]) === null || _dataInputs$input2 === void 0 ? void 0 : _dataInputs$input2.id)) : /*#__PURE__*/(0, _jsxRuntime.jsx)(_TagAndInput.TagAndInput, {
|
|
68
68
|
inputId: input.id,
|
|
69
69
|
index: index,
|
|
70
70
|
inputType: "textarea",
|
|
@@ -68,7 +68,7 @@ RetailerProductEditionDefault.args = {
|
|
|
68
68
|
"Ficha técnica": false,
|
|
69
69
|
Imágenes: false
|
|
70
70
|
},
|
|
71
|
-
token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.
|
|
71
|
+
token: "eyJraWQiOiJkQWJkZCtlclwvTlwveVRQUWNvUlVyOCtrNUd2M1hMM2N1MWUzQ09zWExVRnc9IiwiYWxnIjoiUlMyNTYifQ.eyJzdWIiOiJiMmNlNWIyYS02MDljLTRlNzktOWVhOS0yZjc0Y2ZmNDM4ODkiLCJjb2duaXRvOmdyb3VwcyI6WyJjb2xhYm9yYWRvcmVzX2NvbnRlbnRvaCJdLCJlbWFpbF92ZXJpZmllZCI6dHJ1ZSwiaXNzIjoiaHR0cHM6XC9cL2NvZ25pdG8taWRwLnVzLWVhc3QtMS5hbWF6b25hd3MuY29tXC91cy1lYXN0LTFfWE1aUWRxa0dqIiwiY29nbml0bzp1c2VybmFtZSI6ImIyY2U1YjJhLTYwOWMtNGU3OS05ZWE5LTJmNzRjZmY0Mzg4OSIsImNvZ25pdG86cm9sZXMiOlsiYXJuOmF3czppYW06Ojg5ODY3MDIzMjgwNzpyb2xlXC9jb250ZW50b2gtZGV2LXVzLWVhc3QtMS1sYW1iZGFSb2xlIl0sImF1ZCI6IjVhYzh0cGdzNmdic3ExM2ZydnJwaWVlcDQwIiwiZXZlbnRfaWQiOiJkMGQ0NDUxYS01ODg1LTQ0ZTctYjZhNi0xODdkY2NjNDI4MTgiLCJ0b2tlbl91c2UiOiJpZCIsImF1dGhfdGltZSI6MTY1MTIyMDI2NiwibmFtZSI6IkNvbGFib3JhZG9yIiwicGhvbmVfbnVtYmVyIjoiKzUyMTExMSIsImV4cCI6MTY1MTIyMzg2NiwiaWF0IjoxNjUxMjIwMjY2LCJlbWFpbCI6ImF6YXJhdGVAY29udGVudG9oLmNvbSJ9.lhlgp4NoHgFu4LrpIWiGCTD08MIHo-mLQ17SNx1rAmyHP5YosGp9LKJXEgNcpAIaVfFiy4Zd-YGTf2QExMcP9kAYksoKHI1G6jSg87yh3Pg3V3aGE6X6JkuOOflz2M8jZgyYMRvbkJfG7oi6uj_nZ-tCjq7VMnmZyfWL4LjTvF5E0EqzVC93fcPViwW5ozqr51VvGhIoXGHiG01i4CPbsorp0jJjlU795cq4ETNw6i0d61Wz9pLDUttYmt5RCEMrbCp3ctSymtxHuz3eJTXzsF330KAmGL2SG4hJ8l-kdyoYRSlkGy3PTy4tYdFVrcubpHL3LOFzJWMrmLn98J3MoA",
|
|
72
72
|
articleId: 238,
|
|
73
73
|
category: 846,
|
|
74
74
|
version: 2,
|
|
@@ -78,72 +78,72 @@ RetailerProductEditionDefault.args = {
|
|
|
78
78
|
descriptions: 1,
|
|
79
79
|
images: 1
|
|
80
80
|
},
|
|
81
|
-
orderId:
|
|
82
|
-
status: "
|
|
83
|
-
datasheet_status: "
|
|
81
|
+
orderId: 125,
|
|
82
|
+
status: "IN_PROGRESS",
|
|
83
|
+
datasheet_status: "QF",
|
|
84
84
|
prio: "none",
|
|
85
85
|
version: 2,
|
|
86
|
-
description_status: "
|
|
87
|
-
images_status: "
|
|
86
|
+
description_status: "QF",
|
|
87
|
+
images_status: "IN_PROGRESS",
|
|
88
88
|
article: {
|
|
89
|
-
id_article:
|
|
90
|
-
id_category: "
|
|
91
|
-
name: "
|
|
92
|
-
upc: "
|
|
93
|
-
timestamp: "2022-
|
|
89
|
+
id_article: 109483,
|
|
90
|
+
id_category: "2046",
|
|
91
|
+
name: "Celular",
|
|
92
|
+
upc: "31313131",
|
|
93
|
+
timestamp: "2022-04-28T21:42:27.000Z",
|
|
94
94
|
id_user: 28,
|
|
95
95
|
status: "NULL",
|
|
96
96
|
active: 1,
|
|
97
97
|
company_id: 1,
|
|
98
98
|
company_name: "COMPANY DEV",
|
|
99
99
|
country: "Colombia",
|
|
100
|
-
id_order:
|
|
101
|
-
id_datasheet_especialist:
|
|
100
|
+
id_order: 125,
|
|
101
|
+
id_datasheet_especialist: 54,
|
|
102
102
|
id_datasheet_facilitator: 52,
|
|
103
|
-
id_description_especialist:
|
|
103
|
+
id_description_especialist: 54,
|
|
104
104
|
id_description_facilitator: 52,
|
|
105
105
|
id_images_especialist: 55,
|
|
106
106
|
id_images_facilitator: 53,
|
|
107
107
|
id_auditor: 30,
|
|
108
108
|
id_recepcionist: null,
|
|
109
|
-
category: "
|
|
109
|
+
category: "ELÉCTRICO|ELECTRÓNICA|ANTENAS Y ACCESORIOS",
|
|
110
110
|
missingAttributes: null,
|
|
111
111
|
missingDescriptions: null,
|
|
112
112
|
missingImages: null
|
|
113
113
|
},
|
|
114
114
|
retailers: [{
|
|
115
|
-
id:
|
|
116
|
-
name: "
|
|
115
|
+
id: 58,
|
|
116
|
+
name: "The Home Depot",
|
|
117
117
|
country: "México",
|
|
118
118
|
id_region: 1,
|
|
119
119
|
active: 1
|
|
120
120
|
}, {
|
|
121
|
-
id:
|
|
122
|
-
name: "
|
|
121
|
+
id: 59,
|
|
122
|
+
name: "Home Depot Platinum",
|
|
123
123
|
country: "México",
|
|
124
124
|
id_region: 1,
|
|
125
125
|
active: 1
|
|
126
126
|
}],
|
|
127
127
|
country: "Colombia",
|
|
128
|
-
upc: "
|
|
128
|
+
upc: "31313131"
|
|
129
129
|
},
|
|
130
130
|
user: {
|
|
131
|
-
id_user:
|
|
132
|
-
name: "
|
|
133
|
-
last_name: "
|
|
134
|
-
email: "
|
|
135
|
-
position:
|
|
131
|
+
id_user: 52,
|
|
132
|
+
name: "FACILITADOR TXT PRUEBA",
|
|
133
|
+
last_name: "",
|
|
134
|
+
email: "azarate@contentoh.com",
|
|
135
|
+
position: null,
|
|
136
136
|
telephone: null,
|
|
137
|
-
country:
|
|
137
|
+
country: null,
|
|
138
138
|
id_company: 2,
|
|
139
|
-
id_cognito: "
|
|
139
|
+
id_cognito: "b2ce5b2a-609c-4e79-9ea9-2f74cff43889",
|
|
140
140
|
birth_Date: null,
|
|
141
141
|
about_me: null,
|
|
142
142
|
zip_code: null,
|
|
143
143
|
address: null,
|
|
144
144
|
job: null,
|
|
145
145
|
id_stripe: null,
|
|
146
|
-
id_role:
|
|
146
|
+
id_role: 4,
|
|
147
147
|
active: 1,
|
|
148
148
|
is_retailer: 0,
|
|
149
149
|
membership: {
|
|
@@ -157,6 +157,6 @@ RetailerProductEditionDefault.args = {
|
|
|
157
157
|
products_limit: "3",
|
|
158
158
|
type: "PyMES"
|
|
159
159
|
},
|
|
160
|
-
src: "https://content-management-profile.s3.amazonaws.com/id-
|
|
160
|
+
src: "https://content-management-profile.s3.amazonaws.com/id-52/52.png?1651207506986"
|
|
161
161
|
}
|
|
162
162
|
};
|