import React from 'react';
import { Socket } from 'socket.io-client';
import { ShowAlert } from '../../@types/types';
import { ModifySettingsOptions } from '../../methods/settingsMethods/modifySettings';
/**
 * Parameters for event settings state management.
 *
 * @interface EventSettingsModalParameters
 *
 * **Display Settings:**
 * @property {string} meetingDisplayType - Current display type for meeting layout
 * @property {boolean} autoWave - Whether auto-wave feature is enabled
 * @property {boolean} forceFullDisplay - Whether to force full display mode
 * @property {boolean} meetingVideoOptimized - Whether video optimization is enabled
 *
 * **Session Context:**
 * @property {string} roomName - Name of the meeting room
 * @property {Socket} socket - Socket.io connection for real-time updates
 * @property {ShowAlert} [showAlert] - Optional alert display function
 */
export interface EventSettingsModalParameters {
    meetingDisplayType: string;
    autoWave: boolean;
    forceFullDisplay: boolean;
    meetingVideoOptimized: boolean;
    roomName: string;
    socket: Socket;
    showAlert?: ShowAlert;
}
/**
 * Configuration options for the EventSettingsModal component.
 *
 * @interface EventSettingsModalOptions
 *
 * **Modal Control:**
 * @property {boolean} isEventSettingsModalVisible - Whether the modal is currently visible
 * @property {function} onEventSettingsClose - Callback to close the modal
 * @property {function} updateIsSettingsModalVisible - Callback to update modal visibility state
 *
 * **Permission Settings (Current State):**
 * @property {string} audioSetting - Current audio permission ("allow" | "approval" | "disallow")
 * @property {string} videoSetting - Current video permission ("allow" | "approval" | "disallow")
 * @property {string} screenshareSetting - Current screenshare permission ("allow" | "approval" | "disallow")
 * @property {string} chatSetting - Current chat permission ("allow" | "disallow")
 *
 * **State Update Callbacks:**
 * @property {function} updateAudioSetting - Callback to update audio permission setting
 * @property {function} updateVideoSetting - Callback to update video permission setting
 * @property {function} updateScreenshareSetting - Callback to update screenshare permission setting
 * @property {function} updateChatSetting - Callback to update chat permission setting
 *
 * **Session Context:**
 * @property {string} roomName - Meeting room name for settings updates
 * @property {Socket} socket - Socket connection for broadcasting changes
 * @property {ShowAlert} [showAlert] - Optional alert function for user feedback
 *
 * **Customization:**
 * @property {function} [onModifyEventSettings=modifySettings] - Custom handler for settings modifications
 * @property {'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight'} [position='topRight'] - Modal screen position
 * @property {string} [backgroundColor='#83c0e9'] - Modal background color
 *
 * **Advanced Render Overrides:**
 * @property {object} [style] - Additional custom styles
 * @property {function} [renderContent] - Custom content renderer (receives defaultContent and dimensions)
 * @property {function} [renderContainer] - Custom container renderer (receives defaultContainer and dimensions)
 */
