@blaze-cms/react-page-builder 0.124.0-alpha.11 → 0.124.0-alpha.12
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/CarouselWrapper.js +2 -2
- package/lib/components/CarouselWrapper.js.map +1 -1
- package/lib-es/components/CarouselWrapper.js +2 -2
- package/lib-es/components/CarouselWrapper.js.map +1 -1
- package/package.json +2 -2
- package/src/components/CarouselWrapper.js +2 -2
- package/tests/unit/src/components/Image/__snapshots__/ImageFactory.test.js.snap +22 -1
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.124.0-alpha.12](https://byte9/thebyte9/blaze/compare/v0.124.0-alpha.11...v0.124.0-alpha.12) (2022-05-11)
|
|
7
|
+
|
|
8
|
+
**Note:** Version bump only for package @blaze-cms/react-page-builder
|
|
9
|
+
|
|
10
|
+
|
|
11
|
+
|
|
12
|
+
|
|
13
|
+
|
|
6
14
|
# [0.124.0-alpha.11](https://byte9/thebyte9/blaze/compare/v0.124.0-alpha.10...v0.124.0-alpha.11) (2022-05-11)
|
|
7
15
|
|
|
8
16
|
**Note:** Version bump only for package @blaze-cms/react-page-builder
|
|
@@ -128,7 +128,7 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
|
|
|
128
128
|
handleButtonNavigation();
|
|
129
129
|
}
|
|
130
130
|
}, /*#__PURE__*/_react["default"].createElement("i", {
|
|
131
|
-
className: "carousel--
|
|
131
|
+
className: "carousel--arrow__left"
|
|
132
132
|
}))), /*#__PURE__*/_react["default"].createElement("div", {
|
|
133
133
|
className: "cards-carousel--right-button-wrapper"
|
|
134
134
|
}, displayRight && /*#__PURE__*/_react["default"].createElement("button", {
|
|
@@ -139,7 +139,7 @@ var CarouselWrapper = function CarouselWrapper(_ref) {
|
|
|
139
139
|
handleButtonNavigation(true);
|
|
140
140
|
}
|
|
141
141
|
}, /*#__PURE__*/_react["default"].createElement("i", {
|
|
142
|
-
className: "carousel--
|
|
142
|
+
className: "carousel--arrow__right"
|
|
143
143
|
}))), /*#__PURE__*/_react["default"].createElement("div", {
|
|
144
144
|
className: contentClassName,
|
|
145
145
|
ref: ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"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"],"sources":["../../src/components/CarouselWrapper.js"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\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 className=\"carousel--
|
|
1
|
+
{"version":3,"file":"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"],"sources":["../../src/components/CarouselWrapper.js"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\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 className=\"carousel--arrow__left\" />\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 className=\"carousel--arrow__right\" />\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"],"mappings":"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"}
|
|
@@ -95,7 +95,7 @@ const CarouselWrapper = ({
|
|
|
95
95
|
handleButtonNavigation();
|
|
96
96
|
}
|
|
97
97
|
}, /*#__PURE__*/React.createElement("i", {
|
|
98
|
-
className: "carousel--
|
|
98
|
+
className: "carousel--arrow__left"
|
|
99
99
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
100
100
|
className: "cards-carousel--right-button-wrapper"
|
|
101
101
|
}, displayRight && /*#__PURE__*/React.createElement("button", {
|
|
@@ -106,7 +106,7 @@ const CarouselWrapper = ({
|
|
|
106
106
|
handleButtonNavigation(true);
|
|
107
107
|
}
|
|
108
108
|
}, /*#__PURE__*/React.createElement("i", {
|
|
109
|
-
className: "carousel--
|
|
109
|
+
className: "carousel--arrow__right"
|
|
110
110
|
}))), /*#__PURE__*/React.createElement("div", {
|
|
111
111
|
className: contentClassName,
|
|
112
112
|
ref: ref,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"CarouselWrapper.js","names":["React","useRef","useState","useEffect","PropTypes","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"],"sources":["../../src/components/CarouselWrapper.js"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\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 className=\"carousel--
|
|
1
|
+
{"version":3,"file":"CarouselWrapper.js","names":["React","useRef","useState","useEffect","PropTypes","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"],"sources":["../../src/components/CarouselWrapper.js"],"sourcesContent":["import React, { useRef, useState, useEffect } from 'react';\nimport PropTypes from 'prop-types';\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 className=\"carousel--arrow__left\" />\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 className=\"carousel--arrow__right\" />\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"],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blaze-cms/react-page-builder",
|
|
3
|
-
"version": "0.124.0-alpha.
|
|
3
|
+
"version": "0.124.0-alpha.12",
|
|
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": "eb2bb83a26493d5f0fbe0d3ad30ef7a225dd26bb"
|
|
88
88
|
}
|
|
@@ -80,7 +80,7 @@ const CarouselWrapper = ({
|
|
|
80
80
|
setShouldAutoScroll(false);
|
|
81
81
|
handleButtonNavigation();
|
|
82
82
|
}}>
|
|
83
|
-
<i className="carousel--
|
|
83
|
+
<i className="carousel--arrow__left" />
|
|
84
84
|
</button>
|
|
85
85
|
)}
|
|
86
86
|
</div>
|
|
@@ -93,7 +93,7 @@ const CarouselWrapper = ({
|
|
|
93
93
|
setShouldAutoScroll(false);
|
|
94
94
|
handleButtonNavigation(true);
|
|
95
95
|
}}>
|
|
96
|
-
<i className="carousel--
|
|
96
|
+
<i className="carousel--arrow__right" />
|
|
97
97
|
</button>
|
|
98
98
|
)}
|
|
99
99
|
</div>
|
|
@@ -1,6 +1,27 @@
|
|
|
1
1
|
// Jest Snapshot v1, https://goo.gl/fbAQLP
|
|
2
2
|
|
|
3
|
-
exports[`ImageFactory component should render image 1`] =
|
|
3
|
+
exports[`ImageFactory component should render image 1`] = `
|
|
4
|
+
<DocumentFragment>
|
|
5
|
+
<div
|
|
6
|
+
class="image "
|
|
7
|
+
entity=""
|
|
8
|
+
imagerelation="publishedPage.otherImageIds"
|
|
9
|
+
parent="[object Object]"
|
|
10
|
+
>
|
|
11
|
+
<a
|
|
12
|
+
class="image__wrapper"
|
|
13
|
+
href="http://www.url-test-prop.com"
|
|
14
|
+
rel="noopener nofollow"
|
|
15
|
+
target="_blank"
|
|
16
|
+
>
|
|
17
|
+
<img
|
|
18
|
+
alt=""
|
|
19
|
+
src="test-url"
|
|
20
|
+
/>
|
|
21
|
+
</a>
|
|
22
|
+
</div>
|
|
23
|
+
</DocumentFragment>
|
|
24
|
+
`;
|
|
4
25
|
|
|
5
26
|
exports[`ImageFactory component should render image fetching data from relation 1`] = `
|
|
6
27
|
<DocumentFragment>
|