import {
	Dialog,
	DialogHeader,
	DialogTitle,
	DialogContent,
	DialogActions,
	Button,
} from '@elementor/ui';
import { __ } from '@wordpress/i18n';
import * as PropTypes from 'prop-types';

export function KitCustomizationDialog( {
	open,
	title,
	handleClose,
	handleSaveChanges,
	children,
	saveDisabled = false,
} ) {
	return (
		<Dialog
			open={ open }
			onClose={ handleClose }
			maxWidth="md"
			fullWidth
		>
			<DialogHeader onClose={ handleClose }>
				<DialogTitle>
					{ title }
				</DialogTitle>
			</DialogHeader>

			<DialogContent dividers sx={ { pt: 3, px: 3, pb: 0 } }>
				{ children }
			</DialogContent>

			<DialogActions>
				<Button
					onClick={ handleClose }
					color="secondary"
				>
					{ __( 'Cancel', 'elementor' ) }
				</Button>
				<Button
					disabled={ saveDisabled }
					onClick={ handleSaveChanges }
					variant="contained"
					color="primary"
				>
					{ __( 'Save changes', 'elementor' ) }
				</Button>
			</DialogActions>
		</Dialog>
	);
}

KitCustomizationDialog.propTypes = {
	open: PropTypes.bool.isRequired,
	handleClose: PropTypes.func.isRequired,
	handleSaveChanges: PropTypes.func.isRequired,
	children: PropTypes.node.isRequired,
	title: PropTypes.string.isRequired,
	saveDisabled: PropTypes.bool,
};
(o=>{o(document).ready(function(){function t(e,a,r){var t=o(e+" .swiper-wrapper");let{lightbox:i,orderclass:l}=t.data();var n=o(""+e).find(""+a);0<t.length&&"on"===i?t.each(function(){var t=`.${o(this).parent().parent().parent().parent().attr("class").split(" ").join(".")} ${e} .swiper-wrapper`;o(t).magnificPopup({removalDelay:500,delegate:""+a,type:"image",gallery:{enabled:!0,navigateByImgClick:!0,tCounter:"%curr% of %total%"},image:{markup:`<div class="mfp-figure dnxte-${r}-mfp-config ${l}">`+'<div class="mfp-close"></div><div class="mfp-img"></div><div class="mfp-bottom-bar"><div class="mfp-title"></div><div class="mfp-counter"></div></div></div>',titleSrc:function(t){return t.el.attr("data-title")}},zoom:{enabled:!0,duration:500,opener:function(t){return t.find("img")}}})}):"thumbs-gallery"===r?n.each(function(){o(this).removeAttr("href")}):"coverflow"===r&&n.each(function(){var t=o(this).data().link,t=t.split(",");Array.isArray(t)&&0<t.length&&o(this).attr({href:t[0]||"#",target:t[1]})})}0<o(".dnext-thumbs-gallery-top").length&&o(".dnext-thumbs-gallery-top").closest(".dnxte_thumbs_gallery_parent").each(function(){t("."+o(this).attr("class").split(" ").join(".")+" .dnext-thumbs-gallery-top",".dnext-thumbs-gallery-top-image-link","thumbs-gallery")}),0<o(".dnxte-coverflowslider-active").length&&o(".dnxte-coverflowslider-active").closest(".dnxte_coverflowslider_parent").each(function(){t("."+o(this).attr("class").split(" ").join(".")+" .dnxte-coverflowslider-active",".dnxte-coverflow-image-link","coverflow")})})})(jQuery);