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,14 @@
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
/**
* WordPress dependencies
*/
import { createContext } from '@wordpress/element';
export const RadioGroupContext = createContext({
store: undefined,
disabled: undefined
});
//# sourceMappingURL=context.js.map

View File

@@ -0,0 +1 @@
{"version":3,"names":["createContext","RadioGroupContext","store","undefined","disabled"],"sources":["@wordpress/components/src/radio-group/context.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport type * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { createContext } from '@wordpress/element';\n\nexport const RadioGroupContext = createContext< {\n\tstore?: Ariakit.RadioStore;\n\tdisabled?: boolean;\n} >( {\n\tstore: undefined,\n\tdisabled: undefined,\n} );\n"],"mappings":"AAAA;AACA;AACA;AACA;;AAGA;AACA;AACA;AACA,SAASA,aAAa,QAAQ,oBAAoB;AAElD,OAAO,MAAMC,iBAAiB,GAAGD,aAAa,CAGzC;EACJE,KAAK,EAAEC,SAAS;EAChBC,QAAQ,EAAED;AACX,CAAE,CAAC"}

View File

@@ -0,0 +1,54 @@
import { createElement } from "react";
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
import * as Ariakit from '@ariakit/react';
/**
* WordPress dependencies
*/
import { useMemo, forwardRef } from '@wordpress/element';
/**
* Internal dependencies
*/
import ButtonGroup from '../button-group';
import { RadioGroupContext } from './context';
function UnforwardedRadioGroup({
label,
checked,
defaultChecked,
disabled,
onChange,
children,
...props
}, ref) {
const radioStore = Ariakit.useRadioStore({
value: checked,
defaultValue: defaultChecked,
setValue: newValue => {
onChange?.(newValue !== null && newValue !== void 0 ? newValue : undefined);
}
});
const contextValue = useMemo(() => ({
store: radioStore,
disabled
}), [radioStore, disabled]);
return createElement(RadioGroupContext.Provider, {
value: contextValue
}, createElement(Ariakit.RadioGroup, {
store: radioStore,
render: createElement(ButtonGroup, null, children),
"aria-label": label,
ref: ref,
...props
}));
}
/**
* @deprecated Use `RadioControl` or `ToggleGroupControl` instead.
*/
export const RadioGroup = forwardRef(UnforwardedRadioGroup);
export default RadioGroup;
//# sourceMappingURL=index.js.map

View File

