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

123 lines
3.5 KiB
JavaScript

"use strict";
var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
Object.defineProperty(exports, "__esModule", {
value: true
});
exports.default = exports.SearchControl = void 0;
var _react = require("react");
var _classnames = _interopRequireDefault(require("classnames"));
var _compose = require("@wordpress/compose");
var _i18n = require("@wordpress/i18n");
var _icons = require("@wordpress/icons");
var _element = require("@wordpress/element");
var _button = _interopRequireDefault(require("../button"));
var _baseControl = _interopRequireDefault(require("../base-control"));
/**
* External dependencies
*/
/**
* WordPress dependencies
*/
/**
* Internal dependencies
*/
function UnforwardedSearchControl({
__nextHasNoMarginBottom,
__next40pxDefaultSize = false,
className,
onChange,
onKeyDown,
value,
label,
placeholder = (0, _i18n.__)('Search'),
hideLabelFromVision = true,
help,
onClose,
size = 'default',
...restProps
}, forwardedRef) {
const searchRef = (0, _element.useRef)();
const instanceId = (0, _compose.useInstanceId)(SearchControl);
const id = `components-search-control-${instanceId}`;
const renderRightButton = () => {
if (onClose) {
return (0, _react.createElement)(_button.default, {
__next40pxDefaultSize: __next40pxDefaultSize,
icon: _icons.closeSmall,
label: (0, _i18n.__)('Close search'),
onClick: onClose,
size: size
});
}
if (!!value) {
return (0, _react.createElement)(_button.default, {
__next40pxDefaultSize: __next40pxDefaultSize,
icon: _icons.closeSmall,
label: (0, _i18n.__)('Reset search'),
onClick: () => {
onChange('');
searchRef.current?.focus();
},
size: size
});
}
return (0, _react.createElement)(_icons.Icon, {
icon: _icons.search
});
};
return (0, _react.createElement)(_baseControl.default, {
__nextHasNoMarginBottom: __nextHasNoMarginBottom,
label: label,
id: id,
hideLabelFromVision: hideLabelFromVision,
help: help,
className: (0, _classnames.default)(className, 'components-search-control', {
'is-next-40px-default-size': __next40pxDefaultSize,
'is-size-compact': size === 'compact'
})
}, (0, _react.createElement)("div", {
className: "components-search-control__input-wrapper"
}, (0, _react.createElement)("input", {
...restProps,
ref: (0, _compose.useMergeRefs)([searchRef, forwardedRef]),
className: "components-search-control__input",
id: id,
type: "search",
placeholder: placeholder,
onChange: event => onChange(event.target.value),
onKeyDown: onKeyDown,
autoComplete: "off",
value: value || ''
}), (0, _react.createElement)("div", {
className: "components-search-control__icon"
}, renderRightButton())));
}
/**
* SearchControl components let users display a search control.
*
* ```jsx
* import { SearchControl } from '@wordpress/components';
* import { useState } from '@wordpress/element';
*
* function MySearchControl( { className, setState } ) {
* const [ searchInput, setSearchInput ] = useState( '' );
*
* return (
* <SearchControl
* value={ searchInput }
* onChange={ setSearchInput }
* />
* );
* }
* ```
*/
const SearchControl = (0, _element.forwardRef)(UnforwardedSearchControl);
exports.SearchControl = SearchControl;
var _default = SearchControl;
exports.default = _default;
//# sourceMappingURL=index.js.map