@blaze-cms/react-page-builder 0.146.0-node18-tooltips.23 → 0.146.0-node18-tooltips.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.
- package/CHANGELOG.md +11 -0
- package/lib/system-components/EditorMode/BlazeLogo.js +3 -0
- package/lib/system-components/EditorMode/BlazeLogo.js.map +1 -1
- package/lib/system-components/EditorMode/PbWrapper.js +1 -1
- package/lib/system-components/EditorMode/PbWrapper.js.map +1 -1
- package/lib/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js +13 -7
- package/lib/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js.map +1 -1
- package/lib/system-components/EditorMode/helpers/check-is-over-blaze-icon.js +24 -0
- package/lib/system-components/EditorMode/helpers/check-is-over-blaze-icon.js.map +1 -0
- package/lib-es/system-components/EditorMode/BlazeLogo.js +4 -1
- package/lib-es/system-components/EditorMode/BlazeLogo.js.map +1 -1
- package/lib-es/system-components/EditorMode/PbWrapper.js +1 -1
- package/lib-es/system-components/EditorMode/PbWrapper.js.map +1 -1
- package/lib-es/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js +13 -7
- package/lib-es/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js.map +1 -1
- package/lib-es/system-components/EditorMode/helpers/check-is-over-blaze-icon.js +19 -0
- package/lib-es/system-components/EditorMode/helpers/check-is-over-blaze-icon.js.map +1 -0
- package/package.json +2 -2
- package/src/system-components/EditorMode/BlazeLogo.js +4 -1
- package/src/system-components/EditorMode/PbWrapper.js +2 -2
- package/src/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js +14 -7
- package/src/system-components/EditorMode/helpers/check-is-over-blaze-icon.js +24 -0
package/CHANGELOG.md
CHANGED
|
@@ -3,6 +3,17 @@
|
|
|
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.146.0-node18-tooltips.24](https://github.com/thebyte9/blaze/compare/v0.146.0-node18-tooltips.23...v0.146.0-node18-tooltips.24) (2025-10-27)
|
|
7
|
+
|
|
8
|
+
|
|
9
|
+
### Bug Fixes
|
|
10
|
+
|
|
11
|
+
* fixed logo flicker highlight getting stuck and logo position when close to window top ([#4962](https://github.com/thebyte9/blaze/issues/4962)) ([051f843](https://github.com/thebyte9/blaze/commit/051f843d717a9648f5ca19dd531f20de8e1516c0))
|
|
12
|
+
|
|
13
|
+
|
|
14
|
+
|
|
15
|
+
|
|
16
|
+
|
|
6
17
|
# [0.146.0-node18-tooltips.23](https://github.com/thebyte9/blaze/compare/v0.146.0-node18-tooltips.22...v0.146.0-node18-tooltips.23) (2025-10-20)
|
|
7
18
|
|
|
8
19
|
|
|
@@ -44,6 +44,9 @@ var BlazeLogo = function BlazeLogo(_ref) {
|
|
|
44
44
|
var rect = childNode.getBoundingClientRect();
|
|
45
45
|
var left = rect.width / 2 + rect.left + window.scrollX - 20;
|
|
46
46
|
var top = rect.top - 20 + window.scrollY;
|
|
47
|
+
if (top <= 0) {
|
|
48
|
+
top = rect.bottom - 20;
|
|
49
|
+
}
|
|
47
50
|
var display = childNode.classList.contains(_constants.EDITOR_MODE_HIGHLIGHT_CLASS) ? null : 'none';
|
|
48
51
|
var newStyle = {
|
|
49
52
|
display: display,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlazeLogo.js","names":["_react","_interopRequireWildcard","require","_constants","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","BlazeLogo","_ref","childNode","props","_objectWithoutProperties2","id","_useState","useState","_useState2","_slicedToArray2","style","setStyle","useEffect","rect","getBoundingClientRect","left","width","window","scrollX","top","scrollY","display","classList","contains","EDITOR_MODE_HIGHLIGHT_CLASS","newStyle","observer","MutationObserver","mutations","mutation","type","attributeName","isHighlighted","observe","attributes","disconnect","createElement","_extends2","className","EDITOR_MODE_ICON_CLASS","xmlns","height","fill","transform","d","fillRule","_default","exports"],"sources":["../../../src/system-components/EditorMode/BlazeLogo.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { EDITOR_MODE_ICON_CLASS, EDITOR_MODE_HIGHLIGHT_CLASS } from './constants';\n\nconst BlazeLogo = ({ childNode, ...props }) => {\n const { id } = props;\n const [style, setStyle] = useState({});\n\n useEffect(() => {\n if (!childNode) return;\n\n const rect = childNode.getBoundingClientRect();\n const left = rect.width / 2 + rect.left + window.scrollX - 20;\n
|
|
1
|
+
{"version":3,"file":"BlazeLogo.js","names":["_react","_interopRequireWildcard","require","_constants","_excluded","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","ownKeys","keys","getOwnPropertySymbols","o","filter","enumerable","push","apply","_objectSpread","arguments","length","forEach","_defineProperty2","getOwnPropertyDescriptors","defineProperties","BlazeLogo","_ref","childNode","props","_objectWithoutProperties2","id","_useState","useState","_useState2","_slicedToArray2","style","setStyle","useEffect","rect","getBoundingClientRect","left","width","window","scrollX","top","scrollY","bottom","display","classList","contains","EDITOR_MODE_HIGHLIGHT_CLASS","newStyle","observer","MutationObserver","mutations","mutation","type","attributeName","isHighlighted","observe","attributes","disconnect","createElement","_extends2","className","EDITOR_MODE_ICON_CLASS","xmlns","height","fill","transform","d","fillRule","_default","exports"],"sources":["../../../src/system-components/EditorMode/BlazeLogo.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { EDITOR_MODE_ICON_CLASS, EDITOR_MODE_HIGHLIGHT_CLASS } from './constants';\n\nconst BlazeLogo = ({ childNode, ...props }) => {\n const { id } = props;\n const [style, setStyle] = useState({});\n\n useEffect(() => {\n if (!childNode) return;\n\n const rect = childNode.getBoundingClientRect();\n const left = rect.width / 2 + rect.left + window.scrollX - 20;\n let top = rect.top - 20 + window.scrollY;\n if (top <= 0) {\n top = rect.bottom - 20;\n }\n const display = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS) ? null : 'none';\n const newStyle = { display, top, left };\n setStyle(newStyle);\n\n const observer = new MutationObserver(mutations => {\n mutations.forEach(mutation => {\n if (mutation.type === 'attributes' && mutation.attributeName === 'class') {\n const isHighlighted = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS);\n setStyle({ ...newStyle, display: isHighlighted ? null : 'none' });\n }\n });\n });\n observer.observe(childNode, { attributes: true });\n return () => observer.disconnect();\n }, [childNode, id]);\n\n // todo: fix icon hover/click activation while using position absolute\n return (\n <button type=\"button\" className={EDITOR_MODE_ICON_CLASS} {...props} style={style}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"33\">\n <path\n fill=\"currentColor\"\n transform=\"translate(1.0415 1.85962)\"\n d=\"M7.0214715 6.2017469C7.0214715 6.2017469 4.6948299 13.380771 5.2965479 15.065234C5.6174636 15.947572 6.3796396 16.18821 7.3022733 15.386085C9.1074257 13.781834 13.078762 6.3621721 9.949831 0.42644304C8.7463951 -1.8596147 18.293648 5.1589837 16.328037 18.755013C16.087351 20.559793 16.809412 19.998306 17.250671 19.236286C19.176168 15.947572 17.972733 11.616095 17.972733 10.894181C17.972733 10.172268 19.657541 12.939602 19.777885 18.353949C19.89823 23.768295 17.050098 29.022219 11.393953 29.98477C10.03006 30.225407 13.199106 27.578392 13.640366 24.610529C13.68048 24.329784 10.39109 28.300306 9.5888004 27.738817C9.2277699 27.49818 15.36529 19.877987 13.199106 13.300558C13.158992 13.140133 11.754984 24.409996 6.3796396 27.097116C3.3309369 28.621155 0.60315031 25.051697 0.12177619 21.963514C-1.0415446 13.862046 6.4999828 8.7284422 7.0214715 6.2017469Z\"\n fillRule=\"evenodd\"\n />\n </svg>\n </button>\n );\n};\n\nexport default BlazeLogo;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -49,7 +49,7 @@ var PbWrapper = function PbWrapper(_ref) {
|
|
|
49
49
|
return /*#__PURE__*/_react["default"].createElement(_react["default"].Fragment, null, /*#__PURE__*/_react["default"].createElement(TagName, {
|
|
50
50
|
ref: ref,
|
|
51
51
|
"pb-component-name": name
|
|
52
|
-
}), logoProps && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react["default"].createElement(_BlazeLogo["default"], logoProps), document.body));
|
|
52
|
+
}), type === 'end' && logoProps && /*#__PURE__*/(0, _reactDom.createPortal)(/*#__PURE__*/_react["default"].createElement(_BlazeLogo["default"], logoProps), document.body));
|
|
53
53
|
};
|
|
54
54
|
var _default = exports["default"] = PbWrapper;
|
|
55
55
|
//# sourceMappingURL=PbWrapper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PbWrapper.js","names":["_react","_interopRequireWildcard","require","_reactDom","_nextjsComponents","_addEditorModeEventListeners","_interopRequireDefault","_BlazeLogo","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","PbWrapper","_ref","name","_ref$type","type","ref","useRef","_useState","useState","_useState2","_slicedToArray2","logoProps","setLogoProps","_useMainContext","useMainContext","_useMainContext$debug","debugOptions","_useMainContext$debug2","adminHref","useEffect","unmount","addEditorModeEventListeners","TagName","concat","createElement","Fragment","createPortal","document","body","_default","exports"],"sources":["../../../src/system-components/EditorMode/PbWrapper.js"],"sourcesContent":["import React, { useRef, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useMainContext } from '@blaze-cms/nextjs-components';\nimport addEditorModeEventListeners from './helpers/add-editor-mode-event-listeners';\nimport BlazeLogo from './BlazeLogo';\n\nconst PbWrapper = ({ name, type = 'start' }) => {\n const ref = useRef(null);\n const [logoProps, setLogoProps] = useState(null);\n const { debugOptions: { adminHref } = {} } = useMainContext();\n\n useEffect(() => {\n const unmount = addEditorModeEventListeners({ ref, name, adminHref, type, setLogoProps });\n\n return unmount;\n }, [adminHref, name, type]);\n
|
|
1
|
+
{"version":3,"file":"PbWrapper.js","names":["_react","_interopRequireWildcard","require","_reactDom","_nextjsComponents","_addEditorModeEventListeners","_interopRequireDefault","_BlazeLogo","_getRequireWildcardCache","e","WeakMap","r","t","__esModule","_typeof","has","get","n","__proto__","a","Object","defineProperty","getOwnPropertyDescriptor","u","hasOwnProperty","call","i","set","PbWrapper","_ref","name","_ref$type","type","ref","useRef","_useState","useState","_useState2","_slicedToArray2","logoProps","setLogoProps","_useMainContext","useMainContext","_useMainContext$debug","debugOptions","_useMainContext$debug2","adminHref","useEffect","unmount","addEditorModeEventListeners","TagName","concat","createElement","Fragment","createPortal","document","body","_default","exports"],"sources":["../../../src/system-components/EditorMode/PbWrapper.js"],"sourcesContent":["import React, { useRef, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useMainContext } from '@blaze-cms/nextjs-components';\nimport addEditorModeEventListeners from './helpers/add-editor-mode-event-listeners';\nimport BlazeLogo from './BlazeLogo';\n\nconst PbWrapper = ({ name, type = 'start' }) => {\n const ref = useRef(null);\n const [logoProps, setLogoProps] = useState(null);\n const { debugOptions: { adminHref } = {} } = useMainContext();\n\n useEffect(() => {\n const unmount = addEditorModeEventListeners({ ref, name, adminHref, type, setLogoProps });\n\n return unmount;\n }, [adminHref, name, type]);\n const TagName = `pb-wrapper-${type}`;\n\n return (\n <>\n <TagName ref={ref} pb-component-name={name} />\n {type === 'end' && logoProps && createPortal(<BlazeLogo {...logoProps} />, document.body)}\n </>\n );\n};\n\nexport default PbWrapper;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -29,6 +29,7 @@ require("core-js/modules/es.object.values.js");
|
|
|
29
29
|
require("core-js/modules/web.dom-collections.for-each.js");
|
|
30
30
|
var _helpers = require("../../../helpers");
|
|
31
31
|
var _constants = require("../constants");
|
|
32
|
+
var _checkIsOverBlazeIcon = _interopRequireDefault(require("./check-is-over-blaze-icon"));
|
|
32
33
|
function _createForOfIteratorHelper(r, e) { var t = "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (!t) { if (Array.isArray(r) || (t = _unsupportedIterableToArray(r)) || e && r && "number" == typeof r.length) { t && (r = t); var _n = 0, F = function F() {}; return { s: F, n: function n() { return _n >= r.length ? { done: !0 } : { done: !1, value: r[_n++] }; }, e: function e(r) { throw r; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var o, a = !0, u = !1; return { s: function s() { t = t.call(r); }, n: function n() { var r = t.next(); return a = r.done, r; }, e: function e(r) { u = !0, o = r; }, f: function f() { try { a || null == t["return"] || t["return"](); } finally { if (u) throw o; } } }; }
|
|
33
34
|
function _unsupportedIterableToArray(r, a) { if (r) { if ("string" == typeof r) return _arrayLikeToArray(r, a); var t = {}.toString.call(r).slice(8, -1); return "Object" === t && r.constructor && (t = r.constructor.name), "Map" === t || "Set" === t ? Array.from(r) : "Arguments" === t || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(t) ? _arrayLikeToArray(r, a) : void 0; } }
|
|
34
35
|
function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length); for (var e = 0, n = Array(a); e < a; e++) n[e] = r[e]; return n; }
|
|
@@ -72,11 +73,6 @@ var addEditorModeEventListeners = function addEditorModeEventListeners(_ref) {
|
|
|
72
73
|
var cleanUpFunctions = Object.values(siblings).map(function (childNode) {
|
|
73
74
|
var componentId = (0, _helpers.getComponentId)(name);
|
|
74
75
|
var clickItemId = "click-".concat(componentId);
|
|
75
|
-
var click = function click(e) {
|
|
76
|
-
e.stopPropagation();
|
|
77
|
-
e.preventDefault();
|
|
78
|
-
window.open("".concat(adminHref, "#").concat(componentId), adminHref);
|
|
79
|
-
};
|
|
80
76
|
var mouseenter = function mouseenter(e) {
|
|
81
77
|
e.stopPropagation();
|
|
82
78
|
document.querySelectorAll(".".concat(_constants.EDITOR_MODE_HIGHLIGHT_CLASS)).forEach(function (node) {
|
|
@@ -92,14 +88,24 @@ var addEditorModeEventListeners = function addEditorModeEventListeners(_ref) {
|
|
|
92
88
|
};
|
|
93
89
|
var mouseleave = function mouseleave(e) {
|
|
94
90
|
e.stopPropagation();
|
|
91
|
+
if ((0, _checkIsOverBlazeIcon["default"])(e)) {
|
|
92
|
+
return;
|
|
93
|
+
}
|
|
94
|
+
setLogoProps(null);
|
|
95
95
|
if (e.toElement) {
|
|
96
96
|
var icon = e.toElement.closest(".".concat(_constants.EDITOR_MODE_ICON_CLASS));
|
|
97
|
+
document.querySelectorAll(".".concat(_constants.EDITOR_MODE_HIGHLIGHT_CLASS)).forEach(function (node) {
|
|
98
|
+
node.classList.remove(_constants.EDITOR_MODE_HIGHLIGHT_CLASS);
|
|
99
|
+
});
|
|
97
100
|
if (icon && icon.id === clickItemId) {
|
|
98
101
|
e.stopPropagation();
|
|
99
|
-
return;
|
|
100
102
|
}
|
|
101
103
|
}
|
|
102
|
-
|
|
104
|
+
};
|
|
105
|
+
var click = function click(e) {
|
|
106
|
+
e.stopPropagation();
|
|
107
|
+
e.preventDefault();
|
|
108
|
+
window.open("".concat(adminHref, "#").concat(componentId), adminHref);
|
|
103
109
|
};
|
|
104
110
|
childNode.addEventListener('click', click); // todo: remove listener and trigger on icon click
|
|
105
111
|
childNode.addEventListener('mouseenter', mouseenter);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-editor-mode-event-listeners.js","names":["_helpers","require","_constants","_createForOfIteratorHelper","r","e","t","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","n","done","value","f","TypeError","o","a","u","call","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","addEditorModeEventListeners","_ref","ref","adminHref","type","setLogoProps","current","parentNode","listeners","siblings","children","foundChildren","foundStart","_iterator","_step","child","getAttribute","push","err","cleanUpFunctions","Object","values","map","childNode","componentId","getComponentId","clickItemId","concat","
|
|
1
|
+
{"version":3,"file":"add-editor-mode-event-listeners.js","names":["_helpers","require","_constants","_checkIsOverBlazeIcon","_interopRequireDefault","_createForOfIteratorHelper","r","e","t","Symbol","iterator","Array","isArray","_unsupportedIterableToArray","length","_n","F","s","n","done","value","f","TypeError","o","a","u","call","next","_arrayLikeToArray","toString","slice","constructor","name","from","test","addEditorModeEventListeners","_ref","ref","adminHref","type","setLogoProps","current","parentNode","listeners","siblings","children","foundChildren","foundStart","_iterator","_step","child","getAttribute","push","err","cleanUpFunctions","Object","values","map","childNode","componentId","getComponentId","clickItemId","concat","mouseenter","stopPropagation","document","querySelectorAll","EDITOR_MODE_HIGHLIGHT_CLASS","forEach","node","classList","remove","add","id","onClick","click","mouseleave","checkIsOverBlazeIcon","toElement","icon","closest","EDITOR_MODE_ICON_CLASS","preventDefault","window","open","addEventListener","nodeCleanup","_ref2","_ref3","_slicedToArray2","events","entries","_ref4","_ref5","event","handler","removeEventListener","unmount","fn","_default","exports"],"sources":["../../../../src/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js"],"sourcesContent":["import { getComponentId } from '../../../helpers';\nimport { EDITOR_MODE_HIGHLIGHT_CLASS, EDITOR_MODE_ICON_CLASS } from '../constants';\nimport checkIsOverBlazeIcon from './check-is-over-blaze-icon';\n\nconst addEditorModeEventListeners = ({ ref, name, adminHref, type, setLogoProps }) => {\n // ignore start tags and if parent not found\n if (type !== 'end' || !ref.current || !ref.current.parentNode) return;\n\n const listeners = [];\n\n const siblings = ref.current.parentNode.children;\n\n const foundChildren = [];\n let foundStart = false;\n // eslint-disable-next-line no-restricted-syntax, no-unused-vars\n for (const child of siblings) {\n if (!foundStart) {\n // find start tag\n if (child.getAttribute('pb-component-name') === name) {\n foundStart = true;\n }\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (child === ref.current) {\n // end tag found\n break;\n }\n\n foundChildren.push(child); // all nodes between start and end tags - PB component nodes\n }\n\n const cleanUpFunctions = Object.values(siblings).map(childNode => {\n const componentId = getComponentId(name);\n const clickItemId = `click-${componentId}`;\n\n const mouseenter = e => {\n e.stopPropagation();\n\n document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {\n node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);\n });\n childNode.classList.add(EDITOR_MODE_HIGHLIGHT_CLASS);\n\n setLogoProps({\n id: clickItemId,\n 'aria-label': `Edit ${name}`,\n childNode,\n onClick: click\n });\n };\n\n const mouseleave = e => {\n e.stopPropagation();\n if (checkIsOverBlazeIcon(e)) {\n return;\n }\n setLogoProps(null);\n if (e.toElement) {\n const icon = e.toElement.closest(`.${EDITOR_MODE_ICON_CLASS}`);\n document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {\n node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);\n });\n if (icon && icon.id === clickItemId) {\n e.stopPropagation();\n }\n }\n };\n\n const click = e => {\n e.stopPropagation();\n e.preventDefault();\n window.open(`${adminHref}#${componentId}`, adminHref);\n };\n\n childNode.addEventListener('click', click); // todo: remove listener and trigger on icon click\n childNode.addEventListener('mouseenter', mouseenter);\n childNode.addEventListener('mouseleave', mouseleave);\n\n listeners.push([childNode, { click, mouseenter, mouseleave }]);\n\n const nodeCleanup = () => {\n listeners.forEach(([, events]) => {\n Object.entries(events).forEach(([event, handler]) => {\n childNode.removeEventListener(event, handler);\n });\n });\n };\n\n return nodeCleanup;\n });\n\n const unmount = () => {\n cleanUpFunctions.forEach(fn => fn());\n };\n\n return unmount;\n};\n\nexport default addEditorModeEventListeners;\n"],"mappings":"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","ignoreList":[]}
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
require("core-js/modules/es.object.define-property.js");
|
|
4
|
+
Object.defineProperty(exports, "__esModule", {
|
|
5
|
+
value: true
|
|
6
|
+
});
|
|
7
|
+
exports["default"] = void 0;
|
|
8
|
+
var _constants = require("../constants");
|
|
9
|
+
var checkIsOverBlazeIcon = function checkIsOverBlazeIcon(event) {
|
|
10
|
+
var relatedTarget = event.relatedTarget;
|
|
11
|
+
if (!relatedTarget) return false;
|
|
12
|
+
if (relatedTarget.tagName === 'BUTTON' && relatedTarget.className === _constants.EDITOR_MODE_ICON_CLASS) {
|
|
13
|
+
return true;
|
|
14
|
+
}
|
|
15
|
+
if (relatedTarget.tagName === 'svg' && relatedTarget.parentNode.className === _constants.EDITOR_MODE_ICON_CLASS) {
|
|
16
|
+
return true;
|
|
17
|
+
}
|
|
18
|
+
if (relatedTarget.tagName === 'path' && relatedTarget.parentNode.parentNode.className === _constants.EDITOR_MODE_ICON_CLASS) {
|
|
19
|
+
return true;
|
|
20
|
+
}
|
|
21
|
+
return false;
|
|
22
|
+
};
|
|
23
|
+
var _default = exports["default"] = checkIsOverBlazeIcon;
|
|
24
|
+
//# sourceMappingURL=check-is-over-blaze-icon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"check-is-over-blaze-icon.js","names":["_constants","require","checkIsOverBlazeIcon","event","relatedTarget","tagName","className","EDITOR_MODE_ICON_CLASS","parentNode","_default","exports"],"sources":["../../../../src/system-components/EditorMode/helpers/check-is-over-blaze-icon.js"],"sourcesContent":["import { EDITOR_MODE_ICON_CLASS } from '../constants';\n\nconst checkIsOverBlazeIcon = event => {\n const { relatedTarget } = event;\n if (!relatedTarget) return false;\n if (relatedTarget.tagName === 'BUTTON' && relatedTarget.className === EDITOR_MODE_ICON_CLASS) {\n return true;\n }\n if (\n relatedTarget.tagName === 'svg' &&\n relatedTarget.parentNode.className === EDITOR_MODE_ICON_CLASS\n ) {\n return true;\n }\n if (\n relatedTarget.tagName === 'path' &&\n relatedTarget.parentNode.parentNode.className === EDITOR_MODE_ICON_CLASS\n ) {\n return true;\n }\n return false;\n};\n\nexport default checkIsOverBlazeIcon;\n"],"mappings":";;;;;;;AAAA,IAAAA,UAAA,GAAAC,OAAA;AAEA,IAAMC,oBAAoB,GAAG,SAAvBA,oBAAoBA,CAAGC,KAAK,EAAI;EACpC,IAAQC,aAAa,GAAKD,KAAK,CAAvBC,aAAa;EACrB,IAAI,CAACA,aAAa,EAAE,OAAO,KAAK;EAChC,IAAIA,aAAa,CAACC,OAAO,KAAK,QAAQ,IAAID,aAAa,CAACE,SAAS,KAAKC,iCAAsB,EAAE;IAC5F,OAAO,IAAI;EACb;EACA,IACEH,aAAa,CAACC,OAAO,KAAK,KAAK,IAC/BD,aAAa,CAACI,UAAU,CAACF,SAAS,KAAKC,iCAAsB,EAC7D;IACA,OAAO,IAAI;EACb;EACA,IACEH,aAAa,CAACC,OAAO,KAAK,MAAM,IAChCD,aAAa,CAACI,UAAU,CAACA,UAAU,CAACF,SAAS,KAAKC,iCAAsB,EACxE;IACA,OAAO,IAAI;EACb;EACA,OAAO,KAAK;AACd,CAAC;AAAC,IAAAE,QAAA,GAAAC,OAAA,cAEaR,oBAAoB","ignoreList":[]}
|
|
@@ -19,7 +19,10 @@ const BlazeLogo = _ref => {
|
|
|
19
19
|
if (!childNode) return;
|
|
20
20
|
const rect = childNode.getBoundingClientRect();
|
|
21
21
|
const left = rect.width / 2 + rect.left + window.scrollX - 20;
|
|
22
|
-
|
|
22
|
+
let top = rect.top - 20 + window.scrollY;
|
|
23
|
+
if (top <= 0) {
|
|
24
|
+
top = rect.bottom - 20;
|
|
25
|
+
}
|
|
23
26
|
const display = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS) ? null : 'none';
|
|
24
27
|
const newStyle = {
|
|
25
28
|
display,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"BlazeLogo.js","names":["React","useState","useEffect","EDITOR_MODE_ICON_CLASS","EDITOR_MODE_HIGHLIGHT_CLASS","BlazeLogo","_ref","childNode","props","_objectWithoutProperties","_excluded","id","style","setStyle","rect","getBoundingClientRect","left","width","window","scrollX","top","scrollY","display","classList","contains","newStyle","observer","MutationObserver","mutations","forEach","mutation","type","attributeName","isHighlighted","_objectSpread","observe","attributes","disconnect","createElement","_extends","className","xmlns","height","fill","transform","d","fillRule"],"sources":["../../../src/system-components/EditorMode/BlazeLogo.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { EDITOR_MODE_ICON_CLASS, EDITOR_MODE_HIGHLIGHT_CLASS } from './constants';\n\nconst BlazeLogo = ({ childNode, ...props }) => {\n const { id } = props;\n const [style, setStyle] = useState({});\n\n useEffect(() => {\n if (!childNode) return;\n\n const rect = childNode.getBoundingClientRect();\n const left = rect.width / 2 + rect.left + window.scrollX - 20;\n
|
|
1
|
+
{"version":3,"file":"BlazeLogo.js","names":["React","useState","useEffect","EDITOR_MODE_ICON_CLASS","EDITOR_MODE_HIGHLIGHT_CLASS","BlazeLogo","_ref","childNode","props","_objectWithoutProperties","_excluded","id","style","setStyle","rect","getBoundingClientRect","left","width","window","scrollX","top","scrollY","bottom","display","classList","contains","newStyle","observer","MutationObserver","mutations","forEach","mutation","type","attributeName","isHighlighted","_objectSpread","observe","attributes","disconnect","createElement","_extends","className","xmlns","height","fill","transform","d","fillRule"],"sources":["../../../src/system-components/EditorMode/BlazeLogo.js"],"sourcesContent":["import React, { useState, useEffect } from 'react';\nimport { EDITOR_MODE_ICON_CLASS, EDITOR_MODE_HIGHLIGHT_CLASS } from './constants';\n\nconst BlazeLogo = ({ childNode, ...props }) => {\n const { id } = props;\n const [style, setStyle] = useState({});\n\n useEffect(() => {\n if (!childNode) return;\n\n const rect = childNode.getBoundingClientRect();\n const left = rect.width / 2 + rect.left + window.scrollX - 20;\n let top = rect.top - 20 + window.scrollY;\n if (top <= 0) {\n top = rect.bottom - 20;\n }\n const display = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS) ? null : 'none';\n const newStyle = { display, top, left };\n setStyle(newStyle);\n\n const observer = new MutationObserver(mutations => {\n mutations.forEach(mutation => {\n if (mutation.type === 'attributes' && mutation.attributeName === 'class') {\n const isHighlighted = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS);\n setStyle({ ...newStyle, display: isHighlighted ? null : 'none' });\n }\n });\n });\n observer.observe(childNode, { attributes: true });\n return () => observer.disconnect();\n }, [childNode, id]);\n\n // todo: fix icon hover/click activation while using position absolute\n return (\n <button type=\"button\" className={EDITOR_MODE_ICON_CLASS} {...props} style={style}>\n <svg xmlns=\"http://www.w3.org/2000/svg\" width=\"22\" height=\"33\">\n <path\n fill=\"currentColor\"\n transform=\"translate(1.0415 1.85962)\"\n d=\"M7.0214715 6.2017469C7.0214715 6.2017469 4.6948299 13.380771 5.2965479 15.065234C5.6174636 15.947572 6.3796396 16.18821 7.3022733 15.386085C9.1074257 13.781834 13.078762 6.3621721 9.949831 0.42644304C8.7463951 -1.8596147 18.293648 5.1589837 16.328037 18.755013C16.087351 20.559793 16.809412 19.998306 17.250671 19.236286C19.176168 15.947572 17.972733 11.616095 17.972733 10.894181C17.972733 10.172268 19.657541 12.939602 19.777885 18.353949C19.89823 23.768295 17.050098 29.022219 11.393953 29.98477C10.03006 30.225407 13.199106 27.578392 13.640366 24.610529C13.68048 24.329784 10.39109 28.300306 9.5888004 27.738817C9.2277699 27.49818 15.36529 19.877987 13.199106 13.300558C13.158992 13.140133 11.754984 24.409996 6.3796396 27.097116C3.3309369 28.621155 0.60315031 25.051697 0.12177619 21.963514C-1.0415446 13.862046 6.4999828 8.7284422 7.0214715 6.2017469Z\"\n fillRule=\"evenodd\"\n />\n </svg>\n </button>\n );\n};\n\nexport default BlazeLogo;\n"],"mappings":";;;;;;AAAA,OAAOA,KAAK,IAAIC,QAAQ,EAAEC,SAAS,QAAQ,OAAO;AAClD,SAASC,sBAAsB,EAAEC,2BAA2B,QAAQ,aAAa;AAEjF,MAAMC,SAAS,GAAGC,IAAA,IAA6B;EAAA,IAA5B;MAAEC;IAAoB,CAAC,GAAAD,IAAA;IAAPE,KAAK,GAAAC,wBAAA,CAAAH,IAAA,EAAAI,SAAA;EACtC,MAAM;IAAEC;EAAG,CAAC,GAAGH,KAAK;EACpB,MAAM,CAACI,KAAK,EAAEC,QAAQ,CAAC,GAAGZ,QAAQ,CAAC,CAAC,CAAC,CAAC;EAEtCC,SAAS,CAAC,MAAM;IACd,IAAI,CAACK,SAAS,EAAE;IAEhB,MAAMO,IAAI,GAAGP,SAAS,CAACQ,qBAAqB,CAAC,CAAC;IAC9C,MAAMC,IAAI,GAAGF,IAAI,CAACG,KAAK,GAAG,CAAC,GAAGH,IAAI,CAACE,IAAI,GAAGE,MAAM,CAACC,OAAO,GAAG,EAAE;IAC7D,IAAIC,GAAG,GAAGN,IAAI,CAACM,GAAG,GAAG,EAAE,GAAGF,MAAM,CAACG,OAAO;IACxC,IAAID,GAAG,IAAI,CAAC,EAAE;MACZA,GAAG,GAAGN,IAAI,CAACQ,MAAM,GAAG,EAAE;IACxB;IACA,MAAMC,OAAO,GAAGhB,SAAS,CAACiB,SAAS,CAACC,QAAQ,CAACrB,2BAA2B,CAAC,GAAG,IAAI,GAAG,MAAM;IACzF,MAAMsB,QAAQ,GAAG;MAAEH,OAAO;MAAEH,GAAG;MAAEJ;IAAK,CAAC;IACvCH,QAAQ,CAACa,QAAQ,CAAC;IAElB,MAAMC,QAAQ,GAAG,IAAIC,gBAAgB,CAACC,SAAS,IAAI;MACjDA,SAAS,CAACC,OAAO,CAACC,QAAQ,IAAI;QAC5B,IAAIA,QAAQ,CAACC,IAAI,KAAK,YAAY,IAAID,QAAQ,CAACE,aAAa,KAAK,OAAO,EAAE;UACxE,MAAMC,aAAa,GAAG3B,SAAS,CAACiB,SAAS,CAACC,QAAQ,CAACrB,2BAA2B,CAAC;UAC/ES,QAAQ,CAAAsB,aAAA,CAAAA,aAAA,KAAMT,QAAQ;YAAEH,OAAO,EAAEW,aAAa,GAAG,IAAI,GAAG;UAAM,EAAE,CAAC;QACnE;MACF,CAAC,CAAC;IACJ,CAAC,CAAC;IACFP,QAAQ,CAACS,OAAO,CAAC7B,SAAS,EAAE;MAAE8B,UAAU,EAAE;IAAK,CAAC,CAAC;IACjD,OAAO,MAAMV,QAAQ,CAACW,UAAU,CAAC,CAAC;EACpC,CAAC,EAAE,CAAC/B,SAAS,EAAEI,EAAE,CAAC,CAAC;;EAEnB;EACA,oBACEX,KAAA,CAAAuC,aAAA,WAAAC,QAAA;IAAQR,IAAI,EAAC,QAAQ;IAACS,SAAS,EAAEtC;EAAuB,GAAKK,KAAK;IAAEI,KAAK,EAAEA;EAAM,iBAC/EZ,KAAA,CAAAuC,aAAA;IAAKG,KAAK,EAAC,4BAA4B;IAACzB,KAAK,EAAC,IAAI;IAAC0B,MAAM,EAAC;EAAI,gBAC5D3C,KAAA,CAAAuC,aAAA;IACEK,IAAI,EAAC,cAAc;IACnBC,SAAS,EAAC,2BAA2B;IACrCC,CAAC,EAAC,21BAA21B;IAC71BC,QAAQ,EAAC;EAAS,CACnB,CACE,CACC,CAAC;AAEb,CAAC;AAED,eAAe1C,SAAS","ignoreList":[]}
|
|
@@ -28,7 +28,7 @@ const PbWrapper = ({
|
|
|
28
28
|
return /*#__PURE__*/React.createElement(React.Fragment, null, /*#__PURE__*/React.createElement(TagName, {
|
|
29
29
|
ref: ref,
|
|
30
30
|
"pb-component-name": name
|
|
31
|
-
}), logoProps && createPortal(/*#__PURE__*/React.createElement(BlazeLogo, logoProps), document.body));
|
|
31
|
+
}), type === 'end' && logoProps && createPortal(/*#__PURE__*/React.createElement(BlazeLogo, logoProps), document.body));
|
|
32
32
|
};
|
|
33
33
|
export default PbWrapper;
|
|
34
34
|
//# sourceMappingURL=PbWrapper.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PbWrapper.js","names":["React","useRef","useEffect","useState","createPortal","useMainContext","addEditorModeEventListeners","BlazeLogo","PbWrapper","name","type","ref","logoProps","setLogoProps","debugOptions","adminHref","unmount","TagName","createElement","Fragment","document","body"],"sources":["../../../src/system-components/EditorMode/PbWrapper.js"],"sourcesContent":["import React, { useRef, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useMainContext } from '@blaze-cms/nextjs-components';\nimport addEditorModeEventListeners from './helpers/add-editor-mode-event-listeners';\nimport BlazeLogo from './BlazeLogo';\n\nconst PbWrapper = ({ name, type = 'start' }) => {\n const ref = useRef(null);\n const [logoProps, setLogoProps] = useState(null);\n const { debugOptions: { adminHref } = {} } = useMainContext();\n\n useEffect(() => {\n const unmount = addEditorModeEventListeners({ ref, name, adminHref, type, setLogoProps });\n\n return unmount;\n }, [adminHref, name, type]);\n
|
|
1
|
+
{"version":3,"file":"PbWrapper.js","names":["React","useRef","useEffect","useState","createPortal","useMainContext","addEditorModeEventListeners","BlazeLogo","PbWrapper","name","type","ref","logoProps","setLogoProps","debugOptions","adminHref","unmount","TagName","createElement","Fragment","document","body"],"sources":["../../../src/system-components/EditorMode/PbWrapper.js"],"sourcesContent":["import React, { useRef, useEffect, useState } from 'react';\nimport { createPortal } from 'react-dom';\nimport { useMainContext } from '@blaze-cms/nextjs-components';\nimport addEditorModeEventListeners from './helpers/add-editor-mode-event-listeners';\nimport BlazeLogo from './BlazeLogo';\n\nconst PbWrapper = ({ name, type = 'start' }) => {\n const ref = useRef(null);\n const [logoProps, setLogoProps] = useState(null);\n const { debugOptions: { adminHref } = {} } = useMainContext();\n\n useEffect(() => {\n const unmount = addEditorModeEventListeners({ ref, name, adminHref, type, setLogoProps });\n\n return unmount;\n }, [adminHref, name, type]);\n const TagName = `pb-wrapper-${type}`;\n\n return (\n <>\n <TagName ref={ref} pb-component-name={name} />\n {type === 'end' && logoProps && createPortal(<BlazeLogo {...logoProps} />, document.body)}\n </>\n );\n};\n\nexport default PbWrapper;\n"],"mappings":"AAAA,OAAOA,KAAK,IAAIC,MAAM,EAAEC,SAAS,EAAEC,QAAQ,QAAQ,OAAO;AAC1D,SAASC,YAAY,QAAQ,WAAW;AACxC,SAASC,cAAc,QAAQ,8BAA8B;AAC7D,OAAOC,2BAA2B,MAAM,2CAA2C;AACnF,OAAOC,SAAS,MAAM,aAAa;AAEnC,MAAMC,SAAS,GAAGA,CAAC;EAAEC,IAAI;EAAEC,IAAI,GAAG;AAAQ,CAAC,KAAK;EAC9C,MAAMC,GAAG,GAAGV,MAAM,CAAC,IAAI,CAAC;EACxB,MAAM,CAACW,SAAS,EAAEC,YAAY,CAAC,GAAGV,QAAQ,CAAC,IAAI,CAAC;EAChD,MAAM;IAAEW,YAAY,EAAE;MAAEC;IAAU,CAAC,GAAG,CAAC;EAAE,CAAC,GAAGV,cAAc,CAAC,CAAC;EAE7DH,SAAS,CAAC,MAAM;IACd,MAAMc,OAAO,GAAGV,2BAA2B,CAAC;MAAEK,GAAG;MAAEF,IAAI;MAAEM,SAAS;MAAEL,IAAI;MAAEG;IAAa,CAAC,CAAC;IAEzF,OAAOG,OAAO;EAChB,CAAC,EAAE,CAACD,SAAS,EAAEN,IAAI,EAAEC,IAAI,CAAC,CAAC;EAC3B,MAAMO,OAAO,GAAG,cAAcP,IAAI,EAAE;EAEpC,oBACEV,KAAA,CAAAkB,aAAA,CAAAlB,KAAA,CAAAmB,QAAA,qBACEnB,KAAA,CAAAkB,aAAA,CAACD,OAAO;IAACN,GAAG,EAAEA,GAAI;IAAC,qBAAmBF;EAAK,CAAE,CAAC,EAC7CC,IAAI,KAAK,KAAK,IAAIE,SAAS,IAAIR,YAAY,cAACJ,KAAA,CAAAkB,aAAA,CAACX,SAAS,EAAKK,SAAY,CAAC,EAAEQ,QAAQ,CAACC,IAAI,CACxF,CAAC;AAEP,CAAC;AAED,eAAeb,SAAS","ignoreList":[]}
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { getComponentId } from '../../../helpers';
|
|
2
2
|
import { EDITOR_MODE_HIGHLIGHT_CLASS, EDITOR_MODE_ICON_CLASS } from '../constants';
|
|
3
|
+
import checkIsOverBlazeIcon from './check-is-over-blaze-icon';
|
|
3
4
|
const addEditorModeEventListeners = ({
|
|
4
5
|
ref,
|
|
5
6
|
name,
|
|
@@ -32,11 +33,6 @@ const addEditorModeEventListeners = ({
|
|
|
32
33
|
const cleanUpFunctions = Object.values(siblings).map(childNode => {
|
|
33
34
|
const componentId = getComponentId(name);
|
|
34
35
|
const clickItemId = `click-${componentId}`;
|
|
35
|
-
const click = e => {
|
|
36
|
-
e.stopPropagation();
|
|
37
|
-
e.preventDefault();
|
|
38
|
-
window.open(`${adminHref}#${componentId}`, adminHref);
|
|
39
|
-
};
|
|
40
36
|
const mouseenter = e => {
|
|
41
37
|
e.stopPropagation();
|
|
42
38
|
document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {
|
|
@@ -52,14 +48,24 @@ const addEditorModeEventListeners = ({
|
|
|
52
48
|
};
|
|
53
49
|
const mouseleave = e => {
|
|
54
50
|
e.stopPropagation();
|
|
51
|
+
if (checkIsOverBlazeIcon(e)) {
|
|
52
|
+
return;
|
|
53
|
+
}
|
|
54
|
+
setLogoProps(null);
|
|
55
55
|
if (e.toElement) {
|
|
56
56
|
const icon = e.toElement.closest(`.${EDITOR_MODE_ICON_CLASS}`);
|
|
57
|
+
document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {
|
|
58
|
+
node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);
|
|
59
|
+
});
|
|
57
60
|
if (icon && icon.id === clickItemId) {
|
|
58
61
|
e.stopPropagation();
|
|
59
|
-
return;
|
|
60
62
|
}
|
|
61
63
|
}
|
|
62
|
-
|
|
64
|
+
};
|
|
65
|
+
const click = e => {
|
|
66
|
+
e.stopPropagation();
|
|
67
|
+
e.preventDefault();
|
|
68
|
+
window.open(`${adminHref}#${componentId}`, adminHref);
|
|
63
69
|
};
|
|
64
70
|
childNode.addEventListener('click', click); // todo: remove listener and trigger on icon click
|
|
65
71
|
childNode.addEventListener('mouseenter', mouseenter);
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"add-editor-mode-event-listeners.js","names":["getComponentId","EDITOR_MODE_HIGHLIGHT_CLASS","EDITOR_MODE_ICON_CLASS","addEditorModeEventListeners","ref","name","adminHref","type","setLogoProps","current","parentNode","listeners","siblings","children","foundChildren","foundStart","child","getAttribute","push","cleanUpFunctions","Object","values","map","childNode","componentId","clickItemId","
|
|
1
|
+
{"version":3,"file":"add-editor-mode-event-listeners.js","names":["getComponentId","EDITOR_MODE_HIGHLIGHT_CLASS","EDITOR_MODE_ICON_CLASS","checkIsOverBlazeIcon","addEditorModeEventListeners","ref","name","adminHref","type","setLogoProps","current","parentNode","listeners","siblings","children","foundChildren","foundStart","child","getAttribute","push","cleanUpFunctions","Object","values","map","childNode","componentId","clickItemId","mouseenter","e","stopPropagation","document","querySelectorAll","forEach","node","classList","remove","add","id","onClick","click","mouseleave","toElement","icon","closest","preventDefault","window","open","addEventListener","nodeCleanup","events","entries","event","handler","removeEventListener","unmount","fn"],"sources":["../../../../src/system-components/EditorMode/helpers/add-editor-mode-event-listeners.js"],"sourcesContent":["import { getComponentId } from '../../../helpers';\nimport { EDITOR_MODE_HIGHLIGHT_CLASS, EDITOR_MODE_ICON_CLASS } from '../constants';\nimport checkIsOverBlazeIcon from './check-is-over-blaze-icon';\n\nconst addEditorModeEventListeners = ({ ref, name, adminHref, type, setLogoProps }) => {\n // ignore start tags and if parent not found\n if (type !== 'end' || !ref.current || !ref.current.parentNode) return;\n\n const listeners = [];\n\n const siblings = ref.current.parentNode.children;\n\n const foundChildren = [];\n let foundStart = false;\n // eslint-disable-next-line no-restricted-syntax, no-unused-vars\n for (const child of siblings) {\n if (!foundStart) {\n // find start tag\n if (child.getAttribute('pb-component-name') === name) {\n foundStart = true;\n }\n // eslint-disable-next-line no-continue\n continue;\n }\n\n if (child === ref.current) {\n // end tag found\n break;\n }\n\n foundChildren.push(child); // all nodes between start and end tags - PB component nodes\n }\n\n const cleanUpFunctions = Object.values(siblings).map(childNode => {\n const componentId = getComponentId(name);\n const clickItemId = `click-${componentId}`;\n\n const mouseenter = e => {\n e.stopPropagation();\n\n document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {\n node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);\n });\n childNode.classList.add(EDITOR_MODE_HIGHLIGHT_CLASS);\n\n setLogoProps({\n id: clickItemId,\n 'aria-label': `Edit ${name}`,\n childNode,\n onClick: click\n });\n };\n\n const mouseleave = e => {\n e.stopPropagation();\n if (checkIsOverBlazeIcon(e)) {\n return;\n }\n setLogoProps(null);\n if (e.toElement) {\n const icon = e.toElement.closest(`.${EDITOR_MODE_ICON_CLASS}`);\n document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {\n node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);\n });\n if (icon && icon.id === clickItemId) {\n e.stopPropagation();\n }\n }\n };\n\n const click = e => {\n e.stopPropagation();\n e.preventDefault();\n window.open(`${adminHref}#${componentId}`, adminHref);\n };\n\n childNode.addEventListener('click', click); // todo: remove listener and trigger on icon click\n childNode.addEventListener('mouseenter', mouseenter);\n childNode.addEventListener('mouseleave', mouseleave);\n\n listeners.push([childNode, { click, mouseenter, mouseleave }]);\n\n const nodeCleanup = () => {\n listeners.forEach(([, events]) => {\n Object.entries(events).forEach(([event, handler]) => {\n childNode.removeEventListener(event, handler);\n });\n });\n };\n\n return nodeCleanup;\n });\n\n const unmount = () => {\n cleanUpFunctions.forEach(fn => fn());\n };\n\n return unmount;\n};\n\nexport default addEditorModeEventListeners;\n"],"mappings":"AAAA,SAASA,cAAc,QAAQ,kBAAkB;AACjD,SAASC,2BAA2B,EAAEC,sBAAsB,QAAQ,cAAc;AAClF,OAAOC,oBAAoB,MAAM,4BAA4B;AAE7D,MAAMC,2BAA2B,GAAGA,CAAC;EAAEC,GAAG;EAAEC,IAAI;EAAEC,SAAS;EAAEC,IAAI;EAAEC;AAAa,CAAC,KAAK;EACpF;EACA,IAAID,IAAI,KAAK,KAAK,IAAI,CAACH,GAAG,CAACK,OAAO,IAAI,CAACL,GAAG,CAACK,OAAO,CAACC,UAAU,EAAE;EAE/D,MAAMC,SAAS,GAAG,EAAE;EAEpB,MAAMC,QAAQ,GAAGR,GAAG,CAACK,OAAO,CAACC,UAAU,CAACG,QAAQ;EAEhD,MAAMC,aAAa,GAAG,EAAE;EACxB,IAAIC,UAAU,GAAG,KAAK;EACtB;EACA,KAAK,MAAMC,KAAK,IAAIJ,QAAQ,EAAE;IAC5B,IAAI,CAACG,UAAU,EAAE;MACf;MACA,IAAIC,KAAK,CAACC,YAAY,CAAC,mBAAmB,CAAC,KAAKZ,IAAI,EAAE;QACpDU,UAAU,GAAG,IAAI;MACnB;MACA;MACA;IACF;IAEA,IAAIC,KAAK,KAAKZ,GAAG,CAACK,OAAO,EAAE;MACzB;MACA;IACF;IAEAK,aAAa,CAACI,IAAI,CAACF,KAAK,CAAC,CAAC,CAAC;EAC7B;EAEA,MAAMG,gBAAgB,GAAGC,MAAM,CAACC,MAAM,CAACT,QAAQ,CAAC,CAACU,GAAG,CAACC,SAAS,IAAI;IAChE,MAAMC,WAAW,GAAGzB,cAAc,CAACM,IAAI,CAAC;IACxC,MAAMoB,WAAW,GAAG,SAASD,WAAW,EAAE;IAE1C,MAAME,UAAU,GAAGC,CAAC,IAAI;MACtBA,CAAC,CAACC,eAAe,CAAC,CAAC;MAEnBC,QAAQ,CAACC,gBAAgB,CAAC,IAAI9B,2BAA2B,EAAE,CAAC,CAAC+B,OAAO,CAACC,IAAI,IAAI;QAC3EA,IAAI,CAACC,SAAS,CAACC,MAAM,CAAClC,2BAA2B,CAAC;MACpD,CAAC,CAAC;MACFuB,SAAS,CAACU,SAAS,CAACE,GAAG,CAACnC,2BAA2B,CAAC;MAEpDQ,YAAY,CAAC;QACX4B,EAAE,EAAEX,WAAW;QACf,YAAY,EAAE,QAAQpB,IAAI,EAAE;QAC5BkB,SAAS;QACTc,OAAO,EAAEC;MACX,CAAC,CAAC;IACJ,CAAC;IAED,MAAMC,UAAU,GAAGZ,CAAC,IAAI;MACtBA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnB,IAAI1B,oBAAoB,CAACyB,CAAC,CAAC,EAAE;QAC3B;MACF;MACAnB,YAAY,CAAC,IAAI,CAAC;MAClB,IAAImB,CAAC,CAACa,SAAS,EAAE;QACf,MAAMC,IAAI,GAAGd,CAAC,CAACa,SAAS,CAACE,OAAO,CAAC,IAAIzC,sBAAsB,EAAE,CAAC;QAC9D4B,QAAQ,CAACC,gBAAgB,CAAC,IAAI9B,2BAA2B,EAAE,CAAC,CAAC+B,OAAO,CAACC,IAAI,IAAI;UAC3EA,IAAI,CAACC,SAAS,CAACC,MAAM,CAAClC,2BAA2B,CAAC;QACpD,CAAC,CAAC;QACF,IAAIyC,IAAI,IAAIA,IAAI,CAACL,EAAE,KAAKX,WAAW,EAAE;UACnCE,CAAC,CAACC,eAAe,CAAC,CAAC;QACrB;MACF;IACF,CAAC;IAED,MAAMU,KAAK,GAAGX,CAAC,IAAI;MACjBA,CAAC,CAACC,eAAe,CAAC,CAAC;MACnBD,CAAC,CAACgB,cAAc,CAAC,CAAC;MAClBC,MAAM,CAACC,IAAI,CAAC,GAAGvC,SAAS,IAAIkB,WAAW,EAAE,EAAElB,SAAS,CAAC;IACvD,CAAC;IAEDiB,SAAS,CAACuB,gBAAgB,CAAC,OAAO,EAAER,KAAK,CAAC,CAAC,CAAC;IAC5Cf,SAAS,CAACuB,gBAAgB,CAAC,YAAY,EAAEpB,UAAU,CAAC;IACpDH,SAAS,CAACuB,gBAAgB,CAAC,YAAY,EAAEP,UAAU,CAAC;IAEpD5B,SAAS,CAACO,IAAI,CAAC,CAACK,SAAS,EAAE;MAAEe,KAAK;MAAEZ,UAAU;MAAEa;IAAW,CAAC,CAAC,CAAC;IAE9D,MAAMQ,WAAW,GAAGA,CAAA,KAAM;MACxBpC,SAAS,CAACoB,OAAO,CAAC,CAAC,GAAGiB,MAAM,CAAC,KAAK;QAChC5B,MAAM,CAAC6B,OAAO,CAACD,MAAM,CAAC,CAACjB,OAAO,CAAC,CAAC,CAACmB,KAAK,EAAEC,OAAO,CAAC,KAAK;UACnD5B,SAAS,CAAC6B,mBAAmB,CAACF,KAAK,EAAEC,OAAO,CAAC;QAC/C,CAAC,CAAC;MACJ,CAAC,CAAC;IACJ,CAAC;IAED,OAAOJ,WAAW;EACpB,CAAC,CAAC;EAEF,MAAMM,OAAO,GAAGA,CAAA,KAAM;IACpBlC,gBAAgB,CAACY,OAAO,CAACuB,EAAE,IAAIA,EAAE,CAAC,CAAC,CAAC;EACtC,CAAC;EAED,OAAOD,OAAO;AAChB,CAAC;AAED,eAAelD,2BAA2B","ignoreList":[]}
|
|
@@ -0,0 +1,19 @@
|
|
|
1
|
+
import { EDITOR_MODE_ICON_CLASS } from '../constants';
|
|
2
|
+
const checkIsOverBlazeIcon = event => {
|
|
3
|
+
const {
|
|
4
|
+
relatedTarget
|
|
5
|
+
} = event;
|
|
6
|
+
if (!relatedTarget) return false;
|
|
7
|
+
if (relatedTarget.tagName === 'BUTTON' && relatedTarget.className === EDITOR_MODE_ICON_CLASS) {
|
|
8
|
+
return true;
|
|
9
|
+
}
|
|
10
|
+
if (relatedTarget.tagName === 'svg' && relatedTarget.parentNode.className === EDITOR_MODE_ICON_CLASS) {
|
|
11
|
+
return true;
|
|
12
|
+
}
|
|
13
|
+
if (relatedTarget.tagName === 'path' && relatedTarget.parentNode.parentNode.className === EDITOR_MODE_ICON_CLASS) {
|
|
14
|
+
return true;
|
|
15
|
+
}
|
|
16
|
+
return false;
|
|
17
|
+
};
|
|
18
|
+
export default checkIsOverBlazeIcon;
|
|
19
|
+
//# sourceMappingURL=check-is-over-blaze-icon.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"check-is-over-blaze-icon.js","names":["EDITOR_MODE_ICON_CLASS","checkIsOverBlazeIcon","event","relatedTarget","tagName","className","parentNode"],"sources":["../../../../src/system-components/EditorMode/helpers/check-is-over-blaze-icon.js"],"sourcesContent":["import { EDITOR_MODE_ICON_CLASS } from '../constants';\n\nconst checkIsOverBlazeIcon = event => {\n const { relatedTarget } = event;\n if (!relatedTarget) return false;\n if (relatedTarget.tagName === 'BUTTON' && relatedTarget.className === EDITOR_MODE_ICON_CLASS) {\n return true;\n }\n if (\n relatedTarget.tagName === 'svg' &&\n relatedTarget.parentNode.className === EDITOR_MODE_ICON_CLASS\n ) {\n return true;\n }\n if (\n relatedTarget.tagName === 'path' &&\n relatedTarget.parentNode.parentNode.className === EDITOR_MODE_ICON_CLASS\n ) {\n return true;\n }\n return false;\n};\n\nexport default checkIsOverBlazeIcon;\n"],"mappings":"AAAA,SAASA,sBAAsB,QAAQ,cAAc;AAErD,MAAMC,oBAAoB,GAAGC,KAAK,IAAI;EACpC,MAAM;IAAEC;EAAc,CAAC,GAAGD,KAAK;EAC/B,IAAI,CAACC,aAAa,EAAE,OAAO,KAAK;EAChC,IAAIA,aAAa,CAACC,OAAO,KAAK,QAAQ,IAAID,aAAa,CAACE,SAAS,KAAKL,sBAAsB,EAAE;IAC5F,OAAO,IAAI;EACb;EACA,IACEG,aAAa,CAACC,OAAO,KAAK,KAAK,IAC/BD,aAAa,CAACG,UAAU,CAACD,SAAS,KAAKL,sBAAsB,EAC7D;IACA,OAAO,IAAI;EACb;EACA,IACEG,aAAa,CAACC,OAAO,KAAK,MAAM,IAChCD,aAAa,CAACG,UAAU,CAACA,UAAU,CAACD,SAAS,KAAKL,sBAAsB,EACxE;IACA,OAAO,IAAI;EACb;EACA,OAAO,KAAK;AACd,CAAC;AAED,eAAeC,oBAAoB","ignoreList":[]}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@blaze-cms/react-page-builder",
|
|
3
|
-
"version": "0.146.0-node18-tooltips.
|
|
3
|
+
"version": "0.146.0-node18-tooltips.24",
|
|
4
4
|
"description": "Blaze react page builder",
|
|
5
5
|
"main": "lib/index.js",
|
|
6
6
|
"module": "lib-es/index.js",
|
|
@@ -92,5 +92,5 @@
|
|
|
92
92
|
"lib/*",
|
|
93
93
|
"lib-es/*"
|
|
94
94
|
],
|
|
95
|
-
"gitHead": "
|
|
95
|
+
"gitHead": "6574737c23fe0632126dc2cd9689546622ebb1e0"
|
|
96
96
|
}
|
|
@@ -10,7 +10,10 @@ const BlazeLogo = ({ childNode, ...props }) => {
|
|
|
10
10
|
|
|
11
11
|
const rect = childNode.getBoundingClientRect();
|
|
12
12
|
const left = rect.width / 2 + rect.left + window.scrollX - 20;
|
|
13
|
-
|
|
13
|
+
let top = rect.top - 20 + window.scrollY;
|
|
14
|
+
if (top <= 0) {
|
|
15
|
+
top = rect.bottom - 20;
|
|
16
|
+
}
|
|
14
17
|
const display = childNode.classList.contains(EDITOR_MODE_HIGHLIGHT_CLASS) ? null : 'none';
|
|
15
18
|
const newStyle = { display, top, left };
|
|
16
19
|
setStyle(newStyle);
|
|
@@ -14,12 +14,12 @@ const PbWrapper = ({ name, type = 'start' }) => {
|
|
|
14
14
|
|
|
15
15
|
return unmount;
|
|
16
16
|
}, [adminHref, name, type]);
|
|
17
|
-
|
|
18
17
|
const TagName = `pb-wrapper-${type}`;
|
|
18
|
+
|
|
19
19
|
return (
|
|
20
20
|
<>
|
|
21
21
|
<TagName ref={ref} pb-component-name={name} />
|
|
22
|
-
{logoProps && createPortal(<BlazeLogo {...logoProps} />, document.body)}
|
|
22
|
+
{type === 'end' && logoProps && createPortal(<BlazeLogo {...logoProps} />, document.body)}
|
|
23
23
|
</>
|
|
24
24
|
);
|
|
25
25
|
};
|
|
@@ -1,5 +1,6 @@
|
|
|
1
1
|
import { getComponentId } from '../../../helpers';
|
|
2
2
|
import { EDITOR_MODE_HIGHLIGHT_CLASS, EDITOR_MODE_ICON_CLASS } from '../constants';
|
|
3
|
+
import checkIsOverBlazeIcon from './check-is-over-blaze-icon';
|
|
3
4
|
|
|
4
5
|
const addEditorModeEventListeners = ({ ref, name, adminHref, type, setLogoProps }) => {
|
|
5
6
|
// ignore start tags and if parent not found
|
|
@@ -33,11 +34,6 @@ const addEditorModeEventListeners = ({ ref, name, adminHref, type, setLogoProps
|
|
|
33
34
|
const cleanUpFunctions = Object.values(siblings).map(childNode => {
|
|
34
35
|
const componentId = getComponentId(name);
|
|
35
36
|
const clickItemId = `click-${componentId}`;
|
|
36
|
-
const click = e => {
|
|
37
|
-
e.stopPropagation();
|
|
38
|
-
e.preventDefault();
|
|
39
|
-
window.open(`${adminHref}#${componentId}`, adminHref);
|
|
40
|
-
};
|
|
41
37
|
|
|
42
38
|
const mouseenter = e => {
|
|
43
39
|
e.stopPropagation();
|
|
@@ -57,14 +53,25 @@ const addEditorModeEventListeners = ({ ref, name, adminHref, type, setLogoProps
|
|
|
57
53
|
|
|
58
54
|
const mouseleave = e => {
|
|
59
55
|
e.stopPropagation();
|
|
56
|
+
if (checkIsOverBlazeIcon(e)) {
|
|
57
|
+
return;
|
|
58
|
+
}
|
|
59
|
+
setLogoProps(null);
|
|
60
60
|
if (e.toElement) {
|
|
61
61
|
const icon = e.toElement.closest(`.${EDITOR_MODE_ICON_CLASS}`);
|
|
62
|
+
document.querySelectorAll(`.${EDITOR_MODE_HIGHLIGHT_CLASS}`).forEach(node => {
|
|
63
|
+
node.classList.remove(EDITOR_MODE_HIGHLIGHT_CLASS);
|
|
64
|
+
});
|
|
62
65
|
if (icon && icon.id === clickItemId) {
|
|
63
66
|
e.stopPropagation();
|
|
64
|
-
return;
|
|
65
67
|
}
|
|
66
68
|
}
|
|
67
|
-
|
|
69
|
+
};
|
|
70
|
+
|
|
71
|
+
const click = e => {
|
|
72
|
+
e.stopPropagation();
|
|
73
|
+
e.preventDefault();
|
|
74
|
+
window.open(`${adminHref}#${componentId}`, adminHref);
|
|
68
75
|
};
|
|
69
76
|
|
|
70
77
|
childNode.addEventListener('click', click); // todo: remove listener and trigger on icon click
|
|
@@ -0,0 +1,24 @@
|
|
|
1
|
+
import { EDITOR_MODE_ICON_CLASS } from '../constants';
|
|
2
|
+
|
|
3
|
+
const checkIsOverBlazeIcon = event => {
|
|
4
|
+
const { relatedTarget } = event;
|
|
5
|
+
if (!relatedTarget) return false;
|
|
6
|
+
if (relatedTarget.tagName === 'BUTTON' && relatedTarget.className === EDITOR_MODE_ICON_CLASS) {
|
|
7
|
+
return true;
|
|
8
|
+
}
|
|
9
|
+
if (
|
|
10
|
+
relatedTarget.tagName === 'svg' &&
|
|
11
|
+
relatedTarget.parentNode.className === EDITOR_MODE_ICON_CLASS
|
|
12
|
+
) {
|
|
13
|
+
return true;
|
|
14
|
+
}
|
|
15
|
+
if (
|
|
16
|
+
relatedTarget.tagName === 'path' &&
|
|
17
|
+
relatedTarget.parentNode.parentNode.className === EDITOR_MODE_ICON_CLASS
|
|
18
|
+
) {
|
|
19
|
+
return true;
|
|
20
|
+
}
|
|
21
|
+
return false;
|
|
22
|
+
};
|
|
23
|
+
|
|
24
|
+
export default checkIsOverBlazeIcon;
|