@@ -0,0 +1 @@
{"version":3,"names":["Ariakit","useMemo","forwardRef","ButtonGroup","RadioGroupContext","UnforwardedRadioGroup","label","checked","defaultChecked","disabled","onChange","children","props","ref","radioStore","useRadioStore","value","defaultValue","setValue","newValue","undefined","contextValue","store","createElement","Provider","RadioGroup","render"],"sources":["@wordpress/components/src/radio-group/index.tsx"],"sourcesContent":["/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * WordPress dependencies\n */\nimport { useMemo, forwardRef } from '@wordpress/element';\n\n/**\n * Internal dependencies\n */\nimport ButtonGroup from '../button-group';\nimport type { WordPressComponentProps } from '../context';\nimport { RadioGroupContext } from './context';\nimport type { RadioGroupProps } from './types';\n\nfunction UnforwardedRadioGroup(\n\t{\n\t\tlabel,\n\t\tchecked,\n\t\tdefaultChecked,\n\t\tdisabled,\n\t\tonChange,\n\t\tchildren,\n\t\t...props\n\t}: WordPressComponentProps< RadioGroupProps, 'div', false >,\n\tref: React.ForwardedRef< any >\n) {\n\tconst radioStore = Ariakit.useRadioStore( {\n\t\tvalue: checked,\n\t\tdefaultValue: defaultChecked,\n\t\tsetValue: ( newValue ) => {\n\t\t\tonChange?.( newValue ?? undefined );\n\t\t},\n\t} );\n\n\tconst contextValue = useMemo(\n\t\t() => ( {\n\t\t\tstore: radioStore,\n\t\t\tdisabled,\n\t\t} ),\n\t\t[ radioStore, disabled ]\n\t);\n\n\treturn (\n\t\t<RadioGroupContext.Provider value={ contextValue }>\n\t\t\t<Ariakit.RadioGroup\n\t\t\t\tstore={ radioStore }\n\t\t\t\trender={ <ButtonGroup>{ children }</ButtonGroup> }\n\t\t\t\taria-label={ label }\n\t\t\t\tref={ ref }\n\t\t\t\t{ ...props }\n\t\t\t/>\n\t\t</RadioGroupContext.Provider>\n\t);\n}\n\n/**\n * @deprecated Use `RadioControl` or `ToggleGroupControl` instead.\n */\nexport const RadioGroup = forwardRef( UnforwardedRadioGroup );\nexport default RadioGroup;\n"],"mappings":";AAAA;AACA;AACA;AACA;AACA,OAAO,KAAKA,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,SAASC,OAAO,EAAEC,UAAU,QAAQ,oBAAoB;;AAExD;AACA;AACA;AACA,OAAOC,WAAW,MAAM,iBAAiB;AAEzC,SAASC,iBAAiB,QAAQ,WAAW;AAG7C,SAASC,qBAAqBA,CAC7B;EACCC,KAAK;EACLC,OAAO;EACPC,cAAc;EACdC,QAAQ;EACRC,QAAQ;EACRC,QAAQ;EACR,GAAGC;AACsD,CAAC,EAC3DC,GAA8B,EAC7B;EACD,MAAMC,UAAU,GAAGd,OAAO,CAACe,aAAa,CAAE;IACzCC,KAAK,EAAET,OAAO;IACdU,YAAY,EAAET,cAAc;IAC5BU,QAAQ,EAAIC,QAAQ,IAAM;MACzBT,QAAQ,GAAIS,QAAQ,aAARA,QAAQ,cAARA,QAAQ,GAAIC,SAAU,CAAC;IACpC;EACD,CAAE,CAAC;EAEH,MAAMC,YAAY,GAAGpB,OAAO,CAC3B,OAAQ;IACPqB,KAAK,EAAER,UAAU;IACjBL;EACD,CAAC,CAAE,EACH,CAAEK,UAAU,EAAEL,QAAQ,CACvB,CAAC;EAED,OACCc,aAAA,CAACnB,iBAAiB,CAACoB,QAAQ;IAACR,KAAK,EAAGK;EAAc,GACjDE,aAAA,CAACvB,OAAO,CAACyB,UAAU;IAClBH,KAAK,EAAGR,UAAY;IACpBY,MAAM,EAAGH,aAAA,CAACpB,WAAW,QAAGQ,QAAuB,CAAG;IAClD,cAAaL,KAAO;IACpBO,GAAG,EAAGA,GAAK;IAAA,GACND;EAAK,CACV,CAC0B,CAAC;AAE/B;;AAEA;AACA;AACA;AACA,OAAO,MAAMa,UAAU,GAAGvB,UAAU,CAAEG,qBAAsB,CAAC;AAC7D,eAAeoB,UAAU"}

View File

@@ -0,0 +1,46 @@
import { createElement } from "react";
/**
* WordPress dependencies
*/
import { forwardRef, useContext } from '@wordpress/element';
/**
* External dependencies
*/
// eslint-disable-next-line no-restricted-imports
import * as Ariakit from '@ariakit/react';
/**
* Internal dependencies
*/
import Button from '../button';
import { RadioGroupContext } from './context';
function UnforwardedRadio({
value,
children,
...props
}, ref) {
const {
store,
disabled
} = useContext(RadioGroupContext);
const selectedValue = store?.useState('value');
const isChecked = selectedValue !== undefined && selectedValue === value;
return createElement(Ariakit.Radio, {
disabled: disabled,
store: store,
ref: ref,
value: value,
render: createElement(Button, {
variant: isChecked ? 'primary' : 'secondary',
...props
})
}, children || value);
}
/**
* @deprecated Use `RadioControl` or `ToggleGroupControl` instead.
*/
export const Radio = forwardRef(UnforwardedRadio);
export default Radio;
//# sourceMappingURL=radio.js.map

View File

