dependency upgrade

.config/webpack.config.js

@@ -1,4 +1,4 @@
-const ManifestPlugin = require('webpack-manifest-plugin');
+const { WebpackManifestPlugin } = require('webpack-manifest-plugin');
 const { CleanWebpackPlugin } = require('clean-webpack-plugin');
 const path = require('path');
 
@@ -15,7 +15,6 @@ const commonConfig = {
 		chunkFilename: 'inc/[name]/build/chunk.[id].[chunkhash:8].js',
 		publicPath: '/',
 		libraryTarget: 'this',
-		jsonpFunction: 'HMSmartMedia'
 	},
 	target: 'web',
 	resolve: { extensions: [ '.js', '.css', '.scss' ] },
@@ -28,14 +27,19 @@ const commonConfig = {
 				options: {
 					babelrc: false,
 					presets: [
-						[ require( '@babel/preset-env' ), {
-							modules: false,
-							targets: { browsers: [ ' > 0.01%' ] },
-						} ],
+						[
+							require( '@babel/preset-env' ),
+							{
+							  targets: {
+								browsers: ['> 0.01%'],
+							  },
+							  useBuiltIns: 'usage',
+							  corejs: 3,
+							}
+						],
 					],
 					plugins: [
 						require( '@babel/plugin-proposal-object-rest-spread' ),
-						require( '@babel/polyfill' ),
 					],
 				},
 			},
@@ -63,7 +67,6 @@ const commonConfig = {
 		'@wordpress/template': { this: [ 'wp', 'template' ] },
 		'@wordpress/i18n': { this: [ 'wp', 'i18n' ] },
 		'@wordpress/hooks': { this: [ 'wp', 'hooks' ] },
-		'jQuery': 'jQuery',
 		lodash: '_',
 		wp: 'wp',
 	},
@@ -76,7 +79,7 @@ const commonConfig = {
 		},
 	},
 	plugins: [
-		new ManifestPlugin( {
+		new WebpackManifestPlugin( {
 			writeToFileEmit: true,
 		} ),
 		new CleanWebpackPlugin( {
@@ -86,10 +89,9 @@ const commonConfig = {
 };
 
 const devConfig = Object.assign( {}, commonConfig, {
-	devtool: 'cheap-module-eval-source-map',
+	devtool: 'eval-cheap-module-source-map',
 	devServer: {
 		port: 9022,
-		//hot: true,
 		allowedHosts: [
 			'.local',
 			'.localhost',

.gitignore

@@ -1,3 +1,4 @@
 node_modules
 build
 manifest.json
+yarn-error.log

CHANGELOG.md

@@ -1,6 +1,10 @@
 Changelog
 =========
 
+## v0.4.4
+
+- Dependency upgrade
+
 ## v0.4.3
 
 - Bug: Check model has mime type before checking value

inc/cropper/src/cropper.js

@@ -1,3 +1,4 @@
+import "core-js/stable";
 import { addAction, applyFilters, addFilter } from '@wordpress/hooks';
 import { __ } from '@wordpress/i18n';
 import Media from '@wordpress/media';

inc/cropper/src/views/image-editor.js

@@ -1,12 +1,9 @@
 import Media from '@wordpress/media';
 import template from '@wordpress/template';
 import ajax from '@wordpress/ajax';
-import jQuery from 'jQuery';
 import smartcrop from 'smartcrop';
 import { getMaxCrop } from '../utils';
 
-const $ = jQuery;
-
 /**
  * Image editor.
  */
@@ -186,6 +183,7 @@ const ImageEditor = Media.View.extend( {
 		}
 
 		const aspectRatio = `${size.width}:${size.height}`;
+		const model = this.model
 
 		// Load imgAreaSelect.
 		this.cropper = $image.imgAreaSelect( {
@@ -201,15 +199,20 @@ const ImageEditor = Media.View.extend( {
 			aspectRatio: aspectRatio,
 			persistent: true,
 			onInit( img ) {
-				// Ensure that the imgAreaSelect wrapper elements are position:absolute.
-				// (even if we're in a position:fixed modal)
-				const $img = $( img );
-				$img.next().css( 'position', 'absolute' )
-					.nextAll( '.imgareaselect-outer' ).css( 'position', 'absolute' );
+				img.nextElementSibling.style.position = 'absolute';
+				let currentSibling = img.nextElementSibling
+				let nextSibling = currentSibling.nextElementSibling
+				while(nextSibling) {
+					if (nextSibling.classList.contains('imgareaselect-outer')) {
+						nextSibling.style.position = 'absolute'
+					}
+					currentSibling = nextSibling
+					nextSibling = currentSibling.nextElementSibling
+				}
 
 				// Account for rounding errors in imgareaselect with jQuery v3 innerHeight sub-pixel values.
-				$img.width( Math.round( $img.innerWidth() ) );
-				$img.height( Math.round( $img.innerHeight() ) );
+				img.style.width = img.clientWidth + 'px';
+				img.style.height = img.clientHeight + 'px';
 
 				// Set initial crop.
 				view.reset();