@blaze-cms/react-page-builder 0.123.0-alpha.20 → 0.123.0-alpha.21
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/CHANGELOG.md +8 -0
- package/lib/components/Card/CardContainer.js +16 -4
- package/lib/components/Card/CardContainer.js.map +1 -1
- package/lib/components/CarouselWrapper.js +12 -5
- package/lib/components/CarouselWrapper.js.map +1 -1
- package/lib-es/components/Card/CardContainer.js +17 -5
- package/lib-es/components/Card/CardContainer.js.map +1 -1
- package/lib-es/components/CarouselWrapper.js +12 -5
- package/lib-es/components/CarouselWrapper.js.map +1 -1
- package/package.json +2 -2
- package/src/components/Card/CardContainer.js +14 -2
- package/src/components/CarouselWrapper.js +8 -5
- package/tests/unit/src/components/Card/mockData.js +2 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,14 @@
|
|
|
3
3
|
All notable changes to this project will be documented in this file.
|
|
4
4
|
See [Conventional Commits](https://conventionalcommits.org) for commit guidelines.
|
|
5
5
|
|
|
6
|
+
# [0.123.0-alpha.21](https://github.com/thebyte9/blaze/compare/v0.123.0-alpha.20...v0.123.0-alpha.21) (2022-04-01)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @blaze-cms/react-page-builder
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
# [0.123.0-alpha.20](https://github.com/thebyte9/blaze/compare/v0.123.0-alpha.19...v0.123.0-alpha.20) (2022-04-01)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @blaze-cms/react-page-builder
|
|
@@ -55,7 +55,7 @@ var _helpers2 = require("../../helpers");
|
|
|
55
55
|
|
|
56
56
|
var _utils = require("../../utils");
|
|
57
57
|
|
|
58
|
-
var _excluded = ["cardData", "gridModifier", "style", "displayCategory", "displayThumbnail", "displayTitle", "modifier", "entity", "propsToDisplay", "gtmChildren", "cardChildren", "name", "designConfig", "itemsPerRow", "enableCarousel", "bannerModifier", "priorityLimit", "enableAutoScroll", "autoScrollTimer"],
|
|
58
|
+
var _excluded = ["cardData", "gridModifier", "style", "displayCategory", "displayThumbnail", "displayTitle", "modifier", "entity", "propsToDisplay", "gtmChildren", "cardChildren", "name", "designConfig", "itemsPerRow", "enableCarousel", "bannerModifier", "priorityLimit", "enableAutoScroll", "enableOverlay", "autoScrollTimer", "arrowSize", "overlayModifier"],
|
|
59
59
|
_excluded2 = ["baseAdunit", "id"];
|
|
60
60
|
|
|
61
61
|
function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
|
|
@@ -81,7 +81,10 @@ var CardContainer = function CardContainer(_ref) {
|
|
|
81
81
|
bannerModifier = _ref.bannerModifier,
|
|
82
82
|
priorityLimit = _ref.priorityLimit,
|
|
83
83
|
enableAutoScroll = _ref.enableAutoScroll,
|
|
84
|
+
enableOverlay = _ref.enableOverlay,
|
|
84
85
|
autoScrollTimer = _ref.autoScrollTimer,
|
|
86
|
+
arrowSize = _ref.arrowSize,
|
|
87
|
+
overlayModifier = _ref.overlayModifier,
|
|
85
88
|
cardProps = (0, _objectWithoutProperties2["default"])(_ref, _excluded);
|
|
86
89
|
var entities = (0, _helpers2.getEntitiesWithBanner)(cardData, cardProps);
|
|
87
90
|
|
|
@@ -131,7 +134,10 @@ var CardContainer = function CardContainer(_ref) {
|
|
|
131
134
|
displayCategory: displayCategory,
|
|
132
135
|
displayThumbnail: displayThumbnail,
|
|
133
136
|
displayTitle: displayTitle,
|
|
134
|
-
priority: priority
|
|
137
|
+
priority: priority,
|
|
138
|
+
arrowSize: arrowSize,
|
|
139
|
+
enableOverlay: enableOverlay,
|
|
140
|
+
overlayModifier: overlayModifier
|
|
135
141
|
}, entityProps));
|
|
136
142
|
}));
|
|
137
143
|
};
|
|
@@ -155,7 +161,10 @@ CardContainer.propTypes = {
|
|
|
155
161
|
bannerModifier: _propTypes["default"].string,
|
|
156
162
|
priorityLimit: _propTypes["default"].number,
|
|
157
163
|
enableAutoScroll: _propTypes["default"].bool,
|
|
158
|
-
|
|
164
|
+
enableOverlay: _propTypes["default"].bool,
|
|
165
|
+
overlayModifier: _propTypes["default"].string,
|
|
166
|
+
autoScrollTimer: _propTypes["default"].number,
|
|
167
|
+
arrowSize: _propTypes["default"].string
|
|
159
168
|
};
|
|
160
169
|
CardContainer.defaultProps = {
|
|
161
170
|
gtmChildren: [],
|
|
@@ -174,7 +183,10 @@ CardContainer.defaultProps = {
|
|
|
174
183
|
bannerModifier: '',
|
|
175
184
|
priorityLimit: 0,
|
|
176
185
|
enableAutoScroll: false,
|
|
177
|
-
|
|
186
|
+
enableOverlay: false,
|
|
187
|
+
autoScrollTimer: 0,
|
|
188
|
+
overlayModifier: '',
|
|
189
|
+
arrowSize: ''
|
|
178
190
|
};
|
|
179
191
|
|
|
180
192
|
var _default = (0, _HOC.withTitle)(CardContainer);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Card/CardContainer.js"],"names":["CardContainer","cardData","gridModifier","style","displayCategory","displayThumbnail","displayTitle","modifier","entity","propsToDisplay","gtmChildren","cardChildren","name","designConfig","itemsPerRow","enableCarousel","bannerModifier","priorityLimit","enableAutoScroll","autoScrollTimer","cardProps","entities","MainContext","itemId","propsToDisplayModifiers","dynamicWrapperSizes","cardBannerIndex","CardWrapper","CarouselWrapper","Wrapper","map","index","baseAdunit","id","entityProps","extraProps","dynamicKey","join","priority","propTypes","PropTypes","array","isRequired","string","oneOfType","arrayOf","node","bool","object","number","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;AACA;;;;;;;;;AAEA,IAAMA,aAAa,GAAG,SAAhBA,aAAgB,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Card/CardContainer.js"],"names":["CardContainer","cardData","gridModifier","style","displayCategory","displayThumbnail","displayTitle","modifier","entity","propsToDisplay","gtmChildren","cardChildren","name","designConfig","itemsPerRow","enableCarousel","bannerModifier","priorityLimit","enableAutoScroll","enableOverlay","autoScrollTimer","arrowSize","overlayModifier","cardProps","entities","MainContext","itemId","propsToDisplayModifiers","dynamicWrapperSizes","cardBannerIndex","CardWrapper","CarouselWrapper","Wrapper","map","index","baseAdunit","id","entityProps","extraProps","dynamicKey","join","priority","propTypes","PropTypes","array","isRequired","string","oneOfType","arrayOf","node","bool","object","number","defaultProps"],"mappings":"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","sourcesContent":["import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { MainContext } from '@blaze-cms/nextjs-components';\nimport { withTitle } from '../../HOC';\nimport Banner from '../Banner';\nimport Wrapper from '../Wrapper';\nimport CarouselWrapper from '../CarouselWrapper';\nimport Card from './Card';\nimport { getDynamicGridClasses } from './helpers';\nimport { getEntitiesWithBanner, parsePropsToDisplay } from '../../helpers';\nimport { getPropsToDisplayModifiers } from '../../utils';\n\nconst CardContainer = ({\n cardData,\n gridModifier,\n style,\n displayCategory,\n displayThumbnail,\n displayTitle,\n modifier,\n entity,\n propsToDisplay,\n gtmChildren,\n cardChildren,\n name,\n designConfig,\n itemsPerRow,\n enableCarousel,\n bannerModifier,\n priorityLimit,\n enableAutoScroll,\n enableOverlay,\n autoScrollTimer,\n arrowSize,\n overlayModifier,\n ...cardProps\n}) => {\n const entities = getEntitiesWithBanner(cardData, cardProps);\n const { itemId } = useContext(MainContext);\n const propsToDisplayModifiers = getPropsToDisplayModifiers(propsToDisplay);\n const dynamicWrapperSizes = enableCarousel\n ? ''\n : getDynamicGridClasses('grid', itemsPerRow, designConfig);\n let cardBannerIndex = 0;\n const CardWrapper = enableCarousel ? CarouselWrapper : Wrapper;\n\n return (\n <CardWrapper\n className={dynamicWrapperSizes}\n modifiers={gridModifier}\n itemsPerRow={itemsPerRow}\n bannerModifier={bannerModifier}\n enableAutoScroll={enableAutoScroll}\n autoScrollTimer={autoScrollTimer}>\n {entities.map(({ baseAdunit, id, ...entityProps }, index) => {\n const extraProps = parsePropsToDisplay(entityProps, propsToDisplay);\n const dynamicKey = [itemId, index].join('-');\n if (baseAdunit) cardBannerIndex += 1;\n\n const priority = priorityLimit > 0 && index + 1 <= priorityLimit;\n\n return baseAdunit ? (\n <Banner\n key={dynamicKey}\n entity={entity}\n baseAdunit={baseAdunit}\n {...entityProps}\n modifier={modifier}\n cardBannerIndex={cardBannerIndex}\n />\n ) : (\n <Card\n key={id}\n id={id}\n enableCarousel={enableCarousel}\n entity={entity}\n propsToDisplay={extraProps}\n propsToDisplayModifiers={propsToDisplayModifiers}\n modifier={modifier}\n style={style}\n cardChildren={cardChildren}\n gtmChildren={gtmChildren}\n gtmId={name}\n gridModifier={gridModifier}\n entityProps={entityProps}\n displayCategory={displayCategory}\n displayThumbnail={displayThumbnail}\n displayTitle={displayTitle}\n priority={priority}\n arrowSize={arrowSize}\n enableOverlay={enableOverlay}\n overlayModifier={overlayModifier}\n {...entityProps}\n />\n );\n })}\n </CardWrapper>\n );\n};\n\nCardContainer.propTypes = {\n cardData: PropTypes.array.isRequired,\n name: PropTypes.string,\n entity: PropTypes.string.isRequired,\n gridModifier: PropTypes.string,\n gtmChildren: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n cardChildren: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n propsToDisplay: PropTypes.array,\n displayCategory: PropTypes.bool,\n displayThumbnail: PropTypes.bool,\n displayTitle: PropTypes.bool,\n modifier: PropTypes.string,\n style: PropTypes.string,\n designConfig: PropTypes.object,\n itemsPerRow: PropTypes.number,\n enableCarousel: PropTypes.bool,\n bannerModifier: PropTypes.string,\n priorityLimit: PropTypes.number,\n enableAutoScroll: PropTypes.bool,\n enableOverlay: PropTypes.bool,\n overlayModifier: PropTypes.string,\n autoScrollTimer: PropTypes.number,\n arrowSize: PropTypes.string\n};\n\nCardContainer.defaultProps = {\n gtmChildren: [],\n cardChildren: [],\n name: '',\n gridModifier: '',\n propsToDisplay: [],\n displayCategory: true,\n displayThumbnail: true,\n displayTitle: true,\n modifier: '',\n style: 'portrait',\n designConfig: {},\n itemsPerRow: 1,\n enableCarousel: false,\n bannerModifier: '',\n priorityLimit: 0,\n enableAutoScroll: false,\n enableOverlay: false,\n autoScrollTimer: 0,\n overlayModifier: '',\n arrowSize: ''\n};\n\nexport default withTitle(CardContainer);\n"],"file":"CardContainer.js"}
|
|
@@ -42,7 +42,8 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
|
|
|
42
42
|
bannerModifier = _ref.bannerModifier,
|
|
43
43
|
itemsPerRow = _ref.itemsPerRow,
|
|
44
44
|
enableAutoScroll = _ref.enableAutoScroll,
|
|
45
|
-
autoScrollTimer = _ref.autoScrollTimer
|
|
45
|
+
autoScrollTimer = _ref.autoScrollTimer,
|
|
46
|
+
arrowSize = _ref.arrowSize;
|
|
46
47
|
var ref = (0, _react.useRef)();
|
|
47
48
|
|
|
48
49
|
var _useState = (0, _react.useState)({
|
|
@@ -128,7 +129,9 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
|
|
|
128
129
|
setShouldAutoScroll(false);
|
|
129
130
|
handleButtonNavigation();
|
|
130
131
|
}
|
|
131
|
-
}, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleLeft,
|
|
132
|
+
}, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleLeft, {
|
|
133
|
+
size: arrowSize
|
|
134
|
+
})))), /*#__PURE__*/_react["default"].createElement("div", {
|
|
132
135
|
className: "cards-carousel--right-button-wrapper"
|
|
133
136
|
}, displayRight && /*#__PURE__*/_react["default"].createElement("button", {
|
|
134
137
|
type: "button",
|
|
@@ -137,7 +140,9 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
|
|
|
137
140
|
setShouldAutoScroll(false);
|
|
138
141
|
handleButtonNavigation(true);
|
|
139
142
|
}
|
|
140
|
-
}, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleRight,
|
|
143
|
+
}, /*#__PURE__*/_react["default"].createElement("i", null, /*#__PURE__*/_react["default"].createElement(_fa.FaAngleRight, {
|
|
144
|
+
size: arrowSize
|
|
145
|
+
})))), /*#__PURE__*/_react["default"].createElement("div", {
|
|
141
146
|
className: contentClassName,
|
|
142
147
|
ref: ref,
|
|
143
148
|
onScroll: handleScroll
|
|
@@ -149,14 +154,16 @@ CarouselWrapper.propTypes = {
|
|
|
149
154
|
itemsPerRow: _propTypes["default"].number,
|
|
150
155
|
children: _propTypes["default"].oneOfType([_propTypes["default"].arrayOf(_propTypes["default"].node), _propTypes["default"].node]),
|
|
151
156
|
enableAutoScroll: _propTypes["default"].bool,
|
|
152
|
-
autoScrollTimer: _propTypes["default"].number
|
|
157
|
+
autoScrollTimer: _propTypes["default"].number,
|
|
158
|
+
arrowSize: _propTypes["default"].number
|
|
153
159
|
};
|
|
154
160
|
CarouselWrapper.defaultProps = {
|
|
155
161
|
itemsPerRow: 0,
|
|
156
162
|
bannerModifier: '',
|
|
157
163
|
children: [],
|
|
158
164
|
enableAutoScroll: false,
|
|
159
|
-
autoScrollTimer: 0
|
|
165
|
+
autoScrollTimer: 0,
|
|
166
|
+
arrowSize: 14
|
|
160
167
|
};
|
|
161
168
|
var _default = CarouselWrapper;
|
|
162
169
|
exports["default"] = _default;
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","ref","displayLeft","displayRight","buttonDisplay","setButtonDisplays","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","PropTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA;;AACA;;AACA;;;;;;AAEA,IAAMA,eAAe,GAAG,SAAlBA,eAAkB,
|
|
1
|
+
{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","arrowSize","ref","displayLeft","displayRight","buttonDisplay","setButtonDisplays","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","PropTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { FaAngleLeft, FaAngleRight } from 'react-icons/fa';\n\nconst CarouselWrapper = ({\n children,\n bannerModifier,\n itemsPerRow,\n enableAutoScroll,\n autoScrollTimer,\n arrowSize\n}) => {\n const ref = useRef();\n const [buttonDisplay, setButtonDisplays] = useState({ displayLeft: false, displayRight: true });\n const [shouldAutoScroll, setShouldAutoScroll] = useState(false);\n const autoScrollRef = useRef();\n\n useEffect(\n () => {\n autoScrollRef.current = shouldAutoScroll;\n const id = setInterval(scrollCheck, autoScrollTimer);\n function scrollCheck() {\n if (!autoScrollRef.current) {\n clearInterval(id);\n } else {\n handleButtonNavigation(true);\n }\n }\n\n return () => clearInterval(id);\n },\n [autoScrollTimer, shouldAutoScroll]\n );\n\n useEffect(\n () => {\n const {\n current: { offsetWidth, scrollWidth }\n } = ref;\n if (scrollWidth <= offsetWidth)\n setButtonDisplays({ displayLeft: false, displayRight: false });\n setShouldAutoScroll(enableAutoScroll);\n },\n [enableAutoScroll]\n );\n\n const handleScroll = () => {\n const {\n current: { offsetWidth, scrollLeft, scrollWidth }\n } = ref;\n const updatedDisplayLeft = !!scrollLeft;\n const updatedDisplayRight = scrollLeft + offsetWidth + 1 < scrollWidth;\n setButtonDisplays({ displayLeft: updatedDisplayLeft, displayRight: updatedDisplayRight });\n };\n\n const handleButtonNavigation = direction => {\n if (!ref || !ref.current) return;\n const {\n current: { offsetWidth, scrollLeft, scrollWidth }\n } = ref;\n\n if (autoScrollRef.current && scrollLeft + offsetWidth >= scrollWidth) {\n ref.current.scrollLeft = 0;\n } else {\n ref.current.scrollLeft = direction ? scrollLeft + offsetWidth : scrollLeft - offsetWidth;\n }\n };\n\n const { displayLeft, displayRight } = buttonDisplay;\n const wrapperClassName = `cards-carousel${bannerModifier}`;\n const contentClassName = `cards-carousel--content items-per-row-${itemsPerRow}`;\n\n return (\n <div className={wrapperClassName}>\n <div className=\"cards-carousel--left-button-wrapper\">\n {displayLeft && (\n <button\n type=\"button\"\n className=\"cards-carousel--button-back icon-button icon\"\n onClick={() => {\n setShouldAutoScroll(false);\n handleButtonNavigation();\n }}>\n <i>\n <FaAngleLeft size={arrowSize} />\n </i>\n </button>\n )}\n </div>\n <div className=\"cards-carousel--right-button-wrapper\">\n {displayRight && (\n <button\n type=\"button\"\n className=\"cards-carousel--button-forward icon-button icon\"\n onClick={() => {\n setShouldAutoScroll(false);\n handleButtonNavigation(true);\n }}>\n <i>\n <FaAngleRight size={arrowSize} />\n </i>\n </button>\n )}\n </div>\n <div className={contentClassName} ref={ref} onScroll={handleScroll}>\n {children}\n </div>\n </div>\n );\n};\n\nCarouselWrapper.propTypes = {\n bannerModifier: PropTypes.string,\n itemsPerRow: PropTypes.number,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n enableAutoScroll: PropTypes.bool,\n autoScrollTimer: PropTypes.number,\n arrowSize: PropTypes.number\n};\n\nCarouselWrapper.defaultProps = {\n itemsPerRow: 0,\n bannerModifier: '',\n children: [],\n enableAutoScroll: false,\n autoScrollTimer: 0,\n arrowSize: 14\n};\n\nexport default CarouselWrapper;\n"],"file":"CarouselWrapper.js"}
|
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import _extends from "@babel/runtime/helpers/extends";
|
|
2
2
|
import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
|
|
3
|
-
const _excluded = ["cardData", "gridModifier", "style", "displayCategory", "displayThumbnail", "displayTitle", "modifier", "entity", "propsToDisplay", "gtmChildren", "cardChildren", "name", "designConfig", "itemsPerRow", "enableCarousel", "bannerModifier", "priorityLimit", "enableAutoScroll", "autoScrollTimer"],
|
|
3
|
+
const _excluded = ["cardData", "gridModifier", "style", "displayCategory", "displayThumbnail", "displayTitle", "modifier", "entity", "propsToDisplay", "gtmChildren", "cardChildren", "name", "designConfig", "itemsPerRow", "enableCarousel", "bannerModifier", "priorityLimit", "enableAutoScroll", "enableOverlay", "autoScrollTimer", "arrowSize", "overlayModifier"],
|
|
4
4
|
_excluded2 = ["baseAdunit", "id"];
|
|
5
5
|
import React, { useContext } from 'react';
|
|
6
6
|
import PropTypes from 'prop-types';
|
|
@@ -34,7 +34,10 @@ const CardContainer = _ref => {
|
|
|
34
34
|
bannerModifier,
|
|
35
35
|
priorityLimit,
|
|
36
36
|
enableAutoScroll,
|
|
37
|
-
|
|
37
|
+
enableOverlay,
|
|
38
|
+
autoScrollTimer,
|
|
39
|
+
arrowSize,
|
|
40
|
+
overlayModifier
|
|
38
41
|
} = _ref,
|
|
39
42
|
cardProps = _objectWithoutProperties(_ref, _excluded);
|
|
40
43
|
|
|
@@ -88,7 +91,10 @@ const CardContainer = _ref => {
|
|
|
88
91
|
displayCategory: displayCategory,
|
|
89
92
|
displayThumbnail: displayThumbnail,
|
|
90
93
|
displayTitle: displayTitle,
|
|
91
|
-
priority: priority
|
|
94
|
+
priority: priority,
|
|
95
|
+
arrowSize: arrowSize,
|
|
96
|
+
enableOverlay: enableOverlay,
|
|
97
|
+
overlayModifier: overlayModifier
|
|
92
98
|
}, entityProps));
|
|
93
99
|
}));
|
|
94
100
|
};
|
|
@@ -112,7 +118,10 @@ CardContainer.propTypes = {
|
|
|
112
118
|
bannerModifier: PropTypes.string,
|
|
113
119
|
priorityLimit: PropTypes.number,
|
|
114
120
|
enableAutoScroll: PropTypes.bool,
|
|
115
|
-
|
|
121
|
+
enableOverlay: PropTypes.bool,
|
|
122
|
+
overlayModifier: PropTypes.string,
|
|
123
|
+
autoScrollTimer: PropTypes.number,
|
|
124
|
+
arrowSize: PropTypes.string
|
|
116
125
|
};
|
|
117
126
|
CardContainer.defaultProps = {
|
|
118
127
|
gtmChildren: [],
|
|
@@ -131,7 +140,10 @@ CardContainer.defaultProps = {
|
|
|
131
140
|
bannerModifier: '',
|
|
132
141
|
priorityLimit: 0,
|
|
133
142
|
enableAutoScroll: false,
|
|
134
|
-
|
|
143
|
+
enableOverlay: false,
|
|
144
|
+
autoScrollTimer: 0,
|
|
145
|
+
overlayModifier: '',
|
|
146
|
+
arrowSize: ''
|
|
135
147
|
};
|
|
136
148
|
export default withTitle(CardContainer);
|
|
137
149
|
//# sourceMappingURL=CardContainer.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../../src/components/Card/CardContainer.js"],"names":["React","useContext","PropTypes","MainContext","withTitle","Banner","Wrapper","CarouselWrapper","Card","getDynamicGridClasses","getEntitiesWithBanner","parsePropsToDisplay","getPropsToDisplayModifiers","CardContainer","cardData","gridModifier","style","displayCategory","displayThumbnail","displayTitle","modifier","entity","propsToDisplay","gtmChildren","cardChildren","name","designConfig","itemsPerRow","enableCarousel","bannerModifier","priorityLimit","enableAutoScroll","autoScrollTimer","cardProps","entities","itemId","propsToDisplayModifiers","dynamicWrapperSizes","cardBannerIndex","CardWrapper","map","index","baseAdunit","id","entityProps","extraProps","dynamicKey","join","priority","propTypes","array","isRequired","string","oneOfType","arrayOf","node","bool","object","number","defaultProps"],"mappings":";;;;AAAA,OAAOA,KAAP,IAAgBC,UAAhB,QAAkC,OAAlC;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,WAAT,QAA4B,8BAA5B;AACA,SAASC,SAAT,QAA0B,WAA1B;AACA,OAAOC,MAAP,MAAmB,WAAnB;AACA,OAAOC,OAAP,MAAoB,YAApB;AACA,OAAOC,eAAP,MAA4B,oBAA5B;AACA,OAAOC,IAAP,MAAiB,QAAjB;AACA,SAASC,qBAAT,QAAsC,WAAtC;AACA,SAASC,qBAAT,EAAgCC,mBAAhC,QAA2D,eAA3D;AACA,SAASC,0BAAT,QAA2C,aAA3C;;AAEA,MAAMC,aAAa,GAAG,
|
|
1
|
+
{"version":3,"sources":["../../../src/components/Card/CardContainer.js"],"names":["React","useContext","PropTypes","MainContext","withTitle","Banner","Wrapper","CarouselWrapper","Card","getDynamicGridClasses","getEntitiesWithBanner","parsePropsToDisplay","getPropsToDisplayModifiers","CardContainer","cardData","gridModifier","style","displayCategory","displayThumbnail","displayTitle","modifier","entity","propsToDisplay","gtmChildren","cardChildren","name","designConfig","itemsPerRow","enableCarousel","bannerModifier","priorityLimit","enableAutoScroll","enableOverlay","autoScrollTimer","arrowSize","overlayModifier","cardProps","entities","itemId","propsToDisplayModifiers","dynamicWrapperSizes","cardBannerIndex","CardWrapper","map","index","baseAdunit","id","entityProps","extraProps","dynamicKey","join","priority","propTypes","array","isRequired","string","oneOfType","arrayOf","node","bool","object","number","defaultProps"],"mappings":"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","sourcesContent":["import React, { useContext } from 'react';\nimport PropTypes from 'prop-types';\nimport { MainContext } from '@blaze-cms/nextjs-components';\nimport { withTitle } from '../../HOC';\nimport Banner from '../Banner';\nimport Wrapper from '../Wrapper';\nimport CarouselWrapper from '../CarouselWrapper';\nimport Card from './Card';\nimport { getDynamicGridClasses } from './helpers';\nimport { getEntitiesWithBanner, parsePropsToDisplay } from '../../helpers';\nimport { getPropsToDisplayModifiers } from '../../utils';\n\nconst CardContainer = ({\n cardData,\n gridModifier,\n style,\n displayCategory,\n displayThumbnail,\n displayTitle,\n modifier,\n entity,\n propsToDisplay,\n gtmChildren,\n cardChildren,\n name,\n designConfig,\n itemsPerRow,\n enableCarousel,\n bannerModifier,\n priorityLimit,\n enableAutoScroll,\n enableOverlay,\n autoScrollTimer,\n arrowSize,\n overlayModifier,\n ...cardProps\n}) => {\n const entities = getEntitiesWithBanner(cardData, cardProps);\n const { itemId } = useContext(MainContext);\n const propsToDisplayModifiers = getPropsToDisplayModifiers(propsToDisplay);\n const dynamicWrapperSizes = enableCarousel\n ? ''\n : getDynamicGridClasses('grid', itemsPerRow, designConfig);\n let cardBannerIndex = 0;\n const CardWrapper = enableCarousel ? CarouselWrapper : Wrapper;\n\n return (\n <CardWrapper\n className={dynamicWrapperSizes}\n modifiers={gridModifier}\n itemsPerRow={itemsPerRow}\n bannerModifier={bannerModifier}\n enableAutoScroll={enableAutoScroll}\n autoScrollTimer={autoScrollTimer}>\n {entities.map(({ baseAdunit, id, ...entityProps }, index) => {\n const extraProps = parsePropsToDisplay(entityProps, propsToDisplay);\n const dynamicKey = [itemId, index].join('-');\n if (baseAdunit) cardBannerIndex += 1;\n\n const priority = priorityLimit > 0 && index + 1 <= priorityLimit;\n\n return baseAdunit ? (\n <Banner\n key={dynamicKey}\n entity={entity}\n baseAdunit={baseAdunit}\n {...entityProps}\n modifier={modifier}\n cardBannerIndex={cardBannerIndex}\n />\n ) : (\n <Card\n key={id}\n id={id}\n enableCarousel={enableCarousel}\n entity={entity}\n propsToDisplay={extraProps}\n propsToDisplayModifiers={propsToDisplayModifiers}\n modifier={modifier}\n style={style}\n cardChildren={cardChildren}\n gtmChildren={gtmChildren}\n gtmId={name}\n gridModifier={gridModifier}\n entityProps={entityProps}\n displayCategory={displayCategory}\n displayThumbnail={displayThumbnail}\n displayTitle={displayTitle}\n priority={priority}\n arrowSize={arrowSize}\n enableOverlay={enableOverlay}\n overlayModifier={overlayModifier}\n {...entityProps}\n />\n );\n })}\n </CardWrapper>\n );\n};\n\nCardContainer.propTypes = {\n cardData: PropTypes.array.isRequired,\n name: PropTypes.string,\n entity: PropTypes.string.isRequired,\n gridModifier: PropTypes.string,\n gtmChildren: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n cardChildren: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n propsToDisplay: PropTypes.array,\n displayCategory: PropTypes.bool,\n displayThumbnail: PropTypes.bool,\n displayTitle: PropTypes.bool,\n modifier: PropTypes.string,\n style: PropTypes.string,\n designConfig: PropTypes.object,\n itemsPerRow: PropTypes.number,\n enableCarousel: PropTypes.bool,\n bannerModifier: PropTypes.string,\n priorityLimit: PropTypes.number,\n enableAutoScroll: PropTypes.bool,\n enableOverlay: PropTypes.bool,\n overlayModifier: PropTypes.string,\n autoScrollTimer: PropTypes.number,\n arrowSize: PropTypes.string\n};\n\nCardContainer.defaultProps = {\n gtmChildren: [],\n cardChildren: [],\n name: '',\n gridModifier: '',\n propsToDisplay: [],\n displayCategory: true,\n displayThumbnail: true,\n displayTitle: true,\n modifier: '',\n style: 'portrait',\n designConfig: {},\n itemsPerRow: 1,\n enableCarousel: false,\n bannerModifier: '',\n priorityLimit: 0,\n enableAutoScroll: false,\n enableOverlay: false,\n autoScrollTimer: 0,\n overlayModifier: '',\n arrowSize: ''\n};\n\nexport default withTitle(CardContainer);\n"],"file":"CardContainer.js"}
|
|
@@ -7,7 +7,8 @@ const CarouselWrapper = ({
|
|
|
7
7
|
bannerModifier,
|
|
8
8
|
itemsPerRow,
|
|
9
9
|
enableAutoScroll,
|
|
10
|
-
autoScrollTimer
|
|
10
|
+
autoScrollTimer,
|
|
11
|
+
arrowSize
|
|
11
12
|
}) => {
|
|
12
13
|
const ref = useRef();
|
|
13
14
|
const [buttonDisplay, setButtonDisplays] = useState({
|
|
@@ -94,7 +95,9 @@ const CarouselWrapper = ({
|
|
|
94
95
|
setShouldAutoScroll(false);
|
|
95
96
|
handleButtonNavigation();
|
|
96
97
|
}
|
|
97
|
-
}, /*#__PURE__*/React.createElement("i", null, /*#__PURE__*/React.createElement(FaAngleLeft,
|
|
98
|
+
}, /*#__PURE__*/React.createElement("i", null, /*#__PURE__*/React.createElement(FaAngleLeft, {
|
|
99
|
+
size: arrowSize
|
|
100
|
+
})))), /*#__PURE__*/React.createElement("div", {
|
|
98
101
|
className: "cards-carousel--right-button-wrapper"
|
|
99
102
|
}, displayRight && /*#__PURE__*/React.createElement("button", {
|
|
100
103
|
type: "button",
|
|
@@ -103,7 +106,9 @@ const CarouselWrapper = ({
|
|
|
103
106
|
setShouldAutoScroll(false);
|
|
104
107
|
handleButtonNavigation(true);
|
|
105
108
|
}
|
|
106
|
-
}, /*#__PURE__*/React.createElement("i", null, /*#__PURE__*/React.createElement(FaAngleRight,
|
|
109
|
+
}, /*#__PURE__*/React.createElement("i", null, /*#__PURE__*/React.createElement(FaAngleRight, {
|
|
110
|
+
size: arrowSize
|
|
111
|
+
})))), /*#__PURE__*/React.createElement("div", {
|
|
107
112
|
className: contentClassName,
|
|
108
113
|
ref: ref,
|
|
109
114
|
onScroll: handleScroll
|
|
@@ -115,14 +120,16 @@ CarouselWrapper.propTypes = {
|
|
|
115
120
|
itemsPerRow: PropTypes.number,
|
|
116
121
|
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
|
|
117
122
|
enableAutoScroll: PropTypes.bool,
|
|
118
|
-
autoScrollTimer: PropTypes.number
|
|
123
|
+
autoScrollTimer: PropTypes.number,
|
|
124
|
+
arrowSize: PropTypes.number
|
|
119
125
|
};
|
|
120
126
|
CarouselWrapper.defaultProps = {
|
|
121
127
|
itemsPerRow: 0,
|
|
122
128
|
bannerModifier: '',
|
|
123
129
|
children: [],
|
|
124
130
|
enableAutoScroll: false,
|
|
125
|
-
autoScrollTimer: 0
|
|
131
|
+
autoScrollTimer: 0,
|
|
132
|
+
arrowSize: 14
|
|
126
133
|
};
|
|
127
134
|
export default CarouselWrapper;
|
|
128
135
|
//# sourceMappingURL=CarouselWrapper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["React","useRef","useState","useEffect","PropTypes","FaAngleLeft","FaAngleRight","CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","ref","buttonDisplay","setButtonDisplays","displayLeft","displayRight","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":"AAAA,OAAOA,KAAP,IAAgBC,MAAhB,EAAwBC,QAAxB,EAAkCC,SAAlC,QAAmD,OAAnD;AACA,OAAOC,SAAP,MAAsB,YAAtB;AACA,SAASC,WAAT,EAAsBC,YAAtB,QAA0C,gBAA1C;;AAEA,MAAMC,eAAe,GAAG,CAAC;AACvBC,EAAAA,QADuB;AAEvBC,EAAAA,cAFuB;AAGvBC,EAAAA,WAHuB;AAIvBC,EAAAA,gBAJuB;AAKvBC,EAAAA;
|
|
1
|
+
{"version":3,"sources":["../../src/components/CarouselWrapper.js"],"names":["React","useRef","useState","useEffect","PropTypes","FaAngleLeft","FaAngleRight","CarouselWrapper","children","bannerModifier","itemsPerRow","enableAutoScroll","autoScrollTimer","arrowSize","ref","buttonDisplay","setButtonDisplays","displayLeft","displayRight","shouldAutoScroll","setShouldAutoScroll","autoScrollRef","current","id","setInterval","scrollCheck","clearInterval","handleButtonNavigation","offsetWidth","scrollWidth","handleScroll","scrollLeft","updatedDisplayLeft","updatedDisplayRight","direction","wrapperClassName","contentClassName","propTypes","string","number","oneOfType","arrayOf","node","bool","defaultProps"],"mappings":"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","sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\nimport { FaAngleLeft, FaAngleRight } from 'react-icons/fa';\n\nconst CarouselWrapper = ({\n children,\n bannerModifier,\n itemsPerRow,\n enableAutoScroll,\n autoScrollTimer,\n arrowSize\n}) => {\n const ref = useRef();\n const [buttonDisplay, setButtonDisplays] = useState({ displayLeft: false, displayRight: true });\n const [shouldAutoScroll, setShouldAutoScroll] = useState(false);\n const autoScrollRef = useRef();\n\n useEffect(\n () => {\n autoScrollRef.current = shouldAutoScroll;\n const id = setInterval(scrollCheck, autoScrollTimer);\n function scrollCheck() {\n if (!autoScrollRef.current) {\n clearInterval(id);\n } else {\n handleButtonNavigation(true);\n }\n }\n\n return () => clearInterval(id);\n },\n [autoScrollTimer, shouldAutoScroll]\n );\n\n useEffect(\n () => {\n const {\n current: { offsetWidth, scrollWidth }\n } = ref;\n if (scrollWidth <= offsetWidth)\n setButtonDisplays({ displayLeft: false, displayRight: false });\n setShouldAutoScroll(enableAutoScroll);\n },\n [enableAutoScroll]\n );\n\n const handleScroll = () => {\n const {\n current: { offsetWidth, scrollLeft, scrollWidth }\n } = ref;\n const updatedDisplayLeft = !!scrollLeft;\n const updatedDisplayRight = scrollLeft + offsetWidth + 1 < scrollWidth;\n setButtonDisplays({ displayLeft: updatedDisplayLeft, displayRight: updatedDisplayRight });\n };\n\n const handleButtonNavigation = direction => {\n if (!ref || !ref.current) return;\n const {\n current: { offsetWidth, scrollLeft, scrollWidth }\n } = ref;\n\n if (autoScrollRef.current && scrollLeft + offsetWidth >= scrollWidth) {\n ref.current.scrollLeft = 0;\n } else {\n ref.current.scrollLeft = direction ? scrollLeft + offsetWidth : scrollLeft - offsetWidth;\n }\n };\n\n const { displayLeft, displayRight } = buttonDisplay;\n const wrapperClassName = `cards-carousel${bannerModifier}`;\n const contentClassName = `cards-carousel--content items-per-row-${itemsPerRow}`;\n\n return (\n <div className={wrapperClassName}>\n <div className=\"cards-carousel--left-button-wrapper\">\n {displayLeft && (\n <button\n type=\"button\"\n className=\"cards-carousel--button-back icon-button icon\"\n onClick={() => {\n setShouldAutoScroll(false);\n handleButtonNavigation();\n }}>\n <i>\n <FaAngleLeft size={arrowSize} />\n </i>\n </button>\n )}\n </div>\n <div className=\"cards-carousel--right-button-wrapper\">\n {displayRight && (\n <button\n type=\"button\"\n className=\"cards-carousel--button-forward icon-button icon\"\n onClick={() => {\n setShouldAutoScroll(false);\n handleButtonNavigation(true);\n }}>\n <i>\n <FaAngleRight size={arrowSize} />\n </i>\n </button>\n )}\n </div>\n <div className={contentClassName} ref={ref} onScroll={handleScroll}>\n {children}\n </div>\n </div>\n );\n};\n\nCarouselWrapper.propTypes = {\n bannerModifier: PropTypes.string,\n itemsPerRow: PropTypes.number,\n children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),\n enableAutoScroll: PropTypes.bool,\n autoScrollTimer: PropTypes.number,\n arrowSize: PropTypes.number\n};\n\nCarouselWrapper.defaultProps = {\n itemsPerRow: 0,\n bannerModifier: '',\n children: [],\n enableAutoScroll: false,\n autoScrollTimer: 0,\n arrowSize: 14\n};\n\nexport default CarouselWrapper;\n"],"file":"CarouselWrapper.js"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blaze-cms/react-page-builder",
|
|
3
|
-
"version": "0.123.0-alpha.
|
|
3
|
+
"version": "0.123.0-alpha.21",
|
|
4
4
|
"description": "Blaze react page builder",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "lib-es/index.js",
|
|
@@ -84,5 +84,5 @@
|
|
|
84
84
|
"lib/*",
|
|
85
85
|
"lib-es/*"
|
|
86
86
|
],
|
|
87
|
-
"gitHead": "
|
|
87
|
+
"gitHead": "0dde944e227937028b40da58863736934248b045"
|
|
88
88
|
}
|
|
@@ -29,7 +29,10 @@ const CardContainer = ({
|
|
|
29
29
|
bannerModifier,
|
|
30
30
|
priorityLimit,
|
|
31
31
|
enableAutoScroll,
|
|
32
|
+
enableOverlay,
|
|
32
33
|
autoScrollTimer,
|
|
34
|
+
arrowSize,
|
|
35
|
+
overlayModifier,
|
|
33
36
|
...cardProps
|
|
34
37
|
}) => {
|
|
35
38
|
const entities = getEntitiesWithBanner(cardData, cardProps);
|
|
@@ -84,6 +87,9 @@ const CardContainer = ({
|
|
|
84
87
|
displayThumbnail={displayThumbnail}
|
|
85
88
|
displayTitle={displayTitle}
|
|
86
89
|
priority={priority}
|
|
90
|
+
arrowSize={arrowSize}
|
|
91
|
+
enableOverlay={enableOverlay}
|
|
92
|
+
overlayModifier={overlayModifier}
|
|
87
93
|
{...entityProps}
|
|
88
94
|
/>
|
|
89
95
|
);
|
|
@@ -111,7 +117,10 @@ CardContainer.propTypes = {
|
|
|
111
117
|
bannerModifier: PropTypes.string,
|
|
112
118
|
priorityLimit: PropTypes.number,
|
|
113
119
|
enableAutoScroll: PropTypes.bool,
|
|
114
|
-
|
|
120
|
+
enableOverlay: PropTypes.bool,
|
|
121
|
+
overlayModifier: PropTypes.string,
|
|
122
|
+
autoScrollTimer: PropTypes.number,
|
|
123
|
+
arrowSize: PropTypes.string
|
|
115
124
|
};
|
|
116
125
|
|
|
117
126
|
CardContainer.defaultProps = {
|
|
@@ -131,7 +140,10 @@ CardContainer.defaultProps = {
|
|
|
131
140
|
bannerModifier: '',
|
|
132
141
|
priorityLimit: 0,
|
|
133
142
|
enableAutoScroll: false,
|
|
134
|
-
|
|
143
|
+
enableOverlay: false,
|
|
144
|
+
autoScrollTimer: 0,
|
|
145
|
+
overlayModifier: '',
|
|
146
|
+
arrowSize: ''
|
|
135
147
|
};
|
|
136
148
|
|
|
137
149
|
export default withTitle(CardContainer);
|
|
@@ -7,7 +7,8 @@ const CarouselWrapper = ({
|
|
|
7
7
|
bannerModifier,
|
|
8
8
|
itemsPerRow,
|
|
9
9
|
enableAutoScroll,
|
|
10
|
-
autoScrollTimer
|
|
10
|
+
autoScrollTimer,
|
|
11
|
+
arrowSize
|
|
11
12
|
}) => {
|
|
12
13
|
const ref = useRef();
|
|
13
14
|
const [buttonDisplay, setButtonDisplays] = useState({ displayLeft: false, displayRight: true });
|
|
@@ -81,7 +82,7 @@ const CarouselWrapper = ({
|
|
|
81
82
|
handleButtonNavigation();
|
|
82
83
|
}}>
|
|
83
84
|
<i>
|
|
84
|
-
<FaAngleLeft />
|
|
85
|
+
<FaAngleLeft size={arrowSize} />
|
|
85
86
|
</i>
|
|
86
87
|
</button>
|
|
87
88
|
)}
|
|
@@ -96,7 +97,7 @@ const CarouselWrapper = ({
|
|
|
96
97
|
handleButtonNavigation(true);
|
|
97
98
|
}}>
|
|
98
99
|
<i>
|
|
99
|
-
<FaAngleRight />
|
|
100
|
+
<FaAngleRight size={arrowSize} />
|
|
100
101
|
</i>
|
|
101
102
|
</button>
|
|
102
103
|
)}
|
|
@@ -113,7 +114,8 @@ CarouselWrapper.propTypes = {
|
|
|
113
114
|
itemsPerRow: PropTypes.number,
|
|
114
115
|
children: PropTypes.oneOfType([PropTypes.arrayOf(PropTypes.node), PropTypes.node]),
|
|
115
116
|
enableAutoScroll: PropTypes.bool,
|
|
116
|
-
autoScrollTimer: PropTypes.number
|
|
117
|
+
autoScrollTimer: PropTypes.number,
|
|
118
|
+
arrowSize: PropTypes.number
|
|
117
119
|
};
|
|
118
120
|
|
|
119
121
|
CarouselWrapper.defaultProps = {
|
|
@@ -121,7 +123,8 @@ CarouselWrapper.defaultProps = {
|
|
|
121
123
|
bannerModifier: '',
|
|
122
124
|
children: [],
|
|
123
125
|
enableAutoScroll: false,
|
|
124
|
-
autoScrollTimer: 0
|
|
126
|
+
autoScrollTimer: 0,
|
|
127
|
+
arrowSize: 14
|
|
125
128
|
};
|
|
126
129
|
|
|
127
130
|
export default CarouselWrapper;
|
|
@@ -12,6 +12,7 @@ const cardDataMockedOptions = {
|
|
|
12
12
|
caption: ''
|
|
13
13
|
}
|
|
14
14
|
},
|
|
15
|
+
arrowSize: 14,
|
|
15
16
|
yacht: {
|
|
16
17
|
builders_list: "| Nautor's Swan |",
|
|
17
18
|
length_overall: 23.99,
|
|
@@ -24,6 +25,7 @@ const cardDataMockedOptions = {
|
|
|
24
25
|
name: 'Swan 98',
|
|
25
26
|
url: '/nautors-swan/swan-98',
|
|
26
27
|
category: null,
|
|
28
|
+
arrowSize: 14,
|
|
27
29
|
image: {
|
|
28
30
|
url:
|
|
29
31
|
'https://cdn-events.boatinternational.com/files/2020/04/2f8c4030-879c-11ea-aab3-6d01477a82d7-Swan 98 - 1.jpg',
|