@@ -0,0 +1 @@
{"version":3,"names":["forwardRef","useContext","Ariakit","Button","RadioGroupContext","UnforwardedRadio","value","children","props","ref","store","disabled","selectedValue","useState","isChecked","undefined","createElement","Radio","render","variant"],"sources":["@wordpress/components/src/radio-group/radio.tsx"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { forwardRef, useContext } from '@wordpress/element';\n\n/**\n * External dependencies\n */\n// eslint-disable-next-line no-restricted-imports\nimport * as Ariakit from '@ariakit/react';\n\n/**\n * Internal dependencies\n */\nimport Button from '../button';\nimport { RadioGroupContext } from './context';\nimport type { WordPressComponentProps } from '../context';\nimport type { RadioProps } from './types';\n\nfunction UnforwardedRadio(\n\t{\n\t\tvalue,\n\t\tchildren,\n\t\t...props\n\t}: WordPressComponentProps< RadioProps, 'button', false >,\n\tref: React.ForwardedRef< any >\n) {\n\tconst { store, disabled } = useContext( RadioGroupContext );\n\n\tconst selectedValue = store?.useState( 'value' );\n\tconst isChecked = selectedValue !== undefined && selectedValue === value;\n\n\treturn (\n\t\t<Ariakit.Radio\n\t\t\tdisabled={ disabled }\n\t\t\tstore={ store }\n\t\t\tref={ ref }\n\t\t\tvalue={ value }\n\t\t\trender={\n\t\t\t\t<Button\n\t\t\t\t\tvariant={ isChecked ? 'primary' : 'secondary' }\n\t\t\t\t\t{ ...props }\n\t\t\t\t/>\n\t\t\t}\n\t\t>\n\t\t\t{ children || value }\n\t\t</Ariakit.Radio>\n\t);\n}\n\n/**\n * @deprecated Use `RadioControl` or `ToggleGroupControl` instead.\n */\nexport const Radio = forwardRef( UnforwardedRadio );\nexport default Radio;\n"],"mappings":";AAAA;AACA;AACA;AACA,SAASA,UAAU,EAAEC,UAAU,QAAQ,oBAAoB;;AAE3D;AACA;AACA;AACA;AACA,OAAO,KAAKC,OAAO,MAAM,gBAAgB;;AAEzC;AACA;AACA;AACA,OAAOC,MAAM,MAAM,WAAW;AAC9B,SAASC,iBAAiB,QAAQ,WAAW;AAI7C,SAASC,gBAAgBA,CACxB;EACCC,KAAK;EACLC,QAAQ;EACR,GAAGC;AACoD,CAAC,EACzDC,GAA8B,EAC7B;EACD,MAAM;IAAEC,KAAK;IAAEC;EAAS,CAAC,GAAGV,UAAU,CAAEG,iBAAkB,CAAC;EAE3D,MAAMQ,aAAa,GAAGF,KAAK,EAAEG,QAAQ,CAAE,OAAQ,CAAC;EAChD,MAAMC,SAAS,GAAGF,aAAa,KAAKG,SAAS,IAAIH,aAAa,KAAKN,KAAK;EAExE,OACCU,aAAA,CAACd,OAAO,CAACe,KAAK;IACbN,QAAQ,EAAGA,QAAU;IACrBD,KAAK,EAAGA,KAAO;IACfD,GAAG,EAAGA,GAAK;IACXH,KAAK,EAAGA,KAAO;IACfY,MAAM,EACLF,aAAA,CAACb,MAAM;MACNgB,OAAO,EAAGL,SAAS,GAAG,SAAS,GAAG,WAAa;MAAA,GAC1CN;IAAK,CACV;EACD,GAECD,QAAQ,IAAID,KACA,CAAC;AAElB;;AAEA;AACA;AACA;AACA,OAAO,MAAMW,KAAK,GAAGjB,UAAU,CAAEK,gBAAiB,CAAC;AACnD,eAAeY,KAAK"}

View File

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

View File

@@ -0,0 +1 @@
{"version":3,"names":[],"sources":["@wordpress/components/src/radio-group/types.ts"],"sourcesContent":["export type RadioGroupProps = {\n\t/**\n\t * Accessible label for the radio group\n\t */\n\tlabel: string;\n\t/**\n\t * The `value` of the `Radio` element which should be selected.\n\t * Indicates controlled usage of the component.\n\t */\n\tchecked?: string | number;\n\t/**\n\t * The value of the radio element which is initially selected.\n\t */\n\tdefaultChecked?: string | number;\n\t/**\n\t * Whether the `RadioGroup` should be disabled.\n\t */\n\tdisabled?: boolean;\n\t/**\n\t * Called when a `Radio` element has been selected.\n\t * Receives the `value` of the selected element as an argument.\n\t */\n\tonChange?: ( value: string | number | undefined ) => void;\n\t/**\n\t * The children elements, which should be a series of `Radio` components.\n\t */\n\tchildren: React.ReactNode;\n};\n\nexport type RadioProps = {\n\t/**\n\t * The actual value of the radio element.\n\t */\n\tvalue: string | number;\n\t/**\n\t * Content displayed on the Radio element. If there aren't any children, `value` is displayed.\n\t */\n\tchildren?: React.ReactNode;\n};\n"],"mappings":""}