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,159 @@
"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = void 0;
exports.getColorLocations = getColorLocations;
exports.getGradientAngle = getGradientAngle;
exports.getGradientBaseColors = getGradientBaseColors;
exports.getGradientColorGroup = getGradientColorGroup;
var _react = require("react");
var _reactNative = require("react-native");
var _reactNativeLinearGradient = _interopRequireDefault(require("react-native-linear-gradient"));
var _gradientParser = _interopRequireDefault(require("gradient-parser"));
var _components = require("@wordpress/components");
var _primitives = require("@wordpress/primitives");
var _compose = require("@wordpress/compose");
var _element = require("@wordpress/element");
var _style = _interopRequireDefault(require("./style.scss"));
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function getGradientAngle(gradientValue) {
const angleBase = 45;
const matchAngle = /\(((\d+deg)|(to\s[^,]+))/;
const angle = matchAngle.exec(gradientValue) ? matchAngle.exec(gradientValue)[1] : '180deg';
const angleType = angle.includes('deg') ? 'angle' : 'sideOrCorner';
if (angleType === 'sideOrCorner') {
switch (angle) {
case 'to top':
return 0;
case 'to top right':
case 'to right top':
return angleBase;
case 'to right':
return 2 * angleBase;
case 'to bottom right':
case 'to right bottom':
return 3 * angleBase;
case 'to bottom':
return 4 * angleBase;
case 'to bottom left':
case 'to left bottom':
return 5 * angleBase;
case 'to left':
return 6 * angleBase;
case 'to top left':
case 'to left top':
return 7 * angleBase;
}
} else if (angleType === 'angle') {
return parseFloat(angle);
} else return 4 * angleBase;
}
function getGradientColorGroup(gradientValue) {
const colorNeedParenthesis = ['rgb', 'rgba'];
const excludeSideOrCorner = /linear-gradient\(to\s+([a-z\s]+,)/;
// Parser has some difficulties with angle defined as a side or corner (e.g. `to left`)
// so it's going to be excluded in order to matching color groups.
const modifiedGradientValue = gradientValue.replace(excludeSideOrCorner, 'linear-gradient(');
return [].concat(..._gradientParser.default.parse(modifiedGradientValue)?.map(gradient => gradient.colorStops?.map((color, index) => {
const {
type,
value,
length
} = color;
const fallbackLength = `${100 * (index / (gradient.colorStops.length - 1))}%`;
const colorLength = length ? `${length.value}${length.type}` : fallbackLength;
if (colorNeedParenthesis.includes(type)) {
return [`${type}(${value.join(',')})`, colorLength];
} else if (type === 'literal') {
return [value, colorLength];
}
return [`#${value}`, colorLength];
})));
}
function getGradientBaseColors(colorGroup) {
return colorGroup.map(color => color[0]);
}
function getColorLocations(colorGroup) {
return colorGroup.map(location => Number(location[1].replace('%', '')) / 100);
}
function Gradient({
gradientValue,
style,
angleCenter = {
x: 0.5,
y: 0.5
},
children,
...otherProps
}) {
const [resizeObserver, sizes] = (0, _compose.useResizeObserver)();
const {
width = 0,
height = 0
} = sizes || {};
const {
isGradient,
getGradientType,
gradients
} = _components.colorsUtils;
const colorGroup = (0, _element.useMemo)(() => getGradientColorGroup(gradientValue), [gradientValue]);
const locations = (0, _element.useMemo)(() => getColorLocations(colorGroup), [colorGroup]);
const colors = (0, _element.useMemo)(() => getGradientBaseColors(colorGroup), [colorGroup]);
if (!gradientValue || !isGradient(gradientValue)) {
return null;
}
const isLinearGradient = getGradientType(gradientValue) === gradients.linear;
if (isLinearGradient) {
return (0, _react.createElement)(_reactNativeLinearGradient.default, {
colors: colors,
useAngle: true,
angle: getGradientAngle(gradientValue),
locations: locations,
angleCenter: angleCenter,
style: style,
...otherProps
}, children);
}
return (0, _react.createElement)(_reactNative.View, {
style: [style, _style.default.overflow]
}, (0, _react.createElement)(_reactNative.View, {
style: _style.default.radialGradientContent
}, children), resizeObserver, (0, _react.createElement)(_primitives.SVG, null, (0, _react.createElement)(_primitives.Defs, null, (0, _react.createElement)(_primitives.RadialGradient
// eslint-disable-next-line no-restricted-syntax
, {
id: "radialGradient",
gradientUnits: "userSpaceOnUse",
rx: "70%",
ry: "70%",
cy: _reactNative.Platform.OS === 'android' ? width / 2 : '50%'
}, colorGroup.map(group => {
return (0, _react.createElement)(_primitives.Stop, {
offset: group[1],
stopColor: group[0],
stopOpacity: "1",
key: `${group[1]}-${group[0]}`
});
}))), (0, _react.createElement)(_primitives.Rect, {
height: height,
width: width,
fill: "url(#radialGradient)"
})));
}
var _default = Gradient;
exports.default = _default;
//# sourceMappingURL=index.native.js.map

File diff suppressed because one or more lines are too long