contentoh-components-library 21.4.22 → 21.4.24

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.
Files changed (168) hide show
  1. package/.env.development +2 -5
  2. package/.env.production +1 -3
  3. package/dist/components/atoms/Avatar/index.js +2 -3
  4. package/dist/components/atoms/Card/index.js +5 -46
  5. package/dist/components/atoms/Card/styles.js +1 -3
  6. package/dist/components/atoms/CheckBox/index.js +2 -7
  7. package/dist/components/atoms/CheckBox/styles.js +1 -1
  8. package/dist/components/atoms/InputFormatter/styles.js +1 -1
  9. package/dist/components/atoms/SliderToolTip/styles.js +1 -1
  10. package/dist/components/molecules/CarouselImagesLogin/index.js +1 -1
  11. package/dist/components/molecules/HeaderTop/index.js +11 -68
  12. package/dist/components/molecules/TagAndInput/index.js +1 -1
  13. package/dist/components/organisms/Chat/Chat.stories.js +8 -27
  14. package/dist/components/organisms/Chat/ContainerItems/index.js +3 -19
  15. package/dist/components/organisms/Chat/ContainerItems/styles.js +1 -1
  16. package/dist/components/organisms/Chat/ContentChat/index.js +197 -350
  17. package/dist/components/organisms/Chat/Footer/index.js +39 -48
  18. package/dist/components/organisms/Chat/index.js +4 -49
  19. package/dist/components/organisms/FullProductNameHeader/index.js +2 -2
  20. package/dist/components/organisms/Modal/styles.js +1 -1
  21. package/dist/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +116 -60
  22. package/dist/components/pages/ProviderProductEdition/index.js +142 -117
  23. package/dist/components/pages/ProviderProductEdition/styles.js +1 -1
  24. package/dist/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +4 -8
  25. package/dist/components/pages/RetailerProductEdition/index.js +308 -316
  26. package/dist/components/pages/RetailerProductEdition/styles.js +1 -1
  27. package/dist/components/pages/RetailerProductEdition/utils.js +2 -61
  28. package/dist/index.js +52 -247
  29. package/package.json +1 -4
  30. package/src/components/atoms/Avatar/index.js +2 -8
  31. package/src/components/atoms/Card/index.js +2 -35
  32. package/src/components/atoms/Card/styles.js +5 -41
  33. package/src/components/atoms/CheckBox/index.js +1 -4
  34. package/src/components/atoms/CheckBox/styles.js +0 -2
  35. package/src/components/atoms/InputFormatter/styles.js +1 -2
  36. package/src/components/atoms/SliderToolTip/styles.js +1 -1
  37. package/src/components/molecules/CarouselImagesLogin/index.js +1 -1
  38. package/src/components/molecules/HeaderTop/index.js +6 -52
  39. package/src/components/molecules/TagAndInput/index.js +8 -10
  40. package/src/components/organisms/Chat/Chat.stories.js +7 -27
  41. package/src/components/organisms/Chat/ContainerItems/index.js +2 -18
  42. package/src/components/organisms/Chat/ContainerItems/styles.js +2 -10
  43. package/src/components/organisms/Chat/ContentChat/index.js +12 -88
  44. package/src/components/organisms/Chat/Footer/index.js +0 -11
  45. package/src/components/organisms/Chat/index.js +4 -46
  46. package/src/components/organisms/FullProductNameHeader/index.js +1 -1
  47. package/src/components/organisms/Modal/styles.js +1 -4
  48. package/src/components/organisms/OrderDetail/utils/Table/utils.js +16 -6
  49. package/src/components/pages/ProviderProductEdition/ProviderProductEdition.stories.js +116 -66
  50. package/src/components/pages/ProviderProductEdition/index.js +129 -97
  51. package/src/components/pages/ProviderProductEdition/styles.js +1 -5
  52. package/src/components/pages/RetailerProductEdition/RetailerProductEdition.stories.js +3 -7
  53. package/src/components/pages/RetailerProductEdition/index.js +184 -158
  54. package/src/components/pages/RetailerProductEdition/styles.js +0 -4
  55. package/src/components/pages/RetailerProductEdition/utils.js +0 -37
  56. package/src/index.js +0 -16
  57. package/dist/components/atoms/ImageCarousel/ImgeSlider.stories.js +0 -90
  58. package/dist/components/atoms/ImageCarousel/index.js +0 -120
  59. package/dist/components/atoms/ImageCarousel/styles.js +0 -18
  60. package/dist/components/atoms/PercentTag/PercentTag.stories.js +0 -31
  61. package/dist/components/atoms/PercentTag/index.js +0 -23
  62. package/dist/components/atoms/PercentTag/styles.js +0 -22
  63. package/dist/components/atoms/RatingStars/RatingStars.stories.js +0 -30
  64. package/dist/components/atoms/RatingStars/index.js +0 -53
  65. package/dist/components/atoms/RatingStars/styles.js +0 -18
  66. package/dist/components/atoms/RetailerCatalog/RetailerCatalog.stories.js +0 -48
  67. package/dist/components/atoms/RetailerCatalog/index.js +0 -69
  68. package/dist/components/atoms/RetailerCatalog/styles.js +0 -20
  69. package/dist/components/atoms/RetailerOption/RetailerOption.stories.js +0 -33
  70. package/dist/components/atoms/RetailerOption/index.js +0 -62
  71. package/dist/components/atoms/RetailerOption/styles.js +0 -20
  72. package/dist/components/atoms/RetailersList/RetailersList.stories.js +0 -45
  73. package/dist/components/atoms/RetailersList/index.js +0 -46
  74. package/dist/components/atoms/RetailersList/styles.js +0 -18
  75. package/dist/components/atoms/UserCatalog/UserCatalog.stories.js +0 -73
  76. package/dist/components/atoms/UserCatalog/index.js +0 -101
  77. package/dist/components/atoms/UserCatalog/styles.js +0 -18
  78. package/dist/components/atoms/UserOption/UserOption.stories.js +0 -40
  79. package/dist/components/atoms/UserOption/index.js +0 -130
  80. package/dist/components/atoms/UserOption/styles.js +0 -20
  81. package/dist/components/atoms/UserSelector/UserSelector.stories.js +0 -40
  82. package/dist/components/atoms/UserSelector/index.js +0 -98
  83. package/dist/components/atoms/UserSelector/styles.js +0 -32
  84. package/dist/components/molecules/GridItem/GridItem.stories.js +0 -123
  85. package/dist/components/molecules/GridItem/index.js +0 -152
  86. package/dist/components/molecules/GridItem/styles.js +0 -20
  87. package/dist/components/molecules/HeaderItem/ColumnItem.js +0 -23
  88. package/dist/components/molecules/HeaderItem/HeaderItem.stories.js +0 -70
  89. package/dist/components/molecules/HeaderItem/index.js +0 -42
  90. package/dist/components/molecules/HeaderItem/styles.js +0 -30
  91. package/dist/components/molecules/RowItem/ColumnItem.js +0 -23
  92. package/dist/components/molecules/RowItem/RowItem.stories.js +0 -5242
  93. package/dist/components/molecules/RowItem/index.js +0 -58
  94. package/dist/components/molecules/RowItem/styles.js +0 -30
  95. package/dist/components/molecules/StripeCardForm/StripeCardForm.stories.js +0 -31
  96. package/dist/components/molecules/StripeCardForm/index.js +0 -87
  97. package/dist/components/molecules/StripeCardForm/paymentForm.js +0 -191
  98. package/dist/components/molecules/StripeCardForm/styles.js +0 -24
  99. package/dist/components/molecules/StripeCardSelector/CardSelector.stories.js +0 -30
  100. package/dist/components/molecules/StripeCardSelector/index.js +0 -107
  101. package/dist/components/molecules/StripeCardSelector/styles.js +0 -19
  102. package/dist/components/molecules/StripeCardSelector/utils.js +0 -56
  103. package/dist/components/organisms/GridProducts/GridProducts.stories.js +0 -5097
  104. package/dist/components/organisms/GridProducts/index.js +0 -63
  105. package/dist/components/organisms/GridProducts/styles.js +0 -18
  106. package/dist/components/organisms/GridProducts/utils.js +0 -149
  107. package/dist/components/organisms/PanelLayout/PanelLayout.stories.js +0 -87
  108. package/dist/components/organisms/PanelLayout/index.js +0 -29
  109. package/dist/components/organisms/PanelLayout/styles.js +0 -32
  110. package/dist/components/organisms/SideModal/SideModal.stories.js +0 -42
  111. package/dist/components/organisms/SideModal/index.js +0 -72
  112. package/dist/components/organisms/SideModal/styles.js +0 -18
  113. package/src/components/atoms/ImageCarousel/ImgeSlider.stories.js +0 -76
  114. package/src/components/atoms/ImageCarousel/index.js +0 -103
  115. package/src/components/atoms/ImageCarousel/styles.js +0 -79
  116. package/src/components/atoms/PercentTag/PercentTag.stories.js +0 -7
  117. package/src/components/atoms/PercentTag/index.js +0 -9
  118. package/src/components/atoms/PercentTag/styles.js +0 -69
  119. package/src/components/atoms/RatingStars/RatingStars.stories.js +0 -10
  120. package/src/components/atoms/RatingStars/index.js +0 -31
  121. package/src/components/atoms/RatingStars/styles.js +0 -28
  122. package/src/components/atoms/RetailerCatalog/RetailerCatalog.stories.js +0 -36
  123. package/src/components/atoms/RetailerCatalog/index.js +0 -49
  124. package/src/components/atoms/RetailerCatalog/styles.js +0 -30
  125. package/src/components/atoms/RetailerOption/RetailerOption.stories.js +0 -15
  126. package/src/components/atoms/RetailerOption/index.js +0 -53
  127. package/src/components/atoms/RetailerOption/styles.js +0 -41
  128. package/src/components/atoms/RetailersList/RetailersList.stories.js +0 -33
  129. package/src/components/atoms/RetailersList/index.js +0 -20
  130. package/src/components/atoms/RetailersList/styles.js +0 -19
  131. package/src/components/atoms/UserCatalog/UserCatalog.stories.js +0 -67
  132. package/src/components/atoms/UserCatalog/index.js +0 -100
  133. package/src/components/atoms/UserCatalog/styles.js +0 -24
  134. package/src/components/atoms/UserOption/UserOption.stories.js +0 -25
  135. package/src/components/atoms/UserOption/index.js +0 -95
  136. package/src/components/atoms/UserOption/styles.js +0 -61
  137. package/src/components/atoms/UserSelector/UserSelector.stories.js +0 -25
  138. package/src/components/atoms/UserSelector/index.js +0 -86
  139. package/src/components/atoms/UserSelector/styles.js +0 -55
  140. package/src/components/molecules/GridItem/GridItem.stories.js +0 -126
  141. package/src/components/molecules/GridItem/index.js +0 -105
  142. package/src/components/molecules/GridItem/styles.js +0 -104
  143. package/src/components/molecules/HeaderItem/ColumnItem.js +0 -9
  144. package/src/components/molecules/HeaderItem/HeaderItem.stories.js +0 -24
  145. package/src/components/molecules/HeaderItem/index.js +0 -26
  146. package/src/components/molecules/HeaderItem/styles.js +0 -27
  147. package/src/components/molecules/RowItem/ColumnItem.js +0 -9
  148. package/src/components/molecules/RowItem/RowItem.stories.js +0 -5660
  149. package/src/components/molecules/RowItem/index.js +0 -45
  150. package/src/components/molecules/RowItem/styles.js +0 -40
  151. package/src/components/molecules/StripeCardForm/StripeCardForm.stories.js +0 -13
  152. package/src/components/molecules/StripeCardForm/index.js +0 -42
  153. package/src/components/molecules/StripeCardForm/paymentForm.js +0 -124
  154. package/src/components/molecules/StripeCardForm/styles.js +0 -73
  155. package/src/components/molecules/StripeCardSelector/CardSelector.stories.js +0 -12
  156. package/src/components/molecules/StripeCardSelector/index.js +0 -44
  157. package/src/components/molecules/StripeCardSelector/styles.js +0 -4
  158. package/src/components/molecules/StripeCardSelector/utils.js +0 -17
  159. package/src/components/organisms/GridProducts/GridProducts.stories.js +0 -5485
  160. package/src/components/organisms/GridProducts/index.js +0 -50
  161. package/src/components/organisms/GridProducts/styles.js +0 -14
  162. package/src/components/organisms/GridProducts/utils.js +0 -111
  163. package/src/components/organisms/PanelLayout/PanelLayout.stories.js +0 -63
  164. package/src/components/organisms/PanelLayout/index.js +0 -11
  165. package/src/components/organisms/PanelLayout/styles.js +0 -39
  166. package/src/components/organisms/SideModal/SideModal.stories.js +0 -23
  167. package/src/components/organisms/SideModal/index.js +0 -50
  168. package/src/components/organisms/SideModal/styles.js +0 -30
