/******/ (() => { // webpackBootstrap

/******/ 	"use strict";

/******/ 	// The require scope

/******/ 	var __webpack_require__ = {};

/******/ 	

/************************************************************************/

/******/ 	/* webpack/runtime/compat get default export */

/******/ 	(() => {

/******/ 		// getDefaultExport function for compatibility with non-harmony modules

/******/ 		__webpack_require__.n = (module) => {

/******/ 			var getter = module && module.__esModule ?

/******/ 				() => (module['default']) :

/******/ 				() => (module);

/******/ 			__webpack_require__.d(getter, { a: getter });

/******/ 			return getter;

/******/ 		};

/******/ 	})();

/******/ 	

/******/ 	/* webpack/runtime/define property getters */

/******/ 	(() => {

/******/ 		// define getter functions for harmony exports

/******/ 		__webpack_require__.d = (exports, definition) => {

/******/ 			for(var key in definition) {

/******/ 				if(__webpack_require__.o(definition, key) && !__webpack_require__.o(exports, key)) {

/******/ 					Object.defineProperty(exports, key, { enumerable: true, get: definition[key] });

/******/ 				}

/******/ 			}

/******/ 		};

/******/ 	})();

/******/ 	

/******/ 	/* webpack/runtime/hasOwnProperty shorthand */

/******/ 	(() => {

/******/ 		__webpack_require__.o = (obj, prop) => (Object.prototype.hasOwnProperty.call(obj, prop))

/******/ 	})();

/******/ 	

/******/ 	/* webpack/runtime/make namespace object */

/******/ 	(() => {

/******/ 		// define __esModule on exports

/******/ 		__webpack_require__.r = (exports) => {

/******/ 			if(typeof Symbol !== 'undefined' && Symbol.toStringTag) {

/******/ 				Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });

/******/ 			}

/******/ 			Object.defineProperty(exports, '__esModule', { value: true });

/******/ 		};

/******/ 	})();

/******/ 	

/************************************************************************/

var __webpack_exports__ = {};

// ESM COMPAT FLAG

__webpack_require__.r(__webpack_exports__);

// EXPORTS

__webpack_require__.d(__webpack_exports__, {

  MediaUpload: () => (/* reexport */ media_upload),

});

const external_wp_element_namespaceObject = window["wp"]["element"];

const external_wp_i18n_namespaceObject = window["wp"]["i18n"];

/**

 * WordPress dependencies

 */

const DEFAULT_EMPTY_GALLERY = [];

/**

 * Prepares the Featured Image toolbars and frames.

 *

 * @return {window.wp.media.view.MediaFrame.Select} The default media workflow.

 */

const getFeaturedImageMediaFrame = () => {

  const {

    wp

  } = window;

  return wp.media.view.MediaFrame.Select.extend({

    /**

     * Enables the Set Featured Image Button.

     *

     * @param {Object} toolbar toolbar for featured image state

     * @return {void}

     */

    featuredImageToolbar(toolbar) {

      this.createSelectToolbar(toolbar, {

        text: wp.media.view.l10n.setFeaturedImage,

        state: this.options.state

      });

    },

    /**

     * Handle the edit state requirements of selected media item.

     *

     * @return {void}

     */

    editState() {

      const selection = this.state('featured-image').get('selection');

      const view = new wp.media.view.EditImage({

        model: selection.single(),

        controller: this

      }).render();

      // Set the view to the EditImage frame using the selected image.

      this.content.set(view);

      // After bringing in the frame, load the actual editor via an ajax call.

      view.loadEditor();

    },

    /**

     * Create the default states.

     *

     * @return {void}

     */

    createStates: function createStates() {

      this.on('toolbar:create:featured-image', this.featuredImageToolbar, this);

      this.on('content:render:edit-image', this.editState, this);

      this.states.add([new wp.media.controller.FeaturedImage(), new wp.media.controller.EditImage({

        model: this.options.editImage

      })]);

    }

  });

};

/**

 * Prepares the Gallery toolbars and frames.

 *

 * @return {window.wp.media.view.MediaFrame.Post} The default media workflow.

 */

