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>
96 lines
2.5 KiB
JavaScript
96 lines
2.5 KiB
JavaScript
"use strict";
|
|
|
|
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
|
Object.defineProperty(exports, "__esModule", {
|
|
value: true
|
|
});
|
|
exports.NavigableMenu = void 0;
|
|
exports.UnforwardedNavigableMenu = UnforwardedNavigableMenu;
|
|
exports.default = void 0;
|
|
var _react = require("react");
|
|
var _element = require("@wordpress/element");
|
|
var _container = _interopRequireDefault(require("./container"));
|
|
/**
|
|
* External dependencies
|
|
*/
|
|
|
|
/**
|
|
* WordPress dependencies
|
|
*/
|
|
|
|
/**
|
|
* Internal dependencies
|
|
*/
|
|
|
|
function UnforwardedNavigableMenu({
|
|
role = 'menu',
|
|
orientation = 'vertical',
|
|
...rest
|
|
}, ref) {
|
|
const eventToOffset = evt => {
|
|
const {
|
|
code
|
|
} = evt;
|
|
let next = ['ArrowDown'];
|
|
let previous = ['ArrowUp'];
|
|
if (orientation === 'horizontal') {
|
|
next = ['ArrowRight'];
|
|
previous = ['ArrowLeft'];
|
|
}
|
|
if (orientation === 'both') {
|
|
next = ['ArrowRight', 'ArrowDown'];
|
|
previous = ['ArrowLeft', 'ArrowUp'];
|
|
}
|
|
if (next.includes(code)) {
|
|
return 1;
|
|
} else if (previous.includes(code)) {
|
|
return -1;
|
|
} else if (['ArrowDown', 'ArrowUp', 'ArrowLeft', 'ArrowRight'].includes(code)) {
|
|
// Key press should be handled, e.g. have event propagation and
|
|
// default behavior handled by NavigableContainer but not result
|
|
// in an offset.
|
|
return 0;
|
|
}
|
|
return undefined;
|
|
};
|
|
return (0, _react.createElement)(_container.default, {
|
|
ref: ref,
|
|
stopNavigationEvents: true,
|
|
onlyBrowserTabstops: false,
|
|
role: role,
|
|
"aria-orientation": role !== 'presentation' && (orientation === 'vertical' || orientation === 'horizontal') ? orientation : undefined,
|
|
eventToOffset: eventToOffset,
|
|
...rest
|
|
});
|
|
}
|
|
|
|
/**
|
|
* A container for a navigable menu.
|
|
*
|
|
* ```jsx
|
|
* import {
|
|
* NavigableMenu,
|
|
* Button,
|
|
* } from '@wordpress/components';
|
|
*
|
|
* function onNavigate( index, target ) {
|
|
* console.log( `Navigates to ${ index }`, target );
|
|
* }
|
|
*
|
|
* const MyNavigableContainer = () => (
|
|
* <div>
|
|
* <span>Navigable Menu:</span>
|
|
* <NavigableMenu onNavigate={ onNavigate } orientation="horizontal">
|
|
* <Button variant="secondary">Item 1</Button>
|
|
* <Button variant="secondary">Item 2</Button>
|
|
* <Button variant="secondary">Item 3</Button>
|
|
* </NavigableMenu>
|
|
* </div>
|
|
* );
|
|
* ```
|
|
*/
|
|
const NavigableMenu = (0, _element.forwardRef)(UnforwardedNavigableMenu);
|
|
exports.NavigableMenu = NavigableMenu;
|
|
var _default = NavigableMenu;
|
|
exports.default = _default;
|
|
//# sourceMappingURL=menu.js.map
|