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>
107 lines
2.3 KiB
JavaScript
107 lines
2.3 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.default = RangeRail;
|
|
var _react = require("react");
|
|
var _i18n = require("@wordpress/i18n");
|
|
var _mark = _interopRequireDefault(require("./mark"));
|
|
var _rangeControlStyles = require("./styles/range-control-styles");
|
|
/**
|
|
* WordPress dependencies
|
|
*/
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
|
|
function RangeRail(props) {
|
|
const {
|
|
disabled = false,
|
|
marks = false,
|
|
min = 0,
|
|
max = 100,
|
|
step = 1,
|
|
value = 0,
|
|
...restProps
|
|
} = props;
|
|
return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_rangeControlStyles.Rail, {
|
|
disabled: disabled,
|
|
...restProps
|
|
}), marks && (0, _react.createElement)(Marks, {
|
|
disabled: disabled,
|
|
marks: marks,
|
|
min: min,
|
|
max: max,
|
|
step: step,
|
|
value: value
|
|
}));
|
|
}
|
|
function Marks(props) {
|
|
const {
|
|
disabled = false,
|
|
marks = false,
|
|
min = 0,
|
|
max = 100,
|
|
step: stepProp = 1,
|
|
value = 0
|
|
} = props;
|
|
const step = stepProp === 'any' ? 1 : stepProp;
|
|
const marksData = useMarks({
|
|
marks,
|
|
min,
|
|
max,
|
|
step,
|
|
value
|
|
});
|
|
return (0, _react.createElement)(_rangeControlStyles.MarksWrapper, {
|
|
"aria-hidden": "true",
|
|
className: "components-range-control__marks"
|
|
}, marksData.map(mark => (0, _react.createElement)(_mark.default, {
|
|
...mark,
|
|
key: mark.key,
|
|
"aria-hidden": "true",
|
|
disabled: disabled
|
|
})));
|
|
}
|
|
function useMarks({
|
|
marks,
|
|
min = 0,
|
|
max = 100,
|
|
step = 1,
|
|
value = 0
|
|
}) {
|
|
if (!marks) {
|
|
return [];
|
|
}
|
|
const range = max - min;
|
|
if (!Array.isArray(marks)) {
|
|
marks = [];
|
|
const count = 1 + Math.round(range / step);
|
|
while (count > marks.push({
|
|
value: step * marks.length + min
|
|
}));
|
|
}
|
|
const placedMarks = [];
|
|
marks.forEach((mark, index) => {
|
|
if (mark.value < min || mark.value > max) {
|
|
return;
|
|
}
|
|
const key = `mark-${index}`;
|
|
const isFilled = mark.value <= value;
|
|
const offset = `${(mark.value - min) / range * 100}%`;
|
|
const offsetStyle = {
|
|
[(0, _i18n.isRTL)() ? 'right' : 'left']: offset
|
|
};
|
|
placedMarks.push({
|
|
...mark,
|
|
isFilled,
|
|
key,
|
|
style: offsetStyle
|
|
});
|
|
});
|
|
return placedMarks;
|
|
}
|
|
//# sourceMappingURL=rail.js.map
|