const getGalleryDetailsMediaFrame = () => {

  const {

    wp

  } = window;

  /**

   * Custom gallery details frame.

   *

   * @see https://github.com/xwp/wp-core-media-widgets/blob/905edbccfc2a623b73a93dac803c5335519d7837/wp-admin/js/widgets/media-gallery-widget.js

   * @class GalleryDetailsMediaFrame

   * @class

   */

  return wp.media.view.MediaFrame.Post.extend({

    /**

     * Set up gallery toolbar.

     *

     * @return {void}

     */

    galleryToolbar() {

      const editing = this.state().get('editing');

      this.toolbar.set(new wp.media.view.Toolbar({

        controller: this,

        items: {

          insert: {

            style: 'primary',

            text: editing ? wp.media.view.l10n.updateGallery : wp.media.view.l10n.insertGallery,

            priority: 80,

            requires: {

              library: true

            },

            /**

             * @fires wp.media.controller.State#update

             */

            click() {

              const controller = this.controller,

                state = controller.state();

              controller.close();

              state.trigger('update', state.get('library'));

              // Restore and reset the default state.

              controller.setState(controller.options.state);

              controller.reset();

            }

          }

        }

      }));

    },

    /**

     * Handle the edit state requirements of selected media item.

     *

     * @return {void}

     */

    editState() {

      const selection = this.state('gallery').get('selection');

      const view = new wp.media.view.EditImage({

        model: selection.single(),

        controller: this

      }).render();

      // Set the view to the EditImage frame using the selected image.

      this.content.set(view);

      // After bringing in the frame, load the actual editor via an ajax call.

      view.loadEditor();

    },

    /**

     * Create the default states.

     *

     * @return {void}

     */

    createStates: function createStates() {

      this.on('toolbar:create:main-gallery', this.galleryToolbar, this);

      this.on('content:render:edit-image', this.editState, this);

      this.states.add([new wp.media.controller.Library({

        id: 'gallery',

        title: wp.media.view.l10n.createGalleryTitle,

        priority: 40,

        toolbar: 'main-gallery',

        filterable: 'uploaded',

        multiple: 'add',

        editable: false,

        library: wp.media.query({

          type: 'image',

          ...this.options.library

        })

      }), new wp.media.controller.EditImage({

        model: this.options.editImage

      }), new wp.media.controller.GalleryEdit({

        library: this.options.selection,

        editing: this.options.editing,

        menu: 'gallery',

        displaySettings: false,

        multiple: true

      }), new wp.media.controller.GalleryAdd()]);

    }

  });

};

// The media library image object contains numerous attributes

// we only need this set to display the image in the library.

const slimImageObject = img => {

  const attrSet = ['sizes', 'mime', 'type', 'subtype', 'id', 'url', 'alt', 'link', 'caption'];

  return attrSet.reduce((result, key) => {

    if (img?.hasOwnProperty(key)) {

      result[key] = img[key];

    }

    return result;

  }, {});

};

const getAttachmentsCollection = ids => {

  const {

    wp

  } = window;

  return wp.media.query({

    order: 'ASC',

    orderby: 'post__in',

    post__in: ids,

    posts_per_page: -1,

    query: true,

    type: 'image'

  });

};

class MediaUpload extends external_wp_element_namespaceObject.Component {

  constructor() {

    super(...arguments);

    this.openModal = this.openModal.bind(this);

    this.onOpen = this.onOpen.bind(this);

    this.onSelect = this.onSelect.bind(this);

    this.onUpdate = this.onUpdate.bind(this);

    this.onClose = this.onClose.bind(this);

  }

  initializeListeners() {

    // When an image is selected in the media frame...

    this.frame.on('select', this.onSelect);

    this.frame.on('update', this.onUpdate);

    this.frame.on('open', this.onOpen);

    this.frame.on('close', this.onClose);

  }

  /**

   * Sets the Gallery frame and initializes listeners.

   *

   * @return {void}

   */

  buildAndSetGalleryFrame() {

    const {

      addToGallery = false,

      allowedTypes,

      multiple = false,

      value = DEFAULT_EMPTY_GALLERY

    } = this.props;

    // If the value did not changed there is no need to rebuild the frame,

    // we can continue to use the existing one.

    if (value === this.lastGalleryValue) {

      return;

    }

    const {

      wp

    } = window;

    this.lastGalleryValue = value;

    // If a frame already existed remove it.

    if (this.frame) {

      this.frame.remove();

    }

    let currentState;

    if (addToGallery) {

      currentState = 'gallery-library';

    } else {

      currentState = value && value.length ? 'gallery-edit' : 'gallery';

    }

    if (!this.GalleryDetailsMediaFrame) {

      this.GalleryDetailsMediaFrame = getGalleryDetailsMediaFrame();

    }

    const attachments = getAttachmentsCollection(value);

    const selection = new wp.media.model.Selection(attachments.models, {

      props: attachments.props.toJSON(),

      multiple

    });

    this.frame = new this.GalleryDetailsMediaFrame({

      mimeType: allowedTypes,

      state: currentState,

      multiple,

      selection,

    });

    wp.media.frame = this.frame;

    this.initializeListeners();

  }