import React from 'react';
import { observer } from 'mobx-react-lite';
import { usePageContext } from '@wix/bex-core/react';
import { DeleteFieldModal } from '../ArchivedItemsPanel/DeleteFieldModal';
const _CustomFieldsWidgetCommonComponents = ({ state, }) => {
    const page = usePageContext();
    const { modalsContainerRef, stackingRootRef } = page;
    if (state.isLoading) {
        return null;
    }
    const WixPatternsModalsContainer = state.WixPatternsModalsContainer;
    const CustomFieldModal = state.CustomFieldModal;
    const ArchiveFieldModal = state.ArchiveFieldModal;
    return (React.createElement(React.Fragment, null,
        WixPatternsModalsContainer && (React.createElement(WixPatternsModalsContainer, { rootRef: stackingRootRef, anchorRef: modalsContainerRef, state: state.panels })),
        CustomFieldModal && (React.createElement(CustomFieldModal, { state: state.customFieldsPanel.customFieldModal })),
        ArchiveFieldModal && (React.createElement(ArchiveFieldModal, { state: state.customFieldsPanel.archiveFieldModal })),
        state.dataExtension.deleteFieldModal && (React.createElement(DeleteFieldModal, { state: state.dataExtension.deleteFieldModal }))));
};
export const CustomFieldsWidgetCommonComponents = observer(_CustomFieldsWidgetCommonComponents);
//# sourceMappingURL=CustomFieldsWidgetCommonComponents.js.map