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.4 KiB
JavaScript
101 lines
2.4 KiB
JavaScript
"use strict";
|
|
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.TreeSelect = TreeSelect;
|
|
exports.default = void 0;
|
|
var _react = require("react");
|
|
var _element = require("@wordpress/element");
|
|
var _htmlEntities = require("@wordpress/html-entities");
|
|
var _selectControl = require("../select-control");
|
|
var _useDeprecatedProps = require("../utils/use-deprecated-props");
|
|
/**
|
|
* WordPress dependencies
|
|
*/
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
|
|
function getSelectOptions(tree, level = 0) {
|
|
return tree.flatMap(treeNode => [{
|
|
value: treeNode.id,
|
|
label: '\u00A0'.repeat(level * 3) + (0, _htmlEntities.decodeEntities)(treeNode.name)
|
|
}, ...getSelectOptions(treeNode.children || [], level + 1)]);
|
|
}
|
|
|
|
/**
|
|
* TreeSelect component is used to generate select input fields.
|
|
*
|
|
* ```jsx
|
|
* import { TreeSelect } from '@wordpress/components';
|
|
* import { useState } from '@wordpress/element';
|
|
*
|
|
* const MyTreeSelect = () => {
|
|
* const [ page, setPage ] = useState( 'p21' );
|
|
*
|
|
* return (
|
|
* <TreeSelect
|
|
* label="Parent page"
|
|
* noOptionLabel="No parent page"
|
|
* onChange={ ( newPage ) => setPage( newPage ) }
|
|
* selectedId={ page }
|
|
* tree={ [
|
|
* {
|
|
* name: 'Page 1',
|
|
* id: 'p1',
|
|
* children: [
|
|
* { name: 'Descend 1 of page 1', id: 'p11' },
|
|
* { name: 'Descend 2 of page 1', id: 'p12' },
|
|
* ],
|
|
* },
|
|
* {
|
|
* name: 'Page 2',
|
|
* id: 'p2',
|
|
* children: [
|
|
* {
|
|
* name: 'Descend 1 of page 2',
|
|
* id: 'p21',
|
|
* children: [
|
|
* {
|
|
* name: 'Descend 1 of Descend 1 of page 2',
|
|
* id: 'p211',
|
|
* },
|
|
* ],
|
|
* },
|
|
* ],
|
|
* },
|
|
* ] }
|
|
* />
|
|
* );
|
|
* }
|
|
* ```
|
|
*/
|
|
|
|
function TreeSelect(props) {
|
|
const {
|
|
label,
|
|
noOptionLabel,
|
|
onChange,
|
|
selectedId,
|
|
tree = [],
|
|
...restProps
|
|
} = (0, _useDeprecatedProps.useDeprecated36pxDefaultSizeProp)(props, 'wp.components.TreeSelect', '6.4');
|
|
const options = (0, _element.useMemo)(() => {
|
|
return [noOptionLabel && {
|
|
value: '',
|
|
label: noOptionLabel
|
|
}, ...getSelectOptions(tree)].filter(option => !!option);
|
|
}, [noOptionLabel, tree]);
|
|
return (0, _react.createElement)(_selectControl.SelectControl, {
|
|
label,
|
|
options,
|
|
onChange,
|
|
value: selectedId,
|
|
...restProps
|
|
});
|
|
}
|
|
var _default = TreeSelect;
|
|
exports.default = _default;
|
|
//# sourceMappingURL=index.js.map
|