export interface EventSettingsModalOptions {
    isEventSettingsModalVisible: boolean;
    onEventSettingsClose: () => void;
    onModifyEventSettings?: (options: ModifySettingsOptions) => Promise<void>;
    position?: 'topLeft' | 'topRight' | 'bottomLeft' | 'bottomRight';
    backgroundColor?: string;
    isDarkMode?: boolean;
    audioSetting: string;
    videoSetting: string;
    screenshareSetting: string;
    chatSetting: string;
    updateAudioSetting: (setting: string) => void;
    updateVideoSetting: (setting: string) => void;
    updateScreenshareSetting: (setting: string) => void;
    updateChatSetting: (setting: string) => void;
    updateIsSettingsModalVisible: (isVisible: boolean) => void;
    roomName: string;
    socket: Socket;
    showAlert?: ShowAlert;
    style?: object;
    renderContent?: (options: {
        defaultContent: JSX.Element;
        dimensions: {
            width: number;
            height: number;
        };
    }) => JSX.Element;
    renderContainer?: (options: {
        defaultContainer: JSX.Element;
        dimensions: {
            width: number;
            height: number;
        };
    }) => React.ReactNode;
}
export type EventSettingsModalType = (options: EventSettingsModalOptions) => JSX.Element;
/**
 * EventSettingsModal - Host controls for participant permissions
 *
 * EventSettingsModal is a React Native component that provides host-level controls
 * for managing participant permissions across audio, video, screenshare, and chat.
 * Settings can be configured to allow, require approval, or disallow participant actions.
 *
 * **Key Features:**
 * - Granular permission controls (audio, video, screenshare, chat)
 * - Three permission levels: allow, approval-required, disallow
 * - Real-time permission broadcasting to all participants
 * - Position-configurable modal (4 corners)
 * - Immediate settings application
 * - Socket.io-based synchronization
 *
 * **Permission Options:**
 * - **Allow**: Participants can use feature freely
 * - **Approval**: Participants must request permission
 * - **Disallow**: Feature is disabled for participants
 *
 * **UI Customization:**
 * This component can be replaced via `uiOverrides.eventSettingsModal` to
 * provide a completely custom event settings interface.
 *
 * @component
 * @param {EventSettingsModalOptions} props - Configuration options for event settings
 *
 * @returns {JSX.Element} Rendered event settings modal
 *
 * @example
 * // Basic usage - Host permission controls
 * import React, { useState } from 'react';
 * import { EventSettingsModal } from 'mediasfu-reactnative-expo';
 * import { io } from 'socket.io-client';
 *
 * function HostControls() {
 *   const [isModalVisible, setModalVisible] = useState(false);
 *   const [audioSetting, setAudioSetting] = useState('allow');
 *   const [videoSetting, setVideoSetting] = useState('allow');
 *   const [screenshareSetting, setScreenshareSetting] = useState('approval');
 *   const [chatSetting, setChatSetting] = useState('allow');
 *
 *   const socket = io('https://mediasfu.com');
 *
 *   return (
 *     <>
 *       <Button title="Event Settings" onPress={() => setModalVisible(true)} />
 *       <EventSettingsModal
 *         isEventSettingsModalVisible={isModalVisible}
 *         onEventSettingsClose={() => setModalVisible(false)}
 *         audioSetting={audioSetting}
 *         videoSetting={videoSetting}
 *         screenshareSetting={screenshareSetting}
 *         chatSetting={chatSetting}
 *         updateAudioSetting={setAudioSetting}
 *         updateVideoSetting={setVideoSetting}
 *         updateScreenshareSetting={setScreenshareSetting}
 *         updateChatSetting={setChatSetting}
 *         updateIsSettingsModalVisible={setModalVisible}
 *         roomName="meeting-room-123"
 *         socket={socket}
 *         showAlert={(alert) => console.log(alert.message)}
 *       />
 *     </>
 *   );
 * }
 *
 * @example
 * // Positioned at bottom-left with custom colors
 * <EventSettingsModal
 *   isEventSettingsModalVisible={true}
 *   onEventSettingsClose={closeModal}
 *   position="bottomLeft"
 *   backgroundColor="#2c2c2c"
 *   audioSetting="allow"
 *   videoSetting="approval"
 *   screenshareSetting="disallow"
 *   chatSetting="allow"
 *   updateAudioSetting={setAudioSetting}
 *   updateVideoSetting={setVideoSetting}
 *   updateScreenshareSetting={setScreenshareSetting}
 *   updateChatSetting={setChatSetting}
 *   updateIsSettingsModalVisible={setModalVisible}
 *   roomName={roomName}
 *   socket={socket}
 * />
 *
 * @example
 * // Using uiOverrides for complete settings modal replacement
 * import { MyCustomEventSettings } from './MyCustomEventSettings';
 *
 * const sessionConfig = {
 *   credentials: { apiKey: 'your-api-key' },
 *   uiOverrides: {
 *     eventSettingsModal: {
 *       component: MyCustomEventSettings,
 *       injectedProps: {
 *         showAdvancedOptions: true,
 *       },
 *     },
 *   },
 * };
 *
 * // MyCustomEventSettings.tsx
 * export const MyCustomEventSettings = (props: EventSettingsModalOptions & { showAdvancedOptions: boolean }) => {
 *   const handleSave = async () => {
 *     await props.onModifyEventSettings?.({
 *       parameters: {
 *         audioSet: props.audioSetting,
 *         videoSet: props.videoSetting,
 *         screenshareSet: props.screenshareSetting,
 *         chatSet: props.chatSetting,
 *         ...props,
 *       },
 *     });
 *     props.onEventSettingsClose();
 *   };
 *
 *   return (
 *     <Modal visible={props.isEventSettingsModalVisible}>
 *       <View style={{ padding: 20 }}>
 *         <Text>Audio Permission:</Text>
 *         <Picker
 *           selectedValue={props.audioSetting}
 *           onValueChange={props.updateAudioSetting}
 *         >
 *           <Picker.Item label="Allow" value="allow" />
 *           <Picker.Item label="Approval Required" value="approval" />
 *           <Picker.Item label="Disallow" value="disallow" />
 *         </Picker>
 *         {props.showAdvancedOptions && <AdvancedPermissionOptions />}
 *         <Button title="Save Settings" onPress={handleSave} />
 *       </View>
 *     </Modal>
 *   );
 * };
 */
declare const EventSettingsModal: React.FC<EventSettingsModalOptions>;
export default EventSettingsModal;