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>

node_modules/@wordpress/components/build-module/search-control/index.js

@@ -0,0 +1,113 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import classnames from 'classnames';
+
+/**
+ * WordPress dependencies
+ */
+import { useInstanceId, useMergeRefs } from '@wordpress/compose';
+import { __ } from '@wordpress/i18n';
+import { Icon, search, closeSmall } from '@wordpress/icons';
+import { forwardRef, useRef } from '@wordpress/element';
+
+/**
+ * Internal dependencies
+ */
+import Button from '../button';
+import BaseControl from '../base-control';
+function UnforwardedSearchControl({
+  __nextHasNoMarginBottom,
+  __next40pxDefaultSize = false,
+  className,
+  onChange,
+  onKeyDown,
+  value,
+  label,
+  placeholder = __('Search'),
+  hideLabelFromVision = true,
+  help,
+  onClose,
+  size = 'default',
+  ...restProps
+}, forwardedRef) {
+  const searchRef = useRef();
+  const instanceId = useInstanceId(SearchControl);
+  const id = `components-search-control-${instanceId}`;
+  const renderRightButton = () => {
+    if (onClose) {
+      return createElement(Button, {
+        __next40pxDefaultSize: __next40pxDefaultSize,
+        icon: closeSmall,
+        label: __('Close search'),
+        onClick: onClose,
+        size: size
+      });
+    }
+    if (!!value) {
+      return createElement(Button, {
+        __next40pxDefaultSize: __next40pxDefaultSize,
+        icon: closeSmall,
+        label: __('Reset search'),
+        onClick: () => {
+          onChange('');
+          searchRef.current?.focus();
+        },
+        size: size
+      });
+    }
+    return createElement(Icon, {
+      icon: search
+    });
+  };
+  return createElement(BaseControl, {
+    __nextHasNoMarginBottom: __nextHasNoMarginBottom,
+    label: label,
+    id: id,
+    hideLabelFromVision: hideLabelFromVision,
+    help: help,
+    className: classnames(className, 'components-search-control', {
+      'is-next-40px-default-size': __next40pxDefaultSize,
+      'is-size-compact': size === 'compact'
+    })
+  }, createElement("div", {
+    className: "components-search-control__input-wrapper"
+  }, createElement("input", {
+    ...restProps,
+    ref: 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 || ''
+  }), 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 }
+ *     />
+ *   );
+ * }
+ * ```
+ */
+export const SearchControl = forwardRef(UnforwardedSearchControl);
+export default SearchControl;
+//# sourceMappingURL=index.js.map

node_modules/@wordpress/components/build-module/search-control/index.native.js

@@ -0,0 +1,198 @@
+import { createElement } from "react";
+/**
+ * External dependencies
+ */
+import { TextInput, Text, View, TouchableOpacity, Platform, useColorScheme, Keyboard } from 'react-native';
+
+/**
+ * WordPress dependencies
+ */
+import { useState, useRef, useMemo, useEffect, useCallback } from '@wordpress/element';
+import { __ } from '@wordpress/i18n';
+import { Button, Gridicons } from '@wordpress/components';
+import { Icon, cancelCircleFilled as cancelCircleFilledIcon, arrowLeft as arrowLeftIcon, close as closeIcon } from '@wordpress/icons';
+
+/**
+ * Internal dependencies
+ */
+import allStyles from './style.scss';
+import platformStyles from './platform-style.scss';
+
+// Merge platform specific styles with the default styles.
+const baseStyles = {
+  ...allStyles
+};
+for (const selector in platformStyles) {
+  baseStyles[selector] = {
+    ...baseStyles[selector],
+    ...platformStyles[selector]
+  };
+}
+function selectModifiedStyles(styles, modifier) {
+  const modifierMatcher = new RegExp(`--${modifier}$`);
+  const modifierSelectors = Object.keys(styles).filter(selector => selector.match(modifierMatcher));
+  return modifierSelectors.reduce((modifiedStyles, modifierSelector) => {
+    const blockElementSelector = modifierSelector.split('--')[0];
+    modifiedStyles[blockElementSelector] = styles[modifierSelector];
+    return modifiedStyles;
+  }, {});
+}
+function mergeStyles(styles, updateStyles, selectors) {
+  selectors.forEach(selector => {
+    styles[selector] = {
+      ...styles[selector],
+      ...updateStyles[selector]
+    };
+  });
+  return styles;
+}
+function SearchControl({
+  value,
+  onChange,
+  placeholder = __('Search blocks')
+}) {
+  const [isActive, setIsActive] = useState(false);
+  const [currentStyles, setCurrentStyles] = useState(baseStyles);
+  const isDark = useColorScheme() === 'dark';
+  const inputRef = useRef();
+  const onCancelTimer = useRef();
+  const isIOS = Platform.OS === 'ios';
+  const darkStyles = useMemo(() => {
+    return selectModifiedStyles(baseStyles, 'dark');
+  }, []);
+  const activeStyles = useMemo(() => {
+    return selectModifiedStyles(baseStyles, 'active');
+  }, []);
+  const activeDarkStyles = useMemo(() => {
+    return selectModifiedStyles(baseStyles, 'active-dark');
+  }, []);
+  useEffect(() => {
+    let futureStyles = {
+      ...baseStyles
+    };
+    function mergeFutureStyles(modifiedStyles, shouldUseConditions) {
+      const shouldUseModified = shouldUseConditions.every(should => should);
+      const updatedStyles = shouldUseModified ? modifiedStyles : futureStyles;
+      const selectors = Object.keys(modifiedStyles);
+      futureStyles = mergeStyles(futureStyles, updatedStyles, selectors);
+    }
+    mergeFutureStyles(activeStyles, [isActive]);
+    mergeFutureStyles(darkStyles, [isDark]);
+    mergeFutureStyles(activeDarkStyles, [isActive, isDark]);
+    setCurrentStyles(futureStyles);
+    // Disable reason: deferring this refactor to the native team.
+    // see https://github.com/WordPress/gutenberg/pull/41166
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+  }, [isActive, isDark]);
+  const clearInput = useCallback(() => {
+    onChange('');
+  }, [onChange]);
+  const onPress = useCallback(() => {
+    setIsActive(true);
+    inputRef.current?.focus();
+  }, []);
+  const onFocus = useCallback(() => {
+    setIsActive(true);
+  }, []);
+  const onCancel = useCallback(() => {
+    clearTimeout(onCancelTimer.current);
+    onCancelTimer.current = setTimeout(() => {
+      inputRef.current?.blur();
+      clearInput();
+      setIsActive(false);
+    }, 0);
+  }, [clearInput]);
+  const onKeyboardDidHide = useCallback(() => {
+    if (!isIOS) {
+      onCancel();
+    }
+  }, [isIOS, onCancel]);
+  useEffect(() => {
+    const keyboardHideSubscription = Keyboard.addListener('keyboardDidHide', onKeyboardDidHide);
+    return () => {
+      clearTimeout(onCancelTimer.current);
+      keyboardHideSubscription.remove();
+    };
+  }, [onKeyboardDidHide]);
+  const {
+    'search-control__container': containerStyle,
+    'search-control__inner-container': innerContainerStyle,
+    'search-control__input-container': inputContainerStyle,
+    'search-control__form-input': formInputStyle,
+    'search-control__form-input-placeholder': placeholderStyle,
+    'search-control__input-button': inputButtonStyle,
+    'search-control__input-button-left': inputButtonLeftStyle,
+    'search-control__input-button-right': inputButtonRightStyle,
+    'search-control__cancel-button': cancelButtonStyle,
+    'search-control__cancel-button-text': cancelButtonTextStyle,
+    'search-control__icon': iconStyle,
+    'search-control__right-icon': rightIconStyle
+  } = currentStyles;
+  function renderLeftButton() {
+    const button = !isIOS && isActive ? createElement(Button, {
+      label: __('Cancel search'),
+      icon: arrowLeftIcon,
+      onClick: onCancel,
+      style: iconStyle
+    }) : createElement(Icon, {
+      icon: Gridicons.search,
+      fill: iconStyle?.color
+    });
+    return createElement(View, {
+      style: [inputButtonStyle, inputButtonLeftStyle]
+    }, button);
+  }
+  function renderRightButton() {
+    let button;
+
+    // Add a View element to properly center the input placeholder via flexbox.
+    if (isIOS && !isActive) {
+      button = createElement(View, null);
+    }
+    if (!!value) {
+      button = createElement(Button, {
+        label: __('Clear search'),
+        icon: isIOS ? cancelCircleFilledIcon : closeIcon,
+        onClick: clearInput,
+        style: [iconStyle, rightIconStyle]
+      });
+    }
+    return createElement(View, {
+      style: [inputButtonStyle, inputButtonRightStyle]
+    }, button);
+  }
+  function renderCancel() {
+    if (!isIOS) {
+      return null;
+    }
+    return createElement(View, {
+      style: cancelButtonStyle
+    }, createElement(Text, {
+      onPress: onCancel,
+      style: cancelButtonTextStyle,
+      accessible: true,
+      accessibilityRole: 'button',
+      accessibilityLabel: __('Cancel search'),
+      accessibilityHint: __('Cancel search')
+    }, __('Cancel')));
+  }
+  return createElement(TouchableOpacity, {
+    style: containerStyle,
+    onPress: onPress,
+    activeOpacity: 1
+  }, createElement(View, {
+    style: innerContainerStyle
+  }, createElement(View, {
+    style: inputContainerStyle
+  }, renderLeftButton(), createElement(TextInput, {
+    ref: inputRef,
+    style: formInputStyle,
+    placeholderTextColor: placeholderStyle?.color,
+    onChangeText: onChange,
+    onFocus: onFocus,
+    value: value,
+    placeholder: placeholder
+  }), renderRightButton()), isActive && renderCancel()));
+}
+export default SearchControl;
+//# sourceMappingURL=index.native.js.map

node_modules/@wordpress/components/build-module/search-control/types.js

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.js.map

node_modules/@wordpress/components/build-module/search-control/types.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["@wordpress/components/src/search-control/types.ts"],"sourcesContent":["/**\n * External dependencies\n */\nimport type { HTMLAttributes } from 'react';\n\n/**\n * Internal dependencies\n */\nimport type { BaseControlProps } from '../base-control/types';\n\nexport type SearchControlProps = Pick<\n\tBaseControlProps,\n\t'__nextHasNoMarginBottom' | 'help' | 'label'\n> & {\n\t/**\n\t * If true, the label will only be visible to screen readers.\n\t *\n\t * @default true\n\t */\n\thideLabelFromVision?: boolean;\n\t/**\n\t * A function that receives the value of the input when the value is changed.\n\t */\n\tonChange: ( value: string ) => void;\n\t/**\n\t * When an `onClose` callback is provided, the search control will render a close button\n\t * that will trigger the given callback.\n\t *\n\t * Use this if you want the button to trigger your own logic to close the search field entirely,\n\t * rather than just clearing the input value.\n\t */\n\tonClose?: () => void;\n\t/**\n\t * A placeholder for the input.\n\t *\n\t * @default 'Search'\n\t */\n\tplaceholder?: HTMLAttributes< HTMLInputElement >[ 'placeholder' ];\n\t/**\n\t * The current value of the input.\n\t */\n\tvalue?: string;\n\t/**\n\t * The size of the component\n\t *\n\t * @default 'default'\n\t */\n\tsize?: 'default' | 'compact';\n\t/**\n\t * Start opting into the larger default height that will become the default size in a future version.\n\t *\n\t * @default false\n\t */\n\t__next40pxDefaultSize?: boolean;\n};\n"],"mappings":""}