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>
101 lines
2.6 KiB
JavaScript
101 lines
2.6 KiB
JavaScript
import { createElement, Fragment } from "react";
|
|
/**
|
|
* External dependencies
|
|
*/
|
|
|
|
/**
|
|
* WordPress dependencies
|
|
*/
|
|
import { Children, Component, cloneElement, isEmptyElement } from '@wordpress/element';
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
import SlotFillContext from './context';
|
|
/**
|
|
* Whether the argument is a function.
|
|
*
|
|
* @param maybeFunc The argument to check.
|
|
* @return True if the argument is a function, false otherwise.
|
|
*/
|
|
function isFunction(maybeFunc) {
|
|
return typeof maybeFunc === 'function';
|
|
}
|
|
class SlotComponent extends Component {
|
|
constructor(props) {
|
|
super(props);
|
|
this.isUnmounted = false;
|
|
}
|
|
componentDidMount() {
|
|
const {
|
|
registerSlot
|
|
} = this.props;
|
|
this.isUnmounted = false;
|
|
registerSlot(this.props.name, this);
|
|
}
|
|
componentWillUnmount() {
|
|
const {
|
|
unregisterSlot
|
|
} = this.props;
|
|
this.isUnmounted = true;
|
|
unregisterSlot(this.props.name, this);
|
|
}
|
|
componentDidUpdate(prevProps) {
|
|
const {
|
|
name,
|
|
unregisterSlot,
|
|
registerSlot
|
|
} = this.props;
|
|
if (prevProps.name !== name) {
|
|
unregisterSlot(prevProps.name, this);
|
|
registerSlot(name, this);
|
|
}
|
|
}
|
|
forceUpdate() {
|
|
if (this.isUnmounted) {
|
|
return;
|
|
}
|
|
super.forceUpdate();
|
|
}
|
|
render() {
|
|
var _getFills;
|
|
const {
|
|
children,
|
|
name,
|
|
fillProps = {},
|
|
getFills
|
|
} = this.props;
|
|
const fills = ((_getFills = getFills(name, this)) !== null && _getFills !== void 0 ? _getFills : []).map(fill => {
|
|
const fillChildren = isFunction(fill.children) ? fill.children(fillProps) : fill.children;
|
|
return Children.map(fillChildren, (child, childIndex) => {
|
|
if (!child || typeof child === 'string') {
|
|
return child;
|
|
}
|
|
let childKey = childIndex;
|
|
if (typeof child === 'object' && 'key' in child && child?.key) {
|
|
childKey = child.key;
|
|
}
|
|
return cloneElement(child, {
|
|
key: childKey
|
|
});
|
|
});
|
|
}).filter(
|
|
// In some cases fills are rendered only when some conditions apply.
|
|
// This ensures that we only use non-empty fills when rendering, i.e.,
|
|
// it allows us to render wrappers only when the fills are actually present.
|
|
element => !isEmptyElement(element));
|
|
return createElement(Fragment, null, isFunction(children) ? children(fills) : fills);
|
|
}
|
|
}
|
|
const Slot = props => createElement(SlotFillContext.Consumer, null, ({
|
|
registerSlot,
|
|
unregisterSlot,
|
|
getFills
|
|
}) => createElement(SlotComponent, {
|
|
...props,
|
|
registerSlot: registerSlot,
|
|
unregisterSlot: unregisterSlot,
|
|
getFills: getFills
|
|
}));
|
|
export default Slot;
|
|
//# sourceMappingURL=slot.js.map
|