Files
formipay/node_modules/@wordpress/components/build-module/tree-select/index.js
dwindown e8fbfb14c1 fix: prevent asset conflicts between React and Grid.js versions
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>
2026-04-18 17:02:14 +07:00

92 lines
2.2 KiB
JavaScript

import { createElement } from "react";
/**
* WordPress dependencies
*/
import { useMemo } from '@wordpress/element';
import { decodeEntities } from '@wordpress/html-entities';
/**
* Internal dependencies
*/
import { SelectControl } from '../select-control';
import { useDeprecated36pxDefaultSizeProp } from '../utils/use-deprecated-props';
function getSelectOptions(tree, level = 0) {
return tree.flatMap(treeNode => [{
value: treeNode.id,
label: '\u00A0'.repeat(level * 3) + 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',
* },
* ],
* },
* ],
* },
* ] }
* />
* );
* }
* ```
*/
export function TreeSelect(props) {
const {
label,
noOptionLabel,
onChange,
selectedId,
tree = [],
...restProps
} = useDeprecated36pxDefaultSizeProp(props, 'wp.components.TreeSelect', '6.4');
const options = useMemo(() => {
return [noOptionLabel && {
value: '',
label: noOptionLabel
}, ...getSelectOptions(tree)].filter(option => !!option);
}, [noOptionLabel, tree]);
return createElement(SelectControl, {
label,
options,
onChange,
value: selectedId,
...restProps
});
}
export default TreeSelect;
//# sourceMappingURL=index.js.map