@wordpress/block-editor 12.10.6 → 12.11.1

package/build/components/inserter/media-tab/media-list.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
 var _mediaPreview = require("./media-preview");
@@ -23,12 +23,12 @@ function MediaList({
   label = (0, _i18n.__)('Media List')
 }) {
   const composite = (0, _components.__unstableUseCompositeState)();
-  return (0, _element.createElement)(_components.__unstableComposite, {
+  return (0, _react.createElement)(_components.__unstableComposite, {
     ...composite,
     role: "listbox",
     className: "block-editor-inserter__media-list",
     "aria-label": label
-  }, mediaList.map((media, index) => (0, _element.createElement)(_mediaPreview.MediaPreview, {
+  }, mediaList.map((media, index) => (0, _react.createElement)(_mediaPreview.MediaPreview, {
     key: media.id || media.sourceId || index,
     media: media,
     category: category,

package/build/components/inserter/media-tab/media-list.js.map

@@ -1 +1 @@
-{"version":3,"names":["_components","require","_i18n","_mediaPreview","MediaList","mediaList","category","onClick","label","__","composite","useCompositeState","_element","createElement","__unstableComposite","role","className","map","media","index","MediaPreview","key","id","sourceId","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { MediaPreview } from './media-preview';\n\nfunction MediaList( {\n\tmediaList,\n\tcategory,\n\tonClick,\n\tlabel = __( 'Media List' ),\n} ) {\n\tconst composite = useCompositeState();\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-inserter__media-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ mediaList.map( ( media, index ) => (\n\t\t\t\t<MediaPreview\n\t\t\t\t\tkey={ media.id || media.sourceId || index }\n\t\t\t\t\tmedia={ media }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\tcomposite={ composite }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nexport default MediaList;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,aAAA,GAAAF,OAAA;AAZA;AACA;AACA;;AAOA;AACA;AACA;;AAGA,SAASG,SAASA,CAAE;EACnBC,SAAS;EACTC,QAAQ;EACRC,OAAO;EACPC,KAAK,GAAG,IAAAC,QAAE,EAAE,YAAa;AAC1B,CAAC,EAAG;EACH,MAAMC,SAAS,GAAG,IAAAC,uCAAiB,EAAC,CAAC;EACrC,OACC,IAAAC,QAAA,CAAAC,aAAA,EAACb,WAAA,CAAAc,mBAAS;IAAA,GACJJ,SAAS;IACdK,IAAI,EAAC,SAAS;IACdC,SAAS,EAAC,mCAAmC;IAC7C,cAAaR;EAAO,GAElBH,SAAS,CAACY,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAC9B,IAAAP,QAAA,CAAAC,aAAA,EAACV,aAAA,CAAAiB,YAAY;IACZC,GAAG,EAAGH,KAAK,CAACI,EAAE,IAAIJ,KAAK,CAACK,QAAQ,IAAIJ,KAAO;IAC3CD,KAAK,EAAGA,KAAO;IACfZ,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA,OAAS;IACnBG,SAAS,EAAGA;EAAW,CACvB,CACA,CACQ,CAAC;AAEd;AAAC,IAAAc,QAAA,GAEcpB,SAAS;AAAAqB,OAAA,CAAAC,OAAA,GAAAF,QAAA"}
+{"version":3,"names":["_components","require","_i18n","_mediaPreview","MediaList","mediaList","category","onClick","label","__","composite","useCompositeState","_react","createElement","__unstableComposite","role","className","map","media","index","MediaPreview","key","id","sourceId","_default","exports","default"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-list.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport {\n\t__unstableComposite as Composite,\n\t__unstableUseCompositeState as useCompositeState,\n} from '@wordpress/components';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport { MediaPreview } from './media-preview';\n\nfunction MediaList( {\n\tmediaList,\n\tcategory,\n\tonClick,\n\tlabel = __( 'Media List' ),\n} ) {\n\tconst composite = useCompositeState();\n\treturn (\n\t\t<Composite\n\t\t\t{ ...composite }\n\t\t\trole=\"listbox\"\n\t\t\tclassName=\"block-editor-inserter__media-list\"\n\t\t\taria-label={ label }\n\t\t>\n\t\t\t{ mediaList.map( ( media, index ) => (\n\t\t\t\t<MediaPreview\n\t\t\t\t\tkey={ media.id || media.sourceId || index }\n\t\t\t\t\tmedia={ media }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t\tonClick={ onClick }\n\t\t\t\t\tcomposite={ composite }\n\t\t\t\t/>\n\t\t\t) ) }\n\t\t</Composite>\n\t);\n}\n\nexport default MediaList;\n"],"mappings":";;;;;;;AAGA,IAAAA,WAAA,GAAAC,OAAA;AAIA,IAAAC,KAAA,GAAAD,OAAA;AAKA,IAAAE,aAAA,GAAAF,OAAA;AAZA;AACA;AACA;;AAOA;AACA;AACA;;AAGA,SAASG,SAASA,CAAE;EACnBC,SAAS;EACTC,QAAQ;EACRC,OAAO;EACPC,KAAK,GAAG,IAAAC,QAAE,EAAE,YAAa;AAC1B,CAAC,EAAG;EACH,MAAMC,SAAS,GAAG,IAAAC,uCAAiB,EAAC,CAAC;EACrC,OACC,IAAAC,MAAA,CAAAC,aAAA,EAACb,WAAA,CAAAc,mBAAS;IAAA,GACJJ,SAAS;IACdK,IAAI,EAAC,SAAS;IACdC,SAAS,EAAC,mCAAmC;IAC7C,cAAaR;EAAO,GAElBH,SAAS,CAACY,GAAG,CAAE,CAAEC,KAAK,EAAEC,KAAK,KAC9B,IAAAP,MAAA,CAAAC,aAAA,EAACV,aAAA,CAAAiB,YAAY;IACZC,GAAG,EAAGH,KAAK,CAACI,EAAE,IAAIJ,KAAK,CAACK,QAAQ,IAAIJ,KAAO;IAC3CD,KAAK,EAAGA,KAAO;IACfZ,QAAQ,EAAGA,QAAU;IACrBC,OAAO,EAAGA,OAAS;IACnBG,SAAS,EAAGA;EAAW,CACvB,CACA,CACQ,CAAC;AAEd;AAAC,IAAAc,QAAA,GAEcpB,SAAS;AAAAqB,OAAA,CAAAC,OAAA,GAAAF,QAAA"}

package/build/components/inserter/media-tab/media-panel.js

@@ -6,6 +6,7 @@ Object.defineProperty(exports, "__esModule", {
 });
 exports.MediaCategoryDialog = MediaCategoryDialog;
 exports.MediaCategoryPanel = MediaCategoryPanel;
+var _react = require("react");
 var _element = require("@wordpress/element");
 var _components = require("@wordpress/components");
 var _dom = require("@wordpress/dom");
@@ -36,10 +37,10 @@ function MediaCategoryDialog({
     });
     return () => clearTimeout(timeout);
   }, [category]);
-  return (0, _element.createElement)("div", {
+  return (0, _react.createElement)("div", {
     ref: container,
     className: "block-editor-inserter__media-dialog"
-  }, (0, _element.createElement)(MediaCategoryPanel, {
+  }, (0, _react.createElement)(MediaCategoryPanel, {
     rootClientId: rootClientId,
     onInsert: onInsert,
     category: category
@@ -60,17 +61,17 @@ function MediaCategoryPanel({
   });
   const baseCssClass = 'block-editor-inserter__media-panel';
   const searchLabel = category.labels.search_items || (0, _i18n.__)('Search');
-  return (0, _element.createElement)("div", {
+  return (0, _react.createElement)("div", {
     className: baseCssClass
-  }, (0, _element.createElement)(_components.SearchControl, {
+  }, (0, _react.createElement)(_components.SearchControl, {
     className: `${baseCssClass}-search`,
     onChange: setSearch,
     value: search,
     label: searchLabel,
     placeholder: searchLabel
-  }), isLoading && (0, _element.createElement)("div", {
+  }), isLoading && (0, _react.createElement)("div", {
     className: `${baseCssClass}-spinner`
-  }, (0, _element.createElement)(_components.Spinner, null)), !isLoading && !mediaList?.length && (0, _element.createElement)(_noResults.default, null), !isLoading && !!mediaList?.length && (0, _element.createElement)(_mediaList.default, {
+  }, (0, _react.createElement)(_components.Spinner, null)), !isLoading && !mediaList?.length && (0, _react.createElement)(_noResults.default, null), !isLoading && !!mediaList?.length && (0, _react.createElement)(_mediaList.default, {
     rootClientId: rootClientId,
     onClick: onInsert,
     mediaList: mediaList,

package/build/components/inserter/media-tab/media-panel.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_components","_dom","_i18n","_mediaList","_interopRequireDefault","_useDebouncedInput","_hooks","_noResults","INITIAL_MEDIA_ITEMS_PER_PAGE","MediaCategoryDialog","rootClientId","onInsert","category","container","useRef","useEffect","timeout","setTimeout","firstTabbable","focus","tabbable","find","current","clearTimeout","createElement","ref","className","MediaCategoryPanel","search","setSearch","debouncedSearch","useDebouncedInput","mediaList","isLoading","useMediaResults","per_page","baseCssClass","searchLabel","labels","search_items","__","SearchControl","onChange","value","label","placeholder","Spinner","length","default","onClick"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-panel.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect } from '@wordpress/element';\nimport { Spinner, SearchControl } from '@wordpress/components';\nimport { focus } from '@wordpress/dom';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport MediaList from './media-list';\nimport useDebouncedInput from '../hooks/use-debounced-input';\nimport { useMediaResults } from './hooks';\nimport InserterNoResults from '../no-results';\n\nconst INITIAL_MEDIA_ITEMS_PER_PAGE = 10;\n\nexport function MediaCategoryDialog( { rootClientId, onInsert, category } ) {\n\tconst container = useRef();\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tconst [ firstTabbable ] = focus.tabbable.find( container.current );\n\t\t\tfirstTabbable?.focus();\n\t\t} );\n\t\treturn () => clearTimeout( timeout );\n\t}, [ category ] );\n\treturn (\n\t\t<div ref={ container } className=\"block-editor-inserter__media-dialog\">\n\t\t\t<MediaCategoryPanel\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\tonInsert={ onInsert }\n\t\t\t\tcategory={ category }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport function MediaCategoryPanel( { rootClientId, onInsert, category } ) {\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput();\n\tconst { mediaList, isLoading } = useMediaResults( category, {\n\t\tper_page: !! debouncedSearch ? 20 : INITIAL_MEDIA_ITEMS_PER_PAGE,\n\t\tsearch: debouncedSearch,\n\t} );\n\tconst baseCssClass = 'block-editor-inserter__media-panel';\n\tconst searchLabel = category.labels.search_items || __( 'Search' );\n\treturn (\n\t\t<div className={ baseCssClass }>\n\t\t\t<SearchControl\n\t\t\t\tclassName={ `${ baseCssClass }-search` }\n\t\t\t\tonChange={ setSearch }\n\t\t\t\tvalue={ search }\n\t\t\t\tlabel={ searchLabel }\n\t\t\t\tplaceholder={ searchLabel }\n\t\t\t/>\n\t\t\t{ isLoading && (\n\t\t\t\t<div className={ `${ baseCssClass }-spinner` }>\n\t\t\t\t\t<Spinner />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ! isLoading && ! mediaList?.length && <InserterNoResults /> }\n\t\t\t{ ! isLoading && !! mediaList?.length && (\n\t\t\t\t<MediaList\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\tonClick={ onInsert }\n\t\t\t\t\tmediaList={ mediaList }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["_element","require","_components","_dom","_i18n","_mediaList","_interopRequireDefault","_useDebouncedInput","_hooks","_noResults","INITIAL_MEDIA_ITEMS_PER_PAGE","MediaCategoryDialog","rootClientId","onInsert","category","container","useRef","useEffect","timeout","setTimeout","firstTabbable","focus","tabbable","find","current","clearTimeout","_react","createElement","ref","className","MediaCategoryPanel","search","setSearch","debouncedSearch","useDebouncedInput","mediaList","isLoading","useMediaResults","per_page","baseCssClass","searchLabel","labels","search_items","__","SearchControl","onChange","value","label","placeholder","Spinner","length","default","onClick"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-panel.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { useRef, useEffect } from '@wordpress/element';\nimport { Spinner, SearchControl } from '@wordpress/components';\nimport { focus } from '@wordpress/dom';\nimport { __ } from '@wordpress/i18n';\n\n/**\n * Internal dependencies\n */\nimport MediaList from './media-list';\nimport useDebouncedInput from '../hooks/use-debounced-input';\nimport { useMediaResults } from './hooks';\nimport InserterNoResults from '../no-results';\n\nconst INITIAL_MEDIA_ITEMS_PER_PAGE = 10;\n\nexport function MediaCategoryDialog( { rootClientId, onInsert, category } ) {\n\tconst container = useRef();\n\tuseEffect( () => {\n\t\tconst timeout = setTimeout( () => {\n\t\t\tconst [ firstTabbable ] = focus.tabbable.find( container.current );\n\t\t\tfirstTabbable?.focus();\n\t\t} );\n\t\treturn () => clearTimeout( timeout );\n\t}, [ category ] );\n\treturn (\n\t\t<div ref={ container } className=\"block-editor-inserter__media-dialog\">\n\t\t\t<MediaCategoryPanel\n\t\t\t\trootClientId={ rootClientId }\n\t\t\t\tonInsert={ onInsert }\n\t\t\t\tcategory={ category }\n\t\t\t/>\n\t\t</div>\n\t);\n}\n\nexport function MediaCategoryPanel( { rootClientId, onInsert, category } ) {\n\tconst [ search, setSearch, debouncedSearch ] = useDebouncedInput();\n\tconst { mediaList, isLoading } = useMediaResults( category, {\n\t\tper_page: !! debouncedSearch ? 20 : INITIAL_MEDIA_ITEMS_PER_PAGE,\n\t\tsearch: debouncedSearch,\n\t} );\n\tconst baseCssClass = 'block-editor-inserter__media-panel';\n\tconst searchLabel = category.labels.search_items || __( 'Search' );\n\treturn (\n\t\t<div className={ baseCssClass }>\n\t\t\t<SearchControl\n\t\t\t\tclassName={ `${ baseCssClass }-search` }\n\t\t\t\tonChange={ setSearch }\n\t\t\t\tvalue={ search }\n\t\t\t\tlabel={ searchLabel }\n\t\t\t\tplaceholder={ searchLabel }\n\t\t\t/>\n\t\t\t{ isLoading && (\n\t\t\t\t<div className={ `${ baseCssClass }-spinner` }>\n\t\t\t\t\t<Spinner />\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ ! isLoading && ! mediaList?.length && <InserterNoResults /> }\n\t\t\t{ ! isLoading && !! mediaList?.length && (\n\t\t\t\t<MediaList\n\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\tonClick={ onInsert }\n\t\t\t\t\tmediaList={ mediaList }\n\t\t\t\t\tcategory={ category }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</div>\n\t);\n}\n"],"mappings":"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"}

package/build/components/inserter/media-tab/media-preview.js

@@ -5,10 +5,11 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.MediaPreview = MediaPreview;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
+var _element = require("@wordpress/element");
 var _blocks = require("@wordpress/blocks");
 var _icons = require("@wordpress/icons");
 var _data = require("@wordpress/data");
@@ -43,12 +44,12 @@ function MediaPreviewOptions({
     return null;
   }
   const reportUrl = category.getReportUrl(media);
-  return (0, _element.createElement)(_components.DropdownMenu, {
+  return (0, _react.createElement)(_components.DropdownMenu, {
     className: "block-editor-inserter__media-list__item-preview-options",
     label: (0, _i18n.__)('Options'),
     popoverProps: MEDIA_OPTIONS_POPOVER_PROPS,
     icon: _icons.moreVertical
-  }, () => (0, _element.createElement)(_components.MenuGroup, null, (0, _element.createElement)(_components.MenuItem, {
+  }, () => (0, _react.createElement)(_components.MenuGroup, null, (0, _react.createElement)(_components.MenuItem, {
     onClick: () => window.open(reportUrl, '_blank').focus(),
     icon: _icons.external
   }, (0, _i18n.sprintf)( /* translators: %s: The media type to report e.g: "image", "video", "audio" */
@@ -58,20 +59,20 @@ function InsertExternalImageModal({
   onClose,
   onSubmit
 }) {
-  return (0, _element.createElement)(_components.Modal, {
+  return (0, _react.createElement)(_components.Modal, {
     title: (0, _i18n.__)('Insert external image'),
     onRequestClose: onClose,
     className: "block-editor-inserter-media-tab-media-preview-inserter-external-image-modal"
-  }, (0, _element.createElement)(_components.__experimentalVStack, {
+  }, (0, _react.createElement)(_components.__experimentalVStack, {
     spacing: 3
-  }, (0, _element.createElement)("p", null, (0, _i18n.__)('This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.')), (0, _element.createElement)("p", null, (0, _i18n.__)('External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'))), (0, _element.createElement)(_components.Flex, {
+  }, (0, _react.createElement)("p", null, (0, _i18n.__)('This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.')), (0, _react.createElement)("p", null, (0, _i18n.__)('External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'))), (0, _react.createElement)(_components.Flex, {
     className: "block-editor-block-lock-modal__actions",
     justify: "flex-end",
     expanded: false
-  }, (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_components.Button, {
+  }, (0, _react.createElement)(_components.FlexItem, null, (0, _react.createElement)(_components.Button, {
     variant: "tertiary",
     onClick: onClose
-  }, (0, _i18n.__)('Cancel'))), (0, _element.createElement)(_components.FlexItem, null, (0, _element.createElement)(_components.Button, {
+  }, (0, _i18n.__)('Cancel'))), (0, _react.createElement)(_components.FlexItem, null, (0, _react.createElement)(_components.Button, {
     variant: "primary",
     onClick: onSubmit
   }, (0, _i18n.__)('Insert')))));
@@ -157,40 +158,40 @@ function MediaPreview({
   }
   const onMouseEnter = (0, _element.useCallback)(() => setIsHovered(true), []);
   const onMouseLeave = (0, _element.useCallback)(() => setIsHovered(false), []);
-  return (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)(_inserterDraggableBlocks.default, {
+  return (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)(_inserterDraggableBlocks.default, {
     isEnabled: true,
     blocks: [block]
   }, ({
     draggable,
     onDragStart,
     onDragEnd
-  }) => (0, _element.createElement)("div", {
+  }) => (0, _react.createElement)("div", {
     className: (0, _classnames.default)('block-editor-inserter__media-list__list-item', {
       'is-hovered': isHovered
     }),
     draggable: draggable,
     onDragStart: onDragStart,
     onDragEnd: onDragEnd
-  }, (0, _element.createElement)(_components.Tooltip, {
+  }, (0, _react.createElement)(_components.Tooltip, {
     text: truncatedTitle || title
-  }, (0, _element.createElement)("div", {
+  }, (0, _react.createElement)("div", {
     onMouseEnter: onMouseEnter,
     onMouseLeave: onMouseLeave
-  }, (0, _element.createElement)(_components.__unstableCompositeItem, {
+  }, (0, _react.createElement)(_components.__unstableCompositeItem, {
     role: "option",
     as: "div",
     ...composite,
     className: "block-editor-inserter__media-list__item",
     onClick: () => onMediaInsert(block),
     "aria-label": title
-  }, (0, _element.createElement)("div", {
+  }, (0, _react.createElement)("div", {
     className: "block-editor-inserter__media-list__item-preview"
-  }, preview, isInserting && (0, _element.createElement)("div", {
+  }, preview, isInserting && (0, _react.createElement)("div", {
     className: "block-editor-inserter__media-list__item-preview-spinner"
-  }, (0, _element.createElement)(_components.Spinner, null)))), !isInserting && (0, _element.createElement)(MediaPreviewOptions, {
+  }, (0, _react.createElement)(_components.Spinner, null)))), !isInserting && (0, _react.createElement)(MediaPreviewOptions, {
     category: category,
     media: media
-  }))))), showExternalUploadModal && (0, _element.createElement)(InsertExternalImageModal, {
+  }))))), showExternalUploadModal && (0, _react.createElement)(InsertExternalImageModal, {
     onClose: () => setShowExternalUploadModal(false),
     onSubmit: () => {
       onClick((0, _blocks.cloneBlock)(block));

package/build/components/inserter/media-tab/media-preview.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_components","_i18n","_blocks","_icons","_data","_notices","_blob","_inserterDraggableBlocks","_utils","_store","ALLOWED_MEDIA_TYPES","MAXIMUM_TITLE_LENGTH","MEDIA_OPTIONS_POPOVER_PROPS","position","className","MediaPreviewOptions","category","media","getReportUrl","reportUrl","createElement","DropdownMenu","label","__","popoverProps","icon","moreVertical","MenuGroup","MenuItem","onClick","window","open","focus","external","sprintf","mediaType","InsertExternalImageModal","onClose","onSubmit","Modal","title","onRequestClose","__experimentalVStack","spacing","Flex","justify","expanded","FlexItem","Button","variant","MediaPreview","composite","showExternalUploadModal","setShowExternalUploadModal","useState","isHovered","setIsHovered","isInserting","setIsInserting","block","preview","useMemo","getBlockAndPreviewFromMedia","createErrorNotice","createSuccessNotice","useDispatch","noticesStore","mediaUpload","useSelect","select","blockEditorStore","getSettings","onMediaInsert","useCallback","previewBlock","clonedBlock","cloneBlock","id","url","caption","attributes","fetch","then","response","blob","filesList","additionalData","onFileChange","img","isBlobURL","type","allowedTypes","onError","message","catch","rendered","truncatedTitle","length","omission","slice","onMouseEnter","onMouseLeave","Fragment","default","isEnabled","blocks","draggable","onDragStart","onDragEnd","classnames","Tooltip","text","__unstableCompositeItem","role","as","Spinner"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-preview.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__unstableCompositeItem as CompositeItem,\n\tTooltip,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\tSpinner,\n\tModal,\n\tFlex,\n\tFlexItem,\n\tButton,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useMemo, useCallback, useState } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { moreVertical, external } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { isBlobURL } from '@wordpress/blob';\n\n/**\n * Internal dependencies\n */\nimport InserterDraggableBlocks from '../../inserter-draggable-blocks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport { store as blockEditorStore } from '../../../store';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\nconst MAXIMUM_TITLE_LENGTH = 25;\nconst MEDIA_OPTIONS_POPOVER_PROPS = {\n\tposition: 'bottom left',\n\tclassName:\n\t\t'block-editor-inserter__media-list__item-preview-options__popover',\n};\n\nfunction MediaPreviewOptions( { category, media } ) {\n\tif ( ! category.getReportUrl ) {\n\t\treturn null;\n\t}\n\tconst reportUrl = category.getReportUrl( media );\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName=\"block-editor-inserter__media-list__item-preview-options\"\n\t\t\tlabel={ __( 'Options' ) }\n\t\t\tpopoverProps={ MEDIA_OPTIONS_POPOVER_PROPS }\n\t\t\ticon={ moreVertical }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<MenuGroup>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\twindow.open( reportUrl, '_blank' ).focus()\n\t\t\t\t\t\t}\n\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: The media type to report e.g: \"image\", \"video\", \"audio\" */\n\t\t\t\t\t\t\t__( 'Report %s' ),\n\t\t\t\t\t\t\tcategory.mediaType\n\t\t\t\t\t\t) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction InsertExternalImageModal( { onClose, onSubmit } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Insert external image' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\tclassName=\"block-editor-inserter-media-tab-media-preview-inserter-external-image-modal\"\n\t\t>\n\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</VStack>\n\t\t\t<Flex\n\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\tjustify=\"flex-end\"\n\t\t\t\texpanded={ false }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"tertiary\" onClick={ onClose }>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"primary\" onClick={ onSubmit }>\n\t\t\t\t\t\t{ __( 'Insert' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</Modal>\n\t);\n}\n\nexport function MediaPreview( { media, onClick, composite, category } ) {\n\tconst [ showExternalUploadModal, setShowExternalUploadModal ] =\n\t\tuseState( false );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ isInserting, setIsInserting ] = useState( false );\n\tconst [ block, preview ] = useMemo(\n\t\t() => getBlockAndPreviewFromMedia( media, category.mediaType ),\n\t\t[ media, category.mediaType ]\n\t);\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\tconst onMediaInsert = useCallback(\n\t\t( previewBlock ) => {\n\t\t\t// Prevent multiple uploads when we're in the process of inserting.\n\t\t\tif ( isInserting ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst clonedBlock = cloneBlock( previewBlock );\n\t\t\tconst { id, url, caption } = clonedBlock.attributes;\n\t\t\t// Media item already exists in library, so just insert it.\n\t\t\tif ( !! id ) {\n\t\t\t\tonClick( clonedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetIsInserting( true );\n\t\t\t// Media item does not exist in library, so try to upload it.\n\t\t\t// Fist fetch the image data. This may fail if the image host\n\t\t\t// doesn't allow CORS with the domain.\n\t\t\t// If this happens, we insert the image block using the external\n\t\t\t// URL and let the user know about the possible implications.\n\t\t\twindow\n\t\t\t\t.fetch( url )\n\t\t\t\t.then( ( response ) => response.blob() )\n\t\t\t\t.then( ( blob ) => {\n\t\t\t\t\tmediaUpload( {\n\t\t\t\t\t\tfilesList: [ blob ],\n\t\t\t\t\t\tadditionalData: { caption },\n\t\t\t\t\t\tonFileChange( [ img ] ) {\n\t\t\t\t\t\t\tif ( isBlobURL( img.url ) ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick( {\n\t\t\t\t\t\t\t\t...clonedBlock,\n\t\t\t\t\t\t\t\tattributes: {\n\t\t\t\t\t\t\t\t\t...clonedBlock.attributes,\n\t\t\t\t\t\t\t\t\tid: img.id,\n\t\t\t\t\t\t\t\t\turl: img.url,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\t\t__( 'Image uploaded and inserted.' ),\n\t\t\t\t\t\t\t\t{ type: 'snackbar' }\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t\t.catch( () => {\n\t\t\t\t\tsetShowExternalUploadModal( true );\n\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tisInserting,\n\t\t\tonClick,\n\t\t\tmediaUpload,\n\t\t\tcreateErrorNotice,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\tconst title = media.title?.rendered || media.title;\n\tlet truncatedTitle;\n\tif ( title.length > MAXIMUM_TITLE_LENGTH ) {\n\t\tconst omission = '...';\n\t\ttruncatedTitle =\n\t\t\ttitle.slice( 0, MAXIMUM_TITLE_LENGTH - omission.length ) + omission;\n\t}\n\tconst onMouseEnter = useCallback( () => setIsHovered( true ), [] );\n\tconst onMouseLeave = useCallback( () => setIsHovered( false ), [] );\n\treturn (\n\t\t<>\n\t\t\t<InserterDraggableBlocks isEnabled={ true } blocks={ [ block ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'block-editor-inserter__media-list__list-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Tooltip text={ truncatedTitle || title }>\n\t\t\t\t\t\t\t{ /* Adding `is-hovered` class to the wrapper element is needed\n\t\t\t\t\t\t\tbecause the options Popover is rendered outside of this node. */ }\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\t\t\t\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-list__item\"\n\t\t\t\t\t\t\t\t\tonClick={ () => onMediaInsert( block ) }\n\t\t\t\t\t\t\t\t\taria-label={ title }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview\">\n\t\t\t\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t\t\t\t{ isInserting && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview-spinner\">\n\t\t\t\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CompositeItem>\n\t\t\t\t\t\t\t\t{ ! isInserting && (\n\t\t\t\t\t\t\t\t\t<MediaPreviewOptions\n\t\t\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\t\t\tmedia={ media }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</InserterDraggableBlocks>\n\t\t\t{ showExternalUploadModal && (\n\t\t\t\t<InsertExternalImageModal\n\t\t\t\t\tonClose={ () => setShowExternalUploadModal( false ) }\n\t\t\t\t\tonSubmit={ () => {\n\t\t\t\t\t\tonClick( cloneBlock( block ) );\n\t\t\t\t\t\tcreateSuccessNotice( __( 'Image inserted.' ), {\n\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetShowExternalUploadModal( false );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_components","_i18n","_element","_blocks","_icons","_data","_notices","_blob","_inserterDraggableBlocks","_utils","_store","ALLOWED_MEDIA_TYPES","MAXIMUM_TITLE_LENGTH","MEDIA_OPTIONS_POPOVER_PROPS","position","className","MediaPreviewOptions","category","media","getReportUrl","reportUrl","_react","createElement","DropdownMenu","label","__","popoverProps","icon","moreVertical","MenuGroup","MenuItem","onClick","window","open","focus","external","sprintf","mediaType","InsertExternalImageModal","onClose","onSubmit","Modal","title","onRequestClose","__experimentalVStack","spacing","Flex","justify","expanded","FlexItem","Button","variant","MediaPreview","composite","showExternalUploadModal","setShowExternalUploadModal","useState","isHovered","setIsHovered","isInserting","setIsInserting","block","preview","useMemo","getBlockAndPreviewFromMedia","createErrorNotice","createSuccessNotice","useDispatch","noticesStore","mediaUpload","useSelect","select","blockEditorStore","getSettings","onMediaInsert","useCallback","previewBlock","clonedBlock","cloneBlock","id","url","caption","attributes","fetch","then","response","blob","filesList","additionalData","onFileChange","img","isBlobURL","type","allowedTypes","onError","message","catch","rendered","truncatedTitle","length","omission","slice","onMouseEnter","onMouseLeave","Fragment","default","isEnabled","blocks","draggable","onDragStart","onDragEnd","classnames","Tooltip","text","__unstableCompositeItem","role","as","Spinner"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-preview.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classnames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport {\n\t__unstableCompositeItem as CompositeItem,\n\tTooltip,\n\tDropdownMenu,\n\tMenuGroup,\n\tMenuItem,\n\tSpinner,\n\tModal,\n\tFlex,\n\tFlexItem,\n\tButton,\n\t__experimentalVStack as VStack,\n} from '@wordpress/components';\nimport { __, sprintf } from '@wordpress/i18n';\nimport { useMemo, useCallback, useState } from '@wordpress/element';\nimport { cloneBlock } from '@wordpress/blocks';\nimport { moreVertical, external } from '@wordpress/icons';\nimport { useSelect, useDispatch } from '@wordpress/data';\nimport { store as noticesStore } from '@wordpress/notices';\nimport { isBlobURL } from '@wordpress/blob';\n\n/**\n * Internal dependencies\n */\nimport InserterDraggableBlocks from '../../inserter-draggable-blocks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport { store as blockEditorStore } from '../../../store';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image' ];\nconst MAXIMUM_TITLE_LENGTH = 25;\nconst MEDIA_OPTIONS_POPOVER_PROPS = {\n\tposition: 'bottom left',\n\tclassName:\n\t\t'block-editor-inserter__media-list__item-preview-options__popover',\n};\n\nfunction MediaPreviewOptions( { category, media } ) {\n\tif ( ! category.getReportUrl ) {\n\t\treturn null;\n\t}\n\tconst reportUrl = category.getReportUrl( media );\n\treturn (\n\t\t<DropdownMenu\n\t\t\tclassName=\"block-editor-inserter__media-list__item-preview-options\"\n\t\t\tlabel={ __( 'Options' ) }\n\t\t\tpopoverProps={ MEDIA_OPTIONS_POPOVER_PROPS }\n\t\t\ticon={ moreVertical }\n\t\t>\n\t\t\t{ () => (\n\t\t\t\t<MenuGroup>\n\t\t\t\t\t<MenuItem\n\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\twindow.open( reportUrl, '_blank' ).focus()\n\t\t\t\t\t\t}\n\t\t\t\t\t\ticon={ external }\n\t\t\t\t\t>\n\t\t\t\t\t\t{ sprintf(\n\t\t\t\t\t\t\t/* translators: %s: The media type to report e.g: \"image\", \"video\", \"audio\" */\n\t\t\t\t\t\t\t__( 'Report %s' ),\n\t\t\t\t\t\t\tcategory.mediaType\n\t\t\t\t\t\t) }\n\t\t\t\t\t</MenuItem>\n\t\t\t\t</MenuGroup>\n\t\t\t) }\n\t\t</DropdownMenu>\n\t);\n}\n\nfunction InsertExternalImageModal( { onClose, onSubmit } ) {\n\treturn (\n\t\t<Modal\n\t\t\ttitle={ __( 'Insert external image' ) }\n\t\t\tonRequestClose={ onClose }\n\t\t\tclassName=\"block-editor-inserter-media-tab-media-preview-inserter-external-image-modal\"\n\t\t>\n\t\t\t<VStack spacing={ 3 }>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'This image cannot be uploaded to your Media Library, but it can still be inserted as an external image.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t\t<p>\n\t\t\t\t\t{ __(\n\t\t\t\t\t\t'External images can be removed by the external provider without warning and could even have legal compliance issues related to privacy legislation.'\n\t\t\t\t\t) }\n\t\t\t\t</p>\n\t\t\t</VStack>\n\t\t\t<Flex\n\t\t\t\tclassName=\"block-editor-block-lock-modal__actions\"\n\t\t\t\tjustify=\"flex-end\"\n\t\t\t\texpanded={ false }\n\t\t\t>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"tertiary\" onClick={ onClose }>\n\t\t\t\t\t\t{ __( 'Cancel' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t\t<FlexItem>\n\t\t\t\t\t<Button variant=\"primary\" onClick={ onSubmit }>\n\t\t\t\t\t\t{ __( 'Insert' ) }\n\t\t\t\t\t</Button>\n\t\t\t\t</FlexItem>\n\t\t\t</Flex>\n\t\t</Modal>\n\t);\n}\n\nexport function MediaPreview( { media, onClick, composite, category } ) {\n\tconst [ showExternalUploadModal, setShowExternalUploadModal ] =\n\t\tuseState( false );\n\tconst [ isHovered, setIsHovered ] = useState( false );\n\tconst [ isInserting, setIsInserting ] = useState( false );\n\tconst [ block, preview ] = useMemo(\n\t\t() => getBlockAndPreviewFromMedia( media, category.mediaType ),\n\t\t[ media, category.mediaType ]\n\t);\n\tconst { createErrorNotice, createSuccessNotice } =\n\t\tuseDispatch( noticesStore );\n\tconst mediaUpload = useSelect(\n\t\t( select ) => select( blockEditorStore ).getSettings().mediaUpload,\n\t\t[]\n\t);\n\tconst onMediaInsert = useCallback(\n\t\t( previewBlock ) => {\n\t\t\t// Prevent multiple uploads when we're in the process of inserting.\n\t\t\tif ( isInserting ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst clonedBlock = cloneBlock( previewBlock );\n\t\t\tconst { id, url, caption } = clonedBlock.attributes;\n\t\t\t// Media item already exists in library, so just insert it.\n\t\t\tif ( !! id ) {\n\t\t\t\tonClick( clonedBlock );\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tsetIsInserting( true );\n\t\t\t// Media item does not exist in library, so try to upload it.\n\t\t\t// Fist fetch the image data. This may fail if the image host\n\t\t\t// doesn't allow CORS with the domain.\n\t\t\t// If this happens, we insert the image block using the external\n\t\t\t// URL and let the user know about the possible implications.\n\t\t\twindow\n\t\t\t\t.fetch( url )\n\t\t\t\t.then( ( response ) => response.blob() )\n\t\t\t\t.then( ( blob ) => {\n\t\t\t\t\tmediaUpload( {\n\t\t\t\t\t\tfilesList: [ blob ],\n\t\t\t\t\t\tadditionalData: { caption },\n\t\t\t\t\t\tonFileChange( [ img ] ) {\n\t\t\t\t\t\t\tif ( isBlobURL( img.url ) ) {\n\t\t\t\t\t\t\t\treturn;\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\tonClick( {\n\t\t\t\t\t\t\t\t...clonedBlock,\n\t\t\t\t\t\t\t\tattributes: {\n\t\t\t\t\t\t\t\t\t...clonedBlock.attributes,\n\t\t\t\t\t\t\t\t\tid: img.id,\n\t\t\t\t\t\t\t\t\turl: img.url,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t} );\n\t\t\t\t\t\t\tcreateSuccessNotice(\n\t\t\t\t\t\t\t\t__( 'Image uploaded and inserted.' ),\n\t\t\t\t\t\t\t\t{ type: 'snackbar' }\n\t\t\t\t\t\t\t);\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t\tallowedTypes: ALLOWED_MEDIA_TYPES,\n\t\t\t\t\t\tonError( message ) {\n\t\t\t\t\t\t\tcreateErrorNotice( message, { type: 'snackbar' } );\n\t\t\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t\t\t},\n\t\t\t\t\t} );\n\t\t\t\t} )\n\t\t\t\t.catch( () => {\n\t\t\t\t\tsetShowExternalUploadModal( true );\n\t\t\t\t\tsetIsInserting( false );\n\t\t\t\t} );\n\t\t},\n\t\t[\n\t\t\tisInserting,\n\t\t\tonClick,\n\t\t\tmediaUpload,\n\t\t\tcreateErrorNotice,\n\t\t\tcreateSuccessNotice,\n\t\t]\n\t);\n\tconst title = media.title?.rendered || media.title;\n\tlet truncatedTitle;\n\tif ( title.length > MAXIMUM_TITLE_LENGTH ) {\n\t\tconst omission = '...';\n\t\ttruncatedTitle =\n\t\t\ttitle.slice( 0, MAXIMUM_TITLE_LENGTH - omission.length ) + omission;\n\t}\n\tconst onMouseEnter = useCallback( () => setIsHovered( true ), [] );\n\tconst onMouseLeave = useCallback( () => setIsHovered( false ), [] );\n\treturn (\n\t\t<>\n\t\t\t<InserterDraggableBlocks isEnabled={ true } blocks={ [ block ] }>\n\t\t\t\t{ ( { draggable, onDragStart, onDragEnd } ) => (\n\t\t\t\t\t<div\n\t\t\t\t\t\tclassName={ classnames(\n\t\t\t\t\t\t\t'block-editor-inserter__media-list__list-item',\n\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t'is-hovered': isHovered,\n\t\t\t\t\t\t\t}\n\t\t\t\t\t\t) }\n\t\t\t\t\t\tdraggable={ draggable }\n\t\t\t\t\t\tonDragStart={ onDragStart }\n\t\t\t\t\t\tonDragEnd={ onDragEnd }\n\t\t\t\t\t>\n\t\t\t\t\t\t<Tooltip text={ truncatedTitle || title }>\n\t\t\t\t\t\t\t{ /* Adding `is-hovered` class to the wrapper element is needed\n\t\t\t\t\t\t\tbecause the options Popover is rendered outside of this node. */ }\n\t\t\t\t\t\t\t<div\n\t\t\t\t\t\t\t\tonMouseEnter={ onMouseEnter }\n\t\t\t\t\t\t\t\tonMouseLeave={ onMouseLeave }\n\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t<CompositeItem\n\t\t\t\t\t\t\t\t\trole=\"option\"\n\t\t\t\t\t\t\t\t\tas=\"div\"\n\t\t\t\t\t\t\t\t\t{ ...composite }\n\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-list__item\"\n\t\t\t\t\t\t\t\t\tonClick={ () => onMediaInsert( block ) }\n\t\t\t\t\t\t\t\t\taria-label={ title }\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview\">\n\t\t\t\t\t\t\t\t\t\t{ preview }\n\t\t\t\t\t\t\t\t\t\t{ isInserting && (\n\t\t\t\t\t\t\t\t\t\t\t<div className=\"block-editor-inserter__media-list__item-preview-spinner\">\n\t\t\t\t\t\t\t\t\t\t\t\t<Spinner />\n\t\t\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t\t\t</CompositeItem>\n\t\t\t\t\t\t\t\t{ ! isInserting && (\n\t\t\t\t\t\t\t\t\t<MediaPreviewOptions\n\t\t\t\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t\t\t\t\tmedia={ media }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</Tooltip>\n\t\t\t\t\t</div>\n\t\t\t\t) }\n\t\t\t</InserterDraggableBlocks>\n\t\t\t{ showExternalUploadModal && (\n\t\t\t\t<InsertExternalImageModal\n\t\t\t\t\tonClose={ () => setShowExternalUploadModal( false ) }\n\t\t\t\t\tonSubmit={ () => {\n\t\t\t\t\t\tonClick( cloneBlock( block ) );\n\t\t\t\t\t\tcreateSuccessNotice( __( 'Image inserted.' ), {\n\t\t\t\t\t\t\ttype: 'snackbar',\n\t\t\t\t\t\t} );\n\t\t\t\t\t\tsetShowExternalUploadModal( false );\n\t\t\t\t\t} }\n\t\t\t\t/>\n\t\t\t) }\n\t\t</>\n\t);\n}\n"],"mappings":"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"}

package/build/components/inserter/media-tab/media-tab.js

@@ -5,11 +5,12 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
 var _i18n = require("@wordpress/i18n");
 var _compose = require("@wordpress/compose");
 var _components = require("@wordpress/components");
+var _element = require("@wordpress/element");
 var _icons = require("@wordpress/icons");
 var _mediaPanel = require("./media-panel");
 var _check = _interopRequireDefault(require("../../media-upload/check"));
@@ -50,14 +51,14 @@ function MediaTab({
     ...mediaCategory,
     label: mediaCategory.labels.name
   })), [mediaCategories]);
-  return (0, _element.createElement)(_element.Fragment, null, !isMobile && (0, _element.createElement)("div", {
+  return (0, _react.createElement)(_react.Fragment, null, !isMobile && (0, _react.createElement)("div", {
     className: `${baseCssClass}-container`
-  }, (0, _element.createElement)("nav", {
+  }, (0, _react.createElement)("nav", {
     "aria-label": (0, _i18n.__)('Media categories')
-  }, (0, _element.createElement)(_components.__experimentalItemGroup, {
+  }, (0, _react.createElement)(_components.__experimentalItemGroup, {
     role: "list",
     className: baseCssClass
-  }, mediaCategories.map(mediaCategory => (0, _element.createElement)(_components.__experimentalItem, {
+  }, mediaCategories.map(mediaCategory => (0, _react.createElement)(_components.__experimentalItem, {
     role: "listitem",
     key: mediaCategory.name,
     onClick: () => onSelectCategory(mediaCategory),
@@ -66,17 +67,17 @@ function MediaTab({
     }),
     "aria-label": mediaCategory.labels.name,
     "aria-current": mediaCategory === selectedCategory ? 'true' : undefined
-  }, (0, _element.createElement)(_components.__experimentalHStack, null, (0, _element.createElement)(_components.FlexBlock, null, mediaCategory.labels.name), (0, _element.createElement)(_icons.Icon, {
+  }, (0, _react.createElement)(_components.__experimentalHStack, null, (0, _react.createElement)(_components.FlexBlock, null, mediaCategory.labels.name), (0, _react.createElement)(_icons.Icon, {
     icon: (0, _i18n.isRTL)() ? _icons.chevronLeft : _icons.chevronRight
-  })))), (0, _element.createElement)("div", {
+  })))), (0, _react.createElement)("div", {
     role: "listitem"
-  }, (0, _element.createElement)(_check.default, null, (0, _element.createElement)(_mediaUpload.default, {
+  }, (0, _react.createElement)(_check.default, null, (0, _react.createElement)(_mediaUpload.default, {
     multiple: false,
     onSelect: onSelectMedia,
     allowedTypes: ALLOWED_MEDIA_TYPES,
     render: ({
       open
-    }) => (0, _element.createElement)(_components.Button, {
+    }) => (0, _react.createElement)(_components.Button, {
       onClick: event => {
         // Safari doesn't emit a focus event on button elements when
         // clicked and we need to manually focus the button here.
@@ -91,9 +92,9 @@ function MediaTab({
       variant: "secondary",
       "data-unstable-ignore-focus-outside-for-relatedtarget": ".media-modal"
     }, (0, _i18n.__)('Open Media Library'))
-  })))))), isMobile && (0, _element.createElement)(_mobileTabNavigation.default, {
+  })))))), isMobile && (0, _react.createElement)(_mobileTabNavigation.default, {
     categories: mobileMediaCategories
-  }, category => (0, _element.createElement)(_mediaPanel.MediaCategoryPanel, {
+  }, category => (0, _react.createElement)(_mediaPanel.MediaCategoryPanel, {
     onInsert: onInsert,
     rootClientId: rootClientId,
     category: category

package/build/components/inserter/media-tab/media-tab.js.map

@@ -1 +1 @@
-{"version":3,"names":["_element","require","_classnames","_interopRequireDefault","_i18n","_compose","_components","_icons","_mediaPanel","_check","_mediaUpload","_hooks","_utils","_mobileTabNavigation","ALLOWED_MEDIA_TYPES","MediaTab","rootClientId","selectedCategory","onSelectCategory","onInsert","mediaCategories","useMediaCategories","isMobile","useViewportMatch","baseCssClass","onSelectMedia","useCallback","media","url","block","getBlockAndPreviewFromMedia","type","mobileMediaCategories","useMemo","map","mediaCategory","label","labels","name","createElement","Fragment","className","__","__experimentalItemGroup","role","__experimentalItem","key","onClick","classNames","undefined","__experimentalHStack","FlexBlock","Icon","icon","isRTL","chevronLeft","chevronRight","default","multiple","onSelect","allowedTypes","render","open","Button","event","target","focus","variant","categories","category","MediaCategoryPanel","_default","exports"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-tab.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n\t__experimentalHStack as HStack,\n\tFlexBlock,\n\tButton,\n} from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { Icon, chevronRight, chevronLeft } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { MediaCategoryPanel } from './media-panel';\nimport MediaUploadCheck from '../../media-upload/check';\nimport MediaUpload from '../../media-upload';\nimport { useMediaCategories } from './hooks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport MobileTabNavigation from '../mobile-tab-navigation';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image', 'video', 'audio' ];\n\nfunction MediaTab( {\n\trootClientId,\n\tselectedCategory,\n\tonSelectCategory,\n\tonInsert,\n} ) {\n\tconst mediaCategories = useMediaCategories( rootClientId );\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\tconst baseCssClass = 'block-editor-inserter__media-tabs';\n\tconst onSelectMedia = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media?.url ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst [ block ] = getBlockAndPreviewFromMedia( media, media.type );\n\t\t\tonInsert( block );\n\t\t},\n\t\t[ onInsert ]\n\t);\n\tconst mobileMediaCategories = useMemo(\n\t\t() =>\n\t\t\tmediaCategories.map( ( mediaCategory ) => ( {\n\t\t\t\t...mediaCategory,\n\t\t\t\tlabel: mediaCategory.labels.name,\n\t\t\t} ) ),\n\t\t[ mediaCategories ]\n\t);\n\treturn (\n\t\t<>\n\t\t\t{ ! isMobile && (\n\t\t\t\t<div className={ `${ baseCssClass }-container` }>\n\t\t\t\t\t<nav aria-label={ __( 'Media categories' ) }>\n\t\t\t\t\t\t<ItemGroup role=\"list\" className={ baseCssClass }>\n\t\t\t\t\t\t\t{ mediaCategories.map( ( mediaCategory ) => (\n\t\t\t\t\t\t\t\t<Item\n\t\t\t\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\t\t\t\tkey={ mediaCategory.name }\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\tonSelectCategory( mediaCategory )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ classNames(\n\t\t\t\t\t\t\t\t\t\t`${ baseCssClass }__media-category`,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-selected':\n\t\t\t\t\t\t\t\t\t\t\t\tselectedCategory ===\n\t\t\t\t\t\t\t\t\t\t\t\tmediaCategory,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\taria-label={ mediaCategory.labels.name }\n\t\t\t\t\t\t\t\t\taria-current={\n\t\t\t\t\t\t\t\t\t\tmediaCategory === selectedCategory\n\t\t\t\t\t\t\t\t\t\t\t? 'true'\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t\t\t\t\t{ mediaCategory.labels.name }\n\t\t\t\t\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\tisRTL()\n\t\t\t\t\t\t\t\t\t\t\t\t\t? chevronLeft\n\t\t\t\t\t\t\t\t\t\t\t\t\t: chevronRight\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t</Item>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t<div role=\"listitem\">\n\t\t\t\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\t\t\tmultiple={ false }\n\t\t\t\t\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t// Safari doesn't emit a focus event on button elements when\n\t\t\t\t\t\t\t\t\t\t\t\t\t// clicked and we need to manually focus the button here.\n\t\t\t\t\t\t\t\t\t\t\t\t\t// The reason is that core's Media Library modal explicitly triggers a\n\t\t\t\t\t\t\t\t\t\t\t\t\t// focus event and therefore a `blur` event is triggered on a different\n\t\t\t\t\t\t\t\t\t\t\t\t\t// element, which doesn't contain the `data-unstable-ignore-focus-outside-for-relatedtarget`\n\t\t\t\t\t\t\t\t\t\t\t\t\t// attribute making the Inserter dialog to close.\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent.target.focus();\n\t\t\t\t\t\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-library-button\"\n\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\t\t\tdata-unstable-ignore-focus-outside-for-relatedtarget=\".media-modal\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Open Media Library' ) }\n\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</nav>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ isMobile && (\n\t\t\t\t<MobileTabNavigation categories={ mobileMediaCategories }>\n\t\t\t\t\t{ ( category ) => (\n\t\t\t\t\t\t<MediaCategoryPanel\n\t\t\t\t\t\t\tonInsert={ onInsert }\n\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</MobileTabNavigation>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default MediaTab;\n"],"mappings":"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"}
+{"version":3,"names":["_classnames","_interopRequireDefault","require","_i18n","_compose","_components","_element","_icons","_mediaPanel","_check","_mediaUpload","_hooks","_utils","_mobileTabNavigation","ALLOWED_MEDIA_TYPES","MediaTab","rootClientId","selectedCategory","onSelectCategory","onInsert","mediaCategories","useMediaCategories","isMobile","useViewportMatch","baseCssClass","onSelectMedia","useCallback","media","url","block","getBlockAndPreviewFromMedia","type","mobileMediaCategories","useMemo","map","mediaCategory","label","labels","name","_react","createElement","Fragment","className","__","__experimentalItemGroup","role","__experimentalItem","key","onClick","classNames","undefined","__experimentalHStack","FlexBlock","Icon","icon","isRTL","chevronLeft","chevronRight","default","multiple","onSelect","allowedTypes","render","open","Button","event","target","focus","variant","categories","category","MediaCategoryPanel","_default","exports"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/media-tab.js"],"sourcesContent":["/**\n * External dependencies\n */\nimport classNames from 'classnames';\n\n/**\n * WordPress dependencies\n */\nimport { __, isRTL } from '@wordpress/i18n';\nimport { useViewportMatch } from '@wordpress/compose';\nimport {\n\t__experimentalItemGroup as ItemGroup,\n\t__experimentalItem as Item,\n\t__experimentalHStack as HStack,\n\tFlexBlock,\n\tButton,\n} from '@wordpress/components';\nimport { useCallback, useMemo } from '@wordpress/element';\nimport { Icon, chevronRight, chevronLeft } from '@wordpress/icons';\n\n/**\n * Internal dependencies\n */\nimport { MediaCategoryPanel } from './media-panel';\nimport MediaUploadCheck from '../../media-upload/check';\nimport MediaUpload from '../../media-upload';\nimport { useMediaCategories } from './hooks';\nimport { getBlockAndPreviewFromMedia } from './utils';\nimport MobileTabNavigation from '../mobile-tab-navigation';\n\nconst ALLOWED_MEDIA_TYPES = [ 'image', 'video', 'audio' ];\n\nfunction MediaTab( {\n\trootClientId,\n\tselectedCategory,\n\tonSelectCategory,\n\tonInsert,\n} ) {\n\tconst mediaCategories = useMediaCategories( rootClientId );\n\tconst isMobile = useViewportMatch( 'medium', '<' );\n\tconst baseCssClass = 'block-editor-inserter__media-tabs';\n\tconst onSelectMedia = useCallback(\n\t\t( media ) => {\n\t\t\tif ( ! media?.url ) {\n\t\t\t\treturn;\n\t\t\t}\n\t\t\tconst [ block ] = getBlockAndPreviewFromMedia( media, media.type );\n\t\t\tonInsert( block );\n\t\t},\n\t\t[ onInsert ]\n\t);\n\tconst mobileMediaCategories = useMemo(\n\t\t() =>\n\t\t\tmediaCategories.map( ( mediaCategory ) => ( {\n\t\t\t\t...mediaCategory,\n\t\t\t\tlabel: mediaCategory.labels.name,\n\t\t\t} ) ),\n\t\t[ mediaCategories ]\n\t);\n\treturn (\n\t\t<>\n\t\t\t{ ! isMobile && (\n\t\t\t\t<div className={ `${ baseCssClass }-container` }>\n\t\t\t\t\t<nav aria-label={ __( 'Media categories' ) }>\n\t\t\t\t\t\t<ItemGroup role=\"list\" className={ baseCssClass }>\n\t\t\t\t\t\t\t{ mediaCategories.map( ( mediaCategory ) => (\n\t\t\t\t\t\t\t\t<Item\n\t\t\t\t\t\t\t\t\trole=\"listitem\"\n\t\t\t\t\t\t\t\t\tkey={ mediaCategory.name }\n\t\t\t\t\t\t\t\t\tonClick={ () =>\n\t\t\t\t\t\t\t\t\t\tonSelectCategory( mediaCategory )\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\tclassName={ classNames(\n\t\t\t\t\t\t\t\t\t\t`${ baseCssClass }__media-category`,\n\t\t\t\t\t\t\t\t\t\t{\n\t\t\t\t\t\t\t\t\t\t\t'is-selected':\n\t\t\t\t\t\t\t\t\t\t\t\tselectedCategory ===\n\t\t\t\t\t\t\t\t\t\t\t\tmediaCategory,\n\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\taria-label={ mediaCategory.labels.name }\n\t\t\t\t\t\t\t\t\taria-current={\n\t\t\t\t\t\t\t\t\t\tmediaCategory === selectedCategory\n\t\t\t\t\t\t\t\t\t\t\t? 'true'\n\t\t\t\t\t\t\t\t\t\t\t: undefined\n\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t<HStack>\n\t\t\t\t\t\t\t\t\t\t<FlexBlock>\n\t\t\t\t\t\t\t\t\t\t\t{ mediaCategory.labels.name }\n\t\t\t\t\t\t\t\t\t\t</FlexBlock>\n\t\t\t\t\t\t\t\t\t\t<Icon\n\t\t\t\t\t\t\t\t\t\t\ticon={\n\t\t\t\t\t\t\t\t\t\t\t\tisRTL()\n\t\t\t\t\t\t\t\t\t\t\t\t\t? chevronLeft\n\t\t\t\t\t\t\t\t\t\t\t\t\t: chevronRight\n\t\t\t\t\t\t\t\t\t\t\t}\n\t\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t\t</HStack>\n\t\t\t\t\t\t\t\t</Item>\n\t\t\t\t\t\t\t) ) }\n\t\t\t\t\t\t\t<div role=\"listitem\">\n\t\t\t\t\t\t\t\t<MediaUploadCheck>\n\t\t\t\t\t\t\t\t\t<MediaUpload\n\t\t\t\t\t\t\t\t\t\tmultiple={ false }\n\t\t\t\t\t\t\t\t\t\tonSelect={ onSelectMedia }\n\t\t\t\t\t\t\t\t\t\tallowedTypes={ ALLOWED_MEDIA_TYPES }\n\t\t\t\t\t\t\t\t\t\trender={ ( { open } ) => (\n\t\t\t\t\t\t\t\t\t\t\t<Button\n\t\t\t\t\t\t\t\t\t\t\t\tonClick={ ( event ) => {\n\t\t\t\t\t\t\t\t\t\t\t\t\t// Safari doesn't emit a focus event on button elements when\n\t\t\t\t\t\t\t\t\t\t\t\t\t// clicked and we need to manually focus the button here.\n\t\t\t\t\t\t\t\t\t\t\t\t\t// The reason is that core's Media Library modal explicitly triggers a\n\t\t\t\t\t\t\t\t\t\t\t\t\t// focus event and therefore a `blur` event is triggered on a different\n\t\t\t\t\t\t\t\t\t\t\t\t\t// element, which doesn't contain the `data-unstable-ignore-focus-outside-for-relatedtarget`\n\t\t\t\t\t\t\t\t\t\t\t\t\t// attribute making the Inserter dialog to close.\n\t\t\t\t\t\t\t\t\t\t\t\t\tevent.target.focus();\n\t\t\t\t\t\t\t\t\t\t\t\t\topen();\n\t\t\t\t\t\t\t\t\t\t\t\t} }\n\t\t\t\t\t\t\t\t\t\t\t\tclassName=\"block-editor-inserter__media-library-button\"\n\t\t\t\t\t\t\t\t\t\t\t\tvariant=\"secondary\"\n\t\t\t\t\t\t\t\t\t\t\t\tdata-unstable-ignore-focus-outside-for-relatedtarget=\".media-modal\"\n\t\t\t\t\t\t\t\t\t\t\t>\n\t\t\t\t\t\t\t\t\t\t\t\t{ __( 'Open Media Library' ) }\n\t\t\t\t\t\t\t\t\t\t\t</Button>\n\t\t\t\t\t\t\t\t\t\t) }\n\t\t\t\t\t\t\t\t\t/>\n\t\t\t\t\t\t\t\t</MediaUploadCheck>\n\t\t\t\t\t\t\t</div>\n\t\t\t\t\t\t</ItemGroup>\n\t\t\t\t\t</nav>\n\t\t\t\t</div>\n\t\t\t) }\n\t\t\t{ isMobile && (\n\t\t\t\t<MobileTabNavigation categories={ mobileMediaCategories }>\n\t\t\t\t\t{ ( category ) => (\n\t\t\t\t\t\t<MediaCategoryPanel\n\t\t\t\t\t\t\tonInsert={ onInsert }\n\t\t\t\t\t\t\trootClientId={ rootClientId }\n\t\t\t\t\t\t\tcategory={ category }\n\t\t\t\t\t\t/>\n\t\t\t\t\t) }\n\t\t\t\t</MobileTabNavigation>\n\t\t\t) }\n\t\t</>\n\t);\n}\n\nexport default MediaTab;\n"],"mappings":"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"}

package/build/components/inserter/media-tab/utils.js

@@ -4,7 +4,7 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.getBlockAndPreviewFromMedia = getBlockAndPreviewFromMedia;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _blocks = require("@wordpress/blocks");
 /**
  * WordPress dependencies
@@ -40,7 +40,7 @@ function getBlockAndPreviewFromMedia(media, mediaType) {
     attributes.src = mediaSrc;
   }
   const PreviewTag = mediaTypeTag[mediaType];
-  const preview = (0, _element.createElement)(PreviewTag, {
+  const preview = (0, _react.createElement)(PreviewTag, {
     src: media.previewUrl || mediaSrc,
     alt: alt,
     controls: mediaType === 'audio' ? true : undefined,

package/build/components/inserter/media-tab/utils.js.map

@@ -1 +1 @@
-{"version":3,"names":["_blocks","require","mediaTypeTag","image","video","audio","getBlockAndPreviewFromMedia","media","mediaType","attributes","id","undefined","caption","mediaSrc","url","alt","includes","src","PreviewTag","preview","_element","createElement","previewUrl","controls","inert","onError","currentTarget","createBlock"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/utils.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createBlock } from '@wordpress/blocks';\n\nconst mediaTypeTag = { image: 'img', video: 'video', audio: 'audio' };\n\n/** @typedef {import('./hooks').InserterMediaItem} InserterMediaItem */\n\n/**\n * Creates a block and a preview element from a media object.\n *\n * @param {InserterMediaItem}         media     The media object to create the block from.\n * @param {('image'|'audio'|'video')} mediaType The media type to create the block for.\n * @return {[WPBlock, JSX.Element]} An array containing the block and the preview element.\n */\nexport function getBlockAndPreviewFromMedia( media, mediaType ) {\n\t// Add the common attributes between the different media types.\n\tconst attributes = {\n\t\tid: media.id || undefined,\n\t\tcaption: media.caption || undefined,\n\t};\n\tconst mediaSrc = media.url;\n\tconst alt = media.alt || undefined;\n\tif ( mediaType === 'image' ) {\n\t\tattributes.url = mediaSrc;\n\t\tattributes.alt = alt;\n\t} else if ( [ 'video', 'audio' ].includes( mediaType ) ) {\n\t\tattributes.src = mediaSrc;\n\t}\n\tconst PreviewTag = mediaTypeTag[ mediaType ];\n\tconst preview = (\n\t\t<PreviewTag\n\t\t\tsrc={ media.previewUrl || mediaSrc }\n\t\t\talt={ alt }\n\t\t\tcontrols={ mediaType === 'audio' ? true : undefined }\n\t\t\tinert=\"true\"\n\t\t\tonError={ ( { currentTarget } ) => {\n\t\t\t\t// Fall back to the media source if the preview cannot be loaded.\n\t\t\t\tif ( currentTarget.src === media.previewUrl ) {\n\t\t\t\t\tcurrentTarget.src = mediaSrc;\n\t\t\t\t}\n\t\t\t} }\n\t\t/>\n\t);\n\treturn [ createBlock( `core/${ mediaType }`, attributes ), preview ];\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGA,MAAMC,YAAY,GAAG;EAAEC,KAAK,EAAE,KAAK;EAAEC,KAAK,EAAE,OAAO;EAAEC,KAAK,EAAE;AAAQ,CAAC;;AAErE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,2BAA2BA,CAAEC,KAAK,EAAEC,SAAS,EAAG;EAC/D;EACA,MAAMC,UAAU,GAAG;IAClBC,EAAE,EAAEH,KAAK,CAACG,EAAE,IAAIC,SAAS;IACzBC,OAAO,EAAEL,KAAK,CAACK,OAAO,IAAID;EAC3B,CAAC;EACD,MAAME,QAAQ,GAAGN,KAAK,CAACO,GAAG;EAC1B,MAAMC,GAAG,GAAGR,KAAK,CAACQ,GAAG,IAAIJ,SAAS;EAClC,IAAKH,SAAS,KAAK,OAAO,EAAG;IAC5BC,UAAU,CAACK,GAAG,GAAGD,QAAQ;IACzBJ,UAAU,CAACM,GAAG,GAAGA,GAAG;EACrB,CAAC,MAAM,IAAK,CAAE,OAAO,EAAE,OAAO,CAAE,CAACC,QAAQ,CAAER,SAAU,CAAC,EAAG;IACxDC,UAAU,CAACQ,GAAG,GAAGJ,QAAQ;EAC1B;EACA,MAAMK,UAAU,GAAGhB,YAAY,CAAEM,SAAS,CAAE;EAC5C,MAAMW,OAAO,GACZ,IAAAC,QAAA,CAAAC,aAAA,EAACH,UAAU;IACVD,GAAG,EAAGV,KAAK,CAACe,UAAU,IAAIT,QAAU;IACpCE,GAAG,EAAGA,GAAK;IACXQ,QAAQ,EAAGf,SAAS,KAAK,OAAO,GAAG,IAAI,GAAGG,SAAW;IACrDa,KAAK,EAAC,MAAM;IACZC,OAAO,EAAGA,CAAE;MAAEC;IAAc,CAAC,KAAM;MAClC;MACA,IAAKA,aAAa,CAACT,GAAG,KAAKV,KAAK,CAACe,UAAU,EAAG;QAC7CI,aAAa,CAACT,GAAG,GAAGJ,QAAQ;MAC7B;IACD;EAAG,CACH,CACD;EACD,OAAO,CAAE,IAAAc,mBAAW,EAAG,QAAQnB,SAAW,EAAC,EAAEC,UAAW,CAAC,EAAEU,OAAO,CAAE;AACrE"}
+{"version":3,"names":["_blocks","require","mediaTypeTag","image","video","audio","getBlockAndPreviewFromMedia","media","mediaType","attributes","id","undefined","caption","mediaSrc","url","alt","includes","src","PreviewTag","preview","_react","createElement","previewUrl","controls","inert","onError","currentTarget","createBlock"],"sources":["@wordpress/block-editor/src/components/inserter/media-tab/utils.js"],"sourcesContent":["/**\n * WordPress dependencies\n */\nimport { createBlock } from '@wordpress/blocks';\n\nconst mediaTypeTag = { image: 'img', video: 'video', audio: 'audio' };\n\n/** @typedef {import('./hooks').InserterMediaItem} InserterMediaItem */\n\n/**\n * Creates a block and a preview element from a media object.\n *\n * @param {InserterMediaItem}         media     The media object to create the block from.\n * @param {('image'|'audio'|'video')} mediaType The media type to create the block for.\n * @return {[WPBlock, JSX.Element]} An array containing the block and the preview element.\n */\nexport function getBlockAndPreviewFromMedia( media, mediaType ) {\n\t// Add the common attributes between the different media types.\n\tconst attributes = {\n\t\tid: media.id || undefined,\n\t\tcaption: media.caption || undefined,\n\t};\n\tconst mediaSrc = media.url;\n\tconst alt = media.alt || undefined;\n\tif ( mediaType === 'image' ) {\n\t\tattributes.url = mediaSrc;\n\t\tattributes.alt = alt;\n\t} else if ( [ 'video', 'audio' ].includes( mediaType ) ) {\n\t\tattributes.src = mediaSrc;\n\t}\n\tconst PreviewTag = mediaTypeTag[ mediaType ];\n\tconst preview = (\n\t\t<PreviewTag\n\t\t\tsrc={ media.previewUrl || mediaSrc }\n\t\t\talt={ alt }\n\t\t\tcontrols={ mediaType === 'audio' ? true : undefined }\n\t\t\tinert=\"true\"\n\t\t\tonError={ ( { currentTarget } ) => {\n\t\t\t\t// Fall back to the media source if the preview cannot be loaded.\n\t\t\t\tif ( currentTarget.src === media.previewUrl ) {\n\t\t\t\t\tcurrentTarget.src = mediaSrc;\n\t\t\t\t}\n\t\t\t} }\n\t\t/>\n\t);\n\treturn [ createBlock( `core/${ mediaType }`, attributes ), preview ];\n}\n"],"mappings":";;;;;;;AAGA,IAAAA,OAAA,GAAAC,OAAA;AAHA;AACA;AACA;;AAGA,MAAMC,YAAY,GAAG;EAAEC,KAAK,EAAE,KAAK;EAAEC,KAAK,EAAE,OAAO;EAAEC,KAAK,EAAE;AAAQ,CAAC;;AAErE;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA;AACO,SAASC,2BAA2BA,CAAEC,KAAK,EAAEC,SAAS,EAAG;EAC/D;EACA,MAAMC,UAAU,GAAG;IAClBC,EAAE,EAAEH,KAAK,CAACG,EAAE,IAAIC,SAAS;IACzBC,OAAO,EAAEL,KAAK,CAACK,OAAO,IAAID;EAC3B,CAAC;EACD,MAAME,QAAQ,GAAGN,KAAK,CAACO,GAAG;EAC1B,MAAMC,GAAG,GAAGR,KAAK,CAACQ,GAAG,IAAIJ,SAAS;EAClC,IAAKH,SAAS,KAAK,OAAO,EAAG;IAC5BC,UAAU,CAACK,GAAG,GAAGD,QAAQ;IACzBJ,UAAU,CAACM,GAAG,GAAGA,GAAG;EACrB,CAAC,MAAM,IAAK,CAAE,OAAO,EAAE,OAAO,CAAE,CAACC,QAAQ,CAAER,SAAU,CAAC,EAAG;IACxDC,UAAU,CAACQ,GAAG,GAAGJ,QAAQ;EAC1B;EACA,MAAMK,UAAU,GAAGhB,YAAY,CAAEM,SAAS,CAAE;EAC5C,MAAMW,OAAO,GACZ,IAAAC,MAAA,CAAAC,aAAA,EAACH,UAAU;IACVD,GAAG,EAAGV,KAAK,CAACe,UAAU,IAAIT,QAAU;IACpCE,GAAG,EAAGA,GAAK;IACXQ,QAAQ,EAAGf,SAAS,KAAK,OAAO,GAAG,IAAI,GAAGG,SAAW;IACrDa,KAAK,EAAC,MAAM;IACZC,OAAO,EAAGA,CAAE;MAAEC;IAAc,CAAC,KAAM;MAClC;MACA,IAAKA,aAAa,CAACT,GAAG,KAAKV,KAAK,CAACe,UAAU,EAAG;QAC7CI,aAAa,CAACT,GAAG,GAAGJ,QAAQ;MAC7B;IACD;EAAG,CACH,CACD;EACD,OAAO,CAAE,IAAAc,mBAAW,EAAG,QAAQnB,SAAW,EAAC,EAAEC,UAAW,CAAC,EAAEU,OAAO,CAAE;AACrE"}

package/build/components/inserter/menu.js

@@ -5,8 +5,9 @@ Object.defineProperty(exports, "__esModule", {
   value: true
 });
 exports.default = void 0;
-var _element = require("@wordpress/element");
+var _react = require("react");
 var _classnames = _interopRequireDefault(require("classnames"));
+var _element = require("@wordpress/element");
 var _components = require("@wordpress/components");
 var _i18n = require("@wordpress/i18n");
 var _data = require("@wordpress/data");
@@ -100,25 +101,25 @@ function InserterMenu({
     setSelectedPatternCategory(patternCategory);
     setPatternFilter(filter);
   }, [setSelectedPatternCategory]);
-  const blocksTab = (0, _element.useMemo)(() => (0, _element.createElement)(_element.Fragment, null, (0, _element.createElement)("div", {
+  const blocksTab = (0, _element.useMemo)(() => (0, _react.createElement)(_react.Fragment, null, (0, _react.createElement)("div", {
     className: "block-editor-inserter__block-list"
-  }, (0, _element.createElement)(_blockTypesTab.default, {
+  }, (0, _react.createElement)(_blockTypesTab.default, {
     rootClientId: destinationRootClientId,
     onInsert: onInsert,
     onHover: onHover,
     showMostUsedBlocks: showMostUsedBlocks
-  })), showInserterHelpPanel && (0, _element.createElement)("div", {
+  })), showInserterHelpPanel && (0, _react.createElement)("div", {
     className: "block-editor-inserter__tips"
-  }, (0, _element.createElement)(_components.VisuallyHidden, {
+  }, (0, _react.createElement)(_components.VisuallyHidden, {
     as: "h2"
-  }, (0, _i18n.__)('A tip for using the block editor')), (0, _element.createElement)(_tips.default, null))), [destinationRootClientId, onInsert, onHover, showMostUsedBlocks, showInserterHelpPanel]);
-  const patternsTab = (0, _element.useMemo)(() => (0, _element.createElement)(_blockPatternsTab.default, {
+  }, (0, _i18n.__)('A tip for using the block editor')), (0, _react.createElement)(_tips.default, null))), [destinationRootClientId, onInsert, onHover, showMostUsedBlocks, showInserterHelpPanel]);
+  const patternsTab = (0, _element.useMemo)(() => (0, _react.createElement)(_blockPatternsTab.default, {
     rootClientId: destinationRootClientId,
     onInsert: onInsertPattern,
     onSelectCategory: onClickPatternCategory,
     selectedCategory: selectedPatternCategory
   }), [destinationRootClientId, onInsertPattern, onClickPatternCategory, selectedPatternCategory]);
-  const mediaTab = (0, _element.useMemo)(() => (0, _element.createElement)(_mediaTab.MediaTab, {
+  const mediaTab = (0, _element.useMemo)(() => (0, _react.createElement)(_mediaTab.MediaTab, {
     rootClientId: destinationRootClientId,
     selectedCategory: selectedMediaCategory,
     onSelectCategory: setSelectedMediaCategory,
@@ -149,13 +150,13 @@ function InserterMenu({
     }
     setSelectedTab(value);
   };
-  return (0, _element.createElement)("div", {
+  return (0, _react.createElement)("div", {
     className: "block-editor-inserter__menu"
-  }, (0, _element.createElement)("div", {
+  }, (0, _react.createElement)("div", {
     className: (0, _classnames.default)('block-editor-inserter__main-area', {
       'show-as-tabs': showAsTabs
     })
-  }, (0, _element.createElement)(_components.SearchControl, {
+  }, (0, _react.createElement)(_components.SearchControl, {
     __nextHasNoMarginBottom: true,
     className: "block-editor-inserter__search",
     onChange: value => {
@@ -166,9 +167,9 @@ function InserterMenu({
     label: (0, _i18n.__)('Search for blocks and patterns'),
     placeholder: (0, _i18n.__)('Search'),
     ref: searchRef
-  }), !!delayedFilterValue && (0, _element.createElement)("div", {
+  }), !!delayedFilterValue && (0, _react.createElement)("div", {
     className: "block-editor-inserter__no-tab-container"
-  }, (0, _element.createElement)(_searchResults.default, {
+  }, (0, _react.createElement)(_searchResults.default, {
     filterValue: delayedFilterValue,
     onSelect: onSelect,
     onHover: onHover,
@@ -179,21 +180,21 @@ function InserterMenu({
     __experimentalInsertionIndex: __experimentalInsertionIndex,
     showBlockDirectory: true,
     shouldFocusBlock: shouldFocusBlock
-  })), showAsTabs && (0, _element.createElement)(_tabs.default, {
+  })), showAsTabs && (0, _react.createElement)(_tabs.default, {
     showPatterns: showPatterns,
     showReusableBlocks: hasReusableBlocks,
     showMedia: showMedia,
     prioritizePatterns: prioritizePatterns,
     onSelect: handleSetSelectedTab
-  }, getCurrentTab), !delayedFilterValue && !showAsTabs && (0, _element.createElement)("div", {
+  }, getCurrentTab), !delayedFilterValue && !showAsTabs && (0, _react.createElement)("div", {
     className: "block-editor-inserter__no-tab-container"
-  }, blocksTab)), showMediaPanel && (0, _element.createElement)(_mediaTab.MediaCategoryDialog, {
+  }, blocksTab)), showMediaPanel && (0, _react.createElement)(_mediaTab.MediaCategoryDialog, {
     rootClientId: destinationRootClientId,
     onInsert: onInsert,
     category: selectedMediaCategory
-  }), showInserterHelpPanel && hoveredItem && (0, _element.createElement)(_previewPanel.default, {
+  }), showInserterHelpPanel && hoveredItem && (0, _react.createElement)(_previewPanel.default, {
     item: hoveredItem
-  }), showPatternPanel && (0, _element.createElement)(_blockPatternsTab.BlockPatternsCategoryDialog, {
+  }), showPatternPanel && (0, _react.createElement)(_blockPatternsTab.BlockPatternsCategoryDialog, {
     rootClientId: destinationRootClientId,
     onInsert: onInsertPattern,
     onHover: onHoverPattern,