contentoh-components-library 21.4.2 → 21.4.4
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/.env.development +0 -1
- package/.env.production +0 -1
- package/dist/assets/fonts/roboto/LICENSE.txt +202 -0
- package/dist/components/atoms/Avatar/index.js +2 -3
- package/dist/components/atoms/CheckBox/index.js +1 -4
- package/dist/components/atoms/CheckBox/styles.js +1 -1
- package/dist/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +28 -41
- package/dist/components/pages/RetailerProductEdition/index.js +0 -23
- package/dist/global-files/customHooks.js +0 -1
- package/dist/index.js +58 -201
- package/package.json +1 -2
- package/src/components/atoms/Avatar/index.js +2 -8
- package/src/components/atoms/CheckBox/index.js +1 -2
- package/src/components/atoms/CheckBox/styles.js +0 -2
- package/src/components/organisms/OrderDetail/utils/Table/utils.js +16 -6
- package/src/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +21 -39
- package/src/components/pages/RetailerProductEdition/index.js +0 -12
- package/src/global-files/customHooks.js +0 -1
- package/src/index.js +0 -12
- package/dist/components/atoms/ImageCarousel/ImgeSlider.stories.js +0 -90
- package/dist/components/atoms/ImageCarousel/index.js +0 -120
- package/dist/components/atoms/ImageCarousel/styles.js +0 -18
- package/dist/components/atoms/PercentTag/PercentTag.stories.js +0 -31
- package/dist/components/atoms/PercentTag/index.js +0 -23
- package/dist/components/atoms/PercentTag/styles.js +0 -22
- package/dist/components/atoms/RatingStars/RatingStars.stories.js +0 -30
- package/dist/components/atoms/RatingStars/index.js +0 -53
- package/dist/components/atoms/RatingStars/styles.js +0 -18
- package/dist/components/atoms/RetailerCatalog/RetailerCatalog.stories.js +0 -48
- package/dist/components/atoms/RetailerCatalog/index.js +0 -70
- package/dist/components/atoms/RetailerCatalog/styles.js +0 -20
- package/dist/components/atoms/RetailerOption/RetailerOption.stories.js +0 -33
- package/dist/components/atoms/RetailerOption/index.js +0 -62
- package/dist/components/atoms/RetailerOption/styles.js +0 -20
- package/dist/components/atoms/RetailersList/RetailersList.stories.js +0 -45
- package/dist/components/atoms/RetailersList/index.js +0 -46
- package/dist/components/atoms/RetailersList/styles.js +0 -18
- package/dist/components/atoms/UserCatalog/UserCatalog.stories.js +0 -73
- package/dist/components/atoms/UserCatalog/index.js +0 -103
- package/dist/components/atoms/UserCatalog/styles.js +0 -18
- package/dist/components/atoms/UserOption/UserOption.stories.js +0 -40
- package/dist/components/atoms/UserOption/index.js +0 -127
- package/dist/components/atoms/UserOption/styles.js +0 -20
- package/dist/components/atoms/UserSelector/UserSelector.stories.js +0 -40
- package/dist/components/atoms/UserSelector/index.js +0 -100
- package/dist/components/atoms/UserSelector/styles.js +0 -32
- package/dist/components/molecules/GridItem/GridItem.stories.js +0 -123
- package/dist/components/molecules/GridItem/index.js +0 -123
- package/dist/components/molecules/GridItem/styles.js +0 -20
- package/dist/components/molecules/HeaderItem/ColumnItem.js +0 -23
- package/dist/components/molecules/HeaderItem/HeaderItem.stories.js +0 -70
- package/dist/components/molecules/HeaderItem/index.js +0 -42
- package/dist/components/molecules/HeaderItem/styles.js +0 -30
- package/dist/components/molecules/RowItem/ColumnItem.js +0 -23
- package/dist/components/molecules/RowItem/RowItem.stories.js +0 -5242
- package/dist/components/molecules/RowItem/index.js +0 -58
- package/dist/components/molecules/RowItem/styles.js +0 -30
- package/dist/components/organisms/GridProducts/GridProducts.stories.js +0 -5097
- package/dist/components/organisms/GridProducts/index.js +0 -63
- package/dist/components/organisms/GridProducts/styles.js +0 -18
- package/dist/components/organisms/GridProducts/utils.js +0 -144
- package/src/components/atoms/ImageCarousel/ImgeSlider.stories.js +0 -76
- package/src/components/atoms/ImageCarousel/index.js +0 -103
- package/src/components/atoms/ImageCarousel/styles.js +0 -79
- package/src/components/atoms/PercentTag/PercentTag.stories.js +0 -7
- package/src/components/atoms/PercentTag/index.js +0 -9
- package/src/components/atoms/PercentTag/styles.js +0 -69
- package/src/components/atoms/RatingStars/RatingStars.stories.js +0 -10
- package/src/components/atoms/RatingStars/index.js +0 -31
- package/src/components/atoms/RatingStars/styles.js +0 -28
- package/src/components/atoms/RetailerCatalog/RetailerCatalog.stories.js +0 -36
- package/src/components/atoms/RetailerCatalog/index.js +0 -49
- package/src/components/atoms/RetailerCatalog/styles.js +0 -30
- package/src/components/atoms/RetailerOption/RetailerOption.stories.js +0 -15
- package/src/components/atoms/RetailerOption/index.js +0 -53
- package/src/components/atoms/RetailerOption/styles.js +0 -41
- package/src/components/atoms/RetailersList/RetailersList.stories.js +0 -33
- package/src/components/atoms/RetailersList/index.js +0 -20
- package/src/components/atoms/RetailersList/styles.js +0 -19
- package/src/components/atoms/UserCatalog/UserCatalog.stories.js +0 -67
- package/src/components/atoms/UserCatalog/index.js +0 -96
- package/src/components/atoms/UserCatalog/styles.js +0 -24
- package/src/components/atoms/UserOption/UserOption.stories.js +0 -25
- package/src/components/atoms/UserOption/index.js +0 -88
- package/src/components/atoms/UserOption/styles.js +0 -61
- package/src/components/atoms/UserSelector/UserSelector.stories.js +0 -25
- package/src/components/atoms/UserSelector/index.js +0 -88
- package/src/components/atoms/UserSelector/styles.js +0 -55
- package/src/components/molecules/GridItem/GridItem.stories.js +0 -126
- package/src/components/molecules/GridItem/index.js +0 -83
- package/src/components/molecules/GridItem/styles.js +0 -85
- package/src/components/molecules/HeaderItem/ColumnItem.js +0 -9
- package/src/components/molecules/HeaderItem/HeaderItem.stories.js +0 -24
- package/src/components/molecules/HeaderItem/index.js +0 -26
- package/src/components/molecules/HeaderItem/styles.js +0 -27
- package/src/components/molecules/RowItem/ColumnItem.js +0 -9
- package/src/components/molecules/RowItem/RowItem.stories.js +0 -5660
- package/src/components/molecules/RowItem/index.js +0 -45
- package/src/components/molecules/RowItem/styles.js +0 -38
- package/src/components/organisms/GridProducts/GridProducts.stories.js +0 -5485
- package/src/components/organisms/GridProducts/index.js +0 -50
- package/src/components/organisms/GridProducts/styles.js +0 -15
- package/src/components/organisms/GridProducts/utils.js +0 -108
|
@@ -52,50 +52,32 @@ RetailerProductEditionDefault.args = {
|
|
|
52
52
|
images: "RA/AC",
|
|
53
53
|
},
|
|
54
54
|
},
|
|
55
|
-
orderId: 15209,
|
|
56
|
-
status: "ACA",
|
|
57
|
-
datasheet_status: "ACA",
|
|
58
|
-
prio: "none",
|
|
59
|
-
version: 3,
|
|
60
|
-
description_status: "ACA",
|
|
61
|
-
images_status: "ACA",
|
|
62
|
-
statusByRetailer: {
|
|
63
|
-
70: {
|
|
64
|
-
datasheet: "ACA",
|
|
65
|
-
description: "ACA",
|
|
66
|
-
images: "ACA",
|
|
67
|
-
},
|
|
68
|
-
},
|
|
69
55
|
article: {
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
name: "test demo 1",
|
|
73
|
-
upc: "2312312313",
|
|
74
|
-
timestamp: "2023-05-12T20:07:42.000Z",
|
|
75
|
-
id_user: 133,
|
|
76
|
-
status: "NULL",
|
|
77
|
-
active: 1,
|
|
78
|
-
company_id: 912,
|
|
79
|
-
company_name: "GRUPO BRAHMA",
|
|
56
|
+
category: "Puertas y Ventanas|Molduras|Molduras Madera Blanda",
|
|
57
|
+
company_name: "Demo",
|
|
80
58
|
country: "México",
|
|
81
|
-
|
|
82
|
-
id_datasheet_especialist:
|
|
83
|
-
id_datasheet_facilitator:
|
|
84
|
-
id_description_especialist:
|
|
85
|
-
id_description_facilitator:
|
|
86
|
-
id_images_especialist:
|
|
87
|
-
id_images_facilitator:
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
59
|
+
id_category: "2366",
|
|
60
|
+
id_datasheet_especialist: null,
|
|
61
|
+
id_datasheet_facilitator: null,
|
|
62
|
+
id_description_especialist: null,
|
|
63
|
+
id_description_facilitator: null,
|
|
64
|
+
id_images_especialist: null,
|
|
65
|
+
id_images_facilitator: null,
|
|
66
|
+
id_order: 15160,
|
|
67
|
+
id_article: 39290,
|
|
68
|
+
id_auditor: 37,
|
|
69
|
+
name: "MOLDURA MARCO MODER 11X4X244 CM",
|
|
70
|
+
timestamp: "2023-04-19T21:36:02.000Z",
|
|
71
|
+
upc: "100030",
|
|
94
72
|
},
|
|
95
73
|
retailers: [
|
|
96
74
|
{
|
|
97
|
-
id:
|
|
98
|
-
name: "
|
|
75
|
+
id: 58,
|
|
76
|
+
name: "The Home Depot Golden",
|
|
77
|
+
},
|
|
78
|
+
{
|
|
79
|
+
id: 68,
|
|
80
|
+
name: "The Home Depot Merchants",
|
|
99
81
|
},
|
|
100
82
|
],
|
|
101
83
|
},
|
|
@@ -226,10 +226,6 @@ export const RetailerProductEdition = ({
|
|
|
226
226
|
const [compare, setCompare] = useState(false);
|
|
227
227
|
const [valRejAll, setValRejAll] = useState(false);
|
|
228
228
|
|
|
229
|
-
const [desc, setDesc] = useState([]);
|
|
230
|
-
const [fich, setFich] = useState([]);
|
|
231
|
-
const [imag, setImag] = useState([]);
|
|
232
|
-
|
|
233
229
|
useEffect(async () => {
|
|
234
230
|
const { id_article } = product?.article || {};
|
|
235
231
|
if (id_article)
|
|
@@ -571,7 +567,6 @@ export const RetailerProductEdition = ({
|
|
|
571
567
|
active: images?.values?.some((value) => value?.image_id === e?.id),
|
|
572
568
|
}));
|
|
573
569
|
setSocketType(imageInputs);
|
|
574
|
-
console.log(images);
|
|
575
570
|
}, [images]);
|
|
576
571
|
|
|
577
572
|
const updateImages = useCallback(async () => {
|
|
@@ -1192,7 +1187,6 @@ export const RetailerProductEdition = ({
|
|
|
1192
1187
|
};
|
|
1193
1188
|
|
|
1194
1189
|
useEffect(() => {
|
|
1195
|
-
console.log(servicesData, "servicesData");
|
|
1196
1190
|
let status = getRetailerStatus(servicesData, activeTab);
|
|
1197
1191
|
setRetailerStatus(status);
|
|
1198
1192
|
}, [activeTab, servicesData, activeRetailer]);
|
|
@@ -1357,12 +1351,6 @@ export const RetailerProductEdition = ({
|
|
|
1357
1351
|
isRetailer={isRetailer}
|
|
1358
1352
|
showSaveButton={auditorAssigned() || userAssigned()}
|
|
1359
1353
|
version={version}
|
|
1360
|
-
desc={desc}
|
|
1361
|
-
setDesc={setDesc}
|
|
1362
|
-
fich={fich}
|
|
1363
|
-
setFich={setFich}
|
|
1364
|
-
imag={imag}
|
|
1365
|
-
setImag={setImag}
|
|
1366
1354
|
updatedDescriptions={updatedDescriptions}
|
|
1367
1355
|
setUpdatedDescriptions={setUpdatedDescriptions}
|
|
1368
1356
|
updatedDatasheets={updatedDatasheets}
|
package/src/index.js
CHANGED
|
@@ -33,13 +33,6 @@ export * from "./components/atoms/ImagePreview/index";
|
|
|
33
33
|
export * from "./components/atoms/InputText/index";
|
|
34
34
|
export * from "./components/atoms/NotFound/index";
|
|
35
35
|
export * from "./components/atoms/Tooltip/index";
|
|
36
|
-
export * from "./components/atoms/UserOption/index";
|
|
37
|
-
export * from "./components/atoms/UserCatalog/index";
|
|
38
|
-
export * from "./components/atoms/UserSelector/index";
|
|
39
|
-
export * from "./components/atoms/ImageCarousel/index";
|
|
40
|
-
export * from "./components/atoms/RetailersList/index";
|
|
41
|
-
export * from "./components/atoms/RetailerOption/index";
|
|
42
|
-
export * from "./components/atoms/RetailerCatalog/index";
|
|
43
36
|
|
|
44
37
|
//molecules
|
|
45
38
|
export * from "./components/molecules/AvatarAndValidation/index";
|
|
@@ -72,10 +65,6 @@ export * from "./components/molecules/SelectV2/index";
|
|
|
72
65
|
export * from "./components/molecules/Dropdown/index";
|
|
73
66
|
export * from "./components/molecules/StripeCardForm/index";
|
|
74
67
|
export * from "./components/molecules/StripeCardSelector/index";
|
|
75
|
-
export * from "./components/molecules/GridItem/index";
|
|
76
|
-
export * from "./components/molecules/HeaderItem/index";
|
|
77
|
-
export * from "./components/molecules/RowItem/index";
|
|
78
|
-
export * from "./components/molecules/RetailerSelector/index";
|
|
79
68
|
|
|
80
69
|
//organisms
|
|
81
70
|
export * from "./components/organisms/ChangePassword/index";
|
|
@@ -93,7 +82,6 @@ export * from "./components/organisms/OrderDetail/index";
|
|
|
93
82
|
export * from "./components/organisms/RangeCalendar";
|
|
94
83
|
export * from "./components/organisms/TableResizable";
|
|
95
84
|
export * from "./components/organisms/SideModal/index";
|
|
96
|
-
export * from "./components/organisms/GridProducts/index";
|
|
97
85
|
|
|
98
86
|
//pages
|
|
99
87
|
export * from "./components/pages/ChangePasswordLogin";
|
|
@@ -1,90 +0,0 @@
|
|
|
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.default = exports.ImageCarouselDefault = void 0;
|
|
9
|
-
|
|
10
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
11
|
-
|
|
12
|
-
var _ = require(".");
|
|
13
|
-
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
|
-
var _default = {
|
|
17
|
-
title: "Components/atoms/ImageCarousel",
|
|
18
|
-
component: _.ImageCarousel
|
|
19
|
-
};
|
|
20
|
-
exports.default = _default;
|
|
21
|
-
|
|
22
|
-
var Template = function Template(args) {
|
|
23
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.ImageCarousel, (0, _objectSpread2.default)({}, args));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
var ImageCarouselDefault = Template.bind({});
|
|
27
|
-
exports.ImageCarouselDefault = ImageCarouselDefault;
|
|
28
|
-
ImageCarouselDefault.args = {
|
|
29
|
-
imageArray: [{
|
|
30
|
-
id: 35596,
|
|
31
|
-
status: null,
|
|
32
|
-
image_id: 1,
|
|
33
|
-
packing_type: "3",
|
|
34
|
-
image_type: "1",
|
|
35
|
-
article_id: "38443",
|
|
36
|
-
src: "https://d24s337exbt5zr.cloudfront.net/eyJidWNrZXQiOiJjb250ZW50LW1hbmFnZW1lbnQtaW1hZ2VzIiwia2V5IjoiaWQtMzg0NDMvMTUvMS1kNDQ2ZjIwNy0wYTkzLTQyNzgtYWZjNi01MTY2ZjIyY2EzNDMucG5nIiwiZWRpdHMiOnsicmVzaXplIjp7IndpZHRoIjoxMDAwLCJoZWlnaHQiOjEwMDAsImZpdCI6ImNvbnRhaW4iLCJiYWNrZ3JvdW5kIjp7InIiOjI1NSwiZyI6MjU1LCJiIjoyNTUsImFscGhhIjoxfX19fQ==",
|
|
37
|
-
timestamp: "2023-05-30T03:01:12.000Z",
|
|
38
|
-
id_version: 15,
|
|
39
|
-
width: null,
|
|
40
|
-
height: null,
|
|
41
|
-
scene_type: null,
|
|
42
|
-
image_shot_type: null,
|
|
43
|
-
last_modified: "2023-06-05T23:49:49.000Z",
|
|
44
|
-
name: "Central (Frente Comercial)",
|
|
45
|
-
version: 15,
|
|
46
|
-
ext: "png",
|
|
47
|
-
uuid: "d446f207-0a93-4278-afc6-5166f22ca343",
|
|
48
|
-
srcDB: "id-38443/15/1-d446f207-0a93-4278-afc6-5166f22ca343.png"
|
|
49
|
-
}, {
|
|
50
|
-
id: 35597,
|
|
51
|
-
status: null,
|
|
52
|
-
image_id: 3,
|
|
53
|
-
packing_type: "3",
|
|
54
|
-
image_type: "1",
|
|
55
|
-
article_id: "38443",
|
|
56
|
-
src: "https://d24s337exbt5zr.cloudfront.net/eyJidWNrZXQiOiJjb250ZW50LW1hbmFnZW1lbnQtaW1hZ2VzIiwia2V5IjoiaWQtMzg0NDMvMTUvMy0yOTZkMzU3ZC00OTUzLTRiMzktYjFjMy04YWZmZDI2NDgwMWIucG5nIiwiZWRpdHMiOnsicmVzaXplIjp7IndpZHRoIjoxMDAwLCJoZWlnaHQiOjEwMDAsImZpdCI6ImNvbnRhaW4iLCJiYWNrZ3JvdW5kIjp7InIiOjI1NSwiZyI6MjU1LCJiIjoyNTUsImFscGhhIjoxfX19fQ==",
|
|
57
|
-
timestamp: "2023-05-30T03:01:12.000Z",
|
|
58
|
-
id_version: 15,
|
|
59
|
-
width: null,
|
|
60
|
-
height: null,
|
|
61
|
-
scene_type: null,
|
|
62
|
-
image_shot_type: null,
|
|
63
|
-
last_modified: "2023-06-05T23:49:49.000Z",
|
|
64
|
-
name: "Trasera (Back)",
|
|
65
|
-
version: 15,
|
|
66
|
-
ext: "png",
|
|
67
|
-
uuid: "296d357d-4953-4b39-b1c3-8affd264801b",
|
|
68
|
-
srcDB: "id-38443/15/3-296d357d-4953-4b39-b1c3-8affd264801b.png"
|
|
69
|
-
}, {
|
|
70
|
-
id: 35598,
|
|
71
|
-
status: null,
|
|
72
|
-
image_id: 16,
|
|
73
|
-
packing_type: "3",
|
|
74
|
-
image_type: "1",
|
|
75
|
-
article_id: "38443",
|
|
76
|
-
src: "https://d24s337exbt5zr.cloudfront.net/eyJidWNrZXQiOiJjb250ZW50LW1hbmFnZW1lbnQtaW1hZ2VzIiwia2V5IjoiaWQtMzg0NDMvMTUvMTYtOGMzNDIzM2YtZTRiMC00MjU0LWFlYzUtZjEyN2ZiYjhkYmVkLnBuZyIsImVkaXRzIjp7InJlc2l6ZSI6eyJ3aWR0aCI6MTAwMCwiaGVpZ2h0IjoxMDAwLCJmaXQiOiJjb250YWluIiwiYmFja2dyb3VuZCI6eyJyIjoyNTUsImciOjI1NSwiYiI6MjU1LCJhbHBoYSI6MX19fX0=",
|
|
77
|
-
timestamp: "2023-05-30T03:01:12.000Z",
|
|
78
|
-
id_version: 15,
|
|
79
|
-
width: null,
|
|
80
|
-
height: null,
|
|
81
|
-
scene_type: null,
|
|
82
|
-
image_shot_type: null,
|
|
83
|
-
last_modified: "2023-06-05T23:49:49.000Z",
|
|
84
|
-
name: "Detalle / Características 1",
|
|
85
|
-
version: 15,
|
|
86
|
-
ext: "png",
|
|
87
|
-
uuid: "8c34233f-e4b0-4254-aec5-f127fbb8dbed",
|
|
88
|
-
srcDB: "id-38443/15/16-8c34233f-e4b0-4254-aec5-f127fbb8dbed.png"
|
|
89
|
-
}]
|
|
90
|
-
};
|
|
@@ -1,120 +0,0 @@
|
|
|
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.ImageCarousel = void 0;
|
|
9
|
-
|
|
10
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
11
|
-
|
|
12
|
-
var _styles = require("./styles");
|
|
13
|
-
|
|
14
|
-
var _react = require("react");
|
|
15
|
-
|
|
16
|
-
var _reactImageFallback = _interopRequireDefault(require("react-image-fallback"));
|
|
17
|
-
|
|
18
|
-
var _Spinner = _interopRequireDefault(require("../../../assets/images/Icons/Spinner.gif"));
|
|
19
|
-
|
|
20
|
-
var _ArrowBackIos = _interopRequireDefault(require("@mui/icons-material/ArrowBackIos"));
|
|
21
|
-
|
|
22
|
-
var _defaultProductImage = _interopRequireDefault(require("../../../assets/images/defaultImages/defaultProductImage.png"));
|
|
23
|
-
|
|
24
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
25
|
-
|
|
26
|
-
var ImageCarousel = function ImageCarousel(_ref) {
|
|
27
|
-
var _ref$imageArray = _ref.imageArray,
|
|
28
|
-
imageArray = _ref$imageArray === void 0 ? [] : _ref$imageArray;
|
|
29
|
-
|
|
30
|
-
var _useState = (0, _react.useState)(0),
|
|
31
|
-
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
32
|
-
currentIndex = _useState2[0],
|
|
33
|
-
setCurrentIndex = _useState2[1];
|
|
34
|
-
|
|
35
|
-
var _useState3 = (0, _react.useState)(false),
|
|
36
|
-
_useState4 = (0, _slicedToArray2.default)(_useState3, 2),
|
|
37
|
-
transitioning = _useState4[0],
|
|
38
|
-
setTransitioning = _useState4[1];
|
|
39
|
-
|
|
40
|
-
var _useState5 = (0, _react.useState)(false),
|
|
41
|
-
_useState6 = (0, _slicedToArray2.default)(_useState5, 2),
|
|
42
|
-
isHover = _useState6[0],
|
|
43
|
-
setIsHover = _useState6[1];
|
|
44
|
-
|
|
45
|
-
var goToNextSlide = function goToNextSlide() {
|
|
46
|
-
if (!transitioning) {
|
|
47
|
-
setTransitioning(true);
|
|
48
|
-
setCurrentIndex(function (prevIndex) {
|
|
49
|
-
return (prevIndex + 1) % imageArray.length;
|
|
50
|
-
});
|
|
51
|
-
setTimeout(function () {
|
|
52
|
-
setTransitioning(false);
|
|
53
|
-
}, 500); // Adjust the transition duration to match your CSS
|
|
54
|
-
}
|
|
55
|
-
};
|
|
56
|
-
|
|
57
|
-
var goToPrevSlide = function goToPrevSlide() {
|
|
58
|
-
if (!transitioning) {
|
|
59
|
-
setTransitioning(true);
|
|
60
|
-
setCurrentIndex(function (prevIndex) {
|
|
61
|
-
return (prevIndex - 1 + imageArray.length) % imageArray.length;
|
|
62
|
-
});
|
|
63
|
-
setTimeout(function () {
|
|
64
|
-
setTransitioning(false);
|
|
65
|
-
}, 500); // Adjust the transition duration to match your CSS
|
|
66
|
-
}
|
|
67
|
-
}; // useEffect(() => {
|
|
68
|
-
// const delay = 0;
|
|
69
|
-
// let repeat;
|
|
70
|
-
// setTimeout(() => {
|
|
71
|
-
// repeat = setInterval(() => {
|
|
72
|
-
// if (!isHover && imageArray.length > 1) goToNextSlide();
|
|
73
|
-
// }, 10000);
|
|
74
|
-
// }, delay);
|
|
75
|
-
// return () => {
|
|
76
|
-
// clearInterval(repeat);
|
|
77
|
-
// };
|
|
78
|
-
// }, [isHover]);
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container // onMouseEnter={() => setIsHover(true)}
|
|
82
|
-
// onMouseLeave={() => setIsHover(false)}
|
|
83
|
-
, {
|
|
84
|
-
children: [imageArray.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
85
|
-
className: "prev",
|
|
86
|
-
onClick: function onClick(e) {
|
|
87
|
-
e.stopPropagation();
|
|
88
|
-
goToPrevSlide();
|
|
89
|
-
},
|
|
90
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBackIos.default, {})
|
|
91
|
-
}), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
92
|
-
className: "slide-container",
|
|
93
|
-
children: imageArray.length ? imageArray.map(function (img, index) {
|
|
94
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
|
|
95
|
-
className: "image-container slide ".concat(index === currentIndex ? "active" : ""),
|
|
96
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactImageFallback.default, {
|
|
97
|
-
src: "https://".concat(process.env.REACT_APP_IMAGES_BUCKET, ".s3.amazonaws.com/").concat(img.src),
|
|
98
|
-
fallbackImage: _Spinner.default,
|
|
99
|
-
alt: img === null || img === void 0 ? void 0 : img.name,
|
|
100
|
-
style: {
|
|
101
|
-
transform: "translateX(-".concat(currentIndex * 100, "%)")
|
|
102
|
-
}
|
|
103
|
-
}, index)
|
|
104
|
-
}, index);
|
|
105
|
-
}) : /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
|
|
106
|
-
src: _defaultProductImage.default,
|
|
107
|
-
alt: "not image"
|
|
108
|
-
})
|
|
109
|
-
}), imageArray.length > 1 && /*#__PURE__*/(0, _jsxRuntime.jsx)("button", {
|
|
110
|
-
className: "next",
|
|
111
|
-
onClick: function onClick(e) {
|
|
112
|
-
e.stopPropagation();
|
|
113
|
-
goToNextSlide();
|
|
114
|
-
},
|
|
115
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsx)(_ArrowBackIos.default, {})
|
|
116
|
-
})]
|
|
117
|
-
});
|
|
118
|
-
};
|
|
119
|
-
|
|
120
|
-
exports.ImageCarousel = ImageCarousel;
|
|
@@ -1,18 +0,0 @@
|
|
|
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 _templateObject;
|
|
15
|
-
|
|
16
|
-
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n width: 175px;\n height: 175px;\n border-radius: 5px 5px 0px 0px;\n position: relative;\n overflow: hidden;\n display: flex;\n background-color: #f0f0f0;\n\n .slide-container {\n display: flex;\n width: 100%;\n\n .image-container {\n width: 100%;\n height: 100%;\n\n img {\n width: 100%;\n height: 100%;\n object-fit: fill;\n }\n\n &.slide {\n flex: 0 0 100%;\n opacity: 0;\n transition: opacity 0.5s ease-in-out;\n\n &.active {\n opacity: 1;\n }\n }\n }\n\n & > img {\n width: 100%;\n }\n }\n\n button {\n position: absolute;\n top: 0;\n border: none;\n cursor: pointer;\n background-color: transparent;\n color: white;\n z-index: 1;\n height: 100%;\n width: 30px;\n\n svg {\n font-size: 24px;\n }\n\n &.prev {\n left: 0;\n\n &:hover {\n background: linear-gradient(90deg, darkgray, transparent);\n }\n }\n &.next {\n right: 0;\n\n svg {\n transform: rotate(180deg);\n }\n &:hover {\n background: linear-gradient(-90deg, darkgray, transparent);\n }\n }\n }\n\n button:focus {\n outline: none;\n }\n"])));
|
|
17
|
-
|
|
18
|
-
exports.Container = Container;
|
|
@@ -1,31 +0,0 @@
|
|
|
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.default = exports.PercentTagDefault = void 0;
|
|
9
|
-
|
|
10
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
11
|
-
|
|
12
|
-
var _ = require(".");
|
|
13
|
-
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
|
-
var _default = {
|
|
17
|
-
title: "Components/atoms/PercentTag",
|
|
18
|
-
component: _.PercentTag
|
|
19
|
-
};
|
|
20
|
-
exports.default = _default;
|
|
21
|
-
|
|
22
|
-
var Template = function Template(args) {
|
|
23
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.PercentTag, (0, _objectSpread2.default)({}, args));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
var PercentTagDefault = Template.bind({});
|
|
27
|
-
exports.PercentTagDefault = PercentTagDefault;
|
|
28
|
-
PercentTagDefault.args = {
|
|
29
|
-
percent: 88,
|
|
30
|
-
progressBarType: "AA"
|
|
31
|
-
};
|
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
|
|
3
|
-
Object.defineProperty(exports, "__esModule", {
|
|
4
|
-
value: true
|
|
5
|
-
});
|
|
6
|
-
exports.PercentTag = void 0;
|
|
7
|
-
|
|
8
|
-
var _styles = require("./styles");
|
|
9
|
-
|
|
10
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
11
|
-
|
|
12
|
-
var PercentTag = function PercentTag(_ref) {
|
|
13
|
-
var percent = _ref.percent,
|
|
14
|
-
progressBarType = _ref.progressBarType;
|
|
15
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
|
|
16
|
-
className: "status-".concat(progressBarType),
|
|
17
|
-
children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
|
|
18
|
-
children: [percent, "%"]
|
|
19
|
-
})
|
|
20
|
-
});
|
|
21
|
-
};
|
|
22
|
-
|
|
23
|
-
exports.PercentTag = PercentTag;
|
|
@@ -1,22 +0,0 @@
|
|
|
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 background-color: ", ";\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: ", ";\n\n &.status-CA,\n &.status-IE {\n background-color: ", ";\n }\n\n &.status-R,\n &.status-AS,\n &.status-PA {\n background-color: ", ";\n }\n\n &.status-AA,\n &.status-AP,\n &.status-ACA,\n &.status-AC {\n background-color: ", ";\n }\n\n &.status-RA,\n &.status-RC,\n &.status-RP,\n &.status-RCA {\n background-color: ", ";\n }\n\n &.status-Dat,\n &.status-Dsc,\n &.status-Imgs {\n background-color: ", ";\n }\n\n &.status-Ex {\n background-color: ", ";\n }\n\n &.status-DDI {\n background-color: ", ";\n }\n\n &.status-GLD {\n background-color: ", ";\n }\n\n &.status-TAB {\n background-color: ", ";\n }\n\n &.status-Pt {\n background-color: ", ";\n color: ", ";\n }\n"])), _variables.GlobalColors.s3, _variables.FontFamily.Lato, function (backgroundColor) {
|
|
19
|
-
return backgroundColor === "s2" || backgroundColor === "s1" ? _variables.GlobalColors.s4 : _variables.GlobalColors.white;
|
|
20
|
-
}, _variables.GlobalColors.in_progress, _variables.GlobalColors.reception, _variables.GlobalColors.finished, _variables.GlobalColors.rejected_status, _variables.GlobalColors.s4, _variables.GlobalColors.exported, _variables.GlobalColors.original_purpura, _variables.GlobalColors.in_progress, _variables.GlobalColors.deep_gray, _variables.GlobalColors.s2, _variables.GlobalColors.s4);
|
|
21
|
-
|
|
22
|
-
exports.Container = Container;
|
|
@@ -1,30 +0,0 @@
|
|
|
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.default = exports.RatingStarsDefault = void 0;
|
|
9
|
-
|
|
10
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
11
|
-
|
|
12
|
-
var _ = require(".");
|
|
13
|
-
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
|
-
var _default = {
|
|
17
|
-
title: "Components/atoms/RatingStars",
|
|
18
|
-
component: _.RatingStars
|
|
19
|
-
};
|
|
20
|
-
exports.default = _default;
|
|
21
|
-
|
|
22
|
-
var Template = function Template(args) {
|
|
23
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.RatingStars, (0, _objectSpread2.default)({}, args));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
var RatingStarsDefault = Template.bind({});
|
|
27
|
-
exports.RatingStarsDefault = RatingStarsDefault;
|
|
28
|
-
RatingStarsDefault.args = {
|
|
29
|
-
percent: 80
|
|
30
|
-
};
|
|
@@ -1,53 +0,0 @@
|
|
|
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.RatingStars = void 0;
|
|
9
|
-
|
|
10
|
-
var _toConsumableArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/toConsumableArray"));
|
|
11
|
-
|
|
12
|
-
var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
|
|
13
|
-
|
|
14
|
-
var _styles = require("./styles");
|
|
15
|
-
|
|
16
|
-
var _freeRegularSvgIcons = require("@fortawesome/free-regular-svg-icons");
|
|
17
|
-
|
|
18
|
-
var _reactFontawesome = require("@fortawesome/react-fontawesome");
|
|
19
|
-
|
|
20
|
-
var _react = require("react");
|
|
21
|
-
|
|
22
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
23
|
-
|
|
24
|
-
var RatingStars = function RatingStars(_ref) {
|
|
25
|
-
var _ref$ratingValue = _ref.ratingValue,
|
|
26
|
-
ratingValue = _ref$ratingValue === void 0 ? 0 : _ref$ratingValue;
|
|
27
|
-
|
|
28
|
-
var _useState = (0, _react.useState)(0),
|
|
29
|
-
_useState2 = (0, _slicedToArray2.default)(_useState, 2),
|
|
30
|
-
rating = _useState2[0],
|
|
31
|
-
setRating = _useState2[1];
|
|
32
|
-
|
|
33
|
-
var handleRating = function handleRating(value) {
|
|
34
|
-
setRating(value);
|
|
35
|
-
};
|
|
36
|
-
|
|
37
|
-
(0, _react.useEffect)(function () {
|
|
38
|
-
setRating(ratingValue);
|
|
39
|
-
}, []);
|
|
40
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_styles.Container, {
|
|
41
|
-
children: (0, _toConsumableArray2.default)(Array(5)).map(function (_, index) {
|
|
42
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
|
|
43
|
-
className: "star ".concat(index < rating ? "active" : ""),
|
|
44
|
-
onClick: function onClick() {
|
|
45
|
-
return handleRating(index + 1);
|
|
46
|
-
},
|
|
47
|
-
children: "\u2605"
|
|
48
|
-
}, index);
|
|
49
|
-
})
|
|
50
|
-
});
|
|
51
|
-
};
|
|
52
|
-
|
|
53
|
-
exports.RatingStars = RatingStars;
|
|
@@ -1,18 +0,0 @@
|
|
|
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 _templateObject;
|
|
15
|
-
|
|
16
|
-
var Container = _styledComponents.default.div(_templateObject || (_templateObject = (0, _taggedTemplateLiteral2.default)(["\n font-size: 10px;\n display: flex;\n align-items: center;\n\n .star {\n cursor: pointer;\n font-size: 12px;\n color: #d9d9d9;\n transition: color 0.3s;\n line-height: 10px;\n\n &:hover {\n color: gold;\n }\n\n &.active {\n transform: scale(1.2);\n color: #8a6caa;\n }\n\n &:not(:first-child) {\n margin-left: 5px;\n }\n }\n"])));
|
|
17
|
-
|
|
18
|
-
exports.Container = Container;
|
|
@@ -1,48 +0,0 @@
|
|
|
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.default = exports.RetailerCatalogDefault = void 0;
|
|
9
|
-
|
|
10
|
-
var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/objectSpread2"));
|
|
11
|
-
|
|
12
|
-
var _ = require(".");
|
|
13
|
-
|
|
14
|
-
var _jsxRuntime = require("react/jsx-runtime");
|
|
15
|
-
|
|
16
|
-
var _default = {
|
|
17
|
-
title: "Components/atoms/RetailerCatalog",
|
|
18
|
-
component: _.RetailerCatalog
|
|
19
|
-
};
|
|
20
|
-
exports.default = _default;
|
|
21
|
-
|
|
22
|
-
var Template = function Template(args) {
|
|
23
|
-
return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.RetailerCatalog, (0, _objectSpread2.default)({}, args));
|
|
24
|
-
};
|
|
25
|
-
|
|
26
|
-
var RetailerCatalogDefault = Template.bind({});
|
|
27
|
-
exports.RetailerCatalogDefault = RetailerCatalogDefault;
|
|
28
|
-
RetailerCatalogDefault.args = {
|
|
29
|
-
limit: 3,
|
|
30
|
-
articleId: 39474,
|
|
31
|
-
orderId: 15270,
|
|
32
|
-
retailers: [{
|
|
33
|
-
id: 58,
|
|
34
|
-
name: "The Home Depot Golden"
|
|
35
|
-
}, {
|
|
36
|
-
id: 59,
|
|
37
|
-
name: "The Home Depot Platinum"
|
|
38
|
-
}, {
|
|
39
|
-
id: 60,
|
|
40
|
-
name: "The Home Depot Resizing"
|
|
41
|
-
}, {
|
|
42
|
-
id: 61,
|
|
43
|
-
name: "Home Depot TAB"
|
|
44
|
-
}, {
|
|
45
|
-
id: 68,
|
|
46
|
-
name: "The Home Depot Dropship"
|
|
47
|
-
}]
|
|
48
|
-
};
|