ꦫꦣꦺꦤ꧀ꦄꦤ꧀ꦠꦱꦺꦤ

PATH: home / lab2454c / carbonbullionexchange.com / wp-content / plugins / elementor / app / assets / js / ui / atoms

import { useState } from 'react';

import { arrayToClassName } from '../../utils/utils';

import './drag-drop.scss';

export default function DragDrop( props ) {
	const [ isDragOver, setIsDragOver ] = useState( false ),
		getClassName = () => {
			const baseClassName = 'e-app-drag-drop',
				classes = [ baseClassName, props.className ];

if ( isDragOver && ! props.isLoading ) {
				classes.push( baseClassName + '--drag-over' );
			}

return arrayToClassName( classes );
		},
		onDragDropActions = ( event ) => {
			event.preventDefault();
			event.stopPropagation();
		},
		dragDropEvents = {
			onDrop: ( event ) => {
				onDragDropActions( event );

setIsDragOver( false );

if ( props.onDrop ) {
					props.onDrop( event );
				}
			},
			onDragOver: ( event ) => {
				onDragDropActions( event );

setIsDragOver( true );

if ( props.onDragOver ) {
					props.onDragOver( event );
				}
			},
			onDragLeave: ( event ) => {
				onDragDropActions( event );

setIsDragOver( false );

if ( props.onDragLeave ) {
					props.onDragLeave( event );
				}
			},
		};

return (
		<div { ...dragDropEvents } className={ getClassName() }>
			{ props.children }
		</div>
	);
}

DragDrop.propTypes = {
	className: PropTypes.string,
	children: PropTypes.any,
	onDrop: PropTypes.func,
	onDragLeave: PropTypes.func,
	onDragOver: PropTypes.func,
	isLoading: PropTypes.bool,
};

DragDrop.defaultProps = {
	className: '',
};

[-] icon.js [edit]
[-] checkbox-api.scss [edit]
[-] box.js [edit]
[-] select.js [edit]
[+] ..
[-] text.js [edit]
[-] box.scss [edit]
[-] css-grid.js [edit]
[-] drag-drop.scss [edit]
[-] css-grid.scss [edit]
[-] checkbox.js [edit]
[-] checkbox.scss [edit]
[-] heading.js [edit]
[-] text-field.scss [edit]
[-] text-field.js [edit]
[-] drag-drop.js [edit]