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>
This commit is contained in:
dwindown
2026-04-18 17:02:14 +07:00
parent bd9cdac02e
commit e8fbfb14c1
74973 changed files with 6658406 additions and 71 deletions

View File

@@ -0,0 +1,61 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
var _react = require("react");
var _classnames = _interopRequireDefault(require("classnames"));
var _element = require("@wordpress/element");
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* A wrapper component that maintains its aspect ratio when resized.
*
* ```jsx
* import { ResponsiveWrapper } from '@wordpress/components';
*
* const MyResponsiveWrapper = () => (
* <ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>
* <img
* src="https://s.w.org/style/images/about/WordPress-logotype-standard.png"
* alt="WordPress"
* />
* </ResponsiveWrapper>
* );
* ```
*/
function ResponsiveWrapper({
naturalWidth,
naturalHeight,
children,
isInline = false
}) {
if (_element.Children.count(children) !== 1) {
return null;
}
const TagName = isInline ? 'span' : 'div';
let aspectRatio;
if (naturalWidth && naturalHeight) {
aspectRatio = `${naturalWidth} / ${naturalHeight}`;
}
return (0, _react.createElement)(TagName, {
className: "components-responsive-wrapper"
}, (0, _react.createElement)("div", null, (0, _element.cloneElement)(children, {
className: (0, _classnames.default)('components-responsive-wrapper__content', children.props.className),
style: {
...children.props.style,
aspectRatio
}
})));
}
var _default = ResponsiveWrapper;
exports.default = _default;
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"names":["_classnames","_interopRequireDefault","require","_element","ResponsiveWrapper","naturalWidth","naturalHeight","children","isInline","Children","count","TagName","aspectRatio","_react","createElement","className","cloneElement","classnames","props","style","_default","exports","default"],"sources":["@wordpress/components/src/responsive-wrapper/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { cloneElement, Children } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport type { ResponsiveWrapperProps } from './types';\n\n/**\n * A wrapper component that maintains its aspect ratio when resized.\n *\n * ```jsx\n * import { ResponsiveWrapper } from '@wordpress/components';\n *\n * const MyResponsiveWrapper = () => (\n * \t<ResponsiveWrapper naturalWidth={ 2000 } naturalHeight={ 680 }>\n * \t\t<img\n * \t\t\tsrc=\"https://s.w.org/style/images/about/WordPress-logotype-standard.png\"\n * \t\t\talt=\"WordPress\"\n * \t\t/>\n * \t</ResponsiveWrapper>\n * );\n * ```\n */\nfunction ResponsiveWrapper( {\n\tnaturalWidth,\n\tnaturalHeight,\n\tchildren,\n\tisInline = false,\n}: ResponsiveWrapperProps ) {\n\tif ( Children.count( children ) !== 1 ) {\n\t\treturn null;\n\t}\n\n\tconst TagName = isInline ? 'span' : 'div';\n\tlet aspectRatio;\n\tif ( naturalWidth && naturalHeight ) {\n\t\taspectRatio = `${ naturalWidth } / ${ naturalHeight }`;\n\t}\n\n\treturn (\n\t\t<TagName className=\"components-responsive-wrapper\">\n\t\t\t<div>\n\t\t\t\t{ cloneElement( children, {\n\t\t\t\t\tclassName: classnames(\n\t\t\t\t\t\t'components-responsive-wrapper__content',\n\t\t\t\t\t\tchildren.props.className\n\t\t\t\t\t),\n\t\t\t\t\tstyle: {\n\t\t\t\t\t\t...children.props.style,\n\t\t\t\t\t\taspectRatio,\n\t\t\t\t\t},\n\t\t\t\t} ) }\n\t\t\t</div>\n\t\t</TagName>\n\t);\n}\n\nexport default ResponsiveWrapper;\n"],"mappings":";;;;;;;;AAGA,IAAAA,WAAA,GAAAC,sBAAA,CAAAC,OAAA;AAKA,IAAAC,QAAA,GAAAD,OAAA;AARA;AACA;AACA;;AAGA;AACA;AACA;;AAQA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,SAASE,iBAAiBA,CAAE;EAC3BC,YAAY;EACZC,aAAa;EACbC,QAAQ;EACRC,QAAQ,GAAG;AACY,CAAC,EAAG;EAC3B,IAAKC,iBAAQ,CAACC,KAAK,CAAEH,QAAS,CAAC,KAAK,CAAC,EAAG;IACvC,OAAO,IAAI;EACZ;EAEA,MAAMI,OAAO,GAAGH,QAAQ,GAAG,MAAM,GAAG,KAAK;EACzC,IAAII,WAAW;EACf,IAAKP,YAAY,IAAIC,aAAa,EAAG;IACpCM,WAAW,GAAI,GAAGP,YAAc,MAAMC,aAAe,EAAC;EACvD;EAEA,OACC,IAAAO,MAAA,CAAAC,aAAA,EAACH,OAAO;IAACI,SAAS,EAAC;EAA+B,GACjD,IAAAF,MAAA,CAAAC,aAAA,eACG,IAAAE,qBAAY,EAAET,QAAQ,EAAE;IACzBQ,SAAS,EAAE,IAAAE,mBAAU,EACpB,wCAAwC,EACxCV,QAAQ,CAACW,KAAK,CAACH,SAChB,CAAC;IACDI,KAAK,EAAE;MACN,GAAGZ,QAAQ,CAACW,KAAK,CAACC,KAAK;MACvBP;IACD;EACD,CAAE,CACE,CACG,CAAC;AAEZ;AAAC,IAAAQ,QAAA,GAEchB,iBAAiB;AAAAiB,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

View File

@@ -0,0 +1,6 @@
"use strict";
Object.defineProperty(exports, "__esModule", {
value: true
});
//# sourceMappingURL=types.js.map

View File

@@ -0,0 +1 @@
{"version":3,"names":[],"sources":["@wordpress/components/src/responsive-wrapper/types.ts"],"sourcesContent":["export type ResponsiveWrapperProps = {\n\t/**\n\t * The intrinsic width of the element to wrap. Will be used to determine the aspect ratio.\n\t */\n\tnaturalWidth?: number;\n\t/**\n\t * The intrinsic height of the element to wrap. Will be used to determine the aspect ratio.\n\t */\n\tnaturalHeight?: number;\n\t/**\n\t * The element to wrap.\n\t */\n\tchildren: React.ReactElement;\n\t/**\n\t * If true, the wrapper will be `span` instead of `div`.\n\t *\n\t * @default false\n\t */\n\tisInline?: boolean;\n};\n"],"mappings":""}