@@ -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: 174px;\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
- };
@@ -1,69 +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.RetailerCatalog = void 0;
9
-
10
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
11
-
12
- var _react = require("react");
13
-
14
- var _Avatar = require("../Avatar");
15
-
16
- var _styles = require("./styles");
17
-
18
- var _customHooks = require("../../../global-files/customHooks");
19
-
20
- var _RetailersList = require("../RetailersList");
21
-
22
- var _jsxRuntime = require("react/jsx-runtime");
23
-
24
- var RetailerCatalog = function RetailerCatalog(_ref) {
25
- var _ref$retailers = _ref.retailers,
26
- retailers = _ref$retailers === void 0 ? [] : _ref$retailers,
27
- _ref$limit = _ref.limit,
28
- limit = _ref$limit === void 0 ? 3 : _ref$limit,
29
- article = _ref.article,
30
- _ref$id = _ref.id,
31
- id = _ref$id === void 0 ? "retailers-catalog" : _ref$id;
32
-
33
- var _useState = (0, _react.useState)(0),
34
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
35
- retLimit = _useState2[0],
36
- setRetLimit = _useState2[1];
37
-
38
- var _useCloseModal = (0, _customHooks.useCloseModal)(id),
39
- _useCloseModal2 = (0, _slicedToArray2.default)(_useCloseModal, 2),
40
- showRetailers = _useCloseModal2[0],
41
- setShowRetailers = _useCloseModal2[1];
42
-
43
- (0, _react.useEffect)(function () {
44
- setRetLimit(limit);
45
- }, [retailers]);
46
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
47
- onClick: function onClick(e) {
48
- setShowRetailers(!showRetailers);
49
- },
50
- id: id,
51
- children: [retailers.map(function (retailer, i) {
52
- return i < limit && /*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.Avatar, {
53
- image: "https://content-management-images.s3.amazonaws.com/retailers/".concat(retailer.id, ".png"),
54
- altText: retailer === null || retailer === void 0 ? void 0 : retailer.name,
55
- imageType: "medium-image"
56
- }, retailer.id + "-" + i);
57
- }), retailers.length > retLimit && /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
58
- className: "retailers-limit",
59
- children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
60
- children: ["+", retailers.length - retLimit]
61
- })
62
- }), showRetailers && /*#__PURE__*/(0, _jsxRuntime.jsx)(_RetailersList.RetailersList, {
63
- retailers: retailers,
64
- article: article
65
- })]
66
- });
67
- };
68
-
69
- exports.RetailerCatalog = RetailerCatalog;
@@ -1,20 +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 display: flex;\n align-items: center;\n justify-content: center;\n cursor: pointer;\n position: relative;\n width: 100%;\n\n .retailers-limit {\n width: 26px;\n height: 26px;\n border-radius: 50%;\n background-color: #f0f0f0;\n\n p {\n font-family: ", ";\n font-size: 12px;\n line-height: 26px;\n color: #262626;\n text-align: center;\n }\n }\n\n > * + * {\n margin-left: -5px;\n }\n"])), _variables.FontFamily.Lato);
19
-
20
- exports.Container = Container;
@@ -1,33 +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.RetailerOptionDefault = 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/RetailerOptions",
18
- component: _.RetailerOption
19
- };
20
- exports.default = _default;
21
-
22
- var Template = function Template(args) {
23
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.RetailerOption, (0, _objectSpread2.default)({}, args));
24
- };
25
-
26
- var RetailerOptionDefault = Template.bind({});
27
- exports.RetailerOptionDefault = RetailerOptionDefault;
28
- RetailerOptionDefault.args = {
29
- retailer: {
30
- id: 58,
31
- name: "The Home Depot Golden"
32
- }
33
- };
@@ -1,62 +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.RetailerOption = void 0;
9
-
10
- var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/esm/slicedToArray"));
11
-
12
- var _react = require("react");
13
-
14
- var _Avatar = require("../Avatar");
15
-
16
- var _styles = require("./styles");
17
-
18
- var _jsxRuntime = require("react/jsx-runtime");
19
-
20
- var RetailerOption = function RetailerOption(_ref) {
21
- var retailer = _ref.retailer,
22
- _ref$services = _ref.services,
23
- services = _ref$services === void 0 ? {} : _ref$services;
24
-
25
- var _useState = (0, _react.useState)([]),
26
- _useState2 = (0, _slicedToArray2.default)(_useState, 2),
27
- service = _useState2[0],
28
- setService = _useState2[1];
29
-
30
- (0, _react.useEffect)(function () {
31
- if (services[retailer.id]) {
32
- setService(Object.keys(services[retailer.id]));
33
- }
34
- }, [services]);
35
- return /*#__PURE__*/(0, _jsxRuntime.jsxs)(_styles.Container, {
36
- children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
37
- className: "avatar-and-retailer",
38
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)(_Avatar.Avatar, {
39
- image: "https://content-management-images.s3.amazonaws.com/retailers/".concat(retailer.id, ".png"),
40
- altText: retailer === null || retailer === void 0 ? void 0 : retailer.name,
41
- imageType: "medium-image"
42
- }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
43
- className: "retailer-name",
44
- children: retailer === null || retailer === void 0 ? void 0 : retailer.name
45
- })]
46
- }), /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
47
- className: "services-icons",
48
- children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
49
- className: "material-icons small ".concat(service.includes("datasheet") && "is-active"),
50
- children: "\uF8EE"
51
- }, "datasheet"), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
52
- className: "material-icons small ".concat(service.includes("description") && "is-active"),
53
- children: "\uE873"
54
- }, "description"), /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
55
- className: "material-icons small ".concat(service.includes("images") && "is-active"),
56
- children: "\uE3F4"
57
- }, "images")]
58
- })]
59
- });
60
- };
61
-
62
- exports.RetailerOption = RetailerOption;
@@ -1,20 +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 display: flex;\n padding: 7px;\n border: 1px solid #f0f0f0;\n align-items: center;\n justify-content: space-between;\n border-radius: 5px;\n\n .avatar-and-retailer {\n display: flex;\n align-items: center;\n .retailer-name {\n font-family: ", ";\n font-size: 12px;\n color: #262626;\n }\n\n > * + * {\n margin-left: 10px;\n }\n }\n\n .services-icons {\n display: flex;\n\n span {\n color: #f0f0f0;\n font-size: 14px;\n &.is-active {\n color: #8a6caa;\n }\n }\n\n > * + * {\n margin-left: 9px;\n }\n }\n"])), _variables.FontFamily.Lato);
19
-
20
- exports.Container = Container;
@@ -1,45 +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.RetailersListDefault = 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/RetailersList",
18
- component: _.RetailersList
19
- };
20
- exports.default = _default;
21
-
22
- var Template = function Template(args) {
23
- return /*#__PURE__*/(0, _jsxRuntime.jsx)(_.RetailersList, (0, _objectSpread2.default)({}, args));
24
- };
25
-
26
- var RetailersListDefault = Template.bind({});
27
- exports.RetailersListDefault = RetailersListDefault;
28
- RetailersListDefault.args = {
29
- retailers: [{
30
- id: 58,
31
- name: "The Home Depot Golden"
32
- }, {
33
- id: 59,
34
- name: "The Home Depot Platinum"
35
- }, {
36
- id: 60,
37
- name: "The Home Depot Resizing"
38
- }, {
39
- id: 61,
40
- name: "Home Depot TAB"
41
- }, {
42
- id: 68,
43
- name: "The Home Depot Dropship"
44
- }]
45
- };