Files
formipay/node_modules/@wordpress/components/build/disabled/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

82 lines
2.1 KiB
JavaScript

"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require("react");
var _element = require("@wordpress/element");
var _disabledStyles = require("./styles/disabled-styles");
var _utils = require("../utils");
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
const Context = (0, _element.createContext)(false);
const {
Consumer,
Provider
} = Context;
/**
* `Disabled` is a component which disables descendant tabbable elements and
* prevents pointer interaction.
*
* _Note: this component may not behave as expected in browsers that don't
* support the `inert` HTML attribute. We recommend adding the official WICG
* polyfill when using this component in your project._
*
* @see https://developer.mozilla.org/en-US/docs/Web/API/HTMLElement/inert
*
* ```jsx
* import { Button, Disabled, TextControl } from '@wordpress/components';
* import { useState } from '@wordpress/element';
*
* const MyDisabled = () => {
* const [ isDisabled, setIsDisabled ] = useState( true );
*
* let input = <TextControl label="Input" onChange={ () => {} } />;
* if ( isDisabled ) {
* input = <Disabled>{ input }</Disabled>;
* }
*
* const toggleDisabled = () => {
* setIsDisabled( ( state ) => ! state );
* };
*
* return (
* <div>
* { input }
* <Button variant="primary" onClick={ toggleDisabled }>
* Toggle Disabled
* </Button>
* </div>
* );
* };
* ```
*/
function Disabled({
className,
children,
isDisabled = true,
...props
}) {
const cx = (0, _utils.useCx)();
return (0, _react.createElement)(Provider, {
value: isDisabled
}, (0, _react.createElement)("div", {
// @ts-ignore Reason: inert is a recent HTML attribute
inert: isDisabled ? 'true' : undefined,
className: isDisabled ? cx(_disabledStyles.disabledStyles, className, 'components-disabled') : undefined,
...props
}, children));
}
Disabled.Context = Context;
Disabled.Consumer = Consumer;
var _default = Disabled;
exports.default = _default;
//# sourceMappingURL=index.js.map