: str_replace(): Passing null to parameter #2 ($replace) of type array|string is deprecated in
/******/ (() => { // webpackBootstrap
/******/ // 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']) :
/******/ __webpack_require__.d(getter, { a: 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__ = {};
__webpack_require__.r(__webpack_exports__);
__webpack_require__.d(__webpack_exports__, {
MediaUpload: () => (/* reexport */ media_upload),
uploadMedia: () => (/* reexport */ uploadMedia)
;// CONCATENATED MODULE: external ["wp","element"]
const external_wp_element_namespaceObject = window["wp"]["element"];
;// CONCATENATED MODULE: external ["wp","i18n"]
const external_wp_i18n_namespaceObject = window["wp"]["i18n"];
;// CONCATENATED MODULE: ./node_modules/@wordpress/media-utils/build-module/components/media-upload/index.js
const DEFAULT_EMPTY_GALLERY = [];
* Prepares the Featured Image toolbars and frames.
* @return {window.wp.media.view.MediaFrame.Select} The default media workflow.
const getFeaturedImageMediaFrame = () => {
return wp.media.view.MediaFrame.Select.extend({
* Enables the Set Featured Image Button.
* @param {Object} toolbar toolbar for featured image state
featuredImageToolbar(toolbar) {
this.createSelectToolbar(toolbar, {
text: wp.media.view.l10n.setFeaturedImage,
state: this.options.state
* Handle the edit state requirements of selected media item.
const selection = this.state('featured-image').get('selection');
const view = new wp.media.view.EditImage({
model: selection.single(),
// Set the view to the EditImage frame using the selected image.
// After bringing in the frame, load the actual editor via an ajax call.
* Create the default states.
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 = () => {
* 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
return wp.media.view.MediaFrame.Post.extend({
* Set up gallery toolbar.
const editing = this.state().get('editing');
this.toolbar.set(new wp.media.view.Toolbar({
text: editing ? wp.media.view.l10n.updateGallery : wp.media.view.l10n.insertGallery,
* @fires wp.media.controller.State#update
const controller = this.controller,
state = controller.state();
state.trigger('update', state.get('library'));
// Restore and reset the default state.
controller.setState(controller.options.state);
* Handle the edit state requirements of selected media item.
const selection = this.state('gallery').get('selection');
const view = new wp.media.view.EditImage({
model: selection.single(),
// Set the view to the EditImage frame using the selected image.
// After bringing in the frame, load the actual editor via an ajax call.
* Create the default states.
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({
title: wp.media.view.l10n.createGalleryTitle,
library: wp.media.query({
}), new wp.media.controller.EditImage({
model: this.options.editImage
}), new wp.media.controller.GalleryEdit({
library: this.options.selection,
editing: this.options.editing,
}), 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)) {
const getAttachmentsCollection = ids => {
class MediaUpload extends external_wp_element_namespaceObject.Component {
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);
// 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.
buildAndSetGalleryFrame() {
value = DEFAULT_EMPTY_GALLERY
// 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) {
this.lastGalleryValue = value;
// If a frame already existed remove it.
currentState = 'gallery-library';
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(),
this.frame = new this.GalleryDetailsMediaFrame({
editing: value && value.length ? true : false
wp.media.frame = this.frame;
this.initializeListeners();
* Initializes the Media Library requirements for the featured image flow.
buildAndSetFeatureImageFrame() {
const featuredImageFrame = getFeaturedImageMediaFrame();
const attachments = getAttachmentsCollection(featuredImageId);
const selection = new wp.media.model.Selection(attachments.models, {
props: attachments.props.toJSON()
this.frame = new featuredImageFrame({
wp.media.frame = this.frame;
// In order to select the current featured image when opening
// the media library we have to set the appropriate settings.
// Currently they are set in php for the post editor, but
wp.media.view.settings.post = {
...wp.media.view.settings.post,
featuredImageId: featuredImageId || -1
const state = this.frame.state();
const selectedImages = selections || state.get('selection');
if (!selectedImages || !selectedImages.models.length) {
onSelect(selectedImages.models.map(model => slimImageObject(model.toJSON())));
onSelect(slimImageObject(selectedImages.models[0].toJSON()));
// Get media attachment details from the frame state.
const attachment = this.frame.state().get('selection').toJSON();
onSelect(multiple ? attachment : attachment[0]);
//Handle active tab in media model on model open.
this.frame.content.mode(this.props.mode);
// Handle both this.props.value being either (number[]) multiple ids
// (for galleries) or a (number) singular id (e.g. image block).
const hasMedia = Array.isArray(value) ? !!value?.length : !!value;
const isGallery = this.props.gallery;
const selection = this.frame.state().get('selection');
const valueArray = Array.isArray(value) ? value : [value];
valueArray.forEach(id => {
selection.add(wp.media.attachment(id));
// Load the images so they are available in the media modal.
const attachments = getAttachmentsCollection(valueArray);
// Once attachments are loaded, set the current selection.
attachments.more().done(function () {
if (isGallery && attachments?.models?.length) {
selection.add(attachments.models);
const frameContent = this.frame.content.get();
if (frameContent && frameContent.collection) {
const collection = frameContent.collection;
// Clean all attachments we have in memory.
collection.toArray().forEach(model => model.trigger('destroy', model));
// Reset has more flag, if library had small amount of items all items may have been loaded before.
collection.mirroring._hasMore = true;
unstableFeaturedImageFlow = false,
title = (0,external_wp_i18n_namespaceObject.__)('Select or Upload Media')
this.buildAndSetGalleryFrame();
this.frame = wp.media(frameConfig);
this.frame.$el.addClass(modalClass);
if (unstableFeaturedImageFlow) {
this.buildAndSetFeatureImageFrame();
this.initializeListeners();
return this.props.render({
/* harmony default export */ const media_upload = (MediaUpload);
;// CONCATENATED MODULE: ./node_modules/@wordpress/media-utils/build-module/components/index.js
;// CONCATENATED MODULE: external ["wp","apiFetch"]
const external_wp_apiFetch_namespaceObject = window["wp"]["apiFetch"];
var external_wp_apiFetch_default = /*#__PURE__*/__webpack_require__.n(external_wp_apiFetch_namespaceObject);
;// CONCATENATED MODULE: external ["wp","blob"]
const external_wp_blob_namespaceObject = window["wp"]["blob"];
;// CONCATENATED MODULE: ./node_modules/@wordpress/media-utils/build-module/utils/upload-media.js