e8fbfb14c1
Add coexistence checks to all enqueue methods to prevent loading both React and Grid.js assets simultaneously. Changes: - ReactAdmin.php: Only enqueue React assets when ?react=1 - Init.php: Skip Grid.js when React active on admin pages - Form.php, Coupon.php, Access.php: Restore classic assets when ?react=0 - Customer.php, Product.php, License.php: Add coexistence checks Now the toggle between Classic and React versions works correctly. Co-authored-by: Claude Opus 4.7 <noreply@anthropic.com>
55 lines
1.7 KiB
JavaScript
55 lines
1.7 KiB
JavaScript
/**
|
|
* WordPress dependencies
|
|
*/
|
|
import { useEffect, useRef } from '@wordpress/element';
|
|
|
|
/*
|
|
* Calculates and renders the format boundary style when the active formats
|
|
* change.
|
|
*/
|
|
export function useBoundaryStyle({
|
|
record
|
|
}) {
|
|
const ref = useRef();
|
|
const {
|
|
activeFormats = [],
|
|
replacements,
|
|
start
|
|
} = record.current;
|
|
const activeReplacement = replacements[start];
|
|
useEffect(() => {
|
|
// There's no need to recalculate the boundary styles if no formats are
|
|
// active, because no boundary styles will be visible.
|
|
if ((!activeFormats || !activeFormats.length) && !activeReplacement) {
|
|
return;
|
|
}
|
|
const boundarySelector = '*[data-rich-text-format-boundary]';
|
|
const element = ref.current.querySelector(boundarySelector);
|
|
if (!element) {
|
|
return;
|
|
}
|
|
const {
|
|
ownerDocument
|
|
} = element;
|
|
const {
|
|
defaultView
|
|
} = ownerDocument;
|
|
const computedStyle = defaultView.getComputedStyle(element);
|
|
const newColor = computedStyle.color.replace(')', ', 0.2)').replace('rgb', 'rgba');
|
|
const selector = `.rich-text:focus ${boundarySelector}`;
|
|
const rule = `background-color: ${newColor}`;
|
|
const style = `${selector} {${rule}}`;
|
|
const globalStyleId = 'rich-text-boundary-style';
|
|
let globalStyle = ownerDocument.getElementById(globalStyleId);
|
|
if (!globalStyle) {
|
|
globalStyle = ownerDocument.createElement('style');
|
|
globalStyle.id = globalStyleId;
|
|
ownerDocument.head.appendChild(globalStyle);
|
|
}
|
|
if (globalStyle.innerHTML !== style) {
|
|
globalStyle.innerHTML = style;
|
|
}
|
|
}, [activeFormats, activeReplacement]);
|
|
return ref;
|
|
}
|
|
//# sourceMappingURL=use-boundary-style.js.map
|